@ryuzaki13/react-foundation-ui 3.4.3 → 3.6.0

package/dist/chunks/misc-DeGboAt-.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"misc-DeGboAt-.js","names":[],"sources":["../../src/misc/AnimatedLogo.module.scss","../../src/misc/AnimatedLogo.tsx","../../src/misc/AnimatedLogoSegment.tsx","../../src/misc/CopyTextWrapper.tsx","../../src/misc/IconWrapper.module.scss","../../src/misc/IconWrapper.tsx","../../src/misc/LoadingMessage.module.scss","../../src/misc/Message.tsx","../../src/misc/LoadingMessage.tsx","../../src/misc/LazyDynamicComponent.tsx","../../src/misc/SkeletonLine.tsx","../../src/misc/LazyValue.tsx","../../src/misc/NoData.tsx","../../src/misc/Notice.tsx","../../src/misc/OneStepScroller.module.scss","../../src/misc/OneStepScroller.tsx","../../src/misc/Scrollable.tsx","../../src/misc/State.module.scss","../../src/misc/StateIcon.tsx","../../src/misc/StateWrapper.tsx"],"sourcesContent":[".logo {\n\tsvg {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\theight: auto;\n\t}\n}\n\n.segment {\n\topacity: 0.2;\n\tanimation: pulseSteps 2s ease-in-out infinite;\n}\n\n@keyframes pulseSteps {\n\t0% {\n\t\topacity: 0.2;\n\t}\n\n\t35%,\n\t55% {\n\t\topacity: 1;\n\t}\n\n\t100% {\n\t\topacity: 0.2;\n\t}\n}\n\n@media (prefers-reduced-motion: reduce) {\n\t.segment {\n\t\tanimation: none;\n\t\topacity: 1;\n\t}\n}\n","import { type ComponentPropsWithoutRef, type ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport styles from \"./AnimatedLogo.module.scss\";\n\ntype AnimatedLogoProps = Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> & {\n\tchildren: ReactNode;\n};\n\n/**\n * Контейнер анимированного логотипа без брендовой SVG-разметки.\n * Host-проект передаёт собственный `svg`, а его визуальные части оборачивает в `AnimatedLogoSegment`.\n */\nexport function AnimatedLogo({ children, className, ...htmlProps }: AnimatedLogoProps) {\n\treturn (\n\t\t<div {...htmlProps} className={cn(styles.logo, className)}>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n","import { type ComponentPropsWithoutRef, type ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport styles from \"./AnimatedLogo.module.scss\";\n\ntype AnimatedLogoSegmentProps = Omit<ComponentPropsWithoutRef<\"g\">, \"children\"> & {\n\tchildren: ReactNode;\n\torder: number;\n};\n\n/**\n * Анимирует одну смысловую часть host-логотипа и сдвигает её pulse относительно предыдущих частей.\n * `order` задаётся с нуля в визуальной последовательности сегментов и преобразуется в шаг задержки 200 мс.\n */\nexport function AnimatedLogoSegment({ children, className, order, style, ...svgGroupProps }: AnimatedLogoSegmentProps) {\n\treturn (\n\t\t<g {...svgGroupProps} className={cn(styles.segment, className)} style={{ ...style, animationDelay: `${order * 200}ms` }}>\n\t\t\t{children}\n\t\t</g>\n\t);\n}\n","import { Placement } from \"@floating-ui/react\";\nimport { useCopyElementTextWithFeedback } from \"@ryuzaki13/react-foundation-lib/copy\";\nimport { CheckCheckIcon, CopyIcon } from \"lucide-react\";\n\nimport { FloatingPopover } from \"../popover\";\n\ninterface CopyTextWrapperProps {\n\tchildren: React.ReactNode;\n\tposition?: Placement;\n\tshowOnHover?: boolean;\n\tclassName?: string;\n}\n\nexport const CopyTextWrapper: React.FC<CopyTextWrapperProps> = ({ children, position = \"top\", showOnHover = true, className }) => {\n\tconst { containerRef, copyElementText, isCopied } = useCopyElementTextWithFeedback<HTMLSpanElement>();\n\n\treturn (\n\t\t<span ref={containerRef} className={className}>\n\t\t\t{children}\n\t\t\t<FloatingPopover openOnHover={showOnHover} placement={position} content={isCopied ? \"Скопировано!\" : \"Копировать текст\"}>\n\t\t\t\t<button onClick={copyElementText} aria-label={isCopied ? \"Скопировано!\" : \"Копировать текст\"}>\n\t\t\t\t\t{isCopied ? <CheckCheckIcon className=\"block statusSuccess\" /> : <CopyIcon className=\"block statusInfo\" />}\n\t\t\t\t</button>\n\t\t\t</FloatingPopover>\n\t\t</span>\n\t);\n};\n",".wrapper {\n\twidth: var(--control-height);\n\theight: var(--control-height);\n\tmargin: auto;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n","import { ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport styles from \"./IconWrapper.module.scss\";\n\ninterface IconWrapperProps {\n\tchildren: ReactNode;\n\tclassName?: string;\n}\n\nexport function IconWrapper({ className, children }: IconWrapperProps) {\n\treturn <div className={cn(styles.wrapper, className)}>{children}</div>;\n}\n",".componentLoader {\n\tmin-height: 10em;\n}\n","import { AriaRole, PropsWithChildren } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { FlexCenter } from \"../flex\";\nimport { Text, TextColor } from \"../text\";\n\ninterface MessageProps extends PropsWithChildren {\n\tclassName?: string;\n\tcolor?: TextColor;\n\tminHeight?: string | number;\n\tuppercase?: boolean;\n\trole?: AriaRole;\n}\n\nexport function Message({ className, children, color = \"muted\", role, minHeight, uppercase = true }: MessageProps) {\n\treturn (\n\t\t<FlexCenter className={cn(\"paddingMd textCenter\", className)} minHeight={minHeight}>\n\t\t\t<Text as=\"p\" weight=\"bold\" color={color} uppercase={uppercase} role={role}>\n\t\t\t\t{children}\n\t\t\t</Text>\n\t\t</FlexCenter>\n\t);\n}\n","import { type ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport styles from \"./LoadingMessage.module.scss\";\nimport { Message } from \"./Message\";\n\ntype LoadingMessageProps = {\n\tclassName?: string;\n\t/** Готовый брендовый знак, которым host-проект при необходимости дополняет сообщение о загрузке. */\n\tlogo?: ReactNode;\n\ttext?: string;\n};\n\nexport function LoadingMessage({ className, logo, text }: LoadingMessageProps) {\n\treturn (\n\t\t<Message className={cn(styles.componentLoader, logo ? undefined : \"skeletonLine\", className)}>\n\t\t\t{logo}\n\n\t\t\t{text || \"Загрузка...\"}\n\t\t</Message>\n\t);\n}\n","import { Suspense, useSyncExternalStore, type ComponentType, type ReactNode } from \"react\";\n\nimport { useLazyComponent } from \"@ryuzaki13/react-foundation-lib/hooks\";\n\nimport { LoadingMessage } from \"./LoadingMessage\";\n\ntype LazyDynamicComponentProps<T extends object> = {\n\timportFunc: () => Promise<Record<string, ComponentType<T>> | null>;\n\tcomponentName: string;\n\tcacheKey?: string;\n\tclientOnly?: boolean;\n\tfallback?: ReactNode;\n\tprops?: T;\n};\n\nconst subscribeClientOnlyMount = (onStoreChange: () => void) => {\n\tonStoreChange();\n\n\treturn () => undefined;\n};\n\nconst getClientSnapshot = () => true;\nconst getServerSnapshot = () => false;\n\n/**\n * Компонент ленивой загрузки динамически импортируемого React-компонента. Позволяет отложить загрузку тяжелых частей интерфейса до момента использования.\n */\nexport function LazyDynamicComponent<T extends object>({\n\tfallback,\n\timportFunc,\n\tcomponentName,\n\tclientOnly = false,\n\tcacheKey,\n\tprops\n}: LazyDynamicComponentProps<T>) {\n\tconst Component = useLazyComponent(importFunc, componentName, cacheKey);\n\tconst isClient = useSyncExternalStore(subscribeClientOnlyMount, getClientSnapshot, getServerSnapshot);\n\n\tconst fallbackNode = fallback ?? <LoadingMessage text=\"Ожидание компонента...\" />;\n\n\t// Client-only режим нужен для браузерных модулей, которые нельзя даже пытаться импортировать во время SSR.\n\tif (clientOnly && !isClient) return fallbackNode;\n\n\treturn (\n\t\t<Suspense fallback={fallbackNode}>\n\t\t\t{/* eslint-disable-next-line react-hooks/static-components */}\n\t\t\t<Component {...(props ?? ({} as T))} />\n\t\t</Suspense>\n\t);\n}\n","import React from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { PolymorphicComponent, PolymorphicComponentBaseProps } from \"../polymorphic\";\n\ntype SkeletonLineOwnProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentBaseProps<E> & {\n\tclassName?: string;\n};\n\ntype SkeletonLineProps<E extends React.ElementType> = SkeletonLineOwnProps<E> &\n\tOmit<React.ComponentPropsWithRef<E>, keyof SkeletonLineOwnProps>;\n\nexport const SkeletonLine = <E extends React.ElementType>({ as, className, ...props }: SkeletonLineProps<E>) => {\n\tconst Component = as || \"div\";\n\n\treturn (\n\t\t<PolymorphicComponent\n\t\t\tas={Component as React.ElementType}\n\t\t\tclassName={cn(\"skeletonLine colorTransparent radiusSm\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n","import React from \"react\";\n\nimport { SkeletonLine } from \"./SkeletonLine\";\n\ninterface LazyValueProps {\n\tvalue: React.ReactNode;\n\tisLoading?: boolean;\n}\n\nexport function LazyValue({ value, isLoading }: LazyValueProps) {\n\treturn isLoading ? <SkeletonLine>Загрузка...</SkeletonLine> : (value ?? \"-\");\n}\n","import { AriaRole } from \"react\";\n\nimport { Message } from \"./Message\";\n\ninterface NoDataProps {\n\tclassName?: string;\n\ttext?: string;\n\tminHeight?: string | number;\n\trole?: AriaRole;\n}\n\nexport function NoData({ className, text, role, minHeight = \"5em\" }: NoDataProps) {\n\treturn (\n\t\t<Message className={className} color=\"muted\" minHeight={minHeight} role={role}>\n\t\t\t{text || \"Нет данных\"}\n\t\t</Message>\n\t);\n}\n","import { AriaRole, PropsWithChildren } from \"react\";\n\nimport { Message } from \"./Message\";\n\ninterface NoticeProps extends PropsWithChildren {\n\tisError?: boolean;\n\tclassName?: string;\n\trole?: AriaRole;\n}\n\nexport function Notice({ className, isError, role, children }: NoticeProps) {\n\treturn (\n\t\t<Message className={className} color={isError ? \"error\" : \"secondary\"} role={role}>\n\t\t\t{children}\n\t\t</Message>\n\t);\n}\n",".oneStepScroller {\n\toverflow: hidden;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-xs);\n\tmin-width: 0;\n}\n\n.ossViewport {\n\toverflow: hidden;\n\toutline: none;\n\tmin-width: 0;\n\tflex: 1 1 auto;\n}\n\n.ossScroller {\n\tdisplay: flex;\n\tflex-wrap: nowrap;\n\tgap: var(--space-sm);\n\talign-items: end;\n\toverflow-x: auto;\n\toverflow-y: hidden;\n\tscroll-behavior: smooth;\n\t-webkit-overflow-scrolling: touch;\n\tscrollbar-width: none; /* firefox */\n\n\t::-webkit-scrollbar {\n\t\theight: 0;\n\t}\n}\n\n.ossButton {\n\t// position: absolute;\n\ttop: 0;\n\tz-index: 10;\n\twidth: var(--control-height);\n\theight: 100%;\n\tflex: 0 0 var(--control-height);\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\t// border: var(--border);\n\tborder-radius: var(--radius-sm);\n\tcolor: var(--content-2);\n\t// background-color: var(--surface-0);\n\t// opacity: 0.75;\n\n\ttransition-property: opacity, color;\n\ttransition-duration: var(--transition-fast);\n\n\t&:hover {\n\t\topacity: 1;\n\t\tcolor: var(--content-0);\n\t}\n\n\t&:disabled {\n\t\topacity: 0.5;\n\t\tpointer-events: none;\n\t}\n\n\t// &.prev {\n\t// \tleft: 0;\n\t// }\n\n\t// &.next {\n\t// \tright: 0;\n\t// }\n}\n","import React, { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"lucide-react\";\n\nimport styles from \"./OneStepScroller.module.scss\";\n\ninterface OneStepScrollerProps {\n\tchildren: React.ReactNode;\n\tclassName?: string;\n\t/**\n\t * CSS-селектор элементов, которые считаются \"шагами\" скролла.\n\t * По умолчанию используются прямые потомки скроллера.\n\t */\n\titemSelector?: string;\n\t/**\n\t * Дополнительный внутренний отступ (px) при прокрутке к фокусируемому элементу.\n\t */\n\tscrollPadding?: number;\n\t/**\n\t * Плавная прокрутка для кнопок и авто-доводки до видимости.\n\t */\n\tsmooth?: boolean;\n}\n\nconst EDGE_EPSILON_PX = 1;\n\nfunction maxScrollLeft(scroller: HTMLElement) {\n\treturn Math.max(0, scroller.scrollWidth - scroller.clientWidth);\n}\n\n/**\n * Горизонтальный скроллер \"по одному элементу\".\n *\n * Ожидает элементы фиксированной ширины (или близкой к фиксированной),\n * чтобы шаг скролла соответствовал ширине одного элемента.\n */\nexport const OneStepScroller: React.FC<OneStepScrollerProps> = ({\n\tchildren,\n\tclassName,\n\titemSelector,\n\tscrollPadding = 6,\n\tsmooth = true\n}) => {\n\tconst scrollerRef = useRef<HTMLDivElement | null>(null);\n\tconst rafIdRef = useRef<number | null>(null);\n\n\tconst [canScrollPrev, setCanScrollPrev] = useState(false);\n\tconst [canScrollNext, setCanScrollNext] = useState(false);\n\n\t/**\n\t * Получить список элементов-\"шагов\".\n\t *\n\t * Оптимизация: для дефолтного поведения используем `children` DOM-узла,\n\t * чтобы не выполнять `querySelectorAll` на каждый вызов.\n\t */\n\tconst getItems = useCallback((): HTMLElement[] => {\n\t\tconst scroller = scrollerRef.current;\n\t\tif (!scroller) return [];\n\n\t\tif (!itemSelector) {\n\t\t\treturn Array.from(scroller.children).filter((node): node is HTMLElement => node instanceof HTMLElement);\n\t\t}\n\n\t\treturn Array.from(scroller.querySelectorAll<HTMLElement>(itemSelector));\n\t}, [itemSelector]);\n\n\t/**\n\t * Найти \"элемент шага\" для произвольного target внутри скроллера.\n\t */\n\tconst findItemForTarget = useCallback(\n\t\t(target: HTMLElement): HTMLElement | null => {\n\t\t\tconst scroller = scrollerRef.current;\n\t\t\tif (!scroller) return null;\n\n\t\t\tif (itemSelector) {\n\t\t\t\tconst item = target.closest<HTMLElement>(itemSelector);\n\t\t\t\tif (item && scroller.contains(item)) return item;\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tlet node: HTMLElement | null = target;\n\t\t\twhile (node && node.parentElement && node.parentElement !== scroller) {\n\t\t\t\tnode = node.parentElement;\n\t\t\t}\n\n\t\t\tif (node && node.parentElement === scroller) return node;\n\t\t\treturn null;\n\t\t},\n\t\t[itemSelector]\n\t);\n\n\t/**\n\t * Обновить состояние кнопок \"назад/вперед\".\n\t * Состояние меняется только при реальном отличии, чтобы не триггерить\n\t * лишние перерисовки на каждом событии scroll.\n\t */\n\tconst updateScrollButtons = useCallback(() => {\n\t\tconst scroller = scrollerRef.current;\n\t\tif (!scroller) {\n\t\t\tsetCanScrollPrev(false);\n\t\t\tsetCanScrollNext(false);\n\t\t\treturn;\n\t\t}\n\n\t\tconst maxScrollLeft = Math.max(0, scroller.scrollWidth - scroller.clientWidth);\n\t\tconst current = Math.max(0, Math.min(scroller.scrollLeft, maxScrollLeft));\n\n\t\tconst nextCanScrollPrev = current > EDGE_EPSILON_PX;\n\t\tconst nextCanScrollNext = current < maxScrollLeft - EDGE_EPSILON_PX;\n\n\t\tsetCanScrollPrev((prev) => (prev === nextCanScrollPrev ? prev : nextCanScrollPrev));\n\t\tsetCanScrollNext((prev) => (prev === nextCanScrollNext ? prev : nextCanScrollNext));\n\t}, []);\n\n\t/**\n\t * Запланировать обновление кнопок в следующий animation frame.\n\t * Это снижает частоту вычислений при интенсивном scroll/resize.\n\t */\n\tconst scheduleUpdateScrollButtons = useCallback(() => {\n\t\tif (rafIdRef.current !== null) return;\n\n\t\trafIdRef.current = requestAnimationFrame(() => {\n\t\t\trafIdRef.current = null;\n\t\t\tupdateScrollButtons();\n\t\t});\n\t}, [updateScrollButtons]);\n\n\t/**\n\t * Прокрутка на N элементов (N может быть отрицательным).\n\t */\n\tconst scrollByItems = useCallback(\n\t\t(count: number) => {\n\t\t\tconst scroller = scrollerRef.current;\n\t\t\tif (!scroller) return;\n\n\t\t\tconst firstItem = getItems()[0];\n\t\t\tif (!firstItem) return;\n\n\t\t\tconst step = firstItem.getBoundingClientRect().width;\n\t\t\tif (!step) return;\n\n\t\t\tconst delta = Math.round(count * step);\n\t\t\tconst maxScrollLeft = Math.max(0, scroller.scrollWidth - scroller.clientWidth);\n\t\t\tconst target = Math.max(0, Math.min(scroller.scrollLeft + delta, maxScrollLeft));\n\n\t\t\tscroller.scrollTo({\n\t\t\t\tleft: target,\n\t\t\t\tbehavior: smooth ? \"smooth\" : \"auto\"\n\t\t\t});\n\t\t},\n\t\t[getItems, smooth]\n\t);\n\n\t/**\n\t * Гарантировать полную видимость элемента в пределах viewport скроллера.\n\t */\n\tconst ensureFullyVisible = useCallback(\n\t\t(el: HTMLElement) => {\n\t\t\tconst scroller = scrollerRef.current;\n\t\t\tif (!scroller) return;\n\n\t\t\tconst scrollerRect = scroller.getBoundingClientRect();\n\t\t\tconst elementRect = el.getBoundingClientRect();\n\n\t\t\tconst elementLeft = elementRect.left - scrollerRect.left + scroller.scrollLeft;\n\t\t\tconst elementRight = elementLeft + elementRect.width;\n\n\t\t\tconst visibleLeft = scroller.scrollLeft;\n\t\t\tconst visibleRight = scroller.scrollLeft + scroller.clientWidth;\n\n\t\t\tif (elementLeft >= visibleLeft + EDGE_EPSILON_PX && elementRight <= visibleRight - EDGE_EPSILON_PX) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tlet targetScrollLeft = scroller.scrollLeft;\n\t\t\tif (elementLeft < visibleLeft) {\n\t\t\t\ttargetScrollLeft = Math.max(0, elementLeft - scrollPadding);\n\t\t\t} else if (elementRight > visibleRight) {\n\t\t\t\ttargetScrollLeft = Math.min(maxScrollLeft(scroller), elementRight - scroller.clientWidth + scrollPadding);\n\t\t\t}\n\n\t\t\tscroller.scrollTo({\n\t\t\t\tleft: Math.round(targetScrollLeft),\n\t\t\t\tbehavior: smooth ? \"smooth\" : \"auto\"\n\t\t\t});\n\t\t},\n\t\t[scrollPadding, smooth]\n\t);\n\n\tuseEffect(() => {\n\t\tconst scroller = scrollerRef.current;\n\t\tif (!scroller) return;\n\n\t\tconst handleFocusIn = (event: FocusEvent) => {\n\t\t\tconst target = event.target;\n\t\t\tif (!(target instanceof HTMLElement)) return;\n\n\t\t\tconst item = findItemForTarget(target);\n\t\t\tif (item) ensureFullyVisible(item);\n\t\t};\n\n\t\tscroller.addEventListener(\"focusin\", handleFocusIn);\n\t\treturn () => scroller.removeEventListener(\"focusin\", handleFocusIn);\n\t}, [ensureFullyVisible, findItemForTarget]);\n\n\t/**\n\t * Наблюдаем только за размером скроллера и изменением его DOM-структуры.\n\t * Это дешевле, чем подписка ResizeObserver на каждый элемент + IntersectionObserver.\n\t */\n\tuseEffect(() => {\n\t\tconst scroller = scrollerRef.current;\n\t\tif (!scroller) return;\n\n\t\tconst onScroll = () => scheduleUpdateScrollButtons();\n\t\tscroller.addEventListener(\"scroll\", onScroll, { passive: true });\n\n\t\tlet resizeObserver: ResizeObserver | null = null;\n\t\tif (typeof ResizeObserver !== \"undefined\") {\n\t\t\tresizeObserver = new ResizeObserver(scheduleUpdateScrollButtons);\n\t\t\tresizeObserver.observe(scroller);\n\t\t}\n\n\t\tlet mutationObserver: MutationObserver | null = null;\n\t\tif (typeof MutationObserver !== \"undefined\") {\n\t\t\tmutationObserver = new MutationObserver(scheduleUpdateScrollButtons);\n\t\t\tmutationObserver.observe(scroller, {\n\t\t\t\tchildList: true,\n\t\t\t\tsubtree: false\n\t\t\t});\n\t\t}\n\n\t\tscheduleUpdateScrollButtons();\n\n\t\treturn () => {\n\t\t\tscroller.removeEventListener(\"scroll\", onScroll);\n\t\t\tresizeObserver?.disconnect();\n\t\t\tmutationObserver?.disconnect();\n\n\t\t\tif (rafIdRef.current !== null) {\n\t\t\t\tcancelAnimationFrame(rafIdRef.current);\n\t\t\t\trafIdRef.current = null;\n\t\t\t}\n\t\t};\n\t}, [scheduleUpdateScrollButtons]);\n\n\t/**\n\t * При изменении children просим пересчитать видимость кнопок.\n\t */\n\tuseEffect(() => {\n\t\tscheduleUpdateScrollButtons();\n\t}, [children, scheduleUpdateScrollButtons]);\n\n\tconst handlePrev = () => scrollByItems(-1);\n\tconst handleNext = () => scrollByItems(1);\n\n\t/**\n\t * Клавиатурная доступность: стрелки влево/вправо двигают на один шаг.\n\t */\n\tconst onWrapperKeyDown = (e: React.KeyboardEvent) => {\n\t\tif (e.key === \"ArrowLeft\") {\n\t\t\te.preventDefault();\n\t\t\thandlePrev();\n\t\t} else if (e.key === \"ArrowRight\") {\n\t\t\te.preventDefault();\n\t\t\thandleNext();\n\t\t}\n\t};\n\n\tconst hasScroll = canScrollPrev || canScrollNext;\n\n\treturn (\n\t\t<div className={cn(styles.oneStepScroller, className)} style={{ position: \"relative\" }}>\n\t\t\t{hasScroll && (\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\taria-label=\"Прокрутить шаг влево\"\n\t\t\t\t\tclassName={styles.ossButton}\n\t\t\t\t\tonClick={handlePrev}\n\t\t\t\t\tdisabled={!canScrollPrev}>\n\t\t\t\t\t<ChevronLeftIcon />\n\t\t\t\t</button>\n\t\t\t)}\n\n\t\t\t<div className={styles.ossViewport} onKeyDown={onWrapperKeyDown} role=\"group\" aria-label=\"Элементы прокрутки\">\n\t\t\t\t<div className={styles.ossScroller} ref={scrollerRef} aria-live=\"polite\">\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t{hasScroll && (\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\taria-label=\"Прокрутить шаг вправо\"\n\t\t\t\t\tclassName={styles.ossButton}\n\t\t\t\t\tonClick={handleNext}\n\t\t\t\t\tdisabled={!canScrollNext}>\n\t\t\t\t\t<ChevronRightIcon />\n\t\t\t\t</button>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n","import { forwardRef, PropsWithChildren } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\ninterface ScrollableProps extends PropsWithChildren {\n\tclassName?: string;\n\theight?: string | number;\n\tstable?: boolean;\n\toverscroll?: boolean;\n}\n\nexport const Scrollable = forwardRef<HTMLDivElement, ScrollableProps>(({ children, height, stable, overscroll, className }, ref) => {\n\treturn (\n\t\t<div ref={ref} className={cn(\"scrollable\", stable && \"stable\", overscroll && \"overscroll\", className)} style={{ height }}>\n\t\t\t{children}\n\t\t</div>\n\t);\n});\n\ninterface ScrollableBlockProps extends ScrollableProps {\n\tblockClassName?: string;\n}\n\nexport const ScrollableBlock = forwardRef<HTMLDivElement, ScrollableBlockProps>(({ blockClassName, ...props }, ref) => {\n\treturn (\n\t\t<div className={cn(blockClassName, \"overflowHidden w100 h100\")}>\n\t\t\t<Scrollable ref={ref} {...props} />\n\t\t</div>\n\t);\n});\n",".stateWrapper {\n\ttext-decoration: none;\n\tcolor: inherit;\n\tdisplay: block;\n\n\t// border: var(--border-width) solid var(--state-border-color, transparent);\n\tborder-left-style: solid;\n\tborder-left-color: var(--state-border-color, transparent);\n\tborder-left-width: 0.0625em; // 1px\n\tpadding-left: 0.25em; // 4px + 1px border\n\n\t&.status {\n\t\tborder-left-width: 0.3125em; // 5px\n\t\tpadding-left: 0;\n\n\t\t&.information {\n\t\t\tborder-left-color: var(--info-fill);\n\t\t}\n\n\t\t&.success {\n\t\t\tborder-left-color: var(--success-fill);\n\t\t}\n\n\t\t&.warning {\n\t\t\tborder-left-color: var(--warning-fill);\n\t\t}\n\n\t\t&.error {\n\t\t\tborder-left-color: var(--error-fill);\n\t\t}\n\t}\n}\n\n.state {\n\t&.information {\n\t\tcolor: var(--info-text);\n\n\t\tfill: var(--info-fill);\n\t\tstroke: var(--info-on-fill);\n\t}\n\n\t&.success {\n\t\tcolor: var(--success-text);\n\n\t\tfill: var(--success-fill);\n\t\tstroke: var(--success-on-fill);\n\t}\n\n\t&.warning {\n\t\tcolor: var(--warning-text);\n\n\t\tfill: var(--warning-fill);\n\t\tstroke: var(--warning-on-fill);\n\t\tstroke-width: 2px;\n\t}\n\n\t&.error {\n\t\tcolor: var(--error-text);\n\n\t\tfill: var(--error-fill);\n\t\tstroke: var(--error-on-fill);\n\t}\n}\n","import React from \"react\";\n\nimport { State } from \"@ryuzaki13/react-foundation-lib/types\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { CircleAlertIcon, CircleCheckIcon, CircleXIcon, InfoIcon } from \"lucide-react\";\n\nimport styles from \"./State.module.scss\";\n\ninterface StateIconProps {\n\tstate: State;\n\ttext: string;\n\tclassName?: string;\n}\n\nexport const StateIcon: React.FC<StateIconProps> = ({ state = \"none\", text, className }) => {\n\tconst renderIcon = () => {\n\t\tswitch (state) {\n\t\t\tcase \"error\":\n\t\t\t\treturn <ErrorIcon />;\n\t\t\tcase \"warning\":\n\t\t\t\treturn <WarningIcon />;\n\t\t\tcase \"success\":\n\t\t\t\treturn <SuccessIcon />;\n\t\t\tcase \"information\":\n\t\t\t\treturn <InformationIcon />;\n\t\t\tdefault:\n\t\t\t\treturn null;\n\t\t}\n\t};\n\n\treturn (\n\t\t<div className={cn(\"flexCenter gapSm\", className)}>\n\t\t\t{renderIcon()}\n\t\t\t{text}\n\t\t</div>\n\t);\n};\n\ninterface RenderStateIconProps {\n\tstate?: State;\n}\n\nexport const RenderStateIcon: React.FC<RenderStateIconProps> = ({ state }) => {\n\tswitch (state) {\n\t\tcase \"error\":\n\t\t\treturn <ErrorIcon />;\n\t\tcase \"warning\":\n\t\t\treturn <WarningIcon />;\n\t\tcase \"success\":\n\t\t\treturn <SuccessIcon />;\n\t\tcase \"information\":\n\t\t\treturn <InformationIcon />;\n\t\tdefault:\n\t\t\treturn null;\n\t}\n};\n\nexport const ErrorIcon = () => {\n\treturn <CircleXIcon className={cn(styles.state, styles.error)} />;\n};\nexport const WarningIcon = () => {\n\treturn <CircleAlertIcon className={cn(styles.state, styles.warning)} />;\n};\nexport const SuccessIcon = () => {\n\treturn <CircleCheckIcon className={cn(styles.state, styles.success)} />;\n};\nexport const InformationIcon = () => {\n\treturn <InfoIcon className={cn(styles.state, styles.information)} />;\n};\n","import React from \"react\";\n\nimport { State } from \"@ryuzaki13/react-foundation-lib/types\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { PolymorphicComponent, PolymorphicComponentBaseProps } from \"../polymorphic\";\n\nimport styles from \"./State.module.scss\";\n\ntype StateWrapperOwnProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentBaseProps<E> & {\n\tstate?: State;\n\tclassName?: string;\n};\n\ntype StateWrapperProps<E extends React.ElementType> = StateWrapperOwnProps<E> &\n\tOmit<React.ComponentPropsWithRef<E>, keyof StateWrapperOwnProps>;\n\nexport function StateWrapper<E extends React.ElementType>({ as, state, className, ...props }: StateWrapperProps<E>) {\n\tconst status = state?.toLowerCase() ?? \"none\";\n\tconst statusClass = styles[status as keyof typeof styles];\n\tconst isStatused = status && status !== \"none\";\n\n\tconst Component = as || \"div\";\n\n\treturn (\n\t\t<PolymorphicComponent\n\t\t\tas={Component as React.ElementType}\n\t\t\tclassName={cn(styles.stateWrapper, isStatused && styles.status, statusClass, className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":"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"}

package/dist/chunks/modal-dplfAaER.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal-dplfAaER.js","names":[],"sources":["../../src/modal/Modal.module.scss","../../src/modal/modalMotion.ts","../../src/modal/useModalManager.ts","../../src/modal/Modal.tsx","../../src/modal/ModalManagerProvider.tsx"],"sourcesContent":["@use \"@/styles/mixins\" as *;\n\n.modal {\n\t--modal-border-radius: 0;\n\n\tdisplay: grid;\n\tgrid-auto-rows: auto 1fr;\n\tgrid-area: 1 / 1;\n\tz-index: var(--z-modal);\n\n\tborder: var(--border);\n\tborder-radius: var(--modal-border-radius);\n\tbackground-color: var(--surface-1);\n\tbox-shadow: var(--shadow-lg);\n\n\t&:not(:last-child) {\n\t\tpointer-events: none;\n\t\tfilter: grayscale(0.5) opacity(0.75);\n\t\t// opacity: 0.5;\n\t}\n\n\twidth: 100%;\n\theight: 100%;\n\tmax-width: none;\n\tmax-height: none;\n}\n\n.header {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tbackground-color: var(--surface-2);\n\tborder-top-left-radius: var(--modal-border-radius);\n\tborder-top-right-radius: var(--modal-border-radius);\n}\n\n.headerText {\n\tmargin: 0;\n\tpadding-inline: var(--space-md);\n\tfont-size: var(--font-size-md);\n\tfont-variation-settings: \"wght\" 600;\n}\n\n.headerButton {\n\tmargin-block: var(--space-xs);\n\tmargin-inline: var(--space-sm);\n\tflex: 0;\n}\n\n.body {\n\toverflow: hidden;\n\tborder-bottom-left-radius: var(--modal-border-radius);\n\tborder-bottom-right-radius: var(--modal-border-radius);\n}\n\n@include mobile-above {\n\t.modal {\n\t\theight: var(--modal-height, fit-content);\n\t\tmax-height: calc(100dvh - var(--space-lg));\n\t\t--modal-border-radius: var(--radius-md);\n\n\t\t&.sm {\n\t\t\tmax-width: min(30em, 93dvw);\n\t\t}\n\n\t\t&.md {\n\t\t\tmax-width: min(50em, 93dvw);\n\t\t}\n\n\t\t&.lg {\n\t\t\tmax-width: min(70em, 93dvw);\n\t\t}\n\n\t\t&.xl {\n\t\t\tmax-width: min(80em, 93dvw);\n\t\t}\n\n\t\t&.xxl {\n\t\t\twidth: 95dvw;\n\t\t\theight: 92dvh;\n\t\t\tmax-width: none;\n\t\t\tmax-height: none;\n\t\t}\n\n\t\t&.inside {\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tmax-width: none;\n\t\t\tmax-height: none;\n\n\t\t\t--modal-border-radius: 0;\n\t\t}\n\t}\n}\n","import { type Transition, type Variants } from \"motion/react\";\n\n/**\n * Варианты задают единый спокойный переход для появления и удаления modal-панели.\n * Конфигурация приватна для primitive: потребители управляют только состоянием `isOpen`.\n */\nexport const modalMotionVariants = {\n\thidden: {\n\t\topacity: 0,\n\t\tscale: 0.96,\n\t\ty: 12\n\t},\n\tvisible: {\n\t\topacity: 1,\n\t\tscale: 1,\n\t\ty: 0\n\t}\n} satisfies Variants;\n\n/** Переход сохраняет отзывчивое открытие и дает exit-анимации завершиться до удаления portal content. */\nexport const modalMotionTransition = {\n\tduration: 0.18,\n\tease: [0.22, 1, 0.36, 1]\n} satisfies Transition;\n\n/** При системном reduced-motion остается только мгновенная смена видимости без пространственного движения. */\nexport const reducedModalMotionTransition = {\n\tduration: 0\n} satisfies Transition;\n","import { createContext, useContext } from \"react\";\n\nexport const ModalManagerContext = createContext<{\n\tmodals: string[];\n\topenModal: (id: string) => void;\n\tcloseModal: (id: string) => void;\n\tisTopModal: (id: string) => boolean;\n}>({\n\tmodals: [],\n\topenModal: () => {},\n\tcloseModal: () => {},\n\tisTopModal: () => false\n});\n\nexport const useModalManager = () => useContext(ModalManagerContext);\n","import React, { Children, useEffect, useId, useRef } from \"react\";\n\nimport { getOrCreatePortalRoot, useEscapeDismiss, useOverlayFocus } from \"@ryuzaki13/react-foundation-lib/dom\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { X } from \"lucide-react\";\nimport { AnimatePresence, motion, useReducedMotion } from \"motion/react\";\nimport { createPortal } from \"react-dom\";\n\nimport { Button } from \"../button\";\nimport { FlexContainer } from \"../flex\";\nimport { GridContainer } from \"../grid\";\nimport { Scrollable } from \"../misc\";\n\nimport styles from \"./Modal.module.scss\";\nimport { modalMotionTransition, modalMotionVariants, reducedModalMotionTransition } from \"./modalMotion\";\nimport { ModalSize } from \"./types\";\nimport { useModalManager } from \"./useModalManager\";\n\n// Подкомпоненты\nexport interface ModalCompositionProps {\n\tchildren: React.ReactNode;\n\tclassName?: string;\n}\n\nexport const ModalToolbar: React.FC<ModalCompositionProps> = ({ children, className }) => {\n\treturn <div className={cn(\"surface2 paddingMd borderBottom\", className)}>{children}</div>;\n};\nModalToolbar.displayName = \"Modal.Toolbar\";\n\nexport const ModalContent: React.FC<ModalCompositionProps & { scrollable?: boolean }> = ({ children, className, scrollable }) => {\n\treturn (\n\t\t<div className={cn(\"paddingMd h100 overflowHidden\", className)}>\n\t\t\t{scrollable ? <Scrollable className=\"h100\">{children}</Scrollable> : children}\n\t\t</div>\n\t);\n};\nModalContent.displayName = \"Modal.Content\";\n\nexport const ModalFooter: React.FC<ModalCompositionProps> = ({ children, className }) => {\n\treturn (\n\t\t<div className={cn(\"surface2 borderTop paddingMd\", className)}>\n\t\t\t<FlexContainer gap=\"sm\" align=\"center\" justify=\"end\">\n\t\t\t\t{children}\n\t\t\t</FlexContainer>\n\t\t</div>\n\t);\n};\nModalFooter.displayName = \"Modal.Footer\";\n\ntype ToolbarElement = React.ReactElement<ModalCompositionProps, typeof ModalToolbar>;\ntype ContentElement = React.ReactElement<ModalCompositionProps, typeof ModalContent>;\ntype FooterElement = React.ReactElement<ModalCompositionProps, typeof ModalFooter>;\n\ntype ModalChildren =\n\t[ToolbarElement, ContentElement, FooterElement] | [ToolbarElement, ContentElement] | [ContentElement, FooterElement] | ContentElement;\n\ntype ModalStyle = React.CSSProperties & {\n\t\"--modal-height\"?: string;\n};\n\nexport interface ModalProps {\n\t/** Открыто ли модальное окно */\n\tisOpen?: boolean;\n\t/** Заголовок */\n\ttitle?: string;\n\t/** Размер модального окна */\n\tsize?: keyof typeof ModalSize;\n\t/** Явная высота модального окна выше мобильного breakpoint */\n\theight?: string;\n\t/** Обработчик закрытия */\n\tonClose: () => void;\n\tchildren: ModalChildren;\n}\n\nexport const Modal: React.FC<ModalProps> = ({ isOpen, title, size = \"sm\", height, onClose, children }) => {\n\tconst modalId = useId();\n\tconst titleId = useId();\n\n\tconst { modals, openModal, closeModal, isTopModal } = useModalManager();\n\tconst shouldReduceMotion = useReducedMotion();\n\tconst restoreFocusTargetRef = useRef<HTMLElement | null>(null);\n\tconst restoreFocusAnimationFrameRef = useRef(0);\n\tconst modalStyle: ModalStyle = { \"--modal-height\": height };\n\n\t/**\n\t * Если provider менеджера не подключен, считаем одиночную модалку активной,\n\t * иначе логика Escape/focus trap никогда не включится.\n\t */\n\tconst isActive = isOpen && (modals.length === 0 || isTopModal(modalId));\n\n\tuseEffect(() => {\n\t\tif (isOpen) {\n\t\t\trestoreFocusTargetRef.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;\n\t\t}\n\t}, [isOpen]);\n\n\tconst modalRef = useOverlayFocus<HTMLDivElement>({ active: isOpen || false, trapFocus: true, restoreFocus: false });\n\n\tuseEscapeDismiss({\n\t\tactive: isActive || false,\n\t\tonDismiss: onClose,\n\t\tcontainerRef: modalRef\n\t});\n\n\tuseEffect(() => {\n\t\tif (isOpen) {\n\t\t\topenModal(modalId);\n\t\t}\n\t}, [isOpen, modalId, openModal]);\n\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\twindow.cancelAnimationFrame(restoreFocusAnimationFrameRef.current);\n\t\t\tcloseModal(modalId);\n\t\t};\n\t}, [closeModal, modalId]);\n\n\tfunction handleExitComplete() {\n\t\tcloseModal(modalId);\n\t\tconst restoreFocusTarget = restoreFocusTargetRef.current;\n\n\t\t/**\n\t\t * Менеджер снимает inert в passive effect после обновления стека.\n\t\t * Следующий animation frame гарантирует, что trigger снова доступен для фокуса.\n\t\t */\n\t\trestoreFocusAnimationFrameRef.current = window.requestAnimationFrame(() => {\n\t\t\tif (restoreFocusTarget?.isConnected) {\n\t\t\t\trestoreFocusTarget.focus();\n\t\t\t}\n\t\t\trestoreFocusTargetRef.current = null;\n\t\t});\n\t}\n\n\tconst modalRoot = getOrCreatePortalRoot(\"modal-root\");\n\n\tif (!modalRoot) {\n\t\treturn null;\n\t}\n\n\tlet toolbar: React.ReactNode = null;\n\tlet content: React.ReactNode = null;\n\tlet footer: React.ReactNode = null;\n\n\tconst childArray = Children.toArray(children) as (ToolbarElement | ContentElement | FooterElement)[];\n\n\tfor (const child of childArray) {\n\t\tconst typeName = child.type.displayName;\n\n\t\tswitch (typeName) {\n\t\t\tcase ModalToolbar.displayName:\n\t\t\t\tif (toolbar) throw new Error(\"Modal: duplicate <Toolbar> found\");\n\t\t\t\ttoolbar = child; //.props.children;\n\t\t\t\tbreak;\n\t\t\tcase ModalFooter.displayName:\n\t\t\t\tif (footer) throw new Error(\"Modal: duplicate <Footer> found\");\n\t\t\t\tfooter = child; //props.children;\n\t\t\t\tbreak;\n\t\t\tcase ModalContent.displayName:\n\t\t\t\tif (content) throw new Error(\"Modal: duplicate <Content> found\");\n\t\t\t\tcontent = child; //.props.children;\n\t\t\t\tbreak;\n\t\t}\n\t}\n\n\treturn createPortal(\n\t\t<AnimatePresence onExitComplete={handleExitComplete}>\n\t\t\t{isOpen ? (\n\t\t\t\t<motion.div\n\t\t\t\t\tref={modalRef}\n\t\t\t\t\tclassName={cn(styles.modal, styles[size])}\n\t\t\t\t\tstyle={modalStyle}\n\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\taria-labelledby={titleId}\n\t\t\t\t\taria-describedby={`${titleId}-content`}\n\t\t\t\t\tinitial=\"hidden\"\n\t\t\t\t\tanimate=\"visible\"\n\t\t\t\t\texit=\"hidden\"\n\t\t\t\t\tvariants={modalMotionVariants}\n\t\t\t\t\ttransition={shouldReduceMotion ? reducedModalMotionTransition : modalMotionTransition}>\n\t\t\t\t\t<div className={cn(styles.header, toolbar ? \"\" : \"borderBottom\")}>\n\t\t\t\t\t\t<h3 className={styles.headerText} id={titleId}>\n\t\t\t\t\t\t\t{title}\n\t\t\t\t\t\t</h3>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={<X />}\n\t\t\t\t\t\t\tclassName={styles.headerButton}\n\t\t\t\t\t\t\tvariant={\"ghost\"}\n\t\t\t\t\t\t\taria-label={\"Закрыть модальное окно\"}\n\t\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<GridContainer\n\t\t\t\t\t\tid={`${titleId}-content`}\n\t\t\t\t\t\ttemplateRows={`${toolbar ? \"auto\" : \"\"} 1fr ${footer ? \"auto\" : \"\"}`.trim()}\n\t\t\t\t\t\t// gap=\"md\"\n\t\t\t\t\t\tclassName={styles.body}>\n\t\t\t\t\t\t{toolbar}\n\t\t\t\t\t\t{content}\n\t\t\t\t\t\t{footer}\n\t\t\t\t\t</GridContainer>\n\t\t\t\t</motion.div>\n\t\t\t) : null}\n\t\t</AnimatePresence>,\n\t\tmodalRoot\n\t);\n};\n","// ModalManagerContext.tsx\nimport React, { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { ModalManagerContext } from \"./useModalManager\";\n\nexport interface ModalManagerProviderProps {\n\tchildren: React.ReactNode;\n\t/** Компенсирует исчезновение скроллбара правым padding у body. */\n\tcompensateScrollbar?: boolean;\n}\n\n/**\n * Провайдер для централизованного управления стеком модальных окон. Дает вложенным компонентам доступ к открытию и закрытию модалок через контекст.\n */\nexport function ModalManagerProvider({ children, compensateScrollbar = false }: ModalManagerProviderProps) {\n\tconst [modals, setModals] = useState<string[]>([]);\n\tconst prevModalsLength = useRef(0);\n\tconst scrollbarWidth = useRef(0);\n\tconst bodyPaddingRight = useRef(\"\");\n\tconst isScrollbarCompensated = useRef(false);\n\n\tconst openModal = useCallback((id: string) => {\n\t\tsetModals((prev) => [...prev, id]);\n\t}, []);\n\n\tconst closeModal = useCallback((id: string) => {\n\t\tsetModals((prev) => prev.filter((mid) => mid !== id));\n\t}, []);\n\n\tconst isTopModal = useCallback(\n\t\t(id: string) => {\n\t\t\treturn modals[modals.length - 1] === id;\n\t\t},\n\t\t[modals]\n\t);\n\n\tuseEffect(() => {\n\t\tconst wasEmpty = prevModalsLength.current === 0;\n\n\t\tif (wasEmpty && modals.length > 0) {\n\t\t\t// первая модалка открыта — ставим стили\n\t\t\tconst scrollY = window.scrollY;\n\t\t\tconst appRoot = document.querySelector(\"#app-root\");\n\t\t\tscrollbarWidth.current = Math.max(0, window.innerWidth - document.documentElement.clientWidth);\n\t\t\tbodyPaddingRight.current = document.body.style.paddingRight;\n\n\t\t\tdocument.body.style.position = \"fixed\";\n\t\t\tdocument.body.style.top = `-${scrollY}px`;\n\t\t\tdocument.body.style.width = \"100%\";\n\n\t\t\tif (compensateScrollbar) {\n\t\t\t\tdocument.body.style.paddingRight = `${scrollbarWidth.current}px`;\n\t\t\t\tisScrollbarCompensated.current = true;\n\t\t\t}\n\n\t\t\tappRoot?.setAttribute(\"inert\", \"true\");\n\n\t\t\tprevModalsLength.current = modals.length;\n\t\t\treturn;\n\t\t}\n\n\t\tif (!wasEmpty && modals.length > 0 && compensateScrollbar !== isScrollbarCompensated.current) {\n\t\t\tdocument.body.style.paddingRight = compensateScrollbar ? `${scrollbarWidth.current}px` : bodyPaddingRight.current;\n\t\t\tisScrollbarCompensated.current = compensateScrollbar;\n\t\t}\n\n\t\tif (!wasEmpty && modals.length === 0) {\n\t\t\t// последняя модалка закрыта — снимаем стили\n\t\t\tconst appRoot = document.querySelector(\"#app-root\");\n\t\t\tconst scrollY = parseInt(document.body.style.top || \"0\") * -1;\n\n\t\t\tdocument.body.style.position = \"\";\n\t\t\tdocument.body.style.top = \"\";\n\t\t\tdocument.body.style.width = \"\";\n\n\t\t\tif (isScrollbarCompensated.current) {\n\t\t\t\tdocument.body.style.paddingRight = bodyPaddingRight.current;\n\t\t\t\tisScrollbarCompensated.current = false;\n\t\t\t}\n\n\t\t\tappRoot?.removeAttribute(\"inert\");\n\n\t\t\twindow.scrollTo({ top: scrollY, left: 0, behavior: \"instant\" });\n\t\t}\n\n\t\tprevModalsLength.current = modals.length;\n\t}, [compensateScrollbar, modals.length]);\n\n\treturn <ModalManagerContext.Provider value={{ modals, openModal, closeModal, isTopModal }}>{children}</ModalManagerContext.Provider>;\n}\n"],"mappings":"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"}

package/dist/chunks/multi-select-BZ9N6Dal.js

@@ -1,466 +0,0 @@
-import { t as e } from "./ui.module-oRwY3Zli.js";
-import { Text as t } from "../text/index.js";
-import { t as n } from "./check-box-CZyhzmR0.js";
-import { Option as r, OptionButton as i } from "../option/index.js";
-import { a, f as o, i as s, n as c, r as l, s as u, t as d, u as f, v as p } from "./picker-lvm82d0A.js";
-import { t as ee } from "./separator-B72Aq-6a.js";
-import { i as te, n as m, t as h } from "./defaultRenderers-u_Vep6Pj.js";
-import { t as g } from "./odata-dependent-C_DCbKY2.js";
-import { n as _, t as v } from "./useODataSelectBase-DR4PrY1j.js";
-import { forwardRef as y, useCallback as ne, useMemo as b, useRef as re, useState as ie } from "react";
-import { flattenODataDependentServices as ae, useODataCollectionModel as oe } from "@ryuzaki13/react-foundation-api/odata";
-import { Fragment as se, jsx as x, jsxs as S } from "react/jsx-runtime";
-var ce = {
-	multiSelect: "_9oSdQi",
-	optionCheckBox: "d9SDKQ"
-};
-//#endregion
-//#region src/multi-select/ui/MultiSelectOptionSkeleton.tsx
-function C({ text: n, isError: r }) {
-	return /* @__PURE__ */ S("div", {
-		className: e.uiPopupOption,
-		children: [/* @__PURE__ */ x("span", { className: e.uiPopupOptionIcon }), /* @__PURE__ */ x(t, {
-			color: r ? "error" : "primary",
-			children: n
-		})]
-	});
-}
-//#endregion
-//#region src/multi-select/ui/MultiSelect.tsx
-function le({ isNoData: e, error: t, children: n }) {
-	return e ? /* @__PURE__ */ x(f, { emptyState: /* @__PURE__ */ x(C, { text: "Нет данных" }) }) : t ? /* @__PURE__ */ x(f, { errorState: /* @__PURE__ */ x(C, {
-		isError: !0,
-		text: "Ошибка загрузки"
-	}) }) : /* @__PURE__ */ x(se, { children: n });
-}
-var ue = [];
-function w(e, t) {
-	return e[t];
-}
-function T(e, t, n) {
-	return Array.from(/* @__PURE__ */ new Set([
-		e[n],
-		e[t],
-		...Object.values(e)
-	]));
-}
-function de(e, t, n) {
-	if (e.length !== t.length) return !1;
-	let r = new Set(t.map((e) => w(e, n)));
-	return e.every((e) => r.has(w(e, n)));
-}
-function fe({ entries: e, listId: t, activeIndex: a, selectedKeys: o, codeKey: s, query: c, highlightQuery: l, getOptionDisabled: u, getOptionId: d, setOptionRef: f, toggleOption: p, selectOnlyOption: ee, renderItem: te }) {
-	return e.map(({ item: e, index: m }) => {
-		let h = m === a, g = w(e, s), _ = o.has(g), v = u?.(e) ?? !1, y = te(e, {
-			selected: _,
-			active: h,
-			disabled: v,
-			query: c,
-			highlightQuery: l
-		});
-		return /* @__PURE__ */ S(r, {
-			id: d(t, m),
-			ref: (e) => f(m, e),
-			role: "option",
-			"aria-selected": _,
-			"aria-disabled": v || void 0,
-			selected: _,
-			active: h,
-			disabled: v,
-			children: [/* @__PURE__ */ x("div", {
-				className: ce.optionCheckBox,
-				onMouseDown: (e) => e.stopPropagation(),
-				onClick: (e) => e.stopPropagation(),
-				children: /* @__PURE__ */ x(n, {
-					value: _,
-					disabled: v,
-					"aria-label": `Выбрать ${l ?? g}`,
-					onChange: () => p(e)
-				})
-			}), /* @__PURE__ */ x(i, {
-				tabIndex: -1,
-				disabled: v,
-				text: y.text,
-				code: y.code,
-				searchText: l,
-				onMouseDown: (e) => e.preventDefault(),
-				onClick: () => ee(e)
-			})]
-		}, `${g}-${m}`);
-	});
-}
-var E = y(({ codeKey: e, textKey: t, hideCode: n, items: r, value: i, onChange: f, label: g, description: _, placeholder: v, size: y, query: ae, defaultQuery: oe, highlightQuery: C, onQuery: E, defaultFilter: D = !0, onOpen: O, onClose: k, getOptionDisabled: A, disabled: j, error: M, isLoading: N, renderToken: pe, renderToolbar: P, renderItem: me }, F) => {
-	let I = re(null), [L, he] = ie(!1), R = "search-multi", z = i ?? ue, ge = b(() => new Set(z.map((t) => w(t, e))), [e, z]), _e = b(() => r.filter((t) => !ge.has(w(t, e))), [
-		e,
-		ge,
-		r
-	]), B = b(() => te([...z, ...r], e, t), [
-		e,
-		z,
-		r,
-		t
-	]), { query: V, setQuery: ve, resetQueryOnClose: ye } = l({
-		query: ae,
-		defaultQuery: oe,
-		onQuery: E,
-		triggerMode: R
-	}), be = (e) => {
-		L && !e && ye && ve(""), he(e);
-	}, H = a({
-		options: z,
-		query: V,
-		enabled: D,
-		getSearchText: (t) => T(t, e, B)
-	}), U = a({
-		options: _e,
-		query: V,
-		enabled: D,
-		getSearchText: (t) => T(t, e, B)
-	}), W = b(() => [...H, ...U], [U, H]), xe = H.length > 0 ? 0 : -1, { draftValue: G, setDraftValue: K, prepareOpen: Se } = c({
-		value: z,
-		open: L,
-		onCommit: f,
-		onOpen: O,
-		onClose: k,
-		isEqual: (t, n) => de(t, n, e)
-	}), q = b(() => new Set(G.map((t) => w(t, e))), [e, G]), Ce = b(() => ({
-		selectedItems: G,
-		committedSelectedItems: z,
-		selectedKeys: q,
-		open: L
-	}), [
-		z,
-		G,
-		L,
-		q
-	]), J = ne((e) => A?.(e, Ce) ?? !1, [A, Ce]), { activeIndex: Y, context: we, floatingStyles: Te, getFloatingProps: Ee, setReference: De, setFloating: Oe, setOptionRef: ke, close: Ae, openList: je, toggleOpen: Me, selectActiveOption: Ne, handleReferenceKeyDown: Pe, handleFloatingKeyDown: Fe, getOptionId: Ie, getActiveOptionId: Le } = s({
-		options: W,
-		selectedIndex: xe,
-		open: L,
-		onOpenChange: be,
-		onSelect: void 0,
-		disabled: j,
-		getOptionDisabled: J,
-		closeOnSelect: !1,
-		allowOpenWithoutOptions: !0,
-		triggerMode: R
-	}), Re = C ?? V, X = (t) => {
-		let n = w(t, e);
-		K((r) => r.some((t) => w(t, e) === n) ? r.filter((t) => w(t, e) !== n) : J(t) ? r : [...r, t]);
-	}, ze = (e) => {
-		if (I.current = e, typeof F == "function") {
-			F(e);
-			return;
-		}
-		F && (F.current = e);
-	}, Be = () => {
-		K([]), L || f([]);
-	}, Ve = () => {
-		K((t) => {
-			let n = [...t], r = new Set(t.map((t) => w(t, e)));
-			for (let t of W) {
-				let i = w(t, e);
-				!r.has(i) && !J(t) && (r.add(i), n.push(t));
-			}
-			return n;
-		});
-	}, Z = () => {
-		K([]);
-	}, He = (e) => {
-		J(e) || (K([e]), Ae());
-	}, Ue = L ? G : z, We = Ue.length > 0, Ge = {
-		selectedItems: Ue,
-		committedSelectedItems: z,
-		availableItems: U,
-		query: V,
-		open: L,
-		clearSelection: Be,
-		selectAll: Ve,
-		deselectAll: Z
-	}, Ke = pe === void 0 ? m({
-		codeKey: e,
-		textKey: B
-	}) : pe, qe = me ?? h({
-		codeKey: e,
-		textKey: B,
-		hideCode: n
-	}), Je = typeof Ke == "function" ? Ke(Ge) : null, Ye = typeof P == "function" ? P(Ge) : P, Q = H.map((e, t) => ({
-		item: e,
-		index: t
-	})), Xe = U.map((e, t) => ({
-		item: e,
-		index: t + Q.length
-	})), Ze = !N && !M && W.length === 0, $ = d({
-		mode: R,
-		open: L,
-		currentQuery: V,
-		hasDisplayValue: !1,
-		inputRef: I,
-		setQuery: ve,
-		openList: je,
-		close: Ae,
-		toggleOpen: Me,
-		onBeforeOpen: () => {
-			L || Se();
-		}
-	});
-	return /* @__PURE__ */ x(p, {
-		label: g,
-		description: _,
-		disabled: j,
-		size: y,
-		className: ce.multiSelect,
-		children: ({ controlId: t, labelId: n, describedBy: i }) => {
-			let a = `${t}-listbox`;
-			return /* @__PURE__ */ S(se, { children: [/* @__PURE__ */ x(u, {
-				ref: ze,
-				rootRef: De,
-				id: t,
-				type: "text",
-				role: "combobox",
-				autoComplete: "off",
-				isLoading: N,
-				disabled: j,
-				open: L,
-				optionCount: r.length,
-				label: g,
-				placeholder: v,
-				placeholderFallback: "Выберите значения",
-				value: V,
-				selectedValue: Je,
-				hasSelection: We,
-				showSelectedValue: We && V.length === 0,
-				clearable: !0,
-				onClear: Be,
-				clearAriaLabel: "Очистить все",
-				onToggleMouseDown: $.handleToggleMouseDown,
-				onToggleClick: $.handleToggleClick,
-				"aria-labelledby": n,
-				"aria-describedby": i,
-				"aria-haspopup": "listbox",
-				"aria-expanded": L,
-				"aria-controls": L ? a : void 0,
-				"aria-autocomplete": "list",
-				"aria-activedescendant": L ? Le(a) : void 0,
-				rootClassName: "flex alignItemsCenter",
-				onChange: (e) => {
-					$.handleTriggerInputChange(e.target.value);
-				},
-				onClick: $.handleTriggerClick,
-				onFocus: (e) => {
-					$.handleTriggerFocus(e.currentTarget);
-				},
-				onKeyDown: (e) => {
-					Pe(e), !e.defaultPrevented && $.handleTriggerKeyDown({
-						event: e,
-						onActivateWhenOpen: () => {
-							if (Y >= 0) {
-								let e = W[Y];
-								if (e) {
-									X(e);
-									return;
-								}
-							}
-							Ne();
-						},
-						enableClosedArrowDownOpen: !0,
-						suppressClosedArrowUp: !0
-					});
-				}
-			}), /* @__PURE__ */ x(o, {
-				open: L,
-				context: we,
-				floatingStyles: Te,
-				listId: a,
-				labelId: n,
-				descriptionId: i,
-				activeOptionId: L ? Le(a) : void 0,
-				setFloating: Oe,
-				getFloatingProps: Ee,
-				onKeyDown: Fe,
-				initialFocus: -1,
-				returnFocus: !1,
-				tabIndex: -1,
-				toolbar: Ye,
-				selectionActions: P === void 0 ? {
-					onSelectAll: Ve,
-					onDeselectAll: Z
-				} : void 0,
-				children: /* @__PURE__ */ x(le, {
-					isNoData: Ze,
-					error: M,
-					children: /* @__PURE__ */ S("div", {
-						className: "scrollable overscroll h100",
-						children: [
-							/* @__PURE__ */ x(fe, {
-								entries: Q,
-								listId: a,
-								activeIndex: Y,
-								selectedKeys: q,
-								codeKey: e,
-								query: V,
-								highlightQuery: Re,
-								getOptionDisabled: J,
-								getOptionId: Ie,
-								setOptionRef: ke,
-								toggleOption: X,
-								selectOnlyOption: He,
-								renderItem: qe
-							}),
-							Q.length > 0 && _e.length > 0 && /* @__PURE__ */ x(ee, { className: "marginBlockSm" }),
-							/* @__PURE__ */ x(fe, {
-								entries: Xe,
-								listId: a,
-								activeIndex: Y,
-								selectedKeys: q,
-								codeKey: e,
-								query: V,
-								highlightQuery: Re,
-								getOptionDisabled: J,
-								getOptionId: Ie,
-								setOptionRef: ke,
-								toggleOption: X,
-								selectOnlyOption: He,
-								renderItem: qe
-							})
-						]
-					})
-				})
-			})] });
-		}
-	});
-});
-E.displayName = "MultiSelect";
-//#endregion
-//#region src/multi-select/model/useODataMultiSelect.ts
-function D({ odata: e, segment: t, model: n, value: r, dependencies: i, onChange: a }) {
-	let o = _({
-		odata: e,
-		segment: t,
-		model: n,
-		value: r,
-		dependencies: i
-	}), s = (e) => {
-		a(v(e, o.selectionKey));
-	};
-	return {
-		...o,
-		handleChange: s
-	};
-}
-//#endregion
-//#region src/multi-select/ui/ODataMultiSelect.tsx
-var O = ({ odata: e, segment: t, model: n, label: r, description: i, disabled: a, value: o, dependencies: s, onChange: c, size: l }) => {
-	let u = D({
-		odata: e,
-		segment: t,
-		model: oe(n),
-		value: o,
-		dependencies: s,
-		onChange: c
-	});
-	return /* @__PURE__ */ x(E, {
-		label: r,
-		description: i,
-		size: l,
-		codeKey: u.codeKey,
-		textKey: u.textKey,
-		hideCode: t.hideCode ?? e.hideCode,
-		items: u.filteredItems,
-		value: u.selectedItems,
-		onChange: u.handleChange,
-		onQuery: u.setQuery,
-		query: u.query,
-		defaultFilter: !1,
-		highlightQuery: u.debouncedQuery,
-		isLoading: u.isLoading,
-		disabled: a,
-		placeholder: u.placeholder,
-		error: u.isError ? "Ошибка загрузки" : void 0
-	});
-};
-//#endregion
-//#region src/multi-select/ui/ODataDependentSegmentMultiSelect.tsx
-function k(e) {
-	let { item: t, disabled: n, label: r, description: i, size: a, width: o = 15 } = e, s = g(e), { updateSegment: c } = s, l = `calc(${o}em + var(--width-add))`, u = ne((e) => {
-		c(t.id, e);
-	}, [t.id, c]);
-	return /* @__PURE__ */ x("div", {
-		style: {
-			maxWidth: l,
-			minWidth: l
-		},
-		children: /* @__PURE__ */ x(O, {
-			odata: t.odata,
-			segment: t.segment,
-			model: t.model,
-			dependencies: s.values,
-			value: s.values[t.id],
-			onChange: u,
-			disabled: n || s.isSegmentDisabled(t.id),
-			label: r,
-			description: i,
-			size: a
-		})
-	});
-}
-//#endregion
-//#region src/multi-select/ui/ODataDependentMultiSelect.tsx
-function A(e) {
-	let { width: t = 15, odata: n, segments: r, model: i, values: a, defaultValues: o, onChange: s, selectionMode: c, segmentOrder: l } = e, u = g({
-		values: a,
-		defaultValues: o,
-		onChange: s
-	}), d = c === "sequential" ? {
-		selectionMode: "sequential",
-		segmentOrder: l
-	} : {
-		selectionMode: c,
-		segmentOrder: l
-	};
-	return ae([{
-		odata: n,
-		segments: r,
-		model: i
-	}]).map((e) => /* @__PURE__ */ x(k, {
-		item: e,
-		values: u.values,
-		onChange: u.updateValues,
-		...d,
-		width: t
-	}, e.id));
-}
-//#endregion
-//#region src/multi-select/ui/SerializableMultiSelect.tsx
-function j(e, t) {
-	return e[t];
-}
-function M(e, t, n) {
-	let r = e[t];
-	if (typeof r == "string") return r;
-	let i = j(e, n);
-	return typeof i == "string" ? i : String(i);
-}
-function N({ label: e, description: t, disabled: n, placeholder: r, size: i, options: a, value: o, onChange: s, optionKey: c, optionLabel: l, renderCode: u }) {
-	let d = a.map((e) => ({
-		key: String(j(e, c)),
-		text: M(e, l, c)
-	})), f = new Set((o ?? []).map((e) => String(e))), p = d.filter((e) => f.has(e.key));
-	return /* @__PURE__ */ x(E, {
-		label: e,
-		description: t,
-		disabled: n,
-		placeholder: r,
-		size: i,
-		items: d,
-		codeKey: "key",
-		textKey: "text",
-		hideCode: !u || void 0,
-		value: p,
-		onChange: (e) => s(e.map((e) => e.key))
-	});
-}
-//#endregion
-export { E as a, O as i, A as n, k as r, N as t };
-
-//# sourceMappingURL=multi-select-BZ9N6Dal.js.map