blixify-ui-web 1.2.158 → 1.2.160
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/data/dataTemplate/index.d.ts.map +1 -1
- package/lib/components/data/dataTemplate/index.js +42 -17
- package/lib/components/data/dataTemplate/index.js.map +1 -1
- package/lib/components/display/newTable/index.d.ts +3 -0
- package/lib/components/display/newTable/index.d.ts.map +1 -1
- package/lib/components/display/newTable/index.js +206 -33
- package/lib/components/display/newTable/index.js.map +1 -1
- package/lib/tail.css +1 -1
- package/package.json +1 -1
|
@@ -44,6 +44,8 @@ interface AdvancedSettings {
|
|
|
44
44
|
renderAddColumnElements?: (id: string, onClose: any) => any;
|
|
45
45
|
onAddColumn?: (column: DataStructure) => void | Promise<void>;
|
|
46
46
|
onDeleteColumn?: (columnId: string) => void | Promise<void>;
|
|
47
|
+
getColumnSchema?: (columnId: string) => DataStructure | undefined;
|
|
48
|
+
onEditColumn?: (column: DataStructure) => void | Promise<void>;
|
|
47
49
|
renderReferenceSpaceOptions?: () => Option[];
|
|
48
50
|
renderReferenceLabelOptions?: (spaceId?: string) => Option[];
|
|
49
51
|
onDragColumn?: (dragId: string, dropId: string, newHeader: TableHeader[]) => void;
|
|
@@ -131,5 +133,6 @@ export interface NewTableProps extends LinkProps, DeleteableProps, EditableProps
|
|
|
131
133
|
onRowActivity?: (id: string) => void;
|
|
132
134
|
enableCopy?: boolean;
|
|
133
135
|
}
|
|
136
|
+
export declare const handleGetEditableColumnTypes: (type: string) => string[];
|
|
134
137
|
export declare const NewTable: (props: NewTableProps) => React.JSX.Element;
|
|
135
138
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/display/newTable/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/display/newTable/index.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,EACZ,YAAY,EAKb,MAAM,OAAO,CAAC;AAMf,OAAO,EACL,YAAY,EACZ,aAAa,EACb,WAAW,EACZ,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAa5C,OAAO,EAAE,MAAM,EAAU,MAAM,oBAAoB,CAAC;AAEpD,OAAO,EAAQ,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAKvD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAO,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAGvC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB;AAKD,MAAM,MAAM,cAAc,GAAG,WAAW,CAAC;AAEzC,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAKD,MAAM,WAAW,iBAAiB;IAEhC,aAAa,CAAC,EAAE;QAEd,MAAM,CAAC,EAAE,MAAM,CAAC;QAEhB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QAEpC,WAAW,CAAC,EAAE,MAAM,CAAC;QAErB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;KACxB,CAAC;IAEF,OAAO,CAAC,EAAE;QAER,QAAQ,CAAC,EAAE,MAAM,CAAC;QAElB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;QAEvB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;QAGnB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;KACtC,CAAC;CACH;AAED,UAAU,gBAAgB;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAI3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,IAAI,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,oBAAoB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,GAAG,CAAC;IAC3C,uBAAuB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,GAAG,CAAC;IAE5D,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAI9D,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAI5D,eAAe,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,aAAa,GAAG,SAAS,CAAC;IAClE,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAG/D,2BAA2B,CAAC,EAAE,MAAM,MAAM,EAAE,CAAC;IAC7C,2BAA2B,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;IAC7D,YAAY,CAAC,EAAE,CACb,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,WAAW,EAAE,KACrB,IAAI,CAAC;IACV,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAGpC,YAAY,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAED,UAAU,YAAY;IACpB,OAAO,CAAC,EAAE;QACR,MAAM,EAAE,OAAO,CAAC;QAChB,SAAS,EAAE,CAAC,IAAI,EAAE;YAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;SAAE,KAAK,IAAI,CAAC;KACnD,CAAC;CACH;AAED,UAAU,aAAa;IACrB,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,OAAO,CAAC;QAChB,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;KAC7E,CAAC;IACF,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CACrE;AAED,UAAU,eAAe;IACvB,UAAU,CAAC,EAAE;QACX,MAAM,EAAE,OAAO,CAAC;QAChB,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;KACvC,CAAC;CACH;AAED,MAAM,WAAW,aACf,SAAQ,SAAS,EAAE,eAAe,EAAE,aAAa,EAAE,YAAY;IAC/D,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,cAAc,EAAE,CAAC;IAC1B,IAAI,EAAE,WAAW,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,GAAG,EAAE,CAAC;IAGlB,iBAAiB,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;KAAE,CAAC;IAGhD,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,UAAU,CAAC,EAAE;QAAE,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IACnD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,yBAAyB,CAAC,EAAE,OAAO,CAAC;IAEpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;IAC9C,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,uBAAuB,CAAC,EAAE;QACxB,EAAE,EAAE,MAAM,CAAC;QACX,OAAO,EAAE,MAAM,CAAC;QAChB,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;QAC9B,IAAI,CAAC,EAAE,OAAO,CAAC;KAChB,EAAE,CAAC;IACJ,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,YAAY,CAAC;IAEjC,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC5C,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IACzD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,EAAE,YAAY,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACpE,qEAAqE;IACrE,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAGrC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AA+JD,eAAO,MAAM,4BAA4B,SAAU,MAAM,aAGxD,CAAC;AAmDF,eAAO,MAAM,QAAQ,UAAW,aAAa,sBA+lG5C,CAAC"}
|
|
@@ -82,7 +82,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
82
82
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
83
83
|
};
|
|
84
84
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
85
|
-
exports.NewTable = void 0;
|
|
85
|
+
exports.NewTable = exports.handleGetEditableColumnTypes = void 0;
|
|
86
86
|
var react_1 = require("@headlessui/react");
|
|
87
87
|
var solid_1 = require("@heroicons/react/20/solid");
|
|
88
88
|
var outline_1 = require("@heroicons/react/24/outline");
|
|
@@ -204,6 +204,52 @@ var LIST_TYPES = ["list", "multipleList"];
|
|
|
204
204
|
// INFO: asset columns need a storage path, which the consumer fills in from its
|
|
205
205
|
// own settings — nothing for the user to type
|
|
206
206
|
var ASSET_TYPES = ["image", "file", "multipleImage", "multipleFile"];
|
|
207
|
+
// INFO: the values already in the rows are never converted, so a column
|
|
208
|
+
// only changes to a type its existing values are always valid as — specific to
|
|
209
|
+
// general, never back: a phone number is valid text, but text is not always a
|
|
210
|
+
// valid phone number, and an image is a file while a file is not an image.
|
|
211
|
+
// Anything else keeps its type and becomes a new column instead.
|
|
212
|
+
var SAFE_TYPE_CHANGES = {
|
|
213
|
+
string: ["textArea", "markdown"],
|
|
214
|
+
textArea: ["string", "markdown"],
|
|
215
|
+
markdown: ["string", "textArea"],
|
|
216
|
+
email: ["string", "textArea"],
|
|
217
|
+
contact: ["string", "textArea"],
|
|
218
|
+
list: ["string", "textArea"],
|
|
219
|
+
image: ["file"],
|
|
220
|
+
multipleImage: ["multipleFile"],
|
|
221
|
+
};
|
|
222
|
+
// INFO: settings of one type that mean nothing on another, dropped when a
|
|
223
|
+
// column changes type
|
|
224
|
+
var TYPE_ONLY_KEYS = {
|
|
225
|
+
string: ["stringRegex", "stringSuggestions", "barcodeEnabled"],
|
|
226
|
+
};
|
|
227
|
+
// INFO: settings read from a reference's target space, dropped when the target
|
|
228
|
+
// changes — they name fields of the old space
|
|
229
|
+
var REFERENCE_TARGET_KEYS = [
|
|
230
|
+
"referenceSecondaryLabel",
|
|
231
|
+
"referenceExtraSearchIds",
|
|
232
|
+
"referenceImage",
|
|
233
|
+
"referenceQuery",
|
|
234
|
+
"referenceSort",
|
|
235
|
+
"referenceDependency",
|
|
236
|
+
];
|
|
237
|
+
// INFO: an option list as the panel shows it, and the way back
|
|
238
|
+
var handleJoinOptions = function (options) { return options.join(", "); };
|
|
239
|
+
var handleSplitOptions = function (text) {
|
|
240
|
+
return text
|
|
241
|
+
.split(",")
|
|
242
|
+
.map(function (eachOption) { return eachOption.trim(); })
|
|
243
|
+
.filter(Boolean);
|
|
244
|
+
};
|
|
245
|
+
// INFO: the column's own type first, then those it may become
|
|
246
|
+
var handleGetEditableColumnTypes = function (type) {
|
|
247
|
+
var _a;
|
|
248
|
+
return __spreadArray([
|
|
249
|
+
type
|
|
250
|
+
], ((_a = SAFE_TYPE_CHANGES[type]) !== null && _a !== void 0 ? _a : []), true);
|
|
251
|
+
};
|
|
252
|
+
exports.handleGetEditableColumnTypes = handleGetEditableColumnTypes;
|
|
207
253
|
// INFO: group band (tinted) and the accent bar its member rows carry
|
|
208
254
|
var BAND_CLASS = {
|
|
209
255
|
default: "bg-primary-50 text-primary-800 border-primary-500",
|
|
@@ -315,17 +361,19 @@ var NewTable = function (props) {
|
|
|
315
361
|
var _10 = (0, react_2.useState)(""), newColumnOptions = _10[0], setNewColumnOptions = _10[1];
|
|
316
362
|
var _11 = (0, react_2.useState)(false), newColumnRequired = _11[0], setNewColumnRequired = _11[1];
|
|
317
363
|
var _12 = (0, react_2.useState)(false), addingColumn = _12[0], setAddingColumn = _12[1];
|
|
364
|
+
// INFO: the column being changed — empty while the panel adds a new one
|
|
365
|
+
var _13 = (0, react_2.useState)(null), editingColumn = _13[0], setEditingColumn = _13[1];
|
|
318
366
|
//=====================================================================================
|
|
319
367
|
// SECTION: Editable & Addable cells
|
|
320
368
|
//=====================================================================================
|
|
321
|
-
var
|
|
322
|
-
var
|
|
369
|
+
var _14 = (0, react_2.useState)(""), editDataRowId = _14[0], setEditDataRowId = _14[1];
|
|
370
|
+
var _15 = (0, react_2.useState)(""), editDataHeaderKey = _15[0], setEditDataHeaderKey = _15[1];
|
|
323
371
|
// INFO: an editable table used to mount an input in every cell — it read as a
|
|
324
372
|
// form, and a row click always landed on a child input. Only the hovered cell
|
|
325
373
|
// becomes its input now.
|
|
326
|
-
var
|
|
327
|
-
var
|
|
328
|
-
var
|
|
374
|
+
var _16 = (0, react_2.useState)(null), hoveredCell = _16[0], setHoveredCell = _16[1];
|
|
375
|
+
var _17 = (0, react_2.useState)(false), modalEditVisible = _17[0], setModalEditVisible = _17[1];
|
|
376
|
+
var _18 = (0, react_2.useState)([]), collapsedGroupIds = _18[0], setCollapsedGroupIds = _18[1];
|
|
329
377
|
// INFO: sheet-style row selection — Shift-click extends from the last
|
|
330
378
|
// clicked row, a mouse-down-and-drag down the checkbox column paints a
|
|
331
379
|
// range. The drag applies the start row itself, so the click that lands on
|
|
@@ -333,20 +381,20 @@ var NewTable = function (props) {
|
|
|
333
381
|
var lastSelectedRowRef = (0, react_2.useRef)(null);
|
|
334
382
|
var dragSelectRef = (0, react_2.useRef)(null);
|
|
335
383
|
var suppressNextClickRef = (0, react_2.useRef)(false);
|
|
336
|
-
var
|
|
337
|
-
var
|
|
338
|
-
var
|
|
339
|
-
var
|
|
340
|
-
var
|
|
341
|
-
var
|
|
342
|
-
var
|
|
384
|
+
var _19 = (0, react_2.useState)(false), isDragSelecting = _19[0], setIsDragSelecting = _19[1];
|
|
385
|
+
var _20 = (0, react_2.useState)(0), copiedCount = _20[0], setCopiedCount = _20[1];
|
|
386
|
+
var _21 = (0, react_2.useState)({}), editDataValue = _21[0], setEditDataValue = _21[1];
|
|
387
|
+
var _22 = (0, react_2.useState)(false), editDataIsLoading = _22[0], setEditDataIsLoading = _22[1];
|
|
388
|
+
var _23 = (0, react_2.useState)(false), addData = _23[0], setAddData = _23[1];
|
|
389
|
+
var _24 = (0, react_2.useState)({}), addDataValue = _24[0], setAddDataValue = _24[1];
|
|
390
|
+
var _25 = (0, react_2.useState)({}), referencesOptions = _25[0], setReferencesOptions = _25[1];
|
|
343
391
|
// INFO: seeded options sit under the local map so a cell's own search
|
|
344
392
|
// results still win per key
|
|
345
393
|
var mergedReferencesOptions = __assign(__assign({}, ((_l = props.referencesOptions) !== null && _l !== void 0 ? _l : {})), referencesOptions);
|
|
346
|
-
var
|
|
347
|
-
var
|
|
394
|
+
var _26 = (0, react_2.useState)({}), referencesDetails = _26[0], setReferencesDetails = _26[1];
|
|
395
|
+
var _27 = (0, react_2.useState)(false), referenceLoading = _27[0], setReferenceLoading = _27[1];
|
|
348
396
|
// INFO: measured pixel widths for pinned columns without an explicit width.
|
|
349
|
-
var
|
|
397
|
+
var _28 = (0, react_2.useState)({}), measuredPinWidths = _28[0], setMeasuredPinWidths = _28[1];
|
|
350
398
|
var editDataValueRef = (0, react_2.useRef)({});
|
|
351
399
|
var editDataRowIdRef = (0, react_2.useRef)("");
|
|
352
400
|
var editDataHeaderKeyRef = (0, react_2.useRef)("");
|
|
@@ -772,7 +820,7 @@ var NewTable = function (props) {
|
|
|
772
820
|
// resize is a per-viewer preference and there is no storage for it yet.
|
|
773
821
|
// Tailwind cannot emit a runtime w-[Npx], so this drives an inline style and
|
|
774
822
|
// wins over the col.width class.
|
|
775
|
-
var
|
|
823
|
+
var _29 = (0, react_2.useState)({}), columnWidths = _29[0], setColumnWidths = _29[1];
|
|
776
824
|
var resizeRef = (0, react_2.useRef)(null);
|
|
777
825
|
// INFO: a consumer may deliberately set a column narrower than the default
|
|
778
826
|
// floor (a 40px icon column, say) — never force it wider than it was asked to
|
|
@@ -838,24 +886,31 @@ var NewTable = function (props) {
|
|
|
838
886
|
});
|
|
839
887
|
};
|
|
840
888
|
var renderAddColumnPanel = function () {
|
|
841
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
889
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
842
890
|
// INFO: a caller that renders its own form keeps full control; the
|
|
843
891
|
// built-in one only appears when it hands over onAddColumn instead
|
|
844
892
|
if ((_a = props.advSettings) === null || _a === void 0 ? void 0 : _a.renderAddColumnElements)
|
|
845
893
|
return (react_2.default.createElement("div", null, props.advSettings.renderAddColumnElements(addColumnModal, function (id) { return handleAddColumnModal(id); })));
|
|
846
894
|
if (!((_b = props.advSettings) === null || _b === void 0 ? void 0 : _b.onAddColumn))
|
|
847
895
|
return null;
|
|
848
|
-
var derivedId =
|
|
849
|
-
|
|
896
|
+
var derivedId = editingColumn
|
|
897
|
+
? editingColumn.id
|
|
898
|
+
: handleDeriveColumnId(newColumnName);
|
|
899
|
+
var taken = !editingColumn && !!derivedId && handleColumnIdTaken(derivedId);
|
|
850
900
|
return (react_2.default.createElement("div", { className: "flex flex-col gap-y-4" },
|
|
851
901
|
react_2.default.createElement(textInput_1.TextInput, { id: "newColumnName", type: "text", label: "Column name", placeholder: "Order Date", value: newColumnName, darkMode: props.darkMode, onChange: function (event) { var _a, _b; return setNewColumnName((_b = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : ""); } }),
|
|
852
|
-
react_2.default.createElement("div", { className: "-mt-2" },
|
|
902
|
+
!editingColumn && (react_2.default.createElement("div", { className: "-mt-2" },
|
|
853
903
|
react_2.default.createElement("p", { className: "text-xs text-gray-500" }, derivedId ? (react_2.default.createElement(react_2.default.Fragment, null,
|
|
854
904
|
"Saved on each record as",
|
|
855
905
|
" ",
|
|
856
906
|
react_2.default.createElement("span", { className: "font-mono font-medium" }, derivedId),
|
|
857
|
-
taken ? " — already used by another column" : "")) : ("The field id is generated from the name"))),
|
|
858
|
-
react_2.default.createElement(select_1.Select, { id: "newColumnType", label: "Type", value: newColumnType, darkMode: props.darkMode, options:
|
|
907
|
+
taken ? " — already used by another column" : "")) : ("The field id is generated from the name")))),
|
|
908
|
+
react_2.default.createElement(select_1.Select, { id: "newColumnType", label: "Type", value: newColumnType, darkMode: props.darkMode, options: editingColumn
|
|
909
|
+
? ADD_COLUMN_TYPES.filter(function (eachType) {
|
|
910
|
+
return (0, exports.handleGetEditableColumnTypes)(editingColumn.type).includes(eachType.key);
|
|
911
|
+
})
|
|
912
|
+
: ADD_COLUMN_TYPES, disabled: !!editingColumn &&
|
|
913
|
+
(0, exports.handleGetEditableColumnTypes)(editingColumn.type).length < 2, portalDropdown: true, onChange: function (value) { return setNewColumnType(value); } }),
|
|
859
914
|
REFERENCE_TYPES.includes(newColumnType) &&
|
|
860
915
|
((_c = props.advSettings) === null || _c === void 0 ? void 0 : _c.renderReferenceSpaceOptions) && (react_2.default.createElement(react_2.default.Fragment, null,
|
|
861
916
|
react_2.default.createElement(select_1.Select, { id: "newColumnRefSpace", label: "Reference endpoint", value: newColumnRefSpace, darkMode: props.darkMode, portalDropdown: true, options: (_d = props.advSettings.renderReferenceSpaceOptions()) !== null && _d !== void 0 ? _d : [], onChange: function (value) {
|
|
@@ -865,7 +920,13 @@ var NewTable = function (props) {
|
|
|
865
920
|
setNewColumnRefLabel("");
|
|
866
921
|
} }),
|
|
867
922
|
react_2.default.createElement(select_1.Select, { id: "newColumnRefLabel", label: "Reference label", value: newColumnRefLabel, darkMode: props.darkMode, portalDropdown: true, disabled: !newColumnRefSpace, options: (_g = (_f = (_e = props.advSettings).renderReferenceLabelOptions) === null || _f === void 0 ? void 0 : _f.call(_e, newColumnRefSpace)) !== null && _g !== void 0 ? _g : [], onChange: function (value) { return setNewColumnRefLabel(value); } }))),
|
|
868
|
-
LIST_TYPES.includes(newColumnType) && (react_2.default.createElement(textInput_1.TextInput, { id: "newColumnOptions", type: "text", label: "Options", placeholder: "Draft, Submitted, Approved", value: newColumnOptions, darkMode: props.darkMode,
|
|
923
|
+
LIST_TYPES.includes(newColumnType) && (react_2.default.createElement(textInput_1.TextInput, { id: "newColumnOptions", type: "text", label: "Options", placeholder: "Draft, Submitted, Approved", value: newColumnOptions, darkMode: props.darkMode,
|
|
924
|
+
// INFO: options are edited as one comma-separated line, which cannot
|
|
925
|
+
// hold an option that itself has a comma — those stay as stored
|
|
926
|
+
disabled: !!editingColumn &&
|
|
927
|
+
((_h = editingColumn.listSelection) !== null && _h !== void 0 ? _h : []).some(function (eachOption) {
|
|
928
|
+
return eachOption.includes(",");
|
|
929
|
+
}), onChange: function (event) { var _a, _b; return setNewColumnOptions((_b = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : ""); } })),
|
|
869
930
|
ASSET_TYPES.includes(newColumnType) && (react_2.default.createElement("p", { className: "-mt-2 text-xs text-gray-500" }, "Uploads are stored against this space automatically.")),
|
|
870
931
|
react_2.default.createElement(checkbox_1.Checkbox, { id: "newColumnRequired",
|
|
871
932
|
// INFO: the checkbox itself is not a required field — without this it
|
|
@@ -873,14 +934,39 @@ var NewTable = function (props) {
|
|
|
873
934
|
optional: true, darkMode: props.darkMode, itemList: [{ key: "required", label: "Required" }], selectItemList: newColumnRequired ? ["required"] : [], onChange: function (items) {
|
|
874
935
|
return setNewColumnRequired(items.includes("required"));
|
|
875
936
|
} }),
|
|
876
|
-
newColumnRequired && (react_2.default.createElement("p", { className: "-mt-3 text-xs text-gray-500" }, "Rows already in this table have no value for it yet.")),
|
|
937
|
+
newColumnRequired && !editingColumn && (react_2.default.createElement("p", { className: "-mt-3 text-xs text-gray-500" }, "Rows already in this table have no value for it yet.")),
|
|
877
938
|
react_2.default.createElement("div", { className: "flex flex-row justify-end gap-x-2" },
|
|
878
939
|
react_2.default.createElement(button_1.Button, { type: "light", text: "Cancel", onClick: function () { return handleAddColumnModal(""); } }),
|
|
879
|
-
react_2.default.createElement(button_1.Button, { type: "normal", text:
|
|
940
|
+
react_2.default.createElement(button_1.Button, { type: "normal", text: editingColumn
|
|
941
|
+
? addingColumn
|
|
942
|
+
? "Saving..."
|
|
943
|
+
: "Save column"
|
|
944
|
+
: addingColumn
|
|
945
|
+
? "Adding..."
|
|
946
|
+
: "Add column", disable: !newColumnName.trim() ||
|
|
947
|
+
!derivedId ||
|
|
948
|
+
taken ||
|
|
949
|
+
addingColumn ||
|
|
950
|
+
!handleIsNewColumnReady(), onClick: handleSubmitNewColumn }))));
|
|
951
|
+
};
|
|
952
|
+
var handleEditColumnModal = function (columnId) {
|
|
953
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
954
|
+
var schema = (_b = (_a = props.advSettings) === null || _a === void 0 ? void 0 : _a.getColumnSchema) === null || _b === void 0 ? void 0 : _b.call(_a, columnId);
|
|
955
|
+
if (!schema)
|
|
956
|
+
return;
|
|
957
|
+
setEditingColumn(schema);
|
|
958
|
+
setNewColumnName((_c = schema.name) !== null && _c !== void 0 ? _c : "");
|
|
959
|
+
setNewColumnType((_d = schema.type) !== null && _d !== void 0 ? _d : "string");
|
|
960
|
+
setNewColumnRefSpace((_e = schema.referenceSpaceId) !== null && _e !== void 0 ? _e : "");
|
|
961
|
+
setNewColumnRefLabel((_f = schema.referenceLabel) !== null && _f !== void 0 ? _f : "");
|
|
962
|
+
setNewColumnOptions(handleJoinOptions((_g = schema.listSelection) !== null && _g !== void 0 ? _g : []));
|
|
963
|
+
setNewColumnRequired(!schema.optional);
|
|
964
|
+
setAddColumnModal(columnId);
|
|
880
965
|
};
|
|
881
966
|
var handleAddColumnModal = function (id) {
|
|
882
967
|
setAddColumnModal(id);
|
|
883
968
|
if (!id) {
|
|
969
|
+
setEditingColumn(null);
|
|
884
970
|
setNewColumnName("");
|
|
885
971
|
setNewColumnType("string");
|
|
886
972
|
setNewColumnRefSpace("");
|
|
@@ -919,13 +1005,19 @@ var NewTable = function (props) {
|
|
|
919
1005
|
return __generator(this, function (_c) {
|
|
920
1006
|
switch (_c.label) {
|
|
921
1007
|
case 0:
|
|
1008
|
+
if (!editingColumn) return [3 /*break*/, 2];
|
|
1009
|
+
return [4 /*yield*/, handleSubmitEditedColumn(editingColumn)];
|
|
1010
|
+
case 1:
|
|
1011
|
+
_c.sent();
|
|
1012
|
+
return [2 /*return*/];
|
|
1013
|
+
case 2:
|
|
922
1014
|
id = handleDeriveColumnId(newColumnName);
|
|
923
1015
|
if (!id || handleColumnIdTaken(id) || !handleIsNewColumnReady())
|
|
924
1016
|
return [2 /*return*/];
|
|
925
1017
|
setAddingColumn(true);
|
|
926
|
-
_c.label =
|
|
927
|
-
case
|
|
928
|
-
_c.trys.push([
|
|
1018
|
+
_c.label = 3;
|
|
1019
|
+
case 3:
|
|
1020
|
+
_c.trys.push([3, , 5, 6]);
|
|
929
1021
|
column = {
|
|
930
1022
|
id: id,
|
|
931
1023
|
name: newColumnName.trim(),
|
|
@@ -945,9 +1037,76 @@ var NewTable = function (props) {
|
|
|
945
1037
|
.map(function (eachOption) { return eachOption.trim(); })
|
|
946
1038
|
.filter(Boolean);
|
|
947
1039
|
return [4 /*yield*/, ((_b = (_a = props.advSettings) === null || _a === void 0 ? void 0 : _a.onAddColumn) === null || _b === void 0 ? void 0 : _b.call(_a, column))];
|
|
948
|
-
case
|
|
1040
|
+
case 4:
|
|
949
1041
|
_c.sent();
|
|
950
1042
|
handleAddColumnModal("");
|
|
1043
|
+
return [3 /*break*/, 6];
|
|
1044
|
+
case 5:
|
|
1045
|
+
setAddingColumn(false);
|
|
1046
|
+
return [7 /*endfinally*/];
|
|
1047
|
+
case 6: return [2 /*return*/];
|
|
1048
|
+
}
|
|
1049
|
+
});
|
|
1050
|
+
}); };
|
|
1051
|
+
// INFO: the column keeps everything the panel does not show; settings that
|
|
1052
|
+
// belong to a type it no longer has are dropped with it
|
|
1053
|
+
var handleSubmitEditedColumn = function (original) { return __awaiter(void 0, void 0, void 0, function () {
|
|
1054
|
+
var source_1, column_1, previous_1, next_1;
|
|
1055
|
+
var _a, _b, _c, _d;
|
|
1056
|
+
return __generator(this, function (_e) {
|
|
1057
|
+
switch (_e.label) {
|
|
1058
|
+
case 0:
|
|
1059
|
+
if (!newColumnName.trim() || !handleIsNewColumnReady())
|
|
1060
|
+
return [2 /*return*/];
|
|
1061
|
+
setAddingColumn(true);
|
|
1062
|
+
_e.label = 1;
|
|
1063
|
+
case 1:
|
|
1064
|
+
_e.trys.push([1, , 3, 4]);
|
|
1065
|
+
source_1 = original;
|
|
1066
|
+
column_1 = __assign(__assign({}, original), { name: newColumnName.trim(), type: newColumnType, optional: !newColumnRequired });
|
|
1067
|
+
if (newColumnType !== original.type)
|
|
1068
|
+
((_a = TYPE_ONLY_KEYS[original.type]) !== null && _a !== void 0 ? _a : []).forEach(function (eachKey) { return delete column_1[eachKey]; });
|
|
1069
|
+
if (REFERENCE_TYPES.includes(newColumnType)) {
|
|
1070
|
+
if (newColumnRefSpace !== source_1.referenceSpaceId)
|
|
1071
|
+
REFERENCE_TARGET_KEYS.forEach(function (eachKey) { return delete column_1[eachKey]; });
|
|
1072
|
+
column_1.referenceSpaceId = newColumnRefSpace;
|
|
1073
|
+
column_1.referenceLabel = newColumnRefLabel;
|
|
1074
|
+
}
|
|
1075
|
+
else {
|
|
1076
|
+
delete column_1.referenceSpaceId;
|
|
1077
|
+
delete column_1.referenceLabel;
|
|
1078
|
+
REFERENCE_TARGET_KEYS.forEach(function (eachKey) { return delete column_1[eachKey]; });
|
|
1079
|
+
}
|
|
1080
|
+
if (LIST_TYPES.includes(newColumnType)) {
|
|
1081
|
+
previous_1 = (_b = original.listSelection) !== null && _b !== void 0 ? _b : [];
|
|
1082
|
+
// INFO: unchanged text keeps the stored options exactly — an option
|
|
1083
|
+
// holding a comma would otherwise come back split in two
|
|
1084
|
+
if (newColumnOptions !== handleJoinOptions(previous_1)) {
|
|
1085
|
+
next_1 = handleSplitOptions(newColumnOptions);
|
|
1086
|
+
column_1.listSelection = next_1;
|
|
1087
|
+
// INFO: colours and labels line up with the options by position, so
|
|
1088
|
+
// each follows its own option rather than the slot it sat in
|
|
1089
|
+
["listSelectionColour", "listSelectionLabel"].forEach(function (eachKey) {
|
|
1090
|
+
var values = source_1[eachKey];
|
|
1091
|
+
if (!values)
|
|
1092
|
+
return;
|
|
1093
|
+
var rebuilt = next_1.map(function (eachOption) { var _a; return (_a = values[previous_1.indexOf(eachOption)]) !== null && _a !== void 0 ? _a : ""; });
|
|
1094
|
+
if (rebuilt.some(Boolean))
|
|
1095
|
+
column_1[eachKey] = rebuilt;
|
|
1096
|
+
else
|
|
1097
|
+
delete column_1[eachKey];
|
|
1098
|
+
});
|
|
1099
|
+
}
|
|
1100
|
+
}
|
|
1101
|
+
else {
|
|
1102
|
+
delete column_1.listSelection;
|
|
1103
|
+
delete column_1.listSelectionColour;
|
|
1104
|
+
delete column_1.listSelectionLabel;
|
|
1105
|
+
}
|
|
1106
|
+
return [4 /*yield*/, ((_d = (_c = props.advSettings) === null || _c === void 0 ? void 0 : _c.onEditColumn) === null || _d === void 0 ? void 0 : _d.call(_c, column_1))];
|
|
1107
|
+
case 2:
|
|
1108
|
+
_e.sent();
|
|
1109
|
+
handleAddColumnModal("");
|
|
951
1110
|
return [3 /*break*/, 4];
|
|
952
1111
|
case 3:
|
|
953
1112
|
setAddingColumn(false);
|
|
@@ -1612,7 +1771,8 @@ var NewTable = function (props) {
|
|
|
1612
1771
|
} })))));
|
|
1613
1772
|
}
|
|
1614
1773
|
if (isObjectEdit) {
|
|
1615
|
-
return (react_2.default.createElement("td", { key: col.key, "data-cell-key": col.key, "data-pin-key": leftPinned.includes(col.key) ||
|
|
1774
|
+
return (react_2.default.createElement("td", { key: col.key, "data-cell-key": col.key, "data-pin-key": leftPinned.includes(col.key) ||
|
|
1775
|
+
rightPinned.includes(col.key)
|
|
1616
1776
|
? col.key
|
|
1617
1777
|
: undefined,
|
|
1618
1778
|
// INFO: share the column width source with the read-only/edit cell
|
|
@@ -1628,7 +1788,8 @@ var NewTable = function (props) {
|
|
|
1628
1788
|
react_2.default.createElement(outline_1.PencilIcon, { className: "w-3.5 h-3.5 text-gray-400 opacity-0 group-hover/modaledit:opacity-100 flex-shrink-0" }))));
|
|
1629
1789
|
}
|
|
1630
1790
|
if (isModalEdit) {
|
|
1631
|
-
return (react_2.default.createElement("td", { key: col.key, "data-cell-key": col.key, "data-pin-key": leftPinned.includes(col.key) ||
|
|
1791
|
+
return (react_2.default.createElement("td", { key: col.key, "data-cell-key": col.key, "data-pin-key": leftPinned.includes(col.key) ||
|
|
1792
|
+
rightPinned.includes(col.key)
|
|
1632
1793
|
? col.key
|
|
1633
1794
|
: undefined,
|
|
1634
1795
|
// INFO: share the column width source with the read-only/edit cell
|
|
@@ -1793,6 +1954,17 @@ var NewTable = function (props) {
|
|
|
1793
1954
|
event.stopPropagation();
|
|
1794
1955
|
(_a = advSettings === null || advSettings === void 0 ? void 0 : advSettings.onDeleteColumn) === null || _a === void 0 ? void 0 : _a.call(advSettings, col.key);
|
|
1795
1956
|
} })) : null;
|
|
1957
|
+
// INFO: only where the built-in panel can show the column — a type it
|
|
1958
|
+
// offers (a math column opens its formula from its own pencil, an object
|
|
1959
|
+
// column needs the nested schema) — and its definition is read on click
|
|
1960
|
+
var editIcon = (advSettings === null || advSettings === void 0 ? void 0 : advSettings.onEditColumn) &&
|
|
1961
|
+
(advSettings === null || advSettings === void 0 ? void 0 : advSettings.getColumnSchema) &&
|
|
1962
|
+
(advSettings === null || advSettings === void 0 ? void 0 : advSettings.onAddColumn) &&
|
|
1963
|
+
!(advSettings === null || advSettings === void 0 ? void 0 : advSettings.renderAddColumnElements) &&
|
|
1964
|
+
ADD_COLUMN_TYPES.some(function (eachType) { return eachType.key === col.type; }) ? (react_2.default.createElement(outline_1.PencilSquareIcon, { "data-testid": "table-column-edit-".concat(col.key), className: "".concat(sortClassname, " ").concat(revealClassname), onClick: function (event) {
|
|
1965
|
+
event.stopPropagation();
|
|
1966
|
+
handleEditColumnModal(col.key);
|
|
1967
|
+
} })) : null;
|
|
1796
1968
|
var sortColumnEnabled = (_a = advSettings === null || advSettings === void 0 ? void 0 : advSettings.sortOptions) === null || _a === void 0 ? void 0 : _a.some(function (eachOption) { return eachOption.key === col.key; });
|
|
1797
1969
|
var filterColumnEnabled = utils_1.supportedAQList.includes((_b = col.type) !== null && _b !== void 0 ? _b : "");
|
|
1798
1970
|
if (sortColumnEnabled && (advSettings === null || advSettings === void 0 ? void 0 : advSettings.sortEnabled)) {
|
|
@@ -1815,6 +1987,7 @@ var NewTable = function (props) {
|
|
|
1815
1987
|
sortIcon,
|
|
1816
1988
|
filterIcon,
|
|
1817
1989
|
hideIcon,
|
|
1990
|
+
editIcon,
|
|
1818
1991
|
deleteIcon,
|
|
1819
1992
|
col.type === "math" && (react_2.default.createElement(outline_1.PencilIcon, { className: sortClassname, onClick: function () { return handleAddColumnModal(col.key); } }))));
|
|
1820
1993
|
};
|
|
@@ -2116,7 +2289,7 @@ var NewTable = function (props) {
|
|
|
2116
2289
|
react_2.default.createElement(button_1.Button, { text: "Cancel", type: "light", onClick: handleModalEditClose }),
|
|
2117
2290
|
react_2.default.createElement(button_1.Button, { text: editDataIsLoading ? "Saving" : "Save", type: "normal", disable: editDataIsLoading, onClick: handleModalEditSave }))));
|
|
2118
2291
|
} }),
|
|
2119
|
-
react_2.default.createElement(modal_1.Modal, { open: addColumnModal ? true : false, title: "Add Column", renderContent: renderAddColumnPanel, onClose: function () { return handleAddColumnModal(""); } }),
|
|
2292
|
+
react_2.default.createElement(modal_1.Modal, { open: addColumnModal ? true : false, title: editingColumn ? "Edit Column" : "Add Column", renderContent: renderAddColumnPanel, onClose: function () { return handleAddColumnModal(""); } }),
|
|
2120
2293
|
react_2.default.createElement(scrollShadow_1.ScrollShadow, { className: "w-full overflow-x-auto ".concat(isFlat
|
|
2121
2294
|
? ""
|
|
2122
2295
|
: "".concat(borderRadius, " border ").concat(borderColor, " ").concat(bgColor, " shadow-sm")), darkMode: props.darkMode },
|