@bysages/react 0.3.0 → 0.3.1

package/dist/{ai-response-jZy-0Tvv.mjs → ai-response-BfKTmtCt.mjs}

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "./messages-1jJWtaYU.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx } from "react/jsx-runtime";
 import { useEffect, useRef } from "react";
@@ -99,20 +100,23 @@ function wrapResponseTables(root) {
 }
 //#endregion
 //#region src/components/ai-response/index.tsx
-function Response({ content, highlighter, copyLabel = "Copy code", copiedLabel = "Copied", ...rest }) {
+function Response({ content, highlighter, copyLabel, copiedLabel, ...rest }) {
 	injectComponentStyle("ai");
+	const messages = useComponentMessages();
+	const resolvedCopyLabel = copyLabel ?? messages.ai.copyCode;
+	const resolvedCopiedLabel = copiedLabel ?? messages.ai.copied;
 	const root = useRef(null);
 	useEffect(() => {
 		const host = root.current;
-		if (host) decorateCodeCopy(host, copyLabel);
+		if (host) decorateCodeCopy(host, resolvedCopyLabel);
 		if (host) wrapResponseTables(host);
 	}, [
 		content,
 		highlighter,
-		copyLabel
+		resolvedCopyLabel
 	]);
 	const onClick = (event) => {
-		clickCodeCopy(event.nativeEvent, copyLabel, copiedLabel);
+		clickCodeCopy(event.nativeEvent, resolvedCopyLabel, resolvedCopiedLabel);
 	};
 	return /* @__PURE__ */ jsx("div", {
 		...rest,

package/dist/components/ai/index.d.mts

@@ -1,2 +1,2 @@
-import { a as AiLoader, c as ReasoningUIPart, d as StepStartUIPart, f as TextUIPart, h as UIMessagePart, i as AiConversation, l as SourceDocumentUIPart, m as UIMessage, n as AiActions, o as DataUIPart, p as ToolUIPart, r as AiContent, s as FileUIPart, t as Ai, u as SourceUrlUIPart } from "../../index-CsfxYv6J.mjs";
-export { Ai, AiActions, AiContent, AiConversation, AiLoader, type DataUIPart, type FileUIPart, type ReasoningUIPart, type SourceDocumentUIPart, type SourceUrlUIPart, type StepStartUIPart, type TextUIPart, type ToolUIPart, type UIMessage, type UIMessagePart };
+import { a as FileUIPart, c as SourceUrlUIPart, d as ToolUIPart, f as UIMessage, i as DataUIPart, l as StepStartUIPart, n as AiActions, o as ReasoningUIPart, p as UIMessagePart, r as AiContent, s as SourceDocumentUIPart, t as Ai, u as TextUIPart } from "../../index-Dn5mHf1g.mjs";
+export { Ai, AiActions, AiContent, type DataUIPart, type FileUIPart, type ReasoningUIPart, type SourceDocumentUIPart, type SourceUrlUIPart, type StepStartUIPart, type TextUIPart, type ToolUIPart, type UIMessage, type UIMessagePart };

package/dist/components/ai/index.mjs

@@ -1,8 +1,9 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { Action } from "../ai-action/index.mjs";
 import { AiMessage as Message } from "../ai-message/index.mjs";
 import { AiPromptInput as PromptInput } from "../ai-prompt-input/index.mjs";
 import { AiReasoning as Reasoning } from "../ai-reasoning/index.mjs";
-import { t as Response } from "../../ai-response-jZy-0Tvv.mjs";
+import { t as Response } from "../../ai-response-BfKTmtCt.mjs";
 import { AiSource as Source, AiSources as Sources } from "../ai-source/index.mjs";
 import { AiSuggestion as Suggestion } from "../ai-suggestion/index.mjs";
 import { AiTool as Tool } from "../ai-tool/index.mjs";
@@ -29,20 +30,34 @@ function part(name, tag, extra = {}) {
 }
 /** The log itself: the column every stroke lands in, a landmark to
 * screen readers. */
-const AiConversation = part("Conversation", "div", {
-	role: "log",
-	"aria-label": "Conversation"
-});
+function AiConversation({ children, ...rest }) {
+	const messages = useComponentMessages();
+	return /* @__PURE__ */ jsx("div", {
+		...rest,
+		role: "log",
+		"aria-label": rest["aria-label"] ?? messages.ai.conversation,
+		"data-scope": "ai",
+		"data-part": "conversation",
+		children
+	});
+}
 /** The bubble's inner measure — content that belongs to neither side
 * specifically. */
 const AiContent = part("Content", "div");
 /** The quiet row under a message — copy, retry, feedback. */
 const AiActions = part("Actions", "div");
 /** The while-it-works whisper for the in-flight turns. */
-const AiLoader = part("Loader", "span", {
-	role: "status",
-	"aria-label": "Loading"
-});
+function AiLoader({ children, ...rest }) {
+	const messages = useComponentMessages();
+	return /* @__PURE__ */ jsx("span", {
+		...rest,
+		role: "status",
+		"aria-label": rest["aria-label"] ?? messages.ai.loading,
+		"data-scope": "ai",
+		"data-part": "loader",
+		children
+	});
+}
 /** The whole family under one handle — `Ai.Conversation`,
 * `Ai.Message`, and the rest, exactly as before the split. */
 const Ai = Object.assign(AiConversation, {
@@ -62,4 +77,4 @@ const Ai = Object.assign(AiConversation, {
 });
 injectComponentStyle("ai");
 //#endregion
-export { Ai, AiActions, AiContent, AiConversation, AiLoader };
+export { Ai, AiActions, AiContent };

package/dist/components/ai-attachments/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages, t as formatMessage } from "../../messages-1jJWtaYU.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ai-attachments/index.tsx
@@ -74,6 +75,7 @@ const humanSize = (bytes) => {
 };
 function Attachment({ name, size, status = "ready", onRemove, ...rest }) {
 	injectComponentStyle("ai");
+	const messages = useComponentMessages();
 	return /* @__PURE__ */ jsxs("span", {
 		...rest,
 		"data-scope": "ai",
@@ -86,7 +88,7 @@ function Attachment({ name, size, status = "ready", onRemove, ...rest }) {
 			/* @__PURE__ */ jsx("button", {
 				type: "button",
 				"data-remove": "",
-				"aria-label": `Remove ${name}`,
+				"aria-label": formatMessage(messages.ai.removeAttachment, { name }),
 				onClick: () => onRemove?.(),
 				children: removeGlyph
 			})

package/dist/components/ai-prompt-input/index.d.mts

@@ -42,6 +42,6 @@ export interface PromptInputProps extends Omit<HTMLAttributes<HTMLFormElement>,
   footer?: ReactNode;
   footerEnd?: ReactNode;
 }
-export declare function PromptInput({ value, onValueChange, onSubmit, onStop, placeholder, disabled, busy, mentions, header, leading, trailing, footer, footerEnd, ...rest }: PromptInputProps): import("react").JSX.Element;
+export declare function PromptInput({ value, onValueChange, onSubmit, onStop, placeholder, "aria-label": ariaLabel, disabled, busy, mentions, header, leading, trailing, footer, footerEnd, ...rest }: PromptInputProps): import("react").JSX.Element;
 //#endregion
 export { PromptInput as AiPromptInput };

package/dist/components/ai-prompt-input/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { Button } from "../button/index.mjs";
 import { Field } from "../field/index.mjs";
 import { n as MentionsVessel, r as useMentions } from "../../mentions-DMIBCBOd.mjs";
@@ -39,9 +40,11 @@ function row(part, content) {
 		children: content
 	});
 }
-function PromptInput({ value, onValueChange, onSubmit, onStop, placeholder = "Send a message", disabled = false, busy = false, mentions, header, leading, trailing, footer, footerEnd, ...rest }) {
+function PromptInput({ value, onValueChange, onSubmit, onStop, placeholder, "aria-label": ariaLabel, disabled = false, busy = false, mentions, header, leading, trailing, footer, footerEnd, ...rest }) {
 	injectComponentStyle("ai");
 	const fieldRef = useRef(null);
+	const messages = useComponentMessages();
+	const placeholderText = placeholder ?? messages.ai.conversation;
 	const mentionState = useMentions(() => ({
 		items: mentions?.items ?? [],
 		trigger: mentions?.trigger
@@ -61,7 +64,7 @@ function PromptInput({ value, onValueChange, onSubmit, onStop, placeholder = "Se
 		size: "sm",
 		square: true,
 		type: "button",
-		"aria-label": "Stop",
+		"aria-label": messages.ai.stop,
 		disabled,
 		onClick: () => onStop?.(),
 		children: stopGlyph
@@ -70,7 +73,7 @@ function PromptInput({ value, onValueChange, onSubmit, onStop, placeholder = "Se
 		size: "sm",
 		square: true,
 		type: "submit",
-		"aria-label": "Send",
+		"aria-label": messages.ai.send,
 		disabled: disabled || !value.trim(),
 		children: arrowUpGlyph
 	});
@@ -95,7 +98,8 @@ function PromptInput({ value, onValueChange, onSubmit, onStop, placeholder = "Se
 						autoresize: true,
 						rows: 1,
 						value,
-						placeholder,
+						placeholder: placeholderText,
+						"aria-label": ariaLabel ?? messages.ai.conversation,
 						disabled,
 						onChange: (event) => {
 							onValueChange?.(event.target.value);

package/dist/components/ai-response/index.d.mts

@@ -12,9 +12,11 @@ export interface ResponseProps extends HTMLAttributes<HTMLDivElement> {
   /** Optional code-highlighting function re-inking fenced blocks; the
    * component stays agnostic about which engine provides it. */
   highlighter?: (code: string, lang?: string) => string;
-  /** The copy stamp's accessible name before the copy lands. */
+  /** The copy stamp's accessible name before the copy lands; leave
+   * unset for the resolved default. */
   copyLabel?: string;
-  /** The copy stamp's accessible name once the text has landed. */
+  /** The copy stamp's accessible name once the text has landed; leave
+   * unset for the resolved default. */
   copiedLabel?: string;
 }
 export declare function Response({ content, highlighter, copyLabel, copiedLabel, ...rest }: ResponseProps): import("react").JSX.Element;

package/dist/components/ai-response/index.mjs

@@ -1,2 +1,2 @@
-import { t as Response } from "../../ai-response-jZy-0Tvv.mjs";
+import { t as Response } from "../../ai-response-BfKTmtCt.mjs";
 export { Response as AiResponse, Response };

package/dist/components/autocomplete/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Portal } from "@ark-ui/react/portal";
@@ -6,6 +7,7 @@ import { Combobox } from "@ark-ui/react/combobox";
 //#region src/components/autocomplete/index.tsx
 function AutoComplete({ value = "", items = [], placeholder, filter, size = "md", onValueChange, ...rest }) {
 	injectComponentStyle("combobox");
+	const messages = useComponentMessages();
 	const { collection, filter: filterItems } = useListCollection({
 		initialItems: items,
 		filter: (item, input) => filter ? filter(item, input) : item.toLowerCase().includes(input.toLowerCase())
@@ -25,7 +27,7 @@ function AutoComplete({ value = "", items = [], placeholder, filter, size = "md"
 			onValueChange?.(details.inputValue);
 		},
 		positioning: { sameWidth: true },
-		children: [/* @__PURE__ */ jsx(Combobox.Control, { children: /* @__PURE__ */ jsx(Combobox.Input, { placeholder }) }), /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Combobox.Positioner, { children: /* @__PURE__ */ jsxs(Combobox.Content, { children: [/* @__PURE__ */ jsx(Combobox.Empty, { children: "No matches" }), collection.items.map((item) => /* @__PURE__ */ jsx(Combobox.Item, {
+		children: [/* @__PURE__ */ jsx(Combobox.Control, { children: /* @__PURE__ */ jsx(Combobox.Input, { placeholder }) }), /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Combobox.Positioner, { children: /* @__PURE__ */ jsxs(Combobox.Content, { children: [/* @__PURE__ */ jsx(Combobox.Empty, { children: messages.command.noMatches }), collection.items.map((item) => /* @__PURE__ */ jsx(Combobox.Item, {
 			item,
 			children: /* @__PURE__ */ jsx(Combobox.ItemText, { children: item })
 		}, item))] }) }) })]

package/dist/components/banner/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/index.tsx
@@ -31,24 +32,27 @@ const Description = part("Description", "p");
 const Actions = part("Actions", "div");
 /** The quiet close: a plain square-cut button; dismissal stays the
 * consumer's state. */
-const Close = (rest) => /* @__PURE__ */ jsx("button", {
-	...rest,
-	type: rest.type ?? "button",
-	"aria-label": rest["aria-label"] ?? "Dismiss",
-	"data-scope": "banner",
-	"data-part": "close",
-	children: /* @__PURE__ */ jsx("svg", {
-		viewBox: "0 0 16 16",
-		fill: "none",
-		"aria-hidden": true,
-		children: /* @__PURE__ */ jsx("path", {
-			d: "M4 4l8 8M12 4l-8 8",
-			stroke: "currentColor",
-			strokeWidth: 1.5,
-			strokeLinecap: "round"
+const Close = (rest) => {
+	const messages = useComponentMessages();
+	return /* @__PURE__ */ jsx("button", {
+		...rest,
+		type: rest.type ?? "button",
+		"aria-label": rest["aria-label"] ?? messages.banner.dismiss,
+		"data-scope": "banner",
+		"data-part": "close",
+		children: /* @__PURE__ */ jsx("svg", {
+			viewBox: "0 0 16 16",
+			fill: "none",
+			"aria-hidden": true,
+			children: /* @__PURE__ */ jsx("path", {
+				d: "M4 4l8 8M12 4l-8 8",
+				stroke: "currentColor",
+				strokeWidth: 1.5,
+				strokeLinecap: "round"
+			})
 		})
-	})
-});
+	});
+};
 const Banner = Object.assign(Root, {
 	Root,
 	Icon,

package/dist/components/breadcrumb/index.d.mts

@@ -1,13 +1,8 @@
 import { AnchorHTMLAttributes, HTMLAttributes } from "react";
 //#region src/components/breadcrumb/index.d.ts
-export declare const Breadcrumb: {
-  ({ children, ...rest }: HTMLAttributes<HTMLElement>): import("react").JSX.Element;
-  displayName: string;
-} & {
-  Root: {
-    ({ children, ...rest }: HTMLAttributes<HTMLElement>): import("react").JSX.Element;
-    displayName: string;
-  };
+declare function Root({ children, ...rest }: HTMLAttributes<HTMLElement>): import("react").JSX.Element;
+export declare const Breadcrumb: typeof Root & {
+  Root: typeof Root;
   List: {
     ({ children, ...rest }: HTMLAttributes<HTMLElement>): import("react").JSX.Element;
     displayName: string;

package/dist/components/breadcrumb/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/breadcrumb/index.tsx
@@ -16,7 +17,16 @@ function part(name, tag, extra = {}, fallback) {
 	Component.displayName = "Breadcrumb" + name;
 	return Component;
 }
-const Root = part("Root", "nav", { "aria-label": "Breadcrumb" });
+function Root({ children, ...rest }) {
+	const messages = useComponentMessages();
+	return /* @__PURE__ */ jsx("nav", {
+		...rest,
+		"aria-label": rest["aria-label"] ?? messages.breadcrumb.label,
+		"data-scope": "breadcrumb",
+		"data-part": "root",
+		children
+	});
+}
 const List = part("List", "ol");
 const Item = part("Item", "li");
 const Link = part("Link", "a");

package/dist/components/cascade-select/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { t as Input } from "../../input-2oezH-dY.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -40,6 +41,7 @@ const checkGlyph = /* @__PURE__ */ jsx("svg", {
 });
 function CascadeSelect({ value, data, placeholder = "Select…", highlightTrigger, filterable = false, multiple = false, disabled = false, size = "md", onValueChange, ...rest }) {
 	injectComponentStyle("cascade-select");
+	const messages = useComponentMessages();
 	const id = useId();
 	const locale = useLocaleContext();
 	const env = useEnvironmentContext();
@@ -176,6 +178,7 @@ function CascadeSelect({ value, data, placeholder = "Select…", highlightTrigge
 			...api.getControlProps(),
 			children: /* @__PURE__ */ jsxs("button", {
 				...api.getTriggerProps(),
+				"aria-labelledby": id + ":value-text",
 				onClick: (event) => {
 					api.getTriggerProps().onClick?.(event);
 					setQuery("");
@@ -183,6 +186,7 @@ function CascadeSelect({ value, data, placeholder = "Select…", highlightTrigge
 				disabled: disabled || void 0,
 				children: [/* @__PURE__ */ jsx("span", {
 					...api.getValueTextProps(),
+					id: id + ":value-text",
 					children: display || placeholder
 				}), /* @__PURE__ */ jsx("span", {
 					...api.getIndicatorProps(),
@@ -201,8 +205,8 @@ function CascadeSelect({ value, data, placeholder = "Select…", highlightTrigge
 						size: "sm",
 						value: query,
 						onValueChange: setQuery,
-						placeholder: "Filter…",
-						"aria-label": "Filter options"
+						placeholder: messages.select.filter,
+						"aria-label": messages.select.filter
 					})
 				}) : null, /* @__PURE__ */ jsx("div", {
 					"data-scope": "cascade-select",

package/dist/components/command/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
@@ -6,9 +7,12 @@ import { useListCollection } from "@ark-ui/react/collection";
 import { Combobox } from "@ark-ui/react/combobox";
 import { Dialog } from "@ark-ui/react/dialog";
 //#region src/components/command/index.tsx
-function Command({ items = [], placeholder, open, autoFilter = true, inputValue, emptyText = "No matching commands", onSelect, onOpenChange, onInputValueChange }) {
+function Command({ items = [], placeholder, open, autoFilter = true, inputValue, emptyText, onSelect, onOpenChange, onInputValueChange }) {
 	injectComponentStyle("command");
 	injectComponentStyle("dialog");
+	const messages = useComponentMessages();
+	const resolvedPlaceholder = placeholder ?? messages.command.search;
+	const resolvedEmptyText = emptyText ?? messages.command.noMatches;
 	const [internalOpen, setInternalOpen] = useState(false);
 	const [listOpen, setListOpen] = useState(true);
 	const [fieldText, setFieldText] = useState("");
@@ -74,6 +78,7 @@ function Command({ items = [], placeholder, open, autoFilter = true, inputValue,
 					children: /* @__PURE__ */ jsx("div", {
 						"data-scope": "command",
 						"data-part": "content",
+						"aria-label": messages.command.palette,
 						children: /* @__PURE__ */ jsxs(Combobox.Root, {
 							collection,
 							inputValue,
@@ -96,7 +101,8 @@ function Command({ items = [], placeholder, open, autoFilter = true, inputValue,
 								asChild: true,
 								children: /* @__PURE__ */ jsx("input", {
 									type: "text",
-									placeholder,
+									placeholder: resolvedPlaceholder,
+									"aria-label": resolvedPlaceholder,
 									"data-scope": "command",
 									"data-part": "input"
 								})
@@ -122,7 +128,7 @@ function Command({ items = [], placeholder, open, autoFilter = true, inputValue,
 									}, group)), groups.size === 0 ? /* @__PURE__ */ jsx("div", {
 										"data-scope": "command",
 										"data-part": "empty",
-										children: emptyText
+										children: resolvedEmptyText
 									}) : null]
 								})
 							})]

package/dist/components/config-provider/index.d.mts

@@ -1,4 +1,4 @@
-import { ThemeScene } from "@bysages/core";
+import { ComponentMessagesOverride, ThemeScene } from "@bysages/core";
 import { HTMLAttributes, ReactNode } from "react";
 //#region src/components/config-provider/index.d.ts
 /** The four density tiers the token layer's `[data-density]` selectors
@@ -22,6 +22,8 @@ export interface ConfigContext {
   dir?: "ltr" | "rtl";
   /** BCP-47 locale, landing as the native `lang` attribute. */
   locale?: string;
+  /** Partial leaf overrides for wrapper-owned runtime copy. */
+  messages?: ComponentMessagesOverride;
 }
 /** The nearest provider's snapshot, or an empty one when no provider
  * wraps the caller — the hook the date and format families will consume
@@ -33,6 +35,7 @@ export interface ConfigProviderProps extends HTMLAttributes<HTMLDivElement> {
   accent?: string;
   dir?: "ltr" | "rtl";
   locale?: string;
+  messages?: ComponentMessagesOverride;
   children?: ReactNode;
 }
 /**
@@ -42,5 +45,5 @@ export interface ConfigProviderProps extends HTMLAttributes<HTMLDivElement> {
  * descendants through `useConfig`, so interactive behavior (formatting,
  * messages) and visual theming stay one decision.
  */
-export declare function ConfigProvider({ density, scene, accent, dir, locale, children, ...rest }: ConfigProviderProps): import("react").JSX.Element;
+export declare function ConfigProvider({ density, scene, accent, dir, locale, messages, children, ...rest }: ConfigProviderProps): import("react").JSX.Element;
 //#endregion

package/dist/components/config-provider/index.mjs

@@ -15,14 +15,15 @@ function useConfig() {
 * descendants through `useConfig`, so interactive behavior (formatting,
 * messages) and visual theming stay one decision.
 */
-function ConfigProvider({ density, scene, accent, dir, locale, children, ...rest }) {
+function ConfigProvider({ density, scene, accent, dir, locale, messages, children, ...rest }) {
 	return /* @__PURE__ */ jsx(ConfigContextImpl.Provider, {
 		value: {
 			density,
 			scene,
 			accent,
 			dir,
-			locale
+			locale,
+			messages
 		},
 		children: /* @__PURE__ */ jsx("div", {
 			...rest,

package/dist/components/data-view/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { Pagination } from "../pagination/index.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -10,6 +11,7 @@ import { useState } from "react";
 function DataView({ items, layout = "list", pageSize, renderItem, header, ...rest }) {
 	injectComponentStyle("data-view");
 	const [page, setPage] = useState(1);
+	const messages = useComponentMessages();
 	const pageCount = pageSize ? Math.max(1, Math.ceil(items.length / pageSize)) : 1;
 	const visible = pageSize ? items.slice((page - 1) * pageSize, page * pageSize) : items;
 	return /* @__PURE__ */ jsxs("div", {
@@ -39,7 +41,7 @@ function DataView({ items, layout = "list", pageSize, renderItem, header, ...res
 					onPageChange: (details) => setPage(details.page),
 					children: [
 						/* @__PURE__ */ jsx(Pagination.PrevTrigger, {
-							"aria-label": "Previous page",
+							"aria-label": messages.pagination.previous,
 							children: "‹"
 						}),
 						/* @__PURE__ */ jsx(Pagination.Context, { children: (pagination) => pagination.pages.map((entry, index) => entry.type === "ellipsis" ? /* @__PURE__ */ jsx(Pagination.Ellipsis, {
@@ -51,7 +53,7 @@ function DataView({ items, layout = "list", pageSize, renderItem, header, ...res
 							children: entry.value
 						}, entry.value)) }),
 						/* @__PURE__ */ jsx(Pagination.NextTrigger, {
-							"aria-label": "Next page",
+							"aria-label": messages.pagination.next,
 							children: "›"
 						})
 					]

package/dist/components/dynamic-input/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { Button } from "../button/index.mjs";
 import { t as Input } from "../../input-2oezH-dY.mjs";
 import { injectComponentStyle } from "@bysages/core";
@@ -13,6 +14,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 */
 function DynamicInput({ value, min = 0, max, placeholder, addLabel = "Add entry", disabled = false, invalid = false, size = "md", onValueChange, children: _children, ...rest }) {
 	injectComponentStyle("dynamic-input");
+	const messages = useComponentMessages();
 	const values = value ?? [""];
 	const update = (index, next) => {
 		const rows = values.slice();
@@ -47,7 +49,7 @@ function DynamicInput({ value, min = 0, max, placeholder, addLabel = "Add entry"
 				square: true,
 				size,
 				disabled: disabled || !canRemove,
-				"aria-label": `Remove entry ${index + 1}`,
+				"aria-label": messages.dynamicEntry.remove,
 				onClick: () => remove(index),
 				children: crossIcon()
 			})]

package/dist/components/file-upload/index.d.mts

@@ -6,13 +6,20 @@ type FileUploadRootProps = ComponentProps<typeof FileUpload$1.Root> & {
   size?: "sm" | "md" | "lg";
 };
 declare function FileUploadRoot({ size, ...rest }: FileUploadRootProps): import("react").JSX.Element;
+/** The inner trigger repeats the click binding the dropzone already
+ * owns, and no flavor of taming a nested button survives the audit —
+ * assistive tech can still land on it. So the visual cue is a plain
+ * span wearing the trigger props; the dropzone stays the one real
+ * control, keyboard included. */
+declare function FileUploadTrigger(props: ComponentProps<typeof FileUpload$1.Trigger>): import("react").JSX.Element;
 /** Ark's FileUpload, dressed in the paper-and-ink system: a dashed
  * dropzone that floods with subtle light on drag-over, and accepted files
  * as loose hairline slips. The API is Ark's own — Root, Label, Trigger,
  * Dropzone, HiddenInput, ItemGroup, Item, ItemName, ItemSizeText,
  * ItemPreview, ItemPreviewImage, ItemDeleteTrigger, ClearTrigger,
  * Context. */
-export declare const FileUpload: Omit<typeof FileUpload$1, "Root"> & {
+export declare const FileUpload: Omit<typeof FileUpload$1, "Root" | "Trigger"> & {
   Root: typeof FileUploadRoot;
+  Trigger: typeof FileUploadTrigger;
 };
 //#endregion

package/dist/components/file-upload/index.mjs

@@ -8,6 +8,24 @@ function FileUploadRoot({ size = "md", ...rest }) {
 		"data-size": size
 	});
 }
+/** The inner trigger repeats the click binding the dropzone already
+* owns, and no flavor of taming a nested button survives the audit —
+* assistive tech can still land on it. So the visual cue is a plain
+* span wearing the trigger props; the dropzone stays the one real
+* control, keyboard included. */
+function FileUploadTrigger(props) {
+	const { children, ...rest } = props;
+	return /* @__PURE__ */ jsx(FileUpload$1.Trigger, {
+		asChild: true,
+		...rest,
+		children: /* @__PURE__ */ jsx("span", {
+			"data-scope": "file-upload",
+			"data-part": "trigger",
+			"aria-hidden": "true",
+			children
+		})
+	});
+}
 /** Ark's FileUpload, dressed in the paper-and-ink system: a dashed
 * dropzone that floods with subtle light on drag-over, and accepted files
 * as loose hairline slips. The API is Ark's own — Root, Label, Trigger,
@@ -16,7 +34,8 @@ function FileUploadRoot({ size = "md", ...rest }) {
 * Context. */
 const FileUpload = {
 	...FileUpload$1,
-	Root: FileUploadRoot
+	Root: FileUploadRoot,
+	Trigger: FileUploadTrigger
 };
 injectComponentStyle("file-upload");
 //#endregion

package/dist/components/float-button/index.mjs

@@ -1,3 +1,4 @@
+import { n as useComponentMessages } from "../../messages-1jJWtaYU.mjs";
 import { Button } from "../button/index.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -46,12 +47,13 @@ const STEP_DOWN = {
 };
 function Trigger({ label, children }) {
 	const context = useContext(FLOAT_BUTTON_CONTEXT);
+	const messages = useComponentMessages();
 	return /* @__PURE__ */ jsx(Button, {
 		variant: "solid",
 		square: true,
 		size: context?.size ?? "lg",
 		onClick: () => context?.toggle(),
-		"aria-label": label || "Actions",
+		"aria-label": label || messages.floatButton.actions,
 		"aria-expanded": context ? context.open : false,
 		children
 	});

package/dist/components/image/index.d.mts

@@ -10,8 +10,14 @@ export interface ImageProps extends Omit<HTMLAttributes<HTMLElement>, "onError"
   alt?: string;
   fit?: "cover" | "contain" | "fill" | "none";
   loading?: "lazy" | "eager";
+  /** Intrinsic rendered width, reserved on the image to avoid layout
+   * shift while the source loads. */
+  width?: number | string;
+  /** Intrinsic rendered height, reserved on the image to avoid layout
+   * shift while the source loads. */
+  height?: number | string;
   /** Shown in place of the picture when the source breaks. */
   fallback?: ReactNode;
 }
-export declare function Image({ src, alt, fit, loading, fallback, ...rest }: ImageProps): import("react").JSX.Element;
+export declare function Image({ src, alt, fit, loading, width, height, fallback, ...rest }: ImageProps): import("react").JSX.Element;
 //#endregion

package/dist/components/image/index.mjs

@@ -27,7 +27,7 @@ function placeholderGlyph() {
 		]
 	});
 }
-function Image({ src, alt = "", fit = "cover", loading = "lazy", fallback, ...rest }) {
+function Image({ src, alt = "", fit = "cover", loading = "lazy", width, height, fallback, ...rest }) {
 	injectComponentStyle("image");
 	const [state, setState] = useState("loading");
 	useEffect(() => setState("loading"), [src]);
@@ -44,6 +44,8 @@ function Image({ src, alt = "", fit = "cover", loading = "lazy", fallback, ...re
 			alt,
 			loading,
 			decoding: "async",
+			width,
+			height,
 			onLoad: () => setState("loaded"),
 			onError: () => setState("error")
 		}), state === "error" ? /* @__PURE__ */ jsx("div", {

package/dist/components/image-viewer/index.d.mts

@@ -11,8 +11,14 @@ export interface ImageViewerProps {
   alt?: string;
   open?: boolean;
   zoomable?: boolean;
+  /** Intrinsic rendered width, reserved on the image to avoid layout
+   * shift while the source loads. */
+  width?: number | string;
+  /** Intrinsic rendered height, reserved on the image to avoid layout
+   * shift while the source loads. */
+  height?: number | string;
   /** Reports the viewer's next state. */
   onOpenChange?: (open: boolean) => void;
 }
-export declare function ImageViewer({ src, alt, open, zoomable, onOpenChange }: ImageViewerProps): import("react").JSX.Element;
+export declare function ImageViewer({ src, alt, open, zoomable, width, height, onOpenChange }: ImageViewerProps): import("react").JSX.Element;
 //#endregion