@bysages/svelte 0.4.4 → 0.5.0

package/README.md

@@ -36,9 +36,10 @@ Theme the document, then use the components — the component import
 carries the whole token layer in with it:
 
 ```ts
+import { applyTheme } from "@bysages/svelte";
 // main.ts
 import { mount } from "svelte";
-import { applyTheme } from "@bysages/svelte";
+
 import App from "./App.svelte";
 
 applyTheme({ mode: "system", accent: "ink" });

package/dist/{Accordion-DUUod-V6.mjs → Accordion-uJ1bTltg.mjs}

@@ -1,10 +1,10 @@
-import { t as useElementId } from "./id-Alz497yI.mjs";
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
 import { Accordion } from "@ark-ui/svelte/accordion";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
-//#region src/components/accordion/AccordionRoot.svelte
+// src/components/accordion/AccordionRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -50,8 +50,7 @@ function AccordionRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/accordion/Accordion.svelte
+// src/components/accordion/Accordion.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -143,5 +142,4 @@ function Accordion$1($$anchor, $$props) {
 		$$slots: { default: true }
 	}));
 }
-//#endregion
 export { AccordionRoot as n, Accordion$1 as t };

package/dist/AiLoader-gWAgLlVT.mjs

@@ -0,0 +1,184 @@
+import { n as useComponentMessages } from "./messages-BZoDXYu3.mjs";
+import { createConversationFollower } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+import { injectComponentStyle } from "@bysages/core/styling";
+// src/components/ai/Ai.svelte
+var rest_excludes$4 = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"aria-label",
+	"autoScroll",
+	"children"
+]);
+var root$4 = $.from_html(`<div><!></div>`);
+function Ai($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("ai");
+	let autoScroll = $.prop($$props, "autoScroll", 3, true), rest = $.rest_props($$props, rest_excludes$4);
+	const messages = useComponentMessages();
+	let rootEl = $.state(null);
+	$.user_effect(() => {
+		const node = $.get(rootEl);
+		if (!node || !autoScroll()) return;
+		return createConversationFollower(node);
+	});
+	var div = root$4();
+	$.attribute_effect(div, ($0) => ({
+		...rest,
+		role: "log",
+		"aria-label": $0,
+		"data-scope": "ai",
+		"data-part": "conversation"
+	}), [() => $$props["aria-label"] ?? messages().ai.conversation]);
+	var node_1 = $.child(div);
+	$.snippet(node_1, () => $$props.children ?? $.noop);
+	$.reset(div);
+	$.bind_this(div, ($$value) => $.set(rootEl, $$value), () => $.get(rootEl));
+	$.append($$anchor, div);
+	$.pop();
+}
+// src/components/ai/AiActions.svelte
+var rest_excludes$3 = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"children"
+]);
+var root$3 = $.from_html(`<div><!></div>`);
+function AiActions($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("ai");
+	let rest = $.rest_props($$props, rest_excludes$3);
+	var div = root$3();
+	$.attribute_effect(div, () => ({
+		...rest,
+		"data-scope": "ai",
+		"data-part": "actions"
+	}));
+	var node = $.child(div);
+	$.snippet(node, () => $$props.children ?? $.noop);
+	$.reset(div);
+	$.append($$anchor, div);
+	$.pop();
+}
+// src/components/ai/AiContent.svelte
+var rest_excludes$2 = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"children"
+]);
+var root$2 = $.from_html(`<div><!></div>`);
+function AiContent($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("ai");
+	let rest = $.rest_props($$props, rest_excludes$2);
+	var div = root$2();
+	$.attribute_effect(div, () => ({
+		...rest,
+		"data-scope": "ai",
+		"data-part": "content"
+	}));
+	var node = $.child(div);
+	$.snippet(node, () => $$props.children ?? $.noop);
+	$.reset(div);
+	$.append($$anchor, div);
+	$.pop();
+}
+// src/components/ai/AiJumpToLatest.svelte
+var rest_excludes$1 = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"threshold",
+	"onjump",
+	"children"
+]);
+var root$1 = $.from_html(`<button><!></button>`);
+function AiJumpToLatest($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("ai");
+	let threshold = $.prop($$props, "threshold", 3, 96), rest = $.rest_props($$props, rest_excludes$1);
+	const messages = useComponentMessages();
+	let buttonEl = $.state(null);
+	let visible = $.state(false);
+	$.user_effect(() => {
+		const button = $.get(buttonEl);
+		if (!button) return;
+		const conversation = button.closest("[data-scope=\"ai\"][data-part=\"conversation\"]");
+		const measure = () => {
+			if (!conversation) return;
+			$.set(visible, conversation.scrollHeight - conversation.scrollTop - conversation.clientHeight > threshold());
+		};
+		measure();
+		conversation?.addEventListener("scroll", measure, { passive: true });
+		return () => conversation?.removeEventListener("scroll", measure);
+	});
+	const jump = () => {
+		const conversation = $.get(buttonEl)?.closest("[data-scope=\"ai\"][data-part=\"conversation\"]");
+		if (conversation) conversation.scrollTop = conversation.scrollHeight;
+		$$props.onjump?.();
+	};
+	var button_1 = root$1();
+	$.attribute_effect(button_1, ($0) => ({
+		...rest,
+		type: "button",
+		"data-scope": "ai",
+		"data-part": "jump-to-latest",
+		"data-visible": $.get(visible) ? "" : void 0,
+		tabindex: $.get(visible) ? 0 : -1,
+		"aria-label": $0,
+		onclick: jump
+	}), [() => messages().ai.jumpToLatest]);
+	var node = $.child(button_1);
+	var consequent = ($$anchor) => {
+		var fragment = $.comment();
+		var node_1 = $.first_child(fragment);
+		$.snippet(node_1, () => $$props.children);
+		$.append($$anchor, fragment);
+	};
+	var alternate = ($$anchor) => {
+		var text = $.text();
+		$.template_effect(($0) => $.set_text(text, $0), [() => messages().ai.jumpToLatest]);
+		$.append($$anchor, text);
+	};
+	$.if(node, ($$render) => {
+		if ($$props.children) $$render(consequent);
+		else $$render(alternate, -1);
+	});
+	$.reset(button_1);
+	$.bind_this(button_1, ($$value) => $.set(buttonEl, $$value), () => $.get(buttonEl));
+	$.append($$anchor, button_1);
+	$.pop();
+}
+// src/components/ai/AiLoader.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"aria-label",
+	"children"
+]);
+var root = $.from_html(`<span><!></span>`);
+function AiLoader($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("ai");
+	let rest = $.rest_props($$props, rest_excludes);
+	const messages = useComponentMessages();
+	var span = root();
+	$.attribute_effect(span, ($0) => ({
+		...rest,
+		role: "status",
+		"aria-label": $0,
+		"data-scope": "ai",
+		"data-part": "loader"
+	}), [() => $$props["aria-label"] ?? messages().ai.loading]);
+	var node = $.child(span);
+	$.snippet(node, () => $$props.children ?? $.noop);
+	$.reset(span);
+	$.append($$anchor, span);
+	$.pop();
+}
+export { Ai as a, AiActions as i, AiJumpToLatest as n, AiContent as r, AiLoader as t };

package/dist/{AngleSlider-BDmLIZcL.mjs → AngleSlider-1HJ7tzno.mjs}

@@ -1,9 +1,9 @@
-import { t as useElementId } from "./id-Alz497yI.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { AngleSlider } from "@ark-ui/svelte/angle-slider";
-//#region src/components/angle-slider/AngleSliderRoot.svelte
+// src/components/angle-slider/AngleSliderRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -39,8 +39,7 @@ function AngleSliderRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/angle-slider/AngleSlider.svelte
+// src/components/angle-slider/AngleSlider.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -163,5 +162,4 @@ function AngleSlider$1($$anchor, $$props) {
 	}));
 	$.pop();
 }
-//#endregion
 export { AngleSliderRoot as n, AngleSlider$1 as t };

package/dist/{autocomplete-b65dChlK.mjs → AutoComplete-BY270ouT.mjs}

@@ -1,5 +1,4 @@
-import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
-import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
+import { n as useComponentMessages } from "./messages-BZoDXYu3.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
@@ -7,7 +6,7 @@ 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
+// src/components/autocomplete/AutoComplete.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -19,7 +18,7 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"filter"
 ]);
 var root = $.from_html(`<!> <!>`, 1);
-function AutoComplete$1($$anchor, $$props) {
+function AutoComplete($$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);
@@ -154,11 +153,4 @@ function AutoComplete$1($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/autocomplete/index.ts
-/** 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 = withSelfRoot(AutoComplete$1);
-//#endregion
 export { AutoComplete as t };

package/dist/{AvatarFacade-BNErD2uE.mjs → AvatarFacade-CBILxhOm.mjs}

@@ -1,9 +1,9 @@
-import { t as useElementId } from "./id-Alz497yI.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { Avatar } from "@ark-ui/svelte/avatar";
-//#region src/components/avatar/Avatar.svelte
+// src/components/avatar/Avatar.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -43,8 +43,7 @@ function Avatar$1($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/avatar/AvatarFacade.svelte
+// src/components/avatar/AvatarFacade.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -143,5 +142,4 @@ function AvatarFacade($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
 export { Avatar$1 as n, AvatarFacade as t };

package/dist/{BannerIcon-DpvxwWCc.mjs → BannerIcon-BTkMzpWu.mjs}

@@ -1,9 +1,9 @@
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
-import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
+import { n as useComponentMessages } from "./messages-BZoDXYu3.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
-//#region src/components/banner/Banner.svelte
+// src/components/banner/Banner.svelte
 var rest_excludes$7 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -30,8 +30,7 @@ function Banner($$anchor, $$props) {
 	$.append($$anchor, div);
 	$.pop();
 }
-//#endregion
-//#region src/components/banner/BannerActions.svelte
+// src/components/banner/BannerActions.svelte
 var rest_excludes$6 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -55,8 +54,7 @@ function BannerActions($$anchor, $$props) {
 	$.append($$anchor, div);
 	$.pop();
 }
-//#endregion
-//#region src/components/banner/BannerBody.svelte
+// src/components/banner/BannerBody.svelte
 var rest_excludes$5 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -80,8 +78,7 @@ function BannerBody($$anchor, $$props) {
 	$.append($$anchor, div);
 	$.pop();
 }
-//#endregion
-//#region src/components/banner/BannerClose.svelte
+// src/components/banner/BannerClose.svelte
 var rest_excludes$4 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -109,8 +106,7 @@ function BannerClose($$anchor, $$props) {
 	$.append($$anchor, button);
 	$.pop();
 }
-//#endregion
-//#region src/components/banner/BannerDescription.svelte
+// src/components/banner/BannerDescription.svelte
 var rest_excludes$3 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -134,8 +130,7 @@ function BannerDescription($$anchor, $$props) {
 	$.append($$anchor, p);
 	$.pop();
 }
-//#endregion
-//#region src/components/banner/BannerTitle.svelte
+// src/components/banner/BannerTitle.svelte
 var rest_excludes$2 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -159,8 +154,7 @@ function BannerTitle($$anchor, $$props) {
 	$.append($$anchor, p);
 	$.pop();
 }
-//#endregion
-//#region src/components/banner/BannerFacade.svelte
+// src/components/banner/BannerFacade.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -260,8 +254,7 @@ function BannerFacade($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/banner/BannerIcon.svelte
+// src/components/banner/BannerIcon.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -285,5 +278,4 @@ function BannerIcon($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-//#endregion
 export { BannerClose as a, Banner as c, BannerDescription as i, BannerFacade as n, BannerBody as o, BannerTitle as r, BannerActions as s, BannerIcon as t };

package/dist/{BreadcrumbList-BdLId9vL.mjs → BreadcrumbList-DRHZcJHW.mjs}

@@ -1,8 +1,8 @@
-import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
+import { n as useComponentMessages } from "./messages-BZoDXYu3.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
-//#region src/components/breadcrumb/Breadcrumb.svelte
+// src/components/breadcrumb/Breadcrumb.svelte
 var rest_excludes$6 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -29,8 +29,7 @@ function Breadcrumb($$anchor, $$props) {
 	$.append($$anchor, nav);
 	$.pop();
 }
-//#endregion
-//#region src/components/breadcrumb/BreadcrumbCurrent.svelte
+// src/components/breadcrumb/BreadcrumbCurrent.svelte
 var rest_excludes$5 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -55,8 +54,7 @@ function BreadcrumbCurrent($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-//#endregion
-//#region src/components/breadcrumb/BreadcrumbItem.svelte
+// src/components/breadcrumb/BreadcrumbItem.svelte
 var rest_excludes$4 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -80,8 +78,7 @@ function BreadcrumbItem($$anchor, $$props) {
 	$.append($$anchor, li);
 	$.pop();
 }
-//#endregion
-//#region src/components/breadcrumb/BreadcrumbLink.svelte
+// src/components/breadcrumb/BreadcrumbLink.svelte
 var rest_excludes$3 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -105,8 +102,7 @@ function BreadcrumbLink($$anchor, $$props) {
 	$.append($$anchor, a);
 	$.pop();
 }
-//#endregion
-//#region src/components/breadcrumb/BreadcrumbSeparator.svelte
+// src/components/breadcrumb/BreadcrumbSeparator.svelte
 var rest_excludes$2 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -144,8 +140,7 @@ function BreadcrumbSeparator($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-//#endregion
-//#region src/components/breadcrumb/BreadcrumbFacade.svelte
+// src/components/breadcrumb/BreadcrumbFacade.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -231,8 +226,7 @@ function BreadcrumbFacade($$anchor, $$props) {
 	}
 	$.pop();
 }
-//#endregion
-//#region src/components/breadcrumb/BreadcrumbList.svelte
+// src/components/breadcrumb/BreadcrumbList.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -256,5 +250,4 @@ function BreadcrumbList$1($$anchor, $$props) {
 	$.append($$anchor, ol);
 	$.pop();
 }
-//#endregion
 export { BreadcrumbItem as a, BreadcrumbLink as i, BreadcrumbFacade as n, BreadcrumbCurrent as o, BreadcrumbSeparator as r, Breadcrumb as s, BreadcrumbList$1 as t };

package/dist/{Calendar-MQdoAnJK.mjs → Calendar-BEdhUb-8.mjs}

@@ -1,9 +1,9 @@
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { DatePicker } from "@ark-ui/svelte/date-picker";
-//#region src/components/calendar/Calendar.svelte
+// src/components/calendar/Calendar.svelte
 const title = ($$anchor, dp = $.noop) => {
 	const api = $.derived(() => dp()());
 	const date = $.derived(() => $.get(api).focusedValue);
@@ -585,5 +585,4 @@ function Calendar($$anchor, $$props) {
 	$.pop();
 }
 $.delegate(["click"]);
-//#endregion
 export { Calendar as t };

package/dist/{Carousel-DNMQMvm6.mjs → Carousel-D_NYkQcN.mjs}

@@ -1,10 +1,10 @@
-import { t as useElementId } from "./id-Alz497yI.mjs";
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { Carousel } from "@ark-ui/svelte/carousel";
-//#region src/components/carousel/CarouselRoot.svelte
+// src/components/carousel/CarouselRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -50,8 +50,7 @@ function CarouselRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/carousel/Carousel.svelte
+// src/components/carousel/Carousel.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -167,5 +166,4 @@ function Carousel$1($$anchor, $$props) {
 	}));
 	$.pop();
 }
-//#endregion
 export { CarouselRoot as n, Carousel$1 as t };

package/dist/{Checkbox-z4EXYH9a.mjs → Checkbox-DMjIIQFH.mjs}

@@ -1,10 +1,10 @@
-import { t as useElementId } from "./id-Alz497yI.mjs";
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { Checkbox } from "@ark-ui/svelte/checkbox";
-//#region src/components/checkbox/CheckboxRoot.svelte
+// src/components/checkbox/CheckboxRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -40,8 +40,7 @@ function CheckboxRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/checkbox/Checkbox.svelte
+// src/components/checkbox/Checkbox.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -122,5 +121,4 @@ function Checkbox$1($$anchor, $$props) {
 		$$slots: { default: true }
 	}));
 }
-//#endregion
 export { CheckboxRoot as n, Checkbox$1 as t };

package/dist/{checkbox-group-DESN0Y8Y.mjs → CheckboxGroup-D2rQc9D9.mjs}

@@ -1,11 +1,11 @@
-import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { useFieldContext } from "@ark-ui/svelte/field";
 import { Checkbox } from "@ark-ui/svelte/checkbox";
-//#region src/components/checkbox-group/CheckboxGroup.svelte
+// src/components/checkbox-group/CheckboxGroup.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -18,12 +18,13 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"disabled"
 ]);
 var root = $.from_html(`<!> <!> <!>`, 1);
-function CheckboxGroup$1($$anchor, $$props) {
-	const uid = $.props_id();
+function CheckboxGroup($$anchor, $$props) {
+	const generatedId = $.props_id();
 	$.push($$props, true);
 	injectComponentStyle("checkbox-group");
 	let value = $.prop($$props, "value", 15), layout = $.prop($$props, "layout", 3, "vertical"), size = $.prop($$props, "size", 3, "md"), invalid = $.prop($$props, "invalid", 3, false), disabled = $.prop($$props, "disabled", 3, false), rest = $.rest_props($$props, rest_excludes);
 	const field = useFieldContext();
+	const uid = $.derived(() => useElementId("checkbox-group", generatedId, $$props.id));
 	const isInvalid = $.derived(() => invalid() || field?.()?.invalid === true);
 	const isDisabled = $.derived(() => disabled() || field?.()?.disabled === true);
 	var fragment = $.comment();
@@ -61,8 +62,8 @@ function CheckboxGroup$1($$anchor, $$props) {
 						var node_2 = $.first_child(fragment_2);
 						{
 							let $0 = $.derived(() => ({
-								label: `${uid}:${$.get(option).value}:label`,
-								hiddenInput: `${uid}:${$.get(option).value}:input`
+								label: `${$.get(uid)}:${$.get(option).value}:label`,
+								hiddenInput: `${$.get(uid)}:${$.get(option).value}:input`
 							}));
 							let $1 = $.derived(() => $.get(option).disabled === true);
 							$.component(node_2, () => Checkbox.Root, ($$anchor, ArkCheckbox_Root) => {
@@ -133,11 +134,4 @@ function CheckboxGroup$1($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/checkbox-group/index.ts
-/** One question, many answers: a labelled stack (or row) of the
-* seal-cut checkboxes bound to a single array. */
-const CheckboxGroup = withSelfRoot(CheckboxGroup$1);
-injectComponentStyle("checkbox");
-//#endregion
 export { CheckboxGroup as t };

package/dist/{ChevronIcon-hvMd0d_i.mjs → ChevronIcon-O4SEvOw3.mjs}

@@ -1,10 +1,9 @@
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
 import "svelte/internal/disclose-version";
 import "svelte/internal/client";
 import "svelte/internal/flags/legacy";
-//#region src/components/ai/ChevronIcon.svelte
+// src/components/ai/ChevronIcon.svelte
 function ChevronIcon($$anchor) {
 	InternalIcon($$anchor, { name: "chevron-right" });
 }
-//#endregion
 export { ChevronIcon as t };

package/dist/{Clipboard-Bdui0U6I.mjs → Clipboard-Dbbt5clT.mjs}

@@ -1,10 +1,10 @@
-import { t as useElementId } from "./id-Alz497yI.mjs";
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { Clipboard } from "@ark-ui/svelte/clipboard";
-//#region src/components/clipboard/ClipboardRoot.svelte
+// src/components/clipboard/ClipboardRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -40,8 +40,7 @@ function ClipboardRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/clipboard/Clipboard.svelte
+// src/components/clipboard/Clipboard.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -112,5 +111,4 @@ function Clipboard$1($$anchor, $$props) {
 		$$slots: { default: true }
 	}));
 }
-//#endregion
 export { ClipboardRoot as n, Clipboard$1 as t };