@pearpages/pulp-react 0.2.0 → 0.2.2

package/dist/{chunk-Y4TZA77G.js → chunk-XWPXW46D.js}

@@ -53,5 +53,5 @@ function Tooltip({ content, placement = "top", delay = 300, children }) {
 Tooltip.displayName = "Tooltip";
 
 export { Tooltip };
-//# sourceMappingURL=chunk-Y4TZA77G.js.map
-//# sourceMappingURL=chunk-Y4TZA77G.js.map
+//# sourceMappingURL=chunk-XWPXW46D.js.map
+//# sourceMappingURL=chunk-XWPXW46D.js.map

package/dist/chunk-XWPXW46D.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tooltip/Tooltip.module.css","../src/tooltip/Tooltip.tsx"],"names":["tooltip"],"mappings":";;;;;;;AAAA,IAAA,eAAA,GAAA;AAAA,EAKG,OAAA,EAAAA,iBAkBY,CAAA;ACQR,SAAS,OAAA,CAAQ,EAAE,OAAA,EAAS,SAAA,GAAY,OAAO,KAAA,GAAQ,GAAA,EAAK,UAAS,EAAiB;AAC3F,EAAA,MAAM,KAAK,KAAA,EAAM;AACjB,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,KAAK,CAAA;AACtC,EAAA,MAAM,KAAA,GAAQ,OAAsC,MAAS,CAAA;AAC7D,EAAA,MAAM,EAAE,IAAA,EAAM,aAAA,EAAe,SAAA,EAAW,QAAA,KAAa,mBAAA,CAAoB,EAAE,IAAA,EAAM,SAAA,EAAW,CAAA;AAE5F,EAAA,MAAM,IAAA,GAAO,WAAA;AAAA,IACX,CAAC,IAAA,KAAiB;AAChB,MAAA,YAAA,CAAa,MAAM,OAAO,CAAA;AAC1B,MAAA,IAAI,IAAA,KAAS,CAAA,EAAG,OAAA,CAAQ,IAAI,CAAA;AAAA,iBACjB,OAAA,GAAU,UAAA,CAAW,MAAM,OAAA,CAAQ,IAAI,GAAG,IAAI,CAAA;AAAA,IAC3D,CAAA;AAAA,IACA;AAAC,GACH;AACA,EAAA,MAAM,IAAA,GAAO,YAAY,MAAM;AAC7B,IAAA,YAAA,CAAa,MAAM,OAAO,CAAA;AAC1B,IAAA,OAAA,CAAQ,KAAK,CAAA;AAAA,EACf,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM,MAAM,YAAA,CAAa,MAAM,OAAO,CAAA,EAAG,EAAE,CAAA;AACrD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,IAAA,EAAM;AACX,IAAA,MAAM,SAAA,GAAY,CAAC,KAAA,KAAyB;AAC1C,MAAA,IAAI,KAAA,CAAM,GAAA,KAAQ,QAAA,EAAU,IAAA,EAAK;AAAA,IACnC,CAAA;AACA,IAAA,QAAA,CAAS,gBAAA,CAAiB,WAAW,SAAS,CAAA;AAC9C,IAAA,OAAO,MAAM,QAAA,CAAS,mBAAA,CAAoB,SAAA,EAAW,SAAS,CAAA;AAAA,EAChE,CAAA,EAAG,CAAC,IAAA,EAAM,IAAI,CAAC,CAAA;AAIf,EAAA,MAAM,OAAA,GAAU,aAAA,CAAc,SAAA,EAAW,QAAA,EAAU;AAAA,IACjD,KAAK,IAAA,CAAK,YAAA;AAAA,IACV,YAAA,EAAc,MAAM,IAAA,CAAK,KAAK,CAAA;AAAA,IAC9B,YAAA,EAAc,IAAA;AAAA,IACd,OAAA,EAAS,MAAM,IAAA,CAAK,CAAC,CAAA;AAAA,IACrB,MAAA,EAAQ,IAAA;AAAA,IACR,kBAAA,EAAoB,OAAO,EAAA,GAAK;AAAA,GACjC,CAAA;AAED,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,OAAA;AAAA,IACA,IAAA,IACC,YAAA;AAAA;AAAA,sBAEE,GAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAK,IAAA,CAAK,aAAa,EAAA,EAAQ,IAAA,EAAK,SAAA,EAAU,SAAA,EAAW,gBAAO,OAAA,EAAS,gBAAA,EAAgB,QAAA,EAAU,KAAA,EAAO,eAC5G,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,MACA,QAAA,CAAS;AAAA;AACX,GAAA,EACJ,CAAA;AAEJ;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-XWPXW46D.js","sourcesContent":["/* Every value is a token (--tooltip-*). Position comes in as --_x/--_y from the floating hook. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .tooltip {\n    --_gap: var(--tooltip-gap);\n\n    position: fixed;\n    z-index: var(--tooltip-layer);\n    inset-block-start: var(--_y);\n    inset-inline-start: var(--_x);\n    max-inline-size: var(--tooltip-max-width);\n    padding-block: var(--tooltip-padding-block);\n    padding-inline: var(--tooltip-padding-inline);\n    border-radius: var(--tooltip-radius);\n    background-color: var(--tooltip-bg);\n    color: var(--tooltip-fg);\n    font-family: var(--font-family-body);\n    font-size: var(--tooltip-font-size);\n    line-height: var(--font-line-height-normal);\n    box-shadow: var(--tooltip-shadow);\n    pointer-events: none;\n    animation: fade var(--tooltip-duration) var(--motion-easing-standard);\n  }\n\n  @keyframes fade {\n    from {\n      opacity: 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .tooltip {\n      animation: none;\n    }\n  }\n}\n","import { useCallback, useEffect, useId, useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { renderAsChild } from '../internal/asChild';\nimport { useFloatingPosition, type FloatingPlacement } from '../internal/floating';\nimport styles from './Tooltip.module.css';\n\nexport type TooltipPlacement = FloatingPlacement;\n\nexport interface TooltipProps {\n  /** The tooltip text. Supplementary only: it must not be the control's only name. */\n  content: ReactNode;\n  /** Preferred side; flips when there is no room. @default 'top' */\n  placement?: TooltipPlacement;\n  /** Hover delay in milliseconds. Focus shows immediately. @default 300 */\n  delay?: number;\n  /** The single element that owns the tooltip; it receives the hover, focus and `aria-describedby` wiring. */\n  children: ReactElement;\n}\n\n/**\n * A short description shown on hover or focus and linked with\n * `aria-describedby` while visible. Never the only name of a control: use it\n * for extra detail, and give icon-only controls a real label. Escape hides it.\n *\n * @status stable\n * @category Overlays\n * @accessibility Shown on hover after a delay and on focus immediately; the trigger gets `aria-describedby` pointing at the `tooltip` while it is visible; Escape hides it. It is a description, never a name.\n * @do Use it for extra detail on controls that already have a name.\n * @dont Put interactive content in it.\n * Use it to name an icon-only control; use IconButton's `label`.\n */\nexport function Tooltip({ content, placement = 'top', delay = 300, children }: TooltipProps) {\n  const id = useId();\n  const [open, setOpen] = useState(false);\n  const timer = useRef<ReturnType<typeof setTimeout>>(undefined);\n  const { refs, positionStyle, placement: resolved } = useFloatingPosition({ open, placement });\n\n  const show = useCallback(\n    (wait: number) => {\n      clearTimeout(timer.current);\n      if (wait === 0) setOpen(true);\n      else timer.current = setTimeout(() => setOpen(true), wait);\n    },\n    [],\n  );\n  const hide = useCallback(() => {\n    clearTimeout(timer.current);\n    setOpen(false);\n  }, []);\n\n  useEffect(() => () => clearTimeout(timer.current), []);\n  useEffect(() => {\n    if (!open) return;\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === 'Escape') hide();\n    };\n    document.addEventListener('keydown', onKeyDown);\n    return () => document.removeEventListener('keydown', onKeyDown);\n  }, [open, hide]);\n\n  // The helper merges these handlers with the child's own and forwards the ref.\n  // eslint-disable-next-line react-hooks/refs -- forwarded to the reference element, not read\n  const trigger = renderAsChild('Tooltip', children, {\n    ref: refs.setReference,\n    onMouseEnter: () => show(delay),\n    onMouseLeave: hide,\n    onFocus: () => show(0),\n    onBlur: hide,\n    'aria-describedby': open ? id : undefined,\n  });\n\n  return (\n    <>\n      {trigger}\n      {open &&\n        createPortal(\n          // eslint-disable-next-line react/forbid-dom-props -- per-instance position (--_x/--_y), see internal/floating.ts\n          <div ref={refs.setFloating} id={id} role=\"tooltip\" className={styles.tooltip} data-placement={resolved} style={positionStyle}>\n            {content}\n          </div>,\n          document.body,\n        )}\n    </>\n  );\n}\n\nTooltip.displayName = 'Tooltip';\n"]}

package/dist/{chunk-UX42PQLT.js → chunk-Y4YVAHD2.js}

@@ -1,6 +1,6 @@
-import { calendarRootClass, CalendarGrid, fromDate, toDate } from './chunk-OXYP34CG.js';
-import { isPresent, AriaFieldLabel, AriaFieldDescription, AriaFieldError, ariaFieldClass } from './chunk-4HRNRTXI.js';
-import { Icon } from './chunk-ASNTNTJW.js';
+import { calendarRootClass, CalendarGrid, fromDate, toDate } from './chunk-JOGIN4SS.js';
+import { isPresent, AriaFieldLabel, AriaFieldDescription, AriaFieldError, ariaFieldClass } from './chunk-IRNTXAA7.js';
+import { Icon } from './chunk-O5LII5XP.js';
 import { DatePicker as DatePicker$1, Group, DateInput, DateSegment, Button, Popover, Dialog, Calendar as Calendar$1, I18nProvider } from 'react-aria-components';
 import { Calendar } from '@pearpages/pulp-icons';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -72,5 +72,5 @@ function DatePicker({
 DatePicker.displayName = "DatePicker";
 
 export { DatePicker };
-//# sourceMappingURL=chunk-UX42PQLT.js.map
-//# sourceMappingURL=chunk-UX42PQLT.js.map
+//# sourceMappingURL=chunk-Y4YVAHD2.js.map
+//# sourceMappingURL=chunk-Y4YVAHD2.js.map

package/dist/chunk-Y4YVAHD2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/date-picker/DatePicker.module.css","../src/date-picker/DatePicker.tsx"],"names":["root","control","input","segment","button","popover","dialog","AriaDatePicker","AriaGroup","AriaDateInput","AriaDateSegment","AriaButton","CalendarIcon","AriaPopover","AriaDialog","AriaCalendar"],"mappings":"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","file":"chunk-Y4YVAHD2.js","sourcesContent":["/*\n * Every value is a token (--date-picker-*); the calendar reads --calendar-*.\n * The control is a group drawn like a text field around the date segments.\n * React Aria writes the state: data-focus-within, data-hovered,\n * data-disabled, data-invalid on the group; data-placeholder, data-focused\n * on each segment.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    --_height: var(--date-picker-height-md);\n    --_font-size: var(--date-picker-font-size-md);\n    --_border: var(--date-picker-border-default);\n\n    font-family: var(--date-picker-font-family);\n\n    &[data-size=\"sm\"] {\n      --_height: var(--date-picker-height-sm);\n      --_font-size: var(--date-picker-font-size-sm);\n    }\n\n    &[data-size=\"lg\"] {\n      --_height: var(--date-picker-height-lg);\n      --_font-size: var(--date-picker-font-size-lg);\n    }\n\n    &[data-invalid] { --_border: var(--date-picker-border-invalid); }\n  }\n\n  .control {\n    display: flex;\n    align-items: center;\n    min-block-size: var(--_height);\n    padding-inline-start: var(--date-picker-padding-inline);\n    border: var(--size-hairline) solid var(--_border);\n    border-radius: var(--date-picker-radius);\n    background-color: var(--date-picker-bg);\n    color: var(--date-picker-fg);\n    font-size: var(--_font-size);\n    transition: border-color var(--date-picker-motion-duration) var(--motion-easing-standard);\n\n    &[data-focus-within] {\n      border-color: var(--date-picker-border-focus);\n      outline: var(--date-picker-focus-ring-width) solid var(--date-picker-focus-ring);\n      outline-offset: var(--date-picker-focus-ring-offset);\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-hovered]:not([data-focus-within], [data-disabled]) {\n      border-color: var(--date-picker-border-hover);\n    }\n  }\n\n  .input {\n    display: flex;\n    flex: 1;\n    align-items: center;\n  }\n\n  .segment {\n    padding-inline: var(--date-picker-segment-padding-inline);\n    border-radius: var(--date-picker-segment-radius);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    caret-color: transparent;\n\n    &[data-type=\"literal\"] {\n      padding-inline: 0;\n    }\n\n    &[data-placeholder] {\n      color: var(--date-picker-segment-fg-placeholder);\n    }\n\n    &[data-focused] {\n      background-color: var(--date-picker-segment-bg-focus);\n      color: var(--date-picker-fg);\n    }\n  }\n\n  .button {\n    display: grid;\n    place-items: center;\n    inline-size: var(--date-picker-icon-size);\n    block-size: calc(var(--_height) - 2 * var(--size-hairline));\n    padding: 0;\n    border: none;\n    border-radius: var(--date-picker-radius);\n    background-color: transparent;\n    color: var(--date-picker-icon);\n    cursor: pointer;\n\n    &[data-focus-visible] {\n      outline: var(--date-picker-focus-ring-width) solid var(--date-picker-focus-ring);\n      outline-offset: calc(-1 * var(--date-picker-focus-ring-width));\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n    }\n  }\n\n  .popover {\n    padding-block-start: var(--date-picker-gap);\n    animation: fade var(--date-picker-popover-duration) var(--motion-easing-standard);\n\n    &[data-placement=\"top\"] {\n      padding-block: 0 var(--date-picker-gap);\n    }\n  }\n\n  .dialog {\n    border: var(--size-hairline) solid var(--date-picker-dialog-border);\n    border-radius: var(--date-picker-dialog-radius);\n    background-color: var(--date-picker-dialog-bg);\n    box-shadow: var(--date-picker-popover-shadow);\n    outline: none;\n  }\n\n  @keyframes fade {\n    from {\n      opacity: 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .popover {\n      animation: none;\n    }\n  }\n}\n","import type { ReactNode, Ref } from 'react';\nimport {\n  Button as AriaButton,\n  Calendar as AriaCalendar,\n  DateInput as AriaDateInput,\n  DatePicker as AriaDatePicker,\n  DateSegment as AriaDateSegment,\n  Dialog as AriaDialog,\n  Group as AriaGroup,\n  I18nProvider,\n  Popover as AriaPopover,\n} from 'react-aria-components';\nimport { Calendar as CalendarIcon } from '@pearpages/pulp-icons';\nimport { CalendarGrid, calendarRootClass } from '../calendar/CalendarGrid';\nimport { Icon } from '../icon';\nimport { AriaFieldDescription, AriaFieldError, AriaFieldLabel, ariaFieldClass, isPresent } from '../internal/AriaField';\nimport { fromDate, toDate } from '../internal/dates';\nimport styles from './DatePicker.module.css';\n\nexport type DatePickerSize = 'sm' | 'md' | 'lg';\n\nexport interface DatePickerProps {\n  /** Visible label. Always rendered. */\n  label: ReactNode;\n  description?: ReactNode;\n  /** Presence marks the control invalid and announces the message. */\n  error?: ReactNode;\n  /** The date as `YYYY-MM-DD` (controlled). `null` is \"none\". */\n  value?: string | null;\n  defaultValue?: string | null;\n  onChange?: (value: string | null) => void;\n  /** Earliest selectable date, `YYYY-MM-DD`. */\n  min?: string;\n  /** Latest selectable date, `YYYY-MM-DD`. */\n  max?: string;\n  /** Marks single dates as unavailable in the calendar. */\n  isDateUnavailable?: (date: string) => boolean;\n  /** BCP 47 tag. Segment order, month names and the first weekday follow it; defaults to the browser's. */\n  locale?: string;\n  /** @default 'md' */\n  size?: DatePickerSize;\n  /** @default false */\n  required?: boolean;\n  /** @default false */\n  disabled?: boolean;\n  /** @default false */\n  readOnly?: boolean;\n  /** Submitted with a form as `YYYY-MM-DD` through a hidden input. */\n  name?: string;\n  autoFocus?: boolean;\n  /** Applied to the field wrapper. */\n  className?: string;\n  /** The wrapper element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * A date field with a calendar popover, on React Aria's date picker\n * (decision record 001): the date is typed segment by segment in the\n * user's locale order (arrows and digits, no free text to parse), and the\n * button opens the same month grid as Calendar. Dates cross the API as\n * ISO strings.\n *\n * @status experimental\n * @category Forms\n * @accessibility A `group` named by the label holding one `spinbutton` per date segment (day, month, year in the locale's order), a button that opens a `dialog` containing the Calendar grid, and a hidden input for forms. Arrows step a segment, digits type it, Escape closes the dialog and returns focus.\n * @do Pass `locale` when the app's language is not the browser's.\n * Use `min`/`max` for ranges the user cannot choose outside of.\n * @dont Parse the value yourself; it is always `YYYY-MM-DD`.\n * Use it for a date of birth decades away; the segments are faster than the calendar.\n */\nexport function DatePicker({\n  label,\n  description,\n  error,\n  value,\n  defaultValue,\n  onChange,\n  min,\n  max,\n  isDateUnavailable,\n  locale,\n  size = 'md',\n  required = false,\n  disabled = false,\n  readOnly = false,\n  name,\n  autoFocus,\n  className,\n  ref,\n}: DatePickerProps) {\n  const invalid = isPresent(error);\n  const picker = (\n    <AriaDatePicker\n      ref={ref}\n      className={ariaFieldClass(styles.root, className)}\n      data-size={size}\n      value={toDate(value)}\n      defaultValue={toDate(defaultValue)}\n      onChange={(date) => onChange?.(fromDate(date))}\n      minValue={toDate(min) ?? undefined}\n      maxValue={toDate(max) ?? undefined}\n      isDateUnavailable={isDateUnavailable && ((date) => isDateUnavailable(fromDate(date) ?? ''))}\n      isRequired={required}\n      isDisabled={disabled}\n      isReadOnly={readOnly}\n      isInvalid={invalid}\n      name={name}\n      autoFocus={autoFocus}\n      granularity=\"day\"\n    >\n      <AriaFieldLabel required={required}>{label}</AriaFieldLabel>\n      <AriaGroup className={styles.control}>\n        <AriaDateInput className={styles.input}>{(segment) => <AriaDateSegment segment={segment} className={styles.segment} />}</AriaDateInput>\n        <AriaButton className={styles.button}>\n          <Icon size=\"inherit\">\n            <CalendarIcon />\n          </Icon>\n        </AriaButton>\n      </AriaGroup>\n      <AriaFieldDescription>{description}</AriaFieldDescription>\n      <AriaFieldError>{error}</AriaFieldError>\n      <AriaPopover className={styles.popover} placement=\"bottom start\">\n        <AriaDialog className={styles.dialog}>\n          <AriaCalendar className={calendarRootClass}>\n            <CalendarGrid />\n          </AriaCalendar>\n        </AriaDialog>\n      </AriaPopover>\n    </AriaDatePicker>\n  );\n  return locale ? <I18nProvider locale={locale}>{picker}</I18nProvider> : picker;\n}\n\nDatePicker.displayName = 'DatePicker';\n"]}

package/dist/{chunk-P5C2U5ZF.js → chunk-YBECKOVP.js}

@@ -1,4 +1,4 @@
-import { AriaField_default } from './chunk-YUHS5S5Y.js';
+import { AriaField_default } from './chunk-DGIXNUNI.js';
 import { classes } from './chunk-MI4QUKQS.js';
 import { Slider as Slider$1, Label, SliderOutput, SliderTrack, SliderFill, SliderThumb, Text } from 'react-aria-components';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -69,5 +69,5 @@ function Slider({
 Slider.displayName = "Slider";
 
 export { Slider };
-//# sourceMappingURL=chunk-P5C2U5ZF.js.map
-//# sourceMappingURL=chunk-P5C2U5ZF.js.map
+//# sourceMappingURL=chunk-YBECKOVP.js.map
+//# sourceMappingURL=chunk-YBECKOVP.js.map

package/dist/chunk-YBECKOVP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/slider/Slider.module.css","../src/slider/Slider.tsx"],"names":["root","header","hidden","output","track","rail","fill","thumb","AriaSlider","AriaLabel","AriaSliderOutput","AriaSliderTrack","AriaSliderFill","AriaSliderThumb","AriaText"],"mappings":"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","file":"chunk-YBECKOVP.js","sourcesContent":["/*\n * Every value is a token (--slider-*); the label and description read\n * --field-*. React Aria positions the thumbs and the fill (its inline\n * values); the rail is the visible track inside a larger pointer target.\n * State: data-orientation and data-disabled on the root; data-dragging,\n * data-hovered, data-focus-visible on a thumb.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    --_thumb: var(--slider-thumb-size);\n\n    display: flex;\n    flex-direction: column;\n    gap: var(--slider-gap);\n    inline-size: 100%;\n    font-family: var(--slider-font-family);\n\n    &[data-orientation=\"vertical\"] {\n      inline-size: auto;\n      block-size: var(--slider-track-length);\n    }\n\n  }\n\n  .header {\n    display: flex;\n    justify-content: space-between;\n    gap: var(--slider-gap);\n  }\n\n  .hidden {\n    position: absolute;\n    inline-size: var(--size-hairline);\n    block-size: var(--size-hairline);\n    overflow: hidden;\n    clip-path: inset(50%);\n    white-space: nowrap;\n  }\n\n  .output {\n    color: var(--slider-output-fg);\n    font-family: var(--slider-output-font-family);\n    font-size: var(--slider-output-font-size);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .track {\n    position: relative;\n    block-size: var(--slider-track-hit-size);\n\n    .root[data-orientation=\"vertical\"] & {\n      inline-size: var(--slider-track-hit-size);\n      block-size: 100%;\n    }\n  }\n\n  /* Disabled dims the track, not the label and output, so the text keeps its contrast. */\n  .root[data-disabled] .track {\n    opacity: 0.55;\n  }\n\n  .rail {\n    position: absolute;\n    inset-block-start: 50%;\n    inline-size: 100%;\n    block-size: var(--slider-track-size);\n    overflow: hidden;\n    border-radius: var(--slider-track-radius);\n    background-color: var(--slider-track-bg);\n    translate: 0 -50%;\n\n    .root[data-orientation=\"vertical\"] & {\n      inset-block-start: 0;\n      inset-inline-start: 50%;\n      inline-size: var(--slider-track-size);\n      block-size: 100%;\n      translate: -50% 0;\n    }\n  }\n\n  .fill {\n    position: absolute;\n    block-size: 100%;\n    background-color: var(--slider-fill);\n\n    .root[data-orientation=\"vertical\"] & {\n      inline-size: 100%;\n    }\n  }\n\n  .thumb {\n    inset-block-start: 50%;\n    inline-size: var(--_thumb);\n    block-size: var(--_thumb);\n    border: var(--slider-thumb-border-width) solid var(--slider-thumb-border);\n    border-radius: var(--slider-thumb-radius);\n    background-color: var(--slider-thumb-bg);\n    box-shadow: var(--slider-thumb-shadow);\n    cursor: grab;\n    transition: border-color var(--slider-motion-duration) var(--motion-easing-standard);\n\n    .root[data-orientation=\"vertical\"] & {\n      inset-block-start: auto;\n      inset-inline-start: 50%;\n    }\n\n    &[data-hovered],\n    &[data-dragging] {\n      border-color: var(--slider-thumb-border-hover);\n    }\n\n    &[data-dragging] {\n      cursor: grabbing;\n    }\n\n    &[data-focus-visible] {\n      outline: var(--slider-focus-ring-width) solid var(--slider-focus-ring);\n      outline-offset: var(--slider-focus-ring-offset);\n    }\n  }\n}\n","import type { ReactNode, Ref } from 'react';\nimport {\n  Label as AriaLabel,\n  Slider as AriaSlider,\n  SliderFill as AriaSliderFill,\n  SliderOutput as AriaSliderOutput,\n  SliderThumb as AriaSliderThumb,\n  SliderTrack as AriaSliderTrack,\n  Text as AriaText,\n} from 'react-aria-components';\nimport { classes } from '../internal/classes';\nimport fieldStyles from '../internal/AriaField.module.css';\nimport styles from './Slider.module.css';\n\nexport type SliderValue = number | [number, number];\nexport type SliderOrientation = 'horizontal' | 'vertical';\n\nexport interface SliderProps<T extends SliderValue = number> {\n  /** Visible label. Always rendered; `hideLabel` keeps it for assistive technology only. */\n  label: ReactNode;\n  /** @default false */\n  hideLabel?: boolean;\n  description?: ReactNode;\n  /** One number, or a `[start, end]` pair for a range with two thumbs. */\n  value?: T;\n  defaultValue?: T;\n  /** Called on every change while dragging or pressing arrows. */\n  onChange?: (value: T) => void;\n  /** Called once when the drag ends or the key is released. */\n  onChangeEnd?: (value: T) => void;\n  /** @default 0 */\n  min?: number;\n  /** @default 100 */\n  max?: number;\n  /** @default 1 */\n  step?: number;\n  /** How the value reads in the output and to assistive technology, for instance `{ style: 'percent' }` or `{ style: 'currency', currency: 'EUR' }`. */\n  formatOptions?: Intl.NumberFormatOptions;\n  /** Names for the two thumbs of a range. @default ['Minimum', 'Maximum'] */\n  thumbLabels?: readonly [string, string];\n  /** Show the formatted value next to the label. @default true */\n  showOutput?: boolean;\n  /** @default 'horizontal' */\n  orientation?: SliderOrientation;\n  /** @default false */\n  disabled?: boolean;\n  /** Submitted with a form; a range submits two inputs with this name. */\n  name?: string;\n  className?: string;\n  /** The group element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * Picks a number, or a range, on a track: React Aria's slider (decision\n * record 001) provides the hidden range inputs, arrow, Page Up/Down, Home and\n * End keys, drag with a thumb that stays under the pointer, and\n * `aria-valuetext` in the formatted form. The output element shows the\n * same text, so what a screen reader hears is what sighted users see.\n *\n * @status experimental\n * @category Forms\n * @accessibility A `group` named by the label containing one hidden `input type=\"range\"` per thumb (named by `thumbLabels` for a range) with `aria-valuetext` in the formatted form; the `output` element shows the same text. Arrows step, Page Up/Down step by ten, Home/End jump; thumbs drag with mouse or touch.\n * @do Set `formatOptions` so the spoken value matches the unit (\"40%\", \"€200\").\n * Use `hideLabel` only when a visible heading already names it.\n * @dont Use it for precise values; provide a numeric field alongside.\n * Use a `step` so small the keyboard cannot reach the ends in reasonable time.\n */\nexport function Slider<T extends SliderValue = number>({\n  label,\n  hideLabel = false,\n  description,\n  value,\n  defaultValue,\n  onChange,\n  onChangeEnd,\n  min = 0,\n  max = 100,\n  step = 1,\n  formatOptions,\n  thumbLabels = ['Minimum', 'Maximum'],\n  showOutput = true,\n  orientation = 'horizontal',\n  disabled = false,\n  name,\n  className,\n  ref,\n}: SliderProps<T>) {\n  const range = Array.isArray(value ?? defaultValue);\n  return (\n    <AriaSlider\n      ref={ref}\n      className={classes(styles.root, className)}\n      data-range={range ? '' : undefined}\n      value={value as number | number[] | undefined}\n      defaultValue={(defaultValue ?? (range ? [min, max] : min)) as number | number[]}\n      onChange={onChange as ((value: number | number[]) => void) | undefined}\n      onChangeEnd={onChangeEnd as ((value: number | number[]) => void) | undefined}\n      minValue={min}\n      maxValue={max}\n      step={step}\n      formatOptions={formatOptions}\n      orientation={orientation}\n      isDisabled={disabled}\n    >\n      <div className={styles.header}>\n        <AriaLabel className={classes(fieldStyles.label, hideLabel && styles.hidden)}>{label}</AriaLabel>\n        {showOutput && <AriaSliderOutput className={styles.output} />}\n      </div>\n      <AriaSliderTrack className={styles.track}>\n        <span className={styles.rail} aria-hidden=\"true\">\n          <AriaSliderFill className={styles.fill} />\n        </span>\n        <AriaSliderThumb index={0} className={styles.thumb} aria-label={range ? thumbLabels[0] : undefined} name={name} />\n        {range && <AriaSliderThumb index={1} className={styles.thumb} aria-label={thumbLabels[1]} name={name} />}\n      </AriaSliderTrack>\n      {description && (\n        <AriaText slot=\"description\" className={fieldStyles.description}>\n          {description}\n        </AriaText>\n      )}\n    </AriaSlider>\n  );\n}\n\nSlider.displayName = 'Slider';\n"]}

package/dist/{chunk-75GTNRBH.js → chunk-YK2OOM56.js}

@@ -1,4 +1,4 @@
-import { VisuallyHidden } from './chunk-Z4PN6B2C.js';
+import { VisuallyHidden } from './chunk-IB5UUE3S.js';
 import { classes } from './chunk-MI4QUKQS.js';
 import { useId } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -41,5 +41,5 @@ function Progress({ value, max = 100, label, hideLabel = false, valueText, tone
 Progress.displayName = "Progress";
 
 export { Progress };
-//# sourceMappingURL=chunk-75GTNRBH.js.map
-//# sourceMappingURL=chunk-75GTNRBH.js.map
+//# sourceMappingURL=chunk-YK2OOM56.js.map
+//# sourceMappingURL=chunk-YK2OOM56.js.map

package/dist/chunk-YK2OOM56.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/progress/Progress.module.css","../src/progress/Progress.tsx"],"names":["progress","header","label","value","track","indicator"],"mappings":";;;;;;AAAA,IAAA,gBAAA,GAAA;AAAA,EAKG,QAAA,EAAAA,mBAAAA;AAAA,EAeA,MAAA,EAAAC,iBAAAA;AAAA,EAOA,KAAA,EAAAC,gBAAAA;AAAA,EAIA,KAAA,EAAAC,gBAAAA;AAAA,EAKA,KAAA,EAAAC,gBAAAA;AAAA,EAOA,SAAA,EAAAC,oBAUY,CAAA;ACfR,SAAS,SAAS,EAAE,KAAA,EAAO,GAAA,GAAM,GAAA,EAAK,OAAO,SAAA,GAAY,KAAA,EAAO,SAAA,EAAW,IAAA,GAAO,WAAW,IAAA,GAAO,IAAA,EAAM,WAAW,GAAA,EAAK,GAAG,MAAK,EAAkB;AACzJ,EAAA,MAAM,KAAK,KAAA,EAAM;AACjB,EAAA,MAAM,OAAA,GAAU,GAAG,EAAE,CAAA,MAAA,CAAA;AACrB,EAAA,MAAM,gBAAgB,KAAA,KAAU,MAAA;AAChC,EAAA,MAAM,OAAA,GAAU,aAAA,GAAgB,CAAA,GAAI,IAAA,CAAK,GAAA,CAAI,GAAA,EAAK,IAAA,CAAK,GAAA,CAAI,CAAA,EAAI,KAAA,GAAQ,GAAA,GAAO,GAAG,CAAC,CAAA;AAClF,EAAA,MAAM,IAAA,GAAO,gBAAgB,MAAA,GAAa,SAAA,IAAa,GAAG,IAAA,CAAK,KAAA,CAAM,OAAO,CAAC,CAAA,CAAA,CAAA;AAE7E,EAAA,MAAM,IAAA,GAAO,EAAE,UAAA,EAAY,CAAA,EAAG,OAAO,CAAA,CAAA,CAAA,EAAI;AAEzC,EAAA,4BACG,KAAA,EAAA,EAAK,GAAG,MAAM,GAAA,EAAU,SAAA,EAAW,QAAQ,gBAAA,CAAO,QAAA,EAAU,SAAS,CAAA,EAAG,aAAW,IAAA,EAAM,WAAA,EAAW,MAAM,oBAAA,EAAoB,aAAA,GAAgB,KAAK,MAAA,EAClJ,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,gBAAA,CAAO,MAAA,EACpB,QAAA,EAAA;AAAA,MAAA,SAAA,mBACC,GAAA,CAAC,cAAA,EAAA,EAAe,EAAA,EAAI,OAAA,EAAU,QAAA,EAAA,KAAA,EAAM,CAAA,mBAEpC,GAAA,CAAC,MAAA,EAAA,EAAK,EAAA,EAAI,OAAA,EAAS,SAAA,EAAW,gBAAA,CAAO,OAClC,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,MAED,IAAA,IAAQ,CAAC,SAAA,oBAAa,GAAA,CAAC,UAAK,SAAA,EAAW,gBAAA,CAAO,OAAQ,QAAA,EAAA,IAAA,EAAK;AAAA,KAAA,EAC9D,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,aAAA;AAAA,QACL,iBAAA,EAAiB,OAAA;AAAA,QACjB,eAAA,EAAe,CAAA;AAAA,QACf,eAAA,EAAe,GAAA;AAAA,QACf,eAAA,EAAe,gBAAgB,MAAA,GAAY,KAAA;AAAA,QAC3C,gBAAA,EAAgB,IAAA;AAAA,QAChB,WAAW,gBAAA,CAAO,KAAA;AAAA,QAGlB,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,gBAAA,CAAO,SAAA,EAAW,OAAO,IAAA,EAAM;AAAA;AAAA;AACjD,GAAA,EACF,CAAA;AAEJ;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-YK2OOM56.js","sourcesContent":["/* Every value is a token (--progress-*). The fill width is the per-instance --_value custom property. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .progress {\n    --_height: var(--progress-height-md);\n    --_indicator: var(--progress-indicator-primary);\n\n    display: flex;\n    flex-direction: column;\n    gap: var(--progress-gap);\n    font-family: var(--font-family-body);\n\n    &[data-size=\"sm\"] { --_height: var(--progress-height-sm); }\n    &[data-tone=\"success\"] { --_indicator: var(--progress-indicator-success); }\n    &[data-tone=\"warning\"] { --_indicator: var(--progress-indicator-warning); }\n    &[data-tone=\"error\"] { --_indicator: var(--progress-indicator-error); }\n  }\n\n  .header {\n    display: flex;\n    justify-content: space-between;\n    gap: var(--space-3);\n    font-size: var(--progress-label-font-size);\n  }\n\n  .label {\n    color: var(--progress-label-fg);\n  }\n\n  .value {\n    color: var(--progress-value-fg);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .track {\n    overflow: hidden;\n    block-size: var(--_height);\n    border-radius: var(--progress-radius);\n    background-color: var(--progress-track);\n  }\n\n  .indicator {\n    block-size: 100%;\n    inline-size: var(--_value, 0%);\n    border-radius: var(--progress-radius);\n    background-color: var(--_indicator);\n    transition: inline-size var(--progress-duration) var(--motion-easing-standard);\n  }\n\n  .progress[data-indeterminate] .indicator {\n    inline-size: 40%;\n    animation: slide calc(4 * var(--progress-duration)) var(--motion-easing-standard) infinite;\n  }\n\n  @keyframes slide {\n    from {\n      translate: -100% 0;\n    }\n\n    to {\n      translate: 250% 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .progress[data-indeterminate] .indicator {\n      inline-size: 50%;\n      animation: none;\n    }\n  }\n}\n","import { useId, type CSSProperties, type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport { VisuallyHidden } from '../visually-hidden';\nimport styles from './Progress.module.css';\n\nexport type ProgressTone = 'primary' | 'success' | 'warning' | 'error';\nexport type ProgressSize = 'sm' | 'md';\n\nexport interface ProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {\n  /** Current value; omit for indeterminate. */\n  value?: number;\n  /** @default 100 */\n  max?: number;\n  /** Required: what is progressing. Visible unless `hideLabel`. */\n  label: ReactNode;\n  /** Keep the label for assistive technology only. @default false */\n  hideLabel?: boolean;\n  /** Human-readable value (\"3 of 10 files\"); defaults to a percentage. */\n  valueText?: string;\n  /** @default 'primary' */\n  tone?: ProgressTone;\n  /** @default 'md' */\n  size?: ProgressSize;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * A determinate or indeterminate progress bar. The bar is `role=\"progressbar\"`\n * labelled by the visible (or visually hidden) label; the fill width is the\n * one place in the library that carries a per-instance inline value, set as\n * a custom property. Indeterminate motion stops under reduced motion.\n *\n * @status stable\n * @category Feedback\n * @accessibility `role=\"progressbar\"` labelled by the required `label` (visible or visually hidden), with `aria-valuenow`/`aria-valuemin`/`aria-valuemax` when determinate and `aria-valuetext` from `valueText`. Indeterminate bars omit `aria-valuenow`.\n * @do Set `valueText` when the percentage is not the meaningful reading (\"3 of 5 files\").\n * @dont Use it for an unknown wait shorter than a few seconds; use Spinner.\n */\nexport function Progress({ value, max = 100, label, hideLabel = false, valueText, tone = 'primary', size = 'md', className, ref, ...rest }: ProgressProps) {\n  const id = useId();\n  const labelId = `${id}-label`;\n  const indeterminate = value === undefined;\n  const percent = indeterminate ? 0 : Math.min(100, Math.max(0, (value / max) * 100));\n  const text = indeterminate ? undefined : (valueText ?? `${Math.round(percent)}%`);\n  // The single per-instance value the bar needs. A stylesheet cannot enumerate percentages.\n  const fill = { '--_value': `${percent}%` } as CSSProperties;\n\n  return (\n    <div {...rest} ref={ref} className={classes(styles.progress, className)} data-size={size} data-tone={tone} data-indeterminate={indeterminate ? '' : undefined}>\n      <div className={styles.header}>\n        {hideLabel ? (\n          <VisuallyHidden id={labelId}>{label}</VisuallyHidden>\n        ) : (\n          <span id={labelId} className={styles.label}>\n            {label}\n          </span>\n        )}\n        {text && !hideLabel && <span className={styles.value}>{text}</span>}\n      </div>\n      <div\n        role=\"progressbar\"\n        aria-labelledby={labelId}\n        aria-valuemin={0}\n        aria-valuemax={max}\n        aria-valuenow={indeterminate ? undefined : value}\n        aria-valuetext={text}\n        className={styles.track}\n      >\n        {/* eslint-disable-next-line react/forbid-dom-props -- per-instance fill width, see the component JSDoc */}\n        <div className={styles.indicator} style={fill} />\n      </div>\n    </div>\n  );\n}\n\nProgress.displayName = 'Progress';\n"]}

package/dist/{chunk-DWE374JX.js → chunk-Z6SS4G4V.js}

@@ -1,4 +1,4 @@
-import { ToggleField } from './chunk-BBV4L5WO.js';
+import { ToggleField } from './chunk-6BIEW4WJ.js';
 import { useCallback } from 'react';
 import { jsx } from 'react/jsx-runtime';
 
@@ -61,5 +61,5 @@ function Checkbox({
 Checkbox.displayName = "Checkbox";
 
 export { Checkbox };
-//# sourceMappingURL=chunk-DWE374JX.js.map
-//# sourceMappingURL=chunk-DWE374JX.js.map
+//# sourceMappingURL=chunk-Z6SS4G4V.js.map
+//# sourceMappingURL=chunk-Z6SS4G4V.js.map

package/dist/chunk-Z6SS4G4V.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/checkbox/Checkbox.module.css","../src/checkbox/Checkbox.tsx"],"names":["checkbox","row","input"],"mappings":";;;;;AAAA,IAAA,gBAAA,GAAA;AAAA,EASG,QAAA,EAAAA,mBAAAA;AAAA,EAWA,GAAA,EAAAC,cAAAA;AAAA,EAMA,KAAA,EAAAC;AAAA,CAAA;ACWI,SAAS,QAAA,CAAS;AAAA,EACvB,KAAA;AAAA,EACA,WAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,aAAA,GAAgB,KAAA;AAAA,EAChB,QAAA;AAAA,EACA,QAAA;AAAA,EACA,EAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAA;AAAA,EACA,kBAAA,EAAoB,WAAA;AAAA,EACpB,GAAG;AACL,CAAA,EAAkB;AAEhB,EAAA,MAAM,MAAA,GAAS,WAAA;AAAA,IACb,CAAC,OAAA,KAAqC;AACpC,MAAA,IAAI,OAAA,UAAiB,aAAA,GAAgB,aAAA;AACrC,MAAA,IAAI,OAAO,GAAA,KAAQ,UAAA,EAAY,GAAA,CAAI,OAAO,CAAA;AAAA,WAAA,IACjC,GAAA,MAAS,OAAA,GAAU,OAAA;AAAA,IAC9B,CAAA;AAAA,IACA,CAAC,eAAe,GAAG;AAAA,GACrB;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,WAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,EAAA;AAAA,MACA,SAAA;AAAA,MACA,eAAe,gBAAA,CAAO,QAAA;AAAA,MACtB,cAAc,gBAAA,CAAO,GAAA;AAAA,MACrB,kBAAA,EAAkB,WAAA;AAAA,MAClB,OAAA,kBACE,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACE,GAAG,IAAA;AAAA,UACJ,GAAA,EAAK,MAAA;AAAA,UACL,IAAA,EAAK,UAAA;AAAA,UACL,WAAW,gBAAA,CAAO,KAAA;AAAA,UAClB,cAAA,EAAc,gBAAgB,OAAA,GAAU,MAAA;AAAA,UACxC,oBAAA,EAAoB,gBAAgB,EAAA,GAAK;AAAA;AAAA;AAC3C;AAAA,GAEJ;AAEJ;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-Z6SS4G4V.js","sourcesContent":["/*\n * Every value is a token (--checkbox-*). Size and invalid state are resolved\n * into private custom properties on the root, so the input has one rule per\n * property and no selector ordering to maintain.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .checkbox {\n    --_size: var(--checkbox-size-md);\n    --_border: var(--checkbox-border);\n\n    font-family: var(--font-family-body);\n\n    &[data-size=\"sm\"] { --_size: var(--checkbox-size-sm); }\n    &[data-size=\"lg\"] { --_size: var(--checkbox-size-lg); }\n    &[data-invalid] { --_border: var(--checkbox-border-invalid); }\n  }\n\n  .row {\n    display: flex;\n    align-items: center;\n    gap: var(--checkbox-gap);\n  }\n\n  .input {\n    display: grid;\n    flex: none;\n    place-content: center;\n    inline-size: var(--_size);\n    block-size: var(--_size);\n    margin: 0;\n    border: var(--size-hairline) solid var(--_border);\n    border-radius: var(--checkbox-radius);\n    background-color: var(--checkbox-bg);\n    appearance: none;\n    cursor: pointer;\n    transition:\n      background-color var(--checkbox-motion-duration) var(--motion-easing-standard),\n      border-color var(--checkbox-motion-duration) var(--motion-easing-standard);\n\n    /* Sized from the box, not in percent: a grid item's percentage resolves against an auto area and collapses. */\n    &::after {\n      content: \"\";\n      inline-size: calc(var(--_size) * 0.3);\n      block-size: calc(var(--_size) * 0.55);\n      border-style: solid;\n      border-color: var(--checkbox-check);\n      border-width: 0 var(--checkbox-check-width) var(--checkbox-check-width) 0;\n      rotate: 45deg;\n      translate: 0 -10%;\n      opacity: 0;\n    }\n\n    &:checked,\n    &:indeterminate {\n      border-color: var(--checkbox-bg-checked);\n      background-color: var(--checkbox-bg-checked);\n\n      &::after {\n        opacity: 1;\n      }\n    }\n\n    &:indeterminate::after {\n      inline-size: calc(var(--_size) * 0.55);\n      block-size: 0;\n      border-width: 0 0 var(--checkbox-check-width);\n      rotate: 0deg;\n      translate: 0 0;\n    }\n\n    &:focus-visible {\n      outline: var(--checkbox-focus-ring-width) solid var(--checkbox-focus-ring);\n      outline-offset: var(--checkbox-focus-ring-offset);\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &:hover:not(:disabled, :checked, :indeterminate) {\n      border-color: var(--checkbox-border-hover);\n    }\n\n    &:hover:not(:disabled):is(:checked, :indeterminate) {\n      border-color: var(--checkbox-bg-checked-hover);\n      background-color: var(--checkbox-bg-checked-hover);\n    }\n  }\n}\n","import { useCallback, type InputHTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { ToggleField, type ToggleSize } from '../internal/ToggleField';\nimport styles from './Checkbox.module.css';\n\nexport type CheckboxSize = ToggleSize;\n\nexport interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {\n  /** Visible label beside the box. */\n  label: ReactNode;\n  description?: ReactNode;\n  /** Presence marks the control invalid and announces the message. */\n  error?: ReactNode;\n  /** @default 'md' */\n  size?: CheckboxSize;\n  /** The \"some selected\" state; visual and `aria-checked=\"mixed\"`, independent of `checked`. @default false */\n  indeterminate?: boolean;\n  /** The `<input>` element. */\n  ref?: Ref<HTMLInputElement>;\n  /** Applied to the wrapper, not the input. */\n  className?: string;\n}\n\n/**\n * A native checkbox drawn with tokens: `appearance: none` on the input, the\n * box and tick in CSS, so keyboard, forms and assistive technology are the\n * browser's own. Label, description and error come from Field. Controlled and\n * uncontrolled behave like the native input. State is the native `:checked`\n * and `:indeterminate`, plus `data-indeterminate` on the input.\n *\n * @status stable\n * @category Forms\n * @accessibility A native `input type=\"checkbox\"` with `appearance: none`; label, description and error wire through Field. `indeterminate` sets the DOM property and `aria-checked=\"mixed\"`. Keyboard: Space toggles.\n * @do Use `indeterminate` for a parent whose children are partly selected.\n * Group related checkboxes under a `fieldset`.\n * @dont Use it for an immediate setting; use Switch.\n * Hide the label; the description does not name the control.\n */\nexport function Checkbox({\n  label,\n  description,\n  error,\n  size = 'md',\n  indeterminate = false,\n  required,\n  disabled,\n  id,\n  className,\n  ref,\n  'aria-describedby': describedBy,\n  ...rest\n}: CheckboxProps) {\n  // `indeterminate` is a property, not an attribute: set it on the element as it mounts and whenever it changes.\n  const setRef = useCallback(\n    (element: HTMLInputElement | null) => {\n      if (element) element.indeterminate = indeterminate;\n      if (typeof ref === 'function') ref(element);\n      else if (ref) ref.current = element;\n    },\n    [indeterminate, ref],\n  );\n\n  return (\n    <ToggleField\n      label={label}\n      description={description}\n      error={error}\n      size={size}\n      required={required}\n      disabled={disabled}\n      id={id}\n      className={className}\n      rootClassName={styles.checkbox}\n      rowClassName={styles.row}\n      aria-describedby={describedBy}\n      control={\n        <input\n          {...rest}\n          ref={setRef}\n          type=\"checkbox\"\n          className={styles.input}\n          aria-checked={indeterminate ? 'mixed' : undefined}\n          data-indeterminate={indeterminate ? '' : undefined}\n        />\n      }\n    />\n  );\n}\n\nCheckbox.displayName = 'Checkbox';\n"]}

package/dist/{chunk-I4KC4V6A.js → chunk-ZL5MMRLG.js}

@@ -1,4 +1,4 @@
-import { VisuallyHidden } from './chunk-Z4PN6B2C.js';
+import { VisuallyHidden } from './chunk-IB5UUE3S.js';
 import { classes } from './chunk-MI4QUKQS.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
@@ -27,5 +27,5 @@ function Spinner({ size = "md", tone = "default", label = "Loading", decorative
 Spinner.displayName = "Spinner";
 
 export { Spinner };
-//# sourceMappingURL=chunk-I4KC4V6A.js.map
-//# sourceMappingURL=chunk-I4KC4V6A.js.map
+//# sourceMappingURL=chunk-ZL5MMRLG.js.map
+//# sourceMappingURL=chunk-ZL5MMRLG.js.map

package/dist/chunk-ZL5MMRLG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/spinner/Spinner.module.css","../src/spinner/Spinner.tsx"],"names":["spinner","ring"],"mappings":";;;;;AAAA,IAAA,eAAA,GAAA;AAAA,EAKG,OAAA,EAAAA,iBAAAA;AAAA,EAqBA,IAAA,EAAAC,cAMY,CAAA;ACAR,SAAS,OAAA,CAAQ,EAAE,IAAA,GAAO,IAAA,EAAM,OAAO,SAAA,EAAW,KAAA,GAAQ,SAAA,EAAW,UAAA,GAAa,KAAA,EAAO,SAAA,EAAW,GAAA,EAAK,GAAG,MAAK,EAAiB;AACvI,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,SAAA,EAAW,OAAA,CAAQ,eAAA,CAAO,OAAA,EAAS,SAAS,CAAA;AAAA,MAC5C,WAAA,EAAW,IAAA;AAAA,MACX,WAAA,EAAW,IAAA;AAAA,MACX,IAAA,EAAM,aAAa,MAAA,GAAY,QAAA;AAAA,MAC/B,eAAa,UAAA,IAAc,MAAA;AAAA,MAE3B,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,eAAA,CAAO,IAAA,EAAM,eAAY,MAAA,EAAO,CAAA;AAAA,QAChD,CAAC,UAAA,oBAAc,GAAA,CAAC,cAAA,EAAA,EAAgB,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GACzC;AAEJ;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-ZL5MMRLG.js","sourcesContent":["/* Every value is a token (--spinner-*). The ring is a border with one coloured side. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .spinner {\n    --_size: var(--spinner-size-md);\n    --_track: var(--spinner-track);\n    --_indicator: var(--spinner-indicator);\n\n    display: inline-flex;\n    flex: none;\n    inline-size: var(--_size);\n    block-size: var(--_size);\n    vertical-align: middle;\n\n    &[data-size=\"sm\"] { --_size: var(--spinner-size-sm); }\n    &[data-size=\"lg\"] { --_size: var(--spinner-size-lg); }\n    &[data-size=\"inherit\"] { --_size: 1em; }\n\n    &[data-tone=\"inherit\"] {\n      --_track: transparent;\n      --_indicator: currentcolor;\n    }\n  }\n\n  .ring {\n    inline-size: 100%;\n    block-size: 100%;\n    border: var(--spinner-width) solid var(--_track);\n    border-block-start-color: var(--_indicator);\n    border-radius: var(--radius-full);\n    animation: spin var(--spinner-duration) linear infinite;\n  }\n\n  @keyframes spin {\n    to {\n      rotate: 1turn;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ring {\n      animation: none;\n    }\n  }\n}\n","import type { HTMLAttributes, Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport { VisuallyHidden } from '../visually-hidden';\nimport styles from './Spinner.module.css';\n\nexport type SpinnerSize = 'sm' | 'md' | 'lg' | 'inherit';\nexport type SpinnerTone = 'default' | 'inherit';\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLSpanElement> {\n  /** `inherit` follows the surrounding font size, for spinners inside controls. @default 'md' */\n  size?: SpinnerSize;\n  /** `inherit` draws with the surrounding text colour, for coloured controls. @default 'default' */\n  tone?: SpinnerTone;\n  /** Announced to assistive technology (`role=\"status\"`). @default 'Loading' */\n  label?: string;\n  /** Hide from assistive technology: the parent already announces busy. @default false */\n  decorative?: boolean;\n  ref?: Ref<HTMLSpanElement>;\n}\n\n/**\n * An indeterminate progress indicator. Announces its label as a status\n * unless `decorative`, in which case the parent is responsible (Button sets\n * `aria-busy`). Under reduced motion the ring stops but keeps its coloured\n * quarter, so it still reads as \"in progress\".\n *\n * @status stable\n * @category Feedback\n * @accessibility `role=\"status\"` with a visually hidden label (\"Loading\" by default) unless `decorative`, in which case the parent announces busy. Under reduced motion the ring stops but keeps its coloured quarter.\n * @do Use `decorative` inside a control that already sets `aria-busy`.\n * @dont Show several spinners for one operation.\n */\nexport function Spinner({ size = 'md', tone = 'default', label = 'Loading', decorative = false, className, ref, ...rest }: SpinnerProps) {\n  return (\n    <span\n      {...rest}\n      ref={ref}\n      className={classes(styles.spinner, className)}\n      data-size={size}\n      data-tone={tone}\n      role={decorative ? undefined : 'status'}\n      aria-hidden={decorative || undefined}\n    >\n      <span className={styles.ring} aria-hidden=\"true\" />\n      {!decorative && <VisuallyHidden>{label}</VisuallyHidden>}\n    </span>\n  );\n}\n\nSpinner.displayName = 'Spinner';\n"]}

package/dist/combobox.css

@@ -1,4 +1,5 @@
 /* src/icon/Icon.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Icon_icon {
     display: inline-flex;
@@ -24,6 +25,7 @@
 }
 
 /* src/internal/AriaField.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .AriaField_field {
     display: flex;
@@ -53,6 +55,7 @@
 }
 
 /* src/listbox/Listbox.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Listbox_list {
     display: flex;
@@ -123,6 +126,7 @@
 }
 
 /* src/visually-hidden/VisuallyHidden.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .VisuallyHidden_root {
     position: absolute;
@@ -138,6 +142,7 @@
 }
 
 /* src/spinner/Spinner.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Spinner_spinner {
     --_size: var(--spinner-size-md);
@@ -183,6 +188,7 @@
 }
 
 /* src/combobox/Combobox.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Combobox_root {
     --_height: var(--combobox-height-md);

package/dist/combobox.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/icon/Icon.module.css","../src/internal/AriaField.module.css","../src/listbox/Listbox.module.css","../src/visually-hidden/VisuallyHidden.module.css","../src/spinner/Spinner.module.css","../src/combobox/Combobox.module.css"],"sourcesContent":["/* Every value is a token (--icon-*). The child SVG fills the box; colour is currentColor. */\n\n@layer components {\n  .icon {\n    display: inline-flex;\n    flex: none;\n    inline-size: 1em;\n    block-size: 1em;\n    font-size: var(--icon-size-md);\n    vertical-align: middle;\n\n    &[data-size=\"sm\"] { font-size: var(--icon-size-sm); }\n    &[data-size=\"lg\"] { font-size: var(--icon-size-lg); }\n    &[data-size=\"inherit\"] { font-size: inherit; }\n\n    & > * {\n      inline-size: 100%;\n      block-size: 100%;\n    }\n  }\n}\n","/* The same --field-* tokens Field reads, on React Aria's label, description and error parts. */\n\n@layer components {\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--field-gap);\n    font-family: var(--font-family-body);\n  }\n\n  .label {\n    font-size: var(--field-label-font-size);\n    font-weight: var(--field-label-font-weight);\n    color: var(--field-label-fg);\n  }\n\n  .required {\n    margin-inline-start: var(--field-required-gap);\n    color: var(--field-required-fg);\n  }\n\n  .description {\n    margin: 0;\n    font-size: var(--field-description-font-size);\n    color: var(--field-description-fg);\n  }\n\n  .error {\n    margin: 0;\n    font-size: var(--field-error-font-size);\n    color: var(--field-error-fg);\n  }\n}\n","/*\n * Every value is a token (--listbox-*). React Aria writes the state:\n * data-focused (real or virtual focus), data-selected, data-disabled,\n * data-hovered, data-focus-visible, data-empty. The tick is in the DOM for\n * every option and revealed by data-selected.\n */\n\n@layer components {\n  .list {\n    display: flex;\n    flex-direction: column;\n    max-block-size: var(--listbox-max-height);\n    padding: var(--listbox-padding);\n    overflow: auto;\n    border: var(--size-hairline) solid var(--listbox-border);\n    border-radius: var(--listbox-radius);\n    background-color: var(--listbox-bg);\n    color: var(--listbox-fg);\n    font-family: var(--listbox-font-family);\n    font-size: var(--listbox-font-size);\n    outline: none;\n\n    &[data-focus-visible] {\n      outline: var(--listbox-focus-ring-width) solid var(--listbox-focus-ring);\n      outline-offset: var(--listbox-focus-ring-offset);\n    }\n  }\n\n  .check {\n    flex: none;\n    visibility: hidden;\n    color: var(--listbox-item-check);\n  }\n\n  .item {\n    display: flex;\n    align-items: center;\n    gap: var(--listbox-item-gap);\n    padding-block: var(--listbox-item-padding-block);\n    padding-inline: var(--listbox-item-padding-inline);\n    border-radius: var(--listbox-item-radius);\n    color: var(--listbox-item-fg);\n    cursor: default;\n    outline: none;\n\n    &[data-hovered],\n    &[data-focused] {\n      background-color: var(--listbox-item-bg-focus);\n    }\n\n    &[data-selected] {\n      background-color: var(--listbox-item-bg-selected);\n\n      .check {\n        visibility: visible;\n      }\n    }\n\n    &[data-disabled] {\n      color: var(--listbox-item-fg-disabled);\n      cursor: not-allowed;\n    }\n  }\n\n  .itemBody {\n    display: flex;\n    flex-direction: column;\n    min-inline-size: 0;\n  }\n\n  .itemLabel {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .itemDescription {\n    color: var(--listbox-item-fg-muted);\n    font-size: var(--listbox-item-description-font-size);\n  }\n\n  .empty {\n    padding: var(--listbox-empty-padding);\n    color: var(--listbox-empty-fg);\n  }\n}\n","/* The clip-path technique: present in the accessibility tree, absent from the layout. */\n\n@layer components {\n  .root {\n    position: absolute;\n    inline-size: var(--visually-hidden-size);\n    block-size: var(--visually-hidden-size);\n    padding: 0;\n    margin: 0;\n    overflow: hidden;\n    clip-path: inset(50%);\n    white-space: nowrap;\n    border: 0;\n  }\n}\n","/* Every value is a token (--spinner-*). The ring is a border with one coloured side. */\n\n@layer components {\n  .spinner {\n    --_size: var(--spinner-size-md);\n    --_track: var(--spinner-track);\n    --_indicator: var(--spinner-indicator);\n\n    display: inline-flex;\n    flex: none;\n    inline-size: var(--_size);\n    block-size: var(--_size);\n    vertical-align: middle;\n\n    &[data-size=\"sm\"] { --_size: var(--spinner-size-sm); }\n    &[data-size=\"lg\"] { --_size: var(--spinner-size-lg); }\n    &[data-size=\"inherit\"] { --_size: 1em; }\n\n    &[data-tone=\"inherit\"] {\n      --_track: transparent;\n      --_indicator: currentcolor;\n    }\n  }\n\n  .ring {\n    inline-size: 100%;\n    block-size: 100%;\n    border: var(--spinner-width) solid var(--_track);\n    border-block-start-color: var(--_indicator);\n    border-radius: var(--radius-full);\n    animation: spin var(--spinner-duration) linear infinite;\n  }\n\n  @keyframes spin {\n    to {\n      rotate: 1turn;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ring {\n      animation: none;\n    }\n  }\n}\n","/*\n * Every value is a token (--combobox-*); the options read --listbox-*. Size\n * and invalid state resolve into private custom properties on the root. The\n * popover is positioned by React Aria; the gap to the control is its own\n * padding, so no offset number lives in code, and --trigger-width (set by\n * the vendor) makes it as wide as the control.\n */\n\n@layer components {\n  .root {\n    --_height: var(--combobox-height-md);\n    --_font-size: var(--combobox-font-size-md);\n    --_border: var(--combobox-border-default);\n\n    font-family: var(--combobox-font-family);\n\n    &[data-size=\"sm\"] {\n      --_height: var(--combobox-height-sm);\n      --_font-size: var(--combobox-font-size-sm);\n    }\n\n    &[data-size=\"lg\"] {\n      --_height: var(--combobox-height-lg);\n      --_font-size: var(--combobox-font-size-lg);\n    }\n\n    &[data-invalid] { --_border: var(--combobox-border-invalid); }\n  }\n\n  .control {\n    display: grid;\n    align-items: center;\n\n    & > * {\n      grid-area: 1 / 1;\n    }\n  }\n\n  .input {\n    inline-size: 100%;\n    min-block-size: var(--_height);\n    padding-block: 0;\n    padding-inline: var(--combobox-padding-inline) var(--combobox-icon-size);\n    border: var(--size-hairline) solid var(--_border);\n    border-radius: var(--combobox-radius);\n    background-color: var(--combobox-bg);\n    color: var(--combobox-fg);\n    font-size: var(--_font-size);\n    transition: border-color var(--combobox-motion-duration) var(--motion-easing-standard);\n\n    &::placeholder {\n      color: var(--combobox-placeholder);\n    }\n\n    &[data-focused] {\n      border-color: var(--combobox-border-focus);\n      outline: var(--combobox-focus-ring-width) solid var(--combobox-focus-ring);\n      outline-offset: var(--combobox-focus-ring-offset);\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-hovered]:not([data-focused], [data-disabled]) {\n      border-color: var(--combobox-border-hover);\n    }\n  }\n\n  .button {\n    display: grid;\n    place-items: center;\n    inline-size: var(--combobox-icon-size);\n    block-size: var(--_height);\n    padding: 0;\n    border: none;\n    border-radius: var(--combobox-radius);\n    background-color: transparent;\n    color: var(--combobox-icon);\n    justify-self: end;\n    cursor: pointer;\n\n    &[data-focus-visible] {\n      outline: var(--combobox-focus-ring-width) solid var(--combobox-focus-ring);\n      outline-offset: calc(-1 * var(--combobox-focus-ring-width));\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n    }\n  }\n\n  .popover {\n    inline-size: var(--trigger-width);\n    padding-block-start: var(--combobox-gap);\n    animation: fade var(--combobox-popover-duration) var(--motion-easing-standard);\n\n    &[data-placement=\"top\"] {\n      padding-block: 0 var(--combobox-gap);\n    }\n  }\n\n  .list {\n    box-shadow: var(--combobox-popover-shadow);\n  }\n\n  @keyframes fade {\n    from {\n      opacity: 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .popover {\n      animation: none;\n    }\n  }\n}\n"],"mappings":"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","names":["icon","field","label","required","description","error","list","check","item","itemBody","itemLabel","itemDescription","empty","root","spinner","ring","spin","root","control","input","button","popover","list","fade"]}
+{"version":3,"sources":["../src/icon/Icon.module.css","../src/internal/AriaField.module.css","../src/listbox/Listbox.module.css","../src/visually-hidden/VisuallyHidden.module.css","../src/spinner/Spinner.module.css","../src/combobox/Combobox.module.css"],"sourcesContent":["/* Every value is a token (--icon-*). The child SVG fills the box; colour is currentColor. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .icon {\n    display: inline-flex;\n    flex: none;\n    inline-size: 1em;\n    block-size: 1em;\n    font-size: var(--icon-size-md);\n    vertical-align: middle;\n\n    &[data-size=\"sm\"] { font-size: var(--icon-size-sm); }\n    &[data-size=\"lg\"] { font-size: var(--icon-size-lg); }\n    &[data-size=\"inherit\"] { font-size: inherit; }\n\n    & > * {\n      inline-size: 100%;\n      block-size: 100%;\n    }\n  }\n}\n","/* The same --field-* tokens Field reads, on React Aria's label, description and error parts. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--field-gap);\n    font-family: var(--font-family-body);\n  }\n\n  .label {\n    font-size: var(--field-label-font-size);\n    font-weight: var(--field-label-font-weight);\n    color: var(--field-label-fg);\n  }\n\n  .required {\n    margin-inline-start: var(--field-required-gap);\n    color: var(--field-required-fg);\n  }\n\n  .description {\n    margin: 0;\n    font-size: var(--field-description-font-size);\n    color: var(--field-description-fg);\n  }\n\n  .error {\n    margin: 0;\n    font-size: var(--field-error-font-size);\n    color: var(--field-error-fg);\n  }\n}\n","/*\n * Every value is a token (--listbox-*). React Aria writes the state:\n * data-focused (real or virtual focus), data-selected, data-disabled,\n * data-hovered, data-focus-visible, data-empty. The tick is in the DOM for\n * every option and revealed by data-selected.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .list {\n    display: flex;\n    flex-direction: column;\n    max-block-size: var(--listbox-max-height);\n    padding: var(--listbox-padding);\n    overflow: auto;\n    border: var(--size-hairline) solid var(--listbox-border);\n    border-radius: var(--listbox-radius);\n    background-color: var(--listbox-bg);\n    color: var(--listbox-fg);\n    font-family: var(--listbox-font-family);\n    font-size: var(--listbox-font-size);\n    outline: none;\n\n    &[data-focus-visible] {\n      outline: var(--listbox-focus-ring-width) solid var(--listbox-focus-ring);\n      outline-offset: var(--listbox-focus-ring-offset);\n    }\n  }\n\n  .check {\n    flex: none;\n    visibility: hidden;\n    color: var(--listbox-item-check);\n  }\n\n  .item {\n    display: flex;\n    align-items: center;\n    gap: var(--listbox-item-gap);\n    padding-block: var(--listbox-item-padding-block);\n    padding-inline: var(--listbox-item-padding-inline);\n    border-radius: var(--listbox-item-radius);\n    color: var(--listbox-item-fg);\n    cursor: default;\n    outline: none;\n\n    &[data-hovered],\n    &[data-focused] {\n      background-color: var(--listbox-item-bg-focus);\n    }\n\n    &[data-selected] {\n      background-color: var(--listbox-item-bg-selected);\n\n      .check {\n        visibility: visible;\n      }\n    }\n\n    &[data-disabled] {\n      color: var(--listbox-item-fg-disabled);\n      cursor: not-allowed;\n    }\n  }\n\n  .itemBody {\n    display: flex;\n    flex-direction: column;\n    min-inline-size: 0;\n  }\n\n  .itemLabel {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .itemDescription {\n    color: var(--listbox-item-fg-muted);\n    font-size: var(--listbox-item-description-font-size);\n  }\n\n  .empty {\n    padding: var(--listbox-empty-padding);\n    color: var(--listbox-empty-fg);\n  }\n}\n","/* The clip-path technique: present in the accessibility tree, absent from the layout. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    position: absolute;\n    inline-size: var(--visually-hidden-size);\n    block-size: var(--visually-hidden-size);\n    padding: 0;\n    margin: 0;\n    overflow: hidden;\n    clip-path: inset(50%);\n    white-space: nowrap;\n    border: 0;\n  }\n}\n","/* Every value is a token (--spinner-*). The ring is a border with one coloured side. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .spinner {\n    --_size: var(--spinner-size-md);\n    --_track: var(--spinner-track);\n    --_indicator: var(--spinner-indicator);\n\n    display: inline-flex;\n    flex: none;\n    inline-size: var(--_size);\n    block-size: var(--_size);\n    vertical-align: middle;\n\n    &[data-size=\"sm\"] { --_size: var(--spinner-size-sm); }\n    &[data-size=\"lg\"] { --_size: var(--spinner-size-lg); }\n    &[data-size=\"inherit\"] { --_size: 1em; }\n\n    &[data-tone=\"inherit\"] {\n      --_track: transparent;\n      --_indicator: currentcolor;\n    }\n  }\n\n  .ring {\n    inline-size: 100%;\n    block-size: 100%;\n    border: var(--spinner-width) solid var(--_track);\n    border-block-start-color: var(--_indicator);\n    border-radius: var(--radius-full);\n    animation: spin var(--spinner-duration) linear infinite;\n  }\n\n  @keyframes spin {\n    to {\n      rotate: 1turn;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ring {\n      animation: none;\n    }\n  }\n}\n","/*\n * Every value is a token (--combobox-*); the options read --listbox-*. Size\n * and invalid state resolve into private custom properties on the root. The\n * popover is positioned by React Aria; the gap to the control is its own\n * padding, so no offset number lives in code, and --trigger-width (set by\n * the vendor) makes it as wide as the control.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    --_height: var(--combobox-height-md);\n    --_font-size: var(--combobox-font-size-md);\n    --_border: var(--combobox-border-default);\n\n    font-family: var(--combobox-font-family);\n\n    &[data-size=\"sm\"] {\n      --_height: var(--combobox-height-sm);\n      --_font-size: var(--combobox-font-size-sm);\n    }\n\n    &[data-size=\"lg\"] {\n      --_height: var(--combobox-height-lg);\n      --_font-size: var(--combobox-font-size-lg);\n    }\n\n    &[data-invalid] { --_border: var(--combobox-border-invalid); }\n  }\n\n  .control {\n    display: grid;\n    align-items: center;\n\n    & > * {\n      grid-area: 1 / 1;\n    }\n  }\n\n  .input {\n    inline-size: 100%;\n    min-block-size: var(--_height);\n    padding-block: 0;\n    padding-inline: var(--combobox-padding-inline) var(--combobox-icon-size);\n    border: var(--size-hairline) solid var(--_border);\n    border-radius: var(--combobox-radius);\n    background-color: var(--combobox-bg);\n    color: var(--combobox-fg);\n    font-size: var(--_font-size);\n    transition: border-color var(--combobox-motion-duration) var(--motion-easing-standard);\n\n    &::placeholder {\n      color: var(--combobox-placeholder);\n    }\n\n    &[data-focused] {\n      border-color: var(--combobox-border-focus);\n      outline: var(--combobox-focus-ring-width) solid var(--combobox-focus-ring);\n      outline-offset: var(--combobox-focus-ring-offset);\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-hovered]:not([data-focused], [data-disabled]) {\n      border-color: var(--combobox-border-hover);\n    }\n  }\n\n  .button {\n    display: grid;\n    place-items: center;\n    inline-size: var(--combobox-icon-size);\n    block-size: var(--_height);\n    padding: 0;\n    border: none;\n    border-radius: var(--combobox-radius);\n    background-color: transparent;\n    color: var(--combobox-icon);\n    justify-self: end;\n    cursor: pointer;\n\n    &[data-focus-visible] {\n      outline: var(--combobox-focus-ring-width) solid var(--combobox-focus-ring);\n      outline-offset: calc(-1 * var(--combobox-focus-ring-width));\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n    }\n  }\n\n  .popover {\n    inline-size: var(--trigger-width);\n    padding-block-start: var(--combobox-gap);\n    animation: fade var(--combobox-popover-duration) var(--motion-easing-standard);\n\n    &[data-placement=\"top\"] {\n      padding-block: 0 var(--combobox-gap);\n    }\n  }\n\n  .list {\n    box-shadow: var(--combobox-popover-shadow);\n  }\n\n  @keyframes fade {\n    from {\n      opacity: 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .popover {\n      animation: none;\n    }\n  }\n}\n"],"mappings":"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","names":["icon","field","label","required","description","error","list","check","item","itemBody","itemLabel","itemDescription","empty","root","spinner","ring","spin","root","control","input","button","popover","list","fade"]}

package/dist/combobox.js

@@ -1,10 +1,10 @@
-export { Combobox } from './chunk-GUZMLYST.js';
-import './chunk-I4KC4V6A.js';
-import './chunk-Z4PN6B2C.js';
-import './chunk-T76YSNTZ.js';
-import './chunk-4HRNRTXI.js';
-import './chunk-YUHS5S5Y.js';
-import './chunk-ASNTNTJW.js';
+export { Combobox } from './chunk-NOUUOH4R.js';
+import './chunk-ZL5MMRLG.js';
+import './chunk-IB5UUE3S.js';
+import './chunk-EDTA65L5.js';
+import './chunk-IRNTXAA7.js';
+import './chunk-DGIXNUNI.js';
+import './chunk-O5LII5XP.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=combobox.js.map
 //# sourceMappingURL=combobox.js.map

package/dist/date-picker.css

@@ -1,4 +1,5 @@
 /* src/icon/Icon.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Icon_icon {
     display: inline-flex;
@@ -24,6 +25,7 @@
 }
 
 /* src/calendar/Calendar.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Calendar_root {
     display: inline-flex;
@@ -127,6 +129,7 @@
 }
 
 /* src/internal/AriaField.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .AriaField_field {
     display: flex;
@@ -156,6 +159,7 @@
 }
 
 /* src/date-picker/DatePicker.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .DatePicker_root {
     --_height: var(--date-picker-height-md);

package/dist/date-picker.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/icon/Icon.module.css","../src/calendar/Calendar.module.css","../src/internal/AriaField.module.css","../src/date-picker/DatePicker.module.css"],"sourcesContent":["/* Every value is a token (--icon-*). The child SVG fills the box; colour is currentColor. */\n\n@layer components {\n  .icon {\n    display: inline-flex;\n    flex: none;\n    inline-size: 1em;\n    block-size: 1em;\n    font-size: var(--icon-size-md);\n    vertical-align: middle;\n\n    &[data-size=\"sm\"] { font-size: var(--icon-size-sm); }\n    &[data-size=\"lg\"] { font-size: var(--icon-size-lg); }\n    &[data-size=\"inherit\"] { font-size: inherit; }\n\n    & > * {\n      inline-size: 100%;\n      block-size: 100%;\n    }\n  }\n}\n","/*\n * Every value is a token (--calendar-*). React Aria writes the cell state:\n * data-selected, data-focused, data-focus-visible, data-hovered,\n * data-disabled, data-unavailable, data-today, data-outside-month.\n */\n\n@layer components {\n  .root {\n    display: inline-flex;\n    flex-direction: column;\n    gap: var(--calendar-gap);\n    padding: var(--calendar-padding);\n    background-color: var(--calendar-bg);\n    color: var(--calendar-fg);\n    font-family: var(--calendar-font-family);\n    font-size: var(--calendar-font-size);\n  }\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--calendar-gap);\n  }\n\n  .heading {\n    margin: 0;\n    font-size: var(--calendar-heading-font-size);\n    font-weight: var(--calendar-heading-font-weight);\n  }\n\n  .nav {\n    display: grid;\n    place-items: center;\n    inline-size: var(--calendar-nav-size);\n    block-size: var(--calendar-nav-size);\n    padding: 0;\n    border: none;\n    border-radius: var(--calendar-nav-radius);\n    background-color: transparent;\n    color: var(--calendar-nav-fg);\n    cursor: pointer;\n    transition: background-color var(--calendar-motion-duration) var(--motion-easing-standard);\n\n    &[data-hovered] {\n      background-color: var(--calendar-nav-bg-hover);\n      color: var(--calendar-nav-fg-hover);\n    }\n\n    &[data-focus-visible] {\n      outline: var(--calendar-focus-ring-width) solid var(--calendar-focus-ring);\n      outline-offset: var(--calendar-focus-ring-offset);\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n  }\n\n  .grid {\n    border-collapse: collapse;\n    border-spacing: 0;\n  }\n\n  .weekday {\n    inline-size: var(--calendar-cell-size);\n    padding: 0;\n    color: var(--calendar-weekday-fg);\n    font-size: var(--calendar-weekday-font-size);\n    font-weight: var(--calendar-weekday-font-weight);\n    text-align: center;\n  }\n\n  .cell {\n    display: grid;\n    place-items: center;\n    inline-size: var(--calendar-cell-size);\n    block-size: var(--calendar-cell-size);\n    border-radius: var(--calendar-cell-radius);\n    color: var(--calendar-cell-fg);\n    cursor: pointer;\n    outline: none;\n    transition: background-color var(--calendar-motion-duration) var(--motion-easing-standard);\n\n    &[data-outside-month] {\n      display: none;\n    }\n\n    &[data-today] {\n      color: var(--calendar-cell-fg-today);\n      font-weight: var(--calendar-heading-font-weight);\n    }\n\n    &[data-hovered] {\n      background-color: var(--calendar-cell-bg-hover);\n    }\n\n    &[data-selected] {\n      background-color: var(--calendar-cell-bg-selected);\n      color: var(--calendar-cell-fg-selected);\n\n      &[data-hovered] {\n        background-color: var(--calendar-cell-bg-selected-hover);\n      }\n    }\n\n    &[data-focus-visible] {\n      outline: var(--calendar-focus-ring-width) solid var(--calendar-focus-ring);\n      outline-offset: var(--calendar-focus-ring-offset);\n    }\n\n    &[data-unavailable] {\n      color: var(--calendar-cell-fg-unavailable);\n      text-decoration: line-through;\n      cursor: not-allowed;\n    }\n\n    /* Disabled dims the days, not the month name, so the visible text keeps its contrast. */\n    &[data-disabled] {\n      color: var(--calendar-cell-fg-unavailable);\n      cursor: not-allowed;\n    }\n  }\n}\n","/* The same --field-* tokens Field reads, on React Aria's label, description and error parts. */\n\n@layer components {\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--field-gap);\n    font-family: var(--font-family-body);\n  }\n\n  .label {\n    font-size: var(--field-label-font-size);\n    font-weight: var(--field-label-font-weight);\n    color: var(--field-label-fg);\n  }\n\n  .required {\n    margin-inline-start: var(--field-required-gap);\n    color: var(--field-required-fg);\n  }\n\n  .description {\n    margin: 0;\n    font-size: var(--field-description-font-size);\n    color: var(--field-description-fg);\n  }\n\n  .error {\n    margin: 0;\n    font-size: var(--field-error-font-size);\n    color: var(--field-error-fg);\n  }\n}\n","/*\n * Every value is a token (--date-picker-*); the calendar reads --calendar-*.\n * The control is a group drawn like a text field around the date segments.\n * React Aria writes the state: data-focus-within, data-hovered,\n * data-disabled, data-invalid on the group; data-placeholder, data-focused\n * on each segment.\n */\n\n@layer components {\n  .root {\n    --_height: var(--date-picker-height-md);\n    --_font-size: var(--date-picker-font-size-md);\n    --_border: var(--date-picker-border-default);\n\n    font-family: var(--date-picker-font-family);\n\n    &[data-size=\"sm\"] {\n      --_height: var(--date-picker-height-sm);\n      --_font-size: var(--date-picker-font-size-sm);\n    }\n\n    &[data-size=\"lg\"] {\n      --_height: var(--date-picker-height-lg);\n      --_font-size: var(--date-picker-font-size-lg);\n    }\n\n    &[data-invalid] { --_border: var(--date-picker-border-invalid); }\n  }\n\n  .control {\n    display: flex;\n    align-items: center;\n    min-block-size: var(--_height);\n    padding-inline-start: var(--date-picker-padding-inline);\n    border: var(--size-hairline) solid var(--_border);\n    border-radius: var(--date-picker-radius);\n    background-color: var(--date-picker-bg);\n    color: var(--date-picker-fg);\n    font-size: var(--_font-size);\n    transition: border-color var(--date-picker-motion-duration) var(--motion-easing-standard);\n\n    &[data-focus-within] {\n      border-color: var(--date-picker-border-focus);\n      outline: var(--date-picker-focus-ring-width) solid var(--date-picker-focus-ring);\n      outline-offset: var(--date-picker-focus-ring-offset);\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-hovered]:not([data-focus-within], [data-disabled]) {\n      border-color: var(--date-picker-border-hover);\n    }\n  }\n\n  .input {\n    display: flex;\n    flex: 1;\n    align-items: center;\n  }\n\n  .segment {\n    padding-inline: var(--date-picker-segment-padding-inline);\n    border-radius: var(--date-picker-segment-radius);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    caret-color: transparent;\n\n    &[data-type=\"literal\"] {\n      padding-inline: 0;\n    }\n\n    &[data-placeholder] {\n      color: var(--date-picker-segment-fg-placeholder);\n    }\n\n    &[data-focused] {\n      background-color: var(--date-picker-segment-bg-focus);\n      color: var(--date-picker-fg);\n    }\n  }\n\n  .button {\n    display: grid;\n    place-items: center;\n    inline-size: var(--date-picker-icon-size);\n    block-size: calc(var(--_height) - 2 * var(--size-hairline));\n    padding: 0;\n    border: none;\n    border-radius: var(--date-picker-radius);\n    background-color: transparent;\n    color: var(--date-picker-icon);\n    cursor: pointer;\n\n    &[data-focus-visible] {\n      outline: var(--date-picker-focus-ring-width) solid var(--date-picker-focus-ring);\n      outline-offset: calc(-1 * var(--date-picker-focus-ring-width));\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n    }\n  }\n\n  .popover {\n    padding-block-start: var(--date-picker-gap);\n    animation: fade var(--date-picker-popover-duration) var(--motion-easing-standard);\n\n    &[data-placement=\"top\"] {\n      padding-block: 0 var(--date-picker-gap);\n    }\n  }\n\n  .dialog {\n    border: var(--size-hairline) solid var(--date-picker-dialog-border);\n    border-radius: var(--date-picker-dialog-radius);\n    background-color: var(--date-picker-dialog-bg);\n    box-shadow: var(--date-picker-popover-shadow);\n    outline: none;\n  }\n\n  @keyframes fade {\n    from {\n      opacity: 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .popover {\n      animation: none;\n    }\n  }\n}\n"],"mappings":"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","names":["icon","root","header","heading","nav","grid","weekday","cell","field","label","required","description","error","root","control","input","segment","button","popover","dialog","fade"]}
+{"version":3,"sources":["../src/icon/Icon.module.css","../src/calendar/Calendar.module.css","../src/internal/AriaField.module.css","../src/date-picker/DatePicker.module.css"],"sourcesContent":["/* Every value is a token (--icon-*). The child SVG fills the box; colour is currentColor. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .icon {\n    display: inline-flex;\n    flex: none;\n    inline-size: 1em;\n    block-size: 1em;\n    font-size: var(--icon-size-md);\n    vertical-align: middle;\n\n    &[data-size=\"sm\"] { font-size: var(--icon-size-sm); }\n    &[data-size=\"lg\"] { font-size: var(--icon-size-lg); }\n    &[data-size=\"inherit\"] { font-size: inherit; }\n\n    & > * {\n      inline-size: 100%;\n      block-size: 100%;\n    }\n  }\n}\n","/*\n * Every value is a token (--calendar-*). React Aria writes the cell state:\n * data-selected, data-focused, data-focus-visible, data-hovered,\n * data-disabled, data-unavailable, data-today, data-outside-month.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    display: inline-flex;\n    flex-direction: column;\n    gap: var(--calendar-gap);\n    padding: var(--calendar-padding);\n    background-color: var(--calendar-bg);\n    color: var(--calendar-fg);\n    font-family: var(--calendar-font-family);\n    font-size: var(--calendar-font-size);\n  }\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--calendar-gap);\n  }\n\n  .heading {\n    margin: 0;\n    font-size: var(--calendar-heading-font-size);\n    font-weight: var(--calendar-heading-font-weight);\n  }\n\n  .nav {\n    display: grid;\n    place-items: center;\n    inline-size: var(--calendar-nav-size);\n    block-size: var(--calendar-nav-size);\n    padding: 0;\n    border: none;\n    border-radius: var(--calendar-nav-radius);\n    background-color: transparent;\n    color: var(--calendar-nav-fg);\n    cursor: pointer;\n    transition: background-color var(--calendar-motion-duration) var(--motion-easing-standard);\n\n    &[data-hovered] {\n      background-color: var(--calendar-nav-bg-hover);\n      color: var(--calendar-nav-fg-hover);\n    }\n\n    &[data-focus-visible] {\n      outline: var(--calendar-focus-ring-width) solid var(--calendar-focus-ring);\n      outline-offset: var(--calendar-focus-ring-offset);\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n  }\n\n  .grid {\n    border-collapse: collapse;\n    border-spacing: 0;\n  }\n\n  .weekday {\n    inline-size: var(--calendar-cell-size);\n    padding: 0;\n    color: var(--calendar-weekday-fg);\n    font-size: var(--calendar-weekday-font-size);\n    font-weight: var(--calendar-weekday-font-weight);\n    text-align: center;\n  }\n\n  .cell {\n    display: grid;\n    place-items: center;\n    inline-size: var(--calendar-cell-size);\n    block-size: var(--calendar-cell-size);\n    border-radius: var(--calendar-cell-radius);\n    color: var(--calendar-cell-fg);\n    cursor: pointer;\n    outline: none;\n    transition: background-color var(--calendar-motion-duration) var(--motion-easing-standard);\n\n    &[data-outside-month] {\n      display: none;\n    }\n\n    &[data-today] {\n      color: var(--calendar-cell-fg-today);\n      font-weight: var(--calendar-heading-font-weight);\n    }\n\n    &[data-hovered] {\n      background-color: var(--calendar-cell-bg-hover);\n    }\n\n    &[data-selected] {\n      background-color: var(--calendar-cell-bg-selected);\n      color: var(--calendar-cell-fg-selected);\n\n      &[data-hovered] {\n        background-color: var(--calendar-cell-bg-selected-hover);\n      }\n    }\n\n    &[data-focus-visible] {\n      outline: var(--calendar-focus-ring-width) solid var(--calendar-focus-ring);\n      outline-offset: var(--calendar-focus-ring-offset);\n    }\n\n    &[data-unavailable] {\n      color: var(--calendar-cell-fg-unavailable);\n      text-decoration: line-through;\n      cursor: not-allowed;\n    }\n\n    /* Disabled dims the days, not the month name, so the visible text keeps its contrast. */\n    &[data-disabled] {\n      color: var(--calendar-cell-fg-unavailable);\n      cursor: not-allowed;\n    }\n  }\n}\n","/* The same --field-* tokens Field reads, on React Aria's label, description and error parts. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--field-gap);\n    font-family: var(--font-family-body);\n  }\n\n  .label {\n    font-size: var(--field-label-font-size);\n    font-weight: var(--field-label-font-weight);\n    color: var(--field-label-fg);\n  }\n\n  .required {\n    margin-inline-start: var(--field-required-gap);\n    color: var(--field-required-fg);\n  }\n\n  .description {\n    margin: 0;\n    font-size: var(--field-description-font-size);\n    color: var(--field-description-fg);\n  }\n\n  .error {\n    margin: 0;\n    font-size: var(--field-error-font-size);\n    color: var(--field-error-fg);\n  }\n}\n","/*\n * Every value is a token (--date-picker-*); the calendar reads --calendar-*.\n * The control is a group drawn like a text field around the date segments.\n * React Aria writes the state: data-focus-within, data-hovered,\n * data-disabled, data-invalid on the group; data-placeholder, data-focused\n * on each segment.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    --_height: var(--date-picker-height-md);\n    --_font-size: var(--date-picker-font-size-md);\n    --_border: var(--date-picker-border-default);\n\n    font-family: var(--date-picker-font-family);\n\n    &[data-size=\"sm\"] {\n      --_height: var(--date-picker-height-sm);\n      --_font-size: var(--date-picker-font-size-sm);\n    }\n\n    &[data-size=\"lg\"] {\n      --_height: var(--date-picker-height-lg);\n      --_font-size: var(--date-picker-font-size-lg);\n    }\n\n    &[data-invalid] { --_border: var(--date-picker-border-invalid); }\n  }\n\n  .control {\n    display: flex;\n    align-items: center;\n    min-block-size: var(--_height);\n    padding-inline-start: var(--date-picker-padding-inline);\n    border: var(--size-hairline) solid var(--_border);\n    border-radius: var(--date-picker-radius);\n    background-color: var(--date-picker-bg);\n    color: var(--date-picker-fg);\n    font-size: var(--_font-size);\n    transition: border-color var(--date-picker-motion-duration) var(--motion-easing-standard);\n\n    &[data-focus-within] {\n      border-color: var(--date-picker-border-focus);\n      outline: var(--date-picker-focus-ring-width) solid var(--date-picker-focus-ring);\n      outline-offset: var(--date-picker-focus-ring-offset);\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-hovered]:not([data-focus-within], [data-disabled]) {\n      border-color: var(--date-picker-border-hover);\n    }\n  }\n\n  .input {\n    display: flex;\n    flex: 1;\n    align-items: center;\n  }\n\n  .segment {\n    padding-inline: var(--date-picker-segment-padding-inline);\n    border-radius: var(--date-picker-segment-radius);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    caret-color: transparent;\n\n    &[data-type=\"literal\"] {\n      padding-inline: 0;\n    }\n\n    &[data-placeholder] {\n      color: var(--date-picker-segment-fg-placeholder);\n    }\n\n    &[data-focused] {\n      background-color: var(--date-picker-segment-bg-focus);\n      color: var(--date-picker-fg);\n    }\n  }\n\n  .button {\n    display: grid;\n    place-items: center;\n    inline-size: var(--date-picker-icon-size);\n    block-size: calc(var(--_height) - 2 * var(--size-hairline));\n    padding: 0;\n    border: none;\n    border-radius: var(--date-picker-radius);\n    background-color: transparent;\n    color: var(--date-picker-icon);\n    cursor: pointer;\n\n    &[data-focus-visible] {\n      outline: var(--date-picker-focus-ring-width) solid var(--date-picker-focus-ring);\n      outline-offset: calc(-1 * var(--date-picker-focus-ring-width));\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n    }\n  }\n\n  .popover {\n    padding-block-start: var(--date-picker-gap);\n    animation: fade var(--date-picker-popover-duration) var(--motion-easing-standard);\n\n    &[data-placement=\"top\"] {\n      padding-block: 0 var(--date-picker-gap);\n    }\n  }\n\n  .dialog {\n    border: var(--size-hairline) solid var(--date-picker-dialog-border);\n    border-radius: var(--date-picker-dialog-radius);\n    background-color: var(--date-picker-dialog-bg);\n    box-shadow: var(--date-picker-popover-shadow);\n    outline: none;\n  }\n\n  @keyframes fade {\n    from {\n      opacity: 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .popover {\n      animation: none;\n    }\n  }\n}\n"],"mappings":"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","names":["icon","root","header","heading","nav","grid","weekday","cell","field","label","required","description","error","root","control","input","segment","button","popover","dialog","fade"]}

package/dist/date-picker.js

@@ -1,8 +1,8 @@
-export { DatePicker } from './chunk-UX42PQLT.js';
-import './chunk-OXYP34CG.js';
-import './chunk-4HRNRTXI.js';
-import './chunk-YUHS5S5Y.js';
-import './chunk-ASNTNTJW.js';
+export { DatePicker } from './chunk-Y4YVAHD2.js';
+import './chunk-JOGIN4SS.js';
+import './chunk-IRNTXAA7.js';
+import './chunk-DGIXNUNI.js';
+import './chunk-O5LII5XP.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=date-picker.js.map
 //# sourceMappingURL=date-picker.js.map

package/dist/dialog.css

@@ -1,4 +1,5 @@
 /* src/dialog/Dialog.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Dialog_root {
     --modal-bg: var(--dialog-surface);

package/dist/dialog.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/dialog/Dialog.module.css"],"sourcesContent":["/*\n * The vendor (@pearpages/modals) reads --modal-* custom properties. This class\n * goes on the portal element pulp owns, so every dialog inherits pulp's\n * --dialog-* tokens and the vendor's :root defaults never apply.\n */\n\n@layer components {\n  .root {\n    --modal-bg: var(--dialog-surface);\n    --modal-surface-elevated: var(--dialog-surface);\n    --modal-surface-subtle: var(--dialog-surface-subtle);\n    --modal-color: var(--dialog-fg);\n    --modal-text-secondary: var(--dialog-fg-muted);\n    --modal-text-muted: var(--dialog-fg-muted);\n    --modal-backdrop-bg: var(--dialog-backdrop);\n    --modal-border-primary-color: var(--dialog-border);\n    --modal-border-hover-color: var(--dialog-border-hover);\n    --modal-border-focus-color: var(--dialog-focus);\n    --modal-border-accent-color: var(--dialog-border);\n    --modal-radius: var(--dialog-radius);\n    --modal-radius-md: var(--dialog-radius);\n    --modal-radius-sm: var(--radius-control);\n    --modal-button-radius: var(--radius-control);\n    --modal-shadow: var(--dialog-shadow);\n    --modal-padding: var(--dialog-padding);\n    --modal-spacing-xs: var(--space-1);\n    --modal-spacing-sm: var(--space-2);\n    --modal-spacing-md: var(--dialog-gap);\n    --modal-spacing-lg: var(--space-4);\n    --modal-spacing-xl: var(--space-5);\n    --modal-font-family: var(--dialog-font-family);\n    --modal-font-family-mono: var(--font-family-mono);\n    --modal-font-size-title: var(--dialog-title-font-size);\n    --modal-font-size-title-mobile: var(--dialog-title-font-size);\n    --modal-font-weight-title: var(--dialog-title-font-weight);\n    --modal-font-size-description: var(--dialog-description-font-size);\n    --modal-font-size-description-mobile: var(--dialog-description-font-size);\n    --modal-font-size-button: var(--font-size-sm);\n    --modal-close-bg: var(--dialog-close-bg);\n    --modal-close-hover-bg: var(--dialog-close-bg-hover);\n    --modal-close-text: var(--dialog-close-fg);\n    --modal-close-hover-text: var(--dialog-close-fg-hover);\n    --modal-interactive-hover: var(--color-action-secondary-hover);\n    --modal-interactive-active: var(--color-action-secondary-hover);\n    --modal-interactive-focus: var(--color-action-primary-quiet);\n    --modal-transition-duration: var(--dialog-motion-duration);\n    --modal-transition-easing: var(--dialog-motion-easing);\n    --modal-outline-width: var(--focus-ring-width);\n    --modal-outline-offset: var(--focus-ring-offset);\n    --modal-button-focus-color: var(--dialog-focus);\n    --modal-button-primary-bg: var(--color-action-primary);\n    --modal-button-primary-border: var(--color-action-primary);\n    --modal-button-primary-color: var(--color-text-on-action);\n    --modal-button-primary-hover-bg: var(--color-action-primary-hover);\n    --modal-button-primary-hover-border: var(--color-action-primary-hover);\n    --modal-button-primary-active-bg: var(--color-action-primary-active);\n    --modal-button-primary-active-border: var(--color-action-primary-active);\n    --modal-button-secondary-bg: var(--color-action-secondary);\n    --modal-button-secondary-border: var(--color-border-default);\n    --modal-button-secondary-color: var(--color-text-default);\n    --modal-button-secondary-hover-bg: var(--color-action-secondary-hover);\n    --modal-button-secondary-hover-border: var(--color-border-strong);\n    --modal-button-secondary-active-bg: var(--color-action-secondary-hover);\n    --modal-button-secondary-active-border: var(--color-border-strong);\n  }\n}\n"],"mappings":";AAMA;AACE,GAACA;AACC,gBAAY,IAAI;AAChB,8BAA0B,IAAI;AAC9B,4BAAwB,IAAI;AAC5B,mBAAe,IAAI;AACnB,4BAAwB,IAAI;AAC5B,wBAAoB,IAAI;AACxB,yBAAqB,IAAI;AACzB,kCAA8B,IAAI;AAClC,gCAA4B,IAAI;AAChC,gCAA4B,IAAI;AAChC,iCAA6B,IAAI;AACjC,oBAAgB,IAAI;AACpB,uBAAmB,IAAI;AACvB,uBAAmB,IAAI;AACvB,2BAAuB,IAAI;AAC3B,oBAAgB,IAAI;AACpB,qBAAiB,IAAI;AACrB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,yBAAqB,IAAI;AACzB,8BAA0B,IAAI;AAC9B,6BAAyB,IAAI;AAC7B,oCAAgC,IAAI;AACpC,+BAA2B,IAAI;AAC/B,mCAA+B,IAAI;AACnC,0CAAsC,IAAI;AAC1C,8BAA0B,IAAI;AAC9B,sBAAkB,IAAI;AACtB,4BAAwB,IAAI;AAC5B,wBAAoB,IAAI;AACxB,8BAA0B,IAAI;AAC9B,+BAA2B,IAAI;AAC/B,gCAA4B,IAAI;AAChC,+BAA2B,IAAI;AAC/B,iCAA6B,IAAI;AACjC,+BAA2B,IAAI;AAC/B,2BAAuB,IAAI;AAC3B,4BAAwB,IAAI;AAC5B,gCAA4B,IAAI;AAChC,+BAA2B,IAAI;AAC/B,mCAA+B,IAAI;AACnC,kCAA8B,IAAI;AAClC,qCAAiC,IAAI;AACrC,yCAAqC,IAAI;AACzC,sCAAkC,IAAI;AACtC,0CAAsC,IAAI;AAC1C,iCAA6B,IAAI;AACjC,qCAAiC,IAAI;AACrC,oCAAgC,IAAI;AACpC,uCAAmC,IAAI;AACvC,2CAAuC,IAAI;AAC3C,wCAAoC,IAAI;AACxC,4CAAwC,IAAI;AAC9C;AACF;","names":["root"]}
+{"version":3,"sources":["../src/dialog/Dialog.module.css"],"sourcesContent":["/*\n * The vendor (@pearpages/modals) reads --modal-* custom properties. This class\n * goes on the portal element pulp owns, so every dialog inherits pulp's\n * --dialog-* tokens and the vendor's :root defaults never apply.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    --modal-bg: var(--dialog-surface);\n    --modal-surface-elevated: var(--dialog-surface);\n    --modal-surface-subtle: var(--dialog-surface-subtle);\n    --modal-color: var(--dialog-fg);\n    --modal-text-secondary: var(--dialog-fg-muted);\n    --modal-text-muted: var(--dialog-fg-muted);\n    --modal-backdrop-bg: var(--dialog-backdrop);\n    --modal-border-primary-color: var(--dialog-border);\n    --modal-border-hover-color: var(--dialog-border-hover);\n    --modal-border-focus-color: var(--dialog-focus);\n    --modal-border-accent-color: var(--dialog-border);\n    --modal-radius: var(--dialog-radius);\n    --modal-radius-md: var(--dialog-radius);\n    --modal-radius-sm: var(--radius-control);\n    --modal-button-radius: var(--radius-control);\n    --modal-shadow: var(--dialog-shadow);\n    --modal-padding: var(--dialog-padding);\n    --modal-spacing-xs: var(--space-1);\n    --modal-spacing-sm: var(--space-2);\n    --modal-spacing-md: var(--dialog-gap);\n    --modal-spacing-lg: var(--space-4);\n    --modal-spacing-xl: var(--space-5);\n    --modal-font-family: var(--dialog-font-family);\n    --modal-font-family-mono: var(--font-family-mono);\n    --modal-font-size-title: var(--dialog-title-font-size);\n    --modal-font-size-title-mobile: var(--dialog-title-font-size);\n    --modal-font-weight-title: var(--dialog-title-font-weight);\n    --modal-font-size-description: var(--dialog-description-font-size);\n    --modal-font-size-description-mobile: var(--dialog-description-font-size);\n    --modal-font-size-button: var(--font-size-sm);\n    --modal-close-bg: var(--dialog-close-bg);\n    --modal-close-hover-bg: var(--dialog-close-bg-hover);\n    --modal-close-text: var(--dialog-close-fg);\n    --modal-close-hover-text: var(--dialog-close-fg-hover);\n    --modal-interactive-hover: var(--color-action-secondary-hover);\n    --modal-interactive-active: var(--color-action-secondary-hover);\n    --modal-interactive-focus: var(--color-action-primary-quiet);\n    --modal-transition-duration: var(--dialog-motion-duration);\n    --modal-transition-easing: var(--dialog-motion-easing);\n    --modal-outline-width: var(--focus-ring-width);\n    --modal-outline-offset: var(--focus-ring-offset);\n    --modal-button-focus-color: var(--dialog-focus);\n    --modal-button-primary-bg: var(--color-action-primary);\n    --modal-button-primary-border: var(--color-action-primary);\n    --modal-button-primary-color: var(--color-text-on-action);\n    --modal-button-primary-hover-bg: var(--color-action-primary-hover);\n    --modal-button-primary-hover-border: var(--color-action-primary-hover);\n    --modal-button-primary-active-bg: var(--color-action-primary-active);\n    --modal-button-primary-active-border: var(--color-action-primary-active);\n    --modal-button-secondary-bg: var(--color-action-secondary);\n    --modal-button-secondary-border: var(--color-border-default);\n    --modal-button-secondary-color: var(--color-text-default);\n    --modal-button-secondary-hover-bg: var(--color-action-secondary-hover);\n    --modal-button-secondary-hover-border: var(--color-border-strong);\n    --modal-button-secondary-active-bg: var(--color-action-secondary-hover);\n    --modal-button-secondary-active-border: var(--color-border-strong);\n  }\n}\n"],"mappings":";AAMA;AAEA;AACE,GAACA;AACC,gBAAY,IAAI;AAChB,8BAA0B,IAAI;AAC9B,4BAAwB,IAAI;AAC5B,mBAAe,IAAI;AACnB,4BAAwB,IAAI;AAC5B,wBAAoB,IAAI;AACxB,yBAAqB,IAAI;AACzB,kCAA8B,IAAI;AAClC,gCAA4B,IAAI;AAChC,gCAA4B,IAAI;AAChC,iCAA6B,IAAI;AACjC,oBAAgB,IAAI;AACpB,uBAAmB,IAAI;AACvB,uBAAmB,IAAI;AACvB,2BAAuB,IAAI;AAC3B,oBAAgB,IAAI;AACpB,qBAAiB,IAAI;AACrB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,wBAAoB,IAAI;AACxB,yBAAqB,IAAI;AACzB,8BAA0B,IAAI;AAC9B,6BAAyB,IAAI;AAC7B,oCAAgC,IAAI;AACpC,+BAA2B,IAAI;AAC/B,mCAA+B,IAAI;AACnC,0CAAsC,IAAI;AAC1C,8BAA0B,IAAI;AAC9B,sBAAkB,IAAI;AACtB,4BAAwB,IAAI;AAC5B,wBAAoB,IAAI;AACxB,8BAA0B,IAAI;AAC9B,+BAA2B,IAAI;AAC/B,gCAA4B,IAAI;AAChC,+BAA2B,IAAI;AAC/B,iCAA6B,IAAI;AACjC,+BAA2B,IAAI;AAC/B,2BAAuB,IAAI;AAC3B,4BAAwB,IAAI;AAC5B,gCAA4B,IAAI;AAChC,+BAA2B,IAAI;AAC/B,mCAA+B,IAAI;AACnC,kCAA8B,IAAI;AAClC,qCAAiC,IAAI;AACrC,yCAAqC,IAAI;AACzC,sCAAkC,IAAI;AACtC,0CAAsC,IAAI;AAC1C,iCAA6B,IAAI;AACjC,qCAAiC,IAAI;AACrC,oCAAgC,IAAI;AACpC,uCAAmC,IAAI;AACvC,2CAAuC,IAAI;AAC3C,wCAAoC,IAAI;AACxC,4CAAwC,IAAI;AAC9C;AACF;","names":["root"]}

package/dist/dialog.js

@@ -1,3 +1,3 @@
-export { Dialog, DialogSystem } from './chunk-IDNGNQNV.js';
+export { Dialog, DialogSystem } from './chunk-55QUKGK2.js';
 //# sourceMappingURL=dialog.js.map
 //# sourceMappingURL=dialog.js.map

package/dist/field.css

@@ -1,4 +1,5 @@
 /* src/field/Field.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Field_field {
     display: flex;

package/dist/field.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/field/Field.module.css"],"sourcesContent":["/* Every value is a token (--field-*). The control itself brings its own styles. */\n\n@layer components {\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--field-gap);\n  }\n\n  .label {\n    font-size: var(--field-label-font-size);\n    font-weight: var(--field-label-font-weight);\n    color: var(--field-label-fg);\n  }\n\n  .required {\n    margin-inline-start: var(--field-required-gap);\n    color: var(--field-required-fg);\n  }\n\n  .description {\n    margin: 0;\n    font-size: var(--field-description-font-size);\n    color: var(--field-description-fg);\n  }\n\n  .error {\n    margin: 0;\n    font-size: var(--field-error-font-size);\n    color: var(--field-error-fg);\n  }\n}\n"],"mappings":";AAEA;AACE,GAACA;AACC,aAAS;AACT,oBAAgB;AAChB,SAAK,IAAI;AACX;AAEA,GAACC;AACC,eAAW,IAAI;AACf,iBAAa,IAAI;AACjB,WAAO,IAAI;AACb;AAEA,GAACC;AACC,yBAAqB,IAAI;AACzB,WAAO,IAAI;AACb;AAEA,GAACC;AACC,YAAQ;AACR,eAAW,IAAI;AACf,WAAO,IAAI;AACb;AAEA,GAACC;AACC,YAAQ;AACR,eAAW,IAAI;AACf,WAAO,IAAI;AACb;AACF;","names":["field","label","required","description","error"]}
+{"version":3,"sources":["../src/field/Field.module.css"],"sourcesContent":["/* Every value is a token (--field-*). The control itself brings its own styles. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--field-gap);\n  }\n\n  .label {\n    font-size: var(--field-label-font-size);\n    font-weight: var(--field-label-font-weight);\n    color: var(--field-label-fg);\n  }\n\n  .required {\n    margin-inline-start: var(--field-required-gap);\n    color: var(--field-required-fg);\n  }\n\n  .description {\n    margin: 0;\n    font-size: var(--field-description-font-size);\n    color: var(--field-description-fg);\n  }\n\n  .error {\n    margin: 0;\n    font-size: var(--field-error-font-size);\n    color: var(--field-error-fg);\n  }\n}\n"],"mappings":";AAEA;AAEA;AACE,GAACA;AACC,aAAS;AACT,oBAAgB;AAChB,SAAK,IAAI;AACX;AAEA,GAACC;AACC,eAAW,IAAI;AACf,iBAAa,IAAI;AACjB,WAAO,IAAI;AACb;AAEA,GAACC;AACC,yBAAqB,IAAI;AACzB,WAAO,IAAI;AACb;AAEA,GAACC;AACC,YAAQ;AACR,eAAW,IAAI;AACf,WAAO,IAAI;AACb;AAEA,GAACC;AACC,YAAQ;AACR,eAAW,IAAI;AACf,WAAO,IAAI;AACb;AACF;","names":["field","label","required","description","error"]}

package/dist/field.js

@@ -1,4 +1,4 @@
-export { Field, useField } from './chunk-2PXTVZ7H.js';
+export { Field, useField } from './chunk-M5VL22MY.js';
 import './chunk-ZVDN3GRI.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=field.js.map

package/dist/heading.css

@@ -1,4 +1,5 @@
 /* src/heading/Heading.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Heading_heading {
     margin: 0;

package/dist/heading.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/heading/Heading.module.css"],"sourcesContent":["/* Every value is a token (--heading-*). Size is a data attribute, independent of the level. */\n\n@layer components {\n  .heading {\n    margin: 0;\n    font-family: var(--heading-font-family);\n    font-weight: var(--heading-font-weight);\n    line-height: var(--heading-line-height);\n    color: var(--heading-tone-default);\n    text-wrap: balance;\n\n    &[data-size=\"sm\"] { font-size: var(--heading-size-sm); }\n    &[data-size=\"md\"] { font-size: var(--heading-size-md); }\n    &[data-size=\"lg\"] { font-size: var(--heading-size-lg); }\n    &[data-size=\"xl\"] { font-size: var(--heading-size-xl); }\n    &[data-size=\"2xl\"] { font-size: var(--heading-size-2xl); }\n    &[data-tone=\"muted\"] { color: var(--heading-tone-muted); }\n  }\n}\n"],"mappings":";AAEA;AACE,GAACA;AACC,YAAQ;AACR,iBAAa,IAAI;AACjB,iBAAa,IAAI;AACjB,iBAAa,IAAI;AACjB,WAAO,IAAI;AACX,eAAW;AAEX,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAmB,iBAAW,IAAI;AAAqB;AACzD,KAAC,CAAC;AAAqB,aAAO,IAAI;AAAuB;AAC3D;AACF;","names":["heading"]}
+{"version":3,"sources":["../src/heading/Heading.module.css"],"sourcesContent":["/* Every value is a token (--heading-*). Size is a data attribute, independent of the level. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .heading {\n    margin: 0;\n    font-family: var(--heading-font-family);\n    font-weight: var(--heading-font-weight);\n    line-height: var(--heading-line-height);\n    color: var(--heading-tone-default);\n    text-wrap: balance;\n\n    &[data-size=\"sm\"] { font-size: var(--heading-size-sm); }\n    &[data-size=\"md\"] { font-size: var(--heading-size-md); }\n    &[data-size=\"lg\"] { font-size: var(--heading-size-lg); }\n    &[data-size=\"xl\"] { font-size: var(--heading-size-xl); }\n    &[data-size=\"2xl\"] { font-size: var(--heading-size-2xl); }\n    &[data-tone=\"muted\"] { color: var(--heading-tone-muted); }\n  }\n}\n"],"mappings":";AAEA;AAEA;AACE,GAACA;AACC,YAAQ;AACR,iBAAa,IAAI;AACjB,iBAAa,IAAI;AACjB,iBAAa,IAAI;AACjB,WAAO,IAAI;AACX,eAAW;AAEX,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAmB,iBAAW,IAAI;AAAqB;AACzD,KAAC,CAAC;AAAqB,aAAO,IAAI;AAAuB;AAC3D;AACF;","names":["heading"]}

package/dist/heading.js

@@ -1,4 +1,4 @@
-export { Heading } from './chunk-3GWESUGD.js';
+export { Heading } from './chunk-F3S5BHX2.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=heading.js.map
 //# sourceMappingURL=heading.js.map

package/dist/icon-button.css

@@ -1,4 +1,5 @@
 /* src/icon/Icon.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Icon_icon {
     display: inline-flex;
@@ -24,6 +25,7 @@
 }
 
 /* src/visually-hidden/VisuallyHidden.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .VisuallyHidden_root {
     position: absolute;
@@ -39,6 +41,7 @@
 }
 
 /* src/spinner/Spinner.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Spinner_spinner {
     --_size: var(--spinner-size-md);
@@ -84,6 +87,7 @@
 }
 
 /* src/button/Button.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Button_button {
     display: inline-flex;
@@ -102,6 +106,7 @@
     text-decoration: none;
     white-space: nowrap;
     cursor: pointer;
+    -webkit-user-select: none;
     user-select: none;
     transition:
       background-color var(--button-motion-duration) var(--motion-easing-standard),
@@ -161,6 +166,7 @@
 }
 
 /* src/icon-button/IconButton.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .IconButton_iconButton[data-icon-only] {
     gap: 0;