@oddkin/components 0.0.0-stage → 1.0.0-beta.0

package/dist/button/button.js

@@ -0,0 +1,205 @@
+import { OddkinElement, event, prop } from '@oddkin/core/element';
+import { signal } from '@oddkin/core/reactive';
+import { ExternalDescriptions } from '../form-control/description.js';
+/** A toggle button was flipped by the user; `pressed` has its new value. */
+export const inputEvent = event('input', {
+    bubbles: true,
+    composed: true,
+    cancelable: false,
+    syncs: 'pressed',
+    intent: 'user',
+});
+/** A toggle button was flipped by the user (after `input`). */
+export const changeEvent = event('change', {
+    bubbles: true,
+    composed: false,
+    cancelable: false,
+    intent: 'user',
+});
+/**
+ * A button for actions. Renders a native `<button>` in its shadow root, so keyboard
+ * activation, focus, and accessible naming come from the platform.
+ *
+ * In a form it submits or resets through a temporary native button (see the limitations).
+ * Where native submit-button semantics matter, style a native `<button class="odd-button">`
+ * with `@oddkin/components/css/button.css`, which looks the same.
+ *
+ * @slot - The label. Its text is the button's accessible name.
+ * @slot start - Content before the label, such as an icon.
+ * @slot end - Content after the label.
+ * @csspart control - The native button.
+ * @csspart spinner - The loading indicator.
+ * @cssprop --odd-button-radius - Corner radius.
+ * @cssprop --odd-button-background - Background colour.
+ * @cssprop --odd-button-color - Text colour.
+ * @cssprop --odd-button-border-color - Border colour.
+ * @cssprop --odd-button-height - Minimum height (never below the target-size token).
+ * @cssprop --odd-button-padding-inline - Inline padding.
+ * @a11y The slotted text names the button. Icon-only buttons must set `label`.
+ * @a11y `loading` keeps the button focusable and sets `aria-disabled`; announce progress separately if it matters.
+ * @a11y With `toggle`, the native button reports `aria-pressed`; keep the label the same in both states ("Bold", not "Bold on").
+ * @keyboard Enter and Space activate the button (native behavior).
+ * @previewRole primaryAction
+ * @previewRole secondaryAction
+ * @useFor Triggering an action, or submitting or resetting the form it belongs to (its ancestor form or the one named by `form`).
+ * @notFor Navigation to another page; use a link.
+ * @limitation In a form, submission and reset go through a temporary native button appended to the form during the click. `SubmitEvent.submitter` is that button (with `name`, `value`, and the `form*` overrides), not this element, and it is removed after dispatch, so build `new FormData(form, event.submitter)` synchronously in the `submit` listener. Mutation observers on the form see it added and removed. `form.requestSubmit(button)` rejects this element with a `TypeError`; call `button.click()` instead.
+ * @limitation Implicit submission: Enter in a text field never uses this element as the default button. The default button is the form's first native submit button; without one, Enter submits with no submitter, and only when the form has a single text field, so this element's `name`, `value`, and overrides are not sent. Use a native submit button where Enter must submit through it.
+ * @limitation `formAction`, `formMethod`, `formEnctype`, and `formTarget` return the attribute text: unlike a native button they neither resolve URLs nor report the form's values. The temporary button receives them unchanged, so missing and invalid values behave as on a native button.
+ * @category Actions
+ * @customization 1 2 3
+ */
+export class OddkinButton extends OddkinElement.with({
+    appearance: prop.enum(['primary', 'secondary', 'ghost'], {
+        default: 'secondary',
+        reflect: true,
+        description: 'Visual emphasis.',
+    }),
+    size: prop.enum(['sm', 'md', 'lg'], { default: 'md', reflect: true, description: 'Size.' }),
+    type: prop.enum(['button', 'submit', 'reset'], {
+        default: 'button',
+        description: 'Form behavior, as on a native button.',
+    }),
+    disabled: prop.boolean({ reflect: true, description: 'Prevents interaction and focus.' }),
+    loading: prop.boolean({
+        reflect: true,
+        description: 'Shows a spinner and ignores activation; the button stays focusable.',
+    }),
+    fullWidth: prop.boolean({
+        attribute: 'full-width',
+        reflect: true,
+        description: 'Fills the inline size of its container.',
+    }),
+    toggle: prop.boolean({
+        reflect: true,
+        description: 'Keeps a pressed state that each activation flips (`aria-pressed`).',
+    }),
+    pressed: prop.boolean({
+        reflect: true,
+        description: 'Whether a `toggle` button is pressed.',
+    }),
+    name: prop.string({ default: '', description: 'Name submitted with the form.' }),
+    value: prop.string({ default: '', description: 'Value submitted with the form.' }),
+    formAction: prop.string({
+        attribute: 'formaction',
+        reflect: true,
+        description: "URL this button submits to instead of the form's `action`.",
+    }),
+    formMethod: prop.string({
+        attribute: 'formmethod',
+        reflect: true,
+        description: "Method (`get`, `post`, `dialog`) this button submits with instead of the form's.",
+    }),
+    formEnctype: prop.string({
+        attribute: 'formenctype',
+        reflect: true,
+        description: "Encoding this button submits with instead of the form's `enctype`.",
+    }),
+    formTarget: prop.string({
+        attribute: 'formtarget',
+        reflect: true,
+        description: "Navigable this button submits to instead of the form's `target`.",
+    }),
+    formNoValidate: prop.boolean({
+        attribute: 'formnovalidate',
+        reflect: true,
+        description: 'Submits without constraint validation.',
+    }),
+    label: prop.string({
+        default: '',
+        description: 'Accessible name when the content has no text (icon-only buttons).',
+    }),
+}) {
+    static formAssociated = true;
+    static shadowRootOptions = { mode: 'open', delegatesFocus: true };
+    static events = { input: inputEvent, change: changeEvent };
+    #described = new ExternalDescriptions();
+    /**
+     * @internal Another element (a tooltip) describes this button; `null` removes its text. Works
+     * before the first render and keeps the texts across renders.
+     */
+    _describe(source, text) {
+        this.#described.set(source, text);
+    }
+    /** @internal The texts other elements gave, rendered hidden by the template. */
+    get _externalDescription() {
+        return this.#described.text.value;
+    }
+    /** @internal Disabled by an ancestor `<fieldset disabled>`; read by the template. */
+    _formDisabled = signal(false);
+    /** The form this button belongs to, if any. */
+    get form() {
+        return this.internals.form;
+    }
+    connected(scope) {
+        // Capture at the host: runs before listeners the page added to this element.
+        scope.listen(this, 'click', (event) => {
+            if (this.#ignoresActivation()) {
+                event.preventDefault();
+                event.stopImmediatePropagation();
+                return;
+            }
+            if (this.toggle) {
+                // Flipped before the page's click listeners run, as a checkbox's checkedness is.
+                this.pressed = !this.pressed;
+                scope.timeout(() => {
+                    if (event.defaultPrevented)
+                        this.pressed = !this.pressed;
+                    else {
+                        this.emit(inputEvent);
+                        this.emit(changeEvent);
+                    }
+                }, 0);
+            }
+            if (this.type === 'button' || !this.internals.form)
+                return;
+            // Like a native button's activation behavior, act after dispatch unless prevented.
+            scope.timeout(() => {
+                if (!event.defaultPrevented && this.isConnected)
+                    this.#activate();
+            }, 0);
+        }, { capture: true });
+    }
+    /** Activation is ignored while `disabled`, `loading`, or inside a disabled fieldset. */
+    #ignoresActivation() {
+        return this.disabled || this.loading || this._formDisabled.value;
+    }
+    /** Native callback: an ancestor fieldset's disabled state changed. */
+    formDisabledCallback(disabled) {
+        this._formDisabled.value = disabled;
+    }
+    #activate() {
+        const form = this.internals.form;
+        if (!form)
+            return;
+        // A temporary native button carries name, value, and the submission overrides, runs
+        // constraint validation, and is the submitter the browser reports; it is removed right after.
+        const proxy = document.createElement('button');
+        proxy.type = this.type;
+        if (this.name)
+            proxy.name = this.name;
+        if (this.value)
+            proxy.value = this.value;
+        if (this.type === 'submit') {
+            const overrides = {
+                formaction: this.formAction,
+                formmethod: this.formMethod,
+                formenctype: this.formEnctype,
+                formtarget: this.formTarget,
+            };
+            for (const [attribute, value] of Object.entries(overrides))
+                if (value !== undefined)
+                    proxy.setAttribute(attribute, value);
+            proxy.formNoValidate = this.formNoValidate;
+        }
+        proxy.hidden = true;
+        form.append(proxy);
+        try {
+            proxy.click();
+        }
+        finally {
+            proxy.remove();
+        }
+    }
+}
+//# sourceMappingURL=button.js.map

package/dist/button/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"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"}

package/dist/button/button.native.styles.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The native-`<button>` styling path: `<button class="odd-button">` looks like `odd-button`, for
+ * forms that need native submit-button semantics (the button is the submitter and can be the
+ * default button for Enter). `data-appearance` (`primary`, `secondary`, `ghost`; default
+ * secondary), `data-size` (`sm`, `md`, `lg`; default md), and `data-full-width` mirror the
+ * element's attributes, and `aria-pressed` draws a pressed toggle; the same `--odd-button-*`
+ * variables apply. Published as
+ * `@oddkin/components/css/button.css` in the `odd.components` layer; kept equal to the element's
+ * computed styles by `styling.browser.test.ts`. No loading state: use `aria-disabled` and your
+ * own progress text.
+ */
+export declare const nativeButtonStyles: import("@oddkin/core/styles").CSSResult;
+//# sourceMappingURL=button.native.styles.d.ts.map

package/dist/button/button.native.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.native.styles.d.ts","sourceRoot":"","sources":["../../src/button/button.native.styles.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AACH,eAAO,MAAM,kBAAkB,yCA8G9B,CAAC"}

package/dist/button/button.native.styles.js

@@ -0,0 +1,125 @@
+import { css } from '@oddkin/core/styles';
+import { token } from '@oddkin/tokens/refs';
+/**
+ * The native-`<button>` styling path: `<button class="odd-button">` looks like `odd-button`, for
+ * forms that need native submit-button semantics (the button is the submitter and can be the
+ * default button for Enter). `data-appearance` (`primary`, `secondary`, `ghost`; default
+ * secondary), `data-size` (`sm`, `md`, `lg`; default md), and `data-full-width` mirror the
+ * element's attributes, and `aria-pressed` draws a pressed toggle; the same `--odd-button-*`
+ * variables apply. Published as
+ * `@oddkin/components/css/button.css` in the `odd.components` layer; kept equal to the element's
+ * computed styles by `styling.browser.test.ts`. No loading state: use `aria-disabled` and your
+ * own progress text.
+ */
+export const nativeButtonStyles = css `
+  .odd-button {
+    box-sizing: border-box;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    vertical-align: middle;
+    min-block-size: max(
+      var(--odd-button-height, ${token('control.height.md')}),
+      ${token('target.min')}
+    );
+    margin: 0;
+    padding-block: ${token('space.none')};
+    padding-inline: var(--odd-button-padding-inline, ${token('control.padding.inline.md')});
+    gap: ${token('control.gap')};
+    border: ${token('border.width.default')} solid
+      var(--odd-button-border-color, ${token('color.border.strong')});
+    border-radius: var(--odd-button-radius, ${token('control.radius')});
+    background: var(--odd-button-background, ${token('color.surface.default')});
+    color: var(--odd-button-color, ${token('color.text.primary')});
+    font: inherit;
+    font-family: ${token('type.ui.family')};
+    font-size: ${token('type.ui.size')};
+    font-weight: ${token('type.ui.weight')};
+    line-height: ${token('type.ui.line-height')};
+    letter-spacing: ${token('type.ui.letter-spacing')};
+    text-align: center;
+    overflow-wrap: anywhere;
+    cursor: pointer;
+    transition-property: background-color, border-color, color;
+    transition-duration: ${token('motion.duration.fast')};
+    transition-timing-function: ${token('motion.easing.standard')};
+  }
+  .odd-button[data-size='sm'] {
+    min-block-size: max(
+      var(--odd-button-height, ${token('control.height.sm')}),
+      ${token('target.min')}
+    );
+    padding-inline: var(--odd-button-padding-inline, ${token('control.padding.inline.sm')});
+  }
+  .odd-button[data-size='lg'] {
+    min-block-size: max(
+      var(--odd-button-height, ${token('control.height.lg')}),
+      ${token('target.min')}
+    );
+    padding-inline: var(--odd-button-padding-inline, ${token('control.padding.inline.lg')});
+    font-size: ${token('type.body.size')};
+  }
+  .odd-button[data-full-width] {
+    inline-size: 100%;
+  }
+  .odd-button[data-appearance='primary'] {
+    border-color: var(--odd-button-border-color, transparent);
+    background: var(--odd-button-background, ${token('color.action.default')});
+    color: var(--odd-button-color, ${token('color.text.on-action')});
+  }
+  .odd-button[data-appearance='ghost'] {
+    border-color: var(--odd-button-border-color, transparent);
+    background: var(--odd-button-background, transparent);
+  }
+  @media (hover: hover) {
+    .odd-button[data-appearance='primary']:hover:enabled:not([aria-disabled='true']) {
+      background: var(--odd-button-background, ${token('color.action.hover')});
+    }
+    .odd-button:not([data-appearance='primary']):hover:enabled:not([aria-disabled='true']) {
+      background: var(--odd-button-background, ${token('color.surface.hover')});
+    }
+  }
+  .odd-button[data-appearance='primary']:active:enabled:not([aria-disabled='true']) {
+    background: var(--odd-button-background, ${token('color.action.pressed')});
+  }
+  .odd-button:not([data-appearance='primary']):active:enabled:not([aria-disabled='true']) {
+    background: var(--odd-button-background, ${token('color.surface.sunken')});
+  }
+  .odd-button:disabled {
+    border-color: transparent;
+    background: ${token('color.surface.sunken')};
+    color: ${token('color.text.disabled')};
+  }
+  .odd-button:disabled,
+  .odd-button[aria-disabled='true'] {
+    cursor: not-allowed;
+  }
+  /* The pressed state twice: as specific as the hover and active rules, and later. */
+  .odd-button[aria-pressed='true'][aria-pressed='true']:enabled:not([aria-disabled='true']) {
+    border-color: transparent;
+    background: ${token('color.selection.background')};
+    color: ${token('color.selection.foreground')};
+  }
+  .odd-button[aria-pressed='true']:disabled {
+    background: ${token('color.selection.background')};
+  }
+  .odd-button:focus-visible {
+    outline: ${token('focus.width')} solid ${token('color.focus.ring')};
+    outline-offset: ${token('focus.offset')};
+  }
+  @media (forced-colors: active) {
+    .odd-button {
+      border: 1px solid ButtonText;
+    }
+    .odd-button:disabled {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .odd-button[aria-pressed='true'][aria-pressed='true']:enabled:not([aria-disabled='true']) {
+      border-color: Highlight;
+      background: Highlight;
+      color: HighlightText;
+    }
+  }
+`;
+//# sourceMappingURL=button.native.styles.js.map

package/dist/button/button.native.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.native.styles.js","sourceRoot":"","sources":["../../src/button/button.native.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAE5C;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,CAAA;;;;;;;;iCAQJ,KAAK,CAAC,mBAAmB,CAAC;QACnD,KAAK,CAAC,YAAY,CAAC;;;qBAGN,KAAK,CAAC,YAAY,CAAC;uDACe,KAAK,CAAC,2BAA2B,CAAC;WAC9E,KAAK,CAAC,aAAa,CAAC;cACjB,KAAK,CAAC,sBAAsB,CAAC;uCACJ,KAAK,CAAC,qBAAqB,CAAC;8CACrB,KAAK,CAAC,gBAAgB,CAAC;+CACtB,KAAK,CAAC,uBAAuB,CAAC;qCACxC,KAAK,CAAC,oBAAoB,CAAC;;mBAE7C,KAAK,CAAC,gBAAgB,CAAC;iBACzB,KAAK,CAAC,cAAc,CAAC;mBACnB,KAAK,CAAC,gBAAgB,CAAC;mBACvB,KAAK,CAAC,qBAAqB,CAAC;sBACzB,KAAK,CAAC,wBAAwB,CAAC;;;;;2BAK1B,KAAK,CAAC,sBAAsB,CAAC;kCACtB,KAAK,CAAC,wBAAwB,CAAC;;;;iCAIhC,KAAK,CAAC,mBAAmB,CAAC;QACnD,KAAK,CAAC,YAAY,CAAC;;uDAE4B,KAAK,CAAC,2BAA2B,CAAC;;;;iCAIxD,KAAK,CAAC,mBAAmB,CAAC;QACnD,KAAK,CAAC,YAAY,CAAC;;uDAE4B,KAAK,CAAC,2BAA2B,CAAC;iBACxE,KAAK,CAAC,gBAAgB,CAAC;;;;;;;+CAOO,KAAK,CAAC,sBAAsB,CAAC;qCACvC,KAAK,CAAC,sBAAsB,CAAC;;;;;;;;iDAQjB,KAAK,CAAC,oBAAoB,CAAC;;;iDAG3B,KAAK,CAAC,qBAAqB,CAAC;;;;+CAI9B,KAAK,CAAC,sBAAsB,CAAC;;;+CAG7B,KAAK,CAAC,sBAAsB,CAAC;;;;kBAI1D,KAAK,CAAC,sBAAsB,CAAC;aAClC,KAAK,CAAC,qBAAqB,CAAC;;;;;;;;;kBASvB,KAAK,CAAC,4BAA4B,CAAC;aACxC,KAAK,CAAC,4BAA4B,CAAC;;;kBAG9B,KAAK,CAAC,4BAA4B,CAAC;;;eAGtC,KAAK,CAAC,aAAa,CAAC,UAAU,KAAK,CAAC,kBAAkB,CAAC;sBAChD,KAAK,CAAC,cAAc,CAAC;;;;;;;;;;;;;;;;CAgB1C,CAAC"}

package/dist/button/button.structural.styles.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Styles the button's layout and interaction depend on: host display, full width, content
+ * alignment, and forced-colors borders (the loading indicator is `spinnerStyles`). No brand or
+ * visual tokens. Keep these (after `hostStyles`) when replacing the visual styles; they do not make
+ * arbitrary overrides safe.
+ */
+export declare const buttonStructuralStyles: import("@oddkin/core/styles").CSSResult;
+//# sourceMappingURL=button.structural.styles.d.ts.map

package/dist/button/button.structural.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.structural.styles.d.ts","sourceRoot":"","sources":["../../src/button/button.structural.styles.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB,yCAmDlC,CAAC"}

package/dist/button/button.structural.styles.js

@@ -0,0 +1,60 @@
+import { css } from '@oddkin/core/styles';
+/**
+ * Styles the button's layout and interaction depend on: host display, full width, content
+ * alignment, and forced-colors borders (the loading indicator is `spinnerStyles`). No brand or
+ * visual tokens. Keep these (after `hostStyles`) when replacing the visual styles; they do not make
+ * arbitrary overrides safe.
+ */
+export const buttonStructuralStyles = css `
+  :host {
+    display: inline-block;
+    vertical-align: middle;
+  }
+  :host([full-width]) {
+    display: block;
+  }
+  button {
+    box-sizing: border-box;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    inline-size: auto;
+    margin: 0;
+    font: inherit;
+    color: inherit;
+    text-align: center;
+    cursor: pointer;
+  }
+  :host([full-width]) button {
+    inline-size: 100%;
+  }
+  button:disabled,
+  button[aria-disabled='true'] {
+    cursor: not-allowed;
+  }
+  .label {
+    display: inline-flex;
+    align-items: center;
+    min-inline-size: 0;
+    /* Long unbroken labels (URLs, compound words, translations) wrap instead of overflowing. */
+    overflow-wrap: anywhere;
+  }
+  @media (forced-colors: active) {
+    button {
+      border: 1px solid ButtonText;
+    }
+    button:disabled {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    /* The pressed state twice: one attribute more than the skin's pressed rule, so the system
+       colours win. */
+    :host([toggle])
+      button[aria-pressed='true'][aria-pressed='true']:enabled:not([aria-disabled='true']) {
+      border-color: Highlight;
+      background: Highlight;
+      color: HighlightText;
+    }
+  }
+`;
+//# sourceMappingURL=button.structural.styles.js.map

package/dist/button/button.structural.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.structural.styles.js","sourceRoot":"","sources":["../../src/button/button.structural.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C;;;;;GAKG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmDxC,CAAC"}

package/dist/button/button.styles.d.ts

@@ -0,0 +1,3 @@
+/** Oddkin's default visual styles: semantic tokens through documented component variables. */
+export declare const buttonStyles: import("@oddkin/core/styles").CSSResult;
+//# sourceMappingURL=button.styles.d.ts.map

package/dist/button/button.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.d.ts","sourceRoot":"","sources":["../../src/button/button.styles.ts"],"names":[],"mappings":"AAGA,8FAA8F;AAC9F,eAAO,MAAM,YAAY,yCAiFxB,CAAC"}

package/dist/button/button.styles.js

@@ -0,0 +1,86 @@
+import { css } from '@oddkin/core/styles';
+import { token } from '@oddkin/tokens/refs';
+/** Oddkin's default visual styles: semantic tokens through documented component variables. */
+export const buttonStyles = css `
+  button {
+    min-block-size: max(
+      var(--odd-button-height, ${token('control.height.md')}),
+      ${token('target.min')}
+    );
+    padding-block: ${token('space.none')};
+    padding-inline: var(--odd-button-padding-inline, ${token('control.padding.inline.md')});
+    gap: ${token('control.gap')};
+    border: ${token('border.width.default')} solid var(--odd-button-border-color, transparent);
+    border-radius: var(--odd-button-radius, ${token('control.radius')});
+    background: var(--odd-button-background, ${token('color.surface.raised')});
+    color: var(--odd-button-color, ${token('color.text.primary')});
+    font-family: ${token('type.ui.family')};
+    font-size: ${token('type.ui.size')};
+    font-weight: ${token('type.ui.weight')};
+    line-height: ${token('type.ui.line-height')};
+    letter-spacing: ${token('type.ui.letter-spacing')};
+    transition-property: background-color, border-color, color;
+    transition-duration: ${token('motion.duration.fast')};
+    transition-timing-function: ${token('motion.easing.standard')};
+  }
+  :host([size='sm']) button {
+    min-block-size: max(
+      var(--odd-button-height, ${token('control.height.sm')}),
+      ${token('target.min')}
+    );
+    padding-inline: var(--odd-button-padding-inline, ${token('control.padding.inline.sm')});
+  }
+  :host([size='lg']) button {
+    min-block-size: max(
+      var(--odd-button-height, ${token('control.height.lg')}),
+      ${token('target.min')}
+    );
+    padding-inline: var(--odd-button-padding-inline, ${token('control.padding.inline.lg')});
+    font-size: ${token('type.body.size')};
+  }
+  :host([appearance='primary']) button {
+    background: var(--odd-button-background, ${token('color.action.default')});
+    color: var(--odd-button-color, ${token('color.text.on-action')});
+  }
+  /* Hover feedback only where the primary pointer can hover, so taps leave no sticky state. */
+  @media (hover: hover) {
+    :host([appearance='primary']) button:hover:enabled:not([aria-disabled='true']) {
+      background: var(--odd-button-background, ${token('color.action.hover')});
+    }
+    :host([appearance='secondary']) button:hover:enabled:not([aria-disabled='true']),
+    :host([appearance='ghost']) button:hover:enabled:not([aria-disabled='true']) {
+      background: var(--odd-button-background, ${token('color.surface.hover')});
+    }
+  }
+  :host([appearance='primary']) button:active:enabled:not([aria-disabled='true']) {
+    background: var(--odd-button-background, ${token('color.action.pressed')});
+  }
+  :host([appearance='secondary']) button:active:enabled:not([aria-disabled='true']),
+  :host([appearance='ghost']) button:active:enabled:not([aria-disabled='true']) {
+    background: var(--odd-button-background, ${token('color.surface.sunken')});
+  }
+  :host([appearance='secondary']) button {
+    border-color: var(--odd-button-border-color, ${token('color.border.strong')});
+    background: var(--odd-button-background, ${token('color.surface.default')});
+  }
+  :host([appearance='ghost']) button {
+    background: var(--odd-button-background, transparent);
+  }
+  /* :host matches the appearance rules' specificity. */
+  :host button:disabled {
+    border-color: transparent;
+    background: ${token('color.surface.sunken')};
+    color: ${token('color.text.disabled')};
+  }
+  /* A pressed toggle (Figma toggleButton On) takes the selection colours in every appearance. As
+     specific as the hover and active rules, and later, so they leave it unchanged. */
+  :host([toggle]) button[aria-pressed='true']:enabled:not([aria-disabled='true']) {
+    border-color: transparent;
+    background: ${token('color.selection.background')};
+    color: ${token('color.selection.foreground')};
+  }
+  :host([toggle]) button[aria-pressed='true']:disabled {
+    background: ${token('color.selection.background')};
+  }
+`;
+//# sourceMappingURL=button.styles.js.map

package/dist/button/button.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.js","sourceRoot":"","sources":["../../src/button/button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAE5C,8FAA8F;AAC9F,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;iCAGE,KAAK,CAAC,mBAAmB,CAAC;QACnD,KAAK,CAAC,YAAY,CAAC;;qBAEN,KAAK,CAAC,YAAY,CAAC;uDACe,KAAK,CAAC,2BAA2B,CAAC;WAC9E,KAAK,CAAC,aAAa,CAAC;cACjB,KAAK,CAAC,sBAAsB,CAAC;8CACG,KAAK,CAAC,gBAAgB,CAAC;+CACtB,KAAK,CAAC,sBAAsB,CAAC;qCACvC,KAAK,CAAC,oBAAoB,CAAC;mBAC7C,KAAK,CAAC,gBAAgB,CAAC;iBACzB,KAAK,CAAC,cAAc,CAAC;mBACnB,KAAK,CAAC,gBAAgB,CAAC;mBACvB,KAAK,CAAC,qBAAqB,CAAC;sBACzB,KAAK,CAAC,wBAAwB,CAAC;;2BAE1B,KAAK,CAAC,sBAAsB,CAAC;kCACtB,KAAK,CAAC,wBAAwB,CAAC;;;;iCAIhC,KAAK,CAAC,mBAAmB,CAAC;QACnD,KAAK,CAAC,YAAY,CAAC;;uDAE4B,KAAK,CAAC,2BAA2B,CAAC;;;;iCAIxD,KAAK,CAAC,mBAAmB,CAAC;QACnD,KAAK,CAAC,YAAY,CAAC;;uDAE4B,KAAK,CAAC,2BAA2B,CAAC;iBACxE,KAAK,CAAC,gBAAgB,CAAC;;;+CAGO,KAAK,CAAC,sBAAsB,CAAC;qCACvC,KAAK,CAAC,sBAAsB,CAAC;;;;;iDAKjB,KAAK,CAAC,oBAAoB,CAAC;;;;iDAI3B,KAAK,CAAC,qBAAqB,CAAC;;;;+CAI9B,KAAK,CAAC,sBAAsB,CAAC;;;;+CAI7B,KAAK,CAAC,sBAAsB,CAAC;;;mDAGzB,KAAK,CAAC,qBAAqB,CAAC;+CAChC,KAAK,CAAC,uBAAuB,CAAC;;;;;;;;kBAQ3D,KAAK,CAAC,sBAAsB,CAAC;aAClC,KAAK,CAAC,qBAAqB,CAAC;;;;;;kBAMvB,KAAK,CAAC,4BAA4B,CAAC;aACxC,KAAK,CAAC,4BAA4B,CAAC;;;kBAG9B,KAAK,CAAC,4BAA4B,CAAC;;CAEpD,CAAC"}

package/dist/button/button.template.d.ts

@@ -0,0 +1,8 @@
+import type { OddkinButton } from './button.js';
+/**
+ * Anatomy: a native `<button part="control">` (focus target, keyboard activation, accessible
+ * name from the default slot or `label`), a `part="spinner"` shown while loading, and
+ * `start`, default, and `end` slots. Alternative templates must keep these relationships.
+ */
+export declare const buttonTemplate: (button: OddkinButton) => import("@oddkin/core/template").TemplateResult;
+//# sourceMappingURL=button.template.d.ts.map

package/dist/button/button.template.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.template.d.ts","sourceRoot":"","sources":["../../src/button/button.template.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD;;;;GAIG;AACH,eAAO,MAAM,cAAc,WAAY,YAAY,mDAea,CAAC"}

package/dist/button/button.template.js

@@ -0,0 +1,23 @@
+import { html } from '@oddkin/core/template';
+import { externalDescriptionTemplate } from '../form-control/description.js';
+/**
+ * Anatomy: a native `<button part="control">` (focus target, keyboard activation, accessible
+ * name from the default slot or `label`), a `part="spinner"` shown while loading, and
+ * `start`, default, and `end` slots. Alternative templates must keep these relationships.
+ */
+export const buttonTemplate = (button) => html `<button
+      part="control"
+      type="button"
+      ?disabled=${button.disabled || button._formDisabled.value}
+      aria-disabled=${button.loading ? 'true' : null}
+      aria-label=${button.label || null}
+      aria-pressed=${button.toggle ? String(button.pressed) : null}
+      aria-describedby=${button._externalDescription ? 'external-description' : null}
+    >
+      <span part="spinner" class="spinner" aria-hidden="true" ?hidden=${!button.loading}></span>
+      <slot name="start"></slot>
+      <span class="label"><slot></slot></span>
+      <slot name="end"></slot>
+    </button>
+    ${externalDescriptionTemplate(button._externalDescription)}`;
+//# sourceMappingURL=button.template.js.map

package/dist/button/button.template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.template.js","sourceRoot":"","sources":["../../src/button/button.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAC;AAG7E;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,MAAoB,EAAE,EAAE,CACrD,IAAI,CAAA;;;kBAGY,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,aAAa,CAAC,KAAK;sBACzC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI;mBACjC,MAAM,CAAC,KAAK,IAAI,IAAI;qBAClB,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;yBACzC,MAAM,CAAC,oBAAoB,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,IAAI;;wEAEZ,CAAC,MAAM,CAAC,OAAO;;;;;MAKjF,2BAA2B,CAAC,MAAM,CAAC,oBAAoB,CAAC,EAAE,CAAC"}

package/dist/button/foundation.d.ts

@@ -0,0 +1,6 @@
+export { hostStyles } from '../styles/host.styles.js';
+export { spinnerStyles } from '../styles/spinner.styles.js';
+export { OddkinButton, inputEvent, changeEvent } from './button.js';
+export { buttonTemplate } from './button.template.js';
+export { buttonStructuralStyles } from './button.structural.styles.js';
+//# sourceMappingURL=foundation.d.ts.map

package/dist/button/foundation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"foundation.d.ts","sourceRoot":"","sources":["../../src/button/foundation.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/button/foundation.js

@@ -0,0 +1,8 @@
+// Skin-free foundation: behavior, anatomy, and structural styles (shared host defaults first).
+// Loads no default visual styles and registers nothing (multi-product.md §4).
+export { hostStyles } from '../styles/host.styles.js';
+export { spinnerStyles } from '../styles/spinner.styles.js';
+export { OddkinButton, inputEvent, changeEvent } from './button.js';
+export { buttonTemplate } from './button.template.js';
+export { buttonStructuralStyles } from './button.structural.styles.js';
+//# sourceMappingURL=foundation.js.map

package/dist/button/foundation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"foundation.js","sourceRoot":"","sources":["../../src/button/foundation.ts"],"names":[],"mappings":"AAAA,+FAA+F;AAC/F,8EAA8E;AAC9E,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/button/index.d.ts

@@ -0,0 +1,6 @@
+export { OddkinButton, inputEvent, changeEvent } from './button.js';
+export { buttonTemplate } from './button.template.js';
+export { buttonStructuralStyles } from './button.structural.styles.js';
+export { buttonStyles } from './button.styles.js';
+export { buttonDefinition } from './button.definition.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/button/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/button/index.js

@@ -0,0 +1,7 @@
+// Side-effect free. Register with `@oddkin/components/define/button`.
+export { OddkinButton, inputEvent, changeEvent } from './button.js';
+export { buttonTemplate } from './button.template.js';
+export { buttonStructuralStyles } from './button.structural.styles.js';
+export { buttonStyles } from './button.styles.js';
+export { buttonDefinition } from './button.definition.js';
+//# sourceMappingURL=index.js.map

package/dist/button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/button/index.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC"}