@bysages/svelte 0.3.0 → 0.4.0

package/dist/{ai-attachments-Y0Tf6UFL.mjs → ai-attachments-BalNjKhf.mjs}

@@ -1,3 +1,6 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
+import { t as InternalIcon } from "./InternalIcon-Clwbj4MY.mjs";
+import { n as useComponentMessages, t as formatMessage } from "./messages-DNzA55pH.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -9,12 +12,11 @@ var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"name",
 	"size",
 	"status",
-	"onRemove"
+	"onRemove",
+	"aria-label"
 ]);
-var root$1 = $.from_svg(`<svg viewBox="0 0 16 16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="square"><rect x="2.5" y="3.5" width="11" height="9"></rect><path d="M2.5 10.5 6 7l3 3 2-1.5 2.5 2"></path><circle cx="6" cy="6" r="0.75" fill="currentColor" stroke="none"></circle></svg>`);
-var root_1 = $.from_svg(`<svg viewBox="0 0 16 16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="square"><path d="M4 2.5h5l3 3V13.5H4z"></path><path d="M9 2.5v3h3"></path></svg>`);
-var root_2 = $.from_html(`<span> </span>`);
-var root_3 = $.from_html(`<span><!> <span> </span> <!> <button type="button" data-remove=""><svg viewBox="0 0 16 16" width="12" height="12" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="square"><path d="M4 4l8 8M12 4l-8 8"></path></svg></button></span>`);
+var root$1 = $.from_html(`<span> </span>`);
+var root_1 = $.from_html(`<span><!> <span> </span> <!> <button type="button" data-remove=""><!></button></span>`);
 function Attachment$1($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("ai");
@@ -46,7 +48,9 @@ function Attachment$1($$anchor, $$props) {
 		return `${value.toFixed(1)} ${units[unit]}`;
 	};
 	let status = $.prop($$props, "status", 3, "ready"), rest = $.rest_props($$props, rest_excludes$1);
-	var span = root_3();
+	const messages = useComponentMessages();
+	const removeLabel = $.derived(() => $$props["aria-label"] ?? formatMessage(messages().ai.removeAttachment, { name: $$props.name }));
+	var span = root_1();
 	$.attribute_effect(span, () => ({
 		...rest,
 		"data-scope": "ai",
@@ -54,36 +58,35 @@ function Attachment$1($$anchor, $$props) {
 		"data-status": status()
 	}));
 	var node = $.child(span);
-	var consequent = ($$anchor) => {
-		var svg = root$1();
-		$.append($$anchor, svg);
-	};
-	var d = $.derived(() => isImage($$props.name));
-	var alternate = ($$anchor) => {
-		var svg_1 = root_1();
-		$.append($$anchor, svg_1);
-	};
-	$.if(node, ($$render) => {
-		if ($.get(d)) $$render(consequent);
-		else $$render(alternate, -1);
-	});
+	{
+		let $0 = $.derived(() => isImage($$props.name) ? "image" : "file");
+		InternalIcon(node, { get name() {
+			return $.get($0);
+		} });
+	}
 	var span_1 = $.sibling(node, 2);
 	var text = $.only_child(span_1, true);
 	var node_1 = $.sibling(span_1, 2);
-	var consequent_1 = ($$anchor) => {
-		var span_2 = root_2();
+	var consequent = ($$anchor) => {
+		var span_2 = root$1();
 		var text_1 = $.only_child(span_2, true);
 		$.template_effect(($0) => $.set_text(text_1, $0), [() => humanSize($$props.size)]);
 		$.append($$anchor, span_2);
 	};
 	$.if(node_1, ($$render) => {
-		if ($$props.size !== void 0) $$render(consequent_1);
+		if ($$props.size !== void 0) $$render(consequent);
 	});
 	var button = $.sibling(node_1, 2);
+	var node_2 = $.child(button);
+	InternalIcon(node_2, {
+		name: "x",
+		size: "sm"
+	});
+	$.reset(button);
 	$.reset(span);
 	$.template_effect(() => {
 		$.set_text(text, $$props.name);
-		$.set_attribute(button, "aria-label", `Remove ${$$props.name}`);
+		$.set_attribute(button, "aria-label", $.get(removeLabel));
 	});
 	$.delegated("click", button, () => $$props.onRemove?.());
 	$.append($$anchor, span);
@@ -117,7 +120,7 @@ function Attachments$1($$anchor, $$props) {
 }
 //#endregion
 //#region src/components/ai-attachments/index.ts
-const Attachment = Attachment$1;
-const Attachments = Attachments$1;
+const Attachment = withSelfRoot(Attachment$1);
+const Attachments = withSelfRoot(Attachments$1);
 //#endregion
 export { Attachments as n, Attachment as t };

package/dist/{ai-message-DBs1fdFm.mjs → ai-message-aIyT-RXH.mjs}

@@ -1,3 +1,4 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -31,6 +32,6 @@ function AiMessage$1($$anchor, $$props) {
 //#region src/components/ai-message/index.ts
 /** Whose stroke this is — the user's words sit in a recessed bubble,
 * the assistant speaks flat on the paper. */
-const AiMessage = AiMessage$1;
+const AiMessage = withSelfRoot(AiMessage$1);
 //#endregion
 export { AiMessage as t };

package/dist/{ai-prompt-input-BmyKyadu.mjs → ai-prompt-input-jB3RQ9Q8.mjs}

@@ -1,7 +1,10 @@
-import { t as Button } from "./button-BCcX7lHq.mjs";
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
+import { t as InternalIcon } from "./InternalIcon-Clwbj4MY.mjs";
+import { t as Button } from "./button-CghWQD3J.mjs";
 import { Field } from "./components/field/index.mjs";
-import { n as MentionsVessel } from "./mentions-DjhgNRmY.mjs";
+import { n as MentionsVessel } from "./mentions-L0Z29LV8.mjs";
 import { t as useMentions } from "./use-mentions-DeF_38di.mjs";
+import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -25,50 +28,59 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"footerEnd"
 ]);
 var root = $.from_svg(`<svg viewBox="0 0 16 16" width="14" height="14" aria-hidden="true"><rect x="4.5" y="4.5" width="7" height="7" fill="currentColor"></rect></svg>`);
-var root_1 = $.from_svg(`<svg viewBox="0 0 16 16" width="14" height="14" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="square"><path d="M8 13V3M3.5 7.5 8 3l4.5 4.5"></path></svg>`);
-var root_2 = $.from_html(`<div data-scope="ai" data-part="prompt-header"><!></div>`);
-var root_3 = $.from_html(`<div data-scope="ai" data-part="prompt-leading"><!></div>`);
-var root_4 = $.from_html(`<div data-scope="ai" data-part="prompt-trailing"><!> <!></div>`);
-var root_5 = $.from_html(`<div data-scope="ai" data-part="prompt-footer"><!> <div data-scope="ai" data-part="prompt-end"><!> <!></div></div>`);
-var root_6 = $.from_html(`<form><!> <div data-scope="ai" data-part="prompt-main"><!> <!> <!> <!></div> <!></form>`);
+var root_1 = $.from_html(`<div data-scope="ai" data-part="prompt-header"><!></div>`);
+var root_2 = $.from_html(`<div data-scope="ai" data-part="prompt-leading"><!></div>`);
+var root_3 = $.from_html(`<div data-scope="ai" data-part="prompt-trailing"><!> <!></div>`);
+var root_4 = $.from_html(`<div data-scope="ai" data-part="prompt-footer"><!> <div data-scope="ai" data-part="prompt-end"><!> <!></div></div>`);
+var root_5 = $.from_html(`<form><!> <div data-scope="ai" data-part="prompt-main"><!> <!> <!> <!></div> <!></form>`);
 function AiPromptInput$1($$anchor, $$props) {
 	$.push($$props, true);
 	const seal = ($$anchor) => {
 		var fragment = $.comment();
 		var node = $.first_child(fragment);
 		var consequent = ($$anchor) => {
-			Button($$anchor, {
-				variant: "solid",
-				size: "sm",
-				square: true,
-				type: "button",
-				"aria-label": "Stop",
-				get disabled() {
-					return disabled();
-				},
-				onclick: () => $$props.onStop?.(),
-				children: ($$anchor, $$slotProps) => {
-					var svg = root();
-					$.append($$anchor, svg);
-				},
-				$$slots: { default: true }
-			});
+			{
+				let $0 = $.derived(() => messages().ai.stop);
+				Button($$anchor, {
+					variant: "solid",
+					size: "sm",
+					square: true,
+					type: "button",
+					get "aria-label"() {
+						return $.get($0);
+					},
+					get disabled() {
+						return disabled();
+					},
+					onclick: () => $$props.onStop?.(),
+					children: ($$anchor, $$slotProps) => {
+						var svg = root();
+						$.append($$anchor, svg);
+					},
+					$$slots: { default: true }
+				});
+			}
 		};
 		var alternate = ($$anchor) => {
 			{
-				let $0 = $.derived(() => disabled() || !value().trim());
+				let $0 = $.derived(() => messages().ai.send);
+				let $1 = $.derived(() => disabled() || !value().trim());
 				Button($$anchor, {
 					variant: "solid",
 					size: "sm",
 					square: true,
 					type: "submit",
-					"aria-label": "Send",
-					get disabled() {
+					get "aria-label"() {
 						return $.get($0);
 					},
+					get disabled() {
+						return $.get($1);
+					},
 					children: ($$anchor, $$slotProps) => {
-						var svg_1 = root_1();
-						$.append($$anchor, svg_1);
+						InternalIcon($$anchor, {
+							name: "arrow-up",
+							size: "sm"
+						});
 					},
 					$$slots: { default: true }
 				});
@@ -81,8 +93,10 @@ function AiPromptInput$1($$anchor, $$props) {
 		$.append($$anchor, fragment);
 	};
 	injectComponentStyle("ai");
-	let value = $.prop($$props, "value", 15, ""), placeholder = $.prop($$props, "placeholder", 3, "Send a message"), disabled = $.prop($$props, "disabled", 3, false), busy = $.prop($$props, "busy", 3, false), rest = $.rest_props($$props, rest_excludes);
+	let value = $.prop($$props, "value", 15, ""), disabled = $.prop($$props, "disabled", 3, false), busy = $.prop($$props, "busy", 3, false), rest = $.rest_props($$props, rest_excludes);
 	let textareaEl = $.state(null);
+	const messages = useComponentMessages();
+	const placeholderText = $.derived(() => $$props.placeholder ?? messages().ai.send);
 	const mentionState = useMentions(() => ({
 		items: $$props.mentions?.items ?? [],
 		trigger: $$props.mentions?.trigger
@@ -102,7 +116,7 @@ function AiPromptInput$1($$anchor, $$props) {
 		$$props.onValueChange?.("");
 	}
 	const hasFooter = $.derived(() => $$props.footer != null);
-	var form = root_6();
+	var form = root_5();
 	var event_handler = (event) => {
 		event.preventDefault();
 		send();
@@ -115,7 +129,7 @@ function AiPromptInput$1($$anchor, $$props) {
 	}));
 	var node_1 = $.child(form);
 	var consequent_1 = ($$anchor) => {
-		var div = root_2();
+		var div = root_1();
 		var node_2 = $.child(div);
 		$.snippet(node_2, () => $$props.header);
 		$.reset(div);
@@ -127,7 +141,7 @@ function AiPromptInput$1($$anchor, $$props) {
 	var div_1 = $.sibling(node_1, 2);
 	var node_3 = $.child(div_1);
 	var consequent_2 = ($$anchor) => {
-		var div_2 = root_3();
+		var div_2 = root_2();
 		var node_4 = $.child(div_2);
 		$.snippet(node_4, () => $$props.leading);
 		$.reset(div_2);
@@ -140,41 +154,47 @@ function AiPromptInput$1($$anchor, $$props) {
 	$.component(node_5, () => Field.Root, ($$anchor, Field_Root) => {
 		Field_Root($$anchor, {
 			children: ($$anchor, $$slotProps) => {
-				var fragment_3 = $.comment();
-				var node_6 = $.first_child(fragment_3);
-				$.component(node_6, () => Field.Textarea, ($$anchor, Field_Textarea) => {
-					Field_Textarea($$anchor, {
-						autoresize: true,
-						rows: 1,
-						get placeholder() {
-							return placeholder();
-						},
-						get disabled() {
-							return disabled();
-						},
-						oninput: () => mentionState.onInput(),
-						onkeydown: (event) => {
-							if (mentionState.onKeydown(event)) return;
-							if (event.key === "Enter" && !event.shiftKey) {
-								event.preventDefault();
-								send();
+				var fragment_4 = $.comment();
+				var node_6 = $.first_child(fragment_4);
+				{
+					let $0 = $.derived(() => messages().ai.conversation);
+					$.component(node_6, () => Field.Textarea, ($$anchor, Field_Textarea) => {
+						Field_Textarea($$anchor, {
+							autoresize: true,
+							rows: 1,
+							get placeholderText() {
+								return $.get(placeholderText);
+							},
+							get "aria-label"() {
+								return $.get($0);
+							},
+							get disabled() {
+								return disabled();
+							},
+							oninput: () => mentionState.onInput(),
+							onkeydown: (event) => {
+								if (mentionState.onKeydown(event)) return;
+								if (event.key === "Enter" && !event.shiftKey) {
+									event.preventDefault();
+									send();
+								}
+							},
+							get ref() {
+								return $.get(textareaEl);
+							},
+							set ref($$value) {
+								$.set(textareaEl, $$value, true);
+							},
+							get value() {
+								return value();
+							},
+							set value($$value) {
+								value($$value);
 							}
-						},
-						get ref() {
-							return $.get(textareaEl);
-						},
-						set ref($$value) {
-							$.set(textareaEl, $$value, true);
-						},
-						get value() {
-							return value();
-						},
-						set value($$value) {
-							value($$value);
-						}
+						});
 					});
-				});
-				$.append($$anchor, fragment_3);
+				}
+				$.append($$anchor, fragment_4);
 			},
 			$$slots: { default: true }
 		});
@@ -208,13 +228,13 @@ function AiPromptInput$1($$anchor, $$props) {
 	});
 	var node_8 = $.sibling(node_7, 2);
 	var consequent_6 = ($$anchor) => {
-		var div_3 = root_4();
+		var div_3 = root_3();
 		var node_9 = $.child(div_3);
 		var consequent_4 = ($$anchor) => {
-			var fragment_5 = $.comment();
-			var node_10 = $.first_child(fragment_5);
+			var fragment_6 = $.comment();
+			var node_10 = $.first_child(fragment_6);
 			$.snippet(node_10, () => $$props.trailing);
-			$.append($$anchor, fragment_5);
+			$.append($$anchor, fragment_6);
 		};
 		$.if(node_9, ($$render) => {
 			if ($$props.trailing) $$render(consequent_4);
@@ -235,16 +255,16 @@ function AiPromptInput$1($$anchor, $$props) {
 	$.reset(div_1);
 	var node_12 = $.sibling(div_1, 2);
 	var consequent_8 = ($$anchor) => {
-		var div_4 = root_5();
+		var div_4 = root_4();
 		var node_13 = $.child(div_4);
 		$.snippet(node_13, () => $$props.footer);
 		var div_5 = $.sibling(node_13, 2);
 		var node_14 = $.child(div_5);
 		var consequent_7 = ($$anchor) => {
-			var fragment_7 = $.comment();
-			var node_15 = $.first_child(fragment_7);
+			var fragment_8 = $.comment();
+			var node_15 = $.first_child(fragment_8);
 			$.snippet(node_15, () => $$props.footerEnd);
-			$.append($$anchor, fragment_7);
+			$.append($$anchor, fragment_8);
 		};
 		$.if(node_14, ($$render) => {
 			if ($$props.footerEnd) $$render(consequent_7);
@@ -266,6 +286,6 @@ function AiPromptInput$1($$anchor, $$props) {
 //#region src/components/ai-prompt-input/index.ts
 /** The prompt vessel: the shared field textarea — self-growing on the
 * machine's autoresize — over a footer row carrying the submit seal. */
-const AiPromptInput = AiPromptInput$1;
+const AiPromptInput = withSelfRoot(AiPromptInput$1);
 //#endregion
 export { AiPromptInput as t };

package/dist/{ai-reasoning-C4YsB2hQ.mjs → ai-reasoning-CQx7rye9.mjs}

@@ -1,5 +1,6 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
 import { Collapsible } from "./components/collapsible/index.mjs";
-import { t as ChevronIcon } from "./ChevronIcon-CVJJYda-.mjs";
+import { t as ChevronIcon } from "./ChevronIcon-BrLZJ0NH.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -72,6 +73,6 @@ function AiReasoning$1($$anchor, $$props) {
 //#region src/components/ai-reasoning/index.ts
 /** The model's thought, folded by the shared collapsible in its quiet
 * register. */
-const AiReasoning = AiReasoning$1;
+const AiReasoning = withSelfRoot(AiReasoning$1);
 //#endregion
 export { AiReasoning as t };

package/dist/{ai-response-D5IkRFMN.mjs → ai-response-D_eFsV6G.mjs}

@@ -1,13 +1,22 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
+import { t as iconHtml } from "./icon-lWVQxDG6.mjs";
+import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { renderHtml } from "@tanstack/markdown/html";
 //#region src/components/ai-response/code-copy.ts
-/** The two glyphs a copy affordance needs: the stamp and its
-* confirmation. Inline SVG keeps the enhancement framework-agnostic —
-* it lives beside the renderer's generated code HTML. */
-const COPY_CODE_ICON = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>`;
-const COPIED_CODE_ICON = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6 9 17l-5-5"/></svg>`;
+/** The two icons a copy affordance needs: the stamp and its confirmation,
+* drawn from the house icon set. Inline SVG keeps the enhancement
+* framework-agnostic — it lives beside the renderer's generated code HTML. */
+const COPY_CODE_ICON = iconHtml("copy", {
+	width: "14",
+	height: "14"
+});
+const COPIED_CODE_ICON = iconHtml("check", {
+	width: "14",
+	height: "14"
+});
 /** How long the confirmation stays before the stamp returns. */
 const REVERT_MS = 1500;
 /** Make sure every fenced block under `host` carries its copy stamp.
@@ -113,16 +122,19 @@ var root_1 = $.from_html(`<div></div>`);
 function AiResponse$1($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("ai");
-	let copyLabel = $.prop($$props, "copyLabel", 3, "Copy code"), copiedLabel = $.prop($$props, "copiedLabel", 3, "Copied"), rest = $.rest_props($$props, rest_excludes);
+	let rest = $.rest_props($$props, rest_excludes);
+	const messages = useComponentMessages();
 	const html = $.derived(() => renderHtml($$props.content, $$props.highlighter ? { highlighter: $$props.highlighter } : void 0));
+	const copyText = $.derived(() => $$props.copyLabel ?? messages().ai.copyCode);
+	const copiedText = $.derived(() => $$props.copiedLabel ?? messages().ai.copied);
 	let root;
 	$.user_effect(() => {
 		$.get(html);
-		if (root) decorateCodeCopy(root, copyLabel());
+		if (root) decorateCodeCopy(root, $.get(copyText));
 		if (root) wrapResponseTables(root);
 	});
 	const handleClick = (event) => {
-		clickCodeCopy(event, copyLabel(), copiedLabel());
+		clickCodeCopy(event, $.get(copyText), $.get(copiedText));
 		$$props.onclick?.(event);
 	};
 	var div = root_1();
@@ -141,6 +153,6 @@ function AiResponse$1($$anchor, $$props) {
 //#endregion
 //#region src/components/ai-response/index.ts
 /** Markdown set on the paper — streaming-safe by construction. */
-const AiResponse = AiResponse$1;
+const AiResponse = withSelfRoot(AiResponse$1);
 //#endregion
 export { AiResponse as t };

package/dist/{ai-source-CvglcFw1.mjs → ai-source-B9ZfhWOl.mjs}

@@ -1,3 +1,4 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -72,7 +73,7 @@ function AiSources$1($$anchor, $$props) {
 //#region src/components/ai-source/index.ts
 /** One place the ink came from, and the reading list that gathers
 * them under a response. */
-const AiSource = AiSource$1;
-const AiSources = AiSources$1;
+const AiSource = withSelfRoot(AiSource$1);
+const AiSources = withSelfRoot(AiSources$1);
 //#endregion
 export { AiSources as n, AiSource as t };

package/dist/{ai-suggestion-zGAQ1kkf.mjs → ai-suggestion-CrZ5Ol4-.mjs}

@@ -1,4 +1,5 @@
-import { t as Button } from "./button-BCcX7lHq.mjs";
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
+import { t as Button } from "./button-CghWQD3J.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -33,6 +34,6 @@ function AiSuggestion$1($$anchor, $$props) {
 //#region src/components/ai-suggestion/index.ts
 /** A seal-cut button proposing the next stroke; selection hands back
 * the prompt. */
-const AiSuggestion = AiSuggestion$1;
+const AiSuggestion = withSelfRoot(AiSuggestion$1);
 //#endregion
 export { AiSuggestion as t };

package/dist/{ai-tool-DY_iNbMk.mjs → ai-tool-0vdpM2Aq.mjs}

@@ -1,5 +1,6 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
 import { Collapsible } from "./components/collapsible/index.mjs";
-import { t as ChevronIcon } from "./ChevronIcon-CVJJYda-.mjs";
+import { t as ChevronIcon } from "./ChevronIcon-BrLZJ0NH.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -112,6 +113,6 @@ function AiTool$1($$anchor, $$props) {
 /** A tool call: the shared collapsible as the vessel — the name it
 * was reached by and the state it reached in on the trigger, its
 * input and output folded inside. */
-const AiTool = AiTool$1;
+const AiTool = withSelfRoot(AiTool$1);
 //#endregion
 export { AiTool as t };

package/dist/{alert-Xp8I8IY9.mjs → alert-D9oBDEBE.mjs}

@@ -1,3 +1,4 @@
+import { t as InternalIcon } from "./InternalIcon-Clwbj4MY.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -87,18 +88,18 @@ var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$events",
 	"$$legacy"
 ]);
-var root$1 = $.from_html(`<span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path></path></svg></span>`);
+var root$1 = $.from_html(`<span><!></span>`);
 function AlertIcon($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("alert");
 	let rest = $.rest_props($$props, rest_excludes$1);
 	const readStatus = getContext("alert:status");
-	const paths = {
-		info: "M12 8v5m0 3v.01M12 3a9 9 0 1 0 0 18 9 9 0 0 0 0-18Z",
-		success: "m4 12.5 5 5L20 6.5",
-		warning: "M12 4 2.5 20h19L12 4Zm0 6v4m0 3v.01",
-		danger: "M6 6l12 12M18 6 6 18",
-		ink: "M12 8v5m0 3v.01M12 3a9 9 0 1 0 0 18 9 9 0 0 0 0-18Z"
+	const statusIcons = {
+		ink: "info",
+		info: "info",
+		success: "circle-check",
+		warning: "triangle-alert",
+		danger: "circle-x"
 	};
 	var span = root$1();
 	$.attribute_effect(span, () => ({
@@ -106,12 +107,14 @@ function AlertIcon($$anchor, $$props) {
 		"data-scope": "alert",
 		"data-part": "icon"
 	}));
-	var svg = $.child(span);
-	$.set_attribute(svg, "width", 16);
-	$.set_attribute(svg, "height", 16);
-	var path = $.only_child(svg);
+	var node = $.child(span);
+	{
+		let $0 = $.derived(() => statusIcons[readStatus()]);
+		InternalIcon(node, { get name() {
+			return $.get($0);
+		} });
+	}
 	$.reset(span);
-	$.template_effect(($0) => $.set_attribute(path, "d", $0), [() => paths[readStatus()]]);
 	$.append($$anchor, span);
 	$.pop();
 }

package/dist/{aspect-ratio-COOgu44A.mjs → aspect-ratio-Ca2csfG1.mjs}

@@ -1,3 +1,4 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -31,6 +32,6 @@ function AspectRatio$1($$anchor, $$props) {
 //#region src/components/aspect-ratio/index.ts
 /** A frame that keeps its shape: the box holds the given ratio whatever
 * the width it is dealt, and the child fills the frame it is given. */
-const AspectRatio = AspectRatio$1;
+const AspectRatio = withSelfRoot(AspectRatio$1);
 //#endregion
 export { AspectRatio as t };

package/dist/{autocomplete-D7ZZ7Xpb.mjs → autocomplete-CS7ZVq_o.mjs}

@@ -1,7 +1,10 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
+import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { Portal } from "@ark-ui/svelte/portal";
+import { untrack } from "svelte";
 import { Combobox } from "@ark-ui/svelte/combobox";
 import { useListCollection } from "@ark-ui/svelte/collection";
 //#region src/components/autocomplete/AutoComplete.svelte
@@ -20,10 +23,14 @@ function AutoComplete$1($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("combobox");
 	let value = $.prop($$props, "value", 15, ""), items = $.prop($$props, "items", 19, () => []), size = $.prop($$props, "size", 3, "md"), rest = $.rest_props($$props, rest_excludes);
-	const { collection, filter: filterItems } = useListCollection({
-		initialItems: items(),
+	const messages = useComponentMessages();
+	const { collection, filter: filterItems, set } = useListCollection({
+		initialItems: untrack(() => items()),
 		filter: (item, input) => $$props.filter ? $$props.filter(item, input) : item.toLowerCase().includes(input.toLowerCase())
 	});
+	$.user_effect(() => {
+		set(items());
+	});
 	var fragment = $.comment();
 	var node = $.first_child(fragment);
 	$.component(node, () => Combobox.Root, ($$anchor, ArkCombobox_Root) => {
@@ -85,7 +92,8 @@ function AutoComplete$1($$anchor, $$props) {
 													ArkCombobox_Empty($$anchor, {
 														children: ($$anchor, $$slotProps) => {
 															$.next();
-															var text = $.text("No matches");
+															var text = $.text();
+															$.template_effect(($0) => $.set_text(text, $0), [() => messages().command.noMatches]);
 															$.append($$anchor, text);
 														},
 														$$slots: { default: true }
@@ -93,16 +101,16 @@ function AutoComplete$1($$anchor, $$props) {
 												});
 												var node_7 = $.sibling(node_6, 2);
 												$.each(node_7, 16, () => collection().items, (item) => item, ($$anchor, item) => {
-													var fragment_6 = $.comment();
-													var node_8 = $.first_child(fragment_6);
+													var fragment_7 = $.comment();
+													var node_8 = $.first_child(fragment_7);
 													$.component(node_8, () => Combobox.Item, ($$anchor, ArkCombobox_Item) => {
 														ArkCombobox_Item($$anchor, {
 															get item() {
 																return item;
 															},
 															children: ($$anchor, $$slotProps) => {
-																var fragment_7 = $.comment();
-																var node_9 = $.first_child(fragment_7);
+																var fragment_8 = $.comment();
+																var node_9 = $.first_child(fragment_8);
 																$.component(node_9, () => Combobox.ItemText, ($$anchor, ArkCombobox_ItemText) => {
 																	ArkCombobox_ItemText($$anchor, {
 																		children: ($$anchor, $$slotProps) => {
@@ -114,12 +122,12 @@ function AutoComplete$1($$anchor, $$props) {
 																		$$slots: { default: true }
 																	});
 																});
-																$.append($$anchor, fragment_7);
+																$.append($$anchor, fragment_8);
 															},
 															$$slots: { default: true }
 														});
 													});
-													$.append($$anchor, fragment_6);
+													$.append($$anchor, fragment_7);
 												});
 												$.append($$anchor, fragment_5);
 											},
@@ -148,6 +156,6 @@ function AutoComplete$1($$anchor, $$props) {
 /** Free text with suggestions: the reader types anything, the list
 * narrows to help, and both a pick and a custom value end up in the
 * same `value`. A preset of the combobox machinery. */
-const AutoComplete = AutoComplete$1;
+const AutoComplete = withSelfRoot(AutoComplete$1);
 //#endregion
 export { AutoComplete as t };