@oslokommune/punkt-elements 13.5.9 → 13.5.11

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.
@@ -179,44 +179,25 @@ export class PktDatepicker extends PktInputElement {
179
179
  }
180
180
 
181
181
  valueChanged(newValue: string | null, oldValue: string | null): void {
182
- if (newValue !== oldValue) {
183
- let validatedValue: string[] = []
184
-
185
- if (newValue) {
186
- // Handle case where newValue might be a string or need conversion
187
- if (typeof newValue === 'string') {
188
- validatedValue = newValue.split(',').filter(Boolean)
189
- } else {
190
- // If not a string, convert to string first
191
- validatedValue = String(newValue).split(',').filter(Boolean)
192
- }
193
- }
194
-
195
- // Validate dates against min/max boundaries
196
- if (this.min || this.max) {
197
- const minDate = this.min ? new Date(this.min) : null
198
- const maxDate = this.max ? new Date(this.max) : null
199
-
200
- validatedValue = validatedValue.filter((dateStr) => {
201
- const date = new Date(dateStr)
202
- if (isNaN(date.getTime())) return false
203
- if (minDate && date < minDate) return false
204
- if (maxDate && date > maxDate) return false
205
- return true
206
- })
182
+ if (newValue === oldValue) return
183
+
184
+ let parsedValue: string[] = []
185
+ if (newValue) {
186
+ if (typeof newValue === 'string') {
187
+ parsedValue = newValue.split(',').filter(Boolean)
188
+ } else {
189
+ parsedValue = String(newValue).split(',').filter(Boolean)
207
190
  }
191
+ }
208
192
 
209
- this._value = validatedValue
210
-
211
- // Update the public value property to reflect validated value
212
- const validatedValueString = validatedValue.join(',')
213
- if (this._valueProperty !== validatedValueString) {
214
- this._valueProperty = validatedValueString
215
- }
193
+ this._value = parsedValue
216
194
 
217
- // Call base class valueChanged to handle events properly
218
- super.valueChanged(validatedValueString, oldValue)
195
+ const parsedValueString = parsedValue.join(',')
196
+ if (this._valueProperty !== parsedValueString) {
197
+ this._valueProperty = parsedValueString
219
198
  }
199
+
200
+ super.valueChanged(parsedValueString, oldValue)
220
201
  }
221
202
 
222
203
  attributeChangedCallback(name: string, _old: string | null, value: string | null): void {
@@ -79,39 +79,31 @@ describe('PktDatepicker', () => {
79
79
  }
80
80
  })
81
81
 
82
- test('validates dates against earliest/latest boundaries', async () => {
83
- const container = await createDatepicker('min="2024-06-10" max="2024-06-20"')
82
+ test.each`
83
+ description | value | expectedRangeUnderflow | expectedValid
84
+ ${'Test date before min - component should mark it invalid'} | ${'2024-06-05'} | ${true} | ${false}
85
+ ${'Test date after max - component should mark it invalid'} | ${'2024-06-25'} | ${false} | ${false}
86
+ ${'Test valid date - should be accepted and marked valid'} | ${'2024-06-15'} | ${false} | ${true}
87
+ `(
88
+ 'validates dates against earliest/latest boundaries - $description',
89
+ async ({ value, expectedRangeUnderflow, expectedValid }) => {
90
+ const container = await createDatepicker('min="2024-06-10" max="2024-06-20"')
84
91
 
85
- const datepicker = container.querySelector('pkt-datepicker') as PktDatepicker
86
- await datepicker.updateComplete
87
-
88
- const input = datepicker.querySelector('input') as HTMLInputElement
89
-
90
- // Test date before min - component should filter it out
91
- datepicker.value = '2024-06-05'
92
- await datepicker.updateComplete
93
-
94
- // Component should reject invalid date (filter it out)
95
- expect(datepicker.value).toBe('')
96
- expect(input.value).toBe('')
97
-
98
- // Test date after max - component should filter it out
99
- datepicker.value = '2024-06-25'
100
- await datepicker.updateComplete
92
+ const datepicker = container.querySelector('pkt-datepicker') as PktDatepicker
93
+ await datepicker.updateComplete
101
94
 
102
- // Component should reject invalid date (filter it out)
103
- expect(datepicker.value).toBe('')
104
- expect(input.value).toBe('')
95
+ const input = datepicker.querySelector('input') as HTMLInputElement
105
96
 
106
- // Test valid date - should be accepted
107
- datepicker.value = '2024-06-15'
108
- await datepicker.updateComplete
97
+ datepicker.value = value
98
+ await datepicker.updateComplete
109
99
 
110
- // Valid date should be accepted
111
- expect(datepicker.value).toBe('2024-06-15')
112
- expect(input.value).toBe('2024-06-15')
113
- expect(input.validity.valid).toBe(true)
114
- })
100
+ expect(datepicker.value).toBe(value)
101
+ expect(input.value).toBe(value)
102
+ expect(datepicker._value).toEqual([value])
103
+ expect(input.validity.rangeUnderflow).toBe(expectedRangeUnderflow)
104
+ expect(input.validity.valid).toBe(expectedValid)
105
+ },
106
+ )
115
107
  })
116
108
 
117
109
  describe('Error handling and edge cases', () => {
@@ -1,116 +0,0 @@
1
- "use strict";const a=require("./element-6DBpyGQm.cjs"),c=require("./if-defined-Cni-RHLS.cjs"),d=require("./state-DPobt-Yz.cjs"),r=require("./ref-iJtiv3o2.cjs"),O=require("./class-map-BBG2gMX4.cjs"),$=require("./repeat-CDsZqct8.cjs"),I=require("./input-element-C4xJoM-X.cjs"),y=require("./pkt-options-controller-CiuBG6Lt.cjs"),w=require("./pkt-slot-controller-BzddBp7z.cjs");require("./input-wrapper-CZ-a00V7.cjs");require("./icon-B_ryAy4Q.cjs");require("./tag-Bbs0U_Au.cjs");require("./listbox-C4supLfR.cjs");const C={displayValueAs:{default:"label"}},V={props:C};var R=Object.defineProperty,S=Object.getOwnPropertyDescriptor,o=(v,e,t,i)=>{for(var s=i>1?void 0:i?S(e,t):e,l=v.length-1,h;l>=0;l--)(h=v[l])&&(s=(i?h(e,t,s):h(s))||s);return i&&s&&R(e,t,s),s};exports.PktCombobox=class extends I.PktInputElement{constructor(){super(),this.helptextSlot=r.e(),this.value="",this.options=[],this.defaultOptions=[],this.allowUserInput=!1,this.typeahead=!1,this.includeSearch=!1,this.searchPlaceholder="",this.multiple=!1,this.maxlength=null,this.displayValueAs=V.props.displayValueAs.default,this.tagPlacement=null,this._options=[],this._isOptionsOpen=!1,this._value=[],this._userInfoMessage="",this._addValueText=null,this._maxIsReached=!1,this._search="",this._inputFocus=!1,this._editingSingleValue=!1,this.inputRef=r.e(),this.arrowRef=r.e(),this.listboxRef=r.e(),this.focusRef=r.e(),this.optionTagRef=r.e(),this.optionsController=new y.PktOptionsSlotController(this),this.slotController=new w.PktSlotController(this,this.helptextSlot),this.slotController.skipOptions=!0}connectedCallback(){var e;if(super.connectedCallback(),document&&document.body.addEventListener("click",t=>{this._isOptionsOpen&&!this.contains(t.target)&&this.handleFocusOut(t)}),this._options=[],this.defaultOptions&&this.defaultOptions.length){const t=((e=this.options)==null?void 0:e.filter(i=>i.userAdded))||[];this.options=[...t,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=[...this.options]}if(this.optionsController.nodes.length){const t=[];this.optionsController.nodes.forEach(i=>{if(!i.textContent&&!i.getAttribute("value"))return null;const s={value:i.getAttribute("value")||i.textContent||"",label:i.textContent||i.getAttribute("value")||""};i.getAttribute("data-prefix")&&(s.prefix=i.getAttribute("data-prefix")||void 0),i.getAttribute("tagskincolor")&&(s.tagSkinColor=i.getAttribute("tagskincolor")),i.getAttribute("description")&&(s.description=i.getAttribute("description")||void 0),s.fulltext=s.value+s.label+(s.prefix||""),t.push(s)}),t.length&&(this.options=[...t],this._options=[...t])}}updated(e){var t;if(e.has("_value")&&this.valueChanged(this._value,e.get("_value")),e.has("value")&&(Array.isArray(this.value)?this._value=this.value:this.value&&this.multiple?this._value=this.value.split(","):this.value?this._value=[this.value]:this._value=[],!this.multiple&&this._value.length>1&&(this._value=[this._value[0]]),this.isMaxItemsReached()),e.has("defaultOptions")&&this.defaultOptions.length){const i=((t=this.options)==null?void 0:t.filter(s=>s.userAdded))||[];this.options=[...i,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=[...this.options]}if(e.has("options")){const s=this._options.filter(l=>l.userAdded).filter(l=>!this.options.some(h=>h.value===l.value));this._options=[...s,...this.options],this._options.forEach(l=>{if(l.value&&!l.label&&(l.label=l.value),l.selected&&!this._value.includes(l.value)){const h=[...this._value];this._value=[...this._value,l.value],this.valueChanged(this._value,h)}l.fulltext=l.value+l.label+(l.prefix||""),l.selected=l.selected||this._value.includes(l.value)})}e.has("_search")&&this.dispatchEvent(new CustomEvent("search",{detail:this._search,bubbles:!1})),super.updated(e)}attributeChangedCallback(e,t,i){e==="value"&&(Array.isArray(this.value)?this._value=this.value:this.value&&this.multiple?this._value=this.value.split(","):this.value?this._value=[this.value]:this._value=[],!this.multiple&&this._value.length>1&&(this._value=[this._value[0]])),e==="options"&&(this._options=this.options,this._options.forEach(s=>{s.value&&!s.label&&(s.label=s.value),s.selected&&!this._value.includes(s.value)&&(this._value=[...this._value,s.value]),s.fulltext=s.value+s.label+(s.prefix||"")}),this._search=""),super.attributeChangedCallback(e,t,i)}render(){return a.x`
2
- <pkt-input-wrapper
3
- .label=${this.label}
4
- .helptext=${this.helptext}
5
- .helptextDropdown=${c.o(this.helptextDropdown)}
6
- .helptextDropdownButton=${c.o(this.helptextDropdownButton)}
7
- ?fullwidth=${this.fullwidth}
8
- ?hasError=${this.hasError}
9
- ?inline=${this.inline}
10
- ?disabled=${this.disabled}
11
- .errorMessage=${this.errorMessage}
12
- ?optionalTag=${this.optionalTag}
13
- .optionalText=${this.optionalText}
14
- ?requiredTag=${this.requiredTag}
15
- .requiredText=${this.requiredText}
16
- .tagText=${this.tagText}
17
- ?useWrapper=${this.useWrapper}
18
- .forId=${this.allowUserInput||this.typeahead?this.id+"-input":this.id+"-arrow"}
19
- class="pkt-combobox__wrapper"
20
- @labelClick=${this.handleInputClick}
21
- >
22
- <div class="pkt-contents" ${r.n(this.helptextSlot)} name="helptext" slot="helptext"></div>
23
- <div class="pkt-combobox" @focusout=${this.handleFocusOut}>
24
- <div
25
- class=${O.e({"pkt-combobox__input":!0,"pkt-combobox__input--fullwidth":this.fullwidth,"pkt-combobox__input--open":this._isOptionsOpen,"pkt-combobox__input--error":this.hasError,"pkt-combobox__input--disabled":this.disabled})}
26
- tabindex="-1"
27
- @click=${this.handleInputClick}
28
- >
29
- ${this.placeholder&&(!this._value.length||this.multiple&&this.tagPlacement=="outside")&&!this._inputFocus?a.x`<span class="pkt-combobox__placeholder">${this.placeholder}</span>`:this.tagPlacement!=="outside"?this.renderSingleOrMultipleValues():a.E}
30
- ${this.renderInputField()}
31
- <div
32
- class="pkt-btn pkt-btn--tertiary pkt-combobox__arrow"
33
- @click=${this.handleArrowClick}
34
- @keydown=${this.handleArrowClick}
35
- id="${this.id}-arrow"
36
- ${r.n(this.arrowRef)}
37
- aria-expanded=${this._isOptionsOpen}
38
- aria-controls="${this.id}-listbox"
39
- aria-haspopup="listbox"
40
- aria-label="Åpne liste"
41
- ?disabled=${this.disabled}
42
- ?data-disabled=${this.disabled}
43
- role="button"
44
- tabindex="${this.disabled?"-1":"0"}"
45
- >
46
- <pkt-icon
47
- class=${O.e({"pkt-combobox__arrow-icon":!0,"pkt-combobox__arrow-icon--open":this._isOptionsOpen})}
48
- name="chevron-thin-down"
49
- ></pkt-icon>
50
- </div>
51
- <div ${r.n(this.focusRef)} tabindex="-1" @keydown=${this.handleArrowClick}></div>
52
- </div>
53
-
54
- <pkt-listbox
55
- id="${this.id}-listbox"
56
- .options=${this._options}
57
- .isOpen=${this._isOptionsOpen}
58
- .searchPlaceholder=${this.searchPlaceholder}
59
- .label="Liste: ${this.label||""}"
60
- ?includeSearch=${this.includeSearch}
61
- ?isMultiSelect=${this.multiple}
62
- ?allowUserInput=${this.allowUserInput&&!this._maxIsReached}
63
- ?maxIsReached=${this._maxIsReached}
64
- .customUserInput=${c.o(this._addValueText)}
65
- .userMessage=${this._userInfoMessage}
66
- @search=${this.handleSearch}
67
- @option-toggle=${this.handleOptionToggled}
68
- @select-all=${this.addAllOptions}
69
- @close-options=${()=>this._isOptionsOpen=!1}
70
- .searchValue=${this._search||null}
71
- .maxLength=${this.maxlength||0}
72
- ${r.n(this.listboxRef)}
73
- ></pkt-listbox>
74
- </div>
75
-
76
- ${this.tagPlacement==="outside"&&this.multiple?a.x`<div class="pkt-combobox__tags-outside">
77
- ${this.renderSingleOrMultipleValues()}
78
- </div>`:a.E}
79
- </pkt-input-wrapper>
80
- `}renderInputField(){return this.typeahead||this.allowUserInput?a.x`
81
- <div class="pkt-combobox__input-div combobox__input">
82
- <input
83
- type="text"
84
- id="${this.id}-input"
85
- name=${(this.name||this.id)+"-input"}
86
- @input=${this.handleInput}
87
- @keydown=${this.handleInputKeydown}
88
- @focus=${this.handleFocus}
89
- @blur=${this.handleBlur}
90
- autocomplete="off"
91
- role="combobox"
92
- aria-label=${c.o(this.label)}
93
- aria-autocomplete=${this.typeahead?"both":"list"}
94
- aria-controls="${this.id}-listbox"
95
- aria-multiselectable=${c.o(this.multiple?"true":void 0)}
96
- aria-activedescendant=${c.o(this._value[0]&&this.findValueInOptions(this._value[0])?`${this.id}-listbox-${this.findIndexInOptions(this._value[0])}`:void 0)}
97
- ${r.n(this.inputRef)}
98
- />
99
- </div>
100
- `:a.x`
101
- <input
102
- type="hidden"
103
- id="${this.id}-input"
104
- name=${(this.name||this.id)+"-input"}
105
- .value=${this._value.join(",")}
106
- ${r.n(this.inputRef)}
107
- />
108
- `}renderSingleOrMultipleValues(){const e=!this.multiple,t=this._editingSingleValue?null:this.renderValueTag(this.findValueInOptions(this._value[0])),i=$.c(this._value,s=>s,s=>{var n;const l=this.findValueInOptions(s),h=(n=this.options.find(u=>u.value===s))==null?void 0:n.tagSkinColor;return a.x`
109
- <pkt-tag
110
- skin=${h||"blue-dark"}
111
- ?closeTag=${!this.disabled}
112
- @close=${()=>this.handleTagRemove(s)}
113
- >
114
- ${this.renderValueTag(l)}
115
- </pkt-tag>
116
- `});return e?t:i}renderValueTag(e){if(!e)return"";switch(this.displayValueAs){case"prefixAndValue":return a.x`<span data-focusfix=${this.id}>${e.prefix||""} ${e.value}</span>`;case"value":return a.x`<span data-focusfix=${this.id}>${e.value}</span>`;case"label":default:return a.x`<span data-focusfix=${this.id}>${e.label||e.value}</span>`}}handleInput(e){if(e.stopPropagation(),e.stopImmediatePropagation(),this.disabled)return;this.touched=!0;const t=e.target;if(this._search=t.value,this.checkForMatches(),this.typeahead)if(this._search){if(this._options=this.options.filter(i=>{var s;return(s=i.fulltext)==null?void 0:s.toLowerCase().includes(this._search.toLowerCase())}),e.inputType!=="deleteContentBackward"){const i=this._options.filter(s=>{var l;return!s.selected&&((l=s.label)==null?void 0:l.toLowerCase().startsWith(this._search.toLowerCase()))});if(i.length>0&&this.inputRef.value&&this.inputRef.value.type!=="hidden"){const s=i[0];s!=null&&s.label&&(t.value=s.label,window.setTimeout(()=>t.setSelectionRange(this._search.length,t.value.length),0),t.selectionDirection="backward")}}}else this._options=[...this.options]}handleFocus(){if(!this.disabled){if(!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!=="hidden"){const e=this.findValueInOptions(this._value[0]);this._editingSingleValue=!0,this.inputRef.value.value=this.displayValueAs==="label"&&(e!=null&&e.label)?e.label:this._value[0]}this._inputFocus=!0,this._search="",this._options=[...this.options],this._isOptionsOpen=!0,this.onFocus(),this.requestUpdate()}}handleFocusOut(e){var t,i,s,l,h;if(!this.disabled&&((i=(t=e.relatedTarget)==null?void 0:t.closest("pkt-combobox"))==null?void 0:i.id)!==this.id&&((l=(s=e.relatedTarget)==null?void 0:s.closest("pkt-combobox"))==null?void 0:l.id)!==this.id&&((h=e.target)==null?void 0:h.getAttribute("data-focusfix"))!==this.id&&e.relatedTarget!==this.focusRef.value&&e.relatedTarget!==this.inputRef.value&&e.relatedTarget!==this.arrowRef.value&&this._isOptionsOpen){if(this._inputFocus=!1,this._addValueText=null,this._userInfoMessage="",this._search="",this.inputRef.value&&this.inputRef.value.type!=="hidden"&&this.inputRef.value.value!==""){const n=this.inputRef.value.value,u=this.findValueInOptions(n);!this._value.includes(n)&&!u?this.allowUserInput?this.addNewUserValue(n):this.multiple||this.removeValue(this._value[0]):u&&!this._value.includes(u.value)&&this.setSelected(u.value),this.inputRef.value.value=""}this._isOptionsOpen=!1,this.onBlur()}}handleBlur(){this._inputFocus=!1,this._editingSingleValue=!1,this.onBlur()}handleInputClick(e){var t,i;this.disabled||(e.currentTarget&&e.currentTarget!==this.arrowRef.value&&((t=this.inputRef.value)==null?void 0:t.type)!=="hidden"?(i=this.inputRef.value)==null||i.focus():this.handleArrowClick(e))}handleArrowClick(e){var t,i;this.disabled||e instanceof KeyboardEvent&&e.key&&e.key!=="Enter"&&e.key!==" "&&e.key!=="ArrowDown"||(e.stopImmediatePropagation(),e.preventDefault(),this._isOptionsOpen=!this._isOptionsOpen,this._isOptionsOpen?(t=this.listboxRef.value)==null||t.focusFirstOrSelectedOption():(i=this.arrowRef.value)==null||i.focus())}handleOptionToggled(e){this.toggleValue(e.detail)}handleSearch(e){e.stopPropagation(),this._search=e.detail.toLowerCase()}handleInputKeydown(e){var t,i,s;switch(e.key){case",":this.multiple&&(e.preventDefault(),this.addValue());break;case"Enter":e.preventDefault(),this.addValue();break;case"Backspace":!this._search&&((t=this.inputRef.value)==null?void 0:t.type)==="hidden"&&this.removeLastValue(e);break;case"Tab":case"ArrowDown":e.shiftKey||((i=this.listboxRef.value)==null||i.focusFirstOrSelectedOption(),e.preventDefault());break;case"Escape":this._isOptionsOpen=!1,(s=this.arrowRef.value)==null||s.focus(),e.preventDefault();break}}handleTagRemove(e){this.removeSelected(e)}blurInput(){this.inputRef.value&&this.inputRef.value.matches(":focus")&&this.inputRef.value.blur()}checkForMatches(){var h;const e=((h=this.inputRef.value)==null?void 0:h.value)||this._search||"",t=e.trim().toLowerCase()||"";if(!t){!this.multiple&&this._value[0]&&this.removeValue(this._value[0]),this.resetComboboxInput(!1);return}const i=this._value.find(n=>n.toLowerCase()===t),s=this._options.filter(n=>{var u;return((u=n.label)==null?void 0:u.toLowerCase().includes(t))??!1}),l=s.find(n=>{var u;return((u=n.label)==null?void 0:u.toLowerCase())===t||n.value.toLowerCase()===t});switch(!0){case((s.length===0||!l)&&this.allowUserInput):this._addValueText=e,this._userInfoMessage="";break;case(s.length===0&&!this.allowUserInput):this._addValueText=null,this._userInfoMessage="Ingen match i søket";break;case!!i:this._addValueText=null,this._userInfoMessage="Verdien er allerede valgt";break;case s.length>1:this._addValueText=null,this._userInfoMessage="";break;default:this._addValueText=null,this._userInfoMessage=""}}findValueInOptions(e){return this.options.find(t=>t.value===e||t.label===e)||null}findIndexInOptions(e){return this._options.findIndex(t=>t.value===e||t.label===e)}isMaxItemsReached(){const e=this.maxlength!==null&&this._value.length>=this.maxlength;return e?this._maxIsReached=!0:this._maxIsReached=!1,e}toggleValue(e){var g,k;if(this.disabled)return;this.touched=!0,this._userInfoMessage="",this._addValueText=null;const t=((g=this.findValueInOptions(e))==null?void 0:g.value)||null,i=this._value.includes(e||t||""),s=!!t,l=((k=this._options.find(_=>_.value===e))==null?void 0:k.disabled)||!1,h=!(e!=null&&e.trim()),n=!this.multiple,u=this.multiple,x=this.isMaxItemsReached();let p=!1,f=!0,b="",m="";l||(!s&&this.allowUserInput&&!h?(this.addNewUserValue(e),b="Ny verdi lagt til",p=!u):!s&&!this.allowUserInput?(n&&this._value[0]&&this.removeValue(this._value[0]),f=!1,p=!0,b="Ingen treff i søket"):i?(this.removeValue(t),p=!0):h&&n?(this.removeAllSelected(),p=!0):n?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t),p=!1,this.inputRef.value&&this.inputRef.value.type!=="hidden"&&(this.inputRef.value.value="",this.inputRef.value.blur())):u&&!x?(this.setSelected(t),p=!0):u&&x?(this._userInfoMessage="Maks antall valg nådd",f=!1,m=e):(n&&this.removeAllSelected(),this._userInfoMessage="Ingen gyldig verdi valgt",f=!1,p=!0,m=e),this._isOptionsOpen=p,p||window.setTimeout(()=>{var _;(_=this.focusRef.value)==null||_.focus()},0),this._userInfoMessage=b,this._search=m||"",this.resetComboboxInput(f),u&&this.isMaxItemsReached())}setSelected(e){if(!this._value.includes(e)){if(this.multiple&&this.isMaxItemsReached()){this._userInfoMessage="Maks antall valg nådd";return}!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,this._options=this._options.map(t=>(t.value===e&&(t.selected=!0),t)),this.resetComboboxInput(!0)}}removeSelected(e){if(!e)return;this._value=this._value.filter(i=>i!==e);const t=this.findValueInOptions(e);t?(t.selected=!1,t.userAdded?(this._options=[...this._options.filter(i=>i.value!==e)],this.options=[...this.options.filter(i=>i.value!==e)]):this._options=[...this._options,t]):!e&&!this.multiple&&(this._options=this._options.map(i=>(i.selected=!1,i)))}addAllOptions(){if(this.multiple){if(this.maxlength&&this._options.length>this.maxlength){this._userInfoMessage="For mange valgt";return}this._value=this._options.map(e=>e.value),this._options=this._options.map(e=>(e.selected=!0,e)),this.requestUpdate()}}removeAllSelected(){this._value=[],this._options=this._options.map(e=>(e.selected=!1,e)),this._options=this._options.filter(e=>!e.userAdded),this.requestUpdate()}addValue(){var t;const e=((t=this.inputRef.value)==null?void 0:t.value.trim())||"";this._search=e,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],this._isOptionsOpen=!1,this.blurInput();else if(!this.findValueInOptions(e)){if(this.isMaxItemsReached())return;this._value=[...this._value,e]}const t={value:e,label:e,userAdded:!0};this.options=[t,...this.options],this._options=[t,...this._options],this.setSelected(e),this.requestUpdate()}resetComboboxInput(e=!0){if(this._addValueText=null,this.inputRef.value&&this.inputRef.value.type!=="hidden"&&e)if(this._search="",this.multiple)this.inputRef.value.value="";else{const t=this.findValueInOptions(this._value[0]);window.setTimeout(()=>{!this.inputRef.value||this.inputRef.value.type==="hidden"||(this.inputRef.value.value=this.displayValueAs==="label"&&(t!=null&&t.label)?t.label:this._value[0]||"")},0),this._userInfoMessage=""}this._options=[...this.options]}removeLastValue(e){if(this._value.length===0)return;e.preventDefault();const t=this._value[this._value.length-1];t&&this.removeSelected(t),this.isMaxItemsReached()}};o([a.n({type:String,reflect:!0})],exports.PktCombobox.prototype,"value",2);o([a.n({type:Array})],exports.PktCombobox.prototype,"options",2);o([a.n({type:Array})],exports.PktCombobox.prototype,"defaultOptions",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"allowUserInput",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"typeahead",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"includeSearch",2);o([a.n({type:String})],exports.PktCombobox.prototype,"searchPlaceholder",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"multiple",2);o([a.n({type:Number})],exports.PktCombobox.prototype,"maxlength",2);o([a.n({type:String})],exports.PktCombobox.prototype,"displayValueAs",2);o([a.n({type:String})],exports.PktCombobox.prototype,"tagPlacement",2);o([d.r()],exports.PktCombobox.prototype,"_options",2);o([d.r()],exports.PktCombobox.prototype,"_isOptionsOpen",2);o([d.r()],exports.PktCombobox.prototype,"_value",2);o([d.r()],exports.PktCombobox.prototype,"_userInfoMessage",2);o([d.r()],exports.PktCombobox.prototype,"_addValueText",2);o([d.r()],exports.PktCombobox.prototype,"_maxIsReached",2);o([d.r()],exports.PktCombobox.prototype,"_search",2);o([d.r()],exports.PktCombobox.prototype,"_inputFocus",2);o([d.r()],exports.PktCombobox.prototype,"_editingSingleValue",2);exports.PktCombobox=o([a.t("pkt-combobox")],exports.PktCombobox);