@bluemarble/bm-components 2.5.0 → 2.5.3

package/dist/index.cjs

@@ -209,7 +209,7 @@ var require_react_is_development = __commonJS({
         var Fragment3 = REACT_FRAGMENT_TYPE;
         var Lazy = REACT_LAZY_TYPE;
         var Memo = REACT_MEMO_TYPE;
-        var Portal2 = REACT_PORTAL_TYPE;
+        var Portal = REACT_PORTAL_TYPE;
         var Profiler = REACT_PROFILER_TYPE;
         var StrictMode = REACT_STRICT_MODE_TYPE;
         var Suspense = REACT_SUSPENSE_TYPE;
@@ -268,7 +268,7 @@ var require_react_is_development = __commonJS({
         exports.Fragment = Fragment3;
         exports.Lazy = Lazy;
         exports.Memo = Memo;
-        exports.Portal = Portal2;
+        exports.Portal = Portal;
         exports.Profiler = Profiler;
         exports.StrictMode = StrictMode;
         exports.Suspense = Suspense;
@@ -2760,7 +2760,7 @@ function createBox(options = {}) {
   const BoxRoot = styled("div", {
     shouldForwardProp: (prop) => prop !== "theme" && prop !== "sx" && prop !== "as"
   })(styleFunctionSx_default);
-  const Box9 = /* @__PURE__ */ React4.forwardRef(function Box10(inProps, ref) {
+  const Box8 = /* @__PURE__ */ React4.forwardRef(function Box9(inProps, ref) {
     const theme = useTheme_default(defaultTheme);
     const {
       className,
@@ -2775,7 +2775,7 @@ function createBox(options = {}) {
       ...other
     });
   });
-  return Box9;
+  return Box8;
 }
 
 // node_modules/@mui/utils/esm/generateUtilityClass/generateUtilityClass.js
@@ -4337,96 +4337,10 @@ var Dialog = ({
 // src/components/DialogConfirm/DialogConfirm.view.tsx
 
 
-var _colors = require('@mui/material/colors');
 
 
 // src/components/DialogConfirm/DialogConfirm.model.ts
 
-function UseDialogConfirm() {
-  const [opened, setOpened] = _react.useState.call(void 0, false);
-  const [isLoading, setLoading] = _react.useState.call(void 0, false);
-  const onConfirmFn = _react.useRef.call(void 0, async () => {
-  });
-  const paramsFn = _react.useRef.call(void 0, []);
-  const onConfirm = (fn) => {
-    onConfirmFn.current = fn;
-    return async (...params) => {
-      paramsFn.current = params;
-      setOpened(true);
-    };
-  };
-  const onProceed = async (event) => {
-    _optionalChain([event, 'optionalAccess', _82 => _82.preventDefault, 'call', _83 => _83()]);
-    _optionalChain([event, 'optionalAccess', _84 => _84.stopPropagation, 'call', _85 => _85()]);
-    setLoading(true);
-    try {
-      if (!onConfirmFn.current) return;
-      await onConfirmFn.current(...paramsFn.current);
-    } finally {
-      setOpened(false);
-      setLoading(false);
-    }
-  };
-  const onCancel = (event) => {
-    _optionalChain([event, 'optionalAccess', _86 => _86.preventDefault, 'call', _87 => _87()]);
-    _optionalChain([event, 'optionalAccess', _88 => _88.stopPropagation, 'call', _89 => _89()]);
-    setOpened(false);
-  };
-  const onCloseModal = () => {
-    if (isLoading) return;
-    setOpened(false);
-  };
-  return {
-    isLoading,
-    opened,
-    onConfirm,
-    onCloseModal,
-    onCancel,
-    onProceed
-  };
-}
-
-// src/components/DialogConfirm/DialogConfirm.view.tsx
-var DEFAULT_ICON = _md.MdOutlineWarningAmber;
-var DialogConfirm = (props) => {
-  const model = UseDialogConfirm();
-  const Icon = props.icon || DEFAULT_ICON;
-  return /* @__PURE__ */ React2.default.createElement(React2.default.Fragment, null, props.children({
-    onConfirm: model.onConfirm,
-    onCancel: model.onCancel
-  }), /* @__PURE__ */ React2.default.createElement(_material.Portal, null, /* @__PURE__ */ React2.default.createElement(Modal, { open: model.opened, onClose: model.onCloseModal }, /* @__PURE__ */ React2.default.createElement(_material.Box, { sx: { p: 2, maxWidth: 400, textAlign: "center" } }, /* @__PURE__ */ React2.default.createElement(
-    _material.Stack,
-    {
-      mx: "auto",
-      color: _colors.orange[800],
-      bgcolor: _colors.orange[50],
-      borderRadius: "50%",
-      height: 8 * 5,
-      width: 8 * 5,
-      direction: "row",
-      justifyContent: "center",
-      alignItems: "center"
-    },
-    /* @__PURE__ */ React2.default.createElement(Icon, { size: 8 * 3 })
-  ), /* @__PURE__ */ React2.default.createElement(_material.Typography, { fontWeight: "bold", variant: "h6", mt: 1 }, props.title || "Aten\xE7\xE3o"), /* @__PURE__ */ React2.default.createElement(_material.Typography, { my: 1 }, props.body || "Tem certeza que deseja realizar essa a\xE7\xE3o?"), /* @__PURE__ */ React2.default.createElement(_material.Stack, { gap: 1, mt: 3, color: _colors.grey[600] }, /* @__PURE__ */ React2.default.createElement(
-    LargeButton,
-    {
-      color: "warning",
-      loading: model.isLoading,
-      onClick: model.onProceed
-    },
-    props.confirmButtonText || "Confirmar"
-  ), /* @__PURE__ */ React2.default.createElement(
-    LargeButton,
-    {
-      variant: "outlined",
-      disabled: model.isLoading,
-      onClick: model.onCancel,
-      color: "inherit"
-    },
-    props.cancelButtonText || "Cancelar"
-  ))))));
-};
 
 // src/components/BaseDialog/BaseDialog.tsx
 
@@ -4502,6 +4416,10 @@ function useBaseDialogInstance() {
 // src/components/BaseDialog/BaseDialog.tsx
 
 
+
+
+
+
 // src/components/BaseDialog/BaseDialogHeader.tsx
 
 
@@ -4546,7 +4464,8 @@ var BaseDialogContainer = ({
 }) => {
   const { name } = useBaseDialogInstance();
   const { isOpened, close: closeDialog } = useBaseDialog();
-  return /* @__PURE__ */ React2.default.createElement(_material.Modal, { open: isOpened(name), onClose: () => closeDialog(name), ...rest }, /* @__PURE__ */ React2.default.createElement(
+  const close = React2.default.useCallback(() => closeDialog(name), [closeDialog, name]);
+  return /* @__PURE__ */ React2.default.createElement(_material.Modal, { open: isOpened(name), onClose: close, ...rest }, /* @__PURE__ */ React2.default.createElement(
     _material.Box,
     {
       ...BoxProps3,
@@ -4558,10 +4477,10 @@ var BaseDialogContainer = ({
         left: "50%",
         transform: "translate(-50%, -50%)",
         borderRadius: 1,
-        ..._optionalChain([BoxProps3, 'optionalAccess', _90 => _90.sx])
+        ..._optionalChain([BoxProps3, 'optionalAccess', _82 => _82.sx])
       }
     },
-    children
+    typeof children === "function" ? children({ close }) : children
   ));
 };
 var BaseDialogBody = (props) => {
@@ -4605,6 +4524,111 @@ var BaseDialog = {
   Body: BaseDialogBody
 };
 
+// src/components/DialogConfirm/DialogConfirm.model.ts
+function UseDialogConfirm(dialogName) {
+  const { isOpened, open, close } = useBaseDialog();
+  const name = _react.useMemo.call(void 0, 
+    () => dialogName || /* @__PURE__ */ Symbol("DialogConfirm"),
+    [dialogName]
+  );
+  const [isLoading, setLoading] = _react.useState.call(void 0, false);
+  const onConfirmFn = _react.useRef.call(void 0, async () => {
+  });
+  const paramsFn = _react.useRef.call(void 0, []);
+  const onConfirm = (fn) => {
+    onConfirmFn.current = fn;
+    return async (...params) => {
+      paramsFn.current = params;
+      open(name);
+    };
+  };
+  const onProceed = async (event) => {
+    _optionalChain([event, 'optionalAccess', _83 => _83.preventDefault, 'call', _84 => _84()]);
+    _optionalChain([event, 'optionalAccess', _85 => _85.stopPropagation, 'call', _86 => _86()]);
+    setLoading(true);
+    try {
+      if (!onConfirmFn.current) return;
+      await onConfirmFn.current(...paramsFn.current);
+    } finally {
+      close(name);
+      setLoading(false);
+    }
+  };
+  const onCancel = (event) => {
+    _optionalChain([event, 'optionalAccess', _87 => _87.preventDefault, 'call', _88 => _88()]);
+    _optionalChain([event, 'optionalAccess', _89 => _89.stopPropagation, 'call', _90 => _90()]);
+    close(name);
+  };
+  const onCloseModal = () => {
+    if (isLoading) return;
+    close(name);
+  };
+  return {
+    name,
+    isLoading,
+    opened: isOpened(name),
+    onConfirm,
+    onCloseModal,
+    onCancel,
+    onProceed
+  };
+}
+
+// src/components/DialogConfirm/DialogConfirm.view.tsx
+var DEFAULT_ICON = _md.MdOutlineWarningAmber;
+var DEFAULT_ICON_COLOR = "warning";
+var DEFAULT_BUTTON_COLOR = "primary";
+var DEFAULT_VARIANT = "contained";
+var DialogConfirmContent = (props) => {
+  const dialog = React2.default.useMemo(() => BaseDialog.Create(), []);
+  const model = UseDialogConfirm(dialog.name);
+  const Icon = props.icon || DEFAULT_ICON;
+  const iconColor = props.color || DEFAULT_ICON_COLOR;
+  const buttonColor = props.color || DEFAULT_BUTTON_COLOR;
+  const variant = props.variant || DEFAULT_VARIANT;
+  return /* @__PURE__ */ React2.default.createElement(React2.default.Fragment, null, props.children({
+    onConfirm: model.onConfirm,
+    onCancel: model.onCancel
+  }), /* @__PURE__ */ React2.default.createElement(dialog.Root, null, /* @__PURE__ */ React2.default.createElement(dialog.Container, { onClose: model.onCloseModal }, /* @__PURE__ */ React2.default.createElement(dialog.Body, { pt: 2, maxWidth: 400, textAlign: "center" }, /* @__PURE__ */ React2.default.createElement(
+    _material.Stack,
+    {
+      mx: "auto",
+      borderRadius: "50%",
+      height: 8 * 5,
+      width: 8 * 5,
+      direction: "row",
+      justifyContent: "center",
+      alignItems: "center",
+      sx: (theme) => {
+        const { main } = theme.palette[iconColor];
+        return { color: main, bgcolor: _material.alpha.call(void 0, main, 0.12) };
+      }
+    },
+    /* @__PURE__ */ React2.default.createElement(Icon, { size: 8 * 3 })
+  ), /* @__PURE__ */ React2.default.createElement(_material.Typography, { fontWeight: "bold", variant: "h6", mt: 1 }, props.title || "Aten\xE7\xE3o"), /* @__PURE__ */ React2.default.createElement(_material.Typography, { my: 1 }, props.body || "Tem certeza que deseja realizar essa a\xE7\xE3o?"), /* @__PURE__ */ React2.default.createElement(_material.Stack, { gap: 1, mt: 3, color: "text.secondary" }, /* @__PURE__ */ React2.default.createElement(
+    LargeButton,
+    {
+      color: buttonColor,
+      variant,
+      loading: model.isLoading,
+      onClick: model.onProceed
+    },
+    props.confirmButtonText || "Confirmar"
+  ), /* @__PURE__ */ React2.default.createElement(
+    LargeButton,
+    {
+      variant: "outlined",
+      disabled: model.isLoading,
+      onClick: model.onCancel,
+      color: "inherit"
+    },
+    props.cancelButtonText || "Cancelar"
+  ))))));
+};
+var DialogConfirm = (props) => {
+  return /* @__PURE__ */ React2.default.createElement(BaseDialog.Provider, null, /* @__PURE__ */ React2.default.createElement(DialogConfirmContent, { ...props }));
+};
+
 // src/contexts/FormHelperProvider.tsx