@waveso/ui 0.7.5 → 0.7.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/alert-dialog.js +1 -1
- package/dist/alert-dialog.js.map +1 -1
- package/dist/autocomplete.js +1 -1
- package/dist/autocomplete.js.map +1 -1
- package/dist/badge.d.ts +1 -1
- package/dist/badge.js +1 -1
- package/dist/badge.js.map +1 -1
- package/dist/button-group.js +2 -2
- package/dist/button-group.js.map +1 -1
- package/dist/button.d.ts +2 -2
- package/dist/dialog.js +1 -1
- package/dist/dialog.js.map +1 -1
- package/dist/direction.js +0 -1
- package/dist/drawer.js +1 -1
- package/dist/drawer.js.map +1 -1
- package/dist/film-grain.d.ts.map +1 -1
- package/dist/film-grain.js +4 -1
- package/dist/film-grain.js.map +1 -1
- package/dist/input-group.d.ts +1 -1
- package/dist/input-group.d.ts.map +1 -1
- package/dist/input-group.js +1 -0
- package/dist/input-group.js.map +1 -1
- package/dist/item.js +1 -1
- package/dist/item.js.map +1 -1
- package/dist/label.d.ts.map +1 -1
- package/dist/label.js +0 -1
- package/dist/label.js.map +1 -1
- package/dist/lib/utils.d.ts.map +1 -1
- package/dist/lib/utils.js +25 -1
- package/dist/lib/utils.js.map +1 -1
- package/dist/menu.js +1 -1
- package/dist/menu.js.map +1 -1
- package/dist/pagination.js +2 -2
- package/dist/pagination.js.map +1 -1
- package/dist/select.js +1 -1
- package/dist/select.js.map +1 -1
- package/dist/slider.js +1 -0
- package/dist/slider.js.map +1 -1
- package/dist/styles.css +7 -3
- package/dist/table.d.ts.map +1 -1
- package/dist/table.js +0 -1
- package/dist/table.js.map +1 -1
- package/dist/toast.d.ts +1 -1
- package/dist/toggle.js +2 -3
- package/dist/toggle.js.map +1 -1
- package/package.json +1 -1
package/dist/alert-dialog.js
CHANGED
|
@@ -26,7 +26,7 @@ function AlertDialogPortal({ ...props }) {
|
|
|
26
26
|
function AlertDialogOverlay({ className, ...props }) {
|
|
27
27
|
return /* @__PURE__ */ jsx(AlertDialog$1.Backdrop, {
|
|
28
28
|
"data-slot": "alert-dialog-overlay",
|
|
29
|
-
className: cn("motion-scrim fixed inset-0 isolate z-50 bg-
|
|
29
|
+
className: cn("motion-scrim fixed inset-0 isolate z-50 bg-scrim supports-backdrop-filter:backdrop-blur-xs", className),
|
|
30
30
|
...props
|
|
31
31
|
});
|
|
32
32
|
}
|
package/dist/alert-dialog.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive"],"sources":["../src/alert-dialog.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\"\n\nimport { Button } from \"./button\"\nimport { cn } from \"./lib/utils\"\n\ntype AlertDialogProps = React.ComponentProps<typeof AlertDialogPrimitive.Root>\n\ntype AlertDialogTriggerProps = React.ComponentProps<typeof AlertDialogPrimitive.Trigger>\n\ntype AlertDialogPortalProps = React.ComponentProps<typeof AlertDialogPrimitive.Portal>\n\ntype AlertDialogOverlayProps = React.ComponentProps<typeof AlertDialogPrimitive.Backdrop>\n\ntype AlertDialogContentProps = React.ComponentProps<typeof AlertDialogPrimitive.Popup> & {\n size?: \"default\" | \"sm\" | \"lg\" | \"xl\"\n}\n\ntype AlertDialogHeaderProps = React.ComponentProps<\"div\">\n\ntype AlertDialogFooterProps = React.ComponentProps<\"div\">\n\ntype AlertDialogMediaProps = React.ComponentProps<\"div\">\n\ntype AlertDialogTitleProps = React.ComponentProps<typeof AlertDialogPrimitive.Title>\n\ntype AlertDialogDescriptionProps = React.ComponentProps<typeof AlertDialogPrimitive.Description>\n\ntype AlertDialogActionProps = React.ComponentProps<typeof Button>\n\ntype AlertDialogCancelProps = React.ComponentProps<typeof AlertDialogPrimitive.Close> &\n Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">\n\nfunction AlertDialog({ ...props }: AlertDialogProps) {\n return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n}\n\nfunction AlertDialogTrigger({ ...props }: AlertDialogTriggerProps) {\n return <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPortalProps) {\n return <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n}\n\nfunction AlertDialogOverlay({ className, ...props }: AlertDialogOverlayProps) {\n return (\n <AlertDialogPrimitive.Backdrop\n data-slot=\"alert-dialog-overlay\"\n className={cn(\n \"motion-scrim fixed inset-0 isolate z-50 bg-
|
|
1
|
+
{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive"],"sources":["../src/alert-dialog.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\"\n\nimport { Button } from \"./button\"\nimport { cn } from \"./lib/utils\"\n\ntype AlertDialogProps = React.ComponentProps<typeof AlertDialogPrimitive.Root>\n\ntype AlertDialogTriggerProps = React.ComponentProps<typeof AlertDialogPrimitive.Trigger>\n\ntype AlertDialogPortalProps = React.ComponentProps<typeof AlertDialogPrimitive.Portal>\n\ntype AlertDialogOverlayProps = React.ComponentProps<typeof AlertDialogPrimitive.Backdrop>\n\ntype AlertDialogContentProps = React.ComponentProps<typeof AlertDialogPrimitive.Popup> & {\n size?: \"default\" | \"sm\" | \"lg\" | \"xl\"\n}\n\ntype AlertDialogHeaderProps = React.ComponentProps<\"div\">\n\ntype AlertDialogFooterProps = React.ComponentProps<\"div\">\n\ntype AlertDialogMediaProps = React.ComponentProps<\"div\">\n\ntype AlertDialogTitleProps = React.ComponentProps<typeof AlertDialogPrimitive.Title>\n\ntype AlertDialogDescriptionProps = React.ComponentProps<typeof AlertDialogPrimitive.Description>\n\ntype AlertDialogActionProps = React.ComponentProps<typeof Button>\n\ntype AlertDialogCancelProps = React.ComponentProps<typeof AlertDialogPrimitive.Close> &\n Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">\n\nfunction AlertDialog({ ...props }: AlertDialogProps) {\n return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n}\n\nfunction AlertDialogTrigger({ ...props }: AlertDialogTriggerProps) {\n return <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPortalProps) {\n return <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n}\n\nfunction AlertDialogOverlay({ className, ...props }: AlertDialogOverlayProps) {\n return (\n <AlertDialogPrimitive.Backdrop\n data-slot=\"alert-dialog-overlay\"\n className={cn(\n \"motion-scrim fixed inset-0 isolate z-50 bg-scrim supports-backdrop-filter:backdrop-blur-xs\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDialogContent({\n className,\n size = \"default\",\n ...props\n}: AlertDialogContentProps) {\n return (\n <AlertDialogPortal>\n <AlertDialogOverlay />\n <AlertDialogPrimitive.Popup\n data-slot=\"alert-dialog-content\"\n data-size={size}\n className={cn(\n \"motion-scale-lg bg-foundation ring-contrast/10 group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-lg p-4 ring-1 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=lg]:max-w-lg data-[size=xl]:max-w-xl data-[size=default]:sm:max-w-sm data-[size=lg]:sm:max-w-lg data-[size=xl]:sm:max-w-xl\",\n className,\n )}\n {...props}\n />\n </AlertDialogPortal>\n )\n}\n\nfunction AlertDialogHeader({ className, ...props }: AlertDialogHeaderProps) {\n return (\n <div\n data-slot=\"alert-dialog-header\"\n className={cn(\n \"grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr] group-data-[size=lg]/alert-dialog-content:place-items-start group-data-[size=lg]/alert-dialog-content:text-left group-data-[size=xl]/alert-dialog-content:place-items-start group-data-[size=xl]/alert-dialog-content:text-left\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDialogFooter({ className, ...props }: AlertDialogFooterProps) {\n return (\n <div\n data-slot=\"alert-dialog-footer\"\n className={cn(\n \"bg-secondary/50 -mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-lg border-t border-line p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDialogMedia({ className, ...props }: AlertDialogMediaProps) {\n return (\n <div\n data-slot=\"alert-dialog-media\"\n className={cn(\n \"bg-secondary mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDialogTitle({ className, ...props }: AlertDialogTitleProps) {\n return (\n <AlertDialogPrimitive.Title\n data-slot=\"alert-dialog-title\"\n className={cn(\n \"text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDialogDescription({\n className,\n ...props\n}: AlertDialogDescriptionProps) {\n return (\n <AlertDialogPrimitive.Description\n data-slot=\"alert-dialog-description\"\n className={cn(\n \"text-muted *:[a]:hover:text-contrast text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDialogAction({\n className,\n ...props\n}: AlertDialogActionProps) {\n return (\n <Button\n data-slot=\"alert-dialog-action\"\n className={cn(className)}\n {...props}\n />\n )\n}\n\nfunction AlertDialogCancel({\n className,\n variant = \"outline\",\n size = \"default\",\n ...props\n}: AlertDialogCancelProps) {\n return (\n <AlertDialogPrimitive.Close\n data-slot=\"alert-dialog-cancel\"\n className={className}\n render={<Button variant={variant} size={size} />}\n {...props}\n />\n )\n}\n\nexport {\n AlertDialog,\n AlertDialogAction,\n AlertDialogCancel,\n AlertDialogContent,\n AlertDialogDescription,\n AlertDialogFooter,\n AlertDialogHeader,\n AlertDialogMedia,\n AlertDialogOverlay,\n AlertDialogPortal,\n AlertDialogTitle,\n AlertDialogTrigger,\n}\n"],"mappings":";;;;;;;AAmCA,SAAS,YAAY,EAAE,GAAG,SAA2B;AACnD,QAAO,oBAACA,cAAqB,MAAtB;EAA2B,aAAU;EAAe,GAAI;EAAS,CAAA;;AAG1E,SAAS,mBAAmB,EAAE,GAAG,SAAkC;AACjE,QAAO,oBAACA,cAAqB,SAAtB;EAA8B,aAAU;EAAuB,GAAI;EAAS,CAAA;;AAGrF,SAAS,kBAAkB,EAAE,GAAG,SAAiC;AAC/D,QAAO,oBAACA,cAAqB,QAAtB;EAA6B,aAAU;EAAsB,GAAI;EAAS,CAAA;;AAGnF,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAkC;AAC5E,QACE,oBAACA,cAAqB,UAAtB;EACE,aAAU;EACV,WAAW,GACT,8FACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,mBAAmB,EAC1B,WACA,OAAO,WACP,GAAG,SACuB;AAC1B,QACE,qBAAC,mBAAD,EAAA,UAAA,CACE,oBAAC,oBAAD,EAAsB,CAAA,EACtB,oBAACA,cAAqB,OAAtB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,2XACA,UACD;EACD,GAAI;EACJ,CAAA,CACgB,EAAA,CAAA;;AAIxB,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAiC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,snBACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAiC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,iOACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAgC;AACxE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kLACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAgC;AACxE,QACE,oBAACA,cAAqB,OAAtB;EACE,aAAU;EACV,WAAW,GACT,qJACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC2B;AAC9B,QACE,oBAACA,cAAqB,aAAtB;EACE,aAAU;EACV,WAAW,GACT,qHACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,kBAAkB,EACzB,WACA,GAAG,SACsB;AACzB,QACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GAAG,UAAU;EACxB,GAAI;EACJ,CAAA;;AAIN,SAAS,kBAAkB,EACzB,WACA,UAAU,WACV,OAAO,WACP,GAAG,SACsB;AACzB,QACE,oBAACA,cAAqB,OAAtB;EACE,aAAU;EACC;EACX,QAAQ,oBAAC,QAAD;GAAiB;GAAe;GAAQ,CAAA;EAChD,GAAI;EACJ,CAAA"}
|
package/dist/autocomplete.js
CHANGED
|
@@ -68,7 +68,7 @@ function AutocompletePositioner({ className, ...props }) {
|
|
|
68
68
|
function AutocompletePopup({ className, ...props }) {
|
|
69
69
|
return /* @__PURE__ */ jsx(Autocomplete$1.Popup, {
|
|
70
70
|
"data-slot": "autocomplete-popup",
|
|
71
|
-
className: cn("motion-pop-md bg-elevated text-contrast ring-contrast/10 group/autocomplete-content relative max-h-(--available-height) min-w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md shadow-md ring-1", className),
|
|
71
|
+
className: cn("motion-pop-md bg-elevated text-contrast ring-contrast/10 group/autocomplete-content relative max-h-(--available-height) min-w-(--anchor-width) max-w-(--available-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md shadow-md ring-1", className),
|
|
72
72
|
...props
|
|
73
73
|
});
|
|
74
74
|
}
|
package/dist/autocomplete.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"autocomplete.js","names":["AutocompletePrimitive"],"sources":["../src/autocomplete.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { Autocomplete as AutocompletePrimitive } from \"@base-ui/react/autocomplete\"\n\nimport { cn } from \"./lib/utils\"\n\ntype AutocompleteProps = React.ComponentProps<typeof AutocompletePrimitive.Root>\ntype AutocompleteInputProps = React.ComponentProps<typeof AutocompletePrimitive.Input>\ntype AutocompleteTriggerProps = React.ComponentProps<typeof AutocompletePrimitive.Trigger>\ntype AutocompleteIconProps = React.ComponentProps<typeof AutocompletePrimitive.Icon>\ntype AutocompleteClearProps = React.ComponentProps<typeof AutocompletePrimitive.Clear>\ntype AutocompleteValueProps = React.ComponentProps<typeof AutocompletePrimitive.Value>\n\ntype AutocompletePortalProps = React.ComponentProps<typeof AutocompletePrimitive.Portal>\ntype AutocompleteBackdropProps = React.ComponentProps<typeof AutocompletePrimitive.Backdrop>\ntype AutocompletePositionerProps = React.ComponentProps<typeof AutocompletePrimitive.Positioner>\ntype AutocompletePopupProps = React.ComponentProps<typeof AutocompletePrimitive.Popup>\ntype AutocompleteArrowProps = React.ComponentProps<typeof AutocompletePrimitive.Arrow>\ntype AutocompleteStatusProps = React.ComponentProps<typeof AutocompletePrimitive.Status>\ntype AutocompleteEmptyProps = React.ComponentProps<typeof AutocompletePrimitive.Empty>\n\ntype AutocompleteListProps = React.ComponentProps<typeof AutocompletePrimitive.List>\ntype AutocompleteRowProps = React.ComponentProps<typeof AutocompletePrimitive.Row>\ntype AutocompleteItemProps = React.ComponentProps<typeof AutocompletePrimitive.Item>\ntype AutocompleteSeparatorProps = React.ComponentProps<typeof AutocompletePrimitive.Separator>\ntype AutocompleteGroupProps = React.ComponentProps<typeof AutocompletePrimitive.Group>\ntype AutocompleteGroupLabelProps = React.ComponentProps<typeof AutocompletePrimitive.GroupLabel>\ntype AutocompleteCollectionProps = React.ComponentProps<typeof AutocompletePrimitive.Collection>\n\ntype AutocompleteContentProps = AutocompletePopupProps &\n Pick<\n AutocompletePositionerProps,\n \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\"\n >\n\nfunction Autocomplete({ ...props }: AutocompleteProps) {\n return <AutocompletePrimitive.Root data-slot=\"autocomplete\" {...props} />\n}\n\nfunction AutocompleteInput({ className, ...props }: AutocompleteInputProps) {\n return (\n <AutocompletePrimitive.Input\n data-slot=\"autocomplete-input\"\n className={cn(\n \"dark:bg-edge/30 border-edge focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 disabled:bg-edge/50 dark:disabled:bg-edge/80 placeholder:text-soft h-8 w-full min-w-0 rounded-md border bg-transparent px-2.5 py-1 text-base transition-colors outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AutocompleteTrigger({ className, ...props }: AutocompleteTriggerProps) {\n return (\n <AutocompletePrimitive.Trigger\n data-slot=\"autocomplete-trigger\"\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteIcon({ className, ...props }: AutocompleteIconProps) {\n return (\n <AutocompletePrimitive.Icon\n data-slot=\"autocomplete-icon\"\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteClear({ className, ...props }: AutocompleteClearProps) {\n return (\n <AutocompletePrimitive.Clear\n data-slot=\"autocomplete-clear\"\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteValue({ ...props }: AutocompleteValueProps) {\n return (\n <AutocompletePrimitive.Value data-slot=\"autocomplete-value\" {...props} />\n )\n}\n\nfunction AutocompletePortal({ className, ...props }: AutocompletePortalProps) {\n return (\n <AutocompletePrimitive.Portal\n data-slot=\"autocomplete-portal\"\n className={cn(className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteBackdrop({ className, ...props }: AutocompleteBackdropProps) {\n return (\n <AutocompletePrimitive.Backdrop\n data-slot=\"autocomplete-backdrop\"\n className={cn(\"fixed inset-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompletePositioner({ className, ...props }: AutocompletePositionerProps) {\n return (\n <AutocompletePrimitive.Positioner\n data-slot=\"autocomplete-positioner\"\n className={cn(className)}\n {...props}\n />\n )\n}\n\nfunction AutocompletePopup({ className, ...props }: AutocompletePopupProps) {\n return (\n <AutocompletePrimitive.Popup\n data-slot=\"autocomplete-popup\"\n className={cn(\n \"motion-pop-md bg-elevated text-contrast ring-contrast/10 group/autocomplete-content relative max-h-(--available-height) min-w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md shadow-md ring-1\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AutocompleteArrow({ className, ...props }: AutocompleteArrowProps) {\n return (\n <AutocompletePrimitive.Arrow\n data-slot=\"autocomplete-arrow\"\n className={cn(\"fill-elevated\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteStatus({ className, ...props }: AutocompleteStatusProps) {\n return (\n <AutocompletePrimitive.Status\n data-slot=\"autocomplete-status\"\n className={cn(\"text-muted flex w-full justify-center py-2 text-center text-sm\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteEmpty({ className, ...props }: AutocompleteEmptyProps) {\n return (\n <AutocompletePrimitive.Empty\n data-slot=\"autocomplete-empty\"\n className={cn(\"text-muted hidden w-full justify-center py-2 text-center text-sm group-data-empty/autocomplete-content:flex\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteList({ className, ...props }: AutocompleteListProps) {\n return (\n <AutocompletePrimitive.List\n data-slot=\"autocomplete-list\"\n className={cn(\"scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteRow({ className, ...props }: AutocompleteRowProps) {\n return (\n <AutocompletePrimitive.Row\n data-slot=\"autocomplete-row\"\n className={cn(className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteItem({ className, ...props }: AutocompleteItemProps) {\n return (\n <AutocompletePrimitive.Item\n data-slot=\"autocomplete-item\"\n className={cn(\n \"data-highlighted:bg-primary data-highlighted:text-white relative flex w-full cursor-clickable items-center gap-2 rounded-sm py-1 pl-1.5 pr-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AutocompleteSeparator({ className, ...props }: AutocompleteSeparatorProps) {\n return (\n <AutocompletePrimitive.Separator\n data-slot=\"autocomplete-separator\"\n className={cn(\"bg-line -mx-1 my-1 h-px\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteGroup({ className, ...props }: AutocompleteGroupProps) {\n return (\n <AutocompletePrimitive.Group\n data-slot=\"autocomplete-group\"\n className={cn(\"pt-1\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteGroupLabel({ className, ...props }: AutocompleteGroupLabelProps) {\n return (\n <AutocompletePrimitive.GroupLabel\n data-slot=\"autocomplete-group-label\"\n className={cn(\"text-muted px-2 py-1.5 text-xs\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteCollection({ ...props }: AutocompleteCollectionProps) {\n return (\n <AutocompletePrimitive.Collection\n data-slot=\"autocomplete-collection\"\n {...props}\n />\n )\n}\n\nfunction AutocompleteContent({\n className,\n align = \"start\",\n alignOffset = 0,\n side = \"bottom\",\n sideOffset = 6,\n ...props\n}: AutocompleteContentProps) {\n return (\n <AutocompletePortal>\n <AutocompletePositioner\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n className=\"isolate z-50\"\n >\n <AutocompletePopup className={className} {...props} />\n </AutocompletePositioner>\n </AutocompletePortal>\n )\n}\n\nexport {\n Autocomplete,\n AutocompleteArrow,\n AutocompleteBackdrop,\n AutocompleteClear,\n AutocompleteCollection,\n AutocompleteContent,\n AutocompleteEmpty,\n AutocompleteGroup,\n AutocompleteGroupLabel,\n AutocompleteIcon,\n AutocompleteInput,\n AutocompleteItem,\n AutocompleteList,\n AutocompletePopup,\n AutocompletePortal,\n AutocompletePositioner,\n AutocompleteRow,\n AutocompleteSeparator,\n AutocompleteStatus,\n AutocompleteTrigger,\n AutocompleteValue,\n}"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"autocomplete.js","names":["AutocompletePrimitive"],"sources":["../src/autocomplete.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { Autocomplete as AutocompletePrimitive } from \"@base-ui/react/autocomplete\"\n\nimport { cn } from \"./lib/utils\"\n\ntype AutocompleteProps = React.ComponentProps<typeof AutocompletePrimitive.Root>\ntype AutocompleteInputProps = React.ComponentProps<typeof AutocompletePrimitive.Input>\ntype AutocompleteTriggerProps = React.ComponentProps<typeof AutocompletePrimitive.Trigger>\ntype AutocompleteIconProps = React.ComponentProps<typeof AutocompletePrimitive.Icon>\ntype AutocompleteClearProps = React.ComponentProps<typeof AutocompletePrimitive.Clear>\ntype AutocompleteValueProps = React.ComponentProps<typeof AutocompletePrimitive.Value>\n\ntype AutocompletePortalProps = React.ComponentProps<typeof AutocompletePrimitive.Portal>\ntype AutocompleteBackdropProps = React.ComponentProps<typeof AutocompletePrimitive.Backdrop>\ntype AutocompletePositionerProps = React.ComponentProps<typeof AutocompletePrimitive.Positioner>\ntype AutocompletePopupProps = React.ComponentProps<typeof AutocompletePrimitive.Popup>\ntype AutocompleteArrowProps = React.ComponentProps<typeof AutocompletePrimitive.Arrow>\ntype AutocompleteStatusProps = React.ComponentProps<typeof AutocompletePrimitive.Status>\ntype AutocompleteEmptyProps = React.ComponentProps<typeof AutocompletePrimitive.Empty>\n\ntype AutocompleteListProps = React.ComponentProps<typeof AutocompletePrimitive.List>\ntype AutocompleteRowProps = React.ComponentProps<typeof AutocompletePrimitive.Row>\ntype AutocompleteItemProps = React.ComponentProps<typeof AutocompletePrimitive.Item>\ntype AutocompleteSeparatorProps = React.ComponentProps<typeof AutocompletePrimitive.Separator>\ntype AutocompleteGroupProps = React.ComponentProps<typeof AutocompletePrimitive.Group>\ntype AutocompleteGroupLabelProps = React.ComponentProps<typeof AutocompletePrimitive.GroupLabel>\ntype AutocompleteCollectionProps = React.ComponentProps<typeof AutocompletePrimitive.Collection>\n\ntype AutocompleteContentProps = AutocompletePopupProps &\n Pick<\n AutocompletePositionerProps,\n \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\"\n >\n\nfunction Autocomplete({ ...props }: AutocompleteProps) {\n return <AutocompletePrimitive.Root data-slot=\"autocomplete\" {...props} />\n}\n\nfunction AutocompleteInput({ className, ...props }: AutocompleteInputProps) {\n return (\n <AutocompletePrimitive.Input\n data-slot=\"autocomplete-input\"\n className={cn(\n \"dark:bg-edge/30 border-edge focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 disabled:bg-edge/50 dark:disabled:bg-edge/80 placeholder:text-soft h-8 w-full min-w-0 rounded-md border bg-transparent px-2.5 py-1 text-base transition-colors outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AutocompleteTrigger({ className, ...props }: AutocompleteTriggerProps) {\n return (\n <AutocompletePrimitive.Trigger\n data-slot=\"autocomplete-trigger\"\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteIcon({ className, ...props }: AutocompleteIconProps) {\n return (\n <AutocompletePrimitive.Icon\n data-slot=\"autocomplete-icon\"\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteClear({ className, ...props }: AutocompleteClearProps) {\n return (\n <AutocompletePrimitive.Clear\n data-slot=\"autocomplete-clear\"\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteValue({ ...props }: AutocompleteValueProps) {\n return (\n <AutocompletePrimitive.Value data-slot=\"autocomplete-value\" {...props} />\n )\n}\n\nfunction AutocompletePortal({ className, ...props }: AutocompletePortalProps) {\n return (\n <AutocompletePrimitive.Portal\n data-slot=\"autocomplete-portal\"\n className={cn(className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteBackdrop({ className, ...props }: AutocompleteBackdropProps) {\n return (\n <AutocompletePrimitive.Backdrop\n data-slot=\"autocomplete-backdrop\"\n className={cn(\"fixed inset-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompletePositioner({ className, ...props }: AutocompletePositionerProps) {\n return (\n <AutocompletePrimitive.Positioner\n data-slot=\"autocomplete-positioner\"\n className={cn(className)}\n {...props}\n />\n )\n}\n\nfunction AutocompletePopup({ className, ...props }: AutocompletePopupProps) {\n return (\n <AutocompletePrimitive.Popup\n data-slot=\"autocomplete-popup\"\n className={cn(\n \"motion-pop-md bg-elevated text-contrast ring-contrast/10 group/autocomplete-content relative max-h-(--available-height) min-w-(--anchor-width) max-w-(--available-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md shadow-md ring-1\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AutocompleteArrow({ className, ...props }: AutocompleteArrowProps) {\n return (\n <AutocompletePrimitive.Arrow\n data-slot=\"autocomplete-arrow\"\n className={cn(\"fill-elevated\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteStatus({ className, ...props }: AutocompleteStatusProps) {\n return (\n <AutocompletePrimitive.Status\n data-slot=\"autocomplete-status\"\n className={cn(\"text-muted flex w-full justify-center py-2 text-center text-sm\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteEmpty({ className, ...props }: AutocompleteEmptyProps) {\n return (\n <AutocompletePrimitive.Empty\n data-slot=\"autocomplete-empty\"\n className={cn(\"text-muted hidden w-full justify-center py-2 text-center text-sm group-data-empty/autocomplete-content:flex\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteList({ className, ...props }: AutocompleteListProps) {\n return (\n <AutocompletePrimitive.List\n data-slot=\"autocomplete-list\"\n className={cn(\"scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteRow({ className, ...props }: AutocompleteRowProps) {\n return (\n <AutocompletePrimitive.Row\n data-slot=\"autocomplete-row\"\n className={cn(className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteItem({ className, ...props }: AutocompleteItemProps) {\n return (\n <AutocompletePrimitive.Item\n data-slot=\"autocomplete-item\"\n className={cn(\n \"data-highlighted:bg-primary data-highlighted:text-white relative flex w-full cursor-clickable items-center gap-2 rounded-sm py-1 pl-1.5 pr-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction AutocompleteSeparator({ className, ...props }: AutocompleteSeparatorProps) {\n return (\n <AutocompletePrimitive.Separator\n data-slot=\"autocomplete-separator\"\n className={cn(\"bg-line -mx-1 my-1 h-px\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteGroup({ className, ...props }: AutocompleteGroupProps) {\n return (\n <AutocompletePrimitive.Group\n data-slot=\"autocomplete-group\"\n className={cn(\"pt-1\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteGroupLabel({ className, ...props }: AutocompleteGroupLabelProps) {\n return (\n <AutocompletePrimitive.GroupLabel\n data-slot=\"autocomplete-group-label\"\n className={cn(\"text-muted px-2 py-1.5 text-xs\", className)}\n {...props}\n />\n )\n}\n\nfunction AutocompleteCollection({ ...props }: AutocompleteCollectionProps) {\n return (\n <AutocompletePrimitive.Collection\n data-slot=\"autocomplete-collection\"\n {...props}\n />\n )\n}\n\nfunction AutocompleteContent({\n className,\n align = \"start\",\n alignOffset = 0,\n side = \"bottom\",\n sideOffset = 6,\n ...props\n}: AutocompleteContentProps) {\n return (\n <AutocompletePortal>\n <AutocompletePositioner\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n className=\"isolate z-50\"\n >\n <AutocompletePopup className={className} {...props} />\n </AutocompletePositioner>\n </AutocompletePortal>\n )\n}\n\nexport {\n Autocomplete,\n AutocompleteArrow,\n AutocompleteBackdrop,\n AutocompleteClear,\n AutocompleteCollection,\n AutocompleteContent,\n AutocompleteEmpty,\n AutocompleteGroup,\n AutocompleteGroupLabel,\n AutocompleteIcon,\n AutocompleteInput,\n AutocompleteItem,\n AutocompleteList,\n AutocompletePopup,\n AutocompletePortal,\n AutocompletePositioner,\n AutocompleteRow,\n AutocompleteSeparator,\n AutocompleteStatus,\n AutocompleteTrigger,\n AutocompleteValue,\n}"],"mappings":"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"}
|
package/dist/badge.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
5
5
|
|
|
6
6
|
//#region src/badge.d.ts
|
|
7
7
|
declare const badgeVariants: (props?: ({
|
|
8
|
-
variant?: "default" | "
|
|
8
|
+
variant?: "default" | "link" | "success" | "destructive" | "warning" | "secondary" | "outline" | "ghost" | null | undefined;
|
|
9
9
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
10
10
|
type BadgeProps = useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants>;
|
|
11
11
|
declare function Badge({
|
package/dist/badge.js
CHANGED
|
@@ -4,7 +4,7 @@ import { cva } from "class-variance-authority";
|
|
|
4
4
|
import { mergeProps } from "@base-ui/react/merge-props";
|
|
5
5
|
import { useRender } from "@base-ui/react/use-render";
|
|
6
6
|
//#region src/badge.tsx
|
|
7
|
-
const badgeVariants = cva("h-5 gap-1 rounded-full border border-transparent px-2 py-0.5 text-xs font-medium motion-color has-data-[icon=inline-start]:pl-1.5 has-data-[icon=inline-end]:pr-1.5 [&>svg]:size-3
|
|
7
|
+
const badgeVariants = cva("h-5 gap-1 rounded-full border border-transparent px-2 py-0.5 text-xs font-medium motion-color has-data-[icon=inline-start]:pl-1.5 has-data-[icon=inline-end]:pr-1.5 [&>svg:not([class*='size-'])]:size-3 inline-flex items-center justify-center w-fit whitespace-nowrap shrink-0 [&>svg]:pointer-events-none focus-visible:border-focus focus-visible:ring-focus/50 focus-visible:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive overflow-hidden group/badge", {
|
|
8
8
|
variants: { variant: {
|
|
9
9
|
default: "bg-primary text-white [a]:hover:bg-primary/80",
|
|
10
10
|
success: "bg-success/10 [a]:hover:bg-success/20 focus-visible:ring-success/50 text-success dark:bg-success/20",
|
package/dist/badge.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.js","names":[],"sources":["../src/badge.tsx"],"sourcesContent":["\"use client\"\n\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\n\nconst badgeVariants = cva(\n \"h-5 gap-1 rounded-full border border-transparent px-2 py-0.5 text-xs font-medium motion-color has-data-[icon=inline-start]:pl-1.5 has-data-[icon=inline-end]:pr-1.5 [&>svg]:size-3
|
|
1
|
+
{"version":3,"file":"badge.js","names":[],"sources":["../src/badge.tsx"],"sourcesContent":["\"use client\"\n\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\n\nconst badgeVariants = cva(\n \"h-5 gap-1 rounded-full border border-transparent px-2 py-0.5 text-xs font-medium motion-color has-data-[icon=inline-start]:pl-1.5 has-data-[icon=inline-end]:pr-1.5 [&>svg:not([class*='size-'])]:size-3 inline-flex items-center justify-center w-fit whitespace-nowrap shrink-0 [&>svg]:pointer-events-none focus-visible:border-focus focus-visible:ring-focus/50 focus-visible:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive overflow-hidden group/badge\",\n {\n variants: {\n variant: {\n default:\n \"bg-primary text-white [a]:hover:bg-primary/80\",\n success:\n \"bg-success/10 [a]:hover:bg-success/20 focus-visible:ring-success/50 text-success dark:bg-success/20\",\n destructive:\n \"bg-destructive/10 text-destructive [a]:hover:bg-destructive/20 focus-visible:ring-destructive/50 dark:bg-destructive/20\",\n warning:\n \"bg-warning/10 text-warning [a]:hover:bg-warning/20 focus-visible:ring-warning/50 dark:bg-warning/20\",\n secondary:\n \"bg-secondary text-contrast [a]:hover:bg-secondary/80\",\n outline:\n \"border-line text-contrast [a]:hover:bg-secondary [a]:hover:text-muted\",\n ghost:\n \"hover:bg-secondary hover:text-muted dark:hover:bg-secondary/50\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n }\n)\n\ntype BadgeProps = useRender.ComponentProps<\"span\"> & VariantProps<typeof badgeVariants>\n\nfunction Badge({\n className,\n variant = \"default\",\n render,\n ...props\n}: BadgeProps) {\n return useRender({\n defaultTagName: \"span\",\n props: mergeProps<\"span\">(\n {\n className: cn(badgeVariants({ className, variant })),\n },\n props\n ),\n render,\n state: {\n slot: \"badge\",\n variant,\n },\n })\n}\n\nexport { Badge, badgeVariants }\n"],"mappings":";;;;;;AAQA,MAAM,gBAAgB,IACpB,ggBACA;CACE,UAAU,EACR,SAAS;EACP,SACE;EACF,SACE;EACF,aACE;EACF,SACE;EACF,WACE;EACF,SACE;EACF,OACE;EACF,MAAM;EACP,EACF;CACD,iBAAiB,EACf,SAAS,WACV;CACF,CACF;AAID,SAAS,MAAM,EACb,WACA,UAAU,WACV,QACA,GAAG,SACU;AACb,QAAO,UAAU;EACf,gBAAgB;EAChB,OAAO,WACL,EACE,WAAW,GAAG,cAAc;GAAE;GAAW;GAAS,CAAC,CAAC,EACrD,EACD,MACD;EACD;EACA,OAAO;GACL,MAAM;GACN;GACD;EACF,CAAC"}
|
package/dist/button-group.js
CHANGED
|
@@ -8,8 +8,8 @@ import { useRender } from "@base-ui/react/use-render";
|
|
|
8
8
|
//#region src/button-group.tsx
|
|
9
9
|
const buttonGroupVariants = cva("has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md flex w-fit items-stretch *:focus-visible:z-10 *:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
|
|
10
10
|
variants: { orientation: {
|
|
11
|
-
horizontal: "[&>[data-slot]:
|
|
12
|
-
vertical: "[&>[data-slot]:
|
|
11
|
+
horizontal: "[&>[data-slot]:has(~[data-slot])]:rounded-r-none [&>[data-slot]~[data-slot]]:rounded-l-none [&>[data-slot]~[data-slot]]:border-l-0",
|
|
12
|
+
vertical: "flex-col [&>[data-slot]:has(~[data-slot])]:rounded-b-none [&>[data-slot]~[data-slot]]:rounded-t-none [&>[data-slot]~[data-slot]]:border-t-0"
|
|
13
13
|
} },
|
|
14
14
|
defaultVariants: { orientation: "horizontal" }
|
|
15
15
|
});
|
package/dist/button-group.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-group.js","names":[],"sources":["../src/button-group.tsx"],"sourcesContent":["\"use client\"\n\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Separator } from \"./separator\"\n\nconst buttonGroupVariants = cva(\n \"has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md flex w-fit items-stretch *:focus-visible:z-10 *:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1\",\n {\n variants: {\n orientation: {\n horizontal:\n \"[&>[data-slot]:
|
|
1
|
+
{"version":3,"file":"button-group.js","names":[],"sources":["../src/button-group.tsx"],"sourcesContent":["\"use client\"\n\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Separator } from \"./separator\"\n\nconst buttonGroupVariants = cva(\n \"has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md flex w-fit items-stretch *:focus-visible:z-10 *:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1\",\n {\n variants: {\n orientation: {\n horizontal:\n \"[&>[data-slot]:has(~[data-slot])]:rounded-r-none [&>[data-slot]~[data-slot]]:rounded-l-none [&>[data-slot]~[data-slot]]:border-l-0\",\n vertical:\n \"flex-col [&>[data-slot]:has(~[data-slot])]:rounded-b-none [&>[data-slot]~[data-slot]]:rounded-t-none [&>[data-slot]~[data-slot]]:border-t-0\",\n },\n },\n defaultVariants: {\n orientation: \"horizontal\",\n },\n }\n)\n\ntype ButtonGroupProps = React.ComponentProps<\"div\"> & VariantProps<typeof buttonGroupVariants>\ntype ButtonGroupTextProps = useRender.ComponentProps<\"div\">\ntype ButtonGroupSeparatorProps = React.ComponentProps<typeof Separator>\n\nfunction ButtonGroup({\n className,\n orientation,\n ...props\n}: ButtonGroupProps) {\n return (\n <div\n role=\"group\"\n data-slot=\"button-group\"\n data-orientation={orientation}\n className={cn(buttonGroupVariants({ orientation }), className)}\n {...props}\n />\n )\n}\n\nfunction ButtonGroupText({\n className,\n render,\n ...props\n}: ButtonGroupTextProps) {\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(\n {\n className: cn(\n \"bg-secondary gap-2 rounded-md border border-edge px-2.5 text-sm font-medium [&_svg:not([class*='size-'])]:size-4 flex items-center [&_svg]:pointer-events-none\",\n className\n ),\n },\n props\n ),\n render,\n state: {\n slot: \"button-group-text\",\n },\n })\n}\n\nfunction ButtonGroupSeparator({\n className,\n orientation = \"vertical\",\n ...props\n}: ButtonGroupSeparatorProps) {\n return (\n <Separator\n data-slot=\"button-group-separator\"\n orientation={orientation}\n className={cn(\n \"bg-edge relative self-stretch data-[orientation=horizontal]:mx-px data-[orientation=horizontal]:w-auto data-[orientation=vertical]:my-px data-[orientation=vertical]:h-auto\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n ButtonGroup,\n ButtonGroupSeparator,\n ButtonGroupText,\n buttonGroupVariants,\n}\n"],"mappings":";;;;;;;;AASA,MAAM,sBAAsB,IAC1B,4RACA;CACE,UAAU,EACR,aAAa;EACX,YACE;EACF,UACE;EACH,EACF;CACD,iBAAiB,EACf,aAAa,cACd;CACF,CACF;AAMD,SAAS,YAAY,EACnB,WACA,aACA,GAAG,SACgB;AACnB,QACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,oBAAkB;EAClB,WAAW,GAAG,oBAAoB,EAAE,aAAa,CAAC,EAAE,UAAU;EAC9D,GAAI;EACJ,CAAA;;AAIN,SAAS,gBAAgB,EACvB,WACA,QACA,GAAG,SACoB;AACvB,QAAO,UAAU;EACf,gBAAgB;EAChB,OAAO,WACL,EACE,WAAW,GACT,kKACA,UACD,EACF,EACD,MACD;EACD;EACA,OAAO,EACL,MAAM,qBACP;EACF,CAAC;;AAGJ,SAAS,qBAAqB,EAC5B,WACA,cAAc,YACd,GAAG,SACyB;AAC5B,QACE,oBAAC,WAAD;EACE,aAAU;EACG;EACb,WAAW,GACT,+KACA,UACD;EACD,GAAI;EACJ,CAAA"}
|
package/dist/button.d.ts
CHANGED
|
@@ -6,8 +6,8 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
6
6
|
|
|
7
7
|
//#region src/button.d.ts
|
|
8
8
|
declare const buttonVariants: (props?: ({
|
|
9
|
-
variant?: "default" | "
|
|
10
|
-
size?: "default" | "
|
|
9
|
+
variant?: "default" | "link" | "success" | "destructive" | "secondary" | "outline" | "ghost" | null | undefined;
|
|
10
|
+
size?: "default" | "icon" | "xs" | "sm" | "lg" | "xl" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
11
11
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
12
12
|
type ButtonProps = React.ComponentProps<typeof Button$1> & VariantProps<typeof buttonVariants>;
|
|
13
13
|
declare function Button({
|
package/dist/dialog.js
CHANGED
|
@@ -34,7 +34,7 @@ function DialogClose({ ...props }) {
|
|
|
34
34
|
function DialogOverlay({ className, ...props }) {
|
|
35
35
|
return /* @__PURE__ */ jsx(Dialog$1.Backdrop, {
|
|
36
36
|
"data-slot": "dialog-overlay",
|
|
37
|
-
className: cn("motion-scrim fixed inset-0 isolate z-50 bg-
|
|
37
|
+
className: cn("motion-scrim fixed inset-0 isolate z-50 bg-scrim supports-backdrop-filter:backdrop-blur-xs", className),
|
|
38
38
|
...props
|
|
39
39
|
});
|
|
40
40
|
}
|
package/dist/dialog.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.js","names":["DialogPrimitive"],"sources":["../src/dialog.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { CloseIcon } from \"./lib/internal-icons\"\n\ntype DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n /**\n * When `true`, clicking outside the dialog (backdrop / pointer\n * dismissal) does not close it. It can then only be closed via an\n * explicit action — the close button, `Esc`, or programmatically.\n *\n * Use this for dialogs containing forms, wizards, or other content\n * where an accidental outside click shouldn't discard the user's work.\n *\n * @default false\n */\n disablePointerDismissal?: boolean\n}\ntype DialogTriggerProps = React.ComponentProps<typeof DialogPrimitive.Trigger>\ntype DialogPortalProps = React.ComponentProps<typeof DialogPrimitive.Portal>\ntype DialogCloseProps = React.ComponentProps<typeof DialogPrimitive.Close>\ntype DialogOverlayProps = React.ComponentProps<typeof DialogPrimitive.Backdrop>\ntype DialogPopupProps = React.ComponentProps<typeof DialogPrimitive.Popup>\ntype DialogTitleProps = React.ComponentProps<typeof DialogPrimitive.Title>\ntype DialogDescriptionProps = React.ComponentProps<typeof DialogPrimitive.Description>\n\ntype DialogContentProps = DialogPopupProps & {\n showCloseButton?: boolean\n}\n\ntype DialogFooterProps = React.ComponentProps<\"div\"> & {\n showCloseButton?: boolean\n}\n\nfunction Dialog({ disablePointerDismissal, ...props }: DialogProps) {\n return <DialogPrimitive.Root data-slot=\"dialog\" disablePointerDismissal={disablePointerDismissal} {...props} />\n}\n\nfunction DialogTrigger({ ...props }: DialogTriggerProps) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({ ...props }: DialogPortalProps) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ ...props }: DialogCloseProps) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({\n className,\n ...props\n}: DialogOverlayProps) {\n return (\n <DialogPrimitive.Backdrop\n data-slot=\"dialog-overlay\"\n className={cn(\n \"motion-scrim fixed inset-0 isolate z-50 bg-
|
|
1
|
+
{"version":3,"file":"dialog.js","names":["DialogPrimitive"],"sources":["../src/dialog.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { CloseIcon } from \"./lib/internal-icons\"\n\ntype DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n /**\n * When `true`, clicking outside the dialog (backdrop / pointer\n * dismissal) does not close it. It can then only be closed via an\n * explicit action — the close button, `Esc`, or programmatically.\n *\n * Use this for dialogs containing forms, wizards, or other content\n * where an accidental outside click shouldn't discard the user's work.\n *\n * @default false\n */\n disablePointerDismissal?: boolean\n}\ntype DialogTriggerProps = React.ComponentProps<typeof DialogPrimitive.Trigger>\ntype DialogPortalProps = React.ComponentProps<typeof DialogPrimitive.Portal>\ntype DialogCloseProps = React.ComponentProps<typeof DialogPrimitive.Close>\ntype DialogOverlayProps = React.ComponentProps<typeof DialogPrimitive.Backdrop>\ntype DialogPopupProps = React.ComponentProps<typeof DialogPrimitive.Popup>\ntype DialogTitleProps = React.ComponentProps<typeof DialogPrimitive.Title>\ntype DialogDescriptionProps = React.ComponentProps<typeof DialogPrimitive.Description>\n\ntype DialogContentProps = DialogPopupProps & {\n showCloseButton?: boolean\n}\n\ntype DialogFooterProps = React.ComponentProps<\"div\"> & {\n showCloseButton?: boolean\n}\n\nfunction Dialog({ disablePointerDismissal, ...props }: DialogProps) {\n return <DialogPrimitive.Root data-slot=\"dialog\" disablePointerDismissal={disablePointerDismissal} {...props} />\n}\n\nfunction DialogTrigger({ ...props }: DialogTriggerProps) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({ ...props }: DialogPortalProps) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ ...props }: DialogCloseProps) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({\n className,\n ...props\n}: DialogOverlayProps) {\n return (\n <DialogPrimitive.Backdrop\n data-slot=\"dialog-overlay\"\n className={cn(\n \"motion-scrim fixed inset-0 isolate z-50 bg-scrim supports-backdrop-filter:backdrop-blur-xs\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DialogContent({\n className,\n children,\n showCloseButton = true,\n ...props\n}: DialogContentProps) {\n return (\n <DialogPortal>\n <DialogOverlay />\n <DialogPrimitive.Popup\n data-slot=\"dialog-content\"\n className={cn(\n \"motion-scale-lg bg-foundation ring-contrast/10 fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-lg p-4 text-sm ring-1 outline-none sm:max-w-sm\",\n className\n )}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n render={\n <Button\n variant=\"ghost\"\n className=\"absolute top-2 right-2\"\n size=\"icon-sm\"\n />\n }\n >\n <CloseIcon />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\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\", className)}\n {...props}\n />\n )\n}\n\nfunction DialogFooter({\n className,\n showCloseButton = false,\n children,\n ...props\n}: DialogFooterProps) {\n return (\n <div\n data-slot=\"dialog-footer\"\n className={cn(\n \"bg-secondary/50 -mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-lg border-t border-line p-4 sm:flex-row sm:justify-end\",\n className\n )}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close render={<Button variant=\"outline\" />}>\n Close\n </DialogPrimitive.Close>\n )}\n </div>\n )\n}\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n return (\n <DialogPrimitive.Title\n data-slot=\"dialog-title\"\n // pr-8 reserves room for the close button (absolute, top-2 right-2) so a\n // long title wraps before it instead of running underneath.\n className={cn(\"text-base leading-none font-medium pr-8\", className)}\n {...props}\n />\n )\n}\n\nfunction DialogDescription({\n className,\n ...props\n}: DialogDescriptionProps) {\n return (\n <DialogPrimitive.Description\n data-slot=\"dialog-description\"\n className={cn(\n \"text-muted *:[a]:hover:text-contrast text-sm *:[a]:underline *:[a]:underline-offset-3\",\n className\n )}\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":";;;;;;;;AAsCA,SAAS,OAAO,EAAE,yBAAyB,GAAG,SAAsB;AAClE,QAAO,oBAACA,SAAgB,MAAjB;EAAsB,aAAU;EAAkC;EAAyB,GAAI;EAAS,CAAA;;AAGjH,SAAS,cAAc,EAAE,GAAG,SAA6B;AACvD,QAAO,oBAACA,SAAgB,SAAjB;EAAyB,aAAU;EAAiB,GAAI;EAAS,CAAA;;AAG1E,SAAS,aAAa,EAAE,GAAG,SAA4B;AACrD,QAAO,oBAACA,SAAgB,QAAjB;EAAwB,aAAU;EAAgB,GAAI;EAAS,CAAA;;AAGxE,SAAS,YAAY,EAAE,GAAG,SAA2B;AACnD,QAAO,oBAACA,SAAgB,OAAjB;EAAuB,aAAU;EAAe,GAAI;EAAS,CAAA;;AAGtE,SAAS,cAAc,EACrB,WACA,GAAG,SACkB;AACrB,QACE,oBAACA,SAAgB,UAAjB;EACE,aAAU;EACV,WAAW,GACT,8FACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EACrB,WACA,UACA,kBAAkB,MAClB,GAAG,SACkB;AACrB,QACE,qBAAC,cAAD,EAAA,UAAA,CACE,oBAAC,eAAD,EAAiB,CAAA,EACjB,qBAACA,SAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GACT,iNACA,UACD;EACD,GAAI;YANN,CAQG,UACA,mBACC,qBAACA,SAAgB,OAAjB;GACE,aAAU;GACV,QACE,oBAAC,QAAD;IACE,SAAQ;IACR,WAAU;IACV,MAAK;IACL,CAAA;aAPN,CAUE,oBAAC,WAAD,EAAa,CAAA,EACb,oBAAC,QAAD;IAAM,WAAU;cAAU;IAAY,CAAA,CAChB;KAEJ;IACX,EAAA,CAAA;;AAInB,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,uBAAuB,UAAU;EAC/C,GAAI;EACJ,CAAA;;AAIN,SAAS,aAAa,EACpB,WACA,kBAAkB,OAClB,UACA,GAAG,SACiB;AACpB,QACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,4HACA,UACD;EACD,GAAI;YANN,CAQG,UACA,mBACC,oBAACA,SAAgB,OAAjB;GAAuB,QAAQ,oBAAC,QAAD,EAAQ,SAAQ,WAAY,CAAA;aAAE;GAErC,CAAA,CAEtB;;;AAIV,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2B;AAC9D,QACE,oBAACA,SAAgB,OAAjB;EACE,aAAU;EAGV,WAAW,GAAG,2CAA2C,UAAU;EACnE,GAAI;EACJ,CAAA;;AAIN,SAAS,kBAAkB,EACzB,WACA,GAAG,SACsB;AACzB,QACE,oBAACA,SAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GACT,yFACA,UACD;EACD,GAAI;EACJ,CAAA"}
|
package/dist/direction.js
CHANGED
package/dist/drawer.js
CHANGED
|
@@ -33,7 +33,7 @@ function DrawerClose({ ...props }) {
|
|
|
33
33
|
function DrawerOverlay({ className, ...props }) {
|
|
34
34
|
return /* @__PURE__ */ jsx(Drawer$1.Backdrop, {
|
|
35
35
|
"data-slot": "drawer-overlay",
|
|
36
|
-
className: cn("motion-scrim fixed inset-0 z-50 bg-
|
|
36
|
+
className: cn("motion-scrim fixed inset-0 z-50 bg-scrim supports-backdrop-filter:backdrop-blur-xs", className),
|
|
37
37
|
...props
|
|
38
38
|
});
|
|
39
39
|
}
|
package/dist/drawer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.js","names":["DrawerPrimitive"],"sources":["../src/drawer.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Drawer as DrawerPrimitive } from \"@base-ui/react/drawer\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { CloseIcon } from \"./lib/internal-icons\"\n\ntype DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root>\ntype DrawerTriggerProps = React.ComponentProps<typeof DrawerPrimitive.Trigger>\ntype DrawerPortalProps = React.ComponentProps<typeof DrawerPrimitive.Portal>\ntype DrawerCloseProps = React.ComponentProps<typeof DrawerPrimitive.Close>\ntype DrawerOverlayProps = React.ComponentProps<typeof DrawerPrimitive.Backdrop>\ntype DrawerPopupProps = React.ComponentProps<typeof DrawerPrimitive.Popup>\ntype DrawerTitleProps = React.ComponentProps<typeof DrawerPrimitive.Title>\ntype DrawerDescriptionProps = React.ComponentProps<typeof DrawerPrimitive.Description>\ntype DrawerHeaderProps = React.ComponentProps<\"div\">\ntype DrawerFooterProps = React.ComponentProps<\"div\">\n\ntype DrawerContentProps = DrawerPopupProps & {\n showCloseButton?: boolean\n}\n\nfunction Drawer({ ...props }: DrawerProps) {\n return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n}\n\nfunction DrawerTrigger({ ...props }: DrawerTriggerProps) {\n return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({ ...props }: DrawerCloseProps) {\n return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\nfunction DrawerOverlay({ className, ...props }: DrawerOverlayProps) {\n return (\n <DrawerPrimitive.Backdrop\n data-slot=\"drawer-overlay\"\n className={cn(\n \"motion-scrim fixed inset-0 z-50 bg-
|
|
1
|
+
{"version":3,"file":"drawer.js","names":["DrawerPrimitive"],"sources":["../src/drawer.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Drawer as DrawerPrimitive } from \"@base-ui/react/drawer\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { CloseIcon } from \"./lib/internal-icons\"\n\ntype DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root>\ntype DrawerTriggerProps = React.ComponentProps<typeof DrawerPrimitive.Trigger>\ntype DrawerPortalProps = React.ComponentProps<typeof DrawerPrimitive.Portal>\ntype DrawerCloseProps = React.ComponentProps<typeof DrawerPrimitive.Close>\ntype DrawerOverlayProps = React.ComponentProps<typeof DrawerPrimitive.Backdrop>\ntype DrawerPopupProps = React.ComponentProps<typeof DrawerPrimitive.Popup>\ntype DrawerTitleProps = React.ComponentProps<typeof DrawerPrimitive.Title>\ntype DrawerDescriptionProps = React.ComponentProps<typeof DrawerPrimitive.Description>\ntype DrawerHeaderProps = React.ComponentProps<\"div\">\ntype DrawerFooterProps = React.ComponentProps<\"div\">\n\ntype DrawerContentProps = DrawerPopupProps & {\n showCloseButton?: boolean\n}\n\nfunction Drawer({ ...props }: DrawerProps) {\n return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n}\n\nfunction DrawerTrigger({ ...props }: DrawerTriggerProps) {\n return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({ ...props }: DrawerCloseProps) {\n return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\nfunction DrawerOverlay({ className, ...props }: DrawerOverlayProps) {\n return (\n <DrawerPrimitive.Backdrop\n data-slot=\"drawer-overlay\"\n className={cn(\n \"motion-scrim fixed inset-0 z-50 bg-scrim supports-backdrop-filter:backdrop-blur-xs\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DrawerContent({\n className,\n children,\n showCloseButton = false,\n ...props\n}: DrawerContentProps) {\n return (\n <DrawerPortal>\n <DrawerOverlay />\n <DrawerPrimitive.Viewport\n data-slot=\"drawer-viewport\"\n className=\"fixed inset-0 z-50 outline-none\"\n >\n <DrawerPrimitive.Popup\n data-slot=\"drawer-content\"\n className={cn(\n // Base layout & appearance\n \"group/drawer-content bg-foundation fixed z-50 flex flex-col overflow-y-auto border-edge text-sm shadow-lg outline-none\",\n // Transition — animate translate at the lg tier + the one curve; disable during swipe\n \"transition-[translate] duration-(--duration-lg) ease-(--ease) data-[swiping]:duration-0\",\n // Bottom drawer (swipeDirection=\"down\")\n \"data-[swipe-direction=down]:inset-x-0 data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:mt-24 data-[swipe-direction=down]:max-h-[80vh] data-[swipe-direction=down]:rounded-t-lg data-[swipe-direction=down]:border-t\",\n // Top drawer (swipeDirection=\"up\")\n \"data-[swipe-direction=up]:inset-x-0 data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:mb-24 data-[swipe-direction=up]:max-h-[80vh] data-[swipe-direction=up]:rounded-b-lg data-[swipe-direction=up]:border-b\",\n // Left drawer (swipeDirection=\"left\")\n \"data-[swipe-direction=left]:inset-y-0 data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:w-3/4 data-[swipe-direction=left]:rounded-r-lg data-[swipe-direction=left]:border-r data-[swipe-direction=left]:sm:max-w-sm\",\n // Right drawer (swipeDirection=\"right\")\n \"data-[swipe-direction=right]:inset-y-0 data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:w-3/4 data-[swipe-direction=right]:rounded-l-lg data-[swipe-direction=right]:border-l data-[swipe-direction=right]:sm:max-w-sm\",\n // Enter/exit slide — bottom\n \"data-[swipe-direction=down]:data-[starting-style]:translate-y-full data-[swipe-direction=down]:data-[ending-style]:translate-y-full\",\n // Enter/exit slide — top\n \"data-[swipe-direction=up]:data-[starting-style]:-translate-y-full data-[swipe-direction=up]:data-[ending-style]:-translate-y-full\",\n // Enter/exit slide — left\n \"data-[swipe-direction=left]:data-[starting-style]:-translate-x-full data-[swipe-direction=left]:data-[ending-style]:-translate-x-full\",\n // Enter/exit slide — right\n \"data-[swipe-direction=right]:data-[starting-style]:translate-x-full data-[swipe-direction=right]:data-[ending-style]:translate-x-full\",\n className,\n )}\n {...props}\n >\n {/* Drag handle — visible only for bottom drawers */}\n <div\n data-slot=\"drawer-drag-handle\"\n className=\"bg-secondary mx-auto mt-4 hidden h-1 w-[100px] shrink-0 rounded-full group-data-[swipe-direction=down]/drawer-content:block\"\n />\n {children}\n {showCloseButton && (\n <DrawerPrimitive.Close\n data-slot=\"drawer-close\"\n render={\n <Button\n variant=\"ghost\"\n className=\"absolute top-2 right-2\"\n size=\"icon-sm\"\n />\n }\n >\n <CloseIcon />\n <span className=\"sr-only\">Close</span>\n </DrawerPrimitive.Close>\n )}\n </DrawerPrimitive.Popup>\n </DrawerPrimitive.Viewport>\n </DrawerPortal>\n )\n}\n\nfunction DrawerHeader({ className, ...props }: DrawerHeaderProps) {\n return (\n <div\n data-slot=\"drawer-header\"\n className={cn(\n \"flex flex-col gap-0.5 p-4 group-data-[swipe-direction=down]/drawer-content:text-center group-data-[swipe-direction=up]/drawer-content:text-center md:text-left\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DrawerFooter({ className, ...props }: DrawerFooterProps) {\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({ className, ...props }: DrawerTitleProps) {\n return (\n <DrawerPrimitive.Title\n data-slot=\"drawer-title\"\n className={cn(\"text-contrast text-base font-medium\", className)}\n {...props}\n />\n )\n}\n\nfunction DrawerDescription({\n className,\n ...props\n}: DrawerDescriptionProps) {\n return (\n <DrawerPrimitive.Description\n data-slot=\"drawer-description\"\n className={cn(\"text-muted 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":";;;;;;;;AAwBA,SAAS,OAAO,EAAE,GAAG,SAAsB;AACzC,QAAO,oBAACA,SAAgB,MAAjB;EAAsB,aAAU;EAAS,GAAI;EAAS,CAAA;;AAG/D,SAAS,cAAc,EAAE,GAAG,SAA6B;AACvD,QAAO,oBAACA,SAAgB,SAAjB;EAAyB,aAAU;EAAiB,GAAI;EAAS,CAAA;;AAG1E,SAAS,aAAa,EAAE,GAAG,SAA4B;AACrD,QAAO,oBAACA,SAAgB,QAAjB;EAAwB,aAAU;EAAgB,GAAI;EAAS,CAAA;;AAGxE,SAAS,YAAY,EAAE,GAAG,SAA2B;AACnD,QAAO,oBAACA,SAAgB,OAAjB;EAAuB,aAAU;EAAe,GAAI;EAAS,CAAA;;AAGtE,SAAS,cAAc,EAAE,WAAW,GAAG,SAA6B;AAClE,QACE,oBAACA,SAAgB,UAAjB;EACE,aAAU;EACV,WAAW,GACT,sFACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EACrB,WACA,UACA,kBAAkB,OAClB,GAAG,SACkB;AACrB,QACE,qBAAC,cAAD,EAAA,UAAA,CACE,oBAAC,eAAD,EAAiB,CAAA,EACjB,oBAACA,SAAgB,UAAjB;EACE,aAAU;EACV,WAAU;YAEV,qBAACA,SAAgB,OAAjB;GACE,aAAU;GACV,WAAW,GAET,0HAEA,2FAEA,uOAEA,wNAEA,oOAEA,2OAEA,uIAEA,qIAEA,yIAEA,yIACA,UACD;GACD,GAAI;aAzBN;IA4BE,oBAAC,OAAD;KACE,aAAU;KACV,WAAU;KACV,CAAA;IACD;IACA,mBACC,qBAACA,SAAgB,OAAjB;KACE,aAAU;KACV,QACE,oBAAC,QAAD;MACE,SAAQ;MACR,WAAU;MACV,MAAK;MACL,CAAA;eAPN,CAUE,oBAAC,WAAD,EAAa,CAAA,EACb,oBAAC,QAAD;MAAM,WAAU;gBAAU;MAAY,CAAA,CAChB;;IAEJ;;EACC,CAAA,CACd,EAAA,CAAA;;AAInB,SAAS,aAAa,EAAE,WAAW,GAAG,SAA4B;AAChE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kKACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,aAAa,EAAE,WAAW,GAAG,SAA4B;AAChE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,UAAU;EAC3D,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2B;AAC9D,QACE,oBAACA,SAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GAAG,uCAAuC,UAAU;EAC/D,GAAI;EACJ,CAAA;;AAIN,SAAS,kBAAkB,EACzB,WACA,GAAG,SACsB;AACzB,QACE,oBAACA,SAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GAAG,sBAAsB,UAAU;EAC9C,GAAI;EACJ,CAAA"}
|
package/dist/film-grain.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"film-grain.d.ts","names":[],"sources":["../src/film-grain.tsx"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"film-grain.d.ts","names":[],"sources":["../src/film-grain.tsx"],"mappings":";;;;UAOU,cAAA;EACR,OAAA;EACA,OAAA;EACA,SAAA,GAAY,KAAA,CAAM,aAAA;EAClB,GAAA;EACA,KAAA;EACA,SAAA;EACA,KAAA,GAAQ,KAAA,CAAM,aAAA;AAAA;AAAA,iBAGP,SAAA,CAAA;EACP,OAAA;EACA,OAAA;EACA,SAAA;EACA,GAAA;EACA,KAAA;EACA,SAAA;EACA;AAAA,GACC,cAAA,GAAc,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
package/dist/film-grain.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import { cn } from "./lib/utils.js";
|
|
2
3
|
import { useFilmGrain } from "./film-grain-webgl.js";
|
|
3
4
|
import "react";
|
|
4
5
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -11,8 +12,9 @@ function FilmGrain({ density = .6, opacity = .08, blendMode = "overlay", fps = 1
|
|
|
11
12
|
color
|
|
12
13
|
});
|
|
13
14
|
return /* @__PURE__ */ jsx("div", {
|
|
15
|
+
"data-slot": "film-grain",
|
|
14
16
|
"aria-hidden": "true",
|
|
15
|
-
className:
|
|
17
|
+
className: cn("absolute inset-0 z-0 pointer-events-none select-none overflow-hidden", className),
|
|
16
18
|
style: {
|
|
17
19
|
mixBlendMode: blendMode,
|
|
18
20
|
opacity,
|
|
@@ -20,6 +22,7 @@ function FilmGrain({ density = .6, opacity = .08, blendMode = "overlay", fps = 1
|
|
|
20
22
|
},
|
|
21
23
|
children: /* @__PURE__ */ jsx("canvas", {
|
|
22
24
|
ref: canvasRef,
|
|
25
|
+
"data-slot": "film-grain-canvas",
|
|
23
26
|
className: "w-full h-full will-change-transform"
|
|
24
27
|
})
|
|
25
28
|
});
|
package/dist/film-grain.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"film-grain.js","names":[],"sources":["../src/film-grain.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { useFilmGrain } from \"./film-grain-webgl\"\n\ninterface FilmGrainProps {\n density?: number\n opacity?: number\n blendMode?: React.CSSProperties[\"mixBlendMode\"]\n fps?: number\n color?: string\n className?: string\n style?: React.CSSProperties\n}\n\nfunction FilmGrain({\n density = 0.6,\n opacity = 0.08,\n blendMode = \"overlay\",\n fps = 18,\n color = \"#ffffff\",\n className,\n style,\n}: FilmGrainProps) {\n const canvasRef = useFilmGrain({ density, opacity, fps, color })\n\n return (\n <div\n aria-hidden=\"true\"\n className={
|
|
1
|
+
{"version":3,"file":"film-grain.js","names":[],"sources":["../src/film-grain.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { useFilmGrain } from \"./film-grain-webgl\"\nimport { cn } from \"./lib/utils\"\n\ninterface FilmGrainProps {\n density?: number\n opacity?: number\n blendMode?: React.CSSProperties[\"mixBlendMode\"]\n fps?: number\n color?: string\n className?: string\n style?: React.CSSProperties\n}\n\nfunction FilmGrain({\n density = 0.6,\n opacity = 0.08,\n blendMode = \"overlay\",\n fps = 18,\n color = \"#ffffff\",\n className,\n style,\n}: FilmGrainProps) {\n const canvasRef = useFilmGrain({ density, opacity, fps, color })\n\n return (\n <div\n data-slot=\"film-grain\"\n aria-hidden=\"true\"\n className={cn(\n \"absolute inset-0 z-0 pointer-events-none select-none overflow-hidden\",\n className,\n )}\n style={{ mixBlendMode: blendMode, opacity, ...style }}\n >\n <canvas\n ref={canvasRef}\n data-slot=\"film-grain-canvas\"\n className=\"w-full h-full will-change-transform\"\n />\n </div>\n )\n}\n\nexport { FilmGrain }\nexport type { FilmGrainProps }\n"],"mappings":";;;;;;AAiBA,SAAS,UAAU,EACjB,UAAU,IACV,UAAU,KACV,YAAY,WACZ,MAAM,IACN,QAAQ,WACR,WACA,SACiB;CACjB,MAAM,YAAY,aAAa;EAAE;EAAS;EAAS;EAAK;EAAO,CAAC;AAEhE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,eAAY;EACZ,WAAW,GACT,wEACA,UACD;EACD,OAAO;GAAE,cAAc;GAAW;GAAS,GAAG;GAAO;YAErD,oBAAC,UAAD;GACE,KAAK;GACL,aAAU;GACV,WAAU;GACV,CAAA;EACE,CAAA"}
|
package/dist/input-group.d.ts
CHANGED
|
@@ -18,7 +18,7 @@ declare function InputGroup({
|
|
|
18
18
|
...props
|
|
19
19
|
}: InputGroupProps): _$react_jsx_runtime0.JSX.Element;
|
|
20
20
|
declare const inputGroupAddonVariants: (props?: ({
|
|
21
|
-
align?: "inline-
|
|
21
|
+
align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
|
|
22
22
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
23
23
|
declare function InputGroupAddon({
|
|
24
24
|
className,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-group.d.ts","names":[],"sources":["../src/input-group.tsx"],"mappings":";;;;;;;KAUK,eAAA,GAAkB,KAAA,CAAM,cAAA;AAAA,KAExB,oBAAA,GAAuB,KAAA,CAAM,cAAA,UAChC,YAAA,QAAoB,uBAAA;AAAA,KAEjB,qBAAA,GAAwB,IAAA,CAAK,KAAA,CAAM,cAAA,QAAsB,MAAA,sBAC5D,YAAA,QAAoB,wBAAA;EAClB,IAAA;AAAA;AAAA,KAGC,mBAAA,GAAsB,KAAA,CAAM,cAAA;AAAA,KAE5B,oBAAA,GAAuB,KAAA,CAAM,cAAA;AAAA,KAE7B,uBAAA,GAA0B,KAAA,CAAM,cAAA;AAAA,iBAE5B,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,eAAA,GAAe,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cActD,uBAAA,GAAuB,KAAA;;IAmB5B,iCAAA,CAAA,SAAA;AAAA,iBAEQ,eAAA,CAAA;EACP,SAAA;EACA,KAAA;EAAA,GACG;AAAA,GACF,oBAAA,GAAoB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAkBjB,wBAAA,GAAwB,KAAA;;IAgB7B,iCAAA,CAAA,SAAA;AAAA,iBAEQ,gBAAA,CAAA;EACP,SAAA;EACA,IAAA;EACA,OAAA;EACA,IAAA;EAAA,GACG;AAAA,GACF,qBAAA,GAAqB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAYf,cAAA,CAAA;EAAiB,SAAA;EAAA,GAAc;AAAA,GAAS,mBAAA,GAAmB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"input-group.d.ts","names":[],"sources":["../src/input-group.tsx"],"mappings":";;;;;;;KAUK,eAAA,GAAkB,KAAA,CAAM,cAAA;AAAA,KAExB,oBAAA,GAAuB,KAAA,CAAM,cAAA,UAChC,YAAA,QAAoB,uBAAA;AAAA,KAEjB,qBAAA,GAAwB,IAAA,CAAK,KAAA,CAAM,cAAA,QAAsB,MAAA,sBAC5D,YAAA,QAAoB,wBAAA;EAClB,IAAA;AAAA;AAAA,KAGC,mBAAA,GAAsB,KAAA,CAAM,cAAA;AAAA,KAE5B,oBAAA,GAAuB,KAAA,CAAM,cAAA;AAAA,KAE7B,uBAAA,GAA0B,KAAA,CAAM,cAAA;AAAA,iBAE5B,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,eAAA,GAAe,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cActD,uBAAA,GAAuB,KAAA;;IAmB5B,iCAAA,CAAA,SAAA;AAAA,iBAEQ,eAAA,CAAA;EACP,SAAA;EACA,KAAA;EAAA,GACG;AAAA,GACF,oBAAA,GAAoB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAkBjB,wBAAA,GAAwB,KAAA;;IAgB7B,iCAAA,CAAA,SAAA;AAAA,iBAEQ,gBAAA,CAAA;EACP,SAAA;EACA,IAAA;EACA,OAAA;EACA,IAAA;EAAA,GACG;AAAA,GACF,qBAAA,GAAqB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAYf,cAAA,CAAA;EAAiB,SAAA;EAAA,GAAc;AAAA,GAAS,mBAAA,GAAmB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAa3D,eAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,oBAAA,GAAoB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAad,kBAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,uBAAA,GAAuB,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
package/dist/input-group.js
CHANGED
|
@@ -57,6 +57,7 @@ function InputGroupButton({ className, type = "button", variant = "ghost", size
|
|
|
57
57
|
}
|
|
58
58
|
function InputGroupText({ className, ...props }) {
|
|
59
59
|
return /* @__PURE__ */ jsx("span", {
|
|
60
|
+
"data-slot": "input-group-text",
|
|
60
61
|
className: cn("text-muted flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
|
|
61
62
|
...props
|
|
62
63
|
});
|
package/dist/input-group.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-group.js","names":[],"sources":["../src/input-group.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport { Textarea } from \"./textarea\"\n\ntype InputGroupProps = React.ComponentProps<\"div\">\n\ntype InputGroupAddonProps = React.ComponentProps<\"div\"> &\n VariantProps<typeof inputGroupAddonVariants>\n\ntype InputGroupButtonProps = Omit<React.ComponentProps<typeof Button>, \"size\" | \"type\"> &\n VariantProps<typeof inputGroupButtonVariants> & {\n type?: \"button\" | \"submit\" | \"reset\"\n }\n\ntype InputGroupTextProps = React.ComponentProps<\"span\">\n\ntype InputGroupInputProps = React.ComponentProps<\"input\">\n\ntype InputGroupTextareaProps = React.ComponentProps<\"textarea\">\n\nfunction InputGroup({ className, ...props }: InputGroupProps) {\n return (\n <div\n data-slot=\"input-group\"\n role=\"group\"\n className={cn(\n \"border-edge dark:bg-edge/30 has-[[data-slot=input-group-control]:focus-visible]:border-focus has-[[data-slot=input-group-control]:focus-visible]:ring-focus/50 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-disabled:bg-edge/50 dark:has-disabled:bg-edge/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-md border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\",\n className\n )}\n {...props}\n />\n )\n}\n\nconst inputGroupAddonVariants = cva(\n \"text-muted h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-sm [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none\",\n {\n variants: {\n align: {\n \"inline-start\":\n \"pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first\",\n \"inline-end\":\n \"pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last\",\n \"block-start\":\n \"px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start\",\n \"block-end\":\n \"px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start\",\n },\n },\n defaultVariants: {\n align: \"inline-start\",\n },\n }\n)\n\nfunction InputGroupAddon({\n className,\n align = \"inline-start\",\n ...props\n}: InputGroupAddonProps) {\n return (\n <div\n role=\"group\"\n data-slot=\"input-group-addon\"\n data-align={align}\n className={cn(inputGroupAddonVariants({ align }), className)}\n onClick={(e) => {\n if ((e.target as HTMLElement).closest(\"button\")) {\n return\n }\n e.currentTarget.parentElement?.querySelector(\"input\")?.focus()\n }}\n {...props}\n />\n )\n}\n\nconst inputGroupButtonVariants = cva(\n \"gap-2 text-sm shadow-none flex items-center\",\n {\n variants: {\n size: {\n xs: \"h-6 gap-1 rounded-sm px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n sm: \"\",\n \"icon-xs\":\n \"size-6 rounded-sm p-0\",\n \"icon-sm\": \"size-8 p-0\",\n },\n },\n defaultVariants: {\n size: \"xs\",\n },\n }\n)\n\nfunction InputGroupButton({\n className,\n type = \"button\",\n variant = \"ghost\",\n size = \"xs\",\n ...props\n}: InputGroupButtonProps) {\n return (\n <Button\n type={type}\n data-size={size}\n variant={variant}\n className={cn(inputGroupButtonVariants({ size }), className)}\n {...props}\n />\n )\n}\n\nfunction InputGroupText({ className, ...props }: InputGroupTextProps) {\n return (\n <span\n className={cn(\n \"text-muted flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction InputGroupInput({\n className,\n ...props\n}: InputGroupInputProps) {\n return (\n <Input\n data-slot=\"input-group-control\"\n className={cn(\n \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction InputGroupTextarea({\n className,\n ...props\n}: InputGroupTextareaProps) {\n return (\n <Textarea\n data-slot=\"input-group-control\"\n className={cn(\n \"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n InputGroup,\n InputGroupAddon,\n InputGroupButton,\n InputGroupText,\n InputGroupInput,\n InputGroupTextarea,\n}\n"],"mappings":";;;;;;;;;AA0BA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,WAAW,GACT,yqCACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,MAAM,0BAA0B,IAC9B,yNACA;CACE,UAAU,EACR,OAAO;EACL,gBACE;EACF,cACE;EACF,eACE;EACF,aACE;EACH,EACF;CACD,iBAAiB,EACf,OAAO,gBACR;CACF,CACF;AAED,SAAS,gBAAgB,EACvB,WACA,QAAQ,gBACR,GAAG,SACoB;AACvB,QACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,wBAAwB,EAAE,OAAO,CAAC,EAAE,UAAU;EAC5D,UAAU,MAAM;AACd,OAAK,EAAE,OAAuB,QAAQ,SAAS,CAC7C;AAEF,KAAE,cAAc,eAAe,cAAc,QAAQ,EAAE,OAAO;;EAEhE,GAAI;EACJ,CAAA;;AAIN,MAAM,2BAA2B,IAC/B,+CACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,WACE;EACF,WAAW;EACZ,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,CACF;AAED,SAAS,iBAAiB,EACxB,WACA,OAAO,UACP,UAAU,SACV,OAAO,MACP,GAAG,SACqB;AACxB,QACE,oBAAC,QAAD;EACQ;EACN,aAAW;EACF;EACT,WAAW,GAAG,yBAAyB,EAAE,MAAM,CAAC,EAAE,UAAU;EAC5D,GAAI;EACJ,CAAA;;AAIN,SAAS,eAAe,EAAE,WAAW,GAAG,SAA8B;AACpE,QACE,oBAAC,QAAD;EACE,WAAW,GACT,+GACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,gBAAgB,EACvB,WACA,GAAG,SACoB;AACvB,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,oLACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACuB;AAC1B,QACE,oBAAC,UAAD;EACE,aAAU;EACV,WAAW,GACT,qMACA,UACD;EACD,GAAI;EACJ,CAAA"}
|
|
1
|
+
{"version":3,"file":"input-group.js","names":[],"sources":["../src/input-group.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport { Textarea } from \"./textarea\"\n\ntype InputGroupProps = React.ComponentProps<\"div\">\n\ntype InputGroupAddonProps = React.ComponentProps<\"div\"> &\n VariantProps<typeof inputGroupAddonVariants>\n\ntype InputGroupButtonProps = Omit<React.ComponentProps<typeof Button>, \"size\" | \"type\"> &\n VariantProps<typeof inputGroupButtonVariants> & {\n type?: \"button\" | \"submit\" | \"reset\"\n }\n\ntype InputGroupTextProps = React.ComponentProps<\"span\">\n\ntype InputGroupInputProps = React.ComponentProps<\"input\">\n\ntype InputGroupTextareaProps = React.ComponentProps<\"textarea\">\n\nfunction InputGroup({ className, ...props }: InputGroupProps) {\n return (\n <div\n data-slot=\"input-group\"\n role=\"group\"\n className={cn(\n \"border-edge dark:bg-edge/30 has-[[data-slot=input-group-control]:focus-visible]:border-focus has-[[data-slot=input-group-control]:focus-visible]:ring-focus/50 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-disabled:bg-edge/50 dark:has-disabled:bg-edge/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-md border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\",\n className\n )}\n {...props}\n />\n )\n}\n\nconst inputGroupAddonVariants = cva(\n \"text-muted h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-sm [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none\",\n {\n variants: {\n align: {\n \"inline-start\":\n \"pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first\",\n \"inline-end\":\n \"pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last\",\n \"block-start\":\n \"px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start\",\n \"block-end\":\n \"px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start\",\n },\n },\n defaultVariants: {\n align: \"inline-start\",\n },\n }\n)\n\nfunction InputGroupAddon({\n className,\n align = \"inline-start\",\n ...props\n}: InputGroupAddonProps) {\n return (\n <div\n role=\"group\"\n data-slot=\"input-group-addon\"\n data-align={align}\n className={cn(inputGroupAddonVariants({ align }), className)}\n onClick={(e) => {\n if ((e.target as HTMLElement).closest(\"button\")) {\n return\n }\n e.currentTarget.parentElement?.querySelector(\"input\")?.focus()\n }}\n {...props}\n />\n )\n}\n\nconst inputGroupButtonVariants = cva(\n \"gap-2 text-sm shadow-none flex items-center\",\n {\n variants: {\n size: {\n xs: \"h-6 gap-1 rounded-sm px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n sm: \"\",\n \"icon-xs\":\n \"size-6 rounded-sm p-0\",\n \"icon-sm\": \"size-8 p-0\",\n },\n },\n defaultVariants: {\n size: \"xs\",\n },\n }\n)\n\nfunction InputGroupButton({\n className,\n type = \"button\",\n variant = \"ghost\",\n size = \"xs\",\n ...props\n}: InputGroupButtonProps) {\n return (\n <Button\n type={type}\n data-size={size}\n variant={variant}\n className={cn(inputGroupButtonVariants({ size }), className)}\n {...props}\n />\n )\n}\n\nfunction InputGroupText({ className, ...props }: InputGroupTextProps) {\n return (\n <span\n data-slot=\"input-group-text\"\n className={cn(\n \"text-muted flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction InputGroupInput({\n className,\n ...props\n}: InputGroupInputProps) {\n return (\n <Input\n data-slot=\"input-group-control\"\n className={cn(\n \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction InputGroupTextarea({\n className,\n ...props\n}: InputGroupTextareaProps) {\n return (\n <Textarea\n data-slot=\"input-group-control\"\n className={cn(\n \"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n InputGroup,\n InputGroupAddon,\n InputGroupButton,\n InputGroupText,\n InputGroupInput,\n InputGroupTextarea,\n}\n"],"mappings":";;;;;;;;;AA0BA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,WAAW,GACT,yqCACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,MAAM,0BAA0B,IAC9B,yNACA;CACE,UAAU,EACR,OAAO;EACL,gBACE;EACF,cACE;EACF,eACE;EACF,aACE;EACH,EACF;CACD,iBAAiB,EACf,OAAO,gBACR;CACF,CACF;AAED,SAAS,gBAAgB,EACvB,WACA,QAAQ,gBACR,GAAG,SACoB;AACvB,QACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,wBAAwB,EAAE,OAAO,CAAC,EAAE,UAAU;EAC5D,UAAU,MAAM;AACd,OAAK,EAAE,OAAuB,QAAQ,SAAS,CAC7C;AAEF,KAAE,cAAc,eAAe,cAAc,QAAQ,EAAE,OAAO;;EAEhE,GAAI;EACJ,CAAA;;AAIN,MAAM,2BAA2B,IAC/B,+CACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,WACE;EACF,WAAW;EACZ,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,CACF;AAED,SAAS,iBAAiB,EACxB,WACA,OAAO,UACP,UAAU,SACV,OAAO,MACP,GAAG,SACqB;AACxB,QACE,oBAAC,QAAD;EACQ;EACN,aAAW;EACF;EACT,WAAW,GAAG,yBAAyB,EAAE,MAAM,CAAC,EAAE,UAAU;EAC5D,GAAI;EACJ,CAAA;;AAIN,SAAS,eAAe,EAAE,WAAW,GAAG,SAA8B;AACpE,QACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GACT,+GACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,gBAAgB,EACvB,WACA,GAAG,SACoB;AACvB,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,oLACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACuB;AAC1B,QACE,oBAAC,UAAD;EACE,aAAU;EACV,WAAW,GACT,qMACA,UACD;EACD,GAAI;EACJ,CAAA"}
|
package/dist/item.js
CHANGED
|
@@ -7,7 +7,7 @@ import { cva } from "class-variance-authority";
|
|
|
7
7
|
import { mergeProps } from "@base-ui/react/merge-props";
|
|
8
8
|
import { useRender } from "@base-ui/react/use-render";
|
|
9
9
|
//#region src/item.tsx
|
|
10
|
-
const itemVariants = cva("[a]:hover:bg-secondary rounded-md border text-sm w-full group/item focus-visible:border-focus focus-visible:ring-focus/50 flex items-center flex-wrap outline-none
|
|
10
|
+
const itemVariants = cva("[a]:hover:bg-secondary rounded-md border text-sm w-full group/item focus-visible:border-focus focus-visible:ring-focus/50 flex items-center flex-wrap outline-none motion-color focus-visible:ring-3", {
|
|
11
11
|
variants: {
|
|
12
12
|
variant: {
|
|
13
13
|
default: "border-transparent",
|
package/dist/item.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.js","names":[],"sources":["../src/item.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Separator } from \"./separator\"\n\nconst itemVariants = cva(\n \"[a]:hover:bg-secondary rounded-md border text-sm w-full group/item focus-visible:border-focus focus-visible:ring-focus/50 flex items-center flex-wrap outline-none
|
|
1
|
+
{"version":3,"file":"item.js","names":[],"sources":["../src/item.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Separator } from \"./separator\"\n\nconst itemVariants = cva(\n \"[a]:hover:bg-secondary rounded-md border text-sm w-full group/item focus-visible:border-focus focus-visible:ring-focus/50 flex items-center flex-wrap outline-none motion-color focus-visible:ring-3\",\n {\n variants: {\n variant: {\n default: \"border-transparent\",\n outline: \"border-line\",\n muted: \"bg-secondary/50 border-transparent\",\n },\n size: {\n default: \"gap-2.5 px-3 py-2.5\",\n sm: \"gap-2.5 px-3 py-2.5\",\n xs: \"gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n }\n)\n\nconst itemMediaVariants = cva(\n \"gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start flex shrink-0 items-center justify-center [&_svg]:pointer-events-none\",\n {\n variants: {\n variant: {\n default: \"bg-transparent\",\n icon: \"[&_svg:not([class*='size-'])]:size-4\",\n image: \"size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n }\n)\n\ntype ItemGroupProps = React.ComponentProps<\"div\">\ntype ItemSeparatorProps = React.ComponentProps<typeof Separator>\ntype ItemProps = useRender.ComponentProps<\"div\"> & VariantProps<typeof itemVariants>\ntype ItemMediaProps = React.ComponentProps<\"div\"> & VariantProps<typeof itemMediaVariants>\ntype ItemContentProps = React.ComponentProps<\"div\">\ntype ItemTitleProps = React.ComponentProps<\"div\">\ntype ItemDescriptionProps = React.ComponentProps<\"p\">\ntype ItemActionsProps = React.ComponentProps<\"div\">\ntype ItemHeaderProps = React.ComponentProps<\"div\">\ntype ItemFooterProps = React.ComponentProps<\"div\">\n\nfunction ItemGroup({ className, ...props }: ItemGroupProps) {\n return (\n <div\n data-slot=\"item-group\"\n className={cn(\n \"group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ItemSeparator({ className, ...props }: ItemSeparatorProps) {\n return (\n <Separator\n data-slot=\"item-separator\"\n orientation=\"horizontal\"\n className={cn(\"my-2\", className)}\n {...props}\n />\n )\n}\n\nfunction Item({\n className,\n variant = \"default\",\n size = \"default\",\n render,\n ...props\n}: ItemProps) {\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(\n {\n className: cn(itemVariants({ variant, size, className })),\n },\n props\n ),\n render,\n state: {\n slot: \"item\",\n variant,\n size,\n },\n })\n}\n\nfunction ItemMedia({ className, variant = \"default\", ...props }: ItemMediaProps) {\n return (\n <div\n data-slot=\"item-media\"\n data-variant={variant}\n className={cn(itemMediaVariants({ variant, className }))}\n {...props}\n />\n )\n}\n\nfunction ItemContent({ className, ...props }: ItemContentProps) {\n return (\n <div\n data-slot=\"item-content\"\n className={cn(\n \"flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ItemTitle({ className, ...props }: ItemTitleProps) {\n return (\n <div\n data-slot=\"item-title\"\n className={cn(\n \"line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ItemDescription({ className, ...props }: ItemDescriptionProps) {\n return (\n <p\n data-slot=\"item-description\"\n className={cn(\n \"text-muted [&>a:hover]:text-primary line-clamp-2 text-left text-sm leading-normal font-normal group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ItemActions({ className, ...props }: ItemActionsProps) {\n return (\n <div\n data-slot=\"item-actions\"\n className={cn(\"flex items-center gap-2\", className)}\n {...props}\n />\n )\n}\n\nfunction ItemHeader({ className, ...props }: ItemHeaderProps) {\n return (\n <div\n data-slot=\"item-header\"\n className={cn(\n \"flex basis-full items-center justify-between gap-2\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ItemFooter({ className, ...props }: ItemFooterProps) {\n return (\n <div\n data-slot=\"item-footer\"\n className={cn(\n \"flex basis-full items-center justify-between gap-2\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n Item,\n ItemMedia,\n ItemContent,\n ItemActions,\n ItemGroup,\n ItemSeparator,\n ItemTitle,\n ItemDescription,\n ItemHeader,\n ItemFooter,\n}\n"],"mappings":";;;;;;;;;AAUA,MAAM,eAAe,IACnB,wMACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACT,OAAO;GACR;EACD,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACL;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF;AAED,MAAM,oBAAoB,IACxB,kMACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,MAAM;EACN,OAAO;EACR,EACF;CACD,iBAAiB,EACf,SAAS,WACV;CACF,CACF;AAaD,SAAS,UAAU,EAAE,WAAW,GAAG,SAAyB;AAC1D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,mGACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAA6B;AAClE,QACE,oBAAC,WAAD;EACE,aAAU;EACV,aAAY;EACZ,WAAW,GAAG,QAAQ,UAAU;EAChC,GAAI;EACJ,CAAA;;AAIN,SAAS,KAAK,EACZ,WACA,UAAU,WACV,OAAO,WACP,QACA,GAAG,SACS;AACZ,QAAO,UAAU;EACf,gBAAgB;EAChB,OAAO,WACL,EACE,WAAW,GAAG,aAAa;GAAE;GAAS;GAAM;GAAW,CAAC,CAAC,EAC1D,EACD,MACD;EACD;EACA,OAAO;GACL,MAAM;GACN;GACA;GACD;EACF,CAAC;;AAGJ,SAAS,UAAU,EAAE,WAAW,UAAU,WAAW,GAAG,SAAyB;AAC/E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,gBAAc;EACd,WAAW,GAAG,kBAAkB;GAAE;GAAS;GAAW,CAAC,CAAC;EACxD,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2B;AAC9D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,qGACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,UAAU,EAAE,WAAW,GAAG,SAAyB;AAC1D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kGACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAA+B;AACtE,QACE,oBAAC,KAAD;EACE,aAAU;EACV,WAAW,GACT,4KACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2B;AAC9D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,UAAU;EACnD,GAAI;EACJ,CAAA;;AAIN,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,sDACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,sDACA,UACD;EACD,GAAI;EACJ,CAAA"}
|
package/dist/label.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"label.d.ts","names":[],"sources":["../src/label.tsx"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"label.d.ts","names":[],"sources":["../src/label.tsx"],"mappings":";;;;KAIK,UAAA,GAAa,KAAA,CAAM,cAAA;AAAA,iBAEf,KAAA,CAAA;EAAQ,SAAA;EAAA,GAAc;AAAA,GAAS,UAAA,GAAU,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
package/dist/label.js
CHANGED
package/dist/label.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"label.js","names":[],"sources":["../src/label.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"label.js","names":[],"sources":["../src/label.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\n\ntype LabelProps = React.ComponentProps<\"label\">\n\nfunction Label({ className, ...props }: LabelProps) {\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 group-data-[disabled]:pointer-events-none group-data-[disabled]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Label }\n"],"mappings":";;;;AAMA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAqB;AAClD,QACE,oBAAC,SAAD;EACE,aAAU;EACV,WAAW,GACT,6MACA,UACD;EACD,GAAI;EACJ,CAAA"}
|
package/dist/lib/utils.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","names":[],"sources":["../../src/lib/utils.ts"],"mappings":";;;;;AAA6C;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"utils.d.ts","names":[],"sources":["../../src/lib/utils.ts"],"mappings":";;;;;AAA6C;;;;;;;;;;;;;;;AAoE7C;;;;;AACA;;;;;;;;;;;KAHK,OAAA,UAAiB,UAAA,KAAe,KAAA,EAAO,KAAA,KAAU,UAAA;AAAA,iBAEtC,EAAA,CAAA,GAAM,MAAA,EAAQ,UAAA;AAAA,iBACd,EAAA,OAAA,CAAA,GAAa,MAAA,EAAQ,OAAA,CAAQ,KAAA,OAAY,KAAA,EAAO,KAAA"}
|
package/dist/lib/utils.js
CHANGED
|
@@ -1,6 +1,30 @@
|
|
|
1
1
|
import { clsx } from "clsx";
|
|
2
|
-
import {
|
|
2
|
+
import { extendTailwindMerge } from "tailwind-merge";
|
|
3
3
|
//#region src/lib/utils.ts
|
|
4
|
+
/**
|
|
5
|
+
* tailwind-merge, taught about the library's custom utilities so they
|
|
6
|
+
* conflict-resolve like built-ins:
|
|
7
|
+
* - the enter/exit motion recipes (`motion-scale/slide/fade/pop-*`) are mutually
|
|
8
|
+
* exclusive — the last one applied wins (e.g. a consumer overriding a
|
|
9
|
+
* component's default animation). `motion-color` / `motion-scrim` are left out
|
|
10
|
+
* on purpose: they compose with an enter recipe on the same element.
|
|
11
|
+
* - `cursor-clickable` joins the built-in `cursor` group.
|
|
12
|
+
*/
|
|
13
|
+
const twMerge = extendTailwindMerge({ extend: { classGroups: {
|
|
14
|
+
"motion-enter": [
|
|
15
|
+
"motion-scale-sm",
|
|
16
|
+
"motion-scale-md",
|
|
17
|
+
"motion-scale-lg",
|
|
18
|
+
"motion-slide-sm",
|
|
19
|
+
"motion-slide-md",
|
|
20
|
+
"motion-slide-lg",
|
|
21
|
+
"motion-fade-sm",
|
|
22
|
+
"motion-fade-md",
|
|
23
|
+
"motion-fade-lg",
|
|
24
|
+
"motion-pop-md"
|
|
25
|
+
],
|
|
26
|
+
cursor: ["cursor-clickable"]
|
|
27
|
+
} } });
|
|
4
28
|
function cn(...inputs) {
|
|
5
29
|
if (!inputs.some((v) => typeof v === "function")) return twMerge(clsx(inputs));
|
|
6
30
|
return (state) => {
|
package/dist/lib/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","names":[],"sources":["../../src/lib/utils.ts"],"sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport {
|
|
1
|
+
{"version":3,"file":"utils.js","names":[],"sources":["../../src/lib/utils.ts"],"sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\n/**\n * tailwind-merge, taught about the library's custom utilities so they\n * conflict-resolve like built-ins:\n * - the enter/exit motion recipes (`motion-scale/slide/fade/pop-*`) are mutually\n * exclusive — the last one applied wins (e.g. a consumer overriding a\n * component's default animation). `motion-color` / `motion-scrim` are left out\n * on purpose: they compose with an enter recipe on the same element.\n * - `cursor-clickable` joins the built-in `cursor` group.\n */\nconst twMerge = extendTailwindMerge<\"motion-enter\">({\n extend: {\n classGroups: {\n \"motion-enter\": [\n \"motion-scale-sm\",\n \"motion-scale-md\",\n \"motion-scale-lg\",\n \"motion-slide-sm\",\n \"motion-slide-md\",\n \"motion-slide-lg\",\n \"motion-fade-sm\",\n \"motion-fade-md\",\n \"motion-fade-lg\",\n \"motion-pop-md\",\n ],\n cursor: [\"cursor-clickable\"],\n },\n },\n});\n\n/**\n * `cn()` is the single className helper.\n *\n * It does two things:\n * - Combines conditional class values (via `clsx`).\n * - Dedupes/conflict-resolves Tailwind utilities (via `tailwind-merge`).\n *\n * Why the overloads?\n * - Base UI primitives support `className` as either a string **or** a `(state) => string` function.\n * - DOM elements (`div`, `textarea`, etc.) only accept `className: string`.\n *\n * So `cn()` is overloaded:\n * - If you pass only string/clsx values, it returns a **string**.\n * - If you pass any function-valued input, it returns a **(state) => string** function.\n *\n * Examples:\n * ```ts\n * // DOM element (string only)\n * <div className={cn(\"p-4\", isActive && \"bg-muted\")} />\n *\n * // Base UI primitive (state function)\n * <SomeBaseUiThing\n * className={cn(\n * \"px-2\",\n * (s) => s.disabled && \"opacity-50\",\n * (s) => s.active && \"bg-muted\",\n * )}\n * />\n *\n * // Important: DOM elements only accept string className.\n * // So only pass string/clsx values to `cn()` for DOM elements.\n * ```\n */\n\ntype CnValue<State> = ClassValue | ((state: State) => ClassValue);\n\nexport function cn(...inputs: ClassValue[]): string;\nexport function cn<State>(...inputs: CnValue<State>[]): (state: State) => string;\nexport function cn<State>(...inputs: CnValue<State>[]) {\n const hasFn = inputs.some((v) => typeof v === \"function\");\n\n if (!hasFn) {\n return twMerge(clsx(inputs as ClassValue[]));\n }\n\n return (state: State) => {\n const resolved = inputs.map((v) =>\n typeof v === \"function\" ? (v as (s: State) => ClassValue)(state) : v,\n );\n\n return twMerge(clsx(resolved as ClassValue[]));\n };\n}\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,UAAU,oBAAoC,EAClD,QAAQ,EACN,aAAa;CACX,gBAAgB;EACd;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,QAAQ,CAAC,mBAAmB;CAC7B,EACF,EACF,CAAC;AAwCF,SAAgB,GAAU,GAAG,QAA0B;AAGrD,KAAI,CAFU,OAAO,MAAM,MAAM,OAAO,MAAM,WAEpC,CACR,QAAO,QAAQ,KAAK,OAAuB,CAAC;AAG9C,SAAQ,UAAiB;AAKvB,SAAO,QAAQ,KAJE,OAAO,KAAK,MAC3B,OAAO,MAAM,aAAc,EAA+B,MAAM,GAAG,EAGzC,CAAiB,CAAC"}
|
package/dist/menu.js
CHANGED
|
@@ -34,7 +34,7 @@ function MenuContent({ align = "start", alignOffset = 0, side = "bottom", sideOf
|
|
|
34
34
|
sideOffset,
|
|
35
35
|
children: /* @__PURE__ */ jsx(Menu$1.Popup, {
|
|
36
36
|
"data-slot": "menu-content",
|
|
37
|
-
className: cn("motion-pop-md ring-contrast/10 bg-elevated text-contrast z-50 max-h-(--available-height) w-auto min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md p-1 shadow-md ring-1 outline-none data-closed:overflow-hidden", className),
|
|
37
|
+
className: cn("motion-pop-md ring-contrast/10 bg-elevated text-contrast z-50 max-h-(--available-height) max-w-(--available-width) w-auto min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md p-1 shadow-md ring-1 outline-none data-closed:overflow-hidden", className),
|
|
38
38
|
finalFocus: resolveFinalFocus(restoreFocusOnClose, finalFocus),
|
|
39
39
|
...props
|
|
40
40
|
})
|
package/dist/menu.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.js","names":["MenuPrimitive"],"sources":["../src/menu.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\"\n\nimport { cn } from \"./lib/utils\"\nimport { resolveFinalFocus, type RestoreFocusOnClose } from \"./lib/focus\"\n\nimport { ChevronRightIcon, CheckIcon } from \"./lib/internal-icons\"\n\ntype MenuProps = React.ComponentProps<typeof MenuPrimitive.Root>\n\ntype MenuPortalProps = React.ComponentProps<typeof MenuPrimitive.Portal>\n\ntype MenuTriggerProps = React.ComponentProps<typeof MenuPrimitive.Trigger>\n\ntype MenuContentProps = React.ComponentProps<typeof MenuPrimitive.Popup> &\n Pick<\n React.ComponentProps<typeof MenuPrimitive.Positioner>,\n \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\"\n > & {\n /**\n * Focus-restoration policy when the menu closes. Defaults to Base\n * UI's behaviour (restore to the trigger). Use `\"keyboard\"` when\n * the trigger is hover/focus-within–revealed so a pointer close\n * doesn't keep it pinned visible. See {@link RestoreFocusOnClose}.\n */\n restoreFocusOnClose?: RestoreFocusOnClose\n }\n\ntype MenuGroupProps = React.ComponentProps<typeof MenuPrimitive.Group>\n\ntype MenuLabelProps = React.ComponentProps<typeof MenuPrimitive.GroupLabel> & {\n inset?: boolean\n}\n\ntype MenuItemProps = React.ComponentProps<typeof MenuPrimitive.Item> & {\n inset?: boolean\n variant?: \"default\" | \"destructive\"\n}\n\ntype MenuSubProps = React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>\n\ntype MenuSubTriggerProps = React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean\n}\n\ntype MenuSubContentProps = MenuContentProps\n\ntype MenuCheckboxItemProps = React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n inset?: boolean\n}\n\ntype MenuRadioGroupProps = React.ComponentProps<typeof MenuPrimitive.RadioGroup>\n\ntype MenuRadioItemProps = React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n inset?: boolean\n}\n\ntype MenuSeparatorProps = React.ComponentProps<typeof MenuPrimitive.Separator>\n\ntype MenuShortcutProps = React.ComponentProps<\"span\">\n\nfunction Menu(props: MenuProps) {\n return <MenuPrimitive.Root data-slot=\"menu\" {...props} />\n}\n\nfunction MenuPortal(props: MenuPortalProps) {\n return <MenuPrimitive.Portal data-slot=\"menu-portal\" {...props} />\n}\n\nfunction MenuTrigger(props: MenuTriggerProps) {\n return <MenuPrimitive.Trigger data-slot=\"menu-trigger\" {...props} />\n}\n\nfunction MenuContent({\n align = \"start\",\n alignOffset = 0,\n side = \"bottom\",\n sideOffset = 4,\n className,\n restoreFocusOnClose,\n finalFocus,\n ...props\n}: MenuContentProps) {\n return (\n <MenuPortal>\n <MenuPrimitive.Positioner\n data-slot=\"menu-positioner\"\n className=\"isolate z-50 outline-none\"\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n >\n <MenuPrimitive.Popup\n data-slot=\"menu-content\"\n className={cn(\n \"motion-pop-md ring-contrast/10 bg-elevated text-contrast z-50 max-h-(--available-height) w-auto min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md p-1 shadow-md ring-1 outline-none data-closed:overflow-hidden\",\n className,\n )}\n finalFocus={resolveFinalFocus(restoreFocusOnClose, finalFocus)}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPortal>\n )\n}\n\nfunction MenuGroup(props: MenuGroupProps) {\n return <MenuPrimitive.Group data-slot=\"menu-group\" {...props} />\n}\n\nfunction MenuLabel({\n className,\n inset,\n ...props\n}: MenuLabelProps) {\n return (\n <MenuPrimitive.GroupLabel\n data-slot=\"menu-label\"\n data-inset={inset}\n className={cn(\n \"text-muted px-1.5 py-1 text-xs font-medium data-inset:pl-7\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction MenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: MenuItemProps) {\n return (\n <MenuPrimitive.Item\n data-slot=\"menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-primary focus:text-white data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-white group/menu-item relative flex cursor-clickable items-center gap-1.5 rounded-sm px-1.5 py-1 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction MenuSub(props: MenuSubProps) {\n return <MenuPrimitive.SubmenuRoot data-slot=\"menu-sub\" {...props} />\n}\n\nfunction MenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: MenuSubTriggerProps) {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-primary focus:text-white data-open:bg-primary data-open:text-white not-data-[variant=destructive]:focus:**:text-white data-popup-open:bg-primary data-popup-open:text-white flex cursor-clickable items-center gap-1.5 rounded-sm px-1.5 py-1 text-sm outline-hidden select-none data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ml-auto\" />\n </MenuPrimitive.SubmenuTrigger>\n )\n}\n\nfunction MenuSubContent({\n align = \"start\",\n // -4 cancels the popup's p-1 (4px) top padding so the submenu's first\n // item lines up with the parent item row, not the popup container edge.\n alignOffset = -4,\n side = \"right\",\n sideOffset = 0,\n className,\n ...props\n}: MenuSubContentProps) {\n return (\n <MenuContent\n data-slot=\"menu-sub-content\"\n className={cn(\"w-auto min-w-24 shadow-md\", className)}\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n {...props}\n />\n )\n}\n\nfunction MenuCheckboxItem({\n className,\n children,\n checked,\n inset,\n ...props\n}: MenuCheckboxItemProps) {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"menu-checkbox-item\"\n data-inset={inset}\n className={cn(\n \"focus:bg-primary focus:text-white focus:**:text-white relative flex cursor-clickable items-center gap-1.5 rounded-sm py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span\n data-slot=\"menu-checkbox-item-indicator\"\n className=\"pointer-events-none absolute right-2 flex items-center justify-center\"\n >\n <MenuPrimitive.CheckboxItemIndicator>\n <CheckIcon />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n )\n}\n\nfunction MenuRadioGroup(props: MenuRadioGroupProps) {\n return <MenuPrimitive.RadioGroup data-slot=\"menu-radio-group\" {...props} />\n}\n\nfunction MenuRadioItem({\n className,\n children,\n inset,\n ...props\n}: MenuRadioItemProps) {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"menu-radio-item\"\n data-inset={inset}\n className={cn(\n \"focus:bg-primary focus:text-white focus:**:text-white relative flex cursor-clickable items-center gap-1.5 rounded-sm py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <span\n data-slot=\"menu-radio-item-indicator\"\n className=\"pointer-events-none absolute right-2 flex items-center justify-center\"\n >\n <MenuPrimitive.RadioItemIndicator>\n <CheckIcon />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n )\n}\n\nfunction MenuSeparator({ className, ...props }: MenuSeparatorProps) {\n return (\n <MenuPrimitive.Separator\n data-slot=\"menu-separator\"\n className={cn(\n \"bg-line -mx-1 my-1 h-px\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction MenuShortcut({ className, ...props }: MenuShortcutProps) {\n return (\n <span\n data-slot=\"menu-shortcut\"\n className={cn(\n \"text-muted group-focus/menu-item:text-white ml-auto text-xs tracking-widest\",\n className,\n )}\n {...props}\n />\n )\n}\n\nexport {\n Menu,\n MenuPortal,\n MenuTrigger,\n MenuContent,\n MenuGroup,\n MenuLabel,\n MenuItem,\n MenuCheckboxItem,\n MenuRadioGroup,\n MenuRadioItem,\n MenuSeparator,\n MenuShortcut,\n MenuSub,\n MenuSubTrigger,\n MenuSubContent,\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"menu.js","names":["MenuPrimitive"],"sources":["../src/menu.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\"\n\nimport { cn } from \"./lib/utils\"\nimport { resolveFinalFocus, type RestoreFocusOnClose } from \"./lib/focus\"\n\nimport { ChevronRightIcon, CheckIcon } from \"./lib/internal-icons\"\n\ntype MenuProps = React.ComponentProps<typeof MenuPrimitive.Root>\n\ntype MenuPortalProps = React.ComponentProps<typeof MenuPrimitive.Portal>\n\ntype MenuTriggerProps = React.ComponentProps<typeof MenuPrimitive.Trigger>\n\ntype MenuContentProps = React.ComponentProps<typeof MenuPrimitive.Popup> &\n Pick<\n React.ComponentProps<typeof MenuPrimitive.Positioner>,\n \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\"\n > & {\n /**\n * Focus-restoration policy when the menu closes. Defaults to Base\n * UI's behaviour (restore to the trigger). Use `\"keyboard\"` when\n * the trigger is hover/focus-within–revealed so a pointer close\n * doesn't keep it pinned visible. See {@link RestoreFocusOnClose}.\n */\n restoreFocusOnClose?: RestoreFocusOnClose\n }\n\ntype MenuGroupProps = React.ComponentProps<typeof MenuPrimitive.Group>\n\ntype MenuLabelProps = React.ComponentProps<typeof MenuPrimitive.GroupLabel> & {\n inset?: boolean\n}\n\ntype MenuItemProps = React.ComponentProps<typeof MenuPrimitive.Item> & {\n inset?: boolean\n variant?: \"default\" | \"destructive\"\n}\n\ntype MenuSubProps = React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>\n\ntype MenuSubTriggerProps = React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean\n}\n\ntype MenuSubContentProps = MenuContentProps\n\ntype MenuCheckboxItemProps = React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n inset?: boolean\n}\n\ntype MenuRadioGroupProps = React.ComponentProps<typeof MenuPrimitive.RadioGroup>\n\ntype MenuRadioItemProps = React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n inset?: boolean\n}\n\ntype MenuSeparatorProps = React.ComponentProps<typeof MenuPrimitive.Separator>\n\ntype MenuShortcutProps = React.ComponentProps<\"span\">\n\nfunction Menu(props: MenuProps) {\n return <MenuPrimitive.Root data-slot=\"menu\" {...props} />\n}\n\nfunction MenuPortal(props: MenuPortalProps) {\n return <MenuPrimitive.Portal data-slot=\"menu-portal\" {...props} />\n}\n\nfunction MenuTrigger(props: MenuTriggerProps) {\n return <MenuPrimitive.Trigger data-slot=\"menu-trigger\" {...props} />\n}\n\nfunction MenuContent({\n align = \"start\",\n alignOffset = 0,\n side = \"bottom\",\n sideOffset = 4,\n className,\n restoreFocusOnClose,\n finalFocus,\n ...props\n}: MenuContentProps) {\n return (\n <MenuPortal>\n <MenuPrimitive.Positioner\n data-slot=\"menu-positioner\"\n className=\"isolate z-50 outline-none\"\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n >\n <MenuPrimitive.Popup\n data-slot=\"menu-content\"\n className={cn(\n \"motion-pop-md ring-contrast/10 bg-elevated text-contrast z-50 max-h-(--available-height) max-w-(--available-width) w-auto min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md p-1 shadow-md ring-1 outline-none data-closed:overflow-hidden\",\n className,\n )}\n finalFocus={resolveFinalFocus(restoreFocusOnClose, finalFocus)}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPortal>\n )\n}\n\nfunction MenuGroup(props: MenuGroupProps) {\n return <MenuPrimitive.Group data-slot=\"menu-group\" {...props} />\n}\n\nfunction MenuLabel({\n className,\n inset,\n ...props\n}: MenuLabelProps) {\n return (\n <MenuPrimitive.GroupLabel\n data-slot=\"menu-label\"\n data-inset={inset}\n className={cn(\n \"text-muted px-1.5 py-1 text-xs font-medium data-inset:pl-7\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction MenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: MenuItemProps) {\n return (\n <MenuPrimitive.Item\n data-slot=\"menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-primary focus:text-white data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-white group/menu-item relative flex cursor-clickable items-center gap-1.5 rounded-sm px-1.5 py-1 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction MenuSub(props: MenuSubProps) {\n return <MenuPrimitive.SubmenuRoot data-slot=\"menu-sub\" {...props} />\n}\n\nfunction MenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: MenuSubTriggerProps) {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-primary focus:text-white data-open:bg-primary data-open:text-white not-data-[variant=destructive]:focus:**:text-white data-popup-open:bg-primary data-popup-open:text-white flex cursor-clickable items-center gap-1.5 rounded-sm px-1.5 py-1 text-sm outline-hidden select-none data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ml-auto\" />\n </MenuPrimitive.SubmenuTrigger>\n )\n}\n\nfunction MenuSubContent({\n align = \"start\",\n // -4 cancels the popup's p-1 (4px) top padding so the submenu's first\n // item lines up with the parent item row, not the popup container edge.\n alignOffset = -4,\n side = \"right\",\n sideOffset = 0,\n className,\n ...props\n}: MenuSubContentProps) {\n return (\n <MenuContent\n data-slot=\"menu-sub-content\"\n className={cn(\"w-auto min-w-24 shadow-md\", className)}\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n {...props}\n />\n )\n}\n\nfunction MenuCheckboxItem({\n className,\n children,\n checked,\n inset,\n ...props\n}: MenuCheckboxItemProps) {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"menu-checkbox-item\"\n data-inset={inset}\n className={cn(\n \"focus:bg-primary focus:text-white focus:**:text-white relative flex cursor-clickable items-center gap-1.5 rounded-sm py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span\n data-slot=\"menu-checkbox-item-indicator\"\n className=\"pointer-events-none absolute right-2 flex items-center justify-center\"\n >\n <MenuPrimitive.CheckboxItemIndicator>\n <CheckIcon />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n )\n}\n\nfunction MenuRadioGroup(props: MenuRadioGroupProps) {\n return <MenuPrimitive.RadioGroup data-slot=\"menu-radio-group\" {...props} />\n}\n\nfunction MenuRadioItem({\n className,\n children,\n inset,\n ...props\n}: MenuRadioItemProps) {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"menu-radio-item\"\n data-inset={inset}\n className={cn(\n \"focus:bg-primary focus:text-white focus:**:text-white relative flex cursor-clickable items-center gap-1.5 rounded-sm py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <span\n data-slot=\"menu-radio-item-indicator\"\n className=\"pointer-events-none absolute right-2 flex items-center justify-center\"\n >\n <MenuPrimitive.RadioItemIndicator>\n <CheckIcon />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n )\n}\n\nfunction MenuSeparator({ className, ...props }: MenuSeparatorProps) {\n return (\n <MenuPrimitive.Separator\n data-slot=\"menu-separator\"\n className={cn(\n \"bg-line -mx-1 my-1 h-px\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction MenuShortcut({ className, ...props }: MenuShortcutProps) {\n return (\n <span\n data-slot=\"menu-shortcut\"\n className={cn(\n \"text-muted group-focus/menu-item:text-white ml-auto text-xs tracking-widest\",\n className,\n )}\n {...props}\n />\n )\n}\n\nexport {\n Menu,\n MenuPortal,\n MenuTrigger,\n MenuContent,\n MenuGroup,\n MenuLabel,\n MenuItem,\n MenuCheckboxItem,\n MenuRadioGroup,\n MenuRadioItem,\n MenuSeparator,\n MenuShortcut,\n MenuSub,\n MenuSubTrigger,\n MenuSubContent,\n}\n"],"mappings":";;;;;;;;AA+DA,SAAS,KAAK,OAAkB;AAC9B,QAAO,oBAACA,OAAc,MAAf;EAAoB,aAAU;EAAO,GAAI;EAAS,CAAA;;AAG3D,SAAS,WAAW,OAAwB;AAC1C,QAAO,oBAACA,OAAc,QAAf;EAAsB,aAAU;EAAc,GAAI;EAAS,CAAA;;AAGpE,SAAS,YAAY,OAAyB;AAC5C,QAAO,oBAACA,OAAc,SAAf;EAAuB,aAAU;EAAe,GAAI;EAAS,CAAA;;AAGtE,SAAS,YAAY,EACnB,QAAQ,SACR,cAAc,GACd,OAAO,UACP,aAAa,GACb,WACA,qBACA,YACA,GAAG,SACgB;AACnB,QACE,oBAAC,YAAD,EAAA,UACE,oBAACA,OAAc,YAAf;EACE,aAAU;EACV,WAAU;EACH;EACM;EACP;EACM;YAEZ,oBAACA,OAAc,OAAf;GACE,aAAU;GACV,WAAW,GACT,6QACA,UACD;GACD,YAAY,kBAAkB,qBAAqB,WAAW;GAC9D,GAAI;GACJ,CAAA;EACuB,CAAA,EAChB,CAAA;;AAIjB,SAAS,UAAU,OAAuB;AACxC,QAAO,oBAACA,OAAc,OAAf;EAAqB,aAAU;EAAa,GAAI;EAAS,CAAA;;AAGlE,SAAS,UAAU,EACjB,WACA,OACA,GAAG,SACc;AACjB,QACE,oBAACA,OAAc,YAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,8DACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,SAAS,EAChB,WACA,OACA,UAAU,WACV,GAAG,SACa;AAChB,QACE,oBAACA,OAAc,MAAf;EACE,aAAU;EACV,cAAY;EACZ,gBAAc;EACd,WAAW,GACT,gnBACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,QAAQ,OAAqB;AACpC,QAAO,oBAACA,OAAc,aAAf;EAA2B,aAAU;EAAW,GAAI;EAAS,CAAA;;AAGtE,SAAS,eAAe,EACtB,WACA,OACA,UACA,GAAG,SACmB;AACtB,QACE,qBAACA,OAAc,gBAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,+XACA,UACD;EACD,GAAI;YAPN,CASG,UACD,oBAAC,kBAAD,EAAkB,WAAU,WAAY,CAAA,CACX;;;AAInC,SAAS,eAAe,EACtB,QAAQ,SAGR,cAAc,IACd,OAAO,SACP,aAAa,GACb,WACA,GAAG,SACmB;AACtB,QACE,oBAAC,aAAD;EACE,aAAU;EACV,WAAW,GAAG,6BAA6B,UAAU;EAC9C;EACM;EACP;EACM;EACZ,GAAI;EACJ,CAAA;;AAIN,SAAS,iBAAiB,EACxB,WACA,UACA,SACA,OACA,GAAG,SACqB;AACxB,QACE,qBAACA,OAAc,cAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,yUACA,UACD;EACQ;EACT,GAAI;YARN,CAUE,oBAAC,QAAD;GACE,aAAU;GACV,WAAU;aAEV,oBAACA,OAAc,uBAAf,EAAA,UACE,oBAAC,WAAD,EAAa,CAAA,EACuB,CAAA;GACjC,CAAA,EACN,SAC0B;;;AAIjC,SAAS,eAAe,OAA4B;AAClD,QAAO,oBAACA,OAAc,YAAf;EAA0B,aAAU;EAAmB,GAAI;EAAS,CAAA;;AAG7E,SAAS,cAAc,EACrB,WACA,UACA,OACA,GAAG,SACkB;AACrB,QACE,qBAACA,OAAc,WAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,yUACA,UACD;EACD,GAAI;YAPN,CASE,oBAAC,QAAD;GACE,aAAU;GACV,WAAU;aAEV,oBAACA,OAAc,oBAAf,EAAA,UACE,oBAAC,WAAD,EAAa,CAAA,EACoB,CAAA;GAC9B,CAAA,EACN,SACuB;;;AAI9B,SAAS,cAAc,EAAE,WAAW,GAAG,SAA6B;AAClE,QACE,oBAACA,OAAc,WAAf;EACE,aAAU;EACV,WAAW,GACT,2BACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,aAAa,EAAE,WAAW,GAAG,SAA4B;AAChE,QACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GACT,+EACA,UACD;EACD,GAAI;EACJ,CAAA"}
|
package/dist/pagination.js
CHANGED
|
@@ -45,7 +45,7 @@ function PaginationPrevious({ className, text = "Previous", ...props }) {
|
|
|
45
45
|
return /* @__PURE__ */ jsxs(PaginationLink, {
|
|
46
46
|
"aria-label": "Go to previous page",
|
|
47
47
|
size: "default",
|
|
48
|
-
className: cn("pl-1.5
|
|
48
|
+
className: cn("pl-1.5", className),
|
|
49
49
|
...props,
|
|
50
50
|
children: [/* @__PURE__ */ jsx(ChevronLeftIcon, { "data-icon": "inline-start" }), /* @__PURE__ */ jsx("span", {
|
|
51
51
|
className: "hidden sm:block",
|
|
@@ -57,7 +57,7 @@ function PaginationNext({ className, text = "Next", ...props }) {
|
|
|
57
57
|
return /* @__PURE__ */ jsxs(PaginationLink, {
|
|
58
58
|
"aria-label": "Go to next page",
|
|
59
59
|
size: "default",
|
|
60
|
-
className: cn("pr-1.5
|
|
60
|
+
className: cn("pr-1.5", className),
|
|
61
61
|
...props,
|
|
62
62
|
children: [/* @__PURE__ */ jsx("span", {
|
|
63
63
|
className: "hidden sm:block",
|
package/dist/pagination.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination.js","names":[],"sources":["../src/pagination.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { Button } from \"./button\"\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n EllipsisIcon,\n} from \"./lib/internal-icons\"\n\nimport { cn } from \"./lib/utils\"\n\ntype PaginationProps = React.ComponentProps<\"nav\">\n\ntype PaginationContentProps = React.ComponentProps<\"ul\">\n\ntype PaginationItemProps = React.ComponentProps<\"li\">\n\ntype PaginationLinkProps = {\n isActive?: boolean\n /** Marks the link disabled — aria-disabled, removed from tab order, non-interactive. */\n disabled?: boolean\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n React.ComponentProps<\"a\">\n\ntype PaginationPreviousProps = PaginationLinkProps & {\n text?: string\n}\n\ntype PaginationNextProps = PaginationLinkProps & {\n text?: string\n}\n\ntype PaginationEllipsisProps = React.ComponentProps<\"span\">\n\nfunction Pagination({ className, ...props }: PaginationProps) {\n return (\n <nav\n role=\"navigation\"\n aria-label=\"pagination\"\n data-slot=\"pagination\"\n className={cn(\n \"mx-auto flex w-full justify-center\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction PaginationContent({ className, ...props }: PaginationContentProps) {\n return (\n <ul\n data-slot=\"pagination-content\"\n className={cn(\n \"flex items-center gap-0.5\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction PaginationItem(props: PaginationItemProps) {\n return <li data-slot=\"pagination-item\" {...props} />\n}\n\nfunction PaginationLink({\n className,\n isActive,\n disabled,\n size = \"icon\",\n ...props\n}: PaginationLinkProps) {\n return (\n <Button\n variant={isActive ? \"outline\" : \"ghost\"}\n size={size}\n className={cn(disabled && \"pointer-events-none opacity-50\", className)}\n render={\n <a\n aria-current={isActive ? \"page\" : undefined}\n aria-disabled={disabled || undefined}\n data-slot=\"pagination-link\"\n data-active={isActive || undefined}\n tabIndex={disabled ? -1 : undefined}\n {...props}\n />\n }\n />\n )\n}\n\nfunction PaginationPrevious({\n className,\n text = \"Previous\",\n ...props\n}: PaginationPreviousProps) {\n return (\n <PaginationLink\n aria-label=\"Go to previous page\"\n size=\"default\"\n className={cn(\"pl-1.5
|
|
1
|
+
{"version":3,"file":"pagination.js","names":[],"sources":["../src/pagination.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { Button } from \"./button\"\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n EllipsisIcon,\n} from \"./lib/internal-icons\"\n\nimport { cn } from \"./lib/utils\"\n\ntype PaginationProps = React.ComponentProps<\"nav\">\n\ntype PaginationContentProps = React.ComponentProps<\"ul\">\n\ntype PaginationItemProps = React.ComponentProps<\"li\">\n\ntype PaginationLinkProps = {\n isActive?: boolean\n /** Marks the link disabled — aria-disabled, removed from tab order, non-interactive. */\n disabled?: boolean\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n React.ComponentProps<\"a\">\n\ntype PaginationPreviousProps = PaginationLinkProps & {\n text?: string\n}\n\ntype PaginationNextProps = PaginationLinkProps & {\n text?: string\n}\n\ntype PaginationEllipsisProps = React.ComponentProps<\"span\">\n\nfunction Pagination({ className, ...props }: PaginationProps) {\n return (\n <nav\n role=\"navigation\"\n aria-label=\"pagination\"\n data-slot=\"pagination\"\n className={cn(\n \"mx-auto flex w-full justify-center\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction PaginationContent({ className, ...props }: PaginationContentProps) {\n return (\n <ul\n data-slot=\"pagination-content\"\n className={cn(\n \"flex items-center gap-0.5\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction PaginationItem(props: PaginationItemProps) {\n return <li data-slot=\"pagination-item\" {...props} />\n}\n\nfunction PaginationLink({\n className,\n isActive,\n disabled,\n size = \"icon\",\n ...props\n}: PaginationLinkProps) {\n return (\n <Button\n variant={isActive ? \"outline\" : \"ghost\"}\n size={size}\n className={cn(disabled && \"pointer-events-none opacity-50\", className)}\n render={\n <a\n aria-current={isActive ? \"page\" : undefined}\n aria-disabled={disabled || undefined}\n data-slot=\"pagination-link\"\n data-active={isActive || undefined}\n tabIndex={disabled ? -1 : undefined}\n {...props}\n />\n }\n />\n )\n}\n\nfunction PaginationPrevious({\n className,\n text = \"Previous\",\n ...props\n}: PaginationPreviousProps) {\n return (\n <PaginationLink\n aria-label=\"Go to previous page\"\n size=\"default\"\n className={cn(\"pl-1.5\", className)}\n {...props}\n >\n <ChevronLeftIcon data-icon=\"inline-start\" />\n <span className=\"hidden sm:block\">{text}</span>\n </PaginationLink>\n )\n}\n\nfunction PaginationNext({\n className,\n text = \"Next\",\n ...props\n}: PaginationNextProps) {\n return (\n <PaginationLink\n aria-label=\"Go to next page\"\n size=\"default\"\n className={cn(\"pr-1.5\", className)}\n {...props}\n >\n <span className=\"hidden sm:block\">{text}</span>\n <ChevronRightIcon data-icon=\"inline-end\" />\n </PaginationLink>\n )\n}\n\nfunction PaginationEllipsis({ className, ...props }: PaginationEllipsisProps) {\n return (\n <span\n data-slot=\"pagination-ellipsis\"\n className={cn(\n \"flex size-8 items-center justify-center [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <EllipsisIcon />\n <span className=\"sr-only\">More pages</span>\n </span>\n )\n}\n\nexport {\n Pagination,\n PaginationContent,\n PaginationEllipsis,\n PaginationItem,\n PaginationLink,\n PaginationNext,\n PaginationPrevious,\n}\n"],"mappings":";;;;;;AAkCA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,QACE,oBAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAW,GACT,sCACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAiC;AAC1E,QACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GACT,6BACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,eAAe,OAA4B;AAClD,QAAO,oBAAC,MAAD;EAAI,aAAU;EAAkB,GAAI;EAAS,CAAA;;AAGtD,SAAS,eAAe,EACtB,WACA,UACA,UACA,OAAO,QACP,GAAG,SACmB;AACtB,QACE,oBAAC,QAAD;EACE,SAAS,WAAW,YAAY;EAC1B;EACN,WAAW,GAAG,YAAY,kCAAkC,UAAU;EACtE,QACE,oBAAC,KAAD;GACE,gBAAc,WAAW,SAAS,KAAA;GAClC,iBAAe,YAAY,KAAA;GAC3B,aAAU;GACV,eAAa,YAAY,KAAA;GACzB,UAAU,WAAW,KAAK,KAAA;GAC1B,GAAI;GACJ,CAAA;EAEJ,CAAA;;AAIN,SAAS,mBAAmB,EAC1B,WACA,OAAO,YACP,GAAG,SACuB;AAC1B,QACE,qBAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAW,GAAG,UAAU,UAAU;EAClC,GAAI;YAJN,CAME,oBAAC,iBAAD,EAAiB,aAAU,gBAAiB,CAAA,EAC5C,oBAAC,QAAD;GAAM,WAAU;aAAmB;GAAY,CAAA,CAChC;;;AAIrB,SAAS,eAAe,EACtB,WACA,OAAO,QACP,GAAG,SACmB;AACtB,QACE,qBAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAW,GAAG,UAAU,UAAU;EAClC,GAAI;YAJN,CAME,oBAAC,QAAD;GAAM,WAAU;aAAmB;GAAY,CAAA,EAC/C,oBAAC,kBAAD,EAAkB,aAAU,cAAe,CAAA,CAC5B;;;AAIrB,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAkC;AAC5E,QACE,qBAAC,QAAD;EACE,aAAU;EACV,WAAW,GACT,gFACA,UACD;EACD,GAAI;YANN,CAQE,oBAAC,cAAD,EAAgB,CAAA,EAChB,oBAAC,QAAD;GAAM,WAAU;aAAU;GAAiB,CAAA,CACtC"}
|
package/dist/select.js
CHANGED
|
@@ -49,7 +49,7 @@ function SelectTrigger({ className, size = "default", children, ...props }) {
|
|
|
49
49
|
return /* @__PURE__ */ jsxs(Select$1.Trigger, {
|
|
50
50
|
"data-slot": "select-trigger",
|
|
51
51
|
"data-size": size,
|
|
52
|
-
className: cn("border-edge data-placeholder:text-soft dark:bg-edge/30 dark:hover:bg-edge/50 focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex w-fit items-center justify-between gap-1.5 rounded-md border bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap
|
|
52
|
+
className: cn("border-edge data-placeholder:text-soft dark:bg-edge/30 dark:hover:bg-edge/50 focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex w-fit items-center justify-between gap-1.5 rounded-md border bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap motion-color outline-none select-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-sm *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
|
|
53
53
|
...props,
|
|
54
54
|
children: [children, /* @__PURE__ */ jsx(Select$1.Icon, {
|
|
55
55
|
"data-slot": "select-icon",
|
package/dist/select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","names":["SelectPrimitive"],"sources":["../src/select.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { Select as SelectPrimitive } from \"@base-ui/react/select\"\n\nimport { cn } from \"./lib/utils\"\nimport { ChevronDownIcon, ChevronUpIcon, CheckIcon, ChevronsUpDownIcon } from \"./lib/internal-icons\"\n\ntype SelectProps<Value, Multiple extends boolean | undefined = false> =\n SelectPrimitive.Root.Props<Value, Multiple>\n\ntype SelectGroupProps = React.ComponentProps<typeof SelectPrimitive.Group>\ntype SelectValueProps = React.ComponentProps<typeof SelectPrimitive.Value>\ntype SelectTriggerBaseProps = React.ComponentProps<typeof SelectPrimitive.Trigger>\ntype SelectPortalProps = React.ComponentProps<typeof SelectPrimitive.Portal>\ntype SelectPositionerProps = React.ComponentProps<typeof SelectPrimitive.Positioner>\ntype SelectPopupProps = React.ComponentProps<typeof SelectPrimitive.Popup>\ntype SelectListProps = React.ComponentProps<typeof SelectPrimitive.List>\ntype SelectLabelProps = React.ComponentProps<typeof SelectPrimitive.GroupLabel>\ntype SelectItemProps = React.ComponentProps<typeof SelectPrimitive.Item>\ntype SelectSeparatorProps = React.ComponentProps<typeof SelectPrimitive.Separator>\ntype SelectScrollUpButtonProps = React.ComponentProps<typeof SelectPrimitive.ScrollUpArrow>\ntype SelectScrollDownButtonProps = React.ComponentProps<typeof SelectPrimitive.ScrollDownArrow>\n\ntype SelectTriggerProps = SelectTriggerBaseProps & {\n size?: \"sm\" | \"default\"\n}\n\ntype SelectContentProps = SelectPopupProps &\n Pick<\n SelectPositionerProps,\n \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\" | \"alignItemWithTrigger\"\n >\n\nfunction Select<Value, Multiple extends boolean | undefined = false>({\n ...props\n}: SelectProps<Value, Multiple>) {\n return <SelectPrimitive.Root data-slot=\"select\" {...props} />\n}\n\nfunction SelectPortal({ ...props }: SelectPortalProps) {\n return <SelectPrimitive.Portal data-slot=\"select-portal\" {...props} />\n}\n\nfunction SelectPositioner({ className, ...props }: SelectPositionerProps) {\n return (\n <SelectPrimitive.Positioner\n data-slot=\"select-positioner\"\n className={className}\n {...props}\n />\n )\n}\n\nfunction SelectList({ className, ...props }: SelectListProps) {\n return (\n <SelectPrimitive.List\n data-slot=\"select-list\"\n className={className}\n {...props}\n />\n )\n}\n\nfunction SelectGroup({ className, ...props }: SelectGroupProps) {\n return (\n <SelectPrimitive.Group\n data-slot=\"select-group\"\n className={cn(\"scroll-my-1 p-1\", className)}\n {...props}\n />\n )\n}\n\nfunction SelectValue({ className, ...props }: SelectValueProps) {\n return (\n <SelectPrimitive.Value\n data-slot=\"select-value\"\n className={cn(\"flex flex-1 text-left\", className)}\n {...props}\n />\n )\n}\n\nfunction SelectTrigger({\n className,\n size = \"default\",\n children,\n ...props\n}: SelectTriggerProps) {\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={size}\n className={cn(\n \"border-edge data-placeholder:text-soft dark:bg-edge/30 dark:hover:bg-edge/50 focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex w-fit items-center justify-between gap-1.5 rounded-md border bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-sm *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon\n data-slot=\"select-icon\"\n render={\n <ChevronsUpDownIcon className=\"text-muted pointer-events-none size-4\" />\n }\n />\n </SelectPrimitive.Trigger>\n )\n}\n\nfunction SelectContent({\n className,\n children,\n side = \"bottom\",\n sideOffset = 4,\n align = \"start\",\n alignOffset = 0,\n alignItemWithTrigger = false,\n ...props\n}: SelectContentProps) {\n return (\n <SelectPortal>\n <SelectPositioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n alignItemWithTrigger={alignItemWithTrigger}\n className=\"isolate z-50\"\n >\n <SelectPrimitive.Popup\n data-slot=\"select-content\"\n data-align-trigger={alignItemWithTrigger}\n className={cn(\n \"motion-pop-md bg-elevated text-contrast ring-contrast/10 relative isolate z-50 max-h-(--available-height) min-w-(--anchor-width) max-w-(--available-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md shadow-md ring-1\",\n className,\n )}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectList>{children}</SelectList>\n <SelectScrollDownButton />\n </SelectPrimitive.Popup>\n </SelectPositioner>\n </SelectPortal>\n )\n}\n\nfunction SelectLabel({ className, ...props }: SelectLabelProps) {\n return (\n <SelectPrimitive.GroupLabel\n data-slot=\"select-label\"\n className={cn(\n \"text-muted px-1.5 py-1 text-xs\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction SelectItem({ className, children, ...props }: SelectItemProps) {\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n \"data-highlighted:bg-primary data-highlighted:text-white not-data-[variant=destructive]:data-highlighted:**:text-white relative flex w-full cursor-clickable items-center gap-1.5 rounded-sm py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2\",\n className,\n )}\n {...props}\n >\n <SelectPrimitive.ItemText data-slot=\"select-item-text\" className=\"flex flex-1 shrink-0 gap-2 whitespace-nowrap\">\n {children}\n </SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n render={\n <span data-slot=\"select-item-indicator\" className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\" />\n }\n >\n <CheckIcon className=\"pointer-events-none\" />\n </SelectPrimitive.ItemIndicator>\n </SelectPrimitive.Item>\n )\n}\n\nfunction SelectSeparator({ className, ...props }: SelectSeparatorProps) {\n return (\n <SelectPrimitive.Separator\n data-slot=\"select-separator\"\n className={cn(\n \"bg-line pointer-events-none -mx-1 my-1 h-px\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction SelectScrollUpButton({\n className,\n ...props\n}: SelectScrollUpButtonProps) {\n return (\n <SelectPrimitive.ScrollUpArrow\n data-slot=\"select-scroll-up-button\"\n className={cn(\n \"bg-elevated top-0 z-10 flex w-full cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpArrow>\n )\n}\n\nfunction SelectScrollDownButton({\n className,\n ...props\n}: SelectScrollDownButtonProps) {\n return (\n <SelectPrimitive.ScrollDownArrow\n data-slot=\"select-scroll-down-button\"\n className={cn(\n \"bg-elevated bottom-0 z-10 flex w-full cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownArrow>\n )\n}\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectList,\n SelectPortal,\n SelectPositioner,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n SelectValue,\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select.js","names":["SelectPrimitive"],"sources":["../src/select.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { Select as SelectPrimitive } from \"@base-ui/react/select\"\n\nimport { cn } from \"./lib/utils\"\nimport { ChevronDownIcon, ChevronUpIcon, CheckIcon, ChevronsUpDownIcon } from \"./lib/internal-icons\"\n\ntype SelectProps<Value, Multiple extends boolean | undefined = false> =\n SelectPrimitive.Root.Props<Value, Multiple>\n\ntype SelectGroupProps = React.ComponentProps<typeof SelectPrimitive.Group>\ntype SelectValueProps = React.ComponentProps<typeof SelectPrimitive.Value>\ntype SelectTriggerBaseProps = React.ComponentProps<typeof SelectPrimitive.Trigger>\ntype SelectPortalProps = React.ComponentProps<typeof SelectPrimitive.Portal>\ntype SelectPositionerProps = React.ComponentProps<typeof SelectPrimitive.Positioner>\ntype SelectPopupProps = React.ComponentProps<typeof SelectPrimitive.Popup>\ntype SelectListProps = React.ComponentProps<typeof SelectPrimitive.List>\ntype SelectLabelProps = React.ComponentProps<typeof SelectPrimitive.GroupLabel>\ntype SelectItemProps = React.ComponentProps<typeof SelectPrimitive.Item>\ntype SelectSeparatorProps = React.ComponentProps<typeof SelectPrimitive.Separator>\ntype SelectScrollUpButtonProps = React.ComponentProps<typeof SelectPrimitive.ScrollUpArrow>\ntype SelectScrollDownButtonProps = React.ComponentProps<typeof SelectPrimitive.ScrollDownArrow>\n\ntype SelectTriggerProps = SelectTriggerBaseProps & {\n size?: \"sm\" | \"default\"\n}\n\ntype SelectContentProps = SelectPopupProps &\n Pick<\n SelectPositionerProps,\n \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\" | \"alignItemWithTrigger\"\n >\n\nfunction Select<Value, Multiple extends boolean | undefined = false>({\n ...props\n}: SelectProps<Value, Multiple>) {\n return <SelectPrimitive.Root data-slot=\"select\" {...props} />\n}\n\nfunction SelectPortal({ ...props }: SelectPortalProps) {\n return <SelectPrimitive.Portal data-slot=\"select-portal\" {...props} />\n}\n\nfunction SelectPositioner({ className, ...props }: SelectPositionerProps) {\n return (\n <SelectPrimitive.Positioner\n data-slot=\"select-positioner\"\n className={className}\n {...props}\n />\n )\n}\n\nfunction SelectList({ className, ...props }: SelectListProps) {\n return (\n <SelectPrimitive.List\n data-slot=\"select-list\"\n className={className}\n {...props}\n />\n )\n}\n\nfunction SelectGroup({ className, ...props }: SelectGroupProps) {\n return (\n <SelectPrimitive.Group\n data-slot=\"select-group\"\n className={cn(\"scroll-my-1 p-1\", className)}\n {...props}\n />\n )\n}\n\nfunction SelectValue({ className, ...props }: SelectValueProps) {\n return (\n <SelectPrimitive.Value\n data-slot=\"select-value\"\n className={cn(\"flex flex-1 text-left\", className)}\n {...props}\n />\n )\n}\n\nfunction SelectTrigger({\n className,\n size = \"default\",\n children,\n ...props\n}: SelectTriggerProps) {\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={size}\n className={cn(\n \"border-edge data-placeholder:text-soft dark:bg-edge/30 dark:hover:bg-edge/50 focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex w-fit items-center justify-between gap-1.5 rounded-md border bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap motion-color outline-none select-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-sm *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon\n data-slot=\"select-icon\"\n render={\n <ChevronsUpDownIcon className=\"text-muted pointer-events-none size-4\" />\n }\n />\n </SelectPrimitive.Trigger>\n )\n}\n\nfunction SelectContent({\n className,\n children,\n side = \"bottom\",\n sideOffset = 4,\n align = \"start\",\n alignOffset = 0,\n alignItemWithTrigger = false,\n ...props\n}: SelectContentProps) {\n return (\n <SelectPortal>\n <SelectPositioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n alignItemWithTrigger={alignItemWithTrigger}\n className=\"isolate z-50\"\n >\n <SelectPrimitive.Popup\n data-slot=\"select-content\"\n data-align-trigger={alignItemWithTrigger}\n className={cn(\n \"motion-pop-md bg-elevated text-contrast ring-contrast/10 relative isolate z-50 max-h-(--available-height) min-w-(--anchor-width) max-w-(--available-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md shadow-md ring-1\",\n className,\n )}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectList>{children}</SelectList>\n <SelectScrollDownButton />\n </SelectPrimitive.Popup>\n </SelectPositioner>\n </SelectPortal>\n )\n}\n\nfunction SelectLabel({ className, ...props }: SelectLabelProps) {\n return (\n <SelectPrimitive.GroupLabel\n data-slot=\"select-label\"\n className={cn(\n \"text-muted px-1.5 py-1 text-xs\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction SelectItem({ className, children, ...props }: SelectItemProps) {\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n \"data-highlighted:bg-primary data-highlighted:text-white not-data-[variant=destructive]:data-highlighted:**:text-white relative flex w-full cursor-clickable items-center gap-1.5 rounded-sm py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2\",\n className,\n )}\n {...props}\n >\n <SelectPrimitive.ItemText data-slot=\"select-item-text\" className=\"flex flex-1 shrink-0 gap-2 whitespace-nowrap\">\n {children}\n </SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n render={\n <span data-slot=\"select-item-indicator\" className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\" />\n }\n >\n <CheckIcon className=\"pointer-events-none\" />\n </SelectPrimitive.ItemIndicator>\n </SelectPrimitive.Item>\n )\n}\n\nfunction SelectSeparator({ className, ...props }: SelectSeparatorProps) {\n return (\n <SelectPrimitive.Separator\n data-slot=\"select-separator\"\n className={cn(\n \"bg-line pointer-events-none -mx-1 my-1 h-px\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction SelectScrollUpButton({\n className,\n ...props\n}: SelectScrollUpButtonProps) {\n return (\n <SelectPrimitive.ScrollUpArrow\n data-slot=\"select-scroll-up-button\"\n className={cn(\n \"bg-elevated top-0 z-10 flex w-full cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpArrow>\n )\n}\n\nfunction SelectScrollDownButton({\n className,\n ...props\n}: SelectScrollDownButtonProps) {\n return (\n <SelectPrimitive.ScrollDownArrow\n data-slot=\"select-scroll-down-button\"\n className={cn(\n \"bg-elevated bottom-0 z-10 flex w-full cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownArrow>\n )\n}\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectList,\n SelectPortal,\n SelectPositioner,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n SelectValue,\n}\n"],"mappings":"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"}
|
package/dist/slider.js
CHANGED
|
@@ -22,6 +22,7 @@ function Slider({ className, controlClassName, defaultValue, value, min = 0, max
|
|
|
22
22
|
thumbAlignment: "edge",
|
|
23
23
|
...props,
|
|
24
24
|
children: /* @__PURE__ */ jsxs(Slider$1.Control, {
|
|
25
|
+
"data-slot": "slider-control",
|
|
25
26
|
className: cn("relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-disabled:cursor-not-allowed data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-40 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col", controlClassName),
|
|
26
27
|
children: [/* @__PURE__ */ jsx(Slider$1.Track, {
|
|
27
28
|
"data-slot": "slider-track",
|
package/dist/slider.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.js","names":["SliderPrimitive"],"sources":["../src/slider.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Slider as SliderPrimitive } from \"@base-ui/react/slider\"\n\nimport { cn } from \"./lib/utils\"\n\ntype SliderProps = React.ComponentProps<typeof SliderPrimitive.Root> & {\n controlClassName?: string\n /**\n * Accessible name for the thumb(s). The thumb is the interactive slider\n * control, so it needs its own name — a plain `aria-label` on `<Slider>`\n * labels the group, not the thumb. Receives the thumb index for range sliders.\n */\n getThumbAriaLabel?: (index: number) => string\n}\n\nfunction Slider({\n className,\n controlClassName,\n defaultValue,\n value,\n min = 0,\n max = 100,\n orientation = \"horizontal\",\n \"aria-label\": ariaLabel,\n getThumbAriaLabel,\n ...props\n}: SliderProps) {\n const _values = React.useMemo(\n () =>\n Array.isArray(value)\n ? value\n : Array.isArray(defaultValue)\n ? defaultValue\n : [min, max],\n [value, defaultValue, min, max]\n )\n\n return (\n <SliderPrimitive.Root\n className={cn(\n \"data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full\",\n className\n )}\n data-slot=\"slider\"\n defaultValue={defaultValue}\n value={value}\n min={min}\n max={max}\n orientation={orientation}\n thumbAlignment=\"edge\"\n {...props}\n >\n <SliderPrimitive.Control\n className={cn(\n \"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-disabled:cursor-not-allowed data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-40 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col\",\n controlClassName\n )}\n >\n <SliderPrimitive.Track\n data-slot=\"slider-track\"\n className=\"bg-secondary relative grow overflow-hidden rounded-full select-none data-[orientation=horizontal]:h-1 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1\"\n >\n <SliderPrimitive.Indicator\n data-slot=\"slider-range\"\n className=\"bg-primary select-none data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full\"\n />\n </SliderPrimitive.Track>\n {Array.from({ length: _values.length }, (_, index) => (\n <SliderPrimitive.Thumb\n data-slot=\"slider-thumb\"\n key={index}\n aria-label={getThumbAriaLabel ? getThumbAriaLabel(index) : ariaLabel}\n className=\"border-focus ring-focus/50 relative block size-3 shrink-0 rounded-full border bg-white motion-color cursor-clickable select-none after:absolute after:-inset-2 hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3 data-disabled:pointer-events-none\"\n />\n ))}\n </SliderPrimitive.Control>\n </SliderPrimitive.Root>\n )\n}\n\nexport { Slider }\n"],"mappings":";;;;;;AAiBA,SAAS,OAAO,EACd,WACA,kBACA,cACA,OACA,MAAM,GACN,MAAM,KACN,cAAc,cACd,cAAc,WACd,mBACA,GAAG,SACW;CACd,MAAM,UAAU,MAAM,cAElB,MAAM,QAAQ,MAAM,GAChB,QACA,MAAM,QAAQ,aAAa,GACzB,eACA,CAAC,KAAK,IAAI,EAClB;EAAC;EAAO;EAAc;EAAK;EAAI,CAChC;AAED,QACE,oBAACA,SAAgB,MAAjB;EACE,WAAW,GACT,2EACA,UACD;EACD,aAAU;EACI;EACP;EACF;EACA;EACQ;EACb,gBAAe;EACf,GAAI;YAEJ,qBAACA,SAAgB,SAAjB;GACE,WAAW,GACT,sQACA,iBACD;
|
|
1
|
+
{"version":3,"file":"slider.js","names":["SliderPrimitive"],"sources":["../src/slider.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Slider as SliderPrimitive } from \"@base-ui/react/slider\"\n\nimport { cn } from \"./lib/utils\"\n\ntype SliderProps = React.ComponentProps<typeof SliderPrimitive.Root> & {\n controlClassName?: string\n /**\n * Accessible name for the thumb(s). The thumb is the interactive slider\n * control, so it needs its own name — a plain `aria-label` on `<Slider>`\n * labels the group, not the thumb. Receives the thumb index for range sliders.\n */\n getThumbAriaLabel?: (index: number) => string\n}\n\nfunction Slider({\n className,\n controlClassName,\n defaultValue,\n value,\n min = 0,\n max = 100,\n orientation = \"horizontal\",\n \"aria-label\": ariaLabel,\n getThumbAriaLabel,\n ...props\n}: SliderProps) {\n const _values = React.useMemo(\n () =>\n Array.isArray(value)\n ? value\n : Array.isArray(defaultValue)\n ? defaultValue\n : [min, max],\n [value, defaultValue, min, max]\n )\n\n return (\n <SliderPrimitive.Root\n className={cn(\n \"data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full\",\n className\n )}\n data-slot=\"slider\"\n defaultValue={defaultValue}\n value={value}\n min={min}\n max={max}\n orientation={orientation}\n thumbAlignment=\"edge\"\n {...props}\n >\n <SliderPrimitive.Control\n data-slot=\"slider-control\"\n className={cn(\n \"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-disabled:cursor-not-allowed data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-40 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col\",\n controlClassName\n )}\n >\n <SliderPrimitive.Track\n data-slot=\"slider-track\"\n className=\"bg-secondary relative grow overflow-hidden rounded-full select-none data-[orientation=horizontal]:h-1 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1\"\n >\n <SliderPrimitive.Indicator\n data-slot=\"slider-range\"\n className=\"bg-primary select-none data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full\"\n />\n </SliderPrimitive.Track>\n {Array.from({ length: _values.length }, (_, index) => (\n <SliderPrimitive.Thumb\n data-slot=\"slider-thumb\"\n key={index}\n aria-label={getThumbAriaLabel ? getThumbAriaLabel(index) : ariaLabel}\n className=\"border-focus ring-focus/50 relative block size-3 shrink-0 rounded-full border bg-white motion-color cursor-clickable select-none after:absolute after:-inset-2 hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3 data-disabled:pointer-events-none\"\n />\n ))}\n </SliderPrimitive.Control>\n </SliderPrimitive.Root>\n )\n}\n\nexport { Slider }\n"],"mappings":";;;;;;AAiBA,SAAS,OAAO,EACd,WACA,kBACA,cACA,OACA,MAAM,GACN,MAAM,KACN,cAAc,cACd,cAAc,WACd,mBACA,GAAG,SACW;CACd,MAAM,UAAU,MAAM,cAElB,MAAM,QAAQ,MAAM,GAChB,QACA,MAAM,QAAQ,aAAa,GACzB,eACA,CAAC,KAAK,IAAI,EAClB;EAAC;EAAO;EAAc;EAAK;EAAI,CAChC;AAED,QACE,oBAACA,SAAgB,MAAjB;EACE,WAAW,GACT,2EACA,UACD;EACD,aAAU;EACI;EACP;EACF;EACA;EACQ;EACb,gBAAe;EACf,GAAI;YAEJ,qBAACA,SAAgB,SAAjB;GACE,aAAU;GACV,WAAW,GACT,sQACA,iBACD;aALH,CAOE,oBAACA,SAAgB,OAAjB;IACE,aAAU;IACV,WAAU;cAEV,oBAACA,SAAgB,WAAjB;KACE,aAAU;KACV,WAAU;KACV,CAAA;IACoB,CAAA,EACvB,MAAM,KAAK,EAAE,QAAQ,QAAQ,QAAQ,GAAG,GAAG,UAC1C,oBAACA,SAAgB,OAAjB;IACE,aAAU;IAEV,cAAY,oBAAoB,kBAAkB,MAAM,GAAG;IAC3D,WAAU;IACV,EAHK,MAGL,CACF,CACsB;;EACL,CAAA"}
|
package/dist/styles.css
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
:root {
|
|
28
28
|
/* ========================================================================
|
|
29
29
|
* Palettes — raw primitives. No `--color-` prefix on purpose: these live in
|
|
30
|
-
* `:root`, not `@theme`, so they generate NO utilities (no `bg-
|
|
30
|
+
* `:root`, not `@theme`, so they generate NO utilities (no `bg-graphite-300`).
|
|
31
31
|
* They're referenced by the semantic tokens below, never used directly.
|
|
32
32
|
* ====================================================================== */
|
|
33
33
|
|
|
@@ -129,7 +129,7 @@
|
|
|
129
129
|
--contrast-inverse: var(--foundation);
|
|
130
130
|
|
|
131
131
|
/* Brand — `primary` wired to the Wave ramp; `secondary` is the neutral fill
|
|
132
|
-
* (secondary/ghost buttons, hovers, selected) at
|
|
132
|
+
* (secondary/ghost buttons, hovers, selected) at ui-300; `accent` is the
|
|
133
133
|
* bright signal (Wave Blue 300, the strand now-glow). No per-fill on-color
|
|
134
134
|
* tokens: text on the saturated fills is
|
|
135
135
|
* `text-white`, text on the neutral `secondary` is `text-contrast`. */
|
|
@@ -146,6 +146,9 @@
|
|
|
146
146
|
/* Rings = brand themed */
|
|
147
147
|
--focus: var(--primary);
|
|
148
148
|
|
|
149
|
+
/* Scrim — the dim behind modal overlays (dialog / drawer / alert backdrop). */
|
|
150
|
+
--scrim: oklch(0 0 0 / 0.1);
|
|
151
|
+
|
|
149
152
|
/* Shadow — two dials for the layered `shadow-*` scale: `--shadow-color` (oklch
|
|
150
153
|
* components `L C H` — a deep cool-tinted near-black, never pure black which
|
|
151
154
|
* reads heavy) and `--shadow-strength` (per-layer alpha / intensity). Both
|
|
@@ -226,7 +229,7 @@
|
|
|
226
229
|
--muted: var(--ui-400);
|
|
227
230
|
--soft: var(--ui-600);
|
|
228
231
|
|
|
229
|
-
/* Brand — only `secondary` differs from light; mirrored to
|
|
232
|
+
/* Brand — only `secondary` differs from light; mirrored to ui-700 so the
|
|
230
233
|
* neutral fill stands out against the dark surfaces. primary / accent /
|
|
231
234
|
* inverse / focus auto-flip or stay constant via the `:root` definitions. */
|
|
232
235
|
--secondary: var(--ui-700);
|
|
@@ -314,6 +317,7 @@
|
|
|
314
317
|
--color-edge: var(--edge);
|
|
315
318
|
--color-solid: var(--solid);
|
|
316
319
|
--color-focus: var(--focus);
|
|
320
|
+
--color-scrim: var(--scrim);
|
|
317
321
|
|
|
318
322
|
/* Status */
|
|
319
323
|
--color-destructive: var(--destructive);
|
package/dist/table.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.d.ts","names":[],"sources":["../src/table.tsx"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"table.d.ts","names":[],"sources":["../src/table.tsx"],"mappings":";;;;KAIK,UAAA,GAAa,KAAA,CAAM,cAAA;AAAA,KACnB,gBAAA,GAAmB,KAAA,CAAM,cAAA;AAAA,KACzB,cAAA,GAAiB,KAAA,CAAM,cAAA;AAAA,KACvB,gBAAA,GAAmB,KAAA,CAAM,cAAA;AAAA,KACzB,aAAA,GAAgB,KAAA,CAAM,cAAA;AAAA,KACtB,cAAA,GAAiB,KAAA,CAAM,cAAA;AAAA,KACvB,cAAA,GAAiB,KAAA,CAAM,cAAA;AAAA,KACvB,iBAAA,GAAoB,KAAA,CAAM,cAAA;AAAA,iBAEtB,KAAA,CAAA;EAAQ,SAAA;EAAA,GAAc;AAAA,GAAS,UAAA,GAAU,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAkBzC,WAAA,CAAA;EAAc,SAAA;EAAA,GAAc;AAAA,GAAS,gBAAA,GAAgB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUrD,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUjD,WAAA,CAAA;EAAc,SAAA;EAAA,GAAc;AAAA,GAAS,gBAAA,GAAgB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAarD,QAAA,CAAA;EAAW,SAAA;EAAA,GAAc;AAAA,GAAS,aAAA,GAAa,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAa/C,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAajD,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAajD,YAAA,CAAA;EAAe,SAAA;EAAA,GAAc;AAAA,GAAS,iBAAA,GAAiB,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
package/dist/table.js
CHANGED
package/dist/table.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.js","names":[],"sources":["../src/table.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"table.js","names":[],"sources":["../src/table.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\n\ntype TableProps = React.ComponentProps<\"table\">\ntype TableHeaderProps = React.ComponentProps<\"thead\">\ntype TableBodyProps = React.ComponentProps<\"tbody\">\ntype TableFooterProps = React.ComponentProps<\"tfoot\">\ntype TableRowProps = React.ComponentProps<\"tr\">\ntype TableHeadProps = React.ComponentProps<\"th\">\ntype TableCellProps = React.ComponentProps<\"td\">\ntype TableCaptionProps = React.ComponentProps<\"caption\">\n\nfunction Table({ className, ...props }: TableProps) {\n return (\n <div\n data-slot=\"table-container\"\n role=\"region\"\n aria-label=\"Table\"\n tabIndex={0}\n className=\"relative w-full overflow-x-auto focus-visible:outline-hidden focus-visible:ring-3 focus-visible:ring-focus/50\"\n >\n <table\n data-slot=\"table\"\n className={cn(\"w-full caption-bottom text-sm\", className)}\n {...props}\n />\n </div>\n )\n}\n\nfunction TableHeader({ className, ...props }: TableHeaderProps) {\n return (\n <thead\n data-slot=\"table-header\"\n className={cn(\"[&_tr]:border-b [&_tr]:border-edge\", className)}\n {...props}\n />\n )\n}\n\nfunction TableBody({ className, ...props }: TableBodyProps) {\n return (\n <tbody\n data-slot=\"table-body\"\n className={cn(\"[&_tr:last-child]:border-0\", className)}\n {...props}\n />\n )\n}\n\nfunction TableFooter({ className, ...props }: TableFooterProps) {\n return (\n <tfoot\n data-slot=\"table-footer\"\n className={cn(\n \"bg-secondary/50 border-t border-edge font-medium [&>tr]:last:border-b-0\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableRow({ className, ...props }: TableRowProps) {\n return (\n <tr\n data-slot=\"table-row\"\n className={cn(\n \"hover:bg-secondary/50 aria-selected:bg-secondary border-b border-edge transition-colors\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableHead({ className, ...props }: TableHeadProps) {\n return (\n <th\n data-slot=\"table-head\"\n className={cn(\n \"text-contrast h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableCell({ className, ...props }: TableCellProps) {\n return (\n <td\n data-slot=\"table-cell\"\n className={cn(\n \"p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableCaption({ className, ...props }: TableCaptionProps) {\n return (\n <caption\n data-slot=\"table-caption\"\n className={cn(\"text-muted mt-4 text-sm\", className)}\n {...props}\n />\n )\n}\n\nexport {\n Table,\n TableHeader,\n TableBody,\n TableFooter,\n TableHead,\n TableRow,\n TableCell,\n TableCaption,\n}\n"],"mappings":";;;;AAaA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAqB;AAClD,QACE,oBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,cAAW;EACX,UAAU;EACV,WAAU;YAEV,oBAAC,SAAD;GACE,aAAU;GACV,WAAW,GAAG,iCAAiC,UAAU;GACzD,GAAI;GACJ,CAAA;EACE,CAAA;;AAIV,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2B;AAC9D,QACE,oBAAC,SAAD;EACE,aAAU;EACV,WAAW,GAAG,sCAAsC,UAAU;EAC9D,GAAI;EACJ,CAAA;;AAIN,SAAS,UAAU,EAAE,WAAW,GAAG,SAAyB;AAC1D,QACE,oBAAC,SAAD;EACE,aAAU;EACV,WAAW,GAAG,8BAA8B,UAAU;EACtD,GAAI;EACJ,CAAA;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2B;AAC9D,QACE,oBAAC,SAAD;EACE,aAAU;EACV,WAAW,GACT,2EACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,SAAS,EAAE,WAAW,GAAG,SAAwB;AACxD,QACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GACT,2FACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,UAAU,EAAE,WAAW,GAAG,SAAyB;AAC1D,QACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GACT,8GACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,UAAU,EAAE,WAAW,GAAG,SAAyB;AAC1D,QACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GACT,oEACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,aAAa,EAAE,WAAW,GAAG,SAA4B;AAChE,QACE,oBAAC,WAAD;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,UAAU;EACnD,GAAI;EACJ,CAAA"}
|
package/dist/toast.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ import * as _$_base_ui_react0 from "@base-ui/react";
|
|
|
7
7
|
//#region src/toast.d.ts
|
|
8
8
|
declare const toastRootClass = "bg-elevated text-contrast ring-contrast/10 rounded-md p-4 text-sm shadow-md ring-1 outline-none select-none";
|
|
9
9
|
declare const toastIconVariants: (props?: ({
|
|
10
|
-
type?: "success" | "
|
|
10
|
+
type?: "success" | "warning" | "loading" | "info" | "error" | null | undefined;
|
|
11
11
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
12
12
|
declare const toastViewportVariants: (props?: ({
|
|
13
13
|
position?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | null | undefined;
|
package/dist/toggle.js
CHANGED
package/dist/toggle.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toggle.js","names":["TogglePrimitive"],"sources":["../src/toggle.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\n\nconst toggleVariants = cva(\n \"cursor-clickable hover:text-contrast focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-pressed:bg-secondary gap-1 rounded-md text-sm font-medium motion-color [&_svg:not([class*='size-'])]:size-4 group/toggle hover:bg-secondary inline-flex items-center justify-center whitespace-nowrap outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n {\n variants: {\n variant: {\n default: \"bg-transparent\",\n outline: \"border-edge hover:bg-secondary border bg-transparent\",\n },\n size: {\n default: \"h-8 min-w-8 px-2\",\n sm: \"h-7 min-w-7 rounded-sm px-1.5 text-[0.8rem]\",\n lg: \"h-9 min-w-9 px-2.5\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n)\n\ntype ToggleProps = React.ComponentProps<typeof TogglePrimitive> &\n VariantProps<typeof toggleVariants>\n\nfunction Toggle({\n className,\n variant = \"default\",\n size = \"default\",\n ...props\n}: ToggleProps) {\n return (\n <TogglePrimitive\n data-slot=\"toggle\"\n className={cn(toggleVariants({ variant, size, className
|
|
1
|
+
{"version":3,"file":"toggle.js","names":["TogglePrimitive"],"sources":["../src/toggle.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\n\nconst toggleVariants = cva(\n \"cursor-clickable hover:text-contrast focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-pressed:bg-secondary gap-1 rounded-md text-sm font-medium motion-color [&_svg:not([class*='size-'])]:size-4 group/toggle hover:bg-secondary inline-flex items-center justify-center whitespace-nowrap outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n {\n variants: {\n variant: {\n default: \"bg-transparent\",\n outline: \"border-edge hover:bg-secondary border bg-transparent\",\n },\n size: {\n default: \"h-8 min-w-8 px-2\",\n sm: \"h-7 min-w-7 rounded-sm px-1.5 text-[0.8rem]\",\n lg: \"h-9 min-w-9 px-2.5\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n)\n\ntype ToggleProps = React.ComponentProps<typeof TogglePrimitive> &\n VariantProps<typeof toggleVariants>\n\nfunction Toggle({\n className,\n variant = \"default\",\n size = \"default\",\n ...props\n}: ToggleProps) {\n return (\n <TogglePrimitive\n data-slot=\"toggle\"\n className={cn(toggleVariants({ variant, size }), className)}\n {...props}\n />\n )\n}\n\nexport { Toggle, toggleVariants }\n"],"mappings":";;;;;;;AAQA,MAAM,iBAAiB,IACrB,ihBACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACV;EACD,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACL;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF;AAKD,SAAS,OAAO,EACd,WACA,UAAU,WACV,OAAO,WACP,GAAG,SACW;AACd,QACE,oBAACA,UAAD;EACE,aAAU;EACV,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM,CAAC,EAAE,UAAU;EAC3D,GAAI;EACJ,CAAA"}
|