beyonk-group / gdpr-cookie-consent-banner

A GDPR compliant cookie consent banner implementation
MIT License
248 stars 42 forks source link

Property for entire Config #53

Closed Alfagun74 closed 12 months ago

Alfagun74 commented 1 year ago

Instead of assigning properties individually to each configuration property, I want to group these properties into an object that can be applied collectively. This simplifies the process, especially for other languages. I want:

<script>
const props = {
  cookieName: 'beyonk_gdpr',
  cookieConfig: {
    domain: 'example.com',
    path: '/'
  },
  heading: 'GDPR Notice',
  description: 'We use cookies to offer a better browsing experience, analyze site traffic, personalize content, and serve targeted advertisements. Please review our <a href="/privacy-policy">privacy policy page</a>. By clicking accept, you consent to our privacy policy & use of cookies.',
  acceptLabel: 'Confirm all',
  rejectLabel: 'Reject all',
  settingsLabel: 'Preferences',
  closeLabel: 'Close window',
  editLabel: 'Edit settings',
  choices: {
      necessary: {
          label: "Necessary cookies",
          description: "Used for cookie control. Can't be turned off.",
          value: true
      },
      tracking: {
          label: "Tracking cookies",
          description: "Used for advertising purposes.",
          value: true
      },
      analytics: {
          label: "Analytics cookies",
          description: "Used to control Google Analytics, a 3rd party tool offered by Google to track user behavior.",
          value: true
      },
      marketing: {
          label: "Marketing cookies",
          description: "Used for marketing data.",
          value: true
      }
  },
  showEditIcon: true,
  categories: {
    analytics: function() {
      console.log('No analytics cookies specified')
    },
    tracking: function() {
      console.log('No tracking cookies specified')
    },
    marketing: function() {
      console.log('No marketing cookies specified')
    },
    necessary: function() {
      console.log('No necessary cookies specified')
    }
  }
}
</script>
<GdprBanner {props} />

instead of:

[...]
<GdprBanner
  choices={props.choices}
  editLabel={props.editLabel}
  closeLabel={props.closeLabel}
  settingsLabel={props.settingsLabel}
  rejectLabel={props.rejectLabel}
  acceptLabel={props.acceptLabel}
  description={props.description}
  heading={props.heading}
  on:analytics={initAnalytics} />
antony commented 12 months ago

Hi @Alfagun74,

you can already do this thanks to Svelte, just do <GdprBanner {...props}>