@ryuzaki13/react-foundation-ui 1.0.0 → 1.0.2

package/dist/chunks/{popover-C79P5bm2.js → popover-xJJqy1v6.js}

@@ -1,7 +1,7 @@
-import { t as e } from "./floating-arrow-CdRV69sg.js";
-import { cn as t } from "@ryuzaki13/react-foundation-lib/utils";
-import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
-import { cloneElement as a, createContext as o, useCallback as s, useContext as c, useEffect as l, useRef as u, useState as d } from "react";
+import { t as e } from "./floating-arrow-BE-z4QkE.js";
+import { cloneElement as t, createContext as n, useCallback as r, useContext as i, useEffect as a, useRef as o, useState as s } from "react";
+import { cn as c } from "@ryuzaki13/react-foundation-lib/utils";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
 import { FloatingPortal as f, arrow as p, autoUpdate as m, flip as h, offset as g, shift as _, useDismiss as v, useFloating as y, useHover as b, useInteractions as x, useRole as S } from "@floating-ui/react";
 import { useClickOutside as C, useEscapeDismiss as w, useOverlayFocus as T } from "@ryuzaki13/react-foundation-lib/dom";
 import { createMissingContextError as E } from "@ryuzaki13/react-foundation-lib/error";
@@ -10,9 +10,9 @@ var O = {
 	popover: "JK2Y7t",
 	primary: "_5QtpCJ",
 	secondary: "hZuysP"
-}, k = o(null);
+}, k = n(null);
 function A() {
-	let e = c(k);
+	let e = i(k);
 	if (!e) throw E({
 		hookName: "usePopoverContext",
 		providerName: "Popover"
@@ -21,70 +21,70 @@ function A() {
 }
 //#endregion
 //#region src/popover/components/PopoverContent.tsx
-var j = ({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !0, disableOutsideClick: l = !1, background: d = "secondary" }) => {
-	let { open: p, setOpen: m, refs: h, floatingStyles: g, middlewareData: _, placement: v, arrowRef: y } = A(), b = u(null), x = s((e) => {
+var j = ({ children: t, onClose: n, closeOnOutside: i = !0, closeOnEscape: a = !0, disableOutsideClick: s = !1, background: l = "secondary" }) => {
+	let { open: p, setOpen: m, refs: h, floatingStyles: g, middlewareData: _, placement: v, arrowRef: y } = A(), b = o(null), x = r((e) => {
 		b.current = e, h.setFloating(e);
 	}, [h]), S = T({
 		active: p,
 		initialFocus: "container",
 		restoreFocus: !0,
 		containerRef: b
-	}), E = s(() => {
-		p && (m(!1), a?.());
+	}), E = r(() => {
+		p && (m(!1), n?.());
 	}, [
 		m,
-		a,
+		n,
 		p
 	]);
 	w({
 		active: p,
-		enabled: c,
+		enabled: a,
 		onDismiss: E,
 		containerRef: S
 	});
-	let D = s(() => {
-		!p || l || o && E();
+	let D = r(() => {
+		!p || s || i && E();
 	}, [
 		p,
-		l,
-		o,
+		s,
+		i,
 		E
 	]);
-	return C([h.floating, h.reference], D), p ? /* @__PURE__ */ r(f, { children: /* @__PURE__ */ i("div", {
+	return C([h.floating, h.reference], D), p ? /* @__PURE__ */ u(f, { children: /* @__PURE__ */ d("div", {
 		ref: x,
 		style: g,
-		className: t(O.popover, O[d]),
+		className: c(O.popover, O[l]),
 		role: "dialog",
 		"aria-modal": "true",
 		tabIndex: -1,
-		children: [typeof n == "function" ? n({ setClose: E }) : n, /* @__PURE__ */ r(e, {
+		children: [typeof t == "function" ? t({ setClose: E }) : t, /* @__PURE__ */ u(e, {
 			ref: y,
 			placement: v,
 			middlewareData: _
 		})]
 	}) }) : null;
-}, M = ({ passive: e, children: t }) => {
-	let { open: n, setOpen: r, refs: i } = A(), o = s((n) => {
-		t.props.onClick && t.props.onClick(n), !n.defaultPrevented && (n.preventDefault(), n.stopPropagation(), !e && r((e) => !e));
+}, M = ({ passive: e, children: n }) => {
+	let { open: i, setOpen: a, refs: o } = A(), s = r((t) => {
+		n.props.onClick && n.props.onClick(t), !t.defaultPrevented && (t.preventDefault(), t.stopPropagation(), !e && a((e) => !e));
 	}, [
-		t,
-		r,
+		n,
+		a,
 		e
 	]);
-	return a(t, {
-		ref: i.setReference,
-		"aria-expanded": n,
-		onClick: o
+	return t(n, {
+		ref: o.setReference,
+		"aria-expanded": i,
+		onClick: s
 	});
 }, N = Object.assign(({ children: e, open: t, defaultOpen: n, onOpenChange: i, placement: a = "bottom" }) => {
-	let [o, c] = d(n ?? !1), l = t !== void 0, f = l ? t : o, v = s((e) => {
+	let [c, l] = s(n ?? !1), d = t !== void 0, f = d ? t : c, v = r((e) => {
 		let t = typeof e == "function" ? e(f) : e;
-		l || c(t), i?.(t);
+		d || l(t), i?.(t);
 	}, [
-		l,
+		d,
 		i,
 		f
-	]), b = u(null), { refs: x, floatingStyles: S, middlewareData: C, placement: w } = y({
+	]), b = o(null), { refs: x, floatingStyles: S, middlewareData: C, placement: w } = y({
 		open: f,
 		onOpenChange: v,
 		placement: a,
@@ -96,7 +96,7 @@ var j = ({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !
 		],
 		whileElementsMounted: m
 	});
-	return /* @__PURE__ */ r(k.Provider, {
+	return /* @__PURE__ */ u(k.Provider, {
 		value: {
 			open: f,
 			setOpen: v,
@@ -119,11 +119,11 @@ var j = ({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !
 	error: "bpGNoX",
 	warning: "tYnRg-",
 	success: "_8lflEh"
-}, F = ({ content: a, children: o, openOnHover: s = !0, placement: c = "bottom", openDelay: l = 200, closeDelay: f = 100, maxWidth: C, state: w, tooltip: T }) => {
-	let [E, O] = d(!1), k = u(null), { refs: A, floatingStyles: j, middlewareData: M, context: N, placement: F } = y({
+}, F = ({ content: t, children: n, openOnHover: r = !0, placement: i = "bottom", openDelay: a = 200, closeDelay: f = 100, maxWidth: C, state: w, tooltip: T }) => {
+	let [E, O] = s(!1), k = o(null), { refs: A, floatingStyles: j, middlewareData: M, context: N, placement: F } = y({
 		open: E,
 		onOpenChange: O,
-		placement: c,
+		placement: i,
 		middleware: [
 			g(8),
 			h({
@@ -143,22 +143,22 @@ var j = ({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !
 		whileElementsMounted: m
 	}), { getReferenceProps: I, getFloatingProps: L } = x([
 		b(N, {
-			enabled: s,
+			enabled: r,
 			move: !1,
 			delay: {
-				open: l,
+				open: a,
 				close: f
 			}
 		}),
 		v(N),
 		S(N)
 	]);
-	return /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r("span", {
+	return /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u("span", {
 		ref: A.setReference,
 		...I(),
 		style: { lineHeight: 1 },
-		children: o
-	}), E && D(/* @__PURE__ */ i("div", {
+		children: n
+	}), E && D(/* @__PURE__ */ d("div", {
 		ref: A.setFloating,
 		style: {
 			...j,
@@ -167,25 +167,25 @@ var j = ({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !
 		},
 		...L(),
 		role: "tooltip",
-		className: t(P.tooltipPanel, T && P.tooltip, w && P[w]),
-		children: [a, /* @__PURE__ */ r(e, {
+		className: c(P.tooltipPanel, T && P.tooltip, w && P[w]),
+		children: [t, /* @__PURE__ */ u(e, {
 			ref: k,
 			placement: F,
 			middlewareData: M
 		})]
 	}), document.body)] });
-}, I = ({ x: t, y: n, children: a }) => {
-	let o = u(null), { refs: s, floatingStyles: c, middlewareData: d, placement: f } = y({
+}, I = ({ x: t, y: n, children: r }) => {
+	let i = o(null), { refs: s, floatingStyles: c, middlewareData: l, placement: f } = y({
 		strategy: "absolute",
 		placement: "top",
 		middleware: [
 			g(6),
 			h(),
 			_({ padding: 16 }),
-			p({ element: o })
+			p({ element: i })
 		]
 	});
-	return l(() => {
+	return a(() => {
 		s.setReference && s.setReference({ getBoundingClientRect: () => ({
 			x: t,
 			y: n,
@@ -201,7 +201,7 @@ var j = ({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !
 		t,
 		n,
 		s
-	]), /* @__PURE__ */ i("div", {
+	]), /* @__PURE__ */ d("div", {
 		ref: s.setFloating,
 		style: {
 			...c,
@@ -209,14 +209,14 @@ var j = ({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !
 			pointerEvents: "none"
 		},
 		className: P.tooltip,
-		children: [a, /* @__PURE__ */ r(e, {
-			ref: o,
+		children: [r, /* @__PURE__ */ u(e, {
+			ref: i,
 			placement: f,
-			middlewareData: d
+			middlewareData: l
 		})]
 	});
 };
 //#endregion
 export { j as a, M as i, F as n, A as o, N as r, I as t };
 
-//# sourceMappingURL=popover-C79P5bm2.js.map
+//# sourceMappingURL=popover-xJJqy1v6.js.map

package/dist/chunks/popover-xJJqy1v6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover-xJJqy1v6.js","names":[],"sources":["../../src/popover/components/Popover.module.scss","../../src/popover/components/PopoverContext.tsx","../../src/popover/components/PopoverContent.tsx","../../src/popover/components/PopoverTrigger.tsx","../../src/popover/components/Popover.tsx","../../src/popover/Popover.module.scss","../../src/popover/FloatingPopover.tsx","../../src/popover/FloatingTooltip.tsx"],"sourcesContent":[".popover {\n\tpadding: var(--space-sm);\n\t// background-image: radial-gradient(var(--surface-0) 50%, var(--surface-1) 100%);\n\n\tborder: var(--border-width) solid var(--border-1);\n\tborder-radius: var(--radius-sm);\n\tcolor: var(--content-0);\n\n\tfilter: drop-shadow(var(--shadow-md));\n\n\tz-index: var(--z-popover);\n\n\t&.primary {\n\t\tbackground-color: var(--surface-0);\n\t}\n\n\t&.secondary {\n\t\tbackground-color: var(--surface-1);\n\t}\n}\n","import React, { createContext, useContext } from \"react\";\n\nimport { Placement, useFloating } from \"@floating-ui/react\";\nimport { createMissingContextError } from \"@ryuzaki13/react-foundation-lib/error\";\n\ninterface PopoverContextValue {\n\topen: boolean;\n\tsetOpen: React.Dispatch<React.SetStateAction<boolean>>;\n\trefs: ReturnType<typeof useFloating>[\"refs\"];\n\tfloatingStyles: React.CSSProperties;\n\tplacement: Placement;\n\tmiddlewareData: ReturnType<typeof useFloating>[\"middlewareData\"];\n\tarrowRef: React.RefObject<HTMLDivElement | null>;\n}\n\nexport const PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport function usePopoverContext() {\n\tconst context = useContext(PopoverContext);\n\tif (!context) {\n\t\tthrow createMissingContextError({\n\t\t\thookName: \"usePopoverContext\",\n\t\t\tproviderName: \"Popover\"\n\t\t});\n\t}\n\treturn context;\n}\n","import React, { useCallback, useRef } from \"react\";\n\nimport { FloatingPortal } from \"@floating-ui/react\";\nimport { useClickOutside, useEscapeDismiss, useOverlayFocus } from \"@ryuzaki13/react-foundation-lib/dom\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { TooltipArrow } from \"../../floating-arrow\";\n\nimport styles from \"./Popover.module.scss\";\nimport { usePopoverContext } from \"./PopoverContext\";\n\nexport interface PopoverContentProps {\n\tchildren: React.ReactNode | ((ctx: { setClose: () => void }) => React.ReactNode);\n\tonClose?: () => void;\n\tcloseOnOutside?: boolean;\n\tcloseOnEscape?: boolean;\n\tdisableOutsideClick?: boolean;\n\tbackground?: \"primary\" | \"secondary\";\n}\n\n/**\n * Содержимое Popover, отображаемое в портале.\n */\nexport const PopoverContent: React.FC<PopoverContentProps> = ({\n\tchildren,\n\tonClose,\n\tcloseOnOutside = true,\n\tcloseOnEscape = true,\n\tdisableOutsideClick = false,\n\tbackground = \"secondary\"\n}) => {\n\tconst { open, setOpen, refs, floatingStyles, middlewareData, placement, arrowRef } = usePopoverContext();\n\tconst floatingElementRef = useRef<HTMLDivElement | null>(null);\n\tconst setFloating = useCallback(\n\t\t(node: HTMLDivElement | null) => {\n\t\t\tfloatingElementRef.current = node;\n\t\t\trefs.setFloating(node);\n\t\t},\n\t\t[refs]\n\t);\n\n\tconst floatingRef = useOverlayFocus<HTMLDivElement>({\n\t\tactive: open,\n\t\tinitialFocus: \"container\",\n\t\trestoreFocus: true,\n\t\tcontainerRef: floatingElementRef\n\t});\n\n\tconst setClose = useCallback(() => {\n\t\tif (!open) return;\n\t\tsetOpen(false);\n\t\tonClose?.();\n\t}, [setOpen, onClose, open]);\n\n\tuseEscapeDismiss({\n\t\tactive: open,\n\t\tenabled: closeOnEscape,\n\t\tonDismiss: setClose,\n\t\tcontainerRef: floatingRef as React.RefObject<HTMLElement | null>\n\t});\n\n\tconst outsideClose = useCallback(() => {\n\t\tif (!open || disableOutsideClick) return;\n\t\tif (closeOnOutside) setClose();\n\t}, [open, disableOutsideClick, closeOnOutside, setClose]);\n\n\tuseClickOutside([refs.floating as React.RefObject<HTMLElement>, refs.reference as React.RefObject<HTMLElement>], outsideClose);\n\n\tif (!open) return null;\n\n\treturn (\n\t\t<FloatingPortal>\n\t\t\t<div\n\t\t\t\tref={setFloating}\n\t\t\t\tstyle={floatingStyles}\n\t\t\t\tclassName={cn(styles.popover, styles[background])}\n\t\t\t\trole=\"dialog\"\n\t\t\t\taria-modal=\"true\"\n\t\t\t\ttabIndex={-1}>\n\t\t\t\t{typeof children === \"function\" ? children({ setClose }) : children}\n\t\t\t\t<TooltipArrow ref={arrowRef} placement={placement} middlewareData={middlewareData} />\n\t\t\t</div>\n\t\t</FloatingPortal>\n\t);\n};\n","import React, { cloneElement, useCallback } from \"react\";\n\nimport { usePopoverContext } from \"./PopoverContext\";\n\nexport interface PopoverTriggerProps {\n\tpassive?: true;\n\tchildren: React.ReactElement<React.HTMLAttributes<Element> & { ref?: React.Ref<Element> }>;\n}\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ passive, children }) => {\n\tconst { open, setOpen, refs } = usePopoverContext();\n\n\tconst handleClick = useCallback(\n\t\t(e: React.MouseEvent) => {\n\t\t\tif (children.props.onClick) {\n\t\t\t\tchildren.props.onClick(e);\n\t\t\t}\n\t\t\tif (e.defaultPrevented) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\n\t\t\tif (passive) return;\n\n\t\t\tsetOpen((v) => !v);\n\t\t},\n\t\t[children, setOpen, passive]\n\t);\n\n\treturn cloneElement(children as React.JSX.Element, {\n\t\tref: refs.setReference,\n\t\t\"aria-expanded\": open,\n\t\tonClick: handleClick\n\t});\n};\n","/* eslint-disable react-refresh/only-export-components */\nimport React, { useCallback, useRef, useState } from \"react\";\n\nimport { arrow, autoUpdate, flip, offset, Placement, shift, useFloating } from \"@floating-ui/react\";\n\nimport { PopoverContent } from \"./PopoverContent\";\nimport { PopoverContext } from \"./PopoverContext\";\nimport { PopoverTrigger } from \"./PopoverTrigger\";\n\nexport interface PopoverProps {\n\tchildren: React.ReactNode;\n\tplacement?: Placement;\n\topen?: boolean;\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n}\n\n/**\n * Контролируемый Popover.\n * Используется в связке с Popover.Trigger и Popover.Content.\n */\nconst PopoverRoot: React.FC<PopoverProps> = ({ children, open: controlledOpen, defaultOpen, onOpenChange, placement = \"bottom\" }) => {\n\tconst [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen ?? false);\n\n\tconst isControlled = controlledOpen !== undefined;\n\tconst open = isControlled ? controlledOpen : uncontrolledOpen;\n\tconst setOpen = useCallback<React.Dispatch<React.SetStateAction<boolean>>>(\n\t\t(value) => {\n\t\t\tconst next = typeof value === \"function\" ? value(open) : value;\n\t\t\tif (!isControlled) setUncontrolledOpen(next);\n\t\t\tonOpenChange?.(next);\n\t\t},\n\t\t[isControlled, onOpenChange, open]\n\t);\n\n\tconst arrowRef = useRef<HTMLDivElement | null>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tplacement: actualPlacement\n\t} = useFloating({\n\t\topen,\n\t\tonOpenChange: setOpen,\n\t\tplacement,\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\tmiddleware: [offset(8), flip(), shift({ padding: 16 }), arrow({ element: arrowRef.current })],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\treturn (\n\t\t<PopoverContext.Provider value={{ open, setOpen, refs, floatingStyles, placement: actualPlacement, middlewareData, arrowRef }}>\n\t\t\t{children}\n\t\t</PopoverContext.Provider>\n\t);\n};\n\n/**\n * Композиционное API:\n * <Popover>\n *   <Popover.Trigger />\n *   <Popover.Content />\n * </Popover>\n */\nexport const Popover = Object.assign(PopoverRoot, {\n\tTrigger: PopoverTrigger,\n\tContent: PopoverContent\n});\n",".tooltipPanel {\n\tpadding: var(--space-sm);\n\t// background-image: radial-gradient(var(--surface-0) 50%, var(--surface-1) 100%);\n\tbackground-color: var(--surface-1);\n\tborder: var(--border-width) solid var(--border-1);\n\tborder-radius: var(--radius-sm);\n\tcolor: var(--content-0);\n\n\tfilter: drop-shadow(var(--shadow-sm));\n\n\t&.negative {\n\t\t--border-1: var(--content-0);\n\n\t\tbackground-color: var(--content-0);\n\t\tborder-color: var(--border-1);\n\t\tcolor: var(--surface-1);\n\t}\n\n\t&.information {\n\t\t--border-1: var(--status-info-text);\n\n\t\tbackground-color: var(--status-info-text);\n\t\tborder-color: var(--status-info-text);\n\t\tcolor: var(--status-info-on-fill);\n\t}\n\n\t&.error {\n\t\t--border-1: var(--status-error-text);\n\n\t\tbackground-color: var(--status-error-text);\n\t\tborder-color: var(--status-error-text);\n\t\tcolor: var(--status-error-on-fill);\n\t}\n\n\t&.warning {\n\t\t--border-1: var(--status-warning-text);\n\n\t\tbackground-color: var(--status-warning-text);\n\t\tborder-color: var(--status-warning-text);\n\t\tcolor: var(--status-warning-on-fill);\n\t}\n\n\t&.success {\n\t\t--border-1: var(--status-success-text);\n\n\t\tbackground-color: var(--status-success-text);\n\t\tborder-color: var(--status-success-text);\n\t\tcolor: var(--status-success-on-fill);\n\t}\n}\n\n.tooltip {\n\tz-index: var(--z-tooltip);\n\tpointer-events: none;\n\n\ttext-align: initial;\n\tfont-size: var(--font-size-sm);\n\tfont-style: normal;\n\tfont-weight: 500;\n\tfont-variation-settings: \"wght\" 500;\n\tline-height: var(--line-height);\n\n\t@extend .tooltipPanel;\n}\n","/* eslint-disable react-hooks/refs */\nimport React, { useRef, useState } from \"react\";\n\nimport {\n\tarrow,\n\tautoUpdate,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tuseDismiss,\n\tuseFloating,\n\tuseHover,\n\tuseInteractions,\n\tuseRole\n} from \"@floating-ui/react\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { createPortal } from \"react-dom\";\n\nimport { FloatingArrow } from \"../floating-arrow/FloatingArrow\";\n\nimport styles from \"./Popover.module.scss\";\n\ninterface FloatingPopoverProps {\n\tcontent: React.ReactNode;\n\tchildren: React.ReactNode;\n\topenOnHover?: boolean;\n\tplacement?: Placement;\n\topenDelay?: number;\n\tcloseDelay?: number;\n\tmaxWidth?: number;\n\tstate?: \"information\" | \"error\" | \"warning\" | \"success\" | \"negative\";\n\ttooltip?: true;\n}\n\nexport const FloatingPopover: React.FC<FloatingPopoverProps> = ({\n\tcontent,\n\tchildren,\n\topenOnHover = true,\n\tplacement = \"bottom\",\n\topenDelay = 200,\n\tcloseDelay = 100,\n\tmaxWidth,\n\tstate,\n\ttooltip\n}) => {\n\tconst [open, setOpen] = useState(false);\n\tconst arrowRef = useRef<HTMLDivElement>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tcontext,\n\t\tplacement: computedPlacement\n\t} = useFloating({\n\t\topen,\n\t\tonOpenChange: setOpen,\n\t\tplacement,\n\t\tmiddleware: [\n\t\t\toffset(8),\n\t\t\tflip({ fallbackAxisSideDirection: \"end\", fallbackPlacements: [\"top\", \"right\", \"bottom\"] }),\n\t\t\tshift({ padding: 16 }),\n\t\t\tarrow({ element: arrowRef, padding: 8 })\n\t\t],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\tconst hover = useHover(context, {\n\t\tenabled: openOnHover,\n\t\tmove: false,\n\t\tdelay: {\n\t\t\topen: openDelay,\n\t\t\tclose: closeDelay\n\t\t}\n\t});\n\tconst dismiss = useDismiss(context);\n\tconst role = useRole(context);\n\n\tconst { getReferenceProps, getFloatingProps } = useInteractions([hover, dismiss, role]);\n\n\treturn (\n\t\t<>\n\t\t\t<span ref={refs.setReference} {...getReferenceProps()} style={{ lineHeight: 1 }}>\n\t\t\t\t{children}\n\t\t\t</span>\n\n\t\t\t{open &&\n\t\t\t\tcreatePortal(\n\t\t\t\t\t<div\n\t\t\t\t\t\tref={refs.setFloating}\n\t\t\t\t\t\tstyle={{ ...floatingStyles, zIndex: \"var(--z-tooltip)\", maxWidth: maxWidth ? `${maxWidth}em` : undefined }}\n\t\t\t\t\t\t{...getFloatingProps()}\n\t\t\t\t\t\trole=\"tooltip\"\n\t\t\t\t\t\tclassName={cn(styles.tooltipPanel, tooltip && styles.tooltip, state && styles[state])}>\n\t\t\t\t\t\t{content}\n\n\t\t\t\t\t\t<FloatingArrow ref={arrowRef} placement={computedPlacement} middlewareData={middlewareData} />\n\t\t\t\t\t</div>,\n\t\t\t\t\tdocument.body\n\t\t\t\t)}\n\t\t</>\n\t);\n};\n","import React, { useEffect, useRef } from \"react\";\n\nimport { arrow, flip, offset, shift, useFloating } from \"@floating-ui/react\";\n\nimport { FloatingArrow } from \"../floating-arrow/FloatingArrow\";\n\nimport styles from \"./Popover.module.scss\";\n\nexport const FloatingTooltip: React.FC<{\n\tx: number;\n\ty: number;\n\tchildren: React.ReactNode;\n}> = ({ x, y, children }) => {\n\tconst arrowRef = useRef<HTMLDivElement | null>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tplacement: computedPlacement\n\t} = useFloating({\n\t\tstrategy: \"absolute\",\n\t\tplacement: \"top\",\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\tmiddleware: [offset(6), flip(), shift({ padding: 16 }), arrow({ element: arrowRef })]\n\t});\n\n\tuseEffect(() => {\n\t\tif (refs.setReference) {\n\t\t\trefs.setReference({\n\t\t\t\tgetBoundingClientRect: () =>\n\t\t\t\t\t({\n\t\t\t\t\t\tx,\n\t\t\t\t\t\ty,\n\t\t\t\t\t\twidth: 0,\n\t\t\t\t\t\theight: 0,\n\t\t\t\t\t\ttop: y,\n\t\t\t\t\t\tleft: x,\n\t\t\t\t\t\tbottom: y,\n\t\t\t\t\t\tright: x,\n\t\t\t\t\t\ttoJSON: () => {}\n\t\t\t\t\t}) as DOMRect\n\t\t\t});\n\t\t}\n\t}, [x, y, refs]);\n\n\treturn (\n\t\t<div ref={refs.setFloating} style={{ ...floatingStyles, position: \"absolute\", pointerEvents: \"none\" }} className={styles.tooltip}>\n\t\t\t{children}\n\n\t\t\t<FloatingArrow ref={arrowRef} placement={computedPlacement} middlewareData={middlewareData} />\n\t\t</div>\n\t);\n};\n"],"mappings":"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"}

package/dist/chunks/{separator-CIqnk2z9.js → separator-B72Aq-6a.js}

@@ -1,7 +1,7 @@
 import { PolymorphicComponent as e } from "../polymorphic/index.js";
+import "react";
 import { cn as t } from "@ryuzaki13/react-foundation-lib/utils";
 import { jsx as n } from "react/jsx-runtime";
-import "react";
 //#region src/separator/Separator.tsx
 var r = ({ as: r, orientation: i = "horizontal", className: a, ...o }) => /* @__PURE__ */ n(e, {
 	as: r,
@@ -12,4 +12,4 @@ var r = ({ as: r, orientation: i = "horizontal", className: a, ...o }) => /* @__
 //#endregion
 export { r as t };
 
-//# sourceMappingURL=separator-CIqnk2z9.js.map
+//# sourceMappingURL=separator-B72Aq-6a.js.map

package/dist/chunks/{separator-CIqnk2z9.js.map → separator-B72Aq-6a.js.map}

@@ -1 +1 @@
-{"version":3,"file":"separator-CIqnk2z9.js","names":[],"sources":["../../src/separator/Separator.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { PolymorphicComponent, PolymorphicComponentBaseProps } from \"../polymorphic\";\n\ntype SeparatorOwnProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentBaseProps<E> & {\n\torientation?: \"horizontal\" | \"vertical\";\n\tclassName?: string;\n};\n\ntype SeparatorProps<E extends React.ElementType> = SeparatorOwnProps<E> & Omit<React.ComponentPropsWithRef<E>, keyof SeparatorOwnProps>;\n\nexport const Separator = <E extends React.ElementType>({ as, orientation = \"horizontal\", className, ...props }: SeparatorProps<E>) => {\n\tconst Component = as;\n\n\treturn (\n\t\t<PolymorphicComponent\n\t\t\tas={Component as React.ElementType}\n\t\t\taria-orientation={orientation}\n\t\t\tclassName={cn(className, orientation === \"horizontal\" ? \"separator\" : \"separatorVertical\")}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n"],"mappings":";;;;;AAaA,IAAa,KAA0C,EAAE,OAAI,iBAAc,cAAc,cAAW,GAAG,QAIrG,kBAAC,GAAD;CACK;CACJ,oBAAkB;CAClB,WAAW,EAAG,GAAW,MAAgB,eAAe,cAAc,mBAAmB;CACzF,GAAI;AACJ,CAAA"}
+{"version":3,"file":"separator-B72Aq-6a.js","names":[],"sources":["../../src/separator/Separator.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { PolymorphicComponent, PolymorphicComponentBaseProps } from \"../polymorphic\";\n\ntype SeparatorOwnProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentBaseProps<E> & {\n\torientation?: \"horizontal\" | \"vertical\";\n\tclassName?: string;\n};\n\ntype SeparatorProps<E extends React.ElementType> = SeparatorOwnProps<E> & Omit<React.ComponentPropsWithRef<E>, keyof SeparatorOwnProps>;\n\nexport const Separator = <E extends React.ElementType>({ as, orientation = \"horizontal\", className, ...props }: SeparatorProps<E>) => {\n\tconst Component = as;\n\n\treturn (\n\t\t<PolymorphicComponent\n\t\t\tas={Component as React.ElementType}\n\t\t\taria-orientation={orientation}\n\t\t\tclassName={cn(className, orientation === \"horizontal\" ? \"separator\" : \"separatorVertical\")}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n"],"mappings":";;;;;AAaA,IAAa,KAA0C,EAAE,OAAI,iBAAc,cAAc,cAAW,GAAG,QAIrG,kBAAC,GAAD;CACK;CACJ,oBAAkB;CAClB,WAAW,EAAG,GAAW,MAAgB,eAAe,cAAc,mBAAmB;CACzF,GAAI;AACJ,CAAA"}