@oslokommune/punkt-elements 17.1.3 → 18.1.0

package/dist/{searchinput-DwnjsvJ1.js → searchinput-CJo1PpM7.js}

@@ -1,12 +1,12 @@
-import { a as e, d as t, n, o as r, p as i, s as a, t as o } from "./element-ChsFgr_B.js";
-import { t as s } from "./class-map-CnWCnBSX.js";
-import "./icon-D-LA22xD.js";
-import { t as c } from "./if-defined-CGzIlZ9-.js";
+import { _ as e, d as t, h as n, l as r, n as i, t as a, u as o } from "./element-WEzISABa.js";
+import { t as s } from "./class-map-wh4Yi3oj.js";
+import "./icon-DEtOSWRK.js";
+import { t as c } from "./if-defined-BmnvvxtR.js";
 import { t as l } from "./focus-modality-controller-Dc2S-KqR.js";
 //#region src/components/searchinput/searchinput.ts
-var u = class extends o {
+var u = class extends a {
 	constructor(...e) {
-		super(...e), this.appearance = "local", this.inputSize = "medium", this.disabled = !1, this.fullwidth = !1, this.id = "", this.placeholder = "Søk…", this.value = "", this.focusModality = new l(this, ".pkt-searchinput");
+		super(...e), this.appearance = "local", this.inputSize = "medium", this.disabled = !1, this.fullwidth = !1, this.id = "", this.value = "", this.focusModality = new l(this, ".pkt-searchinput");
 	}
 	willUpdate(e) {
 		super.willUpdate(e);
@@ -45,32 +45,32 @@ var u = class extends o {
 		});
 		this.dispatchEvent(r) || e.preventDefault();
 	}
-	renderSuggestion(e, n) {
-		let r = i`
-      ${e.title ? i`<h3 class="pkt-searchinput__suggestion-title">${e.title}</h3>` : t}
-      ${e.text ? i`<p class="pkt-searchinput__suggestion-text">${e.text}</p>` : t}
+	renderSuggestion(t, r) {
+		let i = e`
+      ${t.title ? e`<h3 class="pkt-searchinput__suggestion-title">${t.title}</h3>` : n}
+      ${t.text ? e`<p class="pkt-searchinput__suggestion-text">${t.text}</p>` : n}
     `;
-		return e.href ? i`<a
-        href=${e.href}
+		return t.href ? e`<a
+        href=${t.href}
         class="pkt-searchinput__suggestion"
-        @click=${(t) => this.onSuggestionClick(t, e, n)}
+        @click=${(e) => this.onSuggestionClick(e, t, r)}
       >
-        ${r}
-      </a>` : e.nonInteractive ? i`<div class="pkt-searchinput__suggestion">${r}</div>` : i`<button
+        ${i}
+      </a>` : t.nonInteractive ? e`<div class="pkt-searchinput__suggestion">${i}</div>` : e`<button
       type="button"
       class="pkt-searchinput__suggestion"
-      @click=${(t) => this.onSuggestionClick(t, e, n)}
+      @click=${(e) => this.onSuggestionClick(e, t, r)}
     >
-      ${r}
+      ${i}
     </button>`;
 	}
 	render() {
-		let e = s({
+		let t = this.pktStrings.get("searchinput"), r = s({
 			"pkt-searchinput": !0,
 			[`pkt-searchinput--${this.appearance}`]: !0,
 			[`pkt-searchinput--${this.inputSize}`]: !0,
 			"pkt-searchinput--fullwidth": this.fullwidth
-		}), n = s({
+		}), i = s({
 			"pkt-searchinput__button": !0,
 			"pkt-input-icon": this.appearance === "local",
 			"pkt-btn": !0,
@@ -79,73 +79,73 @@ var u = class extends o {
 			"pkt-btn--tertiary": this.appearance === "local",
 			"pkt-btn--primary": this.appearance === "global" || this.appearance === "local-with-button",
 			"pkt-btn--yellow": this.appearance === "global"
-		}), r = s({
+		}), a = s({
 			"pkt-input": !0,
 			[`pkt-input--${this.inputSize}`]: !0,
 			"pkt-input--fullwidth": this.fullwidth
-		}), a = this.appearance === "local" ? `pkt-input__container pkt-input__container--${this.inputSize}` : "pkt-searchinput__field", o = i`
-      ${this.label ? i`<label for=${c(this.id || void 0)} class="pkt-inputwrapper__label"
+		}), o = this.appearance === "local" ? `pkt-input__container pkt-input__container--${this.inputSize}` : "pkt-searchinput__field", l = e`
+      ${this.label ? e`<label for=${c(this.id || void 0)} class="pkt-inputwrapper__label"
             >${this.label}</label
-          >` : t}
-      <div class=${a}>
+          >` : n}
+      <div class=${o}>
         <input
-          class=${r}
+          class=${a}
           type="search"
           name=${this.name || this.id}
           id=${this.id}
-          placeholder=${this.placeholder || "Søk…"}
+          placeholder=${this.placeholder || t.placeholder}
           .value=${this.value}
           ?disabled=${this.disabled}
           autocomplete="off"
           aria-label=${c(this.inputAriaLabel)}
-          aria-autocomplete=${this.suggestions ? "list" : t}
-          aria-controls=${this.suggestions ? this.suggestionsId : t}
+          aria-autocomplete=${this.suggestions ? "list" : n}
+          aria-controls=${this.suggestions ? this.suggestionsId : n}
           @input=${this.onInput}
           @keydown=${this.onInputKeydown}
         />
         <button
           type="submit"
-          class=${n}
+          class=${i}
           ?disabled=${this.disabled}
           @click=${this.onSearchClick}
         >
           <pkt-icon class="pkt-btn__icon" name="magnifying-glass-big"></pkt-icon>
-          <span class="pkt-btn__text">${this.label || this.placeholder || "Søk…"}</span>
+          <span class="pkt-btn__text">${this.label || this.placeholder || t.placeholder}</span>
         </button>
       </div>
-      ${this.suggestions ? i`<ul
+      ${this.suggestions ? e`<ul
             id=${this.suggestionsId}
             class="pkt-searchinput__suggestions"
             aria-live="assertive"
           >
-            ${this.suggestions.map((e, t) => i` <li>${this.renderSuggestion(e, t)}</li> `)}
-          </ul>` : t}
+            ${this.suggestions.map((t, n) => e` <li>${this.renderSuggestion(t, n)}</li> `)}
+          </ul>` : n}
     `;
-		return this.action ? i`<form
+		return this.action ? e`<form
         role="search"
-        class=${e}
+        class=${r}
         action=${this.action}
         method=${c(this.method)}
       >
-        ${o}
-      </form>` : i`<div role="search" class=${e}>${o}</div>`;
+        ${l}
+      </form>` : e`<div role="search" class=${r}>${l}</div>`;
 	}
 };
-n([r({ type: String })], u.prototype, "appearance", void 0), n([r({
+i([o({ type: String })], u.prototype, "appearance", void 0), i([o({
 	type: String,
 	attribute: "input-size"
-})], u.prototype, "inputSize", void 0), n([r({
+})], u.prototype, "inputSize", void 0), i([o({
 	type: Boolean,
 	reflect: !0
-})], u.prototype, "disabled", void 0), n([r({
+})], u.prototype, "disabled", void 0), i([o({
 	type: Boolean,
 	reflect: !0
-})], u.prototype, "fullwidth", void 0), n([r({
+})], u.prototype, "fullwidth", void 0), i([o({
 	type: String,
 	reflect: !0
-})], u.prototype, "id", void 0), n([r({ type: String })], u.prototype, "label", void 0), n([r({ type: String })], u.prototype, "name", void 0), n([r({ type: String })], u.prototype, "placeholder", void 0), n([r({ type: String })], u.prototype, "value", void 0), n([r({ type: Array })], u.prototype, "suggestions", void 0), n([r({ type: String })], u.prototype, "action", void 0), n([r({ type: String })], u.prototype, "method", void 0), n([e()], u.prototype, "inputAriaLabel", void 0);
+})], u.prototype, "id", void 0), i([o({ type: String })], u.prototype, "label", void 0), i([o({ type: String })], u.prototype, "name", void 0), i([o({ type: String })], u.prototype, "placeholder", void 0), i([o({ type: String })], u.prototype, "value", void 0), i([o({ type: Array })], u.prototype, "suggestions", void 0), i([o({ type: String })], u.prototype, "action", void 0), i([o({ type: String })], u.prototype, "method", void 0), i([r()], u.prototype, "inputAriaLabel", void 0);
 try {
-	a("pkt-searchinput")(u);
+	t("pkt-searchinput")(u);
 } catch {
 	console.warn("Forsøker å definere <pkt-searchinput>, men den er allerede definert");
 }

package/dist/searchinput-Cl46nW0r.cjs

@@ -0,0 +1,60 @@
+const e=require("./element-DiFhBcIl.cjs"),t=require("./class-map-C33ixq7O.cjs");require("./icon-DIavy2cB.cjs");const n=require("./if-defined-Dc3xFDaM.cjs"),r=require("./focus-modality-controller-C1ocyv2J.cjs");var i=class extends e.t{constructor(...e){super(...e),this.appearance=`local`,this.inputSize=`medium`,this.disabled=!1,this.fullwidth=!1,this.id=``,this.value=``,this.focusModality=new r.t(this,`.pkt-searchinput`)}willUpdate(e){super.willUpdate(e);let t=this.getAttribute(`aria-label`);t&&(this.inputAriaLabel=t,this.removeAttribute(`aria-label`))}get suggestionsId(){return`${this.id}-suggestions`}dispatchSearch(){this.dispatchEvent(new CustomEvent(`pkt-search`,{detail:{value:this.value},bubbles:!0,composed:!0}))}onInput(e){let t=e.target;this.value=t.value}onInputKeydown(e){e.key===`Enter`&&(this.action||e.preventDefault(),this.dispatchSearch())}onSearchClick(e){this.action||e.preventDefault(),this.dispatchSearch()}onSuggestionClick(e,t,n){let r=new CustomEvent(`pkt-suggestion-click`,{detail:{index:n,suggestion:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(r)||e.preventDefault()}renderSuggestion(t,n){let r=e._`
+      ${t.title?e._`<h3 class="pkt-searchinput__suggestion-title">${t.title}</h3>`:e.h}
+      ${t.text?e._`<p class="pkt-searchinput__suggestion-text">${t.text}</p>`:e.h}
+    `;return t.href?e._`<a
+        href=${t.href}
+        class="pkt-searchinput__suggestion"
+        @click=${e=>this.onSuggestionClick(e,t,n)}
+      >
+        ${r}
+      </a>`:t.nonInteractive?e._`<div class="pkt-searchinput__suggestion">${r}</div>`:e._`<button
+      type="button"
+      class="pkt-searchinput__suggestion"
+      @click=${e=>this.onSuggestionClick(e,t,n)}
+    >
+      ${r}
+    </button>`}render(){let r=this.pktStrings.get(`searchinput`),i=t.t({"pkt-searchinput":!0,[`pkt-searchinput--${this.appearance}`]:!0,[`pkt-searchinput--${this.inputSize}`]:!0,"pkt-searchinput--fullwidth":this.fullwidth}),a=t.t({"pkt-searchinput__button":!0,"pkt-input-icon":this.appearance===`local`,"pkt-btn":!0,[`pkt-btn--${this.inputSize}`]:!0,"pkt-btn--icon-only":!0,"pkt-btn--tertiary":this.appearance===`local`,"pkt-btn--primary":this.appearance===`global`||this.appearance===`local-with-button`,"pkt-btn--yellow":this.appearance===`global`}),o=t.t({"pkt-input":!0,[`pkt-input--${this.inputSize}`]:!0,"pkt-input--fullwidth":this.fullwidth}),s=this.appearance===`local`?`pkt-input__container pkt-input__container--${this.inputSize}`:`pkt-searchinput__field`,c=e._`
+      ${this.label?e._`<label for=${n.t(this.id||void 0)} class="pkt-inputwrapper__label"
+            >${this.label}</label
+          >`:e.h}
+      <div class=${s}>
+        <input
+          class=${o}
+          type="search"
+          name=${this.name||this.id}
+          id=${this.id}
+          placeholder=${this.placeholder||r.placeholder}
+          .value=${this.value}
+          ?disabled=${this.disabled}
+          autocomplete="off"
+          aria-label=${n.t(this.inputAriaLabel)}
+          aria-autocomplete=${this.suggestions?`list`:e.h}
+          aria-controls=${this.suggestions?this.suggestionsId:e.h}
+          @input=${this.onInput}
+          @keydown=${this.onInputKeydown}
+        />
+        <button
+          type="submit"
+          class=${a}
+          ?disabled=${this.disabled}
+          @click=${this.onSearchClick}
+        >
+          <pkt-icon class="pkt-btn__icon" name="magnifying-glass-big"></pkt-icon>
+          <span class="pkt-btn__text">${this.label||this.placeholder||r.placeholder}</span>
+        </button>
+      </div>
+      ${this.suggestions?e._`<ul
+            id=${this.suggestionsId}
+            class="pkt-searchinput__suggestions"
+            aria-live="assertive"
+          >
+            ${this.suggestions.map((t,n)=>e._` <li>${this.renderSuggestion(t,n)}</li> `)}
+          </ul>`:e.h}
+    `;return this.action?e._`<form
+        role="search"
+        class=${i}
+        action=${this.action}
+        method=${n.t(this.method)}
+      >
+        ${c}
+      </form>`:e._`<div role="search" class=${i}>${c}</div>`}};e.n([e.u({type:String})],i.prototype,`appearance`,void 0),e.n([e.u({type:String,attribute:`input-size`})],i.prototype,`inputSize`,void 0),e.n([e.u({type:Boolean,reflect:!0})],i.prototype,`disabled`,void 0),e.n([e.u({type:Boolean,reflect:!0})],i.prototype,`fullwidth`,void 0),e.n([e.u({type:String,reflect:!0})],i.prototype,`id`,void 0),e.n([e.u({type:String})],i.prototype,`label`,void 0),e.n([e.u({type:String})],i.prototype,`name`,void 0),e.n([e.u({type:String})],i.prototype,`placeholder`,void 0),e.n([e.u({type:String})],i.prototype,`value`,void 0),e.n([e.u({type:Array})],i.prototype,`suggestions`,void 0),e.n([e.u({type:String})],i.prototype,`action`,void 0),e.n([e.u({type:String})],i.prototype,`method`,void 0),e.n([e.l()],i.prototype,`inputAriaLabel`,void 0);try{e.d(`pkt-searchinput`)(i)}catch{console.warn(`Forsøker å definere <pkt-searchinput>, 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/{select-DMre80qs.js → select-CBrjauXT.js}

@@ -1,10 +1,10 @@
-import { a as e, n as t, o as n, p as r, s as i } from "./element-ChsFgr_B.js";
-import { n as a } from "./element-with-slot-BvG9ctC-.js";
-import { t as o } from "./if-defined-CGzIlZ9-.js";
-import { n as s, t as c } from "./ref-CWD6PjVd.js";
-import { t as l } from "./input-element-DBMNBplu.js";
-import { t as u } from "./pkt-options-controller-B77vH3PE.js";
-import { r as d } from "./input-wrapper-BmxNvznr.js";
+import { _ as e, d as t, l as n, n as r, u as i } from "./element-WEzISABa.js";
+import { n as a } from "./element-with-slot-BKYUx4gb.js";
+import { t as o } from "./if-defined-BmnvvxtR.js";
+import { n as s, t as c } from "./ref-OU8ryfP6.js";
+import { t as l } from "./input-element-IBypGOaV.js";
+import { t as u } from "./pkt-options-controller-CuQ6SClv.js";
+import { r as d } from "./input-wrapper-CQgAL1Br.js";
 //#region src/base-elements/options-input-element.ts
 var f = class extends l {
 	constructor(...e) {
@@ -36,10 +36,10 @@ var f = class extends l {
 		super.willUpdate(e), this.parseOptions();
 	}
 };
-t([n({
+r([i({
 	type: Array,
 	attribute: "options"
-})], f.prototype, "_optionsProp", void 0), t([e()], f.prototype, "_options", void 0);
+})], f.prototype, "_optionsProp", void 0), r([n()], f.prototype, "_options", void 0);
 //#endregion
 //#region src/components/select/select.ts
 var p = class extends f {
@@ -88,9 +88,10 @@ var p = class extends f {
 		super.firstUpdated(e), this.classList.add("pkt-select"), this._optionsProp.length && (this._options = this._optionsProp), !this.value && this._options.length > 0 ? (this.value = this._options[0].value, this.selectedIndex = 0) : this.selectedIndex = this._options.findIndex((e) => e.value === this.value), this.selectedOptions = this.inputRef.value?.selectedOptions;
 	}
 	render() {
-		let e = `pkt-input pkt-input--${this.inputSize} ${this.fullwidth ? "pkt-input--fullwidth" : ""}`;
-		return r`
+		let t = `pkt-input pkt-input--${this.inputSize} ${this.fullwidth ? "pkt-input--fullwidth" : ""}`;
+		return e`
       <pkt-input-wrapper
+        .strings=${this.strings}
         .size=${this.inputSize}
         ?disabled=${this.disabled}
         ?hasError=${this.hasError}
@@ -111,7 +112,7 @@ var p = class extends f {
         tagText=${o(this.tagText)}
       >
         <select
-          class=${e}
+          class=${t}
           aria-invalid=${this.hasError}
           aria-errormessage=${o(this.hasError ? `${this.id}-input-error` : void 0)}
           aria-describedby=${o(d({
@@ -139,13 +140,13 @@ var p = class extends f {
 		}}
           ${s(this.inputRef)}
         >
-          ${this._options.length > 0 ? this._options.map((e) => r`<option
-                    value=${e.value}
-                    ?selected=${this.value == e.value || e.selected}
-                    ?disabled=${e.disabled}
-                    ?hidden=${e.hidden}
+          ${this._options.length > 0 ? this._options.map((t) => e`<option
+                    value=${t.value}
+                    ?selected=${this.value == t.value || t.selected}
+                    ?disabled=${t.disabled}
+                    ?hidden=${t.hidden}
                   >
-                    ${e.label}
+                    ${t.label}
                   </option>`) : ""}
         </select>
         <div class="pkt-contents" slot="helptext">${a(this, "helptext")}</div>
@@ -156,9 +157,9 @@ var p = class extends f {
 		return e == null || isNaN(e) ? null : e;
 	}
 };
-t([n({ type: String })], p.prototype, "value", void 0);
+r([i({ type: String })], p.prototype, "value", void 0);
 try {
-	i("pkt-select")(p);
+	t("pkt-select")(p);
 } catch {
 	console.warn("Forsøker å definere <pkt-select>, men den er allerede definert");
 }

package/dist/{select-BOJi6H6T.cjs → select-Dman8Skr.cjs}

@@ -1,5 +1,6 @@
-const e=require("./element-BA8v6S7z.cjs"),t=require("./element-with-slot-Bj7nm7fO.cjs"),n=require("./if-defined-B89_ZeCj.cjs"),r=require("./ref-CQoEIIp0.cjs"),i=require("./input-element-DYmQw-fH.cjs"),a=require("./pkt-options-controller-C5EBX2T0.cjs"),o=require("./input-wrapper-Q-B-aBeb.cjs");var s=class extends i.t{constructor(...e){super(...e),this._optionsProp=[],this._options=[]}get options(){return this._options.map(e=>({...e,selected:this.isOptionSelected(e)}))}set options(e){this._optionsProp=e,this.requestUpdate(`_optionsProp`,this._options)}isOptionSelected(e){return Array.isArray(this.value)?this.value.includes(e.value):e.value===this.value}findOptionByValue(e){return this._options.find(t=>t.value===e)}getSelectedOptions(){return this._options.filter(e=>this.isOptionSelected(e))}parseOptions(){let e=this._optionsProp.length>0,t=this.optionsController?.nodes?.length&&this.optionsController.nodes.length>0;e?this._options=this._optionsProp:t&&(this._options=this.optionsController.options)}willUpdate(e){super.willUpdate(e),this.parseOptions()}};e.n([e.o({type:Array,attribute:`options`})],s.prototype,`_optionsProp`,void 0),e.n([e.a()],s.prototype,`_options`,void 0);var c=class extends s{constructor(){super(),this.inputRef=r.t(),this.value=``,this.selectedIndex=-1,this.selectedOptions=void 0,this.optionsController=new a.t(this)}connectedCallback(){super.connectedCallback(),this.parseOptions(),this._options.forEach(e=>{e.selected&&!this.value&&(this.value=e.value)})}add(e,t){let n={value:e.value||e.text,label:e.text||e.value,selected:e.selected,disabled:e.disabled};if(t===void 0)this._options.push(n);else if(typeof t==`number`)this._options.splice(t,0,n);else{let e=t.value||t.text,r=this._options.findIndex(t=>t.value===e);r>=0?this._options.splice(r,0,n):this._options.push(n)}e.selected&&(this.value=e.value||e.text,this.selectedIndex=this._options.findIndex(e=>e.value===this.value)),this.requestUpdate()}remove(e){typeof e==`number`&&(this.selectedIndex===e&&(this.value=this._options[0]?.value||``),this._options.splice(e,1),this.requestUpdate())}item(e){return this.inputRef.value?.item(e)}namedItem(e){return this.inputRef.value?.namedItem(e)}showPicker(){this.inputRef.value&&`showPicker`in this.inputRef.value&&this.inputRef.value.showPicker()}attributeChangedCallback(e,t,n){e===`options`&&(this._options=n?JSON.parse(n):[]),e===`value`&&this.value!==t&&(this.selectedIndex=this.touched?this.returnNumberOrNull(this.inputRef.value?.selectedIndex):this._options.findIndex(e=>e.value===n),this.selectedOptions=this.inputRef.value?.selectedOptions,this.valueChanged(n,t)),super.attributeChangedCallback(e,t,n)}update(e){super.update(e),e.has(`_optionsProp`)&&this._optionsProp.length>0&&(this._options=this._optionsProp,this.requestUpdate(`_options`),!this.value&&this._options.length>0&&(this.value=this._options[0].value,this.selectedIndex=0)),e.has(`value`)&&this.value!==e.get(`value`)&&(this.selectedIndex=this.touched?this.returnNumberOrNull(this.inputRef.value?.selectedIndex):this._options.findIndex(e=>e.value===this.value),this.selectedOptions=this.inputRef.value?.selectedOptions,this.valueChanged(this.value,e.get(`value`))),e.has(`id`)&&!this.name&&this.id&&(this.name=this.id)}firstUpdated(e){super.firstUpdated(e),this.classList.add(`pkt-select`),this._optionsProp.length&&(this._options=this._optionsProp),!this.value&&this._options.length>0?(this.value=this._options[0].value,this.selectedIndex=0):this.selectedIndex=this._options.findIndex(e=>e.value===this.value),this.selectedOptions=this.inputRef.value?.selectedOptions}render(){let i=`pkt-input pkt-input--${this.inputSize} ${this.fullwidth?`pkt-input--fullwidth`:``}`;return e.p`
+const e=require("./element-DiFhBcIl.cjs"),t=require("./element-with-slot-CBK4zrdN.cjs"),n=require("./if-defined-Dc3xFDaM.cjs"),r=require("./ref-DZmN5Qgj.cjs"),i=require("./input-element-DQY1Rpbp.cjs"),a=require("./pkt-options-controller-BhMNCWcc.cjs"),o=require("./input-wrapper-mJZLVXy_.cjs");var s=class extends i.t{constructor(...e){super(...e),this._optionsProp=[],this._options=[]}get options(){return this._options.map(e=>({...e,selected:this.isOptionSelected(e)}))}set options(e){this._optionsProp=e,this.requestUpdate(`_optionsProp`,this._options)}isOptionSelected(e){return Array.isArray(this.value)?this.value.includes(e.value):e.value===this.value}findOptionByValue(e){return this._options.find(t=>t.value===e)}getSelectedOptions(){return this._options.filter(e=>this.isOptionSelected(e))}parseOptions(){let e=this._optionsProp.length>0,t=this.optionsController?.nodes?.length&&this.optionsController.nodes.length>0;e?this._options=this._optionsProp:t&&(this._options=this.optionsController.options)}willUpdate(e){super.willUpdate(e),this.parseOptions()}};e.n([e.u({type:Array,attribute:`options`})],s.prototype,`_optionsProp`,void 0),e.n([e.l()],s.prototype,`_options`,void 0);var c=class extends s{constructor(){super(),this.inputRef=r.t(),this.value=``,this.selectedIndex=-1,this.selectedOptions=void 0,this.optionsController=new a.t(this)}connectedCallback(){super.connectedCallback(),this.parseOptions(),this._options.forEach(e=>{e.selected&&!this.value&&(this.value=e.value)})}add(e,t){let n={value:e.value||e.text,label:e.text||e.value,selected:e.selected,disabled:e.disabled};if(t===void 0)this._options.push(n);else if(typeof t==`number`)this._options.splice(t,0,n);else{let e=t.value||t.text,r=this._options.findIndex(t=>t.value===e);r>=0?this._options.splice(r,0,n):this._options.push(n)}e.selected&&(this.value=e.value||e.text,this.selectedIndex=this._options.findIndex(e=>e.value===this.value)),this.requestUpdate()}remove(e){typeof e==`number`&&(this.selectedIndex===e&&(this.value=this._options[0]?.value||``),this._options.splice(e,1),this.requestUpdate())}item(e){return this.inputRef.value?.item(e)}namedItem(e){return this.inputRef.value?.namedItem(e)}showPicker(){this.inputRef.value&&`showPicker`in this.inputRef.value&&this.inputRef.value.showPicker()}attributeChangedCallback(e,t,n){e===`options`&&(this._options=n?JSON.parse(n):[]),e===`value`&&this.value!==t&&(this.selectedIndex=this.touched?this.returnNumberOrNull(this.inputRef.value?.selectedIndex):this._options.findIndex(e=>e.value===n),this.selectedOptions=this.inputRef.value?.selectedOptions,this.valueChanged(n,t)),super.attributeChangedCallback(e,t,n)}update(e){super.update(e),e.has(`_optionsProp`)&&this._optionsProp.length>0&&(this._options=this._optionsProp,this.requestUpdate(`_options`),!this.value&&this._options.length>0&&(this.value=this._options[0].value,this.selectedIndex=0)),e.has(`value`)&&this.value!==e.get(`value`)&&(this.selectedIndex=this.touched?this.returnNumberOrNull(this.inputRef.value?.selectedIndex):this._options.findIndex(e=>e.value===this.value),this.selectedOptions=this.inputRef.value?.selectedOptions,this.valueChanged(this.value,e.get(`value`))),e.has(`id`)&&!this.name&&this.id&&(this.name=this.id)}firstUpdated(e){super.firstUpdated(e),this.classList.add(`pkt-select`),this._optionsProp.length&&(this._options=this._optionsProp),!this.value&&this._options.length>0?(this.value=this._options[0].value,this.selectedIndex=0):this.selectedIndex=this._options.findIndex(e=>e.value===this.value),this.selectedOptions=this.inputRef.value?.selectedOptions}render(){let i=`pkt-input pkt-input--${this.inputSize} ${this.fullwidth?`pkt-input--fullwidth`:``}`;return e._`
       <pkt-input-wrapper
+        .strings=${this.strings}
         .size=${this.inputSize}
         ?disabled=${this.disabled}
         ?hasError=${this.hasError}
@@ -35,7 +36,7 @@ const e=require("./element-BA8v6S7z.cjs"),t=require("./element-with-slot-Bj7nm7f
           @blur=${e=>{this.onBlur(),e.stopImmediatePropagation()}}
           ${r.n(this.inputRef)}
         >
-          ${this._options.length>0?this._options.map(t=>e.p`<option
+          ${this._options.length>0?this._options.map(t=>e._`<option
                     value=${t.value}
                     ?selected=${this.value==t.value||t.selected}
                     ?disabled=${t.disabled}
@@ -46,4 +47,4 @@ const e=require("./element-BA8v6S7z.cjs"),t=require("./element-with-slot-Bj7nm7f
         </select>
         <div class="pkt-contents" slot="helptext">${t.n(this,`helptext`)}</div>
       </pkt-input-wrapper>
-    `}returnNumberOrNull(e){return e==null||isNaN(e)?null:e}};e.n([e.o({type:String})],c.prototype,`value`,void 0);try{e.s(`pkt-select`)(c)}catch{console.warn(`Forsøker å definere <pkt-select>, 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}});
+    `}returnNumberOrNull(e){return e==null||isNaN(e)?null:e}};e.n([e.u({type:String})],c.prototype,`value`,void 0);try{e.d(`pkt-select`)(c)}catch{console.warn(`Forsøker å definere <pkt-select>, 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/shared-strings/consent.d.ts

@@ -0,0 +1,71 @@
+/**
+ * Tekster og informasjonskapsel-oppsett for samtykkedialogen.
+ *
+ * Denne ligger utenfor `nb.ts` fordi formen er en annen: en liste med
+ * informasjonskapsler som hver har egne tekster per språk, ikke et flatt
+ * namespace. Den deles av Elements og React slik at de to ikke kommer i utakt.
+ */
+export declare const consentStrings: {
+    i18n: {
+        nb: {
+            contentPresentation: {
+                title: string;
+                description: string[];
+                buttons: {
+                    accept: string;
+                    reject: string;
+                    settings: string;
+                };
+            };
+            contentSettings: {
+                title: string;
+                description: string[];
+                buttons: {
+                    back: string;
+                    save: string;
+                };
+            };
+        };
+        en: {
+            contentPresentation: {
+                title: string;
+                description: string[];
+                buttons: {
+                    accept: string;
+                    reject: string;
+                    settings: string;
+                };
+            };
+            contentSettings: {
+                title: string;
+                description: string[];
+                buttons: {
+                    back: string;
+                    save: string;
+                };
+            };
+        };
+    };
+    cookies: {
+        name: string;
+        defaultValue: boolean;
+        i18n: {
+            nb: {
+                title: string;
+                description: string;
+                buttons: {
+                    yes: string;
+                    no: string;
+                };
+            };
+            en: {
+                title: string;
+                description: string;
+                buttons: {
+                    yes: string;
+                    no: string;
+                };
+            };
+        };
+    }[];
+};

package/dist/shared-strings/format.d.ts

@@ -0,0 +1,21 @@
+import type { TPktStringParams } from './types';
+/**
+ * Setter verdier inn i `{navn}`-plassholdere.
+ *
+ * ```ts
+ * formatString('Verdien må være større enn eller lik {min}.', { min: 5 })
+ * // → 'Verdien må være større enn eller lik 5.'
+ * ```
+ *
+ * En plassholder uten tilsvarende verdi blir stående urørt, slik at en ufullstendig
+ * overstyring gir synlig, feilsøkbar tekst i stedet for et tomt felt.
+ */
+export declare function formatString(template: string, params?: TPktStringParams): string;
+/**
+ * Velger entalls- eller flertallsform.
+ *
+ * ```ts
+ * plural(count, s.fileLabelOne, s.fileLabelOther)
+ * ```
+ */
+export declare function plural(count: number, one: string, other: string): string;

package/dist/shared-strings/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Delt tekstkatalog for Punkt.
+ *
+ * Alle UI-tekster i designsystemet defineres i `nb.ts` og brukes derfra av både
+ * `@oslokommune/punkt-elements` og `@oslokommune/punkt-react`. Konsumenter kan
+ * overstyre tekster globalt med `setPktStrings()` eller per komponentinstans via
+ * `strings`-propen.
+ */
+export { nb } from './nb';
+export { formatString, plural } from './format';
+export { getPktStrings, resetPktStrings, setPktStrings, subscribePktStrings } from './store';
+export { resolveNamespace, resolveStrings } from './resolve';
+export type { IPktStringsProps, TPktStringParams, TPktStrings, TPktStringsNamespace, TPktStringsOverride, TPktStringsShape, TPktStringValue, } from './types';
+export { consentStrings } from './consent';

package/dist/shared-strings/nb.d.ts

@@ -0,0 +1,121 @@
+export declare const nb: {
+    /** Tekster som går igjen på tvers av flere komponenter. */
+    generic: {
+        from: string;
+        to: string;
+        close: string;
+    };
+    /** Etiketter og hjelpetekst rundt skjemafelt. */
+    forms: {
+        optional: string;
+        required: string;
+        readMore: string;
+    };
+    /** Valideringsmeldinger. Nøkkelnavnene følger `ValidityState` der det finnes et tilsvarende flagg. */
+    validation: {
+        valueMissing: string;
+        typeMismatch: string;
+        patternMismatch: string;
+        tooShort: string;
+        tooLong: string;
+        rangeUnderflow: string;
+        rangeOverflow: string;
+        rangeUnderflowMin: string;
+        rangeOverflowMax: string;
+        stepMismatch: string;
+        timeStepMismatch: string;
+        timeStepMismatchHour: string;
+        timeStepMismatchHalfHour: string;
+        dateUnderflow: string;
+        dateOverflow: string;
+        counterExceeded: string;
+    };
+    /** Måneds- og dagsnavn. Listene må ha henholdsvis 12 og 7 elementer. */
+    dates: {
+        month: string;
+        year: string;
+        week: string;
+        days: string[];
+        daysShort: string[];
+        months: string[];
+        monthsShort: string[];
+    };
+    calendar: {
+        prevMonth: string;
+        nextMonth: string;
+    };
+    datepicker: {
+        openPicker: string;
+        deleteDate: string;
+    };
+    timepicker: {
+        hours: string;
+        minutes: string;
+        openPicker: string;
+        prevTime: string;
+        nextTime: string;
+        selectTime: string;
+    };
+    searchinput: {
+        placeholder: string;
+        submit: string;
+    };
+    backlink: {
+        label: string;
+    };
+    breadcrumbs: {
+        ariaLabel: string;
+    };
+    alert: {
+        lastUpdated: string;
+    };
+    tag: {
+        remove: string;
+    };
+    header: {
+        search: string;
+        menu: string;
+        openMenu: string;
+        openSearch: string;
+    };
+    listbox: {
+        searchLabel: string;
+        searchPlaceholder: string;
+    };
+    combobox: {
+        noResults: string;
+        maxSelected: string;
+        tooManySelected: string;
+        alreadySelected: string;
+        valueAdded: string;
+        noValidValue: string;
+    };
+    fileupload: {
+        dropZoneDragMultiple: string;
+        dropZoneDragSingle: string;
+        dropZoneDragMultipleThumbnail: string;
+        dropZoneDragSingleThumbnail: string;
+        dropZoneDragActiveMultiple: string;
+        dropZoneDragActiveSingle: string;
+        dropZoneDragActiveMultipleThumbnail: string;
+        dropZoneDragActiveSingleThumbnail: string;
+        dropZoneOpenFileDialogMultiple: string;
+        dropZoneOpenFileDialogSingle: string;
+        dropZoneOpenFileDialogMultipleThumbnail: string;
+        dropZoneOpenFileDialogSingleThumbnail: string;
+        supportedFormatsPrefix: string;
+        invalidFormat: string;
+        sizeTooLarge: string;
+        requiredMissing: string;
+        genericValidationRejection: string;
+        unknownFilename: string;
+        previewFallbackName: string;
+        previewImage: string;
+        fileLabelOne: string;
+        fileLabelOther: string;
+        srFileAdded: string;
+        srFilesAdded: string;
+        srFilesUploadedOfTotal: string;
+        srFilesFailedOfTotal: string;
+    };
+};

package/dist/shared-strings/resolve.d.ts

@@ -0,0 +1,12 @@
+import type { TPktStrings, TPktStringsNamespace, TPktStringsOverride } from './types';
+/** Slår opp ett namespace. */
+export declare function resolveNamespace<K extends TPktStringsNamespace>(ns: K, ...layers: Array<TPktStringsOverride | undefined>): TPktStrings[K];
+/**
+ * Slår opp flere namespace på én gang.
+ *
+ * ```ts
+ * const s = resolveStrings(['forms', 'validation'], this.strings)
+ * s.forms.optional
+ * ```
+ */
+export declare function resolveStrings<NS extends TPktStringsNamespace>(namespaces: readonly NS[], ...layers: Array<TPktStringsOverride | undefined>): Pick<TPktStrings, NS>;

package/dist/shared-strings/store.d.ts

@@ -0,0 +1,27 @@
+import type { TPktStringsOverride } from './types';
+/**
+ * Global tekstoverstyring. Tilstanden ligger på `globalThis` bak en
+ * `Symbol.for()`-nøkkel, slik at `punkt-react` og `punkt-elements` deler én og
+ * samme store på tvers av modulgrafer.
+ */
+type TListener = () => void;
+/**
+ * Overstyrer tekster for hele applikasjonen. Kall det én gang ved oppstart.
+ * Flere kall merges sammen, namespace for namespace.
+ *
+ * ```ts
+ * setPktStrings({ forms: { optional: 'Frivillig' } })
+ * ```
+ */
+export declare function setPktStrings(overrides: TPktStringsOverride): void;
+/**
+ * Gjeldende globale overstyringer. Identiteten endrer seg ved hvert
+ * `setPktStrings()`-kall, så den kan brukes direkte som snapshot i
+ * `useSyncExternalStore`.
+ */
+export declare function getPktStrings(): TPktStringsOverride;
+/** Nullstiller til de innebygde tekstene. Ment for tester. */
+export declare function resetPktStrings(): void;
+/** Abonnerer på endringer. Returnerer en funksjon som melder av. */
+export declare function subscribePktStrings(listener: TListener): () => void;
+export {};