@optiaxiom/react 0.1.0-next.9 → 0.1.0

package/dist/src/autocomplete-item/AutocompletItem.js

@@ -0,0 +1,37 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { useAutocompleteContext } from '../autocomplete-context/AutocompleteContext.js';
+import { useAutocompleteListContext } from '../autocomplete-list-context/AutocompleteListContext.js';
+import { Flex } from '../flex/Flex.js';
+import { Icon } from '../icon/Icon.js';
+import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
+import '../sprinkles/sprinkles.js';
+import '../sprinkles/sprinklesMerge.js';
+import '../utils/conditions.js';
+import { fallbackSpan } from '../utils/fallbackSpan.js';
+import { item } from './AutocompleteItem-css.js';
+
+const AutocompleteItem = forwardRef(({ addonBefore, children, ...props }, ref) => {
+  const { restProps, sprinkleProps } = extractSprinkles(props);
+  const { downshift, highlightedItem } = useAutocompleteContext("AutocompleteItem");
+  const { item: item$1 } = useAutocompleteListContext("AutocompleteItem");
+  const itemProps = downshift.getItemProps({ item: item$1 });
+  return /* @__PURE__ */ jsx(Flex, { asChild: true, ...item(), ...sprinkleProps, children: /* @__PURE__ */ jsxs(
+    "li",
+    {
+      "data-disabled": itemProps["aria-disabled"] ? "" : void 0,
+      "data-highlighted": highlightedItem === item$1 ? "" : void 0,
+      "data-selected": downshift.selectedItem === item$1 ? "" : void 0,
+      ref,
+      ...restProps,
+      ...itemProps,
+      children: [
+        addonBefore && /* @__PURE__ */ jsx(Icon, { children: fallbackSpan(addonBefore) }),
+        children
+      ]
+    }
+  ) });
+});
+AutocompleteItem.displayName = "@optiaxiom/react/AutocompleteItem";
+
+export { AutocompleteItem };

package/dist/src/autocomplete-item/AutocompleteItem-css.js

@@ -0,0 +1,7 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/autocomplete-item/AutocompleteItem.css.ts.vanilla-iI5UGzA4.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var item = recipeRuntime({base:[{alignItems:'center',display:'flex',flexDirection:'row',fontSize:'md',gap:'xs',justifyContent:'space-between',p:'xs',rounded:'sm'},'_1vdooap']});
+
+export { item };

package/dist/src/autocomplete-item-indicator/AutocompleteItemIndicator.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { useAutocompleteListContext } from '../autocomplete-list-context/AutocompleteListContext.js';
+import { IconCheck } from '../icons/IconCheck.js';
+
+const AutocompleteItemIndicator = forwardRef(({ ...props }, ref) => {
+  const { active } = useAutocompleteListContext("AutocompleteItemIndicator");
+  if (!active) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(IconCheck, { ref, ...props });
+});
+AutocompleteItemIndicator.displayName = "@optiaxiom/react/AutocompleteItemIndicator";
+
+export { AutocompleteItemIndicator };

package/dist/src/autocomplete-list/AutocompleteList.js

@@ -0,0 +1,19 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { useAutocompleteContext } from '../autocomplete-context/AutocompleteContext.js';
+import { AutocompleteListContextProvider } from '../autocomplete-list-context/AutocompleteListContext.js';
+
+function AutocompleteList({ children }) {
+  const { downshift, items, itemToKey } = useAutocompleteContext("AutocompleteList");
+  return /* @__PURE__ */ jsx(Fragment, { children: items.map((item) => /* @__PURE__ */ jsx(
+    AutocompleteListContextProvider,
+    {
+      active: downshift.selectedItem === item,
+      item,
+      children: children(item)
+    },
+    itemToKey(item)
+  )) });
+}
+AutocompleteList.displayName = "@optiaxiom/react/AutocompleteList";
+
+export { AutocompleteList };

package/dist/src/autocomplete-list-context/AutocompleteListContext.js

@@ -0,0 +1,5 @@
+import { createContext } from '@radix-ui/react-context';
+
+const [AutocompleteListContextProvider, useAutocompleteListContext] = createContext("AutocompleteList");
+
+export { AutocompleteListContextProvider, useAutocompleteListContext };

package/dist/src/autocomplete-trigger/AutocompleteTrigger.js

@@ -0,0 +1,33 @@
+import { jsx } from 'react/jsx-runtime';
+import { PopoverAnchor, PopoverTrigger } from '@radix-ui/react-popover';
+import { forwardRef } from 'react';
+import { useAutocompleteContext } from '../autocomplete-context/AutocompleteContext.js';
+import { SearchInput } from '../search-input/SearchInput.js';
+import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
+import '../sprinkles/sprinkles.js';
+import '../sprinkles/sprinklesMerge.js';
+
+const AutocompleteTrigger = forwardRef(({ ...props }, ref) => {
+  const { restProps, sprinkleProps } = extractSprinkles(props);
+  const { disabled, downshift, setInputValue } = useAutocompleteContext("AutocompleteInput");
+  return (
+    // https://github.com/radix-ui/primitives/issues/1461
+    /* @__PURE__ */ jsx(PopoverAnchor, { children: /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, type: void 0, ...sprinkleProps, children: /* @__PURE__ */ jsx(
+      SearchInput,
+      {
+        addonBefore: null,
+        ...!downshift.selectedItem && { addonAfter: null },
+        onValueClear: () => downshift.reset(),
+        ref,
+        ...downshift.getInputProps({
+          ...restProps,
+          disabled,
+          onChange: (event) => setInputValue("value" in event.target ? event.target.value : "")
+        })
+      }
+    ) }) })
+  );
+});
+AutocompleteTrigger.displayName = "@optiaxiom/react/AutocompleteTrigger";
+
+export { AutocompleteTrigger };

package/dist/src/avatar/Avatar-css.js

@@ -0,0 +1,10 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/table-row/TableRow.css.ts.vanilla-9uH71Yf6.css';
+import './../../assets/src/avatar/Avatar.css.ts.vanilla-ClN9p8wH.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var avatar = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',fontWeight:'500',justifyContent:'center',overflow:'hidden',rounded:'full'},'_1driqhx'],variants:{colorScheme:{blue:{bg:'blue.500',color:'neutral.00'},brand:{bg:'brand.500',color:'neutral.00'},green:{bg:'green.500',color:'neutral.00'},magenta:{bg:'magenta.500',color:'neutral.00'},neutral:{bg:'neutral.150',color:'bg.default.inverse'},purple:{bg:'purple.500',color:'neutral.00'},red:{bg:'red.500',color:'neutral.00'},yellow:{bg:'yellow.500',color:'neutral.00'}},size:{xs:[{fontSize:'xs',fontWeight:'400',size:'xs'},'_10mjc47'],sm:[{fontSize:'xs',size:'sm'},'alm6mv'],md:[{fontSize:'md',size:'md'},'y323y2'],lg:[{fontSize:'lg',size:'lg'},'_167f6vh'],xl:[{fontSize:'2xl',size:'xl'},'snfe6k'],'5xl':[{fontSize:'4xl',size:'5xl'},'pacjxx']}}});
+var fallback = recipeRuntime({base:{alignItems:'center',display:'flex',justifyContent:'center',rounded:'inherit',size:'full',textTransform:'uppercase'}});
+var icon = recipeRuntime({base:[{h:'auto'}],variants:{size:{xs:{w:'12'},sm:{w:'12'},md:{w:'16'},lg:{w:'20'},xl:{w:'20'},'5xl':{w:'32'}}}});
+
+export { avatar, fallback, icon };

package/dist/{avatar → src/avatar}/Avatar.js

@@ -1,10 +1,10 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import * as RadixAvatar from '@radix-ui/react-avatar';
-import { forwardRef } from 'react';
+import { forwardRef, useContext } from 'react';
+import { AvatarContext } from '../avatar-context/AvatarContext.js';
 import { Box } from '../box/Box.js';
-import { avatar, fallback } from './Avatar-css.js';
+import { avatar, fallback, icon } from './Avatar-css.js';
 
-const FALLBACK_DELAY_IN_MS = 600;
 function getInitialsFromName(name) {
   const names = name.trim().split(" ");
   const firstName = names[0] ?? "";
@@ -16,12 +16,14 @@ const Avatar = forwardRef(
     children,
     className,
     colorScheme = "neutral",
-    icon,
+    icon: icon$1,
     name,
-    size = "md",
+    size: sizeProp,
     src,
     ...props
   }, ref) => {
+    const context = useContext(AvatarContext);
+    const size = sizeProp || context?.size || "md";
     return /* @__PURE__ */ jsx(
       Box,
       {
@@ -29,8 +31,8 @@ const Avatar = forwardRef(
         ...avatar({ colorScheme, size }, className),
         ...props,
         children: /* @__PURE__ */ jsxs(RadixAvatar.Root, { ref, children: [
-          /* @__PURE__ */ jsx(Box, { asChild: true, objectFit: "cover", rounded: "inherit", size: "full", children: /* @__PURE__ */ jsx(RadixAvatar.Image, { alt: name, src }) }),
-          /* @__PURE__ */ jsx(Box, { asChild: true, ...fallback({ size }), children: /* @__PURE__ */ jsx(RadixAvatar.Fallback, { delayMs: FALLBACK_DELAY_IN_MS, children: icon ? icon : name ? getInitialsFromName(name) : children }) })
+          src && /* @__PURE__ */ jsx(Box, { asChild: true, objectFit: "cover", rounded: "inherit", size: "full", children: /* @__PURE__ */ jsx(RadixAvatar.Image, { alt: name, src }) }),
+          /* @__PURE__ */ jsx(Box, { asChild: true, ...fallback({}), children: /* @__PURE__ */ jsx(RadixAvatar.Fallback, { delayMs: src ? 600 : void 0, children: icon$1 ? /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ size }), children: icon$1 }) : name ? getInitialsFromName(name) : children }) })
         ] })
       }
     );

package/dist/src/avatar-context/AvatarContext.js

@@ -0,0 +1,7 @@
+import { createContext } from 'react';
+
+const AvatarContext = createContext({
+  size: void 0
+});
+
+export { AvatarContext };

package/dist/src/avatar-group/AvatarGroup-css.js

@@ -0,0 +1,7 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/table-row/TableRow.css.ts.vanilla-9uH71Yf6.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var avatarGroup = recipeRuntime({base:['_4179lf',{display:'flex'}]});
+
+export { avatarGroup };

package/dist/src/avatar-group/AvatarGroup.js

@@ -0,0 +1,14 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { AvatarContext } from '../avatar-context/AvatarContext.js';
+import { Box } from '../box/Box.js';
+import { avatarGroup } from './AvatarGroup-css.js';
+
+const AvatarGroup = forwardRef(
+  ({ children, className, size = "md", ...props }, ref) => {
+    return /* @__PURE__ */ jsx(Box, { ref, ...avatarGroup({}, className), ...props, children: /* @__PURE__ */ jsx(AvatarContext.Provider, { value: { size }, children }) });
+  }
+);
+AvatarGroup.displayName = "@optiaxiom/react/AvatarGroup";
+
+export { AvatarGroup };

package/dist/src/axiom-provider/AxiomProvider.js

@@ -0,0 +1,25 @@
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { AxiomVersionContext } from '@optiaxiom/globals';
+import * as RadixTooltip from '@radix-ui/react-tooltip';
+import { useContext } from 'react';
+import { version } from '../../package.json.js';
+import { ThemeProvider } from '../theme-provider/ThemeProvider.js';
+import { ToastProvider } from '../toast-provider/ToastProvider.js';
+
+function AxiomProvider({
+  children,
+  toast,
+  tooltip
+}) {
+  const axiom = useContext(AxiomVersionContext);
+  if (axiom) {
+    return /* @__PURE__ */ jsx(Fragment, { children });
+  }
+  return /* @__PURE__ */ jsx(AxiomVersionContext.Provider, { value: version, children: /* @__PURE__ */ jsx(RadixTooltip.Provider, { ...tooltip, children: /* @__PURE__ */ jsxs(ThemeProvider, { children: [
+    children,
+    /* @__PURE__ */ jsx(ToastProvider, { ...toast })
+  ] }) }) });
+}
+AxiomProvider.displayName = "@optiaxiom/react/AxiomProvider";
+
+export { AxiomProvider };

package/dist/src/badge/Badge-css.js

@@ -0,0 +1,7 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/badge/Badge.css.ts.vanilla-Bo5IfsM_.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var badge = recipeRuntime({base:[{display:'inline-flex',fontSize:'sm',fontWeight:'500',justifyContent:'center',px:'xs',py:'2',rounded:'full'},'_1d1tnm9'],variants:{colorScheme:{danger:'bovtoq',information:'cp8uza',neutral:'ujksuy',primary:'_4m5h0q',success:'c6wuop',warning:'_14jjzph'},variant:{light:'v8db6t',solid:'y3iidn'}}});
+
+export { badge };

package/dist/src/badge/Badge.js

@@ -0,0 +1,31 @@
+import { jsx } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+import { forwardRef } from 'react';
+import { Text } from '../text/Text.js';
+import { badge } from './Badge-css.js';
+
+const Badge = forwardRef(
+  ({
+    asChild,
+    children,
+    className,
+    colorScheme = "neutral",
+    variant = "light",
+    ...props
+  }, ref) => {
+    const Comp = asChild ? Slot : "span";
+    return /* @__PURE__ */ jsx(
+      Text,
+      {
+        asChild: true,
+        role: "presentation",
+        ...badge({ colorScheme, variant }, className),
+        ...props,
+        children: /* @__PURE__ */ jsx(Comp, { ref, children })
+      }
+    );
+  }
+);
+Badge.displayName = "@optiaxiom/react/Badge";
+
+export { Badge };

package/dist/src/banner/Banner-css.js

@@ -0,0 +1,7 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var banner = recipeRuntime({base:[{alignItems:'start',flexDirection:'row',fontSize:'md',gap:'xs',justifyContent:'space-between',p:'md'}],variants:{colorScheme:{danger:{bg:'red.200'},information:{bg:'brand.200'},neutral:{bg:'bg.tertiary'},success:{bg:'green.200'},warning:{bg:'yellow.200'}}}});
+var icon = recipeRuntime({base:[{color:'bg.default.inverse',h:'16',mt:'4',w:'auto'}]});
+
+export { banner, icon };

package/dist/src/banner/Banner.js

@@ -0,0 +1,42 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef, createElement } from 'react';
+import { Box } from '../box/Box.js';
+import { Button } from '../button/Button.js';
+import { Flex } from '../flex/Flex.js';
+import { IconCircleCheckFilled } from '../icons/IconCircleCheckFilled.js';
+import { IconCircleExclamationFilled } from '../icons/IconCircleExclamationFilled.js';
+import { IconCircleInfoFilled } from '../icons/IconCircleInfoFilled.js';
+import { IconTriangleExclamationFilled } from '../icons/IconTriangleExclamationFilled.js';
+import { IconX } from '../icons/IconX.js';
+import { banner, icon } from './Banner-css.js';
+
+const iconMap = {
+  danger: IconCircleExclamationFilled,
+  information: IconCircleInfoFilled,
+  neutral: IconCircleInfoFilled,
+  success: IconCircleCheckFilled,
+  warning: IconTriangleExclamationFilled
+};
+const Banner = forwardRef(
+  ({ children, className, colorScheme = "neutral", onClose, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(Flex, { ref, ...banner({ colorScheme }, className), ...props, children: [
+      /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({}), children: createElement(iconMap[colorScheme]) }),
+      /* @__PURE__ */ jsx(Flex, { flex: "1", gap: "xs", mt: "2", children }),
+      !!onClose && /* @__PURE__ */ jsx(
+        Button,
+        {
+          appearance: "subtle",
+          "aria-label": "close",
+          color: "fg.default",
+          flex: "none",
+          icon: /* @__PURE__ */ jsx(IconX, {}),
+          onClick: onClose,
+          size: "sm"
+        }
+      )
+    ] });
+  }
+);
+Banner.displayName = "@optiaxiom/react/Banner";
+
+export { Banner };

package/dist/src/banner-description/BannerDescription.js

@@ -0,0 +1,10 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Flex } from '../flex/Flex.js';
+
+const BannerDescription = forwardRef(({ children, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(Flex, { gap: "xs", ref, ...props, children });
+});
+BannerDescription.displayName = "@optiaxiom/react/BannerDescription";
+
+export { BannerDescription };

package/dist/src/banner-title/BannerTitle.js

@@ -0,0 +1,12 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Box } from '../box/Box.js';
+
+const BannerTitle = forwardRef(
+  ({ children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(Box, { fontWeight: "600", ref, ...props, children });
+  }
+);
+BannerTitle.displayName = "@optiaxiom/react/BannerTitle";
+
+export { BannerTitle };

package/dist/src/box/Box-css.js

@@ -0,0 +1,7 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/box/Box.css.ts.vanilla-B8q6Oyuj.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var box = recipeRuntime({base:'fech8q'});
+
+export { box };

package/dist/{box → src/box}/Box.js

@@ -1,11 +1,11 @@
 import { jsx } from 'react/jsx-runtime';
-import '@fontsource-variable/fira-code';
+import '@optiaxiom/globals/fonts';
 import { Slot } from '@radix-ui/react-slot';
-import clsx from 'clsx';
-import 'inter-ui/inter-variable.css';
 import { forwardRef } from 'react';
+import { version } from '../../package.json.js';
 import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
-import { sprinkles } from '../sprinkles/sprinkles-css.js';
+import { sprinkles } from '../sprinkles/sprinkles.js';
+import { sprinklesMerge } from '../sprinkles/sprinklesMerge.js';
 import { box } from './Box-css.js';
 
 const Box = forwardRef(
@@ -15,8 +15,9 @@ const Box = forwardRef(
     return /* @__PURE__ */ jsx(
       Comp,
       {
+        "data-axiom": version,
         ref,
-        ...box({}, clsx(className, sprinkles(sprinkleProps))),
+        ...box({}, sprinklesMerge(className, sprinkles(sprinkleProps))),
         ...restProps
       }
     );

package/dist/src/breadcrumb/Breadcrumb.js

@@ -0,0 +1,16 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Box } from '../box/Box.js';
+import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
+import '../sprinkles/sprinkles.js';
+import '../sprinkles/sprinklesMerge.js';
+
+const Breadcrumb = forwardRef(
+  ({ children, ...props }, ref) => {
+    const { restProps, sprinkleProps } = extractSprinkles(props);
+    return /* @__PURE__ */ jsx(Box, { asChild: true, ...sprinkleProps, children: /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", ref, ...restProps, children: /* @__PURE__ */ jsx(Box, { alignItems: "center", asChild: true, display: "flex", gap: "xs", children: /* @__PURE__ */ jsx("ol", { children }) }) }) });
+  }
+);
+Breadcrumb.displayName = "@optiaxiom/react/Breadcrumb";
+
+export { Breadcrumb };

package/dist/src/breadcrumb-ellipsis/BreadcrumbEllipsis.js

@@ -0,0 +1,10 @@
+import { jsx } from 'react/jsx-runtime';
+import { Box } from '../box/Box.js';
+import { IconEllipsis } from '../icons/IconEllipsis.js';
+
+function BreadcrumbEllipsis({ ...props }) {
+  return /* @__PURE__ */ jsx(Box, { asChild: true, display: "flex", ...props, children: /* @__PURE__ */ jsx(IconEllipsis, {}) });
+}
+BreadcrumbEllipsis.displayName = "@optiaxiom/react/BreadcrumbEllipsis";
+
+export { BreadcrumbEllipsis };

package/dist/src/breadcrumb-item/BreadcrumbItem.js

@@ -0,0 +1,16 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Box } from '../box/Box.js';
+import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
+import '../sprinkles/sprinkles.js';
+import '../sprinkles/sprinklesMerge.js';
+
+const BreadcrumbItem = forwardRef(
+  ({ children, ...props }, ref) => {
+    const { restProps, sprinkleProps } = extractSprinkles(props);
+    return /* @__PURE__ */ jsx(Box, { asChild: true, ...sprinkleProps, children: /* @__PURE__ */ jsx("li", { ref, ...restProps, children }) });
+  }
+);
+BreadcrumbItem.displayName = "@optiaxiom/react/BreadcrumbItem";
+
+export { BreadcrumbItem };

package/dist/src/breadcrumb-link/BreadcrumbLink.js

@@ -0,0 +1,12 @@
+import { jsx } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+import { forwardRef } from 'react';
+import { Link } from '../link/Link.js';
+
+const BreadcrumbLink = forwardRef(({ asChild, ...props }, ref) => {
+  const Comp = asChild ? Slot : Link;
+  return /* @__PURE__ */ jsx(Comp, { ref, ...props });
+});
+BreadcrumbLink.displayName = "@optiaxiom/react/BreadcrumbLink";
+
+export { BreadcrumbLink };

package/dist/src/breadcrumb-page/BreadcrumbPage.js

@@ -0,0 +1,12 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Box } from '../box/Box.js';
+
+const BreadcrumbPage = forwardRef(
+  ({ ...props }, ref) => {
+    return /* @__PURE__ */ jsx(Box, { asChild: true, children: /* @__PURE__ */ jsx("span", { ref, ...props }) });
+  }
+);
+BreadcrumbPage.displayName = "@optiaxiom/react/BreadcrumbPage";
+
+export { BreadcrumbPage };

package/dist/src/breadcrumb-separator/BreadcrumbSeparator.js

@@ -0,0 +1,14 @@
+import { jsx } from 'react/jsx-runtime';
+import { Box } from '../box/Box.js';
+
+function BreadcrumbSeparator({
+  asChild,
+  children,
+  ...props
+}) {
+  const Comp = asChild ? Box : "span";
+  return /* @__PURE__ */ jsx(Comp, { ...props, children: children ?? /* @__PURE__ */ jsx("span", { children: "/" }) });
+}
+BreadcrumbSeparator.displayName = "@optiaxiom/react/BreadcrumbSeparator";
+
+export { BreadcrumbSeparator };

package/dist/src/button/Button-css.js

@@ -0,0 +1,12 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/table-row/TableRow.css.ts.vanilla-9uH71Yf6.css';
+import './../../assets/src/button/Button.css.ts.vanilla-BDZg-A0O.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var addon = recipeRuntime({base:[{transition:'opacity'},'hu6u33']});
+var button = recipeRuntime({base:['_1euikzm',{alignItems:'center',display:'inline-flex',flexDirection:'row',justifyContent:'center',transition:'colors'},'gdcwtt'],variants:{colorScheme:{danger:'amkvqb',neutral:'_1lpwxfn',primary:'oawihm'},iconOnly:{false:'vgctca',true:{}},size:{sm:{fontSize:'sm',h:'sm'},md:{fontSize:'md',gap:'2',h:'md'},lg:{fontSize:'md',gap:'4',h:'lg'}},variant:{outline:'_1vafzkp',solid:'_1fghhh6',subtle:'_190xska'}},variantsCompounded:[{style:'lpuiwj',variants:{iconOnly:true,size:'sm'}},{style:'awbsra',variants:{iconOnly:false,size:'sm'}},{style:'_1gbiub',variants:{iconOnly:true,size:'md'}},{style:'gohaac',variants:{iconOnly:false,size:'md'}},{style:'_1mwxxxz',variants:{iconOnly:true,size:'lg'}},{style:'_2mlqdl',variants:{iconOnly:false,size:'lg'}}]});
+var icon = recipeRuntime({base:[{h:'auto',w:'20'},{transition:'opacity'},'hu6u33']});
+var label = recipeRuntime({base:[{flexDirection:'row',gap:'4',mx:'4'},{transition:'opacity'},'hu6u33']});
+var spinner = recipeRuntime({base:'_13f61or'});
+
+export { addon, button, icon, label, spinner };

package/dist/src/button/Button.js

@@ -0,0 +1,105 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Slottable, Slot } from '@radix-ui/react-slot';
+import { forwardRef, isValidElement, cloneElement, useEffect } from 'react';
+import { AnimatePresence } from '../animate-presence/AnimatePresence.js';
+import { Box } from '../box/Box.js';
+import { Flex } from '../flex/Flex.js';
+import { Spinner } from '../spinner/Spinner.js';
+import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
+import '../sprinkles/sprinkles.js';
+import '../sprinkles/sprinklesMerge.js';
+import { Transition } from '../transition/Transition.js';
+import '../utils/conditions.js';
+import { fallbackSpan } from '../utils/fallbackSpan.js';
+import { icon, label, button, spinner, addon } from './Button-css.js';
+
+const appearances = {
+  danger: { colorScheme: "danger", variant: "solid" },
+  "danger-outline": { colorScheme: "danger", variant: "outline" },
+  default: { colorScheme: "neutral", variant: "outline" },
+  inverse: { colorScheme: "neutral", variant: "solid" },
+  primary: { colorScheme: "primary", variant: "solid" },
+  subtle: { colorScheme: "neutral", variant: "subtle" }
+};
+const Button = forwardRef(
+  ({
+    addonAfter,
+    addonBefore,
+    appearance = "default",
+    asChild,
+    children,
+    className,
+    disabled,
+    icon: icon$1,
+    iconPosition = "start",
+    loading,
+    size = "md",
+    ...props
+  }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    const { restProps, sprinkleProps } = extractSprinkles(props);
+    const presetProps = appearances[appearance];
+    const colorScheme = presetProps.colorScheme;
+    const variant = presetProps.variant;
+    let isIconOnly = Boolean(!children && icon$1);
+    if (asChild) {
+      const newElement = isValidElement(children) ? children : null;
+      isIconOnly = Boolean(!newElement?.props.children && icon$1);
+      children = newElement ? cloneElement(
+        newElement,
+        void 0,
+        isIconOnly ? /* @__PURE__ */ jsx(Box, { asChild: true, ...icon(), children: icon$1 }) : /* @__PURE__ */ jsx(Flex, { asChild: true, ...label(), children: fallbackSpan(newElement.props.children) })
+      ) : children;
+    } else {
+      children = isIconOnly ? /* @__PURE__ */ jsx(Box, { asChild: true, ...icon(), children: icon$1 }) : /* @__PURE__ */ jsx(Flex, { asChild: true, ...label(), children: fallbackSpan(children) });
+    }
+    if (icon$1 && !isIconOnly) {
+      if (iconPosition === "start") {
+        addonBefore = /* @__PURE__ */ jsx(Box, { asChild: true, ...icon(), children: icon$1 });
+      } else if (iconPosition === "end") {
+        addonAfter = /* @__PURE__ */ jsx(Box, { asChild: true, ...icon(), children: icon$1 });
+      }
+    }
+    const isIconMissingAriaLabel = isIconOnly && !props["aria-label"];
+    useEffect(() => {
+      if (isIconMissingAriaLabel) {
+        console.error(
+          `Icon only \`Button\` requires an \`aria-label\` for the component to be accessible for screen reader users.`
+        );
+      }
+    }, [isIconMissingAriaLabel]);
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        asChild: true,
+        cursor: disabled || loading ? "not-allowed" : "pointer",
+        "data-disabled": disabled ? "" : void 0,
+        "data-loading": loading ? "" : void 0,
+        ...button(
+          {
+            colorScheme,
+            iconOnly: isIconOnly,
+            size,
+            variant
+          },
+          className
+        ),
+        ...sprinkleProps,
+        children: /* @__PURE__ */ jsxs(Comp, { disabled: disabled || loading, ref, ...restProps, children: [
+          /* @__PURE__ */ jsx(AnimatePresence, { children: loading && /* @__PURE__ */ jsx(Transition, { duration: "sm", children: /* @__PURE__ */ jsx(Box, { "aria-hidden": "true", ...spinner(), children: /* @__PURE__ */ jsx(
+            Spinner,
+            {
+              colorScheme: variant === "solid" ? "inverse" : "default"
+            }
+          ) }) }) }),
+          addonBefore && /* @__PURE__ */ jsx(Box, { asChild: true, ...addon(), children: fallbackSpan(addonBefore) }),
+          /* @__PURE__ */ jsx(Slottable, { children }),
+          addonAfter && /* @__PURE__ */ jsx(Box, { asChild: true, ...addon(), children: fallbackSpan(addonAfter) })
+        ] })
+      }
+    );
+  }
+);
+Button.displayName = "@optiaxiom/react/Button";
+
+export { Button };

package/dist/src/button-group/ButtonGroup-css.js

@@ -0,0 +1,7 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/table-row/TableRow.css.ts.vanilla-9uH71Yf6.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var buttonGroup = recipeRuntime({base:'w156xz'});
+
+export { buttonGroup };

package/dist/src/checkbox/Checkbox-css.js

@@ -0,0 +1,11 @@
+import './../../assets/src/layers/layers.css.ts.vanilla-KObJMImw.css';
+import './../../assets/src/control-base/ControlBase.css.ts.vanilla-BEz0zQpD.css';
+import './../../assets/src/checkbox/Checkbox.css.ts.vanilla-DmEmg4Fg.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var checkbox = recipeRuntime({base:['_1sf6i23',{color:'neutral.00',mt:'2',rounded:'xs',size:'16'},'_67xr24']});
+var iconChecked = recipeRuntime({base:['_1lxq0kp']});
+var iconIndeterminate = recipeRuntime({base:['_1mrwd8w']});
+var indicator = recipeRuntime({base:[{alignItems:'center',display:'flex',justifyContent:'center',p:'2',size:'full'}]});
+
+export { checkbox, iconChecked, iconIndeterminate, indicator };