@lanaco/lnc-react-ui
Version:
React component library
8 lines (7 loc) • 3.24 kB
JavaScript
"use strict";const r=require("react/jsx-runtime"),t=require("react"),o=require("./index-BPVoEhTF.cjs"),x=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),B=require("./Button.cjs"),K=require("./utils-NZLCh-J5.cjs"),L=require("./ThemeProvider.cjs"),U=require("./Popover.cjs"),Y=require("./PopoverTrigger.cjs"),$=require("./PopoverContent.cjs"),A=require("./motion-B_VPZaJq.cjs"),G=x.newStyled.div``,H=x.newStyled(A.motion.div)`
gap: 0.25rem;
display: flex;
flex-direction: column;
${n=>n.widthfitcontent==!1&&"min-width: 12.5rem"};
background-color: ${n=>K.getColorRgbaValue(n.theme,"Dropdown",n.color,"enabled","background")};
`,I=t.forwardRef((n,p)=>{const{control:i,offsetValue:C=9,placement:_,widthFitContent:b=!1,closeOnItemSelect:v=!0,zIndex:q,onFocus:m=()=>{},onBlur:f=()=>{},onClick:y=()=>{},onKeyDown:d=()=>{},onMouseEnter:T=()=>{},onMouseLeave:P=()=>{},onItemSelected:M=()=>{},animation:R={animate:{opacity:1,height:"auto"},exit:{opacity:0,height:0},initial:{opacity:0,height:0},transition:{type:"tween",duration:.15,opacity:{duration:.15,ease:"easeOut"},height:{duration:.15}}},className:h="",style:J={},color:s="primary",size:c="small",contentClassName:N="",popoverProps:Q,children:O,...j}=n;t.useRef();const D=t.useRef(),{theme:k}=L.useTheme(),g=t.useRef(),E=t.useRef(),[z,l]=t.useState(!1),w=(e,u,a)=>{M(e,u,a),v==!0&&l(!1)},F=t.Children.map(O,(e,u)=>{var a,S;return t.isValidElement(e)&&(e.props.__TYPE__=="MENU_ITEM"||((a=e==null?void 0:e.type)==null?void 0:a.displayName)==="MENU_ITEM"||e.props.__TYPE__=="NESTED_ITEM"||((S=e==null?void 0:e.type)==null?void 0:S.displayName)==="NESTED_ITEM")?u==0?(e.props.ref&&(E.current=p),t.cloneElement(e,{ref:p||E,color:e.props.color?e.props.color:s,size:c,onItemSelected:w,animation:R})):t.cloneElement(e,{color:e.props.color?e.props.color:s,size:c,onItemSelected:w}):e}),V=()=>typeof i=="string"||i instanceof String?r.jsx(B,{text:i,onClick:y,onMouseEnter:T,onMouseLeave:P,onBlur:f,onFocus:m,ref:g,onKeyDown:d,trailingIcon:"angle-down",color:s,size:c}):t.cloneElement(i,{color:s,size:c,ref:g,onClick:y,onMouseEnter:T,onMouseLeave:P,onBlur:f,onFocus:m,onKeyDown:d});return r.jsx(G,{ref:p,className:h,...j,children:r.jsxs(U,{open:z,onOpenChange:l,placement:_,offsetValue:C,children:[r.jsx(Y,{onClick:()=>l(e=>!e),children:V()}),r.jsx($,{zIndex:q,children:r.jsx(H,{ref:D,widthfitcontent:b,color:s,theme:k,className:N,children:F})})]})})});I.propTypes={control:o.PropTypes.oneOfType([o.PropTypes.string,o.PropTypes.element]),offsetValue:o.PropTypes.number,placement:o.PropTypes.oneOf(["center","top","right","bottom","left","top-start","top-end","right-start","right-end","bottom-start","bottom-end","left-start","left-end"]),widthFitContent:o.PropTypes.bool,closeOnItemSelect:o.PropTypes.bool,zIndex:o.PropTypes.number,onBlur:o.PropTypes.func,onFocus:o.PropTypes.func,onClick:o.PropTypes.func,onKeyDown:o.PropTypes.func,onMouseEnter:o.PropTypes.func,onMouseLeave:o.PropTypes.func,onItemSelected:o.PropTypes.func,animation:o.PropTypes.object,className:o.PropTypes.string,color:o.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:o.PropTypes.oneOf(["small","medium","large"]),popoverProps:o.PropTypes.any};module.exports=I;