@oslokommune/punkt-elements 12.41.1 → 12.42.0

package/CHANGELOG.md

@@ -5,6 +5,23 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
 
 ---
 
+## [12.42.0](https://github.com/oslokommune/punkt/compare/12.41.1...12.42.0) (2025-06-12)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+Ingen
+
+### Bug Fixes
+Ingen
+
+### Chores
+Ingen
+
+---
+
+
 ## [12.41.1](https://github.com/oslokommune/punkt/compare/12.41.0...12.41.1) (2025-06-11)
 
 ### ⚠ BREAKING CHANGES

package/dist/alert-BY97zZYx.cjs

@@ -0,0 +1,32 @@
+"use strict";const c=require("./class-map-DWDPOqjO.cjs"),t=require("./element-90YeMNbV.cjs"),d=require("./state-D-Recv7U.cjs"),h=require("./pkt-slot-controller-Da-RgXfS.cjs"),u=require("./ref-B-w1vCo8.cjs"),k=require("./classutils-BwNK82ZQ.cjs");require("./icon-B1_BRNqf.cjs");const v={skin:{default:"info"},ariaLive:{default:"polite"},compact:{default:!1},closeAlert:{default:!1}},a={props:v};var f=Object.defineProperty,_=Object.getOwnPropertyDescriptor,i=(o,e,s,l)=>{for(var r=l>1?void 0:l?_(e,s):e,p=o.length-1,n;p>=0;p--)(n=o[p])&&(r=(l?n(e,s,r):n(r))||r);return l&&r&&f(e,s,r),r};exports.PktAlert=class extends t.PktElement{constructor(){super(),this.defaultSlot=u.e(),this.compact=a.props.compact.default,this.title="",this.skin=a.props.skin.default,this.ariaLive=a.props.ariaLive.default,this["aria-live"]=null,this.closeAlert=a.props.closeAlert.default,this.date=null,this.role="status",this._isClosed=!1,this.close=e=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:e},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:e},bubbles:!0,composed:!0}))},this.slotController=new h.PktSlotController(this,this.defaultSlot),this._isClosed=!1}connectedCallback(){super.connectedCallback(),this["aria-live"]=this.getAttribute("aria-live")||this.ariaLive}attributeChangedCallback(e,s,l){e==="ariaLive"&&(this["aria-live"]=l),super.attributeChangedCallback(e,s,l)}updated(e){super.updated(e),e.has("ariaLive")&&(this["aria-live"]=this.ariaLive),e.has("_isClosed")&&k.updateClassAttribute(this,"pkt-hide",this._isClosed)}render(){const e={"pkt-alert":!0,"pkt-alert--compact":this.compact,[`pkt-alert--${this.skin}`]:this.skin,"pkt-hide":this._isClosed},s={"pkt-alert__grid":!0,"pkt-alert__noTitle":!this.title,"pkt-alert__noDate":!this.date};return t.x`
+      <div class=${c.e(e)} aria-live=${this["aria-live"]}>
+        <div class=${c.e(s)}>
+          <pkt-icon
+            class="pkt-alert__icon"
+            aria-hidden="true"
+            name=${this.skin==="info"?"alert-information":`alert-${this.skin}`}
+          ></pkt-icon>
+
+          ${this.closeAlert?t.x`
+                <div class="pkt-alert__close">
+                  <pkt-button
+                    tabindex="0"
+                    aria-label="close"
+                    size=${this.compact?"small":"medium"}
+                    type="button"
+                    skin="tertiary"
+                    iconName="close"
+                    variant="icon-only"
+                    @click=${this.close}
+                  >
+                  </pkt-button>
+                </div>
+              `:t.E}
+          ${this.title?t.x`<div class="pkt-alert__title">${this.title}</div>`:t.E}
+
+          <div class="pkt-alert__text" ${u.n(this.defaultSlot)}></div>
+
+          ${this.date?t.x`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>`:t.E}
+        </div>
+      </div>
+    `}};i([t.n({type:Boolean,reflect:!1})],exports.PktAlert.prototype,"compact",2);i([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"title",2);i([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"skin",2);i([t.n({type:String})],exports.PktAlert.prototype,"ariaLive",2);i([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"aria-live",2);i([t.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"closeAlert",2);i([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"date",2);i([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"role",2);i([d.r()],exports.PktAlert.prototype,"_isClosed",2);exports.PktAlert=i([t.t("pkt-alert")],exports.PktAlert);

package/dist/{alert-CoGYPbs-.js → alert-oh7nc3ip.js}

@@ -1,11 +1,11 @@
 import { e as u } from "./class-map-m7ZCZ49w.js";
-import { P as f, E as h, x as p, n as l, a as v } from "./element-gAd63VwC.js";
+import { P as f, E as h, x as p, n as a, a as v } from "./element-gAd63VwC.js";
 import { r as k } from "./state-BxrO4zNJ.js";
 import { P as m } from "./pkt-slot-controller-DtDaD9q_.js";
 import { e as _, n as b } from "./ref-DnSbnXsj.js";
-import { u as C } from "./classutils-RQs1k6D9.js";
+import { u as y } from "./classutils-RQs1k6D9.js";
 import "./icon-CO1TLSs5.js";
-const y = {
+const C = {
   skin: {
     default: "info"
   },
@@ -19,16 +19,16 @@ const y = {
     default: !1
   }
 }, c = {
-  props: y
+  props: C
 };
-var $ = Object.defineProperty, g = Object.getOwnPropertyDescriptor, i = (t, s, r, o) => {
-  for (var a = o > 1 ? void 0 : o ? g(s, r) : s, n = t.length - 1, d; n >= 0; n--)
-    (d = t[n]) && (a = (o ? d(s, r, a) : d(a)) || a);
-  return o && a && $(s, r, a), a;
+var $ = Object.defineProperty, g = Object.getOwnPropertyDescriptor, i = (t, s, l, o) => {
+  for (var r = o > 1 ? void 0 : o ? g(s, l) : s, n = t.length - 1, d; n >= 0; n--)
+    (d = t[n]) && (r = (o ? d(s, l, r) : d(r)) || r);
+  return o && r && $(s, l, r), r;
 };
 let e = class extends f {
   constructor() {
-    super(), this.defaultSlot = _(), this.compact = c.props.compact.default, this.title = "", this.skin = c.props.skin.default, this.ariaLive = c.props.ariaLive.default, this["aria-live"] = null, this.closeAlert = c.props.closeAlert.default, this.date = null, this._isClosed = !1, this.close = (t) => {
+    super(), this.defaultSlot = _(), this.compact = c.props.compact.default, this.title = "", this.skin = c.props.skin.default, this.ariaLive = c.props.ariaLive.default, this["aria-live"] = null, this.closeAlert = c.props.closeAlert.default, this.date = null, this.role = "status", this._isClosed = !1, this.close = (t) => {
       this._isClosed = !0, this.dispatchEvent(
         new CustomEvent("close", { detail: { origin: t }, bubbles: !0, composed: !0 })
       ), this.dispatchEvent(
@@ -40,11 +40,11 @@ let e = class extends f {
   connectedCallback() {
     super.connectedCallback(), this["aria-live"] = this.getAttribute("aria-live") || this.ariaLive;
   }
-  attributeChangedCallback(t, s, r) {
-    t === "ariaLive" && (this["aria-live"] = r), super.attributeChangedCallback(t, s, r);
+  attributeChangedCallback(t, s, l) {
+    t === "ariaLive" && (this["aria-live"] = l), super.attributeChangedCallback(t, s, l);
   }
   updated(t) {
-    super.updated(t), t.has("ariaLive") && (this["aria-live"] = this.ariaLive), t.has("_isClosed") && C(this, "pkt-hide", this._isClosed);
+    super.updated(t), t.has("ariaLive") && (this["aria-live"] = this.ariaLive), t.has("_isClosed") && y(this, "pkt-hide", this._isClosed);
   }
   // Render
   render() {
@@ -59,7 +59,7 @@ let e = class extends f {
       "pkt-alert__noDate": !this.date
     };
     return p`
-      <div class=${u(t)}>
+      <div class=${u(t)} aria-live=${this["aria-live"]}>
         <div class=${u(s)}>
           <pkt-icon
             class="pkt-alert__icon"
@@ -93,26 +93,29 @@ let e = class extends f {
   }
 };
 i([
-  l({ type: Boolean, reflect: !1 })
+  a({ type: Boolean, reflect: !1 })
 ], e.prototype, "compact", 2);
 i([
-  l({ type: String, reflect: !0 })
+  a({ type: String, reflect: !0 })
 ], e.prototype, "title", 2);
 i([
-  l({ type: String, reflect: !0 })
+  a({ type: String, reflect: !0 })
 ], e.prototype, "skin", 2);
 i([
-  l({ type: String })
+  a({ type: String })
 ], e.prototype, "ariaLive", 2);
 i([
-  l({ type: String, reflect: !0 })
+  a({ type: String, reflect: !0 })
 ], e.prototype, "aria-live", 2);
 i([
-  l({ type: Boolean, reflect: !0 })
+  a({ type: Boolean, reflect: !0 })
 ], e.prototype, "closeAlert", 2);
 i([
-  l({ type: String, reflect: !0 })
+  a({ type: String, reflect: !0 })
 ], e.prototype, "date", 2);
+i([
+  a({ type: String, reflect: !0 })
+], e.prototype, "role", 2);
 i([
   k()
 ], e.prototype, "_isClosed", 2);

package/dist/index.d.ts

@@ -95,6 +95,7 @@ declare interface IPktAlert {
     ariaLive?: TAriaLive | null;
     'aria-live'?: TAriaLive | null;
     compact?: boolean;
+    role?: string;
 }
 
 export declare interface IPktBackLink {
@@ -339,6 +340,7 @@ export declare class PktAlert extends PktElement implements IPktAlert {
     'aria-live': TAriaLive | null;
     closeAlert: boolean;
     date: string | null;
+    role: string;
     _isClosed: boolean;
     connectedCallback(): void;
     attributeChangedCallback(name: string, _old: string | null, value: string | null): void;

package/dist/pkt-alert.cjs

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

package/dist/pkt-alert.js

@@ -1,4 +1,4 @@
-import { P as t } from "./alert-CoGYPbs-.js";
+import { P as t } from "./alert-oh7nc3ip.js";
 const e = t;
 export {
   t as PktAlert,

package/dist/pkt-index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("./alert-D2PhTV94.cjs"),l=require("./accordionitem-Dz6jwPpb.cjs"),d=require("./backlink-CcAZfB1d.cjs"),b=require("./button-KzBZ-Bff.cjs"),k=require("./calendar-BDeaGBaH.cjs"),m=require("./card-CmdIb2X9.cjs"),g=require("./combobox-DMkMUJfx.cjs"),h=require("./consent-D1r9LYda.cjs"),f=require("./checkbox-CiXWukkL.cjs"),t=require("./element-90YeMNbV.cjs"),y=require("./pkt-slot-controller-Da-RgXfS.cjs"),s=require("./ref-B-w1vCo8.cjs"),O=require("./class-map-DWDPOqjO.cjs"),j=require("./datepicker-DpQV8G6g.cjs"),q=require("./helptext-AqNI_oFG.cjs"),x=require("./heading-CxJ0IqpU.cjs"),C=require("./icon-B1_BRNqf.cjs"),v=require("./input-wrapper-B_TtkGqo.cjs"),S=require("./link-BWJrqWi7.cjs"),$=require("./linkcard-0KLDuaGM.cjs"),L=require("./loader--5h6NKGl.cjs"),_=require("./messagebox-IJOkv427.cjs"),A=require("./modal-CBURcXBd.cjs"),B=require("./progressbar-BrXtjUvh.cjs"),p=require("./radiobutton-x10h-JEh.cjs"),T=require("./tag-lU4vz70a.cjs"),I=require("./textarea-j8kBS-hf.cjs"),M=require("./textinput-kmcj-FlC.cjs"),R=require("./select-BUvu5SFp.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-BY97zZYx.cjs"),l=require("./accordionitem-Dz6jwPpb.cjs"),d=require("./backlink-CcAZfB1d.cjs"),b=require("./button-KzBZ-Bff.cjs"),k=require("./calendar-BDeaGBaH.cjs"),m=require("./card-CmdIb2X9.cjs"),g=require("./combobox-DMkMUJfx.cjs"),h=require("./consent-D1r9LYda.cjs"),f=require("./checkbox-CiXWukkL.cjs"),t=require("./element-90YeMNbV.cjs"),y=require("./pkt-slot-controller-Da-RgXfS.cjs"),s=require("./ref-B-w1vCo8.cjs"),O=require("./class-map-DWDPOqjO.cjs"),j=require("./datepicker-DpQV8G6g.cjs"),q=require("./helptext-AqNI_oFG.cjs"),x=require("./heading-CxJ0IqpU.cjs"),C=require("./icon-B1_BRNqf.cjs"),v=require("./input-wrapper-B_TtkGqo.cjs"),S=require("./link-BWJrqWi7.cjs"),$=require("./linkcard-0KLDuaGM.cjs"),L=require("./loader--5h6NKGl.cjs"),_=require("./messagebox-IJOkv427.cjs"),A=require("./modal-CBURcXBd.cjs"),B=require("./progressbar-BrXtjUvh.cjs"),p=require("./radiobutton-x10h-JEh.cjs"),T=require("./tag-lU4vz70a.cjs"),I=require("./textarea-j8kBS-hf.cjs"),M=require("./textinput-kmcj-FlC.cjs"),R=require("./select-BUvu5SFp.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

@@ -1,4 +1,4 @@
-import { P as A } from "./alert-CoGYPbs-.js";
+import { P as A } from "./alert-oh7nc3ip.js";
 import { P as B, a as E } from "./accordionitem-DkE9or0K.js";
 import { P as O } from "./backlink-BnlrDl9O.js";
 import { P as T } from "./button-OLSvT2Im.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-elements",
-  "version": "12.41.1",
+  "version": "12.42.0",
   "description": "Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -59,5 +59,5 @@
     "url": "https://github.com/oslokommune/punkt/issues"
   },
   "license": "MIT",
-  "gitHead": "6af0ba1d43d2ba724a15b4d37c80ab62a68c8cae"
+  "gitHead": "fdb019a20d3a46f588a23a1648fce810c54578a8"
 }

package/src/components/alert/alert.ts

@@ -20,6 +20,7 @@ export interface IPktAlert {
   ariaLive?: TAriaLive | null
   'aria-live'?: TAriaLive | null
   compact?: boolean
+  role?: string
 }
 @customElement('pkt-alert')
 export class PktAlert extends PktElement implements IPktAlert {
@@ -41,6 +42,7 @@ export class PktAlert extends PktElement implements IPktAlert {
   @property({ type: String, reflect: true }) 'aria-live': TAriaLive | null = null
   @property({ type: Boolean, reflect: true }) closeAlert = specs.props.closeAlert.default
   @property({ type: String, reflect: true }) date: string | null = null
+  @property({ type: String, reflect: true }) role: string = 'status'
 
   @state() _isClosed: boolean = false
 
@@ -85,7 +87,7 @@ export class PktAlert extends PktElement implements IPktAlert {
     }
 
     return html`
-      <div class=${classMap(classes)}>
+      <div class=${classMap(classes)} aria-live=${this['aria-live']}>
         <div class=${classMap(gridClasses)}>
           <pkt-icon
             class="pkt-alert__icon"

package/dist/alert-D2PhTV94.cjs

@@ -1,32 +0,0 @@
-"use strict";const c=require("./class-map-DWDPOqjO.cjs"),e=require("./element-90YeMNbV.cjs"),u=require("./state-D-Recv7U.cjs"),h=require("./pkt-slot-controller-Da-RgXfS.cjs"),d=require("./ref-B-w1vCo8.cjs"),k=require("./classutils-BwNK82ZQ.cjs");require("./icon-B1_BRNqf.cjs");const v={skin:{default:"info"},ariaLive:{default:"polite"},compact:{default:!1},closeAlert:{default:!1}},a={props:v};var f=Object.defineProperty,_=Object.getOwnPropertyDescriptor,i=(o,t,s,l)=>{for(var r=l>1?void 0:l?_(t,s):t,p=o.length-1,n;p>=0;p--)(n=o[p])&&(r=(l?n(t,s,r):n(r))||r);return l&&r&&f(t,s,r),r};exports.PktAlert=class extends e.PktElement{constructor(){super(),this.defaultSlot=d.e(),this.compact=a.props.compact.default,this.title="",this.skin=a.props.skin.default,this.ariaLive=a.props.ariaLive.default,this["aria-live"]=null,this.closeAlert=a.props.closeAlert.default,this.date=null,this._isClosed=!1,this.close=t=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:t},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:t},bubbles:!0,composed:!0}))},this.slotController=new h.PktSlotController(this,this.defaultSlot),this._isClosed=!1}connectedCallback(){super.connectedCallback(),this["aria-live"]=this.getAttribute("aria-live")||this.ariaLive}attributeChangedCallback(t,s,l){t==="ariaLive"&&(this["aria-live"]=l),super.attributeChangedCallback(t,s,l)}updated(t){super.updated(t),t.has("ariaLive")&&(this["aria-live"]=this.ariaLive),t.has("_isClosed")&&k.updateClassAttribute(this,"pkt-hide",this._isClosed)}render(){const t={"pkt-alert":!0,"pkt-alert--compact":this.compact,[`pkt-alert--${this.skin}`]:this.skin,"pkt-hide":this._isClosed},s={"pkt-alert__grid":!0,"pkt-alert__noTitle":!this.title,"pkt-alert__noDate":!this.date};return e.x`
-      <div class=${c.e(t)}>
-        <div class=${c.e(s)}>
-          <pkt-icon
-            class="pkt-alert__icon"
-            aria-hidden="true"
-            name=${this.skin==="info"?"alert-information":`alert-${this.skin}`}
-          ></pkt-icon>
-
-          ${this.closeAlert?e.x`
-                <div class="pkt-alert__close">
-                  <pkt-button
-                    tabindex="0"
-                    aria-label="close"
-                    size=${this.compact?"small":"medium"}
-                    type="button"
-                    skin="tertiary"
-                    iconName="close"
-                    variant="icon-only"
-                    @click=${this.close}
-                  >
-                  </pkt-button>
-                </div>
-              `:e.E}
-          ${this.title?e.x`<div class="pkt-alert__title">${this.title}</div>`:e.E}
-
-          <div class="pkt-alert__text" ${d.n(this.defaultSlot)}></div>
-
-          ${this.date?e.x`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>`:e.E}
-        </div>
-      </div>
-    `}};i([e.n({type:Boolean,reflect:!1})],exports.PktAlert.prototype,"compact",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"title",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"skin",2);i([e.n({type:String})],exports.PktAlert.prototype,"ariaLive",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"aria-live",2);i([e.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"closeAlert",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"date",2);i([u.r()],exports.PktAlert.prototype,"_isClosed",2);exports.PktAlert=i([e.t("pkt-alert")],exports.PktAlert);