@databricks/appkit-ui 0.1.4 → 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/AGENTS.md +89 -12
- package/CLAUDE.md +89 -12
- package/NOTICE.md +4 -0
- package/README.md +21 -15
- package/dist/js/arrow/arrow-client.js.map +1 -1
- package/dist/js/arrow/lazy-arrow.js.map +1 -1
- package/dist/js/sse/connect-sse.js.map +1 -1
- package/dist/react/charts/area/index.d.ts +2 -2
- package/dist/react/charts/bar/index.d.ts +2 -2
- package/dist/react/charts/base.d.ts +2 -2
- package/dist/react/charts/base.js.map +1 -1
- package/dist/react/charts/create-chart.d.ts +2 -2
- package/dist/react/charts/create-chart.js +2 -1
- package/dist/react/charts/create-chart.js.map +1 -1
- package/dist/react/charts/heatmap/index.d.ts +2 -2
- package/dist/react/charts/line/index.d.ts +2 -2
- package/dist/react/charts/normalize.d.ts +1 -1
- package/dist/react/charts/normalize.js +1 -1
- package/dist/react/charts/normalize.js.map +1 -1
- package/dist/react/charts/pie/index.d.ts +3 -3
- package/dist/react/charts/radar/index.d.ts +2 -2
- package/dist/react/charts/scatter/index.d.ts +2 -2
- package/dist/react/charts/theme.js.map +1 -1
- package/dist/react/charts/types.d.ts +5 -0
- package/dist/react/charts/types.d.ts.map +1 -1
- package/dist/react/charts/types.js.map +1 -1
- package/dist/react/charts/utils.js.map +1 -1
- package/dist/react/charts/wrapper.d.ts +4 -2
- package/dist/react/charts/wrapper.d.ts.map +1 -1
- package/dist/react/charts/wrapper.js +4 -2
- package/dist/react/charts/wrapper.js.map +1 -1
- package/dist/react/hooks/types.d.ts +2 -0
- package/dist/react/hooks/types.d.ts.map +1 -1
- package/dist/react/hooks/use-analytics-query.js +9 -3
- package/dist/react/hooks/use-analytics-query.js.map +1 -1
- package/dist/react/hooks/use-chart-data.d.ts +2 -0
- package/dist/react/hooks/use-chart-data.d.ts.map +1 -1
- package/dist/react/hooks/use-chart-data.js +3 -2
- package/dist/react/hooks/use-chart-data.js.map +1 -1
- package/dist/react/hooks/use-mobile.js +3 -3
- package/dist/react/hooks/use-mobile.js.map +1 -1
- package/dist/react/index.d.ts +3 -1
- package/dist/react/index.js +3 -1
- package/dist/react/lib/utils.d.ts +7 -0
- package/dist/react/lib/utils.d.ts.map +1 -0
- package/dist/react/portal-container-context.d.ts +48 -0
- package/dist/react/portal-container-context.d.ts.map +1 -0
- package/dist/react/portal-container-context.js +51 -0
- package/dist/react/portal-container-context.js.map +1 -0
- package/dist/react/table/data-table.d.ts +2 -2
- package/dist/react/table/data-table.d.ts.map +1 -1
- package/dist/react/table/table-wrapper.js +3 -2
- package/dist/react/table/table-wrapper.js.map +1 -1
- package/dist/react/table/types.d.ts.map +1 -1
- package/dist/react/ui/accordion.d.ts +6 -6
- package/dist/react/ui/accordion.d.ts.map +1 -1
- package/dist/react/ui/alert-dialog.d.ts +14 -13
- package/dist/react/ui/alert-dialog.d.ts.map +1 -1
- package/dist/react/ui/alert-dialog.js +3 -1
- package/dist/react/ui/alert-dialog.js.map +1 -1
- package/dist/react/ui/alert.d.ts +5 -5
- package/dist/react/ui/alert.d.ts.map +1 -1
- package/dist/react/ui/aspect-ratio.d.ts +2 -2
- package/dist/react/ui/avatar.d.ts +5 -5
- package/dist/react/ui/avatar.d.ts.map +1 -1
- package/dist/react/ui/badge.d.ts +6 -6
- package/dist/react/ui/badge.d.ts.map +1 -1
- package/dist/react/ui/breadcrumb.d.ts +10 -10
- package/dist/react/ui/breadcrumb.d.ts.map +1 -1
- package/dist/react/ui/button-group.d.ts +6 -6
- package/dist/react/ui/button.d.ts +6 -6
- package/dist/react/ui/button.d.ts.map +1 -1
- package/dist/react/ui/calendar.d.ts +6 -6
- package/dist/react/ui/calendar.d.ts.map +1 -1
- package/dist/react/ui/calendar.js +3 -3
- package/dist/react/ui/calendar.js.map +1 -1
- package/dist/react/ui/card.d.ts +9 -9
- package/dist/react/ui/card.d.ts.map +1 -1
- package/dist/react/ui/carousel.d.ts +7 -7
- package/dist/react/ui/carousel.d.ts.map +1 -1
- package/dist/react/ui/carousel.js +11 -11
- package/dist/react/ui/carousel.js.map +1 -1
- package/dist/react/ui/chart.d.ts +52 -16
- package/dist/react/ui/chart.d.ts.map +1 -1
- package/dist/react/ui/chart.js +23 -7
- package/dist/react/ui/chart.js.map +1 -1
- package/dist/react/ui/checkbox.d.ts +3 -3
- package/dist/react/ui/checkbox.d.ts.map +1 -1
- package/dist/react/ui/checkbox.js +1 -1
- package/dist/react/ui/checkbox.js.map +1 -1
- package/dist/react/ui/collapsible.d.ts +4 -4
- package/dist/react/ui/command.d.ts +12 -12
- package/dist/react/ui/command.d.ts.map +1 -1
- package/dist/react/ui/context-menu.d.ts +21 -20
- package/dist/react/ui/context-menu.d.ts.map +1 -1
- package/dist/react/ui/context-menu.js +11 -6
- package/dist/react/ui/context-menu.js.map +1 -1
- package/dist/react/ui/dialog.d.ts +14 -13
- package/dist/react/ui/dialog.d.ts.map +1 -1
- package/dist/react/ui/dialog.js +3 -1
- package/dist/react/ui/dialog.js.map +1 -1
- package/dist/react/ui/drawer.d.ts +13 -12
- package/dist/react/ui/drawer.d.ts.map +1 -1
- package/dist/react/ui/drawer.js +3 -1
- package/dist/react/ui/drawer.js.map +1 -1
- package/dist/react/ui/dropdown-menu.d.ts +21 -20
- package/dist/react/ui/dropdown-menu.d.ts.map +1 -1
- package/dist/react/ui/dropdown-menu.js +12 -7
- package/dist/react/ui/dropdown-menu.js.map +1 -1
- package/dist/react/ui/empty.d.ts +7 -7
- package/dist/react/ui/field.d.ts +11 -11
- package/dist/react/ui/form.d.ts +9 -9
- package/dist/react/ui/form.d.ts.map +1 -1
- package/dist/react/ui/form.js +6 -6
- package/dist/react/ui/form.js.map +1 -1
- package/dist/react/ui/hover-card.d.ts +5 -5
- package/dist/react/ui/hover-card.d.ts.map +1 -1
- package/dist/react/ui/hover-card.js +2 -0
- package/dist/react/ui/hover-card.js.map +1 -1
- package/dist/react/ui/input-group.d.ts +11 -11
- package/dist/react/ui/input-group.d.ts.map +1 -1
- package/dist/react/ui/input-otp.d.ts +8 -8
- package/dist/react/ui/input-otp.d.ts.map +1 -1
- package/dist/react/ui/input-otp.js +2 -2
- package/dist/react/ui/input-otp.js.map +1 -1
- package/dist/react/ui/input.d.ts +3 -3
- package/dist/react/ui/input.d.ts.map +1 -1
- package/dist/react/ui/item.d.ts +16 -16
- package/dist/react/ui/item.d.ts.map +1 -1
- package/dist/react/ui/kbd.d.ts +3 -3
- package/dist/react/ui/label.d.ts +3 -3
- package/dist/react/ui/label.d.ts.map +1 -1
- package/dist/react/ui/menubar.d.ts +22 -21
- package/dist/react/ui/menubar.d.ts.map +1 -1
- package/dist/react/ui/menubar.js +3 -1
- package/dist/react/ui/menubar.js.map +1 -1
- package/dist/react/ui/navigation-menu.d.ts +11 -11
- package/dist/react/ui/navigation-menu.d.ts.map +1 -1
- package/dist/react/ui/pagination.d.ts +10 -10
- package/dist/react/ui/pagination.d.ts.map +1 -1
- package/dist/react/ui/popover.d.ts +6 -6
- package/dist/react/ui/popover.d.ts.map +1 -1
- package/dist/react/ui/popover.js +11 -7
- package/dist/react/ui/popover.js.map +1 -1
- package/dist/react/ui/progress.d.ts +3 -3
- package/dist/react/ui/progress.d.ts.map +1 -1
- package/dist/react/ui/radio-group.d.ts +4 -4
- package/dist/react/ui/radio-group.d.ts.map +1 -1
- package/dist/react/ui/resizable.d.ts +6 -6
- package/dist/react/ui/resizable.d.ts.map +1 -1
- package/dist/react/ui/scroll-area.d.ts +4 -4
- package/dist/react/ui/scroll-area.d.ts.map +1 -1
- package/dist/react/ui/select.d.ts +13 -13
- package/dist/react/ui/select.d.ts.map +1 -1
- package/dist/react/ui/select.js +19 -15
- package/dist/react/ui/select.js.map +1 -1
- package/dist/react/ui/separator.d.ts +3 -3
- package/dist/react/ui/separator.d.ts.map +1 -1
- package/dist/react/ui/sheet.d.ts +11 -11
- package/dist/react/ui/sheet.d.ts.map +1 -1
- package/dist/react/ui/sheet.js +3 -1
- package/dist/react/ui/sheet.js.map +1 -1
- package/dist/react/ui/sidebar.d.ts +34 -34
- package/dist/react/ui/sidebar.d.ts.map +1 -1
- package/dist/react/ui/sidebar.js +10 -10
- package/dist/react/ui/sidebar.js.map +1 -1
- package/dist/react/ui/skeleton.d.ts +2 -2
- package/dist/react/ui/slider.d.ts +3 -3
- package/dist/react/ui/slider.d.ts.map +1 -1
- package/dist/react/ui/slider.js +2 -2
- package/dist/react/ui/slider.js.map +1 -1
- package/dist/react/ui/sonner.d.ts +2 -2
- package/dist/react/ui/spinner.d.ts +2 -2
- package/dist/react/ui/switch.d.ts +3 -3
- package/dist/react/ui/switch.d.ts.map +1 -1
- package/dist/react/ui/table.d.ts +10 -10
- package/dist/react/ui/table.d.ts.map +1 -1
- package/dist/react/ui/tabs.d.ts +6 -6
- package/dist/react/ui/tabs.d.ts.map +1 -1
- package/dist/react/ui/textarea.d.ts +3 -3
- package/dist/react/ui/textarea.d.ts.map +1 -1
- package/dist/react/ui/toggle-group.d.ts +5 -5
- package/dist/react/ui/toggle-group.d.ts.map +1 -1
- package/dist/react/ui/toggle-group.js +3 -3
- package/dist/react/ui/toggle-group.js.map +1 -1
- package/dist/react/ui/toggle.d.ts +3 -3
- package/dist/react/ui/toggle.d.ts.map +1 -1
- package/dist/react/ui/tooltip.d.ts +6 -6
- package/dist/react/ui/tooltip.d.ts.map +1 -1
- package/dist/react/ui/tooltip.js +11 -7
- package/dist/react/ui/tooltip.js.map +1 -1
- package/dist/shared/src/sql/helpers.js.map +1 -1
- package/llms.txt +89 -12
- package/package.json +1 -1
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import * as
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
import * as react_jsx_runtime8 from "react/jsx-runtime";
|
|
3
3
|
import * as AvatarPrimitive from "@radix-ui/react-avatar";
|
|
4
4
|
|
|
5
5
|
//#region src/react/ui/avatar.d.ts
|
|
6
6
|
declare function Avatar({
|
|
7
7
|
className,
|
|
8
8
|
...props
|
|
9
|
-
}: React.ComponentProps<typeof AvatarPrimitive.Root>):
|
|
9
|
+
}: React$1.ComponentProps<typeof AvatarPrimitive.Root>): react_jsx_runtime8.JSX.Element;
|
|
10
10
|
declare function AvatarImage({
|
|
11
11
|
className,
|
|
12
12
|
...props
|
|
13
|
-
}: React.ComponentProps<typeof AvatarPrimitive.Image>):
|
|
13
|
+
}: React$1.ComponentProps<typeof AvatarPrimitive.Image>): react_jsx_runtime8.JSX.Element;
|
|
14
14
|
declare function AvatarFallback({
|
|
15
15
|
className,
|
|
16
16
|
...props
|
|
17
|
-
}: React.ComponentProps<typeof AvatarPrimitive.Fallback>):
|
|
17
|
+
}: React$1.ComponentProps<typeof AvatarPrimitive.Fallback>): react_jsx_runtime8.JSX.Element;
|
|
18
18
|
//#endregion
|
|
19
19
|
export { Avatar, AvatarFallback, AvatarImage };
|
|
20
20
|
//# sourceMappingURL=avatar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"avatar.d.ts","names":[],"sources":["../../../src/react/ui/avatar.tsx"],"sourcesContent":[],"mappings":";;;;;iBAKS,MAAA;;;GAGN,
|
|
1
|
+
{"version":3,"file":"avatar.d.ts","names":[],"sources":["../../../src/react/ui/avatar.tsx"],"sourcesContent":[],"mappings":";;;;;iBAKS,MAAA;;;GAGN,OAAA,CAAM,sBAAsB,eAAA,CAAgB,QAAK,kBAAA,CAAA,GAAA,CAAA;iBAa3C,WAAA;;;GAGN,OAAA,CAAM,sBAAsB,eAAA,CAAgB,SAAM,kBAAA,CAAA,GAAA,CAAA;iBAU5C,cAAA;;;GAGN,OAAA,CAAM,sBAAsB,eAAA,CAAgB,YAAS,kBAAA,CAAA,GAAA,CAAA"}
|
package/dist/react/ui/badge.d.ts
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import * as
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
import * as react_jsx_runtime26 from "react/jsx-runtime";
|
|
3
3
|
import { VariantProps } from "class-variance-authority";
|
|
4
|
-
import * as
|
|
4
|
+
import * as class_variance_authority_types1 from "class-variance-authority/types";
|
|
5
5
|
|
|
6
6
|
//#region src/react/ui/badge.d.ts
|
|
7
7
|
declare const badgeVariants: (props?: ({
|
|
8
8
|
variant?: "default" | "destructive" | "secondary" | "outline" | null | undefined;
|
|
9
|
-
} &
|
|
9
|
+
} & class_variance_authority_types1.ClassProp) | undefined) => string;
|
|
10
10
|
declare function Badge({
|
|
11
11
|
className,
|
|
12
12
|
variant,
|
|
13
13
|
asChild,
|
|
14
14
|
...props
|
|
15
|
-
}: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
|
|
15
|
+
}: React$1.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
|
|
16
16
|
asChild?: boolean;
|
|
17
|
-
}):
|
|
17
|
+
}): react_jsx_runtime26.JSX.Element;
|
|
18
18
|
//#endregion
|
|
19
19
|
export { Badge, badgeVariants };
|
|
20
20
|
//# sourceMappingURL=badge.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.d.ts","names":[],"sources":["../../../src/react/ui/badge.tsx"],"sourcesContent":[],"mappings":";;;;;;cAMM;;IAmBL,+BAAA,CAAA;iBAEQ,KAAA;;;;;GAKN,
|
|
1
|
+
{"version":3,"file":"badge.d.ts","names":[],"sources":["../../../src/react/ui/badge.tsx"],"sourcesContent":[],"mappings":";;;;;;cAMM;;IAmBL,+BAAA,CAAA;iBAEQ,KAAA;;;;;GAKN,OAAA,CAAM,yBACP,oBAAoB;EA3BhB,OAAA,CAAA,EAAA,OAmBL;IAQ2D,mBAAA,CAAA,GAAA,CAAA,OAN9C"}
|
|
@@ -1,38 +1,38 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import * as
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
import * as react_jsx_runtime27 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/react/ui/breadcrumb.d.ts
|
|
5
5
|
declare function Breadcrumb({
|
|
6
6
|
...props
|
|
7
|
-
}: React.ComponentProps<"nav">):
|
|
7
|
+
}: React$1.ComponentProps<"nav">): react_jsx_runtime27.JSX.Element;
|
|
8
8
|
declare function BreadcrumbList({
|
|
9
9
|
className,
|
|
10
10
|
...props
|
|
11
|
-
}: React.ComponentProps<"ol">):
|
|
11
|
+
}: React$1.ComponentProps<"ol">): react_jsx_runtime27.JSX.Element;
|
|
12
12
|
declare function BreadcrumbItem({
|
|
13
13
|
className,
|
|
14
14
|
...props
|
|
15
|
-
}: React.ComponentProps<"li">):
|
|
15
|
+
}: React$1.ComponentProps<"li">): react_jsx_runtime27.JSX.Element;
|
|
16
16
|
declare function BreadcrumbLink({
|
|
17
17
|
asChild,
|
|
18
18
|
className,
|
|
19
19
|
...props
|
|
20
|
-
}: React.ComponentProps<"a"> & {
|
|
20
|
+
}: React$1.ComponentProps<"a"> & {
|
|
21
21
|
asChild?: boolean;
|
|
22
|
-
}):
|
|
22
|
+
}): react_jsx_runtime27.JSX.Element;
|
|
23
23
|
declare function BreadcrumbPage({
|
|
24
24
|
className,
|
|
25
25
|
...props
|
|
26
|
-
}: React.ComponentProps<"span">):
|
|
26
|
+
}: React$1.ComponentProps<"span">): react_jsx_runtime27.JSX.Element;
|
|
27
27
|
declare function BreadcrumbSeparator({
|
|
28
28
|
children,
|
|
29
29
|
className,
|
|
30
30
|
...props
|
|
31
|
-
}: React.ComponentProps<"li">):
|
|
31
|
+
}: React$1.ComponentProps<"li">): react_jsx_runtime27.JSX.Element;
|
|
32
32
|
declare function BreadcrumbEllipsis({
|
|
33
33
|
className,
|
|
34
34
|
...props
|
|
35
|
-
}: React.ComponentProps<"span">):
|
|
35
|
+
}: React$1.ComponentProps<"span">): react_jsx_runtime27.JSX.Element;
|
|
36
36
|
//#endregion
|
|
37
37
|
export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };
|
|
38
38
|
//# sourceMappingURL=breadcrumb.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumb.d.ts","names":[],"sources":["../../../src/react/ui/breadcrumb.tsx"],"sourcesContent":[],"mappings":";;;;iBAMS,UAAA;;GAAyB,
|
|
1
|
+
{"version":3,"file":"breadcrumb.d.ts","names":[],"sources":["../../../src/react/ui/breadcrumb.tsx"],"sourcesContent":[],"mappings":";;;;iBAMS,UAAA;;GAAyB,OAAA,CAAM,wBAAqB,mBAAA,CAAA,GAAA,CAAA;iBAIpD,cAAA;;;GAAwC,OAAA,CAAM,uBAAoB,mBAAA,CAAA,GAAA,CAAA;iBAalE,cAAA;;;GAAwC,OAAA,CAAM,uBAAoB,mBAAA,CAAA,GAAA,CAAA;AAvBvC,iBAiC3B,cAAA,CA3BU;EAAA,OAAA;EAAA,SAAA;EAAA,GAAA;CAAA,EA+BhB,OAAA,CAAM,cA/BU,CAAA,GAAA,CAAA,GAAA;EAAA,OAAA,CAAA,EAAA,OAAA;IAiClB,mBAAA,CAAA,GAAA,CAAA,OAjCuC;iBA6C/B,cAAA,CA7CoD;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA6CZ,OAAA,CAAM,cA7CM,CAAA,MAAA,CAAA,CAAA,EA6CgB,mBAAA,CAAA,GAAA,CAAA,OA7ChB;iBA0DpD,mBAAA,CA1DoD;EAAA,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA8D1D,OAAA,CAAM,cA9DoD,CAAA,IAAA,CAAA,CAAA,EA8DhC,mBAAA,CAAA,GAAA,CAAA,OA9DgC;AAAA,iBA4EpD,kBAAA,CAxEc;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA2EpB,OAAA,CAAM,cA3Ec,CAAA,MAAA,CAAA,CAAA,EA2EQ,mBAAA,CAAA,GAAA,CAAA,OA3ER"}
|
|
@@ -1,29 +1,29 @@
|
|
|
1
1
|
import { Separator } from "./separator.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime23 from "react/jsx-runtime";
|
|
3
3
|
import { VariantProps } from "class-variance-authority";
|
|
4
|
-
import * as
|
|
4
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
5
|
|
|
6
6
|
//#region src/react/ui/button-group.d.ts
|
|
7
7
|
declare const buttonGroupVariants: (props?: ({
|
|
8
8
|
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
9
|
-
} &
|
|
9
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
10
10
|
declare function ButtonGroup({
|
|
11
11
|
className,
|
|
12
12
|
orientation,
|
|
13
13
|
...props
|
|
14
|
-
}: React.ComponentProps<"div"> & VariantProps<typeof buttonGroupVariants>):
|
|
14
|
+
}: React.ComponentProps<"div"> & VariantProps<typeof buttonGroupVariants>): react_jsx_runtime23.JSX.Element;
|
|
15
15
|
declare function ButtonGroupText({
|
|
16
16
|
className,
|
|
17
17
|
asChild,
|
|
18
18
|
...props
|
|
19
19
|
}: React.ComponentProps<"div"> & {
|
|
20
20
|
asChild?: boolean;
|
|
21
|
-
}):
|
|
21
|
+
}): react_jsx_runtime23.JSX.Element;
|
|
22
22
|
declare function ButtonGroupSeparator({
|
|
23
23
|
className,
|
|
24
24
|
orientation,
|
|
25
25
|
...props
|
|
26
|
-
}: React.ComponentProps<typeof Separator>):
|
|
26
|
+
}: React.ComponentProps<typeof Separator>): react_jsx_runtime23.JSX.Element;
|
|
27
27
|
//#endregion
|
|
28
28
|
export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };
|
|
29
29
|
//# sourceMappingURL=button-group.d.ts.map
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import * as
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
import * as react_jsx_runtime34 from "react/jsx-runtime";
|
|
3
3
|
import { VariantProps } from "class-variance-authority";
|
|
4
|
-
import * as
|
|
4
|
+
import * as class_variance_authority_types2 from "class-variance-authority/types";
|
|
5
5
|
|
|
6
6
|
//#region src/react/ui/button.d.ts
|
|
7
7
|
declare const buttonVariants: (props?: ({
|
|
8
8
|
variant?: "default" | "destructive" | "secondary" | "outline" | "ghost" | "link" | null | undefined;
|
|
9
9
|
size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
|
|
10
|
-
} &
|
|
10
|
+
} & class_variance_authority_types2.ClassProp) | undefined) => string;
|
|
11
11
|
declare function Button({
|
|
12
12
|
className,
|
|
13
13
|
variant,
|
|
14
14
|
size,
|
|
15
15
|
asChild,
|
|
16
16
|
...props
|
|
17
|
-
}: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
|
|
17
|
+
}: React$1.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
|
|
18
18
|
asChild?: boolean;
|
|
19
|
-
}):
|
|
19
|
+
}): react_jsx_runtime34.JSX.Element;
|
|
20
20
|
//#endregion
|
|
21
21
|
export { Button, buttonVariants };
|
|
22
22
|
//# sourceMappingURL=button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","names":[],"sources":["../../../src/react/ui/button.tsx"],"sourcesContent":[],"mappings":";;;;;;cAMM;;;IA8BL,+BAAA,CAAA;AAlCiE,iBAoCzD,MAAA,CAFR;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,OAAA;EAAA,GAAA;CAAA,EAQE,
|
|
1
|
+
{"version":3,"file":"button.d.ts","names":[],"sources":["../../../src/react/ui/button.tsx"],"sourcesContent":[],"mappings":";;;;;;cAMM;;;IA8BL,+BAAA,CAAA;AAlCiE,iBAoCzD,MAAA,CAFR;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,OAAA;EAAA,GAAA;CAAA,EAQE,OAAA,CAAM,cARR,CAAA,QAAA,CAAA,GASC,YATD,CAAA,OASqB,cATrB,CAAA,GAAA;EAEQ,OAAA,CAAA,EAAM,OAAA;CAAA,CAAA,EASZ,mBAAA,CAAA,GAAA,CAAA,OATY"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Button } from "./button.js";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import * as
|
|
2
|
+
import * as React$1 from "react";
|
|
3
|
+
import * as react_jsx_runtime36 from "react/jsx-runtime";
|
|
4
4
|
import { DayButton, DayPicker } from "react-day-picker";
|
|
5
5
|
|
|
6
6
|
//#region src/react/ui/calendar.d.ts
|
|
@@ -13,15 +13,15 @@ declare function Calendar({
|
|
|
13
13
|
formatters,
|
|
14
14
|
components,
|
|
15
15
|
...props
|
|
16
|
-
}: React.ComponentProps<typeof DayPicker> & {
|
|
17
|
-
buttonVariant?: React.ComponentProps<typeof Button>["variant"];
|
|
18
|
-
}):
|
|
16
|
+
}: React$1.ComponentProps<typeof DayPicker> & {
|
|
17
|
+
buttonVariant?: React$1.ComponentProps<typeof Button>["variant"];
|
|
18
|
+
}): react_jsx_runtime36.JSX.Element;
|
|
19
19
|
declare function CalendarDayButton({
|
|
20
20
|
className,
|
|
21
21
|
day,
|
|
22
22
|
modifiers,
|
|
23
23
|
...props
|
|
24
|
-
}: React.ComponentProps<typeof DayButton>):
|
|
24
|
+
}: React$1.ComponentProps<typeof DayButton>): react_jsx_runtime36.JSX.Element;
|
|
25
25
|
//#endregion
|
|
26
26
|
export { Calendar, CalendarDayButton };
|
|
27
27
|
//# sourceMappingURL=calendar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.d.ts","names":[],"sources":["../../../src/react/ui/calendar.tsx"],"sourcesContent":[],"mappings":";;;;;;iBAcS,QAAA;;;;;;;;;GASN,
|
|
1
|
+
{"version":3,"file":"calendar.d.ts","names":[],"sources":["../../../src/react/ui/calendar.tsx"],"sourcesContent":[],"mappings":";;;;;;iBAcS,QAAA;;;;;;;;;GASN,OAAA,CAAM,sBAAsB;kBACb,OAAA,CAAM,sBAAsB;IAC7C,mBAAA,CAAA,GAAA,CAAA;AAbiD,iBAsKzC,iBAAA,CApKQ;EAAA,SAAA;EAAA,GAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAyKd,OAAA,CAAM,cAzKQ,CAAA,OAyKc,SAzKd,CAAA,CAAA,EAyKwB,mBAAA,CAAA,GAAA,CAAA,OAzKxB"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
4
|
import { Button, buttonVariants } from "./button.js";
|
|
5
|
-
import * as React from "react";
|
|
5
|
+
import * as React$1 from "react";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
7
7
|
import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
|
|
8
8
|
import { DayPicker, getDefaultClassNames } from "react-day-picker";
|
|
@@ -86,8 +86,8 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
|
|
|
86
86
|
}
|
|
87
87
|
function CalendarDayButton({ className, day, modifiers, ...props }) {
|
|
88
88
|
const defaultClassNames = getDefaultClassNames();
|
|
89
|
-
const ref = React.useRef(null);
|
|
90
|
-
React.useEffect(() => {
|
|
89
|
+
const ref = React$1.useRef(null);
|
|
90
|
+
React$1.useEffect(() => {
|
|
91
91
|
if (modifiers.focused) ref.current?.focus();
|
|
92
92
|
}, [modifiers.focused]);
|
|
93
93
|
return /* @__PURE__ */ jsx(Button, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.js","names":["props","className"],"sources":["../../../src/react/ui/calendar.tsx"],"sourcesContent":["// @ts-nocheck\n\"use client\";\n\nimport * as React from \"react\";\nimport {\n ChevronDownIcon,\n ChevronLeftIcon,\n ChevronRightIcon,\n} from \"lucide-react\";\nimport { type DayButton, DayPicker, getDefaultClassNames } from \"react-day-picker\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button, buttonVariants } from \"./button\";\n\nfunction Calendar({\n className,\n classNames,\n showOutsideDays = true,\n captionLayout = \"label\",\n buttonVariant = \"ghost\",\n formatters,\n components,\n ...props\n}: React.ComponentProps<typeof DayPicker> & {\n buttonVariant?: React.ComponentProps<typeof Button>[\"variant\"];\n}) {\n const defaultClassNames = getDefaultClassNames();\n\n return (\n <DayPicker\n showOutsideDays={showOutsideDays}\n className={cn(\n \"bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent\",\n String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\n String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\n className,\n )}\n captionLayout={captionLayout}\n formatters={{\n formatMonthDropdown: (date) =>\n date.toLocaleString(\"default\", { month: \"short\" }),\n ...formatters,\n }}\n classNames={{\n root: cn(\"w-fit\", defaultClassNames.root),\n months: cn(\n \"flex gap-4 flex-col md:flex-row relative\",\n defaultClassNames.months,\n ),\n month: cn(\"flex flex-col w-full gap-4\", defaultClassNames.month),\n nav: cn(\n \"flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between\",\n defaultClassNames.nav,\n ),\n button_previous: cn(\n buttonVariants({ variant: buttonVariant }),\n \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\n defaultClassNames.button_previous,\n ),\n button_next: cn(\n buttonVariants({ variant: buttonVariant }),\n \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\n defaultClassNames.button_next,\n ),\n month_caption: cn(\n \"flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)\",\n defaultClassNames.month_caption,\n ),\n dropdowns: cn(\n \"w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5\",\n defaultClassNames.dropdowns,\n ),\n dropdown_root: cn(\n \"relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] rounded-md\",\n defaultClassNames.dropdown_root,\n ),\n dropdown: cn(\n \"absolute bg-popover inset-0 opacity-0\",\n defaultClassNames.dropdown,\n ),\n caption_label: cn(\n \"select-none font-medium\",\n captionLayout === \"label\"\n ? \"text-sm\"\n : \"rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5\",\n defaultClassNames.caption_label,\n ),\n table: \"w-full border-collapse\",\n weekdays: cn(\"flex\", defaultClassNames.weekdays),\n weekday: cn(\n \"text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none\",\n defaultClassNames.weekday,\n ),\n week: cn(\"flex w-full mt-2\", defaultClassNames.week),\n week_number_header: cn(\n \"select-none w-(--cell-size)\",\n defaultClassNames.week_number_header,\n ),\n week_number: cn(\n \"text-[0.8rem] select-none text-muted-foreground\",\n defaultClassNames.week_number,\n ),\n day: cn(\n \"relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none\",\n props.showWeekNumber\n ? \"[&:nth-child(2)[data-selected=true]_button]:rounded-l-md\"\n : \"[&:first-child[data-selected=true]_button]:rounded-l-md\",\n defaultClassNames.day,\n ),\n range_start: cn(\n \"rounded-l-md bg-accent\",\n defaultClassNames.range_start,\n ),\n range_middle: cn(\"rounded-none\", defaultClassNames.range_middle),\n range_end: cn(\"rounded-r-md bg-accent\", defaultClassNames.range_end),\n today: cn(\n \"bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none\",\n defaultClassNames.today,\n ),\n outside: cn(\n \"text-muted-foreground aria-selected:text-muted-foreground\",\n defaultClassNames.outside,\n ),\n disabled: cn(\n \"text-muted-foreground opacity-50\",\n defaultClassNames.disabled,\n ),\n hidden: cn(\"invisible\", defaultClassNames.hidden),\n ...classNames,\n }}\n components={{\n Root: ({ className, rootRef, ...props }) => {\n return (\n <div\n data-slot=\"calendar\"\n ref={rootRef}\n className={cn(className)}\n {...props}\n />\n );\n },\n Chevron: ({ className, orientation, ...props }) => {\n if (orientation === \"left\") {\n return (\n <ChevronLeftIcon className={cn(\"size-4\", className)} {...props} />\n );\n }\n\n if (orientation === \"right\") {\n return (\n <ChevronRightIcon\n className={cn(\"size-4\", className)}\n {...props}\n />\n );\n }\n\n return (\n <ChevronDownIcon className={cn(\"size-4\", className)} {...props} />\n );\n },\n DayButton: CalendarDayButton,\n WeekNumber: ({ children, ...props }) => {\n return (\n <td {...props}>\n <div className=\"flex size-(--cell-size) items-center justify-center text-center\">\n {children}\n </div>\n </td>\n );\n },\n ...components,\n }}\n {...props}\n />\n );\n}\n\nfunction CalendarDayButton({\n className,\n day,\n modifiers,\n ...props\n}: React.ComponentProps<typeof DayButton>) {\n const defaultClassNames = getDefaultClassNames();\n\n const ref = React.useRef<HTMLButtonElement>(null);\n React.useEffect(() => {\n if (modifiers.focused) ref.current?.focus();\n }, [modifiers.focused]);\n\n return (\n <Button\n ref={ref}\n variant=\"ghost\"\n size=\"icon\"\n data-day={day.date.toLocaleDateString()}\n data-selected-single={\n modifiers.selected &&\n !modifiers.range_start &&\n !modifiers.range_end &&\n !modifiers.range_middle\n }\n data-range-start={modifiers.range_start}\n data-range-end={modifiers.range_end}\n data-range-middle={modifiers.range_middle}\n className={cn(\n \"data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70\",\n defaultClassNames.day,\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Calendar, CalendarDayButton };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"calendar.js","names":["props","className","React"],"sources":["../../../src/react/ui/calendar.tsx"],"sourcesContent":["// @ts-nocheck\n\"use client\";\n\nimport * as React from \"react\";\nimport {\n ChevronDownIcon,\n ChevronLeftIcon,\n ChevronRightIcon,\n} from \"lucide-react\";\nimport { type DayButton, DayPicker, getDefaultClassNames } from \"react-day-picker\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button, buttonVariants } from \"./button\";\n\nfunction Calendar({\n className,\n classNames,\n showOutsideDays = true,\n captionLayout = \"label\",\n buttonVariant = \"ghost\",\n formatters,\n components,\n ...props\n}: React.ComponentProps<typeof DayPicker> & {\n buttonVariant?: React.ComponentProps<typeof Button>[\"variant\"];\n}) {\n const defaultClassNames = getDefaultClassNames();\n\n return (\n <DayPicker\n showOutsideDays={showOutsideDays}\n className={cn(\n \"bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent\",\n String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\n String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\n className,\n )}\n captionLayout={captionLayout}\n formatters={{\n formatMonthDropdown: (date) =>\n date.toLocaleString(\"default\", { month: \"short\" }),\n ...formatters,\n }}\n classNames={{\n root: cn(\"w-fit\", defaultClassNames.root),\n months: cn(\n \"flex gap-4 flex-col md:flex-row relative\",\n defaultClassNames.months,\n ),\n month: cn(\"flex flex-col w-full gap-4\", defaultClassNames.month),\n nav: cn(\n \"flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between\",\n defaultClassNames.nav,\n ),\n button_previous: cn(\n buttonVariants({ variant: buttonVariant }),\n \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\n defaultClassNames.button_previous,\n ),\n button_next: cn(\n buttonVariants({ variant: buttonVariant }),\n \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\n defaultClassNames.button_next,\n ),\n month_caption: cn(\n \"flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)\",\n defaultClassNames.month_caption,\n ),\n dropdowns: cn(\n \"w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5\",\n defaultClassNames.dropdowns,\n ),\n dropdown_root: cn(\n \"relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] rounded-md\",\n defaultClassNames.dropdown_root,\n ),\n dropdown: cn(\n \"absolute bg-popover inset-0 opacity-0\",\n defaultClassNames.dropdown,\n ),\n caption_label: cn(\n \"select-none font-medium\",\n captionLayout === \"label\"\n ? \"text-sm\"\n : \"rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5\",\n defaultClassNames.caption_label,\n ),\n table: \"w-full border-collapse\",\n weekdays: cn(\"flex\", defaultClassNames.weekdays),\n weekday: cn(\n \"text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none\",\n defaultClassNames.weekday,\n ),\n week: cn(\"flex w-full mt-2\", defaultClassNames.week),\n week_number_header: cn(\n \"select-none w-(--cell-size)\",\n defaultClassNames.week_number_header,\n ),\n week_number: cn(\n \"text-[0.8rem] select-none text-muted-foreground\",\n defaultClassNames.week_number,\n ),\n day: cn(\n \"relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none\",\n props.showWeekNumber\n ? \"[&:nth-child(2)[data-selected=true]_button]:rounded-l-md\"\n : \"[&:first-child[data-selected=true]_button]:rounded-l-md\",\n defaultClassNames.day,\n ),\n range_start: cn(\n \"rounded-l-md bg-accent\",\n defaultClassNames.range_start,\n ),\n range_middle: cn(\"rounded-none\", defaultClassNames.range_middle),\n range_end: cn(\"rounded-r-md bg-accent\", defaultClassNames.range_end),\n today: cn(\n \"bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none\",\n defaultClassNames.today,\n ),\n outside: cn(\n \"text-muted-foreground aria-selected:text-muted-foreground\",\n defaultClassNames.outside,\n ),\n disabled: cn(\n \"text-muted-foreground opacity-50\",\n defaultClassNames.disabled,\n ),\n hidden: cn(\"invisible\", defaultClassNames.hidden),\n ...classNames,\n }}\n components={{\n Root: ({ className, rootRef, ...props }) => {\n return (\n <div\n data-slot=\"calendar\"\n ref={rootRef}\n className={cn(className)}\n {...props}\n />\n );\n },\n Chevron: ({ className, orientation, ...props }) => {\n if (orientation === \"left\") {\n return (\n <ChevronLeftIcon className={cn(\"size-4\", className)} {...props} />\n );\n }\n\n if (orientation === \"right\") {\n return (\n <ChevronRightIcon\n className={cn(\"size-4\", className)}\n {...props}\n />\n );\n }\n\n return (\n <ChevronDownIcon className={cn(\"size-4\", className)} {...props} />\n );\n },\n DayButton: CalendarDayButton,\n WeekNumber: ({ children, ...props }) => {\n return (\n <td {...props}>\n <div className=\"flex size-(--cell-size) items-center justify-center text-center\">\n {children}\n </div>\n </td>\n );\n },\n ...components,\n }}\n {...props}\n />\n );\n}\n\nfunction CalendarDayButton({\n className,\n day,\n modifiers,\n ...props\n}: React.ComponentProps<typeof DayButton>) {\n const defaultClassNames = getDefaultClassNames();\n\n const ref = React.useRef<HTMLButtonElement>(null);\n React.useEffect(() => {\n if (modifiers.focused) ref.current?.focus();\n }, [modifiers.focused]);\n\n return (\n <Button\n ref={ref}\n variant=\"ghost\"\n size=\"icon\"\n data-day={day.date.toLocaleDateString()}\n data-selected-single={\n modifiers.selected &&\n !modifiers.range_start &&\n !modifiers.range_end &&\n !modifiers.range_middle\n }\n data-range-start={modifiers.range_start}\n data-range-end={modifiers.range_end}\n data-range-middle={modifiers.range_middle}\n className={cn(\n \"data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70\",\n defaultClassNames.day,\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Calendar, CalendarDayButton };\n"],"mappings":"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"}
|
package/dist/react/ui/card.d.ts
CHANGED
|
@@ -1,35 +1,35 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import * as
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
import * as react_jsx_runtime38 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/react/ui/card.d.ts
|
|
5
5
|
declare function Card({
|
|
6
6
|
className,
|
|
7
7
|
...props
|
|
8
|
-
}: React.ComponentProps<"div">):
|
|
8
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime38.JSX.Element;
|
|
9
9
|
declare function CardHeader({
|
|
10
10
|
className,
|
|
11
11
|
...props
|
|
12
|
-
}: React.ComponentProps<"div">):
|
|
12
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime38.JSX.Element;
|
|
13
13
|
declare function CardTitle({
|
|
14
14
|
className,
|
|
15
15
|
...props
|
|
16
|
-
}: React.ComponentProps<"div">):
|
|
16
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime38.JSX.Element;
|
|
17
17
|
declare function CardDescription({
|
|
18
18
|
className,
|
|
19
19
|
...props
|
|
20
|
-
}: React.ComponentProps<"div">):
|
|
20
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime38.JSX.Element;
|
|
21
21
|
declare function CardAction({
|
|
22
22
|
className,
|
|
23
23
|
...props
|
|
24
|
-
}: React.ComponentProps<"div">):
|
|
24
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime38.JSX.Element;
|
|
25
25
|
declare function CardContent({
|
|
26
26
|
className,
|
|
27
27
|
...props
|
|
28
|
-
}: React.ComponentProps<"div">):
|
|
28
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime38.JSX.Element;
|
|
29
29
|
declare function CardFooter({
|
|
30
30
|
className,
|
|
31
31
|
...props
|
|
32
|
-
}: React.ComponentProps<"div">):
|
|
32
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime38.JSX.Element;
|
|
33
33
|
//#endregion
|
|
34
34
|
export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
|
|
35
35
|
//# sourceMappingURL=card.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.d.ts","names":[],"sources":["../../../src/react/ui/card.tsx"],"sourcesContent":[],"mappings":";;;;iBAIS,IAAA;;;GAA8B,
|
|
1
|
+
{"version":3,"file":"card.d.ts","names":[],"sources":["../../../src/react/ui/card.tsx"],"sourcesContent":[],"mappings":";;;;iBAIS,IAAA;;;GAA8B,OAAA,CAAM,wBAAqB,mBAAA,CAAA,GAAA,CAAA;iBAazD,UAAA;;;GAAoC,OAAA,CAAM,wBAAqB,mBAAA,CAAA,GAAA,CAAA;iBAa/D,SAAA;;;GAAmC,OAAA,CAAM,wBAAqB,mBAAA,CAAA,GAAA,CAAA;AA9BnC,iBAwC3B,eAAA,CApCI;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAoCqC,OAAA,CAAM,cApC3C,CAAA,KAAA,CAAA,CAAA,EAoCgE,mBAAA,CAAA,GAAA,CAAA,OApChE;iBA8CJ,UAAA,CA9CI;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA8CgC,OAAA,CAAM,cA9CtC,CAAA,KAAA,CAAA,CAAA,EA8C2D,mBAAA,CAAA,GAAA,CAAA,OA9C3D;iBA2DJ,WAAA,CA3DO;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA2D8B,OAAA,CAAM,cA3DpC,CAAA,KAAA,CAAA,CAAA,EA2DyD,mBAAA,CAAA,GAAA,CAAA,OA3DzD;iBAqEP,UAAA,CArEoC;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAqEA,OAAA,CAAM,cArEN,CAAA,KAAA,CAAA,CAAA,EAqE2B,mBAAA,CAAA,GAAA,CAAA,OArE3B"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Button } from "./button.js";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import * as
|
|
2
|
+
import * as React$1 from "react";
|
|
3
|
+
import * as react_jsx_runtime45 from "react/jsx-runtime";
|
|
4
4
|
import useEmblaCarousel, { UseEmblaCarouselType } from "embla-carousel-react";
|
|
5
5
|
|
|
6
6
|
//#region src/react/ui/carousel.d.ts
|
|
@@ -22,27 +22,27 @@ declare function Carousel({
|
|
|
22
22
|
className,
|
|
23
23
|
children,
|
|
24
24
|
...props
|
|
25
|
-
}: React.ComponentProps<"div"> & CarouselProps):
|
|
25
|
+
}: React$1.ComponentProps<"div"> & CarouselProps): react_jsx_runtime45.JSX.Element;
|
|
26
26
|
declare function CarouselContent({
|
|
27
27
|
className,
|
|
28
28
|
...props
|
|
29
|
-
}: React.ComponentProps<"div">):
|
|
29
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime45.JSX.Element;
|
|
30
30
|
declare function CarouselItem({
|
|
31
31
|
className,
|
|
32
32
|
...props
|
|
33
|
-
}: React.ComponentProps<"div">):
|
|
33
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime45.JSX.Element;
|
|
34
34
|
declare function CarouselPrevious({
|
|
35
35
|
className,
|
|
36
36
|
variant,
|
|
37
37
|
size,
|
|
38
38
|
...props
|
|
39
|
-
}: React.ComponentProps<typeof Button>):
|
|
39
|
+
}: React$1.ComponentProps<typeof Button>): react_jsx_runtime45.JSX.Element;
|
|
40
40
|
declare function CarouselNext({
|
|
41
41
|
className,
|
|
42
42
|
variant,
|
|
43
43
|
size,
|
|
44
44
|
...props
|
|
45
|
-
}: React.ComponentProps<typeof Button>):
|
|
45
|
+
}: React$1.ComponentProps<typeof Button>): react_jsx_runtime45.JSX.Element;
|
|
46
46
|
//#endregion
|
|
47
47
|
export { Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious };
|
|
48
48
|
//# sourceMappingURL=carousel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.d.ts","names":[],"sources":["../../../src/react/ui/carousel.tsx"],"sourcesContent":[],"mappings":";;;;;;KASK,WAAA,GAAc;KACd,qBAAA,GAAwB,kBAAkB;KAC1C,eAAA,GAAkB;AAJW,KAK7B,cAAA,GAAiB,qBAHH,CAAA,CAAA,CAAA;AAAoB,KAKlC,aAAA,GAJA;EAAqB,IAAA,CAAA,EAKjB,eALiB;SAAqB,CAAA,EAMnC,cANmC;aAAlB,CAAA,EAAA,YAAA,GAAA,UAAA;EAAU,MAAA,CAAA,EAAA,CAAA,GAAA,EAQtB,WARsB,EAAA,GAAA,IAAA;AAAA,CAAA;AACK,iBA+BnC,QAAA,CA9BU;EAAA,WAAG;EAAA,IAAA;EAAA,MAAA;EAAqB,OAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAsCxC,
|
|
1
|
+
{"version":3,"file":"carousel.d.ts","names":[],"sources":["../../../src/react/ui/carousel.tsx"],"sourcesContent":[],"mappings":";;;;;;KASK,WAAA,GAAc;KACd,qBAAA,GAAwB,kBAAkB;KAC1C,eAAA,GAAkB;AAJW,KAK7B,cAAA,GAAiB,qBAHH,CAAA,CAAA,CAAA;AAAoB,KAKlC,aAAA,GAJA;EAAqB,IAAA,CAAA,EAKjB,eALiB;SAAqB,CAAA,EAMnC,cANmC;aAAlB,CAAA,EAAA,YAAA,GAAA,UAAA;EAAU,MAAA,CAAA,EAAA,CAAA,GAAA,EAQtB,WARsB,EAAA,GAAA,IAAA;AAAA,CAAA;AACK,iBA+BnC,QAAA,CA9BU;EAAA,WAAG;EAAA,IAAA;EAAA,MAAA;EAAqB,OAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAsCxC,OAAA,CAAM,cAtCkC,CAAA,KAAA,CAAA,GAsCV,aAtCU,CAAA,EAsCG,mBAAA,CAAA,GAAA,CAAA,OAtCH;AAAA,iBAwHlC,eAAA,CAtHS;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAsHgC,OAAA,CAAM,cAtHtC,CAAA,KAAA,CAAA,CAAA,EAsH2D,mBAAA,CAAA,GAAA,CAAA,OAtH3D;iBA2IT,YAAA,CA3IS;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA2I6B,OAAA,CAAM,cA3InC,CAAA,KAAA,CAAA,CAAA,EA2IwD,mBAAA,CAAA,GAAA,CAAA,OA3IxD;iBA6JT,gBAAA,CA5JA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,GAAA;AAAA,CAAA,EAiKN,OAAA,CAAM,cAjKA,CAAA,OAiKsB,MAjKtB,CAAA,CAAA,EAiK6B,mBAAA,CAAA,GAAA,CAAA,OAjK7B;iBA0LA,YAAA,CAzLG;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,GAAA;AAAA,CAAA,EA8LT,OAAA,CAAM,cA9LG,CAAA,OA8LmB,MA9LnB,CAAA,CAAA,EA8L0B,mBAAA,CAAA,GAAA,CAAA,OA9L1B"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { cn } from "../lib/utils.js";
|
|
2
2
|
import { Button } from "./button.js";
|
|
3
|
-
import * as React from "react";
|
|
3
|
+
import * as React$1 from "react";
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
import { ArrowLeft, ArrowRight } from "lucide-react";
|
|
6
6
|
import useEmblaCarousel from "embla-carousel-react";
|
|
7
7
|
|
|
8
8
|
//#region src/react/ui/carousel.tsx
|
|
9
|
-
const CarouselContext = React.createContext(null);
|
|
9
|
+
const CarouselContext = React$1.createContext(null);
|
|
10
10
|
function useCarousel() {
|
|
11
|
-
const context = React.useContext(CarouselContext);
|
|
11
|
+
const context = React$1.useContext(CarouselContext);
|
|
12
12
|
if (!context) throw new Error("useCarousel must be used within a <Carousel />");
|
|
13
13
|
return context;
|
|
14
14
|
}
|
|
@@ -17,20 +17,20 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
|
|
|
17
17
|
...opts,
|
|
18
18
|
axis: orientation === "horizontal" ? "x" : "y"
|
|
19
19
|
}, plugins);
|
|
20
|
-
const [canScrollPrev, setCanScrollPrev] = React.useState(false);
|
|
21
|
-
const [canScrollNext, setCanScrollNext] = React.useState(false);
|
|
22
|
-
const onSelect = React.useCallback((api$1) => {
|
|
20
|
+
const [canScrollPrev, setCanScrollPrev] = React$1.useState(false);
|
|
21
|
+
const [canScrollNext, setCanScrollNext] = React$1.useState(false);
|
|
22
|
+
const onSelect = React$1.useCallback((api$1) => {
|
|
23
23
|
if (!api$1) return;
|
|
24
24
|
setCanScrollPrev(api$1.canScrollPrev());
|
|
25
25
|
setCanScrollNext(api$1.canScrollNext());
|
|
26
26
|
}, []);
|
|
27
|
-
const scrollPrev = React.useCallback(() => {
|
|
27
|
+
const scrollPrev = React$1.useCallback(() => {
|
|
28
28
|
api?.scrollPrev();
|
|
29
29
|
}, [api]);
|
|
30
|
-
const scrollNext = React.useCallback(() => {
|
|
30
|
+
const scrollNext = React$1.useCallback(() => {
|
|
31
31
|
api?.scrollNext();
|
|
32
32
|
}, [api]);
|
|
33
|
-
const handleKeyDown = React.useCallback((event) => {
|
|
33
|
+
const handleKeyDown = React$1.useCallback((event) => {
|
|
34
34
|
if (event.key === "ArrowLeft") {
|
|
35
35
|
event.preventDefault();
|
|
36
36
|
scrollPrev();
|
|
@@ -39,11 +39,11 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
|
|
|
39
39
|
scrollNext();
|
|
40
40
|
}
|
|
41
41
|
}, [scrollPrev, scrollNext]);
|
|
42
|
-
React.useEffect(() => {
|
|
42
|
+
React$1.useEffect(() => {
|
|
43
43
|
if (!api || !setApi) return;
|
|
44
44
|
setApi(api);
|
|
45
45
|
}, [api, setApi]);
|
|
46
|
-
React.useEffect(() => {
|
|
46
|
+
React$1.useEffect(() => {
|
|
47
47
|
if (!api) return;
|
|
48
48
|
onSelect(api);
|
|
49
49
|
api.on("reInit", onSelect);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.js","names":["api"],"sources":["../../../src/react/ui/carousel.tsx"],"sourcesContent":["import * as React from \"react\";\nimport useEmblaCarousel, {\n type UseEmblaCarouselType,\n} from \"embla-carousel-react\";\nimport { ArrowLeft, ArrowRight } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n opts?: CarouselOptions;\n plugins?: CarouselPlugin;\n orientation?: \"horizontal\" | \"vertical\";\n setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n api: ReturnType<typeof useEmblaCarousel>[1];\n scrollPrev: () => void;\n scrollNext: () => void;\n canScrollPrev: boolean;\n canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n const context = React.useContext(CarouselContext);\n\n if (!context) {\n throw new Error(\"useCarousel must be used within a <Carousel />\");\n }\n\n return context;\n}\n\nfunction Carousel({\n orientation = \"horizontal\",\n opts,\n setApi,\n plugins,\n className,\n children,\n ...props\n}: React.ComponentProps<\"div\"> & CarouselProps) {\n const [carouselRef, api] = useEmblaCarousel(\n {\n ...opts,\n axis: orientation === \"horizontal\" ? \"x\" : \"y\",\n },\n plugins\n );\n const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n const onSelect = React.useCallback((api: CarouselApi) => {\n if (!api) return;\n setCanScrollPrev(api.canScrollPrev());\n setCanScrollNext(api.canScrollNext());\n }, []);\n\n const scrollPrev = React.useCallback(() => {\n api?.scrollPrev();\n }, [api]);\n\n const scrollNext = React.useCallback(() => {\n api?.scrollNext();\n }, [api]);\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n scrollPrev();\n } else if (event.key === \"ArrowRight\") {\n event.preventDefault();\n scrollNext();\n }\n },\n [scrollPrev, scrollNext]\n );\n\n React.useEffect(() => {\n if (!api || !setApi) return;\n setApi(api);\n }, [api, setApi]);\n\n React.useEffect(() => {\n if (!api) return;\n onSelect(api);\n api.on(\"reInit\", onSelect);\n api.on(\"select\", onSelect);\n\n return () => {\n api?.off(\"select\", onSelect);\n };\n }, [api, onSelect]);\n\n return (\n <CarouselContext.Provider\n value={{\n carouselRef,\n api: api,\n opts,\n orientation:\n orientation || (opts?.axis === \"y\" ? \"vertical\" : \"horizontal\"),\n scrollPrev,\n scrollNext,\n canScrollPrev,\n canScrollNext,\n }}\n >\n <div\n onKeyDownCapture={handleKeyDown}\n className={cn(\"relative\", className)}\n role=\"region\"\n aria-roledescription=\"carousel\"\n data-slot=\"carousel\"\n {...props}\n >\n {children}\n </div>\n </CarouselContext.Provider>\n );\n}\n\nfunction CarouselContent({ className, ...props }: React.ComponentProps<\"div\">) {\n const { carouselRef, orientation } = useCarousel();\n\n return (\n <div\n ref={carouselRef}\n className=\"overflow-hidden\"\n data-slot=\"carousel-content\"\n >\n <div\n className={cn(\n \"flex\",\n orientation === \"horizontal\" ? \"-ml-4\" : \"-mt-4 flex-col\",\n className\n )}\n {...props}\n />\n </div>\n );\n}\n\nfunction CarouselItem({ className, ...props }: React.ComponentProps<\"div\">) {\n const { orientation } = useCarousel();\n\n return (\n <div\n role=\"group\"\n aria-roledescription=\"slide\"\n data-slot=\"carousel-item\"\n className={cn(\n \"min-w-0 shrink-0 grow-0 basis-full\",\n orientation === \"horizontal\" ? \"pl-4\" : \"pt-4\",\n className\n )}\n {...props}\n />\n );\n}\n\nfunction CarouselPrevious({\n className,\n variant = \"outline\",\n size = \"icon\",\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-previous\"\n variant={variant}\n size={size}\n className={cn(\n \"absolute size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -left-12 -translate-y-1/2\"\n : \"-top-12 left-1/2 -translate-x-1/2 rotate-90\",\n className\n )}\n disabled={!canScrollPrev}\n onClick={scrollPrev}\n {...props}\n >\n <ArrowLeft />\n <span className=\"sr-only\">Previous slide</span>\n </Button>\n );\n}\n\nfunction CarouselNext({\n className,\n variant = \"outline\",\n size = \"icon\",\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-next\"\n variant={variant}\n size={size}\n className={cn(\n \"absolute size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -right-12 -translate-y-1/2\"\n : \"-bottom-12 left-1/2 -translate-x-1/2 rotate-90\",\n className\n )}\n disabled={!canScrollNext}\n onClick={scrollNext}\n {...props}\n >\n <ArrowRight />\n <span className=\"sr-only\">Next slide</span>\n </Button>\n );\n}\n\nexport {\n type CarouselApi,\n Carousel,\n CarouselContent,\n CarouselItem,\n CarouselPrevious,\n CarouselNext,\n};\n"],"mappings":";;;;;;;;AA8BA,MAAM,
|
|
1
|
+
{"version":3,"file":"carousel.js","names":["React","api"],"sources":["../../../src/react/ui/carousel.tsx"],"sourcesContent":["import * as React from \"react\";\nimport useEmblaCarousel, {\n type UseEmblaCarouselType,\n} from \"embla-carousel-react\";\nimport { ArrowLeft, ArrowRight } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n opts?: CarouselOptions;\n plugins?: CarouselPlugin;\n orientation?: \"horizontal\" | \"vertical\";\n setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n api: ReturnType<typeof useEmblaCarousel>[1];\n scrollPrev: () => void;\n scrollNext: () => void;\n canScrollPrev: boolean;\n canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n const context = React.useContext(CarouselContext);\n\n if (!context) {\n throw new Error(\"useCarousel must be used within a <Carousel />\");\n }\n\n return context;\n}\n\nfunction Carousel({\n orientation = \"horizontal\",\n opts,\n setApi,\n plugins,\n className,\n children,\n ...props\n}: React.ComponentProps<\"div\"> & CarouselProps) {\n const [carouselRef, api] = useEmblaCarousel(\n {\n ...opts,\n axis: orientation === \"horizontal\" ? \"x\" : \"y\",\n },\n plugins\n );\n const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n const onSelect = React.useCallback((api: CarouselApi) => {\n if (!api) return;\n setCanScrollPrev(api.canScrollPrev());\n setCanScrollNext(api.canScrollNext());\n }, []);\n\n const scrollPrev = React.useCallback(() => {\n api?.scrollPrev();\n }, [api]);\n\n const scrollNext = React.useCallback(() => {\n api?.scrollNext();\n }, [api]);\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n scrollPrev();\n } else if (event.key === \"ArrowRight\") {\n event.preventDefault();\n scrollNext();\n }\n },\n [scrollPrev, scrollNext]\n );\n\n React.useEffect(() => {\n if (!api || !setApi) return;\n setApi(api);\n }, [api, setApi]);\n\n React.useEffect(() => {\n if (!api) return;\n onSelect(api);\n api.on(\"reInit\", onSelect);\n api.on(\"select\", onSelect);\n\n return () => {\n api?.off(\"select\", onSelect);\n };\n }, [api, onSelect]);\n\n return (\n <CarouselContext.Provider\n value={{\n carouselRef,\n api: api,\n opts,\n orientation:\n orientation || (opts?.axis === \"y\" ? \"vertical\" : \"horizontal\"),\n scrollPrev,\n scrollNext,\n canScrollPrev,\n canScrollNext,\n }}\n >\n <div\n onKeyDownCapture={handleKeyDown}\n className={cn(\"relative\", className)}\n role=\"region\"\n aria-roledescription=\"carousel\"\n data-slot=\"carousel\"\n {...props}\n >\n {children}\n </div>\n </CarouselContext.Provider>\n );\n}\n\nfunction CarouselContent({ className, ...props }: React.ComponentProps<\"div\">) {\n const { carouselRef, orientation } = useCarousel();\n\n return (\n <div\n ref={carouselRef}\n className=\"overflow-hidden\"\n data-slot=\"carousel-content\"\n >\n <div\n className={cn(\n \"flex\",\n orientation === \"horizontal\" ? \"-ml-4\" : \"-mt-4 flex-col\",\n className\n )}\n {...props}\n />\n </div>\n );\n}\n\nfunction CarouselItem({ className, ...props }: React.ComponentProps<\"div\">) {\n const { orientation } = useCarousel();\n\n return (\n <div\n role=\"group\"\n aria-roledescription=\"slide\"\n data-slot=\"carousel-item\"\n className={cn(\n \"min-w-0 shrink-0 grow-0 basis-full\",\n orientation === \"horizontal\" ? \"pl-4\" : \"pt-4\",\n className\n )}\n {...props}\n />\n );\n}\n\nfunction CarouselPrevious({\n className,\n variant = \"outline\",\n size = \"icon\",\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-previous\"\n variant={variant}\n size={size}\n className={cn(\n \"absolute size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -left-12 -translate-y-1/2\"\n : \"-top-12 left-1/2 -translate-x-1/2 rotate-90\",\n className\n )}\n disabled={!canScrollPrev}\n onClick={scrollPrev}\n {...props}\n >\n <ArrowLeft />\n <span className=\"sr-only\">Previous slide</span>\n </Button>\n );\n}\n\nfunction CarouselNext({\n className,\n variant = \"outline\",\n size = \"icon\",\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-next\"\n variant={variant}\n size={size}\n className={cn(\n \"absolute size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -right-12 -translate-y-1/2\"\n : \"-bottom-12 left-1/2 -translate-x-1/2 rotate-90\",\n className\n )}\n disabled={!canScrollNext}\n onClick={scrollNext}\n {...props}\n >\n <ArrowRight />\n <span className=\"sr-only\">Next slide</span>\n </Button>\n );\n}\n\nexport {\n type CarouselApi,\n Carousel,\n CarouselContent,\n CarouselItem,\n CarouselPrevious,\n CarouselNext,\n};\n"],"mappings":"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"}
|