@oslokommune/punkt-elements 13.5.0 → 13.5.1

package/CHANGELOG.md

@@ -5,6 +5,23 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
 
 ---
 
+## [13.5.1](https://github.com/oslokommune/punkt/compare/13.5.0...13.5.1) (2025-09-08)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+Ingen
+
+### Bug Fixes
+Ingen
+
+### Chores
+Ingen
+
+---
+
+
 ## [13.5.0](https://github.com/oslokommune/punkt/compare/13.4.2...13.5.0) (2025-09-05)
 
 ### ⚠ BREAKING CHANGES

package/dist/{card-Dtw26f7i.js → card-BDz4RWxK.js}

@@ -5,7 +5,7 @@ import { P as $ } from "./pkt-slot-controller-BPGj-LC5.js";
 import { e as y, n as _ } from "./ref-BBYSqgeW.js";
 import "./icon-CC1js8eR.js";
 import "./tag-DyXzTY68.js";
-import "./heading-D6jXE_Mz.js";
+import "./heading-Bdh9absf.js";
 const b = {
   layout: {
     default: "vertical"

package/dist/{card-BUITGoqX.cjs → card-DBlFf1ry.cjs}

@@ -1,4 +1,4 @@
-"use strict";const p=require("./class-map-BBG2gMX4.cjs"),h=require("./if-defined-Cni-RHLS.cjs"),t=require("./element-6DBpyGQm.cjs"),g=require("./pkt-slot-controller-BzddBp7z.cjs"),c=require("./ref-iJtiv3o2.cjs");require("./icon-B_ryAy4Q.cjs");require("./tag-Bbs0U_Au.cjs");require("./heading-BRE_iFtR.cjs");const k={layout:{default:"vertical"},skin:{type:["outlined","outlined-beige","gray","blue","beige","green"],default:"outlined"},padding:{default:"default"}},o={props:k};var u=Object.defineProperty,m=Object.getOwnPropertyDescriptor,e=(i,a,s,n)=>{for(var r=n>1?void 0:n?m(a,s):a,d=i.length-1,l;d>=0;d--)(l=i[d])&&(r=(n?l(a,s,r):l(r))||r);return n&&r&&u(a,s,r),r};exports.PktCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.ariaLabel="",this.metaLead=null,this.borderOnHover=!0,this.clickCardLink=null,this.metaTrail=null,this.layout=o.props.layout.default,this.heading="",this.headinglevel=3,this.image={src:"",alt:""},this.imageShape="square",this.openLinkInNewTab=!1,this.padding=o.props.padding.default,this.skin=o.props.skin.default,this.subheading="",this.tagPosition="top",this.tags=[],this.slotController=new g.PktSlotController(this,this.defaultSlot)}connectedCallback(){super.connectedCallback()}render(){var r,d;const a={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.layout}`]:this.layout,[`pkt-card--padding-${this.padding}`]:this.padding,"pkt-card--border-on-hover":this.borderOnHover},s=((r=this.ariaLabel)==null?void 0:r.trim())||(this.heading?`${this.heading} lenkekort`:"lenkekort"),n=((d=this.ariaLabel)==null?void 0:d.trim())||(this.heading?this.heading:"kort");return t.x`
+"use strict";const p=require("./class-map-BBG2gMX4.cjs"),h=require("./if-defined-Cni-RHLS.cjs"),t=require("./element-6DBpyGQm.cjs"),g=require("./pkt-slot-controller-BzddBp7z.cjs"),c=require("./ref-iJtiv3o2.cjs");require("./icon-B_ryAy4Q.cjs");require("./tag-Bbs0U_Au.cjs");require("./heading-CNycsyMj.cjs");const k={layout:{default:"vertical"},skin:{type:["outlined","outlined-beige","gray","blue","beige","green"],default:"outlined"},padding:{default:"default"}},o={props:k};var u=Object.defineProperty,m=Object.getOwnPropertyDescriptor,e=(i,a,s,n)=>{for(var r=n>1?void 0:n?m(a,s):a,d=i.length-1,l;d>=0;d--)(l=i[d])&&(r=(n?l(a,s,r):l(r))||r);return n&&r&&u(a,s,r),r};exports.PktCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.ariaLabel="",this.metaLead=null,this.borderOnHover=!0,this.clickCardLink=null,this.metaTrail=null,this.layout=o.props.layout.default,this.heading="",this.headinglevel=3,this.image={src:"",alt:""},this.imageShape="square",this.openLinkInNewTab=!1,this.padding=o.props.padding.default,this.skin=o.props.skin.default,this.subheading="",this.tagPosition="top",this.tags=[],this.slotController=new g.PktSlotController(this,this.defaultSlot)}connectedCallback(){super.connectedCallback()}render(){var r,d;const a={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.layout}`]:this.layout,[`pkt-card--padding-${this.padding}`]:this.padding,"pkt-card--border-on-hover":this.borderOnHover},s=((r=this.ariaLabel)==null?void 0:r.trim())||(this.heading?`${this.heading} lenkekort`:"lenkekort"),n=((d=this.ariaLabel)==null?void 0:d.trim())||(this.heading?this.heading:"kort");return t.x`
       <article
         class=${p.e(a)}
         aria-label=${h.o(this.clickCardLink?s:n)}

package/dist/{heading-D6jXE_Mz.js → heading-Bdh9absf.js}

@@ -1,10 +1,10 @@
-import { b as p, x as u, n as d, a as o } from "./element-CgEWt74-.js";
-var g = Object.defineProperty, c = Object.getOwnPropertyDescriptor, l = (t, i, e, r) => {
-  for (var s = r > 1 ? void 0 : r ? c(i, e) : i, n = t.length - 1, h; n >= 0; n--)
-    (h = t[n]) && (s = (r ? h(i, e, s) : h(s)) || s);
-  return r && s && g(i, e, s), s;
+import { b as p, x as u, n, a as o } from "./element-CgEWt74-.js";
+var g = Object.defineProperty, f = Object.getOwnPropertyDescriptor, a = (t, i, e, d) => {
+  for (var s = d > 1 ? void 0 : d ? f(i, e) : i, r = t.length - 1, h; r >= 0; r--)
+    (h = t[r]) && (s = (d ? h(i, e, s) : h(s)) || s);
+  return d && s && g(i, e, s), s;
 };
-let a = class extends p {
+let l = class extends p {
   constructor() {
     super(...arguments), this.size = "medium", this.level = 2, this.visuallyHidden = !1, this.align = "start";
   }
@@ -12,7 +12,7 @@ let a = class extends p {
     super.connectedCallback(), this.setAttribute("role", "heading"), this.setAttribute("aria-level", String(this.level)), this.updateHostClasses();
   }
   attributeChangedCallback(t, i, e) {
-    super.attributeChangedCallback(t, i, e), t === "level" && e && this.setLevel(Number(e)), (t === "size" || t === "visuallyHidden" || t === "align") && this.updateHostClasses();
+    super.attributeChangedCallback(t, i, e), t === "level" && e && this.setLevel(Number(e)), t === "visuallyHidden" && (this.visuallyHidden = e !== null && e !== "false"), (t === "size" || t === "visuallyHidden" || t === "align") && this.updateHostClasses();
   }
   updated(t) {
     super.updated(t), t.has("level") && this.setLevel(this.level), (t.has("size") || t.has("visuallyHidden") || t.has("align")) && this.updateHostClasses();
@@ -38,21 +38,21 @@ let a = class extends p {
     return u`<slot></slot>`;
   }
 };
-l([
-  d({ type: String, reflect: !0 })
-], a.prototype, "size", 2);
-l([
-  d({ type: Number, reflect: !0 })
-], a.prototype, "level", 2);
-l([
-  d({ type: Boolean, reflect: !0 })
-], a.prototype, "visuallyHidden", 2);
-l([
-  d({ type: String, reflect: !0 })
-], a.prototype, "align", 2);
-a = l([
+a([
+  n({ type: String, reflect: !0 })
+], l.prototype, "size", 2);
+a([
+  n({ type: Number, reflect: !0 })
+], l.prototype, "level", 2);
+a([
+  n({ type: Boolean, reflect: !0 })
+], l.prototype, "visuallyHidden", 2);
+a([
+  n({ type: String, reflect: !0 })
+], l.prototype, "align", 2);
+l = a([
   o("pkt-heading")
-], a);
+], l);
 export {
-  a as P
+  l as P
 };

package/dist/heading-CNycsyMj.cjs

@@ -0,0 +1 @@
+"use strict";const i=require("./element-6DBpyGQm.cjs");var h=Object.defineProperty,p=Object.getOwnPropertyDescriptor,l=(n,t,a,e)=>{for(var s=e>1?void 0:e?p(t,a):t,d=n.length-1,r;d>=0;d--)(r=n[d])&&(s=(e?r(t,a,s):r(s))||s);return e&&s&&h(t,a,s),s};exports.PktHeading=class extends i.PktShadowElement{constructor(){super(...arguments),this.size="medium",this.level=2,this.visuallyHidden=!1,this.align="start"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","heading"),this.setAttribute("aria-level",String(this.level)),this.updateHostClasses()}attributeChangedCallback(t,a,e){super.attributeChangedCallback(t,a,e),t==="level"&&e&&this.setLevel(Number(e)),t==="visuallyHidden"&&(this.visuallyHidden=e!==null&&e!=="false"),(t==="size"||t==="visuallyHidden"||t==="align")&&this.updateHostClasses()}updated(t){super.updated(t),t.has("level")&&this.setLevel(this.level),(t.has("size")||t.has("visuallyHidden")||t.has("align"))&&this.updateHostClasses()}setLevel(t){t>=1&&t<=6?(this.level=t,this.setAttribute("aria-level",String(t))):console.warn(`Invalid heading level: ${t}. Must be between 1 and 6.`)}updateHostClasses(){this.classList.remove("pkt-heading","pkt-heading--xsmall","pkt-heading--small","pkt-heading--medium","pkt-heading--large","pkt-heading--xlarge","pkt-sr-only","pkt-heading--start","pkt-heading--center","pkt-heading--end"),this.classList.add("pkt-heading"),this.size&&this.classList.add(`pkt-heading--${this.size}`),this.visuallyHidden&&this.classList.add("pkt-sr-only"),this.align&&this.classList.add(`pkt-heading--${this.align}`)}render(){return i.x`<slot></slot>`}};l([i.n({type:String,reflect:!0})],exports.PktHeading.prototype,"size",2);l([i.n({type:Number,reflect:!0})],exports.PktHeading.prototype,"level",2);l([i.n({type:Boolean,reflect:!0})],exports.PktHeading.prototype,"visuallyHidden",2);l([i.n({type:String,reflect:!0})],exports.PktHeading.prototype,"align",2);exports.PktHeading=l([i.t("pkt-heading")],exports.PktHeading);

package/dist/pkt-card.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./card-BUITGoqX.cjs"),t=e.PktCard;Object.defineProperty(exports,"PktCard",{enumerable:!0,get:()=>e.PktCard});exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./card-DBlFf1ry.cjs"),t=e.PktCard;Object.defineProperty(exports,"PktCard",{enumerable:!0,get:()=>e.PktCard});exports.default=t;

package/dist/pkt-card.js

@@ -1,4 +1,4 @@
-import { P as a } from "./card-Dtw26f7i.js";
+import { P as a } from "./card-BDz4RWxK.js";
 const r = a;
 export {
   a as PktCard,

package/dist/pkt-heading.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./heading-BRE_iFtR.cjs"),t=e.PktHeading;Object.defineProperty(exports,"PktHeading",{enumerable:!0,get:()=>e.PktHeading});exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./heading-CNycsyMj.cjs"),t=e.PktHeading;Object.defineProperty(exports,"PktHeading",{enumerable:!0,get:()=>e.PktHeading});exports.default=t;

package/dist/pkt-heading.js

@@ -1,4 +1,4 @@
-import { P as a } from "./heading-D6jXE_Mz.js";
+import { P as a } from "./heading-Bdh9absf.js";
 const e = a;
 export {
   a as PktHeading,

package/dist/pkt-index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("./alert-DQNBDKjT.cjs"),l=require("./accordionitem-Csh7iSVG.cjs"),d=require("./backlink-JbBNi3qg.cjs"),b=require("./button-B8rdtaHB.cjs"),k=require("./calendar-32W9p9uc.cjs"),m=require("./card-BUITGoqX.cjs"),g=require("./combobox-DjO0RMUB.cjs"),h=require("./consent-hYeFWNFr.cjs"),f=require("./checkbox-Gn7Wtk9h.cjs"),t=require("./element-6DBpyGQm.cjs"),y=require("./pkt-slot-controller-BzddBp7z.cjs"),s=require("./ref-iJtiv3o2.cjs"),O=require("./class-map-BBG2gMX4.cjs"),j=require("./datepicker-CmTrG5GE.cjs"),q=require("./helptext-CzQX6YVE.cjs"),x=require("./heading-BRE_iFtR.cjs"),C=require("./icon-B_ryAy4Q.cjs"),v=require("./input-wrapper-CZ-a00V7.cjs"),S=require("./link-Cjl0xwSq.cjs"),$=require("./linkcard-BlMhPNry.cjs"),L=require("./loader-CHPxY9c6.cjs"),_=require("./messagebox-CqUBJs_D.cjs"),A=require("./modal-CRtxhCaP.cjs"),B=require("./progressbar-DhMBXkww.cjs"),p=require("./radiobutton-CdT6v1oq.cjs"),T=require("./tag-Bbs0U_Au.cjs"),I=require("./textarea-CPXsMFUq.cjs"),M=require("./textinput-aNI5kibM.cjs"),R=require("./select-Dkl0KhGW.cjs");var H=Object.defineProperty,w=Object.getOwnPropertyDescriptor,o=(a,e,r,i)=>{for(var n=i>1?void 0:i?w(e,r):e,u=a.length-1,c;u>=0;u--)(c=a[u])&&(n=(i?c(e,r,n):c(n))||n);return i&&n&&H(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=s.e(),this.namedSlot=s.e(),this.slotController=new y.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("./alert-DQNBDKjT.cjs"),l=require("./accordionitem-Csh7iSVG.cjs"),d=require("./backlink-JbBNi3qg.cjs"),b=require("./button-B8rdtaHB.cjs"),k=require("./calendar-32W9p9uc.cjs"),m=require("./card-DBlFf1ry.cjs"),g=require("./combobox-DjO0RMUB.cjs"),h=require("./consent-hYeFWNFr.cjs"),f=require("./checkbox-Gn7Wtk9h.cjs"),t=require("./element-6DBpyGQm.cjs"),y=require("./pkt-slot-controller-BzddBp7z.cjs"),s=require("./ref-iJtiv3o2.cjs"),O=require("./class-map-BBG2gMX4.cjs"),j=require("./datepicker-CmTrG5GE.cjs"),q=require("./helptext-CzQX6YVE.cjs"),x=require("./heading-CNycsyMj.cjs"),C=require("./icon-B_ryAy4Q.cjs"),v=require("./input-wrapper-CZ-a00V7.cjs"),S=require("./link-Cjl0xwSq.cjs"),$=require("./linkcard-BlMhPNry.cjs"),L=require("./loader-CHPxY9c6.cjs"),_=require("./messagebox-CqUBJs_D.cjs"),A=require("./modal-CRtxhCaP.cjs"),B=require("./progressbar-DhMBXkww.cjs"),p=require("./radiobutton-CdT6v1oq.cjs"),T=require("./tag-Bbs0U_Au.cjs"),I=require("./textarea-CPXsMFUq.cjs"),M=require("./textinput-aNI5kibM.cjs"),R=require("./select-Dkl0KhGW.cjs");var H=Object.defineProperty,w=Object.getOwnPropertyDescriptor,o=(a,e,r,i)=>{for(var n=i>1?void 0:i?w(e,r):e,u=a.length-1,c;u>=0;u--)(c=a[u])&&(n=(i?c(e,r,n):c(n))||n);return i&&n&&H(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=s.e(),this.namedSlot=s.e(),this.slotController=new y.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
       <div class="${O.e(e)}">
         <h1 class="pkt-txt-28">${this.string}</h1>
 

package/dist/pkt-index.js

@@ -4,7 +4,7 @@ import { P as O } from "./backlink-C2jbzu0U.js";
 import { P as T } from "./button-DhispFOY.js";
 import { c as f } from "./calendar-CJSxvwAq.js";
 import { P as D } from "./calendar-CJSxvwAq.js";
-import { P as G } from "./card-Dtw26f7i.js";
+import { P as G } from "./card-BDz4RWxK.js";
 import { P as K } from "./combobox-yE4aYhTi.js";
 import { P as U } from "./consent-BpcQFvbi.js";
 import { P as q } from "./checkbox-ym7z6cpt.js";
@@ -14,7 +14,7 @@ import { e as m, n as d } from "./ref-BBYSqgeW.js";
 import { e as u } from "./class-map-BpTj9gtz.js";
 import { P as F } from "./datepicker-BJKJBoy_.js";
 import { P as Q } from "./helptext-B7eI0iBQ.js";
-import { P as X } from "./heading-D6jXE_Mz.js";
+import { P as X } from "./heading-Bdh9absf.js";
 import { P as Z } from "./icon-CC1js8eR.js";
 import { P as et } from "./input-wrapper-Dr__Sxql.js";
 import { P as ot } from "./link-AIyVfcyH.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-elements",
-  "version": "13.5.0",
+  "version": "13.5.1",
   "description": "Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -69,5 +69,5 @@
     "url": "https://github.com/oslokommune/punkt/issues"
   },
   "license": "MIT",
-  "gitHead": "5838a97cda7abfca773d36181a7ebf47343880e4"
+  "gitHead": "5892d94f903527e3e228915d86653bfbfdf209c8"
 }

package/src/components/consent/consent.test.ts

@@ -0,0 +1,436 @@
+import '@testing-library/jest-dom'
+import { axe, toHaveNoViolations } from 'jest-axe'
+import { fireEvent } from '@testing-library/dom'
+
+expect.extend(toHaveNoViolations)
+
+import './consent'
+import { PktConsent } from './consent'
+
+const waitForCustomElements = async () => {
+  await customElements.whenDefined('pkt-consent')
+  await customElements.whenDefined('pkt-button')
+}
+
+// Helper function to create consent markup
+const createConsent = async (consentProps = '') => {
+  const container = document.createElement('div')
+  container.innerHTML = `
+    <pkt-consent ${consentProps}></pkt-consent>
+  `
+  document.body.appendChild(container)
+  await waitForCustomElements()
+  return container
+}
+
+// Cleanup after each test
+afterEach(() => {
+  document.body.innerHTML = ''
+  // Clean up any injected scripts
+  const existingScript = document.querySelector('#oslo-consent-script')
+  if (existingScript) {
+    existingScript.remove()
+  }
+  const existingStyles = document.querySelector('#oslo-consent-styles')
+  if (existingStyles) {
+    existingStyles.remove()
+  }
+  // Clean up global variables
+  delete window.cookieBanner_googleAnalyticsId
+  delete window.cookieBanner_hotjarId
+  delete window.cookieBanner_devMode
+  delete window.cookieBanner_cookieDomain
+  delete window.cookieBanner_cookieSecure
+  delete window.cookieBanner_cookieExpiryDays
+  delete window.cookieBanner
+  delete window.__cookieEvents
+})
+
+describe('PktConsent', () => {
+  describe('Rendering and basic functionality', () => {
+    test('renders without errors', async () => {
+      const container = await createConsent()
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      expect(consent).toBeInTheDocument()
+
+      await consent.updateComplete
+      expect(consent).toBeTruthy()
+    })
+
+    test('renders with default trigger type as button', async () => {
+      const container = await createConsent()
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.triggerType).toBe('button')
+
+      const button = consent.querySelector('pkt-button')
+      expect(button).toBeInTheDocument()
+    })
+
+    test('renders with custom trigger text', async () => {
+      const customText = 'Custom consent settings'
+      const container = await createConsent(`triggerText="${customText}"`)
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.triggerText).toBe(customText)
+      const button = consent.querySelector('pkt-button')
+      expect(button?.textContent?.trim()).toBe(customText)
+    })
+  })
+
+  describe('Properties and attributes', () => {
+    test('applies default properties correctly', async () => {
+      const container = await createConsent()
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.devMode).toBe(false)
+      expect(consent.triggerType).toBe('button')
+      expect(consent.i18nLanguage).toBe('nb')
+      expect(consent.hotjarId).toBe(null)
+      expect(consent.googleAnalyticsId).toBe(null)
+      expect(consent.cookieDomain).toBe(null)
+      expect(consent.cookieSecure).toBe(null)
+      expect(consent.cookieExpiryDays).toBe(null)
+    })
+
+    test('sets dev mode correctly', async () => {
+      const container = await createConsent('devMode')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.devMode).toBe(true)
+    })
+
+    test('sets analytics IDs correctly', async () => {
+      const googleId = 'GA-123456789'
+      const hotjarId = 'HJ-987654321'
+      const container = await createConsent(
+        `googleAnalyticsId="${googleId}" hotjarId="${hotjarId}"`,
+      )
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.googleAnalyticsId).toBe(googleId)
+      expect(consent.hotjarId).toBe(hotjarId)
+    })
+
+    test('sets cookie configuration correctly', async () => {
+      const domain = '.example.com'
+      const secure = 'true'
+      const expiryDays = '365'
+      const container = await createConsent(
+        `cookieDomain="${domain}" cookieSecure="${secure}" cookieExpiryDays="${expiryDays}"`,
+      )
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.cookieDomain).toBe(domain)
+      expect(consent.cookieSecure).toBe(secure)
+      expect(consent.cookieExpiryDays).toBe(expiryDays)
+    })
+
+    test('sets language correctly', async () => {
+      const container = await createConsent('i18nLanguage="en"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.i18nLanguage).toBe('en')
+    })
+  })
+
+  describe('Trigger types', () => {
+    test('renders as button trigger type', async () => {
+      const container = await createConsent('triggerType="button"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.triggerType).toBe('button')
+      const button = consent.querySelector('pkt-button')
+      expect(button).toBeInTheDocument()
+      expect(button?.getAttribute('skin')).toBe(null) // Default button
+    })
+
+    test('renders as link trigger type', async () => {
+      const container = await createConsent('triggerType="link"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.triggerType).toBe('link')
+      const link = consent.querySelector('a.pkt-link')
+      expect(link).toBeInTheDocument()
+      expect(link?.getAttribute('href')).toBe('#')
+    })
+
+    test('renders as footer link trigger type', async () => {
+      const container = await createConsent('triggerType="footerlink"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.triggerType).toBe('footerlink')
+      const footerLink = consent.querySelector('a.pkt-footer__link')
+      expect(footerLink).toBeInTheDocument()
+
+      const icon = footerLink?.querySelector('pkt-icon')
+      expect(icon).toBeInTheDocument()
+      expect(icon?.getAttribute('name')).toBe('chevron-right')
+    })
+
+    test('renders as icon trigger type', async () => {
+      const container = await createConsent('triggerType="icon"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(consent.triggerType).toBe('icon')
+      const button = consent.querySelector('pkt-button')
+      expect(button).toBeInTheDocument()
+      expect(button?.getAttribute('skin')).toBe('tertiary')
+      expect(button?.getAttribute('variant')).toBe('icon-only')
+      expect(button?.getAttribute('iconName')).toBe('cookie')
+    })
+  })
+
+  describe('Event handling', () => {
+    beforeEach(() => {
+      // Mock the entire window.cookieBanner object
+      Object.defineProperty(window, 'cookieBanner', {
+        value: {
+          cookieConsent: {
+            validateConsentCookie: jest.fn().mockResolvedValue(true),
+            getConsentCookie: jest.fn().mockReturnValue('mock-cookie'),
+          },
+          openCookieModal: jest.fn(),
+        },
+        writable: true,
+      })
+
+      // Mock window.__cookieEvents
+      Object.defineProperty(window, '__cookieEvents', {
+        value: {
+          on: jest.fn(),
+          off: jest.fn(),
+        },
+        writable: true,
+      })
+
+      // Use fake timers to control setTimeout
+      jest.useFakeTimers()
+    })
+
+    afterEach(() => {
+      // Clean up mocks and timers
+      jest.useRealTimers()
+      delete (window as any).cookieBanner
+      delete (window as any).__cookieEvents
+    })
+
+    test('handles click event on button trigger', async () => {
+      const container = await createConsent()
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      const button = consent.querySelector('pkt-button')
+      expect(button).toBeInTheDocument()
+
+      fireEvent.click(button!)
+
+      // Fast-forward time to trigger setTimeout
+      jest.runAllTimers()
+
+      expect(window.cookieBanner.openCookieModal).toHaveBeenCalled()
+    })
+
+    test('handles click event on link trigger', async () => {
+      const container = await createConsent('triggerType="link"')
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      const link = consent.querySelector('a.pkt-link')
+      expect(link).toBeInTheDocument()
+
+      fireEvent.click(link!)
+
+      // Fast-forward time to trigger setTimeout
+      jest.runAllTimers()
+
+      expect(window.cookieBanner.openCookieModal).toHaveBeenCalled()
+    })
+
+    test('dispatches toggle-consent event', async () => {
+      const container = await createConsent()
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      let eventFired = false
+      let eventDetail: any = null
+
+      consent.addEventListener('toggle-consent', (e: Event) => {
+        eventFired = true
+        eventDetail = (e as CustomEvent).detail
+      })
+
+      // Mock consent data
+      const mockConsent = {
+        value: JSON.stringify({
+          items: [
+            { name: 'analytics', consent: true },
+            { name: 'marketing', consent: false },
+          ],
+        }),
+      }
+
+      consent.emitCookieConsents(mockConsent)
+
+      expect(eventFired).toBe(true)
+      expect(eventDetail).toEqual({
+        analytics: true,
+        marketing: false,
+      })
+    })
+  })
+
+  describe('Utility methods', () => {
+    test('returnJsonOrObject handles JSON strings', async () => {
+      const container = await createConsent()
+      const consent = container.querySelector('pkt-consent') as PktConsent
+
+      const jsonString = '{"test": "value"}'
+      const result = consent.returnJsonOrObject(jsonString)
+
+      expect(result).toEqual({ test: 'value' })
+    })
+
+    test('returnJsonOrObject handles non-JSON objects', async () => {
+      const container = await createConsent()
+      const consent = container.querySelector('pkt-consent') as PktConsent
+
+      const nonJsonObject = { test: 'value' }
+      const result = consent.returnJsonOrObject(nonJsonObject)
+
+      expect(result).toEqual(nonJsonObject)
+    })
+
+    test('returnJsonOrObject handles invalid JSON gracefully', async () => {
+      const container = await createConsent()
+      const consent = container.querySelector('pkt-consent') as PktConsent
+
+      const invalidJson = 'invalid json string'
+      const result = consent.returnJsonOrObject(invalidJson)
+
+      expect(result).toBe(invalidJson)
+    })
+  })
+
+  describe('Accessibility', () => {
+    test('button trigger is accessible', async () => {
+      const container = await createConsent('triggerText="Cookie settings"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      const results = await axe(container)
+      expect(results).toHaveNoViolations()
+
+      const button = consent.querySelector('pkt-button')
+      expect(button).toBeInTheDocument()
+      expect(button?.textContent?.trim()).toBe('Cookie settings')
+    })
+
+    test('link trigger is accessible', async () => {
+      const container = await createConsent('triggerType="link" triggerText="Cookie settings"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      const results = await axe(container)
+      expect(results).toHaveNoViolations()
+
+      const link = consent.querySelector('a')
+      expect(link).toBeInTheDocument()
+      expect(link?.textContent?.trim()).toBe('Cookie settings')
+    })
+
+    test('footer link trigger is accessible', async () => {
+      const container = await createConsent(
+        'triggerType="footerlink" triggerText="Cookie settings"',
+      )
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      const results = await axe(container)
+      expect(results).toHaveNoViolations()
+
+      const link = consent.querySelector('a.pkt-footer__link')
+      expect(link).toBeInTheDocument()
+      expect(link?.textContent?.trim()).toContain('Cookie settings')
+    })
+
+    test('icon trigger is accessible', async () => {
+      const container = await createConsent('triggerType="icon" triggerText="Cookie settings"')
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      const results = await axe(container)
+      expect(results).toHaveNoViolations()
+
+      const button = consent.querySelector('pkt-button')
+      expect(button).toBeInTheDocument()
+      expect(button?.textContent?.trim()).toContain('Cookie settings')
+    })
+  })
+
+  describe('Integration and lifecycle', () => {
+    test('sets global variables on firstUpdated', async () => {
+      const googleId = 'GA-123456789'
+      const hotjarId = 'HJ-987654321'
+      const container = await createConsent(
+        `devMode googleAnalyticsId="${googleId}" hotjarId="${hotjarId}" cookieDomain=".test.com"`,
+      )
+
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      expect(window.cookieBanner_googleAnalyticsId).toBe(googleId)
+      expect(window.cookieBanner_hotjarId).toBe(hotjarId)
+      expect(window.cookieBanner_devMode).toBe(true)
+      expect(window.cookieBanner_cookieDomain).toBe('.test.com')
+    })
+
+    test('cleans up event listeners on disconnect', async () => {
+      const container = await createConsent()
+      const consent = container.querySelector('pkt-consent') as PktConsent
+      await consent.updateComplete
+
+      // Mock the event system
+      window.__cookieEvents = {
+        on: jest.fn(),
+        off: jest.fn(),
+      }
+
+      // Set up a handler
+      const mockHandler = jest.fn()
+      consent['_cookieEventHandler'] = mockHandler
+
+      // Disconnect the component
+      consent.disconnectedCallback()
+
+      expect(window.__cookieEvents.off).toHaveBeenCalledWith('CookieManager.setCookie', mockHandler)
+    })
+  })
+})