@bysages/svelte 0.4.3 → 0.5.0

package/dist/{Drawer-DkFAYikg.mjs → Drawer-I1dtgAYo.mjs}

@@ -1,11 +1,11 @@
-import { t as useElementId } from "./id-Alz497yI.mjs";
-import { n as iconHtml } from "./icon-CKL_BxrZ.mjs";
+import { t as useElementId } from "./id-Cu5GNK9U.mjs";
+import { n as iconHtml } from "./icon-CF5OqvV3.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { Portal } from "@ark-ui/svelte/portal";
 import { Drawer } from "@ark-ui/svelte/drawer";
-//#region src/components/drawer/DrawerRoot.svelte
+// src/components/drawer/DrawerRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -44,8 +44,7 @@ function DrawerRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/drawer/Drawer.svelte
+// src/components/drawer/Drawer.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -174,5 +173,4 @@ function Drawer$1($$anchor, $$props) {
 	}));
 	$.pop();
 }
-//#endregion
 export { DrawerRoot as n, Drawer$1 as t };

package/dist/{Editable-lC-REFTP.mjs → Editable-DsphXV9A.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 { Editable } from "@ark-ui/svelte/editable";
-//#region src/components/editable/EditableRoot.svelte
+// src/components/editable/EditableRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -40,8 +40,7 @@ function EditableRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/editable/Editable.svelte
+// src/components/editable/Editable.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -172,5 +171,4 @@ function Editable$1($$anchor, $$props) {
 	}));
 	$.pop();
 }
-//#endregion
 export { EditableRoot as n, Editable$1 as t };

package/dist/{Field-CEUQfFAn.mjs → Field-BDu5Li-Z.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 { Field } from "@ark-ui/svelte/field";
-//#region src/components/field/FieldRoot.svelte
+// src/components/field/FieldRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -42,8 +42,7 @@ function FieldRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/field/Field.svelte
+// src/components/field/Field.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -139,5 +138,4 @@ function Field$1($$anchor, $$props) {
 		$$slots: { default: true }
 	}));
 }
-//#endregion
 export { FieldRoot as n, Field$1 as t };

package/dist/{Fieldset-BWqjtIBF.mjs → Fieldset-DgdSwUWb.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 { Fieldset } from "@ark-ui/svelte/fieldset";
-//#region src/components/fieldset/FieldsetRoot.svelte
+// src/components/fieldset/FieldsetRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -42,8 +42,7 @@ function FieldsetRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/fieldset/Fieldset.svelte
+// src/components/fieldset/Fieldset.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -114,5 +113,4 @@ function Fieldset$1($$anchor, $$props) {
 		$$slots: { default: true }
 	}));
 }
-//#endregion
 export { FieldsetRoot as n, Fieldset$1 as t };

package/dist/{FileUpload-7LgqVD7x.mjs → FileUpload-22CRez-p.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 { FileUpload } from "@ark-ui/svelte/file-upload";
-//#region src/components/file-upload/FileUploadRoot.svelte
+// src/components/file-upload/FileUploadRoot.svelte
 var rest_excludes$2 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -40,8 +40,7 @@ function FileUploadRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/file-upload/FileUploadTrigger.svelte
+// src/components/file-upload/FileUploadTrigger.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -76,8 +75,7 @@ function FileUploadTrigger($$anchor, $$props) {
 	}
 	$.append($$anchor, fragment);
 }
-//#endregion
-//#region src/components/file-upload/FileUpload.svelte
+// src/components/file-upload/FileUpload.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -228,5 +226,4 @@ function FileUpload$1($$anchor, $$props) {
 	}));
 	$.pop();
 }
-//#endregion
 export { FileUploadTrigger as n, FileUploadRoot as r, FileUpload$1 as t };

package/dist/{float-button-DK8hviBz.mjs → FloatButtonFacade-DWEaxhZ-.mjs}

@@ -1,19 +1,19 @@
-import { t as Button } from "./button-Cl45zjdj.mjs";
-import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
+import { t as Button } from "./button-D-u911qp.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";
 import { getContext, setContext } from "svelte";
-//#region src/components/float-button/context.ts
+// src/components/float-button/context.ts
 /** Context key for {@link FloatButtonContext}, exported so a custom
 * part can read the group's state. */
 const FLOAT_BUTTON_KEY = Symbol("bysages-float-button");
 function useFloatButton() {
 	return getContext(FLOAT_BUTTON_KEY) ?? null;
 }
-//#endregion
-//#region src/components/float-button/FloatButton.svelte
-var rest_excludes = /* @__PURE__ */ new Set([
+// src/components/float-button/FloatButton.svelte
+var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
 	"$$legacy",
@@ -22,11 +22,11 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"size",
 	"children"
 ]);
-var root$1 = $.from_html(`<div><!></div>`);
-function FloatButton$1($$anchor, $$props) {
+var root$2 = $.from_html(`<div><!></div>`);
+function FloatButton($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("float-button");
-	let open = $.prop($$props, "open", 15), placement = $.prop($$props, "placement", 3, "bottom-end"), size = $.prop($$props, "size", 3, "lg"), rest = $.rest_props($$props, rest_excludes);
+	let open = $.prop($$props, "open", 15), placement = $.prop($$props, "placement", 3, "bottom-end"), size = $.prop($$props, "size", 3, "lg"), rest = $.rest_props($$props, rest_excludes$1);
 	let localOpen = $.state(false);
 	const isOpen = $.derived(() => open() ?? $.get(localOpen));
 	function setOpen(value) {
@@ -43,7 +43,7 @@ function FloatButton$1($$anchor, $$props) {
 		toggle: () => setOpen(!$.get(isOpen)),
 		close: () => setOpen(false)
 	});
-	var div = root$1();
+	var div = root$2();
 	$.attribute_effect(div, () => ({
 		...rest,
 		"data-scope": "float-button",
@@ -57,9 +57,8 @@ function FloatButton$1($$anchor, $$props) {
 	$.append($$anchor, div);
 	$.pop();
 }
-//#endregion
-//#region src/components/float-button/FloatButtonItem.svelte
-var root = $.from_html(`<div data-scope="float-button" data-part="item"><!> <span data-scope="float-button" data-part="item-label" aria-hidden="true"> </span></div>`);
+// src/components/float-button/FloatButtonItem.svelte
+var root$1 = $.from_html(`<div data-scope="float-button" data-part="item"><!> <span data-scope="float-button" data-part="item-label" aria-hidden="true"> </span></div>`);
 function FloatButtonItem($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("float-button");
@@ -70,7 +69,7 @@ function FloatButtonItem($$anchor, $$props) {
 		md: "sm",
 		sm: "sm"
 	};
-	var div = root();
+	var div = root$1();
 	var node = $.child(div);
 	{
 		let $0 = $.derived(() => context ? STEP_DOWN[context.size] : "md");
@@ -106,8 +105,7 @@ function FloatButtonItem($$anchor, $$props) {
 	$.append($$anchor, div);
 	$.pop();
 }
-//#endregion
-//#region src/components/float-button/FloatButtonTrigger.svelte
+// src/components/float-button/FloatButtonTrigger.svelte
 function FloatButtonTrigger($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("float-button");
@@ -141,14 +139,95 @@ function FloatButtonTrigger($$anchor, $$props) {
 	}
 	$.pop();
 }
-//#endregion
-//#region src/components/float-button/index.ts
-/** A floating action and its fanned-out alternatives — FAB and speed
-* dial in one family. Root, Trigger, Item. */
-const FloatButton = Object.assign(FloatButton$1, {
-	Root: FloatButton$1,
-	Trigger: FloatButtonTrigger,
-	Item: FloatButtonItem
-});
-//#endregion
-export { FLOAT_BUTTON_KEY as n, FloatButton as t };
+// src/components/float-button/FloatButtonFacade.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"label",
+	"actions",
+	"placement",
+	"size",
+	"defaultOpen",
+	"open",
+	"children"
+]);
+var root = $.from_html(`<!> <!>`, 1);
+function FloatButtonFacade($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("float-button");
+	let actions = $.prop($$props, "actions", 19, () => []), placement = $.prop($$props, "placement", 3, "bottom-end"), size = $.prop($$props, "size", 3, "lg"), defaultOpen = $.prop($$props, "defaultOpen", 3, false), open = $.prop($$props, "open", 31, () => $.proxy(defaultOpen())), rest = $.rest_props($$props, rest_excludes);
+	FloatButton($$anchor, $.spread_props({
+		get placement() {
+			return placement();
+		},
+		get size() {
+			return size();
+		}
+	}, () => rest, {
+		get open() {
+			return open();
+		},
+		set open($$value) {
+			open($$value);
+		},
+		children: ($$anchor, $$slotProps) => {
+			var fragment_1 = $.comment();
+			var node = $.first_child(fragment_1);
+			var consequent = ($$anchor) => {
+				var fragment_2 = $.comment();
+				var node_1 = $.first_child(fragment_2);
+				$.snippet(node_1, () => $$props.children);
+				$.append($$anchor, fragment_2);
+			};
+			var alternate = ($$anchor) => {
+				var fragment_3 = root();
+				var node_2 = $.first_child(fragment_3);
+				FloatButtonTrigger(node_2, {
+					get label() {
+						return $$props.label;
+					},
+					children: ($$anchor, $$slotProps) => {
+						InternalIcon($$anchor, { name: "plus" });
+					},
+					$$slots: { default: true }
+				});
+				var node_3 = $.sibling(node_2, 2);
+				$.each(node_3, 17, actions, $.index, ($$anchor, action) => {
+					{
+						let $0 = $.derived(() => $.get(action).disabled ?? false);
+						FloatButtonItem($$anchor, {
+							get label() {
+								return $.get(action).label;
+							},
+							get disabled() {
+								return $.get($0);
+							},
+							get onclick() {
+								return $.get(action).onclick;
+							},
+							children: ($$anchor, $$slotProps) => {
+								{
+									let $0 = $.derived(() => $.get(action).icon ?? "pencil");
+									InternalIcon($$anchor, { get name() {
+										return $.get($0);
+									} });
+								}
+							},
+							$$slots: { default: true }
+						});
+					}
+				});
+				$.append($$anchor, fragment_3);
+			};
+			$.if(node, ($$render) => {
+				if ($$props.children) $$render(consequent);
+				else $$render(alternate, -1);
+			});
+			$.append($$anchor, fragment_1);
+		},
+		$$slots: { default: true }
+	}));
+	$.pop();
+}
+export { FLOAT_BUTTON_KEY as a, FloatButton as i, FloatButtonTrigger as n, FloatButtonItem as r, FloatButtonFacade as t };

package/dist/{FloatingPanel-DJG3Drow.mjs → FloatingPanel-Bzh9Xcpq.mjs}

@@ -1,11 +1,11 @@
-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 { Portal } from "@ark-ui/svelte/portal";
 import { FloatingPanel } from "@ark-ui/svelte/floating-panel";
-//#region src/components/floating-panel/FloatingPanelRoot.svelte
+// src/components/floating-panel/FloatingPanelRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -58,8 +58,7 @@ function FloatingPanelRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/floating-panel/FloatingPanel.svelte
+// src/components/floating-panel/FloatingPanel.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -71,9 +70,10 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"disabled",
 	"children"
 ]);
-var root = $.from_html(`<!> <!> <!>`, 1);
+var root = $.from_html(`<!> <!> <!> <!>`, 1);
 var root_1 = $.from_html(`<!> <!>`, 1);
 var root_2 = $.from_html(`<p> </p>`);
+var root_3 = $.from_html(`<!> <!> <!>`, 1);
 function FloatingPanel$1($$anchor, $$props) {
 	$.push($$props, true);
 	let open = $.prop($$props, "open", 15), disabled = $.prop($$props, "disabled", 3, false), rest = $.rest_props($$props, rest_excludes);
@@ -123,7 +123,7 @@ function FloatingPanel$1($$anchor, $$props) {
 								$.component(node_3, () => FloatingPanel.Content, ($$anchor, ArkFloatingPanel_Content) => {
 									ArkFloatingPanel_Content($$anchor, {
 										children: ($$anchor, $$slotProps) => {
-											var fragment_5 = root();
+											var fragment_5 = root_3();
 											var node_4 = $.first_child(fragment_5);
 											$.component(node_4, () => FloatingPanel.DragTrigger, ($$anchor, ArkFloatingPanel_DragTrigger) => {
 												ArkFloatingPanel_DragTrigger($$anchor, {
@@ -172,7 +172,18 @@ function FloatingPanel$1($$anchor, $$props) {
 																					});
 																				});
 																				var node_10 = $.sibling(node_9, 2);
-																				$.component(node_10, () => FloatingPanel.CloseTrigger, ($$anchor, ArkFloatingPanel_CloseTrigger) => {
+																				$.component(node_10, () => FloatingPanel.StageTrigger, ($$anchor, ArkFloatingPanel_StageTrigger_2) => {
+																					ArkFloatingPanel_StageTrigger_2($$anchor, {
+																						stage: "default",
+																						"aria-label": "Restore",
+																						children: ($$anchor, $$slotProps) => {
+																							InternalIcon($$anchor, { name: "minimize-2" });
+																						},
+																						$$slots: { default: true }
+																					});
+																				});
+																				var node_11 = $.sibling(node_10, 2);
+																				$.component(node_11, () => FloatingPanel.CloseTrigger, ($$anchor, ArkFloatingPanel_CloseTrigger) => {
 																					ArkFloatingPanel_CloseTrigger($$anchor, {
 																						"aria-label": "Close",
 																						children: ($$anchor, $$slotProps) => {
@@ -196,38 +207,38 @@ function FloatingPanel$1($$anchor, $$props) {
 													$$slots: { default: true }
 												});
 											});
-											var node_11 = $.sibling(node_4, 2);
-											$.component(node_11, () => FloatingPanel.Body, ($$anchor, ArkFloatingPanel_Body) => {
+											var node_12 = $.sibling(node_4, 2);
+											$.component(node_12, () => FloatingPanel.Body, ($$anchor, ArkFloatingPanel_Body) => {
 												ArkFloatingPanel_Body($$anchor, {
 													children: ($$anchor, $$slotProps) => {
-														var fragment_13 = root_1();
-														var node_12 = $.first_child(fragment_13);
+														var fragment_14 = root_1();
+														var node_13 = $.first_child(fragment_14);
 														var consequent = ($$anchor) => {
 															var p = root_2();
 															var text_2 = $.only_child(p, true);
 															$.template_effect(() => $.set_text(text_2, $$props.description));
 															$.append($$anchor, p);
 														};
-														$.if(node_12, ($$render) => {
+														$.if(node_13, ($$render) => {
 															if ($$props.description) $$render(consequent);
 														});
-														var node_13 = $.sibling(node_12, 2);
-														$.snippet(node_13, () => $$props.children ?? $.noop);
-														$.append($$anchor, fragment_13);
+														var node_14 = $.sibling(node_13, 2);
+														$.snippet(node_14, () => $$props.children ?? $.noop);
+														$.append($$anchor, fragment_14);
 													},
 													$$slots: { default: true }
 												});
 											});
-											var node_14 = $.sibling(node_11, 2);
-											$.each(node_14, 16, () => resizeAxes, (axis) => axis, ($$anchor, axis) => {
-												var fragment_14 = $.comment();
-												var node_15 = $.first_child(fragment_14);
-												$.component(node_15, () => FloatingPanel.ResizeTrigger, ($$anchor, ArkFloatingPanel_ResizeTrigger) => {
+											var node_15 = $.sibling(node_12, 2);
+											$.each(node_15, 16, () => resizeAxes, (axis) => axis, ($$anchor, axis) => {
+												var fragment_15 = $.comment();
+												var node_16 = $.first_child(fragment_15);
+												$.component(node_16, () => FloatingPanel.ResizeTrigger, ($$anchor, ArkFloatingPanel_ResizeTrigger) => {
 													ArkFloatingPanel_ResizeTrigger($$anchor, { get axis() {
 														return axis;
 													} });
 												});
-												$.append($$anchor, fragment_14);
+												$.append($$anchor, fragment_15);
 											});
 											$.append($$anchor, fragment_5);
 										},
@@ -249,5 +260,4 @@ function FloatingPanel$1($$anchor, $$props) {
 	}));
 	$.pop();
 }
-//#endregion
 export { FloatingPanelRoot as n, FloatingPanel$1 as t };

package/dist/{HoverCard-c3tT648V.mjs → HoverCard-UD0UpoU2.mjs}

@@ -1,10 +1,10 @@
-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 { Portal } from "@ark-ui/svelte/portal";
 import { HoverCard } from "@ark-ui/svelte/hover-card";
-//#region src/components/hover-card/HoverCardRoot.svelte
+// src/components/hover-card/HoverCardRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -43,8 +43,7 @@ function HoverCardRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/hover-card/HoverCard.svelte
+// src/components/hover-card/HoverCard.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -150,5 +149,4 @@ function HoverCard$1($$anchor, $$props) {
 	}));
 	$.pop();
 }
-//#endregion
 export { HoverCardRoot as n, HoverCard$1 as t };

package/dist/{ImageCropper-Dgyj2byr.mjs → ImageCropper-B0_WmsYX.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 { ImageCropper } from "@ark-ui/svelte/image-cropper";
-//#region src/components/image-cropper/ImageCropperRoot.svelte
+// src/components/image-cropper/ImageCropperRoot.svelte
 var rest_excludes$1 = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -63,8 +63,7 @@ function ImageCropperRoot($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
-//#region src/components/image-cropper/ImageCropper.svelte
+// src/components/image-cropper/ImageCropper.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -151,5 +150,4 @@ function ImageCropper$1($$anchor, $$props) {
 		$$slots: { default: true }
 	}));
 }
-//#endregion
 export { ImageCropperRoot as n, ImageCropper$1 as t };

package/dist/{ImageViewer-s41DessS.mjs → ImageViewer-CJZnrFdu.mjs}

@@ -1,14 +1,15 @@
-import { t as InternalIcon } from "./InternalIcon-Dr81WIG1.mjs";
-import { t as Button } from "./button-Cl45zjdj.mjs";
-import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
-import { t as ButtonGroup } from "./button-group-D9mgSVlR.mjs";
+import { t as InternalIcon } from "./InternalIcon-34cw8jr_.mjs";
+import { t as Button } from "./button-D-u911qp.mjs";
+import { n as useComponentMessages } from "./messages-BZoDXYu3.mjs";
+import { t as ButtonGroup } from "./button-group-DTHZTPnA.mjs";
 import { Dialog as Dialog$1 } from "./components/dialog/index.mjs";
+import { createImageViewerGestures } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { Portal } from "@ark-ui/svelte/portal";
 import { Dialog } from "@ark-ui/svelte/dialog";
-//#region src/components/image-viewer/ImagePreview.svelte
+// src/components/image-viewer/ImagePreview.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -73,8 +74,7 @@ function ImagePreview($$anchor, $$props) {
 	$.append($$anchor, span);
 	$.pop();
 }
-//#endregion
-//#region src/components/image-viewer/ImageViewer.svelte
+// src/components/image-viewer/ImageViewer.svelte
 const tool = ($$anchor, label = $.noop, onclick = $.noop, icon = $.noop) => {
 	Button($$anchor, {
 		variant: "ghost",
@@ -100,28 +100,25 @@ var root_2 = $.from_html(`<img data-scope="image-viewer" data-part="viewport"/>
 function ImageViewer($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("image-viewer");
-	const MIN_SCALE = .5;
-	const MAX_SCALE = 3;
 	const SCALE_STEP = .25;
 	let alt = $.prop($$props, "alt", 3, ""), open = $.prop($$props, "open", 15, false), zoomable = $.prop($$props, "zoomable", 3, true);
 	const messages = useComponentMessages();
-	let scale = $.state(1);
-	let rotation = $.state(0);
+	let viewport = $.state(null);
+	let gestures = null;
 	function setOpen(value) {
 		open(value);
 		$$props.onOpenChange?.(value);
 	}
 	$.user_effect(() => {
-		if (open()) {
-			$.set(scale, 1);
-			$.set(rotation, 0);
-		}
+		gestures?.stop();
+		gestures = null;
+		if ($.get(viewport)) gestures = createImageViewerGestures($.get(viewport), { zoomable: zoomable() });
 	});
 	function zoom(step) {
-		$.set(scale, Math.min(MAX_SCALE, Math.max(MIN_SCALE, $.get(scale) + step)), true);
+		gestures?.zoomBy(step);
 	}
 	function turn() {
-		$.set(rotation, ($.get(rotation) + 90) % 360);
+		gestures?.rotate();
 	}
 	var fragment_2 = $.comment();
 	var node = $.first_child(fragment_2);
@@ -199,7 +196,7 @@ function ImageViewer($$anchor, $$props) {
 												children: ($$anchor, $$slotProps) => {
 													var fragment_9 = root_2();
 													var img = $.first_child(fragment_9);
-													let styles;
+													$.bind_this(img, ($$value) => $.set(viewport, $$value), () => $.get(viewport));
 													var div = $.sibling(img, 2);
 													var node_8 = $.child(div);
 													ButtonGroup(node_8, {
@@ -265,7 +262,6 @@ function ImageViewer($$anchor, $$props) {
 														$.set_attribute(img, "alt", alt());
 														$.set_attribute(img, "width", $$props.width);
 														$.set_attribute(img, "height", $$props.height);
-														styles = $.set_style(img, "", styles, { "--bs-image-viewer-transform": `scale(${$.get(scale)}) rotate(${$.get(rotation)}deg)` });
 													});
 													$.append($$anchor, fragment_9);
 												},
@@ -290,5 +286,4 @@ function ImageViewer($$anchor, $$props) {
 	$.append($$anchor, fragment_2);
 	$.pop();
 }
-//#endregion
 export { ImagePreview as n, ImageViewer as t };

package/dist/{Input-DLfLshYU.mjs → Input-DTXzYJnH.mjs}

@@ -2,7 +2,7 @@ import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { injectComponentStyle } from "@bysages/core/styling";
 import { useFieldContext } from "@ark-ui/svelte/field";
-//#region src/components/input/mask.ts
+// src/components/input/mask.ts
 function accepts(slot, ch) {
 	if (slot === "9") return /\d/.test(ch);
 	if (slot === "a") return /[a-zA-Z]/.test(ch);
@@ -36,8 +36,7 @@ function applyMask(raw, mask) {
 	}
 	return out;
 }
-//#endregion
-//#region src/components/input/Input.svelte
+// src/components/input/Input.svelte
 var rest_excludes = /* @__PURE__ */ new Set([
 	"$$slots",
 	"$$events",
@@ -71,5 +70,4 @@ function Input($$anchor, $$props) {
 	$.append($$anchor, input);
 	$.pop();
 }
-//#endregion
 export { Input as t };

package/dist/{InternalIcon-Dr81WIG1.mjs → InternalIcon-34cw8jr_.mjs}

@@ -1,7 +1,7 @@
-import { n as iconHtml } from "./icon-CKL_BxrZ.mjs";
+import { n as iconHtml } from "./icon-CF5OqvV3.mjs";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
-//#region src/internal/InternalIcon.svelte
+// src/internal/InternalIcon.svelte
 function InternalIcon($$anchor, $$props) {
 	$.push($$props, true);
 	let size = $.prop($$props, "size", 3, "md");
@@ -15,5 +15,4 @@ function InternalIcon($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-//#endregion
 export { InternalIcon as t };