@0001-labs/design-system-1 0.3.0-alpha.13 → 0.3.0-alpha.14

package/dist/react/dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../DS1/react/dialog.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../DS1/react/dialog.ts"],"names":[],"mappings":"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"}

package/dist/react/dialog.js

@@ -1,5 +1,5 @@
 /** Optional React composition; behavior and appearance belong to ds-dialog. */
-import { createContext, createElement, useContext, useId, useLayoutEffect, useRef, useState } from "react";
+import { createContext, createElement, useContext, useEffect, useId, useLayoutEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 const DialogContext = createContext(null);
 const useDialog = () => {
@@ -17,10 +17,35 @@ export function Dialog({ open, defaultOpen = false, onOpenChange, children }) {
                 setInternal(next); onOpenChange?.(next, reason); },
         } }, children);
 }
-export function DialogContent({ children, portal = true, nonModal = false, closeOnOutside = false, blockOutside = false, holdScroll = false, anchor = null, returnFocus = null, closeLabel = "Close", showClose = true, closeOnEscape = true, closeOnBackdrop = true, fullScreen = false, flush = false, rotated = false, ...props }) {
+/** The longest a sliding dialog stays on the page after closing, should its transition never end. */
+const LEAVING = 600;
+export function DialogContent({ children, portal = true, nonModal = false, closeOnOutside = false, blockOutside = false, holdScroll = false, anchor = null, returnFocus = null, closeLabel = "Close", showClose = true, closeOnEscape = true, closeOnBackdrop = true, fullScreen = false, flush = false, rotated = false, placement = "center", ...props }) {
     const context = useDialog();
     const host = useRef(null);
     const [mounted, setMounted] = useState(false);
+    // A sheet or drawer stays on the page while it slides out, then leaves.
+    const sliding = placement !== "center";
+    const [leaving, setLeaving] = useState(false);
+    const [wasOpen, setWasOpen] = useState(context.open);
+    if (wasOpen !== context.open) {
+        setWasOpen(context.open);
+        setLeaving(!context.open && sliding && mounted);
+    }
+    useEffect(() => {
+        if (!leaving)
+            return;
+        const native = host.current?.querySelector("dialog");
+        const done = () => setLeaving(false);
+        const ended = (event) => {
+            const { propertyName, pseudoElement } = event;
+            if (event.target === native && !pseudoElement && (propertyName === "transform" || propertyName === "opacity"))
+                done();
+        };
+        native?.addEventListener("transitionend", ended);
+        native?.addEventListener("transitioncancel", ended);
+        const timer = setTimeout(done, LEAVING);
+        return () => { clearTimeout(timer); native?.removeEventListener("transitionend", ended); native?.removeEventListener("transitioncancel", ended); };
+    }, [leaving]);
     // A portal has no server location. Keep the server and first client render
     // identical, including when the application initially requests an open modal.
     useLayoutEffect(() => { setMounted(true); }, []);
@@ -59,10 +84,11 @@ export function DialogContent({ children, portal = true, nonModal = false, close
         element.holdScroll = holdScroll;
         element.anchor = anchor;
         element.returnFocus = returnFocus;
+        element.placement = placement;
         element.open = context.open;
         return () => element.removeEventListener("ds-close-request", close);
     });
-    if (!mounted || !context.open)
+    if (!mounted || (!context.open && !leaving))
         return null;
     const content = createElement("ds-dialog", { ref: host }, createElement("dialog", { ...props, "data-ds-dialog-fullscreen": fullScreen || undefined, "data-ds-dialog-flush": flush || undefined, "data-ds-dialog-rotated": rotated || undefined }, children, showClose && createElement("ds-button", { control: "slotted", icon: true, "data-ds-dialog": "close" }, createElement("button", { type: "button", "aria-label": closeLabel, "data-ds-dialog-dismiss": "" }, createElement("ds-icon", { type: "close", "aria-hidden": true })))));
     return portal ? createPortal(content, document.body) : content;

package/dist/react/document.d.ts

@@ -0,0 +1,11 @@
+import { type HTMLAttributes } from "react";
+import type { DocumentPage as DocumentElement } from "../4-page/ds-document";
+export type DocumentPageProps = HTMLAttributes<DocumentElement> & Partial<Pick<DocumentElement, "levels" | "label" | "literal" | "hideContents">>;
+/**
+ * A document page: the children are the writing (native headings,
+ * paragraphs and a `<dl className="ds-definitions">`), in the light DOM so
+ * they render on the server; the element builds the contents from them.
+ * Browser-only registration stays in the product's runtime entry for SSR.
+ */
+export declare const DocumentPage: import("react").ForwardRefExoticComponent<HTMLAttributes<DocumentElement> & Partial<Pick<DocumentElement, "label" | "literal" | "levels" | "hideContents">> & import("react").RefAttributes<DocumentElement>>;
+//# sourceMappingURL=document.d.ts.map

package/dist/react/document.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"document.d.ts","sourceRoot":"","sources":["../../DS1/react/document.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,KAAK,EAAE,YAAY,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE7E,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,eAAe,CAAC,GAC7D,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,cAAc,CAAC,CAAC,CAAC;AAClF;;;;;GAKG;AACH,eAAO,MAAM,YAAY,+MAEvB,CAAC"}

package/dist/react/document.js

@@ -0,0 +1,10 @@
+import { createElement, forwardRef } from "react";
+/**
+ * A document page: the children are the writing (native headings,
+ * paragraphs and a `<dl className="ds-definitions">`), in the light DOM so
+ * they render on the server; the element builds the contents from them.
+ * Browser-only registration stays in the product's runtime entry for SSR.
+ */
+export const DocumentPage = forwardRef(function DocumentPage({ hideContents, ...props }, ref) {
+    return createElement("ds-document", { ...props, "hide-contents": hideContents || undefined, "data-ds-prose": "", ref });
+});

package/dist/react/empty.d.ts

@@ -0,0 +1,34 @@
+/** An empty state in React: the words stay in the light DOM, so they render on
+ * the server and read in tests; ds-empty draws them. Browser-only registration
+ * of ds-empty stays in the product's runtime entry. */
+import { type HTMLAttributes, type ReactNode } from "react";
+import type { Empty as EmptyElement } from "../2-core/ds-empty";
+export type EmptyProps = Omit<HTMLAttributes<EmptyElement>, "title"> & {
+    /** The title. Unset, the shared words' "Nothing here yet" in the current language. */
+    heading?: ReactNode;
+    /** The line under the title; `children` take its place when given. */
+    text?: ReactNode;
+    /** An icon from the library on the square above the title. */
+    icon?: string;
+    /** The buttons or links that fill the place, on one row. */
+    actions?: ReactNode;
+    /** Centre the words in the space the element stands in. */
+    centered?: boolean;
+    /** Make the title a heading of this level (1–6). */
+    level?: number;
+};
+export declare const Empty: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<EmptyElement>, "title"> & {
+    /** The title. Unset, the shared words' "Nothing here yet" in the current language. */
+    heading?: ReactNode;
+    /** The line under the title; `children` take its place when given. */
+    text?: ReactNode;
+    /** An icon from the library on the square above the title. */
+    icon?: string;
+    /** The buttons or links that fill the place, on one row. */
+    actions?: ReactNode;
+    /** Centre the words in the space the element stands in. */
+    centered?: boolean;
+    /** Make the title a heading of this level (1–6). */
+    level?: number;
+} & import("react").RefAttributes<EmptyElement>>;
+//# sourceMappingURL=empty.d.ts.map

package/dist/react/empty.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty.d.ts","sourceRoot":"","sources":["../../DS1/react/empty.ts"],"names":[],"mappings":"AAAA;;uDAEuD;AACvD,OAAO,EAAkC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5F,OAAO,KAAK,EAAE,KAAK,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEhE,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,EAAE,OAAO,CAAC,GAAG;IACrE,sFAAsF;IACtF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,sEAAsE;IACtE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAKF,eAAO,MAAM,KAAK;IAjBhB,sFAAsF;cAC5E,SAAS;IACnB,sEAAsE;WAC/D,SAAS;IAChB,8DAA8D;WACvD,MAAM;IACb,4DAA4D;cAClD,SAAS;IACnB,2DAA2D;eAChD,OAAO;IAClB,oDAAoD;YAC5C,MAAM;gDAad,CAAC"}

package/dist/react/empty.js

@@ -0,0 +1,8 @@
+/** An empty state in React: the words stay in the light DOM, so they render on
+ * the server and read in tests; ds-empty draws them. Browser-only registration
+ * of ds-empty stays in the product's runtime entry. */
+import { createElement as h, forwardRef } from "react";
+const title = (content) => content == null || content === false || content === "" ? null : h("span", { slot: "heading" }, content);
+export const Empty = forwardRef(function Empty({ heading, text, icon, actions, centered, level, children, ...props }, ref) {
+    return h("ds-empty", { ...props, icon, centered: centered || undefined, level, ref }, title(heading), children ?? text, actions == null || actions === false ? null : h("div", { slot: "actions", style: { display: "contents" } }, actions));
+});

package/dist/react/file-picker.d.ts

@@ -13,7 +13,7 @@ export type FilePickerProps = Omit<InputHTMLAttributes<HTMLInputElement>, "type"
     children?: ReactNode;
 };
 /** The ref and events belong to the native input; classes only place the host. */
-export declare const FilePicker: import("react").ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "value" | "defaultValue" | "children"> & {
+export declare const FilePicker: import("react").ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "type" | "defaultValue" | "children"> & {
     label: string;
     icon?: boolean;
     preview?: boolean;

package/dist/react/footer.d.ts

@@ -0,0 +1,13 @@
+import { type HTMLAttributes } from "react";
+import type { Footer as FooterElement } from "../4-page/ds-footer";
+export type { FooterColumn, FooterLink, FooterPreference } from "../4-page/ds-footer";
+export type FooterProps = Omit<HTMLAttributes<FooterElement>, "columns"> & Partial<Pick<FooterElement, "brand" | "href" | "tagline" | "columns" | "label" | "owner" | "year" | "preferences" | "literal">>;
+/**
+ * A site footer from data: `columns` is set as a property, so React passes
+ * the array as it stands. A brand, preferences or legal line of the page's own
+ * take `slot="brand"`, `slot="preferences"` and `slot="legal"`. A page that
+ * must render its links on the server writes the `.ds-footer` classes instead.
+ * Browser-only registration stays in the product's runtime entry for SSR.
+ */
+export declare const Footer: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<FooterElement>, "columns"> & Partial<Pick<FooterElement, "label" | "href" | "literal" | "columns" | "year" | "preferences" | "brand" | "tagline" | "owner">> & import("react").RefAttributes<FooterElement>>;
+//# sourceMappingURL=footer.d.ts.map

package/dist/react/footer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../DS1/react/footer.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,KAAK,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEnE,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACtF,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,SAAS,CAAC,GACtE,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,aAAa,GAAG,SAAS,CAAC,CAAC,CAAC;AAClI;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,4QAGjB,CAAC"}

package/dist/react/footer.js

@@ -0,0 +1,12 @@
+import { createElement, forwardRef } from "react";
+/**
+ * A site footer from data: `columns` is set as a property, so React passes
+ * the array as it stands. A brand, preferences or legal line of the page's own
+ * take `slot="brand"`, `slot="preferences"` and `slot="legal"`. A page that
+ * must render its links on the server writes the `.ds-footer` classes instead.
+ * Browser-only registration stays in the product's runtime entry for SSR.
+ */
+export const Footer = forwardRef(function Footer({ preferences, ...props }, ref) {
+    // `preferences` present but empty means every preference, as the attribute does.
+    return createElement("ds-footer", { ...props, preferences: preferences === undefined ? undefined : String(preferences), ref });
+});

package/dist/react/header.d.ts

@@ -0,0 +1,12 @@
+import { type HTMLAttributes } from "react";
+import type { Header as HeaderElement } from "../4-page/ds-header";
+export type HeaderProps = HTMLAttributes<HeaderElement> & Partial<Pick<HeaderElement, "brand" | "href" | "label" | "literal" | "sticky">>;
+/**
+ * A site header. Its navigation is the children: `<a href>` links, in the
+ * light DOM so they render on the server; actions take `slot="actions"`, a
+ * brand of the page's own `slot="brand"`. Typed so a React product needs no
+ * `IntrinsicElements` entry of its own for `ds-header`. Browser-only
+ * registration stays in the product's runtime entry for SSR.
+ */
+export declare const Header: import("react").ForwardRefExoticComponent<HTMLAttributes<HeaderElement> & Partial<Pick<HeaderElement, "label" | "href" | "literal" | "sticky" | "brand">> & import("react").RefAttributes<HeaderElement>>;
+//# sourceMappingURL=header.d.ts.map

package/dist/react/header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../DS1/react/header.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,KAAK,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEnE,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,aAAa,CAAC,GACrD,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC;AAClF;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,2MAEjB,CAAC"}

package/dist/react/header.js

@@ -0,0 +1,11 @@
+import { createElement, forwardRef } from "react";
+/**
+ * A site header. Its navigation is the children: `<a href>` links, in the
+ * light DOM so they render on the server; actions take `slot="actions"`, a
+ * brand of the page's own `slot="brand"`. Typed so a React product needs no
+ * `IntrinsicElements` entry of its own for `ds-header`. Browser-only
+ * registration stays in the product's runtime entry for SSR.
+ */
+export const Header = forwardRef(function Header(props, ref) {
+    return createElement("ds-header", { ...props, ref });
+});

package/dist/react/input.d.ts

@@ -9,27 +9,49 @@ export type InputProps = Omit<InputHTMLAttributes<InputElement>, "value" | "defa
     variant?: InputElement["variant"];
     revealable?: boolean;
     quietFocus?: boolean;
+    /** The label on the row above the field, as written. */
+    label?: string;
+    /** The label as a translation key, shown in the page's language. */
+    labelText?: string;
+    /** The placeholder as a translation key; `placeholder` is as written. */
+    placeholderKey?: string;
+    /** The error under the field, as written, in the danger colour. */
     error?: string;
-};
-type FieldProps = InputProps & {
+    /** The error as a translation key. */
+    errorText?: string;
+    /** Suggestions offered while typing; `list` names a `<datalist>` instead. */
+    suggestions?: InputElement["suggestions"];
+    /** A text area: the field across whole rows. */
+    multiline?: boolean;
     rows?: number;
     wrap?: "soft" | "hard" | "off";
     autoGrow?: boolean;
     maxRows?: number;
 };
-export type TextareaProps = Omit<FieldProps, "type" | "revealable" | "min" | "max" | "step" | "pattern"> & {
-    variant?: "field" | "plain";
-};
-export declare const Input: import("react").ForwardRefExoticComponent<Omit<InputHTMLAttributes<InputElement>, "size" | "type" | "value" | "defaultValue"> & {
+export declare const Input: import("react").ForwardRefExoticComponent<Omit<InputHTMLAttributes<InputElement>, "size" | "value" | "type" | "defaultValue"> & {
     value?: string | number;
     defaultValue?: string | number;
     type?: InputElement["type"];
     variant?: InputElement["variant"];
     revealable?: boolean;
     quietFocus?: boolean;
+    /** The label on the row above the field, as written. */
+    label?: string;
+    /** The label as a translation key, shown in the page's language. */
+    labelText?: string;
+    /** The placeholder as a translation key; `placeholder` is as written. */
+    placeholderKey?: string;
+    /** The error under the field, as written, in the danger colour. */
     error?: string;
-} & import("react").RefAttributes<InputElement>>;
-export declare const Textarea: import("react").ForwardRefExoticComponent<Omit<FieldProps, "pattern" | "type" | "revealable" | "min" | "max" | "step"> & {
-    variant?: "field" | "plain";
+    /** The error as a translation key. */
+    errorText?: string;
+    /** Suggestions offered while typing; `list` names a `<datalist>` instead. */
+    suggestions?: InputElement["suggestions"];
+    /** A text area: the field across whole rows. */
+    multiline?: boolean;
+    rows?: number;
+    wrap?: "soft" | "hard" | "off";
+    autoGrow?: boolean;
+    maxRows?: number;
 } & import("react").RefAttributes<InputElement>>;
 //# sourceMappingURL=input.d.ts.map

package/dist/react/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../DS1/react/input.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,OAAO,EAUL,KAAK,mBAAmB,EAEzB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,KAAK,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAChE,YAAY,EAAE,YAAY,EAAE,CAAC;AAC7B,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,mBAAmB,CAAC,YAAY,CAAC,EACjC,OAAO,GAAG,cAAc,GAAG,MAAM,GAAG,MAAM,CAC3C,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,IAAI,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAuBF,KAAK,UAAU,GAAG,UAAU,GAAG;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,KAAK,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AACF,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,UAAU,EACV,MAAM,GAAG,YAAY,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,SAAS,CAC3D,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;CAAE,CAAC;AA2HpC,eAAO,MAAM,KAAK;YAlKR,MAAM,GAAG,MAAM;mBACR,MAAM,GAAG,MAAM;WACvB,YAAY,CAAC,MAAM,CAAC;cACjB,YAAY,CAAC,SAAS,CAAC;iBACpB,OAAO;iBACP,OAAO;YACZ,MAAM;gDA4JyC,CAAC;AAC1D,eAAO,MAAM,QAAQ;cA5HL,OAAO,GAAG,OAAO;gDA4HiC,CAAC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../DS1/react/input.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,OAAO,EAUL,KAAK,mBAAmB,EAEzB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,KAAK,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAChE,YAAY,EAAE,YAAY,EAAE,CAAC;AAC7B,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,mBAAmB,CAAC,YAAY,CAAC,EACjC,OAAO,GAAG,cAAc,GAAG,MAAM,GAAG,MAAM,CAC3C,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,IAAI,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yEAAyE;IACzE,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mEAAmE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6EAA6E;IAC7E,WAAW,CAAC,EAAE,YAAY,CAAC,aAAa,CAAC,CAAC;IAC1C,gDAAgD;IAChD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,KAAK,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAuBF,eAAO,MAAM,KAAK;YA/CR,MAAM,GAAG,MAAM;mBACR,MAAM,GAAG,MAAM;WACvB,YAAY,CAAC,MAAM,CAAC;cACjB,YAAY,CAAC,SAAS,CAAC;iBACpB,OAAO;iBACP,OAAO;IACpB,wDAAwD;YAChD,MAAM;IACd,oEAAoE;gBACxD,MAAM;IAClB,yEAAyE;qBACxD,MAAM;IACvB,mEAAmE;YAC3D,MAAM;IACd,sCAAsC;gBAC1B,MAAM;IAClB,6EAA6E;kBAC/D,YAAY,CAAC,aAAa,CAAC;IACzC,gDAAgD;gBACpC,OAAO;WACZ,MAAM;WACN,MAAM,GAAG,MAAM,GAAG,KAAK;eACnB,OAAO;cACR,MAAM;gDAuJhB,CAAC"}

package/dist/react/input.js

@@ -28,101 +28,101 @@ function setRef(ref, field) {
     if (ref)
         ref.current = field;
 }
-function fieldAdapter(tag) {
-    return forwardRef(function Field({ value, defaultValue, onChange, onInput, autoFocus, autoComplete, inputMode, readOnly, minLength, maxLength, min, max, step, spellCheck, form, type = "text", variant = "field", quietFocus, autoGrow, maxRows, ...props }, forwardedRef) {
-        const field = useRef(null);
-        const initial = useRef(String(defaultValue ?? ""));
-        const [, refresh] = useReducer((version) => version + 1, 0);
-        const controlled = value !== undefined;
-        const ref = useCallback((element) => {
-            field.current = element;
-            return setRef(forwardedRef, element);
-        }, [forwardedRef]);
-        // React does not restore controlled values on custom elements. Reconcile
-        // after every commit, including when an application rejects an edit.
-        useCommitEffect(() => {
-            if (controlled && field.current)
-                field.current.value = String(value);
-            // form is a read-only ElementInternals getter, not a writable property.
-            if (form !== undefined)
-                field.current?.setAttribute("form", form);
-            else
-                field.current?.removeAttribute("form");
-        });
-        useEffect(() => {
-            const element = field.current;
-            if (!element || !controlled)
-                return;
-            const reset = () => refresh();
-            element.addEventListener("input-reset", reset);
-            return () => element.removeEventListener("input-reset", reset);
-        }, [controlled]);
-        const attributes = { ...props };
-        const listeners = [];
-        for (const key of Object.keys(attributes)) {
-            if (key.startsWith("aria-") && typeof attributes[key] === "boolean")
-                attributes[key] = String(attributes[key]);
-            if (/^on[A-Z]/.test(key) && typeof attributes[key] === "function") {
-                const callback = attributes[key];
-                const capture = key.endsWith("Capture");
-                const name = key.slice(2, capture ? -7 : undefined);
-                const native = { Focus: "focusin", Blur: "focusout", DoubleClick: "dblclick" }[name] ?? name.toLowerCase();
-                listeners.push({
-                    name: native,
-                    capture,
-                    callback: (event) => {
-                        if (field.current)
-                            callback(reactEvent(event, field.current));
-                    },
-                });
-                delete attributes[key];
-            }
+export const Input = forwardRef(function Field({ value, defaultValue, onChange, onInput, autoFocus, autoComplete, inputMode, readOnly, minLength, maxLength, min, max, step, spellCheck, form, type = "text", variant = "field", quietFocus, multiline, autoGrow, maxRows, labelText, placeholderKey, errorText, ...props }, forwardedRef) {
+    const field = useRef(null);
+    const initial = useRef(String(defaultValue ?? ""));
+    const [, refresh] = useReducer((version) => version + 1, 0);
+    const controlled = value !== undefined;
+    const ref = useCallback((element) => {
+        field.current = element;
+        return setRef(forwardedRef, element);
+    }, [forwardedRef]);
+    // React does not restore controlled values on custom elements. Reconcile
+    // after every commit, including when an application rejects an edit.
+    useCommitEffect(() => {
+        if (controlled && field.current)
+            field.current.value = String(value);
+        // form is a read-only ElementInternals getter, not a writable property.
+        if (form !== undefined)
+            field.current?.setAttribute("form", form);
+        else
+            field.current?.removeAttribute("form");
+    });
+    useEffect(() => {
+        const element = field.current;
+        if (!element || !controlled)
+            return;
+        const reset = () => refresh();
+        element.addEventListener("input-reset", reset);
+        return () => element.removeEventListener("input-reset", reset);
+    }, [controlled]);
+    const attributes = { ...props };
+    const listeners = [];
+    for (const key of Object.keys(attributes)) {
+        if (key.startsWith("aria-") && typeof attributes[key] === "boolean")
+            attributes[key] = String(attributes[key]);
+        if (/^on[A-Z]/.test(key) && typeof attributes[key] === "function") {
+            const callback = attributes[key];
+            const capture = key.endsWith("Capture");
+            const name = key.slice(2, capture ? -7 : undefined);
+            const native = { Focus: "focusin", Blur: "focusout", DoubleClick: "dblclick" }[name] ?? name.toLowerCase();
+            listeners.push({
+                name: native,
+                capture,
+                callback: (event) => {
+                    if (field.current)
+                        callback(reactEvent(event, field.current));
+                },
+            });
+            delete attributes[key];
         }
-        listeners.push({
-            name: "input",
-            capture: false,
-            callback: (native) => {
-                if (!field.current)
-                    return;
-                const event = reactEvent(native, field.current);
-                onInput?.(event);
-                onChange?.(event);
-                if (controlled)
-                    refresh();
-            },
-        });
-        useCommitEffect(() => {
-            const element = field.current;
-            if (!element)
+    }
+    listeners.push({
+        name: "input",
+        capture: false,
+        callback: (native) => {
+            if (!field.current)
                 return;
+            const event = reactEvent(native, field.current);
+            onInput?.(event);
+            onChange?.(event);
+            if (controlled)
+                refresh();
+        },
+    });
+    useCommitEffect(() => {
+        const element = field.current;
+        if (!element)
+            return;
+        for (const { name, callback, capture } of listeners)
+            element.addEventListener(name, callback, capture);
+        return () => {
             for (const { name, callback, capture } of listeners)
-                element.addEventListener(name, callback, capture);
-            return () => {
-                for (const { name, callback, capture } of listeners)
-                    element.removeEventListener(name, callback, capture);
-            };
-        });
-        return createElement(tag, {
-            ...attributes,
-            ref,
-            type,
-            variant,
-            value: controlled ? String(value) : initial.current,
-            autofocus: autoFocus,
-            autocomplete: autoComplete,
-            inputmode: inputMode,
-            readonly: readOnly,
-            minlength: minLength,
-            maxlength: maxLength,
-            min: min == null ? undefined : String(min),
-            max: max == null ? undefined : String(max),
-            step: step == null ? undefined : String(step),
-            spellcheck: spellCheck === undefined ? undefined : String(spellCheck),
-            "quiet-focus": quietFocus,
-            "auto-grow": autoGrow,
-            "max-rows": maxRows,
-        });
+                element.removeEventListener(name, callback, capture);
+        };
     });
-}
-export const Input = fieldAdapter("ds-input");
-export const Textarea = fieldAdapter("ds-textarea");
+    return createElement("ds-input", {
+        ...attributes,
+        ref,
+        type,
+        variant,
+        value: controlled ? String(value) : initial.current,
+        autofocus: autoFocus,
+        autocomplete: autoComplete,
+        inputmode: inputMode,
+        readonly: readOnly,
+        minlength: minLength,
+        maxlength: maxLength,
+        min: min == null ? undefined : String(min),
+        max: max == null ? undefined : String(max),
+        step: step == null ? undefined : String(step),
+        spellcheck: spellCheck === undefined ? undefined : String(spellCheck),
+        "quiet-focus": quietFocus,
+        "label-text": labelText,
+        "placeholder-key": placeholderKey,
+        "error-text": errorText,
+        multiline: multiline || undefined,
+        "auto-grow": autoGrow,
+        "max-rows": maxRows,
+    });
+});

package/dist/react/kbd.d.ts

@@ -0,0 +1,26 @@
+/** A keyboard shortcut's hint in React: ds-kbd writes the shortcut as the
+ * reader's platform does (⇧⌘D, Ctrl+Shift+D). Browser-only registration of
+ * ds-kbd stays in the product's runtime entry; children are words of the
+ * product's own, shown when there is no `shortcut`. */
+import { type HTMLAttributes, type ReactNode } from "react";
+import type { Kbd as KbdElement } from "../2-core/ds-kbd";
+import type { KeyPlatform } from "../0-face/keys";
+export type KbdProps = HTMLAttributes<KbdElement> & {
+    /** The shortcut, written once for every platform: `mod+shift+d`, `escape`, `?`. */
+    shortcut?: string;
+    /** The words alone in the title grey, as a menu entry writes its shortcut. */
+    plain?: boolean;
+    /** Write it for this platform rather than the reader's own. */
+    platform?: KeyPlatform;
+    children?: ReactNode;
+};
+export declare const Kbd: import("react").ForwardRefExoticComponent<HTMLAttributes<KbdElement> & {
+    /** The shortcut, written once for every platform: `mod+shift+d`, `escape`, `?`. */
+    shortcut?: string;
+    /** The words alone in the title grey, as a menu entry writes its shortcut. */
+    plain?: boolean;
+    /** Write it for this platform rather than the reader's own. */
+    platform?: KeyPlatform;
+    children?: ReactNode;
+} & import("react").RefAttributes<KbdElement>>;
+//# sourceMappingURL=kbd.d.ts.map

package/dist/react/kbd.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd.d.ts","sourceRoot":"","sources":["../../DS1/react/kbd.ts"],"names":[],"mappings":"AAAA;;;uDAGuD;AACvD,OAAO,EAAkC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5F,OAAO,KAAK,EAAE,GAAG,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,MAAM,MAAM,QAAQ,GAAG,cAAc,CAAC,UAAU,CAAC,GAAG;IAClD,mFAAmF;IACnF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,GAAG;IATd,mFAAmF;eACxE,MAAM;IACjB,8EAA8E;YACtE,OAAO;IACf,+DAA+D;eACpD,WAAW;eACX,SAAS;8CAKpB,CAAC"}

package/dist/react/kbd.js

@@ -0,0 +1,8 @@
+/** A keyboard shortcut's hint in React: ds-kbd writes the shortcut as the
+ * reader's platform does (⇧⌘D, Ctrl+Shift+D). Browser-only registration of
+ * ds-kbd stays in the product's runtime entry; children are words of the
+ * product's own, shown when there is no `shortcut`. */
+import { createElement as h, forwardRef } from "react";
+export const Kbd = forwardRef(function Kbd({ shortcut, plain, platform, children, ...props }, ref) {
+    return h("ds-kbd", { ...props, shortcut, plain: plain || undefined, platform, ref }, children);
+});

package/dist/react/loading.d.ts

@@ -0,0 +1,14 @@
+import { type CSSProperties, type ReactNode } from "react";
+export declare const loadingStyles: string;
+/** SSR-safe automatic feedback. Decorative when a containing status owns the label.
+ * Shared markup and CSS work before hydration; no DOM runtime is imported.
+ * Unset, the label is the shared word "Loading" in the page's language. A
+ * spinner in a button or field is one control high, elsewhere one square. */
+export declare function LoadingIndicator({ label, variant, decorative, className, style }: {
+    label?: string;
+    variant?: "bar" | "spinner";
+    decorative?: boolean;
+    className?: string;
+    style?: CSSProperties;
+}): ReactNode;
+//# sourceMappingURL=loading.d.ts.map

package/dist/react/loading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading.d.ts","sourceRoot":"","sources":["../../DS1/react/loading.ts"],"names":[],"mappings":"AAAA,OAAO,EAA2B,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGpF,eAAO,MAAM,aAAa,QAAS,CAAC;AACpC;;;6EAG6E;AAC7E,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,OAAe,EAAE,UAAkB,EAAE,SAAc,EAAE,KAAK,EAAE,EAAE;IACtG,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAC;CAC9G,GAAG,SAAS,CAOZ"}

package/dist/react/loading.js

@@ -0,0 +1,14 @@
+import { createElement, Fragment } from "react";
+import { getText } from "../0-face/i18n";
+import styles from "../2-core/styles/ds-loading.css?inline";
+export const loadingStyles = styles;
+/** SSR-safe automatic feedback. Decorative when a containing status owns the label.
+ * Shared markup and CSS work before hydration; no DOM runtime is imported.
+ * Unset, the label is the shared word "Loading" in the page's language. A
+ * spinner in a button or field is one control high, elsewhere one square. */
+export function LoadingIndicator({ label, variant = "bar", decorative = false, className = "", style }) {
+    const name = decorative ? undefined : label || getText("Loading") || "Loading";
+    return createElement(Fragment, null, createElement("style", null, styles), createElement("span", { className: `ds-loading ${className}`, style, "data-variant": variant,
+        role: decorative ? undefined : "status", "aria-label": name,
+        "aria-hidden": decorative || undefined, "aria-busy": decorative ? undefined : true }, createElement("span", { className: "ds-loading__fill", "aria-hidden": true })));
+}