@seeqdev/qomponents 0.0.6 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/styles.css CHANGED
@@ -1475,6 +1475,12 @@ video {
1475
1475
  --sq-dark-text: 194, 188, 176;
1476
1476
  --sq-dark-disabled-gray: 70, 73, 73;
1477
1477
  --sq-highlight-color-dark: 36, 45, 49;
1478
+ --sq-gray-highlight: 249, 249, 249;
1479
+ --sq-gray-highlight-dark: 36, 45, 49;
1480
+ --sq-colored-hover: 238, 246, 253;
1481
+ --sq-colored-hover-dark: 40, 42, 42;
1482
+ --sq-multi-gray-dark: 66, 69, 69;
1483
+ --sq-field-disabled-gray: 239, 239, 239;
1478
1484
  }
1479
1485
 
1480
1486
  .color_topic {
@@ -1486,6 +1492,9 @@ video {
1486
1492
  --sq-link: 42, 92, 132;
1487
1493
  --sq-link-dark: 145, 180, 203;
1488
1494
  --sq-icon-dark: 4, 145, 194;
1495
+ --sq-gray-highlight-dark: 36, 45, 49;
1496
+ --sq-colored-hover: 238, 246, 253;
1497
+ --sq-colored-hover-dark: 40, 42, 42;
1489
1498
  }
1490
1499
 
1491
1500
  .color_analysis {
@@ -1497,6 +1506,9 @@ video {
1497
1506
  --sq-link: 0, 121, 96;
1498
1507
  --sq-link-dark: 21, 99, 81;
1499
1508
  --sq-icon-dark: 23, 126, 77;
1509
+ --sq-gray-highlight-dark: 36, 45, 49;
1510
+ --sq-colored-hover: 238, 248, 244;
1511
+ --sq-colored-hover-dark: 33, 54, 47;
1500
1512
  }
1501
1513
 
1502
1514
  .color_datalab {
@@ -1506,6 +1518,9 @@ video {
1506
1518
  --sq-color-highlight: 244, 123, 62;
1507
1519
  --sq-icon: 242, 103, 34;
1508
1520
  --sq-link: 242, 103, 34;
1521
+ --sq-gray-highlight-dark: 36, 45, 49;
1522
+ --sq-colored-hover: 241, 162, 120;
1523
+ --sq-colored-hover-dark: 80, 43, 26;
1509
1524
  }
1510
1525
 
1511
1526
  *, ::before, ::after {
@@ -1712,10 +1727,26 @@ video {
1712
1727
  top: 50%;
1713
1728
  }
1714
1729
 
1730
+ .\!tw-z-\[9000\] {
1731
+ z-index: 9000 !important;
1732
+ }
1733
+
1715
1734
  .tw-z-50 {
1716
1735
  z-index: 50;
1717
1736
  }
1718
1737
 
1738
+ .tw-z-\[9999\] {
1739
+ z-index: 9999;
1740
+ }
1741
+
1742
+ .tw-m-0 {
1743
+ margin: 0px;
1744
+ }
1745
+
1746
+ .tw-m-0\.5 {
1747
+ margin: 0.125rem;
1748
+ }
1749
+
1719
1750
  .tw-ml-1 {
1720
1751
  margin-left: 0.25rem;
1721
1752
  }
@@ -1752,6 +1783,10 @@ video {
1752
1783
  height: 0.875rem;
1753
1784
  }
1754
1785
 
1786
+ .tw-h-inputs {
1787
+ height: 34px;
1788
+ }
1789
+
1755
1790
  .tw-w-3 {
1756
1791
  width: 0.75rem;
1757
1792
  }
@@ -1760,6 +1795,15 @@ video {
1760
1795
  width: 0.875rem;
1761
1796
  }
1762
1797
 
1798
+ .tw-w-\[200px\] {
1799
+ width: 200px;
1800
+ }
1801
+
1802
+ .tw-min-w-fit {
1803
+ min-width: -moz-fit-content;
1804
+ min-width: fit-content;
1805
+ }
1806
+
1763
1807
  .-tw-translate-x-1\/2 {
1764
1808
  --tw-translate-x: -50%;
1765
1809
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1810,6 +1854,10 @@ video {
1810
1854
  grid-template-columns: repeat(4, minmax(0, 1fr));
1811
1855
  }
1812
1856
 
1857
+ .tw-flex-row {
1858
+ flex-direction: row;
1859
+ }
1860
+
1813
1861
  .tw-items-center {
1814
1862
  align-items: center;
1815
1863
  }
@@ -1830,17 +1878,58 @@ video {
1830
1878
  border-radius: 3px;
1831
1879
  }
1832
1880
 
1881
+ .tw-rounded-b {
1882
+ border-bottom-right-radius: 0.25rem;
1883
+ border-bottom-left-radius: 0.25rem;
1884
+ }
1885
+
1886
+ .tw-rounded-l-sm {
1887
+ border-top-left-radius: 3px;
1888
+ border-bottom-left-radius: 3px;
1889
+ }
1890
+
1891
+ .tw-rounded-r-sm {
1892
+ border-top-right-radius: 3px;
1893
+ border-bottom-right-radius: 3px;
1894
+ }
1895
+
1896
+ .tw-rounded-t-sm {
1897
+ border-top-left-radius: 3px;
1898
+ border-top-right-radius: 3px;
1899
+ }
1900
+
1901
+ .tw-rounded-tl-sm {
1902
+ border-top-left-radius: 3px;
1903
+ }
1904
+
1905
+ .tw-rounded-tr-sm {
1906
+ border-top-right-radius: 3px;
1907
+ }
1908
+
1833
1909
  .tw-border {
1834
1910
  border-width: 1px;
1835
1911
  }
1836
1912
 
1913
+ .tw-border-l-0 {
1914
+ border-left-width: 0px;
1915
+ }
1916
+
1917
+ .tw-border-r-0 {
1918
+ border-right-width: 0px;
1919
+ }
1920
+
1837
1921
  .tw-border-solid {
1838
1922
  border-style: solid;
1839
1923
  }
1840
1924
 
1925
+ .tw-border-sq-danger-color {
1926
+ --tw-border-opacity: 1;
1927
+ border-color: rgb(var(--sq-danger-color));
1928
+ }
1929
+
1841
1930
  .tw-border-sq-disabled-gray {
1842
1931
  --tw-border-opacity: 1;
1843
- border-color: rgba(var(--sq-disabled-gray), var(--tw-border-opacity));
1932
+ border-color: rgb(var(--sq-disabled-gray));
1844
1933
  }
1845
1934
 
1846
1935
  .tw-bg-black {
@@ -1850,27 +1939,52 @@ video {
1850
1939
 
1851
1940
  .tw-bg-sq-color-dark {
1852
1941
  --tw-bg-opacity: 1;
1853
- background-color: rgba(var(--sq-color-dark), var(--tw-bg-opacity));
1942
+ background-color: rgb(var(--sq-color-dark));
1943
+ }
1944
+
1945
+ .tw-bg-sq-colored-hover {
1946
+ --tw-bg-opacity: 1;
1947
+ background-color: rgb(var(--sq-colored-hover));
1854
1948
  }
1855
1949
 
1856
1950
  .tw-bg-sq-danger-color {
1857
1951
  --tw-bg-opacity: 1;
1858
- background-color: rgba(var(--sq-danger-color), var(--tw-bg-opacity));
1952
+ background-color: rgb(var(--sq-danger-color));
1859
1953
  }
1860
1954
 
1861
1955
  .tw-bg-sq-dark-background {
1862
1956
  --tw-bg-opacity: 1;
1863
- background-color: rgba(var(--sq-dark-background), var(--tw-bg-opacity));
1957
+ background-color: rgb(var(--sq-dark-background));
1958
+ }
1959
+
1960
+ .tw-bg-sq-disabled-gray {
1961
+ --tw-bg-opacity: 1;
1962
+ background-color: rgb(var(--sq-disabled-gray));
1963
+ }
1964
+
1965
+ .tw-bg-sq-field-disabled-gray {
1966
+ --tw-bg-opacity: 1;
1967
+ background-color: rgba(var(--sq-field-disabled-gray), 0.3);
1864
1968
  }
1865
1969
 
1866
1970
  .tw-bg-sq-icon {
1867
1971
  --tw-bg-opacity: 1;
1868
- background-color: rgba(var(--sq-icon), var(--tw-bg-opacity));
1972
+ background-color: rgb(var(--sq-icon));
1973
+ }
1974
+
1975
+ .tw-bg-sq-light-gray {
1976
+ --tw-bg-opacity: 1;
1977
+ background-color: rgb(var(--sq-light-gray));
1869
1978
  }
1870
1979
 
1871
1980
  .tw-bg-sq-warning-color {
1872
1981
  --tw-bg-opacity: 1;
1873
- background-color: rgba(var(--sq-warning-color), var(--tw-bg-opacity));
1982
+ background-color: rgb(var(--sq-warning-color));
1983
+ }
1984
+
1985
+ .tw-bg-white {
1986
+ --tw-bg-opacity: 1;
1987
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
1874
1988
  }
1875
1989
 
1876
1990
  .tw-p-1 {
@@ -1885,6 +1999,15 @@ video {
1885
1999
  padding: 1rem;
1886
2000
  }
1887
2001
 
2002
+ .tw-p-5 {
2003
+ padding: 1.25rem;
2004
+ }
2005
+
2006
+ .tw-px-1 {
2007
+ padding-left: 0.25rem;
2008
+ padding-right: 0.25rem;
2009
+ }
2010
+
1888
2011
  .tw-px-2 {
1889
2012
  padding-left: 0.5rem;
1890
2013
  padding-right: 0.5rem;
@@ -1900,6 +2023,16 @@ video {
1900
2023
  padding-right: 0.75rem;
1901
2024
  }
1902
2025
 
2026
+ .tw-py-0 {
2027
+ padding-top: 0px;
2028
+ padding-bottom: 0px;
2029
+ }
2030
+
2031
+ .tw-py-0\.5 {
2032
+ padding-top: 0.125rem;
2033
+ padding-bottom: 0.125rem;
2034
+ }
2035
+
1903
2036
  .tw-py-1 {
1904
2037
  padding-top: 0.25rem;
1905
2038
  padding-bottom: 0.25rem;
@@ -1928,54 +2061,59 @@ video {
1928
2061
  line-height: 1.5;
1929
2062
  }
1930
2063
 
2064
+ .tw-text-gray-400 {
2065
+ --tw-text-opacity: 1;
2066
+ color: rgb(156 163 175 / var(--tw-text-opacity));
2067
+ }
2068
+
1931
2069
  .tw-text-sq-color-dark {
1932
2070
  --tw-text-opacity: 1;
1933
- color: rgba(var(--sq-color-dark), var(--tw-text-opacity));
2071
+ color: rgb(var(--sq-color-dark));
1934
2072
  }
1935
2073
 
1936
2074
  .tw-text-sq-color-light {
1937
2075
  --tw-text-opacity: 1;
1938
- color: rgba(var(--sq-color-light), var(--tw-text-opacity));
2076
+ color: rgb(var(--sq-color-light));
1939
2077
  }
1940
2078
 
1941
2079
  .tw-text-sq-danger-color {
1942
2080
  --tw-text-opacity: 1;
1943
- color: rgba(var(--sq-danger-color), var(--tw-text-opacity));
2081
+ color: rgb(var(--sq-danger-color));
1944
2082
  }
1945
2083
 
1946
2084
  .tw-text-sq-darkish-gray {
1947
2085
  --tw-text-opacity: 1;
1948
- color: rgba(var(--sq-darkish-gray), var(--tw-text-opacity));
2086
+ color: rgb(var(--sq-darkish-gray));
1949
2087
  }
1950
2088
 
1951
2089
  .tw-text-sq-disabled-gray {
1952
2090
  --tw-text-opacity: 1;
1953
- color: rgba(var(--sq-disabled-gray), var(--tw-text-opacity));
2091
+ color: rgb(var(--sq-disabled-gray));
1954
2092
  }
1955
2093
 
1956
2094
  .tw-text-sq-fairly-dark-gray {
1957
2095
  --tw-text-opacity: 1;
1958
- color: rgba(var(--sq-fairly-dark-gray), var(--tw-text-opacity));
2096
+ color: rgb(var(--sq-fairly-dark-gray));
1959
2097
  }
1960
2098
 
1961
2099
  .tw-text-sq-link {
1962
2100
  --tw-text-opacity: 1;
1963
- color: rgba(var(--sq-link), var(--tw-text-opacity));
2101
+ color: rgb(var(--sq-link));
1964
2102
  }
1965
2103
 
1966
2104
  .tw-text-sq-success-color {
1967
2105
  --tw-text-opacity: 1;
1968
- color: rgba(var(--sq-success-color), var(--tw-text-opacity));
2106
+ color: rgb(var(--sq-success-color));
1969
2107
  }
1970
2108
 
1971
2109
  .tw-text-sq-text-color {
1972
2110
  --tw-text-opacity: 1;
1973
- color: rgba(var(--sq-text-color), var(--tw-text-opacity));
2111
+ color: rgb(var(--sq-text-color));
1974
2112
  }
1975
2113
 
1976
2114
  .tw-text-sq-warning-color {
1977
2115
  --tw-text-opacity: 1;
1978
- color: rgba(var(--sq-warning-color), var(--tw-text-opacity));
2116
+ color: rgb(var(--sq-warning-color));
1979
2117
  }
1980
2118
 
1981
2119
  .tw-text-white {
@@ -1983,6 +2121,16 @@ video {
1983
2121
  color: rgb(255 255 255 / var(--tw-text-opacity));
1984
2122
  }
1985
2123
 
2124
+ .tw-placeholder-gray-400::-moz-placeholder {
2125
+ --tw-placeholder-opacity: 1;
2126
+ color: rgb(156 163 175 / var(--tw-placeholder-opacity));
2127
+ }
2128
+
2129
+ .tw-placeholder-gray-400::placeholder {
2130
+ --tw-placeholder-opacity: 1;
2131
+ color: rgb(156 163 175 / var(--tw-placeholder-opacity));
2132
+ }
2133
+
1986
2134
  .tw-opacity-0 {
1987
2135
  opacity: 0;
1988
2136
  }
@@ -1996,6 +2144,14 @@ video {
1996
2144
 
1997
2145
  /* Make sure to keep these colors in sync with the webserver/_custom_variables.scss values to ensure cohesive UIs */
1998
2146
 
2147
+ .reactSelectMinHeight {
2148
+ min-height: 34px !important;
2149
+ }
2150
+
2151
+ .reactSelectMinHeightSmall {
2152
+ min-height: 22px !important;
2153
+ }
2154
+
1999
2155
  [type='checkbox']:checked, [type='radio']:checked {
2000
2156
  background-image: url('data:image/svg+xml,<svg viewBox="0 0 16 16" fill="white" xmlns="http://www.w3.org/2000/svg"><path d="M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z"/></svg>');
2001
2157
  }
@@ -2113,12 +2269,17 @@ video {
2113
2269
 
2114
2270
  .checked\:tw-text-sq-text-color:checked {
2115
2271
  --tw-text-opacity: 1;
2116
- color: rgba(var(--sq-text-color), var(--tw-text-opacity));
2272
+ color: rgb(var(--sq-text-color));
2273
+ }
2274
+
2275
+ .hover\:tw-border-sq-color-dark:hover {
2276
+ --tw-border-opacity: 1;
2277
+ border-color: rgb(var(--sq-color-dark));
2117
2278
  }
2118
2279
 
2119
2280
  .hover\:tw-bg-sq-color-highlight:hover {
2120
2281
  --tw-bg-opacity: 1;
2121
- background-color: rgba(var(--sq-color-highlight), var(--tw-bg-opacity));
2282
+ background-color: rgb(var(--sq-color-highlight));
2122
2283
  }
2123
2284
 
2124
2285
  .hover\:tw-bg-sq-danger-color-hover:hover {
@@ -2126,24 +2287,52 @@ video {
2126
2287
  background-color: rgb(212 59 55 / var(--tw-bg-opacity));
2127
2288
  }
2128
2289
 
2290
+ .hover\:tw-bg-sq-gray-highlight:hover {
2291
+ --tw-bg-opacity: 1;
2292
+ background-color: rgb(var(--sq-gray-highlight));
2293
+ }
2294
+
2129
2295
  .hover\:tw-bg-sq-light-gray:hover {
2130
2296
  --tw-bg-opacity: 1;
2131
- background-color: rgba(var(--sq-light-gray), var(--tw-bg-opacity));
2297
+ background-color: rgb(var(--sq-light-gray));
2132
2298
  }
2133
2299
 
2134
2300
  .hover\:tw-bg-sq-link:hover {
2135
2301
  --tw-bg-opacity: 1;
2136
- background-color: rgba(var(--sq-link), var(--tw-bg-opacity));
2302
+ background-color: rgb(var(--sq-link));
2303
+ }
2304
+
2305
+ .hover\:tw-text-sq-color-dark:hover {
2306
+ --tw-text-opacity: 1;
2307
+ color: rgb(var(--sq-color-dark));
2308
+ }
2309
+
2310
+ .hover\:tw-text-sq-danger-color:hover {
2311
+ --tw-text-opacity: 1;
2312
+ color: rgb(var(--sq-danger-color));
2313
+ }
2314
+
2315
+ .focus\:tw-border-l:focus {
2316
+ border-left-width: 1px;
2317
+ }
2318
+
2319
+ .focus\:tw-border-r:focus {
2320
+ border-right-width: 1px;
2137
2321
  }
2138
2322
 
2139
2323
  .focus\:tw-border-sq-color-dark:focus {
2140
2324
  --tw-border-opacity: 1;
2141
- border-color: rgba(var(--sq-color-dark), var(--tw-border-opacity));
2325
+ border-color: rgb(var(--sq-color-dark));
2142
2326
  }
2143
2327
 
2144
2328
  .focus\:tw-bg-sq-dark-gray:focus {
2145
2329
  --tw-bg-opacity: 1;
2146
- background-color: rgba(var(--sq-dark-gray), var(--tw-bg-opacity));
2330
+ background-color: rgb(var(--sq-dark-gray));
2331
+ }
2332
+
2333
+ .focus\:tw-text-sq-color-dark:focus {
2334
+ --tw-text-opacity: 1;
2335
+ color: rgb(var(--sq-color-dark));
2147
2336
  }
2148
2337
 
2149
2338
  .focus\:tw-outline-none:focus {
@@ -2162,14 +2351,27 @@ video {
2162
2351
  --tw-ring-offset-width: 0px;
2163
2352
  }
2164
2353
 
2354
+ .active\:tw-border-l:active {
2355
+ border-left-width: 1px;
2356
+ }
2357
+
2358
+ .active\:tw-border-r:active {
2359
+ border-right-width: 1px;
2360
+ }
2361
+
2165
2362
  .active\:tw-border-sq-color-dark:active {
2166
2363
  --tw-border-opacity: 1;
2167
- border-color: rgba(var(--sq-color-dark), var(--tw-border-opacity));
2364
+ border-color: rgb(var(--sq-color-dark));
2168
2365
  }
2169
2366
 
2170
2367
  .active\:tw-bg-sq-dark-gray:active {
2171
2368
  --tw-bg-opacity: 1;
2172
- background-color: rgba(var(--sq-dark-gray), var(--tw-bg-opacity));
2369
+ background-color: rgb(var(--sq-dark-gray));
2370
+ }
2371
+
2372
+ .active\:tw-text-sq-color-dark:active {
2373
+ --tw-text-opacity: 1;
2374
+ color: rgb(var(--sq-color-dark));
2173
2375
  }
2174
2376
 
2175
2377
  .disabled\:tw-pointer-events-none:disabled {
@@ -2186,7 +2388,7 @@ video {
2186
2388
 
2187
2389
  .disabled\:tw-text-sq-fairly-dark-gray:disabled {
2188
2390
  --tw-text-opacity: 1;
2189
- color: rgba(var(--sq-fairly-dark-gray), var(--tw-text-opacity));
2391
+ color: rgb(var(--sq-fairly-dark-gray));
2190
2392
  }
2191
2393
 
2192
2394
  .tw-group:hover .group-hover\:tw-inline-block {
@@ -2199,52 +2401,72 @@ video {
2199
2401
 
2200
2402
  .tw-dark .dark\:tw-border-sq-dark-disabled-gray {
2201
2403
  --tw-border-opacity: 1;
2202
- border-color: rgba(var(--sq-dark-disabled-gray), var(--tw-border-opacity));
2404
+ border-color: rgb(var(--sq-dark-disabled-gray));
2203
2405
  }
2204
2406
 
2205
2407
  .tw-dark .dark\:tw-border-sq-dark-text {
2206
2408
  --tw-border-opacity: 1;
2207
- border-color: rgba(var(--sq-dark-text), var(--tw-border-opacity));
2409
+ border-color: rgb(var(--sq-dark-text));
2208
2410
  }
2209
2411
 
2210
2412
  .tw-dark .dark\:tw-bg-sq-color-dark {
2211
2413
  --tw-bg-opacity: 1;
2212
- background-color: rgba(var(--sq-color-dark), var(--tw-bg-opacity));
2414
+ background-color: rgb(var(--sq-color-dark));
2415
+ }
2416
+
2417
+ .tw-dark .dark\:tw-bg-sq-colored-hover-dark {
2418
+ --tw-bg-opacity: 1;
2419
+ background-color: rgb(var(--sq-colored-hover-dark));
2213
2420
  }
2214
2421
 
2215
2422
  .tw-dark .dark\:tw-bg-sq-dark-background {
2216
2423
  --tw-bg-opacity: 1;
2217
- background-color: rgba(var(--sq-dark-background), var(--tw-bg-opacity));
2424
+ background-color: rgb(var(--sq-dark-background));
2425
+ }
2426
+
2427
+ .tw-dark .dark\:tw-bg-sq-dark-disabled-gray {
2428
+ --tw-bg-opacity: 1;
2429
+ background-color: rgb(var(--sq-dark-disabled-gray));
2218
2430
  }
2219
2431
 
2220
2432
  .tw-dark .dark\:tw-bg-sq-icon-dark {
2221
2433
  --tw-bg-opacity: 1;
2222
- background-color: rgba(var(--sq-icon-dark), var(--tw-bg-opacity));
2434
+ background-color: rgb(var(--sq-icon-dark));
2435
+ }
2436
+
2437
+ .tw-dark .dark\:tw-bg-sq-multi-gray-dark {
2438
+ --tw-bg-opacity: 1;
2439
+ background-color: rgb(var(--sq-multi-gray-dark));
2223
2440
  }
2224
2441
 
2225
2442
  .tw-dark .dark\:tw-text-sq-color-dark-dark {
2226
2443
  --tw-text-opacity: 1;
2227
- color: rgba(var(--sq-color-dark-dark), var(--tw-text-opacity));
2444
+ color: rgb(var(--sq-color-dark-dark));
2228
2445
  }
2229
2446
 
2230
2447
  .tw-dark .dark\:tw-text-sq-dark-disabled-gray {
2231
2448
  --tw-text-opacity: 1;
2232
- color: rgba(var(--sq-dark-disabled-gray), var(--tw-text-opacity));
2449
+ color: rgb(var(--sq-dark-disabled-gray));
2233
2450
  }
2234
2451
 
2235
2452
  .tw-dark .dark\:tw-text-sq-dark-text {
2236
2453
  --tw-text-opacity: 1;
2237
- color: rgba(var(--sq-dark-text), var(--tw-text-opacity));
2454
+ color: rgb(var(--sq-dark-text));
2455
+ }
2456
+
2457
+ .tw-dark .dark\:tw-text-sq-dark-text-lighter {
2458
+ --tw-text-opacity: 1;
2459
+ color: rgba(var(--sq-dark-text), 0.3);
2238
2460
  }
2239
2461
 
2240
2462
  .tw-dark .dark\:tw-text-sq-fairly-dark-gray {
2241
2463
  --tw-text-opacity: 1;
2242
- color: rgba(var(--sq-fairly-dark-gray), var(--tw-text-opacity));
2464
+ color: rgb(var(--sq-fairly-dark-gray));
2243
2465
  }
2244
2466
 
2245
2467
  .tw-dark .dark\:tw-text-sq-link-dark {
2246
2468
  --tw-text-opacity: 1;
2247
- color: rgba(var(--sq-link-dark), var(--tw-text-opacity));
2469
+ color: rgb(var(--sq-link-dark));
2248
2470
  }
2249
2471
 
2250
2472
  .tw-dark .dark\:tw-text-white {
@@ -2252,53 +2474,88 @@ video {
2252
2474
  color: rgb(255 255 255 / var(--tw-text-opacity));
2253
2475
  }
2254
2476
 
2477
+ .tw-dark .dark\:tw-placeholder-sq-dark-text-lighter::-moz-placeholder {
2478
+ --tw-placeholder-opacity: 1;
2479
+ color: rgba(var(--sq-dark-text), 0.3);
2480
+ }
2481
+
2482
+ .tw-dark .dark\:tw-placeholder-sq-dark-text-lighter::placeholder {
2483
+ --tw-placeholder-opacity: 1;
2484
+ color: rgba(var(--sq-dark-text), 0.3);
2485
+ }
2486
+
2255
2487
  .tw-dark .dark\:checked\:tw-bg-sq-dark-text:checked {
2256
2488
  --tw-bg-opacity: 1;
2257
- background-color: rgba(var(--sq-dark-text), var(--tw-bg-opacity));
2489
+ background-color: rgb(var(--sq-dark-text));
2490
+ }
2491
+
2492
+ .tw-dark .dark\:hover\:tw-border-sq-color-dark-dark:hover {
2493
+ --tw-border-opacity: 1;
2494
+ border-color: rgb(var(--sq-color-dark-dark));
2258
2495
  }
2259
2496
 
2260
2497
  .tw-dark .dark\:hover\:tw-bg-sq-color-highlight:hover {
2261
2498
  --tw-bg-opacity: 1;
2262
- background-color: rgba(var(--sq-color-highlight), var(--tw-bg-opacity));
2499
+ background-color: rgb(var(--sq-color-highlight));
2500
+ }
2501
+
2502
+ .tw-dark .dark\:hover\:tw-bg-sq-gray-highlight-dark:hover {
2503
+ --tw-bg-opacity: 1;
2504
+ background-color: rgb(var(--sq-gray-highlight-dark));
2263
2505
  }
2264
2506
 
2265
2507
  .tw-dark .dark\:hover\:tw-bg-sq-highlight-color-dark:hover {
2266
2508
  --tw-bg-opacity: 1;
2267
- background-color: rgba(var(--sq-highlight-color-dark), var(--tw-bg-opacity));
2509
+ background-color: rgb(var(--sq-highlight-color-dark));
2268
2510
  }
2269
2511
 
2270
2512
  .tw-dark .dark\:hover\:tw-bg-sq-link-dark:hover {
2271
2513
  --tw-bg-opacity: 1;
2272
- background-color: rgba(var(--sq-link-dark), var(--tw-bg-opacity));
2514
+ background-color: rgb(var(--sq-link-dark));
2515
+ }
2516
+
2517
+ .tw-dark .dark\:hover\:tw-text-sq-color-dark-dark:hover {
2518
+ --tw-text-opacity: 1;
2519
+ color: rgb(var(--sq-color-dark-dark));
2273
2520
  }
2274
2521
 
2275
2522
  .tw-dark .dark\:focus\:tw-border-sq-color-dark:focus {
2276
2523
  --tw-border-opacity: 1;
2277
- border-color: rgba(var(--sq-color-dark), var(--tw-border-opacity));
2524
+ border-color: rgb(var(--sq-color-dark));
2278
2525
  }
2279
2526
 
2280
2527
  .tw-dark .dark\:focus\:tw-border-sq-color-dark-dark:focus {
2281
2528
  --tw-border-opacity: 1;
2282
- border-color: rgba(var(--sq-color-dark-dark), var(--tw-border-opacity));
2529
+ border-color: rgb(var(--sq-color-dark-dark));
2283
2530
  }
2284
2531
 
2285
2532
  .tw-dark .dark\:focus\:tw-bg-sq-dark-gray:focus {
2286
2533
  --tw-bg-opacity: 1;
2287
- background-color: rgba(var(--sq-dark-gray), var(--tw-bg-opacity));
2534
+ background-color: rgb(var(--sq-dark-gray));
2535
+ }
2536
+
2537
+ .tw-dark .dark\:focus\:tw-text-sq-color-dark-dark:focus {
2538
+ --tw-text-opacity: 1;
2539
+ color: rgb(var(--sq-color-dark-dark));
2288
2540
  }
2289
2541
 
2290
2542
  .tw-dark .dark\:active\:tw-border-sq-color-dark:active {
2291
2543
  --tw-border-opacity: 1;
2292
- border-color: rgba(var(--sq-color-dark), var(--tw-border-opacity));
2544
+ border-color: rgb(var(--sq-color-dark));
2293
2545
  }
2294
2546
 
2295
2547
  .tw-dark .dark\:active\:tw-border-sq-color-dark-dark:active {
2296
2548
  --tw-border-opacity: 1;
2297
- border-color: rgba(var(--sq-color-dark-dark), var(--tw-border-opacity));
2549
+ border-color: rgb(var(--sq-color-dark-dark));
2298
2550
  }
2299
2551
 
2300
2552
  .tw-dark .dark\:active\:tw-bg-sq-dark-gray:active {
2301
2553
  --tw-bg-opacity: 1;
2302
- background-color: rgba(var(--sq-dark-gray), var(--tw-bg-opacity));
2554
+ background-color: rgb(var(--sq-dark-gray));
2555
+ }
2556
+
2557
+ .tw-dark .dark\:active\:tw-text-sq-color-dark-dark:active {
2558
+ --tw-text-opacity: 1;
2559
+ color: rgb(var(--sq-color-dark-dark));
2303
2560
  }
2304
2561
 
@@ -0,0 +1 @@
1
+ export type InputGroupPlacement = 'left' | 'right' | undefined;
package/package.json CHANGED
@@ -1,9 +1,10 @@
1
1
  {
2
2
  "name": "@seeqdev/qomponents",
3
- "version": "0.0.6",
3
+ "version": "0.0.8",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.esm.js",
6
- "types": "dist/index.d.ts",
6
+ "types": "dist/index.js",
7
+ "skip-lib-check": true,
7
8
  "files": [
8
9
  "dist"
9
10
  ],
@@ -41,7 +42,7 @@
41
42
  "@testing-library/react": "14.0.0",
42
43
  "@testing-library/user-event": "14.4.3",
43
44
  "@types/jest": "29.4.0",
44
- "@types/react": "18.0.28",
45
+ "@types/react": "18.0.27",
45
46
  "@types/react-dom": "18.0.11",
46
47
  "autoprefixer": "10.4.13",
47
48
  "color": "4.2.3",
@@ -51,7 +52,7 @@
51
52
  "jest-environment-jsdom": "29.4.3",
52
53
  "jest-junit": "15.0.0",
53
54
  "jest-silent-reporter": "0.5.0",
54
- "postcss-import": "^15.1.0",
55
+ "postcss-import": "15.1.0",
55
56
  "react": "18.2.0",
56
57
  "react-dom": "18.2.0",
57
58
  "rollup": "3.17.2",
@@ -66,6 +67,7 @@
66
67
  "typescript-strict-plugin": "2.1.0"
67
68
  },
68
69
  "dependencies": {
69
- "postcss": "8.4.21"
70
+ "postcss": "8.4.21",
71
+ "react-select": "5.7.3"
70
72
  }
71
73
  }