@lets-events/react 12.2.9 → 12.2.11

package/src/hooks/useOnClickOutside.tsx

@@ -1,42 +1,42 @@
-import { useEffect } from "react";
-
-export function useOnClickOutside(
-  ref: any,
-  handler: (event?: MouseEvent | TouchEvent) => void
-) {
-  useEffect(() => {
-    const listener = (event: MouseEvent | TouchEvent) => {
-      if (!ref?.current || !event.target) {
-        return;
-      }
-
-      const target = event.target as Element;
-      const currentTarget = event.currentTarget as Element;
-
-      if (ref.current.contains(target) || ref.current.contains(currentTarget)) {
-        return;
-      }
-
-      if (target.tagName === "HTML" || target.tagName === "BODY") {
-        const elementAtPoint = document.elementFromPoint(
-          (event as MouseEvent).clientX,
-          (event as MouseEvent).clientY
-        );
-
-        if (elementAtPoint && ref.current.contains(elementAtPoint)) {
-          return;
-        }
-      }
-
-      handler(event);
-    };
-
-    document.addEventListener("mousedown", listener);
-    document.addEventListener("touchstart", listener);
-
-    return () => {
-      document.removeEventListener("mousedown", listener);
-      document.removeEventListener("touchstart", listener);
-    };
-  }, [ref, handler]);
-}
+import { useEffect } from "react";
+
+export function useOnClickOutside(
+  ref: any,
+  handler: (event?: MouseEvent | TouchEvent) => void
+) {
+  useEffect(() => {
+    const listener = (event: MouseEvent | TouchEvent) => {
+      if (!ref?.current || !event.target) {
+        return;
+      }
+
+      const target = event.target as Element;
+      const currentTarget = event.currentTarget as Element;
+
+      if (ref.current.contains(target) || ref.current.contains(currentTarget)) {
+        return;
+      }
+
+      if (target.tagName === "HTML" || target.tagName === "BODY") {
+        const elementAtPoint = document.elementFromPoint(
+          (event as MouseEvent).clientX,
+          (event as MouseEvent).clientY
+        );
+
+        if (elementAtPoint && ref.current.contains(elementAtPoint)) {
+          return;
+        }
+      }
+
+      handler(event);
+    };
+
+    document.addEventListener("mousedown", listener);
+    document.addEventListener("touchstart", listener);
+
+    return () => {
+      document.removeEventListener("mousedown", listener);
+      document.removeEventListener("touchstart", listener);
+    };
+  }, [ref, handler]);
+}

package/src/index.tsx

@@ -1,68 +1,69 @@
-// Icon
-export * from "./components/Icon";
-
-// Text
-export * from "./components/Text";
-
-// Components
-export * from "./components/Button";
-export * from "./components/ButtonGroup";
-export * from "./components/Avatar";
-export * from "./components/TextField";
-export * from "./components/RadioGroup";
-export * from "./components/CheckboxGroup";
-export * from "./components/Filter";
-export * from "./components/Dropdown";
-export * from "./components/Badge";
-export * from "./components/Modal";
-export * from "./components/MenuDropdown";
-export * from "./components/Calendar";
-export * from "./components/Drawer";
-export * from "./components/TimePicker";
-export * from "./components/Alert";
-export * from "./components/Switch";
-export * from "./components/Step";
-export * from "./components/Card";
-export * from "./components/TextareaField";
-export * from "./components/Toast";
-export * from "./components/Tooltip";
-export * from "./components/MultiSelect";
-
-// Layouts
-export * from "./components/Flex";
-export * from "./components/Box";
-export * from "./components/Grid";
-export * from "./components/Container";
-export * from "./components/Section";
-
-//Form
-export * from "./components/FormFields/subComponents/ErrorFormMessage";
-export * from "./components/FormFields/subComponents/FormLabel";
-export * from "./components/FormFields/TextAreaFormField";
-export * from "./components/FormFields/TextFormField";
-export * from "./components/FormFields/Form";
-export * from "./components/FormFields/MultiSelectFormField";
-export * from "./components/FormFields/PhoneFormField";
-export * from "./components/FormFields/CPFFormField";
-export * from "./components/FormFields/CNPJFormField";
-export * from "./components/FormFields/BirthDateFormField";
-export * from "./components/FormFields/IdentityDocumentNumberFormField";
-export * from "./components/FormFields/AddressFormFields/index";
-export * from "./components/FormFields/RadioGroupFormField";
-export * from "./components/FormFields/CheckboxGroupFormField";
-export * from "./components/FormFields/AddressFormFields/CountryFormField";
-export * from "./components/FormFields/SelectFormField";
-export * from "./components/FormFields/SwitchFormField";
-export * from "./components/FormFields/EmailFormField";
-export * from "./components/FormFields/RichEditorFormField";
-export * from "./components/FormFields/CalendarFormField";
-export * from "./components/FormFields/TimePickerFormField";
-
-// Rich Editor
-export * from "./components/RichEditor";
-
-// Hooks
-export * from "./hooks/useImageUpload";
-
-// Utils
-export * from "./utils/uploadService";
+// Icon
+export * from "./components/Icon";
+
+// Text
+export * from "./components/Text";
+
+// Components
+export * from "./components/Button";
+export * from "./components/ButtonGroup";
+export * from "./components/Avatar";
+export * from "./components/TextField";
+export * from "./components/RadioGroup";
+export * from "./components/CheckboxGroup";
+export * from "./components/Filter";
+export * from "./components/Dropdown";
+export * from "./components/Badge";
+export * from "./components/Modal";
+export * from "./components/MenuDropdown";
+export * from "./components/Calendar";
+export * from "./components/Drawer";
+export * from "./components/TimePicker";
+export * from "./components/Alert";
+export * from "./components/Switch";
+export * from "./components/Step";
+export * from "./components/Card";
+export * from "./components/TextareaField";
+export * from "./components/Toast";
+export * from "./components/Tooltip";
+export * from "./components/MultiSelect";
+export * from "./components/Divider";
+
+// Layouts
+export * from "./components/Flex";
+export * from "./components/Box";
+export * from "./components/Grid";
+export * from "./components/Container";
+export * from "./components/Section";
+
+//Form
+export * from "./components/FormFields/subComponents/ErrorFormMessage";
+export * from "./components/FormFields/subComponents/FormLabel";
+export * from "./components/FormFields/TextAreaFormField";
+export * from "./components/FormFields/TextFormField";
+export * from "./components/FormFields/Form";
+export * from "./components/FormFields/MultiSelectFormField";
+export * from "./components/FormFields/PhoneFormField";
+export * from "./components/FormFields/CPFFormField";
+export * from "./components/FormFields/CNPJFormField";
+export * from "./components/FormFields/BirthDateFormField";
+export * from "./components/FormFields/IdentityDocumentNumberFormField";
+export * from "./components/FormFields/AddressFormFields/index";
+export * from "./components/FormFields/RadioGroupFormField";
+export * from "./components/FormFields/CheckboxGroupFormField";
+export * from "./components/FormFields/AddressFormFields/CountryFormField";
+export * from "./components/FormFields/SelectFormField";
+export * from "./components/FormFields/SwitchFormField";
+export * from "./components/FormFields/EmailFormField";
+export * from "./components/FormFields/RichEditorFormField";
+export * from "./components/FormFields/CalendarFormField";
+export * from "./components/FormFields/TimePickerFormField";
+
+// Rich Editor
+export * from "./components/RichEditor";
+
+// Hooks
+export * from "./hooks/useImageUpload";
+
+// Utils
+export * from "./utils/uploadService";

package/src/styles/index.ts

@@ -1,38 +1,38 @@
-import {
-  colors,
-  fontSizes,
-  fontWeights,
-  fonts,
-  lineHeights,
-  radii,
-  space,
-} from '@lets-events/tokens'
-
-import { createStitches, defaultThemeMap } from '@stitches/react'
-
-export const {
-  styled,
-  css,
-  globalCss,
-  keyframes,
-  getCssText,
-  theme,
-  createTheme,
-  config,
-} = createStitches({
-  themeMap: {
-    ...defaultThemeMap,
-    height: 'space',
-    width: 'space',
-    gap: 'space'
-  },
-  theme: {
-    colors,
-    fontSizes,
-    fonts,
-    fontWeights,
-    lineHeights,
-    radii,
-    space,
-  },
-})
+import {
+  colors,
+  fontSizes,
+  fontWeights,
+  fonts,
+  lineHeights,
+  radii,
+  space,
+} from '@lets-events/tokens'
+
+import { createStitches, defaultThemeMap } from '@stitches/react'
+
+export const {
+  styled,
+  css,
+  globalCss,
+  keyframes,
+  getCssText,
+  theme,
+  createTheme,
+  config,
+} = createStitches({
+  themeMap: {
+    ...defaultThemeMap,
+    height: 'space',
+    width: 'space',
+    gap: 'space'
+  },
+  theme: {
+    colors,
+    fontSizes,
+    fonts,
+    fontWeights,
+    lineHeights,
+    radii,
+    space,
+  },
+})

package/src/types/typographyValues.ts

@@ -1,179 +1,179 @@
-export const typographyValues = {
-    displayLarge: {
-        fontSize: '$displayLarge',
-        lineHeight: '$displayLarge',
-        letterSpacing: '$displayLarge',
-
-    },
-    displayMedium: {
-        fontSize: '$displayMedium',
-        lineHeight: '$displayMedium',
-        letterSpacing: '$displayMedium',
-    },
-    displaySmall: {
-        fontSize: '$displaySmall',
-        lineHeight: '$displaySmall',
-        letterSpacing: '$displaySmall',
-    },
-    headline1: {
-        fontSize: '$headline1',
-        lineHeight: '$headline1',
-    },
-    headline2: {
-        fontSize: '$headline2',
-        lineHeight: '$headline2',
-    },
-    headline3: {
-        fontSize: '$headline3',
-        lineHeight: '$headline3',
-    },
-    headline4: {
-        fontSize: '$headline4',
-        lineHeight: '$headline4',
-    },
-    headline5: {
-        fontSize: '$headline5',
-        lineHeight: '$headline5',
-    },
-    headline6: {
-        fontSize: '$headline6',
-        lineHeight: '$headline6',
-    },
-    headline7: {
-        fontSize: '$headline7',
-        lineHeight: '$headline7',
-    },
-    headline8: {
-        fontSize: '$headline8',
-        lineHeight: '$headline8',
-    },
-    bodyXL: {
-        fontSize: '$bodyXL',
-        lineHeight: '$bodyXL',
-    },
-    bodyL: {
-        fontSize: '$bodyL',
-        lineHeight: '$bodyL',
-    },
-    bodyM: {
-        fontSize: '$bodyM',
-        lineHeight: '$bodyM',
-    },
-    bodyS: {
-        fontSize: '$bodyS',
-        lineHeight: '$bodyS',
-    },
-    bodyXS: {
-        fontSize: '$bodyXS',
-        lineHeight: '$bodyXS',
-    },
-    bodyXXS: {
-        fontSize: '$bodyXXS',
-        lineHeight: '$bodyXXS',
-    },
-    badgeLarge: {
-        fontSize: '$badgeLarge',
-        lineHeight: '$badgeLarge',
-    },
-    badgeMedium: {
-        fontSize: '$badgeMedium',
-        lineHeight: '$badgeMedium',
-    },
-    badgeSmall: {
-        fontSize: '$badgeSmall',
-        lineHeight: '$badgeSmall',
-    },
-    badgeExtraSmall: {
-        fontSize: '$badgeExtraSmall',
-        lineHeight: '$badgeExtraSmall',
-    },
-    tooltip: {
-        fontSize: '$tooltip',
-        lineHeight: '$tooltip',
-    },
-    popoversRegular: {
-        fontSize: '$popoversRegular',
-        lineHeight: '$popoversRegular',
-    },
-    captionLarge: {
-        fontSize: '$captionLarge',
-        lineHeight: '$captionLarge',
-    },
-    captionMedium: {
-        fontSize: '$captionMedium',
-        lineHeight: '$captionMedium',
-    },
-    captionSmall: {
-        fontSize: '$captionSmall',
-        lineHeight: '$captionSmall',
-    },
-    buttonLarge: {
-        fontSize: '$buttonLarge',
-        lineHeight: '$buttonLarge',
-    },
-    buttonMedium: {
-        fontSize: '$buttonMedium',
-        lineHeight: '$buttonMedium',
-    },
-    buttonSmall: {
-        fontSize: '$buttonSmall',
-        lineHeight: '$buttonSmall',
-    },
-    buttonExtraSmall: {
-        fontSize: '$buttonExtraSmall',
-        lineHeight: '$buttonExtraSmall',
-    },
-    labelLarge: {
-        fontSize: '$labelLarge',
-        lineHeight: '$labelLarge',
-    },
-    labelMedium: {
-        fontSize: '$labelMedium',
-        lineHeight: '$labelMedium',
-    },
-    labelSmall: {
-        fontSize: '$labelSmall',
-        lineHeight: '$labelSmall',
-    },
-    labelExtraSmall: {
-        fontSize: '$labelExtraSmall',
-        lineHeight: '$labelExtraSmall',
-    },
-
-}
-export const typographyButtonValues = {
-    buttonLarge: {
-        fontSize: '$buttonLarge',
-        lineHeight: '$buttonLarge',
-    },
-    buttonMedium: {
-        fontSize: '$buttonMedium',
-        lineHeight: '$buttonMedium',
-    },
-    buttonSmall: {
-        fontSize: '$buttonSmall',
-        lineHeight: '$buttonSmall',
-    },
-    buttonExtraSmall: {
-        fontSize: '$buttonExtraSmall',
-        lineHeight: '$buttonExtraSmall',
-    },
-}
-export const typographyLabelValues = {
-    labelLarge: {
-        fontSize: '$labelLarge',
-        lineHeight: '$labelLarge',
-    },
-    labelMedium: {
-        fontSize: '$labelMedium',
-        lineHeight: '$labelMedium',
-    },
-    labelSmall: {
-        fontSize: '$labelSmall',
-        lineHeight: '$labelSmall',
-    },
-    labelExtraSmall: {
-        fontSize: '$labelExtraSmall',
-        lineHeight: '$labelExtraSmall',
-    },
+export const typographyValues = {
+    displayLarge: {
+        fontSize: '$displayLarge',
+        lineHeight: '$displayLarge',
+        letterSpacing: '$displayLarge',
+
+    },
+    displayMedium: {
+        fontSize: '$displayMedium',
+        lineHeight: '$displayMedium',
+        letterSpacing: '$displayMedium',
+    },
+    displaySmall: {
+        fontSize: '$displaySmall',
+        lineHeight: '$displaySmall',
+        letterSpacing: '$displaySmall',
+    },
+    headline1: {
+        fontSize: '$headline1',
+        lineHeight: '$headline1',
+    },
+    headline2: {
+        fontSize: '$headline2',
+        lineHeight: '$headline2',
+    },
+    headline3: {
+        fontSize: '$headline3',
+        lineHeight: '$headline3',
+    },
+    headline4: {
+        fontSize: '$headline4',
+        lineHeight: '$headline4',
+    },
+    headline5: {
+        fontSize: '$headline5',
+        lineHeight: '$headline5',
+    },
+    headline6: {
+        fontSize: '$headline6',
+        lineHeight: '$headline6',
+    },
+    headline7: {
+        fontSize: '$headline7',
+        lineHeight: '$headline7',
+    },
+    headline8: {
+        fontSize: '$headline8',
+        lineHeight: '$headline8',
+    },
+    bodyXL: {
+        fontSize: '$bodyXL',
+        lineHeight: '$bodyXL',
+    },
+    bodyL: {
+        fontSize: '$bodyL',
+        lineHeight: '$bodyL',
+    },
+    bodyM: {
+        fontSize: '$bodyM',
+        lineHeight: '$bodyM',
+    },
+    bodyS: {
+        fontSize: '$bodyS',
+        lineHeight: '$bodyS',
+    },
+    bodyXS: {
+        fontSize: '$bodyXS',
+        lineHeight: '$bodyXS',
+    },
+    bodyXXS: {
+        fontSize: '$bodyXXS',
+        lineHeight: '$bodyXXS',
+    },
+    badgeLarge: {
+        fontSize: '$badgeLarge',
+        lineHeight: '$badgeLarge',
+    },
+    badgeMedium: {
+        fontSize: '$badgeMedium',
+        lineHeight: '$badgeMedium',
+    },
+    badgeSmall: {
+        fontSize: '$badgeSmall',
+        lineHeight: '$badgeSmall',
+    },
+    badgeExtraSmall: {
+        fontSize: '$badgeExtraSmall',
+        lineHeight: '$badgeExtraSmall',
+    },
+    tooltip: {
+        fontSize: '$tooltip',
+        lineHeight: '$tooltip',
+    },
+    popoversRegular: {
+        fontSize: '$popoversRegular',
+        lineHeight: '$popoversRegular',
+    },
+    captionLarge: {
+        fontSize: '$captionLarge',
+        lineHeight: '$captionLarge',
+    },
+    captionMedium: {
+        fontSize: '$captionMedium',
+        lineHeight: '$captionMedium',
+    },
+    captionSmall: {
+        fontSize: '$captionSmall',
+        lineHeight: '$captionSmall',
+    },
+    buttonLarge: {
+        fontSize: '$buttonLarge',
+        lineHeight: '$buttonLarge',
+    },
+    buttonMedium: {
+        fontSize: '$buttonMedium',
+        lineHeight: '$buttonMedium',
+    },
+    buttonSmall: {
+        fontSize: '$buttonSmall',
+        lineHeight: '$buttonSmall',
+    },
+    buttonExtraSmall: {
+        fontSize: '$buttonExtraSmall',
+        lineHeight: '$buttonExtraSmall',
+    },
+    labelLarge: {
+        fontSize: '$labelLarge',
+        lineHeight: '$labelLarge',
+    },
+    labelMedium: {
+        fontSize: '$labelMedium',
+        lineHeight: '$labelMedium',
+    },
+    labelSmall: {
+        fontSize: '$labelSmall',
+        lineHeight: '$labelSmall',
+    },
+    labelExtraSmall: {
+        fontSize: '$labelExtraSmall',
+        lineHeight: '$labelExtraSmall',
+    },
+
+}
+export const typographyButtonValues = {
+    buttonLarge: {
+        fontSize: '$buttonLarge',
+        lineHeight: '$buttonLarge',
+    },
+    buttonMedium: {
+        fontSize: '$buttonMedium',
+        lineHeight: '$buttonMedium',
+    },
+    buttonSmall: {
+        fontSize: '$buttonSmall',
+        lineHeight: '$buttonSmall',
+    },
+    buttonExtraSmall: {
+        fontSize: '$buttonExtraSmall',
+        lineHeight: '$buttonExtraSmall',
+    },
+}
+export const typographyLabelValues = {
+    labelLarge: {
+        fontSize: '$labelLarge',
+        lineHeight: '$labelLarge',
+    },
+    labelMedium: {
+        fontSize: '$labelMedium',
+        lineHeight: '$labelMedium',
+    },
+    labelSmall: {
+        fontSize: '$labelSmall',
+        lineHeight: '$labelSmall',
+    },
+    labelExtraSmall: {
+        fontSize: '$labelExtraSmall',
+        lineHeight: '$labelExtraSmall',
+    },
 }

package/src/utils/getNestedValue.ts

@@ -1,3 +1,3 @@
-export function getNestedValue(obj: any, path: string): any {
-  return path.split(".").reduce((acc, key) => acc?.[key], obj);
-}
+export function getNestedValue(obj: any, path: string): any {
+  return path.split(".").reduce((acc, key) => acc?.[key], obj);
+}