@pearpages/pulp-react 0.2.0 → 0.2.2

package/dist/toast.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/icon/Icon.module.css","../src/visually-hidden/VisuallyHidden.module.css","../src/spinner/Spinner.module.css","../src/button/Button.module.css","../src/icon-button/IconButton.module.css","../src/alert/Alert.module.css","../src/toast/Toast.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 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. State is expressed through data attributes so the\n * styling hooks survive a change of styling tool, and so tests and agents can\n * read state off the DOM.\n */\n\n@layer components {\n  .button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--button-gap);\n    min-block-size: var(--button-height-md);\n    padding-block: 0;\n    padding-inline: var(--button-padding-inline-md);\n    border: 1px solid transparent;\n    border-radius: var(--button-radius);\n    font-family: var(--button-font-family);\n    font-size: var(--button-font-size-md);\n    font-weight: var(--button-font-weight);\n    line-height: 1;\n    text-decoration: none;\n    white-space: nowrap;\n    cursor: pointer;\n    user-select: none;\n    transition:\n      background-color var(--button-motion-duration) var(--motion-easing-standard),\n      border-color var(--button-motion-duration) var(--motion-easing-standard),\n      color var(--button-motion-duration) var(--motion-easing-standard);\n\n    &:focus-visible {\n      outline: var(--button-focus-ring-width) solid var(--button-focus-ring);\n      outline-offset: var(--button-focus-ring-offset);\n    }\n\n    &:disabled,\n    &[aria-disabled=\"true\"] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-loading] {\n      cursor: progress;\n    }\n\n    &[data-size=\"sm\"] {\n      min-block-size: var(--button-height-sm);\n      padding-inline: var(--button-padding-inline-sm);\n      font-size: var(--button-font-size-sm);\n    }\n\n    &[data-size=\"lg\"] {\n      min-block-size: var(--button-height-lg);\n      padding-inline: var(--button-padding-inline-lg);\n      font-size: var(--button-font-size-lg);\n    }\n\n    &[data-variant=\"primary\"] {\n      background-color: var(--button-primary-bg);\n      color: var(--button-primary-fg);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-primary-bg-hover);\n      }\n\n      &:active:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-primary-bg-active);\n      }\n    }\n\n    &[data-variant=\"secondary\"] {\n      background-color: var(--button-secondary-bg);\n      border-color: var(--button-secondary-border);\n      color: var(--button-secondary-fg);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-secondary-bg-hover);\n      }\n    }\n\n    &[data-variant=\"ghost\"] {\n      background-color: transparent;\n      color: var(--button-ghost-fg);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-ghost-bg-hover);\n      }\n    }\n  }\n\n  .label {\n    display: inline-block;\n  }\n}\n","/* Squares a Button. Selectors carry the data attribute so they outrank Button's own size rules. */\n\n@layer components {\n  .iconButton[data-icon-only] {\n    gap: 0;\n    inline-size: var(--icon-button-size-md);\n    padding-inline: 0;\n\n    &[data-size=\"sm\"] { inline-size: var(--icon-button-size-sm); }\n    &[data-size=\"lg\"] { inline-size: var(--icon-button-size-lg); }\n  }\n}\n","/* Every value is a token (--alert-*). Tone resolves into private custom properties. */\n\n@layer components {\n  .alert {\n    --_bg: var(--alert-info-bg);\n    --_accent: var(--alert-info-accent);\n    --_title: var(--alert-info-title);\n\n    display: flex;\n    align-items: flex-start;\n    gap: var(--alert-gap);\n    padding: var(--alert-padding);\n    border: var(--alert-border-width) solid var(--_accent);\n    border-inline-start-width: var(--alert-accent-width);\n    border-radius: var(--alert-radius);\n    background-color: var(--_bg);\n    color: var(--alert-fg);\n    font-size: var(--alert-font-size);\n\n    &[data-tone=\"info\"] {\n      --_bg: var(--alert-info-bg);\n      --_accent: var(--alert-info-accent);\n      --_title: var(--alert-info-title);\n    }\n\n    &[data-tone=\"success\"] {\n      --_bg: var(--alert-success-bg);\n      --_accent: var(--alert-success-accent);\n      --_title: var(--alert-success-title);\n    }\n\n    &[data-tone=\"warning\"] {\n      --_bg: var(--alert-warning-bg);\n      --_accent: var(--alert-warning-accent);\n      --_title: var(--alert-warning-title);\n    }\n\n    &[data-tone=\"error\"] {\n      --_bg: var(--alert-error-bg);\n      --_accent: var(--alert-error-accent);\n      --_title: var(--alert-error-title);\n    }\n  }\n\n  .icon {\n    flex: none;\n    color: var(--_accent);\n  }\n\n  .body {\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    gap: var(--space-1);\n    min-inline-size: 0;\n  }\n\n  .title {\n    margin: 0;\n    color: var(--_title);\n    font-weight: var(--alert-title-font-weight);\n  }\n\n  .content {\n    overflow-wrap: anywhere;\n  }\n\n  .action {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--space-2);\n    margin-block-start: var(--space-1);\n  }\n\n  .dismiss {\n    flex: none;\n    margin-block: calc(-1 * var(--space-1));\n    margin-inline-end: calc(-1 * var(--space-2));\n  }\n}\n","/* Every value is a token (--toast-*). The region is fixed; placement is a data attribute. */\n\n@layer components {\n  .region {\n    --_top: auto;\n    --_end: var(--toast-offset);\n    --_bottom: var(--toast-offset);\n    --_start: auto;\n\n    position: fixed;\n    z-index: var(--toast-layer);\n    inset: var(--_top) var(--_end) var(--_bottom) var(--_start);\n    inline-size: min(var(--toast-width), 100vw);\n    padding: 0;\n    pointer-events: none;\n\n    &[data-placement=\"top-end\"] {\n      --_top: var(--toast-offset);\n      --_bottom: auto;\n    }\n\n    &[data-placement=\"top-center\"] {\n      --_top: var(--toast-offset);\n      --_bottom: auto;\n      --_start: 0;\n      --_end: 0;\n\n      margin-inline: auto;\n    }\n  }\n\n  .list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--toast-gap);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .item {\n    pointer-events: auto;\n    animation: enter var(--toast-motion-duration) var(--motion-easing-standard);\n  }\n\n  .toast {\n    border-radius: var(--toast-radius);\n    box-shadow: var(--toast-shadow);\n  }\n\n  @keyframes enter {\n    from {\n      opacity: 0;\n      translate: 0 var(--space-2);\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .item {\n      animation: none;\n    }\n  }\n}\n"],"mappings":"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","names":["icon","root","spinner","ring","spin","button","label","iconButton","alert","icon","body","title","content","action","dismiss","region","list","item","toast","enter"]}
+{"version":3,"sources":["../src/icon/Icon.module.css","../src/visually-hidden/VisuallyHidden.module.css","../src/spinner/Spinner.module.css","../src/button/Button.module.css","../src/icon-button/IconButton.module.css","../src/alert/Alert.module.css","../src/toast/Toast.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 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. State is expressed through data attributes so the\n * styling hooks survive a change of styling tool, and so tests and agents can\n * read state off the DOM.\n */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--button-gap);\n    min-block-size: var(--button-height-md);\n    padding-block: 0;\n    padding-inline: var(--button-padding-inline-md);\n    border: 1px solid transparent;\n    border-radius: var(--button-radius);\n    font-family: var(--button-font-family);\n    font-size: var(--button-font-size-md);\n    font-weight: var(--button-font-weight);\n    line-height: 1;\n    text-decoration: none;\n    white-space: nowrap;\n    cursor: pointer;\n    -webkit-user-select: none;\n    user-select: none;\n    transition:\n      background-color var(--button-motion-duration) var(--motion-easing-standard),\n      border-color var(--button-motion-duration) var(--motion-easing-standard),\n      color var(--button-motion-duration) var(--motion-easing-standard);\n\n    &:focus-visible {\n      outline: var(--button-focus-ring-width) solid var(--button-focus-ring);\n      outline-offset: var(--button-focus-ring-offset);\n    }\n\n    &:disabled,\n    &[aria-disabled=\"true\"] {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-loading] {\n      cursor: progress;\n    }\n\n    &[data-size=\"sm\"] {\n      min-block-size: var(--button-height-sm);\n      padding-inline: var(--button-padding-inline-sm);\n      font-size: var(--button-font-size-sm);\n    }\n\n    &[data-size=\"lg\"] {\n      min-block-size: var(--button-height-lg);\n      padding-inline: var(--button-padding-inline-lg);\n      font-size: var(--button-font-size-lg);\n    }\n\n    &[data-variant=\"primary\"] {\n      background-color: var(--button-primary-bg);\n      color: var(--button-primary-fg);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-primary-bg-hover);\n      }\n\n      &:active:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-primary-bg-active);\n      }\n    }\n\n    &[data-variant=\"secondary\"] {\n      background-color: var(--button-secondary-bg);\n      border-color: var(--button-secondary-border);\n      color: var(--button-secondary-fg);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-secondary-bg-hover);\n      }\n    }\n\n    &[data-variant=\"ghost\"] {\n      background-color: transparent;\n      color: var(--button-ghost-fg);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-ghost-bg-hover);\n      }\n    }\n  }\n\n  .label {\n    display: inline-block;\n  }\n}\n","/* Squares a Button. Selectors carry the data attribute so they outrank Button's own size rules. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .iconButton[data-icon-only] {\n    gap: 0;\n    inline-size: var(--icon-button-size-md);\n    padding-inline: 0;\n\n    &[data-size=\"sm\"] { inline-size: var(--icon-button-size-sm); }\n    &[data-size=\"lg\"] { inline-size: var(--icon-button-size-lg); }\n  }\n}\n","/* Every value is a token (--alert-*). Tone resolves into private custom properties. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .alert {\n    --_bg: var(--alert-info-bg);\n    --_accent: var(--alert-info-accent);\n    --_title: var(--alert-info-title);\n\n    display: flex;\n    align-items: flex-start;\n    gap: var(--alert-gap);\n    padding: var(--alert-padding);\n    border: var(--alert-border-width) solid var(--_accent);\n    border-inline-start-width: var(--alert-accent-width);\n    border-radius: var(--alert-radius);\n    background-color: var(--_bg);\n    color: var(--alert-fg);\n    font-size: var(--alert-font-size);\n\n    &[data-tone=\"info\"] {\n      --_bg: var(--alert-info-bg);\n      --_accent: var(--alert-info-accent);\n      --_title: var(--alert-info-title);\n    }\n\n    &[data-tone=\"success\"] {\n      --_bg: var(--alert-success-bg);\n      --_accent: var(--alert-success-accent);\n      --_title: var(--alert-success-title);\n    }\n\n    &[data-tone=\"warning\"] {\n      --_bg: var(--alert-warning-bg);\n      --_accent: var(--alert-warning-accent);\n      --_title: var(--alert-warning-title);\n    }\n\n    &[data-tone=\"error\"] {\n      --_bg: var(--alert-error-bg);\n      --_accent: var(--alert-error-accent);\n      --_title: var(--alert-error-title);\n    }\n  }\n\n  .icon {\n    flex: none;\n    color: var(--_accent);\n  }\n\n  .body {\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    gap: var(--space-1);\n    min-inline-size: 0;\n  }\n\n  .title {\n    margin: 0;\n    color: var(--_title);\n    font-weight: var(--alert-title-font-weight);\n  }\n\n  .content {\n    overflow-wrap: anywhere;\n  }\n\n  .action {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--space-2);\n    margin-block-start: var(--space-1);\n  }\n\n  .dismiss {\n    flex: none;\n    margin-block: calc(-1 * var(--space-1));\n    margin-inline-end: calc(-1 * var(--space-2));\n  }\n}\n","/* Every value is a token (--toast-*). The region is fixed; placement is a data attribute. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .region {\n    --_top: auto;\n    --_end: var(--toast-offset);\n    --_bottom: var(--toast-offset);\n    --_start: auto;\n\n    position: fixed;\n    z-index: var(--toast-layer);\n    inset: var(--_top) var(--_end) var(--_bottom) var(--_start);\n    inline-size: min(var(--toast-width), 100vw);\n    padding: 0;\n    pointer-events: none;\n\n    &[data-placement=\"top-end\"] {\n      --_top: var(--toast-offset);\n      --_bottom: auto;\n    }\n\n    &[data-placement=\"top-center\"] {\n      --_top: var(--toast-offset);\n      --_bottom: auto;\n      --_start: 0;\n      --_end: 0;\n\n      margin-inline: auto;\n    }\n  }\n\n  .list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--toast-gap);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .item {\n    pointer-events: auto;\n    animation: enter var(--toast-motion-duration) var(--motion-easing-standard);\n  }\n\n  .toast {\n    border-radius: var(--toast-radius);\n    box-shadow: var(--toast-shadow);\n  }\n\n  @keyframes enter {\n    from {\n      opacity: 0;\n      translate: 0 var(--space-2);\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .item {\n      animation: none;\n    }\n  }\n}\n"],"mappings":";AAEA;AAEA;AACE,GAACA;AACC,aAAS;AACT,UAAM;AACN,iBAAa;AACb,gBAAY;AACZ,eAAW,IAAI;AACf,oBAAgB;AAEhB,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAiB;AACpD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAiB;AACpD,KAAC,CAAC;AAAuB,iBAAW;AAAS;AAE7C,MAAE,EAAE;AACF,mBAAa;AACb,kBAAY;AACd;AACF;AACF;;;ACpBA;AAEA;AACE,GAACC;AACC,cAAU;AACV,iBAAa,IAAI;AACjB,gBAAY,IAAI;AAChB,aAAS;AACT,YAAQ;AACR,cAAU;AACV,eAAW,MAAM;AACjB,iBAAa;AACb,YAAQ;AACV;AACF;;;ACdA;AAEA;AACE,GAACC;AACC,aAAS,IAAI;AACb,cAAU,IAAI;AACd,kBAAc,IAAI;AAElB,aAAS;AACT,UAAM;AACN,iBAAa,IAAI;AACjB,gBAAY,IAAI;AAChB,oBAAgB;AAEhB,KAAC,CAAC;AAAkB,eAAS,IAAI;AAAoB;AACrD,KAAC,CAAC;AAAkB,eAAS,IAAI;AAAoB;AACrD,KAAC,CAAC;AAAuB,eAAS;AAAK;AAEvC,KAAC,CAAC;AACA,gBAAU;AACV,oBAAc;AAChB;AACF;AAEA,GAACC;AACC,iBAAa;AACb,gBAAY;AACZ,YAAQ,IAAI,iBAAiB,MAAM,IAAI;AACvC,8BAA0B,IAAI;AAC9B,mBAAe,IAAI;AACnB,eAAW,aAAK,IAAI,oBAAoB,OAAO;AACjD;AAEA,aAHaC;AAIX;AACE,cAAQ;AACV;AACF;AAEA,UAAO,wBAAyB;AAC9B,KAhBDD;AAiBG,iBAAW;AACb;AACF;AACF;;;ACxCA;AAEA;AACE,GAACE;AACC,aAAS;AACT,iBAAa;AACb,qBAAiB;AACjB,SAAK,IAAI;AACT,oBAAgB,IAAI;AACpB,mBAAe;AACf,oBAAgB,IAAI;AACpB,YAAQ,IAAI,MAAM;AAClB,mBAAe,IAAI;AACnB,iBAAa,IAAI;AACjB,eAAW,IAAI;AACf,iBAAa,IAAI;AACjB,iBAAa;AACb,qBAAiB;AACjB,iBAAa;AACb,YAAQ;AACR,yBAAqB;AACrB,iBAAa;AACb;AAAA,MACE,iBAAiB,IAAI,0BAA0B,IAAI,yBAAyB;AAAA,MAC5E,aAAa,IAAI,0BAA0B,IAAI,yBAAyB;AAAA,MACxE,MAAM,IAAI,0BAA0B,IAAI;AAE1C,KAAC;AACC,eAAS,IAAI,2BAA2B,MAAM,IAAI;AAClD,sBAAgB,IAAI;AACtB;AAEA,KAAC;AAAA,IACD,CAAC,CAAC;AACA,cAAQ;AACR,eAAS;AACX;AAEA,KAAC,CAAC;AACA,cAAQ;AACV;AAEA,KAAC,CAAC;AACA,sBAAgB,IAAI;AACpB,sBAAgB,IAAI;AACpB,iBAAW,IAAI;AACjB;AAEA,KAAC,CAAC;AACA,sBAAgB,IAAI;AACpB,sBAAgB,IAAI;AACpB,iBAAW,IAAI;AACjB;AAEA,KAAC,CAAC;AACA,wBAAkB,IAAI;AACtB,aAAO,IAAI;AAEX,OAAC,MAAM,KAAK,WAAW,CAAC;AACtB,0BAAkB,IAAI;AACxB;AAEA,OAAC,OAAO,KAAK,WAAW,CAAC;AACvB,0BAAkB,IAAI;AACxB;AACF;AAEA,KAAC,CAAC;AACA,wBAAkB,IAAI;AACtB,oBAAc,IAAI;AAClB,aAAO,IAAI;AAEX,OAAC,MAAM,KAAK,WAAW,CAAC;AACtB,0BAAkB,IAAI;AACxB;AACF;AAEA,KAAC,CAAC;AACA,wBAAkB;AAClB,aAAO,IAAI;AAEX,OAAC,MAAM,KAAK,WAAW,CAAC;AACtB,0BAAkB,IAAI;AACxB;AACF;AACF;AAEA,GAACC;AACC,aAAS;AACX;AACF;;;AC9FA;AAEA;AACE,GAACC,qBAAU,CAAC;AACV,SAAK;AACL,iBAAa,IAAI;AACjB,oBAAgB;AAEhB,KAAC,CAAC;AAAkB,mBAAa,IAAI;AAAwB;AAC7D,KAAC,CAAC;AAAkB,mBAAa,IAAI;AAAwB;AAC/D;AACF;;;ACXA;AAEA;AACE,GAACC;AACC,WAAO,IAAI;AACX,eAAW,IAAI;AACf,cAAU,IAAI;AAEd,aAAS;AACT,iBAAa;AACb,SAAK,IAAI;AACT,aAAS,IAAI;AACb,YAAQ,IAAI,sBAAsB,MAAM,IAAI;AAC5C,+BAA2B,IAAI;AAC/B,mBAAe,IAAI;AACnB,sBAAkB,IAAI;AACtB,WAAO,IAAI;AACX,eAAW,IAAI;AAEf,KAAC,CAAC;AACA,aAAO,IAAI;AACX,iBAAW,IAAI;AACf,gBAAU,IAAI;AAChB;AAEA,KAAC,CAAC;AACA,aAAO,IAAI;AACX,iBAAW,IAAI;AACf,gBAAU,IAAI;AAChB;AAEA,KAAC,CAAC;AACA,aAAO,IAAI;AACX,iBAAW,IAAI;AACf,gBAAU,IAAI;AAChB;AAEA,KAAC,CAAC;AACA,aAAO,IAAI;AACX,iBAAW,IAAI;AACf,gBAAU,IAAI;AAChB;AACF;AAEA,GAACC;AACC,UAAM;AACN,WAAO,IAAI;AACb;AAEA,GAACC;AACC,aAAS;AACT,UAAM;AACN,oBAAgB;AAChB,SAAK,IAAI;AACT,qBAAiB;AACnB;AAEA,GAACC;AACC,YAAQ;AACR,WAAO,IAAI;AACX,iBAAa,IAAI;AACnB;AAEA,GAACC;AACC,mBAAe;AACjB;AAEA,GAACC;AACC,aAAS;AACT,eAAW;AACX,SAAK,IAAI;AACT,wBAAoB,IAAI;AAC1B;AAEA,GAACC;AACC,UAAM;AACN,kBAAc,KAAK,GAAG,EAAE,IAAI;AAC5B,uBAAmB,KAAK,GAAG,EAAE,IAAI;AACnC;AACF;;;AC/EA;AAEA;AACE,GAACC;AACC,YAAQ;AACR,YAAQ,IAAI;AACZ,eAAW,IAAI;AACf,cAAU;AAEV,cAAU;AACV,aAAS,IAAI;AACb,WAAO,IAAI,QAAQ,IAAI,QAAQ,IAAI,WAAW,IAAI;AAClD,iBAAa,IAAI,IAAI,cAAc,EAAE;AACrC,aAAS;AACT,oBAAgB;AAEhB,KAAC,CAAC;AACA,cAAQ,IAAI;AACZ,iBAAW;AACb;AAEA,KAAC,CAAC;AACA,cAAQ,IAAI;AACZ,iBAAW;AACX,gBAAU;AACV,cAAQ;AAER,qBAAe;AACjB;AACF;AAEA,GAACC;AACC,aAAS;AACT,oBAAgB;AAChB,SAAK,IAAI;AACT,YAAQ;AACR,aAAS;AACT,gBAAY;AACd;AAEA,GAACC;AACC,oBAAgB;AAChB,eAAW,YAAM,IAAI,yBAAyB,IAAI;AACpD;AAEA,GAACC;AACC,mBAAe,IAAI;AACnB,gBAAY,IAAI;AAClB;AAEA,aARaC;AASX;AACE,eAAS;AACT,iBAAW,EAAE,IAAI;AACnB;AACF;AAEA,UAAO,wBAAyB;AAC9B,KAlBDF;AAmBG,iBAAW;AACb;AACF;AACF;","names":["icon","root","spinner","ring","spin","button","label","iconButton","alert","icon","body","title","content","action","dismiss","region","list","item","toast","enter"]}

package/dist/toast.js

@@ -1,11 +1,11 @@
-export { ToastProvider, useToast } from './chunk-DXOOW6Q6.js';
-import './chunk-PM4YO67Q.js';
-import './chunk-FXRSZUDH.js';
-import './chunk-KPQGS4PG.js';
-import './chunk-I4KC4V6A.js';
+export { ToastProvider, useToast } from './chunk-U3N3G2UA.js';
+import './chunk-N4C3NQIN.js';
+import './chunk-MF66ICX6.js';
+import './chunk-5TTYVQ6Q.js';
+import './chunk-ZL5MMRLG.js';
 import './chunk-ZVDN3GRI.js';
-import './chunk-Z4PN6B2C.js';
-import './chunk-ASNTNTJW.js';
+import './chunk-IB5UUE3S.js';
+import './chunk-O5LII5XP.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=toast.js.map
 //# sourceMappingURL=toast.js.map

package/dist/tooltip.css

@@ -2,6 +2,7 @@
 @property --_gap { syntax: "<length>"; inherits: false; initial-value: 0px; }
 
 /* src/tooltip/Tooltip.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .Tooltip_tooltip {
     --_gap: var(--tooltip-gap);

package/dist/tooltip.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/internal/floating.css","../src/tooltip/Tooltip.module.css"],"sourcesContent":["/*\n * Registers the gap the floating hook reads. An unregistered custom property\n * computes to its specified text (\"calc(0.25rem * 2)\"), which no number\n * parser can use; a registered <length> computes to pixels (\"8px\"). Browsers\n * without @property (Firefox before 128) fall back to a gap of 0.\n * Outside the components layer on purpose: registration is not cascaded.\n */\n\n@property --_gap {\n  syntax: \"<length>\";\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- a registered <length> needs a unit in its initial value */\n  initial-value: 0px;\n}\n","/* Every value is a token (--tooltip-*). Position comes in as --_x/--_y from the floating hook. */\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"],"mappings":";AAQA,UAAU,OAAO,EACf,MAAM,EAAE,UAAU,EAClB,QAAQ,EAAE,KAAK,EAEf,aAAa,EAAE,GAAG;;;ACVpB;AACE,GAACA;AACC,YAAQ,IAAI;AAEZ,cAAU;AACV,aAAS,IAAI;AACb,uBAAmB,IAAI;AACvB,wBAAoB,IAAI;AACxB,qBAAiB,IAAI;AACrB,mBAAe,IAAI;AACnB,oBAAgB,IAAI;AACpB,mBAAe,IAAI;AACnB,sBAAkB,IAAI;AACtB,WAAO,IAAI;AACX,iBAAa,IAAI;AACjB,eAAW,IAAI;AACf,iBAAa,IAAI;AACjB,gBAAY,IAAI;AAChB,oBAAgB;AAChB,eAAW,aAAK,IAAI,oBAAoB,IAAI;AAC9C;AAEA,aAHaC;AAIX;AACE,eAAS;AACX;AACF;AAEA,UAAO,wBAAyB;AAC9B,KA5BDD;AA6BG,iBAAW;AACb;AACF;AACF;","names":["tooltip","fade"]}
+{"version":3,"sources":["../src/internal/floating.css","../src/tooltip/Tooltip.module.css"],"sourcesContent":["/*\n * Registers the gap the floating hook reads. An unregistered custom property\n * computes to its specified text (\"calc(0.25rem * 2)\"), which no number\n * parser can use; a registered <length> computes to pixels (\"8px\"). Browsers\n * without @property (Firefox before 128) fall back to a gap of 0.\n * Outside the components layer on purpose: registration is not cascaded.\n */\n\n@property --_gap {\n  syntax: \"<length>\";\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- a registered <length> needs a unit in its initial value */\n  initial-value: 0px;\n}\n","/* 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"],"mappings":";AAQA,UAAU,OAAO,EACf,MAAM,EAAE,UAAU,EAClB,QAAQ,EAAE,KAAK,EAEf,aAAa,EAAE,GAAG;;;ACVpB;AAEA;AACE,GAACA;AACC,YAAQ,IAAI;AAEZ,cAAU;AACV,aAAS,IAAI;AACb,uBAAmB,IAAI;AACvB,wBAAoB,IAAI;AACxB,qBAAiB,IAAI;AACrB,mBAAe,IAAI;AACnB,oBAAgB,IAAI;AACpB,mBAAe,IAAI;AACnB,sBAAkB,IAAI;AACtB,WAAO,IAAI;AACX,iBAAa,IAAI;AACjB,eAAW,IAAI;AACf,iBAAa,IAAI;AACjB,gBAAY,IAAI;AAChB,oBAAgB;AAChB,eAAW,aAAK,IAAI,oBAAoB,IAAI;AAC9C;AAEA,aAHaC;AAIX;AACE,eAAS;AACX;AACF;AAEA,UAAO,wBAAyB;AAC9B,KA5BDD;AA6BG,iBAAW;AACb;AACF;AACF;","names":["tooltip","fade"]}

package/dist/tooltip.js

@@ -1,4 +1,4 @@
-export { Tooltip } from './chunk-Y4TZA77G.js';
+export { Tooltip } from './chunk-XWPXW46D.js';
 import './chunk-U6QRAD73.js';
 import './chunk-ZVDN3GRI.js';
 //# sourceMappingURL=tooltip.js.map

package/dist/visually-hidden.css

@@ -1,4 +1,5 @@
 /* src/visually-hidden/VisuallyHidden.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
 @layer components {
   .VisuallyHidden_root {
     position: absolute;

package/dist/visually-hidden.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/visually-hidden/VisuallyHidden.module.css"],"sourcesContent":["/* 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"],"mappings":";AAEA;AACE,GAACA;AACC,cAAU;AACV,iBAAa,IAAI;AACjB,gBAAY,IAAI;AAChB,aAAS;AACT,YAAQ;AACR,cAAU;AACV,eAAW,MAAM;AACjB,iBAAa;AACb,YAAQ;AACV;AACF;","names":["root"]}
+{"version":3,"sources":["../src/visually-hidden/VisuallyHidden.module.css"],"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"],"mappings":";AAEA;AAEA;AACE,GAACA;AACC,cAAU;AACV,iBAAa,IAAI;AACjB,gBAAY,IAAI;AAChB,aAAS;AACT,YAAQ;AACR,cAAU;AACV,eAAW,MAAM;AACjB,iBAAa;AACb,YAAQ;AACV;AACF;","names":["root"]}

package/dist/visually-hidden.js

@@ -1,4 +1,4 @@
-export { VisuallyHidden } from './chunk-Z4PN6B2C.js';
+export { VisuallyHidden } from './chunk-IB5UUE3S.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=visually-hidden.js.map
 //# sourceMappingURL=visually-hidden.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pearpages/pulp-react",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "pulp React components. Accessible, token-driven, CSS modules, one entry per component.",
   "license": "MIT",
   "author": "Pere Pages <hello@pearpages.com> (https://pearpages.com)",
@@ -215,7 +215,7 @@
   "peerDependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@pearpages/pulp-tokens": "^0.2.0"
+    "@pearpages/pulp-tokens": "^0.2.1"
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.5",
@@ -237,7 +237,7 @@
     "typescript": "^5.9.3",
     "vitest": "^4.1.11",
     "vitest-axe": "^0.1.0",
-    "@pearpages/pulp-tokens": "0.2.0"
+    "@pearpages/pulp-tokens": "0.2.1"
   },
   "peerDependenciesMeta": {
     "@pearpages/pulp-tokens": {

package/dist/chunk-2PXTVZ7H.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/field/Field.module.css","../src/field/Field.tsx"],"names":["field","label","required","description","error"],"mappings":"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","file":"chunk-2PXTVZ7H.js","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","import {\n  createContext,\n  useCallback,\n  useContext,\n  useId,\n  useLayoutEffect,\n  useState,\n  type HTMLAttributes,\n  type LabelHTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport { renderAsChild } from '../internal/asChild';\nimport { classes } from '../internal/classes';\nimport styles from './Field.module.css';\n\ntype Part = 'description' | 'error';\n\nexport interface FieldContextValue {\n  /** The control's id; the label points at it. */\n  id: string;\n  /** The label's id, for controls that are labelled by reference (`aria-labelledby`), such as a radio group. */\n  labelId: string;\n  invalid: boolean;\n  disabled: boolean;\n  required: boolean;\n  /** ids of the description and error that are actually mounted, space separated. */\n  describedBy: string | undefined;\n  /** Registers a mounted part; returns the unregister function. */\n  register: (part: Part) => () => void;\n}\n\nconst FieldContext = createContext<FieldContextValue | null>(null);\n\nconst DEV = typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production';\n\n/** The field's ids and state, for controls that wire themselves instead of using `Field.Control`. */\nexport function useField(): FieldContextValue {\n  const context = useContext(FieldContext);\n  if (!context) throw new Error('useField must be used inside <Field>');\n  return context;\n}\n\nexport interface FieldProps extends HTMLAttributes<HTMLDivElement> {\n  /** The control's id. Generated when omitted. */\n  id?: string;\n  /** @default false */\n  invalid?: boolean;\n  /** @default false */\n  disabled?: boolean;\n  /** @default false */\n  required?: boolean;\n  ref?: Ref<HTMLDivElement>;\n  children: ReactNode;\n}\n\n/**\n * The wiring every form control shares: a label pointing at the control, a\n * description and an error exposed through `aria-describedby`, and invalid,\n * disabled and required state in one place. Only parts that are mounted end\n * up in `aria-describedby`, so no id ever dangles. Compose with\n * `Field.Label`, `Field.Control`, `Field.Description` and `Field.Error`\n * (one of each); state on the DOM as `data-invalid`, `data-disabled`,\n * `data-required`.\n *\n * Known limitation: parts register in a layout effect, so server-rendered\n * HTML carries no `aria-describedby` until hydration. The relationship is\n * complete for every interactive use; static HTML consumers should not rely\n * on it yet.\n *\n * @status stable\n * @category Forms\n * @accessibility Wires `label[for]`, `aria-describedby` (only mounted parts), `aria-invalid`, `aria-required` and `disabled` onto the control. Server-rendered HTML has no `aria-describedby` until hydration (a test pins the gap).\n * @do Use `Field.Label as=\"span\"` with `useField().labelId` for groups that cannot be labelled by `for`.\n * @dont Mount two `Field.Description` or two `Field.Error`; ids would collide (development warns).\n */\nexport function Field({ id, invalid = false, disabled = false, required = false, className, ref, children, ...rest }: FieldProps) {\n  const autoId = useId();\n  const controlId = id ?? autoId;\n  // Counts, not booleans: a second instance of a part is a bug (duplicate ids)\n  // and is reported in development instead of silently colliding.\n  const [parts, setParts] = useState<Record<Part, number>>({ description: 0, error: 0 });\n\n  const register = useCallback((part: Part) => {\n    setParts((current) => {\n      const next = current[part] + 1;\n      if (DEV && next === 2) console.warn(`Field: more than one Field.${part === 'error' ? 'Error' : 'Description'} is mounted; their ids collide.`);\n      return { ...current, [part]: next };\n    });\n    return () => setParts((current) => ({ ...current, [part]: Math.max(0, current[part] - 1) }));\n  }, []);\n\n  const describedBy =\n    [parts.description > 0 && `${controlId}-description`, parts.error > 0 && `${controlId}-error`].filter(Boolean).join(' ') ||\n    undefined;\n\n  return (\n    <FieldContext.Provider value={{ id: controlId, labelId: `${controlId}-label`, invalid, disabled, required, describedBy, register }}>\n      <div\n        {...rest}\n        ref={ref}\n        className={classes(styles.field, className)}\n        data-invalid={invalid ? '' : undefined}\n        data-disabled={disabled ? '' : undefined}\n        data-required={required ? '' : undefined}\n      >\n        {children}\n      </div>\n    </FieldContext.Provider>\n  );\n}\n\ninterface FieldLabelProps extends LabelHTMLAttributes<HTMLLabelElement> {\n  /**\n   * `label` points at the control with `for`. `span` is for controls that are\n   * not labelable (a radio group, a fieldset): it carries `labelId` and the\n   * control references it with `aria-labelledby`.\n   * @default 'label'\n   */\n  as?: 'label' | 'span';\n  ref?: Ref<HTMLLabelElement>;\n  children: ReactNode;\n}\n\nfunction FieldLabel({ as = 'label', className, ref, children, ...rest }: FieldLabelProps) {\n  const field = useField();\n  const marker = field.required && (\n    <span className={styles.required} aria-hidden=\"true\">\n      *\n    </span>\n  );\n  if (as === 'span') {\n    return (\n      <span {...rest} id={field.labelId} className={classes(styles.label, className)}>\n        {children}\n        {marker}\n      </span>\n    );\n  }\n  return (\n    <label {...rest} ref={ref} htmlFor={field.id} className={classes(styles.label, className)}>\n      {children}\n      {marker}\n    </label>\n  );\n}\n\ninterface FieldControlProps {\n  /** Extra ids to describe the control by, kept alongside the field's own. */\n  'aria-describedby'?: string;\n  /** The single control element; the field's wiring is merged into it. */\n  children: ReactNode;\n}\n\nfunction FieldControl({ 'aria-describedby': extra, children }: FieldControlProps) {\n  const field = useField();\n  return renderAsChild('Field.Control', children, {\n    id: field.id,\n    'aria-describedby': [extra, field.describedBy].filter(Boolean).join(' ') || undefined,\n    'aria-invalid': field.invalid || undefined,\n    disabled: field.disabled || undefined,\n    required: field.required || undefined,\n  });\n}\n\ninterface FieldTextProps extends HTMLAttributes<HTMLParagraphElement> {\n  ref?: Ref<HTMLParagraphElement>;\n  children?: ReactNode;\n}\n\nfunction FieldDescription({ className, ref, children, ...rest }: FieldTextProps) {\n  const field = useField();\n  const { register } = field;\n  useLayoutEffect(() => register('description'), [register]);\n  return (\n    <p {...rest} ref={ref} id={`${field.id}-description`} className={classes(styles.description, className)}>\n      {children}\n    </p>\n  );\n}\n\nfunction FieldError({ className, ref, children, ...rest }: FieldTextProps) {\n  const field = useField();\n  const { register } = field;\n  useLayoutEffect(() => register('error'), [register]);\n  return (\n    <p {...rest} ref={ref} id={`${field.id}-error`} role=\"alert\" className={classes(styles.error, className)}>\n      {children}\n    </p>\n  );\n}\n\nField.displayName = 'Field';\nFieldLabel.displayName = 'Field.Label';\nFieldControl.displayName = 'Field.Control';\nFieldDescription.displayName = 'Field.Description';\nFieldError.displayName = 'Field.Error';\n\nField.Label = FieldLabel;\nField.Control = FieldControl;\nField.Description = FieldDescription;\nField.Error = FieldError;\n"]}

package/dist/chunk-2ZP4ZBI5.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/text/Text.module.css","../src/text/Text.tsx"],"names":["text"],"mappings":";;;;AAAA,IAAA,YAAA,GAAA;AAAA,EAGG,IAAA,EAAAA;AAAA,CAAA;;;ACsCI,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-2ZP4ZBI5.js","sourcesContent":["/* Every value is a token (--text-*). Variants are data attributes. */\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-3GWESUGD.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/heading/Heading.module.css","../src/heading/Heading.tsx"],"names":["heading"],"mappings":";;;;AAAA,IAAA,eAAA,GAAA;AAAA,EAGG,OAAA,EAAAA;AAAA,CAAA;;;ACgBH,IAAM,aAAA,GAAmD,EAAE,CAAA,EAAG,KAAA,EAAO,CAAA,EAAG,IAAA,EAAM,CAAA,EAAG,IAAA,EAAM,CAAA,EAAG,IAAA,EAAM,CAAA,EAAG,IAAA,EAAM,GAAG,IAAA,EAAK;AAa1G,SAAS,OAAA,CAAQ,EAAE,KAAA,EAAO,IAAA,EAAM,IAAA,GAAO,SAAA,EAAW,SAAA,EAAW,GAAA,EAAK,QAAA,EAAU,GAAG,IAAA,EAAK,EAAiB;AAC1G,EAAA,OAAO,aAAA;AAAA,IACL,IAAI,KAAK,CAAA,CAAA;AAAA,IACT;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAA;AAAA,MACA,SAAA,EAAW,OAAA,CAAQ,eAAA,CAAO,OAAA,EAAS,SAAS,CAAA;AAAA,MAC5C,WAAA,EAAa,IAAA,IAAQ,aAAA,CAAc,KAAK,CAAA;AAAA,MACxC,WAAA,EAAa;AAAA,KACf;AAAA,IACA;AAAA,GACF;AACF;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-3GWESUGD.js","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","import { createElement, type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './Heading.module.css';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\nexport type HeadingSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl';\nexport type HeadingTone = 'default' | 'muted';\n\nexport interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {\n  /** The document outline level; sets the element (`h1`–`h6`). */\n  level: HeadingLevel;\n  /** Visual size, decoupled from the level. Defaults by level: 1→2xl, 2→xl, 3→lg, 4→md, 5 and 6→sm. */\n  size?: HeadingSize;\n  /** @default 'default' */\n  tone?: HeadingTone;\n  ref?: Ref<HTMLHeadingElement>;\n  children: ReactNode;\n}\n\nconst SIZE_BY_LEVEL: Record<HeadingLevel, HeadingSize> = { 1: '2xl', 2: 'xl', 3: 'lg', 4: 'md', 5: 'sm', 6: 'sm' };\n\n/**\n * A heading whose outline level and visual size are separate decisions, so\n * the document structure stays honest while the design stays flexible.\n * Display family and tight leading from `--heading-*` tokens.\n *\n * @status stable\n * @category Typography\n * @accessibility Renders the `h1`–`h6` element of `level`; `size` changes only the look, so the outline stays truthful.\n * @do Pick `level` from the outline, then `size` from the design.\n * @dont Skip heading levels to get a smaller size; change `size` instead.\n */\nexport function Heading({ level, size, tone = 'default', className, ref, children, ...rest }: HeadingProps) {\n  return createElement(\n    `h${level}`,\n    {\n      ...rest,\n      ref,\n      className: classes(styles.heading, className),\n      'data-size': size ?? SIZE_BY_LEVEL[level],\n      'data-tone': tone,\n    },\n    children,\n  );\n}\n\nHeading.displayName = 'Heading';\n"]}

package/dist/chunk-6I26MMQF.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/badge/Badge.module.css","../src/badge/Badge.tsx"],"names":["badge"],"mappings":";;;;;AAAA,IAAA,aAAA,GAAA;AAAA,EAGG,KAAA,EAAAA;AAAA,CAAA;ACiCI,SAAS,KAAA,CAAM,EAAE,IAAA,GAAO,SAAA,EAAW,UAAU,QAAA,EAAU,IAAA,GAAO,IAAA,EAAM,IAAA,EAAM,SAAA,EAAW,GAAA,EAAK,QAAA,EAAU,GAAG,MAAK,EAAe;AAChI,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,IAAA,oBAAQ,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,SAAA,EAAW,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,IACnC;AAAA,GAAA,EACH,CAAA;AAEJ;AAEA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-6I26MMQF.js","sourcesContent":["/* Every value is a token (--badge-*). Tone × variant resolve into private custom properties. */\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","import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { Icon } from '../icon';\nimport { classes } from '../internal/classes';\nimport styles from './Badge.module.css';\n\nexport type BadgeTone = 'neutral' | 'info' | 'success' | 'warning' | 'error';\nexport type BadgeVariant = 'solid' | 'subtle';\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  /** `solid` fills with the tone; `subtle` tints and uses the tone as text. @default 'subtle' */\n  variant?: BadgeVariant;\n  /** @default 'md' */\n  size?: BadgeSize;\n  /** Leading glyph, decorative. */\n  icon?: ReactNode;\n  ref?: Ref<HTMLSpanElement>;\n  children: ReactNode;\n}\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. 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 * 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, className, ref, children, ...rest }: BadgeProps) {\n  return (\n    <span {...rest} ref={ref} className={classes(styles.badge, className)} data-tone={tone} data-variant={variant} data-size={size}>\n      {icon && <Icon size=\"inherit\">{icon}</Icon>}\n      {children}\n    </span>\n  );\n}\n\nBadge.displayName = 'Badge';\n"]}

package/dist/chunk-75GTNRBH.js.map

@@ -1 +0,0 @@
-{"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,EAGG,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;ACbR,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-75GTNRBH.js","sourcesContent":["/* Every value is a token (--progress-*). The fill width is the per-instance --_value custom property. */\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-7DS4I7OJ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/stack/Stack.module.css","../src/stack/Stack.tsx"],"names":["stack"],"mappings":";;;;AAAA,IAAA,aAAA,GAAA;AAAA,EAGG,KAAA,EAAAA;AAAA,CAAA;;;AC8BI,SAAS,KAAA,CAAM,EAAE,EAAA,GAAK,KAAA,EAAO,GAAA,GAAM,CAAA,EAAG,KAAA,EAAO,OAAA,EAAS,SAAA,EAAW,GAAA,EAAK,QAAA,EAAU,GAAG,MAAK,EAAe;AAC5G,EAAA,OAAO,aAAA;AAAA,IACL,EAAA;AAAA,IACA;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAA;AAAA;AAAA,MAEA,MAAM,IAAA,CAAK,IAAA,KAAS,OAAO,IAAA,IAAQ,EAAA,KAAO,OAAO,MAAA,GAAS,MAAA,CAAA;AAAA,MAC1D,SAAA,EAAW,OAAA,CAAQ,aAAA,CAAO,KAAA,EAAO,SAAS,CAAA;AAAA,MAC1C,UAAA,EAAY,GAAA;AAAA,MACZ,YAAA,EAAc,KAAA;AAAA,MACd,cAAA,EAAgB;AAAA,KAElB;AAAA,IACA;AAAA,GACF;AACF;AAEA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-7DS4I7OJ.js","sourcesContent":["/* Every value is a token (--stack-gap-*). Gap, alignment and justification are data attributes. */\n\n@layer components {\n  .stack {\n    display: flex;\n    flex-direction: column;\n    gap: var(--stack-gap-3);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n\n    &[data-gap=\"1\"] { gap: var(--stack-gap-1); }\n    &[data-gap=\"2\"] { gap: var(--stack-gap-2); }\n    &[data-gap=\"3\"] { gap: var(--stack-gap-3); }\n    &[data-gap=\"4\"] { gap: var(--stack-gap-4); }\n    &[data-gap=\"5\"] { gap: var(--stack-gap-5); }\n    &[data-gap=\"6\"] { gap: var(--stack-gap-6); }\n    &[data-gap=\"7\"] { gap: var(--stack-gap-7); }\n    &[data-gap=\"8\"] { gap: var(--stack-gap-8); }\n    &[data-align=\"start\"] { align-items: flex-start; }\n    &[data-align=\"center\"] { align-items: center; }\n    &[data-align=\"end\"] { align-items: flex-end; }\n    &[data-align=\"stretch\"] { align-items: stretch; }\n    &[data-justify=\"start\"] { justify-content: flex-start; }\n    &[data-justify=\"center\"] { justify-content: center; }\n    &[data-justify=\"end\"] { justify-content: flex-end; }\n    &[data-justify=\"between\"] { justify-content: space-between; }\n  }\n}\n","import { createElement, type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './Stack.module.css';\n\nexport type StackGap = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\nexport type StackAlign = 'start' | 'center' | 'end' | 'stretch';\nexport type StackJustify = 'start' | 'center' | 'end' | 'between';\nexport type StackElement = 'div' | 'section' | 'nav' | 'ul' | 'ol' | 'li';\n\nexport interface StackProps extends HTMLAttributes<HTMLElement> {\n  /** @default 'div' */\n  as?: StackElement;\n  /** Step on the spacing scale (`--space-1` … `--space-8`). @default 3 */\n  gap?: StackGap;\n  align?: StackAlign;\n  justify?: StackJustify;\n\n  ref?: Ref<HTMLElement>;\n  children: ReactNode;\n}\n\n/**\n * A flex column whose gap is a step on the spacing scale, so consumers\n * compose layout from tokens instead of writing padding and margins.\n * Rendered as `ul`/`ol` it keeps `role=\"list\"` explicitly, because Safari\n * stops announcing a list once `list-style` is removed.\n *\n * @status stable\n * @category Layout\n * @accessibility Layout only: no role unless rendered as `ul`/`ol`, where `role=\"list\"` is kept explicitly because Safari drops list semantics without markers.\n * @do Use `as=\"ul\"` for a list of like items so the count is announced.\n * @dont Use it to space unrelated regions; it is one flex column.\n */\nexport function Stack({ as = 'div', gap = 3, align, justify, className, ref, children, ...rest }: StackProps) {\n  return createElement(\n    as,\n    {\n      ...rest,\n      ref,\n      // Safari drops list semantics when list-style is none; say it explicitly.\n      role: rest.role ?? (as === 'ul' || as === 'ol' ? 'list' : undefined),\n      className: classes(styles.stack, className),\n      'data-gap': gap,\n      'data-align': align,\n      'data-justify': justify,\n\n    },\n    children,\n  );\n}\n\nStack.displayName = 'Stack';\n"]}

package/dist/chunk-7RQQASKS.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/table/Table.module.css","../src/table/Table.tsx"],"names":["container","table","header","column","row","cell","body","selectColumn","selectCell","selectBox","select","empty","AriaTable","AriaTableHeader","AriaColumn","AriaTableBody","AriaRow","AriaCell","AriaCheckbox"],"mappings":"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","file":"chunk-7RQQASKS.js","sourcesContent":["/*\n * Every value is a token (--table-*). Density resolves the row padding into a\n * private custom property on the table. React Aria writes the state:\n * data-hovered, data-selected, data-disabled, data-focus-visible on rows and\n * cells; data-allows-sorting and data-sort-direction on columns;\n * data-selected and data-indeterminate on the selection checkbox.\n * Rules are ordered from general to specific so no later selector has a lower\n * specificity than an earlier one for the same element.\n */\n\n@layer components {\n  .container {\n    overflow: auto;\n    border: var(--size-hairline) solid var(--table-border);\n    border-radius: var(--table-radius);\n    background-color: var(--table-bg);\n    color: var(--table-fg);\n    font-family: var(--table-font-family);\n    font-size: var(--table-font-size);\n  }\n\n  .table {\n    --_padding-block: var(--table-cell-padding-block-default);\n\n    inline-size: 100%;\n    border-collapse: collapse;\n    border-spacing: 0;\n    outline: none;\n\n    &[data-density=\"compact\"] {\n      --_padding-block: var(--table-cell-padding-block-compact);\n    }\n\n    &[data-focus-visible] {\n      outline: var(--table-focus-ring-width) solid var(--table-focus-ring);\n      outline-offset: calc(-1 * var(--table-focus-ring-width));\n    }\n  }\n\n  .header {\n    background-color: var(--table-header-bg);\n  }\n\n  .container[data-sticky-header] .header {\n    position: sticky;\n    inset-block-start: 0;\n  }\n\n  .column {\n    padding-block: var(--_padding-block);\n    padding-inline: var(--table-cell-padding-inline);\n    border-block-end: var(--size-hairline) solid var(--table-border);\n    color: var(--table-header-fg);\n    font-size: var(--table-header-font-size);\n    font-weight: var(--table-header-font-weight);\n    text-align: start;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    outline: none;\n\n    &[data-align=\"end\"] {\n      text-align: end;\n    }\n\n    &[data-allows-sorting] {\n      cursor: pointer;\n    }\n\n    &[data-allows-sorting]::after {\n      content: \"\";\n      display: inline-block;\n      inline-size: var(--table-header-sort-indicator-size);\n      block-size: var(--table-header-sort-indicator-size);\n      margin-inline-start: var(--table-header-sort-indicator-size);\n      border-inline-end: var(--table-header-sort-indicator-width) solid currentcolor;\n      border-block-end: var(--table-header-sort-indicator-width) solid currentcolor;\n      rotate: -135deg;\n      translate: 0 25%;\n      opacity: 0;\n      transition: opacity var(--table-motion-duration) var(--motion-easing-standard);\n    }\n\n    &[data-hovered]::after {\n      opacity: 0.5;\n    }\n\n    &[data-sort-direction] {\n      color: var(--table-header-fg-active);\n    }\n\n    &[data-sort-direction]::after {\n      color: var(--table-header-sort-indicator);\n      opacity: 1;\n    }\n\n    &[data-sort-direction=\"descending\"]::after {\n      rotate: 45deg;\n      translate: 0 -25%;\n    }\n\n    &[data-focus-visible] {\n      outline: var(--table-focus-ring-width) solid var(--table-focus-ring);\n      outline-offset: calc(-1 * var(--table-focus-ring-width));\n    }\n  }\n\n  .row {\n    outline: none;\n    transition: background-color var(--table-motion-duration) var(--motion-easing-standard);\n\n    &[data-hovered] {\n      background-color: var(--table-row-bg-hover);\n    }\n\n    &[data-selected] {\n      background-color: var(--table-row-bg-selected);\n    }\n\n    &[data-disabled] {\n      color: var(--table-row-fg-disabled);\n    }\n\n    &[data-focus-visible] {\n      outline: var(--table-focus-ring-width) solid var(--table-focus-ring);\n      outline-offset: calc(-1 * var(--table-focus-ring-width));\n    }\n  }\n\n  .cell {\n    padding-block: var(--_padding-block);\n    padding-inline: var(--table-cell-padding-inline);\n    outline: none;\n\n    &[data-align=\"end\"] {\n      text-align: end;\n      font-variant-numeric: tabular-nums;\n    }\n\n    &[data-focus-visible] {\n      outline: var(--table-focus-ring-width) solid var(--table-focus-ring);\n      outline-offset: calc(-1 * var(--table-focus-ring-width));\n    }\n  }\n\n  .body .row:not(:last-child) .cell {\n    border-block-end: var(--size-hairline) solid var(--table-border);\n  }\n\n  .selectColumn,\n  .selectCell {\n    inline-size: var(--table-select-size);\n    padding-inline-end: 0;\n  }\n\n  .selectBox {\n    display: grid;\n    place-content: center;\n    inline-size: var(--table-select-size);\n    block-size: var(--table-select-size);\n    border: var(--size-hairline) solid var(--table-select-border);\n    border-radius: var(--table-select-radius);\n    background-color: var(--table-select-bg);\n    transition:\n      background-color var(--table-motion-duration) var(--motion-easing-standard),\n      border-color var(--table-motion-duration) var(--motion-easing-standard);\n\n    &::after {\n      content: \"\";\n      inline-size: calc(var(--table-select-size) * 0.3);\n      block-size: calc(var(--table-select-size) * 0.55);\n      border-style: solid;\n      border-color: var(--table-select-check);\n      border-width: 0 var(--table-select-check-width) var(--table-select-check-width) 0;\n      rotate: 45deg;\n      translate: 0 -10%;\n      opacity: 0;\n    }\n  }\n\n  .select {\n    display: inline-grid;\n    place-items: center;\n    inline-size: var(--table-select-size);\n    block-size: var(--table-select-size);\n    cursor: pointer;\n\n    &[data-focus-visible] .selectBox {\n      outline: var(--table-focus-ring-width) solid var(--table-focus-ring);\n      outline-offset: var(--table-focus-ring-offset);\n    }\n\n    &[data-selected] .selectBox,\n    &[data-indeterminate] .selectBox {\n      border-color: var(--table-select-bg-checked);\n      background-color: var(--table-select-bg-checked);\n\n      &::after {\n        opacity: 1;\n      }\n    }\n\n    &[data-indeterminate] .selectBox::after {\n      inline-size: calc(var(--table-select-size) * 0.55);\n      block-size: 0;\n      border-width: 0 0 var(--table-select-check-width);\n      rotate: 0deg;\n      translate: 0 0;\n    }\n  }\n\n  .empty {\n    padding: var(--table-empty-padding);\n    color: var(--table-empty-fg);\n    text-align: center;\n  }\n}\n","import { createContext, useCallback, useContext, useEffect, useRef, useState, type ReactElement, type ReactNode, type Ref } from 'react';\nimport {\n  Cell as AriaCell,\n  Checkbox as AriaCheckbox,\n  Column as AriaColumn,\n  Row as AriaRow,\n  Table as AriaTable,\n  TableBody as AriaTableBody,\n  TableHeader as AriaTableHeader,\n  useTableOptions,\n  type Key,\n  type SortDescriptor,\n} from 'react-aria-components';\nimport { classes } from '../internal/classes';\nimport { VisuallyHidden } from '../visually-hidden';\nimport { selectionToIds } from '../internal/selection';\nimport styles from './Table.module.css';\n\nexport type TableSelectionMode = 'none' | 'single' | 'multiple';\nexport type TableDensity = 'default' | 'compact';\nexport type TableSortDirection = 'ascending' | 'descending';\nexport interface TableSort {\n  column: string;\n  direction: TableSortDirection;\n}\n\n/** Rows register their ids so `'all'` (Ctrl/Cmd+A) resolves to an array without a second source of truth. */\nconst RowIdsContext = createContext<{ add: (id: Key) => () => void; all: () => Key[] } | null>(null);\n\nexport interface TableProps {\n  /** The table's accessible name. Pass `aria-labelledby` instead when a visible heading names it. */\n  'aria-label'?: string;\n  'aria-labelledby'?: string;\n  /** @default 'none' */\n  selectionMode?: TableSelectionMode;\n  /** Selected row ids (controlled). */\n  selected?: readonly string[];\n  /** @default [] */\n  defaultSelected?: readonly string[];\n  onSelectedChange?: (ids: string[]) => void;\n  /** Rows that cannot be selected or activated. */\n  disabledIds?: readonly string[];\n  /** Current sort (controlled). Sorting the data is the caller's job: this is the header state. */\n  sort?: TableSort | null;\n  defaultSort?: TableSort;\n  onSortChange?: (sort: TableSort) => void;\n  /** Row padding steps down one token. The brand's `space.unit` sets the base. @default 'default' */\n  density?: TableDensity;\n  /** The header stays visible while the container scrolls. Give the container a height through `className`. @default false */\n  stickyHeader?: boolean;\n  /**\n   * Called with the row id on Enter, on click, and on double click. Once\n   * rows are selectable and a selection exists, Enter and click toggle the\n   * selection instead (the vendor's rule, so touch users select without a\n   * modifier key); double click still runs the action.\n   */\n  onRowAction?: (id: string) => void;\n  /** Applied to the scroll container around the table. */\n  className?: string;\n  /** The `<table>` element. */\n  ref?: Ref<HTMLTableElement>;\n  /** `Table.Header` then `Table.Body`. */\n  children: ReactNode;\n}\n\n/**\n * A data table on React Aria's grid (decision record 001): one Tab stop,\n * arrows move between rows and cells, Space toggles selection, Enter runs\n * the row action (see `onRowAction` for the selection rule), sortable\n * headers carry `aria-sort` and are pressed to change direction. Selection and sort are the caller's state; the table\n * reports changes and renders them. Compose with `Table.Header`,\n * `Table.Column`, `Table.Body`, `Table.Row` and `Table.Cell`; the selection\n * column appears by itself when rows are selectable.\n *\n * @status experimental\n * @category Data\n * @accessibility `role=\"grid\"` named by `aria-label` or `aria-labelledby`; one column is the row header (`isRowHeader`), sortable columns carry `aria-sort`, selectable rows `aria-selected`, and the selection column holds real checkboxes (\"Select All\" in the header). One tab stop: arrows move between rows and cells, Space toggles selection, Enter runs the row action, the header cells are pressed to sort.\n * @do Mark exactly one column `isRowHeader`.\n * Give the table a name that says what the rows are.\n * @dont Sort the data inside the table; sort your data from `onSortChange` and pass it back.\n * Use it for layout.\n */\nexport function Table({\n  selectionMode = 'none',\n  selected,\n  defaultSelected = [],\n  onSelectedChange,\n  disabledIds,\n  sort,\n  defaultSort,\n  onSortChange,\n  density = 'default',\n  stickyHeader = false,\n  onRowAction,\n  className,\n  ref,\n  children,\n  ...rest\n}: TableProps) {\n  const ids = useRef(new Set<Key>());\n  const add = useCallback((id: Key) => {\n    ids.current.add(id);\n    return () => {\n      ids.current.delete(id);\n    };\n  }, []);\n  const all = useCallback(() => Array.from(ids.current), []);\n  // The vendor has no default for the sort descriptor; hold it here when uncontrolled.\n  const [uncontrolledSort, setUncontrolledSort] = useState<TableSort | undefined>(defaultSort);\n  const currentSort = sort === undefined ? uncontrolledSort : (sort ?? undefined);\n\n  return (\n    <RowIdsContext.Provider value={{ add, all }}>\n      <div className={classes(styles.container, className)} data-sticky-header={stickyHeader ? '' : undefined}>\n        <AriaTable\n          {...rest}\n          ref={ref as Ref<HTMLDivElement | HTMLTableElement>}\n          className={styles.table}\n          data-density={density}\n          selectionMode={selectionMode}\n          selectedKeys={selected}\n          defaultSelectedKeys={defaultSelected}\n          onSelectionChange={(selection) => onSelectedChange?.(selectionToIds(selection, all))}\n          disabledKeys={disabledIds}\n          sortDescriptor={currentSort as SortDescriptor | undefined}\n          onSortChange={(descriptor) => {\n            const next = { column: String(descriptor.column), direction: descriptor.direction };\n            if (sort === undefined) setUncontrolledSort(next);\n            onSortChange?.(next);\n          }}\n          onRowAction={onRowAction && ((key) => onRowAction(String(key)))}\n        >\n          {children}\n        </AriaTable>\n      </div>\n    </RowIdsContext.Provider>\n  );\n}\n\ninterface TableHeaderProps {\n  className?: string;\n  /** `Table.Column` elements. */\n  children: ReactNode;\n}\n\nfunction TableHeader({ className, children }: TableHeaderProps) {\n  const { selectionMode, selectionBehavior } = useTableOptions();\n  return (\n    <AriaTableHeader className={classes(styles.header, className)}>\n      {selectionMode !== 'none' && selectionBehavior === 'toggle' && (\n        <AriaColumn className={classes(styles.column, styles.selectColumn)}>\n          {selectionMode === 'multiple' ? <SelectionCheckbox /> : <VisuallyHidden>Selection</VisuallyHidden>}\n        </AriaColumn>\n      )}\n      {children}\n    </AriaTableHeader>\n  );\n}\n\nexport type TableAlign = 'start' | 'end';\n\ninterface TableColumnProps {\n  /** The column id `sort.column` refers to. Defaults to the column's text. */\n  id?: string;\n  /** Pressing the header sorts by it; the table reports the change through `onSortChange`. @default false */\n  allowsSorting?: boolean;\n  /** This column names the row for assistive technology. Exactly one column per table. @default false */\n  isRowHeader?: boolean;\n  /** @default 'start' */\n  align?: TableAlign;\n  className?: string;\n  children: ReactNode;\n}\n\nfunction TableColumn({ id, allowsSorting = false, isRowHeader = false, align = 'start', className, children }: TableColumnProps) {\n  return (\n    <AriaColumn id={id} allowsSorting={allowsSorting} isRowHeader={isRowHeader} className={classes(styles.column, className)} data-align={align}>\n      {children}\n    </AriaColumn>\n  );\n}\n\ninterface TableBodyProps<T extends { id: string }> {\n  /** Rows from data: each item renders through the `children` function, keyed by `item.id`. */\n  items?: Iterable<T>;\n  /** Shown when there are no rows. @default 'No rows' */\n  emptyMessage?: ReactNode;\n  className?: string;\n  /** `Table.Row` elements, or a function from an item to one when `items` is given. */\n  children: ReactNode | ((item: T) => ReactElement);\n}\n\nfunction TableBody<T extends { id: string }>({ items, emptyMessage = 'No rows', className, children }: TableBodyProps<T>) {\n  return (\n    <AriaTableBody items={items} className={classes(styles.body, className)} renderEmptyState={() => <div className={styles.empty}>{emptyMessage}</div>}>\n      {children}\n    </AriaTableBody>\n  );\n}\n\ninterface TableRowProps {\n  /** The row id used for selection, sorting callbacks and `onRowAction`. Required unless the row comes from `items`. */\n  id?: string;\n  className?: string;\n  /** `Table.Cell` elements. */\n  children: ReactNode;\n}\n\nfunction TableRow({ id, className, children }: TableRowProps) {\n  const { selectionBehavior } = useTableOptions();\n  const registry = useContext(RowIdsContext);\n  useEffect(() => (id !== undefined && registry ? registry.add(id) : undefined), [id, registry]);\n  return (\n    <AriaRow id={id} className={classes(styles.row, className)}>\n      {selectionBehavior === 'toggle' && (\n        <AriaCell className={classes(styles.cell, styles.selectCell)}>\n          <SelectionCheckbox />\n        </AriaCell>\n      )}\n      {children}\n    </AriaRow>\n  );\n}\n\ninterface TableCellProps {\n  /** @default 'start' */\n  align?: TableAlign;\n  className?: string;\n  children: ReactNode;\n}\n\nfunction TableCell({ align = 'start', className, children }: TableCellProps) {\n  return (\n    <AriaCell className={classes(styles.cell, className)} data-align={align}>\n      {children}\n    </AriaCell>\n  );\n}\n\n/** React Aria's checkbox wired to the row (or all rows) through `slot=\"selection\"`; drawn from the table's tokens. */\nfunction SelectionCheckbox() {\n  return (\n    <AriaCheckbox slot=\"selection\" className={styles.select}>\n      <span className={styles.selectBox} aria-hidden=\"true\" />\n    </AriaCheckbox>\n  );\n}\n\nTable.displayName = 'Table';\nTableHeader.displayName = 'Table.Header';\nTableColumn.displayName = 'Table.Column';\nTableBody.displayName = 'Table.Body';\nTableRow.displayName = 'Table.Row';\nTableCell.displayName = 'Table.Cell';\n\nTable.Header = TableHeader;\nTable.Column = TableColumn;\nTable.Body = TableBody;\nTable.Row = TableRow;\nTable.Cell = TableCell;\n"]}

package/dist/chunk-ASNTNTJW.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/icon/Icon.module.css","../src/icon/Icon.tsx"],"names":["icon"],"mappings":";;;;AAAA,IAAA,YAAA,GAAA;AAAA,EAGG,IAAA,EAAAA;AAAA,CAAA;AC2BI,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-ASNTNTJW.js","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","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-ASOQ2MVR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/skeleton/Skeleton.module.css","../src/skeleton/Skeleton.tsx"],"names":["skeleton","lines"],"mappings":";;;;AAAA,IAAA,gBAAA,GAAA;AAAA,EAGG,QAAA,EAAAA,mBAAAA;AAAA,EAiCA,KAAA,EAAAC;AAAA,CAAA;ACLI,SAAS,QAAA,CAAS,EAAE,KAAA,GAAQ,MAAA,EAAQ,KAAA,GAAQ,CAAA,EAAG,IAAA,GAAO,IAAA,EAAM,SAAA,EAAW,GAAA,EAAK,GAAG,IAAA,EAAK,EAAkB;AAC3G,EAAA,IAAI,KAAA,KAAU,MAAA,IAAU,KAAA,GAAQ,CAAA,EAAG;AACjC,IAAA,2BACG,MAAA,EAAA,EAAM,GAAG,IAAA,EAAM,GAAA,EAAU,eAAY,MAAA,EAAO,SAAA,EAAW,OAAA,CAAQ,gBAAA,CAAO,OAAO,SAAS,CAAA,EAAG,cAAW,MAAA,EAClG,QAAA,EAAA,KAAA,CAAM,KAAK,EAAE,MAAA,EAAQ,KAAA,EAAM,EAAG,CAAC,CAAA,EAAG,KAAA,yBAChC,MAAA,EAAA,EAAiB,SAAA,EAAW,iBAAO,QAAA,EAAU,YAAA,EAAW,MAAA,EAAO,WAAA,EAAW,UAAU,KAAA,GAAQ,CAAA,GAAI,KAAK,MAAA,EAAA,EAA3F,KAAsG,CAClH,CAAA,EACH,CAAA;AAAA,EAEJ;AACA,EAAA,2BAAQ,MAAA,EAAA,EAAM,GAAG,IAAA,EAAM,GAAA,EAAU,eAAY,MAAA,EAAO,SAAA,EAAW,OAAA,CAAQ,gBAAA,CAAO,UAAU,SAAS,CAAA,EAAG,YAAA,EAAY,KAAA,EAAO,aAAW,IAAA,EAAM,CAAA;AAC1I;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-ASOQ2MVR.js","sourcesContent":["/* Every value is a token (--skeleton-*). Shimmer is a moving background-image; off under reduced motion. */\n\n@layer components {\n  .skeleton {\n    --_size: var(--skeleton-circle-md);\n\n    display: block;\n    inline-size: 100%;\n    border-radius: var(--skeleton-radius);\n    background-color: var(--skeleton-base);\n    background-image: linear-gradient(90deg, var(--skeleton-base), var(--skeleton-highlight), var(--skeleton-base));\n    background-size: 200% 100%;\n    animation: shimmer calc(6 * var(--skeleton-duration)) linear infinite;\n\n    &[data-shape=\"text\"] {\n      block-size: var(--skeleton-text-height);\n    }\n\n    &[data-shape=\"rect\"] {\n      block-size: var(--skeleton-circle-lg);\n    }\n\n    &[data-shape=\"circle\"] {\n      inline-size: var(--_size);\n      block-size: var(--_size);\n      border-radius: var(--radius-full);\n    }\n\n    &[data-size=\"sm\"] { --_size: var(--skeleton-circle-sm); }\n    &[data-size=\"lg\"] { --_size: var(--skeleton-circle-lg); }\n\n    &[data-last] {\n      inline-size: 60%;\n    }\n  }\n\n  .lines {\n    display: flex;\n    flex-direction: column;\n    gap: var(--skeleton-gap);\n    inline-size: 100%;\n  }\n\n  @keyframes shimmer {\n    from {\n      background-position: 200% 0;\n    }\n\n    to {\n      background-position: -200% 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .skeleton {\n      animation: none;\n      background-image: none;\n    }\n  }\n}\n","import type { HTMLAttributes, Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './Skeleton.module.css';\n\nexport type SkeletonShape = 'text' | 'rect' | 'circle';\nexport type SkeletonSize = 'sm' | 'md' | 'lg';\n\nexport interface SkeletonProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {\n  /** @default 'text' */\n  shape?: SkeletonShape;\n  /** Number of text lines; the last is shorter. @default 1 */\n  lines?: number;\n  /** Circle diameter, from the control scale. @default 'md' */\n  size?: SkeletonSize;\n  ref?: Ref<HTMLSpanElement>;\n}\n\n/**\n * A placeholder for content that is loading. Decorative: hidden from\n * assistive technology, so mark the *container* `aria-busy` and announce\n * the loaded state there. Width for text and rect is the consumer's (pass\n * a `className`); the shimmer runs only when motion is allowed.\n *\n * @status stable\n * @category Feedback\n * @accessibility `aria-hidden`: a placeholder has nothing to announce. Mark the container `aria-busy` while loading and clear it when content arrives; the shimmer stops under reduced motion.\n * @do Match the shape of the content it stands in for.\n * Set `aria-busy` on the region, not on the skeleton.\n * @dont Show it for content that arrives in under a few hundred milliseconds.\n * Animate it when the user prefers reduced motion; the CSS already stops it.\n */\nexport function Skeleton({ shape = 'text', lines = 1, size = 'md', className, ref, ...rest }: SkeletonProps) {\n  if (shape === 'text' && lines > 1) {\n    return (\n      <span {...rest} ref={ref} aria-hidden=\"true\" className={classes(styles.lines, className)} data-shape=\"text\">\n        {Array.from({ length: lines }, (_, index) => (\n          <span key={index} className={styles.skeleton} data-shape=\"text\" data-last={index === lines - 1 ? '' : undefined} />\n        ))}\n      </span>\n    );\n  }\n  return <span {...rest} ref={ref} aria-hidden=\"true\" className={classes(styles.skeleton, className)} data-shape={shape} data-size={size} />;\n}\n\nSkeleton.displayName = 'Skeleton';\n"]}

package/dist/chunk-AWQHULJC.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/inline/Inline.module.css","../src/inline/Inline.tsx"],"names":["inline"],"mappings":";;;;AAAA,IAAA,cAAA,GAAA;AAAA,EAGG,MAAA,EAAAA;AAAA,CAAA;;;AC+BI,SAAS,MAAA,CAAO,EAAE,EAAA,GAAK,KAAA,EAAO,MAAM,CAAA,EAAG,KAAA,EAAO,OAAA,EAAS,IAAA,GAAO,MAAM,SAAA,EAAW,GAAA,EAAK,QAAA,EAAU,GAAG,MAAK,EAAgB;AAC3H,EAAA,OAAO,aAAA;AAAA,IACL,EAAA;AAAA,IACA;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAA;AAAA;AAAA,MAEA,MAAM,IAAA,CAAK,IAAA,KAAS,OAAO,IAAA,IAAQ,EAAA,KAAO,OAAO,MAAA,GAAS,MAAA,CAAA;AAAA,MAC1D,SAAA,EAAW,OAAA,CAAQ,cAAA,CAAO,MAAA,EAAQ,SAAS,CAAA;AAAA,MAC3C,UAAA,EAAY,GAAA;AAAA,MACZ,YAAA,EAAc,KAAA;AAAA,MACd,cAAA,EAAgB,OAAA;AAAA,MAChB,WAAA,EAAa,OAAO,EAAA,GAAK;AAAA,KAC3B;AAAA,IACA;AAAA,GACF;AACF;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-AWQHULJC.js","sourcesContent":["/* Every value is a token (--inline-gap-*). Gap, alignment and justification are data attributes. */\n\n@layer components {\n  .inline {\n    display: flex;\n    flex-flow: row nowrap;\n    gap: var(--inline-gap-3);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n\n    &[data-gap=\"1\"] { gap: var(--inline-gap-1); }\n    &[data-gap=\"2\"] { gap: var(--inline-gap-2); }\n    &[data-gap=\"3\"] { gap: var(--inline-gap-3); }\n    &[data-gap=\"4\"] { gap: var(--inline-gap-4); }\n    &[data-gap=\"5\"] { gap: var(--inline-gap-5); }\n    &[data-gap=\"6\"] { gap: var(--inline-gap-6); }\n    &[data-gap=\"7\"] { gap: var(--inline-gap-7); }\n    &[data-gap=\"8\"] { gap: var(--inline-gap-8); }\n    &[data-align=\"start\"] { align-items: flex-start; }\n    &[data-align=\"center\"] { align-items: center; }\n    &[data-align=\"end\"] { align-items: flex-end; }\n    &[data-align=\"stretch\"] { align-items: stretch; }\n    &[data-justify=\"start\"] { justify-content: flex-start; }\n    &[data-justify=\"center\"] { justify-content: center; }\n    &[data-justify=\"end\"] { justify-content: flex-end; }\n    &[data-justify=\"between\"] { justify-content: space-between; }\n    &[data-wrap] { flex-wrap: wrap; }\n  }\n}\n","import { createElement, type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport { classes } from '../internal/classes';\nimport styles from './Inline.module.css';\n\nexport type InlineGap = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\nexport type InlineAlign = 'start' | 'center' | 'end' | 'stretch';\nexport type InlineJustify = 'start' | 'center' | 'end' | 'between';\nexport type InlineElement = 'div' | 'section' | 'nav' | 'ul' | 'ol' | 'li';\n\nexport interface InlineProps extends HTMLAttributes<HTMLElement> {\n  /** @default 'div' */\n  as?: InlineElement;\n  /** Step on the spacing scale (`--space-1` … `--space-8`). @default 3 */\n  gap?: InlineGap;\n  align?: InlineAlign;\n  justify?: InlineJustify;\n  /** Wrap onto new lines when the row overflows. @default true */\n  wrap?: boolean;\n  ref?: Ref<HTMLElement>;\n  children: ReactNode;\n}\n\n/**\n * A flex row whose gap is a step on the spacing scale, so consumers\n * compose layout from tokens instead of writing padding and margins.\n * Rendered as `ul`/`ol` it keeps `role=\"list\"` explicitly, because Safari\n * stops announcing a list once `list-style` is removed.\n *\n * @status stable\n * @category Layout\n * @accessibility Layout only: no role unless rendered as `ul`/`ol`, where `role=\"list\"` is kept explicitly because Safari drops list semantics without markers.\n * @do Use `as=\"ul\"` for a list of like items so the count is announced.\n * @dont Use it to space unrelated regions; it is one flex row.\n */\nexport function Inline({ as = 'div', gap = 3, align, justify, wrap = true, className, ref, children, ...rest }: InlineProps) {\n  return createElement(\n    as,\n    {\n      ...rest,\n      ref,\n      // Safari drops list semantics when list-style is none; say it explicitly.\n      role: rest.role ?? (as === 'ul' || as === 'ol' ? 'list' : undefined),\n      className: classes(styles.inline, className),\n      'data-gap': gap,\n      'data-align': align,\n      'data-justify': justify,\n      'data-wrap': wrap ? '' : undefined,\n    },\n    children,\n  );\n}\n\nInline.displayName = 'Inline';\n"]}

package/dist/chunk-DWE374JX.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/checkbox/Checkbox.module.css","../src/checkbox/Checkbox.tsx"],"names":["checkbox","row","input"],"mappings":";;;;;AAAA,IAAA,gBAAA,GAAA;AAAA,EAOG,QAAA,EAAAA,mBAAAA;AAAA,EAWA,GAAA,EAAAC,cAAAA;AAAA,EAMA,KAAA,EAAAC;AAAA,CAAA;ACaI,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-DWE374JX.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 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-DXOOW6Q6.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/toast/context.ts","../src/toast/Toast.module.css","../src/toast/Toast.tsx"],"names":["region","list","item","toast"],"mappings":"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","file":"chunk-DXOOW6Q6.js","sourcesContent":["import { createContext, useContext, type ReactNode } from 'react';\nimport type { AlertTone } from '../alert';\n\nexport interface ToastOptions {\n  title: ReactNode;\n  description?: ReactNode;\n  /** @default 'info' */\n  tone?: AlertTone;\n  /** Milliseconds before auto-dismiss; `Infinity` keeps it until dismissed. Errors default to `Infinity`. */\n  duration?: number;\n  action?: { label: string; onClick: () => void };\n}\n\nexport interface ToastItem extends ToastOptions {\n  id: string;\n}\n\nexport interface ToastContextValue {\n  /** Shows a toast and returns its id. */\n  toast: (options: ToastOptions) => string;\n  dismiss: (id: string) => void;\n  dismissAll: () => void;\n}\n\nexport const ToastContext = createContext<ToastContextValue | null>(null);\n\n/** The toast API. Must be used inside `ToastProvider`. */\nexport function useToast(): ToastContextValue {\n  const context = useContext(ToastContext);\n  if (!context) throw new Error('useToast must be used inside <ToastProvider>');\n  return context;\n}\n","/* Every value is a token (--toast-*). The region is fixed; placement is a data attribute. */\n\n@layer components {\n  .region {\n    --_top: auto;\n    --_end: var(--toast-offset);\n    --_bottom: var(--toast-offset);\n    --_start: auto;\n\n    position: fixed;\n    z-index: var(--toast-layer);\n    inset: var(--_top) var(--_end) var(--_bottom) var(--_start);\n    inline-size: min(var(--toast-width), 100vw);\n    padding: 0;\n    pointer-events: none;\n\n    &[data-placement=\"top-end\"] {\n      --_top: var(--toast-offset);\n      --_bottom: auto;\n    }\n\n    &[data-placement=\"top-center\"] {\n      --_top: var(--toast-offset);\n      --_bottom: auto;\n      --_start: 0;\n      --_end: 0;\n\n      margin-inline: auto;\n    }\n  }\n\n  .list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--toast-gap);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .item {\n    pointer-events: auto;\n    animation: enter var(--toast-motion-duration) var(--motion-easing-standard);\n  }\n\n  .toast {\n    border-radius: var(--toast-radius);\n    box-shadow: var(--toast-shadow);\n  }\n\n  @keyframes enter {\n    from {\n      opacity: 0;\n      translate: 0 var(--space-2);\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .item {\n      animation: none;\n    }\n  }\n}\n","import { useCallback, useEffect, useMemo, useRef, useState, type KeyboardEvent, type ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { Alert } from '../alert';\nimport { Button } from '../button';\nimport { classes } from '../internal/classes';\nimport { ToastContext, type ToastItem, type ToastOptions } from './context';\nimport styles from './Toast.module.css';\n\nexport type ToastPlacement = 'bottom-end' | 'top-end' | 'top-center';\n\nexport interface ToastProviderProps {\n  /** @default 'bottom-end' */\n  placement?: ToastPlacement;\n  /** Most toasts shown at once; the oldest is dismissed first. @default 5 */\n  max?: number;\n  /** Default auto-dismiss time in milliseconds. @default 6000 */\n  duration?: number;\n  /** Accessible name of the region. @default 'Notifications' */\n  label?: string;\n  children: ReactNode;\n}\n\ninterface Timer {\n  remaining: number;\n  startedAt: number;\n  handle: ReturnType<typeof setTimeout> | undefined;\n}\n\n/**\n * Mount once near the app root. Owns a portal element with a polite live\n * region; `useToast()` adds notifications to it. Timers pause while the\n * region is hovered or holds focus, Escape dismisses the focused toast, and\n * error toasts stay until dismissed. Each toast is an Alert.\n *\n * @status stable\n * @category Feedback\n * @accessibility Owns a `region` named \"Notifications\" with `aria-live=\"polite\"`; each toast is an Alert with its live role off (the region announces). Timers pause while the region is hovered or holds focus; Escape dismisses the focused toast; error toasts stay until dismissed.\n * @do Mount it once near the app root.\n * Keep messages to one sentence; put detail behind an `action`.\n * @dont Use a toast for an error the user must fix in a form; show it at the field.\n * Stack more than a few; the cap drops the oldest.\n */\nexport function ToastProvider({ placement = 'bottom-end', max = 5, duration = 6000, label = 'Notifications', children }: ToastProviderProps) {\n  const [items, setItems] = useState<ToastItem[]>([]);\n  const [paused, setPaused] = useState(false);\n  const timers = useRef(new Map<string, Timer>());\n  const counter = useRef(0);\n\n  const [container] = useState<HTMLDivElement | undefined>(() => {\n    if (typeof document === 'undefined') return undefined;\n    const element = document.createElement('div');\n    element.dataset.pulpToasts = '';\n    return element;\n  });\n\n  useEffect(() => {\n    if (!container) return;\n    document.body.append(container);\n    return () => container.remove();\n  }, [container]);\n\n  const dismiss = useCallback((id: string) => {\n    const timer = timers.current.get(id);\n    if (timer?.handle !== undefined) clearTimeout(timer.handle);\n    timers.current.delete(id);\n    setItems((current) => current.filter((item) => item.id !== id));\n  }, []);\n\n  const dismissAll = useCallback(() => {\n    for (const timer of timers.current.values()) if (timer.handle !== undefined) clearTimeout(timer.handle);\n    timers.current.clear();\n    setItems([]);\n  }, []);\n\n  const start = useCallback(\n    (id: string, remaining: number) => {\n      if (!Number.isFinite(remaining)) return;\n      timers.current.set(id, { remaining, startedAt: Date.now(), handle: setTimeout(() => dismiss(id), remaining) });\n    },\n    [dismiss],\n  );\n\n  const toast = useCallback(\n    (options: ToastOptions) => {\n      counter.current += 1;\n      const id = `toast-${counter.current}`;\n      const ttl = options.duration ?? (options.tone === 'error' ? Infinity : duration);\n      setItems((current) => {\n        const next = [...current, { ...options, id }];\n        const overflow = next.length - max;\n        if (overflow > 0) {\n          for (const old of next.slice(0, overflow)) {\n            const timer = timers.current.get(old.id);\n            if (timer?.handle !== undefined) clearTimeout(timer.handle);\n            timers.current.delete(old.id);\n          }\n          return next.slice(overflow);\n        }\n        return next;\n      });\n      if (!paused) start(id, ttl);\n      else timers.current.set(id, { remaining: ttl, startedAt: Date.now(), handle: undefined });\n      return id;\n    },\n    [duration, max, paused, start],\n  );\n\n  // Pause: freeze every timer with its remaining time. Resume: restart them.\n  useEffect(() => {\n    const map = timers.current;\n    if (paused) {\n      for (const [id, timer] of map) {\n        if (timer.handle === undefined) continue;\n        clearTimeout(timer.handle);\n        map.set(id, { ...timer, remaining: Math.max(0, timer.remaining - (Date.now() - timer.startedAt)), handle: undefined });\n      }\n    } else {\n      for (const [id, timer] of map) {\n        if (timer.handle !== undefined || !Number.isFinite(timer.remaining)) continue;\n        map.set(id, { ...timer, startedAt: Date.now(), handle: setTimeout(() => dismiss(id), timer.remaining) });\n      }\n    }\n  }, [paused, dismiss]);\n\n  useEffect(() => {\n    const map = timers.current;\n    return () => {\n      for (const timer of map.values()) if (timer.handle !== undefined) clearTimeout(timer.handle);\n    };\n  }, []);\n\n  const value = useMemo(() => ({ toast, dismiss, dismissAll }), [toast, dismiss, dismissAll]);\n\n  const onKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n    if (event.key !== 'Escape') return;\n    const item = (event.target as HTMLElement).closest<HTMLElement>('[data-toast-id]');\n    if (item?.dataset.toastId) {\n      event.preventDefault();\n      dismiss(item.dataset.toastId);\n    }\n  };\n\n  const region = (\n    <section\n      role=\"region\"\n      aria-label={label}\n      aria-live=\"polite\"\n      className={classes(styles.region)}\n      data-placement={placement}\n      onMouseEnter={() => setPaused(true)}\n      onMouseLeave={() => setPaused(false)}\n      onFocus={() => setPaused(true)}\n      onBlur={(event) => {\n        if (!event.currentTarget.contains(event.relatedTarget as Node | null)) setPaused(false);\n      }}\n      onKeyDown={onKeyDown}\n    >\n      <ol className={styles.list}>\n        {items.map((item) => (\n          <li key={item.id} className={styles.item} data-toast-id={item.id} data-tone={item.tone ?? 'info'}>\n            <Alert\n              tone={item.tone}\n              title={item.title}\n              live=\"off\"\n              className={styles.toast}\n              onDismiss={() => dismiss(item.id)}\n              action={\n                item.action && (\n                  <Button\n                    size=\"sm\"\n                    variant=\"secondary\"\n                    onClick={() => {\n                      item.action?.onClick();\n                      dismiss(item.id);\n                    }}\n                  >\n                    {item.action.label}\n                  </Button>\n                )\n              }\n            >\n              {item.description}\n            </Alert>\n          </li>\n        ))}\n      </ol>\n    </section>\n  );\n\n  return (\n    <ToastContext.Provider value={value}>\n      {children}\n      {container ? createPortal(region, container) : null}\n    </ToastContext.Provider>\n  );\n}\n\nToastProvider.displayName = 'ToastProvider';\n"]}

package/dist/chunk-FH54XQ35.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tabs/Tabs.module.css","../src/tabs/Tabs.tsx"],"names":["root","list","tab","panel"],"mappings":"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","file":"chunk-FH54XQ35.js","sourcesContent":["/* Every value is a token (--tabs-*). The indicator is a logical border on the active tab, so vertical orientation just flips the side. */\n\n@layer components {\n  .root {\n    display: flex;\n    flex-direction: column;\n    gap: 0;\n\n    &[data-orientation=\"vertical\"] {\n      flex-direction: row;\n    }\n  }\n\n  .list {\n    display: flex;\n    gap: var(--tabs-gap);\n    border-block-end: 1px solid var(--tabs-list-border);\n\n    &[data-orientation=\"vertical\"] {\n      flex-direction: column;\n      border-block-end: none;\n      border-inline-end: 1px solid var(--tabs-list-border);\n    }\n  }\n\n  .tab {\n    position: relative;\n    padding-block: var(--tabs-tab-padding-block);\n    padding-inline: var(--tabs-tab-padding-inline);\n    border: none;\n    border-radius: var(--tabs-tab-radius) var(--tabs-tab-radius) 0 0;\n    background-color: transparent;\n    color: var(--tabs-tab-fg);\n    font-size: var(--tabs-tab-font-size);\n    font-weight: var(--tabs-tab-font-weight);\n    line-height: 1;\n    white-space: nowrap;\n    cursor: pointer;\n    transition:\n      color var(--tabs-motion-duration) var(--motion-easing-standard),\n      background-color var(--tabs-motion-duration) var(--motion-easing-standard);\n\n    /* Indicator: a transparent border always present, coloured when active, so nothing shifts. */\n    border-block-end: 2px solid transparent;\n\n    &:focus-visible {\n      outline: var(--tabs-focus-ring-width) solid var(--tabs-focus-ring);\n      outline-offset: calc(-1 * var(--tabs-focus-ring-offset));\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.55;\n    }\n\n    &[data-state=\"active\"] {\n      color: var(--tabs-tab-fg-active);\n      border-block-end-color: var(--tabs-tab-indicator);\n    }\n\n    &:hover:not(:disabled, [data-state=\"active\"]) {\n      color: var(--tabs-tab-fg-hover);\n      background-color: var(--tabs-tab-bg-hover);\n    }\n  }\n\n  .list[data-orientation=\"vertical\"] .tab {\n    border-radius: var(--tabs-tab-radius) 0 0 var(--tabs-tab-radius);\n    border-block-end: none;\n    border-inline-end: 2px solid transparent;\n    text-align: start;\n\n    &[data-state=\"active\"] {\n      border-inline-end-color: var(--tabs-tab-indicator);\n    }\n  }\n\n  .panel {\n    padding-block: var(--tabs-panel-padding-block);\n    color: var(--tabs-panel-fg);\n\n    &:focus-visible {\n      outline: var(--tabs-focus-ring-width) solid var(--tabs-focus-ring);\n      outline-offset: var(--tabs-focus-ring-offset);\n    }\n  }\n\n  .root[data-orientation=\"vertical\"] .panel {\n    padding-block: 0;\n    padding-inline-start: var(--tabs-tab-padding-inline);\n  }\n}\n","import {\n  createContext,\n  useCallback,\n  useContext,\n  useId,\n  useState,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport { classes } from '../internal/classes';\nimport { useRovingFocus } from '../internal/useRovingFocus';\nimport styles from './Tabs.module.css';\n\nexport type TabsOrientation = 'horizontal' | 'vertical';\nexport type TabsActivation = 'automatic' | 'manual';\n\ninterface TabsContextValue {\n  value: string;\n  setValue: (value: string) => void;\n  orientation: TabsOrientation;\n  activation: TabsActivation;\n  baseId: string;\n}\n\nconst TabsContext = createContext<TabsContextValue | null>(null);\n\nfunction useTabs(component: string): TabsContextValue {\n  const context = useContext(TabsContext);\n  if (!context) throw new Error(`${component} must be rendered inside <Tabs>`);\n  return context;\n}\n\nexport interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'onChange'> {\n  /** Controlled selected tab. */\n  value?: string;\n  /** Initially selected tab when uncontrolled. */\n  defaultValue?: string;\n  onValueChange?: (value: string) => void;\n  /** Layout and arrow-key axis. @default 'horizontal' */\n  orientation?: TabsOrientation;\n  /**\n   * `automatic` selects a tab when it receives focus (arrow keys); `manual`\n   * moves focus only and selects on Enter, Space or click.\n   * @default 'automatic'\n   */\n  activation?: TabsActivation;\n  ref?: Ref<HTMLDivElement>;\n  children: ReactNode;\n}\n\n/**\n * Tabbed sections following the WAI-ARIA Tabs pattern. Compose with\n * `Tabs.List`, `Tabs.Tab` and `Tabs.Panel`; ids and ARIA relationships are\n * wired automatically. One tab stop: arrows move between tabs, Home and End\n * jump to the ends, disabled tabs are skipped. State on the DOM:\n * `data-orientation`, `data-state=\"active|inactive\"`.\n *\n * @status stable\n * @category Navigation\n * @accessibility The WAI-ARIA Tabs pattern: `tablist` with `aria-orientation`, `tab`s carrying `aria-selected` and `aria-controls`, `tabpanel`s labelled by their tab. One tab stop: arrows move (and select with automatic activation), Home/End jump, disabled tabs are skipped.\n * @do Use `activation=\"manual\"` when switching a tab is expensive.\n * Name the `Tabs.List` with `aria-label`.\n * @dont Use tabs for sequential steps; use a stepper pattern.\n * Put a link inside a tab.\n */\nexport function Tabs({\n  value,\n  defaultValue,\n  onValueChange,\n  orientation = 'horizontal',\n  activation = 'automatic',\n  className,\n  ref,\n  children,\n  ...rest\n}: TabsProps) {\n  const [uncontrolled, setUncontrolled] = useState(defaultValue ?? '');\n  const controlled = value !== undefined;\n  const current = controlled ? value : uncontrolled;\n  const setValue = useCallback(\n    (next: string) => {\n      if (!controlled) setUncontrolled(next);\n      onValueChange?.(next);\n    },\n    [controlled, onValueChange],\n  );\n  const baseId = useId();\n\n  return (\n    <TabsContext.Provider value={{ value: current, setValue, orientation, activation, baseId }}>\n      <div {...rest} ref={ref} className={classes(styles.root, className)} data-orientation={orientation}>\n        {children}\n      </div>\n    </TabsContext.Provider>\n  );\n}\n\ninterface TabsListProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n  children: ReactNode;\n}\n\nfunction TabsList({ className, ref, onKeyDown, children, ...rest }: TabsListProps) {\n  const { orientation, activation, setValue } = useTabs('Tabs.List');\n  const rove = useRovingFocus({\n    orientation,\n    selector: '[role=\"tab\"]',\n    onFocusItem: (item) => {\n      if (activation === 'automatic' && item.dataset.value !== undefined) setValue(item.dataset.value);\n    },\n  });\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      role=\"tablist\"\n      aria-orientation={orientation}\n      className={classes(styles.list, className)}\n      data-orientation={orientation}\n      onKeyDown={(event) => {\n        onKeyDown?.(event);\n        if (!event.defaultPrevented) rove(event);\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n\ninterface TabsTabProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value'> {\n  /** Identifies the tab; the panel with the same value belongs to it. */\n  value: string;\n  ref?: Ref<HTMLButtonElement>;\n  children: ReactNode;\n}\n\nfunction TabsTab({ value, disabled, className, onClick, ref, children, ...rest }: TabsTabProps) {\n  const tabs = useTabs('Tabs.Tab');\n  const selected = tabs.value === value;\n  return (\n    <button\n      {...rest}\n      ref={ref}\n      type=\"button\"\n      role=\"tab\"\n      id={`${tabs.baseId}-tab-${value}`}\n      aria-selected={selected}\n      aria-controls={`${tabs.baseId}-panel-${value}`}\n      tabIndex={selected ? 0 : -1}\n      disabled={disabled}\n      className={classes(styles.tab, className)}\n      data-value={value}\n      data-state={selected ? 'active' : 'inactive'}\n      data-disabled={disabled ? '' : undefined}\n      onClick={(event) => {\n        onClick?.(event);\n        if (!event.defaultPrevented) tabs.setValue(value);\n      }}\n    >\n      {children}\n    </button>\n  );\n}\n\ninterface TabsPanelProps extends HTMLAttributes<HTMLDivElement> {\n  value: string;\n  ref?: Ref<HTMLDivElement>;\n  children?: ReactNode;\n}\n\nfunction TabsPanel({ value, className, ref, children, ...rest }: TabsPanelProps) {\n  const tabs = useTabs('Tabs.Panel');\n  const selected = tabs.value === value;\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      role=\"tabpanel\"\n      id={`${tabs.baseId}-panel-${value}`}\n      aria-labelledby={`${tabs.baseId}-tab-${value}`}\n      hidden={!selected}\n      tabIndex={0}\n      className={classes(styles.panel, className)}\n      data-state={selected ? 'active' : 'inactive'}\n    >\n      {children}\n    </div>\n  );\n}\n\nTabs.displayName = 'Tabs';\nTabsList.displayName = 'Tabs.List';\nTabsTab.displayName = 'Tabs.Tab';\nTabsPanel.displayName = 'Tabs.Panel';\n\nTabs.List = TabsList;\nTabs.Tab = TabsTab;\nTabs.Panel = TabsPanel;\n"]}

package/dist/chunk-FXRSZUDH.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/icon-button/IconButton.module.css","../src/icon-button/IconButton.tsx"],"names":["iconButton"],"mappings":";;;;;;;AAAA,IAAA,kBAAA,GAAA;AAAA,EAGG,UAAA,EAAAA;AAAA,CAAA;ACwBI,SAAS,UAAA,CAAsD;AAAA,EACpE,KAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA,GAAU,KAAA;AAAA,EACV,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAuB;AACrB,EAAA,MAAM,KAAA,mBAAQ,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,WAAW,QAAA,EAAA,IAAA,EAAK,CAAA;AACzC,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,OAAA;AAAA,MACA,YAAA,EAAY,KAAA;AAAA,MACZ,OAAO,KAAA,IAAS,KAAA;AAAA,MAChB,gBAAA,EAAe,EAAA;AAAA,MACf,SAAA,EAAW,OAAA,CAAQ,kBAAA,CAAO,UAAA,EAAY,SAAS,CAAA;AAAA,MAE9C,QAAA,EAAA,OAAA,IAAW,eAAe,QAAQ,CAAA,GAAI,aAAa,QAAA,EAAU,MAAA,EAAW,KAAK,CAAA,GAAI;AAAA;AAAA,GACpF;AAEJ;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-FXRSZUDH.js","sourcesContent":["/* Squares a Button. Selectors carry the data attribute so they outrank Button's own size rules. */\n\n@layer components {\n  .iconButton[data-icon-only] {\n    gap: 0;\n    inline-size: var(--icon-button-size-md);\n    padding-inline: 0;\n\n    &[data-size=\"sm\"] { inline-size: var(--icon-button-size-sm); }\n    &[data-size=\"lg\"] { inline-size: var(--icon-button-size-lg); }\n  }\n}\n","import { cloneElement, isValidElement, type ReactElement, type ReactNode } from 'react';\nimport { Button, type ButtonProps } from '../button';\nimport { Icon } from '../icon';\nimport { classes } from '../internal/classes';\nimport styles from './IconButton.module.css';\n\nexport interface IconButtonProps<E extends HTMLElement = HTMLButtonElement>\n  extends Omit<ButtonProps<E>, 'children' | 'iconStart' | 'iconEnd'> {\n  /** The accessible name. Required: an icon alone is not a name. Also used as the tooltip unless `title` is given. */\n  label: string;\n  /** The glyph, for instance from `@pearpages/pulp-icons`. */\n  icon: ReactNode;\n  /** With `asChild`: the element to render (a link, for instance). Its own children are replaced by the icon. */\n  children?: ReactElement;\n}\n\n/**\n * A square Button that shows only an icon and therefore *requires* a name.\n * Everything else (variants, sizes, loading, asChild) is Button's; the\n * `--icon-button-size-*` tokens make it square.\n *\n * @status stable\n * @category Actions\n * @accessibility A Button with `aria-label` from the required `label`; `title` shows it as a tooltip. Everything else is Button's.\n * @do Write the label as the action (\"Close\", \"Add item\").\n * @dont Use the icon's name as the label.\n */\nexport function IconButton<E extends HTMLElement = HTMLButtonElement>({\n  label,\n  icon,\n  title,\n  className,\n  asChild = false,\n  children,\n  ...rest\n}: IconButtonProps<E>) {\n  const glyph = <Icon size=\"inherit\">{icon}</Icon>;\n  return (\n    <Button\n      {...rest}\n      asChild={asChild}\n      aria-label={label}\n      title={title ?? label}\n      data-icon-only=\"\"\n      className={classes(styles.iconButton, className)}\n    >\n      {asChild && isValidElement(children) ? cloneElement(children, undefined, glyph) : glyph}\n    </Button>\n  );\n}\n\nIconButton.displayName = 'IconButton';\n"]}

package/dist/chunk-GTTXRDXV.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/menu/Menu.module.css","../src/menu/Menu.tsx"],"names":["content","item","label","separator"],"mappings":"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","file":"chunk-GTTXRDXV.js","sourcesContent":["/* Every value is a token (--menu-*). Position comes in as --_x/--_y from the floating hook. */\n\n@layer components {\n  .content {\n    --_gap: var(--menu-gap);\n\n    position: fixed;\n    z-index: var(--menu-layer);\n    inset-block-start: var(--_y);\n    inset-inline-start: var(--_x);\n    display: flex;\n    flex-direction: column;\n    min-inline-size: var(--menu-min-width);\n    max-inline-size: calc(100vw - 2 * var(--space-4));\n    padding: var(--menu-padding);\n    border: var(--size-hairline) solid var(--menu-border);\n    border-radius: var(--menu-radius);\n    background-color: var(--menu-bg);\n    color: var(--menu-fg);\n    font-family: var(--font-family-body);\n    box-shadow: var(--menu-shadow);\n    animation: fade var(--menu-duration) var(--motion-easing-standard);\n\n    &:focus-visible {\n      outline: var(--menu-focus-ring-width) solid var(--menu-focus-ring);\n      outline-offset: var(--menu-focus-ring-offset);\n    }\n  }\n\n  .item {\n    display: flex;\n    align-items: center;\n    gap: var(--space-2);\n    inline-size: 100%;\n    padding-block: var(--menu-item-padding-block);\n    padding-inline: var(--menu-item-padding-inline);\n    border: none;\n    border-radius: var(--menu-item-radius);\n    background-color: transparent;\n    color: var(--menu-item-fg);\n    font-size: var(--menu-item-font-size);\n    text-align: start;\n    cursor: pointer;\n\n    &[data-tone=\"danger\"] {\n      color: var(--menu-item-fg-danger);\n    }\n\n    &[data-disabled] {\n      color: var(--menu-item-fg-muted);\n      cursor: not-allowed;\n    }\n\n    &:focus-visible {\n      outline: none;\n      background-color: var(--menu-item-bg-active);\n    }\n\n    &:hover:not([data-disabled]) {\n      background-color: var(--menu-item-bg-active);\n    }\n  }\n\n  .label {\n    flex: 1;\n  }\n\n  .separator {\n    block-size: var(--size-hairline);\n    margin-block: var(--menu-padding);\n    background-color: var(--menu-separator);\n  }\n\n  @keyframes fade {\n    from {\n      opacity: 0;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .content {\n      animation: none;\n    }\n  }\n}\n","import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { Icon } from '../icon';\nimport { renderAsChild } from '../internal/asChild';\nimport { classes } from '../internal/classes';\nimport { useFloatingPosition, type FloatingPlacement } from '../internal/floating';\nimport { useDismiss } from '../internal/useDismiss';\nimport { useRovingFocus } from '../internal/useRovingFocus';\nimport styles from './Menu.module.css';\n\nexport type MenuPlacement = FloatingPlacement;\ntype FocusTarget = 'first' | 'last' | null;\n\ninterface MenuContextValue {\n  open: boolean;\n  setOpen: (open: boolean, focus?: FocusTarget) => void;\n  focusTarget: FocusTarget;\n  triggerId: string;\n  contentId: string;\n  floating: ReturnType<typeof useFloatingPosition>;\n}\n\nconst MenuContext = createContext<MenuContextValue | null>(null);\n\nfunction useMenu(part: string): MenuContextValue {\n  const context = useContext(MenuContext);\n  if (!context) throw new Error(`${part} must be rendered inside <Menu>`);\n  return context;\n}\n\nexport interface MenuProps {\n  open?: boolean;\n  /** @default false */\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  /** @default 'bottom-start' */\n  placement?: MenuPlacement;\n  children: ReactNode;\n}\n\n/**\n * A list of actions opened from a button, following the WAI-ARIA menu\n * button pattern: Down/Up arrow on the trigger opens and focuses the first\n * or last item, arrows move with wraparound, Home and End jump, typing\n * jumps to the next item starting with that letter, Enter, Space or click\n * selects and closes, Escape and Tab close and return focus. Compose with\n * `Menu.Trigger`, `Menu.Content`, `Menu.Item` and `Menu.Separator`.\n *\n * @status stable\n * @category Overlays\n * @accessibility The WAI-ARIA menu button pattern: the trigger has `aria-haspopup=\"menu\"` and `aria-expanded`; the popup is `role=\"menu\"` named by the trigger with `menuitem` children. Down/Up opens to the first/last item, arrows wrap, Home/End jump, typing jumps, Enter/Space/click select and close, Escape and Tab close and return focus.\n * @do Use `tone=\"danger\"` for destructive items and put them after a separator.\n * @dont Put form controls or links that navigate inside a menu; those want Popover or a navigation list.\n * Use it for navigation between pages.\n */\nexport function Menu({ open, defaultOpen = false, onOpenChange, placement = 'bottom-start', children }: MenuProps) {\n  const [uncontrolled, setUncontrolled] = useState(defaultOpen);\n  const [focusTarget, setFocusTarget] = useState<FocusTarget>(null);\n  const controlled = open !== undefined;\n  const isOpen = controlled ? open : uncontrolled;\n  const setOpen = useCallback(\n    (next: boolean, focus: FocusTarget = null) => {\n      setFocusTarget(next ? focus : null);\n      if (!controlled) setUncontrolled(next);\n      onOpenChange?.(next);\n    },\n    [controlled, onOpenChange],\n  );\n  const id = useId();\n  const floating = useFloatingPosition({ open: isOpen, placement });\n\n  return (\n    <MenuContext.Provider value={{ open: isOpen, setOpen, focusTarget, triggerId: `${id}-trigger`, contentId: `${id}-menu`, floating }}>\n      {children}\n    </MenuContext.Provider>\n  );\n}\n\nfunction mergeRefs<T>(a: Ref<T> | undefined, b: (node: T | null) => void) {\n  return (node: T | null) => {\n    b(node);\n    if (typeof a === 'function') a(node);\n    else if (a) a.current = node;\n  };\n}\n\ninterface MenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n  ref?: Ref<HTMLButtonElement>;\n  children: ReactNode;\n}\n\nfunction MenuTrigger({ asChild = false, onClick, onKeyDown, ref, children, ...rest }: MenuTriggerProps) {\n  const menu = useMenu('Menu.Trigger');\n  const props = {\n    ...rest,\n    id: menu.triggerId,\n    'aria-haspopup': 'menu' as const,\n    'aria-expanded': menu.open,\n    'aria-controls': menu.open ? menu.contentId : undefined,\n    onClick: (event: MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event);\n      if (!event.defaultPrevented) menu.setOpen(!menu.open, 'first');\n    },\n    onKeyDown: (event: KeyboardEvent<HTMLButtonElement>) => {\n      onKeyDown?.(event);\n      if (event.defaultPrevented) return;\n      if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n        event.preventDefault();\n        menu.setOpen(true, event.key === 'ArrowDown' ? 'first' : 'last');\n      }\n    },\n  };\n  const setRef = mergeRefs(ref, menu.floating.refs.setReference);\n  // eslint-disable-next-line react-hooks/refs -- forwarded to the reference element, not read\n  if (asChild) return renderAsChild('Menu.Trigger', children, { ...props, ref: setRef });\n  return (\n    <button type=\"button\" {...props} ref={setRef}>\n      {children}\n    </button>\n  );\n}\n\ninterface MenuContentProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n  children: ReactNode;\n}\n\nfunction MenuContent({ className, onKeyDown, ref, children, ...rest }: MenuContentProps) {\n  const menu = useMenu('Menu.Content');\n  const { refs, positionStyle, placement } = menu.floating;\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const rove = useRovingFocus({ orientation: 'vertical', selector: '[role=\"menuitem\"]' });\n\n  useDismiss({\n    open: menu.open,\n    onDismiss: () => menu.setOpen(false),\n    inside: () => [refs.reference.current as Element | null, refs.floating.current],\n  });\n\n  useEffect(() => {\n    if (!menu.open) return;\n    const content = contentRef.current;\n    if (!content) return;\n    const items = Array.from(content.querySelectorAll<HTMLElement>('[role=\"menuitem\"]:not([aria-disabled=\"true\"])'));\n    const target = menu.focusTarget === 'last' ? items.at(-1) : items[0];\n    (target ?? content).focus();\n    return () => {\n      const reference = refs.reference.current as HTMLElement | null;\n      if (content.contains(document.activeElement) || document.activeElement === document.body) reference?.focus();\n    };\n  }, [menu.open, menu.focusTarget, refs.reference]);\n\n  const typeahead = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (event.key.length !== 1 || event.altKey || event.ctrlKey || event.metaKey) return false;\n    const items = Array.from(event.currentTarget.querySelectorAll<HTMLElement>('[role=\"menuitem\"]:not([aria-disabled=\"true\"])'));\n    const current = items.indexOf(document.activeElement as HTMLElement);\n    const ordered = [...items.slice(current + 1), ...items.slice(0, current + 1)];\n    const match = ordered.find((item) => item.textContent?.trim().toLowerCase().startsWith(event.key.toLowerCase()));\n    if (!match) return false;\n    event.preventDefault();\n    match.focus();\n    return true;\n  };\n\n  if (!menu.open) return null;\n  return createPortal(\n    <div\n      {...rest}\n      ref={mergeRefs(ref, (node) => {\n        contentRef.current = node;\n        refs.setFloating(node);\n      })}\n      id={menu.contentId}\n      role=\"menu\"\n      aria-labelledby={menu.triggerId}\n      tabIndex={-1}\n      className={classes(styles.content, className)}\n      data-placement={placement}\n      // eslint-disable-next-line react/forbid-dom-props -- per-instance position (--_x/--_y), see internal/floating.ts\n      style={positionStyle}\n      onKeyDown={(event) => {\n        onKeyDown?.(event);\n        if (event.defaultPrevented) return;\n        if (event.key === 'Tab') {\n          menu.setOpen(false);\n          return;\n        }\n        if (typeahead(event)) return;\n        rove(event);\n      }}\n    >\n      {children}\n    </div>,\n    document.body,\n  );\n}\n\nexport type MenuItemTone = 'default' | 'danger';\n\ninterface MenuItemProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onSelect'> {\n  /** Called when the item is chosen; the menu closes afterwards. */\n  onSelect?: () => void;\n  /** @default 'default' */\n  tone?: MenuItemTone;\n  /** Leading glyph, decorative. */\n  icon?: ReactNode;\n  ref?: Ref<HTMLButtonElement>;\n  children: ReactNode;\n}\n\nfunction MenuItem({ onSelect, tone = 'default', icon, disabled, className, onClick, ref, children, ...rest }: MenuItemProps) {\n  const menu = useMenu('Menu.Item');\n  return (\n    <button\n      {...rest}\n      ref={ref}\n      type=\"button\"\n      role=\"menuitem\"\n      tabIndex={-1}\n      aria-disabled={disabled || undefined}\n      className={classes(styles.item, className)}\n      data-tone={tone}\n      data-disabled={disabled ? '' : undefined}\n      onClick={(event) => {\n        onClick?.(event);\n        if (event.defaultPrevented || disabled) return;\n        onSelect?.();\n        menu.setOpen(false);\n      }}\n    >\n      {icon && <Icon size=\"inherit\">{icon}</Icon>}\n      <span className={styles.label}>{children}</span>\n    </button>\n  );\n}\n\nfunction MenuSeparator({ className, ...rest }: HTMLAttributes<HTMLDivElement>) {\n  return <div {...rest} role=\"separator\" className={classes(styles.separator, className)} />;\n}\n\nMenu.displayName = 'Menu';\nMenuTrigger.displayName = 'Menu.Trigger';\nMenuContent.displayName = 'Menu.Content';\nMenuItem.displayName = 'Menu.Item';\nMenuSeparator.displayName = 'Menu.Separator';\n\nMenu.Trigger = MenuTrigger;\nMenu.Content = MenuContent;\nMenu.Item = MenuItem;\nMenu.Separator = MenuSeparator;\n"]}

package/dist/chunk-GUZMLYST.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/combobox/Combobox.module.css","../src/combobox/Combobox.tsx"],"names":["root","control","input","button","popover","list","AriaComboBox","AriaInput","AriaButton","AriaPopover","AriaListBox"],"mappings":"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","file":"chunk-GUZMLYST.js","sourcesContent":["/*\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","import type { ReactNode, Ref } from 'react';\nimport {\n  Button as AriaButton,\n  ComboBox as AriaComboBox,\n  Input as AriaInput,\n  ListBox as AriaListBox,\n  Popover as AriaPopover,\n  useFilter,\n} from 'react-aria-components';\nimport { ChevronDown } from '@pearpages/pulp-icons';\nimport { Icon } from '../icon';\nimport { AriaFieldDescription, AriaFieldError, AriaFieldLabel, ariaFieldClass, isPresent } from '../internal/AriaField';\nimport { listClass, renderEmpty, renderOption, type ListboxItem } from '../listbox/ListboxOptions';\nimport { Spinner } from '../spinner';\nimport styles from './Combobox.module.css';\n\nexport type ComboboxItem = ListboxItem;\nexport type ComboboxSize = 'sm' | 'md' | 'lg';\n/** `contains` and `startsWith` filter `items` as the user types; `none` shows `items` as given (you filtered them, typically after a fetch). */\nexport type ComboboxFilter = 'contains' | 'startsWith' | 'none';\n\nexport interface ComboboxProps {\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 options. With `filter=\"none\"` they are shown as given. */\n  items: readonly ComboboxItem[];\n  /** Selected id (controlled). `null` is \"nothing selected\". */\n  value?: string | null;\n  defaultValue?: string | null;\n  onChange?: (value: string | null) => void;\n  /** The text in the input (controlled). Pair with `onInputChange` to fetch options as the user types. */\n  inputValue?: string;\n  defaultInputValue?: string;\n  onInputChange?: (text: string) => void;\n  /** @default 'contains' */\n  filter?: ComboboxFilter;\n  /** Keeps the list open with a spinner in the control while options load. @default false */\n  loading?: boolean;\n  /** Shown in the open list when no option matches. @default 'No results' */\n  emptyMessage?: ReactNode;\n  /** Announced while `loading`. @default 'Loading…' */\n  loadingMessage?: ReactNode;\n  /** Let the typed text stand as the value even when it matches no option. @default false */\n  allowsCustomValue?: boolean;\n  /** When the list opens: on focus, on typing, or only from the button and arrow keys. @default 'input' */\n  menuTrigger?: 'focus' | 'input' | 'manual';\n  placeholder?: string;\n  /** @default 'md' */\n  size?: ComboboxSize;\n  /** @default false */\n  required?: boolean;\n  /** @default false */\n  disabled?: boolean;\n  /** @default false */\n  readOnly?: boolean;\n  /** Submitted with a form: the selected id (or the text with `allowsCustomValue`). */\n  name?: string;\n  autoFocus?: boolean;\n  /** Applied to the field wrapper, not the input. */\n  className?: string;\n  /** The `<input>` element. */\n  ref?: Ref<HTMLInputElement>;\n}\n\n/**\n * A text input that suggests options as the user types, on React Aria's\n * combobox (decision record 001): the list is announced through\n * `aria-activedescendant`, arrows move, Enter selects, Escape closes and\n * then clears. Static lists filter themselves; for async options, control\n * `inputValue`, fetch, and pass the results with `filter=\"none\"` and\n * `loading` while they arrive. Options look the same as Listbox's.\n *\n * @status experimental\n * @category Forms\n * @accessibility A `combobox` input with `aria-autocomplete=\"list\"`; the open list is a `listbox` announced through `aria-activedescendant`, so focus stays in the input. Arrows move, Enter selects, Escape closes and then clears. Loading and empty states are announced from inside the list.\n * @do Use `filter=\"none\"` with controlled `inputValue` for server-side search.\n * Keep `loading` true until the results for the current text arrive.\n * @dont Use it for fewer than five fixed options; use Picker or the native Select.\n * Set `menuTrigger=\"focus\"` on a long list; opening on every focus is noisy.\n */\nexport function Combobox({\n  label,\n  description,\n  error,\n  items,\n  value,\n  defaultValue,\n  onChange,\n  inputValue,\n  defaultInputValue,\n  onInputChange,\n  filter = 'contains',\n  loading = false,\n  emptyMessage = 'No results',\n  loadingMessage = 'Loading…',\n  allowsCustomValue = false,\n  menuTrigger = 'input',\n  placeholder,\n  size = 'md',\n  required = false,\n  disabled = false,\n  readOnly = false,\n  name,\n  autoFocus,\n  className,\n  ref,\n}: ComboboxProps) {\n  const { contains, startsWith } = useFilter({ sensitivity: 'base' });\n  const invalid = isPresent(error);\n  // `items` means \"already filtered\"; `defaultItems` lets React Aria filter.\n  const collection = filter === 'none' ? { items } : { defaultItems: items, defaultFilter: filter === 'startsWith' ? startsWith : contains };\n\n  return (\n    <AriaComboBox\n      {...collection}\n      className={ariaFieldClass(styles.root, className)}\n      data-size={size}\n      data-loading={loading ? '' : undefined}\n      selectedKey={value}\n      defaultSelectedKey={defaultValue}\n      onSelectionChange={(key) => onChange?.(key === null ? null : String(key))}\n      inputValue={inputValue}\n      defaultInputValue={defaultInputValue}\n      onInputChange={onInputChange}\n      allowsCustomValue={allowsCustomValue}\n      allowsEmptyCollection\n      menuTrigger={menuTrigger}\n      isRequired={required}\n      isDisabled={disabled}\n      isReadOnly={readOnly}\n      isInvalid={invalid}\n      name={name}\n    >\n      <AriaFieldLabel required={required}>{label}</AriaFieldLabel>\n      <div className={styles.control}>\n        <AriaInput ref={ref} className={styles.input} placeholder={placeholder} autoFocus={autoFocus} />\n        <AriaButton className={styles.button}>\n          {loading ? (\n            <Spinner size=\"inherit\" tone=\"inherit\" decorative />\n          ) : (\n            <Icon size=\"inherit\">\n              <ChevronDown />\n            </Icon>\n          )}\n        </AriaButton>\n      </div>\n      <AriaFieldDescription>{description}</AriaFieldDescription>\n      <AriaFieldError>{error}</AriaFieldError>\n      <AriaPopover className={styles.popover} placement=\"bottom start\">\n        <AriaListBox className={listClass(styles.list)} renderEmptyState={() => renderEmpty(loading ? loadingMessage : emptyMessage)}>\n          {renderOption}\n        </AriaListBox>\n      </AriaPopover>\n    </AriaComboBox>\n  );\n}\n\nCombobox.displayName = 'Combobox';\n"]}

package/dist/chunk-I4KC4V6A.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/spinner/Spinner.module.css","../src/spinner/Spinner.tsx"],"names":["spinner","ring"],"mappings":";;;;;AAAA,IAAA,eAAA,GAAA;AAAA,EAGG,OAAA,EAAAA,iBAAAA;AAAA,EAqBA,IAAA,EAAAC,cAMY,CAAA;ACER,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-I4KC4V6A.js","sourcesContent":["/* 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","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"]}