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