feat(dees-table): improve inline cell editors with integrated input styling and auto-open dropdowns

ts_web/elements/00group-input/dees-input-text/dees-input-text.ts

@@ -57,6 +57,12 @@ export class DeesInputText extends DeesInputBase {
   @property({})
   accessor validationFunction!: (value: string) => boolean;
 
+  @property({
+    type: Boolean,
+    reflect: true,
+  })
+  accessor vintegrated: boolean = false;
+
   public static styles = [
     themeDefaultStyles,
     ...DeesInputBase.baseStyles,
@@ -194,6 +200,36 @@ export class DeesInputText extends DeesInputBase {
         border-color: ${cssManager.bdTheme('hsl(142.1 76.2% 36.3%)', 'hsl(142.1 70.6% 45.3%)')};
         box-shadow: 0 0 0 2px ${cssManager.bdTheme('hsl(142.1 76.2% 36.3% / 0.05)', 'hsl(142.1 70.6% 45.3% / 0.05)')};
       }
+
+      /* Visually integrated mode: shed chrome to blend into a host component
+         (e.g. a dees-table cell in edit mode). */
+      :host([vintegrated]) dees-label,
+      :host([vintegrated]) .validationContainer {
+        display: none;
+      }
+      :host([vintegrated]) .maincontainer {
+        height: 40px;
+      }
+      :host([vintegrated]) input {
+        height: 40px;
+        line-height: 24px;
+        padding: 0 16px;
+        font-size: 13px;
+        border: none;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        transition: none;
+      }
+      :host([vintegrated]) input:hover:not(:disabled):not(:focus),
+      :host([vintegrated]) input:focus {
+        border: none;
+        box-shadow: none;
+        background: transparent;
+      }
+      :host([vintegrated]) .showPassword {
+        display: none;
+      }
     `,
   ];