@justeattakeaway/pie-text-input 0.29.25 → 0.29.27

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 (2) hide show
  1. package/dist/index.js +481 -477
  2. package/package.json +6 -6
package/dist/index.js CHANGED
@@ -1,18 +1,18 @@
1
- import { LitElement as Vt, nothing as Nt, html as mt, unsafeCSS as Lt } from "lit";
2
- import { property as u, query as ht } from "lit/decorators.js";
1
+ import { LitElement as Lt, nothing as Ot, html as mt, unsafeCSS as $t } from "lit";
2
+ import { property as u, query as vt } from "lit/decorators.js";
3
3
  import { ifDefined as h } from "lit/directives/if-defined.js";
4
- import { classMap as $t } from "lit/directives/class-map.js";
4
+ import { classMap as Pt } from "lit/directives/class-map.js";
5
5
  import { live as ft } from "lit/directives/live.js";
6
- import { FormControlMixin as Ot, RtlMixin as Pt, DelegatesFocusMixin as Rt, wrapNativeEvent as Dt, validPropertyValues as Y, safeCustomElement as _t } from "@justeattakeaway/pie-webc-core";
6
+ import { FormControlMixin as Rt, RtlMixin as Dt, DelegatesFocusMixin as _t, wrapNativeEvent as Ht, validPropertyValues as Y, safeCustomElement as zt } from "@justeattakeaway/pie-webc-core";
7
7
  import "@justeattakeaway/pie-assistive-text";
8
- const z = class z extends Vt {
8
+ const z = class z extends Lt {
9
9
  willUpdate() {
10
10
  this.getAttribute("v") || this.setAttribute("v", z.v);
11
11
  }
12
12
  };
13
- z.v = "0.29.25";
13
+ z.v = "0.29.27";
14
14
  let X = z;
15
- const Ht = "*,*:after,*:before{box-sizing:inherit}:host{display:block}.c-textInput{--input-padding-block: var(--dt-spacing-c);--input-padding-inline: var(--dt-spacing-d);--input-gap: var(--dt-spacing-d);--input-text-color: var(--dt-color-content-default);--input-text-color-leading-trailing-content: var(--dt-color-content-default);--input-text-color-placeholder: var(--dt-color-content-placeholder);--input-border-color: var(--dt-color-border-form);--input-container-color: var(--dt-color-container-default);--input-radius: var(--dt-radius-rounded-c);--input-font-family: var(--dt-font-body-l-family);--input-font-size: calc(var(--dt-font-body-l-size) * 1px);--input-line-height: calc(var(--dt-font-body-l-line-height) * 1px);--input-height: 48px;--input-cursor: text;--icon-size-override: 24px;height:var(--input-height);border:1px solid var(--input-border-color);border-radius:var(--input-radius);padding-inline-start:var(--input-padding-inline);padding-inline-end:var(--input-padding-inline);padding-block-start:var(--input-padding-block);padding-block-end:var(--input-padding-block);font-family:var(--input-font-family);font-size:var(--input-font-size);line-height:var(--input-line-height);display:flex;flex-wrap:nowrap;align-items:center;background-color:var(--input-container-color);color:var(--input-text-color-leading-trailing-content);cursor:var(--input-cursor)}.c-textInput.c-textInput--large{--input-padding-block: var(--dt-spacing-d);--input-height: 56px}.c-textInput.c-textInput--small{--input-padding-block: var(--dt-spacing-b);--input-height: 40px}.c-textInput.c-textInput--error{--input-border-color: var(--dt-color-support-error)}.c-textInput ::slotted([slot=leadingText]),.c-textInput ::slotted([slot=leadingIcon]){margin-inline-end:var(--input-gap)}.c-textInput ::slotted([slot=trailingText]),.c-textInput ::slotted([slot=trailingIcon]){margin-inline-start:var(--input-gap)}@supports (gap: var(--input-gap)){.c-textInput{gap:var(--input-gap)}.c-textInput ::slotted([slot=leadingText]),.c-textInput ::slotted([slot=leadingIcon]){margin-inline-end:0}.c-textInput ::slotted([slot=trailingText]),.c-textInput ::slotted([slot=trailingIcon]){margin-inline-start:0}}.c-textInput:not(.is-disabled) ::slotted([slot=leadingIcon]),.c-textInput:not(.is-disabled) ::slotted([slot=trailingIcon]){color:var(--dt-color-content-subdued)}@media (hover: hover){.c-textInput:hover{--input-container-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + calc(-1 * var(--dt-color-hover-01))))}@supports (background-color: color-mix(in srgb,black,white)){.c-textInput:hover{--input-container-color: color-mix(in srgb, var(--dt-color-hover-01-bg) var(--dt-color-hover-01), var(--dt-color-container-default))}}}.c-textInput.is-readonly{--input-container-color: var(--dt-color-container-subtle);--input-border-color: var(--dt-color-border-form)}.c-textInput.is-disabled.is-readonly,.c-textInput.is-disabled{--input-container-color: var(--dt-color-disabled-01);--input-border-color: var(--dt-color-disabled-01);--input-text-color: var(--dt-color-content-disabled);--input-text-color-placeholder: var(--dt-color-content-disabled);--input-text-color-leading-trailing-content: var(--dt-color-content-disabled);--input-cursor: auto}.c-textInput:focus-within{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}input{border:0;outline:0;height:24px;padding:0;color:var(--input-text-color);width:100%;font-size:var(--input-font-size);font-family:inherit;background:none;cursor:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none}input::placeholder{color:var(--input-text-color-placeholder);opacity:1}input:disabled{-webkit-text-fill-color:var(--input-text-color);color:var(--input-text-color);-webkit-opacity:1;opacity:1}input[type=number]:not([step])::-webkit-inner-spin-button,input[type=number]:not([step])::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]:not([step]){-moz-appearance:textfield}", zt = ["text", "number", "password", "url", "email", "tel"], te = ["none", "text", "tel", "url", "email", "numeric", "decimal", "search"], Wt = ["default", "success", "error"], qt = ["small", "medium", "large"], w = {
15
+ const Wt = "*,*:after,*:before{box-sizing:inherit}:host{display:block}.c-textInput{--input-padding-block: var(--dt-spacing-c);--input-padding-inline: var(--dt-spacing-d);--input-gap: var(--dt-spacing-d);--input-text-color: var(--dt-color-content-default);--input-text-color-leading-trailing-content: var(--dt-color-content-default);--input-text-color-placeholder: var(--dt-color-content-placeholder);--input-border-color: var(--dt-color-border-form);--input-container-color: var(--dt-color-container-default);--input-radius: var(--dt-radius-rounded-c);--input-font-family: var(--dt-font-body-l-family);--input-font-size: calc(var(--dt-font-body-l-size) * 1px);--input-line-height: calc(var(--dt-font-body-l-line-height) * 1px);--input-height: 48px;--input-cursor: text;--icon-size-override: 24px;height:var(--input-height);border:1px solid var(--input-border-color);border-radius:var(--input-radius);padding-inline-start:var(--input-padding-inline);padding-inline-end:var(--input-padding-inline);padding-block-start:var(--input-padding-block);padding-block-end:var(--input-padding-block);font-family:var(--input-font-family);font-size:var(--input-font-size);line-height:var(--input-line-height);display:flex;flex-wrap:nowrap;align-items:center;background-color:var(--input-container-color);color:var(--input-text-color-leading-trailing-content);cursor:var(--input-cursor)}.c-textInput.c-textInput--large{--input-padding-block: var(--dt-spacing-d);--input-height: 56px}.c-textInput.c-textInput--small{--input-padding-block: var(--dt-spacing-b);--input-height: 40px}.c-textInput.c-textInput--error{--input-border-color: var(--dt-color-support-error)}.c-textInput ::slotted([slot=leadingText]),.c-textInput ::slotted([slot=leadingIcon]){margin-inline-end:var(--input-gap)}.c-textInput ::slotted([slot=trailingText]),.c-textInput ::slotted([slot=trailingIcon]){margin-inline-start:var(--input-gap)}@supports (gap: var(--input-gap)){.c-textInput{gap:var(--input-gap)}.c-textInput ::slotted([slot=leadingText]),.c-textInput ::slotted([slot=leadingIcon]){margin-inline-end:0}.c-textInput ::slotted([slot=trailingText]),.c-textInput ::slotted([slot=trailingIcon]){margin-inline-start:0}}.c-textInput:not(.is-disabled) ::slotted([slot=leadingIcon]),.c-textInput:not(.is-disabled) ::slotted([slot=trailingIcon]){color:var(--dt-color-content-subdued)}@media (hover: hover){.c-textInput:hover{--input-container-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + calc(-1 * var(--dt-color-hover-01))))}@supports (background-color: color-mix(in srgb,black,white)){.c-textInput:hover{--input-container-color: color-mix(in srgb, var(--dt-color-hover-01-bg) var(--dt-color-hover-01), var(--dt-color-container-default))}}}.c-textInput.is-readonly{--input-container-color: var(--dt-color-container-subtle);--input-border-color: var(--dt-color-border-form)}.c-textInput.is-disabled.is-readonly,.c-textInput.is-disabled{--input-container-color: var(--dt-color-disabled-01);--input-border-color: var(--dt-color-disabled-01);--input-text-color: var(--dt-color-content-disabled);--input-text-color-placeholder: var(--dt-color-content-disabled);--input-text-color-leading-trailing-content: var(--dt-color-content-disabled);--input-cursor: auto}.c-textInput:focus-within{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}input{border:0;outline:0;height:24px;padding:0;color:var(--input-text-color);width:100%;font-size:var(--input-font-size);font-family:inherit;background:none;cursor:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none}input::placeholder{color:var(--input-text-color-placeholder);opacity:1}input:disabled{-webkit-text-fill-color:var(--input-text-color);color:var(--input-text-color);-webkit-opacity:1;opacity:1}input[type=number]:not([step])::-webkit-inner-spin-button,input[type=number]:not([step])::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]:not([step]){-moz-appearance:textfield}", qt = ["text", "number", "password", "url", "email", "tel"], ie = ["none", "text", "tel", "url", "email", "numeric", "decimal", "search"], Bt = ["default", "success", "error"], Ut = ["small", "medium", "large"], w = {
16
16
  type: "text",
17
17
  value: "",
18
18
  size: "medium",
@@ -20,487 +20,491 @@ const Ht = "*,*:after,*:before{box-sizing:inherit}:host{display:block}.c-textInp
20
20
  disabled: !1,
21
21
  readonly: !1
22
22
  };
23
- (function() {
24
- (function(p) {
25
- const d = /* @__PURE__ */ new WeakMap(), v = /* @__PURE__ */ new WeakMap(), g = /* @__PURE__ */ new WeakMap(), l = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new WeakMap(), M = /* @__PURE__ */ new WeakMap(), F = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new WeakMap(), N = /* @__PURE__ */ new WeakMap(), S = /* @__PURE__ */ new WeakMap(), L = /* @__PURE__ */ new WeakMap(), $ = /* @__PURE__ */ new WeakMap(), A = /* @__PURE__ */ new WeakMap(), k = /* @__PURE__ */ new WeakMap(), T = /* @__PURE__ */ new WeakMap(), C = {
26
- ariaAtomic: "aria-atomic",
27
- ariaAutoComplete: "aria-autocomplete",
28
- ariaBusy: "aria-busy",
29
- ariaChecked: "aria-checked",
30
- ariaColCount: "aria-colcount",
31
- ariaColIndex: "aria-colindex",
32
- ariaColIndexText: "aria-colindextext",
33
- ariaColSpan: "aria-colspan",
34
- ariaCurrent: "aria-current",
35
- ariaDescription: "aria-description",
36
- ariaDisabled: "aria-disabled",
37
- ariaExpanded: "aria-expanded",
38
- ariaHasPopup: "aria-haspopup",
39
- ariaHidden: "aria-hidden",
40
- ariaInvalid: "aria-invalid",
41
- ariaKeyShortcuts: "aria-keyshortcuts",
42
- ariaLabel: "aria-label",
43
- ariaLevel: "aria-level",
44
- ariaLive: "aria-live",
45
- ariaModal: "aria-modal",
46
- ariaMultiLine: "aria-multiline",
47
- ariaMultiSelectable: "aria-multiselectable",
48
- ariaOrientation: "aria-orientation",
49
- ariaPlaceholder: "aria-placeholder",
50
- ariaPosInSet: "aria-posinset",
51
- ariaPressed: "aria-pressed",
52
- ariaReadOnly: "aria-readonly",
53
- ariaRelevant: "aria-relevant",
54
- ariaRequired: "aria-required",
55
- ariaRoleDescription: "aria-roledescription",
56
- ariaRowCount: "aria-rowcount",
57
- ariaRowIndex: "aria-rowindex",
58
- ariaRowIndexText: "aria-rowindextext",
59
- ariaRowSpan: "aria-rowspan",
60
- ariaSelected: "aria-selected",
61
- ariaSetSize: "aria-setsize",
62
- ariaSort: "aria-sort",
63
- ariaValueMax: "aria-valuemax",
64
- ariaValueMin: "aria-valuemin",
65
- ariaValueNow: "aria-valuenow",
66
- ariaValueText: "aria-valuetext",
67
- role: "role"
68
- }, W = (e, t) => {
69
- for (let a in C) {
70
- t[a] = null;
71
- let i = null;
72
- const n = C[a];
73
- Object.defineProperty(t, a, {
74
- get() {
75
- return i;
76
- },
77
- set(o) {
78
- i = o, e.isConnected ? e.setAttribute(n, o) : S.set(e, t);
23
+ var ht = {}, gt;
24
+ function jt() {
25
+ return gt || (gt = 1, function() {
26
+ (function(p) {
27
+ const d = /* @__PURE__ */ new WeakMap(), v = /* @__PURE__ */ new WeakMap(), g = /* @__PURE__ */ new WeakMap(), l = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new WeakMap(), M = /* @__PURE__ */ new WeakMap(), F = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new WeakMap(), N = /* @__PURE__ */ new WeakMap(), S = /* @__PURE__ */ new WeakMap(), L = /* @__PURE__ */ new WeakMap(), O = /* @__PURE__ */ new WeakMap(), A = /* @__PURE__ */ new WeakMap(), k = /* @__PURE__ */ new WeakMap(), T = /* @__PURE__ */ new WeakMap(), C = {
28
+ ariaAtomic: "aria-atomic",
29
+ ariaAutoComplete: "aria-autocomplete",
30
+ ariaBusy: "aria-busy",
31
+ ariaChecked: "aria-checked",
32
+ ariaColCount: "aria-colcount",
33
+ ariaColIndex: "aria-colindex",
34
+ ariaColIndexText: "aria-colindextext",
35
+ ariaColSpan: "aria-colspan",
36
+ ariaCurrent: "aria-current",
37
+ ariaDescription: "aria-description",
38
+ ariaDisabled: "aria-disabled",
39
+ ariaExpanded: "aria-expanded",
40
+ ariaHasPopup: "aria-haspopup",
41
+ ariaHidden: "aria-hidden",
42
+ ariaInvalid: "aria-invalid",
43
+ ariaKeyShortcuts: "aria-keyshortcuts",
44
+ ariaLabel: "aria-label",
45
+ ariaLevel: "aria-level",
46
+ ariaLive: "aria-live",
47
+ ariaModal: "aria-modal",
48
+ ariaMultiLine: "aria-multiline",
49
+ ariaMultiSelectable: "aria-multiselectable",
50
+ ariaOrientation: "aria-orientation",
51
+ ariaPlaceholder: "aria-placeholder",
52
+ ariaPosInSet: "aria-posinset",
53
+ ariaPressed: "aria-pressed",
54
+ ariaReadOnly: "aria-readonly",
55
+ ariaRelevant: "aria-relevant",
56
+ ariaRequired: "aria-required",
57
+ ariaRoleDescription: "aria-roledescription",
58
+ ariaRowCount: "aria-rowcount",
59
+ ariaRowIndex: "aria-rowindex",
60
+ ariaRowIndexText: "aria-rowindextext",
61
+ ariaRowSpan: "aria-rowspan",
62
+ ariaSelected: "aria-selected",
63
+ ariaSetSize: "aria-setsize",
64
+ ariaSort: "aria-sort",
65
+ ariaValueMax: "aria-valuemax",
66
+ ariaValueMin: "aria-valuemin",
67
+ ariaValueNow: "aria-valuenow",
68
+ ariaValueText: "aria-valuetext",
69
+ role: "role"
70
+ }, W = (e, t) => {
71
+ for (let a in C) {
72
+ t[a] = null;
73
+ let i = null;
74
+ const n = C[a];
75
+ Object.defineProperty(t, a, {
76
+ get() {
77
+ return i;
78
+ },
79
+ set(o) {
80
+ i = o, e.isConnected ? e.setAttribute(n, o) : S.set(e, t);
81
+ }
82
+ });
83
+ }
84
+ };
85
+ function $(e) {
86
+ const t = l.get(e), { form: a } = t;
87
+ nt(e, a, t), it(e, t.labels);
88
+ }
89
+ const P = (e, t = !1) => {
90
+ const a = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT, {
91
+ acceptNode(o) {
92
+ return l.has(o) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
79
93
  }
80
94
  });
81
- }
82
- };
83
- function O(e) {
84
- const t = l.get(e), { form: a } = t;
85
- nt(e, a, t), it(e, t.labels);
86
- }
87
- const P = (e, t = !1) => {
88
- const a = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT, {
89
- acceptNode(o) {
90
- return l.has(o) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
91
- }
92
- });
93
- let i = a.nextNode();
94
- const n = !t || e.disabled;
95
- for (; i; )
96
- i.formDisabledCallback && n && U(i, e.disabled), i = a.nextNode();
97
- }, tt = { attributes: !0, attributeFilter: ["disabled", "name"] }, R = H() ? new MutationObserver((e) => {
98
- for (const t of e) {
99
- const a = t.target;
100
- if (t.attributeName === "disabled" && (a.constructor.formAssociated ? U(a, a.hasAttribute("disabled")) : a.localName === "fieldset" && P(a)), t.attributeName === "name" && a.constructor.formAssociated) {
101
- const i = l.get(a), n = N.get(a);
102
- i.setFormValue(n);
95
+ let i = a.nextNode();
96
+ const n = !t || e.disabled;
97
+ for (; i; )
98
+ i.formDisabledCallback && n && U(i, e.disabled), i = a.nextNode();
99
+ }, tt = { attributes: !0, attributeFilter: ["disabled", "name"] }, R = H() ? new MutationObserver((e) => {
100
+ for (const t of e) {
101
+ const a = t.target;
102
+ if (t.attributeName === "disabled" && (a.constructor.formAssociated ? U(a, a.hasAttribute("disabled")) : a.localName === "fieldset" && P(a)), t.attributeName === "name" && a.constructor.formAssociated) {
103
+ const i = l.get(a), n = N.get(a);
104
+ i.setFormValue(n);
105
+ }
103
106
  }
107
+ }) : {};
108
+ function q(e) {
109
+ e.forEach((t) => {
110
+ const { addedNodes: a, removedNodes: i } = t, n = Array.from(a), o = Array.from(i);
111
+ n.forEach((r) => {
112
+ var f;
113
+ if (l.has(r) && r.constructor.formAssociated && $(r), S.has(r)) {
114
+ const m = S.get(r);
115
+ Object.keys(C).filter((b) => m[b] !== null).forEach((b) => {
116
+ r.setAttribute(C[b], m[b]);
117
+ }), S.delete(r);
118
+ }
119
+ if (T.has(r)) {
120
+ const m = T.get(r);
121
+ r.setAttribute("internals-valid", m.validity.valid.toString()), r.setAttribute("internals-invalid", (!m.validity.valid).toString()), r.setAttribute("aria-invalid", (!m.validity.valid).toString()), T.delete(r);
122
+ }
123
+ if (r.localName === "form") {
124
+ const m = y.get(r), E = document.createTreeWalker(r, NodeFilter.SHOW_ELEMENT, {
125
+ acceptNode(J) {
126
+ return l.has(J) && J.constructor.formAssociated && !(m && m.has(J)) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
127
+ }
128
+ });
129
+ let b = E.nextNode();
130
+ for (; b; )
131
+ $(b), b = E.nextNode();
132
+ }
133
+ r.localName === "fieldset" && ((f = R.observe) === null || f === void 0 || f.call(R, r, tt), P(r, !0));
134
+ }), o.forEach((r) => {
135
+ const f = l.get(r);
136
+ f && g.get(f) && et(f), F.has(r) && F.get(r).disconnect();
137
+ });
138
+ });
104
139
  }
105
- }) : {};
106
- function q(e) {
107
- e.forEach((t) => {
108
- const { addedNodes: a, removedNodes: i } = t, n = Array.from(a), o = Array.from(i);
109
- n.forEach((r) => {
110
- var f;
111
- if (l.has(r) && r.constructor.formAssociated && O(r), S.has(r)) {
112
- const m = S.get(r);
113
- Object.keys(C).filter((b) => m[b] !== null).forEach((b) => {
114
- r.setAttribute(C[b], m[b]);
115
- }), S.delete(r);
116
- }
117
- if (T.has(r)) {
118
- const m = T.get(r);
119
- r.setAttribute("internals-valid", m.validity.valid.toString()), r.setAttribute("internals-invalid", (!m.validity.valid).toString()), r.setAttribute("aria-invalid", (!m.validity.valid).toString()), T.delete(r);
120
- }
121
- if (r.localName === "form") {
122
- const m = y.get(r), E = document.createTreeWalker(r, NodeFilter.SHOW_ELEMENT, {
123
- acceptNode(J) {
124
- return l.has(J) && J.constructor.formAssociated && !(m && m.has(J)) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
125
- }
126
- });
127
- let b = E.nextNode();
128
- for (; b; )
129
- O(b), b = E.nextNode();
140
+ function yt(e) {
141
+ e.forEach((t) => {
142
+ const { removedNodes: a } = t;
143
+ a.forEach((i) => {
144
+ const n = A.get(t.target);
145
+ l.has(i) && rt(i), n.disconnect();
146
+ });
147
+ });
148
+ }
149
+ const bt = (e) => {
150
+ var t, a;
151
+ const i = new MutationObserver(yt);
152
+ !((t = window == null ? void 0 : window.ShadyDOM) === null || t === void 0) && t.inUse && e.mode && e.host && (e = e.host), (a = i.observe) === null || a === void 0 || a.call(i, e, { childList: !0 }), A.set(e, i);
153
+ };
154
+ H() && new MutationObserver(q);
155
+ const B = {
156
+ childList: !0,
157
+ subtree: !0
158
+ }, U = (e, t) => {
159
+ e.toggleAttribute("internals-disabled", t), t ? e.setAttribute("aria-disabled", "true") : e.removeAttribute("aria-disabled"), e.formDisabledCallback && e.formDisabledCallback.apply(e, [t]);
160
+ }, et = (e) => {
161
+ g.get(e).forEach((a) => {
162
+ a.remove();
163
+ }), g.set(e, []);
164
+ }, at = (e, t) => {
165
+ const a = document.createElement("input");
166
+ return a.type = "hidden", a.name = e.getAttribute("name"), e.after(a), g.get(t).push(a), a;
167
+ }, wt = (e, t) => {
168
+ var a;
169
+ g.set(t, []), (a = R.observe) === null || a === void 0 || a.call(R, e, tt);
170
+ }, it = (e, t) => {
171
+ if (t.length) {
172
+ Array.from(t).forEach((i) => i.addEventListener("click", e.click.bind(e)));
173
+ let a = t[0].id;
174
+ t[0].id || (a = `${t[0].htmlFor}_Label`, t[0].id = a), e.setAttribute("aria-labelledby", a);
175
+ }
176
+ }, D = (e) => {
177
+ const t = Array.from(e.elements).filter((o) => !o.tagName.includes("-") && o.validity).map((o) => o.validity.valid), a = y.get(e) || [], i = Array.from(a).filter((o) => o.isConnected).map((o) => l.get(o).validity.valid), n = [...t, ...i].includes(!1);
178
+ e.toggleAttribute("internals-invalid", n), e.toggleAttribute("internals-valid", !n);
179
+ }, xt = (e) => {
180
+ D(_(e.target));
181
+ }, Et = (e) => {
182
+ D(_(e.target));
183
+ }, It = (e) => {
184
+ const t = ["button[type=submit]", "input[type=submit]", "button:not([type])"].map((a) => `${a}:not([disabled])`).map((a) => `${a}:not([form])${e.id ? `,${a}[form='${e.id}']` : ""}`).join(",");
185
+ e.addEventListener("click", (a) => {
186
+ if (a.target.closest(t)) {
187
+ const n = y.get(e);
188
+ if (e.noValidate)
189
+ return;
190
+ n.size && Array.from(n).reverse().map((f) => l.get(f).reportValidity()).includes(!1) && a.preventDefault();
130
191
  }
131
- r.localName === "fieldset" && ((f = R.observe) === null || f === void 0 || f.call(R, r, tt), P(r, !0));
132
- }), o.forEach((r) => {
133
- const f = l.get(r);
134
- f && g.get(f) && et(f), F.has(r) && F.get(r).disconnect();
135
192
  });
136
- });
137
- }
138
- function gt(e) {
139
- e.forEach((t) => {
140
- const { removedNodes: a } = t;
141
- a.forEach((i) => {
142
- const n = A.get(t.target);
143
- l.has(i) && rt(i), n.disconnect();
193
+ }, Mt = (e) => {
194
+ const t = y.get(e.target);
195
+ t && t.size && t.forEach((a) => {
196
+ a.constructor.formAssociated && a.formResetCallback && a.formResetCallback.apply(a);
144
197
  });
145
- });
146
- }
147
- const vt = (e) => {
148
- var t, a;
149
- const i = new MutationObserver(gt);
150
- !((t = window == null ? void 0 : window.ShadyDOM) === null || t === void 0) && t.inUse && e.mode && e.host && (e = e.host), (a = i.observe) === null || a === void 0 || a.call(i, e, { childList: !0 }), A.set(e, i);
151
- };
152
- H() && new MutationObserver(q);
153
- const B = {
154
- childList: !0,
155
- subtree: !0
156
- }, U = (e, t) => {
157
- e.toggleAttribute("internals-disabled", t), t ? e.setAttribute("aria-disabled", "true") : e.removeAttribute("aria-disabled"), e.formDisabledCallback && e.formDisabledCallback.apply(e, [t]);
158
- }, et = (e) => {
159
- g.get(e).forEach((a) => {
160
- a.remove();
161
- }), g.set(e, []);
162
- }, at = (e, t) => {
163
- const a = document.createElement("input");
164
- return a.type = "hidden", a.name = e.getAttribute("name"), e.after(a), g.get(t).push(a), a;
165
- }, yt = (e, t) => {
166
- var a;
167
- g.set(t, []), (a = R.observe) === null || a === void 0 || a.call(R, e, tt);
168
- }, it = (e, t) => {
169
- if (t.length) {
170
- Array.from(t).forEach((i) => i.addEventListener("click", e.click.bind(e)));
171
- let a = t[0].id;
172
- t[0].id || (a = `${t[0].htmlFor}_Label`, t[0].id = a), e.setAttribute("aria-labelledby", a);
173
- }
174
- }, D = (e) => {
175
- const t = Array.from(e.elements).filter((o) => !o.tagName.includes("-") && o.validity).map((o) => o.validity.valid), a = y.get(e) || [], i = Array.from(a).filter((o) => o.isConnected).map((o) => l.get(o).validity.valid), n = [...t, ...i].includes(!1);
176
- e.toggleAttribute("internals-invalid", n), e.toggleAttribute("internals-valid", !n);
177
- }, bt = (e) => {
178
- D(_(e.target));
179
- }, wt = (e) => {
180
- D(_(e.target));
181
- }, xt = (e) => {
182
- const t = ["button[type=submit]", "input[type=submit]", "button:not([type])"].map((a) => `${a}:not([disabled])`).map((a) => `${a}:not([form])${e.id ? `,${a}[form='${e.id}']` : ""}`).join(",");
183
- e.addEventListener("click", (a) => {
184
- if (a.target.closest(t)) {
185
- const n = y.get(e);
186
- if (e.noValidate)
187
- return;
188
- n.size && Array.from(n).reverse().map((f) => l.get(f).reportValidity()).includes(!1) && a.preventDefault();
189
- }
190
- });
191
- }, Et = (e) => {
192
- const t = y.get(e.target);
193
- t && t.size && t.forEach((a) => {
194
- a.constructor.formAssociated && a.formResetCallback && a.formResetCallback.apply(a);
195
- });
196
- }, nt = (e, t, a) => {
197
- if (t) {
198
- const i = y.get(t);
199
- if (i)
200
- i.add(e);
201
- else {
202
- const n = /* @__PURE__ */ new Set();
203
- n.add(e), y.set(t, n), xt(t), t.addEventListener("reset", Et), t.addEventListener("input", bt), t.addEventListener("change", wt);
204
- }
205
- M.set(t, { ref: e, internals: a }), e.constructor.formAssociated && e.formAssociatedCallback && setTimeout(() => {
206
- e.formAssociatedCallback.apply(e, [t]);
207
- }, 0), D(t);
208
- }
209
- }, _ = (e) => {
210
- let t = e.parentNode;
211
- return t && t.tagName !== "FORM" && (t = _(t)), t;
212
- }, x = (e, t, a = DOMException) => {
213
- if (!e.constructor.formAssociated)
214
- throw new a(t);
215
- }, ot = (e, t, a) => {
216
- const i = y.get(e);
217
- return i && i.size && i.forEach((n) => {
218
- l.get(n)[a]() || (t = !1);
219
- }), t;
220
- }, rt = (e) => {
221
- if (e.constructor.formAssociated) {
222
- const t = l.get(e), { labels: a, form: i } = t;
223
- it(e, a), nt(e, i, t);
224
- }
225
- };
226
- function H() {
227
- return typeof MutationObserver < "u";
228
- }
229
- class It {
230
- constructor() {
231
- this.badInput = !1, this.customError = !1, this.patternMismatch = !1, this.rangeOverflow = !1, this.rangeUnderflow = !1, this.stepMismatch = !1, this.tooLong = !1, this.tooShort = !1, this.typeMismatch = !1, this.valid = !0, this.valueMissing = !1, Object.seal(this);
232
- }
233
- }
234
- const Mt = (e) => (e.badInput = !1, e.customError = !1, e.patternMismatch = !1, e.rangeOverflow = !1, e.rangeUnderflow = !1, e.stepMismatch = !1, e.tooLong = !1, e.tooShort = !1, e.typeMismatch = !1, e.valid = !0, e.valueMissing = !1, e), kt = (e, t, a) => (e.valid = St(t), Object.keys(t).forEach((i) => e[i] = t[i]), a && D(a), e), St = (e) => {
235
- let t = !0;
236
- for (let a in e)
237
- a !== "valid" && e[a] !== !1 && (t = !1);
238
- return t;
239
- }, j = /* @__PURE__ */ new WeakMap();
240
- function st(e, t) {
241
- e.toggleAttribute(t, !0), e.part && e.part.add(t);
242
- }
243
- class K extends Set {
244
- static get isPolyfilled() {
245
- return !0;
246
- }
247
- constructor(t) {
248
- if (super(), !t || !t.tagName || t.tagName.indexOf("-") === -1)
249
- throw new TypeError("Illegal constructor");
250
- j.set(this, t);
251
- }
252
- add(t) {
253
- if (!/^--/.test(t) || typeof t != "string")
254
- throw new DOMException(`Failed to execute 'add' on 'CustomStateSet': The specified value ${t} must start with '--'.`);
255
- const a = super.add(t), i = j.get(this), n = `state${t}`;
256
- return i.isConnected ? st(i, n) : setTimeout(() => {
257
- st(i, n);
258
- }), a;
259
- }
260
- clear() {
261
- for (let [t] of this.entries())
262
- this.delete(t);
263
- super.clear();
264
- }
265
- delete(t) {
266
- const a = super.delete(t), i = j.get(this);
267
- return i.isConnected ? (i.toggleAttribute(`state${t}`, !1), i.part && i.part.remove(`state${t}`)) : setTimeout(() => {
268
- i.toggleAttribute(`state${t}`, !1), i.part && i.part.remove(`state${t}`);
269
- }), a;
270
- }
271
- }
272
- function lt(e, t, a, i) {
273
- if (typeof t == "function" ? e !== t || !i : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
274
- return a === "m" ? i : a === "a" ? i.call(e) : i ? i.value : t.get(e);
275
- }
276
- function Tt(e, t, a, i, n) {
277
- if (typeof t == "function" ? e !== t || !0 : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
278
- return t.set(e, a), a;
279
- }
280
- var V;
281
- class Ct {
282
- constructor(t) {
283
- V.set(this, void 0), Tt(this, V, t);
284
- for (let a = 0; a < t.length; a++) {
285
- let i = t[a];
286
- this[a] = i, i.hasAttribute("name") && (this[i.getAttribute("name")] = i);
287
- }
288
- Object.freeze(this);
289
- }
290
- get length() {
291
- return lt(this, V, "f").length;
292
- }
293
- [(V = /* @__PURE__ */ new WeakMap(), Symbol.iterator)]() {
294
- return lt(this, V, "f")[Symbol.iterator]();
295
- }
296
- item(t) {
297
- return this[t] == null ? null : this[t];
298
- }
299
- namedItem(t) {
300
- return this[t] == null ? null : this[t];
301
- }
302
- }
303
- function Ft() {
304
- const e = HTMLFormElement.prototype.checkValidity;
305
- HTMLFormElement.prototype.checkValidity = a;
306
- const t = HTMLFormElement.prototype.reportValidity;
307
- HTMLFormElement.prototype.reportValidity = i;
308
- function a(...o) {
309
- let r = e.apply(this, o);
310
- return ot(this, r, "checkValidity");
311
- }
312
- function i(...o) {
313
- let r = t.apply(this, o);
314
- return ot(this, r, "reportValidity");
315
- }
316
- const { get: n } = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "elements");
317
- Object.defineProperty(HTMLFormElement.prototype, "elements", {
318
- get(...o) {
319
- const r = n.call(this, ...o), f = Array.from(y.get(this) || []);
320
- if (f.length === 0)
321
- return r;
322
- const m = Array.from(r).concat(f).sort((E, b) => E.compareDocumentPosition ? E.compareDocumentPosition(b) & 2 ? 1 : -1 : 0);
323
- return new Ct(m);
324
- }
325
- });
326
- }
327
- class ct {
328
- static get isPolyfilled() {
329
- return !0;
330
- }
331
- constructor(t) {
332
- if (!t || !t.tagName || t.tagName.indexOf("-") === -1)
333
- throw new TypeError("Illegal constructor");
334
- const a = t.getRootNode(), i = new It();
335
- this.states = new K(t), d.set(this, t), v.set(this, i), l.set(t, this), W(t, this), yt(t, this), Object.seal(this), a instanceof DocumentFragment && vt(a);
336
- }
337
- checkValidity() {
338
- const t = d.get(this);
339
- if (x(t, "Failed to execute 'checkValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate)
340
- return !0;
341
- const a = v.get(this);
342
- if (!a.valid) {
343
- const i = new Event("invalid", {
344
- bubbles: !1,
345
- cancelable: !0,
346
- composed: !1
347
- });
348
- t.dispatchEvent(i);
198
+ }, nt = (e, t, a) => {
199
+ if (t) {
200
+ const i = y.get(t);
201
+ if (i)
202
+ i.add(e);
203
+ else {
204
+ const n = /* @__PURE__ */ new Set();
205
+ n.add(e), y.set(t, n), It(t), t.addEventListener("reset", Mt), t.addEventListener("input", xt), t.addEventListener("change", Et);
206
+ }
207
+ M.set(t, { ref: e, internals: a }), e.constructor.formAssociated && e.formAssociatedCallback && setTimeout(() => {
208
+ e.formAssociatedCallback.apply(e, [t]);
209
+ }, 0), D(t);
349
210
  }
350
- return a.valid;
351
- }
352
- get form() {
353
- const t = d.get(this);
354
- x(t, "Failed to read the 'form' property from 'ElementInternals': The target element is not a form-associated custom element.");
355
- let a;
356
- return t.constructor.formAssociated === !0 && (a = _(t)), a;
211
+ }, _ = (e) => {
212
+ let t = e.parentNode;
213
+ return t && t.tagName !== "FORM" && (t = _(t)), t;
214
+ }, x = (e, t, a = DOMException) => {
215
+ if (!e.constructor.formAssociated)
216
+ throw new a(t);
217
+ }, ot = (e, t, a) => {
218
+ const i = y.get(e);
219
+ return i && i.size && i.forEach((n) => {
220
+ l.get(n)[a]() || (t = !1);
221
+ }), t;
222
+ }, rt = (e) => {
223
+ if (e.constructor.formAssociated) {
224
+ const t = l.get(e), { labels: a, form: i } = t;
225
+ it(e, a), nt(e, i, t);
226
+ }
227
+ };
228
+ function H() {
229
+ return typeof MutationObserver < "u";
357
230
  }
358
- get labels() {
359
- const t = d.get(this);
360
- x(t, "Failed to read the 'labels' property from 'ElementInternals': The target element is not a form-associated custom element.");
361
- const a = t.getAttribute("id"), i = t.getRootNode();
362
- return i && a ? i.querySelectorAll(`[for="${a}"]`) : [];
231
+ class kt {
232
+ constructor() {
233
+ this.badInput = !1, this.customError = !1, this.patternMismatch = !1, this.rangeOverflow = !1, this.rangeUnderflow = !1, this.stepMismatch = !1, this.tooLong = !1, this.tooShort = !1, this.typeMismatch = !1, this.valid = !0, this.valueMissing = !1, Object.seal(this);
234
+ }
363
235
  }
364
- reportValidity() {
365
- const t = d.get(this);
366
- if (x(t, "Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate)
236
+ const St = (e) => (e.badInput = !1, e.customError = !1, e.patternMismatch = !1, e.rangeOverflow = !1, e.rangeUnderflow = !1, e.stepMismatch = !1, e.tooLong = !1, e.tooShort = !1, e.typeMismatch = !1, e.valid = !0, e.valueMissing = !1, e), Tt = (e, t, a) => (e.valid = Ct(t), Object.keys(t).forEach((i) => e[i] = t[i]), a && D(a), e), Ct = (e) => {
237
+ let t = !0;
238
+ for (let a in e)
239
+ a !== "valid" && e[a] !== !1 && (t = !1);
240
+ return t;
241
+ }, j = /* @__PURE__ */ new WeakMap();
242
+ function st(e, t) {
243
+ e.toggleAttribute(t, !0), e.part && e.part.add(t);
244
+ }
245
+ class K extends Set {
246
+ static get isPolyfilled() {
367
247
  return !0;
368
- const a = this.checkValidity(), i = $.get(this);
369
- if (i && !t.constructor.formAssociated)
370
- throw new DOMException("Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element.");
371
- return !a && i && (t.focus(), i.focus()), a;
248
+ }
249
+ constructor(t) {
250
+ if (super(), !t || !t.tagName || t.tagName.indexOf("-") === -1)
251
+ throw new TypeError("Illegal constructor");
252
+ j.set(this, t);
253
+ }
254
+ add(t) {
255
+ if (!/^--/.test(t) || typeof t != "string")
256
+ throw new DOMException(`Failed to execute 'add' on 'CustomStateSet': The specified value ${t} must start with '--'.`);
257
+ const a = super.add(t), i = j.get(this), n = `state${t}`;
258
+ return i.isConnected ? st(i, n) : setTimeout(() => {
259
+ st(i, n);
260
+ }), a;
261
+ }
262
+ clear() {
263
+ for (let [t] of this.entries())
264
+ this.delete(t);
265
+ super.clear();
266
+ }
267
+ delete(t) {
268
+ const a = super.delete(t), i = j.get(this);
269
+ return i.isConnected ? (i.toggleAttribute(`state${t}`, !1), i.part && i.part.remove(`state${t}`)) : setTimeout(() => {
270
+ i.toggleAttribute(`state${t}`, !1), i.part && i.part.remove(`state${t}`);
271
+ }), a;
272
+ }
372
273
  }
373
- setFormValue(t) {
374
- const a = d.get(this);
375
- if (x(a, "Failed to execute 'setFormValue' on 'ElementInternals': The target element is not a form-associated custom element."), et(this), t != null && !(t instanceof FormData)) {
376
- if (a.getAttribute("name")) {
377
- const i = at(a, this);
378
- i.value = t;
274
+ function lt(e, t, a, i) {
275
+ if (typeof t == "function" ? e !== t || !i : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
276
+ return a === "m" ? i : a === "a" ? i.call(e) : i ? i.value : t.get(e);
277
+ }
278
+ function Ft(e, t, a, i, n) {
279
+ if (typeof t == "function" ? e !== t || !0 : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
280
+ return t.set(e, a), a;
281
+ }
282
+ var V;
283
+ class At {
284
+ constructor(t) {
285
+ V.set(this, void 0), Ft(this, V, t);
286
+ for (let a = 0; a < t.length; a++) {
287
+ let i = t[a];
288
+ this[a] = i, i.hasAttribute("name") && (this[i.getAttribute("name")] = i);
379
289
  }
380
- } else t != null && t instanceof FormData && Array.from(t).reverse().forEach(([i, n]) => {
381
- if (typeof n == "string") {
382
- const o = at(a, this);
383
- o.name = i, o.value = n;
290
+ Object.freeze(this);
291
+ }
292
+ get length() {
293
+ return lt(this, V, "f").length;
294
+ }
295
+ [(V = /* @__PURE__ */ new WeakMap(), Symbol.iterator)]() {
296
+ return lt(this, V, "f")[Symbol.iterator]();
297
+ }
298
+ item(t) {
299
+ return this[t] == null ? null : this[t];
300
+ }
301
+ namedItem(t) {
302
+ return this[t] == null ? null : this[t];
303
+ }
304
+ }
305
+ function Vt() {
306
+ const e = HTMLFormElement.prototype.checkValidity;
307
+ HTMLFormElement.prototype.checkValidity = a;
308
+ const t = HTMLFormElement.prototype.reportValidity;
309
+ HTMLFormElement.prototype.reportValidity = i;
310
+ function a(...o) {
311
+ let r = e.apply(this, o);
312
+ return ot(this, r, "checkValidity");
313
+ }
314
+ function i(...o) {
315
+ let r = t.apply(this, o);
316
+ return ot(this, r, "reportValidity");
317
+ }
318
+ const { get: n } = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "elements");
319
+ Object.defineProperty(HTMLFormElement.prototype, "elements", {
320
+ get(...o) {
321
+ const r = n.call(this, ...o), f = Array.from(y.get(this) || []);
322
+ if (f.length === 0)
323
+ return r;
324
+ const m = Array.from(r).concat(f).sort((E, b) => E.compareDocumentPosition ? E.compareDocumentPosition(b) & 2 ? 1 : -1 : 0);
325
+ return new At(m);
384
326
  }
385
327
  });
386
- N.set(a, t);
387
- }
388
- setValidity(t, a, i) {
389
- const n = d.get(this);
390
- if (x(n, "Failed to execute 'setValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !t)
391
- throw new TypeError("Failed to execute 'setValidity' on 'ElementInternals': 1 argument required, but only 0 present.");
392
- $.set(this, i);
393
- const o = v.get(this), r = {};
394
- for (const E in t)
395
- r[E] = t[E];
396
- Object.keys(r).length === 0 && Mt(o);
397
- const f = Object.assign(Object.assign({}, o), r);
398
- delete f.valid;
399
- const { valid: m } = kt(o, f, this.form);
400
- if (!m && !a)
401
- throw new DOMException("Failed to execute 'setValidity' on 'ElementInternals': The second argument should not be empty if one or more flags in the first argument are true.");
402
- I.set(this, m ? "" : a), n.isConnected ? (n.toggleAttribute("internals-invalid", !m), n.toggleAttribute("internals-valid", m), n.setAttribute("aria-invalid", `${!m}`)) : T.set(n, this);
403
- }
404
- get shadowRoot() {
405
- const t = d.get(this), a = L.get(t);
406
- return a || null;
407
328
  }
408
- get validationMessage() {
409
- const t = d.get(this);
410
- return x(t, "Failed to read the 'validationMessage' property from 'ElementInternals': The target element is not a form-associated custom element."), I.get(this);
411
- }
412
- get validity() {
413
- const t = d.get(this);
414
- return x(t, "Failed to read the 'validity' property from 'ElementInternals': The target element is not a form-associated custom element."), v.get(this);
415
- }
416
- get willValidate() {
417
- const t = d.get(this);
418
- return x(t, "Failed to read the 'willValidate' property from 'ElementInternals': The target element is not a form-associated custom element."), !(t.disabled || t.hasAttribute("disabled") || t.hasAttribute("readonly"));
419
- }
420
- }
421
- function At() {
422
- if (typeof window > "u" || !window.ElementInternals || !HTMLElement.prototype.attachInternals)
423
- return !1;
424
- class e extends HTMLElement {
425
- constructor() {
426
- super(), this.internals = this.attachInternals();
329
+ class ct {
330
+ static get isPolyfilled() {
331
+ return !0;
427
332
  }
428
- }
429
- const t = `element-internals-feature-detection-${Math.random().toString(36).replace(/[^a-z]+/g, "")}`;
430
- customElements.define(t, e);
431
- const a = new e();
432
- return [
433
- "shadowRoot",
434
- "form",
435
- "willValidate",
436
- "validity",
437
- "validationMessage",
438
- "labels",
439
- "setFormValue",
440
- "setValidity",
441
- "checkValidity",
442
- "reportValidity"
443
- ].every((i) => i in a.internals);
444
- }
445
- let dt = !1, ut = !1;
446
- function G(e) {
447
- ut || (ut = !0, window.CustomStateSet = K, e && (HTMLElement.prototype.attachInternals = function(...t) {
448
- const a = e.call(this, t);
449
- return a.states = new K(this), a;
450
- }));
451
- }
452
- function pt(e = !0) {
453
- if (!dt) {
454
- if (dt = !0, typeof window < "u" && (window.ElementInternals = ct), typeof CustomElementRegistry < "u") {
455
- const t = CustomElementRegistry.prototype.define;
456
- CustomElementRegistry.prototype.define = function(a, i, n) {
457
- if (i.formAssociated) {
458
- const o = i.prototype.connectedCallback;
459
- i.prototype.connectedCallback = function() {
460
- k.has(this) || (k.set(this, !0), this.hasAttribute("disabled") && U(this, !0)), o != null && o.apply(this), rt(this);
461
- };
333
+ constructor(t) {
334
+ if (!t || !t.tagName || t.tagName.indexOf("-") === -1)
335
+ throw new TypeError("Illegal constructor");
336
+ const a = t.getRootNode(), i = new kt();
337
+ this.states = new K(t), d.set(this, t), v.set(this, i), l.set(t, this), W(t, this), wt(t, this), Object.seal(this), a instanceof DocumentFragment && bt(a);
338
+ }
339
+ checkValidity() {
340
+ const t = d.get(this);
341
+ if (x(t, "Failed to execute 'checkValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate)
342
+ return !0;
343
+ const a = v.get(this);
344
+ if (!a.valid) {
345
+ const i = new Event("invalid", {
346
+ bubbles: !1,
347
+ cancelable: !0,
348
+ composed: !1
349
+ });
350
+ t.dispatchEvent(i);
351
+ }
352
+ return a.valid;
353
+ }
354
+ get form() {
355
+ const t = d.get(this);
356
+ x(t, "Failed to read the 'form' property from 'ElementInternals': The target element is not a form-associated custom element.");
357
+ let a;
358
+ return t.constructor.formAssociated === !0 && (a = _(t)), a;
359
+ }
360
+ get labels() {
361
+ const t = d.get(this);
362
+ x(t, "Failed to read the 'labels' property from 'ElementInternals': The target element is not a form-associated custom element.");
363
+ const a = t.getAttribute("id"), i = t.getRootNode();
364
+ return i && a ? i.querySelectorAll(`[for="${a}"]`) : [];
365
+ }
366
+ reportValidity() {
367
+ const t = d.get(this);
368
+ if (x(t, "Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate)
369
+ return !0;
370
+ const a = this.checkValidity(), i = O.get(this);
371
+ if (i && !t.constructor.formAssociated)
372
+ throw new DOMException("Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element.");
373
+ return !a && i && (t.focus(), i.focus()), a;
374
+ }
375
+ setFormValue(t) {
376
+ const a = d.get(this);
377
+ if (x(a, "Failed to execute 'setFormValue' on 'ElementInternals': The target element is not a form-associated custom element."), et(this), t != null && !(t instanceof FormData)) {
378
+ if (a.getAttribute("name")) {
379
+ const i = at(a, this);
380
+ i.value = t;
462
381
  }
463
- t.call(this, a, i, n);
464
- };
465
- }
466
- if (typeof HTMLElement < "u" && (HTMLElement.prototype.attachInternals = function() {
467
- if (this.tagName) {
468
- if (this.tagName.indexOf("-") === -1)
469
- throw new Error("Failed to execute 'attachInternals' on 'HTMLElement': Unable to attach ElementInternals to non-custom elements.");
470
- } else return {};
471
- if (l.has(this))
472
- throw new DOMException("DOMException: Failed to execute 'attachInternals' on 'HTMLElement': ElementInternals for the specified element was already attached.");
473
- return new ct(this);
474
- }), typeof Element < "u") {
475
- let t = function(...i) {
476
- const n = a.apply(this, i);
477
- if (L.set(this, n), H()) {
478
- const o = new MutationObserver(q);
479
- window.ShadyDOM ? o.observe(this, B) : o.observe(n, B), F.set(this, o);
382
+ } else t != null && t instanceof FormData && Array.from(t).reverse().forEach(([i, n]) => {
383
+ if (typeof n == "string") {
384
+ const o = at(a, this);
385
+ o.name = i, o.value = n;
480
386
  }
481
- return n;
482
- };
483
- const a = Element.prototype.attachShadow;
484
- Element.prototype.attachShadow = t;
387
+ });
388
+ N.set(a, t);
389
+ }
390
+ setValidity(t, a, i) {
391
+ const n = d.get(this);
392
+ if (x(n, "Failed to execute 'setValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !t)
393
+ throw new TypeError("Failed to execute 'setValidity' on 'ElementInternals': 1 argument required, but only 0 present.");
394
+ O.set(this, i);
395
+ const o = v.get(this), r = {};
396
+ for (const E in t)
397
+ r[E] = t[E];
398
+ Object.keys(r).length === 0 && St(o);
399
+ const f = Object.assign(Object.assign({}, o), r);
400
+ delete f.valid;
401
+ const { valid: m } = Tt(o, f, this.form);
402
+ if (!m && !a)
403
+ throw new DOMException("Failed to execute 'setValidity' on 'ElementInternals': The second argument should not be empty if one or more flags in the first argument are true.");
404
+ I.set(this, m ? "" : a), n.isConnected ? (n.toggleAttribute("internals-invalid", !m), n.toggleAttribute("internals-valid", m), n.setAttribute("aria-invalid", `${!m}`)) : T.set(n, this);
405
+ }
406
+ get shadowRoot() {
407
+ const t = d.get(this), a = L.get(t);
408
+ return a || null;
409
+ }
410
+ get validationMessage() {
411
+ const t = d.get(this);
412
+ return x(t, "Failed to read the 'validationMessage' property from 'ElementInternals': The target element is not a form-associated custom element."), I.get(this);
413
+ }
414
+ get validity() {
415
+ const t = d.get(this);
416
+ return x(t, "Failed to read the 'validity' property from 'ElementInternals': The target element is not a form-associated custom element."), v.get(this);
417
+ }
418
+ get willValidate() {
419
+ const t = d.get(this);
420
+ return x(t, "Failed to read the 'willValidate' property from 'ElementInternals': The target element is not a form-associated custom element."), !(t.disabled || t.hasAttribute("disabled") || t.hasAttribute("readonly"));
421
+ }
422
+ }
423
+ function Nt() {
424
+ if (typeof window > "u" || !window.ElementInternals || !HTMLElement.prototype.attachInternals)
425
+ return !1;
426
+ class e extends HTMLElement {
427
+ constructor() {
428
+ super(), this.internals = this.attachInternals();
429
+ }
430
+ }
431
+ const t = `element-internals-feature-detection-${Math.random().toString(36).replace(/[^a-z]+/g, "")}`;
432
+ customElements.define(t, e);
433
+ const a = new e();
434
+ return [
435
+ "shadowRoot",
436
+ "form",
437
+ "willValidate",
438
+ "validity",
439
+ "validationMessage",
440
+ "labels",
441
+ "setFormValue",
442
+ "setValidity",
443
+ "checkValidity",
444
+ "reportValidity"
445
+ ].every((i) => i in a.internals);
446
+ }
447
+ let dt = !1, ut = !1;
448
+ function G(e) {
449
+ ut || (ut = !0, window.CustomStateSet = K, e && (HTMLElement.prototype.attachInternals = function(...t) {
450
+ const a = e.call(this, t);
451
+ return a.states = new K(this), a;
452
+ }));
453
+ }
454
+ function pt(e = !0) {
455
+ if (!dt) {
456
+ if (dt = !0, typeof window < "u" && (window.ElementInternals = ct), typeof CustomElementRegistry < "u") {
457
+ const t = CustomElementRegistry.prototype.define;
458
+ CustomElementRegistry.prototype.define = function(a, i, n) {
459
+ if (i.formAssociated) {
460
+ const o = i.prototype.connectedCallback;
461
+ i.prototype.connectedCallback = function() {
462
+ k.has(this) || (k.set(this, !0), this.hasAttribute("disabled") && U(this, !0)), o != null && o.apply(this), rt(this);
463
+ };
464
+ }
465
+ t.call(this, a, i, n);
466
+ };
467
+ }
468
+ if (typeof HTMLElement < "u" && (HTMLElement.prototype.attachInternals = function() {
469
+ if (this.tagName) {
470
+ if (this.tagName.indexOf("-") === -1)
471
+ throw new Error("Failed to execute 'attachInternals' on 'HTMLElement': Unable to attach ElementInternals to non-custom elements.");
472
+ } else return {};
473
+ if (l.has(this))
474
+ throw new DOMException("DOMException: Failed to execute 'attachInternals' on 'HTMLElement': ElementInternals for the specified element was already attached.");
475
+ return new ct(this);
476
+ }), typeof Element < "u") {
477
+ let t = function(...i) {
478
+ const n = a.apply(this, i);
479
+ if (L.set(this, n), H()) {
480
+ const o = new MutationObserver(q);
481
+ window.ShadyDOM ? o.observe(this, B) : o.observe(n, B), F.set(this, o);
482
+ }
483
+ return n;
484
+ };
485
+ const a = Element.prototype.attachShadow;
486
+ Element.prototype.attachShadow = t;
487
+ }
488
+ H() && typeof document < "u" && new MutationObserver(q).observe(document.documentElement, B), typeof HTMLFormElement < "u" && Vt(), (e || typeof window < "u" && !window.CustomStateSet) && G();
485
489
  }
486
- H() && typeof document < "u" && new MutationObserver(q).observe(document.documentElement, B), typeof HTMLFormElement < "u" && Ft(), (e || typeof window < "u" && !window.CustomStateSet) && G();
487
490
  }
488
- }
489
- return !!customElements.polyfillWrapFlushCallback || (At() ? typeof window < "u" && !window.CustomStateSet && G(HTMLElement.prototype.attachInternals) : pt(!1)), p.forceCustomStateSetPolyfill = G, p.forceElementInternalsPolyfill = pt, Object.defineProperty(p, "__esModule", { value: !0 }), p;
490
- })({});
491
- })();
492
- var Bt = Object.defineProperty, Ut = Object.getOwnPropertyDescriptor, c = (p, d, v, g) => {
493
- for (var l = g > 1 ? void 0 : g ? Ut(d, v) : d, I = p.length - 1, M; I >= 0; I--)
491
+ return !!customElements.polyfillWrapFlushCallback || (Nt() ? typeof window < "u" && !window.CustomStateSet && G(HTMLElement.prototype.attachInternals) : pt(!1)), p.forceCustomStateSetPolyfill = G, p.forceElementInternalsPolyfill = pt, Object.defineProperty(p, "__esModule", { value: !0 }), p;
492
+ })({});
493
+ }()), ht;
494
+ }
495
+ jt();
496
+ var Kt = Object.defineProperty, Gt = Object.getOwnPropertyDescriptor, c = (p, d, v, g) => {
497
+ for (var l = g > 1 ? void 0 : g ? Gt(d, v) : d, I = p.length - 1, M; I >= 0; I--)
494
498
  (M = p[I]) && (l = (g ? M(d, v, l) : M(l)) || l);
495
- return g && l && Bt(d, v, l), l;
499
+ return g && l && Kt(d, v, l), l;
496
500
  };
497
501
  const Z = "pie-text-input", Q = "assistive-text";
498
- let s = class extends Ot(Pt(Rt(X))) {
502
+ let s = class extends Rt(Dt(_t(X))) {
499
503
  constructor() {
500
504
  super(...arguments), this.type = w.type, this.value = w.value, this.disabled = w.disabled, this.readonly = w.readonly, this.status = w.status, this.size = w.size, this.required = !1, this.handleInput = (p) => {
501
505
  this.value = p.target.value, this._internals.setFormValue(this.value);
502
506
  }, this.handleChange = (p) => {
503
- const d = Dt(p);
507
+ const d = Ht(p);
504
508
  this.dispatchEvent(d);
505
509
  };
506
510
  }
@@ -547,13 +551,13 @@ let s = class extends Ot(Pt(Rt(X))) {
547
551
  name: N,
548
552
  pattern: S,
549
553
  step: L,
550
- placeholder: $,
554
+ placeholder: O,
551
555
  readonly: A,
552
556
  status: k,
553
557
  type: T,
554
558
  value: C,
555
559
  size: W,
556
- required: O
560
+ required: $
557
561
  } = this, P = {
558
562
  "c-textInput": !0,
559
563
  [`c-textInput--${W}`]: !0,
@@ -563,7 +567,7 @@ let s = class extends Ot(Pt(Rt(X))) {
563
567
  };
564
568
  return mt`
565
569
  <div
566
- class="${$t(P)}"
570
+ class="${Pt(P)}"
567
571
  data-test-id="pie-text-input-shell">
568
572
  <!-- The reason for separate slots for icons and text is that we cannot programmatically be aware of the
569
573
  HTML used inside of the slot without breaking SSR in consuming applications (icons need to use different colours than text content)
@@ -585,9 +589,9 @@ let s = class extends Ot(Pt(Rt(X))) {
585
589
  autocomplete=${h(d)}
586
590
  ?autofocus=${v}
587
591
  inputmode=${h(l)}
588
- placeholder=${h($)}
592
+ placeholder=${h(O)}
589
593
  ?readonly=${A}
590
- ?required=${O}
594
+ ?required=${$}
591
595
  aria-describedby=${h(p ? Q : void 0)}
592
596
  aria-invalid=${k === "error" ? "true" : "false"}
593
597
  aria-errormessage="${h(k === "error" ? Q : void 0)}"
@@ -608,13 +612,13 @@ let s = class extends Ot(Pt(Rt(X))) {
608
612
  data-test-id="pie-text-input-assistive-text">
609
613
  ${p}
610
614
  </pie-assistive-text>
611
- ` : Nt}`;
615
+ ` : Ot}`;
612
616
  }
613
617
  };
614
- s.styles = Lt(Ht);
618
+ s.styles = $t(Wt);
615
619
  c([
616
620
  u({ type: String, reflect: !0 }),
617
- Y(Z, zt, w.type)
621
+ Y(Z, qt, w.type)
618
622
  ], s.prototype, "type", 2);
619
623
  c([
620
624
  u({ type: String })
@@ -657,7 +661,7 @@ c([
657
661
  ], s.prototype, "assistiveText", 2);
658
662
  c([
659
663
  u({ type: String }),
660
- Y(Z, Wt, w.status)
664
+ Y(Z, Bt, w.status)
661
665
  ], s.prototype, "status", 2);
662
666
  c([
663
667
  u({ type: Number })
@@ -670,25 +674,25 @@ c([
670
674
  ], s.prototype, "max", 2);
671
675
  c([
672
676
  u({ type: String }),
673
- Y(Z, qt, w.size)
677
+ Y(Z, Ut, w.size)
674
678
  ], s.prototype, "size", 2);
675
679
  c([
676
680
  u({ type: Boolean })
677
681
  ], s.prototype, "required", 2);
678
682
  c([
679
- ht("input")
683
+ vt("input")
680
684
  ], s.prototype, "input", 2);
681
685
  c([
682
- ht("input")
686
+ vt("input")
683
687
  ], s.prototype, "focusTarget", 2);
684
688
  s = c([
685
- _t("pie-text-input")
689
+ zt("pie-text-input")
686
690
  ], s);
687
691
  export {
688
692
  s as PieTextInput,
689
693
  w as defaultProps,
690
- te as inputModes,
691
- qt as sizes,
692
- Wt as statusTypes,
693
- zt as types
694
+ ie as inputModes,
695
+ Ut as sizes,
696
+ Bt as statusTypes,
697
+ qt as types
694
698
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@justeattakeaway/pie-text-input",
3
3
  "description": "PIE Design System Input built using Web Components",
4
- "version": "0.29.25",
4
+ "version": "0.29.27",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "https://github.com/justeattakeaway/pie",
@@ -45,15 +45,15 @@
45
45
  "devDependencies": {
46
46
  "@custom-elements-manifest/analyzer": "0.9.0",
47
47
  "@justeattakeaway/pie-components-config": "0.21.0",
48
- "@justeattakeaway/pie-css": "1.0.0",
49
- "@justeattakeaway/pie-icons-webc": "1.21.2",
50
- "@justeattakeaway/pie-monorepo-utils": "0.7.0",
48
+ "@justeattakeaway/pie-css": "1.1.0",
49
+ "@justeattakeaway/pie-icons-webc": "1.21.4",
50
+ "@justeattakeaway/pie-monorepo-utils": "0.9.0",
51
51
  "@justeattakeaway/pie-wrapper-react": "0.14.4",
52
52
  "cem-plugin-module-file-extensions": "0.0.5"
53
53
  },
54
54
  "dependencies": {
55
- "@justeattakeaway/pie-assistive-text": "0.11.23",
56
- "@justeattakeaway/pie-webc-core": "13.0.0",
55
+ "@justeattakeaway/pie-assistive-text": "0.11.25",
56
+ "@justeattakeaway/pie-webc-core": "14.0.1",
57
57
  "element-internals-polyfill": "1.3.11"
58
58
  },
59
59
  "volta": {