@optiaxiom/react 1.0.2 → 1.1.0

package/dist/esm/packages/react/src/card-image/CardImage.js

@@ -9,7 +9,7 @@ import { cardImage } from './CardImage-css.js';
 
 const CardImage = forwardRef(
   ({ alt = "", asChild, children, className, src, ...props }, ref) => {
-    const { orientation } = useCardContext("CardImage");
+    const { orientation } = useCardContext("@optiaxiom/react/CardImage");
     return /* @__PURE__ */ jsx(
       Box,
       {

package/dist/esm/packages/react/src/card-overflow/CardOverflow-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-6xLEkHBd.css';
-import './../../../../assets/src/card-overflow/CardOverflow.css.ts.vanilla-BJFwp3I-.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-vkICs9QI.css';
+import './../../../../assets/src/card-overflow/CardOverflow.css.ts.vanilla-BpmRlr0X.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var cardOverflow = recipeRuntime({base:['rhlxpg',{alignSelf:'stretch'},'aanpp1'],variants:{orientation:{horizontal:['_1vdtv4p'],vertical:['_1kol0hh']}}});
+var cardOverflow = recipeRuntime({base:['_1etn66z',{alignSelf:'stretch'},'_6v7ldk'],variants:{orientation:{horizontal:['_5g053c'],vertical:['_1tzs4xu']}}});
 
 export { cardOverflow };

package/dist/esm/packages/react/src/card-overflow/CardOverflow.js

@@ -9,7 +9,7 @@ import { cardOverflow } from './CardOverflow-css.js';
 
 const CardOverflow = forwardRef(
   ({ children, className, ...props }, ref) => {
-    const { orientation } = useCardContext("CardOverflow");
+    const { orientation } = useCardContext("@optiaxiom/react/CardOverflow");
     return /* @__PURE__ */ jsx(
       Box,
       {

package/dist/esm/packages/react/src/card-title/CardTitle.js

@@ -8,7 +8,7 @@ import { Heading } from '../heading/Heading.js';
 const CardTitle = forwardRef(
   ({ asChild, children, ...props }, ref) => {
     const Comp = asChild ? Slot : "h2";
-    const { labelId } = useCardContext("CardTitle");
+    const { labelId } = useCardContext("@optiaxiom/react/CardTitle");
     return /* @__PURE__ */ jsx(
       Heading,
       {

package/dist/esm/packages/react/src/checkbox-control/CheckboxControl-css.js

@@ -1,11 +1,11 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-6xLEkHBd.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-Batxd1He.css';
-import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-BwHzm_lE.css';
-import './../../../../assets/src/checkbox-control/CheckboxControl.css.ts.vanilla-DrgK3jgJ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-vkICs9QI.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-CJW_goYk.css';
+import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-DUlOrUqH.css';
+import './../../../../assets/src/checkbox-control/CheckboxControl.css.ts.vanilla-DLcEJJNX.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:[{color:'fg.default.inverse',display:'grid',rounded:'xs',size:'2xs'},'j2fnar'],variants:{shift:{false:{},true:{mt:'2'}}}});
-var icon = recipeRuntime({base:[{transition:'all'},'b9xhpj']});
+var control = recipeRuntime({base:[{color:'fg.default.inverse',display:'grid',rounded:'xs',size:'2xs'},'_1bavr2x'],variants:{shift:{false:{},true:{mt:'2'}}}});
+var icon = recipeRuntime({base:[{transition:'all'},'_1xn289r']});
 var indicator = recipeRuntime({base:[{alignItems:'center',display:'flex',justifyContent:'center',p:'2',size:'full'}]});
 
 export { control, icon, indicator };

package/dist/esm/packages/react/src/clock/Clock.js

@@ -1,11 +1,12 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
-import { forwardRef, useRef, useEffect } from 'react';
+import { forwardRef } from 'react';
 import { Flex } from '../flex/Flex.js';
-import { SegmentedControl } from '../segmented-control/SegmentedControl.js';
-import { SegmentedControlItem } from '../segmented-control-item/SegmentedControlItem.js';
-import { wheel } from './Clock-css.js';
+import { Select } from '../select/Select.js';
+import { SelectContent } from '../select-content/SelectContent.js';
+import { SelectRadioItem } from '../select-radio-item/SelectRadioItem.js';
+import { SelectTrigger } from '../select-trigger/SelectTrigger.js';
 import { parse, range, format } from './utils.js';
 
 const Clock = forwardRef(
@@ -15,125 +16,66 @@ const Clock = forwardRef(
       onChange: onValueChange,
       prop: valueProp
     });
-    const parsed = parse(value, parseInt(step) / 60);
-    const hourRef = useRef(null);
-    const minuteRef = useRef(null);
-    useEffect(() => {
-      if (hourRef.current?.parentElement) {
-        hourRef.current.parentElement.style.overflow = "hidden";
-        hourRef.current?.scrollIntoView();
-        hourRef.current.parentElement.style.overflow = "";
-      }
-      if (minuteRef.current?.parentElement) {
-        minuteRef.current.parentElement.style.overflow = "hidden";
-        minuteRef.current?.scrollIntoView();
-        minuteRef.current.parentElement.style.overflow = "";
-      }
-    }, []);
-    return /* @__PURE__ */ jsxs(
-      Flex,
-      {
-        alignItems: "stretch",
-        flexDirection: "row",
-        gap: "0",
-        onKeyDown: (event) => {
-          if (!(event.target instanceof HTMLButtonElement)) {
-            return;
-          }
-          const parent = event.target.parentElement;
-          if (!parent) {
-            return;
-          }
-          const grandParent = parent.parentElement;
-          if (!grandParent) {
-            return;
-          }
-          const sibling = event.key === "ArrowRight" ? parent.nextElementSibling ?? grandParent.firstElementChild : event.key === "ArrowLeft" ? parent.previousElementSibling ?? grandParent.lastElementChild : void 0;
-          if (!sibling) {
-            return;
-          }
-          const focusable = sibling.querySelector('[tabindex="0"]') ?? sibling.querySelector('[aria-checked="true"]');
-          if (focusable instanceof HTMLButtonElement) {
-            focusable.focus();
-          }
-        },
-        ref,
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx(
-            SegmentedControl,
-            {
-              "aria-label": "Select hour",
-              loop: true,
-              onValueChange: (hour) => hour && setValue(format({ ...parsed, hour })),
-              orientation: "vertical",
-              role: "radiogroup",
-              value: parsed.hour,
-              ...wheel(),
-              children: range(1, 12).map((hour) => /* @__PURE__ */ jsx(
-                SegmentedControlItem,
-                {
-                  appearance: "subtle",
-                  flex: "none",
-                  ref: hour === parsed.hour ? hourRef : void 0,
-                  square: true,
-                  value: hour,
-                  children: hour
-                },
-                hour
-              ))
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SegmentedControl,
-            {
-              "aria-label": "Select minute",
-              loop: true,
-              onValueChange: (minute) => minute && setValue(format({ ...parsed, minute })),
-              orientation: "vertical",
-              role: "radiogroup",
-              value: parsed.minute,
-              ...wheel(),
-              children: range(0, 59, parseInt(step) / 60).map((minute) => minute.padStart(2, "0")).map((minute) => /* @__PURE__ */ jsx(
-                SegmentedControlItem,
-                {
-                  appearance: "subtle",
-                  "aria-label": `${parseInt(minute)}`,
-                  flex: "none",
-                  ref: minute === parsed.minute ? minuteRef : void 0,
-                  square: true,
-                  value: minute,
-                  children: minute
-                },
-                minute
-              ))
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SegmentedControl,
-            {
-              "aria-label": "Select AM or PM",
-              onValueChange: (meridiem) => meridiem && setValue(format({ ...parsed, meridiem })),
-              orientation: "vertical",
-              role: "radiogroup",
-              value: parsed.meridiem,
-              ...wheel(),
-              children: ["AM", "PM"].map((meridiem) => /* @__PURE__ */ jsx(
-                SegmentedControlItem,
-                {
-                  appearance: "subtle",
-                  flex: "none",
-                  square: true,
-                  value: meridiem,
-                  children: meridiem
-                },
-                meridiem
-              ))
-            }
-          )
-        ]
-      }
+    const stepInMinutes = (typeof step === "string" ? parseInt(step) : step) / 60;
+    const parsed = parse(value, stepInMinutes);
+    const hours = range(1, 12);
+    const minutes = range(0, 59, stepInMinutes).map(
+      (minute) => minute.padStart(2, "0")
     );
+    const periods = ["AM", "PM"];
+    return /* @__PURE__ */ jsxs(Flex, { flexDirection: "row", gap: "4", ref, ...props, children: [
+      /* @__PURE__ */ jsxs(
+        Select,
+        {
+          items: hours,
+          onValueChange: (hour) => hour && setValue(format({ ...parsed, hour })),
+          value: parsed.hour,
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Select hour", flex: "1", placeholder: "HH" }),
+            /* @__PURE__ */ jsx(SelectContent, { children: hours.map((hour) => /* @__PURE__ */ jsx(SelectRadioItem, { item: hour, children: hour }, hour)) })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        Select,
+        {
+          items: minutes,
+          onValueChange: (minute) => minute && setValue(format({ ...parsed, minute })),
+          value: parsed.minute,
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Select minute", flex: "1", placeholder: "MM" }),
+            /* @__PURE__ */ jsx(SelectContent, { children: minutes.map((minute) => /* @__PURE__ */ jsx(
+              SelectRadioItem,
+              {
+                "aria-label": `${parseInt(minute)}`,
+                item: minute,
+                children: minute
+              },
+              minute
+            )) })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        Select,
+        {
+          items: periods,
+          onValueChange: (meridiem) => meridiem && setValue(format({ ...parsed, meridiem })),
+          value: parsed.meridiem,
+          children: [
+            /* @__PURE__ */ jsx(
+              SelectTrigger,
+              {
+                "aria-label": "Select AM or PM",
+                flex: "1",
+                placeholder: "--"
+              }
+            ),
+            /* @__PURE__ */ jsx(SelectContent, { children: periods.map((meridiem) => /* @__PURE__ */ jsx(SelectRadioItem, { item: meridiem, children: meridiem }, meridiem)) })
+          ]
+        }
+      )
+    ] });
   }
 );
 Clock.displayName = "@optiaxiom/react/Clock";

package/dist/esm/packages/react/src/code/Code-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-6xLEkHBd.css';
-import './../../../../assets/src/code/Code.css.ts.vanilla-BSUxBEOS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-vkICs9QI.css';
+import './../../../../assets/src/code/Code.css.ts.vanilla-BJ_p8Vqq.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var code = recipeRuntime({base:[{fontWeight:'600'},'_1c2ofof']});
+var code = recipeRuntime({base:[{fontWeight:'600'},'_11tuoy7']});
 
 export { code };

package/dist/esm/packages/react/src/combobox/Combobox.js

@@ -2,7 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { useMemo, useEffect } from 'react';
-import { ComboboxContextProvider } from '../combobox-context/ComboboxContext.js';
+import { ComboboxProvider } from '../combobox-context/ComboboxContext.js';
 import { ComboboxDialogContent } from '../combobox-dialog-content/ComboboxDialogContent.js';
 import { ComboboxPopover } from '../combobox-popover/ComboboxPopover.js';
 import { ComboboxPopoverContent } from '../combobox-popover-content/ComboboxPopoverContent.js';
@@ -57,7 +57,7 @@ function Combobox({
     }
   }, [open, onInputValueChangeStable]);
   return /* @__PURE__ */ jsx(components.Root, { onOpenChange: setOpen, open, children: /* @__PURE__ */ jsx(
-    ComboboxContextProvider,
+    ComboboxProvider,
     {
       components,
       inputValue,

package/dist/esm/packages/react/src/combobox-content/ComboboxContent.js

@@ -26,7 +26,7 @@ const ComboboxContent = forwardRef(
       onInputValueChange,
       onItemSelect,
       value
-    } = useComboboxContext("ComboboxContent");
+    } = useComboboxContext("@optiaxiom/react/ComboboxContent");
     return /* @__PURE__ */ jsx(
       components.Content,
       {

package/dist/esm/packages/react/src/combobox-context/ComboboxContext.js

@@ -1,6 +1,6 @@
 "use client";
 import { createContext } from '@radix-ui/react-context';
 
-const [ComboboxContextProvider, useComboboxContext] = createContext("Combobox");
+const [ComboboxProvider, useComboboxContext] = createContext("@optiaxiom/react/Combobox");
 
-export { ComboboxContextProvider, useComboboxContext };
+export { ComboboxProvider, useComboboxContext };

package/dist/esm/packages/react/src/combobox-input/ComboboxInput.js

@@ -10,8 +10,10 @@ import { CommandInput } from '../command-input/CommandInput.js';
 
 const ComboboxInput = forwardRef(
   (props, ref) => {
-    const { downshift, highlightedItem } = useCommandContext("ComboboxInput");
-    const { open } = useComboboxContext("ComboboxInput");
+    const { downshift, highlightedItem } = useCommandContext(
+      "@optiaxiom/react/ComboboxInput"
+    );
+    const { open } = useComboboxContext("@optiaxiom/react/ComboboxInput");
     const [minWidth, setMinWidth] = useState(160);
     const containerRef = useRef(null);
     useEffect(() => {

package/dist/esm/packages/react/src/combobox-trigger/ComboboxTrigger.js

@@ -19,7 +19,7 @@ const ComboboxTrigger = forwardRef(
       itemToString,
       setOpen,
       value: valueContext
-    } = useComboboxContext("ComboboxTrigger");
+    } = useComboboxContext("@optiaxiom/react/ComboboxTrigger");
     const value = useMemo(
       () => valueContext instanceof Set ? [...valueContext] : valueContext,
       [valueContext]

package/dist/esm/packages/react/src/combobox-virtualized/ComboboxVirtualized.js

@@ -1,8 +1,8 @@
 "use client";
-import { jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
 import { useVirtualizer } from '@tanstack/react-virtual';
-import { forwardRef, useRef, useState, useEffect } from 'react';
+import { forwardRef, useRef, useState, useEffect, useMemo } from 'react';
 import { Box } from '../box/Box.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
@@ -22,33 +22,61 @@ const ComboboxVirtualized = forwardRef(({ children, items, ...props }, outerRef)
     estimateSize: () => 40,
     getScrollElement: () => innerRef.current
   });
-  const { downshift } = useCommandContext("ComboboxVirtualized");
+  const { highlightedItem } = useCommandContext(
+    "@optiaxiom/react/ComboboxVirtualized"
+  );
+  const itemToIndexMap = useMemo(
+    () => new Map(items.map((item, index) => [item, index])),
+    [items]
+  );
   useEffect(() => {
-    rowVirtualizer.scrollToIndex(downshift.highlightedIndex);
-  }, [downshift.highlightedIndex, enabled, rowVirtualizer]);
+    const index = itemToIndexMap.get(highlightedItem);
+    if (typeof index !== "number") {
+      return;
+    }
+    rowVirtualizer.scrollToIndex(index);
+  }, [enabled, highlightedItem, itemToIndexMap, rowVirtualizer]);
+  const virtualItems = rowVirtualizer.getVirtualItems();
+  const [paddingTop, paddingBottom] = virtualItems.length > 0 ? [
+    Math.max(0, virtualItems[0].start),
+    Math.max(
+      0,
+      rowVirtualizer.getTotalSize() - virtualItems[virtualItems.length - 1].end
+    )
+  ] : [0, 0];
+  const [minWidth, setMinWidth] = useState(0);
+  useEffect(() => {
+    if (!innerRef.current) {
+      return;
+    }
+    const observer = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        setMinWidth(entry.contentRect.width);
+      }
+    });
+    observer.observe(innerRef.current);
+    return () => observer.disconnect();
+  }, []);
   return /* @__PURE__ */ jsx(ListboxScrollArea, { ref, ...props, children: /* @__PURE__ */ jsx(
     Box,
     {
-      display: "flex",
       flex: "none",
-      flexDirection: "column",
-      gap: "2",
       style: {
-        height: `${rowVirtualizer.getTotalSize()}px`,
-        position: "relative"
+        height: `${rowVirtualizer.getTotalSize() - paddingTop - paddingBottom}px`,
+        minHeight: Math.min(items.length, 8) * 40,
+        minWidth,
+        paddingBottom,
+        paddingTop
       },
-      children: rowVirtualizer.getVirtualItems().map((virtualItem) => /* @__PURE__ */ jsx(
+      children: rowVirtualizer.getVirtualItems().map((virtualItem) => /* @__PURE__ */ jsxs(
         Box,
         {
-          style: {
-            height: virtualItem.size,
-            left: 0,
-            position: "absolute",
-            top: 0,
-            transform: `translateY(${virtualItem.start}px)`
-          },
-          w: "full",
-          children: children(items[virtualItem.index])
+          "data-index": virtualItem.index,
+          ref: rowVirtualizer.measureElement,
+          children: [
+            children(items[virtualItem.index]),
+            virtualItem.index < items.length - 1 && /* @__PURE__ */ jsx(Box, { pb: "2" })
+          ]
         },
         virtualItem.key
       ))

package/dist/esm/packages/react/src/command/Command.js

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { useCombobox } from 'downshift';
 import { useMemo, useState } from 'react';
-import { CommandContextProvider } from '../command-context/CommandContext.js';
+import { CommandProvider } from '../command-context/CommandContext.js';
 import { usePortalPatch } from '../downshift/usePortalPatch.js';
 
 const isHoverSupported = typeof window !== "undefined" && window.matchMedia("(hover: hover)").matches;
@@ -73,7 +73,7 @@ function Command({
       }
     },
     onSelectedItemChange({ selectedItem: selectedItem2, type }) {
-      if (type !== useCombobox.stateChangeTypes.InputBlur) {
+      if (type !== useCombobox.stateChangeTypes.InputBlur && selectedItem2) {
         onItemSelect?.(selectedItem2);
       }
     },
@@ -81,7 +81,7 @@ function Command({
   });
   downshift.getMenuProps({}, { suppressRefError: true });
   return /* @__PURE__ */ jsx(
-    CommandContextProvider,
+    CommandProvider,
     {
       downshift,
       highlightedItem: items[downshift.highlightedIndex],

package/dist/esm/packages/react/src/command-context/CommandContext.js

@@ -1,6 +1,6 @@
 "use client";
 import { createContext } from '@radix-ui/react-context';
 
-const [CommandContextProvider, useCommandContext] = createContext("Command");
+const [CommandProvider, useCommandContext] = createContext("@optiaxiom/react/Command");
 
-export { CommandContextProvider, useCommandContext };
+export { CommandProvider, useCommandContext };

package/dist/esm/packages/react/src/command-focusable-item/CommandFocusableItem-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-6xLEkHBd.css';
-import './../../../../assets/src/command-focusable-item/CommandFocusableItem.css.ts.vanilla-Bk9Sshj3.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-vkICs9QI.css';
+import './../../../../assets/src/command-focusable-item/CommandFocusableItem.css.ts.vanilla-DozsjqdV.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:'_1xqzlpu'});
+var item = recipeRuntime({base:'_1qxaypg'});
 
 export { item };

package/dist/esm/packages/react/src/command-focusable-item/CommandFocusableItem.js

@@ -8,7 +8,9 @@ import { useCommandContext } from '../command-context/CommandContext.js';
 import { item } from './CommandFocusableItem-css.js';
 
 const CommandFocusableItem = forwardRef(({ children, className, ...props }, ref) => {
-  const { lastInteractionSource } = useCommandContext("CommandFocusableItem");
+  const { lastInteractionSource } = useCommandContext(
+    "@optiaxiom/react/CommandFocusableItem"
+  );
   return /* @__PURE__ */ jsx(
     Box,
     {

package/dist/esm/packages/react/src/command-input/CommandInput.js

@@ -14,7 +14,7 @@ const CommandInput = forwardRef(
       itemToSubItems,
       setHighlightedSubIndex,
       setInputValue
-    } = useCommandContext("CommandInput");
+    } = useCommandContext("@optiaxiom/react/CommandInput");
     return /* @__PURE__ */ jsx(
       Input,
       {

package/dist/esm/packages/react/src/command-item/CommandItem.js

@@ -6,7 +6,9 @@ import { CommandFocusableItem } from '../command-focusable-item/CommandFocusable
 
 const CommandItem = forwardRef(
   ({ children, item, selected, size, ...props }, ref) => {
-    const { downshift, highlightedItem, value } = useCommandContext("CommandItem");
+    const { downshift, highlightedItem, value } = useCommandContext(
+      "@optiaxiom/react/CommandItem"
+    );
     const itemProps = downshift.getItemProps({
       "aria-selected": selected ?? value?.has(item),
       item,

package/dist/esm/packages/react/src/command-listbox/CommandListbox.js

@@ -6,7 +6,9 @@ import { Listbox } from '../listbox/Listbox.js';
 
 const CommandListbox = forwardRef(
   ({ children, size, ...props }, ref) => {
-    const { downshift, setPlaced } = useCommandContext("CommandListbox");
+    const { downshift, setPlaced } = useCommandContext(
+      "@optiaxiom/react/CommandListbox"
+    );
     useEffect(() => {
       setPlaced(true);
     }, [setPlaced]);

package/dist/esm/packages/react/src/command-sub/CommandSub.js

@@ -4,11 +4,11 @@ import { forwardRef } from 'react';
 import { Box } from '../box/Box.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
-import { CommandSubContextProvider } from '../command-sub-context/CommandSubContext.js';
+import { CommandSubProvider } from '../command-sub-context/CommandSubContext.js';
 
 const CommandSub = forwardRef(
   ({ children, item, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(CommandSubContextProvider, { item, children: /* @__PURE__ */ jsx(Box, { ref, role: "group", ...props, children }) });
+    return /* @__PURE__ */ jsx(CommandSubProvider, { item, children: /* @__PURE__ */ jsx(Box, { ref, role: "group", ...props, children }) });
   }
 );
 CommandSub.displayName = "@optiaxiom/react/CommandSub";

package/dist/esm/packages/react/src/command-sub-context/CommandSubContext.js

@@ -1,6 +1,6 @@
 "use client";
 import { createContext } from '@radix-ui/react-context';
 
-const [CommandSubContextProvider, useCommandSubContext] = createContext("CommandSub");
+const [CommandSubProvider, useCommandSubContext] = createContext("@optiaxiom/react/CommandSub");
 
-export { CommandSubContextProvider, useCommandSubContext };
+export { CommandSubProvider, useCommandSubContext };

package/dist/esm/packages/react/src/command-sub-item/CommandSubItem.js

@@ -18,8 +18,10 @@ const CommandSubItem = forwardRef(
       setHighlightedIndex,
       setHighlightedSubIndex,
       value
-    } = useCommandContext("CommandSubItem");
-    const { item: parentItem } = useCommandSubContext("CommandSubItem");
+    } = useCommandContext("@optiaxiom/react/CommandSubItem");
+    const { item: parentItem } = useCommandSubContext(
+      "@optiaxiom/react/CommandSubItem"
+    );
     const subItems = itemToSubItems?.(parentItem) ?? [];
     const highlightedSubItem = highlightedItem === parentItem && highlightedSubIndex !== -1 ? subItems[highlightedSubIndex] : null;
     const subIndex = subItems.indexOf(item);

package/dist/esm/packages/react/src/cover/Cover-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-6xLEkHBd.css';
-import './../../../../assets/src/cover/Cover.css.ts.vanilla-VfBrbMf1.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-vkICs9QI.css';
+import './../../../../assets/src/cover/Cover.css.ts.vanilla-BillaUi-.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var cover = recipeRuntime({variants:{disabled:{false:['okt9tl','_91uvmf'],true:{}},inset:{false:'_13gnan0',true:'u8qhju'}}});
+var cover = recipeRuntime({variants:{disabled:{false:['_5n9aio','_1jqn299'],true:{}},inset:{false:'uqektq',true:'_1wmkahi'}}});
 
 export { cover };

package/dist/esm/packages/react/src/data-table/DataTable.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
-import { DataTableContextProvider } from '../data-table-context/DataTableContext.js';
+import { DataTableProvider } from '../data-table-context/DataTableContext.js';
 import { Flex } from '../flex/Flex.js';
 
 const DataTable = forwardRef(
@@ -15,7 +15,7 @@ const DataTable = forwardRef(
         maxW: "full",
         ref,
         ...props,
-        children: /* @__PURE__ */ jsx(DataTableContextProvider, { table, children })
+        children: /* @__PURE__ */ jsx(DataTableProvider, { table, children })
       }
     );
   }

package/dist/esm/packages/react/src/data-table-body/DataTableBody-css.js

@@ -1,14 +1,14 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-6xLEkHBd.css';
-import './../../../../assets/src/table-row/TableRow.css.ts.vanilla-CggMOZ5O.css';
-import './../../../../assets/src/data-table-body/DataTableBody.css.ts.vanilla-cijPXl7J.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-vkICs9QI.css';
+import './../../../../assets/src/table-row/TableRow.css.ts.vanilla-C6FlfSZZ.css';
+import './../../../../assets/src/data-table-body/DataTableBody.css.ts.vanilla-DkCOv7cr.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var cell = recipeRuntime({base:[{alignItems:'start',display:'flex'},'vhvrs2'],variants:{pinned:{left:'_12le3yj',right:'_4h3ij'},pinnedType:{body:'psuqw8',header:{}}}});
-var cellOffsetVar = 'var(--_10jvtdq)';
-var cellSizeVar = 'var(--_1cv9ezw)';
-var header = recipeRuntime({base:[{display:'grid'},'_1pnzk2v']});
-var leftTotalSizeVar = 'var(--_14y88du)';
-var rightTotalSizeVar = 'var(--_1udkrwj)';
-var table = recipeRuntime({base:'_1y8bhl5',variants:{pinned:{both:'_1cfhjth',left:'_17a6ok',none:{},right:'_1gmnqvo'}}});
+var cell = recipeRuntime({base:[{alignItems:'start',display:'flex'},'_8sf1a2'],variants:{pinned:{left:'_1p093rt',right:'_18bc52u'},pinnedType:{body:'glube',header:{}}}});
+var cellOffsetVar = 'var(--_15w1brq)';
+var cellSizeVar = 'var(--k2xsiu)';
+var header = recipeRuntime({base:[{display:'grid'},'y7rd5h']});
+var leftTotalSizeVar = 'var(--_1nxkbss)';
+var rightTotalSizeVar = 'var(--_1th7wfd)';
+var table = recipeRuntime({base:'lojb8x',variants:{pinned:{both:'_1sxcvpq',left:'bvoidh',none:{},right:'_1b6if6m'}}});
 
 export { cell, cellOffsetVar, cellSizeVar, header, leftTotalSizeVar, rightTotalSizeVar, table };

package/dist/esm/packages/react/src/data-table-body/DataTableBody.js

@@ -22,7 +22,7 @@ const DataTableBody = forwardRef(
   ({ className, estimatedRowHeight = 52, loading, ...props }, outerRef) => {
     const innerRef = useRef(null);
     const ref = useComposedRefs(innerRef, outerRef);
-    const { table: table$1 } = useDataTableContext("DataTableBody");
+    const { table: table$1 } = useDataTableContext("@optiaxiom/react/DataTableBody");
     const { rows } = table$1.getRowModel();
     const centerColumns = table$1.getCenterVisibleLeafColumns();
     const columnVirtualizer = useVirtualizer({