@industream/flowmaker-flowbox-ui-components 0.0.12 → 0.0.14

package/src/DCCatalogEntryPicker/picker-column-helpers.ts

@@ -0,0 +1,126 @@
+/**
+ * Catalog entry column system.
+ *
+ * Declarative column definitions that drive both the TagBrowser table
+ * and the SelectedTags panel. Consumers pass an array of column keys
+ * (e.g. ['name', 'sourceParams.nodeId', 'dataType']) to control display.
+ *
+ * ── Static column keys ──────────────────────────────────────────────
+ *
+ *   Key        | Label       | Source                | Render
+ *   -----------|-------------|-----------------------|--------
+ *   'name'     | Name        | CatalogEntry.name      | text
+ *   'dataType' | Data Type   | CatalogEntry.dataType  | pill
+ *   'labels'   | Labels      | CatalogEntry.labels[]  | labels
+ *
+ * ── Dynamic column keys (dot-path) ──────────────────────────────────
+ *
+ *   Any key starting with 'sourceParams.' or 'metadata.' resolves the
+ *   corresponding sub-property at runtime. No pre-registration needed.
+ *
+ *   Key                      | Label      | Source                           | Render
+ *   -------------------------|------------|----------------------------------|--------
+ *   'sourceParams.nodeId'    | Node ID    | CatalogEntry.sourceParams.nodeId  | code
+ *   'sourceParams.topic'     | Topic      | CatalogEntry.sourceParams.topic   | code
+ *   'metadata.unit'          | Unit       | CatalogEntry.metadata.unit        | pill
+ *   'metadata.description'   | Description| CatalogEntry.metadata.description | text
+ *   ... any other sub-key    | (auto)     | ...                               | (auto)
+ *
+ * Render types:
+ *   - 'text'   : plain text cell (truncated, with title tooltip)
+ *   - 'code'   : monospace <code> cell
+ *   - 'pill'   : small badge/pill (only rendered when value is truthy)
+ *   - 'labels' : iterates Label[] array, renders each as a pill
+ *
+ * sourceParams.* keys default to 'code' rendering.
+ * metadata.* keys default to 'pill' rendering.
+ * Override by adding an explicit entry in COLUMN_DEFS.
+ */
+
+import type { CatalogEntry, Label } from '@industream/datacatalog-client/dto';
+
+/** How a cell should be rendered */
+export type ColumnType = 'text' | 'code' | 'pill' | 'labels';
+
+export interface ColumnDef {
+    label: string;
+    resolve: (entry: CatalogEntry) => unknown;
+    type: ColumnType;
+}
+
+/**
+ * Static column definitions for top-level CatalogEntry fields.
+ * For sourceParams / metadata sub-properties, use dot-path keys instead
+ * (see {@link resolveColumn}).
+ */
+export const COLUMN_DEFS: Record<string, ColumnDef> = {
+    name:     { label: 'Name',      resolve: (e) => e.name,     type: 'text' },
+    dataType: { label: 'Data Type', resolve: (e) => e.dataType, type: 'pill' },
+    labels:   { label: 'Labels',    resolve: (e) => e.labels ?? [], type: 'labels' },
+};
+
+/** Default columns for the tag browser table */
+export const DEFAULT_COLUMNS: string[] = ['name', 'dataType', 'labels'];
+
+/** Default columns for the selected tags display panel */
+export const DEFAULT_SELECTED_COLUMNS_DISPLAY: string[] = ['name', 'dataType', 'labels'];
+
+/**
+ * Capitalize a dot-path sub-key into a human-readable label.
+ * e.g. 'nodeId' → 'Node Id', 'pollInterval' → 'Poll Interval'
+ */
+const humanize = (key: string): string =>
+    key.replace(/([A-Z])/g, ' $1').replace(/^./, (c) => c.toUpperCase()).trim();
+
+/**
+ * Resolve a column definition for any key — static or dot-path.
+ *
+ * Static keys are looked up in COLUMN_DEFS.
+ * Dot-path keys (sourceParams.*, metadata.*) are resolved dynamically:
+ *   - sourceParams.* → renders as 'code'
+ *   - metadata.*     → renders as 'pill'
+ */
+export const resolveColumn = (key: string): ColumnDef | undefined => {
+    if (COLUMN_DEFS[key]) return COLUMN_DEFS[key];
+
+    if (key.startsWith('sourceParams.')) {
+        const prop = key.slice('sourceParams.'.length);
+        return {
+            label: humanize(prop),
+            resolve: (e) => (e.sourceParams as Record<string, unknown>)?.[prop],
+            type: 'code',
+        };
+    }
+
+    if (key.startsWith('metadata.')) {
+        const prop = key.slice('metadata.'.length);
+        return {
+            label: humanize(prop),
+            resolve: (e) => (e.metadata as Record<string, unknown>)?.[prop],
+            type: 'pill',
+        };
+    }
+
+    return undefined;
+};
+
+/**
+ * Resolve a single column value from a catalog entry.
+ */
+export const resolveValue = (entry: CatalogEntry, key: string): unknown =>
+    resolveColumn(key)?.resolve(entry);
+
+/**
+ * Build a lowercase search string from all active column values.
+ * Used by TagBrowser's search filter.
+ */
+export const resolveSearchText = (entry: CatalogEntry, keys: string[]): string =>
+    keys
+        .map((key) => {
+            const val = resolveValue(entry, key);
+            if (val == null) return '';
+            if (Array.isArray(val)) return val.map((v: Label) => v.name ?? v).join(' ');
+            return String(val);
+        })
+        .join(' ')
+        .toLowerCase();

package/src/index.ts

@@ -4,5 +4,7 @@ export type { SourceConnection } from './DCSourceConnection.svelte';
 export { default as DCCatalogEntry } from './DCCatalogEntry.svelte';
 export type { CatalogEntry, DataType, SourceType } from '@industream/datacatalog-client/dto';
 
-
+export { default as DCCatalogEntryPicker } from './DCCatalogEntryPicker/DCCatalogEntryPicker.svelte';
+export type { ColumnDef, ColumnType } from './DCCatalogEntryPicker/picker-column-helpers';
+export { COLUMN_DEFS, DEFAULT_COLUMNS, DEFAULT_SELECTED_COLUMNS_DISPLAY, resolveColumn, resolveValue, resolveSearchText } from './DCCatalogEntryPicker/picker-column-helpers';