@pantool/components 1.0.0-alpha.1 → 1.0.0-alpha.10

package/dist/helpers/flex/flex.d.ts

@@ -0,0 +1,45 @@
+import { PolymorphicProps, WithBaseProps } from "../../types.js";
+import * as React$1 from "react";
+import { PropValueWithBreakpoints } from "@pantool/lib";
+
+//#region src/helpers/flex/flex.d.ts
+type FlexProps<E extends React$1.ElementType = "div"> = PolymorphicProps<E, WithBaseProps<{
+  /**
+   * The variant of the flex-box.
+   *
+   * @default "block"
+   */
+  variant?: "block" | "inline";
+  /**
+   * Changes how flex-items wrap in the flex-box.
+   */
+  wrapMode?: PropValueWithBreakpoints<"nowrap" | "wrap" | "wrap-reverse">;
+  /**
+   * Sets the gap between flex-items in the flex-box.
+   */
+  gap?: PropValueWithBreakpoints<"xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl">;
+  /**
+   * Sets the direction of flex-items in the flex-box.
+   */
+  direction?: PropValueWithBreakpoints<"row" | "column" | "row-reverse" | "column-reverse">;
+  /**
+   * Defines how the browser distributes space between and around content items
+   * along the main-axis of the flex-box.
+   */
+  justifyContent?: PropValueWithBreakpoints<"start" | "end" | "center" | "between" | "around" | "evenly">;
+  /**
+   * Controls the alignment of flex-items on the cross-axis in the flex-box.
+   */
+  alignItems?: PropValueWithBreakpoints<"start" | "end" | "center" | "baseline" | "stretch">;
+  /**
+   * Sets the distribution of space between and around content items
+   * along the cross-axis of the flex-box.
+   *
+   * (Note: This property has no effect on single rows of flex-items.)
+   */
+  alignContent?: PropValueWithBreakpoints<"start" | "end" | "center" | "between" | "around" | "evenly" | "stretch">;
+}>>;
+declare const Flex: <E extends React$1.ElementType = "div">(props: FlexProps<E>) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Flex, FlexProps };
+//# sourceMappingURL=flex.d.ts.map

package/dist/helpers/flex/flex.js

@@ -0,0 +1,2 @@
+import e from"./styles.module.js";import t from"clsx";import"react";import{jsx as n}from"react/jsx-runtime";const r=r=>{let{as:i=`div`,className:a,children:o,wrapMode:s,gap:c,direction:l,justifyContent:u,alignItems:d,alignContent:f,variant:p=`block`,...m}=r;return n(i,{...m,"data-gap":c,"data-wrap-mode":s,"data-direction":l,"data-justify-content":u,"data-align-items":d,"data-align-content":f,"data-variant":p,"data-slot":`flex-root`,className:t(e.root,a),children:o})};export{r as Flex};
+//# sourceMappingURL=flex.js.map

package/dist/helpers/flex/flex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flex.js","names":["classes"],"sources":["../../../src/helpers/flex/flex.tsx"],"sourcesContent":["import type { PropValueWithBreakpoints } from \"@pantool/lib\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport type { PolymorphicProps, WithBaseProps } from \"../../types\";\nimport classes from \"./styles.module.css\";\n\nexport type FlexProps<E extends React.ElementType = \"div\"> = PolymorphicProps<\n  E,\n  WithBaseProps<{\n    /**\n     * The variant of the flex-box.\n     *\n     * @default \"block\"\n     */\n    variant?: \"block\" | \"inline\";\n\n    /**\n     * Changes how flex-items wrap in the flex-box.\n     */\n    wrapMode?: PropValueWithBreakpoints<\"nowrap\" | \"wrap\" | \"wrap-reverse\">;\n\n    /**\n     * Sets the gap between flex-items in the flex-box.\n     */\n    gap?: PropValueWithBreakpoints<\n      \"xxs\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\"\n    >;\n\n    /**\n     * Sets the direction of flex-items in the flex-box.\n     */\n    direction?: PropValueWithBreakpoints<\n      \"row\" | \"column\" | \"row-reverse\" | \"column-reverse\"\n    >;\n\n    /**\n     * Defines how the browser distributes space between and around content items\n     * along the main-axis of the flex-box.\n     */\n    justifyContent?: PropValueWithBreakpoints<\n      \"start\" | \"end\" | \"center\" | \"between\" | \"around\" | \"evenly\"\n    >;\n\n    /**\n     * Controls the alignment of flex-items on the cross-axis in the flex-box.\n     */\n    alignItems?: PropValueWithBreakpoints<\n      \"start\" | \"end\" | \"center\" | \"baseline\" | \"stretch\"\n    >;\n\n    /**\n     * Sets the distribution of space between and around content items\n     * along the cross-axis of the flex-box.\n     *\n     * (Note: This property has no effect on single rows of flex-items.)\n     */\n    alignContent?: PropValueWithBreakpoints<\n      \"start\" | \"end\" | \"center\" | \"between\" | \"around\" | \"evenly\" | \"stretch\"\n    >;\n  }>\n>;\n\nexport const Flex = <E extends React.ElementType = \"div\">(\n  props: FlexProps<E>,\n) => {\n  const {\n    as: Root = \"div\",\n    className,\n    children,\n    wrapMode,\n    gap,\n    direction,\n    justifyContent,\n    alignItems,\n    alignContent,\n    variant = \"block\",\n    ...otherProps\n  } = props;\n\n  return (\n    <Root\n      {...otherProps}\n      data-gap={gap}\n      data-wrap-mode={wrapMode}\n      data-direction={direction}\n      data-justify-content={justifyContent}\n      data-align-items={alignItems}\n      data-align-content={alignContent}\n      data-variant={variant}\n      data-slot=\"flex-root\"\n      className={clsx(classes[\"root\"], className)}\n    >\n      {children}\n    </Root>\n  );\n};\n"],"mappings":"4GA8DA,MAAa,EACX,GACG,CACH,GAAM,CACJ,GAAI,EAAO,MACX,YACA,WACA,WACA,MACA,YACA,iBACA,aACA,eACA,UAAU,QACV,GAAG,GACD,EAEJ,OACE,EAAC,EAAD,CACE,GAAI,EACJ,WAAU,EACV,iBAAgB,EAChB,iBAAgB,EAChB,uBAAsB,EACtB,mBAAkB,EAClB,qBAAoB,EACpB,eAAc,EACd,YAAU,YACV,UAAW,EAAKA,EAAQ,KAAS,CAAS,EAEzC,UACG,CAAA,CAEV"}

package/dist/helpers/flex/index.d.ts

@@ -0,0 +1 @@
+import { Flex, FlexProps } from "./flex.js";

package/dist/helpers/flex/index.js

@@ -0,0 +1 @@
+import"./flex.js";

package/dist/helpers/flex/styles.css

@@ -0,0 +1 @@
+.VYIyxW_root{display:var(--display);gap:var(--gap);flex-direction:var(--direction);flex-wrap:var(--wrap-mode);justify-content:var(--justify-content);align-items:var(--align-items);align-content:var(--align-content)}.VYIyxW_root[data-variant=block]{--display:flex}.VYIyxW_root[data-variant=inline]{--display:inline-flex}.VYIyxW_root[data-gap=xxs]{--gap:var(--spacing-xxs)}.VYIyxW_root[data-gap=xs]{--gap:var(--spacing-xs)}.VYIyxW_root[data-gap=sm]{--gap:var(--spacing-sm)}.VYIyxW_root[data-gap=md]{--gap:var(--spacing-md)}.VYIyxW_root[data-gap=lg]{--gap:var(--spacing-lg)}.VYIyxW_root[data-gap=xl]{--gap:var(--spacing-xl)}.VYIyxW_root[data-gap=xxl]{--gap:var(--spacing-xxl)}.VYIyxW_root[data-direction=row]{--direction:row}.VYIyxW_root[data-direction=column]{--direction:column}.VYIyxW_root[data-direction=row-reverse]{--direction:row-reverse}.VYIyxW_root[data-direction=column-reverse]{--direction:column-reverse}.VYIyxW_root[data-wrap-mode=nowrap]{--wrap-mode:nowrap}.VYIyxW_root[data-wrap-mode=wrap]{--wrap-mode:wrap}.VYIyxW_root[data-wrap-mode=wrap-reverse]{--wrap-mode:wrap-reverse}.VYIyxW_root[data-justify-content=start]{--justify-content:flex-start}.VYIyxW_root[data-justify-content=end]{--justify-content:flex-end}.VYIyxW_root[data-justify-content=center]{--justify-content:center}.VYIyxW_root[data-justify-content=between]{--justify-content:space-between}.VYIyxW_root[data-justify-content=around]{--justify-content:space-around}.VYIyxW_root[data-justify-content=evenly]{--justify-content:space-evenly}.VYIyxW_root[data-align-items=start]{--align-items:flex-start}.VYIyxW_root[data-align-items=end]{--align-items:flex-end}.VYIyxW_root[data-align-items=center]{--align-items:center}.VYIyxW_root[data-align-items=baseline]{--align-items:baseline}.VYIyxW_root[data-align-items=stretch]{--align-items:stretch}.VYIyxW_root[data-align-content=start]{--align-content:flex-start}.VYIyxW_root[data-align-content=end]{--align-content:flex-end}.VYIyxW_root[data-align-content=center]{--align-content:center}.VYIyxW_root[data-align-content=between]{--align-content:space-between}.VYIyxW_root[data-align-content=around]{--align-content:space-around}.VYIyxW_root[data-align-content=evenly]{--align-content:space-evenly}.VYIyxW_root[data-align-content=stretch]{--align-content:stretch}

package/dist/helpers/flex/styles.module.js

@@ -0,0 +1,3 @@
+import './styles.css';
+var e={root:`VYIyxW_root`};export{e as default};
+//# sourceMappingURL=styles.module.js.map

package/dist/helpers/flex/styles.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.module.js","names":[],"sources":["../../../src/helpers/flex/styles.module.css"],"sourcesContent":[".root {\n  display: var(--display);\n  gap: var(--gap);\n  flex-direction: var(--direction);\n  flex-wrap: var(--wrap-mode);\n  justify-content: var(--justify-content);\n  align-items: var(--align-items);\n  align-content: var(--align-content);\n}\n\n.root[data-variant=\"block\"] {\n  --display: flex;\n}\n.root[data-variant=\"inline\"] {\n  --display: inline-flex;\n}\n\n/* gap */\n.root[data-gap=\"xxs\"] {\n  --gap: var(--spacing-xxs);\n}\n.root[data-gap=\"xs\"] {\n  --gap: var(--spacing-xs);\n}\n.root[data-gap=\"sm\"] {\n  --gap: var(--spacing-sm);\n}\n.root[data-gap=\"md\"] {\n  --gap: var(--spacing-md);\n}\n.root[data-gap=\"lg\"] {\n  --gap: var(--spacing-lg);\n}\n.root[data-gap=\"xl\"] {\n  --gap: var(--spacing-xl);\n}\n.root[data-gap=\"xxl\"] {\n  --gap: var(--spacing-xxl);\n}\n\n/* direction */\n.root[data-direction=\"row\"] {\n  --direction: row;\n}\n.root[data-direction=\"column\"] {\n  --direction: column;\n}\n.root[data-direction=\"row-reverse\"] {\n  --direction: row-reverse;\n}\n.root[data-direction=\"column-reverse\"] {\n  --direction: column-reverse;\n}\n\n/* wrap-mode */\n.root[data-wrap-mode=\"nowrap\"] {\n  --wrap-mode: nowrap;\n}\n.root[data-wrap-mode=\"wrap\"] {\n  --wrap-mode: wrap;\n}\n.root[data-wrap-mode=\"wrap-reverse\"] {\n  --wrap-mode: wrap-reverse;\n}\n\n/* justify-content */\n.root[data-justify-content=\"start\"] {\n  --justify-content: flex-start;\n}\n.root[data-justify-content=\"end\"] {\n  --justify-content: flex-end;\n}\n.root[data-justify-content=\"center\"] {\n  --justify-content: center;\n}\n.root[data-justify-content=\"between\"] {\n  --justify-content: space-between;\n}\n.root[data-justify-content=\"around\"] {\n  --justify-content: space-around;\n}\n.root[data-justify-content=\"evenly\"] {\n  --justify-content: space-evenly;\n}\n\n/* align-items */\n.root[data-align-items=\"start\"] {\n  --align-items: flex-start;\n}\n.root[data-align-items=\"end\"] {\n  --align-items: flex-end;\n}\n.root[data-align-items=\"center\"] {\n  --align-items: center;\n}\n.root[data-align-items=\"baseline\"] {\n  --align-items: baseline;\n}\n.root[data-align-items=\"stretch\"] {\n  --align-items: stretch;\n}\n\n/* align-content */\n.root[data-align-content=\"start\"] {\n  --align-content: flex-start;\n}\n.root[data-align-content=\"end\"] {\n  --align-content: flex-end;\n}\n.root[data-align-content=\"center\"] {\n  --align-content: center;\n}\n.root[data-align-content=\"between\"] {\n  --align-content: space-between;\n}\n.root[data-align-content=\"around\"] {\n  --align-content: space-around;\n}\n.root[data-align-content=\"evenly\"] {\n  --align-content: space-evenly;\n}\n.root[data-align-content=\"stretch\"] {\n  --align-content: stretch;\n}\n"],"mappings":""}

package/dist/helpers/index.d.ts

@@ -0,0 +1,4 @@
+import { Flex, FlexProps } from "./flex/flex.js";
+import { usePortalConfig } from "./portal/context/hooks.js";
+import { PortalConfigProvider } from "./portal/context/provider.js";
+import { Portal, PortalProps } from "./portal/portal.js";

package/dist/helpers/index.js

@@ -0,0 +1 @@
+import"./portal/context/hooks.js";import"./portal/context/provider.js";import"./portal/portal.js";import"./portal/index.js";import"./flex/flex.js";import"./flex/index.js";

package/dist/helpers/portal/context/portal-config.js.map

@@ -1 +1 @@
-{"version":3,"file":"portal-config.js","names":[],"sources":["../../../../src/helpers/portal/context/portal-config.ts"],"sourcesContent":["import * as React from \"react\";\n\nexport type PortalConfigValue = {\n  /**\n   * A function that will resolve the container element for the portals.\n   *\n   * Please note that this function is only called on the client-side.\n   */\n  resolveContainer: () => HTMLElement | null;\n};\n\nexport const PortalConfig = React.createContext<PortalConfigValue | null>(null);\n"],"mappings":"wBAWA,MAAa,EAAe,EAAM,cAAwC,IAAI"}
+{"version":3,"file":"portal-config.js","names":["React"],"sources":["../../../../src/helpers/portal/context/portal-config.ts"],"sourcesContent":["import * as React from \"react\";\n\nexport type PortalConfigValue = {\n  /**\n   * A function that will resolve the container element for the portals.\n   *\n   * Please note that this function is only called on the client-side.\n   */\n  resolveContainer: () => HTMLElement | null;\n};\n\nexport const PortalConfig = React.createContext<PortalConfigValue | null>(null);\n"],"mappings":"wBAWA,MAAa,EAAeA,EAAM,cAAwC,IAAI"}

package/dist/index.d.ts

@@ -1,21 +1,27 @@
 import { AlertDialog, AlertDialogProps } from "./atoms/alert-dialog/alert-dialog.js";
+import { Avatar, AvatarProps } from "./atoms/avatar/avatar.js";
 import { Button, ButtonProps } from "./atoms/button/button.js";
 import { Checkbox, CheckboxProps } from "./atoms/checkbox/checkbox.js";
+import { MergeElementProps, MergeElementPropsWithOmitted, PolymorphicProps, PolymorphicPropsWithOmitted, WithBaseProps, WithColorProps, WithRef } from "./types.js";
+import { ClickableArea, ClickableAreaProps } from "./atoms/clickable-area/clickable-area.js";
+import { Collapsible } from "./atoms/collapsible/collapsible.js";
+import { ComboboxItem } from "./atoms/combobox/components/item.js";
 import { Combobox, ComboboxGroup, ComboboxProps } from "./atoms/combobox/combobox.js";
+import { ConditionGuard, ConditionGuardProps } from "./atoms/condition-guard/condition-guard.js";
 import { ContextMenu } from "./atoms/context-menu/context-menu.js";
 import { Dialog, DialogProps } from "./atoms/dialog/dialog.js";
-import { Icon, IconProps } from "./atoms/icon/icon.js";
 import { IconButton, IconButtonProps } from "./atoms/icon-button/icon-button.js";
+import { Icon, IconProps } from "./atoms/icon/icon.js";
 import { Input, InputProps } from "./atoms/input/input.js";
+import { BaseItem, CheckboxItem, GroupItem, Menu, MenuItemsByMode, MenuMode, MenuProps, NormalItem, RadioItem, SeparatorItem, SubmenuItem } from "./atoms/menu/menu.js";
 import { Radio, RadioGroup, RadioGroupProps, RadioProps } from "./atoms/radio/radio.js";
 import { Switch, SwitchProps } from "./atoms/switch/switch.js";
 import { Tabs, TabsList, TabsListProps, TabsPanel, TabsPanelProps, TabsTab, TabsTabProps } from "./atoms/tabs/tabs.js";
 import { TabsListState, TabsPanelState, TabsRootChangeEventDetails, TabsRootState, TabsTabState, TabsTabValue } from "./atoms/tabs/index.js";
-import { MergeElementProps, MergeElementPropsWithOmitted, PolymorphicProps, PolymorphicPropsWithOmitted, WithBaseProps, WithColorProps, WithRef } from "./types.js";
 import { Text, TextColor, TextProps, TextVariant } from "./atoms/text/text.js";
 import { Toast, ToastData, ToastProps } from "./atoms/toast/toast.js";
 import { Tooltip, TooltipProps, TooltipProvider, TooltipProviderProps } from "./atoms/tooltip/tooltip.js";
-import { ConditionGuard, ConditionGuardProps } from "./atoms/condition-guard/condition-guard.js";
+import { Flex, FlexProps } from "./helpers/flex/flex.js";
 import { usePortalConfig } from "./helpers/portal/context/hooks.js";
 import { PortalConfigProvider } from "./helpers/portal/context/provider.js";
 import { Portal, PortalProps } from "./helpers/portal/portal.js";
@@ -24,4 +30,4 @@ import { useAlertDialog } from "./providers/alert-dialog-provider/hooks.js";
 import { DialogContext, DialogProvider, DialogProviderProps, showDialog } from "./providers/dialog-provider/dialog-provider.js";
 import { useDialog } from "./providers/dialog-provider/hooks.js";
 import { ToastProvider, ToastProviderProps, toaster } from "./providers/toast-provider/toast-provider.js";
-export { AlertDialog, AlertDialogContext, AlertDialogProps, AlertDialogProvider, AlertDialogProviderProps, Button, ButtonProps, Checkbox, CheckboxProps, Combobox, ComboboxGroup, ComboboxProps, ConditionGuard, ConditionGuardProps, ContextMenu, Dialog, DialogContext, DialogProps, DialogProvider, DialogProviderProps, Icon, IconButton, IconButtonProps, IconProps, Input, InputProps, MergeElementProps, MergeElementPropsWithOmitted, PolymorphicProps, PolymorphicPropsWithOmitted, Portal, PortalConfigProvider, PortalProps, Radio, RadioGroup, RadioGroupProps, RadioProps, Switch, SwitchProps, Tabs, TabsList, type TabsListProps, type TabsListState, TabsPanel, type TabsPanelProps, type TabsPanelState, type TabsRootChangeEventDetails, type TabsRootState, TabsTab, type TabsTabProps, type TabsTabState, type TabsTabValue, Text, TextColor, TextProps, TextVariant, Toast, ToastData, ToastProps, ToastProvider, ToastProviderProps, Tooltip, TooltipProps, TooltipProvider, TooltipProviderProps, WithBaseProps, WithColorProps, WithRef, showAlertDialog, showDialog, toaster, useAlertDialog, useDialog, usePortalConfig };
+export { AlertDialog, AlertDialogContext, AlertDialogProps, AlertDialogProvider, AlertDialogProviderProps, Avatar, AvatarProps, BaseItem, Button, ButtonProps, Checkbox, CheckboxItem, CheckboxProps, ClickableArea, ClickableAreaProps, Collapsible, Combobox, ComboboxGroup, type ComboboxItem, ComboboxProps, ConditionGuard, ConditionGuardProps, ContextMenu, Dialog, DialogContext, DialogProps, DialogProvider, DialogProviderProps, Flex, FlexProps, GroupItem, Icon, IconButton, IconButtonProps, IconProps, Input, InputProps, Menu, MenuItemsByMode, MenuMode, MenuProps, MergeElementProps, MergeElementPropsWithOmitted, NormalItem, PolymorphicProps, PolymorphicPropsWithOmitted, Portal, PortalConfigProvider, PortalProps, Radio, RadioGroup, RadioGroupProps, RadioItem, RadioProps, SeparatorItem, SubmenuItem, Switch, SwitchProps, Tabs, TabsList, type TabsListProps, type TabsListState, TabsPanel, type TabsPanelProps, type TabsPanelState, type TabsRootChangeEventDetails, type TabsRootState, TabsTab, type TabsTabProps, type TabsTabState, type TabsTabValue, Text, TextColor, TextProps, TextVariant, Toast, ToastData, ToastProps, ToastProvider, ToastProviderProps, Tooltip, TooltipProps, TooltipProvider, TooltipProviderProps, WithBaseProps, WithColorProps, WithRef, showAlertDialog, showDialog, toaster, useAlertDialog, useDialog, usePortalConfig };

package/dist/index.js

@@ -1 +1 @@
-import{Button as e}from"./atoms/button/button.js";import{Text as t}from"./atoms/text/text.js";import{usePortalConfig as n}from"./helpers/portal/context/hooks.js";import{PortalConfigProvider as r}from"./helpers/portal/context/provider.js";import{Portal as i}from"./helpers/portal/portal.js";import{AlertDialog as a}from"./atoms/alert-dialog/alert-dialog.js";import{Icon as o}from"./atoms/icon/icon.js";import{Checkbox as s}from"./atoms/checkbox/checkbox.js";import{Combobox as c}from"./atoms/combobox/combobox.js";import{ContextMenu as l}from"./atoms/context-menu/context-menu.js";import{Dialog as u}from"./atoms/dialog/dialog.js";import{IconButton as d}from"./atoms/icon-button/icon-button.js";import{Input as f}from"./atoms/input/input.js";import{Radio as p,RadioGroup as m}from"./atoms/radio/radio.js";import{Switch as h}from"./atoms/switch/switch.js";import{Tabs as g,TabsList as _,TabsPanel as v,TabsTab as y}from"./atoms/tabs/tabs.js";import{Toast as b}from"./atoms/toast/toast.js";import{Tooltip as x,TooltipProvider as S}from"./atoms/tooltip/tooltip.js";import{ConditionGuard as C}from"./atoms/condition-guard/condition-guard.js";import"./atoms/index.js";import{AlertDialogContext as w,AlertDialogProvider as T,showAlertDialog as E}from"./providers/alert-dialog-provider/alert-dialog-provider.js";import{useAlertDialog as D}from"./providers/alert-dialog-provider/hooks.js";import{DialogContext as O,DialogProvider as k,showDialog as A}from"./providers/dialog-provider/dialog-provider.js";import{useDialog as j}from"./providers/dialog-provider/hooks.js";import{ToastProvider as M,toaster as N}from"./providers/toast-provider/toast-provider.js";import"./providers/index.js";import"./types.js";export{a as AlertDialog,w as AlertDialogContext,T as AlertDialogProvider,e as Button,s as Checkbox,c as Combobox,C as ConditionGuard,l as ContextMenu,u as Dialog,O as DialogContext,k as DialogProvider,o as Icon,d as IconButton,f as Input,i as Portal,r as PortalConfigProvider,p as Radio,m as RadioGroup,h as Switch,g as Tabs,_ as TabsList,v as TabsPanel,y as TabsTab,t as Text,b as Toast,M as ToastProvider,x as Tooltip,S as TooltipProvider,E as showAlertDialog,A as showDialog,N as toaster,D as useAlertDialog,j as useDialog,n as usePortalConfig};
+import{Button as e}from"./atoms/button/button.js";import{Text as t}from"./atoms/text/text.js";import{usePortalConfig as n}from"./helpers/portal/context/hooks.js";import{PortalConfigProvider as r}from"./helpers/portal/context/provider.js";import{Portal as i}from"./helpers/portal/portal.js";import{AlertDialog as a}from"./atoms/alert-dialog/alert-dialog.js";import{Avatar as o}from"./atoms/avatar/avatar.js";import{Icon as s}from"./atoms/icon/icon.js";import{Checkbox as c}from"./atoms/checkbox/checkbox.js";import{ClickableArea as l}from"./atoms/clickable-area/clickable-area.js";import{Collapsible as u}from"./atoms/collapsible/collapsible.js";import{Combobox as d}from"./atoms/combobox/combobox.js";import{ConditionGuard as f}from"./atoms/condition-guard/condition-guard.js";import{ContextMenu as p}from"./atoms/context-menu/context-menu.js";import{Dialog as m}from"./atoms/dialog/dialog.js";import{IconButton as h}from"./atoms/icon-button/icon-button.js";import{Input as g}from"./atoms/input/input.js";import{Flex as _}from"./helpers/flex/flex.js";import"./helpers/index.js";import{Menu as v}from"./atoms/menu/menu.js";import{Radio as y,RadioGroup as b}from"./atoms/radio/radio.js";import{Switch as x}from"./atoms/switch/switch.js";import{Tabs as S,TabsList as C,TabsPanel as w,TabsTab as T}from"./atoms/tabs/tabs.js";import{Toast as E}from"./atoms/toast/toast.js";import{Tooltip as D,TooltipProvider as O}from"./atoms/tooltip/tooltip.js";import"./atoms/index.js";import{AlertDialogContext as k,AlertDialogProvider as A,showAlertDialog as j}from"./providers/alert-dialog-provider/alert-dialog-provider.js";import{useAlertDialog as M}from"./providers/alert-dialog-provider/hooks.js";import{DialogContext as N,DialogProvider as P,showDialog as F}from"./providers/dialog-provider/dialog-provider.js";import{useDialog as I}from"./providers/dialog-provider/hooks.js";import{ToastProvider as L,toaster as R}from"./providers/toast-provider/toast-provider.js";import"./providers/index.js";import"./types.js";export{a as AlertDialog,k as AlertDialogContext,A as AlertDialogProvider,o as Avatar,e as Button,c as Checkbox,l as ClickableArea,u as Collapsible,d as Combobox,f as ConditionGuard,p as ContextMenu,m as Dialog,N as DialogContext,P as DialogProvider,_ as Flex,s as Icon,h as IconButton,g as Input,v as Menu,i as Portal,r as PortalConfigProvider,y as Radio,b as RadioGroup,x as Switch,S as Tabs,C as TabsList,w as TabsPanel,T as TabsTab,t as Text,E as Toast,L as ToastProvider,D as Tooltip,O as TooltipProvider,j as showAlertDialog,F as showDialog,R as toaster,M as useAlertDialog,I as useDialog,n as usePortalConfig};

package/dist/internals/base-button/base-button.css

@@ -1,262 +1 @@
-._4R_YnW_root {
-  box-sizing: border-box;
-  cursor: pointer;
-  user-select: none;
-  font-family: var(--typography-typeface-ltr);
-  font-weight: var(--typography-body-2-weight);
-  border-radius: var(--radius-full);
-  height: var(--btn-height);
-  padding: 0 var(--btn-padding-x);
-  font-size: var(--btn-font-size);
-  background-color: var(--btn-bg);
-  color: var(--btn-text);
-  border: none;
-  border: 1px solid var(--btn-border);
-  outline: none;
-  justify-content: center;
-  align-items: center;
-  text-decoration: none;
-  transition: background-color .2s, color .2s, border-color .2s, opacity .2s;
-  display: inline-flex;
-}
-
-._4R_YnW_root[data-size="sm"] {
-  --btn-height: 1.5rem;
-  --btn-icon-size: 1rem;
-  --btn-padding-x: var(--spacing-sm);
-  --btn-font-size: var(--typography-body-2-size);
-}
-
-._4R_YnW_root[data-size="md"] {
-  --btn-height: 2rem;
-  --btn-icon-size: 1.5rem;
-  --btn-padding-x: var(--spacing-md);
-  --btn-font-size: var(--typography-body-2-size);
-}
-
-._4R_YnW_root[data-size="lg"] {
-  --btn-height: 2.5rem;
-  --btn-icon-size: 2rem;
-  --btn-padding-x: var(--spacing-lg);
-  --btn-font-size: var(--typography-body-1-size);
-}
-
-._4R_YnW_root[data-fluid] {
-  width: 100%;
-}
-
-._4R_YnW_root:focus-visible {
-  outline-style: solid;
-  outline-width: var(--stroke-focus-ring);
-  outline-color: var(--color-action-info-base);
-  outline-offset: var(--spacing-xxs);
-}
-
-._4R_YnW_root[disabled], ._4R_YnW_root[data-disabled] {
-  cursor: not-allowed;
-  opacity: .5;
-}
-
-._4R_YnW_root[data-color="neutral"][data-variant="filled"] {
-  --btn-bg: var(--color-action-neutral-base);
-  --btn-text: var(--color-on-neutral);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="neutral"][data-variant="filled"]:hover:not([disabled]) {
-  --btn-bg: var(--color-action-neutral-hover);
-}
-
-._4R_YnW_root[data-color="neutral"][data-variant="filled"]:active:not([disabled]) {
-  --btn-bg: var(--color-action-neutral-active);
-}
-
-._4R_YnW_root[data-color="neutral"][data-variant="outlined"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-neutral-base);
-  --btn-border: var(--color-content-neutral-base);
-}
-
-._4R_YnW_root[data-color="neutral"][data-variant="outlined"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="neutral"][data-variant="ghost"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-neutral-base);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="neutral"][data-variant="ghost"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="brand"][data-variant="filled"] {
-  --btn-bg: var(--color-action-brand-base);
-  --btn-text: var(--color-on-brand);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="brand"][data-variant="filled"]:hover:not([disabled]) {
-  --btn-bg: var(--color-action-brand-hover);
-}
-
-._4R_YnW_root[data-color="brand"][data-variant="filled"]:active:not([disabled]) {
-  --btn-bg: var(--color-action-brand-active);
-}
-
-._4R_YnW_root[data-color="brand"][data-variant="outlined"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-brand-base);
-  --btn-border: var(--color-content-brand-base);
-}
-
-._4R_YnW_root[data-color="brand"][data-variant="outlined"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="brand"][data-variant="ghost"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-brand-base);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="brand"][data-variant="ghost"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="positive"][data-variant="filled"] {
-  --btn-bg: var(--color-action-positive-base);
-  --btn-text: var(--color-on-positive);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="positive"][data-variant="filled"]:hover:not([disabled]) {
-  --btn-bg: var(--color-action-positive-hover);
-}
-
-._4R_YnW_root[data-color="positive"][data-variant="filled"]:active:not([disabled]) {
-  --btn-bg: var(--color-action-positive-active);
-}
-
-._4R_YnW_root[data-color="positive"][data-variant="outlined"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-positive-base);
-  --btn-border: var(--color-content-positive-base);
-}
-
-._4R_YnW_root[data-color="positive"][data-variant="outlined"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="positive"][data-variant="ghost"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-positive-base);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="positive"][data-variant="ghost"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="negative"][data-variant="filled"] {
-  --btn-bg: var(--color-action-negative-base);
-  --btn-text: var(--color-on-negative);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="negative"][data-variant="filled"]:hover:not([disabled]) {
-  --btn-bg: var(--color-action-negative-hover);
-}
-
-._4R_YnW_root[data-color="negative"][data-variant="filled"]:active:not([disabled]) {
-  --btn-bg: var(--color-action-negative-active);
-}
-
-._4R_YnW_root[data-color="negative"][data-variant="outlined"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-negative-base);
-  --btn-border: var(--color-content-negative-base);
-}
-
-._4R_YnW_root[data-color="negative"][data-variant="outlined"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="negative"][data-variant="ghost"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-negative-base);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="negative"][data-variant="ghost"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="warn"][data-variant="filled"] {
-  --btn-bg: var(--color-action-warn-base);
-  --btn-text: var(--color-on-warn);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="warn"][data-variant="filled"]:hover:not([disabled]) {
-  --btn-bg: var(--color-action-warn-hover);
-}
-
-._4R_YnW_root[data-color="warn"][data-variant="filled"]:active:not([disabled]) {
-  --btn-bg: var(--color-action-warn-active);
-}
-
-._4R_YnW_root[data-color="warn"][data-variant="outlined"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-warn-base);
-  --btn-border: var(--color-content-warn-base);
-}
-
-._4R_YnW_root[data-color="warn"][data-variant="outlined"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="warn"][data-variant="ghost"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-warn-base);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="warn"][data-variant="ghost"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="info"][data-variant="filled"] {
-  --btn-bg: var(--color-action-info-base);
-  --btn-text: var(--color-on-info);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="info"][data-variant="filled"]:hover:not([disabled]) {
-  --btn-bg: var(--color-action-info-hover);
-}
-
-._4R_YnW_root[data-color="info"][data-variant="filled"]:active:not([disabled]) {
-  --btn-bg: var(--color-action-info-active);
-}
-
-._4R_YnW_root[data-color="info"][data-variant="outlined"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-info-base);
-  --btn-border: var(--color-content-info-base);
-}
-
-._4R_YnW_root[data-color="info"][data-variant="outlined"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
-
-._4R_YnW_root[data-color="info"][data-variant="ghost"] {
-  --btn-bg: transparent;
-  --btn-text: var(--color-content-info-base);
-  --btn-border: transparent;
-}
-
-._4R_YnW_root[data-color="info"][data-variant="ghost"]:hover:not([disabled]) {
-  --btn-bg: var(--color-surface-secondary);
-}
+._4R_YnW_root{box-sizing:border-box;cursor:pointer;user-select:none;font-family:var(--typography-typeface-ltr);font-weight:var(--typography-body-2-weight);border-radius:var(--radius-md);height:var(--btn-height);padding:0 var(--btn-padding-x);font-size:var(--btn-font-size);background-color:var(--btn-bg);color:var(--btn-text);border:none;border:1px solid var(--btn-border);outline:none;justify-content:center;align-items:center;text-decoration:none;transition:background-color .2s,color .2s,border-color .2s,opacity .2s;display:inline-flex}._4R_YnW_root[data-size=sm]{--btn-height:1.5rem;--btn-icon-size:1rem;--btn-padding-x:var(--spacing-sm);--btn-font-size:var(--typography-body-2-size)}._4R_YnW_root[data-size=md]{--btn-height:2rem;--btn-icon-size:1.5rem;--btn-padding-x:var(--spacing-md);--btn-font-size:var(--typography-body-2-size)}._4R_YnW_root[data-size=lg]{--btn-height:2.5rem;--btn-icon-size:2rem;--btn-padding-x:var(--spacing-lg);--btn-font-size:var(--typography-body-1-size)}._4R_YnW_root[data-fluid]{width:100%}._4R_YnW_root:focus-visible{outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}._4R_YnW_root[disabled],._4R_YnW_root[data-disabled]{cursor:not-allowed;opacity:.5}._4R_YnW_root[data-color=neutral][data-variant=filled]{--btn-bg:var(--color-action-neutral-base);--btn-text:var(--color-on-neutral);--btn-border:transparent}._4R_YnW_root[data-color=neutral][data-variant=filled]:hover:not([disabled]){--btn-bg:var(--color-action-neutral-hover)}._4R_YnW_root[data-color=neutral][data-variant=filled]:active:not([disabled]){--btn-bg:var(--color-action-neutral-active)}._4R_YnW_root[data-color=neutral][data-variant=outlined]{--btn-bg:transparent;--btn-text:var(--color-content-neutral-base);--btn-border:var(--color-content-neutral-base)}._4R_YnW_root[data-color=neutral][data-variant=outlined]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=neutral][data-variant=ghost]{--btn-bg:transparent;--btn-text:var(--color-content-neutral-base);--btn-border:transparent}._4R_YnW_root[data-color=neutral][data-variant=ghost]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=brand][data-variant=filled]{--btn-bg:var(--color-action-brand-base);--btn-text:var(--color-on-brand);--btn-border:transparent}._4R_YnW_root[data-color=brand][data-variant=filled]:hover:not([disabled]){--btn-bg:var(--color-action-brand-hover)}._4R_YnW_root[data-color=brand][data-variant=filled]:active:not([disabled]){--btn-bg:var(--color-action-brand-active)}._4R_YnW_root[data-color=brand][data-variant=outlined]{--btn-bg:transparent;--btn-text:var(--color-content-brand-base);--btn-border:var(--color-content-brand-base)}._4R_YnW_root[data-color=brand][data-variant=outlined]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=brand][data-variant=ghost]{--btn-bg:transparent;--btn-text:var(--color-content-brand-base);--btn-border:transparent}._4R_YnW_root[data-color=brand][data-variant=ghost]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=positive][data-variant=filled]{--btn-bg:var(--color-action-positive-base);--btn-text:var(--color-on-positive);--btn-border:transparent}._4R_YnW_root[data-color=positive][data-variant=filled]:hover:not([disabled]){--btn-bg:var(--color-action-positive-hover)}._4R_YnW_root[data-color=positive][data-variant=filled]:active:not([disabled]){--btn-bg:var(--color-action-positive-active)}._4R_YnW_root[data-color=positive][data-variant=outlined]{--btn-bg:transparent;--btn-text:var(--color-content-positive-base);--btn-border:var(--color-content-positive-base)}._4R_YnW_root[data-color=positive][data-variant=outlined]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=positive][data-variant=ghost]{--btn-bg:transparent;--btn-text:var(--color-content-positive-base);--btn-border:transparent}._4R_YnW_root[data-color=positive][data-variant=ghost]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=negative][data-variant=filled]{--btn-bg:var(--color-action-negative-base);--btn-text:var(--color-on-negative);--btn-border:transparent}._4R_YnW_root[data-color=negative][data-variant=filled]:hover:not([disabled]){--btn-bg:var(--color-action-negative-hover)}._4R_YnW_root[data-color=negative][data-variant=filled]:active:not([disabled]){--btn-bg:var(--color-action-negative-active)}._4R_YnW_root[data-color=negative][data-variant=outlined]{--btn-bg:transparent;--btn-text:var(--color-content-negative-base);--btn-border:var(--color-content-negative-base)}._4R_YnW_root[data-color=negative][data-variant=outlined]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=negative][data-variant=ghost]{--btn-bg:transparent;--btn-text:var(--color-content-negative-base);--btn-border:transparent}._4R_YnW_root[data-color=negative][data-variant=ghost]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=warn][data-variant=filled]{--btn-bg:var(--color-action-warn-base);--btn-text:var(--color-on-warn);--btn-border:transparent}._4R_YnW_root[data-color=warn][data-variant=filled]:hover:not([disabled]){--btn-bg:var(--color-action-warn-hover)}._4R_YnW_root[data-color=warn][data-variant=filled]:active:not([disabled]){--btn-bg:var(--color-action-warn-active)}._4R_YnW_root[data-color=warn][data-variant=outlined]{--btn-bg:transparent;--btn-text:var(--color-content-warn-base);--btn-border:var(--color-content-warn-base)}._4R_YnW_root[data-color=warn][data-variant=outlined]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=warn][data-variant=ghost]{--btn-bg:transparent;--btn-text:var(--color-content-warn-base);--btn-border:transparent}._4R_YnW_root[data-color=warn][data-variant=ghost]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=info][data-variant=filled]{--btn-bg:var(--color-action-info-base);--btn-text:var(--color-on-info);--btn-border:transparent}._4R_YnW_root[data-color=info][data-variant=filled]:hover:not([disabled]){--btn-bg:var(--color-action-info-hover)}._4R_YnW_root[data-color=info][data-variant=filled]:active:not([disabled]){--btn-bg:var(--color-action-info-active)}._4R_YnW_root[data-color=info][data-variant=outlined]{--btn-bg:transparent;--btn-text:var(--color-content-info-base);--btn-border:var(--color-content-info-base)}._4R_YnW_root[data-color=info][data-variant=outlined]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}._4R_YnW_root[data-color=info][data-variant=ghost]{--btn-bg:transparent;--btn-text:var(--color-content-info-base);--btn-border:transparent}._4R_YnW_root[data-color=info][data-variant=ghost]:hover:not([disabled]){--btn-bg:var(--color-surface-secondary)}

package/dist/internals/base-button/base-button.d.ts

@@ -1,8 +1,8 @@
-import * as React from "react";
+import * as React$1 from "react";
 import { Button } from "@base-ui/react/button";
 
 //#region src/internals/base-button/base-button.d.ts
-interface BaseButtonProps extends React.ComponentPropsWithoutRef<typeof Button> {
+interface BaseButtonProps extends React$1.ComponentPropsWithoutRef<typeof Button> {
   /** The visual style of the button. */
   variant?: "filled" | "outlined" | "ghost";
   /** The semantic color palette applied to the button. */

package/dist/internals/base-button/base-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"base-button.js","names":["BaseUIButton","styles"],"sources":["../../../src/internals/base-button/base-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Button as BaseUIButton } from \"@base-ui/react/button\";\nimport styles from \"./base-button.module.css\";\n\nexport interface BaseButtonProps extends React.ComponentPropsWithoutRef<\n  typeof BaseUIButton\n> {\n  /** The visual style of the button. */\n  variant?: \"filled\" | \"outlined\" | \"ghost\";\n  /** The semantic color palette applied to the button. */\n  color?: \"neutral\" | \"brand\" | \"positive\" | \"negative\" | \"warn\" | \"info\";\n  /** The size of the button, affecting height, padding, and font size. */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /** If true, the button is in a loading state and becomes disabled. */\n  pending?: boolean;\n  /** If true, the button will take up 100% of its container's width. */\n  fluid?: boolean;\n}\n\nexport const BaseButton = React.forwardRef<HTMLButtonElement, BaseButtonProps>(\n  (props, ref) => {\n    const {\n      className,\n      variant = \"filled\",\n      color = \"neutral\",\n      size = \"md\",\n      pending = false,\n      fluid = false,\n      disabled,\n      children,\n      ...rest\n    } = props;\n\n    return (\n      <BaseUIButton\n        ref={ref}\n        className={`${styles[\"root\"]} ${className || \"\"}`.trim()}\n        data-variant={variant}\n        data-color={color}\n        data-size={size}\n        data-pending={pending ? \"\" : undefined}\n        data-fluid={fluid ? \"\" : undefined}\n        disabled={disabled || pending}\n        {...rest}\n      >\n        {children}\n      </BaseUIButton>\n    );\n  },\n);\n"],"mappings":"sJAmBA,MAAa,EAAa,EAAM,YAC7B,EAAO,IAAQ,CACd,GAAM,CACJ,YACA,UAAU,SACV,QAAQ,UACR,OAAO,KACP,UAAU,GACV,QAAQ,GACR,WACA,WACA,GAAG,GACD,EAEJ,OACE,EAACA,EAAD,CACO,MACL,UAAW,GAAGC,EAAO,KAAQ,GAAG,GAAa,KAAK,KAAK,EACvD,eAAc,EACd,aAAY,EACZ,YAAW,EACX,eAAc,EAAU,GAAK,IAAA,GAC7B,aAAY,EAAQ,GAAK,IAAA,GACzB,SAAU,GAAY,EACtB,GAAI,EAEH,UACW,CAAA,CAElB,CACF"}
+{"version":3,"file":"base-button.js","names":["React","BaseUIButton","styles"],"sources":["../../../src/internals/base-button/base-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Button as BaseUIButton } from \"@base-ui/react/button\";\nimport styles from \"./base-button.module.css\";\n\nexport interface BaseButtonProps extends React.ComponentPropsWithoutRef<\n  typeof BaseUIButton\n> {\n  /** The visual style of the button. */\n  variant?: \"filled\" | \"outlined\" | \"ghost\";\n  /** The semantic color palette applied to the button. */\n  color?: \"neutral\" | \"brand\" | \"positive\" | \"negative\" | \"warn\" | \"info\";\n  /** The size of the button, affecting height, padding, and font size. */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /** If true, the button is in a loading state and becomes disabled. */\n  pending?: boolean;\n  /** If true, the button will take up 100% of its container's width. */\n  fluid?: boolean;\n}\n\nexport const BaseButton = React.forwardRef<HTMLButtonElement, BaseButtonProps>(\n  (props, ref) => {\n    const {\n      className,\n      variant = \"filled\",\n      color = \"neutral\",\n      size = \"md\",\n      pending = false,\n      fluid = false,\n      disabled,\n      children,\n      ...rest\n    } = props;\n\n    return (\n      <BaseUIButton\n        ref={ref}\n        className={`${styles[\"root\"]} ${className || \"\"}`.trim()}\n        data-variant={variant}\n        data-color={color}\n        data-size={size}\n        data-pending={pending ? \"\" : undefined}\n        data-fluid={fluid ? \"\" : undefined}\n        disabled={disabled || pending}\n        {...rest}\n      >\n        {children}\n      </BaseUIButton>\n    );\n  },\n);\n"],"mappings":"sJAmBA,MAAa,EAAaA,EAAM,YAC7B,EAAO,IAAQ,CACd,GAAM,CACJ,YACA,UAAU,SACV,QAAQ,UACR,OAAO,KACP,UAAU,GACV,QAAQ,GACR,WACA,WACA,GAAG,GACD,EAEJ,OACE,EAACC,EAAD,CACO,MACL,UAAW,GAAGC,EAAO,KAAQ,GAAG,GAAa,KAAK,KAAK,EACvD,eAAc,EACd,aAAY,EACZ,YAAW,EACX,eAAc,EAAU,GAAK,IAAA,GAC7B,aAAY,EAAQ,GAAK,IAAA,GACzB,SAAU,GAAY,EACtB,GAAI,EAEH,UACW,CAAA,CAElB,CACF"}

package/dist/internals/base-button/base-button.module.js

@@ -1,2 +1,3 @@
+import './base-button.css';
 var e={root:`_4R_YnW_root`};export{e as default};
 //# sourceMappingURL=base-button.module.js.map

package/dist/internals/base-button/base-button.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"base-button.module.js","names":[],"sources":["../../../src/internals/base-button/base-button.module.css"],"sourcesContent":[".root {\n  /* 1. Map internal variables to CSS properties */\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  outline: none;\n  border: none;\n  cursor: pointer;\n  user-select: none;\n  text-decoration: none;\n  font-family: var(--typography-typeface-ltr);\n  font-weight: var(--typography-body-2-weight);\n  border-radius: var(--radius-full);\n  transition:\n    background-color 0.2s,\n    color 0.2s,\n    border-color 0.2s,\n    opacity 0.2s;\n\n  /* Apply local variables */\n  height: var(--btn-height);\n  padding: 0 var(--btn-padding-x);\n  font-size: var(--btn-font-size);\n  background-color: var(--btn-bg);\n  color: var(--btn-text);\n  border: 1px solid var(--btn-border);\n}\n\n/* --- Sizes --- */\n.root[data-size=\"sm\"] {\n  --btn-height: 1.5rem;\n  --btn-icon-size: 1rem;\n  --btn-padding-x: var(--spacing-sm);\n  --btn-font-size: var(--typography-body-2-size);\n}\n\n.root[data-size=\"md\"] {\n  --btn-height: 2rem;\n  --btn-icon-size: 1.5rem;\n  --btn-padding-x: var(--spacing-md);\n  --btn-font-size: var(--typography-body-2-size);\n}\n\n.root[data-size=\"lg\"] {\n  --btn-height: 2.5rem;\n  --btn-icon-size: 2rem;\n  --btn-padding-x: var(--spacing-lg);\n  --btn-font-size: var(--typography-body-1-size);\n}\n\n/* --- Layout Modifiers --- */\n.root[data-fluid] {\n  width: 100%;\n}\n\n/* --- Focus Ring (Base UI provides data-focus-visible) --- */\n.root:focus-visible {\n  outline-style: solid;\n  outline-width: var(--stroke-focus-ring);\n  outline-color: var(--color-action-info-base);\n  outline-offset: var(--spacing-xxs);\n}\n\n/* --- Disabled State --- */\n.root[disabled],\n.root[data-disabled] {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/* --- Variants & Colors: BRAND Example --- */\n/* (You would duplicate this block for neutral, positive, negative, etc.) */\n\n/* Brand Filled */\n.root[data-color=\"brand\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-brand-base);\n  --btn-text: var(--color-on-brand);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-brand-hover);\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-brand-active);\n}\n\n/* Brand Outlined */\n.root[data-color=\"brand\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: var(--color-content-brand-base);\n}\n.root[data-color=\"brand\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Brand Ghost */\n.root[data-color=\"brand\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* --- Variants & Colors --- */\n\n/* Neutral Filled */\n.root[data-color=\"neutral\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-neutral-base);\n  --btn-text: var(--color-on-neutral);\n  --btn-border: transparent;\n}\n.root[data-color=\"neutral\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-neutral-hover);\n}\n.root[data-color=\"neutral\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-neutral-active);\n}\n\n/* Neutral Outlined */\n.root[data-color=\"neutral\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-neutral-base);\n  --btn-border: var(--color-content-neutral-base);\n}\n.root[data-color=\"neutral\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Neutral Ghost */\n.root[data-color=\"neutral\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-neutral-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"neutral\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Brand Filled */\n.root[data-color=\"brand\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-brand-base);\n  --btn-text: var(--color-on-brand);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-brand-hover);\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-brand-active);\n}\n\n/* Brand Outlined */\n.root[data-color=\"brand\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: var(--color-content-brand-base);\n}\n.root[data-color=\"brand\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Brand Ghost */\n.root[data-color=\"brand\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Positive Filled */\n.root[data-color=\"positive\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-positive-base);\n  --btn-text: var(--color-on-positive);\n  --btn-border: transparent;\n}\n.root[data-color=\"positive\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-positive-hover);\n}\n.root[data-color=\"positive\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-positive-active);\n}\n\n/* Positive Outlined */\n.root[data-color=\"positive\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-positive-base);\n  --btn-border: var(--color-content-positive-base);\n}\n.root[data-color=\"positive\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Positive Ghost */\n.root[data-color=\"positive\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-positive-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"positive\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Negative Filled */\n.root[data-color=\"negative\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-negative-base);\n  --btn-text: var(--color-on-negative);\n  --btn-border: transparent;\n}\n.root[data-color=\"negative\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-negative-hover);\n}\n.root[data-color=\"negative\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-negative-active);\n}\n\n/* Negative Outlined */\n.root[data-color=\"negative\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-negative-base);\n  --btn-border: var(--color-content-negative-base);\n}\n.root[data-color=\"negative\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Negative Ghost */\n.root[data-color=\"negative\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-negative-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"negative\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Warn Filled */\n.root[data-color=\"warn\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-warn-base);\n  --btn-text: var(--color-on-warn);\n  --btn-border: transparent;\n}\n.root[data-color=\"warn\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-warn-hover);\n}\n.root[data-color=\"warn\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-warn-active);\n}\n\n/* Warn Outlined */\n.root[data-color=\"warn\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-warn-base);\n  --btn-border: var(--color-content-warn-base);\n}\n.root[data-color=\"warn\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Warn Ghost */\n.root[data-color=\"warn\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-warn-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"warn\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Info Filled */\n.root[data-color=\"info\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-info-base);\n  --btn-text: var(--color-on-info);\n  --btn-border: transparent;\n}\n.root[data-color=\"info\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-info-hover);\n}\n.root[data-color=\"info\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-info-active);\n}\n\n/* Info Outlined */\n.root[data-color=\"info\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-info-base);\n  --btn-border: var(--color-content-info-base);\n}\n.root[data-color=\"info\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Info Ghost */\n.root[data-color=\"info\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-info-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"info\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n"],"mappings":"AAEA,IAAA,EAAU,CAAA,KAAO,cAAA"}
+{"version":3,"file":"base-button.module.js","names":[],"sources":["../../../src/internals/base-button/base-button.module.css"],"sourcesContent":[".root {\n  /* 1. Map internal variables to CSS properties */\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  outline: none;\n  border: none;\n  cursor: pointer;\n  user-select: none;\n  text-decoration: none;\n  font-family: var(--typography-typeface-ltr);\n  font-weight: var(--typography-body-2-weight);\n  border-radius: var(--radius-md);\n  transition:\n    background-color 0.2s,\n    color 0.2s,\n    border-color 0.2s,\n    opacity 0.2s;\n\n  /* Apply local variables */\n  height: var(--btn-height);\n  padding: 0 var(--btn-padding-x);\n  font-size: var(--btn-font-size);\n  background-color: var(--btn-bg);\n  color: var(--btn-text);\n  border: 1px solid var(--btn-border);\n}\n\n/* --- Sizes --- */\n.root[data-size=\"sm\"] {\n  --btn-height: 1.5rem;\n  --btn-icon-size: 1rem;\n  --btn-padding-x: var(--spacing-sm);\n  --btn-font-size: var(--typography-body-2-size);\n}\n\n.root[data-size=\"md\"] {\n  --btn-height: 2rem;\n  --btn-icon-size: 1.5rem;\n  --btn-padding-x: var(--spacing-md);\n  --btn-font-size: var(--typography-body-2-size);\n}\n\n.root[data-size=\"lg\"] {\n  --btn-height: 2.5rem;\n  --btn-icon-size: 2rem;\n  --btn-padding-x: var(--spacing-lg);\n  --btn-font-size: var(--typography-body-1-size);\n}\n\n/* --- Layout Modifiers --- */\n.root[data-fluid] {\n  width: 100%;\n}\n\n/* --- Focus Ring (Base UI provides data-focus-visible) --- */\n.root:focus-visible {\n  outline-style: solid;\n  outline-width: var(--stroke-focus-ring);\n  outline-color: var(--color-action-info-base);\n  outline-offset: var(--spacing-xxs);\n}\n\n/* --- Disabled State --- */\n.root[disabled],\n.root[data-disabled] {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/* --- Variants & Colors: BRAND Example --- */\n/* (You would duplicate this block for neutral, positive, negative, etc.) */\n\n/* Brand Filled */\n.root[data-color=\"brand\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-brand-base);\n  --btn-text: var(--color-on-brand);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-brand-hover);\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-brand-active);\n}\n\n/* Brand Outlined */\n.root[data-color=\"brand\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: var(--color-content-brand-base);\n}\n.root[data-color=\"brand\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Brand Ghost */\n.root[data-color=\"brand\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* --- Variants & Colors --- */\n\n/* Neutral Filled */\n.root[data-color=\"neutral\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-neutral-base);\n  --btn-text: var(--color-on-neutral);\n  --btn-border: transparent;\n}\n.root[data-color=\"neutral\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-neutral-hover);\n}\n.root[data-color=\"neutral\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-neutral-active);\n}\n\n/* Neutral Outlined */\n.root[data-color=\"neutral\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-neutral-base);\n  --btn-border: var(--color-content-neutral-base);\n}\n.root[data-color=\"neutral\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Neutral Ghost */\n.root[data-color=\"neutral\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-neutral-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"neutral\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Brand Filled */\n.root[data-color=\"brand\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-brand-base);\n  --btn-text: var(--color-on-brand);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-brand-hover);\n}\n.root[data-color=\"brand\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-brand-active);\n}\n\n/* Brand Outlined */\n.root[data-color=\"brand\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: var(--color-content-brand-base);\n}\n.root[data-color=\"brand\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Brand Ghost */\n.root[data-color=\"brand\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-brand-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"brand\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Positive Filled */\n.root[data-color=\"positive\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-positive-base);\n  --btn-text: var(--color-on-positive);\n  --btn-border: transparent;\n}\n.root[data-color=\"positive\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-positive-hover);\n}\n.root[data-color=\"positive\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-positive-active);\n}\n\n/* Positive Outlined */\n.root[data-color=\"positive\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-positive-base);\n  --btn-border: var(--color-content-positive-base);\n}\n.root[data-color=\"positive\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Positive Ghost */\n.root[data-color=\"positive\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-positive-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"positive\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Negative Filled */\n.root[data-color=\"negative\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-negative-base);\n  --btn-text: var(--color-on-negative);\n  --btn-border: transparent;\n}\n.root[data-color=\"negative\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-negative-hover);\n}\n.root[data-color=\"negative\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-negative-active);\n}\n\n/* Negative Outlined */\n.root[data-color=\"negative\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-negative-base);\n  --btn-border: var(--color-content-negative-base);\n}\n.root[data-color=\"negative\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Negative Ghost */\n.root[data-color=\"negative\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-negative-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"negative\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Warn Filled */\n.root[data-color=\"warn\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-warn-base);\n  --btn-text: var(--color-on-warn);\n  --btn-border: transparent;\n}\n.root[data-color=\"warn\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-warn-hover);\n}\n.root[data-color=\"warn\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-warn-active);\n}\n\n/* Warn Outlined */\n.root[data-color=\"warn\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-warn-base);\n  --btn-border: var(--color-content-warn-base);\n}\n.root[data-color=\"warn\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Warn Ghost */\n.root[data-color=\"warn\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-warn-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"warn\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Info Filled */\n.root[data-color=\"info\"][data-variant=\"filled\"] {\n  --btn-bg: var(--color-action-info-base);\n  --btn-text: var(--color-on-info);\n  --btn-border: transparent;\n}\n.root[data-color=\"info\"][data-variant=\"filled\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-action-info-hover);\n}\n.root[data-color=\"info\"][data-variant=\"filled\"]:active:not([disabled]) {\n  --btn-bg: var(--color-action-info-active);\n}\n\n/* Info Outlined */\n.root[data-color=\"info\"][data-variant=\"outlined\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-info-base);\n  --btn-border: var(--color-content-info-base);\n}\n.root[data-color=\"info\"][data-variant=\"outlined\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n\n/* Info Ghost */\n.root[data-color=\"info\"][data-variant=\"ghost\"] {\n  --btn-bg: transparent;\n  --btn-text: var(--color-content-info-base);\n  --btn-border: transparent;\n}\n.root[data-color=\"info\"][data-variant=\"ghost\"]:hover:not([disabled]) {\n  --btn-bg: var(--color-surface-secondary);\n}\n"],"mappings":""}

package/dist/internals/base-dialog/base-dialog.css

@@ -1,74 +1 @@
-._9nsqjG_backdrop {
-  background-color: var(--color-surface-backdrop-overlay);
-  backdrop-filter: blur(.5rem);
-  z-index: 1000;
-  transition: opacity .2s;
-  position: fixed;
-  inset: 0;
-
-  &[data-starting-style], &[data-ending-style] {
-    opacity: 0;
-  }
-}
-
-._9nsqjG_popup {
-  --background: var(--color-surface-base);
-  --foreground: var(--color-content-neutral-base);
-  --border: var(--color-border-primary);
-  z-index: 1010;
-  box-sizing: border-box;
-  background-color: var(--background);
-  width: calc(100vw - 2rem);
-  max-width: 28rem;
-  color: var(--foreground);
-  border: 1px solid var(--border);
-  border-radius: var(--spacing-sm);
-  padding: var(--spacing-xl);
-  gap: var(--spacing-md);
-  flex-direction: column;
-  transition: opacity .2s cubic-bezier(.22, 1, .36, 1), transform .2s cubic-bezier(.22, 1, .36, 1);
-  display: flex;
-  position: fixed;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-
-  &[data-starting-style], &[data-ending-style] {
-    opacity: 0;
-    transform: translate(-50%, -46%);
-  }
-
-  &:focus-visible {
-    outline-style: solid;
-    outline-width: var(--stroke-focus-ring);
-    outline-color: var(--color-action-info-base);
-    outline-offset: var(--spacing-xxs);
-  }
-
-  &[data-variant="neutral"] {
-    --border: var(--color-action-neutral-muted);
-  }
-
-  &[data-variant="positive"] {
-    --border: var(--color-action-positive-muted);
-  }
-
-  &[data-variant="negative"] {
-    --border: var(--color-action-negative-muted);
-  }
-
-  &[data-variant="warn"] {
-    --border: var(--color-action-warn-muted);
-  }
-
-  &[data-variant="info"] {
-    --border: var(--color-action-info-muted);
-  }
-}
-
-._9nsqjG_actions {
-  justify-content: flex-end;
-  gap: var(--spacing-sm);
-  margin-top: var(--spacing-xs);
-  display: flex;
-}
+._9nsqjG_backdrop{background-color:var(--color-surface-backdrop-overlay);backdrop-filter:blur(.5rem);z-index:1000;transition:opacity .2s;position:fixed;inset:0;&[data-starting-style],&[data-ending-style]{opacity:0}}._9nsqjG_popup{--background:var(--color-surface-base);--foreground:var(--color-content-neutral-base);--border:var(--color-border-primary);z-index:1010;box-sizing:border-box;background-color:var(--background);width:calc(100vw - 2rem);max-width:28rem;color:var(--foreground);border:1px solid var(--border);border-radius:var(--spacing-sm);padding:var(--spacing-xl);gap:var(--spacing-md);flex-direction:column;transition:opacity .2s cubic-bezier(.22,1,.36,1),transform .2s cubic-bezier(.22,1,.36,1);display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);&[data-starting-style],&[data-ending-style]{opacity:0;transform:translate(-50%,-46%)}&:focus-visible{outline-style:solid;outline-width:var(--stroke-focus-ring);outline-color:var(--color-action-info-base);outline-offset:var(--spacing-xxs)}&[data-variant=neutral]{--border:var(--color-action-neutral-muted)}&[data-variant=positive]{--border:var(--color-action-positive-muted)}&[data-variant=negative]{--border:var(--color-action-negative-muted)}&[data-variant=warn]{--border:var(--color-action-warn-muted)}&[data-variant=info]{--border:var(--color-action-info-muted)}}._9nsqjG_actions{justify-content:flex-end;gap:var(--spacing-sm);margin-top:var(--spacing-xs);display:flex}

package/dist/internals/base-dialog/base-dialog.module.js

@@ -1,2 +1,3 @@
+import './base-dialog.css';
 var e={actions:`_9nsqjG_actions`,backdrop:`_9nsqjG_backdrop`,popup:`_9nsqjG_popup`};export{e as default};
 //# sourceMappingURL=base-dialog.module.js.map