@tight-embedded/react 1.0.0 → 1.1.0

package/dist/index.css

@@ -8,6 +8,18 @@
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;
     }
+
+    /* Remove number input spinners
+    https://stackoverflow.com/questions/3790935/can-i-hide-the-html5-number-input-s-spin-box */
+    input::-webkit-outer-spin-button,
+    input::-webkit-inner-spin-button {
+        -webkit-appearance: none;
+        margin: 0;
+    }
+
+    input[type=number] {
+        -moz-appearance:textfield;
+    }
 }
 
 @keyframes fade-in {
@@ -339,10 +351,6 @@
     padding: 6px;
 }
 
-  .tsystem-p_15px_15px_0_15px {
-    padding: 15px 15px 0 15px;
-}
-
   .tsystem-p_15px {
     padding: 15px;
 }
@@ -507,6 +515,10 @@
     padding: 4px 8px;
 }
 
+  .tsystem-p_15px_15px_0_15px {
+    padding: 15px 15px 0 15px;
+}
+
   .tsystem-p_0_10px {
     padding: 0 10px;
 }
@@ -612,34 +624,6 @@
     border-top: var(--Tight-borderWidths-md) solid var(--Tight-colors-border-layout-strong);
 }
 
-  .tsystem-bd-t_\{borderWidths\.md\}_solid {
-    border-top: var(--Tight-borderWidths-md) solid;
-}
-
-  .tsystem-bd-c_border\.layout\.strong {
-    border-color: var(--Tight-colors-border-layout-strong);
-}
-
-  .tsystem-bd-b_\{borderWidths\.md\}_solid {
-    border-bottom: var(--Tight-borderWidths-md) solid;
-}
-
-  .tsystem-bd-c_border\.layout\.weak {
-    border-color: var(--Tight-colors-border-layout-weak);
-}
-
-  .tsystem-gap_8px {
-    gap: 8px;
-}
-
-  .tsystem-bd-c_strong {
-    border-color: strong;
-}
-
-  .tsystem-gap_16px {
-    gap: 16px;
-}
-
   .tsystem-bdr_lg {
     border-radius: var(--Tight-radii-lg);
 }
@@ -724,6 +708,10 @@
     border-width: 0;
 }
 
+  .tsystem-bd-c_border\.layout\.strong {
+    border-color: var(--Tight-colors-border-layout-strong);
+}
+
   .tsystem-trs_all_300ms_ease-out {
     transition: all 300ms ease-out;
 }
@@ -732,6 +720,14 @@
     place-items: center;
 }
 
+  .tsystem-gap_16px {
+    gap: 16px;
+}
+
+  .tsystem-gap_8px {
+    gap: 8px;
+}
+
   .tsystem-flex_1 {
     flex: 1 1 0%;
 }
@@ -780,6 +776,34 @@
     gap: 9px;
 }
 
+  .tsystem-bd-t_\{borderWidths\.md\}_solid {
+    border-top: var(--Tight-borderWidths-md) solid;
+}
+
+  .tsystem-bd-b_\{borderWidths\.md\}_solid {
+    border-bottom: var(--Tight-borderWidths-md) solid;
+}
+
+  .tsystem-bd-c_border\.layout\.weak {
+    border-color: var(--Tight-colors-border-layout-weak);
+}
+
+  .tsystem-bd-t_none {
+    border-top: none;
+}
+
+  .tsystem-bd-l_none {
+    border-left: none;
+}
+
+  .tsystem-bd-r_none {
+    border-right: none;
+}
+
+  .tsystem-bd-c_strong {
+    border-color: strong;
+}
+
   .tsystem-bd-w_sm {
     border-width: var(--Tight-borderWidths-sm);
 }
@@ -952,22 +976,6 @@
     position: sticky;
 }
 
-  .tsystem-flex-d_row {
-    flex-direction: row;
-}
-
-  .tsystem-jc_space-between {
-    justify-content: space-between;
-}
-
-  .tsystem-bg-c_surface\.foreground {
-    background-color: var(--Tight-colors-surface-foreground);
-}
-
-  .tsystem-bd-be-w_var\(--thickness\) {
-    border-block-end-width: var(--thickness);
-}
-
   .tsystem-jc_flex-end {
     justify-content: flex-end;
 }
@@ -976,6 +984,10 @@
     flex-shrink: 0;
 }
 
+  .tsystem-jc_space-between {
+    justify-content: space-between;
+}
+
   .tsystem-ai_flex-start {
     align-items: flex-start;
 }
@@ -988,10 +1000,18 @@
     flex-wrap: wrap;
 }
 
+  .tsystem-bg-c_surface\.foreground {
+    background-color: var(--Tight-colors-surface-foreground);
+}
+
   .tsystem-bg-c_surface\.intent\.secondary {
     background-color: var(--Tight-colors-surface-intent-secondary);
 }
 
+  .tsystem-flex-d_row {
+    flex-direction: row;
+}
+
   .tsystem-flex-d_row-reverse {
     flex-direction: row-reverse;
 }
@@ -1486,6 +1506,14 @@
     color: var(--Tight-colors-money-positive);
 }
 
+  .tsystem-ta_start {
+    text-align: start;
+}
+
+  .tsystem-bd-be-w_var\(--thickness\) {
+    border-block-end-width: var(--thickness);
+}
+
   .tsystem-fs_26px {
     font-size: 26px;
 }
@@ -1546,6 +1574,10 @@
     border-bottom-left-radius: 0;
 }
 
+  .tsystem-bg-c_foreground {
+    background-color: foreground;
+}
+
   .tsystem-grid-tc_repeat\(7\,_1fr\) {
     grid-template-columns: repeat(7, 1fr);
 }
@@ -1619,10 +1651,6 @@
     box-shadow: none;
 }
 
-  .tsystem-ta_start {
-    text-align: start;
-}
-
   .tsystem-bg-c_money\.positive\.weak {
     background-color: var(--Tight-colors-money-positive-weak);
 }
@@ -1667,10 +1695,18 @@
     color: var(--Tight-colors-inherit);
 }
 
+  .tsystem-max-w_100\% {
+    max-width: 100%;
+}
+
   .tsystem-mt_15px {
     margin-top: 15px;
 }
 
+  .tsystem-max-w_512px {
+    max-width: 512px;
+}
+
   .tsystem-ov-y_auto {
     overflow-y: auto;
 }
@@ -1687,22 +1723,6 @@
     bottom: 0;
 }
 
-  .tsystem-pb_14px {
-    padding-bottom: 14px;
-}
-
-  .tsystem-pl_15px {
-    padding-left: 15px;
-}
-
-  .tsystem-pr_15px {
-    padding-right: 15px;
-}
-
-  .tsystem-w_100\% {
-    width: 100%;
-}
-
   .tsystem-w_202px {
     width: 202px;
 }
@@ -1715,6 +1735,10 @@
     min-width: 200px;
 }
 
+  .tsystem-w_100\% {
+    width: 100%;
+}
+
   .tsystem-h_72 {
     height: 72px;
 }
@@ -1743,10 +1767,6 @@
     min-width: 0;
 }
 
-  .tsystem-max-w_100\% {
-    max-width: 100%;
-}
-
   .tsystem-min-h_0 {
     min-height: 0;
 }
@@ -2055,6 +2075,18 @@
     height: 250px;
 }
 
+  .tsystem-pb_14px {
+    padding-bottom: 14px;
+}
+
+  .tsystem-pl_15px {
+    padding-left: 15px;
+}
+
+  .tsystem-pr_15px {
+    padding-right: 15px;
+}
+
   .tsystem-bottom_-25px {
     bottom: -25px;
 }
@@ -2151,10 +2183,6 @@
     margin-right: 15px;
 }
 
-  .tsystem-w_512px {
-    width: 512px;
-}
-
   .tsystem-max-w_1 {
     max-width: 1px;
 }
@@ -2163,6 +2191,10 @@
     width: 1px;
 }
 
+  .tsystem-w_512px {
+    width: 512px;
+}
+
   .tsystem-min-h_36px {
     min-height: 36px;
 }
@@ -2207,6 +2239,10 @@
     min-height: 55px;
 }
 
+  .tsystem-w_full {
+    width: full;
+}
+
   .tsystem-mb_30px {
     margin-bottom: 30px;
 }
@@ -2827,7 +2863,7 @@
     outline-offset: -1px;
 }
 
-  .\[\&\:focus\]\:tsystem-cursor_text:focus {
+  .focus\:tsystem-cursor_text:is(:focus, [data-focus]) {
     cursor: text;
 }
 
@@ -2855,10 +2891,14 @@
     outline-color: var(--Tight-colors-border-layout);
 }
 
-  .\[\&\:focus\]\:tsystem-z_1:focus {
+  .focus\:tsystem-z_1:is(:focus, [data-focus]) {
     z-index: 1;
 }
 
+  .\[\&\:focus\]\:tsystem-cursor_text:focus {
+    cursor: text;
+}
+
   .focusVisible\:tsystem-ring-o_-2px:is(:focus-visible, [data-focus-visible]) {
     outline-offset: -2px;
 }
@@ -3392,6 +3432,10 @@
       color: var(--Tight-colors-typography-accent-action);
 }
 
+    .supportHover\:tsystem-cursor_pointer:hover {
+      cursor: pointer;
+}
+
     .supportHover\:tsystem-bg-c_brand\.primary:hover {
       background-color: var(--Tight-colors-brand-primary);
 }