@oliasoft-open-source/react-ui-library 4.8.0-beta-2 → 4.8.0-beta-3

package/dist/storybook/assets/number-input-CD-fbjVQ.js

@@ -1,4 +0,0 @@
-import{j as G}from"./jsx-runtime-eps93zm2.js";import{r as s}from"./index-DhsZuJvc.js";import{d as v}from"./index-DQs5XS8h.js";import{l as J}from"./lodash-BHd_uQHh.js";import{I as K}from"./input-BW9trNAW.js";const P=t=>t?typeof t=="string"?t:J.isArray(t)?t[0]:t.fieldName:"",Q=({name:t,placeholder:N="",disabled:q=!1,error:y=!1,left:V=!1,small:I=!1,width:h="100%",value:u="",onChange:F=()=>{},onFocus:S=()=>{},onBlur:x=()=>{},tabIndex:H=0,testId:L,tooltip:M=null,warning:R=!1,validationCallback:l=()=>{},allowEmpty:j=!1,isInTable:A,groupOrder:B,enableDisplayRounding:T=!1,roundDisplayValue:b})=>{const r=s.useRef(null),[i,f]=s.useState(u),[C,o]=s.useState(null),[c,E]=s.useState(!1),a=P(t),w=e=>{let n=v.validateNumber(e);return j&&e===""||n.valid?{...n,valid:!0,errors:void 0}:n};s.useEffect(()=>{const{valid:e,errors:n}=w(u);if(f(u),e)o(null),l(a,null);else{const m=n&&n.length?n[0]:null;o(m),l(a,m)}},[u,y]);const D=e=>{const n=e.target,{value:m}=n,d=v.cleanNumStr(m.replaceAll(" ","").replaceAll("|","")),{valid:z,errors:g}=w(d);if(z){const p={...e,target:{...e.target,value:d,name:a}};F(p),f(d),o(null),l(a,null)}else{f(d);const p=g&&g.length?g[0]:null;o(p),l(a,p)}};s.useEffect(()=>{if(r&&(r!=null&&r.current)&&T&&c){const e=r.current;e&&setTimeout(()=>{const{length:n}=String(i);e.setSelectionRange(n,n)},0)}},[c]);const O=e=>{E(!0),S(e)},_=e=>{E(!1),x(e)},k=!c&&T?b?b(i):v.roundToFixed(i,2):i;return G.jsx(K,{type:"text",name:a,testId:L,disabled:q,placeholder:N,value:k,onChange:D,onFocus:O,onBlur:_,error:y||C,warning:R,right:!V,small:I,width:h,isInTable:A,groupOrder:B,tabIndex:H,tooltip:M,ref:r},a)};Q.__docgenInfo={description:"",methods:[],displayName:"NumberInput",props:{name:{required:!1,tsType:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},description:""},placeholder:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}},disabled:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},error:{required:!1,tsType:{name:"union",raw:"string | boolean",elements:[{name:"string"},{name:"boolean"}]},description:"",defaultValue:{value:"false",computed:!1}},left:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},small:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},width:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'100%'",computed:!1}},value:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"''",computed:!1}},onChange:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: ChangeEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"ChangeEvent",elements:[{name:"HTMLInputElement"}],raw:"ChangeEvent<HTMLInputElement>"},name:"evt"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},onFocus:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: FocusEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"FocusEvent",elements:[{name:"HTMLInputElement"}],raw:"FocusEvent<HTMLInputElement>"},name:"evt"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},onBlur:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: FocusEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"FocusEvent",elements:[{name:"HTMLInputElement"}],raw:"FocusEvent<HTMLInputElement>"},name:"evt"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},tabIndex:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"0",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:""},tooltip:{required:!1,tsType:{name:"union",raw:"TStringOrNumber | React.ReactNode",elements:[{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},{name:"ReactReactNode",raw:"React.ReactNode"}]},description:"",defaultValue:{value:"null",computed:!1}},warning:{required:!1,tsType:{name:"union",raw:"string | boolean",elements:[{name:"string"},{name:"boolean"}]},description:"",defaultValue:{value:"false",computed:!1}},validationCallback:{required:!1,tsType:{name:"signature",type:"function",raw:`(
-  name: string | { fieldName: string },
-  error: string | null,
-) => void`,signature:{arguments:[{type:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},name:"name"},{type:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},name:"error"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},allowEmpty:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},isInTable:{required:!1,tsType:{name:"boolean"},description:""},groupOrder:{required:!1,tsType:{name:"any"},description:""},enableDisplayRounding:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},roundDisplayValue:{required:!1,tsType:{name:"signature",type:"function",raw:"(args: TStringNumberNull) => TStringNumberNull",signature:{arguments:[{type:{name:"union",raw:"string | number | null",elements:[{name:"string"},{name:"number"},{name:"null"}]},name:"args"}],return:{name:"union",raw:"string | number | null",elements:[{name:"string"},{name:"number"},{name:"null"}]}}},description:""}}};export{Q as N};

package/dist/storybook/assets/number-input.stories-h1PlFB_G.js

@@ -1,105 +0,0 @@
-import{j as t}from"./jsx-runtime-eps93zm2.js";import{w as pe,u as I,e as E}from"./index-Be0hXiyp.js";import{d as ge}from"./index-DQs5XS8h.js";import{N as A}from"./number-input-CD-fbjVQ.js";import{I as le}from"./input-group-BaRSJAEN.js";import{I as de}from"./input-group-addon-D68iUKV2.js";import{S as ce}from"./select-C8iu4-uz.js";import"./index-DhsZuJvc.js";import"./index-CF7H4eMJ.js";import"./index-DRSy5Ssd.js";import"./lodash-BHd_uQHh.js";import"./input-BW9trNAW.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-UmZ4Y_CR.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./common-types-Sih75Sav.js";import"./index-CEuq6vkz.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./text-B3-TSWok.js";import"./actions-CHgr8eL8.js";import"./button-VxhoNhrV.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./badge-CLQ59MDF.js";import"./select.input-DIKP56UZ.js";const{useArgs:ie}=__STORYBOOK_MODULE_PREVIEW_API__,Ue={title:"Forms/NumberInput",component:A,parameters:{canvas:{page:null}},args:{label:"Label"}},e=a=>{const[b,n]=ie(),r=oe=>{n({value:oe.target.value})};return t.jsx(A,{onChange:r,value:123,...a})},C=e.bind({}),u=e.bind({});u.args={small:!0};const o=e.bind({});o.args={width:"150px"};const p=e.bind({});p.args={left:!0};const g=e.bind({});g.args={disabled:!0};const l=e.bind({});l.args={allowEmpty:!0,value:""};const d=e.bind({});d.args={warning:"This input number is almost 100!",value:"99"};const c=e.bind({});c.args={error:"This is a error message"};const i=e.bind({});i.args={value:"123test"};const m=e.bind({});m.args={value:"123.123456789",enableDisplayRounding:!0};const h=e.bind({});h.args={value:"123.123456789",enableDisplayRounding:!0,roundDisplayValue:a=>ge.roundToFixed(a,4)};const v=()=>t.jsxs(le,{small:!0,children:[t.jsx(A,{value:123}),t.jsx(de,{children:"to"}),t.jsx(A,{value:123}),t.jsx(ce,{options:[{value:"units",label:"units"}],width:"auto",value:"units"})]}),s=e.bind({});s.args={testId:"testId",enableDisplayRounding:!0};s.play=async({canvasElement:a,step:b})=>{const n=pe(a);await b("Value should be rounded on blur",async()=>{const r=n.getByTestId("testId");await I.clear(r),await I.type(r,"123.123456789"),await I.click(a),await E(n.getByDisplayValue("123.12")).toBeInTheDocument()}),await b("Full value shown on focus",async()=>{const r=n.getByTestId("testId");await I.click(r),await E(n.getByDisplayValue("123.123456789")).toBeInTheDocument()})};v.__docgenInfo={description:"",methods:[],displayName:"TestInputGroup"};var T,y,_;C.parameters={...C.parameters,docs:{...(T=C.parameters)==null?void 0:T.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(_=(y=C.parameters)==null?void 0:y.docs)==null?void 0:_.source}}};var D,S,w;u.parameters={...u.parameters,docs:{...(D=u.parameters)==null?void 0:D.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(w=(S=u.parameters)==null?void 0:S.docs)==null?void 0:w.source}}};var N,L,f;o.parameters={...o.parameters,docs:{...(N=o.parameters)==null?void 0:N.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(f=(L=o.parameters)==null?void 0:L.docs)==null?void 0:f.source}}};var x,M,H;p.parameters={...p.parameters,docs:{...(x=p.parameters)==null?void 0:x.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(H=(M=p.parameters)==null?void 0:M.docs)==null?void 0:H.source}}};var R,B,G;g.parameters={...g.parameters,docs:{...(R=g.parameters)==null?void 0:R.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(G=(B=g.parameters)==null?void 0:B.docs)==null?void 0:G.source}}};var W,j,O;l.parameters={...l.parameters,docs:{...(W=l.parameters)==null?void 0:W.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(O=(j=l.parameters)==null?void 0:j.docs)==null?void 0:O.source}}};var V,F,k;d.parameters={...d.parameters,docs:{...(V=d.parameters)==null?void 0:V.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(k=(F=d.parameters)==null?void 0:F.docs)==null?void 0:k.source}}};var P,K,U;c.parameters={...c.parameters,docs:{...(P=c.parameters)==null?void 0:P.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(U=(K=c.parameters)==null?void 0:K.docs)==null?void 0:U.source}}};var Y,q,z;i.parameters={...i.parameters,docs:{...(Y=i.parameters)==null?void 0:Y.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(z=(q=i.parameters)==null?void 0:q.docs)==null?void 0:z.source}}};var J,Q,X;m.parameters={...m.parameters,docs:{...(J=m.parameters)==null?void 0:J.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(X=(Q=m.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};var Z,$,ee;h.parameters={...h.parameters,docs:{...(Z=h.parameters)==null?void 0:Z.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(ee=($=h.parameters)==null?void 0:$.docs)==null?void 0:ee.source}}};var ae,ne,re;v.parameters={...v.parameters,docs:{...(ae=v.parameters)==null?void 0:ae.docs,source:{originalSource:`() => <InputGroup small>
-    <NumberInput value={123} />
-    <InputGroupAddon>to</InputGroupAddon>
-    <NumberInput value={123} />
-    <Select options={[{
-    value: 'units',
-    label: 'units'
-  }]} width="auto" value="units" />
-  </InputGroup>`,...(re=(ne=v.parameters)==null?void 0:ne.docs)==null?void 0:re.source}}};var te,se,ue;s.parameters={...s.parameters,docs:{...(te=s.parameters)==null?void 0:te.docs,source:{originalSource:`args => {
-  const [_, updateArgs] = useArgs();
-  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
-    updateArgs({
-      value: evt.target.value
-    });
-  };
-  return <NumberInput onChange={handleChange} value={123} {...args} />;
-}`,...(ue=(se=s.parameters)==null?void 0:se.docs)==null?void 0:ue.source}}};const Ye=["Default","Small","Width","Left","Disabled","AllowEmpty","Warning","Error","BadInput","WithDisplayRounding","WithCustomDisplayRounding","TestInputGroup","TestDisplayRounding"];export{l as AllowEmpty,i as BadInput,C as Default,g as Disabled,c as Error,p as Left,u as Small,s as TestDisplayRounding,v as TestInputGroup,d as Warning,o as Width,h as WithCustomDisplayRounding,m as WithDisplayRounding,Ye as __namedExportsOrder,Ue as default};