@bestow-ui/react 1.7.0 → 2.0.0

package/dist/index.css

@@ -1,3 +1,5 @@
+@layer base, bestow;
+@layer bestow {
 /* src/theme/contract.css.ts */
 :root {
   --bestow-space-0: 0;
@@ -50,6 +52,7 @@
   --bestow-duration-fast: 120ms;
   --bestow-duration-normal: 200ms;
   --bestow-duration-slow: 320ms;
+  --bestow-opacity-disabled: 0.5;
   --bestow-z-index-overlay: 1300;
   --bestow-z-index-modal: 1310;
   --bestow-z-index-dropdown: 1320;
@@ -67,6 +70,9 @@
   --bestow-color-border-default: #dee2e6;
   --bestow-color-border-strong: #adb5bd;
   --bestow-color-border-focus: #3b6ff6;
+  --bestow-color-border-input: #666e76;
+  --bestow-color-border-input-hover: #495057;
+  --bestow-color-border-control: #666e76;
   --bestow-color-primary-solid: #2554eb;
   --bestow-color-primary-solid-hover: #1d42d8;
   --bestow-color-primary-contrast: #ffffff;
@@ -158,6 +164,7 @@
   --bestow-duration-fast: 120ms;
   --bestow-duration-normal: 200ms;
   --bestow-duration-slow: 320ms;
+  --bestow-opacity-disabled: 0.5;
   --bestow-z-index-overlay: 1300;
   --bestow-z-index-modal: 1310;
   --bestow-z-index-dropdown: 1320;
@@ -175,6 +182,9 @@
   --bestow-color-border-default: #dee2e6;
   --bestow-color-border-strong: #adb5bd;
   --bestow-color-border-focus: #3b6ff6;
+  --bestow-color-border-input: #666e76;
+  --bestow-color-border-input-hover: #495057;
+  --bestow-color-border-control: #666e76;
   --bestow-color-primary-solid: #2554eb;
   --bestow-color-primary-solid-hover: #1d42d8;
   --bestow-color-primary-contrast: #ffffff;
@@ -266,6 +276,7 @@
   --bestow-duration-fast: 120ms;
   --bestow-duration-normal: 200ms;
   --bestow-duration-slow: 320ms;
+  --bestow-opacity-disabled: 0.5;
   --bestow-z-index-overlay: 1300;
   --bestow-z-index-modal: 1310;
   --bestow-z-index-dropdown: 1320;
@@ -283,6 +294,9 @@
   --bestow-color-border-default: #495057;
   --bestow-color-border-strong: #adb5bd;
   --bestow-color-border-focus: #6090fa;
+  --bestow-color-border-input: #adb5bd;
+  --bestow-color-border-input-hover: #dee2e6;
+  --bestow-color-border-control: #adb5bd;
   --bestow-color-primary-solid: #2554eb;
   --bestow-color-primary-solid-hover: #1d42d8;
   --bestow-color-primary-contrast: #ffffff;
@@ -374,6 +388,7 @@
   --bestow-duration-fast: 120ms;
   --bestow-duration-normal: 200ms;
   --bestow-duration-slow: 320ms;
+  --bestow-opacity-disabled: 0.5;
   --bestow-z-index-overlay: 1300;
   --bestow-z-index-modal: 1310;
   --bestow-z-index-dropdown: 1320;
@@ -391,6 +406,9 @@
   --bestow-color-border-default: #dee2e6;
   --bestow-color-border-strong: #adb5bd;
   --bestow-color-border-focus: #3b6ff6;
+  --bestow-color-border-input: #666e76;
+  --bestow-color-border-input-hover: #495057;
+  --bestow-color-border-control: #666e76;
   --bestow-color-primary-solid: #2554eb;
   --bestow-color-primary-solid-hover: #1d42d8;
   --bestow-color-primary-contrast: #ffffff;
@@ -483,6 +501,7 @@
     --bestow-duration-fast: 120ms;
     --bestow-duration-normal: 200ms;
     --bestow-duration-slow: 320ms;
+    --bestow-opacity-disabled: 0.5;
     --bestow-z-index-overlay: 1300;
     --bestow-z-index-modal: 1310;
     --bestow-z-index-dropdown: 1320;
@@ -500,6 +519,9 @@
     --bestow-color-border-default: #495057;
     --bestow-color-border-strong: #adb5bd;
     --bestow-color-border-focus: #6090fa;
+    --bestow-color-border-input: #adb5bd;
+    --bestow-color-border-input-hover: #dee2e6;
+    --bestow-color-border-control: #adb5bd;
     --bestow-color-primary-solid: #2554eb;
     --bestow-color-primary-solid-hover: #1d42d8;
     --bestow-color-primary-contrast: #ffffff;
@@ -784,15 +806,15 @@
   display: inline-flex;
   align-items: center;
   gap: var(--bestow-space-2);
-  border: 1px solid var(--bestow-color-border-input, var(--bestow-color-border-default));
+  border: 1px solid var(--bestow-color-border-input);
   border-radius: var(--bestow-radius-md);
   background-color: var(--bestow-color-bg-default);
   color: var(--bestow-color-fg-default);
   transition: border-color var(--bestow-duration-fast), box-shadow var(--bestow-duration-fast);
   cursor: text;
 }
-._19p5zvh0:hover:not([data-disabled]) {
-  border-color: var(--bestow-color-border-input-hover, var(--bestow-color-border-strong));
+._19p5zvh0:hover:not([data-disabled], fieldset:disabled *) {
+  border-color: var(--bestow-color-border-input-hover);
 }
 ._19p5zvh0:focus-within {
   border-color: var(--bestow-color-border-focus);
@@ -804,10 +826,11 @@
 ._19p5zvh0[data-invalid]:focus-within {
   box-shadow: 0 0 0 1px var(--bestow-color-danger-solid);
 }
-._19p5zvh0[data-disabled] {
+._19p5zvh0[data-disabled],
+fieldset:disabled ._19p5zvh0 {
   background-color: var(--bestow-color-bg-muted);
   cursor: not-allowed;
-  opacity: 0.6;
+  opacity: var(--bestow-opacity-disabled);
 }
 ._19p5zvh1 {
   height: 32px;
@@ -1505,7 +1528,7 @@
   border-radius: var(--bestow-radius-sm);
 }
 .v58j0l3[data-disabled] {
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 .v58j0l4 {
@@ -1588,6 +1611,8 @@
   font-family: var(--bestow-font-family-sans);
   font-weight: var(--bestow-font-weight-semibold);
   line-height: var(--bestow-font-line-height-tight);
+  box-sizing: border-box;
+  text-decoration: none;
   white-space: nowrap;
   cursor: pointer;
   user-select: none;
@@ -1600,8 +1625,9 @@
   outline: 2px solid var(--bestow-color-border-focus);
   outline-offset: 2px;
 }
-.xcekda6:disabled {
-  opacity: 0.5;
+.xcekda6:disabled,
+.xcekda6[data-disabled] {
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 .xcekda6[aria-busy=true] {
@@ -1611,14 +1637,14 @@
   background-color: var(--xcekda0);
   color: var(--xcekda2);
 }
-.xcekda7:hover:not(:disabled) {
+.xcekda7:hover:not(:disabled, [data-disabled]) {
   background-color: var(--xcekda1);
 }
 .xcekda8 {
   background-color: var(--xcekda3);
   color: var(--xcekda5);
 }
-.xcekda8:hover:not(:disabled) {
+.xcekda8:hover:not(:disabled, [data-disabled]) {
   background-color: var(--xcekda4);
 }
 .xcekda9 {
@@ -1626,14 +1652,14 @@
   border-color: var(--xcekda0);
   color: var(--xcekda5);
 }
-.xcekda9:hover:not(:disabled) {
+.xcekda9:hover:not(:disabled, [data-disabled]) {
   background-color: var(--xcekda3);
 }
 .xcekdaa {
   background-color: transparent;
   color: var(--xcekda5);
 }
-.xcekdaa:hover:not(:disabled) {
+.xcekdaa:hover:not(:disabled, [data-disabled]) {
   background-color: var(--xcekda3);
 }
 .xcekdab {
@@ -1852,9 +1878,10 @@
   cursor: pointer;
   user-select: none;
 }
-._1y7mzsn0[data-disabled] {
+._1y7mzsn0[data-disabled],
+fieldset:disabled ._1y7mzsn0 {
   cursor: not-allowed;
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
 }
 ._1y7mzsn1 {
   font-size: var(--bestow-font-size-sm);
@@ -1880,7 +1907,7 @@
   margin: 0;
   width: 100%;
   height: 100%;
-  border: 1.5px solid var(--bestow-color-border-control, var(--bestow-color-border-strong));
+  border: 1.5px solid var(--bestow-color-border-control);
   border-radius: var(--bestow-radius-sm);
   background-color: var(--bestow-color-bg-default);
   cursor: inherit;
@@ -2406,7 +2433,7 @@
   background-color: var(--bestow-color-primary-solid-hover);
 }
 ._1qyq67b6[aria-disabled=true] {
-  opacity: 0.4;
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
   text-decoration: line-through;
 }
@@ -2523,7 +2550,7 @@
   color: var(--bestow-color-primary-text);
 }
 ._1kx81e85[data-disabled] {
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 ._1kx81e86 {
@@ -3094,7 +3121,7 @@
   background-color: var(--bestow-color-neutral-subtle);
 }
 ._1d7ahux1[data-disabled] {
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 ._1d7ahux2 {
@@ -3238,7 +3265,7 @@
   outline-offset: 2px;
 }
 ._1iraoak1:disabled {
-  opacity: 0.4;
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 ._1iraoak1[aria-current=page] {
@@ -3304,7 +3331,7 @@
   margin-top: calc((1.5em - var(--_1w9iwjm6)) / 2);
   width: var(--_1w9iwjm6);
   height: var(--_1w9iwjm6);
-  border: 1.5px solid var(--bestow-color-border-control, var(--bestow-color-border-strong));
+  border: 1.5px solid var(--bestow-color-border-control);
   border-radius: var(--bestow-radius-full);
   background-color: var(--bestow-color-bg-default);
   cursor: pointer;
@@ -3324,7 +3351,7 @@
 }
 ._1w9iwjm7:disabled {
   cursor: not-allowed;
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
 }
 [aria-invalid=true] ._1w9iwjm7:not(:checked) {
   border-color: var(--bestow-color-danger-solid);
@@ -3345,9 +3372,10 @@
   cursor: pointer;
   user-select: none;
 }
-[data-disabled] ._1w9iwjmb {
+[data-disabled] ._1w9iwjmb,
+fieldset:disabled ._1w9iwjmb {
   cursor: not-allowed;
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
 }
 ._1w9iwjmc {
   font-size: var(--bestow-font-size-sm);
@@ -3422,7 +3450,7 @@
     background-color var(--bestow-duration-fast),
     box-shadow var(--bestow-duration-fast);
 }
-._1h65mmo2:hover:not([data-disabled]) {
+._1h65mmo2:hover:not([data-disabled], :disabled) {
   color: var(--bestow-color-fg-default);
 }
 ._1h65mmo2[data-state=checked] {
@@ -3434,8 +3462,9 @@
   outline: 2px solid var(--bestow-color-border-focus);
   outline-offset: -2px;
 }
-._1h65mmo2[data-disabled] {
-  opacity: 0.5;
+._1h65mmo2[data-disabled],
+._1h65mmo2:disabled {
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 ._1h65mmo3 {
@@ -3545,13 +3574,13 @@
   font-weight: var(--bestow-font-weight-semibold);
   line-height: var(--bestow-font-line-height-normal);
   text-decoration: none;
-  box-shadow: var(--bestow-shadow-md);
   transform: translateY(calc(-100% - var(--bestow-space-4)));
   transition: transform var(--bestow-duration-fast) ease-out;
 }
 ._1t9jaar0:focus,
 ._1t9jaar0:focus-visible {
   transform: translateY(0);
+  box-shadow: var(--bestow-shadow-md);
   outline: 2px solid var(--bestow-color-border-focus);
   outline-offset: 2px;
 }
@@ -3599,7 +3628,7 @@
   user-select: none;
 }
 ._126mzjm5[data-disabled] {
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 ._126mzjm6 {
@@ -3688,7 +3717,7 @@
   content: "";
   position: absolute;
   border-radius: var(--bestow-radius-full);
-  background-color: var(--bestow-color-border-control, var(--bestow-color-border-strong));
+  background-color: var(--bestow-color-border-control);
 }
 .kervhm3[data-status=complete]::after {
   background-color: var(--bestow-color-primary-text);
@@ -3742,7 +3771,7 @@
   color: var(--bestow-color-primary-text);
 }
 .kervhm9 {
-  border: 1.5px solid var(--bestow-color-border-control, var(--bestow-color-border-strong));
+  border: 1.5px solid var(--bestow-color-border-control);
   background-color: var(--bestow-color-bg-default);
   color: var(--bestow-color-fg-muted);
 }
@@ -3761,20 +3790,24 @@
   padding-top: calc((28px - var(--bestow-font-size-sm) * 1.5) / 2);
 }
 .kervhmd {
-  font-size: var(--bestow-font-size-sm);
+  box-sizing: border-box;
+  min-height: calc(calc((28px - var(--bestow-font-size-sm) * 1.5) / 2) + var(--bestow-font-size-sm) * var(--bestow-font-line-height-normal) + 2px + var(--bestow-font-size-xs) * var(--bestow-font-line-height-normal));
 }
 .kervhme {
+  font-size: var(--bestow-font-size-sm);
+}
+.kervhmf {
   color: var(--bestow-color-fg-default);
   font-weight: var(--bestow-font-weight-medium);
 }
-.kervhmf {
+.kervhmg {
   color: var(--bestow-color-fg-default);
   font-weight: var(--bestow-font-weight-semibold);
 }
-.kervhmg {
+.kervhmh {
   color: var(--bestow-color-fg-muted);
 }
-.kervhmh {
+.kervhmi {
   font-size: var(--bestow-font-size-xs);
   color: var(--bestow-color-fg-muted);
 }
@@ -3801,8 +3834,9 @@
   gap: var(--bestow-space-2);
   color: var(--bestow-color-fg-default);
 }
-.o33ul20[data-disabled] {
-  opacity: 0.5;
+.o33ul20[data-disabled],
+fieldset:disabled .o33ul20 {
+  opacity: var(--bestow-opacity-disabled);
 }
 .o33ul21 {
   font-size: var(--bestow-font-size-sm);
@@ -3818,7 +3852,7 @@
   padding: 2px;
   border: none;
   border-radius: var(--bestow-radius-full);
-  background-color: var(--bestow-color-border-control, var(--bestow-color-border-strong));
+  background-color: var(--bestow-color-border-control);
   cursor: pointer;
   transition: background-color var(--bestow-duration-fast);
 }
@@ -3888,7 +3922,8 @@
   cursor: pointer;
   user-select: none;
 }
-[data-disabled] > .o33ul2c {
+[data-disabled] > .o33ul2c,
+fieldset:disabled .o33ul2c {
   cursor: not-allowed;
 }
 @media (prefers-reduced-motion: reduce) {
@@ -4100,7 +4135,7 @@
   outline-offset: -2px;
 }
 .fvhbtd4[data-disabled] {
-  opacity: 0.5;
+  opacity: var(--bestow-opacity-disabled);
   cursor: not-allowed;
 }
 .fvhbtd4[data-orientation=vertical] {
@@ -4179,7 +4214,7 @@
   width: 100%;
   min-height: 64px;
   margin: 0;
-  border: 1px solid var(--bestow-color-border-input, var(--bestow-color-border-default));
+  border: 1px solid var(--bestow-color-border-input);
   border-radius: var(--bestow-radius-md);
   background-color: var(--bestow-color-bg-default);
   color: var(--bestow-color-fg-default);
@@ -4192,7 +4227,7 @@
   color: var(--bestow-color-fg-subtle);
 }
 ._1koawa0:hover:not(:disabled) {
-  border-color: var(--bestow-color-border-input-hover, var(--bestow-color-border-strong));
+  border-color: var(--bestow-color-border-input-hover);
 }
 ._1koawa0:focus {
   border-color: var(--bestow-color-border-focus);
@@ -4207,7 +4242,7 @@
 ._1koawa0:disabled {
   background-color: var(--bestow-color-bg-muted);
   cursor: not-allowed;
-  opacity: 0.6;
+  opacity: var(--bestow-opacity-disabled);
 }
 ._1koawa1 {
   padding: var(--bestow-space-1) var(--bestow-space-2);
@@ -4437,7 +4472,7 @@
   flex-shrink: 1;
   min-width: 32px;
   min-height: 52px;
-  border: 1px solid var(--bestow-color-border-input, var(--bestow-color-border-default));
+  border: 1px solid var(--bestow-color-border-input);
   border-radius: var(--bestow-radius-md);
   background-color: var(--bestow-color-bg-default);
   color: var(--bestow-color-fg-default);
@@ -4454,9 +4489,10 @@
 [data-invalid] .ea01813 {
   border-color: var(--bestow-color-danger-solid);
 }
-[data-disabled] .ea01813 {
+[data-disabled] .ea01813,
+fieldset:disabled .ea01813 {
   background-color: var(--bestow-color-bg-muted);
-  opacity: 0.6;
+  opacity: var(--bestow-opacity-disabled);
 }
 .ea01814 {
   font-size: var(--bestow-font-size-sm);
@@ -4464,4 +4500,5 @@
   font-variant-numeric: tabular-nums;
   color: var(--bestow-color-danger-text);
 }
-/*# sourceMappingURL=index.css.map */
+}
+/*# sourceMappingURL=index.css.map */