@oslokommune/punkt-elements 12.18.9 → 12.18.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/pkt-index.cjs +1 -1
- package/dist/pkt-index.js +1 -1
- package/dist/pkt-select.cjs +1 -1
- package/dist/pkt-select.js +1 -1
- package/dist/{select-CmyHJEsw.cjs → select-Bz4TH4OJ.cjs} +9 -5
- package/dist/{select-D5MTPqd0.js → select-Djqz3LXr.js} +30 -24
- package/package.json +2 -2
- package/src/components/select/select.ts +9 -1
package/dist/pkt-index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./alert-DfjFhisP.cjs"),u=require("./calendar-QSulz7im.cjs"),d=require("./card-DY2rbosk.cjs"),t=require("./icon-CdMQ6zBT.cjs"),k=require("./pkt-slot-controller-mHT3foJ4.cjs"),i=require("./ref-DCOsLZQg.cjs"),P=require("./class-map-Boa7BqCc.cjs"),b=require("./datepicker-BoXR-BiS.cjs"),g=require("./helptext-iZEgxz2U.cjs"),h=require("./input-wrapper-BKTwBjxo.cjs"),m=require("./link-DTldg4W2.cjs"),f=require("./linkcard-C5GUN22k.cjs"),y=require("./messagebox-DLsgkPtN.cjs"),v=require("./modal-B-n1mhZ1.cjs"),x=require("./progressbar-CuXkbAhJ.cjs"),C=require("./tag-Du8P8YIp.cjs"),O=require("./textarea-CJauH-oJ.cjs"),j=require("./textinput-CDvSlCLl.cjs"),q=require("./select-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./alert-DfjFhisP.cjs"),u=require("./calendar-QSulz7im.cjs"),d=require("./card-DY2rbosk.cjs"),t=require("./icon-CdMQ6zBT.cjs"),k=require("./pkt-slot-controller-mHT3foJ4.cjs"),i=require("./ref-DCOsLZQg.cjs"),P=require("./class-map-Boa7BqCc.cjs"),b=require("./datepicker-BoXR-BiS.cjs"),g=require("./helptext-iZEgxz2U.cjs"),h=require("./input-wrapper-BKTwBjxo.cjs"),m=require("./link-DTldg4W2.cjs"),f=require("./linkcard-C5GUN22k.cjs"),y=require("./messagebox-DLsgkPtN.cjs"),v=require("./modal-B-n1mhZ1.cjs"),x=require("./progressbar-CuXkbAhJ.cjs"),C=require("./tag-Du8P8YIp.cjs"),O=require("./textarea-CJauH-oJ.cjs"),j=require("./textinput-CDvSlCLl.cjs"),q=require("./select-Bz4TH4OJ.cjs");var S=Object.defineProperty,$=Object.getOwnPropertyDescriptor,o=(a,e,r,s)=>{for(var n=s>1?void 0:s?$(e,r):e,l=a.length-1,p;l>=0;l--)(p=a[l])&&(n=(s?p(e,r,n):p(n))||n);return s&&n&&S(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=i.e(),this.namedSlot=i.e(),this.slotController=new k.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
|
|
2
2
|
<div class="${P.e(e)}">
|
|
3
3
|
<h1 class="pkt-txt-28">${this.string}</h1>
|
|
4
4
|
|
package/dist/pkt-index.js
CHANGED
|
@@ -18,7 +18,7 @@ import { P as V } from "./progressbar-BS_oawSB.js";
|
|
|
18
18
|
import { P as Y } from "./tag-DlnEKEym.js";
|
|
19
19
|
import { P as tt } from "./textarea-CRHf9Jri.js";
|
|
20
20
|
import { P as rt } from "./textinput-D46zLo13.js";
|
|
21
|
-
import { P as ot } from "./select-
|
|
21
|
+
import { P as ot } from "./select-Djqz3LXr.js";
|
|
22
22
|
var g = Object.defineProperty, v = Object.getOwnPropertyDescriptor, o = (t, e, i, a) => {
|
|
23
23
|
for (var r = a > 1 ? void 0 : a ? v(e, i) : e, p = t.length - 1, l; p >= 0; p--)
|
|
24
24
|
(l = t[p]) && (r = (a ? l(e, i, r) : l(r)) || r);
|
package/dist/pkt-select.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./select-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./select-Bz4TH4OJ.cjs"),t=e.PktSelect;Object.defineProperty(exports,"PktSelect",{enumerable:!0,get:()=>e.PktSelect});exports.default=t;
|
package/dist/pkt-select.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const
|
|
1
|
+
"use strict";const l=require("./icon-CdMQ6zBT.cjs"),d=require("./state-SKYD8kRO.cjs"),a=require("./ref-DCOsLZQg.cjs"),o=require("./if-defined-DEDlGbAc.cjs"),u=require("./input-element-BxMdqhqV.cjs");require("./input-wrapper-BKTwBjxo.cjs");class c{constructor(t){this.nodes=[],this.options=[],this.host=t,this.host.addController(this),this.nodes=[],this.options=[],this.observer=new MutationObserver(s=>this.handleMutations(s))}hostConnected(){Array.from(this.host.childNodes).forEach(t=>{(t.nodeName==="OPTION"||t.nodeName==="DATA")&&this.addNode(t)}),this.observer.observe(this.host,{childList:!0})}hostDisconnected(){this.observer.disconnect()}addNode(t){(t.nodeName==="OPTION"||t.nodeName==="DATA")&&(t.setAttribute("class","pkt-hide"),this.nodes.push(t))}createOptions(){this.options=this.nodes.map(t=>({value:t.getAttribute("value")||t.textContent||"",label:t.textContent||t.getAttribute("value")||"",selected:!!t.getAttribute("selected"),disabled:!!t.getAttribute("disabled")})),this.host.setAttribute("options",JSON.stringify(this.options))}handleMutations(t){let s=!1;t.forEach(e=>{e.addedNodes.forEach(i=>{(i.nodeName==="OPTION"||i.nodeName==="DATA")&&(this.addNode(i),s=!0)}),e.removedNodes.forEach(i=>{(i.nodeName==="OPTION"||i.nodeName==="DATA")&&(this.nodes=this.nodes.filter(r=>r!==i),s=!0)})}),s&&this.createOptions()}}var b=Object.defineProperty,f=Object.getOwnPropertyDescriptor,h=(n,t,s,e)=>{for(var i=e>1?void 0:e?f(t,s):t,r=n.length-1,p;r>=0;r--)(p=n[r])&&(i=(e?p(t,s,i):p(i))||i);return e&&i&&b(t,s,i),i};exports.PktSelect=class extends u.PktInputElement{constructor(){super(),this.selectRef=a.e(),this.defaultSlot=a.e(),this.options=[],this.value="",this._options=[],this.optionsController=new c(this)}connectedCallback(){super.connectedCallback();const t=this.options.length>0,s=this.optionsController.nodes.length&&this.optionsController.nodes.length>0;!t&&s?this.optionsController.nodes.forEach(e=>{if(!e.textContent&&!e.getAttribute("value"))return null;const i={value:e.getAttribute("value")||e.textContent||"",label:e.textContent||e.getAttribute("value")||"",disabled:!!e.getAttribute("disabled")};e.getAttribute("selected")&&!this.value&&(this.value=i.value),this._options.push(i)}):this._options=this.options}attributeChangedCallback(t,s,e){t==="options"&&(this._options=e?JSON.parse(e):[]),super.attributeChangedCallback(t,s,e)}firstUpdated(t){super.firstUpdated(t),this.options.length&&(this._options=this.options)}render(){const t=`pkt-input ${this.fullwidth?"pkt-input--fullwidth":""}`;return l.x`
|
|
2
2
|
<pkt-input-wrapper
|
|
3
3
|
?counter=${this.counter}
|
|
4
4
|
?disabled=${this.disabled}
|
|
@@ -29,12 +29,16 @@
|
|
|
29
29
|
id=${this.id}
|
|
30
30
|
name=${this.name||this.id}
|
|
31
31
|
value=${this.value}
|
|
32
|
-
${
|
|
33
|
-
${
|
|
32
|
+
${a.n(this.selectRef)}
|
|
33
|
+
${a.n(this.defaultSlot)}
|
|
34
34
|
>
|
|
35
|
-
${this._options.length>0&&this._options.map(s=>
|
|
35
|
+
${this._options.length>0&&this._options.map(s=>l.x`<option
|
|
36
|
+
value=${s.value}
|
|
37
|
+
?selected=${this.value==s.value}
|
|
38
|
+
?disabled=${s.disabled}
|
|
39
|
+
>
|
|
36
40
|
${s.label}
|
|
37
41
|
</option>`)}
|
|
38
42
|
</select>
|
|
39
43
|
</pkt-input-wrapper>
|
|
40
|
-
`}};h([
|
|
44
|
+
`}};h([l.n({type:Array})],exports.PktSelect.prototype,"options",2);h([l.n({type:String})],exports.PktSelect.prototype,"value",2);h([d.r()],exports.PktSelect.prototype,"_options",2);exports.PktSelect=h([l.t("pkt-select")],exports.PktSelect);
|
|
@@ -28,21 +28,22 @@ class v {
|
|
|
28
28
|
})), this.host.setAttribute("options", JSON.stringify(this.options));
|
|
29
29
|
}
|
|
30
30
|
handleMutations(t) {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
31
|
+
let e = !1;
|
|
32
|
+
t.forEach((o) => {
|
|
33
|
+
o.addedNodes.forEach((s) => {
|
|
34
|
+
(s.nodeName === "OPTION" || s.nodeName === "DATA") && (this.addNode(s), e = !0);
|
|
35
|
+
}), o.removedNodes.forEach((s) => {
|
|
36
|
+
(s.nodeName === "OPTION" || s.nodeName === "DATA") && (this.nodes = this.nodes.filter((a) => a !== s), e = !0);
|
|
36
37
|
});
|
|
37
|
-
}), this.createOptions();
|
|
38
|
+
}), e && this.createOptions();
|
|
38
39
|
}
|
|
39
40
|
}
|
|
40
|
-
var
|
|
41
|
-
for (var
|
|
42
|
-
(
|
|
43
|
-
return
|
|
41
|
+
var g = Object.defineProperty, m = Object.getOwnPropertyDescriptor, n = (i, t, e, o) => {
|
|
42
|
+
for (var s = o > 1 ? void 0 : o ? m(t, e) : t, a = i.length - 1, h; a >= 0; a--)
|
|
43
|
+
(h = i[a]) && (s = (o ? h(t, e, s) : h(s)) || s);
|
|
44
|
+
return o && s && g(t, e, s), s;
|
|
44
45
|
};
|
|
45
|
-
let
|
|
46
|
+
let l = class extends $ {
|
|
46
47
|
constructor() {
|
|
47
48
|
super(), this.selectRef = d(), this.defaultSlot = d(), this.options = [], this.value = "", this._options = [], this.optionsController = new v(this);
|
|
48
49
|
}
|
|
@@ -52,11 +53,12 @@ let n = class extends $ {
|
|
|
52
53
|
const i = this.options.length > 0, t = this.optionsController.nodes.length && this.optionsController.nodes.length > 0;
|
|
53
54
|
!i && t ? this.optionsController.nodes.forEach((e) => {
|
|
54
55
|
if (!e.textContent && !e.getAttribute("value")) return null;
|
|
55
|
-
const
|
|
56
|
+
const o = {
|
|
56
57
|
value: e.getAttribute("value") || e.textContent || "",
|
|
57
|
-
label: e.textContent || e.getAttribute("value") || ""
|
|
58
|
+
label: e.textContent || e.getAttribute("value") || "",
|
|
59
|
+
disabled: !!e.getAttribute("disabled")
|
|
58
60
|
};
|
|
59
|
-
this._options.push(
|
|
61
|
+
e.getAttribute("selected") && !this.value && (this.value = o.value), this._options.push(o);
|
|
60
62
|
}) : this._options = this.options;
|
|
61
63
|
}
|
|
62
64
|
attributeChangedCallback(i, t, e) {
|
|
@@ -102,7 +104,11 @@ let n = class extends $ {
|
|
|
102
104
|
${u(this.defaultSlot)}
|
|
103
105
|
>
|
|
104
106
|
${this._options.length > 0 && this._options.map(
|
|
105
|
-
(t) => p`<option
|
|
107
|
+
(t) => p`<option
|
|
108
|
+
value=${t.value}
|
|
109
|
+
?selected=${this.value == t.value}
|
|
110
|
+
?disabled=${t.disabled}
|
|
111
|
+
>
|
|
106
112
|
${t.label}
|
|
107
113
|
</option>`
|
|
108
114
|
)}
|
|
@@ -111,18 +117,18 @@ let n = class extends $ {
|
|
|
111
117
|
`;
|
|
112
118
|
}
|
|
113
119
|
};
|
|
114
|
-
|
|
120
|
+
n([
|
|
115
121
|
c({ type: Array })
|
|
116
|
-
],
|
|
117
|
-
|
|
122
|
+
], l.prototype, "options", 2);
|
|
123
|
+
n([
|
|
118
124
|
c({ type: String })
|
|
119
|
-
],
|
|
120
|
-
|
|
125
|
+
], l.prototype, "value", 2);
|
|
126
|
+
n([
|
|
121
127
|
f()
|
|
122
|
-
],
|
|
123
|
-
|
|
128
|
+
], l.prototype, "_options", 2);
|
|
129
|
+
l = n([
|
|
124
130
|
b("pkt-select")
|
|
125
|
-
],
|
|
131
|
+
], l);
|
|
126
132
|
export {
|
|
127
|
-
|
|
133
|
+
l as P
|
|
128
134
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oslokommune/punkt-elements",
|
|
3
|
-
"version": "12.18.
|
|
3
|
+
"version": "12.18.11",
|
|
4
4
|
"description": "Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo",
|
|
5
5
|
"homepage": "https://punkt.oslo.kommune.no",
|
|
6
6
|
"author": "Team Designsystem, Oslo Origo",
|
|
@@ -57,5 +57,5 @@
|
|
|
57
57
|
"url": "https://github.com/oslokommune/punkt/issues"
|
|
58
58
|
},
|
|
59
59
|
"license": "MIT",
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "8a210e2160405aeef55732bc90c860fa2d0f66bb"
|
|
61
61
|
}
|
|
@@ -58,6 +58,10 @@ export class PktSelect extends PktInputElement implements IPktSelect {
|
|
|
58
58
|
const option: TSelectOption = {
|
|
59
59
|
value: node.getAttribute('value') || node.textContent || '',
|
|
60
60
|
label: node.textContent || node.getAttribute('value') || '',
|
|
61
|
+
disabled: !!node.getAttribute('disabled'),
|
|
62
|
+
}
|
|
63
|
+
if (node.getAttribute('selected') && !this.value) {
|
|
64
|
+
this.value = option.value
|
|
61
65
|
}
|
|
62
66
|
this._options.push(option)
|
|
63
67
|
})
|
|
@@ -120,7 +124,11 @@ export class PktSelect extends PktInputElement implements IPktSelect {
|
|
|
120
124
|
${this._options.length > 0 &&
|
|
121
125
|
this._options.map(
|
|
122
126
|
(option) =>
|
|
123
|
-
html`<option
|
|
127
|
+
html`<option
|
|
128
|
+
value=${option.value}
|
|
129
|
+
?selected=${this.value == option.value}
|
|
130
|
+
?disabled=${option.disabled}
|
|
131
|
+
>
|
|
124
132
|
${option.label}
|
|
125
133
|
</option>`,
|
|
126
134
|
)}
|