@plitzi/plitzi-ui 1.6.2

package/dist/components/ContainerFloating/ContainerFloating.js

@@ -0,0 +1,72 @@
+import e from "./ContainerFloatingContext.js";
+import t from "./ContainerFloatingContainer.js";
+import n from "./ContainerFloatingContent.js";
+import r from "./ContainerFloatingTrigger.js";
+import i from "./hooks/useFloating.js";
+import { Children as a, cloneElement as o, isValidElement as s, useCallback as c, useMemo as l, useRef as u } from "react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+//#region src/components/ContainerFloating/ContainerFloating.tsx
+var m = ({ ref: m, children: h, containerTopOffset: g = 0, containerLeftOffset: _ = 0, open: v, disabled: y = !1, loading: b = !1, closeOnClick: x = !0, testId: S, placement: C, container: w, onOpenChange: T }) => {
+	let E = u(null), [D, O, k, A] = i({
+		ref: m,
+		open: v,
+		loading: b,
+		disabled: y
+	}), j = c((e) => (t) => {
+		e?.(t), !t.isPropagationStopped() && x && (t.stopPropagation(), t.preventDefault(), O(!1));
+	}, [x, O]), { trigger: M, content: N } = l(() => {
+		let e = {};
+		return a.forEach(h, (t) => {
+			if (s(t)) {
+				if (t.type === r) {
+					let n = t.props;
+					e.trigger = o(t, {
+						testId: S ? `${S}-trigger` : void 0,
+						onClick: k,
+						...n,
+						ref: A
+					});
+				} else if (t.type === n) {
+					let n = t.props;
+					e.content = o(t, {
+						testId: S ? `${S}-content` : void 0,
+						...n,
+						onClick: j(n.onClick)
+					});
+				}
+			}
+		}), e;
+	}, [
+		h,
+		k,
+		j,
+		S,
+		A
+	]);
+	return /* @__PURE__ */ p(d, { children: [M, /* @__PURE__ */ f(e, {
+		value: l(() => ({
+			placement: C,
+			triggerRef: A,
+			container: w,
+			containerTopOffset: g,
+			containerLeftOffset: _,
+			setOpen: O
+		}), [
+			C,
+			A,
+			w,
+			g,
+			_,
+			O
+		]),
+		children: /* @__PURE__ */ f(t, {
+			ref: E,
+			open: D,
+			onOpenChange: T,
+			children: N
+		})
+	})] });
+};
+m.Trigger = r, m.Content = n;
+//#endregion
+export { m as default };

package/dist/components/ContainerFloating/ContainerFloating.styles.d.ts

@@ -0,0 +1,18 @@
+export declare const variantKeys: {
+    readonly intent: readonly ["dropdown", "custom"];
+    readonly disabled: readonly [true, false];
+    readonly placement: readonly ["top-left", "top-right", "bottom-left", "bottom-right"];
+};
+export declare const STYLES_COMPONENT_NAME = "ContainerFloating";
+declare const _default: {
+    root: (props?: ({} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+    trigger: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+    content: (props?: ({
+        intent?: "custom" | "dropdown" | null | undefined;
+        disabled?: boolean | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+    container: (props?: ({
+        placement?: "top-left" | "top-right" | "bottom-left" | "bottom-right" | null | undefined;
+    } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+};
+export default _default;

package/dist/components/ContainerFloating/ContainerFloating.styles.js

@@ -0,0 +1,38 @@
+import e from "../../helpers/cvaWrapper.js";
+var t = {
+	root: e("", {
+		variants: {},
+		compoundVariants: [],
+		defaultVariants: {}
+	}),
+	trigger: e("cursor-pointer"),
+	content: e("flex w-full h-full", {
+		variants: {
+			intent: {
+				dropdown: "bg-white dark:bg-zinc-800 border border-gray-200 dark:border-zinc-700 shadow-lg shadow-black/10 dark:shadow-black/30 rounded-lg",
+				custom: ""
+			},
+			disabled: {
+				true: "cursor-not-allowed pointer-events-none opacity-60",
+				false: ""
+			}
+		},
+		compoundVariants: [],
+		defaultVariants: {
+			intent: "dropdown",
+			disabled: !1
+		}
+	}),
+	container: e("fixed z-801", {
+		variants: { placement: {
+			"top-left": "-translate-y-full",
+			"top-right": "-translate-y-full",
+			"bottom-left": "",
+			"bottom-right": ""
+		} },
+		compoundVariants: [],
+		defaultVariants: { placement: "bottom-left" }
+	})
+};
+//#endregion
+export { t as default };

package/dist/components/ContainerFloating/ContainerFloatingContainer.d.ts

@@ -0,0 +1,11 @@
+import { default as ContainerFloatingStyles, variantKeys } from './ContainerFloating.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { ReactNode, RefObject } from 'react';
+type ContainerFloatingContainerProps = {
+    ref?: RefObject<HTMLDivElement | null>;
+    children: ReactNode;
+    open: boolean;
+    onOpenChange?: (open: boolean) => void;
+} & useThemeSharedProps<typeof ContainerFloatingStyles, Omit<typeof variantKeys, 'placement'>>;
+declare const ContainerFloatingContainer: ({ ref, className, children, open, onOpenChange }: ContainerFloatingContainerProps) => import('react').ReactPortal;
+export default ContainerFloatingContainer;

package/dist/components/ContainerFloating/ContainerFloatingContainer.js

@@ -0,0 +1,74 @@
+import e from "../../hooks/useTheme/index.js";
+import t from "../../hooks/useDidUpdateEffect/index.js";
+import n from "./ContainerFloatingContext.js";
+import { use as r, useCallback as i, useEffect as a, useImperativeHandle as o, useMemo as s, useRef as c, useState as l } from "react";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { createPortal as p } from "react-dom";
+//#region src/components/ContainerFloating/ContainerFloatingContainer.tsx
+var m = ({ ref: m, className: h, children: g, open: _, onOpenChange: v }) => {
+	let { container: y, triggerRef: b, placement: x, containerTopOffset: S, containerLeftOffset: C, setOpen: w } = r(n), [T, E] = l(x);
+	h = e("ContainerFloating", {
+		className: h,
+		componentKey: "container",
+		variants: { placement: T }
+	});
+	let D = c(null);
+	o(m, () => D.current, []);
+	let [O, k] = l(void 0), A = i(() => {
+		if (!b || !b.current) return;
+		let e = b.current.getBoundingClientRect(), t = D.current?.getBoundingClientRect() ?? {
+			top: 0,
+			left: 0,
+			height: 0,
+			width: 0
+		}, n = x;
+		if (!x) {
+			let r = ["bottom", "left"];
+			r[0] = e.top + t.height > window.innerHeight ? "top" : "bottom", r[1] = e.left + t.width > window.innerWidth ? "right" : "left", n = r.join("-");
+		}
+		E(n);
+		let r = C ?? 0, i = S ?? 0, a = 0, o = 0;
+		n === "top-left" ? (a = e.top - i, o = e.left + r) : n === "top-right" ? (a = e.top - i, o = e.left - t.width + e.width - r) : n === "bottom-left" ? (a = e.bottom + i, o = e.left + r) : (a = e.bottom + i, o = e.left - t.width + e.width - r), k({
+			top: a,
+			left: o
+		});
+	}, [
+		b,
+		x,
+		C,
+		S
+	]), j = i(() => _ && A(), [_, A]);
+	a(() => {
+		if (_) return document.addEventListener("scroll", j, !0), window.addEventListener("resize", j), () => {
+			document.removeEventListener("scroll", j, !0), window.removeEventListener("resize", j);
+		};
+	}, [_, j]), a(() => {
+		_ && A();
+	}, []), t(() => {
+		_ ? A() : k(void 0), v?.(_);
+	}, [
+		_,
+		A,
+		v
+	]);
+	let M = i((e) => {
+		e.stopPropagation(), e.preventDefault(), w(!1);
+	}, [w]), N = s(() => ({
+		...O,
+		...O ? { visibility: "visible" } : {
+			visibility: "hidden",
+			pointerEvent: "none"
+		}
+	}), [O]);
+	return p(/* @__PURE__ */ f(u, { children: [_ && /* @__PURE__ */ d("div", {
+		className: "absolute top-0 bottom-0 left-0 right-0",
+		onClick: M
+	}), _ && /* @__PURE__ */ d("div", {
+		ref: D,
+		style: N,
+		className: h,
+		children: g
+	})] }), y ?? document.body);
+};
+//#endregion
+export { m as default };

package/dist/components/ContainerFloating/ContainerFloatingContent.d.ts

@@ -0,0 +1,11 @@
+import { default as ContainerFloatingStyles, variantKeys } from './ContainerFloating.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { HTMLAttributes, ReactNode, RefObject } from 'react';
+export type ContainerFloatingContentProps = {
+    ref?: RefObject<HTMLDivElement>;
+    children?: ReactNode;
+    className?: string;
+    testId?: string;
+} & HTMLAttributes<HTMLDivElement> & useThemeSharedProps<typeof ContainerFloatingStyles, typeof variantKeys>;
+declare const ContainerFloatingContent: ({ ref, children, className, placement, testId, ...props }: ContainerFloatingContentProps) => import("react/jsx-runtime").JSX.Element;
+export default ContainerFloatingContent;

package/dist/components/ContainerFloating/ContainerFloatingContent.js

@@ -0,0 +1,16 @@
+import e from "../../hooks/useTheme/index.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/ContainerFloating/ContainerFloatingContent.tsx
+var n = ({ ref: n, children: r, className: i, placement: a, testId: o, ...s }) => (i = e("ContainerFloating", {
+	className: i,
+	componentKey: "content",
+	variants: { placement: a }
+}), /* @__PURE__ */ t("div", {
+	...s,
+	ref: n,
+	className: i,
+	"data-testid": o,
+	children: r
+}));
+//#endregion
+export { n as default };

package/dist/components/ContainerFloating/ContainerFloatingContext.d.ts

@@ -0,0 +1,12 @@
+import { ContainerFloatingProps } from './ContainerFloating';
+import { Dispatch, RefObject } from 'react';
+export type ContainerFloatingContextValue = {
+    triggerRef?: RefObject<HTMLDivElement | null>;
+    container?: Element | DocumentFragment;
+    placement?: ContainerFloatingProps['placement'];
+    containerTopOffset?: number;
+    containerLeftOffset?: number;
+    setOpen: Dispatch<React.SetStateAction<boolean>>;
+};
+declare const ContainerFloatingContext: import('react').Context<ContainerFloatingContextValue>;
+export default ContainerFloatingContext;

package/dist/components/ContainerFloating/ContainerFloatingContext.js

@@ -0,0 +1,5 @@
+import { createContext as e } from "react";
+var t = e({});
+t.displayName = "ContainerFloatingContext";
+//#endregion
+export { t as default };

package/dist/components/ContainerFloating/ContainerFloatingTrigger.d.ts

@@ -0,0 +1,11 @@
+import { default as ContainerFloatingStyles, variantKeys } from './ContainerFloating.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { MouseEvent, ReactNode, RefObject } from 'react';
+export type ContainerFloatingTriggerProps = {
+    children?: ReactNode;
+    ref?: RefObject<HTMLDivElement | null>;
+    testId?: string;
+    onClick?: (e: MouseEvent<HTMLDivElement>) => void;
+} & useThemeSharedProps<typeof ContainerFloatingStyles, typeof variantKeys>;
+declare const ContainerFloatingTrigger: ({ children, className, testId, ref, onClick }: ContainerFloatingTriggerProps) => import("react/jsx-runtime").JSX.Element;
+export default ContainerFloatingTrigger;

package/dist/components/ContainerFloating/ContainerFloatingTrigger.js

@@ -0,0 +1,15 @@
+import e from "../../hooks/useTheme/index.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/ContainerFloating/ContainerFloatingTrigger.tsx
+var n = ({ children: n, className: r, testId: i, ref: a, onClick: o }) => (r = e("ContainerFloating", {
+	className: r,
+	componentKey: "trigger"
+}), /* @__PURE__ */ t("div", {
+	ref: a,
+	className: r,
+	onClick: o,
+	"data-testid": i,
+	children: n
+}));
+//#endregion
+export { n as default };

package/dist/components/ContainerFloating/hooks/index.d.ts

@@ -0,0 +1,3 @@
+import { default as useFloating } from './useFloating';
+export * from './useFloating';
+export { useFloating };

package/dist/components/ContainerFloating/hooks/index.js

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

package/dist/components/ContainerFloating/hooks/useFloating.d.ts

@@ -0,0 +1,17 @@
+import { Dispatch, RefObject, SetStateAction } from 'react';
+export type UseFloatingProps = {
+    ref?: RefObject<HTMLDivElement | null>;
+    open?: boolean;
+    disabled?: boolean;
+    loading?: boolean;
+    onCloseValidate?: (e: Event) => boolean;
+};
+export type UseFloatingReturn = [
+    boolean,
+    Dispatch<SetStateAction<boolean>>,
+    (e: React.MouseEvent) => void,
+    RefObject<HTMLDivElement | null>,
+    DOMRect | undefined
+];
+declare const useFloating: ({ ref, open: openProp, disabled, loading }: UseFloatingProps) => UseFloatingReturn;
+export default useFloating;

package/dist/components/ContainerFloating/hooks/useFloating.js

@@ -0,0 +1,25 @@
+import e from "../../../hooks/useDidUpdateEffect/index.js";
+import { useCallback as t, useImperativeHandle as n, useMemo as r, useRef as i, useState as a } from "react";
+//#region src/components/ContainerFloating/hooks/useFloating.ts
+var o = ({ ref: o, open: s, disabled: c = !1, loading: l = !1 }) => {
+	let [u, d] = a(s ?? !1), f = i(null);
+	n(o, () => f.current, []);
+	let p = t((e) => {
+		c || l || s !== void 0 || (e.stopPropagation(), e.preventDefault(), d((e) => !e));
+	}, [
+		c,
+		l,
+		s
+	]);
+	return e(() => {
+		d(s ?? !1);
+	}, [s]), [
+		u,
+		d,
+		p,
+		f,
+		r(() => f.current?.getBoundingClientRect(), [f.current, u])
+	];
+};
+//#endregion
+export { o as default };

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

@@ -0,0 +1,7 @@
+import { default as ContainerFloating } from './ContainerFloating';
+import { default as containerFloatingTheme } from './ContainerFloating.styles';
+import { useFloating } from './hooks';
+export * from './ContainerFloating';
+export * from './hooks';
+export { useFloating, containerFloatingTheme };
+export default ContainerFloating;

package/dist/components/ContainerFloating/index.js

@@ -0,0 +1,7 @@
+import e from "./hooks/useFloating.js";
+import t from "./ContainerFloating.js";
+import n from "./ContainerFloating.styles.js";
+//#region src/components/ContainerFloating/index.ts
+var r = t;
+//#endregion
+export { n as containerFloatingTheme, r as default, e as useFloating };

package/dist/components/ContainerFrame/ContainerFrame.d.ts

@@ -0,0 +1,25 @@
+import { default as ContainerFrameStyles, variantKeys } from './ContainerFrame.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { CSSProperties, ReactNode, RefObject } from 'react';
+export type Asset = {
+    id?: string;
+    type: string;
+    params: Record<string, string>;
+};
+export type ContainerFrameProps = {
+    ref?: RefObject<HTMLIFrameElement | null>;
+    ssrMode?: boolean;
+    id?: string;
+    css?: string;
+    style?: CSSProperties;
+    zoom?: number;
+    assets?: Record<string, Asset>;
+    viewport?: string;
+    children?: ReactNode;
+    contentDidMount?: () => void;
+    contentDidDismount?: () => void;
+    contentDidUpdate?: () => void;
+    onLoad?: (iframe: HTMLIFrameElement | null) => void;
+} & useThemeSharedProps<typeof ContainerFrameStyles, typeof variantKeys>;
+declare const ContainerFrame: ({ ref, className, ssrMode, id, css, style, zoom, assets, viewport, children, contentDidMount: contentDidMountProp, contentDidDismount, contentDidUpdate, onLoad }: ContainerFrameProps) => import("react/jsx-runtime").JSX.Element;
+export default ContainerFrame;

package/dist/components/ContainerFrame/ContainerFrame.js

@@ -0,0 +1,80 @@
+import e from "../../hooks/useTheme/index.js";
+import t from "./FrameContent.js";
+import { Children as n, useCallback as r, useEffect as i, useImperativeHandle as a, useRef as o, useState as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+import { createPortal as d } from "react-dom";
+//#region src/components/ContainerFrame/ContainerFrame.tsx
+var f = ({ ref: f, className: p = "", ssrMode: m = !1, id: h = "", css: g = "", style: _, zoom: v = 1, assets: y, viewport: b = "width=device-width, initial-scale=1", children: x, contentDidMount: S, contentDidDismount: C, contentDidUpdate: w, onLoad: T }) => {
+	p = e("ContainerFrame", {
+		className: p,
+		componentKey: "root"
+	});
+	let E = o(null);
+	a(f, () => E.current, [E]);
+	let [D, O] = s(!1), [k, A] = s(null), j = r((e, t, n) => {
+		let r = [...t.childNodes], i = n.getElementById("customStyle");
+		Object.values(e).forEach((e) => {
+			let a = n.createElement(e.type);
+			e.id && a.setAttribute("data-id", e.id), Object.keys(e.params).forEach((t) => {
+				(e.type === "link" || e.type === "script") && a.setAttribute(t, e.params[t]);
+			}), r.find((t) => e.type === "link" && t.href === a.href || e.type === "script" && t.src === a.src) || (t.insertBefore(a, i), r.push(a));
+		});
+	}, []), M = r((e, t) => {
+		let { head: n } = e, r = n.querySelectorAll("*:not([asset-static=\"true\"])");
+		Object.values(r).forEach((e) => {
+			n.removeChild(e);
+		}), t && j(t, n, e);
+	}, [j]), N = (e) => {
+		if (!e) return "";
+		let t = [];
+		return Object.values(e).forEach((e) => {
+			t.push(`<${e.type} ${Object.keys(e.params).map((t) => `${t}="${e.params[t]}"`).join(" ")}>`);
+		}), t.join("");
+	}, [P] = s(() => N(y)), F = r(() => S?.(), [S]);
+	i(() => {
+		D && k && M(k, y);
+	}, [
+		D,
+		y,
+		k,
+		M
+	]);
+	let I = r(() => {
+		D || (T?.(E.current), O(!0), A(E.current?.contentDocument));
+	}, [D, T]);
+	return i(() => {
+		k && (k.body.style.zoom = v === 1 ? "" : `${v}`);
+	}, [k, v]), /* @__PURE__ */ u("iframe", {
+		ref: E,
+		className: p,
+		title: "#",
+		srcDoc: `<!DOCTYPE html><html><head>${P}</head><body></body></html>`,
+		id: h,
+		onLoad: I,
+		style: _,
+		children: [D && k && d(/* @__PURE__ */ u(c, { children: [
+			/* @__PURE__ */ l("meta", {
+				name: "viewport",
+				content: b,
+				"asset-static": "true"
+			}),
+			!m && g && /* @__PURE__ */ l("style", {
+				id: "customStyle",
+				"asset-static": "true",
+				children: g
+			}),
+			m && g && /* @__PURE__ */ l("style", {
+				id: "customStyle",
+				"asset-static": "true",
+				dangerouslySetInnerHTML: { __html: g }
+			})
+		] }), k.head), D && k && x && d(/* @__PURE__ */ l(t, {
+			contentDidMount: F,
+			contentDidDismount: C,
+			contentDidUpdate: w,
+			children: n.only(x)
+		}), k.body)]
+	});
+};
+//#endregion
+export { f as default };

package/dist/components/ContainerFrame/ContainerFrame.styles.d.ts

@@ -0,0 +1,6 @@
+export declare const variantKeys: {};
+export declare const STYLES_COMPONENT_NAME = "ContainerFrame";
+declare const _default: {
+    root: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+};
+export default _default;

package/dist/components/ContainerFrame/ContainerFrame.styles.js

@@ -0,0 +1,4 @@
+import e from "../../helpers/cvaWrapper.js";
+var t = { root: e("") };
+//#endregion
+export { t as default };

package/dist/components/ContainerFrame/FrameContent.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+export type FrameContentProps = {
+    children?: ReactNode;
+    contentDidMount?: () => void;
+    contentDidUpdate?: () => void;
+    contentDidDismount?: () => void;
+};
+declare const FrameContent: ({ children, contentDidMount, contentDidDismount }: FrameContentProps) => ReactNode;
+export default FrameContent;

package/dist/components/ContainerFrame/FrameContent.js

@@ -0,0 +1,7 @@
+import { useEffect as e } from "react";
+//#region src/components/ContainerFrame/FrameContent.tsx
+var t = ({ children: t, contentDidMount: n, contentDidDismount: r }) => (e(() => (n?.(), () => {
+	r?.();
+}), []), t);
+//#endregion
+export { t as default };

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

@@ -0,0 +1,5 @@
+import { default as ContainerFrame } from './ContainerFrame';
+import { default as containerFrameTheme } from './ContainerFrame.styles';
+export * from './ContainerFrame';
+export { containerFrameTheme };
+export default ContainerFrame;

package/dist/components/ContainerFrame/index.js

@@ -0,0 +1,6 @@
+import e from "./ContainerFrame.js";
+import t from "./ContainerFrame.styles.js";
+//#region src/components/ContainerFrame/index.ts
+var n = e;
+//#endregion
+export { t as containerFrameTheme, n as default };

package/dist/components/ContainerResizable/ContainerResizable.d.ts

@@ -0,0 +1,26 @@
+import { default as ContainerResizableStyles, variantKeys } from './ContainerResizable.styles';
+import { useThemeSharedProps } from '../../hooks/useTheme';
+import { HTMLAttributes, ReactNode, RefObject } from 'react';
+export type ResizeHandle = 'se' | 's' | 'e' | 'n' | 'w' | 'nw' | 'sw' | 'ne';
+export type ContainerResizableProps = {
+    ref?: RefObject<HTMLDivElement | null>;
+    parentRef?: RefObject<HTMLElement | null>;
+    hoverMode?: boolean;
+    autoGrow?: boolean;
+    width?: number;
+    height?: number;
+    grid?: number[];
+    resizeHandles?: ResizeHandle[];
+    transformScale?: number;
+    axis?: 'both' | 'x' | 'y' | 'none';
+    lockAspectRatio?: boolean;
+    minConstraintsX?: number;
+    minConstraintsY?: number;
+    maxConstraintsX?: number;
+    maxConstraintsY?: number;
+    children?: ReactNode;
+    handle?: ReactNode | ((resizeHandle: string) => ReactNode);
+    onChange?: (width: number, height: number) => void;
+} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> & useThemeSharedProps<typeof ContainerResizableStyles, typeof variantKeys>;
+declare const ContainerResizable: ({ ref, className, parentRef, hoverMode, autoGrow, width: widthProp, height: heightProp, grid, resizeHandles, transformScale, axis, lockAspectRatio, minConstraintsX, minConstraintsY, maxConstraintsX, maxConstraintsY, children, handle, onChange, ...props }: ContainerResizableProps) => import("react/jsx-runtime").JSX.Element;
+export default ContainerResizable;

package/dist/components/ContainerResizable/ContainerResizable.js

@@ -0,0 +1,106 @@
+import { debounce as e } from "../../helpers/lodash/debounce.js";
+import t from "../../hooks/useTheme/index.js";
+import n from "./ContainerResizable.styles.js";
+import { snapToGrid as r } from "./utils.js";
+import { useCallback as i, useEffect as a, useImperativeHandle as o, useMemo as s, useRef as c, useState as l } from "react";
+import { jsx as u, jsxs as ee } from "react/jsx-runtime";
+import d from "clsx";
+//#region src/components/ContainerResizable/ContainerResizable.tsx
+var f = ["se"], p = ({ ref: p, className: m, parentRef: h, hoverMode: g = !1, autoGrow: _ = !0, width: v = Infinity, height: y = Infinity, grid: b, resizeHandles: x = f, transformScale: S = 1, axis: C = "both", lockAspectRatio: w = !1, minConstraintsX: T = 100, minConstraintsY: E = 100, maxConstraintsX: D = Infinity, maxConstraintsY: O = Infinity, children: te, handle: k, onChange: A, ...j }) => {
+	let M = t("ContainerResizable", {
+		className: m,
+		componentKey: ["root", "rootInternal"]
+	}), [N, P] = l(v), [F, I] = l(y), [L, R] = l(0), [z, B] = l(), [V, ne] = l(0), [H, re] = l(0), [U, ie] = l(0), W = c(null);
+	o(p, () => W.current, [W]);
+	let G = c(null), K = s(() => A ? e(A, 150) : void 0, [A]), q = i(() => !h?.current && typeof document < "u" ? document.body : h?.current, [h]), J = i((e, t, n = !1) => {
+		let [r, i] = [[T, E], [D, O]];
+		if (w) if (t === F) {
+			let n = N / F;
+			t = e / n, e = t * n;
+		} else {
+			let n = F / N;
+			e = t / n, t = e * n;
+		}
+		r[0] && r[1] && (e = Math.max(r[0], e), t = Math.max(r[1], t)), i[0] && i[1] && (e = Math.min(i[0], e), t = Math.min(i[1], t));
+		let a = W.current?.getBoundingClientRect();
+		return !n && a && (a.x + e > window.innerWidth && (e = window.innerWidth - a.x), a.y + t > window.innerHeight && (t = window.innerHeight - a.y)), [e, t];
+	}, [
+		F,
+		w,
+		D,
+		O,
+		T,
+		E,
+		N
+	]), Y = i((e) => {
+		e.stopPropagation(), e.preventDefault();
+		let t = e.clientX, n = e.clientY, i = (t - L) / S, a = (n - U) / S, o = (C === "both" || C === "x") && ["n", "s"].indexOf(z ?? "") === -1, s = (C === "both" || C === "y") && ["e", "w"].indexOf(z ?? "") === -1, c = z?.includes("w") || z?.includes("n");
+		if (Array.isArray(b) && ([i, a] = r(i, a, b), !i && !a)) return;
+		let l = V + (o ? i : 0), u = H + (s ? a : 0);
+		c && (l = V - (o ? i : 0), u = H - (s ? a : 0)), !(l === V && u === H) && ([l, u] = J(l, u, c), K?.(l, u), V !== Infinity && G.current && (G.current.style.width = `${l}px`), H !== Infinity && G.current && (G.current.style.height = `${u}px`));
+	}, [
+		C,
+		L,
+		U,
+		z,
+		b,
+		H,
+		V,
+		J,
+		S,
+		K
+	]), X = i((e) => {
+		e.stopPropagation(), e.preventDefault(), B(void 0), N !== Infinity && P(G.current?.offsetWidth ?? N), F !== Infinity && I(G.current?.offsetHeight ?? F), q()?.classList.remove("resizing");
+	}, [
+		q,
+		F,
+		N
+	]), Z = i((e) => (t) => {
+		if (!W.current) return;
+		q()?.classList.add("resizing"), B(e), R(t.clientX), ie(t.clientY);
+		let { width: n, height: r } = W.current.getBoundingClientRect();
+		ne(N === -1 ? n : N), re(F === -1 ? r : F);
+	}, [
+		q,
+		F,
+		N
+	]);
+	a(() => (z && (window.addEventListener("mousemove", Y, !1), window.addEventListener("mouseup", X, !1)), () => {
+		z && (window.removeEventListener("mousemove", Y, !1), window.removeEventListener("mouseup", X, !1));
+	}), [z]), a(() => {
+		P(v), I(y);
+	}, [v, y]);
+	let Q = i((e) => k ? typeof k == "function" ? k(e) : k : /* @__PURE__ */ u("div", {
+		className: n.handlerContainer({
+			position: e,
+			hover: g
+		}),
+		onMouseDown: Z(e),
+		children: /* @__PURE__ */ u("div", { className: n.handler({ position: e }) })
+	}, e), [
+		k,
+		Z,
+		g
+	]), ae = s(() => x.map((e) => Q(e)), [x, Q]), $ = {};
+	return F !== Infinity && ($.height = `${F}px`), N !== Infinity && ($.width = `${N}px`), /* @__PURE__ */ ee("div", {
+		...j,
+		ref: W,
+		className: d(M.root, {
+			"group-5": g,
+			grow: _
+		}),
+		children: [/* @__PURE__ */ u("div", {
+			ref: G,
+			className: d(M.rootInternal, {
+				"pt-1": x.includes("n"),
+				"pb-1": x.includes("s"),
+				"pl-1": x.includes("w"),
+				"pr-1": x.includes("e")
+			}),
+			style: $,
+			children: te
+		}), ae]
+	});
+};
+//#endregion
+export { p as default };