@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.
3 lines (2 loc) • 923 B
JavaScript
"use client";
import{jsxs as e,jsx as t}from"react/jsx-runtime";import l from"@mui/material/Box";import o from"country-flag-icons/react/3x2";import i from"clsx";import{useTranslate as r}from"../../locales/index.js";import a from"./locale.json.js";const s=s=>{const{option:n}=s,c=o[n.code.toUpperCase()],m=r(a);return e(l,{component:"div",sx:{display:"flex",alignItem:"center"},"data-testid":`NexusCountrySelect-item-${n.code}`,className:i("NexusCountrySelectItem-root","NexusCountrySelect-item"),children:[t(l,{sx:{width:30,mr:8,height:28,display:"flex",alignItems:"center",flex:"0 0 auto","& > svg":{width:"100%",height:"auto"}},children:t(c,{})}),t(l,{sx:{display:"flex",alignItems:"center",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",width:"calc(100% - 38px)"},title:"string"==typeof n.label?m(n.label):n.label,children:"string"==typeof n.label?m(n.label):n.label})]})};export{s as CountrySelectItem};