From 7545f2f387ed0bff9e3a19277399bb456d438157 Mon Sep 17 00:00:00 2001
From: paanSinghCoder <gaurav3017@gmail.com>
Date: Thu, 2 Apr 2026 14:45:53 +0530
Subject: [PATCH 1/2] refactor: standardize-disabled-state

---
 packages/raystack/components/calendar/calendar.module.css   | 6 +++---
 packages/raystack/components/combobox/combobox.module.css   | 2 +-
 .../raystack/components/input-field/input-field.module.css  | 2 +-
 packages/raystack/components/menu/cell.module.css           | 2 +-
 packages/raystack/components/select/select.module.css       | 6 +++---
 packages/raystack/components/sidebar/sidebar.module.css     | 2 +-
 packages/raystack/components/text-area/text-area.module.css | 2 +-
 7 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/raystack/components/calendar/calendar.module.css b/packages/raystack/components/calendar/calendar.module.css
index aa6d33a8e..94248ea20 100644
--- a/packages/raystack/components/calendar/calendar.module.css
+++ b/packages/raystack/components/calendar/calendar.module.css
@@ -7,7 +7,7 @@
 }
 
 .captionLabel,
-.dropdowns > span,
+.dropdowns>span,
 .dropdown_trigger {
   font-weight: var(--rs-font-weight-medium);
   font-size: var(--rs-font-size-mini);
@@ -197,7 +197,7 @@
 
 .disabled {
   color: var(--rs-color-foreground-base-tertiary);
-  opacity: 0.8;
+  opacity: 0.5;
 }
 
 .day.today button::after {
@@ -290,4 +290,4 @@
 
 .datePickerInput {
   text-align: left;
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/combobox/combobox.module.css b/packages/raystack/components/combobox/combobox.module.css
index 9d9dfaaa7..33db18373 100644
--- a/packages/raystack/components/combobox/combobox.module.css
+++ b/packages/raystack/components/combobox/combobox.module.css
@@ -50,7 +50,7 @@
   background: var(--rs-color-background-base-primary-hover);
 }
 .menuitem[data-disabled] {
-  opacity: 0.6;
+  opacity: 0.5;
   pointer-events: none;
 }
 
diff --git a/packages/raystack/components/input-field/input-field.module.css b/packages/raystack/components/input-field/input-field.module.css
index 52b5eac63..0a27d3c98 100644
--- a/packages/raystack/components/input-field/input-field.module.css
+++ b/packages/raystack/components/input-field/input-field.module.css
@@ -61,7 +61,7 @@
 .input-disabled-wrapper {
   background: var(--rs-color-background-base-primary);
   border-color: var(--rs-color-border-base-tertiary);
-  opacity: 0.4;
+  opacity: 0.5;
   cursor: not-allowed;
 }
 
diff --git a/packages/raystack/components/menu/cell.module.css b/packages/raystack/components/menu/cell.module.css
index 53f2f5390..47a53547e 100644
--- a/packages/raystack/components/menu/cell.module.css
+++ b/packages/raystack/components/menu/cell.module.css
@@ -23,7 +23,7 @@
 }
 
 .cell[aria-disabled] {
-  opacity: 0.6;
+  opacity: 0.5;
   pointer-events: none;
 }
 
diff --git a/packages/raystack/components/select/select.module.css b/packages/raystack/components/select/select.module.css
index 3c0f72367..91bd61433 100644
--- a/packages/raystack/components/select/select.module.css
+++ b/packages/raystack/components/select/select.module.css
@@ -42,7 +42,7 @@
 } */
 
 .menuitem[data-disabled] {
-  opacity: 0.6;
+  opacity: 0.5;
   pointer-events: none;
 }
 
@@ -136,7 +136,7 @@
 }
 
 .trigger:disabled {
-  opacity: 0.6;
+  opacity: 0.5;
   pointer-events: none;
 }
 
@@ -228,7 +228,7 @@
 .trigger[data-disabled] {
   background: var(--rs-color-background-base-primary);
   border-color: var(--rs-color-border-base-tertiary);
-  opacity: 0.4;
+  opacity: 0.5;
   cursor: not-allowed !important;
   pointer-events: none;
 }
diff --git a/packages/raystack/components/sidebar/sidebar.module.css b/packages/raystack/components/sidebar/sidebar.module.css
index 42e4ac51b..9af0c63c2 100644
--- a/packages/raystack/components/sidebar/sidebar.module.css
+++ b/packages/raystack/components/sidebar/sidebar.module.css
@@ -94,7 +94,7 @@
 }
 
 .nav-item[data-disabled="true"] {
-  opacity: 0.6;
+  opacity: 0.5;
   cursor: not-allowed;
   pointer-events: none;
 }
diff --git a/packages/raystack/components/text-area/text-area.module.css b/packages/raystack/components/text-area/text-area.module.css
index 3b892532a..f50e7ec14 100644
--- a/packages/raystack/components/text-area/text-area.module.css
+++ b/packages/raystack/components/text-area/text-area.module.css
@@ -89,7 +89,7 @@
   border-color: var(--rs-color-border-base-tertiary);
   color: var(--rs-color-foreground-base-tertiary);
   cursor: not-allowed;
-  opacity: 0.4;
+  opacity: 0.5;
 }
 
 .textarea:read-only {

From 8609e99fb792e9db54654a668833195f967dcd4e Mon Sep 17 00:00:00 2001
From: paanSinghCoder <gaurav3017@gmail.com>
Date: Thu, 2 Apr 2026 16:43:05 +0530
Subject: [PATCH 2/2] refactor: remove cursor:pointer and add disabled states

---
 .../breadcrumb/breadcrumb.module.css          |  4 +-
 .../components/button/button.module.css       | 12 ++----
 .../components/calendar/calendar.module.css   |  1 -
 .../components/checkbox/checkbox.module.css   |  3 +-
 .../icon-button/icon-button.module.css        |  3 +-
 .../input-field/input-field.module.css        |  6 +--
 .../components/radio/radio.module.css         |  3 +-
 .../components/search/search.module.css       |  1 -
 .../components/select/select.module.css       | 37 +++----------------
 .../components/sidebar/sidebar.module.css     |  4 +-
 .../components/switch/switch.module.css       |  3 +-
 .../raystack/components/tabs/tabs.module.css  |  4 +-
 .../components/text-area/text-area.module.css | 20 +++++-----
 .../components/toggle/toggle.module.css       |  1 -
 14 files changed, 28 insertions(+), 74 deletions(-)

diff --git a/packages/raystack/components/breadcrumb/breadcrumb.module.css b/packages/raystack/components/breadcrumb/breadcrumb.module.css
index 47b21edc1..ffd6e20ce 100644
--- a/packages/raystack/components/breadcrumb/breadcrumb.module.css
+++ b/packages/raystack/components/breadcrumb/breadcrumb.module.css
@@ -53,9 +53,7 @@
 }
 
 .breadcrumb-link-disabled {
-  color: var(--rs-color-foreground-base-tertiary);
   opacity: 0.5;
-  cursor: not-allowed;
   pointer-events: none;
 }
 
@@ -106,4 +104,4 @@
 .breadcrumb-dropdown-item:hover {
   background-color: var(--rs-color-background-base-primary-hover);
   border-radius: var(--rs-radius-2);
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/button/button.module.css b/packages/raystack/components/button/button.module.css
index 3fde77f6d..3a0a4ed32 100644
--- a/packages/raystack/components/button/button.module.css
+++ b/packages/raystack/components/button/button.module.css
@@ -19,6 +19,7 @@
 .button:focus-visible {
   outline: 1px solid var(--rs-color-border-accent-emphasis);
 }
+
 .button:focus {
   outline: none;
 }
@@ -31,7 +32,6 @@
 .button:disabled,
 .button-disabled {
   opacity: 0.5;
-  cursor: not-allowed;
   pointer-events: initial;
 }
 
@@ -102,7 +102,7 @@
 .button-outline.button-disabled {
   opacity: 0.5;
   background-color: transparent;
-  cursor: not-allowed;
+  cursor: default;
 }
 
 .button-outline:disabled:hover,
@@ -125,7 +125,6 @@
   background-color: transparent;
   color: var(--rs-color-foreground-accent-primary);
   border-color: var(--rs-color-border-accent-primary);
-  cursor: not-allowed;
 }
 
 .button-outline-accent.button-loading:hover {
@@ -168,7 +167,6 @@
 .button-ghost:disabled,
 .button-ghost.button-disabled {
   opacity: 0.5;
-  cursor: not-allowed;
 }
 
 .button-ghost:disabled:hover,
@@ -190,7 +188,6 @@
 .button-ghost.button-loading[data-radix-dropdown-menu-trigger][data-state="open"] {
   background-color: transparent;
   border-color: var(--rs-color-border-base-primary);
-  cursor: not-allowed;
 }
 
 .button-text {
@@ -208,7 +205,6 @@
 .button-text:disabled,
 .button-text.button-disabled {
   opacity: 0.5;
-  cursor: not-allowed;
 }
 
 .button-text.button-loading:hover,
@@ -216,7 +212,6 @@
 .button-text.button-loading[data-radix-popover-trigger][data-state="open"],
 .button-text.button-loading[data-radix-dropdown-menu-trigger][data-state="open"] {
   background-color: transparent;
-  cursor: not-allowed;
 }
 
 .button-text:disabled:hover,
@@ -241,7 +236,6 @@
 .button-loading[data-radix-popover-trigger][data-state="open"],
 .button-loading[data-radix-dropdown-menu-trigger][data-state="open"] {
   background-color: inherit;
-  cursor: not-allowed;
 }
 
 .loader {
@@ -597,4 +591,4 @@
 .button-text-success:disabled:hover,
 .button-text-success.button-loading:hover {
   color: var(--rs-color-foreground-success-primary);
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/calendar/calendar.module.css b/packages/raystack/components/calendar/calendar.module.css
index 94248ea20..637af0e65 100644
--- a/packages/raystack/components/calendar/calendar.module.css
+++ b/packages/raystack/components/calendar/calendar.module.css
@@ -196,7 +196,6 @@
 }
 
 .disabled {
-  color: var(--rs-color-foreground-base-tertiary);
   opacity: 0.5;
 }
 
diff --git a/packages/raystack/components/checkbox/checkbox.module.css b/packages/raystack/components/checkbox/checkbox.module.css
index c82110553..d4b538a99 100644
--- a/packages/raystack/components/checkbox/checkbox.module.css
+++ b/packages/raystack/components/checkbox/checkbox.module.css
@@ -48,7 +48,6 @@
 
 .checkbox[data-disabled] {
   opacity: 0.5;
-  cursor: not-allowed;
 }
 
 .checkbox[data-disabled]:hover {
@@ -68,4 +67,4 @@
 .icon {
   width: var(--rs-space-5);
   height: var(--rs-space-5);
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/icon-button/icon-button.module.css b/packages/raystack/components/icon-button/icon-button.module.css
index 6c56aa2b7..f4b5845f3 100644
--- a/packages/raystack/components/icon-button/icon-button.module.css
+++ b/packages/raystack/components/icon-button/icon-button.module.css
@@ -17,9 +17,8 @@
 }
 
 .iconButton:disabled {
-  cursor: not-allowed;
   opacity: 0.5;
-  color: var(--rs-color-foreground-base-secondary);
+  cursor: default;
 }
 
 .iconButton:active:not(:disabled) {
diff --git a/packages/raystack/components/input-field/input-field.module.css b/packages/raystack/components/input-field/input-field.module.css
index 0a27d3c98..8aba4ceee 100644
--- a/packages/raystack/components/input-field/input-field.module.css
+++ b/packages/raystack/components/input-field/input-field.module.css
@@ -59,10 +59,7 @@
 }
 
 .input-disabled-wrapper {
-  background: var(--rs-color-background-base-primary);
-  border-color: var(--rs-color-border-base-tertiary);
   opacity: 0.5;
-  cursor: not-allowed;
 }
 
 .leading-icon {
@@ -121,7 +118,6 @@
 
 .input-disabled {
   color: var(--rs-color-foreground-base-tertiary);
-  cursor: not-allowed;
 }
 
 .helper-text {
@@ -310,4 +306,4 @@
 .input-error-wrapper.variant-borderless:hover,
 .input-error-wrapper.variant-borderless:focus-within {
   border-color: transparent;
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/radio/radio.module.css b/packages/raystack/components/radio/radio.module.css
index a30d81675..2f80722f3 100644
--- a/packages/raystack/components/radio/radio.module.css
+++ b/packages/raystack/components/radio/radio.module.css
@@ -38,7 +38,6 @@
 .radioitem[data-disabled]:hover {
   background: var(--rs-color-background-neutral-secondary);
   border-color: var(--rs-color-border-base-secondary);
-  cursor: not-allowed;
 }
 
 .radioitem[data-disabled][data-checked],
@@ -67,4 +66,4 @@
 
 .radioitem[data-disabled] .indicator::after {
   background: var(--rs-color-foreground-base-emphasis);
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/search/search.module.css b/packages/raystack/components/search/search.module.css
index 3ef5501a4..f74387b45 100644
--- a/packages/raystack/components/search/search.module.css
+++ b/packages/raystack/components/search/search.module.css
@@ -22,7 +22,6 @@
 }
 
 .clearButton:disabled {
-  cursor: not-allowed;
   opacity: 0.5;
 }
 
diff --git a/packages/raystack/components/select/select.module.css b/packages/raystack/components/select/select.module.css
index 91bd61433..1c2a8dc08 100644
--- a/packages/raystack/components/select/select.module.css
+++ b/packages/raystack/components/select/select.module.css
@@ -117,16 +117,18 @@
   letter-spacing: var(--rs-letter-spacing-small);
   gap: var(--rs-space-2);
 }
+
 .trigger[data-multiselectable="true"] {
   padding-top: var(--rs-space-2);
   padding-bottom: var(--rs-space-2);
 }
 
-.trigger:hover {
+.trigger:hover:not([data-disabled]):not(:disabled) {
   cursor: pointer;
   background-color: var(--rs-color-background-base-primary-hover);
   color: var(--rs-color-foreground-base-primary);
 }
+
 .trigger:focus-visible {
   outline: 1px solid var(--rs-color-border-accent-emphasis);
 }
@@ -226,34 +228,7 @@
 }
 
 .trigger[data-disabled] {
-  background: var(--rs-color-background-base-primary);
-  border-color: var(--rs-color-border-base-tertiary);
   opacity: 0.5;
-  cursor: not-allowed !important;
-  pointer-events: none;
-}
-
-.trigger[data-disabled]:hover {
-  background: var(--rs-color-background-base-primary);
-  border-color: var(--rs-color-border-base-tertiary);
-  cursor: not-allowed !important;
-}
-
-.trigger[data-disabled] .triggerContent {
-  color: var(--rs-color-foreground-base-tertiary);
-}
-
-.trigger[data-disabled] .triggerIcon {
-  color: var(--rs-color-foreground-base-tertiary);
-}
-
-.trigger[data-disabled] .placeholder,
-.trigger[data-disabled] [data-placeholder] {
-  color: var(--rs-color-foreground-base-tertiary);
-}
-
-[data-disabled] {
-  cursor: not-allowed;
   pointer-events: none;
 }
 
@@ -271,9 +246,9 @@
 .comboboxContent:not(:has(.menuitem:not([data-hidden="true"]))) {
   padding: 0;
 }
+
 .content:has(.comboboxContent:empty) .comboboxInput,
-.content:has(.comboboxContent:not(:has(.menuitem:not([data-hidden="true"]))))
-  .comboboxInput {
+.content:has(.comboboxContent:not(:has(.menuitem:not([data-hidden="true"])))) .comboboxInput {
   border-bottom: none;
 }
 
@@ -300,4 +275,4 @@
 
 .hidden {
   display: none;
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/sidebar/sidebar.module.css b/packages/raystack/components/sidebar/sidebar.module.css
index 9af0c63c2..4a34eaf93 100644
--- a/packages/raystack/components/sidebar/sidebar.module.css
+++ b/packages/raystack/components/sidebar/sidebar.module.css
@@ -95,7 +95,6 @@
 
 .nav-item[data-disabled="true"] {
   opacity: 0.5;
-  cursor: not-allowed;
   pointer-events: none;
 }
 
@@ -205,10 +204,11 @@
 }
 
 @media (prefers-reduced-motion: reduce) {
+
   .root,
   .nav-item,
   .nav-text,
   .resizeHandle {
     transition: none;
   }
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/switch/switch.module.css b/packages/raystack/components/switch/switch.module.css
index 9b1827901..569dd9828 100644
--- a/packages/raystack/components/switch/switch.module.css
+++ b/packages/raystack/components/switch/switch.module.css
@@ -34,7 +34,6 @@
 }
 
 .switch[data-disabled] {
-  cursor: not-allowed;
   background: var(--rs-color-background-neutral-primary);
 }
 
@@ -67,4 +66,4 @@
 /* Small switch thumb positioning */
 .switch.small[data-checked] .thumb {
   transform: translateX(12px);
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/tabs/tabs.module.css b/packages/raystack/components/tabs/tabs.module.css
index 9261fc44e..4c281370b 100644
--- a/packages/raystack/components/tabs/tabs.module.css
+++ b/packages/raystack/components/tabs/tabs.module.css
@@ -54,8 +54,6 @@
 
 .trigger[data-disabled] {
   opacity: 0.5;
-  cursor: not-allowed;
-  color: var(--rs-color-foreground-base-secondary);
   pointer-events: none;
 }
 
@@ -102,4 +100,4 @@ asked the OS/browser for less or no motion
 /* Base UI uses hidden attribute for inactive panels */
 .content[hidden] {
   display: none;
-}
+}
\ No newline at end of file
diff --git a/packages/raystack/components/text-area/text-area.module.css b/packages/raystack/components/text-area/text-area.module.css
index f50e7ec14..eaf74efd8 100644
--- a/packages/raystack/components/text-area/text-area.module.css
+++ b/packages/raystack/components/text-area/text-area.module.css
@@ -20,6 +20,10 @@
   letter-spacing: var(--rs-letter-spacing-mini);
 }
 
+.labelDisabled {
+  opacity: 0.5;
+}
+
 .helpIcon {
   color: var(--rs-color-foreground-base-secondary);
   display: flex;
@@ -66,12 +70,12 @@
   overflow: hidden;
 }
 
-.textarea:hover {
+.textarea:hover:not(:disabled) {
   border-color: var(--rs-color-border-base-focus);
   background: var(--rs-color-background-base-primary-hover);
 }
 
-.textarea:focus {
+.textarea:focus:not(:disabled) {
   border-color: var(--rs-color-border-accent-emphasis);
   background: var(--rs-color-background-base-primary);
   outline: none;
@@ -85,10 +89,6 @@
 }
 
 .textarea:disabled {
-  background: var(--rs-color-background-base-primary);
-  border-color: var(--rs-color-border-base-tertiary);
-  color: var(--rs-color-foreground-base-tertiary);
-  cursor: not-allowed;
   opacity: 0.5;
 }
 
@@ -100,11 +100,11 @@
   border-color: var(--rs-color-border-danger-primary);
 }
 
-.error:hover {
+.error:hover:not(:disabled) {
   border-color: var(--rs-color-border-danger-emphasis-hover);
 }
 
-.error:focus {
+.error:focus:not(:disabled) {
   border-color: var(--rs-color-border-danger-emphasis-hover);
 }
 
@@ -113,5 +113,5 @@
 }
 
 .helperTextDisabled {
-  color: var(--rs-color-foreground-base-tertiary);
-}
+  opacity: 0.5;
+}
\ No newline at end of file
diff --git a/packages/raystack/components/toggle/toggle.module.css b/packages/raystack/components/toggle/toggle.module.css
index 4a264f800..e948e61a9 100644
--- a/packages/raystack/components/toggle/toggle.module.css
+++ b/packages/raystack/components/toggle/toggle.module.css
@@ -34,7 +34,6 @@
 }
 
 .toggle[data-disabled] {
-  cursor: not-allowed;
   opacity: 0.5;
   pointer-events: none;
 }