import{_ as _extends}from"./_rollupPluginBabelHelpers-B5fk9IVe.js";import React__default,{useState,useEffect}from"react";import PropTypes from"prop-types";import{I as Icon}from"./Icon.component-BVkaZqpA.js";import{S as Spinner}from"./Spinner.component-3BfGSLKB.js";const selectstyles=`
	jn-w-full
	jn-bg-theme-select
	jn-text-theme-high
	jn-appearance-none
	jn-text-base
	jn-pl-4
	jn-h-[2.375rem]
	jn-rounded-3px
	jn-bg-icon-arrow-down
	jn-bg-right
	jn-bg-no-repeat
	focus:jn-outline-none
	focus:jn-ring-2
	focus:jn-ring-theme-focus
	disabled:jn-opacity-50
`,wrapperstyles=`
	jn-relative
`,iconstyles=`
	jn-absolute
	jn-flex
	jn-right-2
	jn-top-1.5
	jn-pointer-events-none
`,disablediconstyles=`
	jn-opacity-50
`,errorstyles=`
	jn-border
	jn-border-theme-error
`,successstyles=`
	jn-border
	jn-border-theme-success
`,loadingStyles=`
	jn-absolute
	jn-top-0
	jn-right-0
	jn-bottom-0
	jn-left-0
	jn-text-center
	jn-bg-theme-select
	jn-text-theme-high
	jn-text-base
	jn-rounded-3px
	jn-flex
	jn-flex-col
	jn-justify-center
	jn-select-none
	jn-cursor-not-allowed
`,errorStyles=`
	jn-absolute
	jn-top-0
	jn-right-0
	jn-bottom-0
	jn-left-0
	jn-text-center
	jn-bg-theme-select
	jn-text-theme-high
	jn-text-base
	jn-rounded-3px
	jn-flex
	jn-flex-col
	jn-justify-center
	jn-select-none
	jn-cursor-not-allowed
`,loadingSpinnerStyles=`
	jn-ml-auto
	jn-mr-auto
`,errorIconStyles=`
	jn-ml-auto
	jn-mr-auto
`,iconpaddingright=`
	jn-pr-[3.75rem]
`,defaultpaddingright=`
	jn-pr-9
`,NativeSelect=a=>{let{name:f=null,id:g="",children:b,className:h="",disabled:i=null,invalid:j=!1,valid:k=!1,loading:l=!1,error:m=!1,onChange:c,onClick:d,wrapperClassName:n="",...e}=a;const[o,p]=useState(!1),[q,r]=useState(!1),[s,t]=useState(!1),[u,v]=useState(!1);useEffect(()=>{p(l)},[l]),useEffect(()=>{r(j)},[j]),useEffect(()=>{t(k)},[k]),useEffect(()=>{v(m)},[m]);return React__default.createElement("div",{className:`
      juno-select-wrapper 
      ${wrapperstyles}
      ${n}`},React__default.createElement("select",_extends({name:f||"Unnamed Select",id:g,className:`juno-select ${selectstyles} ${q?"juno-select-invalid "+errorstyles:""} ${s?"juno-select-valid "+successstyles:""} ${u?"juno-select-error ":""} ${(()=>s||q?iconpaddingright:defaultpaddingright)()} ${h}`,onChange:a=>{c&&c(a)},onClick:a=>{d&&d(a)},disabled:i||o||u},e),b),React__default.createElement(a=>{let{disabled:b}=a;return o?React__default.createElement("div",{className:`juno-select-loading ${loadingStyles}`},React__default.createElement(Spinner,{className:`${loadingSpinnerStyles}`})):u?React__default.createElement("div",{className:`juno-select-errortext ${errorStyles}`},React__default.createElement(Icon,{icon:"errorOutline",color:"jn-text-theme-error",className:`${errorIconStyles}`})):React__default.createElement("div",{className:`${iconstyles} ${b?disablediconstyles:""} `},q?React__default.createElement(Icon,{icon:"dangerous",color:"jn-text-theme-error"}):null,s?React__default.createElement(Icon,{icon:"checkCircle",color:"jn-text-theme-success"}):null,React__default.createElement(Icon,{icon:"expandMore"}))},{disabled:i}))};NativeSelect.propTypes={name:PropTypes.string,id:PropTypes.string,className:PropTypes.string,children:PropTypes.node,disabled:PropTypes.bool,invalid:PropTypes.bool,valid:PropTypes.bool,loading:PropTypes.bool,error:PropTypes.bool,onChange:PropTypes.func,onClick:PropTypes.func,wrapperClassName:PropTypes.string};export{NativeSelect as N};