@moduix/react 1.1.0

package/dist/components/heading/Heading.js

@@ -0,0 +1,32 @@
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import Heading_module_default from "./Heading.module.js";
+import { jsx } from "react/jsx-runtime";
+import { ark } from "@ark-ui/react/factory";
+import { clsx } from "clsx";
+import { forwardRef } from "react";
+//#region src/components/heading/Heading.tsx
+const elements = {
+	h1: ark.h1,
+	h2: ark.h2,
+	h3: ark.h3,
+	h4: ark.h4,
+	h5: ark.h5,
+	h6: ark.h6
+};
+const HeadingRoot = forwardRef(function HeadingRoot({ as, asChild, size, weight = "semibold", className, ...props }, ref) {
+	const Element = elements[as ?? "h1"];
+	return /* @__PURE__ */ jsx(Element, {
+		ref,
+		asChild,
+		"data-scope": "heading",
+		"data-part": "root",
+		"data-slot": "heading-root",
+		"data-size": size,
+		"data-weight": weight,
+		className: clsx(Heading_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+const Heading = Object.assign(HeadingRoot, { Root: HeadingRoot });
+//#endregion
+export { Heading };

package/dist/components/heading/Heading.module.js

@@ -0,0 +1,5 @@
+import './Heading.css';
+//#region src/components/heading/Heading.module.css
+var Heading_module_default = { "root": "_8DK-TW_root" };
+//#endregion
+export { Heading_module_default as default };

package/dist/components/highlight/Highlight.css

@@ -0,0 +1,15 @@
+@layer ui.components {
+  .Q3KpHG_root {
+    padding-block: var(--highlight-padding-y, .0625rem);
+    padding-inline: var(--highlight-padding-x, .25rem);
+    border-radius: var(--highlight-radius, var(--radius-xs));
+    background-color: var(--highlight-bg, color-mix(in oklab, var(--color-warning) 40%, var(--color-accent)));
+    color: var(--highlight-color, var(--color-foreground));
+    box-shadow: var(--highlight-shadow, none);
+    font: inherit;
+    font-weight: var(--highlight-font-weight, var(--weight-medium));
+    -webkit-box-decoration-break: clone;
+    box-decoration-break: clone;
+    text-decoration: none;
+  }
+}

package/dist/components/highlight/Highlight.d.ts

@@ -0,0 +1,13 @@
+import { ComponentProps } from "react";
+import { Highlight } from "@ark-ui/react/highlight";
+
+//#region src/components/highlight/Highlight.d.ts
+declare function HighlightRoot({
+  className,
+  ...props
+}: ComponentProps<typeof Highlight>): import("react").JSX.Element;
+declare const Highlight$1: typeof HighlightRoot & {
+  Root: typeof HighlightRoot;
+};
+//#endregion
+export { Highlight$1 as Highlight };

package/dist/components/highlight/Highlight.js

@@ -0,0 +1,18 @@
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import Highlight_module_default from "./Highlight.module.js";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { Highlight } from "@ark-ui/react/highlight";
+//#region src/components/highlight/Highlight.tsx
+function HighlightRoot({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Highlight, {
+		className: clsx(Highlight_module_default.root, normalizeClassName(className)),
+		"data-scope": "highlight",
+		"data-part": "root",
+		"data-slot": "highlight-root",
+		...props
+	});
+}
+const Highlight$1 = Object.assign(HighlightRoot, { Root: HighlightRoot });
+//#endregion
+export { Highlight$1 as Highlight };

package/dist/components/highlight/Highlight.module.js

@@ -0,0 +1,5 @@
+import './Highlight.css';
+//#region src/components/highlight/Highlight.module.css
+var Highlight_module_default = { "root": "Q3KpHG_root" };
+//#endregion
+export { Highlight_module_default as default };

package/dist/components/highlight/index.d.ts

@@ -0,0 +1,2 @@
+import { Highlight } from "./Highlight.js";
+export { Highlight };

package/dist/components/hover-card/HoverCard.css

@@ -0,0 +1,107 @@
+@layer ui.components {
+  .a1hKKW_trigger {
+    --hover-card-trigger-current-color: var(--hover-card-trigger-color, var(--color-primary));
+    align-items: center;
+    gap: var(--hover-card-trigger-gap, .25rem);
+    color: var(--hover-card-trigger-current-color);
+    font: inherit;
+    text-decoration-line: underline;
+    text-decoration-thickness: var(--hover-card-trigger-decoration-thickness, 1px);
+    text-decoration-color: var(--hover-card-trigger-decoration-color, color-mix(in oklab, var(--hover-card-trigger-current-color), transparent 40%));
+    text-underline-offset: var(--hover-card-trigger-underline-offset, 2px);
+    cursor: pointer;
+    transition: color var(--hover-card-transition, var(--duration-fast)),
+      text-decoration-color var(--hover-card-transition, var(--duration-fast));
+    outline: 0;
+    display: inline-flex;
+
+    @media (hover: hover) {
+      &:hover {
+        text-decoration-color: var(--hover-card-trigger-decoration-color-hover, var(--hover-card-trigger-current-color));
+      }
+    }
+
+    &[data-state="open"] {
+      text-decoration-color: var(--hover-card-trigger-decoration-color-open, var(--hover-card-trigger-current-color));
+    }
+
+    &:focus-visible {
+      border-radius: var(--hover-card-trigger-focus-radius, var(--radius-xs));
+      outline: var(--hover-card-focus-ring-width, var(--border-width-sm)) solid
+        var(--hover-card-focus-ring-color, var(--color-ring));
+      outline-offset: var(--hover-card-trigger-focus-offset, 1px);
+      text-decoration-line: none;
+    }
+
+    &:is([data-disabled], [disabled]) {
+      pointer-events: none;
+      opacity: var(--hover-card-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .a1hKKW_positioner {
+    z-index: var(--z-index, var(--z-popup));
+    max-width: var(--available-width);
+    outline: 0;
+  }
+
+  .a1hKKW_content {
+    z-index: calc(var(--z-popup) + var(--layer-index, 0));
+    box-sizing: border-box;
+    width: var(--hover-card-width, auto);
+    height: var(--hover-card-height, auto);
+    min-width: min(var(--hover-card-min-width, 14rem), var(--available-width));
+    max-width: min(var(--hover-card-max-width, 24rem), var(--available-width));
+    max-height: min(var(--hover-card-max-height, 24rem), var(--available-height, 100dvh));
+    padding: var(--hover-card-padding-y, var(--spacing-2))
+      var(--hover-card-padding-x, var(--spacing-2));
+    border-radius: var(--hover-card-radius, var(--radius-lg));
+    background-color: var(--hover-card-bg, var(--color-popover));
+    color: var(--hover-card-color, var(--color-popover-foreground));
+    outline: var(--hover-card-border-width, var(--border-width-sm)) solid
+      var(--hover-card-border-color, var(--color-border));
+    box-shadow: var(--hover-card-shadow, var(--shadow-lg));
+    transform-origin: var(--transform-origin);
+    border: 0;
+    position: relative;
+    overflow: visible;
+
+    &[data-state="open"] {
+      animation: a1hKKW_hover-card-enter var(--hover-card-transition, var(--duration-fast)) both;
+    }
+
+    &[data-state="closed"] {
+      animation: a1hKKW_hover-card-exit var(--hover-card-transition, var(--duration-fast)) both;
+    }
+  }
+
+  .a1hKKW_arrow {
+    --arrow-size: var(--hover-card-arrow-size, .625rem);
+    --arrow-background: var(--hover-card-bg, var(--color-popover));
+  }
+
+  .a1hKKW_arrowTip {
+    border-top: var(--hover-card-border-width, var(--border-width-sm)) solid
+      var(--hover-card-arrow-stroke-color, var(--hover-card-border-color, var(--color-border)));
+    border-left: var(--hover-card-border-width, var(--border-width-sm)) solid
+      var(--hover-card-arrow-stroke-color, var(--hover-card-border-color, var(--color-border)));
+  }
+
+  @keyframes a1hKKW_hover-card-enter {
+    from {
+      opacity: var(--hover-card-content-starting-opacity, 0);
+      translate: var(--hover-card-content-starting-translate-x, 0)
+        var(--hover-card-content-starting-translate-y, 0);
+      scale: var(--hover-card-content-starting-scale, var(--scale-popup));
+    }
+  }
+
+  @keyframes a1hKKW_hover-card-exit {
+    to {
+      opacity: var(--hover-card-content-ending-opacity, 0);
+      translate: var(--hover-card-content-ending-translate-x, 0)
+        var(--hover-card-content-ending-translate-y, 0);
+      scale: var(--hover-card-content-ending-scale, var(--scale-popup));
+    }
+  }
+}

package/dist/components/hover-card/HoverCard.d.ts

@@ -0,0 +1,28 @@
+import { OverlayPortalProps } from "../../lib/moduix/overlayPortal.js";
+import { ComponentProps } from "react";
+import { HoverCard } from "@ark-ui/react/hover-card";
+
+//#region src/components/hover-card/HoverCard.d.ts
+type HoverCardRootProps = ComponentProps<typeof HoverCard.Root> & OverlayPortalProps;
+type HoverCardRootProviderProps = ComponentProps<typeof HoverCard.RootProvider> & OverlayPortalProps;
+declare function HoverCardRoot({
+  portalled,
+  portalRef,
+  ...props
+}: HoverCardRootProps): import("react").JSX.Element;
+declare function HoverCardRootProvider({
+  portalled,
+  portalRef,
+  ...props
+}: HoverCardRootProviderProps): import("react").JSX.Element;
+declare const HoverCard$1: typeof HoverCardRoot & {
+  Root: typeof HoverCardRoot;
+  RootProvider: typeof HoverCardRootProvider;
+  Trigger: import("react").ForwardRefExoticComponent<Omit<HoverCard.TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+  Positioner: import("react").ForwardRefExoticComponent<Omit<HoverCard.PositionerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Content: import("react").ForwardRefExoticComponent<Omit<HoverCard.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Arrow: import("react").ForwardRefExoticComponent<Omit<HoverCard.ArrowProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  ArrowTip: import("react").ForwardRefExoticComponent<Omit<HoverCard.ArrowTipProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+};
+//#endregion
+export { HoverCard$1 as HoverCard };

package/dist/components/hover-card/HoverCard.js

@@ -0,0 +1,81 @@
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { OverlayPortal, OverlayPortalProvider } from "../../lib/moduix/overlayPortal.js";
+import HoverCard_module_default from "./HoverCard.module.js";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { forwardRef } from "react";
+import { HoverCard } from "@ark-ui/react/hover-card";
+//#region src/components/hover-card/HoverCard.tsx
+function HoverCardRoot({ portalled, portalRef, ...props }) {
+	return /* @__PURE__ */ jsx(OverlayPortalProvider, {
+		portalled,
+		portalRef,
+		children: /* @__PURE__ */ jsx(HoverCard.Root, {
+			"data-slot": "hover-card-root",
+			...props
+		})
+	});
+}
+function HoverCardRootProvider({ portalled, portalRef, ...props }) {
+	return /* @__PURE__ */ jsx(OverlayPortalProvider, {
+		portalled,
+		portalRef,
+		children: /* @__PURE__ */ jsx(HoverCard.RootProvider, {
+			"data-slot": "hover-card-root-provider",
+			...props
+		})
+	});
+}
+const HoverCardTrigger = forwardRef(function HoverCardTrigger({ asChild, className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(HoverCard.Trigger, {
+		ref,
+		"data-slot": "hover-card-trigger",
+		asChild,
+		className: clsx(!asChild && HoverCard_module_default.trigger, normalizeClassName(className)),
+		...props
+	});
+});
+const HoverCardPositioner = forwardRef(function HoverCardPositioner({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(OverlayPortal, { children: /* @__PURE__ */ jsx(HoverCard.Positioner, {
+		ref,
+		"data-slot": "hover-card-positioner",
+		className: clsx(HoverCard_module_default.positioner, normalizeClassName(className)),
+		...props
+	}) });
+});
+const HoverCardContent = forwardRef(function HoverCardContent({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(HoverCard.Content, {
+		ref,
+		"data-slot": "hover-card-content",
+		className: clsx(HoverCard_module_default.content, normalizeClassName(className)),
+		...props
+	});
+});
+const HoverCardArrow = forwardRef(function HoverCardArrow({ className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(HoverCard.Arrow, {
+		ref,
+		"data-slot": "hover-card-arrow",
+		className: clsx(HoverCard_module_default.arrow, normalizeClassName(className)),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(HoverCardArrowTip, {})
+	});
+});
+const HoverCardArrowTip = forwardRef(function HoverCardArrowTip({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(HoverCard.ArrowTip, {
+		ref,
+		"data-slot": "hover-card-arrow-tip",
+		className: clsx(HoverCard_module_default.arrowTip, normalizeClassName(className)),
+		...props
+	});
+});
+const HoverCard$1 = Object.assign(HoverCardRoot, {
+	Root: HoverCardRoot,
+	RootProvider: HoverCardRootProvider,
+	Trigger: HoverCardTrigger,
+	Positioner: HoverCardPositioner,
+	Content: HoverCardContent,
+	Arrow: HoverCardArrow,
+	ArrowTip: HoverCardArrowTip
+});
+//#endregion
+export { HoverCard$1 as HoverCard };

package/dist/components/hover-card/HoverCard.module.js

@@ -0,0 +1,13 @@
+import './HoverCard.css';
+//#region src/components/hover-card/HoverCard.module.css
+var HoverCard_module_default = {
+	"arrow": "a1hKKW_arrow",
+	"arrowTip": "a1hKKW_arrowTip",
+	"content": "a1hKKW_content",
+	"hover-card-enter": "a1hKKW_hover-card-enter",
+	"hover-card-exit": "a1hKKW_hover-card-exit",
+	"positioner": "a1hKKW_positioner",
+	"trigger": "a1hKKW_trigger"
+};
+//#endregion
+export { HoverCard_module_default as default };

package/dist/components/hover-card/index.d.ts

@@ -0,0 +1,2 @@
+import { HoverCard } from "./HoverCard.js";
+export { HoverCard };

package/dist/components/image-cropper/ImageCropper.css

@@ -0,0 +1,147 @@
+@layer ui.components {
+  .ZvbaOq_root {
+    box-sizing: border-box;
+    width: var(--image-cropper-width, 32rem);
+    max-width: var(--image-cropper-max-width, 100%);
+    gap: var(--image-cropper-gap, var(--spacing-3));
+    color: var(--image-cropper-color, var(--color-foreground));
+    display: grid;
+
+    &[data-dragging], &[data-panning] {
+      cursor: grabbing;
+    }
+  }
+
+  .ZvbaOq_viewport {
+    box-sizing: border-box;
+    width: 100%;
+    height: var(--image-cropper-viewport-height, var(--image-cropper-viewport-min-height, 20rem));
+    border: var(--image-cropper-border-width, var(--border-width-sm)) solid
+      var(--image-cropper-border-color, var(--color-border));
+    border-radius: var(--image-cropper-radius, var(--radius-lg));
+    background: linear-gradient(45deg,
+          var(--image-cropper-checker-color, color-mix(in oklab, var(--color-muted) 72%, transparent))
+            25%,
+          transparent 25%)
+        0 0 / var(--image-cropper-checker-size, 1rem) var(--image-cropper-checker-size, 1rem),
+      linear-gradient(45deg,
+          transparent 75%,
+          var(--image-cropper-checker-color, color-mix(in oklab, var(--color-muted) 72%, transparent))
+            75%)
+        0 0 / var(--image-cropper-checker-size, 1rem) var(--image-cropper-checker-size, 1rem),
+      linear-gradient(45deg,
+          transparent 75%,
+          var(--image-cropper-checker-color, color-mix(in oklab, var(--color-muted) 72%, transparent))
+            75%)
+        calc(var(--image-cropper-checker-size, 1rem) / -2)
+        calc(var(--image-cropper-checker-size, 1rem) / -2) / var(--image-cropper-checker-size, 1rem)
+        var(--image-cropper-checker-size, 1rem),
+      linear-gradient(45deg,
+          var(--image-cropper-checker-color, color-mix(in oklab, var(--color-muted) 72%, transparent))
+            25%,
+          var(--image-cropper-viewport-bg, var(--color-background)) 25%)
+        calc(var(--image-cropper-checker-size, 1rem) / -2)
+        calc(var(--image-cropper-checker-size, 1rem) / -2) / var(--image-cropper-checker-size, 1rem)
+        var(--image-cropper-checker-size, 1rem);
+    box-shadow: var(--image-cropper-shadow, none);
+    overflow: hidden;
+
+    &[data-disabled] {
+      cursor: default;
+    }
+  }
+
+  .ZvbaOq_image {
+    object-fit: contain;
+    transform-origin: center;
+    backface-visibility: hidden;
+    width: 100%;
+    height: 100%;
+    display: block;
+    position: absolute;
+    inset: 0;
+  }
+
+  .ZvbaOq_selection {
+    box-sizing: content-box;
+    border: var(--image-cropper-selection-border-width, var(--border-width-md)) solid
+      var(--image-cropper-selection-border-color, var(--color-primary));
+    border-radius: var(--image-cropper-selection-radius, var(--radius-md));
+    box-shadow: 0 0 0 9999px var(--image-cropper-selection-overlay-bg, #00000073),
+      inset 0 0 0 var(--image-cropper-selection-inner-border-width, var(--border-width-sm))
+        var(--image-cropper-selection-inner-border-color, #ffffffa3);
+    cursor: grab;
+    transition: border-color var(--image-cropper-transition, var(--transition-default)),
+      box-shadow var(--image-cropper-transition, var(--transition-default));
+    outline: 0;
+
+    &[data-shape="circle"] {
+      border-radius: var(--image-cropper-selection-circle-radius, var(--radius-full));
+    }
+
+    &:focus-visible {
+      box-shadow: 0 0 0 9999px var(--image-cropper-selection-overlay-bg, #00000073),
+        inset 0 0 0 var(--image-cropper-selection-inner-border-width, var(--border-width-sm))
+          var(--image-cropper-selection-inner-border-color, #ffffffa3),
+        0 0 0 var(--image-cropper-focus-ring-width, var(--border-width-md))
+          var(--image-cropper-focus-ring-color, var(--color-ring));
+    }
+
+    &[data-dragging] {
+      cursor: grabbing;
+    }
+
+    &[data-disabled] {
+      cursor: default;
+    }
+  }
+
+  .ZvbaOq_grid {
+    pointer-events: none;
+
+    &[data-axis="horizontal"] {
+      border-block: var(--image-cropper-grid-width, var(--border-width-sm)) solid
+        var(--image-cropper-grid-color, #ffffff9e);
+    }
+
+    &[data-axis="vertical"] {
+      border-inline: var(--image-cropper-grid-width, var(--border-width-sm)) solid
+        var(--image-cropper-grid-color, #ffffff9e);
+    }
+  }
+
+  .ZvbaOq_handle {
+    z-index: 1;
+    box-sizing: border-box;
+    width: var(--image-cropper-handle-size, .75rem);
+    height: var(--image-cropper-handle-size, .75rem);
+    border: var(--image-cropper-handle-border-width, var(--border-width-sm)) solid
+      var(--image-cropper-handle-border-color, #ffffffe0);
+    border-radius: var(--image-cropper-handle-radius, var(--radius-xs));
+    background-color: var(--image-cropper-handle-bg, #fffffff5);
+    box-shadow: var(--image-cropper-handle-shadow, 0 1px 3px #0f172a2e);
+    transition: border-color var(--image-cropper-transition, var(--transition-default)),
+      background-color var(--image-cropper-transition, var(--transition-default)),
+      box-shadow var(--image-cropper-transition, var(--transition-default)),
+      opacity var(--image-cropper-transition, var(--transition-default));
+    position: absolute;
+
+    &[data-position="n"], &[data-position="s"] {
+      height: var(--image-cropper-handle-edge-thickness, .2rem);
+      border-radius: var(--image-cropper-handle-edge-radius, var(--radius-full));
+      border-width: 0;
+      width: 100% !important;
+    }
+
+    &[data-position="e"], &[data-position="w"] {
+      width: var(--image-cropper-handle-edge-thickness, .2rem);
+      border-radius: var(--image-cropper-handle-edge-radius, var(--radius-full));
+      border-width: 0;
+      height: 100% !important;
+    }
+
+    &[data-disabled] {
+      display: none;
+    }
+  }
+}

package/dist/components/image-cropper/ImageCropper.d.ts

@@ -0,0 +1,15 @@
+import { ImageCropper } from "@ark-ui/react/image-cropper";
+
+//#region src/components/image-cropper/ImageCropper.d.ts
+declare const ImageCropper$1: import("react").ForwardRefExoticComponent<Omit<ImageCropper.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+  Root: import("react").ForwardRefExoticComponent<Omit<ImageCropper.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  RootProvider: import("react").ForwardRefExoticComponent<Omit<ImageCropper.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Viewport: import("react").ForwardRefExoticComponent<Omit<ImageCropper.ViewportProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Image: import("react").ForwardRefExoticComponent<Omit<ImageCropper.ImageProps & import("react").RefAttributes<HTMLImageElement>, "ref"> & import("react").RefAttributes<HTMLImageElement>>;
+  Selection: import("react").ForwardRefExoticComponent<Omit<ImageCropper.SelectionProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Grid: import("react").ForwardRefExoticComponent<Omit<ImageCropper.GridProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Handle: import("react").ForwardRefExoticComponent<Omit<ImageCropper.HandleProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  handles: ImageCropper.HandlePosition[];
+};
+//#endregion
+export { ImageCropper$1 as ImageCropper };

package/dist/components/image-cropper/ImageCropper.js

@@ -0,0 +1,75 @@
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import ImageCropper_module_default from "./ImageCropper.module.js";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { forwardRef } from "react";
+import { ImageCropper } from "@ark-ui/react/image-cropper";
+//#region src/components/image-cropper/ImageCropper.tsx
+const ImageCropperRoot = forwardRef(function ImageCropperRoot({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ImageCropper.Root, {
+		ref,
+		"data-slot": "image-cropper-root",
+		className: clsx(ImageCropper_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+const ImageCropperRootProvider = forwardRef(function ImageCropperRootProvider({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ImageCropper.RootProvider, {
+		ref,
+		"data-slot": "image-cropper-root-provider",
+		className: clsx(ImageCropper_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+const ImageCropperViewport = forwardRef(function ImageCropperViewport({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ImageCropper.Viewport, {
+		ref,
+		"data-slot": "image-cropper-viewport",
+		className: clsx(ImageCropper_module_default.viewport, normalizeClassName(className)),
+		...props
+	});
+});
+const ImageCropperImage = forwardRef(function ImageCropperImage({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ImageCropper.Image, {
+		ref,
+		"data-slot": "image-cropper-image",
+		className: clsx(ImageCropper_module_default.image, normalizeClassName(className)),
+		...props
+	});
+});
+const ImageCropperSelection = forwardRef(function ImageCropperSelection({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ImageCropper.Selection, {
+		ref,
+		"data-slot": "image-cropper-selection",
+		className: clsx(ImageCropper_module_default.selection, normalizeClassName(className)),
+		...props
+	});
+});
+const ImageCropperGrid = forwardRef(function ImageCropperGrid({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ImageCropper.Grid, {
+		ref,
+		"data-slot": "image-cropper-grid",
+		className: clsx(ImageCropper_module_default.grid, normalizeClassName(className)),
+		...props
+	});
+});
+const ImageCropperHandle = forwardRef(function ImageCropperHandle({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ImageCropper.Handle, {
+		ref,
+		"data-slot": "image-cropper-handle",
+		className: clsx(ImageCropper_module_default.handle, normalizeClassName(className)),
+		...props
+	});
+});
+const ImageCropper$1 = Object.assign(ImageCropperRoot, {
+	Root: ImageCropperRoot,
+	RootProvider: ImageCropperRootProvider,
+	Viewport: ImageCropperViewport,
+	Image: ImageCropperImage,
+	Selection: ImageCropperSelection,
+	Grid: ImageCropperGrid,
+	Handle: ImageCropperHandle,
+	handles: ImageCropper.handles
+});
+//#endregion
+export { ImageCropper$1 as ImageCropper };

package/dist/components/image-cropper/ImageCropper.module.js

@@ -0,0 +1,12 @@
+import './ImageCropper.css';
+//#region src/components/image-cropper/ImageCropper.module.css
+var ImageCropper_module_default = {
+	"grid": "ZvbaOq_grid",
+	"handle": "ZvbaOq_handle",
+	"image": "ZvbaOq_image",
+	"root": "ZvbaOq_root",
+	"selection": "ZvbaOq_selection",
+	"viewport": "ZvbaOq_viewport"
+};
+//#endregion
+export { ImageCropper_module_default as default };

package/dist/components/image-cropper/index.d.ts

@@ -0,0 +1,2 @@
+import { ImageCropper } from "./ImageCropper.js";
+export { ImageCropper };