asterui 0.12.62 → 0.12.64

package/dist/components/ContextMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.js","sources":["../../src/components/ContextMenu.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback, createContext, useContext } from 'react'\nimport { createPortal } from 'react-dom'\nimport { useConfig } from '../providers/ConfigProvider'\n\n// DaisyUI classes\nconst dMenu = 'menu'\nconst dDivider = 'divider'\n\nexport interface ContextMenuItem {\n  key: string\n  label: React.ReactNode\n  icon?: React.ReactNode\n  disabled?: boolean\n  danger?: boolean\n  divider?: boolean\n  children?: ContextMenuItem[]\n}\n\nexport interface ContextMenuProps {\n  /** Element that triggers the context menu on right-click */\n  children: React.ReactNode\n  /** Menu items (data-driven pattern) */\n  items?: ContextMenuItem[]\n  /** Callback when an item is selected */\n  onSelect?: (key: string) => void\n  /** Whether the context menu is disabled */\n  disabled?: boolean\n  /** Additional CSS classes for the menu */\n  className?: string\n}\n\nexport interface ContextMenuItemProps {\n  /** Item content */\n  children: React.ReactNode\n  /** Icon to display before label */\n  icon?: React.ReactNode\n  /** Whether the item is disabled */\n  disabled?: boolean\n  /** Show as danger/destructive action */\n  danger?: boolean\n  /** Additional CSS classes */\n  className?: string\n  /** @internal */\n  _key?: string\n}\n\nexport interface ContextMenuDividerProps {\n  /** Additional CSS classes */\n  className?: string\n}\n\nexport interface ContextMenuSubMenuProps {\n  /** Submenu label */\n  label: React.ReactNode\n  /** Icon to display before label */\n  icon?: React.ReactNode\n  /** Whether the submenu is disabled */\n  disabled?: boolean\n  /** Submenu items */\n  children: React.ReactNode\n  /** Additional CSS classes */\n  className?: string\n  /** @internal */\n  _key?: string\n}\n\ninterface ContextMenuContextValue {\n  onSelect: (key: string) => void\n  onClose: () => void\n}\n\ninterface MenuPosition {\n  x: number\n  y: number\n}\n\nconst ContextMenuContext = createContext<ContextMenuContextValue | null>(null)\n\nconst useContextMenuContext = () => {\n  const context = useContext(ContextMenuContext)\n  if (!context) {\n    throw new Error('ContextMenu compound components must be used within a ContextMenu')\n  }\n  return context\n}\n\n// Compound pattern components\nconst ContextMenuItemComponent: React.FC<ContextMenuItemProps> = ({\n  children,\n  icon,\n  disabled = false,\n  danger = false,\n  className = '',\n  _key,\n}) => {\n  const { onSelect, onClose } = useContextMenuContext()\n\n  const handleClick = () => {\n    if (disabled || !_key) return\n    onSelect(_key)\n    onClose()\n  }\n\n  return (\n    <li className={className} role=\"none\">\n      <button\n        onClick={handleClick}\n        disabled={disabled}\n        role=\"menuitem\"\n        aria-disabled={disabled}\n        className={`\n          flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n          ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n          ${danger ? 'text-error hover:bg-error/10' : ''}\n        `}\n      >\n        {icon && <span className=\"w-4 h-4\" aria-hidden=\"true\">{icon}</span>}\n        <span className=\"flex-1\">{children}</span>\n      </button>\n    </li>\n  )\n}\n\nconst ContextMenuDividerComponent: React.FC<ContextMenuDividerProps> = ({ className = '' }) => {\n  return <li className={`${dDivider} my-1 ${className}`} role=\"separator\"></li>\n}\n\nconst ContextMenuSubMenuComponent: React.FC<ContextMenuSubMenuProps> = ({\n  label,\n  icon,\n  disabled = false,\n  children,\n  className = '',\n  _key: _unusedKey,\n}) => {\n  const [showSubmenu, setShowSubmenu] = useState(false)\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n  const handleMouseEnter = () => {\n    if (disabled) return\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n    setShowSubmenu(true)\n  }\n\n  const handleMouseLeave = () => {\n    timeoutRef.current = setTimeout(() => setShowSubmenu(false), 100)\n  }\n\n  return (\n    <li\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={`relative ${className}`}\n      role=\"none\"\n    >\n      <button\n        disabled={disabled}\n        role=\"menuitem\"\n        aria-haspopup=\"menu\"\n        aria-expanded={showSubmenu}\n        aria-disabled={disabled}\n        className={`\n          flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n          ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n        `}\n      >\n        {icon && <span className=\"w-4 h-4\" aria-hidden=\"true\">{icon}</span>}\n        <span className=\"flex-1\">{label}</span>\n        <svg className=\"w-4 h-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n          <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n        </svg>\n      </button>\n      {showSubmenu && (\n        <ul\n          className={`${dMenu} bg-base-100 rounded-box shadow-lg border border-base-300 absolute left-full top-0 min-w-[160px] z-50 p-1`}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n          role=\"menu\"\n        >\n          {children}\n        </ul>\n      )}\n    </li>\n  )\n}\n\n// Data-driven pattern internal component\nconst MenuItem: React.FC<{\n  item: ContextMenuItem\n  onSelect: (key: string) => void\n  onClose: () => void\n}> = ({ item, onSelect, onClose }) => {\n  const [showSubmenu, setShowSubmenu] = useState(false)\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n  if (item.divider) {\n    return <li className={`${dDivider} my-1`} role=\"separator\"></li>\n  }\n\n  const handleClick = () => {\n    if (item.disabled) return\n    if (item.children && item.children.length > 0) return\n    onSelect(item.key)\n    onClose()\n  }\n\n  const hasSubmenu = item.children && item.children.length > 0\n\n  const handleMouseEnter = () => {\n    if (!hasSubmenu) return\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n    setShowSubmenu(true)\n  }\n\n  const handleMouseLeave = () => {\n    if (!hasSubmenu) return\n    timeoutRef.current = setTimeout(() => setShowSubmenu(false), 100)\n  }\n\n  return (\n    <li\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className=\"relative\"\n      role=\"none\"\n    >\n      <button\n        onClick={handleClick}\n        disabled={item.disabled}\n        role=\"menuitem\"\n        aria-haspopup={hasSubmenu ? 'menu' : undefined}\n        aria-expanded={hasSubmenu ? showSubmenu : undefined}\n        aria-disabled={item.disabled}\n        className={`\n          flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n          ${item.disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n          ${item.danger ? 'text-error hover:bg-error/10' : ''}\n        `}\n      >\n        {item.icon && <span className=\"w-4 h-4\" aria-hidden=\"true\">{item.icon}</span>}\n        <span className=\"flex-1\">{item.label}</span>\n        {hasSubmenu && (\n          <svg className=\"w-4 h-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n          </svg>\n        )}\n      </button>\n      {hasSubmenu && showSubmenu && (\n        <ul\n          className={`${dMenu} bg-base-100 rounded-box shadow-lg border border-base-300 absolute left-full top-0 min-w-[160px] z-50 p-1`}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n          role=\"menu\"\n        >\n          {item.children!.map((child) => (\n            <MenuItem key={child.key} item={child} onSelect={onSelect} onClose={onClose} />\n          ))}\n        </ul>\n      )}\n    </li>\n  )\n}\n\nconst ContextMenuRoot: React.FC<ContextMenuProps> = ({\n  children,\n  items,\n  onSelect,\n  disabled = false,\n  className = '',\n}) => {\n  const { getPopupContainer } = useConfig()\n  const [visible, setVisible] = useState(false)\n  const [position, setPosition] = useState<MenuPosition>({ x: 0, y: 0 })\n  const menuRef = useRef<HTMLUListElement>(null)\n  const triggerRef = useRef<HTMLDivElement>(null)\n\n  const handleContextMenu = useCallback(\n    (e: React.MouseEvent) => {\n      if (disabled) return\n      e.preventDefault()\n      e.stopPropagation()\n\n      // Calculate position, ensuring menu stays within viewport\n      let x = e.clientX\n      let y = e.clientY\n\n      // We'll adjust after render when we know menu dimensions\n      setPosition({ x, y })\n      setVisible(true)\n    },\n    [disabled]\n  )\n\n  const handleClose = useCallback(() => {\n    setVisible(false)\n  }, [])\n\n  const handleSelect = useCallback(\n    (key: string) => {\n      onSelect?.(key)\n    },\n    [onSelect]\n  )\n\n  // Adjust position after menu renders to keep it in viewport\n  useEffect(() => {\n    if (visible && menuRef.current) {\n      const menu = menuRef.current\n      const rect = menu.getBoundingClientRect()\n      const viewportWidth = window.innerWidth\n      const viewportHeight = window.innerHeight\n\n      let { x, y } = position\n\n      if (x + rect.width > viewportWidth) {\n        x = viewportWidth - rect.width - 8\n      }\n      if (y + rect.height > viewportHeight) {\n        y = viewportHeight - rect.height - 8\n      }\n\n      if (x !== position.x || y !== position.y) {\n        setPosition({ x, y })\n      }\n    }\n  }, [visible, position])\n\n  // Close on click outside or escape\n  useEffect(() => {\n    if (!visible) return\n\n    const handleClickOutside = (e: MouseEvent) => {\n      if (menuRef.current && !menuRef.current.contains(e.target as Node)) {\n        handleClose()\n      }\n    }\n\n    const handleEscape = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        handleClose()\n      }\n    }\n\n    const handleScroll = () => {\n      handleClose()\n    }\n\n    document.addEventListener('mousedown', handleClickOutside)\n    document.addEventListener('keydown', handleEscape)\n    document.addEventListener('scroll', handleScroll, true)\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n      document.removeEventListener('keydown', handleEscape)\n      document.removeEventListener('scroll', handleScroll, true)\n    }\n  }, [visible, handleClose])\n\n  // Clone children to extract keys\n  const cloneChildrenWithKeys = (children: React.ReactNode): React.ReactNode => {\n    return React.Children.map(children, (child) => {\n      if (React.isValidElement(child)) {\n        const childKey = child.key != null ? String(child.key) : undefined\n        if (child.type === ContextMenuItemComponent || child.type === ContextMenuSubMenuComponent) {\n          return React.cloneElement(child as React.ReactElement<any>, { _key: childKey })\n        }\n      }\n      return child\n    })\n  }\n\n  // Determine if using data-driven or compound pattern\n  // Find menu content children (not the trigger element)\n  const childArray = React.Children.toArray(children)\n  const triggerChild = childArray[0]\n  const menuChildren = cloneChildrenWithKeys(childArray.slice(1))\n  const useDataDriven = items && items.length > 0\n\n  const contextValue: ContextMenuContextValue = {\n    onSelect: handleSelect,\n    onClose: handleClose,\n  }\n\n  return (\n    <>\n      <div ref={triggerRef} onContextMenu={handleContextMenu} className=\"inline-block\">\n        {triggerChild}\n      </div>\n      {visible &&\n        createPortal(\n          <ContextMenuContext.Provider value={contextValue}>\n            <ul\n              ref={menuRef}\n              className={`${dMenu} bg-base-100 rounded-box shadow-lg border border-base-300 min-w-[160px] p-1 fixed z-[9999] ${className}`}\n              style={{ left: position.x, top: position.y }}\n              role=\"menu\"\n              aria-label=\"Context menu\"\n            >\n              {useDataDriven\n                ? items!.map((item) => (\n                    <MenuItem key={item.key} item={item} onSelect={handleSelect} onClose={handleClose} />\n                  ))\n                : menuChildren}\n            </ul>\n          </ContextMenuContext.Provider>,\n          getPopupContainer ? getPopupContainer(document.body) : document.body\n        )}\n    </>\n  )\n}\n\n// Assign compound components\nexport const ContextMenu = Object.assign(ContextMenuRoot, {\n  Item: ContextMenuItemComponent,\n  Divider: ContextMenuDividerComponent,\n  SubMenu: ContextMenuSubMenuComponent,\n})\n"],"names":["dMenu","dDivider","ContextMenuContext","createContext","useContextMenuContext","context","useContext","ContextMenuItemComponent","children","icon","disabled","danger","className","_key","onSelect","onClose","jsx","jsxs","ContextMenuDividerComponent","ContextMenuSubMenuComponent","label","_unusedKey","showSubmenu","setShowSubmenu","useState","timeoutRef","useRef","handleMouseEnter","handleMouseLeave","MenuItem","item","handleClick","hasSubmenu","child","ContextMenuRoot","items","getPopupContainer","useConfig","visible","setVisible","position","setPosition","menuRef","triggerRef","handleContextMenu","useCallback","e","x","y","handleClose","handleSelect","key","useEffect","rect","viewportWidth","viewportHeight","handleClickOutside","handleEscape","handleScroll","cloneChildrenWithKeys","React","childKey","childArray","triggerChild","menuChildren","useDataDriven","contextValue","Fragment","createPortal","ContextMenu"],"mappings":"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"}
+{"version":3,"file":"ContextMenu.js","sources":["../../src/components/ContextMenu.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback, createContext, useContext } from 'react'\nimport { createPortal } from 'react-dom'\nimport { useConfig } from '../providers/ConfigProvider'\n\n// DaisyUI classes\nconst dMenu = 'menu'\nconst dDivider = 'divider'\n\nexport interface ContextMenuItem {\n  key: string\n  label: React.ReactNode\n  icon?: React.ReactNode\n  disabled?: boolean\n  danger?: boolean\n  divider?: boolean\n  children?: ContextMenuItem[]\n}\n\nexport interface ContextMenuProps {\n  /** Element that triggers the context menu on right-click */\n  children: React.ReactNode\n  /** Menu items (data-driven pattern) */\n  items?: ContextMenuItem[]\n  /** Callback when an item is selected */\n  onSelect?: (key: string) => void\n  /** Whether the context menu is disabled */\n  disabled?: boolean\n  /** Additional CSS classes for the menu */\n  className?: string\n  'data-testid'?: string\n}\n\nexport interface ContextMenuItemProps {\n  /** Item content */\n  children: React.ReactNode\n  /** Icon to display before label */\n  icon?: React.ReactNode\n  /** Whether the item is disabled */\n  disabled?: boolean\n  /** Show as danger/destructive action */\n  danger?: boolean\n  /** Additional CSS classes */\n  className?: string\n  /** @internal */\n  _key?: string\n  'data-testid'?: string\n}\n\nexport interface ContextMenuDividerProps {\n  /** Additional CSS classes */\n  className?: string\n  'data-testid'?: string\n}\n\nexport interface ContextMenuSubMenuProps {\n  /** Submenu label */\n  label: React.ReactNode\n  /** Icon to display before label */\n  icon?: React.ReactNode\n  /** Whether the submenu is disabled */\n  disabled?: boolean\n  /** Submenu items */\n  children: React.ReactNode\n  /** Additional CSS classes */\n  className?: string\n  /** @internal */\n  _key?: string\n  'data-testid'?: string\n}\n\ninterface ContextMenuContextValue {\n  onSelect: (key: string) => void\n  onClose: () => void\n  getTestId?: (suffix: string) => string | undefined\n}\n\ninterface MenuPosition {\n  x: number\n  y: number\n}\n\nconst ContextMenuContext = createContext<ContextMenuContextValue | null>(null)\n\nconst useContextMenuContext = () => {\n  const context = useContext(ContextMenuContext)\n  if (!context) {\n    throw new Error('ContextMenu compound components must be used within a ContextMenu')\n  }\n  return context\n}\n\n// Compound pattern components\nconst ContextMenuItemComponent: React.FC<ContextMenuItemProps> = ({\n  children,\n  icon,\n  disabled = false,\n  danger = false,\n  className = '',\n  _key,\n  'data-testid': testId,\n}) => {\n  const { onSelect, onClose, getTestId } = useContextMenuContext()\n  const itemTestId = testId ?? (_key ? getTestId?.(`item-${_key}`) : undefined)\n\n  const handleClick = () => {\n    if (disabled || !_key) return\n    onSelect(_key)\n    onClose()\n  }\n\n  return (\n    <li className={className} role=\"none\">\n      <button\n        onClick={handleClick}\n        disabled={disabled}\n        role=\"menuitem\"\n        aria-disabled={disabled}\n        data-testid={itemTestId}\n        className={`\n          flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n          ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n          ${danger ? 'text-error hover:bg-error/10' : ''}\n        `}\n      >\n        {icon && <span className=\"w-4 h-4\" aria-hidden=\"true\">{icon}</span>}\n        <span className=\"flex-1\">{children}</span>\n      </button>\n    </li>\n  )\n}\n\nconst ContextMenuDividerComponent: React.FC<ContextMenuDividerProps> = ({ className = '', 'data-testid': testId }) => {\n  return <li className={`${dDivider} my-1 ${className}`} role=\"separator\" data-testid={testId}></li>\n}\n\nconst ContextMenuSubMenuComponent: React.FC<ContextMenuSubMenuProps> = ({\n  label,\n  icon,\n  disabled = false,\n  children,\n  className = '',\n  _key: _unusedKey,\n  'data-testid': testId,\n}) => {\n  const { getTestId } = useContextMenuContext()\n  const [showSubmenu, setShowSubmenu] = useState(false)\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n  const submenuTestId = testId ?? (_unusedKey ? getTestId?.(`submenu-${_unusedKey}`) : undefined)\n\n  const handleMouseEnter = () => {\n    if (disabled) return\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n    setShowSubmenu(true)\n  }\n\n  const handleMouseLeave = () => {\n    timeoutRef.current = setTimeout(() => setShowSubmenu(false), 100)\n  }\n\n  return (\n    <li\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className={`relative ${className}`}\n      role=\"none\"\n    >\n      <button\n        disabled={disabled}\n        role=\"menuitem\"\n        aria-haspopup=\"menu\"\n        aria-expanded={showSubmenu}\n        aria-disabled={disabled}\n        data-testid={submenuTestId}\n        className={`\n          flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n          ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n        `}\n      >\n        {icon && <span className=\"w-4 h-4\" aria-hidden=\"true\">{icon}</span>}\n        <span className=\"flex-1\">{label}</span>\n        <svg className=\"w-4 h-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n          <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n        </svg>\n      </button>\n      {showSubmenu && (\n        <ul\n          className={`${dMenu} bg-base-100 rounded-box shadow-lg border border-base-300 absolute left-full top-0 min-w-[160px] z-50 p-1`}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n          role=\"menu\"\n          data-testid={submenuTestId ? `${submenuTestId}-menu` : undefined}\n        >\n          {children}\n        </ul>\n      )}\n    </li>\n  )\n}\n\n// Data-driven pattern internal component\nconst MenuItem: React.FC<{\n  item: ContextMenuItem\n  onSelect: (key: string) => void\n  onClose: () => void\n  getTestId?: (suffix: string) => string | undefined\n}> = ({ item, onSelect, onClose, getTestId }) => {\n  const [showSubmenu, setShowSubmenu] = useState(false)\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n  const itemTestId = getTestId?.(`item-${item.key}`)\n\n  if (item.divider) {\n    return <li className={`${dDivider} my-1`} role=\"separator\" data-testid={getTestId?.(`separator-${item.key}`)}></li>\n  }\n\n  const handleClick = () => {\n    if (item.disabled) return\n    if (item.children && item.children.length > 0) return\n    onSelect(item.key)\n    onClose()\n  }\n\n  const hasSubmenu = item.children && item.children.length > 0\n\n  const handleMouseEnter = () => {\n    if (!hasSubmenu) return\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n    setShowSubmenu(true)\n  }\n\n  const handleMouseLeave = () => {\n    if (!hasSubmenu) return\n    timeoutRef.current = setTimeout(() => setShowSubmenu(false), 100)\n  }\n\n  return (\n    <li\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      className=\"relative\"\n      role=\"none\"\n    >\n      <button\n        onClick={handleClick}\n        disabled={item.disabled}\n        role=\"menuitem\"\n        aria-haspopup={hasSubmenu ? 'menu' : undefined}\n        aria-expanded={hasSubmenu ? showSubmenu : undefined}\n        aria-disabled={item.disabled}\n        data-testid={itemTestId}\n        className={`\n          flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n          ${item.disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n          ${item.danger ? 'text-error hover:bg-error/10' : ''}\n        `}\n      >\n        {item.icon && <span className=\"w-4 h-4\" aria-hidden=\"true\">{item.icon}</span>}\n        <span className=\"flex-1\">{item.label}</span>\n        {hasSubmenu && (\n          <svg className=\"w-4 h-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n          </svg>\n        )}\n      </button>\n      {hasSubmenu && showSubmenu && (\n        <ul\n          className={`${dMenu} bg-base-100 rounded-box shadow-lg border border-base-300 absolute left-full top-0 min-w-[160px] z-50 p-1`}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n          role=\"menu\"\n          data-testid={itemTestId ? `${itemTestId}-menu` : undefined}\n        >\n          {item.children!.map((child) => (\n            <MenuItem key={child.key} item={child} onSelect={onSelect} onClose={onClose} getTestId={getTestId} />\n          ))}\n        </ul>\n      )}\n    </li>\n  )\n}\n\nconst ContextMenuRoot: React.FC<ContextMenuProps> = ({\n  children,\n  items,\n  onSelect,\n  disabled = false,\n  className = '',\n  'data-testid': testId,\n}) => {\n  const { getPopupContainer } = useConfig()\n  const [visible, setVisible] = useState(false)\n  const [position, setPosition] = useState<MenuPosition>({ x: 0, y: 0 })\n  const menuRef = useRef<HTMLUListElement>(null)\n  const triggerRef = useRef<HTMLDivElement>(null)\n\n  const handleContextMenu = useCallback(\n    (e: React.MouseEvent) => {\n      if (disabled) return\n      e.preventDefault()\n      e.stopPropagation()\n\n      // Calculate position, ensuring menu stays within viewport\n      let x = e.clientX\n      let y = e.clientY\n\n      // We'll adjust after render when we know menu dimensions\n      setPosition({ x, y })\n      setVisible(true)\n    },\n    [disabled]\n  )\n\n  const handleClose = useCallback(() => {\n    setVisible(false)\n  }, [])\n\n  const handleSelect = useCallback(\n    (key: string) => {\n      onSelect?.(key)\n    },\n    [onSelect]\n  )\n\n  // Adjust position after menu renders to keep it in viewport\n  useEffect(() => {\n    if (visible && menuRef.current) {\n      const menu = menuRef.current\n      const rect = menu.getBoundingClientRect()\n      const viewportWidth = window.innerWidth\n      const viewportHeight = window.innerHeight\n\n      let { x, y } = position\n\n      if (x + rect.width > viewportWidth) {\n        x = viewportWidth - rect.width - 8\n      }\n      if (y + rect.height > viewportHeight) {\n        y = viewportHeight - rect.height - 8\n      }\n\n      if (x !== position.x || y !== position.y) {\n        setPosition({ x, y })\n      }\n    }\n  }, [visible, position])\n\n  // Close on click outside or escape\n  useEffect(() => {\n    if (!visible) return\n\n    const handleClickOutside = (e: MouseEvent) => {\n      if (menuRef.current && !menuRef.current.contains(e.target as Node)) {\n        handleClose()\n      }\n    }\n\n    const handleEscape = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        handleClose()\n      }\n    }\n\n    const handleScroll = () => {\n      handleClose()\n    }\n\n    document.addEventListener('mousedown', handleClickOutside)\n    document.addEventListener('keydown', handleEscape)\n    document.addEventListener('scroll', handleScroll, true)\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n      document.removeEventListener('keydown', handleEscape)\n      document.removeEventListener('scroll', handleScroll, true)\n    }\n  }, [visible, handleClose])\n\n  // Clone children to extract keys\n  const cloneChildrenWithKeys = (children: React.ReactNode): React.ReactNode => {\n    return React.Children.map(children, (child) => {\n      if (React.isValidElement(child)) {\n        const childKey = child.key != null ? String(child.key) : undefined\n        if (child.type === ContextMenuItemComponent || child.type === ContextMenuSubMenuComponent) {\n          return React.cloneElement(child as React.ReactElement<any>, { _key: childKey })\n        }\n      }\n      return child\n    })\n  }\n\n  // Determine if using data-driven or compound pattern\n  // Find menu content children (not the trigger element)\n  const childArray = React.Children.toArray(children)\n  const triggerChild = childArray[0]\n  const menuChildren = cloneChildrenWithKeys(childArray.slice(1))\n  const useDataDriven = items && items.length > 0\n\n  const contextValue: ContextMenuContextValue = {\n    onSelect: handleSelect,\n    onClose: handleClose,\n    getTestId: testId ? (suffix: string) => `${testId}-${suffix}` : undefined,\n  }\n  const getTestId = (suffix: string) => (testId ? `${testId}-${suffix}` : undefined)\n\n  return (\n    <>\n      <div\n        ref={triggerRef}\n        onContextMenu={handleContextMenu}\n        className=\"inline-block\"\n        data-testid={testId}\n      >\n        {triggerChild}\n      </div>\n      {visible &&\n        createPortal(\n          <ContextMenuContext.Provider value={contextValue}>\n            <ul\n              ref={menuRef}\n              className={`${dMenu} bg-base-100 rounded-box shadow-lg border border-base-300 min-w-[160px] p-1 fixed z-[9999] ${className}`}\n              style={{ left: position.x, top: position.y }}\n              role=\"menu\"\n              aria-label=\"Context menu\"\n              data-testid={getTestId('menu')}\n            >\n              {useDataDriven\n                ? items!.map((item) => (\n                    <MenuItem key={item.key} item={item} onSelect={handleSelect} onClose={handleClose} getTestId={getTestId} />\n                  ))\n                : menuChildren}\n            </ul>\n          </ContextMenuContext.Provider>,\n          getPopupContainer ? getPopupContainer(document.body) : document.body\n        )}\n    </>\n  )\n}\n\n// Assign compound components\nexport const ContextMenu = Object.assign(ContextMenuRoot, {\n  Item: ContextMenuItemComponent,\n  Divider: ContextMenuDividerComponent,\n  SubMenu: ContextMenuSubMenuComponent,\n})\n"],"names":["dMenu","dDivider","ContextMenuContext","createContext","useContextMenuContext","context","useContext","ContextMenuItemComponent","children","icon","disabled","danger","className","_key","testId","onSelect","onClose","getTestId","itemTestId","jsx","jsxs","ContextMenuDividerComponent","ContextMenuSubMenuComponent","label","_unusedKey","showSubmenu","setShowSubmenu","useState","timeoutRef","useRef","submenuTestId","handleMouseEnter","handleMouseLeave","MenuItem","item","handleClick","hasSubmenu","child","ContextMenuRoot","items","getPopupContainer","useConfig","visible","setVisible","position","setPosition","menuRef","triggerRef","handleContextMenu","useCallback","e","x","y","handleClose","handleSelect","key","useEffect","rect","viewportWidth","viewportHeight","handleClickOutside","handleEscape","handleScroll","cloneChildrenWithKeys","React","childKey","childArray","triggerChild","menuChildren","useDataDriven","contextValue","suffix","Fragment","createPortal","ContextMenu"],"mappings":";;;;AAKA,MAAMA,IAAQ,QACRC,IAAW,WA2EXC,IAAqBC,EAA8C,IAAI,GAEvEC,IAAwB,MAAM;AAClC,QAAMC,IAAUC,EAAWJ,CAAkB;AAC7C,MAAI,CAACG;AACH,UAAM,IAAI,MAAM,mEAAmE;AAErF,SAAOA;AACT,GAGME,IAA2D,CAAC;AAAA,EAChE,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,MAAAC;AAAA,EACA,eAAeC;AACjB,MAAM;AACJ,QAAM,EAAE,UAAAC,GAAU,SAAAC,GAAS,WAAAC,EAAA,IAAcb,EAAA,GACnCc,IAAaJ,MAAWD,IAAOI,IAAY,QAAQJ,CAAI,EAAE,IAAI;AAQnE,SACE,gBAAAM,EAAC,MAAA,EAAG,WAAAP,GAAsB,MAAK,QAC7B,UAAA,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SATc,MAAM;AACxB,QAAIV,KAAY,CAACG,MACjBE,EAASF,CAAI,GACbG,EAAA;AAAA,MACF;AAAA,MAMM,UAAAN;AAAA,MACA,MAAK;AAAA,MACL,iBAAeA;AAAA,MACf,eAAaQ;AAAA,MACb,WAAW;AAAA;AAAA,YAEPR,IAAW,kCAAkC,mBAAmB;AAAA,YAChEC,IAAS,iCAAiC,EAAE;AAAA;AAAA,MAG/C,UAAA;AAAA,QAAAF,uBAAS,QAAA,EAAK,WAAU,WAAU,eAAY,QAAQ,UAAAA,GAAK;AAAA,QAC5D,gBAAAU,EAAC,QAAA,EAAK,WAAU,UAAU,UAAAX,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEvC;AAEJ,GAEMa,IAAiE,CAAC,EAAE,WAAAT,IAAY,IAAI,eAAeE,QAChG,gBAAAK,EAAC,MAAA,EAAG,WAAW,GAAGlB,CAAQ,SAASW,CAAS,IAAI,MAAK,aAAY,eAAaE,EAAA,CAAQ,GAGzFQ,IAAiE,CAAC;AAAA,EACtE,OAAAC;AAAA,EACA,MAAAd;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,UAAAF;AAAA,EACA,WAAAI,IAAY;AAAA,EACZ,MAAMY;AAAA,EACN,eAAeV;AACjB,MAAM;AACJ,QAAM,EAAE,WAAAG,EAAA,IAAcb,EAAA,GAChB,CAACqB,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9CC,IAAaC,EAA6C,IAAI,GAC9DC,IAAgBhB,MAAWU,IAAaP,IAAY,WAAWO,CAAU,EAAE,IAAI,SAE/EO,IAAmB,MAAM;AAC7B,IAAIrB,MACAkB,EAAW,WAAS,aAAaA,EAAW,OAAO,GACvDF,EAAe,EAAI;AAAA,EACrB,GAEMM,IAAmB,MAAM;AAC7B,IAAAJ,EAAW,UAAU,WAAW,MAAMF,EAAe,EAAK,GAAG,GAAG;AAAA,EAClE;AAEA,SACE,gBAAAN;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAcW;AAAA,MACd,cAAcC;AAAA,MACd,WAAW,YAAYpB,CAAS;AAAA,MAChC,MAAK;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAQ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,UAAAV;AAAA,YACA,MAAK;AAAA,YACL,iBAAc;AAAA,YACd,iBAAee;AAAA,YACf,iBAAef;AAAA,YACf,eAAaoB;AAAA,YACb,WAAW;AAAA;AAAA,YAEPpB,IAAW,kCAAkC,mBAAmB;AAAA;AAAA,YAGnE,UAAA;AAAA,cAAAD,uBAAS,QAAA,EAAK,WAAU,WAAU,eAAY,QAAQ,UAAAA,GAAK;AAAA,cAC5D,gBAAAU,EAAC,QAAA,EAAK,WAAU,UAAU,UAAAI,GAAM;AAAA,cAChC,gBAAAJ,EAAC,SAAI,WAAU,WAAU,MAAK,QAAO,SAAQ,aAAY,QAAO,gBAAe,eAAY,QACzF,UAAA,gBAAAA,EAAC,QAAA,EAAK,eAAc,SAAQ,gBAAe,SAAQ,aAAa,GAAG,GAAE,eAAA,CAAe,EAAA,CACtF;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAEDM,KACC,gBAAAN;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,GAAGnB,CAAK;AAAA,YACnB,cAAc+B;AAAA,YACd,cAAcC;AAAA,YACd,MAAK;AAAA,YACL,eAAaF,IAAgB,GAAGA,CAAa,UAAU;AAAA,YAEtD,UAAAtB;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAIR,GAGMyB,IAKD,CAAC,EAAE,MAAAC,GAAM,UAAAnB,GAAU,SAAAC,GAAS,WAAAC,QAAgB;AAC/C,QAAM,CAACQ,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9CC,IAAaC,EAA6C,IAAI,GAC9DX,IAAaD,IAAY,QAAQiB,EAAK,GAAG,EAAE;AAEjD,MAAIA,EAAK;AACP,WAAO,gBAAAf,EAAC,MAAA,EAAG,WAAW,GAAGlB,CAAQ,SAAS,MAAK,aAAY,eAAagB,IAAY,aAAaiB,EAAK,GAAG,EAAE,GAAG;AAGhH,QAAMC,IAAc,MAAM;AACxB,IAAID,EAAK,YACLA,EAAK,YAAYA,EAAK,SAAS,SAAS,MAC5CnB,EAASmB,EAAK,GAAG,GACjBlB,EAAA;AAAA,EACF,GAEMoB,IAAaF,EAAK,YAAYA,EAAK,SAAS,SAAS,GAErDH,IAAmB,MAAM;AAC7B,IAAKK,MACDR,EAAW,WAAS,aAAaA,EAAW,OAAO,GACvDF,EAAe,EAAI;AAAA,EACrB,GAEMM,IAAmB,MAAM;AAC7B,IAAKI,MACLR,EAAW,UAAU,WAAW,MAAMF,EAAe,EAAK,GAAG,GAAG;AAAA,EAClE;AAEA,SACE,gBAAAN;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAcW;AAAA,MACd,cAAcC;AAAA,MACd,WAAU;AAAA,MACV,MAAK;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAZ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAASe;AAAA,YACT,UAAUD,EAAK;AAAA,YACf,MAAK;AAAA,YACL,iBAAeE,IAAa,SAAS;AAAA,YACrC,iBAAeA,IAAaX,IAAc;AAAA,YAC1C,iBAAeS,EAAK;AAAA,YACpB,eAAahB;AAAA,YACb,WAAW;AAAA;AAAA,YAEPgB,EAAK,WAAW,kCAAkC,mBAAmB;AAAA,YACrEA,EAAK,SAAS,iCAAiC,EAAE;AAAA;AAAA,YAGpD,UAAA;AAAA,cAAAA,EAAK,0BAAS,QAAA,EAAK,WAAU,WAAU,eAAY,QAAQ,YAAK,KAAA,CAAK;AAAA,cACtE,gBAAAf,EAAC,QAAA,EAAK,WAAU,UAAU,YAAK,OAAM;AAAA,cACpCiB,uBACE,OAAA,EAAI,WAAU,WAAU,MAAK,QAAO,SAAQ,aAAY,QAAO,gBAAe,eAAY,QACzF,UAAA,gBAAAjB,EAAC,QAAA,EAAK,eAAc,SAAQ,gBAAe,SAAQ,aAAa,GAAG,GAAE,eAAA,CAAe,EAAA,CACtF;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAGHiB,KAAcX,KACb,gBAAAN;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,GAAGnB,CAAK;AAAA,YACnB,cAAc+B;AAAA,YACd,cAAcC;AAAA,YACd,MAAK;AAAA,YACL,eAAad,IAAa,GAAGA,CAAU,UAAU;AAAA,YAEhD,UAAAgB,EAAK,SAAU,IAAI,CAACG,MACnB,gBAAAlB,EAACc,GAAA,EAAyB,MAAMI,GAAO,UAAAtB,GAAoB,SAAAC,GAAkB,WAAAC,EAAA,GAA9DoB,EAAM,GAA8E,CACpG;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAIR,GAEMC,IAA8C,CAAC;AAAA,EACnD,UAAA9B;AAAA,EACA,OAAA+B;AAAA,EACA,UAAAxB;AAAA,EACA,UAAAL,IAAW;AAAA,EACX,WAAAE,IAAY;AAAA,EACZ,eAAeE;AACjB,MAAM;AACJ,QAAM,EAAE,mBAAA0B,EAAA,IAAsBC,EAAA,GACxB,CAACC,GAASC,CAAU,IAAIhB,EAAS,EAAK,GACtC,CAACiB,GAAUC,CAAW,IAAIlB,EAAuB,EAAE,GAAG,GAAG,GAAG,GAAG,GAC/DmB,IAAUjB,EAAyB,IAAI,GACvCkB,IAAalB,EAAuB,IAAI,GAExCmB,IAAoBC;AAAA,IACxB,CAACC,MAAwB;AACvB,UAAIxC,EAAU;AACd,MAAAwC,EAAE,eAAA,GACFA,EAAE,gBAAA;AAGF,UAAIC,IAAID,EAAE,SACNE,IAAIF,EAAE;AAGV,MAAAL,EAAY,EAAE,GAAAM,GAAG,GAAAC,GAAG,GACpBT,EAAW,EAAI;AAAA,IACjB;AAAA,IACA,CAACjC,CAAQ;AAAA,EAAA,GAGL2C,IAAcJ,EAAY,MAAM;AACpC,IAAAN,EAAW,EAAK;AAAA,EAClB,GAAG,CAAA,CAAE,GAECW,IAAeL;AAAA,IACnB,CAACM,MAAgB;AACf,MAAAxC,IAAWwC,CAAG;AAAA,IAChB;AAAA,IACA,CAACxC,CAAQ;AAAA,EAAA;AAIX,EAAAyC,EAAU,MAAM;AACd,QAAId,KAAWI,EAAQ,SAAS;AAE9B,YAAMW,IADOX,EAAQ,QACH,sBAAA,GACZY,IAAgB,OAAO,YACvBC,IAAiB,OAAO;AAE9B,UAAI,EAAE,GAAAR,GAAG,EAAA,IAAMP;AAEf,MAAIO,IAAIM,EAAK,QAAQC,MACnBP,IAAIO,IAAgBD,EAAK,QAAQ,IAE/B,IAAIA,EAAK,SAASE,MACpB,IAAIA,IAAiBF,EAAK,SAAS,KAGjCN,MAAMP,EAAS,KAAK,MAAMA,EAAS,MACrCC,EAAY,EAAE,GAAAM,GAAG,GAAG;AAAA,IAExB;AAAA,EACF,GAAG,CAACT,GAASE,CAAQ,CAAC,GAGtBY,EAAU,MAAM;AACd,QAAI,CAACd,EAAS;AAEd,UAAMkB,IAAqB,CAACV,MAAkB;AAC5C,MAAIJ,EAAQ,WAAW,CAACA,EAAQ,QAAQ,SAASI,EAAE,MAAc,KAC/DG,EAAA;AAAA,IAEJ,GAEMQ,IAAe,CAACX,MAAqB;AACzC,MAAIA,EAAE,QAAQ,YACZG,EAAA;AAAA,IAEJ,GAEMS,IAAe,MAAM;AACzB,MAAAT,EAAA;AAAA,IACF;AAEA,oBAAS,iBAAiB,aAAaO,CAAkB,GACzD,SAAS,iBAAiB,WAAWC,CAAY,GACjD,SAAS,iBAAiB,UAAUC,GAAc,EAAI,GAE/C,MAAM;AACX,eAAS,oBAAoB,aAAaF,CAAkB,GAC5D,SAAS,oBAAoB,WAAWC,CAAY,GACpD,SAAS,oBAAoB,UAAUC,GAAc,EAAI;AAAA,IAC3D;AAAA,EACF,GAAG,CAACpB,GAASW,CAAW,CAAC;AAGzB,QAAMU,IAAwB,CAACvD,MACtBwD,EAAM,SAAS,IAAIxD,GAAU,CAAC6B,MAAU;AAC7C,QAAI2B,EAAM,eAAe3B,CAAK,GAAG;AAC/B,YAAM4B,IAAW5B,EAAM,OAAO,OAAO,OAAOA,EAAM,GAAG,IAAI;AACzD,UAAIA,EAAM,SAAS9B,KAA4B8B,EAAM,SAASf;AAC5D,eAAO0C,EAAM,aAAa3B,GAAkC,EAAE,MAAM4B,GAAU;AAAA,IAElF;AACA,WAAO5B;AAAA,EACT,CAAC,GAKG6B,IAAaF,EAAM,SAAS,QAAQxD,CAAQ,GAC5C2D,IAAeD,EAAW,CAAC,GAC3BE,IAAeL,EAAsBG,EAAW,MAAM,CAAC,CAAC,GACxDG,IAAgB9B,KAASA,EAAM,SAAS,GAExC+B,IAAwC;AAAA,IAC5C,UAAUhB;AAAA,IACV,SAASD;AAAA,IACT,WAAWvC,IAAS,CAACyD,MAAmB,GAAGzD,CAAM,IAAIyD,CAAM,KAAK;AAAA,EAAA,GAE5DtD,IAAY,CAACsD,MAAoBzD,IAAS,GAAGA,CAAM,IAAIyD,CAAM,KAAK;AAExE,SACE,gBAAAnD,EAAAoD,GAAA,EACE,UAAA;AAAA,IAAA,gBAAArD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK4B;AAAA,QACL,eAAeC;AAAA,QACf,WAAU;AAAA,QACV,eAAalC;AAAA,QAEZ,UAAAqD;AAAA,MAAA;AAAA,IAAA;AAAA,IAEFzB,KACC+B;AAAA,MACE,gBAAAtD,EAACjB,EAAmB,UAAnB,EAA4B,OAAOoE,GAClC,UAAA,gBAAAnD;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK2B;AAAA,UACL,WAAW,GAAG9C,CAAK,8FAA8FY,CAAS;AAAA,UAC1H,OAAO,EAAE,MAAMgC,EAAS,GAAG,KAAKA,EAAS,EAAA;AAAA,UACzC,MAAK;AAAA,UACL,cAAW;AAAA,UACX,eAAa3B,EAAU,MAAM;AAAA,UAE5B,cACGsB,EAAO,IAAI,CAACL,wBACTD,GAAA,EAAwB,MAAAC,GAAY,UAAUoB,GAAc,SAASD,GAAa,WAAApC,EAAA,GAApEiB,EAAK,GAAqF,CAC1G,IACDkC;AAAA,QAAA;AAAA,MAAA,GAER;AAAA,MACA5B,IAAoBA,EAAkB,SAAS,IAAI,IAAI,SAAS;AAAA,IAAA;AAAA,EAClE,GACJ;AAEJ,GAGakC,KAAc,OAAO,OAAOpC,GAAiB;AAAA,EACxD,MAAM/B;AAAA,EACN,SAASc;AAAA,EACT,SAASC;AACX,CAAC;"}

package/dist/components/DatePicker.d.ts

@@ -10,4 +10,22 @@ export interface DatePickerProps extends Omit<React.HTMLAttributes<HTMLDivElemen
     /** Test ID prefix for child elements */
     'data-testid'?: string;
 }
-export declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLDivElement>>;
+export type DateRangeValue = [Date | null, Date | null];
+export interface DateRangePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
+    value?: DateRangeValue;
+    defaultValue?: DateRangeValue;
+    onChange?: (range: DateRangeValue) => void;
+    format?: string;
+    placeholder?: [string, string] | string;
+    disabled?: boolean;
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /** Test ID prefix for child elements */
+    'data-testid'?: string;
+}
+declare const DatePickerComponent: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLDivElement>>;
+declare const DateRangePicker: React.ForwardRefExoticComponent<DateRangePickerProps & React.RefAttributes<HTMLDivElement>>;
+type DatePickerType = typeof DatePickerComponent & {
+    Range: typeof DateRangePicker;
+};
+export declare const DatePicker: DatePickerType;
+export {};

package/dist/components/DatePicker.js

@@ -1,8 +1,8 @@
-import { jsxs as f, jsx as t } from "react/jsx-runtime";
-import { forwardRef as J, useState as m, useRef as P, useEffect as Y } from "react";
-import { Input as V } from "./Input.js";
-import { useConfig as G } from "../providers/ConfigProvider.js";
-const M = "btn", y = "btn-ghost", S = "btn-sm", F = "btn-square", H = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], W = [
+import { jsxs as w, jsx as s } from "react/jsx-runtime";
+import { forwardRef as _, useState as D, useRef as ee, useEffect as L } from "react";
+import { Input as te } from "./Input.js";
+import { useConfig as ne } from "../providers/ConfigProvider.js";
+const x = "btn", Y = "btn-ghost", S = "btn-sm", I = "btn-square", se = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], re = [
   "January",
   "February",
   "March",
@@ -16,92 +16,108 @@ const M = "btn", y = "btn-ghost", S = "btn-sm", F = "btn-square", H = ["Su", "Mo
   "November",
   "December"
 ];
-function K(o, n = "MM/DD/YYYY") {
-  if (!o) return "";
-  const h = o.getFullYear(), d = String(o.getMonth() + 1).padStart(2, "0"), g = String(o.getDate()).padStart(2, "0");
-  return n.replace("YYYY", String(h)).replace("MM", d).replace("DD", g);
+function A(r, n = "MM/DD/YYYY") {
+  if (!r) return "";
+  const m = r.getFullYear(), g = String(r.getMonth() + 1).padStart(2, "0"), R = String(r.getDate()).padStart(2, "0");
+  return n.replace("YYYY", String(m)).replace("MM", g).replace("DD", R);
 }
-function Q(o, n) {
-  return new Date(o, n + 1, 0).getDate();
+function ae(r, n) {
+  return new Date(r, n + 1, 0).getDate();
 }
-function U(o, n) {
-  return new Date(o, n, 1).getDay();
+function oe(r, n) {
+  return new Date(r, n, 1).getDay();
 }
-const te = J(function({
+function q(r) {
+  return new Date(r.getFullYear(), r.getMonth(), r.getDate());
+}
+function X(r, n) {
+  return r.getFullYear() === n.getFullYear() && r.getMonth() === n.getMonth() && r.getDate() === n.getDate();
+}
+function Z(r, n) {
+  return q(r).getTime() < q(n).getTime();
+}
+function ue(r, n) {
+  return q(r).getTime() > q(n).getTime();
+}
+function fe(r, n = "MM/DD/YYYY") {
+  const [m, g] = r;
+  return m && g ? `${A(m, n)} - ${A(g, n)}` : m ? `${A(m, n)} - ` : "";
+}
+const le = _(function({
   value: n,
-  defaultValue: h,
-  onChange: d,
-  format: g,
-  placeholder: k = "Select date",
-  disabled: x = !1,
-  size: C,
-  "data-testid": p,
-  className: O = "",
-  ...R
-}, z) {
-  const { componentSize: B } = G(), T = C ?? B ?? "md", N = (e) => p ? `${p}-${e}` : void 0, [a, b] = m(
-    n || h || null
-  ), [c, u] = m(!1), [r, i] = m(
-    a ? a.getMonth() : (/* @__PURE__ */ new Date()).getMonth()
-  ), [l, v] = m(
-    a ? a.getFullYear() : (/* @__PURE__ */ new Date()).getFullYear()
-  ), w = P(null);
-  Y(() => {
-    n !== void 0 && b(n);
-  }, [n]), Y(() => {
-    function e(s) {
-      w.current && !w.current.contains(s.target) && u(!1);
+  defaultValue: m,
+  onChange: g,
+  format: R,
+  placeholder: $ = "Select date",
+  disabled: k = !1,
+  size: V,
+  "data-testid": y,
+  className: J = "",
+  ...G
+}, H) {
+  const { componentSize: W } = ne(), K = V ?? W ?? "md", P = (e) => y ? `${y}-${e}` : void 0, [u, C] = D(
+    n || m || null
+  ), [v, h] = D(!1), [o, f] = D(
+    u ? u.getMonth() : (/* @__PURE__ */ new Date()).getMonth()
+  ), [c, N] = D(
+    u ? u.getFullYear() : (/* @__PURE__ */ new Date()).getFullYear()
+  ), l = ee(null);
+  L(() => {
+    n !== void 0 && C(n);
+  }, [n]), L(() => {
+    function e(i) {
+      l.current && !l.current.contains(i.target) && h(!1);
     }
-    if (c)
+    if (v)
       return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, [c]);
-  const j = (e) => {
-    const s = new Date(l, r, e);
-    b(s), d?.(s), u(!1);
-  }, L = () => {
-    r === 0 ? (i(11), v(l - 1)) : i(r - 1);
-  }, q = () => {
-    r === 11 ? (i(0), v(l + 1)) : i(r + 1);
-  }, A = Q(l, r), E = U(l, r), D = [];
-  for (let e = 0; e < E; e++)
-    D.push(null);
-  for (let e = 1; e <= A; e++)
-    D.push(e);
-  const $ = (e) => !e || !a ? !1 : a.getDate() === e && a.getMonth() === r && a.getFullYear() === l, I = (e) => {
+  }, [v]);
+  const M = (e) => {
+    const i = new Date(c, o, e);
+    C(i), g?.(i), h(!1);
+  }, p = () => {
+    o === 0 ? (f(11), N(c - 1)) : f(o - 1);
+  }, F = () => {
+    o === 11 ? (f(0), N(c + 1)) : f(o + 1);
+  }, T = ae(c, o), Q = oe(c, o), O = [];
+  for (let e = 0; e < Q; e++)
+    O.push(null);
+  for (let e = 1; e <= T; e++)
+    O.push(e);
+  const B = (e) => !e || !u ? !1 : u.getDate() === e && u.getMonth() === o && u.getFullYear() === c, U = (e) => {
     if (!e) return !1;
-    const s = /* @__PURE__ */ new Date();
-    return s.getDate() === e && s.getMonth() === r && s.getFullYear() === l;
+    const i = /* @__PURE__ */ new Date();
+    return i.getDate() === e && i.getMonth() === o && i.getFullYear() === c;
   };
-  return /* @__PURE__ */ f("div", { ref: z || w, className: `relative ${O}`, "data-state": c ? "open" : "closed", "data-testid": p, ...R, children: [
-    /* @__PURE__ */ t(
-      V,
+  return /* @__PURE__ */ w("div", { ref: H || l, className: `relative ${J}`, "data-state": v ? "open" : "closed", "data-testid": y, ...G, children: [
+    /* @__PURE__ */ s(
+      te,
       {
-        value: K(a, g),
-        placeholder: k,
-        disabled: x,
-        size: T,
+        value: A(u, R),
+        placeholder: $,
+        disabled: k,
+        size: K,
         readOnly: !0,
-        onClick: () => !x && u(!c),
+        onClick: () => !k && h(!v),
         className: "cursor-pointer",
-        "data-testid": N("input")
+        "data-testid": P("input")
       }
     ),
-    c && /* @__PURE__ */ f("div", { className: "absolute top-full left-0 mt-2 bg-base-100 border border-base-300 rounded-lg shadow-lg p-4 z-50 w-80", "data-testid": N("calendar"), children: [
-      /* @__PURE__ */ f("div", { className: "flex items-center justify-between mb-4", children: [
-        /* @__PURE__ */ t(
+    v && /* @__PURE__ */ w("div", { className: "absolute top-full left-0 mt-2 bg-base-100 border border-base-300 rounded-lg shadow-lg p-4 z-50 w-80", "data-testid": P("calendar"), children: [
+      /* @__PURE__ */ w("div", { className: "flex items-center justify-between mb-4", children: [
+        /* @__PURE__ */ s(
           "button",
           {
             type: "button",
-            onClick: L,
-            className: `${M} ${y} ${S} ${F}`,
-            children: /* @__PURE__ */ t(
+            onClick: p,
+            className: `${x} ${Y} ${S} ${I}`,
+            children: /* @__PURE__ */ s(
               "svg",
               {
                 xmlns: "http://www.w3.org/2000/svg",
                 className: "h-5 w-5",
                 viewBox: "0 0 20 20",
                 fill: "currentColor",
-                children: /* @__PURE__ */ t(
+                children: /* @__PURE__ */ s(
                   "path",
                   {
                     fillRule: "evenodd",
@@ -113,25 +129,25 @@ const te = J(function({
             )
           }
         ),
-        /* @__PURE__ */ f("div", { className: "text-base font-semibold", children: [
-          W[r],
+        /* @__PURE__ */ w("div", { className: "text-base font-semibold", children: [
+          re[o],
           " ",
-          l
+          c
         ] }),
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ s(
           "button",
           {
             type: "button",
-            onClick: q,
-            className: `${M} ${y} ${S} ${F}`,
-            children: /* @__PURE__ */ t(
+            onClick: F,
+            className: `${x} ${Y} ${S} ${I}`,
+            children: /* @__PURE__ */ s(
               "svg",
               {
                 xmlns: "http://www.w3.org/2000/svg",
                 className: "h-5 w-5",
                 viewBox: "0 0 20 20",
                 fill: "currentColor",
-                children: /* @__PURE__ */ t(
+                children: /* @__PURE__ */ s(
                   "path",
                   {
                     fillRule: "evenodd",
@@ -144,7 +160,7 @@ const te = J(function({
           }
         )
       ] }),
-      /* @__PURE__ */ t("div", { className: "grid grid-cols-7 gap-1 mb-2", children: H.map((e) => /* @__PURE__ */ t(
+      /* @__PURE__ */ s("div", { className: "grid grid-cols-7 gap-1 mb-2", children: se.map((e) => /* @__PURE__ */ s(
         "div",
         {
           className: "text-center text-xs font-semibold text-base-content/60 py-2",
@@ -152,39 +168,202 @@ const te = J(function({
         },
         e
       )) }),
-      /* @__PURE__ */ t("div", { className: "grid grid-cols-7 gap-1", children: D.map((e, s) => /* @__PURE__ */ t(
+      /* @__PURE__ */ s("div", { className: "grid grid-cols-7 gap-1", children: O.map((e, i) => /* @__PURE__ */ s(
         "button",
         {
           type: "button",
           disabled: !e,
-          onClick: () => e && j(e),
+          onClick: () => e && M(e),
           className: `
                   aspect-square flex items-center justify-center text-sm rounded-lg
                   ${e ? "hover:bg-base-200" : "invisible"}
-                  ${$(e) ? "bg-primary text-primary-content hover:bg-primary/90" : ""}
-                  ${I(e) && !$(e) ? "border border-primary" : ""}
+                  ${B(e) ? "bg-primary text-primary-content hover:bg-primary/90" : ""}
+                  ${U(e) && !B(e) ? "border border-primary" : ""}
                   ${e ? "cursor-pointer" : ""}
                 `,
           children: e
         },
-        s
+        i
       )) }),
-      /* @__PURE__ */ t("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ t(
+      /* @__PURE__ */ s("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ s(
         "button",
         {
           type: "button",
           onClick: () => {
             const e = /* @__PURE__ */ new Date();
-            b(e), i(e.getMonth()), v(e.getFullYear()), d?.(e), u(!1);
+            C(e), f(e.getMonth()), N(e.getFullYear()), g?.(e), h(!1);
+          },
+          className: `${x} ${Y} ${S}`,
+          children: "Today"
+        }
+      ) })
+    ] })
+  ] });
+}), ie = _(function({
+  value: n,
+  defaultValue: m,
+  onChange: g,
+  format: R,
+  placeholder: $,
+  disabled: k = !1,
+  size: V,
+  "data-testid": y,
+  className: J = "",
+  ...G
+}, H) {
+  const { componentSize: W } = ne(), K = V ?? W ?? "md", [P, u] = Array.isArray($) ? $ : [$ ?? "Start date", "End date"], C = Array.isArray($) ? `${P} - ${u}` : $ ?? "Start date - End date", v = (t) => y ? `${y}-${t}` : void 0, [h, o] = D(
+    n || m || [null, null]
+  ), [f, c] = D(!1), N = h[0] ?? h[1] ?? /* @__PURE__ */ new Date(), [l, M] = D(N.getMonth()), [p, F] = D(N.getFullYear()), T = ee(null);
+  L(() => {
+    n !== void 0 && o(n);
+  }, [n]), L(() => {
+    function t(d) {
+      T.current && !T.current.contains(d.target) && c(!1);
+    }
+    if (f)
+      return document.addEventListener("mousedown", t), () => document.removeEventListener("mousedown", t);
+  }, [f]);
+  const Q = (t) => {
+    const d = new Date(p, l, t);
+    let [a, b] = h;
+    !a || a && b ? (a = d, b = null) : a && !b && (Z(d, a) ? (b = a, a = d) : b = d);
+    const z = [a, b];
+    o(z), g?.(z), a && b && c(!1);
+  }, O = () => {
+    l === 0 ? (M(11), F(p - 1)) : M(l - 1);
+  }, B = () => {
+    l === 11 ? (M(0), F(p + 1)) : M(l + 1);
+  }, U = ae(p, l), e = oe(p, l), i = [];
+  for (let t = 0; t < e; t++)
+    i.push(null);
+  for (let t = 1; t <= U; t++)
+    i.push(t);
+  const ce = (t) => {
+    if (!t) return !1;
+    const d = /* @__PURE__ */ new Date();
+    return d.getDate() === t && d.getMonth() === l && d.getFullYear() === p;
+  }, [E, j] = h;
+  return /* @__PURE__ */ w("div", { ref: H || T, className: `relative ${J}`, "data-state": f ? "open" : "closed", "data-testid": y, ...G, children: [
+    /* @__PURE__ */ s(
+      te,
+      {
+        value: fe(h, R),
+        placeholder: C,
+        disabled: k,
+        size: K,
+        readOnly: !0,
+        onClick: () => !k && c(!f),
+        className: "cursor-pointer",
+        "data-testid": v("input")
+      }
+    ),
+    f && /* @__PURE__ */ w("div", { className: "absolute top-full left-0 mt-2 bg-base-100 border border-base-300 rounded-lg shadow-lg p-4 z-50 w-80", "data-testid": v("calendar"), children: [
+      /* @__PURE__ */ w("div", { className: "flex items-center justify-between mb-4", children: [
+        /* @__PURE__ */ s(
+          "button",
+          {
+            type: "button",
+            onClick: O,
+            className: `${x} ${Y} ${S} ${I}`,
+            children: /* @__PURE__ */ s(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                className: "h-5 w-5",
+                viewBox: "0 0 20 20",
+                fill: "currentColor",
+                children: /* @__PURE__ */ s(
+                  "path",
+                  {
+                    fillRule: "evenodd",
+                    d: "M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z",
+                    clipRule: "evenodd"
+                  }
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ w("div", { className: "text-base font-semibold", children: [
+          re[l],
+          " ",
+          p
+        ] }),
+        /* @__PURE__ */ s(
+          "button",
+          {
+            type: "button",
+            onClick: B,
+            className: `${x} ${Y} ${S} ${I}`,
+            children: /* @__PURE__ */ s(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                className: "h-5 w-5",
+                viewBox: "0 0 20 20",
+                fill: "currentColor",
+                children: /* @__PURE__ */ s(
+                  "path",
+                  {
+                    fillRule: "evenodd",
+                    d: "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z",
+                    clipRule: "evenodd"
+                  }
+                )
+              }
+            )
+          }
+        )
+      ] }),
+      /* @__PURE__ */ s("div", { className: "grid grid-cols-7 gap-1 mb-2", children: se.map((t) => /* @__PURE__ */ s(
+        "div",
+        {
+          className: "text-center text-xs font-semibold text-base-content/60 py-2",
+          children: t
+        },
+        t
+      )) }),
+      /* @__PURE__ */ s("div", { className: "grid grid-cols-7 gap-1", children: i.map((t, d) => {
+        const a = t ? new Date(p, l, t) : null, b = !!a && !!E && X(a, E), z = !!a && !!j && X(a, j), de = !!a && !!E && !!j && ue(a, E) && Z(a, j);
+        return /* @__PURE__ */ s(
+          "button",
+          {
+            type: "button",
+            disabled: !t,
+            onClick: () => t && Q(t),
+            className: `
+                    aspect-square flex items-center justify-center text-sm rounded-lg
+                    ${t ? "hover:bg-base-200" : "invisible"}
+                    ${de ? "bg-primary/10" : ""}
+                    ${b || z ? "bg-primary text-primary-content hover:bg-primary/90" : ""}
+                    ${ce(t) && !b && !z ? "border border-primary" : ""}
+                    ${t ? "cursor-pointer" : ""}
+                  `,
+            children: t
+          },
+          d
+        );
+      }) }),
+      /* @__PURE__ */ s("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ s(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            const t = /* @__PURE__ */ new Date();
+            o([t, t]), M(t.getMonth()), F(t.getFullYear()), g?.([t, t]), c(!1);
           },
-          className: `${M} ${y} ${S}`,
+          className: `${x} ${Y} ${S}`,
           children: "Today"
         }
       ) })
     ] })
   ] });
 });
+le.displayName = "DatePicker";
+ie.displayName = "DatePicker.Range";
+const me = le;
+me.Range = ie;
 export {
-  te as DatePicker
+  me as DatePicker
 };
 //# sourceMappingURL=DatePicker.js.map