UNPKG

@ebay/ui-core-react

Version:

Skin components build off React

2 lines (1 loc) 2.81 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("../tslib.es6-C4EgNkz1.js"),t=require("react"),M=require("classnames"),d=require("../textbox-DAip4ToD.js"),y=require("../icon-button-AJ6dtyvc.js"),S=require("../icons/ebay-icon-remove-24/index.js"),j=require("../icons/ebay-icon-delete-24/index.js"),O=require("../icons/ebay-icon-add-24/index.js"),W=v=>{const{className:x="",value:c=1,min:o=1,max:r=1/0,label:p="",a11yDeleteText:u="",onChange:I=()=>{},onInputChange:N=()=>{},onFocus:f=()=>{},onBlur:D=()=>{},onKeyDown:C=()=>{},onKeyPress:K=()=>{},onKeyUp:_=()=>{},onDeleteClick:g=()=>{},onIncrement:w=()=>{},onDecrement:B=()=>{}}=v,s=A.__rest(v,["className","value","min","max","label","a11yDeleteText","onChange","onInputChange","onFocus","onBlur","onKeyDown","onKeyPress","onKeyUp","onDeleteClick","onIncrement","onDecrement"]),q=u?1:0,[a,i]=t.useState(c??q),m=t.useRef(null),b=(n,e=0)=>{const z=u?1:0;let l=parseInt(n,10)+e;return isNaN(l)?l=z:l>r?l=r:l<o&&(l=o),l},h=n=>{if(!m.current)return;const e=m.current;e.classList.remove("number-input--increment"),e.classList.remove("number-input--decrement"),e.classList.remove("number-input--increment-disabled"),e.classList.remove("number-input--decrement-disabled"),e.offsetWidth,e.classList.add(`number-input--${n}`)},k=n=>{const e=b(a,1);h(e>=r?"increment-disabled":"increment"),i(e),w(n,{value:e}),I(n,{value:e})},P=n=>{const e=b(a,-1);h(e<=o?"decrement-disabled":"decrement"),i(e),B(n,{value:e}),I(n,{value:e})},E=n=>{const e=b(n.target.value,0);i(e),N(n,{value:e})},T=(n,e)=>{f(n,{value:Number(e.value)})},V=(n,e)=>{D(n,{value:Number(e.value)})},F=(n,e)=>{C(n,{value:Number(e.value)})},L=(n,e)=>{K(n,{value:Number(e.value)})},R=(n,e)=>{_(n,{value:Number(e.value)})},U=n=>{g(n,{value:a})};return t.createElement("span",{ref:m,className:M("number-input",u&&a===1&&"number-input--show-delete",x)},t.createElement(d.EbayTextbox,Object.assign({},s,{max:r,min:o,onBlur:V,onChange:E,onFocus:T,onInputChange:E,onKeyDown:F,onKeyPress:L,onKeyUp:R,type:"number",value:a}),t.createElement(d.EbayTextboxPrefixIcon,null,p&&t.createElement("label",{htmlFor:s?.id||"number-input"},p),t.createElement(y.EbayIconButton,{"aria-hidden":!0,className:"number-input__decrement",disabled:a<=o,icon:t.createElement(S.EbayIconRemove24,null),onClick:P,size:"small",tabIndex:-1,transparent:!0})),t.createElement(d.EbayTextboxPostfixIcon,null,u&&t.createElement(y.EbayIconButton,{"aria-label":u,className:"number-input__delete",icon:t.createElement(j.EbayIconDelete24,null),onClick:U,size:"small",transparent:!0}),t.createElement(y.EbayIconButton,{"aria-hidden":!0,className:"number-input__increment",disabled:a>=r,icon:t.createElement(O.EbayIconAdd24,null),onClick:k,size:"small",tabIndex:-1,transparent:!0}))))};exports.EbayNumberInput=W;