@oslokommune/punkt-elements 13.5.3 → 13.5.5

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.
@@ -150,6 +150,16 @@ export class PktSelect extends PktInputElement implements IPktSelect {
150
150
 
151
151
  update(changedProperties: PropertyValues) {
152
152
  super.update(changedProperties)
153
+ if (changedProperties.has('options')) {
154
+ this._options = this.options
155
+ this.requestUpdate('_options')
156
+
157
+ // If no value is set and we have options, set to first option
158
+ if (!this.value && this._options.length > 0) {
159
+ this.value = this._options[0].value
160
+ this.selectedIndex = 0
161
+ }
162
+ }
153
163
  if (changedProperties.has('value') && this.value !== changedProperties.get('value')) {
154
164
  this.selectedIndex = this.touched
155
165
  ? this.returnNumberOrNull(this.inputRef.value?.selectedIndex)
@@ -230,18 +240,19 @@ export class PktSelect extends PktInputElement implements IPktSelect {
230
240
  }}
231
241
  ${ref(this.inputRef)}
232
242
  >
233
- ${this._options.length > 0 &&
234
- this._options.map(
235
- (option) =>
236
- html`<option
237
- value=${option.value}
238
- ?selected=${this.value == option.value || option.selected}
239
- ?disabled=${option.disabled}
240
- ?hidden=${option.hidden}
241
- >
242
- ${option.label}
243
- </option>`,
244
- )}
243
+ ${this._options.length > 0
244
+ ? this._options.map(
245
+ (option) =>
246
+ html`<option
247
+ value=${option.value}
248
+ ?selected=${this.value == option.value || option.selected}
249
+ ?disabled=${option.disabled}
250
+ ?hidden=${option.hidden}
251
+ >
252
+ ${option.label}
253
+ </option>`,
254
+ )
255
+ : ''}
245
256
  </select>
246
257
  <div class="pkt-contents" ${ref(this.helptextSlot)} name="helptext" slot="helptext"></div>
247
258
  </pkt-input-wrapper>