@pearpages/pulp-react 0.2.1 → 0.3.0

package/dist/{chunk-MRQWUCBA.js → chunk-HPQ462R5.js}

@@ -1,4 +1,4 @@
-import { renderAsChild } from './chunk-ZVDN3GRI.js';
+import { renderAsChild } from './chunk-QJG5ILK5.js';
 import { classes } from './chunk-MI4QUKQS.js';
 import { jsx } from 'react/jsx-runtime';
 
@@ -53,5 +53,5 @@ Card.Body = CardBody;
 Card.Footer = CardFooter;
 
 export { Card };
-//# sourceMappingURL=chunk-MRQWUCBA.js.map
-//# sourceMappingURL=chunk-MRQWUCBA.js.map
+//# sourceMappingURL=chunk-HPQ462R5.js.map
+//# sourceMappingURL=chunk-HPQ462R5.js.map

package/dist/chunk-HPQ462R5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/card/Card.module.css","../src/card/Card.tsx"],"names":["card","header","body","footer"],"mappings":";;;;;AAAA,IAAA,YAAA,GAAA;AAAA,EAKG,IAAA,EAAAA,WAAAA;AAAA,EAmDA,MAAA,EAAAC,aAAAA;AAAA,EACA,IAAA,EAAAC,WAAAA;AAAA,EACA,MAAA,EAAAC;AAAA,CAAA;ACLI,SAAS,IAAA,CAA0C;AAAA,EACxD,OAAA,GAAU,QAAA;AAAA,EACV,OAAA,GAAU,IAAA;AAAA,EACV,WAAA,GAAc,KAAA;AAAA,EACd,OAAA,GAAU,KAAA;AAAA,EACV,SAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAiB;AACf,EAAA,MAAM,KAAA,GAAQ;AAAA,IACZ,GAAG,IAAA;AAAA,IACH,GAAA;AAAA,IACA,SAAA,EAAW,OAAA,CAAQ,YAAA,CAAO,IAAA,EAAM,SAAS,CAAA;AAAA,IACzC,cAAA,EAAgB,OAAA;AAAA,IAChB,cAAA,EAAgB,OAAA;AAAA,IAChB,kBAAA,EAAoB,cAAc,EAAA,GAAK,MAAA;AAAA;AAAA,IAEvC,QAAA,EAAU,QAAA,KAAa,WAAA,IAAe,CAAC,UAAU,CAAA,GAAI,MAAA;AAAA,GACvD;AAEA,EAAA,IAAI,OAAA,EAAS;AAGX,IAAA,OAAO,aAAA,CAAc,MAAA,EAAQ,QAAA,EAAU,KAAK,CAAA;AAAA,EAC9C;AAEA,EAAA,uBAAO,GAAA,CAAC,SAAA,EAAA,EAAS,GAAI,KAAA,EAAwC,QAAA,EAAS,CAAA;AACxE;AAEA,SAAS,WAAW,EAAE,SAAA,EAAW,GAAA,EAAK,GAAG,MAAK,EAAc;AAC1D,EAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,GAAA,EAAU,WAAW,OAAA,CAAQ,YAAA,CAAO,MAAA,EAAQ,SAAS,CAAA,EAAG,CAAA;AAChF;AAEA,SAAS,SAAS,EAAE,SAAA,EAAW,GAAA,EAAK,GAAG,MAAK,EAAc;AACxD,EAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,GAAA,EAAU,WAAW,OAAA,CAAQ,YAAA,CAAO,IAAA,EAAM,SAAS,CAAA,EAAG,CAAA;AAC9E;AAEA,SAAS,WAAW,EAAE,SAAA,EAAW,GAAA,EAAK,GAAG,MAAK,EAAc;AAC1D,EAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,GAAA,EAAU,WAAW,OAAA,CAAQ,YAAA,CAAO,MAAA,EAAQ,SAAS,CAAA,EAAG,CAAA;AAChF;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA;AACnB,UAAA,CAAW,WAAA,GAAc,aAAA;AACzB,QAAA,CAAS,WAAA,GAAc,WAAA;AACvB,UAAA,CAAW,WAAA,GAAc,aAAA;AAEzB,IAAA,CAAK,MAAA,GAAS,UAAA;AACd,IAAA,CAAK,IAAA,GAAO,QAAA;AACZ,IAAA,CAAK,MAAA,GAAS,UAAA","file":"chunk-HPQ462R5.js","sourcesContent":["/* Every value is a token (--card-*). Slots carry padding and dividers; the root is the surface. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .card {\n    --_pad: var(--card-padding-md);\n\n    display: flex;\n    flex-direction: column;\n    min-inline-size: 0;\n    border: 1px solid transparent;\n    border-radius: var(--card-radius);\n    background-color: var(--card-bg);\n    color: var(--card-fg);\n    text-decoration: none;\n    transition:\n      border-color var(--card-motion-duration) var(--motion-easing-standard),\n      box-shadow var(--card-motion-duration) var(--motion-easing-standard),\n      translate var(--card-motion-duration) var(--motion-easing-standard);\n\n    &[data-padding=\"sm\"] {\n      --_pad: var(--card-padding-sm);\n    }\n\n    &[data-padding=\"lg\"] {\n      --_pad: var(--card-padding-lg);\n    }\n\n    &[data-variant=\"raised\"] {\n      box-shadow: var(--card-shadow);\n    }\n\n    &[data-variant=\"outlined\"] {\n      border-color: var(--card-border);\n    }\n\n    &[data-variant=\"sunken\"] {\n      background-color: var(--card-bg-sunken);\n    }\n\n    &[data-interactive] {\n      cursor: pointer;\n\n      &:hover {\n        border-color: var(--card-border-hover);\n        translate: 0 -1px;\n      }\n\n      &:focus-visible {\n        outline: var(--card-focus-ring-width) solid var(--card-focus-ring);\n        outline-offset: var(--card-focus-ring-offset);\n      }\n    }\n  }\n\n  .header,\n  .body,\n  .footer {\n    padding: var(--_pad);\n  }\n\n  .header {\n    display: flex;\n    flex-direction: column;\n    gap: var(--card-gap);\n    border-block-end: 1px solid var(--card-divider);\n  }\n\n  .body {\n    flex: 1;\n  }\n\n  .footer {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--card-gap);\n    border-block-start: 1px solid var(--card-divider);\n  }\n}\n","import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { renderAsChild } from '../internal/asChild';\nimport { classes } from '../internal/classes';\nimport styles from './Card.module.css';\n\nexport type CardVariant = 'raised' | 'outlined' | 'sunken';\nexport type CardPadding = 'sm' | 'md' | 'lg';\n\nexport interface CardProps<E extends HTMLElement = HTMLElement> extends HTMLAttributes<HTMLElement> {\n  /**\n   * How the card separates from the page: `raised` by shadow, `outlined` by\n   * border, `sunken` by a recessed surface.\n   * @default 'raised'\n   */\n  variant?: CardVariant;\n  /** One knob for every slot's inner spacing. @default 'md' */\n  padding?: CardPadding;\n  /**\n   * Hover and focus affordances for a card that is itself a target. Pair it\n   * with `asChild` and a link, or supply your own role and handlers.\n   * @default false\n   */\n  interactive?: boolean;\n  /**\n   * Render the single child element as the card (an `<a>` for a link card),\n   * merging the card's props into it.\n   * @default false\n   */\n  asChild?: boolean;\n  /** The rendered element; a `<section>` unless `asChild`. */\n  ref?: Ref<E>;\n  children: ReactNode;\n}\n\ninterface SlotProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n  children?: ReactNode;\n}\n\n/**\n * A surface that groups related content. Compose with `Card.Header`,\n * `Card.Body` and `Card.Footer`; the slots carry the padding and dividers so\n * the root stays a plain surface. Every value comes from `--card-*` tokens;\n * state is exposed as `data-variant`, `data-padding` and `data-interactive`.\n *\n * @status stable\n * @category Layout\n * @accessibility A `section` by default (a `region` when it has an accessible name); with `asChild` the child element's own semantics apply. `interactive` adds a focus ring and a tab stop only when the element is not already focusable.\n * @do Give a card an `aria-label` or a heading in `Card.Header` when it is a landmark worth naming.\n * Use `asChild` with an `a` for a whole-card link.\n * @dont Put more than one primary action inside an interactive card.\n * Nest interactive cards.\n */\nexport function Card<E extends HTMLElement = HTMLElement>({\n  variant = 'raised',\n  padding = 'md',\n  interactive = false,\n  asChild = false,\n  className,\n  tabIndex,\n  ref,\n  children,\n  ...rest\n}: CardProps<E>) {\n  const props = {\n    ...rest,\n    ref,\n    className: classes(styles.card, className),\n    'data-variant': variant,\n    'data-padding': padding,\n    'data-interactive': interactive ? '' : undefined,\n    // An interactive section must be reachable; a link or button already is.\n    tabIndex: tabIndex ?? (interactive && !asChild ? 0 : undefined),\n  };\n\n  if (asChild) {\n    // The helper merges the forwarded ref with the child's; nothing reads it.\n    // eslint-disable-next-line react-hooks/refs -- forwarded, not read\n    return renderAsChild('Card', children, props);\n  }\n\n  return <section {...(props as HTMLAttributes<HTMLElement>)}>{children}</section>;\n}\n\nfunction CardHeader({ className, ref, ...rest }: SlotProps) {\n  return <div {...rest} ref={ref} className={classes(styles.header, className)} />;\n}\n\nfunction CardBody({ className, ref, ...rest }: SlotProps) {\n  return <div {...rest} ref={ref} className={classes(styles.body, className)} />;\n}\n\nfunction CardFooter({ className, ref, ...rest }: SlotProps) {\n  return <div {...rest} ref={ref} className={classes(styles.footer, className)} />;\n}\n\nCard.displayName = 'Card';\nCardHeader.displayName = 'Card.Header';\nCardBody.displayName = 'Card.Body';\nCardFooter.displayName = 'Card.Footer';\n\nCard.Header = CardHeader;\nCard.Body = CardBody;\nCard.Footer = CardFooter;\n"]}

package/dist/{chunk-Z4PN6B2C.js → chunk-IB5UUE3S.js}

@@ -13,5 +13,5 @@ function VisuallyHidden({ as = "span", className, ref, children, ...rest }) {
 VisuallyHidden.displayName = "VisuallyHidden";
 
 export { VisuallyHidden };
-//# sourceMappingURL=chunk-Z4PN6B2C.js.map
-//# sourceMappingURL=chunk-Z4PN6B2C.js.map
+//# sourceMappingURL=chunk-IB5UUE3S.js.map
+//# sourceMappingURL=chunk-IB5UUE3S.js.map

package/dist/chunk-IB5UUE3S.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/visually-hidden/VisuallyHidden.module.css","../src/visually-hidden/VisuallyHidden.tsx"],"names":["root"],"mappings":";;;;AAAA,IAAA,sBAAA,GAAA;AAAA,EAKG,IAAA,EAAAA;AAAA,CAAA;;;ACkBI,SAAS,cAAA,CAAe,EAAE,EAAA,GAAK,MAAA,EAAQ,WAAW,GAAA,EAAK,QAAA,EAAU,GAAG,IAAA,EAAK,EAAwB;AACtG,EAAA,OAAO,aAAA,CAAc,EAAA,EAAI,EAAE,GAAG,IAAA,EAAM,GAAA,EAAK,SAAA,EAAW,OAAA,CAAQ,sBAAA,CAAO,IAAA,EAAM,SAAS,CAAA,IAAK,QAAQ,CAAA;AACjG;AAEA,cAAA,CAAe,WAAA,GAAc,gBAAA","file":"chunk-IB5UUE3S.js","sourcesContent":["/* 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","import { createElement, type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './VisuallyHidden.module.css';\n\nexport interface VisuallyHiddenProps extends HTMLAttributes<HTMLElement> {\n  /** @default 'span' */\n  as?: 'span' | 'div';\n  ref?: Ref<HTMLElement>;\n  children: ReactNode;\n}\n\n/**\n * Content for assistive technology only: read by screen readers, invisible\n * on screen, still in the accessibility tree (unlike `display: none`). Use\n * it to give icon-only controls a name or to add context a sighted user\n * gets from layout.\n *\n * @status stable\n * @category Utilities\n * @accessibility In the accessibility tree, out of the layout (clip-path, not `display: none`).\n * @do Use it for context a sighted user gets from layout (\"Sort by\", \"Step 2 of 4\").\n * @dont Hide instructions that sighted users also need.\n */\nexport function VisuallyHidden({ as = 'span', className, ref, children, ...rest }: VisuallyHiddenProps) {\n  return createElement(as, { ...rest, ref, className: classes(styles.root, className) }, children);\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden';\n"]}

package/dist/{chunk-4HRNRTXI.js → chunk-IRNTXAA7.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 { Label, Text, FieldError } from 'react-aria-components';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -21,5 +21,5 @@ var ariaFieldClass = (...extra) => classes(AriaField_default.field, ...extra);
 var isPresent = (error) => error !== void 0 && error !== null && error !== false && error !== "";
 
 export { AriaFieldDescription, AriaFieldError, AriaFieldLabel, ariaFieldClass, isPresent };
-//# sourceMappingURL=chunk-4HRNRTXI.js.map
-//# sourceMappingURL=chunk-4HRNRTXI.js.map
+//# sourceMappingURL=chunk-IRNTXAA7.js.map
+//# sourceMappingURL=chunk-IRNTXAA7.js.map

package/dist/{chunk-4HRNRTXI.js.map → chunk-IRNTXAA7.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/internal/AriaField.tsx"],"names":[],"mappings":";;;;;AAYO,SAAS,cAAA,CAAe,EAAE,QAAA,EAAU,QAAA,EAAS,EAAgD;AAClG,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,iBAAA,CAAO,KAAA,EACtB,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,QAAA,wBACE,MAAA,EAAA,EAAK,SAAA,EAAW,kBAAO,QAAA,EAAU,aAAA,EAAY,QAAO,QAAA,EAAA,GAAA,EAErD;AAAA,GAAA,EAEJ,CAAA;AAEJ;AAEO,SAAS,oBAAA,CAAqB,EAAE,QAAA,EAAS,EAA6B;AAC3E,EAAA,IAAI,CAAC,UAAU,OAAO,IAAA;AACtB,EAAA,2BACG,IAAA,EAAA,EAAK,IAAA,EAAK,eAAc,SAAA,EAAW,iBAAA,CAAO,aACxC,QAAA,EACH,CAAA;AAEJ;AAGO,SAAS,cAAA,CAAe,EAAE,QAAA,EAAS,EAA6B;AACrE,EAAA,IAAI,CAAC,UAAU,OAAO,IAAA;AACtB,EAAA,uBAAO,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,iBAAA,CAAO,OAAQ,QAAA,EAAS,CAAA;AACxD;AAGO,IAAM,iBAAiB,CAAA,GAAI,KAAA,KAAoD,QAAQ,iBAAA,CAAO,KAAA,EAAO,GAAG,KAAK;AAG7G,IAAM,SAAA,GAAY,CAAC,KAAA,KAA8B,KAAA,KAAU,UAAa,KAAA,KAAU,IAAA,IAAQ,KAAA,KAAU,KAAA,IAAS,KAAA,KAAU","file":"chunk-4HRNRTXI.js","sourcesContent":["import type { ReactNode } from 'react';\nimport { FieldError, Label, Text } from 'react-aria-components';\nimport { classes } from './classes';\nimport styles from './AriaField.module.css';\n\n/**\n * Label, description and error for controls built on React Aria (decision\n * record 001). React Aria wires `htmlFor`, `aria-labelledby` and\n * `aria-describedby` itself through its contexts, so these are the vendor's\n * parts with pulp's `--field-*` tokens: they look exactly like `Field`'s.\n * `Field` stays the wrapper for native controls, where pulp does the wiring.\n */\nexport function AriaFieldLabel({ required, children }: { required?: boolean; children: ReactNode }) {\n  return (\n    <Label className={styles.label}>\n      {children}\n      {required && (\n        <span className={styles.required} aria-hidden=\"true\">\n          *\n        </span>\n      )}\n    </Label>\n  );\n}\n\nexport function AriaFieldDescription({ children }: { children?: ReactNode }) {\n  if (!children) return null;\n  return (\n    <Text slot=\"description\" className={styles.description}>\n      {children}\n    </Text>\n  );\n}\n\n/** Rendered by React Aria only while the control is invalid. */\nexport function AriaFieldError({ children }: { children?: ReactNode }) {\n  if (!children) return null;\n  return <FieldError className={styles.error}>{children}</FieldError>;\n}\n\n/** The vertical field layout class, for the vendor root element. */\nexport const ariaFieldClass = (...extra: Array<string | false | null | undefined>) => classes(styles.field, ...extra);\n\n/** `error` is \"present\" the way Field defines it: not undefined, null, false or empty. */\nexport const isPresent = (error: ReactNode): boolean => error !== undefined && error !== null && error !== false && error !== '';\n"]}
+{"version":3,"sources":["../src/internal/AriaField.tsx"],"names":[],"mappings":";;;;;AAYO,SAAS,cAAA,CAAe,EAAE,QAAA,EAAU,QAAA,EAAS,EAAgD;AAClG,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,iBAAA,CAAO,KAAA,EACtB,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,QAAA,wBACE,MAAA,EAAA,EAAK,SAAA,EAAW,kBAAO,QAAA,EAAU,aAAA,EAAY,QAAO,QAAA,EAAA,GAAA,EAErD;AAAA,GAAA,EAEJ,CAAA;AAEJ;AAEO,SAAS,oBAAA,CAAqB,EAAE,QAAA,EAAS,EAA6B;AAC3E,EAAA,IAAI,CAAC,UAAU,OAAO,IAAA;AACtB,EAAA,2BACG,IAAA,EAAA,EAAK,IAAA,EAAK,eAAc,SAAA,EAAW,iBAAA,CAAO,aACxC,QAAA,EACH,CAAA;AAEJ;AAGO,SAAS,cAAA,CAAe,EAAE,QAAA,EAAS,EAA6B;AACrE,EAAA,IAAI,CAAC,UAAU,OAAO,IAAA;AACtB,EAAA,uBAAO,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,iBAAA,CAAO,OAAQ,QAAA,EAAS,CAAA;AACxD;AAGO,IAAM,iBAAiB,CAAA,GAAI,KAAA,KAAoD,QAAQ,iBAAA,CAAO,KAAA,EAAO,GAAG,KAAK;AAG7G,IAAM,SAAA,GAAY,CAAC,KAAA,KAA8B,KAAA,KAAU,UAAa,KAAA,KAAU,IAAA,IAAQ,KAAA,KAAU,KAAA,IAAS,KAAA,KAAU","file":"chunk-IRNTXAA7.js","sourcesContent":["import type { ReactNode } from 'react';\nimport { FieldError, Label, Text } from 'react-aria-components';\nimport { classes } from './classes';\nimport styles from './AriaField.module.css';\n\n/**\n * Label, description and error for controls built on React Aria (decision\n * record 001). React Aria wires `htmlFor`, `aria-labelledby` and\n * `aria-describedby` itself through its contexts, so these are the vendor's\n * parts with pulp's `--field-*` tokens: they look exactly like `Field`'s.\n * `Field` stays the wrapper for native controls, where pulp does the wiring.\n */\nexport function AriaFieldLabel({ required, children }: { required?: boolean; children: ReactNode }) {\n  return (\n    <Label className={styles.label}>\n      {children}\n      {required && (\n        <span className={styles.required} aria-hidden=\"true\">\n          *\n        </span>\n      )}\n    </Label>\n  );\n}\n\nexport function AriaFieldDescription({ children }: { children?: ReactNode }) {\n  if (!children) return null;\n  return (\n    <Text slot=\"description\" className={styles.description}>\n      {children}\n    </Text>\n  );\n}\n\n/** Rendered by React Aria only while the control is invalid. */\nexport function AriaFieldError({ children }: { children?: ReactNode }) {\n  if (!children) return null;\n  return <FieldError className={styles.error}>{children}</FieldError>;\n}\n\n/** The vertical field layout class, for the vendor root element. */\nexport const ariaFieldClass = (...extra: Array<string | false | null | undefined>) => classes(styles.field, ...extra);\n\n/** `error` is \"present\" the way Field defines it: not undefined, null, false or empty. */\nexport const isPresent = (error: ReactNode): boolean => error !== undefined && error !== null && error !== false && error !== '';\n"]}

package/dist/{chunk-OXYP34CG.js → chunk-JOGIN4SS.js}

@@ -1,4 +1,4 @@
-import { Icon } from './chunk-ASNTNTJW.js';
+import { Icon } from './chunk-O5LII5XP.js';
 import { parseDate } from '@internationalized/date';
 import { Button, Heading, CalendarGrid as CalendarGrid$1, CalendarGridHeader, CalendarHeaderCell, CalendarGridBody, CalendarCell } from 'react-aria-components';
 import { ChevronLeft, ChevronRight } from '@pearpages/pulp-icons';
@@ -39,5 +39,5 @@ function CalendarGrid() {
 var calendarRootClass = Calendar_default.root;
 
 export { CalendarGrid, calendarRootClass, fromDate, toDate };
-//# sourceMappingURL=chunk-OXYP34CG.js.map
-//# sourceMappingURL=chunk-OXYP34CG.js.map
+//# sourceMappingURL=chunk-JOGIN4SS.js.map
+//# sourceMappingURL=chunk-JOGIN4SS.js.map

package/dist/chunk-JOGIN4SS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/internal/dates.ts","../src/calendar/Calendar.module.css","../src/calendar/CalendarGrid.tsx"],"names":["root","header","heading","nav","grid","weekday","cell","AriaButton","AriaHeading","AriaCalendarGrid","AriaCalendarGridHeader","AriaCalendarHeaderCell","AriaCalendarGridBody","AriaCalendarCell"],"mappings":";;;;;;AAOO,SAAS,OAAO,GAAA,EAAiE;AACtF,EAAA,IAAI,GAAA,KAAQ,QAAW,OAAO,MAAA;AAC9B,EAAA,IAAI,GAAA,KAAQ,IAAA,IAAQ,GAAA,KAAQ,EAAA,EAAI,OAAO,IAAA;AACvC,EAAA,OAAO,UAAU,GAAG,CAAA;AACtB;AAEO,SAAS,SAAS,IAAA,EAAuC;AAC9D,EAAA,OAAO,OAAO,IAAA,CAAK,QAAA,GAAW,KAAA,CAAM,CAAA,EAAG,EAAE,CAAA,GAAI,IAAA;AAC/C;;;ACfA,IAAA,gBAAA,GAAA;AAAA,EASG,IAAA,EAAAA,eAAAA;AAAA,EAWA,MAAA,EAAAC,iBAAAA;AAAA,EAOA,OAAA,EAAAC,kBAAAA;AAAA,EAMA,GAAA,EAAAC,cAAAA;AAAA,EA6BA,IAAA,EAAAC,eAAAA;AAAA,EAKA,OAAA,EAAAC,kBAAAA;AAAA,EASA,IAAA,EAAAC;AAAA,CAAA;ACvDI,SAAS,YAAA,GAAe;AAC7B,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,gBAAA,CAAO,MAAA,EACrB,QAAA,EAAA;AAAA,sBAAA,GAAA,CAACC,MAAA,EAAA,EAAW,IAAA,EAAK,UAAA,EAAW,SAAA,EAAW,gBAAA,CAAO,GAAA,EAC5C,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,SAAA,EACT,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,GACf,CAAA,EACF,CAAA;AAAA,sBACA,GAAA,CAACC,OAAA,EAAA,EAAY,SAAA,EAAW,gBAAA,CAAO,OAAA,EAAS,CAAA;AAAA,sBACxC,GAAA,CAACD,MAAA,EAAA,EAAW,IAAA,EAAK,MAAA,EAAO,WAAW,gBAAA,CAAO,GAAA,EACxC,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,SAAA,EACT,QAAA,kBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,GAChB,CAAA,EACF;AAAA,KAAA,EACF,CAAA;AAAA,yBACCE,cAAA,EAAA,EAAiB,SAAA,EAAW,gBAAA,CAAO,IAAA,EAAM,cAAa,OAAA,EACrD,QAAA,EAAA;AAAA,sBAAA,GAAA,CAACC,kBAAA,EAAA,EAAwB,WAAC,GAAA,qBAAQ,GAAA,CAACC,sBAAuB,SAAA,EAAW,gBAAA,CAAO,OAAA,EAAU,QAAA,EAAA,GAAA,EAAI,CAAA,EAA0B,CAAA;AAAA,sBACpH,GAAA,CAACC,gBAAA,EAAA,EAAsB,QAAA,EAAA,CAAC,IAAA,qBAAS,GAAA,CAACC,gBAAiB,IAAA,EAAY,SAAA,EAAW,gBAAA,CAAO,IAAA,EAAM,CAAA,EAAG;AAAA,KAAA,EAC5F;AAAA,GAAA,EACF,CAAA;AAEJ;AAGO,IAAM,oBAAoB,gBAAA,CAAO","file":"chunk-JOGIN4SS.js","sourcesContent":["import { parseDate, type CalendarDate, type DateValue } from '@internationalized/date';\n\n/**\n * pulp's date contract is an ISO calendar date string (`YYYY-MM-DD`); the\n * vendor's date objects stay behind this boundary (decision record 001).\n * `undefined` stays `undefined` so uncontrolled props remain uncontrolled.\n */\nexport function toDate(iso: string | null | undefined): CalendarDate | null | undefined {\n  if (iso === undefined) return undefined;\n  if (iso === null || iso === '') return null;\n  return parseDate(iso);\n}\n\nexport function fromDate(date: DateValue | null): string | null {\n  return date ? date.toString().slice(0, 10) : null;\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","import {\n  Button as AriaButton,\n  CalendarCell as AriaCalendarCell,\n  CalendarGrid as AriaCalendarGrid,\n  CalendarGridBody as AriaCalendarGridBody,\n  CalendarGridHeader as AriaCalendarGridHeader,\n  CalendarHeaderCell as AriaCalendarHeaderCell,\n  Heading as AriaHeading,\n} from 'react-aria-components';\nimport { ChevronLeft, ChevronRight } from '@pearpages/pulp-icons';\nimport { Icon } from '../icon';\nimport styles from './Calendar.module.css';\n\n/**\n * The month view shared by Calendar and DatePicker: navigation, the visible\n * month name, weekday header and the day grid. It reads its state from the\n * vendor's calendar context, so it works inside either root. The vendor\n * names the grid for assistive technology through a visually hidden `h2`;\n * the visible month name is decorative (`aria-hidden`), which is why it is\n * a plain div and not a heading level of pulp's choosing.\n */\nexport function CalendarGrid() {\n  return (\n    <>\n      <div className={styles.header}>\n        <AriaButton slot=\"previous\" className={styles.nav}>\n          <Icon size=\"inherit\">\n            <ChevronLeft />\n          </Icon>\n        </AriaButton>\n        <AriaHeading className={styles.heading} />\n        <AriaButton slot=\"next\" className={styles.nav}>\n          <Icon size=\"inherit\">\n            <ChevronRight />\n          </Icon>\n        </AriaButton>\n      </div>\n      <AriaCalendarGrid className={styles.grid} weekdayStyle=\"short\">\n        <AriaCalendarGridHeader>{(day) => <AriaCalendarHeaderCell className={styles.weekday}>{day}</AriaCalendarHeaderCell>}</AriaCalendarGridHeader>\n        <AriaCalendarGridBody>{(date) => <AriaCalendarCell date={date} className={styles.cell} />}</AriaCalendarGridBody>\n      </AriaCalendarGrid>\n    </>\n  );\n}\n\n/** The root class, for DatePicker to style the vendor calendar inside its popover. */\nexport const calendarRootClass = styles.root;\n"]}

package/dist/chunk-KSLKNWWM.js

@@ -0,0 +1,28 @@
+import { VisuallyHidden } from './chunk-IB5UUE3S.js';
+import { Icon } from './chunk-O5LII5XP.js';
+import { classes } from './chunk-MI4QUKQS.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/badge/Badge.module.css
+var Badge_default = {
+  badge: "Badge_badge"
+};
+var DEV = typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
+function Badge({ tone = "neutral", variant = "subtle", size = "md", icon, count, max = 99, label, className, ref, children, ...rest }) {
+  if (count !== void 0 && count <= 0) return null;
+  const dot = variant === "dot";
+  if (DEV && dot && !label) {
+    console.warn('Badge: variant="dot" has no visible text, so it needs a `label` for assistive technology.');
+  }
+  const text = count === void 0 ? children : count > max ? `${max}+` : String(count);
+  return /* @__PURE__ */ jsxs("span", { ...rest, ref, className: classes(Badge_default.badge, className), "data-tone": tone, "data-variant": variant, "data-size": size, children: [
+    !dot && icon && /* @__PURE__ */ jsx(Icon, { size: "inherit", children: icon }),
+    !dot && text,
+    label && (dot || count !== void 0) && /* @__PURE__ */ jsx(VisuallyHidden, { children: dot ? label : ` ${label}` })
+  ] });
+}
+Badge.displayName = "Badge";
+
+export { Badge };
+//# sourceMappingURL=chunk-KSLKNWWM.js.map
+//# sourceMappingURL=chunk-KSLKNWWM.js.map

package/dist/chunk-KSLKNWWM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/badge/Badge.module.css","../src/badge/Badge.tsx"],"names":["badge"],"mappings":";;;;;;AAAA,IAAA,aAAA,GAAA;AAAA,EAKG,KAAA,EAAAA;AAAA,CAAA;ACmCH,IAAM,MAAM,OAAO,OAAA,KAAY,WAAA,IAAe,OAAA,CAAQ,KAAK,QAAA,KAAa,YAAA;AAiBjE,SAAS,MAAM,EAAE,IAAA,GAAO,WAAW,OAAA,GAAU,QAAA,EAAU,OAAO,IAAA,EAAM,IAAA,EAAM,KAAA,EAAO,GAAA,GAAM,IAAI,KAAA,EAAO,SAAA,EAAW,KAAK,QAAA,EAAU,GAAG,MAAK,EAAe;AACxJ,EAAA,IAAI,KAAA,KAAU,MAAA,IAAa,KAAA,IAAS,CAAA,EAAG,OAAO,IAAA;AAE9C,EAAA,MAAM,MAAM,OAAA,KAAY,KAAA;AACxB,EAAA,IAAI,GAAA,IAAO,GAAA,IAAO,CAAC,KAAA,EAAO;AACxB,IAAA,OAAA,CAAQ,KAAK,2FAA2F,CAAA;AAAA,EAC1G;AACA,EAAA,MAAM,IAAA,GAAO,KAAA,KAAU,MAAA,GAAY,QAAA,GAAW,KAAA,GAAQ,MAAM,CAAA,EAAG,GAAG,CAAA,CAAA,CAAA,GAAM,MAAA,CAAO,KAAK,CAAA;AAEpF,EAAA,4BACG,MAAA,EAAA,EAAM,GAAG,IAAA,EAAM,GAAA,EAAU,WAAW,OAAA,CAAQ,aAAA,CAAO,KAAA,EAAO,SAAS,GAAG,WAAA,EAAW,IAAA,EAAM,cAAA,EAAc,OAAA,EAAS,aAAW,IAAA,EACvH,QAAA,EAAA;AAAA,IAAA,CAAC,OAAO,IAAA,oBAAQ,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,WAAW,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,IAC3C,CAAC,GAAA,IAAO,IAAA;AAAA,IACR,KAAA,KAAU,GAAA,IAAO,KAAA,KAAU,MAAA,CAAA,oBAAc,GAAA,CAAC,kBAAgB,QAAA,EAAA,GAAA,GAAM,KAAA,GAAQ,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,EAAG;AAAA,GAAA,EACvF,CAAA;AAEJ;AAEA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-KSLKNWWM.js","sourcesContent":["/* Every value is a token (--badge-*). Tone × variant resolve into private custom properties. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .badge {\n    --_bg: var(--badge-neutral-subtle-bg);\n    --_fg: var(--badge-neutral-subtle-fg);\n\n    display: inline-flex;\n    align-items: center;\n    gap: var(--badge-gap);\n    padding-block: var(--badge-padding-block);\n    padding-inline: var(--badge-padding-inline-md);\n    border-radius: var(--badge-radius);\n    background-color: var(--_bg);\n    color: var(--_fg);\n    font-size: var(--badge-font-size-md);\n    font-weight: var(--badge-font-weight);\n    line-height: var(--badge-line-height);\n    white-space: nowrap;\n\n    &[data-size=\"sm\"] {\n      padding-inline: var(--badge-padding-inline-sm);\n      font-size: var(--badge-font-size-sm);\n    }\n\n    &[data-tone=\"neutral\"][data-variant=\"solid\"] {\n      --_bg: var(--badge-neutral-solid-bg);\n      --_fg: var(--badge-neutral-solid-fg);\n    }\n\n    &[data-tone=\"neutral\"][data-variant=\"subtle\"] {\n      --_bg: var(--badge-neutral-subtle-bg);\n      --_fg: var(--badge-neutral-subtle-fg);\n    }\n\n    &[data-tone=\"info\"][data-variant=\"solid\"] {\n      --_bg: var(--badge-info-solid-bg);\n      --_fg: var(--badge-info-solid-fg);\n    }\n\n    &[data-tone=\"info\"][data-variant=\"subtle\"] {\n      --_bg: var(--badge-info-subtle-bg);\n      --_fg: var(--badge-info-subtle-fg);\n    }\n\n    &[data-tone=\"success\"][data-variant=\"solid\"] {\n      --_bg: var(--badge-success-solid-bg);\n      --_fg: var(--badge-success-solid-fg);\n    }\n\n    &[data-tone=\"success\"][data-variant=\"subtle\"] {\n      --_bg: var(--badge-success-subtle-bg);\n      --_fg: var(--badge-success-subtle-fg);\n    }\n\n    &[data-tone=\"warning\"][data-variant=\"solid\"] {\n      --_bg: var(--badge-warning-solid-bg);\n      --_fg: var(--badge-warning-solid-fg);\n    }\n\n    &[data-tone=\"warning\"][data-variant=\"subtle\"] {\n      --_bg: var(--badge-warning-subtle-bg);\n      --_fg: var(--badge-warning-subtle-fg);\n    }\n\n    &[data-tone=\"error\"][data-variant=\"solid\"] {\n      --_bg: var(--badge-error-solid-bg);\n      --_fg: var(--badge-error-solid-fg);\n    }\n\n    &[data-tone=\"error\"][data-variant=\"subtle\"] {\n      --_bg: var(--badge-error-subtle-bg);\n      --_fg: var(--badge-error-subtle-fg);\n    }\n  }\n\n  /* A presence mark: the tone's solid fill, no text, no padding. After the tone rules so --_bg is set. */\n  .badge[data-variant=\"dot\"] {\n    inline-size: var(--badge-dot-size);\n    block-size: var(--badge-dot-size);\n    padding: 0;\n    vertical-align: middle;\n  }\n\n  .badge[data-tone=\"neutral\"][data-variant=\"dot\"] {\n    --_bg: var(--badge-neutral-solid-bg);\n  }\n\n  .badge[data-tone=\"info\"][data-variant=\"dot\"] {\n    --_bg: var(--badge-info-solid-bg);\n  }\n\n  .badge[data-tone=\"success\"][data-variant=\"dot\"] {\n    --_bg: var(--badge-success-solid-bg);\n  }\n\n  .badge[data-tone=\"warning\"][data-variant=\"dot\"] {\n    --_bg: var(--badge-warning-solid-bg);\n  }\n\n  .badge[data-tone=\"error\"][data-variant=\"dot\"] {\n    --_bg: var(--badge-error-solid-bg);\n  }\n}\n","import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { Icon } from '../icon';\nimport { classes } from '../internal/classes';\nimport { VisuallyHidden } from '../visually-hidden';\nimport styles from './Badge.module.css';\n\nexport type BadgeTone = 'neutral' | 'info' | 'success' | 'warning' | 'error';\nexport type BadgeVariant = 'solid' | 'subtle' | 'dot';\nexport type BadgeSize = 'sm' | 'md';\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n  /** Meaning, not colour: `neutral` for counts and tags. @default 'neutral' */\n  tone?: BadgeTone;\n  /**\n   * `solid` fills with the tone; `subtle` tints and uses the tone as text; `dot` is a\n   * small filled circle with no visible text, which needs a `label`. @default 'subtle'\n   */\n  variant?: BadgeVariant;\n  /** @default 'md' */\n  size?: BadgeSize;\n  /** Leading glyph, decorative. */\n  icon?: ReactNode;\n  /**\n   * A number to show instead of children, clamped to `max` (\"99+\"). Zero or less\n   * renders nothing: an empty inbox has no badge.\n   */\n  count?: number;\n  /** The highest count shown as is. @default 99 */\n  max?: number;\n  /**\n   * What the badge means, for assistive technology. Required for `variant=\"dot\"`\n   * (\"Unread messages\"), where it is the only content. With a `count` it is read\n   * after the number: `count={3} label=\"unread\"` is announced as \"3 unread\".\n   */\n  label?: string;\n  ref?: Ref<HTMLSpanElement>;\n  children?: ReactNode;\n}\n\n// Guarded: a consumer's bundler may not define `process`.\nconst DEV = typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production';\n\n/**\n * A small label for status, counts and tags. Tone and variant resolve\n * through `--badge-*` onto the status tokens, whose contrast is proven by\n * the token tests. Not interactive: for a removable chip, compose with a\n * Button.\n *\n * @status stable\n * @category Feedback\n * @accessibility Plain text: no role, no interaction, and deliberately no live region: a badge that is there when the page renders must not be announced as news (put `role=\"status\"` on a wrapper yourself if a count changes while the user is on the page). A `dot` has no visible text, so its `label` is rendered visually hidden; a `count` above `max` reads as \"99+\", followed by the `label` if there is one. Every tone × variant pair meets WCAG AA, proven by the token tests. Tone is reinforced by the text, not only by colour.\n * @do Keep the text to one or two words.\n * @do Give a `dot` a `label` that says what it marks, and a `count` a `label` that says what is counted.\n * Pair a leading icon with text, never alone.\n * @dont Make it clickable; compose a Button for a removable chip.\n * Use tone alone to convey meaning; say it in the text.\n */\nexport function Badge({ tone = 'neutral', variant = 'subtle', size = 'md', icon, count, max = 99, label, className, ref, children, ...rest }: BadgeProps) {\n  if (count !== undefined && count <= 0) return null;\n\n  const dot = variant === 'dot';\n  if (DEV && dot && !label) {\n    console.warn('Badge: variant=\"dot\" has no visible text, so it needs a `label` for assistive technology.');\n  }\n  const text = count === undefined ? children : count > max ? `${max}+` : String(count);\n\n  return (\n    <span {...rest} ref={ref} className={classes(styles.badge, className)} data-tone={tone} data-variant={variant} data-size={size}>\n      {!dot && icon && <Icon size=\"inherit\">{icon}</Icon>}\n      {!dot && text}\n      {label && (dot || count !== undefined) && <VisuallyHidden>{dot ? label : ` ${label}`}</VisuallyHidden>}\n    </span>\n  );\n}\n\nBadge.displayName = 'Badge';\n"]}

package/dist/{chunk-2ZP4ZBI5.js → chunk-LKWZZIRZ.js}

@@ -39,5 +39,5 @@ function Text({
 Text.displayName = "Text";
 
 export { Text };
-//# sourceMappingURL=chunk-2ZP4ZBI5.js.map
-//# sourceMappingURL=chunk-2ZP4ZBI5.js.map
+//# sourceMappingURL=chunk-LKWZZIRZ.js.map
+//# sourceMappingURL=chunk-LKWZZIRZ.js.map

package/dist/chunk-LKWZZIRZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/text/Text.module.css","../src/text/Text.tsx"],"names":["text"],"mappings":";;;;AAAA,IAAA,YAAA,GAAA;AAAA,EAKG,IAAA,EAAAA;AAAA,CAAA;;;ACoCI,SAAS,IAAA,CAAK;AAAA,EACnB,EAAA,GAAK,GAAA;AAAA,EACL,IAAA,GAAO,IAAA;AAAA,EACP,MAAA,GAAS,SAAA;AAAA,EACT,IAAA,GAAO,SAAA;AAAA,EACP,MAAA,GAAS,MAAA;AAAA,EACT,KAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,SAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAc;AACZ,EAAA,OAAO,aAAA;AAAA,IACL,EAAA;AAAA,IACA;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAA;AAAA,MACA,SAAA,EAAW,OAAA,CAAQ,YAAA,CAAO,IAAA,EAAM,SAAS,CAAA;AAAA,MACzC,WAAA,EAAa,IAAA;AAAA,MACb,aAAA,EAAe,MAAA;AAAA,MACf,WAAA,EAAa,IAAA;AAAA,MACb,aAAA,EAAe,MAAA;AAAA,MACf,YAAA,EAAc,KAAA;AAAA,MACd,eAAA,EAAiB,WAAW,EAAA,GAAK;AAAA,KACnC;AAAA,IACA;AAAA,GACF;AACF;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA","file":"chunk-LKWZZIRZ.js","sourcesContent":["/* Every value is a token (--text-*). Variants are data attributes. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .text {\n    margin: 0;\n    font-family: var(--text-font-family-body);\n    font-size: var(--text-size-md);\n    font-weight: var(--text-weight-regular);\n    line-height: var(--text-line-height);\n    color: var(--text-tone-default);\n\n    &[data-size=\"xs\"] { font-size: var(--text-size-xs); }\n    &[data-size=\"sm\"] { font-size: var(--text-size-sm); }\n    &[data-size=\"lg\"] { font-size: var(--text-size-lg); }\n    &[data-size=\"xl\"] { font-size: var(--text-size-xl); }\n    &[data-weight=\"medium\"] { font-weight: var(--text-weight-medium); }\n    &[data-weight=\"semibold\"] { font-weight: var(--text-weight-semibold); }\n    &[data-tone=\"muted\"] { color: var(--text-tone-muted); }\n    &[data-tone=\"faint\"] { color: var(--text-tone-faint); }\n    &[data-family=\"mono\"] { font-family: var(--text-font-family-mono); }\n    &[data-align=\"start\"] { text-align: start; }\n    &[data-align=\"center\"] { text-align: center; }\n    &[data-align=\"end\"] { text-align: end; }\n\n    &[data-truncate] {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n  }\n}\n","import { createElement, type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './Text.module.css';\n\nexport type TextElement = 'p' | 'span' | 'div' | 'strong' | 'em' | 'small';\nexport type TextSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\nexport type TextWeight = 'regular' | 'medium' | 'semibold';\nexport type TextTone = 'default' | 'muted' | 'faint';\nexport type TextFamily = 'body' | 'mono';\nexport type TextAlign = 'start' | 'center' | 'end';\n\nexport interface TextProps extends HTMLAttributes<HTMLElement> {\n  /** The element to render. For a label use `Field.Label`. @default 'p' */\n  as?: TextElement;\n  /** @default 'md' */\n  size?: TextSize;\n  /** @default 'regular' */\n  weight?: TextWeight;\n  /** Emphasis: `muted` for secondary text, `faint` for the least important. @default 'default' */\n  tone?: TextTone;\n  /** @default 'body' */\n  family?: TextFamily;\n  align?: TextAlign;\n  /** Single line with an ellipsis. @default false */\n  truncate?: boolean;\n  ref?: Ref<HTMLElement>;\n  children: ReactNode;\n}\n\n/**\n * The type scale as a component. Every combination of size, weight, tone and\n * family resolves through `--text-*` tokens, so body copy never carries its\n * own font declarations. State on the DOM: `data-size`, `data-weight`,\n * `data-tone`, `data-family`, `data-align`, `data-truncate`.\n *\n * @status stable\n * @category Typography\n * @accessibility Plain text with no role beyond the element chosen by `as`; `truncate` clips visually while the full text stays in the accessibility tree.\n * @do Use `tone=\"faint\"` only on base and raised surfaces (its contrast is promised there).\n * @dont Use `as=\"label\"`; labels belong to Field.\n */\nexport function Text({\n  as = 'p',\n  size = 'md',\n  weight = 'regular',\n  tone = 'default',\n  family = 'body',\n  align,\n  truncate = false,\n  className,\n  ref,\n  children,\n  ...rest\n}: TextProps) {\n  return createElement(\n    as,\n    {\n      ...rest,\n      ref,\n      className: classes(styles.text, className),\n      'data-size': size,\n      'data-weight': weight,\n      'data-tone': tone,\n      'data-family': family,\n      'data-align': align,\n      'data-truncate': truncate ? '' : undefined,\n    },\n    children,\n  );\n}\n\nText.displayName = 'Text';\n"]}

package/dist/{chunk-ASNTNTJW.js → chunk-O5LII5XP.js}

@@ -23,5 +23,5 @@ function Icon({ children, size = "md", label, className, ref, ...rest }) {
 Icon.displayName = "Icon";
 
 export { Icon };
-//# sourceMappingURL=chunk-ASNTNTJW.js.map
-//# sourceMappingURL=chunk-ASNTNTJW.js.map
+//# sourceMappingURL=chunk-O5LII5XP.js.map
+//# sourceMappingURL=chunk-O5LII5XP.js.map

package/dist/chunk-O5LII5XP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/icon/Icon.module.css","../src/icon/Icon.tsx"],"names":["icon"],"mappings":";;;;AAAA,IAAA,YAAA,GAAA;AAAA,EAKG,IAAA,EAAAA;AAAA,CAAA;ACyBI,SAAS,IAAA,CAAK,EAAE,QAAA,EAAU,IAAA,GAAO,IAAA,EAAM,OAAO,SAAA,EAAW,GAAA,EAAK,GAAG,IAAA,EAAK,EAAc;AACzF,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,SAAA,EAAW,OAAA,CAAQ,YAAA,CAAO,IAAA,EAAM,SAAS,CAAA;AAAA,MACzC,WAAA,EAAW,IAAA;AAAA,MACX,IAAA,EAAM,QAAQ,KAAA,GAAQ,MAAA;AAAA,MACtB,YAAA,EAAY,KAAA;AAAA,MACZ,aAAA,EAAa,QAAQ,MAAA,GAAY,IAAA;AAAA,MAEhC;AAAA;AAAA,GACH;AAEJ;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA","file":"chunk-O5LII5XP.js","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","import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './Icon.module.css';\n\nexport type IconSize = 'sm' | 'md' | 'lg';\n\nexport interface IconProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {\n  /** Any SVG (for instance from `@pearpages/pulp-icons`); it is sized to the icon box. */\n  children: ReactNode;\n  /** `inherit` follows the surrounding font size, for icons inside text-sized controls. @default 'md' */\n  size?: IconSize | 'inherit';\n  /**\n   * Accessible name. Without it the icon is decorative and hidden from\n   * assistive technology; with it the icon is an image with that name.\n   */\n  label?: string;\n  ref?: Ref<HTMLSpanElement>;\n}\n\n/**\n * Sizes any SVG to the icon scale and settles its accessibility: decorative\n * by default, an image when given a `label`. Colour is `currentColor`, so an\n * icon inherits the text tone around it.\n *\n * @status stable\n * @category Utilities\n * @accessibility `aria-hidden` by default (decorative); `role=\"img\"` with `aria-label` when `label` is given. Sized in `em` so it follows the text around it.\n * @do Give `label` only when the icon carries meaning the text around it does not.\n * @dont Use a labelled icon as the only name of a control; use IconButton.\n */\nexport function Icon({ children, size = 'md', label, className, ref, ...rest }: IconProps) {\n  return (\n    <span\n      {...rest}\n      ref={ref}\n      className={classes(styles.icon, className)}\n      data-size={size}\n      role={label ? 'img' : undefined}\n      aria-label={label}\n      aria-hidden={label ? undefined : true}\n    >\n      {children}\n    </span>\n  );\n}\n\nIcon.displayName = 'Icon';\n"]}

package/dist/chunk-OKA2PLDV.js

@@ -0,0 +1,85 @@
+import { classes } from './chunk-MI4QUKQS.js';
+import { useId, useState } from 'react';
+import { Close } from '@pearpages/pulp-icons';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/chip/Chip.module.css
+var Chip_default = {
+  root: "Chip_root",
+  label: "Chip_label",
+  remove: "Chip_remove"
+};
+function Chip({
+  selected,
+  defaultSelected,
+  onSelectedChange,
+  onRemove,
+  removeLabel = "Remove",
+  size = "md",
+  tone = "neutral",
+  disabled,
+  className,
+  onClick,
+  ref,
+  children,
+  ...rest
+}) {
+  const id = useId();
+  const [own, setOwn] = useState(defaultSelected ?? false);
+  const toggles = selected !== void 0 || defaultSelected !== void 0 || onSelectedChange !== void 0;
+  const pressed = selected ?? own;
+  const interactive = toggles || onClick !== void 0;
+  const label = interactive ? /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      ...rest,
+      ref,
+      id: `${id}-label`,
+      className: Chip_default.label,
+      disabled,
+      "aria-pressed": toggles ? pressed : void 0,
+      onClick: (event) => {
+        onClick?.(event);
+        if (event.defaultPrevented || !toggles) return;
+        if (selected === void 0) setOwn(!pressed);
+        onSelectedChange?.(!pressed);
+      },
+      children
+    }
+  ) : /* @__PURE__ */ jsx("span", { id: `${id}-label`, className: Chip_default.label, ref, children });
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: classes(Chip_default.root, className),
+      "data-size": size,
+      "data-tone": tone,
+      "data-selected": toggles && pressed ? "" : void 0,
+      "data-interactive": interactive ? "" : void 0,
+      "data-disabled": disabled ? "" : void 0,
+      role: interactive && onRemove ? "group" : void 0,
+      "aria-labelledby": interactive && onRemove ? `${id}-label` : void 0,
+      children: [
+        label,
+        onRemove && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            id: `${id}-remove`,
+            className: Chip_default.remove,
+            disabled,
+            "aria-label": removeLabel,
+            "aria-labelledby": `${id}-remove ${id}-label`,
+            onClick: onRemove,
+            children: /* @__PURE__ */ jsx(Close, { "aria-hidden": "true" })
+          }
+        )
+      ]
+    }
+  );
+}
+Chip.displayName = "Chip";
+
+export { Chip };
+//# sourceMappingURL=chunk-OKA2PLDV.js.map
+//# sourceMappingURL=chunk-OKA2PLDV.js.map

package/dist/chunk-OKA2PLDV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/chip/Chip.module.css","../src/chip/Chip.tsx"],"names":["root","label","remove"],"mappings":";;;;;;AAAA,IAAA,YAAA,GAAA;AAAA,EAKG,IAAA,EAAAA,WAAAA;AAAA,EA6DA,KAAA,EAAAC,YAAAA;AAAA,EACA,MAAA,EAAAC;AAAA,CAAA;ACzBI,SAAS,IAAA,CAAK;AAAA,EACnB,QAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA,GAAc,QAAA;AAAA,EACd,IAAA,GAAO,IAAA;AAAA,EACP,IAAA,GAAO,SAAA;AAAA,EACP,QAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAc;AACZ,EAAA,MAAM,KAAK,KAAA,EAAM;AACjB,EAAA,MAAM,CAAC,GAAA,EAAK,MAAM,CAAA,GAAI,QAAA,CAAS,mBAAmB,KAAK,CAAA;AACvD,EAAA,MAAM,OAAA,GAAU,QAAA,KAAa,MAAA,IAAa,eAAA,KAAoB,UAAa,gBAAA,KAAqB,MAAA;AAChG,EAAA,MAAM,UAAU,QAAA,IAAY,GAAA;AAC5B,EAAA,MAAM,WAAA,GAAc,WAAW,OAAA,KAAY,MAAA;AAE3C,EAAA,MAAM,QAAQ,WAAA,mBACZ,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,EAAA,EAAI,GAAG,EAAE,CAAA,MAAA,CAAA;AAAA,MACT,WAAW,YAAA,CAAO,KAAA;AAAA,MAClB,QAAA;AAAA,MACA,cAAA,EAAc,UAAU,OAAA,GAAU,MAAA;AAAA,MAClC,OAAA,EAAS,CAAC,KAAA,KAAU;AAClB,QAAA,OAAA,GAAU,KAAK,CAAA;AACf,QAAA,IAAI,KAAA,CAAM,gBAAA,IAAoB,CAAC,OAAA,EAAS;AACxC,QAAA,IAAI,QAAA,KAAa,MAAA,EAAW,MAAA,CAAO,CAAC,OAAO,CAAA;AAC3C,QAAA,gBAAA,GAAmB,CAAC,OAAO,CAAA;AAAA,MAC7B,CAAA;AAAA,MAEC;AAAA;AAAA,GACH,mBAEA,GAAA,CAAC,MAAA,EAAA,EAAK,EAAA,EAAI,CAAA,EAAG,EAAE,CAAA,MAAA,CAAA,EAAU,SAAA,EAAW,YAAA,CAAO,KAAA,EAAO,GAAA,EAC/C,QAAA,EACH,CAAA;AAGF,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,OAAA,CAAQ,YAAA,CAAO,IAAA,EAAM,SAAS,CAAA;AAAA,MACzC,WAAA,EAAW,IAAA;AAAA,MACX,WAAA,EAAW,IAAA;AAAA,MACX,eAAA,EAAe,OAAA,IAAW,OAAA,GAAU,EAAA,GAAK,MAAA;AAAA,MACzC,kBAAA,EAAkB,cAAc,EAAA,GAAK,MAAA;AAAA,MACrC,eAAA,EAAe,WAAW,EAAA,GAAK,MAAA;AAAA,MAC/B,IAAA,EAAM,WAAA,IAAe,QAAA,GAAW,OAAA,GAAU,MAAA;AAAA,MAC1C,iBAAA,EAAiB,WAAA,IAAe,QAAA,GAAW,CAAA,EAAG,EAAE,CAAA,MAAA,CAAA,GAAW,MAAA;AAAA,MAE1D,QAAA,EAAA;AAAA,QAAA,KAAA;AAAA,QACA,QAAA,oBACC,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,QAAA;AAAA,YACL,EAAA,EAAI,GAAG,EAAE,CAAA,OAAA,CAAA;AAAA,YACT,WAAW,YAAA,CAAO,MAAA;AAAA,YAClB,QAAA;AAAA,YACA,YAAA,EAAY,WAAA;AAAA,YACZ,iBAAA,EAAiB,CAAA,EAAG,EAAE,CAAA,QAAA,EAAW,EAAE,CAAA,MAAA,CAAA;AAAA,YACnC,OAAA,EAAS,QAAA;AAAA,YAET,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAM,aAAA,EAAY,MAAA,EAAO;AAAA;AAAA;AAC5B;AAAA;AAAA,GAEJ;AAEJ;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA","file":"chunk-OKA2PLDV.js","sourcesContent":["/* Every value is a token: --chip-* in packages/tokens/tokens/component/chip.json */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    --_bg: var(--chip-neutral-bg);\n    --_bg-hover: var(--chip-neutral-bg-hover);\n    --_fg: var(--chip-neutral-fg);\n    --_border: var(--chip-neutral-border);\n    --_selected-bg: var(--chip-neutral-selected-bg);\n    --_selected-fg: var(--chip-neutral-selected-fg);\n    --_height: var(--chip-height-md);\n    --_padding: var(--chip-padding-x-md);\n\n    display: inline-flex;\n    align-items: stretch;\n    box-sizing: border-box;\n    min-block-size: var(--_height);\n    max-inline-size: 100%;\n    border: var(--chip-border-width) solid var(--_border);\n    border-radius: var(--chip-radius);\n    background: var(--_bg);\n    color: var(--_fg);\n    font-family: var(--font-family-body);\n    font-size: var(--chip-font-size-md);\n    font-weight: var(--chip-weight);\n    line-height: 1;\n    white-space: nowrap;\n    vertical-align: middle;\n\n    &[data-tone='action'] {\n      --_bg: var(--chip-action-bg);\n      --_bg-hover: var(--chip-action-bg-hover);\n      --_fg: var(--chip-action-fg);\n      --_border: var(--chip-action-border);\n      --_selected-bg: var(--chip-action-selected-bg);\n      --_selected-fg: var(--chip-action-selected-fg);\n    }\n\n    &[data-size='sm'] {\n      --_height: var(--chip-height-sm);\n      --_padding: var(--chip-padding-x-sm);\n\n      font-size: var(--chip-font-size-sm);\n    }\n\n    &[data-size='lg'] {\n      --_height: var(--chip-height-lg);\n      --_padding: var(--chip-padding-x-lg);\n\n      font-size: var(--chip-font-size-lg);\n    }\n\n    &[data-selected] {\n      border-color: var(--_selected-bg);\n      background: var(--_selected-bg);\n      color: var(--_selected-fg);\n    }\n\n    &[data-disabled] {\n      opacity: 0.55;\n    }\n  }\n\n  /* The two controls are transparent: the pill is painted once, on the root. */\n  .label,\n  .remove {\n    display: inline-flex;\n    align-items: center;\n    border: 0;\n    border-radius: var(--chip-radius);\n    background: transparent;\n    color: inherit;\n    font: inherit;\n\n    &:is(button) {\n      cursor: pointer;\n    }\n\n    &:is(button):disabled {\n      cursor: not-allowed;\n    }\n\n    &:focus-visible {\n      outline: var(--chip-focus-ring-width) solid var(--chip-focus-ring);\n      outline-offset: var(--chip-focus-ring-offset);\n    }\n  }\n\n  .label {\n    min-inline-size: 0;\n    padding-block: 0;\n    padding-inline: var(--_padding);\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    /* With a remove button the label gives up its end padding to it. */\n    &:not(:last-child) {\n      padding-inline-end: var(--chip-gap);\n    }\n  }\n\n  /* On the label, not `.root:has(.label:hover)`: Firefox 120, the support floor, has no :has(). */\n  .root:not([data-selected], [data-disabled]) button.label:hover {\n    background: var(--_bg-hover);\n  }\n\n  .remove {\n    flex: none;\n    justify-content: center;\n\n    /* A square as tall as the chip, so the target is never smaller than the chip itself. */\n    inline-size: var(--_height);\n    padding: 0;\n  }\n}\n","import { useId, useState, type ButtonHTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { Close } from '@pearpages/pulp-icons';\nimport { classes } from '../internal/classes';\nimport styles from './Chip.module.css';\n\nexport type ChipSize = 'sm' | 'md' | 'lg';\nexport type ChipTone = 'neutral' | 'action';\n\nexport interface ChipProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value'> {\n  /** Controlled pressed state. Passing it (or `defaultSelected`, or `onSelectedChange`) makes the chip a toggle. */\n  selected?: boolean;\n  /** Uncontrolled initial pressed state. */\n  defaultSelected?: boolean;\n  /** Called with the next state when the chip is pressed. */\n  onSelectedChange?: (selected: boolean) => void;\n  /** Adds a remove button after the label: a second button beside the chip, never inside it. */\n  onRemove?: () => void;\n  /** The remove button is named \"`removeLabel` + the chip's label\" (\"Remove Vegan\"). @default 'Remove' */\n  removeLabel?: string;\n  /** `sm` is 24px high, the minimum target size. @default 'md' */\n  size?: ChipSize;\n  /** `action` takes the brand's colour; a selected chip is filled in either tone. @default 'neutral' */\n  tone?: ChipTone;\n\n  /** The `button` that carries the label, or the `span` when the chip neither toggles nor has an `onClick`. */\n  ref?: Ref<HTMLButtonElement>;\n  children: ReactNode;\n}\n\n/**\n * A small pill for a choice or a value the user controls: a filter that\n * toggles (`selected`), a tag that can be removed (`onRemove`), or both. The\n * label is a button only when pressing it does something.\n *\n * @status experimental\n * @category Actions\n * @accessibility A toggle chip is a native `button` with `aria-pressed`, so Space and Enter work and the state is announced. The remove control is a second `button`, a sibling of the first (a button inside a button is invalid HTML and unreachable by keyboard), named by `removeLabel` plus the chip's own label through `aria-labelledby`: \"Remove Vegan\", not \"Remove\" six times. The pair is wrapped in a `role=\"group\"` named by the label only when there are two controls. `disabled` disables both. After removing a chip, move focus yourself (to the next chip or the input): the button that had it is gone.\n * @do Use a group of toggle chips for filters where several can be on at once.\n * @do Keep the label to a word or two; a chip does not wrap.\n * @dont Use a chip that does nothing as a label or a status: that is a Badge.\n * @dont Use chips for one choice out of several; that is a SegmentedControl or a RadioGroup.\n */\nexport function Chip({\n  selected,\n  defaultSelected,\n  onSelectedChange,\n  onRemove,\n  removeLabel = 'Remove',\n  size = 'md',\n  tone = 'neutral',\n  disabled,\n  className,\n  onClick,\n  ref,\n  children,\n  ...rest\n}: ChipProps) {\n  const id = useId();\n  const [own, setOwn] = useState(defaultSelected ?? false);\n  const toggles = selected !== undefined || defaultSelected !== undefined || onSelectedChange !== undefined;\n  const pressed = selected ?? own;\n  const interactive = toggles || onClick !== undefined;\n\n  const label = interactive ? (\n    <button\n      type=\"button\"\n      {...rest}\n      ref={ref}\n      id={`${id}-label`}\n      className={styles.label}\n      disabled={disabled}\n      aria-pressed={toggles ? pressed : undefined}\n      onClick={(event) => {\n        onClick?.(event);\n        if (event.defaultPrevented || !toggles) return;\n        if (selected === undefined) setOwn(!pressed);\n        onSelectedChange?.(!pressed);\n      }}\n    >\n      {children}\n    </button>\n  ) : (\n    <span id={`${id}-label`} className={styles.label} ref={ref as Ref<HTMLSpanElement>}>\n      {children}\n    </span>\n  );\n\n  return (\n    <span\n      className={classes(styles.root, className)}\n      data-size={size}\n      data-tone={tone}\n      data-selected={toggles && pressed ? '' : undefined}\n      data-interactive={interactive ? '' : undefined}\n      data-disabled={disabled ? '' : undefined}\n      role={interactive && onRemove ? 'group' : undefined}\n      aria-labelledby={interactive && onRemove ? `${id}-label` : undefined}\n    >\n      {label}\n      {onRemove && (\n        <button\n          type=\"button\"\n          id={`${id}-remove`}\n          className={styles.remove}\n          disabled={disabled}\n          aria-label={removeLabel}\n          aria-labelledby={`${id}-remove ${id}-label`}\n          onClick={onRemove}\n        >\n          <Close aria-hidden=\"true\" />\n        </button>\n      )}\n    </span>\n  );\n}\n\nChip.displayName = 'Chip';\n"]}

package/dist/{chunk-BBV4L5WO.js → chunk-Q6SYKNZ5.js}

@@ -1,4 +1,4 @@
-import { Field } from './chunk-2PXTVZ7H.js';
+import { Field } from './chunk-SXMORGSG.js';
 import { classes } from './chunk-MI4QUKQS.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
@@ -39,5 +39,5 @@ function ToggleField({
 }
 
 export { ToggleField };
-//# sourceMappingURL=chunk-BBV4L5WO.js.map
-//# sourceMappingURL=chunk-BBV4L5WO.js.map
+//# sourceMappingURL=chunk-Q6SYKNZ5.js.map
+//# sourceMappingURL=chunk-Q6SYKNZ5.js.map

package/dist/{chunk-BBV4L5WO.js.map → chunk-Q6SYKNZ5.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/internal/ToggleField.tsx"],"names":[],"mappings":";;;;AA0BO,SAAS,WAAA,CAAY;AAAA,EAC1B,KAAA;AAAA,EACA,WAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,EAAA;AAAA,EACA,SAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,kBAAA,EAAoB;AACtB,CAAA,EAAqB;AACnB,EAAA,MAAM,UAAU,KAAA,KAAU,MAAA,IAAa,UAAU,IAAA,IAAQ,KAAA,KAAU,SAAS,KAAA,KAAU,EAAA;AACtF,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,MAC1B,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,MAC1B,SAAA,EAAW,OAAA,CAAQ,aAAA,EAAe,SAAS,CAAA;AAAA,MAC3C,WAAA,EAAW,IAAA;AAAA,MAEX,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAW,YAAA,EACd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,CAAM,OAAA,EAAN,EAAc,kBAAA,EAAkB,aAAc,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,0BACvD,GAAA,CAAC,KAAA,CAAM,KAAA,EAAN,EAAa,QAAA,EAAA,KAAA,EAAM;AAAA,SAAA,EACtB,CAAA;AAAA,QACC,WAAA,oBAAe,GAAA,CAAC,KAAA,CAAM,WAAA,EAAN,EAAmB,QAAA,EAAA,WAAA,EAAY,CAAA;AAAA,QAC/C,OAAA,oBAAW,GAAA,CAAC,KAAA,CAAM,KAAA,EAAN,EAAa,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GAClC;AAEJ","file":"chunk-BBV4L5WO.js","sourcesContent":["import type { ReactNode } from 'react';\nimport { Field } from '../field';\nimport { classes } from './classes';\n\nexport type ToggleSize = 'sm' | 'md' | 'lg';\n\nexport interface ToggleFieldProps {\n  /** Visible inline label. */\n  label: ReactNode;\n  description?: ReactNode;\n  error?: ReactNode;\n  size: ToggleSize;\n  disabled?: boolean;\n  required?: boolean;\n  id?: string;\n  className?: string;\n  /** The Field root class of the concrete control (checkbox, switch). */\n  rootClassName: string | undefined;\n  /** The class of the row holding the control and its label. */\n  rowClassName: string | undefined;\n  /** The single `<input>` element; Field.Control wires it. */\n  control: ReactNode;\n  'aria-describedby'?: string;\n}\n\n/** Field wiring for a control whose label sits beside it: Checkbox, Switch. */\nexport function ToggleField({\n  label,\n  description,\n  error,\n  size,\n  disabled,\n  required,\n  id,\n  className,\n  rootClassName,\n  rowClassName,\n  control,\n  'aria-describedby': describedBy,\n}: ToggleFieldProps) {\n  const invalid = error !== undefined && error !== null && error !== false && error !== '';\n  return (\n    <Field\n      id={id}\n      invalid={invalid}\n      disabled={Boolean(disabled)}\n      required={Boolean(required)}\n      className={classes(rootClassName, className)}\n      data-size={size}\n    >\n      <div className={rowClassName}>\n        <Field.Control aria-describedby={describedBy}>{control}</Field.Control>\n        <Field.Label>{label}</Field.Label>\n      </div>\n      {description && <Field.Description>{description}</Field.Description>}\n      {invalid && <Field.Error>{error}</Field.Error>}\n    </Field>\n  );\n}\n"]}
+{"version":3,"sources":["../src/internal/ToggleField.tsx"],"names":[],"mappings":";;;;AA0BO,SAAS,WAAA,CAAY;AAAA,EAC1B,KAAA;AAAA,EACA,WAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,EAAA;AAAA,EACA,SAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,kBAAA,EAAoB;AACtB,CAAA,EAAqB;AACnB,EAAA,MAAM,UAAU,KAAA,KAAU,MAAA,IAAa,UAAU,IAAA,IAAQ,KAAA,KAAU,SAAS,KAAA,KAAU,EAAA;AACtF,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,MAC1B,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,MAC1B,SAAA,EAAW,OAAA,CAAQ,aAAA,EAAe,SAAS,CAAA;AAAA,MAC3C,WAAA,EAAW,IAAA;AAAA,MAEX,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAW,YAAA,EACd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,CAAM,OAAA,EAAN,EAAc,kBAAA,EAAkB,aAAc,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,0BACvD,GAAA,CAAC,KAAA,CAAM,KAAA,EAAN,EAAa,QAAA,EAAA,KAAA,EAAM;AAAA,SAAA,EACtB,CAAA;AAAA,QACC,WAAA,oBAAe,GAAA,CAAC,KAAA,CAAM,WAAA,EAAN,EAAmB,QAAA,EAAA,WAAA,EAAY,CAAA;AAAA,QAC/C,OAAA,oBAAW,GAAA,CAAC,KAAA,CAAM,KAAA,EAAN,EAAa,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GAClC;AAEJ","file":"chunk-Q6SYKNZ5.js","sourcesContent":["import type { ReactNode } from 'react';\nimport { Field } from '../field';\nimport { classes } from './classes';\n\nexport type ToggleSize = 'sm' | 'md' | 'lg';\n\nexport interface ToggleFieldProps {\n  /** Visible inline label. */\n  label: ReactNode;\n  description?: ReactNode;\n  error?: ReactNode;\n  size: ToggleSize;\n  disabled?: boolean;\n  required?: boolean;\n  id?: string;\n  className?: string;\n  /** The Field root class of the concrete control (checkbox, switch). */\n  rootClassName: string | undefined;\n  /** The class of the row holding the control and its label. */\n  rowClassName: string | undefined;\n  /** The single `<input>` element; Field.Control wires it. */\n  control: ReactNode;\n  'aria-describedby'?: string;\n}\n\n/** Field wiring for a control whose label sits beside it: Checkbox, Switch. */\nexport function ToggleField({\n  label,\n  description,\n  error,\n  size,\n  disabled,\n  required,\n  id,\n  className,\n  rootClassName,\n  rowClassName,\n  control,\n  'aria-describedby': describedBy,\n}: ToggleFieldProps) {\n  const invalid = error !== undefined && error !== null && error !== false && error !== '';\n  return (\n    <Field\n      id={id}\n      invalid={invalid}\n      disabled={Boolean(disabled)}\n      required={Boolean(required)}\n      className={classes(rootClassName, className)}\n      data-size={size}\n    >\n      <div className={rowClassName}>\n        <Field.Control aria-describedby={describedBy}>{control}</Field.Control>\n        <Field.Label>{label}</Field.Label>\n      </div>\n      {description && <Field.Description>{description}</Field.Description>}\n      {invalid && <Field.Error>{error}</Field.Error>}\n    </Field>\n  );\n}\n"]}

package/dist/chunk-QID6YYFF.js

@@ -0,0 +1,33 @@
+import { classes } from './chunk-MI4QUKQS.js';
+import { jsx } from 'react/jsx-runtime';
+
+// src/divider/Divider.module.css
+var Divider_default = {
+  divider: "Divider_divider"
+};
+function Divider({
+  orientation = "horizontal",
+  spacing = "none",
+  decorative = true,
+  className,
+  ref,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...rest,
+      ref,
+      role: decorative ? "none" : "separator",
+      "aria-orientation": !decorative && orientation === "vertical" ? "vertical" : void 0,
+      className: classes(Divider_default.divider, className),
+      "data-orientation": orientation,
+      "data-spacing": spacing
+    }
+  );
+}
+Divider.displayName = "Divider";
+
+export { Divider };
+//# sourceMappingURL=chunk-QID6YYFF.js.map
+//# sourceMappingURL=chunk-QID6YYFF.js.map

package/dist/chunk-QID6YYFF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/divider/Divider.module.css","../src/divider/Divider.tsx"],"names":["divider"],"mappings":";;;;AAAA,IAAA,eAAA,GAAA;AAAA,EAKG,OAAA,EAAAA;AAAA,CAAA;AC4BI,SAAS,OAAA,CAAQ;AAAA,EACtB,WAAA,GAAc,YAAA;AAAA,EACd,OAAA,GAAU,MAAA;AAAA,EACV,UAAA,GAAa,IAAA;AAAA,EACb,SAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAiB;AACf,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,IAAA,EAAM,aAAa,MAAA,GAAS,WAAA;AAAA,MAC5B,kBAAA,EAAkB,CAAC,UAAA,IAAc,WAAA,KAAgB,aAAa,UAAA,GAAa,MAAA;AAAA,MAC3E,SAAA,EAAW,OAAA,CAAQ,eAAA,CAAO,OAAA,EAAS,SAAS,CAAA;AAAA,MAC5C,kBAAA,EAAkB,WAAA;AAAA,MAClB,cAAA,EAAc;AAAA;AAAA,GAChB;AAEJ;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-QID6YYFF.js","sourcesContent":["/* Every value is a token: --divider-* in packages/tokens/tokens/component/divider.json */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .divider {\n    flex-shrink: 0;\n    margin: 0;\n    border: 0;\n    background-color: var(--divider-color);\n\n    &[data-orientation=\"horizontal\"] {\n      inline-size: 100%;\n      block-size: var(--divider-thickness);\n\n      &[data-spacing=\"sm\"] { margin-block: var(--divider-spacing-sm); }\n      &[data-spacing=\"md\"] { margin-block: var(--divider-spacing-md); }\n      &[data-spacing=\"lg\"] { margin-block: var(--divider-spacing-lg); }\n    }\n\n    &[data-orientation=\"vertical\"] {\n      align-self: stretch;\n      inline-size: var(--divider-thickness);\n\n      &[data-spacing=\"sm\"] { margin-inline: var(--divider-spacing-sm); }\n      &[data-spacing=\"md\"] { margin-inline: var(--divider-spacing-md); }\n      &[data-spacing=\"lg\"] { margin-inline: var(--divider-spacing-lg); }\n    }\n  }\n}\n","import type { HTMLAttributes, Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './Divider.module.css';\n\nexport type DividerOrientation = 'horizontal' | 'vertical';\nexport type DividerSpacing = 'none' | 'sm' | 'md' | 'lg';\n\nexport interface DividerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {\n  /** @default 'horizontal' */\n  orientation?: DividerOrientation;\n  /** Space on both sides, along the axis the line separates. @default 'none' */\n  spacing?: DividerSpacing;\n  /**\n   * A decorative line is hidden from assistive technology. Pass `false` when the\n   * line is the only thing that says two groups are separate. @default true\n   */\n  decorative?: boolean;\n\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * A hairline between two groups of content, horizontal or vertical. A vertical\n * divider stretches to its flex or grid row, so it needs a parent that lays it out.\n *\n * @status experimental\n * @category Layout\n * @accessibility Decorative by default: `role=\"none\"`, nothing is announced, because headings and landmarks should already carry the structure. With `decorative={false}` it is a `separator`, and a vertical one says so through `aria-orientation`. It is never focusable: a separator that moves is a splitter, which this is not.\n * @do Put it between groups inside a Card, a Menu-like list or a toolbar.\n * @do Let `spacing` set the distance, so it stays on the spacing scale.\n * @dont Use it to draw a border around something; that is the container's border.\n * @dont Rely on it alone to tell a screen reader that a new section starts; use a heading.\n */\nexport function Divider({\n  orientation = 'horizontal',\n  spacing = 'none',\n  decorative = true,\n  className,\n  ref,\n  ...rest\n}: DividerProps) {\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      role={decorative ? 'none' : 'separator'}\n      aria-orientation={!decorative && orientation === 'vertical' ? 'vertical' : undefined}\n      className={classes(styles.divider, className)}\n      data-orientation={orientation}\n      data-spacing={spacing}\n    />\n  );\n}\n\nDivider.displayName = 'Divider';\n"]}

package/dist/{chunk-ZVDN3GRI.js → chunk-QJG5ILK5.js}

@@ -44,6 +44,6 @@ function renderAsChild(displayName, children, props, options = {}) {
   return cloneElement(child, merged);
 }
 
-export { renderAsChild };
-//# sourceMappingURL=chunk-ZVDN3GRI.js.map
-//# sourceMappingURL=chunk-ZVDN3GRI.js.map
+export { mergeRefs, renderAsChild };
+//# sourceMappingURL=chunk-QJG5ILK5.js.map
+//# sourceMappingURL=chunk-QJG5ILK5.js.map

package/dist/{chunk-ZVDN3GRI.js.map → chunk-QJG5ILK5.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/internal/asChild.ts"],"names":[],"mappings":";;;AAQO,SAAS,aAAgB,IAAA,EAAyC;AACvE,EAAA,OAAO,CAAC,KAAA,KAAoB;AAC1B,IAAA,KAAA,MAAW,OAAO,IAAA,EAAM;AACtB,MAAA,IAAI,OAAO,QAAQ,UAAA,EAAY;AAC7B,QAAA,GAAA,CAAI,KAAK,CAAA;AAAA,MACX,CAAA,MAAA,IAAW,GAAA,IAAO,OAAO,GAAA,KAAQ,QAAA,EAAU;AACzC,QAAC,IAA8B,OAAA,GAAU,KAAA;AAAA,MAC3C;AAAA,IACF;AAAA,EACF,CAAA;AACF;AA0BO,SAAS,cACd,WAAA,EACA,QAAA,EACA,KAAA,EACA,OAAA,GAA0B,EAAC,EACb;AACd,EAAA,IAAI,CAAC,cAAA,CAAe,QAAQ,CAAA,EAAG;AAC7B,IAAA,MAAM,IAAI,KAAA,CAAM,CAAA,EAAG,WAAW,CAAA,2DAAA,CAA6D,CAAA;AAAA,EAC7F;AAEA,EAAA,MAAM,KAAA,GAAQ,QAAA;AACd,EAAA,MAAM,aAAa,KAAA,CAAM,KAAA;AAEzB,EAAA,MAAM,EAAE,GAAA,EAAK,GAAG,IAAA,EAAK,GAAI,KAAA;AACzB,EAAA,MAAM,MAAA,GAAuB,EAAE,GAAG,IAAA,EAAK;AAEvC,EAAA,IAAI,OAAO,KAAA,CAAM,SAAA,KAAc,YAAY,OAAO,UAAA,CAAW,cAAc,QAAA,EAAU;AACnF,IAAA,MAAA,CAAO,SAAA,GAAY,CAAC,UAAA,CAAW,SAAA,EAAW,KAAA,CAAM,SAAS,CAAA,CAAE,MAAA,CAAO,OAAO,CAAA,CAAE,IAAA,CAAK,GAAG,CAAA;AAAA,EACrF;AAEA,EAAA,KAAA,MAAW,CAAC,GAAA,EAAK,OAAO,KAAK,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAA,EAAG;AACjD,IAAA,IAAI,CAAC,GAAA,CAAI,UAAA,CAAW,IAAI,CAAA,IAAK,OAAO,YAAY,UAAA,EAAY;AAC5D,IAAA,IAAI,OAAA,CAAQ,OAAA,EAAS,QAAA,CAAS,GAAG,CAAA,EAAG;AACpC,IAAA,MAAM,MAAA,GAAS,WAAW,GAAG,CAAA;AAC7B,IAAA,IAAI,OAAO,WAAW,UAAA,EAAY;AAElC,IAAA,MAAA,CAAO,GAAG,CAAA,GAAI,CAAC,KAAA,EAAA,GAAmB,IAAA,KAAoB;AACpD,MAAC,MAAA,CAAwC,KAAA,EAAO,GAAG,IAAI,CAAA;AACvD,MAAA,MAAM,YAAa,KAAA,EAAiD,gBAAA;AACpE,MAAA,IAAI,CAAC,SAAA,EAAW;AACd,QAAC,OAAA,CAAyC,KAAA,EAAO,GAAG,IAAI,CAAA;AAAA,MAC1D;AAAA,IACF,CAAA;AAAA,EACF;AAEA,EAAA,IAAI,GAAA,EAAK;AACP,IAAA,MAAA,CAAO,GAAA,GAAM,SAAA,CAAU,GAAA,EAAK,UAAA,CAAW,GAAG,CAAA;AAAA,EAC5C,CAAA,MAAA,IAAW,WAAW,GAAA,EAAK;AACzB,IAAA,MAAA,CAAO,MAAM,UAAA,CAAW,GAAA;AAAA,EAC1B;AAEA,EAAA,OAAO,YAAA,CAAa,OAAO,MAAM,CAAA;AACnC","file":"chunk-ZVDN3GRI.js","sourcesContent":["import { cloneElement, isValidElement, type ReactElement, type ReactNode, type Ref } from 'react';\n\ntype UnknownProps = Record<string, unknown>;\n\n/**\n * Compose two refs into one, so a subcomponent can attach its own ref to a\n * child that already carries the consumer's.\n */\nexport function mergeRefs<T>(...refs: Array<Ref<T> | undefined>): Ref<T> {\n  return (value: T | null) => {\n    for (const ref of refs) {\n      if (typeof ref === 'function') {\n        ref(value);\n      } else if (ref && typeof ref === 'object') {\n        (ref as { current: T | null }).current = value;\n      }\n    }\n  };\n}\n\n/**\n * Shared implementation of the `asChild` pattern.\n *\n * Renders `children` in place of the component's own element, merging our props\n * into it rather than replacing them:\n *\n * - `className` is concatenated, the child's first.\n * - Every `on*` handler is composed: the child's runs first, and ours is skipped\n *   if the child called `preventDefault()`. Passing an `onClick` to the child\n *   therefore augments the behaviour instead of silently replacing it. Handlers\n *   listed in `options.replace` are the exception: ours replaces the child's.\n * - Refs are merged, so a component that needs its own ref does not clobber one\n *   the consumer supplied.\n *\n * @param displayName Used in the error message, e.g. 'Modal.Body'.\n */\nexport interface AsChildOptions {\n  /**\n   * Handlers that replace the child's instead of composing with it. Used when\n   * the control is inert: a disabled control must not run the child's handler.\n   */\n  replace?: readonly string[];\n}\n\nexport function renderAsChild(\n  displayName: string,\n  children: ReactNode,\n  props: UnknownProps,\n  options: AsChildOptions = {},\n): ReactElement {\n  if (!isValidElement(children)) {\n    throw new Error(`${displayName}: asChild requires a single valid React element as children`);\n  }\n\n  const child = children as ReactElement<UnknownProps & { ref?: Ref<unknown> }>;\n  const childProps = child.props;\n  // `ref` travels inside props (React 19) and is merged, never read.\n  const { ref, ...ours } = props as UnknownProps & { ref?: Ref<unknown> };\n  const merged: UnknownProps = { ...ours };\n\n  if (typeof props.className === 'string' || typeof childProps.className === 'string') {\n    merged.className = [childProps.className, props.className].filter(Boolean).join(' ');\n  }\n\n  for (const [key, handler] of Object.entries(ours)) {\n    if (!key.startsWith('on') || typeof handler !== 'function') continue;\n    if (options.replace?.includes(key)) continue;\n    const theirs = childProps[key];\n    if (typeof theirs !== 'function') continue;\n\n    merged[key] = (event: unknown, ...rest: unknown[]) => {\n      (theirs as (...args: unknown[]) => void)(event, ...rest);\n      const prevented = (event as { defaultPrevented?: boolean } | null)?.defaultPrevented;\n      if (!prevented) {\n        (handler as (...args: unknown[]) => void)(event, ...rest);\n      }\n    };\n  }\n\n  if (ref) {\n    merged.ref = mergeRefs(ref, childProps.ref);\n  } else if (childProps.ref) {\n    merged.ref = childProps.ref;\n  }\n\n  return cloneElement(child, merged);\n}\n"]}
+{"version":3,"sources":["../src/internal/asChild.ts"],"names":[],"mappings":";;;AAQO,SAAS,aAAgB,IAAA,EAAyC;AACvE,EAAA,OAAO,CAAC,KAAA,KAAoB;AAC1B,IAAA,KAAA,MAAW,OAAO,IAAA,EAAM;AACtB,MAAA,IAAI,OAAO,QAAQ,UAAA,EAAY;AAC7B,QAAA,GAAA,CAAI,KAAK,CAAA;AAAA,MACX,CAAA,MAAA,IAAW,GAAA,IAAO,OAAO,GAAA,KAAQ,QAAA,EAAU;AACzC,QAAC,IAA8B,OAAA,GAAU,KAAA;AAAA,MAC3C;AAAA,IACF;AAAA,EACF,CAAA;AACF;AA0BO,SAAS,cACd,WAAA,EACA,QAAA,EACA,KAAA,EACA,OAAA,GAA0B,EAAC,EACb;AACd,EAAA,IAAI,CAAC,cAAA,CAAe,QAAQ,CAAA,EAAG;AAC7B,IAAA,MAAM,IAAI,KAAA,CAAM,CAAA,EAAG,WAAW,CAAA,2DAAA,CAA6D,CAAA;AAAA,EAC7F;AAEA,EAAA,MAAM,KAAA,GAAQ,QAAA;AACd,EAAA,MAAM,aAAa,KAAA,CAAM,KAAA;AAEzB,EAAA,MAAM,EAAE,GAAA,EAAK,GAAG,IAAA,EAAK,GAAI,KAAA;AACzB,EAAA,MAAM,MAAA,GAAuB,EAAE,GAAG,IAAA,EAAK;AAEvC,EAAA,IAAI,OAAO,KAAA,CAAM,SAAA,KAAc,YAAY,OAAO,UAAA,CAAW,cAAc,QAAA,EAAU;AACnF,IAAA,MAAA,CAAO,SAAA,GAAY,CAAC,UAAA,CAAW,SAAA,EAAW,KAAA,CAAM,SAAS,CAAA,CAAE,MAAA,CAAO,OAAO,CAAA,CAAE,IAAA,CAAK,GAAG,CAAA;AAAA,EACrF;AAEA,EAAA,KAAA,MAAW,CAAC,GAAA,EAAK,OAAO,KAAK,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAA,EAAG;AACjD,IAAA,IAAI,CAAC,GAAA,CAAI,UAAA,CAAW,IAAI,CAAA,IAAK,OAAO,YAAY,UAAA,EAAY;AAC5D,IAAA,IAAI,OAAA,CAAQ,OAAA,EAAS,QAAA,CAAS,GAAG,CAAA,EAAG;AACpC,IAAA,MAAM,MAAA,GAAS,WAAW,GAAG,CAAA;AAC7B,IAAA,IAAI,OAAO,WAAW,UAAA,EAAY;AAElC,IAAA,MAAA,CAAO,GAAG,CAAA,GAAI,CAAC,KAAA,EAAA,GAAmB,IAAA,KAAoB;AACpD,MAAC,MAAA,CAAwC,KAAA,EAAO,GAAG,IAAI,CAAA;AACvD,MAAA,MAAM,YAAa,KAAA,EAAiD,gBAAA;AACpE,MAAA,IAAI,CAAC,SAAA,EAAW;AACd,QAAC,OAAA,CAAyC,KAAA,EAAO,GAAG,IAAI,CAAA;AAAA,MAC1D;AAAA,IACF,CAAA;AAAA,EACF;AAEA,EAAA,IAAI,GAAA,EAAK;AACP,IAAA,MAAA,CAAO,GAAA,GAAM,SAAA,CAAU,GAAA,EAAK,UAAA,CAAW,GAAG,CAAA;AAAA,EAC5C,CAAA,MAAA,IAAW,WAAW,GAAA,EAAK;AACzB,IAAA,MAAA,CAAO,MAAM,UAAA,CAAW,GAAA;AAAA,EAC1B;AAEA,EAAA,OAAO,YAAA,CAAa,OAAO,MAAM,CAAA;AACnC","file":"chunk-QJG5ILK5.js","sourcesContent":["import { cloneElement, isValidElement, type ReactElement, type ReactNode, type Ref } from 'react';\n\ntype UnknownProps = Record<string, unknown>;\n\n/**\n * Compose two refs into one, so a subcomponent can attach its own ref to a\n * child that already carries the consumer's.\n */\nexport function mergeRefs<T>(...refs: Array<Ref<T> | undefined>): Ref<T> {\n  return (value: T | null) => {\n    for (const ref of refs) {\n      if (typeof ref === 'function') {\n        ref(value);\n      } else if (ref && typeof ref === 'object') {\n        (ref as { current: T | null }).current = value;\n      }\n    }\n  };\n}\n\n/**\n * Shared implementation of the `asChild` pattern.\n *\n * Renders `children` in place of the component's own element, merging our props\n * into it rather than replacing them:\n *\n * - `className` is concatenated, the child's first.\n * - Every `on*` handler is composed: the child's runs first, and ours is skipped\n *   if the child called `preventDefault()`. Passing an `onClick` to the child\n *   therefore augments the behaviour instead of silently replacing it. Handlers\n *   listed in `options.replace` are the exception: ours replaces the child's.\n * - Refs are merged, so a component that needs its own ref does not clobber one\n *   the consumer supplied.\n *\n * @param displayName Used in the error message, e.g. 'Modal.Body'.\n */\nexport interface AsChildOptions {\n  /**\n   * Handlers that replace the child's instead of composing with it. Used when\n   * the control is inert: a disabled control must not run the child's handler.\n   */\n  replace?: readonly string[];\n}\n\nexport function renderAsChild(\n  displayName: string,\n  children: ReactNode,\n  props: UnknownProps,\n  options: AsChildOptions = {},\n): ReactElement {\n  if (!isValidElement(children)) {\n    throw new Error(`${displayName}: asChild requires a single valid React element as children`);\n  }\n\n  const child = children as ReactElement<UnknownProps & { ref?: Ref<unknown> }>;\n  const childProps = child.props;\n  // `ref` travels inside props (React 19) and is merged, never read.\n  const { ref, ...ours } = props as UnknownProps & { ref?: Ref<unknown> };\n  const merged: UnknownProps = { ...ours };\n\n  if (typeof props.className === 'string' || typeof childProps.className === 'string') {\n    merged.className = [childProps.className, props.className].filter(Boolean).join(' ');\n  }\n\n  for (const [key, handler] of Object.entries(ours)) {\n    if (!key.startsWith('on') || typeof handler !== 'function') continue;\n    if (options.replace?.includes(key)) continue;\n    const theirs = childProps[key];\n    if (typeof theirs !== 'function') continue;\n\n    merged[key] = (event: unknown, ...rest: unknown[]) => {\n      (theirs as (...args: unknown[]) => void)(event, ...rest);\n      const prevented = (event as { defaultPrevented?: boolean } | null)?.defaultPrevented;\n      if (!prevented) {\n        (handler as (...args: unknown[]) => void)(event, ...rest);\n      }\n    };\n  }\n\n  if (ref) {\n    merged.ref = mergeRefs(ref, childProps.ref);\n  } else if (childProps.ref) {\n    merged.ref = childProps.ref;\n  }\n\n  return cloneElement(child, merged);\n}\n"]}

package/dist/chunk-QXHSA4QD.js

@@ -0,0 +1,43 @@
+import { renderAsChild } from './chunk-QJG5ILK5.js';
+import { classes } from './chunk-MI4QUKQS.js';
+import { useState } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/avatar/Avatar.module.css
+var Avatar_default = {
+  root: "Avatar_root",
+  image: "Avatar_image"
+};
+function initialsOf(name) {
+  const words = (name ?? "").trim().split(/\s+/).filter(Boolean);
+  const first = Array.from(words[0] ?? "")[0] ?? "";
+  const last = words.length > 1 ? Array.from(words[words.length - 1] ?? "")[0] ?? "" : "";
+  return (first + last).toUpperCase();
+}
+function Avatar({ name, src, alt, size = "md", className, ref, children, ...rest }) {
+  const source = children ? children : src;
+  const [failed, setFailed] = useState(null);
+  const showImage = source != null && failed !== source;
+  const label = alt ?? name ?? "";
+  const decorative = label === "";
+  const image = { className: Avatar_default.image, alt: label, onError: () => setFailed(source) };
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      ...rest,
+      ref,
+      className: classes(Avatar_default.root, className),
+      "data-size": size,
+      "data-fallback": showImage ? void 0 : "",
+      role: showImage || decorative ? void 0 : "img",
+      "aria-label": showImage || decorative ? void 0 : label,
+      "aria-hidden": decorative ? true : void 0,
+      children: showImage ? children ? renderAsChild("Avatar", children, image) : /* @__PURE__ */ jsx("img", { ...image, src }) : /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: initialsOf(name) })
+    }
+  );
+}
+Avatar.displayName = "Avatar";
+
+export { Avatar };
+//# sourceMappingURL=chunk-QXHSA4QD.js.map
+//# sourceMappingURL=chunk-QXHSA4QD.js.map

package/dist/chunk-QXHSA4QD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/avatar/Avatar.module.css","../src/avatar/Avatar.tsx"],"names":["root","image"],"mappings":";;;;;;AAAA,IAAA,cAAA,GAAA;AAAA,EAKG,IAAA,EAAAA,aAAAA;AAAA,EA0CA,KAAA,EAAAC;AAAA,CAAA;ACpBH,SAAS,WAAW,IAAA,EAA0B;AAC5C,EAAA,MAAM,KAAA,GAAA,CAAS,QAAQ,EAAA,EAAI,IAAA,GAAO,KAAA,CAAM,KAAK,CAAA,CAAE,MAAA,CAAO,OAAO,CAAA;AAC7D,EAAA,MAAM,KAAA,GAAQ,MAAM,IAAA,CAAK,KAAA,CAAM,CAAC,CAAA,IAAK,EAAE,CAAA,CAAE,CAAC,CAAA,IAAK,EAAA;AAC/C,EAAA,MAAM,IAAA,GAAO,KAAA,CAAM,MAAA,GAAS,CAAA,GAAK,MAAM,IAAA,CAAK,KAAA,CAAM,KAAA,CAAM,MAAA,GAAS,CAAC,CAAA,IAAK,EAAE,CAAA,CAAE,CAAC,KAAK,EAAA,GAAM,EAAA;AACvF,EAAA,OAAA,CAAQ,KAAA,GAAQ,MAAM,WAAA,EAAY;AACpC;AAgBO,SAAS,MAAA,CAAO,EAAE,IAAA,EAAM,GAAA,EAAK,GAAA,EAAK,IAAA,GAAO,IAAA,EAAM,SAAA,EAAW,GAAA,EAAK,QAAA,EAAU,GAAG,IAAA,EAAK,EAAgB;AACtG,EAAA,MAAM,MAAA,GAAS,WAAW,QAAA,GAAW,GAAA;AAErC,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAkB,IAAI,CAAA;AAClD,EAAA,MAAM,SAAA,GAAY,MAAA,IAAU,IAAA,IAAQ,MAAA,KAAW,MAAA;AAE/C,EAAA,MAAM,KAAA,GAAQ,OAAO,IAAA,IAAQ,EAAA;AAC7B,EAAA,MAAM,aAAa,KAAA,KAAU,EAAA;AAC7B,EAAA,MAAM,KAAA,GAAQ,EAAE,SAAA,EAAW,cAAA,CAAO,KAAA,EAAO,GAAA,EAAK,KAAA,EAAO,OAAA,EAAS,MAAM,SAAA,CAAU,MAAM,CAAA,EAAE;AAEtF,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,SAAA,EAAW,OAAA,CAAQ,cAAA,CAAO,IAAA,EAAM,SAAS,CAAA;AAAA,MACzC,WAAA,EAAW,IAAA;AAAA,MACX,eAAA,EAAe,YAAY,MAAA,GAAY,EAAA;AAAA,MACvC,IAAA,EAAM,SAAA,IAAa,UAAA,GAAa,MAAA,GAAY,KAAA;AAAA,MAC5C,YAAA,EAAY,SAAA,IAAa,UAAA,GAAa,MAAA,GAAY,KAAA;AAAA,MAClD,aAAA,EAAa,aAAa,IAAA,GAAO,MAAA;AAAA,MAEhC,sBACC,QAAA,GACE,aAAA,CAAc,UAAU,QAAA,EAAU,KAAK,oBAEvC,GAAA,CAAC,KAAA,EAAA,EAAK,GAAG,KAAA,EAAO,GAAA,EAAU,oBAG5B,GAAA,CAAC,MAAA,EAAA,EAAK,eAAY,MAAA,EAAQ,QAAA,EAAA,UAAA,CAAW,IAAI,CAAA,EAAE;AAAA;AAAA,GAE/C;AAEJ;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-QXHSA4QD.js","sourcesContent":["/* Every value is a token: --avatar-* in packages/tokens/tokens/component/avatar.json */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    inline-size: var(--avatar-size-md);\n    block-size: var(--avatar-size-md);\n    overflow: hidden;\n    box-sizing: border-box;\n    border-radius: var(--avatar-radius);\n    background: var(--avatar-bg);\n    color: var(--avatar-fg);\n    font-family: var(--font-family-body);\n    font-size: var(--avatar-font-size-md);\n    font-weight: var(--avatar-weight);\n    line-height: 1;\n    vertical-align: middle;\n\n    /* Initials only: a picture has its own edge. */\n    &[data-fallback] {\n      border: var(--avatar-border-width) solid var(--avatar-border);\n    }\n\n    &[data-size='sm'] {\n      inline-size: var(--avatar-size-sm);\n      block-size: var(--avatar-size-sm);\n      font-size: var(--avatar-font-size-sm);\n    }\n\n    &[data-size='lg'] {\n      inline-size: var(--avatar-size-lg);\n      block-size: var(--avatar-size-lg);\n      font-size: var(--avatar-font-size-lg);\n    }\n\n    &[data-size='xl'] {\n      inline-size: var(--avatar-size-xl);\n      block-size: var(--avatar-size-xl);\n      font-size: var(--avatar-font-size-xl);\n    }\n  }\n\n  .image {\n    inline-size: 100%;\n    block-size: 100%;\n    object-fit: cover;\n  }\n}\n","import { useState, type HTMLAttributes, type ReactElement, type Ref } from 'react';\nimport { renderAsChild } from '../internal/asChild';\nimport { classes } from '../internal/classes';\nimport styles from './Avatar.module.css';\n\nexport type AvatarSize = 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface AvatarProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {\n  /** The person's name. Its initials show when there is no image or the image fails, and it names the avatar unless `alt` does. */\n  name?: string;\n  /** Image URL. Ignored when an image element is passed as the child. */\n  src?: string;\n  /** Accessible name. Defaults to `name`. Pass `\"\"` next to the visible name, so it is not read twice. */\n  alt?: string;\n  /** `sm` and `md` match the control heights, so an avatar lines up with a button. @default 'md' */\n  size?: AvatarSize;\n  /**\n   * An image element to use instead of `img`: a framework's image component\n   * (`<Avatar name=\"Ana\"><Image src={url} alt=\"\" width={40} height={40} /></Avatar>`).\n   * It receives the styles and the error handling; its own `alt` is replaced by the avatar's.\n   */\n  children?: ReactElement;\n\n  ref?: Ref<HTMLSpanElement>;\n}\n\n/** \"Ana María Ruiz\" → \"AR\"; one word → its first letter. By code point, so an accent or an emoji is one character. */\nfunction initialsOf(name: string | undefined) {\n  const words = (name ?? '').trim().split(/\\s+/).filter(Boolean);\n  const first = Array.from(words[0] ?? '')[0] ?? '';\n  const last = words.length > 1 ? (Array.from(words[words.length - 1] ?? '')[0] ?? '') : '';\n  return (first + last).toUpperCase();\n}\n\n/**\n * A person, as a picture or as initials. The initials take over when no image\n * is given and when the image fails to load, so a broken URL never shows a\n * broken-image glyph. Every value comes from `--avatar-*` tokens; the\n * background is one token for everyone, not a colour computed from the name.\n *\n * @status experimental\n * @category Utilities\n * @accessibility With an image, the `img` carries the name as its `alt`. With initials, the root is `role=\"img\"` named by `alt` or `name`, and the letters are hidden from assistive technology (\"AR\" read aloud means nothing). `alt=\"\"` makes the avatar decorative (`aria-hidden`): use it when the name is written next to it. Not focusable and not interactive; wrap it in a Link or a Button to make it one.\n * @do Pass `name` always, even with an image: it is the fallback when the image fails.\n * @do Pass `alt=\"\"` when the person's name is visible beside the avatar.\n * @dont Colour avatars per person from a hash of the name; the colours will not be tokens and will not pass contrast in both schemes.\n * @dont Use it for a logo or an illustration; it crops to a circle and falls back to initials.\n */\nexport function Avatar({ name, src, alt, size = 'md', className, ref, children, ...rest }: AvatarProps) {\n  const source = children ? children : src;\n  // Keyed on what failed, so a new `src` (or a new image element) gets a fresh attempt without an effect.\n  const [failed, setFailed] = useState<unknown>(null);\n  const showImage = source != null && failed !== source;\n\n  const label = alt ?? name ?? '';\n  const decorative = label === '';\n  const image = { className: styles.image, alt: label, onError: () => setFailed(source) };\n\n  return (\n    <span\n      {...rest}\n      ref={ref}\n      className={classes(styles.root, className)}\n      data-size={size}\n      data-fallback={showImage ? undefined : ''}\n      role={showImage || decorative ? undefined : 'img'}\n      aria-label={showImage || decorative ? undefined : label}\n      aria-hidden={decorative ? true : undefined}\n    >\n      {showImage ? (\n        children ? (\n          renderAsChild('Avatar', children, image)\n        ) : (\n          <img {...image} src={src} />\n        )\n      ) : (\n        <span aria-hidden=\"true\">{initialsOf(name)}</span>\n      )}\n    </span>\n  );\n}\n\nAvatar.displayName = 'Avatar';\n"]}

package/dist/chunk-S632WN4W.js

@@ -0,0 +1,106 @@
+import { Field } from './chunk-SXMORGSG.js';
+import { mergeRefs } from './chunk-QJG5ILK5.js';
+import { classes } from './chunk-MI4QUKQS.js';
+import { useRef, useState } from 'react';
+import { Close, Search } from '@pearpages/pulp-icons';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/text-field/TextField.module.css
+var TextField_default = {
+  field: "TextField_field",
+  input: "TextField_input",
+  hiddenLabel: "TextField_hiddenLabel",
+  control: "TextField_control",
+  inControl: "TextField_inControl",
+  icon: "TextField_icon",
+  clear: "TextField_clear"
+};
+function TextField({
+  label,
+  description,
+  error,
+  hideLabel = false,
+  iconStart,
+  onClear,
+  clearLabel = "Clear",
+  size = "md",
+  type,
+  value,
+  defaultValue,
+  onChange,
+  onKeyDown,
+  required,
+  disabled,
+  readOnly,
+  id,
+  className,
+  ref,
+  "aria-describedby": describedBy,
+  ...rest
+}) {
+  const invalid = error !== void 0 && error !== null && error !== false && error !== "";
+  const inner = useRef(null);
+  const [ownHasValue, setOwnHasValue] = useState(defaultValue !== void 0 && String(defaultValue) !== "");
+  const hasValue = value !== void 0 ? String(value) !== "" : ownHasValue;
+  const icon = iconStart === void 0 && type === "search" ? /* @__PURE__ */ jsx(Search, {}) : iconStart;
+  const clearable = onClear !== void 0 && hasValue && !disabled && !readOnly;
+  const decorated = icon != null || onClear !== void 0;
+  const clear = () => {
+    if (value === void 0 && inner.current) {
+      inner.current.value = "";
+      setOwnHasValue(false);
+    }
+    onClear?.();
+    inner.current?.focus();
+  };
+  const input = /* @__PURE__ */ jsx(Field.Control, { "aria-describedby": describedBy, children: /* @__PURE__ */ jsx(
+    "input",
+    {
+      ...rest,
+      ref: mergeRefs(inner, ref),
+      type,
+      value,
+      defaultValue,
+      className: classes(TextField_default.input, decorated && TextField_default.inControl),
+      readOnly,
+      onChange: (event) => {
+        onChange?.(event);
+        if (value === void 0) setOwnHasValue(event.currentTarget.value !== "");
+      },
+      onKeyDown: (event) => {
+        onKeyDown?.(event);
+        if (event.defaultPrevented || event.key !== "Escape" || !clearable) return;
+        event.preventDefault();
+        event.stopPropagation();
+        clear();
+      }
+    }
+  ) });
+  return /* @__PURE__ */ jsxs(
+    Field,
+    {
+      id,
+      invalid,
+      disabled: Boolean(disabled),
+      required: Boolean(required),
+      className: classes(TextField_default.field, className),
+      "data-size": size,
+      "data-readonly": readOnly ? "" : void 0,
+      children: [
+        /* @__PURE__ */ jsx(Field.Label, { className: hideLabel ? TextField_default.hiddenLabel : void 0, children: label }),
+        decorated ? /* @__PURE__ */ jsxs("span", { className: TextField_default.control, "data-icon": icon != null ? "" : void 0, "data-clearable": onClear ? "" : void 0, children: [
+          input,
+          icon != null && /* @__PURE__ */ jsx("span", { className: TextField_default.icon, "aria-hidden": "true", children: icon }),
+          clearable && /* @__PURE__ */ jsx("button", { type: "button", className: TextField_default.clear, "aria-label": clearLabel, onClick: clear, children: /* @__PURE__ */ jsx(Close, { "aria-hidden": "true" }) })
+        ] }) : input,
+        description && /* @__PURE__ */ jsx(Field.Description, { children: description }),
+        invalid && /* @__PURE__ */ jsx(Field.Error, { children: error })
+      ]
+    }
+  );
+}
+TextField.displayName = "TextField";
+
+export { TextField };
+//# sourceMappingURL=chunk-S632WN4W.js.map
+//# sourceMappingURL=chunk-S632WN4W.js.map