@design.estate/dees-catalog 3.64.0 → 3.65.0

package/dist_ts_web/elements/00group-dataview/dees-table/styles.js

@@ -371,32 +371,29 @@ export const tableStyles = [
         min-height: 24px;
         line-height: 24px;
       }
-      td input {
-        position: absolute;
-        top: 4px;
-        bottom: 4px;
-        left: 20px;
-        right: 20px;
-        width: calc(100% - 40px);
-        height: calc(100% - 8px);
-        padding: 0 12px;
-        outline: none;
-        border: 1px solid var(--dees-color-border-default);
-        border-radius: 6px;
-        background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 9%)')};
-        color: var(--dees-color-text-primary);
-        font-family: inherit;
-        font-size: inherit;
-        font-weight: inherit;
-        transition: all 0.15s ease;
-        box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+
+      /* Editable cell affordances */
+      td.editable {
+        cursor: text;
       }
-      
-      td input:focus {
-        border-color: ${cssManager.bdTheme('hsl(222.2 47.4% 51.2%)', 'hsl(217.2 91.2% 59.8%)')};
-        outline: 2px solid transparent;
-        outline-offset: 2px;
-        box-shadow: 0 0 0 2px ${cssManager.bdTheme('hsl(222.2 47.4% 51.2% / 0.2)', 'hsl(217.2 91.2% 59.8% / 0.2)')};
+      td.focused {
+        outline: 2px solid ${cssManager.bdTheme('hsl(222.2 47.4% 51.2% / 0.6)', 'hsl(217.2 91.2% 59.8% / 0.6)')};
+        outline-offset: -2px;
+      }
+      td.editingCell {
+        padding: 0;
+      }
+      td.editingCell .innerCellContainer {
+        padding: 0;
+        line-height: normal;
+      }
+      td.editingCell dees-input-text,
+      td.editingCell dees-input-checkbox,
+      td.editingCell dees-input-dropdown,
+      td.editingCell dees-input-datepicker,
+      td.editingCell dees-input-tags {
+        display: block;
+        width: 100%;
       }
 
       /* filter row */
@@ -491,4 +488,4 @@ export const tableStyles = [
       }
   `,
 ];
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vdHNfd2ViL2VsZW1lbnRzLzAwZ3JvdXAtZGF0YXZpZXcvZGVlcy10YWJsZS9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxHQUFHLEVBQWtCLE1BQU0sNkJBQTZCLENBQUM7QUFDOUUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDdEQsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFdEQsTUFBTSxDQUFDLE1BQU0sV0FBVyxHQUFnQjtJQUN0QyxrQkFBa0I7SUFDbEIsVUFBVSxDQUFDLGFBQWE7SUFDeEIsR0FBRyxDQUFBOzs7Ozs7Ozs7dUJBU2tCLGtCQUFrQjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O2lCQWlDeEIsVUFBVSxDQUFDLE9BQU8sQ0FBQyx3QkFBd0IsRUFBRSxzQkFBc0IsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztpQkE0SHBFLFVBQVUsQ0FBQyxPQUFPLENBQUMsd0JBQXdCLEVBQUUsc0JBQXNCLENBQUM7Ozs7c0JBSS9ELFVBQVUsQ0FBQyxPQUFPLENBQUMsb0JBQW9CLEVBQUUsY0FBYyxDQUFDOzs7Ozs7c0JBTXhELFVBQVUsQ0FBQyxPQUFPLENBQUMsb0JBQW9CLEVBQUUsY0FBYyxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7c0JBMEN4RCxVQUFVLENBQUMsT0FBTyxDQUFDLCtCQUErQixFQUFFLCtCQUErQixDQUFDOzs7Ozs7Ozs7Ozs7Ozs7c0JBZXBGLFVBQVUsQ0FBQyxPQUFPLENBQUMsK0JBQStCLEVBQUUsK0JBQStCLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztzQkFtRHBGLFVBQVUsQ0FBQyxPQUFPLENBQUMsOEJBQThCLEVBQUUsK0JBQStCLENBQUM7Ozs7c0JBSW5GLFVBQVUsQ0FBQyxPQUFPLENBQUMsOEJBQThCLEVBQUUsOEJBQThCLENBQUM7Ozs7Ozs7OztpQkFTdkYsVUFBVSxDQUFDLE9BQU8sQ0FBQyx3QkFBd0IsRUFBRSxzQkFBc0IsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O2lCQXdCcEUsVUFBVSxDQUFDLE9BQU8sQ0FBQyxzQkFBc0IsRUFBRSxzQkFBc0IsQ0FBQztzQkFDN0QsVUFBVSxDQUFDLE9BQU8sQ0FBQywrQkFBK0IsRUFBRSwrQkFBK0IsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O3NCQXlEcEYsVUFBVSxDQUFDLE9BQU8sQ0FBQyxnQkFBZ0IsRUFBRSxjQUFjLENBQUM7Ozs7Ozs7Ozs7d0JBVWxELFVBQVUsQ0FBQyxPQUFPLENBQUMsd0JBQXdCLEVBQUUsd0JBQXdCLENBQUM7OztnQ0FHOUQsVUFBVSxDQUFDLE9BQU8sQ0FBQyw4QkFBOEIsRUFBRSw4QkFBOEIsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7c0JBYzVGLFVBQVUsQ0FBQyxPQUFPLENBQUMsZ0JBQWdCLEVBQUUsY0FBYyxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7O2lCQWdCekQsVUFBVSxDQUFDLE9BQU8sQ0FBQyx3QkFBd0IsRUFBRSxzQkFBc0IsQ0FBQzs7Ozs7O3NCQU0vRCxVQUFVLENBQUMsT0FBTyxDQUFDLG9CQUFvQixFQUFFLGlCQUFpQixDQUFDO2lCQUNoRSxVQUFVLENBQUMsT0FBTyxDQUFDLGNBQWMsRUFBRSxlQUFlLENBQUM7Ozs7c0JBSTlDLFVBQVUsQ0FBQyxPQUFPLENBQUMsb0JBQW9CLEVBQUUsaUJBQWlCLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztpQkFvQ2hFLFVBQVUsQ0FBQyxPQUFPLENBQUMsd0JBQXdCLEVBQUUsc0JBQXNCLENBQUM7Ozs7Ozs7O3NCQVEvRCxVQUFVLENBQUMsT0FBTyxDQUFDLGlCQUFpQixFQUFFLGlCQUFpQixDQUFDO2lCQUM3RCxVQUFVLENBQUMsT0FBTyxDQUFDLGNBQWMsRUFBRSxlQUFlLENBQUM7Ozs7Ozs7R0FPakU7Q0FDRixDQUFDIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vdHNfd2ViL2VsZW1lbnRzLzAwZ3JvdXAtZGF0YXZpZXcvZGVlcy10YWJsZS9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxHQUFHLEVBQWtCLE1BQU0sNkJBQTZCLENBQUM7QUFDOUUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDdEQsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFdEQsTUFBTSxDQUFDLE1BQU0sV0FBVyxHQUFnQjtJQUN0QyxrQkFBa0I7SUFDbEIsVUFBVSxDQUFDLGFBQWE7SUFDeEIsR0FBRyxDQUFBOzs7Ozs7Ozs7dUJBU2tCLGtCQUFrQjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O2lCQWlDeEIsVUFBVSxDQUFDLE9BQU8sQ0FBQyx3QkFBd0IsRUFBRSxzQkFBc0IsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztpQkE0SHBFLFVBQVUsQ0FBQyxPQUFPLENBQUMsd0JBQXdCLEVBQUUsc0JBQXNCLENBQUM7Ozs7c0JBSS9ELFVBQVUsQ0FBQyxPQUFPLENBQUMsb0JBQW9CLEVBQUUsY0FBYyxDQUFDOzs7Ozs7c0JBTXhELFVBQVUsQ0FBQyxPQUFPLENBQUMsb0JBQW9CLEVBQUUsY0FBYyxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7c0JBMEN4RCxVQUFVLENBQUMsT0FBTyxDQUFDLCtCQUErQixFQUFFLCtCQUErQixDQUFDOzs7Ozs7Ozs7Ozs7Ozs7c0JBZXBGLFVBQVUsQ0FBQyxPQUFPLENBQUMsK0JBQStCLEVBQUUsK0JBQStCLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztzQkFtRHBGLFVBQVUsQ0FBQyxPQUFPLENBQUMsOEJBQThCLEVBQUUsK0JBQStCLENBQUM7Ozs7c0JBSW5GLFVBQVUsQ0FBQyxPQUFPLENBQUMsOEJBQThCLEVBQUUsOEJBQThCLENBQUM7Ozs7Ozs7OztpQkFTdkYsVUFBVSxDQUFDLE9BQU8sQ0FBQyx3QkFBd0IsRUFBRSxzQkFBc0IsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O2lCQXdCcEUsVUFBVSxDQUFDLE9BQU8sQ0FBQyxzQkFBc0IsRUFBRSxzQkFBc0IsQ0FBQztzQkFDN0QsVUFBVSxDQUFDLE9BQU8sQ0FBQywrQkFBK0IsRUFBRSwrQkFBK0IsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OzZCQW1EN0UsVUFBVSxDQUFDLE9BQU8sQ0FDckMsOEJBQThCLEVBQzlCLDhCQUE4QixDQUMvQjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O3NCQThCYSxVQUFVLENBQUMsT0FBTyxDQUFDLGdCQUFnQixFQUFFLGNBQWMsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7OztpQkFnQnpELFVBQVUsQ0FBQyxPQUFPLENBQUMsd0JBQXdCLEVBQUUsc0JBQXNCLENBQUM7Ozs7OztzQkFNL0QsVUFBVSxDQUFDLE9BQU8sQ0FBQyxvQkFBb0IsRUFBRSxpQkFBaUIsQ0FBQztpQkFDaEUsVUFBVSxDQUFDLE9BQU8sQ0FBQyxjQUFjLEVBQUUsZUFBZSxDQUFDOzs7O3NCQUk5QyxVQUFVLENBQUMsT0FBTyxDQUFDLG9CQUFvQixFQUFFLGlCQUFpQixDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7aUJBb0NoRSxVQUFVLENBQUMsT0FBTyxDQUFDLHdCQUF3QixFQUFFLHNCQUFzQixDQUFDOzs7Ozs7OztzQkFRL0QsVUFBVSxDQUFDLE9BQU8sQ0FBQyxpQkFBaUIsRUFBRSxpQkFBaUIsQ0FBQztpQkFDN0QsVUFBVSxDQUFDLE9BQU8sQ0FBQyxjQUFjLEVBQUUsZUFBZSxDQUFDOzs7Ozs7O0dBT2pFO0NBQ0YsQ0FBQyJ9

package/dist_ts_web/elements/00group-dataview/dees-table/types.d.ts

@@ -12,6 +12,25 @@ export interface ITableAction<T = any> {
     actionRelevancyCheckFunc?: (itemArg: T) => boolean;
     actionFunc: (actionDataArg: ITableActionDataArg<T>) => Promise<any>;
 }
+/**
+ * Available cell editor types. Each maps to a dees-input-* component.
+ * Use `editor` on `Column<T>` to opt a column into in-cell editing.
+ */
+export type TCellEditorType = 'text' | 'number' | 'checkbox' | 'dropdown' | 'date' | 'tags';
+/** Detail payload for the `cellEdit` CustomEvent dispatched on commit. */
+export interface ICellEditDetail<T = any> {
+    row: T;
+    key: string;
+    oldValue: any;
+    newValue: any;
+}
+/** Detail payload for the `cellEditError` CustomEvent dispatched on validation failure. */
+export interface ICellEditErrorDetail<T = any> {
+    row: T;
+    key: string;
+    value: any;
+    message: string;
+}
 export interface Column<T = any> {
     key: keyof T | string;
     header?: string | TemplateResult;
@@ -25,6 +44,18 @@ export interface Column<T = any> {
     /** whether this column participates in per-column quick filtering (default: true) */
     filterable?: boolean;
     hidden?: boolean;
+    /** Marks the column as editable. Shorthand for `editor: 'text'` if no editor is specified. */
+    editable?: boolean;
+    /** Editor type — picks the dees-input-* component used for in-cell editing. */
+    editor?: TCellEditorType;
+    /** Editor-specific options forwarded to the editor (e.g. `{ options: [...] }` for dropdowns). */
+    editorOptions?: Record<string, any>;
+    /** Convert raw row value -> editor value. Defaults to identity. */
+    format?: (raw: any, row: T) => any;
+    /** Convert editor value -> raw row value. Defaults to identity. */
+    parse?: (editorValue: any, row: T) => any;
+    /** Validate the parsed value before commit. Return string for error, true/void for ok. */
+    validate?: (value: any, row: T) => true | string | void;
 }
 /**
  * One entry in a multi-column sort cascade. Order in the array reflects priority: