var $=Object.defineProperty,v=Object.defineProperties;var D=Object.getOwnPropertyDescriptors;var u=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var C=(e,o,t)=>o in e?$(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,w=(e,o)=>{for(var t in o||(o={}))y.call(o,t)&&C(e,t,o[t]);if(u)for(var t of u(o))I.call(o,t)&&C(e,t,o[t]);return e},_=(e,o)=>v(e,D(o));var k=(e,o)=>{var t={};for(var n in e)y.call(e,n)&&o.indexOf(n)<0&&(t[n]=e[n]);if(e!=null&&u)for(var n of u(e))o.indexOf(n)<0&&I.call(e,n)&&(t[n]=e[n]);return t};import{useEffect as a,useState as J}from"react";import h from"@emotion/styled";import{AddIcon as K,MinusIcon as L}from"@chakra-ui/icons";import{Box as O,Button as Q,Flex as S,Text as U}from"@chakra-ui/react";import M from"react";import{createMultiStyleConfigHelpers as A,defineStyle as E,FormControl as G,Input as H,InputGroup as V,Text as m}from"@chakra-ui/react";import{inputAnatomy as W}from"@chakra-ui/anatomy";import{jsx as p,jsxs as z}from"react/jsx-runtime";var F=M.forwardRef((d,x)=>{var l=d,{label:e,error:o,placeholder:t,helperText:n,isInvalid:s,as:r=H,InputLeftAddon:i,InputRightAddon:g}=l,f=k(l,["label","error","placeholder","helperText","isInvalid","as","InputLeftAddon","InputRightAddon"]);let{disabled:R}=f;return z(G,{isInvalid:s,opacity:R?.4:1,children:[e&&p(m,{color:s?"destructive":"foreground",fontWeight:"medium",fontSize:"sm",lineHeight:1,children:e}),z(V,{mt:"2",children:[i,p(r,_(w({variant:"",placeholder:t},f),{ref:x})),g]}),n&&p(m,{fontSize:"xs",mt:2,color:"mutedForeground",children:n}),s&&o&&p(m,{fontSize:"xs",mt:2,color:"destructive",children:o})]})}),{definePartsStyle:T,defineMultiStyleConfig:j}=A(W.keys),q=T({field:{color:"foreground",background:"background",boxShadow:"base",borderWidth:"1px",borderStyle:"solid",borderColor:"input",borderRadius:"lg",_focusVisible:{borderColor:"ring"},_hover:{},_disabled:{opacity:1},_placeholder:{color:"mutedForeground"}}}),N=E({borderRadius:"md"}),P={sm:T({field:N})},ie=j({baseStyle:q,sizes:P});import{jsx as c,jsxs as b}from"react/jsx-runtime";var X=h(O)`
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px;
  height: 40px;
  border-radius: 12px;
`,B=h(Q)`
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  height: 32px;
  width: 32px;
  //border-radius: 12px;
  //border: none;
  //border: 1px solid ${e=>e.theme.colors.border};
  pointer-events: ${e=>e.disabled?"none":"unset"};
  opacity: ${e=>e.disabled?"0.5":"1"};

  &:active {
    border: 1px solid ${e=>e.theme.colors.foreground};
  }

  svg {
    path {
      fill: ${e=>e.theme.colors.foreground};
    }
  }
`,Y=h(F)`
  justify-content: center;
  font-size: 18px;
  min-width: 60px;
  user-select: none;
  border: none;
  box-shadow: none;
  max-width: 80px;
  text-align: center;
`,Z=({initialState:e=1,maxState:o,onChange:t,value:n,onError:s})=>{let[r,i]=J(e);return a(()=>{t(r)},[r]),a(()=>{i(e)},[e]),a(()=>{o>0&&n>o||r<1?s(!0):s(!1)},[o,n,r]),b(S,{flexDirection:"column",alignItems:"flex-end",children:[b(X,{children:[c(B,{variant:"outline",onClick:()=>{n>e&&i(d=>n-1)},disabled:n===1,children:c(L,{})}),c(Y,{value:n,onChange:d=>{let l=Number(d.target.value);i(l)}}),c(B,{variant:"outline",onClick:()=>{o?n<o&&i(d=>n+1):i(d=>n+1)},disabled:o===n||!o,children:c(K,{})})]}),(o>0&&n>o||r<1)&&b(U,{fontSize:12,mt:10,color:"#E11900",children:["Enter quantity between 1 to ",o]})]})},be=Z;export{be as default};
