@yamada-ui/react 2.2.2-dev-20260525091318 → 2.2.2-dev-20260525152928

package/dist/esm/components/sidebar/use-sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-sidebar.js","names":["createContext"],"sources":["../../../../src/components/sidebar/use-sidebar.ts"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode, RefObject } from \"react\"\nimport { Children, useCallback, useId, useRef, useState } from \"react\"\nimport {\n  type HTMLProps,\n  mergeProps,\n  type PropGetter,\n  useEnvironment,\n} from \"../../core\"\nimport { useAsyncCallback } from \"../../hooks/use-async-callback\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n  useDisclosure,\n  type UseDisclosureProps,\n} from \"../../hooks/use-disclosure\"\nimport { useWindowEvent } from \"../../hooks/use-window-event\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  ariaAttr,\n  assignRef,\n  createContext,\n  cx,\n  dataAttr,\n  handlerAll,\n  mergeRefs,\n  setAttribute,\n  useIds,\n  useSafeLayoutEffect,\n} from \"../../utils\"\n\nexport interface SidebarControl {\n  collapse: () => void\n  expand: () => void\n}\n\ninterface SidebarDescendantProps {\n  expanded: boolean\n  group: boolean\n  id: string\n  value: string\n}\n\nconst {\n  DescendantsContext: SidebarDescendantsContext,\n  useDescendant: useSidebarDescendant,\n  useDescendants: useSidebarDescendants,\n} = createDescendants<HTMLElement, SidebarDescendantProps>()\n\nexport {\n  SidebarDescendantsContext,\n  useSidebarDescendant,\n  useSidebarDescendants,\n}\n\ninterface SidebarContext extends Pick<\n  UseSidebarReturn,\n  | \"expandedValue\"\n  | \"mobile\"\n  | \"onClose\"\n  | \"onExpandedChange\"\n  | \"onOpen\"\n  | \"onSelectedChange\"\n  | \"onToggle\"\n  | \"open\"\n  | \"selectedValue\"\n> {}\n\nconst [SidebarContext, useSidebarContext] = createContext<SidebarContext>({\n  name: \"SidebarContext\",\n})\n\nexport { SidebarContext, useSidebarContext }\n\ninterface SidebarItemContext extends Pick<\n  UseSidebarItemReturn,\n  \"branchOpen\" | \"groupOpen\"\n> {}\n\nconst [SidebarItemContext, useSidebarItemContext] =\n  createContext<SidebarItemContext>({\n    name: \"SidebarItemContext\",\n    strict: false,\n  })\n\nexport { SidebarItemContext, useSidebarItemContext }\n\nexport interface UseSidebarProps extends HTMLProps<\"div\"> {\n  /**\n   * Ref of the sidebar callbacks.\n   */\n  controlRef?: RefObject<null | SidebarControl>\n  /**\n   * The initial expanded value of the sidebar.\n   */\n  defaultExpandedValue?: string[]\n  /**\n   * The initial selected value of the sidebar.\n   */\n  defaultSelectedValue?: string\n  /**\n   * The disclosure props for the desktop and mobile.\n   */\n  disclosure?: {\n    desktop?: Omit<UseDisclosureProps, \"timing\">\n    mobile?: Omit<UseDisclosureProps, \"timing\">\n  }\n  /**\n   * The expanded value of the sidebar.\n   */\n  expandedValue?: string[]\n  /**\n   * If `true`, the trigger click event will be switched to mobile.\n   *\n   * @default false\n   */\n  mobile?: boolean\n  /**\n   * The selected value of the sidebar.\n   */\n  selectedValue?: string\n  /**\n   * The callback invoked when expanded value changes.\n   */\n  onExpandedChange?: (value: string[]) => void\n  /**\n   * The callback invoked when selected value changes.\n   */\n  onSelectedChange?: (value: string) => void\n}\n\nexport const useSidebar = ({\n  controlRef,\n  defaultExpandedValue = [],\n  defaultSelectedValue,\n  disclosure,\n  expandedValue: expandedValueProp,\n  mobile = false,\n  selectedValue: selectedValueProp,\n  onExpandedChange: onExpandedChangeProp,\n  onSelectedChange: onSelectedChangeProp,\n  ...rest\n}: UseSidebarProps = {}) => {\n  const { t } = useI18n(\"sidebar\")\n  const desktopDisclosure = useDisclosure({\n    defaultOpen: disclosure?.desktop?.defaultOpen ?? true,\n    open: disclosure?.desktop?.open,\n    onClose: disclosure?.desktop?.onClose,\n    onOpen: disclosure?.desktop?.onOpen,\n  })\n  const mobileDisclosure = useDisclosure({\n    defaultOpen: disclosure?.mobile?.defaultOpen ?? false,\n    open: disclosure?.mobile?.open,\n    onClose: disclosure?.mobile?.onClose,\n    onOpen: disclosure?.mobile?.onOpen,\n  })\n  const [selectedValue, setSelectedValue] = useControllableState({\n    defaultValue: defaultSelectedValue,\n    value: selectedValueProp,\n    onChange: onSelectedChangeProp,\n  })\n  const [expandedValue, setExpandedValue] = useControllableState({\n    defaultValue: defaultExpandedValue,\n    value: expandedValueProp,\n    onChange: onExpandedChangeProp,\n  })\n  const descendants = useSidebarDescendants()\n  const open = mobile ? mobileDisclosure.open : desktopDisclosure.open\n  const onOpen = mobile ? mobileDisclosure.onOpen : desktopDisclosure.onOpen\n  const onClose = mobile ? mobileDisclosure.onClose : desktopDisclosure.onClose\n  const onToggle = mobile\n    ? mobileDisclosure.onToggle\n    : desktopDisclosure.onToggle\n\n  const onSelectedChange = useCallback(\n    (value: string) => {\n      setSelectedValue(value)\n    },\n    [setSelectedValue],\n  )\n\n  const onExpandAll = useCallback(() => {\n    const values = descendants.enabledValues()\n    const group = values.filter(({ group }) => group)\n    const value = group.map(({ value }) => value)\n\n    setExpandedValue(value)\n  }, [descendants, setExpandedValue])\n\n  const onCollapseAll = useCallback(() => {\n    setExpandedValue([])\n  }, [setExpandedValue])\n\n  const onExpandedChange = useCallback(\n    (value: string) => {\n      setExpandedValue((prev) => {\n        if (prev.includes(value)) {\n          return prev.filter((prevValue) => prevValue !== value)\n        } else {\n          return [...prev, value]\n        }\n      })\n    },\n    [setExpandedValue],\n  )\n\n  assignRef(controlRef, { collapse: onCollapseAll, expand: onExpandAll })\n\n  useWindowEvent(\"keydown\", (ev) => {\n    if (ev.key !== \"b\") return\n    if (!ev.metaKey && !ev.ctrlKey) return\n\n    ev.preventDefault()\n\n    desktopDisclosure.onToggle()\n  })\n\n  const getRootProps: PropGetter<\"div\"> = useCallback(\n    (props = {}) =>\n      mergeProps({ \"data-expanded\": dataAttr(open) }, rest, props)(),\n    [open, rest],\n  )\n\n  const getTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-expanded\": open,\n      \"aria-label\": t(open ? \"Close sidebar\" : \"Open sidebar\"),\n      ...props,\n      onClick: handlerAll(props.onClick, onToggle),\n    }),\n    [open, t, onToggle],\n  )\n\n  const getSidePanelProps: PropGetter<\"aside\"> = useCallback(\n    (props = {}) => ({ \"data-expanded\": dataAttr(open), ...props }),\n    [open],\n  )\n\n  const getHeaderProps: PropGetter<\"header\"> = useCallback(\n    (props = {}) => ({ ...props }),\n    [],\n  )\n\n  const getFooterProps: PropGetter<\"footer\"> = useCallback(\n    (props = {}) => ({ ...props }),\n    [],\n  )\n\n  const getContentProps: PropGetter<\"ul\"> = useCallback(\n    (props = {}) => ({ ...props }),\n    [],\n  )\n\n  return {\n    descendants,\n    expandedValue,\n    mobile,\n    open,\n    selectedValue,\n    getContentProps,\n    getFooterProps,\n    getHeaderProps,\n    getRootProps,\n    getSidePanelProps,\n    getTriggerProps,\n    onClose,\n    onExpandedChange,\n    onOpen,\n    onSelectedChange,\n    onToggle,\n  }\n}\n\nexport type UseSidebarReturn = ReturnType<typeof useSidebar>\n\nexport interface UseSidebarGroupProps extends HTMLProps<\"li\"> {}\n\nexport const useSidebarGroup = ({ ...rest }: UseSidebarGroupProps = {}) => {\n  const { getDocument } = useEnvironment()\n  const rootRef = useRef<HTMLLIElement>(null)\n  const contentRef = useRef<HTMLDivElement>(null)\n  const labelId = useId()\n\n  useSafeLayoutEffect(() => {\n    const el = getDocument()?.getElementById(labelId)\n\n    if (!el) return\n\n    if (rootRef.current)\n      setAttribute(rootRef.current, \"aria-labelledby\", labelId)\n    if (contentRef.current)\n      setAttribute(contentRef.current, \"aria-labelledby\", labelId)\n  }, [])\n\n  const getRootProps: PropGetter<\"li\"> = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps({ ref }, rest, props, { ref: rootRef })(),\n    [rest, rootRef],\n  )\n\n  const getLabelProps: PropGetter<\"span\"> = useCallback(\n    (props = {}) => ({ id: labelId, ...props }),\n    [labelId],\n  )\n\n  const getContentProps: PropGetter<\"div\"> = useCallback(\n    ({ ref, ...props } = {}) => ({\n      ref: mergeRefs(ref, contentRef),\n      ...props,\n    }),\n    [],\n  )\n\n  return { getContentProps, getLabelProps, getRootProps }\n}\n\nexport type UseSidebarGroupReturn = ReturnType<typeof useSidebarGroup>\n\nexport interface UseSidebarItemProps\n  extends HTMLProps<\"li\">, Omit<UseDisclosureProps, \"timing\"> {\n  /**\n   * The value of the item.\n   */\n  value: string\n  /**\n   * If `true`, the tree item will be disabled.\n   *\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * If `true`, the link will open in new tab.\n   *\n   * @default false\n   */\n  external?: boolean\n  /**\n   * If provided, the sidebar item will be rendered as an async sidebar item.\n   */\n  asyncChildren?: () => Promise<ReactNode>\n}\n\nexport const useSidebarItem = ({\n  asyncChildren,\n  children: childrenProp,\n  defaultOpen,\n  disabled = false,\n  external,\n  open: openProp,\n  value,\n  onClose: onCloseProp,\n  onOpen: onOpenProp,\n  ...rest\n}: UseSidebarItemProps) => {\n  const context = useSidebarItemContext()\n  const {\n    expandedValue,\n    open,\n    selectedValue,\n    onExpandedChange,\n    onSelectedChange,\n  } = useSidebarContext()\n  const [children, setChildren] = useState<ReactNode>(childrenProp)\n  const [itemId, labelId, contentId] = useIds()\n  const initialAsyncRef = useRef(false)\n  const async = !!asyncChildren\n  const group = async || Children.count(children) > 0\n  const nested = !!context\n  const selected = !!value && selectedValue === value\n  const defaultExpanded = !!value && expandedValue.includes(value)\n  const {\n    open: groupOpen,\n    onClose,\n    onOpen,\n  } = useDisclosure({\n    defaultOpen: defaultOpen ?? defaultExpanded,\n    open: openProp,\n    onClose: onCloseProp,\n    onOpen: onOpenProp,\n  })\n  const branchOpen: boolean[] = nested\n    ? [...context.branchOpen, groupOpen]\n    : [groupOpen]\n  const expanded = branchOpen.slice(0, -1).every(Boolean)\n  const { register } = useSidebarDescendant({\n    id: itemId!,\n    disabled,\n    expanded,\n    group,\n    value,\n  })\n\n  const [groupLoading, onGroupChildren] = useAsyncCallback(async () => {\n    const children = await asyncChildren?.()\n\n    setChildren(children)\n  }, [asyncChildren])\n\n  const onGroupOpen = useCallback(() => {\n    if (disabled || !group || !value || groupLoading) return\n\n    if (async && !initialAsyncRef.current) {\n      initialAsyncRef.current = true\n\n      onGroupChildren()\n        .then(() => {\n          onOpen()\n          onExpandedChange(value)\n        })\n        .catch(() => {\n          initialAsyncRef.current = false\n        })\n    } else {\n      onOpen()\n      onExpandedChange(value)\n    }\n  }, [\n    disabled,\n    group,\n    value,\n    groupLoading,\n    async,\n    onGroupChildren,\n    onOpen,\n    onExpandedChange,\n  ])\n\n  const onGroupClose = useCallback(() => {\n    if (disabled || !group || !value) return\n\n    onClose()\n    onExpandedChange(value)\n  }, [disabled, group, value, onClose, onExpandedChange])\n\n  const onGroupToggle = useCallback(() => {\n    if (groupOpen) {\n      onGroupClose()\n    } else {\n      onGroupOpen()\n    }\n  }, [groupOpen, onGroupClose, onGroupOpen])\n\n  useSafeLayoutEffect(() => {\n    if (defaultExpanded) {\n      if (async && !initialAsyncRef.current) {\n        initialAsyncRef.current = true\n\n        onGroupChildren()\n          .then(() => {\n            onOpen()\n          })\n          .catch(() => {\n            initialAsyncRef.current = false\n          })\n      } else {\n        onOpen()\n      }\n    } else {\n      onClose()\n    }\n  }, [defaultExpanded])\n\n  const getItemProps: PropGetter<\"li\"> = useCallback(\n    ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) => {\n      const merged = mergeProps(\n        {\n          id: itemId,\n          \"aria-current\": selected ? \"page\" : undefined,\n          \"aria-disabled\": ariaAttr(disabled),\n          \"aria-labelledby\": cx(ariaLabelledby, labelId),\n          \"data-disabled\": dataAttr(disabled),\n          \"data-selected\": dataAttr(selected),\n        },\n        rest,\n        props,\n        { ref },\n        { ref: register },\n      )()\n\n      return {\n        ...merged,\n        onClick: handlerAll(\n          merged.onClick,\n          !group ? () => onSelectedChange(value) : undefined,\n        ),\n      }\n    },\n    [\n      itemId,\n      register,\n      selected,\n      disabled,\n      labelId,\n      rest,\n      group,\n      onSelectedChange,\n      value,\n    ],\n  )\n\n  const getIndicatorProps: PropGetter<\"svg\"> = useCallback(\n    (props) => ({\n      \"aria-disabled\": ariaAttr(disabled),\n      \"aria-expanded\": groupOpen,\n      \"aria-hidden\": true,\n      \"data-disabled\": dataAttr(disabled),\n      \"data-loading\": dataAttr(groupLoading),\n      \"data-selected\": dataAttr(selected),\n      role: \"presentation\",\n      ...props,\n    }),\n    [disabled, groupOpen, groupLoading, selected],\n  )\n\n  const getTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": contentId,\n      \"aria-disabled\": ariaAttr(disabled),\n      \"aria-expanded\": groupOpen,\n      \"data-disabled\": dataAttr(disabled),\n      \"data-expanded\": dataAttr(groupOpen),\n      \"data-selected\": dataAttr(selected),\n      tabIndex: open && expanded && !disabled ? 0 : -1,\n      ...props,\n      onClick: handlerAll(props.onClick, onGroupToggle),\n    }),\n    [contentId, disabled, groupOpen, selected, open, expanded, onGroupToggle],\n  )\n\n  const getLinkProps: PropGetter<\"a\"> = useCallback(\n    (props = {}) => ({\n      href: value,\n      rel: external ? \"noopener\" : undefined,\n      target: external ? \"_blank\" : undefined,\n      \"data-disabled\": dataAttr(disabled),\n      \"data-selected\": dataAttr(selected),\n      tabIndex: open && expanded && !disabled ? 0 : -1,\n      ...props,\n      onClick: handlerAll(props.onClick, (ev) => {\n        if (!disabled) return\n\n        ev.preventDefault()\n        ev.stopPropagation()\n      }),\n    }),\n    [disabled, expanded, external, open, selected, value],\n  )\n\n  const getContentProps: PropGetter<\"ul\"> = useCallback(\n    ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n      id: contentId,\n      \"aria-busy\": ariaAttr(groupLoading),\n      \"aria-labelledby\": cx(ariaLabelledby, labelId),\n      \"data-disabled\": dataAttr(disabled),\n      ...props,\n    }),\n    [contentId, labelId, disabled, groupLoading],\n  )\n\n  const getLabelProps: PropGetter<\"span\"> = useCallback(\n    (props = {}) => ({ id: labelId, ...props }),\n    [labelId],\n  )\n\n  return {\n    branchOpen,\n    children,\n    disabled,\n    expanded,\n    expandedValue,\n    group,\n    groupLoading,\n    groupOpen,\n    open,\n    selected,\n    selectedValue,\n    value,\n    getContentProps,\n    getIndicatorProps,\n    getItemProps,\n    getLabelProps,\n    getLinkProps,\n    getTriggerProps,\n    onExpandedChange,\n    onGroupClose,\n    onGroupOpen,\n    onGroupToggle,\n    onSelectedChange,\n  }\n}\n\nexport type UseSidebarItemReturn = ReturnType<typeof useSidebarItem>\n"],"mappings":"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"}
+{"version":3,"file":"use-sidebar.js","names":["createContext"],"sources":["../../../../src/components/sidebar/use-sidebar.ts"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode, RefObject } from \"react\"\nimport { Children, useCallback, useId, useRef, useState } from \"react\"\nimport {\n  type HTMLProps,\n  mergeProps,\n  type PropGetter,\n  useEnvironment,\n} from \"../../core\"\nimport { useAsyncCallback } from \"../../hooks/use-async-callback\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n  useDisclosure,\n  type UseDisclosureProps,\n} from \"../../hooks/use-disclosure\"\nimport { useWindowEvent } from \"../../hooks/use-window-event\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  ariaAttr,\n  assignRef,\n  createContext,\n  cx,\n  dataAttr,\n  handlerAll,\n  mergeRefs,\n  setAttribute,\n  useIds,\n  useSafeLayoutEffect,\n} from \"../../utils\"\n\nexport interface SidebarControl {\n  collapse: () => void\n  expand: () => void\n}\n\ninterface SidebarDescendantProps {\n  expanded: boolean\n  group: boolean\n  id: string\n  value: string\n}\n\nconst {\n  DescendantsContext: SidebarDescendantsContext,\n  useDescendant: useSidebarDescendant,\n  useDescendants: useSidebarDescendants,\n} = createDescendants<HTMLElement, SidebarDescendantProps>()\n\nexport {\n  SidebarDescendantsContext,\n  useSidebarDescendant,\n  useSidebarDescendants,\n}\n\ninterface SidebarContext extends Pick<\n  UseSidebarReturn,\n  | \"expandedValue\"\n  | \"mobile\"\n  | \"onClose\"\n  | \"onExpandedChange\"\n  | \"onOpen\"\n  | \"onSelectedChange\"\n  | \"onToggle\"\n  | \"open\"\n  | \"selectedValue\"\n> {}\n\nconst [SidebarContext, useSidebarContext] = createContext<SidebarContext>({\n  name: \"SidebarContext\",\n})\n\nexport { SidebarContext, useSidebarContext }\n\ninterface SidebarItemContext extends Pick<\n  UseSidebarItemReturn,\n  \"branchOpen\" | \"groupOpen\"\n> {}\n\nconst [SidebarItemContext, useSidebarItemContext] =\n  createContext<SidebarItemContext>({\n    name: \"SidebarItemContext\",\n    strict: false,\n  })\n\nexport { SidebarItemContext, useSidebarItemContext }\n\nexport interface UseSidebarProps extends HTMLProps<\"div\"> {\n  /**\n   * Ref of the sidebar callbacks.\n   */\n  controlRef?: RefObject<null | SidebarControl>\n  /**\n   * The initial expanded value of the sidebar.\n   */\n  defaultExpandedValue?: string[]\n  /**\n   * The initial selected value of the sidebar.\n   */\n  defaultSelectedValue?: string\n  /**\n   * The disclosure props for the desktop and mobile.\n   */\n  disclosure?: {\n    desktop?: Omit<UseDisclosureProps, \"timing\">\n    mobile?: Omit<UseDisclosureProps, \"timing\">\n  }\n  /**\n   * The expanded value of the sidebar.\n   */\n  expandedValue?: string[]\n  /**\n   * If `true`, the trigger click event will be switched to mobile.\n   *\n   * @default false\n   */\n  mobile?: boolean\n  /**\n   * The selected value of the sidebar.\n   */\n  selectedValue?: string\n  /**\n   * The callback invoked when expanded value changes.\n   */\n  onExpandedChange?: (value: string[]) => void\n  /**\n   * The callback invoked when selected value changes.\n   */\n  onSelectedChange?: (value: string) => void\n}\n\nexport const useSidebar = ({\n  controlRef,\n  defaultExpandedValue = [],\n  defaultSelectedValue,\n  disclosure,\n  expandedValue: expandedValueProp,\n  mobile = false,\n  selectedValue: selectedValueProp,\n  onExpandedChange: onExpandedChangeProp,\n  onSelectedChange: onSelectedChangeProp,\n  ...rest\n}: UseSidebarProps = {}) => {\n  const { t } = useI18n(\"sidebar\")\n  const desktopDisclosure = useDisclosure({\n    defaultOpen: disclosure?.desktop?.defaultOpen ?? true,\n    open: disclosure?.desktop?.open,\n    onClose: disclosure?.desktop?.onClose,\n    onOpen: disclosure?.desktop?.onOpen,\n  })\n  const mobileDisclosure = useDisclosure({\n    defaultOpen: disclosure?.mobile?.defaultOpen ?? false,\n    open: disclosure?.mobile?.open,\n    onClose: disclosure?.mobile?.onClose,\n    onOpen: disclosure?.mobile?.onOpen,\n  })\n  const [selectedValue, setSelectedValue] = useControllableState({\n    defaultValue: defaultSelectedValue,\n    value: selectedValueProp,\n    onChange: onSelectedChangeProp,\n  })\n  const [expandedValue, setExpandedValue] = useControllableState({\n    defaultValue: defaultExpandedValue,\n    value: expandedValueProp,\n    onChange: onExpandedChangeProp,\n  })\n  const descendants = useSidebarDescendants()\n  const open = mobile ? mobileDisclosure.open : desktopDisclosure.open\n  const onOpen = mobile ? mobileDisclosure.onOpen : desktopDisclosure.onOpen\n  const onClose = mobile ? mobileDisclosure.onClose : desktopDisclosure.onClose\n  const onToggle = mobile\n    ? mobileDisclosure.onToggle\n    : desktopDisclosure.onToggle\n\n  const onSelectedChange = useCallback(\n    (value: string) => {\n      setSelectedValue(value)\n    },\n    [setSelectedValue],\n  )\n\n  const onExpandAll = useCallback(() => {\n    const values = descendants.enabledValues()\n    const group = values.filter(({ group }) => group)\n    const value = group.map(({ value }) => value)\n\n    setExpandedValue(value)\n  }, [descendants, setExpandedValue])\n\n  const onCollapseAll = useCallback(() => {\n    setExpandedValue([])\n  }, [setExpandedValue])\n\n  const onExpandedChange = useCallback(\n    (value: string) => {\n      setExpandedValue((prev) => {\n        if (prev.includes(value)) {\n          return prev.filter((prevValue) => prevValue !== value)\n        } else {\n          return [...prev, value]\n        }\n      })\n    },\n    [setExpandedValue],\n  )\n\n  assignRef(controlRef, { collapse: onCollapseAll, expand: onExpandAll })\n\n  useWindowEvent(\"keydown\", (ev) => {\n    if (ev.key !== \"b\") return\n    if (!ev.metaKey && !ev.ctrlKey) return\n\n    ev.preventDefault()\n\n    desktopDisclosure.onToggle()\n  })\n\n  const getRootProps: PropGetter<\"div\"> = useCallback(\n    (props = {}) =>\n      mergeProps({ \"data-expanded\": dataAttr(open) }, rest, props)(),\n    [open, rest],\n  )\n\n  const getTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-expanded\": open,\n      \"aria-label\": t(open ? \"Close sidebar\" : \"Open sidebar\"),\n      ...props,\n      onClick: handlerAll(props.onClick, onToggle),\n    }),\n    [open, t, onToggle],\n  )\n\n  const getSidePanelProps: PropGetter<\"aside\"> = useCallback(\n    (props = {}) => ({ \"data-expanded\": dataAttr(open), ...props }),\n    [open],\n  )\n\n  const getHeaderProps: PropGetter<\"header\"> = useCallback(\n    (props = {}) => ({ ...props }),\n    [],\n  )\n\n  const getFooterProps: PropGetter<\"footer\"> = useCallback(\n    (props = {}) => ({ ...props }),\n    [],\n  )\n\n  const getContentProps: PropGetter<\"ul\"> = useCallback(\n    (props = {}) => ({ ...props }),\n    [],\n  )\n\n  return {\n    descendants,\n    expandedValue,\n    mobile,\n    open,\n    selectedValue,\n    getContentProps,\n    getFooterProps,\n    getHeaderProps,\n    getRootProps,\n    getSidePanelProps,\n    getTriggerProps,\n    onClose,\n    onExpandedChange,\n    onOpen,\n    onSelectedChange,\n    onToggle,\n  }\n}\n\nexport type UseSidebarReturn = ReturnType<typeof useSidebar>\n\nexport interface UseSidebarGroupProps extends HTMLProps<\"li\"> {}\n\nexport const useSidebarGroup = ({ ...rest }: UseSidebarGroupProps = {}) => {\n  const { getDocument } = useEnvironment()\n  const rootRef = useRef<HTMLLIElement>(null)\n  const contentRef = useRef<HTMLDivElement>(null)\n  const labelId = useId()\n\n  useSafeLayoutEffect(() => {\n    const el = getDocument()?.getElementById(labelId)\n\n    if (!el) return\n\n    if (rootRef.current)\n      setAttribute(rootRef.current, \"aria-labelledby\", labelId)\n    if (contentRef.current)\n      setAttribute(contentRef.current, \"aria-labelledby\", labelId)\n  }, [])\n\n  const getRootProps: PropGetter<\"li\"> = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps({ ref }, rest, props, { ref: rootRef })(),\n    [rest, rootRef],\n  )\n\n  const getLabelProps: PropGetter<\"span\"> = useCallback(\n    (props = {}) => ({ id: labelId, ...props }),\n    [labelId],\n  )\n\n  const getContentProps: PropGetter<\"div\"> = useCallback(\n    ({ ref, ...props } = {}) => ({\n      ref: mergeRefs(ref, contentRef),\n      ...props,\n    }),\n    [],\n  )\n\n  return { getContentProps, getLabelProps, getRootProps }\n}\n\nexport type UseSidebarGroupReturn = ReturnType<typeof useSidebarGroup>\n\nexport interface UseSidebarItemProps\n  extends HTMLProps<\"li\">, Omit<UseDisclosureProps, \"timing\"> {\n  /**\n   * The value of the item.\n   */\n  value: string\n  /**\n   * If `true`, the tree item will be disabled.\n   *\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * If `true`, the link will open in new tab.\n   *\n   * @default false\n   */\n  external?: boolean\n  /**\n   * If provided, the sidebar item will be rendered as an async sidebar item.\n   */\n  asyncChildren?: () => Promise<ReactNode>\n}\n\nexport const useSidebarItem = ({\n  asyncChildren,\n  children: childrenProp,\n  defaultOpen,\n  disabled = false,\n  external,\n  open: openProp,\n  value,\n  onClose: onCloseProp,\n  onOpen: onOpenProp,\n  ...rest\n}: UseSidebarItemProps) => {\n  const context = useSidebarItemContext()\n  const {\n    expandedValue,\n    open,\n    selectedValue,\n    onExpandedChange,\n    onSelectedChange,\n  } = useSidebarContext()\n  const [children, setChildren] = useState<ReactNode>(childrenProp)\n  const [itemId, labelId, contentId] = useIds()\n  const initialAsyncRef = useRef(false)\n  const async = !!asyncChildren\n  const group = async || Children.count(children) > 0\n  const nested = !!context\n  const selected = !!value && selectedValue === value\n  const defaultExpanded = !!value && expandedValue.includes(value)\n  const {\n    open: groupOpen,\n    onClose,\n    onOpen,\n  } = useDisclosure({\n    defaultOpen: defaultOpen ?? defaultExpanded,\n    open: openProp,\n    onClose: onCloseProp,\n    onOpen: onOpenProp,\n  })\n  const branchOpen: boolean[] = nested\n    ? [...context.branchOpen, groupOpen]\n    : [groupOpen]\n  const expanded = branchOpen.slice(0, -1).every(Boolean)\n  const { register } = useSidebarDescendant({\n    id: itemId!,\n    disabled,\n    expanded,\n    group,\n    value,\n  })\n\n  const [groupLoading, onGroupChildren] = useAsyncCallback(async () => {\n    const children = await asyncChildren?.()\n\n    setChildren(children)\n  }, [asyncChildren])\n\n  const onGroupOpen = useCallback(() => {\n    if (disabled || !group || !value || groupLoading) return\n\n    if (async && !initialAsyncRef.current) {\n      initialAsyncRef.current = true\n\n      onGroupChildren()\n        .then(() => {\n          onOpen()\n          onExpandedChange(value)\n        })\n        .catch(() => {\n          initialAsyncRef.current = false\n        })\n    } else {\n      onOpen()\n      onExpandedChange(value)\n    }\n  }, [\n    disabled,\n    group,\n    value,\n    groupLoading,\n    async,\n    onGroupChildren,\n    onOpen,\n    onExpandedChange,\n  ])\n\n  const onGroupClose = useCallback(() => {\n    if (disabled || !group || !value) return\n\n    onClose()\n    onExpandedChange(value)\n  }, [disabled, group, value, onClose, onExpandedChange])\n\n  const onGroupToggle = useCallback(() => {\n    if (groupOpen) {\n      onGroupClose()\n    } else {\n      onGroupOpen()\n    }\n  }, [groupOpen, onGroupClose, onGroupOpen])\n\n  useSafeLayoutEffect(() => {\n    if (defaultExpanded) {\n      if (async && !initialAsyncRef.current) {\n        initialAsyncRef.current = true\n\n        onGroupChildren()\n          .then(() => {\n            onOpen()\n          })\n          .catch(() => {\n            initialAsyncRef.current = false\n          })\n      } else {\n        onOpen()\n      }\n    } else {\n      onClose()\n    }\n  }, [defaultExpanded])\n\n  const getItemProps: PropGetter<\"li\"> = useCallback(\n    ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) => {\n      const merged = mergeProps(\n        {\n          id: itemId,\n          \"aria-current\": selected ? \"page\" : undefined,\n          \"aria-disabled\": ariaAttr(disabled),\n          \"aria-labelledby\": cx(ariaLabelledby, labelId),\n          \"data-disabled\": dataAttr(disabled),\n          \"data-selected\": dataAttr(selected),\n        },\n        rest,\n        props,\n        { ref },\n        { ref: register },\n      )()\n\n      return {\n        ...merged,\n        onClick: handlerAll(\n          merged.onClick,\n          !group ? () => onSelectedChange(value) : undefined,\n        ),\n      }\n    },\n    [\n      itemId,\n      register,\n      selected,\n      disabled,\n      labelId,\n      rest,\n      group,\n      onSelectedChange,\n      value,\n    ],\n  )\n\n  const getIndicatorProps: PropGetter<\"svg\"> = useCallback(\n    (props) => ({\n      \"aria-disabled\": ariaAttr(disabled),\n      \"aria-expanded\": groupOpen,\n      \"aria-hidden\": true,\n      \"data-disabled\": dataAttr(disabled),\n      \"data-loading\": dataAttr(groupLoading),\n      \"data-selected\": dataAttr(selected),\n      role: \"presentation\",\n      ...props,\n    }),\n    [disabled, groupOpen, groupLoading, selected],\n  )\n\n  const getTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": contentId,\n      \"aria-disabled\": ariaAttr(disabled),\n      \"aria-expanded\": groupOpen,\n      \"data-disabled\": dataAttr(disabled),\n      \"data-expanded\": dataAttr(groupOpen),\n      \"data-selected\": dataAttr(selected),\n      tabIndex: open && expanded && !disabled ? 0 : -1,\n      ...props,\n      onClick: handlerAll(props.onClick, onGroupToggle),\n    }),\n    [contentId, disabled, groupOpen, selected, open, expanded, onGroupToggle],\n  )\n\n  const getLinkProps: PropGetter<\"a\"> = useCallback(\n    (props = {}) => ({\n      href: value,\n      rel: external ? \"noopener\" : undefined,\n      target: external ? \"_blank\" : undefined,\n      \"data-disabled\": dataAttr(disabled),\n      \"data-selected\": dataAttr(selected),\n      tabIndex: open && expanded && !disabled ? 0 : -1,\n      ...props,\n      onClick: handlerAll(props.onClick, (ev) => {\n        if (!disabled) return\n\n        ev.preventDefault()\n        ev.stopPropagation()\n      }),\n    }),\n    [disabled, expanded, external, open, selected, value],\n  )\n\n  const getContentProps: PropGetter<\"ul\"> = useCallback(\n    ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n      id: contentId,\n      \"aria-busy\": ariaAttr(groupLoading),\n      \"aria-labelledby\": cx(ariaLabelledby, labelId),\n      \"data-disabled\": dataAttr(disabled),\n      ...props,\n    }),\n    [contentId, labelId, disabled, groupLoading],\n  )\n\n  const getLabelProps: PropGetter<\"span\"> = useCallback(\n    (props = {}) => ({ id: labelId, ...props }),\n    [labelId],\n  )\n\n  return {\n    branchOpen,\n    children,\n    disabled,\n    expanded,\n    expandedValue,\n    group,\n    groupLoading,\n    groupOpen,\n    open,\n    selected,\n    selectedValue,\n    value,\n    getContentProps,\n    getIndicatorProps,\n    getItemProps,\n    getLabelProps,\n    getLinkProps,\n    getTriggerProps,\n    onExpandedChange,\n    onGroupClose,\n    onGroupOpen,\n    onGroupToggle,\n    onSelectedChange,\n  }\n}\n\nexport type UseSidebarItemReturn = ReturnType<typeof useSidebarItem>\n"],"mappings":";;;;;;;;;;;;;;;;AA4CA,MAAM,EACJ,oBAAoB,2BACpB,eAAe,sBACf,gBAAgB,0BACd,kBAAuD;AAqB3D,MAAM,CAAC,gBAAgB,qBAAqBA,gBAA8B,EACxE,MAAM,iBACR,CAAC;AASD,MAAM,CAAC,oBAAoB,yBACzBA,gBAAkC;CAChC,MAAM;CACN,QAAQ;AACV,CAAC;AAgDH,MAAa,cAAc,EACzB,YACA,uBAAuB,CAAC,GACxB,sBACA,YACA,eAAe,mBACf,SAAS,OACT,eAAe,mBACf,kBAAkB,sBAClB,kBAAkB,sBAClB,GAAG,SACgB,CAAC,MAAM;CAC1B,MAAM,EAAE,MAAM,QAAQ,SAAS;CAC/B,MAAM,oBAAoB,cAAc;EACtC,aAAa,YAAY,SAAS,eAAe;EACjD,MAAM,YAAY,SAAS;EAC3B,SAAS,YAAY,SAAS;EAC9B,QAAQ,YAAY,SAAS;CAC/B,CAAC;CACD,MAAM,mBAAmB,cAAc;EACrC,aAAa,YAAY,QAAQ,eAAe;EAChD,MAAM,YAAY,QAAQ;EAC1B,SAAS,YAAY,QAAQ;EAC7B,QAAQ,YAAY,QAAQ;CAC9B,CAAC;CACD,MAAM,CAAC,eAAe,oBAAoB,qBAAqB;EAC7D,cAAc;EACd,OAAO;EACP,UAAU;CACZ,CAAC;CACD,MAAM,CAAC,eAAe,oBAAoB,qBAAqB;EAC7D,cAAc;EACd,OAAO;EACP,UAAU;CACZ,CAAC;CACD,MAAM,cAAc,sBAAsB;CAC1C,MAAM,OAAO,SAAS,iBAAiB,OAAO,kBAAkB;CAChE,MAAM,SAAS,SAAS,iBAAiB,SAAS,kBAAkB;CACpE,MAAM,UAAU,SAAS,iBAAiB,UAAU,kBAAkB;CACtE,MAAM,WAAW,SACb,iBAAiB,WACjB,kBAAkB;CAEtB,MAAM,mBAAmB,aACtB,UAAkB;EACjB,iBAAiB,KAAK;CACxB,GACA,CAAC,gBAAgB,CACnB;CAEA,MAAM,cAAc,kBAAkB;EAKpC,iBAJe,YAAY,cACR,EAAE,QAAQ,EAAE,YAAY,KACzB,EAAE,KAAK,EAAE,YAAY,KAElB,CAAC;CACxB,GAAG,CAAC,aAAa,gBAAgB,CAAC;CAElC,MAAM,gBAAgB,kBAAkB;EACtC,iBAAiB,CAAC,CAAC;CACrB,GAAG,CAAC,gBAAgB,CAAC;CAErB,MAAM,mBAAmB,aACtB,UAAkB;EACjB,kBAAkB,SAAS;GACzB,IAAI,KAAK,SAAS,KAAK,GACrB,OAAO,KAAK,QAAQ,cAAc,cAAc,KAAK;QAErD,OAAO,CAAC,GAAG,MAAM,KAAK;EAE1B,CAAC;CACH,GACA,CAAC,gBAAgB,CACnB;CAEA,UAAU,YAAY;EAAE,UAAU;EAAe,QAAQ;CAAY,CAAC;CAEtE,eAAe,YAAY,OAAO;EAChC,IAAI,GAAG,QAAQ,KAAK;EACpB,IAAI,CAAC,GAAG,WAAW,CAAC,GAAG,SAAS;EAEhC,GAAG,eAAe;EAElB,kBAAkB,SAAS;CAC7B,CAAC;CAED,MAAM,eAAkC,aACrC,QAAQ,CAAC,MACR,WAAW,EAAE,kBAAA,GAAA,cAAA,UAA0B,IAAI,EAAE,GAAG,MAAM,KAAK,EAAE,GAC/D,CAAC,MAAM,IAAI,CACb;CAEA,MAAM,kBAAwC,aAC3C,QAAQ,CAAC,OAAO;EACf,iBAAiB;EACjB,cAAc,EAAE,OAAO,kBAAkB,cAAc;EACvD,GAAG;EACH,UAAA,GAAA,cAAA,YAAoB,MAAM,SAAS,QAAQ;CAC7C,IACA;EAAC;EAAM;EAAG;CAAQ,CACpB;CAEA,MAAM,oBAAyC,aAC5C,QAAQ,CAAC,OAAO;EAAE,kBAAA,GAAA,cAAA,UAA0B,IAAI;EAAG,GAAG;CAAM,IAC7D,CAAC,IAAI,CACP;CAEA,MAAM,iBAAuC,aAC1C,QAAQ,CAAC,OAAO,EAAE,GAAG,MAAM,IAC5B,CAAC,CACH;CAEA,MAAM,iBAAuC,aAC1C,QAAQ,CAAC,OAAO,EAAE,GAAG,MAAM,IAC5B,CAAC,CACH;CAOA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA,iBAXwC,aACvC,QAAQ,CAAC,OAAO,EAAE,GAAG,MAAM,IAC5B,CAAC,CASa;EACd;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;AACF;AAMA,MAAa,mBAAmB,EAAE,GAAG,SAA+B,CAAC,MAAM;CACzE,MAAM,EAAE,gBAAgB,eAAe;CACvC,MAAM,UAAU,OAAsB,IAAI;CAC1C,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,UAAU,MAAM;CAEtB,0BAA0B;EAGxB,IAAI,CAFO,YAAY,GAAG,eAAe,OAAO,GAEvC;EAET,IAAI,QAAQ,SACV,CAAA,GAAA,cAAA,cAAa,QAAQ,SAAS,mBAAmB,OAAO;EAC1D,IAAI,WAAW,SACb,CAAA,GAAA,cAAA,cAAa,WAAW,SAAS,mBAAmB,OAAO;CAC/D,GAAG,CAAC,CAAC;CAEL,MAAM,eAAiC,aACpC,EAAE,KAAK,GAAG,UAAU,CAAC,MACpB,WAAW,EAAE,IAAI,GAAG,MAAM,OAAO,EAAE,KAAK,QAAQ,CAAC,EAAE,GACrD,CAAC,MAAM,OAAO,CAChB;CAEA,MAAM,gBAAoC,aACvC,QAAQ,CAAC,OAAO;EAAE,IAAI;EAAS,GAAG;CAAM,IACzC,CAAC,OAAO,CACV;CAUA,OAAO;EAAE,iBARkC,aACxC,EAAE,KAAK,GAAG,UAAU,CAAC,OAAO;GAC3B,KAAK,UAAU,KAAK,UAAU;GAC9B,GAAG;EACL,IACA,CAAC,CAGoB;EAAG;EAAe;CAAa;AACxD;AA4BA,MAAa,kBAAkB,EAC7B,eACA,UAAU,cACV,aACA,WAAW,OACX,UACA,MAAM,UACN,OACA,SAAS,aACT,QAAQ,YACR,GAAG,WACsB;CACzB,MAAM,UAAU,sBAAsB;CACtC,MAAM,EACJ,eACA,MACA,eACA,kBACA,qBACE,kBAAkB;CACtB,MAAM,CAAC,UAAU,eAAe,SAAoB,YAAY;CAChE,MAAM,CAAC,QAAQ,SAAS,aAAa,OAAO;CAC5C,MAAM,kBAAkB,OAAO,KAAK;CACpC,MAAM,QAAQ,CAAC,CAAC;CAChB,MAAM,QAAQ,SAAS,SAAS,MAAM,QAAQ,IAAI;CAClD,MAAM,SAAS,CAAC,CAAC;CACjB,MAAM,WAAW,CAAC,CAAC,SAAS,kBAAkB;CAC9C,MAAM,kBAAkB,CAAC,CAAC,SAAS,cAAc,SAAS,KAAK;CAC/D,MAAM,EACJ,MAAM,WACN,SACA,WACE,cAAc;EAChB,aAAa,eAAe;EAC5B,MAAM;EACN,SAAS;EACT,QAAQ;CACV,CAAC;CACD,MAAM,aAAwB,SAC1B,CAAC,GAAG,QAAQ,YAAY,SAAS,IACjC,CAAC,SAAS;CACd,MAAM,WAAW,WAAW,MAAM,GAAG,EAAE,EAAE,MAAM,OAAO;CACtD,MAAM,EAAE,aAAa,qBAAqB;EACxC,IAAI;EACJ;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,cAAc,mBAAmB,iBAAiB,YAAY;EAGnE,YAAY,MAFW,gBAAgB,CAEnB;CACtB,GAAG,CAAC,aAAa,CAAC;CAElB,MAAM,cAAc,kBAAkB;EACpC,IAAI,YAAY,CAAC,SAAS,CAAC,SAAS,cAAc;EAElD,IAAI,SAAS,CAAC,gBAAgB,SAAS;GACrC,gBAAgB,UAAU;GAE1B,gBAAgB,EACb,WAAW;IACV,OAAO;IACP,iBAAiB,KAAK;GACxB,CAAC,EACA,YAAY;IACX,gBAAgB,UAAU;GAC5B,CAAC;EACL,OAAO;GACL,OAAO;GACP,iBAAiB,KAAK;EACxB;CACF,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,eAAe,kBAAkB;EACrC,IAAI,YAAY,CAAC,SAAS,CAAC,OAAO;EAElC,QAAQ;EACR,iBAAiB,KAAK;CACxB,GAAG;EAAC;EAAU;EAAO;EAAO;EAAS;CAAgB,CAAC;CAEtD,MAAM,gBAAgB,kBAAkB;EACtC,IAAI,WACF,aAAa;OAEb,YAAY;CAEhB,GAAG;EAAC;EAAW;EAAc;CAAW,CAAC;CAEzC,0BAA0B;EACxB,IAAI,iBACF,IAAI,SAAS,CAAC,gBAAgB,SAAS;GACrC,gBAAgB,UAAU;GAE1B,gBAAgB,EACb,WAAW;IACV,OAAO;GACT,CAAC,EACA,YAAY;IACX,gBAAgB,UAAU;GAC5B,CAAC;EACL,OACE,OAAO;OAGT,QAAQ;CAEZ,GAAG,CAAC,eAAe,CAAC;CAEpB,MAAM,eAAiC,aACpC,EAAE,KAAK,mBAAmB,gBAAgB,GAAG,UAAU,CAAC,MAAM;EAC7D,MAAM,SAAS,WACb;GACE,IAAI;GACJ,gBAAgB,WAAW,SAAS,KAAA;GACpC,kBAAA,GAAA,cAAA,UAA0B,QAAQ;GAClC,oBAAA,GAAA,cAAA,IAAsB,gBAAgB,OAAO;GAC7C,kBAAA,GAAA,cAAA,UAA0B,QAAQ;GAClC,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EACpC,GACA,MACA,OACA,EAAE,IAAI,GACN,EAAE,KAAK,SAAS,CAClB,EAAE;EAEF,OAAO;GACL,GAAG;GACH,UAAA,GAAA,cAAA,YACE,OAAO,SACP,CAAC,cAAc,iBAAiB,KAAK,IAAI,KAAA,CAC3C;EACF;CACF,GACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,MAAM,oBAAuC,aAC1C,WAAW;EACV,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,iBAAiB;EACjB,eAAe;EACf,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,iBAAA,GAAA,cAAA,UAAyB,YAAY;EACrC,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,MAAM;EACN,GAAG;CACL,IACA;EAAC;EAAU;EAAW;EAAc;CAAQ,CAC9C;CAEA,MAAM,kBAAwC,aAC3C,QAAQ,CAAC,OAAO;EACf,iBAAiB;EACjB,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,iBAAiB;EACjB,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,kBAAA,GAAA,cAAA,UAA0B,SAAS;EACnC,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,UAAU,QAAQ,YAAY,CAAC,WAAW,IAAI;EAC9C,GAAG;EACH,UAAA,GAAA,cAAA,YAAoB,MAAM,SAAS,aAAa;CAClD,IACA;EAAC;EAAW;EAAU;EAAW;EAAU;EAAM;EAAU;CAAa,CAC1E;CAEA,MAAM,eAAgC,aACnC,QAAQ,CAAC,OAAO;EACf,MAAM;EACN,KAAK,WAAW,aAAa,KAAA;EAC7B,QAAQ,WAAW,WAAW,KAAA;EAC9B,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,kBAAA,GAAA,cAAA,UAA0B,QAAQ;EAClC,UAAU,QAAQ,YAAY,CAAC,WAAW,IAAI;EAC9C,GAAG;EACH,UAAA,GAAA,cAAA,YAAoB,MAAM,UAAU,OAAO;GACzC,IAAI,CAAC,UAAU;GAEf,GAAG,eAAe;GAClB,GAAG,gBAAgB;EACrB,CAAC;CACH,IACA;EAAC;EAAU;EAAU;EAAU;EAAM;EAAU;CAAK,CACtD;CAkBA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,iBA7BwC,aACvC,EAAE,mBAAmB,gBAAgB,GAAG,UAAU,CAAC,OAAO;GACzD,IAAI;GACJ,cAAA,GAAA,cAAA,UAAsB,YAAY;GAClC,oBAAA,GAAA,cAAA,IAAsB,gBAAgB,OAAO;GAC7C,kBAAA,GAAA,cAAA,UAA0B,QAAQ;GAClC,GAAG;EACL,IACA;GAAC;GAAW;GAAS;GAAU;EAAY,CAqB7B;EACd;EACA;EACA,eArBwC,aACvC,QAAQ,CAAC,OAAO;GAAE,IAAI;GAAS,GAAG;EAAM,IACzC,CAAC,OAAO,CAmBI;EACZ;EACA;EACA;EACA;EACA;EACA;EACA;CACF;AACF"}

package/dist/esm/components/simple-grid/simple-grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"simple-grid.js","names":[],"sources":["../../../../src/components/simple-grid/simple-grid.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n  CSSProps,\n  StyleValue,\n  ThemeProps,\n  WithoutThemeProps,\n} from \"../../core\"\nimport type { GridProps } from \"../grid\"\nimport type { SimpleGridStyle } from \"./simple-grid.style\"\nimport { useMemo } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { replaceObject } from \"../../utils\"\nimport { Grid } from \"../grid\"\nimport { simpleGridStyle } from \"./simple-grid.style\"\n\nexport interface SimpleGridProps\n  extends\n    Omit<WithoutThemeProps<GridProps, SimpleGridStyle>, \"columns\">,\n    ThemeProps<SimpleGridStyle> {\n  /**\n   * The number of columns.\n   */\n  columns?: StyleValue<number>\n  /**\n   * The width at which child elements will break into columns.\n   * Pass a number for pixel values or a string for any other valid CSS length.\n   */\n  minChildWidth?: CSSProps[\"minWidth\"]\n}\n\nconst {\n  PropsContext: SimpleGridPropsContext,\n  usePropsContext: useSimpleGridPropsContext,\n  withContext,\n} = createComponent<SimpleGridProps, SimpleGridStyle>(\n  \"simple-grid\",\n  simpleGridStyle,\n)\n\nexport { SimpleGridPropsContext, useSimpleGridPropsContext }\n\n/**\n * `SimpleGrid` is a component that makes `Grid` simpler and more user-friendly.\n *\n * @see https://yamada-ui.com/docs/components/simple-grid\n */\nexport const SimpleGrid = withContext<\"div\", SimpleGridProps>(Grid)(\n  undefined,\n  ({ columns, minChildWidth, ...rest }) => {\n    const templateColumns = useMemo(() => {\n      if (minChildWidth) {\n        return replaceObject(minChildWidth, (value) => {\n          return value != null\n            ? `repeat(auto-fit, minmax({sizes.${value}, ${value}}, 1fr))`\n            : undefined\n        })\n      } else {\n        return replaceObject(columns, (value) =>\n          value != null ? `repeat(${value}, minmax(0, 1fr))` : undefined,\n        )\n      }\n    }, [minChildWidth, columns])\n\n    return { templateColumns, ...rest }\n  },\n)\n"],"mappings":";;;;;;;AA+BA,MAAM,EACJ,cAAc,wBACd,iBAAiB,2BACjB,gBACE,gBACF,eACA,gBACD;;;;;;AASD,MAAa,aAAa,YAAoC,KAAK,CACjE,KAAA,IACC,EAAE,SAAS,eAAe,GAAG,WAAW;CAevC,OAAO;EAAE,iBAde,cAAc;GACpC,IAAI,eACF,QAAA,GAAA,cAAA,eAAqB,gBAAgB,UAAU;IAC7C,OAAO,SAAS,OACZ,kCAAkC,MAAM,IAAI,MAAM,YAClD,KAAA;KACJ;QAEF,QAAA,GAAA,cAAA,eAAqB,UAAU,UAC7B,SAAS,OAAO,UAAU,MAAM,qBAAqB,KAAA,EACtD;KAEF,CAAC,eAAe,QAAQ,CAEH;EAAE,GAAG;EAAM;EAEtC"}
+{"version":3,"file":"simple-grid.js","names":[],"sources":["../../../../src/components/simple-grid/simple-grid.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n  CSSProps,\n  StyleValue,\n  ThemeProps,\n  WithoutThemeProps,\n} from \"../../core\"\nimport type { GridProps } from \"../grid\"\nimport type { SimpleGridStyle } from \"./simple-grid.style\"\nimport { useMemo } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { replaceObject } from \"../../utils\"\nimport { Grid } from \"../grid\"\nimport { simpleGridStyle } from \"./simple-grid.style\"\n\nexport interface SimpleGridProps\n  extends\n    Omit<WithoutThemeProps<GridProps, SimpleGridStyle>, \"columns\">,\n    ThemeProps<SimpleGridStyle> {\n  /**\n   * The number of columns.\n   */\n  columns?: StyleValue<number>\n  /**\n   * The width at which child elements will break into columns.\n   * Pass a number for pixel values or a string for any other valid CSS length.\n   */\n  minChildWidth?: CSSProps[\"minWidth\"]\n}\n\nconst {\n  PropsContext: SimpleGridPropsContext,\n  usePropsContext: useSimpleGridPropsContext,\n  withContext,\n} = createComponent<SimpleGridProps, SimpleGridStyle>(\n  \"simple-grid\",\n  simpleGridStyle,\n)\n\nexport { SimpleGridPropsContext, useSimpleGridPropsContext }\n\n/**\n * `SimpleGrid` is a component that makes `Grid` simpler and more user-friendly.\n *\n * @see https://yamada-ui.com/docs/components/simple-grid\n */\nexport const SimpleGrid = withContext<\"div\", SimpleGridProps>(Grid)(\n  undefined,\n  ({ columns, minChildWidth, ...rest }) => {\n    const templateColumns = useMemo(() => {\n      if (minChildWidth) {\n        return replaceObject(minChildWidth, (value) => {\n          return value != null\n            ? `repeat(auto-fit, minmax({sizes.${value}, ${value}}, 1fr))`\n            : undefined\n        })\n      } else {\n        return replaceObject(columns, (value) =>\n          value != null ? `repeat(${value}, minmax(0, 1fr))` : undefined,\n        )\n      }\n    }, [minChildWidth, columns])\n\n    return { templateColumns, ...rest }\n  },\n)\n"],"mappings":";;;;;;;AA+BA,MAAM,EACJ,cAAc,wBACd,iBAAiB,2BACjB,gBACE,gBACF,eACA,eACF;;;;;;AASA,MAAa,aAAa,YAAoC,IAAI,EAChE,KAAA,IACC,EAAE,SAAS,eAAe,GAAG,WAAW;CAevC,OAAO;EAAE,iBAde,cAAc;GACpC,IAAI,eACF,QAAA,GAAA,cAAA,eAAqB,gBAAgB,UAAU;IAC7C,OAAO,SAAS,OACZ,kCAAkC,MAAM,IAAI,MAAM,YAClD,KAAA;GACN,CAAC;QAED,QAAA,GAAA,cAAA,eAAqB,UAAU,UAC7B,SAAS,OAAO,UAAU,MAAM,qBAAqB,KAAA,CACvD;EAEJ,GAAG,CAAC,eAAe,OAAO,CAEH;EAAG,GAAG;CAAK;AACpC,CACF"}

package/dist/esm/components/simple-grid/simple-grid.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"simple-grid.style.js","names":[],"sources":["../../../../src/components/simple-grid/simple-grid.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const simpleGridStyle = defineComponentStyle({})\n\nexport type SimpleGridStyle = typeof simpleGridStyle\n"],"mappings":";;AAEA,MAAa,kBAAkB,qBAAqB,EAAE,CAAC"}
+{"version":3,"file":"simple-grid.style.js","names":[],"sources":["../../../../src/components/simple-grid/simple-grid.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const simpleGridStyle = defineComponentStyle({})\n\nexport type SimpleGridStyle = typeof simpleGridStyle\n"],"mappings":";;AAEA,MAAa,kBAAkB,qBAAqB,CAAC,CAAC"}

package/dist/esm/components/skeleton/skeleton-circle.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-circle.js","names":[],"sources":["../../../../src/components/skeleton/skeleton-circle.tsx"],"sourcesContent":["import type { Component } from \"../../core\"\nimport type { SkeletonProps } from \"./skeleton\"\nimport { mergeCSS } from \"../../core\"\nimport { Skeleton } from \"./skeleton\"\n\nexport interface SkeletonCircleProps extends SkeletonProps {}\n\nexport const SkeletonCircle = (({ css, ...rest }: SkeletonCircleProps) => {\n  return (\n    <Skeleton\n      css={mergeCSS(css, { \"--height\": \"sizes.10\", \"--width\": \"sizes.10\" })}\n      _loading={{ rounded: \"full\" }}\n      {...rest}\n    />\n  )\n}) as Component<\"div\", SkeletonCircleProps>\n"],"mappings":";;;;AAOA,MAAa,mBAAmB,EAAE,KAAK,GAAG,WAAgC;CACxE,OACE,oBAAC,UAAD;EACE,KAAK,SAAS,KAAK;GAAE,YAAY;GAAY,WAAW;GAAY,CAAC;EACrE,UAAU,EAAE,SAAS,QAAQ;EAC7B,GAAI;EACJ,CAAA"}
+{"version":3,"file":"skeleton-circle.js","names":[],"sources":["../../../../src/components/skeleton/skeleton-circle.tsx"],"sourcesContent":["import type { Component } from \"../../core\"\nimport type { SkeletonProps } from \"./skeleton\"\nimport { mergeCSS } from \"../../core\"\nimport { Skeleton } from \"./skeleton\"\n\nexport interface SkeletonCircleProps extends SkeletonProps {}\n\nexport const SkeletonCircle = (({ css, ...rest }: SkeletonCircleProps) => {\n  return (\n    <Skeleton\n      css={mergeCSS(css, { \"--height\": \"sizes.10\", \"--width\": \"sizes.10\" })}\n      _loading={{ rounded: \"full\" }}\n      {...rest}\n    />\n  )\n}) as Component<\"div\", SkeletonCircleProps>\n"],"mappings":";;;;AAOA,MAAa,mBAAmB,EAAE,KAAK,GAAG,WAAgC;CACxE,OACE,oBAAC,UAAD;EACE,KAAK,SAAS,KAAK;GAAE,YAAY;GAAY,WAAW;EAAW,CAAC;EACpE,UAAU,EAAE,SAAS,OAAO;EAC5B,GAAI;CACL,CAAA;AAEL"}

package/dist/esm/components/skeleton/skeleton-text.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-text.js","names":[],"sources":["../../../../src/components/skeleton/skeleton-text.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Component, HTMLStyledProps } from \"../../core\"\nimport type { SkeletonProps } from \"./skeleton\"\nimport { mergeCSS, styled } from \"../../core\"\nimport { Skeleton } from \"./skeleton\"\n\nexport interface SkeletonTextProps extends Omit<SkeletonProps, \"lineClamp\"> {\n  /**\n   * The number of lines to display.\n   */\n  lineClamp?: number\n  /**\n   * Props for the root element.\n   */\n  rootProps?: HTMLStyledProps\n}\n\nexport const SkeletonText = (({\n  css,\n  children,\n  gap = \"2\",\n  lineClamp = 3,\n  loading = true,\n  _loading,\n  _notFirst,\n  rootProps,\n  ...rest\n}: SkeletonTextProps) => {\n  return (\n    <styled.div w=\"full\" {...rootProps}>\n      {Array.from({ length: lineClamp }).map((_, index) => {\n        if (!loading && index > 0) return null\n\n        return (\n          <Skeleton\n            key={index}\n            css={mergeCSS(css, { \"--height\": \"sizes.4\" })}\n            loading={loading}\n            _loading={{\n              _last: { maxW: lineClamp > 1 ? \"80%\" : \"100%\" },\n              ..._loading,\n            }}\n            _notFirst={{ mt: gap, ..._notFirst }}\n            {...rest}\n          >\n            {!loading && index === 0 ? children : undefined}\n          </Skeleton>\n        )\n      })}\n    </styled.div>\n  )\n}) as Component<\"div\", SkeletonTextProps>\n"],"mappings":";;;;;;AAkBA,MAAa,iBAAiB,EAC5B,KACA,UACA,MAAM,KACN,YAAY,GACZ,UAAU,MACV,UACA,WACA,WACA,GAAG,WACoB;CACvB,OACE,oBAAC,OAAO,KAAR;EAAY,GAAE;EAAO,GAAI;YACtB,MAAM,KAAK,EAAE,QAAQ,WAAW,CAAC,CAAC,KAAK,GAAG,UAAU;GACnD,IAAI,CAAC,WAAW,QAAQ,GAAG,OAAO;GAElC,OACE,oBAAC,UAAD;IAEE,KAAK,SAAS,KAAK,EAAE,YAAY,WAAW,CAAC;IACpC;IACT,UAAU;KACR,OAAO,EAAE,MAAM,YAAY,IAAI,QAAQ,QAAQ;KAC/C,GAAG;KACJ;IACD,WAAW;KAAE,IAAI;KAAK,GAAG;KAAW;IACpC,GAAI;cAEH,CAAC,WAAW,UAAU,IAAI,WAAW,KAAA;IAC7B,EAXJ,MAWI;IAEb;EACS,CAAA"}
+{"version":3,"file":"skeleton-text.js","names":[],"sources":["../../../../src/components/skeleton/skeleton-text.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Component, HTMLStyledProps } from \"../../core\"\nimport type { SkeletonProps } from \"./skeleton\"\nimport { mergeCSS, styled } from \"../../core\"\nimport { Skeleton } from \"./skeleton\"\n\nexport interface SkeletonTextProps extends Omit<SkeletonProps, \"lineClamp\"> {\n  /**\n   * The number of lines to display.\n   */\n  lineClamp?: number\n  /**\n   * Props for the root element.\n   */\n  rootProps?: HTMLStyledProps\n}\n\nexport const SkeletonText = (({\n  css,\n  children,\n  gap = \"2\",\n  lineClamp = 3,\n  loading = true,\n  _loading,\n  _notFirst,\n  rootProps,\n  ...rest\n}: SkeletonTextProps) => {\n  return (\n    <styled.div w=\"full\" {...rootProps}>\n      {Array.from({ length: lineClamp }).map((_, index) => {\n        if (!loading && index > 0) return null\n\n        return (\n          <Skeleton\n            key={index}\n            css={mergeCSS(css, { \"--height\": \"sizes.4\" })}\n            loading={loading}\n            _loading={{\n              _last: { maxW: lineClamp > 1 ? \"80%\" : \"100%\" },\n              ..._loading,\n            }}\n            _notFirst={{ mt: gap, ..._notFirst }}\n            {...rest}\n          >\n            {!loading && index === 0 ? children : undefined}\n          </Skeleton>\n        )\n      })}\n    </styled.div>\n  )\n}) as Component<\"div\", SkeletonTextProps>\n"],"mappings":";;;;;;AAkBA,MAAa,iBAAiB,EAC5B,KACA,UACA,MAAM,KACN,YAAY,GACZ,UAAU,MACV,UACA,WACA,WACA,GAAG,WACoB;CACvB,OACE,oBAAC,OAAO,KAAR;EAAY,GAAE;EAAO,GAAI;YACtB,MAAM,KAAK,EAAE,QAAQ,UAAU,CAAC,EAAE,KAAK,GAAG,UAAU;GACnD,IAAI,CAAC,WAAW,QAAQ,GAAG,OAAO;GAElC,OACE,oBAAC,UAAD;IAEE,KAAK,SAAS,KAAK,EAAE,YAAY,UAAU,CAAC;IACnC;IACT,UAAU;KACR,OAAO,EAAE,MAAM,YAAY,IAAI,QAAQ,OAAO;KAC9C,GAAG;IACL;IACA,WAAW;KAAE,IAAI;KAAK,GAAG;IAAU;IACnC,GAAI;cAEH,CAAC,WAAW,UAAU,IAAI,WAAW,KAAA;GAC9B,GAXH,KAWG;EAEd,CAAC;CACS,CAAA;AAEhB"}

package/dist/esm/components/skeleton/skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.js","names":[],"sources":["../../../../src/components/skeleton/skeleton.tsx"],"sourcesContent":["\"use client\"\n\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { SkeletonStyle } from \"./skeleton.style\"\nimport { createComponent, varAttr } from \"../../core\"\nimport { dataAttr, isNumber, useValidChildren } from \"../../utils\"\nimport { skeletonStyle } from \"./skeleton.style\"\n\nexport interface SkeletonProps\n  extends HTMLStyledProps, ThemeProps<SkeletonStyle> {\n  /**\n   * The animation duration in seconds.\n   */\n  duration?: number | string\n  /**\n   * The color at the animation end.\n   */\n  endColor?: CSSProps[\"color\"]\n  /**\n   * The fade in duration in seconds. Requires `loaded` toggled to `true` in order to see the transition.\n   */\n  fadeDuration?: number | string\n  /**\n   * If `true`, the skeleton will take the width of it's children.\n   *\n   * @default false\n   */\n  fitContent?: boolean\n  /**\n   * The color at the animation start.\n   */\n  startColor?: CSSProps[\"color\"]\n}\n\nconst {\n  PropsContext: SkeletonPropsContext,\n  usePropsContext: useSkeletonPropsContext,\n  withContext,\n} = createComponent<SkeletonProps, SkeletonStyle>(\"skeleton\", skeletonStyle)\n\nexport { SkeletonPropsContext, useSkeletonPropsContext }\n\n/**\n * `Skeleton` is a component that acts as a placeholder until content is loaded.\n *\n * @see https://yamada-ui.com/docs/components/skeleton\n */\nexport const Skeleton = withContext(\"div\", { transferProps: [\"loading\"] })(\n  undefined,\n  ({\n    children,\n    duration,\n    endColor,\n    fadeDuration,\n    fitContent,\n    loading,\n    startColor,\n    ...rest\n  }) => {\n    const validChildren = useValidChildren(children)\n    const hasChildren = !!validChildren.length\n\n    fitContent ??= hasChildren\n\n    return {\n      \"aria-busy\": loading,\n      \"data-loaded\": dataAttr(!loading),\n      \"data-loading\": dataAttr(loading),\n      \"--duration\": isNumber(duration) ? `${duration}s` : duration,\n      \"--end-color\": varAttr(endColor, \"colors\"),\n      \"--fade-duration\": isNumber(fadeDuration)\n        ? `${fadeDuration}s`\n        : fadeDuration,\n      \"--height\": fitContent ? \"fit-content\" : undefined,\n      \"--start-color\": varAttr(startColor, \"colors\"),\n      \"--width\": fitContent ? \"fit-content\" : undefined,\n      children,\n      ...rest,\n    }\n  },\n)\n"],"mappings":";;;;;;;AAkCA,MAAM,EACJ,cAAc,sBACd,iBAAiB,yBACjB,gBACE,gBAA8C,YAAY,cAAc;;;;;;AAS5E,MAAa,WAAW,YAAY,OAAO,EAAE,eAAe,CAAC,UAAU,EAAE,CAAC,CACxE,KAAA,IACC,EACC,UACA,UACA,UACA,cACA,YACA,SACA,YACA,GAAG,WACC;CAEJ,MAAM,cAAc,CAAC,CADC,iBAAiB,SACJ,CAAC;CAEpC,eAAe;CAEf,OAAO;EACL,aAAa;EACb,gBAAA,GAAA,cAAA,UAAwB,CAAC,QAAQ;EACjC,iBAAA,GAAA,cAAA,UAAyB,QAAQ;EACjC,eAAA,GAAA,cAAA,UAAuB,SAAS,GAAG,GAAG,SAAS,KAAK;EACpD,eAAe,QAAQ,UAAU,SAAS;EAC1C,oBAAA,GAAA,cAAA,UAA4B,aAAa,GACrC,GAAG,aAAa,KAChB;EACJ,YAAY,aAAa,gBAAgB,KAAA;EACzC,iBAAiB,QAAQ,YAAY,SAAS;EAC9C,WAAW,aAAa,gBAAgB,KAAA;EACxC;EACA,GAAG;EACJ;EAEJ"}
+{"version":3,"file":"skeleton.js","names":[],"sources":["../../../../src/components/skeleton/skeleton.tsx"],"sourcesContent":["\"use client\"\n\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { SkeletonStyle } from \"./skeleton.style\"\nimport { createComponent, varAttr } from \"../../core\"\nimport { dataAttr, isNumber, useValidChildren } from \"../../utils\"\nimport { skeletonStyle } from \"./skeleton.style\"\n\nexport interface SkeletonProps\n  extends HTMLStyledProps, ThemeProps<SkeletonStyle> {\n  /**\n   * The animation duration in seconds.\n   */\n  duration?: number | string\n  /**\n   * The color at the animation end.\n   */\n  endColor?: CSSProps[\"color\"]\n  /**\n   * The fade in duration in seconds. Requires `loaded` toggled to `true` in order to see the transition.\n   */\n  fadeDuration?: number | string\n  /**\n   * If `true`, the skeleton will take the width of it's children.\n   *\n   * @default false\n   */\n  fitContent?: boolean\n  /**\n   * The color at the animation start.\n   */\n  startColor?: CSSProps[\"color\"]\n}\n\nconst {\n  PropsContext: SkeletonPropsContext,\n  usePropsContext: useSkeletonPropsContext,\n  withContext,\n} = createComponent<SkeletonProps, SkeletonStyle>(\"skeleton\", skeletonStyle)\n\nexport { SkeletonPropsContext, useSkeletonPropsContext }\n\n/**\n * `Skeleton` is a component that acts as a placeholder until content is loaded.\n *\n * @see https://yamada-ui.com/docs/components/skeleton\n */\nexport const Skeleton = withContext(\"div\", { transferProps: [\"loading\"] })(\n  undefined,\n  ({\n    children,\n    duration,\n    endColor,\n    fadeDuration,\n    fitContent,\n    loading,\n    startColor,\n    ...rest\n  }) => {\n    const validChildren = useValidChildren(children)\n    const hasChildren = !!validChildren.length\n\n    fitContent ??= hasChildren\n\n    return {\n      \"aria-busy\": loading,\n      \"data-loaded\": dataAttr(!loading),\n      \"data-loading\": dataAttr(loading),\n      \"--duration\": isNumber(duration) ? `${duration}s` : duration,\n      \"--end-color\": varAttr(endColor, \"colors\"),\n      \"--fade-duration\": isNumber(fadeDuration)\n        ? `${fadeDuration}s`\n        : fadeDuration,\n      \"--height\": fitContent ? \"fit-content\" : undefined,\n      \"--start-color\": varAttr(startColor, \"colors\"),\n      \"--width\": fitContent ? \"fit-content\" : undefined,\n      children,\n      ...rest,\n    }\n  },\n)\n"],"mappings":";;;;;;;AAkCA,MAAM,EACJ,cAAc,sBACd,iBAAiB,yBACjB,gBACE,gBAA8C,YAAY,aAAa;;;;;;AAS3E,MAAa,WAAW,YAAY,OAAO,EAAE,eAAe,CAAC,SAAS,EAAE,CAAC,EACvE,KAAA,IACC,EACC,UACA,UACA,UACA,cACA,YACA,SACA,YACA,GAAG,WACC;CAEJ,MAAM,cAAc,CAAC,CADC,iBAAiB,QACL,EAAE;CAEpC,eAAe;CAEf,OAAO;EACL,aAAa;EACb,gBAAA,GAAA,cAAA,UAAwB,CAAC,OAAO;EAChC,iBAAA,GAAA,cAAA,UAAyB,OAAO;EAChC,eAAA,GAAA,cAAA,UAAuB,QAAQ,IAAI,GAAG,SAAS,KAAK;EACpD,eAAe,QAAQ,UAAU,QAAQ;EACzC,oBAAA,GAAA,cAAA,UAA4B,YAAY,IACpC,GAAG,aAAa,KAChB;EACJ,YAAY,aAAa,gBAAgB,KAAA;EACzC,iBAAiB,QAAQ,YAAY,QAAQ;EAC7C,WAAW,aAAa,gBAAgB,KAAA;EACxC;EACA,GAAG;CACL;AACF,CACF"}

package/dist/esm/components/skeleton/skeleton.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.style.js","names":[],"sources":["../../../../src/components/skeleton/skeleton.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const skeletonStyle = defineComponentStyle({\n  base: {},\n\n  props: {\n    /**\n     * If `false`, it'll render its children with a nice fade transition.\n     *\n     * @default true\n     */\n    loading: {\n      false: {\n        animationDuration: \"{fade-duration, 0.1s}\",\n        animationIterationCount: \"1\",\n        animationName: \"fade-in\",\n        animationTimingFunction: \"ease-out\",\n        bg: \"unset\",\n      },\n      true: {\n        \"&::before, &::after, *\": {\n          visibility: \"hidden\",\n        },\n        \"--height\": \"sizes.6\",\n        \"--width\": \"sizes.full\",\n        bgClip: \"padding-box\",\n        boxShadow: \"none\",\n        color: \"transparent\",\n        cursor: \"default\",\n        flexShrink: \"0\",\n        h: \"{height}\",\n        maxW: \"full\",\n        pointerEvents: \"none\",\n        rounded: \"l1\",\n        userSelect: \"none\",\n        w: \"{width}\",\n      },\n    },\n  },\n\n  variants: {\n    none: {\n      animation: \"none\",\n    },\n    pulse: {\n      animationDuration: \"{duration, 1.2s}\",\n      animationIterationCount: \"infinite\",\n      animationName: \"pulse\",\n      bg: \"bg.muted\",\n    },\n    shine: {\n      \"--animation-from\": \"200%\",\n      \"--animation-to\": \"-200%\",\n      \"--end-color\": \"colors.bg.muted\",\n      \"--start-color\": \"colors.bg.subtle\",\n      animationDuration: \"{duration, 5s}\",\n      animationIterationCount: \"infinite\",\n      animationName: \"bg-position\",\n      animationTimingFunction: \"ease-in-out\",\n      bgImage:\n        \"linear-gradient(270deg, {start-color}, {end-color}, {end-color}, {start-color})\",\n      bgSize: \"400% 100%\",\n    },\n  },\n\n  defaultProps: {\n    variant: \"pulse\",\n    loading: true,\n  },\n})\n\nexport type SkeletonStyle = typeof skeletonStyle\n"],"mappings":";;AAEA,MAAa,gBAAgB,qBAAqB;CAChD,MAAM,EAAE;CAER,OAAO;;;;;;AAML,SAAS;EACP,OAAO;GACL,mBAAmB;GACnB,yBAAyB;GACzB,eAAe;GACf,yBAAyB;GACzB,IAAI;GACL;EACD,MAAM;GACJ,0BAA0B,EACxB,YAAY,UACb;GACD,YAAY;GACZ,WAAW;GACX,QAAQ;GACR,WAAW;GACX,OAAO;GACP,QAAQ;GACR,YAAY;GACZ,GAAG;GACH,MAAM;GACN,eAAe;GACf,SAAS;GACT,YAAY;GACZ,GAAG;GACJ;EACF,EACF;CAED,UAAU;EACR,MAAM,EACJ,WAAW,QACZ;EACD,OAAO;GACL,mBAAmB;GACnB,yBAAyB;GACzB,eAAe;GACf,IAAI;GACL;EACD,OAAO;GACL,oBAAoB;GACpB,kBAAkB;GAClB,eAAe;GACf,iBAAiB;GACjB,mBAAmB;GACnB,yBAAyB;GACzB,eAAe;GACf,yBAAyB;GACzB,SACE;GACF,QAAQ;GACT;EACF;CAED,cAAc;EACZ,SAAS;EACT,SAAS;EACV;CACF,CAAC"}
+{"version":3,"file":"skeleton.style.js","names":[],"sources":["../../../../src/components/skeleton/skeleton.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const skeletonStyle = defineComponentStyle({\n  base: {},\n\n  props: {\n    /**\n     * If `false`, it'll render its children with a nice fade transition.\n     *\n     * @default true\n     */\n    loading: {\n      false: {\n        animationDuration: \"{fade-duration, 0.1s}\",\n        animationIterationCount: \"1\",\n        animationName: \"fade-in\",\n        animationTimingFunction: \"ease-out\",\n        bg: \"unset\",\n      },\n      true: {\n        \"&::before, &::after, *\": {\n          visibility: \"hidden\",\n        },\n        \"--height\": \"sizes.6\",\n        \"--width\": \"sizes.full\",\n        bgClip: \"padding-box\",\n        boxShadow: \"none\",\n        color: \"transparent\",\n        cursor: \"default\",\n        flexShrink: \"0\",\n        h: \"{height}\",\n        maxW: \"full\",\n        pointerEvents: \"none\",\n        rounded: \"l1\",\n        userSelect: \"none\",\n        w: \"{width}\",\n      },\n    },\n  },\n\n  variants: {\n    none: {\n      animation: \"none\",\n    },\n    pulse: {\n      animationDuration: \"{duration, 1.2s}\",\n      animationIterationCount: \"infinite\",\n      animationName: \"pulse\",\n      bg: \"bg.muted\",\n    },\n    shine: {\n      \"--animation-from\": \"200%\",\n      \"--animation-to\": \"-200%\",\n      \"--end-color\": \"colors.bg.muted\",\n      \"--start-color\": \"colors.bg.subtle\",\n      animationDuration: \"{duration, 5s}\",\n      animationIterationCount: \"infinite\",\n      animationName: \"bg-position\",\n      animationTimingFunction: \"ease-in-out\",\n      bgImage:\n        \"linear-gradient(270deg, {start-color}, {end-color}, {end-color}, {start-color})\",\n      bgSize: \"400% 100%\",\n    },\n  },\n\n  defaultProps: {\n    variant: \"pulse\",\n    loading: true,\n  },\n})\n\nexport type SkeletonStyle = typeof skeletonStyle\n"],"mappings":";;AAEA,MAAa,gBAAgB,qBAAqB;CAChD,MAAM,CAAC;CAEP,OAAO;;;;;;AAML,SAAS;EACP,OAAO;GACL,mBAAmB;GACnB,yBAAyB;GACzB,eAAe;GACf,yBAAyB;GACzB,IAAI;EACN;EACA,MAAM;GACJ,0BAA0B,EACxB,YAAY,SACd;GACA,YAAY;GACZ,WAAW;GACX,QAAQ;GACR,WAAW;GACX,OAAO;GACP,QAAQ;GACR,YAAY;GACZ,GAAG;GACH,MAAM;GACN,eAAe;GACf,SAAS;GACT,YAAY;GACZ,GAAG;EACL;CACF,EACF;CAEA,UAAU;EACR,MAAM,EACJ,WAAW,OACb;EACA,OAAO;GACL,mBAAmB;GACnB,yBAAyB;GACzB,eAAe;GACf,IAAI;EACN;EACA,OAAO;GACL,oBAAoB;GACpB,kBAAkB;GAClB,eAAe;GACf,iBAAiB;GACjB,mBAAmB;GACnB,yBAAyB;GACzB,eAAe;GACf,yBAAyB;GACzB,SACE;GACF,QAAQ;EACV;CACF;CAEA,cAAc;EACZ,SAAS;EACT,SAAS;CACX;AACF,CAAC"}

package/dist/esm/components/slide/slide.js.map

@@ -1 +1 @@
-{"version":3,"file":"slide.js","names":["motion"],"sources":["../../../../src/components/slide/slide.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Variants } from \"motion/react\"\nimport type { ThemeProps } from \"../../core\"\nimport type {\n  HTMLMotionProps,\n  MotionTransitionVariants,\n  WithTransitionProps,\n} from \"../motion\"\nimport type { SlideStyle } from \"./slide.style\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { createTransition, motion } from \"../motion\"\nimport { slideStyle } from \"./slide.style\"\n\nconst getAnimationProps = (placement: SlideProps[\"placement\"]) => {\n  switch (placement) {\n    case \"block-start\":\n      return { enter: { x: 0, y: 0 }, exit: { x: 0, y: \"-100%\" } }\n    case \"inline-end\":\n      return { enter: { x: 0, y: 0 }, exit: { x: \"100%\", y: 0 } }\n    case \"block-end\":\n      return { enter: { x: 0, y: 0 }, exit: { x: 0, y: \"100%\" } }\n    case \"inline-start\":\n      return { enter: { x: 0, y: 0 }, exit: { x: \"-100%\", y: 0 } }\n    default:\n      return {}\n  }\n}\nexport const slideVariants: Variants = {\n  enter: ({\n    delay,\n    duration,\n    enter,\n    placement,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    ...getAnimationProps(placement).enter,\n    transition: createTransition.enter(transition?.enter)(delay, duration),\n    transitionEnd: transitionEnd?.enter,\n    ...enter,\n  }),\n  exit: ({\n    delay,\n    duration,\n    exit,\n    placement,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    ...getAnimationProps(placement).exit,\n    transition: createTransition.exit(transition?.exit)(delay, duration),\n    transitionEnd: transitionEnd?.exit,\n    ...exit,\n  }),\n} satisfies MotionTransitionVariants\n\nexport interface SlideProps\n  extends WithTransitionProps<HTMLMotionProps>, ThemeProps<SlideStyle> {}\n\nconst {\n  PropsContext: SlidePropsContext,\n  usePropsContext: useSlidePropsContext,\n  withContext,\n} = createComponent<SlideProps, SlideStyle>(\"slide\", slideStyle)\n\nexport { SlidePropsContext, useSlidePropsContext }\n\n/**\n * `Slide` is a component that shows or hides an element from the corners of the page.\n *\n * @see https://yamada-ui.com/docs/components/slide\n */\nexport const Slide = withContext<\"div\", SlideProps, \"placement\">(\n  ({\n    delay,\n    duration = { enter: 0.4, exit: 0.3 },\n    open: openProp,\n    placement: placementProp,\n    transition,\n    transitionEnd,\n    unmountOnExit,\n    ...rest\n  }) => {\n    const animate = openProp || unmountOnExit ? \"enter\" : \"exit\"\n    const open = unmountOnExit ? openProp && unmountOnExit : true\n    const placement = useValue(placementProp)\n\n    const custom = useMemo(\n      () => ({\n        delay,\n        duration,\n        placement,\n        transition,\n        transitionEnd,\n      }),\n      [delay, duration, placement, transition, transitionEnd],\n    )\n\n    return (\n      <AnimatePresence custom={custom}>\n        {open ? (\n          <motion.div\n            animate={animate}\n            custom={custom}\n            exit=\"exit\"\n            initial=\"exit\"\n            variants={slideVariants}\n            {...rest}\n          />\n        ) : null}\n      </AnimatePresence>\n    )\n  },\n  { transferProps: [\"placement\"] },\n)()\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,qBAAqB,cAAuC;CAChE,QAAQ,WAAR;EACE,KAAK,eACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;IAAG;GAAE,MAAM;IAAE,GAAG;IAAG,GAAG;IAAS;GAAE;EAC9D,KAAK,cACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;IAAG;GAAE,MAAM;IAAE,GAAG;IAAQ,GAAG;IAAG;GAAE;EAC7D,KAAK,aACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;IAAG;GAAE,MAAM;IAAE,GAAG;IAAG,GAAG;IAAQ;GAAE;EAC7D,KAAK,gBACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;IAAG;GAAE,MAAM;IAAE,GAAG;IAAS,GAAG;IAAG;GAAE;EAC9D,SACE,OAAO,EAAE;;;AAGf,MAAa,gBAA0B;CACrC,QAAQ,EACN,OACA,UACA,OACA,WACA,YACA,kBACE,EAAE,MAAM;EACV,GAAG,kBAAkB,UAAU,CAAC;EAChC,YAAY,iBAAiB,MAAM,YAAY,MAAM,CAAC,OAAO,SAAS;EACtE,eAAe,eAAe;EAC9B,GAAG;EACJ;CACD,OAAO,EACL,OACA,UACA,MACA,WACA,YACA,kBACE,EAAE,MAAM;EACV,GAAG,kBAAkB,UAAU,CAAC;EAChC,YAAY,iBAAiB,KAAK,YAAY,KAAK,CAAC,OAAO,SAAS;EACpE,eAAe,eAAe;EAC9B,GAAG;EACJ;CACF;AAKD,MAAM,EACJ,cAAc,mBACd,iBAAiB,sBACjB,gBACE,gBAAwC,SAAS,WAAW;;;;;;AAShE,MAAa,QAAQ,aAClB,EACC,OACA,WAAW;CAAE,OAAO;CAAK,MAAM;CAAK,EACpC,MAAM,UACN,WAAW,eACX,YACA,eACA,eACA,GAAG,WACC;CACJ,MAAM,UAAU,YAAY,gBAAgB,UAAU;CACtD,MAAM,OAAO,gBAAgB,YAAY,gBAAgB;CACzD,MAAM,YAAY,SAAS,cAAc;CAEzC,MAAM,SAAS,eACN;EACL;EACA;EACA;EACA;EACA;EACD,GACD;EAAC;EAAO;EAAU;EAAW;EAAY;EAAc,CACxD;CAED,OACE,oBAAC,iBAAD;EAAyB;YACtB,OACC,oBAACA,SAAO,KAAR;GACW;GACD;GACR,MAAK;GACL,SAAQ;GACR,UAAU;GACV,GAAI;GACJ,CAAA,GACA;EACY,CAAA;GAGtB,EAAE,eAAe,CAAC,YAAY,EAAE,CACjC,EAAE"}
+{"version":3,"file":"slide.js","names":["motion"],"sources":["../../../../src/components/slide/slide.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Variants } from \"motion/react\"\nimport type { ThemeProps } from \"../../core\"\nimport type {\n  HTMLMotionProps,\n  MotionTransitionVariants,\n  WithTransitionProps,\n} from \"../motion\"\nimport type { SlideStyle } from \"./slide.style\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { createTransition, motion } from \"../motion\"\nimport { slideStyle } from \"./slide.style\"\n\nconst getAnimationProps = (placement: SlideProps[\"placement\"]) => {\n  switch (placement) {\n    case \"block-start\":\n      return { enter: { x: 0, y: 0 }, exit: { x: 0, y: \"-100%\" } }\n    case \"inline-end\":\n      return { enter: { x: 0, y: 0 }, exit: { x: \"100%\", y: 0 } }\n    case \"block-end\":\n      return { enter: { x: 0, y: 0 }, exit: { x: 0, y: \"100%\" } }\n    case \"inline-start\":\n      return { enter: { x: 0, y: 0 }, exit: { x: \"-100%\", y: 0 } }\n    default:\n      return {}\n  }\n}\nexport const slideVariants: Variants = {\n  enter: ({\n    delay,\n    duration,\n    enter,\n    placement,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    ...getAnimationProps(placement).enter,\n    transition: createTransition.enter(transition?.enter)(delay, duration),\n    transitionEnd: transitionEnd?.enter,\n    ...enter,\n  }),\n  exit: ({\n    delay,\n    duration,\n    exit,\n    placement,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    ...getAnimationProps(placement).exit,\n    transition: createTransition.exit(transition?.exit)(delay, duration),\n    transitionEnd: transitionEnd?.exit,\n    ...exit,\n  }),\n} satisfies MotionTransitionVariants\n\nexport interface SlideProps\n  extends WithTransitionProps<HTMLMotionProps>, ThemeProps<SlideStyle> {}\n\nconst {\n  PropsContext: SlidePropsContext,\n  usePropsContext: useSlidePropsContext,\n  withContext,\n} = createComponent<SlideProps, SlideStyle>(\"slide\", slideStyle)\n\nexport { SlidePropsContext, useSlidePropsContext }\n\n/**\n * `Slide` is a component that shows or hides an element from the corners of the page.\n *\n * @see https://yamada-ui.com/docs/components/slide\n */\nexport const Slide = withContext<\"div\", SlideProps, \"placement\">(\n  ({\n    delay,\n    duration = { enter: 0.4, exit: 0.3 },\n    open: openProp,\n    placement: placementProp,\n    transition,\n    transitionEnd,\n    unmountOnExit,\n    ...rest\n  }) => {\n    const animate = openProp || unmountOnExit ? \"enter\" : \"exit\"\n    const open = unmountOnExit ? openProp && unmountOnExit : true\n    const placement = useValue(placementProp)\n\n    const custom = useMemo(\n      () => ({\n        delay,\n        duration,\n        placement,\n        transition,\n        transitionEnd,\n      }),\n      [delay, duration, placement, transition, transitionEnd],\n    )\n\n    return (\n      <AnimatePresence custom={custom}>\n        {open ? (\n          <motion.div\n            animate={animate}\n            custom={custom}\n            exit=\"exit\"\n            initial=\"exit\"\n            variants={slideVariants}\n            {...rest}\n          />\n        ) : null}\n      </AnimatePresence>\n    )\n  },\n  { transferProps: [\"placement\"] },\n)()\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,qBAAqB,cAAuC;CAChE,QAAQ,WAAR;EACE,KAAK,eACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;GAAE;GAAG,MAAM;IAAE,GAAG;IAAG,GAAG;GAAQ;EAAE;EAC7D,KAAK,cACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;GAAE;GAAG,MAAM;IAAE,GAAG;IAAQ,GAAG;GAAE;EAAE;EAC5D,KAAK,aACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;GAAE;GAAG,MAAM;IAAE,GAAG;IAAG,GAAG;GAAO;EAAE;EAC5D,KAAK,gBACH,OAAO;GAAE,OAAO;IAAE,GAAG;IAAG,GAAG;GAAE;GAAG,MAAM;IAAE,GAAG;IAAS,GAAG;GAAE;EAAE;EAC7D,SACE,OAAO,CAAC;CACZ;AACF;AACA,MAAa,gBAA0B;CACrC,QAAQ,EACN,OACA,UACA,OACA,WACA,YACA,kBACE,CAAC,OAAO;EACV,GAAG,kBAAkB,SAAS,EAAE;EAChC,YAAY,iBAAiB,MAAM,YAAY,KAAK,EAAE,OAAO,QAAQ;EACrE,eAAe,eAAe;EAC9B,GAAG;CACL;CACA,OAAO,EACL,OACA,UACA,MACA,WACA,YACA,kBACE,CAAC,OAAO;EACV,GAAG,kBAAkB,SAAS,EAAE;EAChC,YAAY,iBAAiB,KAAK,YAAY,IAAI,EAAE,OAAO,QAAQ;EACnE,eAAe,eAAe;EAC9B,GAAG;CACL;AACF;AAKA,MAAM,EACJ,cAAc,mBACd,iBAAiB,sBACjB,gBACE,gBAAwC,SAAS,UAAU;;;;;;AAS/D,MAAa,QAAQ,aAClB,EACC,OACA,WAAW;CAAE,OAAO;CAAK,MAAM;AAAI,GACnC,MAAM,UACN,WAAW,eACX,YACA,eACA,eACA,GAAG,WACC;CACJ,MAAM,UAAU,YAAY,gBAAgB,UAAU;CACtD,MAAM,OAAO,gBAAgB,YAAY,gBAAgB;CACzD,MAAM,YAAY,SAAS,aAAa;CAExC,MAAM,SAAS,eACN;EACL;EACA;EACA;EACA;EACA;CACF,IACA;EAAC;EAAO;EAAU;EAAW;EAAY;CAAa,CACxD;CAEA,OACE,oBAAC,iBAAD;EAAyB;YACtB,OACC,oBAACA,SAAO,KAAR;GACW;GACD;GACR,MAAK;GACL,SAAQ;GACR,UAAU;GACV,GAAI;EACL,CAAA,IACC;CACW,CAAA;AAErB,GACA,EAAE,eAAe,CAAC,WAAW,EAAE,CACjC,EAAE"}

package/dist/esm/components/slide/slide.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"slide.style.js","names":[],"sources":["../../../../src/components/slide/slide.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const slideStyle = defineComponentStyle({\n  base: {\n    position: \"fixed\",\n    zIndex: \"guldo\",\n  },\n\n  props: {\n    /**\n     * The placement of the slide.\n     *\n     * @default 'inline-end'\n     */\n    placement: {\n      \"block-end\": { bottom: \"0\", left: \"0\", right: \"0\", w: \"vw\" },\n      \"block-start\": { left: \"0\", right: \"0\", top: \"0\", w: \"vw\" },\n      \"inline-end\": { bottom: \"0\", h: \"dvh\", right: \"0\", top: \"0\" },\n      \"inline-start\": { bottom: \"0\", h: \"dvh\", left: \"0\", top: \"0\" },\n    },\n  },\n\n  defaultProps: {\n    placement: \"inline-end\",\n  },\n})\n\nexport type SlideStyle = typeof slideStyle\n"],"mappings":";;AAEA,MAAa,aAAa,qBAAqB;CAC7C,MAAM;EACJ,UAAU;EACV,QAAQ;EACT;CAED,OAAO;;;;;;AAML,WAAW;EACT,aAAa;GAAE,QAAQ;GAAK,MAAM;GAAK,OAAO;GAAK,GAAG;GAAM;EAC5D,eAAe;GAAE,MAAM;GAAK,OAAO;GAAK,KAAK;GAAK,GAAG;GAAM;EAC3D,cAAc;GAAE,QAAQ;GAAK,GAAG;GAAO,OAAO;GAAK,KAAK;GAAK;EAC7D,gBAAgB;GAAE,QAAQ;GAAK,GAAG;GAAO,MAAM;GAAK,KAAK;GAAK;EAC/D,EACF;CAED,cAAc,EACZ,WAAW,cACZ;CACF,CAAC"}
+{"version":3,"file":"slide.style.js","names":[],"sources":["../../../../src/components/slide/slide.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const slideStyle = defineComponentStyle({\n  base: {\n    position: \"fixed\",\n    zIndex: \"guldo\",\n  },\n\n  props: {\n    /**\n     * The placement of the slide.\n     *\n     * @default 'inline-end'\n     */\n    placement: {\n      \"block-end\": { bottom: \"0\", left: \"0\", right: \"0\", w: \"vw\" },\n      \"block-start\": { left: \"0\", right: \"0\", top: \"0\", w: \"vw\" },\n      \"inline-end\": { bottom: \"0\", h: \"dvh\", right: \"0\", top: \"0\" },\n      \"inline-start\": { bottom: \"0\", h: \"dvh\", left: \"0\", top: \"0\" },\n    },\n  },\n\n  defaultProps: {\n    placement: \"inline-end\",\n  },\n})\n\nexport type SlideStyle = typeof slideStyle\n"],"mappings":";;AAEA,MAAa,aAAa,qBAAqB;CAC7C,MAAM;EACJ,UAAU;EACV,QAAQ;CACV;CAEA,OAAO;;;;;;AAML,WAAW;EACT,aAAa;GAAE,QAAQ;GAAK,MAAM;GAAK,OAAO;GAAK,GAAG;EAAK;EAC3D,eAAe;GAAE,MAAM;GAAK,OAAO;GAAK,KAAK;GAAK,GAAG;EAAK;EAC1D,cAAc;GAAE,QAAQ;GAAK,GAAG;GAAO,OAAO;GAAK,KAAK;EAAI;EAC5D,gBAAgB;GAAE,QAAQ;GAAK,GAAG;GAAO,MAAM;GAAK,KAAK;EAAI;CAC/D,EACF;CAEA,cAAc,EACZ,WAAW,aACb;AACF,CAAC"}

package/dist/esm/components/slide-fade/slide-fade.js.map

@@ -1 +1 @@
-{"version":3,"file":"slide-fade.js","names":["motion"],"sources":["../../../../src/components/slide-fade/slide-fade.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Variants } from \"motion/react\"\nimport type { ThemeProps } from \"../../core\"\nimport type {\n  HTMLMotionProps,\n  MotionTransitionVariants,\n  WithTransitionProps,\n} from \"../motion\"\nimport type { SlideFadeStyle } from \"./slide-fade.style\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { createTransition, motion } from \"../motion\"\nimport { slideFadeStyle } from \"./slide-fade.style\"\n\nexport const slideFadeVariants: Variants = {\n  enter: ({ delay, duration, enter, transition, transitionEnd } = {}) => ({\n    opacity: 1,\n    transition: createTransition.enter(transition?.enter)(delay, duration),\n    transitionEnd: transitionEnd?.enter,\n    x: 0,\n    y: 0,\n    ...enter,\n  }),\n  exit: ({\n    delay,\n    duration,\n    exit,\n    offsetX,\n    offsetY,\n    reverse,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    opacity: 0,\n    transition: createTransition.exit(transition?.exit)(delay, duration),\n    ...(reverse\n      ? { transitionEnd: transitionEnd?.exit, x: offsetX, y: offsetY }\n      : { transitionEnd: { x: offsetX, y: offsetY, ...transitionEnd?.exit } }),\n    ...exit,\n  }),\n  initial: ({\n    delay,\n    duration,\n    initial,\n    offsetX,\n    offsetY,\n    transition,\n    transitionEnd,\n  }) => ({\n    opacity: 0,\n    transition: createTransition.exit(transition?.exit)(delay, duration),\n    transitionEnd: transitionEnd?.exit,\n    x: offsetX,\n    y: offsetY,\n    ...initial,\n  }),\n} satisfies MotionTransitionVariants\n\nexport interface SlideFadeProps\n  extends WithTransitionProps<HTMLMotionProps>, ThemeProps<SlideFadeStyle> {\n  /**\n   * The offset on the horizontal or `x` axis.\n   *\n   * @default 0\n   */\n  offsetX?: number | string\n  /**\n   * The offset on the vertical or `y` axis.\n   *\n   * @default 8\n   */\n  offsetY?: number | string\n  /**\n   * If `true`, the element will be transitioned back to the offset when it leaves. Otherwise, it'll only fade out.\n   *\n   * @default true\n   */\n  reverse?: boolean\n}\n\nconst {\n  PropsContext: SlideFadePropsContext,\n  usePropsContext: useSlideFadePropsContext,\n  withContext,\n} = createComponent<SlideFadeProps, SlideFadeStyle>(\n  \"slide-fade\",\n  slideFadeStyle,\n)\n\nexport { SlideFadePropsContext, useSlideFadePropsContext }\n\n/**\n * `SlideFade` is a component that gradually shows or hides an element while moving it from a specified position.\n *\n * @see https://yamada-ui.com/docs/components/slide-fade\n */\nexport const SlideFade = withContext<\"div\", SlideFadeProps>(\n  ({\n    delay,\n    duration,\n    offsetX = 0,\n    offsetY = 8,\n    open: openProp,\n    reverse = true,\n    transition,\n    transitionEnd,\n    unmountOnExit,\n    ...rest\n  }) => {\n    const animate = openProp || unmountOnExit ? \"enter\" : \"exit\"\n    const open = unmountOnExit ? openProp && unmountOnExit : true\n\n    const custom = useMemo(\n      () => ({\n        delay,\n        duration,\n        offsetX,\n        offsetY,\n        reverse,\n        transition,\n        transitionEnd,\n      }),\n      [delay, duration, offsetX, offsetY, reverse, transition, transitionEnd],\n    )\n\n    return (\n      <AnimatePresence custom={custom}>\n        {open ? (\n          <motion.div\n            animate={animate}\n            custom={custom}\n            exit=\"exit\"\n            initial=\"exit\"\n            variants={slideFadeVariants}\n            {...rest}\n          />\n        ) : null}\n      </AnimatePresence>\n    )\n  },\n)()\n"],"mappings":";;;;;;;;;AAgBA,MAAa,oBAA8B;CACzC,QAAQ,EAAE,OAAO,UAAU,OAAO,YAAY,kBAAkB,EAAE,MAAM;EACtE,SAAS;EACT,YAAY,iBAAiB,MAAM,YAAY,MAAM,CAAC,OAAO,SAAS;EACtE,eAAe,eAAe;EAC9B,GAAG;EACH,GAAG;EACH,GAAG;EACJ;CACD,OAAO,EACL,OACA,UACA,MACA,SACA,SACA,SACA,YACA,kBACE,EAAE,MAAM;EACV,SAAS;EACT,YAAY,iBAAiB,KAAK,YAAY,KAAK,CAAC,OAAO,SAAS;EACpE,GAAI,UACA;GAAE,eAAe,eAAe;GAAM,GAAG;GAAS,GAAG;GAAS,GAC9D,EAAE,eAAe;GAAE,GAAG;GAAS,GAAG;GAAS,GAAG,eAAe;GAAM,EAAE;EACzE,GAAG;EACJ;CACD,UAAU,EACR,OACA,UACA,SACA,SACA,SACA,YACA,qBACK;EACL,SAAS;EACT,YAAY,iBAAiB,KAAK,YAAY,KAAK,CAAC,OAAO,SAAS;EACpE,eAAe,eAAe;EAC9B,GAAG;EACH,GAAG;EACH,GAAG;EACJ;CACF;AAwBD,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,gBACE,gBACF,cACA,eACD;;;;;;AASD,MAAa,YAAY,aACtB,EACC,OACA,UACA,UAAU,GACV,UAAU,GACV,MAAM,UACN,UAAU,MACV,YACA,eACA,eACA,GAAG,WACC;CACJ,MAAM,UAAU,YAAY,gBAAgB,UAAU;CACtD,MAAM,OAAO,gBAAgB,YAAY,gBAAgB;CAEzD,MAAM,SAAS,eACN;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACD,GACD;EAAC;EAAO;EAAU;EAAS;EAAS;EAAS;EAAY;EAAc,CACxE;CAED,OACE,oBAAC,iBAAD;EAAyB;YACtB,OACC,oBAACA,SAAO,KAAR;GACW;GACD;GACR,MAAK;GACL,SAAQ;GACR,UAAU;GACV,GAAI;GACJ,CAAA,GACA;EACY,CAAA;EAGvB,EAAE"}
+{"version":3,"file":"slide-fade.js","names":["motion"],"sources":["../../../../src/components/slide-fade/slide-fade.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Variants } from \"motion/react\"\nimport type { ThemeProps } from \"../../core\"\nimport type {\n  HTMLMotionProps,\n  MotionTransitionVariants,\n  WithTransitionProps,\n} from \"../motion\"\nimport type { SlideFadeStyle } from \"./slide-fade.style\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createComponent } from \"../../core\"\nimport { createTransition, motion } from \"../motion\"\nimport { slideFadeStyle } from \"./slide-fade.style\"\n\nexport const slideFadeVariants: Variants = {\n  enter: ({ delay, duration, enter, transition, transitionEnd } = {}) => ({\n    opacity: 1,\n    transition: createTransition.enter(transition?.enter)(delay, duration),\n    transitionEnd: transitionEnd?.enter,\n    x: 0,\n    y: 0,\n    ...enter,\n  }),\n  exit: ({\n    delay,\n    duration,\n    exit,\n    offsetX,\n    offsetY,\n    reverse,\n    transition,\n    transitionEnd,\n  } = {}) => ({\n    opacity: 0,\n    transition: createTransition.exit(transition?.exit)(delay, duration),\n    ...(reverse\n      ? { transitionEnd: transitionEnd?.exit, x: offsetX, y: offsetY }\n      : { transitionEnd: { x: offsetX, y: offsetY, ...transitionEnd?.exit } }),\n    ...exit,\n  }),\n  initial: ({\n    delay,\n    duration,\n    initial,\n    offsetX,\n    offsetY,\n    transition,\n    transitionEnd,\n  }) => ({\n    opacity: 0,\n    transition: createTransition.exit(transition?.exit)(delay, duration),\n    transitionEnd: transitionEnd?.exit,\n    x: offsetX,\n    y: offsetY,\n    ...initial,\n  }),\n} satisfies MotionTransitionVariants\n\nexport interface SlideFadeProps\n  extends WithTransitionProps<HTMLMotionProps>, ThemeProps<SlideFadeStyle> {\n  /**\n   * The offset on the horizontal or `x` axis.\n   *\n   * @default 0\n   */\n  offsetX?: number | string\n  /**\n   * The offset on the vertical or `y` axis.\n   *\n   * @default 8\n   */\n  offsetY?: number | string\n  /**\n   * If `true`, the element will be transitioned back to the offset when it leaves. Otherwise, it'll only fade out.\n   *\n   * @default true\n   */\n  reverse?: boolean\n}\n\nconst {\n  PropsContext: SlideFadePropsContext,\n  usePropsContext: useSlideFadePropsContext,\n  withContext,\n} = createComponent<SlideFadeProps, SlideFadeStyle>(\n  \"slide-fade\",\n  slideFadeStyle,\n)\n\nexport { SlideFadePropsContext, useSlideFadePropsContext }\n\n/**\n * `SlideFade` is a component that gradually shows or hides an element while moving it from a specified position.\n *\n * @see https://yamada-ui.com/docs/components/slide-fade\n */\nexport const SlideFade = withContext<\"div\", SlideFadeProps>(\n  ({\n    delay,\n    duration,\n    offsetX = 0,\n    offsetY = 8,\n    open: openProp,\n    reverse = true,\n    transition,\n    transitionEnd,\n    unmountOnExit,\n    ...rest\n  }) => {\n    const animate = openProp || unmountOnExit ? \"enter\" : \"exit\"\n    const open = unmountOnExit ? openProp && unmountOnExit : true\n\n    const custom = useMemo(\n      () => ({\n        delay,\n        duration,\n        offsetX,\n        offsetY,\n        reverse,\n        transition,\n        transitionEnd,\n      }),\n      [delay, duration, offsetX, offsetY, reverse, transition, transitionEnd],\n    )\n\n    return (\n      <AnimatePresence custom={custom}>\n        {open ? (\n          <motion.div\n            animate={animate}\n            custom={custom}\n            exit=\"exit\"\n            initial=\"exit\"\n            variants={slideFadeVariants}\n            {...rest}\n          />\n        ) : null}\n      </AnimatePresence>\n    )\n  },\n)()\n"],"mappings":";;;;;;;;;AAgBA,MAAa,oBAA8B;CACzC,QAAQ,EAAE,OAAO,UAAU,OAAO,YAAY,kBAAkB,CAAC,OAAO;EACtE,SAAS;EACT,YAAY,iBAAiB,MAAM,YAAY,KAAK,EAAE,OAAO,QAAQ;EACrE,eAAe,eAAe;EAC9B,GAAG;EACH,GAAG;EACH,GAAG;CACL;CACA,OAAO,EACL,OACA,UACA,MACA,SACA,SACA,SACA,YACA,kBACE,CAAC,OAAO;EACV,SAAS;EACT,YAAY,iBAAiB,KAAK,YAAY,IAAI,EAAE,OAAO,QAAQ;EACnE,GAAI,UACA;GAAE,eAAe,eAAe;GAAM,GAAG;GAAS,GAAG;EAAQ,IAC7D,EAAE,eAAe;GAAE,GAAG;GAAS,GAAG;GAAS,GAAG,eAAe;EAAK,EAAE;EACxE,GAAG;CACL;CACA,UAAU,EACR,OACA,UACA,SACA,SACA,SACA,YACA,qBACK;EACL,SAAS;EACT,YAAY,iBAAiB,KAAK,YAAY,IAAI,EAAE,OAAO,QAAQ;EACnE,eAAe,eAAe;EAC9B,GAAG;EACH,GAAG;EACH,GAAG;CACL;AACF;AAwBA,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,gBACE,gBACF,cACA,cACF;;;;;;AASA,MAAa,YAAY,aACtB,EACC,OACA,UACA,UAAU,GACV,UAAU,GACV,MAAM,UACN,UAAU,MACV,YACA,eACA,eACA,GAAG,WACC;CACJ,MAAM,UAAU,YAAY,gBAAgB,UAAU;CACtD,MAAM,OAAO,gBAAgB,YAAY,gBAAgB;CAEzD,MAAM,SAAS,eACN;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EAAC;EAAO;EAAU;EAAS;EAAS;EAAS;EAAY;CAAa,CACxE;CAEA,OACE,oBAAC,iBAAD;EAAyB;YACtB,OACC,oBAACA,SAAO,KAAR;GACW;GACD;GACR,MAAK;GACL,SAAQ;GACR,UAAU;GACV,GAAI;EACL,CAAA,IACC;CACW,CAAA;AAErB,CACF,EAAE"}

package/dist/esm/components/slide-fade/slide-fade.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"slide-fade.style.js","names":[],"sources":["../../../../src/components/slide-fade/slide-fade.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const slideFadeStyle = defineComponentStyle({\n  base: {\n    w: \"full\",\n  },\n})\n\nexport type SlideFadeStyle = typeof slideFadeStyle\n"],"mappings":";;AAEA,MAAa,iBAAiB,qBAAqB,EACjD,MAAM,EACJ,GAAG,QACJ,EACF,CAAC"}
+{"version":3,"file":"slide-fade.style.js","names":[],"sources":["../../../../src/components/slide-fade/slide-fade.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const slideFadeStyle = defineComponentStyle({\n  base: {\n    w: \"full\",\n  },\n})\n\nexport type SlideFadeStyle = typeof slideFadeStyle\n"],"mappings":";;AAEA,MAAa,iBAAiB,qBAAqB,EACjD,MAAM,EACJ,GAAG,OACL,EACF,CAAC"}

package/dist/esm/components/slider/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":[],"sources":["../../../../src/components/slider/slider.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, ReactElement, ReactNode } from \"react\"\nimport type {\n  CSSProps,\n  GenericsComponent,\n  HTMLStyledProps,\n  ThemeProps,\n} from \"../../core\"\nimport type { SliderStyle } from \"./slider.style\"\nimport type { UseSliderProps, UseSliderReturn } from \"./use-slider\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled, varAttr } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { dataAttr, isNumber } from \"../../utils\"\nimport { sliderStyle } from \"./slider.style\"\nimport { useSlider } from \"./use-slider\"\n\ninterface ComponentContext extends Pick<\n  UseSliderReturn,\n  | \"getInputProps\"\n  | \"getMarkProps\"\n  | \"getRangeProps\"\n  | \"getThumbProps\"\n  | \"getTrackProps\"\n  | \"range\"\n> {}\n\nexport interface SliderRootProps<Y extends [number, number] | number = number>\n  extends\n    Omit<HTMLStyledProps, \"defaultValue\" | \"onChange\" | \"ref\">,\n    Omit<UseSliderProps<Y>, \"orientation\">,\n    ThemeProps<SliderStyle> {\n  /**\n   * The fill color of the indicator.\n   */\n  indicatorFill?: CSSProps[\"color\"]\n  /**\n   * The rounded of the indicator.\n   */\n  indicatorRounded?: CSSProps[\"rounded\"]\n  /**\n   * The marks to display on the slider.\n   */\n  marks?: SliderMarksProps[\"marks\"]\n  /**\n   * The fill color of the range.\n   */\n  rangeFill?: CSSProps[\"color\"]\n  /**\n   * The fill color of the thumb.\n   */\n  thumbFill?: CSSProps[\"color\"]\n  /**\n   * The rounded of the thumb.\n   */\n  thumbRounded?: CSSProps[\"rounded\"]\n  /**\n   * The size of the thumb.\n   */\n  thumbSize?: CSSProps[\"boxSize\"]\n  /**\n   * The stroke color of the thumb.\n   */\n  thumbStroke?: CSSProps[\"color\"]\n  /**\n   * The fill color of the track.\n   */\n  trackFill?: CSSProps[\"color\"]\n  /**\n   * The rounded of the track.\n   */\n  trackRounded?: CSSProps[\"rounded\"]\n  /**\n   * The size of the track.\n   */\n  trackSize?: CSSProps[\"boxSize\"]\n  /**\n   * Props for the input element.\n   */\n  inputProps?: SliderInputProps\n  /**\n   * Props for the marks element.\n   */\n  marksProps?: Partial<SliderMarksProps>\n  /**\n   * Props for the range element.\n   */\n  rangeProps?: SliderRangeProps\n  /**\n   * Props for the thumb element.\n   */\n  thumbProps?: SliderThumbProps\n  /**\n   * Props for the track element.\n   */\n  trackProps?: SliderTrackProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: SliderPropsContext,\n  useComponentContext,\n  usePropsContext: useSliderPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<SliderRootProps, SliderStyle, ComponentContext>(\n  \"slider\",\n  sliderStyle,\n)\n\nexport { SliderPropsContext, useSliderPropsContext }\n\n/**\n * `Slider` is a component used for allowing users to select a value from a range.\n *\n * @see https://yamada-ui.com/docs/components/slider\n */\nexport const SliderRoot = withProvider<\"input\", SliderRootProps, \"orientation\">(\n  <Y extends [number, number] | number = number>({\n    children,\n    marks,\n    orientation: orientationProp,\n    inputProps,\n    marksProps,\n    rangeProps,\n    thumbProps,\n    trackProps,\n    ...rest\n  }: SliderRootProps<Y>) => {\n    const orientation = useValue(orientationProp)\n    const {\n      range,\n      getInputProps,\n      getMarkProps,\n      getRangeProps,\n      getRootProps,\n      getThumbProps,\n      getTrackProps,\n    } = useSlider<Y>({ orientation, ...rest })\n    const computedChildren = useMemo(() => {\n      if (children) return children\n\n      return (\n        <>\n          <SliderTrack {...trackProps}>\n            <SliderRange {...rangeProps} />\n\n            {range ? (\n              <SliderThumbs {...thumbProps} />\n            ) : (\n              <SliderThumb {...thumbProps} />\n            )}\n          </SliderTrack>\n\n          {marks ? <SliderMarks marks={marks} {...marksProps} /> : null}\n        </>\n      )\n    }, [children, marks, marksProps, range, rangeProps, thumbProps, trackProps])\n    const context = useMemo(\n      () => ({\n        range,\n        getInputProps,\n        getMarkProps,\n        getRangeProps,\n        getThumbProps,\n        getTrackProps,\n      }),\n      [\n        range,\n        getInputProps,\n        getMarkProps,\n        getRangeProps,\n        getThumbProps,\n        getTrackProps,\n      ],\n    )\n\n    return (\n      <ComponentContext value={context}>\n        <styled.div {...getRootProps()}>\n          <SliderInput {...inputProps} />\n\n          {computedChildren}\n        </styled.div>\n      </ComponentContext>\n    )\n  },\n  \"root\",\n  { transferProps: [\"orientation\"] },\n)(\n  undefined,\n  ({\n    indicatorFill,\n    indicatorRounded,\n    rangeFill,\n    thumbFill,\n    thumbRounded,\n    thumbSize,\n    thumbStroke,\n    trackFill,\n    trackRounded,\n    trackSize,\n    ...rest\n  }) => ({\n    \"--indicator-fill\": varAttr(indicatorFill, \"colors\"),\n    \"--indicator-rounded\": varAttr(indicatorRounded, \"radii\"),\n    \"--range-fill\": varAttr(rangeFill, \"colors\"),\n    \"--thumb-fill\": varAttr(thumbFill, \"colors\"),\n    \"--thumb-rounded\": varAttr(thumbRounded, \"radii\"),\n    \"--thumb-size\": varAttr(thumbSize, \"sizes\"),\n    \"--thumb-stroke\": varAttr(thumbStroke, \"colors\"),\n    \"--track-fill\": varAttr(trackFill, \"colors\"),\n    \"--track-rounded\": varAttr(trackRounded, \"radii\"),\n    \"--track-size\": varAttr(trackSize, \"sizes\"),\n    ...rest,\n  }),\n) as GenericsComponent<{\n  <Y extends [number, number] | number = number>(\n    props: SliderRootProps<Y>,\n  ): ReactElement\n}>\n\ninterface SliderInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst SliderInput: FC<SliderInputProps> = () => {\n  const { range, getInputProps } = useComponentContext()\n\n  return range ? (\n    Array.from({ length: 2 }).map((_, index) => (\n      <styled.input key={index} {...getInputProps({ index })} />\n    ))\n  ) : (\n    <styled.input {...getInputProps()} />\n  )\n}\n\nexport interface SliderTrackProps extends HTMLStyledProps {}\n\nexport const SliderTrack = withContext<\"div\", SliderTrackProps>(\"div\", \"track\")(\n  undefined,\n  (props) => {\n    const { getTrackProps } = useComponentContext()\n\n    return getTrackProps(props)\n  },\n)\n\nexport interface SliderRangeProps extends HTMLStyledProps {}\n\nexport const SliderRange = withContext<\"div\", SliderRangeProps>(\"div\", \"range\")(\n  undefined,\n  (props) => {\n    const { getRangeProps } = useComponentContext()\n\n    return getRangeProps(props)\n  },\n)\n\nexport interface SliderMarkProps extends HTMLStyledProps {\n  /**\n   * The value of the mark.\n   */\n  value: number\n  /**\n   * Whether the mark is an indicator.\n   *\n   * @default true\n   */\n  indicator?: boolean\n}\n\nexport const SliderMark = withContext<\"div\", SliderMarkProps>(\"div\", \"mark\")(\n  undefined,\n  ({ indicator = true, ...props }) => {\n    const { getMarkProps } = useComponentContext()\n\n    return getMarkProps({ \"data-indicator\": dataAttr(indicator), ...props })\n  },\n)\n\nexport interface SliderMarksProps extends Omit<SliderMarkProps, \"value\"> {\n  /**\n   * The marks to display on the slider.\n   */\n  marks: (number | { label: ReactNode; value: number; indicator?: boolean })[]\n}\n\nexport const SliderMarks: FC<SliderMarksProps> = ({ marks, ...props }) => {\n  return (\n    <>\n      {marks.map((mark, index) => {\n        if (isNumber(mark)) {\n          return <SliderMark key={index} value={mark} {...props} />\n        } else {\n          const { indicator, label, value } = mark\n\n          return (\n            <SliderMark key={index} indicator={indicator} value={value}>\n              {label}\n            </SliderMark>\n          )\n        }\n      })}\n    </>\n  )\n}\n\nexport interface SliderThumbProps extends HTMLStyledProps {\n  /**\n   * The index of the thumb.\n   */\n  index?: number\n}\n\nexport const SliderThumb = withContext<\"div\", SliderThumbProps>(\"div\", \"thumb\")(\n  undefined,\n  (props) => {\n    const { getThumbProps } = useComponentContext()\n\n    return getThumbProps(props)\n  },\n)\n\nexport interface SliderThumbsProps extends SliderThumbProps {}\n\nexport const SliderThumbs: FC<SliderThumbsProps> = (props) => {\n  return (\n    <>\n      {Array.from({ length: 2 }).map((_, index) => (\n        <SliderThumb key={index} index={index} {...props} />\n      ))}\n    </>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"slider.js","names":[],"sources":["../../../../src/components/slider/slider.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, ReactElement, ReactNode } from \"react\"\nimport type {\n  CSSProps,\n  GenericsComponent,\n  HTMLStyledProps,\n  ThemeProps,\n} from \"../../core\"\nimport type { SliderStyle } from \"./slider.style\"\nimport type { UseSliderProps, UseSliderReturn } from \"./use-slider\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled, varAttr } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { dataAttr, isNumber } from \"../../utils\"\nimport { sliderStyle } from \"./slider.style\"\nimport { useSlider } from \"./use-slider\"\n\ninterface ComponentContext extends Pick<\n  UseSliderReturn,\n  | \"getInputProps\"\n  | \"getMarkProps\"\n  | \"getRangeProps\"\n  | \"getThumbProps\"\n  | \"getTrackProps\"\n  | \"range\"\n> {}\n\nexport interface SliderRootProps<Y extends [number, number] | number = number>\n  extends\n    Omit<HTMLStyledProps, \"defaultValue\" | \"onChange\" | \"ref\">,\n    Omit<UseSliderProps<Y>, \"orientation\">,\n    ThemeProps<SliderStyle> {\n  /**\n   * The fill color of the indicator.\n   */\n  indicatorFill?: CSSProps[\"color\"]\n  /**\n   * The rounded of the indicator.\n   */\n  indicatorRounded?: CSSProps[\"rounded\"]\n  /**\n   * The marks to display on the slider.\n   */\n  marks?: SliderMarksProps[\"marks\"]\n  /**\n   * The fill color of the range.\n   */\n  rangeFill?: CSSProps[\"color\"]\n  /**\n   * The fill color of the thumb.\n   */\n  thumbFill?: CSSProps[\"color\"]\n  /**\n   * The rounded of the thumb.\n   */\n  thumbRounded?: CSSProps[\"rounded\"]\n  /**\n   * The size of the thumb.\n   */\n  thumbSize?: CSSProps[\"boxSize\"]\n  /**\n   * The stroke color of the thumb.\n   */\n  thumbStroke?: CSSProps[\"color\"]\n  /**\n   * The fill color of the track.\n   */\n  trackFill?: CSSProps[\"color\"]\n  /**\n   * The rounded of the track.\n   */\n  trackRounded?: CSSProps[\"rounded\"]\n  /**\n   * The size of the track.\n   */\n  trackSize?: CSSProps[\"boxSize\"]\n  /**\n   * Props for the input element.\n   */\n  inputProps?: SliderInputProps\n  /**\n   * Props for the marks element.\n   */\n  marksProps?: Partial<SliderMarksProps>\n  /**\n   * Props for the range element.\n   */\n  rangeProps?: SliderRangeProps\n  /**\n   * Props for the thumb element.\n   */\n  thumbProps?: SliderThumbProps\n  /**\n   * Props for the track element.\n   */\n  trackProps?: SliderTrackProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: SliderPropsContext,\n  useComponentContext,\n  usePropsContext: useSliderPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<SliderRootProps, SliderStyle, ComponentContext>(\n  \"slider\",\n  sliderStyle,\n)\n\nexport { SliderPropsContext, useSliderPropsContext }\n\n/**\n * `Slider` is a component used for allowing users to select a value from a range.\n *\n * @see https://yamada-ui.com/docs/components/slider\n */\nexport const SliderRoot = withProvider<\"input\", SliderRootProps, \"orientation\">(\n  <Y extends [number, number] | number = number>({\n    children,\n    marks,\n    orientation: orientationProp,\n    inputProps,\n    marksProps,\n    rangeProps,\n    thumbProps,\n    trackProps,\n    ...rest\n  }: SliderRootProps<Y>) => {\n    const orientation = useValue(orientationProp)\n    const {\n      range,\n      getInputProps,\n      getMarkProps,\n      getRangeProps,\n      getRootProps,\n      getThumbProps,\n      getTrackProps,\n    } = useSlider<Y>({ orientation, ...rest })\n    const computedChildren = useMemo(() => {\n      if (children) return children\n\n      return (\n        <>\n          <SliderTrack {...trackProps}>\n            <SliderRange {...rangeProps} />\n\n            {range ? (\n              <SliderThumbs {...thumbProps} />\n            ) : (\n              <SliderThumb {...thumbProps} />\n            )}\n          </SliderTrack>\n\n          {marks ? <SliderMarks marks={marks} {...marksProps} /> : null}\n        </>\n      )\n    }, [children, marks, marksProps, range, rangeProps, thumbProps, trackProps])\n    const context = useMemo(\n      () => ({\n        range,\n        getInputProps,\n        getMarkProps,\n        getRangeProps,\n        getThumbProps,\n        getTrackProps,\n      }),\n      [\n        range,\n        getInputProps,\n        getMarkProps,\n        getRangeProps,\n        getThumbProps,\n        getTrackProps,\n      ],\n    )\n\n    return (\n      <ComponentContext value={context}>\n        <styled.div {...getRootProps()}>\n          <SliderInput {...inputProps} />\n\n          {computedChildren}\n        </styled.div>\n      </ComponentContext>\n    )\n  },\n  \"root\",\n  { transferProps: [\"orientation\"] },\n)(\n  undefined,\n  ({\n    indicatorFill,\n    indicatorRounded,\n    rangeFill,\n    thumbFill,\n    thumbRounded,\n    thumbSize,\n    thumbStroke,\n    trackFill,\n    trackRounded,\n    trackSize,\n    ...rest\n  }) => ({\n    \"--indicator-fill\": varAttr(indicatorFill, \"colors\"),\n    \"--indicator-rounded\": varAttr(indicatorRounded, \"radii\"),\n    \"--range-fill\": varAttr(rangeFill, \"colors\"),\n    \"--thumb-fill\": varAttr(thumbFill, \"colors\"),\n    \"--thumb-rounded\": varAttr(thumbRounded, \"radii\"),\n    \"--thumb-size\": varAttr(thumbSize, \"sizes\"),\n    \"--thumb-stroke\": varAttr(thumbStroke, \"colors\"),\n    \"--track-fill\": varAttr(trackFill, \"colors\"),\n    \"--track-rounded\": varAttr(trackRounded, \"radii\"),\n    \"--track-size\": varAttr(trackSize, \"sizes\"),\n    ...rest,\n  }),\n) as GenericsComponent<{\n  <Y extends [number, number] | number = number>(\n    props: SliderRootProps<Y>,\n  ): ReactElement\n}>\n\ninterface SliderInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst SliderInput: FC<SliderInputProps> = () => {\n  const { range, getInputProps } = useComponentContext()\n\n  return range ? (\n    Array.from({ length: 2 }).map((_, index) => (\n      <styled.input key={index} {...getInputProps({ index })} />\n    ))\n  ) : (\n    <styled.input {...getInputProps()} />\n  )\n}\n\nexport interface SliderTrackProps extends HTMLStyledProps {}\n\nexport const SliderTrack = withContext<\"div\", SliderTrackProps>(\"div\", \"track\")(\n  undefined,\n  (props) => {\n    const { getTrackProps } = useComponentContext()\n\n    return getTrackProps(props)\n  },\n)\n\nexport interface SliderRangeProps extends HTMLStyledProps {}\n\nexport const SliderRange = withContext<\"div\", SliderRangeProps>(\"div\", \"range\")(\n  undefined,\n  (props) => {\n    const { getRangeProps } = useComponentContext()\n\n    return getRangeProps(props)\n  },\n)\n\nexport interface SliderMarkProps extends HTMLStyledProps {\n  /**\n   * The value of the mark.\n   */\n  value: number\n  /**\n   * Whether the mark is an indicator.\n   *\n   * @default true\n   */\n  indicator?: boolean\n}\n\nexport const SliderMark = withContext<\"div\", SliderMarkProps>(\"div\", \"mark\")(\n  undefined,\n  ({ indicator = true, ...props }) => {\n    const { getMarkProps } = useComponentContext()\n\n    return getMarkProps({ \"data-indicator\": dataAttr(indicator), ...props })\n  },\n)\n\nexport interface SliderMarksProps extends Omit<SliderMarkProps, \"value\"> {\n  /**\n   * The marks to display on the slider.\n   */\n  marks: (number | { label: ReactNode; value: number; indicator?: boolean })[]\n}\n\nexport const SliderMarks: FC<SliderMarksProps> = ({ marks, ...props }) => {\n  return (\n    <>\n      {marks.map((mark, index) => {\n        if (isNumber(mark)) {\n          return <SliderMark key={index} value={mark} {...props} />\n        } else {\n          const { indicator, label, value } = mark\n\n          return (\n            <SliderMark key={index} indicator={indicator} value={value}>\n              {label}\n            </SliderMark>\n          )\n        }\n      })}\n    </>\n  )\n}\n\nexport interface SliderThumbProps extends HTMLStyledProps {\n  /**\n   * The index of the thumb.\n   */\n  index?: number\n}\n\nexport const SliderThumb = withContext<\"div\", SliderThumbProps>(\"div\", \"thumb\")(\n  undefined,\n  (props) => {\n    const { getThumbProps } = useComponentContext()\n\n    return getThumbProps(props)\n  },\n)\n\nexport interface SliderThumbsProps extends SliderThumbProps {}\n\nexport const SliderThumbs: FC<SliderThumbsProps> = (props) => {\n  return (\n    <>\n      {Array.from({ length: 2 }).map((_, index) => (\n        <SliderThumb key={index} index={index} {...props} />\n      ))}\n    </>\n  )\n}\n"],"mappings":"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"}

package/dist/esm/components/slider/slider.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.style.js","names":[],"sources":["../../../../src/components/slider/slider.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\n\nexport const sliderStyle = defineComponentSlotStyle({\n  base: {\n    mark: {\n      \"&[data-indicator]\": {\n        _before: {\n          bg: \"{indicator-fill}\",\n          boxSize: \"{track-size}\",\n          position: \"absolute\",\n          rounded: \"{indicator-rounded}\",\n        },\n        _between: {\n          \"--indicator-fill\": \"colorScheme.contrast\",\n        },\n      },\n      color: \"fg.muted\",\n      fontSize: \"xs\",\n      pointerEvents: \"none\",\n      position: \"absolute\",\n      textAlign: \"center\",\n      whiteSpace: \"nowrap\",\n      zIndex: 1,\n    },\n    range: {\n      bg: \"{range-fill}\",\n      position: \"absolute\",\n      rounded: \"{track-rounded}\",\n    },\n    root: {\n      \"--indicator-rounded\": \"radii.full\",\n      \"--track-rounded\": \"radii.full\",\n      alignItems: \"center\",\n      display: \"inline-flex\",\n      isolation: \"isolate\",\n      position: \"relative\",\n      touchAction: \"none\",\n      _readOnly: { layerStyle: \"readOnly\" },\n      _disabled: { layerStyle: \"disabled\" },\n    },\n    thumb: {\n      alignItems: \"center\",\n      bg: \"{thumb-fill}\",\n      borderColor: \"{thumb-stroke}\",\n      borderWidth: \"2px\",\n      boxSize: \"{thumb-size}\",\n      color: \"{thumb-stroke}\",\n      display: \"flex\",\n      justifyContent: \"center\",\n      position: \"absolute\",\n      rounded: \"{thumb-rounded}\",\n      zIndex: 2,\n    },\n    track: {\n      bg: \"{track-fill}\",\n      cursor: {\n        base: \"pointer\",\n        _readOnly: \"default\",\n        _disabled: \"not-allowed\",\n      },\n      flex: \"1\",\n      position: \"relative\",\n      rounded: \"{track-rounded}\",\n    },\n  },\n\n  props: {\n    /**\n     * The orientation of the slider.\n     *\n     * @default 'horizontal'\n     */\n    orientation: {\n      horizontal: {\n        mark: {\n          left: \"{mark-position}\",\n          pt: \"calc({track-size} + {spaces.2})\",\n          top: \"0\",\n          translate: \"-50% 0\",\n          _before: {\n            left: \"50%\",\n            top: \"0\",\n            translate: \"-50% 0\",\n          },\n        },\n        range: {\n          h: \"full\",\n          left: \"{range-start}\",\n          top: \"50%\",\n          translate: \"0 -50%\",\n          w: \"calc({range-end} - {range-start} + ({track-size} / 2))\",\n          _range: {\n            left: \"calc({range-start} - ({track-size} / 2))\",\n            w: \"calc({range-end} - {range-start} + {track-size})\",\n          },\n        },\n        root: {\n          flexDirection: \"row\",\n          minW: \"{thumb-size}\",\n          w: \"full\",\n        },\n        thumb: {\n          top: \"50%\",\n          translate: \"-50% -50%\",\n          _end: { left: \"{range-end}\" },\n          _start: { left: \"{range-start}\" },\n        },\n        track: {\n          h: \"{track-size}\",\n        },\n      },\n      vertical: {\n        mark: {\n          bottom: \"{mark-position}\",\n          left: \"0\",\n          lineHeight: \"2\",\n          ps: \"calc({track-size} + {spaces.3})\",\n          translate: \"0 50%\",\n          _before: {\n            left: \"0\",\n            top: \"50%\",\n            translate: \"0 -50%\",\n          },\n        },\n        range: {\n          bottom: \"{range-start}\",\n          h: \"calc({range-end} - {range-start} + ({track-size} / 2))\",\n          left: \"50%\",\n          translate: \"-50% 0\",\n          w: \"full\",\n          _range: {\n            bottom: \"calc({range-start} - ({track-size} / 2))\",\n            h: \"calc({range-end} - {range-start} + {track-size})\",\n          },\n        },\n        root: {\n          flexDirection: \"column\",\n          h: \"full\",\n          minH: \"{thumb-size}\",\n        },\n        thumb: {\n          left: \"50%\",\n          translate: \"-50% 50%\",\n          _end: { bottom: \"{range-end}\" },\n          _start: { bottom: \"{range-start}\" },\n        },\n        track: {\n          w: \"{track-size}\",\n        },\n      },\n    },\n    /**\n     * The shape of the thumb.\n     *\n     * @default 'circle'\n     */\n    shape: {\n      circle: {\n        root: { \"--thumb-rounded\": \"radii.full\" },\n      },\n      rounded: {\n        root: { \"--thumb-rounded\": \"radii.l2\" },\n      },\n      square: {\n        root: { \"--thumb-rounded\": \"0\" },\n      },\n    },\n  },\n\n  variants: {\n    base: {\n      root: {\n        _container: [\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--form-group-variant: \"panel\"',\n          },\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--fieldset-root-variant: \"panel\"',\n          },\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--form-group-variant: \"elevated\"',\n          },\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--fieldset-root-variant: \"elevated\"',\n          },\n        ],\n      },\n    },\n    outline: {\n      root: {\n        \"--indicator-fill\": \"colorScheme.solid\",\n        \"--range-fill\": \"colorScheme.solid\",\n        \"--thumb-fill\": \"colors.bg\",\n        \"--thumb-stroke\": \"colorScheme.solid\",\n        \"--track-fill\": \"colors.bg.muted\",\n      },\n    },\n    solid: {\n      root: {\n        \"--indicator-fill\": \"colorScheme.solid\",\n        \"--range-fill\": \"colorScheme.solid\",\n        \"--thumb-fill\": \"colorScheme.solid\",\n        \"--thumb-stroke\": \"colorScheme.solid\",\n        \"--track-fill\": \"colors.bg.muted\",\n      },\n    },\n  },\n\n  sizes: {\n    xs: {\n      root: {\n        \"--thumb-size\": \"sizes.3\",\n        \"--track-size\": \"sizes.1\",\n      },\n    },\n    sm: {\n      root: {\n        \"--thumb-size\": \"sizes.4\",\n        \"--track-size\": \"sizes.1.5\",\n      },\n    },\n    md: {\n      root: {\n        \"--thumb-size\": \"sizes.5\",\n        \"--track-size\": \"sizes.2\",\n      },\n    },\n    lg: {\n      root: {\n        \"--thumb-size\": \"sizes.6\",\n        \"--track-size\": \"sizes.2.5\",\n      },\n    },\n    xl: {\n      root: {\n        \"--thumb-size\": \"sizes.7\",\n        \"--track-size\": \"sizes.3\",\n      },\n    },\n  },\n\n  defaultProps: {\n    size: \"md\",\n    variant: \"outline\",\n    orientation: \"horizontal\",\n    shape: \"circle\",\n  },\n})\n\nexport type SliderStyle = typeof sliderStyle\n"],"mappings":"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"}
+{"version":3,"file":"slider.style.js","names":[],"sources":["../../../../src/components/slider/slider.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\n\nexport const sliderStyle = defineComponentSlotStyle({\n  base: {\n    mark: {\n      \"&[data-indicator]\": {\n        _before: {\n          bg: \"{indicator-fill}\",\n          boxSize: \"{track-size}\",\n          position: \"absolute\",\n          rounded: \"{indicator-rounded}\",\n        },\n        _between: {\n          \"--indicator-fill\": \"colorScheme.contrast\",\n        },\n      },\n      color: \"fg.muted\",\n      fontSize: \"xs\",\n      pointerEvents: \"none\",\n      position: \"absolute\",\n      textAlign: \"center\",\n      whiteSpace: \"nowrap\",\n      zIndex: 1,\n    },\n    range: {\n      bg: \"{range-fill}\",\n      position: \"absolute\",\n      rounded: \"{track-rounded}\",\n    },\n    root: {\n      \"--indicator-rounded\": \"radii.full\",\n      \"--track-rounded\": \"radii.full\",\n      alignItems: \"center\",\n      display: \"inline-flex\",\n      isolation: \"isolate\",\n      position: \"relative\",\n      touchAction: \"none\",\n      _readOnly: { layerStyle: \"readOnly\" },\n      _disabled: { layerStyle: \"disabled\" },\n    },\n    thumb: {\n      alignItems: \"center\",\n      bg: \"{thumb-fill}\",\n      borderColor: \"{thumb-stroke}\",\n      borderWidth: \"2px\",\n      boxSize: \"{thumb-size}\",\n      color: \"{thumb-stroke}\",\n      display: \"flex\",\n      justifyContent: \"center\",\n      position: \"absolute\",\n      rounded: \"{thumb-rounded}\",\n      zIndex: 2,\n    },\n    track: {\n      bg: \"{track-fill}\",\n      cursor: {\n        base: \"pointer\",\n        _readOnly: \"default\",\n        _disabled: \"not-allowed\",\n      },\n      flex: \"1\",\n      position: \"relative\",\n      rounded: \"{track-rounded}\",\n    },\n  },\n\n  props: {\n    /**\n     * The orientation of the slider.\n     *\n     * @default 'horizontal'\n     */\n    orientation: {\n      horizontal: {\n        mark: {\n          left: \"{mark-position}\",\n          pt: \"calc({track-size} + {spaces.2})\",\n          top: \"0\",\n          translate: \"-50% 0\",\n          _before: {\n            left: \"50%\",\n            top: \"0\",\n            translate: \"-50% 0\",\n          },\n        },\n        range: {\n          h: \"full\",\n          left: \"{range-start}\",\n          top: \"50%\",\n          translate: \"0 -50%\",\n          w: \"calc({range-end} - {range-start} + ({track-size} / 2))\",\n          _range: {\n            left: \"calc({range-start} - ({track-size} / 2))\",\n            w: \"calc({range-end} - {range-start} + {track-size})\",\n          },\n        },\n        root: {\n          flexDirection: \"row\",\n          minW: \"{thumb-size}\",\n          w: \"full\",\n        },\n        thumb: {\n          top: \"50%\",\n          translate: \"-50% -50%\",\n          _end: { left: \"{range-end}\" },\n          _start: { left: \"{range-start}\" },\n        },\n        track: {\n          h: \"{track-size}\",\n        },\n      },\n      vertical: {\n        mark: {\n          bottom: \"{mark-position}\",\n          left: \"0\",\n          lineHeight: \"2\",\n          ps: \"calc({track-size} + {spaces.3})\",\n          translate: \"0 50%\",\n          _before: {\n            left: \"0\",\n            top: \"50%\",\n            translate: \"0 -50%\",\n          },\n        },\n        range: {\n          bottom: \"{range-start}\",\n          h: \"calc({range-end} - {range-start} + ({track-size} / 2))\",\n          left: \"50%\",\n          translate: \"-50% 0\",\n          w: \"full\",\n          _range: {\n            bottom: \"calc({range-start} - ({track-size} / 2))\",\n            h: \"calc({range-end} - {range-start} + {track-size})\",\n          },\n        },\n        root: {\n          flexDirection: \"column\",\n          h: \"full\",\n          minH: \"{thumb-size}\",\n        },\n        thumb: {\n          left: \"50%\",\n          translate: \"-50% 50%\",\n          _end: { bottom: \"{range-end}\" },\n          _start: { bottom: \"{range-start}\" },\n        },\n        track: {\n          w: \"{track-size}\",\n        },\n      },\n    },\n    /**\n     * The shape of the thumb.\n     *\n     * @default 'circle'\n     */\n    shape: {\n      circle: {\n        root: { \"--thumb-rounded\": \"radii.full\" },\n      },\n      rounded: {\n        root: { \"--thumb-rounded\": \"radii.l2\" },\n      },\n      square: {\n        root: { \"--thumb-rounded\": \"0\" },\n      },\n    },\n  },\n\n  variants: {\n    base: {\n      root: {\n        _container: [\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--form-group-variant: \"panel\"',\n          },\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--fieldset-root-variant: \"panel\"',\n          },\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--form-group-variant: \"elevated\"',\n          },\n          {\n            css: { \"--track-fill\": \"colors.bg\" },\n            style: '--fieldset-root-variant: \"elevated\"',\n          },\n        ],\n      },\n    },\n    outline: {\n      root: {\n        \"--indicator-fill\": \"colorScheme.solid\",\n        \"--range-fill\": \"colorScheme.solid\",\n        \"--thumb-fill\": \"colors.bg\",\n        \"--thumb-stroke\": \"colorScheme.solid\",\n        \"--track-fill\": \"colors.bg.muted\",\n      },\n    },\n    solid: {\n      root: {\n        \"--indicator-fill\": \"colorScheme.solid\",\n        \"--range-fill\": \"colorScheme.solid\",\n        \"--thumb-fill\": \"colorScheme.solid\",\n        \"--thumb-stroke\": \"colorScheme.solid\",\n        \"--track-fill\": \"colors.bg.muted\",\n      },\n    },\n  },\n\n  sizes: {\n    xs: {\n      root: {\n        \"--thumb-size\": \"sizes.3\",\n        \"--track-size\": \"sizes.1\",\n      },\n    },\n    sm: {\n      root: {\n        \"--thumb-size\": \"sizes.4\",\n        \"--track-size\": \"sizes.1.5\",\n      },\n    },\n    md: {\n      root: {\n        \"--thumb-size\": \"sizes.5\",\n        \"--track-size\": \"sizes.2\",\n      },\n    },\n    lg: {\n      root: {\n        \"--thumb-size\": \"sizes.6\",\n        \"--track-size\": \"sizes.2.5\",\n      },\n    },\n    xl: {\n      root: {\n        \"--thumb-size\": \"sizes.7\",\n        \"--track-size\": \"sizes.3\",\n      },\n    },\n  },\n\n  defaultProps: {\n    size: \"md\",\n    variant: \"outline\",\n    orientation: \"horizontal\",\n    shape: \"circle\",\n  },\n})\n\nexport type SliderStyle = typeof sliderStyle\n"],"mappings":"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"}

package/dist/esm/components/slider/use-slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-slider.js","names":[],"sources":["../../../../src/components/slider/use-slider.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type {\n  HTMLProps,\n  HTMLRefAttributes,\n  Orientation,\n  PropGetter,\n  RequiredPropGetter,\n} from \"../../core\"\nimport type { Point } from \"../../utils\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { usePanEvent } from \"../../hooks/use-pan-event\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  clampNumber,\n  cx,\n  dataAttr,\n  handlerAll,\n  isArray,\n  isNumber,\n  mergeRefs,\n  percentToValue,\n  roundNumberToStep,\n  runKeyAction,\n  valueToPercent,\n  visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nexport interface UseSliderProps<Y extends [number, number] | number = number>\n  extends\n    Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"ref\">,\n    HTMLRefAttributes<\"input\">,\n    FieldProps {\n  /**\n   * The minimum distance between slider thumbs.\n   * Useful for preventing the thumbs from being too close together.\n   *\n   * @default 0\n   */\n  betweenThumbs?: number\n  /**\n   * The initial value of the slider.\n   */\n  defaultValue?: Y\n  /**\n   * The base `id` to use for the slider.\n   */\n  id?: string\n  /**\n   * The maximum allowed value of the slider. Cannot be less than min.\n   *\n   * @default 100\n   */\n  max?: number\n  /**\n   * The minimum allowed value of the slider. Cannot be greater than max.\n   *\n   * @default 0\n   */\n  min?: number\n  /**\n   * The name attribute of the hidden `input` field.\n   * This is particularly useful in forms.\n   */\n  name?: string\n  /**\n   * The orientation of the slider.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * The step in which increments or decrements have to be made.\n   *\n   * @default 1\n   */\n  step?: number\n  /**\n   * The value of the slider.\n   */\n  value?: Y\n  /**\n   * This is used to format the value so that screen readers\n   * can speak out a more human-friendly value.\n   *\n   * It is used to set the `aria-valuetext` property of the input.\n   */\n  getAriaValueText?: (value: number, index: number) => string | undefined\n  /**\n   * Function called whenever the slider value changes.\n   */\n  onChange?: (value: Y) => void\n  /**\n   * Function called when the user is done selecting a new value.\n   */\n  onChangeEnd?: (value: Y) => void\n  /**\n   * Function called when the user starts selecting a new value.\n   */\n  onChangeStart?: (value: Y) => void\n}\n\nexport const useSlider = <Y extends [number, number] | number = number>(\n  props: UseSliderProps<Y> = {},\n) => {\n  const {\n    props: {\n      id,\n      ref,\n      name,\n      \"aria-labelledby\": ariaLabelledBy,\n      \"aria-valuetext\": ariaValueText,\n      betweenThumbs = 0,\n      defaultValue = 0 as Y,\n      disabled,\n      getAriaValueText,\n      max = 100,\n      min = 0,\n      orientation = \"horizontal\",\n      readOnly,\n      required,\n      step = 1,\n      value: valueProp,\n      onChange: onChangeProp,\n      onChangeEnd,\n      onChangeStart,\n      ...rest\n    },\n    ariaProps,\n    dataProps,\n    eventProps,\n  } = useFieldProps(props)\n  const [value, setValue] = useControllableState({\n    defaultValue,\n    value: valueProp,\n    onChange: onChangeProp,\n  })\n  const { t } = useI18n(\"slider\")\n  const currentIndex = useRef(0)\n  const interactive = !(disabled || readOnly)\n  const [_, getPanEventProps] = usePanEvent<HTMLDivElement>({\n    onEnd: (_, point, rect) => {\n      if (!interactive) return\n\n      const panValue = getPanValue(point, rect)\n\n      if (range) {\n        const start = currentIndex.current === 0\n        const oppositeIndex = currentIndex.current === 0 ? 1 : 0\n        const oppositeValue = value[oppositeIndex]\n\n        onChangeEnd?.(\n          (start ? [panValue, oppositeValue] : [oppositeValue, panValue]) as Y,\n        )\n      } else {\n        onChangeEnd?.(panValue as Y)\n      }\n    },\n    onMove: (_, point, rect) => {\n      if (!interactive) return\n\n      const panValue = getPanValue(point, rect)\n\n      onChange(currentIndex.current, panValue)\n    },\n    onStart: (_, point, rect) => {\n      if (!interactive) return\n\n      const panValue = getPanValue(point, rect)\n\n      if (range) {\n        const distances = value.map((value) => Math.abs(value - panValue))\n        const closest = Math.min(...distances)\n        const index = distances.indexOf(closest)\n\n        currentIndex.current = index\n\n        const start = index === 0\n        const oppositeIndex = index === 0 ? 1 : 0\n        const oppositeValue = value[oppositeIndex]\n\n        onChangeStart?.(\n          (start ? [panValue, oppositeValue] : [oppositeValue, panValue]) as Y,\n        )\n      } else {\n        currentIndex.current = 0\n\n        onChangeStart?.(value as Y)\n      }\n\n      onChange(currentIndex.current, panValue)\n    },\n  })\n  const range = !isNumber(value)\n  const percent = (\n    range\n      ? value.map((value) => valueToPercent(value, min, max))\n      : valueToPercent(value, min, max)\n  ) as Y extends number ? number : number[]\n  const tenStep = (max - min) / 10\n  const oneStep = step || (max - min) / 100\n\n  if (max < min) console.warn(\"Do not assign a number less than 'min' to 'max'\")\n\n  const getMinMax = useCallback(\n    (index: number) => {\n      const start = index === 0\n      const oppositeIndex = index === 0 ? 1 : 0\n      const oppositeValue = range ? value[oppositeIndex] : value\n\n      return {\n        max: range ? (start ? oppositeValue - betweenThumbs : max) : max,\n        min: range ? (start ? min : oppositeValue + betweenThumbs) : min,\n      }\n    },\n    [betweenThumbs, max, min, range, value],\n  )\n\n  const getPanValue = useCallback(\n    ({ x, y }: Point, { bottom, height, left, width }: DOMRect) => {\n      const diff = orientation === \"horizontal\" ? x - left : bottom - y\n      const length = orientation === \"horizontal\" ? width : height\n      const percent = diff / length\n\n      let nextValue = percentToValue(percent, min, max)\n\n      nextValue = parseFloat(roundNumberToStep(nextValue, min, step))\n      nextValue = clampNumber(nextValue, min, max)\n\n      return nextValue\n    },\n    [orientation, min, max, step],\n  )\n\n  const onChange = useCallback(\n    (index: number, value: number) => {\n      if (!interactive) return\n\n      const { max, min } = getMinMax(index)\n\n      value = parseFloat(roundNumberToStep(value, min, oneStep))\n      value = clampNumber(value, min, max)\n\n      setValue((prev) => {\n        if (isArray(prev)) {\n          const next = [...prev]\n\n          next[index] = value\n\n          return next as Y\n        } else {\n          return value as Y\n        }\n      })\n    },\n    [getMinMax, interactive, oneStep, setValue],\n  )\n\n  const stepUp = useCallback(\n    (index: number, step = oneStep) =>\n      range\n        ? onChange(index, value[index]! + step)\n        : onChange(index, value + step),\n    [oneStep, range, onChange, value],\n  )\n\n  const stepDown = useCallback(\n    (index: number, step = oneStep) =>\n      range\n        ? onChange(index, value[index]! - step)\n        : onChange(index, value - step),\n    [oneStep, range, onChange, value],\n  )\n\n  const onKeyDown = useCallback(\n    (index: number) => (ev: KeyboardEvent<HTMLDivElement>) => {\n      const { max, min } = getMinMax(index)\n\n      runKeyAction(ev, {\n        ArrowDown: () => stepDown(index),\n        ArrowLeft: () => stepDown(index),\n        ArrowRight: () => stepUp(index),\n        ArrowUp: () => stepUp(index),\n        End: () => onChange(index, max),\n        Home: () => onChange(index, min),\n        PageDown: () => stepDown(index, tenStep),\n        PageUp: () => stepUp(index, tenStep),\n      })\n    },\n    [getMinMax, onChange, stepDown, stepUp, tenStep],\n  )\n\n  const getRootProps: PropGetter = useCallback(\n    (props = {}) => {\n      const computedProps: HTMLProps = mergeProps(\n        dataProps,\n        { \"data-orientation\": orientation },\n        rest,\n        props,\n        { onBlur: eventProps.onBlur, onFocus: eventProps.onFocus },\n      )()\n\n      computedProps.style ??= {}\n\n      if (isArray(percent)) {\n        computedProps.style[\"--range-start\"] = `${Math.abs(percent[0]!)}%`\n        computedProps.style[\"--range-end\"] = `${Math.abs(percent[1]!)}%`\n      } else {\n        computedProps.style[\"--range-start\"] = \"0%\"\n        computedProps.style[\"--range-end\"] = `${Math.abs(percent)}%`\n      }\n\n      return computedProps\n    },\n    [dataProps, eventProps, orientation, percent, rest],\n  )\n\n  const getInputProps: PropGetter<\"input\", { index?: number }> = useCallback(\n    ({ index = 0, ...props } = {}) => ({\n      ...visuallyHiddenAttributes,\n      ...dataProps,\n      ...ariaProps,\n      id,\n      type: \"hidden\",\n      name,\n      disabled,\n      readOnly,\n      required,\n      value: range ? value[index]! : value,\n      ...props,\n      ref: index === 0 ? mergeRefs(props.ref, ref) : props.ref,\n    }),\n    [\n      dataProps,\n      ariaProps,\n      id,\n      name,\n      disabled,\n      readOnly,\n      required,\n      range,\n      value,\n      ref,\n    ],\n  )\n\n  const getTrackProps: PropGetter = useCallback(\n    (props) =>\n      getPanEventProps({\n        ...dataProps,\n        \"data-orientation\": orientation,\n        ...props,\n      }),\n    [dataProps, getPanEventProps, orientation],\n  )\n\n  const getRangeProps: PropGetter = useCallback(\n    (props) => ({\n      ...dataProps,\n      \"data-orientation\": orientation,\n      \"data-range\": dataAttr(range),\n      ...props,\n    }),\n    [dataProps, orientation, range],\n  )\n\n  const getMarkProps: RequiredPropGetter<\"div\", { value: number }> =\n    useCallback(\n      ({ style, value: valueProp, ...props }) => {\n        const between = range\n          ? value[0] < valueProp && valueProp < value[1]\n          : valueProp < value\n        const percent = valueToPercent(valueProp, min, max)\n\n        return {\n          ...dataProps,\n          \"aria-hidden\": true,\n          \"data-between\": dataAttr(between),\n          \"data-orientation\": orientation,\n          role: \"presentation\",\n          ...props,\n          style: { ...style, \"--mark-position\": `${percent}%` },\n        }\n      },\n      [dataProps, max, min, orientation, range, value],\n    )\n\n  const getThumbProps: PropGetter<\"div\", { index?: number }> = useCallback(\n    ({ index = 0, ...rest } = {}) => {\n      const { max, min } = getMinMax(index)\n\n      const props: HTMLProps = {\n        ...dataProps,\n        ...ariaProps,\n        \"aria-label\": t(\"Slider thumb\"),\n        \"aria-orientation\": orientation,\n        \"aria-valuemax\": max,\n        \"aria-valuemin\": min,\n        role: \"slider\",\n        tabIndex: interactive ? 0 : -1,\n        ...rest,\n        \"aria-labelledby\": cx(rest[\"aria-labelledby\"], ariaLabelledBy),\n        onKeyDown: handlerAll(rest.onKeyDown, onKeyDown(index)),\n      }\n\n      if (range) {\n        const currentValue = value[index]!\n\n        props[\"data-start\"] = dataAttr(index === 0)\n        props[\"data-end\"] = dataAttr(index === 1)\n        props[\"aria-valuenow\"] = currentValue\n        props[\"aria-valuetext\"] =\n          ariaValueText ??\n          getAriaValueText?.(currentValue, index) ??\n          currentValue.toString()\n      } else {\n        props[\"data-end\"] = dataAttr(index === 0)\n        props[\"aria-valuenow\"] = value\n        props[\"aria-valuetext\"] =\n          ariaValueText ?? getAriaValueText?.(value, index) ?? value.toString()\n      }\n\n      return props\n    },\n    [\n      t,\n      ariaLabelledBy,\n      ariaProps,\n      ariaValueText,\n      dataProps,\n      getAriaValueText,\n      getMinMax,\n      interactive,\n      onKeyDown,\n      orientation,\n      range,\n      value,\n    ],\n  )\n\n  return {\n    percent,\n    range,\n    setValue,\n    stepDown,\n    stepUp,\n    value,\n    getInputProps,\n    getMarkProps,\n    getRangeProps,\n    getRootProps,\n    getThumbProps,\n    getTrackProps,\n    onChange,\n  }\n}\n\nexport type UseSliderReturn = ReturnType<typeof useSlider>\n"],"mappings":"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"}
+{"version":3,"file":"use-slider.js","names":[],"sources":["../../../../src/components/slider/use-slider.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type {\n  HTMLProps,\n  HTMLRefAttributes,\n  Orientation,\n  PropGetter,\n  RequiredPropGetter,\n} from \"../../core\"\nimport type { Point } from \"../../utils\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { usePanEvent } from \"../../hooks/use-pan-event\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  clampNumber,\n  cx,\n  dataAttr,\n  handlerAll,\n  isArray,\n  isNumber,\n  mergeRefs,\n  percentToValue,\n  roundNumberToStep,\n  runKeyAction,\n  valueToPercent,\n  visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nexport interface UseSliderProps<Y extends [number, number] | number = number>\n  extends\n    Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"ref\">,\n    HTMLRefAttributes<\"input\">,\n    FieldProps {\n  /**\n   * The minimum distance between slider thumbs.\n   * Useful for preventing the thumbs from being too close together.\n   *\n   * @default 0\n   */\n  betweenThumbs?: number\n  /**\n   * The initial value of the slider.\n   */\n  defaultValue?: Y\n  /**\n   * The base `id` to use for the slider.\n   */\n  id?: string\n  /**\n   * The maximum allowed value of the slider. Cannot be less than min.\n   *\n   * @default 100\n   */\n  max?: number\n  /**\n   * The minimum allowed value of the slider. Cannot be greater than max.\n   *\n   * @default 0\n   */\n  min?: number\n  /**\n   * The name attribute of the hidden `input` field.\n   * This is particularly useful in forms.\n   */\n  name?: string\n  /**\n   * The orientation of the slider.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * The step in which increments or decrements have to be made.\n   *\n   * @default 1\n   */\n  step?: number\n  /**\n   * The value of the slider.\n   */\n  value?: Y\n  /**\n   * This is used to format the value so that screen readers\n   * can speak out a more human-friendly value.\n   *\n   * It is used to set the `aria-valuetext` property of the input.\n   */\n  getAriaValueText?: (value: number, index: number) => string | undefined\n  /**\n   * Function called whenever the slider value changes.\n   */\n  onChange?: (value: Y) => void\n  /**\n   * Function called when the user is done selecting a new value.\n   */\n  onChangeEnd?: (value: Y) => void\n  /**\n   * Function called when the user starts selecting a new value.\n   */\n  onChangeStart?: (value: Y) => void\n}\n\nexport const useSlider = <Y extends [number, number] | number = number>(\n  props: UseSliderProps<Y> = {},\n) => {\n  const {\n    props: {\n      id,\n      ref,\n      name,\n      \"aria-labelledby\": ariaLabelledBy,\n      \"aria-valuetext\": ariaValueText,\n      betweenThumbs = 0,\n      defaultValue = 0 as Y,\n      disabled,\n      getAriaValueText,\n      max = 100,\n      min = 0,\n      orientation = \"horizontal\",\n      readOnly,\n      required,\n      step = 1,\n      value: valueProp,\n      onChange: onChangeProp,\n      onChangeEnd,\n      onChangeStart,\n      ...rest\n    },\n    ariaProps,\n    dataProps,\n    eventProps,\n  } = useFieldProps(props)\n  const [value, setValue] = useControllableState({\n    defaultValue,\n    value: valueProp,\n    onChange: onChangeProp,\n  })\n  const { t } = useI18n(\"slider\")\n  const currentIndex = useRef(0)\n  const interactive = !(disabled || readOnly)\n  const [_, getPanEventProps] = usePanEvent<HTMLDivElement>({\n    onEnd: (_, point, rect) => {\n      if (!interactive) return\n\n      const panValue = getPanValue(point, rect)\n\n      if (range) {\n        const start = currentIndex.current === 0\n        const oppositeIndex = currentIndex.current === 0 ? 1 : 0\n        const oppositeValue = value[oppositeIndex]\n\n        onChangeEnd?.(\n          (start ? [panValue, oppositeValue] : [oppositeValue, panValue]) as Y,\n        )\n      } else {\n        onChangeEnd?.(panValue as Y)\n      }\n    },\n    onMove: (_, point, rect) => {\n      if (!interactive) return\n\n      const panValue = getPanValue(point, rect)\n\n      onChange(currentIndex.current, panValue)\n    },\n    onStart: (_, point, rect) => {\n      if (!interactive) return\n\n      const panValue = getPanValue(point, rect)\n\n      if (range) {\n        const distances = value.map((value) => Math.abs(value - panValue))\n        const closest = Math.min(...distances)\n        const index = distances.indexOf(closest)\n\n        currentIndex.current = index\n\n        const start = index === 0\n        const oppositeIndex = index === 0 ? 1 : 0\n        const oppositeValue = value[oppositeIndex]\n\n        onChangeStart?.(\n          (start ? [panValue, oppositeValue] : [oppositeValue, panValue]) as Y,\n        )\n      } else {\n        currentIndex.current = 0\n\n        onChangeStart?.(value as Y)\n      }\n\n      onChange(currentIndex.current, panValue)\n    },\n  })\n  const range = !isNumber(value)\n  const percent = (\n    range\n      ? value.map((value) => valueToPercent(value, min, max))\n      : valueToPercent(value, min, max)\n  ) as Y extends number ? number : number[]\n  const tenStep = (max - min) / 10\n  const oneStep = step || (max - min) / 100\n\n  if (max < min) console.warn(\"Do not assign a number less than 'min' to 'max'\")\n\n  const getMinMax = useCallback(\n    (index: number) => {\n      const start = index === 0\n      const oppositeIndex = index === 0 ? 1 : 0\n      const oppositeValue = range ? value[oppositeIndex] : value\n\n      return {\n        max: range ? (start ? oppositeValue - betweenThumbs : max) : max,\n        min: range ? (start ? min : oppositeValue + betweenThumbs) : min,\n      }\n    },\n    [betweenThumbs, max, min, range, value],\n  )\n\n  const getPanValue = useCallback(\n    ({ x, y }: Point, { bottom, height, left, width }: DOMRect) => {\n      const diff = orientation === \"horizontal\" ? x - left : bottom - y\n      const length = orientation === \"horizontal\" ? width : height\n      const percent = diff / length\n\n      let nextValue = percentToValue(percent, min, max)\n\n      nextValue = parseFloat(roundNumberToStep(nextValue, min, step))\n      nextValue = clampNumber(nextValue, min, max)\n\n      return nextValue\n    },\n    [orientation, min, max, step],\n  )\n\n  const onChange = useCallback(\n    (index: number, value: number) => {\n      if (!interactive) return\n\n      const { max, min } = getMinMax(index)\n\n      value = parseFloat(roundNumberToStep(value, min, oneStep))\n      value = clampNumber(value, min, max)\n\n      setValue((prev) => {\n        if (isArray(prev)) {\n          const next = [...prev]\n\n          next[index] = value\n\n          return next as Y\n        } else {\n          return value as Y\n        }\n      })\n    },\n    [getMinMax, interactive, oneStep, setValue],\n  )\n\n  const stepUp = useCallback(\n    (index: number, step = oneStep) =>\n      range\n        ? onChange(index, value[index]! + step)\n        : onChange(index, value + step),\n    [oneStep, range, onChange, value],\n  )\n\n  const stepDown = useCallback(\n    (index: number, step = oneStep) =>\n      range\n        ? onChange(index, value[index]! - step)\n        : onChange(index, value - step),\n    [oneStep, range, onChange, value],\n  )\n\n  const onKeyDown = useCallback(\n    (index: number) => (ev: KeyboardEvent<HTMLDivElement>) => {\n      const { max, min } = getMinMax(index)\n\n      runKeyAction(ev, {\n        ArrowDown: () => stepDown(index),\n        ArrowLeft: () => stepDown(index),\n        ArrowRight: () => stepUp(index),\n        ArrowUp: () => stepUp(index),\n        End: () => onChange(index, max),\n        Home: () => onChange(index, min),\n        PageDown: () => stepDown(index, tenStep),\n        PageUp: () => stepUp(index, tenStep),\n      })\n    },\n    [getMinMax, onChange, stepDown, stepUp, tenStep],\n  )\n\n  const getRootProps: PropGetter = useCallback(\n    (props = {}) => {\n      const computedProps: HTMLProps = mergeProps(\n        dataProps,\n        { \"data-orientation\": orientation },\n        rest,\n        props,\n        { onBlur: eventProps.onBlur, onFocus: eventProps.onFocus },\n      )()\n\n      computedProps.style ??= {}\n\n      if (isArray(percent)) {\n        computedProps.style[\"--range-start\"] = `${Math.abs(percent[0]!)}%`\n        computedProps.style[\"--range-end\"] = `${Math.abs(percent[1]!)}%`\n      } else {\n        computedProps.style[\"--range-start\"] = \"0%\"\n        computedProps.style[\"--range-end\"] = `${Math.abs(percent)}%`\n      }\n\n      return computedProps\n    },\n    [dataProps, eventProps, orientation, percent, rest],\n  )\n\n  const getInputProps: PropGetter<\"input\", { index?: number }> = useCallback(\n    ({ index = 0, ...props } = {}) => ({\n      ...visuallyHiddenAttributes,\n      ...dataProps,\n      ...ariaProps,\n      id,\n      type: \"hidden\",\n      name,\n      disabled,\n      readOnly,\n      required,\n      value: range ? value[index]! : value,\n      ...props,\n      ref: index === 0 ? mergeRefs(props.ref, ref) : props.ref,\n    }),\n    [\n      dataProps,\n      ariaProps,\n      id,\n      name,\n      disabled,\n      readOnly,\n      required,\n      range,\n      value,\n      ref,\n    ],\n  )\n\n  const getTrackProps: PropGetter = useCallback(\n    (props) =>\n      getPanEventProps({\n        ...dataProps,\n        \"data-orientation\": orientation,\n        ...props,\n      }),\n    [dataProps, getPanEventProps, orientation],\n  )\n\n  const getRangeProps: PropGetter = useCallback(\n    (props) => ({\n      ...dataProps,\n      \"data-orientation\": orientation,\n      \"data-range\": dataAttr(range),\n      ...props,\n    }),\n    [dataProps, orientation, range],\n  )\n\n  const getMarkProps: RequiredPropGetter<\"div\", { value: number }> =\n    useCallback(\n      ({ style, value: valueProp, ...props }) => {\n        const between = range\n          ? value[0] < valueProp && valueProp < value[1]\n          : valueProp < value\n        const percent = valueToPercent(valueProp, min, max)\n\n        return {\n          ...dataProps,\n          \"aria-hidden\": true,\n          \"data-between\": dataAttr(between),\n          \"data-orientation\": orientation,\n          role: \"presentation\",\n          ...props,\n          style: { ...style, \"--mark-position\": `${percent}%` },\n        }\n      },\n      [dataProps, max, min, orientation, range, value],\n    )\n\n  const getThumbProps: PropGetter<\"div\", { index?: number }> = useCallback(\n    ({ index = 0, ...rest } = {}) => {\n      const { max, min } = getMinMax(index)\n\n      const props: HTMLProps = {\n        ...dataProps,\n        ...ariaProps,\n        \"aria-label\": t(\"Slider thumb\"),\n        \"aria-orientation\": orientation,\n        \"aria-valuemax\": max,\n        \"aria-valuemin\": min,\n        role: \"slider\",\n        tabIndex: interactive ? 0 : -1,\n        ...rest,\n        \"aria-labelledby\": cx(rest[\"aria-labelledby\"], ariaLabelledBy),\n        onKeyDown: handlerAll(rest.onKeyDown, onKeyDown(index)),\n      }\n\n      if (range) {\n        const currentValue = value[index]!\n\n        props[\"data-start\"] = dataAttr(index === 0)\n        props[\"data-end\"] = dataAttr(index === 1)\n        props[\"aria-valuenow\"] = currentValue\n        props[\"aria-valuetext\"] =\n          ariaValueText ??\n          getAriaValueText?.(currentValue, index) ??\n          currentValue.toString()\n      } else {\n        props[\"data-end\"] = dataAttr(index === 0)\n        props[\"aria-valuenow\"] = value\n        props[\"aria-valuetext\"] =\n          ariaValueText ?? getAriaValueText?.(value, index) ?? value.toString()\n      }\n\n      return props\n    },\n    [\n      t,\n      ariaLabelledBy,\n      ariaProps,\n      ariaValueText,\n      dataProps,\n      getAriaValueText,\n      getMinMax,\n      interactive,\n      onKeyDown,\n      orientation,\n      range,\n      value,\n    ],\n  )\n\n  return {\n    percent,\n    range,\n    setValue,\n    stepDown,\n    stepUp,\n    value,\n    getInputProps,\n    getMarkProps,\n    getRangeProps,\n    getRootProps,\n    getThumbProps,\n    getTrackProps,\n    onChange,\n  }\n}\n\nexport type UseSliderReturn = ReturnType<typeof useSlider>\n"],"mappings":"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"}

package/dist/esm/components/slot/slot.js.map

@@ -1 +1 @@
-{"version":3,"file":"slot.js","names":[],"sources":["../../../../src/components/slot/slot.tsx"],"sourcesContent":["import type {\n  FC,\n  HTMLAttributes,\n  PropsWithChildren,\n  RefAttributes,\n} from \"react\"\nimport { Children, cloneElement, isValidElement } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useFindChild, useValidChildren } from \"../../utils\"\n\nexport interface SlotProps\n  extends\n    HTMLAttributes<HTMLElement>,\n    RefAttributes<HTMLElement>,\n    PropsWithChildren {}\n\n/**\n * `Slot` is a component that merges its props onto its immediate child.\n *\n * @see https://yamada-ui.com/docs/components/slot\n */\nexport const Slot: FC<SlotProps> = ({ children, ...rest }) => {\n  const validChildren = useValidChildren(children)\n  const slottable = useFindChild(validChildren, Slottable)\n\n  if (slottable) {\n    const newElement = slottable.props.children\n\n    const newChildren = validChildren.map((child) => {\n      if (child === slottable) {\n        if (Children.count(newElement) > 1) return Children.only(null)\n        return isValidElement<PropsWithChildren>(newElement)\n          ? newElement.props.children\n          : null\n      } else {\n        return child\n      }\n    })\n\n    return (\n      <SlotClone {...rest}>\n        {isValidElement(newElement)\n          ? cloneElement(newElement, undefined, newChildren)\n          : null}\n      </SlotClone>\n    )\n  }\n\n  return <SlotClone {...rest}>{children}</SlotClone>\n}\n\ninterface SlotCloneProps\n  extends RefAttributes<HTMLElement>, PropsWithChildren {}\n\nconst SlotClone: FC<SlotCloneProps> = ({ children, ...rest }) => {\n  if (isValidElement<RefAttributes<HTMLElement>>(children))\n    return cloneElement(children, mergeProps(rest, children.props)())\n\n  return Children.count(children) > 1 ? Children.only(null) : null\n}\n\nexport const Slottable: FC<PropsWithChildren> = ({ children }) => {\n  // eslint-disable-next-line react/jsx-no-useless-fragment\n  return <>{children}</>\n}\n"],"mappings":";;;;;;;;;;AAqBA,MAAa,QAAuB,EAAE,UAAU,GAAG,WAAW;CAC5D,MAAM,gBAAgB,iBAAiB,SAAS;CAChD,MAAM,YAAY,aAAa,eAAe,UAAU;CAExD,IAAI,WAAW;EACb,MAAM,aAAa,UAAU,MAAM;EAEnC,MAAM,cAAc,cAAc,KAAK,UAAU;GAC/C,IAAI,UAAU,WAAW;IACvB,IAAI,SAAS,MAAM,WAAW,GAAG,GAAG,OAAO,SAAS,KAAK,KAAK;IAC9D,OAAO,eAAkC,WAAW,GAChD,WAAW,MAAM,WACjB;UAEJ,OAAO;IAET;EAEF,OACE,oBAAC,WAAD;GAAW,GAAI;aACZ,eAAe,WAAW,GACvB,aAAa,YAAY,KAAA,GAAW,YAAY,GAChD;GACM,CAAA;;CAIhB,OAAO,oBAAC,WAAD;EAAW,GAAI;EAAO;EAAqB,CAAA;;AAMpD,MAAM,aAAiC,EAAE,UAAU,GAAG,WAAW;CAC/D,IAAI,eAA2C,SAAS,EACtD,OAAO,aAAa,UAAU,WAAW,MAAM,SAAS,MAAM,EAAE,CAAC;CAEnE,OAAO,SAAS,MAAM,SAAS,GAAG,IAAI,SAAS,KAAK,KAAK,GAAG;;AAG9D,MAAa,aAAoC,EAAE,eAAe;CAEhE,OAAO,oBAAA,YAAA,EAAG,UAAY,CAAA"}
+{"version":3,"file":"slot.js","names":[],"sources":["../../../../src/components/slot/slot.tsx"],"sourcesContent":["import type {\n  FC,\n  HTMLAttributes,\n  PropsWithChildren,\n  RefAttributes,\n} from \"react\"\nimport { Children, cloneElement, isValidElement } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useFindChild, useValidChildren } from \"../../utils\"\n\nexport interface SlotProps\n  extends\n    HTMLAttributes<HTMLElement>,\n    RefAttributes<HTMLElement>,\n    PropsWithChildren {}\n\n/**\n * `Slot` is a component that merges its props onto its immediate child.\n *\n * @see https://yamada-ui.com/docs/components/slot\n */\nexport const Slot: FC<SlotProps> = ({ children, ...rest }) => {\n  const validChildren = useValidChildren(children)\n  const slottable = useFindChild(validChildren, Slottable)\n\n  if (slottable) {\n    const newElement = slottable.props.children\n\n    const newChildren = validChildren.map((child) => {\n      if (child === slottable) {\n        if (Children.count(newElement) > 1) return Children.only(null)\n        return isValidElement<PropsWithChildren>(newElement)\n          ? newElement.props.children\n          : null\n      } else {\n        return child\n      }\n    })\n\n    return (\n      <SlotClone {...rest}>\n        {isValidElement(newElement)\n          ? cloneElement(newElement, undefined, newChildren)\n          : null}\n      </SlotClone>\n    )\n  }\n\n  return <SlotClone {...rest}>{children}</SlotClone>\n}\n\ninterface SlotCloneProps\n  extends RefAttributes<HTMLElement>, PropsWithChildren {}\n\nconst SlotClone: FC<SlotCloneProps> = ({ children, ...rest }) => {\n  if (isValidElement<RefAttributes<HTMLElement>>(children))\n    return cloneElement(children, mergeProps(rest, children.props)())\n\n  return Children.count(children) > 1 ? Children.only(null) : null\n}\n\nexport const Slottable: FC<PropsWithChildren> = ({ children }) => {\n  // eslint-disable-next-line react/jsx-no-useless-fragment\n  return <>{children}</>\n}\n"],"mappings":";;;;;;;;;;AAqBA,MAAa,QAAuB,EAAE,UAAU,GAAG,WAAW;CAC5D,MAAM,gBAAgB,iBAAiB,QAAQ;CAC/C,MAAM,YAAY,aAAa,eAAe,SAAS;CAEvD,IAAI,WAAW;EACb,MAAM,aAAa,UAAU,MAAM;EAEnC,MAAM,cAAc,cAAc,KAAK,UAAU;GAC/C,IAAI,UAAU,WAAW;IACvB,IAAI,SAAS,MAAM,UAAU,IAAI,GAAG,OAAO,SAAS,KAAK,IAAI;IAC7D,OAAO,eAAkC,UAAU,IAC/C,WAAW,MAAM,WACjB;GACN,OACE,OAAO;EAEX,CAAC;EAED,OACE,oBAAC,WAAD;GAAW,GAAI;aACZ,eAAe,UAAU,IACtB,aAAa,YAAY,KAAA,GAAW,WAAW,IAC/C;EACK,CAAA;CAEf;CAEA,OAAO,oBAAC,WAAD;EAAW,GAAI;EAAO;CAAoB,CAAA;AACnD;AAKA,MAAM,aAAiC,EAAE,UAAU,GAAG,WAAW;CAC/D,IAAI,eAA2C,QAAQ,GACrD,OAAO,aAAa,UAAU,WAAW,MAAM,SAAS,KAAK,EAAE,CAAC;CAElE,OAAO,SAAS,MAAM,QAAQ,IAAI,IAAI,SAAS,KAAK,IAAI,IAAI;AAC9D;AAEA,MAAa,aAAoC,EAAE,eAAe;CAEhE,OAAO,oBAAA,YAAA,EAAG,SAAW,CAAA;AACvB"}

package/dist/esm/components/snacks/snacks.js.map

@@ -1 +1 @@
-{"version":3,"file":"snacks.js","names":["motion","noop","Alert.Root","Alert.Loading","Alert.Icon","Alert.Title","Alert.Description"],"sources":["../../../../src/components/snacks/snacks.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Dispatch, RefObject, SetStateAction } from \"react\"\nimport type { CSSProps, HTMLStyledProps, SimpleDirection } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { CloseButtonProps } from \"../close-button\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { SnacksStyle } from \"./snacks.style\"\nimport type { Snack, UseSnacksReturn } from \"./use-snacks\"\nimport { AnimatePresence, useIsPresent } from \"motion/react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\nimport { createSlotComponent, varAttr } from \"../../core\"\nimport { useTimeout } from \"../../hooks/use-timeout\"\nimport { dataAttr, handlerAll, noop, useUpdateEffect } from \"../../utils\"\nimport { Alert } from \"../alert\"\nimport { CloseButton } from \"../close-button\"\nimport { createTransition, motion } from \"../motion\"\nimport { snacksStyle } from \"./snacks.style\"\n\ninterface ComponentContext {\n  direction: SimpleDirection\n  elMapRef: RefObject<Map<number, HTMLDivElement | null>>\n  setExist: Dispatch<SetStateAction<boolean>>\n  startIndex: number\n}\n\nexport interface SnacksProps extends HTMLMotionProps {\n  /**\n   * The snacks created by `useSnacks`.\n   */\n  snacks: UseSnacksReturn[\"snacks\"]\n  /**\n   * The CSS `gap` property.\n   *\n   * @default 'md'\n   */\n  gap?: CSSProps[\"gap\"]\n  /**\n   * A property that provides spacing between the top and bottom.\n   *\n   * @default [0, \"lg\"]\n   */\n  gutter?: [CSSProps[\"paddingTop\"], CSSProps[\"paddingBottom\"]]\n  /**\n   * If `true`, apply gutter value to negative margins\n   *\n   * @default true\n   */\n  negativeMargins?: boolean\n  /**\n   * Props for the snacks list element.\n   */\n  listProps?: HTMLMotionProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: SnacksPropsContext,\n  useComponentContext,\n  usePropsContext: useSnacksPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<SnacksProps, SnacksStyle, ComponentContext>(\n  \"snacks\",\n  snacksStyle,\n)\n\nexport { SnacksPropsContext, useSnacksPropsContext }\n\nexport const Snacks = withProvider<\"div\", SnacksProps>(\n  ({\n    snacks: { direction = \"start\", items, startIndex = 0 },\n    listProps,\n    ...rest\n  }) => {\n    const count = items.length\n    const elMapRef = useRef<Map<number, HTMLDivElement | null>>(new Map())\n    const [height, setHeight] = useState(0)\n    const [exist, setExist] = useState(!!count)\n    const show = !!count || exist\n    const context = useMemo(\n      () => ({ direction, elMapRef, setExist, startIndex }),\n      [direction, startIndex],\n    )\n\n    const onExitComplete = useCallback(() => {\n      if (!count) setExist(false)\n    }, [count])\n\n    useEffect(() => {\n      let height = 0\n\n      if (!count) return\n\n      const els = [...elMapRef.current.values()].slice(0, count)\n\n      for (const el of els) {\n        if (!el) continue\n\n        let { offsetHeight, offsetTop } = el\n\n        offsetHeight += offsetTop\n\n        if (offsetHeight > height) height = offsetHeight\n      }\n\n      setHeight(height)\n    }, [count, direction])\n\n    useUpdateEffect(() => {\n      if (count) setExist(true)\n    }, [count])\n\n    return (\n      <ComponentContext value={context}>\n        <AnimatePresence initial={false}>\n          {show ? (\n            <motion.div {...rest}>\n              <SnackList custom={{ height }} {...listProps}>\n                <AnimatePresence onExitComplete={onExitComplete}>\n                  {items.map((props, index) => {\n                    return (\n                      <Snack\n                        key={props.id}\n                        index={index}\n                        lastIndex={count - index - 1}\n                        {...props}\n                      />\n                    )\n                  })}\n                </AnimatePresence>\n              </SnackList>\n            </motion.div>\n          ) : null}\n        </AnimatePresence>\n      </ComponentContext>\n    )\n  },\n  \"root\",\n)(\n  {\n    animate: \"animate\",\n    exit: \"exit\",\n    initial: \"initial\",\n    variants: {\n      animate: {\n        padding: \"var(--top) 0 var(--bottom)\",\n        transition: { duration: 0.4 },\n      },\n      exit: { padding: 0 },\n      initial: { padding: 0 },\n    },\n  },\n  ({ gap, gutter = [0, \"lg\"], negativeMargins = true, ...rest }) => ({\n    \"data-negative\": dataAttr(negativeMargins),\n    \"--bottom\": varAttr(gutter[1], \"spaces\", \"0px\"),\n    \"--gap\": varAttr(gap, \"spaces\"),\n    \"--top\": varAttr(gutter[0], \"spaces\", \"0px\"),\n    ...rest,\n  }),\n)\n\ninterface SnackListProps extends HTMLMotionProps {}\n\nconst SnackList = withContext<\"div\", SnackListProps>(\n  motion.div,\n  \"list\",\n)({\n  animate: \"animate\",\n  exit: \"exit\",\n  initial: \"initial\",\n  role: \"list\",\n  variants: {\n    animate: ({ height }) => ({\n      height,\n      opacity: 1,\n      transition: { duration: 0.4 },\n    }),\n    exit: { height: 0, opacity: 0 },\n    initial: { height: 0, opacity: 1 },\n  },\n})\n\ninterface SnackProps extends Merge<\n  HTMLMotionProps,\n  Merge<Alert.RootProps, Snack>\n> {\n  index: number\n  lastIndex: number\n}\n\nconst Snack = withContext<\"div\", SnackProps>(\n  ({\n    variant = \"plain\",\n    closable = true,\n    description,\n    duration: durationProp = null,\n    loadingScheme,\n    status,\n    title,\n    withIcon = true,\n    closeButtonProps,\n    contentProps,\n    descriptionProps,\n    iconProps,\n    loadingProps,\n    titleProps,\n    onClose: onCloseProp,\n    onCloseComplete,\n    ...rest\n  }) => {\n    const [duration, setDuration] = useState(durationProp)\n    const present = useIsPresent()\n    const onClose = present ? onCloseProp : noop\n\n    const onMouseEnter = useCallback(() => {\n      setDuration(null)\n    }, [])\n\n    const onMouseLeave = useCallback(() => {\n      setDuration(durationProp)\n    }, [durationProp])\n\n    useUpdateEffect(() => {\n      if (!present) onCloseComplete?.()\n    }, [present])\n\n    useUpdateEffect(() => {\n      setDuration(durationProp)\n    }, [durationProp])\n\n    useTimeout(onClose, duration)\n\n    return (\n      <Alert.Root\n        as={motion.div}\n        variant={variant}\n        status={status}\n        {...rest}\n        onMouseEnter={handlerAll(rest.onMouseEnter, onMouseEnter)}\n        onMouseLeave={handlerAll(rest.onMouseLeave, onMouseLeave)}\n      >\n        {withIcon ? (\n          loadingScheme ? (\n            <Alert.Loading loadingScheme={loadingScheme} {...loadingProps} />\n          ) : (\n            <Alert.Icon {...iconProps} />\n          )\n        ) : null}\n\n        <SnackContent data-close-button={dataAttr(closable)} {...contentProps}>\n          {title ? (\n            <Alert.Title me=\"0\" {...titleProps}>\n              {title}\n            </Alert.Title>\n          ) : null}\n\n          {description ? (\n            <Alert.Description {...descriptionProps}>\n              {description}\n            </Alert.Description>\n          ) : null}\n        </SnackContent>\n\n        {closable ? (\n          <SnackCloseButton\n            data-variant={variant}\n            {...closeButtonProps}\n            onClick={handlerAll(closeButtonProps?.onClick, onClose)}\n          />\n        ) : null}\n      </Alert.Root>\n    )\n  },\n  \"item\",\n)(\n  {\n    animate: \"animate\",\n    exit: \"exit\",\n    initial: \"initial\",\n    layout: true,\n    role: \"listitem\",\n    variants: {\n      animate: ({ index }) => ({\n        opacity: 1,\n        transition: createTransition.enter()(!index ? 0.2 : 0, 0.4),\n        y: 0,\n      }),\n      exit: {\n        opacity: 0,\n        transition: createTransition.exit()(undefined, 0.2),\n      },\n      initial: ({ direction, index }) => ({\n        opacity: 0,\n        ...(index ? { y: (direction === \"start\" ? -1 : 1) * 16 } : {}),\n      }),\n    },\n  },\n  ({ index, lastIndex, ...rest }) => {\n    const ref = useRef<HTMLDivElement>(null)\n    const { direction, elMapRef, startIndex } = useComponentContext()\n\n    useEffect(() => {\n      const elMap = elMapRef.current\n\n      elMap.set(index, ref.current)\n\n      return () => {\n        elMap.delete(index)\n      }\n    }, [elMapRef, index])\n\n    return {\n      ref,\n      \"--index\": direction === \"start\" ? lastIndex : index,\n      \"--z-index\": startIndex + index,\n      custom: { direction, index },\n      ...rest,\n    }\n  },\n)\n\nexport interface SnackContentProps extends HTMLStyledProps {}\n\nconst SnackContent = withContext<\"div\", SnackContentProps>(\"div\", \"content\")()\n\nexport interface SnackCloseButtonProps extends CloseButtonProps {}\n\nconst SnackCloseButton = withContext<\"button\", SnackCloseButtonProps>(\n  CloseButton,\n  \"closeButton\",\n)()\n"],"mappings":"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"}
+{"version":3,"file":"snacks.js","names":["motion","noop","Alert.Root","Alert.Loading","Alert.Icon","Alert.Title","Alert.Description"],"sources":["../../../../src/components/snacks/snacks.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Dispatch, RefObject, SetStateAction } from \"react\"\nimport type { CSSProps, HTMLStyledProps, SimpleDirection } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { CloseButtonProps } from \"../close-button\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { SnacksStyle } from \"./snacks.style\"\nimport type { Snack, UseSnacksReturn } from \"./use-snacks\"\nimport { AnimatePresence, useIsPresent } from \"motion/react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\nimport { createSlotComponent, varAttr } from \"../../core\"\nimport { useTimeout } from \"../../hooks/use-timeout\"\nimport { dataAttr, handlerAll, noop, useUpdateEffect } from \"../../utils\"\nimport { Alert } from \"../alert\"\nimport { CloseButton } from \"../close-button\"\nimport { createTransition, motion } from \"../motion\"\nimport { snacksStyle } from \"./snacks.style\"\n\ninterface ComponentContext {\n  direction: SimpleDirection\n  elMapRef: RefObject<Map<number, HTMLDivElement | null>>\n  setExist: Dispatch<SetStateAction<boolean>>\n  startIndex: number\n}\n\nexport interface SnacksProps extends HTMLMotionProps {\n  /**\n   * The snacks created by `useSnacks`.\n   */\n  snacks: UseSnacksReturn[\"snacks\"]\n  /**\n   * The CSS `gap` property.\n   *\n   * @default 'md'\n   */\n  gap?: CSSProps[\"gap\"]\n  /**\n   * A property that provides spacing between the top and bottom.\n   *\n   * @default [0, \"lg\"]\n   */\n  gutter?: [CSSProps[\"paddingTop\"], CSSProps[\"paddingBottom\"]]\n  /**\n   * If `true`, apply gutter value to negative margins\n   *\n   * @default true\n   */\n  negativeMargins?: boolean\n  /**\n   * Props for the snacks list element.\n   */\n  listProps?: HTMLMotionProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: SnacksPropsContext,\n  useComponentContext,\n  usePropsContext: useSnacksPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<SnacksProps, SnacksStyle, ComponentContext>(\n  \"snacks\",\n  snacksStyle,\n)\n\nexport { SnacksPropsContext, useSnacksPropsContext }\n\nexport const Snacks = withProvider<\"div\", SnacksProps>(\n  ({\n    snacks: { direction = \"start\", items, startIndex = 0 },\n    listProps,\n    ...rest\n  }) => {\n    const count = items.length\n    const elMapRef = useRef<Map<number, HTMLDivElement | null>>(new Map())\n    const [height, setHeight] = useState(0)\n    const [exist, setExist] = useState(!!count)\n    const show = !!count || exist\n    const context = useMemo(\n      () => ({ direction, elMapRef, setExist, startIndex }),\n      [direction, startIndex],\n    )\n\n    const onExitComplete = useCallback(() => {\n      if (!count) setExist(false)\n    }, [count])\n\n    useEffect(() => {\n      let height = 0\n\n      if (!count) return\n\n      const els = [...elMapRef.current.values()].slice(0, count)\n\n      for (const el of els) {\n        if (!el) continue\n\n        let { offsetHeight, offsetTop } = el\n\n        offsetHeight += offsetTop\n\n        if (offsetHeight > height) height = offsetHeight\n      }\n\n      setHeight(height)\n    }, [count, direction])\n\n    useUpdateEffect(() => {\n      if (count) setExist(true)\n    }, [count])\n\n    return (\n      <ComponentContext value={context}>\n        <AnimatePresence initial={false}>\n          {show ? (\n            <motion.div {...rest}>\n              <SnackList custom={{ height }} {...listProps}>\n                <AnimatePresence onExitComplete={onExitComplete}>\n                  {items.map((props, index) => {\n                    return (\n                      <Snack\n                        key={props.id}\n                        index={index}\n                        lastIndex={count - index - 1}\n                        {...props}\n                      />\n                    )\n                  })}\n                </AnimatePresence>\n              </SnackList>\n            </motion.div>\n          ) : null}\n        </AnimatePresence>\n      </ComponentContext>\n    )\n  },\n  \"root\",\n)(\n  {\n    animate: \"animate\",\n    exit: \"exit\",\n    initial: \"initial\",\n    variants: {\n      animate: {\n        padding: \"var(--top) 0 var(--bottom)\",\n        transition: { duration: 0.4 },\n      },\n      exit: { padding: 0 },\n      initial: { padding: 0 },\n    },\n  },\n  ({ gap, gutter = [0, \"lg\"], negativeMargins = true, ...rest }) => ({\n    \"data-negative\": dataAttr(negativeMargins),\n    \"--bottom\": varAttr(gutter[1], \"spaces\", \"0px\"),\n    \"--gap\": varAttr(gap, \"spaces\"),\n    \"--top\": varAttr(gutter[0], \"spaces\", \"0px\"),\n    ...rest,\n  }),\n)\n\ninterface SnackListProps extends HTMLMotionProps {}\n\nconst SnackList = withContext<\"div\", SnackListProps>(\n  motion.div,\n  \"list\",\n)({\n  animate: \"animate\",\n  exit: \"exit\",\n  initial: \"initial\",\n  role: \"list\",\n  variants: {\n    animate: ({ height }) => ({\n      height,\n      opacity: 1,\n      transition: { duration: 0.4 },\n    }),\n    exit: { height: 0, opacity: 0 },\n    initial: { height: 0, opacity: 1 },\n  },\n})\n\ninterface SnackProps extends Merge<\n  HTMLMotionProps,\n  Merge<Alert.RootProps, Snack>\n> {\n  index: number\n  lastIndex: number\n}\n\nconst Snack = withContext<\"div\", SnackProps>(\n  ({\n    variant = \"plain\",\n    closable = true,\n    description,\n    duration: durationProp = null,\n    loadingScheme,\n    status,\n    title,\n    withIcon = true,\n    closeButtonProps,\n    contentProps,\n    descriptionProps,\n    iconProps,\n    loadingProps,\n    titleProps,\n    onClose: onCloseProp,\n    onCloseComplete,\n    ...rest\n  }) => {\n    const [duration, setDuration] = useState(durationProp)\n    const present = useIsPresent()\n    const onClose = present ? onCloseProp : noop\n\n    const onMouseEnter = useCallback(() => {\n      setDuration(null)\n    }, [])\n\n    const onMouseLeave = useCallback(() => {\n      setDuration(durationProp)\n    }, [durationProp])\n\n    useUpdateEffect(() => {\n      if (!present) onCloseComplete?.()\n    }, [present])\n\n    useUpdateEffect(() => {\n      setDuration(durationProp)\n    }, [durationProp])\n\n    useTimeout(onClose, duration)\n\n    return (\n      <Alert.Root\n        as={motion.div}\n        variant={variant}\n        status={status}\n        {...rest}\n        onMouseEnter={handlerAll(rest.onMouseEnter, onMouseEnter)}\n        onMouseLeave={handlerAll(rest.onMouseLeave, onMouseLeave)}\n      >\n        {withIcon ? (\n          loadingScheme ? (\n            <Alert.Loading loadingScheme={loadingScheme} {...loadingProps} />\n          ) : (\n            <Alert.Icon {...iconProps} />\n          )\n        ) : null}\n\n        <SnackContent data-close-button={dataAttr(closable)} {...contentProps}>\n          {title ? (\n            <Alert.Title me=\"0\" {...titleProps}>\n              {title}\n            </Alert.Title>\n          ) : null}\n\n          {description ? (\n            <Alert.Description {...descriptionProps}>\n              {description}\n            </Alert.Description>\n          ) : null}\n        </SnackContent>\n\n        {closable ? (\n          <SnackCloseButton\n            data-variant={variant}\n            {...closeButtonProps}\n            onClick={handlerAll(closeButtonProps?.onClick, onClose)}\n          />\n        ) : null}\n      </Alert.Root>\n    )\n  },\n  \"item\",\n)(\n  {\n    animate: \"animate\",\n    exit: \"exit\",\n    initial: \"initial\",\n    layout: true,\n    role: \"listitem\",\n    variants: {\n      animate: ({ index }) => ({\n        opacity: 1,\n        transition: createTransition.enter()(!index ? 0.2 : 0, 0.4),\n        y: 0,\n      }),\n      exit: {\n        opacity: 0,\n        transition: createTransition.exit()(undefined, 0.2),\n      },\n      initial: ({ direction, index }) => ({\n        opacity: 0,\n        ...(index ? { y: (direction === \"start\" ? -1 : 1) * 16 } : {}),\n      }),\n    },\n  },\n  ({ index, lastIndex, ...rest }) => {\n    const ref = useRef<HTMLDivElement>(null)\n    const { direction, elMapRef, startIndex } = useComponentContext()\n\n    useEffect(() => {\n      const elMap = elMapRef.current\n\n      elMap.set(index, ref.current)\n\n      return () => {\n        elMap.delete(index)\n      }\n    }, [elMapRef, index])\n\n    return {\n      ref,\n      \"--index\": direction === \"start\" ? lastIndex : index,\n      \"--z-index\": startIndex + index,\n      custom: { direction, index },\n      ...rest,\n    }\n  },\n)\n\nexport interface SnackContentProps extends HTMLStyledProps {}\n\nconst SnackContent = withContext<\"div\", SnackContentProps>(\"div\", \"content\")()\n\nexport interface SnackCloseButtonProps extends CloseButtonProps {}\n\nconst SnackCloseButton = withContext<\"button\", SnackCloseButtonProps>(\n  CloseButton,\n  \"closeButton\",\n)()\n"],"mappings":";;;;;;;;;;;;;;;AAuDA,MAAM,EACJ,kBACA,cAAc,oBACd,qBACA,iBAAiB,uBACjB,aACA,iBACE,oBACF,UACA,WACF;AAIA,MAAa,SAAS,cACnB,EACC,QAAQ,EAAE,YAAY,SAAS,OAAO,aAAa,KACnD,WACA,GAAG,WACC;CACJ,MAAM,QAAQ,MAAM;CACpB,MAAM,WAAW,uBAA2C,IAAI,IAAI,CAAC;CACrE,MAAM,CAAC,QAAQ,aAAa,SAAS,CAAC;CACtC,MAAM,CAAC,OAAO,YAAY,SAAS,CAAC,CAAC,KAAK;CAC1C,MAAM,OAAO,CAAC,CAAC,SAAS;CACxB,MAAM,UAAU,eACP;EAAE;EAAW;EAAU;EAAU;CAAW,IACnD,CAAC,WAAW,UAAU,CACxB;CAEA,MAAM,iBAAiB,kBAAkB;EACvC,IAAI,CAAC,OAAO,SAAS,KAAK;CAC5B,GAAG,CAAC,KAAK,CAAC;CAEV,gBAAgB;EACd,IAAI,SAAS;EAEb,IAAI,CAAC,OAAO;EAEZ,MAAM,MAAM,CAAC,GAAG,SAAS,QAAQ,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK;EAEzD,KAAK,MAAM,MAAM,KAAK;GACpB,IAAI,CAAC,IAAI;GAET,IAAI,EAAE,cAAc,cAAc;GAElC,gBAAgB;GAEhB,IAAI,eAAe,QAAQ,SAAS;EACtC;EAEA,UAAU,MAAM;CAClB,GAAG,CAAC,OAAO,SAAS,CAAC;CAErB,sBAAsB;EACpB,IAAI,OAAO,SAAS,IAAI;CAC1B,GAAG,CAAC,KAAK,CAAC;CAEV,OACE,oBAAC,kBAAD;EAAkB,OAAO;YACvB,oBAAC,iBAAD;GAAiB,SAAS;aACvB,OACC,oBAACA,SAAO,KAAR;IAAY,GAAI;cACd,oBAAC,WAAD;KAAW,QAAQ,EAAE,OAAO;KAAG,GAAI;eACjC,oBAAC,iBAAD;MAAiC;gBAC9B,MAAM,KAAK,OAAO,UAAU;OAC3B,OACE,oBAAC,OAAD;QAES;QACP,WAAW,QAAQ,QAAQ;QAC3B,GAAI;OACL,GAJM,MAAM,EAIZ;MAEL,CAAC;KACc,CAAA;IACR,CAAA;GACD,CAAA,IACV;EACW,CAAA;CACD,CAAA;AAEtB,GACA,MACF,EACE;CACE,SAAS;CACT,MAAM;CACN,SAAS;CACT,UAAU;EACR,SAAS;GACP,SAAS;GACT,YAAY,EAAE,UAAU,GAAI;EAC9B;EACA,MAAM,EAAE,SAAS,EAAE;EACnB,SAAS,EAAE,SAAS,EAAE;CACxB;AACF,IACC,EAAE,KAAK,SAAS,CAAC,GAAG,IAAI,GAAG,kBAAkB,MAAM,GAAG,YAAY;CACjE,kBAAA,GAAA,cAAA,UAA0B,eAAe;CACzC,YAAY,QAAQ,OAAO,IAAI,UAAU,KAAK;CAC9C,SAAS,QAAQ,KAAK,QAAQ;CAC9B,SAAS,QAAQ,OAAO,IAAI,UAAU,KAAK;CAC3C,GAAG;AACL,EACF;AAIA,MAAM,YAAY,YAChBA,SAAO,KACP,MACF,EAAE;CACA,SAAS;CACT,MAAM;CACN,SAAS;CACT,MAAM;CACN,UAAU;EACR,UAAU,EAAE,cAAc;GACxB;GACA,SAAS;GACT,YAAY,EAAE,UAAU,GAAI;EAC9B;EACA,MAAM;GAAE,QAAQ;GAAG,SAAS;EAAE;EAC9B,SAAS;GAAE,QAAQ;GAAG,SAAS;EAAE;CACnC;AACF,CAAC;AAUD,MAAM,QAAQ,aACX,EACC,UAAU,SACV,WAAW,MACX,aACA,UAAU,eAAe,MACzB,eACA,QACA,OACA,WAAW,MACX,kBACA,cACA,kBACA,WACA,cACA,YACA,SAAS,aACT,iBACA,GAAG,WACC;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,YAAY;CACrD,MAAM,UAAU,aAAa;CAC7B,MAAM,UAAU,UAAU,cAAcC,cAAAA;CAExC,MAAM,eAAe,kBAAkB;EACrC,YAAY,IAAI;CAClB,GAAG,CAAC,CAAC;CAEL,MAAM,eAAe,kBAAkB;EACrC,YAAY,YAAY;CAC1B,GAAG,CAAC,YAAY,CAAC;CAEjB,sBAAsB;EACpB,IAAI,CAAC,SAAS,kBAAkB;CAClC,GAAG,CAAC,OAAO,CAAC;CAEZ,sBAAsB;EACpB,YAAY,YAAY;CAC1B,GAAG,CAAC,YAAY,CAAC;CAEjB,WAAW,SAAS,QAAQ;CAE5B,OACE,qBAACC,WAAD;EACE,IAAIF,SAAO;EACF;EACD;EACR,GAAI;EACJ,eAAA,GAAA,cAAA,YAAyB,KAAK,cAAc,YAAY;EACxD,eAAA,GAAA,cAAA,YAAyB,KAAK,cAAc,YAAY;YAN1D;GAQG,WACC,gBACE,oBAACG,cAAD;IAA8B;IAAe,GAAI;GAAe,CAAA,IAEhE,oBAACC,WAAD,EAAY,GAAI,UAAY,CAAA,IAE5B;GAEJ,qBAAC,cAAD;IAAc,sBAAA,GAAA,cAAA,UAA4B,QAAQ;IAAG,GAAI;cAAzD,CACG,QACC,oBAACC,YAAD;KAAa,IAAG;KAAI,GAAI;eACrB;IACU,CAAA,IACX,MAEH,cACC,oBAACC,kBAAD;KAAmB,GAAI;eACpB;IACgB,CAAA,IACjB,IACQ;;GAEb,WACC,oBAAC,kBAAD;IACE,gBAAc;IACd,GAAI;IACJ,UAAA,GAAA,cAAA,YAAoB,kBAAkB,SAAS,OAAO;GACvD,CAAA,IACC;EACM;;AAEhB,GACA,MACF,EACE;CACE,SAAS;CACT,MAAM;CACN,SAAS;CACT,QAAQ;CACR,MAAM;CACN,UAAU;EACR,UAAU,EAAE,aAAa;GACvB,SAAS;GACT,YAAY,iBAAiB,MAAM,EAAE,CAAC,QAAQ,KAAM,GAAG,EAAG;GAC1D,GAAG;EACL;EACA,MAAM;GACJ,SAAS;GACT,YAAY,iBAAiB,KAAK,EAAE,KAAA,GAAW,EAAG;EACpD;EACA,UAAU,EAAE,WAAW,aAAa;GAClC,SAAS;GACT,GAAI,QAAQ,EAAE,IAAI,cAAc,UAAU,KAAK,KAAK,GAAG,IAAI,CAAC;EAC9D;CACF;AACF,IACC,EAAE,OAAO,WAAW,GAAG,WAAW;CACjC,MAAM,MAAM,OAAuB,IAAI;CACvC,MAAM,EAAE,WAAW,UAAU,eAAe,oBAAoB;CAEhE,gBAAgB;EACd,MAAM,QAAQ,SAAS;EAEvB,MAAM,IAAI,OAAO,IAAI,OAAO;EAE5B,aAAa;GACX,MAAM,OAAO,KAAK;EACpB;CACF,GAAG,CAAC,UAAU,KAAK,CAAC;CAEpB,OAAO;EACL;EACA,WAAW,cAAc,UAAU,YAAY;EAC/C,aAAa,aAAa;EAC1B,QAAQ;GAAE;GAAW;EAAM;EAC3B,GAAG;CACL;AACF,CACF;AAIA,MAAM,eAAe,YAAsC,OAAO,SAAS,EAAE;AAI7E,MAAM,mBAAmB,YACvB,aACA,aACF,EAAE"}