@ctrliq/quantic-components 1.61.1 → 1.61.3

package/dist/code-input/index.d.ts

@@ -29,12 +29,14 @@ export declare class CodeInput extends CodeInput_base {
     invalid: boolean;
     lineNumbers: boolean;
     stretch: boolean;
+    tabIndent: boolean;
     private lineNumbersEl?;
     private lineCount;
     constructor();
     updated(changedProperties: Map<string, unknown>): void;
     static styles: import("lit").CSSResult;
     private handleInput;
+    private handleKeydown;
     private forwardNative;
     private handleScroll;
     formResetCallback(): void;

package/dist/code-input/index.js

@@ -26,7 +26,15 @@ let CodeInput = class CodeInput extends A11yAttributesMixin(QuanticElement) {
         this.invalid = false;
         this.lineNumbers = false;
         this.stretch = false;
+        this.tabIndent = false;
         this.lineCount = 1;
+        this.handleKeydown = (e) => {
+            if (this.tabIndent && e.key === 'Tab' && !this.disabled && !this.readOnly) {
+                e.preventDefault();
+                document.execCommand('insertText', false, '\t');
+            }
+            this.forwardNative(e);
+        };
         this.internals = this.attachInternals();
     }
     updated(changedProperties) {
@@ -140,7 +148,7 @@ let CodeInput = class CodeInput extends A11yAttributesMixin(QuanticElement) {
           @change=${this.forwardNative}
           @focus=${this.forwardNative}
           @blur=${this.forwardNative}
-          @keydown=${this.forwardNative}
+          @keydown=${this.handleKeydown}
           @keyup=${this.forwardNative}
           @keypress=${this.forwardNative}
           @scroll=${this.handleScroll}
@@ -391,6 +399,9 @@ __decorate([
 __decorate([
     prop({ type: 'boolean', default: 'false', reflect: true, description: 'Makes the editor fill the height of its container. Overrides rows.' })
 ], CodeInput.prototype, "stretch", void 0);
+__decorate([
+    prop({ type: 'boolean', default: 'false', reflect: true, description: 'Inserts a tab character when pressing Tab instead of moving focus. Disabled by default to preserve keyboard navigation.', attribute: 'tab-indent' })
+], CodeInput.prototype, "tabIndent", void 0);
 __decorate([
     query('.line-numbers')
 ], CodeInput.prototype, "lineNumbersEl", void 0);

package/dist/dialog/dialog-backdrop.js

@@ -47,16 +47,14 @@ DialogBackdropElement.styles = css `
     }
 
     .backdrop--subtle {
-      background-color: rgba(
-        var(--quantic-component-dialog-backdrop-color),
-        0.5
+      background-color: rgb(
+        var(--quantic-component-dialog-backdrop-color) / 0.7
       );
     }
 
     .backdrop--opaque {
-      background-color: rgba(
-        var(--quantic-component-dialog-backdrop-color),
-        0.95
+      background-color: rgb(
+        var(--quantic-component-dialog-backdrop-color) / 0.8
       );
       backdrop-filter: blur(4px);
     }
@@ -67,10 +65,20 @@ DialogBackdropElement.styles = css `
     }
   `;
 __decorate([
-    prop({ type: 'boolean', default: 'false', reflect: true, description: 'Whether the backdrop is visible.' })
+    prop({
+        type: 'boolean',
+        default: 'false',
+        reflect: true,
+        description: 'Whether the backdrop is visible.',
+    })
 ], DialogBackdropElement.prototype, "visible", void 0);
 __decorate([
-    prop({ type: 'DialogBackdrop', options: Object.values(DialogBackdrop), default: DialogBackdrop.Opaque, description: 'Visual style of the backdrop overlay.' })
+    prop({
+        type: 'DialogBackdrop',
+        options: Object.values(DialogBackdrop),
+        default: DialogBackdrop.Opaque,
+        description: 'Visual style of the backdrop overlay.',
+    })
 ], DialogBackdropElement.prototype, "variant", void 0);
 DialogBackdropElement = __decorate([
     quanticElement('quantic-dialog-backdrop')