@justeattakeaway/pie-cookie-banner 0.3.1 → 0.4.1

package/dist/index.d.ts

@@ -72,6 +72,14 @@ export declare class PieCookieBanner extends LitElement implements CookieBannerP
      * @param {any} detail
      */
     private _dispatchCookieBannerCustomEvent;
+    /**
+     * Hides the cookie banner and emits the necessary only event
+     */
+    private _onNecessaryOnly;
+    /**
+     * Hides the cookie banner and emits the accept all event
+     */
+    private _onAcceptAll;
     /**
      * Opens the manage preferences modal and emits an event letting users know
      */

package/dist/index.js

@@ -46,6 +46,10 @@ class s extends g {
         detail: t
       });
       this.dispatchEvent(n);
+    }, this._onNecessaryOnly = () => {
+      this._dispatchCookieBannerCustomEvent(u), this._isCookieBannerHidden = !0;
+    }, this._onAcceptAll = () => {
+      this._dispatchCookieBannerCustomEvent(v), this._isCookieBannerHidden = !0;
     }, this._openManagePreferencesModal = () => {
       this._isCookieBannerHidden = !0, this._dispatchCookieBannerCustomEvent(m), this._isModalOpen = !0;
     }, this._handleToggleStates = (e) => {
@@ -147,34 +151,30 @@ class s extends g {
                 <p>We use our own and third party cookies and other tech to enhance and personalise your user experience,
                 optimize analytics, and show ads with third parties
                 (read our <pie-link variant="inverse">Statement</pie-link>).
-                Necessary cookies are always set. Click <pie-link variant="inverse">Necessary only</pie-link>
-                to continue without accepting more. Click <pie-link variant="inverse">Manage preferences</pie-link>
-                to share your preferences or <pie-link variant="inverse">Accept all</pie-link>.</p>
+                Necessary cookies are always set. Click <pie-link data-test-id="body-necessary-only" tag="button" variant="inverse" @click="${this._onNecessaryOnly}">Necessary only</pie-link>
+                to continue without accepting more. Click <pie-link data-test-id="body-manage-prefs" tag="button" variant="inverse" @click="${this._openManagePreferencesModal}">Manage preferences</pie-link>
+                to share your preferences or <pie-link data-test-id="body-accept-all" tag="button" variant="inverse" @click="${this._onAcceptAll}">Accept all</pie-link>.</p>
             </div>
 
             <div class="c-cookieBanner-actions">
                 <pie-button
-                    data-test-id="accept-all"
-                    @click="${() => {
-      this._dispatchCookieBannerCustomEvent(v), this._isCookieBannerHidden = !0;
-    }}"
+                    data-test-id="actions-accept-all"
+                    @click="${this._onAcceptAll}"
                     variant="primary"
                     isFullWidth
                     size="small-expressive">
                     Accept all
                 </pie-button>
                 <pie-button
-                    data-test-id="necessary-only"
-                    @click="${() => {
-      this._dispatchCookieBannerCustomEvent(u), this._isCookieBannerHidden = !0;
-    }}"
+                    data-test-id="actions-necessary-only"
+                    @click="${this._onNecessaryOnly}"
                     variant="outline-inverse"
                     isFullWidth
                     size="small-expressive">
                     Necessary only
                 </pie-button>
                 <pie-link
-                    data-test-id="manage-prefs"
+                    data-test-id="actions-manage-prefs"
                     @click="${this._openManagePreferencesModal}"
                     tag="button"
                     variant="inverse"

package/dist/react.d.ts

@@ -81,6 +81,14 @@ declare class PieCookieBanner_2 extends LitElement implements CookieBannerProps
      * @param {any} detail
      */
     private _dispatchCookieBannerCustomEvent;
+    /**
+     * Hides the cookie banner and emits the necessary only event
+     */
+    private _onNecessaryOnly;
+    /**
+     * Hides the cookie banner and emits the accept all event
+     */
+    private _onAcceptAll;
     /**
      * Opens the manage preferences modal and emits an event letting users know
      */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-cookie-banner",
   "description": "PIE Design System Cookie Banner built using Web Components",
-  "version": "0.3.1",
+  "version": "0.4.1",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -32,12 +32,12 @@
     "@justeattakeaway/pie-button": "0.28.1",
     "@justeattakeaway/pie-components-config": "0.4.0",
     "@justeattakeaway/pie-icon-button": "0.14.1",
-    "@justeattakeaway/pie-link": "0.3.0",
-    "@justeattakeaway/pie-modal": "0.19.1",
-    "@justeattakeaway/pie-toggle-switch": "0.7.0"
+    "@justeattakeaway/pie-link": "0.5.0",
+    "@justeattakeaway/pie-modal": "0.22.0",
+    "@justeattakeaway/pie-toggle-switch": "0.10.0"
   },
   "dependencies": {
-    "@justeattakeaway/pie-webc-core": "0.8.0"
+    "@justeattakeaway/pie-webc-core": "0.9.0"
   },
   "volta": {
     "extends": "../../../package.json"

package/src/index.ts

@@ -91,6 +91,22 @@ export class PieCookieBanner extends LitElement implements CookieBannerProps {
         this.dispatchEvent(event);
     };
 
+    /**
+     * Hides the cookie banner and emits the necessary only event
+     */
+    private _onNecessaryOnly = () : void => {
+        this._dispatchCookieBannerCustomEvent(ON_COOKIE_BANNER_NECESSARY_ONLY);
+        this._isCookieBannerHidden = true;
+    };
+
+    /**
+     * Hides the cookie banner and emits the accept all event
+     */
+    private _onAcceptAll = () : void => {
+        this._dispatchCookieBannerCustomEvent(ON_COOKIE_BANNER_ACCEPT_ALL);
+        this._isCookieBannerHidden = true;
+    };
+
     /**
      * Opens the manage preferences modal and emits an event letting users know
      */
@@ -188,30 +204,30 @@ export class PieCookieBanner extends LitElement implements CookieBannerProps {
                 <p>We use our own and third party cookies and other tech to enhance and personalise your user experience,
                 optimize analytics, and show ads with third parties
                 (read our <pie-link variant="inverse">Statement</pie-link>).
-                Necessary cookies are always set. Click <pie-link variant="inverse">Necessary only</pie-link>
-                to continue without accepting more. Click <pie-link variant="inverse">Manage preferences</pie-link>
-                to share your preferences or <pie-link variant="inverse">Accept all</pie-link>.</p>
+                Necessary cookies are always set. Click <pie-link data-test-id="body-necessary-only" tag="button" variant="inverse" @click="${this._onNecessaryOnly}">Necessary only</pie-link>
+                to continue without accepting more. Click <pie-link data-test-id="body-manage-prefs" tag="button" variant="inverse" @click="${this._openManagePreferencesModal}">Manage preferences</pie-link>
+                to share your preferences or <pie-link data-test-id="body-accept-all" tag="button" variant="inverse" @click="${this._onAcceptAll}">Accept all</pie-link>.</p>
             </div>
 
             <div class="c-cookieBanner-actions">
                 <pie-button
-                    data-test-id="accept-all"
-                    @click="${() => { this._dispatchCookieBannerCustomEvent(ON_COOKIE_BANNER_ACCEPT_ALL); this._isCookieBannerHidden = true; }}"
+                    data-test-id="actions-accept-all"
+                    @click="${this._onAcceptAll}"
                     variant="primary"
                     isFullWidth
                     size="small-expressive">
                     Accept all
                 </pie-button>
                 <pie-button
-                    data-test-id="necessary-only"
-                    @click="${() => { this._dispatchCookieBannerCustomEvent(ON_COOKIE_BANNER_NECESSARY_ONLY); this._isCookieBannerHidden = true; }}"
+                    data-test-id="actions-necessary-only"
+                    @click="${this._onNecessaryOnly}"
                     variant="outline-inverse"
                     isFullWidth
                     size="small-expressive">
                     Necessary only
                 </pie-button>
                 <pie-link
-                    data-test-id="manage-prefs"
+                    data-test-id="actions-manage-prefs"
                     @click="${this._openManagePreferencesModal}"
                     tag="button"
                     variant="inverse"