@buildkitgg/shadcn-baseui-sera 0.2.0 → 0.3.0

package/dist/tailwind.css

@@ -0,0 +1,45 @@
+@import "./theme.css";
+@import "./animations.css";
+@import "./shadcn.css";
+@source "./ui";
+@custom-variant dark (&:where(.dark, .dark *):not(:where(.light, .light *)));
+@theme inline {
+--radius-sm: calc(var(--radius) * 0.6);
+--radius-md: calc(var(--radius) * 0.8);
+--radius-lg: var(--radius);
+--radius-xl: calc(var(--radius) * 1.4);
+--radius-2xl: calc(var(--radius) * 1.8);
+--radius-3xl: calc(var(--radius) * 2.2);
+--radius-4xl: calc(var(--radius) * 2.6);
+--color-background: var(--background);
+--color-foreground: var(--foreground);
+--color-card: var(--card);
+--color-card-foreground: var(--card-foreground);
+--color-popover: var(--popover);
+--color-popover-foreground: var(--popover-foreground);
+--color-primary: var(--primary);
+--color-primary-foreground: var(--primary-foreground);
+--color-secondary: var(--secondary);
+--color-secondary-foreground: var(--secondary-foreground);
+--color-muted: var(--muted);
+--color-muted-foreground: var(--muted-foreground);
+--color-accent: var(--accent);
+--color-accent-foreground: var(--accent-foreground);
+--color-destructive: var(--destructive);
+--color-border: var(--border);
+--color-input: var(--input);
+--color-ring: var(--ring);
+--color-chart-1: var(--chart-1);
+--color-chart-2: var(--chart-2);
+--color-chart-3: var(--chart-3);
+--color-chart-4: var(--chart-4);
+--color-chart-5: var(--chart-5);
+--color-sidebar: var(--sidebar);
+--color-sidebar-foreground: var(--sidebar-foreground);
+--color-sidebar-primary: var(--sidebar-primary);
+--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+--color-sidebar-accent: var(--sidebar-accent);
+--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+--color-sidebar-border: var(--sidebar-border);
+--color-sidebar-ring: var(--sidebar-ring);
+}

package/dist/theme.css

@@ -0,0 +1,63 @@
+:root, .light {--background: oklch(1 0 0);
+--foreground: oklch(0.145 0 0);
+--card: oklch(1 0 0);
+--card-foreground: oklch(0.145 0 0);
+--popover: oklch(1 0 0);
+--popover-foreground: oklch(0.145 0 0);
+--primary: oklch(0.205 0 0);
+--primary-foreground: oklch(0.985 0 0);
+--secondary: oklch(0.97 0 0);
+--secondary-foreground: oklch(0.205 0 0);
+--muted: oklch(0.97 0 0);
+--muted-foreground: oklch(0.556 0 0);
+--accent: oklch(0.97 0 0);
+--accent-foreground: oklch(0.205 0 0);
+--destructive: oklch(0.577 0.245 27.325);
+--border: oklch(0.922 0 0);
+--input: oklch(0.922 0 0);
+--ring: oklch(0.708 0 0);
+--chart-1: oklch(0.87 0 0);
+--chart-2: oklch(0.556 0 0);
+--chart-3: oklch(0.439 0 0);
+--chart-4: oklch(0.371 0 0);
+--chart-5: oklch(0.269 0 0);
+--radius: 0.625rem;
+--sidebar: oklch(0.985 0 0);
+--sidebar-foreground: oklch(0.145 0 0);
+--sidebar-primary: oklch(0.205 0 0);
+--sidebar-primary-foreground: oklch(0.985 0 0);
+--sidebar-accent: oklch(0.97 0 0);
+--sidebar-accent-foreground: oklch(0.205 0 0);
+--sidebar-border: oklch(0.922 0 0);
+--sidebar-ring: oklch(0.708 0 0);}
+.dark {--background: oklch(0.145 0 0);
+--foreground: oklch(0.985 0 0);
+--card: oklch(0.205 0 0);
+--card-foreground: oklch(0.985 0 0);
+--popover: oklch(0.205 0 0);
+--popover-foreground: oklch(0.985 0 0);
+--primary: oklch(0.922 0 0);
+--primary-foreground: oklch(0.205 0 0);
+--secondary: oklch(0.269 0 0);
+--secondary-foreground: oklch(0.985 0 0);
+--muted: oklch(0.269 0 0);
+--muted-foreground: oklch(0.708 0 0);
+--accent: oklch(0.269 0 0);
+--accent-foreground: oklch(0.985 0 0);
+--destructive: oklch(0.704 0.191 22.216);
+--border: oklch(1 0 0 / 10%);
+--input: oklch(1 0 0 / 15%);
+--ring: oklch(0.556 0 0);
+--chart-1: oklch(0.87 0 0);
+--chart-2: oklch(0.556 0 0);
+--chart-3: oklch(0.439 0 0);
+--chart-4: oklch(0.371 0 0);
+--chart-5: oklch(0.269 0 0);
+--sidebar: oklch(0.205 0 0);
+--sidebar-foreground: oklch(0.985 0 0);
+--sidebar-primary: oklch(0.488 0.243 264.376);
+--sidebar-primary-foreground: oklch(0.985 0 0);
+--sidebar-accent: oklch(0.269 0 0);
+--sidebar-accent-foreground: oklch(0.985 0 0);
+--sidebar-border: oklch(1 0 0 / 10%);
+--sidebar-ring: oklch(0.556 0 0);}

package/dist/ui/accordion.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Accordion as AccordionPrimitive } from "@base-ui/react/accordion";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
 function Accordion({ className, ...props }) {
     return (_jsx(AccordionPrimitive.Root, { "data-slot": "accordion", className: cn("flex w-full flex-col", className), ...props }));
@@ -9,7 +9,7 @@ function AccordionItem({ className, ...props }) {
     return (_jsx(AccordionPrimitive.Item, { "data-slot": "accordion-item", className: cn("not-last:border-b", className), ...props }));
 }
 function AccordionTrigger({ className, children, ...props }) {
-    return (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { "data-slot": "accordion-trigger", className: cn("focus-visible:ring-ring/30 focus-visible:border-ring **:data-[slot=accordion-trigger-icon]:text-muted-foreground rounded-none gap-6 py-4 text-left text-sm font-semibold hover:underline focus-visible:ring-2 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-3.5 group/accordion-trigger relative flex flex-1 items-start justify-between border border-transparent transition-all outline-none aria-disabled:pointer-events-none aria-disabled:opacity-50", className), ...props, children: [children, _jsx(ChevronDownIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" }), _jsx(ChevronUpIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" })] }) }));
+    return (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { "data-slot": "accordion-trigger", className: cn("focus-visible:ring-ring/30 focus-visible:border-ring **:data-[slot=accordion-trigger-icon]:text-muted-foreground rounded-none gap-6 py-4 text-start text-sm font-semibold hover:underline focus-visible:ring-2 **:data-[slot=accordion-trigger-icon]:ms-auto **:data-[slot=accordion-trigger-icon]:size-3.5 group/accordion-trigger relative flex flex-1 items-start justify-between border border-transparent transition-all outline-none aria-disabled:pointer-events-none aria-disabled:opacity-50", className), ...props, children: [children, _jsx(ChevronDownIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" }), _jsx(ChevronUpIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" })] }) }));
 }
 function AccordionContent({ className, children, ...props }) {
     return (_jsx(AccordionPrimitive.Panel, { "data-slot": "accordion-content", className: "data-open:animate-accordion-down data-closed:animate-accordion-up text-sm overflow-hidden", ...props, children: _jsx("div", { className: cn("pt-0 pb-4 h-(--accordion-panel-height) data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4", className), children: children }) }));

package/dist/ui/alert-dialog.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 import { Button } from "./button.js";
 function AlertDialog({ ...props }) {
     return _jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
@@ -16,10 +16,10 @@ function AlertDialogOverlay({ className, ...props }) {
     return (_jsx(AlertDialogPrimitive.Backdrop, { "data-slot": "alert-dialog-overlay", className: cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/20 duration-100 supports-backdrop-filter:backdrop-blur-sm fixed inset-0 isolate z-50", className), ...props }));
 }
 function AlertDialogContent({ className, size = "default", ...props }) {
-    return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Popup, { "data-slot": "alert-dialog-content", "data-size": size, className: cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-popover text-popover-foreground ring-foreground/10 gap-6 rounded-none p-6 shadow-md ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-md group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none", className), ...props })] }));
+    return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Popup, { "data-slot": "alert-dialog-content", "data-size": size, className: cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-popover text-popover-foreground ring-foreground/10 gap-6 rounded-none p-6 shadow-md ring-1 duration-100 data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-md group/alert-dialog-content fixed top-1/2 start-1/2 z-50 grid w-full -translate-x-1/2 rtl:translate-x-1/2 -translate-y-1/2 outline-none", className), ...props })] }));
 }
 function AlertDialogHeader({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn("grid grid-rows-[auto_1fr] place-items-center gap-2 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className), ...props }));
+    return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn("grid grid-rows-[auto_1fr] place-items-center gap-2 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className), ...props }));
 }
 function AlertDialogFooter({ className, ...props }) {
     return (_jsx("div", { "data-slot": "alert-dialog-footer", className: cn("flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", className), ...props }));

package/dist/ui/alert.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
-import { cn } from "cn";
-const alertVariants = cva("grid gap-1 bg-background border px-4 py-3 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2.5 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4 after:-inset-y-px after:-left-px after:w-0.5 after:absolute group/alert relative w-full", {
+import { cn } from "@buildkitgg/shadcn-runtime";
+const alertVariants = cva("grid gap-1 bg-background border px-4 py-3 text-start text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pe-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2.5 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4 after:-inset-y-px after:-start-px after:w-0.5 after:absolute group/alert relative w-full", {
     variants: {
         variant: {
             default: "bg-card text-card-foreground after:bg-foreground",
@@ -22,6 +22,6 @@ function AlertDescription({ className, ...props }) {
     return (_jsx("div", { "data-slot": "alert-description", className: cn("text-muted-foreground text-sm text-balance md:text-pretty [&_p:not(:last-child)]:mb-4 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground", className), ...props }));
 }
 function AlertAction({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "alert-action", className: cn("absolute top-2.5 right-3", className), ...props }));
+    return (_jsx("div", { "data-slot": "alert-action", className: cn("absolute top-2.5 end-3", className), ...props }));
 }
 export { Alert, AlertTitle, AlertDescription, AlertAction };

package/dist/ui/aspect-ratio.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 function AspectRatio({ ratio, className, ...props }) {
     return (_jsx("div", { "data-slot": "aspect-ratio", style: {
             "--ratio": ratio,

package/dist/ui/attachment.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
 import { cva } from "class-variance-authority";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 import { Button } from "./button.js";
 const attachmentVariants = cva("rounded-none w-fit focus-within:ring-1 focus-within:ring-ring/30 group/attachment relative flex max-w-full min-w-0 shrink-0 flex-wrap border bg-card text-card-foreground transition-colors has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive/30 data-[state=idle]:border-dashed", {
     variants: {
@@ -44,7 +44,7 @@ function AttachmentDescription({ className, ...props }) {
     return (_jsx("span", { "data-slot": "attachment-description", className: cn("mt-0.5 text-xs block min-w-0 truncate text-muted-foreground group-data-[state=error]/attachment:text-destructive/80", "max-w-full", className), ...props }));
 }
 function AttachmentActions({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "attachment-actions", className: cn("group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:right-3 relative z-20 group-data-[orientation=vertical]/attachment:gap-1 flex shrink-0 items-center", className), ...props }));
+    return (_jsx("div", { "data-slot": "attachment-actions", className: cn("group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:end-3 relative z-20 group-data-[orientation=vertical]/attachment:gap-1 flex shrink-0 items-center", className), ...props }));
 }
 function AttachmentAction({ className, variant, size = "icon-xs", ...props }) {
     return (_jsx(Button, { "data-slot": "attachment-action", variant: variant ?? "ghost", size: size, className: cn(className), ...props }));

package/dist/ui/avatar.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Avatar as AvatarPrimitive } from "@base-ui/react/avatar";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 function Avatar({ className, size = "default", ...props }) {
     return (_jsx(AvatarPrimitive.Root, { "data-slot": "avatar", "data-size": size, className: cn("size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:border-border after:mix-blend-darken dark:after:mix-blend-lighten", className), ...props }));
 }
@@ -12,7 +12,7 @@ function AvatarFallback({ className, ...props }) {
     return (_jsx(AvatarPrimitive.Fallback, { "data-slot": "avatar-fallback", className: cn("bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs", className), ...props }));
 }
 function AvatarBadge({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "avatar-badge", className: cn("bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none", "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", className), ...props }));
+    return (_jsx("span", { "data-slot": "avatar-badge", className: cn("bg-primary text-primary-foreground ring-background absolute end-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none", "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", className), ...props }));
 }
 function AvatarGroup({ className, ...props }) {
     return (_jsx("div", { "data-slot": "avatar-group", className: cn("group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background", className), ...props }));

package/dist/ui/badge.js

@@ -1,8 +1,8 @@
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
 import { cva } from "class-variance-authority";
-import { cn } from "cn";
-const badgeVariants = cva("gap-1.5 rounded-none border-0 bg-transparent px-0 py-0 text-[0.625rem] font-semibold uppercase tracking-widest transition-colors has-data-[icon=inline-end]:pr-0 has-data-[icon=inline-start]:pl-0 [&>svg]:size-3! group/badge inline-flex w-fit shrink-0 items-center justify-center overflow-hidden whitespace-nowrap focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none", {
+import { cn } from "@buildkitgg/shadcn-runtime";
+const badgeVariants = cva("gap-1.5 rounded-none border-0 bg-transparent px-0 py-0 text-[0.625rem] font-semibold uppercase tracking-widest transition-colors has-data-[icon=inline-end]:pe-0 has-data-[icon=inline-start]:ps-0 [&>svg]:size-3! group/badge inline-flex w-fit shrink-0 items-center justify-center overflow-hidden whitespace-nowrap focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none", {
     variants: {
         variant: {
             default: "text-foreground [a]:hover:text-foreground/70",

package/dist/ui/breadcrumb.js

@@ -1,10 +1,12 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
-import { cn } from "cn";
+import { cn, useShadcnLocalization } from "@buildkitgg/shadcn-runtime";
 import { ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
 function Breadcrumb({ className, ...props }) {
-    return (_jsx("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", className: cn(className), ...props }));
+    const { strings } = useShadcnLocalization();
+    return (_jsx("nav", { "aria-label": strings.breadcrumb, "data-slot": "breadcrumb", className: cn(className), ...props }));
 }
 function BreadcrumbList({ className, ...props }) {
     return (_jsx("ol", { "data-slot": "breadcrumb-list", className: cn("text-muted-foreground gap-1.5 text-xs uppercase tracking-wide sm:gap-2.5 flex flex-wrap items-center wrap-break-word", className), ...props }));
@@ -28,9 +30,10 @@ function BreadcrumbPage({ className, ...props }) {
     return (_jsx("span", { "data-slot": "breadcrumb-page", role: "link", "aria-disabled": "true", "aria-current": "page", className: cn("text-foreground font-normal", className), ...props }));
 }
 function BreadcrumbSeparator({ children, className, ...props }) {
-    return (_jsx("li", { "data-slot": "breadcrumb-separator", role: "presentation", "aria-hidden": "true", className: cn("[&>svg]:size-3.5", className), ...props, children: children ?? (_jsx(ChevronRightIcon, { className: "cn-rtl-flip" })) }));
+    return (_jsx("li", { "data-slot": "breadcrumb-separator", role: "presentation", "aria-hidden": "true", className: cn("[&>svg]:size-3.5", className), ...props, children: children ?? (_jsx(ChevronRightIcon, { className: "rtl:rotate-180" })) }));
 }
 function BreadcrumbEllipsis({ className, ...props }) {
-    return (_jsxs("span", { "data-slot": "breadcrumb-ellipsis", role: "presentation", "aria-hidden": "true", className: cn("size-5 [&>svg]:size-4 flex items-center justify-center", className), ...props, children: [_jsx(MoreHorizontalIcon, {}), _jsx("span", { className: "sr-only", children: "More" })] }));
+    const { strings } = useShadcnLocalization();
+    return (_jsxs("span", { "data-slot": "breadcrumb-ellipsis", role: "presentation", "aria-hidden": "true", className: cn("size-5 [&>svg]:size-4 flex items-center justify-center", className), ...props, children: [_jsx(MoreHorizontalIcon, {}), _jsx("span", { className: "sr-only", children: strings.more })] }));
 }
 export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis, };

package/dist/ui/bubble.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
 import { cva } from "class-variance-authority";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 function BubbleGroup({ className, ...props }) {
     return (_jsx("div", { "data-slot": "bubble-group", className: cn("gap-2 flex min-w-0 flex-col", className), ...props }));
 }
@@ -29,7 +29,7 @@ function BubbleContent({ className, render, ...props }) {
     return useRender({
         defaultTagName: "div",
         props: mergeProps({
-            className: cn("rounded-none border border-transparent px-4 py-3 text-sm leading-relaxed [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-2 [button,a]:focus-visible:ring-ring/30 group-data-[align=end]/bubble:self-end w-fit max-w-full min-w-0 overflow-hidden wrap-break-word [button]:text-left [button,a]:transition-colors", className),
+            className: cn("rounded-none border border-transparent px-4 py-3 text-sm leading-relaxed [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-2 [button,a]:focus-visible:ring-ring/30 group-data-[align=end]/bubble:self-end w-fit max-w-full min-w-0 overflow-hidden wrap-break-word [button]:text-start [button,a]:transition-colors", className),
         }, props),
         render,
         state: {
@@ -44,8 +44,8 @@ const bubbleReactionsVariants = cva("rounded-none ring-3 ring-card bg-muted shri
             bottom: "bottom-0 translate-y-3/4",
         },
         align: {
-            start: "left-3",
-            end: "right-3",
+            start: "start-3",
+            end: "end-3",
         },
     },
     defaultVariants: {

package/dist/ui/button-group.js

@@ -2,12 +2,12 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
 import { cva } from "class-variance-authority";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 import { Separator } from "./separator.js";
 const buttonGroupVariants = cva("*:data-[slot=input]:px-4 has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-none has-[>[data-variant=outline]]:[&>input]:border-border has-[>[data-variant=outline]]:[&>input:focus-visible]:border-ring has-[>[data-variant=outline]]:*:data-[slot=input-group]:border-border has-[>[data-variant=outline]]:[&>[data-slot=input-group]:has(:focus-visible)]:border-ring has-[>[data-variant=outline]]:*:data-[slot=select-trigger]:border-border has-[>[data-variant=outline]]:[&>[data-slot=select-trigger]:focus-visible]:border-ring has-[>[data-variant=outline]]:*:data-[slot=input-group]:px-2.5 has-[>[data-variant=outline]]:*:[[role=combobox]]:px-2.5 flex w-fit items-stretch *:focus-visible:relative *:focus-visible:z-10 [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
     variants: {
         orientation: {
-            horizontal: "[&>[data-slot]:not(:has(~[data-slot]))]:rounded-none! *:data-slot:rounded-r-none [&>[data-slot]~[data-slot]]:rounded-l-none [&>[data-slot]~[data-slot]]:border-l-0",
+            horizontal: "[&>[data-slot]:not(:has(~[data-slot]))]:rounded-none! *:data-slot:rounded-e-none [&>[data-slot]~[data-slot]]:rounded-s-none [&>[data-slot]~[data-slot]]:border-s-0",
             vertical: "[&>[data-slot]:not(:has(~[data-slot]))]:rounded-none! flex-col *:data-slot:rounded-b-none [&>[data-slot]~[data-slot]]:rounded-t-none [&>[data-slot]~[data-slot]]:border-t-0",
         },
     },

package/dist/ui/button.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Button as ButtonPrimitive } from "@base-ui/react/button";
 import { cva } from "class-variance-authority";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 const buttonVariants = cva("focus-visible:border-ring focus-visible:ring-ring/30 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-none border border-transparent bg-clip-padding text-xs font-semibold uppercase tracking-widest focus-visible:ring-2 aria-invalid:ring-2 active:not-aria-[haspopup]:translate-y-px [&_svg:not([class*='size-'])]:size-3.5 group/button inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-all outline-none select-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", {
     variants: {
         variant: {
@@ -13,10 +13,10 @@ const buttonVariants = cva("focus-visible:border-ring focus-visible:ring-ring/30
             link: "text-primary underline-offset-4 hover:underline underline",
         },
         size: {
-            default: "h-10 gap-1.5 px-6 has-data-[icon=inline-end]:pr-4 has-data-[icon=inline-start]:pl-4",
-            xs: "h-7 gap-1 px-3 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 [&_svg:not([class*='size-'])]:size-3",
-            sm: "h-9 gap-1 px-4 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3",
-            lg: "h-11 gap-1.5 px-8 has-data-[icon=inline-end]:pr-5 has-data-[icon=inline-start]:pl-5",
+            default: "h-10 gap-1.5 px-6 has-data-[icon=inline-end]:pe-4 has-data-[icon=inline-start]:ps-4",
+            xs: "h-7 gap-1 px-3 has-data-[icon=inline-end]:pe-2 has-data-[icon=inline-start]:ps-2 [&_svg:not([class*='size-'])]:size-3",
+            sm: "h-9 gap-1 px-4 has-data-[icon=inline-end]:pe-3 has-data-[icon=inline-start]:ps-3",
+            lg: "h-11 gap-1.5 px-8 has-data-[icon=inline-end]:pe-5 has-data-[icon=inline-start]:ps-5",
             icon: "size-10",
             "icon-xs": "size-7 [&_svg:not([class*='size-'])]:size-3",
             "icon-sm": "size-9",

package/dist/ui/calendar.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 import { DayPicker, getDefaultClassNames, } from "react-day-picker";
 import { Button, buttonVariants } from "./button.js";
 import { ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon } from "lucide-react";
@@ -30,12 +30,12 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
             week: cn("mt-2 flex w-full", defaultClassNames.week),
             week_number_header: cn("w-(--cell-size) select-none", defaultClassNames.week_number_header),
             week_number: cn("text-[0.8rem] text-muted-foreground select-none", defaultClassNames.week_number),
-            day: cn("group/day relative aspect-square h-full w-full rounded-(--cell-radius) p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-r-(--cell-radius)", props.showWeekNumber
-                ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-(--cell-radius)"
-                : "[&:first-child[data-selected=true]_button]:rounded-l-(--cell-radius)", defaultClassNames.day),
-            range_start: cn("relative isolate z-0 rounded-l-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:right-0 after:w-4 after:bg-muted", defaultClassNames.range_start),
+            day: cn("group/day relative aspect-square h-full w-full rounded-(--cell-radius) p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-e-(--cell-radius)", props.showWeekNumber
+                ? "[&:nth-child(2)[data-selected=true]_button]:rounded-s-(--cell-radius)"
+                : "[&:first-child[data-selected=true]_button]:rounded-s-(--cell-radius)", defaultClassNames.day),
+            range_start: cn("relative isolate z-0 rounded-s-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:end-0 after:w-4 after:bg-muted", defaultClassNames.range_start),
             range_middle: cn("rounded-none", defaultClassNames.range_middle),
-            range_end: cn("relative isolate z-0 rounded-r-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:left-0 after:w-4 after:bg-muted", defaultClassNames.range_end),
+            range_end: cn("relative isolate z-0 rounded-e-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:start-0 after:w-4 after:bg-muted", defaultClassNames.range_end),
             today: cn("rounded-(--cell-radius) bg-muted text-foreground data-[selected=true]:rounded-none", defaultClassNames.today),
             outside: cn("text-muted-foreground aria-selected:text-muted-foreground", defaultClassNames.outside),
             disabled: cn("text-muted-foreground opacity-50", defaultClassNames.disabled),
@@ -47,10 +47,10 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
             },
             Chevron: ({ className, orientation, ...props }) => {
                 if (orientation === "left") {
-                    return (_jsx(ChevronLeftIcon, { className: cn("cn-rtl-flip size-4", className), ...props }));
+                    return (_jsx(ChevronLeftIcon, { className: cn("rtl:rotate-180 size-4", className), ...props }));
                 }
                 if (orientation === "right") {
-                    return (_jsx(ChevronRightIcon, { className: cn("cn-rtl-flip size-4", className), ...props }));
+                    return (_jsx(ChevronRightIcon, { className: cn("rtl:rotate-180 size-4", className), ...props }));
                 }
                 return (_jsx(ChevronDownIcon, { className: cn("size-4", className), ...props }));
             },
@@ -71,6 +71,6 @@ function CalendarDayButton({ className, day, modifiers, locale, ...props }) {
     return (_jsx(Button, { variant: "ghost", size: "icon", "data-day": day.date.toLocaleDateString(locale?.code), "data-selected-single": modifiers.selected &&
             !modifiers.range_start &&
             !modifiers.range_end &&
-            !modifiers.range_middle, "data-range-start": modifiers.range_start, "data-range-end": modifiers.range_end, "data-range-middle": modifiers.range_middle, className: cn("relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-r-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-l-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-foreground [&>span]:text-xs [&>span]:opacity-70", defaultClassNames.day, className), ...props }));
+            !modifiers.range_middle, "data-range-start": modifiers.range_start, "data-range-end": modifiers.range_end, "data-range-middle": modifiers.range_middle, className: cn("relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-e-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-s-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-foreground [&>span]:text-xs [&>span]:opacity-70", defaultClassNames.day, className), ...props }));
 }
 export { Calendar, CalendarDayButton };

package/dist/ui/card.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 function Card({ className, size = "default", ...props }) {
     return (_jsx("div", { "data-slot": "card", "data-size": size, className: cn("bg-card text-card-foreground ring-foreground/5 gap-(--card-spacing) overflow-hidden py-(--card-spacing) text-sm shadow-sm ring-1 [--card-spacing:--spacing(8)] has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(5)] *:[img:first-child]:rounded-none *:[img:last-child]:rounded-none group/card flex flex-col", className), ...props }));
 }

package/dist/ui/carousel.js

@@ -1,10 +1,11 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "cn";
+import { cn, useShadcnLocalization } from "@buildkitgg/shadcn-runtime";
 import useEmblaCarousel from "embla-carousel-react";
 import { Button } from "./button.js";
 import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
+import { useDirection } from "@base-ui/react/direction-provider";
 const CarouselContext = React.createContext(null);
 function useCarousel() {
     const context = React.useContext(CarouselContext);
@@ -14,7 +15,11 @@ function useCarousel() {
     return context;
 }
 function Carousel({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }) {
+    const { strings } = useShadcnLocalization();
+    const inheritedDirection = useDirection();
+    const direction = opts?.direction ?? inheritedDirection;
     const [carouselRef, api] = useEmblaCarousel({
+        direction: direction,
         ...opts,
         axis: orientation === "horizontal" ? "x" : "y",
     }, plugins);
@@ -33,15 +38,15 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
         api?.scrollNext();
     }, [api]);
     const handleKeyDown = React.useCallback((event) => {
-        if (event.key === "ArrowLeft") {
+        if (event.key === (direction === "rtl" ? "ArrowRight" : "ArrowLeft")) {
             event.preventDefault();
             scrollPrev();
         }
-        else if (event.key === "ArrowRight") {
+        else if (event.key === (direction === "rtl" ? "ArrowLeft" : "ArrowRight")) {
             event.preventDefault();
             scrollNext();
         }
-    }, [scrollPrev, scrollNext]);
+    }, [scrollPrev, scrollNext, direction]);
     React.useEffect(() => {
         if (!api || !setApi)
             return;
@@ -66,26 +71,29 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
             scrollNext,
             canScrollPrev,
             canScrollNext,
-        }, children: _jsx("div", { onKeyDownCapture: handleKeyDown, className: cn("relative", className), role: "region", "aria-roledescription": "carousel", "data-slot": "carousel", ...props, children: children }) }));
+        }, children: _jsx("div", { onKeyDownCapture: handleKeyDown, className: cn("relative", className), role: "region", "aria-roledescription": strings.carousel, "data-slot": "carousel", ...props, children: children }) }));
 }
 function CarouselContent({ className, ...props }) {
     const { carouselRef, orientation } = useCarousel();
-    return (_jsx("div", { ref: carouselRef, className: "overflow-hidden", "data-slot": "carousel-content", children: _jsx("div", { className: cn("flex", orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col", className), ...props }) }));
+    return (_jsx("div", { ref: carouselRef, className: "overflow-hidden", "data-slot": "carousel-content", children: _jsx("div", { className: cn("flex", orientation === "horizontal" ? "-ms-4" : "-mt-4 flex-col", className), ...props }) }));
 }
 function CarouselItem({ className, ...props }) {
+    const { strings } = useShadcnLocalization();
     const { orientation } = useCarousel();
-    return (_jsx("div", { role: "group", "aria-roledescription": "slide", "data-slot": "carousel-item", className: cn("min-w-0 shrink-0 grow-0 basis-full", orientation === "horizontal" ? "pl-4" : "pt-4", className), ...props }));
+    return (_jsx("div", { role: "group", "aria-roledescription": strings.slide, "data-slot": "carousel-item", className: cn("min-w-0 shrink-0 grow-0 basis-full", orientation === "horizontal" ? "ps-4" : "pt-4", className), ...props }));
 }
 function CarouselPrevious({ className, variant = "outline", size = "icon-sm", ...props }) {
+    const { strings } = useShadcnLocalization();
     const { orientation, scrollPrev, canScrollPrev } = useCarousel();
     return (_jsxs(Button, { "data-slot": "carousel-previous", variant: variant, size: size, className: cn("absolute touch-manipulation", orientation === "horizontal"
-            ? "inset-y-0 -left-12 my-auto"
-            : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className), disabled: !canScrollPrev, onClick: scrollPrev, ...props, children: [_jsx(ChevronLeftIcon, { className: "cn-rtl-flip" }), _jsx("span", { className: "sr-only", children: "Previous slide" })] }));
+            ? "inset-y-0 -start-12 my-auto"
+            : "-top-12 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rotate-90", className), disabled: !canScrollPrev, onClick: scrollPrev, ...props, children: [_jsx(ChevronLeftIcon, { className: "rtl:rotate-180" }), _jsx("span", { className: "sr-only", children: strings.previousSlide })] }));
 }
 function CarouselNext({ className, variant = "outline", size = "icon-sm", ...props }) {
+    const { strings } = useShadcnLocalization();
     const { orientation, scrollNext, canScrollNext } = useCarousel();
     return (_jsxs(Button, { "data-slot": "carousel-next", variant: variant, size: size, className: cn("absolute touch-manipulation", orientation === "horizontal"
-            ? "inset-y-0 -right-12 my-auto"
-            : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className), disabled: !canScrollNext, onClick: scrollNext, ...props, children: [_jsx(ChevronRightIcon, { className: "cn-rtl-flip" }), _jsx("span", { className: "sr-only", children: "Next slide" })] }));
+            ? "inset-y-0 -end-12 my-auto"
+            : "-bottom-12 start-1/2 -translate-x-1/2 rtl:translate-x-1/2 rotate-90", className), disabled: !canScrollNext, onClick: scrollNext, ...props, children: [_jsx(ChevronRightIcon, { className: "rtl:rotate-180" }), _jsx("span", { className: "sr-only", children: strings.nextSlide })] }));
 }
 export { Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, useCarousel, };

package/dist/ui/chart.js

@@ -1,7 +1,7 @@
 "use client";
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 import * as RechartsPrimitive from "recharts";
 // Format: { THEME_NAME: CSS_SELECTOR }
 const THEMES = { light: "", dark: ".dark" };

package/dist/ui/checkbox.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Checkbox as CheckboxPrimitive } from "@base-ui/react/checkbox";
-import { cn } from "cn";
+import { cn } from "@buildkitgg/shadcn-runtime";
 import { CheckIcon } from "lucide-react";
 function Checkbox({ className, ...props }) {
     return (_jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("border-input bg-transparent data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary data-checked:border-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/30 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 flex size-4.5 items-center justify-center rounded-none border transition-shadow group-has-disabled/field:opacity-50 focus-visible:ring-2 aria-invalid:ring-2 group-has-[:focus-visible]/field-label:ring-0 group-has-[:focus-visible]/field-label:not-data-checked:border-input group-has-[:focus-visible]/field-label:data-checked:border-primary peer relative shrink-0 outline-none after:absolute after:-inset-x-3 after:-inset-y-2 disabled:cursor-not-allowed disabled:opacity-50", className), ...props, children: _jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "[&>svg]:size-3.5 grid place-content-center text-current transition-none", children: _jsx(CheckIcon, {}) }) }));

package/dist/ui/code-block.js

@@ -2,7 +2,7 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cva } from "class-variance-authority";
-import { cn } from "cn";
+import { cn, useShadcnLocalization } from "@buildkitgg/shadcn-runtime";
 import { Button } from "./button.js";
 import { CheckIcon, CopyIcon } from "lucide-react";
 const codeBlockVariants = cva("rounded-none text-sm data-[size=sm]:text-xs has-[>[data-slot=code-block-content]:focus-visible]:ring-2 has-[>[data-slot=code-block-content]:focus-visible]:ring-ring/30 group/code-block relative flex w-full min-w-0 flex-col overflow-hidden", {
@@ -29,6 +29,7 @@ function CodeBlockActions({ className, ...props }) {
     return (_jsx("div", { "data-slot": "code-block-actions", className: cn("-my-1 -me-1.5 gap-1 [[data-slot=code-block]>&]:m-0 [[data-slot=code-block]>&]:top-3 [[data-slot=code-block]>&]:end-3 group-data-[size=sm]/code-block:[[data-slot=code-block]>&]:top-2 group-data-[size=sm]/code-block:[[data-slot=code-block]>&]:end-2 [[data-slot=code-block]>&]:*:[button]:bg-background [[data-slot=code-block]>&]:*:[button]:ring-1 [[data-slot=code-block]>&]:*:[button]:ring-foreground/10 ms-auto flex shrink-0 items-center [[data-slot=code-block]>&]:absolute [[data-slot=code-block]>&]:z-10 [[data-slot=code-block]>&]:opacity-0 [[data-slot=code-block]>&]:transition-opacity [[data-slot=code-block]>&]:group-focus-within/code-block:opacity-100 [[data-slot=code-block]>&]:group-hover/code-block:opacity-100 [[data-slot=code-block]>&]:pointer-coarse:opacity-100", className), ...props }));
 }
 function CodeBlockCopyButton({ value, variant = "ghost", size = "icon-xs", className, onClick, ...props }) {
+    const { strings } = useShadcnLocalization();
     const [copied, setCopied] = React.useState(false);
     React.useEffect(() => {
         if (!copied) {
@@ -37,7 +38,7 @@ function CodeBlockCopyButton({ value, variant = "ghost", size = "icon-xs", class
         const timeout = setTimeout(() => setCopied(false), 2000);
         return () => clearTimeout(timeout);
     }, [copied]);
-    return (_jsxs(_Fragment, { children: [_jsx(Button, { "data-slot": "code-block-copy-button", "data-copied": copied || undefined, variant: variant, size: size, "aria-label": copied ? "Copied" : "Copy", className: cn(className), onClick: (event) => {
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { "data-slot": "code-block-copy-button", "data-copied": copied || undefined, variant: variant, size: size, "aria-label": copied ? strings.copied : strings.copy, className: cn(className), onClick: (event) => {
                     onClick?.(event);
                     navigator.clipboard
                         .writeText(value)

package/dist/ui/combobox.d.ts

@@ -16,8 +16,10 @@ declare function ComboboxCollection({ ...props }: ComboboxPrimitive.Collection.P
 declare function ComboboxEmpty({ className, ...props }: ComboboxPrimitive.Empty.Props): React.JSX.Element;
 declare function ComboboxSeparator({ className, ...props }: ComboboxPrimitive.Separator.Props): React.JSX.Element;
 declare function ComboboxChips({ className, ...props }: React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> & ComboboxPrimitive.Chips.Props): React.JSX.Element;
-declare function ComboboxChip({ className, children, showRemove, ...props }: ComboboxPrimitive.Chip.Props & {
+declare function ComboboxChip({ removeLabel, className, children, showRemove, ...props }: ComboboxPrimitive.Chip.Props & {
     showRemove?: boolean;
+} & {
+    removeLabel?: string;
 }): React.JSX.Element;
 declare function ComboboxChipsInput({ className, ...props }: ComboboxPrimitive.Input.Props): React.JSX.Element;
 declare function useComboboxAnchor(): React.RefObject<HTMLDivElement | null>;