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

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

@@ -46,6 +46,12 @@ export class DeesInputDropdown extends DeesInputBase<DeesInputDropdown> {
   })
   accessor enableSearch: boolean = true;
 
+  @property({
+    type: Boolean,
+    reflect: true,
+  })
+  accessor vintegrated: boolean = false;
+
   @state()
   accessor isOpened = false;
 
@@ -126,6 +132,36 @@ export class DeesInputDropdown extends DeesInputBase<DeesInputDropdown> {
       .selectedBox.open::after {
         transform: translateY(-50%) rotate(180deg);
       }
+
+      /* Visually integrated mode: shed chrome to blend into a host component
+         (e.g. a dees-table cell in edit mode). */
+      :host([vintegrated]) dees-label {
+        display: none;
+      }
+      :host([vintegrated]) .maincontainer {
+        height: 40px;
+      }
+      :host([vintegrated]) .selectedBox {
+        height: 40px;
+        line-height: 40px;
+        padding: 0 32px 0 16px;
+        font-size: 13px;
+        border: none;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        transition: none;
+      }
+      :host([vintegrated]) .selectedBox:hover:not(.disabled),
+      :host([vintegrated]) .selectedBox:focus-visible {
+        border: none;
+        box-shadow: none;
+        background: transparent;
+      }
+      :host([vintegrated]) .selectedBox::after {
+        right: 12px;
+        opacity: 0.6;
+      }
     `,
   ];