@hudoro/dropdown
Advanced tools
Comparing version 0.0.2-beta.4 to 0.0.2-beta.5
@@ -1,5 +0,3 @@ | ||
import React, { SVGProps } from "react"; | ||
import React from "react"; | ||
import { IDropdown } from "./interface"; | ||
export declare const Dropdown: React.FC<IDropdown>; | ||
export interface IconProps extends SVGProps<SVGSVGElement> { | ||
} |
@@ -828,3 +828,3 @@ import K, { useState as ie, useRef as dr, useEffect as se } from "react"; | ||
d.find((W) => W.value === s.value) || y([]); | ||
}, [d]), /* @__PURE__ */ c.jsxs( | ||
}, [d]), console.log("value", l), /* @__PURE__ */ c.jsxs( | ||
"div", | ||
@@ -831,0 +831,0 @@ { |
@@ -176,2 +176,2 @@ (function(I,b){typeof exports=="object"&&typeof module<"u"?b(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],b):(I=typeof globalThis<"u"?globalThis:I||self,b(I.Dropdown={},I.React))})(this,function(I,b){"use strict";var Z={exports:{}},Y={};/** | ||
} | ||
`;function Le(d){const[m,_]=b.useState(d),y=b.useRef(null),C=O=>{y.current&&!y.current.contains(O.target)&&_(!1)};return b.useEffect(()=>(document.addEventListener("click",C,!0),()=>{document.removeEventListener("click",C,!0)}),[]),{ref:y,isComponentVisible:m,setIsComponentVisible:_}}const ce="hudoro-input-dropdown-styles";(d=>{if(!document.getElementById(ce)){const m=document.createElement("style");m.id=ce,m.textContent=d,document.head.appendChild(m)}})(Ve);const Ye=({dropdownLists:d,onChange:m,defaultValue:_,size:y="md",multiSelect:C,searchAble:O,iconLeft:P,placeholder:j,onSearch:v})=>{const[D,g]=b.useState(""),[l,w]=b.useState(),{isComponentVisible:W,ref:z,setIsComponentVisible:J}=Le(!1),Q=d==null?void 0:d.filter(s=>s.label.toLowerCase().includes(D.toLowerCase())),F=()=>{J(s=>!s),g("")},h=(s,E)=>{if(!C)w([{label:s,value:E}]),m([{label:s,value:E}]),J(!1);else if(l==null?void 0:l.find(T=>T.value===E)){const T=[...l?l.filter(q=>q.value!==E):[]];w(T),m(T)}else{const T=[...l||[],{label:s,value:E}];w(T),m(T)}};return b.useEffect(()=>{_&&w(_)},[_]),b.useEffect(()=>{if(l)for(let s of l)d.find(N=>N.value===s.value)||w([])},[d]),c.jsxs("div",{className:`hsd-input-dropdown-container hsd-input-dropdown-size-${y} ${W?"active":""}`,ref:z,onClick:F,children:[c.jsxs("div",{className:"hsd-input-dropdown-preview-container",children:[P?c.jsx(c.Fragment,{children:b.cloneElement(P,{width:de(y),color:"#939E99"})}):null,c.jsx("div",{className:"hsd-input-dropdown-container-preview-item",children:l!=null&&l.length?l==null?void 0:l.map((s,E)=>C?c.jsx("p",{style:{minWidth:"max-content"},className:"hsd-input-dropdown-preview-item",children:s==null?void 0:s.label},E):c.jsx("p",{style:{minWidth:"max-content"},children:s==null?void 0:s.label},E)):c.jsx("p",{className:"hsd-input-dropdown-placeholder",children:j||"Search"})}),c.jsx(Ue,{strokeWidth:2,width:de(y)})]}),W?c.jsxs("div",{className:"hsd-input-dropdown-lists-container",onClick:s=>s.stopPropagation(),children:[O?c.jsxs("div",{className:"hsd-input-dropdown-container-dropdown-search",children:[c.jsx("div",{style:{display:"flex"},children:c.jsx(Me,{strokeWidth:2,width:20})}),c.jsx("input",{onChange:s=>{g(s.target.value),v&&v(s.target.value)}})]}):null,c.jsx("div",{className:"hsd-input-dropdwon-item-container",children:Q.map((s,E)=>c.jsxs("div",{className:`hsd-input-dropdwon-item ${l!=null&&l.find(N=>N.value===s.value)?"active":""}`,onClick:()=>h(s.label,s.value),children:[s.icon?c.jsx("div",{children:b.cloneElement(s.icon,{width:16})}):null,c.jsxs("div",{children:[" ",c.jsx("p",{children:s.label})]})]},E))})]}):null]})},Me=({...d})=>c.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",...d,viewBox:"0 0 20 20",fill:"none",children:[c.jsx("circle",{cx:"9.80547",cy:"9.8055",r:"7.49047",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round",strokeLinejoin:"round"}),c.jsx("path",{d:"M15.0153 15.4043L17.9519 18.3333",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round",strokeLinejoin:"round"})]}),Ue=({...d})=>c.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",...d,viewBox:"0 0 24 24",fill:"none",color:"#1976D2",children:c.jsx("path",{d:"M4 9L12 17L20 9",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"})}),de=d=>{if(d==="sm")return 16;if(d==="md")return 20;if(d==="lg")return 20};I.Dropdown=Ye,Object.defineProperty(I,Symbol.toStringTag,{value:"Module"})}); | ||
`;function Le(d){const[m,_]=b.useState(d),y=b.useRef(null),C=O=>{y.current&&!y.current.contains(O.target)&&_(!1)};return b.useEffect(()=>(document.addEventListener("click",C,!0),()=>{document.removeEventListener("click",C,!0)}),[]),{ref:y,isComponentVisible:m,setIsComponentVisible:_}}const ce="hudoro-input-dropdown-styles";(d=>{if(!document.getElementById(ce)){const m=document.createElement("style");m.id=ce,m.textContent=d,document.head.appendChild(m)}})(Ve);const Ye=({dropdownLists:d,onChange:m,defaultValue:_,size:y="md",multiSelect:C,searchAble:O,iconLeft:P,placeholder:j,onSearch:v})=>{const[D,g]=b.useState(""),[l,w]=b.useState(),{isComponentVisible:W,ref:z,setIsComponentVisible:J}=Le(!1),Q=d==null?void 0:d.filter(s=>s.label.toLowerCase().includes(D.toLowerCase())),F=()=>{J(s=>!s),g("")},h=(s,E)=>{if(!C)w([{label:s,value:E}]),m([{label:s,value:E}]),J(!1);else if(l==null?void 0:l.find(T=>T.value===E)){const T=[...l?l.filter(q=>q.value!==E):[]];w(T),m(T)}else{const T=[...l||[],{label:s,value:E}];w(T),m(T)}};return b.useEffect(()=>{_&&w(_)},[_]),b.useEffect(()=>{if(l)for(let s of l)d.find(N=>N.value===s.value)||w([])},[d]),console.log("value",l),c.jsxs("div",{className:`hsd-input-dropdown-container hsd-input-dropdown-size-${y} ${W?"active":""}`,ref:z,onClick:F,children:[c.jsxs("div",{className:"hsd-input-dropdown-preview-container",children:[P?c.jsx(c.Fragment,{children:b.cloneElement(P,{width:de(y),color:"#939E99"})}):null,c.jsx("div",{className:"hsd-input-dropdown-container-preview-item",children:l!=null&&l.length?l==null?void 0:l.map((s,E)=>C?c.jsx("p",{style:{minWidth:"max-content"},className:"hsd-input-dropdown-preview-item",children:s==null?void 0:s.label},E):c.jsx("p",{style:{minWidth:"max-content"},children:s==null?void 0:s.label},E)):c.jsx("p",{className:"hsd-input-dropdown-placeholder",children:j||"Search"})}),c.jsx(Ue,{strokeWidth:2,width:de(y)})]}),W?c.jsxs("div",{className:"hsd-input-dropdown-lists-container",onClick:s=>s.stopPropagation(),children:[O?c.jsxs("div",{className:"hsd-input-dropdown-container-dropdown-search",children:[c.jsx("div",{style:{display:"flex"},children:c.jsx(Me,{strokeWidth:2,width:20})}),c.jsx("input",{onChange:s=>{g(s.target.value),v&&v(s.target.value)}})]}):null,c.jsx("div",{className:"hsd-input-dropdwon-item-container",children:Q.map((s,E)=>c.jsxs("div",{className:`hsd-input-dropdwon-item ${l!=null&&l.find(N=>N.value===s.value)?"active":""}`,onClick:()=>h(s.label,s.value),children:[s.icon?c.jsx("div",{children:b.cloneElement(s.icon,{width:16})}):null,c.jsxs("div",{children:[" ",c.jsx("p",{children:s.label})]})]},E))})]}):null]})},Me=({...d})=>c.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",...d,viewBox:"0 0 20 20",fill:"none",children:[c.jsx("circle",{cx:"9.80547",cy:"9.8055",r:"7.49047",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round",strokeLinejoin:"round"}),c.jsx("path",{d:"M15.0153 15.4043L17.9519 18.3333",stroke:"currentColor",strokeWidth:"1.3",strokeLinecap:"round",strokeLinejoin:"round"})]}),Ue=({...d})=>c.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",...d,viewBox:"0 0 24 24",fill:"none",color:"#1976D2",children:c.jsx("path",{d:"M4 9L12 17L20 9",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"})}),de=d=>{if(d==="sm")return 16;if(d==="md")return 20;if(d==="lg")return 20};I.Dropdown=Ye,Object.defineProperty(I,Symbol.toStringTag,{value:"Module"})}); |
export { Dropdown } from "./Dropdown"; | ||
export * from "./interface"; |
@@ -0,1 +1,2 @@ | ||
import { SVGProps } from "react"; | ||
export interface IconProps extends React.SVGProps<SVGSVGElement> { | ||
@@ -24,1 +25,3 @@ } | ||
} | ||
export interface IconProps extends SVGProps<SVGSVGElement> { | ||
} |
{ | ||
"name": "@hudoro/dropdown", | ||
"version": "0.0.2-beta.4", | ||
"version": "0.0.2-beta.5", | ||
"description": "dropdown component for Hudoro UI", | ||
@@ -5,0 +5,0 @@ "author": "Prawito Hudoro", |
56662
1196