@bergetai/ui 0.13.0 → 0.13.1

package/dist/index.d.cts

@@ -79,9 +79,10 @@ declare function CardFooter({ className, ...props }: React$1.ComponentProps<"div
 
 declare const cardVariants: (props?: ({
     variant?: "outlined" | "filled" | null | undefined;
-    padding?: "sm" | "md" | "lg" | "none" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface CardProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
+    /** Spacing scale of the card. `sm` uses a compact 16px spacing, `default` 24px. */
+    size?: 'default' | 'sm';
 }
 declare const Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
 

package/dist/index.d.ts

@@ -79,9 +79,10 @@ declare function CardFooter({ className, ...props }: React$1.ComponentProps<"div
 
 declare const cardVariants: (props?: ({
     variant?: "outlined" | "filled" | null | undefined;
-    padding?: "sm" | "md" | "lg" | "none" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface CardProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
+    /** Spacing scale of the card. `sm` uses a compact 16px spacing, `default` 24px. */
+    size?: 'default' | 'sm';
 }
 declare const Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
 

package/dist/index.js

@@ -597,31 +597,25 @@ function CardFooter({ className, ...props }) {
 
 // src/components/card/Card.tsx
 import { jsx as jsx7 } from "react/jsx-runtime";
-var cardVariants = cva3("rounded-berget-xs ring-0", {
+var cardVariants = cva3("ring-0", {
   variants: {
     variant: {
       outlined: "bg-transparent border border-berget-border-subtle",
       filled: "bg-berget-card-filled-bg border border-berget-border-subtle"
-    },
-    padding: {
-      none: "p-0",
-      sm: "p-3 sm:p-4",
-      md: "p-4 sm:p-6",
-      lg: "p-6 sm:p-8"
     }
   },
   defaultVariants: {
-    variant: "outlined",
-    padding: "md"
+    variant: "outlined"
   }
 });
 var Card2 = React5.forwardRef(
-  ({ className, variant, padding, children, ...props }, ref) => {
+  ({ className, variant, size, children, ...props }, ref) => {
     return /* @__PURE__ */ jsx7(
       Card,
       {
         ref,
-        className: cn(cardVariants({ variant, padding }), className),
+        size,
+        className: cn(cardVariants({ variant }), className),
         ...props,
         children
       }
@@ -936,7 +930,6 @@ var ModelCard = React9.forwardRef(
           Card2,
           {
             variant: "filled",
-            padding: "none",
             className: "relative flex h-full flex-col bg-berget-card-filled-bg p-5 transition-all hover:bg-[color-mix(in_oklab,var(--berget-brand-granite-100)_5%,var(--berget-card-filled-bg))] sm:p-6",
             children: [
               lifecycle && /* @__PURE__ */ jsx11("div", { className: "absolute top-0 right-0 z-10 overflow-hidden rounded-bl-berget-sm", children: /* @__PURE__ */ jsx11(
@@ -1629,7 +1622,7 @@ function Input({ className, type, ...props }) {
       type,
       "data-slot": "input",
       className: cn6(
-        "h-8 w-full min-w-0 rounded-lg border border-input bg-berget-brand-granite-900 px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-berget-brand-moss-400 focus-visible:ring-3 focus-visible:ring-berget-brand-moss-300/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
+        "h-8 w-full min-w-0 rounded-lg border border-input bg-input/30 px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
         className
       ),
       ...props
@@ -3105,7 +3098,6 @@ var Checkbox2 = React18.forwardRef(
           ref,
           id: checkboxId,
           disabled,
-          nativeButton: true,
           "aria-invalid": !!error,
           "aria-describedby": error ? errorId : void 0,
           "aria-label": ariaLabel || label || void 0,
@@ -3210,7 +3202,6 @@ var Switch = React19.forwardRef(
           ref,
           id: switchId,
           disabled,
-          nativeButton: true,
           "aria-invalid": !!error,
           "aria-describedby": error ? errorId : void 0,
           "aria-label": ariaLabel || label || void 0,
@@ -3281,7 +3272,7 @@ function SelectTrigger({
       "data-slot": "select-trigger",
       "data-size": size,
       className: cn15(
-        "flex w-fit cursor-pointer items-center justify-between gap-1.5 rounded-lg border border-input bg-berget-brand-granite-900 py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "flex w-fit cursor-pointer items-center justify-between gap-1.5 rounded-lg border border-input bg-input/30 py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       ...props,
@@ -3529,7 +3520,7 @@ function Textarea({ className, ...props }) {
     {
       "data-slot": "textarea",
       className: cn18(
-        "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-berget-brand-granite-900 px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-berget-brand-moss-400 focus-visible:ring-3 focus-visible:ring-berget-brand-moss-300/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
+        "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-input/30 px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
         className
       ),
       ...props