@dxos/react-ui-table 0.8.4-main.bc674ce → 0.8.4-main.bcb3aa67d6

package/dist/lib/browser/{chunk-OZBLY7XM.mjs → chunk-BF54SSNL.mjs}

@@ -8,29 +8,32 @@ var __export = (target, all) => {
 var Table_exports = {};
 __export(Table_exports, {
   Table: () => Table,
-  TableV1: () => TableV1,
   make: () => make
 });
 import * as Match from "effect/Match";
 import * as Schema from "effect/Schema";
 import * as SchemaAST from "effect/SchemaAST";
-import { Obj, Ref, Type } from "@dxos/echo";
+import { Annotation, JsonSchema, Obj, Ref, Type } from "@dxos/echo";
+import { View } from "@dxos/echo";
 import { FormInputAnnotation, LabelAnnotation } from "@dxos/echo/internal";
-import { View, ViewAnnotation } from "@dxos/schema";
+import { ViewAnnotation } from "@dxos/schema";
 var Table = Schema.Struct({
   name: Schema.String.pipe(Schema.optional),
-  view: Type.Ref(View.View).pipe(FormInputAnnotation.set(false)),
+  view: Ref.Ref(View.View).pipe(FormInputAnnotation.set(false)),
   sizes: Schema.Record({
     // TODO(wittjosiah): Should be JsonPath.
     key: Schema.String,
     value: Schema.Number
   }).pipe(Schema.mutable, FormInputAnnotation.set(false))
 }).pipe(Type.object({
-  typename: "dxos.org/type/Table",
-  version: "0.2.0"
+  typename: "org.dxos.type.table",
+  version: "0.1.0"
 }), LabelAnnotation.set([
   "name"
-]), ViewAnnotation.set(true));
+]), ViewAnnotation.set(true), Annotation.IconAnnotation.set({
+  icon: "ph--table--regular",
+  hue: "green"
+}));
 var make = ({ name, sizes = {}, view, jsonSchema }) => {
   const table = Obj.make(Table, {
     name,
@@ -38,7 +41,7 @@ var make = ({ name, sizes = {}, view, jsonSchema }) => {
     sizes
   });
   if (jsonSchema) {
-    const schema = Type.toEffectSchema(jsonSchema);
+    const schema = JsonSchema.toEffectSchema(jsonSchema);
     const properties = SchemaAST.getPropertySignatures(schema.ast);
     for (const property of properties) {
       const name2 = property.name.toString();
@@ -60,17 +63,8 @@ var make = ({ name, sizes = {}, view, jsonSchema }) => {
   }
   return table;
 };
-var TableV1 = Schema.Struct({
-  sizes: Schema.Record({
-    key: Schema.String,
-    value: Schema.Number
-  }).pipe(Schema.mutable)
-}).pipe(Type.object({
-  typename: "dxos.org/type/Table",
-  version: "0.1.0"
-}));
 
 export {
   Table_exports
 };
-//# sourceMappingURL=chunk-OZBLY7XM.mjs.map
+//# sourceMappingURL=chunk-BF54SSNL.mjs.map

package/dist/lib/browser/chunk-BF54SSNL.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/types/Table.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Match from 'effect/Match';\nimport * as Schema from 'effect/Schema';\nimport * as SchemaAST from 'effect/SchemaAST';\n\nimport { Annotation, JsonSchema, Obj, Ref, Type } from '@dxos/echo';\nimport { View } from '@dxos/echo';\nimport { FormInputAnnotation, type JsonPath, type JsonSchemaType, LabelAnnotation } from '@dxos/echo/internal';\nimport { ViewAnnotation } from '@dxos/schema';\n\nexport const Table = Schema.Struct({\n  name: Schema.String.pipe(Schema.optional),\n\n  view: Ref.Ref(View.View).pipe(FormInputAnnotation.set(false)),\n\n  sizes: Schema.Record({\n    // TODO(wittjosiah): Should be JsonPath.\n    key: Schema.String,\n    value: Schema.Number,\n  }).pipe(Schema.mutable, FormInputAnnotation.set(false)),\n}).pipe(\n  Type.object({\n    typename: 'org.dxos.type.table',\n    version: '0.1.0',\n  }),\n  LabelAnnotation.set(['name']),\n  ViewAnnotation.set(true),\n  Annotation.IconAnnotation.set({\n    icon: 'ph--table--regular',\n    hue: 'green',\n  }),\n);\n\nexport interface Table extends Schema.Schema.Type<typeof Table> {}\n\ntype MakeProps = {\n  name?: string;\n  sizes?: Record<string, number>;\n  view: View.View;\n  /** Required to auto-size columns. */\n  jsonSchema?: JsonSchemaType;\n};\n\n/**\n * Make a table as a view of a data set.\n */\nexport const make = ({ name, sizes = {}, view, jsonSchema }: MakeProps): Table => {\n  const table = Obj.make(Table, { name, view: Ref.make(view), sizes } as Obj.MakeProps<typeof Table>);\n\n  // Preset sizes.\n  if (jsonSchema) {\n    const schema = JsonSchema.toEffectSchema(jsonSchema);\n    const properties = SchemaAST.getPropertySignatures(schema.ast);\n    for (const property of properties) {\n      const name = property.name.toString() as JsonPath;\n      if (sizes?.[name]) {\n        table.sizes[name] = sizes[name];\n        continue;\n      }\n\n      Match.type<SchemaAST.AST>().pipe(\n        Match.when({ _tag: 'BooleanKeyword' }, () => {\n          table.sizes[name] = 100;\n        }),\n        Match.when({ _tag: 'NumberKeyword' }, () => {\n          table.sizes[name] = 100;\n        }),\n        Match.orElse(() => {\n          // Noop.\n        }),\n      )(property.type);\n    }\n  }\n\n  return table;\n};\n"],
+  "mappings": ";;;;;;;AAAA;;;;;AAIA,YAAYA,WAAW;AACvB,YAAYC,YAAY;AACxB,YAAYC,eAAe;AAE3B,SAASC,YAAYC,YAAYC,KAAKC,KAAKC,YAAY;AACvD,SAASC,YAAY;AACrB,SAASC,qBAAyDC,uBAAuB;AACzF,SAASC,sBAAsB;AAExB,IAAMC,QAAeC,cAAO;EACjCC,MAAaC,cAAOC,KAAYC,eAAQ;EAExCC,MAAMC,IAAIA,IAAIC,KAAKA,IAAI,EAAEJ,KAAKK,oBAAoBC,IAAI,KAAA,CAAA;EAEtDC,OAAcC,cAAO;;IAEnBC,KAAYV;IACZW,OAAcC;EAChB,CAAA,EAAGX,KAAYY,gBAASP,oBAAoBC,IAAI,KAAA,CAAA;AAClD,CAAA,EAAGN,KACDa,KAAKC,OAAO;EACVC,UAAU;EACVC,SAAS;AACX,CAAA,GACAC,gBAAgBX,IAAI;EAAC;CAAO,GAC5BY,eAAeZ,IAAI,IAAA,GACnBa,WAAWC,eAAed,IAAI;EAC5Be,MAAM;EACNC,KAAK;AACP,CAAA,CAAA;AAgBK,IAAMC,OAAO,CAAC,EAAEzB,MAAMS,QAAQ,CAAC,GAAGL,MAAMsB,WAAU,MAAa;AACpE,QAAMC,QAAQC,IAAIH,KAAK3B,OAAO;IAAEE;IAAMI,MAAMC,IAAIoB,KAAKrB,IAAAA;IAAOK;EAAM,CAAA;AAGlE,MAAIiB,YAAY;AACd,UAAMG,SAASC,WAAWC,eAAeL,UAAAA;AACzC,UAAMM,aAAuBC,gCAAsBJ,OAAOK,GAAG;AAC7D,eAAWC,YAAYH,YAAY;AACjC,YAAMhC,QAAOmC,SAASnC,KAAKoC,SAAQ;AACnC,UAAI3B,QAAQT,KAAAA,GAAO;AACjB2B,cAAMlB,MAAMT,KAAAA,IAAQS,MAAMT,KAAAA;AAC1B;MACF;AAEAqC,MAAMC,WAAI,EAAkBpC,KACpBqC,WAAK;QAAEC,MAAM;MAAiB,GAAG,MAAA;AACrCb,cAAMlB,MAAMT,KAAAA,IAAQ;MACtB,CAAA,GACMuC,WAAK;QAAEC,MAAM;MAAgB,GAAG,MAAA;AACpCb,cAAMlB,MAAMT,KAAAA,IAAQ;MACtB,CAAA,GACMyC,aAAO,MAAA;MAEb,CAAA,CAAA,EACAN,SAASG,IAAI;IACjB;EACF;AAEA,SAAOX;AACT;",
+  "names": ["Match", "Schema", "SchemaAST", "Annotation", "JsonSchema", "Obj", "Ref", "Type", "View", "FormInputAnnotation", "LabelAnnotation", "ViewAnnotation", "Table", "Struct", "name", "String", "pipe", "optional", "view", "Ref", "View", "FormInputAnnotation", "set", "sizes", "Record", "key", "value", "Number", "mutable", "Type", "object", "typename", "version", "LabelAnnotation", "ViewAnnotation", "Annotation", "IconAnnotation", "icon", "hue", "make", "jsonSchema", "table", "Obj", "schema", "JsonSchema", "toEffectSchema", "properties", "getPropertySignatures", "ast", "property", "toString", "Match", "type", "when", "_tag", "orElse"]
+}

package/dist/lib/browser/{chunk-I5IFW7UF.mjs → chunk-EK6D2CVM.mjs}

@@ -6,6 +6,9 @@ var extractOrder = (queryAst) => {
   if (queryAst.type === "options") {
     return extractOrder(queryAst.query);
   }
+  if (queryAst.type === "from") {
+    return extractOrder(queryAst.query);
+  }
   return void 0;
 };
 
@@ -69,7 +72,7 @@ var BUTTON_IDENTIFIERS = {
 };
 var createButton = ({ attr, data, disabled = false, icon, testId, type: _type = "primary" }) => {
   const dataAttrs = Object.entries(data).map(([k, v]) => `${k}="${v}"`).join(" ");
-  return `<button ${attr} data-testid="${testId}" class="dx-button is-6 aspect-square pli-0.5 min-bs-0" ${dataAttrs} ${disabled ? "disabled" : ""} data-dx-grid-action="accessory"><svg data-size="4"><use href="/icons.svg#${icon}"/></svg></button>`;
+  return `<button ${attr} data-testid="${testId}" class="dx-button w-6 aspect-square px-0.5 min-h-0" ${dataAttrs} ${disabled ? "disabled" : ""} data-dx-grid-action="accessory"><svg data-size="4"><use href="/icons.svg#${icon}"/></svg></button>`;
 };
 var addColumnButton = {
   attr: BUTTON_IDENTIFIERS.newColumn,
@@ -182,8 +185,8 @@ var CONTROL_IDENTIFIERS = {
   switch: "data-table-switch"
 };
 var BASE_CLASSES = {
-  checkbox: "absolute inset-block-[.375rem] inline-end-[.375rem] dx-checkbox",
-  switch: "absolute inset-block-[.25rem] inline-end-[.25rem] dx-checkbox--switch"
+  checkbox: "absolute inset-y-[.375rem] end-[.375rem] dx-checkbox",
+  switch: "absolute inset-y-[.25rem] end-[.25rem] dx-checkbox--switch"
 };
 var renderAttributes = (data) => {
   return Object.entries(data).map(([k, v]) => `${k}="${v}"`).join(" ");
@@ -410,7 +413,7 @@ var TableModel = class extends Resource2 {
   _visibleRange;
   _onInsertRow;
   _onDeleteRows;
-  _onDeleteColumn;
+  _onColumnDelete;
   _onCellUpdate;
   _onRowOrderChange;
   _onRowAction;
@@ -436,7 +439,7 @@ var TableModel = class extends Resource2 {
   constructor({ registry, object, projection, db, change, features = {}, initialSelection = [], pinnedRows = {
     top: [],
     bottom: []
-  }, rowActions = [], onCellUpdate, onDeleteColumn, onDeleteRows, onInsertRow, onRowOrderChange, onRowAction }) {
+  }, rowActions = [], onCellUpdate, onColumnDelete, onDeleteRows, onInsertRow, onRowOrderChange, onRowAction }) {
     super();
     this._registry = registry;
     this._object = object;
@@ -450,7 +453,7 @@ var TableModel = class extends Resource2 {
     };
     invariant(!(this._features.dataEditable && this._features.selection.enabled && this._features.selection.mode === "single"), "Single selection is not compatible with editable tables.", {
       F: __dxlog_file,
-      L: 196,
+      L: 197,
       S: this,
       A: [
         "!(this._features.dataEditable && this._features.selection.enabled && this._features.selection.mode === 'single')",
@@ -529,7 +532,7 @@ var TableModel = class extends Resource2 {
     this._rowActions = rowActions;
     this._onInsertRow = onInsertRow;
     this._onDeleteRows = onDeleteRows;
-    this._onDeleteColumn = onDeleteColumn;
+    this._onColumnDelete = onColumnDelete;
     this._onCellUpdate = onCellUpdate;
     this._onRowOrderChange = onRowOrderChange;
     this._onRowAction = onRowAction;
@@ -541,7 +544,7 @@ var TableModel = class extends Resource2 {
     const view = this._object.view.target;
     invariant(view, "Table model not initialized", {
       F: __dxlog_file,
-      L: 307,
+      L: 308,
       S: this,
       A: [
         "view",
@@ -609,7 +612,7 @@ var TableModel = class extends Resource2 {
   get columnMeta() {
     invariant(this._columnMeta, void 0, {
       F: __dxlog_file,
-      L: 380,
+      L: 381,
       S: this,
       A: [
         "this._columnMeta",
@@ -636,7 +639,7 @@ var TableModel = class extends Resource2 {
   initializeColumnMeta() {
     invariant(this._object.view.target, "View must be loaded before initializing column meta", {
       F: __dxlog_file,
-      L: 404,
+      L: 405,
       S: this,
       A: [
         "this._object.view.target",
@@ -906,19 +909,21 @@ var TableModel = class extends Resource2 {
       const currentRow = this._registry.get(this._rows)[row];
       invariant(currentRow, "Invalid row index", {
         F: __dxlog_file,
-        L: 692,
+        L: 693,
         S: this,
         A: [
           "currentRow",
           "'Invalid row index'"
         ]
       });
-      const snapshot = getSnapshot(currentRow);
+      const snapshot = {
+        ...getSnapshot(currentRow)
+      };
       setValue(snapshot, field.path, transformedValue);
       const schema = Obj.getSchema(currentRow);
       invariant(schema, void 0, {
         F: __dxlog_file,
-        L: 698,
+        L: 699,
         S: this,
         A: [
           "schema",
@@ -930,7 +935,7 @@ var TableModel = class extends Resource2 {
         const error = validationResult[0];
         invariant(error.path === field.path, void 0, {
           F: __dxlog_file,
-          L: 703,
+          L: 704,
           S: this,
           A: [
             "error.path === field.path",
@@ -1021,8 +1026,8 @@ var TableModel = class extends Resource2 {
       return;
     }
     const field = this._projection?.getFields().find((field2) => field2.id === fieldId);
-    if (field && this._onDeleteColumn) {
-      this._onDeleteColumn(field.id);
+    if (field && this._onColumnDelete) {
+      this._onColumnDelete(field.id);
     }
   }
   //
@@ -1100,13 +1105,13 @@ var TableModel = class extends Resource2 {
       const field = this._projection.getFields().find((f) => f.id === inMemorySort.fieldId);
       if (field) {
         const newQuery = baseQuery.orderBy(Order.property(field.path, inMemorySort.direction));
-        Obj.change(view, (v) => {
-          v.query.ast = newQuery.ast;
+        Obj.change(view, (obj) => {
+          obj.query.ast = newQuery.ast;
         });
       }
     } else {
-      Obj.change(view, (v) => {
-        v.query.ast = baseQuery.ast;
+      Obj.change(view, (obj) => {
+        obj.query.ast = baseQuery.ast;
       });
     }
     this._registry.set(this._inMemorySort, void 0);
@@ -1314,7 +1319,7 @@ var TablePresentation = class {
       const targetObj = getValue2(obj, field.path)?.target;
       if (targetObj) {
         const dxn = Obj2.getDXN(targetObj)?.toString();
-        cell.accessoryHtml = `<div role="none" class="absolute inline-end-0 inset-block-0 p-[--dx-grid-cell-content-padding-block]"><dx-anchor refId=${dxn} class="dx-button is-6 aspect-square min-bs-0" data-dx-grid-action="accessory"><dx-icon icon="ph--link-simple--regular"/></dx-anchor></div>`;
+        cell.accessoryHtml = `<div role="none" class="absolute end-0 inset-y-0 p-(--dx-grid-cell-content-padding-block)"><dx-anchor dxn=${dxn} class="dx-button w-6 aspect-square min-h-0" data-dx-grid-action="accessory"><dx-icon icon="ph--link-simple--regular"/></dx-anchor></div>`;
       }
     }
     if (props.format === Format3.TypeFormat.Boolean) {
@@ -1428,7 +1433,7 @@ var TablePresentation = class {
         value: "",
         resizeHandle: "col",
         accessoryHtml: `
-          <span class="grow min-is-0 truncate">${props.title ?? field.path}</span>
+          <span class="grow min-w-0 truncate">${props.title ?? field.path}</span>
           ${direction !== void 0 ? tableButtons.sort.render({
           fieldId: field.id,
           direction
@@ -1437,7 +1442,7 @@ var TablePresentation = class {
           fieldId: field.id
         })}
         `,
-        className: "!bg-toolbarSurface !text-description [&>div]:flex [&>div]:items-stretch"
+        className: "!bg-toolbar-surface text-description! [&>div]:flex [&>div]:items-stretch"
       };
     }
     return cells;
@@ -1488,7 +1493,7 @@ var TablePresentation = class {
           col: 0,
           row: 0
         })]: {
-          className: "!bg-toolbarSurface",
+          className: "!bg-toolbar-surface",
           readonly: true,
           value: ""
         }
@@ -1504,7 +1509,7 @@ var TablePresentation = class {
           header: true,
           checked: this.model.selection.allRowsSelected
         }),
-        className: "!bg-toolbarSurface",
+        className: "!bg-toolbar-surface",
         readonly: true,
         value: ""
       }
@@ -1519,7 +1524,7 @@ var TablePresentation = class {
         accessoryHtml: this.model.features.schemaEditable ? tableButtons.addColumn.render({
           disabled: (this.model.projection?.getFields()?.length ?? 0) >= VIEW_FIELD_LIMIT
         }) : void 0,
-        className: "!bg-toolbarSurface",
+        className: "!bg-toolbar-surface",
         readonly: true,
         value: ""
       }
@@ -1577,7 +1582,7 @@ var cellClassesForRowSelection = (selected, selectionMode) => {
   if (!selected) {
     if (selectionMode === "single") {
       return [
-        "!cursor-pointer"
+        "cursor-pointer!"
       ];
     } else {
       return void 0;
@@ -1586,11 +1591,11 @@ var cellClassesForRowSelection = (selected, selectionMode) => {
   switch (selectionMode) {
     case "single":
       return [
-        "!bg-currentRelated dx-grid__cell--no-focus-unfurl hover:bg-hoverSurface !cursor-pointer"
+        "dx-grid__cell--no-focus-unfurl !bg-current-surface hover:bg-hover-surface cursor-pointer!"
       ];
     case "multiple":
       return [
-        "!bg-gridCellSelected"
+        "!bg-grid-cell-selected"
       ];
   }
 };
@@ -1617,7 +1622,7 @@ var useAddRow = ({ db, schema }) => {
 
 // src/hooks/useProjectionModel.ts
 import { useState } from "react";
-import { Type } from "@dxos/echo";
+import { JsonSchema, Type } from "@dxos/echo";
 import { useAsyncEffect } from "@dxos/react-ui";
 import { ProjectionModel, createEchoChangeCallback as createEchoChangeCallback2 } from "@dxos/schema";
 var useProjectionModel = (schema, table, registry) => {
@@ -1625,7 +1630,7 @@ var useProjectionModel = (schema, table, registry) => {
   useAsyncEffect(async () => {
     if (schema && table) {
       const view = await table.view.load();
-      const jsonSchema = Type.isMutable(schema) ? schema.jsonSchema : Type.toJsonSchema(schema);
+      const jsonSchema = Type.isMutable(schema) ? schema.jsonSchema : JsonSchema.toJsonSchema(schema);
       const change = createEchoChangeCallback2(view, Type.isMutable(schema) ? schema : void 0);
       const projection2 = new ProjectionModel({
         registry,
@@ -1743,4 +1748,4 @@ export {
   useProjectionModel,
   useTableModel
 };
-//# sourceMappingURL=chunk-I5IFW7UF.mjs.map
+//# sourceMappingURL=chunk-EK6D2CVM.mjs.map