tokka-ui 0.1.0 → 0.2.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/accordion.d.ts +9 -0
- package/dist/accordion.js +51 -0
- package/dist/alert-dialog.d.ts +23 -0
- package/dist/alert-dialog.js +122 -0
- package/dist/alert.d.ts +11 -0
- package/dist/alert.js +55 -0
- package/dist/aspect-ratio.d.ts +6 -0
- package/dist/aspect-ratio.js +6 -0
- package/dist/avatar.d.ts +8 -0
- package/dist/avatar.js +46 -0
- package/dist/badge.d.ts +13 -0
- package/dist/badge.js +31 -0
- package/dist/breadcrumb.d.ts +22 -0
- package/dist/breadcrumb.js +97 -0
- package/dist/button.d.ts +1 -1
- package/dist/button.js +4 -51
- package/dist/calendar.d.ts +11 -0
- package/dist/calendar.js +8 -0
- package/dist/carousel.d.ts +23 -0
- package/dist/carousel.js +200 -0
- package/dist/chart.d.ts +1 -0
- package/dist/chart.js +2 -0
- package/dist/checkbox.d.ts +6 -0
- package/dist/checkbox.js +31 -0
- package/dist/chunk-63HUTNB3.js +92 -0
- package/dist/chunk-7BHODGBN.js +25 -0
- package/dist/chunk-A4HW2TQU.js +66 -0
- package/dist/chunk-BOKKBA25.js +30 -0
- package/dist/chunk-DVPPDIDA.js +57 -0
- package/dist/chunk-FJGEWLIV.js +109 -0
- package/dist/chunk-KDTBFEE2.js +123 -0
- package/dist/chunk-PLLTYLGO.js +120 -0
- package/dist/chunk-QBAV4RWS.js +43 -0
- package/dist/collapsible.d.ts +8 -0
- package/dist/collapsible.js +10 -0
- package/dist/combobox.d.ts +6 -0
- package/dist/combobox.js +32 -0
- package/dist/command.d.ts +85 -0
- package/dist/command.js +24 -0
- package/dist/context-menu.d.ts +30 -0
- package/dist/context-menu.js +157 -0
- package/dist/data-table.d.ts +2 -0
- package/dist/data-table.js +21 -0
- package/dist/date-picker.d.ts +6 -0
- package/dist/date-picker.js +16 -0
- package/dist/dialog.d.ts +22 -0
- package/dist/dialog.js +25 -0
- package/dist/drawer.d.ts +27 -0
- package/dist/drawer.js +105 -0
- package/dist/dropdown-menu.d.ts +30 -0
- package/dist/dropdown-menu.js +155 -0
- package/dist/form.d.ts +28 -0
- package/dist/form.js +120 -0
- package/dist/hover-card.d.ts +8 -0
- package/dist/hover-card.js +29 -0
- package/dist/input-otp.d.ts +37 -0
- package/dist/input-otp.js +53 -0
- package/dist/label.d.ts +8 -0
- package/dist/label.js +7 -0
- package/dist/menubar.d.ts +31 -0
- package/dist/menubar.js +186 -0
- package/dist/native-select.d.ts +7 -0
- package/dist/native-select.js +31 -0
- package/dist/navigation-menu.d.ts +15 -0
- package/dist/navigation-menu.js +111 -0
- package/dist/pagination.d.ts +33 -0
- package/dist/pagination.js +111 -0
- package/dist/popover.d.ts +8 -0
- package/dist/popover.js +11 -0
- package/dist/progress.d.ts +6 -0
- package/dist/progress.js +30 -0
- package/dist/radio-group.d.ts +7 -0
- package/dist/radio-group.js +39 -0
- package/dist/resizable.d.ts +27 -0
- package/dist/resizable.js +42 -0
- package/dist/scroll-area.d.ts +7 -0
- package/dist/scroll-area.js +42 -0
- package/dist/select.d.ts +15 -0
- package/dist/select.js +128 -0
- package/dist/separator.d.ts +6 -0
- package/dist/separator.js +28 -0
- package/dist/sheet.d.ts +29 -0
- package/dist/sheet.js +25 -0
- package/dist/sidebar.d.ts +30 -0
- package/dist/sidebar.js +203 -0
- package/dist/skeleton.d.ts +5 -0
- package/dist/skeleton.js +21 -0
- package/dist/slider.d.ts +6 -0
- package/dist/slider.js +27 -0
- package/dist/sonner.d.ts +7 -0
- package/dist/sonner.js +23 -0
- package/dist/spinner.d.ts +12 -0
- package/dist/spinner.js +29 -0
- package/dist/switch.d.ts +6 -0
- package/dist/switch.js +31 -0
- package/dist/table.d.ts +12 -0
- package/dist/table.js +21 -0
- package/dist/tabs.d.ts +9 -0
- package/dist/tabs.js +51 -0
- package/dist/textarea.d.ts +7 -0
- package/dist/textarea.js +26 -0
- package/dist/toggle-group.d.ts +15 -0
- package/dist/toggle-group.js +49 -0
- package/dist/toggle.d.ts +15 -0
- package/dist/toggle.js +9 -0
- package/dist/tooltip.d.ts +9 -0
- package/dist/tooltip.js +30 -0
- package/package.json +237 -8
- package/src/accordion.tsx +55 -0
- package/src/alert-dialog.tsx +138 -0
- package/src/alert.tsx +58 -0
- package/src/aspect-ratio.tsx +5 -0
- package/src/avatar.tsx +47 -0
- package/src/badge.tsx +35 -0
- package/src/breadcrumb.tsx +114 -0
- package/src/calendar.tsx +63 -0
- package/src/carousel.tsx +259 -0
- package/src/chart.tsx +9 -0
- package/src/checkbox.tsx +27 -0
- package/src/collapsible.tsx +9 -0
- package/src/combobox.tsx +8 -0
- package/src/command.tsx +152 -0
- package/src/context-menu.tsx +197 -0
- package/src/data-table.tsx +9 -0
- package/src/date-picker.tsx +8 -0
- package/src/dialog.tsx +119 -0
- package/src/drawer.tsx +115 -0
- package/src/dropdown-menu.tsx +197 -0
- package/src/form.tsx +175 -0
- package/src/hover-card.tsx +26 -0
- package/src/input-otp.tsx +68 -0
- package/src/label.tsx +23 -0
- package/src/menubar.tsx +233 -0
- package/src/native-select.tsx +29 -0
- package/src/navigation-menu.tsx +127 -0
- package/src/pagination.tsx +116 -0
- package/src/popover.tsx +28 -0
- package/src/progress.tsx +25 -0
- package/src/radio-group.tsx +41 -0
- package/src/resizable.tsx +42 -0
- package/src/scroll-area.tsx +45 -0
- package/src/select.tsx +157 -0
- package/src/separator.tsx +28 -0
- package/src/sheet.tsx +137 -0
- package/src/sidebar.tsx +249 -0
- package/src/skeleton.tsx +15 -0
- package/src/slider.tsx +25 -0
- package/src/sonner.tsx +25 -0
- package/src/spinner.tsx +33 -0
- package/src/switch.tsx +26 -0
- package/src/table.tsx +116 -0
- package/src/tabs.tsx +52 -0
- package/src/textarea.tsx +23 -0
- package/src/toggle-group.tsx +58 -0
- package/src/toggle.tsx +42 -0
- package/src/tooltip.tsx +27 -0
- package/LICENSE +0 -21
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
|
|
3
|
+
|
|
4
|
+
declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
5
|
+
declare const RadioGroupItem: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
6
|
+
|
|
7
|
+
export { RadioGroup, RadioGroupItem };
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn
|
|
3
|
+
} from "./chunk-RQHJBTEU.js";
|
|
4
|
+
|
|
5
|
+
// src/radio-group.tsx
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
|
|
8
|
+
import { Circle } from "lucide-react";
|
|
9
|
+
import { jsx } from "react/jsx-runtime";
|
|
10
|
+
var RadioGroup = React.forwardRef(({ className, ...props }, ref) => {
|
|
11
|
+
return /* @__PURE__ */ jsx(
|
|
12
|
+
RadioGroupPrimitive.Root,
|
|
13
|
+
{
|
|
14
|
+
className: cn("grid gap-2", className),
|
|
15
|
+
...props,
|
|
16
|
+
ref
|
|
17
|
+
}
|
|
18
|
+
);
|
|
19
|
+
});
|
|
20
|
+
RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
|
|
21
|
+
var RadioGroupItem = React.forwardRef(({ className, ...props }, ref) => {
|
|
22
|
+
return /* @__PURE__ */ jsx(
|
|
23
|
+
RadioGroupPrimitive.Item,
|
|
24
|
+
{
|
|
25
|
+
ref,
|
|
26
|
+
className: cn(
|
|
27
|
+
"aspect-square size-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
|
28
|
+
className
|
|
29
|
+
),
|
|
30
|
+
...props,
|
|
31
|
+
children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(Circle, { className: "size-2.5 fill-current text-current" }) })
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
});
|
|
35
|
+
RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
|
|
36
|
+
export {
|
|
37
|
+
RadioGroup,
|
|
38
|
+
RadioGroupItem
|
|
39
|
+
};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as React$1 from 'react';
|
|
2
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
|
+
import * as ResizablePrimitive from 'react-resizable-panels';
|
|
4
|
+
|
|
5
|
+
declare const ResizablePanelGroup: ({ className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => react_jsx_runtime.JSX.Element;
|
|
6
|
+
declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLButtonElement | HTMLElement | HTMLDivElement | HTMLObjectElement | HTMLAnchorElement | HTMLFormElement | HTMLHeadingElement | HTMLImageElement | HTMLInputElement | HTMLLabelElement | HTMLLIElement | HTMLOListElement | HTMLParagraphElement | HTMLSelectElement | HTMLSpanElement | HTMLUListElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLLegendElement | HTMLLinkElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSourceElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLVideoElement | HTMLTableCaptionElement | HTMLMenuElement | HTMLPictureElement>, "id" | "onResize"> & {
|
|
7
|
+
className?: string | undefined;
|
|
8
|
+
collapsedSize?: number | undefined;
|
|
9
|
+
collapsible?: boolean | undefined;
|
|
10
|
+
defaultSize?: number | undefined;
|
|
11
|
+
id?: string | undefined;
|
|
12
|
+
maxSize?: number | undefined;
|
|
13
|
+
minSize?: number | undefined;
|
|
14
|
+
onCollapse?: ResizablePrimitive.PanelOnCollapse | undefined;
|
|
15
|
+
onExpand?: ResizablePrimitive.PanelOnExpand | undefined;
|
|
16
|
+
onResize?: ResizablePrimitive.PanelOnResize | undefined;
|
|
17
|
+
order?: number | undefined;
|
|
18
|
+
style?: object | undefined;
|
|
19
|
+
tagName?: keyof HTMLElementTagNameMap | undefined;
|
|
20
|
+
} & {
|
|
21
|
+
children?: React$1.ReactNode;
|
|
22
|
+
} & React$1.RefAttributes<ResizablePrimitive.ImperativePanelHandle>>;
|
|
23
|
+
declare const ResizableHandle: ({ withHandle, className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
|
|
24
|
+
withHandle?: boolean;
|
|
25
|
+
}) => react_jsx_runtime.JSX.Element;
|
|
26
|
+
|
|
27
|
+
export { ResizableHandle, ResizablePanel, ResizablePanelGroup };
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn
|
|
3
|
+
} from "./chunk-RQHJBTEU.js";
|
|
4
|
+
|
|
5
|
+
// src/resizable.tsx
|
|
6
|
+
import { GripVertical } from "lucide-react";
|
|
7
|
+
import * as ResizablePrimitive from "react-resizable-panels";
|
|
8
|
+
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
var ResizablePanelGroup = ({
|
|
10
|
+
className,
|
|
11
|
+
...props
|
|
12
|
+
}) => /* @__PURE__ */ jsx(
|
|
13
|
+
ResizablePrimitive.PanelGroup,
|
|
14
|
+
{
|
|
15
|
+
className: cn(
|
|
16
|
+
"flex h-full w-full data-[panel-group-direction=vertical]:flex-col",
|
|
17
|
+
className
|
|
18
|
+
),
|
|
19
|
+
...props
|
|
20
|
+
}
|
|
21
|
+
);
|
|
22
|
+
var ResizablePanel = ResizablePrimitive.Panel;
|
|
23
|
+
var ResizableHandle = ({
|
|
24
|
+
withHandle,
|
|
25
|
+
className,
|
|
26
|
+
...props
|
|
27
|
+
}) => /* @__PURE__ */ jsx(
|
|
28
|
+
ResizablePrimitive.PanelResizeHandle,
|
|
29
|
+
{
|
|
30
|
+
className: cn(
|
|
31
|
+
"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90",
|
|
32
|
+
className
|
|
33
|
+
),
|
|
34
|
+
...props,
|
|
35
|
+
children: withHandle && /* @__PURE__ */ jsx("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border", children: /* @__PURE__ */ jsx(GripVertical, { className: "size-2.5" }) })
|
|
36
|
+
}
|
|
37
|
+
);
|
|
38
|
+
export {
|
|
39
|
+
ResizableHandle,
|
|
40
|
+
ResizablePanel,
|
|
41
|
+
ResizablePanelGroup
|
|
42
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
|
|
3
|
+
|
|
4
|
+
declare const ScrollArea: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
5
|
+
declare const ScrollBar: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaScrollbarProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
6
|
+
|
|
7
|
+
export { ScrollArea, ScrollBar };
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn
|
|
3
|
+
} from "./chunk-RQHJBTEU.js";
|
|
4
|
+
|
|
5
|
+
// src/scroll-area.tsx
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
|
|
8
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
|
+
var ScrollArea = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
10
|
+
ScrollAreaPrimitive.Root,
|
|
11
|
+
{
|
|
12
|
+
ref,
|
|
13
|
+
className: cn("relative overflow-hidden", className),
|
|
14
|
+
...props,
|
|
15
|
+
children: [
|
|
16
|
+
/* @__PURE__ */ jsx(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
|
|
17
|
+
/* @__PURE__ */ jsx(ScrollBar, {}),
|
|
18
|
+
/* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, {})
|
|
19
|
+
]
|
|
20
|
+
}
|
|
21
|
+
));
|
|
22
|
+
ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
|
|
23
|
+
var ScrollBar = React.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx(
|
|
24
|
+
ScrollAreaPrimitive.ScrollAreaScrollbar,
|
|
25
|
+
{
|
|
26
|
+
ref,
|
|
27
|
+
orientation,
|
|
28
|
+
className: cn(
|
|
29
|
+
"flex touch-none select-none transition-colors",
|
|
30
|
+
orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
|
|
31
|
+
orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
|
|
32
|
+
className
|
|
33
|
+
),
|
|
34
|
+
...props,
|
|
35
|
+
children: /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
|
|
36
|
+
}
|
|
37
|
+
));
|
|
38
|
+
ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
|
|
39
|
+
export {
|
|
40
|
+
ScrollArea,
|
|
41
|
+
ScrollBar
|
|
42
|
+
};
|
package/dist/select.d.ts
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
3
|
+
|
|
4
|
+
declare const Select: React.FC<SelectPrimitive.SelectProps>;
|
|
5
|
+
declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
|
|
6
|
+
declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
|
|
7
|
+
declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
8
|
+
declare const SelectScrollUpButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
9
|
+
declare const SelectScrollDownButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
+
declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
11
|
+
declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
12
|
+
declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
13
|
+
declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
14
|
+
|
|
15
|
+
export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue };
|
package/dist/select.js
ADDED
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn
|
|
3
|
+
} from "./chunk-RQHJBTEU.js";
|
|
4
|
+
|
|
5
|
+
// src/select.tsx
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
8
|
+
import { Check, ChevronDown, ChevronUp } from "lucide-react";
|
|
9
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
+
var Select = SelectPrimitive.Root;
|
|
11
|
+
var SelectGroup = SelectPrimitive.Group;
|
|
12
|
+
var SelectValue = SelectPrimitive.Value;
|
|
13
|
+
var SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
14
|
+
SelectPrimitive.Trigger,
|
|
15
|
+
{
|
|
16
|
+
ref,
|
|
17
|
+
className: cn(
|
|
18
|
+
"flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
|
19
|
+
className
|
|
20
|
+
),
|
|
21
|
+
...props,
|
|
22
|
+
children: [
|
|
23
|
+
children,
|
|
24
|
+
/* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4 opacity-50" }) })
|
|
25
|
+
]
|
|
26
|
+
}
|
|
27
|
+
));
|
|
28
|
+
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
29
|
+
var SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
30
|
+
SelectPrimitive.ScrollUpButton,
|
|
31
|
+
{
|
|
32
|
+
ref,
|
|
33
|
+
className: cn(
|
|
34
|
+
"flex cursor-default items-center justify-center py-1",
|
|
35
|
+
className
|
|
36
|
+
),
|
|
37
|
+
...props,
|
|
38
|
+
children: /* @__PURE__ */ jsx(ChevronUp, { className: "size-4" })
|
|
39
|
+
}
|
|
40
|
+
));
|
|
41
|
+
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
42
|
+
var SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
43
|
+
SelectPrimitive.ScrollDownButton,
|
|
44
|
+
{
|
|
45
|
+
ref,
|
|
46
|
+
className: cn(
|
|
47
|
+
"flex cursor-default items-center justify-center py-1",
|
|
48
|
+
className
|
|
49
|
+
),
|
|
50
|
+
...props,
|
|
51
|
+
children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4" })
|
|
52
|
+
}
|
|
53
|
+
));
|
|
54
|
+
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
55
|
+
var SelectContent = React.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
|
|
56
|
+
SelectPrimitive.Content,
|
|
57
|
+
{
|
|
58
|
+
ref,
|
|
59
|
+
className: cn(
|
|
60
|
+
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
61
|
+
position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
62
|
+
className
|
|
63
|
+
),
|
|
64
|
+
position,
|
|
65
|
+
...props,
|
|
66
|
+
children: [
|
|
67
|
+
/* @__PURE__ */ jsx(SelectScrollUpButton, {}),
|
|
68
|
+
/* @__PURE__ */ jsx(
|
|
69
|
+
SelectPrimitive.Viewport,
|
|
70
|
+
{
|
|
71
|
+
className: cn(
|
|
72
|
+
"p-1",
|
|
73
|
+
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
|
|
74
|
+
),
|
|
75
|
+
children
|
|
76
|
+
}
|
|
77
|
+
),
|
|
78
|
+
/* @__PURE__ */ jsx(SelectScrollDownButton, {})
|
|
79
|
+
]
|
|
80
|
+
}
|
|
81
|
+
) }));
|
|
82
|
+
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
83
|
+
var SelectLabel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
84
|
+
SelectPrimitive.Label,
|
|
85
|
+
{
|
|
86
|
+
ref,
|
|
87
|
+
className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
|
|
88
|
+
...props
|
|
89
|
+
}
|
|
90
|
+
));
|
|
91
|
+
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
92
|
+
var SelectItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
93
|
+
SelectPrimitive.Item,
|
|
94
|
+
{
|
|
95
|
+
ref,
|
|
96
|
+
className: cn(
|
|
97
|
+
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
98
|
+
className
|
|
99
|
+
),
|
|
100
|
+
...props,
|
|
101
|
+
children: [
|
|
102
|
+
/* @__PURE__ */ jsx("span", { className: "absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "size-4" }) }) }),
|
|
103
|
+
/* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
|
|
104
|
+
]
|
|
105
|
+
}
|
|
106
|
+
));
|
|
107
|
+
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
108
|
+
var SelectSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
109
|
+
SelectPrimitive.Separator,
|
|
110
|
+
{
|
|
111
|
+
ref,
|
|
112
|
+
className: cn("-mx-1 my-1 h-px bg-muted", className),
|
|
113
|
+
...props
|
|
114
|
+
}
|
|
115
|
+
));
|
|
116
|
+
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
117
|
+
export {
|
|
118
|
+
Select,
|
|
119
|
+
SelectContent,
|
|
120
|
+
SelectGroup,
|
|
121
|
+
SelectItem,
|
|
122
|
+
SelectLabel,
|
|
123
|
+
SelectScrollDownButton,
|
|
124
|
+
SelectScrollUpButton,
|
|
125
|
+
SelectSeparator,
|
|
126
|
+
SelectTrigger,
|
|
127
|
+
SelectValue
|
|
128
|
+
};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as SeparatorPrimitive from '@radix-ui/react-separator';
|
|
3
|
+
|
|
4
|
+
declare const Separator: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
5
|
+
|
|
6
|
+
export { Separator };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn
|
|
3
|
+
} from "./chunk-RQHJBTEU.js";
|
|
4
|
+
|
|
5
|
+
// src/separator.tsx
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
import * as SeparatorPrimitive from "@radix-ui/react-separator";
|
|
8
|
+
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
var Separator = React.forwardRef(
|
|
10
|
+
({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
11
|
+
SeparatorPrimitive.Root,
|
|
12
|
+
{
|
|
13
|
+
ref,
|
|
14
|
+
decorative,
|
|
15
|
+
orientation,
|
|
16
|
+
className: cn(
|
|
17
|
+
"shrink-0 bg-border",
|
|
18
|
+
orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
|
|
19
|
+
className
|
|
20
|
+
),
|
|
21
|
+
...props
|
|
22
|
+
}
|
|
23
|
+
)
|
|
24
|
+
);
|
|
25
|
+
Separator.displayName = SeparatorPrimitive.Root.displayName;
|
|
26
|
+
export {
|
|
27
|
+
Separator
|
|
28
|
+
};
|
package/dist/sheet.d.ts
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
5
|
+
import { VariantProps } from 'class-variance-authority';
|
|
6
|
+
|
|
7
|
+
declare const Sheet: React.FC<DialogPrimitive.DialogProps>;
|
|
8
|
+
declare const SheetTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
9
|
+
declare const SheetClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
|
|
10
|
+
declare const SheetPortal: React.FC<DialogPrimitive.DialogPortalProps>;
|
|
11
|
+
declare const SheetOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
12
|
+
declare const sheetVariants: (props?: ({
|
|
13
|
+
side?: "top" | "right" | "bottom" | "left" | null | undefined;
|
|
14
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
15
|
+
interface SheetContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
|
|
16
|
+
}
|
|
17
|
+
declare const SheetContent: React.ForwardRefExoticComponent<SheetContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
18
|
+
declare const SheetHeader: {
|
|
19
|
+
({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
20
|
+
displayName: string;
|
|
21
|
+
};
|
|
22
|
+
declare const SheetFooter: {
|
|
23
|
+
({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
24
|
+
displayName: string;
|
|
25
|
+
};
|
|
26
|
+
declare const SheetTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
|
|
27
|
+
declare const SheetDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
|
|
28
|
+
|
|
29
|
+
export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger };
|
package/dist/sheet.js
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Sheet,
|
|
3
|
+
SheetClose,
|
|
4
|
+
SheetContent,
|
|
5
|
+
SheetDescription,
|
|
6
|
+
SheetFooter,
|
|
7
|
+
SheetHeader,
|
|
8
|
+
SheetOverlay,
|
|
9
|
+
SheetPortal,
|
|
10
|
+
SheetTitle,
|
|
11
|
+
SheetTrigger
|
|
12
|
+
} from "./chunk-PLLTYLGO.js";
|
|
13
|
+
import "./chunk-RQHJBTEU.js";
|
|
14
|
+
export {
|
|
15
|
+
Sheet,
|
|
16
|
+
SheetClose,
|
|
17
|
+
SheetContent,
|
|
18
|
+
SheetDescription,
|
|
19
|
+
SheetFooter,
|
|
20
|
+
SheetHeader,
|
|
21
|
+
SheetOverlay,
|
|
22
|
+
SheetPortal,
|
|
23
|
+
SheetTitle,
|
|
24
|
+
SheetTrigger
|
|
25
|
+
};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { ButtonProps } from './button.js';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import 'class-variance-authority/types';
|
|
4
|
+
import 'class-variance-authority';
|
|
5
|
+
|
|
6
|
+
type SidebarContext = {
|
|
7
|
+
state: "expanded" | "collapsed";
|
|
8
|
+
open: boolean;
|
|
9
|
+
setOpen: (open: boolean) => void;
|
|
10
|
+
openMobile: boolean;
|
|
11
|
+
setOpenMobile: (open: boolean) => void;
|
|
12
|
+
isMobile: boolean;
|
|
13
|
+
toggleSidebar: () => void;
|
|
14
|
+
};
|
|
15
|
+
declare const SidebarContext: React.Context<SidebarContext | null>;
|
|
16
|
+
declare function useSidebar(): SidebarContext;
|
|
17
|
+
declare const SidebarProvider: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
|
|
18
|
+
defaultOpen?: boolean;
|
|
19
|
+
open?: boolean;
|
|
20
|
+
onOpenChange?: (open: boolean) => void;
|
|
21
|
+
}, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
22
|
+
declare const Sidebar: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
|
|
23
|
+
side?: "left" | "right";
|
|
24
|
+
variant?: "sidebar" | "floating" | "inset";
|
|
25
|
+
collapsible?: "offcanvas" | "icon" | "none";
|
|
26
|
+
}, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
27
|
+
declare const SidebarTrigger: React.ForwardRefExoticComponent<Omit<ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
28
|
+
declare const SidebarContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
29
|
+
|
|
30
|
+
export { Sidebar, SidebarContent, SidebarProvider, SidebarTrigger, useSidebar };
|
package/dist/sidebar.js
ADDED
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Sheet,
|
|
3
|
+
SheetContent
|
|
4
|
+
} from "./chunk-PLLTYLGO.js";
|
|
5
|
+
import {
|
|
6
|
+
Button
|
|
7
|
+
} from "./chunk-DVPPDIDA.js";
|
|
8
|
+
import {
|
|
9
|
+
cn
|
|
10
|
+
} from "./chunk-RQHJBTEU.js";
|
|
11
|
+
|
|
12
|
+
// src/sidebar.tsx
|
|
13
|
+
import * as React from "react";
|
|
14
|
+
import { PanelLeft } from "lucide-react";
|
|
15
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
16
|
+
var SIDEBAR_WIDTH = "16rem";
|
|
17
|
+
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
18
|
+
var SIDEBAR_WIDTH_ICON = "3rem";
|
|
19
|
+
var SidebarContext = React.createContext(null);
|
|
20
|
+
function useSidebar() {
|
|
21
|
+
const context = React.useContext(SidebarContext);
|
|
22
|
+
if (!context) {
|
|
23
|
+
throw new Error("useSidebar must be used within a SidebarProvider.");
|
|
24
|
+
}
|
|
25
|
+
return context;
|
|
26
|
+
}
|
|
27
|
+
var SidebarProvider = React.forwardRef(
|
|
28
|
+
({
|
|
29
|
+
defaultOpen = true,
|
|
30
|
+
open: openProp,
|
|
31
|
+
onOpenChange: setOpenProp,
|
|
32
|
+
className,
|
|
33
|
+
style,
|
|
34
|
+
children,
|
|
35
|
+
...props
|
|
36
|
+
}, ref) => {
|
|
37
|
+
const [openMobile, setOpenMobile] = React.useState(false);
|
|
38
|
+
const [_open, _setOpen] = React.useState(defaultOpen);
|
|
39
|
+
const open = openProp ?? _open;
|
|
40
|
+
const setOpen = React.useCallback(
|
|
41
|
+
(value) => {
|
|
42
|
+
const openState = typeof value === "function" ? value(open) : value;
|
|
43
|
+
if (setOpenProp) {
|
|
44
|
+
setOpenProp(openState);
|
|
45
|
+
} else {
|
|
46
|
+
_setOpen(openState);
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
[setOpenProp, open]
|
|
50
|
+
);
|
|
51
|
+
const isMobile = false;
|
|
52
|
+
const state = open ? "expanded" : "collapsed";
|
|
53
|
+
const contextValue = React.useMemo(
|
|
54
|
+
() => ({
|
|
55
|
+
state,
|
|
56
|
+
open,
|
|
57
|
+
setOpen,
|
|
58
|
+
isMobile,
|
|
59
|
+
openMobile,
|
|
60
|
+
setOpenMobile,
|
|
61
|
+
toggleSidebar: () => setOpen(!open)
|
|
62
|
+
}),
|
|
63
|
+
[state, open, setOpen, isMobile, openMobile, setOpenMobile]
|
|
64
|
+
);
|
|
65
|
+
return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
|
|
66
|
+
"div",
|
|
67
|
+
{
|
|
68
|
+
style: {
|
|
69
|
+
"--sidebar-width": SIDEBAR_WIDTH,
|
|
70
|
+
"--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
|
|
71
|
+
...style
|
|
72
|
+
},
|
|
73
|
+
className: cn(
|
|
74
|
+
"group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-sidebar",
|
|
75
|
+
className
|
|
76
|
+
),
|
|
77
|
+
ref,
|
|
78
|
+
...props,
|
|
79
|
+
children
|
|
80
|
+
}
|
|
81
|
+
) });
|
|
82
|
+
}
|
|
83
|
+
);
|
|
84
|
+
SidebarProvider.displayName = "SidebarProvider";
|
|
85
|
+
var Sidebar = React.forwardRef(
|
|
86
|
+
({
|
|
87
|
+
side = "left",
|
|
88
|
+
variant = "sidebar",
|
|
89
|
+
collapsible = "offcanvas",
|
|
90
|
+
className,
|
|
91
|
+
children,
|
|
92
|
+
...props
|
|
93
|
+
}, ref) => {
|
|
94
|
+
const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
|
|
95
|
+
if (collapsible === "none") {
|
|
96
|
+
return /* @__PURE__ */ jsx(
|
|
97
|
+
"div",
|
|
98
|
+
{
|
|
99
|
+
className: cn(
|
|
100
|
+
"flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
|
|
101
|
+
className
|
|
102
|
+
),
|
|
103
|
+
ref,
|
|
104
|
+
...props,
|
|
105
|
+
children
|
|
106
|
+
}
|
|
107
|
+
);
|
|
108
|
+
}
|
|
109
|
+
if (isMobile) {
|
|
110
|
+
return /* @__PURE__ */ jsx(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsx(
|
|
111
|
+
SheetContent,
|
|
112
|
+
{
|
|
113
|
+
"data-sidebar": "sidebar",
|
|
114
|
+
"data-mobile": "true",
|
|
115
|
+
className: "w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
|
|
116
|
+
style: {
|
|
117
|
+
"--sidebar-width": SIDEBAR_WIDTH_MOBILE
|
|
118
|
+
},
|
|
119
|
+
side,
|
|
120
|
+
children: /* @__PURE__ */ jsx("div", { className: "flex h-full w-full flex-col", children })
|
|
121
|
+
}
|
|
122
|
+
) });
|
|
123
|
+
}
|
|
124
|
+
return /* @__PURE__ */ jsx(
|
|
125
|
+
"div",
|
|
126
|
+
{
|
|
127
|
+
ref,
|
|
128
|
+
className: "group peer hidden md:block",
|
|
129
|
+
"data-state": state,
|
|
130
|
+
"data-collapsible": state === "collapsed" ? collapsible : "",
|
|
131
|
+
"data-variant": variant,
|
|
132
|
+
"data-side": side,
|
|
133
|
+
children: /* @__PURE__ */ jsx(
|
|
134
|
+
"div",
|
|
135
|
+
{
|
|
136
|
+
className: cn(
|
|
137
|
+
"duration-200 relative h-svh w-[--sidebar-width] bg-sidebar transition-[width] ease-linear",
|
|
138
|
+
"group-data-[collapsible=offcanvas]:w-0",
|
|
139
|
+
"group-data-[side=right]:rotate-180",
|
|
140
|
+
variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon]",
|
|
141
|
+
className
|
|
142
|
+
),
|
|
143
|
+
...props,
|
|
144
|
+
children: /* @__PURE__ */ jsx(
|
|
145
|
+
"div",
|
|
146
|
+
{
|
|
147
|
+
"data-sidebar": "sidebar",
|
|
148
|
+
className: "duration-200 flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow",
|
|
149
|
+
children
|
|
150
|
+
}
|
|
151
|
+
)
|
|
152
|
+
}
|
|
153
|
+
)
|
|
154
|
+
}
|
|
155
|
+
);
|
|
156
|
+
}
|
|
157
|
+
);
|
|
158
|
+
Sidebar.displayName = "Sidebar";
|
|
159
|
+
var SidebarTrigger = React.forwardRef(({ className, onClick, ...props }, ref) => {
|
|
160
|
+
const { toggleSidebar } = useSidebar();
|
|
161
|
+
return /* @__PURE__ */ jsxs(
|
|
162
|
+
Button,
|
|
163
|
+
{
|
|
164
|
+
ref,
|
|
165
|
+
"data-sidebar": "trigger",
|
|
166
|
+
variant: "ghost",
|
|
167
|
+
size: "icon",
|
|
168
|
+
className: cn("size-7", className),
|
|
169
|
+
onClick: (event) => {
|
|
170
|
+
onClick?.(event);
|
|
171
|
+
toggleSidebar();
|
|
172
|
+
},
|
|
173
|
+
...props,
|
|
174
|
+
children: [
|
|
175
|
+
/* @__PURE__ */ jsx(PanelLeft, {}),
|
|
176
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle Sidebar" })
|
|
177
|
+
]
|
|
178
|
+
}
|
|
179
|
+
);
|
|
180
|
+
});
|
|
181
|
+
SidebarTrigger.displayName = "SidebarTrigger";
|
|
182
|
+
var SidebarContent = React.forwardRef(({ className, ...props }, ref) => {
|
|
183
|
+
return /* @__PURE__ */ jsx(
|
|
184
|
+
"div",
|
|
185
|
+
{
|
|
186
|
+
"data-sidebar": "content",
|
|
187
|
+
ref,
|
|
188
|
+
className: cn(
|
|
189
|
+
"flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
|
|
190
|
+
className
|
|
191
|
+
),
|
|
192
|
+
...props
|
|
193
|
+
}
|
|
194
|
+
);
|
|
195
|
+
});
|
|
196
|
+
SidebarContent.displayName = "SidebarContent";
|
|
197
|
+
export {
|
|
198
|
+
Sidebar,
|
|
199
|
+
SidebarContent,
|
|
200
|
+
SidebarProvider,
|
|
201
|
+
SidebarTrigger,
|
|
202
|
+
useSidebar
|
|
203
|
+
};
|
package/dist/skeleton.js
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn
|
|
3
|
+
} from "./chunk-RQHJBTEU.js";
|
|
4
|
+
|
|
5
|
+
// src/skeleton.tsx
|
|
6
|
+
import { jsx } from "react/jsx-runtime";
|
|
7
|
+
function Skeleton({
|
|
8
|
+
className,
|
|
9
|
+
...props
|
|
10
|
+
}) {
|
|
11
|
+
return /* @__PURE__ */ jsx(
|
|
12
|
+
"div",
|
|
13
|
+
{
|
|
14
|
+
className: cn("animate-pulse rounded-md bg-muted", className),
|
|
15
|
+
...props
|
|
16
|
+
}
|
|
17
|
+
);
|
|
18
|
+
}
|
|
19
|
+
export {
|
|
20
|
+
Skeleton
|
|
21
|
+
};
|