UNPKG

@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) 1.38 kB
"use client"; import{jsx as e,jsxs as r}from"react/jsx-runtime";import l from"@mui/material/FormControl";import t from"@mui/material/FormHelperText";import o from"@mui/material/InputLabel";import a from"@mui/material/MenuItem";import i from"@mui/material/Select";import{useFormContext as m,Controller as n}from"react-hook-form";import{useTranslate as d}from"../../locales/index.js";import s from"../locale.json.js";const u="NexusFormSelect",c=({label:c,name:f,rules:p,options:$,includeNoneOption:b,fullWidth:h,required:x,disabled:v,defaultValue:I,variant:N,customSelectItem:S,sx:j,controllerProps:F,...q})=>{const{control:V}=m(),W=d(s,"FormSelect"),g=S;return e(n,{...F,control:V,name:f,rules:p,defaultValue:I,render:({field:{...m},fieldState:{error:n}})=>r(l,{fullWidth:h,required:x,sx:j,disabled:v,variant:N,error:!!n,children:[e(o,{required:x,id:`form-select-label-${q.id||""}`,children:c}),r(i,{labelId:`form-select-label-${q.id||""}`,"data-testid":`${u}-${f}`,className:`${u}-${f}`,...q,...m,label:c,children:[b&&e(a,{value:"",className:`${u}-${f}-noneItem`,"data-testid":`${u}-${f}-noneItem`,children:e("em",{children:W("None")})},"option-none"),$.map((r=>e(a,{value:r.value,disabled:r.disabled,className:`${u}-${f}-item`,"data-testid":`${u}-${f}-item`,children:g?e(g,{option:r}):r.label},r.value)))]}),n?e(t,{error:!0,children:n?.message}):null]})})};export{c as FormSelect};