@oslokommune/punkt-elements 12.17.2 → 12.18.1

package/dist/link-Bx9nVgZi.js

@@ -0,0 +1,108 @@
+import { P as f, x as k, E as h, n as i, t as m } from "./icon-wUXeHiBk.js";
+import { P as d } from "./pkt-slot-controller-RJvOnbF4.js";
+import { e as u, n as P } from "./ref-DuFGTLVX.js";
+import { e as y } from "./class-map-hz16xq5a.js";
+const g = "pkt-link", v = !0, _ = {
+  href: {
+    name: "URL",
+    description: "URL til lenken",
+    type: "string",
+    default: "#"
+  },
+  target: {
+    name: "Mål",
+    description: "Mål for lenken",
+    type: [
+      "_blank",
+      "_self",
+      "_parent",
+      "_top"
+    ],
+    default: "_self"
+  },
+  iconName: {
+    name: "Ikon",
+    description: "Ikon som skal vises ved siden av lenketeksten",
+    type: "icon"
+  },
+  iconPosition: {
+    name: "Ikonposisjon",
+    description: "Posisjonen til ikonet i forhold til lenketeksten",
+    type: [
+      "left",
+      "right"
+    ]
+  },
+  external: {
+    name: "Ekstern lenke",
+    description: "Vis ikon for ekstern lenke",
+    type: "boolean",
+    default: !1
+  }
+}, x = {
+  default: {
+    description: "Innholdet i lenken"
+  }
+}, c = {
+  name: g,
+  "css-class": "pkt-link",
+  "dark-mode": !0,
+  isElement: v,
+  props: _,
+  slots: x
+};
+var $ = Object.defineProperty, N = Object.getOwnPropertyDescriptor, n = (o, s, l, r) => {
+  for (var e = r > 1 ? void 0 : r ? N(s, l) : s, a = o.length - 1, p; a >= 0; a--)
+    (p = o[a]) && (e = (r ? p(s, l, e) : p(e)) || e);
+  return r && e && $(s, l, e), e;
+};
+let t = class extends f {
+  constructor() {
+    super(), this.defaultSlot = u(), this.href = c.props.href.default, this.iconName = void 0, this.iconPosition = void 0, this.external = c.props.external.default, this.target = c.props.target.default, this.slotController = new d(this, this.defaultSlot);
+  }
+  render() {
+    const o = {
+      "pkt-link": !0,
+      "pkt-link--icon-left": !!this.iconName && this.iconPosition === "left" || !!(this.iconName && !this.iconPosition),
+      "pkt-link--icon-right": !!this.iconName && this.iconPosition === "right",
+      "pkt-link--external": this.external
+    };
+    return k`<a
+      class=${y(o)}
+      href=${this.href}
+      @click=${this.handleClick}
+      .target=${this.target}
+      .rel=${this.external ? "noopener noreferrer" : h}
+      >${this.iconName ? k`<pkt-icon name=${this.iconName} class="pkt-link__icon"></pkt-icon>` : ""} <span ${P(this.defaultSlot)}>Link</span></a
+    >`;
+  }
+  handleClick() {
+    this.dispatchEvent(
+      new CustomEvent("click", {
+        detail: "pkt-link-clicked",
+        bubbles: !0
+      })
+    );
+  }
+};
+n([
+  i({ type: String, reflect: !0 })
+], t.prototype, "href", 2);
+n([
+  i({ type: String, reflect: !0 })
+], t.prototype, "iconName", 2);
+n([
+  i({ type: String, reflect: !0 })
+], t.prototype, "iconPosition", 2);
+n([
+  i({ type: Boolean, reflect: !0 })
+], t.prototype, "external", 2);
+n([
+  i({ type: String, reflect: !0 })
+], t.prototype, "target", 2);
+t = n([
+  m("pkt-link")
+], t);
+export {
+  t as P
+};

package/dist/{linkcard-BlWQ8jOv.js → linkcard-CUrbzjLK.js}

@@ -1,18 +1,17 @@
-import { P as f, x as c, n } from "./index-CFDwiDTU.js";
-import { t as h } from "./custom-element-CWfU4dcr.js";
-import { e as k, P as m, n as u } from "./ref-CaiKp3S2.js";
-import "./index-RwtTBIhT.js";
-var _ = Object.defineProperty, d = Object.getOwnPropertyDescriptor, r = (l, i, s, o) => {
-  for (var e = o > 1 ? void 0 : o ? d(i, s) : i, a = l.length - 1, p; a >= 0; a--)
-    (p = l[a]) && (e = (o ? p(i, s, e) : p(e)) || e);
-  return o && e && _(i, s, e), e;
+import { P as f, x as c, n as i, t as h } from "./icon-wUXeHiBk.js";
+import { e as k, n as u } from "./ref-DuFGTLVX.js";
+import { P as _ } from "./pkt-slot-controller-RJvOnbF4.js";
+var d = Object.defineProperty, m = Object.getOwnPropertyDescriptor, r = (l, n, s, o) => {
+  for (var e = o > 1 ? void 0 : o ? m(n, s) : n, a = l.length - 1, p; a >= 0; a--)
+    (p = l[a]) && (e = (o ? p(n, s, e) : p(e)) || e);
+  return o && e && d(n, s, e), e;
 };
 let t = class extends f {
   constructor() {
-    super(), this.defaultSlot = k(), this.title = "", this.href = "#", this.iconName = "", this.external = !1, this.openInNewTab = !1, this.skin = "normal", this.slotController = new m(this, this.defaultSlot);
+    super(), this.defaultSlot = k(), this.title = "", this.href = "#", this.iconName = "", this.external = !1, this.openInNewTab = !1, this.skin = "normal", this.slotController = new _(this, this.defaultSlot);
   }
   render() {
-    const l = ["pkt-linkcard", this.skin && `pkt-linkcard--${this.skin}`].filter(Boolean).join(" "), i = ["pkt-linkcard__title", this.external && "pkt-link pkt-link--external"].filter(Boolean).join(" ");
+    const l = ["pkt-linkcard", this.skin && `pkt-linkcard--${this.skin}`].filter(Boolean).join(" "), n = ["pkt-linkcard__title", this.external && "pkt-link pkt-link--external"].filter(Boolean).join(" ");
     return c`
       <a
         href=${this.href}
@@ -21,7 +20,7 @@ let t = class extends f {
         rel=${this.openInNewTab ?? "noopener noreferrer"}
       >
         ${this.iconName && c`<pkt-icon class="pkt-link__icon" name="${this.iconName}" />`}
-        ${this.title && c`<div class=${i}>${this.title}</div>`}
+        ${this.title && c`<div class=${n}>${this.title}</div>`}
 
         <div class="pkt-linkcard__text" ${u(this.defaultSlot)}></div>
       </a>
@@ -29,22 +28,22 @@ let t = class extends f {
   }
 };
 r([
-  n({ type: String, reflect: !0 })
+  i({ type: String, reflect: !0 })
 ], t.prototype, "title", 2);
 r([
-  n({ type: String, reflect: !0 })
+  i({ type: String, reflect: !0 })
 ], t.prototype, "href", 2);
 r([
-  n({ type: String, reflect: !0 })
+  i({ type: String, reflect: !0 })
 ], t.prototype, "iconName", 2);
 r([
-  n({ type: Boolean, reflect: !0 })
+  i({ type: Boolean, reflect: !0 })
 ], t.prototype, "external", 2);
 r([
-  n({ type: Boolean, reflect: !0 })
+  i({ type: Boolean, reflect: !0 })
 ], t.prototype, "openInNewTab", 2);
 r([
-  n({ type: String, reflect: !0 })
+  i({ type: String, reflect: !0 })
 ], t.prototype, "skin", 2);
 t = r([
   h("pkt-linkcard")

package/dist/linkcard-DSu3A4Yx.cjs

@@ -0,0 +1,13 @@
+"use strict";const t=require("./icon-CdMQ6zBT.cjs"),k=require("./ref-DCOsLZQg.cjs"),p=require("./pkt-slot-controller-Ckk_yV0j.cjs");var c=Object.defineProperty,h=Object.getOwnPropertyDescriptor,r=(s,n,i,l)=>{for(var e=l>1?void 0:l?h(n,i):n,o=s.length-1,a;o>=0;o--)(a=s[o])&&(e=(l?a(n,i,e):a(e))||e);return l&&e&&c(n,i,e),e};exports.PktLinkCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=k.e(),this.title="",this.href="#",this.iconName="",this.external=!1,this.openInNewTab=!1,this.skin="normal",this.slotController=new p.PktSlotController(this,this.defaultSlot)}render(){const n=["pkt-linkcard",this.skin&&`pkt-linkcard--${this.skin}`].filter(Boolean).join(" "),i=["pkt-linkcard__title",this.external&&"pkt-link pkt-link--external"].filter(Boolean).join(" ");return t.x`
+      <a
+        href=${this.href}
+        class=${n}
+        target=${this.openInNewTab?"_blank":"_self"}
+        rel=${this.openInNewTab??"noopener noreferrer"}
+      >
+        ${this.iconName&&t.x`<pkt-icon class="pkt-link__icon" name="${this.iconName}" />`}
+        ${this.title&&t.x`<div class=${i}>${this.title}</div>`}
+
+        <div class="pkt-linkcard__text" ${k.n(this.defaultSlot)}></div>
+      </a>
+    `}};r([t.n({type:String,reflect:!0})],exports.PktLinkCard.prototype,"title",2);r([t.n({type:String,reflect:!0})],exports.PktLinkCard.prototype,"href",2);r([t.n({type:String,reflect:!0})],exports.PktLinkCard.prototype,"iconName",2);r([t.n({type:Boolean,reflect:!0})],exports.PktLinkCard.prototype,"external",2);r([t.n({type:Boolean,reflect:!0})],exports.PktLinkCard.prototype,"openInNewTab",2);r([t.n({type:String,reflect:!0})],exports.PktLinkCard.prototype,"skin",2);exports.PktLinkCard=r([t.t("pkt-linkcard")],exports.PktLinkCard);

package/dist/messagebox-C1aWoQbu.cjs

@@ -0,0 +1,12 @@
+"use strict";const e=require("./icon-CdMQ6zBT.cjs"),b=require("./pkt-slot-controller-Ckk_yV0j.cjs"),p=require("./ref-DCOsLZQg.cjs"),k=require("./class-map-Boa7BqCc.cjs"),d=require("./state-SKYD8kRO.cjs"),u="pkt-messagebox",g=!0,m={onClose:{description:"React: Event som trigges når meldingsboksen lukkes"},"on-close":{description:"Vue: Event som trigges når meldingsboksen lukkes"}},h={title:{name:"Tittel",description:"Tittelen på meldingsboksen",type:"string"},skin:{name:"Utseende",description:"Velg farge på meldingsboksen",type:["beige","blue","red","green"],default:"beige"},compact:{name:"Kompakt",description:"Gjør meldingsboksen mindre",type:"boolean",default:!1},closable:{name:"Kan lukkes",description:"Viser lukkeknapp",type:"boolean",default:!1}},f={default:{description:"Innholdet i meldingsboksen"}},c={name:u,"css-class":"pkt-messagebox",isElement:g,events:m,props:h,slots:f};var x=Object.defineProperty,v=Object.getOwnPropertyDescriptor,o=(i,t,n,l)=>{for(var s=l>1?void 0:l?v(t,n):t,r=i.length-1,a;r>=0;r--)(a=i[r])&&(s=(l?a(t,n,s):a(s))||s);return l&&s&&x(t,n,s),s};exports.PktMessagebox=class extends e.PktElement{constructor(){super(),this.defaultSlot=p.e(),this.closable=c.props.closable.default,this.compact=c.props.compact.default,this.title="",this.skin=c.props.skin.default,this._isClosed=!1,this.close=t=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:t},bubbles:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:t},bubbles:!0}))},this.slotController=new b.PktSlotController(this,this.defaultSlot),this._isClosed=!1}render(){const t={"pkt-messagebox":!0,"pkt-messagebox--compact":this.compact,[`pkt-messagebox--${this.skin}`]:this.skin,"pkt-messagebox--closable":this.closable,"pkt-hide":this._isClosed};return e.x`<div class=${k.e(t)}>
+      ${this.closable?e.x`<div class="pkt-messagebox__close">
+            <button
+              @click=${this.close}
+              class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
+            >
+              <pkt-icon name="close" class="pkt-link__icon"></pkt-icon>
+            </button>
+          </div>`:e.E}
+      ${this.title?e.x`<div class="pkt-messagebox__title">${this.title}</div>`:e.E}
+      <div class="pkt-messagebox__text" ${p.n(this.defaultSlot)}></div>
+    </div>`}};o([e.n({type:Boolean,reflect:!0})],exports.PktMessagebox.prototype,"closable",2);o([e.n({type:Boolean,reflect:!0})],exports.PktMessagebox.prototype,"compact",2);o([e.n({type:String,reflect:!0})],exports.PktMessagebox.prototype,"title",2);o([e.n({type:String,reflect:!0})],exports.PktMessagebox.prototype,"skin",2);o([d.r()],exports.PktMessagebox.prototype,"_isClosed",2);exports.PktMessagebox=o([e.t("pkt-messagebox")],exports.PktMessagebox);

package/dist/messagebox-LpiVQIoM.js

@@ -0,0 +1,107 @@
+import { P as b, x as c, E as d, n, t as k } from "./icon-wUXeHiBk.js";
+import { P as u } from "./pkt-slot-controller-RJvOnbF4.js";
+import { e as g, n as f } from "./ref-DuFGTLVX.js";
+import { e as h } from "./class-map-hz16xq5a.js";
+import { r as v } from "./state-BfyXV7EL.js";
+const _ = "pkt-messagebox", x = !0, y = {
+  onClose: {
+    description: "React: Event som trigges når meldingsboksen lukkes"
+  },
+  "on-close": {
+    description: "Vue: Event som trigges når meldingsboksen lukkes"
+  }
+}, C = {
+  title: {
+    name: "Tittel",
+    description: "Tittelen på meldingsboksen",
+    type: "string"
+  },
+  skin: {
+    name: "Utseende",
+    description: "Velg farge på meldingsboksen",
+    type: [
+      "beige",
+      "blue",
+      "red",
+      "green"
+    ],
+    default: "beige"
+  },
+  compact: {
+    name: "Kompakt",
+    description: "Gjør meldingsboksen mindre",
+    type: "boolean",
+    default: !1
+  },
+  closable: {
+    name: "Kan lukkes",
+    description: "Viser lukkeknapp",
+    type: "boolean",
+    default: !1
+  }
+}, E = {
+  default: {
+    description: "Innholdet i meldingsboksen"
+  }
+}, m = {
+  name: _,
+  "css-class": "pkt-messagebox",
+  isElement: x,
+  events: y,
+  props: C,
+  slots: E
+};
+var P = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, o = (e, l, p, i) => {
+  for (var t = i > 1 ? void 0 : i ? $(l, p) : l, r = e.length - 1, a; r >= 0; r--)
+    (a = e[r]) && (t = (i ? a(l, p, t) : a(t)) || t);
+  return i && t && P(l, p, t), t;
+};
+let s = class extends b {
+  constructor() {
+    super(), this.defaultSlot = g(), this.closable = m.props.closable.default, this.compact = m.props.compact.default, this.title = "", this.skin = m.props.skin.default, this._isClosed = !1, this.close = (e) => {
+      this._isClosed = !0, this.dispatchEvent(new CustomEvent("close", { detail: { origin: e }, bubbles: !0 })), this.dispatchEvent(new CustomEvent("on-close", { detail: { origin: e }, bubbles: !0 }));
+    }, this.slotController = new u(this, this.defaultSlot), this._isClosed = !1;
+  }
+  render() {
+    const e = {
+      "pkt-messagebox": !0,
+      "pkt-messagebox--compact": this.compact,
+      [`pkt-messagebox--${this.skin}`]: this.skin,
+      "pkt-messagebox--closable": this.closable,
+      "pkt-hide": this._isClosed
+    };
+    return c`<div class=${h(e)}>
+      ${this.closable ? c`<div class="pkt-messagebox__close">
+            <button
+              @click=${this.close}
+              class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
+            >
+              <pkt-icon name="close" class="pkt-link__icon"></pkt-icon>
+            </button>
+          </div>` : d}
+      ${this.title ? c`<div class="pkt-messagebox__title">${this.title}</div>` : d}
+      <div class="pkt-messagebox__text" ${f(this.defaultSlot)}></div>
+    </div>`;
+  }
+};
+o([
+  n({ type: Boolean, reflect: !0 })
+], s.prototype, "closable", 2);
+o([
+  n({ type: Boolean, reflect: !0 })
+], s.prototype, "compact", 2);
+o([
+  n({ type: String, reflect: !0 })
+], s.prototype, "title", 2);
+o([
+  n({ type: String, reflect: !0 })
+], s.prototype, "skin", 2);
+o([
+  v()
+], s.prototype, "_isClosed", 2);
+s = o([
+  k("pkt-messagebox")
+], s);
+export {
+  s as P
+};

package/dist/{modal-DYTVJjYh.cjs → modal-Avai5eVz.cjs}

@@ -1,4 +1,4 @@
-"use strict";const c=require("./class-map-a5HUzP83.cjs"),k=require("./custom-element-B-TlBwRu.cjs"),n=require("./index-CR7t1zY9.cjs"),a=require("./ref-C2yPtMJA.cjs");require("./index-CmTjXoAb.cjs");const m="pkt-modal",u=!0,h={"background-click":{description:"Event som trigges når bakgrunnen trykkes på"},close:{description:"Event som trigges når meldingsboksen lukkes"}},g={headingText:{name:"Heading text",description:"Heading tekst på modalen",type:"string"},hideCloseButton:{name:"Gjem 'Lukk'-knapp",description:"Gjemmer lukkeknappen. Dersom denne er satt til true, vil ikke lukkeknappen vises, og dermed er det viktig at man tilbyr en annen måte som f.eks. en knapp for å lukke modalen på.",type:"boolean",default:!1},closeOnBackdropClick:{name:"Lukk modalen når bakgrunnen trykkes på",description:"Lukk modalen når bakgrunnen trykkes på",type:"boolean",default:!1},size:{name:"Størrelse",description:"Størrelsen på modalen",type:["small","medium","large"],default:"medium"}},f={default:{description:"Innholdet i meldingen. Her tilbyr vi støtteklasser for å style 1-3 knapper i modalen."}},p={name:m,"css-class":"pkt-modal",isElements:u,events:h,props:g,slots:f};var v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,i=(d,e,t,o)=>{for(var s=o>1?void 0:o?b(e,t):e,l=d.length-1,r;l>=0;l--)(r=d[l])&&(s=(o?r(e,t,s):r(s))||s);return o&&s&&v(e,t,s),s};exports.PktModal=class extends n.PktElement{constructor(){super(),this.headingText="",this.removePadding=!1,this.hideCloseButton=p.props.hideCloseButton.default,this.closeOnBackdropClick=p.props.closeOnBackdropClick.default,this.size=p.props.size.default,this.defaultSlot=a.e(),this.dialogRef=a.e(),this._isOpen=!1,this.close=(e,t=!1)=>{var l;this._isOpen=!1,t||(l=this.dialogRef.value)==null||l.close();const o=document.activeElement;o&&!this.isElementInViewport(o)&&o.scrollIntoView({behavior:"smooth",block:"nearest"}),this.dispatchEvent(new CustomEvent("close",{detail:{origin:e},bubbles:!0,composed:!0})),document.querySelector(".pkt-modal")&&document.body.classList.remove("pkt-modal--open"),this.requestUpdate()},this.showModal=e=>{var o;this._isOpen=!0,(o=this.dialogRef.value)==null||o.showModal(),document.querySelector(".pkt-modal")&&document.body.classList.add("pkt-modal--open"),this.dispatchEvent(new CustomEvent("showModal",{detail:{origin:e},bubbles:!0,composed:!0})),this.requestUpdate()},this.slotController=new a.PktSlotController(this,this.defaultSlot),this._isOpen=!1}async connectedCallback(){var e;super.connectedCallback(),document.addEventListener("keydown",this.handleKeyDown.bind(this)),document.addEventListener("click",this.handleBackdropClick.bind(this)),(e=this.dialogRef.value)==null||e.addEventListener("submit",t=>this.close(t,!0))}disconnectedCallback(){var e;super.disconnectedCallback(),document.removeEventListener("keydown",this.handleKeyDown.bind(this)),document.removeEventListener("click",this.handleBackdropClick.bind(this)),(e=this.dialogRef.value)==null||e.removeEventListener("submit",t=>this.close(t,!0))}handleKeyDown(e){e.key==="Escape"&&this.close(e)}handleBackdropClick(e){var t;this.closeOnBackdropClick&&e.target===((t=this.dialogRef)==null?void 0:t.value)&&this.close(e)}isElementInViewport(e){const t=e.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}render(){const e={"pkt-modal":!0,"pkt-modal--removePadding":this.removePadding??!1,"pkt-modal--noHeadingText":this.headingText===""||this.headingText===void 0,[`pkt-modal--${this.size}`]:this.size!==void 0},t={"pkt-modal__headingText":!0,"pkt-txt-24":!0},o={"pkt-modal__content":!0,"pkt-txt-18-light":!0};return n.x`
+"use strict";const c=require("./class-map-Boa7BqCc.cjs"),n=require("./icon-CdMQ6zBT.cjs"),k=require("./state-SKYD8kRO.cjs"),u=require("./pkt-slot-controller-Ckk_yV0j.cjs"),a=require("./ref-DCOsLZQg.cjs"),m="pkt-modal",h=!0,g={"background-click":{description:"Event som trigges når bakgrunnen trykkes på"},close:{description:"Event som trigges når meldingsboksen lukkes"}},f={headingText:{name:"Heading text",description:"Heading tekst på modalen",type:"string"},hideCloseButton:{name:"Gjem 'Lukk'-knapp",description:"Gjemmer lukkeknappen. Dersom denne er satt til true, vil ikke lukkeknappen vises, og dermed er det viktig at man tilbyr en annen måte som f.eks. en knapp for å lukke modalen på.",type:"boolean",default:!1},closeOnBackdropClick:{name:"Lukk modalen når bakgrunnen trykkes på",description:"Lukk modalen når bakgrunnen trykkes på",type:"boolean",default:!1},size:{name:"Størrelse",description:"Størrelsen på modalen",type:["small","medium","large"],default:"medium"}},v={default:{description:"Innholdet i meldingen. Her tilbyr vi støtteklasser for å style 1-3 knapper i modalen."}},p={name:m,"css-class":"pkt-modal",isElements:h,events:g,props:f,slots:v};var b=Object.defineProperty,y=Object.getOwnPropertyDescriptor,i=(d,e,t,o)=>{for(var s=o>1?void 0:o?y(e,t):e,l=d.length-1,r;l>=0;l--)(r=d[l])&&(s=(o?r(e,t,s):r(s))||s);return o&&s&&b(e,t,s),s};exports.PktModal=class extends n.PktElement{constructor(){super(),this.headingText="",this.removePadding=!1,this.hideCloseButton=p.props.hideCloseButton.default,this.closeOnBackdropClick=p.props.closeOnBackdropClick.default,this.size=p.props.size.default,this.defaultSlot=a.e(),this.dialogRef=a.e(),this._isOpen=!1,this.close=(e,t=!1)=>{var l;this._isOpen=!1,t||(l=this.dialogRef.value)==null||l.close();const o=document.activeElement;o&&!this.isElementInViewport(o)&&o.scrollIntoView({behavior:"smooth",block:"nearest"}),this.dispatchEvent(new CustomEvent("close",{detail:{origin:e},bubbles:!0,composed:!0})),document.querySelector(".pkt-modal")&&document.body.classList.remove("pkt-modal--open"),this.requestUpdate()},this.showModal=e=>{var o;this._isOpen=!0,(o=this.dialogRef.value)==null||o.showModal(),document.querySelector(".pkt-modal")&&document.body.classList.add("pkt-modal--open"),this.dispatchEvent(new CustomEvent("showModal",{detail:{origin:e},bubbles:!0,composed:!0})),this.requestUpdate()},this.slotController=new u.PktSlotController(this,this.defaultSlot),this._isOpen=!1}async connectedCallback(){var e;super.connectedCallback(),document.addEventListener("keydown",this.handleKeyDown.bind(this)),document.addEventListener("click",this.handleBackdropClick.bind(this)),(e=this.dialogRef.value)==null||e.addEventListener("submit",t=>this.close(t,!0))}disconnectedCallback(){var e;super.disconnectedCallback(),document.removeEventListener("keydown",this.handleKeyDown.bind(this)),document.removeEventListener("click",this.handleBackdropClick.bind(this)),(e=this.dialogRef.value)==null||e.removeEventListener("submit",t=>this.close(t,!0))}handleKeyDown(e){e.key==="Escape"&&this.close(e)}handleBackdropClick(e){var t;this.closeOnBackdropClick&&e.target===((t=this.dialogRef)==null?void 0:t.value)&&this.close(e)}isElementInViewport(e){const t=e.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}render(){const e={"pkt-modal":!0,"pkt-modal--removePadding":this.removePadding??!1,"pkt-modal--noHeadingText":this.headingText===""||this.headingText===void 0,[`pkt-modal--${this.size}`]:this.size!==void 0},t={"pkt-modal__headingText":!0,"pkt-txt-24":!0},o={"pkt-modal__content":!0,"pkt-txt-18-light":!0};return n.x`
       <dialog
         class=${c.e(e)}
         aria-modal=${this._isOpen}
@@ -27,4 +27,4 @@
           ${a.n(this.defaultSlot)}
         ></div>
       </dialog>
-    `}};i([n.n({type:String,reflect:!0})],exports.PktModal.prototype,"headingText",2);i([n.n({type:Boolean,reflect:!0})],exports.PktModal.prototype,"removePadding",2);i([n.n({type:Boolean,reflect:!0})],exports.PktModal.prototype,"hideCloseButton",2);i([n.n({type:Boolean,reflect:!0})],exports.PktModal.prototype,"closeOnBackdropClick",2);i([n.n({type:String,reflect:!0})],exports.PktModal.prototype,"size",2);i([n.r()],exports.PktModal.prototype,"_isOpen",2);exports.PktModal=i([k.t("pkt-modal")],exports.PktModal);
+    `}};i([n.n({type:String,reflect:!0})],exports.PktModal.prototype,"headingText",2);i([n.n({type:Boolean,reflect:!0})],exports.PktModal.prototype,"removePadding",2);i([n.n({type:Boolean,reflect:!0})],exports.PktModal.prototype,"hideCloseButton",2);i([n.n({type:Boolean,reflect:!0})],exports.PktModal.prototype,"closeOnBackdropClick",2);i([n.n({type:String,reflect:!0})],exports.PktModal.prototype,"size",2);i([k.r()],exports.PktModal.prototype,"_isOpen",2);exports.PktModal=i([n.t("pkt-modal")],exports.PktModal);

package/dist/{modal-3OZTPqee.js → modal-Co1YFmHi.js}

@@ -1,8 +1,8 @@
-import { e as c } from "./class-map-CBvUV2N3.js";
-import { t as g } from "./custom-element-CWfU4dcr.js";
-import { r as f, P as v, x as p, E as h, n as a } from "./index-CFDwiDTU.js";
-import { e as k, P as b, n as u } from "./ref-CaiKp3S2.js";
-import "./index-RwtTBIhT.js";
+import { e as c } from "./class-map-hz16xq5a.js";
+import { P as g, x as p, E as h, n as a, t as f } from "./icon-wUXeHiBk.js";
+import { r as v } from "./state-BfyXV7EL.js";
+import { P as b } from "./pkt-slot-controller-RJvOnbF4.js";
+import { e as k, n as u } from "./ref-DuFGTLVX.js";
 const y = "pkt-modal", _ = !0, C = {
   "background-click": {
     description: "Event som trigges når bakgrunnen trykkes på"
@@ -55,7 +55,7 @@ var B = Object.defineProperty, x = Object.getOwnPropertyDescriptor, l = (e, t, o
     (r = e[d]) && (s = (i ? r(t, o, s) : r(s)) || s);
   return i && s && B(t, o, s), s;
 };
-let n = class extends v {
+let n = class extends g {
   constructor() {
     super(), this.headingText = "", this.removePadding = !1, this.hideCloseButton = m.props.hideCloseButton.default, this.closeOnBackdropClick = m.props.closeOnBackdropClick.default, this.size = m.props.size.default, this.defaultSlot = k(), this.dialogRef = k(), this._isOpen = !1, this.close = (e, t = !1) => {
       var s;
@@ -152,10 +152,10 @@ l([
   a({ type: String, reflect: !0 })
 ], n.prototype, "size", 2);
 l([
-  f()
+  v()
 ], n.prototype, "_isOpen", 2);
 n = l([
-  g("pkt-modal")
+  f("pkt-modal")
 ], n);
 export {
   n as P

package/dist/pkt-alert.cjs

@@ -1,27 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./class-map-a5HUzP83.cjs"),k=require("./custom-element-B-TlBwRu.cjs"),t=require("./index-CR7t1zY9.cjs"),c=require("./ref-C2yPtMJA.cjs");require("./index-CmTjXoAb.cjs");const u="pkt-alert",v=!0,h={onClose:{description:"React: Klikk-event for 'Lukk'-knappen"},close:{description:"Vue: Klikk-event for 'Lukk'-knappen"}},m={title:{name:"Tittel",description:"Tittelen som vises øverst i på meldingen",type:"string"},skin:{name:"Utseende",description:"Hvordan type melding er dette?",type:["info","success","warning","error"],default:"info"},date:{name:"Sist oppdatert",description:"Dato som vises nederst i på meldingen",type:"string"},ariaLive:{name:"aria-live",description:"Hvordan skal skjermleseren lese opp meldingen?",type:["off","polite","assertive"],default:"polite"},compact:{name:"Kompakt",description:"Gjør meldingen mindre",type:"boolean",default:!1},closeAlert:{name:"Vis 'Lukk'-knapp",description:"Viser 'Lukk'-knappen",type:"boolean",default:!1}},f={default:{description:"Innholdet i meldingen"}},n={name:u,"css-class":"pkt-alert","dark-mode":!0,isElement:v,events:h,props:m,slots:f};var b=Object.defineProperty,y=Object.getOwnPropertyDescriptor,i=(a,e,r,l)=>{for(var s=l>1?void 0:l?y(e,r):e,o=a.length-1,p;o>=0;o--)(p=a[o])&&(s=(l?p(e,r,s):p(s))||s);return l&&s&&b(e,r,s),s};exports.PktAlert=class extends t.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.compact=n.props.compact.default,this.title="",this.skin=n.props.skin.default,this.ariaLive=n.props.ariaLive.default,this["aria-live"]=null,this.closeAlert=n.props.closeAlert.default,this.date=null,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 c.PktSlotController(this,this.defaultSlot),this._isClosed=!1}connectedCallback(){super.connectedCallback(),this["aria-live"]=this.getAttribute("aria-live")||this.ariaLive}attributeChangedCallback(e,r,l){e==="ariaLive"&&(this["aria-live"]=l)}updated(e){super.updated(e),e.has("ariaLive")&&(this["aria-live"]=this.ariaLive)}render(){const e={"pkt-alert":!0,"pkt-alert--compact":this.compact,[`pkt-alert--${this.skin}`]:this.skin,"pkt-hide":this._isClosed};return t.x`
-      <div class=${d.e(e)}>
-        <pkt-icon
-          class="pkt-alert__icon"
-          name=${this.skin==="info"?"alert-information":`alert-${this.skin}`}
-        ></pkt-icon>
-
-        ${this.closeAlert?t.x`
-              <div class="pkt-alert__close">
-                <button
-                  type="button"
-                  class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
-                  tabindex="0"
-                  aria-label="close"
-                  @click=${this.close}
-                >
-                  <pkt-icon name="close" class="pkt-btn__icon" aria-hidden="true"></pkt-icon>
-                </button>
-              </div>
-            `:t.E}
-        ${this.title?t.x`<div class="pkt-alert__title">${this.title}</div>`:t.E}
-
-        <div class="pkt-alert__text" ${c.n(this.defaultSlot)}></div>
-
-        ${this.date?t.x`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>`:t.E}
-      </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.r()],exports.PktAlert.prototype,"_isClosed",2);exports.PktAlert=i([k.t("pkt-alert")],exports.PktAlert);
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./alert-BbVWu2lm.cjs"),t=e.PktAlert;Object.defineProperty(exports,"PktAlert",{enumerable:!0,get:()=>e.PktAlert});exports.default=t;

package/dist/pkt-alert.js

@@ -1,159 +1,6 @@
-import { e as k } from "./class-map-CBvUV2N3.js";
-import { t as m } from "./custom-element-CWfU4dcr.js";
-import { r as v, P as h, x as n, E as u, n as l } from "./index-CFDwiDTU.js";
-import { e as f, P as b, n as y } from "./ref-CaiKp3S2.js";
-import "./index-RwtTBIhT.js";
-const _ = "pkt-alert", g = !0, C = {
-  onClose: {
-    description: "React: Klikk-event for 'Lukk'-knappen"
-  },
-  close: {
-    description: "Vue: Klikk-event for 'Lukk'-knappen"
-  }
-}, $ = {
-  title: {
-    name: "Tittel",
-    description: "Tittelen som vises øverst i på meldingen",
-    type: "string"
-  },
-  skin: {
-    name: "Utseende",
-    description: "Hvordan type melding er dette?",
-    type: [
-      "info",
-      "success",
-      "warning",
-      "error"
-    ],
-    default: "info"
-  },
-  date: {
-    name: "Sist oppdatert",
-    description: "Dato som vises nederst i på meldingen",
-    type: "string"
-  },
-  ariaLive: {
-    name: "aria-live",
-    description: "Hvordan skal skjermleseren lese opp meldingen?",
-    type: [
-      "off",
-      "polite",
-      "assertive"
-    ],
-    default: "polite"
-  },
-  compact: {
-    name: "Kompakt",
-    description: "Gjør meldingen mindre",
-    type: "boolean",
-    default: !1
-  },
-  closeAlert: {
-    name: "Vis 'Lukk'-knapp",
-    description: "Viser 'Lukk'-knappen",
-    type: "boolean",
-    default: !1
-  }
-}, L = {
-  default: {
-    description: "Innholdet i meldingen"
-  }
-}, p = {
-  name: _,
-  "css-class": "pkt-alert",
-  "dark-mode": !0,
-  isElement: g,
-  events: C,
-  props: $,
-  slots: L
-};
-var S = Object.defineProperty, E = Object.getOwnPropertyDescriptor, i = (t, r, o, a) => {
-  for (var s = a > 1 ? void 0 : a ? E(r, o) : r, c = t.length - 1, d; c >= 0; c--)
-    (d = t[c]) && (s = (a ? d(r, o, s) : d(s)) || s);
-  return a && s && S(r, o, s), s;
-};
-let e = class extends h {
-  constructor() {
-    super(), this.defaultSlot = f(), this.compact = p.props.compact.default, this.title = "", this.skin = p.props.skin.default, this.ariaLive = p.props.ariaLive.default, this["aria-live"] = null, this.closeAlert = p.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 b(this, this.defaultSlot), this._isClosed = !1;
-  }
-  connectedCallback() {
-    super.connectedCallback(), this["aria-live"] = this.getAttribute("aria-live") || this.ariaLive;
-  }
-  attributeChangedCallback(t, r, o) {
-    t === "ariaLive" && (this["aria-live"] = o);
-  }
-  updated(t) {
-    super.updated(t), t.has("ariaLive") && (this["aria-live"] = this.ariaLive);
-  }
-  render() {
-    const t = {
-      "pkt-alert": !0,
-      "pkt-alert--compact": this.compact,
-      [`pkt-alert--${this.skin}`]: this.skin,
-      "pkt-hide": this._isClosed
-    };
-    return n`
-      <div class=${k(t)}>
-        <pkt-icon
-          class="pkt-alert__icon"
-          name=${this.skin === "info" ? "alert-information" : `alert-${this.skin}`}
-        ></pkt-icon>
-
-        ${this.closeAlert ? n`
-              <div class="pkt-alert__close">
-                <button
-                  type="button"
-                  class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
-                  tabindex="0"
-                  aria-label="close"
-                  @click=${this.close}
-                >
-                  <pkt-icon name="close" class="pkt-btn__icon" aria-hidden="true"></pkt-icon>
-                </button>
-              </div>
-            ` : u}
-        ${this.title ? n`<div class="pkt-alert__title">${this.title}</div>` : u}
-
-        <div class="pkt-alert__text" ${y(this.defaultSlot)}></div>
-
-        ${this.date ? n`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>` : u}
-      </div>
-    `;
-  }
-};
-i([
-  l({ type: Boolean, reflect: !1 })
-], e.prototype, "compact", 2);
-i([
-  l({ type: String, reflect: !0 })
-], e.prototype, "title", 2);
-i([
-  l({ type: String, reflect: !0 })
-], e.prototype, "skin", 2);
-i([
-  l({ type: String })
-], e.prototype, "ariaLive", 2);
-i([
-  l({ type: String, reflect: !0 })
-], e.prototype, "aria-live", 2);
-i([
-  l({ type: Boolean, reflect: !0 })
-], e.prototype, "closeAlert", 2);
-i([
-  l({ type: String, reflect: !0 })
-], e.prototype, "date", 2);
-i([
-  v()
-], e.prototype, "_isClosed", 2);
-e = i([
-  m("pkt-alert")
-], e);
+import { P as t } from "./alert-Dh6A96vo.js";
+const e = t;
 export {
-  e as PktAlert
+  t as PktAlert,
+  e as default
 };

package/dist/pkt-calendar.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("./index-CR7t1zY9.cjs");require("./converters-DhM11VlY.cjs");require("./custom-element-B-TlBwRu.cjs");require("./class-map-a5HUzP83.cjs");const e=require("./index-tvpcg-ad.cjs");require("./index-CmTjXoAb.cjs");Object.defineProperty(exports,"PktCalendar",{enumerable:!0,get:()=>e.PktCalendar});
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./calendar-QSulz7im.cjs"),t=e.PktCalendar;Object.defineProperty(exports,"PktCalendar",{enumerable:!0,get:()=>e.PktCalendar});exports.default=t;

package/dist/pkt-calendar.js

@@ -1,9 +1,6 @@
-import "./index-CFDwiDTU.js";
-import "./converters-DNCwIFwr.js";
-import "./custom-element-CWfU4dcr.js";
-import "./class-map-CBvUV2N3.js";
-import { P as e } from "./index-D2jSRMrn.js";
-import "./index-RwtTBIhT.js";
+import { P as a } from "./calendar-BUqcNvfI.js";
+const r = a;
 export {
-  e as PktCalendar
+  a as PktCalendar,
+  r as default
 };

package/dist/pkt-card.cjs

@@ -1,23 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./class-map-a5HUzP83.cjs"),g=require("./custom-element-B-TlBwRu.cjs"),t=require("./index-CR7t1zY9.cjs"),d=require("./ref-C2yPtMJA.cjs");require("./index-CmTjXoAb.cjs");require("./pkt-tag.cjs");const u="pkt-card",k=!0,h={heading:{type:"string",name:"Heading",description:"Tittel på kortet"},subheading:{type:"string",name:"Subheading",description:"Undertittel på kortet"},tags:{type:"array",description:"Liste av tags på kortet. Tar inn en array med objekter med følgende stringproperties: skin, iconName, ariaLabel, text",name:"Tags",items:{type:"object",properties:{skin:{type:["blue","green","red","yellow"],description:"Farge på tag"},iconName:{type:"icon",description:"Id på ikonet du ønsker å bruke til tag"},ariaLabel:{type:"string",description:"Tekst for aria-label"},text:{type:"string",description:"Tekst på tag",required:!0}}}},skin:{type:["outlined","gray","blue","beige","green"],name:"Skin",description:"Farge på kortet",default:"outlined"},direction:{type:["landscape","portrait"],name:"Direction",description:"Retningen innholdet skal ligge i forhold til kortet",default:"portrait"},image:{type:"object",name:"Bilde",description:"Bilde på kortet. Tar inn et objekt av typen {src: string, alt: string}. src er stien til bildet, og alt er tekst for aria-label.",properties:{src:{type:"string",description:"Bilde på kortet",required:!0},alt:{type:"string",description:"Tekst for aria-label",required:!0}}}},m={default:{description:"Innholdet i kortet"}},l={name:u,"css-class":"pkt-card",isElement:k,props:h,slots:m};var y=Object.defineProperty,b=Object.getOwnPropertyDescriptor,r=(a,i,s,n)=>{for(var e=n>1?void 0:n?b(i,s):i,o=a.length-1,p;o>=0;o--)(p=a[o])&&(e=(n?p(i,s,e):p(e))||e);return n&&e&&y(i,s,e),e};exports.PktCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=d.e(),this.skin=l.props.skin.default,this.direction=l.props.direction.default,this.image={src:"",alt:""},this.heading="",this.subheading="",this.tags=[],this.slotController=new d.PktSlotController(this,this.defaultSlot)}connectedCallback(){super.connectedCallback()}render(){const i={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.direction}`]:this.direction};return t.x`
-      <div class=${c.e(i)}>
-        ${this.image.src&&t.x`
-          <div class="pkt-card__image">
-            <img src=${this.image.src} alt=${this.image.alt||""} />
-          </div>
-        `}
-        <div class="pkt-card__wrapper">
-          ${this.tags.length>0?t.x`
-                <div class="pkt-card__tags">
-                  ${this.tags.map(s=>t.x`
-                      <pkt-tag textStyle="normal-text" size="medium" skin=${s.skin}>
-                        ${s.text}
-                      </pkt-tag>
-                    `)}
-                </div>
-              `:t.E}
-          ${this.heading&&t.x`<h3 class="pkt-txt-30-medium">${this.heading}</h3>`}
-          ${this.subheading&&t.x`<p class="pkt-txt-20-light">${this.subheading}</p>`}
-          ${this.defaultSlot&&t.x`<div class="pkt-card__content" ${d.n(this.defaultSlot)}></div>`}
-        </div>
-      </div>
-    `}};r([t.n({type:String,reflect:!0})],exports.PktCard.prototype,"skin",2);r([t.n({type:String,reflect:!0})],exports.PktCard.prototype,"direction",2);r([t.n({type:Object,reflect:!0})],exports.PktCard.prototype,"image",2);r([t.n({type:String,reflect:!0})],exports.PktCard.prototype,"heading",2);r([t.n({type:String,reflect:!0})],exports.PktCard.prototype,"subheading",2);r([t.n({type:Array,reflect:!0})],exports.PktCard.prototype,"tags",2);exports.PktCard=r([g.t("pkt-card")],exports.PktCard);
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./card-B0GPdG5M.cjs"),t=e.PktCard;Object.defineProperty(exports,"PktCard",{enumerable:!0,get:()=>e.PktCard});exports.default=t;