@ryuzaki13/react-foundation-ui 1.0.0 → 1.0.2

package/dist/chunks/DropdownMenu-DQeR3y7M.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownMenu-DQeR3y7M.js","names":[],"sources":["../../src/context-menu/components/helpers.ts","../../src/context-menu/components/MenuContext.tsx","../../src/context-menu/components/ContextMenuTrigger.tsx","../../src/context-menu/ContextMenu.module.scss","../../src/context-menu/components/MenuContent.tsx","../../src/context-menu/components/MenuGroupLabel.tsx","../../src/context-menu/components/MenuItem.tsx","../../src/context-menu/components/MenuRoot.tsx","../../src/context-menu/components/MenuSeparator.tsx","../../src/context-menu/components/RadialMenuContent.tsx","../../src/context-menu/components/RadialMenuItem.tsx","../../src/context-menu/components/ContextMenu.tsx","../../src/context-menu/components/DropdownMenuTrigger.tsx","../../src/context-menu/components/DropdownMenu.tsx"],"sourcesContent":["import React from \"react\";\n\nexport function assignRef<T>(ref: React.Ref<T> | undefined, value: T) {\n\tif (!ref) return;\n\n\tif (typeof ref === \"function\") {\n\t\tref(value);\n\t\treturn;\n\t}\n\n\t(ref as React.MutableRefObject<T>).current = value;\n}\n\nexport function composeMouseHandlers<T extends HTMLElement>(\n\tuserHandler: ((event: React.MouseEvent<T>) => void) | undefined,\n\tlibraryHandler: (event: React.MouseEvent<T>) => void\n) {\n\treturn (event: React.MouseEvent<T>) => {\n\t\tuserHandler?.(event);\n\t\tif (event.defaultPrevented) return;\n\t\tlibraryHandler(event);\n\t};\n}\n\nexport function composeKeyboardHandlers<T extends HTMLElement>(\n\tuserHandler: ((event: React.KeyboardEvent<T>) => void) | undefined,\n\tlibraryHandler: (event: React.KeyboardEvent<T>) => void\n) {\n\treturn (event: React.KeyboardEvent<T>) => {\n\t\tuserHandler?.(event);\n\t\tif (event.defaultPrevented) return;\n\t\tlibraryHandler(event);\n\t};\n}\n","import { createContext, useContext } from \"react\";\n\nimport { createMissingContextError } from \"@ryuzaki13/react-foundation-lib/error\";\n\nimport type { MenuOpenSource, MenuPoint } from \"@ryuzaki13/react-foundation-lib/context-menu\";\n\nexport type MenuTriggerMode = \"click\" | \"contextmenu\";\n\ninterface MenuContextValue {\n\tmode: MenuTriggerMode;\n\topen: boolean;\n\topenSource: MenuOpenSource | null;\n\tanchorPoint: MenuPoint | null;\n\tfloatingStyles: React.CSSProperties;\n\tfloatingRef: React.RefObject<HTMLElement | null>;\n\ttriggerRef: React.RefObject<HTMLElement | null>;\n\tsetFloating: (node: HTMLElement | null) => void;\n\tregisterTriggerElement: (node: HTMLElement | null) => void;\n\tonTriggerClick: (event: React.MouseEvent<HTMLElement>) => void;\n\tonTriggerContextMenu: (event: React.MouseEvent<HTMLElement>) => void;\n\tonTriggerKeyDown: (event: React.KeyboardEvent<HTMLElement>) => void;\n\tcloseMenu: () => void;\n}\n\nexport const MenuContext = createContext<MenuContextValue | null>(null);\n\nexport function useMenuContext() {\n\tconst context = useContext(MenuContext);\n\tif (!context) {\n\t\tthrow createMissingContextError({\n\t\t\thookName: \"useMenuContext\",\n\t\t\tproviderName: \"MenuRoot\"\n\t\t});\n\t}\n\treturn context;\n}\n","import React, { cloneElement } from \"react\";\n\nimport { assignRef, composeKeyboardHandlers, composeMouseHandlers } from \"./helpers\";\nimport { useMenuContext } from \"./MenuContext\";\n\nexport interface ContextMenuTriggerProps {\n\tchildren: React.ReactElement<React.HTMLAttributes<HTMLElement> & { ref?: React.Ref<HTMLElement> }>;\n}\n\nexport const ContextMenuTrigger: React.FC<ContextMenuTriggerProps> = ({ children }) => {\n\tconst { mode, open, registerTriggerElement, onTriggerContextMenu, onTriggerKeyDown } = useMenuContext();\n\n\tif (mode !== \"contextmenu\") {\n\t\tthrow new Error(\"ContextMenu.Trigger must be used within <ContextMenu>\");\n\t}\n\n\treturn cloneElement(children, {\n\t\tref: (node: HTMLElement | null) => {\n\t\t\tconst childRef = (children.props as { ref?: React.Ref<HTMLElement> }).ref;\n\t\t\tassignRef(childRef, node);\n\t\t\tregisterTriggerElement(node);\n\t\t},\n\t\t\"aria-haspopup\": \"menu\",\n\t\t\"aria-expanded\": open,\n\t\tonContextMenu: composeMouseHandlers(children.props.onContextMenu, onTriggerContextMenu),\n\t\tonKeyDown: composeKeyboardHandlers(children.props.onKeyDown, onTriggerKeyDown)\n\t});\n};\n","@use \"@/styles/mixins\" as *;\n\n.menuPanel {\n\t--menu-max-height: min(22em, calc(100dvh - var(--space-xl)));\n\t--menu-min-width: 13em;\n\t--menu-max-width: min(22em, calc(100dvw - var(--space-xl)));\n\n\tmin-width: var(--menu-min-width);\n\tmax-width: var(--menu-max-width);\n\tpadding: var(--space-xs);\n\n\tbackground-color: var(--surface-0);\n\tborder: var(--border);\n\tborder-radius: var(--radius-sm);\n\tbox-shadow: var(--shadow-md);\n\n\tz-index: var(--z-dropdown);\n\toutline: none;\n}\n\n.menuScroller {\n\tmax-height: var(--menu-max-height);\n\toverflow: auto;\n}\n\n.menuItem {\n\tgap: var(--space-sm);\n}\n\n.menuItemIcon {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.menuItemText {\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.menuItemHotKey {\n\tfont-size: var(--font-size-sm);\n}\n\n.radialPanel {\n\tposition: fixed;\n\twidth: var(--radial-panel-size);\n\theight: var(--radial-panel-size);\n\tz-index: var(--z-context-menu, var(--z-dropdown));\n\toutline: none;\n\tpointer-events: none;\n}\n\n.radialRing {\n\tposition: absolute;\n\tinset: calc(var(--radial-item-size) / 2);\n\tborder: var(--border);\n\tborder-radius: 50%;\n\tbackground:\n\t\tradial-gradient(circle, color-mix(in srgb, var(--surface-0) 96%, transparent) 0 36%, transparent 37%),\n\t\tcolor-mix(in srgb, var(--surface-0) 88%, transparent);\n\tbox-shadow: var(--shadow-md);\n\tpointer-events: none;\n}\n\n.radialCenterButton {\n\tposition: absolute;\n\tleft: 50%;\n\ttop: 50%;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: calc(var(--radial-item-size) * 0.72);\n\theight: calc(var(--radial-item-size) * 0.72);\n\tpadding: var(--space-xxs);\n\ttransform: translate(-50%, -50%);\n\tborder: var(--border);\n\tborder-radius: 50%;\n\tbackground-color: var(--surface-0);\n\tcolor: var(--content-0);\n\tbox-shadow: var(--shadow-sm);\n\tpointer-events: auto;\n\ttransition:\n\t\tbackground-color var(--transition-fast) ease,\n\t\tborder-color var(--transition-fast) ease,\n\t\tcolor var(--transition-fast) ease,\n\t\ttransform var(--transition-fast) ease;\n\n\t&:focus {\n\t\tbackground-color: var(--surface-1);\n\t\tborder-color: var(--border-1);\n\t}\n\n\t@include hover(true) {\n\t\tbackground-color: var(--surface-accent);\n\t\tcolor: var(--content-accent);\n\t\tcursor: pointer;\n\t\ttransform: translate(-50%, -50%) scale(1.06);\n\t}\n}\n\n.radialCenterButtonText {\n\tmax-width: 100%;\n\toverflow: hidden;\n\ttext-align: center;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tfont-size: var(--font-size-sm);\n\tline-height: 1.1;\n}\n\n.radialItems {\n\tposition: absolute;\n\tinset: 0;\n\tpointer-events: none;\n}\n\n.radialItemSlot {\n\tposition: absolute;\n\tleft: 50%;\n\ttop: 50%;\n\twidth: var(--radial-item-size);\n\theight: var(--radial-item-size);\n\ttransform: rotate(var(--radial-item-angle)) translate(var(--radial-radius)) rotate(calc(var(--radial-item-angle) * -1))\n\t\ttranslate(-50%, -50%);\n\tpointer-events: none;\n}\n\n.radialItem {\n\tdisplay: grid;\n\tgrid-template-rows: 1fr auto;\n\talign-items: center;\n\tjustify-items: center;\n\tgap: 0.15rem;\n\twidth: 100%;\n\theight: 100%;\n\tpadding: var(--space-xs);\n\tborder: var(--border);\n\tborder-radius: 50%;\n\tbackground-color: var(--surface-0);\n\tcolor: var(--content-0);\n\tbox-shadow: var(--shadow-sm);\n\tpointer-events: auto;\n\ttransition:\n\t\tbackground-color var(--transition-fast) ease,\n\t\tborder-color var(--transition-fast) ease,\n\t\tcolor var(--transition-fast) ease,\n\t\ttransform var(--transition-fast) ease;\n\n\t&:focus {\n\t\tbackground-color: var(--surface-1);\n\t\tborder-color: var(--border-1);\n\t}\n\n\t&:disabled,\n\t&[aria-disabled=\"true\"] {\n\t\tcursor: default;\n\t\tcolor: var(--content-2);\n\t\topacity: 0.52;\n\t\tpointer-events: none;\n\t}\n\n\t@include hover(true) {\n\t\tbackground-color: var(--surface-accent);\n\t\tcolor: var(--content-accent);\n\t\tcursor: pointer;\n\t\ttransform: scale(1.06);\n\t}\n}\n\n.radialItemIcon {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmin-width: var(--space-md);\n\tmin-height: var(--space-md);\n\n\t> svg {\n\t\twidth: var(--space-md);\n\t\theight: var(--space-md);\n\t}\n}\n\n.radialItemText {\n\tmax-width: 100%;\n\toverflow: hidden;\n\ttext-align: center;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tfont-size: var(--font-size-sm);\n}\n","import React, { useCallback } from \"react\";\n\nimport { useClickOutside, useEscapeDismiss, useOverlayFocus } from \"@ryuzaki13/react-foundation-lib/dom\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { createPortal } from \"react-dom\";\n\nimport styles from \"../ContextMenu.module.scss\";\n\nimport { useMenuContext } from \"./MenuContext\";\n\nexport interface MenuContentProps {\n\tchildren: React.ReactNode | ((ctx: { closeMenu: () => void }) => React.ReactNode);\n\tclassName?: string;\n\tcloseOnOutside?: boolean;\n\tcloseOnEscape?: boolean;\n\tdisableOutsideClick?: boolean;\n\trestoreFocus?: boolean;\n}\n\nexport const MenuContent: React.FC<MenuContentProps> = ({\n\tchildren,\n\tclassName,\n\tcloseOnOutside = true,\n\tcloseOnEscape = true,\n\tdisableOutsideClick = false,\n\trestoreFocus = true\n}) => {\n\tconst { open, floatingStyles, floatingRef, triggerRef, setFloating, closeMenu } = useMenuContext();\n\n\tconst getNavigableItems = useCallback(() => {\n\t\tconst floatingElement = floatingRef.current;\n\t\tif (!floatingElement) return [];\n\n\t\treturn Array.from(floatingElement.querySelectorAll<HTMLElement>('[data-menu-item=\"true\"]:not([data-disabled=\"true\"])'));\n\t}, [floatingRef]);\n\n\tuseOverlayFocus<HTMLElement>({\n\t\tactive: open,\n\t\tinitialFocus: (container) => getNavigableItems()[0] ?? container,\n\t\trestoreFocus,\n\t\trestoreFocusTarget: () => triggerRef.current,\n\t\tcontainerRef: floatingRef\n\t});\n\n\tuseEscapeDismiss({\n\t\tactive: open,\n\t\tenabled: closeOnEscape,\n\t\tonDismiss: closeMenu,\n\t\tcontainerRef: floatingRef\n\t});\n\n\tconst outsideClose = useCallback(() => {\n\t\tif (!open || disableOutsideClick) return;\n\t\tif (closeOnOutside) {\n\t\t\tcloseMenu();\n\t\t}\n\t}, [open, disableOutsideClick, closeOnOutside, closeMenu]);\n\n\tuseClickOutside([floatingRef as React.RefObject<HTMLElement>, triggerRef as React.RefObject<HTMLElement>], outsideClose);\n\n\tconst onMenuKeyDown = useCallback(\n\t\t(event: React.KeyboardEvent<HTMLElement>) => {\n\t\t\tconst items = getNavigableItems();\n\t\t\tif (items.length === 0) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst activeElement = document.activeElement as HTMLElement | null;\n\t\t\tconst currentIndex = activeElement ? items.indexOf(activeElement) : -1;\n\n\t\t\tif (event.key === \"ArrowDown\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst nextIndex = currentIndex >= 0 ? (currentIndex + 1) % items.length : 0;\n\t\t\t\titems[nextIndex]?.focus();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === \"ArrowUp\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst nextIndex = currentIndex >= 0 ? (currentIndex - 1 + items.length) % items.length : items.length - 1;\n\t\t\t\titems[nextIndex]?.focus();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === \"Home\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\titems[0]?.focus();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === \"End\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\titems[items.length - 1]?.focus();\n\t\t\t}\n\t\t},\n\t\t[getNavigableItems]\n\t);\n\n\tif (typeof document === \"undefined\") return null;\n\n\treturn createPortal(\n\t\t<AnimatePresence>\n\t\t\t{open && (\n\t\t\t\t<motion.div\n\t\t\t\t\tref={setFloating}\n\t\t\t\t\tstyle={floatingStyles}\n\t\t\t\t\trole=\"menu\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\tclassName={cn(styles.menuPanel, className)}\n\t\t\t\t\tonKeyDown={onMenuKeyDown}\n\t\t\t\t\tinitial={{ opacity: 0, scale: 0.96, y: -2 }}\n\t\t\t\t\tanimate={{ opacity: 1, scale: 1, y: 0 }}\n\t\t\t\t\texit={{ opacity: 0, scale: 0.96, y: -2 }}\n\t\t\t\t\ttransition={{ duration: 0.14, ease: \"easeOut\" }}>\n\t\t\t\t\t<div className={cn(styles.menuScroller, \"scrollable\")}>\n\t\t\t\t\t\t{typeof children === \"function\" ? children({ closeMenu }) : children}\n\t\t\t\t\t</div>\n\t\t\t\t</motion.div>\n\t\t\t)}\n\t\t</AnimatePresence>,\n\t\tdocument.body\n\t);\n};\n","import React from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport uiStyles from \"../../ui.module.scss\";\n\nexport interface MenuGroupLabelProps {\n\tchildren: React.ReactNode;\n\tclassName?: string;\n}\n\nexport const MenuGroupLabel: React.FC<MenuGroupLabelProps> = ({ children, className }) => {\n\treturn <div className={cn(uiStyles.uiPopupGroupLabel, className)}>{children}</div>;\n};\n","import React, { useCallback } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport uiStyles from \"../../ui.module.scss\";\nimport styles from \"../ContextMenu.module.scss\";\n\nimport { useMenuContext } from \"./MenuContext\";\n\nexport interface MenuItemProps {\n\tchildren: React.ReactNode;\n\ticon?: React.ReactNode;\n\thotKey?: string;\n\tclassName?: string;\n\tdisabled?: boolean;\n\thref?: string;\n\ttarget?: string;\n\trel?: string;\n\tcloseOnSelect?: boolean;\n\tonSelect?: (event: React.MouseEvent<HTMLElement>) => void;\n}\n\nexport const MenuItem: React.FC<MenuItemProps> = ({\n\tchildren,\n\ticon,\n\thotKey,\n\tclassName,\n\tdisabled,\n\thref,\n\ttarget,\n\trel,\n\tcloseOnSelect = true,\n\tonSelect\n}) => {\n\tconst { closeMenu } = useMenuContext();\n\n\tconst handleClick = useCallback(\n\t\t(event: React.MouseEvent<HTMLElement>) => {\n\t\t\tif (disabled) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonSelect?.(event);\n\t\t\tif (event.defaultPrevented) return;\n\n\t\t\tif (closeOnSelect) {\n\t\t\t\tcloseMenu();\n\t\t\t}\n\t\t},\n\t\t[disabled, onSelect, closeOnSelect, closeMenu]\n\t);\n\n\tconst rootClassName = cn(uiStyles.uiPopupOption, styles.menuItem, className);\n\n\tif (href) {\n\t\treturn (\n\t\t\t<a\n\t\t\t\thref={href}\n\t\t\t\ttarget={target}\n\t\t\t\trel={rel}\n\t\t\t\trole=\"menuitem\"\n\t\t\t\ttabIndex={-1}\n\t\t\t\taria-disabled={disabled}\n\t\t\t\tdata-menu-item=\"true\"\n\t\t\t\tdata-disabled={disabled ? \"true\" : undefined}\n\t\t\t\tdata-ui=\"context-menu-item\"\n\t\t\t\tdata-action=\"select-context-menu-item\"\n\t\t\t\tclassName={rootClassName}\n\t\t\t\tonClick={handleClick as React.MouseEventHandler<HTMLAnchorElement>}>\n\t\t\t\t{icon && <span className={cn(uiStyles.uiPopupOptionIcon, styles.menuItemIcon)}>{icon}</span>}\n\t\t\t\t<span className={cn(uiStyles.uiOptionText, styles.menuItemText)}>{children}</span>\n\t\t\t\t{hotKey && <kbd className={cn(uiStyles.keyboard, styles.menuItemHotKey)}>{hotKey}</kbd>}\n\t\t\t</a>\n\t\t);\n\t}\n\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\trole=\"menuitem\"\n\t\t\ttabIndex={-1}\n\t\t\tdisabled={disabled}\n\t\t\tdata-menu-item=\"true\"\n\t\t\tdata-disabled={disabled ? \"true\" : undefined}\n\t\t\tdata-ui=\"context-menu-item\"\n\t\t\tdata-action=\"select-context-menu-item\"\n\t\t\tclassName={rootClassName}\n\t\t\tonClick={handleClick as React.MouseEventHandler<HTMLButtonElement>}>\n\t\t\t{icon && <span className={cn(uiStyles.uiPopupOptionIcon, styles.menuItemIcon)}>{icon}</span>}\n\t\t\t<span className={cn(uiStyles.uiOptionText, styles.menuItemText)}>{children}</span>\n\t\t\t{hotKey && <kbd className={cn(uiStyles.keyboard, styles.menuItemHotKey)}>{hotKey}</kbd>}\n\t\t</button>\n\t);\n};\n","import React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { autoUpdate, flip, offset, Placement, shift, useFloating } from \"@floating-ui/react\";\nimport {\n\tcloseMenu,\n\tcreateVirtualAnchor,\n\tgetMenuPointFromEvent,\n\tgetMenuPointFromRect,\n\tinitialMenuState,\n\topenMenu\n} from \"@ryuzaki13/react-foundation-lib/context-menu\";\n\nimport { MenuContext, MenuTriggerMode } from \"./MenuContext\";\n\ninterface MenuRootProps {\n\tchildren: React.ReactNode;\n\tmode: MenuTriggerMode;\n\tplacement?: Placement;\n\topen?: boolean;\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n}\n\nexport const MenuRoot: React.FC<MenuRootProps> = ({\n\tchildren,\n\tmode,\n\tplacement = mode === \"click\" ? \"bottom-start\" : \"right-start\",\n\topen: controlledOpen,\n\tdefaultOpen,\n\tonOpenChange\n}) => {\n\tconst [menuState, setMenuState] = useState(initialMenuState);\n\tconst [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen ?? false);\n\tconst isControlled = controlledOpen !== undefined;\n\tconst open = isControlled ? controlledOpen : uncontrolledOpen;\n\tconst triggerElementRef = useRef<HTMLElement | null>(null);\n\n\tconst { refs, floatingStyles, update } = useFloating({\n\t\tplacement,\n\t\tstrategy: mode === \"contextmenu\" ? \"fixed\" : \"absolute\",\n\t\ttransform: false,\n\t\tmiddleware: [offset(6), flip({ padding: 8 }), shift({ padding: 8 })],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\tconst setOpen = useCallback(\n\t\t(nextOpen: boolean) => {\n\t\t\tif (!isControlled) {\n\t\t\t\tsetUncontrolledOpen(nextOpen);\n\t\t\t}\n\t\t\tonOpenChange?.(nextOpen);\n\t\t\tif (!nextOpen) {\n\t\t\t\tsetMenuState((state) => closeMenu(state));\n\t\t\t}\n\t\t},\n\t\t[isControlled, onOpenChange]\n\t);\n\n\tconst closeMenuHandler = useCallback(() => {\n\t\tsetOpen(false);\n\t}, [setOpen]);\n\n\tuseEffect(() => {\n\t\tif (!open) {\n\t\t\tsetMenuState((state) => closeMenu(state));\n\t\t}\n\t}, [open]);\n\n\tconst openAtElement = useCallback(\n\t\t(element: HTMLElement, source: \"click\" | \"keyboard\") => {\n\t\t\trefs.setReference(element);\n\t\t\tsetMenuState(\n\t\t\t\topenMenu({\n\t\t\t\t\tsource,\n\t\t\t\t\tanchor: {\n\t\t\t\t\t\ttype: \"element\",\n\t\t\t\t\t\telement\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t);\n\t\t\tsetOpen(true);\n\t\t},\n\t\t[refs, setOpen]\n\t);\n\n\tconst openAtPoint = useCallback(\n\t\t(point: { x: number; y: number }, source: \"contextmenu\" | \"keyboard\", contextElement?: HTMLElement | null) => {\n\t\t\trefs.setReference(createVirtualAnchor(point, contextElement));\n\t\t\tsetMenuState(\n\t\t\t\topenMenu({\n\t\t\t\t\tsource,\n\t\t\t\t\tanchor: {\n\t\t\t\t\t\ttype: \"point\",\n\t\t\t\t\t\tpoint,\n\t\t\t\t\t\tcontextElement\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t);\n\t\t\tsetOpen(true);\n\t\t\tupdate();\n\t\t},\n\t\t[refs, setOpen, update]\n\t);\n\n\tconst registerTriggerElement = useCallback(\n\t\t(node: HTMLElement | null) => {\n\t\t\ttriggerElementRef.current = node;\n\t\t\tif (mode === \"click\") {\n\t\t\t\trefs.setReference(node);\n\t\t\t}\n\t\t},\n\t\t[mode, refs]\n\t);\n\n\tconst onTriggerClick = useCallback(\n\t\t(event: React.MouseEvent<HTMLElement>) => {\n\t\t\tif (mode !== \"click\") return;\n\t\t\tconst element = event.currentTarget;\n\n\t\t\tif (open && menuState.anchor?.type === \"element\" && menuState.anchor.element === element) {\n\t\t\t\tcloseMenuHandler();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\topenAtElement(element, \"click\");\n\t\t},\n\t\t[mode, open, menuState.anchor, closeMenuHandler, openAtElement]\n\t);\n\n\tconst onTriggerContextMenu = useCallback(\n\t\t(event: React.MouseEvent<HTMLElement>) => {\n\t\t\tif (mode !== \"contextmenu\") return;\n\t\t\tevent.preventDefault();\n\n\t\t\tconst element = event.currentTarget;\n\t\t\tconst point = getMenuPointFromEvent(event);\n\t\t\topenAtPoint(point, \"contextmenu\", element);\n\t\t},\n\t\t[mode, openAtPoint]\n\t);\n\n\tconst onTriggerKeyDown = useCallback(\n\t\t(event: React.KeyboardEvent<HTMLElement>) => {\n\t\t\tconst isContextMenuKeyboardOpen = event.key === \"ContextMenu\" || (event.shiftKey && event.key === \"F10\");\n\t\t\tif (!isContextMenuKeyboardOpen) return;\n\n\t\t\tevent.preventDefault();\n\t\t\tconst element = event.currentTarget;\n\n\t\t\tif (mode === \"click\") {\n\t\t\t\topenAtElement(element, \"keyboard\");\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst point = getMenuPointFromRect(element.getBoundingClientRect());\n\t\t\topenAtPoint(point, \"keyboard\", element);\n\t\t},\n\t\t[mode, openAtElement, openAtPoint]\n\t);\n\n\tconst visible = open && menuState.anchor !== null;\n\tconst anchorPoint = useMemo(() => {\n\t\tif (!menuState.anchor) return null;\n\n\t\tif (menuState.anchor.type === \"point\") {\n\t\t\treturn menuState.anchor.point;\n\t\t}\n\n\t\tconst rect = menuState.anchor.element.getBoundingClientRect();\n\t\treturn getMenuPointFromRect(rect);\n\t}, [menuState.anchor]);\n\n\tconst value = useMemo(\n\t\t() => ({\n\t\t\tmode,\n\t\t\topen: visible,\n\t\t\topenSource: menuState.source,\n\t\t\tanchorPoint,\n\t\t\tfloatingStyles,\n\t\t\tfloatingRef: refs.floating,\n\t\t\ttriggerRef: triggerElementRef,\n\t\t\tsetFloating: refs.setFloating,\n\t\t\tregisterTriggerElement,\n\t\t\tonTriggerClick,\n\t\t\tonTriggerContextMenu,\n\t\t\tonTriggerKeyDown,\n\t\t\tcloseMenu: closeMenuHandler\n\t\t}),\n\t\t[\n\t\t\tmode,\n\t\t\tvisible,\n\t\t\tmenuState.source,\n\t\t\tanchorPoint,\n\t\t\tfloatingStyles,\n\t\t\trefs.floating,\n\t\t\trefs.setFloating,\n\t\t\tregisterTriggerElement,\n\t\t\tonTriggerClick,\n\t\t\tonTriggerContextMenu,\n\t\t\tonTriggerKeyDown,\n\t\t\tcloseMenuHandler\n\t\t]\n\t);\n\n\treturn <MenuContext.Provider value={value}>{children}</MenuContext.Provider>;\n};\n","import React from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport uiStyles from \"../../ui.module.scss\";\n\nexport interface MenuSeparatorProps {\n\tclassName?: string;\n}\n\nexport const MenuSeparator: React.FC<MenuSeparatorProps> = ({ className }) => {\n\treturn <div role=\"separator\" className={cn(uiStyles.uiPopupOptionSeparator, className)} />;\n};\n","import React, { Children, useCallback, useEffect, useMemo } from \"react\";\n\nimport { useClickOutside, useEscapeDismiss, useOverlayFocus } from \"@ryuzaki13/react-foundation-lib/dom\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { createPortal } from \"react-dom\";\n\nimport styles from \"../ContextMenu.module.scss\";\n\nimport { useMenuContext } from \"./MenuContext\";\n\nexport interface RadialMenuContentProps {\n\tchildren: React.ReactNode | ((ctx: { closeMenu: () => void }) => React.ReactNode);\n\tclassName?: string;\n\tcloseOnOutside?: boolean;\n\tcloseOnEscape?: boolean;\n\tdisableOutsideClick?: boolean;\n\trestoreFocus?: boolean;\n\tradius?: number;\n\titemSize?: number;\n\tcloseLabel?: string;\n}\n\nfunction clamp(value: number, min: number, max: number) {\n\tif (max < min) return min;\n\treturn Math.min(Math.max(value, min), max);\n}\n\nexport const RadialMenuContent: React.FC<RadialMenuContentProps> = ({\n\tchildren,\n\tclassName,\n\tcloseOnOutside = true,\n\tcloseOnEscape = true,\n\tdisableOutsideClick = false,\n\trestoreFocus = true,\n\tradius = 76,\n\titemSize = 64,\n\tcloseLabel = \"Закрыть\"\n}) => {\n\tconst { open, anchorPoint, floatingRef, triggerRef, setFloating, closeMenu } = useMenuContext();\n\n\tconst resolvedChildren = typeof children === \"function\" ? children({ closeMenu }) : children;\n\tconst itemNodes = useMemo(() => Children.toArray(resolvedChildren), [resolvedChildren]);\n\tconst itemCount = itemNodes.length;\n\tconst panelSize = radius * 2 + itemSize;\n\n\tconst panelPoint = useMemo(() => {\n\t\tif (typeof window === \"undefined\" || !anchorPoint) return null;\n\n\t\t// Радиальное меню центрируется на точке вызова, но не выходит за границы viewport.\n\t\tconst safeOffset = panelSize / 2 + 8;\n\t\treturn {\n\t\t\tx: clamp(anchorPoint.x, safeOffset, window.innerWidth - safeOffset),\n\t\t\ty: clamp(anchorPoint.y, safeOffset, window.innerHeight - safeOffset)\n\t\t};\n\t}, [anchorPoint, panelSize]);\n\n\tconst getNavigableItems = useCallback(() => {\n\t\tconst floatingElement = floatingRef.current;\n\t\tif (!floatingElement) return [];\n\n\t\treturn Array.from(floatingElement.querySelectorAll<HTMLElement>('[data-menu-item=\"true\"]:not([data-disabled=\"true\"])'));\n\t}, [floatingRef]);\n\n\tuseOverlayFocus<HTMLElement>({\n\t\tactive: open,\n\t\tinitialFocus: (container) => getNavigableItems()[0] ?? container,\n\t\trestoreFocus,\n\t\trestoreFocusTarget: () => triggerRef.current,\n\t\tcontainerRef: floatingRef\n\t});\n\n\tuseEffect(() => {\n\t\tif (!open || !anchorPoint) return;\n\n\t\tlet rafId = 0;\n\n\t\t/**\n\t\t * Повторный правый клик при уже открытом меню меняет только якорь, поэтому общий\n\t\t * эффект начального фокуса не перезапускается. Возвращаем фокус в меню явно.\n\t\t */\n\t\tconst focusMenuOnReposition = () => {\n\t\t\tconst focusTarget = getNavigableItems()[0] ?? floatingRef.current;\n\t\t\tfocusTarget?.focus();\n\t\t};\n\n\t\trafId = window.requestAnimationFrame(focusMenuOnReposition);\n\t\treturn () => window.cancelAnimationFrame(rafId);\n\t}, [open, anchorPoint, getNavigableItems, floatingRef]);\n\n\tuseEscapeDismiss({\n\t\tactive: open,\n\t\tenabled: closeOnEscape,\n\t\tonDismiss: closeMenu,\n\t\tcontainerRef: floatingRef\n\t});\n\n\tconst outsideClose = useCallback(() => {\n\t\tif (!open || disableOutsideClick) return;\n\t\tif (closeOnOutside) {\n\t\t\tcloseMenu();\n\t\t}\n\t}, [open, disableOutsideClick, closeOnOutside, closeMenu]);\n\n\tuseClickOutside([floatingRef as React.RefObject<HTMLElement>, triggerRef as React.RefObject<HTMLElement>], outsideClose);\n\n\tconst onMenuKeyDown = useCallback(\n\t\t(event: React.KeyboardEvent<HTMLElement>) => {\n\t\t\tconst items = getNavigableItems();\n\t\t\tif (items.length === 0) return;\n\n\t\t\tconst activeElement = document.activeElement as HTMLElement | null;\n\t\t\tconst currentIndex = activeElement ? items.indexOf(activeElement) : -1;\n\n\t\t\tif (event.key === \"ArrowRight\" || event.key === \"ArrowDown\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst nextIndex = currentIndex >= 0 ? (currentIndex + 1) % items.length : 0;\n\t\t\t\titems[nextIndex]?.focus();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === \"ArrowLeft\" || event.key === \"ArrowUp\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst nextIndex = currentIndex >= 0 ? (currentIndex - 1 + items.length) % items.length : items.length - 1;\n\t\t\t\titems[nextIndex]?.focus();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === \"Home\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\titems[0]?.focus();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === \"End\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\titems[items.length - 1]?.focus();\n\t\t\t}\n\t\t},\n\t\t[getNavigableItems]\n\t);\n\n\tif (typeof document === \"undefined\") return null;\n\n\treturn createPortal(\n\t\t<AnimatePresence>\n\t\t\t{open && panelPoint && (\n\t\t\t\t<motion.div\n\t\t\t\t\tref={setFloating}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"--radial-panel-size\": `${panelSize}px`,\n\t\t\t\t\t\t\t\"--radial-radius\": `${radius}px`,\n\t\t\t\t\t\t\t\"--radial-item-size\": `${itemSize}px`,\n\t\t\t\t\t\t\tleft: panelPoint.x - panelSize / 2,\n\t\t\t\t\t\t\ttop: panelPoint.y - panelSize / 2,\n\t\t\t\t\t\t\ttransformOrigin: \"center\"\n\t\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t\t}\n\t\t\t\t\trole=\"menu\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\tclassName={cn(styles.radialPanel, className)}\n\t\t\t\t\tonKeyDown={onMenuKeyDown}\n\t\t\t\t\tinitial={{ opacity: 0, scale: 0.78 }}\n\t\t\t\t\tanimate={{ opacity: 1, scale: 1 }}\n\t\t\t\t\texit={{ opacity: 0, scale: 0.78 }}\n\t\t\t\t\ttransition={{ duration: 0.16, ease: \"easeOut\" }}>\n\t\t\t\t\t<div className={styles.radialRing} aria-hidden=\"true\" />\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\tclassName={styles.radialCenterButton}\n\t\t\t\t\t\taria-label={closeLabel}\n\t\t\t\t\t\tdata-menu-item=\"true\"\n\t\t\t\t\t\tdata-radial-close=\"true\"\n\t\t\t\t\t\tonClick={closeMenu}>\n\t\t\t\t\t\t<span className={styles.radialCenterButtonText}>{closeLabel}</span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<div className={styles.radialItems}>\n\t\t\t\t\t\t{itemNodes.map((item, index) => {\n\t\t\t\t\t\t\tconst angle = itemCount > 0 ? -90 + (360 / itemCount) * index : -90;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t// Индекс допустим: порядок пунктов полностью задает геометрию кольца.\n\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\tclassName={styles.radialItemSlot}\n\t\t\t\t\t\t\t\t\tstyle={{ \"--radial-item-angle\": `${angle}deg` } as React.CSSProperties}>\n\t\t\t\t\t\t\t\t\t{item}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</div>\n\t\t\t\t</motion.div>\n\t\t\t)}\n\t\t</AnimatePresence>,\n\t\tdocument.body\n\t);\n};\n","import React, { useCallback } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport styles from \"../ContextMenu.module.scss\";\n\nimport { useMenuContext } from \"./MenuContext\";\n\nexport interface RadialMenuItemProps {\n\tchildren: React.ReactNode;\n\ticon?: React.ReactNode;\n\tclassName?: string;\n\tdisabled?: boolean;\n\tcloseOnSelect?: boolean;\n\tonSelect?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const RadialMenuItem: React.FC<RadialMenuItemProps> = ({ children, icon, className, disabled, closeOnSelect = true, onSelect }) => {\n\tconst { closeMenu } = useMenuContext();\n\n\tconst handleClick = useCallback(\n\t\t(event: React.MouseEvent<HTMLButtonElement>) => {\n\t\t\tif (disabled) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonSelect?.(event);\n\t\t\tif (event.defaultPrevented) return;\n\n\t\t\tif (closeOnSelect) {\n\t\t\t\tcloseMenu();\n\t\t\t}\n\t\t},\n\t\t[disabled, onSelect, closeOnSelect, closeMenu]\n\t);\n\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\trole=\"menuitem\"\n\t\t\ttabIndex={-1}\n\t\t\tdisabled={disabled}\n\t\t\taria-disabled={disabled}\n\t\t\tdata-menu-item=\"true\"\n\t\t\tdata-disabled={disabled ? \"true\" : undefined}\n\t\t\tdata-ui=\"radial-menu-item\"\n\t\t\tdata-action=\"select-radial-menu-item\"\n\t\t\tclassName={cn(styles.radialItem, className)}\n\t\t\tonClick={handleClick}>\n\t\t\t{icon && <span className={styles.radialItemIcon}>{icon}</span>}\n\t\t\t<span className={styles.radialItemText}>{children}</span>\n\t\t</button>\n\t);\n};\n","/* eslint-disable react-refresh/only-export-components */\nimport React from \"react\";\n\nimport { Placement } from \"@floating-ui/react\";\n\nimport { ContextMenuTrigger } from \"./ContextMenuTrigger\";\nimport { MenuContent } from \"./MenuContent\";\nimport { MenuGroupLabel } from \"./MenuGroupLabel\";\nimport { MenuItem } from \"./MenuItem\";\nimport { MenuRoot } from \"./MenuRoot\";\nimport { MenuSeparator } from \"./MenuSeparator\";\nimport { RadialMenuContent } from \"./RadialMenuContent\";\nimport { RadialMenuItem } from \"./RadialMenuItem\";\n\nexport interface ContextMenuProps {\n\tchildren: React.ReactNode;\n\tplacement?: Placement;\n\topen?: boolean;\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n}\n\nconst ContextMenuRoot: React.FC<ContextMenuProps> = ({ children, placement, open, defaultOpen, onOpenChange }) => {\n\treturn (\n\t\t<MenuRoot mode=\"contextmenu\" placement={placement} open={open} defaultOpen={defaultOpen} onOpenChange={onOpenChange}>\n\t\t\t{children}\n\t\t</MenuRoot>\n\t);\n};\n\nexport const ContextMenu = Object.assign(ContextMenuRoot, {\n\tTrigger: ContextMenuTrigger,\n\tContent: MenuContent,\n\tRadialContent: RadialMenuContent,\n\tItem: MenuItem,\n\tRadialItem: RadialMenuItem,\n\tSeparator: MenuSeparator,\n\tGroupLabel: MenuGroupLabel\n});\n","import React, { cloneElement } from \"react\";\n\nimport { assignRef, composeKeyboardHandlers, composeMouseHandlers } from \"./helpers\";\nimport { useMenuContext } from \"./MenuContext\";\n\nexport interface DropdownMenuTriggerProps {\n\tchildren: React.ReactElement<React.HTMLAttributes<HTMLElement> & { ref?: React.Ref<HTMLElement> }>;\n}\n\nexport const DropdownMenuTrigger: React.FC<DropdownMenuTriggerProps> = ({ children }) => {\n\tconst { mode, open, registerTriggerElement, onTriggerClick, onTriggerKeyDown } = useMenuContext();\n\n\tif (mode !== \"click\") {\n\t\tthrow new Error(\"DropdownMenu.Trigger must be used within <DropdownMenu>\");\n\t}\n\n\treturn cloneElement(children, {\n\t\tref: (node: HTMLElement | null) => {\n\t\t\tconst childRef = (children.props as { ref?: React.Ref<HTMLElement> }).ref;\n\t\t\tassignRef(childRef, node);\n\t\t\tregisterTriggerElement(node);\n\t\t},\n\t\t\"aria-haspopup\": \"menu\",\n\t\t\"aria-expanded\": open,\n\t\tonClick: composeMouseHandlers(children.props.onClick, onTriggerClick),\n\t\tonKeyDown: composeKeyboardHandlers(children.props.onKeyDown, onTriggerKeyDown)\n\t});\n};\n","/* eslint-disable react-refresh/only-export-components */\nimport React from \"react\";\n\nimport { Placement } from \"@floating-ui/react\";\n\nimport { DropdownMenuTrigger } from \"./DropdownMenuTrigger\";\nimport { MenuContent } from \"./MenuContent\";\nimport { MenuGroupLabel } from \"./MenuGroupLabel\";\nimport { MenuItem } from \"./MenuItem\";\nimport { MenuRoot } from \"./MenuRoot\";\nimport { MenuSeparator } from \"./MenuSeparator\";\n\nexport interface DropdownMenuProps {\n\tchildren: React.ReactNode;\n\tplacement?: Placement;\n\topen?: boolean;\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n}\n\nconst DropdownMenuRoot: React.FC<DropdownMenuProps> = ({ children, placement, open, defaultOpen, onOpenChange }) => {\n\treturn (\n\t\t<MenuRoot mode=\"click\" placement={placement} open={open} defaultOpen={defaultOpen} onOpenChange={onOpenChange}>\n\t\t\t{children}\n\t\t</MenuRoot>\n\t);\n};\n\nexport const DropdownMenu = Object.assign(DropdownMenuRoot, {\n\tTrigger: DropdownMenuTrigger,\n\tContent: MenuContent,\n\tItem: MenuItem,\n\tSeparator: MenuSeparator,\n\tGroupLabel: MenuGroupLabel\n});\n"],"mappings":"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"}

package/dist/chunks/{Flex-DbBdq336.js → Flex-DUYSL5TE.js}

@@ -1,5 +1,5 @@
-import { jsx as e } from "react/jsx-runtime";
-import { createElement as t, forwardRef as n, useMemo as r } from "react";
+import { createElement as e, forwardRef as t, useMemo as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
 import { resolveProps as i, useMatchMedia as a } from "@ryuzaki13/react-foundation-lib/media";
 var o = {
 	container: "ZNPIAt",
@@ -66,10 +66,10 @@ var o = {
 	center: "H-DHBq",
 	columnCenter: "JzIGGJ",
 	centerBetween: "aqYTBq"
-}, s = (e) => r(() => {
+}, s = (e) => n(() => {
 	let t = [o.container];
 	return e.inline && t.push(o.inline), e.row ? t.push(o.row) : e.column ? t.push(o.column) : e.rowReverse ? t.push(o.rowReverse) : e.columnReverse && t.push(o.columnReverse), e.wrap ? t.push(o.wrap) : e.nowrap ? t.push(o.nowrap) : e.wrapReverse && t.push(o.wrapReverse), e.align && t.push(o[`align${e.align.charAt(0).toUpperCase() + e.align.slice(1)}`]), e.justify && t.push(o[`justify${e.justify.charAt(0).toUpperCase() + e.justify.slice(1)}`]), e.alignContent && t.push(o[`alignContent${e.alignContent.charAt(0).toUpperCase() + e.alignContent.slice(1)}`]), e.gap === "none" ? t.push(o.gapNone) : e.gap && t.push(o[`gap${e.gap.charAt(0).toUpperCase() + e.gap.slice(1)}`]), e.gapRow && t.push(o[`gapRow${e.gapRow.charAt(0).toUpperCase() + e.gapRow.slice(1)}`]), e.gapColumn && t.push(o[`gapColumn${e.gapColumn.charAt(0).toUpperCase() + e.gapColumn.slice(1)}`]), t.filter(Boolean).join(" ");
-}, [e]), c = (e) => r(() => {
+}, [e]), c = (e) => n(() => {
 	let t = [o.item];
 	return e.flex0 && t.push(o.flex0), e.flex1 && t.push(o.flex1), !e.flex0 && !e.flex1 && (e.grow ? t.push(o.grow) : t.push(o.grow0), e.shrink === !1 ? t.push(o.shrink0) : t.push(o.shrink), e.basis === "0" ? t.push(o.basis0) : e.basis === "auto" && t.push(o.basisAuto)), e.alignSelf && t.push(o[`alignSelf${e.alignSelf.charAt(0).toUpperCase() + e.alignSelf.slice(1)}`]), e.justifySelf && t.push(o[`justifySelf${e.justifySelf.charAt(0).toUpperCase() + e.justifySelf.slice(1)}`]), t.filter(Boolean).join(" ");
 }, [e]), l = (e) => o[e], u = [
@@ -87,13 +87,13 @@ var o = {
 	"gap",
 	"gapRow",
 	"gapColumn"
-], d = n(({ children: e, className: n = "", as: o, style: c, ...l }, d) => {
-	let { activeBreakpoint: f } = a(), p = [s(r(() => i(l, f, u), [l, f])), n].filter(Boolean).join(" ");
-	return t(o || "div", {
+], d = t(({ children: t, className: r = "", as: o, style: c, ...l }, d) => {
+	let { activeBreakpoint: f } = a(), p = [s(n(() => i(l, f, u), [l, f])), r].filter(Boolean).join(" ");
+	return e(o || "div", {
 		ref: d,
 		className: p,
 		style: c
-	}, e);
+	}, t);
 });
 d.displayName = "FlexContainer";
 //#endregion
@@ -106,22 +106,22 @@ var f = [
 	"basis",
 	"alignSelf",
 	"justifySelf"
-], p = n(({ children: e, className: n = "", as: o, style: s, ...l }, u) => {
-	let { activeBreakpoint: d } = a(), p = [c(r(() => i(l, d, f), [l, d])), n].filter(Boolean).join(" ");
-	return t(o || "div", {
+], p = t(({ children: t, className: r = "", as: o, style: s, ...l }, u) => {
+	let { activeBreakpoint: d } = a(), p = [c(n(() => i(l, d, f), [l, d])), r].filter(Boolean).join(" ");
+	return e(o || "div", {
 		ref: u,
 		className: p,
 		style: s
-	}, e);
+	}, t);
 });
 p.displayName = "FlexItem";
 //#endregion
 //#region src/flex/PredefinedFlex.tsx
-var m = n(({ variant: t, children: n, className: r = "", ...i }, a) => /* @__PURE__ */ e(d, {
+var m = t(({ variant: e, children: t, className: n = "", ...i }, a) => /* @__PURE__ */ r(d, {
 	ref: a,
-	className: [l(t ?? ""), r].filter(Boolean).join(" "),
+	className: [l(e ?? ""), n].filter(Boolean).join(" "),
 	...i,
-	children: n
+	children: t
 }));
 m.displayName = "PredefinedFlex";
 //#endregion
@@ -134,4 +134,4 @@ var h = {
 //#endregion
 export { d as i, m as n, p as r, h as t };
 
-//# sourceMappingURL=Flex-DbBdq336.js.map
+//# sourceMappingURL=Flex-DUYSL5TE.js.map

package/dist/chunks/{Flex-DbBdq336.js.map → Flex-DUYSL5TE.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Flex-DbBdq336.js","names":[],"sources":["../../src/flex/Flex.module.scss","../../src/flex/useFlexClasses.ts","../../src/flex/FlexContainer.tsx","../../src/flex/FlexItem.tsx","../../src/flex/PredefinedFlex.tsx","../../src/flex/Flex.tsx"],"sourcesContent":[".container {\n\tdisplay: flex;\n\n\t// Display variants\n\t&.inline {\n\t\tdisplay: inline-flex;\n\t\tvertical-align: middle;\n\t}\n\n\t// Direction\n\t&.row {\n\t\tflex-direction: row;\n\t}\n\t&.column {\n\t\tflex-direction: column;\n\t}\n\t&.rowReverse {\n\t\tflex-direction: row-reverse;\n\t}\n\t&.columnReverse {\n\t\tflex-direction: column-reverse;\n\t}\n\n\t// Wrap\n\t&.wrap {\n\t\tflex-wrap: wrap;\n\t}\n\t&.nowrap {\n\t\tflex-wrap: nowrap;\n\t}\n\t&.wrapReverse {\n\t\tflex-wrap: wrap-reverse;\n\t}\n\n\t// Align items\n\t&.alignStart {\n\t\talign-items: start;\n\t}\n\t&.alignCenter {\n\t\talign-items: center;\n\t}\n\t&.alignEnd {\n\t\talign-items: end;\n\t}\n\t&.alignStretch {\n\t\talign-items: stretch;\n\t}\n\t&.alignBaseline {\n\t\talign-items: baseline;\n\t}\n\n\t// Justify content\n\t&.justifyStart {\n\t\tjustify-content: start;\n\t}\n\t&.justifyCenter {\n\t\tjustify-content: center;\n\t}\n\t&.justifyEnd {\n\t\tjustify-content: end;\n\t}\n\t&.justifyStretch {\n\t\tjustify-content: stretch;\n\t}\n\t&.justifyBetween {\n\t\tjustify-content: space-between;\n\t}\n\t&.justifyAround {\n\t\tjustify-content: space-around;\n\t}\n\t&.justifyEvenly {\n\t\tjustify-content: space-evenly;\n\t}\n\n\t// Align content\n\t&.alignContentStart {\n\t\talign-content: start;\n\t}\n\t&.alignContentCenter {\n\t\talign-content: center;\n\t}\n\t&.alignContentEnd {\n\t\talign-content: end;\n\t}\n\t&.alignContentStretch {\n\t\talign-content: stretch;\n\t}\n\t&.alignContentBetween {\n\t\talign-content: space-between;\n\t}\n\t&.alignContentAround {\n\t\talign-content: space-around;\n\t}\n\t&.alignContentEvenly {\n\t\talign-content: space-evenly;\n\t}\n\n\t// Gap properties\n\t&.gapNone {\n\t\tgap: unset;\n\t}\n\n\t// Row gaps\n\t&.gapRowXs {\n\t\trow-gap: var(--space-xs);\n\t}\n\t&.gapRowSm {\n\t\trow-gap: var(--space-sm);\n\t}\n\t&.gapRowMd {\n\t\trow-gap: var(--space-md);\n\t}\n\t&.gapRowLg {\n\t\trow-gap: var(--space-lg);\n\t}\n\t&.gapRowXl {\n\t\trow-gap: var(--space-xl);\n\t}\n\n\t// Column gaps\n\t&.gapColumnXs {\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapColumnSm {\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapColumnMd {\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapColumnLg {\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapColumnXl {\n\t\tcolumn-gap: var(--space-xl);\n\t}\n\n\t// Combined gaps\n\t&.gapXs {\n\t\trow-gap: var(--space-xs);\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapSm {\n\t\trow-gap: var(--space-sm);\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapMd {\n\t\trow-gap: var(--space-md);\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapLg {\n\t\trow-gap: var(--space-lg);\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapXl {\n\t\trow-gap: var(--space-xl);\n\t\tcolumn-gap: var(--space-xl);\n\t}\n}\n\n.item {\n\t// Grow & Shrink with defaults (grow: 0, shrink: 1)\n\t&.grow {\n\t\tflex-grow: 1;\n\t}\n\t&.grow0 {\n\t\tflex-grow: 0;\n\t}\n\n\t&.shrink {\n\t\tflex-shrink: 1;\n\t}\n\t&.shrink0 {\n\t\tflex-shrink: 0;\n\t}\n\n\t// Basis\n\t&.basis0 {\n\t\tflex-basis: 0;\n\t}\n\t&.basisAuto {\n\t\tflex-basis: auto;\n\t}\n\n\t// Composite classes\n\t&.flex0 {\n\t\tflex-grow: 0;\n\t\tflex-shrink: 0;\n\t\tflex-basis: auto;\n\t}\n\n\t&.flex1 {\n\t\tflex-grow: 1;\n\t\tflex-shrink: 1;\n\t\tflex-basis: auto;\n\t}\n\n\t// Align self\n\t&.alignSelfStart {\n\t\talign-self: start;\n\t}\n\t&.alignSelfCenter {\n\t\talign-self: center;\n\t}\n\t&.alignSelfEnd {\n\t\talign-self: end;\n\t}\n\t&.alignSelfStretch {\n\t\talign-self: stretch;\n\t}\n\t&.alignSelfBaseline {\n\t\talign-self: baseline;\n\t}\n\n\t// Justify self\n\t&.justifySelfCenter {\n\t\tjustify-self: center;\n\t}\n\t&.justifySelfEnd {\n\t\tjustify-self: end;\n\t}\n\t&.justifySelfStretch {\n\t\tjustify-self: stretch;\n\t}\n}\n\n// Predefined compositions\n\n.center {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.centerBetween {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n}\n\n.columnCenter {\n\t@extend .center;\n\tflex-direction: column;\n\theight: 100%;\n}\n","import { useMemo } from \"react\";\n\nimport { ResolvedProps } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport styles from \"./Flex.module.scss\";\n\nimport type { FlexContainerProps, FlexItemProps } from \"./types\";\n\ntype ClassName = string | undefined | null | false;\n\nexport type ResolvedFlexContainerProps = ResolvedProps<Omit<FlexContainerProps, \"children\" | \"className\" | \"as\" | \"style\">>;\nexport type ResolvedFlexItemProps = ResolvedProps<Omit<FlexItemProps, \"children\" | \"className\" | \"as\" | \"style\">>;\n\nexport const useFlexContainerClasses = (props: ResolvedFlexContainerProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.container];\n\n\t\t// Display\n\t\tif (props.inline) classes.push(styles.inline);\n\n\t\t// Direction (mutually exclusive)\n\t\tif (props.row) classes.push(styles.row);\n\t\telse if (props.column) classes.push(styles.column);\n\t\telse if (props.rowReverse) classes.push(styles.rowReverse);\n\t\telse if (props.columnReverse) classes.push(styles.columnReverse);\n\n\t\t// Wrap (mutually exclusive)\n\t\tif (props.wrap) classes.push(styles.wrap);\n\t\telse if (props.nowrap) classes.push(styles.nowrap);\n\t\telse if (props.wrapReverse) classes.push(styles.wrapReverse);\n\n\t\t// Alignment\n\t\tif (props.align) classes.push(styles[`align${props.align.charAt(0).toUpperCase() + props.align.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify\n\t\tif (props.justify)\n\t\t\tclasses.push(styles[`justify${props.justify.charAt(0).toUpperCase() + props.justify.slice(1)}` as keyof typeof styles]);\n\n\t\t// Align content\n\t\tif (props.alignContent)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`alignContent${props.alignContent.charAt(0).toUpperCase() + props.alignContent.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\t// Gap properties\n\t\tif (props.gap === \"none\") classes.push(styles.gapNone);\n\t\telse if (props.gap) classes.push(styles[`gap${props.gap.charAt(0).toUpperCase() + props.gap.slice(1)}` as keyof typeof styles]);\n\n\t\tif (props.gapRow)\n\t\t\tclasses.push(styles[`gapRow${props.gapRow.charAt(0).toUpperCase() + props.gapRow.slice(1)}` as keyof typeof styles]);\n\t\tif (props.gapColumn)\n\t\t\tclasses.push(styles[`gapColumn${props.gapColumn.charAt(0).toUpperCase() + props.gapColumn.slice(1)}` as keyof typeof styles]);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useFlexItemClasses = (props: ResolvedFlexItemProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.item];\n\n\t\t// Composite classes (highest priority)\n\t\tif (props.flex0) classes.push(styles.flex0);\n\t\tif (props.flex1) classes.push(styles.flex1);\n\n\t\t// Individual properties (only if composite not used)\n\t\tif (!props.flex0 && !props.flex1) {\n\t\t\t// Grow (default: false = 0)\n\t\t\tif (props.grow) classes.push(styles.grow);\n\t\t\telse classes.push(styles.grow0);\n\n\t\t\t// Shrink (default: true = 1)\n\t\t\tif (props.shrink === false) classes.push(styles.shrink0);\n\t\t\telse classes.push(styles.shrink);\n\n\t\t\t// Basis\n\t\t\tif (props.basis === \"0\") classes.push(styles.basis0);\n\t\t\telse if (props.basis === \"auto\") classes.push(styles.basisAuto);\n\t\t}\n\n\t\t// Self alignment\n\t\tif (props.alignSelf)\n\t\t\tclasses.push(styles[`alignSelf${props.alignSelf.charAt(0).toUpperCase() + props.alignSelf.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify self\n\t\tif (props.justifySelf)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`justifySelf${props.justifySelf.charAt(0).toUpperCase() + props.justifySelf.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useFlexPredefinedClasses = (variant: string) => {\n\treturn styles[variant as keyof typeof styles];\n};\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveProps, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { FlexContainerProps } from \"./types\";\nimport { useFlexContainerClasses } from \"./useFlexClasses\";\n\nconst RESPONSIVE_KEYS = [\n\t\"inline\",\n\t\"row\",\n\t\"column\",\n\t\"rowReverse\",\n\t\"columnReverse\",\n\t\"wrap\",\n\t\"nowrap\",\n\t\"wrapReverse\",\n\t\"align\",\n\t\"justify\",\n\t\"alignContent\",\n\t\"gap\",\n\t\"gapRow\",\n\t\"gapColumn\"\n] as const satisfies readonly (keyof Omit<FlexContainerProps, \"children\" | \"className\" | \"as\" | \"style\">)[];\n\nexport const FlexContainer = forwardRef<HTMLElement, FlexContainerProps>(({ children, className = \"\", as, style, ...props }, ref) => {\n\tconst { activeBreakpoint } = useMatchMedia();\n\n\tconst resolvedProps = useMemo(() => resolveProps(props, activeBreakpoint, RESPONSIVE_KEYS), [props, activeBreakpoint]);\n\n\tconst flexClasses = useFlexContainerClasses(resolvedProps);\n\n\tconst finalClassName = [flexClasses, className].filter(Boolean).join(\" \");\n\tconst Component = as || \"div\";\n\n\treturn createElement(\n\t\tComponent,\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\t{\n\t\t\tref,\n\t\t\tclassName: finalClassName,\n\t\t\tstyle\n\t\t},\n\t\tchildren\n\t);\n});\n\nFlexContainer.displayName = \"FlexContainer\";\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveProps, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { FlexItemProps } from \"./types\";\nimport { useFlexItemClasses } from \"./useFlexClasses\";\n\nconst RESPONSIVE_KEYS = [\"flex0\", \"flex1\", \"grow\", \"shrink\", \"basis\", \"alignSelf\", \"justifySelf\"] as const satisfies readonly (keyof Omit<\n\tFlexItemProps,\n\t\"children\" | \"className\" | \"as\" | \"style\"\n>)[];\n\nexport const FlexItem = forwardRef<HTMLElement, FlexItemProps>(({ children, className = \"\", as, style, ...props }, ref) => {\n\tconst { activeBreakpoint } = useMatchMedia();\n\n\tconst resolvedProps = useMemo(() => resolveProps(props, activeBreakpoint, RESPONSIVE_KEYS), [props, activeBreakpoint]);\n\n\tconst flexClasses = useFlexItemClasses(resolvedProps);\n\n\tconst finalClassName = [flexClasses, className].filter(Boolean).join(\" \");\n\tconst Component = as || \"div\";\n\n\treturn createElement(\n\t\tComponent,\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\t{\n\t\t\tref,\n\t\t\tclassName: finalClassName,\n\t\t\tstyle\n\t\t},\n\t\tchildren\n\t);\n});\n\nFlexItem.displayName = \"FlexItem\";\n","import { forwardRef } from \"react\";\n\nimport { FlexContainer } from \"./FlexContainer\";\nimport { PredefinedFlexProps } from \"./types\";\nimport { useFlexPredefinedClasses } from \"./useFlexClasses\";\n\nexport const PredefinedFlex = forwardRef<HTMLElement, PredefinedFlexProps>(({ variant, children, className = \"\", ...props }, ref) => {\n\tconst predefinedClass = useFlexPredefinedClasses(variant ?? \"\");\n\tconst finalClassName = [predefinedClass, className].filter(Boolean).join(\" \");\n\n\treturn (\n\t\t<FlexContainer ref={ref} className={finalClassName} {...props}>\n\t\t\t{children}\n\t\t</FlexContainer>\n\t);\n});\n\nPredefinedFlex.displayName = \"PredefinedFlex\";\n","import { FlexContainer } from \"./FlexContainer\";\nimport { FlexItem } from \"./FlexItem\";\nimport { PredefinedFlex } from \"./PredefinedFlex\";\n\nexport const Flex = {\n\tContainer: FlexContainer,\n\tItem: FlexItem,\n\tPredefined: PredefinedFlex\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GCaa,KAA2B,MAChC,QAAc;CACpB,IAAM,IAAuB,CAAC,EAAO,SAAS;CAsC9C,OAnCI,EAAM,UAAQ,EAAQ,KAAK,EAAO,MAAM,GAGxC,EAAM,MAAK,EAAQ,KAAK,EAAO,GAAG,IAC7B,EAAM,SAAQ,EAAQ,KAAK,EAAO,MAAM,IACxC,EAAM,aAAY,EAAQ,KAAK,EAAO,UAAU,IAChD,EAAM,iBAAe,EAAQ,KAAK,EAAO,aAAa,GAG3D,EAAM,OAAM,EAAQ,KAAK,EAAO,IAAI,IAC/B,EAAM,SAAQ,EAAQ,KAAK,EAAO,MAAM,IACxC,EAAM,eAAa,EAAQ,KAAK,EAAO,WAAW,GAGvD,EAAM,SAAO,EAAQ,KAAK,EAAO,QAAQ,EAAM,MAAM,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,MAAM,MAAM,CAAC,IAA2B,GAG7H,EAAM,WACT,EAAQ,KAAK,EAAO,UAAU,EAAM,QAAQ,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,QAAQ,MAAM,CAAC,IAA2B,GAGnH,EAAM,gBACT,EAAQ,KACP,EAAO,eAAe,EAAM,aAAa,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,aAAa,MAAM,CAAC,IAC9F,GAGG,EAAM,QAAQ,SAAQ,EAAQ,KAAK,EAAO,OAAO,IAC5C,EAAM,OAAK,EAAQ,KAAK,EAAO,MAAM,EAAM,IAAI,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,IAAI,MAAM,CAAC,IAA2B,GAE1H,EAAM,UACT,EAAQ,KAAK,EAAO,SAAS,EAAM,OAAO,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,OAAO,MAAM,CAAC,IAA2B,GAChH,EAAM,aACT,EAAQ,KAAK,EAAO,YAAY,EAAM,UAAU,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,UAAU,MAAM,CAAC,IAA2B,GAEtH,EAAQ,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACxC,GAAG,CAAC,CAAK,CAAC,GAGE,KAAsB,MAC3B,QAAc;CACpB,IAAM,IAAuB,CAAC,EAAO,IAAI;CA+BzC,OA5BI,EAAM,SAAO,EAAQ,KAAK,EAAO,KAAK,GACtC,EAAM,SAAO,EAAQ,KAAK,EAAO,KAAK,GAGtC,CAAC,EAAM,SAAS,CAAC,EAAM,UAEtB,EAAM,OAAM,EAAQ,KAAK,EAAO,IAAI,IACnC,EAAQ,KAAK,EAAO,KAAK,GAG1B,EAAM,WAAW,KAAO,EAAQ,KAAK,EAAO,OAAO,IAClD,EAAQ,KAAK,EAAO,MAAM,GAG3B,EAAM,UAAU,MAAK,EAAQ,KAAK,EAAO,MAAM,IAC1C,EAAM,UAAU,UAAQ,EAAQ,KAAK,EAAO,SAAS,IAI3D,EAAM,aACT,EAAQ,KAAK,EAAO,YAAY,EAAM,UAAU,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,UAAU,MAAM,CAAC,IAA2B,GAGzH,EAAM,eACT,EAAQ,KACP,EAAO,cAAc,EAAM,YAAY,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAM,YAAY,MAAM,CAAC,IAC3F,GAEM,EAAQ,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACxC,GAAG,CAAC,CAAK,CAAC,GAGE,KAA4B,MACjC,EAAO,ICxFT,IAAkB;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACD,GAEa,IAAgB,GAA6C,EAAE,aAAU,eAAY,IAAI,OAAI,UAAO,GAAG,KAAS,MAAQ;CACpI,IAAM,EAAE,wBAAqB,EAAc,GAMrC,IAAiB,CAFH,EAFE,QAAc,EAAa,GAAO,GAAkB,CAAe,GAAG,CAAC,GAAO,CAAgB,CAExE,CAEpB,GAAa,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAGxE,OAAO,EAFW,KAAM,OAKvB;EACC;EACA,WAAW;EACX;CACD,GACA,CACD;AACD,CAAC;AAED,EAAc,cAAc;;;ACvC5B,IAAM,IAAkB;CAAC;CAAS;CAAS;CAAQ;CAAU;CAAS;CAAa;AAAa,GAKnF,IAAW,GAAwC,EAAE,aAAU,eAAY,IAAI,OAAI,UAAO,GAAG,KAAS,MAAQ;CAC1H,IAAM,EAAE,wBAAqB,EAAc,GAMrC,IAAiB,CAFH,EAFE,QAAc,EAAa,GAAO,GAAkB,CAAe,GAAG,CAAC,GAAO,CAAgB,CAE7E,CAEf,GAAa,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAGxE,OAAO,EAFW,KAAM,OAKvB;EACC;EACA,WAAW;EACX;CACD,GACA,CACD;AACD,CAAC;AAED,EAAS,cAAc;;;AC5BvB,IAAa,IAAiB,GAA8C,EAAE,YAAS,aAAU,eAAY,IAAI,GAAG,KAAS,MAK3H,kBAAC,GAAD;CAAoB;CAAK,WAHH,CADC,EAAyB,KAAW,EACpC,GAAiB,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAGpC;CAAgB,GAAI;CACtD;AACa,CAAA,CAEhB;AAED,EAAe,cAAc;;;ACb7B,IAAa,IAAO;CACnB,WAAW;CACX,MAAM;CACN,YAAY;AACb"}
+{"version":3,"file":"Flex-DUYSL5TE.js","names":[],"sources":["../../src/flex/Flex.module.scss","../../src/flex/useFlexClasses.ts","../../src/flex/FlexContainer.tsx","../../src/flex/FlexItem.tsx","../../src/flex/PredefinedFlex.tsx","../../src/flex/Flex.tsx"],"sourcesContent":[".container {\n\tdisplay: flex;\n\n\t// Display variants\n\t&.inline {\n\t\tdisplay: inline-flex;\n\t\tvertical-align: middle;\n\t}\n\n\t// Direction\n\t&.row {\n\t\tflex-direction: row;\n\t}\n\t&.column {\n\t\tflex-direction: column;\n\t}\n\t&.rowReverse {\n\t\tflex-direction: row-reverse;\n\t}\n\t&.columnReverse {\n\t\tflex-direction: column-reverse;\n\t}\n\n\t// Wrap\n\t&.wrap {\n\t\tflex-wrap: wrap;\n\t}\n\t&.nowrap {\n\t\tflex-wrap: nowrap;\n\t}\n\t&.wrapReverse {\n\t\tflex-wrap: wrap-reverse;\n\t}\n\n\t// Align items\n\t&.alignStart {\n\t\talign-items: start;\n\t}\n\t&.alignCenter {\n\t\talign-items: center;\n\t}\n\t&.alignEnd {\n\t\talign-items: end;\n\t}\n\t&.alignStretch {\n\t\talign-items: stretch;\n\t}\n\t&.alignBaseline {\n\t\talign-items: baseline;\n\t}\n\n\t// Justify content\n\t&.justifyStart {\n\t\tjustify-content: start;\n\t}\n\t&.justifyCenter {\n\t\tjustify-content: center;\n\t}\n\t&.justifyEnd {\n\t\tjustify-content: end;\n\t}\n\t&.justifyStretch {\n\t\tjustify-content: stretch;\n\t}\n\t&.justifyBetween {\n\t\tjustify-content: space-between;\n\t}\n\t&.justifyAround {\n\t\tjustify-content: space-around;\n\t}\n\t&.justifyEvenly {\n\t\tjustify-content: space-evenly;\n\t}\n\n\t// Align content\n\t&.alignContentStart {\n\t\talign-content: start;\n\t}\n\t&.alignContentCenter {\n\t\talign-content: center;\n\t}\n\t&.alignContentEnd {\n\t\talign-content: end;\n\t}\n\t&.alignContentStretch {\n\t\talign-content: stretch;\n\t}\n\t&.alignContentBetween {\n\t\talign-content: space-between;\n\t}\n\t&.alignContentAround {\n\t\talign-content: space-around;\n\t}\n\t&.alignContentEvenly {\n\t\talign-content: space-evenly;\n\t}\n\n\t// Gap properties\n\t&.gapNone {\n\t\tgap: unset;\n\t}\n\n\t// Row gaps\n\t&.gapRowXs {\n\t\trow-gap: var(--space-xs);\n\t}\n\t&.gapRowSm {\n\t\trow-gap: var(--space-sm);\n\t}\n\t&.gapRowMd {\n\t\trow-gap: var(--space-md);\n\t}\n\t&.gapRowLg {\n\t\trow-gap: var(--space-lg);\n\t}\n\t&.gapRowXl {\n\t\trow-gap: var(--space-xl);\n\t}\n\n\t// Column gaps\n\t&.gapColumnXs {\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapColumnSm {\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapColumnMd {\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapColumnLg {\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapColumnXl {\n\t\tcolumn-gap: var(--space-xl);\n\t}\n\n\t// Combined gaps\n\t&.gapXs {\n\t\trow-gap: var(--space-xs);\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapSm {\n\t\trow-gap: var(--space-sm);\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapMd {\n\t\trow-gap: var(--space-md);\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapLg {\n\t\trow-gap: var(--space-lg);\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapXl {\n\t\trow-gap: var(--space-xl);\n\t\tcolumn-gap: var(--space-xl);\n\t}\n}\n\n.item {\n\t// Grow & Shrink with defaults (grow: 0, shrink: 1)\n\t&.grow {\n\t\tflex-grow: 1;\n\t}\n\t&.grow0 {\n\t\tflex-grow: 0;\n\t}\n\n\t&.shrink {\n\t\tflex-shrink: 1;\n\t}\n\t&.shrink0 {\n\t\tflex-shrink: 0;\n\t}\n\n\t// Basis\n\t&.basis0 {\n\t\tflex-basis: 0;\n\t}\n\t&.basisAuto {\n\t\tflex-basis: auto;\n\t}\n\n\t// Composite classes\n\t&.flex0 {\n\t\tflex-grow: 0;\n\t\tflex-shrink: 0;\n\t\tflex-basis: auto;\n\t}\n\n\t&.flex1 {\n\t\tflex-grow: 1;\n\t\tflex-shrink: 1;\n\t\tflex-basis: auto;\n\t}\n\n\t// Align self\n\t&.alignSelfStart {\n\t\talign-self: start;\n\t}\n\t&.alignSelfCenter {\n\t\talign-self: center;\n\t}\n\t&.alignSelfEnd {\n\t\talign-self: end;\n\t}\n\t&.alignSelfStretch {\n\t\talign-self: stretch;\n\t}\n\t&.alignSelfBaseline {\n\t\talign-self: baseline;\n\t}\n\n\t// Justify self\n\t&.justifySelfCenter {\n\t\tjustify-self: center;\n\t}\n\t&.justifySelfEnd {\n\t\tjustify-self: end;\n\t}\n\t&.justifySelfStretch {\n\t\tjustify-self: stretch;\n\t}\n}\n\n// Predefined compositions\n\n.center {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.centerBetween {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n}\n\n.columnCenter {\n\t@extend .center;\n\tflex-direction: column;\n\theight: 100%;\n}\n","import { useMemo } from \"react\";\n\nimport { ResolvedProps } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport styles from \"./Flex.module.scss\";\n\nimport type { FlexContainerProps, FlexItemProps } from \"./types\";\n\ntype ClassName = string | undefined | null | false;\n\nexport type ResolvedFlexContainerProps = ResolvedProps<Omit<FlexContainerProps, \"children\" | \"className\" | \"as\" | \"style\">>;\nexport type ResolvedFlexItemProps = ResolvedProps<Omit<FlexItemProps, \"children\" | \"className\" | \"as\" | \"style\">>;\n\nexport const useFlexContainerClasses = (props: ResolvedFlexContainerProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.container];\n\n\t\t// Display\n\t\tif (props.inline) classes.push(styles.inline);\n\n\t\t// Direction (mutually exclusive)\n\t\tif (props.row) classes.push(styles.row);\n\t\telse if (props.column) classes.push(styles.column);\n\t\telse if (props.rowReverse) classes.push(styles.rowReverse);\n\t\telse if (props.columnReverse) classes.push(styles.columnReverse);\n\n\t\t// Wrap (mutually exclusive)\n\t\tif (props.wrap) classes.push(styles.wrap);\n\t\telse if (props.nowrap) classes.push(styles.nowrap);\n\t\telse if (props.wrapReverse) classes.push(styles.wrapReverse);\n\n\t\t// Alignment\n\t\tif (props.align) classes.push(styles[`align${props.align.charAt(0).toUpperCase() + props.align.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify\n\t\tif (props.justify)\n\t\t\tclasses.push(styles[`justify${props.justify.charAt(0).toUpperCase() + props.justify.slice(1)}` as keyof typeof styles]);\n\n\t\t// Align content\n\t\tif (props.alignContent)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`alignContent${props.alignContent.charAt(0).toUpperCase() + props.alignContent.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\t// Gap properties\n\t\tif (props.gap === \"none\") classes.push(styles.gapNone);\n\t\telse if (props.gap) classes.push(styles[`gap${props.gap.charAt(0).toUpperCase() + props.gap.slice(1)}` as keyof typeof styles]);\n\n\t\tif (props.gapRow)\n\t\t\tclasses.push(styles[`gapRow${props.gapRow.charAt(0).toUpperCase() + props.gapRow.slice(1)}` as keyof typeof styles]);\n\t\tif (props.gapColumn)\n\t\t\tclasses.push(styles[`gapColumn${props.gapColumn.charAt(0).toUpperCase() + props.gapColumn.slice(1)}` as keyof typeof styles]);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useFlexItemClasses = (props: ResolvedFlexItemProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.item];\n\n\t\t// Composite classes (highest priority)\n\t\tif (props.flex0) classes.push(styles.flex0);\n\t\tif (props.flex1) classes.push(styles.flex1);\n\n\t\t// Individual properties (only if composite not used)\n\t\tif (!props.flex0 && !props.flex1) {\n\t\t\t// Grow (default: false = 0)\n\t\t\tif (props.grow) classes.push(styles.grow);\n\t\t\telse classes.push(styles.grow0);\n\n\t\t\t// Shrink (default: true = 1)\n\t\t\tif (props.shrink === false) classes.push(styles.shrink0);\n\t\t\telse classes.push(styles.shrink);\n\n\t\t\t// Basis\n\t\t\tif (props.basis === \"0\") classes.push(styles.basis0);\n\t\t\telse if (props.basis === \"auto\") classes.push(styles.basisAuto);\n\t\t}\n\n\t\t// Self alignment\n\t\tif (props.alignSelf)\n\t\t\tclasses.push(styles[`alignSelf${props.alignSelf.charAt(0).toUpperCase() + props.alignSelf.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify self\n\t\tif (props.justifySelf)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`justifySelf${props.justifySelf.charAt(0).toUpperCase() + props.justifySelf.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useFlexPredefinedClasses = (variant: string) => {\n\treturn styles[variant as keyof typeof styles];\n};\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveProps, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { FlexContainerProps } from \"./types\";\nimport { useFlexContainerClasses } from \"./useFlexClasses\";\n\nconst RESPONSIVE_KEYS = [\n\t\"inline\",\n\t\"row\",\n\t\"column\",\n\t\"rowReverse\",\n\t\"columnReverse\",\n\t\"wrap\",\n\t\"nowrap\",\n\t\"wrapReverse\",\n\t\"align\",\n\t\"justify\",\n\t\"alignContent\",\n\t\"gap\",\n\t\"gapRow\",\n\t\"gapColumn\"\n] as const satisfies readonly (keyof Omit<FlexContainerProps, \"children\" | \"className\" | \"as\" | \"style\">)[];\n\nexport const FlexContainer = forwardRef<HTMLElement, FlexContainerProps>(({ children, className = \"\", as, style, ...props }, ref) => {\n\tconst { activeBreakpoint } = useMatchMedia();\n\n\tconst resolvedProps = useMemo(() => resolveProps(props, activeBreakpoint, RESPONSIVE_KEYS), [props, activeBreakpoint]);\n\n\tconst flexClasses = useFlexContainerClasses(resolvedProps);\n\n\tconst finalClassName = [flexClasses, className].filter(Boolean).join(\" \");\n\tconst Component = as || \"div\";\n\n\treturn createElement(\n\t\tComponent,\n\n\t\t{\n\t\t\tref,\n\t\t\tclassName: finalClassName,\n\t\t\tstyle\n\t\t},\n\t\tchildren\n\t);\n});\n\nFlexContainer.displayName = \"FlexContainer\";\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveProps, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { FlexItemProps } from \"./types\";\nimport { useFlexItemClasses } from \"./useFlexClasses\";\n\nconst RESPONSIVE_KEYS = [\"flex0\", \"flex1\", \"grow\", \"shrink\", \"basis\", \"alignSelf\", \"justifySelf\"] as const satisfies readonly (keyof Omit<\n\tFlexItemProps,\n\t\"children\" | \"className\" | \"as\" | \"style\"\n>)[];\n\nexport const FlexItem = forwardRef<HTMLElement, FlexItemProps>(({ children, className = \"\", as, style, ...props }, ref) => {\n\tconst { activeBreakpoint } = useMatchMedia();\n\n\tconst resolvedProps = useMemo(() => resolveProps(props, activeBreakpoint, RESPONSIVE_KEYS), [props, activeBreakpoint]);\n\n\tconst flexClasses = useFlexItemClasses(resolvedProps);\n\n\tconst finalClassName = [flexClasses, className].filter(Boolean).join(\" \");\n\tconst Component = as || \"div\";\n\n\treturn createElement(\n\t\tComponent,\n\n\t\t{\n\t\t\tref,\n\t\t\tclassName: finalClassName,\n\t\t\tstyle\n\t\t},\n\t\tchildren\n\t);\n});\n\nFlexItem.displayName = \"FlexItem\";\n","import { forwardRef } from \"react\";\n\nimport { FlexContainer } from \"./FlexContainer\";\nimport { PredefinedFlexProps } from \"./types\";\nimport { useFlexPredefinedClasses } from \"./useFlexClasses\";\n\nexport const PredefinedFlex = forwardRef<HTMLElement, PredefinedFlexProps>(({ variant, children, className = \"\", ...props }, ref) => {\n\tconst predefinedClass = useFlexPredefinedClasses(variant ?? \"\");\n\tconst finalClassName = [predefinedClass, className].filter(Boolean).join(\" \");\n\n\treturn (\n\t\t<FlexContainer ref={ref} className={finalClassName} {...props}>\n\t\t\t{children}\n\t\t</FlexContainer>\n\t);\n});\n\nPredefinedFlex.displayName = \"PredefinedFlex\";\n","import { FlexContainer } from \"./FlexContainer\";\nimport { FlexItem } from \"./FlexItem\";\nimport { PredefinedFlex } from \"./PredefinedFlex\";\n\nexport const Flex = {\n\tContainer: FlexContainer,\n\tItem: FlexItem,\n\tPredefined: PredefinedFlex\n};\n"],"mappings":"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"}

package/dist/chunks/Grid-ByIIytjh.js.map

@@ -1 +1 @@
-{"version":3,"file":"Grid-ByIIytjh.js","names":[],"sources":["../../src/grid/Grid.module.scss","../../src/grid/useGridClasses.ts","../../src/grid/GridContainer.tsx","../../src/grid/GridItem.tsx","../../src/grid/Grid.tsx"],"sourcesContent":[".grid {\n\tdisplay: grid;\n\n\t// Display variants\n\t&.inline {\n\t\tdisplay: inline-grid;\n\t\tvertical-align: middle;\n\t}\n\n\t// Auto flow\n\t&.row {\n\t\tgrid-auto-flow: row;\n\t}\n\t&.column {\n\t\tgrid-auto-flow: column;\n\t}\n\t&.dense {\n\t\tgrid-auto-flow: dense;\n\t}\n\n\t// Gap properties (аналогично Flex)\n\t&.gapNone {\n\t\tgap: unset;\n\t}\n\n\t// Row gaps\n\t&.gapRowXs {\n\t\trow-gap: var(--space-xs);\n\t}\n\t&.gapRowSm {\n\t\trow-gap: var(--space-sm);\n\t}\n\t&.gapRowMd {\n\t\trow-gap: var(--space-md);\n\t}\n\t&.gapRowLg {\n\t\trow-gap: var(--space-lg);\n\t}\n\t&.gapRowXl {\n\t\trow-gap: var(--space-xl);\n\t}\n\n\t// Column gaps\n\t&.gapColumnXs {\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapColumnSm {\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapColumnMd {\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapColumnLg {\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapColumnXl {\n\t\tcolumn-gap: var(--space-xl);\n\t}\n\n\t// Combined gaps\n\t&.gapXs {\n\t\trow-gap: var(--space-xs);\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapSm {\n\t\trow-gap: var(--space-sm);\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapMd {\n\t\trow-gap: var(--space-md);\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapLg {\n\t\trow-gap: var(--space-lg);\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapXl {\n\t\trow-gap: var(--space-xl);\n\t\tcolumn-gap: var(--space-xl);\n\t}\n\n\t// Align items\n\t&.alignStart {\n\t\talign-items: start;\n\t}\n\t&.alignCenter {\n\t\talign-items: center;\n\t}\n\t&.alignEnd {\n\t\talign-items: end;\n\t}\n\t&.alignStretch {\n\t\talign-items: stretch;\n\t}\n\t&.alignBaseline {\n\t\talign-items: baseline;\n\t}\n\n\t// Justify items\n\t&.justifyStart {\n\t\tjustify-items: start;\n\t}\n\t&.justifyCenter {\n\t\tjustify-items: center;\n\t}\n\t&.justifyEnd {\n\t\tjustify-items: end;\n\t}\n\t&.justifyStretch {\n\t\tjustify-items: stretch;\n\t}\n\n\t// Align content\n\t&.alignContentStart {\n\t\talign-content: start;\n\t}\n\t&.alignContentCenter {\n\t\talign-content: center;\n\t}\n\t&.alignContentEnd {\n\t\talign-content: end;\n\t}\n\t&.alignContentStretch {\n\t\talign-content: stretch;\n\t}\n\t&.alignContentBetween {\n\t\talign-content: space-between;\n\t}\n\t&.alignContentAround {\n\t\talign-content: space-around;\n\t}\n\t&.alignContentEvenly {\n\t\talign-content: space-evenly;\n\t}\n\n\t// Justify content\n\t&.justifyContentStart {\n\t\tjustify-content: start;\n\t}\n\t&.justifyContentCenter {\n\t\tjustify-content: center;\n\t}\n\t&.justifyContentEnd {\n\t\tjustify-content: end;\n\t}\n\t&.justifyContentStretch {\n\t\tjustify-content: stretch;\n\t}\n\t&.justifyContentBetween {\n\t\tjustify-content: space-between;\n\t}\n\t&.justifyContentAround {\n\t\tjustify-content: space-around;\n\t}\n\t&.justifyContentEvenly {\n\t\tjustify-content: space-evenly;\n\t}\n}\n\n// Grid Item\n.item {\n\t// Grid placement\n\t&.areaAuto {\n\t\tgrid-area: auto;\n\t}\n\n\t// Align self\n\t&.alignSelfStart {\n\t\talign-self: start;\n\t}\n\t&.alignSelfCenter {\n\t\talign-self: center;\n\t}\n\t&.alignSelfEnd {\n\t\talign-self: end;\n\t}\n\t&.alignSelfStretch {\n\t\talign-self: stretch;\n\t}\n\t&.alignSelfBaseline {\n\t\talign-self: baseline;\n\t}\n\n\t// Justify self\n\t&.justifySelfStart {\n\t\tjustify-self: start;\n\t}\n\t&.justifySelfCenter {\n\t\tjustify-self: center;\n\t}\n\t&.justifySelfEnd {\n\t\tjustify-self: end;\n\t}\n\t&.justifySelfStretch {\n\t\tjustify-self: stretch;\n\t}\n}\n\n// Предопределенные композиции\n.autoRows1fr {\n\tgrid-auto-rows: 1fr;\n}\n\n.columnsAuto1fr {\n\tgrid-template-columns: auto 1fr;\n\tgrid-auto-rows: auto;\n}\n\n.singleColumn {\n\tgrid-template-columns: 100%;\n\tgrid-auto-rows: auto 1fr;\n}\n","import { CSSProperties, useMemo } from \"react\";\n\nimport { ResolvedProps } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport styles from \"./Grid.module.scss\";\n\nimport type { GridContainerProps, GridItemProps } from \"./types\";\n\ntype ClassName = string | undefined | null | false;\n\nexport type ResolvedGridContainerProps = Omit<ResolvedProps<GridContainerProps>, \"children\" | \"className\" | \"as\" | \"style\">;\nexport type ResolvedGridItemProps = Omit<ResolvedProps<GridItemProps>, \"children\" | \"className\" | \"as\" | \"style\">;\n\nexport const useGridContainerClasses = (props: ResolvedGridContainerProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.grid];\n\n\t\t// Display\n\t\tif (props.inline) classes.push(styles.inline);\n\n\t\t// Auto flow\n\t\tif (props.column) classes.push(styles.column);\n\t\telse if (props.dense) classes.push(styles.dense);\n\t\telse if (props.row) classes.push(styles.row);\n\n\t\t// Alignment\n\t\tif (props.align) classes.push(styles[`align${props.align.charAt(0).toUpperCase() + props.align.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify items\n\t\tif (props.justify)\n\t\t\tclasses.push(styles[`justify${props.justify.charAt(0).toUpperCase() + props.justify.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify content\n\t\tif (props.justifyContent)\n\t\t\tclasses.push(\n\t\t\t\tstyles[\n\t\t\t\t\t`justifyContent${props.justifyContent.charAt(0).toUpperCase() + props.justifyContent.slice(1)}` as keyof typeof styles\n\t\t\t\t]\n\t\t\t);\n\n\t\t// Align content\n\t\tif (props.alignContent)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`alignContent${props.alignContent.charAt(0).toUpperCase() + props.alignContent.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\t// Gap properties\n\t\tif (props.gap === \"none\") classes.push(styles.gapNone);\n\t\telse if (props.gap) classes.push(styles[`gap${props.gap.charAt(0).toUpperCase() + props.gap.slice(1)}` as keyof typeof styles]);\n\n\t\tif (props.gapRow)\n\t\t\tclasses.push(styles[`gapRow${props.gapRow.charAt(0).toUpperCase() + props.gapRow.slice(1)}` as keyof typeof styles]);\n\t\tif (props.gapColumn)\n\t\t\tclasses.push(styles[`gapColumn${props.gapColumn.charAt(0).toUpperCase() + props.gapColumn.slice(1)}` as keyof typeof styles]);\n\n\t\t// Предопределенные варианты\n\t\tif (props.variant === \"single-column\") classes.push(styles.singleColumn);\n\t\telse if (props.variant === \"auto-1fr\") classes.push(styles.autoRows1fr);\n\t\telse if (props.variant === \"auto1fr-rows-auto\") classes.push(styles.columnsAuto1fr);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useGridContainerStyles = (\n\tprops: Pick<ResolvedGridContainerProps, \"templateColumns\" | \"templateRows\" | \"autoColumns\" | \"autoRows\" | \"areas\">\n) => {\n\treturn useMemo(() => {\n\t\tconst styles: CSSProperties = {};\n\n\t\tif (props.templateColumns) {\n\t\t\t// if (typeof props.templateColumns === \"object\") {\n\t\t\t//     styles.gridTemplateColumns = props.templateColumns;\n\t\t\t// } else {\n\t\t\tstyles.gridTemplateColumns = props.templateColumns;\n\t\t\t// }\n\t\t}\n\t\tif (props.templateRows) {\n\t\t\tstyles.gridTemplateRows = props.templateRows;\n\t\t}\n\t\tif (props.autoColumns) {\n\t\t\tstyles.gridAutoColumns = props.autoColumns;\n\t\t}\n\t\tif (props.autoRows) {\n\t\t\tstyles.gridAutoRows = props.autoRows;\n\t\t}\n\t\tif (props.areas) {\n\t\t\tstyles.gridTemplateAreas = props.areas;\n\t\t}\n\n\t\treturn styles;\n\t}, [props.templateColumns, props.templateRows, props.autoColumns, props.autoRows, props.areas]);\n};\n\nexport const useGridItemClasses = (props: ResolvedGridItemProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.item];\n\n\t\t// Self alignment\n\t\tif (props.alignSelf)\n\t\t\tclasses.push(styles[`alignSelf${props.alignSelf.charAt(0).toUpperCase() + props.alignSelf.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify self\n\t\tif (props.justifySelf)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`justifySelf${props.justifySelf.charAt(0).toUpperCase() + props.justifySelf.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useGridItemStyles = (props: Pick<ResolvedGridItemProps, \"area\" | \"column\" | \"row\">) => {\n\treturn useMemo(() => {\n\t\tconst styles: CSSProperties = {};\n\n\t\tif (props.area) {\n\t\t\tstyles.gridArea = props.area;\n\t\t}\n\t\tif (props.column) {\n\t\t\tstyles.gridColumn = props.column;\n\t\t}\n\t\tif (props.row) {\n\t\t\tstyles.gridRow = props.row;\n\t\t}\n\n\t\treturn styles;\n\t}, [props.area, props.column, props.row]);\n};\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveResponsiveValue, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { GridContainerProps } from \"./types\";\nimport { useGridContainerClasses, useGridContainerStyles } from \"./useGridClasses\";\n\nexport const GridContainer = forwardRef<HTMLElement, GridContainerProps>(\n\t({ children, className = \"\", as, style, templateColumns, templateRows, autoColumns, autoRows, areas, ...props }, ref) => {\n\t\tconst { activeBreakpoint } = useMatchMedia();\n\n\t\tconst resolved = useMemo(() => {\n\t\t\treturn {\n\t\t\t\t...props,\n\n\t\t\t\tinline: resolveResponsiveValue(props.inline, activeBreakpoint),\n\n\t\t\t\trow: resolveResponsiveValue(props.row, activeBreakpoint),\n\t\t\t\tcolumn: resolveResponsiveValue(props.column, activeBreakpoint),\n\t\t\t\tdense: resolveResponsiveValue(props.dense, activeBreakpoint),\n\n\t\t\t\tgap: resolveResponsiveValue(props.gap, activeBreakpoint),\n\t\t\t\tgapRow: resolveResponsiveValue(props.gapRow, activeBreakpoint),\n\t\t\t\tgapColumn: resolveResponsiveValue(props.gapColumn, activeBreakpoint),\n\n\t\t\t\talign: resolveResponsiveValue(props.align, activeBreakpoint),\n\t\t\t\tjustify: resolveResponsiveValue(props.justify, activeBreakpoint),\n\t\t\t\talignContent: resolveResponsiveValue(props.alignContent, activeBreakpoint),\n\t\t\t\tjustifyContent: resolveResponsiveValue(props.justifyContent, activeBreakpoint),\n\n\t\t\t\tvariant: resolveResponsiveValue(props.variant, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, props]);\n\n\t\tconst resolvedStyles = useMemo(() => {\n\t\t\treturn {\n\t\t\t\ttemplateColumns: resolveResponsiveValue(templateColumns, activeBreakpoint),\n\t\t\t\ttemplateRows: resolveResponsiveValue(templateRows, activeBreakpoint),\n\t\t\t\tautoColumns: resolveResponsiveValue(autoColumns, activeBreakpoint),\n\t\t\t\tautoRows: resolveResponsiveValue(autoRows, activeBreakpoint),\n\t\t\t\tareas: resolveResponsiveValue(areas, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, templateColumns, templateRows, autoColumns, autoRows, areas]);\n\n\t\tconst gridClasses = useGridContainerClasses(resolved);\n\t\tconst gridStyles = useGridContainerStyles(resolvedStyles);\n\n\t\tconst finalClassName = [gridClasses, className].filter(Boolean).join(\" \");\n\t\tconst finalStyle = { ...gridStyles, ...style };\n\t\tconst Component = as || \"div\";\n\n\t\treturn createElement(\n\t\t\tComponent,\n\t\t\t// eslint-disable-next-line react-hooks/refs\n\t\t\t{\n\t\t\t\tref,\n\t\t\t\tclassName: finalClassName,\n\t\t\t\tstyle: finalStyle\n\t\t\t},\n\t\t\tchildren\n\t\t);\n\t}\n);\n\nGridContainer.displayName = \"GridContainer\";\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveResponsiveValue, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { GridItemProps } from \"./types\";\nimport { useGridItemClasses, useGridItemStyles } from \"./useGridClasses\";\n\nexport const GridItem = forwardRef<HTMLElement, GridItemProps>(\n\t({ children, className = \"\", as, style, area, column, row, ...props }, ref) => {\n\t\tconst { activeBreakpoint } = useMatchMedia();\n\n\t\tconst resolvedProps = useMemo(() => {\n\t\t\treturn {\n\t\t\t\t...props,\n\t\t\t\talignSelf: resolveResponsiveValue(props.alignSelf, activeBreakpoint),\n\t\t\t\tjustifySelf: resolveResponsiveValue(props.justifySelf, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, props]);\n\n\t\tconst resolvedPlacement = useMemo(() => {\n\t\t\treturn {\n\t\t\t\tarea: resolveResponsiveValue(area, activeBreakpoint),\n\t\t\t\tcolumn: resolveResponsiveValue(column, activeBreakpoint),\n\t\t\t\trow: resolveResponsiveValue(row, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, area, column, row]);\n\n\t\tconst gridClasses = useGridItemClasses(resolvedProps);\n\t\tconst gridStyles = useGridItemStyles(resolvedPlacement);\n\n\t\tconst finalClassName = [gridClasses, className].filter(Boolean).join(\" \");\n\t\tconst finalStyle = { ...gridStyles, ...style };\n\t\tconst Component = as || \"div\";\n\n\t\treturn createElement(\n\t\t\tComponent,\n\t\t\t// eslint-disable-next-line react-hooks/refs\n\t\t\t{\n\t\t\t\tref,\n\t\t\t\tclassName: finalClassName,\n\t\t\t\tstyle: finalStyle\n\t\t\t},\n\t\t\tchildren\n\t\t);\n\t}\n);\n\nGridItem.displayName = \"GridItem\";\n","import { GridContainer } from \"./GridContainer\";\nimport { GridItem } from \"./GridItem\";\n\nexport const Grid = {\n\tContainer: GridContainer,\n\tItem: GridItem\n};\n"],"mappings":"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"}
+{"version":3,"file":"Grid-ByIIytjh.js","names":[],"sources":["../../src/grid/Grid.module.scss","../../src/grid/useGridClasses.ts","../../src/grid/GridContainer.tsx","../../src/grid/GridItem.tsx","../../src/grid/Grid.tsx"],"sourcesContent":[".grid {\n\tdisplay: grid;\n\n\t// Display variants\n\t&.inline {\n\t\tdisplay: inline-grid;\n\t\tvertical-align: middle;\n\t}\n\n\t// Auto flow\n\t&.row {\n\t\tgrid-auto-flow: row;\n\t}\n\t&.column {\n\t\tgrid-auto-flow: column;\n\t}\n\t&.dense {\n\t\tgrid-auto-flow: dense;\n\t}\n\n\t// Gap properties (аналогично Flex)\n\t&.gapNone {\n\t\tgap: unset;\n\t}\n\n\t// Row gaps\n\t&.gapRowXs {\n\t\trow-gap: var(--space-xs);\n\t}\n\t&.gapRowSm {\n\t\trow-gap: var(--space-sm);\n\t}\n\t&.gapRowMd {\n\t\trow-gap: var(--space-md);\n\t}\n\t&.gapRowLg {\n\t\trow-gap: var(--space-lg);\n\t}\n\t&.gapRowXl {\n\t\trow-gap: var(--space-xl);\n\t}\n\n\t// Column gaps\n\t&.gapColumnXs {\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapColumnSm {\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapColumnMd {\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapColumnLg {\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapColumnXl {\n\t\tcolumn-gap: var(--space-xl);\n\t}\n\n\t// Combined gaps\n\t&.gapXs {\n\t\trow-gap: var(--space-xs);\n\t\tcolumn-gap: var(--space-xs);\n\t}\n\t&.gapSm {\n\t\trow-gap: var(--space-sm);\n\t\tcolumn-gap: var(--space-sm);\n\t}\n\t&.gapMd {\n\t\trow-gap: var(--space-md);\n\t\tcolumn-gap: var(--space-md);\n\t}\n\t&.gapLg {\n\t\trow-gap: var(--space-lg);\n\t\tcolumn-gap: var(--space-lg);\n\t}\n\t&.gapXl {\n\t\trow-gap: var(--space-xl);\n\t\tcolumn-gap: var(--space-xl);\n\t}\n\n\t// Align items\n\t&.alignStart {\n\t\talign-items: start;\n\t}\n\t&.alignCenter {\n\t\talign-items: center;\n\t}\n\t&.alignEnd {\n\t\talign-items: end;\n\t}\n\t&.alignStretch {\n\t\talign-items: stretch;\n\t}\n\t&.alignBaseline {\n\t\talign-items: baseline;\n\t}\n\n\t// Justify items\n\t&.justifyStart {\n\t\tjustify-items: start;\n\t}\n\t&.justifyCenter {\n\t\tjustify-items: center;\n\t}\n\t&.justifyEnd {\n\t\tjustify-items: end;\n\t}\n\t&.justifyStretch {\n\t\tjustify-items: stretch;\n\t}\n\n\t// Align content\n\t&.alignContentStart {\n\t\talign-content: start;\n\t}\n\t&.alignContentCenter {\n\t\talign-content: center;\n\t}\n\t&.alignContentEnd {\n\t\talign-content: end;\n\t}\n\t&.alignContentStretch {\n\t\talign-content: stretch;\n\t}\n\t&.alignContentBetween {\n\t\talign-content: space-between;\n\t}\n\t&.alignContentAround {\n\t\talign-content: space-around;\n\t}\n\t&.alignContentEvenly {\n\t\talign-content: space-evenly;\n\t}\n\n\t// Justify content\n\t&.justifyContentStart {\n\t\tjustify-content: start;\n\t}\n\t&.justifyContentCenter {\n\t\tjustify-content: center;\n\t}\n\t&.justifyContentEnd {\n\t\tjustify-content: end;\n\t}\n\t&.justifyContentStretch {\n\t\tjustify-content: stretch;\n\t}\n\t&.justifyContentBetween {\n\t\tjustify-content: space-between;\n\t}\n\t&.justifyContentAround {\n\t\tjustify-content: space-around;\n\t}\n\t&.justifyContentEvenly {\n\t\tjustify-content: space-evenly;\n\t}\n}\n\n// Grid Item\n.item {\n\t// Grid placement\n\t&.areaAuto {\n\t\tgrid-area: auto;\n\t}\n\n\t// Align self\n\t&.alignSelfStart {\n\t\talign-self: start;\n\t}\n\t&.alignSelfCenter {\n\t\talign-self: center;\n\t}\n\t&.alignSelfEnd {\n\t\talign-self: end;\n\t}\n\t&.alignSelfStretch {\n\t\talign-self: stretch;\n\t}\n\t&.alignSelfBaseline {\n\t\talign-self: baseline;\n\t}\n\n\t// Justify self\n\t&.justifySelfStart {\n\t\tjustify-self: start;\n\t}\n\t&.justifySelfCenter {\n\t\tjustify-self: center;\n\t}\n\t&.justifySelfEnd {\n\t\tjustify-self: end;\n\t}\n\t&.justifySelfStretch {\n\t\tjustify-self: stretch;\n\t}\n}\n\n// Предопределенные композиции\n.autoRows1fr {\n\tgrid-auto-rows: 1fr;\n}\n\n.columnsAuto1fr {\n\tgrid-template-columns: auto 1fr;\n\tgrid-auto-rows: auto;\n}\n\n.singleColumn {\n\tgrid-template-columns: 100%;\n\tgrid-auto-rows: auto 1fr;\n}\n","import { CSSProperties, useMemo } from \"react\";\n\nimport { ResolvedProps } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport styles from \"./Grid.module.scss\";\n\nimport type { GridContainerProps, GridItemProps } from \"./types\";\n\ntype ClassName = string | undefined | null | false;\n\nexport type ResolvedGridContainerProps = Omit<ResolvedProps<GridContainerProps>, \"children\" | \"className\" | \"as\" | \"style\">;\nexport type ResolvedGridItemProps = Omit<ResolvedProps<GridItemProps>, \"children\" | \"className\" | \"as\" | \"style\">;\n\nexport const useGridContainerClasses = (props: ResolvedGridContainerProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.grid];\n\n\t\t// Display\n\t\tif (props.inline) classes.push(styles.inline);\n\n\t\t// Auto flow\n\t\tif (props.column) classes.push(styles.column);\n\t\telse if (props.dense) classes.push(styles.dense);\n\t\telse if (props.row) classes.push(styles.row);\n\n\t\t// Alignment\n\t\tif (props.align) classes.push(styles[`align${props.align.charAt(0).toUpperCase() + props.align.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify items\n\t\tif (props.justify)\n\t\t\tclasses.push(styles[`justify${props.justify.charAt(0).toUpperCase() + props.justify.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify content\n\t\tif (props.justifyContent)\n\t\t\tclasses.push(\n\t\t\t\tstyles[\n\t\t\t\t\t`justifyContent${props.justifyContent.charAt(0).toUpperCase() + props.justifyContent.slice(1)}` as keyof typeof styles\n\t\t\t\t]\n\t\t\t);\n\n\t\t// Align content\n\t\tif (props.alignContent)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`alignContent${props.alignContent.charAt(0).toUpperCase() + props.alignContent.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\t// Gap properties\n\t\tif (props.gap === \"none\") classes.push(styles.gapNone);\n\t\telse if (props.gap) classes.push(styles[`gap${props.gap.charAt(0).toUpperCase() + props.gap.slice(1)}` as keyof typeof styles]);\n\n\t\tif (props.gapRow)\n\t\t\tclasses.push(styles[`gapRow${props.gapRow.charAt(0).toUpperCase() + props.gapRow.slice(1)}` as keyof typeof styles]);\n\t\tif (props.gapColumn)\n\t\t\tclasses.push(styles[`gapColumn${props.gapColumn.charAt(0).toUpperCase() + props.gapColumn.slice(1)}` as keyof typeof styles]);\n\n\t\t// Предопределенные варианты\n\t\tif (props.variant === \"single-column\") classes.push(styles.singleColumn);\n\t\telse if (props.variant === \"auto-1fr\") classes.push(styles.autoRows1fr);\n\t\telse if (props.variant === \"auto1fr-rows-auto\") classes.push(styles.columnsAuto1fr);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useGridContainerStyles = (\n\tprops: Pick<ResolvedGridContainerProps, \"templateColumns\" | \"templateRows\" | \"autoColumns\" | \"autoRows\" | \"areas\">\n) => {\n\treturn useMemo(() => {\n\t\tconst styles: CSSProperties = {};\n\n\t\tif (props.templateColumns) {\n\t\t\t// if (typeof props.templateColumns === \"object\") {\n\t\t\t//     styles.gridTemplateColumns = props.templateColumns;\n\t\t\t// } else {\n\t\t\tstyles.gridTemplateColumns = props.templateColumns;\n\t\t\t// }\n\t\t}\n\t\tif (props.templateRows) {\n\t\t\tstyles.gridTemplateRows = props.templateRows;\n\t\t}\n\t\tif (props.autoColumns) {\n\t\t\tstyles.gridAutoColumns = props.autoColumns;\n\t\t}\n\t\tif (props.autoRows) {\n\t\t\tstyles.gridAutoRows = props.autoRows;\n\t\t}\n\t\tif (props.areas) {\n\t\t\tstyles.gridTemplateAreas = props.areas;\n\t\t}\n\n\t\treturn styles;\n\t}, [props.templateColumns, props.templateRows, props.autoColumns, props.autoRows, props.areas]);\n};\n\nexport const useGridItemClasses = (props: ResolvedGridItemProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: ClassName[] = [styles.item];\n\n\t\t// Self alignment\n\t\tif (props.alignSelf)\n\t\t\tclasses.push(styles[`alignSelf${props.alignSelf.charAt(0).toUpperCase() + props.alignSelf.slice(1)}` as keyof typeof styles]);\n\n\t\t// Justify self\n\t\tif (props.justifySelf)\n\t\t\tclasses.push(\n\t\t\t\tstyles[`justifySelf${props.justifySelf.charAt(0).toUpperCase() + props.justifySelf.slice(1)}` as keyof typeof styles]\n\t\t\t);\n\n\t\treturn classes.filter(Boolean).join(\" \");\n\t}, [props]);\n};\n\nexport const useGridItemStyles = (props: Pick<ResolvedGridItemProps, \"area\" | \"column\" | \"row\">) => {\n\treturn useMemo(() => {\n\t\tconst styles: CSSProperties = {};\n\n\t\tif (props.area) {\n\t\t\tstyles.gridArea = props.area;\n\t\t}\n\t\tif (props.column) {\n\t\t\tstyles.gridColumn = props.column;\n\t\t}\n\t\tif (props.row) {\n\t\t\tstyles.gridRow = props.row;\n\t\t}\n\n\t\treturn styles;\n\t}, [props.area, props.column, props.row]);\n};\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveResponsiveValue, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { GridContainerProps } from \"./types\";\nimport { useGridContainerClasses, useGridContainerStyles } from \"./useGridClasses\";\n\nexport const GridContainer = forwardRef<HTMLElement, GridContainerProps>(\n\t({ children, className = \"\", as, style, templateColumns, templateRows, autoColumns, autoRows, areas, ...props }, ref) => {\n\t\tconst { activeBreakpoint } = useMatchMedia();\n\n\t\tconst resolved = useMemo(() => {\n\t\t\treturn {\n\t\t\t\t...props,\n\n\t\t\t\tinline: resolveResponsiveValue(props.inline, activeBreakpoint),\n\n\t\t\t\trow: resolveResponsiveValue(props.row, activeBreakpoint),\n\t\t\t\tcolumn: resolveResponsiveValue(props.column, activeBreakpoint),\n\t\t\t\tdense: resolveResponsiveValue(props.dense, activeBreakpoint),\n\n\t\t\t\tgap: resolveResponsiveValue(props.gap, activeBreakpoint),\n\t\t\t\tgapRow: resolveResponsiveValue(props.gapRow, activeBreakpoint),\n\t\t\t\tgapColumn: resolveResponsiveValue(props.gapColumn, activeBreakpoint),\n\n\t\t\t\talign: resolveResponsiveValue(props.align, activeBreakpoint),\n\t\t\t\tjustify: resolveResponsiveValue(props.justify, activeBreakpoint),\n\t\t\t\talignContent: resolveResponsiveValue(props.alignContent, activeBreakpoint),\n\t\t\t\tjustifyContent: resolveResponsiveValue(props.justifyContent, activeBreakpoint),\n\n\t\t\t\tvariant: resolveResponsiveValue(props.variant, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, props]);\n\n\t\tconst resolvedStyles = useMemo(() => {\n\t\t\treturn {\n\t\t\t\ttemplateColumns: resolveResponsiveValue(templateColumns, activeBreakpoint),\n\t\t\t\ttemplateRows: resolveResponsiveValue(templateRows, activeBreakpoint),\n\t\t\t\tautoColumns: resolveResponsiveValue(autoColumns, activeBreakpoint),\n\t\t\t\tautoRows: resolveResponsiveValue(autoRows, activeBreakpoint),\n\t\t\t\tareas: resolveResponsiveValue(areas, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, templateColumns, templateRows, autoColumns, autoRows, areas]);\n\n\t\tconst gridClasses = useGridContainerClasses(resolved);\n\t\tconst gridStyles = useGridContainerStyles(resolvedStyles);\n\n\t\tconst finalClassName = [gridClasses, className].filter(Boolean).join(\" \");\n\t\tconst finalStyle = { ...gridStyles, ...style };\n\t\tconst Component = as || \"div\";\n\n\t\treturn createElement(\n\t\t\tComponent,\n\n\t\t\t{\n\t\t\t\tref,\n\t\t\t\tclassName: finalClassName,\n\t\t\t\tstyle: finalStyle\n\t\t\t},\n\t\t\tchildren\n\t\t);\n\t}\n);\n\nGridContainer.displayName = \"GridContainer\";\n","import { createElement, forwardRef, useMemo } from \"react\";\n\nimport { resolveResponsiveValue, useMatchMedia } from \"@ryuzaki13/react-foundation-lib/media\";\n\nimport { GridItemProps } from \"./types\";\nimport { useGridItemClasses, useGridItemStyles } from \"./useGridClasses\";\n\nexport const GridItem = forwardRef<HTMLElement, GridItemProps>(\n\t({ children, className = \"\", as, style, area, column, row, ...props }, ref) => {\n\t\tconst { activeBreakpoint } = useMatchMedia();\n\n\t\tconst resolvedProps = useMemo(() => {\n\t\t\treturn {\n\t\t\t\t...props,\n\t\t\t\talignSelf: resolveResponsiveValue(props.alignSelf, activeBreakpoint),\n\t\t\t\tjustifySelf: resolveResponsiveValue(props.justifySelf, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, props]);\n\n\t\tconst resolvedPlacement = useMemo(() => {\n\t\t\treturn {\n\t\t\t\tarea: resolveResponsiveValue(area, activeBreakpoint),\n\t\t\t\tcolumn: resolveResponsiveValue(column, activeBreakpoint),\n\t\t\t\trow: resolveResponsiveValue(row, activeBreakpoint)\n\t\t\t};\n\t\t}, [activeBreakpoint, area, column, row]);\n\n\t\tconst gridClasses = useGridItemClasses(resolvedProps);\n\t\tconst gridStyles = useGridItemStyles(resolvedPlacement);\n\n\t\tconst finalClassName = [gridClasses, className].filter(Boolean).join(\" \");\n\t\tconst finalStyle = { ...gridStyles, ...style };\n\t\tconst Component = as || \"div\";\n\n\t\treturn createElement(\n\t\t\tComponent,\n\n\t\t\t{\n\t\t\t\tref,\n\t\t\t\tclassName: finalClassName,\n\t\t\t\tstyle: finalStyle\n\t\t\t},\n\t\t\tchildren\n\t\t);\n\t}\n);\n\nGridItem.displayName = \"GridItem\";\n","import { GridContainer } from \"./GridContainer\";\nimport { GridItem } from \"./GridItem\";\n\nexport const Grid = {\n\tContainer: GridContainer,\n\tItem: GridItem\n};\n"],"mappings":"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"}