@ttoss/fsl-ui 0.2.4

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024, Terezinha Tech Operations (ttoss)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,76 @@
+# @ttoss/fsl-ui
+
+Semantic, token-native component library for ttoss. Built on [React Aria Components](https://react-spectrum.adobe.com/react-aria/) with `@ttoss/fsl-theme` tokens.
+
+Components are not visual variants of widgets — they are executable expressions of the [FSL](https://ttoss.dev/docs/design/design-system/fsl) semantic model. A component's identity (`Entity`, `Structure`, `Composition`, `Consequence`) determines which tokens it may consume.
+
+## Install
+
+```bash
+pnpm add @ttoss/fsl-ui @ttoss/fsl-theme react-aria-components
+```
+
+Peer dependencies: `react >= 18`, `react-dom >= 18`. The package is ESM-only, ships `sideEffects: false`, and tree-shakes: a Button-only import costs ≈ 1.8 KB minified before shared dependencies (React Aria Components is the dominant cost and is shared across every component you use).
+
+## Quickstart
+
+Components read CSS-variable tokens, so the theme must be mounted once at the root:
+
+```tsx
+import { createTheme } from '@ttoss/fsl-theme';
+import { ThemeProvider } from '@ttoss/fsl-theme/react';
+import { Button } from '@ttoss/fsl-ui';
+
+const theme = createTheme(); // base theme + dark alternate
+
+export const App = () => {
+  return (
+    <ThemeProvider theme={theme} defaultMode="system">
+      <Button
+        evaluation="primary"
+        onPress={() => {
+          console.log('pressed');
+        }}
+      >
+        Save
+      </Button>
+    </ThemeProvider>
+  );
+};
+```
+
+Three props carry the semantic model everywhere:
+
+- `evaluation` — authorial emphasis (`primary`, `muted`, `negative`, …). Data-entry components (`TextField`, `Select`, `Checkbox`, …) intentionally have none: validation is the runtime `isInvalid` state, never a color prop.
+- `consequence` — effect on state (`neutral`, `committing`, `destructive`). It drives mechanism: a `destructive` `ConfirmationDialog` requires a two-click armed confirmation.
+- `composition` — the slot an element plays inside a parent (`primaryAction`, `dismissAction`, …). `DialogActions` reorders its children by it per platform convention.
+
+Flow-critical labels are required props with no English defaults — `ConfirmationDialog` and `WizardNavigation` force the caller to supply localized copy (see `CONTRIBUTING.md` §6).
+
+## Customization
+
+Composites accept no `style`/`className`. Geometry the host legitimately owns is exposed as `--fsl-*` CSS custom properties with built-in fallbacks:
+
+```css
+[data-scope='dialog'] {
+  --fsl-dialog-max-width: 720px;
+}
+```
+
+The registered knobs and the full policy live in `src/tokens/CONTRACT.md` §7.
+
+Icons are internal: components render glyphs through a semantic layer over the [Iconify](https://iconify.design/) provider (default set: Lucide), registered offline (no runtime network fetch). There is no public `Icon` export yet — see CONTRIBUTING ADR-005.
+
+## AI-first surface
+
+The published tarball ships the machine-readable ground truth:
+
+- **`llms.txt`** — distilled contract: semantic model, component catalog, Entity → token map, state cascade, integration rules.
+- **`src/tokens/CONTRACT.md`** — the full Layer-2 authoring contract. Given an `Entity`, it specifies the exact `vars.*` paths, state cascade, and `data-*` conventions a component must use.
+
+## Contributing
+
+- **`src/semantics/taxonomy.ts`** — the FSL vocabulary and legality matrices.
+- **`CONTRIBUTING.md`** — how to add components, entities, and taxonomy terms; hard rules; package ADRs.
+
+Contract tests auto-discover every `*Meta` export from `src/index.ts` and validate it against the taxonomy + token hygiene rules. No manual registry. `pnpm run verify:treeshake` proves the barrel still tree-shakes.

package/dist/_virtual/_rolldown/runtime.cjs

@@ -0,0 +1,30 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+//#region \0rolldown/runtime.js
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+      key = keys[i];
+      if (!__hasOwnProp.call(to, key) && key !== except) {
+        __defProp(to, key, {
+          get: (k => from[k]).bind(null, key),
+          enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+        });
+      }
+    }
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+
+//#endregion
+
+exports.__toESM = __toESM;

package/dist/components/Breadcrumbs/Breadcrumbs.cjs

@@ -0,0 +1,129 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+const require_focusRing = require('../../tokens/focusRing.cjs');
+const require_resolveInteractiveStyle = require('../../tokens/resolveInteractiveStyle.cjs');
+let _ttoss_fsl_theme_vars = require("@ttoss/fsl-theme/vars");
+let react_aria_components = require("react-aria-components");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/Breadcrumbs/Breadcrumbs.tsx
+/** Formal semantic identity — Breadcrumbs root (Navigation entity, trail). */
+var breadcrumbsMeta = {
+  displayName: "Breadcrumbs",
+  entity: "Navigation",
+  structure: "root"
+};
+/** Formal semantic identity — Breadcrumb item (Navigation entity). */
+var breadcrumbMeta = {
+  displayName: "Breadcrumb",
+  entity: "Navigation",
+  structure: "item"
+};
+/**
+* A breadcrumb trail (Navigation entity). Renders an ordered list of
+* `Breadcrumb` items; React Aria marks the last as the current location.
+*
+* @example
+* ```tsx
+* <Breadcrumbs>
+*   <Breadcrumb href="/">Home</Breadcrumb>
+*   <Breadcrumb href="/reports">Reports</Breadcrumb>
+*   <Breadcrumb>Q3</Breadcrumb>
+* </Breadcrumbs>
+* ```
+*/
+var Breadcrumbs = props => {
+  return /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_aria_components.Breadcrumbs, {
+    ...props,
+    "data-scope": "breadcrumbs",
+    "data-part": "root",
+    style: {
+      boxSizing: "border-box",
+      display: "flex",
+      flexWrap: "wrap",
+      alignItems: "center",
+      gap: _ttoss_fsl_theme_vars.vars.spacing.gap.inline.sm,
+      margin: 0,
+      padding: 0,
+      listStyle: "none"
+    }
+  });
+};
+Breadcrumbs.displayName = breadcrumbsMeta.displayName;
+/**
+* One crumb in a `Breadcrumbs` trail. Renders a navigation link, except the
+* current (last) crumb which renders as text in the `current` color and is
+* followed by no separator.
+*/
+var Breadcrumb = ({
+  href,
+  children,
+  ...props
+}) => {
+  const colors = _ttoss_fsl_theme_vars.vars.colors.navigation.primary;
+  return /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_aria_components.Breadcrumb, {
+    ...props,
+    "data-scope": "breadcrumbs",
+    "data-part": "item",
+    children: ({
+      isCurrent
+    }) => {
+      return /* @__PURE__ */(0, react_jsx_runtime.jsxs)("span", {
+        style: {
+          boxSizing: "border-box",
+          display: "inline-flex",
+          alignItems: "center",
+          gap: _ttoss_fsl_theme_vars.vars.spacing.gap.inline.sm
+        },
+        children: [isCurrent ? /* @__PURE__ */(0, react_jsx_runtime.jsx)("span", {
+          "data-scope": "breadcrumbs",
+          "data-part": "control",
+          "aria-current": "page",
+          style: {
+            ..._ttoss_fsl_theme_vars.vars.text.label.md,
+            color: colors?.text?.current ?? colors?.text?.default
+          },
+          children
+        }) : /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_aria_components.Link, {
+          href,
+          "data-scope": "breadcrumbs",
+          "data-part": "control",
+          style: ({
+            isHovered,
+            isPressed,
+            isDisabled,
+            isFocusVisible
+          }) => {
+            return {
+              boxSizing: "border-box",
+              cursor: "pointer",
+              borderRadius: _ttoss_fsl_theme_vars.vars.radii.control,
+              textDecoration: isHovered ? "underline" : "none",
+              ..._ttoss_fsl_theme_vars.vars.text.label.md,
+              color: require_resolveInteractiveStyle.resolveInteractiveStyle(colors?.text, {
+                isHovered,
+                isPressed,
+                isDisabled
+              }),
+              outline: require_focusRing.focusRingOutline(isFocusVisible)
+            };
+          },
+          children
+        }), !isCurrent && /* @__PURE__ */(0, react_jsx_runtime.jsx)("span", {
+          "aria-hidden": true,
+          style: {
+            color: colors?.text?.default,
+            userSelect: "none"
+          },
+          children: "/"
+        })]
+      });
+    }
+  });
+};
+Breadcrumb.displayName = breadcrumbMeta.displayName;
+
+//#endregion
+exports.Breadcrumb = Breadcrumb;
+exports.Breadcrumbs = Breadcrumbs;
+exports.breadcrumbMeta = breadcrumbMeta;
+exports.breadcrumbsMeta = breadcrumbsMeta;

package/dist/components/Breadcrumbs/Breadcrumbs.d.cts

@@ -0,0 +1,61 @@
+
+import * as React from "react";
+import { BreadcrumbProps, BreadcrumbsProps } from "react-aria-components";
+
+//#region src/components/Breadcrumbs/Breadcrumbs.d.ts
+/** Formal semantic identity — Breadcrumbs root (Navigation entity, trail). */
+declare const breadcrumbsMeta: {
+  readonly displayName: "Breadcrumbs";
+  readonly entity: "Navigation";
+  readonly structure: "root";
+};
+/** Formal semantic identity — Breadcrumb item (Navigation entity). */
+declare const breadcrumbMeta: {
+  readonly displayName: "Breadcrumb";
+  readonly entity: "Navigation";
+  readonly structure: "item";
+};
+/** Props for the Breadcrumbs container. */
+type BreadcrumbsProps$1<T extends object = object> = Omit<BreadcrumbsProps<T>, 'style'>;
+/**
+ * A breadcrumb trail (Navigation entity). Renders an ordered list of
+ * `Breadcrumb` items; React Aria marks the last as the current location.
+ *
+ * @example
+ * ```tsx
+ * <Breadcrumbs>
+ *   <Breadcrumb href="/">Home</Breadcrumb>
+ *   <Breadcrumb href="/reports">Reports</Breadcrumb>
+ *   <Breadcrumb>Q3</Breadcrumb>
+ * </Breadcrumbs>
+ * ```
+ */
+declare const Breadcrumbs: {
+  <T extends object = object>(props: BreadcrumbsProps$1<T>): import("react/jsx-runtime").JSX.Element;
+  displayName: "Breadcrumbs";
+};
+/** Props for a single Breadcrumb item. */
+interface BreadcrumbProps$1 extends Omit<BreadcrumbProps, 'style'> {
+  /**
+   * Destination for this crumb. Omit on the final (current) crumb — the
+   * current location is rendered as text, not a link.
+   */
+  href?: string;
+  /** The crumb's visible label. */
+  children?: React.ReactNode;
+}
+/**
+ * One crumb in a `Breadcrumbs` trail. Renders a navigation link, except the
+ * current (last) crumb which renders as text in the `current` color and is
+ * followed by no separator.
+ */
+declare const Breadcrumb: {
+  ({
+    href,
+    children,
+    ...props
+  }: BreadcrumbProps$1): import("react/jsx-runtime").JSX.Element;
+  displayName: "Breadcrumb";
+};
+//#endregion
+export { Breadcrumb, BreadcrumbProps$1 as BreadcrumbProps, Breadcrumbs, BreadcrumbsProps$1 as BreadcrumbsProps, breadcrumbMeta, breadcrumbsMeta };

package/dist/components/Breadcrumbs/Breadcrumbs.d.mts

@@ -0,0 +1,61 @@
+
+import { BreadcrumbProps, BreadcrumbsProps } from "react-aria-components";
+import * as React from "react";
+
+//#region src/components/Breadcrumbs/Breadcrumbs.d.ts
+/** Formal semantic identity — Breadcrumbs root (Navigation entity, trail). */
+declare const breadcrumbsMeta: {
+  readonly displayName: "Breadcrumbs";
+  readonly entity: "Navigation";
+  readonly structure: "root";
+};
+/** Formal semantic identity — Breadcrumb item (Navigation entity). */
+declare const breadcrumbMeta: {
+  readonly displayName: "Breadcrumb";
+  readonly entity: "Navigation";
+  readonly structure: "item";
+};
+/** Props for the Breadcrumbs container. */
+type BreadcrumbsProps$1<T extends object = object> = Omit<BreadcrumbsProps<T>, 'style'>;
+/**
+ * A breadcrumb trail (Navigation entity). Renders an ordered list of
+ * `Breadcrumb` items; React Aria marks the last as the current location.
+ *
+ * @example
+ * ```tsx
+ * <Breadcrumbs>
+ *   <Breadcrumb href="/">Home</Breadcrumb>
+ *   <Breadcrumb href="/reports">Reports</Breadcrumb>
+ *   <Breadcrumb>Q3</Breadcrumb>
+ * </Breadcrumbs>
+ * ```
+ */
+declare const Breadcrumbs$1: {
+  <T extends object = object>(props: BreadcrumbsProps$1<T>): import("react/jsx-runtime").JSX.Element;
+  displayName: "Breadcrumbs";
+};
+/** Props for a single Breadcrumb item. */
+interface BreadcrumbProps$1 extends Omit<BreadcrumbProps, 'style'> {
+  /**
+   * Destination for this crumb. Omit on the final (current) crumb — the
+   * current location is rendered as text, not a link.
+   */
+  href?: string;
+  /** The crumb's visible label. */
+  children?: React.ReactNode;
+}
+/**
+ * One crumb in a `Breadcrumbs` trail. Renders a navigation link, except the
+ * current (last) crumb which renders as text in the `current` color and is
+ * followed by no separator.
+ */
+declare const Breadcrumb$1: {
+  ({
+    href,
+    children,
+    ...props
+  }: BreadcrumbProps$1): import("react/jsx-runtime").JSX.Element;
+  displayName: "Breadcrumb";
+};
+//#endregion
+export { Breadcrumb$1 as Breadcrumb, BreadcrumbProps$1 as BreadcrumbProps, Breadcrumbs$1 as Breadcrumbs, BreadcrumbsProps$1 as BreadcrumbsProps, breadcrumbMeta, breadcrumbsMeta };

package/dist/components/Breadcrumbs/Breadcrumbs.mjs

@@ -0,0 +1,126 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+import { focusRingOutline } from "../../tokens/focusRing.mjs";
+import { resolveInteractiveStyle } from "../../tokens/resolveInteractiveStyle.mjs";
+import { vars } from "@ttoss/fsl-theme/vars";
+import { Breadcrumb, Breadcrumbs, Link } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/Breadcrumbs/Breadcrumbs.tsx
+/** Formal semantic identity — Breadcrumbs root (Navigation entity, trail). */
+var breadcrumbsMeta = {
+  displayName: "Breadcrumbs",
+  entity: "Navigation",
+  structure: "root"
+};
+/** Formal semantic identity — Breadcrumb item (Navigation entity). */
+var breadcrumbMeta = {
+  displayName: "Breadcrumb",
+  entity: "Navigation",
+  structure: "item"
+};
+/**
+* A breadcrumb trail (Navigation entity). Renders an ordered list of
+* `Breadcrumb` items; React Aria marks the last as the current location.
+*
+* @example
+* ```tsx
+* <Breadcrumbs>
+*   <Breadcrumb href="/">Home</Breadcrumb>
+*   <Breadcrumb href="/reports">Reports</Breadcrumb>
+*   <Breadcrumb>Q3</Breadcrumb>
+* </Breadcrumbs>
+* ```
+*/
+var Breadcrumbs$1 = props => {
+  return /* @__PURE__ */jsx(Breadcrumbs, {
+    ...props,
+    "data-scope": "breadcrumbs",
+    "data-part": "root",
+    style: {
+      boxSizing: "border-box",
+      display: "flex",
+      flexWrap: "wrap",
+      alignItems: "center",
+      gap: vars.spacing.gap.inline.sm,
+      margin: 0,
+      padding: 0,
+      listStyle: "none"
+    }
+  });
+};
+Breadcrumbs$1.displayName = breadcrumbsMeta.displayName;
+/**
+* One crumb in a `Breadcrumbs` trail. Renders a navigation link, except the
+* current (last) crumb which renders as text in the `current` color and is
+* followed by no separator.
+*/
+var Breadcrumb$1 = ({
+  href,
+  children,
+  ...props
+}) => {
+  const colors = vars.colors.navigation.primary;
+  return /* @__PURE__ */jsx(Breadcrumb, {
+    ...props,
+    "data-scope": "breadcrumbs",
+    "data-part": "item",
+    children: ({
+      isCurrent
+    }) => {
+      return /* @__PURE__ */jsxs("span", {
+        style: {
+          boxSizing: "border-box",
+          display: "inline-flex",
+          alignItems: "center",
+          gap: vars.spacing.gap.inline.sm
+        },
+        children: [isCurrent ? /* @__PURE__ */jsx("span", {
+          "data-scope": "breadcrumbs",
+          "data-part": "control",
+          "aria-current": "page",
+          style: {
+            ...vars.text.label.md,
+            color: colors?.text?.current ?? colors?.text?.default
+          },
+          children
+        }) : /* @__PURE__ */jsx(Link, {
+          href,
+          "data-scope": "breadcrumbs",
+          "data-part": "control",
+          style: ({
+            isHovered,
+            isPressed,
+            isDisabled,
+            isFocusVisible
+          }) => {
+            return {
+              boxSizing: "border-box",
+              cursor: "pointer",
+              borderRadius: vars.radii.control,
+              textDecoration: isHovered ? "underline" : "none",
+              ...vars.text.label.md,
+              color: resolveInteractiveStyle(colors?.text, {
+                isHovered,
+                isPressed,
+                isDisabled
+              }),
+              outline: focusRingOutline(isFocusVisible)
+            };
+          },
+          children
+        }), !isCurrent && /* @__PURE__ */jsx("span", {
+          "aria-hidden": true,
+          style: {
+            color: colors?.text?.default,
+            userSelect: "none"
+          },
+          children: "/"
+        })]
+      });
+    }
+  });
+};
+Breadcrumb$1.displayName = breadcrumbMeta.displayName;
+
+//#endregion
+export { Breadcrumb$1 as Breadcrumb, Breadcrumbs$1 as Breadcrumbs, breadcrumbMeta, breadcrumbsMeta };

package/dist/components/Button/Button.cjs

@@ -0,0 +1,80 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+const require_focusRing = require('../../tokens/focusRing.cjs');
+const require_resolveInteractiveStyle = require('../../tokens/resolveInteractiveStyle.cjs');
+let _ttoss_fsl_theme_vars = require("@ttoss/fsl-theme/vars");
+let react_aria_components = require("react-aria-components");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/Button/Button.tsx
+/**
+* Formal semantic identity — what this component *is* (Layer 1).
+*/
+var buttonMeta = {
+  displayName: "Button",
+  entity: "Action",
+  structure: "root"
+};
+/**
+* A semantic action button built on React Aria.
+*/
+var Button = ({
+  evaluation = "primary",
+  consequence = "neutral",
+  composition,
+  "data-scope": dataScope = "button",
+  ...props
+}) => {
+  const colors = _ttoss_fsl_theme_vars.vars.colors.action[evaluation];
+  return /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_aria_components.Button, {
+    ...props,
+    "data-scope": dataScope,
+    "data-part": "root",
+    "data-evaluation": evaluation,
+    "data-consequence": consequence,
+    "data-composition": composition,
+    style: ({
+      isHovered,
+      isPressed,
+      isDisabled,
+      isFocusVisible
+    }) => {
+      return {
+        boxSizing: "border-box",
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        cursor: isDisabled ? "not-allowed" : "pointer",
+        borderRadius: _ttoss_fsl_theme_vars.vars.radii.control,
+        borderWidth: _ttoss_fsl_theme_vars.vars.border.outline.control.width,
+        borderStyle: _ttoss_fsl_theme_vars.vars.border.outline.control.style,
+        minHeight: _ttoss_fsl_theme_vars.vars.sizing.hit.base,
+        paddingBlock: _ttoss_fsl_theme_vars.vars.spacing.inset.control.sm,
+        paddingInline: _ttoss_fsl_theme_vars.vars.spacing.inset.control.lg,
+        ..._ttoss_fsl_theme_vars.vars.text.label.md,
+        transitionDuration: _ttoss_fsl_theme_vars.vars.motion.feedback.duration,
+        transitionTimingFunction: _ttoss_fsl_theme_vars.vars.motion.feedback.easing,
+        transitionProperty: "background-color, border-color, color",
+        backgroundColor: require_resolveInteractiveStyle.resolveInteractiveStyle(colors?.background, {
+          isHovered,
+          isPressed,
+          isDisabled
+        }),
+        borderColor: require_resolveInteractiveStyle.resolveInteractiveStyle(colors?.border, {
+          isDisabled,
+          isFocusVisible
+        }),
+        color: require_resolveInteractiveStyle.resolveInteractiveStyle(colors?.text, {
+          isHovered,
+          isPressed,
+          isDisabled
+        }) ?? colors?.text?.default,
+        outline: require_focusRing.focusRingOutline(isFocusVisible)
+      };
+    }
+  });
+};
+Button.displayName = buttonMeta.displayName;
+
+//#endregion
+exports.Button = Button;
+exports.buttonMeta = buttonMeta;

package/dist/components/Button/Button.d.cts

@@ -0,0 +1,68 @@
+
+import { CompositionsFor, ConsequencesFor, EvaluationsFor } from "../../semantics/taxonomy.cjs";
+import { ButtonProps } from "react-aria-components";
+
+//#region src/components/Button/Button.d.ts
+/**
+ * Formal semantic identity — what this component *is* (Layer 1).
+ */
+declare const buttonMeta: {
+  readonly displayName: "Button";
+  readonly entity: "Action";
+  readonly structure: "root";
+};
+/**
+ * Displays a semantic action trigger (entity: Action).
+ *
+ * Entity = Action → colors: `action`, radii: `control`, border: `outline.control`,
+ * sizing: `hit.base`, spacing: `inset.control.md`, typography: `label.md`, motion: `feedback`.
+ */
+interface ButtonProps$1 extends Omit<ButtonProps, 'style'> {
+  /**
+   * Semantic emphasis.
+   * @default 'primary'
+   */
+  evaluation?: EvaluationsFor<(typeof buttonMeta)['entity']>;
+  /**
+   * Effect on state this button's action produces. Emitted as
+   * `data-consequence` on the DOM so host integrations (confirm wrappers,
+   * telemetry, undo/redo hooks) and tests can observe the contract.
+   *
+   * NOT used for coloring — visual distinction (if any) is a theme /
+   * host-CSS concern, matching the same contract as `MenuItem`.
+   *
+   * @default 'neutral'
+   */
+  consequence?: ConsequencesFor<(typeof buttonMeta)['entity']>;
+  /**
+   * Slot this button occupies inside a parent composite (FSL §4).
+   * Emitted as `data-composition` on the DOM and consumed at runtime by
+   * composites that need to reorder or style actions by role — notably
+   * `DialogActions`, which reorders children per platform convention
+   * (iOS vs Windows).
+   *
+   * Orthogonal to `evaluation` (authorial voice) and `consequence`
+   * (effect on state): composition is purely *positional* semantics.
+   */
+  composition?: CompositionsFor<(typeof buttonMeta)['entity']>;
+  /**
+   * Data scope identifier for the button.
+   * @default 'button'
+   */
+  'data-scope'?: string;
+}
+/**
+ * A semantic action button built on React Aria.
+ */
+declare const Button: {
+  ({
+    evaluation,
+    consequence,
+    composition,
+    "data-scope": dataScope,
+    ...props
+  }: ButtonProps$1): import("react/jsx-runtime").JSX.Element;
+  displayName: "Button";
+};
+//#endregion
+export { Button, ButtonProps$1 as ButtonProps, buttonMeta };