@getaster/elements 0.0.0-stage → 0.1.0-preview.1

package/dist/grid/rows.d.ts

@@ -0,0 +1,32 @@
+import type { KeyText } from "@getaster/data";
+/**
+ * Row offsets for a virtualized list whose rows have different heights.
+ * Heights are measured by key, so a measured row keeps its height when
+ * rows move; rows not measured yet (or not loaded) count as `estimate`.
+ *
+ * Offsets are prefix sums, rebuilt lazily after a change: O(rows) once per
+ * change, O(log rows) per lookup.
+ */
+export declare class RowHeights {
+    #private;
+    estimate: number;
+    constructor(estimate: number);
+    /** The rows, in order; `undefined` where a row isn't loaded. */
+    setKeys(keys: readonly (KeyText | undefined)[]): void;
+    get count(): number;
+    /** Whether a row's height has been measured. */
+    has(key: KeyText): boolean;
+    /** Records a row's height; returns whether it changed. */
+    measure(key: KeyText, height: number): boolean;
+    height(index: number): number;
+    /** The top of row `index`; `offset(count)` is the total height. */
+    offset(index: number): number;
+    total(): number;
+    /** The row at `y`: the last row whose top is at or above it. */
+    indexAt(y: number): number;
+    /** The rows to render for a viewport, with `overscan` pixels either side. */
+    window(top: number, height: number, overscan: number): {
+        start: number;
+        end: number;
+    };
+}

package/dist/grid/rows.js

@@ -0,0 +1,89 @@
+/**
+ * Row offsets for a virtualized list whose rows have different heights.
+ * Heights are measured by key, so a measured row keeps its height when
+ * rows move; rows not measured yet (or not loaded) count as `estimate`.
+ *
+ * Offsets are prefix sums, rebuilt lazily after a change: O(rows) once per
+ * change, O(log rows) per lookup.
+ */
+export class RowHeights {
+    estimate;
+    #measured = new Map();
+    #keys = [];
+    #prefix = new Float64Array(1);
+    #dirty = true;
+    constructor(estimate) {
+        this.estimate = estimate;
+    }
+    /** The rows, in order; `undefined` where a row isn't loaded. */
+    setKeys(keys) {
+        this.#keys = keys;
+        this.#dirty = true;
+    }
+    get count() {
+        return this.#keys.length;
+    }
+    /** Whether a row's height has been measured. */
+    has(key) {
+        return this.#measured.has(key);
+    }
+    /** Records a row's height; returns whether it changed. */
+    measure(key, height) {
+        if (this.#measured.get(key) === height)
+            return false;
+        this.#measured.set(key, height);
+        this.#dirty = true;
+        return true;
+    }
+    height(index) {
+        const key = this.#keys[index];
+        return (key !== undefined ? this.#measured.get(key) : undefined) ?? this.estimate;
+    }
+    /** The top of row `index`; `offset(count)` is the total height. */
+    offset(index) {
+        this.#build();
+        return this.#prefix[Math.max(0, Math.min(index, this.#keys.length))];
+    }
+    total() {
+        return this.offset(this.#keys.length);
+    }
+    /** The row at `y`: the last row whose top is at or above it. */
+    indexAt(y) {
+        this.#build();
+        const n = this.#keys.length;
+        if (n === 0)
+            return 0;
+        let lo = 0;
+        let hi = n - 1;
+        while (lo < hi) {
+            const mid = (lo + hi + 1) >> 1;
+            if (this.#prefix[mid] <= y)
+                lo = mid;
+            else
+                hi = mid - 1;
+        }
+        return lo;
+    }
+    /** The rows to render for a viewport, with `overscan` pixels either side. */
+    window(top, height, overscan) {
+        if (this.#keys.length === 0)
+            return { start: 0, end: 0 };
+        const start = this.indexAt(Math.max(0, top - overscan));
+        const end = Math.min(this.#keys.length, this.indexAt(top + height + overscan) + 1);
+        return { start, end };
+    }
+    #build() {
+        if (!this.#dirty)
+            return;
+        const n = this.#keys.length;
+        if (this.#prefix.length !== n + 1)
+            this.#prefix = new Float64Array(n + 1);
+        let sum = 0;
+        for (let i = 0; i < n; i++) {
+            this.#prefix[i] = sum;
+            sum += this.height(i);
+        }
+        this.#prefix[n] = sum;
+        this.#dirty = false;
+    }
+}

package/dist/grid/view.d.ts

@@ -0,0 +1,69 @@
+import type { Criteria, EntityType, Field, Query, SortKey } from "@getaster/data";
+export interface GridColumn {
+    readonly field: string;
+    /** Pixels; a column without a width shares the space left over. */
+    readonly width?: number;
+    readonly hidden?: boolean;
+    /** Server field or navigation path used for ordering; display and filtering retain `field`. */
+    readonly sortField?: string;
+}
+/**
+ * Everything a person can shape about a grid, as data: it's saved, restored,
+ * published to the page scope, and the collection's query follows it.
+ */
+export interface GridView {
+    /** In display order. */
+    readonly columns: readonly GridColumn[];
+    readonly sort: readonly SortKey[];
+    /** Criteria by column; all of them hold. */
+    readonly filters: Readonly<Record<string, Criteria>>;
+    /** An advanced expression, ANDed with column filters and the host's base. */
+    readonly criteria?: Criteria;
+    /** One field, or fields in outermost-to-innermost order. */
+    readonly groupBy?: string | readonly string[];
+    /** How many leading visible columns stay in place when scrolling sideways. */
+    readonly frozen: number;
+}
+/** The query a view describes, within `base` (such as "this project only"). */
+/** `sortPaths` maps a column to what it sorts by, for a lookup column the related record's display field. */
+export declare function viewQuery(set: string, view: GridView, base?: Criteria, sortPaths?: Readonly<Record<string, string>>): Query;
+/** Every field of `type` that has a value to show, in declaration order, the key last. */
+export declare function defaultView(type: EntityType): GridView;
+/** The column's track: its width, or a share of the space with a floor that suits its type. */
+export declare function track(column: GridColumn, field: Field | undefined): string;
+export declare function naturalWidth(field: Field | undefined): number;
+/** Numbers line up on their right edge. */
+export declare function isNumeric(field: Field | undefined): boolean;
+/** The view with one sort key set: alone, or added to the others when `add`. */
+export declare function sortBy(view: GridView, field: string, add: boolean): GridView;
+export declare function removeSort(view: GridView, field: string): GridView;
+/** Sets one direction for a column, alone or added to the sort. */
+export declare function sortDirection(view: GridView, field: string, descending: boolean, add: boolean): GridView;
+export declare function setHidden(view: GridView, field: string, hidden: boolean): GridView;
+/** Moves a column to `to`, an index among all columns (hidden ones included). */
+export declare function moveColumn(view: GridView, field: string, to: number): GridView;
+/** Moves a column one place among the visible columns. */
+export declare function nudgeColumn(view: GridView, field: string, step: -1 | 1): GridView;
+export declare function setWidth(view: GridView, field: string, width: number | undefined): GridView;
+/**
+ * Freezes the visible columns up to and including `field`. Frozen columns
+ * need fixed widths, so any without one take `fallback(field)`.
+ */
+export declare function freezeThrough(view: GridView, field: string, fallback: (field: string) => number): GridView;
+export declare function setFilter(view: GridView, field: string, criteria: Criteria | undefined): GridView;
+export declare function groupFields(view: GridView | undefined): readonly string[];
+export declare function setGroup(view: GridView, field: string | readonly string[] | undefined): GridView;
+/** A person's views for one grid: the one in use, and any saved by name. */
+export interface SavedViews {
+    readonly current?: GridView;
+    readonly named: Readonly<Record<string, GridView>>;
+}
+/** Read from this browser; empty when storage is unavailable or holds something else. */
+export declare function loadViews(key: string): SavedViews;
+export declare function storeViews(key: string, views: SavedViews): void;
+/**
+ * A stored view against the columns the grid offers now: unknown columns
+ * drop out and new ones join at the end, hidden, so a change to the page
+ * never breaks a saved view.
+ */
+export declare function reconcile(stored: GridView, offered: GridView): GridView;

package/dist/grid/view.js

@@ -0,0 +1,172 @@
+/** The query a view describes, within `base` (such as "this project only"). */
+/** `sortPaths` maps a column to what it sorts by, for a lookup column the related record's display field. */
+export function viewQuery(set, view, base, sortPaths = {}) {
+    const parts = [...(base ? [base] : []), ...Object.values(view.filters), ...(view.criteria ? [view.criteria] : [])];
+    const filter = parts.length === 0 ? undefined : parts.length === 1 ? parts[0] : { op: "and", args: parts };
+    const paths = { ...sortPaths, ...Object.fromEntries(view.columns.filter(c => c.sortField).map(c => [c.field, c.sortField])) };
+    const orderBy = view.sort.map((k) => (paths[k.field] ? { ...k, field: paths[k.field] } : k));
+    return { set, ...(filter ? { filter } : {}), ...(orderBy.length ? { orderBy } : {}) };
+}
+/** Every field of `type` that has a value to show, in declaration order, the key last. */
+export function defaultView(type) {
+    const fields = type.fields.filter((f) => !type.key.includes(f.name)).map((f) => ({ field: f.name }));
+    return { columns: fields, sort: [], filters: {}, frozen: 0 };
+}
+/** The column's track: its width, or a share of the space with a floor that suits its type. */
+export function track(column, field) {
+    if (column.width !== undefined)
+        return `${column.width}px`;
+    const prose = field?.type === "Edm.String" && !field.allowedValues && (field.maxLength ?? 0) > 500;
+    return prose ? "minmax(260px, 3fr)" : `minmax(${naturalWidth(field)}px, 1fr)`;
+}
+export function naturalWidth(field) {
+    switch (field?.type) {
+        case "Edm.Boolean":
+            return 80;
+        case "Edm.Date":
+            return 110;
+        case "Edm.DateTimeOffset":
+            return 150;
+        case "Edm.Byte":
+        case "Edm.SByte":
+        case "Edm.Int16":
+        case "Edm.Int32":
+        case "Edm.Int64":
+        case "Edm.Decimal":
+        case "Edm.Double":
+        case "Edm.Single":
+            return 90;
+        default:
+            return field?.allowedValues ? 110 : 160;
+    }
+}
+/** Numbers line up on their right edge. */
+export function isNumeric(field) {
+    return naturalWidth(field) === 90;
+}
+/** The view with one sort key set: alone, or added to the others when `add`. */
+export function sortBy(view, field, add) {
+    const current = view.sort.find((s) => s.field === field);
+    const next = { field, ...(current && !current.descending ? { descending: true } : {}) };
+    const rest = add ? view.sort.filter((s) => s.field !== field) : [];
+    return { ...view, sort: current && add ? view.sort.map((s) => (s.field === field ? next : s)) : [...rest, next] };
+}
+export function removeSort(view, field) {
+    return { ...view, sort: view.sort.filter((s) => s.field !== field) };
+}
+/** Sets one direction for a column, alone or added to the sort. */
+export function sortDirection(view, field, descending, add) {
+    const key = { field, ...(descending ? { descending } : {}) };
+    if (!add)
+        return { ...view, sort: [key] };
+    const at = view.sort.findIndex((s) => s.field === field);
+    return { ...view, sort: at >= 0 ? view.sort.map((s, i) => (i === at ? key : s)) : [...view.sort, key] };
+}
+export function setHidden(view, field, hidden) {
+    const columns = view.columns.map((c) => (c.field === field ? { ...c, hidden } : c));
+    const visible = columns.filter((c) => !c.hidden);
+    return { ...view, columns, frozen: Math.min(view.frozen, Math.max(0, visible.length - 1)) };
+}
+/** Moves a column to `to`, an index among all columns (hidden ones included). */
+export function moveColumn(view, field, to) {
+    const from = view.columns.findIndex((c) => c.field === field);
+    if (from < 0)
+        return view;
+    const columns = [...view.columns];
+    const [column] = columns.splice(from, 1);
+    columns.splice(Math.max(0, Math.min(columns.length, to)), 0, column);
+    return { ...view, columns };
+}
+/** Moves a column one place among the visible columns. */
+export function nudgeColumn(view, field, step) {
+    const visible = view.columns.filter((c) => !c.hidden);
+    const at = visible.findIndex((c) => c.field === field);
+    const neighbour = visible[at + step];
+    if (at < 0 || !neighbour)
+        return view;
+    return moveColumn(view, field, view.columns.findIndex((c) => c.field === neighbour.field));
+}
+export function setWidth(view, field, width) {
+    return {
+        ...view,
+        columns: view.columns.map((c) => {
+            if (c.field !== field)
+                return c;
+            const { width: _, ...rest } = c;
+            return width === undefined ? rest : { ...rest, width: Math.round(Math.max(48, width)) };
+        }),
+    };
+}
+/**
+ * Freezes the visible columns up to and including `field`. Frozen columns
+ * need fixed widths, so any without one take `fallback(field)`.
+ */
+export function freezeThrough(view, field, fallback) {
+    const visible = view.columns.filter((c) => !c.hidden);
+    const at = visible.findIndex((c) => c.field === field);
+    if (at < 0)
+        return view;
+    const fixed = new Set(visible.slice(0, at + 1).map((c) => c.field));
+    return {
+        ...view,
+        frozen: at + 1,
+        columns: view.columns.map((c) => (fixed.has(c.field) && c.width === undefined ? { ...c, width: fallback(c.field) } : c)),
+    };
+}
+export function setFilter(view, field, criteria) {
+    const { [field]: _, ...rest } = view.filters;
+    return { ...view, filters: criteria ? { ...rest, [field]: criteria } : rest };
+}
+export function groupFields(view) {
+    const value = view?.groupBy;
+    if (value === undefined)
+        return [];
+    const fields = typeof value === "string" ? [value] : value;
+    if (!Array.isArray(fields) || fields.some((f) => typeof f !== "string" || !f) || new Set(fields).size !== fields.length)
+        throw new Error("Grouping needs distinct nonempty fields");
+    return fields;
+}
+export function setGroup(view, field) {
+    const { groupBy: _, ...rest } = view;
+    const fields = groupFields({ ...rest, ...(field === undefined ? {} : { groupBy: field }) });
+    if (!fields.length)
+        return rest;
+    return { ...rest, groupBy: fields.length === 1 ? fields[0] : [...fields] };
+}
+/** Read from this browser; empty when storage is unavailable or holds something else. */
+export function loadViews(key) {
+    try {
+        const raw = localStorage.getItem(`aster-grid:${key}`);
+        const parsed = raw ? JSON.parse(raw) : undefined;
+        return parsed && typeof parsed.named === "object" ? parsed : { named: {} };
+    }
+    catch {
+        return { named: {} };
+    }
+}
+export function storeViews(key, views) {
+    try {
+        localStorage.setItem(`aster-grid:${key}`, JSON.stringify(views));
+    }
+    catch {
+        // Not kept; the view still applies until the page closes.
+    }
+}
+/**
+ * A stored view against the columns the grid offers now: unknown columns
+ * drop out and new ones join at the end, hidden, so a change to the page
+ * never breaks a saved view.
+ */
+export function reconcile(stored, offered) {
+    const known = new Set(offered.columns.map((c) => c.field));
+    const kept = stored.columns.filter((c) => known.has(c.field)).map(({ sortField: _, ...column }) => {
+        const sortField = offered.columns.find(c => c.field === column.field)?.sortField;
+        return sortField ? { ...column, sortField } : column;
+    });
+    const have = new Set(kept.map((c) => c.field));
+    const added = offered.columns.filter((c) => !have.has(c.field)).map((c) => ({ ...c, hidden: true }));
+    const filters = Object.fromEntries(Object.entries(stored.filters).filter(([f]) => known.has(f)));
+    const sort = stored.sort.filter((s) => known.has(s.field));
+    const view = { ...stored, columns: [...kept, ...added], filters, sort };
+    return setGroup(view, groupFields(view).filter((field) => known.has(field)));
+}

package/dist/index.d.ts

@@ -0,0 +1,63 @@
+export { ProgressStatus } from "./progress/status.ts";
+export { provideProgressPolicy, progressPolicyOf } from "./progress/policy.ts";
+export { asterComponents } from "./composition/builtins.ts";
+export { Sidebar, sidebarItems, type SidebarItem } from "./sidebar/sidebar.ts";
+export { AsterElement, define, each, provideScope, read, scopeOf, type Bindable, type View } from "./base/element.ts";
+export { Composite, compositeComponent, type CompositeOptions, type CompositeChildHandle, type CompositePlacement } from "./composition/composite.ts";
+export { CommandBar } from "./composition/command-bar.ts";
+export { defineCompositeRegistry, defineCompositeRenderer, CompositeAuthoring, type RegistryCatalog, type CompositeDiagnostic, type CompositeCompletion } from "./composition/authoring.ts";
+export { defineElement, elementProperty, type ElementProperty, type ElementProperties, type ElementValues, type DeclaredElement } from "./composition/element.ts";
+export { defineComposite, deriveComposite, CompositeError, located, type CompositeDefinition, type CompositeChild, type CompositeLayout, type CompositeValue, type CompositeSources, type CompositeLocation, type CompositeCustomization, type CompositeChildCustomization, type CompositeOverrides, type CompositeVariant } from "./composition/definition.ts";
+export { CompositeRegistry, compositeElement, type CompositeResolver, type CompositeValues, type CompositeContract, type CompositeProperty, type CompositeModel, type CompositeModelType, type CompositeMount, type CompositeSession, type CompositeFactory, type CompositeComponentType, type CompositeRenderer } from "./composition/registry.ts";
+export { compositeTypes, defineCompositeModel, describeCompositeContract, type CompositeType, type CompositeTypes, type CompositeContractValues, type TypedCompositeModel } from "./composition/contracts.ts";
+export { CaretGroup } from "./caret/caret-group.ts";
+export { Tabs, type TabItem } from "./tabs/tabs.ts";
+export { TileGrid, type TileContent, type TileState, type TileRenderer, type TilePresenter, type TileOpenDetail } from "./tile-grid/tile-grid.ts";
+export { Listbox, type RowMenuDetail, type RowRenderer } from "./listbox/listbox.ts";
+export { Button } from "./button/button.ts";
+export { Field } from "./field/field.ts";
+export { Switch, type SwitchBinding } from "./switch/switch.ts";
+export { Dialog } from "./dialog/dialog.ts";
+export { Window, type WindowState, type WindowBounds, type WindowPlacement } from "./window/window.ts";
+export { Workspace, type WorkspaceEntry, type WorkspaceSnapshot } from "./window/workspace.ts";
+export { Dashboard } from "./dashboard/dashboard.ts";
+export type { DashboardValue, DashboardConfig, DashboardSize, DashboardWidget, DashboardSnapshot } from "./dashboard/layout.ts";
+export type { DashboardMount, DashboardSession, DashboardWidgetType } from "./dashboard/widget.ts";
+export { Toaster, announce, type ToastAction } from "./toast/toast.ts";
+export { Menu, type MenuItem } from "./menu/menu.ts";
+export { morph, setScheme } from "./motion.ts";
+export { absoluteTime, compactMoney, relativeTime } from "./format.ts";
+export { BoundField, type ControlContext } from "./field/bound-field.ts";
+export { CompositeField, type CompositeFieldContext } from "./field/composite-field.ts";
+export { NumberField, type NumericType, type NumericValue } from "./field/number-field.ts";
+export { Stack, HorizontalLayout, VerticalLayout } from "./layout/stack.ts";
+export { Breadcrumbs, type BreadcrumbItem } from "./breadcrumbs/breadcrumbs.ts";
+export { Accordion, type AccordionItem } from "./section/accordion.ts";
+export { Check } from "./field/check.ts";
+export { formatValue, parseInput } from "./field/values.ts";
+export { Select } from "./select/select.ts";
+export { Choice } from "./select/choice-element.ts";
+export { ChoiceState, choiceView, type ChoiceProps, type Option } from "./select/choice.ts";
+export { Picker } from "./picker/picker.ts";
+export { PickerOptions, type OptionsSpec } from "./picker/options.ts";
+export { TreePicker } from "./picker/tree-picker.ts";
+export { TreeChoices, type TreeChoicesSpec } from "./picker/tree-choices.ts";
+export { DateField } from "./date/date-field.ts";
+export { formatDate, parseDate, setClock } from "./date/dates.ts";
+export { Section } from "./section/section.ts";
+export { Form, type FormField, type FormItem, type FormSection, type FormValue } from "./form/form.ts";
+export { controlFor } from "./form/controls.ts";
+export { Split } from "./split/split.ts";
+export { ListEditor, type ListColumn } from "./list-edit/list-edit.ts";
+export { Grid, type CellRenderer, type CellFormatter, type GridSummary, type GridCsvOptions, type Expansion, type ExpansionEditor, type GridTree, type Lookup, type RowControl, type RowState } from "./grid/grid.ts";
+export { RowHeights } from "./grid/rows.ts";
+export { TreeNavigator } from "./tree/navigator.ts";
+export { Carousel, type Slide } from "./carousel/carousel.ts";
+export { RuleEditor, type RuleField } from "./rule/rule-editor.ts";
+export { FilterBuilder } from "./filter/filter-builder.ts";
+export { ComponentHost, type ComponentAdapter, type ComponentSession, type ComponentMount, type ComponentEnvironment } from "./component/component.ts";
+export { echartsAdapter, echartsColors, type EChartsAdapterOptions, type EChartsRuntime, type EChartsInstance } from "./component/echarts.ts";
+export { Slicer } from "./slicer/slicer.ts";
+export { defaultView, sortBy, viewQuery, type GridColumn, type GridView } from "./grid/view.ts";
+export { DENSITIES, DENSITY, DENSITY_NAMES, TOKENS, TOKEN_NAMES } from "./styles/contract.ts";
+export { CompositeSessions, type CompositeSessionsOptions, type CompositeKeyedSession } from "./composition/sessions.ts";

package/dist/index.js

@@ -0,0 +1,61 @@
+export { ProgressStatus } from "./progress/status.js";
+export { provideProgressPolicy, progressPolicyOf } from "./progress/policy.js";
+export { asterComponents } from "./composition/builtins.js";
+export { Sidebar, sidebarItems } from "./sidebar/sidebar.js";
+export { AsterElement, define, each, provideScope, read, scopeOf } from "./base/element.js";
+export { Composite, compositeComponent } from "./composition/composite.js";
+export { CommandBar } from "./composition/command-bar.js";
+export { defineCompositeRegistry, defineCompositeRenderer, CompositeAuthoring } from "./composition/authoring.js";
+export { defineElement, elementProperty } from "./composition/element.js";
+export { defineComposite, deriveComposite, CompositeError, located } from "./composition/definition.js";
+export { CompositeRegistry, compositeElement } from "./composition/registry.js";
+export { compositeTypes, defineCompositeModel, describeCompositeContract } from "./composition/contracts.js";
+export { CaretGroup } from "./caret/caret-group.js";
+export { Tabs } from "./tabs/tabs.js";
+export { TileGrid } from "./tile-grid/tile-grid.js";
+export { Listbox } from "./listbox/listbox.js";
+export { Button } from "./button/button.js";
+export { Field } from "./field/field.js";
+export { Switch } from "./switch/switch.js";
+export { Dialog } from "./dialog/dialog.js";
+export { Window } from "./window/window.js";
+export { Workspace } from "./window/workspace.js";
+export { Dashboard } from "./dashboard/dashboard.js";
+export { Toaster, announce } from "./toast/toast.js";
+export { Menu } from "./menu/menu.js";
+export { morph, setScheme } from "./motion.js";
+export { absoluteTime, compactMoney, relativeTime } from "./format.js";
+export { BoundField } from "./field/bound-field.js";
+export { CompositeField } from "./field/composite-field.js";
+export { NumberField } from "./field/number-field.js";
+export { Stack, HorizontalLayout, VerticalLayout } from "./layout/stack.js";
+export { Breadcrumbs } from "./breadcrumbs/breadcrumbs.js";
+export { Accordion } from "./section/accordion.js";
+export { Check } from "./field/check.js";
+export { formatValue, parseInput } from "./field/values.js";
+export { Select } from "./select/select.js";
+export { Choice } from "./select/choice-element.js";
+export { ChoiceState, choiceView } from "./select/choice.js";
+export { Picker } from "./picker/picker.js";
+export { PickerOptions } from "./picker/options.js";
+export { TreePicker } from "./picker/tree-picker.js";
+export { TreeChoices } from "./picker/tree-choices.js";
+export { DateField } from "./date/date-field.js";
+export { formatDate, parseDate, setClock } from "./date/dates.js";
+export { Section } from "./section/section.js";
+export { Form } from "./form/form.js";
+export { controlFor } from "./form/controls.js";
+export { Split } from "./split/split.js";
+export { ListEditor } from "./list-edit/list-edit.js";
+export { Grid } from "./grid/grid.js";
+export { RowHeights } from "./grid/rows.js";
+export { TreeNavigator } from "./tree/navigator.js";
+export { Carousel } from "./carousel/carousel.js";
+export { RuleEditor } from "./rule/rule-editor.js";
+export { FilterBuilder } from "./filter/filter-builder.js";
+export { ComponentHost } from "./component/component.js";
+export { echartsAdapter, echartsColors } from "./component/echarts.js";
+export { Slicer } from "./slicer/slicer.js";
+export { defaultView, sortBy, viewQuery } from "./grid/view.js";
+export { DENSITIES, DENSITY, DENSITY_NAMES, TOKENS, TOKEN_NAMES } from "./styles/contract.js";
+export { CompositeSessions } from "./composition/sessions.js";

package/dist/layout/stack.d.ts

@@ -0,0 +1,112 @@
+import type { View } from "../base/element.ts";
+export declare const Stack: import("../index.ts").DeclaredElement<{
+    readonly direction: {
+        readonly type: import("../index.ts").CompositeType<"horizontal" | "vertical">;
+        readonly initial: () => "horizontal" | "vertical";
+        readonly description: string;
+    };
+    readonly gap: {
+        readonly type: import("../index.ts").CompositeType<"small" | "none" | "medium" | "large">;
+        readonly initial: () => "small" | "none" | "medium" | "large";
+        readonly description: string;
+    };
+    readonly align: {
+        readonly type: import("../index.ts").CompositeType<"center" | "stretch" | "start" | "end" | "baseline">;
+        readonly initial: () => "center" | "stretch" | "start" | "end" | "baseline";
+        readonly description: string;
+    };
+    readonly justify: {
+        readonly type: import("../index.ts").CompositeType<"center" | "start" | "end" | "space-between" | "space-around">;
+        readonly initial: () => "center" | "start" | "end" | "space-between" | "space-around";
+        readonly description: string;
+    };
+    readonly wrap: {
+        readonly type: import("../index.ts").CompositeType<boolean>;
+        readonly initial: () => boolean;
+        readonly description: string;
+    };
+    readonly responsive: {
+        readonly type: import("../index.ts").CompositeType<boolean>;
+        readonly initial: () => boolean;
+        readonly description: string;
+    };
+    readonly content: {
+        readonly type: import("../index.ts").CompositeType<View>;
+        readonly initial: () => View;
+        readonly description: string;
+    };
+}>;
+export declare const HorizontalLayout: import("../index.ts").DeclaredElement<{
+    readonly direction: {
+        readonly type: import("../index.ts").CompositeType<"horizontal" | "vertical">;
+        readonly initial: () => "horizontal" | "vertical";
+        readonly description: string;
+    };
+    readonly gap: {
+        readonly type: import("../index.ts").CompositeType<"small" | "none" | "medium" | "large">;
+        readonly initial: () => "small" | "none" | "medium" | "large";
+        readonly description: string;
+    };
+    readonly align: {
+        readonly type: import("../index.ts").CompositeType<"center" | "stretch" | "start" | "end" | "baseline">;
+        readonly initial: () => "center" | "stretch" | "start" | "end" | "baseline";
+        readonly description: string;
+    };
+    readonly justify: {
+        readonly type: import("../index.ts").CompositeType<"center" | "start" | "end" | "space-between" | "space-around">;
+        readonly initial: () => "center" | "start" | "end" | "space-between" | "space-around";
+        readonly description: string;
+    };
+    readonly wrap: {
+        readonly type: import("../index.ts").CompositeType<boolean>;
+        readonly initial: () => boolean;
+        readonly description: string;
+    };
+    readonly responsive: {
+        readonly type: import("../index.ts").CompositeType<boolean>;
+        readonly initial: () => boolean;
+        readonly description: string;
+    };
+    readonly content: {
+        readonly type: import("../index.ts").CompositeType<View>;
+        readonly initial: () => View;
+        readonly description: string;
+    };
+}>;
+export declare const VerticalLayout: import("../index.ts").DeclaredElement<{
+    readonly direction: {
+        readonly type: import("../index.ts").CompositeType<"horizontal" | "vertical">;
+        readonly initial: () => "horizontal" | "vertical";
+        readonly description: string;
+    };
+    readonly gap: {
+        readonly type: import("../index.ts").CompositeType<"small" | "none" | "medium" | "large">;
+        readonly initial: () => "small" | "none" | "medium" | "large";
+        readonly description: string;
+    };
+    readonly align: {
+        readonly type: import("../index.ts").CompositeType<"center" | "stretch" | "start" | "end" | "baseline">;
+        readonly initial: () => "center" | "stretch" | "start" | "end" | "baseline";
+        readonly description: string;
+    };
+    readonly justify: {
+        readonly type: import("../index.ts").CompositeType<"center" | "start" | "end" | "space-between" | "space-around">;
+        readonly initial: () => "center" | "start" | "end" | "space-between" | "space-around";
+        readonly description: string;
+    };
+    readonly wrap: {
+        readonly type: import("../index.ts").CompositeType<boolean>;
+        readonly initial: () => boolean;
+        readonly description: string;
+    };
+    readonly responsive: {
+        readonly type: import("../index.ts").CompositeType<boolean>;
+        readonly initial: () => boolean;
+        readonly description: string;
+    };
+    readonly content: {
+        readonly type: import("../index.ts").CompositeType<View>;
+        readonly initial: () => View;
+        readonly description: string;
+    };
+}>;

package/dist/layout/stack.js

@@ -0,0 +1,21 @@
+import { html, nothing } from "lit-html";
+import { defineElement, elementProperty } from "../composition/element.js";
+import { compositeTypes as t } from "../composition/contracts.js";
+const choice = (...values) => t.custom(values.join(" | "), (v) => values.includes(v), { enum: values });
+const content = t.custom("content template", (v) => v === nothing || !!v && typeof v === "object" && "_$litType$" in v);
+const properties = {
+    gap: elementProperty(choice("none", "small", "medium", "large"), () => "medium", "gap"),
+    align: elementProperty(choice("stretch", "start", "center", "end", "baseline"), () => "stretch", "align"),
+    justify: elementProperty(choice("start", "center", "end", "space-between", "space-around"), () => "start", "justify"),
+    wrap: elementProperty(t.boolean, () => false, "wrap"),
+    responsive: elementProperty(t.boolean, () => true, "responsive"),
+    content: elementProperty(content, () => nothing, "content"),
+};
+function stack(tag, direction) {
+    return defineElement({ tag, properties: { ...properties, direction: elementProperty(choice("horizontal", "vertical"), () => direction, "Layout direction") },
+        render: p => html `<div class="aster-stack" data-direction=${p.direction} data-gap=${p.gap} data-align=${p.align} data-justify=${p.justify} ?data-wrap=${p.wrap} ?data-responsive=${p.responsive}>${p.content}</div>`,
+    });
+}
+export const Stack = stack("aster-stack", "vertical");
+export const HorizontalLayout = stack("aster-horizontal-layout", "horizontal");
+export const VerticalLayout = stack("aster-vertical-layout", "vertical");