@stll/ui 0.42.0 → 0.43.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/dist/components/button.d.ts +2 -2
- package/dist/components/date-picker-popover.js +6 -1
- package/dist/components/details-grid.d.ts +10 -0
- package/dist/components/details-grid.js +26 -0
- package/dist/components/dialog-form-state.d.ts +16 -0
- package/dist/components/dialog-form-state.js +28 -0
- package/dist/components/dialog.d.ts +12 -2
- package/dist/components/dialog.js +89 -23
- package/dist/components/form.d.ts +4 -1
- package/dist/components/form.js +8 -3
- package/dist/components/inline-rename.d.ts +12 -0
- package/dist/components/inline-rename.js +75 -0
- package/dist/components/menu.js +4 -4
- package/dist/components/sidebar.d.ts +2 -2
- package/dist/components/split-button.d.ts +35 -0
- package/dist/components/split-button.js +64 -0
- package/dist/components/toolbar-icon-action.d.ts +17 -0
- package/dist/components/toolbar-icon-action.js +23 -0
- package/dist/css.d.ts +3 -0
- package/dist/index.d.ts +5 -2
- package/dist/index.js +5 -2
- package/dist/lib/control-size.d.ts +1 -1
- package/dist/styles/inline-rename.css +69 -0
- package/dist/styles/theme.css +2 -0
- package/package.json +18 -2
|
@@ -13,8 +13,8 @@ import { VariantProps } from "class-variance-authority";
|
|
|
13
13
|
*/
|
|
14
14
|
declare const buttonAccessibleDisabledClass = "cursor-not-allowed opacity-64";
|
|
15
15
|
declare const buttonVariants: (props?: ({
|
|
16
|
-
size?: "
|
|
17
|
-
variant?: "link" | "
|
|
16
|
+
size?: "default" | "chip" | "icon" | "icon-lg" | "icon-sm" | "icon-xl" | "icon-xs" | "lg" | "row" | "sm" | "xl" | "xs" | null | undefined;
|
|
17
|
+
variant?: "link" | "destructive" | "muted" | "default" | "destructive-outline" | "destructive-ghost" | "ghost" | "outline" | "secondary" | null | undefined;
|
|
18
18
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
19
19
|
type ButtonProps = {
|
|
20
20
|
variant?: VariantProps<typeof buttonVariants>["variant"];
|
|
@@ -427,6 +427,10 @@ const DatePickerPopoverContent = (props) => {
|
|
|
427
427
|
const selectedMonth = value ? Temporal.PlainDate.from(value).month - 1 : null;
|
|
428
428
|
const handleOpenChange = (open) => {
|
|
429
429
|
onOpenChange?.(open);
|
|
430
|
+
if (open) {
|
|
431
|
+
setViewMonthOverride(null);
|
|
432
|
+
setFocusedDate(value || today);
|
|
433
|
+
}
|
|
430
434
|
if (!open) {
|
|
431
435
|
setView("days");
|
|
432
436
|
setDecadeBaseOverride(decadeStart(viewYear));
|
|
@@ -452,7 +456,7 @@ const DatePickerPopoverContent = (props) => {
|
|
|
452
456
|
children: [
|
|
453
457
|
showIcon && /* @__PURE__ */ jsx(CalendarIcon, { className: "size-3.5 shrink-0" }),
|
|
454
458
|
/* @__PURE__ */ jsx("span", {
|
|
455
|
-
className: "min-w-0 flex-1
|
|
459
|
+
className: "min-w-0 flex-1 truncate text-start",
|
|
456
460
|
id: labelledBy ? displayValueId : void 0,
|
|
457
461
|
children: displayLabel
|
|
458
462
|
}),
|
|
@@ -462,6 +466,7 @@ const DatePickerPopoverContent = (props) => {
|
|
|
462
466
|
})
|
|
463
467
|
]
|
|
464
468
|
}), /* @__PURE__ */ jsx(PopoverPopup, {
|
|
469
|
+
initialFocus: () => gridRef.current?.querySelector(`[data-date="${value || today}"]`) ?? gridRef.current,
|
|
465
470
|
className: "data-starting-style:scale-100",
|
|
466
471
|
layer,
|
|
467
472
|
padding: "sm",
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
//#region src/components/details-grid.d.ts
|
|
3
|
+
declare const DetailsGrid: ({ className, ...props }: React$1.ComponentProps<"dl">) => React$1.JSX.Element;
|
|
4
|
+
type DetailsItemProps = React$1.ComponentProps<"div"> & {
|
|
5
|
+
label: React$1.ReactNode;
|
|
6
|
+
span?: "wide";
|
|
7
|
+
};
|
|
8
|
+
declare const DetailsItem: ({ label, children, span, className, ...props }: DetailsItemProps) => React$1.JSX.Element;
|
|
9
|
+
//#endregion
|
|
10
|
+
export { DetailsGrid, DetailsItem };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
//#region src/components/details-grid.tsx
|
|
4
|
+
const DetailsGrid = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
|
|
5
|
+
className: "@container min-w-0",
|
|
6
|
+
"data-slot": "details-grid-container",
|
|
7
|
+
children: /* @__PURE__ */ jsx("dl", {
|
|
8
|
+
className: cn("grid grid-cols-[repeat(auto-fit,minmax(min(100%,20rem),1fr))] gap-x-6 gap-y-2 font-sans @min-[64rem]:grid-cols-3", className),
|
|
9
|
+
"data-slot": "details-grid",
|
|
10
|
+
...props
|
|
11
|
+
})
|
|
12
|
+
});
|
|
13
|
+
const DetailsItem = ({ label, children, span, className, ...props }) => /* @__PURE__ */ jsxs("div", {
|
|
14
|
+
className: cn("grid min-w-0 grid-cols-[minmax(0,7rem)_minmax(0,1fr)] items-start gap-x-4 text-xs", span === "wide" && "col-span-full", className),
|
|
15
|
+
"data-slot": "details-item",
|
|
16
|
+
...props,
|
|
17
|
+
children: [/* @__PURE__ */ jsx("dt", {
|
|
18
|
+
className: "text-foreground-disabled min-w-0 font-medium tracking-wide wrap-anywhere uppercase",
|
|
19
|
+
children: label
|
|
20
|
+
}), /* @__PURE__ */ jsx("dd", {
|
|
21
|
+
className: "text-foreground-strong-muted min-w-0 wrap-anywhere",
|
|
22
|
+
children
|
|
23
|
+
})]
|
|
24
|
+
});
|
|
25
|
+
//#endregion
|
|
26
|
+
export { DetailsGrid, DetailsItem };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
//#region src/components/dialog-form-state.d.ts
|
|
2
|
+
export type DialogFormSource = {
|
|
3
|
+
dirty: boolean;
|
|
4
|
+
onDiscard?: (() => void) | undefined;
|
|
5
|
+
};
|
|
6
|
+
export type DialogFormRegistry = {
|
|
7
|
+
sources: Map<string, DialogFormSource>;
|
|
8
|
+
clearConfirmation: () => void;
|
|
9
|
+
};
|
|
10
|
+
export declare const DialogFormContext: import("react").Context<DialogFormRegistry | null>;
|
|
11
|
+
/** Forms report semantic changes, including edits made by custom controls. */
|
|
12
|
+
export declare const DialogFormState: ({ dirty, onDiscard }: {
|
|
13
|
+
dirty: boolean;
|
|
14
|
+
onDiscard?: (() => void) | undefined;
|
|
15
|
+
}) => null;
|
|
16
|
+
//#endregion
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { createContext, useContext, useId, useLayoutEffect } from "react";
|
|
3
|
+
//#region src/components/dialog-form-state.tsx
|
|
4
|
+
const DialogFormContext = createContext(null);
|
|
5
|
+
/** Forms report semantic changes, including edits made by custom controls. */
|
|
6
|
+
const DialogFormState = ({ dirty, onDiscard }) => {
|
|
7
|
+
const registry = useContext(DialogFormContext);
|
|
8
|
+
const id = useId();
|
|
9
|
+
useLayoutEffect(() => {
|
|
10
|
+
if (registry === null) return;
|
|
11
|
+
if (registry.sources.get(id)?.dirty !== dirty) registry.clearConfirmation();
|
|
12
|
+
registry.sources.set(id, {
|
|
13
|
+
dirty,
|
|
14
|
+
onDiscard
|
|
15
|
+
});
|
|
16
|
+
}, [
|
|
17
|
+
dirty,
|
|
18
|
+
id,
|
|
19
|
+
onDiscard,
|
|
20
|
+
registry
|
|
21
|
+
]);
|
|
22
|
+
useLayoutEffect(() => () => {
|
|
23
|
+
registry?.sources.delete(id);
|
|
24
|
+
}, [id, registry]);
|
|
25
|
+
return null;
|
|
26
|
+
};
|
|
27
|
+
//#endregion
|
|
28
|
+
export { DialogFormContext, DialogFormState };
|
|
@@ -1,9 +1,19 @@
|
|
|
1
1
|
import { OverlayLayer } from "../lib/overlay-layer.js";
|
|
2
|
+
import { DialogFormState } from "./dialog-form-state.js";
|
|
2
3
|
import * as React$1 from "react";
|
|
3
4
|
import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
|
|
4
5
|
//#region src/components/dialog.d.ts
|
|
5
6
|
declare const DialogCreateHandle: typeof Dialog$1.createHandle;
|
|
6
|
-
|
|
7
|
+
type DialogLabels = {
|
|
8
|
+
close: string;
|
|
9
|
+
unsavedChanges: string;
|
|
10
|
+
};
|
|
11
|
+
declare const DialogProvider: ({ labels, children }: React$1.PropsWithChildren<{
|
|
12
|
+
labels: DialogLabels;
|
|
13
|
+
}>) => React$1.JSX.Element;
|
|
14
|
+
declare const Dialog: <Payload>({ dirty, onOpenChange, onOpenChangeComplete, ...props }: Dialog$1.Root.Props<Payload> & {
|
|
15
|
+
dirty?: boolean;
|
|
16
|
+
}) => React$1.JSX.Element;
|
|
7
17
|
declare const DialogPortal: React$1.ForwardRefExoticComponent<Omit<import("@base-ui/react").AlertDialogPortalProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
8
18
|
declare function DialogTrigger({ tooltip, ...props }: Dialog$1.Trigger.Props & {
|
|
9
19
|
tooltip?: React$1.ReactNode;
|
|
@@ -34,4 +44,4 @@ declare const DialogPanel: ({ className, scrollFade, ...props }: React$1.Compone
|
|
|
34
44
|
scrollFade?: boolean;
|
|
35
45
|
}) => React$1.JSX.Element;
|
|
36
46
|
//#endregion
|
|
37
|
-
export { Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogPanel, DialogPortal, DialogTitle, DialogTrigger, DialogViewport };
|
|
47
|
+
export { Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogFormState, DialogHeader, DialogPanel, DialogPortal, DialogProvider, DialogTitle, DialogTrigger, DialogViewport };
|
|
@@ -5,11 +5,62 @@ import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
|
|
|
5
5
|
import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
|
|
6
6
|
import { Button } from "./button.js";
|
|
7
7
|
import { ScrollArea } from "./scroll-area.js";
|
|
8
|
+
import { DialogFormContext, DialogFormState } from "./dialog-form-state.js";
|
|
8
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
+
import { createContext, useContext, useRef, useState } from "react";
|
|
9
11
|
import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
|
|
10
12
|
//#region src/components/dialog.tsx
|
|
11
13
|
const DialogCreateHandle = Dialog$1.createHandle;
|
|
12
|
-
const
|
|
14
|
+
const DialogLabelsContext = createContext({
|
|
15
|
+
close: "Close",
|
|
16
|
+
unsavedChanges: "Unsaved changes. Press Esc again to discard"
|
|
17
|
+
});
|
|
18
|
+
const DialogProvider = ({ labels, children }) => /* @__PURE__ */ jsx(DialogLabelsContext, {
|
|
19
|
+
value: labels,
|
|
20
|
+
children
|
|
21
|
+
});
|
|
22
|
+
const DialogDismissalContext = createContext("idle");
|
|
23
|
+
const Dialog = ({ dirty = false, onOpenChange, onOpenChangeComplete, ...props }) => {
|
|
24
|
+
const [dismissal, setDismissal] = useState("idle");
|
|
25
|
+
const pendingDiscard = useRef([]);
|
|
26
|
+
const [forms] = useState(() => ({
|
|
27
|
+
sources: /* @__PURE__ */ new Map(),
|
|
28
|
+
clearConfirmation: () => setDismissal("idle")
|
|
29
|
+
}));
|
|
30
|
+
return /* @__PURE__ */ jsx(DialogFormContext, {
|
|
31
|
+
value: forms,
|
|
32
|
+
children: /* @__PURE__ */ jsx(DialogDismissalContext, {
|
|
33
|
+
value: dismissal,
|
|
34
|
+
children: /* @__PURE__ */ jsx(Dialog$1.Root, {
|
|
35
|
+
...props,
|
|
36
|
+
onOpenChange: (open, details) => {
|
|
37
|
+
const hasChanges = dirty || [...forms.sources.values()].some((source) => source.dirty);
|
|
38
|
+
if (!open && details.reason === "escape-key" && hasChanges && (dismissal === "idle" || details.event.repeat)) {
|
|
39
|
+
details.cancel();
|
|
40
|
+
setDismissal("confirm-discard");
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
onOpenChange?.(open, details);
|
|
44
|
+
if (details.isCanceled) return;
|
|
45
|
+
pendingDiscard.current = [];
|
|
46
|
+
if (!open) {
|
|
47
|
+
for (const source of forms.sources.values()) if (source.dirty && source.onDiscard !== void 0) pendingDiscard.current.push(source.onDiscard);
|
|
48
|
+
}
|
|
49
|
+
setDismissal("idle");
|
|
50
|
+
},
|
|
51
|
+
onOpenChangeComplete: (open) => {
|
|
52
|
+
if (!open) {
|
|
53
|
+
const callbacks = pendingDiscard.current;
|
|
54
|
+
pendingDiscard.current = [];
|
|
55
|
+
for (const discard of callbacks) discard();
|
|
56
|
+
setDismissal("idle");
|
|
57
|
+
}
|
|
58
|
+
onOpenChangeComplete?.(open);
|
|
59
|
+
}
|
|
60
|
+
})
|
|
61
|
+
})
|
|
62
|
+
});
|
|
63
|
+
};
|
|
13
64
|
const DialogPortal = Dialog$1.Portal;
|
|
14
65
|
function DialogTrigger({ tooltip, ...props }) {
|
|
15
66
|
return renderTooltipTrigger({
|
|
@@ -39,27 +90,42 @@ const DialogViewport = ({ className, layer = "default", ...props }) => /* @__PUR
|
|
|
39
90
|
"data-slot": "dialog-viewport",
|
|
40
91
|
...props
|
|
41
92
|
});
|
|
42
|
-
const DialogPopup = ({ backdropClassName, className, children, showCloseButton = true, bottomStickOnMobile = true, layer = "default", viewportClassName, ...props }) =>
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
className: cn(
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
"
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
})
|
|
93
|
+
const DialogPopup = ({ backdropClassName, className, children, showCloseButton = true, bottomStickOnMobile = true, layer = "default", viewportClassName, ...props }) => {
|
|
94
|
+
const dismissal = useContext(DialogDismissalContext);
|
|
95
|
+
const labels = useContext(DialogLabelsContext);
|
|
96
|
+
return /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogBackdrop, {
|
|
97
|
+
className: backdropClassName,
|
|
98
|
+
layer
|
|
99
|
+
}), /* @__PURE__ */ jsx(DialogViewport, {
|
|
100
|
+
className: cn(bottomStickOnMobile && "max-sm:grid-rows-[1fr_auto] max-sm:p-0 max-sm:pt-12", viewportClassName),
|
|
101
|
+
layer,
|
|
102
|
+
children: /* @__PURE__ */ jsxs(Dialog$1.Popup, {
|
|
103
|
+
className: cn("bg-popover text-popover-foreground relative row-start-2 flex max-h-full min-h-0 w-full max-w-lg min-w-0 -translate-y-[calc(1.25rem*var(--nested-dialogs))] scale-[calc(1-0.1*var(--nested-dialogs))] flex-col rounded-2xl border opacity-[calc(1-0.1*var(--nested-dialogs))] shadow-lg/5 transition-[scale,opacity,translate] duration-200 ease-in-out will-change-transform not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-2xl)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] data-ending-style:scale-98 data-ending-style:opacity-0 data-nested:data-ending-style:translate-y-8 data-nested-dialog-open:origin-top data-starting-style:scale-98 data-starting-style:opacity-0 data-nested:data-starting-style:translate-y-8 dark:before:shadow-[0_-1px_--theme(--color-white/6%)]", bottomStickOnMobile && "max-sm:max-w-none max-sm:rounded-none max-sm:border-x-0 max-sm:border-t max-sm:border-b-0 max-sm:opacity-[calc(1-min(var(--nested-dialogs),1))] max-sm:before:hidden max-sm:before:rounded-none max-sm:data-ending-style:translate-y-4 max-sm:data-starting-style:translate-y-4", className),
|
|
104
|
+
"data-slot": "dialog-popup",
|
|
105
|
+
...props,
|
|
106
|
+
children: [
|
|
107
|
+
dismissal === "confirm-discard" && /* @__PURE__ */ jsx("div", {
|
|
108
|
+
className: "flex shrink-0 justify-end ps-2 pe-12 pt-2",
|
|
109
|
+
children: /* @__PURE__ */ jsx("span", {
|
|
110
|
+
className: "text-muted-foreground max-w-64 px-2 py-1 text-xs",
|
|
111
|
+
role: "status",
|
|
112
|
+
children: labels.unsavedChanges
|
|
113
|
+
})
|
|
114
|
+
}),
|
|
115
|
+
children,
|
|
116
|
+
(showCloseButton || dismissal === "confirm-discard") && /* @__PURE__ */ jsx(Dialog$1.Close, {
|
|
117
|
+
"aria-label": labels.close,
|
|
118
|
+
className: "absolute end-2 top-2",
|
|
119
|
+
render: /* @__PURE__ */ jsx(Button, {
|
|
120
|
+
size: "icon",
|
|
121
|
+
variant: "ghost"
|
|
122
|
+
}),
|
|
123
|
+
children: /* @__PURE__ */ jsx(XIcon, {})
|
|
124
|
+
})
|
|
125
|
+
]
|
|
126
|
+
})
|
|
127
|
+
})] });
|
|
128
|
+
};
|
|
63
129
|
const DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
|
|
64
130
|
className: cn("flex flex-col gap-2 p-6 in-[[data-slot=dialog-popup]:has([data-slot=dialog-panel])]:pb-3 max-sm:pb-4", className),
|
|
65
131
|
"data-slot": "dialog-header",
|
|
@@ -89,4 +155,4 @@ const DialogPanel = ({ className, scrollFade = true, ...props }) => /* @__PURE__
|
|
|
89
155
|
})
|
|
90
156
|
});
|
|
91
157
|
//#endregion
|
|
92
|
-
export { Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogPanel, DialogPortal, DialogTitle, DialogTrigger, DialogViewport };
|
|
158
|
+
export { Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogFormState, DialogHeader, DialogPanel, DialogPortal, DialogProvider, DialogTitle, DialogTrigger, DialogViewport };
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import { Form as Form$1 } from "@base-ui/react/form";
|
|
2
2
|
//#region src/components/form.d.ts
|
|
3
|
-
declare const Form: ({ className, ...props }: Form$1.Props
|
|
3
|
+
declare const Form: ({ className, dirty, onDiscard, children, ...props }: Form$1.Props & {
|
|
4
|
+
dirty?: boolean;
|
|
5
|
+
onDiscard?: (() => void) | undefined;
|
|
6
|
+
}) => import("react").JSX.Element;
|
|
4
7
|
//#endregion
|
|
5
8
|
export { Form };
|
package/dist/components/form.js
CHANGED
|
@@ -1,12 +1,17 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../lib/utils.js";
|
|
3
|
-
import {
|
|
3
|
+
import { DialogFormState } from "./dialog-form-state.js";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
5
|
import { Form as Form$1 } from "@base-ui/react/form";
|
|
5
6
|
//#region src/components/form.tsx
|
|
6
|
-
const Form = ({ className, ...props }) => /* @__PURE__ */
|
|
7
|
+
const Form = ({ className, dirty = false, onDiscard, children, ...props }) => /* @__PURE__ */ jsxs(Form$1, {
|
|
7
8
|
className: cn("flex w-full flex-col gap-4", className),
|
|
8
9
|
"data-slot": "form",
|
|
9
|
-
...props
|
|
10
|
+
...props,
|
|
11
|
+
children: [/* @__PURE__ */ jsx(DialogFormState, {
|
|
12
|
+
dirty,
|
|
13
|
+
onDiscard
|
|
14
|
+
}), children]
|
|
10
15
|
});
|
|
11
16
|
//#endregion
|
|
12
17
|
export { Form };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { ComponentProps } from "react";
|
|
2
|
+
//#region src/components/inline-rename.d.ts
|
|
3
|
+
type InlineRenameInputProps = Omit<ComponentProps<"input">, "value" | "onChange" | "onKeyDown" | "size"> & {
|
|
4
|
+
value: string;
|
|
5
|
+
onValueChange: (value: string) => void;
|
|
6
|
+
onCommit: () => void;
|
|
7
|
+
onCancel: () => void;
|
|
8
|
+
/** Fill the parent's row instead of sizing to the text. */
|
|
9
|
+
fill?: boolean;
|
|
10
|
+
};
|
|
11
|
+
export declare const InlineRenameInput: ({ value, onValueChange, onCommit, onCancel, onBlur, className, ref, dir, fill, ...props }: InlineRenameInputProps) => import("react").JSX.Element;
|
|
12
|
+
//#endregion
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import { contentDir, isStructuredInputType } from "../hooks/use-content-dir.js";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
import { useCallback, useImperativeHandle, useRef } from "react";
|
|
5
|
+
import { panic } from "better-result";
|
|
6
|
+
//#region src/components/inline-rename.tsx
|
|
7
|
+
/** Content-sized rename field; the title's parent owns its typography. */
|
|
8
|
+
const mirrorTextFor = (value, placeholder) => {
|
|
9
|
+
if (value !== "") return value;
|
|
10
|
+
if (placeholder !== void 0 && placeholder !== "") return placeholder;
|
|
11
|
+
return "";
|
|
12
|
+
};
|
|
13
|
+
const InlineRenameInput = ({ value, onValueChange, onCommit, onCancel, onBlur, className, ref, dir, fill = false, ...props }) => {
|
|
14
|
+
const finishedValue = useRef(null);
|
|
15
|
+
const inputRef = useRef(null);
|
|
16
|
+
useImperativeHandle(ref, () => {
|
|
17
|
+
if (!inputRef.current) panic("Inline rename input must be mounted before exposing its ref");
|
|
18
|
+
return inputRef.current;
|
|
19
|
+
}, []);
|
|
20
|
+
const focusInput = useCallback((input) => {
|
|
21
|
+
inputRef.current = input;
|
|
22
|
+
if (!input) return;
|
|
23
|
+
input.focus();
|
|
24
|
+
input.select();
|
|
25
|
+
}, []);
|
|
26
|
+
const mirrorText = mirrorTextFor(value, props.placeholder);
|
|
27
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
28
|
+
className: cn(className),
|
|
29
|
+
"data-fill": fill ? "" : void 0,
|
|
30
|
+
"data-slot": "inline-rename",
|
|
31
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
32
|
+
"aria-hidden": "true",
|
|
33
|
+
"data-slot": "inline-rename-mirror",
|
|
34
|
+
children: mirrorText
|
|
35
|
+
}), /* @__PURE__ */ jsx("input", {
|
|
36
|
+
...props,
|
|
37
|
+
"data-slot": "inline-rename-input",
|
|
38
|
+
dir: dir ?? (isStructuredInputType(props.type) ? "ltr" : contentDir(value)),
|
|
39
|
+
size: void 0,
|
|
40
|
+
onBlur: (event) => {
|
|
41
|
+
if (finishedValue.current === value) {
|
|
42
|
+
event.stopPropagation();
|
|
43
|
+
return;
|
|
44
|
+
}
|
|
45
|
+
if (onBlur) {
|
|
46
|
+
onBlur(event);
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
finishedValue.current = value;
|
|
50
|
+
onCommit();
|
|
51
|
+
},
|
|
52
|
+
onChange: (event) => {
|
|
53
|
+
finishedValue.current = null;
|
|
54
|
+
onValueChange(event.currentTarget.value);
|
|
55
|
+
},
|
|
56
|
+
onClick: (event) => event.stopPropagation(),
|
|
57
|
+
onKeyDown: (event) => {
|
|
58
|
+
event.stopPropagation();
|
|
59
|
+
if (event.nativeEvent.isComposing) return;
|
|
60
|
+
if (event.key !== "Enter" && event.key !== "Escape") return;
|
|
61
|
+
event.preventDefault();
|
|
62
|
+
finishedValue.current = value;
|
|
63
|
+
if (event.key === "Escape") {
|
|
64
|
+
onCancel();
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
onCommit();
|
|
68
|
+
},
|
|
69
|
+
ref: focusInput,
|
|
70
|
+
value
|
|
71
|
+
})]
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
//#endregion
|
|
75
|
+
export { InlineRenameInput };
|
package/dist/components/menu.js
CHANGED
|
@@ -44,7 +44,7 @@ const MenuGroup = (props) => /* @__PURE__ */ jsx(Menu$1.Group, {
|
|
|
44
44
|
...props
|
|
45
45
|
});
|
|
46
46
|
const MenuItem = ({ className, inset, variant = "default", ...props }) => /* @__PURE__ */ jsx(Menu$1.Item, {
|
|
47
|
-
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[variant=destructive]:text-destructive-foreground flex min-h-8 cursor-pointer items-center gap-2 rounded-sm px-2 py-1 text-base outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-64 data-inset:ps-8 sm:min-h-7 sm:text-sm [&>svg]:pointer-events-none [&>svg]:-mx-0.5 [&>svg]:shrink-0 [&>svg:not([class*='opacity-'])]:opacity-80 [&>svg:not([class*='size-'])]:size-4.5 sm:[&>svg:not([class*='size-'])]:size-4", className),
|
|
47
|
+
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[variant=destructive]:text-destructive-foreground flex min-h-8 cursor-pointer items-center gap-2 rounded-sm px-2 py-1 text-base outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-64 data-inset:ps-8 sm:min-h-7 sm:text-sm pointer-coarse:min-h-11 [&>svg]:pointer-events-none [&>svg]:-mx-0.5 [&>svg]:shrink-0 [&>svg:not([class*='opacity-'])]:opacity-80 [&>svg:not([class*='size-'])]:size-4.5 sm:[&>svg:not([class*='size-'])]:size-4", className),
|
|
48
48
|
"data-inset": inset,
|
|
49
49
|
"data-slot": "menu-item",
|
|
50
50
|
"data-variant": variant,
|
|
@@ -52,7 +52,7 @@ const MenuItem = ({ className, inset, variant = "default", ...props }) => /* @__
|
|
|
52
52
|
});
|
|
53
53
|
const MenuCheckboxItem = ({ className, children, checked, variant = "default", ...props }) => /* @__PURE__ */ jsx(Menu$1.CheckboxItem, {
|
|
54
54
|
checked,
|
|
55
|
-
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground grid min-h-8 cursor-pointer items-center gap-2 rounded-sm py-1 ps-2 text-base outline-none in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", variant === "switch" ? "grid-cols-[1fr_auto] gap-4 pe-1.5" : "grid-cols-[1rem_minmax(0,1fr)] pe-4", className),
|
|
55
|
+
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground grid min-h-8 cursor-pointer items-center gap-2 rounded-sm py-1 ps-2 text-base outline-none in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-7 sm:text-sm pointer-coarse:min-h-11 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", variant === "switch" ? "grid-cols-[1fr_auto] gap-4 pe-1.5" : "grid-cols-[1rem_minmax(0,1fr)] pe-4", className),
|
|
56
56
|
"data-slot": "menu-checkbox-item",
|
|
57
57
|
...props,
|
|
58
58
|
children: variant === "switch" ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
|
|
@@ -86,7 +86,7 @@ const MenuRadioGroup = (props) => /* @__PURE__ */ jsx(Menu$1.RadioGroup, {
|
|
|
86
86
|
...props
|
|
87
87
|
});
|
|
88
88
|
const MenuRadioItem = ({ className, children, indicator = "check", ...props }) => /* @__PURE__ */ jsx(Menu$1.RadioItem, {
|
|
89
|
-
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground min-h-8 cursor-pointer items-center gap-2 rounded-sm py-1 text-base outline-none in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", indicator === "check" ? "grid grid-cols-[1rem_minmax(0,1fr)] ps-2 pe-4" : "flex px-2", className),
|
|
89
|
+
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground min-h-8 cursor-pointer items-center gap-2 rounded-sm py-1 text-base outline-none in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-7 sm:text-sm pointer-coarse:min-h-11 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", indicator === "check" ? "grid grid-cols-[1rem_minmax(0,1fr)] ps-2 pe-4" : "flex px-2", className),
|
|
90
90
|
"data-slot": "menu-radio-item",
|
|
91
91
|
...props,
|
|
92
92
|
children: indicator === "check" ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu$1.RadioItemIndicator, {
|
|
@@ -129,7 +129,7 @@ const MenuSub = (props) => /* @__PURE__ */ jsx(Menu$1.SubmenuRoot, {
|
|
|
129
129
|
...props
|
|
130
130
|
});
|
|
131
131
|
const MenuSubTrigger = ({ className, inset, children, ...props }) => /* @__PURE__ */ jsxs(Menu$1.SubmenuTrigger, {
|
|
132
|
-
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground data-popup-open:bg-accent data-popup-open:text-accent-foreground flex min-h-8 cursor-pointer items-center gap-2 rounded-sm px-2 py-1 text-base outline-none data-disabled:pointer-events-none data-disabled:opacity-64 data-inset:ps-8 sm:min-h-7 sm:text-sm [&_svg]:pointer-events-none [&_svg]:-mx-0.5 [&_svg]:shrink-0 [&_svg:not([class*='opacity-'])]:opacity-80 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", className),
|
|
132
|
+
className: cn("text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground data-popup-open:bg-accent data-popup-open:text-accent-foreground flex min-h-8 cursor-pointer items-center gap-2 rounded-sm px-2 py-1 text-base outline-none data-disabled:pointer-events-none data-disabled:opacity-64 data-inset:ps-8 sm:min-h-7 sm:text-sm pointer-coarse:min-h-11 [&_svg]:pointer-events-none [&_svg]:-mx-0.5 [&_svg]:shrink-0 [&_svg:not([class*='opacity-'])]:opacity-80 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", className),
|
|
133
133
|
"data-inset": inset,
|
|
134
134
|
"data-slot": "menu-sub-trigger",
|
|
135
135
|
...props,
|
|
@@ -33,7 +33,7 @@ declare function useSidebarLayout(): SidebarLayout;
|
|
|
33
33
|
* left for the content column. Mobile reports 0: there the sidebar is an
|
|
34
34
|
* overlay sheet and occupies no layout width.
|
|
35
35
|
*/
|
|
36
|
-
declare function useSidebarInlineSize(): 0 |
|
|
36
|
+
declare function useSidebarInlineSize(): 0 | 256 | 48;
|
|
37
37
|
declare const SidebarProvider: ({ defaultOpen, forceCollapsed, open: openProp, onOpenChange: setOpenProp, className, style, children, ...props }: React.ComponentProps<"div"> & {
|
|
38
38
|
defaultOpen?: boolean;
|
|
39
39
|
forceCollapsed?: boolean;
|
|
@@ -86,7 +86,7 @@ declare const SidebarMenu: ({ className, ...props }: React.ComponentProps<"ul">)
|
|
|
86
86
|
declare const SidebarMenuItem: ({ className, ...props }: React.ComponentProps<"li">) => import("react").JSX.Element;
|
|
87
87
|
declare const sidebarMenuButtonVariants: (props?: ({
|
|
88
88
|
variant?: "default" | "outline" | null | undefined;
|
|
89
|
-
size?: "default" | "
|
|
89
|
+
size?: "default" | "lg" | "sm" | "rail" | null | undefined;
|
|
90
90
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
91
91
|
/**
|
|
92
92
|
* The footer's avatar trigger, signed in (user menu) or not (sign-in): a
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { Button } from "./button.js";
|
|
2
|
+
import { DropdownMenu as Menu } from "./menu.js";
|
|
3
|
+
import { Popover } from "./popover.js";
|
|
4
|
+
import { ComponentProps, ReactNode } from "react";
|
|
5
|
+
//#region src/components/split-button.d.ts
|
|
6
|
+
type SplitButtonSharedProps = {
|
|
7
|
+
menuLabel: string;
|
|
8
|
+
primaryDescriptionId?: string;
|
|
9
|
+
menuDescriptionId?: string;
|
|
10
|
+
onPrimaryClick: NonNullable<ComponentProps<typeof Button>["onClick"]>;
|
|
11
|
+
menu: ReactNode;
|
|
12
|
+
primaryDisabled?: boolean;
|
|
13
|
+
menuDisabled?: boolean;
|
|
14
|
+
size?: "sm" | "md";
|
|
15
|
+
className?: string;
|
|
16
|
+
};
|
|
17
|
+
type SplitButtonPrimary = {
|
|
18
|
+
children: ReactNode;
|
|
19
|
+
primaryLabel: string;
|
|
20
|
+
} | {
|
|
21
|
+
children: string;
|
|
22
|
+
primaryLabel?: never;
|
|
23
|
+
};
|
|
24
|
+
type SplitButtonProps = SplitButtonSharedProps & SplitButtonPrimary & ({
|
|
25
|
+
surface?: "menu";
|
|
26
|
+
open?: ComponentProps<typeof Menu>["open"];
|
|
27
|
+
onOpenChange?: ComponentProps<typeof Menu>["onOpenChange"];
|
|
28
|
+
} | {
|
|
29
|
+
surface: "popover";
|
|
30
|
+
open?: ComponentProps<typeof Popover>["open"];
|
|
31
|
+
onOpenChange?: ComponentProps<typeof Popover>["onOpenChange"];
|
|
32
|
+
});
|
|
33
|
+
/** Two independent actions share quiet chrome; only the chevron opens the secondary surface. */
|
|
34
|
+
export declare const SplitButton: (props: SplitButtonProps) => import("react").JSX.Element;
|
|
35
|
+
//#endregion
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { ChevronDownIcon } from "../icons.js";
|
|
3
|
+
import { cn } from "../lib/utils.js";
|
|
4
|
+
import { Button } from "./button.js";
|
|
5
|
+
import { Popover, PopoverTrigger } from "./popover.js";
|
|
6
|
+
import { DropdownMenu as Menu, DropdownMenuTrigger as MenuTrigger } from "./menu.js";
|
|
7
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
+
//#region src/components/split-button.tsx
|
|
9
|
+
/** Two independent actions share quiet chrome; only the chevron opens the secondary surface. */
|
|
10
|
+
const SplitButton = (props) => {
|
|
11
|
+
const { primaryLabel, menuLabel, primaryDescriptionId, menuDescriptionId, onPrimaryClick, children, menu, primaryDisabled, menuDisabled, size = "md", className } = props;
|
|
12
|
+
const triggerButton = /* @__PURE__ */ jsx(Button, {
|
|
13
|
+
className: cn("text-muted-foreground group-hover/split:bg-muted group-focus-within/split:bg-muted hover:bg-accent hover:text-foreground active:bg-accent/80 data-popup-open:bg-accent rounded-md [&_svg]:mx-0", size === "sm" ? "h-7 w-3.5 px-0 sm:h-7" : "h-8 w-4 px-0 sm:h-8", "pointer-coarse:min-h-11 pointer-coarse:min-w-11"),
|
|
14
|
+
size: "sm",
|
|
15
|
+
variant: "ghost"
|
|
16
|
+
});
|
|
17
|
+
const controls = /* @__PURE__ */ jsxs("div", {
|
|
18
|
+
className: cn("group/split hover:border-border focus-within:border-border has-[[data-popup-open]]:border-border inline-flex shrink-0 items-center rounded-lg border border-transparent p-0.5", className),
|
|
19
|
+
"data-size": size,
|
|
20
|
+
"data-slot": "split-button",
|
|
21
|
+
children: [/* @__PURE__ */ jsx(Button, {
|
|
22
|
+
"aria-describedby": primaryDescriptionId,
|
|
23
|
+
"aria-label": primaryLabel,
|
|
24
|
+
className: cn("text-muted-foreground hover:text-foreground active:bg-accent/80 rounded-md [&_svg]:mx-0 [&_svg]:size-3.5 [&_svg:not([class*='size-'])]:size-3.5 sm:[&_svg:not([class*='size-'])]:size-3.5", size === "sm" ? "h-7 ps-1.5 pe-0.5 sm:h-7" : "h-8 ps-2 pe-0.5 sm:h-8", "pointer-coarse:min-h-11 pointer-coarse:min-w-11"),
|
|
25
|
+
disabled: primaryDisabled,
|
|
26
|
+
onClick: onPrimaryClick,
|
|
27
|
+
size: "sm",
|
|
28
|
+
variant: "ghost",
|
|
29
|
+
children
|
|
30
|
+
}), props.surface === "popover" ? /* @__PURE__ */ jsx(PopoverTrigger, {
|
|
31
|
+
"aria-describedby": menuDescriptionId,
|
|
32
|
+
"aria-label": menuLabel,
|
|
33
|
+
disabled: menuDisabled,
|
|
34
|
+
render: triggerButton,
|
|
35
|
+
children: /* @__PURE__ */ jsx(ChevronDownIcon, {
|
|
36
|
+
"aria-hidden": "true",
|
|
37
|
+
className: "size-[0.65625rem]",
|
|
38
|
+
strokeWidth: 1.5
|
|
39
|
+
})
|
|
40
|
+
}) : /* @__PURE__ */ jsx(MenuTrigger, {
|
|
41
|
+
"aria-describedby": menuDescriptionId,
|
|
42
|
+
"aria-label": menuLabel,
|
|
43
|
+
disabled: menuDisabled,
|
|
44
|
+
render: triggerButton,
|
|
45
|
+
children: /* @__PURE__ */ jsx(ChevronDownIcon, {
|
|
46
|
+
"aria-hidden": "true",
|
|
47
|
+
className: "size-[0.65625rem]",
|
|
48
|
+
strokeWidth: 1.5
|
|
49
|
+
})
|
|
50
|
+
})]
|
|
51
|
+
});
|
|
52
|
+
if (props.surface === "popover") return /* @__PURE__ */ jsxs(Popover, {
|
|
53
|
+
onOpenChange: props.onOpenChange,
|
|
54
|
+
open: props.open,
|
|
55
|
+
children: [controls, menu]
|
|
56
|
+
});
|
|
57
|
+
return /* @__PURE__ */ jsxs(Menu, {
|
|
58
|
+
onOpenChange: props.onOpenChange,
|
|
59
|
+
open: props.open,
|
|
60
|
+
children: [controls, menu]
|
|
61
|
+
});
|
|
62
|
+
};
|
|
63
|
+
//#endregion
|
|
64
|
+
export { SplitButton };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Button } from "./button.js";
|
|
2
|
+
import { ComponentProps, ReactNode } from "react";
|
|
3
|
+
//#region src/components/toolbar-icon-action.d.ts
|
|
4
|
+
type ToolbarIconActionProps = Omit<ComponentProps<typeof Button>, "aria-label" | "children" | "size" | "title" | "tooltip" | "variant"> & {
|
|
5
|
+
/** Names the action for the tooltip and for assistive technology. */
|
|
6
|
+
label: string;
|
|
7
|
+
icon: ReactNode;
|
|
8
|
+
/** `header` for the app header row, `toolbar` for a viewer's toolbar. */
|
|
9
|
+
density: "header" | "toolbar";
|
|
10
|
+
};
|
|
11
|
+
/**
|
|
12
|
+
* One action in a toolbar row of icons. It has no children, so a row cannot
|
|
13
|
+
* mix a labelled text button in among its icons: the label is the tooltip
|
|
14
|
+
* and the accessible name, and the row stays the same shape everywhere.
|
|
15
|
+
*/
|
|
16
|
+
export declare const ToolbarIconAction: ({ density, icon, label, ...props }: ToolbarIconActionProps) => import("react").JSX.Element;
|
|
17
|
+
//#endregion
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Button } from "./button.js";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
//#region src/components/toolbar-icon-action.tsx
|
|
4
|
+
const SIZE_BY_DENSITY = {
|
|
5
|
+
header: "icon-sm",
|
|
6
|
+
toolbar: "icon-xs"
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* One action in a toolbar row of icons. It has no children, so a row cannot
|
|
10
|
+
* mix a labelled text button in among its icons: the label is the tooltip
|
|
11
|
+
* and the accessible name, and the row stays the same shape everywhere.
|
|
12
|
+
*/
|
|
13
|
+
const ToolbarIconAction = ({ density, icon, label, ...props }) => /* @__PURE__ */ jsx(Button, {
|
|
14
|
+
...props,
|
|
15
|
+
"aria-label": label,
|
|
16
|
+
size: SIZE_BY_DENSITY[density],
|
|
17
|
+
title: void 0,
|
|
18
|
+
tooltip: label,
|
|
19
|
+
variant: "ghost",
|
|
20
|
+
children: icon
|
|
21
|
+
});
|
|
22
|
+
//#endregion
|
|
23
|
+
export { ToolbarIconAction };
|
package/dist/css.d.ts
ADDED
package/dist/index.d.ts
CHANGED
|
@@ -15,19 +15,22 @@ import { Checkbox } from "./components/checkbox.js";
|
|
|
15
15
|
import { ColorPicker, ColorPickerContent, ColorPickerContentProps, ColorPickerProps, ColorPreset, DEFAULT_PRESETS } from "./components/color-picker.js";
|
|
16
16
|
import { CONTROL_SIZE, CONTROL_SIZES, ControlSize } from "./lib/control-size.js";
|
|
17
17
|
import { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, useComboboxFilter } from "./components/combobox.js";
|
|
18
|
-
import {
|
|
18
|
+
import { DialogFormState } from "./components/dialog-form-state.js";
|
|
19
|
+
import { Dialog, DialogBackdrop, DialogClose, DialogContent as DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogPanel, DialogPortal, DialogProvider, DialogTitle, DialogTrigger, DialogViewport } from "./components/dialog.js";
|
|
19
20
|
import { Command, CommandCollection, CommandDialog, CommandDialogPopup, CommandDialogTrigger, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut } from "./components/command.js";
|
|
20
21
|
import { CopyButton } from "./components/copy-button.js";
|
|
21
22
|
import { DatePickerPopover, DatePickerPopoverProps } from "./components/date-picker-popover.js";
|
|
22
23
|
import { Input, InputProps } from "./components/input.js";
|
|
23
24
|
import { DestructiveActionConfirmation, useDestructiveActionConfirmation } from "./components/destructive-action-confirmation.js";
|
|
24
25
|
import { DestructiveConfirmDialog, DestructiveConfirmDialogProps } from "./components/destructive-confirm-dialog.js";
|
|
26
|
+
import { DetailsGrid, DetailsItem } from "./components/details-grid.js";
|
|
25
27
|
import { DirectionalIcon } from "./components/directional-icon.js";
|
|
26
28
|
import { Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity } from "./components/field.js";
|
|
27
29
|
import { FileInput, FileInputProps } from "./components/file-input.js";
|
|
28
30
|
import { Form } from "./components/form.js";
|
|
29
31
|
import { Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle } from "./components/frame.js";
|
|
30
32
|
import { HexColorPicker, HexColorPickerProps } from "./components/hex-color-picker.js";
|
|
33
|
+
import { InlineRenameInput } from "./components/inline-rename.js";
|
|
31
34
|
import { Textarea, TextareaProps } from "./components/textarea.js";
|
|
32
35
|
import { InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea } from "./components/input-group.js";
|
|
33
36
|
import { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot } from "./components/input-otp.js";
|
|
@@ -100,4 +103,4 @@ import { ReviewDiffDeletion, ReviewDiffInsertion, ReviewDiffSegment, ReviewDiffS
|
|
|
100
103
|
import { ReviewOutOfDateNotice, ReviewOutOfDateReason, ReviewOutOfDateTone } from "./review/review-out-of-date-notice.js";
|
|
101
104
|
import { ReviewStatusBadge, ReviewStatusSize, ReviewStatusTone, ReviewStatusVariant } from "./review/review-status-badge.js";
|
|
102
105
|
import { ReviewSeverityDot, ReviewSeverityLevel, ReviewStatusDot, reviewSeverityTone } from "./review/review-severity-dot.js";
|
|
103
|
-
export { APPLICATION_RAIL_BUTTON_SIZE, APPLICATION_RAIL_ICON_SIZE, APPLICATION_RAIL_WIDTH, Accordion, AccordionPanel as AccordionContent, AccordionPanel, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogBackdrop, AlertDialogBackdrop as AlertDialogOverlay, AlertDialogClose, AlertDialogPopup as AlertDialogContent, AlertDialogPopup, AlertDialogCreateHandle, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPanel, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AnchoredToastProvider, ApplicationRail, ApplicationRailButton, ApplicationRailContent, ApplicationRailFooter, ApplicationRailHeader, ApplicationRailMenu, ApplicationRailSeparator, Avatar, AvatarFallback, AvatarImage, BOARD_DRAG_OVERLAY_Z_INDEX, type BidiDirection, BidiText, type BidiTextProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, type BuildKanbanBoardMatrixParams, Button, CONTROL_SIZE, CONTROL_SIZES, CalendarCell, type CalendarDateRange, CalendarEntryButton, CalendarEntrySurface, CalendarGrid, CalendarHeaderCell, CalendarHeaderRow, Checkbox, ColorPicker, ColorPickerContent, type ColorPickerContentProps, type ColorPickerProps, type ColorPreset, ColorVariants, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, Command, CommandCollection, CommandDialog, CommandDialogPopup, CommandDialogTrigger, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut, type ControlSize, CopyButton, type CreateKanbanDropIntentParams, DEFAULT_PRESETS, DataTable, type DataTableAriaSort, type DataTableColumn, type DataTableProps, type DataTableRowAction, DatePickerPopover, type DatePickerPopoverProps, DestructiveActionConfirmation, DestructiveConfirmDialog, type DestructiveConfirmDialogProps, Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogPanel, DialogPortal, DialogTitle, DialogTrigger, DialogViewport, DirectionalIcon, DiscordLogoIcon, Menu as DropdownMenu, Menu, MenuCheckboxItem as DropdownMenuCheckboxItem, MenuCheckboxItem, MenuPopup as DropdownMenuContent, MenuPopup, MenuCreateHandle as DropdownMenuCreateHandle, MenuCreateHandle, MenuGroup as DropdownMenuGroup, MenuGroup, MenuItem as DropdownMenuItem, MenuItem, MenuGroupLabel as DropdownMenuLabel, MenuGroupLabel, MenuPortal as DropdownMenuPortal, MenuPortal, MenuRadioGroup as DropdownMenuRadioGroup, MenuRadioGroup, MenuRadioItem as DropdownMenuRadioItem, MenuRadioItem, MenuSeparator as DropdownMenuSeparator, MenuSeparator, MenuShortcut as DropdownMenuShortcut, MenuShortcut, MenuSub as DropdownMenuSub, MenuSub, MenuSubPopup as DropdownMenuSubContent, MenuSubPopup, MenuSubTrigger as DropdownMenuSubTrigger, MenuSubTrigger, MenuTrigger as DropdownMenuTrigger, MenuTrigger, Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity, FileInput, type FileInputProps, Form, Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle, GitHubLogoIcon, HexColorPicker, type HexColorPickerProps, PreviewCard as HoverCard, PreviewCard, PreviewCardPopup as HoverCardContent, PreviewCardPopup, PreviewCardTrigger as HoverCardTrigger, PreviewCardTrigger, INSPECTOR_CONTENT_MIN_WIDTH, INSPECTOR_EDITOR_MIN_WIDTH, INSPECTOR_PANE_DEFAULT_WIDTH, INSPECTOR_PANE_KEYBOARD_PAGE_STEP, INSPECTOR_PANE_KEYBOARD_STEP, INSPECTOR_PANE_MAX_WIDTH, INSPECTOR_PANE_MIN_WIDTH, INSPECTOR_RAIL_WIDTH, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Inspector, InspectorActions, InspectorContent, InspectorDescription, InspectorDock, type InspectorDockMount, InspectorEmptyRow, InspectorEntityTab, type InspectorEntityTabInactiveIcon, InspectorFacetBar, InspectorHeader, InspectorHeaderText, InspectorProperty, InspectorPropertyLabel, InspectorPropertyList, InspectorPropertyValue, InspectorRail, InspectorRailCell, InspectorRailContent, InspectorRailFooter, InspectorRailIconButton, InspectorRailTab, InspectorSection, InspectorSectionTitle, InspectorTitle, KANBAN_BAND_CAPTION_ROW_HEIGHT, KANBAN_BAND_CAPTION_ROW_HEIGHT_PX, KANBAN_BAND_PEEK_DELAY_MS, KANBAN_BAND_PEEK_LINGER_MS, KANBAN_BOARD_AUTO_SCROLL_SOURCES, KANBAN_BOARD_AXES, KANBAN_CARD_DRAG_MIME, KANBAN_CARD_STICKY_TOP_VAR, KANBAN_CHROME_ROW_HEIGHT, KANBAN_CHROME_ROW_HEIGHT_PX, KANBAN_COLLAPSED_BAND_WIDTH_CLASS, KANBAN_COLLAPSED_BAND_WIDTH_PX, KANBAN_COLUMN_GAP_PX, KANBAN_COLUMN_WIDTH_CLASS, KANBAN_COLUMN_WIDTH_PX, KANBAN_STICKY_TOP_VAR, KANBAN_VIRTUAL_CELL_PAGINATION, type KanbanBandToggleActivation, type KanbanBoardAxis, type KanbanBoardCell, type KanbanBoardColumn, type KanbanBoardCoordinate, type KanbanBoardDestination, type KanbanBoardLane, type KanbanBoardMatrix, type KanbanBuiltInGroup, type KanbanCardFieldSelection, KanbanCardShell, type KanbanCardShellProps, KanbanCellAction, type KanbanCellActionProps, KanbanCollapsedBandCaption, type KanbanCollapsedBandCaptionProps, type KanbanColumnBand, KanbanColumnBandHeader, type KanbanColumnBandHeaderProps, type KanbanColumnBandSpan, KanbanColumnHeader, type KanbanColumnHeaderProps, type KanbanDropAxisChange, type KanbanDropIntent, type KanbanGroup, type KanbanGroupOption, type KanbanGrouping, type KanbanSchema, type KanbanSubgroupBandHeaderContext, KanbanSubgroupBoard, type KanbanSubgroupBoardProps, type KanbanSubgroupCellContext, type KanbanSubgroupCollapsedBandCellContext, type KanbanSubgroupColumnHeaderContext, type KanbanSubgroupLaneColumnActionContext, type KanbanSubgroupLaneColumnSummaryContext, type KanbanSubgroupLaneIdentityContext, KanbanVirtualCell, type KanbanVirtualCellPagination, type KanbanVirtualCellProps, Label, List, ListEmpty, ListGroup, ListGroupAction, ListGroupCount, ListGroupDescription, ListGroupHeader, ListGroupHeading, ListGroupTitle, ListItem, ListItemActions, ListItemContent, ListItemDescription, ListItemMedia, ListItemStatus, ListItemTitle, MenuPreviewLayout, MenuSection, OUTLINE_EMPHASIS, OVERLAY_COLLISION_PADDING, OVERLAY_LAYER_CLASS_NAMES, OptionColor, type OrderKanbanCellsByColumnsParams, OutlineEmphasis, OutlineItem, OutlineRail, OutlineRailProps, OverlayLayer, PROPERTY_ROW_GRID, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverPopup as PopoverContent, PopoverPopup, PopoverCreateHandle, PopoverDescription, PopoverPanel, PopoverTitle, PopoverTrigger, PreviewCardPrimitive, PreviewPane, type RegisterKanbanBoardAutoScrollOptions, type RegisterKanbanCardDragOptions, type ResolveKanbanGroupValueParams, type ResolveKanbanGroupingParams, ResourceCalendar, type ResourceCalendarColumn, type ResourceCalendarEntry, type ResourceCalendarEntryTone, type ResourceCalendarLaneLayout, type ResourceCalendarLanePlacement, type ResourceCalendarPlacement, type ResourceCalendarResource, ReviewAuthorAvatar, ReviewCommentAuthor, ReviewCommentCard, ReviewDecisionActions, ReviewDecisionSize, ReviewDecisionState, ReviewDiffDeletion, ReviewDiffInsertion, ReviewDiffSegment, ReviewDiffSegmentType, ReviewDiffText, ReviewOutOfDateNotice, ReviewOutOfDateReason, ReviewOutOfDateTone, ReviewSeverityDot, ReviewSeverityLevel, ReviewStatusBadge, ReviewStatusDot, ReviewStatusSize, ReviewStatusTone, ReviewStatusVariant, SHELL_CHROME_LAYER_CLASS_NAME, SIDEBAR_WIDTH_ICON_PX, SIDEBAR_WIDTH_PX, SIDE_RAIL_CONTAINER_CLASS, SIDE_RAIL_ICON_BUTTON_SIZE, SIDE_RAIL_TAB_ICON_SIZE, SIDE_RAIL_WIDTH, ScrollArea, ScrollBar, ScrollToTop, ScrollToTopProps, SearchField, type SearchFieldProps, SecretInput, type SecretInputProps, SegmentedIconToggle, Select, SelectPopup as SelectContent, SelectPopup, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetBackdrop, SheetBackdrop as SheetOverlay, SheetClose, SheetPopup as SheetContent, SheetPopup, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetPortal, type SheetSide, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, type SortDirection, SortableHead, type StatusTone, StellaMark, StellaWordmarkLatin, TOAST_RIGHT_OFFSET_VAR, TOOLBAR_ROW_HEIGHT, TOOLBAR_ROW_HEIGHT_PX, TRACKED_DELETION_STYLE, TRACKED_INSERTION_STYLE, Table, TableBody, TableCaption, TableCell, type TableColumnCapabilities, type TableColumnDescriptor, TableFooter, TableHead, TableHeader, TableRow, type TableSchema, Tabs, TabsPanel as TabsContent, TabsPanel, TabsList, TabsTab, TabsTab as TabsTrigger, TextSeparator, Textarea, type TextareaProps, type ToastPosition, ToastProvider, Tooltip, TooltipPopup as TooltipContent, TooltipPopup, TooltipCreateHandle, TooltipProvider, TooltipTrigger, TypedCharacterEvent, UNKNOWN_AUTHOR_LABEL, UserText, type WorkspaceCompactNavigation, WorkspaceEndRail, type WorkspaceEndRailChatAction, type WorkspaceEndRailProps, type WorkspaceNavigation, WorkspaceShell, type WorkspaceShellProps, type WorkspaceTopBarContext, assertConsecutiveCalendarDates, buildKanbanBoardMatrix, buttonAccessibleDisabledClass, buttonVariants, cn, composeRefs, containedEventHandler, containedHandler, contentDir, createKanbanDropIntent, duplicateColumnIds, emptyColor, entityTabGlyph, findTableColumn, getFirstWeekday, getInitials, getKanbanBoardColumnIdentity, getKanbanBoardLaneIdentity, getKanbanGroupingPropertyId, getKanbanGroups, getLocaleWeekInfo, getResourceCalendarPlacement, getWeekendDays, hasKanbanColumnBands, hideableColumnIds, isKanbanGroupingRenderable, isStructuredInputType, layoutResourceCalendarEntries, nextCalendarDate, optionColors, orderKanbanCellsByColumns, outlineEntryText, parsePersistedPaneWidth, registerKanbanBoardAutoScroll, registerKanbanCardDrag, resolveDragWidth, resolveInspectorDockWidth, resolveInspectorPaneMaxWidth, resolveInspectorPaneWidth, resolveKanbanColumnBands, resolveKanbanGroupOptions, resolveKanbanGrouping, resolveKeyboardWidth, resolveOptionColor, reviewDiffSegmentKeys, reviewSeverityTone, selectKanbanCardFieldIds, selectKanbanRows, shouldForceSidebarCollapsed, sidebarIdentityTriggerClassName, sortableColumnIds, stellaToast, tableColumnIds, tableColumnSizing, typedCharacter, useComboboxFilter, useContentDir, useDestructiveActionConfirmation, useInspectorPaneWidth, useIsMobile, useLatest, useSidebar, useSidebarInlineSize, useSidebarLayout, useViewportWidth, visibleColumnIds };
|
|
106
|
+
export { APPLICATION_RAIL_BUTTON_SIZE, APPLICATION_RAIL_ICON_SIZE, APPLICATION_RAIL_WIDTH, Accordion, AccordionPanel as AccordionContent, AccordionPanel, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogBackdrop, AlertDialogBackdrop as AlertDialogOverlay, AlertDialogClose, AlertDialogPopup as AlertDialogContent, AlertDialogPopup, AlertDialogCreateHandle, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPanel, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AnchoredToastProvider, ApplicationRail, ApplicationRailButton, ApplicationRailContent, ApplicationRailFooter, ApplicationRailHeader, ApplicationRailMenu, ApplicationRailSeparator, Avatar, AvatarFallback, AvatarImage, BOARD_DRAG_OVERLAY_Z_INDEX, type BidiDirection, BidiText, type BidiTextProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, type BuildKanbanBoardMatrixParams, Button, CONTROL_SIZE, CONTROL_SIZES, CalendarCell, type CalendarDateRange, CalendarEntryButton, CalendarEntrySurface, CalendarGrid, CalendarHeaderCell, CalendarHeaderRow, Checkbox, ColorPicker, ColorPickerContent, type ColorPickerContentProps, type ColorPickerProps, type ColorPreset, ColorVariants, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, Command, CommandCollection, CommandDialog, CommandDialogPopup, CommandDialogTrigger, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut, type ControlSize, CopyButton, type CreateKanbanDropIntentParams, DEFAULT_PRESETS, DataTable, type DataTableAriaSort, type DataTableColumn, type DataTableProps, type DataTableRowAction, DatePickerPopover, type DatePickerPopoverProps, DestructiveActionConfirmation, DestructiveConfirmDialog, type DestructiveConfirmDialogProps, DetailsGrid, DetailsItem, Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogFormState, DialogHeader, DialogPanel, DialogPortal, DialogProvider, DialogTitle, DialogTrigger, DialogViewport, DirectionalIcon, DiscordLogoIcon, Menu as DropdownMenu, Menu, MenuCheckboxItem as DropdownMenuCheckboxItem, MenuCheckboxItem, MenuPopup as DropdownMenuContent, MenuPopup, MenuCreateHandle as DropdownMenuCreateHandle, MenuCreateHandle, MenuGroup as DropdownMenuGroup, MenuGroup, MenuItem as DropdownMenuItem, MenuItem, MenuGroupLabel as DropdownMenuLabel, MenuGroupLabel, MenuPortal as DropdownMenuPortal, MenuPortal, MenuRadioGroup as DropdownMenuRadioGroup, MenuRadioGroup, MenuRadioItem as DropdownMenuRadioItem, MenuRadioItem, MenuSeparator as DropdownMenuSeparator, MenuSeparator, MenuShortcut as DropdownMenuShortcut, MenuShortcut, MenuSub as DropdownMenuSub, MenuSub, MenuSubPopup as DropdownMenuSubContent, MenuSubPopup, MenuSubTrigger as DropdownMenuSubTrigger, MenuSubTrigger, MenuTrigger as DropdownMenuTrigger, MenuTrigger, Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity, FileInput, type FileInputProps, Form, Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle, GitHubLogoIcon, HexColorPicker, type HexColorPickerProps, PreviewCard as HoverCard, PreviewCard, PreviewCardPopup as HoverCardContent, PreviewCardPopup, PreviewCardTrigger as HoverCardTrigger, PreviewCardTrigger, INSPECTOR_CONTENT_MIN_WIDTH, INSPECTOR_EDITOR_MIN_WIDTH, INSPECTOR_PANE_DEFAULT_WIDTH, INSPECTOR_PANE_KEYBOARD_PAGE_STEP, INSPECTOR_PANE_KEYBOARD_STEP, INSPECTOR_PANE_MAX_WIDTH, INSPECTOR_PANE_MIN_WIDTH, INSPECTOR_RAIL_WIDTH, InlineRenameInput, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Inspector, InspectorActions, InspectorContent, InspectorDescription, InspectorDock, type InspectorDockMount, InspectorEmptyRow, InspectorEntityTab, type InspectorEntityTabInactiveIcon, InspectorFacetBar, InspectorHeader, InspectorHeaderText, InspectorProperty, InspectorPropertyLabel, InspectorPropertyList, InspectorPropertyValue, InspectorRail, InspectorRailCell, InspectorRailContent, InspectorRailFooter, InspectorRailIconButton, InspectorRailTab, InspectorSection, InspectorSectionTitle, InspectorTitle, KANBAN_BAND_CAPTION_ROW_HEIGHT, KANBAN_BAND_CAPTION_ROW_HEIGHT_PX, KANBAN_BAND_PEEK_DELAY_MS, KANBAN_BAND_PEEK_LINGER_MS, KANBAN_BOARD_AUTO_SCROLL_SOURCES, KANBAN_BOARD_AXES, KANBAN_CARD_DRAG_MIME, KANBAN_CARD_STICKY_TOP_VAR, KANBAN_CHROME_ROW_HEIGHT, KANBAN_CHROME_ROW_HEIGHT_PX, KANBAN_COLLAPSED_BAND_WIDTH_CLASS, KANBAN_COLLAPSED_BAND_WIDTH_PX, KANBAN_COLUMN_GAP_PX, KANBAN_COLUMN_WIDTH_CLASS, KANBAN_COLUMN_WIDTH_PX, KANBAN_STICKY_TOP_VAR, KANBAN_VIRTUAL_CELL_PAGINATION, type KanbanBandToggleActivation, type KanbanBoardAxis, type KanbanBoardCell, type KanbanBoardColumn, type KanbanBoardCoordinate, type KanbanBoardDestination, type KanbanBoardLane, type KanbanBoardMatrix, type KanbanBuiltInGroup, type KanbanCardFieldSelection, KanbanCardShell, type KanbanCardShellProps, KanbanCellAction, type KanbanCellActionProps, KanbanCollapsedBandCaption, type KanbanCollapsedBandCaptionProps, type KanbanColumnBand, KanbanColumnBandHeader, type KanbanColumnBandHeaderProps, type KanbanColumnBandSpan, KanbanColumnHeader, type KanbanColumnHeaderProps, type KanbanDropAxisChange, type KanbanDropIntent, type KanbanGroup, type KanbanGroupOption, type KanbanGrouping, type KanbanSchema, type KanbanSubgroupBandHeaderContext, KanbanSubgroupBoard, type KanbanSubgroupBoardProps, type KanbanSubgroupCellContext, type KanbanSubgroupCollapsedBandCellContext, type KanbanSubgroupColumnHeaderContext, type KanbanSubgroupLaneColumnActionContext, type KanbanSubgroupLaneColumnSummaryContext, type KanbanSubgroupLaneIdentityContext, KanbanVirtualCell, type KanbanVirtualCellPagination, type KanbanVirtualCellProps, Label, List, ListEmpty, ListGroup, ListGroupAction, ListGroupCount, ListGroupDescription, ListGroupHeader, ListGroupHeading, ListGroupTitle, ListItem, ListItemActions, ListItemContent, ListItemDescription, ListItemMedia, ListItemStatus, ListItemTitle, MenuPreviewLayout, MenuSection, OUTLINE_EMPHASIS, OVERLAY_COLLISION_PADDING, OVERLAY_LAYER_CLASS_NAMES, OptionColor, type OrderKanbanCellsByColumnsParams, OutlineEmphasis, OutlineItem, OutlineRail, OutlineRailProps, OverlayLayer, PROPERTY_ROW_GRID, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverPopup as PopoverContent, PopoverPopup, PopoverCreateHandle, PopoverDescription, PopoverPanel, PopoverTitle, PopoverTrigger, PreviewCardPrimitive, PreviewPane, type RegisterKanbanBoardAutoScrollOptions, type RegisterKanbanCardDragOptions, type ResolveKanbanGroupValueParams, type ResolveKanbanGroupingParams, ResourceCalendar, type ResourceCalendarColumn, type ResourceCalendarEntry, type ResourceCalendarEntryTone, type ResourceCalendarLaneLayout, type ResourceCalendarLanePlacement, type ResourceCalendarPlacement, type ResourceCalendarResource, ReviewAuthorAvatar, ReviewCommentAuthor, ReviewCommentCard, ReviewDecisionActions, ReviewDecisionSize, ReviewDecisionState, ReviewDiffDeletion, ReviewDiffInsertion, ReviewDiffSegment, ReviewDiffSegmentType, ReviewDiffText, ReviewOutOfDateNotice, ReviewOutOfDateReason, ReviewOutOfDateTone, ReviewSeverityDot, ReviewSeverityLevel, ReviewStatusBadge, ReviewStatusDot, ReviewStatusSize, ReviewStatusTone, ReviewStatusVariant, SHELL_CHROME_LAYER_CLASS_NAME, SIDEBAR_WIDTH_ICON_PX, SIDEBAR_WIDTH_PX, SIDE_RAIL_CONTAINER_CLASS, SIDE_RAIL_ICON_BUTTON_SIZE, SIDE_RAIL_TAB_ICON_SIZE, SIDE_RAIL_WIDTH, ScrollArea, ScrollBar, ScrollToTop, ScrollToTopProps, SearchField, type SearchFieldProps, SecretInput, type SecretInputProps, SegmentedIconToggle, Select, SelectPopup as SelectContent, SelectPopup, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetBackdrop, SheetBackdrop as SheetOverlay, SheetClose, SheetPopup as SheetContent, SheetPopup, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetPortal, type SheetSide, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, type SortDirection, SortableHead, type StatusTone, StellaMark, StellaWordmarkLatin, TOAST_RIGHT_OFFSET_VAR, TOOLBAR_ROW_HEIGHT, TOOLBAR_ROW_HEIGHT_PX, TRACKED_DELETION_STYLE, TRACKED_INSERTION_STYLE, Table, TableBody, TableCaption, TableCell, type TableColumnCapabilities, type TableColumnDescriptor, TableFooter, TableHead, TableHeader, TableRow, type TableSchema, Tabs, TabsPanel as TabsContent, TabsPanel, TabsList, TabsTab, TabsTab as TabsTrigger, TextSeparator, Textarea, type TextareaProps, type ToastPosition, ToastProvider, Tooltip, TooltipPopup as TooltipContent, TooltipPopup, TooltipCreateHandle, TooltipProvider, TooltipTrigger, TypedCharacterEvent, UNKNOWN_AUTHOR_LABEL, UserText, type WorkspaceCompactNavigation, WorkspaceEndRail, type WorkspaceEndRailChatAction, type WorkspaceEndRailProps, type WorkspaceNavigation, WorkspaceShell, type WorkspaceShellProps, type WorkspaceTopBarContext, assertConsecutiveCalendarDates, buildKanbanBoardMatrix, buttonAccessibleDisabledClass, buttonVariants, cn, composeRefs, containedEventHandler, containedHandler, contentDir, createKanbanDropIntent, duplicateColumnIds, emptyColor, entityTabGlyph, findTableColumn, getFirstWeekday, getInitials, getKanbanBoardColumnIdentity, getKanbanBoardLaneIdentity, getKanbanGroupingPropertyId, getKanbanGroups, getLocaleWeekInfo, getResourceCalendarPlacement, getWeekendDays, hasKanbanColumnBands, hideableColumnIds, isKanbanGroupingRenderable, isStructuredInputType, layoutResourceCalendarEntries, nextCalendarDate, optionColors, orderKanbanCellsByColumns, outlineEntryText, parsePersistedPaneWidth, registerKanbanBoardAutoScroll, registerKanbanCardDrag, resolveDragWidth, resolveInspectorDockWidth, resolveInspectorPaneMaxWidth, resolveInspectorPaneWidth, resolveKanbanColumnBands, resolveKanbanGroupOptions, resolveKanbanGrouping, resolveKeyboardWidth, resolveOptionColor, reviewDiffSegmentKeys, reviewSeverityTone, selectKanbanCardFieldIds, selectKanbanRows, shouldForceSidebarCollapsed, sidebarIdentityTriggerClassName, sortableColumnIds, stellaToast, tableColumnIds, tableColumnSizing, typedCharacter, useComboboxFilter, useContentDir, useDestructiveActionConfirmation, useInspectorPaneWidth, useIsMobile, useLatest, useSidebar, useSidebarInlineSize, useSidebarLayout, useViewportWidth, visibleColumnIds };
|
package/dist/index.js
CHANGED
|
@@ -23,7 +23,8 @@ import { CONTROL_SIZE, CONTROL_SIZES } from "./lib/control-size.js";
|
|
|
23
23
|
import { contentDir, isStructuredInputType, useContentDir } from "./hooks/use-content-dir.js";
|
|
24
24
|
import { Input } from "./components/input.js";
|
|
25
25
|
import { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, useComboboxFilter } from "./components/combobox.js";
|
|
26
|
-
import {
|
|
26
|
+
import { DialogFormState } from "./components/dialog-form-state.js";
|
|
27
|
+
import { Dialog, DialogBackdrop, DialogClose, DialogContent as DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogPanel, DialogPortal, DialogProvider, DialogTitle, DialogTrigger, DialogViewport } from "./components/dialog.js";
|
|
27
28
|
import { Command, CommandCollection, CommandDialog, CommandDialogPopup, CommandDialogTrigger, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut } from "./components/command.js";
|
|
28
29
|
import { CopyButton } from "./components/copy-button.js";
|
|
29
30
|
import { CalendarCell, CalendarEntryButton, CalendarEntrySurface, CalendarGrid, CalendarHeaderCell, CalendarHeaderRow } from "./calendar/primitives.js";
|
|
@@ -34,6 +35,7 @@ import { Popover, PopoverClose, PopoverContent as PopoverPopup, PopoverCreateHan
|
|
|
34
35
|
import { useLatest } from "./hooks/use-latest.js";
|
|
35
36
|
import { Select, SelectContent as SelectPopup, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue } from "./components/select.js";
|
|
36
37
|
import { DatePickerPopover } from "./components/date-picker-popover.js";
|
|
38
|
+
import { DetailsGrid, DetailsItem } from "./components/details-grid.js";
|
|
37
39
|
import { Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity } from "./components/field.js";
|
|
38
40
|
import { DestructiveActionConfirmation, useDestructiveActionConfirmation } from "./components/destructive-action-confirmation.js";
|
|
39
41
|
import { DestructiveConfirmDialog } from "./components/destructive-confirm-dialog.js";
|
|
@@ -41,6 +43,7 @@ import { FileInput } from "./components/file-input.js";
|
|
|
41
43
|
import { Form } from "./components/form.js";
|
|
42
44
|
import { Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle } from "./components/frame.js";
|
|
43
45
|
import { HexColorPicker } from "./components/hex-color-picker.js";
|
|
46
|
+
import { InlineRenameInput } from "./components/inline-rename.js";
|
|
44
47
|
import { Textarea } from "./components/textarea.js";
|
|
45
48
|
import { InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea } from "./components/input-group.js";
|
|
46
49
|
import { List, ListEmpty, ListGroup, ListGroupAction, ListGroupCount, ListGroupDescription, ListGroupHeader, ListGroupHeading, ListGroupTitle, ListItem, ListItemActions, ListItemContent, ListItemDescription, ListItemMedia, ListItemStatus, ListItemTitle } from "./components/list.js";
|
|
@@ -96,4 +99,4 @@ import { ReviewDiffDeletion, ReviewDiffInsertion, ReviewDiffText, TRACKED_DELETI
|
|
|
96
99
|
import { ReviewOutOfDateNotice } from "./review/review-out-of-date-notice.js";
|
|
97
100
|
import { ReviewSeverityDot, ReviewStatusDot, reviewSeverityTone } from "./review/review-severity-dot.js";
|
|
98
101
|
import { ReviewStatusBadge } from "./review/review-status-badge.js";
|
|
99
|
-
export { APPLICATION_RAIL_BUTTON_SIZE, APPLICATION_RAIL_ICON_SIZE, APPLICATION_RAIL_WIDTH, Accordion, AccordionPanel as AccordionContent, AccordionPanel, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogBackdrop, AlertDialogBackdrop as AlertDialogOverlay, AlertDialogClose, AlertDialogPopup as AlertDialogContent, AlertDialogPopup, AlertDialogCreateHandle, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPanel, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AnchoredToastProvider, ApplicationRail, ApplicationRailButton, ApplicationRailContent, ApplicationRailFooter, ApplicationRailHeader, ApplicationRailMenu, ApplicationRailSeparator, Avatar, AvatarFallback, AvatarImage, BOARD_DRAG_OVERLAY_Z_INDEX, BidiText, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, CONTROL_SIZE, CONTROL_SIZES, CalendarCell, CalendarEntryButton, CalendarEntrySurface, CalendarGrid, CalendarHeaderCell, CalendarHeaderRow, Checkbox, ColorPicker, ColorPickerContent, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, Command, CommandCollection, CommandDialog, CommandDialogPopup, CommandDialogTrigger, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut, CopyButton, DEFAULT_PRESETS, DataTable, DatePickerPopover, DestructiveActionConfirmation, DestructiveConfirmDialog, Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogPanel, DialogPortal, DialogTitle, DialogTrigger, DialogViewport, DirectionalIcon, DiscordLogoIcon, Menu as DropdownMenu, Menu, MenuCheckboxItem as DropdownMenuCheckboxItem, MenuCheckboxItem, MenuPopup as DropdownMenuContent, MenuPopup, MenuCreateHandle as DropdownMenuCreateHandle, MenuCreateHandle, MenuGroup as DropdownMenuGroup, MenuGroup, MenuItem as DropdownMenuItem, MenuItem, MenuGroupLabel as DropdownMenuLabel, MenuGroupLabel, MenuPortal as DropdownMenuPortal, MenuPortal, MenuRadioGroup as DropdownMenuRadioGroup, MenuRadioGroup, MenuRadioItem as DropdownMenuRadioItem, MenuRadioItem, MenuSeparator as DropdownMenuSeparator, MenuSeparator, MenuShortcut as DropdownMenuShortcut, MenuShortcut, MenuSub as DropdownMenuSub, MenuSub, MenuSubPopup as DropdownMenuSubContent, MenuSubPopup, MenuSubTrigger as DropdownMenuSubTrigger, MenuSubTrigger, MenuTrigger as DropdownMenuTrigger, MenuTrigger, Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity, FileInput, Form, Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle, GitHubLogoIcon, HexColorPicker, PreviewCard as HoverCard, PreviewCard, PreviewCardPopup as HoverCardContent, PreviewCardPopup, PreviewCardTrigger as HoverCardTrigger, PreviewCardTrigger, INSPECTOR_CONTENT_MIN_WIDTH, INSPECTOR_EDITOR_MIN_WIDTH, INSPECTOR_PANE_DEFAULT_WIDTH, INSPECTOR_PANE_KEYBOARD_PAGE_STEP, INSPECTOR_PANE_KEYBOARD_STEP, INSPECTOR_PANE_MAX_WIDTH, INSPECTOR_PANE_MIN_WIDTH, INSPECTOR_RAIL_WIDTH, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Inspector, InspectorActions, InspectorContent, InspectorDescription, InspectorDock, InspectorEmptyRow, InspectorEntityTab, InspectorFacetBar, InspectorHeader, InspectorHeaderText, InspectorProperty, InspectorPropertyLabel, InspectorPropertyList, InspectorPropertyValue, InspectorRail, InspectorRailCell, InspectorRailContent, InspectorRailFooter, InspectorRailIconButton, InspectorRailTab, InspectorSection, InspectorSectionTitle, InspectorTitle, KANBAN_BAND_CAPTION_ROW_HEIGHT, KANBAN_BAND_CAPTION_ROW_HEIGHT_PX, KANBAN_BAND_PEEK_DELAY_MS, KANBAN_BAND_PEEK_LINGER_MS, KANBAN_BOARD_AUTO_SCROLL_SOURCES, KANBAN_BOARD_AXES, KANBAN_CARD_DRAG_MIME, KANBAN_CARD_STICKY_TOP_VAR, KANBAN_CHROME_ROW_HEIGHT, KANBAN_CHROME_ROW_HEIGHT_PX, KANBAN_COLLAPSED_BAND_WIDTH_CLASS, KANBAN_COLLAPSED_BAND_WIDTH_PX, KANBAN_COLUMN_GAP_PX, KANBAN_COLUMN_WIDTH_CLASS, KANBAN_COLUMN_WIDTH_PX, KANBAN_STICKY_TOP_VAR, KANBAN_VIRTUAL_CELL_PAGINATION, KanbanCardShell, KanbanCellAction, KanbanCollapsedBandCaption, KanbanColumnBandHeader, KanbanColumnHeader, KanbanSubgroupBoard, KanbanVirtualCell, Label, List, ListEmpty, ListGroup, ListGroupAction, ListGroupCount, ListGroupDescription, ListGroupHeader, ListGroupHeading, ListGroupTitle, ListItem, ListItemActions, ListItemContent, ListItemDescription, ListItemMedia, ListItemStatus, ListItemTitle, MenuPreviewLayout, MenuSection, OUTLINE_EMPHASIS, OVERLAY_COLLISION_PADDING, OVERLAY_LAYER_CLASS_NAMES, OutlineRail, PROPERTY_ROW_GRID, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverPopup as PopoverContent, PopoverPopup, PopoverCreateHandle, PopoverDescription, PopoverPanel, PopoverTitle, PopoverTrigger, PreviewCardPrimitive, PreviewPane, ResourceCalendar, ReviewAuthorAvatar, ReviewCommentCard, ReviewDecisionActions, ReviewDiffDeletion, ReviewDiffInsertion, ReviewDiffText, ReviewOutOfDateNotice, ReviewSeverityDot, ReviewStatusBadge, ReviewStatusDot, SHELL_CHROME_LAYER_CLASS_NAME, SIDEBAR_WIDTH_ICON_PX, SIDEBAR_WIDTH_PX, SIDE_RAIL_CONTAINER_CLASS, SIDE_RAIL_ICON_BUTTON_SIZE, SIDE_RAIL_TAB_ICON_SIZE, SIDE_RAIL_WIDTH, ScrollArea, ScrollBar, ScrollToTop, SearchField, SecretInput, SegmentedIconToggle, Select, SelectPopup as SelectContent, SelectPopup, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetBackdrop, SheetBackdrop as SheetOverlay, SheetClose, SheetPopup as SheetContent, SheetPopup, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, SortableHead, StellaMark, StellaWordmarkLatin, TOAST_RIGHT_OFFSET_VAR, TOOLBAR_ROW_HEIGHT, TOOLBAR_ROW_HEIGHT_PX, TRACKED_DELETION_STYLE, TRACKED_INSERTION_STYLE, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsPanel as TabsContent, TabsPanel, TabsList, TabsTab, TabsTab as TabsTrigger, TextSeparator, Textarea, ToastProvider, Tooltip, TooltipPopup as TooltipContent, TooltipPopup, TooltipCreateHandle, TooltipProvider, TooltipTrigger, UNKNOWN_AUTHOR_LABEL, UserText, WorkspaceEndRail, WorkspaceShell, assertConsecutiveCalendarDates, buildKanbanBoardMatrix, buttonAccessibleDisabledClass, buttonVariants, cn, composeRefs, containedEventHandler, containedHandler, contentDir, createKanbanDropIntent, duplicateColumnIds, emptyColor, entityTabGlyph, findTableColumn, getFirstWeekday, getInitials, getKanbanBoardColumnIdentity, getKanbanBoardLaneIdentity, getKanbanGroupingPropertyId, getKanbanGroups, getLocaleWeekInfo, getResourceCalendarPlacement, getWeekendDays, hasKanbanColumnBands, hideableColumnIds, isKanbanGroupingRenderable, isStructuredInputType, layoutResourceCalendarEntries, nextCalendarDate, optionColors, orderKanbanCellsByColumns, outlineEntryText, parsePersistedPaneWidth, registerKanbanBoardAutoScroll, registerKanbanCardDrag, resolveDragWidth, resolveInspectorDockWidth, resolveInspectorPaneMaxWidth, resolveInspectorPaneWidth, resolveKanbanColumnBands, resolveKanbanGroupOptions, resolveKanbanGrouping, resolveKeyboardWidth, resolveOptionColor, reviewDiffSegmentKeys, reviewSeverityTone, selectKanbanCardFieldIds, selectKanbanRows, shouldForceSidebarCollapsed, sidebarIdentityTriggerClassName, sortableColumnIds, stellaToast, tableColumnIds, tableColumnSizing, typedCharacter, useComboboxFilter, useContentDir, useDestructiveActionConfirmation, useInspectorPaneWidth, useIsMobile, useLatest, useSidebar, useSidebarInlineSize, useSidebarLayout, useViewportWidth, visibleColumnIds };
|
|
102
|
+
export { APPLICATION_RAIL_BUTTON_SIZE, APPLICATION_RAIL_ICON_SIZE, APPLICATION_RAIL_WIDTH, Accordion, AccordionPanel as AccordionContent, AccordionPanel, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogBackdrop, AlertDialogBackdrop as AlertDialogOverlay, AlertDialogClose, AlertDialogPopup as AlertDialogContent, AlertDialogPopup, AlertDialogCreateHandle, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPanel, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AnchoredToastProvider, ApplicationRail, ApplicationRailButton, ApplicationRailContent, ApplicationRailFooter, ApplicationRailHeader, ApplicationRailMenu, ApplicationRailSeparator, Avatar, AvatarFallback, AvatarImage, BOARD_DRAG_OVERLAY_Z_INDEX, BidiText, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, CONTROL_SIZE, CONTROL_SIZES, CalendarCell, CalendarEntryButton, CalendarEntrySurface, CalendarGrid, CalendarHeaderCell, CalendarHeaderRow, Checkbox, ColorPicker, ColorPickerContent, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, Command, CommandCollection, CommandDialog, CommandDialogPopup, CommandDialogTrigger, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut, CopyButton, DEFAULT_PRESETS, DataTable, DatePickerPopover, DestructiveActionConfirmation, DestructiveConfirmDialog, DetailsGrid, DetailsItem, Dialog, DialogBackdrop, DialogBackdrop as DialogOverlay, DialogClose, DialogPopup as DialogContent, DialogPopup, DialogCreateHandle, DialogDescription, DialogFooter, DialogFormState, DialogHeader, DialogPanel, DialogPortal, DialogProvider, DialogTitle, DialogTrigger, DialogViewport, DirectionalIcon, DiscordLogoIcon, Menu as DropdownMenu, Menu, MenuCheckboxItem as DropdownMenuCheckboxItem, MenuCheckboxItem, MenuPopup as DropdownMenuContent, MenuPopup, MenuCreateHandle as DropdownMenuCreateHandle, MenuCreateHandle, MenuGroup as DropdownMenuGroup, MenuGroup, MenuItem as DropdownMenuItem, MenuItem, MenuGroupLabel as DropdownMenuLabel, MenuGroupLabel, MenuPortal as DropdownMenuPortal, MenuPortal, MenuRadioGroup as DropdownMenuRadioGroup, MenuRadioGroup, MenuRadioItem as DropdownMenuRadioItem, MenuRadioItem, MenuSeparator as DropdownMenuSeparator, MenuSeparator, MenuShortcut as DropdownMenuShortcut, MenuShortcut, MenuSub as DropdownMenuSub, MenuSub, MenuSubPopup as DropdownMenuSubContent, MenuSubPopup, MenuSubTrigger as DropdownMenuSubTrigger, MenuSubTrigger, MenuTrigger as DropdownMenuTrigger, MenuTrigger, Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity, FileInput, Form, Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle, GitHubLogoIcon, HexColorPicker, PreviewCard as HoverCard, PreviewCard, PreviewCardPopup as HoverCardContent, PreviewCardPopup, PreviewCardTrigger as HoverCardTrigger, PreviewCardTrigger, INSPECTOR_CONTENT_MIN_WIDTH, INSPECTOR_EDITOR_MIN_WIDTH, INSPECTOR_PANE_DEFAULT_WIDTH, INSPECTOR_PANE_KEYBOARD_PAGE_STEP, INSPECTOR_PANE_KEYBOARD_STEP, INSPECTOR_PANE_MAX_WIDTH, INSPECTOR_PANE_MIN_WIDTH, INSPECTOR_RAIL_WIDTH, InlineRenameInput, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Inspector, InspectorActions, InspectorContent, InspectorDescription, InspectorDock, InspectorEmptyRow, InspectorEntityTab, InspectorFacetBar, InspectorHeader, InspectorHeaderText, InspectorProperty, InspectorPropertyLabel, InspectorPropertyList, InspectorPropertyValue, InspectorRail, InspectorRailCell, InspectorRailContent, InspectorRailFooter, InspectorRailIconButton, InspectorRailTab, InspectorSection, InspectorSectionTitle, InspectorTitle, KANBAN_BAND_CAPTION_ROW_HEIGHT, KANBAN_BAND_CAPTION_ROW_HEIGHT_PX, KANBAN_BAND_PEEK_DELAY_MS, KANBAN_BAND_PEEK_LINGER_MS, KANBAN_BOARD_AUTO_SCROLL_SOURCES, KANBAN_BOARD_AXES, KANBAN_CARD_DRAG_MIME, KANBAN_CARD_STICKY_TOP_VAR, KANBAN_CHROME_ROW_HEIGHT, KANBAN_CHROME_ROW_HEIGHT_PX, KANBAN_COLLAPSED_BAND_WIDTH_CLASS, KANBAN_COLLAPSED_BAND_WIDTH_PX, KANBAN_COLUMN_GAP_PX, KANBAN_COLUMN_WIDTH_CLASS, KANBAN_COLUMN_WIDTH_PX, KANBAN_STICKY_TOP_VAR, KANBAN_VIRTUAL_CELL_PAGINATION, KanbanCardShell, KanbanCellAction, KanbanCollapsedBandCaption, KanbanColumnBandHeader, KanbanColumnHeader, KanbanSubgroupBoard, KanbanVirtualCell, Label, List, ListEmpty, ListGroup, ListGroupAction, ListGroupCount, ListGroupDescription, ListGroupHeader, ListGroupHeading, ListGroupTitle, ListItem, ListItemActions, ListItemContent, ListItemDescription, ListItemMedia, ListItemStatus, ListItemTitle, MenuPreviewLayout, MenuSection, OUTLINE_EMPHASIS, OVERLAY_COLLISION_PADDING, OVERLAY_LAYER_CLASS_NAMES, OutlineRail, PROPERTY_ROW_GRID, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverPopup as PopoverContent, PopoverPopup, PopoverCreateHandle, PopoverDescription, PopoverPanel, PopoverTitle, PopoverTrigger, PreviewCardPrimitive, PreviewPane, ResourceCalendar, ReviewAuthorAvatar, ReviewCommentCard, ReviewDecisionActions, ReviewDiffDeletion, ReviewDiffInsertion, ReviewDiffText, ReviewOutOfDateNotice, ReviewSeverityDot, ReviewStatusBadge, ReviewStatusDot, SHELL_CHROME_LAYER_CLASS_NAME, SIDEBAR_WIDTH_ICON_PX, SIDEBAR_WIDTH_PX, SIDE_RAIL_CONTAINER_CLASS, SIDE_RAIL_ICON_BUTTON_SIZE, SIDE_RAIL_TAB_ICON_SIZE, SIDE_RAIL_WIDTH, ScrollArea, ScrollBar, ScrollToTop, SearchField, SecretInput, SegmentedIconToggle, Select, SelectPopup as SelectContent, SelectPopup, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetBackdrop, SheetBackdrop as SheetOverlay, SheetClose, SheetPopup as SheetContent, SheetPopup, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, SortableHead, StellaMark, StellaWordmarkLatin, TOAST_RIGHT_OFFSET_VAR, TOOLBAR_ROW_HEIGHT, TOOLBAR_ROW_HEIGHT_PX, TRACKED_DELETION_STYLE, TRACKED_INSERTION_STYLE, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsPanel as TabsContent, TabsPanel, TabsList, TabsTab, TabsTab as TabsTrigger, TextSeparator, Textarea, ToastProvider, Tooltip, TooltipPopup as TooltipContent, TooltipPopup, TooltipCreateHandle, TooltipProvider, TooltipTrigger, UNKNOWN_AUTHOR_LABEL, UserText, WorkspaceEndRail, WorkspaceShell, assertConsecutiveCalendarDates, buildKanbanBoardMatrix, buttonAccessibleDisabledClass, buttonVariants, cn, composeRefs, containedEventHandler, containedHandler, contentDir, createKanbanDropIntent, duplicateColumnIds, emptyColor, entityTabGlyph, findTableColumn, getFirstWeekday, getInitials, getKanbanBoardColumnIdentity, getKanbanBoardLaneIdentity, getKanbanGroupingPropertyId, getKanbanGroups, getLocaleWeekInfo, getResourceCalendarPlacement, getWeekendDays, hasKanbanColumnBands, hideableColumnIds, isKanbanGroupingRenderable, isStructuredInputType, layoutResourceCalendarEntries, nextCalendarDate, optionColors, orderKanbanCellsByColumns, outlineEntryText, parsePersistedPaneWidth, registerKanbanBoardAutoScroll, registerKanbanCardDrag, resolveDragWidth, resolveInspectorDockWidth, resolveInspectorPaneMaxWidth, resolveInspectorPaneWidth, resolveKanbanColumnBands, resolveKanbanGroupOptions, resolveKanbanGrouping, resolveKeyboardWidth, resolveOptionColor, reviewDiffSegmentKeys, reviewSeverityTone, selectKanbanCardFieldIds, selectKanbanRows, shouldForceSidebarCollapsed, sidebarIdentityTriggerClassName, sortableColumnIds, stellaToast, tableColumnIds, tableColumnSizing, typedCharacter, useComboboxFilter, useContentDir, useDestructiveActionConfirmation, useInspectorPaneWidth, useIsMobile, useLatest, useSidebar, useSidebarInlineSize, useSidebarLayout, useViewportWidth, visibleColumnIds };
|
|
@@ -5,6 +5,6 @@ declare const CONTROL_SIZE: Readonly<{
|
|
|
5
5
|
readonly lg: "lg";
|
|
6
6
|
}>;
|
|
7
7
|
type ControlSize = (typeof CONTROL_SIZE)[keyof typeof CONTROL_SIZE];
|
|
8
|
-
declare const CONTROL_SIZES: readonly ("default" | "
|
|
8
|
+
declare const CONTROL_SIZES: readonly ("default" | "lg" | "sm")[];
|
|
9
9
|
//#endregion
|
|
10
10
|
export { CONTROL_SIZE, CONTROL_SIZES, type ControlSize };
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
[data-slot="inline-rename"] {
|
|
2
|
+
position: relative;
|
|
3
|
+
display: inline-grid;
|
|
4
|
+
grid-template-columns: minmax(0, max-content);
|
|
5
|
+
min-inline-size: 0;
|
|
6
|
+
max-inline-size: 100%;
|
|
7
|
+
vertical-align: baseline;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
[data-slot="inline-rename-mirror"],
|
|
11
|
+
[data-slot="inline-rename-input"] {
|
|
12
|
+
grid-area: 1 / 1;
|
|
13
|
+
min-inline-size: 1px;
|
|
14
|
+
max-inline-size: 100%;
|
|
15
|
+
margin: 0;
|
|
16
|
+
padding: 0;
|
|
17
|
+
border: 0;
|
|
18
|
+
font: inherit;
|
|
19
|
+
letter-spacing: inherit;
|
|
20
|
+
line-height: inherit;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
[data-slot="inline-rename-mirror"] {
|
|
24
|
+
visibility: hidden;
|
|
25
|
+
white-space: pre;
|
|
26
|
+
overflow: hidden;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
[data-slot="inline-rename-input"] {
|
|
30
|
+
position: absolute;
|
|
31
|
+
inset-block-start: 0;
|
|
32
|
+
inset-inline-start: 0;
|
|
33
|
+
inline-size: 100%;
|
|
34
|
+
block-size: 1lh;
|
|
35
|
+
border-radius: var(--radius-sm, 2px);
|
|
36
|
+
color: inherit;
|
|
37
|
+
background: transparent;
|
|
38
|
+
outline: none;
|
|
39
|
+
text-align: start;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
[data-slot="inline-rename-input"]:focus {
|
|
43
|
+
outline: 2px solid var(--ring, currentColor);
|
|
44
|
+
outline-offset: 3px;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
@supports (field-sizing: content) {
|
|
48
|
+
[data-slot="inline-rename-input"] {
|
|
49
|
+
position: static;
|
|
50
|
+
field-sizing: content;
|
|
51
|
+
inline-size: auto;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
/* A fill field spans its row, so its width never follows the text. */
|
|
56
|
+
[data-slot="inline-rename"][data-fill] {
|
|
57
|
+
display: grid;
|
|
58
|
+
grid-template-columns: minmax(0, 1fr);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
[data-slot="inline-rename"][data-fill] > [data-slot="inline-rename-mirror"] {
|
|
62
|
+
display: none;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
[data-slot="inline-rename"][data-fill] > [data-slot="inline-rename-input"] {
|
|
66
|
+
position: static;
|
|
67
|
+
field-sizing: fixed;
|
|
68
|
+
inline-size: 100%;
|
|
69
|
+
}
|
package/dist/styles/theme.css
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stll/ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.43.0",
|
|
4
4
|
"description": "Stella's design system: bidi-aware React primitives built on Base UI, the dockable inspector pane, and the Tailwind v4 theme they are styled with.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"base-ui",
|
|
@@ -33,6 +33,10 @@
|
|
|
33
33
|
"types": "./dist/index.d.ts",
|
|
34
34
|
"import": "./dist/index.js"
|
|
35
35
|
},
|
|
36
|
+
"./toolbar-icon-action": {
|
|
37
|
+
"types": "./dist/components/toolbar-icon-action.d.ts",
|
|
38
|
+
"import": "./dist/components/toolbar-icon-action.js"
|
|
39
|
+
},
|
|
36
40
|
"./view-toolbar": {
|
|
37
41
|
"types": "./dist/components/view-toolbar.d.ts",
|
|
38
42
|
"import": "./dist/components/view-toolbar.js"
|
|
@@ -121,6 +125,10 @@
|
|
|
121
125
|
"types": "./dist/components/date-picker-popover.d.ts",
|
|
122
126
|
"import": "./dist/components/date-picker-popover.js"
|
|
123
127
|
},
|
|
128
|
+
"./details-grid": {
|
|
129
|
+
"types": "./dist/components/details-grid.d.ts",
|
|
130
|
+
"import": "./dist/components/details-grid.js"
|
|
131
|
+
},
|
|
124
132
|
"./destructive-action-confirmation": {
|
|
125
133
|
"types": "./dist/components/destructive-action-confirmation.d.ts",
|
|
126
134
|
"import": "./dist/components/destructive-action-confirmation.js"
|
|
@@ -161,6 +169,10 @@
|
|
|
161
169
|
"types": "./dist/components/input.d.ts",
|
|
162
170
|
"import": "./dist/components/input.js"
|
|
163
171
|
},
|
|
172
|
+
"./inline-rename": {
|
|
173
|
+
"types": "./dist/components/inline-rename.d.ts",
|
|
174
|
+
"import": "./dist/components/inline-rename.js"
|
|
175
|
+
},
|
|
164
176
|
"./input-group": {
|
|
165
177
|
"types": "./dist/components/input-group.d.ts",
|
|
166
178
|
"import": "./dist/components/input-group.js"
|
|
@@ -289,6 +301,10 @@
|
|
|
289
301
|
"types": "./dist/components/select.d.ts",
|
|
290
302
|
"import": "./dist/components/select.js"
|
|
291
303
|
},
|
|
304
|
+
"./split-button": {
|
|
305
|
+
"types": "./dist/components/split-button.d.ts",
|
|
306
|
+
"import": "./dist/components/split-button.js"
|
|
307
|
+
},
|
|
292
308
|
"./separator": {
|
|
293
309
|
"types": "./dist/components/separator.d.ts",
|
|
294
310
|
"import": "./dist/components/separator.js"
|
|
@@ -664,7 +680,7 @@
|
|
|
664
680
|
"react-dom": "^19.2.8",
|
|
665
681
|
"tailwindcss": "4.3.3",
|
|
666
682
|
"tsdown": "0.23.0",
|
|
667
|
-
"vite": "8.
|
|
683
|
+
"vite": "8.3.1"
|
|
668
684
|
},
|
|
669
685
|
"peerDependencies": {
|
|
670
686
|
"@atlaskit/pragmatic-drag-and-drop": "^3.1.0",
|