@oslokommune/punkt-elements 12.17.2 → 12.18.1

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.
Files changed (128) hide show
  1. package/dist/alert-BbVWu2lm.cjs +27 -0
  2. package/dist/alert-Dh6A96vo.js +159 -0
  3. package/dist/{index-D2jSRMrn.js → calendar-BUqcNvfI.js} +41 -29
  4. package/dist/calendar-QSulz7im.cjs +108 -0
  5. package/dist/card-B0GPdG5M.cjs +23 -0
  6. package/dist/card-kWt0BA2a.js +170 -0
  7. package/dist/{class-map-a5HUzP83.cjs → class-map-Boa7BqCc.cjs} +2 -2
  8. package/dist/{class-map-CBvUV2N3.js → class-map-hz16xq5a.js} +9 -10
  9. package/dist/datepicker-BHepKxof.cjs +154 -0
  10. package/dist/datepicker-iNCYioZ9.js +659 -0
  11. package/dist/helptext--4FLdAWi.js +194 -0
  12. package/dist/helptext-iZEgxz2U.cjs +23 -0
  13. package/dist/icon-CdMQ6zBT.cjs +250 -0
  14. package/dist/{index-CFDwiDTU.js → icon-wUXeHiBk.js} +7371 -7559
  15. package/dist/if-defined-DEDlGbAc.cjs +5 -0
  16. package/dist/if-defined-ZFE4ti2t.js +10 -0
  17. package/dist/index.d.ts +96 -51
  18. package/dist/input-element-D1Vls6A5.js +184 -0
  19. package/dist/input-element-DPKoFVwJ.cjs +1 -0
  20. package/dist/{input-wrapper-6vTrKtsW.js → input-wrapper-BTQk3W8T.js} +10 -10
  21. package/dist/input-wrapper-D-PNRJB_.cjs +46 -0
  22. package/dist/link-BpqavGSD.cjs +8 -0
  23. package/dist/link-Bx9nVgZi.js +108 -0
  24. package/dist/{linkcard-BlWQ8jOv.js → linkcard-CUrbzjLK.js} +16 -17
  25. package/dist/linkcard-DSu3A4Yx.cjs +13 -0
  26. package/dist/messagebox-C1aWoQbu.cjs +12 -0
  27. package/dist/messagebox-LpiVQIoM.js +107 -0
  28. package/dist/{modal-DYTVJjYh.cjs → modal-Avai5eVz.cjs} +2 -2
  29. package/dist/{modal-3OZTPqee.js → modal-Co1YFmHi.js} +8 -8
  30. package/dist/pkt-alert.cjs +1 -27
  31. package/dist/pkt-alert.js +4 -157
  32. package/dist/pkt-calendar.cjs +1 -1
  33. package/dist/pkt-calendar.js +4 -7
  34. package/dist/pkt-card.cjs +1 -23
  35. package/dist/pkt-card.js +4 -168
  36. package/dist/pkt-datepicker.cjs +1 -154
  37. package/dist/pkt-datepicker.js +4 -657
  38. package/dist/pkt-helptext.cjs +1 -1
  39. package/dist/pkt-helptext.js +1 -1
  40. package/dist/pkt-icon.cjs +1 -1
  41. package/dist/pkt-icon.js +4 -4
  42. package/dist/pkt-index.cjs +29 -1
  43. package/dist/pkt-index.js +127 -30
  44. package/dist/pkt-input-wrapper.cjs +1 -1
  45. package/dist/pkt-input-wrapper.js +1 -1
  46. package/dist/pkt-link.cjs +1 -8
  47. package/dist/pkt-link.js +4 -107
  48. package/dist/pkt-linkcard.cjs +1 -1
  49. package/dist/pkt-linkcard.js +1 -1
  50. package/dist/pkt-messagebox.cjs +1 -12
  51. package/dist/pkt-messagebox.js +4 -105
  52. package/dist/pkt-modal.cjs +1 -1
  53. package/dist/pkt-modal.js +1 -1
  54. package/dist/pkt-progressbar.cjs +1 -0
  55. package/dist/pkt-progressbar.js +6 -0
  56. package/dist/pkt-slot-controller-Ckk_yV0j.cjs +1 -0
  57. package/dist/pkt-slot-controller-RJvOnbF4.js +61 -0
  58. package/dist/pkt-tag.cjs +1 -17
  59. package/dist/pkt-tag.js +4 -148
  60. package/dist/pkt-textarea.cjs +1 -1
  61. package/dist/pkt-textarea.js +1 -1
  62. package/dist/pkt-textinput.cjs +1 -1
  63. package/dist/pkt-textinput.js +1 -1
  64. package/dist/progressbar-BS_oawSB.js +150 -0
  65. package/dist/progressbar-CuXkbAhJ.cjs +32 -0
  66. package/dist/ref-DCOsLZQg.cjs +13 -0
  67. package/dist/ref-DuFGTLVX.js +142 -0
  68. package/dist/state-BfyXV7EL.js +12 -0
  69. package/dist/state-SKYD8kRO.cjs +5 -0
  70. package/dist/stringutils-CkVRq4jP.cjs +1 -0
  71. package/dist/stringutils-DJjRa8dG.js +7 -0
  72. package/dist/tag-CGy2mSLE.cjs +17 -0
  73. package/dist/tag-DGFgUF3l.js +150 -0
  74. package/dist/{textarea-BTpJjEhO.js → textarea-BAGWR1Hi.js} +29 -29
  75. package/dist/textarea-BiUrhAlk.cjs +48 -0
  76. package/dist/{textinput-BIhQEr8z.cjs → textinput-CHOR5PPp.cjs} +2 -2
  77. package/dist/{textinput-CVo5wG14.js → textinput-pJ3N8m6g.js} +23 -23
  78. package/package.json +2 -2
  79. package/src/components/alert/alert.ts +115 -0
  80. package/src/components/alert/index.ts +4 -113
  81. package/src/components/calendar/calendar.ts +711 -0
  82. package/src/components/calendar/index.ts +3 -711
  83. package/src/components/card/card.ts +78 -0
  84. package/src/components/card/index.ts +4 -77
  85. package/src/components/datepicker/datepicker.ts +619 -0
  86. package/src/components/datepicker/index.ts +3 -618
  87. package/src/components/helptext/helptext.ts +2 -2
  88. package/src/components/icon/icon.ts +99 -0
  89. package/src/components/icon/index.ts +3 -98
  90. package/src/components/index.ts +29 -15
  91. package/src/components/input-wrapper/input-wrapper.ts +2 -2
  92. package/src/components/link/index.ts +3 -56
  93. package/src/components/link/link.ts +57 -0
  94. package/src/components/linkcard/index.ts +1 -1
  95. package/src/components/linkcard/linkcard.ts +5 -6
  96. package/src/components/messagebox/index.ts +4 -69
  97. package/src/components/messagebox/messagebox.ts +69 -0
  98. package/src/components/modal/index.ts +0 -1
  99. package/src/components/modal/modal.ts +5 -7
  100. package/src/components/progressbar/index.ts +12 -0
  101. package/src/components/progressbar/progressbar.ts +144 -0
  102. package/src/components/tag/index.ts +4 -109
  103. package/src/components/tag/tag.ts +118 -0
  104. package/src/components/textarea/textarea.ts +5 -4
  105. package/src/components/textinput/textinput.ts +3 -3
  106. package/dist/converters-DNCwIFwr.js +0 -17
  107. package/dist/converters-DhM11VlY.cjs +0 -1
  108. package/dist/custom-element-B-TlBwRu.cjs +0 -9
  109. package/dist/custom-element-CWfU4dcr.js +0 -38
  110. package/dist/element.d.ts +0 -8
  111. package/dist/helptext-DBolvFI4.js +0 -72
  112. package/dist/helptext-_fMLOOCL.cjs +0 -23
  113. package/dist/index-CR7t1zY9.cjs +0 -238
  114. package/dist/index-CmTjXoAb.cjs +0 -9
  115. package/dist/index-RwtTBIhT.js +0 -88
  116. package/dist/index-tvpcg-ad.cjs +0 -108
  117. package/dist/input-wrapper-DX41tnbj.cjs +0 -46
  118. package/dist/linkcard-Det6CJ5D.cjs +0 -13
  119. package/dist/pkt-component-template.cjs +0 -29
  120. package/dist/pkt-component-template.js +0 -99
  121. package/dist/pkt-element.cjs +0 -1
  122. package/dist/pkt-element.js +0 -5
  123. package/dist/ref-C2yPtMJA.cjs +0 -13
  124. package/dist/ref-CaiKp3S2.js +0 -202
  125. package/dist/textarea-B45ZZYpx.cjs +0 -48
  126. package/src/components/component-template/index.ts +0 -129
  127. package/src/components/element/index.ts +0 -353
  128. /package/dist/{component-template.d.ts → progressbar.d.ts} +0 -0
@@ -1,659 +1,6 @@
1
- import { T as A, r as P, a as L, x as v, E as b, n as u } from "./index-CFDwiDTU.js";
2
- import { e as j, i as F, a as q, t as H } from "./custom-element-CWfU4dcr.js";
3
- import { p as N, v as k, r as w, M as S, m as U, e as R, n as y } from "./ref-CaiKp3S2.js";
4
- import { e as x } from "./class-map-CBvUV2N3.js";
5
- import { a as V } from "./converters-DNCwIFwr.js";
6
- import { n as T, f as _, a as K, b as M } from "./index-D2jSRMrn.js";
7
- import "./input-wrapper-6vTrKtsW.js";
8
- import "./index-RwtTBIhT.js";
9
- import "./pkt-tag.js";
10
- /**
11
- * @license
12
- * Copyright 2017 Google LLC
13
- * SPDX-License-Identifier: BSD-3-Clause
14
- */
15
- const E = (e, t, i) => {
16
- const a = /* @__PURE__ */ new Map();
17
- for (let s = t; s <= i; s++) a.set(e[s], s);
18
- return a;
19
- }, W = j(class extends F {
20
- constructor(e) {
21
- if (super(e), e.type !== q.CHILD) throw Error("repeat() can only be used in text expressions");
22
- }
23
- dt(e, t, i) {
24
- let a;
25
- i === void 0 ? i = t : t !== void 0 && (a = t);
26
- const s = [], r = [];
27
- let n = 0;
28
- for (const f of e) s[n] = a ? a(f, n) : n, r[n] = i(f, n), n++;
29
- return { values: r, keys: s };
30
- }
31
- render(e, t, i) {
32
- return this.dt(e, t, i).values;
33
- }
34
- update(e, [t, i, a]) {
35
- const s = N(e), { values: r, keys: n } = this.dt(t, i, a);
36
- if (!Array.isArray(s)) return this.ut = n, r;
37
- const f = this.ut ?? (this.ut = []), m = [];
38
- let C, I, p = 0, h = s.length - 1, d = 0, c = r.length - 1;
39
- for (; p <= h && d <= c; ) if (s[p] === null) p++;
40
- else if (s[h] === null) h--;
41
- else if (f[p] === n[d]) m[d] = k(s[p], r[d]), p++, d++;
42
- else if (f[h] === n[c]) m[c] = k(s[h], r[c]), h--, c--;
43
- else if (f[p] === n[c]) m[c] = k(s[p], r[c]), w(e, m[c + 1], s[p]), p++, c--;
44
- else if (f[h] === n[d]) m[d] = k(s[h], r[d]), w(e, s[p], s[h]), h--, d++;
45
- else if (C === void 0 && (C = E(n, d, c), I = E(f, p, h)), C.has(f[p])) if (C.has(f[h])) {
46
- const g = I.get(n[d]), D = g !== void 0 ? s[g] : null;
47
- if (D === null) {
48
- const O = w(e, s[p]);
49
- k(O, r[d]), m[d] = O;
50
- } else m[d] = k(D, r[d]), w(e, s[p], D), s[g] = null;
51
- d++;
52
- } else S(s[h]), h--;
53
- else S(s[p]), p++;
54
- for (; d <= c; ) {
55
- const g = w(e, m[c + 1]);
56
- k(g, r[d]), m[d++] = g;
57
- }
58
- for (; p <= h; ) {
59
- const g = s[p++];
60
- g !== null && S(g);
61
- }
62
- return this.ut = n, U(e, m), A;
63
- }
64
- }), z = "pkt-datepicker", G = !0, J = {
65
- name: {
66
- type: "string",
67
- name: "Navn",
68
- description: "Navn som sendes brukes i skjema ved innsending"
69
- },
70
- label: {
71
- type: "string",
72
- name: "Etikett",
73
- description: "Tekst som vises over datovelgeren"
74
- },
75
- helptext: {
76
- type: "string",
77
- name: "Hjelpetekst",
78
- description: "Hjelpetekst som vises over datovelgeren"
79
- },
80
- helptextDropdown: {
81
- type: "string",
82
- name: "Utvidet hjelpetekst",
83
- description: "Hjelpetekst som vises i en lukket boks man kan åpne"
84
- },
85
- helptextDropdownButton: {
86
- type: "string",
87
- name: "Knappetekst for hjelpetekst",
88
- description: "Tekst som vises på knappen for å åpne/lukke utvidet hjelpetekst",
89
- default: "Les mer"
90
- },
91
- dateformat: {
92
- name: "Datoformat",
93
- description: "Datoformat for valgte datoer i flervalgsmodus",
94
- type: "string",
95
- default: "dd.MM.yyyy"
96
- },
97
- currentmonth: {
98
- name: "Nåværende måned",
99
- type: "ISOdatestring",
100
- description: "Måneden som skal vises i datovelgeren"
101
- },
102
- value: {
103
- name: "Verdi",
104
- type: "ISOdatestring",
105
- variant: "multiple",
106
- reflect: !0,
107
- description: "Kommaseparert liste av valgte datoer"
108
- },
109
- excludeweekdays: {
110
- name: "Utelat ukedager",
111
- type: "string",
112
- description: "Kommaseparert liste over ukedager (1-7) som skal ekskluderes"
113
- },
114
- excludedates: {
115
- name: "Utelat datoer",
116
- type: "ISOdatestring",
117
- variant: "multiple",
118
- description: "Kommaseparert liste over datoer som skal ekskluderes"
119
- },
120
- min: {
121
- name: "Tidligst tillatt",
122
- type: "ISOdatestring",
123
- default: null,
124
- description: "Første tillate dato i datovelgeren"
125
- },
126
- max: {
127
- name: "Senest tillatt",
128
- type: "ISOdatestring",
129
- default: null,
130
- description: "Siste tillate dato i datovelgeren"
131
- },
132
- weeknumbers: {
133
- name: "Vis ukenummer",
134
- type: "boolean",
135
- reflect: !0,
136
- default: !1,
137
- description: "Vis ukedager i datovelgerens kalender"
138
- },
139
- withcontrols: {
140
- name: "Med kontroller",
141
- type: "boolean",
142
- reflect: !0,
143
- default: !1,
144
- description: "Vis avanserte velgere for måned og år"
145
- },
146
- multiple: {
147
- name: "Flervalg",
148
- type: "boolean",
149
- reflect: !0,
150
- default: !1,
151
- description: "Tillat valg av flere enn én dato i samme velger"
152
- },
153
- maxlength: {
154
- name: "Maks antall",
155
- description: "Maks valgte datoer i flervalgsmodus",
156
- type: "number"
157
- },
158
- range: {
159
- name: "Datotidsrom",
160
- type: "boolean",
161
- reflect: !0,
162
- default: !1,
163
- description: "Tillat å velge et tidsrom mellom to datoer i samme velger"
164
- },
165
- hasError: {
166
- type: "boolean",
167
- name: "Feil",
168
- default: !1,
169
- description: "Viser feiltilstand for datovelgeren"
170
- },
171
- errorMessage: {
172
- type: "string",
173
- name: "Feilmelding",
174
- description: "Tekst som vises under datovelgeren ved feiltilstand"
175
- },
176
- disabled: {
177
- type: "boolean",
178
- name: "Deaktivert",
179
- default: !1,
180
- reflect: !0,
181
- description: "Er datovelgeren deaktivert?"
182
- },
183
- fullwidth: {
184
- type: "boolean",
185
- name: "Full bredde",
186
- default: !1,
187
- reflect: !0,
188
- description: "Skal datovelgeren ta opp hele bredden?"
189
- },
190
- required: {
191
- type: "boolean",
192
- name: "Påkrevd",
193
- default: !1,
194
- reflect: !0,
195
- description: "Er datovelgeren påkrevd?"
196
- },
197
- requiredTag: {
198
- type: "boolean",
199
- name: "Vise påkrevd-merking",
200
- default: !1,
201
- description: "Viser en merking som indikerer at datovelgeren er påkrevd"
202
- },
203
- requiredText: {
204
- type: "string",
205
- name: "Påkrevd-tekst",
206
- default: "Må fylles ut",
207
- description: "Tekst som vises i påkrevd-merkingen"
208
- },
209
- optionalTag: {
210
- type: "boolean",
211
- name: "Vise valgfritt-merking",
212
- default: !1,
213
- description: "Viser en merking som indikerer at datovelgeren er valgfri"
214
- },
215
- optionalText: {
216
- type: "string",
217
- name: "Valgfritt-tekst",
218
- default: "Valgfritt",
219
- description: "Tekst som vises i valgfritt-merkingen"
220
- },
221
- useWrapper: {
222
- type: "boolean",
223
- name: "Bruk wrapper",
224
- description: "Indikerer at feltet skal ha synlig label og hjelpetekst",
225
- displayAsFalse: !0,
226
- default: !0
227
- },
228
- id: {
229
- type: "string",
230
- name: "ID",
231
- description: "Unik identifikasjon for datovelgeren"
232
- }
233
- }, Q = {
234
- change: {
235
- type: "Event",
236
- description: "Returnerer valgt dato som streng i ISO-format"
237
- },
238
- "value-change": {
239
- type: "CustomEvent",
240
- description: "Returnerer en <code>array</code> med valgte datoer i ISO-format"
241
- },
242
- toggleHelpText: {
243
- type: "CustomEvent",
244
- description: "Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes"
245
- }
246
- }, $ = {
247
- name: z,
248
- "css-class": "pkt-datepicker",
249
- isElement: G,
250
- props: J,
251
- events: Q
252
- };
253
- var X = Object.defineProperty, Y = Object.getOwnPropertyDescriptor, o = (e, t, i, a) => {
254
- for (var s = a > 1 ? void 0 : a ? Y(t, i) : t, r = e.length - 1, n; r >= 0; r--)
255
- (n = e[r]) && (s = (a ? n(t, i, s) : n(s)) || s);
256
- return a && s && X(t, i, s), s;
257
- };
258
- const B = (e) => new Promise((t) => setTimeout(t, e));
259
- let l = class extends L {
260
- constructor() {
261
- super(...arguments), this.value = "", this._value = this.value ? Array.isArray(this.value) ? this.value : this.value.split(",") : [], this.label = "Datovelger", this.dateformat = $.props.dateformat.default, this.multiple = $.props.multiple.default, this.maxlength = null, this.range = $.props.range.default, this.showRangeLabels = !1, this.min = null, this.max = null, this.weeknumbers = $.props.weeknumbers.default, this.withcontrols = $.props.withcontrols.default, this.excludedates = [], this.excludeweekdays = [], this.currentmonth = null, this.calendarOpen = !1, this.timezone = "Europe/Oslo", this.inputClasses = {}, this.buttonClasses = {}, this.inputRef = R(), this.inputRefTo = R(), this.btnRef = R(), this.calRef = R(), this.popupRef = R(), this.addToSelected = (e) => {
262
- const t = e.target;
263
- if (!t.value) return;
264
- const i = this.min ? T(this.min) : null, a = this.max ? T(this.max) : null, s = T(t.value.split(",")[0]);
265
- s && !isNaN(s.getTime()) && (!i || s >= i) && (!a || s <= a) && this.calRef.value && this.calRef.value.handleDateSelect(s), t.value = "";
266
- };
267
- }
268
- /**
269
- * Housekeeping / lifecycle methods
270
- */
271
- async connectedCallback() {
272
- super.connectedCallback(), this.isMobileSafari = /iP(ad|od|hone)/i.test(window.navigator.userAgent) && !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/), this.inputType = this.isMobileSafari ? "text" : "date", document && document.body.addEventListener("click", (e) => {
273
- var t, i;
274
- (t = this.inputRef) != null && t.value && ((i = this.btnRef) != null && i.value) && !this.inputRef.value.contains(e.target) && !(this.inputRefTo.value && this.inputRefTo.value.contains(e.target)) && !this.btnRef.value.contains(e.target) && !e.target.closest(".pkt-calendar-popup") && this.calendarOpen && (this.onBlur(), this.hideCalendar());
275
- }), this.value.length && this._value.length === 0 && (this._value = Array.isArray(this.value) ? this.value : this.value.split(",")), this.min = this.min || $.props.min.default, this.max = this.max || $.props.max.default, typeof this.excludedates == "string" && (this.excludedates = this.excludedates.split(",")), typeof this.excludeweekdays == "string" && (this.excludeweekdays = this.excludeweekdays.split(",")), (this.multiple || this.range) && this.name && !this.name.endsWith("[]") && (this.name = this.name + "[]"), this.calendarOpen && (await B(20), this.handleCalendarPosition());
276
- }
277
- disconnectedCallback() {
278
- super.disconnectedCallback(), document && document.body.removeEventListener("click", (e) => {
279
- var t, i;
280
- (t = this.inputRef) != null && t.value && ((i = this.btnRef) != null && i.value) && !this.inputRef.value.contains(e.target) && !this.btnRef.value.contains(e.target) && this.hideCalendar();
281
- });
282
- }
283
- attributeChangedCallback(e, t, i) {
284
- if (e === "value") {
285
- if (this.range && (i == null ? void 0 : i.split(",").length) === 1) return;
286
- this.value !== t && this.valueChanged(i, t);
287
- }
288
- e === "excludedates" && typeof this.excludedates == "string" && (this.excludedates = (i == null ? void 0 : i.split(",")) ?? []), e === "excludeweekdays" && typeof this.excludeweekdays == "string" && (this.excludeweekdays = (i == null ? void 0 : i.split(",")) ?? []), super.attributeChangedCallback(e, t, i);
289
- }
290
- updated(e) {
291
- if (e.has("value")) {
292
- if (this.range && this.value.length === 1) return;
293
- this.valueChanged(this.value, e.get("value"));
294
- }
295
- super.updated(e);
296
- }
297
- /**
298
- * Rendering
299
- */
300
- renderInput() {
301
- return v`
302
- <input
303
- class="${x(this.inputClasses)}"
304
- .type=${this.inputType}
305
- id="${this.id}-input"
306
- .value=${this._value[0] ?? ""}
307
- min=${this.min}
308
- max=${this.max}
309
- @click=${(e) => {
310
- e.preventDefault(), this.showCalendar();
311
- }}
312
- ?disabled=${this.disabled}
313
- @keydown=${(e) => {
314
- var t;
315
- (e.key === "," || e.key === "Enter") && ((t = this.inputRef.value) == null || t.blur()), (e.key === "Space" || e.key === " ") && (e.preventDefault(), this.toggleCalendar(e));
316
- }}
317
- @input=${(e) => {
318
- this.onInput(), e.stopImmediatePropagation();
319
- }}
320
- @focus=${() => {
321
- this.onFocus(), this.isMobileSafari && this.showCalendar();
322
- }}
323
- @blur=${(e) => {
324
- var t;
325
- (t = this.calRef.value) != null && t.contains(e.relatedTarget) || this.onBlur(), this.manageValidity(e.target), this.value = e.target.value;
326
- }}
327
- @change=${(e) => {
328
- e.stopImmediatePropagation();
329
- }}
330
- ${y(this.inputRef)}
331
- />
332
- `;
333
- }
334
- renderRangeInput() {
335
- const e = {
336
- "pkt-input-prefix": this.showRangeLabels,
337
- "pkt-hide": !this.showRangeLabels
338
- };
339
- return v`
340
- ${this.showRangeLabels ? v` <div class="pkt-input-prefix">${this.strings.generic.from}</div> ` : b}
341
- <input
342
- class=${x(this.inputClasses)}
343
- .type=${this.inputType}
344
- id="${this.id}-input"
345
- .value=${this._value[0] ?? ""}
346
- min=${this.min}
347
- max=${this.max}
348
- ?disabled=${this.disabled}
349
- @click=${(t) => {
350
- t.preventDefault(), this.showCalendar();
351
- }}
352
- @keydown=${(t) => {
353
- var i;
354
- (t.key === "," || t.key === "Enter") && ((i = this.inputRef.value) == null || i.blur()), (t.key === "Space" || t.key === " ") && (t.preventDefault(), this.toggleCalendar(t));
355
- }}
356
- @input=${(t) => {
357
- this.onInput(), t.stopImmediatePropagation();
358
- }}
359
- @focus=${() => {
360
- this.onFocus(), this.isMobileSafari && this.showCalendar();
361
- }}
362
- @blur=${(t) => {
363
- var i, a;
364
- if (t.target.value) {
365
- this.manageValidity(t.target);
366
- const s = _(t.target.value);
367
- s && this._value[0] !== t.target.value && this._value[1] && (this.clearInputValue(), (a = (i = this.calRef) == null ? void 0 : i.value) == null || a.handleDateSelect(s));
368
- } else this._value[0] && this.clearInputValue();
369
- }}
370
- @change=${(t) => {
371
- t.stopImmediatePropagation();
372
- }}
373
- ${y(this.inputRef)}
374
- />
375
- <div class="${x(e)}" id="${this.id}-to-label">
376
- ${this.strings.generic.to}
377
- </div>
378
- ${this.showRangeLabels ? b : v` <div class="pkt-input-separator">–</div> `}
379
- <input
380
- class=${x(this.inputClasses)}
381
- .type=${this.inputType}
382
- id="${this.id}-to"
383
- aria-labelledby="${this.id}-to-label"
384
- .value=${this._value[1] ?? ""}
385
- min=${this.min}
386
- max=${this.max}
387
- ?disabled=${this.disabled}
388
- @click=${(t) => {
389
- t.preventDefault(), this.showCalendar();
390
- }}
391
- @keydown=${(t) => {
392
- var i;
393
- (t.key === "," || t.key === "Enter") && ((i = this.inputRefTo.value) == null || i.blur()), (t.key === "Space" || t.key === " ") && (t.preventDefault(), this.toggleCalendar(t));
394
- }}
395
- @input=${(t) => {
396
- this.onInput(), t.stopImmediatePropagation();
397
- }}
398
- @focus=${() => {
399
- this.onFocus(), this.isMobileSafari && this.showCalendar();
400
- }}
401
- @blur=${(t) => {
402
- var i, a, s;
403
- if ((i = this.calRef.value) != null && i.contains(t.relatedTarget) || this.onBlur(), t.target.value) {
404
- this.manageValidity(t.target);
405
- const r = t.target.value;
406
- this.min && this.min > r ? this.internals.setValidity(
407
- { rangeUnderflow: !0 },
408
- this.strings.forms.messages.rangeUnderflow,
409
- t.target
410
- ) : this.max && this.max < r && this.internals.setValidity(
411
- { rangeOverflow: !0 },
412
- this.strings.forms.messages.rangeOverflow,
413
- t.target
414
- );
415
- const n = _(t.target.value);
416
- n && this._value[1] !== K(n) && ((s = (a = this.calRef) == null ? void 0 : a.value) == null || s.handleDateSelect(n));
417
- }
418
- }}
419
- @change=${(t) => {
420
- t.stopImmediatePropagation();
421
- }}
422
- ${y(this.inputRefTo)}
423
- />
424
- `;
425
- }
426
- renderMultipleInput() {
427
- return v`
428
- <input
429
- class=${x(this.inputClasses)}
430
- .type=${this.inputType}
431
- id="${this.id}-input"
432
- min=${this.min || b}
433
- max=${this.max || b}
434
- ?disabled=${this.disabled || this.maxlength && this._value.length >= this.maxlength}
435
- @click=${(e) => {
436
- e.preventDefault(), this.showCalendar();
437
- }}
438
- @blur=${(e) => {
439
- var t;
440
- (t = this.calRef.value) != null && t.contains(e.relatedTarget) || this.onBlur(), this.addToSelected(e);
441
- }}
442
- @input=${(e) => {
443
- this.onInput(), e.stopImmediatePropagation();
444
- }}
445
- @focus=${() => {
446
- this.onFocus(), this.isMobileSafari && this.showCalendar();
447
- }}
448
- @keydown=${(e) => {
449
- (e.key === "," || e.key === "Enter") && (e.preventDefault(), this.addToSelected(e)), (e.key === "Space" || e.key === " ") && (e.preventDefault(), this.toggleCalendar(e));
450
- }}
451
- @change=${(e) => {
452
- e.stopImmediatePropagation();
453
- }}
454
- ${y(this.inputRef)}
455
- />
456
- `;
457
- }
458
- renderTags() {
459
- return v`
460
- <div class="pkt-datepicker__tags" aria-live="polite">
461
- ${this._value[0] ? W(
462
- this._value ?? [],
463
- (e) => e,
464
- (e) => v`
465
- <pkt-tag
466
- .id="${this.id + e + "-tag"}"
467
- closeTag
468
- ariaLabel="${this.strings.calendar.deleteDate} ${M(
469
- e,
470
- this.dateformat
471
- )}"
472
- @close=${() => {
473
- var t;
474
- return (t = this.calRef.value) == null ? void 0 : t.handleDateSelect(_(e));
475
- }}
476
- ><time datetime="${e}">${M(e, this.dateformat)}</time></pkt-tag
477
- >
478
- `
479
- ) : b}
480
- </div>
481
- `;
482
- }
483
- renderCalendar() {
484
- return v`<div
485
- class="pkt-calendar-popup pkt-${this.calendarOpen ? "show" : "hide"}"
486
- @focusout=${(e) => {
487
- this.calendarOpen && this.handleFocusOut(e);
488
- }}
489
- id="${this.id}-popup"
490
- ${y(this.popupRef)}
491
- >
492
- <pkt-calendar
493
- id="${this.id}-calendar"
494
- ?multiple=${this.multiple}
495
- ?range=${this.range}
496
- ?weeknumbers=${this.weeknumbers}
497
- ?withcontrols=${this.withcontrols}
498
- .maxMultiple=${this.maxlength}
499
- .selected=${this._value}
500
- .earliest=${this.min}
501
- .latest=${this.max}
502
- .excludedates=${Array.isArray(this.excludedates) ? this.excludedates : this.excludedates.split(",")}
503
- .excludeweekdays=${this.excludeweekdays}
504
- .currentmonth=${this.currentmonth ? T(this.currentmonth) : null}
505
- @date-selected=${(e) => {
506
- this.value = !this.multiple && !this.range ? e.detail[0] : e.detail, this._value = e.detail, this.inputRef.value && (this.range && this.inputRefTo.value ? (this.inputRef.value.value = this._value[0] ?? "", this.inputRefTo.value.value = this._value[1] ?? "") : this.multiple || (this.inputRef.value.value = this._value.length ? this._value[0] : ""));
507
- }}
508
- @close=${() => {
509
- this.onBlur(), this.hideCalendar();
510
- }}
511
- ${y(this.calRef)}
512
- ></pkt-calendar>
513
- </div>`;
514
- }
515
- render() {
516
- return this.inputClasses = {
517
- "pkt-input": !0,
518
- "pkt-datepicker__input": !0,
519
- "pkt-input--fullwidth": this.fullwidth,
520
- "pkt-datepicker--hasrangelabels": this.showRangeLabels,
521
- "pkt-datepicker--multiple": this.multiple,
522
- "pkt-datepicker--range": this.range
523
- }, this.buttonClasses = {
524
- "pkt-input-icon": !0,
525
- "pkt-btn": !0,
526
- "pkt-btn--icon-only": !0,
527
- "pkt-btn--tertiary": !0
528
- }, v`
529
- <pkt-input-wrapper
530
- label="${this.label}"
531
- forId="${this.id}-input"
532
- ?counter=${this.multiple && !!this.maxlength}
533
- .counterCurrent=${this.value ? this._value.length : 0}
534
- .counterMaxLength=${this.maxlength}
535
- ?disabled=${this.disabled}
536
- ?hasError=${this.hasError}
537
- ?required=${this.required}
538
- ?optionalTag=${this.optionalTag}
539
- ?requiredTag=${this.requiredTag}
540
- ?useWrapper=${this.useWrapper}
541
- .optionalText=${this.optionalText}
542
- .requiredText=${this.requiredText}
543
- .errorMessage=${this.errorMessage}
544
- .helptext=${this.helptext}
545
- .helptextDropdown=${this.helptextDropdown}
546
- .helptextDropdownButton=${this.helptextDropdownButton}
547
- .ariaDescribedBy=${this.ariaDescribedBy}
548
- class="pkt-datepicker"
549
- >
550
- ${this.multiple ? this.renderTags() : b}
551
- <div
552
- class="pkt-datepicker__inputs ${this.range && this.showRangeLabels ? "pkt-input__range-inputs" : ""}"
553
- >
554
- <div class="pkt-input__container">
555
- ${this.range ? this.renderRangeInput() : this.multiple ? this.renderMultipleInput() : this.renderInput()}
556
- <button
557
- class="${x(this.buttonClasses)}"
558
- type="button"
559
- @click=${this.toggleCalendar}
560
- ?disabled=${this.disabled}
561
- ${y(this.btnRef)}
562
- >
563
- <pkt-icon name="calendar"></pkt-icon>
564
- <span class="pkt-btn__text">${this.strings.calendar.buttonAltText}</span>
565
- </button>
566
- </div>
567
- </div>
568
- </pkt-input-wrapper>
569
- ${this.renderCalendar()}
570
- `;
571
- }
572
- /**
573
- * Handlers
574
- */
575
- handleCalendarPosition() {
576
- var e;
577
- if (this.popupRef.value && this.inputRef.value) {
578
- const t = this.multiple && !!this.maxlength, i = ((e = this.inputRef.value.parentElement) == null ? void 0 : e.getBoundingClientRect()) || this.inputRef.value.getBoundingClientRect(), a = t ? i.height + 30 : i.height, s = this.popupRef.value.getBoundingClientRect().height;
579
- let r = t ? "calc(100% - 30px)" : "100%";
580
- i && i.top + s > window.innerHeight && i.top - s > 0 && (r = `calc(100% - ${a}px - ${s}px)`), this.popupRef.value.style.top = r;
581
- }
582
- }
583
- handleFocusOut(e) {
584
- this.contains(e.target) || (this.onBlur(), this.hideCalendar());
585
- }
586
- async showCalendar() {
587
- var e;
588
- this.calendarOpen = !0, await B(20), this.handleCalendarPosition(), this.isMobileSafari && ((e = this.calRef.value) == null || e.focusOnCurrentDate());
589
- }
590
- hideCalendar() {
591
- this.calendarOpen = !1;
592
- }
593
- async toggleCalendar(e) {
594
- e.preventDefault(), this.calendarOpen ? this.hideCalendar() : this.showCalendar();
595
- }
596
- };
597
- o([
598
- u({ type: String, reflect: !0 })
599
- ], l.prototype, "value", 2);
600
- o([
601
- u({ type: Array })
602
- ], l.prototype, "_value", 2);
603
- o([
604
- u({ type: String, reflect: !0 })
605
- ], l.prototype, "label", 2);
606
- o([
607
- u({ type: String })
608
- ], l.prototype, "dateformat", 2);
609
- o([
610
- u({ type: Boolean, reflect: !0 })
611
- ], l.prototype, "multiple", 2);
612
- o([
613
- u({ type: Number, reflect: !0 })
614
- ], l.prototype, "maxlength", 2);
615
- o([
616
- u({ type: Boolean, reflect: !0 })
617
- ], l.prototype, "range", 2);
618
- o([
619
- u({ type: Boolean })
620
- ], l.prototype, "showRangeLabels", 2);
621
- o([
622
- u({ type: String, reflect: !0 })
623
- ], l.prototype, "min", 2);
624
- o([
625
- u({ type: String, reflect: !0 })
626
- ], l.prototype, "max", 2);
627
- o([
628
- u({ type: Boolean })
629
- ], l.prototype, "weeknumbers", 2);
630
- o([
631
- u({ type: Boolean, reflect: !0 })
632
- ], l.prototype, "withcontrols", 2);
633
- o([
634
- u({ converter: V.csvToArray })
635
- ], l.prototype, "excludedates", 2);
636
- o([
637
- u({ converter: V.csvToArray })
638
- ], l.prototype, "excludeweekdays", 2);
639
- o([
640
- u({ type: String })
641
- ], l.prototype, "currentmonth", 2);
642
- o([
643
- u({ type: Boolean, reflect: !0 })
644
- ], l.prototype, "calendarOpen", 2);
645
- o([
646
- u({ type: String })
647
- ], l.prototype, "timezone", 2);
648
- o([
649
- P()
650
- ], l.prototype, "inputClasses", 2);
651
- o([
652
- P()
653
- ], l.prototype, "buttonClasses", 2);
654
- l = o([
655
- H("pkt-datepicker")
656
- ], l);
1
+ import { P as t } from "./datepicker-iNCYioZ9.js";
2
+ const a = t;
657
3
  export {
658
- l as PktDatepicker
4
+ t as PktDatepicker,
5
+ a as default
659
6
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./helptext-_fMLOOCL.cjs"),t=e.PktHelptext;Object.defineProperty(exports,"PktHelptext",{enumerable:!0,get:()=>e.PktHelptext});exports.default=t;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./helptext-iZEgxz2U.cjs"),t=e.PktHelptext;Object.defineProperty(exports,"PktHelptext",{enumerable:!0,get:()=>e.PktHelptext});exports.default=t;
@@ -1,4 +1,4 @@
1
- import { P as t } from "./helptext-DBolvFI4.js";
1
+ import { P as t } from "./helptext--4FLdAWi.js";
2
2
  const p = t;
3
3
  export {
4
4
  t as PktHelptext,
package/dist/pkt-icon.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("./index-CR7t1zY9.cjs");require("./custom-element-B-TlBwRu.cjs");const e=require("./index-CmTjXoAb.cjs");Object.defineProperty(exports,"PktIcon",{enumerable:!0,get:()=>e.PktIcon});
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./icon-CdMQ6zBT.cjs"),t=e.PktIcon;Object.defineProperty(exports,"PktIcon",{enumerable:!0,get:()=>e.PktIcon});exports.default=t;
package/dist/pkt-icon.js CHANGED
@@ -1,6 +1,6 @@
1
- import "./index-CFDwiDTU.js";
2
- import "./custom-element-CWfU4dcr.js";
3
- import { P as p } from "./index-RwtTBIhT.js";
1
+ import { a as o } from "./icon-wUXeHiBk.js";
2
+ const a = o;
4
3
  export {
5
- p as PktIcon
4
+ o as PktIcon,
5
+ a as default
6
6
  };