@keboola/design 13.2.0 → 15.0.0

package/dist/DropdownMenu-CcVbZ_5u.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownMenu-CcVbZ_5u.js","names":["Root"],"sources":["../src/components/DropdownMenu/DropdownMenuItemIndicator.tsx","../src/components/DropdownMenu/ItemIcon.tsx","../src/components/DropdownMenu/styles.ts","../src/components/DropdownMenu/DropdownMenuCheckboxItem.tsx","../src/components/DropdownMenu/DropdownMenuContent.tsx","../src/components/DropdownMenu/DropdownMenuItem.tsx","../src/components/DropdownMenu/DropdownMenuItemDescription.tsx","../src/components/DropdownMenu/DropdownMenuLabel.tsx","../src/components/DropdownMenu/DropdownMenuRadioGroup/DropdownMenuRadioGroup.tsx","../src/components/DropdownMenu/DropdownMenuRadioGroup/DropdownMenuRadioItem.tsx","../src/components/DropdownMenu/DropdownMenuSeparator.tsx","../src/components/DropdownMenu/DropdownMenuSub/DropdownMenuSub.tsx","../src/components/DropdownMenu/DropdownMenuSub/DropdownMenuSubContent.tsx","../src/components/DropdownMenu/DropdownMenuSub/DropdownMenuSubTrigger.tsx","../src/components/DropdownMenu/DropdownMenuTrigger.tsx","../src/components/DropdownMenu/DropdownMenu.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { Check, Circle, ToggleRight } from '../../icons';\nimport { cn } from '../../utils';\nimport { radioCircleVariants, radioIndicatorVariants } from '../RadioGroup/styles';\n\nconst variants = cva(\n  [\n    'tailwindcss-preflight',\n    'tw:pointer-events-none',\n\n    // sizing\n    'tw:size-4',\n    'tw:aspect-square',\n    'tw:shrink-0',\n\n    // layout\n    'tw:flex',\n    'tw:items-center',\n    'tw:justify-center',\n  ],\n  {\n    variants: {\n      variant: {\n        none: [],\n        radio: ['tw:data-[state=unchecked]:[&_svg]:hidden'],\n        check: ['tw:[&_svg:not([class*=\"tw:size-\"])]:size-3.5', 'tw:[&_svg]:text-primary'],\n        checkbox: [\n          'tw:[&_svg]:text-primary-foreground',\n          'tw:border',\n          'tw:border-solid',\n          'tw:rounded',\n          'tw:border-input',\n\n          'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3',\n          'tw:data-[state=unchecked]:[&_svg]:hidden',\n          'tw:data-[state=checked]:border-primary',\n          'tw:data-[state=checked]:bg-primary',\n        ],\n        switch: [\n          'tw:size-5',\n          // Lucide SVGs default to 24×24 — constrain the rendered ToggleRight\n          // to the indicator slot so it doesn't overflow.\n          'tw:[&_svg:not([class*=\"tw:size-\"])]:size-5',\n          'tw:text-muted-foreground',\n          'tw:data-[state=unchecked]:rotate-180',\n          'tw:data-[state=checked]:text-primary',\n        ],\n      },\n    },\n  },\n);\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.ItemIndicator> &\n  VariantProps<typeof variants>;\n\nexport const DropdownMenuItemIndicator = ({\n  variant,\n  className,\n  forceMount: forceMountProp,\n  ...rest\n}: Props) => {\n  const isRadio = variant === 'radio';\n  const IconComp = (() => {\n    if (variant === 'switch') return ToggleRight;\n    if (isRadio) return Circle;\n    return Check;\n  })();\n\n  const forceMount = (() => {\n    if (forceMountProp) return true;\n    // All variants, except for check, require rendering at all times.\n    return variant === 'check' ? undefined : true;\n  })();\n\n  if (variant === 'none') return null;\n\n  return (\n    <DropdownMenuPrimitive.ItemIndicator\n      {...rest}\n      forceMount={forceMount}\n      className={cn(variants({ variant }), isRadio && radioCircleVariants(), className)}\n    >\n      <IconComp className={isRadio ? radioIndicatorVariants() : undefined} />\n    </DropdownMenuPrimitive.ItemIndicator>\n  );\n};\n","import type { ComponentProps, ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'span'> & {\n  children: ReactNode;\n};\n\nexport const ItemIcon = ({ className, children, ...props }: Props) => (\n  <span\n    {...props}\n    className={cn(\n      'tw:inline-flex',\n      'tw:items-center',\n      'tw:justify-center',\n      'tw:aspect-square',\n      // 20px container fits the 16px Lucide glyph plus 2px breathing room\n      // each side — the previous tw:size-4 + tw:p-0.5 clipped the 16px child.\n      'tw:size-5',\n      'tw:[&_svg:not([class*=\"tw:size-\"])]:size-4',\n      'tw:text-primary',\n      'tw:group-aria-disabled:text-muted-foreground',\n      className,\n    )}\n  >\n    {children}\n  </span>\n);\n","import { cn } from '../../utils';\n\nexport const itemVariants = cn(\n  // reset\n  'tailwindcss-preflight',\n  'tw:outline-hidden',\n  'tw:group',\n  'tw:peer',\n  'tw:relative',\n\n  // positioning\n  'tw:flex',\n  'tw:flex-1',\n  'tw:items-center',\n  'tw:gap-2',\n\n  // An icon passed as `children` rather than via the `icon` prop misses `ItemIcon`,\n  // so without this it falls back to Lucide's 24px default and towers over the\n  // siblings this row is laid out for. The `:not()` keeps a call-site size winning.\n  'tw:[&_svg:not([class*=\"tw:size-\"])]:size-4',\n\n  'tw:cursor-pointer',\n  'tw:select-none',\n  'tw:transition-colors',\n\n  // spacing\n  'tw:p-2',\n\n  // typography\n  'tw:font-sans',\n  'tw:text-sm',\n\n  'tw:aria-disabled:pointer-events-none',\n  'tw:aria-disabled:opacity-disabled',\n\n  'tw:focus-visible:outline-hidden',\n\n  'tw:rounded-md',\n  'tw:text-popover-foreground',\n  // Hover and keyboard focus: the theme's `--hover` pair when set; unset, a `primary` tint.\n  'tw:focus:text-[var(--hover-foreground,rgb(var(--primary)))]',\n  'tw:focus:bg-[var(--hover,color-mix(in_oklab,rgb(var(--primary))_10%,transparent))]',\n  'tw:hover:text-[var(--hover-foreground,rgb(var(--primary)))]',\n  'tw:hover:bg-[var(--hover,color-mix(in_oklab,rgb(var(--primary))_10%,transparent))]',\n);\n\nexport const contentVariants = cn(\n  'tailwindcss-preflight',\n  // Sit above Modal/Sheet (z-1051), matching the other floating overlays (Popover/Select z-1055)\n  'tw:z-[1055]',\n\n  // positioning\n  'tw:flex',\n  'tw:flex-col',\n  'tw:origin-(--radix-dropdown-menu-content-transform-origin)',\n\n  // sizing\n  'tw:max-h-[var(--radix-dropdown-menu-content-available-height)]',\n  'tw:min-w-32',\n\n  // border\n  'tw:border',\n  'tw:border-border',\n  'tw:rounded-popover',\n  'tw:shadow-md',\n\n  // surface — semantic tokens, so a portalled menu follows the brand and the scheme\n  'tw:bg-popover',\n  'tw:text-popover-foreground',\n\n  // animations\n  'tw:data-[state=open]:animate-in',\n  'tw:data-[state=open]:fade-in-0',\n  'tw:data-[state=open]:zoom-in-95',\n\n  'tw:data-[state=closed]:animate-out',\n  'tw:data-[state=closed]:fade-out-0',\n  'tw:data-[state=closed]:zoom-out-95',\n\n  'tw:data-[side=bottom]:slide-in-from-top-2',\n  'tw:data-[side=left]:slide-in-from-right-2',\n  'tw:data-[side=right]:slide-in-from-left-2',\n  'tw:data-[side=top]:slide-in-from-bottom-2',\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nimport { Loader2 } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { DropdownMenuItemIndicator } from './DropdownMenuItemIndicator';\nimport { ItemIcon } from './ItemIcon';\nimport { itemVariants } from './styles';\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem> & {\n  closeOnSelect?: boolean;\n  indicator?: 'switch' | 'checkbox' | 'check';\n  indicatorAlign?: 'start' | 'end';\n  isLoading?: boolean;\n  /** Leading Lucide icon, drawn like `DropdownMenu.Item`'s so mixed menus line up. */\n  icon?: ReactNode;\n};\n\nexport const DropdownMenuCheckboxItem = ({\n  className,\n  children,\n  checked,\n  closeOnSelect = false,\n  onSelect,\n  indicatorAlign = 'start',\n  indicator = 'checkbox',\n  isLoading = false,\n  icon,\n  ...props\n}: Props) => {\n  const isAtStart = indicatorAlign === 'start';\n  const indicatorEle = isLoading ? (\n    <ItemIcon className={isAtStart ? '' : 'tw:ml-auto'}>\n      <Loader2 className=\"tw:animate-spin\" />\n    </ItemIcon>\n  ) : (\n    <DropdownMenuItemIndicator variant={indicator} className={isAtStart ? '' : 'tw:ml-auto'} />\n  );\n\n  const handleSelect = (event: Event) => {\n    if (!closeOnSelect) event.preventDefault();\n    onSelect?.(event);\n  };\n\n  return (\n    <DropdownMenuPrimitive.CheckboxItem\n      className={cn(itemVariants, className)}\n      checked={checked}\n      onSelect={handleSelect}\n      {...props}\n    >\n      {isAtStart && indicatorEle}\n      {icon && <ItemIcon>{icon}</ItemIcon>}\n      {children}\n      {!isAtStart && indicatorEle}\n    </DropdownMenuPrimitive.CheckboxItem>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nimport { cn } from '../../utils';\nimport { ScrollArea } from '../ScrollArea';\n\nimport { contentVariants } from './styles';\n\ntype Props = Omit<\n  ComponentProps<typeof DropdownMenuPrimitive.Content>,\n  'forceMount' | 'asChild'\n> & {\n  forceMount?: boolean;\n  /** Classes for the inner scroll area, not the popup. Set a width, not a `max-width` (clips rows). */\n  className?: string;\n  viewPortClassName?: string;\n  container?: HTMLElement | null;\n};\n\nexport const DropdownMenuContent = ({\n  className,\n  sideOffset = 4,\n  forceMount,\n  children,\n  viewPortClassName,\n  container,\n  ...props\n}: Props) => (\n  <DropdownMenuPrimitive.Portal forceMount={forceMount || undefined} container={container}>\n    <DropdownMenuPrimitive.Content {...props} sideOffset={sideOffset} className={contentVariants}>\n      <ScrollArea\n        className={className}\n        viewPortClassName={cn(\n          'tw:p-2',\n          'tw:max-h-[var(--radix-dropdown-menu-content-available-height)]',\n          viewPortClassName,\n        )}\n        scrollBarClassName=\"tw:w-1.5\"\n      >\n        {children}\n      </ScrollArea>\n    </DropdownMenuPrimitive.Content>\n  </DropdownMenuPrimitive.Portal>\n);\n","import type { ComponentProps, PointerEventHandler, ReactNode } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { Root, Slottable } from '@radix-ui/react-slot';\n\nimport { Loader2 } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { ItemIcon } from './ItemIcon';\nimport { itemVariants } from './styles';\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n  /**\n   * Stops the closing item stealing focus from the modal it opens (breaks `autoFocus`).\n   * https://github.com/radix-ui/primitives/issues/2193#issuecomment-2758461323\n   */\n  asModalTrigger?: boolean;\n  /** Leading Lucide icon. */\n  icon?: ReactNode;\n  isLoading?: boolean;\n  iconClassName?: string;\n};\n\nexport const DropdownMenuItem = ({\n  ref,\n  className,\n  asModalTrigger = false,\n  onSelect,\n  onPointerLeave,\n  onPointerMove,\n  children,\n  asChild,\n  icon,\n  iconClassName,\n  isLoading = false,\n  ...props\n}: Props) => {\n  const Comp = asChild ? Root : 'div';\n  const adornment = isLoading ? <Loader2 className=\"tw:animate-spin\" /> : icon;\n\n  const handleOnSelect = (event: Event) => {\n    // keeps the menu open so the modal is not unmounted\n    if (asModalTrigger) event.preventDefault();\n    onSelect?.(event);\n  };\n\n  const handlePointerLeave: PointerEventHandler<HTMLDivElement> = (event) => {\n    // prevents focus stealing from modal\n    if (asModalTrigger) event.preventDefault();\n    onPointerLeave?.(event);\n  };\n\n  const handlePointerMove: PointerEventHandler<HTMLDivElement> = (event) => {\n    // prevents focus stealing from modal\n    if (asModalTrigger) event.preventDefault();\n    onPointerMove?.(event);\n  };\n\n  return (\n    <DropdownMenuPrimitive.Item\n      {...props}\n      ref={ref}\n      onSelect={handleOnSelect}\n      onPointerLeave={handlePointerLeave}\n      onPointerMove={handlePointerMove}\n      className={cn(itemVariants, asChild && 'tw:text-inherit', className)}\n      asChild\n    >\n      <Comp>\n        {adornment && <ItemIcon className={iconClassName}>{adornment}</ItemIcon>}\n        <Slottable>{children}</Slottable>\n      </Comp>\n    </DropdownMenuPrimitive.Item>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport { cva } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nconst descriptionVariants = cva(\n  [\n    'tw:box-border',\n    'tw:ml-auto',\n    'tw:font-sans',\n    'tw:tracking-normal',\n    'tw:font-normal',\n    'tw:text-xs',\n    'tw:text-muted-foreground',\n  ],\n  {\n    variants: {\n      hideOnHover: {\n        true: ['tw:group-focus-within:hidden', 'tw:group-hover:hidden'],\n        false: [],\n      },\n    },\n    defaultVariants: {},\n  },\n);\n\ntype Props = ComponentProps<'span'> & {\n  hideOnHover?: boolean;\n};\n\nexport const DropdownMenuItemDescription = ({\n  className,\n  children,\n  hideOnHover = false,\n  ...props\n}: Props) => {\n  return (\n    <span {...props} className={cn(descriptionVariants({ hideOnHover }), className)}>\n      {children}\n    </span>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.Label>;\n\nexport const DropdownMenuLabel = ({ className, ...props }: Props) => {\n  return (\n    <DropdownMenuPrimitive.Label\n      className={cn(\n        'tw:p-2',\n        'tw:font-medium',\n        'tw:text-xs',\n        'tw:text-muted-foreground',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n","import type { ComponentProps } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\ntype Props<Value> = Omit<\n  ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>,\n  'value' | 'onValueChange' | 'defaultValue'\n> & {\n  value?: Value;\n  defaultValue?: Value;\n  onValueChange?: (value: Value) => void;\n};\n\nexport const DropdownMenuRadioGroup = <Value extends string = string>({\n  value,\n  defaultValue,\n  onValueChange,\n  ...props\n}: Props<Value>) => {\n  const handleChange = (value: string) => {\n    onValueChange?.(value as Value);\n  };\n\n  return (\n    <DropdownMenuPrimitive.RadioGroup\n      {...props}\n      value={value}\n      defaultValue={defaultValue}\n      onValueChange={handleChange}\n    />\n  );\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nimport { Loader2 } from '../../../icons';\nimport { cn } from '../../../utils';\nimport { DropdownMenuItemIndicator } from '../DropdownMenuItemIndicator';\nimport { ItemIcon } from '../ItemIcon';\nimport { itemVariants } from '../styles';\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.RadioItem> & {\n  closeOnSelect?: boolean;\n  indicatorAlign?: 'start' | 'end';\n  indicator?: 'radio' | 'check' | 'none';\n  icon?: ReactNode;\n  iconClassName?: string;\n  isLoading?: boolean;\n};\n\nexport const DropdownMenuRadioItem = ({\n  className,\n  children,\n  closeOnSelect,\n  onSelect,\n  indicatorAlign = 'start',\n  indicator = 'radio',\n  icon,\n  iconClassName,\n  isLoading = false,\n  ...props\n}: Props) => {\n  const isAtStart = indicatorAlign === 'start';\n  const indicatorEle = isLoading ? (\n    <ItemIcon className={iconClassName}>\n      <Loader2 className=\"tw:animate-spin\" />\n    </ItemIcon>\n  ) : (\n    <DropdownMenuItemIndicator variant={indicator} />\n  );\n\n  const handleSelect = (event: Event) => {\n    if (!closeOnSelect) event.preventDefault();\n    onSelect?.(event);\n  };\n\n  return (\n    <DropdownMenuPrimitive.RadioItem\n      className={cn(\n        itemVariants,\n        'tw:data-[state=checked]:cursor-default',\n        {\n          // The theme's `--selected` when set; unset, a `primary` tint.\n          'tw:data-[state=checked]:bg-[var(--selected,color-mix(in_oklab,rgb(var(--primary))_10%,transparent))]':\n            indicator !== 'radio',\n        },\n        className,\n      )}\n      onSelect={handleSelect}\n      {...props}\n    >\n      {isAtStart && indicatorEle}\n      {icon && <ItemIcon className={iconClassName}>{icon}</ItemIcon>}\n      <span className=\"tw:flex tw:min-w-0 tw:flex-1 tw:items-center tw:gap-2\">{children}</span>\n      {!isAtStart && indicatorEle}\n    </DropdownMenuPrimitive.RadioItem>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.Separator>;\n\nexport const DropdownMenuSeparator = ({ className, ...props }: Props) => (\n  <DropdownMenuPrimitive.Separator\n    className={cn(\n      'tw:relative',\n      'tw:z-10',\n\n      // layout\n      'tw:flex',\n      'tw:items-center',\n      'tw:justify-center',\n      'tw:w-full',\n\n      // separator line\n      'tw:before:content-[\"\"]',\n      'tw:before:w-full',\n      'tw:before:h-px',\n      'tw:before:bg-border',\n      'tw:py-1',\n\n      className,\n    )}\n    {...props}\n  />\n);\n","import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nexport const DropdownMenuSub = DropdownMenuPrimitive.Sub;\n","import type { ComponentProps } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nimport { cn } from '../../../utils';\nimport { contentVariants } from '../styles';\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.SubContent>;\n\nexport const DropdownMenuSubContent = ({ className, ...props }: Props) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuPrimitive.SubContent\n      className={cn(contentVariants, 'tw:p-2', className)}\n      {...props}\n    />\n  </DropdownMenuPrimitive.Portal>\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\nimport { ChevronRight } from '../../../icons';\nimport { cn } from '../../../utils';\nimport { ItemIcon } from '../ItemIcon';\nimport { itemVariants } from '../styles';\n\ntype Props = ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n  /** Leading Lucide icon, drawn like `DropdownMenu.Item`'s so the trigger lines up with items. */\n  icon?: ReactNode;\n};\n\nexport const DropdownMenuSubTrigger = ({ className, children, icon, ...props }: Props) => {\n  return (\n    <DropdownMenuPrimitive.SubTrigger className={cn(itemVariants, className)} {...props}>\n      {icon && <ItemIcon>{icon}</ItemIcon>}\n      {children}\n      <ChevronRight className=\"tw:ml-auto tw:size-5\" />\n    </DropdownMenuPrimitive.SubTrigger>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport { Trigger } from '@radix-ui/react-dropdown-menu';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof Trigger>;\n\nexport const DropdownMenuTrigger = ({ ref, className, ...props }: Props) => (\n  <Trigger\n    {...props}\n    ref={ref}\n    data-slot=\"dropdown-menu-trigger\"\n    className={cn('tw:group/dropdown-menu-trigger', className)}\n  />\n);\n","import type { ComponentProps } from 'react';\nimport { Group, Root } from '@radix-ui/react-dropdown-menu';\n\nimport { DropdownMenuCheckboxItem } from './DropdownMenuCheckboxItem';\nimport { DropdownMenuContent } from './DropdownMenuContent';\nimport { DropdownMenuItem } from './DropdownMenuItem';\nimport { DropdownMenuItemDescription } from './DropdownMenuItemDescription';\nimport { DropdownMenuLabel } from './DropdownMenuLabel';\nimport { DropdownMenuRadioGroup, DropdownMenuRadioItem } from './DropdownMenuRadioGroup';\nimport { DropdownMenuSeparator } from './DropdownMenuSeparator';\nimport { DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger } from './DropdownMenuSub';\nimport { DropdownMenuTrigger } from './DropdownMenuTrigger';\n\ntype Props = ComponentProps<typeof Root>;\n\nexport const DropdownMenu = ({\n  // change a default value to false, for modal property, as it is not used in most cases\n  modal = false,\n  ...props\n}: Props) => <Root {...props} modal={modal} />;\n\n/**\n * Main Layout\n */\nDropdownMenu.Trigger = DropdownMenuTrigger;\nDropdownMenu.Content = DropdownMenuContent;\nDropdownMenu.Group = Group;\n\n/**\n * Sub Layout\n */\nDropdownMenu.Sub = DropdownMenuSub;\nDropdownMenu.SubContent = DropdownMenuSubContent;\nDropdownMenu.SubTrigger = DropdownMenuSubTrigger;\n\n/**\n * Items can be used either Sub ar Main Layout\n */\nDropdownMenu.Separator = DropdownMenuSeparator;\nDropdownMenu.Label = DropdownMenuLabel;\nDropdownMenu.Item = DropdownMenuItem;\nDropdownMenu.CheckboxItem = DropdownMenuCheckboxItem;\nDropdownMenu.RadioGroup = DropdownMenuRadioGroup;\nDropdownMenu.RadioItem = DropdownMenuRadioItem;\n\n// item content\nDropdownMenu.ItemDescription = DropdownMenuItemDescription;\n"],"mappings":"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"}

package/dist/{FieldItem-Cf1E3rfQ.js → FieldItem-BHUqgSO1.js}

@@ -1,7 +1,7 @@
-import { Tooltip } from "./utils-p6tjltbX.js";
+import { Tooltip } from "./utils-DwC9u0tM.js";
 import { Info } from "./icons-ZIeZXXS7.js";
 import { Label } from "./internal/components/Label.js";
-import { FormGroup } from "./FormGroup-D4O96YPm.js";
+import { FormGroup } from "./FormGroup-V5kIgQRN.js";
 import { useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { createFormHookContexts, useStore } from "@tanstack/react-form";
@@ -92,4 +92,4 @@ const FieldItem = ({ label, action, required, requiredMark = "required", labelli
 //#endregion
 export { FieldItem, fieldContext, formContext, useFieldContext, useFormContext };
 
-//# sourceMappingURL=FieldItem-Cf1E3rfQ.js.map
+//# sourceMappingURL=FieldItem-BHUqgSO1.js.map

package/dist/{FieldItem-Cf1E3rfQ.js.map → FieldItem-BHUqgSO1.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FieldItem-Cf1E3rfQ.js","names":[],"sources":["../src/blocks/Form/contexts.ts","../src/blocks/Form/connectors/FieldItem.tsx"],"sourcesContent":["import { createFormHookContexts } from '@tanstack/react-form';\n\nexport const { fieldContext, useFieldContext, formContext, useFormContext } =\n  createFormHookContexts();\n","import { type ReactNode, useRef } from 'react';\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '../../../components/Label';\nimport { Tooltip } from '../../../components/Tooltip';\nimport { Info } from '../../../icons';\nimport { FormGroup } from '../../FormGroup';\nimport { useFieldContext, useFormContext } from '../contexts';\n\n/** The a11y wiring `FieldItem` derives for the control — spread it onto the rendered element. */\ntype FieldControlProps = {\n  id: string;\n  name: string;\n  'aria-required'?: true;\n  'aria-invalid'?: true;\n  'aria-describedby'?: string;\n  /** Present only under `labelling: 'aria-labelledby'` — see the prop. */\n  'aria-labelledby'?: string;\n};\n\n/** Which marker sits next to the label. Purely visual — `aria-required` is driven by `required`. */\ntype RequiredMark = 'required' | 'optional' | 'hidden';\n\n/**\n * How the control takes its accessible name from the label.\n *\n * - `'for'` (default) — `<label for>` at the control's `id`; for labelable elements (`input` etc.).\n * - `'aria-labelledby'` — the label id comes back in `control['aria-labelledby']`, no `for`. For\n *   non-labelable controls (CodeMirror, Lexical, `div[role]`), which `<label for>` never names.\n */\ntype Labelling = 'for' | 'aria-labelledby';\n\ntype Props = {\n  label?: ReactNode;\n  /** Trailing node on the label row (e.g. a `Link`); not part of the accessible name. */\n  action?: ReactNode;\n  required?: boolean;\n  /**\n   * Gated by `required`: `'required'` shows `*` only if required, `'optional'` shows `(optional)`\n   * only if not, `'hidden'` neither. Defaults to `'required'`.\n   */\n  requiredMark?: RequiredMark;\n  /** See {@link Labelling}. Defaults to `'for'`. */\n  labelling?: Labelling;\n  help?: ReactNode;\n  tooltip?: ReactNode;\n  className?: string;\n  'aria-describedby'?: string;\n  children: (control: FieldControlProps) => ReactNode;\n};\n\n/**\n * The frame props a connector re-exposes to its callers.\n *\n * - No `labelling`: the connector picks it from what its control is.\n * - Left in, it would fall into the rest spread and reach the DOM `<input>`.\n */\nexport type FieldItemProps = Omit<Props, 'children' | 'labelling'>;\n\n/**\n * Shared form-field frame: label, control, help/error text. Owns validity, ids and `aria-*` wiring,\n * so a connector only picks a control and binds its value.\n */\nexport const FieldItem = ({\n  label,\n  action,\n  required,\n  requiredMark = 'required',\n  labelling = 'for',\n  help,\n  tooltip,\n  className,\n  'aria-describedby': ariaDescribedBy,\n  children,\n}: Props) => {\n  const field = useFieldContext();\n  const form = useFormContext();\n  const { errors, isBlurred } = field.state.meta;\n  const submissionAttempts = useStore(form.store, (state) => state.submissionAttempts);\n\n  /**\n   * The submit count as of this field's first render.\n   *\n   * - A bare `> 0` would flag fields mounted after a failed submit.\n   * - `form.reset()` zeroes the counter, so the baseline follows it down.\n   */\n  const attemptsAtMountRef = useRef(submissionAttempts);\n  if (submissionAttempts < attemptsAtMountRef.current)\n    attemptsAtMountRef.current = submissionAttempts;\n\n  /**\n   * ⚠️ Blurred, not touched.\n   *\n   * - `setFieldValue` and `validateField` set `isTouched`, so code-filled fields would show errors.\n   * - Only a real blur sets `isBlurred` — and `setServerFieldErrors`, for failures outside a submit.\n   * - A submit attempt reveals every field that was on screen for it.\n   */\n  const isInvalid =\n    (isBlurred || submissionAttempts > attemptsAtMountRef.current) && errors.length > 0;\n\n  const errorId = `${field.name}-error`;\n  const descriptionId = `${field.name}-description`;\n  const labelId = `${field.name}-label`;\n  const namesByAria = labelling === 'aria-labelledby';\n  // Help and error can both apply; `undefined` when empty so the attr is omitted.\n  const describedBy =\n    [ariaDescribedBy, !!help && descriptionId, isInvalid && errorId].filter(Boolean).join(' ') ||\n    undefined;\n\n  return (\n    <FormGroup className={className}>\n      {(label || action) && (\n        <div className=\"tw:flex tw:items-center tw:justify-between tw:gap-2\">\n          <div className=\"tw:flex tw:items-center tw:gap-1\">\n            {/* Marker binds to the label text; the interactive tooltip button is a sibling. */}\n            {label && (\n              // `htmlFor` only for labelable controls — see `Labelling`.\n              <Label\n                htmlFor={namesByAria ? undefined : field.name}\n                id={namesByAria ? labelId : undefined}\n              >\n                {label}\n                {requiredMark === 'required' && required && <Label.Required />}\n                {requiredMark === 'optional' && !required && <Label.Optional />}\n              </Label>\n            )}\n\n            {tooltip && (\n              <Tooltip tooltip={tooltip} placement=\"top\" triggerAsChild>\n                <button\n                  type=\"button\"\n                  aria-label={\n                    typeof label === 'string'\n                      ? `More information about ${label}`\n                      : 'More information'\n                  }\n                  className=\"tw:text-muted-foreground tw:focus:outline-hidden tw:focus-visible:text-primary tailwindcss-preflight\"\n                >\n                  <Info className=\"tw:size-3\" />\n                </button>\n              </Tooltip>\n            )}\n          </div>\n\n          {action}\n        </div>\n      )}\n\n      {children({\n        id: field.name,\n        name: field.name,\n        'aria-required': required || undefined,\n        'aria-invalid': isInvalid || undefined,\n        'aria-describedby': describedBy,\n        'aria-labelledby': namesByAria && label ? labelId : undefined,\n      })}\n\n      {(help || isInvalid) && (\n        <div>\n          {help && <FormGroup.Help id={descriptionId}>{help}</FormGroup.Help>}\n          {isInvalid && <FormGroup.Error id={errorId} errors={errors} />}\n        </div>\n      )}\n    </FormGroup>\n  );\n};\n"],"mappings":";;;;;;;;AAEA,MAAa,EAAE,cAAc,iBAAiB,aAAa,mBACzD,uBAAuB;;;;;;;AC4DzB,MAAa,aAAa,EACxB,OACA,QACA,UACA,eAAe,YACf,YAAY,OACZ,MACA,SACA,WACA,oBAAoB,iBACpB,eACW;CACX,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,OAAO,eAAe;CAC5B,MAAM,EAAE,QAAQ,cAAc,MAAM,MAAM;CAC1C,MAAM,qBAAqB,SAAS,KAAK,QAAQ,UAAU,MAAM,kBAAkB;;;;;;;CAQnF,MAAM,qBAAqB,OAAO,kBAAkB;CACpD,IAAI,qBAAqB,mBAAmB,SAC1C,mBAAmB,UAAU;;;;;;;;CAS/B,MAAM,aACH,aAAa,qBAAqB,mBAAmB,YAAY,OAAO,SAAS;CAEpF,MAAM,UAAU,GAAG,MAAM,KAAK;CAC9B,MAAM,gBAAgB,GAAG,MAAM,KAAK;CACpC,MAAM,UAAU,GAAG,MAAM,KAAK;CAC9B,MAAM,cAAc,cAAc;CAElC,MAAM,cACJ;EAAC;EAAiB,CAAC,CAAC,QAAQ;EAAe,aAAa;CAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KACzF,KAAA;CAEF,OACE,qBAAC,WAAD;EAAsB;EAAtB,UAAA;IACI,SAAS,WACT,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,qBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CAEG,SAEC,qBAAC,OAAD;MACE,SAAS,cAAc,KAAA,IAAY,MAAM;MACzC,IAAI,cAAc,UAAU,KAAA;MAF9B,UAAA;OAIG;OACA,iBAAiB,cAAc,YAAY,oBAAC,MAAM,UAAP,CAAiB,CAAA;OAC5D,iBAAiB,cAAc,CAAC,YAAY,oBAAC,MAAM,UAAP,CAAiB,CAAA;MACzD;KAGR,CAAA,GAAA,WACC,oBAAC,SAAD;MAAkB;MAAS,WAAU;MAAM,gBAAA;MACzC,UAAA,oBAAC,UAAD;OACE,MAAK;OACL,cACE,OAAO,UAAU,WACb,0BAA0B,UAC1B;OAEN,WAAU;OAEV,UAAA,oBAAC,MAAD,EAAM,WAAU,YAAa,CAAA;MACvB,CAAA;KACD,CAAA,CAER;IAEJ,CAAA,GAAA,MACE;;GAGN,SAAS;IACR,IAAI,MAAM;IACV,MAAM,MAAM;IACZ,iBAAiB,YAAY,KAAA;IAC7B,gBAAgB,aAAa,KAAA;IAC7B,oBAAoB;IACpB,mBAAmB,eAAe,QAAQ,UAAU,KAAA;GACtD,CAAC;IAEC,QAAQ,cACR,qBAAC,OAAD,EAAA,UAAA,CACG,QAAQ,oBAAC,UAAU,MAAX;IAAgB,IAAI;IAAgB,UAAA;GAAqB,CAAA,GACjE,aAAa,oBAAC,UAAU,OAAX;IAAiB,IAAI;IAAiB;GAAS,CAAA,CAC1D,EAAA,CAAA;EAEE;;AAEf"}
+{"version":3,"file":"FieldItem-BHUqgSO1.js","names":[],"sources":["../src/blocks/Form/contexts.ts","../src/blocks/Form/connectors/FieldItem.tsx"],"sourcesContent":["import { createFormHookContexts } from '@tanstack/react-form';\n\nexport const { fieldContext, useFieldContext, formContext, useFormContext } =\n  createFormHookContexts();\n","import { type ReactNode, useRef } from 'react';\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '../../../components/Label';\nimport { Tooltip } from '../../../components/Tooltip';\nimport { Info } from '../../../icons';\nimport { FormGroup } from '../../FormGroup';\nimport { useFieldContext, useFormContext } from '../contexts';\n\n/** The a11y wiring `FieldItem` derives for the control — spread it onto the rendered element. */\ntype FieldControlProps = {\n  id: string;\n  name: string;\n  'aria-required'?: true;\n  'aria-invalid'?: true;\n  'aria-describedby'?: string;\n  /** Present only under `labelling: 'aria-labelledby'` — see the prop. */\n  'aria-labelledby'?: string;\n};\n\n/** Which marker sits next to the label. Purely visual — `aria-required` is driven by `required`. */\ntype RequiredMark = 'required' | 'optional' | 'hidden';\n\n/**\n * How the control takes its accessible name from the label.\n *\n * - `'for'` (default) — `<label for>` at the control's `id`; for labelable elements (`input` etc.).\n * - `'aria-labelledby'` — the label id comes back in `control['aria-labelledby']`, no `for`. For\n *   non-labelable controls (CodeMirror, Lexical, `div[role]`), which `<label for>` never names.\n */\ntype Labelling = 'for' | 'aria-labelledby';\n\ntype Props = {\n  label?: ReactNode;\n  /** Trailing node on the label row (e.g. a `Link`); not part of the accessible name. */\n  action?: ReactNode;\n  required?: boolean;\n  /**\n   * Gated by `required`: `'required'` shows `*` only if required, `'optional'` shows `(optional)`\n   * only if not, `'hidden'` neither. Defaults to `'required'`.\n   */\n  requiredMark?: RequiredMark;\n  /** See {@link Labelling}. Defaults to `'for'`. */\n  labelling?: Labelling;\n  help?: ReactNode;\n  tooltip?: ReactNode;\n  className?: string;\n  'aria-describedby'?: string;\n  children: (control: FieldControlProps) => ReactNode;\n};\n\n/**\n * The frame props a connector re-exposes to its callers.\n *\n * - No `labelling`: the connector picks it from what its control is.\n * - Left in, it would fall into the rest spread and reach the DOM `<input>`.\n */\nexport type FieldItemProps = Omit<Props, 'children' | 'labelling'>;\n\n/**\n * Shared form-field frame: label, control, help/error text. Owns validity, ids and `aria-*` wiring,\n * so a connector only picks a control and binds its value.\n */\nexport const FieldItem = ({\n  label,\n  action,\n  required,\n  requiredMark = 'required',\n  labelling = 'for',\n  help,\n  tooltip,\n  className,\n  'aria-describedby': ariaDescribedBy,\n  children,\n}: Props) => {\n  const field = useFieldContext();\n  const form = useFormContext();\n  const { errors, isBlurred } = field.state.meta;\n  const submissionAttempts = useStore(form.store, (state) => state.submissionAttempts);\n\n  /**\n   * The submit count as of this field's first render.\n   *\n   * - A bare `> 0` would flag fields mounted after a failed submit.\n   * - `form.reset()` zeroes the counter, so the baseline follows it down.\n   */\n  const attemptsAtMountRef = useRef(submissionAttempts);\n  if (submissionAttempts < attemptsAtMountRef.current)\n    attemptsAtMountRef.current = submissionAttempts;\n\n  /**\n   * ⚠️ Blurred, not touched.\n   *\n   * - `setFieldValue` and `validateField` set `isTouched`, so code-filled fields would show errors.\n   * - Only a real blur sets `isBlurred` — and `setServerFieldErrors`, for failures outside a submit.\n   * - A submit attempt reveals every field that was on screen for it.\n   */\n  const isInvalid =\n    (isBlurred || submissionAttempts > attemptsAtMountRef.current) && errors.length > 0;\n\n  const errorId = `${field.name}-error`;\n  const descriptionId = `${field.name}-description`;\n  const labelId = `${field.name}-label`;\n  const namesByAria = labelling === 'aria-labelledby';\n  // Help and error can both apply; `undefined` when empty so the attr is omitted.\n  const describedBy =\n    [ariaDescribedBy, !!help && descriptionId, isInvalid && errorId].filter(Boolean).join(' ') ||\n    undefined;\n\n  return (\n    <FormGroup className={className}>\n      {(label || action) && (\n        <div className=\"tw:flex tw:items-center tw:justify-between tw:gap-2\">\n          <div className=\"tw:flex tw:items-center tw:gap-1\">\n            {/* Marker binds to the label text; the interactive tooltip button is a sibling. */}\n            {label && (\n              // `htmlFor` only for labelable controls — see `Labelling`.\n              <Label\n                htmlFor={namesByAria ? undefined : field.name}\n                id={namesByAria ? labelId : undefined}\n              >\n                {label}\n                {requiredMark === 'required' && required && <Label.Required />}\n                {requiredMark === 'optional' && !required && <Label.Optional />}\n              </Label>\n            )}\n\n            {tooltip && (\n              <Tooltip tooltip={tooltip} placement=\"top\" triggerAsChild>\n                <button\n                  type=\"button\"\n                  aria-label={\n                    typeof label === 'string'\n                      ? `More information about ${label}`\n                      : 'More information'\n                  }\n                  className=\"tw:text-muted-foreground tw:focus:outline-hidden tw:focus-visible:text-primary tailwindcss-preflight\"\n                >\n                  <Info className=\"tw:size-3\" />\n                </button>\n              </Tooltip>\n            )}\n          </div>\n\n          {action}\n        </div>\n      )}\n\n      {children({\n        id: field.name,\n        name: field.name,\n        'aria-required': required || undefined,\n        'aria-invalid': isInvalid || undefined,\n        'aria-describedby': describedBy,\n        'aria-labelledby': namesByAria && label ? labelId : undefined,\n      })}\n\n      {(help || isInvalid) && (\n        <div>\n          {help && <FormGroup.Help id={descriptionId}>{help}</FormGroup.Help>}\n          {isInvalid && <FormGroup.Error id={errorId} errors={errors} />}\n        </div>\n      )}\n    </FormGroup>\n  );\n};\n"],"mappings":";;;;;;;;AAEA,MAAa,EAAE,cAAc,iBAAiB,aAAa,mBACzD,uBAAuB;;;;;;;AC4DzB,MAAa,aAAa,EACxB,OACA,QACA,UACA,eAAe,YACf,YAAY,OACZ,MACA,SACA,WACA,oBAAoB,iBACpB,eACW;CACX,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,OAAO,eAAe;CAC5B,MAAM,EAAE,QAAQ,cAAc,MAAM,MAAM;CAC1C,MAAM,qBAAqB,SAAS,KAAK,QAAQ,UAAU,MAAM,kBAAkB;;;;;;;CAQnF,MAAM,qBAAqB,OAAO,kBAAkB;CACpD,IAAI,qBAAqB,mBAAmB,SAC1C,mBAAmB,UAAU;;;;;;;;CAS/B,MAAM,aACH,aAAa,qBAAqB,mBAAmB,YAAY,OAAO,SAAS;CAEpF,MAAM,UAAU,GAAG,MAAM,KAAK;CAC9B,MAAM,gBAAgB,GAAG,MAAM,KAAK;CACpC,MAAM,UAAU,GAAG,MAAM,KAAK;CAC9B,MAAM,cAAc,cAAc;CAElC,MAAM,cACJ;EAAC;EAAiB,CAAC,CAAC,QAAQ;EAAe,aAAa;CAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KACzF,KAAA;CAEF,OACE,qBAAC,WAAD;EAAsB;EAAtB,UAAA;IACI,SAAS,WACT,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,qBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CAEG,SAEC,qBAAC,OAAD;MACE,SAAS,cAAc,KAAA,IAAY,MAAM;MACzC,IAAI,cAAc,UAAU,KAAA;MAF9B,UAAA;OAIG;OACA,iBAAiB,cAAc,YAAY,oBAAC,MAAM,UAAP,CAAiB,CAAA;OAC5D,iBAAiB,cAAc,CAAC,YAAY,oBAAC,MAAM,UAAP,CAAiB,CAAA;MACzD;KAGR,CAAA,GAAA,WACC,oBAAC,SAAD;MAAkB;MAAS,WAAU;MAAM,gBAAA;MACzC,UAAA,oBAAC,UAAD;OACE,MAAK;OACL,cACE,OAAO,UAAU,WACb,0BAA0B,UAC1B;OAEN,WAAU;OAEV,UAAA,oBAAC,MAAD,EAAM,WAAU,YAAa,CAAA;MACvB,CAAA;KACD,CAAA,CAER;IAEJ,CAAA,GAAA,MACE;;GAGN,SAAS;IACR,IAAI,MAAM;IACV,MAAM,MAAM;IACZ,iBAAiB,YAAY,KAAA;IAC7B,gBAAgB,aAAa,KAAA;IAC7B,oBAAoB;IACpB,mBAAmB,eAAe,QAAQ,UAAU,KAAA;GACtD,CAAC;IAEC,QAAQ,cACR,qBAAC,OAAD,EAAA,UAAA,CACG,QAAQ,oBAAC,UAAU,MAAX;IAAgB,IAAI;IAAgB,UAAA;GAAqB,CAAA,GACjE,aAAa,oBAAC,UAAU,OAAX;IAAiB,IAAI;IAAiB;GAAS,CAAA,CAC1D,EAAA,CAAA;EAEE;;AAEf"}

package/dist/{FileUpload-D6vPG3WB.js → FileUpload-BYFONpEl.js}

@@ -1,7 +1,7 @@
 import { __commonJSMin, __toESM } from "./rolldown-runtime-Bdc48AWt.js";
 import { cn } from "./classNames-DcGnTh2N.js";
 import { File, FileSpreadsheet, FileText, Upload, X } from "./icons-ZIeZXXS7.js";
-import { Button } from "./Button-D2JqBAq7.js";
+import { Button } from "./Button-BNkyYU8u.js";
 import React, { Fragment, createContext, forwardRef, use, useCallback, useEffect, useImperativeHandle, useMemo, useReducer, useRef } from "react";
 import { cva } from "class-variance-authority";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -2483,7 +2483,7 @@ const useFileDropTarget = ({ accept, maxSize, maxFiles, multiple = true, disable
 /**
 * Drop-zone primitive — the caller owns the `File[]`; the component only signals drops.
 *
-* - Brand-neutral (semantic tokens), so it renders under legacy chrome too.
+* - Brand-neutral: semantic tokens only.
 * - Compose `<FileUpload.DropZone />` + `<FileUpload.FileList />`; pass the `File[]` to `FileList`.
 * - Upload progress/lifecycle is app-level state on top of `onFilesChange`.
 * - For a drop target you style yourself, use `useFileDropTarget`.
@@ -2519,4 +2519,4 @@ const FileUpload = Object.assign(FileUploadInner, {
 //#endregion
 export { FileUpload, useFileDropTarget, useFileUploadRejections };
 
-//# sourceMappingURL=FileUpload-D6vPG3WB.js.map
+//# sourceMappingURL=FileUpload-BYFONpEl.js.map