@votodigital-onpeui/react 0.1.24 → 0.1.26

package/dist/chunk-TK7PIUDL.mjs

@@ -1,107 +0,0 @@
-import { IconSpinnerDesktop, IconSpinnerMobile } from './chunk-KVVONZ3H.mjs';
-import { Modal } from './chunk-3ARR24LK.mjs';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useState, useEffect } from 'react';
-
-var colorClasses = {
-  blue: "bg-onpe-blue",
-  skyblue: "bg-onpe-skyblue",
-  "skyblue-light": "bg-onpe-skyblue-light",
-  yellow: "bg-onpe-yellow",
-  "light-skyblue": "bg-onpe-light-skyblue",
-  gray: "bg-onpe-gray",
-  "gray-light": "bg-onpe-gray-light",
-  "gray-extra-light": "bg-onpe-gray-extra-light",
-  red: "bg-onpe-red",
-  "dark-gray": "bg-onpe-dark-gray",
-  green: "bg-onpe-green",
-  "yellow-light": "bg-onpe-yellow-light",
-  primary: "bg-onpe-blue"
-};
-var sizeClasses = {
-  small: "h-10 text-sm",
-  normal: "h-12 text-base",
-  large: "h-14 text-lg"
-};
-function Button({
-  color,
-  title,
-  size = "normal",
-  className = "",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      className: [
-        "inline-flex items-center justify-center",
-        "min-w-[200px] border-none",
-        "text-white font-semibold cursor-pointer",
-        "transition-all duration-300 ease-in-out",
-        "disabled:cursor-default disabled:!bg-onpe-gray",
-        colorClasses[color],
-        sizeClasses[size],
-        className
-      ].filter(Boolean).join(" "),
-      ...props,
-      children: title
-    }
-  );
-}
-var ModalLoading = ({
-  isOpen = false,
-  onClose = () => {
-  },
-  message = "Cargando...",
-  className = "",
-  zIndexLevel = 100
-}) => {
-  const [announceMessage, setAnnounceMessage] = useState("");
-  useEffect(() => {
-    if (!isOpen) {
-      setAnnounceMessage("");
-      return;
-    }
-    setAnnounceMessage("");
-    const t = globalThis.setTimeout(() => {
-      setAnnounceMessage(message);
-    }, 150);
-    return () => {
-      globalThis.clearTimeout(t);
-    };
-  }, [isOpen, message]);
-  return /* @__PURE__ */ jsxs(
-    Modal,
-    {
-      disableFocus: true,
-      zIndexLevel,
-      isOpen,
-      onClose,
-      className,
-      closeDisabled: true,
-      whitoutBackground: true,
-      children: [
-        /* @__PURE__ */ jsx("div", { className: "sr-only", "aria-live": "assertive", "aria-atomic": "true", children: announceMessage }),
-        /* @__PURE__ */ jsx(
-          IconSpinnerDesktop,
-          {
-            className: "hidden md:block text-white animate-spin",
-            "aria-hidden": "true"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          IconSpinnerMobile,
-          {
-            className: "block md:hidden text-white animate-spin",
-            "aria-hidden": "true"
-          }
-        ),
-        /* @__PURE__ */ jsx("p", { className: "text-white leading-normal text-2xl md:text-[64px] text-center mt-10 md:mt-20", children: message })
-      ]
-    }
-  );
-};
-
-export { Button, ModalLoading };
-//# sourceMappingURL=chunk-TK7PIUDL.mjs.map
-//# sourceMappingURL=chunk-TK7PIUDL.mjs.map

package/dist/chunk-TK7PIUDL.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/Button/Button.tsx","../src/components/Feedback/ModalLoading/ModalLoading.tsx"],"names":["jsx"],"mappings":"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","file":"chunk-TK7PIUDL.mjs","sourcesContent":["type ButtonColor =\n  | \"blue\"\n  | \"skyblue\"\n  | \"skyblue-light\"\n  | \"yellow\"\n  | \"light-skyblue\"\n  | \"gray\"\n  | \"gray-light\"\n  | \"gray-extra-light\"\n  | \"red\"\n  | \"dark-gray\"\n  | \"green\"\n  | \"yellow-light\"\n  | \"primary\";\n\ntype ButtonSize = \"small\" | \"normal\" | \"large\";\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  color: ButtonColor;\n  title: string;\n  size?: ButtonSize;\n}\n\nconst colorClasses: Record<ButtonColor, string> = {\n  blue: \"bg-onpe-blue\",\n  skyblue: \"bg-onpe-skyblue\",\n  \"skyblue-light\": \"bg-onpe-skyblue-light\",\n  yellow: \"bg-onpe-yellow\",\n  \"light-skyblue\": \"bg-onpe-light-skyblue\",\n  gray: \"bg-onpe-gray\",\n  \"gray-light\": \"bg-onpe-gray-light\",\n  \"gray-extra-light\": \"bg-onpe-gray-extra-light\",\n  red: \"bg-onpe-red\",\n  \"dark-gray\": \"bg-onpe-dark-gray\",\n  green: \"bg-onpe-green\",\n  \"yellow-light\": \"bg-onpe-yellow-light\",\n  primary: \"bg-onpe-blue\",\n};\n\nconst sizeClasses: Record<ButtonSize, string> = {\n  small: \"h-10 text-sm\",\n  normal: \"h-12 text-base\",\n  large: \"h-14 text-lg\",\n};\n\nexport function Button({\n  color,\n  title,\n  size = \"normal\",\n  className = \"\",\n  ...props\n}: ButtonProps) {\n  return (\n    <button\n      className={[\n        \"inline-flex items-center justify-center\",\n        \"min-w-[200px] border-none\",\n        \"text-white font-semibold cursor-pointer\",\n        \"transition-all duration-300 ease-in-out\",\n        \"disabled:cursor-default disabled:!bg-onpe-gray\",\n        colorClasses[color],\n        sizeClasses[size],\n        className,\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      {title}\n    </button>\n  );\n}\n\nexport default Button;\n","import { useEffect, useState } from \"react\";\r\nimport { Modal } from \"../../Modal/Modal\";\r\nimport { IconSpinnerDesktop } from \"../../../icons/Actions/IconSpinnerDesktop\";\r\nimport { IconSpinnerMobile } from \"../../../icons/Actions/IconSpinnerMobile\";\r\n\r\nexport interface ModalLoadingProps {\r\n  isOpen: boolean;\r\n  onClose?: () => void;\r\n  message?: string;\r\n  className?: string;\r\n  zIndexLevel?: number;\r\n}\r\n\r\nexport const ModalLoading = ({\r\n  isOpen = false,\r\n  onClose = () => {},\r\n  message = \"Cargando...\",\r\n  className = \"\",\r\n  zIndexLevel = 100,\r\n}: ModalLoadingProps) => {\r\n  const [announceMessage, setAnnounceMessage] = useState(\"\");\r\n\r\n  useEffect(() => {\r\n    if (!isOpen) {\r\n      setAnnounceMessage(\"\");\r\n      return;\r\n    }\r\n    setAnnounceMessage(\"\");\r\n    const t = globalThis.setTimeout(() => {\r\n      setAnnounceMessage(message);\r\n    }, 150);\r\n    return () => {\r\n      globalThis.clearTimeout(t);\r\n    };\r\n  }, [isOpen, message]);\r\n\r\n  return (\r\n    <Modal\r\n      disableFocus\r\n      zIndexLevel={zIndexLevel}\r\n      isOpen={isOpen}\r\n      onClose={onClose}\r\n      className={className}\r\n      closeDisabled\r\n      whitoutBackground={true}\r\n    >\r\n      <div className=\"sr-only\" aria-live=\"assertive\" aria-atomic=\"true\">\r\n        {announceMessage}\r\n      </div>\r\n      <IconSpinnerDesktop\r\n        className=\"hidden md:block text-white animate-spin\"\r\n        aria-hidden=\"true\"\r\n      />\r\n      <IconSpinnerMobile\r\n        className=\"block md:hidden text-white animate-spin\"\r\n        aria-hidden=\"true\"\r\n      />\r\n      <p className=\"text-white leading-normal text-2xl md:text-[64px] text-center mt-10 md:mt-20\">\r\n        {message}\r\n      </p>\r\n    </Modal>\r\n  );\r\n};\r\n\r\nexport default ModalLoading;\r\n"]}