@justeattakeaway/pie-button
Advanced tools
Comparing version 1.0.0 to 1.1.0
@@ -1,2 +0,2 @@ | ||
import { LitElement as At, html as M, nothing as F, unsafeCSS as It } from "lit"; | ||
import { LitElement as At, html as z, nothing as F, unsafeCSS as It } from "lit"; | ||
import { classMap as vt } from "lit/directives/class-map.js"; | ||
@@ -9,3 +9,3 @@ import { ifDefined as K } from "lit/directives/if-defined.js"; | ||
(function(k) { | ||
const a = /* @__PURE__ */ new WeakMap(), r = /* @__PURE__ */ new WeakMap(), b = /* @__PURE__ */ new WeakMap(), c = /* @__PURE__ */ new WeakMap(), m = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new WeakMap(), S = /* @__PURE__ */ new WeakMap(), E = /* @__PURE__ */ new WeakMap(), j = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new WeakMap(), q = /* @__PURE__ */ new WeakMap(), G = /* @__PURE__ */ new WeakMap(), J = /* @__PURE__ */ new WeakMap(), Q = /* @__PURE__ */ new WeakMap(), L = /* @__PURE__ */ new WeakMap(), T = { | ||
const a = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap(), b = /* @__PURE__ */ new WeakMap(), d = /* @__PURE__ */ new WeakMap(), h = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new WeakMap(), M = /* @__PURE__ */ new WeakMap(), E = /* @__PURE__ */ new WeakMap(), j = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new WeakMap(), q = /* @__PURE__ */ new WeakMap(), G = /* @__PURE__ */ new WeakMap(), J = /* @__PURE__ */ new WeakMap(), Q = /* @__PURE__ */ new WeakMap(), L = /* @__PURE__ */ new WeakMap(), T = { | ||
ariaAtomic: "aria-atomic", | ||
@@ -53,7 +53,7 @@ ariaAutoComplete: "aria-autocomplete", | ||
role: "role" | ||
}, ht = (e, t) => { | ||
}, pt = (e, t) => { | ||
for (let o in T) { | ||
t[o] = null; | ||
let i = null; | ||
const n = T[o]; | ||
const r = T[o]; | ||
Object.defineProperty(t, o, { | ||
@@ -64,3 +64,3 @@ get() { | ||
set(s) { | ||
i = s, e.isConnected ? e.setAttribute(n, s) : I.set(e, t); | ||
i = s, e.isConnected ? e.setAttribute(r, s) : I.set(e, t); | ||
} | ||
@@ -71,3 +71,3 @@ }); | ||
function X(e) { | ||
const t = c.get(e), { form: o } = t; | ||
const t = d.get(e), { form: o } = t; | ||
it(e, o, t), ot(e, t.labels); | ||
@@ -78,9 +78,9 @@ } | ||
acceptNode(s) { | ||
return c.has(s) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP; | ||
return d.has(s) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP; | ||
} | ||
}); | ||
let i = o.nextNode(); | ||
const n = !t || e.disabled; | ||
const r = !t || e.disabled; | ||
for (; i; ) | ||
i.formDisabledCallback && n && $(i, e.disabled), i = o.nextNode(); | ||
i.formDisabledCallback && r && $(i, e.disabled), i = o.nextNode(); | ||
}, Z = { attributes: !0, attributeFilter: ["disabled", "name"] }, V = O() ? new MutationObserver((e) => { | ||
@@ -90,4 +90,4 @@ for (const t of e) { | ||
if (t.attributeName === "disabled" && (o.constructor.formAssociated ? $(o, o.hasAttribute("disabled")) : o.localName === "fieldset" && Y(o)), t.attributeName === "name" && o.constructor.formAssociated) { | ||
const i = c.get(o), n = j.get(o); | ||
i.setFormValue(n); | ||
const i = d.get(o), r = j.get(o); | ||
i.setFormValue(r); | ||
} | ||
@@ -98,44 +98,44 @@ } | ||
e.forEach((t) => { | ||
const { addedNodes: o, removedNodes: i } = t, n = Array.from(o), s = Array.from(i); | ||
n.forEach((l) => { | ||
const { addedNodes: o, removedNodes: i } = t, r = Array.from(o), s = Array.from(i); | ||
r.forEach((l) => { | ||
var u; | ||
if (c.has(l) && l.constructor.formAssociated && X(l), I.has(l)) { | ||
const p = I.get(l); | ||
Object.keys(T).filter((g) => p[g] !== null).forEach((g) => { | ||
l.setAttribute(T[g], p[g]); | ||
if (d.has(l) && l.constructor.formAssociated && X(l), I.has(l)) { | ||
const m = I.get(l); | ||
Object.keys(T).filter((g) => m[g] !== null).forEach((g) => { | ||
l.setAttribute(T[g], m[g]); | ||
}), I.delete(l); | ||
} | ||
if (L.has(l)) { | ||
const p = L.get(l); | ||
l.setAttribute("internals-valid", p.validity.valid.toString()), l.setAttribute("internals-invalid", (!p.validity.valid).toString()), l.setAttribute("aria-invalid", (!p.validity.valid).toString()), L.delete(l); | ||
const m = L.get(l); | ||
l.setAttribute("internals-valid", m.validity.valid.toString()), l.setAttribute("internals-invalid", (!m.validity.valid).toString()), l.setAttribute("aria-invalid", (!m.validity.valid).toString()), L.delete(l); | ||
} | ||
if (l.localName === "form") { | ||
const p = E.get(l), x = document.createTreeWalker(l, NodeFilter.SHOW_ELEMENT, { | ||
const m = E.get(l), w = document.createTreeWalker(l, NodeFilter.SHOW_ELEMENT, { | ||
acceptNode(B) { | ||
return c.has(B) && B.constructor.formAssociated && !(p && p.has(B)) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP; | ||
return d.has(B) && B.constructor.formAssociated && !(m && m.has(B)) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP; | ||
} | ||
}); | ||
let g = x.nextNode(); | ||
let g = w.nextNode(); | ||
for (; g; ) | ||
X(g), g = x.nextNode(); | ||
X(g), g = w.nextNode(); | ||
} | ||
l.localName === "fieldset" && ((u = V.observe) === null || u === void 0 || u.call(V, l, Z), Y(l, !0)); | ||
}), s.forEach((l) => { | ||
const u = c.get(l); | ||
u && b.get(u) && tt(u), S.has(l) && S.get(l).disconnect(); | ||
const u = d.get(l); | ||
u && b.get(u) && tt(u), M.has(l) && M.get(l).disconnect(); | ||
}); | ||
}); | ||
} | ||
function pt(e) { | ||
function mt(e) { | ||
e.forEach((t) => { | ||
const { removedNodes: o } = t; | ||
o.forEach((i) => { | ||
const n = J.get(t.target); | ||
c.has(i) && nt(i), n.disconnect(); | ||
const r = J.get(t.target); | ||
d.has(i) && rt(i), r.disconnect(); | ||
}); | ||
}); | ||
} | ||
const mt = (e) => { | ||
const ht = (e) => { | ||
var t, o; | ||
const i = new MutationObserver(pt); | ||
const i = new MutationObserver(mt); | ||
!((t = window == null ? void 0 : window.ShadyDOM) === null || t === void 0) && t.inUse && e.mode && e.host && (e = e.host), (o = i.observe) === null || o === void 0 || o.call(i, e, { childList: !0 }), J.set(e, i); | ||
@@ -166,4 +166,4 @@ }; | ||
}, N = (e) => { | ||
const t = Array.from(e.elements).filter((s) => !s.tagName.includes("-") && s.validity).map((s) => s.validity.valid), o = E.get(e) || [], i = Array.from(o).filter((s) => s.isConnected).map((s) => c.get(s).validity.valid), n = [...t, ...i].includes(!1); | ||
e.toggleAttribute("internals-invalid", n), e.toggleAttribute("internals-valid", !n); | ||
const t = Array.from(e.elements).filter((s) => !s.tagName.includes("-") && s.validity).map((s) => s.validity.valid), o = E.get(e) || [], i = Array.from(o).filter((s) => s.isConnected).map((s) => d.get(s).validity.valid), r = [...t, ...i].includes(!1); | ||
e.toggleAttribute("internals-invalid", r), e.toggleAttribute("internals-valid", !r); | ||
}, ft = (e) => { | ||
@@ -177,9 +177,9 @@ N(P(e.target)); | ||
if (o.target.closest(t)) { | ||
const n = E.get(e); | ||
const r = E.get(e); | ||
if (e.noValidate) | ||
return; | ||
n.size && Array.from(n).reverse().map((u) => c.get(u).reportValidity()).includes(!1) && o.preventDefault(); | ||
r.size && Array.from(r).reverse().map((u) => d.get(u).reportValidity()).includes(!1) && o.preventDefault(); | ||
} | ||
}); | ||
}, wt = (e) => { | ||
}, xt = (e) => { | ||
const t = E.get(e.target); | ||
@@ -195,4 +195,4 @@ t && t.size && t.forEach((o) => { | ||
else { | ||
const n = /* @__PURE__ */ new Set(); | ||
n.add(e), E.set(t, n), yt(t), t.addEventListener("reset", wt), t.addEventListener("input", ft), t.addEventListener("change", gt); | ||
const r = /* @__PURE__ */ new Set(); | ||
r.add(e), E.set(t, r), yt(t), t.addEventListener("reset", xt), t.addEventListener("input", ft), t.addEventListener("change", gt); | ||
} | ||
@@ -206,13 +206,13 @@ y.set(t, { ref: e, internals: o }), e.constructor.formAssociated && e.formAssociatedCallback && setTimeout(() => { | ||
return t && t.tagName !== "FORM" && (t = P(t)), t; | ||
}, w = (e, t, o = DOMException) => { | ||
}, x = (e, t, o = DOMException) => { | ||
if (!e.constructor.formAssociated) | ||
throw new o(t); | ||
}, rt = (e, t, o) => { | ||
}, nt = (e, t, o) => { | ||
const i = E.get(e); | ||
return i && i.size && i.forEach((n) => { | ||
c.get(n)[o]() || (t = !1); | ||
return i && i.size && i.forEach((r) => { | ||
d.get(r)[o]() || (t = !1); | ||
}), t; | ||
}, nt = (e) => { | ||
}, rt = (e) => { | ||
if (e.constructor.formAssociated) { | ||
const t = c.get(e), { labels: o, form: i } = t; | ||
const t = d.get(e), { labels: o, form: i } = t; | ||
ot(e, o), it(e, i, t); | ||
@@ -224,3 +224,3 @@ } | ||
} | ||
class xt { | ||
class wt { | ||
constructor() { | ||
@@ -230,3 +230,3 @@ 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); | ||
} | ||
const Et = (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, o) => (e.valid = Mt(t), Object.keys(t).forEach((i) => e[i] = t[i]), o && N(o), e), Mt = (e) => { | ||
const Et = (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, o) => (e.valid = zt(t), Object.keys(t).forEach((i) => e[i] = t[i]), o && N(o), e), zt = (e) => { | ||
let t = !0; | ||
@@ -252,5 +252,5 @@ for (let o in e) | ||
throw new DOMException(`Failed to execute 'add' on 'CustomStateSet': The specified value ${t} must start with '--'.`); | ||
const o = super.add(t), i = D.get(this), n = `state${t}`; | ||
return i.isConnected ? at(i, n) : setTimeout(() => { | ||
at(i, n); | ||
const o = super.add(t), i = D.get(this), r = `state${t}`; | ||
return i.isConnected ? at(i, r) : setTimeout(() => { | ||
at(i, r); | ||
}), o; | ||
@@ -275,10 +275,10 @@ } | ||
} | ||
function St(e, t, o, i, n) { | ||
if (typeof t == "function" ? e !== t || !n : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it"); | ||
function Mt(e, t, o, i, r) { | ||
if (typeof t == "function" ? e !== t || !r : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it"); | ||
return t.set(e, o), o; | ||
} | ||
var z; | ||
class Ct { | ||
var C; | ||
class St { | ||
constructor(t) { | ||
z.set(this, void 0), St(this, z, t); | ||
C.set(this, void 0), Mt(this, C, t); | ||
for (let o = 0; o < t.length; o++) { | ||
@@ -291,6 +291,6 @@ let i = t[o]; | ||
get length() { | ||
return st(this, z, "f").length; | ||
return st(this, C, "f").length; | ||
} | ||
[(z = /* @__PURE__ */ new WeakMap(), Symbol.iterator)]() { | ||
return st(this, z, "f")[Symbol.iterator](); | ||
[(C = /* @__PURE__ */ new WeakMap(), Symbol.iterator)]() { | ||
return st(this, C, "f")[Symbol.iterator](); | ||
} | ||
@@ -304,3 +304,3 @@ item(t) { | ||
} | ||
function zt() { | ||
function Ct() { | ||
const e = HTMLFormElement.prototype.checkValidity; | ||
@@ -312,16 +312,16 @@ HTMLFormElement.prototype.checkValidity = o; | ||
let l = e.apply(this, s); | ||
return rt(this, l, "checkValidity"); | ||
return nt(this, l, "checkValidity"); | ||
} | ||
function i(...s) { | ||
let l = t.apply(this, s); | ||
return rt(this, l, "reportValidity"); | ||
return nt(this, l, "reportValidity"); | ||
} | ||
const { get: n } = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "elements"); | ||
const { get: r } = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "elements"); | ||
Object.defineProperty(HTMLFormElement.prototype, "elements", { | ||
get(...s) { | ||
const l = n.call(this, ...s), u = Array.from(E.get(this) || []); | ||
const l = r.call(this, ...s), u = Array.from(E.get(this) || []); | ||
if (u.length === 0) | ||
return l; | ||
const p = Array.from(l).concat(u).sort((x, g) => x.compareDocumentPosition ? x.compareDocumentPosition(g) & 2 ? 1 : -1 : 0); | ||
return new Ct(p); | ||
const m = Array.from(l).concat(u).sort((w, g) => w.compareDocumentPosition ? w.compareDocumentPosition(g) & 2 ? 1 : -1 : 0); | ||
return new St(m); | ||
} | ||
@@ -337,10 +337,10 @@ }); | ||
throw new TypeError("Illegal constructor"); | ||
const o = t.getRootNode(), i = new xt(); | ||
this.states = new W(t), a.set(this, t), r.set(this, i), c.set(t, this), ht(t, this), ut(t, this), Object.seal(this), o instanceof DocumentFragment && mt(o); | ||
const o = t.getRootNode(), i = new wt(); | ||
this.states = new W(t), a.set(this, t), n.set(this, i), d.set(t, this), pt(t, this), ut(t, this), Object.seal(this), o instanceof DocumentFragment && ht(o); | ||
} | ||
checkValidity() { | ||
const t = a.get(this); | ||
if (w(t, "Failed to execute 'checkValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate) | ||
if (x(t, "Failed to execute 'checkValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate) | ||
return !0; | ||
const o = r.get(this); | ||
const o = n.get(this); | ||
if (!o.valid) { | ||
@@ -358,3 +358,3 @@ const i = new Event("invalid", { | ||
const t = a.get(this); | ||
w(t, "Failed to read the 'form' property from 'ElementInternals': The target element is not a form-associated custom element."); | ||
x(t, "Failed to read the 'form' property from 'ElementInternals': The target element is not a form-associated custom element."); | ||
let o; | ||
@@ -365,3 +365,3 @@ return t.constructor.formAssociated === !0 && (o = P(t)), o; | ||
const t = a.get(this); | ||
w(t, "Failed to read the 'labels' property from 'ElementInternals': The target element is not a form-associated custom element."); | ||
x(t, "Failed to read the 'labels' property from 'ElementInternals': The target element is not a form-associated custom element."); | ||
const o = t.getAttribute("id"), i = t.getRootNode(); | ||
@@ -372,3 +372,3 @@ return i && o ? i.querySelectorAll(`[for="${o}"]`) : []; | ||
const t = a.get(this); | ||
if (w(t, "Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate) | ||
if (x(t, "Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate) | ||
return !0; | ||
@@ -382,3 +382,3 @@ const o = this.checkValidity(), i = G.get(this); | ||
const o = a.get(this); | ||
if (w(o, "Failed to execute 'setFormValue' on 'ElementInternals': The target element is not a form-associated custom element."), tt(this), t != null && !(t instanceof FormData)) { | ||
if (x(o, "Failed to execute 'setFormValue' on 'ElementInternals': The target element is not a form-associated custom element."), tt(this), t != null && !(t instanceof FormData)) { | ||
if (o.getAttribute("name")) { | ||
@@ -388,6 +388,6 @@ const i = et(o, this); | ||
} | ||
} else t != null && t instanceof FormData && Array.from(t).reverse().forEach(([i, n]) => { | ||
if (typeof n == "string") { | ||
} else t != null && t instanceof FormData && Array.from(t).reverse().forEach(([i, r]) => { | ||
if (typeof r == "string") { | ||
const s = et(o, this); | ||
s.name = i, s.value = n; | ||
s.name = i, s.value = r; | ||
} | ||
@@ -398,16 +398,16 @@ }); | ||
setValidity(t, o, i) { | ||
const n = a.get(this); | ||
if (w(n, "Failed to execute 'setValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !t) | ||
const r = a.get(this); | ||
if (x(r, "Failed to execute 'setValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !t) | ||
throw new TypeError("Failed to execute 'setValidity' on 'ElementInternals': 1 argument required, but only 0 present."); | ||
G.set(this, i); | ||
const s = r.get(this), l = {}; | ||
for (const x in t) | ||
l[x] = t[x]; | ||
const s = n.get(this), l = {}; | ||
for (const w in t) | ||
l[w] = t[w]; | ||
Object.keys(l).length === 0 && Et(s); | ||
const u = Object.assign(Object.assign({}, s), l); | ||
delete u.valid; | ||
const { valid: p } = kt(s, u, this.form); | ||
if (!p && !o) | ||
const { valid: m } = kt(s, u, this.form); | ||
if (!m && !o) | ||
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."); | ||
m.set(this, p ? "" : o), n.isConnected ? (n.toggleAttribute("internals-invalid", !p), n.toggleAttribute("internals-valid", p), n.setAttribute("aria-invalid", `${!p}`)) : L.set(n, this); | ||
h.set(this, m ? "" : o), r.isConnected ? (r.toggleAttribute("internals-invalid", !m), r.toggleAttribute("internals-valid", m), r.setAttribute("aria-invalid", `${!m}`)) : L.set(r, this); | ||
} | ||
@@ -420,11 +420,11 @@ get shadowRoot() { | ||
const t = a.get(this); | ||
return w(t, "Failed to read the 'validationMessage' property from 'ElementInternals': The target element is not a form-associated custom element."), m.get(this); | ||
return x(t, "Failed to read the 'validationMessage' property from 'ElementInternals': The target element is not a form-associated custom element."), h.get(this); | ||
} | ||
get validity() { | ||
const t = a.get(this); | ||
return w(t, "Failed to read the 'validity' property from 'ElementInternals': The target element is not a form-associated custom element."), r.get(this); | ||
return x(t, "Failed to read the 'validity' property from 'ElementInternals': The target element is not a form-associated custom element."), n.get(this); | ||
} | ||
get willValidate() { | ||
const t = a.get(this); | ||
return w(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")); | ||
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")); | ||
} | ||
@@ -456,5 +456,5 @@ } | ||
} | ||
let ct = !1, dt = !1; | ||
let dt = !1, ct = !1; | ||
function H(e) { | ||
dt || (dt = !0, window.CustomStateSet = W, e && (HTMLElement.prototype.attachInternals = function(...t) { | ||
ct || (ct = !0, window.CustomStateSet = W, e && (HTMLElement.prototype.attachInternals = function(...t) { | ||
const o = e.call(this, t); | ||
@@ -465,13 +465,13 @@ return o.states = new W(this), o; | ||
function bt(e = !0) { | ||
if (!ct) { | ||
if (ct = !0, typeof window < "u" && (window.ElementInternals = lt), typeof CustomElementRegistry < "u") { | ||
if (!dt) { | ||
if (dt = !0, typeof window < "u" && (window.ElementInternals = lt), typeof CustomElementRegistry < "u") { | ||
const t = CustomElementRegistry.prototype.define; | ||
CustomElementRegistry.prototype.define = function(o, i, n) { | ||
CustomElementRegistry.prototype.define = function(o, i, r) { | ||
if (i.formAssociated) { | ||
const s = i.prototype.connectedCallback; | ||
i.prototype.connectedCallback = function() { | ||
Q.has(this) || (Q.set(this, !0), this.hasAttribute("disabled") && $(this, !0)), s != null && s.apply(this), nt(this); | ||
Q.has(this) || (Q.set(this, !0), this.hasAttribute("disabled") && $(this, !0)), s != null && s.apply(this), rt(this); | ||
}; | ||
} | ||
t.call(this, o, i, n); | ||
t.call(this, o, i, r); | ||
}; | ||
@@ -484,3 +484,3 @@ } | ||
} else return {}; | ||
if (c.has(this)) | ||
if (d.has(this)) | ||
throw new DOMException("DOMException: Failed to execute 'attachInternals' on 'HTMLElement': ElementInternals for the specified element was already attached."); | ||
@@ -490,8 +490,8 @@ return new lt(this); | ||
let t = function(...i) { | ||
const n = o.apply(this, i); | ||
if (q.set(this, n), O()) { | ||
const r = o.apply(this, i); | ||
if (q.set(this, r), O()) { | ||
const s = new MutationObserver(_); | ||
window.ShadyDOM ? s.observe(this, R) : s.observe(n, R), S.set(this, s); | ||
window.ShadyDOM ? s.observe(this, R) : s.observe(r, R), M.set(this, s); | ||
} | ||
return n; | ||
return r; | ||
}; | ||
@@ -501,3 +501,3 @@ const o = Element.prototype.attachShadow; | ||
} | ||
O() && typeof document < "u" && new MutationObserver(_).observe(document.documentElement, R), typeof HTMLFormElement < "u" && zt(), (e || typeof window < "u" && !window.CustomStateSet) && H(); | ||
O() && typeof document < "u" && new MutationObserver(_).observe(document.documentElement, R), typeof HTMLFormElement < "u" && Ct(), (e || typeof window < "u" && !window.CustomStateSet) && H(); | ||
} | ||
@@ -528,9 +528,9 @@ } | ||
isResponsive: !1 | ||
}, Rt = "*,*:after,*:before{box-sizing:inherit}.o-btn{--btn-border-radius: var(--dt-radius-rounded-e);--btn-font-family: var(--dt-font-interactive-l-family);--btn-font-weight: var(--dt-font-interactive-l-weight);--btn-bg-color: var(--dt-color-interactive-brand);--btn-text-color: var(--dt-color-content-interactive-primary);--btn-height--xsmall: 32px;--btn-height--small: 40px;--btn-height--medium: 48px;--btn-height--large: 56px;--icon-display-override: block;position:relative;display:inline-flex;gap:var(--dt-spacing-b);align-items:center;justify-content:center;height:var(--btn-height);padding:var(--btn-padding);border:none;border-radius:var(--btn-border-radius);outline:none;background-color:var(--btn-bg-color);font-family:var(--btn-font-family);font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);color:var(--btn-text-color);line-height:var(--btn-line-height);cursor:pointer;-webkit-user-select:none;user-select:none;text-decoration:none;inline-size:var(--btn-inline-size)}.o-btn.o-btn--primary:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--hover-modifier)))}.o-btn.o-btn--primary:active:not(:disabled),.o-btn.o-btn--primary.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--active-modifier)))}.o-btn.o-btn--primary.o-btn--xsmall,.o-btn.o-btn--primary.o-btn--small-productive{--btn-bg-color: var(--dt-color-interactive-primary)}.o-btn.o-btn--primary.o-btn--xsmall:hover:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive:hover:not(:disabled){--hover-modifier: var(--dt-color-hover-02);--btn-bg-color: hsl(var(--dt-color-interactive-primary-h), var(--dt-color-interactive-primary-s), calc(var(--dt-color-interactive-primary-l) + var(--hover-modifier)))}.o-btn.o-btn--primary.o-btn--xsmall:active:not(:disabled),.o-btn.o-btn--primary.o-btn--xsmall.is-loading:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive:active:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.is-loading:not(:disabled){--active-modifier: var(--dt-color-active-02);--btn-bg-color: hsl(var(--dt-color-interactive-primary-h), var(--dt-color-interactive-primary-s), calc(var(--dt-color-interactive-primary-l) + var(--active-modifier)))}@media (min-width: 769px){.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive,.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive{--btn-bg-color: var(--dt-color-interactive-brand)}.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive:hover:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--hover-modifier)))}.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive:active:not(:disabled),.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive.is-loading:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive:active:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--active-modifier)))}}.o-btn.o-btn--secondary{--btn-bg-color: var(--dt-color-interactive-secondary);--btn-text-color: var(--dt-color-content-interactive-secondary)}.o-btn.o-btn--secondary:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-secondary-h), var(--dt-color-interactive-secondary-s), calc(var(--dt-color-interactive-secondary-l) + var(--hover-modifier)))}.o-btn.o-btn--secondary:active:not(:disabled),.o-btn.o-btn--secondary.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-secondary-h), var(--dt-color-interactive-secondary-s), calc(var(--dt-color-interactive-secondary-l) + var(--active-modifier)))}.o-btn.o-btn--outline{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-interactive-secondary);border:1px solid var(--dt-color-border-strong)}.o-btn.o-btn--outline:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--hover-modifier))}.o-btn.o-btn--outline:active:not(:disabled),.o-btn.o-btn--outline.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--active-modifier))}.o-btn.o-btn--ghost{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-link)}.o-btn.o-btn--ghost:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--hover-modifier))}.o-btn.o-btn--ghost:active:not(:disabled),.o-btn.o-btn--ghost.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--active-modifier))}.o-btn.o-btn--inverse{--btn-bg-color: var(--dt-color-interactive-inverse);--btn-text-color: var(--dt-color-content-interactive-secondary)}.o-btn.o-btn--inverse:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-inverse-h), var(--dt-color-interactive-inverse-s), calc(var(--dt-color-interactive-inverse-l) + var(--hover-modifier)))}.o-btn.o-btn--inverse:active:not(:disabled),.o-btn.o-btn--inverse.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-inverse-h), var(--dt-color-interactive-inverse-s), calc(var(--dt-color-interactive-inverse-l) + var(--active-modifier)))}.o-btn.o-btn--ghost-inverse,.o-btn.o-btn--outline-inverse{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-interactive-primary)}.o-btn.o-btn--ghost-inverse:hover:not(:disabled),.o-btn.o-btn--outline-inverse:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), var(--dt-color-container-default-l), var(--hover-modifier))}.o-btn.o-btn--ghost-inverse:active:not(:disabled),.o-btn.o-btn--ghost-inverse.is-loading:not(:disabled),.o-btn.o-btn--outline-inverse:active:not(:disabled),.o-btn.o-btn--outline-inverse.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), var(--dt-color-container-default-l), var(--active-modifier))}.o-btn.o-btn--outline-inverse:not([disabled]){border:1px solid var(--dt-color-border-strong)}.o-btn.o-btn--destructive{--btn-bg-color: var(--dt-color-support-error)}.o-btn.o-btn--destructive:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-support-error-h), var(--dt-color-support-error-s), calc(var(--dt-color-support-error-l) + var(--hover-modifier)))}.o-btn.o-btn--destructive:active:not(:disabled),.o-btn.o-btn--destructive.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-support-error-h), var(--dt-color-support-error-s), calc(var(--dt-color-support-error-l) + var(--active-modifier)))}.o-btn.o-btn--destructive-ghost{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-interactive-error)}.o-btn.o-btn--destructive-ghost:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--hover-modifier))}.o-btn.o-btn--destructive-ghost:active:not(:disabled),.o-btn.o-btn--destructive-ghost.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--active-modifier))}.o-btn.o-btn--xsmall{--btn-height: var(--btn-height--xsmall);--btn-padding: 6px var(--dt-spacing-b);--btn-font-size: calc(var(--dt-font-size-14) * 1px);--btn-line-height: calc(var(--dt-font-size-14-line-height) * 1px);--icon-size-override: 16px}@media (min-width: 769px){.o-btn.o-btn--xsmall.o-btn--responsive{--btn-height: var(--btn-height--small);--btn-padding: 8px var(--dt-spacing-d);--btn-font-size: calc(var(--dt-font-size-16) * 1px);--btn-line-height: calc(var(--dt-font-size-16-line-height) * 1px);--icon-size-override: 20px}.o-btn.o-btn--xsmall.o-btn--responsive.o-btn--expressive{--btn-height: var(--btn-height--small);--btn-padding: 6px var(--dt-spacing-d);--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 20px}}.o-btn.o-btn--small-expressive{--btn-height: var(--btn-height--small);--btn-padding: 6px var(--dt-spacing-d);--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 20px}@media (min-width: 769px){.o-btn.o-btn--small-expressive.o-btn--responsive{--btn-height: var(--btn-height--medium);--btn-padding: 10px var(--dt-spacing-e);--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px}}.o-btn.o-btn--small-productive{--btn-height: var(--btn-height--small);--btn-padding: 8px var(--dt-spacing-d);--btn-font-size: calc(var(--dt-font-size-16) * 1px);--btn-line-height: calc(var(--dt-font-size-16-line-height) * 1px);--icon-size-override: 20px}@media (min-width: 769px){.o-btn.o-btn--small-productive.o-btn--responsive{--btn-height: var(--btn-height--medium);--btn-padding: 10px var(--dt-spacing-e);--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px}}.o-btn.o-btn--medium{--btn-height: var(--btn-height--medium);--btn-padding: 10px var(--dt-spacing-e);--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px}@media (min-width: 769px){.o-btn.o-btn--medium.o-btn--responsive{--btn-height: var(--btn-height--large);--btn-padding: 14px var(--dt-spacing-e);--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px}}.o-btn.o-btn--large{--btn-height: var(--btn-height--large);--btn-padding: 14px var(--dt-spacing-e);--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px}.o-btn.o-btn--fullWidth{--btn-inline-size: 100%}.o-btn[disabled]{--btn-text-color: var(--dt-color-content-disabled) !important;cursor:not-allowed}.o-btn[disabled]:not(.o-btn--ghost,.o-btn--ghost-inverse,.o-btn--destructive-ghost){--btn-bg-color: var(--dt-color-disabled-01) !important}.o-btn[disabled].o-btn--outline{border-color:var(--dt-color-disabled-01)!important}.o-btn.is-loading>*:not(pie-spinner){visibility:hidden}.o-btn.is-loading pie-spinner{position:absolute}.o-btn:focus-visible{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}::slotted(svg){height:var(--icon-size-override);width:var(--icon-size-override)}"; | ||
var $t = Object.defineProperty, h = (k, a, r, b) => { | ||
for (var c = void 0, m = k.length - 1, y; m >= 0; m--) | ||
(y = k[m]) && (c = y(a, r, c) || c); | ||
return c && $t(a, r, c), c; | ||
}, Rt = "*,*:after,*:before{box-sizing:inherit}.o-btn{--btn-border-radius: var(--dt-radius-rounded-e);--btn-font-family: var(--dt-font-interactive-l-family);--btn-font-weight: var(--dt-font-interactive-l-weight);--btn-bg-color: var(--dt-color-interactive-brand);--btn-text-color: var(--dt-color-content-interactive-primary);--icon-display-override: block;--btn-padding-vertical-xsmall: 6px;--btn-padding-vertical-small: 8px;--btn-padding-vertical-medium: 10px;--btn-padding-vertical-large: 14px;--btn-padding-horizontal-small: var(--dt-spacing-b);--btn-padding-horizontal-medium: var(--dt-spacing-d);--btn-padding-horizontal-large: var(--dt-spacing-e);position:relative;display:inline-flex;gap:var(--dt-spacing-b);align-items:center;justify-content:center;border:none;border-radius:var(--btn-border-radius);outline:none;background-color:var(--btn-bg-color);font-family:var(--btn-font-family);font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);color:var(--btn-text-color);line-height:var(--btn-line-height);cursor:pointer;-webkit-user-select:none;user-select:none;text-decoration:none;inline-size:var(--btn-inline-size)}.o-btn.o-btn--primary:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--hover-modifier)))}.o-btn.o-btn--primary:active:not(:disabled),.o-btn.o-btn--primary.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--active-modifier)))}.o-btn.o-btn--primary.o-btn--xsmall,.o-btn.o-btn--primary.o-btn--small-productive{--btn-bg-color: var(--dt-color-interactive-primary)}.o-btn.o-btn--primary.o-btn--xsmall:hover:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive:hover:not(:disabled){--hover-modifier: var(--dt-color-hover-02);--btn-bg-color: hsl(var(--dt-color-interactive-primary-h), var(--dt-color-interactive-primary-s), calc(var(--dt-color-interactive-primary-l) + var(--hover-modifier)))}.o-btn.o-btn--primary.o-btn--xsmall:active:not(:disabled),.o-btn.o-btn--primary.o-btn--xsmall.is-loading:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive:active:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.is-loading:not(:disabled){--active-modifier: var(--dt-color-active-02);--btn-bg-color: hsl(var(--dt-color-interactive-primary-h), var(--dt-color-interactive-primary-s), calc(var(--dt-color-interactive-primary-l) + var(--active-modifier)))}@media (min-width: 769px){.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive,.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive{--btn-bg-color: var(--dt-color-interactive-brand)}.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive:hover:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--hover-modifier)))}.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive:active:not(:disabled),.o-btn.o-btn--primary.o-btn--xsmall.o-btn--expressive.o-btn--responsive.is-loading:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive:active:not(:disabled),.o-btn.o-btn--primary.o-btn--small-productive.o-btn--responsive.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-brand-h), var(--dt-color-interactive-brand-s), calc(var(--dt-color-interactive-brand-l) + var(--active-modifier)))}}.o-btn.o-btn--secondary{--btn-bg-color: var(--dt-color-interactive-secondary);--btn-text-color: var(--dt-color-content-interactive-secondary)}.o-btn.o-btn--secondary:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-secondary-h), var(--dt-color-interactive-secondary-s), calc(var(--dt-color-interactive-secondary-l) + var(--hover-modifier)))}.o-btn.o-btn--secondary:active:not(:disabled),.o-btn.o-btn--secondary.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-secondary-h), var(--dt-color-interactive-secondary-s), calc(var(--dt-color-interactive-secondary-l) + var(--active-modifier)))}.o-btn.o-btn--outline{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-interactive-secondary);border:1px solid var(--dt-color-border-strong)}.o-btn.o-btn--outline:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--hover-modifier))}.o-btn.o-btn--outline:active:not(:disabled),.o-btn.o-btn--outline.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--active-modifier))}.o-btn.o-btn--ghost{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-link)}.o-btn.o-btn--ghost:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--hover-modifier))}.o-btn.o-btn--ghost:active:not(:disabled),.o-btn.o-btn--ghost.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--active-modifier))}.o-btn.o-btn--inverse{--btn-bg-color: var(--dt-color-interactive-inverse);--btn-text-color: var(--dt-color-content-interactive-secondary)}.o-btn.o-btn--inverse:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-interactive-inverse-h), var(--dt-color-interactive-inverse-s), calc(var(--dt-color-interactive-inverse-l) + var(--hover-modifier)))}.o-btn.o-btn--inverse:active:not(:disabled),.o-btn.o-btn--inverse.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-interactive-inverse-h), var(--dt-color-interactive-inverse-s), calc(var(--dt-color-interactive-inverse-l) + var(--active-modifier)))}.o-btn.o-btn--ghost-inverse,.o-btn.o-btn--outline-inverse{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-interactive-primary)}.o-btn.o-btn--ghost-inverse:hover:not(:disabled),.o-btn.o-btn--outline-inverse:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), var(--dt-color-container-default-l), var(--hover-modifier))}.o-btn.o-btn--ghost-inverse:active:not(:disabled),.o-btn.o-btn--ghost-inverse.is-loading:not(:disabled),.o-btn.o-btn--outline-inverse:active:not(:disabled),.o-btn.o-btn--outline-inverse.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), var(--dt-color-container-default-l), var(--active-modifier))}.o-btn.o-btn--outline-inverse{border:1px solid var(--dt-color-border-strong)}.o-btn.o-btn--destructive{--btn-bg-color: var(--dt-color-support-error)}.o-btn.o-btn--destructive:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--btn-bg-color: hsl(var(--dt-color-support-error-h), var(--dt-color-support-error-s), calc(var(--dt-color-support-error-l) + var(--hover-modifier)))}.o-btn.o-btn--destructive:active:not(:disabled),.o-btn.o-btn--destructive.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--btn-bg-color: hsl(var(--dt-color-support-error-h), var(--dt-color-support-error-s), calc(var(--dt-color-support-error-l) + var(--active-modifier)))}.o-btn.o-btn--destructive-ghost{--btn-bg-color: transparent;--btn-text-color: var(--dt-color-content-interactive-error)}.o-btn.o-btn--destructive-ghost:hover:not(:disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--hover-modifier: var(--dt-color-hover-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--hover-modifier))}.o-btn.o-btn--destructive-ghost:active:not(:disabled),.o-btn.o-btn--destructive-ghost.is-loading:not(:disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--active-modifier: var(--dt-color-active-01);--btn-bg-color: hsl(var(--dt-color-black-h), var(--dt-color-black-s), var(--dt-color-black-l), var(--active-modifier))}.o-btn.o-btn--xsmall{--btn-font-size: calc(var(--dt-font-size-14) * 1px);--btn-line-height: calc(var(--dt-font-size-14-line-height) * 1px);--icon-size-override: 16px;padding:var(--btn-padding-vertical-xsmall) var(--btn-padding-horizontal-small)}@media (min-width: 769px){.o-btn.o-btn--xsmall.o-btn--responsive{--btn-font-size: calc(var(--dt-font-size-16) * 1px);--btn-line-height: calc(var(--dt-font-size-16-line-height) * 1px);--icon-size-override: 20px;padding:var(--btn-padding-vertical-small) var(--btn-padding-horizontal-medium)}.o-btn.o-btn--xsmall.o-btn--responsive.o-btn--expressive{--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 20px;padding:var(--btn-padding-vertical-xsmall) var(--btn-padding-horizontal-medium)}}.o-btn.o-btn--xsmall.o-btn--outline,.o-btn.o-btn--xsmall.o-btn--outline-inverse{padding:calc(var(--btn-padding-vertical-xsmall) - 1px) var(--btn-padding-horizontal-small)}@media (min-width: 769px){.o-btn.o-btn--xsmall.o-btn--outline.o-btn--responsive,.o-btn.o-btn--xsmall.o-btn--outline-inverse.o-btn--responsive{padding:calc(var(--btn-padding-vertical-small) - 1px) var(--btn-padding-horizontal-medium)}.o-btn.o-btn--xsmall.o-btn--outline.o-btn--responsive.o-btn--expressive,.o-btn.o-btn--xsmall.o-btn--outline-inverse.o-btn--responsive.o-btn--expressive{padding:calc(var(--btn-padding-vertical-xsmall) - 1px) var(--btn-padding-horizontal-medium)}}.o-btn.o-btn--small-expressive{--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 20px;padding:var(--btn-padding-vertical-xsmall) var(--btn-padding-horizontal-medium)}@media (min-width: 769px){.o-btn.o-btn--small-expressive.o-btn--responsive{--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px;padding:var(--btn-padding-vertical-medium) var(--btn-padding-horizontal-large)}}.o-btn.o-btn--small-expressive.o-btn--outline,.o-btn.o-btn--small-expressive.o-btn--outline-inverse{padding:calc(var(--btn-padding-vertical-xsmall) - 1px) var(--btn-padding-horizontal-medium)}@media (min-width: 769px){.o-btn.o-btn--small-expressive.o-btn--outline.o-btn--responsive,.o-btn.o-btn--small-expressive.o-btn--outline-inverse.o-btn--responsive{padding:calc(var(--btn-padding-vertical-medium) - 1px) var(--btn-padding-horizontal-large)}}.o-btn.o-btn--small-productive{--btn-font-size: calc(var(--dt-font-size-16) * 1px);--btn-line-height: calc(var(--dt-font-size-16-line-height) * 1px);--icon-size-override: 20px;padding:var(--btn-padding-vertical-small) var(--btn-padding-horizontal-medium)}@media (min-width: 769px){.o-btn.o-btn--small-productive.o-btn--responsive{--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px;padding:var(--btn-padding-vertical-medium) var(--btn-padding-horizontal-large)}}.o-btn.o-btn--small-productive.o-btn--outline,.o-btn.o-btn--small-productive.o-btn--outline-inverse{padding:calc(var(--btn-padding-vertical-small) - 1px) var(--btn-padding-horizontal-medium)}@media (min-width: 769px){.o-btn.o-btn--small-productive.o-btn--outline.o-btn--responsive,.o-btn.o-btn--small-productive.o-btn--outline-inverse.o-btn--responsive{padding:calc(var(--btn-padding-vertical-medium) - 1px) var(--btn-padding-horizontal-large)}}.o-btn.o-btn--medium{--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px;padding:var(--btn-padding-vertical-medium) var(--btn-padding-horizontal-large)}@media (min-width: 769px){.o-btn.o-btn--medium.o-btn--responsive{--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px;padding:var(--btn-padding-vertical-large) var(--btn-padding-horizontal-large)}}.o-btn.o-btn--medium.o-btn--outline,.o-btn.o-btn--medium.o-btn--outline-inverse{padding:calc(var(--btn-padding-vertical-medium) - 1px) var(--btn-padding-horizontal-large)}@media (min-width: 769px){.o-btn.o-btn--medium.o-btn--outline.o-btn--responsive,.o-btn.o-btn--medium.o-btn--outline-inverse.o-btn--responsive{padding:calc(var(--btn-padding-vertical-large) - 1px) var(--btn-padding-horizontal-large)}}.o-btn.o-btn--large{--btn-font-size: calc(var(--dt-font-size-20) * 1px);--btn-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--icon-size-override: 24px;padding:var(--btn-padding-vertical-large) var(--btn-padding-horizontal-large)}.o-btn.o-btn--large.o-btn--outline,.o-btn.o-btn--large.o-btn--outline-inverse{padding:calc(var(--btn-padding-vertical-large) - 1px) var(--btn-padding-horizontal-large)}.o-btn.o-btn--fullWidth{--btn-inline-size: 100%}.o-btn[disabled]{--btn-text-color: var(--dt-color-content-disabled) !important;cursor:not-allowed}.o-btn[disabled]:not(.o-btn--ghost,.o-btn--ghost-inverse,.o-btn--destructive-ghost){--btn-bg-color: var(--dt-color-disabled-01) !important}.o-btn[disabled].o-btn--outline,.o-btn[disabled].o-btn--outline-inverse{border-color:var(--dt-color-disabled-01)!important}.o-btn.is-loading>*:not(pie-spinner){visibility:hidden}.o-btn.is-loading pie-spinner{position:absolute}.o-btn:focus-visible{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}.o-btn-text{text-overflow:ellipsis;overflow:hidden}::slotted(svg){height:var(--icon-size-override);width:var(--icon-size-override)}"; | ||
var $t = Object.defineProperty, p = (k, a, n, b) => { | ||
for (var d = void 0, h = k.length - 1, y; h >= 0; h--) | ||
(y = k[h]) && (d = y(a, n, d) || d); | ||
return d && $t(a, n, d), d; | ||
}; | ||
const C = "pie-button", U = class U extends Lt(At) { | ||
const S = "pie-button", U = class U extends Lt(At) { | ||
constructor() { | ||
@@ -540,4 +540,4 @@ super(...arguments), this.tag = f.tag, this.size = f.size, this.type = f.type, this.variant = f.variant, this.iconPlacement = f.iconPlacement, this.disabled = f.disabled, this.isLoading = f.isLoading, this.isFullWidth = f.isFullWidth, this.isResponsive = f.isResponsive, this._handleFormKeyDown = (a) => { | ||
if (a.target instanceof HTMLElement) { | ||
const r = a.target.tagName.toLowerCase(); | ||
if (r === "button" || r === "pie-button") | ||
const n = a.target.tagName.toLowerCase(); | ||
if (n === "button" || n === "pie-button") | ||
return; | ||
@@ -558,4 +558,4 @@ } | ||
updated(a) { | ||
var r, b; | ||
a.has("type") && (this.type === "submit" ? (r = this.form) == null || r.addEventListener("keydown", this._handleFormKeyDown) : (b = this.form) == null || b.removeEventListener("keydown", this._handleFormKeyDown)); | ||
var n, b; | ||
a.has("type") && (this.type === "submit" ? (n = this.form) == null || n.addEventListener("keydown", this._handleFormKeyDown) : (b = this.form) == null || b.removeEventListener("keydown", this._handleFormKeyDown)); | ||
} | ||
@@ -572,4 +572,4 @@ /** | ||
if (!this.form) return; | ||
const r = document.createElement("button"); | ||
r.type = a, r.style.position = "absolute", r.style.width = "1px", r.style.height = "1px", r.style.padding = "0", r.style.margin = "-1px", r.style.overflow = "hidden", r.style.border = "0", r.style.whiteSpace = "nowrap", a === "submit" && (this.name && (r.name = this.name), this.value && (r.value = this.value), this.formaction && r.setAttribute("formaction", this.formaction), this.formenctype && r.setAttribute("formenctype", this.formenctype), this.formmethod && r.setAttribute("formmethod", this.formmethod), this.formnovalidate && r.setAttribute("formnovalidate", "formnovalidate"), this.formtarget && r.setAttribute("formtarget", this.formtarget)), this.form.append(r), r.click(), r.remove(); | ||
const n = document.createElement("button"); | ||
n.type = a, n.style.position = "absolute", n.style.width = "1px", n.style.height = "1px", n.style.padding = "0", n.style.margin = "-1px", n.style.overflow = "hidden", n.style.border = "0", n.style.whiteSpace = "nowrap", a === "submit" && (this.name && (n.name = this.name), this.value && (n.value = this.value), this.formaction && n.setAttribute("formaction", this.formaction), this.formenctype && n.setAttribute("formenctype", this.formenctype), this.formmethod && n.setAttribute("formmethod", this.formmethod), this.formnovalidate && n.setAttribute("formnovalidate", "formnovalidate"), this.formtarget && n.setAttribute("formtarget", this.formtarget)), this.form.append(n), n.click(), n.remove(); | ||
} | ||
@@ -585,8 +585,8 @@ _handleClick() { | ||
renderSpinner() { | ||
const { size: a, variant: r, disabled: b } = this, c = a && a.includes("small") ? "small" : "medium"; | ||
let m; | ||
return b ? m = r === "ghost-inverse" ? "inverse" : "secondary" : m = ["primary", "destructive", "outline-inverse", "ghost-inverse"].includes(this.variant) ? "inverse" : "secondary", M` | ||
const { size: a, variant: n, disabled: b } = this, d = a && a.includes("small") ? "small" : "medium"; | ||
let h; | ||
return b ? h = n === "ghost-inverse" ? "inverse" : "secondary" : h = ["primary", "destructive", "outline-inverse", "ghost-inverse"].includes(this.variant) ? "inverse" : "secondary", z` | ||
<pie-spinner | ||
size="${c}" | ||
variant="${m}"> | ||
size="${d}" | ||
variant="${h}"> | ||
</pie-spinner>`; | ||
@@ -596,16 +596,16 @@ } | ||
const { | ||
href: r, | ||
href: n, | ||
iconPlacement: b, | ||
rel: c, | ||
target: m | ||
rel: d, | ||
target: h | ||
} = this; | ||
return M` | ||
return z` | ||
<a | ||
href="${K(r)}" | ||
rel="${K(c)}" | ||
target="${K(m)}" | ||
href="${K(n)}" | ||
rel="${K(d)}" | ||
target="${K(h)}" | ||
class="${vt(a)}"> | ||
${b === "leading" ? M`<slot name="icon"></slot>` : F} | ||
${b === "leading" ? z`<slot name="icon"></slot>` : F} | ||
<slot></slot> | ||
${b === "trailing" ? M`<slot name="icon"></slot>` : F} | ||
${b === "trailing" ? z`<slot name="icon"></slot>` : F} | ||
</a>`; | ||
@@ -615,20 +615,20 @@ } | ||
const { | ||
disabled: r, | ||
disabled: n, | ||
iconPlacement: b, | ||
isLoading: c, | ||
type: m | ||
isLoading: d, | ||
type: h | ||
} = this, y = { | ||
...a, | ||
"is-loading": c | ||
"is-loading": d | ||
}; | ||
return M` | ||
return z` | ||
<button | ||
@click=${this._handleClick} | ||
class=${vt(y)} | ||
type=${m} | ||
?disabled=${r}> | ||
${c ? this.renderSpinner() : F} | ||
${b === "leading" ? M`<slot name="icon"></slot>` : F} | ||
<slot></slot> | ||
${b === "trailing" ? M`<slot name="icon"></slot>` : F} | ||
type=${h} | ||
?disabled=${n}> | ||
${d ? this.renderSpinner() : F} | ||
${b === "leading" ? z`<slot name="icon"></slot>` : F} | ||
<span class="o-btn-text"><slot></slot></span> | ||
${b === "trailing" ? z`<slot name="icon"></slot>` : F} | ||
</button>`; | ||
@@ -639,92 +639,92 @@ } | ||
isFullWidth: a, | ||
isResponsive: r, | ||
isResponsive: n, | ||
responsiveSize: b, | ||
size: c, | ||
tag: m, | ||
size: d, | ||
tag: h, | ||
variant: y | ||
} = this, S = { | ||
} = this, M = { | ||
"o-btn": !0, | ||
"o-btn--fullWidth": a, | ||
"o-btn--responsive": r, | ||
[`o-btn--${b}`]: !!(r && b), | ||
"o-btn--responsive": n, | ||
[`o-btn--${b}`]: !!(n && b), | ||
[`o-btn--${y}`]: !0, | ||
[`o-btn--${c}`]: !0 | ||
[`o-btn--${d}`]: !0 | ||
}; | ||
return m === "a" ? this.renderAnchor(S) : this.renderButton(S); | ||
return h === "a" ? this.renderAnchor(M) : this.renderButton(M); | ||
} | ||
focus() { | ||
var a, r; | ||
(r = (a = this.shadowRoot) == null ? void 0 : a.querySelector("button")) == null || r.focus(); | ||
var a, n; | ||
(n = (a = this.shadowRoot) == null ? void 0 : a.querySelector("button")) == null || n.focus(); | ||
} | ||
}; | ||
U.styles = It(Rt); | ||
let d = U; | ||
h([ | ||
let c = U; | ||
p([ | ||
v({ type: String }), | ||
A(C, Vt, f.tag) | ||
], d.prototype, "tag"); | ||
h([ | ||
A(S, Vt, f.tag) | ||
], c.prototype, "tag"); | ||
p([ | ||
v({ type: String }), | ||
A(C, Nt, f.size) | ||
], d.prototype, "size"); | ||
h([ | ||
A(S, Nt, f.size) | ||
], c.prototype, "size"); | ||
p([ | ||
v({ type: String }), | ||
A(C, Pt, f.type) | ||
], d.prototype, "type"); | ||
h([ | ||
A(S, Pt, f.type) | ||
], c.prototype, "type"); | ||
p([ | ||
v({ type: String }), | ||
A(C, Ot, f.variant) | ||
], d.prototype, "variant"); | ||
h([ | ||
A(S, Ot, f.variant) | ||
], c.prototype, "variant"); | ||
p([ | ||
v({ type: String }), | ||
A(C, _t, f.iconPlacement) | ||
], d.prototype, "iconPlacement"); | ||
h([ | ||
A(S, _t, f.iconPlacement) | ||
], c.prototype, "iconPlacement"); | ||
p([ | ||
v({ type: Boolean }) | ||
], d.prototype, "disabled"); | ||
h([ | ||
], c.prototype, "disabled"); | ||
p([ | ||
v({ type: Boolean, reflect: !0 }) | ||
], d.prototype, "isLoading"); | ||
h([ | ||
], c.prototype, "isLoading"); | ||
p([ | ||
v({ type: Boolean }) | ||
], d.prototype, "isFullWidth"); | ||
h([ | ||
], c.prototype, "isFullWidth"); | ||
p([ | ||
v({ type: Boolean }) | ||
], d.prototype, "isResponsive"); | ||
h([ | ||
], c.prototype, "isResponsive"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "name"); | ||
h([ | ||
], c.prototype, "name"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "value"); | ||
h([ | ||
], c.prototype, "value"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "formaction"); | ||
h([ | ||
], c.prototype, "formaction"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "formenctype"); | ||
h([ | ||
], c.prototype, "formenctype"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "formmethod"); | ||
h([ | ||
], c.prototype, "formmethod"); | ||
p([ | ||
v({ type: Boolean }) | ||
], d.prototype, "formnovalidate"); | ||
h([ | ||
], c.prototype, "formnovalidate"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "formtarget"); | ||
h([ | ||
], c.prototype, "formtarget"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "responsiveSize"); | ||
h([ | ||
], c.prototype, "responsiveSize"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "href"); | ||
h([ | ||
], c.prototype, "href"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "rel"); | ||
h([ | ||
], c.prototype, "rel"); | ||
p([ | ||
v({ type: String }) | ||
], d.prototype, "target"); | ||
Tt(C, d); | ||
], c.prototype, "target"); | ||
Tt(S, c); | ||
export { | ||
d as PieButton, | ||
c as PieButton, | ||
f as defaultProps, | ||
@@ -731,0 +731,0 @@ Gt as formEncodingtypes, |
{ | ||
"name": "@justeattakeaway/pie-button", | ||
"version": "1.0.0", | ||
"version": "1.1.0", | ||
"description": "PIE design system button built using web components", | ||
@@ -5,0 +5,0 @@ "type": "module", |
@@ -268,3 +268,3 @@ import { | ||
${iconPlacement === 'leading' ? html`<slot name="icon"></slot>` : nothing} | ||
<slot></slot> | ||
<span class="o-btn-text"><slot></slot></span> | ||
${iconPlacement === 'trailing' ? html`<slot name="icon"></slot>` : nothing} | ||
@@ -271,0 +271,0 @@ </button>`; |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
110359
2096