siam-ui-utils 3.0.28 → 3.0.30

package/dist/select/multi-select/index.js

@@ -1,63 +1,63 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
-import { MultiSelect as je } from "../../node_modules/react-multi-select-component/dist/esm/index.js";
-import { Row, Col } from "reactstrap";
-import BadgeLabelMultiSelect from "./badge-label-multi-select.js";
-import { BadgeWrapper, ClickableBadge } from "./styled-component.js";
-import "./index.css";
-const CustomMultiSelect = ({
-  lista = [],
-  onListaUpdate = () => {
-  },
-  value = [],
-  styles = {}
-}) => {
-  const [selected, setSelected] = useState([]);
-  const overrideStringsCustom = {
-    selectSomeItems: "Seleccionar Estado/s",
-    allItemsAreSelected: "Todos Seleccionados",
-    search: "Buscar...",
-    selectAll: "SELECCIONAR TODOS"
-  };
-  useEffect(() => {
-    if (value.length) {
-      setSelected(value);
-    }
-  }, [value]);
-  const handleCheckChange = (selectedOptions) => {
-    if (selectedOptions) {
-      setSelected(selectedOptions);
-      onListaUpdate(selectedOptions);
-    }
-  };
-  const handleRemoveBadge = (valueToRemove) => {
-    const updated = selected.filter((item) => item.value !== valueToRemove);
-    setSelected(updated);
-    onListaUpdate(updated);
-  };
-  return /* @__PURE__ */ jsxs(Row, { className: "align-items-center", children: [
-    /* @__PURE__ */ jsx(Col, { xs: 6, style: { ...styles }, children: /* @__PURE__ */ jsx(
-      je,
-      {
-        options: lista,
-        value: selected,
-        onChange: handleCheckChange,
-        labelledBy: "Seleccionar",
-        className: "custom-multiselect",
-        overrideStrings: overrideStringsCustom
-      }
-    ) }),
-    /* @__PURE__ */ jsx(Col, { xs: 6, style: { marginTop: "0.5rem" }, children: selected.length > 0 && /* @__PURE__ */ jsx(BadgeWrapper, { children: selected.length === lista.length ? /* @__PURE__ */ jsx(ClickableBadge, { color: "info", pill: true, children: "Todos" }) : /* @__PURE__ */ jsx(
-      BadgeLabelMultiSelect,
-      {
-        descripcionLabel: selected,
-        onRemove: handleRemoveBadge
-      }
-    ) }) })
-  ] });
-};
-export {
-  CustomMultiSelect,
-  CustomMultiSelect as default
-};
-//# sourceMappingURL=index.js.map
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { MultiSelect as je } from "../../node_modules/react-multi-select-component/dist/esm/index.js";
+import { Row, Col } from "reactstrap";
+import BadgeLabelMultiSelect from "./badge-label-multi-select.js";
+import { BadgeWrapper, ClickableBadge } from "./styled-component.js";
+import "./index.css";
+const CustomMultiSelect = ({
+  lista = [],
+  onListaUpdate = () => {
+  },
+  value = [],
+  styles = {}
+}) => {
+  const [selected, setSelected] = useState([]);
+  const overrideStringsCustom = {
+    selectSomeItems: "Seleccionar Estado/s",
+    allItemsAreSelected: "Todos Seleccionados",
+    search: "Buscar...",
+    selectAll: "SELECCIONAR TODOS"
+  };
+  useEffect(() => {
+    if (value.length) {
+      setSelected(value);
+    }
+  }, [value]);
+  const handleCheckChange = (selectedOptions) => {
+    if (selectedOptions) {
+      setSelected(selectedOptions);
+      onListaUpdate(selectedOptions);
+    }
+  };
+  const handleRemoveBadge = (valueToRemove) => {
+    const updated = selected.filter((item) => item.value !== valueToRemove);
+    setSelected(updated);
+    onListaUpdate(updated);
+  };
+  return /* @__PURE__ */ jsxs(Row, { className: "align-items-center", children: [
+    /* @__PURE__ */ jsx(Col, { xs: 6, style: { ...styles }, children: /* @__PURE__ */ jsx(
+      je,
+      {
+        options: lista,
+        value: selected,
+        onChange: handleCheckChange,
+        labelledBy: "Seleccionar",
+        className: "custom-multiselect",
+        overrideStrings: overrideStringsCustom
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Col, { xs: 6, style: { marginTop: "0.5rem" }, children: selected.length > 0 && /* @__PURE__ */ jsx(BadgeWrapper, { children: selected.length === lista.length ? /* @__PURE__ */ jsx(ClickableBadge, { color: "info", pill: true, children: "Todos" }) : /* @__PURE__ */ jsx(
+      BadgeLabelMultiSelect,
+      {
+        descripcionLabel: selected,
+        onRemove: handleRemoveBadge
+      }
+    ) }) })
+  ] });
+};
+export {
+  CustomMultiSelect,
+  CustomMultiSelect as default
+};
+//# sourceMappingURL=index.js.map

package/dist/select/multi-select/styled-component.js

@@ -1,24 +1,24 @@
-import { Badge } from "reactstrap";
-import styled from "styled-components";
-const ClickableBadge = styled(Badge)`
-  cursor: pointer;
-  width: fit-content;
-  white-space: nowrap;
-`;
-const BadgeWrapper = styled.div`
-  display: inline-flex;
-  flex-wrap: nowrap;
-  gap: 10px;
-  padding: 0.5rem;
-  border-radius: 0.5rem;
-  background-color: #f1f1f1;
-  border: 1px solid #ccc;
-  margin-top: 2.8rem;
-  max-width: 120%;
-  overflow-x: auto;
-`;
-export {
-  BadgeWrapper,
-  ClickableBadge
-};
-//# sourceMappingURL=styled-component.js.map
+import { Badge } from "reactstrap";
+import styled from "styled-components";
+const ClickableBadge = styled(Badge)`
+  cursor: pointer;
+  width: fit-content;
+  white-space: nowrap;
+`;
+const BadgeWrapper = styled.div`
+  display: inline-flex;
+  flex-wrap: nowrap;
+  gap: 10px;
+  padding: 0.5rem;
+  border-radius: 0.5rem;
+  background-color: #f1f1f1;
+  border: 1px solid #ccc;
+  margin-top: 2.8rem;
+  max-width: 120%;
+  overflow-x: auto;
+`;
+export {
+  BadgeWrapper,
+  ClickableBadge
+};
+//# sourceMappingURL=styled-component.js.map

package/dist/timer/index.js

@@ -1,60 +1,60 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useRef, useEffect } from "react";
-import "./styles.css";
-const formatTiempo = (ms) => {
-  if (ms == null) return "--:--";
-  const absMs = Math.abs(ms);
-  const totalSec = Math.floor(absMs / 1e3);
-  const min = Math.floor(totalSec / 60);
-  const sec = totalSec % 60;
-  const formatted = `${min.toString().padStart(2, "0")}:${sec.toString().padStart(2, "0")}`;
-  return ms < 0 ? `-${formatted}` : formatted;
-};
-const getTimerColorClass = (ms, maxTime) => {
-  if (!maxTime) return "";
-  const percent = ms / maxTime;
-  if (percent > 0.33) return "timer-green";
-  if (percent > 0.15) return "timer-yellow";
-  if (percent > 0) return "timer-red";
-  if (ms === 0) return "timer-out";
-  if (ms < 0) return "timer-over";
-  return "";
-};
-const Timer = ({
-  initialMinutes = 0,
-  icon = true,
-  className = "",
-  active = true,
-  style = {}
-}) => {
-  const initialMs = initialMinutes * 60 * 1e3;
-  const [ms, setMs] = useState(initialMs);
-  const intervalRef = useRef();
-  useEffect(() => {
-    if (!active) return;
-    intervalRef.current = setInterval(() => {
-      setMs((prev) => prev - 1e3);
-    }, 1e3);
-    return () => clearInterval(intervalRef.current);
-  }, [active]);
-  useEffect(() => {
-    setMs(initialMs);
-  }, [initialMs]);
-  const timerColorClass = getTimerColorClass(ms, initialMs);
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      className: `av-video-timer timer ${timerColorClass} ${className}`,
-      style,
-      children: [
-        icon && /* @__PURE__ */ jsx("i", { className: "icon-clock timer" }),
-        formatTiempo(ms)
-      ]
-    }
-  );
-};
-export {
-  Timer,
-  formatTiempo
-};
-//# sourceMappingURL=index.js.map
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+import "./styles.css";
+const formatTiempo = (ms) => {
+  if (ms == null) return "--:--";
+  const absMs = Math.abs(ms);
+  const totalSec = Math.floor(absMs / 1e3);
+  const min = Math.floor(totalSec / 60);
+  const sec = totalSec % 60;
+  const formatted = `${min.toString().padStart(2, "0")}:${sec.toString().padStart(2, "0")}`;
+  return ms < 0 ? `-${formatted}` : formatted;
+};
+const getTimerColorClass = (ms, maxTime) => {
+  if (!maxTime) return "";
+  const percent = ms / maxTime;
+  if (percent > 0.33) return "timer-green";
+  if (percent > 0.15) return "timer-yellow";
+  if (percent > 0) return "timer-red";
+  if (ms === 0) return "timer-out";
+  if (ms < 0) return "timer-over";
+  return "";
+};
+const Timer = ({
+  initialMinutes = 0,
+  icon = true,
+  className = "",
+  active = true,
+  style = {}
+}) => {
+  const initialMs = initialMinutes * 60 * 1e3;
+  const [ms, setMs] = useState(initialMs);
+  const intervalRef = useRef();
+  useEffect(() => {
+    if (!active) return;
+    intervalRef.current = setInterval(() => {
+      setMs((prev) => prev - 1e3);
+    }, 1e3);
+    return () => clearInterval(intervalRef.current);
+  }, [active]);
+  useEffect(() => {
+    setMs(initialMs);
+  }, [initialMs]);
+  const timerColorClass = getTimerColorClass(ms, initialMs);
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: `av-video-timer timer ${timerColorClass} ${className}`,
+      style,
+      children: [
+        icon && /* @__PURE__ */ jsx("i", { className: "icon-clock timer" }),
+        formatTiempo(ms)
+      ]
+    }
+  );
+};
+export {
+  Timer,
+  formatTiempo
+};
+//# sourceMappingURL=index.js.map

package/dist/timer/styles.css

@@ -1,59 +1,59 @@
-.av-video-timer {
-  color: inherit;
-  margin: 0 12px;
-  flex: 1;
-  text-align: center;
-  display: flex;
-  justify-content: center;
-  font-weight: bold;
-  align-items: center;
-  font-size: 1.3em;
-  width: 100%;
-  margin: 8px 0;
-}
-
-.timer {
-  font-size: clamp(5px, 2vw, 20px);
-  margin-right: 4px;
-}
-
-.timer-green {
-  color: #28a745;
-}
-
-.timer-yellow {
-  color: #ffc107;
-}
-
-.timer-red {
-  color: #bd0300;
-}
-
-@keyframes vibrate {
-  0% {
-    transform: translateX(0);
-  }
-  20% {
-    transform: translateX(-3px);
-  }
-  40% {
-    transform: translateX(3px);
-  }
-  60% {
-    transform: translateX(-3px);
-  }
-  80% {
-    transform: translateX(3px);
-  }
-  100% {
-    transform: translateX(0);
-  }
-}
-.timer-out {
-  color: #000000;
-  animation: vibrate 0.3s linear infinite;
-}
-
-.timer-over {
-  color: #c00805;
+.av-video-timer {
+  color: inherit;
+  margin: 0 12px;
+  flex: 1;
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  font-weight: bold;
+  align-items: center;
+  font-size: 1.3em;
+  width: 100%;
+  margin: 8px 0;
+}
+
+.timer {
+  font-size: clamp(5px, 2vw, 20px);
+  margin-right: 4px;
+}
+
+.timer-green {
+  color: #28a745;
+}
+
+.timer-yellow {
+  color: #ffc107;
+}
+
+.timer-red {
+  color: #bd0300;
+}
+
+@keyframes vibrate {
+  0% {
+    transform: translateX(0);
+  }
+  20% {
+    transform: translateX(-3px);
+  }
+  40% {
+    transform: translateX(3px);
+  }
+  60% {
+    transform: translateX(-3px);
+  }
+  80% {
+    transform: translateX(3px);
+  }
+  100% {
+    transform: translateX(0);
+  }
+}
+.timer-out {
+  color: #000000;
+  animation: vibrate 0.3s linear infinite;
+}
+
+.timer-over {
+  color: #c00805;
 }

package/dist/tomar-foto/index.js

@@ -1,62 +1,62 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { useState } from "react";
-import { Row } from "reactstrap";
-import { DropzoneUploader } from "../dropzone-uploader/base/index.js";
-import { Colxx } from "../CustomBootstrap.js";
-import imgHacerFoto from "../assets/img/take-photo.jpg.js";
-import { TAKE_PHOTO } from "../constants.js";
-const TomarFoto = ({
-  onFilesSelectedSelfie = () => {
-  },
-  isMobile = false
-}) => {
-  const [filesTotalSelectedSelfie, setTotalFilesSelectedSelfie] = useState(0);
-  const {
-    LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE,
-    MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE,
-    TAKE_PHOTO_MESSAGE
-  } = TAKE_PHOTO;
-  const handleFilesSelectedSelfie = (files) => {
-    setTotalFilesSelectedSelfie(files.length);
-    onFilesSelectedSelfie(files);
-  };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Row, { className: "pt-2 ml-4", children: /* @__PURE__ */ jsx(Colxx, { xxs: "11", md: "5", children: LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE }) }),
-    /* @__PURE__ */ jsx(Row, { className: "pt-2 ml-2", children: /* @__PURE__ */ jsx(Colxx, { xxs: "12", md: "9", children: isMobile ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Colxx, { xxs: "12", className: "text-center", children: [
-      filesTotalSelectedSelfie === 0 && /* @__PURE__ */ jsx(
-        "img",
-        {
-          style: { width: "97%" },
-          alt: "hacerFotoDNI",
-          src: imgHacerFoto
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        DropzoneUploader,
-        {
-          className: "pt-2 ml-2",
-          maxFiles: 1,
-          onChangeFiles: handleFilesSelectedSelfie,
-          totalFiles: filesTotalSelectedSelfie,
-          accept: "image/jpg,image/jpeg",
-          capture: "environment",
-          nameFileLabel: TAKE_PHOTO_MESSAGE
-        }
-      )
-    ] }) }) : /* @__PURE__ */ jsx(
-      "h2",
-      {
-        className: "view-icon iconsminds-smartphone-4 ml-2 mr-2",
-        style: {
-          color: "red",
-          margin: "10px 10px 0px 10px"
-        },
-        children: MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE
-      }
-    ) }) })
-  ] });
-};
-export {
-  TomarFoto
-};
-//# sourceMappingURL=index.js.map
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { Row } from "reactstrap";
+import { DropzoneUploader } from "../dropzone-uploader/base/index.js";
+import { Colxx } from "../CustomBootstrap.js";
+import imgHacerFoto from "../assets/img/take-photo.jpg.js";
+import { TAKE_PHOTO } from "../constants.js";
+const TomarFoto = ({
+  onFilesSelectedSelfie = () => {
+  },
+  isMobile = false
+}) => {
+  const [filesTotalSelectedSelfie, setTotalFilesSelectedSelfie] = useState(0);
+  const {
+    LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE,
+    MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE,
+    TAKE_PHOTO_MESSAGE
+  } = TAKE_PHOTO;
+  const handleFilesSelectedSelfie = (files) => {
+    setTotalFilesSelectedSelfie(files.length);
+    onFilesSelectedSelfie(files);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Row, { className: "pt-2 ml-4", children: /* @__PURE__ */ jsx(Colxx, { xxs: "11", md: "5", children: LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE }) }),
+    /* @__PURE__ */ jsx(Row, { className: "pt-2 ml-2", children: /* @__PURE__ */ jsx(Colxx, { xxs: "12", md: "9", children: isMobile ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Colxx, { xxs: "12", className: "text-center", children: [
+      filesTotalSelectedSelfie === 0 && /* @__PURE__ */ jsx(
+        "img",
+        {
+          style: { width: "97%" },
+          alt: "hacerFotoDNI",
+          src: imgHacerFoto
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        DropzoneUploader,
+        {
+          className: "pt-2 ml-2",
+          maxFiles: 1,
+          onChangeFiles: handleFilesSelectedSelfie,
+          totalFiles: filesTotalSelectedSelfie,
+          accept: "image/jpg,image/jpeg",
+          capture: "environment",
+          nameFileLabel: TAKE_PHOTO_MESSAGE
+        }
+      )
+    ] }) }) : /* @__PURE__ */ jsx(
+      "h2",
+      {
+        className: "view-icon iconsminds-smartphone-4 ml-2 mr-2",
+        style: {
+          color: "red",
+          margin: "10px 10px 0px 10px"
+        },
+        children: MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE
+      }
+    ) }) })
+  ] });
+};
+export {
+  TomarFoto
+};
+//# sourceMappingURL=index.js.map

package/dist/view-layout/button-editor.js

@@ -1,14 +1,14 @@
-import { jsx } from "react/jsx-runtime";
-import "./styles.css";
-const ButtonEditor = ({ activo, onClick }) => /* @__PURE__ */ jsx(
-  "button",
-  {
-    className: `visualizador-editor-btn ${activo ? "visualizador-editor-btn--activo" : "visualizador-editor-btn--inactivo"}`,
-    onClick,
-    children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx("i", { className: "icon-eye simple-icon-eye" }) })
-  }
-);
-export {
-  ButtonEditor as default
-};
-//# sourceMappingURL=button-editor.js.map
+import { jsx } from "react/jsx-runtime";
+import "./styles.css";
+const ButtonEditor = ({ activo, onClick }) => /* @__PURE__ */ jsx(
+  "button",
+  {
+    className: `visualizador-editor-btn ${activo ? "visualizador-editor-btn--activo" : "visualizador-editor-btn--inactivo"}`,
+    onClick,
+    children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx("i", { className: "icon-eye simple-icon-eye" }) })
+  }
+);
+export {
+  ButtonEditor as default
+};
+//# sourceMappingURL=button-editor.js.map

package/dist/view-layout/constants.js

@@ -1,11 +1,11 @@
-const GRID_SIZES = {
-  sm: { cols: 18, rows: 18 },
-  md: { cols: 12, rows: 12 },
-  lg: { cols: 6, rows: 6 }
-};
-const LOCALHOST = ["localhost", "127.0.0.1"];
-export {
-  GRID_SIZES,
-  LOCALHOST
-};
-//# sourceMappingURL=constants.js.map
+const GRID_SIZES = {
+  sm: { cols: 18, rows: 18 },
+  md: { cols: 12, rows: 12 },
+  lg: { cols: 6, rows: 6 }
+};
+const LOCALHOST = ["localhost", "127.0.0.1"];
+export {
+  GRID_SIZES,
+  LOCALHOST
+};
+//# sourceMappingURL=constants.js.map

package/dist/view-layout/editor-layer.js

@@ -1,28 +1,28 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import "./styles.css";
-const EditorLayer = ({ gridCols, gridRows }) => {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: "editor-layer",
-      style: {
-        gridTemplateColumns: `repeat(${gridCols}, 1fr)`,
-        gridTemplateRows: `repeat(${gridRows}, 1fr)`
-      },
-      children: Array.from({ length: gridRows * gridCols }).map((_, idx) => {
-        const x = idx % gridCols;
-        const y = Math.floor(idx / gridCols);
-        return /* @__PURE__ */ jsx("div", { className: "editor-layer-cell", children: /* @__PURE__ */ jsxs("div", { className: "editor-layer-cell-coord", children: [
-          "x:",
-          x,
-          ";y:",
-          y
-        ] }) }, `cell-${x}-${y}`);
-      })
-    }
-  );
-};
-export {
-  EditorLayer as default
-};
-//# sourceMappingURL=editor-layer.js.map
+import { jsx, jsxs } from "react/jsx-runtime";
+import "./styles.css";
+const EditorLayer = ({ gridCols, gridRows }) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "editor-layer",
+      style: {
+        gridTemplateColumns: `repeat(${gridCols}, 1fr)`,
+        gridTemplateRows: `repeat(${gridRows}, 1fr)`
+      },
+      children: Array.from({ length: gridRows * gridCols }).map((_, idx) => {
+        const x = idx % gridCols;
+        const y = Math.floor(idx / gridCols);
+        return /* @__PURE__ */ jsx("div", { className: "editor-layer-cell", children: /* @__PURE__ */ jsxs("div", { className: "editor-layer-cell-coord", children: [
+          "x:",
+          x,
+          ";y:",
+          y
+        ] }) }, `cell-${x}-${y}`);
+      })
+    }
+  );
+};
+export {
+  EditorLayer as default
+};
+//# sourceMappingURL=editor-layer.js.map