@oslokommune/punkt-elements 16.7.3 → 16.7.7
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 +35 -0
- package/dist/accordion-BB1JrONI.cjs +34 -0
- package/dist/accordion-nNH87Y60.js +130 -0
- package/dist/alert-BEEnTiCb.cjs +33 -0
- package/dist/alert-ePJuDtmm.js +171 -0
- package/dist/async-directive-B9P1Qa0k.cjs +1 -0
- package/dist/async-directive-CaQiqjyV.js +55 -0
- package/dist/backlink-Ba03LlbB.cjs +13 -0
- package/dist/backlink-CiwXrQYD.js +38 -0
- package/dist/booleanish-BmcOU-43.js +11 -0
- package/dist/booleanish-jJLlnr6-.cjs +1 -0
- package/dist/breadcrumbs-CD1zib3s.cjs +43 -0
- package/dist/breadcrumbs-CpuVqWhF.js +76 -0
- package/dist/button-BIpd1xJh.js +95 -0
- package/dist/button-D-TOBaJB.cjs +27 -0
- package/dist/calendar-BzEtOJla.js +2031 -0
- package/dist/calendar-E5jJLt8D.cjs +90 -0
- package/dist/card-BYJu1MYm.js +339 -0
- package/dist/card-CUFhMVim.cjs +87 -0
- package/dist/checkbox-BARDb9iV.cjs +31 -0
- package/dist/checkbox-Cspxcvt_.js +111 -0
- package/dist/class-map-C8HuhNzZ.js +27 -0
- package/dist/class-map-CJ-msbHs.cjs +1 -0
- package/dist/classutils-DEL164Ur.js +7 -0
- package/dist/classutils-z8YsPlOf.cjs +1 -0
- package/dist/combobox-BcdLZRDU.js +984 -0
- package/dist/combobox-CGbFTWq_.cjs +135 -0
- package/dist/consent-DeB_5sWH.js +197 -0
- package/dist/consent-hwu7pp3S.cjs +11 -0
- package/dist/datepicker-DpmlsnH_.cjs +273 -0
- package/dist/datepicker-OVd8pmnZ.js +1125 -0
- package/dist/dialog-polyfill.esm-1hPr0gl9.js +280 -0
- package/dist/dialog-polyfill.esm-D3Oinvk0.cjs +1 -0
- package/dist/directive-3THFsVew.js +28 -0
- package/dist/directive-CJ2giQBZ.cjs +1 -0
- package/dist/directive-helpers-D1QSxY17.cjs +1 -0
- package/dist/directive-helpers-Dkv2gKgs.js +25 -0
- package/dist/element-DjtxO-1r.cjs +2 -0
- package/dist/element-cZ85T_aa.js +693 -0
- package/dist/element-with-slot-4J2o3SeU.js +166 -0
- package/dist/element-with-slot-CWoTGA1B.cjs +1 -0
- package/dist/header-DWgPgGfS.cjs +304 -0
- package/dist/header-a6ztVNp3.js +782 -0
- package/dist/heading-BgSWIRii.cjs +1 -0
- package/dist/heading-DiQLPxdf.js +73 -0
- package/dist/helptext-CCBKKLus.js +65 -0
- package/dist/helptext-D-3QfZv5.cjs +24 -0
- package/dist/icon-Co72KtgF.js +86 -0
- package/dist/icon-Dr8sfT2X.cjs +1 -0
- package/dist/if-defined-Cjj8qN-Z.js +5 -0
- package/dist/if-defined-XKOD_t_V.cjs +1 -0
- package/dist/index.d.ts +1 -2
- package/dist/input-element-B1yxcfz4.cjs +1 -0
- package/dist/input-element-Bw1s6NlF.js +643 -0
- package/dist/input-wrapper-BRuVELpK.cjs +54 -0
- package/dist/input-wrapper-CDyHTR1V.js +164 -0
- package/dist/input-wrapper-Dwd-_sKm.cjs +1 -0
- package/dist/input-wrapper-YfTmpSSY.js +117 -0
- package/dist/link-CKAFMz9j.js +89 -0
- package/dist/link-CyTCpI0k.cjs +7 -0
- package/dist/linkcard-B0KOGaGj.js +55 -0
- package/dist/linkcard-BE4-FewK.cjs +13 -0
- package/dist/listbox-DCA2JoPV.cjs +106 -0
- package/dist/listbox-DuBgTFvH.js +397 -0
- package/dist/loader-6kFZUErT.js +66 -0
- package/dist/loader-CX2rsC01.cjs +16 -0
- package/dist/messagebox-Cwlg5sOr.js +110 -0
- package/dist/messagebox-Din9X53b.cjs +13 -0
- package/dist/modal-C_wtsh9m.js +209 -0
- package/dist/modal-DS_wUOIv.cjs +36 -0
- package/dist/pkt-accordion.cjs +1 -1
- package/dist/pkt-accordion.js +2 -7
- package/dist/pkt-alert.cjs +1 -1
- package/dist/pkt-alert.js +2 -5
- package/dist/pkt-backlink.cjs +1 -1
- package/dist/pkt-backlink.js +2 -5
- package/dist/pkt-breadcrumbs.cjs +1 -43
- package/dist/pkt-breadcrumbs.js +2 -81
- package/dist/pkt-button.cjs +1 -1
- package/dist/pkt-button.js +2 -5
- package/dist/pkt-calendar.cjs +1 -1
- package/dist/pkt-calendar.js +2 -5
- package/dist/pkt-card.cjs +1 -1
- package/dist/pkt-card.js +2 -5
- package/dist/pkt-checkbox.cjs +1 -1
- package/dist/pkt-checkbox.js +2 -5
- package/dist/pkt-combobox.cjs +1 -1
- package/dist/pkt-combobox.js +2 -5
- package/dist/pkt-consent.cjs +1 -1
- package/dist/pkt-consent.js +2 -5
- package/dist/pkt-datepicker.cjs +1 -1
- package/dist/pkt-datepicker.js +5 -9
- package/dist/pkt-header.cjs +1 -304
- package/dist/pkt-header.js +2 -861
- package/dist/pkt-heading.cjs +1 -1
- package/dist/pkt-heading.js +2 -5
- package/dist/pkt-helptext.cjs +1 -1
- package/dist/pkt-helptext.js +2 -5
- package/dist/pkt-icon.cjs +1 -1
- package/dist/pkt-icon.js +2 -5
- package/dist/pkt-index.cjs +1 -1
- package/dist/pkt-index.js +30 -66
- package/dist/pkt-input-wrapper.cjs +1 -1
- package/dist/pkt-input-wrapper.js +2 -5
- package/dist/pkt-link.cjs +1 -1
- package/dist/pkt-link.js +2 -5
- package/dist/pkt-linkcard.cjs +1 -1
- package/dist/pkt-linkcard.js +2 -5
- package/dist/pkt-listbox.cjs +1 -1
- package/dist/pkt-listbox.js +2 -5
- package/dist/pkt-loader.cjs +1 -1
- package/dist/pkt-loader.js +2 -5
- package/dist/pkt-messagebox.cjs +1 -1
- package/dist/pkt-messagebox.js +2 -5
- package/dist/pkt-modal.cjs +1 -1
- package/dist/pkt-modal.js +2 -5
- package/dist/pkt-options-controller-CRrI6WMk.js +43 -0
- package/dist/pkt-options-controller-CXUGx134.cjs +1 -0
- package/dist/pkt-progressbar.cjs +1 -1
- package/dist/pkt-progressbar.js +2 -5
- package/dist/pkt-radiobutton.cjs +1 -1
- package/dist/pkt-radiobutton.js +2 -5
- package/dist/pkt-select.cjs +1 -1
- package/dist/pkt-select.js +2 -5
- package/dist/pkt-tabs.cjs +1 -1
- package/dist/pkt-tabs.js +2 -7
- package/dist/pkt-tag.cjs +1 -1
- package/dist/pkt-tag.js +2 -5
- package/dist/pkt-textarea.cjs +1 -1
- package/dist/pkt-textarea.js +2 -5
- package/dist/pkt-textinput.cjs +1 -1
- package/dist/pkt-textinput.js +2 -5
- package/dist/pkt-timepicker.cjs +1 -191
- package/dist/pkt-timepicker.js +2 -560
- package/dist/progressbar-CdXtmOBb.cjs +17 -0
- package/dist/progressbar-Dy9AiYQz.js +113 -0
- package/dist/radiobutton-GOnpUbCW.cjs +31 -0
- package/dist/radiobutton-V_KPbup_.js +84 -0
- package/dist/ref-BaJ0mBT_.cjs +1 -0
- package/dist/ref-RS8Uv6uC.js +30 -0
- package/dist/repeat-Cepr3469.js +57 -0
- package/dist/repeat-CqcDYBxr.cjs +1 -0
- package/dist/select-BSAFd8Wa.js +164 -0
- package/dist/select-C2i8sOk5.cjs +49 -0
- package/dist/tabs-D8nL9rWx.cjs +37 -0
- package/dist/tabs-Y7utmJi9.js +318 -0
- package/dist/tag-DLthw5b4.cjs +27 -0
- package/dist/tag-VwykmuQR.js +179 -0
- package/dist/textarea-D7aGOyDf.cjs +46 -0
- package/dist/textarea-DYOBhJrN.js +115 -0
- package/dist/textinput-BUgntXnM.js +124 -0
- package/dist/textinput-DFh8_9cx.cjs +70 -0
- package/dist/timepicker-BIfE7KKJ.cjs +191 -0
- package/dist/timepicker-DaSwn1FA.js +503 -0
- package/dist/utils-CUqCKGvp.js +7 -0
- package/dist/utils-CjAbIttF.cjs +1 -0
- package/package.json +6 -6
- package/src/components/alert/alert.test.ts +1 -1
- package/src/components/alert/alert.ts +6 -6
- package/src/components/datepicker/datepicker-utils.test.ts +16 -23
- package/dist/accordionitem-_9AiCIvd.cjs +0 -34
- package/dist/accordionitem-dCfSrxh5.js +0 -140
- package/dist/alert-BtOk8yRH.cjs +0 -33
- package/dist/alert-DlY2_grU.js +0 -117
- package/dist/async-directive-CMzWMlZ5.js +0 -65
- package/dist/async-directive-DoMuclel.cjs +0 -5
- package/dist/backlink-Ce5Vldop.js +0 -49
- package/dist/backlink-y3dwjKPC.cjs +0 -13
- package/dist/booleanish-BKVonob4.cjs +0 -1
- package/dist/booleanish-C9R0tdXH.js +0 -11
- package/dist/button-B_TXwNzt.cjs +0 -27
- package/dist/button-BiY-wlKF.js +0 -139
- package/dist/calendar-B2pji2zn.cjs +0 -90
- package/dist/calendar-DhjQDC4C.js +0 -2140
- package/dist/card-BwMNB5Bb.cjs +0 -87
- package/dist/card-CGlmcMSR.js +0 -233
- package/dist/checkbox-BsJZYA26.js +0 -147
- package/dist/checkbox-CTY8f_qn.cjs +0 -31
- package/dist/class-map-CEnykyO_.js +0 -34
- package/dist/class-map-CsENJXf1.cjs +0 -5
- package/dist/classutils-BwNK82ZQ.cjs +0 -1
- package/dist/classutils-RQs1k6D9.js +0 -7
- package/dist/combobox-DSB5WOxg.js +0 -815
- package/dist/combobox-DbICIgKG.cjs +0 -135
- package/dist/consent-DkOQpbsg.cjs +0 -11
- package/dist/consent-SNWV_mMU.js +0 -175
- package/dist/datepicker-BEWl9iz3.cjs +0 -273
- package/dist/datepicker-euHyzXnb.js +0 -1170
- package/dist/dialog-polyfill.esm-CPKZe7AL.cjs +0 -1
- package/dist/dialog-polyfill.esm-CbjBMXAG.js +0 -395
- package/dist/directive-C7oCP5Bh.cjs +0 -5
- package/dist/directive-helpers-BP2WOx60.cjs +0 -5
- package/dist/directive-helpers-rm-28gIj.js +0 -38
- package/dist/directive-oAbCiebi.js +0 -27
- package/dist/element-CPpT3rFQ.js +0 -638
- package/dist/element-gR_VtSiD.cjs +0 -27
- package/dist/element-with-slot-Dqk6-TRR.js +0 -240
- package/dist/element-with-slot-ZX-up7jO.cjs +0 -1
- package/dist/heading-D2tVS6lS.js +0 -103
- package/dist/heading-DrzbgDb6.cjs +0 -1
- package/dist/helptext-BKtU4mas.js +0 -82
- package/dist/helptext-DcRC7wW2.cjs +0 -24
- package/dist/icon-CxQcIa5F.js +0 -105
- package/dist/icon-q81vqPK_.cjs +0 -9
- package/dist/if-defined-B0krMLad.js +0 -10
- package/dist/if-defined-BOW3ODSj.cjs +0 -5
- package/dist/input-element-8nLwuQS4.js +0 -837
- package/dist/input-element-DdVhUvva.cjs +0 -1
- package/dist/input-wrapper-Bs4CRNst.js +0 -181
- package/dist/input-wrapper-Bv9aqqVq.cjs +0 -54
- package/dist/input-wrapper-CDgenrYA.js +0 -6
- package/dist/input-wrapper-EoSAbU-U.cjs +0 -1
- package/dist/link-C0rl-86s.cjs +0 -7
- package/dist/link-Cdqgl60z.js +0 -55
- package/dist/linkcard-Dimu7Rlx.cjs +0 -13
- package/dist/linkcard-Lbq_UhjZ.js +0 -56
- package/dist/listbox-Bia4_tvN.js +0 -440
- package/dist/listbox-La2GZQei.cjs +0 -106
- package/dist/loader-D1ugDXGV.cjs +0 -16
- package/dist/loader-DyN6RGC5.js +0 -95
- package/dist/messagebox-BGMVm2t9.js +0 -71
- package/dist/messagebox-M0yIgCz9.cjs +0 -13
- package/dist/modal-CMO1RtIi.cjs +0 -36
- package/dist/modal-DjPQDE-Z.js +0 -156
- package/dist/pkt-options-controller-5LXbEzuk.cjs +0 -1
- package/dist/pkt-options-controller-B5YalfCb.js +0 -39
- package/dist/progressbar-BqlMzkM_.cjs +0 -21
- package/dist/progressbar-sbHDFC12.js +0 -162
- package/dist/radiobutton-5ZqVVtTT.cjs +0 -31
- package/dist/radiobutton-D8Ai8ETa.js +0 -113
- package/dist/ref-Bg_Swj5w.js +0 -42
- package/dist/ref-CL-Xk9Xm.cjs +0 -5
- package/dist/repeat-BD8TKgJb.js +0 -61
- package/dist/repeat-Cfq8CDlf.cjs +0 -5
- package/dist/select-De-n8on9.js +0 -230
- package/dist/select-dTWibR6_.cjs +0 -49
- package/dist/state-C_1EOo3D.js +0 -12
- package/dist/state-Dg-53wQ8.cjs +0 -5
- package/dist/tabitem-B9-jeV97.js +0 -334
- package/dist/tabitem-BnhzqfW3.cjs +0 -65
- package/dist/tag-CbwO8yvD.cjs +0 -27
- package/dist/tag-D4FI5t3y.js +0 -117
- package/dist/textarea-BmLaKzsc.cjs +0 -50
- package/dist/textarea-CMiSJaYL.js +0 -133
- package/dist/textinput-em9y4yrL.cjs +0 -70
- package/dist/textinput-r8udK0IX.js +0 -152
- package/dist/utils-DznhwRXm.js +0 -8
- package/dist/utils-byXsEz1u.cjs +0 -1
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
import { P as b, s as m } from "./element-with-slot-Dqk6-TRR.js";
|
|
2
|
-
import { t as u, A as d, b as r, n as l } from "./element-CPpT3rFQ.js";
|
|
3
|
-
import { e as k } from "./class-map-CEnykyO_.js";
|
|
4
|
-
import { r as h } from "./state-C_1EOo3D.js";
|
|
5
|
-
import "./icon-CxQcIa5F.js";
|
|
6
|
-
import { u as f } from "./classutils-RQs1k6D9.js";
|
|
7
|
-
const _ = { skin: { default: "beige" }, compact: { default: !1 }, closable: { default: !1 } }, p = {
|
|
8
|
-
props: _
|
|
9
|
-
};
|
|
10
|
-
var v = Object.defineProperty, o = (i, t, c, g) => {
|
|
11
|
-
for (var e = void 0, a = i.length - 1, n; a >= 0; a--)
|
|
12
|
-
(n = i[a]) && (e = n(t, c, e) || e);
|
|
13
|
-
return e && v(t, c, e), e;
|
|
14
|
-
};
|
|
15
|
-
class s extends b {
|
|
16
|
-
constructor() {
|
|
17
|
-
super(), this.closable = p.props.closable.default, this.compact = p.props.compact.default, this.title = "", this.skin = p.props.skin.default, this._isClosed = !1, this.close = (t) => {
|
|
18
|
-
this._isClosed = !0, this.dispatchEvent(new CustomEvent("close", { detail: { origin: t }, bubbles: !0 })), this.dispatchEvent(new CustomEvent("on-close", { detail: { origin: t }, bubbles: !0 }));
|
|
19
|
-
}, this._isClosed = !1;
|
|
20
|
-
}
|
|
21
|
-
// Lifecycle
|
|
22
|
-
updated(t) {
|
|
23
|
-
super.updated(t), t.has("_isClosed") && f(this, "pkt-hide", this._isClosed);
|
|
24
|
-
}
|
|
25
|
-
// Render
|
|
26
|
-
render() {
|
|
27
|
-
const t = {
|
|
28
|
-
"pkt-messagebox": !0,
|
|
29
|
-
"pkt-messagebox--compact": this.compact,
|
|
30
|
-
[`pkt-messagebox--${this.skin}`]: this.skin,
|
|
31
|
-
"pkt-messagebox--closable": this.closable,
|
|
32
|
-
"pkt-hide": this._isClosed
|
|
33
|
-
};
|
|
34
|
-
return r`<div class=${k(t)}>
|
|
35
|
-
${this.closable ? r`<div class="pkt-messagebox__close">
|
|
36
|
-
<button
|
|
37
|
-
@click=${this.close}
|
|
38
|
-
class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
|
|
39
|
-
aria-label="Lukk"
|
|
40
|
-
>
|
|
41
|
-
<pkt-icon name="close" class="pkt-link__icon"></pkt-icon>
|
|
42
|
-
</button>
|
|
43
|
-
</div>` : d}
|
|
44
|
-
${this.title ? r`<div class="pkt-messagebox__title">${this.title}</div>` : d}
|
|
45
|
-
<div class="pkt-messagebox__text">${m(this)}</div>
|
|
46
|
-
</div>`;
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
o([
|
|
50
|
-
l({ type: Boolean, reflect: !0 })
|
|
51
|
-
], s.prototype, "closable");
|
|
52
|
-
o([
|
|
53
|
-
l({ type: Boolean, reflect: !0 })
|
|
54
|
-
], s.prototype, "compact");
|
|
55
|
-
o([
|
|
56
|
-
l({ type: String, reflect: !0 })
|
|
57
|
-
], s.prototype, "title");
|
|
58
|
-
o([
|
|
59
|
-
l({ type: String, reflect: !0 })
|
|
60
|
-
], s.prototype, "skin");
|
|
61
|
-
o([
|
|
62
|
-
h()
|
|
63
|
-
], s.prototype, "_isClosed");
|
|
64
|
-
try {
|
|
65
|
-
u("pkt-messagebox")(s);
|
|
66
|
-
} catch {
|
|
67
|
-
console.warn("Forsøker å definere <pkt-messagebox>, men den er allerede definert");
|
|
68
|
-
}
|
|
69
|
-
export {
|
|
70
|
-
s as P
|
|
71
|
-
};
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
"use strict";const p=require("./element-with-slot-ZX-up7jO.cjs"),t=require("./element-gR_VtSiD.cjs"),d=require("./class-map-CsENJXf1.cjs"),u=require("./state-Dg-53wQ8.cjs");require("./icon-q81vqPK_.cjs");const b=require("./classutils-BwNK82ZQ.cjs"),k={skin:{default:"beige"},compact:{default:!1},closable:{default:!1}},r={props:k};var h=Object.defineProperty,o=(l,e,c,m)=>{for(var i=void 0,a=l.length-1,n;a>=0;a--)(n=l[a])&&(i=n(e,c,i)||i);return i&&h(e,c,i),i};class s extends p.PktElementWithSlot{constructor(){super(),this.closable=r.props.closable.default,this.compact=r.props.compact.default,this.title="",this.skin=r.props.skin.default,this._isClosed=!1,this.close=e=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:e},bubbles:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:e},bubbles:!0}))},this._isClosed=!1}updated(e){super.updated(e),e.has("_isClosed")&&b.updateClassAttribute(this,"pkt-hide",this._isClosed)}render(){const e={"pkt-messagebox":!0,"pkt-messagebox--compact":this.compact,[`pkt-messagebox--${this.skin}`]:this.skin,"pkt-messagebox--closable":this.closable,"pkt-hide":this._isClosed};return t.b`<div class=${d.e(e)}>
|
|
2
|
-
${this.closable?t.b`<div class="pkt-messagebox__close">
|
|
3
|
-
<button
|
|
4
|
-
@click=${this.close}
|
|
5
|
-
class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
|
|
6
|
-
aria-label="Lukk"
|
|
7
|
-
>
|
|
8
|
-
<pkt-icon name="close" class="pkt-link__icon"></pkt-icon>
|
|
9
|
-
</button>
|
|
10
|
-
</div>`:t.A}
|
|
11
|
-
${this.title?t.b`<div class="pkt-messagebox__title">${this.title}</div>`:t.A}
|
|
12
|
-
<div class="pkt-messagebox__text">${p.slotContent(this)}</div>
|
|
13
|
-
</div>`}}o([t.n({type:Boolean,reflect:!0})],s.prototype,"closable");o([t.n({type:Boolean,reflect:!0})],s.prototype,"compact");o([t.n({type:String,reflect:!0})],s.prototype,"title");o([t.n({type:String,reflect:!0})],s.prototype,"skin");o([u.r()],s.prototype,"_isClosed");try{t.t("pkt-messagebox")(s)}catch{console.warn("Forsøker å definere <pkt-messagebox>, men den er allerede definert")}exports.PktMessagebox=s;
|
package/dist/modal-CMO1RtIi.cjs
DELETED
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
"use strict";const c=require("./class-map-CsENJXf1.cjs"),t=require("./element-gR_VtSiD.cjs"),k=require("./state-Dg-53wQ8.cjs"),h=require("./element-with-slot-ZX-up7jO.cjs"),u=require("./ref-CL-Xk9Xm.cjs");require("./icon-q81vqPK_.cjs");const m={hideCloseButton:{default:!1},closeOnBackdropClick:{default:!1},size:{default:"medium"}},p={props:m};var v=Object.defineProperty,n=(r,e,o,a)=>{for(var s=void 0,d=r.length-1,l;d>=0;d--)(l=r[d])&&(s=l(e,o,s)||s);return s&&v(e,o,s),s};class i extends h.PktElementWithSlot{constructor(){super(),this.open=!1,this.headingText="",this.removePadding=!1,this.hideCloseButton=p.props.hideCloseButton.default,this.closeOnBackdropClick=p.props.closeOnBackdropClick.default,this.closeButtonSkin="blue",this.size=p.props.size.default,this.variant="dialog",this.drawerPosition="right",this.transparentBackdrop=!1,this.dialogRef=u.e(),this._isOpen=!1,this.close=(e,o=!1)=>{var s;if(!this._isOpen)return;this._isOpen=!1,this.open=!1,document.body.classList.remove("pkt-modal--open");const a=document.activeElement;a&&!this.isElementInViewport(a)&&a.scrollIntoView({behavior:"smooth",block:"nearest"}),this.dispatchEvent(new CustomEvent("close",{detail:{origin:e},bubbles:!0,composed:!0})),o||(s=this.dialogRef.value)==null||s.close(),this.requestUpdate()},this.showModal=(e=null)=>{var o;this._isOpen=!0,this.open=!0,(o=this.dialogRef.value)==null||o.showModal(),document.body.classList.add("pkt-modal--open"),this.dispatchEvent(new CustomEvent("showModal",{detail:{origin:e},bubbles:!0,composed:!0})),this.requestUpdate()},this._isOpen=!1}async connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.handleKeyDown.bind(this)),document.addEventListener("click",this.handleBackdropClick.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("click",this.handleBackdropClick)}updated(e){super.updated(e),e.has("open")&&(this.open&&!this._isOpen?this.showModal():!this.open&&this._isOpen&&this.close(new Event("close"),!1))}async firstUpdated(e){super.firstUpdated(e),this.dialogRef.value&&!window.HTMLDialogElement&&!this.dialogRef.value.showModal&&("document"in window&&"createElement"in document&&(await Promise.resolve().then(()=>require("./dialog-polyfill.esm-CPKZe7AL.cjs")).then(a=>a.default)).registerDialog(this.dialogRef.value),this.dialogRef.value.addEventListener("close",()=>{this.close(new Event("close"),!0)}))}handleKeyDown(e){e.key==="Escape"&&this.close(e)}handleBackdropClick(e){var o;this.closeOnBackdropClick&&e.target===((o=this.dialogRef)==null?void 0:o.value)&&this.close(e)}isElementInViewport(e){const o=e.getBoundingClientRect();return o.top>=0&&o.left>=0&&o.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&o.right<=(window.innerWidth||document.documentElement.clientWidth)}render(){const e={"pkt-modal":!0,"pkt-modal--removePadding":this.removePadding??!1,"pkt-modal--noHeadingText":this.headingText===""||this.headingText===void 0,"pkt-modal--noShadow":this.closeButtonSkin==="yellow-filled","pkt-modal--transparentBackdrop":this.transparentBackdrop??!1,[`pkt-modal--${this.size}`]:this.size!==void 0,[`pkt-modal__${this.variant}`]:this.variant!==void 0,[`pkt-modal__drawer--${this.drawerPosition}`]:this.variant==="drawer"},o={"pkt-modal__headingText":!0,"pkt-txt-24":!0},a={"pkt-modal__content":!0,"pkt-txt-18-light":!0},s=this.closeButtonSkin==="blue",d={"pkt-modal__closeButton":!0,[`pkt-modal__closeButton--${this.closeButtonSkin}`]:!0};return t.b`
|
|
2
|
-
<dialog
|
|
3
|
-
class=${c.e(e)}
|
|
4
|
-
${u.n(this.dialogRef)}
|
|
5
|
-
aria-labelledby=${this.headingText?"pkt-modal__headingText":t.A}
|
|
6
|
-
aria-describedby="pkt-modal__content"
|
|
7
|
-
@close=${l=>this.close(l,!0)}
|
|
8
|
-
>
|
|
9
|
-
<div class="pkt-modal__wrapper">
|
|
10
|
-
${this.headingText||!this.hideCloseButton?t.b`<div class="pkt-modal__header">
|
|
11
|
-
<div class="pkt-modal__header-background"></div>
|
|
12
|
-
${this.headingText?t.b`<h1 id="pkt-modal__headingText" class=${c.e(o)}>
|
|
13
|
-
${this.headingText}
|
|
14
|
-
</h1>`:t.b`<div class="pkt-modal__headingText"></div>`}
|
|
15
|
-
${this.hideCloseButton?t.b`<div class="pkt-modal__noCloseButton"></div>`:t.b`<div class="${c.e(d)}">
|
|
16
|
-
<pkt-button
|
|
17
|
-
@click=${l=>this.close(l)}
|
|
18
|
-
aria-label="close"
|
|
19
|
-
iconname="close"
|
|
20
|
-
variant="icon-only"
|
|
21
|
-
size="medium"
|
|
22
|
-
skin=${s?"tertiary":"primary"}
|
|
23
|
-
>
|
|
24
|
-
Lukk
|
|
25
|
-
</pkt-button>
|
|
26
|
-
</div>`}
|
|
27
|
-
</div>`:t.A}
|
|
28
|
-
<div class="pkt-modal__container">
|
|
29
|
-
<div
|
|
30
|
-
id="pkt-modal__content"
|
|
31
|
-
class=${c.e(a)}
|
|
32
|
-
>${h.slotContent(this)}</div>
|
|
33
|
-
</div>
|
|
34
|
-
</div>
|
|
35
|
-
</dialog>
|
|
36
|
-
`}}n([t.n({type:Boolean,reflect:!0})],i.prototype,"open");n([t.n({type:String})],i.prototype,"headingText");n([t.n({type:Boolean})],i.prototype,"removePadding");n([t.n({type:Boolean})],i.prototype,"hideCloseButton");n([t.n({type:Boolean})],i.prototype,"closeOnBackdropClick");n([t.n({type:String})],i.prototype,"closeButtonSkin");n([t.n({type:String})],i.prototype,"size");n([t.n({type:String})],i.prototype,"variant");n([t.n({type:String})],i.prototype,"drawerPosition");n([t.n({type:Boolean})],i.prototype,"transparentBackdrop");n([k.r()],i.prototype,"_isOpen");try{t.t("pkt-modal")(i)}catch{console.warn("Forsøker å definere <pkt-modal>, men den er allerede definert")}exports.PktModal=i;
|
package/dist/modal-DjPQDE-Z.js
DELETED
|
@@ -1,156 +0,0 @@
|
|
|
1
|
-
import { e as c } from "./class-map-CEnykyO_.js";
|
|
2
|
-
import { t as m, A as u, b as d, n } from "./element-CPpT3rFQ.js";
|
|
3
|
-
import { r as k } from "./state-C_1EOo3D.js";
|
|
4
|
-
import { P as f, s as v } from "./element-with-slot-Dqk6-TRR.js";
|
|
5
|
-
import { e as g, n as _ } from "./ref-Bg_Swj5w.js";
|
|
6
|
-
import "./icon-CxQcIa5F.js";
|
|
7
|
-
const y = { hideCloseButton: { default: !1 }, closeOnBackdropClick: { default: !1 }, size: { default: "medium" } }, h = {
|
|
8
|
-
props: y
|
|
9
|
-
};
|
|
10
|
-
var w = Object.defineProperty, s = (p, e, t, a) => {
|
|
11
|
-
for (var i = void 0, r = p.length - 1, l; r >= 0; r--)
|
|
12
|
-
(l = p[r]) && (i = l(e, t, i) || i);
|
|
13
|
-
return i && w(e, t, i), i;
|
|
14
|
-
};
|
|
15
|
-
class o extends f {
|
|
16
|
-
constructor() {
|
|
17
|
-
super(), this.open = !1, this.headingText = "", this.removePadding = !1, this.hideCloseButton = h.props.hideCloseButton.default, this.closeOnBackdropClick = h.props.closeOnBackdropClick.default, this.closeButtonSkin = "blue", this.size = h.props.size.default, this.variant = "dialog", this.drawerPosition = "right", this.transparentBackdrop = !1, this.dialogRef = g(), this._isOpen = !1, this.close = (e, t = !1) => {
|
|
18
|
-
var i;
|
|
19
|
-
if (!this._isOpen) return;
|
|
20
|
-
this._isOpen = !1, this.open = !1, document.body.classList.remove("pkt-modal--open");
|
|
21
|
-
const a = document.activeElement;
|
|
22
|
-
a && !this.isElementInViewport(a) && a.scrollIntoView({ behavior: "smooth", block: "nearest" }), this.dispatchEvent(
|
|
23
|
-
new CustomEvent("close", { detail: { origin: e }, bubbles: !0, composed: !0 })
|
|
24
|
-
), t || (i = this.dialogRef.value) == null || i.close(), this.requestUpdate();
|
|
25
|
-
}, this.showModal = (e = null) => {
|
|
26
|
-
var t;
|
|
27
|
-
this._isOpen = !0, this.open = !0, (t = this.dialogRef.value) == null || t.showModal(), document.body.classList.add("pkt-modal--open"), this.dispatchEvent(
|
|
28
|
-
new CustomEvent("showModal", { detail: { origin: e }, bubbles: !0, composed: !0 })
|
|
29
|
-
), this.requestUpdate();
|
|
30
|
-
}, this._isOpen = !1;
|
|
31
|
-
}
|
|
32
|
-
async connectedCallback() {
|
|
33
|
-
super.connectedCallback(), document.addEventListener("keydown", this.handleKeyDown.bind(this)), document.addEventListener("click", this.handleBackdropClick.bind(this));
|
|
34
|
-
}
|
|
35
|
-
disconnectedCallback() {
|
|
36
|
-
super.disconnectedCallback(), document.removeEventListener("keydown", this.handleKeyDown), document.removeEventListener("click", this.handleBackdropClick);
|
|
37
|
-
}
|
|
38
|
-
updated(e) {
|
|
39
|
-
super.updated(e), e.has("open") && (this.open && !this._isOpen ? this.showModal() : !this.open && this._isOpen && this.close(new Event("close"), !1));
|
|
40
|
-
}
|
|
41
|
-
async firstUpdated(e) {
|
|
42
|
-
super.firstUpdated(e), this.dialogRef.value && !window.HTMLDialogElement && !this.dialogRef.value.showModal && ("document" in window && "createElement" in document && (await import("./dialog-polyfill.esm-CbjBMXAG.js").then((a) => a.default)).registerDialog(this.dialogRef.value), this.dialogRef.value.addEventListener("close", () => {
|
|
43
|
-
this.close(new Event("close"), !0);
|
|
44
|
-
}));
|
|
45
|
-
}
|
|
46
|
-
// P R I V A T E M E T H O D S
|
|
47
|
-
handleKeyDown(e) {
|
|
48
|
-
e.key === "Escape" && this.close(e);
|
|
49
|
-
}
|
|
50
|
-
handleBackdropClick(e) {
|
|
51
|
-
var t;
|
|
52
|
-
this.closeOnBackdropClick && e.target === ((t = this.dialogRef) == null ? void 0 : t.value) && this.close(e);
|
|
53
|
-
}
|
|
54
|
-
isElementInViewport(e) {
|
|
55
|
-
const t = e.getBoundingClientRect();
|
|
56
|
-
return t.top >= 0 && t.left >= 0 && t.bottom <= (window.innerHeight || document.documentElement.clientHeight) && t.right <= (window.innerWidth || document.documentElement.clientWidth);
|
|
57
|
-
}
|
|
58
|
-
render() {
|
|
59
|
-
const e = {
|
|
60
|
-
"pkt-modal": !0,
|
|
61
|
-
"pkt-modal--removePadding": this.removePadding ?? !1,
|
|
62
|
-
"pkt-modal--noHeadingText": this.headingText === "" || this.headingText === void 0,
|
|
63
|
-
"pkt-modal--noShadow": this.closeButtonSkin === "yellow-filled",
|
|
64
|
-
"pkt-modal--transparentBackdrop": this.transparentBackdrop ?? !1,
|
|
65
|
-
[`pkt-modal--${this.size}`]: this.size !== void 0,
|
|
66
|
-
[`pkt-modal__${this.variant}`]: this.variant !== void 0,
|
|
67
|
-
[`pkt-modal__drawer--${this.drawerPosition}`]: this.variant === "drawer"
|
|
68
|
-
}, t = {
|
|
69
|
-
"pkt-modal__headingText": !0,
|
|
70
|
-
"pkt-txt-24": !0
|
|
71
|
-
}, a = {
|
|
72
|
-
"pkt-modal__content": !0,
|
|
73
|
-
"pkt-txt-18-light": !0
|
|
74
|
-
}, i = this.closeButtonSkin === "blue", r = {
|
|
75
|
-
"pkt-modal__closeButton": !0,
|
|
76
|
-
[`pkt-modal__closeButton--${this.closeButtonSkin}`]: !0
|
|
77
|
-
};
|
|
78
|
-
return d`
|
|
79
|
-
<dialog
|
|
80
|
-
class=${c(e)}
|
|
81
|
-
${_(this.dialogRef)}
|
|
82
|
-
aria-labelledby=${this.headingText ? "pkt-modal__headingText" : u}
|
|
83
|
-
aria-describedby="pkt-modal__content"
|
|
84
|
-
@close=${(l) => this.close(l, !0)}
|
|
85
|
-
>
|
|
86
|
-
<div class="pkt-modal__wrapper">
|
|
87
|
-
${this.headingText || !this.hideCloseButton ? d`<div class="pkt-modal__header">
|
|
88
|
-
<div class="pkt-modal__header-background"></div>
|
|
89
|
-
${this.headingText ? d`<h1 id="pkt-modal__headingText" class=${c(t)}>
|
|
90
|
-
${this.headingText}
|
|
91
|
-
</h1>` : d`<div class="pkt-modal__headingText"></div>`}
|
|
92
|
-
${this.hideCloseButton ? d`<div class="pkt-modal__noCloseButton"></div>` : d`<div class="${c(r)}">
|
|
93
|
-
<pkt-button
|
|
94
|
-
@click=${(l) => this.close(l)}
|
|
95
|
-
aria-label="close"
|
|
96
|
-
iconname="close"
|
|
97
|
-
variant="icon-only"
|
|
98
|
-
size="medium"
|
|
99
|
-
skin=${i ? "tertiary" : "primary"}
|
|
100
|
-
>
|
|
101
|
-
Lukk
|
|
102
|
-
</pkt-button>
|
|
103
|
-
</div>`}
|
|
104
|
-
</div>` : u}
|
|
105
|
-
<div class="pkt-modal__container">
|
|
106
|
-
<div
|
|
107
|
-
id="pkt-modal__content"
|
|
108
|
-
class=${c(a)}
|
|
109
|
-
>${v(this)}</div>
|
|
110
|
-
</div>
|
|
111
|
-
</div>
|
|
112
|
-
</dialog>
|
|
113
|
-
`;
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
s([
|
|
117
|
-
n({ type: Boolean, reflect: !0 })
|
|
118
|
-
], o.prototype, "open");
|
|
119
|
-
s([
|
|
120
|
-
n({ type: String })
|
|
121
|
-
], o.prototype, "headingText");
|
|
122
|
-
s([
|
|
123
|
-
n({ type: Boolean })
|
|
124
|
-
], o.prototype, "removePadding");
|
|
125
|
-
s([
|
|
126
|
-
n({ type: Boolean })
|
|
127
|
-
], o.prototype, "hideCloseButton");
|
|
128
|
-
s([
|
|
129
|
-
n({ type: Boolean })
|
|
130
|
-
], o.prototype, "closeOnBackdropClick");
|
|
131
|
-
s([
|
|
132
|
-
n({ type: String })
|
|
133
|
-
], o.prototype, "closeButtonSkin");
|
|
134
|
-
s([
|
|
135
|
-
n({ type: String })
|
|
136
|
-
], o.prototype, "size");
|
|
137
|
-
s([
|
|
138
|
-
n({ type: String })
|
|
139
|
-
], o.prototype, "variant");
|
|
140
|
-
s([
|
|
141
|
-
n({ type: String })
|
|
142
|
-
], o.prototype, "drawerPosition");
|
|
143
|
-
s([
|
|
144
|
-
n({ type: Boolean })
|
|
145
|
-
], o.prototype, "transparentBackdrop");
|
|
146
|
-
s([
|
|
147
|
-
k()
|
|
148
|
-
], o.prototype, "_isOpen");
|
|
149
|
-
try {
|
|
150
|
-
m("pkt-modal")(o);
|
|
151
|
-
} catch {
|
|
152
|
-
console.warn("Forsøker å definere <pkt-modal>, men den er allerede definert");
|
|
153
|
-
}
|
|
154
|
-
export {
|
|
155
|
-
o as P
|
|
156
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";const r=require("./element-with-slot-ZX-up7jO.cjs");class a{constructor(t){this.nodes=[],this.options=[],this.generation=0,this.host=t,this.host.addController(this),this.nodes=[],this.options=[],this.observer=new MutationObserver(e=>this.handleMutations(e))}hostConnected(){Array.from(this.host.childNodes).forEach(t=>{(t.nodeName==="OPTION"||t.nodeName==="DATA")&&this.addNode(t)}),this.createOptions(),this.observer.observe(this.host,{childList:!0,subtree:!1,attributes:!0})}hostDisconnected(){this.observer.disconnect()}addNode(t){(t.nodeName==="OPTION"||t.nodeName==="DATA")&&(t.hasAttribute("hidden")&&!t.hasAttribute("data-skip")&&t.setAttribute("data-hidden","true"),!t.hasAttribute("hidden")&&t.hasAttribute("data-skip")&&t.hasAttribute("data-hidden")&&t.removeAttribute("data-hidden"),t.setAttribute("class","pkt-hide"),t.setAttribute("data-skip","true"),t.setAttribute("hidden","true"),this.nodes.push(t))}createOptions(){this.options=this.nodes.map(t=>({value:t.hasAttribute("value")?t.getAttribute("value")??"":t.textContent??"",label:t.textContent||t.getAttribute("value")||"",selected:t.hasAttribute("selected"),disabled:t.hasAttribute("disabled"),hidden:t.hasAttribute("data-hidden")})),this.generation++,this.host.requestUpdate()}handleMutations(t){let e=!1;t.forEach(s=>{s.type==="childList"&&(s.addedNodes.forEach(i=>{r.isOptionElement(i)&&(this.addNode(i),e=!0)}),s.removedNodes.forEach(i=>{r.isOptionElement(i)&&(this.nodes=this.nodes.filter(h=>h!==i),e=!0)})),s.type==="attributes"&&r.isOptionElement(s.target)&&(this.addNode(s.target),e=!0)}),e&&this.createOptions()}}exports.PktOptionsSlotController=a;
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { i as r } from "./element-with-slot-Dqk6-TRR.js";
|
|
2
|
-
class o {
|
|
3
|
-
constructor(t) {
|
|
4
|
-
this.nodes = [], this.options = [], this.generation = 0, this.host = t, this.host.addController(this), this.nodes = [], this.options = [], this.observer = new MutationObserver((e) => this.handleMutations(e));
|
|
5
|
-
}
|
|
6
|
-
hostConnected() {
|
|
7
|
-
Array.from(this.host.childNodes).forEach((t) => {
|
|
8
|
-
(t.nodeName === "OPTION" || t.nodeName === "DATA") && this.addNode(t);
|
|
9
|
-
}), this.createOptions(), this.observer.observe(this.host, { childList: !0, subtree: !1, attributes: !0 });
|
|
10
|
-
}
|
|
11
|
-
hostDisconnected() {
|
|
12
|
-
this.observer.disconnect();
|
|
13
|
-
}
|
|
14
|
-
addNode(t) {
|
|
15
|
-
(t.nodeName === "OPTION" || t.nodeName === "DATA") && (t.hasAttribute("hidden") && !t.hasAttribute("data-skip") && t.setAttribute("data-hidden", "true"), !t.hasAttribute("hidden") && t.hasAttribute("data-skip") && t.hasAttribute("data-hidden") && t.removeAttribute("data-hidden"), t.setAttribute("class", "pkt-hide"), t.setAttribute("data-skip", "true"), t.setAttribute("hidden", "true"), this.nodes.push(t));
|
|
16
|
-
}
|
|
17
|
-
createOptions() {
|
|
18
|
-
this.options = this.nodes.map((t) => ({
|
|
19
|
-
value: t.hasAttribute("value") ? t.getAttribute("value") ?? "" : t.textContent ?? "",
|
|
20
|
-
label: t.textContent || t.getAttribute("value") || "",
|
|
21
|
-
selected: t.hasAttribute("selected"),
|
|
22
|
-
disabled: t.hasAttribute("disabled"),
|
|
23
|
-
hidden: t.hasAttribute("data-hidden")
|
|
24
|
-
})), this.generation++, this.host.requestUpdate();
|
|
25
|
-
}
|
|
26
|
-
handleMutations(t) {
|
|
27
|
-
let e = !1;
|
|
28
|
-
t.forEach((s) => {
|
|
29
|
-
s.type === "childList" && (s.addedNodes.forEach((i) => {
|
|
30
|
-
r(i) && (this.addNode(i), e = !0);
|
|
31
|
-
}), s.removedNodes.forEach((i) => {
|
|
32
|
-
r(i) && (this.nodes = this.nodes.filter((a) => a !== i), e = !0);
|
|
33
|
-
})), s.type === "attributes" && r(s.target) && (this.addNode(s.target), e = !0);
|
|
34
|
-
}), e && this.createOptions();
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
export {
|
|
38
|
-
o as P
|
|
39
|
-
};
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";const p=require("./class-map-CsENJXf1.cjs"),e=require("./element-gR_VtSiD.cjs"),h=require("./state-Dg-53wQ8.cjs"),d=require("./ref-CL-Xk9Xm.cjs"),b=require("./directive-C7oCP5Bh.cjs"),c=require("./utils-byXsEz1u.cjs");require("./icon-q81vqPK_.cjs");/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2018 Google LLC
|
|
4
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
|
-
*/const y="important",m=" !"+y,_=b.e(class extends b.i{constructor(n){var t;if(super(n),n.type!==b.t.ATTRIBUTE||n.name!=="style"||((t=n.strings)==null?void 0:t.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(n){return Object.keys(n).reduce((t,s)=>{const a=n[s];return a==null?t:t+`${s=s.includes("-")?s:s.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${a};`},"")}update(n,[t]){const{style:s}=n.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(t)),this.render(t);for(const a of this.ft)t[a]==null&&(this.ft.delete(a),a.includes("-")?s.removeProperty(a):s[a]=null);for(const a in t){const l=t[a];if(l!=null){this.ft.add(a);const u=typeof l=="string"&&l.endsWith(m);a.includes("-")||u?s.setProperty(a,u?l.slice(0,-11):l,u?y:""):s[a]=l}}return e.E}});var A=Object.defineProperty,i=(n,t,s,a)=>{for(var l=void 0,u=n.length-1,o;u>=0;u--)(o=n[u])&&(l=o(t,s,l)||l);return l&&A(t,s,l),l};class r extends e.PktElement{constructor(){super(),this.ariaLabel=null,this.ariaLabelledby=null,this.ariaValueText=null,this.ariaLive="polite",this.id=c.uuidish(),this.role="progressbar",this.skin="dark-blue",this.statusPlacement="following",this.statusType="none",this.title="",this.titlePosition="left",this.valueCurrent=0,this.valueMax=100,this.valueMin=0,this.labelWidth=0,this.progressbarId=this.id,this.computedAriaLabelledby=null,this.computedAriaValueText="",this.labelRef=d.e(),this.progressBarRef=d.e()}firstUpdated(t){super.firstUpdated(t),this.setComputedValues(),this.syncAttributes()}updated(t){super.updated(t),t.has("valueCurrent")&&this.labelRef.value&&(this.labelWidth=this.labelRef.value.getBoundingClientRect().width||0),t.has("id")&&this.id&&(this.progressBarId=this.id),(t.has("statusType")||t.has("id")||t.has("ariaLabelledby"))&&(this.progressbarId=this.id||c.uuidish(),this.computedAriaLabelledby=this.ariaLabelledby||`${this.progressbarId}-title`),(t.has("ariaValueText")||t.has("valueCurrent")||t.has("valueMax"))&&(this.computedAriaValueText=this.statusType==="fraction"&&!this.ariaValueText?`${this.valueCurrent} av ${this.valueMax-this.valueMin}`:this.ariaValueText||""),this.syncAttributes()}render(){const t=this.statusType!=="none",s=this.valueMax-this.valueMin,a=this.valueCurrent/s*100,l=this.statusType==="fraction"?Math.round(a):Math.round((this.valueCurrent-this.valueMin)/(this.valueMax-this.valueMin)*100),u=`${this.valueCurrent} av ${s}`,o=p.e({"pkt-progressbar__bar":!0,[`pkt-progressbar__bar--${this.skin}`]:!!this.skin}),v=p.e({"pkt-progressbar__title":!0,"pkt-progressbar__title-center":this.titlePosition==="center"}),f=p.e({"pkt-progressbar__status":!0,"pkt-progressbar__status--center":this.statusPlacement==="center"}),g=p.e({"pkt-progressbar__status-placement--following":this.statusPlacement==="following","pkt-progressbar__status-placement--center":this.statusPlacement==="center","pkt-progressbar__status-placement--left":this.statusPlacement==="left"});return e.b` <div
|
|
6
|
-
class="pkt-progressbar__container"
|
|
7
|
-
.ref=${this.progressBarRef}
|
|
8
|
-
style=${_({"--pkt-progress-label-width":`${this.labelWidth}px`,"--pkt-progress-width":`${l}%`})}
|
|
9
|
-
>
|
|
10
|
-
${this.title?e.b`<p id=${`${this.progressBarId}-title`} class=${v}>${this.title}</p>`:e.A}
|
|
11
|
-
|
|
12
|
-
<div class="pkt-progressbar__bar-wrapper">
|
|
13
|
-
<div class=${o}></div>
|
|
14
|
-
</div>
|
|
15
|
-
|
|
16
|
-
${t?e.b`<div class=${f}>
|
|
17
|
-
<span class=${g} ${d.n(this.labelRef)}>
|
|
18
|
-
${this.statusType==="percentage"?`${l}%`:u}
|
|
19
|
-
</span>
|
|
20
|
-
</div>`:e.A}
|
|
21
|
-
</div>`}setComputedValues(){this.progressbarId=this.id||c.uuidish(),this.computedAriaLabelledby=this.ariaLabelledby||`${this.progressbarId}-title`,this.computedAriaValueText=this.statusType==="fraction"&&!this.ariaValueText?`${this.valueCurrent} av ${this.valueMax-this.valueMin}`:this.ariaValueText||""}syncAttributes(){this._handleAttribute("aria-live",this.ariaLive),this._handleAttribute("aria-valuenow",this.valueCurrent),this._handleAttribute("aria-valuemin",this.valueMin),this._handleAttribute("aria-valuemax",this.valueMax),this._handleAttribute("aria-valuetext",this.computedAriaValueText),this._handleAttribute("aria-label",this.ariaLabel),this._handleAttribute("role",this.role),this._handleAttribute("aria-atomic","true"),this._handleAttribute("id",this.progressbarId),this.ariaLabel||this._handleAttribute("aria-labelledby",this.computedAriaLabelledby)}_handleAttribute(t,s){s==null||s===""?this.removeAttribute(t):this.setAttribute(t,String(s))}}i([e.n({type:String})],r.prototype,"ariaLabel");i([e.n({type:String,reflect:!0})],r.prototype,"ariaLabelledby");i([e.n({type:String,reflect:!0})],r.prototype,"ariaValueText");i([e.n({type:String})],r.prototype,"ariaLive");i([e.n({type:String,reflect:!0})],r.prototype,"id");i([e.n({type:String})],r.prototype,"role");i([e.n({type:String})],r.prototype,"skin");i([e.n({type:String})],r.prototype,"statusPlacement");i([e.n({type:String})],r.prototype,"statusType");i([e.n({type:String,reflect:!0})],r.prototype,"title");i([e.n({type:String})],r.prototype,"titlePosition");i([e.n({type:Number,reflect:!0})],r.prototype,"valueCurrent");i([e.n({type:Number})],r.prototype,"valueMax");i([e.n({type:Number})],r.prototype,"valueMin");i([h.r()],r.prototype,"labelWidth");i([h.r()],r.prototype,"progressbarId");i([h.r()],r.prototype,"computedAriaLabelledby");i([h.r()],r.prototype,"computedAriaValueText");try{e.t("pkt-progressbar")(r)}catch{console.warn("Forsøker å definere <pkt-progressbar>, men den er allerede definert")}exports.PktProgressbar=r;
|
|
@@ -1,162 +0,0 @@
|
|
|
1
|
-
import { e as p } from "./class-map-CEnykyO_.js";
|
|
2
|
-
import { E as _, t as $, P as A, A as c, b as d, n as u } from "./element-CPpT3rFQ.js";
|
|
3
|
-
import { r as h } from "./state-C_1EOo3D.js";
|
|
4
|
-
import { e as y, n as k } from "./ref-Bg_Swj5w.js";
|
|
5
|
-
import { e as x, i as T, t as C } from "./directive-oAbCiebi.js";
|
|
6
|
-
import { u as b } from "./utils-DznhwRXm.js";
|
|
7
|
-
import "./icon-CxQcIa5F.js";
|
|
8
|
-
/**
|
|
9
|
-
* @license
|
|
10
|
-
* Copyright 2018 Google LLC
|
|
11
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
12
|
-
*/
|
|
13
|
-
const f = "important", M = " !" + f, L = x(class extends T {
|
|
14
|
-
constructor(l) {
|
|
15
|
-
var t;
|
|
16
|
-
if (super(l), l.type !== C.ATTRIBUTE || l.name !== "style" || ((t = l.strings) == null ? void 0 : t.length) > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
|
|
17
|
-
}
|
|
18
|
-
render(l) {
|
|
19
|
-
return Object.keys(l).reduce((t, e) => {
|
|
20
|
-
const i = l[e];
|
|
21
|
-
return i == null ? t : t + `${e = e.includes("-") ? e : e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${i};`;
|
|
22
|
-
}, "");
|
|
23
|
-
}
|
|
24
|
-
update(l, [t]) {
|
|
25
|
-
const { style: e } = l.element;
|
|
26
|
-
if (this.ft === void 0) return this.ft = new Set(Object.keys(t)), this.render(t);
|
|
27
|
-
for (const i of this.ft) t[i] == null && (this.ft.delete(i), i.includes("-") ? e.removeProperty(i) : e[i] = null);
|
|
28
|
-
for (const i in t) {
|
|
29
|
-
const a = t[i];
|
|
30
|
-
if (a != null) {
|
|
31
|
-
this.ft.add(i);
|
|
32
|
-
const o = typeof a == "string" && a.endsWith(M);
|
|
33
|
-
i.includes("-") || o ? e.setProperty(i, o ? a.slice(0, -11) : a, o ? f : "") : e[i] = a;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
return _;
|
|
37
|
-
}
|
|
38
|
-
});
|
|
39
|
-
var S = Object.defineProperty, r = (l, t, e, i) => {
|
|
40
|
-
for (var a = void 0, o = l.length - 1, n; o >= 0; o--)
|
|
41
|
-
(n = l[o]) && (a = n(t, e, a) || a);
|
|
42
|
-
return a && S(t, e, a), a;
|
|
43
|
-
};
|
|
44
|
-
class s extends A {
|
|
45
|
-
constructor() {
|
|
46
|
-
super(), this.ariaLabel = null, this.ariaLabelledby = null, this.ariaValueText = null, this.ariaLive = "polite", this.id = b(), this.role = "progressbar", this.skin = "dark-blue", this.statusPlacement = "following", this.statusType = "none", this.title = "", this.titlePosition = "left", this.valueCurrent = 0, this.valueMax = 100, this.valueMin = 0, this.labelWidth = 0, this.progressbarId = this.id, this.computedAriaLabelledby = null, this.computedAriaValueText = "", this.labelRef = y(), this.progressBarRef = y();
|
|
47
|
-
}
|
|
48
|
-
firstUpdated(t) {
|
|
49
|
-
super.firstUpdated(t), this.setComputedValues(), this.syncAttributes();
|
|
50
|
-
}
|
|
51
|
-
updated(t) {
|
|
52
|
-
super.updated(t), t.has("valueCurrent") && this.labelRef.value && (this.labelWidth = this.labelRef.value.getBoundingClientRect().width || 0), t.has("id") && this.id && (this.progressBarId = this.id), (t.has("statusType") || t.has("id") || t.has("ariaLabelledby")) && (this.progressbarId = this.id || b(), this.computedAriaLabelledby = this.ariaLabelledby || `${this.progressbarId}-title`), (t.has("ariaValueText") || t.has("valueCurrent") || t.has("valueMax")) && (this.computedAriaValueText = this.statusType === "fraction" && !this.ariaValueText ? `${this.valueCurrent} av ${this.valueMax - this.valueMin}` : this.ariaValueText || ""), this.syncAttributes();
|
|
53
|
-
}
|
|
54
|
-
render() {
|
|
55
|
-
const t = this.statusType !== "none", e = this.valueMax - this.valueMin, i = this.valueCurrent / e * 100, a = this.statusType === "fraction" ? Math.round(i) : Math.round((this.valueCurrent - this.valueMin) / (this.valueMax - this.valueMin) * 100), o = `${this.valueCurrent} av ${e}`, n = p({
|
|
56
|
-
"pkt-progressbar__bar": !0,
|
|
57
|
-
[`pkt-progressbar__bar--${this.skin}`]: !!this.skin
|
|
58
|
-
}), v = p({
|
|
59
|
-
"pkt-progressbar__title": !0,
|
|
60
|
-
"pkt-progressbar__title-center": this.titlePosition === "center"
|
|
61
|
-
}), m = p({
|
|
62
|
-
"pkt-progressbar__status": !0,
|
|
63
|
-
"pkt-progressbar__status--center": this.statusPlacement === "center"
|
|
64
|
-
}), g = p({
|
|
65
|
-
"pkt-progressbar__status-placement--following": this.statusPlacement === "following",
|
|
66
|
-
"pkt-progressbar__status-placement--center": this.statusPlacement === "center",
|
|
67
|
-
"pkt-progressbar__status-placement--left": this.statusPlacement === "left"
|
|
68
|
-
});
|
|
69
|
-
return d` <div
|
|
70
|
-
class="pkt-progressbar__container"
|
|
71
|
-
.ref=${this.progressBarRef}
|
|
72
|
-
style=${L({
|
|
73
|
-
"--pkt-progress-label-width": `${this.labelWidth}px`,
|
|
74
|
-
"--pkt-progress-width": `${a}%`
|
|
75
|
-
})}
|
|
76
|
-
>
|
|
77
|
-
${this.title ? d`<p id=${`${this.progressBarId}-title`} class=${v}>${this.title}</p>` : c}
|
|
78
|
-
|
|
79
|
-
<div class="pkt-progressbar__bar-wrapper">
|
|
80
|
-
<div class=${n}></div>
|
|
81
|
-
</div>
|
|
82
|
-
|
|
83
|
-
${t ? d`<div class=${m}>
|
|
84
|
-
<span class=${g} ${k(this.labelRef)}>
|
|
85
|
-
${this.statusType === "percentage" ? `${a}%` : o}
|
|
86
|
-
</span>
|
|
87
|
-
</div>` : c}
|
|
88
|
-
</div>`;
|
|
89
|
-
}
|
|
90
|
-
// methods
|
|
91
|
-
setComputedValues() {
|
|
92
|
-
this.progressbarId = this.id || b(), this.computedAriaLabelledby = this.ariaLabelledby || `${this.progressbarId}-title`, this.computedAriaValueText = this.statusType === "fraction" && !this.ariaValueText ? `${this.valueCurrent} av ${this.valueMax - this.valueMin}` : this.ariaValueText || "";
|
|
93
|
-
}
|
|
94
|
-
syncAttributes() {
|
|
95
|
-
this._handleAttribute("aria-live", this.ariaLive), this._handleAttribute("aria-valuenow", this.valueCurrent), this._handleAttribute("aria-valuemin", this.valueMin), this._handleAttribute("aria-valuemax", this.valueMax), this._handleAttribute("aria-valuetext", this.computedAriaValueText), this._handleAttribute("aria-label", this.ariaLabel), this._handleAttribute("role", this.role), this._handleAttribute("aria-atomic", "true"), this._handleAttribute("id", this.progressbarId), this.ariaLabel || this._handleAttribute("aria-labelledby", this.computedAriaLabelledby);
|
|
96
|
-
}
|
|
97
|
-
_handleAttribute(t, e) {
|
|
98
|
-
e == null || e === "" ? this.removeAttribute(t) : this.setAttribute(t, String(e));
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
r([
|
|
102
|
-
u({ type: String })
|
|
103
|
-
], s.prototype, "ariaLabel");
|
|
104
|
-
r([
|
|
105
|
-
u({ type: String, reflect: !0 })
|
|
106
|
-
], s.prototype, "ariaLabelledby");
|
|
107
|
-
r([
|
|
108
|
-
u({ type: String, reflect: !0 })
|
|
109
|
-
], s.prototype, "ariaValueText");
|
|
110
|
-
r([
|
|
111
|
-
u({ type: String })
|
|
112
|
-
], s.prototype, "ariaLive");
|
|
113
|
-
r([
|
|
114
|
-
u({ type: String, reflect: !0 })
|
|
115
|
-
], s.prototype, "id");
|
|
116
|
-
r([
|
|
117
|
-
u({ type: String })
|
|
118
|
-
], s.prototype, "role");
|
|
119
|
-
r([
|
|
120
|
-
u({ type: String })
|
|
121
|
-
], s.prototype, "skin");
|
|
122
|
-
r([
|
|
123
|
-
u({ type: String })
|
|
124
|
-
], s.prototype, "statusPlacement");
|
|
125
|
-
r([
|
|
126
|
-
u({ type: String })
|
|
127
|
-
], s.prototype, "statusType");
|
|
128
|
-
r([
|
|
129
|
-
u({ type: String, reflect: !0 })
|
|
130
|
-
], s.prototype, "title");
|
|
131
|
-
r([
|
|
132
|
-
u({ type: String })
|
|
133
|
-
], s.prototype, "titlePosition");
|
|
134
|
-
r([
|
|
135
|
-
u({ type: Number, reflect: !0 })
|
|
136
|
-
], s.prototype, "valueCurrent");
|
|
137
|
-
r([
|
|
138
|
-
u({ type: Number })
|
|
139
|
-
], s.prototype, "valueMax");
|
|
140
|
-
r([
|
|
141
|
-
u({ type: Number })
|
|
142
|
-
], s.prototype, "valueMin");
|
|
143
|
-
r([
|
|
144
|
-
h()
|
|
145
|
-
], s.prototype, "labelWidth");
|
|
146
|
-
r([
|
|
147
|
-
h()
|
|
148
|
-
], s.prototype, "progressbarId");
|
|
149
|
-
r([
|
|
150
|
-
h()
|
|
151
|
-
], s.prototype, "computedAriaLabelledby");
|
|
152
|
-
r([
|
|
153
|
-
h()
|
|
154
|
-
], s.prototype, "computedAriaValueText");
|
|
155
|
-
try {
|
|
156
|
-
$("pkt-progressbar")(s);
|
|
157
|
-
} catch {
|
|
158
|
-
console.warn("Forsøker å definere <pkt-progressbar>, men den er allerede definert");
|
|
159
|
-
}
|
|
160
|
-
export {
|
|
161
|
-
s as P
|
|
162
|
-
};
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";const t=require("./element-gR_VtSiD.cjs"),u=require("./state-Dg-53wQ8.cjs"),d=require("./input-element-DdVhUvva.cjs"),o=require("./ref-CL-Xk9Xm.cjs"),h=require("./class-map-CsENJXf1.cjs");var k=Object.defineProperty,s=(c,i,a,p)=>{for(var n=void 0,l=c.length-1,r;l>=0;l--)(r=c[l])&&(n=r(i,a,n)||n);return n&&k(i,a,n),n};class e extends d.PktInputElement{constructor(){super(...arguments),this.inputRef=o.e(),this.value="",this.checkHelptext=null,this.defaultChecked=!1,this.hasTile=!1,this.checked=null,this.type="radio",this.tagText=null,this.optionalTag=!1,this.optionalText="Valgfritt",this.requiredTag=!1,this.requiredText="Må fylles ut",this._checked=!1}connectedCallback(){super.connectedCallback()}attributeChangedCallback(i,a,p){i==="defaultChecked"&&(this._checked=this.defaultChecked),i==="checked"&&(this._checked=this.checked===""||this.checked==="true"||this.checked===!0),super.attributeChangedCallback(i,a,p)}render(){const i=h.e({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.disabled&&this.hasTile}),a=h.e({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),p=h.e({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.disabled,"pkt-sr-only":this.hideLabel}),n="pkt-tag pkt-tag--small pkt-tag--thin-text",l=()=>t.b`
|
|
2
|
-
${this.tagText?t.b`<span class=${n+" pkt-tag--gray"}>${this.tagText}</span>`:t.A}
|
|
3
|
-
${this.optionalTag?t.b`<span class=${n+" pkt-tag--blue-light"}>${this.optionalText}</span>`:t.A}
|
|
4
|
-
${this.requiredTag?t.b`<span class=${n+" pkt-tag--beige"}>${this.requiredText}</span>`:t.A}
|
|
5
|
-
`,r=()=>t.b`
|
|
6
|
-
<label class=${p} for=${this.id+"-internal"}>
|
|
7
|
-
${this.label} ${l()}
|
|
8
|
-
${this.checkHelptext?t.b`<div class="pkt-input-check__input-helptext">${this.checkHelptext}</div>`:t.A}
|
|
9
|
-
</label>
|
|
10
|
-
`;return t.b`
|
|
11
|
-
<div class="pkt-input-check">
|
|
12
|
-
<div class=${i}>
|
|
13
|
-
<input
|
|
14
|
-
id=${this.id+"-internal"}
|
|
15
|
-
class=${a}
|
|
16
|
-
type="radio"
|
|
17
|
-
role="radio"
|
|
18
|
-
?disabled=${this.disabled}
|
|
19
|
-
form=""
|
|
20
|
-
name=${this.name+"-internal"}
|
|
21
|
-
${o.n(this.inputRef)}
|
|
22
|
-
@change=${this.toggleChecked}
|
|
23
|
-
@input=${this.onInput}
|
|
24
|
-
@blur=${this.onBlur}
|
|
25
|
-
@focus=${this.onFocus}
|
|
26
|
-
?checked=${this.checked}
|
|
27
|
-
/>
|
|
28
|
-
${r()}
|
|
29
|
-
</div>
|
|
30
|
-
</div>
|
|
31
|
-
`}toggleChecked(i=null){i&&i.preventDefault(),i&&i.stopImmediatePropagation(),this.touched=!0,this.inputRef.value&&(this._checked=this.inputRef.value.matches(":checked"),this.valueChecked(this._checked))}}s([t.n({type:String,reflect:!0})],e.prototype,"value");s([t.n({type:String})],e.prototype,"checkHelptext");s([t.n({type:Boolean})],e.prototype,"defaultChecked");s([t.n({type:Boolean})],e.prototype,"hasTile");s([t.n({type:Boolean,reflect:!0})],e.prototype,"checked");s([t.n({type:String,reflect:!0})],e.prototype,"type");s([t.n({type:String})],e.prototype,"tagText");s([t.n({type:Boolean})],e.prototype,"optionalTag");s([t.n({type:String})],e.prototype,"optionalText");s([t.n({type:Boolean})],e.prototype,"requiredTag");s([t.n({type:String})],e.prototype,"requiredText");s([u.r()],e.prototype,"_checked");try{t.t("pkt-radiobutton")(e)}catch{console.warn("Forsøker å definere <pkt-radiobutton>, men den er allerede definert")}exports.PktRadioButton=e;
|