npm - @helixui/library - Versions diffs - 3.1.0 → 3.2.0 - Mend

@helixui/library 3.1.0 → 3.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (608) hide show

package/dist/shared/{hx-file-upload-B6Yl1u0i.js → hx-file-upload-zTDbjsRw.js} RENAMED Viewed

@@ -1,13 +1,14 @@
-import { css as g, nothing as p, html as f } from "lit";
-import { property as n, state as b, query as x, customElement as _ } from "lit/decorators.js";
+import { css as x, nothing as p, html as f } from "lit";
+import { property as n, state as b, query as g, customElement as _ } from "lit/decorators.js";
 import { classMap as y } from "lit/directives/class-map.js";
 import { ifDefined as v } from "lit/directives/if-defined.js";
 import { repeat as w } from "lit/directives/repeat.js";
 import { F as z } from "./FormMixin-B8PXk5RQ.js";
+import { b as F } from "./forced-colors-CTEDFRGa.js";
 import { m as $ } from "./aria-delegation-Doq6RRUy.js";
-import { c as F } from "./id-counter-DuX8vsui.js";
-import { H as D } from "./helix-element-BNEYeiys.js";
-const S = g`
+import { c as D } from "./id-counter-DuX8vsui.js";
+import { H as S } from "./helix-element-BNEYeiys.js";
+const k = x`
   :host {
     display: block;
   }
@@ -36,7 +37,7 @@ const S = g`
     gap: var(--hx-space-1, 0.25rem);
     font-size: var(--hx-font-size-sm, 0.875rem);
     font-weight: var(--hx-font-weight-medium, 500);
-    color: var(--hx-color-neutral-700, #334155);
+    color: var(--hx-color-text-strong, #202b39);
     line-height: var(--hx-line-height-normal, 1.5);
   }
@@ -51,9 +52,9 @@ const S = g`
     min-height: var(--hx-space-32, 8rem);
     padding: var(--hx-space-6, 1.5rem) var(--hx-space-4, 1rem);
     border: var(--hx-border-width-thin, 1px) dashed
-      var(--hx-file-upload-dropzone-border-color, var(--hx-color-neutral-300, #cbd5e1));
+      var(--hx-file-upload-dropzone-border-color, var(--hx-color-border-strong, #8e9c98));
     border-radius: var(--hx-file-upload-dropzone-border-radius, var(--hx-border-radius-lg, 0.5rem));
-    background-color: var(--hx-file-upload-dropzone-bg, var(--hx-color-neutral-50, #f8fafc));
+    background-color: var(--hx-file-upload-dropzone-bg, var(--hx-color-surface-raised, #f5f8f3));
     cursor: pointer;
     text-align: center;
     transition:
@@ -61,7 +62,7 @@ const S = g`
       background-color var(--hx-transition-fast, 150ms ease),
       box-shadow var(--hx-transition-fast, 150ms ease);
     user-select: none;
-    color: var(--hx-color-neutral-600, #475569);
+    color: var(--hx-color-text-secondary, #313e4b);
     font-size: var(--hx-font-size-sm, 0.875rem);
   }
@@ -79,20 +80,20 @@ const S = g`
   }
   .dropzone--drag-over {
-    border-color: var(--hx-color-primary-500, #2563eb);
+    border-color: var(--hx-color-primary-500, #429797);
     background-color: var(
       --hx-file-upload-dropzone-active-bg,
       color-mix(
         in srgb,
-        var(--hx-color-primary-500, #2563eb) 8%,
-        var(--hx-color-neutral-0, #ffffff)
+        var(--hx-color-primary-500, #429797) 8%,
+        var(--hx-color-surface-default, #ffffff)
       )
     );
     border-style: solid;
   }
   .dropzone--error {
-    border-color: var(--hx-file-upload-error-color, var(--hx-color-error-500, #dc2626));
+    border-color: var(--hx-file-upload-error-color, var(--hx-color-error-500, #e5493e));
   }
   @media (prefers-reduced-motion: reduce) {
@@ -137,9 +138,9 @@ const S = g`
     flex-direction: column;
     gap: var(--hx-space-1, 0.25rem);
     padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);
-    border: var(--hx-border-width-thin, 1px) solid var(--hx-color-neutral-200, #e2e8f0);
+    border: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-default, #d6dbd5);
     border-radius: var(--hx-border-radius-md, 0.375rem);
-    background-color: var(--hx-color-neutral-0, #ffffff);
+    background-color: var(--hx-color-surface-default, #ffffff);
   }
   .file-item__row {
@@ -152,7 +153,7 @@ const S = g`
     flex: 1;
     font-size: var(--hx-font-size-sm, 0.875rem);
     font-weight: var(--hx-font-weight-medium, 500);
-    color: var(--hx-color-neutral-800, #1e293b);
+    color: var(--hx-color-text-strong, #202b39);
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -161,7 +162,7 @@ const S = g`
   .file-item__size {
     flex-shrink: 0;
     font-size: var(--hx-font-size-xs, 0.75rem);
-    color: var(--hx-color-neutral-500, #64748b);
+    color: var(--hx-color-text-muted, #4a5362);
   }
   .file-item__remove {
@@ -175,7 +176,7 @@ const S = g`
     border: none;
     border-radius: var(--hx-border-radius-sm, 0.25rem);
     background: transparent;
-    color: var(--hx-color-neutral-500, #64748b);
+    color: var(--hx-color-text-muted, #4a5362);
     cursor: pointer;
     line-height: 1;
     transition:
@@ -184,8 +185,8 @@ const S = g`
   }
   .file-item__remove:hover {
-    color: var(--hx-file-upload-error-color, var(--hx-color-error-text, #b91c1c));
-    background-color: color-mix(in srgb, var(--hx-color-error-500, #dc2626) 8%, transparent);
+    color: var(--hx-file-upload-error-color, var(--hx-color-error-text, #c92a2a));
+    background-color: color-mix(in srgb, var(--hx-color-error-500, #e5493e) 8%, transparent);
   }
   .file-item__remove:focus-visible {
@@ -208,7 +209,7 @@ const S = g`
   .progress-track {
     width: 100%;
     height: var(--hx-file-upload-progress-height, var(--hx-space-1, 0.25rem));
-    background-color: var(--hx-color-neutral-200, #e2e8f0);
+    background-color: var(--hx-color-border-default, #d6dbd5);
     border-radius: var(--hx-border-radius-full, 9999px);
     overflow: hidden;
   }
@@ -216,7 +217,7 @@ const S = g`
   .progress-bar {
     height: 100%;
     width: 100%;
-    background-color: var(--hx-file-upload-progress-color, var(--hx-color-primary-500, #2563eb));
+    background-color: var(--hx-file-upload-progress-color, var(--hx-color-primary-500, #429797));
     border-radius: inherit;
     transform-origin: left center;
     transform: scaleX(var(--_progress-ratio, 0));
@@ -247,7 +248,7 @@ const S = g`
   .field__error {
     font-size: var(--hx-font-size-xs, 0.75rem);
-    color: var(--hx-file-upload-error-color, var(--hx-color-error-text, #b91c1c));
+    color: var(--hx-file-upload-error-color, var(--hx-color-error-text, #c92a2a));
     line-height: var(--hx-line-height-normal, 1.5);
   }
@@ -297,15 +298,15 @@ const S = g`
     }
   }
 `;
-var k = Object.defineProperty, L = Object.getOwnPropertyDescriptor, s = (e, r, t, i) => {
-  for (var l = i > 1 ? void 0 : i ? L(r, t) : r, a = e.length - 1, h; a >= 0; a--)
-    (h = e[a]) && (l = (i ? h(r, t, l) : h(l)) || l);
-  return i && l && k(r, t, l), l;
+var L = Object.defineProperty, C = Object.getOwnPropertyDescriptor, s = (e, r, t, i) => {
+  for (var l = i > 1 ? void 0 : i ? C(r, t) : r, a = e.length - 1, d; a >= 0; a--)
+    (d = e[a]) && (l = (i ? d(r, t, l) : d(l)) || l);
+  return i && l && L(r, t, l), l;
 };
-const C = F("hx-file-upload");
-let o = class extends z($(D)) {
+const I = D("hx-file-upload");
+let o = class extends z($(S)) {
   constructor() {
-    super(...arguments), this.name = "", this.accept = "", this.maxSize = 0, this.maxFiles = 0, this.multiple = !1, this.label = "", this.disabled = !1, this.error = "", this.labelDropzone = "Drag files here or click to browse", this.labelFileList = "Selected files", this.accessibleLabel = "", this.labelUploadProgress = (e, r) => `Upload progress for ${e}: ${r}%`, this.labelDragDetected = "File detected. Release to upload.", this._files = [], this._dragOver = !1, this._hasFileListSlot = !1, this._baseId = C(), this._labelId = `${this._baseId}-label`, this._errorId = `${this._baseId}-error`, this._dropzoneId = `${this._baseId}-dropzone`, this._liveId = `${this._baseId}-live`;
+    super(...arguments), this.name = "", this.accept = "", this.maxSize = 0, this.maxFiles = 0, this.multiple = !1, this.label = "", this.disabled = !1, this.error = "", this.labelDropzone = "Drag files here or click to browse", this.labelFileList = "Selected files", this.accessibleLabel = "", this.labelUploadProgress = (e, r) => `Upload progress for ${e}: ${r}%`, this.labelDragDetected = "File detected. Release to upload.", this._files = [], this._dragOver = !1, this._hasFileListSlot = !1, this._baseId = I(), this._labelId = `${this._baseId}-label`, this._errorId = `${this._baseId}-error`, this._dropzoneId = `${this._baseId}-dropzone`, this._liveId = `${this._baseId}-live`;
   }
   /**
    * Returns the effective label for the dropzone, checking accessible-label first,
@@ -414,8 +415,8 @@ let o = class extends z($(D)) {
         detail: { message: l.join(" "), files: i }
       })
     ), t.length === 0) return;
-    const a = this.multiple ? this._files.length : 0, h = this.maxFiles > 0 ? Math.max(0, this.maxFiles - a) : t.length, d = t.slice(0, h);
-    if (d.length === 0 && this.maxFiles > 0) {
+    const a = this.multiple ? this._files.length : 0, d = this.maxFiles > 0 ? Math.max(0, this.maxFiles - a) : t.length, h = t.slice(0, d);
+    if (h.length === 0 && this.maxFiles > 0) {
       this.dispatchEvent(
         new CustomEvent("hx-error", {
           bubbles: !0,
@@ -428,17 +429,17 @@ let o = class extends z($(D)) {
       );
       return;
     }
-    if (d.length > 0) {
-      const c = d.map((m) => ({ file: m, progress: 0 }));
+    if (h.length > 0) {
+      const c = h.map((m) => ({ file: m, progress: 0 }));
       this.multiple ? this._files = [...this._files, ...c] : this._files = c, this._handleInteractionInput(), this.dispatchEvent(
         new CustomEvent("hx-upload", {
           bubbles: !0,
           composed: !0,
-          detail: { files: d }
+          detail: { files: h }
         })
       );
     }
-    const u = t.slice(h);
+    const u = t.slice(d);
     u.length > 0 && this.maxFiles > 0 && this.dispatchEvent(
       new CustomEvent("hx-error", {
         bubbles: !0,
@@ -529,8 +530,8 @@ let o = class extends z($(D)) {
       } else {
         const a = (l = this.shadowRoot) == null ? void 0 : l.querySelectorAll(".file-item__remove");
         if (a && a.length > 0) {
-          const h = e < this._files.length ? e : this._files.length - 1, d = a[h];
-          d && d.focus();
+          const d = e < this._files.length ? e : this._files.length - 1, h = a[d];
+          h && h.focus();
         }
       }
     }).catch(() => {
@@ -662,7 +663,7 @@ let o = class extends z($(D)) {
     `;
   }
 };
-o.styles = [S];
+o.styles = [k, F];
 o.formAssociated = !0;
 s([
   n({ type: String, reflect: !0 })
@@ -713,7 +714,7 @@ s([
   b()
 ], o.prototype, "_hasFileListSlot", 2);
 s([
-  x(".file-input")
+  g(".file-input")
 ], o.prototype, "_fileInput", 2);
 o = s([
   _("hx-file-upload")
@@ -721,4 +722,4 @@ o = s([
 export {
   o as H
 };
-//# sourceMappingURL=hx-file-upload-B6Yl1u0i.js.map
+//# sourceMappingURL=hx-file-upload-zTDbjsRw.js.map

package/dist/shared/hx-file-upload-zTDbjsRw.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"hx-file-upload-zTDbjsRw.js","sources":["../../src/components/hx-file-upload/hx-file-upload.styles.ts","../../src/components/hx-file-upload/hx-file-upload.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixFileUploadStyles = css`\n :host {\n display: block;\n }\n\n :host([disabled]) {\n opacity: var(--hx-opacity-disabled, 0.5);\n pointer-events: none;\n }\n\n * {\n box-sizing: border-box;\n }\n\n .field {\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-2, 0.5rem);\n font-family: var(--hx-file-upload-font-family, var(--hx-font-family-sans, sans-serif));\n }\n\n /* ─── Label ─── */\n\n .field__label {\n display: flex;\n align-items: baseline;\n gap: var(--hx-space-1, 0.25rem);\n font-size: var(--hx-font-size-sm, 0.875rem);\n font-weight: var(--hx-font-weight-medium, 500);\n color: var(--hx-color-text-strong, #202b39);\n line-height: var(--hx-line-height-normal, 1.5);\n }\n\n /* ─── Dropzone ─── */\n\n .dropzone {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-2, 0.5rem);\n min-height: var(--hx-space-32, 8rem);\n padding: var(--hx-space-6, 1.5rem) var(--hx-space-4, 1rem);\n border: var(--hx-border-width-thin, 1px) dashed\n var(--hx-file-upload-dropzone-border-color, var(--hx-color-border-strong, #8e9c98));\n border-radius: var(--hx-file-upload-dropzone-border-radius, var(--hx-border-radius-lg, 0.5rem));\n background-color: var(--hx-file-upload-dropzone-bg, var(--hx-color-surface-raised, #f5f8f3));\n cursor: pointer;\n text-align: center;\n transition:\n border-color var(--hx-transition-fast, 150ms ease),\n background-color var(--hx-transition-fast, 150ms ease),\n box-shadow var(--hx-transition-fast, 150ms ease);\n user-select: none;\n color: var(--hx-color-text-secondary, #313e4b);\n font-size: var(--hx-font-size-sm, 0.875rem);\n }\n\n .dropzone:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(\n --hx-file-upload-focus-ring-color,\n var(--hx-focus-ring-color, var(--hx-color-primary-500))\n );\n outline-offset: var(--hx-focus-ring-offset, 2px);\n border-color: var(\n --hx-file-upload-focus-ring-color,\n var(--hx-focus-ring-color, var(--hx-color-primary-500))\n );\n }\n\n .dropzone--drag-over {\n border-color: var(--hx-color-primary-500, #429797);\n background-color: var(\n --hx-file-upload-dropzone-active-bg,\n color-mix(\n in srgb,\n var(--hx-color-primary-500, #429797) 8%,\n var(--hx-color-surface-default, #ffffff)\n )\n );\n border-style: solid;\n }\n\n .dropzone--error {\n border-color: var(--hx-file-upload-error-color, var(--hx-color-error-500, #e5493e));\n }\n\n @media (prefers-reduced-motion: reduce) {\n .dropzone {\n transition: none;\n }\n }\n\n /* ─── Hidden file input ─── */\n\n .file-input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n\n /* ─── File list ─── */\n\n .file-list {\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-2, 0.5rem);\n list-style: none;\n margin: 0;\n padding: 0;\n }\n\n .file-list:empty {\n display: none;\n }\n\n /* ─── File item ─── */\n\n .file-item {\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-1, 0.25rem);\n padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);\n border: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-default, #d6dbd5);\n border-radius: var(--hx-border-radius-md, 0.375rem);\n background-color: var(--hx-color-surface-default, #ffffff);\n }\n\n .file-item__row {\n display: flex;\n align-items: center;\n gap: var(--hx-space-2, 0.5rem);\n }\n\n .file-item__name {\n flex: 1;\n font-size: var(--hx-font-size-sm, 0.875rem);\n font-weight: var(--hx-font-weight-medium, 500);\n color: var(--hx-color-text-strong, #202b39);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .file-item__size {\n flex-shrink: 0;\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-color-text-muted, #4a5362);\n }\n\n .file-item__remove {\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 44px;\n min-height: 44px;\n padding: var(--hx-space-1, 0.25rem);\n border: none;\n border-radius: var(--hx-border-radius-sm, 0.25rem);\n background: transparent;\n color: var(--hx-color-text-muted, #4a5362);\n cursor: pointer;\n line-height: 1;\n transition:\n color var(--hx-transition-fast, 150ms ease),\n background-color var(--hx-transition-fast, 150ms ease);\n }\n\n .file-item__remove:hover {\n color: var(--hx-file-upload-error-color, var(--hx-color-error-text, #c92a2a));\n background-color: color-mix(in srgb, var(--hx-color-error-500, #e5493e) 8%, transparent);\n }\n\n .file-item__remove:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(\n --hx-file-upload-focus-ring-color,\n var(--hx-focus-ring-color, var(--hx-color-primary-500))\n );\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .file-item__remove {\n transition: none;\n }\n }\n\n /* ─── Progress bar ─── */\n\n .progress-track {\n width: 100%;\n height: var(--hx-file-upload-progress-height, var(--hx-space-1, 0.25rem));\n background-color: var(--hx-color-border-default, #d6dbd5);\n border-radius: var(--hx-border-radius-full, 9999px);\n overflow: hidden;\n }\n\n .progress-bar {\n height: 100%;\n width: 100%;\n background-color: var(--hx-file-upload-progress-color, var(--hx-color-primary-500, #429797));\n border-radius: inherit;\n transform-origin: left center;\n transform: scaleX(var(--_progress-ratio, 0));\n transition: transform var(--hx-transition-fast, 150ms ease);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .progress-bar {\n transition: none;\n }\n }\n\n /* ─── Screen-reader only utility ─── */\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n\n /* ─── Error message ─── */\n\n .field__error {\n font-size: var(--hx-font-size-xs, 0.75rem);\n color: var(--hx-file-upload-error-color, var(--hx-color-error-text, #c92a2a));\n line-height: var(--hx-line-height-normal, 1.5);\n }\n\n /* ─── Forced colors (Windows High Contrast / Forced Colors Mode) ─── */\n\n @media (forced-colors: active) {\n .dropzone {\n border: 2px dashed ButtonText;\n background-color: Canvas;\n color: ButtonText;\n }\n\n .dropzone--drag-over {\n border: 2px solid Highlight;\n outline: none;\n background-color: Canvas;\n }\n\n .dropzone--error {\n border: 2px solid LinkText;\n }\n\n .dropzone:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 2px;\n }\n\n .progress-bar {\n background: Highlight;\n forced-color-adjust: none;\n }\n\n .file-item__remove:hover {\n outline: 2px solid Highlight;\n background-color: transparent;\n color: ButtonText;\n }\n\n .file-item__remove:focus-visible {\n outline: 2px solid Highlight;\n }\n\n :host([disabled]) .dropzone {\n border-color: GrayText;\n color: GrayText;\n opacity: 1;\n }\n }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { HelixElement, createIdCounter } from '../../base/index.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { mixinDelegatesAria } from '../../mixins/index.js';\nimport { FormMixin } from '../../mixins/FormMixin.js';\nimport { helixFileUploadStyles } from './hx-file-upload.styles.js';\nimport { forcedColorsField } from '../../styles/forced-colors.js';\n\nconst _nextFileUploadId = createIdCounter('hx-file-upload');\n\ninterface FileEntry {\n file: File;\n progress: number;\n}\n\n/** Detail for the hx-upload event dispatched by hx-file-upload. */\nexport interface HxFileUploadDetail {\n files: File[];\n}\n\n/** Detail for the hx-remove event dispatched by hx-file-upload. */\nexport interface HxFileRemoveDetail {\n file: File;\n index: number;\n}\n\n/** Detail for the hx-error event dispatched by hx-file-upload. */\nexport interface HxFileErrorDetail {\n message: string;\n files: File[];\n}\n\n/**\n * A drag-and-drop file upload component with client-side validation,\n * file list management, per-file progress, and native form association.\n *\n * @summary Form-associated file upload dropzone with drag-and-drop, validation, and progress tracking.\n *\n * @tag hx-file-upload\n *\n * @slot - Default dropzone content. Replaces the built-in \"Drag files here or click to browse\" prompt.\n * @slot file-list - Custom file list display. When provided, the built-in file list is hidden.\n *\n * @fires {CustomEvent<{files: File[]}>} hx-upload - Dispatched when valid files are selected via drag-and-drop or the file picker.\n * @fires {CustomEvent<{file: File, index: number}>} hx-remove - Dispatched when a file is removed from the list.\n * @fires {CustomEvent<{message: string, files: File[]}>} hx-error - Dispatched when file validation fails (type or size constraint).\n *\n * @csspart dropzone - The drag-and-drop target area.\n * @csspart file-list - The container wrapping the list of selected files.\n * @csspart file-item - An individual file entry in the list.\n * @csspart progress - The progress bar track for a file item.\n * @csspart label - The visible label element.\n * @csspart error - The error message container below the dropzone.\n *\n * @cssprop [--hx-file-upload-dropzone-bg=var(--hx-color-neutral-50)] - Dropzone background color.\n * @cssprop [--hx-file-upload-dropzone-border-color=var(--hx-color-neutral-300)] - Dropzone border color.\n * @cssprop [--hx-file-upload-dropzone-border-radius=var(--hx-border-radius-lg)] - Dropzone border radius.\n * @cssprop [--hx-file-upload-dropzone-active-bg] - Dropzone background when a file is dragged over.\n * @cssprop [--hx-file-upload-progress-color=var(--hx-color-primary-500)] - Progress bar fill color.\n * @cssprop [--hx-file-upload-error-color=var(--hx-color-error-500)] - Error state and remove-button hover color.\n * @cssprop [--hx-opacity-disabled] - Opacity.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-file-upload-font-family=var(--hx-font-family-sans)] - CSS custom property.\n * @cssprop [--hx-font-family-sans] - Font family.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-font-weight-medium] - Font weight.\n * @cssprop [--hx-color-neutral-700] - Color.\n * @cssprop [--hx-line-height-normal] - Line height.\n * @cssprop [--hx-space-32] - Spacing token.\n * @cssprop [--hx-space-6] - Spacing token.\n * @cssprop [--hx-space-4] - Spacing token.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-color-neutral-300] - Color.\n * @cssprop [--hx-border-radius-lg] - CSS custom property.\n * @cssprop [--hx-color-neutral-50] - Color.\n * @cssprop [--hx-transition-fast] - Transition timing.\n * @cssprop [--hx-color-neutral-600] - Color.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-file-upload-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-color-neutral-0] - Color.\n * @cssprop [--hx-color-error-500] - Color.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-border-radius-md] - CSS custom property.\n * @cssprop [--hx-color-neutral-800] - Color.\n * @cssprop [--hx-font-size-xs] - Font size.\n * @cssprop [--hx-color-neutral-500] - Color.\n * @cssprop [--hx-border-radius-sm] - CSS custom property.\n * @cssprop [--hx-color-error-text] - Color.\n * @cssprop [--hx-file-upload-progress-height=var(--hx-space-1)] - Height.\n * @cssprop [--hx-border-radius-full] - CSS custom property.\n */\n@customElement('hx-file-upload')\nexport class HelixFileUpload extends FormMixin(mixinDelegatesAria(HelixElement)) {\n static override styles = [helixFileUploadStyles, forcedColorsField];\n\n // ─── Form Association ───\n\n /** Marks this element as form-associated for ElementInternals support. @internal */\n static override formAssociated = true;\n\n // ─── Properties ───\n\n /**\n * The form field name used during form submission.\n * @attr name\n */\n @property({ type: String, reflect: true })\n name = '';\n\n /**\n * Accepted file types as a comma-separated list of MIME types or extensions.\n * Mirrors the native `<input type=\"file\" accept>` attribute.\n * @attr accept\n */\n @property({ type: String })\n accept = '';\n\n /**\n * Maximum allowed file size in bytes. 0 means unlimited.\n * @attr max-size\n */\n @property({ type: Number, attribute: 'max-size' })\n maxSize = 0;\n\n /**\n * Maximum number of files that can be selected. 0 means unlimited.\n * @attr max-files\n */\n @property({ type: Number, attribute: 'max-files' })\n maxFiles = 0;\n\n /**\n * Whether multiple files may be selected at once.\n * @attr multiple\n */\n @property({ type: Boolean })\n multiple = false;\n\n /**\n * Visible label text for the dropzone.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Whether the component is disabled.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Error message displayed below the dropzone. Also puts the dropzone in an error visual state.\n * @attr error\n */\n @property({ type: String })\n error = '';\n\n /**\n * Instructional text shown in the dropzone when no custom slot content is provided.\n * Also used as the accessible label for the dropzone.\n * @attr label-dropzone\n */\n @property({ type: String, attribute: 'label-dropzone' })\n labelDropzone = 'Drag files here or click to browse';\n\n /** Accessible label for the selected files list. */\n @property({ type: String, attribute: 'label-file-list' })\n labelFileList = 'Selected files';\n\n /**\n * Accessible label for the dropzone when no visible label text is provided.\n * Falls back to `label-dropzone` prop value, then a default string.\n *\n * Accepts both `accessible-label` and the standard `aria-label` HTML attribute.\n * `accessible-label` takes precedence when both are set.\n *\n * @attr accessible-label\n */\n @property({ type: String, attribute: 'accessible-label' })\n accessibleLabel: string = '';\n\n /**\n * Returns the effective label for the dropzone, checking accessible-label first,\n * then the aria-label attribute, falling back to empty string.\n * @internal\n */\n private get _effectiveLabel(): string {\n return this.accessibleLabel?.trim() || this.ariaLabel?.trim() || '';\n }\n\n /**\n * Generates upload progress description for screen readers.\n * @param name - file name\n * @param progress - progress percentage 0-100\n */\n @property({ attribute: false })\n labelUploadProgress: (name: string, progress: number) => string = (name, progress) =>\n `Upload progress for ${name}: ${progress}%`;\n\n /**\n * Screen reader announcement when file drag detected. Override for i18n.\n * @attr label-drag-detected\n */\n @property({ attribute: 'label-drag-detected' })\n labelDragDetected = 'File detected. Release to upload.';\n\n // ─── Internal State ───\n\n /** The list of currently selected file entries, each with a file reference and upload progress. @internal */\n @state() private _files: FileEntry[] = [];\n /** Whether a file is currently being dragged over the dropzone. @internal */\n @state() private _dragOver = false;\n /** Whether the named file-list slot contains projected content. @internal */\n @state() private _hasFileListSlot = false;\n\n // ─── Internal References ───\n\n /** Reference to the hidden native file input element used to open the OS file picker. @internal */\n @query('.file-input')\n private _fileInput: HTMLInputElement | null | undefined;\n\n // ─── Stable IDs ───\n\n /** @internal */\n private readonly _baseId = _nextFileUploadId();\n /** @internal */\n private readonly _labelId = `${this._baseId}-label`;\n /** @internal */\n private readonly _errorId = `${this._baseId}-error`;\n /** @internal */\n private readonly _dropzoneId = `${this._baseId}-dropzone`;\n /** @internal */\n private readonly _liveId = `${this._baseId}-live`;\n\n // ─── Slot Handling ───\n\n /** @internal */\n private _handleFileListSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasFileListSlot = slot.assignedElements({ flatten: true }).length > 0;\n }\n\n // ─── Lifecycle ───\n\n override updated(changedProperties: PropertyValues<this>): void {\n super.updated(changedProperties);\n if (changedProperties.has('_files' as keyof HelixFileUpload) || changedProperties.has('name')) {\n this._syncFormValue();\n }\n // Force screen reader re-announcement when error text changes (a11y-v3-005)\n if (changedProperties.has('error') && this.error) {\n const errorEl = this.shadowRoot?.querySelector('[role=\"alert\"]');\n if (errorEl) {\n const msg = this.error;\n requestAnimationFrame(() => {\n errorEl.textContent = '';\n requestAnimationFrame(() => {\n errorEl.textContent = msg;\n });\n });\n }\n }\n }\n\n // ─── Form Integration ───\n\n /** @internal */\n protected override _onFormReset(): void {\n this._files = [];\n this._internals.setFormValue(null);\n this._resetInteractionState();\n }\n\n /** @internal */\n protected override _onFormDisabled(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n /** @internal */\n protected override _onFormStateRestore(\n _state: File | string | FormData | null,\n _mode: 'restore' | 'autocomplete',\n ): void {\n if (_mode === 'restore' || _mode === 'autocomplete') {\n this._files = [];\n this._internals.setFormValue(null);\n }\n }\n\n /** @internal */\n private _syncFormValue(): void {\n if (this._files.length === 0) {\n this._internals.setFormValue(null);\n return;\n }\n\n if (this._files.length === 1) {\n // Single file — pass directly as File (accepted by setFormValue)\n const firstEntry = this._files[0];\n if (firstEntry) {\n this._internals.setFormValue(firstEntry.file);\n }\n return;\n }\n\n // Multiple files — use FormData so all files are submitted under the same name\n const formData = new FormData();\n for (const entry of this._files) {\n formData.append(this.name, entry.file, entry.file.name);\n }\n this._internals.setFormValue(formData);\n }\n\n // ─── Validation ───\n\n /**\n * Validates a file against `accept` and `maxSize` constraints.\n * Returns null on success, or an error message string on failure.\n */\n /** @internal */\n private _validateFile(file: File): string | null {\n if (this.accept) {\n const accepted = this._isAccepted(file);\n if (!accepted) {\n return `\"${file.name}\" has an unsupported file type. Accepted types: ${this.accept}`;\n }\n }\n\n if (this.maxSize > 0 && file.size > this.maxSize) {\n const maxMb = (this.maxSize / (1024 * 1024)).toFixed(1);\n return `\"${file.name}\" exceeds the maximum size of ${maxMb} MB.`;\n }\n\n return null;\n }\n\n /**\n * Checks whether a file is accepted given the `accept` attribute value.\n * Handles MIME types (e.g. \"image/png\"), wildcard MIME types (e.g. \"image/*\"),\n * and extensions (e.g. \".pdf\").\n */\n /** @internal */\n private _isAccepted(file: File): boolean {\n const tokens = this.accept.split(',').map((t) => t.trim().toLowerCase());\n\n for (const token of tokens) {\n if (token.startsWith('.')) {\n // Extension match\n if (file.name.toLowerCase().endsWith(token)) return true;\n } else if (token.endsWith('/*')) {\n // Wildcard MIME type e.g. \"image/*\"\n const baseType = token.slice(0, -2);\n if (file.type.toLowerCase().startsWith(baseType)) return true;\n } else {\n // Exact MIME type\n if (file.type.toLowerCase() === token) return true;\n }\n }\n\n return false;\n }\n\n // ─── File Processing ───\n\n /** @internal */\n private _processFiles(rawFiles: File[]): void {\n if (this.disabled) return;\n\n const candidateFiles = this.multiple ? rawFiles : rawFiles.slice(0, 1);\n const validFiles: File[] = [];\n const invalidFiles: File[] = [];\n const errorMessages: string[] = [];\n\n for (const file of candidateFiles) {\n const validationError = this._validateFile(file);\n if (validationError) {\n invalidFiles.push(file);\n errorMessages.push(validationError);\n } else {\n validFiles.push(file);\n }\n }\n\n if (invalidFiles.length > 0) {\n this.dispatchEvent(\n new CustomEvent<{ message: string; files: File[] }>('hx-error', {\n bubbles: true,\n composed: true,\n detail: { message: errorMessages.join(' '), files: invalidFiles },\n }),\n );\n }\n\n if (validFiles.length === 0) return;\n\n // Enforce maxFiles limit (only in multiple mode — single-file mode always replaces)\n const currentCount = this.multiple ? this._files.length : 0;\n const capacity =\n this.maxFiles > 0 ? Math.max(0, this.maxFiles - currentCount) : validFiles.length;\n const allowedFiles = validFiles.slice(0, capacity);\n\n if (allowedFiles.length === 0 && this.maxFiles > 0) {\n this.dispatchEvent(\n new CustomEvent<{ message: string; files: File[] }>('hx-error', {\n bubbles: true,\n composed: true,\n detail: {\n message: `Maximum of ${this.maxFiles} file${this.maxFiles === 1 ? '' : 's'} allowed.`,\n files: validFiles,\n },\n }),\n );\n return;\n }\n\n if (allowedFiles.length > 0) {\n const newEntries: FileEntry[] = allowedFiles.map((file) => ({ file, progress: 0 }));\n\n if (this.multiple) {\n this._files = [...this._files, ...newEntries];\n } else {\n this._files = newEntries;\n }\n\n this._handleInteractionInput();\n\n this.dispatchEvent(\n new CustomEvent<{ files: File[] }>('hx-upload', {\n bubbles: true,\n composed: true,\n detail: { files: allowedFiles },\n }),\n );\n }\n\n // If remaining valid files were cut by maxFiles, report that too\n const overflow = validFiles.slice(capacity);\n if (overflow.length > 0 && this.maxFiles > 0) {\n this.dispatchEvent(\n new CustomEvent<{ message: string; files: File[] }>('hx-error', {\n bubbles: true,\n composed: true,\n detail: {\n message: `Maximum of ${this.maxFiles} file${this.maxFiles === 1 ? '' : 's'} allowed. ${overflow.length} file${overflow.length === 1 ? ' was' : 's were'} not added.`,\n files: overflow,\n },\n }),\n );\n }\n }\n\n // ─── Public Methods ───\n\n /**\n * Sets the upload progress for a file at the given index.\n * @param index - Zero-based index into the current file list.\n * @param percent - Progress percentage from 0 to 100.\n */\n setProgress(index: number, percent: number): void {\n if (index < 0 || index >= this._files.length) return;\n const clamped = Math.max(0, Math.min(100, percent));\n this._files = this._files.map((entry, i) =>\n i === index ? { ...entry, progress: clamped } : entry,\n );\n }\n\n /**\n * Returns a read-only copy of the currently selected files.\n */\n get files(): File[] {\n return this._files.map((e) => e.file);\n }\n\n // ─── Drag and Drop Handlers ───\n\n /** @internal */\n private _handleDragOver(e: DragEvent): void {\n e.preventDefault();\n if (this.disabled) return;\n this._dragOver = true;\n }\n\n /** @internal */\n private _handleDragLeave(e: DragEvent): void {\n // Only clear drag state when leaving the dropzone entirely\n const target = e.relatedTarget as Node | null;\n if (target && this.contains(target)) return;\n const dropzone = this.shadowRoot?.querySelector('.dropzone');\n if (dropzone && dropzone.contains(target)) return;\n this._dragOver = false;\n }\n\n /** @internal */\n private _handleDrop(e: DragEvent): void {\n e.preventDefault();\n this._dragOver = false;\n if (this.disabled) return;\n\n const dt = e.dataTransfer;\n if (!dt) return;\n\n const rawFiles = Array.from(dt.files);\n if (rawFiles.length === 0) return;\n\n this._processFiles(rawFiles);\n }\n\n // ─── Click / Keyboard Handlers ───\n\n /** @internal */\n private _handleDropzoneClick(): void {\n if (this.disabled) return;\n this._fileInput?.click();\n }\n\n /** @internal */\n private _handleDropzoneKeyDown(e: KeyboardEvent): void {\n if (this.disabled) return;\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this._fileInput?.click();\n }\n }\n\n /** @internal */\n private _handleFileInputChange(e: Event): void {\n const input = e.target as HTMLInputElement;\n if (!input.files || input.files.length === 0) return;\n\n const rawFiles = Array.from(input.files);\n // Reset the input so the same file can be re-selected after removal\n input.value = '';\n this._processFiles(rawFiles);\n }\n\n // ─── Remove Handler ───\n\n /** @internal */\n private _handleRemove(index: number): void {\n if (this.disabled) return;\n const entry = this._files[index];\n if (!entry) return;\n\n const removedFile = entry.file;\n this._files = this._files.filter((_, i) => i !== index);\n\n this.dispatchEvent(\n new CustomEvent<{ file: File; index: number }>('hx-remove', {\n bubbles: true,\n composed: true,\n detail: { file: removedFile, index },\n }),\n );\n\n // Restore focus after removal so keyboard users are not stranded.\n this.updateComplete\n .then(() => {\n if (this._files.length === 0) {\n // List is now empty — return focus to the dropzone.\n const dropzone = this.shadowRoot?.querySelector<HTMLElement>('[part=\"dropzone\"]');\n dropzone?.focus();\n } else {\n // Focus the remove button at the same position, or the previous one if\n // the removed item was the last in the list.\n const removeButtons =\n this.shadowRoot?.querySelectorAll<HTMLButtonElement>('.file-item__remove');\n if (removeButtons && removeButtons.length > 0) {\n const targetIndex = index < this._files.length ? index : this._files.length - 1;\n const targetButton = removeButtons[targetIndex];\n if (targetButton) {\n targetButton.focus();\n }\n }\n }\n })\n .catch(() => {\n // Focus restoration is best-effort; ignore errors.\n });\n }\n\n // ─── Formatters ───\n\n /** @internal */\n private _formatSize(bytes: number): string {\n if (bytes < 1024) return `${bytes} B`;\n if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\n return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n }\n\n // ─── Render Helpers ───\n\n /** @internal */\n private _renderFileList() {\n if (this._hasFileListSlot) return nothing;\n if (this._files.length === 0) return nothing;\n\n return html`\n <ul part=\"file-list\" class=\"file-list\" aria-label=${this.labelFileList}>\n ${repeat(\n this._files,\n (entry) => entry.file.name + entry.file.size,\n (entry, index) => html`\n <li part=\"file-item\" class=\"file-item\">\n <div class=\"file-item__row\">\n <span class=\"file-item__name\" title=${entry.file.name}> ${entry.file.name} </span>\n <span class=\"file-item__size\">${this._formatSize(entry.file.size)}</span>\n <button\n type=\"button\"\n class=\"file-item__remove\"\n aria-label=${`Remove ${entry.file.name}`}\n @click=${() => this._handleRemove(index)}\n >\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path\n d=\"M1 1L13 13M13 1L1 13\"\n stroke=\"currentColor\"\n stroke-width=\"1.75\"\n stroke-linecap=\"round\"\n />\n </svg>\n </button>\n </div>\n <div\n part=\"progress\"\n class=\"progress-track\"\n role=\"progressbar\"\n aria-valuenow=${entry.progress}\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n aria-label=${this.labelUploadProgress(entry.file.name, entry.progress)}\n >\n <div\n class=\"progress-bar\"\n style=\"--_progress-ratio: ${String(entry.progress / 100)}\"\n ></div>\n </div>\n </li>\n `,\n )}\n </ul>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n const hasError = !!this.error;\n\n const dropzoneClasses = {\n dropzone: true,\n 'dropzone--drag-over': this._dragOver,\n 'dropzone--error': hasError,\n };\n\n const dropzoneLabel = this.label ? `${this.label} — ${this.labelDropzone}` : this.labelDropzone;\n\n return html`\n <div class=\"field\">\n ${this.label\n ? html`\n <label part=\"label\" class=\"field__label\" id=${this._labelId} for=${this._dropzoneId}>\n ${this.label}\n </label>\n `\n : nothing}\n\n <div\n part=\"dropzone\"\n class=${classMap(dropzoneClasses)}\n id=${this._dropzoneId}\n role=\"button\"\n tabindex=${this.disabled ? '-1' : '0'}\n aria-label=${ifDefined(this._effectiveLabel || (!this.label ? dropzoneLabel : undefined))}\n aria-labelledby=${ifDefined(\n !this._effectiveLabel && this.label ? this._labelId : undefined,\n )}\n aria-disabled=${this.disabled ? 'true' : nothing}\n aria-invalid=${hasError ? 'true' : nothing}\n aria-describedby=${ifDefined(hasError ? this._errorId : undefined)}\n @click=${this._handleDropzoneClick}\n @keydown=${this._handleDropzoneKeyDown}\n @dragover=${this._handleDragOver}\n @dragleave=${this._handleDragLeave}\n @drop=${this._handleDrop}\n >\n <slot>${this.labelDropzone}</slot>\n </div>\n\n <input\n class=\"file-input\"\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n accept=${ifDefined(this.accept || undefined)}\n ?multiple=${this.multiple}\n ?disabled=${this.disabled}\n @change=${this._handleFileInputChange}\n />\n\n <slot name=\"file-list\" @slotchange=${this._handleFileListSlotChange}></slot>\n\n ${this._renderFileList()}\n ${hasError\n ? html`\n <div part=\"error\" class=\"field__error\" id=${this._errorId} role=\"alert\">\n ${this.error}\n </div>\n `\n : nothing}\n\n <div id=${this._liveId} class=\"sr-only\" aria-live=\"polite\" aria-atomic=\"true\">\n ${this._dragOver ? this.labelDragDetected : ''}\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-file-upload': HelixFileUpload;\n }\n}\n"],"names":["helixFileUploadStyles","css","_nextFileUploadId","createIdCounter","HelixFileUpload","FormMixin","mixinDelegatesAria","HelixElement","name","progress","_a","_b","slot","changedProperties","errorEl","msg","disabled","_state","_mode","firstEntry","formData","entry","file","maxMb","tokens","token","baseType","rawFiles","candidateFiles","validFiles","invalidFiles","errorMessages","validationError","currentCount","capacity","allowedFiles","newEntries","overflow","index","percent","clamped","i","target","dropzone","dt","input","removedFile","_","removeButtons","targetIndex","targetButton","bytes","nothing","html","repeat","hasError","dropzoneClasses","dropzoneLabel","classMap","ifDefined","forcedColorsField","__decorateClass","property","state","query","customElement"],"mappings":";;;;;;;;;;AAEO,MAAMA,IAAwBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA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"}

package/dist/shared/hx-form-CkChEATa.js ADDED Viewed

@@ -0,0 +1,257 @@
+import { html as c, nothing as m } from "lit";
+import { state as x, property as h, customElement as d } from "lit/decorators.js";
+import { ifDefined as f } from "lit/directives/if-defined.js";
+import { A as p } from "./adopted-stylesheets-BZZnCSAs.js";
+import { H as u } from "./helix-element-BNEYeiys.js";
+const v = `hx-form{display:flex;flex-direction:column;gap:var(--hx-form-gap, var(--hx-space-4, 1rem));max-width:var(--hx-form-max-width, none);padding:var(--hx-form-padding, 0)}hx-form .hx-form-error-summary{border:var(--hx-border-width-thin, 1px) solid var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));border-radius:var(--hx-border-radius-md, .375rem);background-color:var(--hx-color-error-50, #fef2f2);color:var(--hx-input-error-color, var(--hx-color-error-text, #c92a2a));padding:var(--hx-space-3, .75rem) var(--hx-space-4, 1rem);font-size:var(--hx-font-size-sm, .875rem);line-height:var(--hx-line-height-normal, 1.5);font-family:var(--hx-input-font-family, var(--hx-font-family-sans, sans-serif))}hx-form .hx-form-error-summary ul{margin:0;padding:0 0 0 var(--hx-space-4, 1rem)}hx-form .hx-form-error-summary li{margin-bottom:var(--hx-space-1, .25rem)}hx-form .hx-form-error-summary li:last-child{margin-bottom:0}hx-form .form-item{display:flex;flex-direction:column;gap:var(--hx-space-1, .25rem);font-family:var(--hx-input-font-family, var(--hx-font-family-sans, sans-serif))}hx-form .form-item+.form-item{margin-top:var(--hx-space-4, 1rem)}hx-form label{display:flex;align-items:baseline;gap:var(--hx-space-1, .25rem);font-size:var(--hx-font-size-sm, .875rem);font-weight:var(--hx-font-weight-medium, 500);color:var(--hx-input-label-color, var(--hx-color-neutral-700, #343a40));line-height:var(--hx-line-height-normal, 1.5)}hx-form .form-required{color:var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));font-weight:var(--hx-font-weight-bold, 700)}hx-form .description{font-size:var(--hx-font-size-xs, .75rem);color:var(--hx-color-neutral-500, #6c757d);line-height:var(--hx-line-height-normal, 1.5)}hx-form .form-item :is(*,*:before,*:after){box-sizing:border-box}hx-form :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea){display:block;width:100%;border:var(--hx-border-width-thin, 1px) solid var(--hx-input-border-color, var(--hx-color-neutral-300, #ced4da));border-radius:var(--hx-input-border-radius, var(--hx-border-radius-md, .375rem));background-color:var(--hx-input-bg, var(--hx-color-neutral-0, #ffffff));padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-family:var(--hx-input-font-family, var(--hx-font-family-sans, sans-serif));font-size:var(--hx-font-size-md, 1rem);color:var(--hx-input-color, var(--hx-color-neutral-800, #212529));line-height:var(--hx-line-height-normal, 1.5);transition:border-color var(--hx-transition-fast, .15s ease),box-shadow var(--hx-transition-fast, .15s ease)}hx-form input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]){min-height:var(--hx-size-10, 2.5rem)}hx-form :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea)::placeholder{color:var(--hx-color-neutral-400, #adb5bd)}hx-form :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea):focus{outline:0;border-color:var(--hx-input-focus-ring-color, var(--hx-focus-ring-color, #2563eb));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-input-focus-ring-color, var(--hx-focus-ring-color, #2563eb)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}hx-form :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea):disabled{opacity:var(--hx-opacity-disabled, .5);cursor:not-allowed;pointer-events:none}hx-form :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea):read-only{background-color:var(--hx-color-neutral-100, #e9ecef)}hx-form input[type=search]::-webkit-search-decoration,hx-form input[type=search]::-webkit-search-cancel-button,hx-form input[type=search]::-webkit-search-results-button,hx-form input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}hx-form input[type=number]::-webkit-inner-spin-button,hx-form input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}hx-form input[type=number]{appearance:textfield}hx-form textarea{min-height:var(--hx-textarea-min-height, var(--hx-size-20, 5rem));resize:vertical}hx-form select{display:block;width:100%;border:var(--hx-border-width-thin, 1px) solid var(--hx-select-border-color, var(--hx-color-neutral-300, #ced4da));border-radius:var(--hx-select-border-radius, var(--hx-border-radius-md, .375rem));background-color:var(--hx-select-bg, var(--hx-color-neutral-0, #ffffff));padding:var(--hx-space-2, .5rem) var(--hx-space-8, 2rem) var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-family:var(--hx-select-font-family, var(--hx-font-family-sans, sans-serif));font-size:var(--hx-font-size-md, 1rem);color:var(--hx-select-color, var(--hx-color-neutral-800, #212529));line-height:var(--hx-line-height-normal, 1.5);min-height:var(--hx-input-height-md, var(--hx-size-10, 2.5rem));cursor:pointer;transition:border-color var(--hx-transition-fast, .15s ease),box-shadow var(--hx-transition-fast, .15s ease);appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%236c757d' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--hx-space-3, .75rem) center;background-size:12px 8px}hx-form select:focus{outline:0;border-color:var(--hx-select-focus-ring-color, var(--hx-focus-ring-color, #2563eb));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-select-focus-ring-color, var(--hx-focus-ring-color, #2563eb)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}hx-form select:disabled{opacity:var(--hx-opacity-disabled, .5);cursor:not-allowed;pointer-events:none}hx-form select[multiple]{min-height:var(--hx-size-20, 5rem);padding-right:var(--hx-space-3, .75rem);background-image:none}hx-form select[multiple] option{padding:var(--hx-space-1, .25rem) var(--hx-space-2, .5rem)}hx-form select::-ms-expand{display:none}hx-form :is(input[type=checkbox],input[type=radio]){appearance:none;-webkit-appearance:none;-moz-appearance:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin:0;background-color:var(--hx-color-neutral-0, #ffffff);cursor:pointer;vertical-align:middle;transition:background-color var(--hx-transition-fast, .15s ease),border-color var(--hx-transition-fast, .15s ease),box-shadow var(--hx-transition-fast, .15s ease)}hx-form input[type=checkbox]{width:var(--hx-checkbox-size, var(--hx-size-5, 1.25rem));height:var(--hx-checkbox-size, var(--hx-size-5, 1.25rem));border:var(--hx-border-width-medium, 2px) solid var(--hx-checkbox-border-color, var(--hx-color-neutral-300, #ced4da));border-radius:var(--hx-checkbox-border-radius, var(--hx-border-radius-sm, .25rem))}hx-form input[type=checkbox]:checked{background-color:var(--hx-checkbox-checked-bg, var(--hx-color-primary-500, #2563eb));border-color:var(--hx-checkbox-checked-border-color, var(--hx-color-primary-500, #2563eb));background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.5 8.5L6.5 11.5L12.5 4.5' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:100%}hx-form input[type=checkbox]:indeterminate{background-color:var(--hx-checkbox-checked-bg, var(--hx-color-primary-500, #2563eb));border-color:var(--hx-checkbox-checked-border-color, var(--hx-color-primary-500, #2563eb));background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 8H12' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:100%}hx-form input[type=checkbox]:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-checkbox-focus-ring-color, var(--hx-focus-ring-color, #2563eb));outline-offset:var(--hx-focus-ring-offset, 2px)}hx-form input[type=checkbox]:hover:not(:disabled){border-color:var(--hx-color-primary-500, #2563eb)}hx-form input[type=checkbox]:checked:hover:not(:disabled){filter:brightness(var(--hx-filter-brightness-hover, .9))}hx-form :is(input[type=checkbox],input[type=radio]):disabled{opacity:var(--hx-opacity-disabled, .5);cursor:not-allowed;pointer-events:none}hx-form :is(.form-type-checkbox,.form-type-checkbox-toggle){display:flex;align-items:flex-start;gap:var(--hx-space-2, .5rem)}hx-form :is(.form-type-checkbox,.form-type-checkbox-toggle) label{font-size:var(--hx-font-size-sm, .875rem);font-weight:var(--hx-font-weight-medium, 500);color:var(--hx-checkbox-label-color, var(--hx-color-neutral-700, #343a40));line-height:var(--hx-line-height-normal, 1.5);cursor:pointer;user-select:none;-webkit-user-select:none}hx-form input[type=radio]{width:var(--hx-radio-size, var(--hx-size-5, 1.25rem));height:var(--hx-radio-size, var(--hx-size-5, 1.25rem));border:var(--hx-border-width-medium, 2px) solid var(--hx-radio-border-color, var(--hx-color-neutral-300, #ced4da));border-radius:var(--hx-border-radius-full, 9999px)}hx-form input[type=radio]:checked{border-color:var(--hx-radio-checked-border-color, var(--hx-color-primary-500, #2563eb));background-color:var(--hx-radio-checked-bg, var(--hx-color-primary-500, #2563eb));box-shadow:inset 0 0 0 calc(var(--hx-radio-size, var(--hx-size-5, 1.25rem)) * .3) var(--hx-radio-dot-color, var(--hx-color-neutral-0, #ffffff))}hx-form input[type=radio]:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-radio-focus-ring-color, var(--hx-focus-ring-color, #2563eb));outline-offset:var(--hx-focus-ring-offset, 2px)}hx-form input[type=radio]:hover:not(:disabled):not(:checked){border-color:var(--hx-color-neutral-400, #adb5bd)}hx-form .form-type-radio{display:inline-flex;align-items:center;gap:var(--hx-space-2, .5rem)}hx-form .form-type-radio label{font-size:var(--hx-font-size-md, 1rem);color:var(--hx-radio-label-color, var(--hx-color-neutral-700, #343a40));line-height:var(--hx-line-height-normal, 1.5);cursor:pointer;user-select:none;-webkit-user-select:none}hx-form .form-radios{display:flex;flex-direction:column;gap:var(--hx-radio-group-gap, var(--hx-space-3, .75rem))}hx-form .form-radios--horizontal{flex-direction:row;flex-wrap:wrap}hx-form .form-type-switch{display:flex;flex-direction:column;gap:var(--hx-space-1, .25rem);font-family:var(--hx-font-family-sans, sans-serif)}hx-form .form-type-switch .switch__control-row{display:flex;align-items:center;gap:var(--hx-space-2, .5rem)}hx-form .form-type-switch input[type=checkbox]{position:relative;width:var(--hx-switch-track-width-md, var(--hx-size-10, 2.5rem));height:var(--hx-switch-track-height-md, var(--hx-size-5-5, 1.375rem));border:none;border-radius:var(--hx-border-radius-full, 9999px);background-color:var(--hx-switch-track-bg, var(--hx-color-neutral-300, #ced4da));transition:background-color var(--hx-transition-fast, .15s ease);background-image:none}hx-form .form-type-switch input[type=checkbox]:before{content:"";position:absolute;top:50%;left:var(--hx-switch-thumb-offset, var(--hx-space-0-5, .125rem));transform:translateY(-50%);width:var(--hx-switch-thumb-size-md, var(--hx-size-4-5, 1.125rem));height:var(--hx-switch-thumb-size-md, var(--hx-size-4-5, 1.125rem));border-radius:var(--hx-border-radius-full, 9999px);background-color:var(--hx-switch-thumb-bg, var(--hx-color-neutral-0, #ffffff));box-shadow:var(--hx-switch-thumb-shadow, var(--hx-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / .05)));transition:transform var(--hx-transition-fast, .15s ease)}hx-form .form-type-switch input[type=checkbox]:checked{background-color:var(--hx-switch-track-checked-bg, var(--hx-color-primary-500, #2563eb));background-image:none}hx-form .form-type-switch input[type=checkbox]:checked:before{transform:translateY(-50%) translate(var(--hx-switch-thumb-size-md, var(--hx-size-4-5, 1.125rem)))}hx-form .form-type-switch input[type=checkbox]:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-switch-focus-ring-color, var(--hx-focus-ring-color, #2563eb));outline-offset:var(--hx-focus-ring-offset, 2px)}hx-form .form-type-switch input[type=checkbox]:disabled{opacity:var(--hx-opacity-disabled, .5);cursor:not-allowed;pointer-events:none}hx-form .form-type-switch label{font-size:var(--hx-font-size-sm, .875rem);font-weight:var(--hx-font-weight-medium, 500);color:var(--hx-switch-label-color, var(--hx-color-neutral-700, #343a40));line-height:var(--hx-line-height-normal, 1.5);cursor:pointer;user-select:none;-webkit-user-select:none}hx-form .form-type-switch--sm input[type=checkbox]{width:var(--hx-switch-track-width-sm, var(--hx-size-8, 2rem));height:var(--hx-switch-track-height-sm, var(--hx-size-4-5, 1.125rem))}hx-form .form-type-switch--sm input[type=checkbox]:before{width:var(--hx-switch-thumb-size-sm, var(--hx-size-3-5, .875rem));height:var(--hx-switch-thumb-size-sm, var(--hx-size-3-5, .875rem))}hx-form .form-type-switch--sm input[type=checkbox]:checked:before{transform:translateY(-50%) translate(var(--hx-switch-thumb-size-sm, var(--hx-size-3-5, .875rem)))}hx-form .form-type-switch--lg input[type=checkbox]{width:var(--hx-switch-track-width-lg, var(--hx-size-12, 3rem));height:var(--hx-switch-track-height-lg, var(--hx-size-6-5, 1.625rem))}hx-form .form-type-switch--lg input[type=checkbox]:before{width:var(--hx-switch-thumb-size-lg, var(--hx-size-5-5, 1.375rem));height:var(--hx-switch-thumb-size-lg, var(--hx-size-5-5, 1.375rem))}hx-form .form-type-switch--lg input[type=checkbox]:checked:before{transform:translateY(-50%) translate(var(--hx-switch-thumb-size-lg, var(--hx-size-5-5, 1.375rem)))}hx-form form{display:flex;flex-direction:column;gap:var(--hx-form-gap, var(--hx-space-4, 1rem));font-family:var(--hx-input-font-family, var(--hx-font-family-sans, sans-serif))}hx-form fieldset{border:var(--hx-border-width-thin, 1px) solid var(--hx-color-neutral-200, #dee2e6);border-radius:var(--hx-border-radius-md, .375rem);padding:var(--hx-space-4, 1rem);margin:0;display:flex;flex-direction:column;gap:var(--hx-space-4, 1rem)}hx-form :is(legend,summary){font-size:var(--hx-font-size-sm, .875rem);font-weight:var(--hx-font-weight-semibold, 600);color:var(--hx-color-neutral-700, #343a40);line-height:var(--hx-line-height-normal, 1.5)}hx-form legend{display:flex;align-items:baseline;gap:var(--hx-space-1, .25rem);padding:0 var(--hx-space-1, .25rem)}hx-form details{border:var(--hx-border-width-thin, 1px) solid var(--hx-color-neutral-200, #dee2e6);border-radius:var(--hx-border-radius-md, .375rem);padding:var(--hx-space-4, 1rem);margin:0}hx-form summary{cursor:pointer;padding:var(--hx-space-1, .25rem) 0;user-select:none;-webkit-user-select:none}hx-form summary:focus-visible{outline:var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #2563eb);outline-offset:var(--hx-focus-ring-offset, 2px);border-radius:var(--hx-border-radius-sm, .25rem)}hx-form .form-actions{display:flex;align-items:center;gap:var(--hx-space-3, .75rem);padding-top:var(--hx-space-4, 1rem)}hx-form .form-actions--end{justify-content:flex-end}hx-form .form-actions--between{justify-content:space-between}hx-form .form-columns{display:grid;gap:var(--hx-space-4, 1rem)}hx-form .form-columns--2{grid-template-columns:repeat(2,1fr)}hx-form .form-columns--3{grid-template-columns:repeat(3,1fr)}hx-form .form-columns--4{grid-template-columns:repeat(4,1fr)}@media(max-width:640px){hx-form .form-columns--2,hx-form .form-columns--3,hx-form .form-columns--4{grid-template-columns:1fr}}hx-form .form-item--full{grid-column:1 / -1}hx-form .form-inline{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--hx-space-3, .75rem)}hx-form .form-inline .form-item{flex:1;min-width:0}hx-form .form-inline .form-item+.form-item{margin-top:0}hx-form .form-divider{border:none;border-top:var(--hx-border-width-thin, 1px) solid var(--hx-color-neutral-200, #dee2e6);margin:var(--hx-space-2, .5rem) 0}hx-form :is(.form-item.error,.form-item.has-error,.form-item--error) label{color:var(--hx-input-error-color, var(--hx-color-error-text, #c92a2a))}hx-form :is(.form-item.error,.form-item.has-error,.form-item--error) :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea,select){border-color:var(--hx-input-error-color, var(--hx-color-error-500, #dc3545))}hx-form :is(.form-item.error,.form-item.has-error,.form-item--error) :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea,select):focus{border-color:var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-input-error-color, var(--hx-color-error-500, #dc3545)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}hx-form :is(.form-item.error,.form-item.has-error,.form-item--error) input[type=checkbox]{border-color:var(--hx-checkbox-error-color, var(--hx-color-error-500, #dc3545))}hx-form :is(.form-item.error,.form-item.has-error,.form-item--error) input[type=checkbox]:checked{background-color:var(--hx-checkbox-error-color, var(--hx-color-error-500, #dc3545));border-color:var(--hx-checkbox-error-color, var(--hx-color-error-500, #dc3545))}hx-form :is(.form-item.error,.form-item.has-error,.form-item--error) input[type=radio]{border-color:var(--hx-color-error-500, #dc3545)}hx-form :is(.form-item__error-message,.form-item .error-message,.error-message,.form-item__success-message,.form-item .success-message,.success-message){font-size:var(--hx-font-size-xs, .75rem);line-height:var(--hx-line-height-normal, 1.5)}hx-form :is(.form-item__error-message,.form-item .error-message,.error-message){color:var(--hx-input-error-color, var(--hx-color-error-text, #c92a2a))}hx-form :is(.form-item__success-message,.form-item .success-message,.success-message){color:var(--hx-color-success-500, #198754)}hx-form :is(.form-item.success,.form-item.has-success,.form-item--success) label{color:var(--hx-color-success-500, #198754)}hx-form :is(.form-item.success,.form-item.has-success,.form-item--success) :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea,select){border-color:var(--hx-color-success-500, #198754)}hx-form :is(.form-item.success,.form-item.has-success,.form-item--success) :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea,select):focus{border-color:var(--hx-color-success-500, #198754);box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-color-success-500, #198754) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}hx-form :is(.messages--error,.messages--status,.messages--warning){border:var(--hx-border-width-thin, 1px) solid;border-radius:var(--hx-border-radius-md, .375rem);padding:var(--hx-space-3, .75rem) var(--hx-space-4, 1rem);font-size:var(--hx-font-size-sm, .875rem);line-height:var(--hx-line-height-normal, 1.5)}hx-form .messages--error{border-color:var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));background-color:var(--hx-color-error-50, #fef2f2);color:var(--hx-input-error-color, var(--hx-color-error-text, #c92a2a))}hx-form .messages--status{border-color:var(--hx-color-success-500, #198754);background-color:var(--hx-color-success-50, #f0fdf4);color:var(--hx-color-success-500, #198754)}hx-form .messages--warning{border-color:var(--hx-color-warning-500, #ffc107);background-color:var(--hx-color-warning-50, #fffbeb);color:var(--hx-color-warning-700, #92400e)}@media(forced-colors:active){hx-form :is(input:is([type=text],[type=email],[type=password],[type=tel],[type=url],[type=search],[type=number]),textarea,select):focus{outline:2px solid CanvasText;outline-offset:2px}hx-form .hx-form-error-summary{border-color:LinkText}}
+`, b = v;
+var g = Object.defineProperty, y = Object.getOwnPropertyDescriptor, s = (e, r, a, t) => {
+  for (var o = t > 1 ? void 0 : t ? y(r, a) : r, n = e.length - 1, l; n >= 0; n--)
+    (l = e[n]) && (o = (t ? l(r, a, o) : l(o)) || o);
+  return t && o && g(r, a, o), o;
+};
+let i = class extends u {
+  constructor() {
+    super(...arguments), this._styles = new p(this, b, document), this._validationErrors = [], this.action = "", this.method = "post", this.novalidate = !1, this.name = "", this.enctype = "application/x-www-form-urlencoded", this._handleSubmit = (e) => {
+      if (this.action)
+        return;
+      if (e.preventDefault(), !this.novalidate && !this.checkValidity()) {
+        const t = this._collectValidationErrors();
+        this._validationErrors = t, this._applyAriaInvalidFromValidity(), this.updateComplete.then(() => {
+          const o = this.querySelector(".hx-form-error-summary");
+          o == null || o.focus();
+        }), this.dispatchEvent(
+          new CustomEvent("hx-invalid", {
+            bubbles: !0,
+            composed: !0,
+            detail: { errors: t }
+          })
+        );
+        return;
+      }
+      this._validationErrors = [], this._clearAriaInvalid();
+      const r = this.getFormData(), a = {};
+      for (const t of new Set(r.keys())) {
+        const o = r.getAll(t);
+        o.length === 1 && o[0] !== void 0 ? a[t] = o[0] : a[t] = o;
+      }
+      this.dispatchEvent(
+        new CustomEvent("hx-submit", {
+          bubbles: !0,
+          composed: !0,
+          detail: { valid: !0, values: a, formData: r }
+        })
+      );
+    }, this._handleReset = () => {
+      this._validationErrors = [], this._clearAriaInvalid(), this.dispatchEvent(
+        new CustomEvent("hx-reset", {
+          bubbles: !0,
+          composed: !0
+        })
+      );
+    };
+  }
+  // ─── Light DOM ───
+  createRenderRoot() {
+    return this;
+  }
+  // ─── Lifecycle ───
+  connectedCallback() {
+    super.connectedCallback(), this.addEventListener("submit", this._handleSubmit), this.addEventListener("reset", this._handleReset);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.removeEventListener("submit", this._handleSubmit), this.removeEventListener("reset", this._handleReset);
+  }
+  // ─── Public Methods ───
+  /**
+   * Checks the validity of all child form elements without showing
+   * validation UI. Returns `true` if all elements are valid.
+   */
+  checkValidity() {
+    return this._getAllValidatableElements().every((r) => "checkValidity" in r && typeof r.checkValidity == "function" ? r.checkValidity() : !0);
+  }
+  /**
+   * Checks validity and triggers the browser's constraint validation UI
+   * on each invalid element. Returns `true` if all elements are valid.
+   */
+  reportValidity() {
+    const e = this._getAllValidatableElements();
+    let r = !0;
+    for (const a of e)
+      "reportValidity" in a && typeof a.reportValidity == "function" && (a.reportValidity() || (r = !1));
+    return r;
+  }
+  /**
+   * Collects form data from all child form elements (native and hx-*).
+   * Returns a `FormData` object.
+   */
+  getFormData() {
+    const e = this.querySelector("form");
+    if (e)
+      return new FormData(e);
+    const r = new FormData(), a = this.getNativeFormElements();
+    for (const t of a) {
+      const o = t;
+      o.name && (o instanceof HTMLInputElement && (o.type === "checkbox" || o.type === "radio") ? o.checked && r.append(o.name, o.value || "on") : r.append(o.name, o.value));
+    }
+    return r;
+  }
+  /**
+   * Returns all child hx-* form components that implement the form
+   * component contract (hx-text-input, hx-select, hx-checkbox, hx-textarea,
+   * hx-radio-group, hx-switch).
+   *
+   * Note: This uses a hardcoded allowlist. When a new hx-* form component
+   * is added, update this selector to include it.
+   */
+  getFormElements() {
+    return Array.from(
+      this.querySelectorAll(
+        "hx-text-input, hx-select, hx-checkbox, hx-textarea, hx-radio-group, hx-switch"
+      )
+    );
+  }
+  /**
+   * Returns all native form elements (input, select, textarea, button)
+   * found within this component's light DOM.
+   */
+  getNativeFormElements() {
+    return Array.from(
+      this.querySelectorAll("input, select, textarea, button")
+    );
+  }
+  /**
+   * Programmatically sets server-side validation errors on the form.
+   * Renders an error summary and sets `aria-invalid="true"` on named fields.
+   *
+   * Useful for surfacing Drupal server-side validation responses.
+   *
+   * @param errors - Array of `{name, message}` pairs matching field `name` attributes.
+   */
+  setErrors(e) {
+    this._validationErrors = e, this._applyAriaInvalidFromErrors(e);
+  }
+  /**
+   * Programmatically sets a single field error. Merges with any existing errors.
+   *
+   * @param name - The `name` attribute of the field.
+   * @param message - The error message to display.
+   */
+  setFieldError(e, r) {
+    const a = this._validationErrors.filter((t) => t.name !== e);
+    this.setErrors([...a, { name: e, message: r }]);
+  }
+  /**
+   * Clears all validation errors from the error summary and removes
+   * `aria-invalid` from all fields.
+   */
+  clearErrors() {
+    this._clearAriaInvalid(), this._validationErrors = [];
+  }
+  // ─── Private Helpers ───
+  /**
+   * Returns all elements that support constraint validation, including
+   * both native form elements and hx-* components with `checkValidity`.
+   * @internal
+   */
+  _getAllValidatableElements() {
+    const e = Array.from(this.querySelectorAll("input, select, textarea")), r = this.getFormElements().filter(
+      (a) => "checkValidity" in a && typeof a.checkValidity == "function"
+    );
+    return [...e, ...r];
+  }
+  /**
+   * Sets `aria-invalid="true"` on fields with errors, removes it from valid fields.
+   * @internal
+   */
+  _applyAriaInvalidFromErrors(e) {
+    const r = new Set(e.map((t) => t.name)), a = this._getAllValidatableElements();
+    for (const t of a) {
+      const n = t.name ?? t.tagName.toLowerCase();
+      r.has(n) ? t.setAttribute("aria-invalid", "true") : t.removeAttribute("aria-invalid");
+    }
+  }
+  /**
+   * Sets `aria-invalid` based on native constraint validation state.
+   * @internal
+   */
+  _applyAriaInvalidFromValidity() {
+    const e = this._getAllValidatableElements();
+    for (const r of e)
+      "validity" in r && (r.validity.valid ? r.removeAttribute("aria-invalid") : r.setAttribute("aria-invalid", "true"));
+  }
+  /**
+   * Removes `aria-invalid` from all validatable elements.
+   * @internal
+   */
+  _clearAriaInvalid() {
+    const e = this._getAllValidatableElements();
+    for (const r of e)
+      r.removeAttribute("aria-invalid");
+  }
+  /**
+   * Collects constraint validation errors from all validatable elements after a failed submit attempt.
+   * @internal
+   */
+  _collectValidationErrors() {
+    const e = [], r = this._getAllValidatableElements();
+    for (const a of r)
+      if ("validity" in a && "validationMessage" in a) {
+        const t = a;
+        t.validity.valid || e.push({
+          name: t.name || t.tagName.toLowerCase(),
+          message: t.validationMessage
+        });
+      }
+    return e;
+  }
+  // ─── Render ───
+  render() {
+    const e = this._validationErrors.length > 0 ? c`
+            <div class="hx-form-error-summary" role="alert" aria-atomic="true" tabindex="-1">
+              <ul>
+                ${this._validationErrors.map(
+      (r) => c`<li>${r.message || r.name}</li>`
+    )}
+              </ul>
+            </div>
+          ` : m;
+    return this.action ? c`
+        ${e}
+        <form
+          action=${this.action}
+          method=${this.method}
+          enctype=${this.enctype}
+          name=${f(this.name || void 0)}
+          ?novalidate=${this.novalidate}
+        >
+          <slot></slot>
+        </form>
+      ` : c`${e}<slot></slot>`;
+  }
+};
+s([
+  x()
+], i.prototype, "_validationErrors", 2);
+s([
+  h({ type: String })
+], i.prototype, "action", 2);
+s([
+  h({ type: String })
+], i.prototype, "method", 2);
+s([
+  h({ type: Boolean })
+], i.prototype, "novalidate", 2);
+s([
+  h({ type: String })
+], i.prototype, "name", 2);
+s([
+  h({ type: String })
+], i.prototype, "enctype", 2);
+i = s([
+  d("hx-form")
+], i);
+export {
+  i as H
+};
+//# sourceMappingURL=hx-form-CkChEATa.js.map