@adoptaunabuelo/react-components 0.1.18 → 0.1.19

package/dist/esm/components/Filter/Filter.d.ts

@@ -8,7 +8,7 @@ export interface Props {
     disabled?: boolean;
     type?: 'single' | 'multiple' | 'date';
     position?: 'bottom-right' | 'bottom-left';
-    options: Array<{
+    options?: Array<{
         id: string;
         label: string;
         sublabel?: string;

package/dist/esm/index.js

@@ -834,6 +834,7 @@ n.version="2.29.4",a(Yr),n.fn=so,n.min=Qr,n.max=Jr,n.now=en,n.utc=f,n.unix=co,n.
     justify-content: space-between;
     padding-top: 8px;
     border-top: 1px solid ${Color.line.soft};
+    margin-top: 8px;
 `,BadgeView=Ye.div`
     display: flex;
     align-items: center;
@@ -842,5 +843,5 @@ n.version="2.29.4",a(Yr),n.fn=so,n.min=Qr,n.max=Jr,n.now=en,n.utc=f,n.unix=co,n.
     height: 18px;
     width: 18px;
     background-color: ${Color.background.full};
-`,Filter=e=>{const[t,r]=useState(!1),[n,a]=useState([]),[o,i]=useState([]),[l,s]=useState(e.options),[c,u]=useState(void 0);useEffect((()=>{e.options&&(u(new Fuse(e.options,{keys:["label","id"]})),s(e.options))}),[e.options]),useEffect((()=>{e.selectedOptions&&(i(e.selectedOptions),a(e.selectedOptions))}),[e.selectedOptions]),useEffect((()=>(document.addEventListener("mousedown",(t=>{const n=document.getElementById(e.id);null!==n&&(n.contains(t.target)||(r(!1),s(e.options),console.log("selectedOptions",o),a(o)))})),document.removeEventListener("mousedown",d))),[]);const d=n=>{n.stopPropagation(),a(o),t?(r(!1),s(e.options)):r(!0)};return"date"===e.type?jsx(Filter$1,Object.assign({},e)):e.options&&e.options.length>0?jsxs(Container,Object.assign({id:e.id,role:"filter",style:e.style},{children:[jsxs(ButtonFilter,Object.assign({role:"filter-button",selected:o.length>0,disabled:e.disabled,onClick:d},{children:[jsx(Text$1,Object.assign({type:"p",style:{color:e.disabled?Color.text.low:o.length>0?Color.text.full:Color.text.high,fontSize:14,marginRight:4}},{children:e.label})),o.length>0?jsx(BadgeView,{children:jsx(Text$1,Object.assign({type:"p",style:{color:"white",fontSize:12,fontWeight:600}},{children:o.length}))}):jsx(ChevronDown$1,{height:18,width:18,color:e.disabled?Color.text.low:Color.text.high})]})),t&&jsxs(FilterView,Object.assign({role:"filter-menu",position:e.position},{children:[!e.hideSearchBar&&jsx(SearchBar,{style:{borderBottom:"1px solid "+Color.line.soft},placeholder:"Buscar",design:"secondary",onChange:t=>{const r=t.target.value;if(r){const e=c.search(r).map((e=>e.item));s(e)}else s(e.options)}}),jsx(ContentView,{children:jsx(CheckboxList,{style:{paddingTop:16},options:l,selectedOptions:n,type:"multiple"===e.type?"multiple":"single",height:18,width:18,onChange:e=>{a(e)}})}),jsxs(BottomBar,{children:["multiple"===e.type&&jsx(Button,Object.assign({design:"text",size:"small",style:{marginRight:4},onClick:()=>{a(e.options)}},{children:"Seleccionar todo"})),jsx(Button,Object.assign({design:"text",size:"small",style:{marginRight:4},onClick:()=>{a([])}},{children:"Borrar"})),jsx(Button,Object.assign({design:"primary",size:"small",onClick:()=>{r(!1),i(n),e.onChange&&e.onChange(n)}},{children:"Aplicar"}))]})]}))]})):null};export{Avatar,BreadCrumb,Button,CheckboxList as Checkbox,Color,FeedBack as Feedback,Filter,Input,Label,MenuList as Menu,ModalComponent as Modal,ProgressBar,SearchBar,Select,Text$1 as Text};
+`,Filter=e=>{const[t,r]=useState(!1),[n,a]=useState([]),[o,i]=useState(e.options),[l,s]=useState(void 0),c=useRef(n),u=e=>{c.current=e,a(e)},d=useRef(n),h=e=>{d.current=e,r(e)};useEffect((()=>{e.options&&(s(new Fuse(e.options,{keys:["label","id"]})),i(e.options))}),[e.options]),useEffect((()=>{e.selectedOptions&&u(e.selectedOptions)}),[e.selectedOptions]),useEffect((()=>(document.addEventListener("mousedown",(t=>{const r=document.getElementById(e.id);null!==r&&(r.contains(t.target)||!0!==d.current||(h(!1),i(e.options),e.onChange&&e.onChange(c.current)))})),document.removeEventListener("mousedown",p))),[]);const p=r=>{r.stopPropagation(),t?(h(!1),i(e.options),e.onChange&&e.onChange(n)):h(!0)};return"date"===e.type?jsx(Filter$1,Object.assign({},e)):e.options&&e.options.length>0?jsxs(Container,Object.assign({id:e.id,role:"filter",style:e.style},{children:[jsxs(ButtonFilter,Object.assign({role:"filter-button",selected:n.length>0,disabled:e.disabled,onClick:p},{children:[jsx(Text$1,Object.assign({type:"p",style:{color:e.disabled?Color.text.low:n.length>0?Color.text.full:Color.text.high,fontSize:14,marginRight:4}},{children:e.label})),n.length>0?jsx(BadgeView,{children:jsx(Text$1,Object.assign({type:"p",style:{color:"white",fontSize:12,fontWeight:600}},{children:n.length}))}):jsx(ChevronDown$1,{height:18,width:18,color:e.disabled?Color.text.low:Color.text.high})]})),t&&jsxs(FilterView,Object.assign({role:"filter-menu",position:e.position},{children:[!e.hideSearchBar&&jsx(SearchBar,{style:{borderBottom:"1px solid "+Color.line.soft},placeholder:"Buscar",design:"secondary",onChange:t=>{const r=t.target.value;if(r){const e=l.search(r).map((e=>e.item));i(e)}else i(e.options)}}),jsx(ContentView,{children:o&&o.length>0&&jsx(CheckboxList,{style:{paddingTop:16},options:o,selectedOptions:n,type:"multiple"===e.type?"multiple":"single",height:18,width:18,onChange:e=>{const t=[...e];u(t)}})}),jsxs(BottomBar,{children:["multiple"===e.type&&jsx(Button,Object.assign({design:"text",size:"small",style:{marginRight:4},onClick:()=>{u(e.options)}},{children:"Seleccionar todo"})),jsx(Button,Object.assign({design:"text",size:"small",style:{marginRight:4},onClick:()=>{u([])}},{children:"Borrar"})),jsx(Button,Object.assign({design:"primary",size:"small",onClick:()=>{h(!1),e.onChange&&e.onChange(n)}},{children:"Aplicar"}))]})]}))]})):null};export{Avatar,BreadCrumb,Button,CheckboxList as Checkbox,Color,FeedBack as Feedback,Filter,Input,Label,MenuList as Menu,ModalComponent as Modal,ProgressBar,SearchBar,Select,Text$1 as Text};
 //# sourceMappingURL=index.js.map