placer-toolkit 0.5.1 → 1.0.0-alpha.2

package/dist/components/input/input.js

@@ -1,5 +1,2305 @@
-import { PcInput as PcInput$1 } from './input.component.js';
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i6 = decorators.length - 1, decorator; i6 >= 0; i6--)
+    if (decorator = decorators[i6])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
 
-var PcInput = PcInput$1;
+// node_modules/@lit/reactive-element/css-tag.js
+var t = globalThis;
+var e = t.ShadowRoot && (void 0 === t.ShadyCSS || t.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype;
+var s = Symbol();
+var o = /* @__PURE__ */ new WeakMap();
+var n = class {
+  constructor(t6, e8, o7) {
+    if (this._$cssResult$ = true, o7 !== s) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    this.cssText = t6, this.t = e8;
+  }
+  get styleSheet() {
+    let t6 = this.o;
+    const s4 = this.t;
+    if (e && void 0 === t6) {
+      const e8 = void 0 !== s4 && 1 === s4.length;
+      e8 && (t6 = o.get(s4)), void 0 === t6 && ((this.o = t6 = new CSSStyleSheet()).replaceSync(this.cssText), e8 && o.set(s4, t6));
+    }
+    return t6;
+  }
+  toString() {
+    return this.cssText;
+  }
+};
+var r = (t6) => new n("string" == typeof t6 ? t6 : t6 + "", void 0, s);
+var S = (s4, o7) => {
+  if (e) s4.adoptedStyleSheets = o7.map(((t6) => t6 instanceof CSSStyleSheet ? t6 : t6.styleSheet));
+  else for (const e8 of o7) {
+    const o8 = document.createElement("style"), n5 = t.litNonce;
+    void 0 !== n5 && o8.setAttribute("nonce", n5), o8.textContent = e8.cssText, s4.appendChild(o8);
+  }
+};
+var c = e ? (t6) => t6 : (t6) => t6 instanceof CSSStyleSheet ? ((t7) => {
+  let e8 = "";
+  for (const s4 of t7.cssRules) e8 += s4.cssText;
+  return r(e8);
+})(t6) : t6;
 
-export { PcInput$1 as PcInput, PcInput as default };
+// node_modules/@lit/reactive-element/reactive-element.js
+var { is: i2, defineProperty: e2, getOwnPropertyDescriptor: h, getOwnPropertyNames: r2, getOwnPropertySymbols: o2, getPrototypeOf: n2 } = Object;
+var a = globalThis;
+var c2 = a.trustedTypes;
+var l = c2 ? c2.emptyScript : "";
+var p = a.reactiveElementPolyfillSupport;
+var d = (t6, s4) => t6;
+var u = { toAttribute(t6, s4) {
+  switch (s4) {
+    case Boolean:
+      t6 = t6 ? l : null;
+      break;
+    case Object:
+    case Array:
+      t6 = null == t6 ? t6 : JSON.stringify(t6);
+  }
+  return t6;
+}, fromAttribute(t6, s4) {
+  let i6 = t6;
+  switch (s4) {
+    case Boolean:
+      i6 = null !== t6;
+      break;
+    case Number:
+      i6 = null === t6 ? null : Number(t6);
+      break;
+    case Object:
+    case Array:
+      try {
+        i6 = JSON.parse(t6);
+      } catch (t7) {
+        i6 = null;
+      }
+  }
+  return i6;
+} };
+var f = (t6, s4) => !i2(t6, s4);
+var b = { attribute: true, type: String, converter: u, reflect: false, useDefault: false, hasChanged: f };
+Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), a.litPropertyMetadata ?? (a.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
+var y = class extends HTMLElement {
+  static addInitializer(t6) {
+    this._$Ei(), (this.l ?? (this.l = [])).push(t6);
+  }
+  static get observedAttributes() {
+    return this.finalize(), this._$Eh && [...this._$Eh.keys()];
+  }
+  static createProperty(t6, s4 = b) {
+    if (s4.state && (s4.attribute = false), this._$Ei(), this.prototype.hasOwnProperty(t6) && ((s4 = Object.create(s4)).wrapped = true), this.elementProperties.set(t6, s4), !s4.noAccessor) {
+      const i6 = Symbol(), h3 = this.getPropertyDescriptor(t6, i6, s4);
+      void 0 !== h3 && e2(this.prototype, t6, h3);
+    }
+  }
+  static getPropertyDescriptor(t6, s4, i6) {
+    const { get: e8, set: r6 } = h(this.prototype, t6) ?? { get() {
+      return this[s4];
+    }, set(t7) {
+      this[s4] = t7;
+    } };
+    return { get: e8, set(s5) {
+      const h3 = e8?.call(this);
+      r6?.call(this, s5), this.requestUpdate(t6, h3, i6);
+    }, configurable: true, enumerable: true };
+  }
+  static getPropertyOptions(t6) {
+    return this.elementProperties.get(t6) ?? b;
+  }
+  static _$Ei() {
+    if (this.hasOwnProperty(d("elementProperties"))) return;
+    const t6 = n2(this);
+    t6.finalize(), void 0 !== t6.l && (this.l = [...t6.l]), this.elementProperties = new Map(t6.elementProperties);
+  }
+  static finalize() {
+    if (this.hasOwnProperty(d("finalized"))) return;
+    if (this.finalized = true, this._$Ei(), this.hasOwnProperty(d("properties"))) {
+      const t7 = this.properties, s4 = [...r2(t7), ...o2(t7)];
+      for (const i6 of s4) this.createProperty(i6, t7[i6]);
+    }
+    const t6 = this[Symbol.metadata];
+    if (null !== t6) {
+      const s4 = litPropertyMetadata.get(t6);
+      if (void 0 !== s4) for (const [t7, i6] of s4) this.elementProperties.set(t7, i6);
+    }
+    this._$Eh = /* @__PURE__ */ new Map();
+    for (const [t7, s4] of this.elementProperties) {
+      const i6 = this._$Eu(t7, s4);
+      void 0 !== i6 && this._$Eh.set(i6, t7);
+    }
+    this.elementStyles = this.finalizeStyles(this.styles);
+  }
+  static finalizeStyles(s4) {
+    const i6 = [];
+    if (Array.isArray(s4)) {
+      const e8 = new Set(s4.flat(1 / 0).reverse());
+      for (const s5 of e8) i6.unshift(c(s5));
+    } else void 0 !== s4 && i6.push(c(s4));
+    return i6;
+  }
+  static _$Eu(t6, s4) {
+    const i6 = s4.attribute;
+    return false === i6 ? void 0 : "string" == typeof i6 ? i6 : "string" == typeof t6 ? t6.toLowerCase() : void 0;
+  }
+  constructor() {
+    super(), this._$Ep = void 0, this.isUpdatePending = false, this.hasUpdated = false, this._$Em = null, this._$Ev();
+  }
+  _$Ev() {
+    this._$ES = new Promise(((t6) => this.enableUpdating = t6)), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), this.constructor.l?.forEach(((t6) => t6(this)));
+  }
+  addController(t6) {
+    (this._$EO ?? (this._$EO = /* @__PURE__ */ new Set())).add(t6), void 0 !== this.renderRoot && this.isConnected && t6.hostConnected?.();
+  }
+  removeController(t6) {
+    this._$EO?.delete(t6);
+  }
+  _$E_() {
+    const t6 = /* @__PURE__ */ new Map(), s4 = this.constructor.elementProperties;
+    for (const i6 of s4.keys()) this.hasOwnProperty(i6) && (t6.set(i6, this[i6]), delete this[i6]);
+    t6.size > 0 && (this._$Ep = t6);
+  }
+  createRenderRoot() {
+    const t6 = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
+    return S(t6, this.constructor.elementStyles), t6;
+  }
+  connectedCallback() {
+    this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(true), this._$EO?.forEach(((t6) => t6.hostConnected?.()));
+  }
+  enableUpdating(t6) {
+  }
+  disconnectedCallback() {
+    this._$EO?.forEach(((t6) => t6.hostDisconnected?.()));
+  }
+  attributeChangedCallback(t6, s4, i6) {
+    this._$AK(t6, i6);
+  }
+  _$ET(t6, s4) {
+    const i6 = this.constructor.elementProperties.get(t6), e8 = this.constructor._$Eu(t6, i6);
+    if (void 0 !== e8 && true === i6.reflect) {
+      const h3 = (void 0 !== i6.converter?.toAttribute ? i6.converter : u).toAttribute(s4, i6.type);
+      this._$Em = t6, null == h3 ? this.removeAttribute(e8) : this.setAttribute(e8, h3), this._$Em = null;
+    }
+  }
+  _$AK(t6, s4) {
+    const i6 = this.constructor, e8 = i6._$Eh.get(t6);
+    if (void 0 !== e8 && this._$Em !== e8) {
+      const t7 = i6.getPropertyOptions(e8), h3 = "function" == typeof t7.converter ? { fromAttribute: t7.converter } : void 0 !== t7.converter?.fromAttribute ? t7.converter : u;
+      this._$Em = e8, this[e8] = h3.fromAttribute(s4, t7.type) ?? this._$Ej?.get(e8) ?? null, this._$Em = null;
+    }
+  }
+  requestUpdate(t6, s4, i6) {
+    if (void 0 !== t6) {
+      const e8 = this.constructor, h3 = this[t6];
+      if (i6 ?? (i6 = e8.getPropertyOptions(t6)), !((i6.hasChanged ?? f)(h3, s4) || i6.useDefault && i6.reflect && h3 === this._$Ej?.get(t6) && !this.hasAttribute(e8._$Eu(t6, i6)))) return;
+      this.C(t6, s4, i6);
+    }
+    false === this.isUpdatePending && (this._$ES = this._$EP());
+  }
+  C(t6, s4, { useDefault: i6, reflect: e8, wrapped: h3 }, r6) {
+    i6 && !(this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Map())).has(t6) && (this._$Ej.set(t6, r6 ?? s4 ?? this[t6]), true !== h3 || void 0 !== r6) || (this._$AL.has(t6) || (this.hasUpdated || i6 || (s4 = void 0), this._$AL.set(t6, s4)), true === e8 && this._$Em !== t6 && (this._$Eq ?? (this._$Eq = /* @__PURE__ */ new Set())).add(t6));
+  }
+  async _$EP() {
+    this.isUpdatePending = true;
+    try {
+      await this._$ES;
+    } catch (t7) {
+      Promise.reject(t7);
+    }
+    const t6 = this.scheduleUpdate();
+    return null != t6 && await t6, !this.isUpdatePending;
+  }
+  scheduleUpdate() {
+    return this.performUpdate();
+  }
+  performUpdate() {
+    if (!this.isUpdatePending) return;
+    if (!this.hasUpdated) {
+      if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
+        for (const [t8, s5] of this._$Ep) this[t8] = s5;
+        this._$Ep = void 0;
+      }
+      const t7 = this.constructor.elementProperties;
+      if (t7.size > 0) for (const [s5, i6] of t7) {
+        const { wrapped: t8 } = i6, e8 = this[s5];
+        true !== t8 || this._$AL.has(s5) || void 0 === e8 || this.C(s5, void 0, i6, e8);
+      }
+    }
+    let t6 = false;
+    const s4 = this._$AL;
+    try {
+      t6 = this.shouldUpdate(s4), t6 ? (this.willUpdate(s4), this._$EO?.forEach(((t7) => t7.hostUpdate?.())), this.update(s4)) : this._$EM();
+    } catch (s5) {
+      throw t6 = false, this._$EM(), s5;
+    }
+    t6 && this._$AE(s4);
+  }
+  willUpdate(t6) {
+  }
+  _$AE(t6) {
+    this._$EO?.forEach(((t7) => t7.hostUpdated?.())), this.hasUpdated || (this.hasUpdated = true, this.firstUpdated(t6)), this.updated(t6);
+  }
+  _$EM() {
+    this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = false;
+  }
+  get updateComplete() {
+    return this.getUpdateComplete();
+  }
+  getUpdateComplete() {
+    return this._$ES;
+  }
+  shouldUpdate(t6) {
+    return true;
+  }
+  update(t6) {
+    this._$Eq && (this._$Eq = this._$Eq.forEach(((t7) => this._$ET(t7, this[t7])))), this._$EM();
+  }
+  updated(t6) {
+  }
+  firstUpdated(t6) {
+  }
+};
+y.elementStyles = [], y.shadowRootOptions = { mode: "open" }, y[d("elementProperties")] = /* @__PURE__ */ new Map(), y[d("finalized")] = /* @__PURE__ */ new Map(), p?.({ ReactiveElement: y }), (a.reactiveElementVersions ?? (a.reactiveElementVersions = [])).push("2.1.0");
+
+// node_modules/lit-html/lit-html.js
+var t2 = globalThis;
+var i3 = t2.trustedTypes;
+var s2 = i3 ? i3.createPolicy("lit-html", { createHTML: (t6) => t6 }) : void 0;
+var e3 = "$lit$";
+var h2 = `lit$${Math.random().toFixed(9).slice(2)}$`;
+var o3 = "?" + h2;
+var n3 = `<${o3}>`;
+var r3 = document;
+var l2 = () => r3.createComment("");
+var c3 = (t6) => null === t6 || "object" != typeof t6 && "function" != typeof t6;
+var a2 = Array.isArray;
+var u2 = (t6) => a2(t6) || "function" == typeof t6?.[Symbol.iterator];
+var d2 = "[ 	\n\f\r]";
+var f2 = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g;
+var v = /-->/g;
+var _ = />/g;
+var m = RegExp(`>|${d2}(?:([^\\s"'>=/]+)(${d2}*=${d2}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g");
+var p2 = /'/g;
+var g = /"/g;
+var $ = /^(?:script|style|textarea|title)$/i;
+var y2 = (t6) => (i6, ...s4) => ({ _$litType$: t6, strings: i6, values: s4 });
+var x = y2(1);
+var b2 = y2(2);
+var w = y2(3);
+var T = Symbol.for("lit-noChange");
+var E = Symbol.for("lit-nothing");
+var A = /* @__PURE__ */ new WeakMap();
+var C = r3.createTreeWalker(r3, 129);
+function P(t6, i6) {
+  if (!a2(t6) || !t6.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return void 0 !== s2 ? s2.createHTML(i6) : i6;
+}
+var V = (t6, i6) => {
+  const s4 = t6.length - 1, o7 = [];
+  let r6, l4 = 2 === i6 ? "<svg>" : 3 === i6 ? "<math>" : "", c4 = f2;
+  for (let i7 = 0; i7 < s4; i7++) {
+    const s5 = t6[i7];
+    let a3, u4, d3 = -1, y3 = 0;
+    for (; y3 < s5.length && (c4.lastIndex = y3, u4 = c4.exec(s5), null !== u4); ) y3 = c4.lastIndex, c4 === f2 ? "!--" === u4[1] ? c4 = v : void 0 !== u4[1] ? c4 = _ : void 0 !== u4[2] ? ($.test(u4[2]) && (r6 = RegExp("</" + u4[2], "g")), c4 = m) : void 0 !== u4[3] && (c4 = m) : c4 === m ? ">" === u4[0] ? (c4 = r6 ?? f2, d3 = -1) : void 0 === u4[1] ? d3 = -2 : (d3 = c4.lastIndex - u4[2].length, a3 = u4[1], c4 = void 0 === u4[3] ? m : '"' === u4[3] ? g : p2) : c4 === g || c4 === p2 ? c4 = m : c4 === v || c4 === _ ? c4 = f2 : (c4 = m, r6 = void 0);
+    const x2 = c4 === m && t6[i7 + 1].startsWith("/>") ? " " : "";
+    l4 += c4 === f2 ? s5 + n3 : d3 >= 0 ? (o7.push(a3), s5.slice(0, d3) + e3 + s5.slice(d3) + h2 + x2) : s5 + h2 + (-2 === d3 ? i7 : x2);
+  }
+  return [P(t6, l4 + (t6[s4] || "<?>") + (2 === i6 ? "</svg>" : 3 === i6 ? "</math>" : "")), o7];
+};
+var N = class _N {
+  constructor({ strings: t6, _$litType$: s4 }, n5) {
+    let r6;
+    this.parts = [];
+    let c4 = 0, a3 = 0;
+    const u4 = t6.length - 1, d3 = this.parts, [f4, v2] = V(t6, s4);
+    if (this.el = _N.createElement(f4, n5), C.currentNode = this.el.content, 2 === s4 || 3 === s4) {
+      const t7 = this.el.content.firstChild;
+      t7.replaceWith(...t7.childNodes);
+    }
+    for (; null !== (r6 = C.nextNode()) && d3.length < u4; ) {
+      if (1 === r6.nodeType) {
+        if (r6.hasAttributes()) for (const t7 of r6.getAttributeNames()) if (t7.endsWith(e3)) {
+          const i6 = v2[a3++], s5 = r6.getAttribute(t7).split(h2), e8 = /([.?@])?(.*)/.exec(i6);
+          d3.push({ type: 1, index: c4, name: e8[2], strings: s5, ctor: "." === e8[1] ? H : "?" === e8[1] ? I : "@" === e8[1] ? L : k }), r6.removeAttribute(t7);
+        } else t7.startsWith(h2) && (d3.push({ type: 6, index: c4 }), r6.removeAttribute(t7));
+        if ($.test(r6.tagName)) {
+          const t7 = r6.textContent.split(h2), s5 = t7.length - 1;
+          if (s5 > 0) {
+            r6.textContent = i3 ? i3.emptyScript : "";
+            for (let i6 = 0; i6 < s5; i6++) r6.append(t7[i6], l2()), C.nextNode(), d3.push({ type: 2, index: ++c4 });
+            r6.append(t7[s5], l2());
+          }
+        }
+      } else if (8 === r6.nodeType) if (r6.data === o3) d3.push({ type: 2, index: c4 });
+      else {
+        let t7 = -1;
+        for (; -1 !== (t7 = r6.data.indexOf(h2, t7 + 1)); ) d3.push({ type: 7, index: c4 }), t7 += h2.length - 1;
+      }
+      c4++;
+    }
+  }
+  static createElement(t6, i6) {
+    const s4 = r3.createElement("template");
+    return s4.innerHTML = t6, s4;
+  }
+};
+function S2(t6, i6, s4 = t6, e8) {
+  if (i6 === T) return i6;
+  let h3 = void 0 !== e8 ? s4._$Co?.[e8] : s4._$Cl;
+  const o7 = c3(i6) ? void 0 : i6._$litDirective$;
+  return h3?.constructor !== o7 && (h3?._$AO?.(false), void 0 === o7 ? h3 = void 0 : (h3 = new o7(t6), h3._$AT(t6, s4, e8)), void 0 !== e8 ? (s4._$Co ?? (s4._$Co = []))[e8] = h3 : s4._$Cl = h3), void 0 !== h3 && (i6 = S2(t6, h3._$AS(t6, i6.values), h3, e8)), i6;
+}
+var M = class {
+  constructor(t6, i6) {
+    this._$AV = [], this._$AN = void 0, this._$AD = t6, this._$AM = i6;
+  }
+  get parentNode() {
+    return this._$AM.parentNode;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  u(t6) {
+    const { el: { content: i6 }, parts: s4 } = this._$AD, e8 = (t6?.creationScope ?? r3).importNode(i6, true);
+    C.currentNode = e8;
+    let h3 = C.nextNode(), o7 = 0, n5 = 0, l4 = s4[0];
+    for (; void 0 !== l4; ) {
+      if (o7 === l4.index) {
+        let i7;
+        2 === l4.type ? i7 = new R(h3, h3.nextSibling, this, t6) : 1 === l4.type ? i7 = new l4.ctor(h3, l4.name, l4.strings, this, t6) : 6 === l4.type && (i7 = new z(h3, this, t6)), this._$AV.push(i7), l4 = s4[++n5];
+      }
+      o7 !== l4?.index && (h3 = C.nextNode(), o7++);
+    }
+    return C.currentNode = r3, e8;
+  }
+  p(t6) {
+    let i6 = 0;
+    for (const s4 of this._$AV) void 0 !== s4 && (void 0 !== s4.strings ? (s4._$AI(t6, s4, i6), i6 += s4.strings.length - 2) : s4._$AI(t6[i6])), i6++;
+  }
+};
+var R = class _R {
+  get _$AU() {
+    return this._$AM?._$AU ?? this._$Cv;
+  }
+  constructor(t6, i6, s4, e8) {
+    this.type = 2, this._$AH = E, this._$AN = void 0, this._$AA = t6, this._$AB = i6, this._$AM = s4, this.options = e8, this._$Cv = e8?.isConnected ?? true;
+  }
+  get parentNode() {
+    let t6 = this._$AA.parentNode;
+    const i6 = this._$AM;
+    return void 0 !== i6 && 11 === t6?.nodeType && (t6 = i6.parentNode), t6;
+  }
+  get startNode() {
+    return this._$AA;
+  }
+  get endNode() {
+    return this._$AB;
+  }
+  _$AI(t6, i6 = this) {
+    t6 = S2(this, t6, i6), c3(t6) ? t6 === E || null == t6 || "" === t6 ? (this._$AH !== E && this._$AR(), this._$AH = E) : t6 !== this._$AH && t6 !== T && this._(t6) : void 0 !== t6._$litType$ ? this.$(t6) : void 0 !== t6.nodeType ? this.T(t6) : u2(t6) ? this.k(t6) : this._(t6);
+  }
+  O(t6) {
+    return this._$AA.parentNode.insertBefore(t6, this._$AB);
+  }
+  T(t6) {
+    this._$AH !== t6 && (this._$AR(), this._$AH = this.O(t6));
+  }
+  _(t6) {
+    this._$AH !== E && c3(this._$AH) ? this._$AA.nextSibling.data = t6 : this.T(r3.createTextNode(t6)), this._$AH = t6;
+  }
+  $(t6) {
+    const { values: i6, _$litType$: s4 } = t6, e8 = "number" == typeof s4 ? this._$AC(t6) : (void 0 === s4.el && (s4.el = N.createElement(P(s4.h, s4.h[0]), this.options)), s4);
+    if (this._$AH?._$AD === e8) this._$AH.p(i6);
+    else {
+      const t7 = new M(e8, this), s5 = t7.u(this.options);
+      t7.p(i6), this.T(s5), this._$AH = t7;
+    }
+  }
+  _$AC(t6) {
+    let i6 = A.get(t6.strings);
+    return void 0 === i6 && A.set(t6.strings, i6 = new N(t6)), i6;
+  }
+  k(t6) {
+    a2(this._$AH) || (this._$AH = [], this._$AR());
+    const i6 = this._$AH;
+    let s4, e8 = 0;
+    for (const h3 of t6) e8 === i6.length ? i6.push(s4 = new _R(this.O(l2()), this.O(l2()), this, this.options)) : s4 = i6[e8], s4._$AI(h3), e8++;
+    e8 < i6.length && (this._$AR(s4 && s4._$AB.nextSibling, e8), i6.length = e8);
+  }
+  _$AR(t6 = this._$AA.nextSibling, i6) {
+    for (this._$AP?.(false, true, i6); t6 && t6 !== this._$AB; ) {
+      const i7 = t6.nextSibling;
+      t6.remove(), t6 = i7;
+    }
+  }
+  setConnected(t6) {
+    void 0 === this._$AM && (this._$Cv = t6, this._$AP?.(t6));
+  }
+};
+var k = class {
+  get tagName() {
+    return this.element.tagName;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  constructor(t6, i6, s4, e8, h3) {
+    this.type = 1, this._$AH = E, this._$AN = void 0, this.element = t6, this.name = i6, this._$AM = e8, this.options = h3, s4.length > 2 || "" !== s4[0] || "" !== s4[1] ? (this._$AH = Array(s4.length - 1).fill(new String()), this.strings = s4) : this._$AH = E;
+  }
+  _$AI(t6, i6 = this, s4, e8) {
+    const h3 = this.strings;
+    let o7 = false;
+    if (void 0 === h3) t6 = S2(this, t6, i6, 0), o7 = !c3(t6) || t6 !== this._$AH && t6 !== T, o7 && (this._$AH = t6);
+    else {
+      const e9 = t6;
+      let n5, r6;
+      for (t6 = h3[0], n5 = 0; n5 < h3.length - 1; n5++) r6 = S2(this, e9[s4 + n5], i6, n5), r6 === T && (r6 = this._$AH[n5]), o7 || (o7 = !c3(r6) || r6 !== this._$AH[n5]), r6 === E ? t6 = E : t6 !== E && (t6 += (r6 ?? "") + h3[n5 + 1]), this._$AH[n5] = r6;
+    }
+    o7 && !e8 && this.j(t6);
+  }
+  j(t6) {
+    t6 === E ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t6 ?? "");
+  }
+};
+var H = class extends k {
+  constructor() {
+    super(...arguments), this.type = 3;
+  }
+  j(t6) {
+    this.element[this.name] = t6 === E ? void 0 : t6;
+  }
+};
+var I = class extends k {
+  constructor() {
+    super(...arguments), this.type = 4;
+  }
+  j(t6) {
+    this.element.toggleAttribute(this.name, !!t6 && t6 !== E);
+  }
+};
+var L = class extends k {
+  constructor(t6, i6, s4, e8, h3) {
+    super(t6, i6, s4, e8, h3), this.type = 5;
+  }
+  _$AI(t6, i6 = this) {
+    if ((t6 = S2(this, t6, i6, 0) ?? E) === T) return;
+    const s4 = this._$AH, e8 = t6 === E && s4 !== E || t6.capture !== s4.capture || t6.once !== s4.once || t6.passive !== s4.passive, h3 = t6 !== E && (s4 === E || e8);
+    e8 && this.element.removeEventListener(this.name, this, s4), h3 && this.element.addEventListener(this.name, this, t6), this._$AH = t6;
+  }
+  handleEvent(t6) {
+    "function" == typeof this._$AH ? this._$AH.call(this.options?.host ?? this.element, t6) : this._$AH.handleEvent(t6);
+  }
+};
+var z = class {
+  constructor(t6, i6, s4) {
+    this.element = t6, this.type = 6, this._$AN = void 0, this._$AM = i6, this.options = s4;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AI(t6) {
+    S2(this, t6);
+  }
+};
+var Z = { M: e3, P: h2, A: o3, C: 1, L: V, R: M, D: u2, V: S2, I: R, H: k, N: I, U: L, B: H, F: z };
+var j = t2.litHtmlPolyfillSupport;
+j?.(N, R), (t2.litHtmlVersions ?? (t2.litHtmlVersions = [])).push("3.3.0");
+var B = (t6, i6, s4) => {
+  const e8 = s4?.renderBefore ?? i6;
+  let h3 = e8._$litPart$;
+  if (void 0 === h3) {
+    const t7 = s4?.renderBefore ?? null;
+    e8._$litPart$ = h3 = new R(i6.insertBefore(l2(), t7), t7, void 0, s4 ?? {});
+  }
+  return h3._$AI(t6), h3;
+};
+
+// node_modules/lit-element/lit-element.js
+var s3 = globalThis;
+var i4 = class extends y {
+  constructor() {
+    super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
+  }
+  createRenderRoot() {
+    var _a;
+    const t6 = super.createRenderRoot();
+    return (_a = this.renderOptions).renderBefore ?? (_a.renderBefore = t6.firstChild), t6;
+  }
+  update(t6) {
+    const r6 = this.render();
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t6), this._$Do = B(r6, this.renderRoot, this.renderOptions);
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._$Do?.setConnected(true);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._$Do?.setConnected(false);
+  }
+  render() {
+    return T;
+  }
+};
+i4._$litElement$ = true, i4["finalized"] = true, s3.litElementHydrateSupport?.({ LitElement: i4 });
+var o4 = s3.litElementPolyfillSupport;
+o4?.({ LitElement: i4 });
+(s3.litElementVersions ?? (s3.litElementVersions = [])).push("4.2.0");
+
+// node_modules/@lit/reactive-element/decorators/custom-element.js
+var t3 = (t6) => (e8, o7) => {
+  void 0 !== o7 ? o7.addInitializer((() => {
+    customElements.define(t6, e8);
+  })) : customElements.define(t6, e8);
+};
+
+// node_modules/@lit/reactive-element/decorators/property.js
+var o5 = { attribute: true, type: String, converter: u, reflect: false, hasChanged: f };
+var r4 = (t6 = o5, e8, r6) => {
+  const { kind: n5, metadata: i6 } = r6;
+  let s4 = globalThis.litPropertyMetadata.get(i6);
+  if (void 0 === s4 && globalThis.litPropertyMetadata.set(i6, s4 = /* @__PURE__ */ new Map()), "setter" === n5 && ((t6 = Object.create(t6)).wrapped = true), s4.set(r6.name, t6), "accessor" === n5) {
+    const { name: o7 } = r6;
+    return { set(r7) {
+      const n6 = e8.get.call(this);
+      e8.set.call(this, r7), this.requestUpdate(o7, n6, t6);
+    }, init(e9) {
+      return void 0 !== e9 && this.C(o7, void 0, t6, e9), e9;
+    } };
+  }
+  if ("setter" === n5) {
+    const { name: o7 } = r6;
+    return function(r7) {
+      const n6 = this[o7];
+      e8.call(this, r7), this.requestUpdate(o7, n6, t6);
+    };
+  }
+  throw Error("Unsupported decorator location: " + n5);
+};
+function n4(t6) {
+  return (e8, o7) => "object" == typeof o7 ? r4(t6, e8, o7) : ((t7, e9, o8) => {
+    const r6 = e9.hasOwnProperty(o8);
+    return e9.constructor.createProperty(o8, t7), r6 ? Object.getOwnPropertyDescriptor(e9, o8) : void 0;
+  })(t6, e8, o7);
+}
+
+// node_modules/@lit/reactive-element/decorators/state.js
+function r5(r6) {
+  return n4({ ...r6, state: true, attribute: false });
+}
+
+// node_modules/@lit/reactive-element/decorators/base.js
+var e4 = (e8, t6, c4) => (c4.configurable = true, c4.enumerable = true, Reflect.decorate && "object" != typeof t6 && Object.defineProperty(e8, t6, c4), c4);
+
+// node_modules/@lit/reactive-element/decorators/query.js
+function e5(e8, r6) {
+  return (n5, s4, i6) => {
+    const o7 = (t6) => t6.renderRoot?.querySelector(e8) ?? null;
+    if (r6) {
+      const { get: e9, set: r7 } = "object" == typeof s4 ? n5 : i6 ?? (() => {
+        const t6 = Symbol();
+        return { get() {
+          return this[t6];
+        }, set(e10) {
+          this[t6] = e10;
+        } };
+      })();
+      return e4(n5, s4, { get() {
+        let t6 = e9.call(this);
+        return void 0 === t6 && (t6 = o7(this), (null !== t6 || this.hasUpdated) && r7.call(this, t6)), t6;
+      } });
+    }
+    return e4(n5, s4, { get() {
+      return o7(this);
+    } });
+  };
+}
+
+// src/styles/component-styles/host.css
+var host_default = ":host {\n    box-sizing: border-box !important;\n}\n\n:host *,\n:host *::before,\n:host *::after {\n    box-sizing: inherit !important;\n}\n\n[hidden] {\n    display: none !important;\n}\n";
+
+// src/internal/placer-element.ts
+var PlacerElement = class extends i4 {
+  constructor() {
+    super();
+    this.hasRecordedInitialProperties = false;
+    this.initialReflectedProperties = /* @__PURE__ */ new Map();
+    /** A method to set and check custom states. */
+    this.customStates = {
+      /** Adds or removes the specified custom state. */
+      set: (customState, active) => {
+        if (!Boolean(this.internals?.states)) {
+          return;
+        }
+        if (active) {
+          this.internals.states.add(customState);
+        } else {
+          this.internals.states.delete(customState);
+        }
+      },
+      /** Determines whether or not the element currently has the specified state. */
+      has: (customState) => {
+        if (!Boolean(this.internals?.states)) {
+          return false;
+        }
+        return this.internals.states.has(customState);
+      }
+    };
+    try {
+      this.internals = this.attachInternals();
+    } catch {
+      console.error(
+        "Element internals are not supported in your browser. Consider using a polyfill."
+      );
+    }
+    this.customStates.set("pc-defined", true);
+    let Self = this.constructor;
+    for (let [property, spec] of Self.elementProperties) {
+      if (spec.default === "inherit" && spec.initial !== void 0 && typeof property === "string") {
+        this.customStates.set(
+          `initial-${property}-${spec.initial}`,
+          true
+        );
+      }
+    }
+  }
+  /** Override the default `styles` property to fetch and convert string CSS files. Components can override this behavior by setting their own `static styles = []` property. */
+  static get styles() {
+    const styles = Array.isArray(this.css) ? this.css : this.css ? [this.css] : [];
+    return [host_default, ...styles].map(
+      (style) => typeof style === "string" ? r(style) : style
+    );
+  }
+  attributeChangedCallback(name, oldValue, newValue) {
+    if (!this.hasRecordedInitialProperties) {
+      this.constructor.elementProperties.forEach((object, property) => {
+        if (typeof property === "string" && object.reflect) {
+          const value = this[property];
+          if (value != null) {
+            this.initialReflectedProperties.set(property, value);
+          }
+        }
+      });
+      this.hasRecordedInitialProperties = true;
+    }
+    super.attributeChangedCallback(name, oldValue, newValue);
+  }
+  willUpdate(changedProperties) {
+    super.willUpdate(changedProperties);
+    this.initialReflectedProperties.forEach((value, prop) => {
+      if (changedProperties.has(prop) && this[prop] == null) {
+        this[prop] = value;
+      }
+    });
+  }
+  firstUpdated(changedProperties) {
+    super.firstUpdated(changedProperties);
+  }
+};
+__decorateClass([
+  n4()
+], PlacerElement.prototype, "lang", 2);
+__decorateClass([
+  n4()
+], PlacerElement.prototype, "dir", 2);
+
+// node_modules/lit-html/directive.js
+var t4 = { ATTRIBUTE: 1, CHILD: 2, PROPERTY: 3, BOOLEAN_ATTRIBUTE: 4, EVENT: 5, ELEMENT: 6 };
+var e6 = (t6) => (...e8) => ({ _$litDirective$: t6, values: e8 });
+var i5 = class {
+  constructor(t6) {
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AT(t6, e8, i6) {
+    this._$Ct = t6, this._$AM = e8, this._$Ci = i6;
+  }
+  _$AS(t6, e8) {
+    return this.update(t6, e8);
+  }
+  update(t6, e8) {
+    return this.render(...e8);
+  }
+};
+
+// node_modules/lit-html/directives/class-map.js
+var e7 = e6(class extends i5 {
+  constructor(t6) {
+    if (super(t6), t6.type !== t4.ATTRIBUTE || "class" !== t6.name || t6.strings?.length > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");
+  }
+  render(t6) {
+    return " " + Object.keys(t6).filter(((s4) => t6[s4])).join(" ") + " ";
+  }
+  update(s4, [i6]) {
+    if (void 0 === this.st) {
+      this.st = /* @__PURE__ */ new Set(), void 0 !== s4.strings && (this.nt = new Set(s4.strings.join(" ").split(/\s/).filter(((t6) => "" !== t6))));
+      for (const t6 in i6) i6[t6] && !this.nt?.has(t6) && this.st.add(t6);
+      return this.render(i6);
+    }
+    const r6 = s4.element.classList;
+    for (const t6 of this.st) t6 in i6 || (r6.remove(t6), this.st.delete(t6));
+    for (const t6 in i6) {
+      const s5 = !!i6[t6];
+      s5 === this.st.has(t6) || this.nt?.has(t6) || (s5 ? (r6.add(t6), this.st.add(t6)) : (r6.remove(t6), this.st.delete(t6)));
+    }
+    return T;
+  }
+});
+
+// node_modules/lit-html/directives/if-defined.js
+var o6 = (o7) => o7 ?? E;
+
+// node_modules/lit-html/directive-helpers.js
+var { I: t5 } = Z;
+var f3 = (o7) => void 0 === o7.strings;
+var u3 = {};
+var m2 = (o7, t6 = u3) => o7._$AH = t6;
+
+// node_modules/lit-html/directives/live.js
+var l3 = e6(class extends i5 {
+  constructor(r6) {
+    if (super(r6), r6.type !== t4.PROPERTY && r6.type !== t4.ATTRIBUTE && r6.type !== t4.BOOLEAN_ATTRIBUTE) throw Error("The `live` directive is not allowed on child or event bindings");
+    if (!f3(r6)) throw Error("`live` bindings can only contain a single expression");
+  }
+  render(r6) {
+    return r6;
+  }
+  update(i6, [t6]) {
+    if (t6 === T || t6 === E) return t6;
+    const o7 = i6.element, l4 = i6.name;
+    if (i6.type === t4.PROPERTY) {
+      if (t6 === o7[l4]) return T;
+    } else if (i6.type === t4.BOOLEAN_ATTRIBUTE) {
+      if (!!t6 === o7.hasAttribute(l4)) return T;
+    } else if (i6.type === t4.ATTRIBUTE && o7.getAttribute(l4) === t6 + "") return T;
+    return m2(i6), t6;
+  }
+});
+
+// src/internal/form.ts
+var formCollections = /* @__PURE__ */ new WeakMap();
+var reportValidityOverloads = /* @__PURE__ */ new WeakMap();
+var checkValidityOverloads = /* @__PURE__ */ new WeakMap();
+var userInteractedControls = /* @__PURE__ */ new WeakSet();
+var interactions = /* @__PURE__ */ new WeakMap();
+var FormControlController = class {
+  constructor(host, options) {
+    this.handleFormData = (event) => {
+      const disabled = this.options.disabled(this.host);
+      const name = this.options.name(this.host);
+      const value = this.options.value(this.host);
+      const isButton = this.host.tagName.toLowerCase() === "pc-button";
+      if (this.host.isConnected && !disabled && !isButton && typeof name === "string" && name.length > 0 && typeof value !== "undefined") {
+        if (Array.isArray(value)) {
+          value.forEach((val) => {
+            event.formData.append(
+              name,
+              val.toString()
+            );
+          });
+        } else {
+          event.formData.append(
+            name,
+            value.toString()
+          );
+        }
+      }
+    };
+    this.handleFormSubmit = (event) => {
+      const disabled = this.options.disabled(this.host);
+      const reportValidity = this.options.reportValidity;
+      if (this.form && !this.form.noValidate) {
+        formCollections.get(this.form)?.forEach((control) => {
+          this.setUserInteracted(control, true);
+        });
+      }
+      if (this.form && !this.form.noValidate && !disabled && !reportValidity(this.host)) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+      }
+    };
+    this.handleFormReset = () => {
+      this.options.setValue(this.host, this.options.defaultValue(this.host));
+      this.setUserInteracted(this.host, false);
+      interactions.set(this.host, []);
+    };
+    this.handleInteraction = (event) => {
+      const emittedEvents = interactions.get(this.host);
+      if (!emittedEvents.includes(event.type)) {
+        emittedEvents.push(event.type);
+      }
+      if (emittedEvents.length === this.options.assumeInteractionOn.length) {
+        this.setUserInteracted(this.host, true);
+      }
+    };
+    this.checkFormValidity = () => {
+      if (this.form && !this.form.noValidate) {
+        const elements = this.form.querySelectorAll("*");
+        for (const element of elements) {
+          if (typeof element.checkValidity === "function") {
+            if (!element.checkValidity()) {
+              return false;
+            }
+          }
+        }
+      }
+      return true;
+    };
+    this.reportFormValidity = () => {
+      if (this.form && !this.form.noValidate) {
+        const elements = this.form.querySelectorAll("*");
+        for (const element of elements) {
+          if (typeof element.reportValidity === "function") {
+            if (!element.reportValidity()) {
+              return false;
+            }
+          }
+        }
+      }
+      return true;
+    };
+    (this.host = host).addController(this);
+    this.options = {
+      form: (input) => {
+        const formID = input.form;
+        if (formID) {
+          const root = input.getRootNode();
+          const form = root.querySelector(`#${formID}`);
+          if (form) {
+            return form;
+          }
+        }
+        return input.closest("form");
+      },
+      name: (input) => input.name,
+      value: (input) => input.value,
+      defaultValue: (input) => input.defaultValue,
+      disabled: (input) => input.disabled ?? false,
+      reportValidity: (input) => typeof input.reportValidity === "function" ? input.reportValidity() : true,
+      checkValidity: (input) => typeof input.checkValidity === "function" ? input.checkValidity() : true,
+      setValue: (input, value) => input.value = value,
+      assumeInteractionOn: ["pc-input"],
+      ...options
+    };
+  }
+  hostConnected() {
+    const form = this.options.form(this.host);
+    if (form) {
+      this.attachForm(form);
+    }
+    interactions.set(this.host, []);
+    this.options.assumeInteractionOn.forEach((event) => {
+      this.host.addEventListener(event, this.handleInteraction);
+    });
+  }
+  hostDisconnected() {
+    this.detachForm();
+    interactions.delete(this.host);
+    this.options.assumeInteractionOn.forEach((event) => {
+      this.host.removeEventListener(event, this.handleInteraction);
+    });
+  }
+  hostUpdated() {
+    const form = this.options.form(this.host);
+    if (!form) {
+      this.detachForm();
+    }
+    if (form && this.form !== form) {
+      this.detachForm();
+      this.attachForm(form);
+    }
+    if (this.host.hasUpdated) {
+      this.setValidity(this.host.validity.valid);
+    }
+  }
+  attachForm(form) {
+    if (form) {
+      this.form = form;
+      if (formCollections.has(this.form)) {
+        formCollections.get(this.form).add(this.host);
+      } else {
+        formCollections.set(
+          this.form,
+          /* @__PURE__ */ new Set([this.host])
+        );
+      }
+      this.form.addEventListener("formdata", this.handleFormData);
+      this.form.addEventListener("submit", this.handleFormSubmit);
+      this.form.addEventListener("reset", this.handleFormReset);
+      if (!reportValidityOverloads.has(this.form)) {
+        reportValidityOverloads.set(
+          this.form,
+          this.form.reportValidity
+        );
+        this.form.reportValidity = () => this.reportFormValidity();
+      }
+      if (!checkValidityOverloads.has(this.form)) {
+        checkValidityOverloads.set(this.form, this.form.checkValidity);
+        this.form.checkValidity = () => this.checkFormValidity();
+      }
+    } else {
+      this.form = void 0;
+    }
+  }
+  detachForm() {
+    if (!this.form) {
+      return;
+    }
+    const formCollection = formCollections.get(this.form);
+    if (!formCollection) {
+      return;
+    }
+    formCollection.delete(this.host);
+    if (formCollection.size <= 0) {
+      this.form.removeEventListener("formdata", this.handleFormData);
+      this.form.removeEventListener("submit", this.handleFormSubmit);
+      this.form.removeEventListener("reset", this.handleFormReset);
+      if (reportValidityOverloads.has(this.form)) {
+        this.form.reportValidity = reportValidityOverloads.get(
+          this.form
+        );
+        reportValidityOverloads.delete(this.form);
+      }
+      if (checkValidityOverloads.has(this.form)) {
+        this.form.checkValidity = checkValidityOverloads.get(
+          this.form
+        );
+        checkValidityOverloads.delete(this.form);
+      }
+      this.form = void 0;
+    }
+  }
+  setUserInteracted(element, hasInteracted) {
+    if (hasInteracted) {
+      userInteractedControls.add(element);
+    } else {
+      userInteractedControls.delete(element);
+    }
+    element.requestUpdate();
+  }
+  doAction(type, submitter) {
+    if (this.form) {
+      const button = document.createElement("button");
+      button.type = type;
+      button.style.position = "absolute";
+      button.style.inlineSize = "0";
+      button.style.blockSize = "0";
+      button.style.width = "0";
+      button.style.height = "0";
+      button.style.clipPath = "inset(50%)";
+      button.style.overflow = "hidden";
+      button.style.whiteSpace = "nowrap";
+      if (submitter) {
+        button.name = submitter.name;
+        button.value = submitter.value;
+        [
+          "formaction",
+          "formenctype",
+          "formmethod",
+          "formnovalidate",
+          "formtarget"
+        ].forEach((attribute) => {
+          if (submitter.hasAttribute(attribute)) {
+            button.setAttribute(
+              attribute,
+              submitter.getAttribute(attribute)
+            );
+          }
+        });
+      }
+      this.form.append(button);
+      button.click();
+      button.remove();
+    }
+  }
+  /** Returns the associated `<form>` element, if one exists. */
+  getForm() {
+    return this.form ?? null;
+  }
+  /** Resets the form, restoring all form controls to their default value. */
+  reset(submitter) {
+    this.doAction("reset", submitter);
+  }
+  /** Submits the form, triggering validation and form data injection. */
+  submit(submitter) {
+    this.doAction("submit", submitter);
+  }
+  /** Synchronously sets the form control’s validity. Call this when you know the future validity state but need to update the host element immediately (i.e., before Lit updates the component in the next update). */
+  setValidity(isValid) {
+    const host = this.host;
+    const hasInteracted = Boolean(userInteractedControls.has(host));
+    const required = Boolean(host.required);
+    host.toggleAttribute("data-required", required);
+    host.toggleAttribute("data-optional", !required);
+    host.toggleAttribute("data-invalid", !isValid);
+    host.toggleAttribute("data-valid", isValid);
+    host.toggleAttribute("data-user-invalid", !isValid && hasInteracted);
+    host.toggleAttribute("data-user-valid", isValid && hasInteracted);
+  }
+  /** Updates the form control’s validity based on the current value of `host.validity.valid`. Call this when anything that affects constraint validation changes so the component receives the correct validity states. */
+  updateValidity() {
+    const host = this.host;
+    this.setValidity(host.validity.valid);
+  }
+  /** Dispatches a non‐bubbling, cancellable custom event called `pc-invalid`. If the `pc-invalid` event will be cancelled, then the original `invalid` event (which may have been passed as an argument) will also be cancelled. If no original `invalid` event has been passed, then the `pc-invalid` event will be cancelled before being dispatched. */
+  emitInvalidEvent(originalInvalidEvent) {
+    const pcInvalidEvent = new CustomEvent(
+      "pc-invalid",
+      {
+        bubbles: false,
+        composed: false,
+        cancelable: true,
+        detail: {}
+      }
+    );
+    if (!originalInvalidEvent) {
+      pcInvalidEvent.preventDefault();
+    }
+    if (!this.host.dispatchEvent(pcInvalidEvent)) {
+      originalInvalidEvent?.preventDefault();
+    }
+  }
+};
+var validValidityState = Object.freeze({
+  badInput: false,
+  customError: false,
+  patternMismatch: false,
+  rangeOverflow: false,
+  rangeUnderflow: false,
+  stepMismatch: false,
+  tooLong: false,
+  tooShort: false,
+  typeMismatch: false,
+  valid: true,
+  valueMissing: false
+});
+var valueMissingValidityState = Object.freeze({
+  ...validValidityState,
+  valid: false,
+  valueMissing: true
+});
+var customErrorValidityState = Object.freeze({
+  ...validValidityState,
+  valid: false,
+  customError: true
+});
+
+// src/internal/slot.ts
+var HasSlotController = class {
+  constructor(host, ...slotNames) {
+    this.slotNames = [];
+    this.handleSlotChange = (event) => {
+      const slot = event.target;
+      if (this.slotNames.includes("[default]") && !slot.name || slot.name && this.slotNames.includes(slot.name)) {
+        this.host.requestUpdate();
+      }
+    };
+    (this.host = host).addController(this);
+    this.slotNames = slotNames;
+  }
+  hasDefaultSlot() {
+    return Array.from(this.host.childNodes).some((node) => {
+      if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== "") {
+        return true;
+      }
+      if (node.nodeType === node.ELEMENT_NODE) {
+        const element = node;
+        const tagName = element.tagName.toLowerCase();
+        if (tagName === "sl-visually-hidden") {
+          return false;
+        }
+        if (!element.hasAttribute("slot")) {
+          return true;
+        }
+      }
+      return false;
+    });
+  }
+  hasNamedSlot(name) {
+    return this.host.querySelector(`:scope > [slot="${name}"]`) !== null;
+  }
+  test(slotName) {
+    return slotName === "[default]" ? this.hasDefaultSlot() : this.hasNamedSlot(slotName);
+  }
+  hostConnected() {
+    this.host.shadowRoot.addEventListener(
+      "slotchange",
+      this.handleSlotChange
+    );
+  }
+  hostDisconnected() {
+    this.host.shadowRoot.removeEventListener(
+      "slotchange",
+      this.handleSlotChange
+    );
+  }
+};
+
+// src/translations/index.ts
+var connectedElements = /* @__PURE__ */ new Set();
+var translations = /* @__PURE__ */ new Map();
+var fallback;
+var documentDirection = "ltr";
+var documentLanguage = "en";
+var isClient = typeof MutationObserver !== "undefined" && typeof document !== "undefined" && typeof document.documentElement !== "undefined";
+if (isClient) {
+  const documentElementObserver = new MutationObserver(update);
+  documentDirection = document.documentElement.dir || "ltr";
+  documentLanguage = document.documentElement.lang || navigator.language;
+  documentElementObserver.observe(document.documentElement, {
+    attributes: true,
+    attributeFilter: ["dir", "lang"]
+  });
+}
+function registerTranslation(...translation2) {
+  translation2.map((t6) => {
+    const code = t6.$code.toLowerCase();
+    if (translations.has(code)) {
+      translations.set(code, { ...translations.get(code), ...t6 });
+    } else {
+      translations.set(code, t6);
+    }
+    if (!fallback) {
+      fallback = t6;
+    }
+  });
+  update();
+}
+function update() {
+  if (isClient) {
+    documentDirection = document.documentElement.dir || "ltr";
+    documentLanguage = document.documentElement.lang || navigator.language;
+  }
+  [...connectedElements.keys()].map((element) => {
+    if (element instanceof i4 && typeof element.requestUpdate === "function") {
+      element.requestUpdate();
+    }
+  });
+}
+var LocalizeController = class {
+  constructor(host) {
+    this.host = host;
+    this.host.addController(this);
+  }
+  hostConnected() {
+    connectedElements.add(this.host);
+  }
+  hostDisconnected() {
+    connectedElements.delete(this.host);
+  }
+  /** Gets the host element’s direction as determined by the `dir` attribute. The returned value is lowercase. */
+  dir() {
+    return `${this.host.dir || documentDirection}`.toLowerCase();
+  }
+  /** Gets the host element’s language as determined by the `lang` attribute. The returned value is lowercase. */
+  lang() {
+    return `${this.host.lang || documentLanguage}`.toLowerCase();
+  }
+  getTranslationData(lang) {
+    const locale = new Intl.Locale(lang.replace(/_/g, "-"));
+    const language = locale?.language.toLowerCase();
+    const region = locale?.region?.toLowerCase() ?? "";
+    const primary = translations.get(`${language}-${region}`);
+    const secondary = translations.get(language);
+    return { locale, language, region, primary, secondary };
+  }
+  /** Determines if the specified term exists, optionally checking the fallback translation. */
+  exists(key, options) {
+    const { primary, secondary } = this.getTranslationData(
+      options.lang ?? this.lang()
+    );
+    options = {
+      includeFallback: false,
+      ...options
+    };
+    if (primary && primary[key] || secondary && secondary[key] || options.includeFallback && fallback && fallback[key]) {
+      return true;
+    }
+    return false;
+  }
+  /** Outputs a translated term. */
+  term(key, ...args) {
+    const { primary, secondary } = this.getTranslationData(this.lang());
+    let term;
+    if (primary && primary[key]) {
+      term = primary[key];
+    } else if (secondary && secondary[key]) {
+      term = secondary[key];
+    } else if (fallback && fallback[key]) {
+      term = fallback[key];
+    } else {
+      console.error(`No translation was found for \u201C${String(key)}\u201D.`);
+      return String(key);
+    }
+    if (typeof term === "function") {
+      return term(...args);
+    }
+    return term;
+  }
+  /** Outputs a localised date in the specified format. */
+  date(dateToFormat, options) {
+    dateToFormat = new Date(dateToFormat);
+    return new Intl.DateTimeFormat(this.lang(), options).format(
+      dateToFormat
+    );
+  }
+  /** Outputs a localised number in the specified format. */
+  number(numberToFormat, options) {
+    numberToFormat = Number(numberToFormat);
+    return isNaN(numberToFormat) ? "" : new Intl.NumberFormat(this.lang(), options).format(
+      numberToFormat
+    );
+  }
+  /** Outputs a localised time in relative format. */
+  relativeTime(value, unit, options) {
+    return new Intl.RelativeTimeFormat(this.lang(), options).format(
+      value,
+      unit
+    );
+  }
+};
+
+// src/translations/en.ts
+var translation = {
+  $code: "en",
+  $name: "English",
+  $dir: "ltr",
+  carousel: "Carousel",
+  clearEntry: "Clear entry",
+  close: "Close",
+  copied: "Copied!",
+  copy: "Copy",
+  currentValue: "Current value",
+  error: "Error",
+  goToSlide: (slide, count) => `Go to slide ${slide} of ${count}`,
+  hidePassword: "Hide password",
+  hue: "Hue",
+  loading: "Loading\u2026",
+  nextSlide: "Next slide",
+  numOptionsSelected: (number) => {
+    if (number === 0) {
+      return "No options selected";
+    } else if (number === 1) {
+      return "One option selected";
+    } else {
+      return `${number} options selected`;
+    }
+  },
+  opacity: "Opacity",
+  pickAColorFromTheScreen: "Pick a color from the screen",
+  previousSlide: "Previous slide",
+  progress: "Progress",
+  remove: "Remove",
+  resize: "Resize",
+  scrollableRegion: "Scrollable region",
+  scrollToEnd: "Scroll to end",
+  scrollToStart: "Scroll to start",
+  showPassword: "Show password",
+  slideNum: (slide) => `Slide ${slide}`,
+  toggleColorFormat: "Toggle color format"
+};
+registerTranslation(translation);
+var en_default = translation;
+
+// src/utilities/localize.ts
+var LocalizeController2 = class extends LocalizeController {
+};
+registerTranslation(en_default);
+
+// src/internal/default-value.ts
+var defaultValue = (propertyName = "value") => (proto, key) => {
+  const constructor = proto.constructor;
+  const attributeChangedCallback = constructor.prototype.attributeChangedCallback;
+  constructor.prototype.attributeChangedCallback = function(name, old, value) {
+    const options = constructor.getPropertyOptions(propertyName);
+    const attributeName = typeof options.attribute === "string" ? options.attribute : propertyName;
+    if (name === attributeName) {
+      const converter = options.converter || u;
+      const fromAttribute = typeof converter === "function" ? converter : converter?.fromAttribute ?? u.fromAttribute;
+      const newValue = fromAttribute(value, options.type);
+      if (this[propertyName] !== newValue) {
+        this[key] = newValue;
+      }
+    }
+    attributeChangedCallback.call(this, name, old, value);
+  };
+};
+
+// src/internal/watch.ts
+function watch(propertyName, options) {
+  const resolvedOptions = {
+    waitUntilFirstUpdate: false,
+    ...options
+  };
+  return (proto, decoratedFnName) => {
+    const { update: update2 } = proto;
+    const watchedProperties = Array.isArray(propertyName) ? propertyName : [propertyName];
+    proto.update = function(changedProps) {
+      watchedProperties.forEach((property) => {
+        const key = property;
+        if (changedProps.has(key)) {
+          const oldValue = changedProps.get(key);
+          const newValue = this[key];
+          if (oldValue !== newValue) {
+            if (!resolvedOptions.waitUntilFirstUpdate || this.hasUpdated) {
+              this[decoratedFnName](
+                oldValue,
+                newValue
+              );
+            }
+          }
+        }
+      });
+      update2.call(this, changedProps);
+    };
+  };
+}
+
+// src/internal/emit.ts
+function emit(target, eventName, eventDetail) {
+  const { detail, cancelable, ...options } = eventDetail || {};
+  const event = new CustomEvent(eventName, {
+    bubbles: true,
+    cancelable: cancelable !== void 0 ? cancelable : false,
+    composed: true,
+    detail,
+    ...options
+  });
+  target.dispatchEvent(event);
+  return event;
+}
+
+// src/utilities/kit-code.ts
+var kitCode = "";
+function setKitCode(code) {
+  kitCode = code;
+}
+function getKitCode() {
+  if (!kitCode) {
+    const element = document.querySelector("[data-fa-kit-code]");
+    if (element) {
+      setKitCode(element.getAttribute("data-fa-kit-code") || "");
+    }
+  }
+  return kitCode;
+}
+
+// src/components/icon/library.default.ts
+var faVersion = "7.1.0";
+function getIconURL(name, iconStyle, autoWidth) {
+  const basePath = autoWidth ? "svgs" : "svgs-full";
+  const kitCode2 = getKitCode();
+  const isPro = kitCode2.length > 0;
+  return isPro ? `https://ka-p.fontawesome.com/releases/v${faVersion}/${basePath}/${iconStyle}/${name}.svg?token=${encodeURIComponent(kitCode2)}` : `https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@${faVersion}/${basePath}/${iconStyle}/${name}.svg`;
+}
+var library = {
+  name: "default",
+  resolver: (name, iconStyle = "solid", autoWidth = false) => {
+    return getIconURL(name, iconStyle, autoWidth);
+  },
+  mutator: (svg, hostElement) => {
+    if (hostElement?.iconStyle && !svg.hasAttribute("data-duotone-initialized")) {
+      const { iconStyle } = hostElement;
+      if (iconStyle?.startsWith("duotone") || iconStyle?.startsWith("sharp-duotone") || iconStyle === "jelly-duo-regular" || iconStyle === "notdog-duo-solid" || iconStyle?.startsWith("thumbprint") || iconStyle === "utility-duo-semibold") {
+        const paths = [...svg.querySelectorAll("path")];
+        const primaryPath = paths.find(
+          (path) => !path.hasAttribute("opacity")
+        );
+        const secondaryPath = paths.find(
+          (path) => path.hasAttribute("opacity")
+        );
+        if (!primaryPath || !secondaryPath) {
+          return;
+        }
+        primaryPath.setAttribute("data-duotone-primary", "");
+        secondaryPath.setAttribute("data-duotone-secondary", "");
+        if (hostElement.swapOpacity && primaryPath && secondaryPath) {
+          const originalOpacity = secondaryPath.getAttribute("opacity") || "0.4";
+          primaryPath.style.setProperty(
+            "--fa-primary-opacity",
+            originalOpacity
+          );
+          secondaryPath.style.setProperty(
+            "--fa-secondary-opacity",
+            "1"
+          );
+        }
+        svg.setAttribute("data-duotone-initialized", "");
+      }
+    }
+  }
+};
+var library_default_default = library;
+
+// src/components/icon/library.system.ts
+var icons = {
+  solid: {
+    "check": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M530.8 134.1C545.1 144.5 548.3 164.5 537.9 178.8L281.9 530.8C276.4 538.4 267.9 543.1 258.5 543.9C249.1 544.7 240 541.2 233.4 534.6L105.4 406.6C92.9 394.1 92.9 373.8 105.4 361.3C117.9 348.8 138.2 348.8 150.7 361.3L252.2 462.8L486.2 141.1C496.6 126.8 516.6 123.6 530.9 134z"
+                />
+            </svg>
+        `,
+    "chevron-down": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M297.4 470.6C309.9 483.1 330.2 483.1 342.7 470.6L534.7 278.6C547.2 266.1 547.2 245.8 534.7 233.3C522.2 220.8 501.9 220.8 489.4 233.3L320 402.7L150.6 233.4C138.1 220.9 117.8 220.9 105.3 233.4C92.8 245.9 92.8 266.2 105.3 278.7L297.3 470.7z"
+                />
+            </svg>
+        `,
+    "chevron-left": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M169.4 297.4C156.9 309.9 156.9 330.2 169.4 342.7L361.4 534.7C373.9 547.2 394.2 547.2 406.7 534.7C419.2 522.2 419.2 501.9 406.7 489.4L237.3 320L406.6 150.6C419.1 138.1 419.1 117.8 406.6 105.3C394.1 92.8 373.8 92.8 361.3 105.3L169.3 297.3z"
+                />
+            </svg>
+        `,
+    "chevron-right": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M471.1 297.4C483.6 309.9 483.6 330.2 471.1 342.7L279.1 534.7C266.6 547.2 246.3 547.2 233.8 534.7C221.3 522.2 221.3 501.9 233.8 489.4L403.2 320L233.9 150.6C221.4 138.1 221.4 117.8 233.9 105.3C246.4 92.8 266.7 92.8 279.2 105.3L471.2 297.3z"
+                />
+            </svg>
+        `,
+    "eye-dropper": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M405.6 93.2L304 194.8L294.6 185.4C282.1 172.9 261.8 172.9 249.3 185.4C236.8 197.9 236.8 218.2 249.3 230.7L409.3 390.7C421.8 403.2 442.1 403.2 454.6 390.7C467.1 378.2 467.1 357.9 454.6 345.4L445.2 336L546.8 234.4C585.8 195.4 585.8 132.2 546.8 93.3C507.8 54.4 444.6 54.3 405.7 93.3zM119.4 387.3C104.4 402.3 96 422.7 96 443.9L96 486.3L69.4 526.2C60.9 538.9 62.6 555.8 73.4 566.6C84.2 577.4 101.1 579.1 113.8 570.6L153.7 544L196.1 544C217.3 544 237.7 535.6 252.7 520.6L362.1 411.2L316.8 365.9L207.4 475.3C204.4 478.3 200.3 480 196.1 480L160 480L160 443.9C160 439.7 161.7 435.6 164.7 432.6L274.1 323.2L228.8 277.9L119.4 387.3z"
+                />
+            </svg>
+        `,
+    "grip-vertical": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M288 104C288 81.9 270.1 64 248 64L200 64C177.9 64 160 81.9 160 104L160 152C160 174.1 177.9 192 200 192L248 192C270.1 192 288 174.1 288 152L288 104zM288 296C288 273.9 270.1 256 248 256L200 256C177.9 256 160 273.9 160 296L160 344C160 366.1 177.9 384 200 384L248 384C270.1 384 288 366.1 288 344L288 296zM160 488L160 536C160 558.1 177.9 576 200 576L248 576C270.1 576 288 558.1 288 536L288 488C288 465.9 270.1 448 248 448L200 448C177.9 448 160 465.9 160 488zM480 104C480 81.9 462.1 64 440 64L392 64C369.9 64 352 81.9 352 104L352 152C352 174.1 369.9 192 392 192L440 192C462.1 192 480 174.1 480 152L480 104zM352 296L352 344C352 366.1 369.9 384 392 384L440 384C462.1 384 480 366.1 480 344L480 296C480 273.9 462.1 256 440 256L392 256C369.9 256 352 273.9 352 296zM480 488C480 465.9 462.1 448 440 448L392 448C369.9 448 352 465.9 352 488L352 536C352 558.1 369.9 576 392 576L440 576C462.1 576 480 558.1 480 536L480 488z"
+                />
+            </svg>
+        `,
+    "minus": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M96 320C96 302.3 110.3 288 128 288L512 288C529.7 288 544 302.3 544 320C544 337.7 529.7 352 512 352L128 352C110.3 352 96 337.7 96 320z"
+                />
+            </svg>
+        `,
+    "star": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M341.5 45.1C337.4 37.1 329.1 32 320.1 32C311.1 32 302.8 37.1 298.7 45.1L225.1 189.3L65.2 214.7C56.3 216.1 48.9 222.4 46.1 231C43.3 239.6 45.6 249 51.9 255.4L166.3 369.9L141.1 529.8C139.7 538.7 143.4 547.7 150.7 553C158 558.3 167.6 559.1 175.7 555L320.1 481.6L464.4 555C472.4 559.1 482.1 558.3 489.4 553C496.7 547.7 500.4 538.8 499 529.8L473.7 369.9L588.1 255.4C594.5 249 596.7 239.6 593.9 231C591.1 222.4 583.8 216.1 574.8 214.7L415 189.3L341.5 45.1z"
+                />
+            </svg>
+        `,
+    "user": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M320 312C386.3 312 440 258.3 440 192C440 125.7 386.3 72 320 72C253.7 72 200 125.7 200 192C200 258.3 253.7 312 320 312zM290.3 368C191.8 368 112 447.8 112 546.3C112 562.7 125.3 576 141.7 576L498.3 576C514.7 576 528 562.7 528 546.3C528 447.8 448.2 368 349.7 368L290.3 368z"
+                />
+            </svg>
+        `,
+    "xmark": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M183.1 137.4C170.6 124.9 150.3 124.9 137.8 137.4C125.3 149.9 125.3 170.2 137.8 182.7L275.2 320L137.9 457.4C125.4 469.9 125.4 490.2 137.9 502.7C150.4 515.2 170.7 515.2 183.2 502.7L320.5 365.3L457.9 502.6C470.4 515.1 490.7 515.1 503.2 502.6C515.7 490.1 515.7 469.8 503.2 457.3L365.8 320L503.1 182.6C515.6 170.1 515.6 149.8 503.1 137.3C490.6 124.8 470.3 124.8 457.8 137.3L320.5 274.7L183.1 137.4z"
+                />
+            </svg>
+        `
+  },
+  regular: {
+    "circle-question": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M528 320C528 205.1 434.9 112 320 112C205.1 112 112 205.1 112 320C112 434.9 205.1 528 320 528C434.9 528 528 434.9 528 320zM64 320C64 178.6 178.6 64 320 64C461.4 64 576 178.6 576 320C576 461.4 461.4 576 320 576C178.6 576 64 461.4 64 320zM320 240C302.3 240 288 254.3 288 272C288 285.3 277.3 296 264 296C250.7 296 240 285.3 240 272C240 227.8 275.8 192 320 192C364.2 192 400 227.8 400 272C400 319.2 364 339.2 344 346.5L344 350.3C344 363.6 333.3 374.3 320 374.3C306.7 374.3 296 363.6 296 350.3L296 342.2C296 321.7 310.8 307 326.1 302C332.5 299.9 339.3 296.5 344.3 291.7C348.6 287.5 352 281.7 352 272.1C352 254.4 337.7 240.1 320 240.1zM288 432C288 414.3 302.3 400 320 400C337.7 400 352 414.3 352 432C352 449.7 337.7 464 320 464C302.3 464 288 449.7 288 432z"
+                />
+            </svg>
+        `,
+    "circle-xmark": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M320 112C434.9 112 528 205.1 528 320C528 434.9 434.9 528 320 528C205.1 528 112 434.9 112 320C112 205.1 205.1 112 320 112zM320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576zM231 231C221.6 240.4 221.6 255.6 231 264.9L286 319.9L231 374.9C221.6 384.3 221.6 399.5 231 408.8C240.4 418.1 255.6 418.2 264.9 408.8L319.9 353.8L374.9 408.8C384.3 418.2 399.5 418.2 408.8 408.8C418.1 399.4 418.2 384.2 408.8 374.9L353.8 319.9L408.8 264.9C418.2 255.5 418.2 240.3 408.8 231C399.4 221.7 384.2 221.6 374.9 231L319.9 286L264.9 231C255.5 221.6 240.3 221.6 231 231z"
+                />
+            </svg>
+        `,
+    "copy": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M480 400L288 400C279.2 400 272 392.8 272 384L272 128C272 119.2 279.2 112 288 112L421.5 112C425.7 112 429.8 113.7 432.8 116.7L491.3 175.2C494.3 178.2 496 182.3 496 186.5L496 384C496 392.8 488.8 400 480 400zM288 448L480 448C515.3 448 544 419.3 544 384L544 186.5C544 169.5 537.3 153.2 525.3 141.2L466.7 82.7C454.7 70.7 438.5 64 421.5 64L288 64C252.7 64 224 92.7 224 128L224 384C224 419.3 252.7 448 288 448zM160 192C124.7 192 96 220.7 96 256L96 512C96 547.3 124.7 576 160 576L352 576C387.3 576 416 547.3 416 512L416 496L368 496L368 512C368 520.8 360.8 528 352 528L160 528C151.2 528 144 520.8 144 512L144 256C144 247.2 151.2 240 160 240L176 240L176 192L160 192z"
+                />
+            </svg>
+        `,
+    "eye": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M320 144C254.8 144 201.2 173.6 160.1 211.7C121.6 247.5 95 290 81.4 320C95 350 121.6 392.5 160.1 428.3C201.2 466.4 254.8 496 320 496C385.2 496 438.8 466.4 479.9 428.3C518.4 392.5 545 350 558.6 320C545 290 518.4 247.5 479.9 211.7C438.8 173.6 385.2 144 320 144zM127.4 176.6C174.5 132.8 239.2 96 320 96C400.8 96 465.5 132.8 512.6 176.6C559.4 220.1 590.7 272 605.6 307.7C608.9 315.6 608.9 324.4 605.6 332.3C590.7 368 559.4 420 512.6 463.4C465.5 507.1 400.8 544 320 544C239.2 544 174.5 507.2 127.4 463.4C80.6 419.9 49.3 368 34.4 332.3C31.1 324.4 31.1 315.6 34.4 307.7C49.3 272 80.6 220 127.4 176.6zM320 400C364.2 400 400 364.2 400 320C400 290.4 383.9 264.5 360 250.7C358.6 310.4 310.4 358.6 250.7 360C264.5 383.9 290.4 400 320 400zM240.4 311.6C242.9 311.9 245.4 312 248 312C283.3 312 312 283.3 312 248C312 245.4 311.8 242.9 311.6 240.4C274.2 244.3 244.4 274.1 240.5 311.5zM286 196.6C296.8 193.6 308.2 192.1 319.9 192.1C328.7 192.1 337.4 193 345.7 194.7C346 194.8 346.2 194.8 346.5 194.9C404.4 207.1 447.9 258.6 447.9 320.1C447.9 390.8 390.6 448.1 319.9 448.1C258.3 448.1 206.9 404.6 194.7 346.7C192.9 338.1 191.9 329.2 191.9 320.1C191.9 309.1 193.3 298.3 195.9 288.1C196.1 287.4 196.2 286.8 196.4 286.2C208.3 242.8 242.5 208.6 285.9 196.7z"
+                />
+            </svg>
+        `,
+    "eye-slash": `
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
+                <!--! Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+                <path
+                    d="M73 39.1C63.6 29.7 48.4 29.7 39.1 39.1C29.8 48.5 29.7 63.7 39 73.1L567 601.1C576.4 610.5 591.6 610.5 600.9 601.1C610.2 591.7 610.3 576.5 600.9 567.2L504.5 470.8C507.2 468.4 509.9 466 512.5 463.6C559.3 420.1 590.6 368.2 605.5 332.5C608.8 324.6 608.8 315.8 605.5 307.9C590.6 272.2 559.3 220.2 512.5 176.8C465.4 133.1 400.7 96.2 319.9 96.2C263.1 96.2 214.3 114.4 173.9 140.4L73 39.1zM208.9 175.1C241 156.2 278.1 144 320 144C385.2 144 438.8 173.6 479.9 211.7C518.4 247.4 545 290 558.5 320C544.9 350 518.3 392.5 479.9 428.3C476.8 431.1 473.7 433.9 470.5 436.7L425.8 392C439.8 371.5 448 346.7 448 320C448 249.3 390.7 192 320 192C293.3 192 268.5 200.2 248 214.2L208.9 175.1zM390.9 357.1L282.9 249.1C294 243.3 306.6 240 320 240C364.2 240 400 275.8 400 320C400 333.4 396.7 346 390.9 357.1zM135.4 237.2L101.4 203.2C68.8 240 46.4 279 34.5 307.7C31.2 315.6 31.2 324.4 34.5 332.3C49.4 368 80.7 420 127.5 463.4C174.6 507.1 239.3 544 320.1 544C357.4 544 391.3 536.1 421.6 523.4L384.2 486C364.2 492.4 342.8 496 320 496C254.8 496 201.2 466.4 160.1 428.3C121.6 392.6 95 350 81.5 320C91.9 296.9 110.1 266.4 135.5 237.2z"
+                />
+            </svg>
+        `
+  }
+};
+function dataURI(svg) {
+  return `data:image/svg+xml,${encodeURIComponent(svg)}`;
+}
+var systemLibrary = {
+  name: "system",
+  resolver: (name, iconStyle = "solid") => {
+    let collection = icons[iconStyle];
+    let svg = collection[name] ?? icons.regular[name] ?? icons.regular["circle-question"];
+    if (svg) {
+      return dataURI(svg);
+    }
+    return "";
+  }
+};
+var library_system_default = systemLibrary;
+
+// src/components/icon/library.ts
+var registry = [library_default_default, library_system_default];
+var watchedIcons = [];
+function watchIcon(icon) {
+  watchedIcons.push(icon);
+}
+function unwatchIcon(icon) {
+  watchedIcons = watchedIcons.filter((element) => element !== icon);
+}
+function getIconLibrary(name) {
+  return registry.find((library2) => library2.name === name);
+}
+
+// src/components/icon/icon.css
+var icon_default = ':host {\n    --fa-primary-color: currentColor;\n    --fa-secondary-color: currentColor;\n    --fa-primary-opacity: 1;\n    --fa-secondary-opacity: 0.4;\n\n    display: inline-flex;\n    justify-content: center;\n    box-sizing: content-box !important;\n    inline-size: auto;\n    block-size: 1em;\n}\n\nsvg {\n    display: inline-block;\n    inline-size: auto;\n    block-size: inherit;\n    fill: currentColor;\n    overflow: visible;\n}\n\n/* Fixed\u2010width icons */\n:host([library="default"]:not([auto-width])) svg *,\n:host([library="system"]:not([auto-width])) svg * {\n    /* This scaling gets rid of the whitespace around the icon grid. */\n    scale: 1.25;\n    transform-origin: center;\n}\n\n/* Primary layer */\nsvg path[data-duotone-primary] {\n    color: var(--fa-primary-color);\n    opacity: var(--fa-primary-opacity);\n}\n\n/* Secondary layer */\nsvg path[data-duotone-secondary] {\n    color: var(--fa-secondary-color);\n    opacity: var(--fa-secondary-opacity);\n}\n';
+
+// src/components/icon/icon.ts
+var CACHEABLE_ERROR = Symbol();
+var RETRYABLE_ERROR = Symbol();
+var parser;
+var iconCache = /* @__PURE__ */ new Map();
+var PcIcon = class extends PlacerElement {
+  constructor() {
+    super(...arguments);
+    this.svg = null;
+    this.iconStyle = "solid";
+    this.autoWidth = false;
+    this.swapOpacity = false;
+    this.label = "";
+    this.library = "default";
+    /** Given a URL, this function returns the resulting SVG element or an appropriate error icon. */
+    this.resolveIcon = async (url, library2) => {
+      let fileData;
+      if (library2?.spriteSheet) {
+        if (!this.hasUpdated) {
+          await this.updateComplete;
+        }
+        this.svg = x`
+                <svg part="svg">
+                    <use part="use" href=${url}></use>
+                </svg>
+            `;
+        await this.updateComplete;
+        const svg = this.shadowRoot.querySelector('[part="svg"]');
+        if (typeof library2.mutator === "function") {
+          library2.mutator(svg, this);
+        }
+        return this.svg;
+      }
+      try {
+        fileData = await fetch(url, { mode: "cors" });
+        if (!fileData.ok) {
+          return fileData.status === 410 ? CACHEABLE_ERROR : RETRYABLE_ERROR;
+        }
+      } catch {
+        return RETRYABLE_ERROR;
+      }
+      try {
+        const div = document.createElement("div");
+        div.innerHTML = await fileData.text();
+        const svg = div.firstElementChild;
+        if (svg?.tagName?.toLowerCase() !== "svg") {
+          return CACHEABLE_ERROR;
+        }
+        if (!parser) {
+          parser = new DOMParser();
+        }
+        const doc = parser.parseFromString(svg.outerHTML, "text/html");
+        const svgElement = doc.body.querySelector("svg");
+        if (!svgElement) {
+          return CACHEABLE_ERROR;
+        }
+        svgElement.part.add("svg");
+        return document.adoptNode(svgElement);
+      } catch {
+        return CACHEABLE_ERROR;
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    watchIcon(this);
+  }
+  firstUpdated(changedProperties) {
+    super.firstUpdated(changedProperties);
+    this.setIcon();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    unwatchIcon(this);
+  }
+  getIconSource() {
+    const library2 = getIconLibrary(this.library);
+    if (this.name && library2) {
+      return {
+        url: library2.resolver(
+          this.name,
+          this.iconStyle,
+          this.autoWidth
+        ),
+        fromLibrary: true
+      };
+    }
+    return {
+      url: this.src,
+      fromLibrary: false
+    };
+  }
+  handleLabelChange() {
+    const hasLabel = typeof this.label === "string" && this.label.length > 0;
+    if (hasLabel) {
+      this.setAttribute("role", "img");
+      this.setAttribute("aria-label", this.label);
+      this.removeAttribute("aria-hidden");
+    } else {
+      this.removeAttribute("role");
+      this.removeAttribute("aria-label");
+      this.setAttribute("aria-hidden", "true");
+    }
+  }
+  async setIcon() {
+    const { url, fromLibrary } = this.getIconSource();
+    const library2 = fromLibrary ? getIconLibrary(this.library) : void 0;
+    if (!url) {
+      this.svg = null;
+      return;
+    }
+    let iconResolver = iconCache.get(url);
+    if (!iconResolver) {
+      iconResolver = this.resolveIcon(url, library2);
+      iconCache.set(url, iconResolver);
+    }
+    const svg = await iconResolver;
+    if (svg === RETRYABLE_ERROR) {
+      iconCache.delete(url);
+    }
+    if (url !== this.getIconSource().url) {
+      return;
+    }
+    switch (svg) {
+      case RETRYABLE_ERROR:
+      case CACHEABLE_ERROR:
+        this.svg = null;
+        emit(this, "pc-error");
+        break;
+      default:
+        this.svg = svg.cloneNode(true);
+        library2?.mutator?.(this.svg, this);
+        emit(this, "pc-load");
+    }
+  }
+  updated(changedProperties) {
+    super.updated(changedProperties);
+    const library2 = getIconLibrary(this.library);
+    const svg = this.shadowRoot?.querySelector("svg");
+    if (svg) {
+      library2?.mutator?.(svg, this);
+    }
+  }
+  render() {
+    if (this.hasUpdated) {
+      return this.svg;
+    }
+    return x`
+            <svg part="svg" width="16" height="16" fill="currentColor"></svg>
+        `;
+  }
+};
+/** @internal This is an internal static property. */
+PcIcon.css = icon_default;
+__decorateClass([
+  r5()
+], PcIcon.prototype, "svg", 2);
+__decorateClass([
+  n4({ reflect: true })
+], PcIcon.prototype, "name", 2);
+__decorateClass([
+  n4({ attribute: "icon-style", reflect: true })
+], PcIcon.prototype, "iconStyle", 2);
+__decorateClass([
+  n4({ attribute: "auto-width", type: Boolean, reflect: true })
+], PcIcon.prototype, "autoWidth", 2);
+__decorateClass([
+  n4({ attribute: "swap-opacity", type: Boolean, reflect: true })
+], PcIcon.prototype, "swapOpacity", 2);
+__decorateClass([
+  n4()
+], PcIcon.prototype, "src", 2);
+__decorateClass([
+  n4()
+], PcIcon.prototype, "label", 2);
+__decorateClass([
+  n4({ reflect: true })
+], PcIcon.prototype, "library", 2);
+__decorateClass([
+  watch("label")
+], PcIcon.prototype, "handleLabelChange", 1);
+__decorateClass([
+  watch(["library", "iconStyle", "name", "src", "autoWidth", "swapOpacity"])
+], PcIcon.prototype, "setIcon", 1);
+PcIcon = __decorateClass([
+  t3("pc-icon")
+], PcIcon);
+
+// src/styles/component-styles/form-control.css
+var form_control_default = ':host {\n    display: flex;\n    flex-direction: column;\n}\n\n/* Labels */\n[part~="label"]:has(*:not(:empty)) {\n    display: inline-flex;\n    color: var(--pc-form-control-label-color);\n    font-weight: var(--pc-form-control-label-font-weight);\n    line-height: var(--pc-form-control-label-line-height);\n    margin-block-end: 0.5em;\n}\n\n:host([required]) [part="label"]::after {\n    content: var(--pc-form-control-required-content);\n    margin-inline-start: var(--pc-form-control-required-content-offset);\n    color: var(--pc-form-control-required-content-color);\n}\n\n/* Hints */\n[part~="hint"] {\n    display: block;\n    color: var(--pc-form-control-hint-color);\n    font-size: var(--pc-font-size-smaller);\n    font-weight: var(--pc-form-control-hint-font-weight);\n    line-height: var(--pc-form-control-hint-line-height);\n    margin-block-start: 0.5em;\n}\n\n[part~="hint"]:not(.has-hint) {\n    display: none;\n}\n';
+
+// src/styles/utilities/size.css
+var size_default = '@layer pc-utilities {\n    :host([size="small"]),\n    .pc-size-s {\n        font-size: var(--pc-font-size-s);\n    }\n\n    :host([size="medium"]),\n    .pc-size-m {\n        font-size: var(--pc-font-size-m);\n    }\n\n    :host([size="large"]),\n    .pc-size-l {\n        font-size: var(--pc-font-size-l);\n    }\n}\n';
+
+// src/components/input/input.css
+var input_default = ':host {\n    border-width: 0;\n}\n\n.text-field {\n    display: flex;\n    position: relative;\n    align-items: stretch;\n    justify-content: flex-start;\n    flex: auto;\n    inline-size: 100%;\n    block-size: var(--pc-form-control-height);\n    background-color: var(--pc-form-control-background-color);\n    color: var(--pc-form-control-value-color);\n    border: var(--pc-form-control-border-width)\n        var(--pc-form-control-border-style) var(--pc-form-control-border-color);\n    border-radius: var(--pc-form-control-border-radius);\n    padding: 0 var(--pc-form-control-padding-inline);\n    font-family: inherit;\n    font-weight: var(--pc-form-control-value-font-weight);\n    line-height: var(--pc-form-control-value-line-height);\n    vertical-align: middle;\n    overflow: hidden;\n    cursor: text;\n    transition: all var(--pc-transition-fast) ease-in-out;\n}\n\n@media (hover: hover) {\n    .text-field:not(:has(:disabled), :focus-within):hover {\n        border-color: color-mix(\n            in oklab,\n            var(--pc-form-control-border-color),\n            var(--pc-color-mix-hover)\n        );\n    }\n}\n\n.text-field:focus-within {\n    outline: var(--pc-focus-ring);\n    outline-offset: var(--pc-focus-ring-offset);\n    animation: focus-ring-animation var(--pc-transition-medium)\n        cubic-bezier(0.33, 1, 0.68, 1);\n}\n\n.text-field:has(:disabled) {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n:host([filled]) .text-field {\n    background-color: var(--pc-color-neutral-fill-quiet);\n    border-color: var(--pc-color-neutral-fill-quiet);\n}\n\n@media (hover: hover) {\n    :host([filled]) .text-field:not(:has(:disabled), :focus-within):hover {\n        background-color: color-mix(\n            in oklab,\n            var(--pc-color-neutral-fill-quiet),\n            var(--pc-color-mix-hover)\n        );\n        border-color: color-mix(\n            in oklab,\n            var(--pc-color-neutral-fill-quiet),\n            var(--pc-color-mix-hover)\n        );\n    }\n}\n\n:host([pill]) .text-field {\n    border-radius: var(--pc-border-radius-pill) !important;\n}\n\n.text-field input {\n    margin: 0;\n    padding: 0;\n    block-size: 100%;\n    border: none;\n    outline: none;\n    font: inherit;\n    cursor: inherit;\n    -webkit-appearance: none;\n}\n\n.text-field input:-webkit-autofill,\n.text-field input:-webkit-autofill:hover,\n.text-field input:-webkit-autofill:focus,\n.text-field input:-webkit-autofill:active {\n    background-color: transparent;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: inherit;\n}\n\n.text-field:has(:autofill),\n.text-field:has(:-webkit-autofill) {\n    background-color: var(--pc-color-primary-fill-quiet) !important;\n}\n\ninput {\n    background-color: transparent;\n    color: inherit;\n    min-inline-size: 0;\n    block-size: calc(var(--pc-form-control-height) - var(--border-width) * 1.5);\n    padding-block: 0;\n    flex: 1 1 auto;\n}\n\ninput:autofill,\ninput:autofill:hover,\ninput:autofill:focus,\ninput:autofill:active {\n    box-shadow: none;\n    caret-color: var(--pc-form-control-value-color);\n}\n\ninput::placeholder {\n    color: var(--pc-form-control-placeholder-color);\n    user-select: none;\n    -webkit-user-select: none;\n}\n\ninput::-webkit-search-decoration,\ninput::-webkit-search-cancel-button,\ninput::-webkit-search-results-button,\ninput::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n}\n\ninput:focus {\n    outline: none;\n}\n\n.prefix,\n.suffix {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 0 auto;\n    cursor: default;\n}\n\n.prefix::slotted(pc-icon),\n.suffix::slotted(pc-icon) {\n    color: var(--pc-color-neutral-on-quiet);\n}\n\n.prefix::slotted(*) {\n    margin-inline-end: var(--pc-form-control-padding-inline);\n}\n\n.suffix::slotted(*) {\n    margin-inline-start: var(--pc-form-control-padding-inline);\n}\n\n.clear,\n.password-toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: inherit;\n    color: var(--pc-color-neutral-on-quiet);\n    border: none;\n    background: none;\n    padding: 0;\n    cursor: pointer;\n    transition: color var(--pc-transition-fast) ease-in-out;\n}\n\n@media (hover: hover) {\n    .clear:hover,\n    .password-toggle:hover {\n        color: color-mix(\n            in oklab,\n            var(--pc-color-neutral-on-quiet),\n            var(--pc-color-mix-hover)\n        );\n    }\n}\n\n.clear:active,\n.password-toggle:active {\n    color: color-mix(\n        in oklab,\n        var(--pc-color-neutral-on-quiet),\n        var(--pc-color-mix-active)\n    );\n}\n\n.clear:focus,\n.password-toggle:focus {\n    outline: none;\n}\n\n::-ms-reveal {\n    display: none;\n}\n\n:host([no-spin-buttons]) input[type="number"] {\n    -moz-appearance: textfield;\n}\n\n:host([no-spin-buttons]) input[type="number"]::-webkit-outer-spin-button,\n:host([no-spin-buttons]) input[type="number"]::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    display: none;\n}\n\n@keyframes focus-ring-animation {\n    0% {\n        outline-width: 0;\n    }\n\n    50% {\n        outline-width: calc(var(--pc-focus-ring-width) * 2);\n    }\n\n    100% {\n        outline-width: var(--pc-focus-ring-width);\n    }\n}\n';
+
+// src/components/input/input.ts
+var PcInput = class extends PlacerElement {
+  constructor() {
+    super(...arguments);
+    this.formControlController = new FormControlController(this, {
+      assumeInteractionOn: ["pc-blur", "pc-input"]
+    });
+    this.hasSlotController = new HasSlotController(
+      this,
+      "label",
+      "hint"
+    );
+    this.localize = new LocalizeController2(this);
+    this.hasFocus = false;
+    this.__numberInput = Object.assign(document.createElement("input"), {
+      type: "number"
+    });
+    this.__dateInput = Object.assign(document.createElement("input"), {
+      type: "date"
+    });
+    this.title = "";
+    this.type = "text";
+    this.name = "";
+    this.value = "";
+    this.defaultValue = "";
+    this.size = "medium";
+    this.filled = false;
+    this.pill = false;
+    this.label = "";
+    this.hint = "";
+    this.clearable = false;
+    this.disabled = false;
+    this.placeholder = "";
+    this.readonly = false;
+    this.passwordToggle = false;
+    this.passwordVisible = false;
+    this.noSpinButtons = false;
+    this.form = "";
+    this.required = false;
+    this.autocapitalize = "none";
+    this.autocorrect = false;
+    this.enterkeyhint = "enter";
+    this.spellcheck = true;
+    this.inputmode = "text";
+  }
+  /** Gets or sets the current value as a `Date` object. Returns `null` fi the value can’t be converted. This will use the native `<input type="{{type}}" />` implementation and may result in an error. */
+  get valueAsDate() {
+    this.__dateInput.type = this.type;
+    this.__dateInput.value = this.value;
+    return this.input?.valueAsDate || this.__dateInput.valueAsDate;
+  }
+  set valueAsDate(newValue) {
+    this.__dateInput.type = this.type;
+    this.__dateInput.valueAsDate = newValue;
+    this.value = this.__dateInput.value;
+  }
+  /** Gets or sets the current value as a number. Returns `NaN` if the value can’t be converted. */
+  get valueAsNumber() {
+    this.__numberInput.value = this.value;
+    return this.input?.valueAsNumber || this.__numberInput.valueAsNumber;
+  }
+  set valueAsNumber(newValue) {
+    this.__numberInput.valueAsNumber = newValue;
+    this.value = this.__numberInput.value;
+  }
+  /** Gets the validity state object. */
+  get validity() {
+    return this.input.validity;
+  }
+  /** Gets the validation message. */
+  get validationMessage() {
+    return this.input.validationMessage;
+  }
+  firstUpdated() {
+    this.formControlController.updateValidity();
+  }
+  handleFocus() {
+    this.hasFocus = true;
+    emit(this, "pc-focus");
+  }
+  handleBlur() {
+    this.hasFocus = false;
+    emit(this, "pc-blur");
+  }
+  handleChange() {
+    this.value = this.input.value;
+    emit(this, "pc-change");
+  }
+  handleInput() {
+    this.value = this.input.value;
+    this.formControlController.updateValidity();
+    emit(this, "pc-input");
+  }
+  handleClearClick(event) {
+    event.preventDefault();
+    if (this.value !== "") {
+      this.value = "";
+      emit(this, "pc-clear");
+      emit(this, "pc-input");
+      emit(this, "pc-change");
+    }
+    this.input.focus();
+  }
+  handleKeyDown(event) {
+    const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;
+    if (event.key === "Enter" && !hasModifier) {
+      setTimeout(() => {
+        if (!event.defaultPrevented && !event.isComposing) {
+          this.formControlController.submit();
+        }
+      });
+    }
+  }
+  handlePasswordToggle() {
+    this.passwordVisible = !this.passwordVisible;
+  }
+  handleInvalid(event) {
+    this.formControlController.setValidity(false);
+    this.formControlController.emitInvalidEvent(event);
+  }
+  handleDisabledChange() {
+    this.formControlController.setValidity(this.disabled);
+  }
+  handleStepChange() {
+    this.input.step = String(this.step);
+    this.formControlController.updateValidity();
+  }
+  async handleValueChange() {
+    await this.updateComplete;
+    this.formControlController.updateValidity();
+  }
+  /** Focuses the input. */
+  focus(options) {
+    this.input.focus(options);
+  }
+  /** Unfocuses the input (i.e., blurs it). */
+  blur() {
+    this.input.blur();
+  }
+  /** Selects all the text in the input. */
+  select() {
+    this.input.select();
+  }
+  /** Sets the start and end positions of the text selection (0‐based). */
+  setSelectionRange(selectionStart, selectionEnd, selectionDirection = "none") {
+    this.input.setSelectionRange(
+      selectionStart,
+      selectionEnd,
+      selectionDirection
+    );
+  }
+  /** Replaces a range of text with a new string. */
+  setRangeText(replacement, start, end, selectMode = "preserve") {
+    const selectionStart = start ?? this.input.selectionStart;
+    const selectionEnd = end ?? this.input.selectionEnd;
+    this.input.setRangeText(
+      replacement,
+      selectionStart,
+      selectionEnd,
+      selectMode
+    );
+    if (this.value !== this.input.value) {
+      this.value = this.input.value;
+    }
+  }
+  /** Displays the browser picker for an input element. This only works if the browser supports it for the input type. */
+  showPicker() {
+    if ("showPicker" in HTMLInputElement.prototype) {
+      this.input.showPicker();
+    }
+  }
+  /** Increments the value of a numeric input type by the value of the step attribute. */
+  stepUp() {
+    this.input.stepUp();
+    if (this.value !== this.input.value) {
+      this.value = this.input.value;
+    }
+  }
+  /** Decrements the value of a numeric input type by the value of the step attribute. */
+  stepDown() {
+    this.input.stepDown();
+    if (this.value !== this.input.value) {
+      this.value = this.input.value;
+    }
+  }
+  /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
+  checkValidity() {
+    return this.input.checkValidity();
+  }
+  /** Gets the associated form, if one exists. */
+  getForm() {
+    return this.formControlController.getForm();
+  }
+  /** Checks for validity and shows the browser’s validation message if the input is invalid. */
+  reportValidity() {
+    return this.input.reportValidity();
+  }
+  /** Sets a custom validation message. Pass an empty string to restore validity. */
+  setCustomValidity(message) {
+    this.input.setCustomValidity(message);
+    this.formControlController.updateValidity();
+  }
+  render() {
+    const hasLabelSlot = this.hasSlotController.test("label");
+    const hasHintSlot = this.hasSlotController.test("hint");
+    const hasLabel = this.label ? true : !!hasLabelSlot;
+    const hasHint = this.hint ? true : !!hasHintSlot;
+    const hasClearIcon = this.clearable && !this.disabled && !this.readonly;
+    const isClearIconVisible = hasClearIcon && (typeof this.value === "number" || this.value.length > 0);
+    return x`
+            <label
+                part="label"
+                class="label"
+                for="input"
+                aria-hidden=${hasLabel ? "false" : "true"}
+            >
+                <slot name="label">${this.label}</slot>
+            </label>
+
+            <div part="input" class="text-field">
+                <slot class="prefix" part="prefix" name="prefix"></slot>
+
+                <input
+                    part="base"
+                    class="control"
+                    id="input"
+                    type=${this.type === "password" && this.passwordVisible ? "text" : this.type}
+                    title=${this.title}
+                    name=${o6(this.name)}
+                    ?disabled=${this.disabled}
+                    ?readonly=${this.readonly}
+                    ?required=${this.required}
+                    placeholder=${o6(this.placeholder)}
+                    min=${o6(this.min)}
+                    minlength=${o6(this.minlength)}
+                    max=${o6(this.max)}
+                    maxlength=${o6(this.maxlength)}
+                    step=${o6(this.step)}
+                    .value=${l3(this.value)}
+                    autocapitalize=${o6(this.autocapitalize)}
+                    autocomplete=${o6(this.autocomplete)}
+                    autocorrect=${o6(this.autocorrect)}
+                    ?autofocus=${this.autofocus}
+                    spellcheck=${this.spellcheck}
+                    pattern=${o6(this.pattern)}
+                    enterkeyhint=${o6(this.enterkeyhint)}
+                    inputmode=${o6(this.inputmode)}
+                    aria-describedby="hint"
+                    @focus=${this.handleFocus}
+                    @blur=${this.handleBlur}
+                    @change=${this.handleChange}
+                    @input=${this.handleInput}
+                    @keydown=${this.handleKeyDown}
+                    @invalid=${this.handleInvalid}
+                />
+
+                ${isClearIconVisible ? x`
+                          <button
+                              class="clear"
+                              part="clear-button"
+                              type="button"
+                              aria-label=${this.localize.term("clearEntry")}
+                              @click=${this.handleClearClick}
+                              tabindex="-1"
+                          >
+                              <slot name="clear-icon">
+                                  <pc-icon
+                                      library="system"
+                                      icon-style="regular"
+                                      name="circle-xmark"
+                                  ></pc-icon>
+                              </slot>
+                          </button>
+                      ` : ""}
+                ${this.passwordToggle && !this.disabled ? x`
+                          <button
+                              class="password-toggle"
+                              part="password-toggle-button"
+                              type="button"
+                              aria-label=${this.localize.term(
+      this.passwordVisible ? "hidePassword" : "showPassword"
+    )}
+                              @click=${this.handlePasswordToggle}
+                              tabindex="-1"
+                          >
+                              ${!this.passwordVisible ? x`
+                                        <slot name="show-password-icon">
+                                            <pc-icon
+                                                library="system"
+                                                icon-style="regular"
+                                                name="eye-slash"
+                                            ></pc-icon>
+                                        </slot>
+                                    ` : x`
+                                        <slot name="hide-password-icon">
+                                            <pc-icon
+                                                library="system"
+                                                icon-style="regular"
+                                                name="eye"
+                                            ></pc-icon>
+                                        </slot>
+                                    `}
+                          </button>
+                      ` : ""}
+
+                <slot class="suffix" part="suffix" name="suffix"></slot>
+            </div>
+
+            <slot
+                class=${e7({ "has-hint": hasHint })}
+                part="hint"
+                id="hint"
+                name="hint"
+                aria-hidden=${hasHint ? "false" : "true"}
+            >
+                ${this.hint}
+            </slot>
+        `;
+  }
+};
+/** @internal This is an internal static property. */
+PcInput.css = [form_control_default, size_default, input_default];
+/** @internal This is an internal static property. */
+PcInput.dependencies = { "pc-icon": PcIcon };
+__decorateClass([
+  e5(".control")
+], PcInput.prototype, "input", 2);
+__decorateClass([
+  r5()
+], PcInput.prototype, "hasFocus", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "title", 2);
+__decorateClass([
+  n4({ reflect: true })
+], PcInput.prototype, "type", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "name", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "value", 2);
+__decorateClass([
+  defaultValue()
+], PcInput.prototype, "defaultValue", 2);
+__decorateClass([
+  n4({ reflect: true })
+], PcInput.prototype, "size", 2);
+__decorateClass([
+  n4({ type: Boolean, reflect: true })
+], PcInput.prototype, "filled", 2);
+__decorateClass([
+  n4({ type: Boolean, reflect: true })
+], PcInput.prototype, "pill", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "label", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "hint", 2);
+__decorateClass([
+  n4({ type: Boolean })
+], PcInput.prototype, "clearable", 2);
+__decorateClass([
+  n4({ type: Boolean, reflect: true })
+], PcInput.prototype, "disabled", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "placeholder", 2);
+__decorateClass([
+  n4({ type: Boolean, reflect: true })
+], PcInput.prototype, "readonly", 2);
+__decorateClass([
+  n4({ attribute: "password-toggle", type: Boolean })
+], PcInput.prototype, "passwordToggle", 2);
+__decorateClass([
+  n4({ attribute: "password-visible", type: Boolean })
+], PcInput.prototype, "passwordVisible", 2);
+__decorateClass([
+  n4({ attribute: "no-spin-buttons", type: Boolean })
+], PcInput.prototype, "noSpinButtons", 2);
+__decorateClass([
+  n4({ reflect: true })
+], PcInput.prototype, "form", 2);
+__decorateClass([
+  n4({ type: Boolean, reflect: true })
+], PcInput.prototype, "required", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "pattern", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "minlength", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "maxlength", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "min", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "max", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "step", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "autocapitalize", 2);
+__decorateClass([
+  n4({
+    type: Boolean,
+    converter: {
+      fromAttribute: (value) => !value || value === "off" ? false : true,
+      toAttribute: (value) => value ? "on" : "off"
+    }
+  })
+], PcInput.prototype, "autocorrect", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "autocomplete", 2);
+__decorateClass([
+  n4({ type: Boolean })
+], PcInput.prototype, "autofocus", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "enterkeyhint", 2);
+__decorateClass([
+  n4({
+    type: Boolean,
+    converter: {
+      fromAttribute: (value) => !value || value === "off" ? false : true,
+      toAttribute: (value) => value ? "on" : "off"
+    }
+  })
+], PcInput.prototype, "spellcheck", 2);
+__decorateClass([
+  n4()
+], PcInput.prototype, "inputmode", 2);
+__decorateClass([
+  watch("disabled", { waitUntilFirstUpdate: true })
+], PcInput.prototype, "handleDisabledChange", 1);
+__decorateClass([
+  watch("step", { waitUntilFirstUpdate: true })
+], PcInput.prototype, "handleStepChange", 1);
+__decorateClass([
+  watch("value", { waitUntilFirstUpdate: true })
+], PcInput.prototype, "handleValueChange", 1);
+PcInput = __decorateClass([
+  t3("pc-input")
+], PcInput);
+export {
+  PcInput
+};
+/*! Bundled license information:
+
+@lit/reactive-element/css-tag.js:
+  (**
+   * @license
+   * Copyright 2019 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+
+@lit/reactive-element/reactive-element.js:
+lit-html/lit-html.js:
+lit-element/lit-element.js:
+@lit/reactive-element/decorators/custom-element.js:
+@lit/reactive-element/decorators/property.js:
+@lit/reactive-element/decorators/state.js:
+@lit/reactive-element/decorators/event-options.js:
+@lit/reactive-element/decorators/base.js:
+@lit/reactive-element/decorators/query.js:
+@lit/reactive-element/decorators/query-all.js:
+@lit/reactive-element/decorators/query-async.js:
+@lit/reactive-element/decorators/query-assigned-nodes.js:
+lit-html/directive.js:
+  (**
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+
+lit-html/is-server.js:
+  (**
+   * @license
+   * Copyright 2022 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+
+@lit/reactive-element/decorators/query-assigned-elements.js:
+  (**
+   * @license
+   * Copyright 2021 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+
+lit-html/directives/class-map.js:
+lit-html/directives/if-defined.js:
+  (**
+   * @license
+   * Copyright 2018 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+
+lit-html/directive-helpers.js:
+lit-html/directives/live.js:
+  (**
+   * @license
+   * Copyright 2020 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+*/