@nexusui/components
Version:
These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.
2 lines (1 loc) • 2.26 kB
JavaScript
import{jsxs as e,Fragment as i,jsx as t}from"react/jsx-runtime";import r from"@mui/icons-material/MoreVert";import o from"@mui/material/Divider";import l from"@mui/material/IconButton";import a from"@mui/material/Menu";import n from"@mui/material/MenuItem";import m from"@mui/material/Typography";import{useState as s}from"react";import d from"@mui/material/useMediaQuery";import{useTheme as c}from"@mui/material/styles";import u from"@mui/icons-material/Check";import h from"@mui/material/Stack";import{useTranslate as p}from"../../../locales/index.js";import{OrgButton as g}from"./OrgButton.js";import b from"../../locale.json.js";import{MobileOrgSheet as f}from"../MobileOrgSheet/MobileOrgSheet.js";const v="NexusOrgPicker",x=x=>{const C=p(b),{useBottomsheet:y=!1,isMobile:O=!1,...k}=x,{extraActions:$=[],editable:M,orgOptions:j,selectedOrg:A,onOrgChange:w}=k,B=c(),I=d(B.breakpoints.down("sm")),[S,W]=s(null),N=Boolean(S),T=e=>{W(e.currentTarget)},D=()=>{W(null)},E=j?.find((e=>e.value===A));return e(i,{children:[O?e(h,{"data-testid":`${v}-root`,direction:"row",flex:1,justifyContent:"space-between",alignItems:"center",children:[t(m,{variant:"body2",noWrap:!0,children:E?.label}),t(l,{"aria-label":C("More Actions"),"data-testid":`${v}-Org-button`,edge:"end",onClick:T,sx:{ml:2,visibility:1===j?.length?"hidden":"visible"},children:t(r,{})})]}):e(i,{children:[!M&&t(m,{"data-testid":`${v}-readOnly`,variant:"body1",sx:{fontWeight:700},children:E?.label}),M&&t(g,{open:N,showArrowIcon:1!==j?.length,selectedOrgOption:E,onClick:T,sx:I?{maxWidth:"unset"}:{}}),!M&&$.length>0&&t(l,{"data-testid":`${v}-moreActions`,className:`${v}-moreActions`,"aria-label":C("More Actions"),edge:"end",onClick:T,sx:{ml:2},children:t(r,{})})]}),y?t(f,{open:N,shareConfig:k,handleClose:D}):(M||$.length>0)&&e(a,{"data-testid":`${v}-menu`,open:N,onClose:D,anchorEl:S,children:[M&&j?.map((i=>e(n,{"data-testid":`${v}-org-${i.value}`,value:i.value,onClick:()=>{w?.(i.value),D()},selected:A===i.value,children:[t(u,{sx:{mr:1,color:"grey.500",visibility:A===i.value?"visible":"hidden"}}),i.label]},i.value))),M&&$.length>0&&t(o,{}),$.map((e=>t(n,{"data-testid":`${v}-extra-${e.label}`,dense:!0,onClick:()=>{e.onClick(),D()},children:e.label},e.label)))]})]})};export{x as OrgPicker};