@brokenrubik/ui 0.0.0-stage → 0.1.0
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/README.md +264 -2
- package/dist/components/accordion.d.ts +13 -0
- package/dist/components/accordion.d.ts.map +1 -0
- package/dist/components/accordion.js +25 -0
- package/dist/components/accordion.js.map +1 -0
- package/dist/components/alert-dialog.d.ts +21 -0
- package/dist/components/alert-dialog.d.ts.map +1 -0
- package/dist/components/alert-dialog.js +46 -0
- package/dist/components/alert-dialog.js.map +1 -0
- package/dist/components/alert.d.ts +24 -0
- package/dist/components/alert.d.ts.map +1 -0
- package/dist/components/alert.js +42 -0
- package/dist/components/alert.js.map +1 -0
- package/dist/components/avatar.d.ts +27 -0
- package/dist/components/avatar.d.ts.map +1 -0
- package/dist/components/avatar.js +53 -0
- package/dist/components/avatar.js.map +1 -0
- package/dist/components/badge.d.ts +21 -0
- package/dist/components/badge.d.ts.map +1 -0
- package/dist/components/badge.js +40 -0
- package/dist/components/badge.js.map +1 -0
- package/dist/components/button.d.ts +18 -0
- package/dist/components/button.d.ts.map +1 -0
- package/dist/components/button.js +39 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/calendar.d.ts +13 -0
- package/dist/components/calendar.d.ts.map +1 -0
- package/dist/components/calendar.js +68 -0
- package/dist/components/calendar.js.map +1 -0
- package/dist/components/card.d.ts +15 -0
- package/dist/components/card.d.ts.map +1 -0
- package/dist/components/card.js +31 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/checkbox.d.ts +6 -0
- package/dist/components/checkbox.d.ts.map +1 -0
- package/dist/components/checkbox.js +12 -0
- package/dist/components/checkbox.js.map +1 -0
- package/dist/components/command.d.ts +24 -0
- package/dist/components/command.d.ts.map +1 -0
- package/dist/components/command.js +41 -0
- package/dist/components/command.js.map +1 -0
- package/dist/components/date-picker.d.ts +24 -0
- package/dist/components/date-picker.d.ts.map +1 -0
- package/dist/components/date-picker.js +18 -0
- package/dist/components/date-picker.js.map +1 -0
- package/dist/components/dialog.d.ts +23 -0
- package/dist/components/dialog.d.ts.map +1 -0
- package/dist/components/dialog.js +45 -0
- package/dist/components/dialog.js.map +1 -0
- package/dist/components/dropdown-menu.d.ts +34 -0
- package/dist/components/dropdown-menu.d.ts.map +1 -0
- package/dist/components/dropdown-menu.js +61 -0
- package/dist/components/dropdown-menu.js.map +1 -0
- package/dist/components/empty-state.d.ts +13 -0
- package/dist/components/empty-state.d.ts.map +1 -0
- package/dist/components/empty-state.js +25 -0
- package/dist/components/empty-state.js.map +1 -0
- package/dist/components/field.d.ts +24 -0
- package/dist/components/field.d.ts.map +1 -0
- package/dist/components/field.js +34 -0
- package/dist/components/field.js.map +1 -0
- package/dist/components/input.d.ts +17 -0
- package/dist/components/input.d.ts.map +1 -0
- package/dist/components/input.js +18 -0
- package/dist/components/input.js.map +1 -0
- package/dist/components/kbd.d.ts +14 -0
- package/dist/components/kbd.d.ts.map +1 -0
- package/dist/components/kbd.js +31 -0
- package/dist/components/kbd.js.map +1 -0
- package/dist/components/label.d.ts +6 -0
- package/dist/components/label.d.ts.map +1 -0
- package/dist/components/label.js +11 -0
- package/dist/components/label.js.map +1 -0
- package/dist/components/pagination.d.ts +18 -0
- package/dist/components/pagination.d.ts.map +1 -0
- package/dist/components/pagination.js +33 -0
- package/dist/components/pagination.js.map +1 -0
- package/dist/components/popover.d.ts +12 -0
- package/dist/components/popover.d.ts.map +1 -0
- package/dist/components/popover.js +29 -0
- package/dist/components/popover.js.map +1 -0
- package/dist/components/progress.d.ts +17 -0
- package/dist/components/progress.d.ts.map +1 -0
- package/dist/components/progress.js +26 -0
- package/dist/components/progress.js.map +1 -0
- package/dist/components/radio-group.d.ts +7 -0
- package/dist/components/radio-group.d.ts.map +1 -0
- package/dist/components/radio-group.js +14 -0
- package/dist/components/radio-group.js.map +1 -0
- package/dist/components/select.d.ts +20 -0
- package/dist/components/select.d.ts.map +1 -0
- package/dist/components/select.js +46 -0
- package/dist/components/select.js.map +1 -0
- package/dist/components/separator.d.ts +6 -0
- package/dist/components/separator.d.ts.map +1 -0
- package/dist/components/separator.js +11 -0
- package/dist/components/separator.js.map +1 -0
- package/dist/components/sheet.d.ts +19 -0
- package/dist/components/sheet.d.ts.map +1 -0
- package/dist/components/sheet.js +47 -0
- package/dist/components/sheet.js.map +1 -0
- package/dist/components/skeleton.d.ts +5 -0
- package/dist/components/skeleton.d.ts.map +1 -0
- package/dist/components/skeleton.js +9 -0
- package/dist/components/skeleton.js.map +1 -0
- package/dist/components/sonner.d.ts +13 -0
- package/dist/components/sonner.d.ts.map +1 -0
- package/dist/components/sonner.js +40 -0
- package/dist/components/sonner.js.map +1 -0
- package/dist/components/switch.d.ts +6 -0
- package/dist/components/switch.d.ts.map +1 -0
- package/dist/components/switch.js +11 -0
- package/dist/components/switch.js.map +1 -0
- package/dist/components/tabs.d.ts +13 -0
- package/dist/components/tabs.d.ts.map +1 -0
- package/dist/components/tabs.js +24 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/textarea.d.ts +5 -0
- package/dist/components/textarea.d.ts.map +1 -0
- package/dist/components/textarea.js +10 -0
- package/dist/components/textarea.js.map +1 -0
- package/dist/components/toggle-group.d.ts +11 -0
- package/dist/components/toggle-group.d.ts.map +1 -0
- package/dist/components/toggle-group.js +18 -0
- package/dist/components/toggle-group.js.map +1 -0
- package/dist/components/tooltip.d.ts +13 -0
- package/dist/components/tooltip.d.ts.map +1 -0
- package/dist/components/tooltip.js +24 -0
- package/dist/components/tooltip.js.map +1 -0
- package/dist/index.d.ts +34 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +36 -0
- package/dist/index.js.map +1 -0
- package/dist/lib/tone.d.ts +8 -0
- package/dist/lib/tone.d.ts.map +1 -0
- package/dist/lib/tone.js +14 -0
- package/dist/lib/tone.js.map +1 -0
- package/dist/lib/utils.d.ts +20 -0
- package/dist/lib/utils.d.ts.map +1 -0
- package/dist/lib/utils.js +40 -0
- package/dist/lib/utils.js.map +1 -0
- package/dist/styles/base.css +37 -0
- package/dist/styles/fonts.css +16 -0
- package/dist/styles/styles.css +14 -0
- package/dist/styles/theme.css +170 -0
- package/dist/styles/tokens.css +228 -0
- package/docs/design-handoff.md +112 -0
- package/docs/figma-vs-tailwind.md +135 -0
- package/docs/visual-testing.md +156 -0
- package/package.json +96 -4
- package/src/components/accordion.tsx +66 -0
- package/src/components/alert-dialog.tsx +139 -0
- package/src/components/alert.tsx +87 -0
- package/src/components/avatar.tsx +105 -0
- package/src/components/badge.tsx +63 -0
- package/src/components/button.tsx +70 -0
- package/src/components/calendar.tsx +131 -0
- package/src/components/card.tsx +72 -0
- package/src/components/checkbox.tsx +31 -0
- package/src/components/command.tsx +149 -0
- package/src/components/date-picker.tsx +86 -0
- package/src/components/dialog.tsx +126 -0
- package/src/components/dropdown-menu.tsx +225 -0
- package/src/components/empty-state.tsx +63 -0
- package/src/components/field.tsx +79 -0
- package/src/components/input.tsx +49 -0
- package/src/components/kbd.tsx +48 -0
- package/src/components/label.tsx +22 -0
- package/src/components/pagination.tsx +94 -0
- package/src/components/popover.tsx +65 -0
- package/src/components/progress.tsx +52 -0
- package/src/components/radio-group.tsx +42 -0
- package/src/components/select.tsx +167 -0
- package/src/components/separator.tsx +29 -0
- package/src/components/sheet.tsx +112 -0
- package/src/components/skeleton.tsx +16 -0
- package/src/components/sonner.tsx +58 -0
- package/src/components/switch.tsx +27 -0
- package/src/components/tabs.tsx +56 -0
- package/src/components/textarea.tsx +17 -0
- package/src/components/toggle-group.tsx +42 -0
- package/src/components/tooltip.tsx +55 -0
- package/src/index.ts +35 -0
- package/src/lib/tone.ts +16 -0
- package/src/lib/utils.ts +46 -0
- package/src/styles/base.css +37 -0
- package/src/styles/fonts.css +16 -0
- package/src/styles/styles.css +14 -0
- package/src/styles/theme.css +170 -0
- package/src/styles/tokens.css +228 -0
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Select as SelectPrimitive } from 'radix-ui';
|
|
5
|
+
import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react';
|
|
6
|
+
import { cn } from '../lib/utils.js';
|
|
7
|
+
import { controlClassName } from './input.js';
|
|
8
|
+
import { menuContentClassName, menuItemClassName } from './dropdown-menu.js';
|
|
9
|
+
/**
|
|
10
|
+
* Figma: Components · Base › Select (2083:40). The trigger looks like Input (32 px,
|
|
11
|
+
* `input` border, ring on focus) with a muted chevron; the list is a Dropdown Menu panel.
|
|
12
|
+
*/
|
|
13
|
+
function Select(props) {
|
|
14
|
+
return _jsx(SelectPrimitive.Root, { "data-slot": "select", ...props });
|
|
15
|
+
}
|
|
16
|
+
function SelectGroup(props) {
|
|
17
|
+
return _jsx(SelectPrimitive.Group, { "data-slot": "select-group", ...props });
|
|
18
|
+
}
|
|
19
|
+
function SelectValue(props) {
|
|
20
|
+
return _jsx(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
|
|
21
|
+
}
|
|
22
|
+
function SelectTrigger({ className, size = 'default', children, ...props }) {
|
|
23
|
+
return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn(controlClassName, "flex h-8 items-center justify-between gap-2 whitespace-nowrap px-2.5 data-[size=sm]:h-7 data-[placeholder]:text-muted-foreground *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDownIcon, { className: "size-4 opacity-100" }) })] }));
|
|
24
|
+
}
|
|
25
|
+
function SelectContent({ className, children, position = 'popper', align = 'start', ...props }) {
|
|
26
|
+
return (_jsx(SelectPrimitive.Portal, { children: _jsxs(SelectPrimitive.Content, { "data-slot": "select-content", className: cn(menuContentClassName, 'relative max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto', position === 'popper' &&
|
|
27
|
+
'w-full min-w-(--radix-select-trigger-width) data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', className), position: position, align: align, ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.Viewport, { className: cn(position === 'popper' &&
|
|
28
|
+
'h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width) scroll-my-1'), children: children }), _jsx(SelectScrollDownButton, {})] }) }));
|
|
29
|
+
}
|
|
30
|
+
function SelectLabel({ className, ...props }) {
|
|
31
|
+
return (_jsx(SelectPrimitive.Label, { "data-slot": "select-label", className: cn('px-2 py-1.5 text-body-sm font-medium text-muted-foreground', className), ...props }));
|
|
32
|
+
}
|
|
33
|
+
function SelectItem({ className, children, ...props }) {
|
|
34
|
+
return (_jsxs(SelectPrimitive.Item, { "data-slot": "select-item", className: cn(menuItemClassName, 'w-full pr-8', className), ...props, children: [_jsx("span", { className: "absolute right-2 flex size-4 items-center justify-center", children: _jsx(SelectPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "size-4 !text-foreground" }) }) }), _jsx(SelectPrimitive.ItemText, { children: children })] }));
|
|
35
|
+
}
|
|
36
|
+
function SelectSeparator({ className, ...props }) {
|
|
37
|
+
return (_jsx(SelectPrimitive.Separator, { "data-slot": "select-separator", className: cn('pointer-events-none -mx-1 my-1 h-px bg-border', className), ...props }));
|
|
38
|
+
}
|
|
39
|
+
function SelectScrollUpButton({ className, ...props }) {
|
|
40
|
+
return (_jsx(SelectPrimitive.ScrollUpButton, { "data-slot": "select-scroll-up-button", className: cn('flex cursor-default items-center justify-center py-1 text-muted-foreground', className), ...props, children: _jsx(ChevronUpIcon, { className: "size-4" }) }));
|
|
41
|
+
}
|
|
42
|
+
function SelectScrollDownButton({ className, ...props }) {
|
|
43
|
+
return (_jsx(SelectPrimitive.ScrollDownButton, { "data-slot": "select-scroll-down-button", className: cn('flex cursor-default items-center justify-center py-1 text-muted-foreground', className), ...props, children: _jsx(ChevronDownIcon, { className: "size-4" }) }));
|
|
44
|
+
}
|
|
45
|
+
export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, };
|
|
46
|
+
//# sourceMappingURL=select.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/components/select.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Separator as SeparatorPrimitive } from 'radix-ui';
|
|
3
|
+
/** Figma: Components · Base › Separator (2085:227). 1 px `border` line. */
|
|
4
|
+
declare function Separator({ className, orientation, decorative, ...props }: React.ComponentProps<typeof SeparatorPrimitive.Root>): React.JSX.Element;
|
|
5
|
+
export { Separator };
|
|
6
|
+
//# sourceMappingURL=separator.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"separator.d.ts","sourceRoot":"","sources":["../../src/components/separator.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAI3D,2EAA2E;AAC3E,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,WAA0B,EAC1B,UAAiB,EACjB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,qBAatD;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Separator as SeparatorPrimitive } from 'radix-ui';
|
|
5
|
+
import { cn } from '../lib/utils.js';
|
|
6
|
+
/** Figma: Components · Base › Separator (2085:227). 1 px `border` line. */
|
|
7
|
+
function Separator({ className, orientation = 'horizontal', decorative = true, ...props }) {
|
|
8
|
+
return (_jsx(SeparatorPrimitive.Root, { "data-slot": "separator", decorative: decorative, orientation: orientation, className: cn('shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px', className), ...props }));
|
|
9
|
+
}
|
|
10
|
+
export { Separator };
|
|
11
|
+
//# sourceMappingURL=separator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"separator.js","sourceRoot":"","sources":["../../src/components/separator.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAE3D,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC,2EAA2E;AAC3E,SAAS,SAAS,CAAC,EACjB,SAAS,EACT,WAAW,GAAG,YAAY,EAC1B,UAAU,GAAG,IAAI,EACjB,GAAG,KAAK,EAC6C;IACrD,OAAO,CACL,KAAC,kBAAkB,CAAC,IAAI,iBACZ,WAAW,EACrB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,EAAE,CACX,gKAAgK,EAChK,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Dialog as SheetPrimitive } from 'radix-ui';
|
|
3
|
+
/**
|
|
4
|
+
* Figma: Components · Base › Sheet (2084:161), code `<Sheet side="right">`. 400 px panel,
|
|
5
|
+
* 24 px padding, 16 px gap, border on the open side, Shadow/lg. Header like Dialog.
|
|
6
|
+
*/
|
|
7
|
+
declare function Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>): React.JSX.Element;
|
|
8
|
+
declare function SheetTrigger(props: React.ComponentProps<typeof SheetPrimitive.Trigger>): React.JSX.Element;
|
|
9
|
+
declare function SheetClose(props: React.ComponentProps<typeof SheetPrimitive.Close>): React.JSX.Element;
|
|
10
|
+
declare function SheetContent({ className, children, side, showCloseButton, ...props }: React.ComponentProps<typeof SheetPrimitive.Content> & {
|
|
11
|
+
side?: 'top' | 'right' | 'bottom' | 'left';
|
|
12
|
+
showCloseButton?: boolean;
|
|
13
|
+
}): React.JSX.Element;
|
|
14
|
+
declare function SheetHeader({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
15
|
+
declare function SheetFooter({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
16
|
+
declare function SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>): React.JSX.Element;
|
|
17
|
+
declare function SheetDescription({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Description>): React.JSX.Element;
|
|
18
|
+
export { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription, };
|
|
19
|
+
//# sourceMappingURL=sheet.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../src/components/sheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,UAAU,CAAC;AAMpD;;;GAGG;AACH,iBAAS,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC,qBAErE;AAED,iBAAS,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,OAAO,CAAC,qBAE/E;AAED,iBAAS,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,KAAK,CAAC,qBAE3E;AAUD,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,IAAc,EACd,eAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,OAAO,CAAC,GAAG;IACvD,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,qBA+BA;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAExE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAIxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,KAAK,CAAC,qBAE7F;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,WAAW,CAAC,qBAQzD;AAED,OAAO,EACL,KAAK,EACL,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,WAAW,EACX,WAAW,EACX,UAAU,EACV,gBAAgB,GACjB,CAAC"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Dialog as SheetPrimitive } from 'radix-ui';
|
|
5
|
+
import { XIcon } from 'lucide-react';
|
|
6
|
+
import { cn } from '../lib/utils.js';
|
|
7
|
+
import { closeButtonClassName, overlayClassName } from './dialog.js';
|
|
8
|
+
/**
|
|
9
|
+
* Figma: Components · Base › Sheet (2084:161), code `<Sheet side="right">`. 400 px panel,
|
|
10
|
+
* 24 px padding, 16 px gap, border on the open side, Shadow/lg. Header like Dialog.
|
|
11
|
+
*/
|
|
12
|
+
function Sheet(props) {
|
|
13
|
+
return _jsx(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
|
|
14
|
+
}
|
|
15
|
+
function SheetTrigger(props) {
|
|
16
|
+
return _jsx(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
|
|
17
|
+
}
|
|
18
|
+
function SheetClose(props) {
|
|
19
|
+
return _jsx(SheetPrimitive.Close, { "data-slot": "sheet-close", ...props });
|
|
20
|
+
}
|
|
21
|
+
function SheetPortal(props) {
|
|
22
|
+
return _jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
|
|
23
|
+
}
|
|
24
|
+
function SheetOverlay({ className, ...props }) {
|
|
25
|
+
return _jsx(SheetPrimitive.Overlay, { "data-slot": "sheet-overlay", className: cn(overlayClassName, className), ...props });
|
|
26
|
+
}
|
|
27
|
+
function SheetContent({ className, children, side = 'right', showCloseButton = true, ...props }) {
|
|
28
|
+
return (_jsxs(SheetPortal, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Content, { "data-slot": "sheet-content", "data-side": side, className: cn('fixed z-50 flex flex-col gap-4 overflow-y-auto bg-background p-6 text-body text-foreground shadow-lg outline-none transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-200 data-[state=open]:animate-in data-[state=open]:duration-300', side === 'right' &&
|
|
29
|
+
'inset-y-0 right-0 h-full w-full border-l border-border data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:w-[400px]', side === 'left' &&
|
|
30
|
+
'inset-y-0 left-0 h-full w-full border-r border-border data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:w-[400px]', side === 'top' &&
|
|
31
|
+
'inset-x-0 top-0 h-auto border-b border-border data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top', side === 'bottom' &&
|
|
32
|
+
'inset-x-0 bottom-0 h-auto border-t border-border data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom', className), ...props, children: [children, showCloseButton && (_jsxs(SheetPrimitive.Close, { "data-slot": "sheet-close", className: cn(closeButtonClassName, 'absolute top-6 right-6'), children: [_jsx(XIcon, {}), _jsx("span", { className: "sr-only", children: "Close" })] }))] })] }));
|
|
33
|
+
}
|
|
34
|
+
function SheetHeader({ className, ...props }) {
|
|
35
|
+
return _jsx("div", { "data-slot": "sheet-header", className: cn('flex flex-col gap-1.5 pr-9', className), ...props });
|
|
36
|
+
}
|
|
37
|
+
function SheetFooter({ className, ...props }) {
|
|
38
|
+
return (_jsx("div", { "data-slot": "sheet-footer", className: cn('mt-auto flex justify-end gap-2', className), ...props }));
|
|
39
|
+
}
|
|
40
|
+
function SheetTitle({ className, ...props }) {
|
|
41
|
+
return _jsx(SheetPrimitive.Title, { "data-slot": "sheet-title", className: cn('text-page-title', className), ...props });
|
|
42
|
+
}
|
|
43
|
+
function SheetDescription({ className, ...props }) {
|
|
44
|
+
return (_jsx(SheetPrimitive.Description, { "data-slot": "sheet-description", className: cn('text-body text-muted-foreground', className), ...props }));
|
|
45
|
+
}
|
|
46
|
+
export { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription, };
|
|
47
|
+
//# sourceMappingURL=sheet.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sheet.js","sourceRoot":"","sources":["../../src/components/sheet.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
/** Figma: Components · Base › Skeleton (2085:214). Muted, 6 px radius (rounded-full for circles). */
|
|
3
|
+
declare function Skeleton({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
4
|
+
export { Skeleton };
|
|
5
|
+
//# sourceMappingURL=skeleton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../src/components/skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,qGAAqG;AACrG,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQrE;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { cn } from '../lib/utils.js';
|
|
4
|
+
/** Figma: Components · Base › Skeleton (2085:214). Muted, 6 px radius (rounded-full for circles). */
|
|
5
|
+
function Skeleton({ className, ...props }) {
|
|
6
|
+
return (_jsx("div", { "data-slot": "skeleton", className: cn('animate-pulse rounded-md bg-muted motion-reduce:animate-none', className), ...props }));
|
|
7
|
+
}
|
|
8
|
+
export { Skeleton };
|
|
9
|
+
//# sourceMappingURL=skeleton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"skeleton.js","sourceRoot":"","sources":["../../src/components/skeleton.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC,qGAAqG;AACrG,SAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACpE,OAAO,CACL,2BACY,UAAU,EACpB,SAAS,EAAE,EAAE,CAAC,8DAA8D,EAAE,SAAS,CAAC,KACpF,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { toast, type ToasterProps } from 'sonner';
|
|
3
|
+
/**
|
|
4
|
+
* Figma: Components · Base › Toast (2085:201), code `<Toaster>` (sonner). 360 px popover,
|
|
5
|
+
* 8 px radius, 12/12/12/16 px padding, Shadow/lg. Title Body/Default Medium, description
|
|
6
|
+
* Body/Small muted, action = small outline button. Success and error add a -strong icon.
|
|
7
|
+
*
|
|
8
|
+
* Mount <Toaster /> once. Call toast('Task moved', { description, action }) anywhere.
|
|
9
|
+
* `theme` follows the `.dark` class by default; pass theme="dark" | "light" to force it.
|
|
10
|
+
*/
|
|
11
|
+
declare function Toaster({ className, toastOptions, ...props }: ToasterProps): React.JSX.Element;
|
|
12
|
+
export { Toaster, toast };
|
|
13
|
+
//# sourceMappingURL=sonner.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sonner.d.ts","sourceRoot":"","sources":["../../src/components/sonner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAqB,KAAK,EAAE,KAAK,YAAY,EAAE,MAAM,QAAQ,CAAC;AAYrE;;;;;;;GAOG;AACH,iBAAS,OAAO,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,qBAgCnE;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Toaster as Sonner, toast } from 'sonner';
|
|
5
|
+
import { CircleAlertIcon, CircleCheckIcon, InfoIcon, Loader2Icon, TriangleAlertIcon, } from 'lucide-react';
|
|
6
|
+
import { cn } from '../lib/utils.js';
|
|
7
|
+
import { buttonVariants } from './button.js';
|
|
8
|
+
/**
|
|
9
|
+
* Figma: Components · Base › Toast (2085:201), code `<Toaster>` (sonner). 360 px popover,
|
|
10
|
+
* 8 px radius, 12/12/12/16 px padding, Shadow/lg. Title Body/Default Medium, description
|
|
11
|
+
* Body/Small muted, action = small outline button. Success and error add a -strong icon.
|
|
12
|
+
*
|
|
13
|
+
* Mount <Toaster /> once. Call toast('Task moved', { description, action }) anywhere.
|
|
14
|
+
* `theme` follows the `.dark` class by default; pass theme="dark" | "light" to force it.
|
|
15
|
+
*/
|
|
16
|
+
function Toaster({ className, toastOptions, ...props }) {
|
|
17
|
+
return (_jsx(Sonner, { className: cn('toaster group', className), icons: {
|
|
18
|
+
success: _jsx(CircleCheckIcon, { className: "size-4 text-success-strong" }),
|
|
19
|
+
info: _jsx(InfoIcon, { className: "size-4 text-primary-strong" }),
|
|
20
|
+
warning: _jsx(TriangleAlertIcon, { className: "size-4 text-warning-strong" }),
|
|
21
|
+
error: _jsx(CircleAlertIcon, { className: "size-4 text-destructive-strong" }),
|
|
22
|
+
loading: _jsx(Loader2Icon, { className: "size-4 animate-spin text-muted-foreground" }),
|
|
23
|
+
}, toastOptions: {
|
|
24
|
+
unstyled: true,
|
|
25
|
+
...toastOptions,
|
|
26
|
+
classNames: {
|
|
27
|
+
toast: 'group/toast flex w-[var(--width)] items-center gap-3 rounded-lg border border-border bg-popover py-3 pr-3 pl-4 text-popover-foreground shadow-lg font-sans',
|
|
28
|
+
content: 'flex min-w-0 flex-1 flex-col gap-0.5',
|
|
29
|
+
title: 'text-body font-medium text-foreground',
|
|
30
|
+
description: 'text-body-sm text-muted-foreground',
|
|
31
|
+
icon: 'flex size-4 shrink-0 items-center justify-center',
|
|
32
|
+
actionButton: cn(buttonVariants({ variant: 'outline', size: 'sm' }), 'shrink-0'),
|
|
33
|
+
cancelButton: cn(buttonVariants({ variant: 'ghost', size: 'sm' }), 'shrink-0'),
|
|
34
|
+
closeButton: 'absolute -top-2 -left-2 flex size-5 items-center justify-center rounded-full border border-border bg-popover text-muted-foreground hover:text-foreground',
|
|
35
|
+
...toastOptions?.classNames,
|
|
36
|
+
},
|
|
37
|
+
}, style: { '--width': '360px' }, ...props }));
|
|
38
|
+
}
|
|
39
|
+
export { Toaster, toast };
|
|
40
|
+
//# sourceMappingURL=sonner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sonner.js","sourceRoot":"","sources":["../../src/components/sonner.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,KAAK,EAAqB,MAAM,QAAQ,CAAC;AACrE,OAAO,EACL,eAAe,EACf,eAAe,EACf,QAAQ,EACR,WAAW,EACX,iBAAiB,GAClB,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE7C;;;;;;;GAOG;AACH,SAAS,OAAO,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,KAAK,EAAgB;IAClE,OAAO,CACL,KAAC,MAAM,IACL,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,EACzC,KAAK,EAAE;YACL,OAAO,EAAE,KAAC,eAAe,IAAC,SAAS,EAAC,4BAA4B,GAAG;YACnE,IAAI,EAAE,KAAC,QAAQ,IAAC,SAAS,EAAC,4BAA4B,GAAG;YACzD,OAAO,EAAE,KAAC,iBAAiB,IAAC,SAAS,EAAC,4BAA4B,GAAG;YACrE,KAAK,EAAE,KAAC,eAAe,IAAC,SAAS,EAAC,gCAAgC,GAAG;YACrE,OAAO,EAAE,KAAC,WAAW,IAAC,SAAS,EAAC,2CAA2C,GAAG;SAC/E,EACD,YAAY,EAAE;YACZ,QAAQ,EAAE,IAAI;YACd,GAAG,YAAY;YACf,UAAU,EAAE;gBACV,KAAK,EACH,4JAA4J;gBAC9J,OAAO,EAAE,sCAAsC;gBAC/C,KAAK,EAAE,uCAAuC;gBAC9C,WAAW,EAAE,oCAAoC;gBACjD,IAAI,EAAE,kDAAkD;gBACxD,YAAY,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,UAAU,CAAC;gBAChF,YAAY,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,UAAU,CAAC;gBAC9E,WAAW,EACT,0JAA0J;gBAC5J,GAAG,YAAY,EAAE,UAAU;aAC5B;SACF,EACD,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAyB,KAChD,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Switch as SwitchPrimitive } from 'radix-ui';
|
|
3
|
+
/** Figma: Components · Base › Switch (2007:47). 32×18 track (`input` off, `primary` on), 14 px thumb. */
|
|
4
|
+
declare function Switch({ className, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root>): React.JSX.Element;
|
|
5
|
+
export { Switch };
|
|
6
|
+
//# sourceMappingURL=switch.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AAIrD,yGAAyG;AACzG,iBAAS,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAgBzF;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Switch as SwitchPrimitive } from 'radix-ui';
|
|
5
|
+
import { cn } from '../lib/utils.js';
|
|
6
|
+
/** Figma: Components · Base › Switch (2007:47). 32×18 track (`input` off, `primary` on), 14 px thumb. */
|
|
7
|
+
function Switch({ className, ...props }) {
|
|
8
|
+
return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", className: cn('peer inline-flex h-[18px] w-8 shrink-0 items-center rounded-full px-0.5 transition-colors outline-none focus-visible:ring-3 focus-visible:ring-ring/40 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input', className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: "pointer-events-none block size-3.5 rounded-full bg-background shadow-xs ring-0 transition-transform data-[state=checked]:translate-x-3.5 data-[state=unchecked]:translate-x-0" }) }));
|
|
9
|
+
}
|
|
10
|
+
export { Switch };
|
|
11
|
+
//# sourceMappingURL=switch.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AAErD,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC,yGAAyG;AACzG,SAAS,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAqD;IACxF,OAAO,CACL,KAAC,eAAe,CAAC,IAAI,iBACT,QAAQ,EAClB,SAAS,EAAE,EAAE,CACX,wQAAwQ,EACxQ,SAAS,CACV,KACG,KAAK,YAET,KAAC,eAAe,CAAC,KAAK,iBACV,cAAc,EACxB,SAAS,EAAC,+KAA+K,GACzL,GACmB,CACxB,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Tabs as TabsPrimitive } from 'radix-ui';
|
|
3
|
+
/**
|
|
4
|
+
* Figma: Components · Base › Tab (2007:42). Underline tabs: 40 px high, 10 px side
|
|
5
|
+
* padding; active = foreground + Medium + 2 px violet underline; inactive = muted.
|
|
6
|
+
* For segmented controls (List / Board) use ToggleGroup.
|
|
7
|
+
*/
|
|
8
|
+
declare function Tabs({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Root>): React.JSX.Element;
|
|
9
|
+
declare function TabsList({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>): React.JSX.Element;
|
|
10
|
+
declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>): React.JSX.Element;
|
|
11
|
+
declare function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>): React.JSX.Element;
|
|
12
|
+
export { Tabs, TabsList, TabsTrigger, TabsContent };
|
|
13
|
+
//# sourceMappingURL=tabs.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,UAAU,CAAC;AAIjD;;;;GAIG;AACH,iBAAS,IAAI,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,qBAQrF;AAED,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,qBAQzF;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,qBAW/F;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,qBAQ/F;AAED,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Tabs as TabsPrimitive } from 'radix-ui';
|
|
5
|
+
import { cn } from '../lib/utils.js';
|
|
6
|
+
/**
|
|
7
|
+
* Figma: Components · Base › Tab (2007:42). Underline tabs: 40 px high, 10 px side
|
|
8
|
+
* padding; active = foreground + Medium + 2 px violet underline; inactive = muted.
|
|
9
|
+
* For segmented controls (List / Board) use ToggleGroup.
|
|
10
|
+
*/
|
|
11
|
+
function Tabs({ className, ...props }) {
|
|
12
|
+
return (_jsx(TabsPrimitive.Root, { "data-slot": "tabs", className: cn('flex flex-col gap-4', className), ...props }));
|
|
13
|
+
}
|
|
14
|
+
function TabsList({ className, ...props }) {
|
|
15
|
+
return (_jsx(TabsPrimitive.List, { "data-slot": "tabs-list", className: cn('flex items-center border-b border-border', className), ...props }));
|
|
16
|
+
}
|
|
17
|
+
function TabsTrigger({ className, ...props }) {
|
|
18
|
+
return (_jsx(TabsPrimitive.Trigger, { "data-slot": "tabs-trigger", className: cn("relative -mb-px inline-flex h-10 items-center justify-center gap-1.5 whitespace-nowrap px-2.5 text-body text-muted-foreground transition-colors outline-none after:absolute after:inset-x-0 after:bottom-0 after:h-0.5 after:bg-transparent hover:text-foreground focus-visible:ring-3 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:font-medium data-[state=active]:text-foreground data-[state=active]:after:bg-primary [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props }));
|
|
19
|
+
}
|
|
20
|
+
function TabsContent({ className, ...props }) {
|
|
21
|
+
return (_jsx(TabsPrimitive.Content, { "data-slot": "tabs-content", className: cn('flex-1 outline-none', className), ...props }));
|
|
22
|
+
}
|
|
23
|
+
export { Tabs, TabsList, TabsTrigger, TabsContent };
|
|
24
|
+
//# sourceMappingURL=tabs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,UAAU,CAAC;AAEjD,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC;;;;GAIG;AACH,SAAS,IAAI,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAmD;IACpF,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,iBACP,MAAM,EAChB,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,KAC3C,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAmD;IACxF,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,iBACP,WAAW,EACrB,SAAS,EAAE,EAAE,CAAC,0CAA0C,EAAE,SAAS,CAAC,KAChE,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAsD;IAC9F,OAAO,CACL,KAAC,aAAa,CAAC,OAAO,iBACV,cAAc,EACxB,SAAS,EAAE,EAAE,CACX,+hBAA+hB,EAC/hB,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAsD;IAC9F,OAAO,CACL,KAAC,aAAa,CAAC,OAAO,iBACV,cAAc,EACxB,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,KAC3C,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
/** Figma: Components · Base › Textarea (2083:56). 80 px minimum, 8/10 px padding. */
|
|
3
|
+
declare function Textarea({ className, ...props }: React.ComponentProps<'textarea'>): React.JSX.Element;
|
|
4
|
+
export { Textarea };
|
|
5
|
+
//# sourceMappingURL=textarea.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../src/components/textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,qFAAqF;AACrF,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,qBAQ1E;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { cn } from '../lib/utils.js';
|
|
4
|
+
import { controlClassName } from './input.js';
|
|
5
|
+
/** Figma: Components · Base › Textarea (2083:56). 80 px minimum, 8/10 px padding. */
|
|
6
|
+
function Textarea({ className, ...props }) {
|
|
7
|
+
return (_jsx("textarea", { "data-slot": "textarea", className: cn(controlClassName, 'field-sizing-content flex min-h-20 px-2.5 py-2', className), ...props }));
|
|
8
|
+
}
|
|
9
|
+
export { Textarea };
|
|
10
|
+
//# sourceMappingURL=textarea.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../src/components/textarea.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAE9C,qFAAqF;AACrF,SAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoC;IACzE,OAAO,CACL,gCACY,UAAU,EACpB,SAAS,EAAE,EAAE,CAAC,gBAAgB,EAAE,gDAAgD,EAAE,SAAS,CAAC,KACxF,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { ToggleGroup as ToggleGroupPrimitive } from 'radix-ui';
|
|
3
|
+
/**
|
|
4
|
+
* Figma: Components · Base › Toggle Group (2085:233) and Toggle Group Item (2085:232).
|
|
5
|
+
* A segmented control: 28 px muted track, 2 px padding; items 24 px, 5 px radius,
|
|
6
|
+
* Body/Small; "on" = background + Shadow/xs + Medium.
|
|
7
|
+
*/
|
|
8
|
+
declare function ToggleGroup({ className, ...props }: React.ComponentProps<typeof ToggleGroupPrimitive.Root>): React.JSX.Element;
|
|
9
|
+
declare function ToggleGroupItem({ className, ...props }: React.ComponentProps<typeof ToggleGroupPrimitive.Item>): React.JSX.Element;
|
|
10
|
+
export { ToggleGroup, ToggleGroupItem };
|
|
11
|
+
//# sourceMappingURL=toggle-group.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../src/components/toggle-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAI/D;;;;GAIG;AACH,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,qBAQxD;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,qBAWxD;AAED,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { ToggleGroup as ToggleGroupPrimitive } from 'radix-ui';
|
|
5
|
+
import { cn } from '../lib/utils.js';
|
|
6
|
+
/**
|
|
7
|
+
* Figma: Components · Base › Toggle Group (2085:233) and Toggle Group Item (2085:232).
|
|
8
|
+
* A segmented control: 28 px muted track, 2 px padding; items 24 px, 5 px radius,
|
|
9
|
+
* Body/Small; "on" = background + Shadow/xs + Medium.
|
|
10
|
+
*/
|
|
11
|
+
function ToggleGroup({ className, ...props }) {
|
|
12
|
+
return (_jsx(ToggleGroupPrimitive.Root, { "data-slot": "toggle-group", className: cn('inline-flex h-7 w-fit items-center gap-0.5 rounded-md bg-muted p-0.5', className), ...props }));
|
|
13
|
+
}
|
|
14
|
+
function ToggleGroupItem({ className, ...props }) {
|
|
15
|
+
return (_jsx(ToggleGroupPrimitive.Item, { "data-slot": "toggle-group-item", className: cn("inline-flex h-6 items-center justify-center gap-1.5 whitespace-nowrap rounded-sm px-2.5 text-body-sm text-muted-foreground transition-[color,background-color,box-shadow] outline-none hover:text-foreground focus-visible:ring-3 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-background data-[state=on]:font-medium data-[state=on]:text-foreground data-[state=on]:shadow-xs [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5", className), ...props }));
|
|
16
|
+
}
|
|
17
|
+
export { ToggleGroup, ToggleGroupItem };
|
|
18
|
+
//# sourceMappingURL=toggle-group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toggle-group.js","sourceRoot":"","sources":["../../src/components/toggle-group.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAE/D,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC;;;;GAIG;AACH,SAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EAC+C;IACvD,OAAO,CACL,KAAC,oBAAoB,CAAC,IAAI,iBACd,cAAc,EACxB,SAAS,EAAE,EAAE,CAAC,sEAAsE,EAAE,SAAS,CAAC,KAC5F,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EAC+C;IACvD,OAAO,CACL,KAAC,oBAAoB,CAAC,IAAI,iBACd,mBAAmB,EAC7B,SAAS,EAAE,EAAE,CACX,ufAAuf,EACvf,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Tooltip as TooltipPrimitive } from 'radix-ui';
|
|
3
|
+
/**
|
|
4
|
+
* Figma: Components · Base › Tooltip (2007:61). Inverted (foreground fill, background
|
|
5
|
+
* text), Body/Small, 4/8 px padding, 6 px radius, Shadow/md, no arrow.
|
|
6
|
+
* Put one <TooltipProvider> near the app root; <Tooltip> works without it too.
|
|
7
|
+
*/
|
|
8
|
+
declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>): React.JSX.Element;
|
|
9
|
+
declare function Tooltip(props: React.ComponentProps<typeof TooltipPrimitive.Root>): React.JSX.Element;
|
|
10
|
+
declare function TooltipTrigger(props: React.ComponentProps<typeof TooltipPrimitive.Trigger>): React.JSX.Element;
|
|
11
|
+
declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): React.JSX.Element;
|
|
12
|
+
export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
|
|
13
|
+
//# sourceMappingURL=tooltip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../src/components/tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAIvD;;;;GAIG;AACH,iBAAS,eAAe,CAAC,EACvB,aAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,QAAQ,CAAC,qBAExD;AAED,iBAAS,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,qBAMzE;AAED,iBAAS,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,qBAEnF;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,UAAc,EACd,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,qBAgBvD;AAED,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Tooltip as TooltipPrimitive } from 'radix-ui';
|
|
5
|
+
import { cn } from '../lib/utils.js';
|
|
6
|
+
/**
|
|
7
|
+
* Figma: Components · Base › Tooltip (2007:61). Inverted (foreground fill, background
|
|
8
|
+
* text), Body/Small, 4/8 px padding, 6 px radius, Shadow/md, no arrow.
|
|
9
|
+
* Put one <TooltipProvider> near the app root; <Tooltip> works without it too.
|
|
10
|
+
*/
|
|
11
|
+
function TooltipProvider({ delayDuration = 300, ...props }) {
|
|
12
|
+
return _jsx(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delayDuration: delayDuration, ...props });
|
|
13
|
+
}
|
|
14
|
+
function Tooltip(props) {
|
|
15
|
+
return (_jsx(TooltipProvider, { children: _jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) }));
|
|
16
|
+
}
|
|
17
|
+
function TooltipTrigger(props) {
|
|
18
|
+
return _jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
|
|
19
|
+
}
|
|
20
|
+
function TooltipContent({ className, sideOffset = 6, children, ...props }) {
|
|
21
|
+
return (_jsx(TooltipPrimitive.Portal, { children: _jsx(TooltipPrimitive.Content, { "data-slot": "tooltip-content", sideOffset: sideOffset, className: cn('z-50 w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) rounded-md border border-sidebar-border bg-foreground px-2 py-1 text-body-sm text-background shadow-md text-balance animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 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', className), ...props, children: children }) }));
|
|
22
|
+
}
|
|
23
|
+
export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
|
|
24
|
+
//# sourceMappingURL=tooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../src/components/tooltip.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEvD,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAErC;;;;GAIG;AACH,SAAS,eAAe,CAAC,EACvB,aAAa,GAAG,GAAG,EACnB,GAAG,KAAK,EAC+C;IACvD,OAAO,KAAC,gBAAgB,CAAC,QAAQ,iBAAW,kBAAkB,EAAC,aAAa,EAAE,aAAa,KAAM,KAAK,GAAI,CAAC;AAC7G,CAAC;AAED,SAAS,OAAO,CAAC,KAAyD;IACxE,OAAO,CACL,KAAC,eAAe,cACd,KAAC,gBAAgB,CAAC,IAAI,iBAAW,SAAS,KAAK,KAAK,GAAI,GACxC,CACnB,CAAC;AACJ,CAAC;AAED,SAAS,cAAc,CAAC,KAA4D;IAClF,OAAO,KAAC,gBAAgB,CAAC,OAAO,iBAAW,iBAAiB,KAAK,KAAK,GAAI,CAAC;AAC7E,CAAC;AAED,SAAS,cAAc,CAAC,EACtB,SAAS,EACT,UAAU,GAAG,CAAC,EACd,QAAQ,EACR,GAAG,KAAK,EAC8C;IACtD,OAAO,CACL,KAAC,gBAAgB,CAAC,MAAM,cACtB,KAAC,gBAAgB,CAAC,OAAO,iBACb,iBAAiB,EAC3B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,EAAE,CACX,sdAAsd,EACtd,SAAS,CACV,KACG,KAAK,YAER,QAAQ,GACgB,GACH,CAC3B,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,CAAC"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
export * from './lib/utils.js';
|
|
2
|
+
export * from './components/accordion.js';
|
|
3
|
+
export * from './components/alert.js';
|
|
4
|
+
export * from './components/alert-dialog.js';
|
|
5
|
+
export * from './components/avatar.js';
|
|
6
|
+
export * from './components/badge.js';
|
|
7
|
+
export * from './components/button.js';
|
|
8
|
+
export * from './components/calendar.js';
|
|
9
|
+
export * from './components/card.js';
|
|
10
|
+
export * from './components/checkbox.js';
|
|
11
|
+
export * from './components/command.js';
|
|
12
|
+
export * from './components/date-picker.js';
|
|
13
|
+
export * from './components/dialog.js';
|
|
14
|
+
export * from './components/dropdown-menu.js';
|
|
15
|
+
export * from './components/empty-state.js';
|
|
16
|
+
export * from './components/field.js';
|
|
17
|
+
export * from './components/input.js';
|
|
18
|
+
export * from './components/kbd.js';
|
|
19
|
+
export * from './components/label.js';
|
|
20
|
+
export * from './components/pagination.js';
|
|
21
|
+
export * from './components/popover.js';
|
|
22
|
+
export * from './components/progress.js';
|
|
23
|
+
export * from './components/radio-group.js';
|
|
24
|
+
export * from './components/select.js';
|
|
25
|
+
export * from './components/separator.js';
|
|
26
|
+
export * from './components/sheet.js';
|
|
27
|
+
export * from './components/skeleton.js';
|
|
28
|
+
export * from './components/sonner.js';
|
|
29
|
+
export * from './components/switch.js';
|
|
30
|
+
export * from './components/tabs.js';
|
|
31
|
+
export * from './components/textarea.js';
|
|
32
|
+
export * from './components/toggle-group.js';
|
|
33
|
+
export * from './components/tooltip.js';
|
|
34
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC"}
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
// @brokenrubik/ui — every component. Per-component imports also work:
|
|
2
|
+
// import { Button } from '@brokenrubik/ui/components/button';
|
|
3
|
+
export * from './lib/utils.js';
|
|
4
|
+
export * from './components/accordion.js';
|
|
5
|
+
export * from './components/alert.js';
|
|
6
|
+
export * from './components/alert-dialog.js';
|
|
7
|
+
export * from './components/avatar.js';
|
|
8
|
+
export * from './components/badge.js';
|
|
9
|
+
export * from './components/button.js';
|
|
10
|
+
export * from './components/calendar.js';
|
|
11
|
+
export * from './components/card.js';
|
|
12
|
+
export * from './components/checkbox.js';
|
|
13
|
+
export * from './components/command.js';
|
|
14
|
+
export * from './components/date-picker.js';
|
|
15
|
+
export * from './components/dialog.js';
|
|
16
|
+
export * from './components/dropdown-menu.js';
|
|
17
|
+
export * from './components/empty-state.js';
|
|
18
|
+
export * from './components/field.js';
|
|
19
|
+
export * from './components/input.js';
|
|
20
|
+
export * from './components/kbd.js';
|
|
21
|
+
export * from './components/label.js';
|
|
22
|
+
export * from './components/pagination.js';
|
|
23
|
+
export * from './components/popover.js';
|
|
24
|
+
export * from './components/progress.js';
|
|
25
|
+
export * from './components/radio-group.js';
|
|
26
|
+
export * from './components/select.js';
|
|
27
|
+
export * from './components/separator.js';
|
|
28
|
+
export * from './components/sheet.js';
|
|
29
|
+
export * from './components/skeleton.js';
|
|
30
|
+
export * from './components/sonner.js';
|
|
31
|
+
export * from './components/switch.js';
|
|
32
|
+
export * from './components/tabs.js';
|
|
33
|
+
export * from './components/textarea.js';
|
|
34
|
+
export * from './components/toggle-group.js';
|
|
35
|
+
export * from './components/tooltip.js';
|
|
36
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,gEAAgE;AAChE,cAAc,gBAAgB,CAAC;AAC/B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* `tone` and `variant` are two names for the same prop on Badge, Alert, Progress and
|
|
3
|
+
* AvatarFallback. `tone` is the Figma name; `variant` is the shadcn name, so shadcn code
|
|
4
|
+
* (`<Badge variant="secondary">`) works without edits. When both are set, `tone` wins.
|
|
5
|
+
* `aliases` maps shadcn-only values (`default`, `secondary`, `outline`) to a BR tone.
|
|
6
|
+
*/
|
|
7
|
+
export declare function resolveTone<T extends string>(tone: T | null | undefined, variant: string | null | undefined, aliases: Readonly<Record<string, T>>, fallback: T): T;
|
|
8
|
+
//# sourceMappingURL=tone.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tone.d.ts","sourceRoot":"","sources":["../../src/lib/tone.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,EAC1C,IAAI,EAAE,CAAC,GAAG,IAAI,GAAG,SAAS,EAC1B,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAClC,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EACpC,QAAQ,EAAE,CAAC,GACV,CAAC,CAIH"}
|
package/dist/lib/tone.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* `tone` and `variant` are two names for the same prop on Badge, Alert, Progress and
|
|
3
|
+
* AvatarFallback. `tone` is the Figma name; `variant` is the shadcn name, so shadcn code
|
|
4
|
+
* (`<Badge variant="secondary">`) works without edits. When both are set, `tone` wins.
|
|
5
|
+
* `aliases` maps shadcn-only values (`default`, `secondary`, `outline`) to a BR tone.
|
|
6
|
+
*/
|
|
7
|
+
export function resolveTone(tone, variant, aliases, fallback) {
|
|
8
|
+
if (tone)
|
|
9
|
+
return tone;
|
|
10
|
+
if (!variant)
|
|
11
|
+
return fallback;
|
|
12
|
+
return aliases[variant] ?? variant;
|
|
13
|
+
}
|
|
14
|
+
//# sourceMappingURL=tone.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tone.js","sourceRoot":"","sources":["../../src/lib/tone.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,UAAU,WAAW,CACzB,IAA0B,EAC1B,OAAkC,EAClC,OAAoC,EACpC,QAAW;IAEX,IAAI,IAAI;QAAE,OAAO,IAAI,CAAC;IACtB,IAAI,CAAC,OAAO;QAAE,OAAO,QAAQ,CAAC;IAC9B,OAAO,OAAO,CAAC,OAAO,CAAC,IAAK,OAAa,CAAC;AAC5C,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { type ClassValue } from 'clsx';
|
|
2
|
+
import { type ConfigExtension } from 'tailwind-merge';
|
|
3
|
+
/**
|
|
4
|
+
* The BR text styles registered as `text-*` font sizes in theme.css. tailwind-merge must
|
|
5
|
+
* know them: by default it reads an unknown `text-foo` as a color, so `cn('text-body',
|
|
6
|
+
* 'text-muted-foreground')` would drop `text-body`.
|
|
7
|
+
*/
|
|
8
|
+
export declare const brTextSizes: readonly ['display', 'page-title', 'section', 'card-title', 'body-lg', 'body', 'body-sm', 'caption', 'overline', 'nav', 'nav-label', 'initials', 'initials-sm', 'mono', 'mono-sm', 'doc-title', 'doc-h2', 'doc-body'];
|
|
9
|
+
type MergeConfig = ConfigExtension<string, string>;
|
|
10
|
+
/**
|
|
11
|
+
* Builds a `cn` for an app that adds its own scales on top of the BR theme (for example
|
|
12
|
+
* extra `text-*` sizes or `shadow-*` names), so tailwind-merge groups them right.
|
|
13
|
+
*
|
|
14
|
+
* export const cn = createCn({ extend: { theme: { text: ['hero'] } } });
|
|
15
|
+
*/
|
|
16
|
+
export declare function createCn(config?: MergeConfig): (...inputs: ClassValue[]) => string;
|
|
17
|
+
/** Joins class names and resolves Tailwind conflicts (the last class wins). */
|
|
18
|
+
export declare const cn: (...inputs: ClassValue[]) => string;
|
|
19
|
+
export {};
|
|
20
|
+
//# sourceMappingURL=utils.d.ts.map
|