@mechane-ai/elements 0.5.1 → 0.7.0

package/dist/layout.js

@@ -1,5 +1,5 @@
 import { a as e } from "./src-CfDf8TY8.js";
-import { i as t, n, v as r, y as i } from "./src-CbYaLvhD.js";
+import { i as t, n, v as r, y as i } from "./src-BkCsvZGi.js";
 import { mergeProps as a } from "@base-ui/react/merge-props";
 import "@stylexjs/stylex";
 import { createContext as o, useContext as s, useEffect as c, useId as l, useRef as u, useState as d } from "react";
@@ -292,17 +292,59 @@ function P({ children: e }) {
 		children: e
 	});
 }
+// packages/layout/src/focus-page.tsx
+function F({ children: e }) {
+	return /* @__PURE__ */ p("main", {
+		id: "main",
+		tabIndex: -1,
+		className: "x9f619 x1ov3xa9 xrvj5dj x1ku5rj1 x1jvlu93 xpvm0e4 xbixft x1hz01jw xtqrqnz x1778rvt xvmahel",
+		children: /* @__PURE__ */ p("div", {
+			className: "xh8yej3 xxc7z9f xrvj5dj x1j825kq",
+			children: e
+		})
+	});
+}
+// packages/layout/src/workbench.tsx
+function I({ header: e, children: t, inspector: n }) {
+	return /* @__PURE__ */ m("div", {
+		className: "x78zum5 xdt5ytf x1b7uu3i xeuugli x2lwn1j",
+		children: [/* @__PURE__ */ p("div", {
+			className: "x1ydxw8w xnx3t7k xso031l x1q0q8m5 x1qndepd",
+			children: e
+		}), /* @__PURE__ */ m("div", {
+			className: "x78zum5 x98rzlu xeuugli x2lwn1j xb3r6kr",
+			children: [/* @__PURE__ */ p("div", {
+				...{
+					0: { className: "x78zum5 x98rzlu xdt5ytf xeuugli x2lwn1j" },
+					1: { className: "x98rzlu xdt5ytf xeuugli x2lwn1j x78zum5 x1g9v1si" }
+				}[n != null | 0],
+				children: t
+			}), n != null && /* @__PURE__ */ p("aside", {
+				"aria-label": "Execution inspector",
+				className: "x9f619 x1peuizl x1tama1k x2lah0s x1odjw0f x1c8xbx5 xpvm0e4 xe0pwq x19ypqd9 x1l3ounx",
+				children: n
+			})]
+		})]
+	});
+}
+function L({ children: e }) {
+	return /* @__PURE__ */ p("div", {
+		className: "x1odjw0f x98rzlu xeuugli x2lwn1j x1jvlu93",
+		children: e
+	});
+}
+function R({ children: e }) {
+	return /* @__PURE__ */ p("div", {
+		className: "x2lah0s x1c8xbx5 x178xt8z x13fuv20 xhjagg4 xpvm0e4",
+		children: e
+	});
+}
 // packages/layout/src/page-toolbar.tsx
-var F = { action: {
-	kZKoxP: "x5yr21d",
-	k7Eaqz: "x167izq3",
-	k8WAf4: "xt970qd",
-	kg3NbH: "x1m92p3w",
-	kaIpWk: "x2u8bby",
+var z = { action: {
 	kOIVth: "x1hnptsi",
 	$$css: !0
 } };
-function I({ title: e, actions: t, breadcrumb: n = !1, navigation: r = !0 }) {
+function B({ title: e, actions: t, breadcrumb: n = !1, navigation: r = !0 }) {
 	return /* @__PURE__ */ m("div", {
 		className: "x9f619 x78zum5 x12h1iku x14ut1dr x1qjc9v5 xcn9na3 x2lah0s xso031l x1q0q8m5 x1qndepd xpvm0e4 xbixft x1hz01jw x12myhf4 x1778rvt xvmahel xeuugli",
 		children: [
@@ -317,22 +359,22 @@ function I({ title: e, actions: t, breadcrumb: n = !1, navigation: r = !0 }) {
 				})
 			}),
 			t != null && /* @__PURE__ */ p("div", {
-				className: "x78zum5 x1qjc9v5 xeuugli x2lah0s x8x9d4c",
+				className: "x78zum5 x6s0dn4 xunmzkg x5g2kb4 xeuugli x2lah0s x8x9d4c",
 				children: t
 			})
 		]
 	});
 }
-function L({ icon: e, children: t, ...n }) {
+function V({ icon: e, children: t, ...n }) {
 	let i = e != null;
 	return /* @__PURE__ */ p("div", {
-		className: "x9f619 x78zum5 x1qjc9v5 xeuugli xe0pwq x19ypqd9 x1l3ounx",
+		className: "x9f619 x78zum5 x1qjc9v5 xeuugli",
 		children: /* @__PURE__ */ m(r, {
 			...n,
 			variant: "ghost",
-			size: "md",
+			size: "sm",
 			"aria-label": n["aria-label"] ?? (typeof t == "string" ? t : void 0),
-			xstyle: F.action,
+			xstyle: z.action,
 			children: [e, i ? /* @__PURE__ */ p("span", {
 				className: "xeuugli xb3r6kr xlyipyv xuxw1ft xt0psk2 xlllsrz",
 				children: t
@@ -341,14 +383,14 @@ function L({ icon: e, children: t, ...n }) {
 	});
 }
 // packages/layout/src/record-page.tsx
-function R({ children: e }) {
+function H({ children: e }) {
 	return /* @__PURE__ */ p("div", {
 		className: "x78zum5 xdt5ytf xeuugli xbixft x1hz01jw xtqrqnz x1778rvt xvmahel",
 		children: e
 	});
 }
-function z({ backLabel: e, backHref: t, onBack: n, actions: r, navigation: i = !0 }) {
-	return /* @__PURE__ */ p(I, {
+function U({ backLabel: e, backHref: t, onBack: n, actions: r, navigation: i = !0 }) {
+	return /* @__PURE__ */ p(B, {
 		breadcrumb: !0,
 		navigation: i,
 		actions: r,
@@ -367,19 +409,19 @@ function z({ backLabel: e, backHref: t, onBack: n, actions: r, navigation: i = !
 		})
 	});
 }
-function B({ children: e }) {
+function W({ children: e }) {
 	return /* @__PURE__ */ p(P, { children: /* @__PURE__ */ p("div", {
 		className: "x78zum5 x1a02dak x1cy8zhl x1m6b44x xeuugli",
 		children: e
 	}) });
 }
-function V({ children: e }) {
+function G({ children: e }) {
 	return /* @__PURE__ */ p("div", {
 		className: "x78zum5 xdt5ytf x1ewej1i x1iyjqo2 x1j825kq xeuugli",
 		children: e
 	});
 }
-function H({ title: e, description: r, icon: i, titleRef: a }) {
+function K({ title: e, description: r, icon: i, titleRef: a }) {
 	return /* @__PURE__ */ m("header", {
 		className: "xrvj5dj x1n8ia3y xeuugli",
 		children: [/* @__PURE__ */ m("div", {
@@ -396,23 +438,23 @@ function H({ title: e, description: r, icon: i, titleRef: a }) {
 		}), r != null && /* @__PURE__ */ p(t, { children: r })]
 	});
 }
-function U({ children: e, label: t = "Properties" }) {
+function q({ children: e, label: t = "Properties" }) {
 	return /* @__PURE__ */ p("aside", {
 		"aria-label": t,
 		className: "x78zum5 xdt5ytf x1irul0l x1iyjqo2 x1j825kq xeuugli",
 		children: e
 	});
 }
-var W = {
-	Root: R,
-	Toolbar: z,
-	Body: B,
-	Content: V,
-	Header: H,
-	Aside: U
+var J = {
+	Root: H,
+	Toolbar: U,
+	Body: W,
+	Content: G,
+	Header: K,
+	Aside: q
 };
 // packages/layout/src/resizable.tsx
-function G({ orientation: e = "horizontal", initialSizes: t, onSizesChange: n, disabled: r, ref: i, ...o }) {
+function Y({ orientation: e = "horizontal", initialSizes: t, onSizesChange: n, disabled: r, ref: i, ...o }) {
 	return /* @__PURE__ */ p(v, {
 		orientation: e,
 		defaultLayout: t,
@@ -428,7 +470,7 @@ function G({ orientation: e = "horizontal", initialSizes: t, onSizesChange: n, d
 		...a({ className: "xeuugli x2lwn1j xh8yej3 x5yr21d" }, o)
 	});
 }
-function K({ id: e, initialSizePercent: t, minimumSizePercent: n = 10, maximumSizePercent: r = 100, collapsible: i = !1, ref: o, ...s }) {
+function X({ id: e, initialSizePercent: t, minimumSizePercent: n = 10, maximumSizePercent: r = 100, collapsible: i = !1, ref: o, ...s }) {
 	return /* @__PURE__ */ p(y, {
 		id: e,
 		defaultSize: t === void 0 ? void 0 : `${t}%`,
@@ -439,15 +481,15 @@ function K({ id: e, initialSizePercent: t, minimumSizePercent: n = 10, maximumSi
 		...a({ className: "xeuugli x2lwn1j xysyzu8" }, s)
 	});
 }
-function q({ ref: e, ...t }) {
+function Z({ ref: e, ...t }) {
 	return /* @__PURE__ */ p(b, {
 		elementRef: e,
 		...a({ className: "x1fa40ue x1i1rx1s xgc0pbm xir5lan xfaai28 x1rbdpqn x8wp5i9 x13qnu6 x9v5kkp x19rmrnh x13iak60" }, t)
 	});
 }
-var J = {
-	Root: G,
-	Pane: K,
-	Handle: q
+var Q = {
+	Root: Y,
+	Pane: X,
+	Handle: Z
 };
-export { N as AppShell, P as DetailPage, E as Navigation, D as NavigationItem, O as NavigationLink, I as PageToolbar, W as RecordPage, J as Resizable, A as SidebarFooter, k as SidebarLabel, L as ToolbarAction };
+export { N as AppShell, P as DetailPage, F as FocusPage, E as Navigation, D as NavigationItem, O as NavigationLink, B as PageToolbar, J as RecordPage, Q as Resizable, A as SidebarFooter, k as SidebarLabel, V as ToolbarAction, I as Workbench, R as WorkbenchFooter, L as WorkbenchScroll };

package/dist/navigation/commands.js

@@ -1,4 +1,4 @@
-import { l as e } from "../src-CjnbzSgq.js";
+import { l as e } from "../src-DjTM64tN.js";
 import { s as t } from "../src-CfDf8TY8.js";
 import { n } from "../navigation-yxK3iQXo.js";
 import "@stylexjs/stylex";

package/dist/packages/ai/src/prompt-input.d.ts

@@ -14,6 +14,7 @@ export type PromptInputProps = {
     readonly submitLabel?: string;
     readonly pendingLabel?: string;
     readonly enterBehavior?: 'newline' | 'submit';
+    readonly compact?: boolean;
     readonly description?: ReactNode;
     readonly error?: string | undefined;
     readonly controls?: ReactNode;
@@ -22,4 +23,4 @@ export type PromptInputProps = {
     readonly stopPending?: boolean;
     readonly stopLabel?: string;
 };
-export declare function PromptInput({ label, value, onValueChange, onSubmit, name, placeholder, maxLength, required, pending, disabled, submitDisabled, submitLabel, pendingLabel, enterBehavior, description, error, controls, attachments, onStop, stopPending, stopLabel, }: PromptInputProps): ReactNode;
+export declare function PromptInput({ label, value, onValueChange, onSubmit, name, placeholder, maxLength, required, pending, disabled, submitDisabled, submitLabel, pendingLabel, enterBehavior, compact, description, error, controls, attachments, onStop, stopPending, stopLabel, }: PromptInputProps): ReactNode;

package/dist/packages/charts/src/cartesian/bar-chart.d.ts

@@ -13,6 +13,7 @@ export type BarChartProps = {
     readonly categories: ReadonlyArray<{
         readonly id: string;
         readonly label: string;
+        readonly axisLabel?: string | undefined;
     }>;
     readonly series: ReadonlyArray<BarSeries>;
     readonly domain: readonly [number, number];

package/dist/packages/collections/src/data-table.d.ts

@@ -54,7 +54,8 @@ export type DataTableProps<Row> = SortProperties<Row> & OptionalSelection<Row> &
     readonly caption: string;
     readonly empty: ReactNode;
     readonly rowAction?: DataTableRowAction<Row>;
-    readonly activeRowId?: string;
+    readonly activeRowId?: string | undefined;
+    readonly focusRowId?: string | undefined;
     readonly hideCaption?: boolean;
     readonly hideHeaders?: boolean;
     readonly window?: DataTableWindow;
@@ -62,5 +63,5 @@ export type DataTableProps<Row> = SortProperties<Row> & OptionalSelection<Row> &
     readonly onEndReached?: () => void;
     readonly footer?: ReactNode;
 };
-export declare function DataTable<Row extends object>({ rows, columns, getRowId, caption, empty, sort, onSortChange, selectedIds, onSelectionChange, selectionLabel, rowAction, activeRowId, hideCaption, hideHeaders, window, endContent, onEndReached, footer, }: DataTableProps<Row>): ReactNode;
+export declare function DataTable<Row extends object>({ rows, columns, getRowId, caption, empty, sort, onSortChange, selectedIds, onSelectionChange, selectionLabel, rowAction, activeRowId, focusRowId, hideCaption, hideHeaders, window, endContent, onEndReached, footer, }: DataTableProps<Row>): ReactNode;
 export {};

package/dist/packages/core/src/text.d.ts

@@ -8,7 +8,9 @@ type TextProps = ComponentProps<'span'> & {
     readonly tone?: TextTone;
     readonly xstyle?: PlacementStyle;
 };
-type HeadingProps = ComponentProps<'h1'>;
+type HeadingProps = ComponentProps<'h1'> & {
+    readonly compact?: boolean;
+};
 type SubheadingProps = ComponentProps<'h2'>;
 type MutedProps = ComponentProps<'p'>;
 type IdentifierProps = ComponentProps<'span'>;
@@ -20,7 +22,7 @@ type StatusProps = ComponentProps<'span'> & {
     readonly tone?: StatusTone;
 };
 export declare function Text({ variant, tone, xstyle, ...props }: TextProps): ReactNode;
-export declare function Heading(props: HeadingProps): ReactNode;
+export declare function Heading({ compact, ...props }: HeadingProps): ReactNode;
 export declare function Subheading(props: SubheadingProps): ReactNode;
 export declare function Muted(props: MutedProps): ReactNode;
 export declare function Identifier(props: IdentifierProps): ReactNode;

package/dist/packages/forms/src/field-styles.d.ts

@@ -63,4 +63,16 @@ export declare const fieldStyles: Readonly<{
         readonly resize: stylex.StyleXClassNameFor<"resize", "vertical">;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
     }>;
+    readonly compactTextarea: Readonly<{
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 80>;
+        readonly maxHeight: stylex.StyleXClassNameFor<"maxHeight", "30dvh">;
+    }>;
+}>;
+export declare const inputSizeStyles: Readonly<{
+    readonly sm: Readonly<{
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
+        readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", string>;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
+    }>;
+    readonly md: {};
 }>;

package/dist/packages/forms/src/form-controls.d.ts

@@ -39,7 +39,7 @@ declare function FieldsetRoot({ className, style, xstyle, ...props }: FieldsetRo
 declare function FieldsetLegend({ className, style, ...props }: FieldsetLegendProps): ReactNode;
 declare function InputGroupRoot({ xstyle, ...props }: InputGroupRootProps): ReactNode;
 declare function InputGroupAddon(props: InputGroupAddonProps): ReactNode;
-declare function InputGroupInput({ className, style, xstyle, ...props }: InputProps): ReactNode;
+declare function InputGroupInput({ className, style, xstyle, size, ...props }: InputProps): ReactNode;
 declare function NumberFieldRoot({ className, style, xstyle, ...props }: NumberFieldRootProps): ReactNode;
 declare function NumberFieldGroup({ className, style, ...props }: NumberFieldGroupProps): ReactNode;
 declare function NumberFieldInput({ className, style, ...props }: NumberFieldInputProps): ReactNode;

package/dist/packages/forms/src/forms.d.ts

@@ -10,12 +10,14 @@ type FieldLabelProps = ComponentProps<typeof BaseField.Label>;
 type FieldDescriptionProps = ComponentProps<typeof BaseField.Description>;
 type FieldErrorProps = ComponentProps<typeof BaseField.Error>;
 type BaseInputProps = ComponentProps<typeof BaseInput>;
-export type InputProps = Omit<BaseInputProps, 'value' | 'defaultValue' | 'onChange' | 'onValueChange' | 'readOnly'> & TextValueProperties<NonNullable<BaseInputProps['value']>, NonNullable<BaseInputProps['onChange']>, NonNullable<BaseInputProps['onValueChange']>> & {
+export type InputProps = Omit<BaseInputProps, 'value' | 'defaultValue' | 'onChange' | 'onValueChange' | 'readOnly' | 'size'> & TextValueProperties<NonNullable<BaseInputProps['value']>, NonNullable<BaseInputProps['onChange']>, NonNullable<BaseInputProps['onValueChange']>> & {
+    readonly size?: 'sm' | 'md';
     readonly xstyle?: PlacementStyle;
 };
 type NativeTextareaProps = ComponentProps<'textarea'>;
 type TextareaProps = Omit<NativeTextareaProps, 'value' | 'defaultValue' | 'onChange' | 'readOnly'> & TextValueProperties<NonNullable<NativeTextareaProps['value']>, NonNullable<NativeTextareaProps['onChange']>, NonNullable<BaseInputProps['onValueChange']>> & {
     readonly xstyle?: PlacementStyle;
+    readonly compact?: boolean;
 };
 declare function FieldRoot({ className, style, xstyle, ...props }: FieldRootProps): ReactNode;
 declare function FieldLabel({ className, style, ...props }: FieldLabelProps): ReactNode;
@@ -27,6 +29,6 @@ export declare const Field: {
     Description: typeof FieldDescription;
     Error: typeof FieldError;
 };
-export declare function Input({ className, style, xstyle, ...props }: InputProps): ReactNode;
-export declare function Textarea({ value, defaultValue, onValueChange, name, disabled, readOnly, required, className, style, xstyle, ...props }: TextareaProps): ReactNode;
+export declare function Input({ className, style, xstyle, size, ...props }: InputProps): ReactNode;
+export declare function Textarea({ compact, value, defaultValue, onValueChange, name, disabled, readOnly, required, className, style, xstyle, ...props }: TextareaProps): ReactNode;
 export {};

package/dist/packages/layout/src/focus-page.d.ts

@@ -0,0 +1,4 @@
+import type { ReactNode } from 'react';
+export declare function FocusPage({ children }: {
+    readonly children: ReactNode;
+}): ReactNode;

package/dist/packages/layout/src/index.d.ts

@@ -1,5 +1,7 @@
 export { AppShell } from './app-shell.tsx';
 export { DetailPage } from './detail-page.tsx';
+export { FocusPage } from './focus-page.tsx';
+export { Workbench, WorkbenchScroll, WorkbenchFooter } from './workbench.tsx';
 export { PageToolbar, ToolbarAction } from './page-toolbar.tsx';
 export type { RecordPageRootProps, RecordPageToolbarProps, RecordPageBodyProps, RecordPageHeaderProps, RecordPageContentProps, RecordPageAsideProps, } from './record-page.tsx';
 export { RecordPage } from './record-page.tsx';

package/dist/packages/layout/src/workbench.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from 'react';
+export declare function Workbench({ header, children, inspector, }: {
+    readonly header: ReactNode;
+    readonly children: ReactNode;
+    readonly inspector?: ReactNode;
+}): ReactNode;
+export declare function WorkbenchScroll({ children }: {
+    readonly children: ReactNode;
+}): ReactNode;
+export declare function WorkbenchFooter({ children }: {
+    readonly children: ReactNode;
+}): ReactNode;

package/dist/{pierre-tree-LY7PGy-7.js → pierre-tree-DVybsnm4.js}

@@ -1,5 +1,5 @@
-import { c as e } from "./src-CbYaLvhD.js";
-import { l as t } from "./src-CjnbzSgq.js";
+import { c as e } from "./src-BkCsvZGi.js";
+import { l as t } from "./src-DjTM64tN.js";
 import { conditions as n } from "./tokens.js";
 import { r } from "./pierre-theme-BpESNIsV.js";
 import * as i from "@stylexjs/stylex";

package/dist/{src-CbJTK9oP.js → src-B_DCatpY.js}

@@ -1,4 +1,4 @@
-import { i as e, s as t } from "./src-CbYaLvhD.js";
+import { i as e, s as t } from "./src-BkCsvZGi.js";
 import { t as n } from "./accessibility-C-aIZ1Yx.js";
 import { n as r, t as i } from "./popup-styles-CvtZDE2t.js";
 import { t as a } from "./style-composition-uYlczSsB.js";

package/dist/{src-CbYaLvhD.js → src-BkCsvZGi.js}

@@ -27,6 +27,7 @@ var x = {
 		k63SB2: "xk50ysn",
 		kGuDYH: "xtqrqnz",
 		kLWn49: "x1778rvt",
+		kMnn75: "xkrqix3",
 		kkrTdU: "x1ypdohk",
 		khDVqt: "xuxw1ft",
 		kUfY9r: "xdibjt2",
@@ -632,8 +633,11 @@ var X = {
 function ae({ variant: e = "body", tone: t = "ink", xstyle: n, ...a }) {
 	return /* @__PURE__ */ l("span", { ...r(i.props(X.text, Z[e], Q[t], n), a) });
 }
-function oe(e) {
-	return /* @__PURE__ */ l("h1", { ...r({ className: "x1ghz6dp x1hz01jw xvmahel xc0f4dz x1sfszr9 xzju6ct x197eox2 x1s688f x1wjjqco xbixft xj0a0fe" }, e) });
+function oe({ compact: e = !1, ...t }) {
+	return /* @__PURE__ */ l("h1", { ...r({
+		0: { className: "x1ghz6dp x1hz01jw xvmahel xc0f4dz x1sfszr9 xzju6ct x197eox2 x1s688f x1wjjqco xbixft xj0a0fe" },
+		1: { className: "x1ghz6dp x1hz01jw xvmahel x1i2cqwi x4fansv x1s688f xbixft" }
+	}[!!e | 0], t) });
 }
 function $(e) {
 	return /* @__PURE__ */ l("h2", { ...r({ className: "x1ghz6dp x1hz01jw xvmahel x1i2cqwi x4fansv x1s688f xbixft" }, e) });