@nadicodeai/ui 0.4.1 → 0.5.1
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/AGENTS.md +1 -1
- package/README.md +2 -2
- package/dist/components/accordion.d.ts +4 -15
- package/dist/components/accordion.d.ts.map +1 -1
- package/dist/components/accordion.js +5 -31
- package/dist/components/agent-message.js +1 -1
- package/dist/components/agent-tool-approval.d.ts.map +1 -1
- package/dist/components/agent-tool-approval.js +9 -6
- package/dist/components/ai-elements/artifact.js +1 -1
- package/dist/components/ai-elements/attachments.d.ts +1 -1
- package/dist/components/ai-elements/attachments.d.ts.map +1 -1
- package/dist/components/ai-elements/attachments.js +2 -2
- package/dist/components/ai-elements/audio-player.d.ts.map +1 -1
- package/dist/components/ai-elements/audio-player.js +8 -8
- package/dist/components/ai-elements/chain-of-thought.js +1 -1
- package/dist/components/ai-elements/checkpoint.d.ts +1 -1
- package/dist/components/ai-elements/checkpoint.d.ts.map +1 -1
- package/dist/components/ai-elements/checkpoint.js +1 -1
- package/dist/components/ai-elements/commit.d.ts.map +1 -1
- package/dist/components/ai-elements/commit.js +1 -1
- package/dist/components/ai-elements/context.d.ts +4 -4
- package/dist/components/ai-elements/context.d.ts.map +1 -1
- package/dist/components/ai-elements/context.js +4 -3
- package/dist/components/ai-elements/file-tree.d.ts.map +1 -1
- package/dist/components/ai-elements/file-tree.js +1 -1
- package/dist/components/ai-elements/inline-citation.d.ts.map +1 -1
- package/dist/components/ai-elements/inline-citation.js +2 -2
- package/dist/components/ai-elements/message.js +1 -1
- package/dist/components/ai-elements/mic-selector.d.ts.map +1 -1
- package/dist/components/ai-elements/mic-selector.js +1 -1
- package/dist/components/ai-elements/model-selector.d.ts +1 -1
- package/dist/components/ai-elements/model-selector.d.ts.map +1 -1
- package/dist/components/ai-elements/model-selector.js +1 -1
- package/dist/components/ai-elements/open-in-chat.d.ts.map +1 -1
- package/dist/components/ai-elements/open-in-chat.js +8 -5
- package/dist/components/ai-elements/plan.d.ts.map +1 -1
- package/dist/components/ai-elements/plan.js +3 -3
- package/dist/components/ai-elements/prompt-input.d.ts +2 -2
- package/dist/components/ai-elements/prompt-input.d.ts.map +1 -1
- package/dist/components/ai-elements/prompt-input.js +12 -12
- package/dist/components/ai-elements/queue.d.ts.map +1 -1
- package/dist/components/ai-elements/queue.js +2 -2
- package/dist/components/ai-elements/reasoning.js +1 -1
- package/dist/components/ai-elements/sandbox.js +3 -3
- package/dist/components/ai-elements/schema-display.js +4 -4
- package/dist/components/ai-elements/sources.js +1 -1
- package/dist/components/ai-elements/stack-trace.d.ts.map +1 -1
- package/dist/components/ai-elements/stack-trace.js +2 -2
- package/dist/components/ai-elements/task.d.ts.map +1 -1
- package/dist/components/ai-elements/task.js +3 -3
- package/dist/components/ai-elements/test-results.js +1 -1
- package/dist/components/ai-elements/tool.js +2 -2
- package/dist/components/ai-elements/voice-selector.d.ts +1 -1
- package/dist/components/ai-elements/voice-selector.d.ts.map +1 -1
- package/dist/components/ai-elements/voice-selector.js +1 -1
- package/dist/components/ai-elements/web-preview.d.ts.map +1 -1
- package/dist/components/ai-elements/web-preview.js +2 -2
- package/dist/components/alert-dialog.d.ts +1 -2
- package/dist/components/alert-dialog.d.ts.map +1 -1
- package/dist/components/alert-dialog.js +2 -3
- package/dist/components/alert.d.ts +2 -1
- package/dist/components/alert.d.ts.map +1 -1
- package/dist/components/alert.js +8 -5
- package/dist/components/aspect-ratio.d.ts.map +1 -1
- package/dist/components/aspect-ratio.js +0 -1
- package/dist/components/avatar.d.ts.map +1 -1
- package/dist/components/avatar.js +0 -1
- package/dist/components/badge.d.ts +2 -4
- package/dist/components/badge.d.ts.map +1 -1
- package/dist/components/badge.js +21 -13
- package/dist/components/breadcrumb.d.ts +3 -4
- package/dist/components/breadcrumb.d.ts.map +1 -1
- package/dist/components/breadcrumb.js +20 -12
- package/dist/components/button-group.d.ts +2 -3
- package/dist/components/button-group.d.ts.map +1 -1
- package/dist/components/button-group.js +17 -9
- package/dist/components/button.d.ts +1 -5
- package/dist/components/button.d.ts.map +1 -1
- package/dist/components/button.js +2 -8
- package/dist/components/calendar.d.ts +5 -3
- package/dist/components/calendar.d.ts.map +1 -1
- package/dist/components/calendar.js +17 -17
- package/dist/components/card.d.ts +3 -1
- package/dist/components/card.d.ts.map +1 -1
- package/dist/components/card.js +6 -6
- package/dist/components/carousel.d.ts +10 -1
- package/dist/components/carousel.d.ts.map +1 -1
- package/dist/components/carousel.js +10 -10
- package/dist/components/chart.d.ts.map +1 -1
- package/dist/components/chart.js +2 -3
- package/dist/components/collapsible.d.ts +3 -7
- package/dist/components/collapsible.d.ts.map +1 -1
- package/dist/components/collapsible.js +5 -16
- package/dist/components/combobox.d.ts +1 -1
- package/dist/components/combobox.d.ts.map +1 -1
- package/dist/components/combobox.js +10 -11
- package/dist/components/command.d.ts.map +1 -1
- package/dist/components/command.js +1 -1
- package/dist/components/context-menu.d.ts +4 -9
- package/dist/components/context-menu.d.ts.map +1 -1
- package/dist/components/context-menu.js +6 -16
- package/dist/components/dashboard-shell.d.ts +11 -2
- package/dist/components/dashboard-shell.d.ts.map +1 -1
- package/dist/components/dashboard-shell.js +73 -4
- package/dist/components/dialog.d.ts +2 -3
- package/dist/components/dialog.d.ts.map +1 -1
- package/dist/components/dialog.js +2 -4
- package/dist/components/direction.d.ts +1 -8
- package/dist/components/direction.d.ts.map +1 -1
- package/dist/components/direction.js +1 -7
- package/dist/components/drawer.d.ts +4 -13
- package/dist/components/drawer.d.ts.map +1 -1
- package/dist/components/drawer.js +5 -22
- package/dist/components/dropdown-menu.d.ts +4 -9
- package/dist/components/dropdown-menu.d.ts.map +1 -1
- package/dist/components/dropdown-menu.js +6 -17
- package/dist/components/empty.d.ts.map +1 -1
- package/dist/components/empty.js +5 -5
- package/dist/components/field.d.ts.map +1 -1
- package/dist/components/field.js +11 -19
- package/dist/components/form.d.ts +2 -2
- package/dist/components/form.d.ts.map +1 -1
- package/dist/components/form.js +17 -5
- package/dist/components/hover-card.d.ts +3 -8
- package/dist/components/hover-card.d.ts.map +1 -1
- package/dist/components/hover-card.js +4 -9
- package/dist/components/input-group.d.ts +3 -1
- package/dist/components/input-group.d.ts.map +1 -1
- package/dist/components/input-group.js +10 -16
- package/dist/components/input-otp.d.ts.map +1 -1
- package/dist/components/input-otp.js +5 -5
- package/dist/components/input.d.ts.map +1 -1
- package/dist/components/input.js +2 -1
- package/dist/components/item.d.ts +3 -4
- package/dist/components/item.d.ts.map +1 -1
- package/dist/components/item.js +29 -18
- package/dist/components/kbd.d.ts.map +1 -1
- package/dist/components/kbd.js +1 -1
- package/dist/components/label-system.d.ts +14 -0
- package/dist/components/label-system.d.ts.map +1 -0
- package/dist/components/label-system.js +16 -0
- package/dist/components/menubar.d.ts.map +1 -1
- package/dist/components/menubar.js +4 -1
- package/dist/components/native-select.d.ts +3 -2
- package/dist/components/native-select.d.ts.map +1 -1
- package/dist/components/native-select.js +2 -2
- package/dist/components/navigation-menu.d.ts +2 -9
- package/dist/components/navigation-menu.d.ts.map +1 -1
- package/dist/components/navigation-menu.js +4 -8
- package/dist/components/pagination.d.ts +8 -4
- package/dist/components/pagination.d.ts.map +1 -1
- package/dist/components/pagination.js +10 -13
- package/dist/components/popover.d.ts +3 -7
- package/dist/components/popover.d.ts.map +1 -1
- package/dist/components/popover.js +5 -30
- package/dist/components/radio-group.d.ts.map +1 -1
- package/dist/components/radio-group.js +0 -1
- package/dist/components/resizable.d.ts.map +1 -1
- package/dist/components/resizable.js +2 -2
- package/dist/components/scroll-area.d.ts.map +1 -1
- package/dist/components/scroll-area.js +0 -1
- package/dist/components/separator.d.ts.map +1 -1
- package/dist/components/separator.js +0 -1
- package/dist/components/sheet.d.ts +2 -3
- package/dist/components/sheet.d.ts.map +1 -1
- package/dist/components/sheet.js +2 -3
- package/dist/components/sidebar.d.ts +9 -15
- package/dist/components/sidebar.d.ts.map +1 -1
- package/dist/components/sidebar.js +85 -41
- package/dist/components/skeleton.js +1 -1
- package/dist/components/slider.d.ts.map +1 -1
- package/dist/components/slider.js +3 -8
- package/dist/components/sonner.d.ts +1 -1
- package/dist/components/sonner.d.ts.map +1 -1
- package/dist/components/sonner.js +15 -9
- package/dist/components/spinner.d.ts.map +1 -1
- package/dist/components/spinner.js +2 -2
- package/dist/components/switch.d.ts.map +1 -1
- package/dist/components/switch.js +0 -1
- package/dist/components/table.d.ts.map +1 -1
- package/dist/components/table.js +5 -5
- package/dist/components/tabs.d.ts.map +1 -1
- package/dist/components/tabs.js +0 -1
- package/dist/components/textarea.js +1 -1
- package/dist/components/theme-mode-switcher.js +4 -3
- package/dist/components/toggle-group.d.ts +3 -9
- package/dist/components/toggle-group.d.ts.map +1 -1
- package/dist/components/toggle-group.js +5 -22
- package/dist/components/toggle.d.ts +1 -2
- package/dist/components/toggle.d.ts.map +1 -1
- package/dist/components/toggle.js +2 -3
- package/dist/components/tooltip.d.ts +2 -5
- package/dist/components/tooltip.d.ts.map +1 -1
- package/dist/components/tooltip.js +4 -6
- package/dist/hooks/use-mobile.d.ts.map +1 -1
- package/dist/hooks/use-mobile.js +0 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/styles/globals.css +8 -0
- package/docs/migration/base-ui-migration.md +33 -9
- package/package.json +3 -2
- package/dist/lib/base-render.d.ts +0 -14
- package/dist/lib/base-render.d.ts.map +0 -1
- package/dist/lib/base-render.js +0 -16
- package/dist/lib/slot.d.ts +0 -8
- package/dist/lib/slot.d.ts.map +0 -1
- package/dist/lib/slot.js +0 -17
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../src/components/dropdown-menu.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../src/components/dropdown-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAK3D,iBAAS,YAAY,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,qBAE3D;AAED,iBAAS,kBAAkB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,qBAEnE;AAED,iBAAS,mBAAmB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,OAAO,CAAC,KAAK,qBAErE;AAED,iBAAS,mBAAmB,CAAC,EAC3B,KAAe,EACf,WAAe,EACf,IAAe,EACf,UAAc,EACd,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,KAAK,CAAC,KAAK,GAC1B,IAAI,CACF,aAAa,CAAC,UAAU,CAAC,KAAK,EAC9B,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,CAChD,qBAkBF;AAED,iBAAS,iBAAiB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,KAAK,CAAC,KAAK,qBAEjE;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,UAAU,CAAC,KAAK,GAAG;IAClC,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,qBAYA;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,KAAK,EACL,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,GAAG;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;CACpC,qBAaA;AAED,iBAAS,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,WAAW,CAAC,KAAK,qBAErE;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,cAAc,CAAC,KAAK,GAAG;IACtC,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,qBAeA;AAED,iBAAS,sBAAsB,CAAC,EAC9B,KAAe,EACf,WAAgB,EAChB,IAAc,EACd,UAAc,EACd,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,qBAYlD;AAED,iBAAS,wBAAwB,CAAC,EAChC,SAAS,EACT,QAAQ,EACR,OAAO,EACP,KAAK,EACL,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,YAAY,CAAC,KAAK,GAAG;IACpC,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,qBAwBA;AAED,iBAAS,sBAAsB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,UAAU,CAAC,KAAK,qBAO3E;AAED,iBAAS,qBAAqB,CAAC,EAC7B,SAAS,EACT,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,SAAS,CAAC,KAAK,GAAG;IACjC,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,qBAuBA;AAED,iBAAS,qBAAqB,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,SAAS,CAAC,KAAK,qBAQ/B;AAED,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAW9B;AAED,OAAO,EACL,YAAY,EACZ,kBAAkB,EAClB,mBAAmB,EACnB,mBAAmB,EACnB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,wBAAwB,EACxB,sBAAsB,EACtB,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,GACvB,CAAA"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
2
|
import { Menu as MenuPrimitive } from "@base-ui/react/menu";
|
|
4
|
-
import { withAsChildRender } from "../lib/base-render.js";
|
|
5
3
|
import { cn } from "../lib/utils.js";
|
|
6
4
|
import { ChevronRightIcon, CheckIcon } from "lucide-react";
|
|
7
5
|
function DropdownMenu({ ...props }) {
|
|
@@ -11,7 +9,7 @@ function DropdownMenuPortal({ ...props }) {
|
|
|
11
9
|
return _jsx(MenuPrimitive.Portal, { "data-slot": "dropdown-menu-portal", ...props });
|
|
12
10
|
}
|
|
13
11
|
function DropdownMenuTrigger({ ...props }) {
|
|
14
|
-
return
|
|
12
|
+
return _jsx(MenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
|
|
15
13
|
}
|
|
16
14
|
function DropdownMenuContent({ align = "start", alignOffset = 0, side = "bottom", sideOffset = 4, className, ...props }) {
|
|
17
15
|
return (_jsx(MenuPrimitive.Portal, { children: _jsx(MenuPrimitive.Positioner, { className: "isolate z-50 outline-none", align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, children: _jsx(MenuPrimitive.Popup, { "data-slot": "dropdown-menu-content", className: cn("z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 outline-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:overflow-hidden data-closed:fade-out-0 data-closed:zoom-out-95", className), ...props }) }) }));
|
|
@@ -22,23 +20,14 @@ function DropdownMenuGroup({ ...props }) {
|
|
|
22
20
|
function DropdownMenuLabel({ className, inset, ...props }) {
|
|
23
21
|
return (_jsx(MenuPrimitive.GroupLabel, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn("px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:pl-7", className), ...props }));
|
|
24
22
|
}
|
|
25
|
-
function DropdownMenuItem({ className, inset,
|
|
26
|
-
|
|
27
|
-
onSelect?.(event.nativeEvent);
|
|
28
|
-
if (event.nativeEvent.defaultPrevented) {
|
|
29
|
-
event.preventBaseUIHandler?.();
|
|
30
|
-
event.preventDefault();
|
|
31
|
-
return;
|
|
32
|
-
}
|
|
33
|
-
onClick?.(event);
|
|
34
|
-
};
|
|
35
|
-
return (_jsx(MenuPrimitive.Item, { "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("group/dropdown-menu-item relative flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive", className), onClick: handleClick, ...withAsChildRender(props) }));
|
|
23
|
+
function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
|
|
24
|
+
return (_jsx(MenuPrimitive.Item, { "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("group/dropdown-menu-item relative flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive", className), ...props }));
|
|
36
25
|
}
|
|
37
26
|
function DropdownMenuSub({ ...props }) {
|
|
38
27
|
return _jsx(MenuPrimitive.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...props });
|
|
39
28
|
}
|
|
40
|
-
function DropdownMenuSubTrigger({ className, inset, children,
|
|
41
|
-
return (
|
|
29
|
+
function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
|
|
30
|
+
return (_jsxs(MenuPrimitive.SubmenuTrigger, { "data-slot": "dropdown-menu-sub-trigger", "data-inset": inset, className: cn("flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-popup-open:bg-accent data-popup-open:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto" })] }));
|
|
42
31
|
}
|
|
43
32
|
function DropdownMenuSubContent({ align = "start", alignOffset = -3, side = "right", sideOffset = 0, className, ...props }) {
|
|
44
33
|
return (_jsx(DropdownMenuContent, { "data-slot": "dropdown-menu-sub-content", className: cn("w-auto min-w-[96px] rounded-lg bg-popover p-1 text-popover-foreground shadow-lg ring-1 ring-foreground/10 duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className), align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"empty.d.ts","sourceRoot":"","sources":["../../src/components/empty.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWlE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+
|
|
1
|
+
{"version":3,"file":"empty.d.ts","sourceRoot":"","sources":["../../src/components/empty.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWlE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAQxE;AAED,QAAA,MAAM,kBAAkB;;8EAavB,CAAA;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,+BASvE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWvE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,+BAW3E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWzE;AAED,OAAO,EACL,KAAK,EACL,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,YAAY,EACZ,UAAU,GACX,CAAA"}
|
package/dist/components/empty.js
CHANGED
|
@@ -2,16 +2,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { cva } from "class-variance-authority";
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
4
|
function Empty({ className, ...props }) {
|
|
5
|
-
return (_jsx("div", { "data-slot": "empty", className: cn("flex min-w-0 flex-1 flex-col items-center justify-center gap-
|
|
5
|
+
return (_jsx("div", { "data-slot": "empty", className: cn("flex w-full min-w-0 flex-1 flex-col items-center justify-center gap-4 rounded-xl border-dashed p-6 text-center text-balance", className), ...props }));
|
|
6
6
|
}
|
|
7
7
|
function EmptyHeader({ className, ...props }) {
|
|
8
|
-
return (_jsx("div", { "data-slot": "empty-header", className: cn("flex max-w-sm flex-col items-center gap-2
|
|
8
|
+
return (_jsx("div", { "data-slot": "empty-header", className: cn("flex max-w-sm flex-col items-center gap-2", className), ...props }));
|
|
9
9
|
}
|
|
10
10
|
const emptyMediaVariants = cva("mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", {
|
|
11
11
|
variants: {
|
|
12
12
|
variant: {
|
|
13
13
|
default: "bg-transparent",
|
|
14
|
-
icon: "flex size-
|
|
14
|
+
icon: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-4",
|
|
15
15
|
},
|
|
16
16
|
},
|
|
17
17
|
defaultVariants: {
|
|
@@ -22,12 +22,12 @@ function EmptyMedia({ className, variant = "default", ...props }) {
|
|
|
22
22
|
return (_jsx("div", { "data-slot": "empty-icon", "data-variant": variant, className: cn(emptyMediaVariants({ variant, className })), ...props }));
|
|
23
23
|
}
|
|
24
24
|
function EmptyTitle({ className, ...props }) {
|
|
25
|
-
return (_jsx("div", { "data-slot": "empty-title", className: cn("text-
|
|
25
|
+
return (_jsx("div", { "data-slot": "empty-title", className: cn("text-sm font-medium tracking-tight", className), ...props }));
|
|
26
26
|
}
|
|
27
27
|
function EmptyDescription({ className, ...props }) {
|
|
28
28
|
return (_jsx("div", { "data-slot": "empty-description", className: cn("text-sm/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
|
|
29
29
|
}
|
|
30
30
|
function EmptyContent({ className, ...props }) {
|
|
31
|
-
return (_jsx("div", { "data-slot": "empty-content", className: cn("flex w-full max-w-sm min-w-0 flex-col items-center gap-
|
|
31
|
+
return (_jsx("div", { "data-slot": "empty-content", className: cn("flex w-full max-w-sm min-w-0 flex-col items-center gap-2.5 text-sm text-balance", className), ...props }));
|
|
32
32
|
}
|
|
33
33
|
export { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia, };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/components/field.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAG1C,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,+
|
|
1
|
+
{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/components/field.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAG1C,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,+BAW1E;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAA;CAAE,+BAYnE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWvE;AAED,QAAA,MAAM,aAAa;;8EAgBlB,CAAA;AAED,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,WAAwB,EACxB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,+BAUlE;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWzE;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,+BAYpC;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWvE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,+BAa3E;AAED,iBAAS,cAAc,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,+BAsBA;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,CAAC,EAAE,KAAK,CAAC;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,SAAS,CAAC,CAAA;CACjD,sCA0CA;AAED,OAAO,EACL,KAAK,EACL,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,WAAW,EACX,cAAc,EACd,QAAQ,EACR,YAAY,EACZ,UAAU,GACX,CAAA"}
|
package/dist/components/field.js
CHANGED
|
@@ -6,28 +6,20 @@ import { cn } from "../lib/utils.js";
|
|
|
6
6
|
import { Label } from "./label.js";
|
|
7
7
|
import { Separator } from "./separator.js";
|
|
8
8
|
function FieldSet({ className, ...props }) {
|
|
9
|
-
return (_jsx("fieldset", { "data-slot": "field-set", className: cn("flex flex-col gap-
|
|
9
|
+
return (_jsx("fieldset", { "data-slot": "field-set", className: cn("flex flex-col gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3", className), ...props }));
|
|
10
10
|
}
|
|
11
11
|
function FieldLegend({ className, variant = "legend", ...props }) {
|
|
12
|
-
return (_jsx("legend", { "data-slot": "field-legend", "data-variant": variant, className: cn("mb-
|
|
12
|
+
return (_jsx("legend", { "data-slot": "field-legend", "data-variant": variant, className: cn("mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base", className), ...props }));
|
|
13
13
|
}
|
|
14
14
|
function FieldGroup({ className, ...props }) {
|
|
15
|
-
return (_jsx("div", { "data-slot": "field-group", className: cn("group/field-group @container/field-group flex w-full flex-col gap-
|
|
15
|
+
return (_jsx("div", { "data-slot": "field-group", className: cn("group/field-group @container/field-group flex w-full flex-col gap-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4", className), ...props }));
|
|
16
16
|
}
|
|
17
|
-
const fieldVariants = cva("group/field flex w-full gap-
|
|
17
|
+
const fieldVariants = cva("group/field flex w-full gap-2 data-[invalid=true]:text-destructive", {
|
|
18
18
|
variants: {
|
|
19
19
|
orientation: {
|
|
20
|
-
vertical:
|
|
21
|
-
horizontal: [
|
|
22
|
-
|
|
23
|
-
"[&>[data-slot=field-label]]:flex-auto",
|
|
24
|
-
"has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
|
|
25
|
-
],
|
|
26
|
-
responsive: [
|
|
27
|
-
"flex-col @md/field-group:flex-row @md/field-group:items-center [&>*]:w-full @md/field-group:[&>*]:w-auto [&>.sr-only]:w-auto",
|
|
28
|
-
"@md/field-group:[&>[data-slot=field-label]]:flex-auto",
|
|
29
|
-
"@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
|
|
30
|
-
],
|
|
20
|
+
vertical: "flex-col *:w-full [&>.sr-only]:w-auto",
|
|
21
|
+
horizontal: "flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
|
|
22
|
+
responsive: "flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
|
|
31
23
|
},
|
|
32
24
|
},
|
|
33
25
|
defaultVariants: {
|
|
@@ -38,16 +30,16 @@ function Field({ className, orientation = "vertical", ...props }) {
|
|
|
38
30
|
return (_jsx("div", { role: "group", "data-slot": "field", "data-orientation": orientation, className: cn(fieldVariants({ orientation }), className), ...props }));
|
|
39
31
|
}
|
|
40
32
|
function FieldContent({ className, ...props }) {
|
|
41
|
-
return (_jsx("div", { "data-slot": "field-content", className: cn("group/field-content flex flex-1 flex-col gap-
|
|
33
|
+
return (_jsx("div", { "data-slot": "field-content", className: cn("group/field-content flex flex-1 flex-col gap-0.5 leading-snug", className), ...props }));
|
|
42
34
|
}
|
|
43
35
|
function FieldLabel({ className, ...props }) {
|
|
44
|
-
return (_jsx(Label, { "data-slot": "field-label", className: cn("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50
|
|
36
|
+
return (_jsx(Label, { "data-slot": "field-label", className: cn("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-data-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border *:data-[slot=field]:p-2.5", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col", className), ...props }));
|
|
45
37
|
}
|
|
46
38
|
function FieldTitle({ className, ...props }) {
|
|
47
|
-
return (_jsx("div", { "data-slot": "field-label", className: cn("flex w-fit items-center gap-2 text-sm
|
|
39
|
+
return (_jsx("div", { "data-slot": "field-label", className: cn("flex w-fit items-center gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50", className), ...props }));
|
|
48
40
|
}
|
|
49
41
|
function FieldDescription({ className, ...props }) {
|
|
50
|
-
return (_jsx("p", { "data-slot": "field-description", className: cn("text-sm leading-normal font-normal text-muted-foreground group-has-
|
|
42
|
+
return (_jsx("p", { "data-slot": "field-description", className: cn("text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5", "last:mt-0 nth-last-2:-mt-1", "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
|
|
51
43
|
}
|
|
52
44
|
function FieldSeparator({ children, className, ...props }) {
|
|
53
45
|
return (_jsxs("div", { "data-slot": "field-separator", "data-content": !!children, className: cn("relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2", className), ...props, children: [_jsx(Separator, { className: "absolute inset-0 top-1/2" }), children && (_jsx("span", { className: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground", "data-slot": "field-separator-content", children: children }))] }));
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import {
|
|
2
|
+
import { useRender } from "@base-ui/react/use-render";
|
|
3
3
|
import { type ControllerProps, type FieldPath, type FieldValues } from "react-hook-form";
|
|
4
4
|
import { Label } from "./label";
|
|
5
5
|
declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>({ children, watch, getValues, getFieldState, setError, clearErrors, setValue, setValues, trigger, formState, resetField, reset, handleSubmit, unregister, control, register, setFocus, subscribe, }: import("react-hook-form").FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
|
|
@@ -18,7 +18,7 @@ declare const useFormField: () => {
|
|
|
18
18
|
};
|
|
19
19
|
declare function FormItem({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
20
20
|
declare function FormLabel({ className, ...props }: React.ComponentProps<typeof Label>): React.JSX.Element;
|
|
21
|
-
declare function FormControl({ ...props }:
|
|
21
|
+
declare function FormControl({ render, ...props }: useRender.ComponentProps<"div">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
|
|
22
22
|
declare function FormDescription({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element;
|
|
23
23
|
declare function FormMessage({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element | null;
|
|
24
24
|
export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../src/components/form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../src/components/form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAKL,KAAK,eAAe,EACpB,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,iBAAiB,CAAA;AAGxB,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAE1C,QAAA,MAAM,IAAI,0YAAe,CAAA;AAazB,QAAA,MAAM,SAAS,GACb,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,cAEC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,sBAMtC,CAAA;AAED,QAAA,MAAM,YAAY;;;;;;;;;;;CAqBjB,CAAA;AAUD,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAYrE;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,qBAYpC;AAED,iBAAS,WAAW,CAAC,EACnB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,0EAoBjC;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,qBAW1E;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,4BAkBtE;AAED,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,SAAS,GACV,CAAA"}
|
package/dist/components/form.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
|
-
import {
|
|
4
|
+
import { mergeProps } from "@base-ui/react/merge-props";
|
|
5
|
+
import { useRender } from "@base-ui/react/use-render";
|
|
5
6
|
import { Controller, FormProvider, useFormContext, useFormState, } from "react-hook-form";
|
|
6
7
|
import { cn } from "../lib/utils.js";
|
|
7
8
|
import { Label } from "./label.js";
|
|
@@ -38,11 +39,22 @@ function FormLabel({ className, ...props }) {
|
|
|
38
39
|
const { error, formItemId } = useFormField();
|
|
39
40
|
return (_jsx(Label, { "data-slot": "form-label", "data-error": !!error, className: cn("data-[error=true]:text-destructive", className), htmlFor: formItemId, ...props }));
|
|
40
41
|
}
|
|
41
|
-
function FormControl({ ...props }) {
|
|
42
|
+
function FormControl({ render, ...props }) {
|
|
42
43
|
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
43
|
-
return (
|
|
44
|
-
|
|
45
|
-
|
|
44
|
+
return useRender({
|
|
45
|
+
defaultTagName: "div",
|
|
46
|
+
props: mergeProps({
|
|
47
|
+
id: formItemId,
|
|
48
|
+
"aria-describedby": !error
|
|
49
|
+
? `${formDescriptionId}`
|
|
50
|
+
: `${formDescriptionId} ${formMessageId}`,
|
|
51
|
+
"aria-invalid": !!error,
|
|
52
|
+
}, props),
|
|
53
|
+
render,
|
|
54
|
+
state: {
|
|
55
|
+
slot: "form-control",
|
|
56
|
+
},
|
|
57
|
+
});
|
|
46
58
|
}
|
|
47
59
|
function FormDescription({ className, ...props }) {
|
|
48
60
|
const { formDescriptionId } = useFormField();
|
|
@@ -1,11 +1,6 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import { PreviewCard as PreviewCardPrimitive } from "@base-ui/react/preview-card";
|
|
3
|
-
|
|
4
|
-
declare function
|
|
5
|
-
|
|
6
|
-
openDelay?: number;
|
|
7
|
-
}): React.JSX.Element;
|
|
8
|
-
declare function HoverCardTrigger({ closeDelay, delay, ...props }: WithAsChild<PreviewCardPrimitive.Trigger.Props>): React.JSX.Element;
|
|
9
|
-
declare function HoverCardContent({ className, side, sideOffset, align, alignOffset, ...props }: PreviewCardPrimitive.Popup.Props & Pick<PreviewCardPrimitive.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">): React.JSX.Element;
|
|
2
|
+
declare function HoverCard({ ...props }: PreviewCardPrimitive.Root.Props): import("react").JSX.Element;
|
|
3
|
+
declare function HoverCardTrigger({ ...props }: PreviewCardPrimitive.Trigger.Props): import("react").JSX.Element;
|
|
4
|
+
declare function HoverCardContent({ className, side, sideOffset, align, alignOffset, ...props }: PreviewCardPrimitive.Popup.Props & Pick<PreviewCardPrimitive.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">): import("react").JSX.Element;
|
|
10
5
|
export { HoverCard, HoverCardTrigger, HoverCardContent };
|
|
11
6
|
//# sourceMappingURL=hover-card.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hover-card.d.ts","sourceRoot":"","sources":["../../src/components/hover-card.tsx"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"hover-card.d.ts","sourceRoot":"","sources":["../../src/components/hover-card.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AAIjF,iBAAS,SAAS,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,IAAI,CAAC,KAAK,+BAE/D;AAED,iBAAS,gBAAgB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,OAAO,CAAC,KAAK,+BAIzE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,IAAe,EACf,UAAc,EACd,KAAgB,EAChB,WAAe,EACf,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,KAAK,CAAC,KAAK,GACjC,IAAI,CACF,oBAAoB,CAAC,UAAU,CAAC,KAAK,EACrC,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,CAChD,+BAqBF;AAED,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA"}
|
|
@@ -1,17 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
import * as React from "react";
|
|
4
3
|
import { PreviewCard as PreviewCardPrimitive } from "@base-ui/react/preview-card";
|
|
5
|
-
import { withAsChildRender } from "../lib/base-render.js";
|
|
6
4
|
import { cn } from "../lib/utils.js";
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
const contextValue = React.useMemo(() => ({ closeDelay, openDelay }), [closeDelay, openDelay]);
|
|
10
|
-
return (_jsx(HoverCardDelayContext.Provider, { value: contextValue, children: _jsx(PreviewCardPrimitive.Root, { "data-slot": "hover-card", ...props }) }));
|
|
5
|
+
function HoverCard({ ...props }) {
|
|
6
|
+
return _jsx(PreviewCardPrimitive.Root, { "data-slot": "hover-card", ...props });
|
|
11
7
|
}
|
|
12
|
-
function HoverCardTrigger({
|
|
13
|
-
|
|
14
|
-
return (_jsx(PreviewCardPrimitive.Trigger, { "data-slot": "hover-card-trigger", closeDelay: closeDelay ?? delayContext.closeDelay, delay: delay ?? delayContext.openDelay, ...withAsChildRender(props) }));
|
|
8
|
+
function HoverCardTrigger({ ...props }) {
|
|
9
|
+
return (_jsx(PreviewCardPrimitive.Trigger, { "data-slot": "hover-card-trigger", ...props }));
|
|
15
10
|
}
|
|
16
11
|
function HoverCardContent({ className, side = "bottom", sideOffset = 4, align = "center", alignOffset = 4, ...props }) {
|
|
17
12
|
return (_jsx(PreviewCardPrimitive.Portal, { "data-slot": "hover-card-portal", children: _jsx(PreviewCardPrimitive.Positioner, { align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, className: "isolate z-50", children: _jsx(PreviewCardPrimitive.Popup, { "data-slot": "hover-card-content", className: cn("z-50 w-64 origin-(--transform-origin) rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className), ...props }) }) }));
|
|
@@ -9,7 +9,9 @@ declare function InputGroupAddon({ className, align, ...props }: React.Component
|
|
|
9
9
|
declare const inputGroupButtonVariants: (props?: ({
|
|
10
10
|
size?: "xs" | "sm" | "icon-xs" | "icon-sm" | null | undefined;
|
|
11
11
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
|
-
declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, "size"> & VariantProps<typeof inputGroupButtonVariants>
|
|
12
|
+
declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, "size" | "type"> & VariantProps<typeof inputGroupButtonVariants> & {
|
|
13
|
+
type?: "button" | "submit" | "reset";
|
|
14
|
+
}): React.JSX.Element;
|
|
13
15
|
declare function InputGroupText({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
|
|
14
16
|
declare function InputGroupInput({ className, ...props }: React.ComponentProps<"input">): React.JSX.Element;
|
|
15
17
|
declare function InputGroupTextarea({ className, ...props }: React.ComponentProps<"textarea">): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["../../src/components/input-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAI5C,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,
|
|
1
|
+
{"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["../../src/components/input-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAI5C,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAYvE;AAED,QAAA,MAAM,uBAAuB;;8EAmB5B,CAAA;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,qBAgB5E;AAED,QAAA,MAAM,wBAAwB;;8EAgB7B,CAAA;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,IAAe,EACf,OAAiB,EACjB,IAAW,EACX,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,GAC3D,YAAY,CAAC,OAAO,wBAAwB,CAAC,GAAG;IAC9C,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;CACrC,qBAUF;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAU5E;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,qBAW/B;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,qBAWlC;AAED,OAAO,EACL,UAAU,EACV,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,eAAe,EACf,kBAAkB,GACnB,CAAA"}
|
|
@@ -6,21 +6,15 @@ import { Button } from "./button.js";
|
|
|
6
6
|
import { Input } from "./input.js";
|
|
7
7
|
import { Textarea } from "./textarea.js";
|
|
8
8
|
function InputGroup({ className, ...props }) {
|
|
9
|
-
return (_jsx("div", { "data-slot": "input-group", role: "group", className: cn("group/input-group relative flex w-full items-center rounded-
|
|
10
|
-
// Variants based on alignment.
|
|
11
|
-
"has-[>[data-align=inline-start]]:[&>input]:pl-2", "has-[>[data-align=inline-end]]:[&>input]:pr-2", "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3", "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3",
|
|
12
|
-
// Focus state.
|
|
13
|
-
"has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-[3px] has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50",
|
|
14
|
-
// Error state.
|
|
15
|
-
"has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-destructive/20", className), ...props }));
|
|
9
|
+
return (_jsx("div", { "data-slot": "input-group", role: "group", className: cn("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 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", className), ...props }));
|
|
16
10
|
}
|
|
17
11
|
const inputGroupAddonVariants = cva("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
|
|
18
12
|
variants: {
|
|
19
13
|
align: {
|
|
20
|
-
"inline-start": "order-first pl-
|
|
21
|
-
"inline-end": "order-last pr-
|
|
22
|
-
"block-start": "order-first w-full justify-start px-
|
|
23
|
-
"block-end": "order-last w-full justify-start px-
|
|
14
|
+
"inline-start": "order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
|
|
15
|
+
"inline-end": "order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]",
|
|
16
|
+
"block-start": "order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2",
|
|
17
|
+
"block-end": "order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2",
|
|
24
18
|
},
|
|
25
19
|
},
|
|
26
20
|
defaultVariants: {
|
|
@@ -38,9 +32,9 @@ function InputGroupAddon({ className, align = "inline-start", ...props }) {
|
|
|
38
32
|
const inputGroupButtonVariants = cva("flex items-center gap-2 text-sm shadow-none", {
|
|
39
33
|
variants: {
|
|
40
34
|
size: {
|
|
41
|
-
xs: "h-6 gap-1 rounded-[calc(var(--radius)-
|
|
42
|
-
sm: "
|
|
43
|
-
"icon-xs": "size-6 rounded-[calc(var(--radius)-
|
|
35
|
+
xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
|
|
36
|
+
sm: "",
|
|
37
|
+
"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
|
|
44
38
|
"icon-sm": "size-8 p-0 has-[>svg]:p-0",
|
|
45
39
|
},
|
|
46
40
|
},
|
|
@@ -55,9 +49,9 @@ function InputGroupText({ className, ...props }) {
|
|
|
55
49
|
return (_jsx("span", { className: cn("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className), ...props }));
|
|
56
50
|
}
|
|
57
51
|
function InputGroupInput({ className, ...props }) {
|
|
58
|
-
return (_jsx(Input, { "data-slot": "input-group-control", className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0", className), ...props }));
|
|
52
|
+
return (_jsx(Input, { "data-slot": "input-group-control", className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0", className), ...props }));
|
|
59
53
|
}
|
|
60
54
|
function InputGroupTextarea({ className, ...props }) {
|
|
61
|
-
return (_jsx(Textarea, { "data-slot": "input-group-control", className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-
|
|
55
|
+
return (_jsx(Textarea, { "data-slot": "input-group-control", className: cn("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", className), ...props }));
|
|
62
56
|
}
|
|
63
57
|
export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-otp.d.ts","sourceRoot":"","sources":["../../src/components/input-otp.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAmB,MAAM,WAAW,CAAA;AAKrD,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,kBAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,GAAG;IACzC,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,
|
|
1
|
+
{"version":3,"file":"input-otp.d.ts","sourceRoot":"","sources":["../../src/components/input-otp.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAmB,MAAM,WAAW,CAAA;AAKrD,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,kBAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,GAAG;IACzC,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,qBAaA;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW1E;AAED,iBAAS,YAAY,CAAC,EACpB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAA;CACd,qBAsBA;AAED,iBAAS,iBAAiB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAYnE;AAED,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,CAAA"}
|
|
@@ -2,20 +2,20 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { OTPInput, OTPInputContext } from "input-otp";
|
|
5
|
-
import { MinusIcon } from "lucide-react";
|
|
6
5
|
import { cn } from "../lib/utils.js";
|
|
6
|
+
import { MinusIcon } from "lucide-react";
|
|
7
7
|
function InputOTP({ className, containerClassName, ...props }) {
|
|
8
|
-
return (_jsx(OTPInput, { "data-slot": "input-otp", containerClassName: cn("flex items-center
|
|
8
|
+
return (_jsx(OTPInput, { "data-slot": "input-otp", containerClassName: cn("cn-input-otp flex items-center has-disabled:opacity-50", containerClassName), spellCheck: false, className: cn("disabled:cursor-not-allowed", className), ...props }));
|
|
9
9
|
}
|
|
10
10
|
function InputOTPGroup({ className, ...props }) {
|
|
11
|
-
return (_jsx("div", { "data-slot": "input-otp-group", className: cn("flex items-center", className), ...props }));
|
|
11
|
+
return (_jsx("div", { "data-slot": "input-otp-group", className: cn("flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20", className), ...props }));
|
|
12
12
|
}
|
|
13
13
|
function InputOTPSlot({ index, className, ...props }) {
|
|
14
14
|
const inputOTPContext = React.useContext(OTPInputContext);
|
|
15
15
|
const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
|
|
16
|
-
return (_jsxs("div", { "data-slot": "input-otp-slot", "data-active": isActive, className: cn("relative flex
|
|
16
|
+
return (_jsxs("div", { "data-slot": "input-otp-slot", "data-active": isActive, className: cn("relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20", className), ...props, children: [char, hasFakeCaret && (_jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: _jsx("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }) }))] }));
|
|
17
17
|
}
|
|
18
18
|
function InputOTPSeparator({ ...props }) {
|
|
19
|
-
return (_jsx("div", { "data-slot": "input-otp-separator", role: "separator", ...props, children: _jsx(MinusIcon, {}) }));
|
|
19
|
+
return (_jsx("div", { "data-slot": "input-otp-separator", className: "flex items-center [&_svg:not([class*='size-'])]:size-4", role: "separator", ...props, children: _jsx(MinusIcon, {}) }));
|
|
20
20
|
}
|
|
21
21
|
export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/components/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/components/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,qBAY1E;AAED,OAAO,EAAE,KAAK,EAAE,CAAA"}
|
package/dist/components/input.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Input as InputPrimitive } from "@base-ui/react/input";
|
|
2
3
|
import { cn } from "../lib/utils.js";
|
|
3
4
|
function Input({ className, type, ...props }) {
|
|
4
|
-
return (_jsx(
|
|
5
|
+
return (_jsx(InputPrimitive, { type: type, "data-slot": "input", className: cn("h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm", className), ...props }));
|
|
5
6
|
}
|
|
6
7
|
export { Input };
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
+
import { useRender } from "@base-ui/react/use-render";
|
|
2
3
|
import { type VariantProps } from "class-variance-authority";
|
|
3
4
|
import { Separator } from "./separator";
|
|
4
5
|
declare function ItemGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
5
6
|
declare function ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): React.JSX.Element;
|
|
6
7
|
declare const itemVariants: (props?: ({
|
|
7
8
|
variant?: "default" | "outline" | "muted" | null | undefined;
|
|
8
|
-
size?: "default" | "sm" | null | undefined;
|
|
9
|
+
size?: "default" | "xs" | "sm" | null | undefined;
|
|
9
10
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
|
-
declare function Item({ className, variant, size,
|
|
11
|
-
asChild?: boolean;
|
|
12
|
-
}): React.JSX.Element;
|
|
11
|
+
declare function Item({ className, variant, size, render, ...props }: useRender.ComponentProps<"div"> & VariantProps<typeof itemVariants>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
|
|
13
12
|
declare const itemMediaVariants: (props?: ({
|
|
14
13
|
variant?: "image" | "default" | "icon" | null | undefined;
|
|
15
14
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../src/components/item.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../src/components/item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAElD,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAYtE;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,qBASxC;AAED,QAAA,MAAM,YAAY;;;8EAoBjB,CAAA;AAED,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,0EAgBrE;AAED,QAAA,MAAM,iBAAiB;;8EAetB,CAAA;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,qBAStE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWxE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWtE;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,qBAW1E;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWvE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWvE;AAED,OAAO,EACL,IAAI,EACJ,SAAS,EACT,WAAW,EACX,WAAW,EACX,SAAS,EACT,aAAa,EACb,SAAS,EACT,eAAe,EACf,UAAU,EACV,UAAU,GACX,CAAA"}
|
package/dist/components/item.js
CHANGED
|
@@ -1,25 +1,26 @@
|
|
|
1
|
-
"use client";
|
|
2
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { mergeProps } from "@base-ui/react/merge-props";
|
|
3
|
+
import { useRender } from "@base-ui/react/use-render";
|
|
3
4
|
import { cva } from "class-variance-authority";
|
|
4
|
-
import { Slot } from "../lib/slot.js";
|
|
5
5
|
import { cn } from "../lib/utils.js";
|
|
6
6
|
import { Separator } from "./separator.js";
|
|
7
7
|
function ItemGroup({ className, ...props }) {
|
|
8
|
-
return (_jsx("div", { role: "list", "data-slot": "item-group", className: cn("group/item-group flex flex-col", className), ...props }));
|
|
8
|
+
return (_jsx("div", { role: "list", "data-slot": "item-group", className: cn("group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", className), ...props }));
|
|
9
9
|
}
|
|
10
10
|
function ItemSeparator({ className, ...props }) {
|
|
11
|
-
return (_jsx(Separator, { "data-slot": "item-separator", orientation: "horizontal", className: cn("my-
|
|
11
|
+
return (_jsx(Separator, { "data-slot": "item-separator", orientation: "horizontal", className: cn("my-2", className), ...props }));
|
|
12
12
|
}
|
|
13
|
-
const itemVariants = cva("group/item flex flex-wrap items-center rounded-
|
|
13
|
+
const itemVariants = cva("group/item flex w-full flex-wrap items-center rounded-lg border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors [a]:hover:bg-muted", {
|
|
14
14
|
variants: {
|
|
15
15
|
variant: {
|
|
16
|
-
default: "
|
|
16
|
+
default: "border-transparent",
|
|
17
17
|
outline: "border-border",
|
|
18
|
-
muted: "bg-muted/50",
|
|
18
|
+
muted: "border-transparent bg-muted/50",
|
|
19
19
|
},
|
|
20
20
|
size: {
|
|
21
|
-
default: "gap-
|
|
22
|
-
sm: "gap-2.5 px-
|
|
21
|
+
default: "gap-2.5 px-3 py-2.5",
|
|
22
|
+
sm: "gap-2.5 px-3 py-2.5",
|
|
23
|
+
xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0",
|
|
23
24
|
},
|
|
24
25
|
},
|
|
25
26
|
defaultVariants: {
|
|
@@ -27,16 +28,26 @@ const itemVariants = cva("group/item flex flex-wrap items-center rounded-md bord
|
|
|
27
28
|
size: "default",
|
|
28
29
|
},
|
|
29
30
|
});
|
|
30
|
-
function Item({ className, variant = "default", size = "default",
|
|
31
|
-
|
|
32
|
-
|
|
31
|
+
function Item({ className, variant = "default", size = "default", render, ...props }) {
|
|
32
|
+
return useRender({
|
|
33
|
+
defaultTagName: "div",
|
|
34
|
+
props: mergeProps({
|
|
35
|
+
className: cn(itemVariants({ variant, size, className })),
|
|
36
|
+
}, props),
|
|
37
|
+
render,
|
|
38
|
+
state: {
|
|
39
|
+
slot: "item",
|
|
40
|
+
variant,
|
|
41
|
+
size,
|
|
42
|
+
},
|
|
43
|
+
});
|
|
33
44
|
}
|
|
34
|
-
const itemMediaVariants = cva("flex shrink-0 items-center justify-center gap-2 group-has-
|
|
45
|
+
const itemMediaVariants = cva("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
|
|
35
46
|
variants: {
|
|
36
47
|
variant: {
|
|
37
48
|
default: "bg-transparent",
|
|
38
|
-
icon: "
|
|
39
|
-
image: "size-10 overflow-hidden rounded-sm [&_img]:size-full [&_img]:object-cover",
|
|
49
|
+
icon: "[&_svg:not([class*='size-'])]:size-4",
|
|
50
|
+
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",
|
|
40
51
|
},
|
|
41
52
|
},
|
|
42
53
|
defaultVariants: {
|
|
@@ -47,13 +58,13 @@ function ItemMedia({ className, variant = "default", ...props }) {
|
|
|
47
58
|
return (_jsx("div", { "data-slot": "item-media", "data-variant": variant, className: cn(itemMediaVariants({ variant, className })), ...props }));
|
|
48
59
|
}
|
|
49
60
|
function ItemContent({ className, ...props }) {
|
|
50
|
-
return (_jsx("div", { "data-slot": "item-content", className: cn("flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none", className), ...props }));
|
|
61
|
+
return (_jsx("div", { "data-slot": "item-content", className: cn("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className), ...props }));
|
|
51
62
|
}
|
|
52
63
|
function ItemTitle({ className, ...props }) {
|
|
53
|
-
return (_jsx("div", { "data-slot": "item-title", className: cn("flex w-fit items-center gap-2 text-sm leading-snug font-medium", className), ...props }));
|
|
64
|
+
return (_jsx("div", { "data-slot": "item-title", className: cn("line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4", className), ...props }));
|
|
54
65
|
}
|
|
55
66
|
function ItemDescription({ className, ...props }) {
|
|
56
|
-
return (_jsx("p", { "data-slot": "item-description", className: cn("line-clamp-2 text-sm leading-normal font-normal text-
|
|
67
|
+
return (_jsx("p", { "data-slot": "item-description", className: cn("line-clamp-2 text-left text-sm leading-normal font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
|
|
57
68
|
}
|
|
58
69
|
function ItemActions({ className, ...props }) {
|
|
59
70
|
return (_jsx("div", { "data-slot": "item-actions", className: cn("flex items-center gap-2", className), ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kbd.d.ts","sourceRoot":"","sources":["../../src/components/kbd.tsx"],"names":[],"mappings":"AAEA,iBAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+
|
|
1
|
+
{"version":3,"file":"kbd.d.ts","sourceRoot":"","sources":["../../src/components/kbd.tsx"],"names":[],"mappings":"AAEA,iBAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWhE;AAED,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAQrE;AAED,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAA"}
|
package/dist/components/kbd.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "../lib/utils.js";
|
|
3
3
|
function Kbd({ className, ...props }) {
|
|
4
|
-
return (_jsx("kbd", { "data-slot": "kbd", className: cn("pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-muted px-1 font-sans text-xs font-medium text-muted-foreground select-none
|
|
4
|
+
return (_jsx("kbd", { "data-slot": "kbd", className: cn("pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-muted px-1 font-sans text-xs font-medium text-muted-foreground select-none in-data-[slot=tooltip-content]:bg-background/20 in-data-[slot=tooltip-content]:text-background [&_svg:not([class*='size-'])]:size-3", className), ...props }));
|
|
5
5
|
}
|
|
6
6
|
function KbdGroup({ className, ...props }) {
|
|
7
7
|
return (_jsx("kbd", { "data-slot": "kbd-group", className: cn("inline-flex items-center gap-1", className), ...props }));
|