@revenexx/studio-shared 0.3.2 → 0.4.0

package/dist/runtime/components/Dashboard/DashboardWidgetPreview.d.vue.ts

@@ -0,0 +1,23 @@
+/**
+ * The picture on a widget's library card (PE-480).
+ *
+ * A schematic, not a screenshot and not the live widget. The Integration
+ * Studio's template gallery draws its preview from the workflow definition for
+ * the same reason: a maintained screenshot goes stale the first time the widget
+ * changes and nobody notices. Rendering the real widget instead would be
+ * accurate but would fire every widget's queries the moment the library opens.
+ *
+ * So each widget declares a `preview` shape, and this draws it — pure layout,
+ * no data, no requests. It says what the widget *looks* like, which is what a
+ * person picking from a list actually needs.
+ */
+import type { WidgetPreviewShape } from '../../lib/widgetRegistry.js';
+type __VLS_Props = {
+    shape: WidgetPreviewShape;
+    dimmed?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    dimmed: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Dashboard/DashboardWidgetPreview.vue

@@ -0,0 +1,124 @@
+<script setup>
+defineProps({
+  shape: { type: String, required: true },
+  dimmed: { type: Boolean, required: false, default: false }
+});
+const BARS = [38, 62, 45, 80, 55, 92, 48, 70, 60, 85, 52, 74];
+const RANKS = [100, 72, 54, 38, 26];
+const FUNNEL = [100, 68, 34];
+</script>
+
+<template>
+  <div
+    class="pointer-events-none flex h-24 w-full flex-col justify-center gap-1.5 overflow-hidden rounded-md border border-black/[0.06] bg-gradient-to-b from-white to-black/[0.02] px-3 py-2.5"
+    :class="dimmed ? 'opacity-40 grayscale' : ''"
+    aria-hidden="true"
+  >
+    <!-- One number on a card — what a manifest `EntityCount` draws (PE-618). -->
+    <div v-if="shape === 'count'" class="flex h-full flex-col justify-center px-1">
+      <div class="h-1 w-1/3 rounded-full bg-black/10" />
+      <div class="mt-2 h-5 w-1/2 rounded-sm bg-black/25" />
+      <div class="mt-2 h-1 w-2/5 rounded-full bg-black/10" />
+    </div>
+
+    <!-- Four tiles with a number and a spark under each. -->
+    <div v-else-if="shape === 'kpi-row'" class="grid grid-cols-4 gap-1.5">
+      <div v-for="n in 4" :key="n" class="rounded border border-black/[0.06] bg-white px-1.5 py-1">
+        <div class="h-1 w-3/4 rounded-full bg-black/10" />
+        <div class="mt-1 h-2 w-2/3 rounded-sm bg-black/25" />
+        <div class="mt-1 h-0.5 w-full rounded-full bg-violet-400/60" />
+      </div>
+    </div>
+
+    <!-- Daily bars. -->
+    <div v-else-if="shape === 'bar-chart'" class="flex h-full items-end gap-[3px]">
+      <div
+        v-for="(h, i) in BARS"
+        :key="i"
+        class="flex-1 rounded-t-[2px] bg-violet-500/70"
+        :style="{ height: `${h}%` }"
+      />
+    </div>
+
+    <!-- Label + value + proportional bar, repeated. -->
+    <div v-else-if="shape === 'ranked-list'" class="flex flex-col gap-1.5">
+      <div v-for="(w, i) in RANKS.slice(0, 4)" :key="i">
+        <div class="flex items-center justify-between gap-2">
+          <div class="h-1 rounded-full bg-black/15" :style="{ width: `${30 + i % 3 * 14}%` }" />
+          <div class="h-1 w-5 rounded-full bg-black/20" />
+        </div>
+        <div class="mt-0.5 h-1 rounded-full bg-black/[0.06]">
+          <div class="h-full rounded-full bg-violet-500/70" :style="{ width: `${w}%` }" />
+        </div>
+      </div>
+    </div>
+
+    <!-- Narrowing stages. -->
+    <div v-else-if="shape === 'funnel'" class="flex flex-col gap-2">
+      <div v-for="(w, i) in FUNNEL" :key="i" class="flex items-center gap-2">
+        <div class="h-1 w-8 rounded-full bg-black/15" />
+        <div class="h-2 flex-1 rounded-full bg-black/[0.06]">
+          <div class="h-full rounded-full" :class="i === 2 ? 'bg-emerald-500/70' : 'bg-violet-500/70'" :style="{ width: `${w}%` }" />
+        </div>
+      </div>
+    </div>
+
+    <!-- Two or four big figures side by side. -->
+    <div v-else-if="shape === 'stat-split'" class="grid grid-cols-2 gap-2">
+      <div v-for="n in 4" :key="n" class="flex flex-col gap-1">
+        <div class="h-1 w-2/3 rounded-full bg-black/10" />
+        <div class="h-2.5 w-1/2 rounded-sm bg-black/25" />
+      </div>
+    </div>
+
+    <!-- Rows with an icon chip, two lines and a time on the right. -->
+    <div v-else-if="shape === 'feed'" class="flex flex-col gap-1.5">
+      <div v-for="n in 4" :key="n" class="flex items-center gap-2">
+        <div class="size-3.5 shrink-0 rounded bg-violet-400/40" />
+        <div class="min-w-0 flex-1">
+          <div class="h-1 rounded-full bg-black/15" :style="{ width: `${52 + n % 3 * 14}%` }" />
+          <div class="mt-0.5 h-1 w-1/3 rounded-full bg-black/[0.08]" />
+        </div>
+        <div class="h-1 w-3 shrink-0 rounded-full bg-black/10" />
+      </div>
+    </div>
+
+    <!-- Tiles with a state dot. -->
+    <div v-else-if="shape === 'status-grid'" class="grid grid-cols-2 gap-1.5">
+      <div v-for="n in 4" :key="n" class="flex items-center gap-1.5 rounded border border-black/[0.06] bg-white px-1.5 py-1.5">
+        <span class="size-1.5 rounded-full" :class="n === 3 ? 'bg-amber-500' : 'bg-emerald-500'" />
+        <div class="h-1 flex-1 rounded-full bg-black/12" />
+      </div>
+    </div>
+
+    <!-- Paragraph. -->
+    <div v-else-if="shape === 'text'" class="flex flex-col gap-1.5">
+      <div v-for="(w, i) in [96, 88, 92, 54]" :key="i" class="h-1.5 rounded-full bg-black/[0.10]" :style="{ width: `${w}%` }" />
+    </div>
+
+    <!-- Link rows with a chevron. -->
+    <div v-else-if="shape === 'links'" class="flex flex-col gap-1.5">
+      <div v-for="n in 4" :key="n" class="flex items-center justify-between gap-2 rounded px-1 py-1" :class="n === 1 ? 'bg-black/[0.03]' : ''">
+        <div class="h-1 rounded-full bg-black/15" :style="{ width: `${34 + n % 3 * 16}%` }" />
+        <div class="size-1.5 rotate-45 border-r border-t border-black/20" />
+      </div>
+    </div>
+
+    <!-- A greeting line with a row of action chips. -->
+    <div v-else-if="shape === 'greeting'" class="flex flex-col gap-2">
+      <div class="h-1 w-1/4 rounded-full bg-black/10" />
+      <div class="h-3 w-2/3 rounded-sm bg-black/20" />
+      <div class="flex gap-1.5">
+        <div v-for="n in 5" :key="n" class="size-4 rounded bg-black/[0.06]" />
+      </div>
+    </div>
+
+    <!-- Fallback: small multiples. -->
+    <div v-else class="grid grid-cols-3 gap-1.5">
+      <div v-for="n in 3" :key="n" class="rounded border border-black/[0.06] bg-white p-1.5">
+        <div class="h-1 w-2/3 rounded-full bg-black/10" />
+        <div class="mt-1 h-1 w-full rounded-full bg-violet-400/50" />
+      </div>
+    </div>
+  </div>
+</template>

package/dist/runtime/components/Dashboard/DashboardWidgetPreview.vue.d.ts

@@ -0,0 +1,23 @@
+/**
+ * The picture on a widget's library card (PE-480).
+ *
+ * A schematic, not a screenshot and not the live widget. The Integration
+ * Studio's template gallery draws its preview from the workflow definition for
+ * the same reason: a maintained screenshot goes stale the first time the widget
+ * changes and nobody notices. Rendering the real widget instead would be
+ * accurate but would fire every widget's queries the moment the library opens.
+ *
+ * So each widget declares a `preview` shape, and this draws it — pure layout,
+ * no data, no requests. It says what the widget *looks* like, which is what a
+ * person picking from a list actually needs.
+ */
+import type { WidgetPreviewShape } from '../../lib/widgetRegistry.js';
+type __VLS_Props = {
+    shape: WidgetPreviewShape;
+    dimmed?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    dimmed: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/DataTable/ColumnsMenu.d.vue.ts

@@ -4,11 +4,12 @@ type __VLS_Props = {
     /** Set of currently visible column keys. */
     visible: Set<string>;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     toggle: (key: string) => any;
     reorder: (from: number, to: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onToggle?: ((key: string) => any) | undefined;
     onReorder?: ((from: number, to: number) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/DataTable/ColumnsMenu.vue.d.ts

@@ -4,11 +4,12 @@ type __VLS_Props = {
     /** Set of currently visible column keys. */
     visible: Set<string>;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     toggle: (key: string) => any;
     reorder: (from: number, to: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onToggle?: ((key: string) => any) | undefined;
     onReorder?: ((from: number, to: number) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/DataTable/DataTable.d.vue.ts

@@ -1,16 +1,9 @@
-import type { DataTableColumn, DataTableFilter, DataTableRail, DataTableSavedViews, DataTableState, DataTableViewMode, RowKey, SortState } from './types.js';
-declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:sort"?: ((value: SortState) => any) | undefined;
-        readonly "onUpdate:page"?: ((value: number) => any) | undefined;
-        readonly "onUpdate:viewMode"?: ((value: string) => any) | undefined;
-        readonly "onUpdate:railOpen"?: ((value: boolean) => any) | undefined;
-        readonly onRowClick?: ((row: T) => any) | undefined;
-        readonly onStateChange?: ((state: DataTableState) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:sort" | "onUpdate:page" | "onUpdate:viewMode" | "onUpdate:railOpen" | "onRowClick" | "onStateChange"> & ({
+import { Eye } from '#solar-icons';
+declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<({
         data: T[];
-        columns: DataTableColumn<T>[];
-        rowKey: RowKey<T>;
+        columns: Eye<T>[];
+        rowKey: Eye<T>;
         /** `label` is the field's accessible name; it defaults to the placeholder
          *  where the surface wrote one (see `searchLabel`). */
         search?: boolean | {
@@ -27,15 +20,34 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
         };
         /** Built-in status/dimension filter pills (static mode). One dimension, or
          *  several (each renders as its own sub-menu). */
-        filterTabs?: DataTableFilter<T> | DataTableFilter<T>[];
+        filterTabs?: Eye<T> | Eye<T>[];
+        /**
+         * The surface's declared dimensions, as one facet model (PE-6xx).
+         *
+         * The THIRD filter path, and the one the others are being folded into. It
+         * differs from `filterTabs` in who does the work: those are filtered in
+         * memory here, which a server-paged list cannot use — a facet count taken
+         * over one page of fifty rows out of twenty-three thousand is a number
+         * nobody can reconcile with the table under it. Here the surface owns the
+         * query and the counts, and this component only draws the control and hands
+         * back a committed selection (`v-model:facet-selection`).
+         *
+         * EVERY declared dimension lives in this one panel, committed together, and
+         * reads back in one chip strip under the toolbar. There is deliberately no
+         * second placement: a tree pinned in a left column beside a panel is two
+         * places to look and two commit rules for one question.
+         */
+        facets?: Eye[];
+        /** Say which facet each chip belongs to (see `FacetChips.showFacet`). */
+        chipFacetLabels?: boolean;
         /** Saved views control — the surface supplies snapshot/apply, the table
          *  owns the control, the storage and the dialogs. */
-        savedViews?: DataTableSavedViews | null;
+        savedViews?: Eye | null;
         /** View-mode switch (e.g. List | Gallery). Any mode other than `list`
          *  renders the `#view` slot in place of the table body. */
-        viewModes?: DataTableViewMode[] | null;
+        viewModes?: Eye[] | null;
         /** Collapse handle for the surface's left rail (see `ListSurface`). */
-        rail?: boolean | DataTableRail;
+        rail?: boolean | Eye;
         /**
          * Scroll the ROWS inside the table instead of the page.
          *
@@ -52,8 +64,13 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
          * sitting above it. That is not a detail: a scrollbar takes width from the
          * scrolling box, so a header outside it stays wider than the rows and every
          * column drifts by however wide the scrollbar is.
+         *
+         * `'fit'` measures instead of guessing: the rows get whatever height is left
+         * in the surrounding scroll container, so the table ends where the page ends
+         * and nothing below it is pushed out of sight. A short list still ends after
+         * its last row — the measurement is a MAXIMUM, not a height.
          */
-        scrollBody?: boolean | {
+        scrollBody?: boolean | "fit" | {
             maxHeight?: string;
         };
         pagination?: boolean | {
@@ -69,18 +86,66 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
         emptyText?: string;
         groupBy?: ((row: T) => string[]) | null;
         groupEmptyLabel?: string;
+        /** The row whose record is open beside the table (a DetailSheet), marked so
+         *  reading down the list keeps the place visible (PE-690). */
+        activeRowKey?: string | number | null;
+        /**
+         * A row's own tint — a quantity tier set apart under the SKU it belongs to.
+         * Replaces the row's default ground rather than stacking on it: two
+         * translucent backgrounds on one element are whichever Tailwind emitted last.
+         */
+        rowClass?: ((row: T) => string | null | undefined) | null;
+        /**
+         * Rows the operator orders by dragging (PE-952). Draws a handle in a leading
+         * column; a drop — or the arrow keys on a focused handle — emits `rowMove`
+         * with the new order. The table writes nothing: what a position MEANS, and
+         * which rows have to be written for it, is the surface's to decide.
+         */
+        reorderable?: boolean;
+        /**
+         * Why the handles are off right now, or null when they are on. The surface
+         * knows the cases this component cannot see — a sort that is not the
+         * sequence, a write still in flight. The table adds its own: a search, a
+         * filter or a grouping, under any of which "the row above" is not the row
+         * above in the sequence.
+         */
+        reorderDisabled?: string | null;
     } & {
-        sort?: SortState;
+        sort?: Eye;
         page?: number;
         viewMode?: string;
         railOpen?: boolean;
-    }) & Partial<{}>> & import("vue").PublicProps;
-    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+        /**
+         * The committed facet selection. Two-way so a chip removed under the toolbar,
+         * a facet picked in the surface's pinned rail and the panel's own Apply all
+         * write to one place — and so the surface can seed it from a saved view or a
+         * URL without this component holding a second copy to drift from.
+         */
+        facetSelection?: Eye;
+    }) & {
+        onRowClick?: ((row: T) => any) | undefined;
+        onStateChange?: ((state: DataTableState) => any) | undefined;
+        onOrderChange?: ((keys: (string | number)[]) => any) | undefined;
+        onRowMove?: ((move: {
+            key: string | number;
+            from: number;
+            to: number;
+            keys: (string | number)[];
+        }) => any) | undefined;
+        "onUpdate:sort"?: ((value: SortState) => any) | undefined;
+        "onUpdate:page"?: ((value: number) => any) | undefined;
+        "onUpdate:viewMode"?: ((value: string) => any) | undefined;
+        "onUpdate:railOpen"?: ((value: boolean) => any) | undefined;
+        "onUpdate:facetSelection"?: ((value: FacetSelection) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
     attrs: any;
     slots: {
-        [x: string]: ((props: {}) => any) | undefined;
+        [x: `header-${any}`]: ((props: {}) => any) | undefined;
     } & {
-        [x: string]: ((props: {
+        [x: `cell-${any}`]: ((props: {
             row: any;
         }) => any) | undefined;
     } & {
@@ -96,16 +161,28 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
     } & {
         view?: (props: {
             rows: any;
-            loading: any;
+            loading: boolean;
         }) => any;
     } & {
-        empty?: (props: {}) => any;
+        empty?: (props: {
+            query: any;
+            filters: any;
+            clear: () => void;
+        }) => any;
     };
-    emit: (((evt: "rowClick", row: T) => void) & ((evt: "stateChange", state: DataTableState) => void)) & (((evt: "update:sort", value: SortState) => void) & ((evt: "update:page", value: number) => void) & ((evt: "update:viewMode", value: string) => void) & ((evt: "update:railOpen", value: boolean) => void));
+    emit: (((evt: "rowClick", row: T) => void) & ((evt: "stateChange", state: DataTableState) => void) & ((evt: "orderChange", keys: (string | number)[]) => void) & ((evt: "rowMove", move: {
+        key: string | number;
+        from: number;
+        to: number;
+        keys: (string | number)[];
+    }) => void)) & (((event: "update:sort", value: SortState) => void) & ((event: "update:page", value: number) => void) & ((event: "update:viewMode", value: string) => void) & ((event: "update:railOpen", value: boolean) => void) & ((event: "update:facetSelection", value: FacetSelection) => void));
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
+declare const _default: typeof __VLS_export;
 export default _default;
-type __VLS_PrettifyLocal<T> = {
+type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];
-} & {};
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};