@oslokommune/punkt-elements 17.1.2 → 18.0.0
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-BeLvLPrB.js → accordion-1_pdxTgJ.js} +27 -27
- package/dist/{accordion-B3GBlvUC.cjs → accordion-DobbH-Sv.cjs} +5 -5
- package/dist/{alert-Cs4Rmq_J.cjs → alert-COeHz6o2.cjs} +6 -6
- package/dist/{alert-DKK_Tb9J.js → alert-xspFetQ8.js} +26 -26
- package/dist/{async-directive-Da7TJpnq.cjs → async-directive-B5pcIMfO.cjs} +1 -1
- package/dist/{async-directive-BPf6K-V2.js → async-directive-D2Sht790.js} +5 -5
- package/dist/{backlink-D1y26pj3.js → backlink-C0jZFnZ2.js} +8 -8
- package/dist/{backlink-CMmrKTe4.cjs → backlink-ZMhqHaVs.cjs} +3 -3
- package/dist/base-elements/element.d.ts +13 -1
- package/dist/base-elements/input-element.d.ts +4 -2
- package/dist/{breadcrumbs-B6JGhJgC.cjs → breadcrumbs-BS64xd1s.cjs} +7 -7
- package/dist/{breadcrumbs-CcTQ3Grm.js → breadcrumbs-BvMownZN.js} +16 -16
- package/dist/{button-2-OSPJkj.js → button-C44vNLFC.js} +28 -28
- package/dist/{button-CE97NQIk.cjs → button-CR4CXtnj.cjs} +7 -7
- package/dist/{calendar-kn4SrtJy.cjs → calendar-DQ4byeom.cjs} +28 -27
- package/dist/{calendar-pOW3R5Pw.js → calendar-DgjCKMMV.js} +82 -68
- package/dist/{card-zQ0eKRMV.js → card-DhHqC265.js} +44 -44
- package/dist/{card-CETDFkxR.cjs → card-Dpqi6HVt.cjs} +26 -26
- package/dist/{checkbox-CH7NpINF.js → checkbox-BQ1K57AB.js} +23 -23
- package/dist/{checkbox-CQNr_sEg.cjs → checkbox-CXQxbiaX.cjs} +11 -11
- package/dist/{class-map-BeimMvPv.cjs → class-map-CzCE5pqG.cjs} +1 -1
- package/dist/{class-map-CnWCnBSX.js → class-map-F1DJHyb7.js} +3 -3
- package/dist/{combobox-Bvg0UO9w.cjs → combobox-BV4oDiII.cjs} +19 -18
- package/dist/{combobox-CRdYYlxu.js → combobox-DPck39I2.js} +55 -54
- package/dist/components/calendar/calendar.d.ts +21 -6
- package/dist/components/checkbox/checkbox.d.ts +4 -2
- package/dist/components/combobox/combobox-base.d.ts +2 -1
- package/dist/components/consent/strings.d.ts +1 -85
- package/dist/components/datepicker/datepicker-base.d.ts +0 -3
- package/dist/components/datepicker/datepicker-multiple.d.ts +0 -2
- package/dist/components/datepicker/datepicker-range.d.ts +0 -2
- package/dist/components/datepicker/datepicker-single.d.ts +0 -2
- package/dist/components/datepicker/datepicker-utils.d.ts +2 -1
- package/dist/components/fileupload/fileupload-base.d.ts +3 -2
- package/dist/components/header/header-service.d.ts +3 -1
- package/dist/components/header/header.d.ts +2 -1
- package/dist/components/helptext/helptext.d.ts +2 -1
- package/dist/components/index.d.ts +2 -0
- package/dist/components/input-wrapper/input-wrapper.d.ts +4 -2
- package/dist/components/radiobutton/radiobutton.d.ts +4 -2
- package/dist/components/searchinput/searchinput.d.ts +2 -1
- package/dist/{consent-DZEkhgJ1.js → consent-BneInZov.js} +10 -10
- package/dist/{consent-CyY3RyoC.cjs → consent-_N9foluG.cjs} +5 -5
- package/dist/controllers/strings-controller.d.ts +27 -0
- package/dist/{datepicker-VTqSDQk5.cjs → datepicker-9NX5qt2z.cjs} +38 -37
- package/dist/{datepicker-ButIas85.js → datepicker-nSSSr1U7.js} +104 -104
- package/dist/{directive-helpers-CI8YZqku.js → directive-helpers-BARw3nEZ.js} +1 -1
- package/dist/{directive-helpers-BlAV5EQD.cjs → directive-helpers-D6AAMFKs.cjs} +1 -1
- package/dist/docs/components/fileupload.d.ts +1 -0
- package/dist/element-B8OGznK0.cjs +2 -0
- package/dist/{element-ChsFgr_B.js → element-BKSPVgs2.js} +240 -100
- package/dist/{element-with-slot-Bj7nm7fO.cjs → element-with-slot-DTxILHVv.cjs} +1 -1
- package/dist/{element-with-slot-BvG9ctC-.js → element-with-slot-YUAUFRqw.js} +4 -4
- package/dist/fileupload-D05VSbEP.cjs +402 -0
- package/dist/{fileupload-D5IQ9HDe.js → fileupload-E0LGGNgj.js} +370 -380
- package/dist/{footer-DbYQUYNR.cjs → footer-DBApIdGh.cjs} +32 -32
- package/dist/{footer-DrR64HiK.js → footer-DYilVBMC.js} +91 -91
- package/dist/format-B8meU8Tm.cjs +1 -0
- package/dist/format-BTeSVkED.js +18 -0
- package/dist/{header-ClgIac6n.cjs → header-B7tbX-Ok.cjs} +84 -84
- package/dist/{header-menu-BAsUNKSx.cjs → header-menu-1FFWhvNc.cjs} +24 -24
- package/dist/{header-menu-hVPXsb8g.js → header-menu-D522-VTV.js} +75 -75
- package/dist/{header-KvJ1mGwA.js → header-v3GWAzOK.js} +267 -264
- package/dist/{heading-CFmiSuCQ.cjs → heading-CvytvcL7.cjs} +1 -1
- package/dist/{heading-g-_IUB5T.js → heading-rx_oSCqe.js} +16 -16
- package/dist/helptext-DYFdcylX.cjs +27 -0
- package/dist/{helptext-DZng1D5i.js → helptext-LShGPm-b.js} +18 -19
- package/dist/{icon-9iwd2F2l.cjs → icon-BmMC09mi.cjs} +1 -1
- package/dist/{icon-D-LA22xD.js → icon-HYU1f54x.js} +17 -17
- package/dist/{if-defined-CGzIlZ9-.js → if-defined-BF8XcDi5.js} +1 -1
- package/dist/if-defined-CVYApOgK.cjs +1 -0
- package/dist/{input-element-DBMNBplu.js → input-element-D07DmR34.js} +121 -120
- package/dist/input-element-DumGj_oJ.cjs +1 -0
- package/dist/input-wrapper-Cci_wTvD.js +308 -0
- package/dist/input-wrapper-DDfapoRX.cjs +58 -0
- package/dist/{link-DK7gvmnj.cjs → link-11g2ZNin.cjs} +4 -4
- package/dist/{link-D-Eqm5KH.js → link-CQK0SH4H.js} +13 -13
- package/dist/{linkcard-zqbg7Oqm.js → linkcard-B4GlmjJ6.js} +16 -16
- package/dist/linkcard-DNYsVlV6.cjs +13 -0
- package/dist/{listbox-Dc4rGdPi.cjs → listbox-BlFRhyI7.cjs} +15 -15
- package/dist/{listbox-va_E8afs.js → listbox-wd_OofyF.js} +100 -99
- package/dist/{loader-D_RDICnw.js → loader-0C3qVk16.js} +14 -14
- package/dist/{loader-CMUkVJmE.cjs → loader-B9u2qUlR.cjs} +5 -5
- package/dist/{messagebox-Cv8LaSxv.cjs → messagebox-BD5tGmT-.cjs} +5 -5
- package/dist/{messagebox-Cw-OWDya.js → messagebox-C-y1ICmr.js} +15 -15
- package/dist/{modal-BtInv031.cjs → modal-BzPGQYCs.cjs} +8 -8
- package/dist/{modal-D0t_X2dX.js → modal-Cghs3w-d.js} +20 -20
- package/dist/pkt-accordion.cjs +1 -1
- package/dist/pkt-accordion.js +1 -1
- package/dist/pkt-alert.cjs +1 -1
- package/dist/pkt-alert.js +1 -1
- package/dist/pkt-backlink.cjs +1 -1
- package/dist/pkt-backlink.js +1 -1
- package/dist/pkt-breadcrumbs.cjs +1 -1
- package/dist/pkt-breadcrumbs.js +1 -1
- package/dist/pkt-button.cjs +1 -1
- package/dist/pkt-button.js +1 -1
- package/dist/pkt-calendar.cjs +1 -1
- package/dist/pkt-calendar.js +1 -1
- package/dist/pkt-card.cjs +1 -1
- package/dist/pkt-card.js +1 -1
- package/dist/pkt-checkbox.cjs +1 -1
- package/dist/pkt-checkbox.js +1 -1
- package/dist/pkt-combobox.cjs +1 -1
- package/dist/pkt-combobox.js +1 -1
- package/dist/pkt-consent.cjs +1 -1
- package/dist/pkt-consent.js +1 -1
- package/dist/pkt-datepicker.cjs +1 -1
- package/dist/pkt-datepicker.js +1 -1
- package/dist/pkt-fileupload.cjs +1 -1
- package/dist/pkt-fileupload.js +1 -1
- package/dist/pkt-footer.cjs +1 -1
- package/dist/pkt-footer.js +1 -1
- package/dist/pkt-header-menu.cjs +1 -1
- package/dist/pkt-header-menu.js +1 -1
- package/dist/pkt-header.cjs +1 -1
- package/dist/pkt-header.js +1 -1
- package/dist/pkt-heading.cjs +1 -1
- package/dist/pkt-heading.js +1 -1
- package/dist/pkt-helptext.cjs +1 -1
- package/dist/pkt-helptext.js +1 -1
- package/dist/pkt-icon.cjs +1 -1
- package/dist/pkt-icon.js +1 -1
- package/dist/pkt-index.cjs +1 -1
- package/dist/pkt-index.js +35 -34
- package/dist/pkt-input-wrapper.cjs +1 -1
- package/dist/pkt-input-wrapper.js +1 -1
- package/dist/pkt-link.cjs +1 -1
- package/dist/pkt-link.js +1 -1
- package/dist/pkt-linkcard.cjs +1 -1
- package/dist/pkt-linkcard.js +1 -1
- package/dist/pkt-listbox.cjs +1 -1
- package/dist/pkt-listbox.js +1 -1
- package/dist/pkt-loader.cjs +1 -1
- package/dist/pkt-loader.js +1 -1
- package/dist/pkt-messagebox.cjs +1 -1
- package/dist/pkt-messagebox.js +1 -1
- package/dist/pkt-modal.cjs +1 -1
- package/dist/pkt-modal.js +1 -1
- package/dist/{pkt-options-controller-C5EBX2T0.cjs → pkt-options-controller-CEEAqXaB.cjs} +1 -1
- package/dist/{pkt-options-controller-B77vH3PE.js → pkt-options-controller-PtjhmTGk.js} +1 -1
- package/dist/pkt-progressbar.cjs +1 -1
- package/dist/pkt-progressbar.js +1 -1
- package/dist/pkt-radiobutton.cjs +1 -1
- package/dist/pkt-radiobutton.js +1 -1
- package/dist/pkt-searchinput.cjs +1 -1
- package/dist/pkt-searchinput.js +1 -1
- package/dist/pkt-select.cjs +1 -1
- package/dist/pkt-select.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/pkt-textarea.cjs +1 -1
- package/dist/pkt-textarea.js +1 -1
- package/dist/pkt-textinput.cjs +1 -1
- package/dist/pkt-textinput.js +1 -1
- package/dist/pkt-timepicker.cjs +1 -1
- package/dist/pkt-timepicker.js +1 -1
- package/dist/{progressbar-CbcfLerF.js → progressbar-BexQQw1o.js} +21 -21
- package/dist/{progressbar-D5MmnQId.cjs → progressbar-X9mSvpjw.cjs} +5 -5
- package/dist/{radiobutton-BUnf3EPi.js → radiobutton-CkhTasn4.js} +24 -24
- package/dist/{radiobutton-DpsO1F-8.cjs → radiobutton-ln29Ad3U.cjs} +8 -8
- package/dist/{ref-CQoEIIp0.cjs → ref-CHbJYtKE.cjs} +1 -1
- package/dist/{ref-CWD6PjVd.js → ref-Chc_DZAb.js} +2 -2
- package/dist/{repeat-sY6B7fAT.cjs → repeat-CHDs__rN.cjs} +1 -1
- package/dist/{repeat-C02g7d5S.js → repeat-P9SMlKd5.js} +4 -4
- package/dist/searchinput-CPgMEAZZ.cjs +60 -0
- package/dist/{searchinput-DwnjsvJ1.js → searchinput-Da7dKHBH.js} +43 -43
- package/dist/{select-BOJi6H6T.cjs → select-DCuvdAuK.cjs} +4 -3
- package/dist/{select-DMre80qs.js → select-jabMSjft.js} +21 -20
- package/dist/shared-strings/consent.d.ts +71 -0
- package/dist/shared-strings/format.d.ts +21 -0
- package/dist/shared-strings/index.d.ts +14 -0
- package/dist/shared-strings/nb.d.ts +118 -0
- package/dist/shared-strings/resolve.d.ts +12 -0
- package/dist/shared-strings/store.d.ts +27 -0
- package/dist/shared-strings/types.d.ts +29 -0
- package/dist/shared-types/fileupload.d.ts +0 -27
- package/dist/shared-types/index.d.ts +1 -2
- package/dist/shared-utils/combobox/index.d.ts +1 -0
- package/dist/shared-utils/combobox/input-utils.d.ts +2 -1
- package/dist/shared-utils/combobox/messages.d.ts +7 -0
- package/dist/shared-utils/combobox/option-utils.d.ts +2 -1
- package/dist/shared-utils/combobox/selection-manager.d.ts +3 -2
- package/dist/{tabs-Cf9ai0FD.cjs → tabs-DV5CQNDL.cjs} +7 -7
- package/dist/{tabs-TvxgbrCF.js → tabs-D_hoi1zu.js} +32 -32
- package/dist/tag-BxYulmZn.cjs +27 -0
- package/dist/{tag-Ds6n1LIs.js → tag-DK5SgKry.js} +33 -32
- package/dist/tests/strings-override.test.d.ts +0 -0
- package/dist/{textarea-vfzIcXhX.js → textarea-BR7Riace.js} +30 -29
- package/dist/{textarea-BydiLM9Z.cjs → textarea-ffBD_VHq.cjs} +3 -2
- package/dist/{textinput-CMP2jPP_.js → textinput-CRNrsRNV.js} +28 -27
- package/dist/{textinput-DGdicNSx.cjs → textinput-CtHFzAux.cjs} +13 -12
- package/dist/timepicker-AfgJipo6.cjs +196 -0
- package/dist/{timepicker-ClwgYywH.js → timepicker-ixs_E5RY.js} +67 -64
- package/package.json +3 -3
- package/src/components/backlink/backlink.ts +1 -1
- package/src/components/breadcrumbs/breadcrumbs.ts +1 -1
- package/src/components/calendar/calendar.ts +56 -26
- package/src/components/checkbox/checkbox.test.ts +0 -2
- package/src/components/checkbox/checkbox.ts +8 -4
- package/src/components/combobox/combobox-base.ts +2 -1
- package/src/components/combobox/combobox-value.ts +10 -9
- package/src/components/combobox/combobox.selection.test.ts +5 -1
- package/src/components/combobox/combobox.ts +4 -1
- package/src/components/consent/strings.ts +1 -125
- package/src/components/datepicker/date-tags.ts +4 -1
- package/src/components/datepicker/datepicker-base.ts +2 -6
- package/src/components/datepicker/datepicker-multiple.ts +0 -3
- package/src/components/datepicker/datepicker-range.ts +4 -7
- package/src/components/datepicker/datepicker-single.ts +0 -3
- package/src/components/datepicker/datepicker-utils.test.ts +5 -5
- package/src/components/datepicker/datepicker-utils.ts +6 -11
- package/src/components/datepicker/datepicker.ts +8 -1
- package/src/components/fileupload/fileupload-base.ts +25 -16
- package/src/components/fileupload/fileupload-renderers.ts +2 -1
- package/src/components/fileupload/fileupload.test.ts +16 -0
- package/src/components/fileupload/fileupload.ts +19 -15
- package/src/components/header/header-global.ts +3 -3
- package/src/components/header/header-service.ts +13 -8
- package/src/components/header/header.ts +2 -1
- package/src/components/helptext/helptext.test.ts +1 -1
- package/src/components/helptext/helptext.ts +3 -3
- package/src/components/index.ts +9 -0
- package/src/components/input-wrapper/input-wrapper.ts +18 -10
- package/src/components/listbox/listbox.ts +3 -3
- package/src/components/radiobutton/radiobutton.ts +8 -4
- package/src/components/searchinput/searchinput.ts +5 -3
- package/src/components/select/select.ts +1 -0
- package/src/components/tag/tag.ts +2 -1
- package/src/components/textarea/textarea.ts +1 -0
- package/src/components/textinput/textinput.ts +1 -0
- package/src/components/timepicker/timepicker.ts +23 -21
- package/dist/element-BA8v6S7z.cjs +0 -2
- package/dist/fileupload-BeWiTAoW.cjs +0 -401
- package/dist/helptext-CTtKJcML.cjs +0 -27
- package/dist/if-defined-B89_ZeCj.cjs +0 -1
- package/dist/input-element-DYmQw-fH.cjs +0 -1
- package/dist/input-wrapper-BmxNvznr.js +0 -128
- package/dist/input-wrapper-D-fPaTbY.js +0 -176
- package/dist/input-wrapper-D5PR0rJn.cjs +0 -1
- package/dist/input-wrapper-Q-B-aBeb.cjs +0 -54
- package/dist/linkcard-B29cmZqh.cjs +0 -13
- package/dist/searchinput-Bh975rjX.cjs +0 -60
- package/dist/tag-CzojNU7z.cjs +0 -27
- package/dist/timepicker-DYrnLHqN.cjs +0 -195
- package/dist/translations/no.json.d.ts +0 -94
|
@@ -1,128 +0,0 @@
|
|
|
1
|
-
import { d as e, n as t, o as n, p as r, r as i, s as a } from "./element-ChsFgr_B.js";
|
|
2
|
-
import { n as o, t as s } from "./element-with-slot-BvG9ctC-.js";
|
|
3
|
-
import "./alert-DKK_Tb9J.js";
|
|
4
|
-
import { r as c } from "./icon-D-LA22xD.js";
|
|
5
|
-
import { t as l } from "./if-defined-CGzIlZ9-.js";
|
|
6
|
-
import { n as u } from "./utils-BwF4QSrq.js";
|
|
7
|
-
import { t as d } from "./booleanish-OQJTYSrw.js";
|
|
8
|
-
import { t as f } from "./input-wrapper-D-fPaTbY.js";
|
|
9
|
-
import "./helptext-DZng1D5i.js";
|
|
10
|
-
import { t as p } from "./focus-modality-controller-Dc2S-KqR.js";
|
|
11
|
-
//#region ../../shared-utils/forms/described-by.ts
|
|
12
|
-
var m = (e) => {
|
|
13
|
-
let t = [];
|
|
14
|
-
return e.hasHelptext && t.push(`${e.id}-helptext`), e.hasCounter && t.push(`${e.id}-counter-status`), e.ariaDescribedby && t.push(e.ariaDescribedby), t.length ? t.join(" ") : void 0;
|
|
15
|
-
}, h = (e) => `${e}-counter-status`, g = (e, t) => !!t && t > 0 && (e ?? 0) > t, _ = class extends s {
|
|
16
|
-
constructor(...e) {
|
|
17
|
-
super(...e), this.forId = u(), this.label = "", this.helptext = null, this.helptextDropdown = null, this.helptextDropdownButton = null, this.counter = f.props.counter.default, this.counterCurrent = 0, this.counterMaxLength = 0, this.counterError = null, this.counterPosition = "bottom", this.optionalTag = f.props.optionalTag.default, this.optionalText = f.props.optionalText.default, this.requiredTag = f.props.requiredTag.default, this.requiredText = f.props.requiredText.default, this.tagText = null, this.hasError = f.props.hasError.default, this.errorMessage = "", this.disabled = f.props.disabled.default, this.inline = f.props.inline.default, this.ariaDescribedby = void 0, this.hasFieldset = f.props.hasFieldset.default, this.role = null, this.useWrapper = f.props.useWrapper.default, this.size = "medium", this.focusModality = new p(this);
|
|
18
|
-
}
|
|
19
|
-
updated(e) {
|
|
20
|
-
super.updated(e), this.classList.add("pkt-inputwrapper"), this.classList.toggle("pkt-inputwrapper--error", this.hasError), this.classList.toggle("pkt-inputwrapper--disabled", this.disabled), this.classList.toggle("pkt-inputwrapper--inline", this.inline), this.classList.toggle("pkt-inputwrapper--medium", this.size === "medium"), this.classList.toggle("pkt-inputwrapper--small", this.size === "small"), this.classList.toggle("pkt-inputwrapper--xsmall", this.size === "xsmall"), this.role ? this.setAttribute("aria-labelledby", `${this.forId}-label`) : this.removeAttribute("aria-labelledby");
|
|
21
|
-
}
|
|
22
|
-
render() {
|
|
23
|
-
let t = "pkt-tag pkt-tag--small pkt-tag--thin-text", n = this.ariaDescribedby ? this.ariaDescribedby : this.helptext ? `${this.forId}-helptext` : e, a = () => r`
|
|
24
|
-
${this.tagText ? r`<span class=${t + " pkt-tag--gray"}>${this.tagText}</span>` : e}
|
|
25
|
-
${this.optionalTag ? r`<span class=${t + " pkt-tag--blue-light"}>${this.optionalText}</span>` : e}
|
|
26
|
-
${this.requiredTag ? r`<span class=${t + " pkt-tag--beige"}>${this.requiredText}</span>` : e}
|
|
27
|
-
`, s = () => this.useWrapper ? this.hasFieldset ? r`<legend
|
|
28
|
-
class="pkt-inputwrapper__legend"
|
|
29
|
-
id="${this.forId}-label"
|
|
30
|
-
@click=${this.handleLabelClick}
|
|
31
|
-
>
|
|
32
|
-
${this.label} ${a()}
|
|
33
|
-
</legend>` : r`<label
|
|
34
|
-
class="pkt-inputwrapper__label"
|
|
35
|
-
for="${this.forId}"
|
|
36
|
-
id="${this.forId}-label"
|
|
37
|
-
@click=${this.handleLabelClick}
|
|
38
|
-
>${this.label}${a()}</label
|
|
39
|
-
>` : r`<label for="${this.forId}" class="pkt-sr-only" id="${this.forId}-label">
|
|
40
|
-
${this.label}
|
|
41
|
-
</label>`, u = () => r`
|
|
42
|
-
<pkt-helptext
|
|
43
|
-
class="${l(this.useWrapper ? void 0 : "pkt-hide")}"
|
|
44
|
-
.forId=${this.forId}
|
|
45
|
-
.helptext=${this.helptext}
|
|
46
|
-
.helptextDropdown=${this.helptextDropdown}
|
|
47
|
-
.helptextDropdownButton=${this.helptextDropdownButton || f.props.helptextDropdownButton.default}
|
|
48
|
-
@toggleHelpText=${(e) => {
|
|
49
|
-
this.toggleDropdown(e);
|
|
50
|
-
}}
|
|
51
|
-
>${o(this, "helptext")}</pkt-helptext
|
|
52
|
-
>
|
|
53
|
-
`, d = () => {
|
|
54
|
-
if (!this.counter) return e;
|
|
55
|
-
let t = g(this.counterCurrent, this.counterMaxLength);
|
|
56
|
-
return r`<div class="pkt-input__counter" aria-hidden="true">
|
|
57
|
-
${this.counterError ? this.counterError : e} ${this.counterCurrent || 0}
|
|
58
|
-
${this.counterMaxLength ? `/${this.counterMaxLength}` : e}
|
|
59
|
-
</div>
|
|
60
|
-
<div class="pkt-sr-only" id=${h(this.forId)} aria-live="polite">
|
|
61
|
-
${t ? i.forms.messages.counterExceeded.replace("{current}", String(this.counterCurrent ?? 0)).replace("{max}", String(this.counterMaxLength)) : ""}
|
|
62
|
-
</div>`;
|
|
63
|
-
}, p = () => {
|
|
64
|
-
if (this.hasError && this.errorMessage) {
|
|
65
|
-
let e = this.size === "medium" ? "small" : "xsmall";
|
|
66
|
-
return r`<div class="pkt-inputwrapper__alert-wrapper">
|
|
67
|
-
<pkt-alert
|
|
68
|
-
skin="error"
|
|
69
|
-
.size=${e}
|
|
70
|
-
id=${`${this.forId}-error`}
|
|
71
|
-
aria-live="assertive"
|
|
72
|
-
aria-atomic="true"
|
|
73
|
-
>
|
|
74
|
-
${c(this.errorMessage)}
|
|
75
|
-
</pkt-alert>
|
|
76
|
-
</div>`;
|
|
77
|
-
}
|
|
78
|
-
return e;
|
|
79
|
-
}, m = () => r`
|
|
80
|
-
${s()}
|
|
81
|
-
${u()}
|
|
82
|
-
${this.counterPosition === "top" ? d() : e}
|
|
83
|
-
<div class="pkt-contents">${o(this)}</div>
|
|
84
|
-
${this.counterPosition === "bottom" ? d() : e}
|
|
85
|
-
${p()}
|
|
86
|
-
`;
|
|
87
|
-
return this.hasFieldset ? r`<fieldset class="pkt-inputwrapper__fieldset" aria-describedby="${n}">
|
|
88
|
-
${m()}
|
|
89
|
-
</fieldset>` : r`<div class="pkt-inputwrapper__fieldset">${m()}</div>`;
|
|
90
|
-
}
|
|
91
|
-
toggleDropdown(e) {
|
|
92
|
-
this.dispatchEvent(new CustomEvent("toggleHelpText", {
|
|
93
|
-
bubbles: !1,
|
|
94
|
-
detail: { isOpen: e.detail.isOpen }
|
|
95
|
-
}));
|
|
96
|
-
}
|
|
97
|
-
handleLabelClick() {
|
|
98
|
-
this.dispatchEvent(new CustomEvent("labelClick", {
|
|
99
|
-
bubbles: !0,
|
|
100
|
-
composed: !0,
|
|
101
|
-
detail: "label clicked"
|
|
102
|
-
}));
|
|
103
|
-
}
|
|
104
|
-
};
|
|
105
|
-
t([n({ type: String })], _.prototype, "forId", void 0), t([n({ type: String })], _.prototype, "label", void 0), t([n({ type: String })], _.prototype, "helptext", void 0), t([n({ type: String })], _.prototype, "helptextDropdown", void 0), t([n({ type: String })], _.prototype, "helptextDropdownButton", void 0), t([n({ type: Boolean })], _.prototype, "counter", void 0), t([n({ type: Number })], _.prototype, "counterCurrent", void 0), t([n({ type: Number })], _.prototype, "counterMaxLength", void 0), t([n({ type: String })], _.prototype, "counterError", void 0), t([n({
|
|
106
|
-
type: String,
|
|
107
|
-
reflect: !1
|
|
108
|
-
})], _.prototype, "counterPosition", void 0), t([n({ type: Boolean })], _.prototype, "optionalTag", void 0), t([n({ type: String })], _.prototype, "optionalText", void 0), t([n({ type: Boolean })], _.prototype, "requiredTag", void 0), t([n({ type: String })], _.prototype, "requiredText", void 0), t([n({ type: String })], _.prototype, "tagText", void 0), t([n({ type: Boolean })], _.prototype, "hasError", void 0), t([n({ type: String })], _.prototype, "errorMessage", void 0), t([n({ type: Boolean })], _.prototype, "disabled", void 0), t([n({ type: Boolean })], _.prototype, "inline", void 0), t([n({ type: String })], _.prototype, "ariaDescribedby", void 0), t([n({ type: Boolean })], _.prototype, "hasFieldset", void 0), t([n({
|
|
109
|
-
type: String,
|
|
110
|
-
reflect: !0
|
|
111
|
-
})], _.prototype, "role", void 0), t([n({
|
|
112
|
-
type: Boolean,
|
|
113
|
-
reflect: !0,
|
|
114
|
-
converter: d
|
|
115
|
-
})], _.prototype, "useWrapper", void 0), t([n({
|
|
116
|
-
type: String,
|
|
117
|
-
attribute: "input-wrapper-size"
|
|
118
|
-
})], _.prototype, "size", void 0);
|
|
119
|
-
try {
|
|
120
|
-
a("pkt-input-wrapper")(_);
|
|
121
|
-
} catch {
|
|
122
|
-
console.warn("Forsøker å definere <pkt-input-wrapper>, men den er allerede definert");
|
|
123
|
-
}
|
|
124
|
-
//#endregion
|
|
125
|
-
//#region src/components/input-wrapper/index.ts
|
|
126
|
-
var v = _;
|
|
127
|
-
//#endregion
|
|
128
|
-
export { _ as n, m as r, v as t };
|
|
@@ -1,176 +0,0 @@
|
|
|
1
|
-
var e = {
|
|
2
|
-
name: "pkt-input-wrapper",
|
|
3
|
-
react: "PktInputWrapper",
|
|
4
|
-
"css-class": "pkt-inputwrapper",
|
|
5
|
-
isElement: !0,
|
|
6
|
-
isPureReact: !0,
|
|
7
|
-
events: { toggleHelpText: { description: "Event for å vise eller skjule hjelpetekst i dropdown" } },
|
|
8
|
-
slots: { default: { description: "Innholdet i input-wrapperen, som kan være et skjemaelement eller en annen komponent" } },
|
|
9
|
-
props: {
|
|
10
|
-
forId: {
|
|
11
|
-
name: "For ID",
|
|
12
|
-
description: "Id-en til skjemaelementet som dette wrapper rundt",
|
|
13
|
-
type: "string",
|
|
14
|
-
required: !0,
|
|
15
|
-
category: "tech"
|
|
16
|
-
},
|
|
17
|
-
label: {
|
|
18
|
-
name: "Merkelapp",
|
|
19
|
-
description: "Merkelapp for skjemaelementet",
|
|
20
|
-
type: "string",
|
|
21
|
-
required: !0,
|
|
22
|
-
category: "contents"
|
|
23
|
-
},
|
|
24
|
-
helptext: {
|
|
25
|
-
name: "Hjelpetekst",
|
|
26
|
-
description: "Hjelpetekst for skjemaelementet",
|
|
27
|
-
type: "string",
|
|
28
|
-
category: "contents"
|
|
29
|
-
},
|
|
30
|
-
helptextDropdown: {
|
|
31
|
-
name: "Hjelpetekst i dropdown",
|
|
32
|
-
description: "Hjelpetekst som vises i ekspanderende felt",
|
|
33
|
-
type: "string",
|
|
34
|
-
category: "contents"
|
|
35
|
-
},
|
|
36
|
-
helptextDropdownButton: {
|
|
37
|
-
name: "Tekst i hjelpetekst-knapp",
|
|
38
|
-
description: "Tekst som vises i knappen for å vise hjelpetekst i dropdown",
|
|
39
|
-
default: "Les mer <span class='pkt-sr-only'>om feltet</span>",
|
|
40
|
-
type: "string",
|
|
41
|
-
category: "contents"
|
|
42
|
-
},
|
|
43
|
-
ariaDescribedby: {
|
|
44
|
-
name: "aria-describedby",
|
|
45
|
-
description: "Id-en til elementet som beskriver skjemaelementet",
|
|
46
|
-
type: "string",
|
|
47
|
-
category: "accessibility"
|
|
48
|
-
},
|
|
49
|
-
counter: {
|
|
50
|
-
name: "Teller",
|
|
51
|
-
description: "Teller for antall tegn i skjemaelementet",
|
|
52
|
-
type: "boolean",
|
|
53
|
-
default: !1,
|
|
54
|
-
category: "ui"
|
|
55
|
-
},
|
|
56
|
-
counterCurrent: {
|
|
57
|
-
name: "Tellerverdi",
|
|
58
|
-
description: "Tellerens nåværende verdi",
|
|
59
|
-
type: "number",
|
|
60
|
-
category: "ui",
|
|
61
|
-
showIf: { counter: !0 }
|
|
62
|
-
},
|
|
63
|
-
counterMaxLength: {
|
|
64
|
-
name: "Maks tegn i teller",
|
|
65
|
-
description: "Maks antall tegn som kan skrives i skjemaelementet",
|
|
66
|
-
type: "number",
|
|
67
|
-
category: "ui",
|
|
68
|
-
showIf: { counter: !0 }
|
|
69
|
-
},
|
|
70
|
-
counterPosition: {
|
|
71
|
-
name: "Tellerplassering",
|
|
72
|
-
description: "Telleren sin plassering i forhold til elementet",
|
|
73
|
-
type: ["top", "bottom"],
|
|
74
|
-
default: "bottom",
|
|
75
|
-
category: "ui",
|
|
76
|
-
showIf: { counter: !0 }
|
|
77
|
-
},
|
|
78
|
-
optionalTag: {
|
|
79
|
-
name: "Vise valgfritt-merking",
|
|
80
|
-
description: "Viser en merking som indikerer at feltet er valgfritt",
|
|
81
|
-
type: "boolean",
|
|
82
|
-
default: !1,
|
|
83
|
-
category: "ui"
|
|
84
|
-
},
|
|
85
|
-
optionalText: {
|
|
86
|
-
name: "Valgfritt-tekst",
|
|
87
|
-
description: "Tekst som vises i valgfritt-merkingen",
|
|
88
|
-
type: "string",
|
|
89
|
-
default: "Valgfritt",
|
|
90
|
-
category: "contents"
|
|
91
|
-
},
|
|
92
|
-
requiredTag: {
|
|
93
|
-
name: "Vise påkrevd-merking",
|
|
94
|
-
description: "Viser en merking som indikerer at feltet er påkrevd",
|
|
95
|
-
type: "boolean",
|
|
96
|
-
default: !1,
|
|
97
|
-
category: "ui"
|
|
98
|
-
},
|
|
99
|
-
requiredText: {
|
|
100
|
-
name: "Påkrevd-tekst",
|
|
101
|
-
description: "Tekst som vises i påkrevd-merkingen",
|
|
102
|
-
type: "string",
|
|
103
|
-
default: "Må fylles ut",
|
|
104
|
-
category: "contents"
|
|
105
|
-
},
|
|
106
|
-
tagText: {
|
|
107
|
-
type: "string",
|
|
108
|
-
name: "Tag-tekst",
|
|
109
|
-
description: "Tekst som vises i en tag ved siden av label",
|
|
110
|
-
category: "ui"
|
|
111
|
-
},
|
|
112
|
-
hasError: {
|
|
113
|
-
name: "Feil",
|
|
114
|
-
description: "Indikerer at skjemaelementet har en feil",
|
|
115
|
-
type: "boolean",
|
|
116
|
-
default: !1,
|
|
117
|
-
category: "ui"
|
|
118
|
-
},
|
|
119
|
-
errorMessage: {
|
|
120
|
-
name: "Feilmelding",
|
|
121
|
-
description: "Feilmelding som vises når skjemaelementet har en feil",
|
|
122
|
-
type: "string",
|
|
123
|
-
category: "contents"
|
|
124
|
-
},
|
|
125
|
-
disabled: {
|
|
126
|
-
name: "Deaktivert",
|
|
127
|
-
description: "Indikerer at skjemaelementet er deaktivert",
|
|
128
|
-
type: "boolean",
|
|
129
|
-
default: !1,
|
|
130
|
-
category: "tech"
|
|
131
|
-
},
|
|
132
|
-
inline: {
|
|
133
|
-
name: "Inline",
|
|
134
|
-
description: "Indikerer at skjemaelementet skal flyte sammen med sidens innhold",
|
|
135
|
-
type: "boolean",
|
|
136
|
-
default: !1,
|
|
137
|
-
category: "ui"
|
|
138
|
-
},
|
|
139
|
-
hasFieldset: {
|
|
140
|
-
name: "Er fieldset",
|
|
141
|
-
description: "Indikerer at innholdet er et fieldset",
|
|
142
|
-
type: "boolean",
|
|
143
|
-
default: !1,
|
|
144
|
-
category: "ui"
|
|
145
|
-
},
|
|
146
|
-
useWrapper: {
|
|
147
|
-
name: "Bruk wrapper",
|
|
148
|
-
description: "Indikerer om skjemaelementet skal bruke en wrapper",
|
|
149
|
-
type: "boolean",
|
|
150
|
-
displayAsFalse: !0,
|
|
151
|
-
default: !0,
|
|
152
|
-
category: "ui"
|
|
153
|
-
},
|
|
154
|
-
role: {
|
|
155
|
-
name: "Rolle",
|
|
156
|
-
description: "ARIA-rolle på wrapperen. Settes ikke som standard. Bruk hasFieldset for reelle grupper.",
|
|
157
|
-
type: "string",
|
|
158
|
-
default: null,
|
|
159
|
-
category: "accessibility"
|
|
160
|
-
},
|
|
161
|
-
size: {
|
|
162
|
-
name: "Størrelse",
|
|
163
|
-
description: "Visuell størrelse. small: kompakt wrapper og felt (42px). xsmall: samme wrapper som small, felt 36px.",
|
|
164
|
-
attribute: "input-wrapper-size",
|
|
165
|
-
type: [
|
|
166
|
-
"small",
|
|
167
|
-
"medium",
|
|
168
|
-
"xsmall"
|
|
169
|
-
],
|
|
170
|
-
default: "medium",
|
|
171
|
-
category: "ui"
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
};
|
|
175
|
-
//#endregion
|
|
176
|
-
export { e as t };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
var e={name:`pkt-input-wrapper`,react:`PktInputWrapper`,"css-class":`pkt-inputwrapper`,isElement:!0,isPureReact:!0,events:{toggleHelpText:{description:`Event for å vise eller skjule hjelpetekst i dropdown`}},slots:{default:{description:`Innholdet i input-wrapperen, som kan være et skjemaelement eller en annen komponent`}},props:{forId:{name:`For ID`,description:`Id-en til skjemaelementet som dette wrapper rundt`,type:`string`,required:!0,category:`tech`},label:{name:`Merkelapp`,description:`Merkelapp for skjemaelementet`,type:`string`,required:!0,category:`contents`},helptext:{name:`Hjelpetekst`,description:`Hjelpetekst for skjemaelementet`,type:`string`,category:`contents`},helptextDropdown:{name:`Hjelpetekst i dropdown`,description:`Hjelpetekst som vises i ekspanderende felt`,type:`string`,category:`contents`},helptextDropdownButton:{name:`Tekst i hjelpetekst-knapp`,description:`Tekst som vises i knappen for å vise hjelpetekst i dropdown`,default:`Les mer <span class='pkt-sr-only'>om feltet</span>`,type:`string`,category:`contents`},ariaDescribedby:{name:`aria-describedby`,description:`Id-en til elementet som beskriver skjemaelementet`,type:`string`,category:`accessibility`},counter:{name:`Teller`,description:`Teller for antall tegn i skjemaelementet`,type:`boolean`,default:!1,category:`ui`},counterCurrent:{name:`Tellerverdi`,description:`Tellerens nåværende verdi`,type:`number`,category:`ui`,showIf:{counter:!0}},counterMaxLength:{name:`Maks tegn i teller`,description:`Maks antall tegn som kan skrives i skjemaelementet`,type:`number`,category:`ui`,showIf:{counter:!0}},counterPosition:{name:`Tellerplassering`,description:`Telleren sin plassering i forhold til elementet`,type:[`top`,`bottom`],default:`bottom`,category:`ui`,showIf:{counter:!0}},optionalTag:{name:`Vise valgfritt-merking`,description:`Viser en merking som indikerer at feltet er valgfritt`,type:`boolean`,default:!1,category:`ui`},optionalText:{name:`Valgfritt-tekst`,description:`Tekst som vises i valgfritt-merkingen`,type:`string`,default:`Valgfritt`,category:`contents`},requiredTag:{name:`Vise påkrevd-merking`,description:`Viser en merking som indikerer at feltet er påkrevd`,type:`boolean`,default:!1,category:`ui`},requiredText:{name:`Påkrevd-tekst`,description:`Tekst som vises i påkrevd-merkingen`,type:`string`,default:`Må fylles ut`,category:`contents`},tagText:{type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},hasError:{name:`Feil`,description:`Indikerer at skjemaelementet har en feil`,type:`boolean`,default:!1,category:`ui`},errorMessage:{name:`Feilmelding`,description:`Feilmelding som vises når skjemaelementet har en feil`,type:`string`,category:`contents`},disabled:{name:`Deaktivert`,description:`Indikerer at skjemaelementet er deaktivert`,type:`boolean`,default:!1,category:`tech`},inline:{name:`Inline`,description:`Indikerer at skjemaelementet skal flyte sammen med sidens innhold`,type:`boolean`,default:!1,category:`ui`},hasFieldset:{name:`Er fieldset`,description:`Indikerer at innholdet er et fieldset`,type:`boolean`,default:!1,category:`ui`},useWrapper:{name:`Bruk wrapper`,description:`Indikerer om skjemaelementet skal bruke en wrapper`,type:`boolean`,displayAsFalse:!0,default:!0,category:`ui`},role:{name:`Rolle`,description:`ARIA-rolle på wrapperen. Settes ikke som standard. Bruk hasFieldset for reelle grupper.`,type:`string`,default:null,category:`accessibility`},size:{name:`Størrelse`,description:`Visuell størrelse. small: kompakt wrapper og felt (42px). xsmall: samme wrapper som small, felt 36px.`,attribute:`input-wrapper-size`,type:[`small`,`medium`,`xsmall`],default:`medium`,category:`ui`}}};Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return e}});
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
const e=require("./element-BA8v6S7z.cjs"),t=require("./element-with-slot-Bj7nm7fO.cjs");require("./alert-Cs4Rmq_J.cjs");const n=require("./icon-9iwd2F2l.cjs"),r=require("./if-defined-B89_ZeCj.cjs"),i=require("./utils-63cRpWut.cjs"),a=require("./booleanish-BF8l4scU.cjs"),o=require("./input-wrapper-D5PR0rJn.cjs");require("./helptext-CTtKJcML.cjs");const s=require("./focus-modality-controller-C1ocyv2J.cjs");var c=e=>{let t=[];return e.hasHelptext&&t.push(`${e.id}-helptext`),e.hasCounter&&t.push(`${e.id}-counter-status`),e.ariaDescribedby&&t.push(e.ariaDescribedby),t.length?t.join(` `):void 0},l=e=>`${e}-counter-status`,u=(e,t)=>!!t&&t>0&&(e??0)>t,d=class extends t.t{constructor(...e){super(...e),this.forId=i.n(),this.label=``,this.helptext=null,this.helptextDropdown=null,this.helptextDropdownButton=null,this.counter=o.t.props.counter.default,this.counterCurrent=0,this.counterMaxLength=0,this.counterError=null,this.counterPosition=`bottom`,this.optionalTag=o.t.props.optionalTag.default,this.optionalText=o.t.props.optionalText.default,this.requiredTag=o.t.props.requiredTag.default,this.requiredText=o.t.props.requiredText.default,this.tagText=null,this.hasError=o.t.props.hasError.default,this.errorMessage=``,this.disabled=o.t.props.disabled.default,this.inline=o.t.props.inline.default,this.ariaDescribedby=void 0,this.hasFieldset=o.t.props.hasFieldset.default,this.role=null,this.useWrapper=o.t.props.useWrapper.default,this.size=`medium`,this.focusModality=new s.t(this)}updated(e){super.updated(e),this.classList.add(`pkt-inputwrapper`),this.classList.toggle(`pkt-inputwrapper--error`,this.hasError),this.classList.toggle(`pkt-inputwrapper--disabled`,this.disabled),this.classList.toggle(`pkt-inputwrapper--inline`,this.inline),this.classList.toggle(`pkt-inputwrapper--medium`,this.size===`medium`),this.classList.toggle(`pkt-inputwrapper--small`,this.size===`small`),this.classList.toggle(`pkt-inputwrapper--xsmall`,this.size===`xsmall`),this.role?this.setAttribute(`aria-labelledby`,`${this.forId}-label`):this.removeAttribute(`aria-labelledby`)}render(){let i=`pkt-tag pkt-tag--small pkt-tag--thin-text`,a=this.ariaDescribedby?this.ariaDescribedby:this.helptext?`${this.forId}-helptext`:e.d,s=()=>e.p`
|
|
2
|
-
${this.tagText?e.p`<span class=${i+` pkt-tag--gray`}>${this.tagText}</span>`:e.d}
|
|
3
|
-
${this.optionalTag?e.p`<span class=${i+` pkt-tag--blue-light`}>${this.optionalText}</span>`:e.d}
|
|
4
|
-
${this.requiredTag?e.p`<span class=${i+` pkt-tag--beige`}>${this.requiredText}</span>`:e.d}
|
|
5
|
-
`,c=()=>this.useWrapper?this.hasFieldset?e.p`<legend
|
|
6
|
-
class="pkt-inputwrapper__legend"
|
|
7
|
-
id="${this.forId}-label"
|
|
8
|
-
@click=${this.handleLabelClick}
|
|
9
|
-
>
|
|
10
|
-
${this.label} ${s()}
|
|
11
|
-
</legend>`:e.p`<label
|
|
12
|
-
class="pkt-inputwrapper__label"
|
|
13
|
-
for="${this.forId}"
|
|
14
|
-
id="${this.forId}-label"
|
|
15
|
-
@click=${this.handleLabelClick}
|
|
16
|
-
>${this.label}${s()}</label
|
|
17
|
-
>`:e.p`<label for="${this.forId}" class="pkt-sr-only" id="${this.forId}-label">
|
|
18
|
-
${this.label}
|
|
19
|
-
</label>`,d=()=>e.p`
|
|
20
|
-
<pkt-helptext
|
|
21
|
-
class="${r.t(this.useWrapper?void 0:`pkt-hide`)}"
|
|
22
|
-
.forId=${this.forId}
|
|
23
|
-
.helptext=${this.helptext}
|
|
24
|
-
.helptextDropdown=${this.helptextDropdown}
|
|
25
|
-
.helptextDropdownButton=${this.helptextDropdownButton||o.t.props.helptextDropdownButton.default}
|
|
26
|
-
@toggleHelpText=${e=>{this.toggleDropdown(e)}}
|
|
27
|
-
>${t.n(this,`helptext`)}</pkt-helptext
|
|
28
|
-
>
|
|
29
|
-
`,f=()=>{if(!this.counter)return e.d;let t=u(this.counterCurrent,this.counterMaxLength);return e.p`<div class="pkt-input__counter" aria-hidden="true">
|
|
30
|
-
${this.counterError?this.counterError:e.d} ${this.counterCurrent||0}
|
|
31
|
-
${this.counterMaxLength?`/${this.counterMaxLength}`:e.d}
|
|
32
|
-
</div>
|
|
33
|
-
<div class="pkt-sr-only" id=${l(this.forId)} aria-live="polite">
|
|
34
|
-
${t?e.r.forms.messages.counterExceeded.replace(`{current}`,String(this.counterCurrent??0)).replace(`{max}`,String(this.counterMaxLength)):``}
|
|
35
|
-
</div>`},p=()=>{if(this.hasError&&this.errorMessage){let t=this.size===`medium`?`small`:`xsmall`;return e.p`<div class="pkt-inputwrapper__alert-wrapper">
|
|
36
|
-
<pkt-alert
|
|
37
|
-
skin="error"
|
|
38
|
-
.size=${t}
|
|
39
|
-
id=${`${this.forId}-error`}
|
|
40
|
-
aria-live="assertive"
|
|
41
|
-
aria-atomic="true"
|
|
42
|
-
>
|
|
43
|
-
${n.r(this.errorMessage)}
|
|
44
|
-
</pkt-alert>
|
|
45
|
-
</div>`}return e.d},m=()=>e.p`
|
|
46
|
-
${c()}
|
|
47
|
-
${d()}
|
|
48
|
-
${this.counterPosition===`top`?f():e.d}
|
|
49
|
-
<div class="pkt-contents">${t.n(this)}</div>
|
|
50
|
-
${this.counterPosition===`bottom`?f():e.d}
|
|
51
|
-
${p()}
|
|
52
|
-
`;return this.hasFieldset?e.p`<fieldset class="pkt-inputwrapper__fieldset" aria-describedby="${a}">
|
|
53
|
-
${m()}
|
|
54
|
-
</fieldset>`:e.p`<div class="pkt-inputwrapper__fieldset">${m()}</div>`}toggleDropdown(e){this.dispatchEvent(new CustomEvent(`toggleHelpText`,{bubbles:!1,detail:{isOpen:e.detail.isOpen}}))}handleLabelClick(){this.dispatchEvent(new CustomEvent(`labelClick`,{bubbles:!0,composed:!0,detail:`label clicked`}))}};e.n([e.o({type:String})],d.prototype,`forId`,void 0),e.n([e.o({type:String})],d.prototype,`label`,void 0),e.n([e.o({type:String})],d.prototype,`helptext`,void 0),e.n([e.o({type:String})],d.prototype,`helptextDropdown`,void 0),e.n([e.o({type:String})],d.prototype,`helptextDropdownButton`,void 0),e.n([e.o({type:Boolean})],d.prototype,`counter`,void 0),e.n([e.o({type:Number})],d.prototype,`counterCurrent`,void 0),e.n([e.o({type:Number})],d.prototype,`counterMaxLength`,void 0),e.n([e.o({type:String})],d.prototype,`counterError`,void 0),e.n([e.o({type:String,reflect:!1})],d.prototype,`counterPosition`,void 0),e.n([e.o({type:Boolean})],d.prototype,`optionalTag`,void 0),e.n([e.o({type:String})],d.prototype,`optionalText`,void 0),e.n([e.o({type:Boolean})],d.prototype,`requiredTag`,void 0),e.n([e.o({type:String})],d.prototype,`requiredText`,void 0),e.n([e.o({type:String})],d.prototype,`tagText`,void 0),e.n([e.o({type:Boolean})],d.prototype,`hasError`,void 0),e.n([e.o({type:String})],d.prototype,`errorMessage`,void 0),e.n([e.o({type:Boolean})],d.prototype,`disabled`,void 0),e.n([e.o({type:Boolean})],d.prototype,`inline`,void 0),e.n([e.o({type:String})],d.prototype,`ariaDescribedby`,void 0),e.n([e.o({type:Boolean})],d.prototype,`hasFieldset`,void 0),e.n([e.o({type:String,reflect:!0})],d.prototype,`role`,void 0),e.n([e.o({type:Boolean,reflect:!0,converter:a.t})],d.prototype,`useWrapper`,void 0),e.n([e.o({type:String,attribute:`input-wrapper-size`})],d.prototype,`size`,void 0);try{e.s(`pkt-input-wrapper`)(d)}catch{console.warn(`Forsøker å definere <pkt-input-wrapper>, men den er allerede definert`)}var f=d;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return f}});
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
const e=require("./element-BA8v6S7z.cjs"),t=require("./element-with-slot-Bj7nm7fO.cjs");require("./icon-9iwd2F2l.cjs");const n=require("./if-defined-B89_ZeCj.cjs");var r=class extends t.t{constructor(...e){super(...e),this.title=``,this.href=`#`,this.iconName=``,this.external=!1,this.openInNewTab=!1,this.skin=`normal`}render(){let r=[`pkt-linkcard`,this.skin&&`pkt-linkcard--${this.skin}`].filter(Boolean).join(` `),i=[`pkt-linkcard__title`,this.external&&`pkt-link pkt-link--external`].filter(Boolean).join(` `);return e.p`
|
|
2
|
-
<a
|
|
3
|
-
href=${this.href}
|
|
4
|
-
class=${r}
|
|
5
|
-
target=${this.openInNewTab?`_blank`:`_self`}
|
|
6
|
-
rel=${n.t(this.openInNewTab?`noopener noreferrer`:void 0)}
|
|
7
|
-
>
|
|
8
|
-
${this.iconName&&e.p`<pkt-icon class="pkt-link__icon" name="${this.iconName}" />`}
|
|
9
|
-
${this.title&&e.p`<div class=${i}>${this.title}</div>`}
|
|
10
|
-
|
|
11
|
-
<div class="pkt-linkcard__text">${t.n(this)}</div>
|
|
12
|
-
</a>
|
|
13
|
-
`}};e.n([e.o({type:String,reflect:!0})],r.prototype,`title`,void 0),e.n([e.o({type:String,reflect:!0})],r.prototype,`href`,void 0),e.n([e.o({type:String,reflect:!0})],r.prototype,`iconName`,void 0),e.n([e.o({type:Boolean,reflect:!0})],r.prototype,`external`,void 0),e.n([e.o({type:Boolean,reflect:!0})],r.prototype,`openInNewTab`,void 0),e.n([e.o({type:String,reflect:!0})],r.prototype,`skin`,void 0);try{e.s(`pkt-linkcard`)(r)}catch{console.warn(`Forsøker å definere <pkt-linkcard>, men den er allerede definert`)}var i=r;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return i}});
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
const e=require("./element-BA8v6S7z.cjs"),t=require("./class-map-BeimMvPv.cjs");require("./icon-9iwd2F2l.cjs");const n=require("./if-defined-B89_ZeCj.cjs"),r=require("./focus-modality-controller-C1ocyv2J.cjs");var i=class extends e.t{constructor(...e){super(...e),this.appearance=`local`,this.inputSize=`medium`,this.disabled=!1,this.fullwidth=!1,this.id=``,this.placeholder=`Søk…`,this.value=``,this.focusModality=new r.t(this,`.pkt-searchinput`)}willUpdate(e){super.willUpdate(e);let t=this.getAttribute(`aria-label`);t&&(this.inputAriaLabel=t,this.removeAttribute(`aria-label`))}get suggestionsId(){return`${this.id}-suggestions`}dispatchSearch(){this.dispatchEvent(new CustomEvent(`pkt-search`,{detail:{value:this.value},bubbles:!0,composed:!0}))}onInput(e){let t=e.target;this.value=t.value}onInputKeydown(e){e.key===`Enter`&&(this.action||e.preventDefault(),this.dispatchSearch())}onSearchClick(e){this.action||e.preventDefault(),this.dispatchSearch()}onSuggestionClick(e,t,n){let r=new CustomEvent(`pkt-suggestion-click`,{detail:{index:n,suggestion:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(r)||e.preventDefault()}renderSuggestion(t,n){let r=e.p`
|
|
2
|
-
${t.title?e.p`<h3 class="pkt-searchinput__suggestion-title">${t.title}</h3>`:e.d}
|
|
3
|
-
${t.text?e.p`<p class="pkt-searchinput__suggestion-text">${t.text}</p>`:e.d}
|
|
4
|
-
`;return t.href?e.p`<a
|
|
5
|
-
href=${t.href}
|
|
6
|
-
class="pkt-searchinput__suggestion"
|
|
7
|
-
@click=${e=>this.onSuggestionClick(e,t,n)}
|
|
8
|
-
>
|
|
9
|
-
${r}
|
|
10
|
-
</a>`:t.nonInteractive?e.p`<div class="pkt-searchinput__suggestion">${r}</div>`:e.p`<button
|
|
11
|
-
type="button"
|
|
12
|
-
class="pkt-searchinput__suggestion"
|
|
13
|
-
@click=${e=>this.onSuggestionClick(e,t,n)}
|
|
14
|
-
>
|
|
15
|
-
${r}
|
|
16
|
-
</button>`}render(){let r=t.t({"pkt-searchinput":!0,[`pkt-searchinput--${this.appearance}`]:!0,[`pkt-searchinput--${this.inputSize}`]:!0,"pkt-searchinput--fullwidth":this.fullwidth}),i=t.t({"pkt-searchinput__button":!0,"pkt-input-icon":this.appearance===`local`,"pkt-btn":!0,[`pkt-btn--${this.inputSize}`]:!0,"pkt-btn--icon-only":!0,"pkt-btn--tertiary":this.appearance===`local`,"pkt-btn--primary":this.appearance===`global`||this.appearance===`local-with-button`,"pkt-btn--yellow":this.appearance===`global`}),a=t.t({"pkt-input":!0,[`pkt-input--${this.inputSize}`]:!0,"pkt-input--fullwidth":this.fullwidth}),o=this.appearance===`local`?`pkt-input__container pkt-input__container--${this.inputSize}`:`pkt-searchinput__field`,s=e.p`
|
|
17
|
-
${this.label?e.p`<label for=${n.t(this.id||void 0)} class="pkt-inputwrapper__label"
|
|
18
|
-
>${this.label}</label
|
|
19
|
-
>`:e.d}
|
|
20
|
-
<div class=${o}>
|
|
21
|
-
<input
|
|
22
|
-
class=${a}
|
|
23
|
-
type="search"
|
|
24
|
-
name=${this.name||this.id}
|
|
25
|
-
id=${this.id}
|
|
26
|
-
placeholder=${this.placeholder||`Søk…`}
|
|
27
|
-
.value=${this.value}
|
|
28
|
-
?disabled=${this.disabled}
|
|
29
|
-
autocomplete="off"
|
|
30
|
-
aria-label=${n.t(this.inputAriaLabel)}
|
|
31
|
-
aria-autocomplete=${this.suggestions?`list`:e.d}
|
|
32
|
-
aria-controls=${this.suggestions?this.suggestionsId:e.d}
|
|
33
|
-
@input=${this.onInput}
|
|
34
|
-
@keydown=${this.onInputKeydown}
|
|
35
|
-
/>
|
|
36
|
-
<button
|
|
37
|
-
type="submit"
|
|
38
|
-
class=${i}
|
|
39
|
-
?disabled=${this.disabled}
|
|
40
|
-
@click=${this.onSearchClick}
|
|
41
|
-
>
|
|
42
|
-
<pkt-icon class="pkt-btn__icon" name="magnifying-glass-big"></pkt-icon>
|
|
43
|
-
<span class="pkt-btn__text">${this.label||this.placeholder||`Søk…`}</span>
|
|
44
|
-
</button>
|
|
45
|
-
</div>
|
|
46
|
-
${this.suggestions?e.p`<ul
|
|
47
|
-
id=${this.suggestionsId}
|
|
48
|
-
class="pkt-searchinput__suggestions"
|
|
49
|
-
aria-live="assertive"
|
|
50
|
-
>
|
|
51
|
-
${this.suggestions.map((t,n)=>e.p` <li>${this.renderSuggestion(t,n)}</li> `)}
|
|
52
|
-
</ul>`:e.d}
|
|
53
|
-
`;return this.action?e.p`<form
|
|
54
|
-
role="search"
|
|
55
|
-
class=${r}
|
|
56
|
-
action=${this.action}
|
|
57
|
-
method=${n.t(this.method)}
|
|
58
|
-
>
|
|
59
|
-
${s}
|
|
60
|
-
</form>`:e.p`<div role="search" class=${r}>${s}</div>`}};e.n([e.o({type:String})],i.prototype,`appearance`,void 0),e.n([e.o({type:String,attribute:`input-size`})],i.prototype,`inputSize`,void 0),e.n([e.o({type:Boolean,reflect:!0})],i.prototype,`disabled`,void 0),e.n([e.o({type:Boolean,reflect:!0})],i.prototype,`fullwidth`,void 0),e.n([e.o({type:String,reflect:!0})],i.prototype,`id`,void 0),e.n([e.o({type:String})],i.prototype,`label`,void 0),e.n([e.o({type:String})],i.prototype,`name`,void 0),e.n([e.o({type:String})],i.prototype,`placeholder`,void 0),e.n([e.o({type:String})],i.prototype,`value`,void 0),e.n([e.o({type:Array})],i.prototype,`suggestions`,void 0),e.n([e.o({type:String})],i.prototype,`action`,void 0),e.n([e.o({type:String})],i.prototype,`method`,void 0),e.n([e.a()],i.prototype,`inputAriaLabel`,void 0);try{e.s(`pkt-searchinput`)(i)}catch{console.warn(`Forsøker å definere <pkt-searchinput>, men den er allerede definert`)}var a=i;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return a}});
|
package/dist/tag-CzojNU7z.cjs
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
const e=require("./element-BA8v6S7z.cjs"),t=require("./class-map-BeimMvPv.cjs"),n=require("./element-with-slot-Bj7nm7fO.cjs");require("./icon-9iwd2F2l.cjs");const r=require("./if-defined-B89_ZeCj.cjs");var i={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`,required:!1,default:`blue`,type:[`blue`,`blue-light`,`blue-dark`,`green`,`red`,`beige`,`yellow`,`gray`],category:`ui`},closeTag:{name:`Lukk tag`,description:`Skal taggen ha en lukkeknapp?`,type:`boolean`,required:!1,default:!1,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`}}},a=class extends n.t{constructor(){super(),this.closeTag=i.props.closeTag.default,this.size=i.props.size.default,this.skin=i.props.skin.default,this.textStyle=null,this.iconName=void 0,this.type=i.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}firstUpdated(e){if(super.firstUpdated(e),this.closeTag&&!this.ariaLabel){let e=this.querySelector(`button span, .pkt-tag > span`)?.textContent?.trim();e&&(this._ariaDescription=`Klikk for å fjerne ${e}`)}}render(){let i={"pkt-tag":!0,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`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-hide":this._isClosed};return this.closeTag?e.p`
|
|
2
|
-
<button
|
|
3
|
-
class=${t.t(a)}
|
|
4
|
-
type=${this.type}
|
|
5
|
-
tabindex=${r.t(this.buttonTabindex)}
|
|
6
|
-
@click=${this.close}
|
|
7
|
-
aria-label=${r.t(this.ariaLabel||void 0)}
|
|
8
|
-
aria-description=${r.t(this._ariaDescription||void 0)}
|
|
9
|
-
>
|
|
10
|
-
${this.iconName&&e.p`<pkt-icon
|
|
11
|
-
class="pkt-tag__icon"
|
|
12
|
-
name=${this.iconName}
|
|
13
|
-
aria-hidden="true"
|
|
14
|
-
></pkt-icon>`}
|
|
15
|
-
<span>${n.n(this)}</span>
|
|
16
|
-
<pkt-icon class="pkt-tag__close-btn" name="close"></pkt-icon>
|
|
17
|
-
</button>
|
|
18
|
-
`:e.p`
|
|
19
|
-
<span class=${t.t(i)}>
|
|
20
|
-
${this.iconName&&e.p`<pkt-icon
|
|
21
|
-
class="pkt-tag__icon"
|
|
22
|
-
name=${this.iconName}
|
|
23
|
-
aria-hidden="true"
|
|
24
|
-
></pkt-icon>`}
|
|
25
|
-
<span>${n.n(this)}</span>
|
|
26
|
-
</span>
|
|
27
|
-
`}};e.n([e.o({type:Boolean,reflect:!0})],a.prototype,`closeTag`,void 0),e.n([e.o({type:String,reflect:!0})],a.prototype,`size`,void 0),e.n([e.o({type:String,reflect:!0})],a.prototype,`skin`,void 0),e.n([e.o({type:String,reflect:!0})],a.prototype,`textStyle`,void 0),e.n([e.o({type:String,reflect:!0})],a.prototype,`iconName`,void 0),e.n([e.o({type:String})],a.prototype,`type`,void 0),e.n([e.o({type:String})],a.prototype,`ariaLabel`,void 0),e.n([e.o({type:Number,attribute:`button-tabindex`})],a.prototype,`buttonTabindex`,void 0),e.n([e.a()],a.prototype,`_isClosed`,void 0),e.n([e.a()],a.prototype,`_ariaDescription`,void 0);try{e.s(`pkt-tag`)(a)}catch{console.warn(`Forsøker å definere <pkt-tag>, men den er allerede definert`)}var o=a;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return o}});
|