UNPKG

@undp/design-system-react

Version:

React based design system for UNDP

2 lines 1.6 kB
const e=require("./rolldown-runtime-mLOUI7ql.cjs"),t=require("./utils-Dd9-5CFr.cjs"),n=require("./createLucideIcon-FKMTNncQ.cjs"),r=require("./Button.cjs"),i=require("./Input.cjs");let a=require("react");a=e.r(a,1);let o=require("react/jsx-runtime");var s=n.t(`search`,[[`path`,{d:`m21 21-4.34-4.34`,key:`14j7rj`}],[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}]]),c=a.default.forwardRef(({className:e,inputClassName:n,buttonClassName:c,onSearch:l,searchOnlyOnClick:u,buttonVariant:d,buttonChildren:f,showSearchButton:p,inputVariant:m,inputSize:h,rounded:g,placeholder:_,...v},y)=>{let[b,x]=a.default.useState(void 0),[S,C]=a.default.useState(!1);return(0,o.jsxs)(`div`,{className:t.t(`flex items-stretch gap-0`,e),ref:y,children:[(0,o.jsxs)(`div`,{className:`relative w-full`,children:[(0,o.jsx)(i.Input,{...v,variant:m,type:`text`,className:n,onChange:e=>{x(e.target.value),u||l?.(e.target.value)},inputSize:h,rounded:g,onKeyDown:e=>{e.key===`Enter`&&l?.(b)},onFocus:()=>C(!0),onBlur:()=>C(!1)}),!S&&(b===``||!b)&&(0,o.jsxs)(`div`,{className:`pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3`,children:[f?null:(0,o.jsx)(s,{className:`mr-2 h-4 w-4 text-content-placeholder`}),(0,o.jsx)(`span`,{className:`text-content-placeholder`,children:_||`Search...`})]})]}),p===!1?null:(0,o.jsx)(r.Button,{variant:d||`icon`,className:t.t(`py-0`,c),padding:h,arrow:!1,onClick:()=>{l?.(b)},children:f||(0,o.jsx)(s,{className:`stroke-2`})})]})});c.displayName=`Search`,Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return c}}); //# sourceMappingURL=input-search-f1a_DAni.cjs.map