@elaraai/east-ui 1.0.4 → 1.0.5

package/dist/src/runtime/collections/matrix.js

@@ -0,0 +1,66 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { Matrix as MatrixFactory, } from "../../collections/matrix/index.js";
+/**
+ * Maps `props` to `Matrix.Root(data, config)`, threading the data-row generic
+ * `T` so the {@link MatrixConfig} closures (`rowKey` / `cell` / `groupBy` …)
+ * infer their row parameter from the data schema.
+ */
+function MatrixTag(props) {
+    const { data, ...config } = props;
+    return MatrixFactory.Root(data, config);
+}
+/**
+ * Heat-grid matrix — rows × columns where every cell is a stacked weight bar of
+ * coloured segments. Use it for capacity / utilisation / allocation grids: each
+ * row maps to a record, each column to an axis key, and the `cell` closure
+ * builds the cell's segments from the row and column. The config closures
+ * (`rowKey`, `rowHeader`, `rowSublabel`, `groupBy`, `cell`) and the display
+ * options (`orientation`, `minLabelSize`, `legend`, interaction callbacks) live
+ * on {@link MatrixConfig}. Segments can be drag-resizable and cells can carry
+ * status markers and click popovers.
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East, FloatType } from "@elaraai/east";
+ * import { Matrix, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const utilisation = East.function([], UIComponentType, _$ => (
+ *     <Matrix
+ *         data={[
+ *             { name: "Alice", booked: new Map([["mon", 0.45], ["tue", 0.70]]) },
+ *             { name: "Bob", booked: new Map([["mon", 0.35], ["tue", 0.60]]) },
+ *         ]}
+ *         columns={[
+ *             Matrix.column({ key: "mon", label: "Mon" }),
+ *             Matrix.column({ key: "tue", label: "Tue" }),
+ *         ]}
+ *         rowKey={r => r.name}
+ *         rowHeader="Resource"
+ *         cell={(r, col) => Matrix.cell({ segments: [
+ *             Matrix.segment({ fill: "brand", weight: r.booked.get(col.key) }),
+ *             Matrix.segment({ fill: "free", weight: East.value(1.0, FloatType).subtract(r.booked.get(col.key)) }),
+ *         ] })}
+ *         legend={[{ fill: "brand", label: "Booked" }, { fill: "free", label: "Free" }]}
+ *     />
+ * ));
+ * ```
+ *
+ * @remarks
+ * Carries `Matrix.column` (declare an x-axis column), `Matrix.cell` (assemble a
+ * cell's segments / markers / popover), `Matrix.segment` (one weight band), and
+ * `Matrix.marker` (a status-coloured corner ring), plus `Matrix.Types` for the
+ * drag / click event types (`Matrix.Types.SegmentChangeEvent`,
+ * `Matrix.Types.CellClickEvent`). Desugars to `Matrix.Root(data, config)`.
+ */
+export const Matrix = Object.assign(MatrixTag, {
+    column: MatrixFactory.column,
+    segment: MatrixFactory.segment,
+    cell: MatrixFactory.cell,
+    marker: MatrixFactory.marker,
+    Types: MatrixFactory.Types,
+});
+//# sourceMappingURL=matrix.js.map

package/dist/src/runtime/collections/matrix.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"matrix.js","sourceRoot":"","sources":["../../../../src/runtime/collections/matrix.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,OAAO,EACH,MAAM,IAAI,aAAa,GAG1B,MAAM,mCAAmC,CAAC;AAG3C;;;;GAIG;AACH,SAAS,SAAS,CACd,KAAgD;IAEhD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IAClC,OAAO,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,MAAqC,CAAC,CAAC;AAC3E,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AACH,MAAM,CAAC,MAAM,MAAM,GAMf,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE;IACzB,MAAM,EAAE,aAAa,CAAC,MAAM;IAC5B,OAAO,EAAE,aAAa,CAAC,OAAO;IAC9B,IAAI,EAAE,aAAa,CAAC,IAAI;IACxB,MAAM,EAAE,aAAa,CAAC,MAAM;IAC5B,KAAK,EAAE,aAAa,CAAC,KAAK;CAC7B,CAAC,CAAC"}

package/dist/src/runtime/collections/pagination.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+/**
+ * `<Pagination>` tag — see the export's JSDoc.
+ */
+import { Pagination as PaginationFactory, type PaginationOptions } from "../../collections/pagination/index.js";
+import { type JsxTag } from "../combinators.js";
+/**
+ * Page-navigation control — previous / next arrows and a windowed run of page
+ * triggers driven by the `count` total and `pageSize`. The current `page` and
+ * the `onPageChange` callback make it a controlled component: bind `page` to
+ * state and write the next page back in the callback. The window shape
+ * (`siblings`, `boundaries`) and the visual props (`variant`, `size`, active
+ * colour overrides) are flat ({@link PaginationOptions}). Pair it with a sliced
+ * `<Table>` or list, or let `<Table pagination={…} />` embed it.
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East, IntegerType, NullType } from "@elaraai/east";
+ * import { Pagination, Reactive, State, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const pager = East.function([], UIComponentType, _$ => (
+ *     <Reactive>{$ => {
+ *         const pageBind = $.let(State.bind([IntegerType], "page", 0n));
+ *         const page = $.let(pageBind.read());
+ *         const onPageChange = $.const(East.function([IntegerType], NullType, ($, next) => {
+ *             $(pageBind.write(next));
+ *         }));
+ *         return <Pagination page={page} pageSize={20n} count={500n} onPageChange={onPageChange} />;
+ *     }}</Reactive>
+ * ));
+ * ```
+ *
+ * @remarks
+ * Carries `Pagination.Types` for the style IR types. Desugars to
+ * `Pagination.Root(options)`.
+ */
+export declare const Pagination: JsxTag<PaginationOptions> & {
+    Types: typeof PaginationFactory.Types;
+};
+//# sourceMappingURL=pagination.d.ts.map

package/dist/src/runtime/collections/pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../../src/runtime/collections/pagination.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;GAEG;AAEH,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAE,KAAK,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAChH,OAAO,EAAc,KAAK,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,iBAAiB,CAAC,GAAG;IAAE,KAAK,EAAE,OAAO,iBAAiB,CAAC,KAAK,CAAA;CACH,CAAC"}

package/dist/src/runtime/collections/pagination.js

@@ -0,0 +1,42 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+/**
+ * `<Pagination>` tag — see the export's JSDoc.
+ */
+import { Pagination as PaginationFactory } from "../../collections/pagination/index.js";
+import { optionsTag } from "../combinators.js";
+/**
+ * Page-navigation control — previous / next arrows and a windowed run of page
+ * triggers driven by the `count` total and `pageSize`. The current `page` and
+ * the `onPageChange` callback make it a controlled component: bind `page` to
+ * state and write the next page back in the callback. The window shape
+ * (`siblings`, `boundaries`) and the visual props (`variant`, `size`, active
+ * colour overrides) are flat ({@link PaginationOptions}). Pair it with a sliced
+ * `<Table>` or list, or let `<Table pagination={…} />` embed it.
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East, IntegerType, NullType } from "@elaraai/east";
+ * import { Pagination, Reactive, State, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const pager = East.function([], UIComponentType, _$ => (
+ *     <Reactive>{$ => {
+ *         const pageBind = $.let(State.bind([IntegerType], "page", 0n));
+ *         const page = $.let(pageBind.read());
+ *         const onPageChange = $.const(East.function([IntegerType], NullType, ($, next) => {
+ *             $(pageBind.write(next));
+ *         }));
+ *         return <Pagination page={page} pageSize={20n} count={500n} onPageChange={onPageChange} />;
+ *     }}</Reactive>
+ * ));
+ * ```
+ *
+ * @remarks
+ * Carries `Pagination.Types` for the style IR types. Desugars to
+ * `Pagination.Root(options)`.
+ */
+export const Pagination = Object.assign(optionsTag(PaginationFactory.Root), { Types: PaginationFactory.Types });
+//# sourceMappingURL=pagination.js.map

package/dist/src/runtime/collections/pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.js","sourceRoot":"","sources":["../../../../src/runtime/collections/pagination.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;GAEG;AAEH,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAA0B,MAAM,uCAAuC,CAAC;AAChH,OAAO,EAAE,UAAU,EAAe,MAAM,mBAAmB,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,MAAM,CAAC,MAAM,UAAU,GACnB,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,iBAAiB,CAAC,KAAK,EAAE,CAAC,CAAC"}

package/dist/src/runtime/collections/planner.d.ts

@@ -0,0 +1,80 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+/**
+ * `<Planner.Point>` / `<Planner.Span>` tags — see the export's JSDoc.
+ */
+import type { SubtypeExprOrValue, ArrayType, StructType } from "@elaraai/east";
+import { Planner as PlannerFactory, type PlannerConfig, type RowElement } from "../../collections/planner/index.js";
+import type { UIElement } from "../runtime.js";
+/**
+ * `<Planner.Point>` — schedule grid for instantaneous events, one cell per
+ * axis slot. Each row is a resource / stream; `events` places point markers at
+ * `Planner.at.*` slots, each carrying a lifecycle `state` (committed /
+ * proposed / rejected). The axis (`Planner.axis.number` / `.ordinal` /
+ * `.time`), the frozen identity columns, `groupBy`, `markers`, the `now`-line
+ * and `density` live on {@link PlannerConfig}; `data` is a flat prop. Use it
+ * for rosters, shift plans, and what-if scheduling. Maps to `Planner.Point`.
+ */
+declare function PlannerPoint<T extends SubtypeExprOrValue<ArrayType<StructType>>>(props: {
+    data: T;
+} & PlannerConfig<RowElement<T>>): UIElement;
+/**
+ * `<Planner.Span>` — the span sibling of `<Planner.Point>`: each event spans
+ * from `slot` to `endSlot` across the axis (a horizontal bar rather than a
+ * point), giving a lightweight swim-lane timeline. Same {@link PlannerConfig}
+ * config and event-state grammar as Point, typically over a `Planner.axis.time`
+ * axis. Maps to `Planner.Span`.
+ */
+declare function PlannerSpan<T extends SubtypeExprOrValue<ArrayType<StructType>>>(props: {
+    data: T;
+} & PlannerConfig<RowElement<T>>): UIElement;
+/**
+ * Slot-based scheduling grids — resources down the rows, an axis across the
+ * columns, with lifecycle-coloured events in the cells. Pick the member by
+ * event shape: {@link Planner.Point} for instantaneous events (one cell per
+ * slot), {@link Planner.Span} for events that stretch across a range. Use a
+ * planner for rosters, capacity plans, and proposed-vs-committed what-if views.
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East } from "@elaraai/east";
+ * import { Planner, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const roster = East.function([], UIComponentType, _$ => (
+ *     <Planner.Point
+ *         data={[
+ *             { name: "api-01", role: "Lead", team: "Web" },
+ *             { name: "api-02", role: "Engineer", team: "Web" },
+ *         ]}
+ *         axis={Planner.axis.number({ buckets: [{ key: "am", label: "AM" }, { key: "pm", label: "PM" }], range: { min: 1, max: 4 } })}
+ *         groupBy={r => r.team}
+ *         columns={[{ key: "name", frozen: true, value: r => r.name, sublabel: r => r.role }]}
+ *         events={_r => [
+ *             Planner.event({ slot: Planner.at.number(1), bucket: "am", label: "✓", state: "committed" }),
+ *             Planner.event({ slot: Planner.at.number(3), bucket: "am", label: "plan", state: "added" }),
+ *         ]}
+ *     />
+ * ));
+ * ```
+ *
+ * @remarks
+ * Carries the axis builders (`Planner.axis.number` / `.ordinal` / `.time`), the
+ * slot constructors (`Planner.at.number` / `.ordinal` / `.time`), `Planner.event`
+ * (an event with slot / state / label / popover), `Planner.marker` (a
+ * status-flag ring), and `Planner.Types` (e.g. `Planner.Types.SelectEvent`).
+ * Desugars to `Planner.Point(data, config)` / `Planner.Span(data, config)`.
+ */
+export declare const Planner: {
+    Point: typeof PlannerPoint;
+    Span: typeof PlannerSpan;
+    axis: typeof PlannerFactory.axis;
+    at: typeof PlannerFactory.at;
+    event: typeof PlannerFactory.event;
+    marker: typeof PlannerFactory.marker;
+    Types: typeof PlannerFactory.Types;
+};
+export {};
+//# sourceMappingURL=planner.d.ts.map

package/dist/src/runtime/collections/planner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"planner.d.ts","sourceRoot":"","sources":["../../../../src/runtime/collections/planner.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;GAEG;AAEH,OAAO,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EACH,OAAO,IAAI,cAAc,EACzB,KAAK,aAAa,EAClB,KAAK,UAAU,EAClB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE/C;;;;;;;;GAQG;AACH,iBAAS,YAAY,CAAC,CAAC,SAAS,kBAAkB,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,EACrE,KAAK,EAAE;IAAE,IAAI,EAAE,CAAC,CAAA;CAAE,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,GAClD,SAAS,CAGX;AAED;;;;;;GAMG;AACH,iBAAS,WAAW,CAAC,CAAC,SAAS,kBAAkB,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,EACpE,KAAK,EAAE;IAAE,IAAI,EAAE,CAAC,CAAA;CAAE,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,GAClD,SAAS,CAGX;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,eAAO,MAAM,OAAO,EAAE;IAClB,KAAK,EAAE,OAAO,YAAY,CAAC;IAC3B,IAAI,EAAE,OAAO,WAAW,CAAC;IACzB,IAAI,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC;IACjC,EAAE,EAAE,OAAO,cAAc,CAAC,EAAE,CAAC;IAC7B,KAAK,EAAE,OAAO,cAAc,CAAC,KAAK,CAAC;IACnC,MAAM,EAAE,OAAO,cAAc,CAAC,MAAM,CAAC;IACrC,KAAK,EAAE,OAAO,cAAc,CAAC,KAAK,CAAC;CAStC,CAAC"}

package/dist/src/runtime/collections/planner.js

@@ -0,0 +1,76 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { Planner as PlannerFactory, } from "../../collections/planner/index.js";
+/**
+ * `<Planner.Point>` — schedule grid for instantaneous events, one cell per
+ * axis slot. Each row is a resource / stream; `events` places point markers at
+ * `Planner.at.*` slots, each carrying a lifecycle `state` (committed /
+ * proposed / rejected). The axis (`Planner.axis.number` / `.ordinal` /
+ * `.time`), the frozen identity columns, `groupBy`, `markers`, the `now`-line
+ * and `density` live on {@link PlannerConfig}; `data` is a flat prop. Use it
+ * for rosters, shift plans, and what-if scheduling. Maps to `Planner.Point`.
+ */
+function PlannerPoint(props) {
+    const { data, ...config } = props;
+    return PlannerFactory.Point(data, config);
+}
+/**
+ * `<Planner.Span>` — the span sibling of `<Planner.Point>`: each event spans
+ * from `slot` to `endSlot` across the axis (a horizontal bar rather than a
+ * point), giving a lightweight swim-lane timeline. Same {@link PlannerConfig}
+ * config and event-state grammar as Point, typically over a `Planner.axis.time`
+ * axis. Maps to `Planner.Span`.
+ */
+function PlannerSpan(props) {
+    const { data, ...config } = props;
+    return PlannerFactory.Span(data, config);
+}
+/**
+ * Slot-based scheduling grids — resources down the rows, an axis across the
+ * columns, with lifecycle-coloured events in the cells. Pick the member by
+ * event shape: {@link Planner.Point} for instantaneous events (one cell per
+ * slot), {@link Planner.Span} for events that stretch across a range. Use a
+ * planner for rosters, capacity plans, and proposed-vs-committed what-if views.
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East } from "@elaraai/east";
+ * import { Planner, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const roster = East.function([], UIComponentType, _$ => (
+ *     <Planner.Point
+ *         data={[
+ *             { name: "api-01", role: "Lead", team: "Web" },
+ *             { name: "api-02", role: "Engineer", team: "Web" },
+ *         ]}
+ *         axis={Planner.axis.number({ buckets: [{ key: "am", label: "AM" }, { key: "pm", label: "PM" }], range: { min: 1, max: 4 } })}
+ *         groupBy={r => r.team}
+ *         columns={[{ key: "name", frozen: true, value: r => r.name, sublabel: r => r.role }]}
+ *         events={_r => [
+ *             Planner.event({ slot: Planner.at.number(1), bucket: "am", label: "✓", state: "committed" }),
+ *             Planner.event({ slot: Planner.at.number(3), bucket: "am", label: "plan", state: "added" }),
+ *         ]}
+ *     />
+ * ));
+ * ```
+ *
+ * @remarks
+ * Carries the axis builders (`Planner.axis.number` / `.ordinal` / `.time`), the
+ * slot constructors (`Planner.at.number` / `.ordinal` / `.time`), `Planner.event`
+ * (an event with slot / state / label / popover), `Planner.marker` (a
+ * status-flag ring), and `Planner.Types` (e.g. `Planner.Types.SelectEvent`).
+ * Desugars to `Planner.Point(data, config)` / `Planner.Span(data, config)`.
+ */
+export const Planner = {
+    Point: PlannerPoint,
+    Span: PlannerSpan,
+    axis: PlannerFactory.axis,
+    at: PlannerFactory.at,
+    event: PlannerFactory.event,
+    marker: PlannerFactory.marker,
+    Types: PlannerFactory.Types,
+};
+//# sourceMappingURL=planner.js.map

package/dist/src/runtime/collections/planner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"planner.js","sourceRoot":"","sources":["../../../../src/runtime/collections/planner.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,OAAO,EACH,OAAO,IAAI,cAAc,GAG5B,MAAM,oCAAoC,CAAC;AAG5C;;;;;;;;GAQG;AACH,SAAS,YAAY,CACjB,KAAiD;IAEjD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IAClC,OAAO,cAAc,CAAC,KAAK,CAAC,IAAI,EAAE,MAAsC,CAAC,CAAC;AAC9E,CAAC;AAED;;;;;;GAMG;AACH,SAAS,WAAW,CAChB,KAAiD;IAEjD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IAClC,OAAO,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,MAAsC,CAAC,CAAC;AAC7E,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,MAAM,CAAC,MAAM,OAAO,GAQhB;IACA,KAAK,EAAE,YAAY;IACnB,IAAI,EAAE,WAAW;IACjB,IAAI,EAAE,cAAc,CAAC,IAAI;IACzB,EAAE,EAAE,cAAc,CAAC,EAAE;IACrB,KAAK,EAAE,cAAc,CAAC,KAAK;IAC3B,MAAM,EAAE,cAAc,CAAC,MAAM;IAC7B,KAAK,EAAE,cAAc,CAAC,KAAK;CAC9B,CAAC"}

package/dist/src/runtime/collections/roster.d.ts

@@ -0,0 +1,60 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+/** `<Roster>` tag — see the export's JSDoc. */
+import { type ExprType, type SubtypeExprOrValue, ArrayType, StructType } from "@elaraai/east";
+import { Roster as RosterFactory, type RosterConfig, type RowElement } from "../../collections/roster/index.js";
+import { UIComponentType } from "../../component.js";
+/**
+ * `<Roster>` — people × days-of-week shift scheduling. Takes the two flat
+ * tables a dataset naturally provides — `people` and `shifts` — each with a
+ * chart-style field encoding (`person`, `shift`); the factory joins them by
+ * person key. The component owns the week (`days` defaults to Mon–Sun).
+ *
+ * Declares the drag & drop **target** role: `sources` lists the Library ids
+ * it accepts `add` drags from, and every completed drag (add / move /
+ * remove) funnels through `onDrag` as one typed event. Published mode
+ * renders committed shifts only, pointer-immutable; edit mode enables
+ * grips, empty-cell add (`onAddAt`), and ghost acceptance (`onAccept`).
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East, variant } from "@elaraai/east";
+ * import { Roster, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const roster = East.function([], UIComponentType, _$ => (
+ *     <Roster
+ *         id="roster-se"
+ *         sources={["people"]}
+ *         mode="edit"
+ *         people={[
+ *             { id: "patel", name: "Patel", target: "38h → 30h" },
+ *         ]}
+ *         person={p => ({ key: p.id, label: p.name, sublabel: p.target })}
+ *         shifts={[
+ *             { id: "p1", person: "patel", day: "Mon", hours: 8n, state: variant("committed", null) },
+ *             { id: "p2", person: "patel", day: "Wed", hours: 4n, state: variant("proposed", variant("model", null)) },
+ *         ]}
+ *         shift={s => ({ key: s.id, person: s.person, day: s.day,
+ *                        hours: s.hours, state: s.state })}
+ *     />
+ * ));
+ * ```
+ *
+ * @remarks
+ * Shift states are typed `PlannerStateType` values in the data
+ * (`variant("committed", null)`, `variant("proposed", variant("model",
+ * null))`, …) — `Roster.Types.State` names the grammar. Desugars to
+ * `Roster.Root(people, shifts, config)`.
+ */
+declare function RosterTag<P extends SubtypeExprOrValue<ArrayType<StructType>>, S extends SubtypeExprOrValue<ArrayType<StructType>>>(props: {
+    people: P;
+    shifts: S;
+} & RosterConfig<RowElement<P>, RowElement<S>>): ExprType<UIComponentType>;
+export declare const Roster: typeof RosterTag & {
+    Types: typeof RosterFactory.Types;
+};
+export {};
+//# sourceMappingURL=roster.d.ts.map

package/dist/src/runtime/collections/roster.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"roster.d.ts","sourceRoot":"","sources":["../../../../src/runtime/collections/roster.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,+CAA+C;AAE/C,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,kBAAkB,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC9F,OAAO,EACH,MAAM,IAAI,aAAa,EACvB,KAAK,YAAY,EACjB,KAAK,UAAU,EAClB,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,iBAAS,SAAS,CACd,CAAC,SAAS,kBAAkB,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,EACnD,CAAC,SAAS,kBAAkB,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,EAEnD,KAAK,EAAE;IAAE,MAAM,EAAE,CAAC,CAAC;IAAC,MAAM,EAAE,CAAC,CAAA;CAAE,GAAG,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,GAC7E,QAAQ,CAAC,eAAe,CAAC,CAG3B;AAED,eAAO,MAAM,MAAM,EAAE,OAAO,SAAS,GAAG;IACpC,KAAK,EAAE,OAAO,aAAa,CAAC,KAAK,CAAC;CAGpC,CAAC"}

package/dist/src/runtime/collections/roster.js

@@ -0,0 +1,59 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+/** `<Roster>` tag — see the export's JSDoc. */
+import { ArrayType, StructType } from "@elaraai/east";
+import { Roster as RosterFactory, } from "../../collections/roster/index.js";
+import { UIComponentType } from "../../component.js";
+/**
+ * `<Roster>` — people × days-of-week shift scheduling. Takes the two flat
+ * tables a dataset naturally provides — `people` and `shifts` — each with a
+ * chart-style field encoding (`person`, `shift`); the factory joins them by
+ * person key. The component owns the week (`days` defaults to Mon–Sun).
+ *
+ * Declares the drag & drop **target** role: `sources` lists the Library ids
+ * it accepts `add` drags from, and every completed drag (add / move /
+ * remove) funnels through `onDrag` as one typed event. Published mode
+ * renders committed shifts only, pointer-immutable; edit mode enables
+ * grips, empty-cell add (`onAddAt`), and ghost acceptance (`onAccept`).
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East, variant } from "@elaraai/east";
+ * import { Roster, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const roster = East.function([], UIComponentType, _$ => (
+ *     <Roster
+ *         id="roster-se"
+ *         sources={["people"]}
+ *         mode="edit"
+ *         people={[
+ *             { id: "patel", name: "Patel", target: "38h → 30h" },
+ *         ]}
+ *         person={p => ({ key: p.id, label: p.name, sublabel: p.target })}
+ *         shifts={[
+ *             { id: "p1", person: "patel", day: "Mon", hours: 8n, state: variant("committed", null) },
+ *             { id: "p2", person: "patel", day: "Wed", hours: 4n, state: variant("proposed", variant("model", null)) },
+ *         ]}
+ *         shift={s => ({ key: s.id, person: s.person, day: s.day,
+ *                        hours: s.hours, state: s.state })}
+ *     />
+ * ));
+ * ```
+ *
+ * @remarks
+ * Shift states are typed `PlannerStateType` values in the data
+ * (`variant("committed", null)`, `variant("proposed", variant("model",
+ * null))`, …) — `Roster.Types.State` names the grammar. Desugars to
+ * `Roster.Root(people, shifts, config)`.
+ */
+function RosterTag(props) {
+    const { people, shifts, ...config } = props;
+    return RosterFactory.Root(people, shifts, config);
+}
+export const Roster = Object.assign(RosterTag, {
+    Types: RosterFactory.Types,
+});
+//# sourceMappingURL=roster.js.map

package/dist/src/runtime/collections/roster.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"roster.js","sourceRoot":"","sources":["../../../../src/runtime/collections/roster.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,+CAA+C;AAE/C,OAAO,EAA0C,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC9F,OAAO,EACH,MAAM,IAAI,aAAa,GAG1B,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,SAAS,SAAS,CAId,KAA4E;IAE5E,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IAC5C,OAAO,aAAa,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,MAAoD,CAAC,CAAC;AACpG,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAEf,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE;IACzB,KAAK,EAAE,aAAa,CAAC,KAAK;CAC7B,CAAC,CAAC"}

package/dist/src/runtime/collections/schematic.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+/** `<Schematic>` tag — see the export's JSDoc. */
+import { type ExprType, type SubtypeExprOrValue, ArrayType, StructType } from "@elaraai/east";
+import { Schematic as SchematicFactory, type SchematicConfig, type RowElement } from "../../collections/schematic/index.js";
+import { UIComponentType } from "../../component.js";
+/**
+ * `<Schematic>` — a read-only 2D world-coordinate canvas for placing
+ * real-world entities (tanks, bays, lines, cells) in space, plus
+ * annotation zones (rooms, hatched walkways) and key-addressed links — all
+ * from flat data tables with chart-style field encodings. Renders bare like
+ * Table / Planner; identity chrome is host composition.
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East, variant } from "@elaraai/east";
+ * import { Schematic, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const plant = East.function([], UIComponentType, _$ => (
+ *     <Schematic
+ *         extent={{ width: 30, height: 12 }}
+ *         items={[
+ *             { id: "TANK-04", x: 4.0, y: 2.5, kind: "fermenter · 40 kL", fill: 28.8, cap: 40.0,
+ *               state: variant("some", variant("success", null)) },
+ *         ]}
+ *         item={{
+ *             key: e => e.id, x: e => e.x, y: e => e.y, label: e => e.id,
+ *             sublabel: e => e.kind, icon: "database",
+ *             status: e => e.state,
+ *             meter: { value: e => e.fill, max: e => e.cap },
+ *         }}
+ *         zones={[{ id: "hall-b", name: "Fermentation Hall · Hall B", x: 0.5, y: 0.5, w: 18.0, h: 5.0,
+ *                   pattern: Schematic.outline() }]}
+ *         zone={{ key: z => z.id, label: z => z.name, x: z => z.x, y: z => z.y,
+ *                 width: z => z.w, height: z => z.h, pattern: z => z.pattern }}
+ *         scaleUnit="m"
+ *     />
+ * ));
+ * ```
+ *
+ * @remarks
+ * Read-only — single-click selection (`onSelect` receives the item key); no
+ * events, no drag & drop. Desugars to `Schematic.Root(items, config)`.
+ */
+declare function SchematicTag<I extends SubtypeExprOrValue<ArrayType<StructType>>, Z extends SubtypeExprOrValue<ArrayType<StructType>> = [], L extends SubtypeExprOrValue<ArrayType<StructType>> = []>(props: {
+    items: I;
+} & SchematicConfig<RowElement<I>, RowElement<Z>, RowElement<L>> & {
+    zones?: Z;
+    links?: L;
+}): ExprType<UIComponentType>;
+export declare const Schematic: typeof SchematicTag & {
+    outline: typeof SchematicFactory.outline;
+    hatch: typeof SchematicFactory.hatch;
+    solid: typeof SchematicFactory.solid;
+    dashed: typeof SchematicFactory.dashed;
+    Types: typeof SchematicFactory.Types;
+};
+export {};
+//# sourceMappingURL=schematic.d.ts.map

package/dist/src/runtime/collections/schematic.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schematic.d.ts","sourceRoot":"","sources":["../../../../src/runtime/collections/schematic.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,kDAAkD;AAElD,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,kBAAkB,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC9F,OAAO,EACH,SAAS,IAAI,gBAAgB,EAC7B,KAAK,eAAe,EACpB,KAAK,UAAU,EAClB,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,iBAAS,YAAY,CACjB,CAAC,SAAS,kBAAkB,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,EACnD,CAAC,SAAS,kBAAkB,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,EACxD,CAAC,SAAS,kBAAkB,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,EAExD,KAAK,EAAE;IAAE,KAAK,EAAE,CAAC,CAAA;CAAE,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,GAAG;IAAE,KAAK,CAAC,EAAE,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,CAAC,CAAA;CAAE,GAC9G,QAAQ,CAAC,eAAe,CAAC,CAG3B;AAED,eAAO,MAAM,SAAS,EAAE,OAAO,YAAY,GAAG;IAC1C,OAAO,EAAE,OAAO,gBAAgB,CAAC,OAAO,CAAC;IACzC,KAAK,EAAE,OAAO,gBAAgB,CAAC,KAAK,CAAC;IACrC,KAAK,EAAE,OAAO,gBAAgB,CAAC,KAAK,CAAC;IACrC,MAAM,EAAE,OAAO,gBAAgB,CAAC,MAAM,CAAC;IACvC,KAAK,EAAE,OAAO,gBAAgB,CAAC,KAAK,CAAC;CAOvC,CAAC"}

package/dist/src/runtime/collections/schematic.js

@@ -0,0 +1,59 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+/** `<Schematic>` tag — see the export's JSDoc. */
+import { ArrayType, StructType } from "@elaraai/east";
+import { Schematic as SchematicFactory, } from "../../collections/schematic/index.js";
+import { UIComponentType } from "../../component.js";
+/**
+ * `<Schematic>` — a read-only 2D world-coordinate canvas for placing
+ * real-world entities (tanks, bays, lines, cells) in space, plus
+ * annotation zones (rooms, hatched walkways) and key-addressed links — all
+ * from flat data tables with chart-style field encodings. Renders bare like
+ * Table / Planner; identity chrome is host composition.
+ *
+ * @example
+ * ```tsx
+ * // .tsx file with the `@jsxImportSource @elaraai/east-ui` pragma
+ * import { East, variant } from "@elaraai/east";
+ * import { Schematic, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const plant = East.function([], UIComponentType, _$ => (
+ *     <Schematic
+ *         extent={{ width: 30, height: 12 }}
+ *         items={[
+ *             { id: "TANK-04", x: 4.0, y: 2.5, kind: "fermenter · 40 kL", fill: 28.8, cap: 40.0,
+ *               state: variant("some", variant("success", null)) },
+ *         ]}
+ *         item={{
+ *             key: e => e.id, x: e => e.x, y: e => e.y, label: e => e.id,
+ *             sublabel: e => e.kind, icon: "database",
+ *             status: e => e.state,
+ *             meter: { value: e => e.fill, max: e => e.cap },
+ *         }}
+ *         zones={[{ id: "hall-b", name: "Fermentation Hall · Hall B", x: 0.5, y: 0.5, w: 18.0, h: 5.0,
+ *                   pattern: Schematic.outline() }]}
+ *         zone={{ key: z => z.id, label: z => z.name, x: z => z.x, y: z => z.y,
+ *                 width: z => z.w, height: z => z.h, pattern: z => z.pattern }}
+ *         scaleUnit="m"
+ *     />
+ * ));
+ * ```
+ *
+ * @remarks
+ * Read-only — single-click selection (`onSelect` receives the item key); no
+ * events, no drag & drop. Desugars to `Schematic.Root(items, config)`.
+ */
+function SchematicTag(props) {
+    const { items, ...config } = props;
+    return SchematicFactory.Root(items, config);
+}
+export const Schematic = Object.assign(SchematicTag, {
+    outline: SchematicFactory.outline,
+    hatch: SchematicFactory.hatch,
+    solid: SchematicFactory.solid,
+    dashed: SchematicFactory.dashed,
+    Types: SchematicFactory.Types,
+});
+//# sourceMappingURL=schematic.js.map

package/dist/src/runtime/collections/schematic.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schematic.js","sourceRoot":"","sources":["../../../../src/runtime/collections/schematic.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,kDAAkD;AAElD,OAAO,EAA0C,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC9F,OAAO,EACH,SAAS,IAAI,gBAAgB,GAGhC,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,SAAS,YAAY,CAKjB,KAA6G;IAE7G,MAAM,EAAE,KAAK,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IACnC,OAAO,gBAAgB,CAAC,IAAI,CAAC,KAAK,EAAE,MAAe,CAAC,CAAC;AACzD,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAMlB,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;IAC5B,OAAO,EAAE,gBAAgB,CAAC,OAAO;IACjC,KAAK,EAAE,gBAAgB,CAAC,KAAK;IAC7B,KAAK,EAAE,gBAAgB,CAAC,KAAK;IAC7B,MAAM,EAAE,gBAAgB,CAAC,MAAM;IAC/B,KAAK,EAAE,gBAAgB,CAAC,KAAK;CAChC,CAAC,CAAC"}