@lglab/compose-ui 0.27.0 → 0.28.0

package/dist/badge.d.ts

@@ -0,0 +1,42 @@
+import { JSX } from 'react/jsx-runtime';
+import * as React_2 from 'react';
+
+export declare const Badge: {
+    ({ className, variant, appearance, size, shape, ...props }: BadgeProps): JSX.Element;
+    displayName: string;
+};
+
+export declare type BadgeAppearance = 'default' | 'outline' | 'light' | 'ghost';
+
+export declare const BadgeButton: {
+    ({ className, ...props }: BadgeButtonProps): JSX.Element;
+    displayName: string;
+};
+
+export declare type BadgeButtonProps = React_2.ComponentProps<'button'>;
+
+export declare const BadgeDot: {
+    ({ className, ...props }: BadgeDotProps): JSX.Element;
+    displayName: string;
+};
+
+export declare type BadgeDotProps = React_2.ComponentProps<'span'>;
+
+export declare type BadgeProps = React_2.ComponentProps<'span'> & {
+    /** Visual style variant */
+    variant?: BadgeVariant;
+    /** Appearance style */
+    appearance?: BadgeAppearance;
+    /** Size of the badge */
+    size?: BadgeSize;
+    /** Shape of the badge */
+    shape?: BadgeShape;
+};
+
+export declare type BadgeShape = 'pill' | 'rounded';
+
+export declare type BadgeSize = 'sm' | 'md' | 'lg';
+
+export declare type BadgeVariant = 'default' | 'secondary' | 'destructive' | 'success' | 'warning' | 'info';
+
+export { }

package/dist/badge.js

@@ -0,0 +1,203 @@
+"use client";
+import { jsx as t } from "react/jsx-runtime";
+import { cva as o } from "class-variance-authority";
+import { c as s } from "./utils-B6yFEsav.js";
+const p = o(
+  [
+    "inline-flex items-center gap-1.5 whitespace-nowrap font-medium transition-colors",
+    "[&_svg]:pointer-events-none [&_svg]:shrink-0"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "",
+        secondary: "",
+        destructive: "",
+        success: "",
+        warning: "",
+        info: ""
+      },
+      appearance: {
+        default: "",
+        outline: "border",
+        light: "",
+        ghost: ""
+      },
+      size: {
+        sm: "text-xs px-2 h-5 min-w-5 [&_svg]:size-3",
+        md: "text-xs px-2.5 h-6 min-w-6 [&_svg]:size-3.5",
+        lg: "text-sm px-3 h-7 min-w-7 [&_svg]:size-4"
+      },
+      shape: {
+        pill: "rounded-full",
+        rounded: "rounded-md"
+      }
+    },
+    compoundVariants: [
+      // Default appearance (solid) - full color bg, white text
+      {
+        variant: "default",
+        appearance: "default",
+        class: "bg-primary text-primary-foreground"
+      },
+      {
+        variant: "secondary",
+        appearance: "default",
+        class: "bg-secondary text-secondary-foreground"
+      },
+      {
+        variant: "destructive",
+        appearance: "default",
+        class: "bg-destructive text-white"
+      },
+      {
+        variant: "success",
+        appearance: "default",
+        class: "bg-success text-white"
+      },
+      {
+        variant: "warning",
+        appearance: "default",
+        class: "bg-warning text-white"
+      },
+      {
+        variant: "info",
+        appearance: "default",
+        class: "bg-info text-white"
+      },
+      // Light appearance - 10% bg, colored text
+      {
+        variant: "default",
+        appearance: "light",
+        class: "bg-primary/10 text-primary"
+      },
+      {
+        variant: "secondary",
+        appearance: "light",
+        class: "bg-secondary text-secondary-foreground"
+      },
+      {
+        variant: "destructive",
+        appearance: "light",
+        class: "bg-destructive/10 text-destructive"
+      },
+      {
+        variant: "success",
+        appearance: "light",
+        class: "bg-success/10 text-success"
+      },
+      {
+        variant: "warning",
+        appearance: "light",
+        class: "bg-warning/10 text-warning"
+      },
+      {
+        variant: "info",
+        appearance: "light",
+        class: "bg-info/10 text-info"
+      },
+      // Outline appearance - border + 10% bg, colored text
+      {
+        variant: "default",
+        appearance: "outline",
+        class: "border-primary bg-primary/10 text-primary"
+      },
+      {
+        variant: "secondary",
+        appearance: "outline",
+        class: "bg-secondary border-border text-foreground"
+      },
+      {
+        variant: "destructive",
+        appearance: "outline",
+        class: "border-destructive bg-destructive/10 text-destructive"
+      },
+      {
+        variant: "success",
+        appearance: "outline",
+        class: "border-success bg-success/10 text-success"
+      },
+      {
+        variant: "warning",
+        appearance: "outline",
+        class: "border-warning bg-warning/10 text-warning"
+      },
+      {
+        variant: "info",
+        appearance: "outline",
+        class: "border-info bg-info/10 text-info"
+      },
+      // Ghost appearance - just colored text
+      {
+        variant: "default",
+        appearance: "ghost",
+        class: "text-primary"
+      },
+      {
+        variant: "secondary",
+        appearance: "ghost",
+        class: "text-secondary-foreground"
+      },
+      {
+        variant: "destructive",
+        appearance: "ghost",
+        class: "text-destructive"
+      },
+      {
+        variant: "success",
+        appearance: "ghost",
+        class: "text-success"
+      },
+      {
+        variant: "warning",
+        appearance: "ghost",
+        class: "text-warning"
+      },
+      {
+        variant: "info",
+        appearance: "ghost",
+        class: "text-info"
+      }
+    ],
+    defaultVariants: {
+      variant: "default",
+      appearance: "default",
+      size: "md",
+      shape: "rounded"
+    }
+  }
+), d = ({ className: a, variant: e, appearance: r, size: n, shape: i, ...c }) => /* @__PURE__ */ t(
+  "span",
+  {
+    className: s(p({ variant: e, appearance: r, size: n, shape: i }), a),
+    ...c
+  }
+);
+d.displayName = "Badge";
+const l = ({ className: a, ...e }) => /* @__PURE__ */ t(
+  "span",
+  {
+    "data-slot": "badge-dot",
+    className: s("size-2 rounded-full bg-[currentColor]", a),
+    ...e
+  }
+);
+l.displayName = "BadgeDot";
+const u = ({ className: a, ...e }) => /* @__PURE__ */ t(
+  "button",
+  {
+    "data-slot": "badge-button",
+    type: "button",
+    className: s(
+      "cursor-pointer transition-all inline-flex items-center justify-center leading-none size-3.5 [&>svg]:opacity-100! [&>svg]:size-3.5! p-0 rounded-md -me-0.5 opacity-60 hover:opacity-100",
+      a
+    ),
+    ...e
+  }
+);
+u.displayName = "BadgeButton";
+export {
+  d as Badge,
+  u as BadgeButton,
+  l as BadgeDot
+};

package/dist/index.d.ts

@@ -251,6 +251,44 @@ export declare type AvatarStackProps = {
     children: React_2.ReactNode;
 };
 
+export declare const Badge: {
+    ({ className, variant, appearance, size, shape, ...props }: BadgeProps): JSX.Element;
+    displayName: string;
+};
+
+declare type BadgeAppearance = 'default' | 'outline' | 'light' | 'ghost';
+
+export declare const BadgeButton: {
+    ({ className, ...props }: BadgeButtonProps): JSX.Element;
+    displayName: string;
+};
+
+export declare type BadgeButtonProps = React_2.ComponentProps<'button'>;
+
+export declare const BadgeDot: {
+    ({ className, ...props }: BadgeDotProps): JSX.Element;
+    displayName: string;
+};
+
+export declare type BadgeDotProps = React_2.ComponentProps<'span'>;
+
+export declare type BadgeProps = React_2.ComponentProps<'span'> & {
+    /** Visual style variant */
+    variant?: BadgeVariant;
+    /** Appearance style */
+    appearance?: BadgeAppearance;
+    /** Size of the badge */
+    size?: BadgeSize;
+    /** Shape of the badge */
+    shape?: BadgeShape;
+};
+
+declare type BadgeShape = 'pill' | 'rounded';
+
+declare type BadgeSize = 'sm' | 'md' | 'lg';
+
+declare type BadgeVariant = 'default' | 'secondary' | 'destructive' | 'success' | 'warning' | 'info';
+
 export declare const Button: {
     ({ className, variant, size, disabled, children, ...props }: ButtonProps): JSX.Element;
     displayName: string;

package/dist/index.js

@@ -1,50 +1,51 @@
 import { Button as r } from "./button.js";
 import { CheckboxIndicator as a, CheckboxRoot as i } from "./checkbox.js";
 import { CheckboxGroupRoot as l } from "./checkbox-group.js";
-import { CollapsiblePanel as u, CollapsibleRoot as b, CollapsibleTrigger as m } from "./collapsible.js";
-import { ComboboxArrow as x, ComboboxBackdrop as C, ComboboxChip as d, ComboboxChipRemove as g, ComboboxChips as M, ComboboxClear as P, ComboboxControl as T, ComboboxEmpty as s, ComboboxGroup as I, ComboboxGroupLabel as R, ComboboxIcon as S, ComboboxInput as A, ComboboxItem as f, ComboboxItemIndicator as D, ComboboxItemText as v, ComboboxList as w, ComboboxPopup as k, ComboboxPortal as L, ComboboxPositioner as F, ComboboxRoot as h, ComboboxSeparator as N, ComboboxTrigger as G, ComboboxValue as V } from "./combobox.js";
+import { CollapsiblePanel as u, CollapsibleRoot as m, CollapsibleTrigger as b } from "./collapsible.js";
+import { ComboboxArrow as x, ComboboxBackdrop as d, ComboboxChip as C, ComboboxChipRemove as g, ComboboxChips as M, ComboboxClear as P, ComboboxControl as T, ComboboxEmpty as s, ComboboxGroup as I, ComboboxGroupLabel as R, ComboboxIcon as S, ComboboxInput as A, ComboboxItem as f, ComboboxItemIndicator as D, ComboboxItemText as v, ComboboxList as w, ComboboxPopup as k, ComboboxPortal as L, ComboboxPositioner as F, ComboboxRoot as h, ComboboxSeparator as N, ComboboxTrigger as G, ComboboxValue as B } from "./combobox.js";
 import { AlertDialogBackdrop as H, AlertDialogClose as y, AlertDialogDescription as E, AlertDialogPopup as U, AlertDialogPortal as j, AlertDialogRoot as q, AlertDialogTitle as z, AlertDialogTrigger as J, AlertDialogViewport as K } from "./alert-dialog.js";
 import { AlertDialog as Q } from "@base-ui/react/alert-dialog";
 import { AvatarFallback as X, AvatarImage as Y, AvatarRoot as Z, AvatarStack as _ } from "./avatar.js";
-import { ScrollAreaContent as oo, ScrollAreaCorner as eo, ScrollAreaRoot as ro, ScrollAreaScrollbar as to, ScrollAreaThumb as ao, ScrollAreaViewport as io } from "./scroll-area.js";
-import { SelectArrow as lo, SelectBackdrop as po, SelectGroup as uo, SelectGroupLabel as bo, SelectIcon as mo, SelectItem as co, SelectItemIndicator as xo, SelectItemText as Co, SelectList as go, SelectPopup as Mo, SelectPortal as Po, SelectPositioner as To, SelectRoot as so, SelectScrollDownArrow as Io, SelectScrollUpArrow as Ro, SelectSeparator as So, SelectTrigger as Ao, SelectValue as fo } from "./select.js";
-import { Separator as vo } from "./separator.js";
-import { SwitchRoot as ko, SwitchThumb as Lo } from "./switch.js";
-import { Toggle as ho } from "./toggle.js";
-import { TabsIndicator as Go, TabsList as Vo, TabsPanel as Bo, TabsRoot as Ho, TabsTab as yo } from "./tabs.js";
-import { ToastAction as Uo, ToastClose as jo, ToastContent as qo, ToastDescription as zo, ToastPositioner as Jo, ToastProvider as Ko, ToastRoot as Oo, ToastTitle as Qo, ToastViewport as Wo } from "./toast.js";
-import { DialogBackdrop as Yo, DialogClose as Zo, DialogDescription as _o, DialogFooter as $o, DialogHeader as oe, DialogPopup as ee, DialogPortal as re, DialogRoot as te, DialogTitle as ae, DialogTrigger as ie } from "./dialog.js";
-import { DrawerBackdrop as le, DrawerClose as pe, DrawerContent as ue, DrawerDescription as be, DrawerFooter as me, DrawerHeader as ce, DrawerPopup as xe, DrawerPortal as Ce, DrawerRoot as de, DrawerTitle as ge, DrawerTrigger as Me } from "./drawer.js";
-import { Input as Te } from "./input.js";
-import { Textarea as Ie } from "./textarea.js";
-import { FieldControl as Se, FieldDescription as Ae, FieldError as fe, FieldItem as De, FieldLabel as ve, FieldRoot as we, FieldValidity as ke } from "./field.js";
-import { FieldsetLegend as Fe, FieldsetRoot as he } from "./fieldset.js";
-import { FormRoot as Ge } from "./form.js";
-import { AccordionHeader as Be, AccordionItem as He, AccordionPanel as ye, AccordionRoot as Ee, AccordionTrigger as Ue } from "./accordion.js";
-import { AutocompleteEmpty as qe, AutocompleteInput as ze, AutocompleteItem as Je, AutocompleteList as Ke, AutocompletePopup as Oe, AutocompletePortal as Qe, AutocompletePositioner as We, AutocompleteRoot as Xe } from "./autocomplete.js";
-import { MeterIndicator as Ze, MeterLabel as _e, MeterRoot as $e, MeterTrack as or, MeterValue as er } from "./meter.js";
-import { NavigationMenuArrow as tr, NavigationMenuBackdrop as ar, NavigationMenuContent as ir, NavigationMenuIcon as nr, NavigationMenuItem as lr, NavigationMenuLink as pr, NavigationMenuList as ur, NavigationMenuPopup as br, NavigationMenuPortal as mr, NavigationMenuPositioner as cr, NavigationMenuRoot as xr, NavigationMenuTrigger as Cr, NavigationMenuViewport as dr } from "./navigation-menu.js";
-import { MenuArrow as Mr, MenuCheckboxItem as Pr, MenuCheckboxItemIndicator as Tr, MenuCheckboxItemLabel as sr, MenuGroup as Ir, MenuGroupLabel as Rr, MenuItem as Sr, MenuPopup as Ar, MenuPortal as fr, MenuPositioner as Dr, MenuRadioGroup as vr, MenuRadioItem as wr, MenuRadioItemIndicator as kr, MenuRadioItemLabel as Lr, MenuRoot as Fr, MenuSeparator as hr, MenuSubmenuRoot as Nr, MenuSubmenuTrigger as Gr, MenuTrigger as Vr } from "./menu.js";
-import { NumberFieldDecrement as Hr, NumberFieldGroup as yr, NumberFieldIncrement as Er, NumberFieldInput as Ur, NumberFieldRoot as jr, NumberFieldScrubArea as qr, NumberFieldScrubAreaCursor as zr } from "./number-field.js";
-import { PopoverArrow as Kr, PopoverBackdrop as Or, PopoverClose as Qr, PopoverDescription as Wr, PopoverPopup as Xr, PopoverPortal as Yr, PopoverPositioner as Zr, PopoverRoot as _r, PopoverTitle as $r, PopoverTrigger as ot, PopoverViewport as et } from "./popover.js";
-import { ProgressIndicator as tt, ProgressLabel as at, ProgressRoot as it, ProgressTrack as nt, ProgressValue as lt } from "./progress.js";
-import { RadioIndicator as ut, RadioRoot as bt } from "./radio.js";
-import { RadioGroupRoot as ct } from "./radio-group.js";
-import { ToggleGroupItem as Ct, ToggleGroupRoot as dt } from "./toggle-group.js";
-import { ToolbarButton as Mt, ToolbarGroup as Pt, ToolbarInput as Tt, ToolbarLink as st, ToolbarRoot as It, ToolbarSeparator as Rt } from "./toolbar.js";
-import { CardContent as At, CardDescription as ft, CardFooter as Dt, CardHeader as vt, CardMedia as wt, CardRoot as kt, CardSection as Lt, CardTitle as Ft } from "./card.js";
-import { ContextMenuArrow as Nt, ContextMenuCheckboxItem as Gt, ContextMenuCheckboxItemIndicator as Vt, ContextMenuCheckboxItemLabel as Bt, ContextMenuGroup as Ht, ContextMenuGroupLabel as yt, ContextMenuItem as Et, ContextMenuPopup as Ut, ContextMenuPortal as jt, ContextMenuPositioner as qt, ContextMenuRadioGroup as zt, ContextMenuRadioItem as Jt, ContextMenuRadioItemIndicator as Kt, ContextMenuRadioItemLabel as Ot, ContextMenuRoot as Qt, ContextMenuSeparator as Wt, ContextMenuSubmenuRoot as Xt, ContextMenuSubmenuTrigger as Yt, ContextMenuTrigger as Zt } from "./context-menu.js";
-import { MenubarArrow as $t, MenubarCheckboxItem as oa, MenubarCheckboxItemIndicator as ea, MenubarCheckboxItemLabel as ra, MenubarGroup as ta, MenubarGroupLabel as aa, MenubarItem as ia, MenubarMenu as na, MenubarPopup as la, MenubarPortal as pa, MenubarPositioner as ua, MenubarRadioGroup as ba, MenubarRadioItem as ma, MenubarRadioItemIndicator as ca, MenubarRadioItemLabel as xa, MenubarRoot as Ca, MenubarSeparator as da, MenubarSubmenuRoot as ga, MenubarSubmenuTrigger as Ma, MenubarTrigger as Pa } from "./menubar.js";
-import { SliderControl as sa, SliderIndicator as Ia, SliderRoot as Ra, SliderThumb as Sa, SliderTrack as Aa, SliderValue as fa } from "./slider.js";
-import { TooltipArrow as va, TooltipPopup as wa, TooltipPortal as ka, TooltipPositioner as La, TooltipProvider as Fa, TooltipRoot as ha, TooltipTrigger as Na } from "./tooltip.js";
-import { PreviewCardArrow as Va, PreviewCardBackdrop as Ba, PreviewCardPopup as Ha, PreviewCardPortal as ya, PreviewCardPositioner as Ea, PreviewCardRoot as Ua, PreviewCardTrigger as ja } from "./preview-card.js";
-import { Toast as za } from "@base-ui/react/toast";
+import { Badge as oo, BadgeButton as eo, BadgeDot as ro } from "./badge.js";
+import { ScrollAreaContent as ao, ScrollAreaCorner as io, ScrollAreaRoot as no, ScrollAreaScrollbar as lo, ScrollAreaThumb as po, ScrollAreaViewport as uo } from "./scroll-area.js";
+import { SelectArrow as bo, SelectBackdrop as co, SelectGroup as xo, SelectGroupLabel as Co, SelectIcon as go, SelectItem as Mo, SelectItemIndicator as Po, SelectItemText as To, SelectList as so, SelectPopup as Io, SelectPortal as Ro, SelectPositioner as So, SelectRoot as Ao, SelectScrollDownArrow as fo, SelectScrollUpArrow as Do, SelectSeparator as vo, SelectTrigger as wo, SelectValue as ko } from "./select.js";
+import { Separator as Fo } from "./separator.js";
+import { SwitchRoot as No, SwitchThumb as Go } from "./switch.js";
+import { Toggle as Vo } from "./toggle.js";
+import { TabsIndicator as yo, TabsList as Eo, TabsPanel as Uo, TabsRoot as jo, TabsTab as qo } from "./tabs.js";
+import { ToastAction as Jo, ToastClose as Ko, ToastContent as Oo, ToastDescription as Qo, ToastPositioner as Wo, ToastProvider as Xo, ToastRoot as Yo, ToastTitle as Zo, ToastViewport as _o } from "./toast.js";
+import { DialogBackdrop as oe, DialogClose as ee, DialogDescription as re, DialogFooter as te, DialogHeader as ae, DialogPopup as ie, DialogPortal as ne, DialogRoot as le, DialogTitle as pe, DialogTrigger as ue } from "./dialog.js";
+import { DrawerBackdrop as be, DrawerClose as ce, DrawerContent as xe, DrawerDescription as de, DrawerFooter as Ce, DrawerHeader as ge, DrawerPopup as Me, DrawerPortal as Pe, DrawerRoot as Te, DrawerTitle as se, DrawerTrigger as Ie } from "./drawer.js";
+import { Input as Se } from "./input.js";
+import { Textarea as fe } from "./textarea.js";
+import { FieldControl as ve, FieldDescription as we, FieldError as ke, FieldItem as Le, FieldLabel as Fe, FieldRoot as he, FieldValidity as Ne } from "./field.js";
+import { FieldsetLegend as Be, FieldsetRoot as Ve } from "./fieldset.js";
+import { FormRoot as ye } from "./form.js";
+import { AccordionHeader as Ue, AccordionItem as je, AccordionPanel as qe, AccordionRoot as ze, AccordionTrigger as Je } from "./accordion.js";
+import { AutocompleteEmpty as Oe, AutocompleteInput as Qe, AutocompleteItem as We, AutocompleteList as Xe, AutocompletePopup as Ye, AutocompletePortal as Ze, AutocompletePositioner as _e, AutocompleteRoot as $e } from "./autocomplete.js";
+import { MeterIndicator as er, MeterLabel as rr, MeterRoot as tr, MeterTrack as ar, MeterValue as ir } from "./meter.js";
+import { NavigationMenuArrow as lr, NavigationMenuBackdrop as pr, NavigationMenuContent as ur, NavigationMenuIcon as mr, NavigationMenuItem as br, NavigationMenuLink as cr, NavigationMenuList as xr, NavigationMenuPopup as dr, NavigationMenuPortal as Cr, NavigationMenuPositioner as gr, NavigationMenuRoot as Mr, NavigationMenuTrigger as Pr, NavigationMenuViewport as Tr } from "./navigation-menu.js";
+import { MenuArrow as Ir, MenuCheckboxItem as Rr, MenuCheckboxItemIndicator as Sr, MenuCheckboxItemLabel as Ar, MenuGroup as fr, MenuGroupLabel as Dr, MenuItem as vr, MenuPopup as wr, MenuPortal as kr, MenuPositioner as Lr, MenuRadioGroup as Fr, MenuRadioItem as hr, MenuRadioItemIndicator as Nr, MenuRadioItemLabel as Gr, MenuRoot as Br, MenuSeparator as Vr, MenuSubmenuRoot as Hr, MenuSubmenuTrigger as yr, MenuTrigger as Er } from "./menu.js";
+import { NumberFieldDecrement as jr, NumberFieldGroup as qr, NumberFieldIncrement as zr, NumberFieldInput as Jr, NumberFieldRoot as Kr, NumberFieldScrubArea as Or, NumberFieldScrubAreaCursor as Qr } from "./number-field.js";
+import { PopoverArrow as Xr, PopoverBackdrop as Yr, PopoverClose as Zr, PopoverDescription as _r, PopoverPopup as $r, PopoverPortal as ot, PopoverPositioner as et, PopoverRoot as rt, PopoverTitle as tt, PopoverTrigger as at, PopoverViewport as it } from "./popover.js";
+import { ProgressIndicator as lt, ProgressLabel as pt, ProgressRoot as ut, ProgressTrack as mt, ProgressValue as bt } from "./progress.js";
+import { RadioIndicator as xt, RadioRoot as dt } from "./radio.js";
+import { RadioGroupRoot as gt } from "./radio-group.js";
+import { ToggleGroupItem as Pt, ToggleGroupRoot as Tt } from "./toggle-group.js";
+import { ToolbarButton as It, ToolbarGroup as Rt, ToolbarInput as St, ToolbarLink as At, ToolbarRoot as ft, ToolbarSeparator as Dt } from "./toolbar.js";
+import { CardContent as wt, CardDescription as kt, CardFooter as Lt, CardHeader as Ft, CardMedia as ht, CardRoot as Nt, CardSection as Gt, CardTitle as Bt } from "./card.js";
+import { ContextMenuArrow as Ht, ContextMenuCheckboxItem as yt, ContextMenuCheckboxItemIndicator as Et, ContextMenuCheckboxItemLabel as Ut, ContextMenuGroup as jt, ContextMenuGroupLabel as qt, ContextMenuItem as zt, ContextMenuPopup as Jt, ContextMenuPortal as Kt, ContextMenuPositioner as Ot, ContextMenuRadioGroup as Qt, ContextMenuRadioItem as Wt, ContextMenuRadioItemIndicator as Xt, ContextMenuRadioItemLabel as Yt, ContextMenuRoot as Zt, ContextMenuSeparator as _t, ContextMenuSubmenuRoot as $t, ContextMenuSubmenuTrigger as oa, ContextMenuTrigger as ea } from "./context-menu.js";
+import { MenubarArrow as ta, MenubarCheckboxItem as aa, MenubarCheckboxItemIndicator as ia, MenubarCheckboxItemLabel as na, MenubarGroup as la, MenubarGroupLabel as pa, MenubarItem as ua, MenubarMenu as ma, MenubarPopup as ba, MenubarPortal as ca, MenubarPositioner as xa, MenubarRadioGroup as da, MenubarRadioItem as Ca, MenubarRadioItemIndicator as ga, MenubarRadioItemLabel as Ma, MenubarRoot as Pa, MenubarSeparator as Ta, MenubarSubmenuRoot as sa, MenubarSubmenuTrigger as Ia, MenubarTrigger as Ra } from "./menubar.js";
+import { SliderControl as Aa, SliderIndicator as fa, SliderRoot as Da, SliderThumb as va, SliderTrack as wa, SliderValue as ka } from "./slider.js";
+import { TooltipArrow as Fa, TooltipPopup as ha, TooltipPortal as Na, TooltipPositioner as Ga, TooltipProvider as Ba, TooltipRoot as Va, TooltipTrigger as Ha } from "./tooltip.js";
+import { PreviewCardArrow as Ea, PreviewCardBackdrop as Ua, PreviewCardPopup as ja, PreviewCardPortal as qa, PreviewCardPositioner as za, PreviewCardRoot as Ja, PreviewCardTrigger as Ka } from "./preview-card.js";
+import { Toast as Qa } from "@base-ui/react/toast";
 export {
-  Be as AccordionHeader,
-  He as AccordionItem,
-  ye as AccordionPanel,
-  Ee as AccordionRoot,
-  Ue as AccordionTrigger,
+  Ue as AccordionHeader,
+  je as AccordionItem,
+  qe as AccordionPanel,
+  ze as AccordionRoot,
+  Je as AccordionTrigger,
   Q as AlertDialog,
   H as AlertDialogBackdrop,
   y as AlertDialogClose,
@@ -55,36 +56,39 @@ export {
   z as AlertDialogTitle,
   J as AlertDialogTrigger,
   K as AlertDialogViewport,
-  qe as AutocompleteEmpty,
-  ze as AutocompleteInput,
-  Je as AutocompleteItem,
-  Ke as AutocompleteList,
-  Oe as AutocompletePopup,
-  Qe as AutocompletePortal,
-  We as AutocompletePositioner,
-  Xe as AutocompleteRoot,
+  Oe as AutocompleteEmpty,
+  Qe as AutocompleteInput,
+  We as AutocompleteItem,
+  Xe as AutocompleteList,
+  Ye as AutocompletePopup,
+  Ze as AutocompletePortal,
+  _e as AutocompletePositioner,
+  $e as AutocompleteRoot,
   X as AvatarFallback,
   Y as AvatarImage,
   Z as AvatarRoot,
   _ as AvatarStack,
+  oo as Badge,
+  eo as BadgeButton,
+  ro as BadgeDot,
   r as Button,
-  At as CardContent,
-  ft as CardDescription,
-  Dt as CardFooter,
-  vt as CardHeader,
-  wt as CardMedia,
-  kt as CardRoot,
-  Lt as CardSection,
-  Ft as CardTitle,
+  wt as CardContent,
+  kt as CardDescription,
+  Lt as CardFooter,
+  Ft as CardHeader,
+  ht as CardMedia,
+  Nt as CardRoot,
+  Gt as CardSection,
+  Bt as CardTitle,
   l as CheckboxGroupRoot,
   a as CheckboxIndicator,
   i as CheckboxRoot,
   u as CollapsiblePanel,
-  b as CollapsibleRoot,
-  m as CollapsibleTrigger,
+  m as CollapsibleRoot,
+  b as CollapsibleTrigger,
   x as ComboboxArrow,
-  C as ComboboxBackdrop,
-  d as ComboboxChip,
+  d as ComboboxBackdrop,
+  C as ComboboxChip,
   g as ComboboxChipRemove,
   M as ComboboxChips,
   P as ComboboxClear,
@@ -104,211 +108,211 @@ export {
   h as ComboboxRoot,
   N as ComboboxSeparator,
   G as ComboboxTrigger,
-  V as ComboboxValue,
-  Nt as ContextMenuArrow,
-  Gt as ContextMenuCheckboxItem,
-  Vt as ContextMenuCheckboxItemIndicator,
-  Bt as ContextMenuCheckboxItemLabel,
-  Ht as ContextMenuGroup,
-  yt as ContextMenuGroupLabel,
-  Et as ContextMenuItem,
-  Ut as ContextMenuPopup,
-  jt as ContextMenuPortal,
-  qt as ContextMenuPositioner,
-  zt as ContextMenuRadioGroup,
-  Jt as ContextMenuRadioItem,
-  Kt as ContextMenuRadioItemIndicator,
-  Ot as ContextMenuRadioItemLabel,
-  Qt as ContextMenuRoot,
-  Wt as ContextMenuSeparator,
-  Xt as ContextMenuSubmenuRoot,
-  Yt as ContextMenuSubmenuTrigger,
-  Zt as ContextMenuTrigger,
-  Yo as DialogBackdrop,
-  Zo as DialogClose,
-  _o as DialogDescription,
-  $o as DialogFooter,
-  oe as DialogHeader,
-  ee as DialogPopup,
-  re as DialogPortal,
-  te as DialogRoot,
-  ae as DialogTitle,
-  ie as DialogTrigger,
-  le as DrawerBackdrop,
-  pe as DrawerClose,
-  ue as DrawerContent,
-  be as DrawerDescription,
-  me as DrawerFooter,
-  ce as DrawerHeader,
-  xe as DrawerPopup,
-  Ce as DrawerPortal,
-  de as DrawerRoot,
-  ge as DrawerTitle,
-  Me as DrawerTrigger,
-  Se as FieldControl,
-  Ae as FieldDescription,
-  fe as FieldError,
-  De as FieldItem,
-  ve as FieldLabel,
-  we as FieldRoot,
-  ke as FieldValidity,
-  Fe as FieldsetLegend,
-  he as FieldsetRoot,
-  Ge as FormRoot,
-  Te as Input,
-  Mr as MenuArrow,
-  Pr as MenuCheckboxItem,
-  Tr as MenuCheckboxItemIndicator,
-  sr as MenuCheckboxItemLabel,
-  Ir as MenuGroup,
-  Rr as MenuGroupLabel,
-  Sr as MenuItem,
-  Ar as MenuPopup,
-  fr as MenuPortal,
-  Dr as MenuPositioner,
-  vr as MenuRadioGroup,
-  wr as MenuRadioItem,
-  kr as MenuRadioItemIndicator,
-  Lr as MenuRadioItemLabel,
-  Fr as MenuRoot,
-  hr as MenuSeparator,
-  Nr as MenuSubmenuRoot,
-  Gr as MenuSubmenuTrigger,
-  Vr as MenuTrigger,
-  $t as MenubarArrow,
-  oa as MenubarCheckboxItem,
-  ea as MenubarCheckboxItemIndicator,
-  ra as MenubarCheckboxItemLabel,
-  ta as MenubarGroup,
-  aa as MenubarGroupLabel,
-  ia as MenubarItem,
-  na as MenubarMenu,
-  la as MenubarPopup,
-  pa as MenubarPortal,
-  ua as MenubarPositioner,
-  ba as MenubarRadioGroup,
-  ma as MenubarRadioItem,
-  ca as MenubarRadioItemIndicator,
-  xa as MenubarRadioItemLabel,
-  Ca as MenubarRoot,
-  da as MenubarSeparator,
-  ga as MenubarSubmenuRoot,
-  Ma as MenubarSubmenuTrigger,
-  Pa as MenubarTrigger,
-  Ze as MeterIndicator,
-  _e as MeterLabel,
-  $e as MeterRoot,
-  or as MeterTrack,
-  er as MeterValue,
-  tr as NavigationMenuArrow,
-  ar as NavigationMenuBackdrop,
-  ir as NavigationMenuContent,
-  nr as NavigationMenuIcon,
-  lr as NavigationMenuItem,
-  pr as NavigationMenuLink,
-  ur as NavigationMenuList,
-  br as NavigationMenuPopup,
-  mr as NavigationMenuPortal,
-  cr as NavigationMenuPositioner,
-  xr as NavigationMenuRoot,
-  Cr as NavigationMenuTrigger,
-  dr as NavigationMenuViewport,
-  Hr as NumberFieldDecrement,
-  yr as NumberFieldGroup,
-  Er as NumberFieldIncrement,
-  Ur as NumberFieldInput,
-  jr as NumberFieldRoot,
-  qr as NumberFieldScrubArea,
-  zr as NumberFieldScrubAreaCursor,
-  Kr as PopoverArrow,
-  Or as PopoverBackdrop,
-  Qr as PopoverClose,
-  Wr as PopoverDescription,
-  Xr as PopoverPopup,
-  Yr as PopoverPortal,
-  Zr as PopoverPositioner,
-  _r as PopoverRoot,
-  $r as PopoverTitle,
-  ot as PopoverTrigger,
-  et as PopoverViewport,
-  Va as PreviewCardArrow,
-  Ba as PreviewCardBackdrop,
-  Ha as PreviewCardPopup,
-  ya as PreviewCardPortal,
-  Ea as PreviewCardPositioner,
-  Ua as PreviewCardRoot,
-  ja as PreviewCardTrigger,
-  tt as ProgressIndicator,
-  at as ProgressLabel,
-  it as ProgressRoot,
-  nt as ProgressTrack,
-  lt as ProgressValue,
-  ct as RadioGroupRoot,
-  ut as RadioIndicator,
-  bt as RadioRoot,
-  oo as ScrollAreaContent,
-  eo as ScrollAreaCorner,
-  ro as ScrollAreaRoot,
-  to as ScrollAreaScrollbar,
-  ao as ScrollAreaThumb,
-  io as ScrollAreaViewport,
-  lo as SelectArrow,
-  po as SelectBackdrop,
-  uo as SelectGroup,
-  bo as SelectGroupLabel,
-  mo as SelectIcon,
-  co as SelectItem,
-  xo as SelectItemIndicator,
-  Co as SelectItemText,
-  go as SelectList,
-  Mo as SelectPopup,
-  Po as SelectPortal,
-  To as SelectPositioner,
-  so as SelectRoot,
-  Io as SelectScrollDownArrow,
-  Ro as SelectScrollUpArrow,
-  So as SelectSeparator,
-  Ao as SelectTrigger,
-  fo as SelectValue,
-  vo as Separator,
-  sa as SliderControl,
-  Ia as SliderIndicator,
-  Ra as SliderRoot,
-  Sa as SliderThumb,
-  Aa as SliderTrack,
-  fa as SliderValue,
-  ko as SwitchRoot,
-  Lo as SwitchThumb,
-  Go as TabsIndicator,
-  Vo as TabsList,
-  Bo as TabsPanel,
-  Ho as TabsRoot,
-  yo as TabsTab,
-  Ie as Textarea,
-  za as Toast,
-  Uo as ToastAction,
-  jo as ToastClose,
-  qo as ToastContent,
-  zo as ToastDescription,
-  Jo as ToastPositioner,
-  Ko as ToastProvider,
-  Oo as ToastRoot,
-  Qo as ToastTitle,
-  Wo as ToastViewport,
-  ho as Toggle,
-  Ct as ToggleGroupItem,
-  dt as ToggleGroupRoot,
-  Mt as ToolbarButton,
-  Pt as ToolbarGroup,
-  Tt as ToolbarInput,
-  st as ToolbarLink,
-  It as ToolbarRoot,
-  Rt as ToolbarSeparator,
-  va as TooltipArrow,
-  wa as TooltipPopup,
-  ka as TooltipPortal,
-  La as TooltipPositioner,
-  Fa as TooltipProvider,
-  ha as TooltipRoot,
-  Na as TooltipTrigger
+  B as ComboboxValue,
+  Ht as ContextMenuArrow,
+  yt as ContextMenuCheckboxItem,
+  Et as ContextMenuCheckboxItemIndicator,
+  Ut as ContextMenuCheckboxItemLabel,
+  jt as ContextMenuGroup,
+  qt as ContextMenuGroupLabel,
+  zt as ContextMenuItem,
+  Jt as ContextMenuPopup,
+  Kt as ContextMenuPortal,
+  Ot as ContextMenuPositioner,
+  Qt as ContextMenuRadioGroup,
+  Wt as ContextMenuRadioItem,
+  Xt as ContextMenuRadioItemIndicator,
+  Yt as ContextMenuRadioItemLabel,
+  Zt as ContextMenuRoot,
+  _t as ContextMenuSeparator,
+  $t as ContextMenuSubmenuRoot,
+  oa as ContextMenuSubmenuTrigger,
+  ea as ContextMenuTrigger,
+  oe as DialogBackdrop,
+  ee as DialogClose,
+  re as DialogDescription,
+  te as DialogFooter,
+  ae as DialogHeader,
+  ie as DialogPopup,
+  ne as DialogPortal,
+  le as DialogRoot,
+  pe as DialogTitle,
+  ue as DialogTrigger,
+  be as DrawerBackdrop,
+  ce as DrawerClose,
+  xe as DrawerContent,
+  de as DrawerDescription,
+  Ce as DrawerFooter,
+  ge as DrawerHeader,
+  Me as DrawerPopup,
+  Pe as DrawerPortal,
+  Te as DrawerRoot,
+  se as DrawerTitle,
+  Ie as DrawerTrigger,
+  ve as FieldControl,
+  we as FieldDescription,
+  ke as FieldError,
+  Le as FieldItem,
+  Fe as FieldLabel,
+  he as FieldRoot,
+  Ne as FieldValidity,
+  Be as FieldsetLegend,
+  Ve as FieldsetRoot,
+  ye as FormRoot,
+  Se as Input,
+  Ir as MenuArrow,
+  Rr as MenuCheckboxItem,
+  Sr as MenuCheckboxItemIndicator,
+  Ar as MenuCheckboxItemLabel,
+  fr as MenuGroup,
+  Dr as MenuGroupLabel,
+  vr as MenuItem,
+  wr as MenuPopup,
+  kr as MenuPortal,
+  Lr as MenuPositioner,
+  Fr as MenuRadioGroup,
+  hr as MenuRadioItem,
+  Nr as MenuRadioItemIndicator,
+  Gr as MenuRadioItemLabel,
+  Br as MenuRoot,
+  Vr as MenuSeparator,
+  Hr as MenuSubmenuRoot,
+  yr as MenuSubmenuTrigger,
+  Er as MenuTrigger,
+  ta as MenubarArrow,
+  aa as MenubarCheckboxItem,
+  ia as MenubarCheckboxItemIndicator,
+  na as MenubarCheckboxItemLabel,
+  la as MenubarGroup,
+  pa as MenubarGroupLabel,
+  ua as MenubarItem,
+  ma as MenubarMenu,
+  ba as MenubarPopup,
+  ca as MenubarPortal,
+  xa as MenubarPositioner,
+  da as MenubarRadioGroup,
+  Ca as MenubarRadioItem,
+  ga as MenubarRadioItemIndicator,
+  Ma as MenubarRadioItemLabel,
+  Pa as MenubarRoot,
+  Ta as MenubarSeparator,
+  sa as MenubarSubmenuRoot,
+  Ia as MenubarSubmenuTrigger,
+  Ra as MenubarTrigger,
+  er as MeterIndicator,
+  rr as MeterLabel,
+  tr as MeterRoot,
+  ar as MeterTrack,
+  ir as MeterValue,
+  lr as NavigationMenuArrow,
+  pr as NavigationMenuBackdrop,
+  ur as NavigationMenuContent,
+  mr as NavigationMenuIcon,
+  br as NavigationMenuItem,
+  cr as NavigationMenuLink,
+  xr as NavigationMenuList,
+  dr as NavigationMenuPopup,
+  Cr as NavigationMenuPortal,
+  gr as NavigationMenuPositioner,
+  Mr as NavigationMenuRoot,
+  Pr as NavigationMenuTrigger,
+  Tr as NavigationMenuViewport,
+  jr as NumberFieldDecrement,
+  qr as NumberFieldGroup,
+  zr as NumberFieldIncrement,
+  Jr as NumberFieldInput,
+  Kr as NumberFieldRoot,
+  Or as NumberFieldScrubArea,
+  Qr as NumberFieldScrubAreaCursor,
+  Xr as PopoverArrow,
+  Yr as PopoverBackdrop,
+  Zr as PopoverClose,
+  _r as PopoverDescription,
+  $r as PopoverPopup,
+  ot as PopoverPortal,
+  et as PopoverPositioner,
+  rt as PopoverRoot,
+  tt as PopoverTitle,
+  at as PopoverTrigger,
+  it as PopoverViewport,
+  Ea as PreviewCardArrow,
+  Ua as PreviewCardBackdrop,
+  ja as PreviewCardPopup,
+  qa as PreviewCardPortal,
+  za as PreviewCardPositioner,
+  Ja as PreviewCardRoot,
+  Ka as PreviewCardTrigger,
+  lt as ProgressIndicator,
+  pt as ProgressLabel,
+  ut as ProgressRoot,
+  mt as ProgressTrack,
+  bt as ProgressValue,
+  gt as RadioGroupRoot,
+  xt as RadioIndicator,
+  dt as RadioRoot,
+  ao as ScrollAreaContent,
+  io as ScrollAreaCorner,
+  no as ScrollAreaRoot,
+  lo as ScrollAreaScrollbar,
+  po as ScrollAreaThumb,
+  uo as ScrollAreaViewport,
+  bo as SelectArrow,
+  co as SelectBackdrop,
+  xo as SelectGroup,
+  Co as SelectGroupLabel,
+  go as SelectIcon,
+  Mo as SelectItem,
+  Po as SelectItemIndicator,
+  To as SelectItemText,
+  so as SelectList,
+  Io as SelectPopup,
+  Ro as SelectPortal,
+  So as SelectPositioner,
+  Ao as SelectRoot,
+  fo as SelectScrollDownArrow,
+  Do as SelectScrollUpArrow,
+  vo as SelectSeparator,
+  wo as SelectTrigger,
+  ko as SelectValue,
+  Fo as Separator,
+  Aa as SliderControl,
+  fa as SliderIndicator,
+  Da as SliderRoot,
+  va as SliderThumb,
+  wa as SliderTrack,
+  ka as SliderValue,
+  No as SwitchRoot,
+  Go as SwitchThumb,
+  yo as TabsIndicator,
+  Eo as TabsList,
+  Uo as TabsPanel,
+  jo as TabsRoot,
+  qo as TabsTab,
+  fe as Textarea,
+  Qa as Toast,
+  Jo as ToastAction,
+  Ko as ToastClose,
+  Oo as ToastContent,
+  Qo as ToastDescription,
+  Wo as ToastPositioner,
+  Xo as ToastProvider,
+  Yo as ToastRoot,
+  Zo as ToastTitle,
+  _o as ToastViewport,
+  Vo as Toggle,
+  Pt as ToggleGroupItem,
+  Tt as ToggleGroupRoot,
+  It as ToolbarButton,
+  Rt as ToolbarGroup,
+  St as ToolbarInput,
+  At as ToolbarLink,
+  ft as ToolbarRoot,
+  Dt as ToolbarSeparator,
+  Fa as TooltipArrow,
+  ha as TooltipPopup,
+  Na as TooltipPortal,
+  Ga as TooltipPositioner,
+  Ba as TooltipProvider,
+  Va as TooltipRoot,
+  Ha as TooltipTrigger
 };

package/dist/styles/default.css

@@ -17,6 +17,9 @@
   --color-accent: var(--accent);
   --color-accent-foreground: var(--accent-foreground);
   --color-destructive: var(--destructive);
+  --color-success: var(--success);
+  --color-warning: var(--warning);
+  --color-info: var(--info);
   --color-input: var(--input);
   --color-border: var(--border);
   --color-ring: var(--ring);
@@ -37,6 +40,9 @@
   --accent: oklch(0.97 0 0);
   --accent-foreground: oklch(0.205 0 0);
   --destructive: oklch(0.577 0.245 27.325);
+  --success: oklch(0.59 0.2 145);
+  --warning: oklch(0.75 0.18 85);
+  --info: oklch(0.55 0.2 255);
   --border: oklch(0.922 0 0);
   --input: oklch(0.922 0 0);
   --ring: oklch(0.708 0 0);
@@ -56,6 +62,9 @@
   --accent: oklch(0.269 0 0);
   --accent-foreground: oklch(0.985 0 0);
   --destructive: oklch(0.704 0.191 22.216);
+  --success: oklch(0.65 0.2 145);
+  --warning: oklch(0.795 0.184 86.047);
+  --info: oklch(0.65 0.2 255);
   --border: oklch(1 0 0 / 10%);
   --input: oklch(1 0 0 / 15%);
   --ring: oklch(0.556 0 0);
@@ -76,6 +85,9 @@
     --accent: oklch(0.269 0 0);
     --accent-foreground: oklch(0.985 0 0);
     --destructive: oklch(0.704 0.191 22.216);
+    --success: oklch(0.65 0.2 145);
+    --warning: oklch(0.795 0.184 86.047);
+    --info: oklch(0.65 0.2 255);
     --input: oklch(1 0 0 / 15%);
     --border: oklch(1 0 0 / 10%);
     --ring: oklch(0.556 0 0);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lglab/compose-ui",
-  "version": "0.27.0",
+  "version": "0.28.0",
   "description": "A collection of components built with Base UI & Tailwind CSS",
   "author": "LGLab",
   "license": "MIT",
@@ -42,6 +42,10 @@
       "import": "./dist/avatar.js",
       "types": "./dist/avatar.d.ts"
     },
+    "./badge": {
+      "import": "./dist/badge.js",
+      "types": "./dist/badge.d.ts"
+    },
     "./button": {
       "import": "./dist/button.js",
       "types": "./dist/button.d.ts"