@lets-events/react 10.0.0 → 10.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.
Files changed (47) hide show
  1. package/.eslintrc.json +2 -2
  2. package/.turbo/turbo-build.log +20 -18
  3. package/CHANGELOG.md +12 -0
  4. package/dist/index.d.mts +426 -1
  5. package/dist/index.d.ts +426 -1
  6. package/dist/index.js +289 -10
  7. package/dist/index.mjs +280 -9
  8. package/package.json +3 -1
  9. package/src/components/Alert.tsx +303 -303
  10. package/src/components/Avatar.tsx +55 -55
  11. package/src/components/Badge.tsx +128 -128
  12. package/src/components/Box.tsx +3 -3
  13. package/src/components/Button/index.tsx +12 -12
  14. package/src/components/Button/styledComponents.ts +250 -250
  15. package/src/components/ButtonGroup.tsx +484 -484
  16. package/src/components/Calendar/index.tsx +136 -136
  17. package/src/components/Calendar/styledComponents.ts +208 -208
  18. package/src/components/Card.tsx +69 -69
  19. package/src/components/CheckboxGroup.tsx +214 -214
  20. package/src/components/Container.tsx +39 -39
  21. package/src/components/Dropdown.tsx +167 -167
  22. package/src/components/Filter.tsx +164 -164
  23. package/src/components/Flex.tsx +118 -118
  24. package/src/components/Grid.tsx +137 -137
  25. package/src/components/Icon.tsx +47 -47
  26. package/src/components/Modal.tsx +90 -88
  27. package/src/components/RadioGroup.tsx +210 -210
  28. package/src/components/Section.tsx +33 -33
  29. package/src/components/Step.tsx +164 -164
  30. package/src/components/Switch.tsx +108 -108
  31. package/src/components/Text.tsx +30 -30
  32. package/src/components/TextField.tsx +299 -299
  33. package/src/components/TextareaField.tsx +101 -101
  34. package/src/components/TimePicker.tsx +239 -239
  35. package/src/components/Toast/components/ToastItem.tsx +41 -0
  36. package/src/components/Toast/components/ToastProvider.tsx +63 -0
  37. package/src/components/Toast/hooks/useToast.ts +12 -0
  38. package/src/components/Toast/index.tsx +5 -0
  39. package/src/components/Toast/styles/index.ts +135 -0
  40. package/src/components/Toast/types/index.ts +46 -0
  41. package/src/components/Tooltip/index.tsx +67 -0
  42. package/src/components/Tooltip/styles.ts +78 -0
  43. package/src/hooks/useOnClickOutside.tsx +20 -20
  44. package/src/index.tsx +33 -31
  45. package/src/styles/index.ts +38 -38
  46. package/src/types/typographyValues.ts +178 -178
  47. package/tsconfig.json +3 -3
package/dist/index.js CHANGED
@@ -1075,8 +1075,16 @@ __export(index_exports, {
1075
1075
  TimePickerFooterStyled: () => TimePickerFooterStyled,
1076
1076
  TimePickerStyled: () => TimePickerStyled,
1077
1077
  TimerPickerContentStyled: () => TimerPickerContentStyled,
1078
+ ToastItem: () => ToastItem,
1079
+ ToastProvider: () => ToastProvider,
1080
+ Tooltip: () => Tooltip,
1081
+ TooltipContent: () => TooltipContent,
1082
+ TooltipProvider: () => TooltipProvider,
1083
+ TooltipRoot: () => TooltipRoot,
1084
+ TooltipTrigger: () => TooltipTrigger,
1078
1085
  maskFormat: () => maskFormat,
1079
- maskUnformat: () => maskUnformat
1086
+ maskUnformat: () => maskUnformat,
1087
+ useToast: () => useToast
1080
1088
  });
1081
1089
  module.exports = __toCommonJS(index_exports);
1082
1090
 
@@ -3622,13 +3630,15 @@ var ModalContentStyled = styled(import_radix_ui.Dialog.Content, {
3622
3630
  top: "50%",
3623
3631
  left: "50%",
3624
3632
  transform: "translate(-50%, -50%)",
3625
- backgroundColor: "$dark50"
3633
+ backgroundColor: "$dark50",
3634
+ zIndex: "10001"
3626
3635
  });
3627
3636
  var ModalOverlay = styled(import_radix_ui.Dialog.Overlay, {
3628
3637
  position: "fixed",
3629
3638
  inset: 0,
3630
3639
  opacity: 1,
3631
- backgroundColor: "rgba(0, 0, 0, .5)"
3640
+ backgroundColor: "rgba(0, 0, 0, .5)",
3641
+ zIndex: "10000"
3632
3642
  });
3633
3643
  var ModalHeaderStyled = styled("div", {
3634
3644
  borderBottom: "1px solid $neutral300",
@@ -8749,9 +8759,270 @@ function TextareaField(_a) {
8749
8759
  ] });
8750
8760
  }
8751
8761
 
8762
+ // src/components/Toast/components/ToastItem.tsx
8763
+ var import_react10 = require("react");
8764
+
8765
+ // src/components/Toast/styles/index.ts
8766
+ var import_react9 = require("@stitches/react");
8767
+ var ToastPrimitive = __toESM(require("@radix-ui/react-toast"));
8768
+ var slideIn = (0, import_react9.keyframes)({
8769
+ from: {
8770
+ transform: "translateX(calc(100% + 25px))",
8771
+ opacity: 0
8772
+ },
8773
+ to: {
8774
+ transform: "translateX(0)",
8775
+ opacity: 1
8776
+ }
8777
+ });
8778
+ var slideOut = (0, import_react9.keyframes)({
8779
+ from: {
8780
+ transform: "translateX(0)",
8781
+ opacity: 1
8782
+ },
8783
+ to: {
8784
+ transform: "translateX(calc(100% + 25px))",
8785
+ opacity: 0
8786
+ }
8787
+ });
8788
+ var swipeOut = (0, import_react9.keyframes)({
8789
+ from: {
8790
+ transform: "translateX(var(--radix-toast-swipe-end-x))",
8791
+ opacity: 1
8792
+ },
8793
+ to: {
8794
+ transform: "translateX(calc(100% + 25px))",
8795
+ opacity: 0
8796
+ }
8797
+ });
8798
+ var ToastViewport = styled(ToastPrimitive.Viewport, {
8799
+ position: "fixed",
8800
+ top: 0,
8801
+ right: 0,
8802
+ display: "flex",
8803
+ flexDirection: "column",
8804
+ padding: 25,
8805
+ gap: 10,
8806
+ width: 390,
8807
+ maxWidth: "100vw",
8808
+ margin: 0,
8809
+ listStyle: "none",
8810
+ zIndex: 2147483647,
8811
+ outline: "none"
8812
+ });
8813
+ var ToastRoot = styled(ToastPrimitive.Root, {
8814
+ backgroundColor: "$neutral50",
8815
+ borderRadius: "$sm",
8816
+ boxShadow: "hsl(206 22% 7% / 35%) 0px 10px 38px -10px, hsl(206 22% 7% / 20%) 0px 10px 20px -15px",
8817
+ padding: "$16",
8818
+ gap: "$8",
8819
+ display: "flex",
8820
+ alignItems: "center",
8821
+ border: "1px solid",
8822
+ position: "relative",
8823
+ zIndex: 9999,
8824
+ '&[data-state="open"]': {
8825
+ animation: `${slideIn} 150ms cubic-bezier(0.16, 1, 0.3, 1)`
8826
+ },
8827
+ '&[data-state="closed"]': {
8828
+ animation: `${slideOut} 100ms ease-in`
8829
+ },
8830
+ '&[data-swipe="move"]': {
8831
+ transform: "translateX(var(--radix-toast-swipe-move-x))"
8832
+ },
8833
+ '&[data-swipe="cancel"]': {
8834
+ transform: "translateX(0)",
8835
+ transition: "transform 200ms ease-out"
8836
+ },
8837
+ '&[data-swipe="end"]': {
8838
+ animation: `${swipeOut} 100ms ease-out`
8839
+ },
8840
+ $$toastColor: "inherit",
8841
+ color: "$$toastColor",
8842
+ borderColor: "$$toastColor",
8843
+ variants: {
8844
+ type: {
8845
+ success: {
8846
+ $$toastColor: "$colors$success600",
8847
+ backgroundColor: "$success50"
8848
+ },
8849
+ error: {
8850
+ $$toastColor: "$colors$error600",
8851
+ backgroundColor: "$error50"
8852
+ },
8853
+ warning: {
8854
+ $$toastColor: "$colors$warning600",
8855
+ backgroundColor: "$warning50"
8856
+ },
8857
+ info: {
8858
+ $$toastColor: "$colors$info600",
8859
+ backgroundColor: "$info50"
8860
+ }
8861
+ }
8862
+ },
8863
+ defaultVariants: {
8864
+ type: "info"
8865
+ }
8866
+ });
8867
+ var ToastClose = styled(ToastPrimitive.Close, {
8868
+ border: "none",
8869
+ backgroundColor: "transparent",
8870
+ display: "flex",
8871
+ alignItems: "center",
8872
+ justifyContent: "center",
8873
+ color: "inherit",
8874
+ borderRadius: 4,
8875
+ padding: 4,
8876
+ cursor: "pointer",
8877
+ opacity: 0.7,
8878
+ "&:hover": {
8879
+ opacity: 1,
8880
+ backgroundColor: "rgba(0, 0, 0, 0.05)"
8881
+ },
8882
+ "&:focus": {
8883
+ boxShadow: "0 0 0 2px currentColor",
8884
+ opacity: 1
8885
+ }
8886
+ });
8887
+
8888
+ // src/components/Toast/components/ToastItem.tsx
8889
+ var import_jsx_runtime21 = require("react/jsx-runtime");
8890
+ function ToastItem({
8891
+ toast,
8892
+ onRemove
8893
+ }) {
8894
+ const [open, setOpen] = (0, import_react10.useState)(true);
8895
+ const handleOpenChange = (open2) => {
8896
+ setOpen(open2);
8897
+ if (!open2) {
8898
+ onRemove(toast.id);
8899
+ }
8900
+ };
8901
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
8902
+ ToastRoot,
8903
+ {
8904
+ type: toast.type,
8905
+ duration: toast.duration,
8906
+ open,
8907
+ onOpenChange: handleOpenChange,
8908
+ children: [
8909
+ (toast == null ? void 0 : toast.icon) && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Icon_default, { name: toast.icon, size: "xl" }),
8910
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { flex: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Text, { typography: "bodyS", fontWeight: "medium", children: toast.message }) }),
8911
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ToastClose, { "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Icon_default, { name: "xmark", size: "md" }) })
8912
+ ]
8913
+ }
8914
+ );
8915
+ }
8916
+
8917
+ // src/components/Toast/components/ToastProvider.tsx
8918
+ var import_react11 = require("react");
8919
+ var ToastPrimitive2 = __toESM(require("@radix-ui/react-toast"));
8920
+ var import_jsx_runtime22 = require("react/jsx-runtime");
8921
+ var ToastContext = (0, import_react11.createContext)(null);
8922
+ function ToastProvider({
8923
+ children,
8924
+ defaultDuration = 5e3,
8925
+ maxToasts = 5,
8926
+ swipeDirection = "right"
8927
+ }) {
8928
+ const [toasts, setToasts] = (0, import_react11.useState)([]);
8929
+ const addToast = (toastData) => {
8930
+ const id = Math.random().toString(36).substr(2, 9);
8931
+ const newToast = __spreadProps(__spreadValues({
8932
+ id
8933
+ }, toastData), {
8934
+ type: (toastData == null ? void 0 : toastData.type) || "info",
8935
+ duration: (toastData == null ? void 0 : toastData.duration) || defaultDuration,
8936
+ createdAt: Date.now()
8937
+ });
8938
+ setToasts((prevToasts) => {
8939
+ const updatedToasts = [...prevToasts, newToast];
8940
+ return updatedToasts.slice(-maxToasts);
8941
+ });
8942
+ return id;
8943
+ };
8944
+ const removeToast = (id) => {
8945
+ setToasts((prevToasts) => prevToasts.filter((toast) => toast.id !== id));
8946
+ };
8947
+ const removeAllToasts = () => {
8948
+ setToasts([]);
8949
+ };
8950
+ const contextValue = {
8951
+ toasts,
8952
+ addToast,
8953
+ removeToast,
8954
+ removeAllToasts
8955
+ };
8956
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ToastContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(ToastPrimitive2.Provider, { swipeDirection, children: [
8957
+ children,
8958
+ toasts.map((toast) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ToastItem, { toast, onRemove: removeToast }, toast.id)),
8959
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ToastViewport, {})
8960
+ ] }) });
8961
+ }
8962
+
8963
+ // src/components/Toast/hooks/useToast.ts
8964
+ var import_react12 = require("react");
8965
+ var useToast = () => {
8966
+ const context = (0, import_react12.useContext)(ToastContext);
8967
+ if (!context) {
8968
+ throw new Error("useToast deve ser usado dentro de um ToastProvider");
8969
+ }
8970
+ return context;
8971
+ };
8972
+
8973
+ // src/components/Tooltip/index.tsx
8974
+ var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"));
8975
+ var import_jsx_runtime23 = require("react/jsx-runtime");
8976
+ var TooltipProvider = TooltipPrimitive.Provider;
8977
+ var TooltipRoot = TooltipPrimitive.Root;
8978
+ var TooltipTrigger = TooltipPrimitive.Trigger;
8979
+ var TooltipContent = styled(TooltipPrimitive.Content, {
8980
+ backgroundColor: "$dark800",
8981
+ color: "$neutral50",
8982
+ borderRadius: "4px",
8983
+ padding: "10px 15px",
8984
+ fontSize: "14px",
8985
+ lineHeight: 1,
8986
+ zIndex: 100,
8987
+ boxShadow: "0 2px 10px rgba(0, 0, 0, 0.1)",
8988
+ userSelect: "none",
8989
+ animationDuration: "400ms",
8990
+ animationTimingFunction: "cubic-bezier(0.16, 1, 0.3, 1)",
8991
+ willChange: "transform, opacity",
8992
+ '&[data-state="delayed-open"][data-side="top"]': {
8993
+ animationName: "slideDownAndFade"
8994
+ },
8995
+ '&[data-state="delayed-open"][data-side="right"]': {
8996
+ animationName: "slideLeftAndFade"
8997
+ },
8998
+ '&[data-state="delayed-open"][data-side="bottom"]': {
8999
+ animationName: "slideUpAndFade"
9000
+ },
9001
+ '&[data-state="delayed-open"][data-side="left"]': {
9002
+ animationName: "slideRightAndFade"
9003
+ }
9004
+ });
9005
+ var TooltipArrow = styled(TooltipPrimitive.Arrow, {
9006
+ fill: "$dark800"
9007
+ });
9008
+ function Tooltip({
9009
+ children,
9010
+ content,
9011
+ delayDuration = 200,
9012
+ side = "top"
9013
+ }) {
9014
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(TooltipRoot, { delayDuration, children: [
9015
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipTrigger, { asChild: true, children }),
9016
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(TooltipContent, { side, sideOffset: 5, children: [
9017
+ typeof content === "string" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text, { typography: "tooltip", children: content }) : content,
9018
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipArrow, {})
9019
+ ] })
9020
+ ] }) });
9021
+ }
9022
+
8752
9023
  // src/components/Grid.tsx
8753
9024
  var import_themes19 = require("@radix-ui/themes");
8754
- var import_jsx_runtime21 = require("react/jsx-runtime");
9025
+ var import_jsx_runtime24 = require("react/jsx-runtime");
8755
9026
  var GridStyled = styled(import_themes19.Grid, {
8756
9027
  display: "grid",
8757
9028
  variants: {
@@ -8873,12 +9144,12 @@ var GridStyled = styled(import_themes19.Grid, {
8873
9144
  });
8874
9145
  function Grid(_a) {
8875
9146
  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
8876
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(GridStyled, __spreadProps(__spreadValues({}, props), { children }));
9147
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(GridStyled, __spreadProps(__spreadValues({}, props), { children }));
8877
9148
  }
8878
9149
 
8879
9150
  // src/components/Container.tsx
8880
9151
  var import_themes20 = require("@radix-ui/themes");
8881
- var import_jsx_runtime22 = require("react/jsx-runtime");
9152
+ var import_jsx_runtime25 = require("react/jsx-runtime");
8882
9153
  var ContainerStyled = styled(import_themes20.Container, {
8883
9154
  variants: {
8884
9155
  size: {
@@ -8908,12 +9179,12 @@ var ContainerStyled = styled(import_themes20.Container, {
8908
9179
  });
8909
9180
  function Container(_a) {
8910
9181
  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
8911
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ContainerStyled, __spreadProps(__spreadValues({}, props), { children }));
9182
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ContainerStyled, __spreadProps(__spreadValues({}, props), { children }));
8912
9183
  }
8913
9184
 
8914
9185
  // src/components/Section.tsx
8915
9186
  var import_themes21 = require("@radix-ui/themes");
8916
- var import_jsx_runtime23 = require("react/jsx-runtime");
9187
+ var import_jsx_runtime26 = require("react/jsx-runtime");
8917
9188
  var SectionStyled = styled(import_themes21.Section, {
8918
9189
  variants: {
8919
9190
  size: {
@@ -8937,7 +9208,7 @@ var SectionStyled = styled(import_themes21.Section, {
8937
9208
  });
8938
9209
  function Section(_a) {
8939
9210
  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
8940
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SectionStyled, __spreadProps(__spreadValues({}, props), { children }));
9211
+ return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SectionStyled, __spreadProps(__spreadValues({}, props), { children }));
8941
9212
  }
8942
9213
  // Annotate the CommonJS export names for ESM import in node:
8943
9214
  0 && (module.exports = {
@@ -9005,8 +9276,16 @@ function Section(_a) {
9005
9276
  TimePickerFooterStyled,
9006
9277
  TimePickerStyled,
9007
9278
  TimerPickerContentStyled,
9279
+ ToastItem,
9280
+ ToastProvider,
9281
+ Tooltip,
9282
+ TooltipContent,
9283
+ TooltipProvider,
9284
+ TooltipRoot,
9285
+ TooltipTrigger,
9008
9286
  maskFormat,
9009
- maskUnformat
9287
+ maskUnformat,
9288
+ useToast
9010
9289
  });
9011
9290
  /*! Bundled license information:
9012
9291
 
package/dist/index.mjs CHANGED
@@ -3544,13 +3544,15 @@ var ModalContentStyled = styled(ModalRadix.Content, {
3544
3544
  top: "50%",
3545
3545
  left: "50%",
3546
3546
  transform: "translate(-50%, -50%)",
3547
- backgroundColor: "$dark50"
3547
+ backgroundColor: "$dark50",
3548
+ zIndex: "10001"
3548
3549
  });
3549
3550
  var ModalOverlay = styled(ModalRadix.Overlay, {
3550
3551
  position: "fixed",
3551
3552
  inset: 0,
3552
3553
  opacity: 1,
3553
- backgroundColor: "rgba(0, 0, 0, .5)"
3554
+ backgroundColor: "rgba(0, 0, 0, .5)",
3555
+ zIndex: "10000"
3554
3556
  });
3555
3557
  var ModalHeaderStyled = styled("div", {
3556
3558
  borderBottom: "1px solid $neutral300",
@@ -8671,9 +8673,270 @@ function TextareaField(_a) {
8671
8673
  ] });
8672
8674
  }
8673
8675
 
8676
+ // src/components/Toast/components/ToastItem.tsx
8677
+ import { useState as useState3 } from "react";
8678
+
8679
+ // src/components/Toast/styles/index.ts
8680
+ import { keyframes as keyframes2 } from "@stitches/react";
8681
+ import * as ToastPrimitive from "@radix-ui/react-toast";
8682
+ var slideIn = keyframes2({
8683
+ from: {
8684
+ transform: "translateX(calc(100% + 25px))",
8685
+ opacity: 0
8686
+ },
8687
+ to: {
8688
+ transform: "translateX(0)",
8689
+ opacity: 1
8690
+ }
8691
+ });
8692
+ var slideOut = keyframes2({
8693
+ from: {
8694
+ transform: "translateX(0)",
8695
+ opacity: 1
8696
+ },
8697
+ to: {
8698
+ transform: "translateX(calc(100% + 25px))",
8699
+ opacity: 0
8700
+ }
8701
+ });
8702
+ var swipeOut = keyframes2({
8703
+ from: {
8704
+ transform: "translateX(var(--radix-toast-swipe-end-x))",
8705
+ opacity: 1
8706
+ },
8707
+ to: {
8708
+ transform: "translateX(calc(100% + 25px))",
8709
+ opacity: 0
8710
+ }
8711
+ });
8712
+ var ToastViewport = styled(ToastPrimitive.Viewport, {
8713
+ position: "fixed",
8714
+ top: 0,
8715
+ right: 0,
8716
+ display: "flex",
8717
+ flexDirection: "column",
8718
+ padding: 25,
8719
+ gap: 10,
8720
+ width: 390,
8721
+ maxWidth: "100vw",
8722
+ margin: 0,
8723
+ listStyle: "none",
8724
+ zIndex: 2147483647,
8725
+ outline: "none"
8726
+ });
8727
+ var ToastRoot = styled(ToastPrimitive.Root, {
8728
+ backgroundColor: "$neutral50",
8729
+ borderRadius: "$sm",
8730
+ boxShadow: "hsl(206 22% 7% / 35%) 0px 10px 38px -10px, hsl(206 22% 7% / 20%) 0px 10px 20px -15px",
8731
+ padding: "$16",
8732
+ gap: "$8",
8733
+ display: "flex",
8734
+ alignItems: "center",
8735
+ border: "1px solid",
8736
+ position: "relative",
8737
+ zIndex: 9999,
8738
+ '&[data-state="open"]': {
8739
+ animation: `${slideIn} 150ms cubic-bezier(0.16, 1, 0.3, 1)`
8740
+ },
8741
+ '&[data-state="closed"]': {
8742
+ animation: `${slideOut} 100ms ease-in`
8743
+ },
8744
+ '&[data-swipe="move"]': {
8745
+ transform: "translateX(var(--radix-toast-swipe-move-x))"
8746
+ },
8747
+ '&[data-swipe="cancel"]': {
8748
+ transform: "translateX(0)",
8749
+ transition: "transform 200ms ease-out"
8750
+ },
8751
+ '&[data-swipe="end"]': {
8752
+ animation: `${swipeOut} 100ms ease-out`
8753
+ },
8754
+ $$toastColor: "inherit",
8755
+ color: "$$toastColor",
8756
+ borderColor: "$$toastColor",
8757
+ variants: {
8758
+ type: {
8759
+ success: {
8760
+ $$toastColor: "$colors$success600",
8761
+ backgroundColor: "$success50"
8762
+ },
8763
+ error: {
8764
+ $$toastColor: "$colors$error600",
8765
+ backgroundColor: "$error50"
8766
+ },
8767
+ warning: {
8768
+ $$toastColor: "$colors$warning600",
8769
+ backgroundColor: "$warning50"
8770
+ },
8771
+ info: {
8772
+ $$toastColor: "$colors$info600",
8773
+ backgroundColor: "$info50"
8774
+ }
8775
+ }
8776
+ },
8777
+ defaultVariants: {
8778
+ type: "info"
8779
+ }
8780
+ });
8781
+ var ToastClose = styled(ToastPrimitive.Close, {
8782
+ border: "none",
8783
+ backgroundColor: "transparent",
8784
+ display: "flex",
8785
+ alignItems: "center",
8786
+ justifyContent: "center",
8787
+ color: "inherit",
8788
+ borderRadius: 4,
8789
+ padding: 4,
8790
+ cursor: "pointer",
8791
+ opacity: 0.7,
8792
+ "&:hover": {
8793
+ opacity: 1,
8794
+ backgroundColor: "rgba(0, 0, 0, 0.05)"
8795
+ },
8796
+ "&:focus": {
8797
+ boxShadow: "0 0 0 2px currentColor",
8798
+ opacity: 1
8799
+ }
8800
+ });
8801
+
8802
+ // src/components/Toast/components/ToastItem.tsx
8803
+ import { jsx as jsx21, jsxs as jsxs9 } from "react/jsx-runtime";
8804
+ function ToastItem({
8805
+ toast,
8806
+ onRemove
8807
+ }) {
8808
+ const [open, setOpen] = useState3(true);
8809
+ const handleOpenChange = (open2) => {
8810
+ setOpen(open2);
8811
+ if (!open2) {
8812
+ onRemove(toast.id);
8813
+ }
8814
+ };
8815
+ return /* @__PURE__ */ jsxs9(
8816
+ ToastRoot,
8817
+ {
8818
+ type: toast.type,
8819
+ duration: toast.duration,
8820
+ open,
8821
+ onOpenChange: handleOpenChange,
8822
+ children: [
8823
+ (toast == null ? void 0 : toast.icon) && /* @__PURE__ */ jsx21(Icon_default, { name: toast.icon, size: "xl" }),
8824
+ /* @__PURE__ */ jsx21("div", { style: { flex: 1 }, children: /* @__PURE__ */ jsx21(Text, { typography: "bodyS", fontWeight: "medium", children: toast.message }) }),
8825
+ /* @__PURE__ */ jsx21(ToastClose, { "aria-label": "Close", children: /* @__PURE__ */ jsx21(Icon_default, { name: "xmark", size: "md" }) })
8826
+ ]
8827
+ }
8828
+ );
8829
+ }
8830
+
8831
+ // src/components/Toast/components/ToastProvider.tsx
8832
+ import { createContext, useState as useState4 } from "react";
8833
+ import * as ToastPrimitive2 from "@radix-ui/react-toast";
8834
+ import { jsx as jsx22, jsxs as jsxs10 } from "react/jsx-runtime";
8835
+ var ToastContext = createContext(null);
8836
+ function ToastProvider({
8837
+ children,
8838
+ defaultDuration = 5e3,
8839
+ maxToasts = 5,
8840
+ swipeDirection = "right"
8841
+ }) {
8842
+ const [toasts, setToasts] = useState4([]);
8843
+ const addToast = (toastData) => {
8844
+ const id = Math.random().toString(36).substr(2, 9);
8845
+ const newToast = __spreadProps(__spreadValues({
8846
+ id
8847
+ }, toastData), {
8848
+ type: (toastData == null ? void 0 : toastData.type) || "info",
8849
+ duration: (toastData == null ? void 0 : toastData.duration) || defaultDuration,
8850
+ createdAt: Date.now()
8851
+ });
8852
+ setToasts((prevToasts) => {
8853
+ const updatedToasts = [...prevToasts, newToast];
8854
+ return updatedToasts.slice(-maxToasts);
8855
+ });
8856
+ return id;
8857
+ };
8858
+ const removeToast = (id) => {
8859
+ setToasts((prevToasts) => prevToasts.filter((toast) => toast.id !== id));
8860
+ };
8861
+ const removeAllToasts = () => {
8862
+ setToasts([]);
8863
+ };
8864
+ const contextValue = {
8865
+ toasts,
8866
+ addToast,
8867
+ removeToast,
8868
+ removeAllToasts
8869
+ };
8870
+ return /* @__PURE__ */ jsx22(ToastContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs10(ToastPrimitive2.Provider, { swipeDirection, children: [
8871
+ children,
8872
+ toasts.map((toast) => /* @__PURE__ */ jsx22(ToastItem, { toast, onRemove: removeToast }, toast.id)),
8873
+ /* @__PURE__ */ jsx22(ToastViewport, {})
8874
+ ] }) });
8875
+ }
8876
+
8877
+ // src/components/Toast/hooks/useToast.ts
8878
+ import { useContext } from "react";
8879
+ var useToast = () => {
8880
+ const context = useContext(ToastContext);
8881
+ if (!context) {
8882
+ throw new Error("useToast deve ser usado dentro de um ToastProvider");
8883
+ }
8884
+ return context;
8885
+ };
8886
+
8887
+ // src/components/Tooltip/index.tsx
8888
+ import * as TooltipPrimitive from "@radix-ui/react-tooltip";
8889
+ import { jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
8890
+ var TooltipProvider = TooltipPrimitive.Provider;
8891
+ var TooltipRoot = TooltipPrimitive.Root;
8892
+ var TooltipTrigger = TooltipPrimitive.Trigger;
8893
+ var TooltipContent = styled(TooltipPrimitive.Content, {
8894
+ backgroundColor: "$dark800",
8895
+ color: "$neutral50",
8896
+ borderRadius: "4px",
8897
+ padding: "10px 15px",
8898
+ fontSize: "14px",
8899
+ lineHeight: 1,
8900
+ zIndex: 100,
8901
+ boxShadow: "0 2px 10px rgba(0, 0, 0, 0.1)",
8902
+ userSelect: "none",
8903
+ animationDuration: "400ms",
8904
+ animationTimingFunction: "cubic-bezier(0.16, 1, 0.3, 1)",
8905
+ willChange: "transform, opacity",
8906
+ '&[data-state="delayed-open"][data-side="top"]': {
8907
+ animationName: "slideDownAndFade"
8908
+ },
8909
+ '&[data-state="delayed-open"][data-side="right"]': {
8910
+ animationName: "slideLeftAndFade"
8911
+ },
8912
+ '&[data-state="delayed-open"][data-side="bottom"]': {
8913
+ animationName: "slideUpAndFade"
8914
+ },
8915
+ '&[data-state="delayed-open"][data-side="left"]': {
8916
+ animationName: "slideRightAndFade"
8917
+ }
8918
+ });
8919
+ var TooltipArrow = styled(TooltipPrimitive.Arrow, {
8920
+ fill: "$dark800"
8921
+ });
8922
+ function Tooltip({
8923
+ children,
8924
+ content,
8925
+ delayDuration = 200,
8926
+ side = "top"
8927
+ }) {
8928
+ return /* @__PURE__ */ jsx23(TooltipProvider, { children: /* @__PURE__ */ jsxs11(TooltipRoot, { delayDuration, children: [
8929
+ /* @__PURE__ */ jsx23(TooltipTrigger, { asChild: true, children }),
8930
+ /* @__PURE__ */ jsxs11(TooltipContent, { side, sideOffset: 5, children: [
8931
+ typeof content === "string" ? /* @__PURE__ */ jsx23(Text, { typography: "tooltip", children: content }) : content,
8932
+ /* @__PURE__ */ jsx23(TooltipArrow, {})
8933
+ ] })
8934
+ ] }) });
8935
+ }
8936
+
8674
8937
  // src/components/Grid.tsx
8675
8938
  import { Grid as GridRadix } from "@radix-ui/themes";
8676
- import { jsx as jsx21 } from "react/jsx-runtime";
8939
+ import { jsx as jsx24 } from "react/jsx-runtime";
8677
8940
  var GridStyled = styled(GridRadix, {
8678
8941
  display: "grid",
8679
8942
  variants: {
@@ -8795,12 +9058,12 @@ var GridStyled = styled(GridRadix, {
8795
9058
  });
8796
9059
  function Grid(_a) {
8797
9060
  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
8798
- return /* @__PURE__ */ jsx21(GridStyled, __spreadProps(__spreadValues({}, props), { children }));
9061
+ return /* @__PURE__ */ jsx24(GridStyled, __spreadProps(__spreadValues({}, props), { children }));
8799
9062
  }
8800
9063
 
8801
9064
  // src/components/Container.tsx
8802
9065
  import { Container as ContainerRadix } from "@radix-ui/themes";
8803
- import { jsx as jsx22 } from "react/jsx-runtime";
9066
+ import { jsx as jsx25 } from "react/jsx-runtime";
8804
9067
  var ContainerStyled = styled(ContainerRadix, {
8805
9068
  variants: {
8806
9069
  size: {
@@ -8830,12 +9093,12 @@ var ContainerStyled = styled(ContainerRadix, {
8830
9093
  });
8831
9094
  function Container(_a) {
8832
9095
  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
8833
- return /* @__PURE__ */ jsx22(ContainerStyled, __spreadProps(__spreadValues({}, props), { children }));
9096
+ return /* @__PURE__ */ jsx25(ContainerStyled, __spreadProps(__spreadValues({}, props), { children }));
8834
9097
  }
8835
9098
 
8836
9099
  // src/components/Section.tsx
8837
9100
  import { Section as SectionRadix } from "@radix-ui/themes";
8838
- import { jsx as jsx23 } from "react/jsx-runtime";
9101
+ import { jsx as jsx26 } from "react/jsx-runtime";
8839
9102
  var SectionStyled = styled(SectionRadix, {
8840
9103
  variants: {
8841
9104
  size: {
@@ -8859,7 +9122,7 @@ var SectionStyled = styled(SectionRadix, {
8859
9122
  });
8860
9123
  function Section(_a) {
8861
9124
  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
8862
- return /* @__PURE__ */ jsx23(SectionStyled, __spreadProps(__spreadValues({}, props), { children }));
9125
+ return /* @__PURE__ */ jsx26(SectionStyled, __spreadProps(__spreadValues({}, props), { children }));
8863
9126
  }
8864
9127
  export {
8865
9128
  Alert,
@@ -8926,8 +9189,16 @@ export {
8926
9189
  TimePickerFooterStyled,
8927
9190
  TimePickerStyled,
8928
9191
  TimerPickerContentStyled,
9192
+ ToastItem,
9193
+ ToastProvider,
9194
+ Tooltip,
9195
+ TooltipContent,
9196
+ TooltipProvider,
9197
+ TooltipRoot,
9198
+ TooltipTrigger,
8929
9199
  maskFormat,
8930
- maskUnformat
9200
+ maskUnformat,
9201
+ useToast
8931
9202
  };
8932
9203
  /*! Bundled license information:
8933
9204