@clickpalm/react 1.0.0 → 1.1.0
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/index.d.ts +23 -11
- package/dist/index.js +416 -171
- package/dist/index.mjs +390 -147
- package/package.json +6 -3
package/dist/index.mjs
CHANGED
|
@@ -625,6 +625,32 @@ var Check = (props) => {
|
|
|
625
625
|
);
|
|
626
626
|
};
|
|
627
627
|
|
|
628
|
+
// src/components/Icon/Svgs/Copy.tsx
|
|
629
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
630
|
+
var Copy = (props) => {
|
|
631
|
+
return /* @__PURE__ */ jsx15(
|
|
632
|
+
"svg",
|
|
633
|
+
{
|
|
634
|
+
width: "18",
|
|
635
|
+
height: "19",
|
|
636
|
+
viewBox: "0 0 18 19",
|
|
637
|
+
fill: "none",
|
|
638
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
639
|
+
...props,
|
|
640
|
+
children: /* @__PURE__ */ jsx15(
|
|
641
|
+
"path",
|
|
642
|
+
{
|
|
643
|
+
d: "M3.4 11.9547H2.6C2.17565 11.9547 1.76869 11.7861 1.46863 11.4861C1.16857 11.186 1 10.779 1 10.3547V3.15469C1 2.73034 1.16857 2.32337 1.46863 2.02332C1.76869 1.72326 2.17565 1.55469 2.6 1.55469H9.8C10.2243 1.55469 10.6313 1.72326 10.9314 2.02332C11.2314 2.32337 11.4 2.73034 11.4 3.15469V3.95469M8.2 7.15469H15.4C16.2837 7.15469 17 7.87103 17 8.75469V15.9547C17 16.8383 16.2837 17.5547 15.4 17.5547H8.2C7.31634 17.5547 6.6 16.8383 6.6 15.9547V8.75469C6.6 7.87103 7.31634 7.15469 8.2 7.15469Z",
|
|
644
|
+
stroke: "currentColor",
|
|
645
|
+
"stroke-width": "2",
|
|
646
|
+
"stroke-linecap": "round",
|
|
647
|
+
"stroke-linejoin": "round"
|
|
648
|
+
}
|
|
649
|
+
)
|
|
650
|
+
}
|
|
651
|
+
);
|
|
652
|
+
};
|
|
653
|
+
|
|
628
654
|
// src/components/Icon/icons.ts
|
|
629
655
|
var iconMap = {
|
|
630
656
|
TriangleDown,
|
|
@@ -644,12 +670,13 @@ var iconMap = {
|
|
|
644
670
|
Search,
|
|
645
671
|
ChevronLeft,
|
|
646
672
|
ChevronRight,
|
|
647
|
-
Check
|
|
673
|
+
Check,
|
|
674
|
+
Copy
|
|
648
675
|
};
|
|
649
676
|
|
|
650
677
|
// src/components/Icon/index.tsx
|
|
651
678
|
import { useMemo } from "react";
|
|
652
|
-
import { jsx as
|
|
679
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
653
680
|
var colorMap = {
|
|
654
681
|
black: "#000000",
|
|
655
682
|
green: "#78CB63",
|
|
@@ -662,7 +689,7 @@ function Icon({ name, size = 24, color = "black", ...rest }) {
|
|
|
662
689
|
return null;
|
|
663
690
|
}
|
|
664
691
|
const fillColor = useMemo(() => colorMap[color], [color]);
|
|
665
|
-
return /* @__PURE__ */
|
|
692
|
+
return /* @__PURE__ */ jsx16(
|
|
666
693
|
IconComponent,
|
|
667
694
|
{
|
|
668
695
|
width: size,
|
|
@@ -869,7 +896,7 @@ var StyledLabel = styled("label", {
|
|
|
869
896
|
});
|
|
870
897
|
|
|
871
898
|
// src/components/Calendar/index.tsx
|
|
872
|
-
import { jsx as
|
|
899
|
+
import { jsx as jsx17, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
873
900
|
calendarStyles();
|
|
874
901
|
var Calendar2 = ({ label, onChange }) => {
|
|
875
902
|
const [selected, setSelected] = useState(void 0);
|
|
@@ -888,8 +915,8 @@ var Calendar2 = ({ label, onChange }) => {
|
|
|
888
915
|
}
|
|
889
916
|
}, [selected]);
|
|
890
917
|
return /* @__PURE__ */ jsxs2("div", { children: [
|
|
891
|
-
/* @__PURE__ */
|
|
892
|
-
/* @__PURE__ */
|
|
918
|
+
/* @__PURE__ */ jsx17(StyledLabel, { children: label }),
|
|
919
|
+
/* @__PURE__ */ jsx17(
|
|
893
920
|
DayPicker,
|
|
894
921
|
{
|
|
895
922
|
className: !open ? "calendar-root-collapsed" : "",
|
|
@@ -920,20 +947,20 @@ var Calendar2 = ({ label, onChange }) => {
|
|
|
920
947
|
MonthCaption: ({ calendarMonth, displayIndex, ...safeprops }) => {
|
|
921
948
|
const displayMonth = calendarMonth.date;
|
|
922
949
|
return /* @__PURE__ */ jsxs2("div", { ...safeprops, children: [
|
|
923
|
-
/* @__PURE__ */
|
|
950
|
+
/* @__PURE__ */ jsx17("div", { children: /* @__PURE__ */ jsx17(
|
|
924
951
|
Button,
|
|
925
952
|
{
|
|
926
953
|
variant: "secondary",
|
|
927
954
|
size: "sm",
|
|
928
955
|
onClick: () => setOpen(!open),
|
|
929
|
-
children: /* @__PURE__ */
|
|
956
|
+
children: /* @__PURE__ */ jsx17(StyledButton2, { isOpen: open, children: /* @__PURE__ */ jsx17(Icon, { name: "TriangleUp", size: 16 }) })
|
|
930
957
|
}
|
|
931
958
|
) }),
|
|
932
|
-
/* @__PURE__ */
|
|
959
|
+
/* @__PURE__ */ jsx17("div", { className: "calendar-month_caption", children: /* @__PURE__ */ jsx17("div", { className: "calendar-caption_label", role: "heading", "aria-level": 2, children: format(displayMonth, "MMMM 'de' yyyy", { locale: ptBR }).replace(/^./, (c) => c.toUpperCase()) }) })
|
|
933
960
|
] });
|
|
934
961
|
},
|
|
935
|
-
PreviousMonthButton: (props) => /* @__PURE__ */
|
|
936
|
-
NextMonthButton: (props) => /* @__PURE__ */
|
|
962
|
+
PreviousMonthButton: (props) => /* @__PURE__ */ jsx17(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx17(Icon, { name: "TriangleLeft", size: 16 }) }),
|
|
963
|
+
NextMonthButton: (props) => /* @__PURE__ */ jsx17(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx17(Icon, { name: "TriangleRight", size: 16 }) })
|
|
937
964
|
}
|
|
938
965
|
}
|
|
939
966
|
)
|
|
@@ -1053,23 +1080,23 @@ var Span = styled("span", {
|
|
|
1053
1080
|
});
|
|
1054
1081
|
|
|
1055
1082
|
// src/components/Checkbox/index.tsx
|
|
1056
|
-
import { jsx as
|
|
1083
|
+
import { jsx as jsx18, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
1057
1084
|
function Checkbox2({ label, checked, onCheckedChange, errorMessage, ...rest }) {
|
|
1058
1085
|
return /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
|
|
1059
1086
|
/* @__PURE__ */ jsxs3(StyledWrapper, { hasError: !!errorMessage, children: [
|
|
1060
|
-
/* @__PURE__ */
|
|
1087
|
+
/* @__PURE__ */ jsx18(
|
|
1061
1088
|
CheckboxContainer,
|
|
1062
1089
|
{
|
|
1063
1090
|
checked,
|
|
1064
1091
|
onCheckedChange,
|
|
1065
1092
|
hasError: !!errorMessage,
|
|
1066
1093
|
...rest,
|
|
1067
|
-
children: /* @__PURE__ */
|
|
1094
|
+
children: /* @__PURE__ */ jsx18(CheckboxIndicator, { asChild: true, children: /* @__PURE__ */ jsx18(Icon, { name: "Check", size: 16 }) })
|
|
1068
1095
|
}
|
|
1069
1096
|
),
|
|
1070
|
-
/* @__PURE__ */
|
|
1097
|
+
/* @__PURE__ */ jsx18(CheckboxLabel, { children: label })
|
|
1071
1098
|
] }),
|
|
1072
|
-
errorMessage && /* @__PURE__ */
|
|
1099
|
+
errorMessage && /* @__PURE__ */ jsx18(Span, { children: errorMessage })
|
|
1073
1100
|
] });
|
|
1074
1101
|
}
|
|
1075
1102
|
Checkbox2.displayName = "Checkbox";
|
|
@@ -1179,7 +1206,7 @@ var Span2 = styled("span", {
|
|
|
1179
1206
|
});
|
|
1180
1207
|
|
|
1181
1208
|
// src/components/Input/index.tsx
|
|
1182
|
-
import { jsx as
|
|
1209
|
+
import { jsx as jsx19, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
1183
1210
|
var Input2 = forwardRef2(
|
|
1184
1211
|
({ prefix, suffix, label, errorMessage, noMargin = false, ...props }, forwardedRef) => {
|
|
1185
1212
|
const localInputRef = useRef2(null);
|
|
@@ -1194,7 +1221,7 @@ var Input2 = forwardRef2(
|
|
|
1194
1221
|
return type?.displayName === "Button";
|
|
1195
1222
|
};
|
|
1196
1223
|
return /* @__PURE__ */ jsxs4(StyledWrapper2, { children: [
|
|
1197
|
-
label && /* @__PURE__ */
|
|
1224
|
+
label && /* @__PURE__ */ jsx19(Label, { children: label }),
|
|
1198
1225
|
/* @__PURE__ */ jsxs4(
|
|
1199
1226
|
TextInputContainer,
|
|
1200
1227
|
{
|
|
@@ -1203,13 +1230,13 @@ var Input2 = forwardRef2(
|
|
|
1203
1230
|
hasError: !!errorMessage,
|
|
1204
1231
|
onClick: handleContainerClick,
|
|
1205
1232
|
children: [
|
|
1206
|
-
!!prefix && /* @__PURE__ */
|
|
1207
|
-
/* @__PURE__ */
|
|
1208
|
-
!!suffix && /* @__PURE__ */
|
|
1233
|
+
!!prefix && /* @__PURE__ */ jsx19(Prefix, { children: prefix }),
|
|
1234
|
+
/* @__PURE__ */ jsx19(Input, { ref: inputRef, ...props }),
|
|
1235
|
+
!!suffix && /* @__PURE__ */ jsx19(Suffix, { children: suffix })
|
|
1209
1236
|
]
|
|
1210
1237
|
}
|
|
1211
1238
|
),
|
|
1212
|
-
errorMessage && /* @__PURE__ */
|
|
1239
|
+
errorMessage && /* @__PURE__ */ jsx19(Span2, { children: errorMessage })
|
|
1213
1240
|
] });
|
|
1214
1241
|
}
|
|
1215
1242
|
);
|
|
@@ -1277,7 +1304,7 @@ var datePickerStyles = globalCss({
|
|
|
1277
1304
|
});
|
|
1278
1305
|
|
|
1279
1306
|
// src/components/Datepicker/index.tsx
|
|
1280
|
-
import { jsx as
|
|
1307
|
+
import { jsx as jsx20, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
1281
1308
|
datePickerStyles();
|
|
1282
1309
|
var Datepicker = ({ label, value, onChange }) => {
|
|
1283
1310
|
const [selected, setSelected] = useState2(void 0);
|
|
@@ -1308,7 +1335,7 @@ var Datepicker = ({ label, value, onChange }) => {
|
|
|
1308
1335
|
}
|
|
1309
1336
|
}, [open, selected]);
|
|
1310
1337
|
return /* @__PURE__ */ jsxs5("div", { children: [
|
|
1311
|
-
/* @__PURE__ */
|
|
1338
|
+
/* @__PURE__ */ jsx20(
|
|
1312
1339
|
Input2,
|
|
1313
1340
|
{
|
|
1314
1341
|
ref: inputRef,
|
|
@@ -1318,10 +1345,10 @@ var Datepicker = ({ label, value, onChange }) => {
|
|
|
1318
1345
|
value: value || "",
|
|
1319
1346
|
noMargin: true,
|
|
1320
1347
|
readOnly: true,
|
|
1321
|
-
suffix: /* @__PURE__ */
|
|
1348
|
+
suffix: /* @__PURE__ */ jsx20(Icon, { name: "Calendar", size: 16 })
|
|
1322
1349
|
}
|
|
1323
1350
|
),
|
|
1324
|
-
open && /* @__PURE__ */
|
|
1351
|
+
open && /* @__PURE__ */ jsx20(
|
|
1325
1352
|
"div",
|
|
1326
1353
|
{
|
|
1327
1354
|
ref: calendarRef,
|
|
@@ -1333,7 +1360,7 @@ var Datepicker = ({ label, value, onChange }) => {
|
|
|
1333
1360
|
boxShadow: "0 2px 8px rgba(0,0,0,0.15)",
|
|
1334
1361
|
borderRadius: "8px"
|
|
1335
1362
|
},
|
|
1336
|
-
children: /* @__PURE__ */
|
|
1363
|
+
children: /* @__PURE__ */ jsx20(
|
|
1337
1364
|
DayPicker2,
|
|
1338
1365
|
{
|
|
1339
1366
|
mode: "single",
|
|
@@ -1355,8 +1382,8 @@ var Datepicker = ({ label, value, onChange }) => {
|
|
|
1355
1382
|
}
|
|
1356
1383
|
},
|
|
1357
1384
|
components: {
|
|
1358
|
-
PreviousMonthButton: (props) => /* @__PURE__ */
|
|
1359
|
-
NextMonthButton: (props) => /* @__PURE__ */
|
|
1385
|
+
PreviousMonthButton: (props) => /* @__PURE__ */ jsx20(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx20(Icon, { name: "TriangleLeft", size: 16 }) }),
|
|
1386
|
+
NextMonthButton: (props) => /* @__PURE__ */ jsx20(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx20(Icon, { name: "TriangleRight", size: 16 }) })
|
|
1360
1387
|
}
|
|
1361
1388
|
}
|
|
1362
1389
|
)
|
|
@@ -1438,16 +1465,16 @@ var StyledDivider = styled2("hr", {
|
|
|
1438
1465
|
});
|
|
1439
1466
|
|
|
1440
1467
|
// src/components/Modal/index.tsx
|
|
1441
|
-
import { jsx as
|
|
1468
|
+
import { jsx as jsx21, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
1442
1469
|
var Modal = ({ open, onOpenChange, title, children }) => {
|
|
1443
|
-
return /* @__PURE__ */
|
|
1444
|
-
/* @__PURE__ */
|
|
1470
|
+
return /* @__PURE__ */ jsx21(Dialog2.Root, { open, onOpenChange, children: /* @__PURE__ */ jsxs6(Dialog2.Portal, { children: [
|
|
1471
|
+
/* @__PURE__ */ jsx21(StyledOverlay, {}),
|
|
1445
1472
|
/* @__PURE__ */ jsxs6(StyledContent, { children: [
|
|
1446
1473
|
/* @__PURE__ */ jsxs6(Wrapper, { children: [
|
|
1447
|
-
/* @__PURE__ */
|
|
1448
|
-
/* @__PURE__ */
|
|
1474
|
+
/* @__PURE__ */ jsx21(StyledTitle, { children: title }),
|
|
1475
|
+
/* @__PURE__ */ jsx21(StyledClose, { asChild: true, "aria-label": "Close", children: /* @__PURE__ */ jsx21(Button, { variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx21(Icon, { name: "Closed", size: 8 }) }) })
|
|
1449
1476
|
] }),
|
|
1450
|
-
/* @__PURE__ */
|
|
1477
|
+
/* @__PURE__ */ jsx21(StyledDivider, {}),
|
|
1451
1478
|
children
|
|
1452
1479
|
] })
|
|
1453
1480
|
] }) });
|
|
@@ -1484,7 +1511,7 @@ var StyledIndicator = styled(Progress.Indicator, {
|
|
|
1484
1511
|
});
|
|
1485
1512
|
|
|
1486
1513
|
// src/components/ProgressBar/index.tsx
|
|
1487
|
-
import { jsx as
|
|
1514
|
+
import { jsx as jsx22, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1488
1515
|
var ProgressBar = ({ label, value = 0, max = 100, ...rest }) => {
|
|
1489
1516
|
const [progress2, setProgress] = useState3(0);
|
|
1490
1517
|
useEffect3(() => {
|
|
@@ -1493,14 +1520,14 @@ var ProgressBar = ({ label, value = 0, max = 100, ...rest }) => {
|
|
|
1493
1520
|
}, [value]);
|
|
1494
1521
|
const valueLabel = `${Math.round(progress2 / max * 100)}%`;
|
|
1495
1522
|
return /* @__PURE__ */ jsxs7(StyledWrapper3, { children: [
|
|
1496
|
-
/* @__PURE__ */
|
|
1497
|
-
/* @__PURE__ */
|
|
1523
|
+
/* @__PURE__ */ jsx22("label", { style: { fontSize: 16, alignSelf: "flex-start" }, children: label }),
|
|
1524
|
+
/* @__PURE__ */ jsx22(
|
|
1498
1525
|
StyledRoot,
|
|
1499
1526
|
{
|
|
1500
1527
|
value: progress2,
|
|
1501
1528
|
"aria-valuetext": valueLabel,
|
|
1502
1529
|
...rest,
|
|
1503
|
-
children: /* @__PURE__ */
|
|
1530
|
+
children: /* @__PURE__ */ jsx22(
|
|
1504
1531
|
StyledIndicator,
|
|
1505
1532
|
{
|
|
1506
1533
|
style: { transform: `translateX(-${100 - progress2}%)` }
|
|
@@ -1604,7 +1631,7 @@ var Span3 = styled("span", {
|
|
|
1604
1631
|
});
|
|
1605
1632
|
|
|
1606
1633
|
// src/components/Radio/index.tsx
|
|
1607
|
-
import { jsx as
|
|
1634
|
+
import { jsx as jsx23, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1608
1635
|
var Radio = ({
|
|
1609
1636
|
labels,
|
|
1610
1637
|
value,
|
|
@@ -1614,7 +1641,7 @@ var Radio = ({
|
|
|
1614
1641
|
errorMessage
|
|
1615
1642
|
}) => {
|
|
1616
1643
|
return /* @__PURE__ */ jsxs8("form", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
|
|
1617
|
-
/* @__PURE__ */
|
|
1644
|
+
/* @__PURE__ */ jsx23(
|
|
1618
1645
|
StyledRoot2,
|
|
1619
1646
|
{
|
|
1620
1647
|
value,
|
|
@@ -1624,26 +1651,26 @@ var Radio = ({
|
|
|
1624
1651
|
required,
|
|
1625
1652
|
loop: true,
|
|
1626
1653
|
children: labels.map((label, index) => /* @__PURE__ */ jsxs8(Wrapper2, { children: [
|
|
1627
|
-
/* @__PURE__ */
|
|
1654
|
+
/* @__PURE__ */ jsx23(
|
|
1628
1655
|
StyledItem,
|
|
1629
1656
|
{
|
|
1630
1657
|
value: label,
|
|
1631
1658
|
id: `radio-${index}`,
|
|
1632
1659
|
"aria-label": label,
|
|
1633
1660
|
hasError: !!errorMessage,
|
|
1634
|
-
children: /* @__PURE__ */
|
|
1661
|
+
children: /* @__PURE__ */ jsx23(StyledIndicator2, {})
|
|
1635
1662
|
}
|
|
1636
1663
|
),
|
|
1637
|
-
/* @__PURE__ */
|
|
1664
|
+
/* @__PURE__ */ jsx23(ItemLabel, { htmlFor: `radio-${index}`, children: label })
|
|
1638
1665
|
] }, label))
|
|
1639
1666
|
}
|
|
1640
1667
|
),
|
|
1641
|
-
errorMessage && /* @__PURE__ */
|
|
1668
|
+
errorMessage && /* @__PURE__ */ jsx23(Span3, { children: errorMessage })
|
|
1642
1669
|
] });
|
|
1643
1670
|
};
|
|
1644
1671
|
|
|
1645
1672
|
// src/components/Spacing.tsx
|
|
1646
|
-
import { jsx as
|
|
1673
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
1647
1674
|
var spacingMap = {
|
|
1648
1675
|
xs: 8,
|
|
1649
1676
|
sm: 12,
|
|
@@ -1655,7 +1682,7 @@ var spacingMap = {
|
|
|
1655
1682
|
};
|
|
1656
1683
|
var Spacing = ({ size, axis = "vertical" }) => {
|
|
1657
1684
|
const style = axis === "vertical" ? { height: spacingMap[size], width: "100%" } : { width: spacingMap[size], height: "100%" };
|
|
1658
|
-
return /* @__PURE__ */
|
|
1685
|
+
return /* @__PURE__ */ jsx24("div", { style, "data-testid": `spacing-${size}-${axis}` });
|
|
1659
1686
|
};
|
|
1660
1687
|
|
|
1661
1688
|
// src/components/Switch/styles.ts
|
|
@@ -1753,7 +1780,7 @@ var Span4 = styled("span", {
|
|
|
1753
1780
|
});
|
|
1754
1781
|
|
|
1755
1782
|
// src/components/Switch/index.tsx
|
|
1756
|
-
import { jsx as
|
|
1783
|
+
import { jsx as jsx25, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1757
1784
|
var Switch2 = ({
|
|
1758
1785
|
label,
|
|
1759
1786
|
checked,
|
|
@@ -1766,7 +1793,7 @@ var Switch2 = ({
|
|
|
1766
1793
|
}) => {
|
|
1767
1794
|
return /* @__PURE__ */ jsxs9("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
|
|
1768
1795
|
/* @__PURE__ */ jsxs9(Wrapper3, { hasError: !!errorMessage, children: [
|
|
1769
|
-
/* @__PURE__ */
|
|
1796
|
+
/* @__PURE__ */ jsx25(
|
|
1770
1797
|
StyledRoot3,
|
|
1771
1798
|
{
|
|
1772
1799
|
id,
|
|
@@ -1776,12 +1803,12 @@ var Switch2 = ({
|
|
|
1776
1803
|
hasError: !!errorMessage,
|
|
1777
1804
|
disabled,
|
|
1778
1805
|
required,
|
|
1779
|
-
children: /* @__PURE__ */
|
|
1806
|
+
children: /* @__PURE__ */ jsx25(StyledThumb, {})
|
|
1780
1807
|
}
|
|
1781
1808
|
),
|
|
1782
|
-
label && /* @__PURE__ */
|
|
1809
|
+
label && /* @__PURE__ */ jsx25(Label2, { htmlFor: id, children: label })
|
|
1783
1810
|
] }),
|
|
1784
|
-
errorMessage && /* @__PURE__ */
|
|
1811
|
+
errorMessage && /* @__PURE__ */ jsx25(Span4, { children: errorMessage })
|
|
1785
1812
|
] });
|
|
1786
1813
|
};
|
|
1787
1814
|
|
|
@@ -1867,9 +1894,9 @@ var TabsContent = styled(Tabs.Content, {
|
|
|
1867
1894
|
});
|
|
1868
1895
|
|
|
1869
1896
|
// src/components/Tabs/index.tsx
|
|
1870
|
-
import { Fragment, jsx as
|
|
1897
|
+
import { Fragment, jsx as jsx26, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1871
1898
|
var TabsItem = ({ children }) => {
|
|
1872
|
-
return /* @__PURE__ */
|
|
1899
|
+
return /* @__PURE__ */ jsx26(Fragment, { children });
|
|
1873
1900
|
};
|
|
1874
1901
|
var Tabs2 = ({ defaultValue, colorContent, children }) => {
|
|
1875
1902
|
const items = [];
|
|
@@ -1926,21 +1953,21 @@ var Tabs2 = ({ defaultValue, colorContent, children }) => {
|
|
|
1926
1953
|
ref: rootRef,
|
|
1927
1954
|
children: [
|
|
1928
1955
|
/* @__PURE__ */ jsxs10("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
|
|
1929
|
-
hasOverflow && /* @__PURE__ */
|
|
1956
|
+
hasOverflow && /* @__PURE__ */ jsx26(
|
|
1930
1957
|
Button,
|
|
1931
1958
|
{
|
|
1932
1959
|
variant: "secondary",
|
|
1933
1960
|
size: "sm",
|
|
1934
1961
|
onClick: () => scroll("left"),
|
|
1935
|
-
children: /* @__PURE__ */
|
|
1962
|
+
children: /* @__PURE__ */ jsx26(Icon, { name: "TriangleLeft", size: 64 })
|
|
1936
1963
|
}
|
|
1937
1964
|
),
|
|
1938
|
-
/* @__PURE__ */
|
|
1965
|
+
/* @__PURE__ */ jsx26(
|
|
1939
1966
|
TabsList,
|
|
1940
1967
|
{
|
|
1941
1968
|
ref: listRef,
|
|
1942
1969
|
scrollable: hasOverflow,
|
|
1943
|
-
children: items.map((item) => /* @__PURE__ */
|
|
1970
|
+
children: items.map((item) => /* @__PURE__ */ jsx26(
|
|
1944
1971
|
TabsTrigger,
|
|
1945
1972
|
{
|
|
1946
1973
|
value: item.value,
|
|
@@ -1951,17 +1978,17 @@ var Tabs2 = ({ defaultValue, colorContent, children }) => {
|
|
|
1951
1978
|
))
|
|
1952
1979
|
}
|
|
1953
1980
|
),
|
|
1954
|
-
hasOverflow && /* @__PURE__ */
|
|
1981
|
+
hasOverflow && /* @__PURE__ */ jsx26(
|
|
1955
1982
|
Button,
|
|
1956
1983
|
{
|
|
1957
1984
|
variant: "secondary",
|
|
1958
1985
|
size: "sm",
|
|
1959
1986
|
onClick: () => scroll("right"),
|
|
1960
|
-
children: /* @__PURE__ */
|
|
1987
|
+
children: /* @__PURE__ */ jsx26(Icon, { name: "TriangleRight", size: 64 })
|
|
1961
1988
|
}
|
|
1962
1989
|
)
|
|
1963
1990
|
] }),
|
|
1964
|
-
items.map((item) => /* @__PURE__ */
|
|
1991
|
+
items.map((item) => /* @__PURE__ */ jsx26(
|
|
1965
1992
|
TabsContent,
|
|
1966
1993
|
{
|
|
1967
1994
|
colorContent,
|
|
@@ -1977,7 +2004,7 @@ var Tabs2 = ({ defaultValue, colorContent, children }) => {
|
|
|
1977
2004
|
Tabs2.Item = TabsItem;
|
|
1978
2005
|
|
|
1979
2006
|
// src/components/TextArea.tsx
|
|
1980
|
-
import { jsx as
|
|
2007
|
+
import { jsx as jsx27, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1981
2008
|
var Wrapper4 = styled("div", {
|
|
1982
2009
|
display: "flex",
|
|
1983
2010
|
flexDirection: "column"
|
|
@@ -2055,9 +2082,9 @@ var Span5 = styled("span", {
|
|
|
2055
2082
|
var TextArea = ({ label, id, htmlFor, errorMessage, ...props }) => {
|
|
2056
2083
|
const textAreaId = id || htmlFor || `textarea-${crypto.randomUUID()}`;
|
|
2057
2084
|
return /* @__PURE__ */ jsxs11(Wrapper4, { children: [
|
|
2058
|
-
label && /* @__PURE__ */
|
|
2059
|
-
/* @__PURE__ */
|
|
2060
|
-
errorMessage && /* @__PURE__ */
|
|
2085
|
+
label && /* @__PURE__ */ jsx27(StyledLabel2, { htmlFor: textAreaId, children: label }),
|
|
2086
|
+
/* @__PURE__ */ jsx27(TextAreaElement, { id: textAreaId, ...props, hasError: !!errorMessage }),
|
|
2087
|
+
errorMessage && /* @__PURE__ */ jsx27(Span5, { children: errorMessage })
|
|
2061
2088
|
] });
|
|
2062
2089
|
};
|
|
2063
2090
|
TextArea.displayName = "TextArea";
|
|
@@ -2113,7 +2140,7 @@ var TooltipArrow = styled(RadixTooltip.Arrow, {
|
|
|
2113
2140
|
});
|
|
2114
2141
|
|
|
2115
2142
|
// src/components/Tooltip/index.tsx
|
|
2116
|
-
import { jsx as
|
|
2143
|
+
import { jsx as jsx28, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
2117
2144
|
var Tooltip = ({
|
|
2118
2145
|
content,
|
|
2119
2146
|
children,
|
|
@@ -2123,18 +2150,233 @@ var Tooltip = ({
|
|
|
2123
2150
|
onOpenChange,
|
|
2124
2151
|
delayDuration = 100
|
|
2125
2152
|
}) => {
|
|
2126
|
-
return /* @__PURE__ */
|
|
2127
|
-
/* @__PURE__ */
|
|
2153
|
+
return /* @__PURE__ */ jsx28(RadixTooltip2.Provider, { children: /* @__PURE__ */ jsxs12(RadixTooltip2.Root, { open, onOpenChange, delayDuration, children: [
|
|
2154
|
+
/* @__PURE__ */ jsx28(TooltipTrigger, { asChild: true, children }),
|
|
2128
2155
|
/* @__PURE__ */ jsxs12(TooltipContent, { side, sideOffset, children: [
|
|
2129
2156
|
content,
|
|
2130
|
-
/* @__PURE__ */
|
|
2157
|
+
/* @__PURE__ */ jsx28(TooltipArrow, {})
|
|
2131
2158
|
] })
|
|
2132
2159
|
] }) });
|
|
2133
2160
|
};
|
|
2134
2161
|
Tooltip.displayName = "Tooltip";
|
|
2135
2162
|
|
|
2163
|
+
// src/components/Loader/index.tsx
|
|
2164
|
+
import { useEffect as useEffect5, useRef as useRef5, useState as useState5 } from "react";
|
|
2165
|
+
|
|
2166
|
+
// src/components/Loader/style.ts
|
|
2167
|
+
var Content4 = styled("div", {
|
|
2168
|
+
position: "relative",
|
|
2169
|
+
height: "100%",
|
|
2170
|
+
width: "100%",
|
|
2171
|
+
minHeight: "inherit",
|
|
2172
|
+
top: 0,
|
|
2173
|
+
left: 0,
|
|
2174
|
+
backgroundColor: "YellowGreen"
|
|
2175
|
+
});
|
|
2176
|
+
var Overlay2 = styled("div", {
|
|
2177
|
+
display: "flex",
|
|
2178
|
+
justifyContent: "center",
|
|
2179
|
+
alignItems: "center",
|
|
2180
|
+
backgroundColor: "rgba(255, 255, 255, 0.6)",
|
|
2181
|
+
zIndex: 999,
|
|
2182
|
+
variants: {
|
|
2183
|
+
show: {
|
|
2184
|
+
true: {
|
|
2185
|
+
opacity: 1
|
|
2186
|
+
},
|
|
2187
|
+
false: {
|
|
2188
|
+
opacity: 0
|
|
2189
|
+
}
|
|
2190
|
+
},
|
|
2191
|
+
fullscreen: {
|
|
2192
|
+
true: {
|
|
2193
|
+
position: "fixed",
|
|
2194
|
+
top: 0,
|
|
2195
|
+
left: 0,
|
|
2196
|
+
right: 0,
|
|
2197
|
+
bottom: 0
|
|
2198
|
+
},
|
|
2199
|
+
false: {
|
|
2200
|
+
position: "absolute"
|
|
2201
|
+
}
|
|
2202
|
+
}
|
|
2203
|
+
}
|
|
2204
|
+
});
|
|
2205
|
+
var SpinnerContainer = styled("div", {
|
|
2206
|
+
position: "relative"
|
|
2207
|
+
});
|
|
2208
|
+
var rotation = keyframes({
|
|
2209
|
+
"0%": { transform: "rotate(0deg)" },
|
|
2210
|
+
"100%": { transform: "rotate(360deg)" }
|
|
2211
|
+
});
|
|
2212
|
+
var Spinner = styled("span", {
|
|
2213
|
+
width: "$19",
|
|
2214
|
+
height: "$19",
|
|
2215
|
+
borderRadius: "50%",
|
|
2216
|
+
display: "inline-block",
|
|
2217
|
+
borderTop: "6px solid $ignite_light",
|
|
2218
|
+
borderRight: "6px solid transparent",
|
|
2219
|
+
boxSizing: "border-box",
|
|
2220
|
+
animation: `${rotation} 1s linear infinite`,
|
|
2221
|
+
"&::after": {
|
|
2222
|
+
content: '""',
|
|
2223
|
+
boxSizing: "border-box",
|
|
2224
|
+
position: "absolute",
|
|
2225
|
+
left: 0,
|
|
2226
|
+
top: 0,
|
|
2227
|
+
width: "$19",
|
|
2228
|
+
height: "$19",
|
|
2229
|
+
borderRadius: "50%",
|
|
2230
|
+
borderLeft: "6px solid $clickpalm_light",
|
|
2231
|
+
borderBottom: "6px solid transparent",
|
|
2232
|
+
animation: `${rotation} 0.5s linear infinite reverse`
|
|
2233
|
+
}
|
|
2234
|
+
});
|
|
2235
|
+
|
|
2236
|
+
// src/components/Loader/index.tsx
|
|
2237
|
+
import { Fragment as Fragment2, jsx as jsx29, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2238
|
+
var Loader = ({ show, fullscreen }) => {
|
|
2239
|
+
const ref = useRef5(null);
|
|
2240
|
+
const [parentRect, setParentRect] = useState5(null);
|
|
2241
|
+
useEffect5(() => {
|
|
2242
|
+
if (!fullscreen && ref.current?.parentElement) {
|
|
2243
|
+
const rect = ref.current.parentElement.getBoundingClientRect();
|
|
2244
|
+
setParentRect(rect);
|
|
2245
|
+
}
|
|
2246
|
+
}, [fullscreen, show]);
|
|
2247
|
+
if (!show)
|
|
2248
|
+
return null;
|
|
2249
|
+
const overlayStyles = fullscreen ? { position: "fixed", top: 0, left: 0, right: 0, bottom: 0 } : parentRect ? {
|
|
2250
|
+
top: parentRect.top + window.scrollY,
|
|
2251
|
+
left: parentRect.left + window.scrollX,
|
|
2252
|
+
width: parentRect.width,
|
|
2253
|
+
height: parentRect.height
|
|
2254
|
+
} : {};
|
|
2255
|
+
return /* @__PURE__ */ jsxs13(Fragment2, { children: [
|
|
2256
|
+
/* @__PURE__ */ jsx29("div", { ref, style: { display: "none" } }),
|
|
2257
|
+
/* @__PURE__ */ jsx29(Overlay2, { show: true, fullscreen, style: overlayStyles, children: /* @__PURE__ */ jsx29(SpinnerContainer, { children: /* @__PURE__ */ jsx29(Spinner, {}) }) })
|
|
2258
|
+
] });
|
|
2259
|
+
};
|
|
2260
|
+
Loader.displayName = "Loader";
|
|
2261
|
+
|
|
2262
|
+
// src/components/MaskedInput/index.tsx
|
|
2263
|
+
import { forwardRef as forwardRef3, useState as useState6, useRef as useRef6 } from "react";
|
|
2264
|
+
|
|
2265
|
+
// src/components/MaskedInput/utils.ts
|
|
2266
|
+
var MAX_LENGTHS = {
|
|
2267
|
+
cellPhone: 15,
|
|
2268
|
+
homePhone: 14,
|
|
2269
|
+
cep: 9,
|
|
2270
|
+
cpf: 14,
|
|
2271
|
+
cnpj: 18,
|
|
2272
|
+
date: 10
|
|
2273
|
+
};
|
|
2274
|
+
var applyMask = (value, maskType) => {
|
|
2275
|
+
const digits = value.replace(/\D/g, "");
|
|
2276
|
+
const maxLength = MAX_LENGTHS[maskType];
|
|
2277
|
+
if (digits.length > maxLength) {
|
|
2278
|
+
return value.slice(0, -1);
|
|
2279
|
+
}
|
|
2280
|
+
switch (maskType) {
|
|
2281
|
+
case "cellPhone":
|
|
2282
|
+
if (digits.length <= 2)
|
|
2283
|
+
return digits;
|
|
2284
|
+
if (digits.length <= 7)
|
|
2285
|
+
return `(${digits.slice(0, 2)}) ${digits.slice(2)}`;
|
|
2286
|
+
return `(${digits.slice(0, 2)}) ${digits.slice(2, 7)}-${digits.slice(7, 11)}`;
|
|
2287
|
+
case "homePhone":
|
|
2288
|
+
if (digits.length <= 2)
|
|
2289
|
+
return digits;
|
|
2290
|
+
if (digits.length <= 6)
|
|
2291
|
+
return `(${digits.slice(0, 2)}) ${digits.slice(2)}`;
|
|
2292
|
+
return `(${digits.slice(0, 2)}) ${digits.slice(2, 6)}-${digits.slice(6, 10)}`;
|
|
2293
|
+
case "cep":
|
|
2294
|
+
if (digits.length <= 5)
|
|
2295
|
+
return digits;
|
|
2296
|
+
return `${digits.slice(0, 5)}-${digits.slice(5, 8)}`;
|
|
2297
|
+
case "cpf":
|
|
2298
|
+
if (digits.length <= 3)
|
|
2299
|
+
return digits;
|
|
2300
|
+
if (digits.length <= 6)
|
|
2301
|
+
return `${digits.slice(0, 3)}.${digits.slice(3)}`;
|
|
2302
|
+
if (digits.length <= 9)
|
|
2303
|
+
return `${digits.slice(0, 3)}.${digits.slice(3, 6)}.${digits.slice(6)}`;
|
|
2304
|
+
return `${digits.slice(0, 3)}.${digits.slice(3, 6)}.${digits.slice(6, 9)}-${digits.slice(9, 11)}`;
|
|
2305
|
+
case "cnpj":
|
|
2306
|
+
if (digits.length <= 2)
|
|
2307
|
+
return digits;
|
|
2308
|
+
if (digits.length <= 5)
|
|
2309
|
+
return `${digits.slice(0, 2)}.${digits.slice(2)}`;
|
|
2310
|
+
if (digits.length <= 8)
|
|
2311
|
+
return `${digits.slice(0, 2)}.${digits.slice(2, 5)}.${digits.slice(5)}`;
|
|
2312
|
+
if (digits.length <= 12)
|
|
2313
|
+
return `${digits.slice(0, 2)}.${digits.slice(2, 5)}.${digits.slice(5, 8)}/${digits.slice(8)}`;
|
|
2314
|
+
return `${digits.slice(0, 2)}.${digits.slice(2, 5)}.${digits.slice(5, 8)}/${digits.slice(8, 12)}-${digits.slice(12, 14)}`;
|
|
2315
|
+
case "date":
|
|
2316
|
+
if (digits.length <= 2)
|
|
2317
|
+
return digits;
|
|
2318
|
+
if (digits.length <= 4)
|
|
2319
|
+
return `${digits.slice(0, 2)}/${digits.slice(2)}`;
|
|
2320
|
+
return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
|
|
2321
|
+
default:
|
|
2322
|
+
return value;
|
|
2323
|
+
}
|
|
2324
|
+
};
|
|
2325
|
+
|
|
2326
|
+
// src/components/MaskedInput/index.tsx
|
|
2327
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
2328
|
+
var MaskedInput = forwardRef3(
|
|
2329
|
+
({ maskType, onChange, ...props }, ref) => {
|
|
2330
|
+
const [value, setValue] = useState6("");
|
|
2331
|
+
const inputRef = useRef6(null);
|
|
2332
|
+
const handleChange = (e) => {
|
|
2333
|
+
const { value: inputValue, selectionStart } = e.target;
|
|
2334
|
+
const isBackspace = value.length > inputValue.length;
|
|
2335
|
+
const rawValue = inputValue.replace(/\D/g, "");
|
|
2336
|
+
const maskedValue = applyMask(rawValue, maskType);
|
|
2337
|
+
setValue(maskedValue);
|
|
2338
|
+
if (inputRef.current && selectionStart !== null) {
|
|
2339
|
+
let newCursorPos = selectionStart;
|
|
2340
|
+
if (isBackspace && value.length > 0) {
|
|
2341
|
+
const prevChar = value[selectionStart || 0];
|
|
2342
|
+
if (prevChar && !/\d/.test(prevChar)) {
|
|
2343
|
+
newCursorPos = Math.max(0, (selectionStart || 0) - 1);
|
|
2344
|
+
}
|
|
2345
|
+
}
|
|
2346
|
+
setTimeout(() => {
|
|
2347
|
+
if (inputRef.current) {
|
|
2348
|
+
inputRef.current.setSelectionRange(newCursorPos, newCursorPos);
|
|
2349
|
+
}
|
|
2350
|
+
}, 0);
|
|
2351
|
+
}
|
|
2352
|
+
if (onChange) {
|
|
2353
|
+
const syntheticEvent = {
|
|
2354
|
+
...e,
|
|
2355
|
+
target: {
|
|
2356
|
+
...e.target,
|
|
2357
|
+
value: maskedValue,
|
|
2358
|
+
rawValue
|
|
2359
|
+
}
|
|
2360
|
+
};
|
|
2361
|
+
onChange(syntheticEvent);
|
|
2362
|
+
}
|
|
2363
|
+
};
|
|
2364
|
+
return /* @__PURE__ */ jsx30(
|
|
2365
|
+
Input2,
|
|
2366
|
+
{
|
|
2367
|
+
...props,
|
|
2368
|
+
ref,
|
|
2369
|
+
value,
|
|
2370
|
+
onChange: handleChange,
|
|
2371
|
+
maxLength: MAX_LENGTHS[maskType]
|
|
2372
|
+
}
|
|
2373
|
+
);
|
|
2374
|
+
}
|
|
2375
|
+
);
|
|
2376
|
+
MaskedInput.displayName = "MaskedInput";
|
|
2377
|
+
|
|
2136
2378
|
// src/components/Box.tsx
|
|
2137
|
-
import { jsx as
|
|
2379
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
2138
2380
|
var StyledBox = styled("div", {
|
|
2139
2381
|
padding: "$5",
|
|
2140
2382
|
borderRadius: "$md",
|
|
@@ -2156,12 +2398,12 @@ var StyledBox = styled("div", {
|
|
|
2156
2398
|
}
|
|
2157
2399
|
});
|
|
2158
2400
|
var Box = (props) => {
|
|
2159
|
-
return /* @__PURE__ */
|
|
2401
|
+
return /* @__PURE__ */ jsx31(StyledBox, { ...props });
|
|
2160
2402
|
};
|
|
2161
2403
|
Box.displayName = "Box";
|
|
2162
2404
|
|
|
2163
2405
|
// src/components/Text.tsx
|
|
2164
|
-
import { jsx as
|
|
2406
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
2165
2407
|
var StyledText = styled("p", {
|
|
2166
2408
|
fontFamily: "$default",
|
|
2167
2409
|
lineHeight: "$short",
|
|
@@ -2202,7 +2444,7 @@ var StyledText = styled("p", {
|
|
|
2202
2444
|
}
|
|
2203
2445
|
});
|
|
2204
2446
|
var Text = (props) => {
|
|
2205
|
-
return /* @__PURE__ */
|
|
2447
|
+
return /* @__PURE__ */ jsx32(StyledText, { ...props });
|
|
2206
2448
|
};
|
|
2207
2449
|
Text.displayName = "Text";
|
|
2208
2450
|
|
|
@@ -2233,7 +2475,7 @@ Heading.displayName = "Heading";
|
|
|
2233
2475
|
// src/components/Select/index.tsx
|
|
2234
2476
|
import { TriangleDownIcon, TriangleUpIcon } from "@radix-ui/react-icons";
|
|
2235
2477
|
import * as CustomSelect from "@radix-ui/react-select";
|
|
2236
|
-
import { useState as
|
|
2478
|
+
import { useState as useState7 } from "react";
|
|
2237
2479
|
|
|
2238
2480
|
// src/components/Select/styles.ts
|
|
2239
2481
|
import * as Select from "@radix-ui/react-select";
|
|
@@ -2350,7 +2592,7 @@ var Span6 = styled("span", {
|
|
|
2350
2592
|
});
|
|
2351
2593
|
|
|
2352
2594
|
// src/components/Select/index.tsx
|
|
2353
|
-
import { jsx as
|
|
2595
|
+
import { jsx as jsx33, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2354
2596
|
function Select2({
|
|
2355
2597
|
value,
|
|
2356
2598
|
onValueChange,
|
|
@@ -2360,10 +2602,10 @@ function Select2({
|
|
|
2360
2602
|
errorMessage,
|
|
2361
2603
|
...rest
|
|
2362
2604
|
}) {
|
|
2363
|
-
const [open, setOpen] =
|
|
2364
|
-
return /* @__PURE__ */
|
|
2365
|
-
label && /* @__PURE__ */
|
|
2366
|
-
/* @__PURE__ */
|
|
2605
|
+
const [open, setOpen] = useState7(false);
|
|
2606
|
+
return /* @__PURE__ */ jsxs14(StyledWrapper4, { children: [
|
|
2607
|
+
label && /* @__PURE__ */ jsx33(Label3, { children: label }),
|
|
2608
|
+
/* @__PURE__ */ jsxs14(
|
|
2367
2609
|
CustomSelect.Root,
|
|
2368
2610
|
{
|
|
2369
2611
|
value,
|
|
@@ -2371,21 +2613,21 @@ function Select2({
|
|
|
2371
2613
|
onOpenChange: setOpen,
|
|
2372
2614
|
...rest,
|
|
2373
2615
|
children: [
|
|
2374
|
-
/* @__PURE__ */
|
|
2375
|
-
/* @__PURE__ */
|
|
2376
|
-
/* @__PURE__ */
|
|
2616
|
+
/* @__PURE__ */ jsxs14(StyledTrigger, { "aria-label": label, hasError: !!errorMessage, children: [
|
|
2617
|
+
/* @__PURE__ */ jsx33(CustomSelect.Value, { placeholder }),
|
|
2618
|
+
/* @__PURE__ */ jsx33(StyledIcon, { open, children: /* @__PURE__ */ jsx33(TriangleDownIcon, {}) })
|
|
2377
2619
|
] }),
|
|
2378
|
-
errorMessage && /* @__PURE__ */
|
|
2379
|
-
/* @__PURE__ */
|
|
2620
|
+
errorMessage && /* @__PURE__ */ jsx33(Span6, { children: errorMessage }),
|
|
2621
|
+
/* @__PURE__ */ jsx33(CustomSelect.Portal, { children: /* @__PURE__ */ jsxs14(
|
|
2380
2622
|
StyledContent2,
|
|
2381
2623
|
{
|
|
2382
2624
|
side: "bottom",
|
|
2383
2625
|
align: "start",
|
|
2384
2626
|
position: "popper",
|
|
2385
2627
|
children: [
|
|
2386
|
-
/* @__PURE__ */
|
|
2387
|
-
/* @__PURE__ */
|
|
2388
|
-
/* @__PURE__ */
|
|
2628
|
+
/* @__PURE__ */ jsx33(CustomSelect.ScrollUpButton, { children: /* @__PURE__ */ jsx33(TriangleUpIcon, {}) }),
|
|
2629
|
+
/* @__PURE__ */ jsx33(StyledViewport, { children: items.map((item) => /* @__PURE__ */ jsx33(StyledItem2, { value: item.value, children: /* @__PURE__ */ jsx33(CustomSelect.ItemText, { children: item.label }) }, item.value)) }),
|
|
2630
|
+
/* @__PURE__ */ jsx33(CustomSelect.ScrollDownButton, { children: /* @__PURE__ */ jsx33(TriangleDownIcon, {}) })
|
|
2389
2631
|
]
|
|
2390
2632
|
}
|
|
2391
2633
|
) })
|
|
@@ -2462,9 +2704,9 @@ var Value2 = styled("div", {
|
|
|
2462
2704
|
});
|
|
2463
2705
|
|
|
2464
2706
|
// src/components/LabelledValue/index.tsx
|
|
2465
|
-
import { jsx as
|
|
2707
|
+
import { jsx as jsx34, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2466
2708
|
function LabelledValue({ position = "vertical", withRow = false, children }) {
|
|
2467
|
-
return /* @__PURE__ */
|
|
2709
|
+
return /* @__PURE__ */ jsx34(Container, { position, children: Children2.map(children, (child) => {
|
|
2468
2710
|
if (isValidElement2(child)) {
|
|
2469
2711
|
return cloneElement(child, { position, withRow });
|
|
2470
2712
|
}
|
|
@@ -2472,9 +2714,9 @@ function LabelledValue({ position = "vertical", withRow = false, children }) {
|
|
|
2472
2714
|
}) });
|
|
2473
2715
|
}
|
|
2474
2716
|
function Item3({ label, value, position = "vertical", withRow = false }) {
|
|
2475
|
-
return /* @__PURE__ */
|
|
2476
|
-
/* @__PURE__ */
|
|
2477
|
-
/* @__PURE__ */
|
|
2717
|
+
return /* @__PURE__ */ jsxs15(ItemWrapper, { position, withRow, children: [
|
|
2718
|
+
/* @__PURE__ */ jsx34(Label4, { children: label }),
|
|
2719
|
+
/* @__PURE__ */ jsx34(Value2, { children: value })
|
|
2478
2720
|
] });
|
|
2479
2721
|
}
|
|
2480
2722
|
LabelledValue.Item = Item3;
|
|
@@ -2523,19 +2765,19 @@ var StyledInput = styled(OneTimePasswordField.Input, {
|
|
|
2523
2765
|
});
|
|
2524
2766
|
|
|
2525
2767
|
// src/components/OneTimePassword/index.tsx
|
|
2526
|
-
import { jsx as
|
|
2768
|
+
import { jsx as jsx35, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2527
2769
|
var OneTimePassword = ({ label, length, value, onValueChange, ...rootProps }) => {
|
|
2528
|
-
return /* @__PURE__ */
|
|
2529
|
-
/* @__PURE__ */
|
|
2530
|
-
/* @__PURE__ */
|
|
2770
|
+
return /* @__PURE__ */ jsxs16(StyledWrapper5, { children: [
|
|
2771
|
+
/* @__PURE__ */ jsx35("label", { children: label }),
|
|
2772
|
+
/* @__PURE__ */ jsxs16(
|
|
2531
2773
|
StyledRoot4,
|
|
2532
2774
|
{
|
|
2533
2775
|
value,
|
|
2534
2776
|
onValueChange,
|
|
2535
2777
|
...rootProps,
|
|
2536
2778
|
children: [
|
|
2537
|
-
Array.from({ length }).map((_, index) => /* @__PURE__ */
|
|
2538
|
-
/* @__PURE__ */
|
|
2779
|
+
Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx35(StyledInput, {}, index)),
|
|
2780
|
+
/* @__PURE__ */ jsx35(OneTimePasswordField2.HiddenInput, {})
|
|
2539
2781
|
]
|
|
2540
2782
|
}
|
|
2541
2783
|
)
|
|
@@ -2545,7 +2787,7 @@ OneTimePassword.displayName = "OneTimePasswordInput";
|
|
|
2545
2787
|
|
|
2546
2788
|
// src/components/Toast/index.tsx
|
|
2547
2789
|
import * as ToastPrimitive2 from "@radix-ui/react-toast";
|
|
2548
|
-
import * as
|
|
2790
|
+
import * as React3 from "react";
|
|
2549
2791
|
|
|
2550
2792
|
// src/components/Toast/styles.ts
|
|
2551
2793
|
import * as ToastPrimitive from "@radix-ui/react-toast";
|
|
@@ -2708,11 +2950,11 @@ var toast = {
|
|
|
2708
2950
|
};
|
|
2709
2951
|
|
|
2710
2952
|
// src/components/Toast/index.tsx
|
|
2711
|
-
import { jsx as
|
|
2953
|
+
import { jsx as jsx36, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2712
2954
|
var Toast = () => {
|
|
2713
|
-
const [messages, setMessages] =
|
|
2714
|
-
const [paused, setPaused] =
|
|
2715
|
-
|
|
2955
|
+
const [messages, setMessages] = React3.useState([]);
|
|
2956
|
+
const [paused, setPaused] = React3.useState(false);
|
|
2957
|
+
React3.useEffect(() => {
|
|
2716
2958
|
const handleNewToast = (msg) => {
|
|
2717
2959
|
setMessages((prev) => [...prev, msg]);
|
|
2718
2960
|
};
|
|
@@ -2724,8 +2966,8 @@ var Toast = () => {
|
|
|
2724
2966
|
const removeToast = (id) => {
|
|
2725
2967
|
setMessages((prev) => prev.filter((msg) => msg.id !== id));
|
|
2726
2968
|
};
|
|
2727
|
-
return /* @__PURE__ */
|
|
2728
|
-
messages.map((message) => /* @__PURE__ */
|
|
2969
|
+
return /* @__PURE__ */ jsxs17(ToastPrimitive2.Provider, { swipeDirection: "right", children: [
|
|
2970
|
+
messages.map((message) => /* @__PURE__ */ jsxs17(
|
|
2729
2971
|
ToastRoot,
|
|
2730
2972
|
{
|
|
2731
2973
|
open: true,
|
|
@@ -2738,11 +2980,11 @@ var Toast = () => {
|
|
|
2738
2980
|
onPause: () => setPaused(true),
|
|
2739
2981
|
onResume: () => setPaused(false),
|
|
2740
2982
|
children: [
|
|
2741
|
-
/* @__PURE__ */
|
|
2742
|
-
/* @__PURE__ */
|
|
2743
|
-
/* @__PURE__ */
|
|
2983
|
+
/* @__PURE__ */ jsxs17(ToastContent, { children: [
|
|
2984
|
+
/* @__PURE__ */ jsx36(ToastTitle, { children: message.title }),
|
|
2985
|
+
/* @__PURE__ */ jsx36(ToastDescription, { children: message.description })
|
|
2744
2986
|
] }),
|
|
2745
|
-
/* @__PURE__ */
|
|
2987
|
+
/* @__PURE__ */ jsx36(ToastAction, { altText: "Fechar", asChild: true, children: /* @__PURE__ */ jsx36(
|
|
2746
2988
|
"button",
|
|
2747
2989
|
{
|
|
2748
2990
|
style: {
|
|
@@ -2752,15 +2994,15 @@ var Toast = () => {
|
|
|
2752
2994
|
alignItems: "center"
|
|
2753
2995
|
},
|
|
2754
2996
|
onClick: () => removeToast(message.id),
|
|
2755
|
-
children: /* @__PURE__ */
|
|
2997
|
+
children: /* @__PURE__ */ jsx36(Icon, { name: "Closed", size: 16, height: 14, width: 14 })
|
|
2756
2998
|
}
|
|
2757
2999
|
) }),
|
|
2758
|
-
/* @__PURE__ */
|
|
3000
|
+
/* @__PURE__ */ jsx36(ToastProgress, { paused, variant: message.variant })
|
|
2759
3001
|
]
|
|
2760
3002
|
},
|
|
2761
3003
|
message.id
|
|
2762
3004
|
)),
|
|
2763
|
-
/* @__PURE__ */
|
|
3005
|
+
/* @__PURE__ */ jsx36(ToastViewport, {})
|
|
2764
3006
|
] });
|
|
2765
3007
|
};
|
|
2766
3008
|
|
|
@@ -2996,22 +3238,22 @@ var StepLabel = styled("span", {
|
|
|
2996
3238
|
});
|
|
2997
3239
|
|
|
2998
3240
|
// src/components/MultiStep/index.tsx
|
|
2999
|
-
import { jsx as
|
|
3241
|
+
import { jsx as jsx37, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
3000
3242
|
var MultiStep = ({
|
|
3001
3243
|
steps,
|
|
3002
3244
|
currentStep,
|
|
3003
3245
|
orientation = "horizontal",
|
|
3004
3246
|
variant
|
|
3005
3247
|
}) => {
|
|
3006
|
-
return /* @__PURE__ */
|
|
3248
|
+
return /* @__PURE__ */ jsx37(
|
|
3007
3249
|
Wrapper5,
|
|
3008
3250
|
{
|
|
3009
3251
|
orientation,
|
|
3010
3252
|
children: steps.map((step, index) => {
|
|
3011
3253
|
const isFirst = index === 0;
|
|
3012
3254
|
const isLast = index === steps.length - 1;
|
|
3013
|
-
return /* @__PURE__ */
|
|
3014
|
-
/* @__PURE__ */
|
|
3255
|
+
return /* @__PURE__ */ jsxs18(StepItem, { orientation, children: [
|
|
3256
|
+
/* @__PURE__ */ jsx37(
|
|
3015
3257
|
StepCircle,
|
|
3016
3258
|
{
|
|
3017
3259
|
orientation,
|
|
@@ -3022,7 +3264,7 @@ var MultiStep = ({
|
|
|
3022
3264
|
children: index + 1
|
|
3023
3265
|
}
|
|
3024
3266
|
),
|
|
3025
|
-
/* @__PURE__ */
|
|
3267
|
+
/* @__PURE__ */ jsx37(
|
|
3026
3268
|
StepLabel,
|
|
3027
3269
|
{
|
|
3028
3270
|
orientation,
|
|
@@ -3038,7 +3280,7 @@ var MultiStep = ({
|
|
|
3038
3280
|
MultiStep.displayName = "MultiStep";
|
|
3039
3281
|
|
|
3040
3282
|
// src/components/Carousel/index.tsx
|
|
3041
|
-
import { useState as
|
|
3283
|
+
import { useState as useState9, Children as Children3, cloneElement as cloneElement2 } from "react";
|
|
3042
3284
|
|
|
3043
3285
|
// src/components/Carousel/styles.ts
|
|
3044
3286
|
var CarouselContainer = styled("div", {
|
|
@@ -3144,13 +3386,13 @@ var CarouselItemContainer = styled("div", {
|
|
|
3144
3386
|
});
|
|
3145
3387
|
|
|
3146
3388
|
// src/components/Carousel/index.tsx
|
|
3147
|
-
import { jsx as
|
|
3389
|
+
import { jsx as jsx38, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
3148
3390
|
var SWIPE_THRESHOLD = 50;
|
|
3149
3391
|
var Carousel = ({ title, variant, children }) => {
|
|
3150
3392
|
const items = Children3.toArray(children);
|
|
3151
|
-
const [activeIndex, setActiveIndex] =
|
|
3152
|
-
const [touchStartX, setTouchStartX] =
|
|
3153
|
-
const [touchEndX, setTouchEndX] =
|
|
3393
|
+
const [activeIndex, setActiveIndex] = useState9(0);
|
|
3394
|
+
const [touchStartX, setTouchStartX] = useState9(null);
|
|
3395
|
+
const [touchEndX, setTouchEndX] = useState9(null);
|
|
3154
3396
|
const prev = () => {
|
|
3155
3397
|
setActiveIndex((prevIndex) => prevIndex === 0 ? items.length - 1 : prevIndex - 1);
|
|
3156
3398
|
};
|
|
@@ -3178,18 +3420,18 @@ var Carousel = ({ title, variant, children }) => {
|
|
|
3178
3420
|
setTouchStartX(null);
|
|
3179
3421
|
setTouchEndX(null);
|
|
3180
3422
|
};
|
|
3181
|
-
return /* @__PURE__ */
|
|
3423
|
+
return /* @__PURE__ */ jsxs19(
|
|
3182
3424
|
CarouselContainer,
|
|
3183
3425
|
{
|
|
3184
3426
|
role: "region",
|
|
3185
3427
|
"aria-roledescription": "carousel",
|
|
3186
3428
|
"aria-label": "Carousel Component",
|
|
3187
3429
|
children: [
|
|
3188
|
-
/* @__PURE__ */
|
|
3189
|
-
/* @__PURE__ */
|
|
3190
|
-
/* @__PURE__ */
|
|
3191
|
-
/* @__PURE__ */
|
|
3192
|
-
/* @__PURE__ */
|
|
3430
|
+
/* @__PURE__ */ jsxs19(Wrapper6, { variant, children: [
|
|
3431
|
+
/* @__PURE__ */ jsxs19(CarouselHeader, { children: [
|
|
3432
|
+
/* @__PURE__ */ jsx38(Title2, { children: title }),
|
|
3433
|
+
/* @__PURE__ */ jsxs19(Navigation, { children: [
|
|
3434
|
+
/* @__PURE__ */ jsx38(
|
|
3193
3435
|
Button,
|
|
3194
3436
|
{
|
|
3195
3437
|
size: "sm",
|
|
@@ -3197,10 +3439,10 @@ var Carousel = ({ title, variant, children }) => {
|
|
|
3197
3439
|
"aria-label": "Previous Slide",
|
|
3198
3440
|
onClick: prev,
|
|
3199
3441
|
tabIndex: 0,
|
|
3200
|
-
children: /* @__PURE__ */
|
|
3442
|
+
children: /* @__PURE__ */ jsx38(Icon, { name: "TriangleLeft", size: 16, color: variant === "purple" ? "white" : "black" })
|
|
3201
3443
|
}
|
|
3202
3444
|
),
|
|
3203
|
-
/* @__PURE__ */
|
|
3445
|
+
/* @__PURE__ */ jsx38(
|
|
3204
3446
|
Button,
|
|
3205
3447
|
{
|
|
3206
3448
|
size: "sm",
|
|
@@ -3208,15 +3450,15 @@ var Carousel = ({ title, variant, children }) => {
|
|
|
3208
3450
|
"aria-label": "Previous Slide",
|
|
3209
3451
|
onClick: next,
|
|
3210
3452
|
tabIndex: 0,
|
|
3211
|
-
children: /* @__PURE__ */
|
|
3453
|
+
children: /* @__PURE__ */ jsx38(Icon, { name: "TriangleRight", size: 16, color: variant === "purple" ? "white" : "black" })
|
|
3212
3454
|
}
|
|
3213
3455
|
)
|
|
3214
3456
|
] })
|
|
3215
3457
|
] }),
|
|
3216
|
-
/* @__PURE__ */
|
|
3217
|
-
/* @__PURE__ */
|
|
3218
|
-
/* @__PURE__ */
|
|
3219
|
-
/* @__PURE__ */
|
|
3458
|
+
/* @__PURE__ */ jsx38(Spacing, { size: "xs" }),
|
|
3459
|
+
/* @__PURE__ */ jsx38(Hr, { variant }),
|
|
3460
|
+
/* @__PURE__ */ jsx38(Spacing, { size: "xs" }),
|
|
3461
|
+
/* @__PURE__ */ jsx38(
|
|
3220
3462
|
CarouselContent,
|
|
3221
3463
|
{
|
|
3222
3464
|
onTouchStart,
|
|
@@ -3233,8 +3475,8 @@ var Carousel = ({ title, variant, children }) => {
|
|
|
3233
3475
|
}
|
|
3234
3476
|
)
|
|
3235
3477
|
] }),
|
|
3236
|
-
/* @__PURE__ */
|
|
3237
|
-
/* @__PURE__ */
|
|
3478
|
+
/* @__PURE__ */ jsx38(Spacing, { size: "md" }),
|
|
3479
|
+
/* @__PURE__ */ jsx38(DotsContainer, { children: /* @__PURE__ */ jsx38(Dots2, { role: "tablist", "aria-label": "Carousel Pagination", children: items.map((_, idx) => /* @__PURE__ */ jsx38(
|
|
3238
3480
|
DotButton,
|
|
3239
3481
|
{
|
|
3240
3482
|
active: idx === activeIndex,
|
|
@@ -3250,17 +3492,16 @@ var Carousel = ({ title, variant, children }) => {
|
|
|
3250
3492
|
}
|
|
3251
3493
|
);
|
|
3252
3494
|
};
|
|
3253
|
-
var CarouselItem = ({ children, style, ...props }) => /* @__PURE__ */
|
|
3495
|
+
var CarouselItem = ({ children, style, ...props }) => /* @__PURE__ */ jsx38(CarouselItemContainer, { ...props, style: { ...style }, children });
|
|
3254
3496
|
Carousel.Item = CarouselItem;
|
|
3255
3497
|
|
|
3256
3498
|
// src/components/PasswordInput.tsx
|
|
3257
|
-
import { forwardRef as
|
|
3258
|
-
import { jsx as
|
|
3259
|
-
var PasswordInput =
|
|
3499
|
+
import { forwardRef as forwardRef4, useRef as useRef7, useState as useState10, useImperativeHandle } from "react";
|
|
3500
|
+
import { jsx as jsx39 } from "react/jsx-runtime";
|
|
3501
|
+
var PasswordInput = forwardRef4(
|
|
3260
3502
|
({ value, onChange, ...props }, ref) => {
|
|
3261
|
-
|
|
3262
|
-
const
|
|
3263
|
-
const innerRef = useRef5(null);
|
|
3503
|
+
const [visible, setVisible] = useState10(false);
|
|
3504
|
+
const innerRef = useRef7(null);
|
|
3264
3505
|
useImperativeHandle(ref, () => innerRef.current);
|
|
3265
3506
|
const handleToggleVisibility = () => {
|
|
3266
3507
|
setVisible((v) => !v);
|
|
@@ -3271,7 +3512,7 @@ var PasswordInput = forwardRef3(
|
|
|
3271
3512
|
}
|
|
3272
3513
|
}, 0);
|
|
3273
3514
|
};
|
|
3274
|
-
return /* @__PURE__ */
|
|
3515
|
+
return /* @__PURE__ */ jsx39(
|
|
3275
3516
|
Input2,
|
|
3276
3517
|
{
|
|
3277
3518
|
...props,
|
|
@@ -3279,7 +3520,7 @@ var PasswordInput = forwardRef3(
|
|
|
3279
3520
|
type: visible ? "text" : "password",
|
|
3280
3521
|
value,
|
|
3281
3522
|
onChange,
|
|
3282
|
-
suffix: /* @__PURE__ */
|
|
3523
|
+
suffix: /* @__PURE__ */ jsx39(
|
|
3283
3524
|
"button",
|
|
3284
3525
|
{
|
|
3285
3526
|
type: "button",
|
|
@@ -3293,7 +3534,7 @@ var PasswordInput = forwardRef3(
|
|
|
3293
3534
|
justifyContent: "center"
|
|
3294
3535
|
},
|
|
3295
3536
|
"aria-label": visible ? "Ocultar senha" : "Mostrar senha",
|
|
3296
|
-
children: visible ? /* @__PURE__ */
|
|
3537
|
+
children: visible ? /* @__PURE__ */ jsx39(Icon, { name: "EyeClosed", size: 16, color: "black" }) : /* @__PURE__ */ jsx39(Icon, { name: "EyeOpen", size: 16, color: "black" })
|
|
3297
3538
|
}
|
|
3298
3539
|
)
|
|
3299
3540
|
}
|
|
@@ -3314,6 +3555,8 @@ export {
|
|
|
3314
3555
|
Icon,
|
|
3315
3556
|
Input2 as Input,
|
|
3316
3557
|
LabelledValue,
|
|
3558
|
+
Loader,
|
|
3559
|
+
MaskedInput,
|
|
3317
3560
|
Modal,
|
|
3318
3561
|
MultiStep,
|
|
3319
3562
|
OneTimePassword,
|