@nadicodeai/ui 12.1.82 → 12.1.83
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/accordion.js +1 -1
- package/dist/components/account-menu.js +1 -1
- package/dist/components/agent-card.js +1 -1
- package/dist/components/agent-profile.js +1 -1
- package/dist/components/alert-dialog.js +3 -3
- package/dist/components/alert.js +1 -1
- package/dist/components/automation-section.js +2 -2
- package/dist/components/avatar.d.ts +9 -1
- package/dist/components/avatar.d.ts.map +1 -1
- package/dist/components/avatar.js +8 -2
- package/dist/components/badge.d.ts +1 -1
- package/dist/components/badge.d.ts.map +1 -1
- package/dist/components/badge.js +5 -6
- package/dist/components/button-group.js +4 -4
- package/dist/components/button.d.ts.map +1 -1
- package/dist/components/button.js +9 -9
- package/dist/components/calendar.js +3 -3
- package/dist/components/card.d.ts.map +1 -1
- package/dist/components/card.js +6 -11
- package/dist/components/catalog-tile.d.ts +2 -4
- package/dist/components/catalog-tile.d.ts.map +1 -1
- package/dist/components/catalog-tile.js +2 -2
- package/dist/components/channel-view.d.ts.map +1 -1
- package/dist/components/channel-view.js +8 -8
- package/dist/components/chart-card.js +1 -1
- package/dist/components/chart.js +1 -1
- package/dist/components/checkbox.d.ts.map +1 -1
- package/dist/components/checkbox.js +2 -2
- package/dist/components/code-block.d.ts +8 -0
- package/dist/components/code-block.d.ts.map +1 -0
- package/dist/components/code-block.js +7 -0
- package/dist/components/collection-filters.d.ts.map +1 -1
- package/dist/components/collection-filters.js +3 -3
- package/dist/components/collection-toolbar.js +1 -1
- package/dist/components/combobox.js +3 -3
- package/dist/components/command.js +3 -3
- package/dist/components/copy-button.d.ts +9 -0
- package/dist/components/copy-button.d.ts.map +1 -0
- package/dist/components/copy-button.js +25 -0
- package/dist/components/data-table.d.ts +7 -7
- package/dist/components/data-table.d.ts.map +1 -1
- package/dist/components/data-table.js +21 -51
- package/dist/components/dialog.js +3 -3
- package/dist/components/drawer.js +4 -4
- package/dist/components/dropdown-menu.js +6 -6
- package/dist/components/empty-state.d.ts +10 -16
- package/dist/components/empty-state.d.ts.map +1 -1
- package/dist/components/empty-state.js +1 -1
- package/dist/components/field.js +3 -3
- package/dist/components/file-diff.js +1 -1
- package/dist/components/footer.d.ts.map +1 -1
- package/dist/components/footer.js +3 -3
- package/dist/components/form-dialog.d.ts +4 -0
- package/dist/components/form-dialog.d.ts.map +1 -0
- package/dist/components/form-dialog.js +13 -0
- package/dist/components/form-drawer.d.ts +1 -8
- package/dist/components/form-drawer.d.ts.map +1 -1
- package/dist/components/form-drawer.js +1 -8
- package/dist/components/glass-control.js +1 -1
- package/dist/components/input-group.js +3 -3
- package/dist/components/input-otp.js +2 -2
- package/dist/components/input.js +1 -1
- package/dist/components/item.js +2 -2
- package/dist/components/kbd.js +1 -1
- package/dist/components/kpi-card.d.ts +3 -3
- package/dist/components/kpi-card.d.ts.map +1 -1
- package/dist/components/kpi-card.js +5 -6
- package/dist/components/label-system.js +2 -2
- package/dist/components/label.js +1 -1
- package/dist/components/menubar.js +6 -6
- package/dist/components/native-select.js +1 -1
- package/dist/components/navigation-menu.js +4 -4
- package/dist/components/object-workspace.d.ts +2 -1
- package/dist/components/object-workspace.d.ts.map +1 -1
- package/dist/components/object-workspace.js +12 -6
- package/dist/components/page-actions.d.ts +3 -3
- package/dist/components/page-actions.d.ts.map +1 -1
- package/dist/components/page-actions.js +6 -3
- package/dist/components/page-header.js +1 -1
- package/dist/components/picture-label.d.ts.map +1 -1
- package/dist/components/picture-label.js +1 -1
- package/dist/components/plugin-slot-boundary.js +1 -1
- package/dist/components/popover.js +1 -1
- package/dist/components/reading-column.d.ts +1 -7
- package/dist/components/reading-column.d.ts.map +1 -1
- package/dist/components/reading-column.js +1 -7
- package/dist/components/record-identity.d.ts +8 -0
- package/dist/components/record-identity.d.ts.map +1 -0
- package/dist/components/record-identity.js +5 -0
- package/dist/components/select.js +2 -2
- package/dist/components/settings-facts.d.ts +2 -1
- package/dist/components/settings-facts.d.ts.map +1 -1
- package/dist/components/settings-facts.js +5 -3
- package/dist/components/settings-form.d.ts +9 -0
- package/dist/components/settings-form.d.ts.map +1 -0
- package/dist/components/settings-form.js +85 -0
- package/dist/components/settings-section.d.ts +5 -2
- package/dist/components/settings-section.d.ts.map +1 -1
- package/dist/components/settings-section.js +13 -6
- package/dist/components/sheet.d.ts.map +1 -1
- package/dist/components/sheet.js +3 -3
- package/dist/components/sidebar.js +9 -9
- package/dist/components/skeleton.d.ts +3 -5
- package/dist/components/skeleton.d.ts.map +1 -1
- package/dist/components/skeleton.js +2 -6
- package/dist/components/sonner.js +4 -4
- package/dist/components/status-row.js +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/table.d.ts +4 -1
- package/dist/components/table.d.ts.map +1 -1
- package/dist/components/table.js +9 -9
- package/dist/components/tabs.d.ts +1 -1
- package/dist/components/tabs.d.ts.map +1 -1
- package/dist/components/tabs.js +7 -7
- package/dist/components/tag.d.ts +5 -3
- package/dist/components/tag.d.ts.map +1 -1
- package/dist/components/tag.js +10 -5
- package/dist/components/text-link.js +1 -1
- package/dist/components/textarea.js +1 -1
- package/dist/components/toggle-group.js +2 -2
- package/dist/components/toggle.js +3 -3
- package/dist/components/tooltip.js +1 -1
- package/dist/index.d.ts +5 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +5 -0
- package/dist/internal/empty.d.ts +2 -6
- package/dist/internal/empty.d.ts.map +1 -1
- package/dist/internal/empty.js +5 -10
- package/dist/internal/footer-strip.js +1 -1
- package/dist/lib/merge-tokens.generated.js +2 -2
- package/dist/standalone/index.js +1 -1
- package/dist/styles/components.css +27 -4
- package/package.json +2 -2
|
@@ -9,6 +9,6 @@ import { PageActionsSlot } from "./page-actions.js";
|
|
|
9
9
|
* filters, search and sort.
|
|
10
10
|
*/
|
|
11
11
|
function PageHeader({ title, headingProps, className, ...props }) {
|
|
12
|
-
return (_jsx("header", { "data-slot": "page-header", className: cn("min-w-0", className), ...props, children: _jsxs("div", { className: "flex min-h-9 min-w-0 flex-wrap items-center justify-between gap-x-6 gap-y-3", children: [_jsx("h1", { ...headingProps, className: cn("min-w-0 flex-1 basis-48 truncate
|
|
12
|
+
return (_jsx("header", { "data-slot": "page-header", className: cn("min-w-0", className), ...props, children: _jsxs("div", { className: "flex min-h-9 min-w-0 flex-wrap items-center justify-between gap-x-6 gap-y-3", children: [_jsx("h1", { ...headingProps, className: cn("min-w-0 flex-1 basis-48 truncate text-heading-md text-foreground outline-none", headingProps?.className), children: title }), _jsx(PageActionsSlot, {})] }) }));
|
|
13
13
|
}
|
|
14
14
|
export { PageHeader };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"picture-label.d.ts","sourceRoot":"","sources":["../../src/components/picture-label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,KAAK,EACL,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,4DAA4D;IAC5D,KAAK,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAeA;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,+
|
|
1
|
+
{"version":3,"file":"picture-label.d.ts","sourceRoot":"","sources":["../../src/components/picture-label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,KAAK,EACL,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,4DAA4D;IAC5D,KAAK,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAeA;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,+BASlF"}
|
|
@@ -13,5 +13,5 @@ export function LabelledPicture({ children, label, className, }) {
|
|
|
13
13
|
return (_jsxs("figure", { className: cn("m-0 grid w-full max-w-4xl justify-items-center gap-4 lg:grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] lg:items-end lg:gap-8", className), "data-slot": "labelled-picture", children: [_jsx("div", { className: "lg:col-start-2 lg:row-start-1", children: children }), _jsx("figcaption", { className: "max-w-72 text-center lg:col-start-3 lg:row-start-1 lg:justify-self-start lg:pb-6 lg:text-start", children: label })] }));
|
|
14
14
|
}
|
|
15
15
|
export function PictureLabel({ title, details }) {
|
|
16
|
-
return (_jsxs("span", { className: "grid gap-1", children: [_jsx("span", { className: "
|
|
16
|
+
return (_jsxs("span", { className: "grid gap-1", children: [_jsx("span", { className: "text-body-sm text-balance font-medium", children: title }), _jsx("span", { className: "font-label-mono text-label-mono text-balance text-muted-foreground", children: details })] }));
|
|
17
17
|
}
|
|
@@ -19,6 +19,6 @@ function PluginSlotBoundary({ title, description, status = "ready", permissions
|
|
|
19
19
|
return (_jsx(Badge, { "data-slot": "plugin-slot-boundary-permission", "data-level": level, variant: permissionBadgeVariants[level], title: typeof permission.description === "string"
|
|
20
20
|
? permission.description
|
|
21
21
|
: undefined, children: permission.label }, permission.id));
|
|
22
|
-
}) }))] }), _jsxs(CardContent, { className: "grid gap-4", children: [warning && (_jsxs(Alert, { "data-slot": "plugin-slot-boundary-warning", children: [_jsx(AlertTriangleIcon, { "data-icon": true }), _jsx(AlertTitle, { children: "Review before continuing" }), _jsx(AlertDescription, { children: warning })] })), error && (_jsxs(Alert, { "data-slot": "plugin-slot-boundary-error", variant: "destructive", children: [_jsx(ShieldAlertIcon, { "data-icon": true }), _jsx(AlertTitle, { children: "Plugin content unavailable" }), _jsx(AlertDescription, { children: error })] })), _jsx("div", { "data-slot": "plugin-slot-boundary-content", "aria-label": contentLabel, className: cn("max-h-96 min-w-0 overflow-auto rounded-
|
|
22
|
+
}) }))] }), _jsxs(CardContent, { className: "grid gap-4", children: [warning && (_jsxs(Alert, { "data-slot": "plugin-slot-boundary-warning", children: [_jsx(AlertTriangleIcon, { "data-icon": true }), _jsx(AlertTitle, { children: "Review before continuing" }), _jsx(AlertDescription, { children: warning })] })), error && (_jsxs(Alert, { "data-slot": "plugin-slot-boundary-error", variant: "destructive", children: [_jsx(ShieldAlertIcon, { "data-icon": true }), _jsx(AlertTitle, { children: "Plugin content unavailable" }), _jsx(AlertDescription, { children: error })] })), _jsx("div", { "data-slot": "plugin-slot-boundary-content", "aria-label": contentLabel, className: cn("max-h-96 min-w-0 overflow-auto rounded-sm border bg-background p-4 text-sm break-words", status === "disabled" && "pointer-events-none opacity-60", contentClassName), children: children })] }), (redactionGuidance || footer) && (_jsxs(CardFooter, { className: "flex flex-col items-start gap-2 border-t text-sm text-muted-foreground", children: [redactionGuidance && (_jsx("p", { "data-slot": "plugin-slot-boundary-redaction", children: redactionGuidance })), footer && _jsx("div", { "data-slot": "plugin-slot-boundary-footer", children: footer })] }))] }) }));
|
|
23
23
|
}
|
|
24
24
|
export { PluginSlotBoundary };
|
|
@@ -15,7 +15,7 @@ function PopoverHeader({ className, ...props }) {
|
|
|
15
15
|
return (_jsx("div", { "data-slot": "popover-header", className: cn("flex flex-col gap-0.5 text-sm", className), ...props }));
|
|
16
16
|
}
|
|
17
17
|
function PopoverTitle({ className, ...props }) {
|
|
18
|
-
return (_jsx(PopoverPrimitive.Title, { "data-slot": "popover-title", className: cn("
|
|
18
|
+
return (_jsx(PopoverPrimitive.Title, { "data-slot": "popover-title", className: cn("text-heading-xs", className), ...props }));
|
|
19
19
|
}
|
|
20
20
|
function PopoverDescription({ className, ...props }) {
|
|
21
21
|
return (_jsx(PopoverPrimitive.Description, { "data-slot": "popover-description", className: cn("text-muted-foreground", className), ...props }));
|
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
export type ReadingColumnWidth = "full" | "reading";
|
|
3
|
-
/**
|
|
4
|
-
* The centered content column a settings region reads in. `reading` bounds the
|
|
5
|
-
* measure for stacked forms and record sections; `full` keeps the workspace
|
|
6
|
-
* width for a page whose table needs it. Both stay centered, so the column
|
|
7
|
-
* agrees with the centered heading above it whichever width a page takes.
|
|
8
|
-
*/
|
|
2
|
+
export type ReadingColumnWidth = "full" | "reading" | "configuration";
|
|
9
3
|
declare function ReadingColumn({ width, className, ...props }: React.ComponentProps<"div"> & {
|
|
10
4
|
width?: ReadingColumnWidth;
|
|
11
5
|
}): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"reading-column.d.ts","sourceRoot":"","sources":["../../src/components/reading-column.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"reading-column.d.ts","sourceRoot":"","sources":["../../src/components/reading-column.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,SAAS,GAAG,eAAe,CAAC;AAEtE,iBAAS,aAAa,CAAC,EACrB,KAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,KAAK,CAAC,EAAE,kBAAkB,CAAA;CAAE,qBAc9D;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}
|
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "../lib/utils.js";
|
|
3
|
-
/**
|
|
4
|
-
* The centered content column a settings region reads in. `reading` bounds the
|
|
5
|
-
* measure for stacked forms and record sections; `full` keeps the workspace
|
|
6
|
-
* width for a page whose table needs it. Both stay centered, so the column
|
|
7
|
-
* agrees with the centered heading above it whichever width a page takes.
|
|
8
|
-
*/
|
|
9
3
|
function ReadingColumn({ width = "reading", className, ...props }) {
|
|
10
|
-
return (_jsx("div", { "data-slot": "reading-column", "data-width": width, className: cn("mx-auto flex w-full min-w-0 flex-col gap-6", width === "reading" && "max-w-3xl", className), ...props }));
|
|
4
|
+
return (_jsx("div", { "data-slot": "reading-column", "data-width": width, className: cn("mx-auto flex w-full min-w-0 flex-col gap-6", width === "reading" && "max-w-3xl", width === "configuration" && "max-w-4xl", className), ...props }));
|
|
11
5
|
}
|
|
12
6
|
export { ReadingColumn };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"record-identity.d.ts","sourceRoot":"","sources":["../../src/components/record-identity.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,iBAAS,cAAc,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,+BAS9F;AAED,OAAO,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
function RecordIdentity({ name, mark, hint }) {
|
|
3
|
+
return (_jsxs("span", { className: "flex min-w-0 items-center gap-2.5", "data-slot": "record-identity", children: [mark, _jsx("span", { className: "min-w-0 truncate font-medium", title: hint ? `${name} · ${hint}` : name, children: name })] }));
|
|
4
|
+
}
|
|
5
|
+
export { RecordIdentity };
|
|
@@ -12,7 +12,7 @@ function SelectValue({ className, ...props }) {
|
|
|
12
12
|
return (_jsx(SelectPrimitive.Value, { "data-slot": "select-value", className: cn("flex flex-1 text-left", className), ...props }));
|
|
13
13
|
}
|
|
14
14
|
function SelectTrigger({ className, size = "default", children, ...props }) {
|
|
15
|
-
return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn("flex h-control-height min-h-touch-target w-fit items-center justify-between gap-1.5 rounded-
|
|
15
|
+
return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn("flex h-control-height min-h-touch-target w-fit items-center justify-between gap-1.5 rounded-sm border border-input bg-background py-2 pr-2 pl-control-padding-inline text-sm whitespace-nowrap transition-colors select-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive data-placeholder:text-placeholder data-[size=sm]:h-nadicode-control-height-sm [@media(hover:hover)_and_(pointer:fine)]:min-h-0 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { render: _jsx(ChevronDownIcon, { className: "pointer-events-none size-4 text-muted-foreground" }) })] }));
|
|
16
16
|
}
|
|
17
17
|
function SelectContent({ className, children, side = "bottom", sideOffset = 4, align = "center", alignOffset = 0, alignItemWithTrigger = true, ...props }) {
|
|
18
18
|
return (_jsx(SelectPrimitive.Portal, { children: _jsx(SelectPrimitive.Positioner, { side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, alignItemWithTrigger: alignItemWithTrigger, className: "isolate z-50", children: _jsxs(SelectPrimitive.Popup, { "data-slot": "select-content", "data-align-trigger": alignItemWithTrigger, className: cn("relative isolate z-50 max-h-(--available-height) w-auto max-w-(--available-width) min-w-(--anchor-width) overflow-x-hidden overflow-y-auto rounded-lg border-0 nc-glass text-popover-foreground nc-elevation-floating data-[align-trigger=true]:transition-none", anchoredOverlayMotion, className), ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.List, { children: children }), _jsx(SelectScrollDownButton, {})] }) }) }));
|
|
@@ -21,7 +21,7 @@ function SelectLabel({ className, ...props }) {
|
|
|
21
21
|
return (_jsx(SelectPrimitive.GroupLabel, { "data-slot": "select-label", className: cn("px-1.5 py-1 text-xs text-muted-foreground", className), ...props }));
|
|
22
22
|
}
|
|
23
23
|
function SelectItem({ className, children, ...props }) {
|
|
24
|
-
return (_jsxs(SelectPrimitive.Item, { "data-slot": "select-item", className: cn("relative flex min-h-touch-target w-full cursor-default items-center gap-1.5 rounded-
|
|
24
|
+
return (_jsxs(SelectPrimitive.Item, { "data-slot": "select-item", className: cn("relative flex min-h-touch-target w-full cursor-default items-center gap-1.5 rounded-sm py-1 pr-8 pl-1.5 text-sm whitespace-nowrap outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", className), ...props, children: [_jsx(SelectPrimitive.ItemText, { className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap", children: children }), _jsx(SelectPrimitive.ItemIndicator, { render: _jsx("span", { className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center" }), children: _jsx(CheckIcon, { className: "pointer-events-none" }) })] }));
|
|
25
25
|
}
|
|
26
26
|
function SelectSeparator({ className, ...props }) {
|
|
27
27
|
return (_jsx(SelectPrimitive.Separator, { "data-slot": "select-separator", className: cn("pointer-events-none -mx-1 my-1 h-px bg-border", className), ...props }));
|
|
@@ -12,6 +12,7 @@ export type SettingsFact = {
|
|
|
12
12
|
};
|
|
13
13
|
export type SettingsFactsSectionProps = Omit<ComponentPropsWithoutRef<"section">, "children" | "className"> & {
|
|
14
14
|
action?: ReactNode;
|
|
15
|
+
presentation?: "card" | "summary";
|
|
15
16
|
description?: string;
|
|
16
17
|
facts: readonly SettingsFact[];
|
|
17
18
|
footer?: ReactNode;
|
|
@@ -29,5 +30,5 @@ export type SettingsFactsSectionProps = Omit<ComponentPropsWithoutRef<"section">
|
|
|
29
30
|
*/
|
|
30
31
|
size?: ComponentPropsWithoutRef<typeof Card>["size"];
|
|
31
32
|
};
|
|
32
|
-
export declare function SettingsFactsSection({ action, description, facts, footer, missingValueLabel, headingId, title, surface, size, ...props }: SettingsFactsSectionProps): import("react").JSX.Element;
|
|
33
|
+
export declare function SettingsFactsSection({ action, presentation, description, facts, footer, missingValueLabel, headingId, title, surface, size, ...props }: SettingsFactsSectionProps): import("react").JSX.Element;
|
|
33
34
|
//# sourceMappingURL=settings-facts.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"settings-facts.d.ts","sourceRoot":"","sources":["../../src/components/settings-facts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"settings-facts.d.ts","sourceRoot":"","sources":["../../src/components/settings-facts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKjE,OAAO,EACL,IAAI,EAOJ,KAAK,WAAW,EACjB,MAAM,QAAQ,CAAC;AAEhB,MAAM,MAAM,YAAY,GAAG;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC1C,wBAAwB,CAAC,SAAS,CAAC,EACnC,UAAU,GAAG,WAAW,CACzB,GAAG;IACF,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,SAAS,YAAY,EAAE,CAAC;IAC/B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,wBAAwB,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC;CACtD,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,EACnC,MAAM,EACN,YAAqB,EACrB,WAAW,EACX,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,KAAK,EACL,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,yBAAyB,+BA4D3B"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { ObjectFacts } from "./object-workspace.js";
|
|
3
|
-
import { Separator } from "./separator.js";
|
|
4
3
|
import { TableValue } from "./table-value.js";
|
|
5
4
|
import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from "./card.js";
|
|
6
|
-
export function SettingsFactsSection({ action, description, facts, footer, missingValueLabel, headingId, title, surface = "resting", size = "default", ...props }) {
|
|
7
|
-
|
|
5
|
+
export function SettingsFactsSection({ action, presentation = "card", description, facts, footer, missingValueLabel, headingId, title, surface = "resting", size = "default", ...props }) {
|
|
6
|
+
if (presentation === "summary") {
|
|
7
|
+
return (_jsxs("section", { ...props, "aria-labelledby": headingId, className: "grid min-w-0 gap-3", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [_jsx("h2", { id: headingId, tabIndex: -1, className: "text-sm font-medium", children: title }), action] }), description ? _jsx("p", { className: "text-sm text-muted-foreground", children: description }) : null, _jsx("dl", { className: "flex flex-wrap items-start gap-x-6 gap-y-3", children: facts.map((fact) => (_jsxs("div", { className: "grid gap-1", children: [_jsx("dt", { className: "text-xs text-muted-foreground", children: fact.label }), _jsx("dd", { className: "text-sm", children: fact.value ?? _jsx(TableValue, { missingLabel: missingValueLabel, value: null }) })] }, fact.label))) }), footer] }));
|
|
8
|
+
}
|
|
9
|
+
return (_jsxs(Card, { render: _jsx("section", {}), ...props, "aria-labelledby": headingId, surface: surface, size: size, className: "min-w-0", children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: _jsx("h2", { id: headingId, tabIndex: -1, children: title }) }), description ? _jsx(CardDescription, { children: description }) : null, action ? _jsx(CardAction, { children: action }) : null] }), _jsx(CardContent, { children: _jsx(ObjectFacts, { facts: facts.map((fact) => ({
|
|
8
10
|
label: fact.label,
|
|
9
11
|
block: fact.block,
|
|
10
12
|
value: fact.value == null || fact.value === "" ? (_jsx(TableValue, { missingLabel: missingValueLabel, value: null })) : (fact.value),
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type ComponentProps } from "react";
|
|
2
|
+
import { Button } from "./button.js";
|
|
3
|
+
declare function SettingsForm({ action, onChange, onReset, onSubmit, children, ...props }: Omit<ComponentProps<"form">, "action" | "method"> & {
|
|
4
|
+
action: Exclude<NonNullable<ComponentProps<"form">["action"]>, string>;
|
|
5
|
+
}): import("react").JSX.Element;
|
|
6
|
+
declare function useSettingsFormChanged(): boolean;
|
|
7
|
+
declare function SettingsSubmitButton({ disabled, ...props }: Omit<ComponentProps<typeof Button>, "type" | "formAction">): import("react").JSX.Element;
|
|
8
|
+
export { SettingsForm, SettingsSubmitButton, useSettingsFormChanged };
|
|
9
|
+
//# sourceMappingURL=settings-form.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"settings-form.d.ts","sourceRoot":"","sources":["../../src/components/settings-form.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmD,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAG7F,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AA4DlC,iBAAS,YAAY,CAAC,EACpB,MAAM,EACN,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC,GAAG;IACrD,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;CACxE,+BAsCA;AAED,iBAAS,sBAAsB,YAM9B;AAED,iBAAS,oBAAoB,CAAC,EAC5B,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC,+BAY5D;AAED,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,CAAC"}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { createContext, use, useEffect, useRef, useState } from "react";
|
|
4
|
+
import { useFormStatus } from "react-dom";
|
|
5
|
+
import { Button } from "./button.js";
|
|
6
|
+
import { FieldSet } from "./field.js";
|
|
7
|
+
const SettingsFormContext = createContext(null);
|
|
8
|
+
function editableControls(form) {
|
|
9
|
+
return Array.from(form.elements).filter((control) => {
|
|
10
|
+
if (control instanceof HTMLInputElement) {
|
|
11
|
+
return (Boolean(control.name) &&
|
|
12
|
+
!control.disabled &&
|
|
13
|
+
!control.readOnly &&
|
|
14
|
+
!["hidden", "submit", "reset", "button"].includes(control.type));
|
|
15
|
+
}
|
|
16
|
+
if (control instanceof HTMLTextAreaElement) {
|
|
17
|
+
return Boolean(control.name) && !control.disabled && !control.readOnly;
|
|
18
|
+
}
|
|
19
|
+
return control instanceof HTMLSelectElement && Boolean(control.name) && !control.disabled;
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
function hasChangedFields(form) {
|
|
23
|
+
return editableControls(form).some((control) => {
|
|
24
|
+
if (control instanceof HTMLInputElement) {
|
|
25
|
+
if (control.type === "checkbox" || control.type === "radio") {
|
|
26
|
+
return control.checked !== control.defaultChecked;
|
|
27
|
+
}
|
|
28
|
+
return control.value !== control.defaultValue;
|
|
29
|
+
}
|
|
30
|
+
if (control instanceof HTMLTextAreaElement) {
|
|
31
|
+
return control.value !== control.defaultValue;
|
|
32
|
+
}
|
|
33
|
+
const options = Array.from(control.options);
|
|
34
|
+
const hasDefault = options.some((option) => option.defaultSelected);
|
|
35
|
+
const fallback = options.findIndex((option) => !option.disabled);
|
|
36
|
+
return options.some((option, index) => option.selected !==
|
|
37
|
+
(option.defaultSelected || (!control.multiple && !hasDefault && index === fallback)));
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
function editableValues(form) {
|
|
41
|
+
const names = new Set(editableControls(form).map((control) => control.name));
|
|
42
|
+
return JSON.stringify(Array.from(new FormData(form))
|
|
43
|
+
.filter(([name]) => names.has(name))
|
|
44
|
+
.map(([name, value]) => [
|
|
45
|
+
name,
|
|
46
|
+
typeof value === "string"
|
|
47
|
+
? value
|
|
48
|
+
: [value.name, value.size, value.type, value.lastModified],
|
|
49
|
+
]));
|
|
50
|
+
}
|
|
51
|
+
function SettingsForm({ action, onChange, onReset, onSubmit, children, ...props }) {
|
|
52
|
+
const [changed, setChanged] = useState(false);
|
|
53
|
+
const [hydrated, setHydrated] = useState(false);
|
|
54
|
+
const submittedValues = useRef(null);
|
|
55
|
+
useEffect(() => setHydrated(true), []);
|
|
56
|
+
return (_jsx(SettingsFormContext, { value: changed, children: _jsx("form", { ...props, action: action, onChange: (event) => {
|
|
57
|
+
onChange?.(event);
|
|
58
|
+
setChanged(hasChangedFields(event.currentTarget));
|
|
59
|
+
}, onSubmit: (event) => {
|
|
60
|
+
onSubmit?.(event);
|
|
61
|
+
if (!event.defaultPrevented)
|
|
62
|
+
submittedValues.current = editableValues(event.currentTarget);
|
|
63
|
+
}, onReset: (event) => {
|
|
64
|
+
onReset?.(event);
|
|
65
|
+
if (submittedValues.current !== null &&
|
|
66
|
+
editableValues(event.currentTarget) !== submittedValues.current) {
|
|
67
|
+
event.preventDefault();
|
|
68
|
+
}
|
|
69
|
+
submittedValues.current = null;
|
|
70
|
+
setChanged(event.defaultPrevented ? hasChangedFields(event.currentTarget) : false);
|
|
71
|
+
}, children: _jsx(FieldSet, { disabled: !hydrated, className: "min-w-0", children: _jsx("div", { className: "min-w-0", children: children }) }) }) }));
|
|
72
|
+
}
|
|
73
|
+
function useSettingsFormChanged() {
|
|
74
|
+
const changed = use(SettingsFormContext);
|
|
75
|
+
if (changed === null) {
|
|
76
|
+
throw new Error("Settings form controls must be used within a SettingsForm.");
|
|
77
|
+
}
|
|
78
|
+
return changed;
|
|
79
|
+
}
|
|
80
|
+
function SettingsSubmitButton({ disabled, ...props }) {
|
|
81
|
+
const changed = useSettingsFormChanged();
|
|
82
|
+
const { pending } = useFormStatus();
|
|
83
|
+
return (_jsx(Button, { ...props, type: "submit", "aria-busy": pending, disabled: disabled || pending || !changed }));
|
|
84
|
+
}
|
|
85
|
+
export { SettingsForm, SettingsSubmitButton, useSettingsFormChanged };
|
|
@@ -8,15 +8,17 @@ export type SettingsFieldControlProps = {
|
|
|
8
8
|
disabled?: boolean;
|
|
9
9
|
required?: boolean;
|
|
10
10
|
};
|
|
11
|
-
declare function SettingsSection({ title, description, actions, footer, footerHint, children, className, surface, ...props }: Omit<React.ComponentProps<"section">, "title"> & {
|
|
11
|
+
declare function SettingsSection({ title, description, actions, footer, footerHint, children, className, surface, presentation, columns, ...props }: Omit<React.ComponentProps<"section">, "title"> & {
|
|
12
12
|
title?: React.ReactNode;
|
|
13
13
|
description?: React.ReactNode;
|
|
14
14
|
actions?: React.ReactNode;
|
|
15
15
|
footer?: React.ReactNode;
|
|
16
16
|
footerHint?: React.ReactNode;
|
|
17
17
|
surface?: CardSurface;
|
|
18
|
+
presentation?: "split" | "form";
|
|
19
|
+
columns?: 1 | 2;
|
|
18
20
|
}): React.JSX.Element;
|
|
19
|
-
declare function SettingsField({ id, label, description, error, invalid, disabled, required, children, className, contentClassName, controlClassName, ...props }: Omit<React.ComponentProps<typeof Field>, "children"> & {
|
|
21
|
+
declare function SettingsField({ id, label, description, error, invalid, disabled, required, orientation, children, className, contentClassName, controlClassName, controlWidth, ...props }: Omit<React.ComponentProps<typeof Field>, "children"> & {
|
|
20
22
|
id: string;
|
|
21
23
|
label: React.ReactNode;
|
|
22
24
|
description?: React.ReactNode;
|
|
@@ -29,6 +31,7 @@ declare function SettingsField({ id, label, description, error, invalid, disable
|
|
|
29
31
|
}) => React.ReactNode;
|
|
30
32
|
contentClassName?: string;
|
|
31
33
|
controlClassName?: string;
|
|
34
|
+
controlWidth?: "natural" | "standard" | "full";
|
|
32
35
|
}): React.JSX.Element;
|
|
33
36
|
export { SettingsField, SettingsSection };
|
|
34
37
|
//# sourceMappingURL=settings-section.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"settings-section.d.ts","sourceRoot":"","sources":["../../src/components/settings-section.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAOL,KAAK,WAAW,EACjB,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"settings-section.d.ts","sourceRoot":"","sources":["../../src/components/settings-section.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAOL,KAAK,WAAW,EACjB,MAAM,QAAQ,CAAC;AAChB,OAAO,EACL,KAAK,EAMN,MAAM,oBAAoB,CAAC;AAE5B,MAAM,MAAM,yBAAyB,GAAG;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,cAAc,CAAC,EAAE,IAAI,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,iBAAS,eAAe,CAAC,EACvB,KAAK,EACL,WAAW,EACX,OAAO,EACP,MAAM,EACN,UAAU,EACV,QAAQ,EACR,SAAS,EACT,OAAmB,EACnB,YAAsB,EACtB,OAAW,EACX,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC,GAAG;IAClD,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAChC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CACjB,qBAwCA;AAED,iBAAS,aAAa,CAAC,EACrB,EAAE,EACF,KAAK,EACL,WAAW,EACX,KAAK,EACL,OAAwB,EACxB,QAAQ,EACR,QAAQ,EACR,WAA0B,EAC1B,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,YAAwB,EACxB,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IACxD,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE;QAAE,YAAY,EAAE,yBAAyB,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IAClF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;CAChD,qBA+CA;AAED,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,CAAC"}
|
|
@@ -1,13 +1,12 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "../lib/utils.js";
|
|
3
3
|
import { FooterStrip } from "../internal/footer-strip.js";
|
|
4
4
|
import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle, } from "./card.js";
|
|
5
|
-
import { Separator } from "./separator.js";
|
|
6
5
|
import { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, } from "./field.js";
|
|
7
|
-
function SettingsSection({ title, description, actions, footer, footerHint, children, className, surface = "resting", ...props }) {
|
|
8
|
-
return (_jsxs(Card, { render: _jsx("section", { ...props, "data-slot": "settings-section" }), surface: surface, className: cn("min-w-0", className), children: [(title || description || actions) && (_jsxs(
|
|
6
|
+
function SettingsSection({ title, description, actions, footer, footerHint, children, className, surface = "resting", presentation = "split", columns = 1, ...props }) {
|
|
7
|
+
return (_jsxs(Card, { render: _jsx("section", { ...props, "data-slot": "settings-section" }), surface: surface, className: cn("@container/settings-section min-w-0", presentation === "form" && "gap-5", className), children: [(title || description || actions) && (_jsxs(CardHeader, { children: [title && (_jsx(CardTitle, { children: _jsx("h2", { children: title }) })), description && _jsx(CardDescription, { children: description }), actions && _jsx(CardAction, { children: actions })] })), children != null ? (_jsx(CardContent, { children: _jsx(FieldGroup, { "data-slot": "settings-section-fields", className: cn((presentation === "form" || columns === 2) && "grid gap-5", columns === 2 && "@2xl/settings-section:grid-cols-2"), children: children }) })) : null, _jsx(FooterStrip, { hint: footerHint, hintSlot: "settings-section-hint", children: footer })] }));
|
|
9
8
|
}
|
|
10
|
-
function SettingsField({ id, label, description, error, invalid = Boolean(error), disabled, required, children, className, contentClassName, controlClassName, ...props }) {
|
|
9
|
+
function SettingsField({ id, label, description, error, invalid = Boolean(error), disabled, required, orientation = "responsive", children, className, contentClassName, controlClassName, controlWidth = "natural", ...props }) {
|
|
11
10
|
const descriptionId = description ? `${id}-description` : undefined;
|
|
12
11
|
const errorId = error ? `${id}-error` : undefined;
|
|
13
12
|
const describedBy = [descriptionId, errorId].filter(Boolean).join(" ");
|
|
@@ -18,6 +17,14 @@ function SettingsField({ id, label, description, error, invalid = Boolean(error)
|
|
|
18
17
|
"aria-invalid": invalid ? true : undefined,
|
|
19
18
|
"aria-describedby": describedBy || undefined,
|
|
20
19
|
};
|
|
21
|
-
return (_jsx("div", { "data-slot": "settings-field", "data-invalid": invalid ? true : undefined, className: "contents", children: _jsxs(Field, { "data-invalid": invalid ? true : undefined, "data-disabled": disabled ? true : undefined, orientation:
|
|
20
|
+
return (_jsx("div", { "data-slot": "settings-field", "data-invalid": invalid ? true : undefined, className: "contents", children: _jsxs(Field, { "data-invalid": invalid ? true : undefined, "data-disabled": disabled ? true : undefined, orientation: orientation, className: cn("items-start", className), ...props, children: [_jsxs(FieldContent, { className: contentClassName, children: [_jsx(FieldLabel, { htmlFor: id, children: label }), description && _jsx(FieldDescription, { id: descriptionId, children: description }), error && _jsx(FieldError, { id: errorId, children: error })] }), _jsx("div", { "data-slot": "settings-field-control", className: cn("flex min-w-0", controlWidth === "standard"
|
|
21
|
+
? "w-full max-w-80 justify-start [&>:not([role=checkbox],[role=switch],[role=radio])]:w-full"
|
|
22
|
+
: controlWidth === "full"
|
|
23
|
+
? "w-full justify-start [&>:not([role=checkbox],[role=switch],[role=radio])]:w-full"
|
|
24
|
+
: orientation === "vertical"
|
|
25
|
+
? "w-full justify-start"
|
|
26
|
+
: orientation === "horizontal"
|
|
27
|
+
? "shrink-0 justify-end"
|
|
28
|
+
: "w-full justify-start @md/field-group:w-auto @md/field-group:min-w-64 @md/field-group:justify-end", controlClassName), children: children({ controlProps }) })] }) }));
|
|
22
29
|
}
|
|
23
30
|
export { SettingsField, SettingsSection };
|
|
@@ -1 +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,uBAAuB,CAAC;AAOjE,iBAAS,KAAK,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,qBAErD;AAED,iBAAS,YAAY,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,CAAC,KAAK,qBAE/D;AAED,iBAAS,UAAU,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,KAAK,qBAE3D;AAgBD,KAAK,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,KAAK,GAAG;IACpD,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B,CAAC;AAEF,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,IAAc,EACd,eAAsB,EACtB,UAAoB,EACpB,GAAG,KAAK,EACT,EAAE,iBAAiB,qBAgCnB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,
|
|
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,uBAAuB,CAAC;AAOjE,iBAAS,KAAK,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,qBAErD;AAED,iBAAS,YAAY,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,CAAC,KAAK,qBAE/D;AAED,iBAAS,UAAU,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,KAAK,qBAE3D;AAgBD,KAAK,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,KAAK,GAAG;IACpD,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B,CAAC;AAEF,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,IAAc,EACd,eAAsB,EACtB,UAAoB,EACpB,GAAG,KAAK,EACT,EAAE,iBAAiB,qBAgCnB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,KAAK,qBAQtE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,WAAW,CAAC,KAAK,qBAQlF;AAED,OAAO,EACL,KAAK,EACL,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,WAAW,EACX,WAAW,EACX,UAAU,EACV,gBAAgB,GACjB,CAAC"}
|
package/dist/components/sheet.js
CHANGED
|
@@ -27,12 +27,12 @@ function SheetHeader({ className, ...props }) {
|
|
|
27
27
|
return (_jsx("div", { "data-slot": "sheet-header", className: cn("flex flex-col gap-0.5 p-nadicode-lg", className), ...props }));
|
|
28
28
|
}
|
|
29
29
|
function SheetFooter({ className, ...props }) {
|
|
30
|
-
return (_jsx("div", { "data-slot": "sheet-footer", className: cn("mt-auto flex flex-col gap-2
|
|
30
|
+
return (_jsx("div", { "data-slot": "sheet-footer", className: cn("mt-auto flex shrink-0 flex-col gap-2 rounded-b-lg border-t border-border bg-recessed px-nadicode-lg py-control-padding-inline", className), ...props }));
|
|
31
31
|
}
|
|
32
32
|
function SheetTitle({ className, ...props }) {
|
|
33
|
-
return (_jsx(SheetPrimitive.Title, { "data-slot": "sheet-title", className: cn("text-
|
|
33
|
+
return (_jsx(SheetPrimitive.Title, { "data-slot": "sheet-title", className: cn("text-heading-sm text-foreground", className), ...props }));
|
|
34
34
|
}
|
|
35
35
|
function SheetDescription({ className, ...props }) {
|
|
36
|
-
return (_jsx(SheetPrimitive.Description, { "data-slot": "sheet-description", className: cn("text-sm text-muted-foreground", className), ...props }));
|
|
36
|
+
return (_jsx(SheetPrimitive.Description, { "data-slot": "sheet-description", className: cn("text-body-sm text-muted-foreground", className), ...props }));
|
|
37
37
|
}
|
|
38
38
|
export { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription, };
|
|
@@ -98,7 +98,7 @@ function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas"
|
|
|
98
98
|
// Adjust the padding for floating and inset variants.
|
|
99
99
|
variant === "floating" || variant === "inset"
|
|
100
100
|
? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+var(--nc-rounded-xs))]"
|
|
101
|
-
: "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l", className), ...props, children: _jsx("div", { "data-sidebar": "sidebar", "data-slot": "sidebar-inner", className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-
|
|
101
|
+
: "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l", className), ...props, children: _jsx("div", { "data-sidebar": "sidebar", "data-slot": "sidebar-inner", className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border-0 group-data-[variant=floating]:bg-popover group-data-[variant=floating]:nc-elevation-floating", children: children }) })] }));
|
|
102
102
|
}
|
|
103
103
|
function SidebarTrigger({ className, onClick, "aria-label": ariaLabel, ...props }) {
|
|
104
104
|
const { toggleSidebar } = useSidebar();
|
|
@@ -116,7 +116,7 @@ function SidebarInset({ className, focusTarget = false, render, ...props }) {
|
|
|
116
116
|
return useRender({
|
|
117
117
|
defaultTagName: "div",
|
|
118
118
|
props: mergeProps({
|
|
119
|
-
className: cn("relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-
|
|
119
|
+
className: cn("relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-lg md:peer-data-[variant=inset]:border md:peer-data-[variant=inset]:border-border md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2", focusTarget && "focus-visible:-outline-offset-[var(--outline-offset-focus)]", className),
|
|
120
120
|
}, props),
|
|
121
121
|
render,
|
|
122
122
|
state: {
|
|
@@ -146,7 +146,7 @@ function SidebarGroupLabel({ className, render, ...props }) {
|
|
|
146
146
|
return useRender({
|
|
147
147
|
defaultTagName: "div",
|
|
148
148
|
props: mergeProps({
|
|
149
|
-
className: cn("flex h-control-height shrink-0 items-center rounded-
|
|
149
|
+
className: cn("flex h-control-height shrink-0 items-center rounded-sm px-2 text-xs font-medium text-sidebar-foreground/70 group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 [&>svg]:size-4 [&>svg]:shrink-0", className),
|
|
150
150
|
}, props),
|
|
151
151
|
render,
|
|
152
152
|
state: {
|
|
@@ -159,7 +159,7 @@ function SidebarGroupAction({ className, render, ...props }) {
|
|
|
159
159
|
return useRender({
|
|
160
160
|
defaultTagName: "button",
|
|
161
161
|
props: mergeProps({
|
|
162
|
-
className: cn("absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-
|
|
162
|
+
className: cn("absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-sm p-0 text-sidebar-foreground group-data-[collapsible=icon]:hidden after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-x-1/2 after:-translate-y-1/2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground [@media(hover:hover)_and_(pointer:fine)]:after:hidden [&>svg]:size-4 [&>svg]:shrink-0", className),
|
|
163
163
|
}, props),
|
|
164
164
|
render,
|
|
165
165
|
state: {
|
|
@@ -177,7 +177,7 @@ function SidebarMenu({ className, ...props }) {
|
|
|
177
177
|
function SidebarMenuItem({ className, ...props }) {
|
|
178
178
|
return (_jsx("li", { "data-slot": "sidebar-menu-item", "data-sidebar": "menu-item", className: cn("group/menu-item relative", className), ...props }));
|
|
179
179
|
}
|
|
180
|
-
const sidebarMenuButtonVariants = cva("nc-transition-paint peer/menu-button group/menu-button flex min-h-touch-target min-w-touch-target w-full items-center gap-2 overflow-hidden rounded-
|
|
180
|
+
const sidebarMenuButtonVariants = cva("nc-transition-paint peer/menu-button group/menu-button flex min-h-touch-target min-w-touch-target w-full items-center gap-2 overflow-hidden rounded-sm border border-transparent p-2 text-left text-sm group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-control-height! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-primary data-active:font-medium data-active:text-sidebar-primary-foreground data-active:hover:bg-sidebar-primary-hover data-active:hover:text-sidebar-primary-foreground [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0 [&_svg]:size-5 group-data-[collapsible=icon]:[&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate", {
|
|
181
181
|
variants: {
|
|
182
182
|
variant: {
|
|
183
183
|
default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
|
|
@@ -223,7 +223,7 @@ function SidebarMenuAction({ className, render, showOnHover = false, ...props })
|
|
|
223
223
|
return useRender({
|
|
224
224
|
defaultTagName: "button",
|
|
225
225
|
props: mergeProps({
|
|
226
|
-
className: cn("absolute top-3 right-1 flex aspect-square w-5 items-center justify-center rounded-
|
|
226
|
+
className: cn("absolute top-3 right-1 flex aspect-square w-5 items-center justify-center rounded-sm p-0 text-sidebar-foreground group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-active/menu-button:text-sidebar-primary-foreground after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-x-1/2 after:-translate-y-1/2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground [@media(hover:hover)_and_(pointer:fine)]:peer-data-[size=default]/menu-button:top-1.5 [@media(hover:hover)_and_(pointer:fine)]:peer-data-[size=lg]/menu-button:top-2.5 [@media(hover:hover)_and_(pointer:fine)]:peer-data-[size=sm]/menu-button:top-1 [@media(hover:hover)_and_(pointer:fine)]:after:hidden [&_svg]:size-4 [&_svg]:shrink-0", showOnHover &&
|
|
227
227
|
"group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 aria-expanded:opacity-100 md:opacity-0", className),
|
|
228
228
|
}, props),
|
|
229
229
|
render,
|
|
@@ -234,14 +234,14 @@ function SidebarMenuAction({ className, render, showOnHover = false, ...props })
|
|
|
234
234
|
});
|
|
235
235
|
}
|
|
236
236
|
function SidebarMenuBadge({ className, ...props }) {
|
|
237
|
-
return (_jsx("div", { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge", className: cn("pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-
|
|
237
|
+
return (_jsx("div", { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge", className: cn("pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-sm px-1 text-xs font-medium text-sidebar-foreground tabular-nums select-none group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 peer-data-active/menu-button:text-sidebar-primary-foreground", className), ...props }));
|
|
238
238
|
}
|
|
239
239
|
function SidebarMenuSkeleton({ className, showIcon = false, ...props }) {
|
|
240
240
|
// Random width between 50 to 90%.
|
|
241
241
|
const [width] = React.useState(() => {
|
|
242
242
|
return `${Math.floor(Math.random() * 40) + 50}%`;
|
|
243
243
|
});
|
|
244
|
-
return (_jsxs("div", { "data-slot": "sidebar-menu-skeleton", "data-sidebar": "menu-skeleton", className: cn("flex h-8 items-center gap-2 rounded-
|
|
244
|
+
return (_jsxs("div", { "data-slot": "sidebar-menu-skeleton", "data-sidebar": "menu-skeleton", className: cn("flex h-8 items-center gap-2 rounded-sm px-2", className), ...props, children: [showIcon && _jsx(Skeleton, { className: "size-4 rounded-sm", "data-sidebar": "menu-skeleton-icon" }), _jsx(Skeleton, { className: "h-4 max-w-(--skeleton-width) flex-1", "data-sidebar": "menu-skeleton-text", style: {
|
|
245
245
|
"--skeleton-width": width,
|
|
246
246
|
} })] }));
|
|
247
247
|
}
|
|
@@ -255,7 +255,7 @@ function SidebarMenuSubButton({ render, size = "md", isActive = false, className
|
|
|
255
255
|
return useRender({
|
|
256
256
|
defaultTagName: "a",
|
|
257
257
|
props: mergeProps({
|
|
258
|
-
className: cn("flex h-7 min-h-touch-target min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-
|
|
258
|
+
className: cn("flex h-7 min-h-touch-target min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-sm border border-transparent px-2 text-sidebar-foreground transition-colors group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[size=md]:text-sm data-[size=sm]:text-xs data-active:bg-sidebar-primary data-active:text-sidebar-primary-foreground data-active:hover:bg-sidebar-primary-hover data-active:hover:text-sidebar-primary-foreground [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0", className),
|
|
259
259
|
}, props),
|
|
260
260
|
render,
|
|
261
261
|
state: {
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
*/
|
|
5
|
-
declare function Skeleton({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
|
|
1
|
+
declare function Skeleton({ className, shape, ...props }: React.ComponentProps<"div"> & {
|
|
2
|
+
shape?: "rectangle" | "circle";
|
|
3
|
+
}): import("react").JSX.Element;
|
|
6
4
|
export { Skeleton };
|
|
7
5
|
//# sourceMappingURL=skeleton.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../src/components/skeleton.tsx"],"names":[],"mappings":"AAEA
|
|
1
|
+
{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../src/components/skeleton.tsx"],"names":[],"mappings":"AAEA,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,KAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,KAAK,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAC;CAChC,+BAQA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "../lib/utils.js";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
* pulse: a page load is the system's work, and only an Agent moves on its own.
|
|
6
|
-
*/
|
|
7
|
-
function Skeleton({ className, ...props }) {
|
|
8
|
-
return _jsx("div", { "data-slot": "skeleton", className: cn("rounded-md bg-muted", className), ...props });
|
|
3
|
+
function Skeleton({ className, shape = "rectangle", ...props }) {
|
|
4
|
+
return (_jsx("div", { "data-slot": "skeleton", className: cn("bg-muted", shape === "circle" ? "rounded-full" : "rounded-sm", className), ...props }));
|
|
9
5
|
}
|
|
10
6
|
export { Skeleton };
|
|
@@ -7,10 +7,10 @@ import { WaitingLine } from "./waiting-line.js";
|
|
|
7
7
|
const Toaster = ({ ...props }) => {
|
|
8
8
|
const { theme = "system" } = useTheme();
|
|
9
9
|
return (_jsx(Sonner, { theme: theme, className: "toaster group", icons: {
|
|
10
|
-
success: _jsx(CircleCheckIcon, { className: "size-4" }),
|
|
11
|
-
info: _jsx(InfoIcon, { className: "size-4" }),
|
|
12
|
-
warning: _jsx(TriangleAlertIcon, { className: "size-4" }),
|
|
13
|
-
error: _jsx(OctagonXIcon, { className: "size-4" }),
|
|
10
|
+
success: _jsx(CircleCheckIcon, { className: "size-4 text-success-soft-foreground" }),
|
|
11
|
+
info: _jsx(InfoIcon, { className: "size-4 text-info-soft-foreground" }),
|
|
12
|
+
warning: _jsx(TriangleAlertIcon, { className: "size-4 text-warning-soft-foreground" }),
|
|
13
|
+
error: _jsx(OctagonXIcon, { className: "size-4 text-destructive-soft-foreground" }),
|
|
14
14
|
// A toast that stays up is already past a second, so its mark is the
|
|
15
15
|
// one waiting line rather than a spinning glyph.
|
|
16
16
|
loading: _jsx(WaitingLine, { className: "w-8", decorative: true }),
|
|
@@ -4,7 +4,7 @@ import { useState } from "react";
|
|
|
4
4
|
import { ChevronRightIcon } from "lucide-react";
|
|
5
5
|
import { cn } from "../lib/utils.js";
|
|
6
6
|
function StatusRow({ children, className, leading, onActivate, trailing, trailingVisible = false, ...props }) {
|
|
7
|
-
return (_jsxs("div", { className: cn("group/status-row flex min-h-6 items-center gap-2 rounded-
|
|
7
|
+
return (_jsxs("div", { className: cn("group/status-row flex min-h-6 items-center gap-2 rounded-sm px-1.5 py-1", onActivate && "cursor-pointer hover:bg-accent", className), "data-slot": "status-row", onClick: onActivate, onKeyDown: onActivate
|
|
8
8
|
? (event) => {
|
|
9
9
|
if (event.key === "Enter" || event.key === " ") {
|
|
10
10
|
event.preventDefault();
|
|
@@ -2,6 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { Switch as SwitchPrimitive } from "@base-ui/react/switch";
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
4
|
function Switch({ className, size = "default", ...props }) {
|
|
5
|
-
return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", "data-size": size, className: cn("nc-transition-paint peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-x-1/2 after:-translate-y-1/2 aria-invalid:border-destructive data-[size=default]:h-
|
|
5
|
+
return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", "data-size": size, className: cn("nc-transition-paint peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent p-px after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-x-1/2 after:-translate-y-1/2 aria-invalid:border-destructive data-[size=default]:h-5 data-[size=default]:w-9 data-[size=sm]:h-4 data-[size=sm]:w-7 data-checked:bg-primary data-unchecked:bg-input data-disabled:cursor-not-allowed data-disabled:opacity-50 [@media(hover:hover)_and_(pointer:fine)]:after:hidden", className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: "nc-transition-transform pointer-events-none block rounded-full bg-background ring-0 group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-full group-data-[size=sm]/switch:data-checked:translate-x-full group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0" }) }));
|
|
6
6
|
}
|
|
7
7
|
export { Switch };
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { tableCompactLayouts, type TableCompactLayout } from "./table-layouts.js";
|
|
3
|
-
declare function Table({ className, compactDetails, ...props }: React.ComponentProps<"table"> & {
|
|
3
|
+
declare function Table({ className, compactDetails, density, variant, interactive, ...props }: React.ComponentProps<"table"> & {
|
|
4
4
|
compactDetails?: TableCompactLayout;
|
|
5
|
+
density?: "default" | "comfortable";
|
|
6
|
+
variant?: "default" | "striped" | "bordered";
|
|
7
|
+
interactive?: boolean;
|
|
5
8
|
}): React.JSX.Element;
|
|
6
9
|
declare function TableHeader({ className, ...props }: React.ComponentProps<"thead">): React.JSX.Element;
|
|
7
10
|
declare function TableBody({ className, ...props }: React.ComponentProps<"tbody">): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/components/table.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,mBAAmB,EAAE,KAAK,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAE1F,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,cAAc,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG;
|
|
1
|
+
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/components/table.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,mBAAmB,EAAE,KAAK,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAE1F,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,cAAc,EACd,OAAmB,EACnB,OAAmB,EACnB,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG;IACjC,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACpC,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IAC7C,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,qBAyBA;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,qBAQ1E;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,qBAWxE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,qBAW/E;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,qBAW1E;AAED,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG;IAC9B,6GAA6G;IAC7G,YAAY,CAAC,EAAE,kBAAkB,CAAC;CACnC,qBAYA;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAWrE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAWrE;AAED,iBAAS,cAAc,CAAC,EACtB,OAAO,EACP,KAAK,EACL,MAAmB,GACpB,EAAE;IACD,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,KAAK,EAAE,SAAS;QACd,EAAE,EAAE,MAAM,CAAC;QACX,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,OAAO,CAAC,EAAE,OAAO,CAAC;KACnB,EAAE,CAAC;CACL,qBA8BA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,qBAQ7E;AAED,OAAO,EACL,KAAK,EACL,WAAW,EACX,SAAS,EACT,gBAAgB,EAChB,WAAW,EACX,SAAS,EACT,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,cAAc,EACd,mBAAmB,EACnB,KAAK,kBAAkB,GACxB,CAAC"}
|