@cratis/components 4.7.0 → 4.9.0

package/dist/esm/Common/Breadcrumbs.d.ts

@@ -0,0 +1,48 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+/** Attributes a consumer may hand to one {@link Breadcrumbs} part: class, style, title and data attributes. */
+export type BreadcrumbsPartAttributes = Pick<HTMLAttributes<HTMLElement>, 'className' | 'style' | 'title'> & {
+    [dataAttribute: `data-${string}`]: string | number | boolean | undefined;
+};
+/** One segment of a {@link Breadcrumbs} trail. */
+export interface BreadcrumbItem {
+    /** Visible label. */
+    label: ReactNode;
+    /** Destination. A segment without one is text rather than a link — as the last segment is. */
+    href?: string;
+    /** Called instead of navigating, for a router that owns navigation. */
+    onNavigate?: () => void;
+}
+/** Stable Cratis-owned parts for styling a {@link Breadcrumbs} trail. */
+export interface BreadcrumbsParts {
+    /** The navigation landmark wrapping the trail. */
+    root?: BreadcrumbsPartAttributes;
+    /** One segment. */
+    item?: BreadcrumbsPartAttributes;
+    /** A segment's link, rendered for every segment that is not the current page. */
+    link?: BreadcrumbsPartAttributes;
+    /** The separator between two segments. */
+    separator?: BreadcrumbsPartAttributes;
+}
+/** Props for {@link Breadcrumbs}. */
+export interface BreadcrumbsProps {
+    /** The trail, outermost first. The last item is the current page. */
+    items: BreadcrumbItem[];
+    /** Separator rendered between segments. Defaults to a slash; decorative either way. */
+    separator?: ReactNode;
+    /** Accessible name for the landmark. Name it when a page carries more than one trail. */
+    'aria-label'?: string;
+    /** Extra class name for the root element. */
+    className?: string;
+    /** Cratis-owned per-part attributes. */
+    pt?: BreadcrumbsParts;
+}
+/**
+ * A breadcrumb trail.
+ *
+ * The last segment is the current page: it carries `aria-current="page"` and is never a link, which
+ * is what tells a screen-reader user where the trail ends. Earlier segments are links when they have
+ * a destination. The trail is an ordered list inside a navigation landmark, so it can be jumped to
+ * and its length announced.
+ */
+export declare const Breadcrumbs: ({ items, separator, 'aria-label': ariaLabel, className, pt, }: BreadcrumbsProps) => import("react").JSX.Element;
+//# sourceMappingURL=Breadcrumbs.d.ts.map

package/dist/esm/Common/Breadcrumbs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../../Common/Breadcrumbs.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAS5D,+GAA+G;AAC/G,MAAM,MAAM,yBAAyB,GAAG,IAAI,CACxC,cAAc,CAAC,WAAW,CAAC,EAC3B,WAAW,GAAG,OAAO,GAAG,OAAO,CAClC,GAAG;IACA,CAAC,aAAa,EAAE,QAAQ,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;CAC5E,CAAC;AAEF,kDAAkD;AAClD,MAAM,WAAW,cAAc;IAC3B,qBAAqB;IACrB,KAAK,EAAE,SAAS,CAAC;IACjB,8FAA8F;IAC9F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uEAAuE;IACvE,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,yEAAyE;AACzE,MAAM,WAAW,gBAAgB;IAC7B,kDAAkD;IAClD,IAAI,CAAC,EAAE,yBAAyB,CAAC;IACjC,mBAAmB;IACnB,IAAI,CAAC,EAAE,yBAAyB,CAAC;IACjC,iFAAiF;IACjF,IAAI,CAAC,EAAE,yBAAyB,CAAC;IACjC,0CAA0C;IAC1C,SAAS,CAAC,EAAE,yBAAyB,CAAC;CACzC;AAQD,qCAAqC;AACrC,MAAM,WAAW,gBAAgB;IAC7B,qEAAqE;IACrE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,uFAAuF;IACvF,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,yFAAyF;IACzF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,EAAE,CAAC,EAAE,gBAAgB,CAAC;CACzB;AAKD;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,kEAMrB,gBAAgB,gCAuDlB,CAAC"}

package/dist/esm/Common/Breadcrumbs.js

@@ -0,0 +1,11 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Breadcrumbs as Breadcrumbs$1, Breadcrumb, Link } from 'react-aria-components/Breadcrumbs';
+
+const classNames = (...values) => values.filter(Boolean).join(' ');
+const Breadcrumbs = ({ items, separator = '/', 'aria-label': ariaLabel, className, pt, }) => (jsx("nav", { "aria-label": ariaLabel, children: jsx(Breadcrumbs$1, { ...pt?.root, className: classNames('cratis-breadcrumbs', pt?.root?.className, className), "data-cratis-part": 'root', children: items.map((item, index) => {
+            const current = index === items.length - 1;
+            return (jsxs(Breadcrumb, { ...pt?.item, className: classNames('cratis-breadcrumbs__item', pt?.item?.className), "data-cratis-part": 'item', "data-selected": current || undefined, children: [jsx(Link, { ...pt?.link, href: current ? undefined : item.href, onPress: current ? undefined : item.onNavigate, className: classNames('cratis-breadcrumbs__link', pt?.link?.className), "data-cratis-part": 'link', "data-selected": current || undefined, children: item.label }), !current && (jsx("span", { ...pt?.separator, "aria-hidden": 'true', className: classNames('cratis-breadcrumbs__separator', pt?.separator?.className), "data-cratis-part": 'separator', children: separator }))] }, `${index}-${String(item.href ?? '')}`));
+        }) }) }));
+
+export { Breadcrumbs };
+//# sourceMappingURL=Breadcrumbs.js.map

package/dist/esm/Common/Breadcrumbs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.js","sources":["../../../Common/Breadcrumbs.tsx"],"sourcesContent":[null],"names":["_jsx","AriaBreadcrumbs","_jsxs","AriaBreadcrumb","AriaLink"],"mappings":";;;AA8DA,MAAM,UAAU,GAAG,CAAC,GAAG,MAAiC,KACpD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;AAU7B,MAAM,WAAW,GAAG,CAAC,EACxB,KAAK,EACL,SAAS,GAAG,GAAG,EACf,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,EAAE,GACa,MAGfA,GAAA,CAAA,KAAA,EAAA,EAAA,YAAA,EAAiB,SAAS,EAAA,QAAA,EACtBA,GAAA,CAACC,aAAe,EAAA,EAAA,GACR,EAAE,EAAE,IAAI,EACZ,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,CAAC,EAAA,kBAAA,EAC1D,MAAM,EAAA,QAAA,EAE1B,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;YACvB,MAAM,OAAO,GAAG,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC;AAC1C,YAAA,QACIC,IAAA,CAACC,UAAc,EAAA,EAAA,GAEP,EAAE,EAAE,IAAI,EACZ,SAAS,EAAE,UAAU,CAAC,0BAA0B,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,CAAC,EAAA,kBAAA,EACrD,MAAM,EAAA,eAAA,EACR,OAAO,IAAI,SAAS,EAAA,QAAA,EAAA,CAOnCH,GAAA,CAACI,IAAQ,EAAA,EAAA,GACD,EAAE,EAAE,IAAI,EACZ,IAAI,EAAE,OAAO,GAAG,SAAS,GAAG,IAAI,CAAC,IAAI,EACrC,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,IAAI,CAAC,UAAU,EAC9C,SAAS,EAAE,UAAU,CACjB,0BAA0B,EAC1B,EAAE,EAAE,IAAI,EAAE,SAAS,CACtB,EAAA,kBAAA,EACgB,MAAM,EAAA,eAAA,EACR,OAAO,IAAI,SAAS,EAAA,QAAA,EAElC,IAAI,CAAC,KAAK,EAAA,CACJ,EACV,CAAC,OAAO,KACLJ,GAAA,CAAA,MAAA,EAAA,EAAA,GACQ,EAAE,EAAE,SAAS,EAAA,aAAA,EACL,MAAM,EAClB,SAAS,EAAE,UAAU,CACjB,+BAA+B,EAC/B,EAAE,EAAE,SAAS,EAAE,SAAS,CAC3B,EAAA,kBAAA,EACgB,WAAW,EAAA,QAAA,EAE3B,SAAS,EAAA,CACP,CACV,CAAA,EAAA,EApCI,CAAA,EAAG,KAAK,CAAA,CAAA,EAAI,MAAM,CAAC,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,CAAA,CAAE,CAqC7B;AAErB,QAAA,CAAC,CAAC,EAAA,CACY,EAAA,CAChB;;"}

package/dist/esm/Common/ErrorBoundary.d.ts

@@ -1,61 +1,67 @@
-import { Component, ErrorInfo, ReactNode } from 'react';
-/**
- * Props for {@link ErrorBoundary}.
- */
-interface Props {
-    /** The subtree the boundary protects. Rendered as-is when no error is caught. */
+import { Component, type ErrorInfo, type ReactNode } from 'react';
+/** Props for {@link ErrorBoundary}. */
+export interface ErrorBoundaryProps {
+    /** The subtree to protect. Rendered unchanged until a descendant fails. */
     children: ReactNode;
+    /**
+     * Replaces the default message and retry button. A render callback receives only a reset
+     * action, not error diagnostics. Use it for localized content and application-specific
+     * recovery. An explicit `null` renders nothing; omission uses the default fallback.
+     */
+    fallback?: ReactNode | ((reset: () => void) => ReactNode);
+    /**
+     * Receives the thrown value and React component stack for application-controlled reporting.
+     * Replaces this boundary's default console reporter, but not React's own error reporting.
+     * Diagnostics may contain sensitive data; do not display them in the fallback.
+     */
+    onError?: (error: unknown, errorInfo: ErrorInfo) => void;
+    /**
+     * Runs synchronously before a user-requested retry so the host can clear the cause of the
+     * failure. Retry remounts only this boundary's children; it does not reload the page.
+     */
+    onReset?: () => void;
 }
-/**
- * Internal state captured when a child throws during render or commit.
- */
+/** Internal render state for the boundary; error diagnostics never enter its fallback state. */
 interface State {
-    /** True once a child has thrown; switches the render path to the fallback UI. */
+    /** Whether to show the fallback instead of the protected subtree. */
     hasError: boolean;
-    /** The thrown error. Held so the fallback UI can show message and stack. */
-    error: Error;
 }
 /**
- * React error boundary that catches errors thrown by its descendants during
- * render, lifecycle, and constructor calls. On error, it renders a minimal
- * inline diagnostic (message + stack) so the rest of the application keeps
- * working instead of crashing the whole tree.
+ * Isolates descendant render/lifecycle errors behind a safe message and a user-triggered retry.
+ * The default fallback never displays the thrown value or its stack. Diagnostics go to
+ * {@link ErrorBoundaryProps.onError}, or the console when no reporter is supplied.
  *
- * Wrap the boundary around any subtree whose failure should be isolated:
+ * Retry remounts children, discarding their local state but preserving the surrounding app.
+ * A persistent failure returns to the fallback; there is no automatic retry loop. Errors in
+ * event handlers, asynchronous work, server rendering, or this boundary itself are not caught.
  *
+ * @example
  * ```tsx
  * <ErrorBoundary>
  *     <RiskyFeature />
  * </ErrorBoundary>
  * ```
- *
- * Use one boundary per logical UI region rather than a single root-level one,
- * so failures stay scoped to the feature that caused them.
  */
-export declare class ErrorBoundary extends Component<Props, State> {
-    /** Initial state — no error captured. */
+export declare class ErrorBoundary extends Component<ErrorBoundaryProps, State> {
+    /** Starts with the protected content visible. */
     state: State;
     /**
-     * React lifecycle hook invoked when a descendant throws. Returns the
-     * next state, which switches the boundary into its fallback render path.
-     *
-     * @param error - The error thrown by the descendant.
+     * Switches to the fallback without inspecting or retaining the thrown value.
+     * @param _error - The value thrown by a descendant, which need not be an Error instance.
+     * @returns The render state used for the safe fallback.
      */
-    static getDerivedStateFromError(error: Error): State;
+    static getDerivedStateFromError(_error: unknown): State;
     /**
-     * React lifecycle hook invoked alongside {@link getDerivedStateFromError}.
-     * Forwards the error and React's component stack to the console so the
-     * failure is observable in DevTools.
-     *
-     * @param error - The error thrown by the descendant.
-     * @param errorInfo - React-supplied metadata including the component stack.
+     * Reports a caught failure without placing diagnostics in the rendered markup.
+     * @param error - The value thrown by a descendant.
+     * @param errorInfo - React's component stack information.
      */
-    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    componentDidCatch(error: unknown, errorInfo: ErrorInfo): void;
+    private reset;
     /**
-     * Renders the protected children until an error is captured, then renders the scoped
-     * diagnostic fallback.
-     *
-     * @returns The protected subtree or the fallback error content.
+     * Renders the children or the safe recovery UI. Native fallback markup deliberately avoids
+     * depending on a renderer/provider that may itself have caused the descendant failure.
+     * @returns The protected content or the configured fallback.
      */
     render(): string | number | bigint | boolean | import("react").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | Iterable<ReactNode> | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | import("react").ReactPortal | null | undefined> | null | undefined;
 }

package/dist/esm/Common/ErrorBoundary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorBoundary.d.ts","sourceRoot":"","sources":["../../../Common/ErrorBoundary.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAExD;;GAEG;AACH,UAAU,KAAK;IACX,iFAAiF;IACjF,QAAQ,EAAE,SAAS,CAAC;CACvB;AAED;;GAEG;AACH,UAAU,KAAK;IACX,iFAAiF;IACjF,QAAQ,EAAE,OAAO,CAAC;IAClB,4EAA4E;IAC5E,KAAK,EAAE,KAAK,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,qBAAa,aAAc,SAAQ,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;IACtD,yCAAyC;IAClC,KAAK,EAAE,KAAK,CAGjB;IAEF;;;;;OAKG;IACH,OAAc,wBAAwB,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAE1D;IAED;;;;;;;OAOG;IACI,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,QAE1D;IAED;;;;;OAKG;IACI,MAAM,gUAYZ;CACJ"}
+{"version":3,"file":"ErrorBoundary.d.ts","sourceRoot":"","sources":["../../../Common/ErrorBoundary.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAElE,uCAAuC;AACvC,MAAM,WAAW,kBAAkB;IAC/B,2EAA2E;IAC3E,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,KAAK,SAAS,CAAC,CAAC;IAC1D;;;;OAIG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACzD;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,gGAAgG;AAChG,UAAU,KAAK;IACX,qEAAqE;IACrE,QAAQ,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;GAeG;AACH,qBAAa,aAAc,SAAQ,SAAS,CAAC,kBAAkB,EAAE,KAAK,CAAC;IACnE,iDAAiD;IAC1C,KAAK,EAAE,KAAK,CAAuB;IAE1C;;;;OAIG;IACH,OAAc,wBAAwB,CAAC,MAAM,EAAE,OAAO,GAAG,KAAK,CAE7D;IAED;;;;OAIG;IACI,iBAAiB,CAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,QAM5D;IAED,OAAO,CAAC,KAAK,CAIX;IAEF;;;;OAIG;IACI,MAAM,gUAeZ;CACJ"}

package/dist/esm/Common/ErrorBoundary.js

@@ -2,21 +2,33 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { Component } from 'react';
 
 class ErrorBoundary extends Component {
-    state = {
-        hasError: false,
-        error: new Error(),
-    };
-    static getDerivedStateFromError(error) {
-        return { hasError: true, error: error };
+    state = { hasError: false };
+    static getDerivedStateFromError(_error) {
+        return { hasError: true };
     }
     componentDidCatch(error, errorInfo) {
-        console.error('Uncaught error:', error, errorInfo);
+        if (this.props.onError) {
+            this.props.onError(error, errorInfo);
+        }
+        else {
+            console.error('Uncaught error:', error, errorInfo);
+        }
     }
+    reset = () => {
+        if (!this.state.hasError)
+            return;
+        this.props.onReset?.();
+        this.setState({ hasError: false });
+    };
     render() {
-        if (this.state.hasError) {
-            return (jsxs("div", { className: 'cratis:p-4', children: [jsx("h1", { className: 'cratis:text-3xl cratis:m-3', children: "Error" }), jsx("p", { children: this.state.error.message }), jsx("p", { children: this.state.error.stack })] }));
-        }
-        return this.props.children;
+        if (!this.state.hasError)
+            return this.props.children;
+        const { fallback } = this.props;
+        if (typeof fallback === 'function')
+            return fallback(this.reset);
+        if (fallback !== undefined)
+            return fallback;
+        return (jsxs("div", { className: 'cratis:p-4', role: 'alert', children: [jsx("p", { children: "Something went wrong. Please try again." }), jsx("button", { type: 'button', className: 'cratis-button', onClick: this.reset, children: "Try again" })] }));
     }
 }
 

package/dist/esm/Common/ErrorBoundary.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorBoundary.js","sources":["../../../Common/ErrorBoundary.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":";;;AAwCM,MAAO,aAAc,SAAQ,SAAuB,CAAA;AAE/C,IAAA,KAAK,GAAU;AAClB,QAAA,QAAQ,EAAE,KAAK;QACf,KAAK,EAAE,IAAI,KAAK,EAAE;KACrB;IAQM,OAAO,wBAAwB,CAAC,KAAY,EAAA;QAC/C,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE;IAC3C;IAUO,iBAAiB,CAAC,KAAY,EAAE,SAAoB,EAAA;QACvD,OAAO,CAAC,KAAK,CAAC,iBAAiB,EAAE,KAAK,EAAE,SAAS,CAAC;IACtD;IAQO,MAAM,GAAA;AACT,QAAA,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;AACrB,YAAA,QACIA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,YAAY,EAAA,QAAA,EAAA,CACvBC,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,4BAA4B,EAAA,QAAA,EAAA,OAAA,EAAA,CAAW,EACrDA,GAAA,CAAA,GAAA,EAAA,EAAA,QAAA,EAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAA,CAAK,EACjCA,qBAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,EAAA,CAAK,CAAA,EAAA,CAC7B;QAEd;AAEA,QAAA,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ;IAC9B;AACH;;"}
+{"version":3,"file":"ErrorBoundary.js","sources":["../../../Common/ErrorBoundary.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":";;;AAkDM,MAAO,aAAc,SAAQ,SAAoC,CAAA;AAE5D,IAAA,KAAK,GAAU,EAAE,QAAQ,EAAE,KAAK,EAAE;IAOlC,OAAO,wBAAwB,CAAC,MAAe,EAAA;AAClD,QAAA,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE;IAC7B;IAOO,iBAAiB,CAAC,KAAc,EAAE,SAAoB,EAAA;AACzD,QAAA,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;YACpB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,SAAS,CAAC;QACxC;aAAO;YACH,OAAO,CAAC,KAAK,CAAC,iBAAiB,EAAE,KAAK,EAAE,SAAS,CAAC;QACtD;IACJ;IAEQ,KAAK,GAAG,MAAK;AACjB,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ;YAAE;AAC1B,QAAA,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI;QACtB,IAAI,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;AACtC,IAAA,CAAC;IAOM,MAAM,GAAA;AACT,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ;AAAE,YAAA,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ;AAEpD,QAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK;QAC/B,IAAI,OAAO,QAAQ,KAAK,UAAU;AAAE,YAAA,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;QAC/D,IAAI,QAAQ,KAAK,SAAS;AAAE,YAAA,OAAO,QAAQ;AAE3C,QAAA,QACIA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,YAAY,EAAC,IAAI,EAAC,OAAO,EAAA,QAAA,EAAA,CACpCC,GAAA,CAAA,GAAA,EAAA,EAAA,QAAA,EAAA,yCAAA,EAAA,CAA8C,EAC9CA,GAAA,CAAA,QAAA,EAAA,EAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAC,eAAe,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAA,QAAA,EAAA,WAAA,EAAA,CAE1D,CAAA,EAAA,CACP;IAEd;AACH;;"}

package/dist/esm/Common/Tabs.d.ts

@@ -0,0 +1,59 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+/** Attributes a consumer may hand to one {@link Tabs} part: class, style, title and data attributes. */
+export type TabsPartAttributes = Pick<HTMLAttributes<HTMLElement>, 'className' | 'style' | 'title'> & {
+    [dataAttribute: `data-${string}`]: string | number | boolean | undefined;
+};
+/** One tab in a {@link Tabs} set. */
+export interface TabItem {
+    /** Value identifying this tab. */
+    id: string;
+    /** Visible label. */
+    label: ReactNode;
+    /** Content revealed when this tab is selected. */
+    content: ReactNode;
+    /** Whether the tab cannot be selected. */
+    disabled?: boolean;
+}
+/** Stable Cratis-owned parts for styling a {@link Tabs} set. */
+export interface TabsParts {
+    /** The element wrapping list and panels. */
+    root?: TabsPartAttributes;
+    /** The tab list. */
+    list?: TabsPartAttributes;
+    /** One tab. */
+    tab?: TabsPartAttributes;
+    /** One panel. */
+    panel?: TabsPartAttributes;
+}
+/** Props for {@link Tabs}. */
+export interface TabsProps {
+    /** The tabs, in display order. */
+    tabs: TabItem[];
+    /** Id of the selected tab. */
+    value: string;
+    /** Called with the newly selected tab's id. */
+    onChange: (value: string) => void;
+    /** Whether every tab is disabled. */
+    disabled?: boolean;
+    /** Accessible name for the tab list, when no visible heading names it. */
+    'aria-label'?: string;
+    /** Id of the element naming the tab list. */
+    'aria-labelledby'?: string;
+    /** Extra class name for the root element. */
+    className?: string;
+    /** Cratis-owned per-part attributes. */
+    pt?: TabsParts;
+}
+/**
+ * A tab set: a list of tabs, each optionally revealing a panel.
+ *
+ * Arrow keys move between tabs and Home/End jump to the ends, with one tab stop for the whole list,
+ * which is what the `tablist` role promises and a row of ordinary buttons does not keep. Each tab is
+ * wired to its panel through `aria-controls`.
+ *
+ * Every tab owns a panel: the selected tab points at one, so a tab set without panels would name an
+ * element that is not there. When the choice drives a view rendered elsewhere it is a *value* rather
+ * than a panel — reach for `ToggleGroup`, which says so to assistive technology.
+ */
+export declare const Tabs: ({ tabs, value, onChange, disabled, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, className, pt, }: TabsProps) => import("react").JSX.Element;
+//# sourceMappingURL=Tabs.d.ts.map

package/dist/esm/Common/Tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../Common/Tabs.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,cAAc,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAUtE,wGAAwG;AACxG,MAAM,MAAM,kBAAkB,GAAG,IAAI,CACjC,cAAc,CAAC,WAAW,CAAC,EAC3B,WAAW,GAAG,OAAO,GAAG,OAAO,CAClC,GAAG;IACA,CAAC,aAAa,EAAE,QAAQ,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;CAC5E,CAAC;AAEF,qCAAqC;AACrC,MAAM,WAAW,OAAO;IACpB,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,qBAAqB;IACrB,KAAK,EAAE,SAAS,CAAC;IACjB,kDAAkD;IAClD,OAAO,EAAE,SAAS,CAAC;IACnB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,gEAAgE;AAChE,MAAM,WAAW,SAAS;IACtB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,oBAAoB;IACpB,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,eAAe;IACf,GAAG,CAAC,EAAE,kBAAkB,CAAC;IACzB,iBAAiB;IACjB,KAAK,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAKD,8BAA8B;AAC9B,MAAM,WAAW,SAAS;IACtB,kCAAkC;IAClC,IAAI,EAAE,OAAO,EAAE,CAAC;IAChB,8BAA8B;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0EAA0E;IAC1E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,EAAE,CAAC,EAAE,SAAS,CAAC;CAClB;AAKD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,IAAI,oHASd,SAAS,gCA6CX,CAAC"}

package/dist/esm/Common/Tabs.js

@@ -0,0 +1,8 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Tabs as Tabs$1, TabList, Tab, TabPanel } from 'react-aria-components/Tabs';
+
+const classNames = (...values) => values.filter(Boolean).join(' ');
+const Tabs = ({ tabs, value, onChange, disabled = false, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, className, pt, }) => (jsxs(Tabs$1, { ...pt?.root, selectedKey: value, onSelectionChange: (key) => onChange(String(key)), isDisabled: disabled, className: classNames('cratis-tabs', pt?.root?.className, className), "data-cratis-part": 'root', "data-disabled": disabled || undefined, children: [jsx(TabList, { ...pt?.list, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className: classNames('cratis-tabs__list', pt?.list?.className), "data-cratis-part": 'list', children: tabs.map((tab) => (jsx(Tab, { ...pt?.tab, id: tab.id, isDisabled: tab.disabled, className: classNames('cratis-tabs__tab', pt?.tab?.className), "data-cratis-part": 'tab', "data-selected": tab.id === value || undefined, "data-disabled": disabled || tab.disabled || undefined, children: tab.label }, tab.id))) }), tabs.map((tab) => (jsx(TabPanel, { ...pt?.panel, id: tab.id, className: classNames('cratis-tabs__panel', pt?.panel?.className), "data-cratis-part": 'panel', "data-selected": tab.id === value || undefined, children: tab.content }, tab.id)))] }));
+
+export { Tabs };
+//# sourceMappingURL=Tabs.js.map

package/dist/esm/Common/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sources":["../../../Common/Tabs.tsx"],"sourcesContent":[null],"names":["_jsxs","AriaTabs","_jsx","AriaTabList","AriaTab","AriaTabPanel"],"mappings":";;;AAoEA,MAAM,UAAU,GAAG,CAAC,GAAG,MAAiC,KACpD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;AAa7B,MAAM,IAAI,GAAG,CAAC,EACjB,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,SAAS,EACT,EAAE,GACM,MACRA,IAAA,CAACC,MAAQ,EAAA,EAAA,GACD,EAAE,EAAE,IAAI,EACZ,WAAW,EAAE,KAAK,EAClB,iBAAiB,EAAE,CAAC,GAAQ,KAAK,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EACtD,UAAU,EAAE,QAAQ,EACpB,SAAS,EAAE,UAAU,CAAC,aAAa,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,CAAC,EAAA,kBAAA,EACnD,MAAM,EAAA,eAAA,EACR,QAAQ,IAAI,SAAS,EAAA,QAAA,EAAA,CAEpCC,GAAA,CAACC,OAAW,EAAA,EAAA,GACJ,EAAE,EAAE,IAAI,EAAA,YAAA,EACA,SAAS,EAAA,iBAAA,EACJ,cAAc,EAC/B,SAAS,EAAE,UAAU,CAAC,mBAAmB,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,CAAC,EAAA,kBAAA,EAC9C,MAAM,EAAA,QAAA,EAEtB,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MACVD,IAACE,GAAO,EAAA,EAAA,GAEA,EAAE,EAAE,GAAG,EACX,EAAE,EAAE,GAAG,CAAC,EAAE,EACV,UAAU,EAAE,GAAG,CAAC,QAAQ,EACxB,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAE,EAAE,EAAE,GAAG,EAAE,SAAS,CAAC,EAAA,kBAAA,EAC5C,KAAK,EAAA,eAAA,EACP,GAAG,CAAC,EAAE,KAAK,KAAK,IAAI,SAAS,EAAA,eAAA,EAC7B,QAAQ,IAAI,GAAG,CAAC,QAAQ,IAAI,SAAS,EAAA,QAAA,EAEnD,GAAG,CAAC,KAAK,EAAA,EATL,GAAG,CAAC,EAAE,CAUL,CACb,CAAC,EAAA,CACQ,EACb,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MACVF,GAAA,CAACG,QAAY,EAAA,EAAA,GAEL,EAAE,EAAE,KAAK,EACb,EAAE,EAAE,GAAG,CAAC,EAAE,EACV,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,CAAC,EAAA,kBAAA,EAChD,OAAO,EAAA,eAAA,EACT,GAAG,CAAC,EAAE,KAAK,KAAK,IAAI,SAAS,EAAA,QAAA,EAE3C,GAAG,CAAC,OAAO,EAAA,EAPP,GAAG,CAAC,EAAE,CAQA,CAClB,CAAC,CAAA,EAAA,CACK;;"}

package/dist/esm/Common/TagGroup.d.ts

@@ -0,0 +1,68 @@
+import { type HTMLAttributes, type InputHTMLAttributes } from 'react';
+/** Attributes a consumer may hand to one {@link TagGroup} part: class, style, title and data attributes. */
+export type TagGroupPartAttributes = Pick<HTMLAttributes<HTMLElement>, 'className' | 'style' | 'title'> & {
+    [dataAttribute: `data-${string}`]: string | number | boolean | undefined;
+};
+/** Stable Cratis-owned parts for styling a {@link TagGroup}. */
+export interface TagGroupParts {
+    /** The element wrapping the tags and the entry. */
+    root?: TagGroupPartAttributes;
+    /** The tag list. */
+    list?: TagGroupPartAttributes;
+    /** One tag. */
+    tag?: TagGroupPartAttributes;
+    /** A tag's remove button. */
+    remove?: TagGroupPartAttributes;
+    /** The text entry that adds a value. */
+    input?: InputHTMLAttributes<HTMLInputElement>;
+}
+/** Props for {@link TagGroup}. */
+export interface TagGroupProps {
+    /** Current values, in display order. */
+    value: string[];
+    /** Called with the next list whenever a value is added or removed. */
+    onChange: (value: string[]) => void;
+    /**
+     * Whether a text entry is offered for adding values. A group without one is a read-only display
+     * of removable tags.
+     */
+    editable?: boolean;
+    /** Placeholder for the text entry. */
+    placeholder?: string;
+    /**
+     * Characters that commit the typed value in addition to Enter. Defaults to a comma. A pasted
+     * string is split on the same separators, so pasting a comma-separated list adds each value.
+     */
+    separators?: string[];
+    /** Whether a duplicate of an existing value is accepted. Defaults to `false`. */
+    allowDuplicates?: boolean;
+    /** Whether the whole control is disabled. */
+    disabled?: boolean;
+    /** Accessible name for the group. */
+    'aria-label'?: string;
+    /** Id of the element naming the group. */
+    'aria-labelledby'?: string;
+    /** Id of the element describing the control — typically a field's error or hint text. */
+    'aria-describedby'?: string;
+    /** Marks the text entry invalid for assistive technology. */
+    invalid?: boolean;
+    /** Id forwarded to the text entry so an external `<label htmlFor>` associates with it. */
+    id?: string;
+    /** Accessible label for a tag's remove button. Receives the tag's value. */
+    removeLabel?: (value: string) => string;
+    /** Extra class name for the root element. */
+    className?: string;
+    /** Cratis-owned per-part attributes. */
+    pt?: TagGroupParts;
+}
+/**
+ * A group of removable values with an optional text entry — the control behind a tag or chips field.
+ *
+ * Every tag is reachable with the arrow keys and removable with Backspace or Delete, which is what
+ * the `grid`/`row` semantics React Aria gives a tag group promise; a row of `<span>`s with a close
+ * button cannot be operated from the keyboard at all. In the entry, Enter and each configured
+ * separator commit the typed value, Backspace on an empty entry removes the last tag, and a pasted
+ * string is split on the separators.
+ */
+export declare const TagGroup: ({ value, onChange, editable, placeholder, separators, allowDuplicates, disabled, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, invalid, id, removeLabel, className, pt, }: TagGroupProps) => import("react").JSX.Element;
+//# sourceMappingURL=TagGroup.d.ts.map

package/dist/esm/Common/TagGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagGroup.d.ts","sourceRoot":"","sources":["../../../Common/TagGroup.tsx"],"names":[],"mappings":"AAGA,OAAO,EAGH,KAAK,cAAc,EACnB,KAAK,mBAAmB,EAE3B,MAAM,OAAO,CAAC;AAUf,4GAA4G;AAC5G,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACrC,cAAc,CAAC,WAAW,CAAC,EAC3B,WAAW,GAAG,OAAO,GAAG,OAAO,CAClC,GAAG;IACA,CAAC,aAAa,EAAE,QAAQ,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;CAC5E,CAAC;AAEF,gEAAgE;AAChE,MAAM,WAAW,aAAa;IAC1B,mDAAmD;IACnD,IAAI,CAAC,EAAE,sBAAsB,CAAC;IAC9B,oBAAoB;IACpB,IAAI,CAAC,EAAE,sBAAsB,CAAC;IAC9B,eAAe;IACf,GAAG,CAAC,EAAE,sBAAsB,CAAC;IAC7B,6BAA6B;IAC7B,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC,wCAAwC;IACxC,KAAK,CAAC,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;CACjD;AAKD,kCAAkC;AAClC,MAAM,WAAW,aAAa;IAC1B,wCAAwC;IACxC,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,sEAAsE;IACtE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,iFAAiF;IACjF,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qCAAqC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0CAA0C;IAC1C,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,yFAAyF;IACzF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6DAA6D;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0FAA0F;IAC1F,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,4EAA4E;IAC5E,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,EAAE,CAAC,EAAE,aAAa,CAAC;CACtB;AAKD;;;;;;;;GAQG;AACH,eAAO,MAAM,QAAQ,iOAgBlB,aAAa,gCAkHf,CAAC"}

package/dist/esm/Common/TagGroup.js

@@ -0,0 +1,53 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useId, useState } from 'react';
+import { TagGroup as TagGroup$1, TagList, Tag } from 'react-aria-components/TagGroup';
+import { Button } from 'react-aria-components/Button';
+
+const classNames = (...values) => values.filter(Boolean).join(' ');
+const TagGroup = ({ value, onChange, editable = true, placeholder, separators = [','], allowDuplicates = false, disabled = false, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, invalid = false, id, removeLabel, className, pt, }) => {
+    const generatedId = useId();
+    const inputId = id ?? `cratis-tag-group-${generatedId}`;
+    const [draft, setDraft] = useState('');
+    const add = (candidates) => {
+        const next = [...value];
+        for (const candidate of candidates) {
+            const trimmed = candidate.trim();
+            if (!trimmed)
+                continue;
+            if (!allowDuplicates && next.includes(trimmed))
+                continue;
+            next.push(trimmed);
+        }
+        if (next.length !== value.length)
+            onChange(next);
+        setDraft('');
+    };
+    const remove = (keys) => onChange(value.filter((entry) => !keys.has(entry)));
+    const splitOn = (text) => separators.length === 0
+        ? [text]
+        : text.split(new RegExp(`[${separators.map(escapeForClass).join('')}]`));
+    return (jsxs("div", { ...pt?.root, className: classNames('cratis-tag-group', pt?.root?.className, className), "data-cratis-part": 'root', "data-disabled": disabled || undefined, "data-invalid": invalid || undefined, children: [jsx(TagGroup$1, { selectionMode: 'none', onRemove: remove, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, children: jsx(TagList, { ...pt?.list, items: value.map((entry) => ({ id: entry })), className: classNames('cratis-tag-group__list', pt?.list?.className), "data-cratis-part": 'list', children: (item) => (jsxs(Tag, { ...pt?.tag, id: item.id, textValue: item.id, className: classNames('cratis-tag-group__tag', pt?.tag?.className), "data-cratis-part": 'tag', "data-disabled": disabled || undefined, children: [jsx("span", { className: 'cratis-tag-group__tag-label', children: item.id }), !disabled && (jsx(Button, { ...pt?.remove, slot: 'remove', "aria-label": removeLabel?.(item.id), className: classNames('cratis-tag-group__remove', pt?.remove?.className), "data-cratis-part": 'remove', children: jsx("span", { "aria-hidden": 'true', children: "\u00D7" }) }))] })) }) }), editable && (jsx("input", { ...pt?.input, id: inputId, type: 'text', value: draft, disabled: disabled, placeholder: placeholder, "aria-label": ariaLabelledBy ? undefined : ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": invalid || undefined, className: classNames('cratis-tag-group__input', pt?.input?.className), "data-cratis-part": 'input', "data-invalid": invalid || undefined, onChange: (event) => setDraft(event.currentTarget.value), onKeyDown: (event) => {
+                    if (event.key === 'Enter' || separators.includes(event.key)) {
+                        event.preventDefault();
+                        add([draft]);
+                    }
+                    else if (event.key === 'Backspace' &&
+                        draft === '' &&
+                        value.length > 0) {
+                        onChange(value.slice(0, -1));
+                    }
+                }, onPaste: (event) => {
+                    const text = event.clipboardData.getData('text');
+                    if (!separators.some((separator) => text.includes(separator)))
+                        return;
+                    event.preventDefault();
+                    add(splitOn(text));
+                }, onBlur: () => {
+                    if (draft.trim())
+                        add([draft]);
+                } }))] }));
+};
+const escapeForClass = (separator) => separator.replace(/[\\\]^-]/gu, '\\$&');
+
+export { TagGroup };
+//# sourceMappingURL=TagGroup.js.map

package/dist/esm/Common/TagGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagGroup.js","sources":["../../../Common/TagGroup.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx","AriaTagGroup","AriaTagList","AriaTag","AriaButton"],"mappings":"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"}

package/dist/esm/Common/ToggleGroup.d.ts

@@ -0,0 +1,62 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+/** Attributes a consumer may hand to one {@link ToggleGroup} part: class, style, title and data attributes. */
+export type ToggleGroupPartAttributes = Pick<HTMLAttributes<HTMLElement>, 'className' | 'style' | 'title'> & {
+    [dataAttribute: `data-${string}`]: string | number | boolean | undefined;
+};
+/** One choice in a {@link ToggleGroup}. */
+export interface ToggleGroupOption {
+    /** Value this option selects. */
+    value: string;
+    /** Visible label. */
+    label: ReactNode;
+    /** Content rendered before the label — an icon, a swatch. Decorative. */
+    icon?: ReactNode;
+    /** Whether this option cannot be chosen. */
+    disabled?: boolean;
+}
+/** Stable Cratis-owned parts for styling a {@link ToggleGroup}. */
+export interface ToggleGroupParts {
+    /** The group element. */
+    root?: ToggleGroupPartAttributes;
+    /** One selectable option. */
+    option?: ToggleGroupPartAttributes;
+    /** An option's leading icon wrapper, rendered only for an option that has one. */
+    icon?: ToggleGroupPartAttributes;
+    /** An option's label. */
+    label?: ToggleGroupPartAttributes;
+}
+/** Props for {@link ToggleGroup}. */
+export interface ToggleGroupProps {
+    /** The choices, in display order. Two to four is the shape this control is for. */
+    options: ToggleGroupOption[];
+    /** Currently selected value. */
+    value: string;
+    /** Called with the newly selected value. A click on the selected option is ignored. */
+    onChange: (value: string) => void;
+    /** Whether every option is disabled. */
+    disabled?: boolean;
+    /**
+     * Id of the element naming this control. A group has no single labelable element, so an external
+     * `<label>` associates by id rather than `htmlFor`.
+     */
+    'aria-labelledby'?: string;
+    /** Accessible name, when no visible label names the control. */
+    'aria-label'?: string;
+    /** Id of the element describing the control — typically a field's error or hint text. */
+    'aria-describedby'?: string;
+    /** Marks the control invalid for assistive technology. */
+    invalid?: boolean;
+    /** Extra class name for the group element. */
+    className?: string;
+    /** Cratis-owned per-part attributes. */
+    pt?: ToggleGroupParts;
+}
+/**
+ * A single-selection group of exclusive choices — a segmented control.
+ *
+ * This is a *value* choice, not a panel switcher: it carries `radiogroup`/`radio` semantics from
+ * React Aria's `ToggleButtonGroup`, not `tablist`/`tab`, and the arrow keys those semantics promise
+ * move the selection. Reach for `Tabs` when the choice reveals a panel of content instead.
+ */
+export declare const ToggleGroup: ({ options, value, onChange, disabled, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, invalid, className, pt, }: ToggleGroupProps) => import("react").JSX.Element;
+//# sourceMappingURL=ToggleGroup.d.ts.map

package/dist/esm/Common/ToggleGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleGroup.d.ts","sourceRoot":"","sources":["../../../Common/ToggleGroup.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,cAAc,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQtE,+GAA+G;AAC/G,MAAM,MAAM,yBAAyB,GAAG,IAAI,CACxC,cAAc,CAAC,WAAW,CAAC,EAC3B,WAAW,GAAG,OAAO,GAAG,OAAO,CAClC,GAAG;IACA,CAAC,aAAa,EAAE,QAAQ,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;CAC5E,CAAC;AAEF,2CAA2C;AAC3C,MAAM,WAAW,iBAAiB;IAC9B,iCAAiC;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,KAAK,EAAE,SAAS,CAAC;IACjB,yEAAyE;IACzE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,mEAAmE;AACnE,MAAM,WAAW,gBAAgB;IAC7B,yBAAyB;IACzB,IAAI,CAAC,EAAE,yBAAyB,CAAC;IACjC,6BAA6B;IAC7B,MAAM,CAAC,EAAE,yBAAyB,CAAC;IACnC,kFAAkF;IAClF,IAAI,CAAC,EAAE,yBAAyB,CAAC;IACjC,yBAAyB;IACzB,KAAK,CAAC,EAAE,yBAAyB,CAAC;CACrC;AAQD,qCAAqC;AACrC,MAAM,WAAW,gBAAgB;IAC7B,mFAAmF;IACnF,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAC7B,gCAAgC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,uFAAuF;IACvF,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,gEAAgE;IAChE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yFAAyF;IACzF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,0DAA0D;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,EAAE,CAAC,EAAE,gBAAgB,CAAC;CACzB;AAKD;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,qKAWrB,gBAAgB,gCAwDlB,CAAC"}

package/dist/esm/Common/ToggleGroup.js

@@ -0,0 +1,12 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { ToggleButtonGroup, ToggleButton } from 'react-aria-components/ToggleButtonGroup';
+
+const classNames = (...values) => values.filter(Boolean).join(' ');
+const ToggleGroup = ({ options, value, onChange, disabled = false, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, invalid = false, className, pt, }) => (jsx(ToggleButtonGroup, { ...pt?.root, selectionMode: 'single', disallowEmptySelection: true, selectedKeys: [value], isDisabled: disabled, onSelectionChange: (keys) => {
+        const [selected] = [...keys];
+        if (selected !== undefined && selected !== value)
+            onChange(String(selected));
+    }, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, className: classNames('cratis-toggle-group', pt?.root?.className, className), "data-cratis-part": 'root', "data-disabled": disabled || undefined, "data-invalid": invalid || undefined, children: options.map((option) => (jsxs(ToggleButton, { ...pt?.option, id: option.value, isDisabled: disabled || option.disabled, className: classNames('cratis-toggle-group__option', pt?.option?.className), "data-cratis-part": 'option', "data-selected": option.value === value || undefined, "data-disabled": disabled || option.disabled || undefined, "data-invalid": invalid || undefined, children: [option.icon !== undefined && (jsx("span", { ...pt?.icon, "aria-hidden": 'true', className: classNames('cratis-toggle-group__icon', pt?.icon?.className), "data-cratis-part": 'icon', children: option.icon })), jsx("span", { ...pt?.label, className: classNames('cratis-toggle-group__label', pt?.label?.className), "data-cratis-part": 'label', children: option.label })] }, option.value))) }));
+
+export { ToggleGroup };
+//# sourceMappingURL=ToggleGroup.js.map

package/dist/esm/Common/ToggleGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleGroup.js","sources":["../../../Common/ToggleGroup.tsx"],"sourcesContent":[null],"names":["_jsx","AriaToggleButtonGroup","_jsxs","AriaToggleButton"],"mappings":";;;AA4EA,MAAM,UAAU,GAAG,CAAC,GAAG,MAAiC,KACpD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;AAS7B,MAAM,WAAW,GAAG,CAAC,EACxB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,kBAAkB,EAAE,eAAe,EACnC,OAAO,GAAG,KAAK,EACf,SAAS,EACT,EAAE,GACa,MACfA,IAACC,iBAAqB,EAAA,EAAA,GACd,EAAE,EAAE,IAAI,EACZ,aAAa,EAAC,QAAQ,EACtB,sBAAsB,EAAA,IAAA,EACtB,YAAY,EAAE,CAAC,KAAK,CAAC,EACrB,UAAU,EAAE,QAAQ,EACpB,iBAAiB,EAAE,CAAC,IAAc,KAAI;QAGlC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;AAC5B,QAAA,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,KAAK;AAAE,YAAA,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;AAChF,IAAA,CAAC,gBACW,SAAS,EAAA,iBAAA,EACJ,cAAc,EAAA,kBAAA,EACb,eAAe,EACjC,SAAS,EAAE,UAAU,CAAC,qBAAqB,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,CAAC,sBAC3D,MAAM,EAAA,eAAA,EACR,QAAQ,IAAI,SAAS,EAAA,cAAA,EACtB,OAAO,IAAI,SAAS,YAEjC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MAChBC,KAACC,YAAgB,EAAA,EAAA,GAET,EAAE,EAAE,MAAM,EACd,EAAE,EAAE,MAAM,CAAC,KAAK,EAChB,UAAU,EAAE,QAAQ,IAAI,MAAM,CAAC,QAAQ,EACvC,SAAS,EAAE,UAAU,CAAC,6BAA6B,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,EAAA,kBAAA,EAC1D,QAAQ,mBACV,MAAM,CAAC,KAAK,KAAK,KAAK,IAAI,SAAS,mBACnC,QAAQ,IAAI,MAAM,CAAC,QAAQ,IAAI,SAAS,EAAA,cAAA,EACzC,OAAO,IAAI,SAAS,EAAA,QAAA,EAAA,CAEjC,MAAM,CAAC,IAAI,KAAK,SAAS,KACtBH,GAAA,CAAA,MAAA,EAAA,EAAA,GACQ,EAAE,EAAE,IAAI,EAAA,aAAA,EACA,MAAM,EAClB,SAAS,EAAE,UAAU,CACjB,2BAA2B,EAC3B,EAAE,EAAE,IAAI,EAAE,SAAS,CACtB,EAAA,kBAAA,EACgB,MAAM,EAAA,QAAA,EAEtB,MAAM,CAAC,IAAI,EAAA,CACT,CACV,EACDA,GAAA,CAAA,MAAA,EAAA,EAAA,GACQ,EAAE,EAAE,KAAK,EACb,SAAS,EAAE,UAAU,CAAC,4BAA4B,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,CAAC,EAAA,kBAAA,EACxD,OAAO,EAAA,QAAA,EAEvB,MAAM,CAAC,KAAK,EAAA,CACV,CAAA,EAAA,EA7BF,MAAM,CAAC,KAAK,CA8BF,CACtB,CAAC,EAAA,CACkB;;"}

package/dist/esm/Common/index.d.ts

@@ -5,6 +5,10 @@ export * from './ErrorBoundary.js';
 export * from './Icon.js';
 export * from './normalizeIconClass.js';
 export * from './ComboBox.js';
+export * from './ToggleGroup.js';
+export * from './Tabs.js';
+export * from './TagGroup.js';
+export * from './Breadcrumbs.js';
 export * from './NumberInput.js';
 export * from './NumberInputCommitReason.js';
 export * from './NumberInputPartAttributes.js';

package/dist/esm/Common/index.js

@@ -5,6 +5,10 @@ export { ErrorBoundary } from './ErrorBoundary.js';
 export { IconDisplay } from './Icon.js';
 export { normalizeIconClass } from './normalizeIconClass.js';
 export { ComboBox } from './ComboBox.js';
+export { ToggleGroup } from './ToggleGroup.js';
+export { Tabs } from './Tabs.js';
+export { TagGroup } from './TagGroup.js';
+export { Breadcrumbs } from './Breadcrumbs.js';
 export { NumberInput } from './NumberInput.js';
 export { NumberInputCommitReason } from './NumberInputCommitReason.js';
 export { Page } from './Page.js';

package/dist/esm/Common/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}