@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.67 kB
JavaScript
import{jsx as t}from"react/jsx-runtime";import{styled as o}from"@mui/material";import{omitProps as e}from"../../../../utils/shouldForwardProp.js";import{getButtonSizing as i}from"../../ButtonBase/Button.variant-helpers.js";import{getTypographyStyle as r,getInputSize as s,selectBaseStyles as a}from"../../Select/StyledSelect.variant-helpers.js";import n from"../../TextField/TextField.js";import{getInputPadding as u}from"../helpers.js";const l=o(n,{shouldForwardProp:e(["sizing","multi"])})(({theme:t,sizing:o,multi:e})=>({"& .MuiOutlinedInput-root":{...a(t,o||"lg"),...o&&{...u(t,o)},...o&&{...s(t,o)},...o&&{...r(t,o)},...e&&{height:"auto",minHeight:i(o||"lg").height},padding:`${t.spacing(1)} ${t.spacing(8)} ${t.spacing(1)} ${t.spacing(1)}`,backgroundColor:t.custom.palette.surface.raised,transition:t.custom.easing.input,"& .MuiOutlinedInput-input":{padding:0,paddingLeft:t.spacing(1)},"&:hover":{"& .MuiOutlinedInput-notchedOutline":{borderColor:t.custom.palette.stroke.default}},"&.Mui-focused":{borderColor:t.custom.palette.stroke.focus},"&.Mui-disabled":{backgroundColor:t.custom.palette.input.disabled,borderColor:t.custom.palette.stroke.disabled,"& .MuiSvgIcon-root":{color:t.custom.palette.icon.disabled}}},"& .MuiButtonBase-root":{transition:t.custom.easing.input,"&:hover:not(.MuiChip-root)":{backgroundColor:t.custom.palette.interaction.hover},"&:active:not(.MuiChip-root)":{backgroundColor:t.custom.palette.interaction.press},"&.Mui-disabled":{backgroundColor:t.custom.palette.interaction.disabled,"& .MuiSvgIcon-root":{color:t.custom.palette.icon.disabled,transition:t.custom.easing.input}}}})),d=o=>t(l,{...o});export{l as StyledTextField,d as default};