@oslokommune/punkt-elements 16.7.3 → 16.7.4

package/dist/input-wrapper-BRuVELpK.cjs

@@ -0,0 +1,54 @@
+const e=require(`./element-DjtxO-1r.cjs`),t=require(`./class-map-CJ-msbHs.cjs`),n=require(`./element-with-slot-CWoTGA1B.cjs`);require(`./alert-BEEnTiCb.cjs`);const r=require(`./icon-Dr8sfT2X.cjs`),i=require(`./if-defined-XKOD_t_V.cjs`),a=require(`./utils-CjAbIttF.cjs`),o=require(`./booleanish-jJLlnr6-.cjs`),s=require(`./input-wrapper-Dwd-_sKm.cjs`);require(`./helptext-D-3QfZv5.cjs`);var c=class extends n.t{constructor(...e){super(...e),this.forId=a.n(),this.label=``,this.helptext=null,this.helptextDropdown=null,this.helptextDropdownButton=null,this.counter=s.t.props.counter.default,this.counterCurrent=0,this.counterMaxLength=0,this.counterError=null,this.counterPosition=`bottom`,this.optionalTag=s.t.props.optionalTag.default,this.optionalText=s.t.props.optionalText.default,this.requiredTag=s.t.props.requiredTag.default,this.requiredText=s.t.props.requiredText.default,this.tagText=null,this.hasError=s.t.props.hasError.default,this.errorMessage=``,this.disabled=s.t.props.disabled.default,this.inline=s.t.props.inline.default,this.ariaDescribedby=void 0,this.hasFieldset=s.t.props.hasFieldset.default,this.role=`group`,this.useWrapper=s.t.props.useWrapper.default}updated(e){super.updated(e)}render(){let a={"pkt-inputwrapper":!0,"pkt-inputwrapper--error":this.hasError,"pkt-inputwrapper--disabled":this.disabled,"pkt-inputwrapper--inline":this.inline},o=`pkt-tag pkt-tag--small pkt-tag--thin-text`,c=this.ariaDescribedby?this.ariaDescribedby:this.helptext?`${this.forId}-helptext`:e.l,l=()=>e.d`
+        ${this.tagText?e.d`<span class=${o+` pkt-tag--gray`}>${this.tagText}</span>`:e.l}
+        ${this.optionalTag?e.d`<span class=${o+` pkt-tag--blue-light`}>${this.optionalText}</span>`:e.l}
+        ${this.requiredTag?e.d`<span class=${o+` pkt-tag--beige`}>${this.requiredText}</span>`:e.l}
+      `,u=()=>this.useWrapper?this.hasFieldset?e.d`<legend
+            class="pkt-inputwrapper__legend"
+            id="${this.forId}-label"
+            @click=${this.handleLabelClick}
+          >
+            ${this.label} ${l()}
+          </legend>`:e.d`<label
+            class="pkt-inputwrapper__label"
+            for="${this.forId}"
+            aria-describedby="${c}"
+            id="${this.forId}-label"
+            @click=${this.handleLabelClick}
+            >${this.label}${l()}</label
+          >`:e.d`<label
+          for="${this.forId}"
+          class="pkt-sr-only"
+          aria-describedby="${c}"
+          id="${this.forId}-label"
+        >
+          ${this.label}
+        </label>`,d=()=>e.d`
+        <pkt-helptext
+          class="${i.t(this.useWrapper?void 0:`pkt-hide`)}"
+          .forId=${this.forId}
+          .helptext=${this.helptext}
+          .helptextDropdown=${this.helptextDropdown}
+          .helptextDropdownButton=${this.helptextDropdownButton||s.t.props.helptextDropdownButton.default}
+          @toggleHelpText=${e=>{this.toggleDropdown(e)}}
+        >${n.n(this,`helptext`)}</pkt-helptext>
+      `,f=()=>this.counter?e.d`<div class="pkt-input__counter" aria-live="polite" aria-atomic="true">
+          ${this.counterError?this.counterError:e.l} ${this.counterCurrent||0}
+          ${this.counterMaxLength?`/${this.counterMaxLength}`:e.l}
+        </div>`:e.l,p=()=>this.hasError&&this.errorMessage?e.d`<pkt-alert
+          skin="error"
+          compact
+          id=${`${this.forId}-error`}
+          aria-live="assertive"
+          aria-atomic="true"
+        >
+          ${r.r(this.errorMessage)}
+        </pkt-alert>`:e.l,m=()=>e.d`
+        ${u()} 
+        ${d()}
+        ${this.counterPosition===`top`?f():e.l}
+        <div class="pkt-contents">${n.n(this)}</div>
+        ${this.counterPosition===`bottom`?f():e.l} 
+        ${p()}
+      `;return e.d`<div class=${t.t(a)}>${this.hasFieldset?e.d`<fieldset class="pkt-inputwrapper__fieldset" aria-describedby="${c}">
+            ${m()}
+          </fieldset>`:e.d`<div class="pkt-inputwrapper__fieldset">${m()}</div>`}</div> `}toggleDropdown(e){this.dispatchEvent(new CustomEvent(`toggleHelpText`,{bubbles:!1,detail:{isOpen:e.detail.isOpen}}))}handleLabelClick(){this.dispatchEvent(new CustomEvent(`labelClick`,{bubbles:!0,composed:!0,detail:`label clicked`}))}};e.r([e.s({type:String})],c.prototype,`forId`,void 0),e.r([e.s({type:String})],c.prototype,`label`,void 0),e.r([e.s({type:String})],c.prototype,`helptext`,void 0),e.r([e.s({type:String})],c.prototype,`helptextDropdown`,void 0),e.r([e.s({type:String})],c.prototype,`helptextDropdownButton`,void 0),e.r([e.s({type:Boolean})],c.prototype,`counter`,void 0),e.r([e.s({type:Number})],c.prototype,`counterCurrent`,void 0),e.r([e.s({type:Number})],c.prototype,`counterMaxLength`,void 0),e.r([e.s({type:String})],c.prototype,`counterError`,void 0),e.r([e.s({type:String,reflect:!1})],c.prototype,`counterPosition`,void 0),e.r([e.s({type:Boolean})],c.prototype,`optionalTag`,void 0),e.r([e.s({type:String})],c.prototype,`optionalText`,void 0),e.r([e.s({type:Boolean})],c.prototype,`requiredTag`,void 0),e.r([e.s({type:String})],c.prototype,`requiredText`,void 0),e.r([e.s({type:String})],c.prototype,`tagText`,void 0),e.r([e.s({type:Boolean})],c.prototype,`hasError`,void 0),e.r([e.s({type:String})],c.prototype,`errorMessage`,void 0),e.r([e.s({type:Boolean})],c.prototype,`disabled`,void 0),e.r([e.s({type:Boolean})],c.prototype,`inline`,void 0),e.r([e.s({type:String})],c.prototype,`ariaDescribedby`,void 0),e.r([e.s({type:Boolean})],c.prototype,`hasFieldset`,void 0),e.r([e.s({type:String,reflect:!0})],c.prototype,`role`,void 0),e.r([e.s({type:Boolean,reflect:!0,converter:o.t})],c.prototype,`useWrapper`,void 0);try{e.c(`pkt-input-wrapper`)(c)}catch{console.warn(`Forsøker å definere <pkt-input-wrapper>, men den er allerede definert`)}var l=c;Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return l}});

package/dist/input-wrapper-CDyHTR1V.js

@@ -0,0 +1,164 @@
+var e = {
+	name: "pkt-input-wrapper",
+	react: "PktInputWrapper",
+	"css-class": "pkt-inputwrapper",
+	isElement: !0,
+	isPureReact: !0,
+	events: { toggleHelpText: { description: "Event for å vise eller skjule hjelpetekst i dropdown" } },
+	slots: { default: { description: "Innholdet i input-wrapperen, som kan være et skjemaelement eller en annen komponent" } },
+	props: {
+		forId: {
+			name: "For ID",
+			description: "Id-en til skjemaelementet som dette wrapper rundt",
+			type: "string",
+			required: !0,
+			category: "tech"
+		},
+		label: {
+			name: "Merkelapp",
+			description: "Merkelapp for skjemaelementet",
+			type: "string",
+			required: !0,
+			category: "contents"
+		},
+		helptext: {
+			name: "Hjelpetekst",
+			description: "Hjelpetekst for skjemaelementet",
+			type: "string",
+			category: "contents"
+		},
+		helptextDropdown: {
+			name: "Hjelpetekst i dropdown",
+			description: "Hjelpetekst som vises i ekspanderende felt",
+			type: "string",
+			category: "contents"
+		},
+		helptextDropdownButton: {
+			name: "Tekst i hjelpetekst-knapp",
+			description: "Tekst som vises i knappen for å vise hjelpetekst i dropdown",
+			default: "Les mer <span class='pkt-sr-only'>om feltet</span>",
+			type: "string",
+			category: "contents"
+		},
+		ariaDescribedby: {
+			name: "aria-describedby",
+			description: "Id-en til elementet som beskriver skjemaelementet",
+			type: "string",
+			category: "accessibility"
+		},
+		counter: {
+			name: "Teller",
+			description: "Teller for antall tegn i skjemaelementet",
+			type: "boolean",
+			default: !1,
+			category: "ui"
+		},
+		counterCurrent: {
+			name: "Tellerverdi",
+			description: "Tellerens nåværende verdi",
+			type: "number",
+			category: "ui",
+			showIf: { counter: !0 }
+		},
+		counterMaxLength: {
+			name: "Maks tegn i teller",
+			description: "Maks antall tegn som kan skrives i skjemaelementet",
+			type: "number",
+			category: "ui",
+			showIf: { counter: !0 }
+		},
+		counterPosition: {
+			name: "Tellerplassering",
+			description: "Telleren sin plassering i forhold til elementet",
+			type: ["top", "bottom"],
+			default: "bottom",
+			category: "ui",
+			showIf: { counter: !0 }
+		},
+		optionalTag: {
+			name: "Vise valgfritt-merking",
+			description: "Viser en merking som indikerer at feltet er valgfritt",
+			type: "boolean",
+			default: !1,
+			category: "ui"
+		},
+		optionalText: {
+			name: "Valgfritt-tekst",
+			description: "Tekst som vises i valgfritt-merkingen",
+			type: "string",
+			default: "Valgfritt",
+			category: "contents"
+		},
+		requiredTag: {
+			name: "Vise påkrevd-merking",
+			description: "Viser en merking som indikerer at feltet er påkrevd",
+			type: "boolean",
+			default: !1,
+			category: "ui"
+		},
+		requiredText: {
+			name: "Påkrevd-tekst",
+			description: "Tekst som vises i påkrevd-merkingen",
+			type: "string",
+			default: "Må fylles ut",
+			category: "contents"
+		},
+		tagText: {
+			type: "string",
+			name: "Tag-tekst",
+			description: "Tekst som vises i en tag ved siden av label",
+			category: "ui"
+		},
+		hasError: {
+			name: "Feil",
+			description: "Indikerer at skjemaelementet har en feil",
+			type: "boolean",
+			default: !1,
+			category: "ui"
+		},
+		errorMessage: {
+			name: "Feilmelding",
+			description: "Feilmelding som vises når skjemaelementet har en feil",
+			type: "string",
+			category: "contents"
+		},
+		disabled: {
+			name: "Deaktivert",
+			description: "Indikerer at skjemaelementet er deaktivert",
+			type: "boolean",
+			default: !1,
+			category: "tech"
+		},
+		inline: {
+			name: "Inline",
+			description: "Indikerer at skjemaelementet skal flyte sammen med sidens innhold",
+			type: "boolean",
+			default: !1,
+			category: "ui"
+		},
+		hasFieldset: {
+			name: "Er fieldset",
+			description: "Indikerer at innholdet er et fieldset",
+			type: "boolean",
+			default: !1,
+			category: "ui"
+		},
+		useWrapper: {
+			name: "Bruk wrapper",
+			description: "Indikerer om skjemaelementet skal bruke en wrapper",
+			type: "boolean",
+			displayAsFalse: !0,
+			default: !0,
+			category: "ui"
+		},
+		role: {
+			name: "Rolle",
+			description: "Rollen til elementet",
+			type: "string",
+			default: "group",
+			category: "accessibility"
+		}
+	}
+};
+//#endregion
+export { e as t };

package/dist/input-wrapper-Dwd-_sKm.cjs

@@ -0,0 +1 @@
+var e={name:`pkt-input-wrapper`,react:`PktInputWrapper`,"css-class":`pkt-inputwrapper`,isElement:!0,isPureReact:!0,events:{toggleHelpText:{description:`Event for å vise eller skjule hjelpetekst i dropdown`}},slots:{default:{description:`Innholdet i input-wrapperen, som kan være et skjemaelement eller en annen komponent`}},props:{forId:{name:`For ID`,description:`Id-en til skjemaelementet som dette wrapper rundt`,type:`string`,required:!0,category:`tech`},label:{name:`Merkelapp`,description:`Merkelapp for skjemaelementet`,type:`string`,required:!0,category:`contents`},helptext:{name:`Hjelpetekst`,description:`Hjelpetekst for skjemaelementet`,type:`string`,category:`contents`},helptextDropdown:{name:`Hjelpetekst i dropdown`,description:`Hjelpetekst som vises i ekspanderende felt`,type:`string`,category:`contents`},helptextDropdownButton:{name:`Tekst i hjelpetekst-knapp`,description:`Tekst som vises i knappen for å vise hjelpetekst i dropdown`,default:`Les mer <span class='pkt-sr-only'>om feltet</span>`,type:`string`,category:`contents`},ariaDescribedby:{name:`aria-describedby`,description:`Id-en til elementet som beskriver skjemaelementet`,type:`string`,category:`accessibility`},counter:{name:`Teller`,description:`Teller for antall tegn i skjemaelementet`,type:`boolean`,default:!1,category:`ui`},counterCurrent:{name:`Tellerverdi`,description:`Tellerens nåværende verdi`,type:`number`,category:`ui`,showIf:{counter:!0}},counterMaxLength:{name:`Maks tegn i teller`,description:`Maks antall tegn som kan skrives i skjemaelementet`,type:`number`,category:`ui`,showIf:{counter:!0}},counterPosition:{name:`Tellerplassering`,description:`Telleren sin plassering i forhold til elementet`,type:[`top`,`bottom`],default:`bottom`,category:`ui`,showIf:{counter:!0}},optionalTag:{name:`Vise valgfritt-merking`,description:`Viser en merking som indikerer at feltet er valgfritt`,type:`boolean`,default:!1,category:`ui`},optionalText:{name:`Valgfritt-tekst`,description:`Tekst som vises i valgfritt-merkingen`,type:`string`,default:`Valgfritt`,category:`contents`},requiredTag:{name:`Vise påkrevd-merking`,description:`Viser en merking som indikerer at feltet er påkrevd`,type:`boolean`,default:!1,category:`ui`},requiredText:{name:`Påkrevd-tekst`,description:`Tekst som vises i påkrevd-merkingen`,type:`string`,default:`Må fylles ut`,category:`contents`},tagText:{type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},hasError:{name:`Feil`,description:`Indikerer at skjemaelementet har en feil`,type:`boolean`,default:!1,category:`ui`},errorMessage:{name:`Feilmelding`,description:`Feilmelding som vises når skjemaelementet har en feil`,type:`string`,category:`contents`},disabled:{name:`Deaktivert`,description:`Indikerer at skjemaelementet er deaktivert`,type:`boolean`,default:!1,category:`tech`},inline:{name:`Inline`,description:`Indikerer at skjemaelementet skal flyte sammen med sidens innhold`,type:`boolean`,default:!1,category:`ui`},hasFieldset:{name:`Er fieldset`,description:`Indikerer at innholdet er et fieldset`,type:`boolean`,default:!1,category:`ui`},useWrapper:{name:`Bruk wrapper`,description:`Indikerer om skjemaelementet skal bruke en wrapper`,type:`boolean`,displayAsFalse:!0,default:!0,category:`ui`},role:{name:`Rolle`,description:`Rollen til elementet`,type:`string`,default:`group`,category:`accessibility`}}};Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return e}});

package/dist/input-wrapper-YfTmpSSY.js

@@ -0,0 +1,117 @@
+import { c as e, d as t, l as n, r, s as i } from "./element-cZ85T_aa.js";
+import { t as a } from "./class-map-C8HuhNzZ.js";
+import { n as o, t as s } from "./element-with-slot-4J2o3SeU.js";
+import "./alert-ePJuDtmm.js";
+import { r as c } from "./icon-Co72KtgF.js";
+import { t as l } from "./if-defined-Cjj8qN-Z.js";
+import { n as u } from "./utils-CUqCKGvp.js";
+import { t as d } from "./booleanish-BmcOU-43.js";
+import { t as f } from "./input-wrapper-CDyHTR1V.js";
+import "./helptext-CCBKKLus.js";
+//#region src/components/input-wrapper/input-wrapper.ts
+var p = class extends s {
+	constructor(...e) {
+		super(...e), this.forId = u(), this.label = "", this.helptext = null, this.helptextDropdown = null, this.helptextDropdownButton = null, this.counter = f.props.counter.default, this.counterCurrent = 0, this.counterMaxLength = 0, this.counterError = null, this.counterPosition = "bottom", this.optionalTag = f.props.optionalTag.default, this.optionalText = f.props.optionalText.default, this.requiredTag = f.props.requiredTag.default, this.requiredText = f.props.requiredText.default, this.tagText = null, this.hasError = f.props.hasError.default, this.errorMessage = "", this.disabled = f.props.disabled.default, this.inline = f.props.inline.default, this.ariaDescribedby = void 0, this.hasFieldset = f.props.hasFieldset.default, this.role = "group", this.useWrapper = f.props.useWrapper.default;
+	}
+	updated(e) {
+		super.updated(e);
+	}
+	render() {
+		let e = {
+			"pkt-inputwrapper": !0,
+			"pkt-inputwrapper--error": this.hasError,
+			"pkt-inputwrapper--disabled": this.disabled,
+			"pkt-inputwrapper--inline": this.inline
+		}, r = "pkt-tag pkt-tag--small pkt-tag--thin-text", i = this.ariaDescribedby ? this.ariaDescribedby : this.helptext ? `${this.forId}-helptext` : n, s = () => t`
+        ${this.tagText ? t`<span class=${r + " pkt-tag--gray"}>${this.tagText}</span>` : n}
+        ${this.optionalTag ? t`<span class=${r + " pkt-tag--blue-light"}>${this.optionalText}</span>` : n}
+        ${this.requiredTag ? t`<span class=${r + " pkt-tag--beige"}>${this.requiredText}</span>` : n}
+      `, u = () => this.useWrapper ? this.hasFieldset ? t`<legend
+            class="pkt-inputwrapper__legend"
+            id="${this.forId}-label"
+            @click=${this.handleLabelClick}
+          >
+            ${this.label} ${s()}
+          </legend>` : t`<label
+            class="pkt-inputwrapper__label"
+            for="${this.forId}"
+            aria-describedby="${i}"
+            id="${this.forId}-label"
+            @click=${this.handleLabelClick}
+            >${this.label}${s()}</label
+          >` : t`<label
+          for="${this.forId}"
+          class="pkt-sr-only"
+          aria-describedby="${i}"
+          id="${this.forId}-label"
+        >
+          ${this.label}
+        </label>`, d = () => t`
+        <pkt-helptext
+          class="${l(this.useWrapper ? void 0 : "pkt-hide")}"
+          .forId=${this.forId}
+          .helptext=${this.helptext}
+          .helptextDropdown=${this.helptextDropdown}
+          .helptextDropdownButton=${this.helptextDropdownButton || f.props.helptextDropdownButton.default}
+          @toggleHelpText=${(e) => {
+			this.toggleDropdown(e);
+		}}
+        >${o(this, "helptext")}</pkt-helptext>
+      `, p = () => this.counter ? t`<div class="pkt-input__counter" aria-live="polite" aria-atomic="true">
+          ${this.counterError ? this.counterError : n} ${this.counterCurrent || 0}
+          ${this.counterMaxLength ? `/${this.counterMaxLength}` : n}
+        </div>` : n, m = () => this.hasError && this.errorMessage ? t`<pkt-alert
+          skin="error"
+          compact
+          id=${`${this.forId}-error`}
+          aria-live="assertive"
+          aria-atomic="true"
+        >
+          ${c(this.errorMessage)}
+        </pkt-alert>` : n, h = () => t`
+        ${u()} 
+        ${d()}
+        ${this.counterPosition === "top" ? p() : n}
+        <div class="pkt-contents">${o(this)}</div>
+        ${this.counterPosition === "bottom" ? p() : n} 
+        ${m()}
+      `;
+		return t`<div class=${a(e)}>${this.hasFieldset ? t`<fieldset class="pkt-inputwrapper__fieldset" aria-describedby="${i}">
+            ${h()}
+          </fieldset>` : t`<div class="pkt-inputwrapper__fieldset">${h()}</div>`}</div> `;
+	}
+	toggleDropdown(e) {
+		this.dispatchEvent(new CustomEvent("toggleHelpText", {
+			bubbles: !1,
+			detail: { isOpen: e.detail.isOpen }
+		}));
+	}
+	handleLabelClick() {
+		this.dispatchEvent(new CustomEvent("labelClick", {
+			bubbles: !0,
+			composed: !0,
+			detail: "label clicked"
+		}));
+	}
+};
+r([i({ type: String })], p.prototype, "forId", void 0), r([i({ type: String })], p.prototype, "label", void 0), r([i({ type: String })], p.prototype, "helptext", void 0), r([i({ type: String })], p.prototype, "helptextDropdown", void 0), r([i({ type: String })], p.prototype, "helptextDropdownButton", void 0), r([i({ type: Boolean })], p.prototype, "counter", void 0), r([i({ type: Number })], p.prototype, "counterCurrent", void 0), r([i({ type: Number })], p.prototype, "counterMaxLength", void 0), r([i({ type: String })], p.prototype, "counterError", void 0), r([i({
+	type: String,
+	reflect: !1
+})], p.prototype, "counterPosition", void 0), r([i({ type: Boolean })], p.prototype, "optionalTag", void 0), r([i({ type: String })], p.prototype, "optionalText", void 0), r([i({ type: Boolean })], p.prototype, "requiredTag", void 0), r([i({ type: String })], p.prototype, "requiredText", void 0), r([i({ type: String })], p.prototype, "tagText", void 0), r([i({ type: Boolean })], p.prototype, "hasError", void 0), r([i({ type: String })], p.prototype, "errorMessage", void 0), r([i({ type: Boolean })], p.prototype, "disabled", void 0), r([i({ type: Boolean })], p.prototype, "inline", void 0), r([i({ type: String })], p.prototype, "ariaDescribedby", void 0), r([i({ type: Boolean })], p.prototype, "hasFieldset", void 0), r([i({
+	type: String,
+	reflect: !0
+})], p.prototype, "role", void 0), r([i({
+	type: Boolean,
+	reflect: !0,
+	converter: d
+})], p.prototype, "useWrapper", void 0);
+try {
+	e("pkt-input-wrapper")(p);
+} catch {
+	console.warn("Forsøker å definere <pkt-input-wrapper>, men den er allerede definert");
+}
+//#endregion
+//#region src/components/input-wrapper/index.ts
+var m = p;
+//#endregion
+export { p as n, m as t };

package/dist/link-CKAFMz9j.js

@@ -0,0 +1,89 @@
+import { c as e, d as t, l as n, r, s as i } from "./element-cZ85T_aa.js";
+import { t as a } from "./class-map-C8HuhNzZ.js";
+import { n as o, t as s } from "./element-with-slot-4J2o3SeU.js";
+import "./icon-Co72KtgF.js";
+var c = {
+	name: "pkt-link",
+	react: "PktLink",
+	"css-class": "pkt-link",
+	"dark-mode": !0,
+	isElement: !0,
+	props: {
+		href: {
+			name: "URL",
+			description: "URL til lenken",
+			type: "string",
+			default: "#",
+			category: "contents"
+		},
+		target: {
+			name: "Mål",
+			description: "Mål for lenken",
+			type: [
+				"_blank",
+				"_self",
+				"_parent",
+				"_top"
+			],
+			default: "_self",
+			category: "tech"
+		},
+		iconName: {
+			name: "Ikon",
+			description: "Ikon som skal vises ved siden av lenketeksten",
+			type: "icon",
+			category: "ui"
+		},
+		iconPosition: {
+			name: "Ikonposisjon",
+			description: "Posisjonen til ikonet i forhold til lenketeksten",
+			type: ["left", "right"],
+			category: "ui"
+		}
+	},
+	slots: { default: { description: "Innholdet i lenken" } }
+}, l = class extends s {
+	constructor(...e) {
+		super(...e), this.href = c.props.href.default, this.iconName = void 0, this.iconPosition = void 0, this.external = !1, this.target = c.props.target.default;
+	}
+	render() {
+		return t`<a
+      class=${a({
+			"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
+		})}
+      href=${this.href}
+      .target=${this.target}
+      .rel=${this.external ? "noopener noreferrer" : n}
+      >${this.iconName ? t`<pkt-icon name=${this.iconName} class="pkt-link__icon"></pkt-icon>` : ""} <span>${o(this)}</span></a
+    >`;
+	}
+};
+r([i({
+	type: String,
+	reflect: !0
+})], l.prototype, "href", void 0), r([i({
+	type: String,
+	reflect: !0
+})], l.prototype, "iconName", void 0), r([i({
+	type: String,
+	reflect: !0
+})], l.prototype, "iconPosition", void 0), r([i({
+	type: Boolean,
+	reflect: !0
+})], l.prototype, "external", void 0), r([i({
+	type: String,
+	reflect: !0
+})], l.prototype, "target", void 0);
+try {
+	e("pkt-link")(l);
+} catch {
+	console.warn("Forsøker å definere <pkt-link>, men den er allerede definert");
+}
+//#endregion
+//#region src/components/link/index.ts
+var u = l;
+//#endregion
+export { l as n, u as t };

package/dist/link-CyTCpI0k.cjs

@@ -0,0 +1,7 @@
+const e=require(`./element-DjtxO-1r.cjs`),t=require(`./class-map-CJ-msbHs.cjs`),n=require(`./element-with-slot-CWoTGA1B.cjs`);require(`./icon-Dr8sfT2X.cjs`);var r={name:`pkt-link`,react:`PktLink`,"css-class":`pkt-link`,"dark-mode":!0,isElement:!0,props:{href:{name:`URL`,description:`URL til lenken`,type:`string`,default:`#`,category:`contents`},target:{name:`Mål`,description:`Mål for lenken`,type:[`_blank`,`_self`,`_parent`,`_top`],default:`_self`,category:`tech`},iconName:{name:`Ikon`,description:`Ikon som skal vises ved siden av lenketeksten`,type:`icon`,category:`ui`},iconPosition:{name:`Ikonposisjon`,description:`Posisjonen til ikonet i forhold til lenketeksten`,type:[`left`,`right`],category:`ui`}},slots:{default:{description:`Innholdet i lenken`}}},i=class extends n.t{constructor(...e){super(...e),this.href=r.props.href.default,this.iconName=void 0,this.iconPosition=void 0,this.external=!1,this.target=r.props.target.default}render(){return e.d`<a
+      class=${t.t({"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})}
+      href=${this.href}
+      .target=${this.target}
+      .rel=${this.external?`noopener noreferrer`:e.l}
+      >${this.iconName?e.d`<pkt-icon name=${this.iconName} class="pkt-link__icon"></pkt-icon>`:``} <span>${n.n(this)}</span></a
+    >`}};e.r([e.s({type:String,reflect:!0})],i.prototype,`href`,void 0),e.r([e.s({type:String,reflect:!0})],i.prototype,`iconName`,void 0),e.r([e.s({type:String,reflect:!0})],i.prototype,`iconPosition`,void 0),e.r([e.s({type:Boolean,reflect:!0})],i.prototype,`external`,void 0),e.r([e.s({type:String,reflect:!0})],i.prototype,`target`,void 0);try{e.c(`pkt-link`)(i)}catch{console.warn(`Forsøker å definere <pkt-link>, men den er allerede definert`)}var a=i;Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});

package/dist/linkcard-B0KOGaGj.js

@@ -0,0 +1,55 @@
+import { c as e, d as t, r as n, s as r } from "./element-cZ85T_aa.js";
+import { n as i, t as a } from "./element-with-slot-4J2o3SeU.js";
+import "./icon-Co72KtgF.js";
+import { t as o } from "./if-defined-Cjj8qN-Z.js";
+//#region src/components/linkcard/linkcard.ts
+var s = class extends a {
+	constructor(...e) {
+		super(...e), this.title = "", this.href = "#", this.iconName = "", this.external = !1, this.openInNewTab = !1, this.skin = "normal";
+	}
+	render() {
+		let e = ["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 t`
+      <a
+        href=${this.href}
+        class=${e}
+        target=${this.openInNewTab ? "_blank" : "_self"}
+        rel=${o(this.openInNewTab ? "noopener noreferrer" : void 0)}
+      >
+        ${this.iconName && t`<pkt-icon class="pkt-link__icon" name="${this.iconName}" />`}
+        ${this.title && t`<div class=${n}>${this.title}</div>`}
+
+        <div class="pkt-linkcard__text">${i(this)}</div>
+      </a>
+    `;
+	}
+};
+n([r({
+	type: String,
+	reflect: !0
+})], s.prototype, "title", void 0), n([r({
+	type: String,
+	reflect: !0
+})], s.prototype, "href", void 0), n([r({
+	type: String,
+	reflect: !0
+})], s.prototype, "iconName", void 0), n([r({
+	type: Boolean,
+	reflect: !0
+})], s.prototype, "external", void 0), n([r({
+	type: Boolean,
+	reflect: !0
+})], s.prototype, "openInNewTab", void 0), n([r({
+	type: String,
+	reflect: !0
+})], s.prototype, "skin", void 0);
+try {
+	e("pkt-linkcard")(s);
+} catch {
+	console.warn("Forsøker å definere <pkt-linkcard>, men den er allerede definert");
+}
+//#endregion
+//#region src/components/linkcard/index.ts
+var c = s;
+//#endregion
+export { s as n, c as t };

package/dist/linkcard-BE4-FewK.cjs

@@ -0,0 +1,13 @@
+const e=require(`./element-DjtxO-1r.cjs`),t=require(`./element-with-slot-CWoTGA1B.cjs`);require(`./icon-Dr8sfT2X.cjs`);const n=require(`./if-defined-XKOD_t_V.cjs`);var r=class extends t.t{constructor(...e){super(...e),this.title=``,this.href=`#`,this.iconName=``,this.external=!1,this.openInNewTab=!1,this.skin=`normal`}render(){let r=[`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 e.d`
+      <a
+        href=${this.href}
+        class=${r}
+        target=${this.openInNewTab?`_blank`:`_self`}
+        rel=${n.t(this.openInNewTab?`noopener noreferrer`:void 0)}
+      >
+        ${this.iconName&&e.d`<pkt-icon class="pkt-link__icon" name="${this.iconName}" />`}
+        ${this.title&&e.d`<div class=${i}>${this.title}</div>`}
+
+        <div class="pkt-linkcard__text">${t.n(this)}</div>
+      </a>
+    `}};e.r([e.s({type:String,reflect:!0})],r.prototype,`title`,void 0),e.r([e.s({type:String,reflect:!0})],r.prototype,`href`,void 0),e.r([e.s({type:String,reflect:!0})],r.prototype,`iconName`,void 0),e.r([e.s({type:Boolean,reflect:!0})],r.prototype,`external`,void 0),e.r([e.s({type:Boolean,reflect:!0})],r.prototype,`openInNewTab`,void 0),e.r([e.s({type:String,reflect:!0})],r.prototype,`skin`,void 0);try{e.c(`pkt-linkcard`)(r)}catch{console.warn(`Forsøker å definere <pkt-linkcard>, men den er allerede definert`)}var i=r;Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return i}});

package/dist/listbox-DCA2JoPV.cjs

@@ -0,0 +1,106 @@
+const e=require(`./element-DjtxO-1r.cjs`),t=require(`./class-map-CJ-msbHs.cjs`),n=require(`./if-defined-XKOD_t_V.cjs`),r=require(`./repeat-CqcDYBxr.cjs`),i=require(`./utils-CjAbIttF.cjs`);var a=(e,t)=>t&&(e.find(e=>e.value===t)||e.find(e=>e.label===t))||null,o=(e,t)=>{if(!t)return-1;let n=e.findIndex(e=>e.value===t);return n>=0?n:e.findIndex(e=>e.label===t)},s=(e,t)=>{if(!t)return[...e];let n=t.toLowerCase();return e.filter(e=>(e.fulltext||e.value+(e.label||``)+(e.prefix||``)).toLowerCase().includes(n))},c=e=>e.value+(e.label||``)+(e.prefix||``),l=(e,t)=>t!==null&&e>=t,u=(e,t)=>{if(!t)return{filtered:[...e],suggestion:null};let n=t.toLowerCase(),r=e.filter(e=>e.fulltext?.toLowerCase().includes(n));return{filtered:r,suggestion:r.find(e=>!e.selected&&e.label?.toLowerCase().startsWith(n))||null}},d=(e,t,n,r)=>{if(!e.trim())return{addValueText:null,userInfoMessage:``};let i=e.trim().toLowerCase(),a=t.find(e=>e.toLowerCase()===i),o=n.filter(e=>e.label?.toLowerCase().includes(i)||e.value.toLowerCase().includes(i)),s=o.find(e=>e.label?.toLowerCase()===i||e.value.toLowerCase()===i);return(o.length===0||!s)&&r?{addValueText:e,userInfoMessage:``}:o.length===0&&!r?{addValueText:null,userInfoMessage:`Ingen treff i søket`}:a?{addValueText:null,userInfoMessage:`Verdien er allerede valgt`}:{addValueText:null,userInfoMessage:``}},f=e=>/^[\p{L} ]$/u.test(e),p=(e=500)=>{let t=``,n;return{append:r=>(t+=r.toLowerCase(),n!==void 0&&clearTimeout(n),n=setTimeout(()=>{t=``},e),t),reset:()=>{t=``,n!==void 0&&(clearTimeout(n),n=void 0)},getBuffer:()=>t}},m=(e,t)=>{let n=t.toLowerCase();return e.findIndex(e=>e.textContent?.trim().toLowerCase().startsWith(n))},h=e=>{e.scrollIntoView({block:`nearest`}),window.setTimeout(()=>e.focus(),0)},g=e=>Array.from(e.querySelectorAll(`[role="option"]:not([data-disabled])`)||[]),_=e=>{let t=e.nextElementSibling;t&&h(t)},v=(e,t,n)=>{let r=e.previousElementSibling;if(e.dataset.index===`0`&&n){let e=t.querySelector(`[role="searchbox"]`);e&&h(e)}else r&&h(r)},y=e=>{let t=g(e);t[0]&&h(t[0])},b=e=>{let t=g(e),n=t[t.length-1];n&&h(n)},x=(e,t)=>{if(t.disabled)return;let n=g(e);if(t.allowUserInput&&t.customUserInput){let t=e.querySelector(`[data-type="new-option"]`);if(t){h(t);return}}let r=n.find(e=>e.dataset.selected===`true`);if(r){h(r);return}if(t.includeSearch&&!(document.activeElement instanceof HTMLInputElement)){let t=e.querySelector(`[role="searchbox"]`);if(t){window.setTimeout(()=>t.focus(),0);return}}n[0]&&h(n[0])},S=class extends e.t{constructor(...e){super(...e),this.id=i.n(),this.label=null,this.options=[],this.isOpen=!1,this.disabled=!1,this.includeSearch=!1,this.isMultiSelect=!1,this.allowUserInput=!1,this.maxIsReached=!1,this.customUserInput=null,this.searchPlaceholder=null,this.searchValue=null,this.maxLength=0,this.userMessage=null,this._selectedOptions=0,this.typeahead=p(),this._filteredOptions=[]}connectedCallback(){super.connectedCallback(),this.includeSearch&&!this.searchValue&&(this.searchValue=``),this.options.length>0&&this.filterOptions(),this.setAttribute(`tabindex`,`-1`),this.addEventListener(`focus`,this.focusFirstOrSelectedOption)}disconnectedCallback(){super.disconnectedCallback(),this.typeahead.reset()}updated(e){(e.has(`options`)||e.has(`searchValue`))&&this.filterOptions(),super.updated(e)}attributeChangedCallback(e,t,n){(e===`options`||e===`search-value`)&&this.filterOptions(),super.attributeChangedCallback(e,t,n)}get _hasOptions(){return this._filteredOptions.length>0||this.options.length>0}render(){return e.d`
+      <div
+        class=${t.t({"pkt-listbox":!0,"pkt-listbox__open":this.isOpen,"pkt-txt-16-light":!0})}
+        role=${n.t(this._hasOptions?`listbox`:void 0)}
+        aria-multiselectable=${n.t(this._hasOptions&&this.isMultiSelect?`true`:void 0)}
+        aria-label=${n.t(this._hasOptions?this.label??void 0:void 0)}
+      >
+        <div class="pkt-listbox__banners">
+          ${this.renderSearch()} ${this.renderMaximumReachedBanner()} ${this.renderUserMessage()}
+          ${this.renderEmptyMessage()} ${this.renderNewOptionBanner()}
+        </div>
+        <ul class="pkt-listbox__options" role="presentation">
+          ${this.renderList()}
+        </ul>
+      </div>
+      <div aria-live="polite" class="pkt-visually-hidden">${this.userMessage}</div>
+    `}renderCheckboxOrCheckIcon(t,n){return this.isMultiSelect?e.d`
+          <input
+            class="pkt-input-check__input-checkbox"
+            type="checkbox"
+            role="presentation"
+            tabindex="-1"
+            value=${t.value}
+            @change=${e=>{e.stopPropagation()}}
+            .checked=${t.selected}
+            aria-labelledby=${this.id+`-option-label-`+n}
+            ?disabled=${this.disabled||t.disabled||this.maxIsReached&&!t.selected}
+          />
+        `:t.selected?e.d`<pkt-icon name="check-big"></pkt-icon>`:e.l}renderEmptyMessage(){return this.options.length>0||this._filteredOptions.length>0||this.userMessage?e.l:e.d`<div class="pkt-listbox__banner pkt-listbox__banner--empty">
+      <pkt-icon
+        class="pkt-listbox__banner-icon"
+        name="exclamation-mark-circle"
+        size="large"
+      ></pkt-icon>
+      Tom liste
+    </div>`}renderList(){return e.d`
+      ${r.t(this._filteredOptions,e=>e.value,(n,r)=>e.d`
+          <li
+            @click=${()=>{this.toggleOption(n)}}
+            aria-selected=${n.selected?`true`:`false`}
+            @keydown=${this.handleOptionKeydown}
+            class=${t.t({"pkt-listbox__option":!0,"pkt-listbox__option--selected":!!(!this.isMultiSelect&&n.selected),"pkt-listbox__option--checkBox":this.isMultiSelect})}
+            tabindex="${this.disabled||n.disabled?`-1`:`0`}"
+            data-index=${r}
+            data-value=${n.value}
+            data-selected=${n.selected?`true`:`false`}
+            ?data-disabled=${this.disabled||n.disabled||this.maxIsReached&&!n.selected}
+            aria-disabled=${this.disabled||n.disabled||this.maxIsReached&&!n.selected?`true`:`false`}
+            role="option"
+            id=${`${this.id}-${r}`}
+          >
+            ${this.renderCheckboxOrCheckIcon(n,r)}
+            <span class="pkt-listbox__option-label" id=${this.id+`-option-label-`+r}>
+              ${n.prefix?e.d`<span class="pkt-listbox__option-prefix">${n.prefix}</span>`:e.l}
+              ${n.label||n.value}
+            </span>
+            ${n.description?e.d`<span class="pkt-listbox__option-description pkt-txt-14-light"
+                  >${n.description}</span
+                >`:e.l}
+          </li>
+        `)}
+    `}renderNewOptionBanner(){return this.allowUserInput&&this.customUserInput?e.d`
+          <div
+            class="pkt-listbox__banner pkt-listbox__banner--new-option pkt-listbox__option"
+            data-type="new-option"
+            data-value=${this.customUserInput}
+            data-selected="false"
+            tabindex="0"
+            @click=${()=>this.toggleOption({value:this.customUserInput||``})}
+            @keydown=${this.handleOptionKeydown}
+          >
+            <pkt-icon class="pkt-listbox__banner-icon" name="plus-sign" size="large"></pkt-icon>
+            Legg til "${this.customUserInput}"
+          </div>
+        `:e.l}renderMaximumReachedBanner(){return this._selectedOptions=this.options.filter(e=>e.selected).length,this.isMultiSelect&&this._selectedOptions>0&&this.maxLength>0?e.d`
+          <div class="pkt-listbox__banner pkt-listbox__banner--maximum-reached">
+            ${this._selectedOptions} av maks ${this.maxLength} mulige er valgt.
+          </div>
+        `:e.l}renderUserMessage(){return this.userMessage?e.d`<div class="pkt-listbox__banner pkt-listbox__banner--user-message">
+          <pkt-icon
+            class="pkt-listbox__banner-icon"
+            name="exclamation-mark-circle"
+            size="large"
+          ></pkt-icon>
+          ${this.userMessage}
+        </div>`:e.l}renderSearch(){return this.includeSearch?e.d`
+          <div class="pkt-listbox__search">
+            <span class="pkt-listbox__search-icon">
+              <pkt-icon name="magnifying-glass-small" size="large"></pkt-icon>
+            </span>
+            <input
+              class="pkt-txt-16-light"
+              type="text"
+              aria-label="Søk i listen"
+              form=""
+              placeholder=${this.searchPlaceholder||e.i.forms.search.placeholder}
+              @input=${this.handleSearchInput}
+              @keydown=${this.handleSearchKeydown}
+              .value=${this.searchValue}
+              data-type="searchbox"
+              ?disabled=${this.disabled}
+              ?readonly=${this.disabled}
+              role="searchbox"
+            />
+          </div>
+        `:e.l}handleSearchInput(e){this.searchValue=e.target.value,this.dispatchEvent(new CustomEvent(`search`,{detail:this.searchValue,bubbles:!1}))}handleSearchKeydown(e){switch(e.key){case`Enter`:e.preventDefault();break;case`ArrowUp`:case`Escape`:this.closeOptions(),e.preventDefault();break;case`ArrowDown`:this.focusFirstOrSelectedOption();break;case`Tab`:this.tabClose();break}}handleOptionKeydown(e){let t=e.currentTarget,n=t.dataset.value,r=t.dataset.type,i=t.dataset.selected===`true`;if(!(!g(this).length&&(!this.customUserInput||!this.allowUserInput&&this.customUserInput)&&r!==`new-option`&&r!==`searchbox`))switch(e.key){case` `:case`Enter`:this.toggleOption(t),e.preventDefault();break;case`Backspace`:n&&(i?this.toggleOption(t):this.closeOptions()),e.preventDefault();break;case`Escape`:this.closeOptions(),e.preventDefault();break;case`Tab`:this.tabClose();break;case`ArrowDown`:e.altKey?b(this):r===`searchbox`||r===`new-option`?y(this):_(t),e.preventDefault();break;case`ArrowUp`:if(e.altKey)y(this);else if(t.dataset.index===`0`&&this.includeSearch){let e=this.querySelector(`[role="searchbox"]`);e&&e.focus()}else if(t.dataset.index===`0`&&this.customUserInput){let e=this.querySelector(`[data-type="new-option"]`);e&&e.focus()}else v(t,this,this.includeSearch);e.preventDefault();break;case`Home`:y(this),e.preventDefault();break;case`End`:b(this),e.preventDefault();break;default:(e.metaKey||e.ctrlKey)&&e.key===`a`&&(this.selectAll(),e.preventDefault()),f(e.key)&&(this.handleTypeAhead(e.key),e.preventDefault());break}}focusFirstOrSelectedOption(){x(this,{disabled:this.disabled,allowUserInput:this.allowUserInput,customUserInput:this.customUserInput,includeSearch:this.includeSearch})}toggleOption(e){let t=e instanceof HTMLElement?e.dataset.disabled:e.disabled;if(this.disabled||t)return;let n=e instanceof HTMLElement?e.dataset.value:e.value;this.dispatchEvent(new CustomEvent(`option-toggle`,{detail:n,bubbles:!1}))}selectAll(){this.dispatchEvent(new CustomEvent(`select-all`,{bubbles:!1}))}closeOptions(){this.dispatchEvent(new CustomEvent(`close-options`,{bubbles:!1}))}tabClose(){this.dispatchEvent(new CustomEvent(`tab-close`,{bubbles:!1}))}filterOptions(){this._filteredOptions=s(this.options,this.searchValue)}handleTypeAhead(e){let t=this.typeahead.append(e),n=g(this),r=m(n,t);r>=0&&h(n[r])}};e.r([e.s({type:String})],S.prototype,`id`,void 0),e.r([e.s({type:String})],S.prototype,`label`,void 0),e.r([e.s({type:Array})],S.prototype,`options`,void 0),e.r([e.s({type:Boolean,reflect:!0,attribute:`is-open`})],S.prototype,`isOpen`,void 0),e.r([e.s({type:Boolean})],S.prototype,`disabled`,void 0),e.r([e.s({type:Boolean,attribute:`include-search`})],S.prototype,`includeSearch`,void 0),e.r([e.s({type:Boolean,attribute:`is-multi-select`})],S.prototype,`isMultiSelect`,void 0),e.r([e.s({type:Boolean,attribute:`allow-user-input`})],S.prototype,`allowUserInput`,void 0),e.r([e.s({type:Boolean,attribute:`max-is-reached`})],S.prototype,`maxIsReached`,void 0),e.r([e.s({type:String,attribute:`custom-user-input`})],S.prototype,`customUserInput`,void 0),e.r([e.s({type:String,attribute:`search-placeholder`})],S.prototype,`searchPlaceholder`,void 0),e.r([e.s({type:String,attribute:`search-value`})],S.prototype,`searchValue`,void 0),e.r([e.s({type:Number,attribute:`max-length`})],S.prototype,`maxLength`,void 0),e.r([e.s({type:String,attribute:`user-message`})],S.prototype,`userMessage`,void 0),e.r([e.o()],S.prototype,`_filteredOptions`,void 0);try{e.c(`pkt-listbox`)(S)}catch{console.warn(`Forsøker å definere <pkt-listbox>, men den er allerede definert`)}var C=S;Object.defineProperty(exports,`a`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`c`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return S}}),Object.defineProperty(exports,`o`,{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`s`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return C}});