@lets-events/react 12.2.0 → 12.2.1

package/.turbo/turbo-build.log

@@ -1,6 +1,6 @@
 
 
-> @lets-events/react@12.2.0 build
+> @lets-events/react@12.2.1 build
 > tsup src/index.tsx  --format esm,cjs --dts --external react
 
 CLI Building entry: src/index.tsx
@@ -10,12 +10,12 @@
 CLI Target: es6
 ESM Build start
 CJS Build start
-CJS dist/index.js 391.96 KB
-CJS ⚡️ Build success in 499ms
-ESM dist/index.mjs 378.06 KB
-ESM ⚡️ Build success in 501ms
+ESM dist/index.mjs 378.47 KB
+ESM ⚡️ Build success in 358ms
+CJS dist/index.js 392.42 KB
+CJS ⚡️ Build success in 360ms
 DTS Build start
-DTS ⚡️ Build success in 8126ms
-DTS dist/index.d.mts 388.96 KB
-DTS dist/index.d.ts  388.96 KB
+DTS ⚡️ Build success in 7045ms
+DTS dist/index.d.mts 389.04 KB
+DTS dist/index.d.ts  389.04 KB
 ⠙

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @lets-events/react
 
+## 12.2.1
+
+### Patch Changes
+
+- Drawer Go Back Button
+
 ## 12.2.0
 
 ### Minor Changes

package/dist/index.d.mts

@@ -5054,8 +5054,10 @@ type DrawerProps = ComponentProps<typeof DrawerOverlayStyled> & {
     backgroundColor?: keyof Colors;
     title: string;
     children?: ReactNode;
+    goBackIcon?: ReactNode;
+    goBackAction: () => void;
 };
-declare function Drawer({ isOpen, onClose, width, backgroundColor, title, children, }: DrawerProps): react_jsx_runtime.JSX.Element | null;
+declare function Drawer({ isOpen, onClose, width, backgroundColor, title, children, goBackIcon, goBackAction }: DrawerProps): react_jsx_runtime.JSX.Element | null;
 
 declare const TimePickerStyled: _stitches_react_types_styled_component.StyledComponent<"div", {
     expand?: boolean | "true" | undefined;

package/dist/index.d.ts

@@ -5054,8 +5054,10 @@ type DrawerProps = ComponentProps<typeof DrawerOverlayStyled> & {
     backgroundColor?: keyof Colors;
     title: string;
     children?: ReactNode;
+    goBackIcon?: ReactNode;
+    goBackAction: () => void;
 };
-declare function Drawer({ isOpen, onClose, width, backgroundColor, title, children, }: DrawerProps): react_jsx_runtime.JSX.Element | null;
+declare function Drawer({ isOpen, onClose, width, backgroundColor, title, children, goBackIcon, goBackAction }: DrawerProps): react_jsx_runtime.JSX.Element | null;
 
 declare const TimePickerStyled: _stitches_react_types_styled_component.StyledComponent<"div", {
     expand?: boolean | "true" | undefined;

package/dist/index.js

@@ -8112,6 +8112,12 @@ var DrawerHeaderCloseButton = styled("button", {
   border: "none",
   cursor: "pointer"
 });
+var GoBackButtonStyled = styled("button", {
+  background: "none",
+  padding: "0",
+  border: "none",
+  cursor: "pointer"
+});
 
 // src/components/Drawer/index.tsx
 var import_jsx_runtime16 = require("react/jsx-runtime");
@@ -8121,7 +8127,9 @@ function Drawer({
   width,
   backgroundColor,
   title,
-  children
+  children,
+  goBackIcon,
+  goBackAction
 }) {
   if (!isOpen) return null;
   const drawerContainerRef = (0, import_react8.useRef)(null);
@@ -8175,7 +8183,10 @@ function Drawer({
       },
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(DrawerHeaderDiv, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DrawerHeaderTitle, { children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(Flex2, { gap: 8, children: [
+            goBackIcon && goBackIcon && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(GoBackButtonStyled, { type: "button", onClick: goBackAction, children: goBackIcon }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DrawerHeaderTitle, { children: title })
+          ] }),
           /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DrawerHeaderCloseButton, { onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Icon_default, { size: "xl", color: "$dark600", name: "xmark" }) })
         ] }),
         children
@@ -9682,6 +9693,7 @@ var MultiSelect = import_react16.default.forwardRef(
                         {
                           css: itemStyle,
                           onClick: (e) => handleSelectAll(e),
+                          type: "button",
                           children: [
                             /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: allOptionsSelected ? "checked" : "" }),
                             /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Text, { typography: "labelSmall", children: selectedAllText ? selectedAllText : "Selecionar Todos" })

package/dist/index.mjs

@@ -8001,6 +8001,12 @@ var DrawerHeaderCloseButton = styled("button", {
   border: "none",
   cursor: "pointer"
 });
+var GoBackButtonStyled = styled("button", {
+  background: "none",
+  padding: "0",
+  border: "none",
+  cursor: "pointer"
+});
 
 // src/components/Drawer/index.tsx
 import { jsx as jsx16, jsxs as jsxs7 } from "react/jsx-runtime";
@@ -8010,7 +8016,9 @@ function Drawer({
   width,
   backgroundColor,
   title,
-  children
+  children,
+  goBackIcon,
+  goBackAction
 }) {
   if (!isOpen) return null;
   const drawerContainerRef = useRef4(null);
@@ -8064,7 +8072,10 @@ function Drawer({
       },
       children: [
         /* @__PURE__ */ jsxs7(DrawerHeaderDiv, { children: [
-          /* @__PURE__ */ jsx16(DrawerHeaderTitle, { children: title }),
+          /* @__PURE__ */ jsxs7(Flex2, { gap: 8, children: [
+            goBackIcon && goBackIcon && /* @__PURE__ */ jsx16(GoBackButtonStyled, { type: "button", onClick: goBackAction, children: goBackIcon }),
+            /* @__PURE__ */ jsx16(DrawerHeaderTitle, { children: title })
+          ] }),
           /* @__PURE__ */ jsx16(DrawerHeaderCloseButton, { onClick: onClose, children: /* @__PURE__ */ jsx16(Icon_default, { size: "xl", color: "$dark600", name: "xmark" }) })
         ] }),
         children
@@ -9575,6 +9586,7 @@ var MultiSelect = React9.forwardRef(
                         {
                           css: itemStyle,
                           onClick: (e) => handleSelectAll(e),
+                          type: "button",
                           children: [
                             /* @__PURE__ */ jsx26("div", { className: allOptionsSelected ? "checked" : "" }),
                             /* @__PURE__ */ jsx26(Text, { typography: "labelSmall", children: selectedAllText ? selectedAllText : "Selecionar Todos" })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lets-events/react",
-  "version": "12.2.0",
+  "version": "12.2.1",
   "description": "",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/components/Drawer/index.tsx

@@ -7,8 +7,10 @@ import {
   DrawerHeaderDiv,
   DrawerHeaderTitle,
   DrawerHeaderCloseButton,
+  GoBackButtonStyled,
 } from "./styledComponents";
 import { useOnClickOutside } from "../../hooks/useOnClickOutside";
+import { Flex } from "../Flex";
 
 export type DrawerProps = ComponentProps<typeof DrawerOverlayStyled> & {
   isOpen: boolean;
@@ -17,6 +19,8 @@ export type DrawerProps = ComponentProps<typeof DrawerOverlayStyled> & {
   backgroundColor?: keyof Colors;
   title: string;
   children?: ReactNode;
+  goBackIcon?: ReactNode;
+  goBackAction: () => void;
 };
 
 export function Drawer({
@@ -26,6 +30,8 @@ export function Drawer({
   backgroundColor,
   title,
   children,
+  goBackIcon,
+  goBackAction
 }: DrawerProps) {
   if (!isOpen) return null;
   const drawerContainerRef = useRef<HTMLDivElement>(null);
@@ -117,7 +123,10 @@ export function Drawer({
         }}
       >
         <DrawerHeaderDiv>
-          <DrawerHeaderTitle>{title}</DrawerHeaderTitle>
+          <Flex gap={8}>
+            {(goBackIcon && goBackIcon) && <GoBackButtonStyled type="button" onClick={goBackAction}>{goBackIcon}</GoBackButtonStyled>}
+            <DrawerHeaderTitle>{title}</DrawerHeaderTitle>
+          </Flex>
           <DrawerHeaderCloseButton onClick={onClose}>
             <Icon size={"xl"} color="$dark600" name="xmark" />
           </DrawerHeaderCloseButton>

package/src/components/Drawer/styledComponents.ts

@@ -44,3 +44,9 @@ export const DrawerHeaderCloseButton = styled("button", {
   border: "none",
   cursor: "pointer",
 });
+export const GoBackButtonStyled = styled("button", {
+  background: "none",
+  padding: "0",
+  border: "none",
+  cursor: "pointer",
+});

package/src/components/MultiSelect/index.tsx

@@ -170,6 +170,7 @@ export const MultiSelect = React.forwardRef<HTMLDivElement, MultiSelectProps>(
                     <ButtonSelectAllStyled
                       css={itemStyle}
                       onClick={(e) => handleSelectAll(e)}
+                      type="button"
                     >
                       <div className={allOptionsSelected ? "checked" : ""}></div>
                       <Text typography="labelSmall">