@jbpark/ui-kit 9.1.1 → 10.0.0

package/dist/core/button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.mjs","names":[],"sources":["../../src/core/button.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Slot } from '@radix-ui/react-slot';\nimport { type VariantProps, cva } from 'class-variance-authority';\n\nimport { cn } from '@repo/ui/utils';\n\nconst buttonVariants = cva(\n  \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n        destructive:\n          'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',\n        outline:\n          'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',\n        secondary:\n          'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        ghost:\n          'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',\n        link: 'text-primary underline-offset-4 hover:underline',\n      },\n      size: {\n        default: 'h-9 px-4 py-2 has-[>svg]:px-3',\n        xs: \"h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',\n        lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',\n        icon: 'size-9',\n        'icon-xs': \"size-6 rounded-md [&_svg:not([class*='size-'])]:size-3\",\n        'icon-sm': 'size-8',\n        'icon-lg': 'size-10',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\ntype Props = React.ComponentProps<'button'> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean;\n  };\n\nfunction Button({\n  className,\n  variant = 'default',\n  size = 'default',\n  asChild = false,\n  ...props\n}: Props) {\n  const Comp = asChild ? Slot : 'button';\n\n  return (\n    <Comp\n      data-slot=\"button\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants, type Props };\n"],"mappings":";;;;;;AAOA,MAAM,iBAAiB,IACrB,+bACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,aACE;GACF,SACE;GACF,WACE;GACF,OACE;GACF,MAAM;EACR;EACA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,MAAM;GACN,WAAW;GACX,WAAW;GACX,WAAW;EACb;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF;AAOA,SAAS,OAAO,EACd,WACA,UAAU,WACV,OAAO,WACP,UAAU,OACV,GAAG,SACK;CAGR,OACE,oBAHW,UAAU,OAAO,UAG5B;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;EAAU,CAAC,CAAC;EAC1D,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"button.mjs","names":["Button","ButtonPrimitive"],"sources":["../../src/core/button.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Button as ButtonPrimitive } from '@base-ui/react/button';\nimport { type VariantProps, cva } from 'class-variance-authority';\n\nimport { cn } from '@repo/ui/utils';\n\nconst buttonVariants = cva(\n  \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n        destructive:\n          'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',\n        outline:\n          'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',\n        secondary:\n          'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        ghost:\n          'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',\n        link: 'text-primary underline-offset-4 hover:underline',\n      },\n      size: {\n        default: 'h-9 px-4 py-2 has-[>svg]:px-3',\n        xs: \"h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',\n        lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',\n        icon: 'size-9',\n        'icon-xs': \"size-6 rounded-md [&_svg:not([class*='size-'])]:size-3\",\n        'icon-sm': 'size-8',\n        'icon-lg': 'size-10',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\ntype Props = Omit<React.ComponentProps<typeof ButtonPrimitive>, 'className'> &\n  VariantProps<typeof buttonVariants> & {\n    className?: string;\n  };\n\nfunction Button({\n  className,\n  variant = 'default',\n  size = 'default',\n  ...props\n}: Props) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants, type Props };\n"],"mappings":";;;;;;AAOA,MAAM,iBAAiB,IACrB,+bACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,aACE;GACF,SACE;GACF,WACE;GACF,OACE;GACF,MAAM;EACR;EACA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,MAAM;GACN,WAAW;GACX,WAAW;GACX,WAAW;EACb;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF;AAOA,SAASA,SAAO,EACd,WACA,UAAU,WACV,OAAO,WACP,GAAG,SACK;CACR,OACE,oBAACC,QAAD;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;EAAU,CAAC,CAAC;EAC1D,GAAI;CACL,CAAA;AAEL"}

package/dist/core/calendar.mjs

@@ -17,7 +17,8 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
 		showOutsideDays,
 		className: cn(`bg-background group/calendar p-3 [--cell-size:2rem]
         [[data-slot=card-content]_&]:bg-transparent
-        [[data-slot=popover-content]_&]:bg-transparent`, String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`, String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`, className),
+        [[data-slot=popover-content]_&]:bg-transparent
+        [[data-slot=popover-content]_&]:p-0`, String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`, String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`, className),
 		captionLayout,
 		formatters: {
 			formatMonthDropdown: (date) => date.toLocaleString("default", { month: "short" }),

package/dist/core/calendar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.mjs","names":["React"],"sources":["../../src/core/calendar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { DayButton, DayPicker, getDefaultClassNames } from 'react-day-picker';\n\nimport {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n} from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { Button, buttonVariants } from './button';\n\nfunction Calendar({\n  className,\n  classNames,\n  showOutsideDays = true,\n  captionLayout = 'label',\n  buttonVariant = 'ghost',\n  formatters,\n  components,\n  ...props\n}: React.ComponentProps<typeof DayPicker> & {\n  buttonVariant?: React.ComponentProps<typeof Button>['variant'];\n}) {\n  const defaultClassNames = getDefaultClassNames();\n\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      className={cn(\n        `bg-background group/calendar p-3 [--cell-size:2rem]\n        [[data-slot=card-content]_&]:bg-transparent\n        [[data-slot=popover-content]_&]:bg-transparent`,\n        String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\n        String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\n        className,\n      )}\n      captionLayout={captionLayout}\n      formatters={{\n        formatMonthDropdown: date =>\n          date.toLocaleString('default', { month: 'short' }),\n        ...formatters,\n      }}\n      classNames={{\n        root: cn('w-fit', defaultClassNames.root),\n        months: cn(\n          'relative flex flex-col gap-4 md:flex-row',\n          defaultClassNames.months,\n        ),\n        month: cn('flex w-full flex-col gap-4', defaultClassNames.month),\n        nav: cn(\n          'absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1',\n          defaultClassNames.nav,\n        ),\n        button_previous: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'h-(--cell-size) w-(--cell-size) select-none p-0 aria-disabled:opacity-50',\n          defaultClassNames.button_previous,\n        ),\n        button_next: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'h-(--cell-size) w-(--cell-size) select-none p-0 aria-disabled:opacity-50',\n          defaultClassNames.button_next,\n        ),\n        month_caption: cn(\n          'flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)',\n          defaultClassNames.month_caption,\n        ),\n        dropdowns: cn(\n          'flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium',\n          defaultClassNames.dropdowns,\n        ),\n        dropdown_root: cn(\n          `has-focus:border-ring border-input shadow-xs\n          has-focus:ring-ring/50 has-focus:ring-[3px] relative rounded-md\n          border`,\n          defaultClassNames.dropdown_root,\n        ),\n        dropdown: cn(\n          'bg-popover absolute inset-0 opacity-0',\n          defaultClassNames.dropdown,\n        ),\n        caption_label: cn(\n          'select-none font-medium',\n          captionLayout === 'label'\n            ? 'text-sm'\n            : `[&>svg]:text-muted-foreground flex h-8 items-center gap-1\n              rounded-md pl-2 pr-1 text-sm [&>svg]:size-3.5`,\n          defaultClassNames.caption_label,\n        ),\n        month_grid: cn('w-full border-collapse', defaultClassNames.month_grid),\n        weekdays: cn('flex', defaultClassNames.weekdays),\n        weekday: cn(\n          'text-muted-foreground flex-1 select-none rounded-md text-[0.8rem] font-normal',\n          defaultClassNames.weekday,\n        ),\n        week: cn('mt-2 flex w-full', defaultClassNames.week),\n        week_number_header: cn(\n          'w-(--cell-size) select-none',\n          defaultClassNames.week_number_header,\n        ),\n        week_number: cn(\n          'text-muted-foreground select-none text-[0.8rem]',\n          defaultClassNames.week_number,\n        ),\n        day: cn(\n          `group/day relative aspect-square h-full w-full select-none p-0\n          text-center [&:first-child[data-selected=true]_button]:rounded-l-md\n          [&:last-child[data-selected=true]_button]:rounded-r-md`,\n          defaultClassNames.day,\n        ),\n        range_start: cn(\n          'bg-accent rounded-l-md',\n          defaultClassNames.range_start,\n        ),\n        range_middle: cn('rounded-none', defaultClassNames.range_middle),\n        range_end: cn('bg-accent rounded-r-md', defaultClassNames.range_end),\n        today: cn(\n          'bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none',\n          defaultClassNames.today,\n        ),\n        outside: cn(\n          'text-muted-foreground aria-selected:text-muted-foreground',\n          defaultClassNames.outside,\n        ),\n        disabled: cn(\n          'text-muted-foreground opacity-50',\n          defaultClassNames.disabled,\n        ),\n        hidden: cn('invisible', defaultClassNames.hidden),\n        ...classNames,\n      }}\n      components={{\n        // eslint-disable-next-line react/prop-types -- typed via DayPicker's `components` prop, not local PropTypes\n        Root: ({ className, rootRef, ...props }) => {\n          return (\n            <div\n              data-slot=\"calendar\"\n              ref={rootRef}\n              className={cn(className)}\n              {...props}\n            />\n          );\n        },\n        // eslint-disable-next-line react/prop-types -- typed via DayPicker's `components` prop, not local PropTypes\n        Chevron: ({ className, orientation, ...props }) => {\n          if (orientation === 'left') {\n            return (\n              <ChevronLeftIcon className={cn('size-4', className)} {...props} />\n            );\n          }\n\n          if (orientation === 'right') {\n            return (\n              <ChevronRightIcon\n                className={cn('size-4', className)}\n                {...props}\n              />\n            );\n          }\n\n          return (\n            <ChevronDownIcon className={cn('size-4', className)} {...props} />\n          );\n        },\n        DayButton: CalendarDayButton,\n        WeekNumber: ({ children, ...props }) => {\n          return (\n            <td {...props}>\n              <div\n                className=\"flex size-(--cell-size) items-center justify-center\n                  text-center\"\n              >\n                {children}\n              </div>\n            </td>\n          );\n        },\n        ...components,\n      }}\n      {...props}\n    />\n  );\n}\n\nfunction CalendarDayButton({\n  className,\n  day,\n  modifiers,\n  ...props\n}: React.ComponentProps<typeof DayButton>) {\n  const defaultClassNames = getDefaultClassNames();\n\n  const ref = React.useRef<HTMLButtonElement>(null);\n  React.useEffect(() => {\n    if (modifiers.focused) ref.current?.focus();\n  }, [modifiers.focused]);\n\n  return (\n    <Button\n      ref={ref}\n      variant=\"ghost\"\n      size=\"icon\"\n      data-day={day.date.toLocaleDateString()}\n      data-selected-single={\n        modifiers.selected &&\n        !modifiers.range_start &&\n        !modifiers.range_end &&\n        !modifiers.range_middle\n      }\n      data-range-start={modifiers.range_start}\n      data-range-end={modifiers.range_end}\n      data-range-middle={modifiers.range_middle}\n      className={cn(\n        `data-[selected-single=true]:bg-primary\n        data-[selected-single=true]:text-primary-foreground\n        data-[range-middle=true]:bg-accent\n        data-[range-middle=true]:text-accent-foreground\n        data-[range-start=true]:bg-primary\n        data-[range-start=true]:text-primary-foreground\n        data-[range-end=true]:bg-primary\n        data-[range-end=true]:text-primary-foreground\n        group-data-[focused=true]/day:border-ring\n        group-data-[focused=true]/day:ring-ring/50 flex aspect-square h-auto\n        w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal\n        group-data-[focused=true]/day:relative\n        group-data-[focused=true]/day:z-10\n        group-data-[focused=true]/day:ring-[3px]\n        data-[range-end=true]:rounded-md data-[range-middle=true]:rounded-none\n        data-[range-start=true]:rounded-md [&>span]:text-xs [&>span]:opacity-70`,\n        defaultClassNames.day,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Calendar, CalendarDayButton };\n"],"mappings":"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"}
+{"version":3,"file":"calendar.mjs","names":["React"],"sources":["../../src/core/calendar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { DayButton, DayPicker, getDefaultClassNames } from 'react-day-picker';\n\nimport {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n} from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { Button, buttonVariants } from './button';\n\nfunction Calendar({\n  className,\n  classNames,\n  showOutsideDays = true,\n  captionLayout = 'label',\n  buttonVariant = 'ghost',\n  formatters,\n  components,\n  ...props\n}: React.ComponentProps<typeof DayPicker> & {\n  buttonVariant?: React.ComponentProps<typeof Button>['variant'];\n}) {\n  const defaultClassNames = getDefaultClassNames();\n\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      className={cn(\n        `bg-background group/calendar p-3 [--cell-size:2rem]\n        [[data-slot=card-content]_&]:bg-transparent\n        [[data-slot=popover-content]_&]:bg-transparent\n        [[data-slot=popover-content]_&]:p-0`,\n        String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\n        String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\n        className,\n      )}\n      captionLayout={captionLayout}\n      formatters={{\n        formatMonthDropdown: date =>\n          date.toLocaleString('default', { month: 'short' }),\n        ...formatters,\n      }}\n      classNames={{\n        root: cn('w-fit', defaultClassNames.root),\n        months: cn(\n          'relative flex flex-col gap-4 md:flex-row',\n          defaultClassNames.months,\n        ),\n        month: cn('flex w-full flex-col gap-4', defaultClassNames.month),\n        nav: cn(\n          'absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1',\n          defaultClassNames.nav,\n        ),\n        button_previous: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'h-(--cell-size) w-(--cell-size) select-none p-0 aria-disabled:opacity-50',\n          defaultClassNames.button_previous,\n        ),\n        button_next: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'h-(--cell-size) w-(--cell-size) select-none p-0 aria-disabled:opacity-50',\n          defaultClassNames.button_next,\n        ),\n        month_caption: cn(\n          'flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)',\n          defaultClassNames.month_caption,\n        ),\n        dropdowns: cn(\n          'flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium',\n          defaultClassNames.dropdowns,\n        ),\n        dropdown_root: cn(\n          `has-focus:border-ring border-input shadow-xs\n          has-focus:ring-ring/50 has-focus:ring-[3px] relative rounded-md\n          border`,\n          defaultClassNames.dropdown_root,\n        ),\n        dropdown: cn(\n          'bg-popover absolute inset-0 opacity-0',\n          defaultClassNames.dropdown,\n        ),\n        caption_label: cn(\n          'select-none font-medium',\n          captionLayout === 'label'\n            ? 'text-sm'\n            : `[&>svg]:text-muted-foreground flex h-8 items-center gap-1\n              rounded-md pl-2 pr-1 text-sm [&>svg]:size-3.5`,\n          defaultClassNames.caption_label,\n        ),\n        month_grid: cn('w-full border-collapse', defaultClassNames.month_grid),\n        weekdays: cn('flex', defaultClassNames.weekdays),\n        weekday: cn(\n          'text-muted-foreground flex-1 select-none rounded-md text-[0.8rem] font-normal',\n          defaultClassNames.weekday,\n        ),\n        week: cn('mt-2 flex w-full', defaultClassNames.week),\n        week_number_header: cn(\n          'w-(--cell-size) select-none',\n          defaultClassNames.week_number_header,\n        ),\n        week_number: cn(\n          'text-muted-foreground select-none text-[0.8rem]',\n          defaultClassNames.week_number,\n        ),\n        day: cn(\n          `group/day relative aspect-square h-full w-full select-none p-0\n          text-center [&:first-child[data-selected=true]_button]:rounded-l-md\n          [&:last-child[data-selected=true]_button]:rounded-r-md`,\n          defaultClassNames.day,\n        ),\n        range_start: cn(\n          'bg-accent rounded-l-md',\n          defaultClassNames.range_start,\n        ),\n        range_middle: cn('rounded-none', defaultClassNames.range_middle),\n        range_end: cn('bg-accent rounded-r-md', defaultClassNames.range_end),\n        today: cn(\n          'bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none',\n          defaultClassNames.today,\n        ),\n        outside: cn(\n          'text-muted-foreground aria-selected:text-muted-foreground',\n          defaultClassNames.outside,\n        ),\n        disabled: cn(\n          'text-muted-foreground opacity-50',\n          defaultClassNames.disabled,\n        ),\n        hidden: cn('invisible', defaultClassNames.hidden),\n        ...classNames,\n      }}\n      components={{\n        // eslint-disable-next-line react/prop-types -- typed via DayPicker's `components` prop, not local PropTypes\n        Root: ({ className, rootRef, ...props }) => {\n          return (\n            <div\n              data-slot=\"calendar\"\n              ref={rootRef}\n              className={cn(className)}\n              {...props}\n            />\n          );\n        },\n        // eslint-disable-next-line react/prop-types -- typed via DayPicker's `components` prop, not local PropTypes\n        Chevron: ({ className, orientation, ...props }) => {\n          if (orientation === 'left') {\n            return (\n              <ChevronLeftIcon className={cn('size-4', className)} {...props} />\n            );\n          }\n\n          if (orientation === 'right') {\n            return (\n              <ChevronRightIcon\n                className={cn('size-4', className)}\n                {...props}\n              />\n            );\n          }\n\n          return (\n            <ChevronDownIcon className={cn('size-4', className)} {...props} />\n          );\n        },\n        DayButton: CalendarDayButton,\n        WeekNumber: ({ children, ...props }) => {\n          return (\n            <td {...props}>\n              <div\n                className=\"flex size-(--cell-size) items-center justify-center\n                  text-center\"\n              >\n                {children}\n              </div>\n            </td>\n          );\n        },\n        ...components,\n      }}\n      {...props}\n    />\n  );\n}\n\nfunction CalendarDayButton({\n  className,\n  day,\n  modifiers,\n  ...props\n}: React.ComponentProps<typeof DayButton>) {\n  const defaultClassNames = getDefaultClassNames();\n\n  const ref = React.useRef<HTMLButtonElement>(null);\n  React.useEffect(() => {\n    if (modifiers.focused) ref.current?.focus();\n  }, [modifiers.focused]);\n\n  return (\n    <Button\n      ref={ref}\n      variant=\"ghost\"\n      size=\"icon\"\n      data-day={day.date.toLocaleDateString()}\n      data-selected-single={\n        modifiers.selected &&\n        !modifiers.range_start &&\n        !modifiers.range_end &&\n        !modifiers.range_middle\n      }\n      data-range-start={modifiers.range_start}\n      data-range-end={modifiers.range_end}\n      data-range-middle={modifiers.range_middle}\n      className={cn(\n        `data-[selected-single=true]:bg-primary\n        data-[selected-single=true]:text-primary-foreground\n        data-[range-middle=true]:bg-accent\n        data-[range-middle=true]:text-accent-foreground\n        data-[range-start=true]:bg-primary\n        data-[range-start=true]:text-primary-foreground\n        data-[range-end=true]:bg-primary\n        data-[range-end=true]:text-primary-foreground\n        group-data-[focused=true]/day:border-ring\n        group-data-[focused=true]/day:ring-ring/50 flex aspect-square h-auto\n        w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal\n        group-data-[focused=true]/day:relative\n        group-data-[focused=true]/day:z-10\n        group-data-[focused=true]/day:ring-[3px]\n        data-[range-end=true]:rounded-md data-[range-middle=true]:rounded-none\n        data-[range-start=true]:rounded-md [&>span]:text-xs [&>span]:opacity-70`,\n        defaultClassNames.day,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Calendar, CalendarDayButton };\n"],"mappings":";;;;;;;;;;;;;AAeA,SAAS,SAAS,EAChB,WACA,YACA,kBAAkB,MAClB,gBAAgB,SAChB,gBAAgB,SAChB,YACA,YACA,GAAG,SAGF;CACD,MAAM,oBAAoB,qBAAqB;CAE/C,OACE,oBAAC,WAAD;EACmB;EACjB,WAAW,GACT;;;8CAIA,OAAO,GAAG,6CACV,OAAO,GAAG,iDACV,SACF;EACe;EACf,YAAY;GACV,sBAAqB,SACnB,KAAK,eAAe,WAAW,EAAE,OAAO,QAAQ,CAAC;GACnD,GAAG;EACL;EACA,YAAY;GACV,MAAM,GAAG,SAAS,kBAAkB,IAAI;GACxC,QAAQ,GACN,4CACA,kBAAkB,MACpB;GACA,OAAO,GAAG,8BAA8B,kBAAkB,KAAK;GAC/D,KAAK,GACH,2EACA,kBAAkB,GACpB;GACA,iBAAiB,GACf,eAAe,EAAE,SAAS,cAAc,CAAC,GACzC,4EACA,kBAAkB,eACpB;GACA,aAAa,GACX,eAAe,EAAE,SAAS,cAAc,CAAC,GACzC,4EACA,kBAAkB,WACpB;GACA,eAAe,GACb,4EACA,kBAAkB,aACpB;GACA,WAAW,GACT,uFACA,kBAAkB,SACpB;GACA,eAAe,GACb;;mBAGA,kBAAkB,aACpB;GACA,UAAU,GACR,yCACA,kBAAkB,QACpB;GACA,eAAe,GACb,2BACA,kBAAkB,UACd,YACA;8DAEJ,kBAAkB,aACpB;GACA,YAAY,GAAG,0BAA0B,kBAAkB,UAAU;GACrE,UAAU,GAAG,QAAQ,kBAAkB,QAAQ;GAC/C,SAAS,GACP,iFACA,kBAAkB,OACpB;GACA,MAAM,GAAG,oBAAoB,kBAAkB,IAAI;GACnD,oBAAoB,GAClB,+BACA,kBAAkB,kBACpB;GACA,aAAa,GACX,mDACA,kBAAkB,WACpB;GACA,KAAK,GACH;;mEAGA,kBAAkB,GACpB;GACA,aAAa,GACX,0BACA,kBAAkB,WACpB;GACA,cAAc,GAAG,gBAAgB,kBAAkB,YAAY;GAC/D,WAAW,GAAG,0BAA0B,kBAAkB,SAAS;GACnE,OAAO,GACL,iFACA,kBAAkB,KACpB;GACA,SAAS,GACP,6DACA,kBAAkB,OACpB;GACA,UAAU,GACR,oCACA,kBAAkB,QACpB;GACA,QAAQ,GAAG,aAAa,kBAAkB,MAAM;GAChD,GAAG;EACL;EACA,YAAY;GAEV,OAAO,EAAE,WAAW,SAAS,GAAG,YAAY;IAC1C,OACE,oBAAC,OAAD;KACE,aAAU;KACV,KAAK;KACL,WAAW,GAAG,SAAS;KACvB,GAAI;IACL,CAAA;GAEL;GAEA,UAAU,EAAE,WAAW,aAAa,GAAG,YAAY;IACjD,IAAI,gBAAgB,QAClB,OACE,oBAAC,iBAAD;KAAiB,WAAW,GAAG,UAAU,SAAS;KAAG,GAAI;IAAQ,CAAA;IAIrE,IAAI,gBAAgB,SAClB,OACE,oBAAC,kBAAD;KACE,WAAW,GAAG,UAAU,SAAS;KACjC,GAAI;IACL,CAAA;IAIL,OACE,oBAAC,iBAAD;KAAiB,WAAW,GAAG,UAAU,SAAS;KAAG,GAAI;IAAQ,CAAA;GAErE;GACA,WAAW;GACX,aAAa,EAAE,UAAU,GAAG,YAAY;IACtC,OACE,oBAAC,MAAD;KAAI,GAAI;KACN,UAAA,oBAAC,OAAD;MACE,WAAU;MAGT;KACE,CAAA;IACH,CAAA;GAER;GACA,GAAG;EACL;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,KACA,WACA,GAAG,SACsC;CACzC,MAAM,oBAAoB,qBAAqB;CAE/C,MAAM,MAAMA,QAAM,OAA0B,IAAI;CAChD,QAAM,gBAAgB;EACpB,IAAI,UAAU,SAAS,IAAI,SAAS,MAAM;CAC5C,GAAG,CAAC,UAAU,OAAO,CAAC;CAEtB,OACE,oBAAC,QAAD;EACO;EACL,SAAQ;EACR,MAAK;EACL,YAAU,IAAI,KAAK,mBAAmB;EACtC,wBACE,UAAU,YACV,CAAC,UAAU,eACX,CAAC,UAAU,aACX,CAAC,UAAU;EAEb,oBAAkB,UAAU;EAC5B,kBAAgB,UAAU;EAC1B,qBAAmB,UAAU;EAC7B,WAAW,GACT;;;;;;;;;;;;;;;kFAgBA,kBAAkB,KAClB,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/core/checkbox.d.mts

@@ -1,2 +1,2 @@
 import "react";
-import "@radix-ui/react-checkbox";
+import { Checkbox } from "@base-ui/react/checkbox";

package/dist/core/checkbox.mjs

@@ -4,22 +4,22 @@ import { cn } from "../utils.mjs";
 import "react";
 import { CheckIcon } from "lucide-react";
 import { jsx } from "react/jsx-runtime";
-import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { Checkbox } from "@base-ui/react/checkbox";
 //#region src/core/checkbox.tsx
-var checkbox_exports = /* @__PURE__ */ __exportAll({ Checkbox: () => Checkbox });
-function Checkbox({ className, ...props }) {
-	return /* @__PURE__ */ jsx(CheckboxPrimitive.Root, {
+var checkbox_exports = /* @__PURE__ */ __exportAll({ Checkbox: () => Checkbox$1 });
+function Checkbox$1({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Checkbox.Root, {
 		"data-slot": "checkbox",
-		className: cn(`peer border-input dark:bg-input/30 data-[state=checked]:bg-primary
-        data-[state=checked]:text-primary-foreground
-        dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary
-        focus-visible:border-ring focus-visible:ring-ring/50
-        aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40
-        aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border
-        shadow-xs transition-shadow outline-none focus-visible:ring-[3px]
-        disabled:cursor-not-allowed disabled:opacity-50`, className),
+		className: cn(`peer border-input dark:bg-input/30 data-checked:bg-primary
+        data-checked:text-primary-foreground dark:data-checked:bg-primary
+        data-checked:border-primary focus-visible:border-ring
+        focus-visible:ring-ring/50 aria-invalid:ring-destructive/20
+        dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive
+        inline-flex size-4 shrink-0 items-center justify-center rounded-[4px]
+        border shadow-xs transition-shadow outline-none focus-visible:ring-[3px]
+        data-disabled:cursor-not-allowed data-disabled:opacity-50`, className),
 		...props,
-		children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, {
+		children: /* @__PURE__ */ jsx(Checkbox.Indicator, {
 			"data-slot": "checkbox-indicator",
 			className: "grid place-content-center text-current transition-none",
 			children: /* @__PURE__ */ jsx(CheckIcon, { className: "size-3.5" })
@@ -27,6 +27,6 @@ function Checkbox({ className, ...props }) {
 	});
 }
 //#endregion
-export { Checkbox, checkbox_exports };
+export { Checkbox$1 as Checkbox, checkbox_exports };
 
 //# sourceMappingURL=checkbox.mjs.map

package/dist/core/checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.mjs","names":[],"sources":["../../src/core/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport { CheckIcon } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nfunction Checkbox({\n  className,\n  ...props\n}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {\n  return (\n    <CheckboxPrimitive.Root\n      data-slot=\"checkbox\"\n      className={cn(\n        `peer border-input dark:bg-input/30 data-[state=checked]:bg-primary\n        data-[state=checked]:text-primary-foreground\n        dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary\n        focus-visible:border-ring focus-visible:ring-ring/50\n        aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40\n        aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border\n        shadow-xs transition-shadow outline-none focus-visible:ring-[3px]\n        disabled:cursor-not-allowed disabled:opacity-50`,\n        className,\n      )}\n      {...props}\n    >\n      <CheckboxPrimitive.Indicator\n        data-slot=\"checkbox-indicator\"\n        className=\"grid place-content-center text-current transition-none\"\n      >\n        <CheckIcon className=\"size-3.5\" />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  );\n}\n\nexport { Checkbox };\n"],"mappings":";;;;;;;;;AASA,SAAS,SAAS,EAChB,WACA,GAAG,SACmD;CACtD,OACE,oBAAC,kBAAkB,MAAnB;EACE,aAAU;EACV,WAAW,GACT;;;;;;;0DAQA,SACF;EACA,GAAI;EAEJ,UAAA,oBAAC,kBAAkB,WAAnB;GACE,aAAU;GACV,WAAU;GAEV,UAAA,oBAAC,WAAD,EAAW,WAAU,WAAY,CAAA;EACN,CAAA;CACP,CAAA;AAE5B"}
+{"version":3,"file":"checkbox.mjs","names":["Checkbox","CheckboxPrimitive"],"sources":["../../src/core/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { Checkbox as CheckboxPrimitive } from '@base-ui/react/checkbox';\nimport { CheckIcon } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\n// Base UI primitive with repo-owned styling; no longer vendored from shadcn.\nfunction Checkbox({\n  className,\n  ...props\n}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {\n  return (\n    <CheckboxPrimitive.Root\n      data-slot=\"checkbox\"\n      className={cn(\n        `peer border-input dark:bg-input/30 data-checked:bg-primary\n        data-checked:text-primary-foreground dark:data-checked:bg-primary\n        data-checked:border-primary focus-visible:border-ring\n        focus-visible:ring-ring/50 aria-invalid:ring-destructive/20\n        dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\n        inline-flex size-4 shrink-0 items-center justify-center rounded-[4px]\n        border shadow-xs transition-shadow outline-none focus-visible:ring-[3px]\n        data-disabled:cursor-not-allowed data-disabled:opacity-50`,\n        className,\n        //\n      )}\n      {...props}\n    >\n      <CheckboxPrimitive.Indicator\n        data-slot=\"checkbox-indicator\"\n        className=\"grid place-content-center text-current transition-none\"\n      >\n        <CheckIcon className=\"size-3.5\" />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  );\n}\n\nexport { Checkbox };\n"],"mappings":";;;;;;;;;AAUA,SAASA,WAAS,EAChB,WACA,GAAG,SACmD;CACtD,OACE,oBAACC,SAAkB,MAAnB;EACE,aAAU;EACV,WAAW,GACT;;;;;;;oEAQA,SAEF;EACA,GAAI;EAEJ,UAAA,oBAACA,SAAkB,WAAnB;GACE,aAAU;GACV,WAAU;GAEV,UAAA,oBAAC,WAAD,EAAW,WAAU,WAAY,CAAA;EACN,CAAA;CACP,CAAA;AAE5B"}

package/dist/core/dialog.d.mts

@@ -1,2 +1,2 @@
 import "react";
-import "@radix-ui/react-dialog";
+import { Dialog } from "@base-ui/react/dialog";

package/dist/core/dialog.mjs

@@ -7,10 +7,10 @@ import Button from "../Button.mjs";
 import "react";
 import { XIcon } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { Dialog } from "@base-ui/react/dialog";
 //#region src/core/dialog.tsx
 var dialog_exports = /* @__PURE__ */ __exportAll({
-	Dialog: () => Dialog,
+	Dialog: () => Dialog$1,
 	DialogClose: () => DialogClose,
 	DialogContent: () => DialogContent,
 	DialogDescription: () => DialogDescription,
@@ -21,45 +21,41 @@ var dialog_exports = /* @__PURE__ */ __exportAll({
 	DialogTitle: () => DialogTitle,
 	DialogTrigger: () => DialogTrigger
 });
-function Dialog({ ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Root, {
+function Dialog$1({ ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Root, {
 		"data-slot": "dialog",
 		...props
 	});
 }
 function DialogTrigger({ ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Trigger, {
+	return /* @__PURE__ */ jsx(Dialog.Trigger, {
 		"data-slot": "dialog-trigger",
 		...props
 	});
 }
 function DialogPortal({ ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Portal, {
-		"data-slot": "dialog-portal",
-		...props
-	});
+	return /* @__PURE__ */ jsx(Dialog.Portal, { ...props });
 }
 function DialogClose({ ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Close, {
+	return /* @__PURE__ */ jsx(Dialog.Close, {
 		"data-slot": "dialog-close",
 		...props
 	});
 }
 function DialogOverlay({ className, ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Overlay, {
+	return /* @__PURE__ */ jsx(Dialog.Backdrop, {
 		"data-slot": "dialog-overlay",
-		className: cn(`data-[state=open]:animate-in data-[state=closed]:animate-out
-        data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0
-        bg-black/50`, OVERLAY_LAYER, className),
+		className: cn(`fixed inset-0 bg-black/50 transition-opacity duration-200
+        data-ending-style:opacity-0 data-starting-style:opacity-0`, OVERLAY_LAYER, className),
 		...props
 	});
 }
 function DialogContent({ className, children, classNames, closeIcon: _closeIcon, closable, container, ...props }) {
 	const { getContainer } = useConfig();
 	const resolvedContainer = container ?? getContainer();
-	const closeIcon = /* @__PURE__ */ jsxs(DialogPrimitive.Close, {
+	const closeIcon = /* @__PURE__ */ jsxs(Dialog.Close, {
 		"data-slot": "dialog-close",
-		className: "ring-offset-background focus:ring-ring\n        data-[state=open]:bg-accent data-[state=open]:text-muted-foreground\n        absolute top-4 right-4 rounded-xs opacity-70 transition-opacity\n        hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden\n        disabled:pointer-events-none [&_svg]:pointer-events-none\n        [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+		className: "ring-offset-background focus:ring-ring data-open:bg-accent\n        data-open:text-muted-foreground absolute top-4 right-4 rounded-xs\n        opacity-70 transition-opacity hover:opacity-100 focus:ring-2\n        focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none\n        [&_svg]:pointer-events-none [&_svg]:shrink-0\n        [&_svg:not([class*='size-'])]:size-4",
 		disabled: typeof closable === "object" && closable.disabled,
 		children: [_closeIcon || /* @__PURE__ */ jsx(XIcon, {}), /* @__PURE__ */ jsx("span", {
 			className: "sr-only",
@@ -67,16 +63,15 @@ function DialogContent({ className, children, classNames, closeIcon: _closeIcon,
 		})]
 	});
 	return /* @__PURE__ */ jsxs(DialogPortal, {
-		"data-slot": "dialog-portal",
 		container: resolvedContainer,
-		children: [/* @__PURE__ */ jsx(DialogOverlay, { className: cn(classNames?.mask) }), /* @__PURE__ */ jsxs(DialogPrimitive.Content, {
+		children: [/* @__PURE__ */ jsx(DialogOverlay, { className: cn(classNames?.mask) }), /* @__PURE__ */ jsxs(Dialog.Popup, {
 			"data-slot": "dialog-content",
-			className: cn(`bg-background data-[state=open]:animate-in
-          data-[state=closed]:animate-out data-[state=closed]:fade-out-0
-          data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95
-          data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] grid w-full
+			className: cn(`bg-background fixed top-[50%] left-[50%] grid w-full
           max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4
-          rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg`, OVERLAY_LAYER, className),
+          rounded-lg border p-6 shadow-lg transition-[opacity,transform]
+          duration-200 outline-none data-ending-style:scale-95
+          data-ending-style:opacity-0 data-starting-style:scale-95
+          data-starting-style:opacity-0 sm:max-w-lg`, OVERLAY_LAYER, className),
 			...props,
 			children: [children, closable && closeIcon]
 		})]
@@ -94,30 +89,27 @@ function DialogFooter({ className, showCloseButton = false, children, ...props }
 		"data-slot": "dialog-footer",
 		className: cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
 		...props,
-		children: [children, showCloseButton && /* @__PURE__ */ jsx(DialogPrimitive.Close, {
-			asChild: true,
-			children: /* @__PURE__ */ jsx(Button, {
-				variant: "outlined",
-				children: "Close"
-			})
-		})]
+		children: [children, showCloseButton && /* @__PURE__ */ jsx(Dialog.Close, { render: /* @__PURE__ */ jsx(Button, {
+			variant: "outlined",
+			children: "Close"
+		}) })]
 	});
 }
 function DialogTitle({ className, ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Title, {
+	return /* @__PURE__ */ jsx(Dialog.Title, {
 		"data-slot": "dialog-title",
 		className: cn("text-lg leading-none font-semibold", className),
 		...props
 	});
 }
 function DialogDescription({ className, ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Description, {
+	return /* @__PURE__ */ jsx(Dialog.Description, {
 		"data-slot": "dialog-description",
 		className: cn("text-muted-foreground text-sm", className),
 		...props
 	});
 }
 //#endregion
-export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, dialog_exports };
+export { Dialog$1 as Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, dialog_exports };
 
 //# sourceMappingURL=dialog.mjs.map

package/dist/core/dialog.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.mjs","names":[],"sources":["../../src/core/dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { XIcon } from 'lucide-react';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../components/atoms/button';\nimport { OVERLAY_LAYER } from '../lib/z-layers';\n\n/*\n * Vendored from shadcn's `new-york-v4` dialog registry entry.\n *\n * Local patches — re-apply these after any `shadcn add dialog`:\n * 1. Imports: `DialogPrimitive` from `@radix-ui/react-dialog` (upstream uses\n *    the unified `radix-ui` package, which this repo doesn't install), `cn`\n *    from `@repo/ui/utils`, and `Button` from `../components/atoms/button`\n *    (used by `DialogFooter`'s close button).\n * 2. `OVERLAY_LAYER` (src/lib/z-layers.ts) replaces upstream's `z-50` on\n *    `DialogOverlay` and `DialogContent`. Why: this package is published and\n *    can't assume it owns the app's z-index scale — see #359.\n * 3. `DialogContent` takes a `container` prop, defaulted to\n *    `useConfig().getContainer()`, and passes it to `DialogPortal`. Why:\n *    portalled content must stay inside the themed wrapper, or dark mode and\n *    the CSS custom properties don't reach it.\n * 4. `DialogContent` replaces upstream's `showCloseButton?: boolean` with\n *    `CustomContentProps` (`classNames`, `closeIcon`, `closable`, `container`):\n *    the close button is gated by `closable` (and `closable.disabled`) and\n *    renders a caller-supplied `closeIcon`, and `classNames.mask` is forwarded\n *    to the overlay.\n * 5. `DialogFooter`'s close button uses this library's Button vocabulary\n *    (`variant=\"outlined\"`; upstream says `\"outline\"`).\n *\n * The rest of what `shadcn add dialog --diff` reports is Tailwind class\n * ordering and prettier line-wrapping from this repo's formatter, not a patch.\n */\nfunction Dialog({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Root>) {\n  return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />;\n}\n\nfunction DialogTrigger({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />;\n}\n\nfunction DialogPortal({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n  return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />;\n}\n\nfunction DialogClose({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Close>) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />;\n}\n\nfunction DialogOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n  return (\n    <DialogPrimitive.Overlay\n      data-slot=\"dialog-overlay\"\n      className={cn(\n        `data-[state=open]:animate-in data-[state=closed]:animate-out\n        data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0\n        bg-black/50`,\n        OVERLAY_LAYER,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\ninterface CustomContentProps {\n  classNames?: Record<string, string>;\n  closeIcon?: React.ReactNode;\n  closable?: boolean | { disabled?: boolean };\n  container?: HTMLElement;\n}\n\nfunction DialogContent({\n  className,\n  children,\n  classNames,\n  closeIcon: _closeIcon,\n  closable,\n  container,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Content> & CustomContentProps) {\n  const { getContainer } = useConfig();\n  const resolvedContainer = container ?? getContainer();\n\n  const closeIcon = (\n    <DialogPrimitive.Close\n      data-slot=\"dialog-close\"\n      className=\"ring-offset-background focus:ring-ring\n        data-[state=open]:bg-accent data-[state=open]:text-muted-foreground\n        absolute top-4 right-4 rounded-xs opacity-70 transition-opacity\n        hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden\n        disabled:pointer-events-none [&_svg]:pointer-events-none\n        [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\"\n      disabled={typeof closable === 'object' && closable.disabled}\n    >\n      {_closeIcon || <XIcon />}\n      <span className=\"sr-only\">Close</span>\n    </DialogPrimitive.Close>\n  );\n\n  return (\n    <DialogPortal data-slot=\"dialog-portal\" container={resolvedContainer}>\n      <DialogOverlay className={cn(classNames?.mask)} />\n      <DialogPrimitive.Content\n        data-slot=\"dialog-content\"\n        className={cn(\n          `bg-background data-[state=open]:animate-in\n          data-[state=closed]:animate-out data-[state=closed]:fade-out-0\n          data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95\n          data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] grid w-full\n          max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4\n          rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg`,\n          OVERLAY_LAYER,\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {closable && closeIcon}\n      </DialogPrimitive.Content>\n    </DialogPortal>\n  );\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"dialog-header\"\n      className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DialogFooter({\n  className,\n  showCloseButton = false,\n  children,\n  ...props\n}: React.ComponentProps<'div'> & {\n  showCloseButton?: boolean;\n}) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(\n        'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {showCloseButton && (\n        <DialogPrimitive.Close asChild>\n          <Button variant=\"outlined\">Close</Button>\n        </DialogPrimitive.Close>\n      )}\n    </div>\n  );\n}\n\nfunction DialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Title>) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"dialog-title\"\n      className={cn('text-lg leading-none font-semibold', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Description>) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={cn('text-muted-foreground text-sm', className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuCA,SAAS,OAAO,EACd,GAAG,SACiD;CACpD,OAAO,oBAAC,gBAAgB,MAAjB;EAAsB,aAAU;EAAS,GAAI;CAAQ,CAAA;AAC9D;AAEA,SAAS,cAAc,EACrB,GAAG,SACoD;CACvD,OAAO,oBAAC,gBAAgB,SAAjB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,aAAa,EACpB,GAAG,SACmD;CACtD,OAAO,oBAAC,gBAAgB,QAAjB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAEA,SAAS,YAAY,EACnB,GAAG,SACkD;CACrD,OAAO,oBAAC,gBAAgB,OAAjB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;CACvD,OACE,oBAAC,gBAAgB,SAAjB;EACE,aAAU;EACV,WAAW,GACT;;sBAGA,eACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AASA,SAAS,cAAc,EACrB,WACA,UACA,YACA,WAAW,YACX,UACA,WACA,GAAG,SACyE;CAC5E,MAAM,EAAE,iBAAiB,UAAU;CACnC,MAAM,oBAAoB,aAAa,aAAa;CAEpD,MAAM,YACJ,qBAAC,gBAAgB,OAAjB;EACE,aAAU;EACV,WAAU;EAMV,UAAU,OAAO,aAAa,YAAY,SAAS;EARrD,UAAA,CAUG,cAAc,oBAAC,OAAD,CAAQ,CAAA,GACvB,oBAAC,QAAD;GAAM,WAAU;GAAU,UAAA;EAAW,CAAA,CAChB;;CAGzB,OACE,qBAAC,cAAD;EAAc,aAAU;EAAgB,WAAW;EAAnD,UAAA,CACE,oBAAC,eAAD,EAAe,WAAW,GAAG,YAAY,IAAI,EAAI,CAAA,GACjD,qBAAC,gBAAgB,SAAjB;GACE,aAAU;GACV,WAAW,GACT;;;;;kFAMA,eACA,SACF;GACA,GAAI;GAZN,UAAA,CAcG,UACA,YAAY,SACU;EACb,CAAA,CAAA;;AAElB;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EACpB,WACA,kBAAkB,OAClB,UACA,GAAG,SAGF;CACD,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,0DACA,SACF;EACA,GAAI;EANN,UAAA,CAQG,UACA,mBACC,oBAAC,gBAAgB,OAAjB;GAAuB,SAAA;GACrB,UAAA,oBAAC,QAAD;IAAQ,SAAQ;IAAW,UAAA;GAAa,CAAA;EACnB,CAAA,CAEtB;;AAET;AAEA,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;CACrD,OACE,oBAAC,gBAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,oBAAC,gBAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"dialog.mjs","names":["Dialog","DialogPrimitive"],"sources":["../../src/core/dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { XIcon } from 'lucide-react';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../components/atoms/button';\nimport { OVERLAY_LAYER } from '../lib/z-layers';\n\n/*\n * Base UI primitives with repo-owned styling; no longer vendored from shadcn.\n *\n * Notes on the Radix → Base UI shape change:\n * - Radix's `Dialog.Overlay` becomes Base UI's `Dialog.Backdrop`, and\n *   `Dialog.Content` becomes `Dialog.Popup`.\n * - Open/close styling moves from Radix's `data-[state=open|closed]:animate-*`\n *   (inert here — this package never defined those keyframes) to Base UI's\n *   `data-starting-style`/`data-ending-style` transition hooks, which are plain\n *   Tailwind transitions and actually animate.\n * - Pointer-outside dismissal (antd's `maskClosable`) is a *root*-level concern\n *   in Base UI (`disablePointerDismissal`), not a Content event. See\n *   `organisms/modal`.\n *\n * Local patches retained from the shadcn version:\n * - `OVERLAY_LAYER` (src/lib/z-layers.ts) replaces upstream's `z-50` on the\n *   backdrop and popup — this package is published and can't own the app's\n *   z-index scale (#359).\n * - `DialogContent` takes a `container` prop (default `useConfig().getContainer()`)\n *   passed to the portal, so portalled content stays inside the themed wrapper.\n * - `DialogContent` exposes `closable`/`closeIcon`/`classNames.mask` instead of\n *   upstream's `showCloseButton`.\n * - `DialogFooter`'s close button uses this library's Button vocabulary.\n */\nfunction Dialog({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Root>) {\n  return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />;\n}\n\nfunction DialogTrigger({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />;\n}\n\nfunction DialogPortal({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n  return <DialogPrimitive.Portal {...props} />;\n}\n\nfunction DialogClose({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Close>) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />;\n}\n\nfunction DialogOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Backdrop>) {\n  return (\n    <DialogPrimitive.Backdrop\n      data-slot=\"dialog-overlay\"\n      className={cn(\n        `fixed inset-0 bg-black/50 transition-opacity duration-200\n        data-ending-style:opacity-0 data-starting-style:opacity-0`,\n        OVERLAY_LAYER,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\ninterface CustomContentProps {\n  classNames?: Record<string, string>;\n  closeIcon?: React.ReactNode;\n  closable?: boolean | { disabled?: boolean };\n  container?: HTMLElement;\n}\n\nfunction DialogContent({\n  className,\n  children,\n  classNames,\n  closeIcon: _closeIcon,\n  closable,\n  container,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Popup> & CustomContentProps) {\n  const { getContainer } = useConfig();\n  const resolvedContainer = container ?? getContainer();\n\n  const closeIcon = (\n    <DialogPrimitive.Close\n      data-slot=\"dialog-close\"\n      className=\"ring-offset-background focus:ring-ring data-open:bg-accent\n        data-open:text-muted-foreground absolute top-4 right-4 rounded-xs\n        opacity-70 transition-opacity hover:opacity-100 focus:ring-2\n        focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none\n        [&_svg]:pointer-events-none [&_svg]:shrink-0\n        [&_svg:not([class*='size-'])]:size-4\"\n      disabled={typeof closable === 'object' && closable.disabled}\n    >\n      {_closeIcon || <XIcon />}\n      <span className=\"sr-only\">Close</span>\n    </DialogPrimitive.Close>\n  );\n\n  return (\n    <DialogPortal container={resolvedContainer}>\n      <DialogOverlay className={cn(classNames?.mask)} />\n      <DialogPrimitive.Popup\n        data-slot=\"dialog-content\"\n        className={cn(\n          `bg-background fixed top-[50%] left-[50%] grid w-full\n          max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4\n          rounded-lg border p-6 shadow-lg transition-[opacity,transform]\n          duration-200 outline-none data-ending-style:scale-95\n          data-ending-style:opacity-0 data-starting-style:scale-95\n          data-starting-style:opacity-0 sm:max-w-lg`,\n          OVERLAY_LAYER,\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {closable && closeIcon}\n      </DialogPrimitive.Popup>\n    </DialogPortal>\n  );\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"dialog-header\"\n      className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DialogFooter({\n  className,\n  showCloseButton = false,\n  children,\n  ...props\n}: React.ComponentProps<'div'> & {\n  showCloseButton?: boolean;\n}) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(\n        'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {showCloseButton && (\n        <DialogPrimitive.Close\n          render={<Button variant=\"outlined\">Close</Button>}\n        />\n      )}\n    </div>\n  );\n}\n\nfunction DialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Title>) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"dialog-title\"\n      className={cn('text-lg leading-none font-semibold', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Description>) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={cn('text-muted-foreground text-sm', className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAqCA,SAASA,SAAO,EACd,GAAG,SACiD;CACpD,OAAO,oBAACC,OAAgB,MAAjB;EAAsB,aAAU;EAAS,GAAI;CAAQ,CAAA;AAC9D;AAEA,SAAS,cAAc,EACrB,GAAG,SACoD;CACvD,OAAO,oBAACA,OAAgB,SAAjB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,aAAa,EACpB,GAAG,SACmD;CACtD,OAAO,oBAACA,OAAgB,QAAjB,EAAwB,GAAI,MAAQ,CAAA;AAC7C;AAEA,SAAS,YAAY,EACnB,GAAG,SACkD;CACrD,OAAO,oBAACA,OAAgB,OAAjB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,cAAc,EACrB,WACA,GAAG,SACqD;CACxD,OACE,oBAACA,OAAgB,UAAjB;EACE,aAAU;EACV,WAAW,GACT;oEAEA,eACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AASA,SAAS,cAAc,EACrB,WACA,UACA,YACA,WAAW,YACX,UACA,WACA,GAAG,SACuE;CAC1E,MAAM,EAAE,iBAAiB,UAAU;CACnC,MAAM,oBAAoB,aAAa,aAAa;CAEpD,MAAM,YACJ,qBAACA,OAAgB,OAAjB;EACE,aAAU;EACV,WAAU;EAMV,UAAU,OAAO,aAAa,YAAY,SAAS;EARrD,UAAA,CAUG,cAAc,oBAAC,OAAD,CAAQ,CAAA,GACvB,oBAAC,QAAD;GAAM,WAAU;GAAU,UAAA;EAAW,CAAA,CAChB;;CAGzB,OACE,qBAAC,cAAD;EAAc,WAAW;EAAzB,UAAA,CACE,oBAAC,eAAD,EAAe,WAAW,GAAG,YAAY,IAAI,EAAI,CAAA,GACjD,qBAACA,OAAgB,OAAjB;GACE,aAAU;GACV,WAAW,GACT;;;;;sDAMA,eACA,SACF;GACA,GAAI;GAZN,UAAA,CAcG,UACA,YAAY,SACQ;EACX,CAAA,CAAA;;AAElB;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EACpB,WACA,kBAAkB,OAClB,UACA,GAAG,SAGF;CACD,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,0DACA,SACF;EACA,GAAI;EANN,UAAA,CAQG,UACA,mBACC,oBAACA,OAAgB,OAAjB,EACE,QAAQ,oBAAC,QAAD;GAAQ,SAAQ;GAAW,UAAA;EAAa,CAAA,EACjD,CAAA,CAEA;;AAET;AAEA,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;CACrD,OACE,oBAACA,OAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,oBAACA,OAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL"}

package/dist/core/drawer.d.mts

@@ -1,2 +1,2 @@
 import "react";
-import { Drawer } from "vaul";
+import { Dialog } from "@base-ui/react/dialog";

package/dist/core/drawer.mjs

@@ -5,10 +5,10 @@ import { useConfig } from "../providers/config/context.mjs";
 import { OVERLAY_LAYER } from "../lib/z-layers.mjs";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Drawer } from "vaul";
+import { Dialog } from "@base-ui/react/dialog";
 //#region src/core/drawer.tsx
 var drawer_exports = /* @__PURE__ */ __exportAll({
-	Drawer: () => Drawer$1,
+	Drawer: () => Drawer,
 	DrawerClose: () => DrawerClose,
 	DrawerContent: () => DrawerContent,
 	DrawerDescription: () => DrawerDescription,
@@ -19,69 +19,68 @@ var drawer_exports = /* @__PURE__ */ __exportAll({
 	DrawerTitle: () => DrawerTitle,
 	DrawerTrigger: () => DrawerTrigger
 });
-function Drawer$1({ draggable, container, ...props }) {
-	const { getContainer } = useConfig();
-	return /* @__PURE__ */ jsx(Drawer.Root, {
+function Drawer({ ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Root, {
 		"data-slot": "drawer",
-		handleOnly: !draggable,
-		container: container ?? getContainer(),
 		...props
 	});
 }
 function DrawerTrigger({ ...props }) {
-	return /* @__PURE__ */ jsx(Drawer.Trigger, {
+	return /* @__PURE__ */ jsx(Dialog.Trigger, {
 		"data-slot": "drawer-trigger",
 		...props
 	});
 }
 function DrawerPortal({ ...props }) {
-	return /* @__PURE__ */ jsx(Drawer.Portal, {
-		"data-slot": "drawer-portal",
-		...props
-	});
+	return /* @__PURE__ */ jsx(Dialog.Portal, { ...props });
 }
 function DrawerClose({ ...props }) {
-	return /* @__PURE__ */ jsx(Drawer.Close, {
+	return /* @__PURE__ */ jsx(Dialog.Close, {
 		"data-slot": "drawer-close",
 		...props
 	});
 }
 function DrawerOverlay({ className, ...props }) {
-	return /* @__PURE__ */ jsx(Drawer.Overlay, {
+	return /* @__PURE__ */ jsx(Dialog.Backdrop, {
 		"data-slot": "drawer-overlay",
-		className: cn(`data-[state=open]:animate-in data-[state=closed]:animate-out
-        data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0
-        bg-black/50`, OVERLAY_LAYER, className),
+		className: cn(`fixed inset-0 bg-black/50 transition-opacity duration-300
+        data-ending-style:opacity-0 data-starting-style:opacity-0`, OVERLAY_LAYER, className),
 		...props
 	});
 }
-function DrawerContent({ className, children, classNames = {}, handlebar, mask, ...props }) {
+function DrawerContent({ className, children, classNames = {}, handlebar, mask = true, direction = "bottom", container, ...props }) {
+	const { getContainer } = useConfig();
+	const resolvedContainer = container ?? getContainer();
 	return /* @__PURE__ */ jsxs(DrawerPortal, {
-		"data-slot": "drawer-portal",
-		children: [/* @__PURE__ */ jsx(DrawerOverlay, { className: cn(classNames?.mask || "", !mask && "hidden") }), /* @__PURE__ */ jsxs(Drawer.Content, {
+		container: resolvedContainer,
+		children: [mask && /* @__PURE__ */ jsx(DrawerOverlay, { className: cn(classNames?.mask) }), /* @__PURE__ */ jsxs(Dialog.Popup, {
 			"data-slot": "drawer-content",
-			className: cn("group/drawer-content bg-background fixed flex h-auto flex-col", OVERLAY_LAYER, `data-[vaul-drawer-direction=top]:inset-x-0
-          data-[vaul-drawer-direction=top]:top-0
-          data-[vaul-drawer-direction=top]:mb-24
-          data-[vaul-drawer-direction=top]:max-h-[80vh]
-          data-[vaul-drawer-direction=top]:rounded-b-lg
-          data-[vaul-drawer-direction=top]:border-b`, `data-[vaul-drawer-direction=bottom]:inset-x-0
-          data-[vaul-drawer-direction=bottom]:bottom-0
-          data-[vaul-drawer-direction=bottom]:mt-24
-          data-[vaul-drawer-direction=bottom]:max-h-[80vh]
-          data-[vaul-drawer-direction=bottom]:rounded-t-lg
-          data-[vaul-drawer-direction=bottom]:border-t`, `data-[vaul-drawer-direction=right]:inset-y-0
-          data-[vaul-drawer-direction=right]:right-0
-          data-[vaul-drawer-direction=right]:w-3/4
-          data-[vaul-drawer-direction=right]:border-l
-          data-[vaul-drawer-direction=right]:sm:max-w-sm`, `data-[vaul-drawer-direction=left]:inset-y-0
-          data-[vaul-drawer-direction=left]:left-0
-          data-[vaul-drawer-direction=left]:w-3/4
-          data-[vaul-drawer-direction=left]:border-r
-          data-[vaul-drawer-direction=left]:sm:max-w-sm`, className),
+			"data-direction": direction,
+			className: cn(`group/drawer-content bg-background fixed flex h-auto flex-col
+          transition-transform duration-300 ease-in-out`, OVERLAY_LAYER, `data-[direction=top]:inset-x-0 data-[direction=top]:top-0
+          data-[direction=top]:mb-24 data-[direction=top]:max-h-[80vh]
+          data-[direction=top]:w-full data-[direction=top]:rounded-b-lg
+          data-[direction=top]:border-b
+          data-[direction=top]:data-ending-style:-translate-y-full
+          data-[direction=top]:data-starting-style:-translate-y-full`, `data-[direction=bottom]:inset-x-0 data-[direction=bottom]:bottom-0
+          data-[direction=bottom]:mt-24 data-[direction=bottom]:max-h-[80vh]
+          data-[direction=bottom]:w-full data-[direction=bottom]:rounded-t-lg
+          data-[direction=bottom]:border-t
+          data-[direction=bottom]:data-ending-style:translate-y-full
+          data-[direction=bottom]:data-starting-style:translate-y-full`, `data-[direction=right]:inset-y-0 data-[direction=right]:right-0
+          data-[direction=right]:h-full data-[direction=right]:w-3/4
+          data-[direction=right]:border-l
+          data-[direction=right]:data-ending-style:translate-x-full
+          data-[direction=right]:data-starting-style:translate-x-full
+          data-[direction=right]:sm:max-w-sm`, `data-[direction=left]:inset-y-0 data-[direction=left]:left-0
+          data-[direction=left]:h-full data-[direction=left]:w-3/4
+          data-[direction=left]:border-r
+          data-[direction=left]:data-ending-style:-translate-x-full
+          data-[direction=left]:data-starting-style:-translate-x-full
+          data-[direction=left]:sm:max-w-sm`, className),
 			...props,
 			children: [handlebar && /* @__PURE__ */ jsx("div", { className: cn(`bg-muted mx-auto mt-4 hidden h-2 w-25 shrink-0 rounded-full
-              group-data-[vaul-drawer-direction=bottom]/drawer-content:block`, classNames?.handlebar) }), children]
+              group-data-[direction=bottom]/drawer-content:block`, classNames?.handlebar) }), children]
 		})]
 	});
 }
@@ -89,9 +88,9 @@ function DrawerHeader({ className, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		"data-slot": "drawer-header",
 		className: cn(`flex flex-col gap-0.5 p-4
-        group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center
-        group-data-[vaul-drawer-direction=top]/drawer-content:text-center
-        md:gap-1.5 md:text-left`, className),
+        group-data-[direction=bottom]/drawer-content:text-center
+        group-data-[direction=top]/drawer-content:text-center md:gap-1.5
+        md:text-left`, className),
 		...props
 	});
 }
@@ -103,20 +102,20 @@ function DrawerFooter({ className, ...props }) {
 	});
 }
 function DrawerTitle({ className, ...props }) {
-	return /* @__PURE__ */ jsx(Drawer.Title, {
+	return /* @__PURE__ */ jsx(Dialog.Title, {
 		"data-slot": "drawer-title",
 		className: cn("text-foreground font-semibold", className),
 		...props
 	});
 }
 function DrawerDescription({ className, ...props }) {
-	return /* @__PURE__ */ jsx(Drawer.Description, {
+	return /* @__PURE__ */ jsx(Dialog.Description, {
 		"data-slot": "drawer-description",
 		className: cn("text-muted-foreground text-sm", className),
 		...props
 	});
 }
 //#endregion
-export { Drawer$1 as Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, drawer_exports };
+export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, drawer_exports };
 
 //# sourceMappingURL=drawer.mjs.map

package/dist/core/drawer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.mjs","names":["Drawer","DrawerPrimitive"],"sources":["../../src/core/drawer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { Drawer as DrawerPrimitive } from 'vaul';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { OVERLAY_LAYER } from '../lib/z-layers';\n\n/*\n * Vendored from shadcn's `new-york-v4` drawer registry entry (built on `vaul`,\n * same as upstream).\n *\n * Local patches — re-apply these after any `shadcn add drawer`:\n * 1. Imports: `cn` from `@repo/ui/utils` (upstream uses its `cn` alias). The\n *    `vaul` import is upstream-verbatim.\n * 2. `OVERLAY_LAYER` (src/lib/z-layers.ts) replaces upstream's `z-50` on\n *    `DrawerOverlay` and `DrawerContent`. Why: this package is published and\n *    can't assume it owns the app's z-index scale — see #359.\n * 3. `Drawer` root takes a `draggable` prop (`CustomProps`) → `handleOnly={!\n *    draggable}`, plus `container` defaulted to `useConfig().getContainer()`.\n *    Why: the container keeps portalled content inside the themed wrapper, or\n *    dark mode and the CSS custom properties don't reach it.\n * 4. `DrawerContent` takes `CustomContentProps` (`classNames`, `handlebar`,\n *    `mask`): `classNames.mask` + `!mask && 'hidden'` on the overlay, and the\n *    drag handlebar is gated by `handlebar` with `classNames.handlebar`.\n *\n * The rest of what `shadcn add drawer --diff` reports is Tailwind class\n * ordering and prettier line-wrapping from this repo's formatter, not a patch.\n */\ninterface CustomProps {\n  draggable?: boolean;\n}\n\nfunction Drawer({\n  draggable,\n  container,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root> & CustomProps) {\n  const { getContainer } = useConfig();\n\n  return (\n    <DrawerPrimitive.Root\n      data-slot=\"drawer\"\n      handleOnly={!draggable}\n      container={container ?? getContainer()}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerTrigger({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\n}\n\nfunction DrawerPortal({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />;\n}\n\nfunction DrawerClose({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />;\n}\n\nfunction DrawerOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n  return (\n    <DrawerPrimitive.Overlay\n      data-slot=\"drawer-overlay\"\n      className={cn(\n        `data-[state=open]:animate-in data-[state=closed]:animate-out\n        data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0\n        bg-black/50`,\n        OVERLAY_LAYER,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\ninterface CustomContentProps {\n  classNames?: Record<string, string>;\n  handlebar?: boolean;\n  mask?: boolean;\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  classNames = {},\n  handlebar,\n  mask,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content> & CustomContentProps) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay\n        className={cn(\n          classNames?.mask || '',\n          !mask && 'hidden',\n          //\n        )}\n      />\n      <DrawerPrimitive.Content\n        data-slot=\"drawer-content\"\n        className={cn(\n          'group/drawer-content bg-background fixed flex h-auto flex-col',\n          OVERLAY_LAYER,\n          `data-[vaul-drawer-direction=top]:inset-x-0\n          data-[vaul-drawer-direction=top]:top-0\n          data-[vaul-drawer-direction=top]:mb-24\n          data-[vaul-drawer-direction=top]:max-h-[80vh]\n          data-[vaul-drawer-direction=top]:rounded-b-lg\n          data-[vaul-drawer-direction=top]:border-b`,\n          `data-[vaul-drawer-direction=bottom]:inset-x-0\n          data-[vaul-drawer-direction=bottom]:bottom-0\n          data-[vaul-drawer-direction=bottom]:mt-24\n          data-[vaul-drawer-direction=bottom]:max-h-[80vh]\n          data-[vaul-drawer-direction=bottom]:rounded-t-lg\n          data-[vaul-drawer-direction=bottom]:border-t`,\n          `data-[vaul-drawer-direction=right]:inset-y-0\n          data-[vaul-drawer-direction=right]:right-0\n          data-[vaul-drawer-direction=right]:w-3/4\n          data-[vaul-drawer-direction=right]:border-l\n          data-[vaul-drawer-direction=right]:sm:max-w-sm`,\n          `data-[vaul-drawer-direction=left]:inset-y-0\n          data-[vaul-drawer-direction=left]:left-0\n          data-[vaul-drawer-direction=left]:w-3/4\n          data-[vaul-drawer-direction=left]:border-r\n          data-[vaul-drawer-direction=left]:sm:max-w-sm`,\n          className,\n        )}\n        {...props}\n      >\n        {handlebar && (\n          <div\n            className={cn(\n              `bg-muted mx-auto mt-4 hidden h-2 w-25 shrink-0 rounded-full\n              group-data-[vaul-drawer-direction=bottom]/drawer-content:block`,\n              classNames?.handlebar,\n            )}\n          />\n        )}\n        {/* <div\n          className=\"bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full\n            group-data-[vaul-drawer-direction=bottom]/drawer-content:block\"\n        /> */}\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  );\n}\n\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn(\n        `flex flex-col gap-0.5 p-4\n        group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center\n        group-data-[vaul-drawer-direction=top]/drawer-content:text-center\n        md:gap-1.5 md:text-left`,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn('mt-auto flex flex-col gap-2 p-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={cn('text-foreground font-semibold', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={cn('text-muted-foreground text-sm', className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Drawer,\n  DrawerPortal,\n  DrawerOverlay,\n  DrawerTrigger,\n  DrawerClose,\n  DrawerContent,\n  DrawerHeader,\n  DrawerFooter,\n  DrawerTitle,\n  DrawerDescription,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAoCA,SAASA,SAAO,EACd,WACA,WACA,GAAG,SAC+D;CAClE,MAAM,EAAE,iBAAiB,UAAU;CAEnC,OACE,oBAACC,OAAgB,MAAjB;EACE,aAAU;EACV,YAAY,CAAC;EACb,WAAW,aAAa,aAAa;EACrC,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EACrB,GAAG,SACoD;CACvD,OAAO,oBAACA,OAAgB,SAAjB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,aAAa,EACpB,GAAG,SACmD;CACtD,OAAO,oBAACA,OAAgB,QAAjB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAEA,SAAS,YAAY,EACnB,GAAG,SACkD;CACrD,OAAO,oBAACA,OAAgB,OAAjB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,OAAgB,SAAjB;EACE,aAAU;EACV,WAAW,GACT;;sBAGA,eACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,cAAc,EACrB,WACA,UACA,aAAa,CAAC,GACd,WACA,MACA,GAAG,SACyE;CAC5E,OACE,qBAAC,cAAD;EAAc,aAAU;EAAxB,UAAA,CACE,oBAAC,eAAD,EACE,WAAW,GACT,YAAY,QAAQ,IACpB,CAAC,QAAQ,QAEX,EACD,CAAA,GACD,qBAACA,OAAgB,SAAjB;GACE,aAAU;GACV,WAAW,GACT,iEACA,eACA;;;;;sDAMA;;;;;yDAMA;;;;2DAKA;;;;0DAKA,SACF;GACA,GAAI;GA7BN,UAAA,CA+BG,aACC,oBAAC,OAAD,EACE,WAAW,GACT;+EAEA,YAAY,SACd,EACD,CAAA,GAMF,QACsB;EACb,CAAA,CAAA;;AAElB;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT;;;kCAIA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;CACrD,OACE,oBAACA,OAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,oBAACA,OAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"drawer.mjs","names":["DialogPrimitive"],"sources":["../../src/core/drawer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { OVERLAY_LAYER } from '../lib/z-layers';\n\n/*\n * Drawer rebuilt on Base UI's Dialog primitives (ui-kit#375, Decision #2) —\n * no longer `vaul`. Base UI has no dedicated Drawer, so the side-sheet is a\n * Dialog whose popup is anchored to an edge and slides in/out.\n *\n * Consequences of dropping vaul:\n * - No drag-to-dismiss / snap points. The `handlebar` stays as a visual\n *   affordance on bottom drawers but is no longer draggable.\n * - `direction` is a local `DrawerContent` prop (top/bottom/left/right) exposed\n *   as `data-direction`, which drives both the popup's own placement/slide and\n *   the `group-data-[direction=…]` hooks the header/handlebar rely on. It\n *   replaces vaul's `data-vaul-drawer-direction`.\n * - Pointer-outside dismissal (`maskClosable`) is a root concern\n *   (`disablePointerDismissal`), and mask/modal behaviour is driven by the\n *   consumer — see `organisms/drawer`.\n *\n * Retained local patches: `OVERLAY_LAYER` (#359) over upstream's z-index, the\n * themed portal `container` (default `useConfig().getContainer()`), and the\n * `classNames`/`handlebar`/`mask` custom props.\n */\ntype Direction = 'top' | 'bottom' | 'left' | 'right';\n\nfunction Drawer({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Root>) {\n  return <DialogPrimitive.Root data-slot=\"drawer\" {...props} />;\n}\n\nfunction DrawerTrigger({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n  return <DialogPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\n}\n\nfunction DrawerPortal({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n  return <DialogPrimitive.Portal {...props} />;\n}\n\nfunction DrawerClose({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Close>) {\n  return <DialogPrimitive.Close data-slot=\"drawer-close\" {...props} />;\n}\n\nfunction DrawerOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Backdrop>) {\n  return (\n    <DialogPrimitive.Backdrop\n      data-slot=\"drawer-overlay\"\n      className={cn(\n        `fixed inset-0 bg-black/50 transition-opacity duration-300\n        data-ending-style:opacity-0 data-starting-style:opacity-0`,\n        OVERLAY_LAYER,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\ninterface CustomContentProps {\n  classNames?: Record<string, string>;\n  handlebar?: boolean;\n  mask?: boolean;\n  direction?: Direction;\n  container?: HTMLElement;\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  classNames = {},\n  handlebar,\n  mask = true,\n  direction = 'bottom',\n  container,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Popup> & CustomContentProps) {\n  const { getContainer } = useConfig();\n  const resolvedContainer = container ?? getContainer();\n\n  return (\n    <DrawerPortal container={resolvedContainer}>\n      {mask && <DrawerOverlay className={cn(classNames?.mask)} />}\n      <DialogPrimitive.Popup\n        data-slot=\"drawer-content\"\n        data-direction={direction}\n        className={cn(\n          `group/drawer-content bg-background fixed flex h-auto flex-col\n          transition-transform duration-300 ease-in-out`,\n          OVERLAY_LAYER,\n          `data-[direction=top]:inset-x-0 data-[direction=top]:top-0\n          data-[direction=top]:mb-24 data-[direction=top]:max-h-[80vh]\n          data-[direction=top]:w-full data-[direction=top]:rounded-b-lg\n          data-[direction=top]:border-b\n          data-[direction=top]:data-ending-style:-translate-y-full\n          data-[direction=top]:data-starting-style:-translate-y-full`,\n          `data-[direction=bottom]:inset-x-0 data-[direction=bottom]:bottom-0\n          data-[direction=bottom]:mt-24 data-[direction=bottom]:max-h-[80vh]\n          data-[direction=bottom]:w-full data-[direction=bottom]:rounded-t-lg\n          data-[direction=bottom]:border-t\n          data-[direction=bottom]:data-ending-style:translate-y-full\n          data-[direction=bottom]:data-starting-style:translate-y-full`,\n          `data-[direction=right]:inset-y-0 data-[direction=right]:right-0\n          data-[direction=right]:h-full data-[direction=right]:w-3/4\n          data-[direction=right]:border-l\n          data-[direction=right]:data-ending-style:translate-x-full\n          data-[direction=right]:data-starting-style:translate-x-full\n          data-[direction=right]:sm:max-w-sm`,\n          `data-[direction=left]:inset-y-0 data-[direction=left]:left-0\n          data-[direction=left]:h-full data-[direction=left]:w-3/4\n          data-[direction=left]:border-r\n          data-[direction=left]:data-ending-style:-translate-x-full\n          data-[direction=left]:data-starting-style:-translate-x-full\n          data-[direction=left]:sm:max-w-sm`,\n          className,\n        )}\n        {...props}\n      >\n        {handlebar && (\n          <div\n            className={cn(\n              `bg-muted mx-auto mt-4 hidden h-2 w-25 shrink-0 rounded-full\n              group-data-[direction=bottom]/drawer-content:block`,\n              classNames?.handlebar,\n            )}\n          />\n        )}\n        {children}\n      </DialogPrimitive.Popup>\n    </DrawerPortal>\n  );\n}\n\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn(\n        `flex flex-col gap-0.5 p-4\n        group-data-[direction=bottom]/drawer-content:text-center\n        group-data-[direction=top]/drawer-content:text-center md:gap-1.5\n        md:text-left`,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn('mt-auto flex flex-col gap-2 p-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Title>) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={cn('text-foreground font-semibold', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Description>) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={cn('text-muted-foreground text-sm', className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Drawer,\n  DrawerPortal,\n  DrawerOverlay,\n  DrawerTrigger,\n  DrawerClose,\n  DrawerContent,\n  DrawerHeader,\n  DrawerFooter,\n  DrawerTitle,\n  DrawerDescription,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAiCA,SAAS,OAAO,EACd,GAAG,SACiD;CACpD,OAAO,oBAACA,OAAgB,MAAjB;EAAsB,aAAU;EAAS,GAAI;CAAQ,CAAA;AAC9D;AAEA,SAAS,cAAc,EACrB,GAAG,SACoD;CACvD,OAAO,oBAACA,OAAgB,SAAjB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,aAAa,EACpB,GAAG,SACmD;CACtD,OAAO,oBAACA,OAAgB,QAAjB,EAAwB,GAAI,MAAQ,CAAA;AAC7C;AAEA,SAAS,YAAY,EACnB,GAAG,SACkD;CACrD,OAAO,oBAACA,OAAgB,OAAjB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,cAAc,EACrB,WACA,GAAG,SACqD;CACxD,OACE,oBAACA,OAAgB,UAAjB;EACE,aAAU;EACV,WAAW,GACT;oEAEA,eACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAUA,SAAS,cAAc,EACrB,WACA,UACA,aAAa,CAAC,GACd,WACA,OAAO,MACP,YAAY,UACZ,WACA,GAAG,SACuE;CAC1E,MAAM,EAAE,iBAAiB,UAAU;CACnC,MAAM,oBAAoB,aAAa,aAAa;CAEpD,OACE,qBAAC,cAAD;EAAc,WAAW;EAAzB,UAAA,CACG,QAAQ,oBAAC,eAAD,EAAe,WAAW,GAAG,YAAY,IAAI,EAAI,CAAA,GAC1D,qBAACA,OAAgB,OAAjB;GACE,aAAU;GACV,kBAAgB;GAChB,WAAW,GACT;0DAEA,eACA;;;;;uEAMA;;;;;yEAMA;;;;;+CAMA;;;;;8CAMA,SACF;GACA,GAAI;GAjCN,UAAA,CAmCG,aACC,oBAAC,OAAD,EACE,WAAW,GACT;mEAEA,YAAY,SACd,EACD,CAAA,GAEF,QACoB;EACX,CAAA,CAAA;;AAElB;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT;;;uBAIA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;CACrD,OACE,oBAACA,OAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,oBAACA,OAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL"}

package/dist/core/label.d.mts

@@ -1,2 +1 @@
-import "react";
-import "@radix-ui/react-label";
+import "react";

package/dist/core/label.mjs

@@ -1,13 +1,11 @@
-"use client";
 import { __exportAll } from "../_virtual/_rolldown/runtime.mjs";
 import { cn } from "../utils.mjs";
 import "react";
 import { jsx } from "react/jsx-runtime";
-import * as LabelPrimitive from "@radix-ui/react-label";
 //#region src/core/label.tsx
 var label_exports = /* @__PURE__ */ __exportAll({ Label: () => Label });
 function Label({ className, ...props }) {
-	return /* @__PURE__ */ jsx(LabelPrimitive.Root, {
+	return /* @__PURE__ */ jsx("label", {
 		"data-slot": "label",
 		className: cn(`flex items-center gap-2 text-sm leading-none font-medium select-none
         group-data-[disabled=true]:pointer-events-none

package/dist/core/label.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"label.mjs","names":[],"sources":["../../src/core/label.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport * as LabelPrimitive from '@radix-ui/react-label';\n\nimport { cn } from '@repo/ui/utils';\n\nfunction Label({\n  className,\n  ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  return (\n    <LabelPrimitive.Root\n      data-slot=\"label\"\n      className={cn(\n        `flex items-center gap-2 text-sm leading-none font-medium select-none\n        group-data-[disabled=true]:pointer-events-none\n        group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed\n        peer-disabled:opacity-50`,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Label };\n"],"mappings":";;;;;;;;AAQA,SAAS,MAAM,EACb,WACA,GAAG,SACgD;CACnD,OACE,oBAAC,eAAe,MAAhB;EACE,aAAU;EACV,WAAW,GACT;;;mCAIA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"label.mjs","names":[],"sources":["../../src/core/label.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nfunction Label({ className, ...props }: React.ComponentProps<'label'>) {\n  return (\n    <label\n      data-slot=\"label\"\n      className={cn(\n        `flex items-center gap-2 text-sm leading-none font-medium select-none\n        group-data-[disabled=true]:pointer-events-none\n        group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed\n        peer-disabled:opacity-50`,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Label };\n"],"mappings":";;;;;;AAIA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAwC;CACrE,OACE,oBAAC,SAAD;EACE,aAAU;EACV,WAAW,GACT;;;mCAIA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/core/popover.d.mts

@@ -1,2 +1,2 @@
 import "react";
-import "@radix-ui/react-popover";
+import { Popover } from "@base-ui/react/popover";