retro-react/dist/cjs/components/select/Select.js

A React component library for building retro-style websites

"use strict";var e=require("../../_virtual/_tslib.js"),a=require("react"),s=require("../../node_modules/@theme-ui/core/jsx-runtime/dist/theme-ui-core-jsx-runtime.esm.js"),r=require("../../utils/classNames.js"),i=require("../../constants/commonClassNames.js"),l=require("./Select.styled.js");const t=a.forwardRef(((t,d)=>{var{id:n,className:c,variant:o="filled",size:u="medium",sx:m,label:v,children:b,disabled:j=!1,errorMessage:h,required:x=!1,onChange:g,defaultValue:q}=t,N=e.__rest(t,["id","className","variant","size","sx","label","children","disabled","errorMessage","required","onChange","defaultValue"]);const[S,f]=a.useState(q),p={};return v||(p["aria-label"]=N.placeholder||"Select an option"),j&&(p["aria-disabled"]=!0),h&&(p["aria-errormessage"]=h,p["aria-invalid"]=!0),x&&(p["aria-required"]=!0),s.jsxs(l.SelectWrapper,Object.assign({$variant:o,sx:m,className:r.classNames("select-root",c,i.default)},{children:[v&&s.jsx(l.Label,Object.assign({htmlFor:n,$variant:o,$size:u,className:"select-label",title:v,$disabled:j},{children:v}),void 0),s.jsxs(l.SelectContainer,{children:[s.jsx(l.Select,Object.assign({id:n,ref:d,$variant:o,$size:u,className:"select-input",disabled:j,value:S,onChange:e=>{g&&g(e),f(e.target.value)}},p,N,{children:b}),void 0),S&&!x&&s.jsx(l.ClearButton,{onClick:()=>{const e={target:{value:"",id:n||""}};f(""),g&&g(e)},"aria-label":"Remove button"},void 0)]},void 0),h&&s.jsx(l.Error,{children:h},void 0)]}),void 0)}));t.displayName="Select",exports.Select=t;