@ni/nimble-components 33.2.0 → 33.3.0

package/dist/all-components-bundle.js

@@ -26381,7 +26381,10 @@ so this becomes the fallback color for the slot */ ''}
 
     :host([disabled]) {
         color: ${bodyDisabledFontColor};
-        cursor: default;
+    }
+
+    :host([disabled][appearance-readonly]) {
+        color: ${bodyFontColor};
     }
 
     .label {
@@ -26394,6 +26397,10 @@ so this becomes the fallback color for the slot */ ''}
         color: ${controlLabelDisabledFontColor};
     }
 
+    :host([disabled][appearance-readonly]) .label {
+        color: ${controlLabelFontColor};
+    }
+
     .root {
         position: relative;
         display: flex;
@@ -26479,14 +26486,22 @@ so this becomes the fallback color for the slot */ ''}
         outline: none;
     }
 
+    :host([disabled][appearance-readonly]) .control {
+        cursor: text;
+    }
+
     .control::placeholder {
         color: ${controlLabelFontColor};
     }
 
-    .control[disabled]::placeholder {
+    :host([disabled]) .control::placeholder {
         color: ${bodyDisabledFontColor};
     }
 
+    :host([disabled][appearance-readonly]) .control::placeholder {
+        color: ${controlLabelFontColor};
+    }
+
     .controls {
         display: contents;
     }
@@ -26648,6 +26663,7 @@ so this becomes the fallback color for the slot */ ''}
       constructor() {
           super(...arguments);
           this.appearance = NumberFieldAppearance.underline;
+          this.appearanceReadOnly = false;
       }
       connectedCallback() {
           super.connectedCallback();
@@ -26658,6 +26674,9 @@ so this becomes the fallback color for the slot */ ''}
   __decorate([
       attr
   ], NumberField.prototype, "appearance", void 0);
+  __decorate([
+      attr({ attribute: 'appearance-readonly', mode: 'boolean' })
+  ], NumberField.prototype, "appearanceReadOnly", void 0);
   /**
    * A function that returns a number-field registration for configuring the component with a DesignSystem.
    *
@@ -75017,6 +75036,10 @@ focus outline in that case.
         text-overflow: clip;
     }
 
+    :host([disabled][appearance-readonly]) .control {
+        cursor: text;
+    }
+
     .control::placeholder {
         color: ${controlLabelFontColor};
     }