@apia/components 3.0.1 → 3.0.6

package/dist/components/modals/hooks/useModal.js

@@ -1,73 +0,0 @@
-import { useUpdateEffect } from '@apia/util';
-import React__default from 'react';
-import usePortal from 'react-cool-portal';
-
-function useModal(configuration) {
-  const [isLoading, setIsLoading] = React__default.useState(false);
-  const [isOpen, setIsOpen] = React__default.useState(
-    configuration?.portalArgs?.defaultShow ?? configuration?.isDefaultOpen ?? false
-  );
-  const {
-    Portal,
-    hide: hidePortal,
-    show: showPortal
-  } = usePortal({
-    ...configuration?.portalArgs,
-    containerId: "AppModals",
-    autoRemoveContainer: false,
-    escToHide: false,
-    clickOutsideToHide: false,
-    defaultShow: false,
-    internalShowHide: false
-  });
-  const hide = React__default.useCallback(() => {
-    setIsOpen(false);
-  }, []);
-  const show = React__default.useCallback(() => {
-    if (configuration?.preFetcher) {
-      setIsLoading(true);
-      configuration.preFetcher().then(() => {
-        setIsOpen(true);
-        setIsLoading(false);
-      }).catch(console.error);
-    } else
-      setIsOpen(true);
-  }, [configuration]);
-  const onClose = React__default.useCallback(() => {
-    setIsOpen(false);
-    if (configuration?.onClose)
-      configuration.onClose();
-  }, [configuration]);
-  const onExited = React__default.useCallback(() => {
-    hidePortal();
-    if (configuration?.onExited)
-      configuration.onExited();
-  }, [configuration, hidePortal]);
-  const openModalContextValue = React__default.useMemo(() => {
-    return {
-      isLoading,
-      show
-    };
-  }, [isLoading, show]);
-  useUpdateEffect(() => {
-    if (isOpen) {
-      if (configuration?.onOpen)
-        configuration.onOpen();
-      showPortal();
-    } else
-      onClose?.();
-  }, [isOpen]);
-  return {
-    hide,
-    isLoading,
-    isOpen,
-    onClose,
-    onExited,
-    openModalContextValue,
-    Portal,
-    show
-  };
-}
-
-export { useModal };
-//# sourceMappingURL=useModal.js.map

package/dist/components/modals/hooks/useModal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useModal.js","sources":["../../../../src/components/modals/hooks/useModal.tsx"],"sourcesContent":["import { useUpdateEffect } from '@apia/util';\nimport React from 'react';\nimport usePortal, { Args } from 'react-cool-portal';\nimport { TModal } from '../Modal';\n\nexport type TUseModalConfiguration = Pick<TModal, 'onClose' | 'onExited'> & {\n  debugPerformanceName?: string;\n  isDefaultOpen?: boolean;\n  onOpen?: () => unknown;\n  portalArgs?: Omit<Args, 'containerId'>;\n  preFetcher?: () => Promise<void>;\n};\n\n/**\n * Este hook provee una forma muy sencilla de utilizar nuestro modal. Provee\n * varias funcionalidades interesantes para poder manipular el modal en\n * distintas circunstancias:\n *\n * Objeto parámetro:\n *\n * - **defaultOpen**, Boolean, si es true el modal aparecerá abierto al montar\n * y sino aparecerá cerrado.\n * - **onOpen**: Event listener que será llamado en el momento exacto en que la\n * orden de apertura del modal fue dada.\n * - **onClose**: Event listener que será llamado en el momento exacto en que\n * el modal es cerrado, ya sea por un click en el overlay o porque la tecla\n * escape fue presionada.\n * - **onExited**, Event listener que será llamado luego de que la animación de\n * cierre del modal terminó.\n * - **preFetcher**, este método deberá devolver una promesa y en dicha promesa\n * deberá realizar cualquier operación que fuera necesaria antes de abrir el\n * modal, ejemplo: cargar la información que el modal debe mostrar. Si este\n * método es pasado, será llamado antes de abrir el modal y la vista se pondrá\n * en modo de carga (la propiedad isLoading devuelta y la propiedad isLoading\n * del OpenModalContextProvider estarán en true), hasta que la promesa sea\n * resuelta, momento en que se abrirá el modal e isLoading será puesto en false.\n * - **portalArgs**, objeto de configuración aceptado por el hook usePortal de\n * **react-cool-portal**.\n *\n * Objeto devuelto:\n *\n * - Para un modal en donde el botón de abrir el modal esté inserto dentro del\n * componente que lo utiliza, se devuelven los métodos **show** y **hide**.\n * - Para un modal en donde el botón de abrir el modal esté fuera del\n * componente, se devuelve **openModalContextValue**, que es el valor que debe\n * pasarse al contexto de tipo OpenModalContextProvider, un contexto que\n * puede ser utilizado para renderizar el botón encargado de abrir el modal,\n * fuera del alcance del componente que define el modal en sí. Se muestra un\n * ejemplo más abajo.\n * - Todos los demás elementos devueltos son para pasar directamente al modal,\n * entre ellos se encuentran las propiedades que el modal utiliza para saber si\n * debe estar abierto, los event listeners correspondientes y un portal, que el\n * modal usará para mostrarse dentro del área de modales, lo cual es sumamente\n * importante para que el focusController funcione correctamente.\n *\n * @see OpenModalContextProvider\n * @see usePortal\n *\n * @example\n *\n  const { openModalContextValue, ...modalProps } = useModal(\n    React.useMemo(() => ({\n      onClose: () => console.log(\"Al presionar en cerrar.\"),\n      onExited: () => console.log(\"Al terminar la animación de cierre.\"),\n      onOpen: () => console.log(\"Al abrir.\"),\n    }), [])\n  );\n\n  return (\n    <OpenModalContext.Provider value={openModalContextValue}>\n      <OpenModalContext.Consumer>\n        {({ isLoading, show }) => (\n          <Button isLoading={isLoading} onClick={show}>Open modal</Button>\n        )}\n      </OpenModalContext.Consumer>\n      <Modal shouldCloseOnEsc shouldCloseOnOverlayClick {...modalProps}>\n        Hello world\n      </Modal>\n    </OpenModalContext.Provider>\n  );\n */\nexport function useModal(configuration?: TUseModalConfiguration) {\n  const [isLoading, setIsLoading] = React.useState(false);\n  const [isOpen, setIsOpen] = React.useState(\n    configuration?.portalArgs?.defaultShow ??\n      configuration?.isDefaultOpen ??\n      false,\n  );\n\n  const {\n    Portal,\n    hide: hidePortal,\n    show: showPortal,\n  } = usePortal({\n    ...configuration?.portalArgs,\n    containerId: 'AppModals',\n    autoRemoveContainer: false,\n    escToHide: false,\n    clickOutsideToHide: false,\n    defaultShow: false,\n    internalShowHide: false,\n  });\n\n  const hide = React.useCallback(() => {\n    setIsOpen(false);\n  }, []);\n  const show = React.useCallback(() => {\n    if (configuration?.preFetcher) {\n      setIsLoading(true);\n      configuration\n        .preFetcher()\n        .then(() => {\n          setIsOpen(true);\n          setIsLoading(false);\n        })\n        .catch(console.error);\n    } else setIsOpen(true);\n  }, [configuration]);\n  const onClose = React.useCallback(() => {\n    setIsOpen(false);\n    if (configuration?.onClose) configuration.onClose();\n  }, [configuration]);\n  const onExited = React.useCallback(() => {\n    hidePortal();\n    if (configuration?.onExited) configuration.onExited();\n  }, [configuration, hidePortal]);\n  const openModalContextValue = React.useMemo(() => {\n    return {\n      isLoading,\n      show,\n    };\n  }, [isLoading, show]);\n\n  useUpdateEffect(() => {\n    if (isOpen) {\n      if (configuration?.onOpen) configuration.onOpen();\n      showPortal();\n    } else onClose?.();\n  }, [isOpen]);\n\n  return {\n    hide,\n    isLoading,\n    isOpen,\n    onClose,\n    onExited,\n    openModalContextValue,\n    Portal,\n    show,\n  };\n}\n"],"names":["React"],"mappings":";;;;AAiFO,SAAS,SAAS,aAAwC,EAAA;AAC/D,EAAA,MAAM,CAAC,SAAW,EAAA,YAAY,CAAI,GAAAA,cAAA,CAAM,SAAS,KAAK,CAAA,CAAA;AACtD,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIA,cAAM,CAAA,QAAA;AAAA,IAChC,aAAe,EAAA,UAAA,EAAY,WACzB,IAAA,aAAA,EAAe,aACf,IAAA,KAAA;AAAA,GACJ,CAAA;AAEA,EAAM,MAAA;AAAA,IACJ,MAAA;AAAA,IACA,IAAM,EAAA,UAAA;AAAA,IACN,IAAM,EAAA,UAAA;AAAA,MACJ,SAAU,CAAA;AAAA,IACZ,GAAG,aAAe,EAAA,UAAA;AAAA,IAClB,WAAa,EAAA,WAAA;AAAA,IACb,mBAAqB,EAAA,KAAA;AAAA,IACrB,SAAW,EAAA,KAAA;AAAA,IACX,kBAAoB,EAAA,KAAA;AAAA,IACpB,WAAa,EAAA,KAAA;AAAA,IACb,gBAAkB,EAAA,KAAA;AAAA,GACnB,CAAA,CAAA;AAED,EAAM,MAAA,IAAA,GAAOA,cAAM,CAAA,WAAA,CAAY,MAAM;AACnC,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AAAA,GACjB,EAAG,EAAE,CAAA,CAAA;AACL,EAAM,MAAA,IAAA,GAAOA,cAAM,CAAA,WAAA,CAAY,MAAM;AACnC,IAAA,IAAI,eAAe,UAAY,EAAA;AAC7B,MAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AACjB,MACG,aAAA,CAAA,UAAA,EACA,CAAA,IAAA,CAAK,MAAM;AACV,QAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AACd,QAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAAA,OACnB,CAAA,CACA,KAAM,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AAAA,KACxB;AAAO,MAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AAAA,GACvB,EAAG,CAAC,aAAa,CAAC,CAAA,CAAA;AAClB,EAAM,MAAA,OAAA,GAAUA,cAAM,CAAA,WAAA,CAAY,MAAM;AACtC,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AACf,IAAA,IAAI,aAAe,EAAA,OAAA;AAAS,MAAA,aAAA,CAAc,OAAQ,EAAA,CAAA;AAAA,GACpD,EAAG,CAAC,aAAa,CAAC,CAAA,CAAA;AAClB,EAAM,MAAA,QAAA,GAAWA,cAAM,CAAA,WAAA,CAAY,MAAM;AACvC,IAAW,UAAA,EAAA,CAAA;AACX,IAAA,IAAI,aAAe,EAAA,QAAA;AAAU,MAAA,aAAA,CAAc,QAAS,EAAA,CAAA;AAAA,GACnD,EAAA,CAAC,aAAe,EAAA,UAAU,CAAC,CAAA,CAAA;AAC9B,EAAM,MAAA,qBAAA,GAAwBA,cAAM,CAAA,OAAA,CAAQ,MAAM;AAChD,IAAO,OAAA;AAAA,MACL,SAAA;AAAA,MACA,IAAA;AAAA,KACF,CAAA;AAAA,GACC,EAAA,CAAC,SAAW,EAAA,IAAI,CAAC,CAAA,CAAA;AAEpB,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,IAAI,MAAQ,EAAA;AACV,MAAA,IAAI,aAAe,EAAA,MAAA;AAAQ,QAAA,aAAA,CAAc,MAAO,EAAA,CAAA;AAChD,MAAW,UAAA,EAAA,CAAA;AAAA,KACb;AAAO,MAAU,OAAA,IAAA,CAAA;AAAA,GACnB,EAAG,CAAC,MAAM,CAAC,CAAA,CAAA;AAEX,EAAO,OAAA;AAAA,IACL,IAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,qBAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/dist/components/modals/hooks/useStyleState.js

@@ -1,44 +0,0 @@
-import { useRef, useCallback } from 'react';
-
-function useStyleState(initialStyle) {
-  const element = useRef(null);
-  const state = useRef(
-    typeof initialStyle === "object" ? initialStyle : {}
-  );
-  const applyStyles = useCallback(() => {
-    if (element.current) {
-      Object.entries(state.current).forEach(([name, value]) => {
-        if (Object.getOwnPropertyDescriptor(element.current.style, name)?.writable) {
-          element.current.style[name] = value;
-        }
-      });
-    }
-  }, []);
-  const hasInitializedState = useRef(typeof initialStyle !== "function");
-  return {
-    ref: useCallback(
-      (el) => {
-        element.current = el;
-        if (el) {
-          if (!hasInitializedState.current) {
-            hasInitializedState.current = true;
-            state.current = initialStyle(el);
-          }
-          applyStyles();
-        }
-      },
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-      [applyStyles]
-    ),
-    setState: useCallback(
-      (newState) => {
-        state.current = typeof newState === "function" ? newState(state.current) : newState;
-        applyStyles();
-      },
-      [applyStyles]
-    )
-  };
-}
-
-export { useStyleState };
-//# sourceMappingURL=useStyleState.js.map

package/dist/components/modals/hooks/useStyleState.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useStyleState.js","sources":["../../../../src/components/modals/hooks/useStyleState.ts"],"sourcesContent":["import { SetStateAction, useCallback, useRef } from 'react';\r\n\r\ntype InitialStyleAssigner = (el: HTMLElement) => Partial<CSSStyleDeclaration>;\r\ntype CSSState = Partial<CSSStyleDeclaration>;\r\n\r\nexport function useStyleState(initialStyle?: CSSState | InitialStyleAssigner) {\r\n  const element = useRef<null | HTMLElement>(null);\r\n  const state = useRef<CSSState>(\r\n    typeof initialStyle === 'object' ? initialStyle : ({} as CSSState),\r\n  );\r\n\r\n  const applyStyles = useCallback(() => {\r\n    if (element.current) {\r\n      Object.entries(state.current).forEach(([name, value]) => {\r\n        if (\r\n          Object.getOwnPropertyDescriptor(element.current!.style, name)\r\n            ?.writable\r\n        ) {\r\n          element.current!.style[name as 'width'] = value as any;\r\n        }\r\n      });\r\n    }\r\n  }, []);\r\n\r\n  const hasInitializedState = useRef(typeof initialStyle !== 'function');\r\n  return {\r\n    ref: useCallback(\r\n      (el: HTMLElement | null) => {\r\n        element.current = el;\r\n        if (el) {\r\n          if (!hasInitializedState.current) {\r\n            hasInitializedState.current = true;\r\n            state.current = (initialStyle as InitialStyleAssigner)(el);\r\n          }\r\n          applyStyles();\r\n        }\r\n      },\r\n      // eslint-disable-next-line react-hooks/exhaustive-deps\r\n      [applyStyles],\r\n    ),\r\n    setState: useCallback(\r\n      (newState: SetStateAction<CSSState>) => {\r\n        state.current =\r\n          typeof newState === 'function' ? newState(state.current) : newState;\r\n        applyStyles();\r\n      },\r\n      [applyStyles],\r\n    ),\r\n  };\r\n}\r\n"],"names":[],"mappings":";;AAKO,SAAS,cAAc,YAAgD,EAAA;AAC5E,EAAM,MAAA,OAAA,GAAU,OAA2B,IAAI,CAAA,CAAA;AAC/C,EAAA,MAAM,KAAQ,GAAA,MAAA;AAAA,IACZ,OAAO,YAAA,KAAiB,QAAW,GAAA,YAAA,GAAgB,EAAC;AAAA,GACtD,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,MAAO,MAAA,CAAA,OAAA,CAAQ,MAAM,OAAO,CAAA,CAAE,QAAQ,CAAC,CAAC,IAAM,EAAA,KAAK,CAAM,KAAA;AACvD,QAAA,IACE,OAAO,wBAAyB,CAAA,OAAA,CAAQ,QAAS,KAAO,EAAA,IAAI,GACxD,QACJ,EAAA;AACA,UAAQ,OAAA,CAAA,OAAA,CAAS,KAAM,CAAA,IAAe,CAAI,GAAA,KAAA,CAAA;AAAA,SAC5C;AAAA,OACD,CAAA,CAAA;AAAA,KACH;AAAA,GACF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,MAAM,mBAAsB,GAAA,MAAA,CAAO,OAAO,YAAA,KAAiB,UAAU,CAAA,CAAA;AACrE,EAAO,OAAA;AAAA,IACL,GAAK,EAAA,WAAA;AAAA,MACH,CAAC,EAA2B,KAAA;AAC1B,QAAA,OAAA,CAAQ,OAAU,GAAA,EAAA,CAAA;AAClB,QAAA,IAAI,EAAI,EAAA;AACN,UAAI,IAAA,CAAC,oBAAoB,OAAS,EAAA;AAChC,YAAA,mBAAA,CAAoB,OAAU,GAAA,IAAA,CAAA;AAC9B,YAAM,KAAA,CAAA,OAAA,GAAW,aAAsC,EAAE,CAAA,CAAA;AAAA,WAC3D;AACA,UAAY,WAAA,EAAA,CAAA;AAAA,SACd;AAAA,OACF;AAAA;AAAA,MAEA,CAAC,WAAW,CAAA;AAAA,KACd;AAAA,IACA,QAAU,EAAA,WAAA;AAAA,MACR,CAAC,QAAuC,KAAA;AACtC,QAAA,KAAA,CAAM,UACJ,OAAO,QAAA,KAAa,aAAa,QAAS,CAAA,KAAA,CAAM,OAAO,CAAI,GAAA,QAAA,CAAA;AAC7D,QAAY,WAAA,EAAA,CAAA;AAAA,OACd;AAAA,MACA,CAAC,WAAW,CAAA;AAAA,KACd;AAAA,GACF,CAAA;AACF;;;;"}

package/dist/components/modals/layout/Confirm.d.ts

@@ -1,7 +0,0 @@
-import * as React from 'react';
-import { IConfirm } from '../../dialogs/ConfirmModal.js';
-
-declare const Confirm: ({ children, additionalButtons, additionalButtonsOnRight, cancelButtonText: cancelText, className, confirmButtonText: confirmText, confirmButtonVariant, contentRef, disabled, hideCancelButton, hideConfirmButton, isLoading, onCancel, onConfirm, variant, }: Omit<IConfirm, 'title'>) => React.JSX.Element;
-
-export { Confirm };
-//# sourceMappingURL=Confirm.d.ts.map

package/dist/components/modals/layout/Confirm.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Confirm.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/modals/layout/Confirm.js

@@ -1,96 +0,0 @@
-import { jsxs, jsx } from '@apia/theme/jsx-runtime';
-import { Box, getVariant } from '@apia/theme';
-import { getLabel } from '@apia/util';
-import { useCallback } from 'react';
-import { DialogButtonBar } from './DialogButtonBar.js';
-import { SimpleButton } from '../../forms/buttons/SimpleButton.js';
-import { useModalContext } from '../ModalContext.js';
-
-const Confirm = ({
-  children,
-  additionalButtons,
-  additionalButtonsOnRight,
-  cancelButtonText: cancelText = getLabel("btnCan").text,
-  className,
-  confirmButtonText: confirmText = getLabel("btnCon").text,
-  confirmButtonVariant = "primary",
-  contentRef,
-  disabled,
-  hideCancelButton,
-  hideConfirmButton,
-  isLoading,
-  onCancel,
-  onConfirm,
-  variant
-}) => {
-  const { descriptionId } = useModalContext();
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      ...getVariant(variant ?? "layout.common.modals.confirm"),
-      className: `${className ?? ""} confirm`,
-      children: [
-        /* @__PURE__ */ jsx(Box, { ref: contentRef, className: "confirm__content", id: descriptionId, children }),
-        /* @__PURE__ */ jsxs(DialogButtonBar, { className: "confirm__buttonBar", children: [
-          /* @__PURE__ */ jsx(
-            Box,
-            {
-              className: "confirm__customButtons",
-              onClick: useCallback(
-                (ev) => {
-                  if (ev.target.closest("button"))
-                    onCancel?.();
-                },
-                [onCancel]
-              ),
-              children: additionalButtons
-            }
-          ),
-          /* @__PURE__ */ jsxs(Box, { className: "confirm__defaultButtons", children: [
-            /* @__PURE__ */ jsx(
-              Box,
-              {
-                className: "confirm__customButtonsOnRight",
-                onClick: useCallback(
-                  (ev) => {
-                    if (ev.target.closest("button"))
-                      onCancel?.();
-                  },
-                  [onCancel]
-                ),
-                children: additionalButtonsOnRight
-              }
-            ),
-            !hideConfirmButton && /* @__PURE__ */ jsx(
-              SimpleButton,
-              {
-                onClick: onConfirm,
-                title: confirmText,
-                variant: confirmButtonVariant,
-                disabled: isLoading ?? disabled,
-                isLoading,
-                className: "confirm__confirmButton",
-                type: "submit",
-                children: confirmText
-              }
-            ),
-            onCancel && !hideCancelButton && /* @__PURE__ */ jsx(
-              SimpleButton,
-              {
-                onClick: onCancel,
-                title: cancelText,
-                ...getVariant("secondary"),
-                disabled: isLoading,
-                className: "confirm__cancelButton",
-                children: cancelText
-              }
-            )
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-
-export { Confirm };
-//# sourceMappingURL=Confirm.js.map

package/dist/components/modals/layout/Confirm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Confirm.js","sources":["../../../../src/components/modals/layout/Confirm.tsx"],"sourcesContent":["import { Box, getVariant } from '@apia/theme';\nimport { IConfirm } from '../../dialogs';\nimport { getLabel } from '@apia/util';\nimport { MouseEvent, useCallback } from 'react';\nimport { DialogButtonBar } from './DialogButtonBar';\nimport { SimpleButton } from '../../forms/buttons/SimpleButton';\nimport { useModalContext } from '../ModalContext';\n\nexport const Confirm = ({\n  children,\n  additionalButtons,\n  additionalButtonsOnRight,\n  cancelButtonText: cancelText = getLabel('btnCan').text,\n  className,\n  confirmButtonText: confirmText = getLabel('btnCon').text,\n  confirmButtonVariant = 'primary',\n  contentRef,\n  disabled,\n  hideCancelButton,\n  hideConfirmButton,\n  isLoading,\n  onCancel,\n  onConfirm,\n  variant,\n}: Omit<IConfirm, 'title'>) => {\n  const { descriptionId } = useModalContext();\n\n  return (\n    <Box\n      {...getVariant(variant ?? 'layout.common.modals.confirm')}\n      className={`${className ?? ''} confirm`}\n    >\n      <Box ref={contentRef} className=\"confirm__content\" id={descriptionId}>\n        {children}\n      </Box>\n      <DialogButtonBar className=\"confirm__buttonBar\">\n        <Box\n          className=\"confirm__customButtons\"\n          onClick={useCallback(\n            (ev: MouseEvent) => {\n              if ((ev.target as HTMLElement).closest('button')) onCancel?.();\n            },\n            [onCancel],\n          )}\n        >\n          {additionalButtons}\n        </Box>\n\n        <Box className=\"confirm__defaultButtons\">\n          <Box\n            className=\"confirm__customButtonsOnRight\"\n            onClick={useCallback(\n              (ev: MouseEvent) => {\n                if ((ev.target as HTMLElement).closest('button')) onCancel?.();\n              },\n              [onCancel],\n            )}\n          >\n            {additionalButtonsOnRight}\n          </Box>\n          {!hideConfirmButton && (\n            <SimpleButton\n              onClick={onConfirm}\n              title={confirmText}\n              variant={confirmButtonVariant}\n              disabled={isLoading ?? disabled}\n              isLoading={isLoading}\n              className=\"confirm__confirmButton\"\n              type=\"submit\"\n            >\n              {confirmText}\n            </SimpleButton>\n          )}\n          {onCancel && !hideCancelButton && (\n            <SimpleButton\n              onClick={onCancel}\n              title={cancelText}\n              {...getVariant('secondary')}\n              disabled={isLoading}\n              className=\"confirm__cancelButton\"\n            >\n              {cancelText}\n            </SimpleButton>\n          )}\n        </Box>\n      </DialogButtonBar>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/modals/layout/DialogButtonBar.d.ts

@@ -1,10 +0,0 @@
-import * as React from 'react';
-
-interface IDialogButtonBar {
-    children: React.ReactNode;
-    className?: string;
-}
-declare const DialogButtonBar: React.FC<IDialogButtonBar>;
-
-export { DialogButtonBar, type IDialogButtonBar };
-//# sourceMappingURL=DialogButtonBar.d.ts.map

package/dist/components/modals/layout/DialogButtonBar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogButtonBar.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/modals/layout/DialogButtonBar.js

@@ -1,19 +0,0 @@
-import { jsx } from '@apia/theme/jsx-runtime';
-import { Box, getVariant } from '@apia/theme';
-
-const DialogButtonBar = ({
-  children,
-  className
-}) => {
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      className: `${className ?? ""} buttonsBar`,
-      ...getVariant("layout.common.modals.buttonsBar"),
-      children
-    }
-  );
-};
-
-export { DialogButtonBar };
-//# sourceMappingURL=DialogButtonBar.js.map

package/dist/components/modals/layout/DialogButtonBar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogButtonBar.js","sources":["../../../../src/components/modals/layout/DialogButtonBar.tsx"],"sourcesContent":["import { getVariant } from '@apia/theme';\nimport * as React from 'react';\nimport { Box } from '@apia/theme';\n\nexport interface IDialogButtonBar {\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport const DialogButtonBar: React.FC<IDialogButtonBar> = ({\n  children,\n  className,\n}) => {\n  return (\n    <Box\n      className={`${className ?? ''} buttonsBar`}\n      {...getVariant('layout.common.modals.buttonsBar')}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;AASO,MAAM,kBAA8C,CAAC;AAAA,EAC1D,QAAA;AAAA,EACA,SAAA;AACF,CAAM,KAAA;AACJ,EACE,uBAAA,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,CAAG,EAAA,SAAA,IAAa,EAAE,CAAA,WAAA,CAAA;AAAA,MAC5B,GAAG,WAAW,iCAAiC,CAAA;AAAA,MAE/C,QAAA;AAAA,KAAA;AAAA,GACH,CAAA;AAEJ;;;;"}

package/dist/components/modals/layout/DialogHeader.d.ts

@@ -1,18 +0,0 @@
-import React__default from 'react';
-
-interface IDialogHeader {
-    className?: string;
-    close: () => void;
-    hideCloseButton?: boolean;
-    id?: string;
-    NavBar?: React__default.ReactNode;
-    title?: string;
-}
-declare global {
-    interface Window {
-        BTN_CLOSE: string;
-    }
-}
-
-export type { IDialogHeader };
-//# sourceMappingURL=DialogHeader.d.ts.map

package/dist/components/modals/layout/DialogHeader.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogHeader.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/modals/layout/DialogHeader.js

@@ -1,117 +0,0 @@
-import { jsx, jsxs } from '@apia/theme/jsx-runtime';
-import { useBreakpointIndex, Close, Box, responsive, spacing, Heading } from '@apia/theme';
-import React__default from 'react';
-
-const DialogHeader = ({
-  className,
-  close,
-  hideCloseButton,
-  id,
-  NavBar,
-  title = ""
-}) => {
-  const breakpointIndex = useBreakpointIndex();
-  const Title = /* @__PURE__ */ jsx(
-    Heading,
-    {
-      as: "h3",
-      sx: {
-        wordBreak: "break-word",
-        m: "0",
-        flex: "2 0",
-        color: "title"
-      },
-      className: "modal__title",
-      id: id ? `modal-${id}-title` : "",
-      children: title
-    }
-  );
-  const CloseButton = React__default.useMemo(
-    () => hideCloseButton ? null : /* @__PURE__ */ jsx(
-      Close,
-      {
-        role: "button",
-        type: "button",
-        "aria-label": window.BTN_CLOSE,
-        onClick: close,
-        title: window.BTN_CLOSE,
-        sx: {
-          mr: "unset"
-        },
-        className: "modal__closeButton"
-      }
-    ),
-    [close, hideCloseButton]
-  );
-  const NavBarElement = NavBar && /* @__PURE__ */ jsx(
-    Box,
-    {
-      sx: {
-        display: "flex",
-        gap: responsive({ 0: 2, 1: "3px", 2: 2 }),
-        justifyContent: "end",
-        flexDirection: responsive({ 0: "row", 1: "column", 3: "row" }),
-        width: responsive({ 0: "auto", 1: "100%", 2: "auto" }),
-        flexBasis: "max-content",
-        height: "100%"
-      },
-      className: "modal__headerBar",
-      children: NavBar
-    }
-  );
-  return breakpointIndex > 3 ? /* @__PURE__ */ jsxs(
-    Box,
-    {
-      className: `${className} modal__header`,
-      sx: {
-        display: "flex",
-        flexDirection: "row",
-        alignItems: "start",
-        mb: spacing(0),
-        justifyContent: "space-between",
-        width: "100%",
-        gap: spacing(2),
-        flexWrap: "nowrap"
-      },
-      children: [
-        Title,
-        NavBarElement,
-        CloseButton
-      ]
-    }
-  ) : /* @__PURE__ */ jsxs(
-    Box,
-    {
-      className: `${className} modal__header`,
-      sx: {
-        display: "flex",
-        flexDirection: "column",
-        alignItems: responsive({ 0: "center", 2: "end" }),
-        mb: spacing(0),
-        justifyContent: "space-between",
-        width: "100%",
-        gap: spacing(2)
-      },
-      children: [
-        /* @__PURE__ */ jsxs(
-          Box,
-          {
-            sx: {
-              display: "flex",
-              width: "100%"
-            },
-            children: [
-              Title,
-              CloseButton
-            ]
-          }
-        ),
-        NavBarElement
-      ]
-    }
-  );
-};
-var DialogHeader$1 = DialogHeader;
-
-export { DialogHeader$1 as default };
-//# sourceMappingURL=DialogHeader.js.map

package/dist/components/modals/layout/DialogHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogHeader.js","sources":["../../../../src/components/modals/layout/DialogHeader.tsx"],"sourcesContent":["import { Box, Close, Heading, useBreakpointIndex } from '@apia/theme';\nimport React, { FC } from 'react';\nimport { responsive, spacing } from '@apia/theme';\n\nexport interface IDialogHeader {\n  className?: string;\n  close: () => void;\n  hideCloseButton?: boolean;\n  id?: string;\n  NavBar?: React.ReactNode;\n  title?: string;\n}\n\ndeclare global {\n  interface Window {\n    BTN_CLOSE: string;\n  }\n}\n\nconst DialogHeader: FC<IDialogHeader> = ({\n  className,\n  close,\n  hideCloseButton,\n  id,\n  NavBar,\n  title = '',\n}) => {\n  const breakpointIndex = useBreakpointIndex();\n\n  const Title = (\n    <Heading\n      as=\"h3\"\n      sx={{\n        wordBreak: 'break-word',\n        m: '0',\n        flex: '2 0',\n        color: 'title',\n      }}\n      className=\"modal__title\"\n      id={id ? `modal-${id}-title` : ''}\n    >\n      {title}\n    </Heading>\n  );\n\n  const CloseButton = React.useMemo(\n    () =>\n      hideCloseButton ? null : (\n        <Close\n          role=\"button\"\n          type=\"button\"\n          aria-label={window.BTN_CLOSE}\n          onClick={close}\n          title={window.BTN_CLOSE}\n          sx={{\n            mr: 'unset',\n          }}\n          className=\"modal__closeButton\"\n        />\n      ),\n    [close, hideCloseButton],\n  );\n\n  const NavBarElement = NavBar && (\n    <Box\n      sx={{\n        display: 'flex',\n        gap: responsive({ 0: 2, 1: '3px', 2: 2 }),\n        justifyContent: 'end',\n        flexDirection: responsive({ 0: 'row', 1: 'column', 3: 'row' }),\n        width: responsive({ 0: 'auto', 1: '100%', 2: 'auto' }),\n        flexBasis: 'max-content',\n        height: '100%',\n      }}\n      className=\"modal__headerBar\"\n    >\n      {NavBar}\n    </Box>\n  );\n\n  return breakpointIndex > 3 ? (\n    <Box\n      className={`${className} modal__header`}\n      sx={{\n        display: 'flex',\n        flexDirection: 'row',\n        alignItems: 'start',\n        mb: spacing(0),\n        justifyContent: 'space-between',\n        width: '100%',\n        gap: spacing(2),\n        flexWrap: 'nowrap',\n      }}\n    >\n      {Title}\n      {NavBarElement}\n      {CloseButton}\n    </Box>\n  ) : (\n    <Box\n      className={`${className} modal__header`}\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: responsive({ 0: 'center', 2: 'end' }),\n        mb: spacing(0),\n        justifyContent: 'space-between',\n        width: '100%',\n        gap: spacing(2),\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          width: '100%',\n        }}\n      >\n        {Title}\n        {CloseButton}\n      </Box>\n      {NavBarElement}\n    </Box>\n  );\n};\n\nexport default DialogHeader;\n"],"names":["React"],"mappings":"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"}

package/dist/components/responsive/AutoEllipsis.d.ts

@@ -1,21 +0,0 @@
-import * as React from 'react';
-import { ReactNode } from 'react';
-
-declare const AutoEllipsis: ({ children, findParent, overrideStyles, }: {
-    children: ReactNode;
-    /**
-     * Si se pasa el método findParent, será invocado con el nodo de AutoEllipsis
-     * para dar control sobre cuál es el elemento al que se le clonarán los
-     * estilos.
-     */
-    findParent?: ((currentElement: HTMLElement) => HTMLElement) | undefined;
-    /**
-     * Si se pasa overrideStyles, será invocado con el nodo actual de
-     * AutoEllipsis para tomar decisiones acerca de cuáles estilos serán
-     * aplicados.
-     */
-    overrideStyles?: ((currentElement: HTMLElement) => Partial<CSSStyleDeclaration>) | undefined;
-}) => React.JSX.Element;
-
-export { AutoEllipsis };
-//# sourceMappingURL=AutoEllipsis.d.ts.map

package/dist/components/responsive/AutoEllipsis.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AutoEllipsis.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/responsive/AutoEllipsis.js

@@ -1,128 +0,0 @@
-import { jsx } from '@apia/theme/jsx-runtime';
-import { isChild } from '@apia/util';
-import { useRef, useCallback, useEffect } from 'react';
-import { Box } from '@apia/theme';
-
-const AutoEllipsis = ({
-  children,
-  findParent,
-  overrideStyles
-}) => {
-  const unsuscribe = useRef(() => {
-  });
-  const clone = useRef(null);
-  const timeout = useRef(0);
-  const ref = useCallback(
-    (el) => {
-      if (!el)
-        return;
-      unsuscribe.current();
-      function showBox() {
-        clone.current = el.cloneNode(true);
-        Object.entries(window.getComputedStyle(findParent?.(el) ?? el)).forEach(
-          ([name, value]) => {
-            if (name.match(/webkit/))
-              return;
-            try {
-              clone.current.style[name] = value;
-            } catch (e) {
-            }
-          }
-        );
-        const bound = el.getBoundingClientRect();
-        clone.current.style.position = "fixed";
-        clone.current.style.left = `${bound.left - 1}px`;
-        clone.current.style.top = `${bound.top - 1}px`;
-        clone.current.style.width = `${bound.width + 8}px`;
-        clone.current.style.whiteSpace = "break-spaces";
-        clone.current.style.overflow = "visible";
-        clone.current.style.textOverflow = "unset";
-        clone.current.style.background = "var(--theme-ui-colors-palette-background-paper)";
-        clone.current.style.color = "var(--theme-ui-colors-palette-text-primary)";
-        clone.current.style.border = "1px solid";
-        clone.current.style.borderColor = "var(--theme-ui-colors-palette-border-field)";
-        clone.current.style.zIndex = "1000000";
-        clone.current.style.height = "auto";
-        clone.current.style.fill = "var(--theme-ui-colors-palette-text-primary)";
-        clone.current.style.pointerEvents = "none";
-        const overridenStyles = overrideStyles?.(el);
-        if (overridenStyles) {
-          Object.entries(overridenStyles).forEach(([name, value]) => {
-            if (name.match(/webkit/))
-              return;
-            try {
-              clone.current.style[name] = value;
-            } catch (e) {
-            }
-          });
-        }
-        clone.current.addEventListener("mouseleave", (ev) => {
-          if (isChild(
-            ev.relatedTarget,
-            (current) => current === el
-          ))
-            return;
-          clone.current?.remove();
-        });
-        function close() {
-          clone.current?.remove();
-          document.removeEventListener("scroll", close);
-        }
-        document.addEventListener("scroll", close);
-        document.body.append(clone.current);
-        const cloneBounding = clone.current.getBoundingClientRect();
-        const difX = Math.abs(cloneBounding.width - bound.width);
-        const difY = Math.abs(cloneBounding.height - bound.height);
-        if (difX < 50 && difY < 10) {
-          clone.current.remove();
-        }
-      }
-      function hideBox(ev) {
-        if (isChild(
-          ev.relatedTarget,
-          (current) => current === clone.current
-        ))
-          return;
-        clone.current?.remove();
-      }
-      function handleMouseEnter() {
-        timeout.current = setTimeout(() => {
-          showBox();
-        }, 500);
-      }
-      function handleMouseLeave(ev) {
-        clearTimeout(timeout.current);
-        hideBox(ev);
-      }
-      el.addEventListener("mouseenter", handleMouseEnter);
-      el.addEventListener("mouseleave", handleMouseLeave);
-      unsuscribe.current = () => {
-        el.removeEventListener("mouseenter", handleMouseEnter);
-        el.removeEventListener("mouseleave", handleMouseLeave);
-        clearTimeout(timeout.current);
-      };
-    },
-    [findParent, overrideStyles]
-  );
-  useEffect(() => {
-    return () => {
-      clone.current?.remove();
-    };
-  }, []);
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      ref,
-      sx: {
-        overflow: "hidden",
-        textOverflow: "ellipsis",
-        whiteSpace: "nowrap"
-      },
-      className: "autoellipsis__container",
-      children
-    }
-  );
-};
-
-export { AutoEllipsis };
-//# sourceMappingURL=AutoEllipsis.js.map

package/dist/components/responsive/AutoEllipsis.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AutoEllipsis.js","sources":["../../../src/components/responsive/AutoEllipsis.tsx"],"sourcesContent":["/* eslint-disable no-param-reassign */\nimport { isChild } from '@apia/util';\nimport { useEffect, ReactNode, useRef, useCallback } from 'react';\nimport { Box } from '@apia/theme';\n\nexport const AutoEllipsis = ({\n  children,\n  findParent,\n  overrideStyles,\n}: {\n  children: ReactNode;\n  /**\n   * Si se pasa el método findParent, será invocado con el nodo de AutoEllipsis\n   * para dar control sobre cuál es el elemento al que se le clonarán los\n   * estilos.\n   */\n  findParent?: (currentElement: HTMLElement) => HTMLElement;\n  /**\n   * Si se pasa overrideStyles, será invocado con el nodo actual de\n   * AutoEllipsis para tomar decisiones acerca de cuáles estilos serán\n   * aplicados.\n   */\n  overrideStyles?: (\n    currentElement: HTMLElement,\n  ) => Partial<CSSStyleDeclaration>;\n}) => {\n  const unsuscribe = useRef(() => {});\n  const clone = useRef<HTMLElement | null>(null);\n  const timeout = useRef(0);\n  const ref = useCallback(\n    (el: HTMLElement) => {\n      if (!el) return;\n\n      unsuscribe.current();\n\n      function showBox() {\n        clone.current = el.cloneNode(true) as HTMLElement;\n        Object.entries(window.getComputedStyle(findParent?.(el) ?? el)).forEach(\n          ([name, value]) => {\n            if (name.match(/webkit/)) return;\n            try {\n              // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any\n              (clone.current as HTMLElement).style[name as any] = value;\n            } catch (e) {}\n          },\n        );\n\n        const bound = el.getBoundingClientRect();\n        clone.current.style.position = 'fixed';\n        clone.current.style.left = `${bound.left - 1}px`;\n        clone.current.style.top = `${bound.top - 1}px`;\n        clone.current.style.width = `${bound.width + 8}px`;\n        clone.current.style.whiteSpace = 'break-spaces';\n        clone.current.style.overflow = 'visible';\n        clone.current.style.textOverflow = 'unset';\n        clone.current.style.background =\n          'var(--theme-ui-colors-palette-background-paper)';\n        clone.current.style.color =\n          'var(--theme-ui-colors-palette-text-primary)';\n        clone.current.style.border = '1px solid';\n        clone.current.style.borderColor =\n          'var(--theme-ui-colors-palette-border-field)';\n        clone.current.style.zIndex = '1000000';\n        clone.current.style.height = 'auto';\n        clone.current.style.fill =\n          'var(--theme-ui-colors-palette-text-primary)';\n        clone.current.style.pointerEvents = 'none';\n\n        const overridenStyles = overrideStyles?.(el);\n\n        if (overridenStyles) {\n          Object.entries(overridenStyles).forEach(([name, value]) => {\n            if (name.match(/webkit/)) return;\n\n            try {\n              // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any\n              (clone.current as HTMLElement).style[name as any] =\n                value as string;\n            } catch (e) {}\n          });\n        }\n\n        clone.current.addEventListener('mouseleave', (ev) => {\n          if (\n            isChild(\n              ev.relatedTarget as HTMLElement,\n              (current) => current === el,\n            )\n          )\n            return;\n\n          clone.current?.remove();\n        });\n\n        function close() {\n          clone.current?.remove();\n          document.removeEventListener('scroll', close);\n        }\n        document.addEventListener('scroll', close);\n        document.body.append(clone.current);\n\n        const cloneBounding = clone.current.getBoundingClientRect();\n\n        const difX = Math.abs(cloneBounding.width - bound.width);\n        const difY = Math.abs(cloneBounding.height - bound.height);\n\n        if (difX < 50 && difY < 10) {\n          clone.current.remove();\n        }\n      }\n\n      function hideBox(ev: MouseEvent) {\n        if (\n          isChild(\n            ev.relatedTarget as HTMLElement,\n            (current) => current === clone.current,\n          )\n        )\n          return;\n\n        clone.current?.remove();\n      }\n\n      function handleMouseEnter() {\n        timeout.current = setTimeout(() => {\n          showBox();\n        }, 500) as unknown as number;\n      }\n      function handleMouseLeave(ev: MouseEvent) {\n        clearTimeout(timeout.current);\n        hideBox(ev);\n      }\n\n      el.addEventListener('mouseenter', handleMouseEnter);\n      el.addEventListener('mouseleave', handleMouseLeave);\n\n      unsuscribe.current = () => {\n        el.removeEventListener('mouseenter', handleMouseEnter);\n        el.removeEventListener('mouseleave', handleMouseLeave);\n        clearTimeout(timeout.current);\n      };\n    },\n    [findParent, overrideStyles],\n  );\n\n  useEffect(() => {\n    return () => {\n      clone.current?.remove();\n    };\n  }, []);\n\n  return (\n    <Box\n      ref={ref}\n      sx={{\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n        whiteSpace: 'nowrap',\n      }}\n      className=\"autoellipsis__container\"\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}