@ryuzaki13/react-foundation-ui 3.4.3 → 3.6.0

package/dist/chunks/popover-BJH-yHvb.js

@@ -0,0 +1,263 @@
+import { t as e } from "./floating-arrow-B_iSbzUZ.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, useId as u, useLayoutEffect as d, useRef as f, useState as p } from "react";
+import { FloatingPortal as m, arrow as h, autoUpdate as g, flip as _, offset as v, shift as y, size as b, useDismiss as x, useFloating as S, useFocus as C, useHover as w, useInteractions as T, useRole as E } from "@floating-ui/react";
+import { useClickOutside as D, useEscapeDismiss as O, useOverlayFocus as k } from "@ryuzaki13/react-foundation-lib/dom";
+import { createMissingContextError as A } from "@ryuzaki13/react-foundation-lib/error";
+import { createPortal as j } from "react-dom";
+//#region src/popover/lib/applyPopoverAvailableSize.ts
+function M({ availableWidth: e, availableHeight: t, floating: n }) {
+	n.style.setProperty("--popover-available-width", `${Math.max(0, e)}px`), n.style.setProperty("--popover-available-height", `${Math.max(0, t)}px`);
+}
+var N = {
+	popover: "JK2Y7t",
+	primary: "_5QtpCJ",
+	secondary: "hZuysP"
+}, P = o(null);
+function F() {
+	let e = c(P);
+	if (!e) throw A({
+		hookName: "usePopoverContext",
+		providerName: "Popover"
+	});
+	return e;
+}
+//#endregion
+//#region src/popover/components/PopoverContent.tsx
+function I({ children: n, onClose: a, closeOnOutside: o = !0, closeOnEscape: c = !0, disableOutsideClick: l = !1, background: u = "secondary", role: d, "aria-label": p, "aria-labelledby": h, "aria-describedby": g }) {
+	let { open: _, setOpen: v, refs: y, floatingStyles: b, middlewareData: x, placement: S, arrowRef: C, contentId: w } = F(), T = f(null), E = s((e) => {
+		T.current = e, y.setFloating(e);
+	}, [y]), A = k({
+		active: _,
+		initialFocus: "container",
+		restoreFocus: !0,
+		containerRef: T
+	}), j = s(() => {
+		_ && (v(!1), a?.());
+	}, [
+		v,
+		a,
+		_
+	]);
+	O({
+		active: _,
+		enabled: c,
+		onDismiss: j,
+		containerRef: A
+	});
+	let M = s(() => {
+		!_ || l || o && j();
+	}, [
+		_,
+		l,
+		o,
+		j
+	]);
+	return D([y.floating, y.reference], M), _ ? /* @__PURE__ */ r(m, { children: /* @__PURE__ */ i("div", {
+		id: w,
+		ref: E,
+		style: b,
+		className: t(N.popover, N[u]),
+		role: d,
+		"aria-label": p,
+		"aria-labelledby": h,
+		"aria-describedby": g,
+		tabIndex: -1,
+		children: [typeof n == "function" ? n({ setClose: j }) : n, /* @__PURE__ */ r(e, {
+			ref: C,
+			placement: S,
+			middlewareData: x
+		})]
+	}) }) : null;
+}
+//#endregion
+//#region src/popover/components/PopoverTrigger.tsx
+function L({ passive: e, children: t }) {
+	let { open: n, setOpen: r, refs: i, contentId: o } = F(), c = [t.props["aria-controls"], o].filter(Boolean).join(" "), l = s((n) => {
+		t.props.onClick && t.props.onClick(n), !n.defaultPrevented && (n.preventDefault(), n.stopPropagation(), !e && r((e) => !e));
+	}, [
+		t,
+		r,
+		e
+	]);
+	return a(t, {
+		ref: i.setReference,
+		"aria-expanded": n,
+		"aria-controls": c,
+		onClick: l
+	});
+}
+//#endregion
+//#region src/popover/components/Popover.tsx
+var R = 16;
+function z({ children: e, open: t, defaultOpen: n, onOpenChange: i, placement: a = "bottom" }) {
+	let [o, c] = p(n ?? !1), l = u(), d = t !== void 0, m = d ? t : o, x = s((e) => {
+		let t = typeof e == "function" ? e(m) : e;
+		d || c(t), i?.(t);
+	}, [
+		d,
+		i,
+		m
+	]), C = f(null), { refs: w, floatingStyles: T, middlewareData: E, placement: D } = S({
+		open: m,
+		onOpenChange: x,
+		placement: a,
+		middleware: [
+			v(8),
+			_({ padding: R }),
+			y({ padding: R }),
+			b({
+				padding: R,
+				apply({ availableWidth: e, availableHeight: t, elements: n }) {
+					M({
+						availableWidth: e,
+						availableHeight: t,
+						floating: n.floating
+					});
+				}
+			}),
+			h({ element: C.current })
+		],
+		whileElementsMounted: g
+	});
+	return /* @__PURE__ */ r(P.Provider, {
+		value: {
+			open: m,
+			setOpen: x,
+			refs: w,
+			floatingStyles: T,
+			placement: D,
+			middlewareData: E,
+			arrowRef: C,
+			contentId: l
+		},
+		children: e
+	});
+}
+z.Trigger = L, z.Content = I;
+var B = {
+	tooltipPanel: "sZ0x6w",
+	tooltip: "_538Ejd",
+	negative: "fqciCO",
+	information: "sHkUiQ",
+	error: "bpGNoX",
+	warning: "tYnRg-",
+	success: "_8lflEh"
+};
+//#endregion
+//#region src/popover/FloatingPopover.tsx
+function V({ content: a, children: o, openOnHover: s = !0, placement: c = "bottom", openDelay: l = 200, closeDelay: u = 100, maxWidth: m, state: b, tooltip: D, positionUpdateKey: O }) {
+	let [k, A] = p(!1), M = f(null), { refs: N, floatingStyles: P, middlewareData: F, context: I, placement: L, update: R } = S({
+		open: k,
+		onOpenChange: A,
+		placement: c,
+		middleware: [
+			v(8),
+			_({
+				fallbackAxisSideDirection: "end",
+				fallbackPlacements: [
+					"top",
+					"right",
+					"bottom"
+				]
+			}),
+			y({ padding: 8 }),
+			h({
+				element: M,
+				padding: 8
+			})
+		],
+		whileElementsMounted: g
+	});
+	d(() => {
+		k && R();
+	}, [
+		k,
+		O,
+		R
+	]);
+	let z = w(I, {
+		enabled: s,
+		move: !1,
+		delay: {
+			open: l,
+			close: u
+		}
+	}), V = C(I, { enabled: s }), H = x(I), U = E(I, { role: "tooltip" }), { getReferenceProps: W, getFloatingProps: G } = T([
+		z,
+		V,
+		H,
+		U
+	]);
+	return /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r("span", {
+		ref: N.setReference,
+		...W(),
+		style: { lineHeight: 1 },
+		children: o
+	}), k && j(/* @__PURE__ */ i("div", {
+		ref: N.setFloating,
+		style: {
+			...P,
+			zIndex: "var(--z-tooltip)",
+			maxWidth: m ? `${m}em` : void 0
+		},
+		...G(),
+		role: "tooltip",
+		className: t(B.tooltipPanel, D && B.tooltip, b && B[b]),
+		children: [a, /* @__PURE__ */ r(e, {
+			ref: M,
+			placement: L,
+			middlewareData: F
+		})]
+	}), document.body)] });
+}
+//#endregion
+//#region src/popover/FloatingTooltip.tsx
+function H({ x: t, y: n, children: a }) {
+	let o = f(null), { refs: s, floatingStyles: c, middlewareData: u, placement: d } = S({
+		strategy: "absolute",
+		placement: "top",
+		middleware: [
+			v(6),
+			_(),
+			y({ padding: 16 }),
+			h({ element: o })
+		]
+	});
+	return l(() => {
+		s.setReference && s.setReference({ getBoundingClientRect: () => ({
+			x: t,
+			y: n,
+			width: 0,
+			height: 0,
+			top: n,
+			left: t,
+			bottom: n,
+			right: t,
+			toJSON: () => {}
+		}) });
+	}, [
+		t,
+		n,
+		s
+	]), /* @__PURE__ */ i("div", {
+		ref: s.setFloating,
+		style: {
+			...c,
+			position: "absolute",
+			pointerEvents: "none"
+		},
+		role: "tooltip",
+		className: B.tooltip,
+		children: [a, /* @__PURE__ */ r(e, {
+			ref: o,
+			placement: d,
+			middlewareData: u
+		})]
+	});
+}
+//#endregion
+export { I as a, L as i, V as n, F as o, z as r, H as t };
+
+//# sourceMappingURL=popover-BJH-yHvb.js.map

package/dist/chunks/popover-BJH-yHvb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover-BJH-yHvb.js","names":[],"sources":["../../src/popover/lib/applyPopoverAvailableSize.ts","../../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":["type ApplyPopoverAvailableSizeOptions = {\n\treadonly availableWidth: number;\n\treadonly availableHeight: number;\n\treadonly floating: HTMLElement;\n};\n\n/**\n * Передаёт вычисленную Floating UI доступную область самому popover через CSS-переменные.\n * Потребитель может совместить эти границы со своим размером и режимом прокрутки,\n * не дублируя `size()` middleware и правила clipping context.\n */\nexport function applyPopoverAvailableSize({ availableWidth, availableHeight, floating }: ApplyPopoverAvailableSizeOptions) {\n\tfloating.style.setProperty(\"--popover-available-width\", `${Math.max(0, availableWidth)}px`);\n\tfloating.style.setProperty(\"--popover-available-height\", `${Math.max(0, availableHeight)}px`);\n}\n",".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 { useFloating, type Placement } 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\tcontentId: string;\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 type PopoverContentProps = Readonly<{\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\tPick<React.HTMLAttributes<HTMLDivElement>, \"role\" | \"aria-label\" | \"aria-labelledby\" | \"aria-describedby\">;\n\n/**\n * Содержимое немодального Popover, отображаемое в портале.\n * Компонент не навязывает ARIA-role: consumer задаёт семантику содержимого\n * явно и добавляет доступное имя для ролей, которым оно требуется.\n */\nexport function PopoverContent({\n\tchildren,\n\tonClose,\n\tcloseOnOutside = true,\n\tcloseOnEscape = true,\n\tdisableOutsideClick = false,\n\tbackground = \"secondary\",\n\trole,\n\t\"aria-label\": ariaLabel,\n\t\"aria-labelledby\": ariaLabelledBy,\n\t\"aria-describedby\": ariaDescribedBy\n}: PopoverContentProps) {\n\tconst { open, setOpen, refs, floatingStyles, middlewareData, placement, arrowRef, contentId } = 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\tid={contentId}\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={role}\n\t\t\t\taria-label={ariaLabel}\n\t\t\t\taria-labelledby={ariaLabelledBy}\n\t\t\t\taria-describedby={ariaDescribedBy}\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 function PopoverTrigger({ passive, children }: PopoverTriggerProps) {\n\tconst { open, setOpen, refs, contentId } = usePopoverContext();\n\tconst ariaControls = [children.props[\"aria-controls\"], contentId].filter(Boolean).join(\" \");\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\t\"aria-controls\": ariaControls,\n\t\tonClick: handleClick\n\t});\n}\n","import React, { useCallback, useId, useRef, useState } from \"react\";\n\nimport { arrow, autoUpdate, flip, offset, shift, size as floatingSize, useFloating, type Placement } from \"@floating-ui/react\";\n\nimport { applyPopoverAvailableSize } from \"../lib/applyPopoverAvailableSize\";\n\nimport { PopoverContent } from \"./PopoverContent\";\nimport { PopoverContext } from \"./PopoverContext\";\nimport { PopoverTrigger } from \"./PopoverTrigger\";\n\nconst POPOVER_VIEWPORT_PADDING = 16;\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 * сценариев с недоступным фоном следует использовать Dialog или Modal.\n */\nexport function Popover({ children, open: controlledOpen, defaultOpen, onOpenChange, placement = \"bottom\" }: PopoverProps) {\n\tconst [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen ?? false);\n\tconst contentId = useId();\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\tmiddleware: [\n\t\t\toffset(8),\n\t\t\tflip({ padding: POPOVER_VIEWPORT_PADDING }),\n\t\t\tshift({ padding: POPOVER_VIEWPORT_PADDING }),\n\t\t\tfloatingSize({\n\t\t\t\tpadding: POPOVER_VIEWPORT_PADDING,\n\t\t\t\tapply({ availableWidth, availableHeight, elements }) {\n\t\t\t\t\tapplyPopoverAvailableSize({ availableWidth, availableHeight, floating: elements.floating });\n\t\t\t\t}\n\t\t\t}),\n\t\t\t// eslint-disable-next-line react-hooks/refs\n\t\t\tarrow({ element: arrowRef.current })\n\t\t],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\treturn (\n\t\t<PopoverContext.Provider\n\t\t\tvalue={{ open, setOpen, refs, floatingStyles, placement: actualPlacement, middlewareData, arrowRef, contentId }}>\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 */\nPopover.Trigger = PopoverTrigger;\nPopover.Content = PopoverContent;\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-2);\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(--info-text);\n\n\t\tbackground-color: var(--info-text);\n\t\tborder-color: var(--info-text);\n\t\tcolor: var(--info-on-fill);\n\t}\n\n\t&.error {\n\t\t--border-1: var(--error-text);\n\n\t\tbackground-color: var(--error-text);\n\t\tborder-color: var(--error-text);\n\t\tcolor: var(--error-on-fill);\n\t}\n\n\t&.warning {\n\t\t--border-1: var(--warning-text);\n\n\t\tbackground-color: var(--warning-text);\n\t\tborder-color: var(--warning-text);\n\t\tcolor: var(--warning-on-fill);\n\t}\n\n\t&.success {\n\t\t--border-1: var(--success-text);\n\n\t\tbackground-color: var(--success-text);\n\t\tborder-color: var(--success-text);\n\t\tcolor: var(--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, { useLayoutEffect, useRef, useState } from \"react\";\n\nimport {\n\tarrow,\n\tautoUpdate,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tuseDismiss,\n\tuseFocus,\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\t/**\n\t * Изменяется вместе с CSS-координатой trigger, когда её изменение не отслеживается `autoUpdate`.\n\t * После commit React выполняется повторный расчёт позиции открытой floating-панели.\n\t */\n\tpositionUpdateKey?: unknown;\n}\n\nexport function FloatingPopover({\n\tcontent,\n\tchildren,\n\topenOnHover = true,\n\tplacement = \"bottom\",\n\topenDelay = 200,\n\tcloseDelay = 100,\n\tmaxWidth,\n\tstate,\n\ttooltip,\n\tpositionUpdateKey\n}: FloatingPopoverProps) {\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\tupdate\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: 8 }),\n\t\t\tarrow({ element: arrowRef, padding: 8 })\n\t\t],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\tuseLayoutEffect(() => {\n\t\tif (open) {\n\t\t\tvoid update();\n\t\t}\n\t}, [open, positionUpdateKey, update]);\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\t// Hover-подсказка обязана иметь ту же пассивную точку входа с клавиатуры.\n\t// Связываем focus с тем же флагом, чтобы `openOnHover={false}` не менял\n\t// управляемые сценарии, которые не запрашивали автоматическое открытие.\n\tconst focus = useFocus(context, { enabled: openOnHover });\n\tconst dismiss = useDismiss(context);\n\tconst role = useRole(context, { role: \"tooltip\" });\n\n\tconst { getReferenceProps, getFloatingProps } = useInteractions([hover, focus, 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 function FloatingTooltip({ x, y, children }: { x: number; y: number; children: React.ReactNode }) {\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\n\t\t\tref={refs.setFloating}\n\t\t\tstyle={{ ...floatingStyles, position: \"absolute\", pointerEvents: \"none\" }}\n\t\t\trole=\"tooltip\"\n\t\t\tclassName={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/radio-group-CW-K1n9c.js

@@ -0,0 +1,125 @@
+import { t as e } from "./ui.module-oRwY3Zli.js";
+import { cn as t, getRovingFocusTargetIndex as n, handleKeyboardActivation as r } from "@ryuzaki13/react-foundation-lib/utils";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { createContext as o, useCallback as s, useContext as c, useId as l, useLayoutEffect as u, useMemo as d, useState as f } from "react";
+var p = {
+	radioGroup: "nINbA6",
+	noWrap: "GL-UWx",
+	horizontal: "_6PeF-i",
+	vertical: "_5wP4aR",
+	radioItem: "S3MnZI",
+	checked: "KHJ0ja",
+	radioItemContent: "oGmcQH"
+}, m = o(null);
+function h({ value: n, onChange: r, label: o, description: c, disabled: u, className: h, noWrap: g, orientation: _ = "horizontal", "aria-label": v, children: y }) {
+	let b = l(), x = o ? `${b}-label` : void 0, S = c ? `${b}-description` : void 0, [C, w] = f([]), T = s((e) => r?.(e), [r]), E = s((e) => (w((t) => t.includes(e) ? t : [...t, e]), () => {
+		w((t) => t.filter((t) => t !== e));
+	}), []), D = d(() => ({
+		value: n,
+		onChange: T,
+		disabled: u,
+		orientation: _,
+		groupId: b,
+		labelId: x,
+		descriptionId: S,
+		firstOptionId: C[0],
+		registerOption: E
+	}), [
+		S,
+		u,
+		b,
+		T,
+		x,
+		_,
+		E,
+		C,
+		n
+	]);
+	return /* @__PURE__ */ a("div", {
+		className: t(e.uiElement, u && e.disabled, h),
+		children: [
+			o && /* @__PURE__ */ i("div", {
+				id: x,
+				className: e.uiLabel,
+				children: o
+			}),
+			c && /* @__PURE__ */ i("div", {
+				id: S,
+				className: e.uiDescription,
+				children: c
+			}),
+			/* @__PURE__ */ i(m.Provider, {
+				value: D,
+				children: /* @__PURE__ */ i("div", {
+					role: "radiogroup",
+					"aria-labelledby": x,
+					"aria-label": x ? void 0 : v,
+					"aria-describedby": S,
+					"aria-disabled": u || void 0,
+					"data-disabled": u || void 0,
+					className: t(e.uiInputControl, p.radioGroup, g && p.noWrap, p[_]),
+					children: y
+				})
+			})
+		]
+	});
+}
+function g({ value: e, label: o, description: s, className: d }) {
+	let f = c(m), h = l(), g = f?.registerOption;
+	if (u(() => {
+		if (g) return g(h);
+	}, [g, h]), !f) return /* @__PURE__ */ a("div", {
+		className: t(p.radioItem, d),
+		children: [/* @__PURE__ */ i("p", {
+			className: "textNoWrap",
+			children: o
+		}), s && /* @__PURE__ */ i("div", {
+			className: "fontSizeSm content2",
+			children: s
+		})]
+	});
+	let _ = Object.is(f.value, e), v = f.disabled === !0, y = f.value === void 0 && f.firstOptionId === h, b = () => {
+		v || _ || f.onChange?.(e);
+	};
+	return /* @__PURE__ */ i("button", {
+		id: `${f.groupId}-option-${h}`,
+		type: "button",
+		role: "radio",
+		"aria-checked": _,
+		disabled: v,
+		tabIndex: _ || y ? 0 : -1,
+		className: t(p.radioItem, _ && p.checked, d),
+		"data-ui": "radio-option",
+		"data-action": "select-radio-option",
+		onClick: b,
+		onKeyDown: (e) => {
+			if (v || r(e, b)) return;
+			let t = e.currentTarget, i = t.closest("[role=\"radiogroup\"]"), a = Array.from(i?.querySelectorAll("[role=\"radio\"]:not([disabled])") ?? []);
+			if (!a.length) return;
+			let o = a.indexOf(t);
+			if (o === -1) return;
+			let s = n({
+				currentIndex: o,
+				itemCount: a.length,
+				key: e.key,
+				orientation: f.orientation
+			});
+			s !== null && (e.preventDefault(), a[s]?.focus(), a[s]?.click());
+		},
+		children: /* @__PURE__ */ a("span", {
+			className: p.radioItemContent,
+			children: [/* @__PURE__ */ i("span", {
+				className: "textNoWrap",
+				children: o
+			}), s && /* @__PURE__ */ i("span", {
+				className: "fontSizeSm",
+				children: s
+			})]
+		})
+	});
+}
+h.Option = g;
+//#endregion
+export { h as n, g as t };
+
+//# sourceMappingURL=radio-group-CW-K1n9c.js.map

package/dist/chunks/{radio-group-sSnlYjAX.js.map → radio-group-CW-K1n9c.js.map}

@@ -1 +1 @@
-{"version":3,"file":"radio-group-sSnlYjAX.js","names":[],"sources":["../../src/radio-group/RadioGroup.module.scss","../../src/radio-group/RadioGroup.tsx"],"sourcesContent":[".radioGroup {\n\tdisplay: flex;\n\talign-content: flex-start;\n\tflex-wrap: wrap;\n\t// min-height: var(--control-height);\n\theight: auto;\n\n\t&.noWrap {\n\t\tflex-wrap: nowrap;\n\t}\n\n\t&.horizontal {\n\t\tflex-direction: row;\n\t}\n\n\t&.vertical {\n\t\tflex-direction: column;\n\t\talign-content: stretch;\n\t}\n}\n\n.radioItem {\n\tflex: 1 0 0%;\n\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n\n\tcolor: var(--content-2);\n\t// border: var(--border-width) solid transparent;\n\tborder-radius: var(--radius-xs);\n\tpadding: 0 var(--space-md);\n\tmargin: var(--border-width);\n\t// baseInputControl = --control-height, + borderTop/Bottom + transparentLineTop/Bottom\n\tmin-height: calc(var(--control-height) - calc(var(--border-width) * 4));\n\n\tcursor: pointer;\n\n\t&:hover {\n\t\tcolor: var(--content-1);\n\t\tbackground-color: var(--surface-2);\n\t\t// border-color: var(--border-1);\n\t}\n\n\t&.checked {\n\t\tcolor: var(--brand-on-fill);\n\t\tbackground-color: var(--brand-fill);\n\t\t// border-color: var(--border-0);\n\t}\n\n\t&:disabled {\n\t\topacity: var(--disabled-opacity);\n\t}\n}\n\n.radioItemContent {\n\tflex: 1 0 0%;\n\n\tdisplay: grid;\n\talign-content: center;\n\tgap: var(--space-sm);\n}\n\n// .radioItemIcon {\n// \tflex: 0 0 0%;\n\n// \tsvg {\n// \t\twidth: 1em;\n// \t\theight: 1em;\n// \t}\n// }\n","import React, { createContext, KeyboardEvent, ReactNode, useCallback, useContext, useId, useLayoutEffect, useMemo, useState } from \"react\";\n\nimport { cn, getRovingFocusTargetIndex, handleKeyboardActivation } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./RadioGroup.module.scss\";\n\ninterface RadioGroupContextValue {\n\tvalue?: unknown;\n\tonChange?: (value: unknown) => void;\n\tdisabled?: boolean;\n\torientation: \"vertical\" | \"horizontal\";\n\tgroupId: string;\n\tlabelId?: string;\n\tdescriptionId?: string;\n\tfirstOptionId?: string;\n\tregisterOption: (optionId: string) => () => void;\n}\n\nconst RadioGroupContext = createContext<RadioGroupContextValue | null>(null);\n\ninterface RadioGroupProps<T> {\n\tvalue?: T;\n\tonChange?: (value: T) => void;\n\tlabel?: string;\n\tdescription?: string;\n\tdisabled?: boolean;\n\tclassName?: string;\n\tnoWrap?: true;\n\torientation?: \"vertical\" | \"horizontal\";\n\t\"aria-label\"?: string;\n\tchildren: React.ReactNode;\n}\n\n/**\n * Группа радиокнопок с общим состоянием выбранного значения. Обеспечивает единый API выбора и контекст для дочерних опций.\n */\nexport function RadioGroup<T>({\n\tvalue,\n\tonChange,\n\tlabel,\n\tdescription,\n\tdisabled,\n\tclassName,\n\tnoWrap,\n\torientation = \"horizontal\",\n\t\"aria-label\": ariaLabel,\n\tchildren\n}: RadioGroupProps<T>) {\n\tconst groupId = useId();\n\tconst labelId = label ? `${groupId}-label` : undefined;\n\tconst descriptionId = description ? `${groupId}-description` : undefined;\n\tconst [registeredOptionIds, setRegisteredOptionIds] = useState<string[]>([]);\n\tconst handleChange = useCallback((nextValue: unknown) => onChange?.(nextValue as T), [onChange]);\n\n\t/**\n\t * Хранит порядок опций внутри группы, чтобы при отсутствии выбранного значения\n\t * оставлять ровно один tab stop на первой доступной радиокнопке.\n\t */\n\tconst registerOption = useCallback((optionId: string) => {\n\t\tsetRegisteredOptionIds((currentIds) => (currentIds.includes(optionId) ? currentIds : [...currentIds, optionId]));\n\n\t\treturn () => {\n\t\t\tsetRegisteredOptionIds((currentIds) => currentIds.filter((currentId) => currentId !== optionId));\n\t\t};\n\t}, []);\n\n\tconst contextValue = useMemo(\n\t\t() => ({\n\t\t\tvalue,\n\t\t\tonChange: handleChange,\n\t\t\tdisabled,\n\t\t\torientation,\n\t\t\tgroupId,\n\t\t\tlabelId,\n\t\t\tdescriptionId,\n\t\t\tfirstOptionId: registeredOptionIds[0],\n\t\t\tregisterOption\n\t\t}),\n\t\t[descriptionId, disabled, groupId, handleChange, labelId, orientation, registerOption, registeredOptionIds, value]\n\t);\n\n\treturn (\n\t\t<div className={cn(uiStyles.uiElement, disabled && uiStyles.disabled, className)}>\n\t\t\t{label && (\n\t\t\t\t<div id={labelId} className={uiStyles.uiLabel}>\n\t\t\t\t\t{label}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{description && (\n\t\t\t\t<div id={descriptionId} className={uiStyles.uiDescription}>\n\t\t\t\t\t{description}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<RadioGroupContext.Provider value={contextValue}>\n\t\t\t\t<div\n\t\t\t\t\trole=\"radiogroup\"\n\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\taria-label={labelId ? undefined : ariaLabel}\n\t\t\t\t\taria-describedby={descriptionId}\n\t\t\t\t\taria-disabled={disabled || undefined}\n\t\t\t\t\tdata-disabled={disabled || undefined}\n\t\t\t\t\tclassName={cn(uiStyles.uiInputControl, styles.radioGroup, noWrap && styles.noWrap, styles[orientation])}>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</RadioGroupContext.Provider>\n\t\t</div>\n\t);\n}\n\ninterface OptionProps<T> {\n\tvalue: T;\n\tlabel: ReactNode;\n\tdescription?: ReactNode;\n\tclassName?: string;\n}\n\n/**\n * Опция внутри `RadioGroup`, представляющая одно выбираемое значение. Отрисовывает подпись, описание и состояние выбора.\n */\nexport function Option<T>({ value, label, description, className }: OptionProps<T>) {\n\tconst context = useContext(RadioGroupContext);\n\tconst optionId = useId();\n\tconst registerOption = context?.registerOption;\n\n\tuseLayoutEffect(() => {\n\t\tif (!registerOption) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn registerOption(optionId);\n\t}, [registerOption, optionId]);\n\n\tif (!context) {\n\t\treturn (\n\t\t\t<div className={cn(styles.radioItem, className)}>\n\t\t\t\t<p className=\"textNoWrap\">{label}</p>\n\t\t\t\t{description && <div className=\"fontSizeSm content2\">{description}</div>}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tconst isChecked = Object.is(context.value, value);\n\tconst isDisabled = context.disabled === true;\n\tconst isFallbackTabStop = context.value === undefined && context.firstOptionId === optionId;\n\n\tconst handleChange = () => {\n\t\tif (isDisabled || isChecked) {\n\t\t\treturn;\n\t\t}\n\n\t\tcontext.onChange?.(value);\n\t};\n\n\t// TODO: логика переиспользуемая, надо вынести в хук\n\tconst handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n\t\tif (isDisabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (handleKeyboardActivation(event, handleChange)) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentTarget = event.currentTarget;\n\t\tconst groupElement = currentTarget.closest<HTMLElement>('[role=\"radiogroup\"]');\n\t\tconst radioItems = Array.from(groupElement?.querySelectorAll<HTMLButtonElement>('[role=\"radio\"]:not([disabled])') ?? []);\n\n\t\tif (!radioItems.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentIndex = radioItems.indexOf(currentTarget);\n\t\tif (currentIndex === -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst nextIndex = getRovingFocusTargetIndex({\n\t\t\tcurrentIndex,\n\t\t\titemCount: radioItems.length,\n\t\t\tkey: event.key,\n\t\t\torientation: context.orientation\n\t\t});\n\n\t\tif (nextIndex === null) {\n\t\t\treturn;\n\t\t}\n\n\t\tevent.preventDefault();\n\t\tradioItems[nextIndex]?.focus();\n\t\tradioItems[nextIndex]?.click();\n\t};\n\n\treturn (\n\t\t<button\n\t\t\tid={`${context.groupId}-option-${optionId}`}\n\t\t\ttype=\"button\"\n\t\t\trole=\"radio\"\n\t\t\taria-checked={isChecked}\n\t\t\tdisabled={isDisabled}\n\t\t\ttabIndex={isChecked || isFallbackTabStop ? 0 : -1}\n\t\t\tclassName={cn(styles.radioItem, isChecked && styles.checked, className)}\n\t\t\tdata-ui=\"radio-option\"\n\t\t\tdata-action=\"select-radio-option\"\n\t\t\tonClick={handleChange}\n\t\t\tonKeyDown={handleKeyDown}>\n\t\t\t<span className={styles.radioItemContent}>\n\t\t\t\t<span className=\"textNoWrap\">{label}</span>\n\t\t\t\t{description && <span className=\"fontSizeSm\">{description}</span>}\n\t\t\t</span>\n\t\t\t{/* <span className={styles.radioItemIcon}>\n\t\t\t\t<CheckCircleIcon style={{ display: \"block\", visibility: isChecked ? \"visible\" : \"hidden\" }} />\n\t\t\t</span> */}\n\t\t</button>\n\t);\n}\n\nRadioGroup.Option = Option;\n"],"mappings":"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"}
+{"version":3,"file":"radio-group-CW-K1n9c.js","names":[],"sources":["../../src/radio-group/RadioGroup.module.scss","../../src/radio-group/RadioGroup.tsx"],"sourcesContent":[".radioGroup {\n\tdisplay: flex;\n\talign-content: flex-start;\n\tflex-wrap: wrap;\n\t// min-height: var(--control-height);\n\theight: auto;\n\n\t&.noWrap {\n\t\tflex-wrap: nowrap;\n\t}\n\n\t&.horizontal {\n\t\tflex-direction: row;\n\t}\n\n\t&.vertical {\n\t\tflex-direction: column;\n\t\talign-content: stretch;\n\t}\n}\n\n.radioItem {\n\tflex: 1 0 0%;\n\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n\n\tcolor: var(--content-2);\n\t// border: var(--border-width) solid transparent;\n\tborder-radius: var(--radius-xs);\n\tpadding: 0 var(--space-md);\n\tmargin: var(--border-width);\n\t// baseInputControl = --control-height, + borderTop/Bottom + transparentLineTop/Bottom\n\tmin-height: calc(var(--control-height) - calc(var(--border-width) * 4));\n\n\tcursor: pointer;\n\n\t&:hover {\n\t\tcolor: var(--content-1);\n\t\tbackground-color: var(--surface-2);\n\t\t// border-color: var(--border-1);\n\t}\n\n\t&.checked {\n\t\tcolor: var(--brand-on-fill);\n\t\tbackground-color: var(--brand-fill);\n\t\t// border-color: var(--border-0);\n\t}\n\n\t&:disabled {\n\t\topacity: var(--disabled-opacity);\n\t}\n}\n\n.radioItemContent {\n\tflex: 1 0 0%;\n\n\tdisplay: grid;\n\talign-content: center;\n\tgap: var(--space-sm);\n}\n\n// .radioItemIcon {\n// \tflex: 0 0 0%;\n\n// \tsvg {\n// \t\twidth: 1em;\n// \t\theight: 1em;\n// \t}\n// }\n","import React, { createContext, KeyboardEvent, ReactNode, useCallback, useContext, useId, useLayoutEffect, useMemo, useState } from \"react\";\n\nimport { cn, getRovingFocusTargetIndex, handleKeyboardActivation } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./RadioGroup.module.scss\";\n\ninterface RadioGroupContextValue {\n\tvalue?: unknown;\n\tonChange?: (value: unknown) => void;\n\tdisabled?: boolean;\n\torientation: \"vertical\" | \"horizontal\";\n\tgroupId: string;\n\tlabelId?: string;\n\tdescriptionId?: string;\n\tfirstOptionId?: string;\n\tregisterOption: (optionId: string) => () => void;\n}\n\nconst RadioGroupContext = createContext<RadioGroupContextValue | null>(null);\n\ninterface RadioGroupProps<T> {\n\tvalue?: T;\n\tonChange?: (value: T) => void;\n\tlabel?: string;\n\tdescription?: string;\n\tdisabled?: boolean;\n\tclassName?: string;\n\tnoWrap?: true;\n\torientation?: \"vertical\" | \"horizontal\";\n\t\"aria-label\"?: string;\n\tchildren: React.ReactNode;\n}\n\n/**\n * Группа радиокнопок с общим состоянием выбранного значения. Обеспечивает единый API выбора и контекст для дочерних опций.\n */\nexport function RadioGroup<T>({\n\tvalue,\n\tonChange,\n\tlabel,\n\tdescription,\n\tdisabled,\n\tclassName,\n\tnoWrap,\n\torientation = \"horizontal\",\n\t\"aria-label\": ariaLabel,\n\tchildren\n}: RadioGroupProps<T>) {\n\tconst groupId = useId();\n\tconst labelId = label ? `${groupId}-label` : undefined;\n\tconst descriptionId = description ? `${groupId}-description` : undefined;\n\tconst [registeredOptionIds, setRegisteredOptionIds] = useState<string[]>([]);\n\tconst handleChange = useCallback((nextValue: unknown) => onChange?.(nextValue as T), [onChange]);\n\n\t/**\n\t * Хранит порядок опций внутри группы, чтобы при отсутствии выбранного значения\n\t * оставлять ровно один tab stop на первой доступной радиокнопке.\n\t */\n\tconst registerOption = useCallback((optionId: string) => {\n\t\tsetRegisteredOptionIds((currentIds) => (currentIds.includes(optionId) ? currentIds : [...currentIds, optionId]));\n\n\t\treturn () => {\n\t\t\tsetRegisteredOptionIds((currentIds) => currentIds.filter((currentId) => currentId !== optionId));\n\t\t};\n\t}, []);\n\n\tconst contextValue = useMemo(\n\t\t() => ({\n\t\t\tvalue,\n\t\t\tonChange: handleChange,\n\t\t\tdisabled,\n\t\t\torientation,\n\t\t\tgroupId,\n\t\t\tlabelId,\n\t\t\tdescriptionId,\n\t\t\tfirstOptionId: registeredOptionIds[0],\n\t\t\tregisterOption\n\t\t}),\n\t\t[descriptionId, disabled, groupId, handleChange, labelId, orientation, registerOption, registeredOptionIds, value]\n\t);\n\n\treturn (\n\t\t<div className={cn(uiStyles.uiElement, disabled && uiStyles.disabled, className)}>\n\t\t\t{label && (\n\t\t\t\t<div id={labelId} className={uiStyles.uiLabel}>\n\t\t\t\t\t{label}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{description && (\n\t\t\t\t<div id={descriptionId} className={uiStyles.uiDescription}>\n\t\t\t\t\t{description}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<RadioGroupContext.Provider value={contextValue}>\n\t\t\t\t<div\n\t\t\t\t\trole=\"radiogroup\"\n\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\taria-label={labelId ? undefined : ariaLabel}\n\t\t\t\t\taria-describedby={descriptionId}\n\t\t\t\t\taria-disabled={disabled || undefined}\n\t\t\t\t\tdata-disabled={disabled || undefined}\n\t\t\t\t\tclassName={cn(uiStyles.uiInputControl, styles.radioGroup, noWrap && styles.noWrap, styles[orientation])}>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</RadioGroupContext.Provider>\n\t\t</div>\n\t);\n}\n\ninterface OptionProps<T> {\n\tvalue: T;\n\tlabel: ReactNode;\n\tdescription?: ReactNode;\n\tclassName?: string;\n}\n\n/**\n * Опция внутри `RadioGroup`, представляющая одно выбираемое значение. Отрисовывает подпись, описание и состояние выбора.\n */\nexport function Option<T>({ value, label, description, className }: OptionProps<T>) {\n\tconst context = useContext(RadioGroupContext);\n\tconst optionId = useId();\n\tconst registerOption = context?.registerOption;\n\n\tuseLayoutEffect(() => {\n\t\tif (!registerOption) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn registerOption(optionId);\n\t}, [registerOption, optionId]);\n\n\tif (!context) {\n\t\treturn (\n\t\t\t<div className={cn(styles.radioItem, className)}>\n\t\t\t\t<p className=\"textNoWrap\">{label}</p>\n\t\t\t\t{description && <div className=\"fontSizeSm content2\">{description}</div>}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tconst isChecked = Object.is(context.value, value);\n\tconst isDisabled = context.disabled === true;\n\tconst isFallbackTabStop = context.value === undefined && context.firstOptionId === optionId;\n\n\tconst handleChange = () => {\n\t\tif (isDisabled || isChecked) {\n\t\t\treturn;\n\t\t}\n\n\t\tcontext.onChange?.(value);\n\t};\n\n\t// TODO: логика переиспользуемая, надо вынести в хук\n\tconst handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n\t\tif (isDisabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (handleKeyboardActivation(event, handleChange)) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentTarget = event.currentTarget;\n\t\tconst groupElement = currentTarget.closest<HTMLElement>('[role=\"radiogroup\"]');\n\t\tconst radioItems = Array.from(groupElement?.querySelectorAll<HTMLButtonElement>('[role=\"radio\"]:not([disabled])') ?? []);\n\n\t\tif (!radioItems.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentIndex = radioItems.indexOf(currentTarget);\n\t\tif (currentIndex === -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst nextIndex = getRovingFocusTargetIndex({\n\t\t\tcurrentIndex,\n\t\t\titemCount: radioItems.length,\n\t\t\tkey: event.key,\n\t\t\torientation: context.orientation\n\t\t});\n\n\t\tif (nextIndex === null) {\n\t\t\treturn;\n\t\t}\n\n\t\tevent.preventDefault();\n\t\tradioItems[nextIndex]?.focus();\n\t\tradioItems[nextIndex]?.click();\n\t};\n\n\treturn (\n\t\t<button\n\t\t\tid={`${context.groupId}-option-${optionId}`}\n\t\t\ttype=\"button\"\n\t\t\trole=\"radio\"\n\t\t\taria-checked={isChecked}\n\t\t\tdisabled={isDisabled}\n\t\t\ttabIndex={isChecked || isFallbackTabStop ? 0 : -1}\n\t\t\tclassName={cn(styles.radioItem, isChecked && styles.checked, className)}\n\t\t\tdata-ui=\"radio-option\"\n\t\t\tdata-action=\"select-radio-option\"\n\t\t\tonClick={handleChange}\n\t\t\tonKeyDown={handleKeyDown}>\n\t\t\t<span className={styles.radioItemContent}>\n\t\t\t\t<span className=\"textNoWrap\">{label}</span>\n\t\t\t\t{description && <span className=\"fontSizeSm\">{description}</span>}\n\t\t\t</span>\n\t\t\t{/* <span className={styles.radioItemIcon}>\n\t\t\t\t<CheckCircleIcon style={{ display: \"block\", visibility: isChecked ? \"visible\" : \"hidden\" }} />\n\t\t\t</span> */}\n\t\t</button>\n\t);\n}\n\nRadioGroup.Option = Option;\n"],"mappings":"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"}