@marianmeres/stuic 3.182.0 → 3.184.0

package/dist/components/Input/_internal/paste-target.js

@@ -0,0 +1,114 @@
+// --- Clipboard paste plumbing (see the `pasteable` prop of FieldAssets /
+// FieldSingleAsset) ------------------------------------------------------------
+// All mounted pasteable instances — of EITHER component — coordinate through ONE
+// document-level `paste` listener (installed while at least one is mounted).
+// Document-level (rather than a listener on the field wrapper) because browsers
+// dispatch `paste` at the focused/selection node — with focus on <body> the
+// event never bubbles through the field, which made the feature look dead
+// unless the field was clicked first.
+//
+// Shared on purpose: the "single mounted pasteable field" fallback below must
+// count every pasteable field on the page. Two private registries (one per
+// component) would each believe they own the only field and BOTH would consume
+// a bare Ctrl/Cmd-V.
+const paste_targets = new Set();
+// True only when NOTHING is focused (browsers park focus on <body>/<html>).
+// The fallback below must never fire while the user has deliberately focused
+// some other element — a text input obviously, but also any other widget
+// (e.g. a different, non-pasteable field): pasting "into" the thing they
+// focused must not teleport files to an unrelated field.
+function is_unclaimed_focus(el) {
+    return !el || el === document.body || el === document.documentElement;
+}
+// Text-entry elements own their pastes even when they live INSIDE the field
+// (consumer content via the label/description/below snippets) — an editor's
+// image paste must insert into the editor, not upload into the field.
+function is_text_entry(el) {
+    if (!el)
+        return false;
+    if (el.isContentEditable)
+        return true;
+    return ["INPUT", "TEXTAREA", "SELECT"].includes(el.tagName);
+}
+// A field hidden by CSS (kept-mounted inactive tab panel etc.) must not
+// claim the no-focus fallback — the user would see nothing happen.
+function is_visible(el) {
+    return el.checkVisibility?.() ?? el.offsetParent !== null;
+}
+// A modal/dialog (drawer, modal) takes focus on open, so `active` is the
+// dialog panel — or a control inside it — and NEVER <body>. When the field
+// lives in such a dialog, treat a non-text focus within that SAME dialog as
+// unclaimed too, so a bare Ctrl/Cmd-V attaches with no prior click. Scoped to
+// a shared [aria-modal]/[role=dialog] ancestor on purpose: it must not make
+// the field greedy on ordinary (non-modal) pages, where a deliberately
+// focused control elsewhere still owns its paste.
+function shares_modal(fieldEl, active) {
+    if (!active)
+        return false;
+    const modal = fieldEl.closest?.("[aria-modal='true'],[role='dialog']");
+    return !!modal && modal.contains(active);
+}
+function on_document_paste(e) {
+    // someone (an editor, another paste handler) already claimed it
+    if (e.defaultPrevented)
+        return;
+    const active = document.activeElement;
+    // 1) the field holding focus always wins — unless focus sits in a
+    // text-entry element nested inside it: stand down entirely
+    for (const t of paste_targets) {
+        if (t.el.contains(active)) {
+            if (is_text_entry(active))
+                return;
+            return t.handle(e);
+        }
+    }
+    // 2) fall back to the SINGLE mounted + visible pasteable field for a paste
+    // NOT owned by a focused text-entry element, when focus is EITHER unclaimed
+    // (fresh page, focus on <body>) OR parked on a non-text control inside the
+    // SAME modal/dialog as the field (the drawer/modal case: the panel or the
+    // row that opened it holds focus, so <body> is never active). A bare
+    // Ctrl/Cmd-V then works with no prior click. With several fields mounted the
+    // routing would be ambiguous, so focus (a click on the field) must decide.
+    if (paste_targets.size === 1 && !is_text_entry(active)) {
+        const [t] = paste_targets;
+        if (is_visible(t.el) && (is_unclaimed_focus(active) || shares_modal(t.el, active))) {
+            t.handle(e);
+        }
+    }
+}
+/**
+ * Registers a pasteable field. Returns the unregister function. The document
+ * listener is installed with the first registration and removed with the last.
+ */
+export function registerPasteTarget(t) {
+    if (!paste_targets.size)
+        document.addEventListener("paste", on_document_paste);
+    paste_targets.add(t);
+    return () => {
+        paste_targets.delete(t);
+        if (!paste_targets.size)
+            document.removeEventListener("paste", on_document_paste);
+    };
+}
+/**
+ * The file entries of a paste. Prefers `items` (lets us keep only file-kind
+ * entries, e.g. a pasted screenshot); falls back to `.files` for browsers that
+ * only populate that. Empty for a plain-text paste.
+ */
+export function extractClipboardFiles(e) {
+    const dt = e.clipboardData;
+    if (!dt)
+        return [];
+    const out = [];
+    for (let i = 0; i < (dt.items?.length ?? 0); i++) {
+        const it = dt.items[i];
+        if (it?.kind === "file") {
+            const f = it.getAsFile();
+            if (f)
+                out.push(f);
+        }
+    }
+    if (!out.length && dt.files?.length)
+        out.push(...dt.files);
+    return out;
+}

package/dist/components/Input/field-single-asset-i18n-sk.d.ts

@@ -0,0 +1,21 @@
+import type { FieldSingleAssetMessages } from "./field-single-asset-i18n.js";
+/**
+ * Slovak message catalog for `FieldSingleAsset`. Opt-in — English stays the built-in
+ * default, and this module is only pulled into a bundle when it is actually imported
+ * (the component itself never references it).
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import {
+ *     FieldSingleAsset,
+ *     createFieldSingleAssetT,
+ *     FIELD_SINGLE_ASSET_MESSAGES_SK,
+ *   } from "@marianmeres/stuic";
+ *   const t = createFieldSingleAssetT(FIELD_SINGLE_ASSET_MESSAGES_SK);
+ * </script>
+ *
+ * <FieldSingleAsset name="avatar" bind:value {processAsset} {t} />
+ * ```
+ */
+export declare const FIELD_SINGLE_ASSET_MESSAGES_SK: FieldSingleAssetMessages;

package/dist/components/Input/field-single-asset-i18n-sk.js

@@ -0,0 +1,50 @@
+/**
+ * Slovak message catalog for `FieldSingleAsset`. Opt-in — English stays the built-in
+ * default, and this module is only pulled into a bundle when it is actually imported
+ * (the component itself never references it).
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import {
+ *     FieldSingleAsset,
+ *     createFieldSingleAssetT,
+ *     FIELD_SINGLE_ASSET_MESSAGES_SK,
+ *   } from "@marianmeres/stuic";
+ *   const t = createFieldSingleAssetT(FIELD_SINGLE_ASSET_MESSAGES_SK);
+ * </script>
+ *
+ * <FieldSingleAsset name="avatar" bind:value {processAsset} {t} />
+ * ```
+ */
+export const FIELD_SINGLE_ASSET_MESSAGES_SK = {
+    field_req_att: "Toto pole vyžaduje pozornosť. Skontrolujte ho a skúste to znova.",
+    pick_file: "Vybrať súbor",
+    replace_file: "Nahradiť {{name}}",
+    empty_hint: "Presuňte sem súbor alebo kliknite a vyberte ho",
+    remove: "Odstrániť",
+    removing_short: "Odstraňuje sa…",
+    removed: "Súbor {{name}} bol odstránený",
+    undo: "Vrátiť späť",
+    restored: "Súbor {{name}} bol obnovený",
+    preview: "Náhľad",
+    retry: "Skúsiť nahrať znova",
+    discard: "Zahodiť",
+    cancel_upload: "Zrušiť nahrávanie",
+    uploading: "Nahráva sa {{name}}",
+    uploading_short: "Nahráva sa…",
+    uploading_progress: "Nahráva sa… {{percent}} %",
+    uploaded: "Súbor {{name}} bol nahraný",
+    upload_failed: "Nahrávanie zlyhalo",
+    upload_failed_named: "Nahrávanie súboru {{name}} zlyhalo: {{error}}",
+    invalid_type: "Tento typ súboru nie je podporovaný. Povolené: „{{accept}}“.",
+    too_large: "Súbor je príliš veľký ({{size}}). Maximum je {{max}}.",
+    single_only: "Sem je možné umiestniť iba jeden súbor. Presuňte alebo prilepte jeden súbor.",
+    // AssetsPreview
+    unable_to_preview: "Tento súbor nie je možné zobraziť",
+    download: "Stiahnuť originál",
+    close: "Zavrieť náhľad",
+    zoom_in: "Priblížiť",
+    zoom_out: "Oddialiť",
+    delete: "Odstrániť",
+};

package/dist/components/Input/field-single-asset-i18n.d.ts

@@ -0,0 +1,69 @@
+import type { TranslateFn } from "../../types.js";
+/**
+ * The built-in (English) message catalog of `FieldSingleAsset`. Also the fallback of
+ * every other bundled locale, so a locale missing a key still renders text.
+ *
+ * Placeholders are mustache-style (`{{name}}`, `{{max}}`, ...). The last six keys are
+ * the ones the embedded `AssetsPreview` looks up, so one `t` serves both.
+ */
+export declare const FIELD_SINGLE_ASSET_MESSAGES_EN: {
+    field_req_att: string;
+    pick_file: string;
+    replace_file: string;
+    empty_hint: string;
+    remove: string;
+    removing_short: string;
+    removed: string;
+    undo: string;
+    restored: string;
+    preview: string;
+    retry: string;
+    discard: string;
+    cancel_upload: string;
+    uploading: string;
+    uploading_short: string;
+    uploading_progress: string;
+    uploaded: string;
+    upload_failed: string;
+    upload_failed_named: string;
+    invalid_type: string;
+    too_large: string;
+    single_only: string;
+    unable_to_preview: string;
+    download: string;
+    close: string;
+    zoom_in: string;
+    zoom_out: string;
+    delete: string;
+};
+/** Every message key `FieldSingleAsset` may look up. */
+export type FieldSingleAssetMessageKey = keyof typeof FIELD_SINGLE_ASSET_MESSAGES_EN;
+/** A (possibly partial) catalog for one locale. */
+export type FieldSingleAssetMessages = Record<FieldSingleAssetMessageKey, string>;
+/**
+ * Builds the `t` prop of `FieldSingleAsset` from a message catalog. Unknown or
+ * untranslated keys fall back to `fallbackMessages` (English by default), so a catalog
+ * may safely be partial and never renders a raw key.
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import {
+ *     FieldSingleAsset,
+ *     createFieldSingleAssetT,
+ *     FIELD_SINGLE_ASSET_MESSAGES_SK,
+ *   } from "@marianmeres/stuic";
+ *
+ *   // full locale, plus a field specific tweak
+ *   const t = createFieldSingleAssetT({
+ *     ...FIELD_SINGLE_ASSET_MESSAGES_SK,
+ *     empty_hint: "Sem presuňte fotku",
+ *   });
+ * </script>
+ *
+ * <FieldSingleAsset name="avatar" bind:value {processAsset} {t} />
+ * ```
+ */
+export declare function createFieldSingleAssetT(messages: Partial<FieldSingleAssetMessages> | Record<string, string>, fallbackMessages?: Partial<FieldSingleAssetMessages> | Record<string, string>): TranslateFn;
+/** The component's built-in English `t`. */
+export declare const t_default: TranslateFn;

package/dist/components/Input/field-single-asset-i18n.js

@@ -0,0 +1,76 @@
+import { isPlainObject } from "../../utils/is-plain-object.js";
+import { replaceMap } from "../../utils/replace-map.js";
+/**
+ * The built-in (English) message catalog of `FieldSingleAsset`. Also the fallback of
+ * every other bundled locale, so a locale missing a key still renders text.
+ *
+ * Placeholders are mustache-style (`{{name}}`, `{{max}}`, ...). The last six keys are
+ * the ones the embedded `AssetsPreview` looks up, so one `t` serves both.
+ */
+export const FIELD_SINGLE_ASSET_MESSAGES_EN = {
+    field_req_att: "This field requires attention. Please review and try again.",
+    pick_file: "Choose a file",
+    replace_file: "Replace {{name}}",
+    empty_hint: "Drop a file here or click to browse",
+    remove: "Remove",
+    removing_short: "Removing…",
+    removed: "{{name}} removed",
+    undo: "Undo",
+    restored: "{{name}} restored",
+    preview: "Preview",
+    retry: "Retry upload",
+    discard: "Discard",
+    cancel_upload: "Cancel upload",
+    uploading: "Uploading {{name}}",
+    uploading_short: "Uploading…",
+    uploading_progress: "Uploading… {{percent}}%",
+    uploaded: "{{name}} uploaded",
+    upload_failed: "Upload failed",
+    upload_failed_named: "Upload of {{name}} failed: {{error}}",
+    invalid_type: 'This file type is not supported. Allowed: "{{accept}}".',
+    too_large: "The file is too large ({{size}}). The maximum is {{max}}.",
+    single_only: "Only one file can be placed here. Drop or paste a single file.",
+    // AssetsPreview
+    unable_to_preview: "This file cannot be previewed",
+    download: "Download original",
+    close: "Close preview window",
+    zoom_in: "Zoom in",
+    zoom_out: "Zoom out",
+    delete: "Delete",
+};
+/**
+ * Builds the `t` prop of `FieldSingleAsset` from a message catalog. Unknown or
+ * untranslated keys fall back to `fallbackMessages` (English by default), so a catalog
+ * may safely be partial and never renders a raw key.
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import {
+ *     FieldSingleAsset,
+ *     createFieldSingleAssetT,
+ *     FIELD_SINGLE_ASSET_MESSAGES_SK,
+ *   } from "@marianmeres/stuic";
+ *
+ *   // full locale, plus a field specific tweak
+ *   const t = createFieldSingleAssetT({
+ *     ...FIELD_SINGLE_ASSET_MESSAGES_SK,
+ *     empty_hint: "Sem presuňte fotku",
+ *   });
+ * </script>
+ *
+ * <FieldSingleAsset name="avatar" bind:value {processAsset} {t} />
+ * ```
+ */
+export function createFieldSingleAssetT(messages, fallbackMessages = FIELD_SINGLE_ASSET_MESSAGES_EN) {
+    return (k, values = null, fallback = "") => {
+        const out = messages[k] ??
+            fallbackMessages[k] ??
+            (typeof fallback === "string" ? fallback : k);
+        return isPlainObject(values)
+            ? replaceMap(out, values)
+            : out;
+    };
+}
+/** The component's built-in English `t`. */
+export const t_default = createFieldSingleAssetT(FIELD_SINGLE_ASSET_MESSAGES_EN);

package/dist/components/Input/index.css

@@ -119,6 +119,25 @@
 	--stuic-field-table-col-min-checkbox: 3rem;
 	--stuic-field-table-col-min-date: 9.5rem;
 	--stuic-field-table-col-min-url: 12rem;
+
+	/* FieldSingleAsset */
+	--stuic-field-single-asset-size-sm: 5rem;
+	--stuic-field-single-asset-size-md: 8rem;
+	--stuic-field-single-asset-size-lg: 12rem;
+	--stuic-field-single-asset-wide-ratio: 16 / 9;
+	--stuic-field-single-asset-preview-bg: var(--stuic-color-muted);
+	--stuic-field-single-asset-preview-border: var(--stuic-color-border);
+	--stuic-field-single-asset-preview-border-hover: var(--stuic-color-ring);
+	--stuic-field-single-asset-placeholder-text: var(--stuic-color-muted-foreground);
+	--stuic-field-single-asset-meta-text: var(--stuic-color-muted-foreground);
+	--stuic-field-single-asset-control-bg: rgb(0 0 0 / 0.6);
+	--stuic-field-single-asset-control-bg-hover: rgb(0 0 0 / 0.8);
+	--stuic-field-single-asset-control-text: #fff;
+	--stuic-field-single-asset-overlay-bg: rgb(0 0 0 / 0.4);
+	--stuic-field-single-asset-error-color: var(--stuic-input-accent-error);
+	/* `--stuic-field-single-asset-size`, `-radius`, `-control-radius`, `-border-width`
+	   and `-transition` are deliberately NOT declared: they are read as fallback
+	   arguments at the usage site — see docs/conventions.md. */
 }
 
 @layer components {
@@ -1551,3 +1570,201 @@
 		}
 	}
 }
+
+/* ============================================================================
+   FIELD SINGLE ASSET
+   One tile (the preview, also the picker + drop target) with hover/focus
+   actions, a meta column, and an inline Undo after a remove. Layout that a
+   theme may want to change lives here; utility classes in the component only
+   handle flex/gap.
+   ============================================================================ */
+@layer components {
+	.stuic-field-single-asset-tile {
+		--_size: var(
+			--stuic-field-single-asset-size,
+			var(--stuic-field-single-asset-size-md)
+		);
+		height: var(--_size);
+	}
+	.stuic-field-single-asset[data-size="sm"] .stuic-field-single-asset-tile {
+		--_size: var(
+			--stuic-field-single-asset-size,
+			var(--stuic-field-single-asset-size-sm)
+		);
+	}
+	.stuic-field-single-asset[data-size="lg"] .stuic-field-single-asset-tile {
+		--_size: var(
+			--stuic-field-single-asset-size,
+			var(--stuic-field-single-asset-size-lg)
+		);
+	}
+
+	.stuic-field-single-asset-preview {
+		position: relative;
+		display: grid;
+		place-content: center;
+		overflow: hidden;
+		height: 100%;
+		width: auto;
+		max-width: 100%;
+		aspect-ratio: 1 / 1;
+		padding: 0;
+		background: var(--stuic-field-single-asset-preview-bg);
+		color: var(--stuic-field-single-asset-placeholder-text);
+		border-style: solid;
+		border-width: var(--stuic-field-single-asset-border-width, var(--stuic-border-width));
+		border-color: var(--stuic-field-single-asset-preview-border);
+		border-radius: var(--stuic-field-single-asset-radius, var(--stuic-radius));
+		cursor: pointer;
+		transition: border-color
+			var(--stuic-field-single-asset-transition, var(--stuic-transition));
+	}
+	.stuic-field-single-asset[data-shape="circle"] .stuic-field-single-asset-preview {
+		border-radius: 9999px;
+	}
+	.stuic-field-single-asset[data-shape="wide"] .stuic-field-single-asset-preview {
+		aspect-ratio: var(--stuic-field-single-asset-wide-ratio);
+	}
+	.stuic-field-single-asset[data-state="empty"] .stuic-field-single-asset-preview {
+		border-style: dashed;
+	}
+	.stuic-field-single-asset[data-state="error"] .stuic-field-single-asset-preview {
+		border-color: var(--stuic-field-single-asset-error-color);
+	}
+	.stuic-field-single-asset-preview:disabled {
+		cursor: default;
+	}
+	.stuic-field-single-asset[data-state="loading"] .stuic-field-single-asset-preview {
+		cursor: default;
+		border-color: transparent;
+	}
+	.stuic-field-single-asset-preview:not(:disabled):hover {
+		border-color: var(--stuic-field-single-asset-preview-border-hover);
+	}
+	.stuic-field-single-asset-preview:focus-visible {
+		outline: 2px solid var(--stuic-color-ring);
+		outline-offset: 2px;
+	}
+	/* the tile is `disabled` while the field only displays (or while an async
+	   `onBeforeRemove` is in flight) — keep it legible */
+	.stuic-field-single-asset[data-state="filled"]
+		.stuic-field-single-asset-preview:disabled,
+	.stuic-field-single-asset[data-state="removing"]
+		.stuic-field-single-asset-preview:disabled {
+		opacity: 1;
+	}
+
+	.stuic-field-single-asset-img {
+		position: absolute;
+		inset: 0;
+		width: 100%;
+		height: 100%;
+		object-fit: cover;
+	}
+	.stuic-field-single-asset[data-fit="contain"] .stuic-field-single-asset-img {
+		object-fit: contain;
+		padding: calc(var(--spacing) * 2);
+	}
+	.stuic-field-single-asset-icon {
+		display: grid;
+		place-content: center;
+	}
+
+	.stuic-field-single-asset-overlay {
+		position: absolute;
+		inset: 0;
+		display: grid;
+		place-content: center;
+		pointer-events: none;
+		color: #fff;
+		background: var(--stuic-field-single-asset-overlay-bg);
+	}
+	.stuic-field-single-asset-overlay[data-error] {
+		background: color-mix(
+			in oklab,
+			var(--stuic-field-single-asset-error-color) 55%,
+			transparent
+		);
+	}
+
+	/* Actions: hidden until the tile is hovered / focused (or on a failed upload,
+	   where Retry / Discard must be findable); pointer events gated the same way so
+	   an invisible control never intercepts a click meant for the tile. Keyboard
+	   users Tab to them regardless. Touch has no hover: always shown there. */
+	.stuic-field-single-asset-actions {
+		position: absolute;
+		top: calc(var(--spacing) * 1);
+		right: calc(var(--spacing) * 1);
+		display: flex;
+		gap: calc(var(--spacing) * 1);
+		opacity: 0;
+		pointer-events: none;
+		transition: opacity
+			var(--stuic-field-single-asset-transition, var(--stuic-transition));
+	}
+	/* pinned open on error (Retry / Discard must not depend on hover) and while a
+	   remove is in flight (the busy spinner lives in the Remove control) */
+	.stuic-field-single-asset-tile:hover .stuic-field-single-asset-actions,
+	.stuic-field-single-asset-tile:focus-within .stuic-field-single-asset-actions,
+	.stuic-field-single-asset[data-state="error"] .stuic-field-single-asset-actions,
+	.stuic-field-single-asset[data-state="removing"] .stuic-field-single-asset-actions {
+		opacity: 1;
+		pointer-events: auto;
+	}
+	@media (hover: none) {
+		.stuic-field-single-asset-actions {
+			opacity: 1;
+			pointer-events: auto;
+		}
+	}
+	.stuic-field-single-asset-control {
+		display: grid;
+		place-content: center;
+		padding: calc(var(--spacing) * 1);
+		border-radius: var(
+			--stuic-field-single-asset-control-radius,
+			var(--stuic-radius-button)
+		);
+		background: var(--stuic-field-single-asset-control-bg);
+		color: var(--stuic-field-single-asset-control-text);
+		cursor: pointer;
+		transition: background-color
+			var(--stuic-field-single-asset-transition, var(--stuic-transition));
+	}
+	.stuic-field-single-asset-control:hover:not([aria-disabled="true"]) {
+		background: var(--stuic-field-single-asset-control-bg-hover);
+	}
+	/* `aria-disabled`, not `disabled`: a busy control keeps focus for the round trip */
+	.stuic-field-single-asset-control[aria-disabled="true"] {
+		cursor: default;
+	}
+	.stuic-field-single-asset-control[aria-disabled="true"]:not([aria-busy="true"]) {
+		opacity: 0.5;
+	}
+	.stuic-field-single-asset-control:focus-visible {
+		outline: 2px solid var(--stuic-color-ring);
+		outline-offset: 1px;
+	}
+
+	.stuic-field-single-asset-meta {
+		color: var(--stuic-field-single-asset-meta-text);
+	}
+	.stuic-field-single-asset-undo {
+		display: inline-flex;
+		align-items: center;
+		gap: calc(var(--spacing) * 1);
+		margin-left: calc(var(--spacing) * 2);
+		color: var(--stuic-color-foreground);
+		text-decoration: underline;
+		text-underline-offset: 2px;
+		cursor: pointer;
+	}
+	.stuic-field-single-asset-undo:focus-visible {
+		outline: 2px solid var(--stuic-color-ring);
+		outline-offset: 2px;
+		border-radius: var(
+			--stuic-field-single-asset-control-radius,
+			var(--stuic-radius-button)
+		);
+	}
+}

package/dist/components/Input/index.d.ts

@@ -1,5 +1,8 @@
 export * from "./types.js";
 export { default as FieldAssets, type Props as FieldAssetsProps, type FieldAsset, type FieldAssetUrlObj, type FieldAssetWithBlobUrl, } from "./FieldAssets.svelte";
+export { default as FieldSingleAsset, type Props as FieldSingleAssetProps, type FieldSingleAssetUploadContext, type FieldSingleAssetShape, type FieldSingleAssetFit, type FieldSingleAssetSize, type FieldSingleAssetFileCheck, } from "./FieldSingleAsset.svelte";
+export { createFieldSingleAssetT, FIELD_SINGLE_ASSET_MESSAGES_EN, type FieldSingleAssetMessageKey, type FieldSingleAssetMessages, } from "./field-single-asset-i18n.js";
+export { FIELD_SINGLE_ASSET_MESSAGES_SK } from "./field-single-asset-i18n-sk.js";
 export { default as FieldCheckbox, type Props as FieldCheckboxProps, } from "./FieldCheckbox.svelte";
 export { default as Honeypot, type Props as HoneypotProps } from "./Honeypot.svelte";
 export { default as TimeTrap, type Props as TimeTrapProps, type TimeTrapSnapshot, } from "./TimeTrap.svelte";

package/dist/components/Input/index.js

@@ -1,5 +1,8 @@
 export * from "./types.js";
 export { default as FieldAssets, } from "./FieldAssets.svelte";
+export { default as FieldSingleAsset, } from "./FieldSingleAsset.svelte";
+export { createFieldSingleAssetT, FIELD_SINGLE_ASSET_MESSAGES_EN, } from "./field-single-asset-i18n.js";
+export { FIELD_SINGLE_ASSET_MESSAGES_SK } from "./field-single-asset-i18n-sk.js";
 export { default as FieldCheckbox, } from "./FieldCheckbox.svelte";
 export { default as Honeypot } from "./Honeypot.svelte";
 export { default as TimeTrap, } from "./TimeTrap.svelte";

package/docs/domains/actions.md

@@ -121,7 +121,7 @@ Per the HTML spec, `<input type="hidden">` is _barred from constraint
 validation_ — `validity.valueMissing` stays `false` regardless of the
 `required` attribute, and native browser submit blocking is skipped. Several
 STUIC field components (`FieldPhoneNumber`, `FieldCountry`, `FieldObject`,
-`FieldAssets`, `FieldInputLocalized`, `FieldKeyValues`, `FieldLikeButton`,
+`FieldAssets`, `FieldSingleAsset`, `FieldInputLocalized`, `FieldKeyValues`, `FieldLikeButton`,
 `FieldDate`, `FieldDateRange`) use a hidden input to participate in `FormData`, so they each enforce
 `required` themselves inside their `customValidator`:
 
@@ -153,12 +153,12 @@ Two element types are deliberately exempt from the synthetic dispatch:
   group, which is wrong.
 - **`type="file"`** — a file input's value is read-only to script, so a
   synthetic `change` can't re-validate it; worse, it re-triggers any dropzone /
-  upload listener bound to the input. `FieldAssets` wires its hidden
+  upload listener bound to the input. `FieldAssets` (and `FieldSingleAsset`) wire their hidden
   `<input type="file">` through `fileDropzone`, so a re-fired `change` would
   re-run `processFiles` with the previously-picked file still in `inputEl.files`
   — duplicating the asset and firing a real re-upload on every save. File inputs
   are still read for native constraint validation (`required`); only the event
-  dispatch is skipped. (`FieldAssets` additionally clears its file input after
+  dispatch is skipped. (Both additionally clear their file input after
   consuming a selection, both as defense-in-depth and to allow re-selecting the
   same file twice in a row.)