asheeui 1.1.1 → 2.0.0

package/dist/components/data-table/data-table-styles.d.ts

@@ -0,0 +1,25 @@
+/**
+ * DataTable component styles for AsheeUI.
+ * This file provides the static class mappings for the table composition: the
+ * wrapper, the toolbar above the table and its parts. The table itself keeps the
+ * classes the `Table` component owns.
+ */
+/** The wrapper. */
+export declare const DATA_TABLE_CLASS = "flex w-full min-w-0 flex-col gap-4";
+/** The heading above the toolbar. */
+export declare const DATA_TABLE_HEADING_CLASS = "flex flex-col gap-1";
+/**
+ * The toolbar above the table.
+ * The control and the count stack on a narrow screen and sit in a row from the
+ * `sm` breakpoint.
+ */
+export declare const DATA_TABLE_TOOLBAR_CLASS = "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between";
+/** The group that holds the search control and the consumer's own controls. */
+export declare const DATA_TABLE_TOOLBAR_GROUP_CLASS = "flex w-full flex-col gap-2 sm:flex-row sm:items-center";
+/** The region that holds the table or the empty state. */
+export declare const DATA_TABLE_REGION_CLASS = "flex w-full min-w-0 flex-col gap-4";
+/** The row count, which sits under the table beside the pagination. */
+export declare const DATA_TABLE_FOOTER_CLASS = "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between";
+/** Width the search control takes in the toolbar. */
+export declare const DATA_TABLE_SEARCH_CLASS = "w-full sm:max-w-sm";
+//# sourceMappingURL=data-table-styles.d.ts.map

package/dist/components/data-table/data-table-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-styles.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/data-table-styles.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,mBAAmB;AACnB,eAAO,MAAM,gBAAgB,uCAAuC,CAAC;AAErE,qCAAqC;AACrC,eAAO,MAAM,wBAAwB,wBAAwB,CAAC;AAE9D;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,uEACiC,CAAC;AAEvE,+EAA+E;AAC/E,eAAO,MAAM,8BAA8B,2DACe,CAAC;AAE3D,0DAA0D;AAC1D,eAAO,MAAM,uBAAuB,uCAAuC,CAAC;AAE5E,uEAAuE;AACvE,eAAO,MAAM,uBAAuB,uEACkC,CAAC;AAEvE,qDAAqD;AACrD,eAAO,MAAM,uBAAuB,uBAAuB,CAAC"}

package/dist/components/data-table/data-table-styles.js

@@ -0,0 +1,5 @@
+"use client";
+//#region src/components/data-table/data-table-styles.ts
+var e = "flex w-full min-w-0 flex-col gap-4", t = "flex flex-col gap-1", n = "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", r = "flex w-full flex-col gap-2 sm:flex-row sm:items-center", i = "flex w-full min-w-0 flex-col gap-4", a = "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", o = "w-full sm:max-w-sm";
+//#endregion
+export { e as DATA_TABLE_CLASS, a as DATA_TABLE_FOOTER_CLASS, t as DATA_TABLE_HEADING_CLASS, i as DATA_TABLE_REGION_CLASS, o as DATA_TABLE_SEARCH_CLASS, n as DATA_TABLE_TOOLBAR_CLASS, r as DATA_TABLE_TOOLBAR_GROUP_CLASS };

package/dist/components/data-table/index.d.ts

@@ -0,0 +1,3 @@
+export * from './DataTable';
+export * from './data-table-config';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/data-table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC"}

package/dist/components/data-table/index.js

@@ -0,0 +1,3 @@
+export * from "./DataTable.js";
+export * from "./data-table-config.js";
+export * from "./data-table-styles.js";

package/dist/components/docs-layout/DocsLayout.d.ts

@@ -0,0 +1,94 @@
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+import { DocsLayoutConfig } from './docs-layout-config';
+type BaseDocsLayoutProps = DocsLayoutConfig & Omit<HTMLAttributes<HTMLDivElement>, "color">;
+/**
+ * Props for the DocsLayout component.
+ */
+export interface DocsLayoutProps extends BaseDocsLayoutProps {
+    /**
+     * The documentation navigation, typically a `Sidebar` of sections and pages.
+     */
+    navigation: ReactNode;
+    /**
+     * The table of contents of the current article.
+     * Left out, the composition is a two-column page; supplied, the contents take
+     * the third column on a large screen and are hidden below it.
+     */
+    toc?: ReactNode;
+    /**
+     * Content above everything, typically a `Navbar` with the site's brand and
+     * search.
+     */
+    header?: ReactNode;
+    /**
+     * Content below everything.
+     */
+    footer?: ReactNode;
+    /**
+     * The article.
+     */
+    children?: ReactNode;
+    /**
+     * Identifier of the article region, which the skip link points at.
+     *
+     * @default "main-content"
+     */
+    mainId?: string;
+    /**
+     * Element to render the page shell as.
+     * Defaults to a `div`.
+     *
+     * @default "div"
+     */
+    as?: ElementType;
+}
+/**
+ * The arrangement a documentation page is built in.
+ *
+ * The composition is a navigation column, an article and, when one is supplied,
+ * a table of contents. It composes the framework's application shell and split
+ * layout, so the behaviour a documentation page depends on (the sticky
+ * navigation, the stacked narrow-screen layout and the responsive columns) is
+ * the behaviour those primitives already provide and test.
+ *
+ * Nothing but the table of contents is hidden from a narrow screen: the
+ * navigation stays in the document above the article, so a keyboard reader
+ * reaches it without a drawer to trap focus in. The contents repeat the
+ * article's own headings, which stay in the article.
+ *
+ * @param props - DocsLayout configuration options and element attributes.
+ * @param props.navigation - The documentation navigation.
+ * @param props.toc - The table of contents of the current article.
+ * @param props.header - Content above everything.
+ * @param props.footer - Content below everything.
+ * @param props.children - The article.
+ * @param props.mainId - Identifier of the article region. Defaults to
+ * "main-content".
+ * @param props.navigationLabel - Name of the navigation landmark. Defaults to
+ * "Documentation".
+ * @param props.tocLabel - Name of the contents landmark. Defaults to "On this
+ * page".
+ * @param props.navigationWidth - Width of the navigation column from `lg`.
+ * Defaults to "md".
+ * @param props.stickyToc - Keep the contents in view. Defaults to true.
+ * @param props.skipLink - Render a skip link. Defaults to true.
+ * @param props.as - Element to render. Defaults to "div".
+ * @returns The rendered page.
+ *
+ * @example
+ * ```tsx
+ * <DocsLayout
+ *   header={<Navbar brand="AsheeUI" links={links} />}
+ *   navigation={<Sidebar items={sections} activeKey="layout" />}
+ *   toc={<TableOfContents items={headings} />}>
+ *   <Typography role="display">Layout</Typography>
+ *   <Typography role="body-md">A page is composed from the layout layer.</Typography>
+ * </DocsLayout>
+ * ```
+ *
+ * @see MarketingLayout - The marketing composition.
+ * @see SidebarLayout - The application shell the composition builds on.
+ */
+export declare const DocsLayout: import('react').ForwardRefExoticComponent<DocsLayoutProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=DocsLayout.d.ts.map

package/dist/components/docs-layout/DocsLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocsLayout.d.ts","sourceRoot":"","sources":["../../../src/components/docs-layout/DocsLayout.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAOf,OAAO,EACL,KAAK,gBAAgB,EAEtB,MAAM,sBAAsB,CAAC;AAU9B,KAAK,mBAAmB,GAAG,gBAAgB,GACzC,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC;AAEhD;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,mBAAmB;IAC1D;;OAEG;IACH,UAAU,EAAE,SAAS,CAAC;IAEtB;;;;OAIG;IACH,GAAG,CAAC,EAAE,SAAS,CAAC;IAEhB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;;OAKG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,eAAO,MAAM,UAAU,4GAuFtB,CAAC"}

package/dist/components/docs-layout/DocsLayout.js

@@ -0,0 +1,62 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { useAsheeConfig as t } from "../../libs/context.js";
+import { resolveConfigCascade as n } from "../../utils/resolve-token.js";
+import { SkipLink as r } from "../section-kit/SkipLink.js";
+import { SidebarLayout as i } from "../sidebar-layout/SidebarLayout.js";
+import { Split as a } from "../split/Split.js";
+import { FALLBACK_DOCS_LAYOUT_CONFIG as o } from "./docs-layout-config.js";
+import { DOCS_LAYOUT_ARTICLE_CLASS as s, DOCS_LAYOUT_BODY_CLASS as c, DOCS_LAYOUT_CLASS as l, DOCS_LAYOUT_SHELL_CLASS as u, DOCS_LAYOUT_TOC_CLASS as d } from "./docs-layout-styles.js";
+import { forwardRef as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/docs-layout/DocsLayout.tsx
+var h = f(({ navigation: f, toc: h, header: g, footer: _, children: v, mainId: y = "main-content", navigationLabel: b, tocLabel: x, navigationWidth: S, stickyToc: C, skipLink: w, skipLinkLabel: T, as: E, className: D, ...O }, k) => {
+	let A = t(), j = n({
+		navigationLabel: b,
+		tocLabel: x,
+		navigationWidth: S,
+		stickyToc: C,
+		skipLink: w,
+		skipLinkLabel: T
+	}, A.components?.docslayout, o), M = /* @__PURE__ */ p("main", {
+		id: y,
+		tabIndex: -1,
+		className: s,
+		children: /* @__PURE__ */ p("div", {
+			className: c,
+			children: v
+		})
+	});
+	return /* @__PURE__ */ m(E ?? "div", {
+		ref: k,
+		className: e(l, D),
+		...O,
+		children: [j.skipLink && /* @__PURE__ */ p(r, {
+			targetId: y,
+			label: j.skipLinkLabel
+		}), /* @__PURE__ */ p(i, {
+			className: u,
+			header: g,
+			footer: _,
+			sidebar: f,
+			sidebarLabel: j.navigationLabel,
+			sidebarWidth: j.navigationWidth,
+			children: h ? /* @__PURE__ */ p(a, {
+				stackAt: "xl",
+				ratio: "start",
+				gap: "xl",
+				align: "start",
+				start: M,
+				end: /* @__PURE__ */ p("aside", {
+					"aria-label": j.tocLabel,
+					className: e(d, j.stickyToc && "xl:sticky xl:top-0 xl:self-start"),
+					children: h
+				})
+			}) : M
+		})]
+	});
+});
+h.displayName = "DocsLayout";
+//#endregion
+export { h as DocsLayout };

package/dist/components/docs-layout/docs-layout-config.d.ts

@@ -0,0 +1,61 @@
+import { SidebarLayoutWidth } from '../sidebar-layout/sidebar-layout-config';
+/**
+ * Theme configuration options for the DocsLayout component.
+ *
+ * Set under `components.docslayout` in the AsheeUI config. Values feed the
+ * component-level tier of the theme cascade.
+ */
+export interface DocsLayoutConfig {
+    /**
+     * Name of the navigation landmark.
+     * It distinguishes the documentation navigation from the other navigation
+     * regions a page may have.
+     *
+     * @default "Documentation"
+     */
+    navigationLabel?: string;
+    /**
+     * Name of the table of contents landmark.
+     *
+     * @default "On this page"
+     */
+    tocLabel?: string;
+    /**
+     * Width of the navigation column from the `lg` breakpoint upwards.
+     *
+     * @default "md"
+     */
+    navigationWidth?: SidebarLayoutWidth;
+    /**
+     * Whether the table of contents stays in view while the article scrolls.
+     *
+     * @default true
+     */
+    stickyToc?: boolean;
+    /**
+     * Whether the composition renders a skip link to its main region.
+     *
+     * @default true
+     */
+    skipLink?: boolean;
+    /**
+     * Wording of the skip link.
+     *
+     * @default "Skip to content"
+     */
+    skipLinkLabel?: string;
+}
+/**
+ * Default config values registered for the DocsLayout component.
+ */
+export declare const defaultDocsLayoutConfig: DocsLayoutConfig;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        docslayout: DocsLayoutConfig;
+    }
+}
+/**
+ * Hard fallback values used when no config tier provides a value.
+ */
+export declare const FALLBACK_DOCS_LAYOUT_CONFIG: Required<DocsLayoutConfig>;
+//# sourceMappingURL=docs-layout-config.d.ts.map

package/dist/components/docs-layout/docs-layout-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-layout-config.d.ts","sourceRoot":"","sources":["../../../src/components/docs-layout/docs-layout-config.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAElF;;;;;GAKG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;OAIG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IAErC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,uBAAuB,EAAE,gBAOrC,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,UAAU,EAAE,gBAAgB,CAAC;KAC9B;CACF;AAID;;GAEG;AACH,eAAO,MAAM,2BAA2B,EAAE,QAAQ,CAAC,gBAAgB,CAOlE,CAAC"}

package/dist/components/docs-layout/docs-layout-config.js

@@ -0,0 +1,22 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/docs-layout/docs-layout-config.ts
+var t = {
+	navigationLabel: "Documentation",
+	tocLabel: "On this page",
+	navigationWidth: "md",
+	stickyToc: !0,
+	skipLink: !0,
+	skipLinkLabel: "Skip to content"
+};
+e("docslayout", t);
+var n = {
+	navigationLabel: "Documentation",
+	tocLabel: "On this page",
+	navigationWidth: "md",
+	stickyToc: !0,
+	skipLink: !0,
+	skipLinkLabel: "Skip to content"
+};
+//#endregion
+export { n as FALLBACK_DOCS_LAYOUT_CONFIG, t as defaultDocsLayoutConfig };

package/dist/components/docs-layout/docs-layout-styles.d.ts

@@ -0,0 +1,31 @@
+/**
+ * DocsLayout component styles for AsheeUI.
+ * This file provides the static class mappings for the documentation
+ * composition: the page shell, the article column, the table of contents column
+ * and the article body's reading measure.
+ */
+/**
+ * The page shell.
+ * It wraps the application shell rather than replacing it, so the skip link can
+ * be the first focusable element of the page.
+ */
+export declare const DOCS_LAYOUT_CLASS = "flex min-h-dvh w-full flex-col bg-background";
+/** The application shell inside the page shell. */
+export declare const DOCS_LAYOUT_SHELL_CLASS = "flex-1";
+/**
+ * The article column.
+ * It is the region the skip link leads to, so it takes focus when the link is
+ * followed.
+ */
+export declare const DOCS_LAYOUT_ARTICLE_CLASS = "flex w-full min-w-0 flex-col";
+/**
+ * The reading measure of the article body.
+ * A documentation page is read rather than scanned, so the body keeps a readable
+ * line length while the columns around it may be wider.
+ */
+export declare const DOCS_LAYOUT_BODY_CLASS = "flex flex-col gap-6 max-w-3xl";
+/** The table of contents column. */
+export declare const DOCS_LAYOUT_TOC_CLASS = "hidden w-full xl:block xl:w-64 xl:shrink-0";
+/** Keeps the table of contents in view while the article scrolls. */
+export declare const DOCS_LAYOUT_TOC_STICKY_CLASS = "xl:sticky xl:top-0 xl:self-start";
+//# sourceMappingURL=docs-layout-styles.d.ts.map

package/dist/components/docs-layout/docs-layout-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-layout-styles.d.ts","sourceRoot":"","sources":["../../../src/components/docs-layout/docs-layout-styles.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,iDAAiD,CAAC;AAEhF,mDAAmD;AACnD,eAAO,MAAM,uBAAuB,WAAW,CAAC;AAEhD;;;;GAIG;AACH,eAAO,MAAM,yBAAyB,iCAAiC,CAAC;AAExE;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,kCAAkC,CAAC;AAEtE,oCAAoC;AACpC,eAAO,MAAM,qBAAqB,+CACY,CAAC;AAE/C,qEAAqE;AACrE,eAAO,MAAM,4BAA4B,qCAAqC,CAAC"}

package/dist/components/docs-layout/docs-layout-styles.js

@@ -0,0 +1,5 @@
+"use client";
+//#region src/components/docs-layout/docs-layout-styles.ts
+var e = "flex min-h-dvh w-full flex-col bg-background", t = "flex-1", n = "flex w-full min-w-0 flex-col", r = "flex flex-col gap-6 max-w-3xl", i = "hidden w-full xl:block xl:w-64 xl:shrink-0", a = "xl:sticky xl:top-0 xl:self-start";
+//#endregion
+export { n as DOCS_LAYOUT_ARTICLE_CLASS, r as DOCS_LAYOUT_BODY_CLASS, e as DOCS_LAYOUT_CLASS, t as DOCS_LAYOUT_SHELL_CLASS, i as DOCS_LAYOUT_TOC_CLASS, a as DOCS_LAYOUT_TOC_STICKY_CLASS };

package/dist/components/docs-layout/index.d.ts

@@ -0,0 +1,3 @@
+export * from './DocsLayout';
+export * from './docs-layout-config';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/docs-layout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/docs-layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC"}

package/dist/components/docs-layout/index.js

@@ -0,0 +1,3 @@
+export * from "./DocsLayout.js";
+export * from "./docs-layout-config.js";
+export * from "./docs-layout-styles.js";

package/dist/components/empty-state/EmptyState.d.ts

@@ -30,6 +30,13 @@ export interface EmptyStateProps extends BaseEmptyStateProps {
      * @default "div"
      */
     as?: ElementType;
+    /**
+     * Actions that carry a React handler.
+     * A configured action describes a destination rather than a callback, so an
+     * action that runs one (a retry, a dismissal) is passed here and rendered in
+     * the same group as the configured actions.
+     */
+    actions?: ReactNode;
     /** Content below the actions. */
     children?: ReactNode;
 }
@@ -65,10 +72,21 @@ export interface EmptyStateProps extends BaseEmptyStateProps {
  *   icon={<SearchIcon />}
  *   title="No campaigns match that filter"
  *   description="Try a different name, or clear the filter to see everything."
- *   primaryAction={{ label: "Clear filters", onClick: clearFilters }}
+ *   primaryAction={{ label: "See all campaigns", href: "/campaigns" }}
  * />
  * ```
  *
+ * A configured action describes a destination, so an action that runs a handler
+ * is passed as a child instead:
+ *
+ * ```tsx
+ * <EmptyState title="No campaigns match that filter">
+ *   <Button variant="solid" onClick={clearFilters}>
+ *     Clear filters
+ *   </Button>
+ * </EmptyState>
+ * ```
+ *
  * @see Skeleton - The loading presentation of the same region.
  * @see Alert - An inline message that is not a whole region.
  */

package/dist/components/empty-state/EmptyState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/empty-state/EmptyState.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAKjD,OAAO,EACL,KAAK,gBAAgB,EAEtB,MAAM,sBAAsB,CAAC;AAS9B,KAAK,mBAAmB,GAAG,gBAAgB,GACzC,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,CAAC;AAE1D;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,mBAAmB;IAC1D,kCAAkC;IAClC,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,6DAA6D;IAC7D,KAAK,EAAE,SAAS,CAAC;IAEjB,uCAAuC;IACvC,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,8EAA8E;IAC9E,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B,oEAAoE;IACpE,eAAe,CAAC,EAAE,YAAY,CAAC;IAE/B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAE1B;;;;;OAKG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,eAAO,MAAM,UAAU,4GAsEtB,CAAC"}
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/empty-state/EmptyState.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAKjD,OAAO,EACL,KAAK,gBAAgB,EAEtB,MAAM,sBAAsB,CAAC;AAS9B,KAAK,mBAAmB,GAAG,gBAAgB,GACzC,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,CAAC;AAE1D;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,mBAAmB;IAC1D,kCAAkC;IAClC,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,6DAA6D;IAC7D,KAAK,EAAE,SAAS,CAAC;IAEjB,uCAAuC;IACvC,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,8EAA8E;IAC9E,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B,oEAAoE;IACpE,eAAe,CAAC,EAAE,YAAY,CAAC;IAE/B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAE1B;;;;;OAKG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,eAAO,MAAM,UAAU,4GAwEtB,CAAC"}

package/dist/components/empty-state/EmptyState.js

@@ -10,20 +10,20 @@ import { EMPTY_STATE_CLASS as o, EMPTY_STATE_ICON_CLASS as s, EMPTY_STATE_ICON_S
 import { forwardRef as u } from "react";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/components/empty-state/EmptyState.tsx
-var p = u(({ icon: u, title: p, description: m, primaryAction: h, secondaryAction: g, type: _, size: v, panel: y, role: b, as: x, className: S, children: C, ...w }, T) => {
-	let E = t(), D = n({
+var p = u(({ icon: u, title: p, description: m, primaryAction: h, secondaryAction: g, type: _, size: v, panel: y, role: b, as: x, className: S, actions: C, children: w, ...T }, E) => {
+	let D = t(), O = n({
 		type: _,
 		size: v,
 		panel: y
-	}, E.components?.emptystate, a);
+	}, D.components?.emptystate, a);
 	return /* @__PURE__ */ f(x ?? "div", {
-		ref: T,
+		ref: E,
 		role: b,
-		className: e(o, l[D.size], D.panel && "rounded-md border border-border bg-background", S),
-		...w,
+		className: e(o, l[O.size], O.panel && "rounded-md border border-border bg-background", S),
+		...T,
 		children: [
 			u && /* @__PURE__ */ d("div", {
-				className: e(s[D.type], c[D.size]),
+				className: e(s[O.type], c[O.size]),
 				children: u
 			}),
 			/* @__PURE__ */ d(r, {
@@ -35,9 +35,10 @@ var p = u(({ icon: u, title: p, description: m, primaryAction: h, secondaryActio
 			/* @__PURE__ */ d(i, {
 				primaryAction: h,
 				secondaryAction: g,
-				align: "center"
+				align: "center",
+				children: C
 			}),
-			C
+			w
 		]
 	});
 });

package/dist/components/error-state/ErrorState.d.ts

@@ -0,0 +1,98 @@
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+import { ActionConfig } from '../../shared';
+import { ErrorStateConfig } from './error-state-config';
+type BaseErrorStateProps = ErrorStateConfig & Omit<HTMLAttributes<HTMLDivElement>, "color" | "title">;
+/**
+ * Props for the ErrorState component.
+ */
+export interface ErrorStateProps extends BaseErrorStateProps {
+    /**
+     * What failed, in the reader's terms.
+     */
+    title: ReactNode;
+    /**
+     * What the reader can do about it.
+     */
+    description?: ReactNode;
+    /**
+     * The technical detail, typically the message a request returned.
+     * It is rendered inside a disclosure rather than in the open, because it is
+     * written for a developer rather than for the reader.
+     */
+    detail?: ReactNode;
+    /**
+     * Called when the reader asks to try again.
+     * Its presence is what renders the retry control.
+     */
+    onRetry?: () => void;
+    /**
+     * The emphasised action, when the way out is a destination rather than a
+     * retry.
+     */
+    primaryAction?: ActionConfig;
+    /**
+     * The supporting action.
+     */
+    secondaryAction?: ActionConfig;
+    /**
+     * Icon shown above the title.
+     * Defaults to the framework's error icon.
+     */
+    icon?: ReactNode;
+    /**
+     * Element to render.
+     * Defaults to a `div`.
+     *
+     * @default "div"
+     */
+    as?: ElementType;
+    /**
+     * Content below the actions.
+     */
+    children?: ReactNode;
+}
+/**
+ * A region whose content could not be loaded.
+ *
+ * The state is an `alert` by default, because it usually replaces content after
+ * a request failed and therefore has to be announced. A state that is part of
+ * the page from the start, such as a not-found page, passes `role="none"` so it
+ * is not announced as a change that just happened.
+ *
+ * A retry is a React handler rather than a configured action, because a
+ * configured action describes a destination. It is rendered in the same group as
+ * any configured actions, so the two arrangements agree.
+ *
+ * @param props - ErrorState configuration options and element attributes.
+ * @param props.title - What failed.
+ * @param props.description - What the reader can do about it.
+ * @param props.detail - The technical message, inside a disclosure.
+ * @param props.onRetry - Called when the reader asks to try again.
+ * @param props.primaryAction - The emphasised action.
+ * @param props.secondaryAction - The supporting action.
+ * @param props.size - Density. Defaults to "md".
+ * @param props.panel - Draw the state as a panel. Defaults to true.
+ * @param props.role - How the state is announced. Defaults to "alert".
+ * @param props.retryLabel - Wording of the retry control. Defaults to "Try
+ * again".
+ * @param props.detailLabel - Wording of the disclosure. Defaults to "Technical
+ * details".
+ * @param props.as - Element to render. Defaults to "div".
+ * @returns The rendered state.
+ *
+ * @example
+ * ```tsx
+ * <ErrorState
+ *   title="Invoices could not be loaded"
+ *   description="The request timed out. Trying again usually works."
+ *   detail={error.message}
+ *   onRetry={refetch}
+ * />
+ * ```
+ *
+ * @see EmptyState - The presentation for a region that has nothing in it.
+ * @see LoadingState - The presentation for a region that has not arrived yet.
+ */
+export declare const ErrorState: import('react').ForwardRefExoticComponent<ErrorStateProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=ErrorState.d.ts.map

package/dist/components/error-state/ErrorState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorState.d.ts","sourceRoot":"","sources":["../../../src/components/error-state/ErrorState.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAIjD,OAAO,EACL,KAAK,gBAAgB,EAEtB,MAAM,sBAAsB,CAAC;AAO9B,KAAK,mBAAmB,GAAG,gBAAgB,GACzC,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,CAAC;AAE1D;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,mBAAmB;IAC1D;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;;OAGG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;OAEG;IACH,eAAe,CAAC,EAAE,YAAY,CAAC;IAE/B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;;OAKG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,eAAO,MAAM,UAAU,4GAwEtB,CAAC"}

package/dist/components/error-state/ErrorState.js

@@ -0,0 +1,57 @@
+"use client";
+"use client";
+import { useAsheeConfig as e } from "../../libs/context.js";
+import { resolveConfigCascade as t } from "../../utils/resolve-token.js";
+import { ErrorIcon as n } from "../../icons/ErrorIcon.js";
+import { Button as r } from "../button/Button.js";
+import { EmptyState as i } from "../empty-state/EmptyState.js";
+import { FALLBACK_ERROR_STATE_CONFIG as a } from "./error-state-config.js";
+import "./error-state-styles.js";
+import { forwardRef as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/error-state/ErrorState.tsx
+var l = o(({ title: o, description: l, detail: u, onRetry: d, primaryAction: f, secondaryAction: p, icon: m, size: h, panel: g, role: _, retryLabel: v, detailLabel: y, as: b, className: x, children: S, ...C }, w) => {
+	let T = e(), E = t({
+		size: h,
+		panel: g,
+		role: _,
+		retryLabel: v,
+		detailLabel: y
+	}, T.components?.errorstate, a);
+	return /* @__PURE__ */ c(i, {
+		...C,
+		ref: w,
+		as: b,
+		className: x,
+		type: "error",
+		size: E.size,
+		panel: E.panel,
+		role: E.role === "none" ? void 0 : E.role,
+		icon: m ?? /* @__PURE__ */ s(n, {}),
+		title: o,
+		description: l,
+		primaryAction: f,
+		secondaryAction: p,
+		actions: d ? /* @__PURE__ */ s(r, {
+			type: "button",
+			variant: "solid",
+			color: "danger",
+			size: E.size,
+			onClick: d,
+			children: E.retryLabel
+		}) : void 0,
+		children: [u && /* @__PURE__ */ c("details", {
+			className: "w-full max-w-2xl text-left text-sm text-foreground/70",
+			children: [/* @__PURE__ */ s("summary", {
+				className: "cursor-pointer font-medium text-foreground",
+				children: E.detailLabel
+			}), /* @__PURE__ */ s("div", {
+				className: "mt-2 overflow-x-auto rounded-md border border-border bg-background p-3 font-mono text-xs",
+				children: u
+			})]
+		}), S]
+	});
+});
+l.displayName = "ErrorState";
+//#endregion
+export { l as ErrorState };