Merged in fix/SW-2188-disabled-state (pull request #2597)

fix(SW-2188): readonly for input fields

* fix(SW-2188): readonly for input fields


Approved-by: Anton Gunnarsson

packages/design-system/lib/components/Input/input.module.css

@@ -13,12 +13,14 @@
   box-sizing: border-box;
   cursor: text;
 
-  &:has(.input:focus) {
+  .container:has(.input:focus):not(:has(.input:disabled)),
+  .container:has(.input:focus):not(:has(.input:read-only)) {
     outline-offset: -2px;
     outline: 2px solid var(--Border-Interactive-Focus);
   }
 
-  &:has(.input:disabled) {
+  &:has(.input:disabled),
+  &:has(.input:read-only) {
     background-color: var(--Surface-Primary-Disabled);
     border: transparent;
     cursor: unset;
@@ -50,8 +52,10 @@
     outline: none;
   }
 
-  &:disabled {
+  &:disabled,
+  &:read-only {
     color: var(--Text-Interactive-Disabled);
+    cursor: unset;
   }
 }
 

packages/design-system/lib/components/Label/label.module.css

@@ -62,6 +62,7 @@ textarea[value]:not([value='']) ~ .label,
 }
 
 .label.disabled,
+input:read-only ~ .label,
 input:disabled ~ .label,
 textarea:disabled ~ .label {
   color: var(--Text-Interactive-Disabled);