silver-ui 0.1.1 → 0.3.0

package/dist/{chunk-CWUC4TOQ.js → chunk-OJCJPYXE.js}

@@ -1,30 +1,123 @@
-import { Item } from './chunk-CA6645TQ.js';
-import { Field } from './chunk-NGWNIMMX.js';
-import { getStatusMessageID, getDescribedBy } from './chunk-3L3M7SJ3.js';
-import { cx } from './chunk-PPNETWIP.js';
-import { css } from './chunk-UHQRL4OA.js';
+import { Item } from './chunk-AMG3S252.js';
+import { getNecessity, Field } from './chunk-K6CQ45C2.js';
+import { getStatusMessageID, getDescribedBy } from './chunk-WOIWI2UO.js';
+import { sva } from './chunk-EHCAF6D3.js';
+import { cva } from './chunk-FMEIPGUP.js';
 import { createContext, useId, useMemo, use } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
+// src/components/RadioGroup/RadioGroup.recipe.ts
+var radioGroupRecipe = cva({
+  base: {
+    display: "flex"
+  },
+  variants: {
+    orientation: {
+      vertical: {
+        flexDirection: "column",
+        gap: "0.5"
+      },
+      horizontal: {
+        flexDirection: "row",
+        flexWrap: "wrap",
+        columnGap: "4",
+        rowGap: "0"
+      }
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical"
+  }
+});
+var radioGroupItemRecipe = sva({
+  slots: ["controlWrap", "input", "radio", "dot", "label"],
+  base: {
+    controlWrap: {
+      position: "relative",
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      flexShrink: 0,
+      borderRadius: "full",
+      isolation: "isolate",
+      "&:has(input:focus-visible)": {
+        outlineWidth: "focus",
+        outlineStyle: "solid",
+        outlineColor: "primary",
+        outlineOffset: "focusOffset"
+      }
+    },
+    input: {
+      position: "absolute",
+      inset: 0,
+      m: 0,
+      p: 0,
+      opacity: 0,
+      cursor: "pointer",
+      zIndex: 1,
+      _disabled: {
+        cursor: "not-allowed"
+      }
+    },
+    radio: {
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      borderWidth: "default",
+      borderStyle: "solid",
+      borderColor: "border.emphasized",
+      borderRadius: "full",
+      bg: "bg",
+      pointerEvents: "none"
+    },
+    dot: {
+      borderRadius: "full",
+      bg: "fg.onPrimary"
+    },
+    label: {
+      cursor: "pointer"
+    }
+  },
+  variants: {
+    size: {
+      sm: {
+        controlWrap: { w: "5", h: "5" },
+        radio: { w: "4.5", h: "4.5" },
+        dot: { w: "2", h: "2" }
+      },
+      md: {
+        controlWrap: { w: "6", h: "6" },
+        radio: { w: "5.5", h: "5.5" },
+        dot: { w: "2.5", h: "2.5" }
+      },
+      lg: {
+        controlWrap: { w: "7", h: "7" },
+        radio: { w: "6.5", h: "6.5" },
+        dot: { w: "3", h: "3" }
+      }
+    },
+    isChecked: {
+      true: {
+        radio: { bg: "primary", borderColor: "primary" }
+      }
+    },
+    isDisabled: {
+      true: {
+        radio: { opacity: 0.55 },
+        label: { color: "fg.disabled", cursor: "not-allowed" }
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    isChecked: false,
+    isDisabled: false
+  }
+});
 var RadioGroupContext = createContext(
   null
 );
 RadioGroupContext.displayName = "RadioGroupContext";
-var styles = {
-  group: css({
-    display: "flex"
-  }),
-  vertical: css({
-    flexDirection: "column",
-    gap: "0.5"
-  }),
-  horizontal: css({
-    flexDirection: "row",
-    flexWrap: "wrap",
-    columnGap: "4",
-    rowGap: "0"
-  })
-};
 function RadioGroup({
   children,
   className,
@@ -62,7 +155,7 @@ function RadioGroup({
     }),
     [isDisabled, isRequired, nameId, onChange, orientation, size, value]
   );
-  const necessity = { isOptional, isRequired };
+  const necessity = getNecessity(isOptional, isRequired);
   return /* @__PURE__ */ jsx(
     Field,
     {
@@ -88,7 +181,7 @@ function RadioGroup({
           "aria-labelledby": labelId,
           "aria-orientation": orientation,
           "aria-required": isRequired ?? void 0,
-          className: orientation === "vertical" ? `${styles.group} ${styles.vertical}` : `${styles.group} ${styles.horizontal}`,
+          className: radioGroupRecipe({ orientation }),
           id: inputId,
           role: "radiogroup",
           children: /* @__PURE__ */ jsx(RadioGroupContext, { value: contextValue, children })
@@ -98,77 +191,6 @@ function RadioGroup({
   );
 }
 RadioGroup.displayName = "RadioGroup";
-var styles2 = {
-  controlWrap: css({
-    position: "relative",
-    display: "inline-flex",
-    alignItems: "center",
-    justifyContent: "center",
-    flexShrink: 0,
-    borderRadius: "full",
-    isolation: "isolate",
-    "&:has(input:focus-visible)": {
-      outlineWidth: "focus",
-      outlineStyle: "solid",
-      outlineColor: "primary",
-      outlineOffset: "focusOffset"
-    }
-  }),
-  input: css({
-    position: "absolute",
-    inset: 0,
-    m: 0,
-    p: 0,
-    opacity: 0,
-    cursor: "pointer",
-    zIndex: 1,
-    _disabled: {
-      cursor: "not-allowed"
-    }
-  }),
-  radio: css({
-    display: "inline-flex",
-    alignItems: "center",
-    justifyContent: "center",
-    boxSizing: "border-box",
-    borderWidth: "default",
-    borderStyle: "solid",
-    borderColor: "border.emphasized",
-    borderRadius: "full",
-    bg: "bg",
-    pointerEvents: "none"
-  }),
-  radioChecked: css({
-    bg: "primary",
-    borderColor: "primary"
-  }),
-  radioDisabled: css({
-    opacity: 0.55
-  }),
-  dot: css({
-    borderRadius: "full",
-    bg: "fg.onPrimary"
-  }),
-  label: css({
-    cursor: "pointer"
-  }),
-  labelDisabled: css({
-    color: "fg.disabled",
-    cursor: "not-allowed"
-  }),
-  controlSize: {
-    sm: css({ w: "5", h: "5" }),
-    md: css({ w: "6", h: "6" })
-  },
-  radioSize: {
-    sm: css({ w: "4.5", h: "4.5" }),
-    md: css({ w: "5.5", h: "5.5" })
-  },
-  dotSize: {
-    sm: css({ w: "2", h: "2" }),
-    md: css({ w: "2.5", h: "2.5" })
-  }
-};
 function RadioGroupItem({
   className,
   "data-testid": dataTestId,
@@ -190,13 +212,14 @@ function RadioGroupItem({
   const isDisabled = context.isDisabled || isItemDisabled;
   const isChecked = context.value === value;
   const size = context.size;
-  const control = /* @__PURE__ */ jsxs("span", { className: cx(styles2.controlWrap, styles2.controlSize[size]), children: [
+  const classes = radioGroupItemRecipe({ size, isChecked, isDisabled });
+  const control = /* @__PURE__ */ jsxs("span", { className: classes.controlWrap, children: [
     /* @__PURE__ */ jsx(
       "input",
       {
         "aria-describedby": description != null ? descriptionId : void 0,
         checked: isChecked,
-        className: styles2.input,
+        className: classes.input,
         disabled: isDisabled,
         id,
         name: context.name,
@@ -206,19 +229,7 @@ function RadioGroupItem({
         value
       }
     ),
-    /* @__PURE__ */ jsx(
-      "span",
-      {
-        "aria-hidden": "true",
-        className: cx(
-          styles2.radio,
-          styles2.radioSize[size],
-          isChecked ? styles2.radioChecked : void 0,
-          isDisabled ? styles2.radioDisabled : void 0
-        ),
-        children: isChecked ? /* @__PURE__ */ jsx("span", { className: cx(styles2.dot, styles2.dotSize[size]) }) : null
-      }
-    )
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: classes.radio, children: isChecked ? /* @__PURE__ */ jsx("span", { className: classes.dot }) : null })
   ] });
   return /* @__PURE__ */ jsx(
     Item,
@@ -229,17 +240,7 @@ function RadioGroupItem({
       endContent,
       endContentPosition: "inline",
       isDisabled,
-      label: /* @__PURE__ */ jsx(
-        "label",
-        {
-          className: cx(
-            styles2.label,
-            isDisabled ? styles2.labelDisabled : void 0
-          ),
-          htmlFor: id,
-          children: label
-        }
-      ),
+      label: /* @__PURE__ */ jsx("label", { className: classes.label, htmlFor: id, children: label }),
       leadingContent: control,
       ref,
       startContent,
@@ -251,5 +252,5 @@ function RadioGroupItem({
 RadioGroupItem.displayName = "RadioGroupItem";
 
 export { RadioGroup, RadioGroupItem };
-//# sourceMappingURL=chunk-CWUC4TOQ.js.map
-//# sourceMappingURL=chunk-CWUC4TOQ.js.map
+//# sourceMappingURL=chunk-OJCJPYXE.js.map
+//# sourceMappingURL=chunk-OJCJPYXE.js.map

package/dist/chunk-OJCJPYXE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/RadioGroup/RadioGroup.recipe.ts","../src/components/RadioGroup/RadioGroupContext.tsx","../src/components/RadioGroup/RadioGroup.tsx","../src/components/RadioGroup/RadioGroupItem.tsx"],"names":["useId","jsx"],"mappings":"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","file":"chunk-OJCJPYXE.js","sourcesContent":["import {cva, sva, type RecipeVariantProps} from 'styled-system/css';\n\n/**\n * Group container layout — single element with an orientation variant.\n */\nexport const radioGroupRecipe = cva({\n  base: {\n    display: 'flex',\n  },\n  variants: {\n    orientation: {\n      vertical: {\n        flexDirection: 'column',\n        gap: '0.5',\n      },\n      horizontal: {\n        flexDirection: 'row',\n        flexWrap: 'wrap',\n        columnGap: '4',\n        rowGap: '0',\n      },\n    },\n  },\n  defaultVariants: {\n    orientation: 'vertical',\n  },\n});\n\nexport type RadioGroupVariants = RecipeVariantProps<typeof radioGroupRecipe>;\n\n/**\n * Individual radio item — multi-slot recipe for the control, its visual\n * radio circle, the selection dot, and the clickable label.\n */\nexport const radioGroupItemRecipe = sva({\n  slots: ['controlWrap', 'input', 'radio', 'dot', 'label'],\n  base: {\n    controlWrap: {\n      position: 'relative',\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      borderRadius: 'full',\n      isolation: 'isolate',\n      '&:has(input:focus-visible)': {\n        outlineWidth: 'focus',\n        outlineStyle: 'solid',\n        outlineColor: 'primary',\n        outlineOffset: 'focusOffset',\n      },\n    },\n    input: {\n      position: 'absolute',\n      inset: 0,\n      m: 0,\n      p: 0,\n      opacity: 0,\n      cursor: 'pointer',\n      zIndex: 1,\n      _disabled: {\n        cursor: 'not-allowed',\n      },\n    },\n    radio: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      borderWidth: 'default',\n      borderStyle: 'solid',\n      borderColor: 'border.emphasized',\n      borderRadius: 'full',\n      bg: 'bg',\n      pointerEvents: 'none',\n    },\n    dot: {\n      borderRadius: 'full',\n      bg: 'fg.onPrimary',\n    },\n    label: {\n      cursor: 'pointer',\n    },\n  },\n  variants: {\n    size: {\n      sm: {\n        controlWrap: {w: '5', h: '5'},\n        radio: {w: '4.5', h: '4.5'},\n        dot: {w: '2', h: '2'},\n      },\n      md: {\n        controlWrap: {w: '6', h: '6'},\n        radio: {w: '5.5', h: '5.5'},\n        dot: {w: '2.5', h: '2.5'},\n      },\n      lg: {\n        controlWrap: {w: '7', h: '7'},\n        radio: {w: '6.5', h: '6.5'},\n        dot: {w: '3', h: '3'},\n      },\n    },\n    isChecked: {\n      true: {\n        radio: {bg: 'primary', borderColor: 'primary'},\n      },\n    },\n    isDisabled: {\n      true: {\n        radio: {opacity: 0.55},\n        label: {color: 'fg.disabled', cursor: 'not-allowed'},\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    isChecked: false,\n    isDisabled: false,\n  },\n});\n\nexport type RadioGroupItemVariants = RecipeVariantProps<\n  typeof radioGroupItemRecipe\n>;\n","import {createContext} from 'react';\n\nexport type RadioGroupOrientation = 'horizontal' | 'vertical';\nexport type RadioGroupSize = 'sm' | 'md' | 'lg';\n\nexport interface RadioGroupContextValue {\n  isDisabled: boolean;\n  isRequired?: boolean;\n  name: string;\n  onChange: (value: string) => void;\n  orientation: RadioGroupOrientation;\n  size: RadioGroupSize;\n  value: string;\n}\n\nexport const RadioGroupContext = createContext<RadioGroupContextValue | null>(\n  null,\n);\n\nRadioGroupContext.displayName = 'RadioGroupContext';\n","import {\n  useId,\n  useMemo,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {\n  Field,\n  getNecessity,\n  type FieldNecessity,\n  type InputStatus,\n} from '../Field';\nimport {getDescribedBy, getStatusMessageID} from '../Field/inputUtils';\nimport {radioGroupRecipe} from './RadioGroup.recipe';\nimport {\n  RadioGroupContext,\n  type RadioGroupOrientation,\n  type RadioGroupSize,\n} from './RadioGroupContext';\n\nexport type {RadioGroupOrientation} from './RadioGroupContext';\n\nexport type RadioGroupProps = {\n  /**\n   * Radio list items to render.\n   */\n  children: ReactNode;\n  /**\n   * Additional CSS class names applied to the field root.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the field root.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text displayed below the label.\n   */\n  description?: ReactNode;\n  /**\n   * Whether all radio items are disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether to visually hide the label.\n   * @default false\n   */\n  isLabelHidden?: boolean;\n  /**\n   * Label text for the radio group.\n   */\n  label: string;\n  /**\n   * Tooltip content shown next to the label.\n   */\n  labelTooltip?: ReactNode;\n  /**\n   * Callback fired when the selected value changes.\n   * Memoize with `useCallback` to avoid unnecessary re-renders of radio items.\n   */\n  onChange: (value: string) => void;\n  /**\n   * Layout direction of the radio items.\n   * @default 'vertical'\n   */\n  orientation?: RadioGroupOrientation;\n  /**\n   * Ref forwarded to the field root.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Size of the radio controls.\n   * @default 'md'\n   */\n  size?: RadioGroupSize;\n  /**\n   * Validation status displayed below the group.\n   */\n  status?: InputStatus;\n  /**\n   * Inline styles applied to the field root.\n   */\n  style?: CSSProperties;\n  /**\n   * The currently selected value.\n   */\n  value: string;\n} & FieldNecessity;\n\n/**\n * A controlled radio group for single-value selection.\n */\nexport function RadioGroup({\n  children,\n  className,\n  'data-testid': dataTestId,\n  description,\n  isDisabled = false,\n  isLabelHidden = false,\n  isOptional,\n  isRequired,\n  label,\n  labelTooltip,\n  onChange,\n  orientation = 'vertical',\n  ref,\n  size = 'md',\n  status,\n  style,\n  value,\n}: RadioGroupProps): React.JSX.Element {\n  const nameId = useId();\n  const inputId = useId();\n  const labelId = `${inputId}-label`;\n  const descriptionID =\n    description != null ? `${inputId}-description` : undefined;\n  const statusMessageID = getStatusMessageID(inputId, status);\n  const describedBy = getDescribedBy(descriptionID, statusMessageID);\n  const contextValue = useMemo(\n    () => ({\n      isDisabled,\n      isRequired,\n      name: nameId,\n      onChange,\n      orientation,\n      size,\n      value,\n    }),\n    [isDisabled, isRequired, nameId, onChange, orientation, size, value],\n  );\n\n  const necessity = getNecessity(isOptional, isRequired);\n\n  return (\n    <Field\n      className={className}\n      data-testid={dataTestId}\n      inputId={inputId}\n      isDisabled={isDisabled}\n      isLabelHidden={isLabelHidden}\n      {...necessity}\n      label={label}\n      labelAs=\"span\"\n      labelId={labelId}\n      labelTooltip={labelTooltip}\n      ref={ref}\n      status={\n        status == null ? undefined : {...status, messageID: statusMessageID}\n      }\n      statusVariant=\"detached\"\n      style={style}>\n      <div\n        aria-describedby={describedBy}\n        aria-invalid={status?.type === 'error' || undefined}\n        aria-labelledby={labelId}\n        aria-orientation={orientation}\n        aria-required={isRequired ?? undefined}\n        className={radioGroupRecipe({orientation})}\n        id={inputId}\n        role=\"radiogroup\">\n        <RadioGroupContext value={contextValue}>{children}</RadioGroupContext>\n      </div>\n    </Field>\n  );\n}\n\nRadioGroup.displayName = 'RadioGroup';\n","import {use, useId, type CSSProperties, type ReactNode, type Ref} from 'react';\nimport {Item} from '../Item';\nimport {radioGroupItemRecipe} from './RadioGroup.recipe';\nimport {RadioGroupContext} from './RadioGroupContext';\n\nexport interface RadioGroupItemProps {\n  /**\n   * Additional CSS class names applied to the item root.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the item root.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text displayed below the item label.\n   */\n  description?: ReactNode;\n  /**\n   * Content rendered after the label and description.\n   */\n  endContent?: ReactNode;\n  /**\n   * Whether this radio item is disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Label text for the radio item.\n   */\n  label: string;\n  /**\n   * Ref forwarded to the item root.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Content rendered after the radio control and before the label.\n   */\n  startContent?: ReactNode;\n  /**\n   * Inline styles applied to the item root.\n   */\n  style?: CSSProperties;\n  /**\n   * Value represented by this radio item.\n   */\n  value: string;\n}\n\n/**\n * An individual radio option within a `RadioGroup`.\n */\nexport function RadioGroupItem({\n  className,\n  'data-testid': dataTestId,\n  description,\n  endContent,\n  isDisabled: isItemDisabled = false,\n  label,\n  ref,\n  startContent,\n  style,\n  value,\n}: RadioGroupItemProps): React.JSX.Element {\n  const context = use(RadioGroupContext);\n  if (context == null) {\n    throw new Error('RadioGroupItem must be used within a RadioGroup');\n  }\n\n  const id = useId();\n  const descriptionId = useId();\n  const isDisabled = context.isDisabled || isItemDisabled;\n  const isChecked = context.value === value;\n  const size = context.size;\n  const classes = radioGroupItemRecipe({size, isChecked, isDisabled});\n  const control = (\n    <span className={classes.controlWrap}>\n      <input\n        aria-describedby={description != null ? descriptionId : undefined}\n        checked={isChecked}\n        className={classes.input}\n        disabled={isDisabled}\n        id={id}\n        name={context.name}\n        onChange={() => context.onChange(value)}\n        required={context.isRequired}\n        type=\"radio\"\n        value={value}\n      />\n      <span aria-hidden=\"true\" className={classes.radio}>\n        {isChecked ? <span className={classes.dot} /> : null}\n      </span>\n    </span>\n  );\n\n  return (\n    <Item\n      className={className}\n      data-testid={dataTestId}\n      description={\n        description != null ? (\n          <span id={descriptionId}>{description}</span>\n        ) : undefined\n      }\n      endContent={endContent}\n      endContentPosition=\"inline\"\n      isDisabled={isDisabled}\n      label={\n        <label className={classes.label} htmlFor={id}>\n          {label}\n        </label>\n      }\n      leadingContent={control}\n      ref={ref}\n      startContent={startContent}\n      style={style}\n      width={context.orientation === 'horizontal' ? 'auto' : 'full'}\n    />\n  );\n}\n\nRadioGroupItem.displayName = 'RadioGroupItem';\n"]}

package/dist/{chunk-4A4EI26N.cjs → chunk-OJKZS6HG.cjs}

@@ -2,9 +2,9 @@
 
 var chunkCK3UJQRI_cjs = require('./chunk-CK3UJQRI.cjs');
 var chunkR37R7DEV_cjs = require('./chunk-R37R7DEV.cjs');
-var chunkNILB6Y4Z_cjs = require('./chunk-NILB6Y4Z.cjs');
-var chunk6SPQDYHC_cjs = require('./chunk-6SPQDYHC.cjs');
-var chunkAZDWQGAX_cjs = require('./chunk-AZDWQGAX.cjs');
+var chunkYBPG5RPR_cjs = require('./chunk-YBPG5RPR.cjs');
+var chunk6BK4LUK4_cjs = require('./chunk-6BK4LUK4.cjs');
+var chunkRU6JG3FS_cjs = require('./chunk-RU6JG3FS.cjs');
 var lucideReact = require('lucide-react');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
@@ -110,41 +110,41 @@ function useGridFocus({
   return { gridRef, handleKeyDown, focusCell, focusFirst, focusLast };
 }
 var styles = {
-  root: chunkAZDWQGAX_cjs.css({
+  root: chunkRU6JG3FS_cjs.css({
     display: "inline-block",
     minW: "220px",
     color: "fg",
     fontFamily: "body"
   }),
-  header: chunkAZDWQGAX_cjs.css({
+  header: chunkRU6JG3FS_cjs.css({
     display: "flex",
     alignItems: "center",
     justifyContent: "space-between",
     gap: "2",
     mb: "2"
   }),
-  monthYear: chunkAZDWQGAX_cjs.css({
+  monthYear: chunkRU6JG3FS_cjs.css({
     flex: 1,
     textAlign: "center",
     fontSize: "sm",
     fontWeight: "semibold"
   }),
-  months: chunkAZDWQGAX_cjs.css({
+  months: chunkRU6JG3FS_cjs.css({
     display: "flex",
     gap: "4"
   }),
-  monthGrid: chunkAZDWQGAX_cjs.css({
+  monthGrid: chunkRU6JG3FS_cjs.css({
     flex: "1 1 0"
   }),
-  weekHeader: chunkAZDWQGAX_cjs.css({
+  weekHeader: chunkRU6JG3FS_cjs.css({
     display: "grid",
     gridTemplateColumns: "repeat(7, 1fr)",
     mb: "1"
   }),
-  weekHeaderWithNumbers: chunkAZDWQGAX_cjs.css({
+  weekHeaderWithNumbers: chunkRU6JG3FS_cjs.css({
     gridTemplateColumns: "auto repeat(7, 1fr)"
   }),
-  dayName: chunkAZDWQGAX_cjs.css({
+  dayName: chunkRU6JG3FS_cjs.css({
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
@@ -153,17 +153,17 @@ var styles = {
     color: "fg.muted",
     fontSize: "sm"
   }),
-  daysGrid: chunkAZDWQGAX_cjs.css({
+  daysGrid: chunkRU6JG3FS_cjs.css({
     display: "grid",
     gridTemplateColumns: "repeat(7, 1fr)"
   }),
-  daysGridWithNumbers: chunkAZDWQGAX_cjs.css({
+  daysGridWithNumbers: chunkRU6JG3FS_cjs.css({
     gridTemplateColumns: "auto repeat(7, 1fr)"
   }),
-  weekRow: chunkAZDWQGAX_cjs.css({
+  weekRow: chunkRU6JG3FS_cjs.css({
     display: "contents"
   }),
-  weekNumber: chunkAZDWQGAX_cjs.css({
+  weekNumber: chunkRU6JG3FS_cjs.css({
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
@@ -172,7 +172,7 @@ var styles = {
     color: "fg.muted",
     fontSize: "sm"
   }),
-  cell: chunkAZDWQGAX_cjs.css({
+  cell: chunkRU6JG3FS_cjs.css({
     position: "relative",
     display: "flex",
     alignItems: "center",
@@ -180,29 +180,29 @@ var styles = {
     h: "component.md",
     isolation: "isolate"
   }),
-  rangeBackground: chunkAZDWQGAX_cjs.css({
+  rangeBackground: chunkRU6JG3FS_cjs.css({
     position: "absolute",
     insetBlock: "2px",
     insetInline: 0,
     bg: "bg.selected"
   }),
-  previewBackground: chunkAZDWQGAX_cjs.css({
+  previewBackground: chunkRU6JG3FS_cjs.css({
     position: "absolute",
     insetBlock: "2px",
     insetInline: 0,
     bg: "bg.subtle"
   }),
-  rangeLeft: chunkAZDWQGAX_cjs.css({
+  rangeLeft: chunkRU6JG3FS_cjs.css({
     left: "2px",
     borderTopLeftRadius: "full",
     borderBottomLeftRadius: "full"
   }),
-  rangeRight: chunkAZDWQGAX_cjs.css({
+  rangeRight: chunkRU6JG3FS_cjs.css({
     right: "2px",
     borderTopRightRadius: "full",
     borderBottomRightRadius: "full"
   }),
-  day: chunkAZDWQGAX_cjs.css({
+  day: chunkRU6JG3FS_cjs.css({
     position: "relative",
     zIndex: 1,
     display: "flex",
@@ -234,21 +234,21 @@ var styles = {
       cursor: "not-allowed"
     }
   }),
-  dayOutside: chunkAZDWQGAX_cjs.css({
+  dayOutside: chunkRU6JG3FS_cjs.css({
     color: "fg.muted",
     opacity: 0.55
   }),
-  dayToday: chunkAZDWQGAX_cjs.css({
+  dayToday: chunkRU6JG3FS_cjs.css({
     boxShadow: "inset 0 0 0 1px token(colors.border.emphasized)"
   }),
-  daySelected: chunkAZDWQGAX_cjs.css({
+  daySelected: chunkRU6JG3FS_cjs.css({
     bg: "primary",
     color: "fg.onPrimary",
     _hover: {
       bg: "primary"
     }
   }),
-  dayDisabled: chunkAZDWQGAX_cjs.css({
+  dayDisabled: chunkRU6JG3FS_cjs.css({
     opacity: 0.35
   })
 };
@@ -438,7 +438,7 @@ function Calendar({
     /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        className: chunk6SPQDYHC_cjs.cx(styles.root, className),
+        className: chunk6BK4LUK4_cjs.cx(styles.root, className),
         "data-testid": dataTestId,
         onKeyDown: (event) => {
           if (mode === "range" && rangeSelectionStart != null && event.key === "Escape") {
@@ -451,7 +451,7 @@ function Calendar({
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.header, children: [
             /* @__PURE__ */ jsxRuntime.jsx(
-              chunkNILB6Y4Z_cjs.Button,
+              chunkYBPG5RPR_cjs.Button,
               {
                 icon: lucideReact.ChevronLeft,
                 isDisabled: !canNavigatePrevious,
@@ -464,7 +464,7 @@ function Calendar({
             ),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.monthYear, children: monthYearLabel }),
             /* @__PURE__ */ jsxRuntime.jsx(
-              chunkNILB6Y4Z_cjs.Button,
+              chunkYBPG5RPR_cjs.Button,
               {
                 icon: lucideReact.ChevronRight,
                 isDisabled: !canNavigateNext,
@@ -619,7 +619,7 @@ var MonthGrid = react.memo(function MonthGrid2({
     /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        className: chunk6SPQDYHC_cjs.cx(
+        className: chunk6BK4LUK4_cjs.cx(
           styles.weekHeader,
           hasWeekNumbers ? styles.weekHeaderWithNumbers : void 0
         ),
@@ -633,7 +633,7 @@ var MonthGrid = react.memo(function MonthGrid2({
       "div",
       {
         "aria-label": chunkCK3UJQRI_cjs.plainDateFormat(month, chunkCK3UJQRI_cjs.DATE_FORMAT_MONTH_YEAR),
-        className: chunk6SPQDYHC_cjs.cx(
+        className: chunk6BK4LUK4_cjs.cx(
           styles.daysGrid,
           hasWeekNumbers ? styles.daysGridWithNumbers : void 0
         ),
@@ -713,7 +713,7 @@ var DayCell = react.memo(function DayCell2({
     isInRange ? /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: chunk6SPQDYHC_cjs.cx(
+        className: chunk6BK4LUK4_cjs.cx(
           styles.rangeBackground,
           isRangeStart || isFirstColumn ? styles.rangeLeft : void 0,
           isRangeEnd || isLastColumn ? styles.rangeRight : void 0
@@ -723,7 +723,7 @@ var DayCell = react.memo(function DayCell2({
     isInPreview ? /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: chunk6SPQDYHC_cjs.cx(
+        className: chunk6BK4LUK4_cjs.cx(
           styles.previewBackground,
           isPreviewStart || isFirstColumn ? styles.rangeLeft : void 0,
           isPreviewEnd || isLastColumn ? styles.rangeRight : void 0
@@ -736,7 +736,7 @@ var DayCell = react.memo(function DayCell2({
         "aria-disabled": effectivelyDisabled || void 0,
         "aria-label": chunkCK3UJQRI_cjs.plainDateFormat(day.date, chunkCK3UJQRI_cjs.DATE_FORMAT_WITH_WEEKDAY),
         "aria-selected": isSelected || isInRange || void 0,
-        className: chunk6SPQDYHC_cjs.cx(
+        className: chunk6BK4LUK4_cjs.cx(
           styles.day,
           day.isOutside ? styles.dayOutside : void 0,
           isToday && !isSelected && !isInRange ? styles.dayToday : void 0,
@@ -767,5 +767,5 @@ var DayCell = react.memo(function DayCell2({
 Calendar.displayName = "Calendar";
 
 exports.Calendar = Calendar;
-//# sourceMappingURL=chunk-4A4EI26N.cjs.map
-//# sourceMappingURL=chunk-4A4EI26N.cjs.map
+//# sourceMappingURL=chunk-OJKZS6HG.cjs.map
+//# sourceMappingURL=chunk-OJKZS6HG.cjs.map