@oslokommune/punkt-elements 19.5.2 → 19.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +20 -0
- package/dist/base-elements/input-element.d.ts +2 -2
- package/dist/{checkbox-_NnoYkue.cjs → checkbox-D69leWDh.cjs} +3 -3
- package/dist/{checkbox-Bbxt-tVW.js → checkbox-Tq8ESzwH.js} +6 -3
- package/dist/{combobox-CjLX_Gfd.js → combobox-CWzWHBaw.js} +1 -1
- package/dist/{combobox-BBx87DCG.cjs → combobox-FCguoyDH.cjs} +1 -1
- package/dist/components/checkbox/checkbox.d.ts +2 -1
- package/dist/components/input-wrapper/input-wrapper.d.ts +4 -2
- package/dist/components/radiobutton/radiobutton.d.ts +2 -0
- package/dist/{datepicker-CFCRxFQL.js → datepicker-Bs7Z3EFn.js} +1 -1
- package/dist/{datepicker-Bk-m5Zaa.cjs → datepicker-CWHYYj-H.cjs} +1 -1
- package/dist/docs/components/radio-checkbox-sizes.d.ts +10 -0
- package/dist/{fileupload-B2606SvG.js → fileupload-BQFJx1ok.js} +1 -1
- package/dist/{fileupload-COAxc3sX.cjs → fileupload-CMIFZWJ5.cjs} +1 -1
- package/dist/{header-BhM7FRoC.cjs → header-C4Uojzoy.cjs} +1 -1
- package/dist/{header-BQdc29IO.js → header-Cc1Cy0U3.js} +1 -1
- package/dist/{input-wrapper-Bz9GwYrn.js → input-wrapper-BoTugCvh.js} +13 -3
- package/dist/{input-wrapper-BBG8EXQ8.cjs → input-wrapper-J3mEKhvR.cjs} +3 -3
- package/dist/pkt-checkbox.cjs +1 -1
- package/dist/pkt-checkbox.js +1 -1
- package/dist/pkt-combobox.cjs +1 -1
- package/dist/pkt-combobox.js +1 -1
- package/dist/pkt-datepicker.cjs +1 -1
- package/dist/pkt-datepicker.js +1 -1
- package/dist/pkt-fileupload.cjs +1 -1
- package/dist/pkt-fileupload.js +1 -1
- package/dist/pkt-header.cjs +1 -1
- package/dist/pkt-header.js +1 -1
- package/dist/pkt-index.cjs +1 -1
- package/dist/pkt-index.js +11 -11
- package/dist/pkt-input-wrapper.cjs +1 -1
- package/dist/pkt-input-wrapper.js +1 -1
- package/dist/pkt-radiobutton.cjs +1 -1
- package/dist/pkt-radiobutton.js +1 -1
- package/dist/pkt-select.cjs +1 -1
- package/dist/pkt-select.js +1 -1
- package/dist/pkt-textarea.cjs +1 -1
- package/dist/pkt-textarea.js +1 -1
- package/dist/pkt-textinput.cjs +1 -1
- package/dist/pkt-textinput.js +1 -1
- package/dist/pkt-timepicker.cjs +1 -1
- package/dist/pkt-timepicker.js +1 -1
- package/dist/{radiobutton-C3kEjvHQ.cjs → radiobutton-BPr22VmL.cjs} +3 -3
- package/dist/{radiobutton-D9htviZG.js → radiobutton-l_3oGDbb.js} +6 -3
- package/dist/{select-BuQxosyi.cjs → select-CZYQ5Dmx.cjs} +1 -1
- package/dist/{select-BizHes0n.js → select-DYjKMmHa.js} +1 -1
- package/dist/shared-types/checkbox.d.ts +3 -1
- package/dist/shared-types/size.d.ts +2 -1
- package/dist/{textarea-CL1yUDVL.js → textarea-C2oaRlfb.js} +1 -1
- package/dist/{textarea-BXadsEdL.cjs → textarea-H1Lt2o6K.cjs} +1 -1
- package/dist/{textinput-Csil0Zda.js → textinput-C0eu70sH.js} +1 -1
- package/dist/{textinput-qi0f5NZH.cjs → textinput-C2Tx-OrN.cjs} +1 -1
- package/dist/{timepicker-DNoYMBAL.js → timepicker-B8TwchA2.js} +1 -1
- package/dist/{timepicker-CvL2-Siz.cjs → timepicker-DZG_gHIa.cjs} +1 -1
- package/package.json +2 -2
- package/src/components/checkbox/checkbox.test.ts +26 -0
- package/src/components/checkbox/checkbox.ts +3 -2
- package/src/components/input-wrapper/input-wrapper.test.ts +54 -0
- package/src/components/input-wrapper/input-wrapper.ts +11 -2
- package/src/components/input-wrapper/wrapper-parity.test.ts +9 -0
- package/src/components/radiobutton/radiobutton.test.ts +26 -0
- package/src/components/radiobutton/radiobutton.ts +3 -1
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,26 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
|
|
|
5
5
|
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
+
## [19.6.0](https://github.com/oslokommune/punkt/compare/19.5.2...19.6.0) (2026-10-01)
|
|
9
|
+
|
|
10
|
+
### Features
|
|
11
|
+
* Kompakte størrelser for radio, checkbox og switch (#3687). - Checkbox, radio og switch får tre størrelser: medium, small, xsmall
|
|
12
|
+
- Om elementene er i input-wrapper arver de størrelsen til input-wrapper
|
|
13
|
+
- Selve input-elementet forandrer aldri størrelse, kun alt rundt
|
|
14
|
+
- Tile-varianter får høyde 56, 48 og 40 px
|
|
15
|
+
- Støtte for horisontal layout i input-wrapper
|
|
16
|
+
- I grupper skaleres også mellomrom med størrelsen
|
|
17
|
+
- Oppdatert docs med størrelse-seksjon
|
|
18
|
+
- Oppdatert alle relevante skills
|
|
19
|
+
|
|
20
|
+
Synlige _endringer_ (ikke nye ting) for brukere:
|
|
21
|
+
- Tile i størrelse medium er nå 56px istedenfor 60px
|
|
22
|
+
- Label i tile er nå fontvekt medium istedenfor light, for å stemme med Figma
|
|
23
|
+
- I input-wrapper har nå grupper med inputs noe romsligere mellomrom
|
|
24
|
+
|
|
25
|
+
---
|
|
26
|
+
|
|
27
|
+
|
|
8
28
|
## [19.5.2](https://github.com/oslokommune/punkt/compare/19.5.1...19.5.2) (2026-09-30)
|
|
9
29
|
|
|
10
30
|
### Bug Fixes
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import { Booleanish } from '../shared-types';
|
|
2
|
+
import { Booleanish, TPktInputSize } from '../shared-types';
|
|
3
3
|
import { ElementProps } from '../types/typeUtils';
|
|
4
4
|
import { PktOptionsSlotController } from '../controllers/pkt-options-controller';
|
|
5
5
|
import { IPktStringsProps } from '../shared-strings';
|
|
@@ -68,7 +68,7 @@ export declare class PktInputElement<T = {}, TOption extends PktInputOption = Pk
|
|
|
68
68
|
/** @deprecated Bruk `strings={{ forms: { required: '…' } }}` eller `setPktStrings()`. */
|
|
69
69
|
requiredText?: string;
|
|
70
70
|
tagText: string | null;
|
|
71
|
-
inputSize:
|
|
71
|
+
inputSize: TPktInputSize | undefined;
|
|
72
72
|
dataTestid: string;
|
|
73
73
|
private formDisabled;
|
|
74
74
|
protected formDisabledCallback(disabled: boolean): void;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./ref-Emu5PNxk.cjs"),r=require("./input-element-CSfDGslx.cjs");var i={defaultChecked:!1,indeterminate:!1,hasTile:!1,disabled:!1,hasError:!1,isSwitch:!1,hideLabel:!1,labelPosition:`right`,requiredTag:!1,optionalTag:!1},a=class extends r.t{constructor(...e){super(...e),this.inputRef=n.t(),this.value=``,this.checkHelptext=null,this.defaultChecked=i.defaultChecked,this.hasTile=i.hasTile,this.isSwitch=i.isSwitch,this.labelPosition=i.labelPosition,this.hideLabel=i.hideLabel,this.checked=null,this.indeterminate=i.indeterminate,this.type=`checkbox`,this.tagText=null,this.optionalTag=i.optionalTag,this.requiredTag=i.requiredTag}connectedCallback(){super.connectedCallback()}attributeChangedCallback(e,t,n){e===`checked`&&(this.checked=this.checked===``||this.checked===`true`||this.checked===!0,this.inputRef.value&&(this.inputRef.value.checked=this.checked)),e===`indeterminate`&&(this.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0,this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate)),super.attributeChangedCallback(e,t,n)}firstUpdated(e){this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.firstUpdated(e)}willUpdate(e){super.willUpdate(e),e.has(`defaultChecked`)&&!this.checked&&(this.checked=this.defaultChecked)}updated(e){e.has(`checked`)&&this.inputRef.value&&(this.inputRef.value.checked=this.checked===``||this.checked===`true`||this.checked===!0),e.has(`indeterminate`)&&this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.updated(e)}render(){let r=t.t({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.isDisabled&&this.hasTile}),i=t.t({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),a=t.t({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.isDisabled,"pkt-input-check__input-label--left":this.labelPosition===`left`,"pkt-input-check__input-label--right":this.labelPosition===`right`,"pkt-sr-only":this.hideLabel}),o=`pkt-tag pkt-tag--small pkt-tag--thin-text`,s=this.pktStrings.get(`forms`),c=()=>e._`
|
|
1
|
+
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./ref-Emu5PNxk.cjs"),r=require("./input-element-CSfDGslx.cjs");var i={defaultChecked:!1,indeterminate:!1,hasTile:!1,disabled:!1,hasError:!1,isSwitch:!1,hideLabel:!1,labelPosition:`right`,requiredTag:!1,optionalTag:!1},a=class extends r.t{constructor(...e){super(...e),this.inputRef=n.t(),this.value=``,this.checkHelptext=null,this.defaultChecked=i.defaultChecked,this.hasTile=i.hasTile,this.isSwitch=i.isSwitch,this.labelPosition=i.labelPosition,this.hideLabel=i.hideLabel,this.checked=null,this.indeterminate=i.indeterminate,this.type=`checkbox`,this.inputSize=void 0,this.tagText=null,this.optionalTag=i.optionalTag,this.requiredTag=i.requiredTag}connectedCallback(){super.connectedCallback()}attributeChangedCallback(e,t,n){e===`checked`&&(this.checked=this.checked===``||this.checked===`true`||this.checked===!0,this.inputRef.value&&(this.inputRef.value.checked=this.checked)),e===`indeterminate`&&(this.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0,this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate)),super.attributeChangedCallback(e,t,n)}firstUpdated(e){this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.firstUpdated(e)}willUpdate(e){super.willUpdate(e),e.has(`defaultChecked`)&&!this.checked&&(this.checked=this.defaultChecked)}updated(e){e.has(`checked`)&&this.inputRef.value&&(this.inputRef.value.checked=this.checked===``||this.checked===`true`||this.checked===!0),e.has(`indeterminate`)&&this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.updated(e)}render(){let r=t.t({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.isDisabled&&this.hasTile}),i=t.t({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),a=t.t({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.isDisabled,"pkt-input-check__input-label--left":this.labelPosition===`left`,"pkt-input-check__input-label--right":this.labelPosition===`right`,"pkt-sr-only":this.hideLabel}),o=`pkt-tag pkt-tag--small pkt-tag--thin-text`,s=this.pktStrings.get(`forms`),c=()=>e._`
|
|
2
2
|
${this.tagText?e._`<span class=${o+` pkt-tag--gray`}>${this.tagText}</span>`:e.h}
|
|
3
3
|
${this.optionalTag?e._`<span class=${o+` pkt-tag--blue-light`}
|
|
4
4
|
>${this.optionalText??s.optional}</span
|
|
@@ -14,7 +14,7 @@ const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),
|
|
|
14
14
|
</div>`:e.h}
|
|
15
15
|
</label>
|
|
16
16
|
`;return e._`
|
|
17
|
-
<div class="pkt-input-check">
|
|
17
|
+
<div class="pkt-input-check${this.inputSize?` pkt-input-check--${this.inputSize}`:``}">
|
|
18
18
|
<div class=${r}>
|
|
19
19
|
${this.labelPosition===`left`?d():e.h}
|
|
20
20
|
<input
|
|
@@ -37,4 +37,4 @@ const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),
|
|
|
37
37
|
${this.labelPosition===`right`?d():e.h}
|
|
38
38
|
</div>
|
|
39
39
|
</div>
|
|
40
|
-
`}handleInput(e){e.stopImmediatePropagation(),this.onInput()}handleClick(e){if(this.isDisabled)return e.preventDefault(),e.stopImmediatePropagation(),!1}handleChange(e){if(this.isDisabled)return e.preventDefault(),e.stopImmediatePropagation(),!1;this.toggleChecked(e)}toggleChecked(e){if(this.isDisabled){e.preventDefault(),e.stopImmediatePropagation();return}let t=e.target;if(t&&t.disabled){e.preventDefault(),e.stopImmediatePropagation();return}e.stopImmediatePropagation(),this.touched=!0,this.inputRef.value&&(this.checked=this.inputRef.value.matches(`:checked`),this.valueChecked(this.checked))}};e.n([e.u({type:String,reflect:!0})],a.prototype,`value`,void 0),e.n([e.u({type:String})],a.prototype,`checkHelptext`,void 0),e.n([e.u({type:Boolean})],a.prototype,`defaultChecked`,void 0),e.n([e.u({type:Boolean})],a.prototype,`hasTile`,void 0),e.n([e.u({type:Boolean})],a.prototype,`isSwitch`,void 0),e.n([e.u({type:String})],a.prototype,`labelPosition`,void 0),e.n([e.u({type:Boolean})],a.prototype,`hideLabel`,void 0),e.n([e.u({type:Boolean,reflect:!0})],a.prototype,`checked`,void 0),e.n([e.u({type:Boolean,reflect:!0})],a.prototype,`indeterminate`,void 0),e.n([e.u({type:String,reflect:!0})],a.prototype,`type`,void 0),e.n([e.u({type:String})],a.prototype,`tagText`,void 0),e.n([e.u({type:Boolean})],a.prototype,`optionalTag`,void 0),e.n([e.u({type:String})],a.prototype,`optionalText`,void 0),e.n([e.u({type:Boolean})],a.prototype,`requiredTag`,void 0),e.n([e.u({type:String})],a.prototype,`requiredText`,void 0);try{e.d(`pkt-checkbox`)(a)}catch{console.warn(`Forsøker å definere <pkt-checkbox>, men den er allerede definert`)}var o=a;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return o}});
|
|
40
|
+
`}handleInput(e){e.stopImmediatePropagation(),this.onInput()}handleClick(e){if(this.isDisabled)return e.preventDefault(),e.stopImmediatePropagation(),!1}handleChange(e){if(this.isDisabled)return e.preventDefault(),e.stopImmediatePropagation(),!1;this.toggleChecked(e)}toggleChecked(e){if(this.isDisabled){e.preventDefault(),e.stopImmediatePropagation();return}let t=e.target;if(t&&t.disabled){e.preventDefault(),e.stopImmediatePropagation();return}e.stopImmediatePropagation(),this.touched=!0,this.inputRef.value&&(this.checked=this.inputRef.value.matches(`:checked`),this.valueChecked(this.checked))}};e.n([e.u({type:String,reflect:!0})],a.prototype,`value`,void 0),e.n([e.u({type:String})],a.prototype,`checkHelptext`,void 0),e.n([e.u({type:Boolean})],a.prototype,`defaultChecked`,void 0),e.n([e.u({type:Boolean})],a.prototype,`hasTile`,void 0),e.n([e.u({type:Boolean})],a.prototype,`isSwitch`,void 0),e.n([e.u({type:String})],a.prototype,`labelPosition`,void 0),e.n([e.u({type:Boolean})],a.prototype,`hideLabel`,void 0),e.n([e.u({type:Boolean,reflect:!0})],a.prototype,`checked`,void 0),e.n([e.u({type:Boolean,reflect:!0})],a.prototype,`indeterminate`,void 0),e.n([e.u({type:String,reflect:!0})],a.prototype,`type`,void 0),e.n([e.u({type:String,attribute:`input-size`})],a.prototype,`inputSize`,void 0),e.n([e.u({type:String})],a.prototype,`tagText`,void 0),e.n([e.u({type:Boolean})],a.prototype,`optionalTag`,void 0),e.n([e.u({type:String})],a.prototype,`optionalText`,void 0),e.n([e.u({type:Boolean})],a.prototype,`requiredTag`,void 0),e.n([e.u({type:String})],a.prototype,`requiredText`,void 0);try{e.d(`pkt-checkbox`)(a)}catch{console.warn(`Forsøker å definere <pkt-checkbox>, men den er allerede definert`)}var o=a;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return o}});
|
|
@@ -16,7 +16,7 @@ var l = {
|
|
|
16
16
|
optionalTag: !1
|
|
17
17
|
}, u = class extends c {
|
|
18
18
|
constructor(...e) {
|
|
19
|
-
super(...e), this.inputRef = s(), this.value = "", this.checkHelptext = null, this.defaultChecked = l.defaultChecked, this.hasTile = l.hasTile, this.isSwitch = l.isSwitch, this.labelPosition = l.labelPosition, this.hideLabel = l.hideLabel, this.checked = null, this.indeterminate = l.indeterminate, this.type = "checkbox", this.tagText = null, this.optionalTag = l.optionalTag, this.requiredTag = l.requiredTag;
|
|
19
|
+
super(...e), this.inputRef = s(), this.value = "", this.checkHelptext = null, this.defaultChecked = l.defaultChecked, this.hasTile = l.hasTile, this.isSwitch = l.isSwitch, this.labelPosition = l.labelPosition, this.hideLabel = l.hideLabel, this.checked = null, this.indeterminate = l.indeterminate, this.type = "checkbox", this.inputSize = void 0, this.tagText = null, this.optionalTag = l.optionalTag, this.requiredTag = l.requiredTag;
|
|
20
20
|
}
|
|
21
21
|
connectedCallback() {
|
|
22
22
|
super.connectedCallback();
|
|
@@ -64,7 +64,7 @@ var l = {
|
|
|
64
64
|
</label>
|
|
65
65
|
`;
|
|
66
66
|
return e`
|
|
67
|
-
<div class="pkt-input-check">
|
|
67
|
+
<div class="pkt-input-check${this.inputSize ? ` pkt-input-check--${this.inputSize}` : ""}">
|
|
68
68
|
<div class=${t}>
|
|
69
69
|
${this.labelPosition === "left" ? f() : n}
|
|
70
70
|
<input
|
|
@@ -124,7 +124,10 @@ r([i({
|
|
|
124
124
|
})], u.prototype, "indeterminate", void 0), r([i({
|
|
125
125
|
type: String,
|
|
126
126
|
reflect: !0
|
|
127
|
-
})], u.prototype, "type", void 0), r([i({
|
|
127
|
+
})], u.prototype, "type", void 0), r([i({
|
|
128
|
+
type: String,
|
|
129
|
+
attribute: "input-size"
|
|
130
|
+
})], u.prototype, "inputSize", void 0), r([i({ type: String })], u.prototype, "tagText", void 0), r([i({ type: Boolean })], u.prototype, "optionalTag", void 0), r([i({ type: String })], u.prototype, "optionalText", void 0), r([i({ type: Boolean })], u.prototype, "requiredTag", void 0), r([i({ type: String })], u.prototype, "requiredText", void 0);
|
|
128
131
|
try {
|
|
129
132
|
t("pkt-checkbox")(u);
|
|
130
133
|
} catch {
|
|
@@ -10,7 +10,7 @@ import { t as f } from "./repeat-CdxGS-_3.js";
|
|
|
10
10
|
import { a as p, c as m, i as h, l as g, o as _, r as v, s as y } from "./listbox-Ct9jIV_5.js";
|
|
11
11
|
import { t as b } from "./input-element-lLzfwdim.js";
|
|
12
12
|
import { t as x } from "./pkt-options-controller-D7l18Iw0.js";
|
|
13
|
-
import { r as S } from "./input-wrapper-
|
|
13
|
+
import { r as S } from "./input-wrapper-BoTugCvh.js";
|
|
14
14
|
//#region ../../shared-utils/combobox/input-utils.ts
|
|
15
15
|
var C = (e, t, n) => {
|
|
16
16
|
switch (e) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-D7sTqOr3.cjs");require("./icon-Dnv6LtPC.cjs");const i=require("./if-defined-2mkIDgOm.cjs"),a=require("./ref-Emu5PNxk.cjs");require("./tag-B5dUg7AD.cjs");const o=require("./repeat-Dh9YKoeV.cjs"),s=require("./listbox-g-vHHLkD.cjs"),c=require("./input-element-CSfDGslx.cjs"),l=require("./pkt-options-controller-CpEZcomb.cjs"),u=require("./input-wrapper-BBG8EXQ8.cjs");var d=(e,t,n)=>{switch(e){case`,`:return n?`addValue`:null;case`Enter`:return`addValue`;case`Tab`:case`ArrowDown`:return t?null:`focusListbox`;case`Escape`:return`closeOptions`;default:return null}},f=(e,t,n,r,i)=>{if(!e)return{action:`none`,value:null};let a=s.i(n,e);return!t.includes(e)&&!a?r?{action:`addUserValue`,value:e}:i?{action:`none`,value:null}:{action:`removeValue`,value:t[0]}:a&&!t.includes(a.value)?{action:`selectOption`,value:a.value}:{action:`none`,value:null}},p=(e,t,n,r,i)=>e.trim().toLowerCase()?{...s.c(e,t,n,r),shouldRemoveValue:!1,shouldResetInput:!1}:{addValueText:null,userInfoMessage:``,shouldRemoveValue:!i&&!!t[0],shouldResetInput:!0},m=(e,t,n)=>{let r=s.i(t,e);return n===`label`&&r?.label?r.label:e},h={markOptionSelected(e,t){if(t){for(let n of e)if(n.value===t){n.selected=!0;break}}},markOptionDeselected(e,t){if(t){for(let n of e)if(n.value===t){n.selected=!1;break}}},markAllSelected(e){for(let t of e)t.selected=!0},markAllDeselected(e){for(let t of e)t.selected=!1},removeUserAddedOptions(e){return e.filter(e=>!e.userAdded)}},g={parseOptionsFromSlot(e){let t=[];return e.forEach(e=>{if(!e.textContent&&!e.getAttribute(`value`))return;let n={value:e.getAttribute(`value`)||e.textContent||``,label:e.textContent||e.getAttribute(`value`)||``};e.getAttribute(`data-prefix`)&&(n.prefix=e.getAttribute(`data-prefix`)||void 0),e.getAttribute(`tagskincolor`)&&(n.tagSkinColor=e.getAttribute(`tagskincolor`)),e.getAttribute(`description`)&&(n.description=e.getAttribute(`description`)||void 0),n.fulltext=s.r(n),t.push(n)}),t}},_={cloneOptions(e){return Array.isArray(e)?e.map(e=>({...e})):[]},syncOptionsWithValues(e,t){let n=[...t];return e.forEach(e=>{e.value&&!e.label&&(e.label=e.value),e.selected&&!n.includes(e.value)&&n.push(e.value),e.fulltext=s.r(e),e.selected=e.selected||n.includes(e.value)}),{options:e,newValues:n}},mergeWithUserAdded(e,t,n){return[...t.filter(e=>e?.userAdded&&n.includes(e.value)).filter(t=>!(Array.isArray(e)?e:[]).some(e=>e.value===t.value)),...e]}},v={name:`pkt-combobox`,react:`PktCombobox`,"css-class":`pkt-combobox`,isElement:!0,isPureReact:!0,"dark-mode":!0,props:{name:{type:`string`,name:`Navn`,description:`Navn som brukes i skjema ved innsending`,category:`tech`},form:{name:`Skjema`,description:`ID-en til skjemaet feltet hører til, når feltet ligger utenfor skjemaet`,type:`string`,required:!1,category:`tech`},id:{type:`string`,name:`ID`,description:`Unik ID for feltet`,category:`tech`},label:{type:`string`,name:`Etikett/label`,description:`Tekst som vises over feltet`,category:`contents`},placeholder:{name:`Hint`,description:`Spesifiserer en kort hint som beskriver forventet verdi av feltet.`,type:`string`,category:`contents`,required:!1},multiple:{type:`boolean`,name:`Flervalg`,default:!1,description:`Mulighet for å velge flere valg`,category:`functionality`},tagPlacement:{attribute:`tag-placement`,type:[`inside`,`outside`],name:`Plassering av tags i flervalg`,description:`Plassering av valgte verdier i feltet ved flervalg`,category:`functionality`,showIf:{multiple:!0}},maxlength:{type:`number`,name:`Maks antall i flervalg`,description:`Maks antall valg dersom flervalg er aktivert`,category:`functionality`,showIf:{multiple:!0}},typeahead:{type:`boolean`,name:`Typeahead`,default:!1,description:`Mulighet for automatisk utfylling av feltet fra listen over valg`,category:`functionality`},includeSearch:{attribute:`include-search`,type:`boolean`,name:`Inkluder søk`,description:`Mulighet for å søke etter valg inni dropdown`,category:`functionality`},allowUserInput:{attribute:`allow-user-input`,type:`boolean`,name:`Brukervalgte verdier`,description:`Mulighet for å skrive inn egne verdier`,category:`functionality`},searchPlaceholder:{attribute:`search-placeholder`,type:`string`,name:`Søke-plassholder`,description:`Plassholdertekst for søkefeltet i dropdown`,category:`contents`,showIf:{includeSearch:!0}},displayValueAs:{attribute:`display-value-as`,type:[`label`,`value`,`prefixAndValue`],name:`Visning av valgt verdi`,description:`Hvordan valgt verdi vises i feltet`,default:`label`,category:`ui`},inputSize:{name:`Størrelse`,description:`Visuell størrelse via input-wrapper. small: kompakt wrapper og felt (42px). xsmall: samme wrapper som small, felt 36px.`,attribute:`input-size`,type:[`small`,`medium`,`xsmall`],default:`medium`,category:`ui`},value:{name:`Verdi`,type:`string`,description:`Valgt verdi. Streng ved enkelt valg, array av strenger ved flervalg.`,category:`tech`},helptext:{type:`string`,name:`Hjelpetekst`,description:`Hjelpetekst som vises over feltet`,category:`contents`},helptextDropdown:{attribute:`helptextdropdown`,type:`string`,name:`Utvidet hjelpetekst`,description:`Hjelpetekst som vises i en lukket boks man kan åpne`,category:`contents`},helptextDropdownButton:{attribute:`helptextdropdownbutton`,type:`string`,name:`Knappetekst for hjelpetekst`,description:`Tekst som vises på knappen for å åpne/lukke utvidet hjelpetekst`,category:`contents`,default:`Les mer`},disabled:{type:`boolean`,name:`Deaktivert`,description:`Feltet er deaktivert`,category:`tech`},hasError:{attribute:`haserror`,type:`boolean`,name:`Feil`,description:`Feltet har en feil`,category:`ui`},errorMessage:{attribute:`errormessage`,type:`string`,name:`Feilmelding`,description:`Tekst som vises under feltet ved feil`,category:`contents`},required:{type:`boolean`,name:`Påkrevd`,description:`Feltet må fylles ut`,category:`tech`},requiredTag:{attribute:`requiredtag`,type:`boolean`,name:`Påkrevd-merking`,description:`Viser en merking som indikerer at feltet er påkrevd`,category:`ui`},requiredText:{attribute:`requiredtext`,type:`string`,name:`Påkrevd-tekst`,description:`Tekst som vises i påkrevd-merkingen`,category:`contents`},optionalTag:{attribute:`optionaltag`,type:`boolean`,name:`Valgfritt-merking`,description:`Viser en merking som indikerer at feltet er valgfritt`,category:`ui`},optionalText:{attribute:`optionaltext`,type:`string`,name:`Valgfritt-tekst`,description:`Tekst som vises i valgfritt-merkingen`,category:`contents`},tagText:{attribute:`tagtext`,type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},fullwidth:{type:`boolean`,name:`Full bredde`,description:`Skal feltet ta opp hele bredden?`,category:`ui`},defaultOptions:{attribute:`default-options`,name:`Initielle valg (default options)`,description:`Liste over valg som kan velges, om options sendes inn som array med objekter (denne vil ikke modifiseres ved endring innad i komponenten)`,type:`IPktComboboxOption[]`,default:[],previewDefault:[{value:`bfr`,label:`Frogner`},{value:`bgo`,label:`Gamle Oslo`},{value:`bgr`,label:`Grorud`},{value:`bxx`,label:`Andre bydeler`}],items:{type:`object`,properties:{value:{type:`string`,description:`Verdi som sendes ved valg`},label:{type:`string`,description:`Tekst som vises for valget`},prefix:{type:`string`,description:`Tekst som vises før valget`},description:{type:`string`,description:`Beskrivelse av valget`},disabled:{type:`boolean`,description:`Valget er deaktivert`},selected:{type:`boolean`,description:`Valget er valgt`},tagSkinColor:{type:[`blue`,`blue-dark`,`blue-light`,`green`,`red`,`yellow`,`beige`,`gray`,`grey`],description:`Farge på tag`}},required:[`value`]},category:`contents`},options:{name:`Valg`,type:`IPktComboboxOption[]`,description:`Liste over valg som kan velges, om options sendes inn som array med objekter`,default:[],items:{type:`object`,properties:{value:{type:`string`,description:`Verdi som sendes ved valg`},label:{type:`string`,description:`Tekst som vises for valget`},prefix:{type:`string`,description:`Tekst som vises før valget`},description:{type:`string`,description:`Beskrivelse av valget`},disabled:{type:`boolean`,description:`Valget er deaktivert`},selected:{type:`boolean`,description:`Valget er valgt`},tagSkinColor:{type:[`blue`,`blue-dark`,`blue-light`,`green`,`red`,`yellow`,`beige`,`gray`,`grey`],description:`Farge på tag`}},required:[`value`]},category:`contents`},inline:{name:`Inline`,type:`boolean`,required:!1,default:!1,description:`Angir om feltet skal flyte med teksten`,category:`ui`},useWrapper:{attribute:`usewrapper`,name:`Bruk wrapper`,type:`boolean`,required:!1,displayAsFalse:!0,default:!0,description:`Indikerer om skjemaelementet skal bruke en wrapper`,category:`ui`},hasFieldset:{attribute:`hasfieldset`,name:`Bruk fieldset`,type:`boolean`,required:!1,default:null,description:`Bruk fieldset og legend i stedet for label. Utledes automatisk når feltet ikke har en input.`,category:`ui`},counter:{name:`Teller`,type:`boolean`,required:!1,default:null,description:`Viser teller under feltet. Slås på av seg selv når det finnes en grense å telle mot; sett til false for å skru den av.`,category:`ui`},defaultValue:{attribute:`defaultvalue`,type:`string | string[]`,name:`Standardverdi`,description:`Verdien feltet får ved oppstart og ved nullstilling av skjemaet`,category:`functionality`}},events:{change:{type:`Event`,description:`Returnerer valgt verdi som streng. Ved flervalg returneres kommaseparerte verdier.`},"value-change":{type:`CustomEvent`,description:`Returnerer valgt verdi. Ved enkeltvalg en streng, ved flervalg en <code>string[]</code>.`},search:{type:`CustomEvent`,description:`Returnerer søketeksten som streng i <code>event.detail</code> når brukeren skriver i søkefeltet`},toggleHelpText:{type:`CustomEvent`,description:`Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes`}}},y=class extends c.t{constructor(){super(),this.value=``,this.options=[],this.defaultOptions=[],this.allowUserInput=!1,this.typeahead=!1,this.includeSearch=!1,this.searchPlaceholder=null,this.multiple=!1,this.maxlength=null,this.displayValueAs=v.props.displayValueAs.default,this.tagPlacement=null,this.isOpen=!1,this._options=[],this._value=[],this._isOptionsOpen=!1,this._userInfoMessage=``,this._messageValue=null,this._addValueText=null,this._maxIsReached=!1,this._search=``,this._inputFocus=!1,this._skipInputTab=!1,this._optionsFromSlot=!1,this._lastSlotGeneration=0,this._suppressNextOpen=!1,this.inputRef=a.t(),this.triggerRef=a.t(),this.listboxRef=a.t(),this._pendingDispatchFrom=null,this.optionsController=new l.t(this)}get _hasTextInput(){return this.typeahead||this.allowUserInput}get _selectionDescription(){if(!(!this.multiple||this._value.length===0))return`${this._value.length} valgt`}focusTrigger(){this._hasTextInput?this.inputRef.value?.focus():this.triggerRef.value?.focus()}focusAfterCommit(){this._skipInputTab=!0;let e=this.inputRef.value;e&&e.type!==`hidden`&&e.setAttribute(`tabindex`,`-1`),this.triggerRef.value?.focus()}restoreInputTab(){this._skipInputTab=!1}parseValue(){return this.parseToValues(this.value)}parseToValues(e){return Array.isArray(e)?this.multiple?e:e.length>0?[e[0]]:[]:e&&this.multiple?e.split(`,`):e?[e]:[]}updateMaxReached(){this._maxIsReached=s.l(this._value.length,this.maxlength)}syncPublicValue(){let e=this.multiple?this._value.join(`,`):this._value[0]||``;e!==(Array.isArray(this.value)?this.value.join(`,`):String(this.value||``))&&(this.value=e)}dispatchValueChange(e){let t=this._value;if(e?.join(`,`)!==t.join(`,`)){let e=this.multiple?[...t]:t[0]||``;this.onChange(e)}else t.length===0&&e&&e.length>0&&this.clearInputValue()}onChange(e){this.touched=!0,super.onChange(e)}valueChanged(){}};e.n([e.u({type:String,reflect:!0})],y.prototype,`value`,void 0),e.n([e.u({type:Array})],y.prototype,`options`,void 0),e.n([e.u({type:Array,attribute:`default-options`})],y.prototype,`defaultOptions`,void 0),e.n([e.u({type:Boolean,attribute:`allow-user-input`})],y.prototype,`allowUserInput`,void 0),e.n([e.u({type:Boolean})],y.prototype,`typeahead`,void 0),e.n([e.u({type:Boolean,attribute:`include-search`})],y.prototype,`includeSearch`,void 0),e.n([e.u({type:String,attribute:`search-placeholder`})],y.prototype,`searchPlaceholder`,void 0),e.n([e.u({type:Boolean})],y.prototype,`multiple`,void 0),e.n([e.u({type:Number})],y.prototype,`maxlength`,void 0),e.n([e.u({type:String,attribute:`display-value-as`})],y.prototype,`displayValueAs`,void 0),e.n([e.u({type:String,attribute:`tag-placement`})],y.prototype,`tagPlacement`,void 0),e.n([e.u({type:Boolean,attribute:`open`})],y.prototype,`isOpen`,void 0),e.n([e.l()],y.prototype,`_options`,void 0),e.n([e.l()],y.prototype,`_value`,void 0),e.n([e.l()],y.prototype,`_isOptionsOpen`,void 0),e.n([e.l()],y.prototype,`_userInfoMessage`,void 0),e.n([e.l()],y.prototype,`_messageValue`,void 0),e.n([e.l()],y.prototype,`_addValueText`,void 0),e.n([e.l()],y.prototype,`_maxIsReached`,void 0),e.n([e.l()],y.prototype,`_search`,void 0),e.n([e.l()],y.prototype,`_inputFocus`,void 0),e.n([e.l()],y.prototype,`_skipInputTab`,void 0);var b=class extends y{toggleValue(e){if(this.isDisabled)return;this.touched=!0,this._userInfoMessage=``,this._addValueText=null;let t=s.i(this.options,e)?.value||null,n=this._value.includes(e||t||``),r=!!t,i=this._options.find(t=>t.value===e)?.disabled||!1,a=!e?.trim(),o=!this.multiple,c=this.multiple,l=s.l(this._value.length,this.maxlength),u=!1,d=!0,f=``,p=null,h=``;i||(!r&&this.allowUserInput&&!a?(this.addNewUserValue(e),f=`valueAdded`,u=c):!r&&!this.allowUserInput?(o&&this._value[0]&&this.removeValue(this._value[0]),d=!1,u=!0,f=`noResults`):n?(this.removeValue(t),u=!0,o&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=``)):a&&o?(this.removeAllSelected(),u=!0):o?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t),u=!1,f=`valueSelected`,p=this._hasTextInput?m(t||``,this.options,this.displayValueAs):s.s(s.i(this.options,t),this.displayValueAs)):c&&!l?(this.setSelected(t),u=!0):c&&l?(f=`maxSelected`,d=!1,h=e):(o&&this.removeAllSelected(),f=`noValidValue`,d=!1,u=!0,h=e),this._isOptionsOpen=u,u||window.setTimeout(()=>{this.focusAfterCommit()},0),this._search=h||``,this.resetComboboxInput(d),this._userInfoMessage=f,this._messageValue=p,c&&this.updateMaxReached())}setSelected(e){if(!this._value.includes(e)){if(this.multiple&&s.l(this._value.length,this.maxlength)){this._userInfoMessage=`maxSelected`;return}!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,h.markOptionSelected(this._options,e),this.resetComboboxInput(!0)}}removeSelected(e){if(!e)return;this._value=this._value.filter(t=>t!==e);let t=s.i(this.options,e);t&&(h.markOptionDeselected(this.options,e),t.userAdded?(this._options=[...this._options.filter(t=>t.value!==e)],this.options=[...this.options.filter(t=>t.value!==e)]):this._options.some(t=>t.value===e)?this.refreshOptionsFromValue():this._options=[...this._options,t])}addAllOptions(){if(this.multiple){if(this.maxlength&&this._options.length>this.maxlength){this._userInfoMessage=`tooManySelected`;return}this._value=this._options.map(e=>e.value),h.markAllSelected(this._options),this.requestUpdate()}}removeAllSelected(){this._value=[],h.markAllDeselected(this._options),this._options=h.removeUserAddedOptions(this._options),this.requestUpdate()}addValue(){let e=this.inputRef.value?.value.trim()||``;if(this._search=e,e&&this._value.includes(e)){this.resetComboboxInput(!0),this._userInfoMessage=`alreadySelected`;return}this.toggleValue(e)}removeValue(e){this._value=this.multiple?this._value.filter(t=>t!==e):[],this.removeSelected(e)}addNewUserValue(e){if(!e||e.trim()===``)return;if(!this.multiple)this._value[0]&&this.removeSelected(this._value[0]),this._value=[e];else if(!s.i(this.options,e)){if(s.l(this._value.length,this.maxlength))return;this._value=[...this._value,e]}let t={value:e,label:e,userAdded:!0,selected:!0};this.options=[t,...this.options],this._options=[t,...this._options],this.resetComboboxInput(!0),this.multiple||(this._isOptionsOpen=!1,window.setTimeout(()=>{this.focusAfterCommit()},0)),this.requestUpdate()}refreshOptionsFromValue(){let e=_.cloneOptions(this.options);e.forEach(e=>e.selected=this._value.includes(e.value)),this._options=_.syncOptionsWithValues(e,this._value).options}resetComboboxInput(e=!0){this._addValueText=null,this.inputRef.value&&this.inputRef.value.type!==`hidden`&&e&&(this._search=``,this.multiple?this.inputRef.value.value=``:(this.inputRef.value.value=this._value[0]?m(this._value[0],this.options,this.displayValueAs):``,this._userInfoMessage=``)),this.refreshOptionsFromValue()}removeLastValue(e){if(this._value.length===0)return;e.preventDefault();let t=this._value[this._value.length-1];t&&this.removeSelected(t),this.updateMaxReached()}},x=class extends b{handleInput(e){if(e.stopPropagation(),e.stopImmediatePropagation(),this.isDisabled)return;this.touched=!0;let t=e.target;if(this._search=t.value,this.checkForMatches(),this.typeahead){if(this._search){let{filtered:n,suggestion:r}=s.o(this.options,this._search);this._options=n,e.inputType!==`deleteContentBackward`&&r?.label&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(t.value=r.label,window.setTimeout(()=>t.setSelectionRange(this._search.length,t.value.length),0),t.selectionDirection=`backward`)}else this.refreshOptionsFromValue()}}handleFocus(){if(!this.isDisabled){if(this._skipInputTab=!1,this._suppressNextOpen){this._suppressNextOpen=!1,this._inputFocus=!0,this.requestUpdate();return}!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=m(this._value[0],this.options,this.displayValueAs)),this._inputFocus=!0,this._search=``,this.refreshOptionsFromValue(),this._isOptionsOpen=!0,this.onFocus(),this.requestUpdate()}}handleCloseOptions(){this._isOptionsOpen=!1,this._hasTextInput&&(this._suppressNextOpen=!0),this.focusTrigger()}handleFocusOut(e){if(this.isDisabled||!this._isOptionsOpen)return;let t=e.relatedTarget;t?.closest(`pkt-combobox`)?.id===this.id||e.target?.classList?.contains(`pkt-combobox__value`)||t===this.inputRef.value||t===this.triggerRef.value||this.closeAndProcessInput()}closeAndProcessInput(){if(this._inputFocus=!1,this._addValueText=null,this._userInfoMessage=``,this._search=``,this.inputRef.value&&this.inputRef.value.type!==`hidden`){let e=this.inputRef.value.value;if(!this.multiple){if(!e)this._value[0]&&this.removeSelected(this._value[0]);else{let t=s.i(this.options,e);t&&t.value!==this._value[0]?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t.value)):!t&&this.allowUserInput&&(this._value[0]&&this.removeSelected(this._value[0]),this.addNewUserValue(e))}}else if(e!==``){let{action:t,value:n}=f(e,this._value,this.options,this.allowUserInput,this.multiple);switch(t){case`addUserValue`:this.addNewUserValue(n);break;case`selectOption`:this.setSelected(n);break;case`removeValue`:this.removeValue(n)}}!this.multiple&&this._value[0]?this.inputRef.value.value=m(this._value[0],this.options,this.displayValueAs):this.inputRef.value.value=``}this._isOptionsOpen=!1,this.onBlur()}handleBlur(){this._inputFocus=!1,this.onBlur()}handleInputClick(e){if(this.isDisabled){e.preventDefault(),e.stopImmediatePropagation();return}this._hasTextInput?(this.inputRef.value?.focus(),this.requestUpdate()):(e.stopImmediatePropagation(),e.preventDefault(),this._isOptionsOpen=!this._isOptionsOpen,this._isOptionsOpen&&this.listboxRef.value?.focusFirstOrSelectedOption())}handlePlaceholderClick(e){this.isDisabled||(e.stopPropagation(),this._hasTextInput&&this.inputRef.value?(this.inputRef.value.focus(),this._inputFocus=!0,this.requestUpdate()):(this._isOptionsOpen=!this._isOptionsOpen,this.requestUpdate()))}handleSelectOnlyKeydown(e){if(!this.isDisabled)switch(e.key){case`Enter`:case` `:case`ArrowDown`:case`ArrowUp`:e.preventDefault(),this._isOptionsOpen?this._isOptionsOpen=!1:(this._isOptionsOpen=!0,this.listboxRef.value?.focusFirstOrSelectedOption());break;case`Escape`:this._isOptionsOpen&&=(e.preventDefault(),!1);break;case`Home`:case`End`:e.preventDefault(),this._isOptionsOpen||=!0,this.listboxRef.value?.focusFirstOrSelectedOption();break;case`ArrowLeft`:this.multiple&&this._value.length>0&&(e.preventDefault(),this.focusTag(this._value.length-1));break;case`Backspace`:case`Delete`:this.multiple&&this._value.length>0&&(e.preventDefault(),this.removeSelected(this._value[this._value.length-1]))}}handleOptionToggled(e){this.toggleValue(e.detail)}handleSearch(e){e.stopPropagation(),this._search=e.detail.toLowerCase(),this.checkForMatches()}handleInputKeydown(e){if(e.key===`Backspace`){let t=!this.inputRef.value?.value;!this._search&&t&&this.multiple&&this._value.length>0&&this.removeLastValue(e);return}if(e.key===`ArrowLeft`&&this.multiple&&this._value.length>0){let t=this.inputRef.value;if(t&&t.selectionStart===0&&!t.value){e.preventDefault(),this.focusTag(this._value.length-1);return}}let t=d(e.key,e.shiftKey,this.multiple);if(t&&!(e.key===`Tab`&&!this._isOptionsOpen)){if(t===`focusListbox`&&e.key===`Tab`&&!this.listboxRef.value?.querySelector(`[role="option"]:not([data-disabled]), [data-type="new-option"]`)){this.closeAndProcessInput();return}switch(e.preventDefault(),t){case`addValue`:this.addValue();break;case`focusListbox`:this.listboxRef.value?.focusFirstOrSelectedOption();break;case`closeOptions`:this._isOptionsOpen=!1}}}handleTagRemove(e){this.removeSelected(e),this._hasTextInput&&this.inputRef.value&&(this._inputFocus=!0,this.inputRef.value.focus(),this.requestUpdate())}getInsideTags(){return Array.from(this.querySelectorAll(`.pkt-combobox__input .pkt-combobox__tag-list pkt-tag`))}focusTag(e){let t=this.getInsideTags();t.forEach((t,n)=>{t.buttonTabindex=n===e?0:-1}),(t[e]?.querySelector(`button`))?.focus()}resetTagTabindices(){this.getInsideTags().forEach(e=>{e.buttonTabindex=-1})}handleTagKeydown(e,t){e.stopPropagation();let n=()=>{this.resetTagTabindices(),this._hasTextInput&&this.inputRef.value?this.inputRef.value.focus():this.triggerRef.value?.focus()};switch(e.key){case`ArrowLeft`:e.preventDefault(),t>0&&this.focusTag(t-1);break;case`ArrowRight`:e.preventDefault(),t<this._value.length-1?this.focusTag(t+1):n();break;case`Backspace`:case`Delete`:e.preventDefault();{let e=this._value[t],r=t>=this._value.length-1?t-1:t;this.removeSelected(e),r>=0?(this.requestUpdate(),this.updateComplete.then(()=>this.focusTag(r))):n()}break;case`Tab`:this.resetTagTabindices();break;case`Escape`:e.preventDefault(),n()}}checkForMatches(){let e=p(this.inputRef.value?.value||this._search||``,this._value,this.options,this.allowUserInput,this.multiple);if(e.shouldRemoveValue&&this.removeValue(this._value[0]),e.shouldResetInput){this.resetComboboxInput(!1);return}this._addValueText=e.addValueText,this._userInfoMessage=e.userInfoMessage}},S=class extends x{constructor(...e){super(...e),this.handleBodyClick=e=>{this._isOptionsOpen&&!this.contains(e.target)&&this.closeAndProcessInput()}}connectedCallback(){if(super.connectedCallback(),document?.body.addEventListener(`click`,this.handleBodyClick),this._options=[],this.defaultOptions&&this.defaultOptions.length){let e=this.options?.filter(e=>e.userAdded)||[];this.options=[...e,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=_.cloneOptions(this.options)}if(this.optionsController?.nodes&&this.optionsController.nodes.length){let e=g.parseOptionsFromSlot(this.optionsController.nodes);e.length&&(this.options=[...e],this._options=[...e],this._optionsFromSlot=!0,this._lastSlotGeneration=this.optionsController.generation)}}disconnectedCallback(){super.disconnectedCallback(),document?.body.removeEventListener(`click`,this.handleBodyClick)}firstUpdated(e){this.defaultValue!==null&&!this.value&&(this.value=this.defaultValue),super.firstUpdated(e)}willUpdate(e){if(this._optionsFromSlot&&this.optionsController){let e=this.optionsController.generation;if(e!==this._lastSlotGeneration){this._lastSlotGeneration=e;let t=g.parseOptionsFromSlot(this.optionsController.nodes),n=this._options.filter(e=>e.userAdded);this.options=[...n,...t]}}if(super.willUpdate(e),e.has(`isOpen`)&&(this._isOptionsOpen=this.isOpen),e.has(`defaultOptions`)&&this.defaultOptions.length){let e=(Array.isArray(this.options)?this.options:[]).filter(e=>e.userAdded)||[];this.options=[...e,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=_.cloneOptions(this.options)}let t=e.has(`value`),n=e.has(`_value`);if(t){let e=[...this._value],t=this.parseValue();t.join(`,`)!==this._value.join(`,`)&&(this._value=t,this._options.forEach(e=>e.selected=t.includes(e.value)),this._options=[...this._options]),this._pendingDispatchFrom??=e}else n&&(this._pendingDispatchFrom??=e.get(`_value`)??[]);if(e.has(`defaultValue`)&&this.defaultValue!=null&&!this._value.length){let e=this.parseToValues(this.defaultValue);e.length&&(this._pendingDispatchFrom??=[...this._value],this._value=e,this._options.forEach(t=>t.selected=e.includes(t.value)),this._options=[...this._options])}if(e.has(`options`)){let t=e.get(`options`)||this._options||[],n=_.mergeWithUserAdded(_.cloneOptions(this.options),t,this._value);this._options=n,n.length>this.options.length&&(this.options=n);let r=_.syncOptionsWithValues(this._options,this._value);this._options=r.options,r.newValues.length>this._value.length&&(this._pendingDispatchFrom??=[...this._value],this._value=r.newValues)}(t||n||e.has(`options`)||e.has(`defaultValue`))&&this.updateMaxReached(),this._pendingDispatchFrom&&this.syncPublicValue()}updated(e){if(this._pendingDispatchFrom){let e=this._pendingDispatchFrom;this._pendingDispatchFrom=null,this.dispatchValueChange(e)}if(e.has(`_search`)&&this.dispatchEvent(new CustomEvent(`search`,{detail:this._search,bubbles:!1})),!this._isOptionsOpen&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!==`hidden`){let e=!this.multiple&&this._value[0]?m(this._value[0],this.options,this.displayValueAs):``;this.inputRef.value.value!==e&&(this.inputRef.value.value=e)}this.classList.add(`pkt-combobox-component`),this.classList.toggle(`pkt-combobox-component--fullwidth`,!!this.fullwidth),super.updated(e)}formResetCallback(){this.touched=!1;let e=this.defaultValue||(this.multiple,``);this.value=e,this._value=this.parseValue(),this._options=this._options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this.options=this.options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this._search=``,this._isOptionsOpen=!1,this._userInfoMessage=``,this._addValueText=null,this._inputFocus=!1,this.updateMaxReached(),this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=``),this.internals.setFormValue(``),this.internals.ariaInvalid=`false`,this.requestUpdate()}attributeChangedCallback(e,t,n){if(e===`options`){this._options=_.cloneOptions(this.options);let e=_.syncOptionsWithValues(this._options,this._value);this._options=e.options,e.newValues.length>this._value.length&&(this._value=e.newValues),this._search=``}super.attributeChangedCallback(e,t,n)}render(){return e._`
|
|
1
|
+
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-D7sTqOr3.cjs");require("./icon-Dnv6LtPC.cjs");const i=require("./if-defined-2mkIDgOm.cjs"),a=require("./ref-Emu5PNxk.cjs");require("./tag-B5dUg7AD.cjs");const o=require("./repeat-Dh9YKoeV.cjs"),s=require("./listbox-g-vHHLkD.cjs"),c=require("./input-element-CSfDGslx.cjs"),l=require("./pkt-options-controller-CpEZcomb.cjs"),u=require("./input-wrapper-J3mEKhvR.cjs");var d=(e,t,n)=>{switch(e){case`,`:return n?`addValue`:null;case`Enter`:return`addValue`;case`Tab`:case`ArrowDown`:return t?null:`focusListbox`;case`Escape`:return`closeOptions`;default:return null}},f=(e,t,n,r,i)=>{if(!e)return{action:`none`,value:null};let a=s.i(n,e);return!t.includes(e)&&!a?r?{action:`addUserValue`,value:e}:i?{action:`none`,value:null}:{action:`removeValue`,value:t[0]}:a&&!t.includes(a.value)?{action:`selectOption`,value:a.value}:{action:`none`,value:null}},p=(e,t,n,r,i)=>e.trim().toLowerCase()?{...s.c(e,t,n,r),shouldRemoveValue:!1,shouldResetInput:!1}:{addValueText:null,userInfoMessage:``,shouldRemoveValue:!i&&!!t[0],shouldResetInput:!0},m=(e,t,n)=>{let r=s.i(t,e);return n===`label`&&r?.label?r.label:e},h={markOptionSelected(e,t){if(t){for(let n of e)if(n.value===t){n.selected=!0;break}}},markOptionDeselected(e,t){if(t){for(let n of e)if(n.value===t){n.selected=!1;break}}},markAllSelected(e){for(let t of e)t.selected=!0},markAllDeselected(e){for(let t of e)t.selected=!1},removeUserAddedOptions(e){return e.filter(e=>!e.userAdded)}},g={parseOptionsFromSlot(e){let t=[];return e.forEach(e=>{if(!e.textContent&&!e.getAttribute(`value`))return;let n={value:e.getAttribute(`value`)||e.textContent||``,label:e.textContent||e.getAttribute(`value`)||``};e.getAttribute(`data-prefix`)&&(n.prefix=e.getAttribute(`data-prefix`)||void 0),e.getAttribute(`tagskincolor`)&&(n.tagSkinColor=e.getAttribute(`tagskincolor`)),e.getAttribute(`description`)&&(n.description=e.getAttribute(`description`)||void 0),n.fulltext=s.r(n),t.push(n)}),t}},_={cloneOptions(e){return Array.isArray(e)?e.map(e=>({...e})):[]},syncOptionsWithValues(e,t){let n=[...t];return e.forEach(e=>{e.value&&!e.label&&(e.label=e.value),e.selected&&!n.includes(e.value)&&n.push(e.value),e.fulltext=s.r(e),e.selected=e.selected||n.includes(e.value)}),{options:e,newValues:n}},mergeWithUserAdded(e,t,n){return[...t.filter(e=>e?.userAdded&&n.includes(e.value)).filter(t=>!(Array.isArray(e)?e:[]).some(e=>e.value===t.value)),...e]}},v={name:`pkt-combobox`,react:`PktCombobox`,"css-class":`pkt-combobox`,isElement:!0,isPureReact:!0,"dark-mode":!0,props:{name:{type:`string`,name:`Navn`,description:`Navn som brukes i skjema ved innsending`,category:`tech`},form:{name:`Skjema`,description:`ID-en til skjemaet feltet hører til, når feltet ligger utenfor skjemaet`,type:`string`,required:!1,category:`tech`},id:{type:`string`,name:`ID`,description:`Unik ID for feltet`,category:`tech`},label:{type:`string`,name:`Etikett/label`,description:`Tekst som vises over feltet`,category:`contents`},placeholder:{name:`Hint`,description:`Spesifiserer en kort hint som beskriver forventet verdi av feltet.`,type:`string`,category:`contents`,required:!1},multiple:{type:`boolean`,name:`Flervalg`,default:!1,description:`Mulighet for å velge flere valg`,category:`functionality`},tagPlacement:{attribute:`tag-placement`,type:[`inside`,`outside`],name:`Plassering av tags i flervalg`,description:`Plassering av valgte verdier i feltet ved flervalg`,category:`functionality`,showIf:{multiple:!0}},maxlength:{type:`number`,name:`Maks antall i flervalg`,description:`Maks antall valg dersom flervalg er aktivert`,category:`functionality`,showIf:{multiple:!0}},typeahead:{type:`boolean`,name:`Typeahead`,default:!1,description:`Mulighet for automatisk utfylling av feltet fra listen over valg`,category:`functionality`},includeSearch:{attribute:`include-search`,type:`boolean`,name:`Inkluder søk`,description:`Mulighet for å søke etter valg inni dropdown`,category:`functionality`},allowUserInput:{attribute:`allow-user-input`,type:`boolean`,name:`Brukervalgte verdier`,description:`Mulighet for å skrive inn egne verdier`,category:`functionality`},searchPlaceholder:{attribute:`search-placeholder`,type:`string`,name:`Søke-plassholder`,description:`Plassholdertekst for søkefeltet i dropdown`,category:`contents`,showIf:{includeSearch:!0}},displayValueAs:{attribute:`display-value-as`,type:[`label`,`value`,`prefixAndValue`],name:`Visning av valgt verdi`,description:`Hvordan valgt verdi vises i feltet`,default:`label`,category:`ui`},inputSize:{name:`Størrelse`,description:`Visuell størrelse via input-wrapper. small: kompakt wrapper og felt (42px). xsmall: samme wrapper som small, felt 36px.`,attribute:`input-size`,type:[`small`,`medium`,`xsmall`],default:`medium`,category:`ui`},value:{name:`Verdi`,type:`string`,description:`Valgt verdi. Streng ved enkelt valg, array av strenger ved flervalg.`,category:`tech`},helptext:{type:`string`,name:`Hjelpetekst`,description:`Hjelpetekst som vises over feltet`,category:`contents`},helptextDropdown:{attribute:`helptextdropdown`,type:`string`,name:`Utvidet hjelpetekst`,description:`Hjelpetekst som vises i en lukket boks man kan åpne`,category:`contents`},helptextDropdownButton:{attribute:`helptextdropdownbutton`,type:`string`,name:`Knappetekst for hjelpetekst`,description:`Tekst som vises på knappen for å åpne/lukke utvidet hjelpetekst`,category:`contents`,default:`Les mer`},disabled:{type:`boolean`,name:`Deaktivert`,description:`Feltet er deaktivert`,category:`tech`},hasError:{attribute:`haserror`,type:`boolean`,name:`Feil`,description:`Feltet har en feil`,category:`ui`},errorMessage:{attribute:`errormessage`,type:`string`,name:`Feilmelding`,description:`Tekst som vises under feltet ved feil`,category:`contents`},required:{type:`boolean`,name:`Påkrevd`,description:`Feltet må fylles ut`,category:`tech`},requiredTag:{attribute:`requiredtag`,type:`boolean`,name:`Påkrevd-merking`,description:`Viser en merking som indikerer at feltet er påkrevd`,category:`ui`},requiredText:{attribute:`requiredtext`,type:`string`,name:`Påkrevd-tekst`,description:`Tekst som vises i påkrevd-merkingen`,category:`contents`},optionalTag:{attribute:`optionaltag`,type:`boolean`,name:`Valgfritt-merking`,description:`Viser en merking som indikerer at feltet er valgfritt`,category:`ui`},optionalText:{attribute:`optionaltext`,type:`string`,name:`Valgfritt-tekst`,description:`Tekst som vises i valgfritt-merkingen`,category:`contents`},tagText:{attribute:`tagtext`,type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},fullwidth:{type:`boolean`,name:`Full bredde`,description:`Skal feltet ta opp hele bredden?`,category:`ui`},defaultOptions:{attribute:`default-options`,name:`Initielle valg (default options)`,description:`Liste over valg som kan velges, om options sendes inn som array med objekter (denne vil ikke modifiseres ved endring innad i komponenten)`,type:`IPktComboboxOption[]`,default:[],previewDefault:[{value:`bfr`,label:`Frogner`},{value:`bgo`,label:`Gamle Oslo`},{value:`bgr`,label:`Grorud`},{value:`bxx`,label:`Andre bydeler`}],items:{type:`object`,properties:{value:{type:`string`,description:`Verdi som sendes ved valg`},label:{type:`string`,description:`Tekst som vises for valget`},prefix:{type:`string`,description:`Tekst som vises før valget`},description:{type:`string`,description:`Beskrivelse av valget`},disabled:{type:`boolean`,description:`Valget er deaktivert`},selected:{type:`boolean`,description:`Valget er valgt`},tagSkinColor:{type:[`blue`,`blue-dark`,`blue-light`,`green`,`red`,`yellow`,`beige`,`gray`,`grey`],description:`Farge på tag`}},required:[`value`]},category:`contents`},options:{name:`Valg`,type:`IPktComboboxOption[]`,description:`Liste over valg som kan velges, om options sendes inn som array med objekter`,default:[],items:{type:`object`,properties:{value:{type:`string`,description:`Verdi som sendes ved valg`},label:{type:`string`,description:`Tekst som vises for valget`},prefix:{type:`string`,description:`Tekst som vises før valget`},description:{type:`string`,description:`Beskrivelse av valget`},disabled:{type:`boolean`,description:`Valget er deaktivert`},selected:{type:`boolean`,description:`Valget er valgt`},tagSkinColor:{type:[`blue`,`blue-dark`,`blue-light`,`green`,`red`,`yellow`,`beige`,`gray`,`grey`],description:`Farge på tag`}},required:[`value`]},category:`contents`},inline:{name:`Inline`,type:`boolean`,required:!1,default:!1,description:`Angir om feltet skal flyte med teksten`,category:`ui`},useWrapper:{attribute:`usewrapper`,name:`Bruk wrapper`,type:`boolean`,required:!1,displayAsFalse:!0,default:!0,description:`Indikerer om skjemaelementet skal bruke en wrapper`,category:`ui`},hasFieldset:{attribute:`hasfieldset`,name:`Bruk fieldset`,type:`boolean`,required:!1,default:null,description:`Bruk fieldset og legend i stedet for label. Utledes automatisk når feltet ikke har en input.`,category:`ui`},counter:{name:`Teller`,type:`boolean`,required:!1,default:null,description:`Viser teller under feltet. Slås på av seg selv når det finnes en grense å telle mot; sett til false for å skru den av.`,category:`ui`},defaultValue:{attribute:`defaultvalue`,type:`string | string[]`,name:`Standardverdi`,description:`Verdien feltet får ved oppstart og ved nullstilling av skjemaet`,category:`functionality`}},events:{change:{type:`Event`,description:`Returnerer valgt verdi som streng. Ved flervalg returneres kommaseparerte verdier.`},"value-change":{type:`CustomEvent`,description:`Returnerer valgt verdi. Ved enkeltvalg en streng, ved flervalg en <code>string[]</code>.`},search:{type:`CustomEvent`,description:`Returnerer søketeksten som streng i <code>event.detail</code> når brukeren skriver i søkefeltet`},toggleHelpText:{type:`CustomEvent`,description:`Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes`}}},y=class extends c.t{constructor(){super(),this.value=``,this.options=[],this.defaultOptions=[],this.allowUserInput=!1,this.typeahead=!1,this.includeSearch=!1,this.searchPlaceholder=null,this.multiple=!1,this.maxlength=null,this.displayValueAs=v.props.displayValueAs.default,this.tagPlacement=null,this.isOpen=!1,this._options=[],this._value=[],this._isOptionsOpen=!1,this._userInfoMessage=``,this._messageValue=null,this._addValueText=null,this._maxIsReached=!1,this._search=``,this._inputFocus=!1,this._skipInputTab=!1,this._optionsFromSlot=!1,this._lastSlotGeneration=0,this._suppressNextOpen=!1,this.inputRef=a.t(),this.triggerRef=a.t(),this.listboxRef=a.t(),this._pendingDispatchFrom=null,this.optionsController=new l.t(this)}get _hasTextInput(){return this.typeahead||this.allowUserInput}get _selectionDescription(){if(!(!this.multiple||this._value.length===0))return`${this._value.length} valgt`}focusTrigger(){this._hasTextInput?this.inputRef.value?.focus():this.triggerRef.value?.focus()}focusAfterCommit(){this._skipInputTab=!0;let e=this.inputRef.value;e&&e.type!==`hidden`&&e.setAttribute(`tabindex`,`-1`),this.triggerRef.value?.focus()}restoreInputTab(){this._skipInputTab=!1}parseValue(){return this.parseToValues(this.value)}parseToValues(e){return Array.isArray(e)?this.multiple?e:e.length>0?[e[0]]:[]:e&&this.multiple?e.split(`,`):e?[e]:[]}updateMaxReached(){this._maxIsReached=s.l(this._value.length,this.maxlength)}syncPublicValue(){let e=this.multiple?this._value.join(`,`):this._value[0]||``;e!==(Array.isArray(this.value)?this.value.join(`,`):String(this.value||``))&&(this.value=e)}dispatchValueChange(e){let t=this._value;if(e?.join(`,`)!==t.join(`,`)){let e=this.multiple?[...t]:t[0]||``;this.onChange(e)}else t.length===0&&e&&e.length>0&&this.clearInputValue()}onChange(e){this.touched=!0,super.onChange(e)}valueChanged(){}};e.n([e.u({type:String,reflect:!0})],y.prototype,`value`,void 0),e.n([e.u({type:Array})],y.prototype,`options`,void 0),e.n([e.u({type:Array,attribute:`default-options`})],y.prototype,`defaultOptions`,void 0),e.n([e.u({type:Boolean,attribute:`allow-user-input`})],y.prototype,`allowUserInput`,void 0),e.n([e.u({type:Boolean})],y.prototype,`typeahead`,void 0),e.n([e.u({type:Boolean,attribute:`include-search`})],y.prototype,`includeSearch`,void 0),e.n([e.u({type:String,attribute:`search-placeholder`})],y.prototype,`searchPlaceholder`,void 0),e.n([e.u({type:Boolean})],y.prototype,`multiple`,void 0),e.n([e.u({type:Number})],y.prototype,`maxlength`,void 0),e.n([e.u({type:String,attribute:`display-value-as`})],y.prototype,`displayValueAs`,void 0),e.n([e.u({type:String,attribute:`tag-placement`})],y.prototype,`tagPlacement`,void 0),e.n([e.u({type:Boolean,attribute:`open`})],y.prototype,`isOpen`,void 0),e.n([e.l()],y.prototype,`_options`,void 0),e.n([e.l()],y.prototype,`_value`,void 0),e.n([e.l()],y.prototype,`_isOptionsOpen`,void 0),e.n([e.l()],y.prototype,`_userInfoMessage`,void 0),e.n([e.l()],y.prototype,`_messageValue`,void 0),e.n([e.l()],y.prototype,`_addValueText`,void 0),e.n([e.l()],y.prototype,`_maxIsReached`,void 0),e.n([e.l()],y.prototype,`_search`,void 0),e.n([e.l()],y.prototype,`_inputFocus`,void 0),e.n([e.l()],y.prototype,`_skipInputTab`,void 0);var b=class extends y{toggleValue(e){if(this.isDisabled)return;this.touched=!0,this._userInfoMessage=``,this._addValueText=null;let t=s.i(this.options,e)?.value||null,n=this._value.includes(e||t||``),r=!!t,i=this._options.find(t=>t.value===e)?.disabled||!1,a=!e?.trim(),o=!this.multiple,c=this.multiple,l=s.l(this._value.length,this.maxlength),u=!1,d=!0,f=``,p=null,h=``;i||(!r&&this.allowUserInput&&!a?(this.addNewUserValue(e),f=`valueAdded`,u=c):!r&&!this.allowUserInput?(o&&this._value[0]&&this.removeValue(this._value[0]),d=!1,u=!0,f=`noResults`):n?(this.removeValue(t),u=!0,o&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=``)):a&&o?(this.removeAllSelected(),u=!0):o?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t),u=!1,f=`valueSelected`,p=this._hasTextInput?m(t||``,this.options,this.displayValueAs):s.s(s.i(this.options,t),this.displayValueAs)):c&&!l?(this.setSelected(t),u=!0):c&&l?(f=`maxSelected`,d=!1,h=e):(o&&this.removeAllSelected(),f=`noValidValue`,d=!1,u=!0,h=e),this._isOptionsOpen=u,u||window.setTimeout(()=>{this.focusAfterCommit()},0),this._search=h||``,this.resetComboboxInput(d),this._userInfoMessage=f,this._messageValue=p,c&&this.updateMaxReached())}setSelected(e){if(!this._value.includes(e)){if(this.multiple&&s.l(this._value.length,this.maxlength)){this._userInfoMessage=`maxSelected`;return}!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,h.markOptionSelected(this._options,e),this.resetComboboxInput(!0)}}removeSelected(e){if(!e)return;this._value=this._value.filter(t=>t!==e);let t=s.i(this.options,e);t&&(h.markOptionDeselected(this.options,e),t.userAdded?(this._options=[...this._options.filter(t=>t.value!==e)],this.options=[...this.options.filter(t=>t.value!==e)]):this._options.some(t=>t.value===e)?this.refreshOptionsFromValue():this._options=[...this._options,t])}addAllOptions(){if(this.multiple){if(this.maxlength&&this._options.length>this.maxlength){this._userInfoMessage=`tooManySelected`;return}this._value=this._options.map(e=>e.value),h.markAllSelected(this._options),this.requestUpdate()}}removeAllSelected(){this._value=[],h.markAllDeselected(this._options),this._options=h.removeUserAddedOptions(this._options),this.requestUpdate()}addValue(){let e=this.inputRef.value?.value.trim()||``;if(this._search=e,e&&this._value.includes(e)){this.resetComboboxInput(!0),this._userInfoMessage=`alreadySelected`;return}this.toggleValue(e)}removeValue(e){this._value=this.multiple?this._value.filter(t=>t!==e):[],this.removeSelected(e)}addNewUserValue(e){if(!e||e.trim()===``)return;if(!this.multiple)this._value[0]&&this.removeSelected(this._value[0]),this._value=[e];else if(!s.i(this.options,e)){if(s.l(this._value.length,this.maxlength))return;this._value=[...this._value,e]}let t={value:e,label:e,userAdded:!0,selected:!0};this.options=[t,...this.options],this._options=[t,...this._options],this.resetComboboxInput(!0),this.multiple||(this._isOptionsOpen=!1,window.setTimeout(()=>{this.focusAfterCommit()},0)),this.requestUpdate()}refreshOptionsFromValue(){let e=_.cloneOptions(this.options);e.forEach(e=>e.selected=this._value.includes(e.value)),this._options=_.syncOptionsWithValues(e,this._value).options}resetComboboxInput(e=!0){this._addValueText=null,this.inputRef.value&&this.inputRef.value.type!==`hidden`&&e&&(this._search=``,this.multiple?this.inputRef.value.value=``:(this.inputRef.value.value=this._value[0]?m(this._value[0],this.options,this.displayValueAs):``,this._userInfoMessage=``)),this.refreshOptionsFromValue()}removeLastValue(e){if(this._value.length===0)return;e.preventDefault();let t=this._value[this._value.length-1];t&&this.removeSelected(t),this.updateMaxReached()}},x=class extends b{handleInput(e){if(e.stopPropagation(),e.stopImmediatePropagation(),this.isDisabled)return;this.touched=!0;let t=e.target;if(this._search=t.value,this.checkForMatches(),this.typeahead){if(this._search){let{filtered:n,suggestion:r}=s.o(this.options,this._search);this._options=n,e.inputType!==`deleteContentBackward`&&r?.label&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(t.value=r.label,window.setTimeout(()=>t.setSelectionRange(this._search.length,t.value.length),0),t.selectionDirection=`backward`)}else this.refreshOptionsFromValue()}}handleFocus(){if(!this.isDisabled){if(this._skipInputTab=!1,this._suppressNextOpen){this._suppressNextOpen=!1,this._inputFocus=!0,this.requestUpdate();return}!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=m(this._value[0],this.options,this.displayValueAs)),this._inputFocus=!0,this._search=``,this.refreshOptionsFromValue(),this._isOptionsOpen=!0,this.onFocus(),this.requestUpdate()}}handleCloseOptions(){this._isOptionsOpen=!1,this._hasTextInput&&(this._suppressNextOpen=!0),this.focusTrigger()}handleFocusOut(e){if(this.isDisabled||!this._isOptionsOpen)return;let t=e.relatedTarget;t?.closest(`pkt-combobox`)?.id===this.id||e.target?.classList?.contains(`pkt-combobox__value`)||t===this.inputRef.value||t===this.triggerRef.value||this.closeAndProcessInput()}closeAndProcessInput(){if(this._inputFocus=!1,this._addValueText=null,this._userInfoMessage=``,this._search=``,this.inputRef.value&&this.inputRef.value.type!==`hidden`){let e=this.inputRef.value.value;if(!this.multiple){if(!e)this._value[0]&&this.removeSelected(this._value[0]);else{let t=s.i(this.options,e);t&&t.value!==this._value[0]?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t.value)):!t&&this.allowUserInput&&(this._value[0]&&this.removeSelected(this._value[0]),this.addNewUserValue(e))}}else if(e!==``){let{action:t,value:n}=f(e,this._value,this.options,this.allowUserInput,this.multiple);switch(t){case`addUserValue`:this.addNewUserValue(n);break;case`selectOption`:this.setSelected(n);break;case`removeValue`:this.removeValue(n)}}!this.multiple&&this._value[0]?this.inputRef.value.value=m(this._value[0],this.options,this.displayValueAs):this.inputRef.value.value=``}this._isOptionsOpen=!1,this.onBlur()}handleBlur(){this._inputFocus=!1,this.onBlur()}handleInputClick(e){if(this.isDisabled){e.preventDefault(),e.stopImmediatePropagation();return}this._hasTextInput?(this.inputRef.value?.focus(),this.requestUpdate()):(e.stopImmediatePropagation(),e.preventDefault(),this._isOptionsOpen=!this._isOptionsOpen,this._isOptionsOpen&&this.listboxRef.value?.focusFirstOrSelectedOption())}handlePlaceholderClick(e){this.isDisabled||(e.stopPropagation(),this._hasTextInput&&this.inputRef.value?(this.inputRef.value.focus(),this._inputFocus=!0,this.requestUpdate()):(this._isOptionsOpen=!this._isOptionsOpen,this.requestUpdate()))}handleSelectOnlyKeydown(e){if(!this.isDisabled)switch(e.key){case`Enter`:case` `:case`ArrowDown`:case`ArrowUp`:e.preventDefault(),this._isOptionsOpen?this._isOptionsOpen=!1:(this._isOptionsOpen=!0,this.listboxRef.value?.focusFirstOrSelectedOption());break;case`Escape`:this._isOptionsOpen&&=(e.preventDefault(),!1);break;case`Home`:case`End`:e.preventDefault(),this._isOptionsOpen||=!0,this.listboxRef.value?.focusFirstOrSelectedOption();break;case`ArrowLeft`:this.multiple&&this._value.length>0&&(e.preventDefault(),this.focusTag(this._value.length-1));break;case`Backspace`:case`Delete`:this.multiple&&this._value.length>0&&(e.preventDefault(),this.removeSelected(this._value[this._value.length-1]))}}handleOptionToggled(e){this.toggleValue(e.detail)}handleSearch(e){e.stopPropagation(),this._search=e.detail.toLowerCase(),this.checkForMatches()}handleInputKeydown(e){if(e.key===`Backspace`){let t=!this.inputRef.value?.value;!this._search&&t&&this.multiple&&this._value.length>0&&this.removeLastValue(e);return}if(e.key===`ArrowLeft`&&this.multiple&&this._value.length>0){let t=this.inputRef.value;if(t&&t.selectionStart===0&&!t.value){e.preventDefault(),this.focusTag(this._value.length-1);return}}let t=d(e.key,e.shiftKey,this.multiple);if(t&&!(e.key===`Tab`&&!this._isOptionsOpen)){if(t===`focusListbox`&&e.key===`Tab`&&!this.listboxRef.value?.querySelector(`[role="option"]:not([data-disabled]), [data-type="new-option"]`)){this.closeAndProcessInput();return}switch(e.preventDefault(),t){case`addValue`:this.addValue();break;case`focusListbox`:this.listboxRef.value?.focusFirstOrSelectedOption();break;case`closeOptions`:this._isOptionsOpen=!1}}}handleTagRemove(e){this.removeSelected(e),this._hasTextInput&&this.inputRef.value&&(this._inputFocus=!0,this.inputRef.value.focus(),this.requestUpdate())}getInsideTags(){return Array.from(this.querySelectorAll(`.pkt-combobox__input .pkt-combobox__tag-list pkt-tag`))}focusTag(e){let t=this.getInsideTags();t.forEach((t,n)=>{t.buttonTabindex=n===e?0:-1}),(t[e]?.querySelector(`button`))?.focus()}resetTagTabindices(){this.getInsideTags().forEach(e=>{e.buttonTabindex=-1})}handleTagKeydown(e,t){e.stopPropagation();let n=()=>{this.resetTagTabindices(),this._hasTextInput&&this.inputRef.value?this.inputRef.value.focus():this.triggerRef.value?.focus()};switch(e.key){case`ArrowLeft`:e.preventDefault(),t>0&&this.focusTag(t-1);break;case`ArrowRight`:e.preventDefault(),t<this._value.length-1?this.focusTag(t+1):n();break;case`Backspace`:case`Delete`:e.preventDefault();{let e=this._value[t],r=t>=this._value.length-1?t-1:t;this.removeSelected(e),r>=0?(this.requestUpdate(),this.updateComplete.then(()=>this.focusTag(r))):n()}break;case`Tab`:this.resetTagTabindices();break;case`Escape`:e.preventDefault(),n()}}checkForMatches(){let e=p(this.inputRef.value?.value||this._search||``,this._value,this.options,this.allowUserInput,this.multiple);if(e.shouldRemoveValue&&this.removeValue(this._value[0]),e.shouldResetInput){this.resetComboboxInput(!1);return}this._addValueText=e.addValueText,this._userInfoMessage=e.userInfoMessage}},S=class extends x{constructor(...e){super(...e),this.handleBodyClick=e=>{this._isOptionsOpen&&!this.contains(e.target)&&this.closeAndProcessInput()}}connectedCallback(){if(super.connectedCallback(),document?.body.addEventListener(`click`,this.handleBodyClick),this._options=[],this.defaultOptions&&this.defaultOptions.length){let e=this.options?.filter(e=>e.userAdded)||[];this.options=[...e,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=_.cloneOptions(this.options)}if(this.optionsController?.nodes&&this.optionsController.nodes.length){let e=g.parseOptionsFromSlot(this.optionsController.nodes);e.length&&(this.options=[...e],this._options=[...e],this._optionsFromSlot=!0,this._lastSlotGeneration=this.optionsController.generation)}}disconnectedCallback(){super.disconnectedCallback(),document?.body.removeEventListener(`click`,this.handleBodyClick)}firstUpdated(e){this.defaultValue!==null&&!this.value&&(this.value=this.defaultValue),super.firstUpdated(e)}willUpdate(e){if(this._optionsFromSlot&&this.optionsController){let e=this.optionsController.generation;if(e!==this._lastSlotGeneration){this._lastSlotGeneration=e;let t=g.parseOptionsFromSlot(this.optionsController.nodes),n=this._options.filter(e=>e.userAdded);this.options=[...n,...t]}}if(super.willUpdate(e),e.has(`isOpen`)&&(this._isOptionsOpen=this.isOpen),e.has(`defaultOptions`)&&this.defaultOptions.length){let e=(Array.isArray(this.options)?this.options:[]).filter(e=>e.userAdded)||[];this.options=[...e,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=_.cloneOptions(this.options)}let t=e.has(`value`),n=e.has(`_value`);if(t){let e=[...this._value],t=this.parseValue();t.join(`,`)!==this._value.join(`,`)&&(this._value=t,this._options.forEach(e=>e.selected=t.includes(e.value)),this._options=[...this._options]),this._pendingDispatchFrom??=e}else n&&(this._pendingDispatchFrom??=e.get(`_value`)??[]);if(e.has(`defaultValue`)&&this.defaultValue!=null&&!this._value.length){let e=this.parseToValues(this.defaultValue);e.length&&(this._pendingDispatchFrom??=[...this._value],this._value=e,this._options.forEach(t=>t.selected=e.includes(t.value)),this._options=[...this._options])}if(e.has(`options`)){let t=e.get(`options`)||this._options||[],n=_.mergeWithUserAdded(_.cloneOptions(this.options),t,this._value);this._options=n,n.length>this.options.length&&(this.options=n);let r=_.syncOptionsWithValues(this._options,this._value);this._options=r.options,r.newValues.length>this._value.length&&(this._pendingDispatchFrom??=[...this._value],this._value=r.newValues)}(t||n||e.has(`options`)||e.has(`defaultValue`))&&this.updateMaxReached(),this._pendingDispatchFrom&&this.syncPublicValue()}updated(e){if(this._pendingDispatchFrom){let e=this._pendingDispatchFrom;this._pendingDispatchFrom=null,this.dispatchValueChange(e)}if(e.has(`_search`)&&this.dispatchEvent(new CustomEvent(`search`,{detail:this._search,bubbles:!1})),!this._isOptionsOpen&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!==`hidden`){let e=!this.multiple&&this._value[0]?m(this._value[0],this.options,this.displayValueAs):``;this.inputRef.value.value!==e&&(this.inputRef.value.value=e)}this.classList.add(`pkt-combobox-component`),this.classList.toggle(`pkt-combobox-component--fullwidth`,!!this.fullwidth),super.updated(e)}formResetCallback(){this.touched=!1;let e=this.defaultValue||(this.multiple,``);this.value=e,this._value=this.parseValue(),this._options=this._options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this.options=this.options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this._search=``,this._isOptionsOpen=!1,this._userInfoMessage=``,this._addValueText=null,this._inputFocus=!1,this.updateMaxReached(),this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=``),this.internals.setFormValue(``),this.internals.ariaInvalid=`false`,this.requestUpdate()}attributeChangedCallback(e,t,n){if(e===`options`){this._options=_.cloneOptions(this.options);let e=_.syncOptionsWithValues(this._options,this._value);this._options=e.options,e.newValues.length>this._value.length&&(this._value=e.newValues),this._search=``}super.attributeChangedCallback(e,t,n)}render(){return e._`
|
|
2
2
|
<pkt-input-wrapper
|
|
3
3
|
${r.n(this,[`helptext`])}
|
|
4
4
|
.strings=${this.strings}
|
|
@@ -2,7 +2,7 @@ import { PktInputElement } from '../../base-elements/input-element';
|
|
|
2
2
|
import { Ref } from 'lit/directives/ref.js';
|
|
3
3
|
import { PropertyValues } from 'lit';
|
|
4
4
|
import { ElementProps } from '../../types/typeUtils';
|
|
5
|
-
import { TCheckboxLabelPosition } from '../../shared-types';
|
|
5
|
+
import { TCheckboxLabelPosition, TPktInputSize } from '../../shared-types';
|
|
6
6
|
type Props = ElementProps<PktCheckbox, 'checkHelptext' | 'defaultChecked' | 'hasTile' | 'isSwitch' | 'labelPosition' | 'hideLabel' | 'tagText' | 'optionalTag' | 'optionalText' | 'requiredTag' | 'requiredText'>;
|
|
7
7
|
export declare class PktCheckbox extends PktInputElement<Props> {
|
|
8
8
|
inputRef: Ref<HTMLInputElement>;
|
|
@@ -16,6 +16,7 @@ export declare class PktCheckbox extends PktInputElement<Props> {
|
|
|
16
16
|
checked: boolean | string | null;
|
|
17
17
|
indeterminate: boolean | 'true' | 'false' | '';
|
|
18
18
|
type: string;
|
|
19
|
+
inputSize: TPktInputSize | undefined;
|
|
19
20
|
tagText: string | null;
|
|
20
21
|
optionalTag: boolean;
|
|
21
22
|
/** @deprecated Bruk `strings={{ forms: { optional: '…' } }}` eller `setPktStrings()`. */
|
|
@@ -2,11 +2,11 @@ import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
|
2
2
|
import { IPktStringsProps } from '../../shared-strings';
|
|
3
3
|
import { PropertyValues } from 'lit';
|
|
4
4
|
import { ElementProps } from '../../types/typeUtils';
|
|
5
|
-
import { Booleanish } from '../../shared-types';
|
|
5
|
+
import { Booleanish, TLayout } from '../../shared-types';
|
|
6
6
|
import { FocusModalityController } from '../../controllers/focus-modality-controller';
|
|
7
7
|
type TCounterPosition = 'top' | 'bottom';
|
|
8
8
|
type TInputWrapperSize = 'small' | 'medium' | 'xsmall';
|
|
9
|
-
type Props = ElementProps<PktInputWrapper, 'forId' | 'label' | 'helptext' | 'helptextDropdown' | 'helptextDropdownButton' | 'counter' | 'counterCurrent' | 'counterMaxLength' | 'optionalTag' | 'optionalText' | 'requiredTag' | 'requiredText' | 'tagText' | 'hasError' | 'errorMessage' | 'disabled' | 'inline' | 'ariaDescribedby' | 'hasFieldset' | 'useWrapper' | 'role'> & IPktStringsProps<'forms' | 'validation'>;
|
|
9
|
+
type Props = ElementProps<PktInputWrapper, 'forId' | 'label' | 'helptext' | 'helptextDropdown' | 'helptextDropdownButton' | 'counter' | 'counterCurrent' | 'counterMaxLength' | 'optionalTag' | 'optionalText' | 'requiredTag' | 'requiredText' | 'tagText' | 'hasError' | 'errorMessage' | 'disabled' | 'inline' | 'ariaDescribedby' | 'hasFieldset' | 'layout' | 'useWrapper' | 'role'> & IPktStringsProps<'forms' | 'validation'>;
|
|
10
10
|
export declare class PktInputWrapper extends PktElementWithSlot<Props> {
|
|
11
11
|
/**
|
|
12
12
|
* Element attributes
|
|
@@ -34,12 +34,14 @@ export declare class PktInputWrapper extends PktElementWithSlot<Props> {
|
|
|
34
34
|
inline: boolean;
|
|
35
35
|
ariaDescribedby: string | undefined;
|
|
36
36
|
hasFieldset: boolean;
|
|
37
|
+
layout: TLayout;
|
|
37
38
|
role: string | null;
|
|
38
39
|
useWrapper: Booleanish;
|
|
39
40
|
size: TInputWrapperSize;
|
|
40
41
|
protected updated(changedProperties: PropertyValues): void;
|
|
41
42
|
focusModality: FocusModalityController;
|
|
42
43
|
render(): import('lit-html').TemplateResult<1>;
|
|
44
|
+
private optionsClass;
|
|
43
45
|
private toggleDropdown;
|
|
44
46
|
private handleLabelClick;
|
|
45
47
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { PktInputElement } from '../../base-elements/input-element';
|
|
2
2
|
import { Ref } from 'lit/directives/ref.js';
|
|
3
3
|
import { ElementProps } from '../../types/typeUtils';
|
|
4
|
+
import { TPktInputSize } from '../../shared-types';
|
|
4
5
|
type Props = ElementProps<PktRadioButton, 'checkHelptext' | 'defaultChecked' | 'hasTile' | 'tagText' | 'optionalTag' | 'optionalText' | 'requiredTag' | 'requiredText'>;
|
|
5
6
|
export declare class PktRadioButton extends PktInputElement<Props> {
|
|
6
7
|
inputRef: Ref<HTMLInputElement>;
|
|
@@ -10,6 +11,7 @@ export declare class PktRadioButton extends PktInputElement<Props> {
|
|
|
10
11
|
hasTile: boolean;
|
|
11
12
|
checked: boolean | string | null;
|
|
12
13
|
type: string;
|
|
14
|
+
inputSize: TPktInputSize | undefined;
|
|
13
15
|
tagText: string | null;
|
|
14
16
|
optionalTag: boolean;
|
|
15
17
|
/** @deprecated Bruk `strings={{ forms: { optional: '…' } }}` eller `setPktStrings()`. */
|
|
@@ -10,7 +10,7 @@ import "./tag-Bns7Xj1O.js";
|
|
|
10
10
|
import { t as C } from "./repeat-CdxGS-_3.js";
|
|
11
11
|
import { n as w, t as T } from "./utils-BwF4QSrq.js";
|
|
12
12
|
import { t as E } from "./input-element-lLzfwdim.js";
|
|
13
|
-
import "./input-wrapper-
|
|
13
|
+
import "./input-wrapper-BoTugCvh.js";
|
|
14
14
|
//#region src/components/datepicker/date-tags.ts
|
|
15
15
|
var D = class extends o {
|
|
16
16
|
constructor(...e) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./element-with-slot-D7sTqOr3.cjs");require("./icon-Dnv6LtPC.cjs"),require("./calendar-TcxvS-1_.cjs");const r=require("./if-defined-2mkIDgOm.cjs"),i=require("./ref-Emu5PNxk.cjs"),a=require("./converters-BJ9Fe0kW.cjs");require("./tag-B5dUg7AD.cjs");const o=require("./repeat-Dh9YKoeV.cjs"),s=require("./utils-63cRpWut.cjs"),c=require("./input-element-CSfDGslx.cjs");require("./input-wrapper-
|
|
1
|
+
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./element-with-slot-D7sTqOr3.cjs");require("./icon-Dnv6LtPC.cjs"),require("./calendar-TcxvS-1_.cjs");const r=require("./if-defined-2mkIDgOm.cjs"),i=require("./ref-Emu5PNxk.cjs"),a=require("./converters-BJ9Fe0kW.cjs");require("./tag-B5dUg7AD.cjs");const o=require("./repeat-Dh9YKoeV.cjs"),s=require("./utils-63cRpWut.cjs"),c=require("./input-element-CSfDGslx.cjs");require("./input-wrapper-J3mEKhvR.cjs");var l=class extends e.t{constructor(...e){super(...e),this.dates=[],this.dateformat=`dd.MM.yyyy`,this.className=`pkt-datepicker__tags`,this.idBase=s.n()}render(){return this.classes={"pkt-date-tags":!0,[this.className]:!0},e._`
|
|
2
2
|
<div class=${t.t(this.classes)} aria-live="polite">
|
|
3
3
|
${Array.isArray(this.dates)&&this.dates[0]?o.t(a.h((this.dates??[]).filter(Boolean)),e=>e,t=>e._` <pkt-tag
|
|
4
4
|
id=${this.idBase+t+`-tag`}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { TemplateResult } from 'lit';
|
|
2
|
+
import { PktElement } from '../../base-elements/element';
|
|
3
|
+
export declare class RadioCheckboxSizes extends PktElement {
|
|
4
|
+
render(): TemplateResult<1>;
|
|
5
|
+
}
|
|
6
|
+
declare global {
|
|
7
|
+
interface HTMLElementTagNameMap {
|
|
8
|
+
'docs-radio-checkbox-sizes': RadioCheckboxSizes;
|
|
9
|
+
}
|
|
10
|
+
}
|
|
@@ -6,7 +6,7 @@ import "./icon-JigbxxF7.js";
|
|
|
6
6
|
import { t as u } from "./if-defined-Bebu3LXY.js";
|
|
7
7
|
import { t as d } from "./converters-CkjLSYpa.js";
|
|
8
8
|
import { n as f } from "./utils-BwF4QSrq.js";
|
|
9
|
-
import "./input-wrapper-
|
|
9
|
+
import "./input-wrapper-BoTugCvh.js";
|
|
10
10
|
import { r as p } from "./focus-trap-DG3pEuyJ.js";
|
|
11
11
|
import "./modal-CELmA0-8.js";
|
|
12
12
|
import "./progressbar-DH5lIBpx.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./format-B8meU8Tm.cjs");require("./alert-IaZzEgyI.cjs"),require("./icon-Dnv6LtPC.cjs");const r=require("./if-defined-2mkIDgOm.cjs"),i=require("./converters-BJ9Fe0kW.cjs"),a=require("./utils-63cRpWut.cjs");require("./input-wrapper-BBG8EXQ8.cjs");const o=require("./focus-trap-DSv4Ifqm.cjs");require("./modal-BymjMIJi.cjs"),require("./progressbar-CIXNSwTy.cjs");function s(e){if(e==null||e===``)return;if(typeof e==`number`)return Number.isFinite(e)&&e>0?e:void 0;let t=String(e).trim(),n=Number(t);if(!Number.isNaN(n)&&n>0)return n;let r=t.match(/^(\d+(?:\.\d+)?)\s*(B|KB|MB|GB)$/i);if(!r){console.warn(`PktFileUpload: Invalid maxFileSize format "${t}". Use format like "5MB", "500KB", "1GB", or bytes.`);return}let i=parseFloat(r[1]);switch(r[2].toUpperCase()){case`B`:return i;case`KB`:return i*1024;case`MB`:return i*1024*1024;case`GB`:return i*1024*1024*1024;default:return}}function c(e){return e<1024?`${Math.round(e)} B`:e<1048576?`${Math.round(e/1024)} KB`:e<1073741824?`${Math.round(e/1048576)} MB`:`${Math.round(e/1073741824)} GB`}function l(e){return Array.isArray(e)?e.map(e=>String(e).trim().toLowerCase()).filter(Boolean):[]}function u(e){return e?e.split(`,`).map(e=>e.trim().toLowerCase()).filter(Boolean):[]}function d(e,t,n){let r=e.toLowerCase().replace(/^\./,``);if(r.includes(`/`)){if(r.endsWith(`/*`)){let e=r.replace(`/*`,``);return n.startsWith(`${e}/`)}return n===r}return t===r}function f(e,t){let n=l(t);if(n.length===0)return!0;let r=e.name.split(`.`).pop()?.toLowerCase()??``,i=e.type.toLowerCase();return n.some(e=>d(e,r,i))}function p(e,t){let n=(e??``).trim();if(n)return n;let r=l(t);return r.length===0?``:r.map(e=>e.includes(`/`)||e.startsWith(`.`)?e:`.${e}`).join(`, `)}function m(e){return e.includes(`/`)?e:e.replace(/^\./,``).toUpperCase()}function h(e,t){let n=l(e);if(n.length>0)return n.map(m).join(`, `);let r=u(t);return r.length>0?r.map(m).join(`, `):``}function g(e,t,n){return((e??``).trim()||t).replace(/\{(\w+)\}/g,(e,t)=>n[t]??`{${t}}`)}function _(t,n){let r=l(n.allowedFormats);if(r.length>0&&!f(t,r)){let t=r.join(`, `),i=e.s.fileupload.invalidFormat;return g(n.formatErrorMessage,i,{formats:t})}let i=s(n.maxFileSize);if(i!==void 0&&t.size>i){let t=c(i),r=e.s.fileupload.sizeTooLarge;return g(n.sizeErrorMessage,r,{maxSize:t})}if(n.onFileValidation){let e=n.onFileValidation(t);if(e)return e}return null}function v(e){let t=e.file;if(t?.type?.startsWith(`image/`))return!0;let n=e.attributes?.targetFilename||t?.name||``;return/\.(jpe?g|png|gif|webp|heic|heif|bmp|svg)$/i.test(n)}function y(e){return typeof e==`number`?`in-progress`:e===`error`?`error`:`idle`}function b(e,t,n){let r={"in-progress":0,error:1,idle:2};return e.map(e=>{let r=t?.find(t=>t.fileId===e.fileId);return{...e,progress:r?.progress??(n===`form`?`done`:`queued`),errorMessage:r?.errorMessage,showProgress:r?.showProgress,lastProgress:r?.lastProgress}}).sort((e,t)=>r[y(e.progress)]-r[y(t.progress)])}function x(e,t){return!t||t<=0||e.length<=t+3?null:{head:e.slice(0,e.length-t),tail:e.slice(-t)}}function S(e,t,n){return n<=0?0:t===`prev`?e<=0?n-1:e-1:e>=n-1?0:e+1}function C(e,t){let n=e.length;if(n===0||!t||t.length===0)return{totalCount:n,uploadedCount:0,failedCount:0};let r=0,i=0;for(let n of e){let e=t.find(e=>e.fileId===n.fileId);e?.progress===`done`?r++:e?.progress===`error`&&i++}return{totalCount:n,uploadedCount:r,failedCount:i}}function w(t,n=e.s.fileupload.unknownFilename){return t.attributes?.targetFilename||t.file?.name||n}var T=class extends e.t{constructor(...e){super(...e),this.id=`pkt-fileupload-${a.n()}`,this.name=`files`,this.label=``,this.helptext=``,this.helptextDropdown=``,this.required=!1,this.multiple=!1,this.disabled=!1,this.fullwidth=!1,this.uploadStrategy=`form`,this.itemRenderer=`filename`,this.accept=``,this.allowedFormats=[],this.formatErrorMessage=``,this.sizeErrorMessage=``,this.transfers=[],this.addCommentsEnabled=!1,this.renameFilesEnabled=!1,this.extraOperations=[],this.enableImagePreview=!1,this.hasError=!1,this.errorMessage=``,this.optionalTag=!1,this.requiredTag=!1,this.tagText=null,this.truncateTail=4,this.files=[],this.isDragActive=!1,this.validationErrorMessage=null,this.addedAnnouncement=``,this.thumbnailUrls={},this.hasInitializedValue=!1,this.hasWarnedInvalidValueCombo=!1,this.thumbnailFileById=new Map,this.connectedForm=null,this.addedAnnouncementTimer=null,this.onNativeFileChange=e=>{let t=e.target;this.addFiles(t.files?Array.from(t.files):[]),this.uploadStrategy===`custom`&&(t.value=``)},this.openFileDialog=e=>{e.preventDefault(),e.stopPropagation(),!this.disabled&&this.querySelector(`#${this.id}-input`)?.click()},this.onDropZoneClick=e=>{this.disabled||e.target.closest(`.pkt-fileupload__drop-zone__placeholder__title__open-file-dialog`)||this.querySelector(`#${this.id}-input`)?.click()},this.onDragOver=e=>{e.preventDefault(),!this.disabled&&(this.isDragActive=!0)},this.onDragLeave=()=>{this.isDragActive=!1},this.onDrop=e=>{if(e.preventDefault(),this.isDragActive=!1,this.disabled)return;let t=e.dataTransfer?.files?Array.from(e.dataTransfer.files):[];this.addFiles(t)},this.onHostFormSubmit=e=>{!this.required||this.uploadStrategy!==`custom`||this.getCurrentFiles().length>0||(this.validationErrorMessage=this.requiredSelectionMessage,e.preventDefault())}}get requiredSelectionMessage(){return this.pktStrings.get(`fileupload`).requiredMissing}get isControlled(){return this.value!==void 0}get hasEffectiveError(){return!!this.validationErrorMessage||this.hasError||!!this.errorMessage.trim()}get effectiveErrorMessage(){return this.validationErrorMessage??this.errorMessage??``}get hasValidationError(){return!!this.validationErrorMessage}firstUpdated(e){super.firstUpdated?.(e),this.hasInitializedValue||=(this.files=this.value??this.defaultValue??[],this.syncThumbnailUrls(this.files),!0),this.value!==void 0&&this.defaultValue!==void 0&&this.warnInvalidValueCombo()}willUpdate(e){super.willUpdate(e),this.hasInitializedValue&&this.isControlled&&(e.has(`value`)||e.has(`itemRenderer`)||e.has(`enableImagePreview`))&&(this.files=this.value??[],this.syncThumbnailUrls(this.files))}updated(e){super.updated(e),(e.has(`uploadStrategy`)||e.has(`required`)||e.has(`value`)||e.has(`form`))&&this.syncFormSubmitListener(),this.uploadStrategy===`form`&&(e.has(`value`)||e.has(`files`)||e.has(`uploadStrategy`))&&this.syncNativeInputFiles()}syncNativeInputFiles(){let e=this.querySelector(`#${this.id}-input`);if(!(!e||typeof DataTransfer>`u`))try{let t=new DataTransfer;for(let e of this.getCurrentFiles())e.file&&t.items.add(e.file);e.files=t.files}catch{}}warnInvalidValueCombo(){this.hasWarnedInvalidValueCombo||=(console.warn(`PktFileUpload: Både value og defaultValue er angitt. Komponenten kan være enten kontrollert eller ukontrollert, ikke begge. value vil bli prioritert.`),!0)}disconnectedCallback(){this.teardownFormSubmitListener(),this.addedAnnouncementTimer&&=(clearTimeout(this.addedAnnouncementTimer),null),super.disconnectedCallback(),this.revokeAllThumbnailUrls()}setAddedAnnouncement(e){this.addedAnnouncement=e,this.addedAnnouncementTimer&&clearTimeout(this.addedAnnouncementTimer),this.addedAnnouncementTimer=setTimeout(()=>{this.addedAnnouncement=``,this.addedAnnouncementTimer=null},1500)}connectedCallback(){super.connectedCallback(),this.syncFormSubmitListener()}addFiles(e){if(e.length===0)return;let t=this.multiple?e:[e[0]];for(let e of t){let t=this.validateFile(e);if(t){this.validationErrorMessage=t;return}}this.validationErrorMessage=null;let r=t.map(e=>({fileId:a.n(),file:e,attributes:{targetFilename:e.name}})),i=this.pktStrings.get(`fileupload`);this.setAddedAnnouncement(r.length===1?n.t(i.srFileAdded,{filename:r[0].attributes.targetFilename}):n.t(i.srFilesAdded,{count:r.length}));let o=this.getCurrentFiles(),s=this.multiple?[...o,...r]:[r[0]];this.commitFiles(s,`add`,r.map(e=>e.fileId)),this.uploadStrategy===`custom`&&r.forEach(e=>{this.dispatchEvent(new CustomEvent(`file-upload-requested`,{detail:{fileId:e.fileId,file:e.file,attributes:e.attributes},bubbles:!0,composed:!0}))})}getCurrentFiles(){return this.isControlled?this.value??[]:this.files}cancelTransfer(e){if(this.disabled)return;let t=this.getCurrentFiles().find(t=>t.fileId===e);t&&(this.removeFileItem(e),this.dispatchEvent(new CustomEvent(`transfer-cancelled`,{detail:{fileId:t.fileId,file:t.file,attributes:t.attributes},bubbles:!0,composed:!0})))}removeFileItem(e){if(this.disabled)return;let t=this.getCurrentFiles(),n=t.filter(t=>t.fileId!==e);n.length!==t.length&&this.commitFiles(n,`remove`,[e])}updateFileItem(e,t){let n=this.getCurrentFiles().map(n=>n.fileId===e?{...n,...t}:n);this.commitFiles(n,`update`,[e])}commitFiles(e,t,n){this.isControlled||(this.files=e,this.syncThumbnailUrls(e)),this.validationErrorMessage===this.requiredSelectionMessage&&e.length>0&&(this.validationErrorMessage=null),this.dispatchEvent(new CustomEvent(`files-changed`,{detail:{files:e,reason:t,changedFileIds:n},bubbles:!0,composed:!0}))}getThumbnailUrl(e){return this.thumbnailUrls[e.fileId]}getTransferProgress(e){let t=this.transfers.find(t=>t.fileId===e);return t?t.progress:this.uploadStrategy===`form`?`done`:`queued`}getTransferForFile(e){return this.transfers.find(t=>t.fileId===e)}isImageFile(e){return v(e)}formatFileSize(e){return c(e)}getResolvedAcceptValue(){return p(this.accept,this.allowedFormats)}getSupportedFormatsText(){return h(this.allowedFormats,this.accept)}getSortedFilesAndTransfers(){return b(this.getCurrentFiles(),this.transfers,this.uploadStrategy)}validateFile(e){let t=_(e,{allowedFormats:this.allowedFormats,maxFileSize:this.maxFileSize,formatErrorMessage:this.formatErrorMessage,sizeErrorMessage:this.sizeErrorMessage,onFileValidation:this.onFileValidation});if(t)return t;let n={file:e,errorMessage:null},r=new CustomEvent(`file-validate`,{detail:n,bubbles:!0,composed:!0,cancelable:!0});return this.dispatchEvent(r),n.errorMessage?n.errorMessage:r.defaultPrevented?this.pktStrings.get(`fileupload`).genericValidationRejection:null}syncThumbnailUrls(e){if(!(typeof URL<`u`&&typeof URL.createObjectURL==`function`&&typeof URL.revokeObjectURL==`function`)){this.thumbnailUrls={},this.thumbnailFileById.clear();return}let t=new Set(e.map(e=>e.fileId)),n={};for(let[e,n]of Object.entries(this.thumbnailUrls))t.has(e)||(URL.revokeObjectURL(n),this.thumbnailFileById.delete(e));for(let t of e){let e=this.thumbnailUrls[t.fileId],r=this.thumbnailFileById.get(t.fileId);if(!t.file||!this.isImageFile(t)){e&&(URL.revokeObjectURL(e),this.thumbnailFileById.delete(t.fileId));continue}if(e&&r===t.file){n[t.fileId]=e;continue}e&&r!==t.file&&URL.revokeObjectURL(e);let i=URL.createObjectURL(t.file);this.thumbnailFileById.set(t.fileId,t.file),n[t.fileId]=i}this.thumbnailUrls=n}revokeAllThumbnailUrls(){if(typeof URL>`u`||typeof URL.revokeObjectURL!=`function`){this.thumbnailUrls={},this.thumbnailFileById.clear();return}Object.values(this.thumbnailUrls).forEach(e=>URL.revokeObjectURL(e)),this.thumbnailUrls={},this.thumbnailFileById.clear()}getSrUploadedMessage(){if(this.addedAnnouncement)return this.addedAnnouncement;let{totalCount:e,uploadedCount:t}=C(this.getCurrentFiles(),this.transfers);if(e===0||t===0)return``;let r=this.pktStrings.get(`fileupload`);return n.t(r.srFilesUploadedOfTotal,{uploaded:t,total:e,label:n.n(e,r.fileLabelOne,r.fileLabelOther)})}getSrErrorsMessage(){let{totalCount:e,failedCount:t}=C(this.getCurrentFiles(),this.transfers);if(e===0||t===0)return``;let r=this.pktStrings.get(`fileupload`);return n.t(r.srFilesFailedOfTotal,{failed:t,total:e,label:n.n(e,r.fileLabelOne,r.fileLabelOther)})}get ownerForm(){if(this.form!==void 0){if(!this.form)return null;let e=this.ownerDocument?.getElementById(this.form);return e instanceof HTMLFormElement?e:null}return this.closest(`form`)}syncFormSubmitListener(){let e=this.ownerForm;this.connectedForm!==e&&(this.teardownFormSubmitListener(),this.connectedForm=e,this.connectedForm&&this.connectedForm.addEventListener(`submit`,this.onHostFormSubmit))}teardownFormSubmitListener(){this.connectedForm&&=(this.connectedForm.removeEventListener(`submit`,this.onHostFormSubmit),null)}};e.n([e.u({type:String})],T.prototype,`id`,void 0),e.n([e.u({type:String})],T.prototype,`name`,void 0),e.n([e.u({type:String,reflect:!0})],T.prototype,`form`,void 0),e.n([e.u({type:String})],T.prototype,`label`,void 0),e.n([e.u({type:String})],T.prototype,`helptext`,void 0),e.n([e.u({type:String,attribute:`helptext-dropdown`})],T.prototype,`helptextDropdown`,void 0),e.n([e.u({type:String,attribute:`helptext-dropdown-button`})],T.prototype,`helptextDropdownButton`,void 0),e.n([e.u({type:Boolean,reflect:!0})],T.prototype,`required`,void 0),e.n([e.u({type:Boolean,reflect:!0})],T.prototype,`multiple`,void 0),e.n([e.u({type:Boolean,reflect:!0})],T.prototype,`disabled`,void 0),e.n([e.u({type:Boolean,reflect:!0,attribute:`fullwidth`})],T.prototype,`fullwidth`,void 0),e.n([e.u({type:String,reflect:!0,attribute:`upload-strategy`})],T.prototype,`uploadStrategy`,void 0),e.n([e.u({type:String,reflect:!0,attribute:`item-renderer`})],T.prototype,`itemRenderer`,void 0),e.n([e.u({type:String})],T.prototype,`accept`,void 0),e.n([e.u({converter:i.t.csvToArray,attribute:`allowed-formats`})],T.prototype,`allowedFormats`,void 0),e.n([e.u({type:String,attribute:`format-error-message`})],T.prototype,`formatErrorMessage`,void 0),e.n([e.u({attribute:`max-file-size`})],T.prototype,`maxFileSize`,void 0),e.n([e.u({type:String,attribute:`size-error-message`})],T.prototype,`sizeErrorMessage`,void 0),e.n([e.u({attribute:!1})],T.prototype,`onFileValidation`,void 0),e.n([e.u({attribute:!1})],T.prototype,`transfers`,void 0),e.n([e.u({type:Boolean,attribute:`add-comments-enabled`})],T.prototype,`addCommentsEnabled`,void 0),e.n([e.u({type:Boolean,attribute:`rename-files-enabled`})],T.prototype,`renameFilesEnabled`,void 0),e.n([e.u({attribute:!1})],T.prototype,`extraOperations`,void 0),e.n([e.u({type:Boolean,reflect:!0,attribute:`enable-image-preview`})],T.prototype,`enableImagePreview`,void 0),e.n([e.u({type:Boolean,attribute:`has-error`})],T.prototype,`hasError`,void 0),e.n([e.u({type:String,attribute:`error-message`})],T.prototype,`errorMessage`,void 0),e.n([e.u({type:Boolean,attribute:`optional-tag`})],T.prototype,`optionalTag`,void 0),e.n([e.u({type:String,attribute:`optional-text`})],T.prototype,`optionalText`,void 0),e.n([e.u({type:Boolean,attribute:`required-tag`})],T.prototype,`requiredTag`,void 0),e.n([e.u({type:String,attribute:`required-text`})],T.prototype,`requiredText`,void 0),e.n([e.u({type:String,attribute:`tag-text`})],T.prototype,`tagText`,void 0),e.n([e.u({type:Number,attribute:`truncate-tail`})],T.prototype,`truncateTail`,void 0),e.n([e.u({attribute:!1})],T.prototype,`value`,void 0),e.n([e.u({attribute:!1})],T.prototype,`defaultValue`,void 0),e.n([e.l()],T.prototype,`files`,void 0),e.n([e.l()],T.prototype,`isDragActive`,void 0),e.n([e.l()],T.prototype,`validationErrorMessage`,void 0),e.n([e.l()],T.prototype,`addedAnnouncement`,void 0),e.n([e.l()],T.prototype,`thumbnailUrls`,void 0);var E=`comments`,D=(e,t)=>{let r=new Date(e);if(Number.isNaN(r.getTime()))return e;let i=String(r.getDate()).padStart(2,`0`),a=String(r.getMonth()+1).padStart(2,`0`),o=r.getFullYear(),s=String(r.getHours()).padStart(2,`0`),c=String(r.getMinutes()).padStart(2,`0`);return n.t(t.commentTimestamp,{date:`${i}.${a}.${o}`,time:`${s}:${c}`})},O=(e,t,n)=>{e.key===`Enter`&&(e.preventDefault(),e.stopPropagation(),t()),e.key===`Escape`&&(e.preventDefault(),e.stopPropagation(),n())},k=(e,t,n)=>{e.key===`Escape`&&(e.preventDefault(),e.stopPropagation(),n()),(e.metaKey||e.ctrlKey)&&e.key===`Enter`&&(e.preventDefault(),e.stopPropagation(),t())},A=(e,t)=>({id:`remove`,title:t.remove,ariaLabel:t.removeFile,onClick:({file:t})=>e(t.fileId)}),j=t=>({id:`rename`,title:t.rename,ariaLabel:t.renameFile,renderInlineUI:n=>{let r=n.getAttribute(`targetFilename`)||n.file.attributes?.targetFilename||n.file.file?.name||``,i=`pkt-fileupload-rename-${n.file.fileId}`,a=()=>{let e=document.getElementById(i)?.value?.trim();e&&n.setAttribute(`targetFilename`,e),n.close()};return e._`
|
|
1
|
+
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./format-B8meU8Tm.cjs");require("./alert-IaZzEgyI.cjs"),require("./icon-Dnv6LtPC.cjs");const r=require("./if-defined-2mkIDgOm.cjs"),i=require("./converters-BJ9Fe0kW.cjs"),a=require("./utils-63cRpWut.cjs");require("./input-wrapper-J3mEKhvR.cjs");const o=require("./focus-trap-DSv4Ifqm.cjs");require("./modal-BymjMIJi.cjs"),require("./progressbar-CIXNSwTy.cjs");function s(e){if(e==null||e===``)return;if(typeof e==`number`)return Number.isFinite(e)&&e>0?e:void 0;let t=String(e).trim(),n=Number(t);if(!Number.isNaN(n)&&n>0)return n;let r=t.match(/^(\d+(?:\.\d+)?)\s*(B|KB|MB|GB)$/i);if(!r){console.warn(`PktFileUpload: Invalid maxFileSize format "${t}". Use format like "5MB", "500KB", "1GB", or bytes.`);return}let i=parseFloat(r[1]);switch(r[2].toUpperCase()){case`B`:return i;case`KB`:return i*1024;case`MB`:return i*1024*1024;case`GB`:return i*1024*1024*1024;default:return}}function c(e){return e<1024?`${Math.round(e)} B`:e<1048576?`${Math.round(e/1024)} KB`:e<1073741824?`${Math.round(e/1048576)} MB`:`${Math.round(e/1073741824)} GB`}function l(e){return Array.isArray(e)?e.map(e=>String(e).trim().toLowerCase()).filter(Boolean):[]}function u(e){return e?e.split(`,`).map(e=>e.trim().toLowerCase()).filter(Boolean):[]}function d(e,t,n){let r=e.toLowerCase().replace(/^\./,``);if(r.includes(`/`)){if(r.endsWith(`/*`)){let e=r.replace(`/*`,``);return n.startsWith(`${e}/`)}return n===r}return t===r}function f(e,t){let n=l(t);if(n.length===0)return!0;let r=e.name.split(`.`).pop()?.toLowerCase()??``,i=e.type.toLowerCase();return n.some(e=>d(e,r,i))}function p(e,t){let n=(e??``).trim();if(n)return n;let r=l(t);return r.length===0?``:r.map(e=>e.includes(`/`)||e.startsWith(`.`)?e:`.${e}`).join(`, `)}function m(e){return e.includes(`/`)?e:e.replace(/^\./,``).toUpperCase()}function h(e,t){let n=l(e);if(n.length>0)return n.map(m).join(`, `);let r=u(t);return r.length>0?r.map(m).join(`, `):``}function g(e,t,n){return((e??``).trim()||t).replace(/\{(\w+)\}/g,(e,t)=>n[t]??`{${t}}`)}function _(t,n){let r=l(n.allowedFormats);if(r.length>0&&!f(t,r)){let t=r.join(`, `),i=e.s.fileupload.invalidFormat;return g(n.formatErrorMessage,i,{formats:t})}let i=s(n.maxFileSize);if(i!==void 0&&t.size>i){let t=c(i),r=e.s.fileupload.sizeTooLarge;return g(n.sizeErrorMessage,r,{maxSize:t})}if(n.onFileValidation){let e=n.onFileValidation(t);if(e)return e}return null}function v(e){let t=e.file;if(t?.type?.startsWith(`image/`))return!0;let n=e.attributes?.targetFilename||t?.name||``;return/\.(jpe?g|png|gif|webp|heic|heif|bmp|svg)$/i.test(n)}function y(e){return typeof e==`number`?`in-progress`:e===`error`?`error`:`idle`}function b(e,t,n){let r={"in-progress":0,error:1,idle:2};return e.map(e=>{let r=t?.find(t=>t.fileId===e.fileId);return{...e,progress:r?.progress??(n===`form`?`done`:`queued`),errorMessage:r?.errorMessage,showProgress:r?.showProgress,lastProgress:r?.lastProgress}}).sort((e,t)=>r[y(e.progress)]-r[y(t.progress)])}function x(e,t){return!t||t<=0||e.length<=t+3?null:{head:e.slice(0,e.length-t),tail:e.slice(-t)}}function S(e,t,n){return n<=0?0:t===`prev`?e<=0?n-1:e-1:e>=n-1?0:e+1}function C(e,t){let n=e.length;if(n===0||!t||t.length===0)return{totalCount:n,uploadedCount:0,failedCount:0};let r=0,i=0;for(let n of e){let e=t.find(e=>e.fileId===n.fileId);e?.progress===`done`?r++:e?.progress===`error`&&i++}return{totalCount:n,uploadedCount:r,failedCount:i}}function w(t,n=e.s.fileupload.unknownFilename){return t.attributes?.targetFilename||t.file?.name||n}var T=class extends e.t{constructor(...e){super(...e),this.id=`pkt-fileupload-${a.n()}`,this.name=`files`,this.label=``,this.helptext=``,this.helptextDropdown=``,this.required=!1,this.multiple=!1,this.disabled=!1,this.fullwidth=!1,this.uploadStrategy=`form`,this.itemRenderer=`filename`,this.accept=``,this.allowedFormats=[],this.formatErrorMessage=``,this.sizeErrorMessage=``,this.transfers=[],this.addCommentsEnabled=!1,this.renameFilesEnabled=!1,this.extraOperations=[],this.enableImagePreview=!1,this.hasError=!1,this.errorMessage=``,this.optionalTag=!1,this.requiredTag=!1,this.tagText=null,this.truncateTail=4,this.files=[],this.isDragActive=!1,this.validationErrorMessage=null,this.addedAnnouncement=``,this.thumbnailUrls={},this.hasInitializedValue=!1,this.hasWarnedInvalidValueCombo=!1,this.thumbnailFileById=new Map,this.connectedForm=null,this.addedAnnouncementTimer=null,this.onNativeFileChange=e=>{let t=e.target;this.addFiles(t.files?Array.from(t.files):[]),this.uploadStrategy===`custom`&&(t.value=``)},this.openFileDialog=e=>{e.preventDefault(),e.stopPropagation(),!this.disabled&&this.querySelector(`#${this.id}-input`)?.click()},this.onDropZoneClick=e=>{this.disabled||e.target.closest(`.pkt-fileupload__drop-zone__placeholder__title__open-file-dialog`)||this.querySelector(`#${this.id}-input`)?.click()},this.onDragOver=e=>{e.preventDefault(),!this.disabled&&(this.isDragActive=!0)},this.onDragLeave=()=>{this.isDragActive=!1},this.onDrop=e=>{if(e.preventDefault(),this.isDragActive=!1,this.disabled)return;let t=e.dataTransfer?.files?Array.from(e.dataTransfer.files):[];this.addFiles(t)},this.onHostFormSubmit=e=>{!this.required||this.uploadStrategy!==`custom`||this.getCurrentFiles().length>0||(this.validationErrorMessage=this.requiredSelectionMessage,e.preventDefault())}}get requiredSelectionMessage(){return this.pktStrings.get(`fileupload`).requiredMissing}get isControlled(){return this.value!==void 0}get hasEffectiveError(){return!!this.validationErrorMessage||this.hasError||!!this.errorMessage.trim()}get effectiveErrorMessage(){return this.validationErrorMessage??this.errorMessage??``}get hasValidationError(){return!!this.validationErrorMessage}firstUpdated(e){super.firstUpdated?.(e),this.hasInitializedValue||=(this.files=this.value??this.defaultValue??[],this.syncThumbnailUrls(this.files),!0),this.value!==void 0&&this.defaultValue!==void 0&&this.warnInvalidValueCombo()}willUpdate(e){super.willUpdate(e),this.hasInitializedValue&&this.isControlled&&(e.has(`value`)||e.has(`itemRenderer`)||e.has(`enableImagePreview`))&&(this.files=this.value??[],this.syncThumbnailUrls(this.files))}updated(e){super.updated(e),(e.has(`uploadStrategy`)||e.has(`required`)||e.has(`value`)||e.has(`form`))&&this.syncFormSubmitListener(),this.uploadStrategy===`form`&&(e.has(`value`)||e.has(`files`)||e.has(`uploadStrategy`))&&this.syncNativeInputFiles()}syncNativeInputFiles(){let e=this.querySelector(`#${this.id}-input`);if(!(!e||typeof DataTransfer>`u`))try{let t=new DataTransfer;for(let e of this.getCurrentFiles())e.file&&t.items.add(e.file);e.files=t.files}catch{}}warnInvalidValueCombo(){this.hasWarnedInvalidValueCombo||=(console.warn(`PktFileUpload: Både value og defaultValue er angitt. Komponenten kan være enten kontrollert eller ukontrollert, ikke begge. value vil bli prioritert.`),!0)}disconnectedCallback(){this.teardownFormSubmitListener(),this.addedAnnouncementTimer&&=(clearTimeout(this.addedAnnouncementTimer),null),super.disconnectedCallback(),this.revokeAllThumbnailUrls()}setAddedAnnouncement(e){this.addedAnnouncement=e,this.addedAnnouncementTimer&&clearTimeout(this.addedAnnouncementTimer),this.addedAnnouncementTimer=setTimeout(()=>{this.addedAnnouncement=``,this.addedAnnouncementTimer=null},1500)}connectedCallback(){super.connectedCallback(),this.syncFormSubmitListener()}addFiles(e){if(e.length===0)return;let t=this.multiple?e:[e[0]];for(let e of t){let t=this.validateFile(e);if(t){this.validationErrorMessage=t;return}}this.validationErrorMessage=null;let r=t.map(e=>({fileId:a.n(),file:e,attributes:{targetFilename:e.name}})),i=this.pktStrings.get(`fileupload`);this.setAddedAnnouncement(r.length===1?n.t(i.srFileAdded,{filename:r[0].attributes.targetFilename}):n.t(i.srFilesAdded,{count:r.length}));let o=this.getCurrentFiles(),s=this.multiple?[...o,...r]:[r[0]];this.commitFiles(s,`add`,r.map(e=>e.fileId)),this.uploadStrategy===`custom`&&r.forEach(e=>{this.dispatchEvent(new CustomEvent(`file-upload-requested`,{detail:{fileId:e.fileId,file:e.file,attributes:e.attributes},bubbles:!0,composed:!0}))})}getCurrentFiles(){return this.isControlled?this.value??[]:this.files}cancelTransfer(e){if(this.disabled)return;let t=this.getCurrentFiles().find(t=>t.fileId===e);t&&(this.removeFileItem(e),this.dispatchEvent(new CustomEvent(`transfer-cancelled`,{detail:{fileId:t.fileId,file:t.file,attributes:t.attributes},bubbles:!0,composed:!0})))}removeFileItem(e){if(this.disabled)return;let t=this.getCurrentFiles(),n=t.filter(t=>t.fileId!==e);n.length!==t.length&&this.commitFiles(n,`remove`,[e])}updateFileItem(e,t){let n=this.getCurrentFiles().map(n=>n.fileId===e?{...n,...t}:n);this.commitFiles(n,`update`,[e])}commitFiles(e,t,n){this.isControlled||(this.files=e,this.syncThumbnailUrls(e)),this.validationErrorMessage===this.requiredSelectionMessage&&e.length>0&&(this.validationErrorMessage=null),this.dispatchEvent(new CustomEvent(`files-changed`,{detail:{files:e,reason:t,changedFileIds:n},bubbles:!0,composed:!0}))}getThumbnailUrl(e){return this.thumbnailUrls[e.fileId]}getTransferProgress(e){let t=this.transfers.find(t=>t.fileId===e);return t?t.progress:this.uploadStrategy===`form`?`done`:`queued`}getTransferForFile(e){return this.transfers.find(t=>t.fileId===e)}isImageFile(e){return v(e)}formatFileSize(e){return c(e)}getResolvedAcceptValue(){return p(this.accept,this.allowedFormats)}getSupportedFormatsText(){return h(this.allowedFormats,this.accept)}getSortedFilesAndTransfers(){return b(this.getCurrentFiles(),this.transfers,this.uploadStrategy)}validateFile(e){let t=_(e,{allowedFormats:this.allowedFormats,maxFileSize:this.maxFileSize,formatErrorMessage:this.formatErrorMessage,sizeErrorMessage:this.sizeErrorMessage,onFileValidation:this.onFileValidation});if(t)return t;let n={file:e,errorMessage:null},r=new CustomEvent(`file-validate`,{detail:n,bubbles:!0,composed:!0,cancelable:!0});return this.dispatchEvent(r),n.errorMessage?n.errorMessage:r.defaultPrevented?this.pktStrings.get(`fileupload`).genericValidationRejection:null}syncThumbnailUrls(e){if(!(typeof URL<`u`&&typeof URL.createObjectURL==`function`&&typeof URL.revokeObjectURL==`function`)){this.thumbnailUrls={},this.thumbnailFileById.clear();return}let t=new Set(e.map(e=>e.fileId)),n={};for(let[e,n]of Object.entries(this.thumbnailUrls))t.has(e)||(URL.revokeObjectURL(n),this.thumbnailFileById.delete(e));for(let t of e){let e=this.thumbnailUrls[t.fileId],r=this.thumbnailFileById.get(t.fileId);if(!t.file||!this.isImageFile(t)){e&&(URL.revokeObjectURL(e),this.thumbnailFileById.delete(t.fileId));continue}if(e&&r===t.file){n[t.fileId]=e;continue}e&&r!==t.file&&URL.revokeObjectURL(e);let i=URL.createObjectURL(t.file);this.thumbnailFileById.set(t.fileId,t.file),n[t.fileId]=i}this.thumbnailUrls=n}revokeAllThumbnailUrls(){if(typeof URL>`u`||typeof URL.revokeObjectURL!=`function`){this.thumbnailUrls={},this.thumbnailFileById.clear();return}Object.values(this.thumbnailUrls).forEach(e=>URL.revokeObjectURL(e)),this.thumbnailUrls={},this.thumbnailFileById.clear()}getSrUploadedMessage(){if(this.addedAnnouncement)return this.addedAnnouncement;let{totalCount:e,uploadedCount:t}=C(this.getCurrentFiles(),this.transfers);if(e===0||t===0)return``;let r=this.pktStrings.get(`fileupload`);return n.t(r.srFilesUploadedOfTotal,{uploaded:t,total:e,label:n.n(e,r.fileLabelOne,r.fileLabelOther)})}getSrErrorsMessage(){let{totalCount:e,failedCount:t}=C(this.getCurrentFiles(),this.transfers);if(e===0||t===0)return``;let r=this.pktStrings.get(`fileupload`);return n.t(r.srFilesFailedOfTotal,{failed:t,total:e,label:n.n(e,r.fileLabelOne,r.fileLabelOther)})}get ownerForm(){if(this.form!==void 0){if(!this.form)return null;let e=this.ownerDocument?.getElementById(this.form);return e instanceof HTMLFormElement?e:null}return this.closest(`form`)}syncFormSubmitListener(){let e=this.ownerForm;this.connectedForm!==e&&(this.teardownFormSubmitListener(),this.connectedForm=e,this.connectedForm&&this.connectedForm.addEventListener(`submit`,this.onHostFormSubmit))}teardownFormSubmitListener(){this.connectedForm&&=(this.connectedForm.removeEventListener(`submit`,this.onHostFormSubmit),null)}};e.n([e.u({type:String})],T.prototype,`id`,void 0),e.n([e.u({type:String})],T.prototype,`name`,void 0),e.n([e.u({type:String,reflect:!0})],T.prototype,`form`,void 0),e.n([e.u({type:String})],T.prototype,`label`,void 0),e.n([e.u({type:String})],T.prototype,`helptext`,void 0),e.n([e.u({type:String,attribute:`helptext-dropdown`})],T.prototype,`helptextDropdown`,void 0),e.n([e.u({type:String,attribute:`helptext-dropdown-button`})],T.prototype,`helptextDropdownButton`,void 0),e.n([e.u({type:Boolean,reflect:!0})],T.prototype,`required`,void 0),e.n([e.u({type:Boolean,reflect:!0})],T.prototype,`multiple`,void 0),e.n([e.u({type:Boolean,reflect:!0})],T.prototype,`disabled`,void 0),e.n([e.u({type:Boolean,reflect:!0,attribute:`fullwidth`})],T.prototype,`fullwidth`,void 0),e.n([e.u({type:String,reflect:!0,attribute:`upload-strategy`})],T.prototype,`uploadStrategy`,void 0),e.n([e.u({type:String,reflect:!0,attribute:`item-renderer`})],T.prototype,`itemRenderer`,void 0),e.n([e.u({type:String})],T.prototype,`accept`,void 0),e.n([e.u({converter:i.t.csvToArray,attribute:`allowed-formats`})],T.prototype,`allowedFormats`,void 0),e.n([e.u({type:String,attribute:`format-error-message`})],T.prototype,`formatErrorMessage`,void 0),e.n([e.u({attribute:`max-file-size`})],T.prototype,`maxFileSize`,void 0),e.n([e.u({type:String,attribute:`size-error-message`})],T.prototype,`sizeErrorMessage`,void 0),e.n([e.u({attribute:!1})],T.prototype,`onFileValidation`,void 0),e.n([e.u({attribute:!1})],T.prototype,`transfers`,void 0),e.n([e.u({type:Boolean,attribute:`add-comments-enabled`})],T.prototype,`addCommentsEnabled`,void 0),e.n([e.u({type:Boolean,attribute:`rename-files-enabled`})],T.prototype,`renameFilesEnabled`,void 0),e.n([e.u({attribute:!1})],T.prototype,`extraOperations`,void 0),e.n([e.u({type:Boolean,reflect:!0,attribute:`enable-image-preview`})],T.prototype,`enableImagePreview`,void 0),e.n([e.u({type:Boolean,attribute:`has-error`})],T.prototype,`hasError`,void 0),e.n([e.u({type:String,attribute:`error-message`})],T.prototype,`errorMessage`,void 0),e.n([e.u({type:Boolean,attribute:`optional-tag`})],T.prototype,`optionalTag`,void 0),e.n([e.u({type:String,attribute:`optional-text`})],T.prototype,`optionalText`,void 0),e.n([e.u({type:Boolean,attribute:`required-tag`})],T.prototype,`requiredTag`,void 0),e.n([e.u({type:String,attribute:`required-text`})],T.prototype,`requiredText`,void 0),e.n([e.u({type:String,attribute:`tag-text`})],T.prototype,`tagText`,void 0),e.n([e.u({type:Number,attribute:`truncate-tail`})],T.prototype,`truncateTail`,void 0),e.n([e.u({attribute:!1})],T.prototype,`value`,void 0),e.n([e.u({attribute:!1})],T.prototype,`defaultValue`,void 0),e.n([e.l()],T.prototype,`files`,void 0),e.n([e.l()],T.prototype,`isDragActive`,void 0),e.n([e.l()],T.prototype,`validationErrorMessage`,void 0),e.n([e.l()],T.prototype,`addedAnnouncement`,void 0),e.n([e.l()],T.prototype,`thumbnailUrls`,void 0);var E=`comments`,D=(e,t)=>{let r=new Date(e);if(Number.isNaN(r.getTime()))return e;let i=String(r.getDate()).padStart(2,`0`),a=String(r.getMonth()+1).padStart(2,`0`),o=r.getFullYear(),s=String(r.getHours()).padStart(2,`0`),c=String(r.getMinutes()).padStart(2,`0`);return n.t(t.commentTimestamp,{date:`${i}.${a}.${o}`,time:`${s}:${c}`})},O=(e,t,n)=>{e.key===`Enter`&&(e.preventDefault(),e.stopPropagation(),t()),e.key===`Escape`&&(e.preventDefault(),e.stopPropagation(),n())},k=(e,t,n)=>{e.key===`Escape`&&(e.preventDefault(),e.stopPropagation(),n()),(e.metaKey||e.ctrlKey)&&e.key===`Enter`&&(e.preventDefault(),e.stopPropagation(),t())},A=(e,t)=>({id:`remove`,title:t.remove,ariaLabel:t.removeFile,onClick:({file:t})=>e(t.fileId)}),j=t=>({id:`rename`,title:t.rename,ariaLabel:t.renameFile,renderInlineUI:n=>{let r=n.getAttribute(`targetFilename`)||n.file.attributes?.targetFilename||n.file.file?.name||``,i=`pkt-fileupload-rename-${n.file.fileId}`,a=()=>{let e=document.getElementById(i)?.value?.trim();e&&n.setAttribute(`targetFilename`,e),n.close()};return e._`
|
|
2
2
|
<label for=${i} class="pkt-sr-only">${t.renameInputLabel}</label>
|
|
3
3
|
<input
|
|
4
4
|
id=${i}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-D7sTqOr3.cjs"),i=require("./booleanish-BF8l4scU.cjs"),a=require("./fetch-header-footer-data-CUKV0biS.cjs");require("./icon-Dnv6LtPC.cjs");const o=require("./if-defined-2mkIDgOm.cjs");require("./button-BNVTj7nB.cjs");const s=require("./ref-Emu5PNxk.cjs"),c=require("./focus-trap-DSv4Ifqm.cjs"),l=require("./scroll-lock-BN8lOhV5.cjs");require("./link-LO_5_La8.cjs"),require("./textinput-
|
|
1
|
+
const e=require("./element-BOmr9YLv.cjs"),t=require("./class-map-Drv0_anQ.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-D7sTqOr3.cjs"),i=require("./booleanish-BF8l4scU.cjs"),a=require("./fetch-header-footer-data-CUKV0biS.cjs");require("./icon-Dnv6LtPC.cjs");const o=require("./if-defined-2mkIDgOm.cjs");require("./button-BNVTj7nB.cjs");const s=require("./ref-Emu5PNxk.cjs"),c=require("./focus-trap-DSv4Ifqm.cjs"),l=require("./scroll-lock-BN8lOhV5.cjs");require("./link-LO_5_La8.cjs"),require("./textinput-C2Tx-OrN.cjs"),require("./searchinput-CbClDE-d.cjs"),require("./header-menu-BfkCp8jw.cjs");var u=e=>typeof e.target==`string`?{title:e.title,iconName:e.iconName,href:e.target}:{title:e.title,iconName:e.iconName,onClick:e.target},d=e=>u(e),f=e=>{if(!e)return;let t=typeof e==`string`?new Date(e):e;if(!isNaN(t.getTime()))return t.toLocaleDateString(`nb-NO`,{day:`numeric`,month:`long`,year:`numeric`,hour:`2-digit`,minute:`2-digit`})},p=class{constructor(e,t){this.isMobile=!1,this.isTablet=!1,this.isHidden=!1,this.pauseScrollHide=!1,this.componentWidth=typeof window<`u`?window.innerWidth:0,this.lastScrollPosition=0,this.scrollLockToken=l.t(),this.lastFocusedElement=null,this.shouldRestoreFocus=!1,this.handleScroll=()=>{if(this.getOptions().scrollBehavior!==`hide`||this.pauseScrollHide)return;let e=window.pageYOffset||document.documentElement.scrollTop;if(e<0||Math.abs(e-this.lastScrollPosition)<60)return;let t=e>this.lastScrollPosition;this.lastScrollPosition=e,t!==this.isHidden&&(this.isHidden=t,this.host.requestUpdate())},this.host=e,this.getOptions=t,e.addController(this)}hostConnected(){window.addEventListener(`scroll`,this.handleScroll)}hostDisconnected(){this.resizeObserver?.disconnect(),window.removeEventListener(`scroll`,this.handleScroll),l.n(this.scrollLockToken,!1)}observe(e){e&&(this.componentWidth=e.offsetWidth,this.refreshBreakpoints(),this.resizeObserver=new ResizeObserver(e=>{for(let t of e)this.componentWidth=t.borderBoxSize&&t.borderBoxSize.length>0?t.borderBoxSize[0].inlineSize:t.contentRect.width,this.refreshBreakpoints()}),this.resizeObserver.observe(e))}refreshBreakpoints(){let{mobileBreakpoint:e,tabletBreakpoint:t}=this.getOptions(),n=this.componentWidth<e,r=this.componentWidth<t;(n!==this.isMobile||r!==this.isTablet)&&(this.isMobile=n,this.isTablet=r,this.host.requestUpdate())}setScrollLock(e){l.n(this.scrollLockToken,e)}captureFocus(){this.lastFocusedElement=document.activeElement}flagRestoreFocus(){this.shouldRestoreFocus=!0}restoreFocus(){this.shouldRestoreFocus&&this.lastFocusedElement&&document.contains(this.lastFocusedElement)&&this.lastFocusedElement.focus(),this.lastFocusedElement=null,this.shouldRestoreFocus=!1}},m=class extends e.t{constructor(...e){super(...e),this.canChangeRepresentation=!1,this.logoutOnClick=!1}handleChangeRepresentation(){this.dispatchEvent(new CustomEvent(`change-representation`,{bubbles:!0,composed:!0}))}handleLogout(){this.dispatchEvent(new CustomEvent(`log-out`,{bubbles:!0,composed:!0}))}handleMenuItemClick(e){`onClick`in e&&typeof e.onClick==`function`&&e.onClick()}renderLinkOrButton(n,r){let i=`href`in n,a=t.t({"pkt-user-menu__link":!0,"pkt-link-button":!i,"pkt-link":!i,"pkt-link--icon-left":!i,[r||``]:!!r});return i?e._`
|
|
2
2
|
<pkt-link
|
|
3
3
|
iconName=${n.iconName||e.h}
|
|
4
4
|
href=${n.href}
|
|
@@ -11,7 +11,7 @@ import { n as g, t as _ } from "./ref-CCSGk4MP.js";
|
|
|
11
11
|
import { n as v, t as y } from "./focus-trap-DG3pEuyJ.js";
|
|
12
12
|
import { n as b, t as x } from "./scroll-lock-DAbNKAUy.js";
|
|
13
13
|
import "./link-CmZwAw5u.js";
|
|
14
|
-
import "./textinput-
|
|
14
|
+
import "./textinput-C0eu70sH.js";
|
|
15
15
|
import "./searchinput-Co8tcq-l.js";
|
|
16
16
|
import "./header-menu-ANj5nL2M.js";
|
|
17
17
|
//#region ../../shared-types/header.ts
|
|
@@ -158,6 +158,13 @@ var m = (e) => {
|
|
|
158
158
|
default: !1,
|
|
159
159
|
category: "ui"
|
|
160
160
|
},
|
|
161
|
+
layout: {
|
|
162
|
+
name: "Layout",
|
|
163
|
+
description: "Retning for alternativene i en gruppe. Avstanden mellom dem følger størrelsen (16, 12 og 8px)",
|
|
164
|
+
type: ["vertical", "horizontal"],
|
|
165
|
+
default: "vertical",
|
|
166
|
+
category: "ui"
|
|
167
|
+
},
|
|
161
168
|
useWrapper: {
|
|
162
169
|
name: "Bruk wrapper",
|
|
163
170
|
description: "Indikerer om skjemaelementet skal bruke en wrapper",
|
|
@@ -188,7 +195,7 @@ var m = (e) => {
|
|
|
188
195
|
}
|
|
189
196
|
}, v = class extends c {
|
|
190
197
|
constructor(...e) {
|
|
191
|
-
super(...e), this.forId = f(), this.label = "", this.helptext = null, this.helptextDropdown = null, this.helptextDropdownButton = null, this.counter = _.props.counter.default, this.counterCurrent = 0, this.counterMaxLength = 0, this.counterError = null, this.counterPosition = "bottom", this.optionalTag = _.props.optionalTag.default, this.requiredTag = _.props.requiredTag.default, this.tagText = null, this.hasError = _.props.hasError.default, this.errorMessage = "", this.disabled = _.props.disabled.default, this.inline = _.props.inline.default, this.ariaDescribedby = void 0, this.hasFieldset = _.props.hasFieldset.default, this.role = null, this.useWrapper = _.props.useWrapper.default, this.size = "medium", this.focusModality = new p(this);
|
|
198
|
+
super(...e), this.forId = f(), this.label = "", this.helptext = null, this.helptextDropdown = null, this.helptextDropdownButton = null, this.counter = _.props.counter.default, this.counterCurrent = 0, this.counterMaxLength = 0, this.counterError = null, this.counterPosition = "bottom", this.optionalTag = _.props.optionalTag.default, this.requiredTag = _.props.requiredTag.default, this.tagText = null, this.hasError = _.props.hasError.default, this.errorMessage = "", this.disabled = _.props.disabled.default, this.inline = _.props.inline.default, this.ariaDescribedby = void 0, this.hasFieldset = _.props.hasFieldset.default, this.layout = _.props.layout.default, this.role = null, this.useWrapper = _.props.useWrapper.default, this.size = "medium", this.focusModality = new p(this);
|
|
192
199
|
}
|
|
193
200
|
updated(e) {
|
|
194
201
|
super.updated(e), this.classList.add("pkt-inputwrapper"), this.classList.toggle("pkt-inputwrapper--error", this.hasError), this.classList.toggle("pkt-inputwrapper--disabled", this.disabled), this.classList.toggle("pkt-inputwrapper--inline", this.inline), this.classList.toggle("pkt-inputwrapper--medium", this.size === "medium"), this.classList.toggle("pkt-inputwrapper--small", this.size === "small"), this.classList.toggle("pkt-inputwrapper--xsmall", this.size === "xsmall"), this.role ? this.setAttribute("aria-labelledby", `${this.forId}-label`) : this.removeAttribute("aria-labelledby");
|
|
@@ -262,7 +269,7 @@ var m = (e) => {
|
|
|
262
269
|
${p()}
|
|
263
270
|
${m()}
|
|
264
271
|
${this.counterPosition === "top" ? _() : n}
|
|
265
|
-
<div class
|
|
272
|
+
<div class=${this.optionsClass()}>${o(this)}</div>
|
|
266
273
|
${this.counterPosition === "bottom" ? _() : n}
|
|
267
274
|
${v()}
|
|
268
275
|
`;
|
|
@@ -270,6 +277,9 @@ var m = (e) => {
|
|
|
270
277
|
${y()}
|
|
271
278
|
</fieldset>` : e`<div class="pkt-inputwrapper__fieldset">${y()}</div>`;
|
|
272
279
|
}
|
|
280
|
+
optionsClass() {
|
|
281
|
+
return !this.hasFieldset && this.layout !== "horizontal" ? "pkt-contents" : this.layout === "horizontal" ? "pkt-inputwrapper__options pkt-inputwrapper__options--horizontal" : "pkt-inputwrapper__options";
|
|
282
|
+
}
|
|
273
283
|
toggleDropdown(e) {
|
|
274
284
|
this.dispatchEvent(new CustomEvent("toggleHelpText", {
|
|
275
285
|
bubbles: !1,
|
|
@@ -287,7 +297,7 @@ var m = (e) => {
|
|
|
287
297
|
r([i({ type: String })], v.prototype, "forId", void 0), r([i({ type: String })], v.prototype, "label", void 0), r([i({ type: String })], v.prototype, "helptext", void 0), r([i({ type: String })], v.prototype, "helptextDropdown", void 0), r([i({ type: String })], v.prototype, "helptextDropdownButton", void 0), r([i({ type: Boolean })], v.prototype, "counter", void 0), r([i({ type: Number })], v.prototype, "counterCurrent", void 0), r([i({ type: Number })], v.prototype, "counterMaxLength", void 0), r([i({ type: String })], v.prototype, "counterError", void 0), r([i({
|
|
288
298
|
type: String,
|
|
289
299
|
reflect: !1
|
|
290
|
-
})], v.prototype, "counterPosition", void 0), r([i({ type: Boolean })], v.prototype, "optionalTag", void 0), r([i({ type: String })], v.prototype, "optionalText", void 0), r([i({ type: Boolean })], v.prototype, "requiredTag", void 0), r([i({ type: String })], v.prototype, "requiredText", void 0), r([i({ type: String })], v.prototype, "tagText", void 0), r([i({ type: Boolean })], v.prototype, "hasError", void 0), r([i({ type: String })], v.prototype, "errorMessage", void 0), r([i({ type: Boolean })], v.prototype, "disabled", void 0), r([i({ type: Boolean })], v.prototype, "inline", void 0), r([i({ type: String })], v.prototype, "ariaDescribedby", void 0), r([i({ type: Boolean })], v.prototype, "hasFieldset", void 0), r([i({
|
|
300
|
+
})], v.prototype, "counterPosition", void 0), r([i({ type: Boolean })], v.prototype, "optionalTag", void 0), r([i({ type: String })], v.prototype, "optionalText", void 0), r([i({ type: Boolean })], v.prototype, "requiredTag", void 0), r([i({ type: String })], v.prototype, "requiredText", void 0), r([i({ type: String })], v.prototype, "tagText", void 0), r([i({ type: Boolean })], v.prototype, "hasError", void 0), r([i({ type: String })], v.prototype, "errorMessage", void 0), r([i({ type: Boolean })], v.prototype, "disabled", void 0), r([i({ type: Boolean })], v.prototype, "inline", void 0), r([i({ type: String })], v.prototype, "ariaDescribedby", void 0), r([i({ type: Boolean })], v.prototype, "hasFieldset", void 0), r([i({ type: String })], v.prototype, "layout", void 0), r([i({
|
|
291
301
|
type: String,
|
|
292
302
|
reflect: !0
|
|
293
303
|
})], v.prototype, "role", void 0), r([i({
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-BOmr9YLv.cjs"),t=require("./format-B8meU8Tm.cjs"),n=require("./element-with-slot-D7sTqOr3.cjs"),r=require("./booleanish-BF8l4scU.cjs");require("./alert-IaZzEgyI.cjs");const i=require("./icon-Dnv6LtPC.cjs"),a=require("./if-defined-2mkIDgOm.cjs"),o=require("./utils-63cRpWut.cjs");require("./helptext-BCkwSz1m.cjs");const s=require("./focus-modality-controller-C1ocyv2J.cjs");var c=e=>{let t=[];return e.hasHelptext&&t.push(`${e.id}-helptext`),e.hasCounter&&t.push(`${e.id}-counter-status`),e.ariaDescribedby&&t.push(e.ariaDescribedby),t.length?t.join(` `):void 0},l=e=>`${e}-counter-status`,u=(e,t)=>!!t&&t>0&&(e??0)>t,d={name:`pkt-input-wrapper`,react:`PktInputWrapper`,"css-class":`pkt-inputwrapper`,isElement:!0,isPureReact:!0,"dark-mode":!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:`ARIA-rolle på wrapperen. Settes ikke som standard. Bruk hasFieldset for reelle grupper.`,type:`string`,default:null,category:`accessibility`},size:{name:`Størrelse`,description:`Visuell størrelse. small: kompakt wrapper og felt (42px). xsmall: samme wrapper som small, felt 36px.`,attribute:`input-wrapper-size`,type:[`small`,`medium`,`xsmall`],default:`medium`,category:`ui`}}},f=class extends n.t{constructor(...e){super(...e),this.forId=o.n(),this.label=``,this.helptext=null,this.helptextDropdown=null,this.helptextDropdownButton=null,this.counter=d.props.counter.default,this.counterCurrent=0,this.counterMaxLength=0,this.counterError=null,this.counterPosition=`bottom`,this.optionalTag=d.props.optionalTag.default,this.requiredTag=d.props.requiredTag.default,this.tagText=null,this.hasError=d.props.hasError.default,this.errorMessage=``,this.disabled=d.props.disabled.default,this.inline=d.props.inline.default,this.ariaDescribedby=void 0,this.hasFieldset=d.props.hasFieldset.default,this.role=null,this.useWrapper=d.props.useWrapper.default,this.size=`medium`,this.focusModality=new s.t(this)}updated(e){super.updated(e),this.classList.add(`pkt-inputwrapper`),this.classList.toggle(`pkt-inputwrapper--error`,this.hasError),this.classList.toggle(`pkt-inputwrapper--disabled`,this.disabled),this.classList.toggle(`pkt-inputwrapper--inline`,this.inline),this.classList.toggle(`pkt-inputwrapper--medium`,this.size===`medium`),this.classList.toggle(`pkt-inputwrapper--small`,this.size===`small`),this.classList.toggle(`pkt-inputwrapper--xsmall`,this.size===`xsmall`),this.role?this.setAttribute(`aria-labelledby`,`${this.forId}-label`):this.removeAttribute(`aria-labelledby`)}render(){let r=`pkt-tag pkt-tag--small pkt-tag--thin-text`,o=!!this.helptext||this.hasSlotContent(`helptext`),s=new Set([this.ariaDescribedby||(o?`${this.forId}-helptext`:``),this.hasError&&this.errorMessage?`${this.forId}-error`:``].join(` `).split(` `).filter(Boolean)),c=s.size?[...s].join(` `):e.h,d=this.pktStrings.get(`forms`),f=()=>e._`
|
|
1
|
+
const e=require("./element-BOmr9YLv.cjs"),t=require("./format-B8meU8Tm.cjs"),n=require("./element-with-slot-D7sTqOr3.cjs"),r=require("./booleanish-BF8l4scU.cjs");require("./alert-IaZzEgyI.cjs");const i=require("./icon-Dnv6LtPC.cjs"),a=require("./if-defined-2mkIDgOm.cjs"),o=require("./utils-63cRpWut.cjs");require("./helptext-BCkwSz1m.cjs");const s=require("./focus-modality-controller-C1ocyv2J.cjs");var c=e=>{let t=[];return e.hasHelptext&&t.push(`${e.id}-helptext`),e.hasCounter&&t.push(`${e.id}-counter-status`),e.ariaDescribedby&&t.push(e.ariaDescribedby),t.length?t.join(` `):void 0},l=e=>`${e}-counter-status`,u=(e,t)=>!!t&&t>0&&(e??0)>t,d={name:`pkt-input-wrapper`,react:`PktInputWrapper`,"css-class":`pkt-inputwrapper`,isElement:!0,isPureReact:!0,"dark-mode":!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`},layout:{name:`Layout`,description:`Retning for alternativene i en gruppe. Avstanden mellom dem følger størrelsen (16, 12 og 8px)`,type:[`vertical`,`horizontal`],default:`vertical`,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:`ARIA-rolle på wrapperen. Settes ikke som standard. Bruk hasFieldset for reelle grupper.`,type:`string`,default:null,category:`accessibility`},size:{name:`Størrelse`,description:`Visuell størrelse. small: kompakt wrapper og felt (42px). xsmall: samme wrapper som small, felt 36px.`,attribute:`input-wrapper-size`,type:[`small`,`medium`,`xsmall`],default:`medium`,category:`ui`}}},f=class extends n.t{constructor(...e){super(...e),this.forId=o.n(),this.label=``,this.helptext=null,this.helptextDropdown=null,this.helptextDropdownButton=null,this.counter=d.props.counter.default,this.counterCurrent=0,this.counterMaxLength=0,this.counterError=null,this.counterPosition=`bottom`,this.optionalTag=d.props.optionalTag.default,this.requiredTag=d.props.requiredTag.default,this.tagText=null,this.hasError=d.props.hasError.default,this.errorMessage=``,this.disabled=d.props.disabled.default,this.inline=d.props.inline.default,this.ariaDescribedby=void 0,this.hasFieldset=d.props.hasFieldset.default,this.layout=d.props.layout.default,this.role=null,this.useWrapper=d.props.useWrapper.default,this.size=`medium`,this.focusModality=new s.t(this)}updated(e){super.updated(e),this.classList.add(`pkt-inputwrapper`),this.classList.toggle(`pkt-inputwrapper--error`,this.hasError),this.classList.toggle(`pkt-inputwrapper--disabled`,this.disabled),this.classList.toggle(`pkt-inputwrapper--inline`,this.inline),this.classList.toggle(`pkt-inputwrapper--medium`,this.size===`medium`),this.classList.toggle(`pkt-inputwrapper--small`,this.size===`small`),this.classList.toggle(`pkt-inputwrapper--xsmall`,this.size===`xsmall`),this.role?this.setAttribute(`aria-labelledby`,`${this.forId}-label`):this.removeAttribute(`aria-labelledby`)}render(){let r=`pkt-tag pkt-tag--small pkt-tag--thin-text`,o=!!this.helptext||this.hasSlotContent(`helptext`),s=new Set([this.ariaDescribedby||(o?`${this.forId}-helptext`:``),this.hasError&&this.errorMessage?`${this.forId}-error`:``].join(` `).split(` `).filter(Boolean)),c=s.size?[...s].join(` `):e.h,d=this.pktStrings.get(`forms`),f=()=>e._`
|
|
2
2
|
${this.tagText?e._`<span class=${r+` pkt-tag--gray`}>${this.tagText}</span>`:e.h}
|
|
3
3
|
${this.optionalTag?e._`<span class=${r+` pkt-tag--blue-light`}
|
|
4
4
|
>${this.optionalText??d.optional}</span
|
|
@@ -51,9 +51,9 @@ const e=require("./element-BOmr9YLv.cjs"),t=require("./format-B8meU8Tm.cjs"),n=r
|
|
|
51
51
|
${p()}
|
|
52
52
|
${m()}
|
|
53
53
|
${this.counterPosition===`top`?h():e.h}
|
|
54
|
-
<div class
|
|
54
|
+
<div class=${this.optionsClass()}>${n.i(this)}</div>
|
|
55
55
|
${this.counterPosition===`bottom`?h():e.h}
|
|
56
56
|
${g()}
|
|
57
57
|
`;return this.hasFieldset?e._`<fieldset class="pkt-inputwrapper__fieldset" aria-describedby="${c}">
|
|
58
58
|
${_()}
|
|
59
|
-
</fieldset>`:e._`<div class="pkt-inputwrapper__fieldset">${_()}</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.n([e.u({type:String})],f.prototype,`forId`,void 0),e.n([e.u({type:String})],f.prototype,`label`,void 0),e.n([e.u({type:String})],f.prototype,`helptext`,void 0),e.n([e.u({type:String})],f.prototype,`helptextDropdown`,void 0),e.n([e.u({type:String})],f.prototype,`helptextDropdownButton`,void 0),e.n([e.u({type:Boolean})],f.prototype,`counter`,void 0),e.n([e.u({type:Number})],f.prototype,`counterCurrent`,void 0),e.n([e.u({type:Number})],f.prototype,`counterMaxLength`,void 0),e.n([e.u({type:String})],f.prototype,`counterError`,void 0),e.n([e.u({type:String,reflect:!1})],f.prototype,`counterPosition`,void 0),e.n([e.u({type:Boolean})],f.prototype,`optionalTag`,void 0),e.n([e.u({type:String})],f.prototype,`optionalText`,void 0),e.n([e.u({type:Boolean})],f.prototype,`requiredTag`,void 0),e.n([e.u({type:String})],f.prototype,`requiredText`,void 0),e.n([e.u({type:String})],f.prototype,`tagText`,void 0),e.n([e.u({type:Boolean})],f.prototype,`hasError`,void 0),e.n([e.u({type:String})],f.prototype,`errorMessage`,void 0),e.n([e.u({type:Boolean})],f.prototype,`disabled`,void 0),e.n([e.u({type:Boolean})],f.prototype,`inline`,void 0),e.n([e.u({type:String})],f.prototype,`ariaDescribedby`,void 0),e.n([e.u({type:Boolean})],f.prototype,`hasFieldset`,void 0),e.n([e.u({type:String,reflect:!0})],f.prototype,`role`,void 0),e.n([e.u({type:Boolean,reflect:!0,converter:r.t})],f.prototype,`useWrapper`,void 0),e.n([e.u({type:String,attribute:`input-wrapper-size`})],f.prototype,`size`,void 0);try{e.d(`pkt-input-wrapper`)(f)}catch{console.warn(`Forsøker å definere <pkt-input-wrapper>, men den er allerede definert`)}var p=f;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return p}});
|
|
59
|
+
</fieldset>`:e._`<div class="pkt-inputwrapper__fieldset">${_()}</div>`}optionsClass(){return!this.hasFieldset&&this.layout!==`horizontal`?`pkt-contents`:this.layout===`horizontal`?`pkt-inputwrapper__options pkt-inputwrapper__options--horizontal`:`pkt-inputwrapper__options`}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.n([e.u({type:String})],f.prototype,`forId`,void 0),e.n([e.u({type:String})],f.prototype,`label`,void 0),e.n([e.u({type:String})],f.prototype,`helptext`,void 0),e.n([e.u({type:String})],f.prototype,`helptextDropdown`,void 0),e.n([e.u({type:String})],f.prototype,`helptextDropdownButton`,void 0),e.n([e.u({type:Boolean})],f.prototype,`counter`,void 0),e.n([e.u({type:Number})],f.prototype,`counterCurrent`,void 0),e.n([e.u({type:Number})],f.prototype,`counterMaxLength`,void 0),e.n([e.u({type:String})],f.prototype,`counterError`,void 0),e.n([e.u({type:String,reflect:!1})],f.prototype,`counterPosition`,void 0),e.n([e.u({type:Boolean})],f.prototype,`optionalTag`,void 0),e.n([e.u({type:String})],f.prototype,`optionalText`,void 0),e.n([e.u({type:Boolean})],f.prototype,`requiredTag`,void 0),e.n([e.u({type:String})],f.prototype,`requiredText`,void 0),e.n([e.u({type:String})],f.prototype,`tagText`,void 0),e.n([e.u({type:Boolean})],f.prototype,`hasError`,void 0),e.n([e.u({type:String})],f.prototype,`errorMessage`,void 0),e.n([e.u({type:Boolean})],f.prototype,`disabled`,void 0),e.n([e.u({type:Boolean})],f.prototype,`inline`,void 0),e.n([e.u({type:String})],f.prototype,`ariaDescribedby`,void 0),e.n([e.u({type:Boolean})],f.prototype,`hasFieldset`,void 0),e.n([e.u({type:String})],f.prototype,`layout`,void 0),e.n([e.u({type:String,reflect:!0})],f.prototype,`role`,void 0),e.n([e.u({type:Boolean,reflect:!0,converter:r.t})],f.prototype,`useWrapper`,void 0),e.n([e.u({type:String,attribute:`input-wrapper-size`})],f.prototype,`size`,void 0);try{e.d(`pkt-input-wrapper`)(f)}catch{console.warn(`Forsøker å definere <pkt-input-wrapper>, men den er allerede definert`)}var p=f;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return p}});
|