@pearpages/pulp-react 0.2.2 → 0.3.0

package/dist/date-picker.js

@@ -1,4 +1,4 @@
-export { DatePicker } from './chunk-Y4YVAHD2.js';
+"use client";export { DatePicker } from './chunk-Y4YVAHD2.js';
 import './chunk-JOGIN4SS.js';
 import './chunk-IRNTXAA7.js';
 import './chunk-DGIXNUNI.js';

package/dist/dialog.js

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

package/dist/divider.css

@@ -0,0 +1,37 @@
+/* src/divider/Divider.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
+@layer components {
+  .Divider_divider {
+    flex-shrink: 0;
+    margin: 0;
+    border: 0;
+    background-color: var(--divider-color);
+    &[data-orientation=horizontal] {
+      inline-size: 100%;
+      block-size: var(--divider-thickness);
+      &[data-spacing=sm] {
+        margin-block: var(--divider-spacing-sm);
+      }
+      &[data-spacing=md] {
+        margin-block: var(--divider-spacing-md);
+      }
+      &[data-spacing=lg] {
+        margin-block: var(--divider-spacing-lg);
+      }
+    }
+    &[data-orientation=vertical] {
+      align-self: stretch;
+      inline-size: var(--divider-thickness);
+      &[data-spacing=sm] {
+        margin-inline: var(--divider-spacing-sm);
+      }
+      &[data-spacing=md] {
+        margin-inline: var(--divider-spacing-md);
+      }
+      &[data-spacing=lg] {
+        margin-inline: var(--divider-spacing-lg);
+      }
+    }
+  }
+}
+/*# sourceMappingURL=divider.css.map */

package/dist/divider.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/divider/Divider.module.css"],"sourcesContent":["/* Every value is a token: --divider-* in packages/tokens/tokens/component/divider.json */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .divider {\n    flex-shrink: 0;\n    margin: 0;\n    border: 0;\n    background-color: var(--divider-color);\n\n    &[data-orientation=\"horizontal\"] {\n      inline-size: 100%;\n      block-size: var(--divider-thickness);\n\n      &[data-spacing=\"sm\"] { margin-block: var(--divider-spacing-sm); }\n      &[data-spacing=\"md\"] { margin-block: var(--divider-spacing-md); }\n      &[data-spacing=\"lg\"] { margin-block: var(--divider-spacing-lg); }\n    }\n\n    &[data-orientation=\"vertical\"] {\n      align-self: stretch;\n      inline-size: var(--divider-thickness);\n\n      &[data-spacing=\"sm\"] { margin-inline: var(--divider-spacing-sm); }\n      &[data-spacing=\"md\"] { margin-inline: var(--divider-spacing-md); }\n      &[data-spacing=\"lg\"] { margin-inline: var(--divider-spacing-lg); }\n    }\n  }\n}\n"],"mappings":";AAEA;AAEA;AACE,GAACA;AACC,iBAAa;AACb,YAAQ;AACR,YAAQ;AACR,sBAAkB,IAAI;AAEtB,KAAC,CAAC;AACA,mBAAa;AACb,kBAAY,IAAI;AAEhB,OAAC,CAAC;AAAqB,sBAAc,IAAI;AAAuB;AAChE,OAAC,CAAC;AAAqB,sBAAc,IAAI;AAAuB;AAChE,OAAC,CAAC;AAAqB,sBAAc,IAAI;AAAuB;AAClE;AAEA,KAAC,CAAC;AACA,kBAAY;AACZ,mBAAa,IAAI;AAEjB,OAAC,CAAC;AAAqB,uBAAe,IAAI;AAAuB;AACjE,OAAC,CAAC;AAAqB,uBAAe,IAAI;AAAuB;AACjE,OAAC,CAAC;AAAqB,uBAAe,IAAI;AAAuB;AACnE;AACF;AACF;","names":["divider"]}

package/dist/divider.d.ts

@@ -0,0 +1,35 @@
+import * as react from 'react';
+import { HTMLAttributes, Ref } from 'react';
+
+type DividerOrientation = 'horizontal' | 'vertical';
+type DividerSpacing = 'none' | 'sm' | 'md' | 'lg';
+interface DividerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+    /** @default 'horizontal' */
+    orientation?: DividerOrientation;
+    /** Space on both sides, along the axis the line separates. @default 'none' */
+    spacing?: DividerSpacing;
+    /**
+     * A decorative line is hidden from assistive technology. Pass `false` when the
+     * line is the only thing that says two groups are separate. @default true
+     */
+    decorative?: boolean;
+    ref?: Ref<HTMLDivElement>;
+}
+/**
+ * A hairline between two groups of content, horizontal or vertical. A vertical
+ * divider stretches to its flex or grid row, so it needs a parent that lays it out.
+ *
+ * @status experimental
+ * @category Layout
+ * @accessibility Decorative by default: `role="none"`, nothing is announced, because headings and landmarks should already carry the structure. With `decorative={false}` it is a `separator`, and a vertical one says so through `aria-orientation`. It is never focusable: a separator that moves is a splitter, which this is not.
+ * @do Put it between groups inside a Card, a Menu-like list or a toolbar.
+ * @do Let `spacing` set the distance, so it stays on the spacing scale.
+ * @dont Use it to draw a border around something; that is the container's border.
+ * @dont Rely on it alone to tell a screen reader that a new section starts; use a heading.
+ */
+declare function Divider({ orientation, spacing, decorative, className, ref, ...rest }: DividerProps): react.JSX.Element;
+declare namespace Divider {
+    var displayName: string;
+}
+
+export { Divider, type DividerOrientation, type DividerProps, type DividerSpacing };

package/dist/divider.js

@@ -0,0 +1,4 @@
+export { Divider } from './chunk-QID6YYFF.js';
+import './chunk-MI4QUKQS.js';
+//# sourceMappingURL=divider.js.map
+//# sourceMappingURL=divider.js.map

package/dist/divider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"divider.js"}

package/dist/empty-state.css

@@ -0,0 +1,175 @@
+/* src/heading/Heading.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
+@layer components {
+  .Heading_heading {
+    margin: 0;
+    font-family: var(--heading-font-family);
+    font-weight: var(--heading-font-weight);
+    line-height: var(--heading-line-height);
+    color: var(--heading-tone-default);
+    text-wrap: balance;
+    &[data-size=sm] {
+      font-size: var(--heading-size-sm);
+    }
+    &[data-size=md] {
+      font-size: var(--heading-size-md);
+    }
+    &[data-size=lg] {
+      font-size: var(--heading-size-lg);
+    }
+    &[data-size=xl] {
+      font-size: var(--heading-size-xl);
+    }
+    &[data-size="2xl"] {
+      font-size: var(--heading-size-2xl);
+    }
+    &[data-tone=muted] {
+      color: var(--heading-tone-muted);
+    }
+  }
+}
+
+/* src/stack/Stack.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
+@layer components {
+  .Stack_stack {
+    display: flex;
+    flex-direction: column;
+    gap: var(--stack-gap-3);
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    &[data-gap="1"] {
+      gap: var(--stack-gap-1);
+    }
+    &[data-gap="2"] {
+      gap: var(--stack-gap-2);
+    }
+    &[data-gap="3"] {
+      gap: var(--stack-gap-3);
+    }
+    &[data-gap="4"] {
+      gap: var(--stack-gap-4);
+    }
+    &[data-gap="5"] {
+      gap: var(--stack-gap-5);
+    }
+    &[data-gap="6"] {
+      gap: var(--stack-gap-6);
+    }
+    &[data-gap="7"] {
+      gap: var(--stack-gap-7);
+    }
+    &[data-gap="8"] {
+      gap: var(--stack-gap-8);
+    }
+    &[data-align=start] {
+      align-items: flex-start;
+    }
+    &[data-align=center] {
+      align-items: center;
+    }
+    &[data-align=end] {
+      align-items: flex-end;
+    }
+    &[data-align=stretch] {
+      align-items: stretch;
+    }
+    &[data-justify=start] {
+      justify-content: flex-start;
+    }
+    &[data-justify=center] {
+      justify-content: center;
+    }
+    &[data-justify=end] {
+      justify-content: flex-end;
+    }
+    &[data-justify=between] {
+      justify-content: space-between;
+    }
+  }
+}
+
+/* src/text/Text.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
+@layer components {
+  .Text_text {
+    margin: 0;
+    font-family: var(--text-font-family-body);
+    font-size: var(--text-size-md);
+    font-weight: var(--text-weight-regular);
+    line-height: var(--text-line-height);
+    color: var(--text-tone-default);
+    &[data-size=xs] {
+      font-size: var(--text-size-xs);
+    }
+    &[data-size=sm] {
+      font-size: var(--text-size-sm);
+    }
+    &[data-size=lg] {
+      font-size: var(--text-size-lg);
+    }
+    &[data-size=xl] {
+      font-size: var(--text-size-xl);
+    }
+    &[data-weight=medium] {
+      font-weight: var(--text-weight-medium);
+    }
+    &[data-weight=semibold] {
+      font-weight: var(--text-weight-semibold);
+    }
+    &[data-tone=muted] {
+      color: var(--text-tone-muted);
+    }
+    &[data-tone=faint] {
+      color: var(--text-tone-faint);
+    }
+    &[data-family=mono] {
+      font-family: var(--text-font-family-mono);
+    }
+    &[data-align=start] {
+      text-align: start;
+    }
+    &[data-align=center] {
+      text-align: center;
+    }
+    &[data-align=end] {
+      text-align: end;
+    }
+    &[data-truncate] {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+}
+
+/* src/empty-state/EmptyState.module.css */
+@layer reset, tokens, vendor, base, components, utilities;
+@layer components {
+  .EmptyState_root {
+    box-sizing: border-box;
+    padding: var(--empty-state-padding);
+  }
+  .EmptyState_text {
+    text-align: center;
+    text-wrap: balance;
+  }
+  .EmptyState_icon {
+    display: inline-flex;
+    flex: none;
+    align-items: center;
+    justify-content: center;
+    inline-size: var(--empty-state-icon-size);
+    block-size: var(--empty-state-icon-size);
+    border-radius: var(--empty-state-icon-radius);
+    background: var(--empty-state-icon-neutral-bg);
+    color: var(--empty-state-icon-neutral-fg);
+    font-size: var(--empty-state-icon-glyph-size);
+    .EmptyState_root[data-tone=error] & {
+      background: var(--empty-state-icon-error-bg);
+      color: var(--empty-state-icon-error-fg);
+    }
+  }
+}
+/*# sourceMappingURL=empty-state.css.map */

package/dist/empty-state.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/heading/Heading.module.css","../src/stack/Stack.module.css","../src/text/Text.module.css","../src/empty-state/EmptyState.module.css"],"sourcesContent":["/* Every value is a token (--heading-*). Size is a data attribute, independent of the level. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .heading {\n    margin: 0;\n    font-family: var(--heading-font-family);\n    font-weight: var(--heading-font-weight);\n    line-height: var(--heading-line-height);\n    color: var(--heading-tone-default);\n    text-wrap: balance;\n\n    &[data-size=\"sm\"] { font-size: var(--heading-size-sm); }\n    &[data-size=\"md\"] { font-size: var(--heading-size-md); }\n    &[data-size=\"lg\"] { font-size: var(--heading-size-lg); }\n    &[data-size=\"xl\"] { font-size: var(--heading-size-xl); }\n    &[data-size=\"2xl\"] { font-size: var(--heading-size-2xl); }\n    &[data-tone=\"muted\"] { color: var(--heading-tone-muted); }\n  }\n}\n","/* Every value is a token (--stack-gap-*). Gap, alignment and justification are data attributes. */\n\n@layer reset, tokens, vendor, base, components, utilities;\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","/* Every value is a token (--text-*). Variants are data attributes. */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .text {\n    margin: 0;\n    font-family: var(--text-font-family-body);\n    font-size: var(--text-size-md);\n    font-weight: var(--text-weight-regular);\n    line-height: var(--text-line-height);\n    color: var(--text-tone-default);\n\n    &[data-size=\"xs\"] { font-size: var(--text-size-xs); }\n    &[data-size=\"sm\"] { font-size: var(--text-size-sm); }\n    &[data-size=\"lg\"] { font-size: var(--text-size-lg); }\n    &[data-size=\"xl\"] { font-size: var(--text-size-xl); }\n    &[data-weight=\"medium\"] { font-weight: var(--text-weight-medium); }\n    &[data-weight=\"semibold\"] { font-weight: var(--text-weight-semibold); }\n    &[data-tone=\"muted\"] { color: var(--text-tone-muted); }\n    &[data-tone=\"faint\"] { color: var(--text-tone-faint); }\n    &[data-family=\"mono\"] { font-family: var(--text-font-family-mono); }\n    &[data-align=\"start\"] { text-align: start; }\n    &[data-align=\"center\"] { text-align: center; }\n    &[data-align=\"end\"] { text-align: end; }\n\n    &[data-truncate] {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n  }\n}\n","/* Every value is a token: --empty-state-* in packages/tokens/tokens/component/empty-state.json */\n\n@layer reset, tokens, vendor, base, components, utilities;\n\n@layer components {\n  .root {\n    box-sizing: border-box;\n    padding: var(--empty-state-padding);\n  }\n\n  .text {\n    text-align: center;\n    text-wrap: balance;\n  }\n\n  .icon {\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    inline-size: var(--empty-state-icon-size);\n    block-size: var(--empty-state-icon-size);\n    border-radius: var(--empty-state-icon-radius);\n    background: var(--empty-state-icon-neutral-bg);\n    color: var(--empty-state-icon-neutral-fg);\n    font-size: var(--empty-state-icon-glyph-size);\n\n    .root[data-tone='error'] & {\n      background: var(--empty-state-icon-error-bg);\n      color: var(--empty-state-icon-error-fg);\n    }\n  }\n}\n"],"mappings":";AAEA;AAEA;AACE,GAACA;AACC,YAAQ;AACR,iBAAa,IAAI;AACjB,iBAAa,IAAI;AACjB,iBAAa,IAAI;AACjB,WAAO,IAAI;AACX,eAAW;AAEX,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAoB;AACvD,KAAC,CAAC;AAAmB,iBAAW,IAAI;AAAqB;AACzD,KAAC,CAAC;AAAqB,aAAO,IAAI;AAAuB;AAC3D;AACF;;;AClBA;AAEA;AACE,GAACC;AACC,aAAS;AACT,oBAAgB;AAChB,SAAK,IAAI;AACT,YAAQ;AACR,aAAS;AACT,gBAAY;AAEZ,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAgB,WAAK,IAAI;AAAgB;AAC3C,KAAC,CAAC;AAAsB,mBAAa;AAAY;AACjD,KAAC,CAAC;AAAuB,mBAAa;AAAQ;AAC9C,KAAC,CAAC;AAAoB,mBAAa;AAAU;AAC7C,KAAC,CAAC;AAAwB,mBAAa;AAAS;AAChD,KAAC,CAAC;AAAwB,uBAAiB;AAAY;AACvD,KAAC,CAAC;AAAyB,uBAAiB;AAAQ;AACpD,KAAC,CAAC;AAAsB,uBAAiB;AAAU;AACnD,KAAC,CAAC;AAA0B,uBAAiB;AAAe;AAC9D;AACF;;;AC5BA;AAEA;AACE,GAACC;AACC,YAAQ;AACR,iBAAa,IAAI;AACjB,eAAW,IAAI;AACf,iBAAa,IAAI;AACjB,iBAAa,IAAI;AACjB,WAAO,IAAI;AAEX,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAiB;AACpD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAiB;AACpD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAiB;AACpD,KAAC,CAAC;AAAkB,iBAAW,IAAI;AAAiB;AACpD,KAAC,CAAC;AAAwB,mBAAa,IAAI;AAAuB;AAClE,KAAC,CAAC;AAA0B,mBAAa,IAAI;AAAyB;AACtE,KAAC,CAAC;AAAqB,aAAO,IAAI;AAAoB;AACtD,KAAC,CAAC;AAAqB,aAAO,IAAI;AAAoB;AACtD,KAAC,CAAC;AAAsB,mBAAa,IAAI;AAA0B;AACnE,KAAC,CAAC;AAAsB,kBAAY;AAAO;AAC3C,KAAC,CAAC;AAAuB,kBAAY;AAAQ;AAC7C,KAAC,CAAC;AAAoB,kBAAY;AAAK;AAEvC,KAAC,CAAC;AACA,gBAAU;AACV,qBAAe;AACf,mBAAa;AACf;AACF;AACF;;;AC9BA;AAEA;AACE,GAACC;AACC,gBAAY;AACZ,aAAS,IAAI;AACf;AAEA,GAACC;AACC,gBAAY;AACZ,eAAW;AACb;AAEA,GAACC;AACC,aAAS;AACT,UAAM;AACN,iBAAa;AACb,qBAAiB;AACjB,iBAAa,IAAI;AACjB,gBAAY,IAAI;AAChB,mBAAe,IAAI;AACnB,gBAAY,IAAI;AAChB,WAAO,IAAI;AACX,eAAW,IAAI;AAEf,KAtBDF,eAsBM,CAAC,iBAAmB;AACvB,kBAAY,IAAI;AAChB,aAAO,IAAI;AACb;AACF;AACF;","names":["heading","stack","text","root","text","icon"]}

package/dist/empty-state.d.ts

@@ -0,0 +1,40 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode, Ref } from 'react';
+import { HeadingLevel } from './heading.js';
+
+type EmptyStateTone = 'neutral' | 'error';
+interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    /** What is missing, or what went wrong, in a few words. Rendered as a heading. */
+    title: ReactNode;
+    /** One or two sentences: why it is empty and what to do about it. */
+    description?: ReactNode;
+    /** A glyph, shown in a tinted disc. Decorative: the title carries the meaning. */
+    icon?: ReactNode;
+    /** One control: a Button, or a Link. For an error, the retry. */
+    action?: ReactNode;
+    /** `error` tints the icon with the error colours. It does not announce anything: see the accessibility notes. @default 'neutral' */
+    tone?: EmptyStateTone;
+    /** The heading's outline level, from where the empty state sits in the page. @default 3 */
+    headingLevel?: HeadingLevel;
+    ref?: Ref<HTMLDivElement>;
+}
+/**
+ * What a list, a search or a page shows instead of its content: nothing yet,
+ * nothing found, or it failed to load. An icon, a title, a sentence and one
+ * action, centred. Composes Heading, Text and Stack, so the type follows the
+ * brand without tokens of its own.
+ *
+ * @status experimental
+ * @category Feedback
+ * @accessibility The title is a real heading at `headingLevel`, so the empty region shows up in the outline; pick the level from the page, as with Heading. The icon is `aria-hidden`. Nothing is announced on its own: an empty state that is there when the page loads is just content. When it **replaces** content after the user did something (a search with no results, a failed reload), pass `role="status"` (or `role="alert"` for an error that needs attention) so it is read out; do not put `role="alert"` on one that renders with the page. The action is whatever you pass, with its own semantics.
+ * @do Say what to do next in the description, and make the action that next step.
+ * @do Use `tone="error"` with a retry action when loading failed.
+ * @dont Use it for a validation error or a transient message; that is a Field error, an Alert or a Toast.
+ * @dont Offer several actions; an empty state has one way forward.
+ */
+declare function EmptyState({ title, description, icon, action, tone, headingLevel, className, ref, ...rest }: EmptyStateProps): react.JSX.Element;
+declare namespace EmptyState {
+    var displayName: string;
+}
+
+export { EmptyState, type EmptyStateProps };

package/dist/empty-state.js

@@ -0,0 +1,7 @@
+export { EmptyState } from './chunk-5TYCIBLW.js';
+import './chunk-2E2ESMS2.js';
+import './chunk-F3S5BHX2.js';
+import './chunk-LKWZZIRZ.js';
+import './chunk-MI4QUKQS.js';
+//# sourceMappingURL=empty-state.js.map
+//# sourceMappingURL=empty-state.js.map

package/dist/empty-state.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"empty-state.js"}

package/dist/field.js

@@ -1,5 +1,5 @@
-export { Field, useField } from './chunk-M5VL22MY.js';
-import './chunk-ZVDN3GRI.js';
+"use client";export { Field, useField } from './chunk-SXMORGSG.js';
+import './chunk-QJG5ILK5.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=field.js.map
 //# sourceMappingURL=field.js.map

package/dist/icon-button.css

@@ -160,6 +160,24 @@
       }
     }
   }
+  .Button_button[data-tone=danger] {
+    &[data-variant=primary] {
+      background-color: var(--button-danger-bg);
+      color: var(--button-danger-fg);
+      &:hover:not(:disabled, [aria-disabled=true]) {
+        background-color: var(--button-danger-bg-hover);
+      }
+      &:active:not(:disabled, [aria-disabled=true]) {
+        background-color: var(--button-danger-bg-active);
+      }
+    }
+    &:is([data-variant=secondary], [data-variant=ghost]) {
+      color: var(--button-danger-text);
+      &:hover:not(:disabled, [aria-disabled=true]) {
+        background-color: var(--button-danger-quiet-bg-hover);
+      }
+    }
+  }
   .Button_label {
     display: inline-block;
   }

package/dist/icon-button.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"],"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"],"mappings":"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","names":["icon","root","spinner","ring","spin","button","label","iconButton"]}
+{"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"],"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  /* tone=\"danger\", after the variants so it wins at equal specificity plus one attribute. */\n  .button[data-tone=\"danger\"] {\n    &[data-variant=\"primary\"] {\n      background-color: var(--button-danger-bg);\n      color: var(--button-danger-fg);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-danger-bg-hover);\n      }\n\n      &:active:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-danger-bg-active);\n      }\n    }\n\n    &:is([data-variant=\"secondary\"], [data-variant=\"ghost\"]) {\n      color: var(--button-danger-text);\n\n      &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n        background-color: var(--button-danger-quiet-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"],"mappings":"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","names":["icon","root","spinner","ring","spin","button","label","iconButton"]}

package/dist/icon-button.js

@@ -1,9 +1,9 @@
-export { IconButton } from './chunk-MF66ICX6.js';
-import './chunk-5TTYVQ6Q.js';
+export { IconButton } from './chunk-56RSH7GQ.js';
+import './chunk-DE67ECD7.js';
 import './chunk-ZL5MMRLG.js';
-import './chunk-ZVDN3GRI.js';
 import './chunk-IB5UUE3S.js';
 import './chunk-O5LII5XP.js';
+import './chunk-QJG5ILK5.js';
 import './chunk-MI4QUKQS.js';
 //# sourceMappingURL=icon-button.js.map
 //# sourceMappingURL=icon-button.js.map