@bysages/svelte 0.2.3 → 0.3.1

package/dist/{table-C0AcH5Dw.mjs → table-BsdqRuvj.mjs}

@@ -1,5 +1,6 @@
+import { n as useComponentMessages, t as formatMessage } from "./messages-DNzA55pH.mjs";
 import { Pagination } from "./components/pagination/index.mjs";
-import { Select as Select$1 } from "./components/select/index.mjs";
+import { n as Select$1 } from "./select-8ume4i2e.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -85,13 +86,13 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"onRowReorder",
 	"onColumnReorder"
 ]);
-var root = $.from_html(`<input type="checkbox" aria-label="Select row"/>`);
+var root = $.from_html(`<input type="checkbox"/>`);
 var root_1 = $.from_html(`<div data-scope="table" data-part="cell-main"><button type="button" data-scope="table" data-part="expander"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m9 6 6 6-6 6"></path></svg></button> <!></div>`);
 var root_2 = $.from_html(`<div><!></div>`);
 var root_3 = $.from_html(`<div role="row" data-scope="table" data-part="row"></div>`);
-var root_4 = $.from_html(`<div data-scope="table" data-part="toolbar"><input type="search" data-scope="table" data-part="global-filter" aria-label="Filter all columns"/></div>`);
-var root_5 = $.from_html(`<div><input type="checkbox" aria-label="Select all rows"/></div>`);
-var root_6 = $.from_html(`<input type="text" data-scope="table" data-part="header-filter" placeholder="Filter"/>`);
+var root_4 = $.from_html(`<div data-scope="table" data-part="toolbar"><input type="search" data-scope="table" data-part="global-filter"/></div>`);
+var root_5 = $.from_html(`<div><input type="checkbox"/></div>`);
+var root_6 = $.from_html(`<input type="text" data-scope="table" data-part="header-filter"/>`);
 var root_7 = $.from_html(`<div><!> <!></div>`);
 var root_8 = $.from_html(`<div data-scope="table" data-part="empty"> </div>`);
 var root_9 = $.from_html(`<div role="rowgroup" data-scope="table" data-part="footer"></div>`);
@@ -129,7 +130,10 @@ function DataTable$1($$anchor, $$props) {
 					var input = root();
 					$.remove_input_defaults(input);
 					input.indeterminate = false;
-					$.template_effect(($0) => $.set_checked(input, $0), [() => row().getIsSelected()]);
+					$.template_effect(($0, $1) => {
+						$.set_checked(input, $0);
+						$.set_attribute(input, "aria-label", $1);
+					}, [() => row().getIsSelected(), () => messages().table.selectRow]);
 					$.delegated("change", input, () => row().toggleSelected(!row().getIsSelected()));
 					$.append($$anchor, input);
 				};
@@ -151,7 +155,7 @@ function DataTable$1($$anchor, $$props) {
 						() => String(row().depth),
 						() => row().getIsExpanded() || void 0,
 						() => !row().getCanExpand() || void 0,
-						() => row().getIsExpanded() ? "Collapse row" : "Expand row"
+						() => row().getIsExpanded() ? messages().table.collapseRow : messages().table.expandRow
 					]);
 					$.delegated("click", button, () => row().toggleExpanded());
 					$.append($$anchor, div_2);
@@ -199,7 +203,9 @@ function DataTable$1($$anchor, $$props) {
 		10,
 		20,
 		50
-	]), stickyFooter = $.prop($$props, "stickyFooter", 3, false), globalFilterPlaceholder = $.prop($$props, "globalFilterPlaceholder", 3, "Filter rows"), emptyText = $.prop($$props, "emptyText", 3, "No rows"), reorderable = $.prop($$props, "reorderable", 3, false), rest = $.rest_props($$props, rest_excludes);
+	]), stickyFooter = $.prop($$props, "stickyFooter", 3, false), reorderable = $.prop($$props, "reorderable", 3, false), rest = $.rest_props($$props, rest_excludes);
+	const messages = useComponentMessages();
+	const globalFilterText = $.derived(() => $$props.globalFilterPlaceholder ?? messages().table.filterAll);
 	const SELECT_COL_ID = "__select";
 	const SELECT_COL_WIDTH = 48;
 	if (virtual() && $$props.merge) console.warn("[DataTable] `virtual` and `merge` are mutually exclusive; merge wins.");
@@ -526,10 +532,11 @@ function DataTable$1($$anchor, $$props) {
 		var input_1 = $.child(div_4);
 		$.remove_input_defaults(input_1);
 		$.reset(div_4);
-		$.template_effect(($0) => {
-			$.set_attribute(input_1, "placeholder", globalFilterPlaceholder());
-			$.set_value(input_1, $0);
-		}, [() => table.atoms.globalFilter.get() ?? ""]);
+		$.template_effect(($0, $1) => {
+			$.set_attribute(input_1, "aria-label", $0);
+			$.set_attribute(input_1, "placeholder", $.get(globalFilterText));
+			$.set_value(input_1, $1);
+		}, [() => messages().table.filterAll, () => table.atoms.globalFilter.get() ?? ""]);
 		$.delegated("input", input_1, (e) => table.setGlobalFilter(e.currentTarget.value));
 		$.append($$anchor, div_4);
 	};
@@ -537,6 +544,7 @@ function DataTable$1($$anchor, $$props) {
 		if (filterable() && showToolbar()) $$render(consequent_3);
 	});
 	var div_5 = $.sibling(node_4, 2);
+	$.set_attribute(div_5, "tabindex", 0);
 	var div_6 = $.child(div_5);
 	let styles_1;
 	var div_7 = $.child(div_6);
@@ -559,10 +567,11 @@ function DataTable$1($$anchor, $$props) {
 				var input_2 = $.child(div_9);
 				$.remove_input_defaults(input_2);
 				$.reset(div_9);
-				$.template_effect(($0) => {
+				$.template_effect(($0, $1) => {
 					$.set_checked(input_2, $.get(all));
 					input_2.indeterminate = $0;
-				}, [() => table.getIsSomeRowsSelected() && !$.get(all)]);
+					$.set_attribute(input_2, "aria-label", $1);
+				}, [() => table.getIsSomeRowsSelected() && !$.get(all), () => messages().table.selectAllRows]);
 				$.delegated("change", input_2, () => table.toggleAllRowsSelected(!$.get(all)));
 				$.append($$anchor, div_9);
 			};
@@ -606,10 +615,15 @@ function DataTable$1($$anchor, $$props) {
 					var input_3 = root_6();
 					$.remove_input_defaults(input_3);
 					$.set_attribute(input_3, "draggable", false);
-					$.template_effect(($0) => {
-						$.set_attribute(input_3, "aria-label", `Filter ${$.get(column).id}`);
-						$.set_value(input_3, $0);
-					}, [() => $.get(column).getFilterValue() ?? ""]);
+					$.template_effect(($0, $1, $2) => {
+						$.set_attribute(input_3, "aria-label", $0);
+						$.set_value(input_3, $1);
+						$.set_attribute(input_3, "placeholder", $2);
+					}, [
+						() => formatMessage(messages().table.filterColumn, { name: $.get(column).id }),
+						() => $.get(column).getFilterValue() ?? "",
+						() => messages().command.filter
+					]);
 					$.delegated("click", input_3, (e) => e.stopPropagation());
 					$.event("dragstart", input_3, (e) => e.stopPropagation());
 					$.delegated("input", input_3, (e) => $.get(column).setFilterValue(e.currentTarget.value));
@@ -658,7 +672,7 @@ function DataTable$1($$anchor, $$props) {
 	var consequent_8 = ($$anchor) => {
 		var div_12 = root_8();
 		var text = $.only_child(div_12, true);
-		$.template_effect(() => $.set_text(text, emptyText()));
+		$.template_effect(($0) => $.set_text(text, $0), [() => $$props.emptyText ?? messages().table.empty]);
 		$.append($$anchor, div_12);
 	};
 	$.if(node_11, ($$render) => {
@@ -673,7 +687,7 @@ function DataTable$1($$anchor, $$props) {
 			$.each(div_14, 21, () => $.get(group).headers, (header) => header.column.id, ($$anchor, header) => {
 				var div_15 = root_2();
 				$.attribute_effect(div_15, ($0, $1) => ({
-					role: "columnheader",
+					role: "cell",
 					"data-scope": "table",
 					"data-part": "footer-cell",
 					"data-numeric": $.get(header).column.columnDef.meta?.numeric ? "" : void 0,
@@ -708,7 +722,7 @@ function DataTable$1($$anchor, $$props) {
 	var consequent_12 = ($$anchor) => {
 		const pagination = $.derived(() => table.atoms.pagination.get());
 		const sizeItems = $.derived(() => createListCollection({ items: pageSizeOptions().map((size) => ({
-			label: `${size} / page`,
+			label: formatMessage(messages().table.perPage, { size }),
 			value: String(size)
 		})) }));
 		var div_16 = root_14();
@@ -736,30 +750,35 @@ function DataTable$1($$anchor, $$props) {
 								children: ($$anchor, $$slotProps) => {
 									var fragment_10 = $.comment();
 									var node_17 = $.first_child(fragment_10);
-									$.component(node_17, () => Select$1.Trigger, ($$anchor, ArkSelect_Trigger) => {
-										ArkSelect_Trigger($$anchor, {
-											"aria-label": "Rows per page",
-											children: ($$anchor, $$slotProps) => {
-												var fragment_11 = root_11();
-												var node_18 = $.first_child(fragment_11);
-												$.component(node_18, () => Select$1.ValueText, ($$anchor, ArkSelect_ValueText) => {
-													ArkSelect_ValueText($$anchor, {});
-												});
-												var node_19 = $.sibling(node_18, 2);
-												$.component(node_19, () => Select$1.Indicator, ($$anchor, ArkSelect_Indicator) => {
-													ArkSelect_Indicator($$anchor, {
-														children: ($$anchor, $$slotProps) => {
-															var svg = root_10();
-															$.append($$anchor, svg);
-														},
-														$$slots: { default: true }
+									{
+										let $0 = $.derived(() => messages().table.rowsPerPage);
+										$.component(node_17, () => Select$1.Trigger, ($$anchor, ArkSelect_Trigger) => {
+											ArkSelect_Trigger($$anchor, {
+												get "aria-label"() {
+													return $.get($0);
+												},
+												children: ($$anchor, $$slotProps) => {
+													var fragment_11 = root_11();
+													var node_18 = $.first_child(fragment_11);
+													$.component(node_18, () => Select$1.ValueText, ($$anchor, ArkSelect_ValueText) => {
+														ArkSelect_ValueText($$anchor, {});
 													});
-												});
-												$.append($$anchor, fragment_11);
-											},
-											$$slots: { default: true }
+													var node_19 = $.sibling(node_18, 2);
+													$.component(node_19, () => Select$1.Indicator, ($$anchor, ArkSelect_Indicator) => {
+														ArkSelect_Indicator($$anchor, {
+															children: ($$anchor, $$slotProps) => {
+																var svg = root_10();
+																$.append($$anchor, svg);
+															},
+															$$slots: { default: true }
+														});
+													});
+													$.append($$anchor, fragment_11);
+												},
+												$$slots: { default: true }
+											});
 										});
-									});
+									}
 									$.append($$anchor, fragment_10);
 								},
 								$$slots: { default: true }
@@ -941,7 +960,7 @@ function DataTable$1($$anchor, $$props) {
 		}
 		$.reset(div_17);
 		$.reset(div_16);
-		$.template_effect(($0) => $.set_text(text_1, $0), [() => `${table.getRowCount()} rows`]);
+		$.template_effect(($0) => $.set_text(text_1, $0), [() => formatMessage(messages().table.rowsCount, { count: table.getRowCount() })]);
 		$.append($$anchor, div_16);
 	};
 	$.if(node_14, ($$render) => {

package/dist/terminal-Dgw5JEz4.mjs

@@ -0,0 +1,80 @@
+import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
+import { injectComponentStyle } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+//#region src/components/terminal/Terminal.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"lines",
+	"prompt",
+	"placeholder",
+	"label",
+	"onCommand"
+]);
+var root = $.from_html(`<div data-scope="terminal" data-part="line"> </div>`);
+var root_1 = $.from_html(`<div><div data-scope="terminal" data-part="scroll"></div> <div data-scope="terminal" data-part="entry"><span data-scope="terminal" data-part="sigil" aria-hidden="true"> </span> <input data-scope="terminal" data-part="input" spellcheck="false" autocomplete="off"/></div></div>`);
+function Terminal$1($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("terminal");
+	let lines = $.prop($$props, "lines", 19, () => []), prompt = $.prop($$props, "prompt", 3, "$"), rest = $.rest_props($$props, rest_excludes);
+	const messages = useComponentMessages();
+	let draft = $.state("");
+	let scroll = $.state(void 0);
+	$.user_effect(() => {
+		lines().length;
+		$.get(scroll)?.scrollTo({ top: $.get(scroll).scrollHeight });
+	});
+	function submit() {
+		const text = $.get(draft).trim();
+		if (!text) return;
+		$.set(draft, "");
+		$$props.onCommand?.(text);
+	}
+	var div = root_1();
+	$.attribute_effect(div, () => ({
+		...rest,
+		role: "log",
+		"aria-label": $$props.label,
+		"data-scope": "terminal",
+		"data-part": "root"
+	}));
+	var div_1 = $.child(div);
+	$.each(div_1, 21, lines, $.index, ($$anchor, line) => {
+		var div_2 = root();
+		var text_1 = $.only_child(div_2, true);
+		$.template_effect(() => $.set_text(text_1, $.get(line)));
+		$.append($$anchor, div_2);
+	});
+	$.reset(div_1);
+	$.bind_this(div_1, ($$value) => $.set(scroll, $$value), () => $.get(scroll));
+	var div_3 = $.sibling(div_1, 2);
+	var span = $.child(div_3);
+	var text_2 = $.only_child(span, true);
+	var input = $.sibling(span, 2);
+	$.remove_input_defaults(input);
+	$.reset(div_3);
+	$.reset(div);
+	$.template_effect(($0) => {
+		$.set_text(text_2, prompt());
+		$.set_attribute(input, "placeholder", $$props.placeholder);
+		$.set_attribute(input, "aria-label", $0);
+	}, [() => messages().terminal.commandLine]);
+	$.delegated("keydown", input, (event) => {
+		if (event.key === "Enter") {
+			event.preventDefault();
+			submit();
+		}
+	});
+	$.bind_value(input, () => $.get(draft), ($$value) => $.set(draft, $$value));
+	$.append($$anchor, div);
+	$.pop();
+}
+$.delegate(["keydown"]);
+//#endregion
+//#region src/components/terminal/index.ts
+/** A quiet console: the transcript above, the prompt line below. */
+const Terminal = Terminal$1;
+//#endregion
+export { Terminal as t };

package/dist/{timeline-BV4eahUx.mjs → timeline-1yPOTbtY.mjs}

@@ -6,18 +6,20 @@ var rest_excludes$3 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
 	"$$legacy",
+	"orientation",
 	"children"
 ]);
 var root$3 = $.from_html(`<ol><!></ol>`);
 function Timeline$1($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("timeline");
-	let rest = $.rest_props($$props, rest_excludes$3);
+	let orientation = $.prop($$props, "orientation", 3, "vertical"), rest = $.rest_props($$props, rest_excludes$3);
 	var ol = root$3();
 	$.attribute_effect(ol, () => ({
 		...rest,
 		"data-scope": "timeline",
-		"data-part": "root"
+		"data-part": "root",
+		"data-orientation": orientation()
 	}));
 	var node = $.child(ol);
 	$.snippet(node, () => $$props.children ?? $.noop);

package/dist/toolbar-SNwuRrJr.mjs

@@ -0,0 +1,68 @@
+import { injectComponentStyle } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+//#region src/components/toolbar/Toolbar.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"label",
+	"start",
+	"end",
+	"children"
+]);
+var root = $.from_html(`<div data-scope="toolbar" data-part="group" data-edge="end"><!></div>`);
+var root_1 = $.from_html(`<div><div data-scope="toolbar" data-part="group" data-edge="start"><!></div> <!></div>`);
+function Toolbar$1($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("toolbar");
+	let rest = $.rest_props($$props, rest_excludes);
+	var div = root_1();
+	$.attribute_effect(div, () => ({
+		...rest,
+		role: "toolbar",
+		"aria-label": $$props.label,
+		"data-scope": "toolbar",
+		"data-part": "root"
+	}));
+	var div_1 = $.child(div);
+	var node = $.child(div_1);
+	var consequent = ($$anchor) => {
+		var fragment = $.comment();
+		var node_1 = $.first_child(fragment);
+		$.snippet(node_1, () => $$props.start);
+		$.append($$anchor, fragment);
+	};
+	var alternate = ($$anchor) => {
+		var fragment_1 = $.comment();
+		var node_2 = $.first_child(fragment_1);
+		$.snippet(node_2, () => $$props.children ?? $.noop);
+		$.append($$anchor, fragment_1);
+	};
+	$.if(node, ($$render) => {
+		if ($$props.start) $$render(consequent);
+		else $$render(alternate, -1);
+	});
+	$.reset(div_1);
+	var node_3 = $.sibling(div_1, 2);
+	var consequent_1 = ($$anchor) => {
+		var div_2 = root();
+		var node_4 = $.child(div_2);
+		$.snippet(node_4, () => $$props.end);
+		$.reset(div_2);
+		$.append($$anchor, div_2);
+	};
+	$.if(node_3, ($$render) => {
+		if ($$props.end) $$render(consequent_1);
+	});
+	$.reset(div);
+	$.append($$anchor, div);
+	$.pop();
+}
+//#endregion
+//#region src/components/toolbar/index.ts
+/** A workbench rail: the start tools at the leading edge, the end
+* tools at the trailing. */
+const Toolbar = Toolbar$1;
+//#endregion
+export { Toolbar as t };

package/dist/{transfer-0IAuhFCe.mjs → transfer-C0FLA8W1.mjs}

@@ -1,4 +1,5 @@
 import { t as Button } from "./button-BCcX7lHq.mjs";
+import { n as useComponentMessages, t as formatMessage } from "./messages-DNzA55pH.mjs";
 import { Input } from "./components/input/index.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
@@ -39,16 +40,19 @@ function Transfer$1($$anchor, $$props) {
 			var node_1 = $.child(div_2);
 			{
 				let $0 = $.derived(() => side() === "source" ? $.get(sourceQuery) : $.get(targetQuery));
-				let $1 = $.derived(() => `Filter ${title()}`);
+				let $1 = $.derived(() => formatMessage(messages().transfer.filter, { name: title() ?? "" }));
+				let $2 = $.derived(() => formatMessage(messages().transfer.filter, { name: title() ?? "" }));
 				Input(node_1, {
 					size: "sm",
 					get value() {
 						return $.get($0);
 					},
-					placeholder: "Filter…",
-					get "aria-label"() {
+					get placeholder() {
 						return $.get($1);
 					},
+					get "aria-label"() {
+						return $.get($2);
+					},
 					oninput: (event) => {
 						const query = event.currentTarget.value;
 						if (side() === "source") $.set(sourceQuery, query, true);
@@ -150,6 +154,7 @@ function Transfer$1($$anchor, $$props) {
 	};
 	injectComponentStyle("transfer");
 	let value = $.prop($$props, "value", 31, () => $.proxy([])), titles = $.prop($$props, "titles", 19, () => ["Source", "Target"]), searchable = $.prop($$props, "searchable", 3, false), disabled = $.prop($$props, "disabled", 3, false), rest = $.rest_props($$props, rest_excludes);
+	const messages = useComponentMessages();
 	let checkedSource = $.proxy(/* @__PURE__ */ new Set());
 	let checkedTarget = $.proxy(/* @__PURE__ */ new Set());
 	let sourceQuery = $.state("");
@@ -183,6 +188,7 @@ function Transfer$1($$anchor, $$props) {
 	var node_10 = $.child(div_5);
 	{
 		let $0 = $.derived(() => checkedSource.size === 0 || disabled());
+		let $1 = $.derived(() => messages().transfer.moveRight);
 		Button(node_10, {
 			variant: "outline",
 			size: "sm",
@@ -190,7 +196,9 @@ function Transfer$1($$anchor, $$props) {
 			get disabled() {
 				return $.get($0);
 			},
-			"aria-label": "Move right",
+			get "aria-label"() {
+				return $.get($1);
+			},
 			onclick: () => move(true),
 			children: ($$anchor, $$slotProps) => {
 				var svg_1 = root_5();
@@ -202,6 +210,7 @@ function Transfer$1($$anchor, $$props) {
 	var node_11 = $.sibling(node_10, 2);
 	{
 		let $0 = $.derived(() => checkedTarget.size === 0 || disabled());
+		let $1 = $.derived(() => messages().transfer.moveLeft);
 		Button(node_11, {
 			variant: "outline",
 			size: "sm",
@@ -209,7 +218,9 @@ function Transfer$1($$anchor, $$props) {
 			get disabled() {
 				return $.get($0);
 			},
-			"aria-label": "Move left",
+			get "aria-label"() {
+				return $.get($1);
+			},
 			onclick: () => move(false),
 			children: ($$anchor, $$slotProps) => {
 				var svg_2 = root_6();