@lobehub/ui 5.46.3 → 5.47.1

package/es/base-ui/Alert/Alert.mjs

@@ -58,7 +58,7 @@ const Alert = memo(({ action, afterClose, banner = false, className, classNames,
 				style: customStyles?.icon,
 				children: /* @__PURE__ */ jsx(Icon, {
 					icon: icon ?? typeIcons[type],
-					size: hasDescription ? 20 : 18,
+					size: hasDescription ? 18 : 16,
 					...iconProps
 				})
 			}),

package/es/base-ui/Alert/Alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.mjs","names":[],"sources":["../../../src/base-ui/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { AlertTriangle, CheckCircle, ChevronRight, Info, X, XCircle } from 'lucide-react';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport Icon from '@/Icon';\n\nimport {\n  extraHeaderVariants,\n  extraVariants,\n  integratedVariants,\n  rootVariants,\n  styles,\n  toneVariants,\n} from './style';\nimport type { AlertCloseConfig, AlertProps, AlertType } from './type';\n\nconst typeIcons = {\n  error: XCircle,\n  info: Info,\n  secondary: AlertTriangle,\n  success: CheckCircle,\n  warning: AlertTriangle,\n} satisfies Record<AlertType, typeof Info>;\n\nconst Alert = memo<AlertProps>(\n  ({\n    action,\n    afterClose,\n    banner = false,\n    className,\n    classNames,\n    closable = false,\n    closeIcon,\n    closeText,\n    colorfulText = false,\n    description,\n    extra,\n    extraDefaultExpand = false,\n    extraIsolate = false,\n    glass = false,\n    icon,\n    iconProps,\n    message,\n    onClose,\n    ref,\n    role = 'alert',\n    rootClassName,\n    showIcon = true,\n    style,\n    styles: customStyles,\n    text,\n    title,\n    type = 'info',\n    variant = 'soft',\n    ...rest\n  }) => {\n    const [closed, setClosed] = useState(false);\n    const [extraExpanded, setExtraExpanded] = useState(extraDefaultExpand);\n    const resolvedTitle = title ?? message;\n    const hasDescription = description !== undefined && description !== null;\n    const integratedExtra = Boolean(extra && !extraIsolate);\n    const closeConfig: AlertCloseConfig = typeof closable === 'object' ? closable : {};\n    const isClosable = Boolean(closable);\n    const {\n      afterClose: configuredAfterClose,\n      closeIcon: configuredCloseIcon,\n      className: closeClassName,\n      disabled: closeDisabled,\n      onClose: configuredOnClose,\n      style: closeStyle,\n      ...closeButtonProps\n    } = closeConfig;\n    const afterCloseRef = useRef(configuredAfterClose ?? afterClose);\n    afterCloseRef.current = configuredAfterClose ?? afterClose;\n\n    useEffect(() => {\n      if (closed) afterCloseRef.current?.();\n    }, [closed]);\n\n    if (closed) return null;\n\n    const handleClose: NonNullable<AlertCloseConfig['onClose']> = (event) => {\n      (configuredOnClose ?? onClose)?.(event);\n      setClosed(true);\n    };\n\n    const root = (\n      <div\n        {...rest}\n        data-alert-type={type}\n        data-alert-variant={variant}\n        ref={ref}\n        role={role}\n        className={cx(\n          toneVariants({ type }),\n          rootVariants({\n            banner,\n            colorfulText,\n            glass: integratedExtra ? false : glass,\n            hasDescription,\n            hasExtra: integratedExtra,\n            variant,\n          }),\n          classNames?.root,\n          classNames?.alert,\n          rootClassName,\n          className,\n        )}\n        style={{\n          ...style,\n          ...customStyles?.root,\n          ...customStyles?.alert,\n        }}\n      >\n        {showIcon && (\n          <span\n            aria-hidden=\"true\"\n            className={cx(styles.icon, classNames?.icon)}\n            style={customStyles?.icon}\n          >\n            <Icon icon={icon ?? typeIcons[type]} size={hasDescription ? 20 : 18} {...iconProps} />\n          </span>\n        )}\n        <div\n          className={cx(styles.content, classNames?.section, classNames?.content)}\n          style={{ ...customStyles?.section, ...customStyles?.content }}\n        >\n          {resolvedTitle !== undefined && resolvedTitle !== null && (\n            <div\n              style={customStyles?.title}\n              className={cx(\n                styles.title,\n                hasDescription && styles.titleDetailed,\n                classNames?.title,\n              )}\n            >\n              {resolvedTitle}\n            </div>\n          )}\n          {hasDescription && (\n            <div\n              className={cx(styles.description, classNames?.description)}\n              style={customStyles?.description}\n            >\n              {description}\n            </div>\n          )}\n        </div>\n        {action && (\n          <div\n            className={cx(styles.action, styles.wrappedAction, classNames?.action)}\n            style={customStyles?.action}\n          >\n            {action}\n          </div>\n        )}\n        {isClosable && (\n          <button\n            {...closeButtonProps}\n            aria-label={closeButtonProps['aria-label'] ?? 'Close alert'}\n            className={cx(styles.close, classNames?.close, closeClassName)}\n            disabled={closeDisabled}\n            style={{ ...customStyles?.close, ...closeStyle }}\n            type=\"button\"\n            onClick={handleClose}\n          >\n            {configuredCloseIcon ?? closeIcon ?? closeText ?? <X size={14} />}\n          </button>\n        )}\n      </div>\n    );\n\n    if (!extra) return root;\n\n    if (extraIsolate) {\n      return (\n        <div\n          className={cx(styles.container, toneVariants({ type }), classNames?.container)}\n          style={{ gap: 8, ...customStyles?.container }}\n        >\n          {root}\n          {extra}\n        </div>\n      );\n    }\n\n    return (\n      <div\n        style={customStyles?.container}\n        className={cx(\n          styles.container,\n          toneVariants({ type }),\n          integratedVariants({ banner, glass, variant }),\n          classNames?.container,\n        )}\n      >\n        {root}\n        <div\n          className={cx(extraVariants({ banner, variant }), classNames?.extra)}\n          style={customStyles?.extra}\n        >\n          <details\n            open={extraExpanded}\n            onToggle={(event) => setExtraExpanded(event.currentTarget.open)}\n          >\n            <summary\n              className={cx(extraHeaderVariants({ variant }), classNames?.extraHeader)}\n              style={customStyles?.extraHeader}\n            >\n              <ChevronRight\n                aria-hidden=\"true\"\n                className={cx(styles.extraIndicator, classNames?.extraIndicator)}\n                size={14}\n                style={customStyles?.extraIndicator}\n              />\n              <span>{text?.detail ?? 'Show Details'}</span>\n            </summary>\n            <div\n              className={cx(styles.extraContent, classNames?.extraContent)}\n              style={customStyles?.extraContent}\n            >\n              {extra}\n            </div>\n          </details>\n        </div>\n      </div>\n    );\n  },\n);\n\nAlert.displayName = 'BaseAlert';\n\nexport default Alert;\n"],"mappings":"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"}
+{"version":3,"file":"Alert.mjs","names":[],"sources":["../../../src/base-ui/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { AlertTriangle, CheckCircle, ChevronRight, Info, X, XCircle } from 'lucide-react';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport Icon from '@/Icon';\n\nimport {\n  extraHeaderVariants,\n  extraVariants,\n  integratedVariants,\n  rootVariants,\n  styles,\n  toneVariants,\n} from './style';\nimport type { AlertCloseConfig, AlertProps, AlertType } from './type';\n\nconst typeIcons = {\n  error: XCircle,\n  info: Info,\n  secondary: AlertTriangle,\n  success: CheckCircle,\n  warning: AlertTriangle,\n} satisfies Record<AlertType, typeof Info>;\n\nconst Alert = memo<AlertProps>(\n  ({\n    action,\n    afterClose,\n    banner = false,\n    className,\n    classNames,\n    closable = false,\n    closeIcon,\n    closeText,\n    colorfulText = false,\n    description,\n    extra,\n    extraDefaultExpand = false,\n    extraIsolate = false,\n    glass = false,\n    icon,\n    iconProps,\n    message,\n    onClose,\n    ref,\n    role = 'alert',\n    rootClassName,\n    showIcon = true,\n    style,\n    styles: customStyles,\n    text,\n    title,\n    type = 'info',\n    variant = 'soft',\n    ...rest\n  }) => {\n    const [closed, setClosed] = useState(false);\n    const [extraExpanded, setExtraExpanded] = useState(extraDefaultExpand);\n    const resolvedTitle = title ?? message;\n    const hasDescription = description !== undefined && description !== null;\n    const integratedExtra = Boolean(extra && !extraIsolate);\n    const closeConfig: AlertCloseConfig = typeof closable === 'object' ? closable : {};\n    const isClosable = Boolean(closable);\n    const {\n      afterClose: configuredAfterClose,\n      closeIcon: configuredCloseIcon,\n      className: closeClassName,\n      disabled: closeDisabled,\n      onClose: configuredOnClose,\n      style: closeStyle,\n      ...closeButtonProps\n    } = closeConfig;\n    const afterCloseRef = useRef(configuredAfterClose ?? afterClose);\n    afterCloseRef.current = configuredAfterClose ?? afterClose;\n\n    useEffect(() => {\n      if (closed) afterCloseRef.current?.();\n    }, [closed]);\n\n    if (closed) return null;\n\n    const handleClose: NonNullable<AlertCloseConfig['onClose']> = (event) => {\n      (configuredOnClose ?? onClose)?.(event);\n      setClosed(true);\n    };\n\n    const root = (\n      <div\n        {...rest}\n        data-alert-type={type}\n        data-alert-variant={variant}\n        ref={ref}\n        role={role}\n        className={cx(\n          toneVariants({ type }),\n          rootVariants({\n            banner,\n            colorfulText,\n            glass: integratedExtra ? false : glass,\n            hasDescription,\n            hasExtra: integratedExtra,\n            variant,\n          }),\n          classNames?.root,\n          classNames?.alert,\n          rootClassName,\n          className,\n        )}\n        style={{\n          ...style,\n          ...customStyles?.root,\n          ...customStyles?.alert,\n        }}\n      >\n        {showIcon && (\n          <span\n            aria-hidden=\"true\"\n            className={cx(styles.icon, classNames?.icon)}\n            style={customStyles?.icon}\n          >\n            <Icon icon={icon ?? typeIcons[type]} size={hasDescription ? 18 : 16} {...iconProps} />\n          </span>\n        )}\n        <div\n          className={cx(styles.content, classNames?.section, classNames?.content)}\n          style={{ ...customStyles?.section, ...customStyles?.content }}\n        >\n          {resolvedTitle !== undefined && resolvedTitle !== null && (\n            <div\n              style={customStyles?.title}\n              className={cx(\n                styles.title,\n                hasDescription && styles.titleDetailed,\n                classNames?.title,\n              )}\n            >\n              {resolvedTitle}\n            </div>\n          )}\n          {hasDescription && (\n            <div\n              className={cx(styles.description, classNames?.description)}\n              style={customStyles?.description}\n            >\n              {description}\n            </div>\n          )}\n        </div>\n        {action && (\n          <div\n            className={cx(styles.action, styles.wrappedAction, classNames?.action)}\n            style={customStyles?.action}\n          >\n            {action}\n          </div>\n        )}\n        {isClosable && (\n          <button\n            {...closeButtonProps}\n            aria-label={closeButtonProps['aria-label'] ?? 'Close alert'}\n            className={cx(styles.close, classNames?.close, closeClassName)}\n            disabled={closeDisabled}\n            style={{ ...customStyles?.close, ...closeStyle }}\n            type=\"button\"\n            onClick={handleClose}\n          >\n            {configuredCloseIcon ?? closeIcon ?? closeText ?? <X size={14} />}\n          </button>\n        )}\n      </div>\n    );\n\n    if (!extra) return root;\n\n    if (extraIsolate) {\n      return (\n        <div\n          className={cx(styles.container, toneVariants({ type }), classNames?.container)}\n          style={{ gap: 8, ...customStyles?.container }}\n        >\n          {root}\n          {extra}\n        </div>\n      );\n    }\n\n    return (\n      <div\n        style={customStyles?.container}\n        className={cx(\n          styles.container,\n          toneVariants({ type }),\n          integratedVariants({ banner, glass, variant }),\n          classNames?.container,\n        )}\n      >\n        {root}\n        <div\n          className={cx(extraVariants({ banner, variant }), classNames?.extra)}\n          style={customStyles?.extra}\n        >\n          <details\n            open={extraExpanded}\n            onToggle={(event) => setExtraExpanded(event.currentTarget.open)}\n          >\n            <summary\n              className={cx(extraHeaderVariants({ variant }), classNames?.extraHeader)}\n              style={customStyles?.extraHeader}\n            >\n              <ChevronRight\n                aria-hidden=\"true\"\n                className={cx(styles.extraIndicator, classNames?.extraIndicator)}\n                size={14}\n                style={customStyles?.extraIndicator}\n              />\n              <span>{text?.detail ?? 'Show Details'}</span>\n            </summary>\n            <div\n              className={cx(styles.extraContent, classNames?.extraContent)}\n              style={customStyles?.extraContent}\n            >\n              {extra}\n            </div>\n          </details>\n        </div>\n      </div>\n    );\n  },\n);\n\nAlert.displayName = 'BaseAlert';\n\nexport default Alert;\n"],"mappings":"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"}

package/es/base-ui/Alert/style.d.mts

@@ -1,6 +1,7 @@
 //#region src/base-ui/Alert/style.d.ts
 declare const styles: {
   action: string;
+  centered: string;
   close: string;
   colorfulText: string;
   container: string;

package/es/base-ui/Alert/style.mjs

@@ -11,6 +11,9 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
 
     min-height: 32px;
     margin-inline-start: auto;
+  `,
+	centered: css`
+    align-items: center;
   `,
 	close: css`
     cursor: pointer;
@@ -339,7 +342,7 @@ const rootVariants = cva(styles.root, {
 			true: staticStylish.blur
 		},
 		hasDescription: {
-			false: null,
+			false: styles.centered,
 			true: styles.detailed
 		},
 		hasExtra: {

package/es/base-ui/Alert/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Alert/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { focusRing } from '@/base-ui/focusRing';\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  action: css`\n    display: flex;\n    flex-shrink: 0;\n    align-items: center;\n\n    min-height: 32px;\n    margin-inline-start: auto;\n  `,\n  close: css`\n    cursor: pointer;\n\n    position: relative;\n    scale: 1;\n\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n\n    width: 32px;\n    height: 32px;\n    margin: 0;\n    padding: 0;\n    border: none;\n    border-radius: ${cssVar.borderRadiusSM};\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: transparent;\n\n    transition:\n      color 160ms ${cssVar.motionEaseOut},\n      background-color 160ms ${cssVar.motionEaseOut},\n      scale 160ms ${cssVar.motionEaseOut};\n\n    &::after {\n      content: '';\n\n      position: absolute;\n      inset-block-start: 50%;\n      inset-inline-start: 50%;\n      translate: -50% -50%;\n\n      width: 40px;\n      height: 40px;\n    }\n\n    &:hover:not(:disabled) {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:active:not(:disabled) {\n      scale: 0.96;\n    }\n\n    ${focusRing};\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.45;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  colorfulText: css`\n    color: var(--lobe-alert-accent);\n  `,\n  container: css`\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    max-width: 100%;\n  `,\n  content: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    min-width: 0;\n  `,\n  description: css`\n    font-size: 13px;\n    line-height: 20px;\n    color: ${cssVar.colorTextSecondary};\n    text-wrap: pretty;\n    overflow-wrap: anywhere;\n  `,\n  detailed: css`\n    padding-block: 12px;\n    padding-inline: 14px;\n  `,\n  extra: css`\n    position: relative;\n    max-width: 100%;\n    color: ${cssVar.colorText};\n  `,\n  extraBanner: css`\n    border-radius: 0;\n  `,\n  extraContent: css`\n    overflow: hidden;\n\n    margin-block: 0 12px;\n    margin-inline: 12px;\n    padding: 8px;\n    border-radius: ${cssVar.borderRadiusSM};\n\n    font-size: 12px;\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorFillQuaternary};\n  `,\n  extraHeader: css`\n    cursor: pointer;\n    user-select: none;\n\n    display: flex;\n    gap: 6px;\n    align-items: center;\n\n    min-height: 40px;\n    padding-block: 8px;\n    padding-inline: 14px;\n    border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: 0;\n\n    font-size: 12px;\n    font-weight: 500;\n    line-height: 20px;\n    color: ${cssVar.colorTextSecondary};\n\n    background: transparent;\n\n    transition:\n      color 160ms ${cssVar.motionEaseOut},\n      background-color 160ms ${cssVar.motionEaseOut};\n\n    &::marker,\n    &::-webkit-details-marker {\n      content: '';\n      display: none;\n    }\n\n    &:hover {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillQuaternary};\n    }\n\n    ${focusRing};\n  `,\n  extraHeaderPlain: css`\n    margin-block-start: 6px;\n    padding-inline: 0;\n    border-block-start-color: ${cssVar.colorBorderSecondary};\n  `,\n  extraIndicator: css`\n    flex-shrink: 0;\n    color: ${cssVar.colorTextTertiary};\n    transition: transform 160ms ${cssVar.motionEaseOut};\n\n    details[open] > summary > & {\n      transform: rotate(90deg);\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  extraPlain: css`\n    background: transparent;\n  `,\n  icon: css`\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n\n    height: 20px;\n\n    color: var(--lobe-alert-accent);\n  `,\n  integrated: css`\n    overflow: hidden;\n    border-radius: ${cssVar.borderRadius};\n  `,\n  neutralText: css`\n    color: ${cssVar.colorText};\n  `,\n  root: css`\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n\n    box-sizing: border-box;\n    width: 100%;\n    max-width: 100%;\n    padding-block: 10px;\n    padding-inline: 12px;\n    border: none;\n    border-radius: ${cssVar.borderRadius};\n\n    font-size: 14px;\n    color: ${cssVar.colorText};\n\n    background: var(--lobe-alert-background);\n    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);\n\n    @media (width <= 480px) {\n      flex-wrap: wrap;\n    }\n  `,\n  soft: css`\n    background: var(--lobe-alert-background);\n    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);\n  `,\n  outlined: css`\n    background: transparent;\n    box-shadow: inset 0 0 0 1px ${cssVar.colorBorderSecondary};\n  `,\n  plain: css`\n    padding-block: 2px;\n    padding-inline: 0;\n    background: transparent;\n    box-shadow: none;\n  `,\n  title: css`\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 20px;\n    color: inherit;\n    text-wrap: pretty;\n    overflow-wrap: anywhere;\n  `,\n  titleDetailed: css`\n    font-weight: 500;\n  `,\n  toneError: css`\n    --lobe-alert-accent: ${cssVar.colorError};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorError} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorError} 14%, transparent);\n  `,\n  toneInfo: css`\n    --lobe-alert-accent: ${cssVar.colorInfo};\n    --lobe-alert-background: color-mix(in srgb, ${cssVar.colorInfo} 5%, ${cssVar.colorBgContainer});\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorInfo} 14%, transparent);\n  `,\n  toneSecondary: css`\n    --lobe-alert-accent: ${cssVar.colorTextSecondary};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorTextSecondary} 4%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorTextSecondary} 12%, transparent);\n  `,\n  toneSuccess: css`\n    --lobe-alert-accent: ${cssVar.colorSuccess};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorSuccess} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorSuccess} 14%, transparent);\n  `,\n  toneWarning: css`\n    --lobe-alert-accent: ${cssVar.colorWarning};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorWarning} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorWarning} 14%, transparent);\n  `,\n  unifiedRoot: css`\n    border-radius: 0;\n    background: transparent;\n    box-shadow: none;\n  `,\n  banner: css`\n    border-radius: 0;\n    box-shadow: none;\n  `,\n  wrappedAction: css`\n    @media (width <= 480px) {\n      order: 4;\n      width: calc(100% - 30px);\n      margin-block-start: -2px;\n      margin-inline-start: 30px;\n    }\n  `,\n}));\n\nexport const toneVariants = cva('', {\n  defaultVariants: { type: 'info' },\n  variants: {\n    type: {\n      error: styles.toneError,\n      info: styles.toneInfo,\n      secondary: styles.toneSecondary,\n      success: styles.toneSuccess,\n      warning: styles.toneWarning,\n    },\n  },\n});\n\nexport const rootVariants = cva(styles.root, {\n  compoundVariants: [{ class: styles.unifiedRoot, hasExtra: true }],\n  defaultVariants: {\n    banner: false,\n    colorfulText: false,\n    glass: false,\n    hasDescription: false,\n    hasExtra: false,\n    variant: 'soft',\n  },\n  variants: {\n    banner: { false: null, true: styles.banner },\n    colorfulText: { false: styles.neutralText, true: styles.colorfulText },\n    glass: { false: null, true: lobeStaticStylish.blur },\n    hasDescription: { false: null, true: styles.detailed },\n    hasExtra: { false: null, true: null },\n    variant: {\n      borderless: styles.plain,\n      filled: styles.soft,\n      outlined: styles.outlined,\n      plain: styles.plain,\n      soft: styles.soft,\n    },\n  },\n});\n\nexport const integratedVariants = cva(styles.integrated, {\n  defaultVariants: { banner: false, glass: false, variant: 'soft' },\n  variants: {\n    banner: { false: null, true: styles.banner },\n    glass: { false: null, true: lobeStaticStylish.blur },\n    variant: {\n      borderless: styles.extraPlain,\n      filled: styles.soft,\n      outlined: styles.outlined,\n      plain: styles.extraPlain,\n      soft: styles.soft,\n    },\n  },\n});\n\nexport const extraVariants = cva(styles.extra, {\n  defaultVariants: { banner: false, variant: 'soft' },\n  variants: {\n    banner: { false: null, true: styles.extraBanner },\n    variant: {\n      borderless: styles.extraPlain,\n      filled: null,\n      outlined: null,\n      plain: styles.extraPlain,\n      soft: null,\n    },\n  },\n});\n\nexport const extraHeaderVariants = cva(styles.extraHeader, {\n  defaultVariants: { variant: 'soft' },\n  variants: {\n    variant: {\n      borderless: styles.extraHeaderPlain,\n      filled: null,\n      outlined: null,\n      plain: styles.extraHeaderPlain,\n      soft: null,\n    },\n  },\n});\n"],"mappings":"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"}
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Alert/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { focusRing } from '@/base-ui/focusRing';\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  action: css`\n    display: flex;\n    flex-shrink: 0;\n    align-items: center;\n\n    min-height: 32px;\n    margin-inline-start: auto;\n  `,\n  centered: css`\n    align-items: center;\n  `,\n  close: css`\n    cursor: pointer;\n\n    position: relative;\n    scale: 1;\n\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n\n    width: 32px;\n    height: 32px;\n    margin: 0;\n    padding: 0;\n    border: none;\n    border-radius: ${cssVar.borderRadiusSM};\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: transparent;\n\n    transition:\n      color 160ms ${cssVar.motionEaseOut},\n      background-color 160ms ${cssVar.motionEaseOut},\n      scale 160ms ${cssVar.motionEaseOut};\n\n    &::after {\n      content: '';\n\n      position: absolute;\n      inset-block-start: 50%;\n      inset-inline-start: 50%;\n      translate: -50% -50%;\n\n      width: 40px;\n      height: 40px;\n    }\n\n    &:hover:not(:disabled) {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:active:not(:disabled) {\n      scale: 0.96;\n    }\n\n    ${focusRing};\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.45;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  colorfulText: css`\n    color: var(--lobe-alert-accent);\n  `,\n  container: css`\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    max-width: 100%;\n  `,\n  content: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    min-width: 0;\n  `,\n  description: css`\n    font-size: 13px;\n    line-height: 20px;\n    color: ${cssVar.colorTextSecondary};\n    text-wrap: pretty;\n    overflow-wrap: anywhere;\n  `,\n  detailed: css`\n    padding-block: 12px;\n    padding-inline: 14px;\n  `,\n  extra: css`\n    position: relative;\n    max-width: 100%;\n    color: ${cssVar.colorText};\n  `,\n  extraBanner: css`\n    border-radius: 0;\n  `,\n  extraContent: css`\n    overflow: hidden;\n\n    margin-block: 0 12px;\n    margin-inline: 12px;\n    padding: 8px;\n    border-radius: ${cssVar.borderRadiusSM};\n\n    font-size: 12px;\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorFillQuaternary};\n  `,\n  extraHeader: css`\n    cursor: pointer;\n    user-select: none;\n\n    display: flex;\n    gap: 6px;\n    align-items: center;\n\n    min-height: 40px;\n    padding-block: 8px;\n    padding-inline: 14px;\n    border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: 0;\n\n    font-size: 12px;\n    font-weight: 500;\n    line-height: 20px;\n    color: ${cssVar.colorTextSecondary};\n\n    background: transparent;\n\n    transition:\n      color 160ms ${cssVar.motionEaseOut},\n      background-color 160ms ${cssVar.motionEaseOut};\n\n    &::marker,\n    &::-webkit-details-marker {\n      content: '';\n      display: none;\n    }\n\n    &:hover {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillQuaternary};\n    }\n\n    ${focusRing};\n  `,\n  extraHeaderPlain: css`\n    margin-block-start: 6px;\n    padding-inline: 0;\n    border-block-start-color: ${cssVar.colorBorderSecondary};\n  `,\n  extraIndicator: css`\n    flex-shrink: 0;\n    color: ${cssVar.colorTextTertiary};\n    transition: transform 160ms ${cssVar.motionEaseOut};\n\n    details[open] > summary > & {\n      transform: rotate(90deg);\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  extraPlain: css`\n    background: transparent;\n  `,\n  icon: css`\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n\n    height: 20px;\n\n    color: var(--lobe-alert-accent);\n  `,\n  integrated: css`\n    overflow: hidden;\n    border-radius: ${cssVar.borderRadius};\n  `,\n  neutralText: css`\n    color: ${cssVar.colorText};\n  `,\n  root: css`\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n\n    box-sizing: border-box;\n    width: 100%;\n    max-width: 100%;\n    padding-block: 10px;\n    padding-inline: 12px;\n    border: none;\n    border-radius: ${cssVar.borderRadius};\n\n    font-size: 14px;\n    color: ${cssVar.colorText};\n\n    background: var(--lobe-alert-background);\n    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);\n\n    @media (width <= 480px) {\n      flex-wrap: wrap;\n    }\n  `,\n  soft: css`\n    background: var(--lobe-alert-background);\n    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);\n  `,\n  outlined: css`\n    background: transparent;\n    box-shadow: inset 0 0 0 1px ${cssVar.colorBorderSecondary};\n  `,\n  plain: css`\n    padding-block: 2px;\n    padding-inline: 0;\n    background: transparent;\n    box-shadow: none;\n  `,\n  title: css`\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 20px;\n    color: inherit;\n    text-wrap: pretty;\n    overflow-wrap: anywhere;\n  `,\n  titleDetailed: css`\n    font-weight: 500;\n  `,\n  toneError: css`\n    --lobe-alert-accent: ${cssVar.colorError};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorError} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorError} 14%, transparent);\n  `,\n  toneInfo: css`\n    --lobe-alert-accent: ${cssVar.colorInfo};\n    --lobe-alert-background: color-mix(in srgb, ${cssVar.colorInfo} 5%, ${cssVar.colorBgContainer});\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorInfo} 14%, transparent);\n  `,\n  toneSecondary: css`\n    --lobe-alert-accent: ${cssVar.colorTextSecondary};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorTextSecondary} 4%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorTextSecondary} 12%, transparent);\n  `,\n  toneSuccess: css`\n    --lobe-alert-accent: ${cssVar.colorSuccess};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorSuccess} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorSuccess} 14%, transparent);\n  `,\n  toneWarning: css`\n    --lobe-alert-accent: ${cssVar.colorWarning};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorWarning} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorWarning} 14%, transparent);\n  `,\n  unifiedRoot: css`\n    border-radius: 0;\n    background: transparent;\n    box-shadow: none;\n  `,\n  banner: css`\n    border-radius: 0;\n    box-shadow: none;\n  `,\n  wrappedAction: css`\n    @media (width <= 480px) {\n      order: 4;\n      width: calc(100% - 30px);\n      margin-block-start: -2px;\n      margin-inline-start: 30px;\n    }\n  `,\n}));\n\nexport const toneVariants = cva('', {\n  defaultVariants: { type: 'info' },\n  variants: {\n    type: {\n      error: styles.toneError,\n      info: styles.toneInfo,\n      secondary: styles.toneSecondary,\n      success: styles.toneSuccess,\n      warning: styles.toneWarning,\n    },\n  },\n});\n\nexport const rootVariants = cva(styles.root, {\n  compoundVariants: [{ class: styles.unifiedRoot, hasExtra: true }],\n  defaultVariants: {\n    banner: false,\n    colorfulText: false,\n    glass: false,\n    hasDescription: false,\n    hasExtra: false,\n    variant: 'soft',\n  },\n  variants: {\n    banner: { false: null, true: styles.banner },\n    colorfulText: { false: styles.neutralText, true: styles.colorfulText },\n    glass: { false: null, true: lobeStaticStylish.blur },\n    hasDescription: { false: styles.centered, true: styles.detailed },\n    hasExtra: { false: null, true: null },\n    variant: {\n      borderless: styles.plain,\n      filled: styles.soft,\n      outlined: styles.outlined,\n      plain: styles.plain,\n      soft: styles.soft,\n    },\n  },\n});\n\nexport const integratedVariants = cva(styles.integrated, {\n  defaultVariants: { banner: false, glass: false, variant: 'soft' },\n  variants: {\n    banner: { false: null, true: styles.banner },\n    glass: { false: null, true: lobeStaticStylish.blur },\n    variant: {\n      borderless: styles.extraPlain,\n      filled: styles.soft,\n      outlined: styles.outlined,\n      plain: styles.extraPlain,\n      soft: styles.soft,\n    },\n  },\n});\n\nexport const extraVariants = cva(styles.extra, {\n  defaultVariants: { banner: false, variant: 'soft' },\n  variants: {\n    banner: { false: null, true: styles.extraBanner },\n    variant: {\n      borderless: styles.extraPlain,\n      filled: null,\n      outlined: null,\n      plain: styles.extraPlain,\n      soft: null,\n    },\n  },\n});\n\nexport const extraHeaderVariants = cva(styles.extraHeader, {\n  defaultVariants: { variant: 'soft' },\n  variants: {\n    variant: {\n      borderless: styles.extraHeaderPlain,\n      filled: null,\n      outlined: null,\n      plain: styles.extraHeaderPlain,\n      soft: null,\n    },\n  },\n});\n"],"mappings":"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"}

package/es/base-ui/Collapsible/Collapsible.d.mts

@@ -0,0 +1,6 @@
+import { CollapsibleProps } from "./type.mjs";
+//#region src/base-ui/Collapsible/Collapsible.d.ts
+declare const Collapsible: import("react").NamedExoticComponent<CollapsibleProps>;
+//#endregion
+export { Collapsible as default };
+//# sourceMappingURL=Collapsible.d.mts.map

package/es/base-ui/Collapsible/Collapsible.mjs

@@ -0,0 +1,25 @@
+"use client";
+import { styles } from "../Accordion/style.mjs";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { Collapsible } from "@base-ui/react/collapsible";
+//#region src/base-ui/Collapsible/Collapsible.tsx
+const Collapsible$1 = memo(({ open, keepMounted, children, className, contentClassName, contentStyle, style }) => /* @__PURE__ */ jsx(Collapsible.Root, {
+	open,
+	children: /* @__PURE__ */ jsx(Collapsible.Panel, {
+		className: cx(styles.panel, className),
+		keepMounted,
+		style,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cx(styles.content, contentClassName),
+			style: contentStyle,
+			children
+		})
+	})
+}));
+Collapsible$1.displayName = "Collapsible";
+//#endregion
+export { Collapsible$1 as default };
+
+//# sourceMappingURL=Collapsible.mjs.map

package/es/base-ui/Collapsible/Collapsible.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapsible.mjs","names":["Collapsible","BaseUICollapsible","accordionStyles"],"sources":["../../../src/base-ui/Collapsible/Collapsible.tsx"],"sourcesContent":["'use client';\n\nimport { Collapsible as BaseUICollapsible } from '@base-ui/react/collapsible';\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { accordionStyles } from '../Accordion/atoms';\nimport type { CollapsibleProps } from './type';\n\nconst Collapsible = memo<CollapsibleProps>(\n  ({ open, keepMounted, children, className, contentClassName, contentStyle, style }) => (\n    <BaseUICollapsible.Root open={open}>\n      <BaseUICollapsible.Panel\n        className={cx(accordionStyles.panel, className)}\n        keepMounted={keepMounted}\n        style={style}\n      >\n        <div className={cx(accordionStyles.content, contentClassName)} style={contentStyle}>\n          {children}\n        </div>\n      </BaseUICollapsible.Panel>\n    </BaseUICollapsible.Root>\n  ),\n);\n\nCollapsible.displayName = 'Collapsible';\n\nexport default Collapsible;\n"],"mappings":";;;;;;;AASA,MAAMA,gBAAc,MACjB,EAAE,MAAM,aAAa,UAAU,WAAW,kBAAkB,cAAc,YACzE,oBAACC,YAAkB,MAAnB;CAA8B;CAC5B,UAAA,oBAACA,YAAkB,OAAnB;EACE,WAAW,GAAGC,OAAgB,OAAO,SAAS;EACjC;EACN;EAEP,UAAA,oBAAC,OAAD;GAAK,WAAW,GAAGA,OAAgB,SAAS,gBAAgB;GAAG,OAAO;GACnE;EACE,CAAA;CACkB,CAAA;AACH,CAAA,CAE5B;AAEA,cAAY,cAAc"}

package/es/base-ui/Collapsible/index.d.mts

@@ -0,0 +1,3 @@
+import { CollapsibleProps } from "./type.mjs";
+import Collapsible from "./Collapsible.mjs";
+export { type CollapsibleProps, Collapsible as default };

package/es/base-ui/Collapsible/type.d.mts

@@ -0,0 +1,14 @@
+import { CSSProperties, ReactNode } from "react";
+//#region src/base-ui/Collapsible/type.d.ts
+interface CollapsibleProps {
+  children?: ReactNode;
+  className?: string;
+  contentClassName?: string;
+  contentStyle?: CSSProperties;
+  keepMounted?: boolean;
+  open: boolean;
+  style?: CSSProperties;
+}
+//#endregion
+export { CollapsibleProps };
+//# sourceMappingURL=type.d.mts.map

package/es/base-ui/FocusScope/FocusScope.d.mts

@@ -0,0 +1,15 @@
+import { HTMLAttributes, Ref } from "react";
+//#region src/base-ui/FocusScope/FocusScope.d.ts
+interface FocusScopeProps extends HTMLAttributes<HTMLDivElement> {
+  debugOutline?: boolean;
+  id?: string;
+  ref?: Ref<HTMLDivElement>;
+}
+declare const useFocusScopeId: () => string | null;
+declare const FocusScope: {
+  ({ id, debugOutline, className, children, onKeyDown, ...rest }: FocusScopeProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { FocusScope, FocusScopeProps, useFocusScopeId };
+//# sourceMappingURL=FocusScope.d.mts.map

package/es/base-ui/FocusScope/FocusScope.mjs

@@ -0,0 +1,36 @@
+"use client";
+import { registerScope, setActiveScope, useFocusScopeActive } from "./store.mjs";
+import { styles } from "./style.mjs";
+import { createContext, use, useEffect, useId } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/base-ui/FocusScope/FocusScope.tsx
+const FocusScopeIdContext = createContext(null);
+const useFocusScopeId = () => use(FocusScopeIdContext);
+const FocusScope = ({ id, debugOutline = false, className, children, onKeyDown, ...rest }) => {
+	const generatedId = useId();
+	const scopeId = id ?? generatedId;
+	const isActive = useFocusScopeActive(scopeId);
+	useEffect(() => registerScope(scopeId), [scopeId]);
+	return /* @__PURE__ */ jsx(FocusScopeIdContext, {
+		value: scopeId,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-focus-scope": scopeId,
+			"data-scope-active": isActive ? "" : void 0,
+			tabIndex: -1,
+			...rest,
+			className: cx(styles.root, debugOutline && styles.debugOutline, className),
+			onKeyDown: (event) => {
+				onKeyDown?.(event);
+				if (event.defaultPrevented) return;
+				if (event.key === "Escape") setActiveScope(null);
+			},
+			children
+		})
+	});
+};
+FocusScope.displayName = "FocusScope";
+//#endregion
+export { FocusScope, useFocusScopeId };
+
+//# sourceMappingURL=FocusScope.mjs.map

package/es/base-ui/FocusScope/FocusScope.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FocusScope.mjs","names":[],"sources":["../../../src/base-ui/FocusScope/FocusScope.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { createContext, type HTMLAttributes, type Ref, use, useEffect, useId } from 'react';\n\nimport { registerScope, setActiveScope, useFocusScopeActive } from './store';\nimport { styles } from './style';\n\nexport interface FocusScopeProps extends HTMLAttributes<HTMLDivElement> {\n  debugOutline?: boolean;\n  id?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst FocusScopeIdContext = createContext<string | null>(null);\n\nexport const useFocusScopeId = () => use(FocusScopeIdContext);\n\nexport const FocusScope = ({\n  id,\n  debugOutline = false,\n  className,\n  children,\n  onKeyDown,\n  ...rest\n}: FocusScopeProps) => {\n  const generatedId = useId();\n  const scopeId = id ?? generatedId;\n  const isActive = useFocusScopeActive(scopeId);\n\n  useEffect(() => registerScope(scopeId), [scopeId]);\n\n  return (\n    <FocusScopeIdContext value={scopeId}>\n      <div\n        data-focus-scope={scopeId}\n        data-scope-active={isActive ? '' : undefined}\n        tabIndex={-1}\n        {...rest}\n        className={cx(styles.root, debugOutline && styles.debugOutline, className)}\n        onKeyDown={(event) => {\n          onKeyDown?.(event);\n          if (event.defaultPrevented) return;\n          if (event.key === 'Escape') setActiveScope(null);\n        }}\n      >\n        {children}\n      </div>\n    </FocusScopeIdContext>\n  );\n};\n\nFocusScope.displayName = 'FocusScope';\n"],"mappings":";;;;;;;AAcA,MAAM,sBAAsB,cAA6B,IAAI;AAE7D,MAAa,wBAAwB,IAAI,mBAAmB;AAE5D,MAAa,cAAc,EACzB,IACA,eAAe,OACf,WACA,UACA,WACA,GAAG,WACkB;CACrB,MAAM,cAAc,MAAM;CAC1B,MAAM,UAAU,MAAM;CACtB,MAAM,WAAW,oBAAoB,OAAO;CAE5C,gBAAgB,cAAc,OAAO,GAAG,CAAC,OAAO,CAAC;CAEjD,OACE,oBAAC,qBAAD;EAAqB,OAAO;EAC1B,UAAA,oBAAC,OAAD;GACE,oBAAkB;GAClB,qBAAmB,WAAW,KAAK,KAAA;GACnC,UAAU;GACV,GAAI;GACJ,WAAW,GAAG,OAAO,MAAM,gBAAgB,OAAO,cAAc,SAAS;GACzE,YAAY,UAAU;IACpB,YAAY,KAAK;IACjB,IAAI,MAAM,kBAAkB;IAC5B,IAAI,MAAM,QAAQ,UAAU,eAAe,IAAI;GACjD;GAEC;EACE,CAAA;CACc,CAAA;AAEzB;AAEA,WAAW,cAAc"}

package/es/base-ui/FocusScope/domUtils.mjs

@@ -0,0 +1,31 @@
+//#region src/base-ui/FocusScope/domUtils.ts
+const isItemVisible = (el) => {
+	if (typeof el.checkVisibility === "function") return el.checkVisibility({
+		checkOpacity: true,
+		checkVisibilityCSS: true
+	});
+	for (let node = el; node; node = node.parentElement) {
+		const style = getComputedStyle(node);
+		if (style.display === "none" || style.visibility === "hidden") return false;
+	}
+	return true;
+};
+const hasSize = (el) => {
+	const rect = el.getBoundingClientRect();
+	return rect.width > 0 && rect.height > 0;
+};
+const isTextInputTarget = (target) => {
+	if (!(target instanceof HTMLElement)) return false;
+	if (target.isContentEditable) return true;
+	return [
+		"INPUT",
+		"SELECT",
+		"TEXTAREA"
+	].includes(target.tagName);
+};
+const hasModifier = (event) => event.metaKey || event.ctrlKey || event.altKey;
+const scopeSelector = (id) => `[data-focus-scope="${id.replaceAll("\"", "\\\"")}"]`;
+//#endregion
+export { hasModifier, hasSize, isItemVisible, isTextInputTarget, scopeSelector };
+
+//# sourceMappingURL=domUtils.mjs.map

package/es/base-ui/FocusScope/domUtils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"domUtils.mjs","names":[],"sources":["../../../src/base-ui/FocusScope/domUtils.ts"],"sourcesContent":["export const isItemVisible = (el: HTMLElement): boolean => {\n  if (typeof el.checkVisibility === 'function') {\n    return el.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true });\n  }\n  for (let node: HTMLElement | null = el; node; node = node.parentElement) {\n    const style = getComputedStyle(node);\n    if (style.display === 'none' || style.visibility === 'hidden') return false;\n  }\n  return true;\n};\n\nexport const hasSize = (el: HTMLElement) => {\n  const rect = el.getBoundingClientRect();\n  return rect.width > 0 && rect.height > 0;\n};\n\nexport const isTextInputTarget = (target: EventTarget | null) => {\n  if (!(target instanceof HTMLElement)) return false;\n  if (target.isContentEditable) return true;\n  return ['INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName);\n};\n\nexport const hasModifier = (event: KeyboardEvent) => event.metaKey || event.ctrlKey || event.altKey;\n\nexport const scopeSelector = (id: string) => `[data-focus-scope=\"${id.replaceAll('\"', '\\\\\"')}\"]`;\n"],"mappings":";AAAA,MAAa,iBAAiB,OAA6B;CACzD,IAAI,OAAO,GAAG,oBAAoB,YAChC,OAAO,GAAG,gBAAgB;EAAE,cAAc;EAAM,oBAAoB;CAAK,CAAC;CAE5E,KAAK,IAAI,OAA2B,IAAI,MAAM,OAAO,KAAK,eAAe;EACvE,MAAM,QAAQ,iBAAiB,IAAI;EACnC,IAAI,MAAM,YAAY,UAAU,MAAM,eAAe,UAAU,OAAO;CACxE;CACA,OAAO;AACT;AAEA,MAAa,WAAW,OAAoB;CAC1C,MAAM,OAAO,GAAG,sBAAsB;CACtC,OAAO,KAAK,QAAQ,KAAK,KAAK,SAAS;AACzC;AAEA,MAAa,qBAAqB,WAA+B;CAC/D,IAAI,EAAE,kBAAkB,cAAc,OAAO;CAC7C,IAAI,OAAO,mBAAmB,OAAO;CACrC,OAAO;EAAC;EAAS;EAAU;CAAU,CAAC,CAAC,SAAS,OAAO,OAAO;AAChE;AAEA,MAAa,eAAe,UAAyB,MAAM,WAAW,MAAM,WAAW,MAAM;AAE7F,MAAa,iBAAiB,OAAe,sBAAsB,GAAG,WAAW,MAAK,MAAK,EAAE"}

package/es/base-ui/FocusScope/index.d.mts

@@ -0,0 +1,6 @@
+import { FocusScope, FocusScopeProps, useFocusScopeId } from "./FocusScope.mjs";
+import { getActiveScopeId, getLastFocusedItem, registerScope, setActiveScope, setLastFocusedItem, useActiveScopeId, useFocusScopeActive } from "./store.mjs";
+import { styles } from "./style.mjs";
+import { UseScopeArrowNavOptions, focusScopeItem, notifyScopeItemFocus, useScopeArrowNav } from "./useScopeArrowNav.mjs";
+import { UseScopeSwitcherOptions, useScopeSwitcher } from "./useScopeSwitcher.mjs";
+export { FocusScope, type FocusScopeProps, type UseScopeArrowNavOptions, type UseScopeSwitcherOptions, focusScopeItem, styles as focusScopeStyles, getActiveScopeId, getLastFocusedItem, notifyScopeItemFocus, registerScope, setActiveScope, setLastFocusedItem, useActiveScopeId, useFocusScopeActive, useFocusScopeId, useScopeArrowNav, useScopeSwitcher };

package/es/base-ui/FocusScope/store.d.mts

@@ -0,0 +1,11 @@
+//#region src/base-ui/FocusScope/store.d.ts
+declare const getActiveScopeId: () => string | null;
+declare const setActiveScope: (id: string | null) => void;
+declare const getLastFocusedItem: (scopeId: string) => string | null;
+declare const setLastFocusedItem: (scopeId: string, itemId: string | null) => void;
+declare const registerScope: (id: string) => () => void;
+declare const useActiveScopeId: () => string | null;
+declare const useFocusScopeActive: (id: string) => boolean;
+//#endregion
+export { getActiveScopeId, getLastFocusedItem, registerScope, setActiveScope, setLastFocusedItem, useActiveScopeId, useFocusScopeActive };
+//# sourceMappingURL=store.d.mts.map

package/es/base-ui/FocusScope/store.mjs

@@ -0,0 +1,76 @@
+import { useSyncExternalStore } from "react";
+//#region src/base-ui/FocusScope/store.ts
+let state = {
+	activeScopeId: null,
+	knownScopes: /* @__PURE__ */ new Map(),
+	lastFocusedItem: /* @__PURE__ */ new Map()
+};
+const listeners = /* @__PURE__ */ new Set();
+const setState = (patch) => {
+	state = {
+		...state,
+		...patch
+	};
+	listeners.forEach((listener) => listener());
+};
+const subscribe = (listener) => {
+	listeners.add(listener);
+	return () => listeners.delete(listener);
+};
+const getActiveScopeId = () => state.activeScopeId;
+const setActiveScope = (id) => {
+	if (id !== null && !state.knownScopes.has(id)) return;
+	if (state.activeScopeId === id) return;
+	setState({ activeScopeId: id });
+};
+const getLastFocusedItem = (scopeId) => state.lastFocusedItem.get(scopeId) ?? null;
+const setLastFocusedItem = (scopeId, itemId) => {
+	if ((state.lastFocusedItem.get(scopeId) ?? null) === itemId) return;
+	const next = new Map(state.lastFocusedItem);
+	if (itemId === null) next.delete(scopeId);
+	else next.set(scopeId, itemId);
+	setState({ lastFocusedItem: next });
+};
+const findScopeId = (event) => {
+	return (event.target instanceof Element ? event.target : null)?.closest("[data-focus-scope]")?.dataset.focusScope ?? null;
+};
+const onGlobalInteract = (event) => {
+	const id = findScopeId(event);
+	if (id !== null) setActiveScope(id);
+};
+let listening = false;
+const ensureDocumentListeners = () => {
+	if (listening || typeof document === "undefined") return;
+	listening = true;
+	document.addEventListener("pointerdown", onGlobalInteract, true);
+	document.addEventListener("focusin", onGlobalInteract, true);
+};
+const registerScope = (id) => {
+	ensureDocumentListeners();
+	const next = new Map(state.knownScopes);
+	next.set(id, (next.get(id) ?? 0) + 1);
+	setState({ knownScopes: next });
+	return () => {
+		const count = state.knownScopes.get(id) ?? 0;
+		const scopes = new Map(state.knownScopes);
+		if (count > 1) {
+			scopes.set(id, count - 1);
+			setState({ knownScopes: scopes });
+			return;
+		}
+		scopes.delete(id);
+		const lastFocused = new Map(state.lastFocusedItem);
+		lastFocused.delete(id);
+		setState({
+			activeScopeId: state.activeScopeId === id ? null : state.activeScopeId,
+			knownScopes: scopes,
+			lastFocusedItem: lastFocused
+		});
+	};
+};
+const useActiveScopeId = () => useSyncExternalStore(subscribe, getActiveScopeId, () => null);
+const useFocusScopeActive = (id) => useSyncExternalStore(subscribe, () => state.activeScopeId === id, () => false);
+//#endregion
+export { getActiveScopeId, getLastFocusedItem, registerScope, setActiveScope, setLastFocusedItem, subscribe, useActiveScopeId, useFocusScopeActive };
+
+//# sourceMappingURL=store.mjs.map

package/es/base-ui/FocusScope/store.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"store.mjs","names":[],"sources":["../../../src/base-ui/FocusScope/store.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react';\n\ninterface FocusScopeState {\n  activeScopeId: string | null;\n  knownScopes: Map<string, number>;\n  lastFocusedItem: Map<string, string>;\n}\n\nlet state: FocusScopeState = {\n  activeScopeId: null,\n  knownScopes: new Map(),\n  lastFocusedItem: new Map(),\n};\n\nconst listeners = new Set<() => void>();\n\nconst setState = (patch: Partial<FocusScopeState>) => {\n  state = { ...state, ...patch };\n  listeners.forEach((listener) => listener());\n};\n\nexport const subscribe = (listener: () => void) => {\n  listeners.add(listener);\n  return () => listeners.delete(listener);\n};\n\nexport const getActiveScopeId = () => state.activeScopeId;\n\nexport const setActiveScope = (id: string | null) => {\n  if (id !== null && !state.knownScopes.has(id)) return;\n  if (state.activeScopeId === id) return;\n  setState({ activeScopeId: id });\n};\n\nexport const getLastFocusedItem = (scopeId: string) => state.lastFocusedItem.get(scopeId) ?? null;\n\nexport const setLastFocusedItem = (scopeId: string, itemId: string | null) => {\n  if ((state.lastFocusedItem.get(scopeId) ?? null) === itemId) return;\n  const next = new Map(state.lastFocusedItem);\n  if (itemId === null) next.delete(scopeId);\n  else next.set(scopeId, itemId);\n  setState({ lastFocusedItem: next });\n};\n\nconst findScopeId = (event: Event) => {\n  const target = event.target instanceof Element ? event.target : null;\n  return target?.closest<HTMLElement>('[data-focus-scope]')?.dataset.focusScope ?? null;\n};\n\nconst onGlobalInteract = (event: Event) => {\n  const id = findScopeId(event);\n  if (id !== null) setActiveScope(id);\n};\n\nlet listening = false;\n\nconst ensureDocumentListeners = () => {\n  if (listening || typeof document === 'undefined') return;\n  listening = true;\n  document.addEventListener('pointerdown', onGlobalInteract, true);\n  document.addEventListener('focusin', onGlobalInteract, true);\n};\n\nexport const registerScope = (id: string) => {\n  ensureDocumentListeners();\n  const next = new Map(state.knownScopes);\n  next.set(id, (next.get(id) ?? 0) + 1);\n  setState({ knownScopes: next });\n\n  return () => {\n    const count = state.knownScopes.get(id) ?? 0;\n    const scopes = new Map(state.knownScopes);\n    if (count > 1) {\n      scopes.set(id, count - 1);\n      setState({ knownScopes: scopes });\n      return;\n    }\n    scopes.delete(id);\n    const lastFocused = new Map(state.lastFocusedItem);\n    lastFocused.delete(id);\n    setState({\n      activeScopeId: state.activeScopeId === id ? null : state.activeScopeId,\n      knownScopes: scopes,\n      lastFocusedItem: lastFocused,\n    });\n  };\n};\n\nexport const useActiveScopeId = () => useSyncExternalStore(subscribe, getActiveScopeId, () => null);\n\nexport const useFocusScopeActive = (id: string) =>\n  useSyncExternalStore(\n    subscribe,\n    () => state.activeScopeId === id,\n    () => false,\n  );\n"],"mappings":";;AAQA,IAAI,QAAyB;CAC3B,eAAe;CACf,6BAAa,IAAI,IAAI;CACrB,iCAAiB,IAAI,IAAI;AAC3B;AAEA,MAAM,4BAAY,IAAI,IAAgB;AAEtC,MAAM,YAAY,UAAoC;CACpD,QAAQ;EAAE,GAAG;EAAO,GAAG;CAAM;CAC7B,UAAU,SAAS,aAAa,SAAS,CAAC;AAC5C;AAEA,MAAa,aAAa,aAAyB;CACjD,UAAU,IAAI,QAAQ;CACtB,aAAa,UAAU,OAAO,QAAQ;AACxC;AAEA,MAAa,yBAAyB,MAAM;AAE5C,MAAa,kBAAkB,OAAsB;CACnD,IAAI,OAAO,QAAQ,CAAC,MAAM,YAAY,IAAI,EAAE,GAAG;CAC/C,IAAI,MAAM,kBAAkB,IAAI;CAChC,SAAS,EAAE,eAAe,GAAG,CAAC;AAChC;AAEA,MAAa,sBAAsB,YAAoB,MAAM,gBAAgB,IAAI,OAAO,KAAK;AAE7F,MAAa,sBAAsB,SAAiB,WAA0B;CAC5E,KAAK,MAAM,gBAAgB,IAAI,OAAO,KAAK,UAAU,QAAQ;CAC7D,MAAM,OAAO,IAAI,IAAI,MAAM,eAAe;CAC1C,IAAI,WAAW,MAAM,KAAK,OAAO,OAAO;MACnC,KAAK,IAAI,SAAS,MAAM;CAC7B,SAAS,EAAE,iBAAiB,KAAK,CAAC;AACpC;AAEA,MAAM,eAAe,UAAiB;CAEpC,QADe,MAAM,kBAAkB,UAAU,MAAM,SAAS,KAAA,EACjD,QAAqB,oBAAoB,CAAC,EAAE,QAAQ,cAAc;AACnF;AAEA,MAAM,oBAAoB,UAAiB;CACzC,MAAM,KAAK,YAAY,KAAK;CAC5B,IAAI,OAAO,MAAM,eAAe,EAAE;AACpC;AAEA,IAAI,YAAY;AAEhB,MAAM,gCAAgC;CACpC,IAAI,aAAa,OAAO,aAAa,aAAa;CAClD,YAAY;CACZ,SAAS,iBAAiB,eAAe,kBAAkB,IAAI;CAC/D,SAAS,iBAAiB,WAAW,kBAAkB,IAAI;AAC7D;AAEA,MAAa,iBAAiB,OAAe;CAC3C,wBAAwB;CACxB,MAAM,OAAO,IAAI,IAAI,MAAM,WAAW;CACtC,KAAK,IAAI,KAAK,KAAK,IAAI,EAAE,KAAK,KAAK,CAAC;CACpC,SAAS,EAAE,aAAa,KAAK,CAAC;CAE9B,aAAa;EACX,MAAM,QAAQ,MAAM,YAAY,IAAI,EAAE,KAAK;EAC3C,MAAM,SAAS,IAAI,IAAI,MAAM,WAAW;EACxC,IAAI,QAAQ,GAAG;GACb,OAAO,IAAI,IAAI,QAAQ,CAAC;GACxB,SAAS,EAAE,aAAa,OAAO,CAAC;GAChC;EACF;EACA,OAAO,OAAO,EAAE;EAChB,MAAM,cAAc,IAAI,IAAI,MAAM,eAAe;EACjD,YAAY,OAAO,EAAE;EACrB,SAAS;GACP,eAAe,MAAM,kBAAkB,KAAK,OAAO,MAAM;GACzD,aAAa;GACb,iBAAiB;EACnB,CAAC;CACH;AACF;AAEA,MAAa,yBAAyB,qBAAqB,WAAW,wBAAwB,IAAI;AAElG,MAAa,uBAAuB,OAClC,qBACE,iBACM,MAAM,kBAAkB,UACxB,KACR"}

package/es/base-ui/FocusScope/style.d.mts

@@ -0,0 +1,8 @@
+//#region src/base-ui/FocusScope/style.d.ts
+declare const styles: {
+  debugOutline: string;
+  root: string;
+};
+//#endregion
+export { styles };
+//# sourceMappingURL=style.d.mts.map

package/es/base-ui/FocusScope/style.mjs

@@ -0,0 +1,18 @@
+import { createStaticStyles } from "antd-style";
+//#region src/base-ui/FocusScope/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	debugOutline: css`
+    &[data-scope-active] {
+      outline: 2px dashed color-mix(in srgb, ${cssVar.colorInfo} 60%, transparent);
+      outline-offset: -2px;
+    }
+  `,
+	root: css`
+    position: relative;
+    outline: none;
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/FocusScope/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/FocusScope/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  debugOutline: css`\n    &[data-scope-active] {\n      outline: 2px dashed color-mix(in srgb, ${cssVar.colorInfo} 60%, transparent);\n      outline-offset: -2px;\n    }\n  `,\n  root: css`\n    position: relative;\n    outline: none;\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,cAAc,GAAG;;+CAE4B,OAAO,UAAU;;;;CAI9D,MAAM,GAAG;;;;AAIX,EAAE"}

package/es/base-ui/FocusScope/useScopeArrowNav.d.mts

@@ -0,0 +1,15 @@
+//#region src/base-ui/FocusScope/useScopeArrowNav.d.ts
+interface UseScopeArrowNavOptions {
+  enabled?: boolean;
+  extra?: Record<string, (event: KeyboardEvent) => void>;
+  itemSelector?: string;
+  onItemFocus?: (el: HTMLElement) => void;
+  scopeId: string;
+  vimKeys?: boolean;
+}
+declare const notifyScopeItemFocus: (scopeId: string, el: HTMLElement) => void;
+declare const focusScopeItem: (scopeId: string, el: HTMLElement) => void;
+declare const useScopeArrowNav: ({ scopeId, itemSelector, enabled, vimKeys, onItemFocus, extra }: UseScopeArrowNavOptions) => void;
+//#endregion
+export { UseScopeArrowNavOptions, focusScopeItem, notifyScopeItemFocus, useScopeArrowNav };
+//# sourceMappingURL=useScopeArrowNav.d.mts.map

package/es/base-ui/FocusScope/useScopeArrowNav.mjs

@@ -0,0 +1,111 @@
+import { getActiveScopeId, setLastFocusedItem } from "./store.mjs";
+import { hasModifier, isItemVisible, isTextInputTarget, scopeSelector } from "./domUtils.mjs";
+import { useEffect, useRef } from "react";
+//#region src/base-ui/FocusScope/useScopeArrowNav.ts
+let lastHandledEvent = null;
+const focusListeners = /* @__PURE__ */ new Map();
+const registerItemFocus = (scopeId, listener) => {
+	const set = focusListeners.get(scopeId) ?? /* @__PURE__ */ new Set();
+	set.add(listener);
+	focusListeners.set(scopeId, set);
+	return () => {
+		set.delete(listener);
+		if (set.size === 0) focusListeners.delete(scopeId);
+	};
+};
+const notifyScopeItemFocus = (scopeId, el) => {
+	const id = el.dataset.id;
+	if (id) setLastFocusedItem(scopeId, id);
+	focusListeners.get(scopeId)?.forEach((listener) => listener(el));
+};
+const getScopeRoot = (scopeId) => {
+	const selector = scopeSelector(scopeId);
+	const active = document.activeElement;
+	if (active instanceof HTMLElement) {
+		const owned = active.closest(selector);
+		if (owned) return owned;
+	}
+	const candidates = [...document.querySelectorAll(selector)];
+	return candidates.find(isItemVisible) ?? candidates[0] ?? null;
+};
+const focusScopeItem = (scopeId, el) => {
+	el.focus({ preventScroll: true });
+	el.scrollIntoView?.({ block: "nearest" });
+	notifyScopeItemFocus(scopeId, el);
+};
+const useScopeArrowNav = ({ scopeId, itemSelector = "[data-scope-item]", enabled = true, vimKeys = false, onItemFocus, extra }) => {
+	const optionsRef = useRef({
+		extra,
+		itemSelector,
+		onItemFocus,
+		scopeId
+	});
+	optionsRef.current = {
+		extra,
+		itemSelector,
+		onItemFocus,
+		scopeId
+	};
+	useEffect(() => {
+		if (!onItemFocus) return;
+		return registerItemFocus(scopeId, (el) => optionsRef.current.onItemFocus?.(el));
+	}, [scopeId, !!onItemFocus]);
+	useEffect(() => {
+		if (!enabled || typeof window === "undefined") return;
+		const getItems = () => {
+			const root = getScopeRoot(optionsRef.current.scopeId);
+			if (!root) return [];
+			return [...root.querySelectorAll(optionsRef.current.itemSelector)].filter(isItemVisible);
+		};
+		const currentIndex = (items) => {
+			const active = document.activeElement;
+			if (!(active instanceof HTMLElement)) return -1;
+			const item = active.closest(optionsRef.current.itemSelector);
+			return item ? items.indexOf(item) : -1;
+		};
+		const move = (direction) => {
+			const items = getItems();
+			if (items.length === 0) return;
+			const index = currentIndex(items);
+			const next = index === -1 ? direction === 1 ? 0 : items.length - 1 : (index + direction + items.length) % items.length;
+			focusScopeItem(optionsRef.current.scopeId, items[next]);
+		};
+		const edge = (which) => {
+			const items = getItems();
+			if (items.length === 0) return;
+			focusScopeItem(optionsRef.current.scopeId, items[which === "first" ? 0 : items.length - 1]);
+		};
+		const isReachable = () => {
+			const id = optionsRef.current.scopeId;
+			if (getActiveScopeId() === id) return true;
+			const active = document.activeElement;
+			return active instanceof HTMLElement && !!active.closest(scopeSelector(id));
+		};
+		const onKeyDown = (event) => {
+			if (event.defaultPrevented || lastHandledEvent === event) return;
+			if (hasModifier(event) || isTextInputTarget(event.target) || !isReachable()) return;
+			const builtin = {
+				ArrowDown: () => move(1),
+				ArrowUp: () => move(-1),
+				End: () => edge("last"),
+				Home: () => edge("first"),
+				...vimKeys && {
+					j: () => move(1),
+					k: () => move(-1)
+				}
+			};
+			const extraHandler = optionsRef.current.extra?.[event.key];
+			const handler = builtin[event.key] ?? (extraHandler && (() => extraHandler(event)));
+			if (!handler) return;
+			lastHandledEvent = event;
+			event.preventDefault();
+			handler();
+		};
+		window.addEventListener("keydown", onKeyDown, true);
+		return () => window.removeEventListener("keydown", onKeyDown, true);
+	}, [enabled, vimKeys]);
+};
+//#endregion
+export { focusScopeItem, getScopeRoot, notifyScopeItemFocus, useScopeArrowNav };
+
+//# sourceMappingURL=useScopeArrowNav.mjs.map

package/es/base-ui/FocusScope/useScopeArrowNav.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScopeArrowNav.mjs","names":[],"sources":["../../../src/base-ui/FocusScope/useScopeArrowNav.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nimport { hasModifier, isItemVisible, isTextInputTarget, scopeSelector } from './domUtils';\nimport { getActiveScopeId, setLastFocusedItem } from './store';\n\nexport interface UseScopeArrowNavOptions {\n  enabled?: boolean;\n  extra?: Record<string, (event: KeyboardEvent) => void>;\n  itemSelector?: string;\n  onItemFocus?: (el: HTMLElement) => void;\n  scopeId: string;\n  vimKeys?: boolean;\n}\n\n// Sibling instances for one scope id (mobile + desktop mounts) all see the same\n// KeyboardEvent; the first one claims it so focus only moves once.\nlet lastHandledEvent: KeyboardEvent | null = null;\n\nconst focusListeners = new Map<string, Set<(el: HTMLElement) => void>>();\n\nconst registerItemFocus = (scopeId: string, listener: (el: HTMLElement) => void) => {\n  const set = focusListeners.get(scopeId) ?? new Set();\n  set.add(listener);\n  focusListeners.set(scopeId, set);\n  return () => {\n    set.delete(listener);\n    if (set.size === 0) focusListeners.delete(scopeId);\n  };\n};\n\nexport const notifyScopeItemFocus = (scopeId: string, el: HTMLElement) => {\n  const id = el.dataset.id;\n  if (id) setLastFocusedItem(scopeId, id);\n  focusListeners.get(scopeId)?.forEach((listener) => listener(el));\n};\n\nexport const getScopeRoot = (scopeId: string): HTMLElement | null => {\n  const selector = scopeSelector(scopeId);\n  const active = document.activeElement;\n  if (active instanceof HTMLElement) {\n    const owned = active.closest<HTMLElement>(selector);\n    if (owned) return owned;\n  }\n  const candidates = [...document.querySelectorAll<HTMLElement>(selector)];\n  return candidates.find(isItemVisible) ?? candidates[0] ?? null;\n};\n\nexport const focusScopeItem = (scopeId: string, el: HTMLElement) => {\n  el.focus({ preventScroll: true });\n  el.scrollIntoView?.({ block: 'nearest' });\n  notifyScopeItemFocus(scopeId, el);\n};\n\nexport const useScopeArrowNav = ({\n  scopeId,\n  itemSelector = '[data-scope-item]',\n  enabled = true,\n  vimKeys = false,\n  onItemFocus,\n  extra,\n}: UseScopeArrowNavOptions) => {\n  const optionsRef = useRef({ extra, itemSelector, onItemFocus, scopeId });\n  optionsRef.current = { extra, itemSelector, onItemFocus, scopeId };\n\n  useEffect(() => {\n    if (!onItemFocus) return;\n    return registerItemFocus(scopeId, (el) => optionsRef.current.onItemFocus?.(el));\n  }, [scopeId, !!onItemFocus]);\n\n  useEffect(() => {\n    if (!enabled || typeof window === 'undefined') return;\n\n    const getItems = () => {\n      const root = getScopeRoot(optionsRef.current.scopeId);\n      if (!root) return [];\n      return [...root.querySelectorAll<HTMLElement>(optionsRef.current.itemSelector)].filter(\n        isItemVisible,\n      );\n    };\n\n    const currentIndex = (items: HTMLElement[]) => {\n      const active = document.activeElement;\n      if (!(active instanceof HTMLElement)) return -1;\n      const item = active.closest<HTMLElement>(optionsRef.current.itemSelector);\n      return item ? items.indexOf(item) : -1;\n    };\n\n    const move = (direction: 1 | -1) => {\n      const items = getItems();\n      if (items.length === 0) return;\n      const index = currentIndex(items);\n      const next =\n        index === -1\n          ? direction === 1\n            ? 0\n            : items.length - 1\n          : (index + direction + items.length) % items.length;\n      focusScopeItem(optionsRef.current.scopeId, items[next]);\n    };\n\n    const edge = (which: 'first' | 'last') => {\n      const items = getItems();\n      if (items.length === 0) return;\n      focusScopeItem(optionsRef.current.scopeId, items[which === 'first' ? 0 : items.length - 1]);\n    };\n\n    const isReachable = () => {\n      const id = optionsRef.current.scopeId;\n      if (getActiveScopeId() === id) return true;\n      const active = document.activeElement;\n      return active instanceof HTMLElement && !!active.closest(scopeSelector(id));\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.defaultPrevented || lastHandledEvent === event) return;\n      if (hasModifier(event) || isTextInputTarget(event.target) || !isReachable()) return;\n\n      const builtin: Record<string, () => void> = {\n        ArrowDown: () => move(1),\n        ArrowUp: () => move(-1),\n        End: () => edge('last'),\n        Home: () => edge('first'),\n        ...(vimKeys && { j: () => move(1), k: () => move(-1) }),\n      };\n      const extraHandler = optionsRef.current.extra?.[event.key];\n      const handler = builtin[event.key] ?? (extraHandler && (() => extraHandler(event)));\n      if (!handler) return;\n\n      lastHandledEvent = event;\n      event.preventDefault();\n      handler();\n    };\n\n    window.addEventListener('keydown', onKeyDown, true);\n    return () => window.removeEventListener('keydown', onKeyDown, true);\n  }, [enabled, vimKeys]);\n};\n"],"mappings":"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"}

package/es/base-ui/FocusScope/useScopeSwitcher.d.mts

@@ -0,0 +1,9 @@
+//#region src/base-ui/FocusScope/useScopeSwitcher.d.ts
+interface UseScopeSwitcherOptions {
+  enabled?: boolean;
+  vimKeys?: boolean;
+}
+declare const useScopeSwitcher: ({ enabled, vimKeys }?: UseScopeSwitcherOptions) => void;
+//#endregion
+export { UseScopeSwitcherOptions, useScopeSwitcher };
+//# sourceMappingURL=useScopeSwitcher.d.mts.map