@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) • 819 B
JavaScript
"use client";
import{jsxs as t,jsx as e}from"react/jsx-runtime";import i from"@mui/material/Box";import r from"@mui/material/Stack";import o from"react";import{EmailChip as a}from"./EmailChip.js";const m=o.forwardRef((({emails:o,onDelete:m,onEmailEdited:l,...n},d)=>{const p=o.length>0;return t(r,{direction:"row",flexWrap:"wrap",justifyContent:"flex-start",alignItems:"center",sx:{flex:1,overflowX:"auto",width:"100%",p:p?2:0},children:[o.map(((t,i)=>e(a,{index:i,onEmailEdited:l,color:t.valid?"default":"error",variant:"filled",tabIndex:-1,label:t.email,onDelete:()=>m(t),sx:{m:.5,maxWidth:{xs:"calc(100% - 0.5rem)",sm:"300px"}}},t.email))),e(i,{component:"input","data-testid":"custom-input",ref:d,...n,type:"text",sx:{flex:1,minWidth:"180px !important",overflow:"hidden"}})]})}));export{m as CustomInputComponent};