@bikdotai/bik-component-library 0.0.573-1 → 0.0.573-3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),l=require("./Input-helper.js"),s=require("../tooltips/Tooltip.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),o=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const d=n.forwardRef(((d,h)=>{var v,x,p,g,j,f,m,y;const{placeholder:b,leftIcon:C,rightIcon:O,labelText:T,maxCharLimit:I,isRequired:S,hintText:w,type:E,state:k,validate:q,variant:H,button:L,suffixText:M,prefixText:B,onChangeText:F,value:R,noErrorHint:P,reset:z,rangeValidation:A,noKeyDownChange:D,version:N,noMaxCharCheck:_,labelElement:K,autoGrow:G,minHeight:W,maxHeight:V,labelTextBold:$,truncateText:J,maxCharLimitPosition:Q}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP"},d),U=null==C?void 0:C.icon,X=null==O?void 0:O.icon,[Y,Z]=n.useState(!1),[ee,te]=n.useState(!1),[ne,ie]=n.useState(),le="small"===H?"18px":"22px",se=n.useContext(u.InputStyleContext),[re,ae]=n.useState(),oe=n.useRef(null),ue=null!=h?h:oe;n.useEffect((()=>{ae(R),!R&&G&&(ue.current.style.height=W||"48px")}),[R]),n.useEffect((()=>{var e;ue.current&&(null===(e=d.onReferenceInit)||void 0===e||e.call(d,ue.current))}),[ue]),n.useEffect((()=>{const e=ue.current;if(e&&["phonenumber","zip","number"].includes(E))return e.addEventListener("wheel",ve,{passive:!1}),()=>{e.removeEventListener("wheel",ve)}}),[]),n.useEffect((()=>{z&&ae("")}),[z]),n.useEffect((()=>{var e;te(!!d.isActive),d.isActive&&(null===(e=ue.current)||void 0===e||e.focus())}),[d.isActive]),n.useEffect((()=>{ie(d.errorMessage)}),[d.errorMessage]),n.useEffect((()=>{var e;Z(!1),("invalid"===d.state||ne||"disabled-invalid"===d.state)&&Z(!0),"active"===d.state&&(null===(e=ue.current)||void 0===e||e.focus())}),[d.state,ne]),n.useEffect((()=>{Z(!!ne||"invalid"===d.state)}),[ne,d.state]);const ce=function(e){if(l.isFunction(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},de=()=>"zip"===E?6:2e3,he=e=>{const t=0!==I?I:de();if(D||F(R||"",e),_)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},ve=e=>{e.preventDefault()},xe=e=>{let t=e.target.value;const n=0!==I?I+1:de();!_&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),F(t,e),d.textControl||ae(t),G&&(ue.current.style.height=`${ue.current.scrollHeight}px`,t||(ue.current.style.height=W||"48px"));const i=q||l.validateInput;if(!i||!l.isFunction(i))return;const[s,r]=i(t,E,A);Z(!s),ie(d.errorMessage?d.errorMessage:r)},pe=e=>{var t;d.skipFocus||te(!0),ce(null===(t=d.onFocus)||void 0===t?void 0:t.call(d,e))},ge=e=>{var t;d.skipFocus||te(!1),ce(null===(t=d.onBlur)||void 0===t?void 0:t.call(d,e))},je=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==E&&e.jsx("input",{className:J?"truncate-class":"","data-test":d["data-test"],id:d.id,style:null!==(t=null==se?void 0:se.input)&&void 0!==t?t:{},ref:ue,type:["phonenumber","zip","number"].includes(E)?"number":E,value:re,onFocus:e=>pe(e),onBlur:e=>ge(e),placeholder:b||"Enter here",onChange:xe,onClick:e=>ce(d.onClick),onKeyDown:e=>he(e)}),"multiline"===E&&e.jsx("textarea",{"data-test":d["data-test"],value:re,ref:ue,onFocus:e=>pe(e),onBlur:e=>ge(e),onClick:e=>ce(d.onClick),placeholder:b||"Enter here",onChange:xe,onKeyDown:e=>he(e),maxLength:I>0?I:void 0})]})};return e.jsxs(c.RootContainer,Object.assign({width:d.width,height:d.height,state:k,type:E,style:null!==(v=null==se?void 0:se.RootContainer)&&void 0!==v?v:{}},{children:[e.jsxs("div",Object.assign({className:"flex-align-center"},{children:[!P&&(!!w||!!ne)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!ne},{children:[!!ne&&e.jsx(o.default,{width:16,height:16}),ne||w]})),I>0&&"BOTTOM"===Q&&e.jsxs(c.MaxCharStyle,Object.assign({position:"BOTTOM"},{children:[null!==(p=null===(x=(null!=R?R:"").toString())||void 0===x?void 0:x.length)&&void 0!==p?p:0,"/",I]}))]})),e.jsxs(c.InputWrapper,Object.assign({variant:H,state:k,width:d.width,isActive:"active"===k||ee,isInvalid:Y,style:null!==(g=null==se?void 0:se.InputWrapper)&&void 0!==g?g:{},version:N,height:d.height},{children:[!!U&&e.jsx(c.IconHolder,Object.assign({variant:H,iconSize:le,onClick:()=>ce(null==C?void 0:C.callback),isLeft:!0,style:null!==(j=null==se?void 0:se.IconHolder)&&void 0!==j?j:{}},{children:e.jsx(U,{})})),!!B&&e.jsx(c.PrefixHolder,Object.assign({variant:H},{children:B})),"default"===H&&e.jsx(c.InputContainer,Object.assign({height:d.height,type:d.type,minHeight:W,maxHeight:V,autoGrow:G},{children:je()})),"small"===H&&e.jsx(c.InputContainerSmall,Object.assign({height:d.height,type:d.type},{children:je()})),!!X&&e.jsx(c.IconHolder,Object.assign({variant:H,iconSize:le,onClick:()=>ce(null==O?void 0:O.callback),isLeft:!1},{children:e.jsx(X,{})})),!!M&&e.jsx(c.SuffixHolder,Object.assign({variant:H},{children:M})),L&&L.text&&e.jsx(i.Button,{buttonText:L.text,onClick:()=>ce(null==L?void 0:L.onClick)})]})),(!!T||!!I)&&e.jsxs(c.InputHeader,Object.assign({invalid:Y},{children:[K&&K,e.jsxs("div",Object.assign({className:"label__container"},{children:[$?e.jsxs(r.TitleSmall,{children:[T,S?e.jsx("span",{children:"*"}):""]}):e.jsxs(r.BodySecondary,{children:[T,S?e.jsx("span",{children:"*"}):""]}),d.tooltipText&&e.jsx(s.Tooltip,Object.assign({body:d.tooltipText,placement:"top"},{children:e.jsx("span",{children:e.jsx(t.default,{style:{marginTop:-3},width:18,height:18,color:Y?a.COLORS.content.negative:a.COLORS.content.primary})})}))]})),I>0&&"TOP"===Q&&e.jsxs(c.MaxCharStyle,{children:[console.log(R,{props:d},null==R?void 0:R.length,null===(f=null==d?void 0:d.value)||void 0===f?void 0:f.length),null!==(y=null===(m=(null!=R?R:"").toString())||void 0===m?void 0:m.length)&&void 0!==y?y:0,"/",I]})]}))]}))}));d.displayName="Input",exports.Input=d;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import i from"../../assets/icons/info.svg.js";import{forwardRef as l,useState as o,useContext as r,useRef as a,useEffect as s}from"react";import{Button as c}from"../button/Button.js";import{isFunction as u,validateInput as d}from"./Input-helper.js";import{Tooltip as h}from"../tooltips/Tooltip.js";import{TitleSmall as v,BodySecondary as p}from"../TypographyStyle.js";import{COLORS as g}from"../../constants/Theme.js";import m from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as f}from"./context/InputStyleProvider.js";import{RootContainer as x,InputFooter as b,MaxCharStyle as y,InputWrapper as j,IconHolder as O,PrefixHolder as C,InputContainer as T,InputContainerSmall as w,SuffixHolder as k,InputHeader as I}from"./Input.styled.js";const L=l(((l,L)=>{var B,H,M,E,S,z,A,D;const{placeholder:F,leftIcon:P,rightIcon:N,labelText:K,maxCharLimit:R,isRequired:G,hintText:_,type:q,state:V,validate:W,variant:$,button:J,suffixText:Q,prefixText:U,onChangeText:X,value:Y,noErrorHint:Z,reset:ee,rangeValidation:te,noKeyDownChange:ne,version:ie,noMaxCharCheck:le,labelElement:oe,autoGrow:re,minHeight:ae,maxHeight:se,labelTextBold:ce,truncateText:ue,maxCharLimitPosition:de}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP"},l),he=null==P?void 0:P.icon,ve=null==N?void 0:N.icon,[pe,ge]=o(!1),[me,fe]=o(!1),[xe,be]=o(),ye="small"===$?"18px":"22px",je=r(f),[Oe,Ce]=o(),Te=a(null),we=null!=L?L:Te;s((()=>{Ce(Y),!Y&&re&&(we.current.style.height=ae||"48px")}),[Y]),s((()=>{var e;we.current&&(null===(e=l.onReferenceInit)||void 0===e||e.call(l,we.current))}),[we]),s((()=>{const e=we.current;if(e&&["phonenumber","zip","number"].includes(q))return e.addEventListener("wheel",Be,{passive:!1}),()=>{e.removeEventListener("wheel",Be)}}),[]),s((()=>{ee&&Ce("")}),[ee]),s((()=>{var e;fe(!!l.isActive),l.isActive&&(null===(e=we.current)||void 0===e||e.focus())}),[l.isActive]),s((()=>{be(l.errorMessage)}),[l.errorMessage]),s((()=>{var e;ge(!1),("invalid"===l.state||xe||"disabled-invalid"===l.state)&&ge(!0),"active"===l.state&&(null===(e=we.current)||void 0===e||e.focus())}),[l.state,xe]),s((()=>{ge(!!xe||"invalid"===l.state)}),[xe,l.state]);const ke=function(e){if(u(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},Ie=()=>"zip"===q?6:2e3,Le=e=>{const t=0!==R?R:Ie();if(ne||X(Y||"",e),le)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},Be=e=>{e.preventDefault()},He=e=>{let t=e.target.value;const n=0!==R?R+1:Ie();!le&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),X(t,e),l.textControl||Ce(t),re&&(we.current.style.height=`${we.current.scrollHeight}px`,t||(we.current.style.height=ae||"48px"));const i=W||d;if(!i||!u(i))return;const[o,r]=i(t,q,te);ge(!o),be(l.errorMessage?l.errorMessage:r)},Me=e=>{var t;l.skipFocus||fe(!0),ke(null===(t=l.onFocus)||void 0===t?void 0:t.call(l,e))},Ee=e=>{var t;l.skipFocus||fe(!1),ke(null===(t=l.onBlur)||void 0===t?void 0:t.call(l,e))},Se=()=>{var i;return e(n,{children:["multiline"!==q&&t("input",{className:ue?"truncate-class":"","data-test":l["data-test"],id:l.id,style:null!==(i=null==je?void 0:je.input)&&void 0!==i?i:{},ref:we,type:["phonenumber","zip","number"].includes(q)?"number":q,value:Oe,onFocus:e=>Me(e),onBlur:e=>Ee(e),placeholder:F||"Enter here",onChange:He,onClick:e=>ke(l.onClick),onKeyDown:e=>Le(e)}),"multiline"===q&&t("textarea",{"data-test":l["data-test"],value:Oe,ref:we,onFocus:e=>Me(e),onBlur:e=>Ee(e),onClick:e=>ke(l.onClick),placeholder:F||"Enter here",onChange:He,onKeyDown:e=>Le(e),maxLength:R>0?R:void 0})]})};return e(x,Object.assign({width:l.width,height:l.height,state:V,type:q,style:null!==(B=null==je?void 0:je.RootContainer)&&void 0!==B?B:{}},{children:[e("div",Object.assign({className:"flex-align-center"},{children:[!Z&&(!!_||!!xe)&&e(b,Object.assign({invalid:!!xe},{children:[!!xe&&t(m,{width:16,height:16}),xe||_]})),R>0&&"BOTTOM"===de&&e(y,Object.assign({position:"BOTTOM"},{children:[null!==(M=null===(H=(null!=Y?Y:"").toString())||void 0===H?void 0:H.length)&&void 0!==M?M:0,"/",R]}))]})),e(j,Object.assign({variant:$,state:V,width:l.width,isActive:"active"===V||me,isInvalid:pe,style:null!==(E=null==je?void 0:je.InputWrapper)&&void 0!==E?E:{},version:ie,height:l.height},{children:[!!he&&t(O,Object.assign({variant:$,iconSize:ye,onClick:()=>ke(null==P?void 0:P.callback),isLeft:!0,style:null!==(S=null==je?void 0:je.IconHolder)&&void 0!==S?S:{}},{children:t(he,{})})),!!U&&t(C,Object.assign({variant:$},{children:U})),"default"===$&&t(T,Object.assign({height:l.height,type:l.type,minHeight:ae,maxHeight:se,autoGrow:re},{children:Se()})),"small"===$&&t(w,Object.assign({height:l.height,type:l.type},{children:Se()})),!!ve&&t(O,Object.assign({variant:$,iconSize:ye,onClick:()=>ke(null==N?void 0:N.callback),isLeft:!1},{children:t(ve,{})})),!!Q&&t(k,Object.assign({variant:$},{children:Q})),J&&J.text&&t(c,{buttonText:J.text,onClick:()=>ke(null==J?void 0:J.onClick)})]})),(!!K||!!R)&&e(I,Object.assign({invalid:pe},{children:[oe&&oe,e("div",Object.assign({className:"label__container"},{children:[e(ce?v:p,{children:[K,G?t("span",{children:"*"}):""]}),l.tooltipText&&t(h,Object.assign({body:l.tooltipText,placement:"top"},{children:t("span",{children:t(i,{style:{marginTop:-3},width:18,height:18,color:pe?g.content.negative:g.content.primary})})}))]})),R>0&&"TOP"===de&&e(y,{children:[console.log(Y,{props:l},null==Y?void 0:Y.length,null===(z=null==l?void 0:l.value)||void 0===z?void 0:z.length),null!==(D=null===(A=(null!=Y?Y:"").toString())||void 0===A?void 0:A.length)&&void 0!==D?D:0,"/",R]})]}))]}))}));L.displayName="Input";export{L as Input};
|