@oslokommune/punkt-elements 20.0.0 → 20.0.3
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 +12 -0
- package/dist/{card-njWrvrHm.cjs → card-BbV4OBqb.cjs} +1 -1
- package/dist/{card-DH1kPnyi.js → card-CKStAH0Q.js} +1 -1
- package/dist/{combobox-BwAxmoG9.cjs → combobox-CWL8T3UK.cjs} +1 -1
- package/dist/{combobox-H5FLG8BV.js → combobox-Pxa80TeZ.js} +1 -1
- package/dist/components/tag/tag.d.ts +3 -11
- package/dist/{datepicker-ZSwWg8xW.js → datepicker-BpxUWiIC.js} +5 -3
- package/dist/{datepicker-COar3rRT.cjs → datepicker-Cpiu_Nrf.cjs} +2 -2
- package/dist/{header-Bo8uvddg.js → header-ChT1hHNA.js} +1 -1
- package/dist/{header-DzYKgl-k.cjs → header-CiwHNHKD.cjs} +1 -1
- package/dist/{link-DZgG_8Ni.js → link-DLPpwjq4.js} +1 -0
- package/dist/{link-B7t4iOKk.cjs → link-pkFJ11Zd.cjs} +1 -1
- package/dist/pkt-card.cjs +1 -1
- package/dist/pkt-card.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-header.cjs +1 -1
- package/dist/pkt-header.js +1 -1
- package/dist/pkt-index.cjs +1 -1
- package/dist/pkt-index.js +14 -14
- package/dist/pkt-link.cjs +1 -1
- package/dist/pkt-link.js +1 -1
- package/dist/pkt-tabs.cjs +1 -1
- package/dist/pkt-tabs.js +1 -1
- package/dist/pkt-tag.cjs +1 -1
- package/dist/pkt-tag.js +1 -1
- package/dist/shared-types/index.d.ts +3 -2
- package/dist/shared-types/skin.d.ts +1 -10
- package/dist/shared-types/tag.d.ts +46 -0
- package/dist/{tabs-Dwk5PKzP.cjs → tabs-B96Orh6O.cjs} +1 -1
- package/dist/{tabs-Bu_-WfCK.js → tabs-BmmTUKuC.js} +1 -1
- package/dist/tag-BZdC0voc.cjs +27 -0
- package/dist/{tag-CkZ2Mn4a.js → tag-Cam7ISOF.js} +8 -97
- package/package.json +2 -2
- package/src/components/tag/tag.test.ts +6 -0
- package/src/components/tag/tag.ts +17 -23
- package/dist/tag-1SSexs0H.cjs +0 -27
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,18 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
|
|
|
5
5
|
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
+
## [20.1.0](https://github.com/oslokommune/punkt/compare/20.0.2...20.1.0) (2026-11-06)
|
|
9
|
+
|
|
10
|
+
### Bug Fixes
|
|
11
|
+
* Typesikre tag + textStyle overstyrer ikke lenger størrelse (#3815). `textStyle` overstyrte font-size på store tagger. `normal-text` og
|
|
12
|
+
`thin-text` satte 14px selv med `size="large"`. Nå setter `size` bare
|
|
13
|
+
`font-size` og `textStyle` bare `font-weight`, så store tags er 18px.
|
|
14
|
+
|
|
15
|
+
`textStyle` er nå `normal-text` som default i React og Elements.
|
|
16
|
+
|
|
17
|
+
---
|
|
18
|
+
|
|
19
|
+
|
|
8
20
|
## [20.0.0](https://github.com/oslokommune/punkt/compare/19.20.0...20.0.0) (2026-11-03)
|
|
9
21
|
|
|
10
22
|
### ⚠ BREAKING CHANGES
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs");require("./shared-types-BvRk9kiK.cjs"),require("./icon-5A378_yh.cjs")
|
|
1
|
+
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs");require("./shared-types-BvRk9kiK.cjs"),require("./icon-5A378_yh.cjs"),require("./tag-BZdC0voc.cjs");const i=require("./if-defined-Ci4ZQsgL.cjs");var a=[`gray`,`outlined`,`transparent`,`white`,`blue`,`green`,`beige`],o=[`white`,`blue`,`green`,`beige`],s={headingLevel:3,layout:`vertical`,skin:`gray`,tagPosition:`top`,openLinkInNewTab:!1,zoom:!1},c=class extends r.t{constructor(...e){super(...e),this.ariaLabel=``,this.metaLead=null,this.zoom=s.zoom,this.imageAspect=null,this.clickCardLink=null,this.metaTrail=null,this.layout=s.layout,this.heading=``,this.headingLevel=s.headingLevel,this.image={src:``,alt:``},this.openLinkInNewTab=s.openLinkInNewTab,this.skin=s.skin,this.subheading=``,this.tagPosition=`top`,this.tags=[]}connectedCallback(){super.connectedCallback()}render(){let n={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.layout}`]:this.layout,"pkt-card--clickable":!!this.clickCardLink,"pkt-card--zoom":this.zoom},r=this.ariaLabel?.trim()||(this.heading?`${this.heading} lenkekort`:`lenkekort`),a=this.ariaLabel?.trim()||(this.heading?this.heading:`kort`);return e._`
|
|
2
2
|
<article
|
|
3
3
|
class=${t.t(n)}
|
|
4
4
|
aria-label=${i.t(this.clickCardLink?r:a)}
|
|
@@ -4,8 +4,8 @@ import { n as o } from "./format-BTeSVkED.js";
|
|
|
4
4
|
import { i as s, t as c } from "./element-with-slot-mG-h7Sjw.js";
|
|
5
5
|
import "./shared-types-A6iGIX-f.js";
|
|
6
6
|
import "./icon-C1oCGwEe.js";
|
|
7
|
+
import "./tag-Cam7ISOF.js";
|
|
7
8
|
import { t as l } from "./if-defined-DiYi2v_Q.js";
|
|
8
|
-
import "./tag-CkZ2Mn4a.js";
|
|
9
9
|
//#region ../../shared-types/card.ts
|
|
10
10
|
var u = [
|
|
11
11
|
"gray",
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs");require("./icon-5A378_yh.cjs");const i=require("./input-wrapper-C_Rzwxx7.cjs"),a=require("./if-defined-Ci4ZQsgL.cjs"),o=require("./ref-B6p6mQkO.cjs");require("./tag-1SSexs0H.cjs");const s=require("./repeat-CjvNrcUr.cjs"),c=require("./listbox-HrH4JonS.cjs"),l=require("./input-element-2LHxo0em.cjs"),u=require("./pkt-options-controller-9zoH1OBW.cjs");var d={multiple:!1,typeahead:!1,includeSearch:!1,allowUserInput:!1,displayValueAs:`label`,inputSize:`medium`,disabled:!1,hasError:!1,required:!1,requiredTag:!1,optionalTag:!1,fullwidth:!1,inline:!1,useWrapper:!0},f=(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}},p=(e,t,n,r,i)=>{if(!e)return{action:`none`,value:null};let a=c.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}},m=(e,t,n,r,i)=>e.trim().toLowerCase()?{...c.c(e,t,n,r),shouldRemoveValue:!1,shouldResetInput:!1}:{addValueText:null,userInfoMessage:``,shouldRemoveValue:!i&&!!t[0],shouldResetInput:!0},h=(e,t,n)=>{let r=c.i(t,e);return n===`label`&&r?.label?r.label:e},g={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)}},_={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=c.r(n),t.push(n)}),t}},v={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=c.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]}},y=class extends l.t{constructor(){super(),this.value=``,this.options=[],this.defaultOptions=[],this.allowUserInput=d.allowUserInput,this.typeahead=d.typeahead,this.includeSearch=d.includeSearch,this.searchPlaceholder=null,this.multiple=d.multiple,this.maxlength=null,this.displayValueAs=d.displayValueAs,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=o.t(),this.triggerRef=o.t(),this.listboxRef=o.t(),this._pendingDispatchFrom=null,this.optionsController=new u.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=c.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=c.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,s=this.multiple,l=c.l(this._value.length,this.maxlength),u=!1,d=!0,f=``,p=null,m=``;i||(!r&&this.allowUserInput&&!a?(this.addNewUserValue(e),f=`valueAdded`,u=s):!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?h(t||``,this.options,this.displayValueAs):c.s(c.i(this.options,t),this.displayValueAs)):s&&!l?(this.setSelected(t),u=!0):s&&l?(f=`maxSelected`,d=!1,m=e):(o&&this.removeAllSelected(),f=`noValidValue`,d=!1,u=!0,m=e),this._isOptionsOpen=u,u||window.setTimeout(()=>{this.focusAfterCommit()},0),this._search=m||``,this.resetComboboxInput(d),this._userInfoMessage=f,this._messageValue=p,s&&this.updateMaxReached())}setSelected(e){this._value.includes(e)||(this.multiple&&c.l(this._value.length,this.maxlength)?this._userInfoMessage=`maxSelected`:(!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,g.markOptionSelected(this._options,e),this.resetComboboxInput(!0)))}removeSelected(e){if(!e)return;this._value=this._value.filter(t=>t!==e);let t=c.i(this.options,e);t&&(g.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(){this.multiple&&(this.maxlength&&this._options.length>this.maxlength?this._userInfoMessage=`tooManySelected`:(this._value=this._options.map(e=>e.value),g.markAllSelected(this._options),this.requestUpdate()))}removeAllSelected(){this._value=[],g.markAllDeselected(this._options),this._options=g.removeUserAddedOptions(this._options),this.requestUpdate()}addValue(){let e=this.inputRef.value?.value.trim()||``;this._search=e,e&&this._value.includes(e)?(this.resetComboboxInput(!0),this._userInfoMessage=`alreadySelected`):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(!c.i(this.options,e)){if(c.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=v.cloneOptions(this.options);e.forEach(e=>e.selected=this._value.includes(e.value)),this._options=v.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]?h(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}=c.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(){this.isDisabled||(this._skipInputTab=!1,this._suppressNextOpen?(this._suppressNextOpen=!1,this._inputFocus=!0,this.requestUpdate()):(!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=h(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=c.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}=p(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=h(this._value[0],this.options,this.displayValueAs):this.inputRef.value.value=``}this._isOptionsOpen=!1,this.onBlur()}handleBlur(){this._inputFocus=!1,this.onBlur()}handleInputClick(e){this.isDisabled?(e.preventDefault(),e.stopImmediatePropagation()):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=f(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();else 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=m(this.inputRef.value?.value||this._search||``,this._value,this.options,this.allowUserInput,this.multiple);e.shouldRemoveValue&&this.removeValue(this._value[0]),e.shouldResetInput?this.resetComboboxInput(!1):(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=v.cloneOptions(this.options)}if(this.optionsController?.nodes&&this.optionsController.nodes.length){let e=_.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=_.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=v.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=v.mergeWithUserAdded(v.cloneOptions(this.options),t,this._value);this._options=n,n.length>this.options.length&&(this.options=n);let r=v.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]?h(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.setFormValue(``),this.internals.ariaInvalid=`false`,this.requestUpdate()}attributeChangedCallback(e,t,n){if(e===`options`){this._options=v.cloneOptions(this.options);let e=v.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-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs");require("./icon-5A378_yh.cjs");const i=require("./input-wrapper-C_Rzwxx7.cjs");require("./tag-BZdC0voc.cjs");const a=require("./if-defined-Ci4ZQsgL.cjs"),o=require("./ref-B6p6mQkO.cjs"),s=require("./repeat-CjvNrcUr.cjs"),c=require("./listbox-HrH4JonS.cjs"),l=require("./input-element-2LHxo0em.cjs"),u=require("./pkt-options-controller-9zoH1OBW.cjs");var d={multiple:!1,typeahead:!1,includeSearch:!1,allowUserInput:!1,displayValueAs:`label`,inputSize:`medium`,disabled:!1,hasError:!1,required:!1,requiredTag:!1,optionalTag:!1,fullwidth:!1,inline:!1,useWrapper:!0},f=(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}},p=(e,t,n,r,i)=>{if(!e)return{action:`none`,value:null};let a=c.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}},m=(e,t,n,r,i)=>e.trim().toLowerCase()?{...c.c(e,t,n,r),shouldRemoveValue:!1,shouldResetInput:!1}:{addValueText:null,userInfoMessage:``,shouldRemoveValue:!i&&!!t[0],shouldResetInput:!0},h=(e,t,n)=>{let r=c.i(t,e);return n===`label`&&r?.label?r.label:e},g={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)}},_={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=c.r(n),t.push(n)}),t}},v={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=c.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]}},y=class extends l.t{constructor(){super(),this.value=``,this.options=[],this.defaultOptions=[],this.allowUserInput=d.allowUserInput,this.typeahead=d.typeahead,this.includeSearch=d.includeSearch,this.searchPlaceholder=null,this.multiple=d.multiple,this.maxlength=null,this.displayValueAs=d.displayValueAs,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=o.t(),this.triggerRef=o.t(),this.listboxRef=o.t(),this._pendingDispatchFrom=null,this.optionsController=new u.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=c.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=c.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,s=this.multiple,l=c.l(this._value.length,this.maxlength),u=!1,d=!0,f=``,p=null,m=``;i||(!r&&this.allowUserInput&&!a?(this.addNewUserValue(e),f=`valueAdded`,u=s):!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?h(t||``,this.options,this.displayValueAs):c.s(c.i(this.options,t),this.displayValueAs)):s&&!l?(this.setSelected(t),u=!0):s&&l?(f=`maxSelected`,d=!1,m=e):(o&&this.removeAllSelected(),f=`noValidValue`,d=!1,u=!0,m=e),this._isOptionsOpen=u,u||window.setTimeout(()=>{this.focusAfterCommit()},0),this._search=m||``,this.resetComboboxInput(d),this._userInfoMessage=f,this._messageValue=p,s&&this.updateMaxReached())}setSelected(e){this._value.includes(e)||(this.multiple&&c.l(this._value.length,this.maxlength)?this._userInfoMessage=`maxSelected`:(!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,g.markOptionSelected(this._options,e),this.resetComboboxInput(!0)))}removeSelected(e){if(!e)return;this._value=this._value.filter(t=>t!==e);let t=c.i(this.options,e);t&&(g.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(){this.multiple&&(this.maxlength&&this._options.length>this.maxlength?this._userInfoMessage=`tooManySelected`:(this._value=this._options.map(e=>e.value),g.markAllSelected(this._options),this.requestUpdate()))}removeAllSelected(){this._value=[],g.markAllDeselected(this._options),this._options=g.removeUserAddedOptions(this._options),this.requestUpdate()}addValue(){let e=this.inputRef.value?.value.trim()||``;this._search=e,e&&this._value.includes(e)?(this.resetComboboxInput(!0),this._userInfoMessage=`alreadySelected`):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(!c.i(this.options,e)){if(c.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=v.cloneOptions(this.options);e.forEach(e=>e.selected=this._value.includes(e.value)),this._options=v.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]?h(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}=c.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(){this.isDisabled||(this._skipInputTab=!1,this._suppressNextOpen?(this._suppressNextOpen=!1,this._inputFocus=!0,this.requestUpdate()):(!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=h(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=c.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}=p(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=h(this._value[0],this.options,this.displayValueAs):this.inputRef.value.value=``}this._isOptionsOpen=!1,this.onBlur()}handleBlur(){this._inputFocus=!1,this.onBlur()}handleInputClick(e){this.isDisabled?(e.preventDefault(),e.stopImmediatePropagation()):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=f(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();else 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=m(this.inputRef.value?.value||this._search||``,this._value,this.options,this.allowUserInput,this.multiple);e.shouldRemoveValue&&this.removeValue(this._value[0]),e.shouldResetInput?this.resetComboboxInput(!1):(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=v.cloneOptions(this.options)}if(this.optionsController?.nodes&&this.optionsController.nodes.length){let e=_.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=_.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=v.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=v.mergeWithUserAdded(v.cloneOptions(this.options),t,this._value);this._options=n,n.length>this.options.length&&(this.options=n);let r=v.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]?h(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.setFormValue(``),this.internals.ariaInvalid=`false`,this.requestUpdate()}attributeChangedCallback(e,t,n){if(e===`options`){this._options=v.cloneOptions(this.options);let e=v.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}
|
|
@@ -4,9 +4,9 @@ import { t as s } from "./format-BTeSVkED.js";
|
|
|
4
4
|
import { n as c } from "./element-with-slot-mG-h7Sjw.js";
|
|
5
5
|
import "./icon-C1oCGwEe.js";
|
|
6
6
|
import { r as l } from "./input-wrapper-DkpJS1hR.js";
|
|
7
|
+
import "./tag-Cam7ISOF.js";
|
|
7
8
|
import { t as u } from "./if-defined-DiYi2v_Q.js";
|
|
8
9
|
import { n as d, t as f } from "./ref-BAegS9BR.js";
|
|
9
|
-
import "./tag-CkZ2Mn4a.js";
|
|
10
10
|
import { t as p } from "./repeat-Cy1M16Di.js";
|
|
11
11
|
import { a as m, c as h, i as g, l as _, o as v, r as y, s as b } from "./listbox-DAvIBH4P.js";
|
|
12
12
|
import { t as x } from "./input-element-De40zUox.js";
|
|
@@ -1,19 +1,11 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
2
|
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
3
|
-
import {
|
|
3
|
+
import { IPktTagBase, THTMLButtonType, TTagSkin, TTagState, TTagTextStyle, TPktSizeBase } from '../../shared-types';
|
|
4
4
|
import { PktIconName } from '@oslokommune/punkt-assets/dist/icons/icon';
|
|
5
|
-
import { IPktStringsProps } from '../../shared-strings';
|
|
6
5
|
export type { TTagSkin, TTagState };
|
|
7
6
|
export type TTagType = THTMLButtonType;
|
|
8
|
-
export interface IPktTag extends
|
|
9
|
-
closeTag?: boolean;
|
|
10
|
-
size?: TPktSizeBase;
|
|
11
|
-
skin?: TTagSkin;
|
|
12
|
-
state?: TTagState | null;
|
|
13
|
-
textStyle?: string | null;
|
|
7
|
+
export interface IPktTag extends IPktTagBase {
|
|
14
8
|
iconName?: PktIconName;
|
|
15
|
-
type?: TTagType;
|
|
16
|
-
ariaLabel?: IAriaAttributes['aria-label'] | null;
|
|
17
9
|
}
|
|
18
10
|
export declare class PktTag extends PktElementWithSlot<IPktTag> implements IPktTag {
|
|
19
11
|
constructor();
|
|
@@ -24,7 +16,7 @@ export declare class PktTag extends PktElementWithSlot<IPktTag> implements IPktT
|
|
|
24
16
|
size: TPktSizeBase;
|
|
25
17
|
skin: TTagSkin;
|
|
26
18
|
state: TTagState | null;
|
|
27
|
-
textStyle:
|
|
19
|
+
textStyle: TTagTextStyle | null;
|
|
28
20
|
iconName: string | undefined;
|
|
29
21
|
type: TTagType;
|
|
30
22
|
ariaLabel: string | null;
|
|
@@ -3,11 +3,11 @@ import { t as c } from "./class-map-BDwVSgLb.js";
|
|
|
3
3
|
import { n as l } from "./element-with-slot-mG-h7Sjw.js";
|
|
4
4
|
import "./icon-C1oCGwEe.js";
|
|
5
5
|
import "./input-wrapper-DkpJS1hR.js";
|
|
6
|
+
import "./tag-Cam7ISOF.js";
|
|
6
7
|
import "./calendar-BOd-9PDd.js";
|
|
7
8
|
import { t as u } from "./if-defined-DiYi2v_Q.js";
|
|
8
9
|
import { n as d, t as f } from "./ref-BAegS9BR.js";
|
|
9
10
|
import { a as p, c as m, d as h, h as g, i as _, m as v, n as y, r as b, s as x, t as S, u as ee } from "./converters-CYgQrWVm.js";
|
|
10
|
-
import "./tag-CkZ2Mn4a.js";
|
|
11
11
|
import { t as te } from "./repeat-Cy1M16Di.js";
|
|
12
12
|
import { n as C, t as w } from "./utils-BwF4QSrq.js";
|
|
13
13
|
import { t as T } from "./input-element-De40zUox.js";
|
|
@@ -150,7 +150,8 @@ var D = {
|
|
|
150
150
|
type: "boolean",
|
|
151
151
|
reflect: !0,
|
|
152
152
|
default: !1,
|
|
153
|
-
category: "functionality"
|
|
153
|
+
category: "functionality",
|
|
154
|
+
exclusiveGroup: "selectionMode"
|
|
154
155
|
},
|
|
155
156
|
maxlength: {
|
|
156
157
|
name: "Maks antall datoer i flervalg",
|
|
@@ -163,7 +164,8 @@ var D = {
|
|
|
163
164
|
type: "boolean",
|
|
164
165
|
reflect: !0,
|
|
165
166
|
default: !1,
|
|
166
|
-
category: "functionality"
|
|
167
|
+
category: "functionality",
|
|
168
|
+
exclusiveGroup: "selectionMode"
|
|
167
169
|
},
|
|
168
170
|
showRangeLabels: {
|
|
169
171
|
attribute: "show-range-labels",
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./element-with-slot-CeKuRE3_.cjs");require("./icon-5A378_yh.cjs"),require("./input-wrapper-C_Rzwxx7.cjs"),require("./calendar-CDTCgTJn.cjs");const r=require("./if-defined-Ci4ZQsgL.cjs"),i=require("./ref-B6p6mQkO.cjs"),a=require("./converters-CW6SN0TT.cjs")
|
|
1
|
+
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./element-with-slot-CeKuRE3_.cjs");require("./icon-5A378_yh.cjs"),require("./input-wrapper-C_Rzwxx7.cjs"),require("./tag-BZdC0voc.cjs"),require("./calendar-CDTCgTJn.cjs");const r=require("./if-defined-Ci4ZQsgL.cjs"),i=require("./ref-B6p6mQkO.cjs"),a=require("./converters-CW6SN0TT.cjs"),o=require("./repeat-CjvNrcUr.cjs"),s=require("./utils-63cRpWut.cjs"),c=require("./input-element-2LHxo0em.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`}
|
|
@@ -9,7 +9,7 @@ const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),
|
|
|
9
9
|
<time datetime=${t}>${a.c(t,this.dateformat)}</time>
|
|
10
10
|
</pkt-tag>`):e.h}
|
|
11
11
|
</div>
|
|
12
|
-
`}};e.n([e.u({type:Array})],l.prototype,`dates`,void 0),e.n([e.u({type:String})],l.prototype,`dateformat`,void 0),e.n([e.u({type:String,attribute:`class`})],l.prototype,`className`,void 0),e.n([e.u({type:String,attribute:`id-base`})],l.prototype,`idBase`,void 0);try{e.d(`pkt-date-tags`)(l)}catch{console.warn(`Forsøker å definere <pkt-date-tags>, men den er allerede definert`)}var u={name:`pkt-datepicker`,react:`PktDatepicker`,"css-class":`pkt-datepicker`,isElement:!0,isPureReact:!0,"dark-mode":!0,props:{name:{type:`string`,name:`Navn for 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`},label:{type:`string`,name:`Tekst/label`,category:`contents`},helptext:{type:`string`,name:`Hjelpetekst`,category:`contents`},helptextDropdown:{type:`string`,name:`Utvidet hjelpetekst`,description:`Hjelpetekst som vises i en lukket boks man kan åpne`,category:`contents`},helptextDropdownButton:{type:`string`,name:`Knappetekst for utvidet hjelpetekst`,default:`Les mer`,category:`contents`},dateformat:{name:`Datoformat for tags i flervalg`,type:`string`,default:`dd.MM.yyyy`,category:`tech`},currentmonth:{name:`Måned som vises i datovelgeren`,type:`ISOdatestring`,category:`tech`},value:{name:`Verdi (kommaseparert ved flervalg)`,type:`ISOdatestring`,variant:`multiple`,category:`tech`},excludeweekdays:{name:`Utelat ukedager`,type:`string`,description:`Kommaseparert liste over ukedager (1-7) som skal ekskluderes`,category:`functionality`},excludedates:{name:`Utelat datoer (Kommaseparerte ISO-datoer)`,type:`ISOdatestring`,variant:`multiple`,category:`functionality`},min:{name:`Tidligst tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},max:{name:`Senest tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},weeknumbers:{name:`Vis ukenummer`,type:`boolean`,reflect:!0,default:!1,category:`ui`},withcontrols:{name:`Med velgere for måned/år`,type:`boolean`,reflect:!0,default:!1,category:`ui`},multiple:{name:`Flervalg`,type:`boolean`,reflect:!0,default:!1,category:`functionality`},maxlength:{name:`Maks antall datoer i flervalg`,type:`number`,category:`functionality`,showIf:{multiple:!0}},range:{name:`Datotidsrom (fra og til)`,type:`boolean`,reflect:!0,default:!1,category:`functionality`},showRangeLabels:{attribute:`show-range-labels`,name:`Vis fra/til-etiketter`,type:`boolean`,default:!1,category:`ui`,showIf:{range:!0}},today:{name:`Dagens dato (overstyring)`,type:`ISOdatestring`,description:`ISO-datostreng som overstyrer dagens dato i kalenderen. Nyttig for snapshot-tester.`,category:`tech`},calendarOpen:{attribute:`calendar-open`,name:`Kalender åpen`,type:`boolean`,reflect:!0,default:!1,category:`ui`},hasError:{type:`boolean`,name:`Feil`,default:!1,category:`ui`},errorMessage:{type:`string`,name:`Feilmelding ved feil`,category:`contents`},disabled:{type:`boolean`,name:`Deaktivert`,default:!1,reflect:!0,category:`tech`},fullwidth:{type:`boolean`,name:`Full bredde`,default:!1,reflect:!0,category:`ui`},inputSize:{attribute:`input-size`,name:`Størrelse`,description:`Størrelsen på komponenten`,type:[`medium`,`small`,`xsmall`],default:`medium`,category:`ui`},required:{type:`boolean`,name:`Påkrevd`,default:!1,reflect:!0,category:`tech`},requiredTag:{type:`boolean`,name:`Vise påkrevd-merking`,default:!1,category:`ui`},requiredText:{type:`string`,name:`Påkrevd-tekst`,default:`Må fylles ut`,category:`contents`},optionalTag:{type:`boolean`,name:`Vise valgfritt-merking`,default:!1,category:`ui`},optionalText:{type:`string`,name:`Valgfritt-tekst`,default:`Valgfritt`,category:`contents`},tagText:{type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},useWrapper:{type:`boolean`,name:`Bruk wrapper`,description:`Indikerer at feltet skal ha synlig label og hjelpetekst`,displayAsFalse:!0,default:!0,category:`ui`},id:{type:`string`,name:`ID`,description:`Unik identifikasjon for datovelgeren`,category:`tech`},ariaDescribedby:{attribute:`aria-describedby`,name:`aria-describedby`,description:`Spesifiserer ID-en til elementet som beskriver feltet.`,type:`string`,category:`accessibility`},inline:{name:`Inline`,type:`boolean`,required:!1,default:!1,description:`Angir om feltet skal flyte med teksten`,category:`ui`},hasFieldset:{name:`Bruk fieldset`,type:`boolean`,required:!1,default:null,description:`Bruk fieldset og legend i stedet for label. Utledes automatisk når feltet består av flere kontroller.`,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`}},events:{change:{type:`Event`,name:`change (Elements)`,description:`Returnerer valgt dato som streng i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},"value-change":{type:`CustomEvent`,name:`value-change (Elements)`,description:`Returnerer en <code>array</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},toggleHelpText:{type:`CustomEvent`,description:`Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes`},onChange:{type:`Event`,name:`onChange (React)`,reactOnly:!0,description:`Utløses når en dato velges. <code>e.target.value</code> inneholder kommaseparerte ISO-datoer. I range-modus utløses kun når begge datoer er valgt.`},onValueChange:{type:`string[]`,name:`onValueChange (React)`,reactOnly:!0,description:`Returnerer en <code>string[]</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`}}},d=()=>{let e=navigator.userAgent;return!!(/iP(hone|od|ad)/.test(e)||/Macintosh/.test(e)&&`ontouchend`in document)},f=()=>d()?`text`:`date`,p=e=>!e||e.length!==2||a.u(e[0],e[1]),m=e=>a.h(e),h=(e,t,n,r,i)=>a.i(e,t,n,r,i),g=(e,t,n,r,i,a,o=`medium`)=>({"pkt-input":!0,"pkt-datepicker__input":!0,[`pkt-input--${o}`]:!0,"pkt-input--fullwidth":e,"pkt-datepicker--hasrangelabels":t,"pkt-datepicker--multiple":n,"pkt-datepicker--range":r,"ios-readonly-hack":i===!1&&a===`text`}),_=(e=`medium`)=>({"pkt-input-icon":!0,"pkt-btn":!0,"pkt-btn--icon-only":!0,"pkt-btn--tertiary":!0,[`pkt-btn--${e}`]:!0,"pkt-datepicker__calendar-button":!0}),v=e=>({"pkt-input-prefix":e,"pkt-hide":!e}),y=(e,t,n)=>!t&&!n?Array.isArray(e)?e[0]||``:e:Array.isArray(e)?e.join(`,`):e,b=(e,t,n=!1)=>{if(!e||!t)return;let r=t.parentElement?.getBoundingClientRect()||t.getBoundingClientRect(),i=n?r.height+30:r.height,a=e.getBoundingClientRect().height,o=n?`calc(100% - 30px)`:`100%`;r&&typeof window<`u`&&r.top+a>window.innerHeight&&r.top-a>0&&(o=`calc(100% - ${i}px - ${a}px)`),e.style.top=o},x=(e,t,n,r,i,a)=>{let{key:o}=e;o===`,`&&(e.preventDefault(),a?a(e):i&&i()),(o===`Space`||o===` `)&&(e.preventDefault(),t(e)),o===`Enter`&&(e.preventDefault(),n?n():r?r():i&&i())},S=(e,t)=>{let{key:n}=e;(n===`Enter`||n===` `||n===`Space`)&&(e.preventDefault(),t(e))},C={validateRangeOrder:p,sortDates:m,filterSelectableDates:h},w={getInputType:f},T={submitForm(e){let t=e.internals?.form;t&&t.requestSubmit()},submitFormOrFallback(e,t){let n=e?.form;n?n.requestSubmit():t()},validateDateInput(t,n,r,i,a){let o=t.value;if(!o)return;let s={...e.s.validation,...a};r&&r>o?n.setValidity({rangeUnderflow:!0},s.dateUnderflow,t):i&&i<o&&n.setValidity({rangeOverflow:!0},s.dateOverflow,t)}},E={addToSelected(e,t,n,r){let i=e.target;if(!i.value)return;let o=n?a.d(n):null,s=r?a.d(r):null,c=a.d(i.value.split(`,`)[0]);c&&!isNaN(c.getTime())&&(!o||c>=o)&&(!s||c<=s)&&t.value&&t.value.handleDateSelect(c),i.value=``},handleCalendarPosition(e,t,n=!1){b(e.value??null,t.value??null,n)}},D={getInputClasses:g,getButtonClasses:_,getRangeLabelClasses:v},O={processDateSelection:y,updateInputValues(e,t,n,r,i,a){e.value&&(r&&t?.value?(e.value.value=n[0]??``,t.value.value=n[1]??``,a(e.value),a(t.value)):i||(e.value.value=n.length?n[0]:``,a(e.value)))},processRangeBlur(e,t,n,r,i){let o=e.target;if(o.value){i(o);let e=a.s(o.value);e&&n?.value?.handleDateSelect(e)}else t[0]&&r()}},k={handleInputKeydown:x,handleButtonKeydown:S},A=class extends e.t{constructor(...e){super(...e),this.open=!1,this.multiple=!1,this.range=!1,this.weeknumbers=!1,this.withcontrols=!1,this.maxMultiple=null,this.selected=[],this.earliest=null,this.latest=null,this.excludedates=[],this.excludeweekdays=[],this.currentmonth=null,this.today=null,this._hasBeenOpened=!1,this.popupRef=i.t(),this.calendarRef=i.t(),this.handleDocumentClick=e=>{if(!this.open)return;let t=e.composedPath(),n=this.parentElement,r=this.popupRef.value;!t.includes(this)&&!t.includes(r)&&!(n&&t.includes(n))&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))},this.handleDocumentKeydown=e=>{this.open&&e.key===`Escape`&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))}}firstUpdated(){this.calRef=this.calendarRef}willUpdate(e){super.willUpdate(e),e.has(`open`)&&this.open&&(this._hasBeenOpened=!0)}updated(e){super.updated(e),e.has(`open`)&&(this.open?(document.addEventListener(`keydown`,this.handleDocumentKeydown),document.addEventListener(`click`,this.handleDocumentClick)):(document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)}show(){this.open=!0,this.calendarRef.value?.focus()}hide(){this.open=!1}toggle(){this.open?this.hide():this.show()}contains(e){return!!e&&!!this.popupRef.value?.contains(e)}focusOnCurrentDate(){let e=this.calendarRef.value;e&&typeof e.focusOnCurrentDate==`function`&&e.focusOnCurrentDate()}addToSelected(e,t,n){if(this.calendarRef.value&&typeof E.addToSelected==`function`)return E.addToSelected(e,this.calendarRef,t,n);let r=e.target;if(!r.value)return;let i=t?a.d(t):null,o=n?a.d(n):null,s=a.d(r.value.split(`,`)[0]);s&&!isNaN(s.getTime())&&(!i||s>=i)&&(!o||s<=o)&&this.handleDateSelect(s),r.value=``}handleDateSelect(e){let t=this.calendarRef.value;if(t&&typeof t.handleDateSelect==`function`)return t.handleDateSelect(e);let n=a.a(e),r=this.selected.indexOf(n)>=0?this.selected.filter(e=>e!==n):[...this.selected,n];this.selected=r,this.dispatchEvent(new CustomEvent(`date-selected`,{detail:r,bubbles:!0,composed:!0}))}render(){let n={"pkt-calendar-popup":!0,show:this.open,hide:!this.open};return e._`
|
|
12
|
+
`}};e.n([e.u({type:Array})],l.prototype,`dates`,void 0),e.n([e.u({type:String})],l.prototype,`dateformat`,void 0),e.n([e.u({type:String,attribute:`class`})],l.prototype,`className`,void 0),e.n([e.u({type:String,attribute:`id-base`})],l.prototype,`idBase`,void 0);try{e.d(`pkt-date-tags`)(l)}catch{console.warn(`Forsøker å definere <pkt-date-tags>, men den er allerede definert`)}var u={name:`pkt-datepicker`,react:`PktDatepicker`,"css-class":`pkt-datepicker`,isElement:!0,isPureReact:!0,"dark-mode":!0,props:{name:{type:`string`,name:`Navn for 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`},label:{type:`string`,name:`Tekst/label`,category:`contents`},helptext:{type:`string`,name:`Hjelpetekst`,category:`contents`},helptextDropdown:{type:`string`,name:`Utvidet hjelpetekst`,description:`Hjelpetekst som vises i en lukket boks man kan åpne`,category:`contents`},helptextDropdownButton:{type:`string`,name:`Knappetekst for utvidet hjelpetekst`,default:`Les mer`,category:`contents`},dateformat:{name:`Datoformat for tags i flervalg`,type:`string`,default:`dd.MM.yyyy`,category:`tech`},currentmonth:{name:`Måned som vises i datovelgeren`,type:`ISOdatestring`,category:`tech`},value:{name:`Verdi (kommaseparert ved flervalg)`,type:`ISOdatestring`,variant:`multiple`,category:`tech`},excludeweekdays:{name:`Utelat ukedager`,type:`string`,description:`Kommaseparert liste over ukedager (1-7) som skal ekskluderes`,category:`functionality`},excludedates:{name:`Utelat datoer (Kommaseparerte ISO-datoer)`,type:`ISOdatestring`,variant:`multiple`,category:`functionality`},min:{name:`Tidligst tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},max:{name:`Senest tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},weeknumbers:{name:`Vis ukenummer`,type:`boolean`,reflect:!0,default:!1,category:`ui`},withcontrols:{name:`Med velgere for måned/år`,type:`boolean`,reflect:!0,default:!1,category:`ui`},multiple:{name:`Flervalg`,type:`boolean`,reflect:!0,default:!1,category:`functionality`,exclusiveGroup:`selectionMode`},maxlength:{name:`Maks antall datoer i flervalg`,type:`number`,category:`functionality`,showIf:{multiple:!0}},range:{name:`Datotidsrom (fra og til)`,type:`boolean`,reflect:!0,default:!1,category:`functionality`,exclusiveGroup:`selectionMode`},showRangeLabels:{attribute:`show-range-labels`,name:`Vis fra/til-etiketter`,type:`boolean`,default:!1,category:`ui`,showIf:{range:!0}},today:{name:`Dagens dato (overstyring)`,type:`ISOdatestring`,description:`ISO-datostreng som overstyrer dagens dato i kalenderen. Nyttig for snapshot-tester.`,category:`tech`},calendarOpen:{attribute:`calendar-open`,name:`Kalender åpen`,type:`boolean`,reflect:!0,default:!1,category:`ui`},hasError:{type:`boolean`,name:`Feil`,default:!1,category:`ui`},errorMessage:{type:`string`,name:`Feilmelding ved feil`,category:`contents`},disabled:{type:`boolean`,name:`Deaktivert`,default:!1,reflect:!0,category:`tech`},fullwidth:{type:`boolean`,name:`Full bredde`,default:!1,reflect:!0,category:`ui`},inputSize:{attribute:`input-size`,name:`Størrelse`,description:`Størrelsen på komponenten`,type:[`medium`,`small`,`xsmall`],default:`medium`,category:`ui`},required:{type:`boolean`,name:`Påkrevd`,default:!1,reflect:!0,category:`tech`},requiredTag:{type:`boolean`,name:`Vise påkrevd-merking`,default:!1,category:`ui`},requiredText:{type:`string`,name:`Påkrevd-tekst`,default:`Må fylles ut`,category:`contents`},optionalTag:{type:`boolean`,name:`Vise valgfritt-merking`,default:!1,category:`ui`},optionalText:{type:`string`,name:`Valgfritt-tekst`,default:`Valgfritt`,category:`contents`},tagText:{type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},useWrapper:{type:`boolean`,name:`Bruk wrapper`,description:`Indikerer at feltet skal ha synlig label og hjelpetekst`,displayAsFalse:!0,default:!0,category:`ui`},id:{type:`string`,name:`ID`,description:`Unik identifikasjon for datovelgeren`,category:`tech`},ariaDescribedby:{attribute:`aria-describedby`,name:`aria-describedby`,description:`Spesifiserer ID-en til elementet som beskriver feltet.`,type:`string`,category:`accessibility`},inline:{name:`Inline`,type:`boolean`,required:!1,default:!1,description:`Angir om feltet skal flyte med teksten`,category:`ui`},hasFieldset:{name:`Bruk fieldset`,type:`boolean`,required:!1,default:null,description:`Bruk fieldset og legend i stedet for label. Utledes automatisk når feltet består av flere kontroller.`,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`}},events:{change:{type:`Event`,name:`change (Elements)`,description:`Returnerer valgt dato som streng i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},"value-change":{type:`CustomEvent`,name:`value-change (Elements)`,description:`Returnerer en <code>array</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},toggleHelpText:{type:`CustomEvent`,description:`Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes`},onChange:{type:`Event`,name:`onChange (React)`,reactOnly:!0,description:`Utløses når en dato velges. <code>e.target.value</code> inneholder kommaseparerte ISO-datoer. I range-modus utløses kun når begge datoer er valgt.`},onValueChange:{type:`string[]`,name:`onValueChange (React)`,reactOnly:!0,description:`Returnerer en <code>string[]</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`}}},d=()=>{let e=navigator.userAgent;return!!(/iP(hone|od|ad)/.test(e)||/Macintosh/.test(e)&&`ontouchend`in document)},f=()=>d()?`text`:`date`,p=e=>!e||e.length!==2||a.u(e[0],e[1]),m=e=>a.h(e),h=(e,t,n,r,i)=>a.i(e,t,n,r,i),g=(e,t,n,r,i,a,o=`medium`)=>({"pkt-input":!0,"pkt-datepicker__input":!0,[`pkt-input--${o}`]:!0,"pkt-input--fullwidth":e,"pkt-datepicker--hasrangelabels":t,"pkt-datepicker--multiple":n,"pkt-datepicker--range":r,"ios-readonly-hack":i===!1&&a===`text`}),_=(e=`medium`)=>({"pkt-input-icon":!0,"pkt-btn":!0,"pkt-btn--icon-only":!0,"pkt-btn--tertiary":!0,[`pkt-btn--${e}`]:!0,"pkt-datepicker__calendar-button":!0}),v=e=>({"pkt-input-prefix":e,"pkt-hide":!e}),y=(e,t,n)=>!t&&!n?Array.isArray(e)?e[0]||``:e:Array.isArray(e)?e.join(`,`):e,b=(e,t,n=!1)=>{if(!e||!t)return;let r=t.parentElement?.getBoundingClientRect()||t.getBoundingClientRect(),i=n?r.height+30:r.height,a=e.getBoundingClientRect().height,o=n?`calc(100% - 30px)`:`100%`;r&&typeof window<`u`&&r.top+a>window.innerHeight&&r.top-a>0&&(o=`calc(100% - ${i}px - ${a}px)`),e.style.top=o},x=(e,t,n,r,i,a)=>{let{key:o}=e;o===`,`&&(e.preventDefault(),a?a(e):i&&i()),(o===`Space`||o===` `)&&(e.preventDefault(),t(e)),o===`Enter`&&(e.preventDefault(),n?n():r?r():i&&i())},S=(e,t)=>{let{key:n}=e;(n===`Enter`||n===` `||n===`Space`)&&(e.preventDefault(),t(e))},C={validateRangeOrder:p,sortDates:m,filterSelectableDates:h},w={getInputType:f},T={submitForm(e){let t=e.internals?.form;t&&t.requestSubmit()},submitFormOrFallback(e,t){let n=e?.form;n?n.requestSubmit():t()},validateDateInput(t,n,r,i,a){let o=t.value;if(!o)return;let s={...e.s.validation,...a};r&&r>o?n.setValidity({rangeUnderflow:!0},s.dateUnderflow,t):i&&i<o&&n.setValidity({rangeOverflow:!0},s.dateOverflow,t)}},E={addToSelected(e,t,n,r){let i=e.target;if(!i.value)return;let o=n?a.d(n):null,s=r?a.d(r):null,c=a.d(i.value.split(`,`)[0]);c&&!isNaN(c.getTime())&&(!o||c>=o)&&(!s||c<=s)&&t.value&&t.value.handleDateSelect(c),i.value=``},handleCalendarPosition(e,t,n=!1){b(e.value??null,t.value??null,n)}},D={getInputClasses:g,getButtonClasses:_,getRangeLabelClasses:v},O={processDateSelection:y,updateInputValues(e,t,n,r,i,a){e.value&&(r&&t?.value?(e.value.value=n[0]??``,t.value.value=n[1]??``,a(e.value),a(t.value)):i||(e.value.value=n.length?n[0]:``,a(e.value)))},processRangeBlur(e,t,n,r,i){let o=e.target;if(o.value){i(o);let e=a.s(o.value);e&&n?.value?.handleDateSelect(e)}else t[0]&&r()}},k={handleInputKeydown:x,handleButtonKeydown:S},A=class extends e.t{constructor(...e){super(...e),this.open=!1,this.multiple=!1,this.range=!1,this.weeknumbers=!1,this.withcontrols=!1,this.maxMultiple=null,this.selected=[],this.earliest=null,this.latest=null,this.excludedates=[],this.excludeweekdays=[],this.currentmonth=null,this.today=null,this._hasBeenOpened=!1,this.popupRef=i.t(),this.calendarRef=i.t(),this.handleDocumentClick=e=>{if(!this.open)return;let t=e.composedPath(),n=this.parentElement,r=this.popupRef.value;!t.includes(this)&&!t.includes(r)&&!(n&&t.includes(n))&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))},this.handleDocumentKeydown=e=>{this.open&&e.key===`Escape`&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))}}firstUpdated(){this.calRef=this.calendarRef}willUpdate(e){super.willUpdate(e),e.has(`open`)&&this.open&&(this._hasBeenOpened=!0)}updated(e){super.updated(e),e.has(`open`)&&(this.open?(document.addEventListener(`keydown`,this.handleDocumentKeydown),document.addEventListener(`click`,this.handleDocumentClick)):(document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)}show(){this.open=!0,this.calendarRef.value?.focus()}hide(){this.open=!1}toggle(){this.open?this.hide():this.show()}contains(e){return!!e&&!!this.popupRef.value?.contains(e)}focusOnCurrentDate(){let e=this.calendarRef.value;e&&typeof e.focusOnCurrentDate==`function`&&e.focusOnCurrentDate()}addToSelected(e,t,n){if(this.calendarRef.value&&typeof E.addToSelected==`function`)return E.addToSelected(e,this.calendarRef,t,n);let r=e.target;if(!r.value)return;let i=t?a.d(t):null,o=n?a.d(n):null,s=a.d(r.value.split(`,`)[0]);s&&!isNaN(s.getTime())&&(!i||s>=i)&&(!o||s<=o)&&this.handleDateSelect(s),r.value=``}handleDateSelect(e){let t=this.calendarRef.value;if(t&&typeof t.handleDateSelect==`function`)return t.handleDateSelect(e);let n=a.a(e),r=this.selected.indexOf(n)>=0?this.selected.filter(e=>e!==n):[...this.selected,n];this.selected=r,this.dispatchEvent(new CustomEvent(`date-selected`,{detail:r,bubbles:!0,composed:!0}))}render(){let n={"pkt-calendar-popup":!0,show:this.open,hide:!this.open};return e._`
|
|
13
13
|
<div
|
|
14
14
|
class="${t.t(n)}"
|
|
15
15
|
${i.n(this.popupRef)}
|
|
@@ -12,7 +12,7 @@ import "./button-Bswo1C0M.js";
|
|
|
12
12
|
import { n as g, t as _ } from "./ref-BAegS9BR.js";
|
|
13
13
|
import { n as v, t as y } from "./focus-trap-DG3pEuyJ.js";
|
|
14
14
|
import { n as b, t as x } from "./scroll-lock-CR-g54ai.js";
|
|
15
|
-
import "./link-
|
|
15
|
+
import "./link-DLPpwjq4.js";
|
|
16
16
|
import "./searchinput-BLGaXkP6.js";
|
|
17
17
|
import "./header-menu-BrjsNjBH.js";
|
|
18
18
|
//#region ../../shared-types/header.ts
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs"),i=require("./booleanish-BF8l4scU.cjs");require("./shared-types-BvRk9kiK.cjs");const a=require("./fetch-header-footer-data-CUKV0biS.cjs");require("./icon-5A378_yh.cjs"),require("./textinput-CN2F3Q3H.cjs");const o=require("./if-defined-Ci4ZQsgL.cjs");require("./button-bVWAX98x.cjs");const s=require("./ref-B6p6mQkO.cjs"),c=require("./focus-trap-DSv4Ifqm.cjs"),l=require("./scroll-lock-x0VxhKWZ.cjs");require("./link-
|
|
1
|
+
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs"),i=require("./booleanish-BF8l4scU.cjs");require("./shared-types-BvRk9kiK.cjs");const a=require("./fetch-header-footer-data-CUKV0biS.cjs");require("./icon-5A378_yh.cjs"),require("./textinput-CN2F3Q3H.cjs");const o=require("./if-defined-Ci4ZQsgL.cjs");require("./button-bVWAX98x.cjs");const s=require("./ref-B6p6mQkO.cjs"),c=require("./focus-trap-DSv4Ifqm.cjs"),l=require("./scroll-lock-x0VxhKWZ.cjs");require("./link-pkFJ11Zd.cjs"),require("./searchinput-TAqMUJ0B.cjs"),require("./header-menu-Dq9lwNr1.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.initialWidthEstimated=!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)}hostUpdate(){this.initialWidthEstimated||(this.initialWidthEstimated=!0,this.componentWidth=this.host.offsetWidth,this.applyBreakpoints())}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(){this.applyBreakpoints()&&this.host.requestUpdate()}applyBreakpoints(){let{mobileBreakpoint:e,tabletBreakpoint:t}=this.getOptions(),n=this.componentWidth<e,r=this.componentWidth<t;return n===this.isMobile&&r===this.isTablet?!1:(this.isMobile=n,this.isTablet=r,!0)}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}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./element-with-slot-CeKuRE3_.cjs");require("./icon-5A378_yh.cjs");const r=require("./define-component-spec-DBNd2FJY.cjs");var i={href:{type:`string`,description:`Mål-URL for lenken.`,required:!0,reactOnly:!0},className:{type:`string`,description:`CSS-klasser Punkt har satt på lenken.`,required:!0,reactOnly:!0},children:{type:`ReactNode`,description:`Innhold/label som skal rendres inni lenken.`,required:!0,reactOnly:!0},props:{type:`AnchorHTMLAttributes<HTMLAnchorElement>`,description:`Resten av anchor-attributter (f.eks. <code>onClick</code>, <code>aria-*</code>) som skal spreades på lenken.`,required:!0,reactOnly:!0}},a={name:`Egendefinert lenkekomponent`,description:`React: Funksjon for å rendre en egendefinert lenkekomponent (f.eks. Next.js Link eller React Router Link). Mottar et <code>IRenderLink</code>-objekt med href, className, children og props. Standard er et vanlig <code><a></code>-element.`,type:`(args: IRenderLink) => ReactNode`,relatedTypes:[`IRenderLink`],category:`tech`,reactOnly:!0},o={IRenderLink:{title:`IRenderLink`,description:`Objektet som sendes til <code>renderLink</code> i Link, BackLink og Breadcrumbs. Kun React — brukes til å bytte ut standard <code><a></code> med f.eks. Next.js Link eller React Router Link.`,properties:i}},s=r.t({name:`pkt-link`,react:`PktLink`,"css-class":`pkt-link`,"dark-mode":!0,isElement:!0,props:{href:{name:`URL`,description:`URL til lenken`,type:`string`,default:`#`,category:`contents`},target:{name:`Mål`,description:`Mål for lenken`,type:[`_blank`,`_self`,`_parent`,`_top`],default:`_self`,category:`tech`},rel:{name:`Relasjon`,description:`Forholdet mellom siden og målet for lenken, som i <code>rel</code> på en vanlig lenke. For eksempel <code>noopener noreferrer</code>.`,type:`string`,category:`tech`},iconName:{name:`Ikon`,description:`Ikon som skal vises ved siden av lenketeksten`,type:`icon`,category:`ui`},iconPosition:{name:`Ikonposisjon`,description:`Posisjonen til ikonet i forhold til lenketeksten`,type:[`left`,`right`],category:`ui`},renderLink:a},types:{...o},slots:{default:{description:`Innholdet i lenken`}}}).props,c=class extends n.t{constructor(...e){super(...e),this.href=s.href.default,this.iconName=void 0,this.iconPosition=void 0,this.rel=null,this.target=s.target.default}render(){let r={"pkt-link":!0,"pkt-link--icon-left":!!this.iconName&&this.iconPosition===`left`||!(!this.iconName||this.iconPosition),"pkt-link--icon-right":!!this.iconName&&this.iconPosition===`right`},i=this.target&&this.target!==`_self`?this.target:e.h;return e._`<a
|
|
1
|
+
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./element-with-slot-CeKuRE3_.cjs");require("./icon-5A378_yh.cjs");const r=require("./define-component-spec-DBNd2FJY.cjs");var i={href:{type:`string`,description:`Mål-URL for lenken.`,required:!0,reactOnly:!0},className:{type:`string`,description:`CSS-klasser Punkt har satt på lenken.`,required:!0,reactOnly:!0},children:{type:`ReactNode`,description:`Innhold/label som skal rendres inni lenken.`,required:!0,reactOnly:!0},props:{type:`AnchorHTMLAttributes<HTMLAnchorElement>`,description:`Resten av anchor-attributter (f.eks. <code>onClick</code>, <code>aria-*</code>) som skal spreades på lenken.`,required:!0,reactOnly:!0}},a={name:`Egendefinert lenkekomponent`,description:`React: Funksjon for å rendre en egendefinert lenkekomponent (f.eks. Next.js Link eller React Router Link). Mottar et <code>IRenderLink</code>-objekt med href, className, children og props. Standard er et vanlig <code><a></code>-element.`,type:`(args: IRenderLink) => ReactNode`,relatedTypes:[`IRenderLink`],category:`tech`,reactOnly:!0},o={IRenderLink:{title:`IRenderLink`,description:`Objektet som sendes til <code>renderLink</code> i Link, BackLink og Breadcrumbs. Kun React — brukes til å bytte ut standard <code><a></code> med f.eks. Next.js Link eller React Router Link.`,properties:i}},s=r.t({name:`pkt-link`,react:`PktLink`,"css-class":`pkt-link`,"dark-mode":!0,isElement:!0,props:{href:{name:`URL`,description:`URL til lenken`,type:`string`,default:`#`,displayDefault:!0,category:`contents`},target:{name:`Mål`,description:`Mål for lenken`,type:[`_blank`,`_self`,`_parent`,`_top`],default:`_self`,category:`tech`},rel:{name:`Relasjon`,description:`Forholdet mellom siden og målet for lenken, som i <code>rel</code> på en vanlig lenke. For eksempel <code>noopener noreferrer</code>.`,type:`string`,category:`tech`},iconName:{name:`Ikon`,description:`Ikon som skal vises ved siden av lenketeksten`,type:`icon`,category:`ui`},iconPosition:{name:`Ikonposisjon`,description:`Posisjonen til ikonet i forhold til lenketeksten`,type:[`left`,`right`],category:`ui`},renderLink:a},types:{...o},slots:{default:{description:`Innholdet i lenken`}}}).props,c=class extends n.t{constructor(...e){super(...e),this.href=s.href.default,this.iconName=void 0,this.iconPosition=void 0,this.rel=null,this.target=s.target.default}render(){let r={"pkt-link":!0,"pkt-link--icon-left":!!this.iconName&&this.iconPosition===`left`||!(!this.iconName||this.iconPosition),"pkt-link--icon-right":!!this.iconName&&this.iconPosition===`right`},i=this.target&&this.target!==`_self`?this.target:e.h;return e._`<a
|
|
2
2
|
class=${t.t(r)}
|
|
3
3
|
href=${this.href}
|
|
4
4
|
target=${i}
|
package/dist/pkt-card.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./card-
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./card-BbV4OBqb.cjs");exports.PktCard=e.n,exports.default=e.t;
|
package/dist/pkt-card.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { n as PktCard, t as default } from "./card-
|
|
1
|
+
export { n as PktCard, t as default } from "./card-CKStAH0Q.js";
|
package/dist/pkt-combobox.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./combobox-
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./combobox-CWL8T3UK.cjs");exports.PktCombobox=e.n,exports.default=e.t;
|
package/dist/pkt-combobox.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { n as PktCombobox, t as default } from "./combobox-
|
|
1
|
+
export { n as PktCombobox, t as default } from "./combobox-Pxa80TeZ.js";
|
package/dist/pkt-datepicker.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./datepicker-
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./datepicker-Cpiu_Nrf.cjs");var t=e.t;exports.PktDatepicker=e.t,exports.PktDatepickerMultiple=e.n,exports.PktDatepickerRange=e.r,exports.PktDatepickerSingle=e.i,exports.default=t;
|
package/dist/pkt-datepicker.js
CHANGED
package/dist/pkt-header.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./header-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./header-CiwHNHKD.cjs");exports.PktHeader=e.t,exports.PktHeaderGlobal=e.n,exports.PktHeaderService=e.r,exports.PktHeaderUserMenu=e.i,exports.formatLastLoggedIn=e.a;
|
package/dist/pkt-header.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { t as PktHeader, n as PktHeaderGlobal, r as PktHeaderService, i as PktHeaderUserMenu, a as formatLastLoggedIn } from "./header-
|
|
1
|
+
export { t as PktHeader, n as PktHeaderGlobal, r as PktHeaderService, i as PktHeaderUserMenu, a as formatLastLoggedIn } from "./header-ChT1hHNA.js";
|
package/dist/pkt-index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./element-CEarCnHH.cjs"),t=require("./consent-UkinU27V.cjs"),n=require("./alert-DkyTTo7S.cjs"),r=require("./header-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./element-CEarCnHH.cjs"),t=require("./consent-UkinU27V.cjs"),n=require("./alert-DkyTTo7S.cjs"),r=require("./header-CiwHNHKD.cjs"),i=require("./card-BbV4OBqb.cjs"),a=require("./checkbox-iMOdzpJ_.cjs"),o=require("./radiobutton-CQhuG2lj.cjs"),s=require("./icon-5A378_yh.cjs"),c=require("./loader-DTIrOtTo.cjs"),l=require("./accordion-5N_ptxrN.cjs"),u=require("./linkcard-DIG6VYpl.cjs"),d=require("./input-wrapper-C_Rzwxx7.cjs"),f=require("./textarea-DSX3jMlI.cjs"),p=require("./textinput-CN2F3Q3H.cjs"),m=require("./tag-BZdC0voc.cjs"),h=require("./messagebox-BLYx3AL7.cjs"),g=require("./calendar-CDTCgTJn.cjs"),_=require("./progressbar-BdqIhC1Z.cjs"),v=require("./combobox-CWL8T3UK.cjs"),y=require("./button-bVWAX98x.cjs"),b=require("./backlink-CXOxMeyt.cjs"),x=require("./breadcrumbs-zfUto2U5.cjs"),S=require("./helptext-Bse1LpRd.cjs"),C=require("./checkbox-group-Kua6HuRE.cjs"),w=require("./fileupload-DXJtAagE.cjs"),T=require("./modal-BvTfLfFq.cjs"),E=require("./datepicker-Cpiu_Nrf.cjs"),D=require("./footer-CpE05IW2.cjs"),O=require("./link-pkFJ11Zd.cjs"),k=require("./searchinput-TAqMUJ0B.cjs"),A=require("./header-menu-Dq9lwNr1.cjs"),j=require("./heading-DAkjw2Am.cjs"),M=require("./radio-group-CsUgnEv0.cjs"),N=require("./tabs-B96Orh6O.cjs"),P=require("./select-Dle67Uwv.cjs"),F=require("./timepicker-CkaJkIGn.cjs");exports.PktAccordion=l.r,exports.PktAccordionItem=l.n,exports.PktAlert=n.n,exports.PktBackLink=b.n,exports.PktBreadcrumbs=x.t,exports.PktButton=y.n,exports.PktCalendar=g.n,exports.PktCard=i.n,exports.PktCheckbox=a.n,exports.PktCheckboxGroup=C.n,exports.PktCombobox=v.n,exports.PktConsent=t.n,exports.PktDateTags=E.a,exports.PktDatepicker=E.t,Object.defineProperty(exports,"PktFileUpload",{enumerable:!0,get:function(){return w.n}}),exports.PktFooter=D.n,exports.PktFooterSimple=D.t,exports.PktHeader=r.t,exports.PktHeaderGlobal=r.n,exports.PktHeaderMenu=A.n,exports.PktHeaderService=r.r,exports.PktHeaderUserMenu=r.i,exports.PktHeading=j.n,exports.PktHelptext=S.n,exports.PktIcon=s.n,exports.PktInputWrapper=d.n,exports.PktLink=O.n,exports.PktLinkCard=u.n,exports.PktLoader=c.n,exports.PktMessagebox=h.n,exports.PktModal=T.n,exports.PktProgressbar=_.n,exports.PktRadioButton=o.n,exports.PktRadiobutton=o.n,exports.PktRadioGroup=M.n,exports.PktSearchInput=k.n,exports.PktSelect=P.n,exports.PktTabItem=N.n,exports.PktTabs=N.r,exports.PktTag=m.n,exports.PktTextarea=f.n,exports.PktTextinput=p.n,exports.PktTimepicker=F.t,exports.getPktStrings=e.r,exports.pktStringsNb=e.s,exports.resetPktStrings=e.i,exports.setPktStrings=e.a,exports.subscribePktStrings=e.o;
|
package/dist/pkt-index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { a as e, i as t, o as n, r, s as i } from "./element-DLgZkx5L.js";
|
|
2
2
|
import { n as a } from "./consent-p-0n2b9x.js";
|
|
3
3
|
import { n as o } from "./alert-CA1fDbyc.js";
|
|
4
|
-
import { i as s, n as c, r as l, t as u } from "./header-
|
|
5
|
-
import { n as d } from "./card-
|
|
4
|
+
import { i as s, n as c, r as l, t as u } from "./header-ChT1hHNA.js";
|
|
5
|
+
import { n as d } from "./card-CKStAH0Q.js";
|
|
6
6
|
import { n as f } from "./checkbox-DIJbuqWm.js";
|
|
7
7
|
import { n as p } from "./radiobutton-lHnq8wX_.js";
|
|
8
8
|
import { n as m } from "./icon-C1oCGwEe.js";
|
|
@@ -12,26 +12,26 @@ import { n as v } from "./linkcard-Dr-r8jBO.js";
|
|
|
12
12
|
import { n as y } from "./input-wrapper-DkpJS1hR.js";
|
|
13
13
|
import { n as b } from "./textarea-Djp5L2Zd.js";
|
|
14
14
|
import { n as x } from "./textinput-CBrOZcvL.js";
|
|
15
|
-
import { n as S } from "./
|
|
16
|
-
import { n as C } from "./
|
|
17
|
-
import { n as w } from "./
|
|
18
|
-
import { n as T } from "./
|
|
19
|
-
import { n as E } from "./
|
|
20
|
-
import { n as D } from "./
|
|
21
|
-
import {
|
|
22
|
-
import {
|
|
15
|
+
import { n as S } from "./tag-Cam7ISOF.js";
|
|
16
|
+
import { n as C } from "./messagebox-B_07P0QA.js";
|
|
17
|
+
import { n as w } from "./calendar-BOd-9PDd.js";
|
|
18
|
+
import { n as T } from "./progressbar-CfCc2zhp.js";
|
|
19
|
+
import { n as E } from "./combobox-Pxa80TeZ.js";
|
|
20
|
+
import { n as D } from "./button-Bswo1C0M.js";
|
|
21
|
+
import { n as O } from "./backlink-CDBRcaAu.js";
|
|
22
|
+
import { t as k } from "./breadcrumbs-5oUaCef3.js";
|
|
23
23
|
import { n as A } from "./helptext-BFQzrOw4.js";
|
|
24
24
|
import { n as j } from "./checkbox-group-DLLbWgQb.js";
|
|
25
25
|
import { n as M } from "./fileupload-vPDmtXiM.js";
|
|
26
26
|
import { n as N } from "./modal-CA_M2Ix6.js";
|
|
27
|
-
import { a as P, t as F } from "./datepicker-
|
|
27
|
+
import { a as P, t as F } from "./datepicker-BpxUWiIC.js";
|
|
28
28
|
import { n as I, t as L } from "./footer-D8t0PCPC.js";
|
|
29
|
-
import { n as R } from "./link-
|
|
29
|
+
import { n as R } from "./link-DLPpwjq4.js";
|
|
30
30
|
import { n as z } from "./searchinput-BLGaXkP6.js";
|
|
31
31
|
import { n as B } from "./header-menu-BrjsNjBH.js";
|
|
32
32
|
import { n as V } from "./heading-CMZmPEL9.js";
|
|
33
33
|
import { n as H } from "./radio-group-BRY_74od.js";
|
|
34
|
-
import { n as U, r as W } from "./tabs-
|
|
34
|
+
import { n as U, r as W } from "./tabs-BmmTUKuC.js";
|
|
35
35
|
import { n as G } from "./select-BvtUxW0Q.js";
|
|
36
36
|
import { t as K } from "./timepicker-CT4wfrgQ.js";
|
|
37
|
-
export { _ as PktAccordion, g as PktAccordionItem, o as PktAlert,
|
|
37
|
+
export { _ as PktAccordion, g as PktAccordionItem, o as PktAlert, O as PktBackLink, k as PktBreadcrumbs, D as PktButton, w as PktCalendar, d as PktCard, f as PktCheckbox, j as PktCheckboxGroup, E as PktCombobox, a as PktConsent, P as PktDateTags, F as PktDatepicker, M as PktFileUpload, I as PktFooter, L as PktFooterSimple, u as PktHeader, c as PktHeaderGlobal, B as PktHeaderMenu, l as PktHeaderService, s as PktHeaderUserMenu, V as PktHeading, A as PktHelptext, m as PktIcon, y as PktInputWrapper, R as PktLink, v as PktLinkCard, h as PktLoader, C as PktMessagebox, N as PktModal, T as PktProgressbar, p as PktRadioButton, p as PktRadiobutton, H as PktRadioGroup, z as PktSearchInput, G as PktSelect, U as PktTabItem, W as PktTabs, S as PktTag, b as PktTextarea, x as PktTextinput, K as PktTimepicker, r as getPktStrings, i as pktStringsNb, t as resetPktStrings, e as setPktStrings, n as subscribePktStrings };
|
package/dist/pkt-link.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./link-
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./link-pkFJ11Zd.cjs");exports.PktLink=e.n,exports.default=e.t;
|
package/dist/pkt-link.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { n as PktLink, t as default } from "./link-
|
|
1
|
+
export { n as PktLink, t as default } from "./link-DLPpwjq4.js";
|
package/dist/pkt-tabs.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./tabs-
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./tabs-B96Orh6O.cjs");exports.PktTabItem=e.n,exports.PktTabs=e.r,exports.default=e.t;
|
package/dist/pkt-tabs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { n as PktTabItem, r as PktTabs, t as default } from "./tabs-
|
|
1
|
+
export { n as PktTabItem, r as PktTabs, t as default } from "./tabs-BmmTUKuC.js";
|
package/dist/pkt-tag.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./tag-
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./tag-BZdC0voc.cjs");exports.PktTag=e.n,exports.default=e.t;
|
package/dist/pkt-tag.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { n as PktTag, t as default } from "./tag-
|
|
1
|
+
export { n as PktTag, t as default } from "./tag-Cam7ISOF.js";
|
|
@@ -46,8 +46,9 @@ export type { IPktTextareaBase, ITextareaSpecProps } from './textarea';
|
|
|
46
46
|
export { TEXTINPUT_DEFAULTS, TEXTINPUT_TYPES } from './textinput';
|
|
47
47
|
export type { TPktTextinputType, IPktTextinputBase, ITextinputSpecProps } from './textinput';
|
|
48
48
|
export type { TPktCounterPosition, IPktInputWrapperBase, IInputWrapperSpecProps, } from './input-wrapper';
|
|
49
|
-
export {
|
|
50
|
-
export
|
|
49
|
+
export type { TMessageboxSkin } from './skin';
|
|
50
|
+
export { TAG_SKINS, TAG_STATES, TAG_TEXT_STYLES, TAG_DEFAULTS } from './tag';
|
|
51
|
+
export type { TTagSkin, TTagState, TTagTextStyle, IPktTagBase, ITagSpecProps } from './tag';
|
|
51
52
|
export { MESSAGEBOX_SKINS, MESSAGEBOX_LIGHT_ONLY_SKINS, MESSAGEBOX_DEFAULTS } from './messagebox';
|
|
52
53
|
export type { IPktMessageboxBase, IMessageboxSpecProps } from './messagebox';
|
|
53
54
|
export { CALENDAR_DEFAULTS } from './calendar';
|
|
@@ -9,13 +9,4 @@ export { ALERT_SKINS, type TAlertSkin } from './alert';
|
|
|
9
9
|
export { ACCORDION_SKINS, type TAccordionSkin } from './accordion';
|
|
10
10
|
export { CARD_SKINS, type TCardSkin } from './card';
|
|
11
11
|
export { MESSAGEBOX_SKINS, type TMessageboxSkin } from './messagebox';
|
|
12
|
-
|
|
13
|
-
* Tag component skin variants — shared runtime source for types, specs and demo pages.
|
|
14
|
-
*/
|
|
15
|
-
export declare const TAG_SKINS: readonly ['gray', 'gray-light', 'blue-dark', 'blue', 'blue-light', 'blue-pale', 'green', 'green-light', 'red', 'red-light', 'yellow', 'yellow-light', 'beige', 'beige-light'];
|
|
16
|
-
export type TTagSkin = (typeof TAG_SKINS)[number];
|
|
17
|
-
/**
|
|
18
|
-
* Forces a tag into a visual state without the user interacting with it.
|
|
19
|
-
*/
|
|
20
|
-
export declare const TAG_STATES: readonly ['hover', 'focus', 'active'];
|
|
21
|
-
export type TTagState = (typeof TAG_STATES)[number];
|
|
12
|
+
export { TAG_SKINS, TAG_STATES, type TTagSkin, type TTagState } from './tag';
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* tag.ts
|
|
3
|
+
*
|
|
4
|
+
* Shared types and defaults for Tag, used by both React and Elements.
|
|
5
|
+
*/
|
|
6
|
+
import type { IPktStringsProps } from '../shared-strings';
|
|
7
|
+
import type { THTMLButtonType } from './form';
|
|
8
|
+
import type { TPktSizeBase } from './size';
|
|
9
|
+
/** Tag skins: shared runtime source for types, specs and demo pages. */
|
|
10
|
+
export declare const TAG_SKINS: readonly ['gray', 'gray-light', 'blue-dark', 'blue', 'blue-light', 'blue-pale', 'green', 'green-light', 'red', 'red-light', 'yellow', 'yellow-light', 'beige', 'beige-light'];
|
|
11
|
+
export type TTagSkin = (typeof TAG_SKINS)[number];
|
|
12
|
+
/** Forces a tag into a visual state without the user interacting with it. */
|
|
13
|
+
export declare const TAG_STATES: readonly ['hover', 'focus', 'active'];
|
|
14
|
+
export type TTagState = (typeof TAG_STATES)[number];
|
|
15
|
+
export declare const TAG_TEXT_STYLES: readonly ['normal-text', 'thin-text'];
|
|
16
|
+
export type TTagTextStyle = (typeof TAG_TEXT_STYLES)[number];
|
|
17
|
+
/**
|
|
18
|
+
* Framework-agnostic props for Tag.
|
|
19
|
+
*
|
|
20
|
+
* @remarks React adds `onClose` and `children`, and only accepts `type` when
|
|
21
|
+
* `closeTag` is `true`. Elements narrows `iconName` to `PktIconName` and
|
|
22
|
+
* dispatches a `close` event instead of `onClose`.
|
|
23
|
+
*/
|
|
24
|
+
export interface IPktTagBase extends IPktStringsProps<'tag'> {
|
|
25
|
+
closeTag?: boolean;
|
|
26
|
+
size?: TPktSizeBase;
|
|
27
|
+
skin?: TTagSkin;
|
|
28
|
+
state?: TTagState | null;
|
|
29
|
+
textStyle?: TTagTextStyle | null;
|
|
30
|
+
iconName?: string;
|
|
31
|
+
type?: THTMLButtonType;
|
|
32
|
+
ariaLabel?: string | null;
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* Props documented in the component spec (docs and Preview).
|
|
36
|
+
* The spec file is type-checked against this.
|
|
37
|
+
*/
|
|
38
|
+
export type ITagSpecProps = Pick<IPktTagBase, 'size' | 'iconName' | 'skin' | 'closeTag' | 'state' | 'textStyle' | 'type' | 'ariaLabel'>;
|
|
39
|
+
/** Default values, shared by React and Elements. */
|
|
40
|
+
export declare const TAG_DEFAULTS: {
|
|
41
|
+
readonly closeTag: false;
|
|
42
|
+
readonly size: 'medium';
|
|
43
|
+
readonly skin: 'gray';
|
|
44
|
+
readonly textStyle: 'normal-text';
|
|
45
|
+
readonly type: 'button';
|
|
46
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const e=require("./element-CEarCnHH.cjs"),t=require("./element-with-slot-CeKuRE3_.cjs")
|
|
1
|
+
const e=require("./element-CEarCnHH.cjs"),t=require("./element-with-slot-CeKuRE3_.cjs");require("./tag-BZdC0voc.cjs");const n=require("./if-defined-Ci4ZQsgL.cjs"),r=require("./consume-kEjgTrAp.cjs"),i=require("./provide-Cz18sYug.cjs"),a=require("./ref-B6p6mQkO.cjs");var o=r.n(Symbol(`pkt-tabs-context`)),s=class extends t.t{constructor(...e){super(...e),this.arrowNav=!0,this.disableArrowNav=!1,this.separatorIconName=``,this.separatorIconPath=``,this.tabRefs=[],this.disabledMap={},this.tabCount=0,this.context={useArrowNav:this.useArrowNav,registerTab:this.registerTab.bind(this),handleClick:this.handleClick.bind(this),handleKeyUp:this.handleKeyUp.bind(this)}}get useArrowNav(){return this.arrowNav&&!this.disableArrowNav}willUpdate(e){(e.has(`arrowNav`)||e.has(`disableArrowNav`))&&(this.context={...this.context,useArrowNav:this.useArrowNav})}updated(){this.updateComplete.then(()=>this.syncSeparators())}syncSeparators(){let e=this.querySelector(`.pkt-tabs__list`);if(!e||(e.querySelectorAll(`.pkt-tabs__separator`).forEach(e=>e.remove()),!(this.separatorIconName||this.separatorIconPath)))return;let t=Array.from(e.children).filter(e=>!e.classList.contains(`pkt-tabs__separator`));for(let e=0;e<t.length-1;e++){let n=document.createElement(`span`);if(n.className=`pkt-tabs__separator`,n.setAttribute(`aria-hidden`,`true`),n.setAttribute(`role`,`presentation`),this.separatorIconPath){let e=document.createElement(`img`);e.setAttribute(`src`,this.separatorIconPath),e.setAttribute(`alt`,``),e.setAttribute(`aria-hidden`,`true`),n.appendChild(e)}else if(this.separatorIconName){let e=document.createElement(`pkt-icon`);e.setAttribute(`name`,this.separatorIconName),e.classList.add(`pkt-tabs__separator-icon`),n.appendChild(e)}t[e].after(n)}}registerTab(e,t,n=!1){this.tabRefs[t]=e,this.disabledMap[t]=n,this.tabCount=Math.max(this.tabCount,t+1)}isTabDisabled(e){return!!this.disabledMap[e]}findEnabledIndex(e,t){let n=e+t;for(;n>=0&&n<this.tabCount;){if(!this.isTabDisabled(n))return n;n+=t}return null}handleClick(e){this.isTabDisabled(e)||this.dispatchEvent(new CustomEvent(`tab-selected`,{detail:{index:e},bubbles:!0,composed:!0}))}handleKeyUp(e,t){if(this.useArrowNav){if(e.key===`ArrowLeft`){e.preventDefault();let n=this.findEnabledIndex(t,-1);n!==null&&this.tabRefs[n]?.focus()}if(e.key===`ArrowRight`){e.preventDefault();let n=this.findEnabledIndex(t,1);n!==null&&this.tabRefs[n]?.focus()}(e.key===`Enter`||e.key===` `||e.key===`Spacebar`||e.key===`ArrowDown`)&&(e.preventDefault(),this.handleClick(t))}}render(){let n=this.useArrowNav?`tablist`:`navigation`,r=this.separatorIconName||this.separatorIconPath?`pkt-tabs pkt-tabs--with-separator`:`pkt-tabs`;return e._`
|
|
2
2
|
<div class=${r}>
|
|
3
3
|
<div class="pkt-tabs__list" role=${n}>${t.i(this)}</div>
|
|
4
4
|
</div>
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { _ as e, d as t, l as n, n as r, u as i } from "./element-DLgZkx5L.js";
|
|
2
2
|
import { i as a, t as o } from "./element-with-slot-mG-h7Sjw.js";
|
|
3
|
+
import "./tag-Cam7ISOF.js";
|
|
3
4
|
import { t as s } from "./if-defined-DiYi2v_Q.js";
|
|
4
5
|
import { n as c, t as l } from "./consume-Bp12si68.js";
|
|
5
6
|
import { t as u } from "./provide-_MnlMGnw.js";
|
|
6
7
|
import { n as d, t as f } from "./ref-BAegS9BR.js";
|
|
7
|
-
import "./tag-CkZ2Mn4a.js";
|
|
8
8
|
//#region src/components/tabs/tabs-context.ts
|
|
9
9
|
var p = c(Symbol("pkt-tabs-context")), m = class extends o {
|
|
10
10
|
constructor(...e) {
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs");require("./shared-types-BvRk9kiK.cjs"),require("./icon-5A378_yh.cjs");const i=require("./if-defined-Ci4ZQsgL.cjs");var a={closeTag:!1,size:`medium`,skin:`gray`,textStyle:`normal-text`,type:`button`},o=class extends r.t{constructor(){super(),this.closeTag=a.closeTag,this.size=a.size,this.skin=a.skin,this.state=null,this.textStyle=a.textStyle,this.iconName=void 0,this.type=a.type,this.ariaLabel=null,this.buttonTabindex=void 0,this._isClosed=!1,this._ariaDescription=null,this.close=e=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent(`close`,{detail:{origin:e},bubbles:!1,composed:!0})),this.dispatchEvent(new CustomEvent(`on-close`,{detail:{origin:e},bubbles:!1,composed:!0}))},this._isClosed=!1}willUpdate(e){if(super.willUpdate(e),this.closeTag&&!this.ariaLabel){let e=r.r(this).getNodes().map(e=>e.textContent??``).join(``).trim();e&&(this._ariaDescription=n.t(this.pktStrings.get(`tag`).remove,{label:e}))}}render(){let n={"pkt-tag":!0,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.state}`]:!!this.state,[`pkt-tag--${this.textStyle}`]:!!this.textStyle},a={"pkt-tag":!0,[`pkt-tag--${this.textStyle}`]:!!this.textStyle,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.state}`]:!!this.state,"pkt-hide":this._isClosed};return this.closeTag?e._`
|
|
2
|
+
<button
|
|
3
|
+
class=${t.t(a)}
|
|
4
|
+
type=${this.type}
|
|
5
|
+
tabindex=${i.t(this.buttonTabindex)}
|
|
6
|
+
@click=${this.close}
|
|
7
|
+
aria-label=${i.t(this.ariaLabel||void 0)}
|
|
8
|
+
aria-description=${i.t(this._ariaDescription||void 0)}
|
|
9
|
+
>
|
|
10
|
+
${this.iconName&&e._`<pkt-icon
|
|
11
|
+
class="pkt-tag__icon"
|
|
12
|
+
name=${this.iconName}
|
|
13
|
+
aria-hidden="true"
|
|
14
|
+
></pkt-icon>`}
|
|
15
|
+
<span>${r.i(this)}</span>
|
|
16
|
+
<pkt-icon class="pkt-tag__close-btn" name="close"></pkt-icon>
|
|
17
|
+
</button>
|
|
18
|
+
`:e._`
|
|
19
|
+
<span class=${t.t(n)}>
|
|
20
|
+
${this.iconName&&e._`<pkt-icon
|
|
21
|
+
class="pkt-tag__icon"
|
|
22
|
+
name=${this.iconName}
|
|
23
|
+
aria-hidden="true"
|
|
24
|
+
></pkt-icon>`}
|
|
25
|
+
<span>${r.i(this)}</span>
|
|
26
|
+
</span>
|
|
27
|
+
`}};e.n([e.u({type:Boolean,reflect:!0})],o.prototype,`closeTag`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`size`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`skin`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`state`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`textStyle`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`iconName`,void 0),e.n([e.u({type:String})],o.prototype,`type`,void 0),e.n([e.u({type:String})],o.prototype,`ariaLabel`,void 0),e.n([e.u({type:Number,attribute:`button-tabindex`})],o.prototype,`buttonTabindex`,void 0),e.n([e.l()],o.prototype,`_isClosed`,void 0),e.n([e.l()],o.prototype,`_ariaDescription`,void 0);try{e.d(`pkt-tag`)(o)}catch{console.warn(`Forsøker å definere <pkt-tag>, men den er allerede definert`)}var s=o;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return s}});
|
|
@@ -2,108 +2,19 @@ import { _ as e, d as t, l as n, n as r, u as i } from "./element-DLgZkx5L.js";
|
|
|
2
2
|
import { t as a } from "./class-map-BDwVSgLb.js";
|
|
3
3
|
import { t as o } from "./format-BTeSVkED.js";
|
|
4
4
|
import { i as s, r as c, t as l } from "./element-with-slot-mG-h7Sjw.js";
|
|
5
|
+
import "./shared-types-A6iGIX-f.js";
|
|
5
6
|
import "./icon-C1oCGwEe.js";
|
|
6
7
|
import { t as u } from "./if-defined-DiYi2v_Q.js";
|
|
8
|
+
//#region ../../shared-types/tag.ts
|
|
7
9
|
var d = {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
"
|
|
13
|
-
props: {
|
|
14
|
-
size: {
|
|
15
|
-
name: "Størrelse",
|
|
16
|
-
description: "Størrelsen på taggen",
|
|
17
|
-
required: !1,
|
|
18
|
-
default: "medium",
|
|
19
|
-
type: [
|
|
20
|
-
"small",
|
|
21
|
-
"medium",
|
|
22
|
-
"large"
|
|
23
|
-
],
|
|
24
|
-
category: "ui"
|
|
25
|
-
},
|
|
26
|
-
iconName: {
|
|
27
|
-
name: "Ikon",
|
|
28
|
-
description: "Navnet på ikonet som skal vises i taggen",
|
|
29
|
-
type: "icon",
|
|
30
|
-
required: !1,
|
|
31
|
-
category: "ui"
|
|
32
|
-
},
|
|
33
|
-
skin: {
|
|
34
|
-
name: "Utseende",
|
|
35
|
-
description: "Utseendet til taggen. Bare standardutseendet gray har dark mode.",
|
|
36
|
-
required: !1,
|
|
37
|
-
default: "gray",
|
|
38
|
-
type: [
|
|
39
|
-
"gray",
|
|
40
|
-
"gray-light",
|
|
41
|
-
"blue-dark",
|
|
42
|
-
"blue",
|
|
43
|
-
"blue-light",
|
|
44
|
-
"blue-pale",
|
|
45
|
-
"green",
|
|
46
|
-
"green-light",
|
|
47
|
-
"red",
|
|
48
|
-
"red-light",
|
|
49
|
-
"yellow",
|
|
50
|
-
"yellow-light",
|
|
51
|
-
"beige",
|
|
52
|
-
"beige-light"
|
|
53
|
-
],
|
|
54
|
-
category: "ui"
|
|
55
|
-
},
|
|
56
|
-
closeTag: {
|
|
57
|
-
name: "Lukk tag",
|
|
58
|
-
description: "Skal taggen ha en lukkeknapp?",
|
|
59
|
-
type: "boolean",
|
|
60
|
-
required: !1,
|
|
61
|
-
default: !1,
|
|
62
|
-
category: "ui"
|
|
63
|
-
},
|
|
64
|
-
state: {
|
|
65
|
-
name: "Tvungen tilstand",
|
|
66
|
-
description: "Viser taggen i en gitt tilstand uten at brukeren samhandler med den",
|
|
67
|
-
required: !1,
|
|
68
|
-
type: [
|
|
69
|
-
"hover",
|
|
70
|
-
"focus",
|
|
71
|
-
"active"
|
|
72
|
-
],
|
|
73
|
-
category: "ui"
|
|
74
|
-
},
|
|
75
|
-
textStyle: {
|
|
76
|
-
name: "Tekststil",
|
|
77
|
-
description: "Stilen på teksten i taggen",
|
|
78
|
-
required: !1,
|
|
79
|
-
default: "normal-text",
|
|
80
|
-
type: ["thin-text", "normal-text"],
|
|
81
|
-
category: "ui"
|
|
82
|
-
},
|
|
83
|
-
type: {
|
|
84
|
-
name: "Type, dersom lukkeknapp",
|
|
85
|
-
description: "Type tag, brukes for å spesifisere om det er en knapp, submit eller reset",
|
|
86
|
-
required: !1,
|
|
87
|
-
default: "button",
|
|
88
|
-
type: [
|
|
89
|
-
"button",
|
|
90
|
-
"submit",
|
|
91
|
-
"reset"
|
|
92
|
-
],
|
|
93
|
-
category: "tech"
|
|
94
|
-
},
|
|
95
|
-
ariaLabel: {
|
|
96
|
-
name: "aria-label",
|
|
97
|
-
description: "aria-label for taggen, brukes for tilgjengelighet",
|
|
98
|
-
type: "string",
|
|
99
|
-
required: !1,
|
|
100
|
-
category: "accessibility"
|
|
101
|
-
}
|
|
102
|
-
},
|
|
103
|
-
slots: { default: { description: "Teksten til tag" } }
|
|
10
|
+
closeTag: !1,
|
|
11
|
+
size: "medium",
|
|
12
|
+
skin: "gray",
|
|
13
|
+
textStyle: "normal-text",
|
|
14
|
+
type: "button"
|
|
104
15
|
}, f = class extends l {
|
|
105
16
|
constructor() {
|
|
106
|
-
super(), this.closeTag = d.
|
|
17
|
+
super(), this.closeTag = d.closeTag, this.size = d.size, this.skin = d.skin, this.state = null, this.textStyle = d.textStyle, this.iconName = void 0, this.type = d.type, this.ariaLabel = null, this.buttonTabindex = void 0, this._isClosed = !1, this._ariaDescription = null, this.close = (e) => {
|
|
107
18
|
this._isClosed = !0, this.dispatchEvent(new CustomEvent("close", {
|
|
108
19
|
detail: { origin: e },
|
|
109
20
|
bubbles: !1,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oslokommune/punkt-elements",
|
|
3
|
-
"version": "20.0.
|
|
3
|
+
"version": "20.0.3",
|
|
4
4
|
"description": "Komponentbiblioteket til Punkt, designsystem for Oslo kommune",
|
|
5
5
|
"homepage": "https://punkt.oslo.kommune.no",
|
|
6
6
|
"author": "Team Designsystem, Oslo kommune",
|
|
@@ -78,5 +78,5 @@
|
|
|
78
78
|
"engines": {
|
|
79
79
|
"node": "^22.19.0 || ^24.0.0 || ^26.0.0"
|
|
80
80
|
},
|
|
81
|
-
"gitHead": "
|
|
81
|
+
"gitHead": "719cdc9b7c8f19b488226316108b4d0fd5555c24"
|
|
82
82
|
}
|
|
@@ -48,6 +48,7 @@ describe('PktTag', () => {
|
|
|
48
48
|
expect(tag.size).toBe('medium')
|
|
49
49
|
expect(tag.skin).toBe('gray')
|
|
50
50
|
expect(tag.state).toBe(null)
|
|
51
|
+
expect(tag.textStyle).toBe('normal-text')
|
|
51
52
|
expect(tag.type).toBe('button')
|
|
52
53
|
})
|
|
53
54
|
|
|
@@ -156,6 +157,11 @@ describe('PktTag', () => {
|
|
|
156
157
|
})
|
|
157
158
|
|
|
158
159
|
describe('Text Style', () => {
|
|
160
|
+
test('applies normal-text class by default', async () => {
|
|
161
|
+
const { tag } = await createTagTest()
|
|
162
|
+
expect(tag.querySelector('.pkt-tag')).toHaveClass('pkt-tag--normal-text')
|
|
163
|
+
})
|
|
164
|
+
|
|
159
165
|
test('applies text style class when provided', async () => {
|
|
160
166
|
const { tag } = await createTagTest({ textStyle: 'thin-text' })
|
|
161
167
|
const tagElement = tag.querySelector('span') || tag.querySelector('button')
|
|
@@ -3,32 +3,26 @@ import { customElement, property, state } from 'lit/decorators.js'
|
|
|
3
3
|
import { html, PropertyValues } from 'lit'
|
|
4
4
|
import { PktElementWithSlot } from '@/base-elements/element-with-slot'
|
|
5
5
|
import { getSlotManager, slotContent } from '@/directives/slot-content'
|
|
6
|
-
import specs from 'componentSpecs/tag.json'
|
|
7
6
|
|
|
8
7
|
import '@/components/icon'
|
|
9
|
-
import
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
8
|
+
import {
|
|
9
|
+
TAG_DEFAULTS,
|
|
10
|
+
type IPktTagBase,
|
|
11
|
+
type THTMLButtonType,
|
|
12
|
+
type TTagSkin,
|
|
13
|
+
type TTagState,
|
|
14
|
+
type TTagTextStyle,
|
|
15
|
+
type TPktSizeBase,
|
|
15
16
|
} from 'shared-types'
|
|
16
17
|
import { PktIconName } from '@oslokommune/punkt-assets/dist/icons/icon'
|
|
17
18
|
import { ifDefined } from 'lit/directives/if-defined.js'
|
|
18
|
-
import { formatString
|
|
19
|
+
import { formatString } from 'shared-strings'
|
|
19
20
|
|
|
20
21
|
export type { TTagSkin, TTagState }
|
|
21
22
|
export type TTagType = THTMLButtonType
|
|
22
23
|
|
|
23
|
-
export interface IPktTag extends
|
|
24
|
-
closeTag?: boolean
|
|
25
|
-
size?: TPktSizeBase
|
|
26
|
-
skin?: TTagSkin
|
|
27
|
-
state?: TTagState | null
|
|
28
|
-
textStyle?: string | null
|
|
24
|
+
export interface IPktTag extends IPktTagBase {
|
|
29
25
|
iconName?: PktIconName
|
|
30
|
-
type?: TTagType
|
|
31
|
-
ariaLabel?: IAriaAttributes['aria-label'] | null
|
|
32
26
|
}
|
|
33
27
|
|
|
34
28
|
export class PktTag extends PktElementWithSlot<IPktTag> implements IPktTag {
|
|
@@ -40,14 +34,14 @@ export class PktTag extends PktElementWithSlot<IPktTag> implements IPktTag {
|
|
|
40
34
|
/**
|
|
41
35
|
* Element attributes
|
|
42
36
|
*/
|
|
43
|
-
@property({ type: Boolean, reflect: true }) closeTag: boolean =
|
|
44
|
-
@property({ type: String, reflect: true }) size: TPktSizeBase =
|
|
45
|
-
|
|
46
|
-
@property({ type: String, reflect: true }) skin: TTagSkin = specs.props.skin.default as TTagSkin
|
|
37
|
+
@property({ type: Boolean, reflect: true }) closeTag: boolean = TAG_DEFAULTS.closeTag
|
|
38
|
+
@property({ type: String, reflect: true }) size: TPktSizeBase = TAG_DEFAULTS.size
|
|
39
|
+
@property({ type: String, reflect: true }) skin: TTagSkin = TAG_DEFAULTS.skin
|
|
47
40
|
@property({ type: String, reflect: true }) state: TTagState | null = null
|
|
48
|
-
@property({ type: String, reflect: true }) textStyle:
|
|
41
|
+
@property({ type: String, reflect: true }) textStyle: TTagTextStyle | null =
|
|
42
|
+
TAG_DEFAULTS.textStyle
|
|
49
43
|
@property({ type: String, reflect: true }) iconName: string | undefined = undefined
|
|
50
|
-
@property({ type: String }) type: TTagType =
|
|
44
|
+
@property({ type: String }) type: TTagType = TAG_DEFAULTS.type
|
|
51
45
|
@property({ type: String }) ariaLabel: string | null = null
|
|
52
46
|
@property({ type: Number, attribute: 'button-tabindex' }) buttonTabindex: number | undefined =
|
|
53
47
|
undefined
|
|
@@ -85,7 +79,7 @@ export class PktTag extends PktElementWithSlot<IPktTag> implements IPktTag {
|
|
|
85
79
|
this.dispatchEvent(
|
|
86
80
|
new CustomEvent('close', { detail: { origin: event }, bubbles: false, composed: true }),
|
|
87
81
|
)
|
|
88
|
-
//
|
|
82
|
+
// Deprecated: beholdt for eldre Vue-oppsett. Bruk `close`, `on-close` fjernes i en senere hovedversjon.
|
|
89
83
|
this.dispatchEvent(
|
|
90
84
|
new CustomEvent('on-close', { detail: { origin: event }, bubbles: false, composed: true }),
|
|
91
85
|
)
|
package/dist/tag-1SSexs0H.cjs
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
const e=require("./element-CEarCnHH.cjs"),t=require("./class-map-C82GtM1w.cjs"),n=require("./format-B8meU8Tm.cjs"),r=require("./element-with-slot-CeKuRE3_.cjs");require("./icon-5A378_yh.cjs");const i=require("./if-defined-Ci4ZQsgL.cjs");var a={name:`pkt-tag`,react:`PktTag`,"css-class":`pkt-tag`,isElement:!0,"dark-mode":!0,props:{size:{name:`Størrelse`,description:`Størrelsen på taggen`,required:!1,default:`medium`,type:[`small`,`medium`,`large`],category:`ui`},iconName:{name:`Ikon`,description:`Navnet på ikonet som skal vises i taggen`,type:`icon`,required:!1,category:`ui`},skin:{name:`Utseende`,description:`Utseendet til taggen. Bare standardutseendet gray har dark mode.`,required:!1,default:`gray`,type:[`gray`,`gray-light`,`blue-dark`,`blue`,`blue-light`,`blue-pale`,`green`,`green-light`,`red`,`red-light`,`yellow`,`yellow-light`,`beige`,`beige-light`],category:`ui`},closeTag:{name:`Lukk tag`,description:`Skal taggen ha en lukkeknapp?`,type:`boolean`,required:!1,default:!1,category:`ui`},state:{name:`Tvungen tilstand`,description:`Viser taggen i en gitt tilstand uten at brukeren samhandler med den`,required:!1,type:[`hover`,`focus`,`active`],category:`ui`},textStyle:{name:`Tekststil`,description:`Stilen på teksten i taggen`,required:!1,default:`normal-text`,type:[`thin-text`,`normal-text`],category:`ui`},type:{name:`Type, dersom lukkeknapp`,description:`Type tag, brukes for å spesifisere om det er en knapp, submit eller reset`,required:!1,default:`button`,type:[`button`,`submit`,`reset`],category:`tech`},ariaLabel:{name:`aria-label`,description:`aria-label for taggen, brukes for tilgjengelighet`,type:`string`,required:!1,category:`accessibility`}},slots:{default:{description:`Teksten til tag`}}},o=class extends r.t{constructor(){super(),this.closeTag=a.props.closeTag.default,this.size=a.props.size.default,this.skin=a.props.skin.default,this.state=null,this.textStyle=null,this.iconName=void 0,this.type=a.props.type.default,this.ariaLabel=null,this.buttonTabindex=void 0,this._isClosed=!1,this._ariaDescription=null,this.close=e=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent(`close`,{detail:{origin:e},bubbles:!1,composed:!0})),this.dispatchEvent(new CustomEvent(`on-close`,{detail:{origin:e},bubbles:!1,composed:!0}))},this._isClosed=!1}willUpdate(e){if(super.willUpdate(e),this.closeTag&&!this.ariaLabel){let e=r.r(this).getNodes().map(e=>e.textContent??``).join(``).trim();e&&(this._ariaDescription=n.t(this.pktStrings.get(`tag`).remove,{label:e}))}}render(){let n={"pkt-tag":!0,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.state}`]:!!this.state,[`pkt-tag--${this.textStyle}`]:!!this.textStyle},a={"pkt-tag":!0,[`pkt-tag--${this.textStyle}`]:!!this.textStyle,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.state}`]:!!this.state,"pkt-hide":this._isClosed};return this.closeTag?e._`
|
|
2
|
-
<button
|
|
3
|
-
class=${t.t(a)}
|
|
4
|
-
type=${this.type}
|
|
5
|
-
tabindex=${i.t(this.buttonTabindex)}
|
|
6
|
-
@click=${this.close}
|
|
7
|
-
aria-label=${i.t(this.ariaLabel||void 0)}
|
|
8
|
-
aria-description=${i.t(this._ariaDescription||void 0)}
|
|
9
|
-
>
|
|
10
|
-
${this.iconName&&e._`<pkt-icon
|
|
11
|
-
class="pkt-tag__icon"
|
|
12
|
-
name=${this.iconName}
|
|
13
|
-
aria-hidden="true"
|
|
14
|
-
></pkt-icon>`}
|
|
15
|
-
<span>${r.i(this)}</span>
|
|
16
|
-
<pkt-icon class="pkt-tag__close-btn" name="close"></pkt-icon>
|
|
17
|
-
</button>
|
|
18
|
-
`:e._`
|
|
19
|
-
<span class=${t.t(n)}>
|
|
20
|
-
${this.iconName&&e._`<pkt-icon
|
|
21
|
-
class="pkt-tag__icon"
|
|
22
|
-
name=${this.iconName}
|
|
23
|
-
aria-hidden="true"
|
|
24
|
-
></pkt-icon>`}
|
|
25
|
-
<span>${r.i(this)}</span>
|
|
26
|
-
</span>
|
|
27
|
-
`}};e.n([e.u({type:Boolean,reflect:!0})],o.prototype,`closeTag`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`size`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`skin`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`state`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`textStyle`,void 0),e.n([e.u({type:String,reflect:!0})],o.prototype,`iconName`,void 0),e.n([e.u({type:String})],o.prototype,`type`,void 0),e.n([e.u({type:String})],o.prototype,`ariaLabel`,void 0),e.n([e.u({type:Number,attribute:`button-tabindex`})],o.prototype,`buttonTabindex`,void 0),e.n([e.l()],o.prototype,`_isClosed`,void 0),e.n([e.l()],o.prototype,`_ariaDescription`,void 0);try{e.d(`pkt-tag`)(o)}catch{console.warn(`Forsøker å definere <pkt-tag>, men den er allerede definert`)}var s=o;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return s}});
|