siam-ui-utils 3.0.2 → 3.0.4

package/dist/assets/siam-ui-utils.css

@@ -203,7 +203,30 @@
 .custom-file-input {
   box-shadow: initial !important;
 }
-.dzu-dropzone {
+.rmsc input[type=checkbox] {
+  accent-color: #900604;
+}
+
+.rmsc .item:hover {
+  background-color: #f8e1e1;
+}
+
+.rmsc input[type=checkbox]:focus {
+  outline: 2px solid #900604;
+  outline-offset: 2px;
+}
+
+.custom-multiselect .dropdown-container {
+  min-height: 38px;
+}
+
+.dropdown-heading-value {
+  color: green;
+  height: 2rem;
+  display: inline;
+  font-weight: bold;
+  padding: 0.4rem;
+}.dzu-dropzone {
   display: flex;
   flex-direction: column;
   align-items: center;

package/dist/custom-input/CustomInputFile.js

@@ -0,0 +1,46 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { FormGroup, Label, Input } from "reactstrap";
+import { MENSAJE } from "./constant.js";
+/* empty css          */
+const CustomInputFile = ({
+  accept,
+  className = "",
+  id,
+  label,
+  name,
+  onChange
+}) => {
+  const [fileName, setFileName] = useState(label || LABEL_FILE);
+  const { LABEL_FILE } = MENSAJE;
+  const handleFileChange = (event) => {
+    const files = event.target.files;
+    if (files.length > 0) {
+      setFileName(files[0].name);
+    } else {
+      setFileName(label || LABEL_FILE);
+    }
+    if (onChange) {
+      onChange(event);
+    }
+  };
+  return /* @__PURE__ */ jsxs(FormGroup, { className: `custom-file ${className}`, children: [
+    /* @__PURE__ */ jsx(Label, { for: id, className: "custom-file-label", children: fileName }),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        id,
+        name,
+        accept,
+        type: "file",
+        onChange: handleFileChange,
+        className: "custom-file-input"
+      }
+    )
+  ] });
+};
+export {
+  CustomInputFile,
+  CustomInputFile as default
+};
+//# sourceMappingURL=CustomInputFile.js.map

package/dist/custom-input/CustomInputFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomInputFile.js","sources":["../../src/custom-input/CustomInputFile.jsx"],"sourcesContent":["import { useState } from 'react';\r\nimport { FormGroup, Input, Label } from 'reactstrap';\r\nimport { MENSAJE } from './constant';\r\nimport './index.css';\r\n\r\nexport const CustomInputFile = ({\r\n  accept,\r\n  className = '',\r\n  id,\r\n  label,\r\n  name,\r\n  onChange,\r\n}) => {\r\n  const [fileName, setFileName] = useState(label || LABEL_FILE);\r\n  const { LABEL_FILE } = MENSAJE;\r\n  const handleFileChange = (event) => {\r\n    const files = event.target.files;\r\n    if (files.length > 0) {\r\n      setFileName(files[0].name);\r\n    } else {\r\n      setFileName(label || LABEL_FILE);\r\n    }\r\n\r\n    if (onChange) {\r\n      onChange(event);\r\n    }\r\n  };\r\n\r\n  return (\r\n    <FormGroup className={`custom-file ${className}`}>\r\n      <Label for={id} className=\"custom-file-label\">\r\n        {fileName}\r\n      </Label>\r\n      <Input\r\n        id={id}\r\n        name={name}\r\n        accept={accept}\r\n        type=\"file\"\r\n        onChange={handleFileChange}\r\n        className=\"custom-file-input\"\r\n      />\r\n    </FormGroup>\r\n  );\r\n};\r\n\r\nexport default CustomInputFile;\r\n"],"names":[],"mappings":";;;;;AAKO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,SAAS,UAAU;AAC5D,QAAM,EAAE,eAAe;AACvB,QAAM,mBAAmB,CAAC,UAAU;AAClC,UAAM,QAAQ,MAAM,OAAO;AAC3B,QAAI,MAAM,SAAS,GAAG;AACpB,kBAAY,MAAM,CAAC,EAAE,IAAI;AAAA,IAC3B,OAAO;AACL,kBAAY,SAAS,UAAU;AAAA,IACjC;AAEA,QAAI,UAAU;AACZ,eAAS,KAAK;AAAA,IAChB;AAAA,EACF;AAEA,SACE,qBAAC,WAAA,EAAU,WAAW,eAAe,SAAS,IAC5C,UAAA;AAAA,IAAA,oBAAC,OAAA,EAAM,KAAK,IAAI,WAAU,qBACvB,UAAA,UACH;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAK;AAAA,QACL,UAAU;AAAA,QACV,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACZ,GACF;AAEJ;"}

package/dist/custom-input/constant.js

@@ -0,0 +1,5 @@
+const MENSAJE = { LABEL_FILE: "Elija el archivo..." };
+export {
+  MENSAJE
+};
+//# sourceMappingURL=constant.js.map

package/dist/custom-input/constant.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constant.js","sources":["../../src/custom-input/constant.js"],"sourcesContent":["export const MENSAJE = { LABEL_FILE: 'Elija el archivo...' };\r\n"],"names":[],"mappings":"AAAY,MAAC,UAAU,EAAE,YAAY,sBAAqB;"}

package/dist/custom-input/index.js

@@ -1,7 +1,16 @@
 import { CustomInputCheckbox } from "./CustomInputCheckbox.js";
 import { CustomInputRadio } from "./CustomInputRadio.js";
+import { CustomInputFile } from "./CustomInputFile.js";
+import "react/jsx-runtime";
+import "react";
+import "../node_modules/react-multi-select-component/dist/esm/index.js";
+import "reactstrap";
+import "siam-utils";
+import "./multi-select/styled-component.js";
+/* empty css                        */
 export {
   CustomInputCheckbox,
+  CustomInputFile,
   CustomInputRadio
 };
 //# sourceMappingURL=index.js.map

package/dist/custom-input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

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

@@ -0,0 +1,20 @@
+import { Badge } from "reactstrap";
+import styled from "styled-components";
+styled(Badge)`
+  cursor: pointer;
+  width: fit-content;
+  white-space: nowrap;
+`;
+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;
+`;
+//# sourceMappingURL=styled-component.js.map

package/dist/custom-input/multi-select/styled-component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled-component.js","sources":["../../../src/custom-input/multi-select/styled-component.js"],"sourcesContent":["import { Badge } from 'reactstrap';\r\nimport styled from 'styled-components';\r\n\r\nexport const ClickableBadge = styled(Badge)`\r\n  cursor: pointer;\r\n  width: fit-content;\r\n  white-space: nowrap;\r\n`;\r\n\r\nexport const BadgeWrapper = styled.div`\r\n  display: inline-flex;\r\n  flex-wrap: nowrap;\r\n  gap: 10px;\r\n  padding: 0.5rem;\r\n  border-radius: 0.5rem;\r\n  background-color: #f1f1f1;\r\n  border: 1px solid #ccc;\r\n  margin-top: 2.8rem;\r\n  max-width: 120%;\r\n  overflow-x: auto;\r\n`;\r\n"],"names":[],"mappings":";;AAG8B,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAMd,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/intl-messages/index.js

@@ -1,10 +1,11 @@
 import { jsx } from "react/jsx-runtime";
 import { injectIntl, FormattedMessage } from "react-intl";
 const InjectMessage = (props) => /* @__PURE__ */ jsx(FormattedMessage, { ...props });
-const index = injectIntl(InjectMessage, {
+const IntlMessages = injectIntl(InjectMessage, {
   withRef: false
 });
 export {
-  index as default
+  IntlMessages,
+  IntlMessages as default
 };
 //# sourceMappingURL=index.js.map

package/dist/intl-messages/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/intl-messages/index.jsx"],"sourcesContent":["import { FormattedMessage, injectIntl } from 'react-intl';\r\n\r\nconst InjectMessage = (props) => <FormattedMessage {...props} />;\r\n\r\nexport default injectIntl(InjectMessage, {\r\n  withRef: false,\r\n});\r\n"],"names":[],"mappings":";;AAEA,MAAM,gBAAgB,CAAC,UAAU,oBAAC,kBAAA,EAAkB,GAAG,OAAO;AAE9D,MAAA,QAAe,WAAW,eAAe;AAAA,EACvC,SAAS;AACX,CAAC;"}
+{"version":3,"file":"index.js","sources":["../../src/intl-messages/index.jsx"],"sourcesContent":["import { FormattedMessage, injectIntl } from 'react-intl';\r\n\r\nconst InjectMessage = (props) => <FormattedMessage {...props} />;\r\n\r\nexport const IntlMessages = injectIntl(InjectMessage, {\r\n  withRef: false,\r\n});\r\n\r\nexport default IntlMessages;\r\n"],"names":[],"mappings":";;AAEA,MAAM,gBAAgB,CAAC,UAAU,oBAAC,kBAAA,EAAkB,GAAG,OAAO;AAEvD,MAAM,eAAe,WAAW,eAAe;AAAA,EACpD,SAAS;AACX,CAAC;"}

package/dist/node_modules/react-multi-select-component/dist/esm/index.js

@@ -0,0 +1,11 @@
+import React from "react";
+import "react/jsx-runtime";
+function V(e, { insertAt: n } = {}) {
+  if (typeof document > "u") return;
+  let t = document.head || document.getElementsByTagName("head")[0], r = document.createElement("style");
+  r.type = "text/css", n === "top" && t.firstChild ? t.insertBefore(r, t.firstChild) : t.appendChild(r), r.styleSheet ? r.styleSheet.cssText = e : r.appendChild(document.createTextNode(e));
+}
+V(`.rmsc{--rmsc-main: #4285f4;--rmsc-hover: #f1f3f5;--rmsc-selected: #e2e6ea;--rmsc-border: #ccc;--rmsc-gray: #aaa;--rmsc-bg: #fff;--rmsc-p: 10px;--rmsc-radius: 4px;--rmsc-h: 38px}.rmsc *{box-sizing:border-box;transition:all .2s ease}.rmsc .gray{color:var(--rmsc-gray)}.rmsc .dropdown-content{position:absolute;z-index:1;top:100%;width:100%;padding-top:8px}.rmsc .dropdown-content .panel-content{overflow:hidden;border-radius:var(--rmsc-radius);background:var(--rmsc-bg);box-shadow:0 0 0 1px #0000001a,0 4px 11px #0000001a}.rmsc .dropdown-container{position:relative;outline:0;background-color:var(--rmsc-bg);border:1px solid var(--rmsc-border);border-radius:var(--rmsc-radius)}.rmsc .dropdown-container[aria-disabled=true]:focus-within{box-shadow:var(--rmsc-gray) 0 0 0 1px;border-color:var(--rmsc-gray)}.rmsc .dropdown-container:focus-within{box-shadow:var(--rmsc-main) 0 0 0 1px;border-color:var(--rmsc-main)}.rmsc .dropdown-heading{position:relative;padding:0 var(--rmsc-p);display:flex;align-items:center;width:100%;height:var(--rmsc-h);cursor:default;outline:0}.rmsc .dropdown-heading .dropdown-heading-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.rmsc .clear-selected-button{cursor:pointer;background:none;border:0;padding:0;display:flex}.rmsc .options{max-height:260px;overflow-y:auto;margin:0;padding-left:0}.rmsc .options li{list-style:none;margin:0}.rmsc .select-item{box-sizing:border-box;cursor:pointer;display:block;padding:var(--rmsc-p);outline-offset:-1px;outline-color:var(--rmsc-primary)}.rmsc .select-item:hover{background:var(--rmsc-hover)}.rmsc .select-item.selected{background:var(--rmsc-selected)}.rmsc .no-options{padding:var(--rmsc-p);text-align:center;color:var(--rmsc-gray)}.rmsc .search{width:100%;position:relative;border-bottom:1px solid var(--rmsc-border)}.rmsc .search input{background:none;height:var(--rmsc-h);padding:0 var(--rmsc-p);width:100%;outline:0;border:0;font-size:1em}.rmsc .search input:focus{background:var(--rmsc-hover)}.rmsc .search-clear-button{cursor:pointer;position:absolute;top:0;right:0;bottom:0;background:none;border:0;padding:0 calc(var(--rmsc-p) / 2)}.rmsc .search-clear-button [hidden]{display:none}.rmsc .item-renderer{display:flex;align-items:baseline}.rmsc .item-renderer input{margin:0 5px 0 0}.rmsc .item-renderer.disabled{opacity:.5}.rmsc .spinner{animation:rotate 2s linear infinite}.rmsc .spinner .path{stroke:var(--rmsc-border);stroke-width:4px;stroke-linecap:round;animation:dash 1.5s ease-in-out infinite}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}
+`);
+React.createContext({});
+//# sourceMappingURL=index.js.map

package/dist/node_modules/react-multi-select-component/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../node_modules/react-multi-select-component/dist/esm/index.js"],"sourcesContent":["function V(e,{insertAt:n}={}){if(!e||typeof document>\"u\")return;let t=document.head||document.getElementsByTagName(\"head\")[0],r=document.createElement(\"style\");r.type=\"text/css\",n===\"top\"&&t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}V(`.rmsc{--rmsc-main: #4285f4;--rmsc-hover: #f1f3f5;--rmsc-selected: #e2e6ea;--rmsc-border: #ccc;--rmsc-gray: #aaa;--rmsc-bg: #fff;--rmsc-p: 10px;--rmsc-radius: 4px;--rmsc-h: 38px}.rmsc *{box-sizing:border-box;transition:all .2s ease}.rmsc .gray{color:var(--rmsc-gray)}.rmsc .dropdown-content{position:absolute;z-index:1;top:100%;width:100%;padding-top:8px}.rmsc .dropdown-content .panel-content{overflow:hidden;border-radius:var(--rmsc-radius);background:var(--rmsc-bg);box-shadow:0 0 0 1px #0000001a,0 4px 11px #0000001a}.rmsc .dropdown-container{position:relative;outline:0;background-color:var(--rmsc-bg);border:1px solid var(--rmsc-border);border-radius:var(--rmsc-radius)}.rmsc .dropdown-container[aria-disabled=true]:focus-within{box-shadow:var(--rmsc-gray) 0 0 0 1px;border-color:var(--rmsc-gray)}.rmsc .dropdown-container:focus-within{box-shadow:var(--rmsc-main) 0 0 0 1px;border-color:var(--rmsc-main)}.rmsc .dropdown-heading{position:relative;padding:0 var(--rmsc-p);display:flex;align-items:center;width:100%;height:var(--rmsc-h);cursor:default;outline:0}.rmsc .dropdown-heading .dropdown-heading-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.rmsc .clear-selected-button{cursor:pointer;background:none;border:0;padding:0;display:flex}.rmsc .options{max-height:260px;overflow-y:auto;margin:0;padding-left:0}.rmsc .options li{list-style:none;margin:0}.rmsc .select-item{box-sizing:border-box;cursor:pointer;display:block;padding:var(--rmsc-p);outline-offset:-1px;outline-color:var(--rmsc-primary)}.rmsc .select-item:hover{background:var(--rmsc-hover)}.rmsc .select-item.selected{background:var(--rmsc-selected)}.rmsc .no-options{padding:var(--rmsc-p);text-align:center;color:var(--rmsc-gray)}.rmsc .search{width:100%;position:relative;border-bottom:1px solid var(--rmsc-border)}.rmsc .search input{background:none;height:var(--rmsc-h);padding:0 var(--rmsc-p);width:100%;outline:0;border:0;font-size:1em}.rmsc .search input:focus{background:var(--rmsc-hover)}.rmsc .search-clear-button{cursor:pointer;position:absolute;top:0;right:0;bottom:0;background:none;border:0;padding:0 calc(var(--rmsc-p) / 2)}.rmsc .search-clear-button [hidden]{display:none}.rmsc .item-renderer{display:flex;align-items:baseline}.rmsc .item-renderer input{margin:0 5px 0 0}.rmsc .item-renderer.disabled{opacity:.5}.rmsc .spinner{animation:rotate 2s linear infinite}.rmsc .spinner .path{stroke:var(--rmsc-border);stroke-width:4px;stroke-linecap:round;animation:dash 1.5s ease-in-out infinite}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}\n`);import oe,{useEffect as Pe,useState as Ne}from\"react\";import{jsx as Te}from\"react/jsx-runtime\";var Me={allItemsAreSelected:\"All items are selected.\",clearSearch:\"Clear Search\",clearSelected:\"Clear Selected\",noOptions:\"No options\",search:\"Search\",selectAll:\"Select All\",selectAllFiltered:\"Select All (Filtered)\",selectSomeItems:\"Select...\",create:\"Create\"},De={value:[],hasSelectAll:!0,className:\"multi-select\",debounceDuration:200,options:[]},re=oe.createContext({}),ne=({props:e,children:n})=>{let[t,r]=Ne(e.options),a=c=>{var u;return((u=e.overrideStrings)==null?void 0:u[c])||Me[c]};return Pe(()=>{r(e.options)},[e.options]),Te(re.Provider,{value:{t:a,...De,...e,options:t,setOptions:r},children:n})},w=()=>oe.useContext(re);import{useEffect as ye,useRef as Qe,useState as J}from\"react\";import{useEffect as Fe,useRef as Le}from\"react\";function se(e,n){let t=Le(!1);Fe(()=>{t.current?e():t.current=!0},n)}import{useCallback as Ke,useEffect as ae,useMemo as We,useRef as _e}from\"react\";var He={when:!0,eventTypes:[\"keydown\"]};function R(e,n,t){let r=We(()=>Array.isArray(e)?e:[e],[e]),a=Object.assign({},He,t),{when:c,eventTypes:u}=a,b=_e(n),{target:s}=a;ae(()=>{b.current=n});let p=Ke(i=>{r.some(l=>i.key===l||i.code===l)&&b.current(i)},[r]);ae(()=>{if(c&&typeof window<\"u\"){let i=s?s.current:window;return u.forEach(l=>{i&&i.addEventListener(l,p)}),()=>{u.forEach(l=>{i&&i.removeEventListener(l,p)})}}},[c,u,r,s,n])}var f={ARROW_DOWN:\"ArrowDown\",ARROW_UP:\"ArrowUp\",ENTER:\"Enter\",ESCAPE:\"Escape\",SPACE:\"Space\"};import{useCallback as Ge,useEffect as fe,useMemo as he,useRef as Y,useState as F}from\"react\";var le=(e,n)=>{let t;return function(...r){clearTimeout(t),t=setTimeout(()=>{e.apply(null,r)},n)}};function ie(e,n){return n?e.filter(({label:t,value:r})=>t!=null&&r!=null&&t.toLowerCase().includes(n.toLowerCase())):e}import{jsx as ce,jsxs as Be}from\"react/jsx-runtime\";var T=()=>Be(\"svg\",{width:\"24\",height:\"24\",fill:\"none\",stroke:\"currentColor\",strokeWidth:\"2\",className:\"dropdown-search-clear-icon gray\",children:[ce(\"line\",{x1:\"18\",y1:\"6\",x2:\"6\",y2:\"18\"}),ce(\"line\",{x1:\"6\",y1:\"6\",x2:\"18\",y2:\"18\"})]});import{useRef as $e}from\"react\";import{jsx as de,jsxs as Ve}from\"react/jsx-runtime\";var Ue=({checked:e,option:n,onClick:t,disabled:r})=>Ve(\"div\",{className:`item-renderer ${r?\"disabled\":\"\"}`,children:[de(\"input\",{type:\"checkbox\",onChange:t,checked:e,tabIndex:-1,disabled:r}),de(\"span\",{children:n.label})]}),pe=Ue;import{jsx as me}from\"react/jsx-runtime\";var Ye=({itemRenderer:e=pe,option:n,checked:t,tabIndex:r,disabled:a,onSelectionChanged:c,onClick:u})=>{let b=$e(),s=l=>{p(),l.preventDefault()},p=()=>{a||c(!t)},i=l=>{p(),u(l)};return R([f.ENTER,f.SPACE],s,{target:b}),me(\"label\",{className:`select-item ${t?\"selected\":\"\"}`,role:\"option\",\"aria-selected\":t,tabIndex:r,ref:b,children:me(e,{option:n,checked:t,onClick:i,disabled:a})})},N=Ye;import{Fragment as qe,jsx as $}from\"react/jsx-runtime\";var ze=({options:e,onClick:n,skipIndex:t})=>{let{disabled:r,value:a,onChange:c,ItemRenderer:u}=w(),b=(s,p)=>{r||c(p?[...a,s]:a.filter(i=>i.value!==s.value))};return $(qe,{children:e.map((s,p)=>{let i=p+t;return $(\"li\",{children:$(N,{tabIndex:i,option:s,onSelectionChanged:l=>b(s,l),checked:!!a.find(l=>l.value===s.value),onClick:l=>n(l,i),itemRenderer:u,disabled:s.disabled||r})},(s==null?void 0:s.key)||p)})})},ue=ze;import{jsx as k,jsxs as z}from\"react/jsx-runtime\";var Je=()=>{let{t:e,onChange:n,options:t,setOptions:r,value:a,filterOptions:c,ItemRenderer:u,disabled:b,disableSearch:s,hasSelectAll:p,ClearIcon:i,debounceDuration:l,isCreatable:L,onCreateOption:y}=w(),O=Y(),g=Y(),[m,M]=F(\"\"),[v,K]=F(t),[x,D]=F(\"\"),[E,I]=F(0),W=Ge(le(o=>D(o),l),[]),A=he(()=>{let o=0;return s||(o+=1),p&&(o+=1),o},[s,p]),_={label:e(m?\"selectAllFiltered\":\"selectAll\"),value:\"\"},H=o=>{let d=v.filter(C=>!C.disabled).map(C=>C.value);if(o){let Ae=[...a.map(U=>U.value),...d];return(c?v:t).filter(U=>Ae.includes(U.value))}return a.filter(C=>!d.includes(C.value))},B=o=>{let d=H(o);n(d)},h=o=>{W(o.target.value),M(o.target.value),I(0)},P=()=>{var o;D(\"\"),M(\"\"),(o=g==null?void 0:g.current)==null||o.focus()},Z=o=>I(o),we=o=>{switch(o.code){case f.ARROW_UP:ee(-1);break;case f.ARROW_DOWN:ee(1);break;default:return}o.stopPropagation(),o.preventDefault()};R([f.ARROW_DOWN,f.ARROW_UP],we,{target:O});let Oe=()=>{I(0)},j=async()=>{let o={label:m,value:m,__isNew__:!0};y&&(o=await y(m)),r([o,...t]),P(),n([...a,o])},Re=async()=>c?await c(t,x):ie(t,x),ee=o=>{let d=E+o;d=Math.max(0,d),d=Math.min(d,t.length+Math.max(A-1,0)),I(d)};fe(()=>{var o,d;(d=(o=O==null?void 0:O.current)==null?void 0:o.querySelector(`[tabIndex='${E}']`))==null||d.focus()},[E]);let[ke,Ee]=he(()=>{let o=v.filter(d=>!d.disabled);return[o.every(d=>a.findIndex(C=>C.value===d.value)!==-1),o.length!==0]},[v,a]);fe(()=>{Re().then(K)},[x,t]);let te=Y();R([f.ENTER],j,{target:te});let Ie=L&&m&&!v.some(o=>(o==null?void 0:o.value)===m);return z(\"div\",{className:\"select-panel\",role:\"listbox\",ref:O,children:[!s&&z(\"div\",{className:\"search\",children:[k(\"input\",{placeholder:e(\"search\"),type:\"text\",\"aria-describedby\":e(\"search\"),onChange:h,onFocus:Oe,value:m,ref:g,tabIndex:0}),k(\"button\",{type:\"button\",className:\"search-clear-button\",hidden:!m,onClick:P,\"aria-label\":e(\"clearSearch\"),children:i||k(T,{})})]}),z(\"ul\",{className:\"options\",children:[p&&Ee&&k(N,{tabIndex:A===1?0:1,checked:ke,option:_,onSelectionChanged:B,onClick:()=>Z(1),itemRenderer:u,disabled:b}),v.length?k(ue,{skipIndex:A,options:v,onClick:(o,d)=>Z(d)}):Ie?k(\"li\",{onClick:j,className:\"select-item creatable\",tabIndex:1,ref:te,children:`${e(\"create\")} \"${m}\"`}):k(\"li\",{className:\"no-options\",children:e(\"noOptions\")})]})]})},q=Je;import{jsx as be}from\"react/jsx-runtime\";var ge=({expanded:e})=>be(\"svg\",{width:\"24\",height:\"24\",fill:\"none\",stroke:\"currentColor\",strokeWidth:\"2\",className:\"dropdown-heading-dropdown-arrow gray\",children:be(\"path\",{d:e?\"M18 15 12 9 6 15\":\"M6 9L12 15 18 9\"})});import{jsx as ve}from\"react/jsx-runtime\";var xe=()=>{let{t:e,value:n,options:t,valueRenderer:r}=w(),a=n.length===0,c=n.length===t.length,u=r&&r(n,t);return a?ve(\"span\",{className:\"gray\",children:u||e(\"selectSomeItems\")}):ve(\"span\",{children:u||(c?e(\"allItemsAreSelected\"):(()=>n.map(s=>s.label).join(\", \"))())})};import{jsx as G}from\"react/jsx-runtime\";var Se=({size:e=24})=>G(\"span\",{style:{width:e,marginRight:\"0.2rem\"},children:G(\"svg\",{width:e,height:e,className:\"spinner\",viewBox:\"0 0 50 50\",style:{display:\"inline\",verticalAlign:\"middle\"},children:G(\"circle\",{cx:\"25\",cy:\"25\",r:\"20\",fill:\"none\",className:\"path\"})})});import{jsx as S,jsxs as Ce}from\"react/jsx-runtime\";var Xe=()=>{let{t:e,onMenuToggle:n,ArrowRenderer:t,shouldToggleOnHover:r,isLoading:a,disabled:c,onChange:u,labelledBy:b,value:s,isOpen:p,defaultIsOpen:i,ClearSelectedIcon:l,closeOnChangedValue:L}=w();ye(()=>{L&&m(!1)},[s]);let[y,O]=J(!0),[g,m]=J(i),[M,v]=J(!1),K=t||ge,x=Qe();se(()=>{n&&n(g)},[g]),ye(()=>{i===void 0&&typeof p==\"boolean\"&&(O(!1),m(p))},[p]);let D=h=>{var P;[\"text\",\"button\"].includes(h.target.type)&&[f.SPACE,f.ENTER].includes(h.code)||(y&&(h.code===f.ESCAPE?(m(!1),(P=x==null?void 0:x.current)==null||P.focus()):m(!0)),h.preventDefault())};R([f.ENTER,f.ARROW_DOWN,f.SPACE,f.ESCAPE],D,{target:x});let E=h=>{y&&r&&m(h)},I=()=>!M&&v(!0),W=h=>{!h.currentTarget.contains(h.relatedTarget)&&y&&(v(!1),m(!1))},A=()=>E(!0),_=()=>E(!1),H=()=>{y&&m(a||c?!1:!g)},B=h=>{h.stopPropagation(),u([]),y&&m(!1)};return Ce(\"div\",{tabIndex:0,className:\"dropdown-container\",\"aria-labelledby\":b,\"aria-expanded\":g,\"aria-readonly\":!0,\"aria-disabled\":c,ref:x,onFocus:I,onBlur:W,onMouseEnter:A,onMouseLeave:_,children:[Ce(\"div\",{className:\"dropdown-heading\",onClick:H,children:[S(\"div\",{className:\"dropdown-heading-value\",children:S(xe,{})}),a&&S(Se,{}),s.length>0&&l!==null&&S(\"button\",{type:\"button\",className:\"clear-selected-button\",onClick:B,disabled:c,\"aria-label\":e(\"clearSelected\"),children:l||S(T,{})}),S(K,{expanded:g})]}),g&&S(\"div\",{className:\"dropdown-content\",children:S(\"div\",{className:\"panel-content\",children:S(q,{})})})]})},Q=Xe;import{jsx as X}from\"react/jsx-runtime\";var Ze=e=>X(ne,{props:e,children:X(\"div\",{className:`rmsc ${e.className||\"multi-select\"}`,children:X(Q,{})})}),je=Ze;export{Q as Dropdown,je as MultiSelect,N as SelectItem,q as SelectPanel};\n"],"names":["oe"],"mappings":";;AAAA,SAAS,EAAE,GAAE,EAAC,UAAS,EAAC,IAAE,CAAA,GAAG;AAAC,MAAO,OAAO,WAAS,IAAI;AAAO,MAAI,IAAE,SAAS,QAAM,SAAS,qBAAqB,MAAM,EAAE,CAAC,GAAE,IAAE,SAAS,cAAc,OAAO;AAAE,IAAE,OAAK,YAAW,MAAI,SAAO,EAAE,aAAW,EAAE,aAAa,GAAE,EAAE,UAAU,IAAE,EAAE,YAAY,CAAC,GAAE,EAAE,aAAW,EAAE,WAAW,UAAQ,IAAE,EAAE,YAAY,SAAS,eAAe,CAAC,CAAC;AAAC;AAAC,EAAE;AAAA,CACzU;AAAgcA,MAAG,cAAc,EAAE;","x_google_ignoreList":[0]}

package/index.d.ts

@@ -29,20 +29,59 @@ declare module 'siam-ui-utils/copy-link' {
   export function CopyLink(props: CopyLinkProps): JSX.Element;
 }
 
-declare module 'siam-ui-utils/custom-input' {
+declare module 'siam-ui-utils/custom-input/currency' {
+  export interface CustomInputCurrencyProps {
+    onChange?: (any) => any;
+    onFocus?: (any) => any;
+    value?: any;
+    maxLength?: any;
+    style: any;
+    [key?: string]: any;
+  }
+  export function CustomInputCurrency(
+    props: CustomInputCurrencyProps
+  ): JSX.Element;
+}
+
+declare module 'siam-ui-utils/custom-input/checkbox' {
   export interface CustomInputCheckboxProps {
     [key: string]: any;
   }
   export function CustomInputCheckbox(
     props: CustomInputCheckboxProps
   ): JSX.Element;
+}
 
+declare module 'siam-ui-utils/custom-input/radio' {
   export interface CustomInputRadioProps {
     [key: string]: any;
   }
   export function CustomInputRadio(props: CustomInputRadioProps): JSX.Element;
 }
 
+declare module 'siam-ui-utils/custom-input/file' {
+  export interface CustomInputFileProps {
+    accept?: any;
+    className?: string;
+    id?: string;
+    label: ?string;
+    name?: string;
+    onChange: (value: any) => any;
+    [key: string]: any;
+  }
+  export function CustomInputFile(props: CustomInputFileProps): JSX.Element;
+}
+
+declare module 'siam-ui-utils/custom-input/multi-select' {
+  export interface CustomMultiSelectProps {
+    lista?: [any];
+    onListaUpdate?: (value: any) => any;
+    value?: [any];
+    [key?: string]: any;
+  }
+  export function CustomMultiSelect(props: CustomMultiSelectProps): JSX.Element;
+}
+
 declare module 'siam-ui-utils/dropzone-uploader' {
   export interface DropzoneUploaderProps {
     onChangeFiles?: (files: File[]) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "siam-ui-utils",
-  "version": "3.0.2",
+  "version": "3.0.4",
   "keywords": [
     "ampf-react",
     "ampf-utils",
@@ -24,7 +24,7 @@
       "import": "./dist/copy-link/index.js",
       "types": "./index.d.ts"
     },
-    "./custom-input": {
+    "./custom-input/*": {
       "import": "./dist/custom-input/index.js",
       "types": "./index.d.ts"
     },
@@ -88,10 +88,11 @@
     "html5-file-selector": "^2.1.0",
     "prop-types": "^15.8.1",
     "react-intl": "^6.4.2",
+    "react-multi-select-component": "^4.3.4",
     "react-notifications": "^1.7.4",
     "react-select": "^5.8.0",
-    "reactstrap": "^9.2.2",
     "react-tagsinput": "^3.20.3",
+    "reactstrap": "^9.2.2",
     "siam-utils": "^1.1.4",
     "source-map-loader": "^5.0.0",
     "styled-components": "^6.1.12"