@trackunit/react-form-components 0.0.285 → 0.0.287
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/index.cjs.js +17 -19
- package/index.esm.js +17 -19
- package/package.json +1 -1
package/index.cjs.js
CHANGED
|
@@ -188,8 +188,7 @@ const cvaInputBase = cssClassVarianceUtilities.cvaMerge([
|
|
|
188
188
|
"component-baseInput-background",
|
|
189
189
|
"border-slate-300",
|
|
190
190
|
"focus-within:ring-2",
|
|
191
|
-
"focus-within:ring-
|
|
192
|
-
"focus-within:ring-offset-white",
|
|
191
|
+
"focus-within:ring-inset",
|
|
193
192
|
"focus-within:ring-primary-500",
|
|
194
193
|
"focus-within:border-slate-400",
|
|
195
194
|
"hover:border-slate-400",
|
|
@@ -351,14 +350,14 @@ const cvaCheckbox = cssClassVarianceUtilities.cvaMerge([
|
|
|
351
350
|
"outline-0",
|
|
352
351
|
"active:bg-slate-200",
|
|
353
352
|
"active:ring-2",
|
|
354
|
-
"active:ring-
|
|
353
|
+
"active:ring-inset",
|
|
355
354
|
"active:ring-blue-700",
|
|
356
355
|
"focus:ring-2",
|
|
357
|
-
"focus:ring-
|
|
356
|
+
"focus:ring-inset",
|
|
358
357
|
"focus:ring-blue-700",
|
|
359
358
|
"cursor-pointer",
|
|
360
359
|
"group-active:ring-2",
|
|
361
|
-
"group-active:ring-
|
|
360
|
+
"group-active:ring-inset",
|
|
362
361
|
"group-active:ring-blue-700",
|
|
363
362
|
], {
|
|
364
363
|
variants: {
|
|
@@ -368,7 +367,7 @@ const cvaCheckbox = cssClassVarianceUtilities.cvaMerge([
|
|
|
368
367
|
"active:ring-red-700",
|
|
369
368
|
"focus:ring-red-700",
|
|
370
369
|
"group-focus:ring-2",
|
|
371
|
-
"group-focus:ring-
|
|
370
|
+
"group-focus:ring-inset",
|
|
372
371
|
],
|
|
373
372
|
false: "",
|
|
374
373
|
},
|
|
@@ -412,9 +411,9 @@ const cvaCheckbox = cssClassVarianceUtilities.cvaMerge([
|
|
|
412
411
|
"focus:bg-slate-300",
|
|
413
412
|
"active:bg-slate-300",
|
|
414
413
|
"focus:ring-0",
|
|
415
|
-
"focus:ring-
|
|
414
|
+
"focus:ring-inset",
|
|
416
415
|
"group-active:ring-0",
|
|
417
|
-
"group-active:ring-
|
|
416
|
+
"group-active:ring-inset",
|
|
418
417
|
],
|
|
419
418
|
false: "",
|
|
420
419
|
},
|
|
@@ -436,7 +435,7 @@ const cvaCheckbox = cssClassVarianceUtilities.cvaMerge([
|
|
|
436
435
|
"group-active:border-red-700",
|
|
437
436
|
"group-active:ring-red-700",
|
|
438
437
|
"group-active:ring-2",
|
|
439
|
-
"group-active:ring-
|
|
438
|
+
"group-active:ring-inset",
|
|
440
439
|
],
|
|
441
440
|
},
|
|
442
441
|
],
|
|
@@ -880,8 +879,7 @@ const cvaSelect = cssClassVarianceUtilities.cvaMerge([
|
|
|
880
879
|
"border",
|
|
881
880
|
"border-slate-300",
|
|
882
881
|
"focus-within:ring-2",
|
|
883
|
-
"focus-within:ring-
|
|
884
|
-
"focus-within:ring-offset-white",
|
|
882
|
+
"focus-within:ring-inset",
|
|
885
883
|
"focus-within:ring-primary-600",
|
|
886
884
|
"focus-within:border-slate-400",
|
|
887
885
|
"hover:border-slate-400",
|
|
@@ -1193,7 +1191,7 @@ const useCustomStyles = (refContainer, refPrefix, maxSelectedDisplayCount, style
|
|
|
1193
1191
|
width: "0px",
|
|
1194
1192
|
}), menu: base => {
|
|
1195
1193
|
return Object.assign(Object.assign({}, base), { width: "100%", marginTop: "4px", marginBottom: "18px", transition: "all 1s ease-in-out" });
|
|
1196
|
-
}, input: base => (Object.assign(Object.assign({}, base), { marginLeft: "0px" })), placeholder: base => (Object.assign({}, base)), option: () => ({}), menuPortal: base => (Object.assign(Object.assign({}, base), { width: (refContainer === null || refContainer === void 0 ? void 0 : refContainer.current) ? `${refContainer.current.clientWidth}px` : base.width, transform: (refPrefix === null || refPrefix === void 0 ? void 0 : refPrefix.current) ? `translate(-${refPrefix.current.clientWidth + 2}px)` : "translate(-2px)", backgroundColor: "#ffffff", borderRadius: "var(--border-radius-lg)", zIndex: 20, borderColor: "rgb(var(--color-slate-300))", boxShadow: "var(--tw-ring-
|
|
1194
|
+
}, input: base => (Object.assign(Object.assign({}, base), { marginLeft: "0px" })), placeholder: base => (Object.assign({}, base)), option: () => ({}), menuPortal: base => (Object.assign(Object.assign({}, base), { width: (refContainer === null || refContainer === void 0 ? void 0 : refContainer.current) ? `${refContainer.current.clientWidth}px` : base.width, transform: (refPrefix === null || refPrefix === void 0 ? void 0 : refPrefix.current) ? `translate(-${refPrefix.current.clientWidth + 2}px)` : "translate(-2px)", backgroundColor: "#ffffff", borderRadius: "var(--border-radius-lg)", zIndex: 20, borderColor: "rgb(var(--color-slate-300))", boxShadow: "var(--tw-ring-inset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)" })), menuList: base => {
|
|
1197
1195
|
return Object.assign(Object.assign({}, base), { position: "relative", padding: "var(--spacing-1)", display: "grid", gap: "var(--spacing-1)", width: "100%", borderRadius: "0px", boxShadow: "none", paddingTop: "0px" });
|
|
1198
1196
|
}, valueContainer: base => {
|
|
1199
1197
|
return Object.assign(Object.assign({}, base), { flexWrap: maxSelectedDisplayCount !== undefined ? "wrap" : "nowrap", gap: "0.25rem" });
|
|
@@ -1639,7 +1637,7 @@ const cvaRadioItem = cssClassVarianceUtilities.cvaMerge([
|
|
|
1639
1637
|
"hover:cursor-pointer",
|
|
1640
1638
|
"hover:bg-slate-100",
|
|
1641
1639
|
"focus:ring-2",
|
|
1642
|
-
"focus:ring-
|
|
1640
|
+
"focus:ring-inset",
|
|
1643
1641
|
"focus:ring-blue-700",
|
|
1644
1642
|
], {
|
|
1645
1643
|
variants: {
|
|
@@ -1654,14 +1652,14 @@ const cvaRadioItem = cssClassVarianceUtilities.cvaMerge([
|
|
|
1654
1652
|
"outline-0",
|
|
1655
1653
|
"active:bg-slate-200",
|
|
1656
1654
|
"active:ring-2",
|
|
1657
|
-
"active:ring-
|
|
1655
|
+
"active:ring-inset",
|
|
1658
1656
|
"active:ring-blue-700",
|
|
1659
1657
|
"focus:bg-slate-200",
|
|
1660
1658
|
"focus:ring-2",
|
|
1661
|
-
"focus:ring-
|
|
1659
|
+
"focus:ring-inset",
|
|
1662
1660
|
"focus:ring-blue-700",
|
|
1663
1661
|
"group-active:ring-2",
|
|
1664
|
-
"group-active:ring-
|
|
1662
|
+
"group-active:ring-inset",
|
|
1665
1663
|
"group-active:ring-blue-700",
|
|
1666
1664
|
],
|
|
1667
1665
|
false: "",
|
|
@@ -1672,7 +1670,7 @@ const cvaRadioItem = cssClassVarianceUtilities.cvaMerge([
|
|
|
1672
1670
|
"active:ring-red-700",
|
|
1673
1671
|
"focus:ring-red-700",
|
|
1674
1672
|
"group-focus:ring-2",
|
|
1675
|
-
"group-focus:ring-
|
|
1673
|
+
"group-focus:ring-inset",
|
|
1676
1674
|
],
|
|
1677
1675
|
false: "",
|
|
1678
1676
|
},
|
|
@@ -1687,9 +1685,9 @@ const cvaRadioItem = cssClassVarianceUtilities.cvaMerge([
|
|
|
1687
1685
|
"focus:bg-slate-400",
|
|
1688
1686
|
"active:bg-slate-400",
|
|
1689
1687
|
"focus:ring-0",
|
|
1690
|
-
"focus:ring-
|
|
1688
|
+
"focus:ring-inset",
|
|
1691
1689
|
"group-active:ring-0",
|
|
1692
|
-
"group-active:ring-
|
|
1690
|
+
"group-active:ring-inset",
|
|
1693
1691
|
],
|
|
1694
1692
|
false: "",
|
|
1695
1693
|
},
|
package/index.esm.js
CHANGED
|
@@ -158,8 +158,7 @@ const cvaInputBase = cvaMerge([
|
|
|
158
158
|
"component-baseInput-background",
|
|
159
159
|
"border-slate-300",
|
|
160
160
|
"focus-within:ring-2",
|
|
161
|
-
"focus-within:ring-
|
|
162
|
-
"focus-within:ring-offset-white",
|
|
161
|
+
"focus-within:ring-inset",
|
|
163
162
|
"focus-within:ring-primary-500",
|
|
164
163
|
"focus-within:border-slate-400",
|
|
165
164
|
"hover:border-slate-400",
|
|
@@ -321,14 +320,14 @@ const cvaCheckbox = cvaMerge([
|
|
|
321
320
|
"outline-0",
|
|
322
321
|
"active:bg-slate-200",
|
|
323
322
|
"active:ring-2",
|
|
324
|
-
"active:ring-
|
|
323
|
+
"active:ring-inset",
|
|
325
324
|
"active:ring-blue-700",
|
|
326
325
|
"focus:ring-2",
|
|
327
|
-
"focus:ring-
|
|
326
|
+
"focus:ring-inset",
|
|
328
327
|
"focus:ring-blue-700",
|
|
329
328
|
"cursor-pointer",
|
|
330
329
|
"group-active:ring-2",
|
|
331
|
-
"group-active:ring-
|
|
330
|
+
"group-active:ring-inset",
|
|
332
331
|
"group-active:ring-blue-700",
|
|
333
332
|
], {
|
|
334
333
|
variants: {
|
|
@@ -338,7 +337,7 @@ const cvaCheckbox = cvaMerge([
|
|
|
338
337
|
"active:ring-red-700",
|
|
339
338
|
"focus:ring-red-700",
|
|
340
339
|
"group-focus:ring-2",
|
|
341
|
-
"group-focus:ring-
|
|
340
|
+
"group-focus:ring-inset",
|
|
342
341
|
],
|
|
343
342
|
false: "",
|
|
344
343
|
},
|
|
@@ -382,9 +381,9 @@ const cvaCheckbox = cvaMerge([
|
|
|
382
381
|
"focus:bg-slate-300",
|
|
383
382
|
"active:bg-slate-300",
|
|
384
383
|
"focus:ring-0",
|
|
385
|
-
"focus:ring-
|
|
384
|
+
"focus:ring-inset",
|
|
386
385
|
"group-active:ring-0",
|
|
387
|
-
"group-active:ring-
|
|
386
|
+
"group-active:ring-inset",
|
|
388
387
|
],
|
|
389
388
|
false: "",
|
|
390
389
|
},
|
|
@@ -406,7 +405,7 @@ const cvaCheckbox = cvaMerge([
|
|
|
406
405
|
"group-active:border-red-700",
|
|
407
406
|
"group-active:ring-red-700",
|
|
408
407
|
"group-active:ring-2",
|
|
409
|
-
"group-active:ring-
|
|
408
|
+
"group-active:ring-inset",
|
|
410
409
|
],
|
|
411
410
|
},
|
|
412
411
|
],
|
|
@@ -850,8 +849,7 @@ const cvaSelect = cvaMerge([
|
|
|
850
849
|
"border",
|
|
851
850
|
"border-slate-300",
|
|
852
851
|
"focus-within:ring-2",
|
|
853
|
-
"focus-within:ring-
|
|
854
|
-
"focus-within:ring-offset-white",
|
|
852
|
+
"focus-within:ring-inset",
|
|
855
853
|
"focus-within:ring-primary-600",
|
|
856
854
|
"focus-within:border-slate-400",
|
|
857
855
|
"hover:border-slate-400",
|
|
@@ -1163,7 +1161,7 @@ const useCustomStyles = (refContainer, refPrefix, maxSelectedDisplayCount, style
|
|
|
1163
1161
|
width: "0px",
|
|
1164
1162
|
}), menu: base => {
|
|
1165
1163
|
return Object.assign(Object.assign({}, base), { width: "100%", marginTop: "4px", marginBottom: "18px", transition: "all 1s ease-in-out" });
|
|
1166
|
-
}, input: base => (Object.assign(Object.assign({}, base), { marginLeft: "0px" })), placeholder: base => (Object.assign({}, base)), option: () => ({}), menuPortal: base => (Object.assign(Object.assign({}, base), { width: (refContainer === null || refContainer === void 0 ? void 0 : refContainer.current) ? `${refContainer.current.clientWidth}px` : base.width, transform: (refPrefix === null || refPrefix === void 0 ? void 0 : refPrefix.current) ? `translate(-${refPrefix.current.clientWidth + 2}px)` : "translate(-2px)", backgroundColor: "#ffffff", borderRadius: "var(--border-radius-lg)", zIndex: 20, borderColor: "rgb(var(--color-slate-300))", boxShadow: "var(--tw-ring-
|
|
1164
|
+
}, input: base => (Object.assign(Object.assign({}, base), { marginLeft: "0px" })), placeholder: base => (Object.assign({}, base)), option: () => ({}), menuPortal: base => (Object.assign(Object.assign({}, base), { width: (refContainer === null || refContainer === void 0 ? void 0 : refContainer.current) ? `${refContainer.current.clientWidth}px` : base.width, transform: (refPrefix === null || refPrefix === void 0 ? void 0 : refPrefix.current) ? `translate(-${refPrefix.current.clientWidth + 2}px)` : "translate(-2px)", backgroundColor: "#ffffff", borderRadius: "var(--border-radius-lg)", zIndex: 20, borderColor: "rgb(var(--color-slate-300))", boxShadow: "var(--tw-ring-inset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)" })), menuList: base => {
|
|
1167
1165
|
return Object.assign(Object.assign({}, base), { position: "relative", padding: "var(--spacing-1)", display: "grid", gap: "var(--spacing-1)", width: "100%", borderRadius: "0px", boxShadow: "none", paddingTop: "0px" });
|
|
1168
1166
|
}, valueContainer: base => {
|
|
1169
1167
|
return Object.assign(Object.assign({}, base), { flexWrap: maxSelectedDisplayCount !== undefined ? "wrap" : "nowrap", gap: "0.25rem" });
|
|
@@ -1609,7 +1607,7 @@ const cvaRadioItem = cvaMerge([
|
|
|
1609
1607
|
"hover:cursor-pointer",
|
|
1610
1608
|
"hover:bg-slate-100",
|
|
1611
1609
|
"focus:ring-2",
|
|
1612
|
-
"focus:ring-
|
|
1610
|
+
"focus:ring-inset",
|
|
1613
1611
|
"focus:ring-blue-700",
|
|
1614
1612
|
], {
|
|
1615
1613
|
variants: {
|
|
@@ -1624,14 +1622,14 @@ const cvaRadioItem = cvaMerge([
|
|
|
1624
1622
|
"outline-0",
|
|
1625
1623
|
"active:bg-slate-200",
|
|
1626
1624
|
"active:ring-2",
|
|
1627
|
-
"active:ring-
|
|
1625
|
+
"active:ring-inset",
|
|
1628
1626
|
"active:ring-blue-700",
|
|
1629
1627
|
"focus:bg-slate-200",
|
|
1630
1628
|
"focus:ring-2",
|
|
1631
|
-
"focus:ring-
|
|
1629
|
+
"focus:ring-inset",
|
|
1632
1630
|
"focus:ring-blue-700",
|
|
1633
1631
|
"group-active:ring-2",
|
|
1634
|
-
"group-active:ring-
|
|
1632
|
+
"group-active:ring-inset",
|
|
1635
1633
|
"group-active:ring-blue-700",
|
|
1636
1634
|
],
|
|
1637
1635
|
false: "",
|
|
@@ -1642,7 +1640,7 @@ const cvaRadioItem = cvaMerge([
|
|
|
1642
1640
|
"active:ring-red-700",
|
|
1643
1641
|
"focus:ring-red-700",
|
|
1644
1642
|
"group-focus:ring-2",
|
|
1645
|
-
"group-focus:ring-
|
|
1643
|
+
"group-focus:ring-inset",
|
|
1646
1644
|
],
|
|
1647
1645
|
false: "",
|
|
1648
1646
|
},
|
|
@@ -1657,9 +1655,9 @@ const cvaRadioItem = cvaMerge([
|
|
|
1657
1655
|
"focus:bg-slate-400",
|
|
1658
1656
|
"active:bg-slate-400",
|
|
1659
1657
|
"focus:ring-0",
|
|
1660
|
-
"focus:ring-
|
|
1658
|
+
"focus:ring-inset",
|
|
1661
1659
|
"group-active:ring-0",
|
|
1662
|
-
"group-active:ring-
|
|
1660
|
+
"group-active:ring-inset",
|
|
1663
1661
|
],
|
|
1664
1662
|
false: "",
|
|
1665
1663
|
},
|