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