@bikdotai/bik-component-library 0.0.88 → 0.0.89

package/dist/cjs/components/input/Input.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 export type InputVariant = 'default' | 'small';
 export type InputStateI = 'invalid' | 'active' | 'read-only' | 'disabled' | 'none';
 export type InputTypeI = 'number' | 'email' | 'text' | 'multiline';
@@ -40,5 +40,9 @@ export interface InputProps {
     onFocus?: () => void;
     isActive?: boolean;
     id?: string;
+    onReferenceInit?: (element: HTMLInputElement | HTMLTextAreaElement) => void;
 }
-export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
+export declare const Input: {
+    (props: InputProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/components/input/Input.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../button/Button.js"),i=require("../TypographyStyle.js"),r=require("../../assets/icons/errorInfo.svg.js"),l=require("./context/InputStyleProvider.js"),s=require("./Input.styled.js");const a=e=>e&&"function"==typeof e,o=t.forwardRef(((o,u)=>{var c,d,v,x;const{placeholder:h,leftIcon:f,rightIcon:j,labelText:p,maxCharLimit:g,isRequired:y,hintText:I,type:b,state:C,validate:S,variant:m,button:w,suffixText:O,prefixText:E,onChangeText:q,value:H,noErrorHint:T,reset:k}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},o),B=null==f?void 0:f.icon,F=null==j?void 0:j.icon,[A,L]=t.useState(!1),[M,R]=t.useState(!1),[D,P]=t.useState(),z="small"===m?"18px":"22px",K=t.useContext(l.InputStyleContext),[W,_]=t.useState();t.useEffect((()=>{W||_(H)}),[H]),t.useEffect((()=>{k&&_("")}),[k]),t.useEffect((()=>{R(!!o.isActive)}),[o.isActive]),t.useEffect((()=>{P(o.errorMessage)}),[o.errorMessage]),t.useEffect((()=>{L(!1),("invalid"===o.state||D)&&L(!0)}),[o.state,D]),t.useEffect((()=>{L(!!D)}),[D]);const N=function(e){if(a(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)}},G=e=>{q(H||"",e),![8].includes(e.which)&&g>0&&e.target.value.length===g&&e.preventDefault()},J=e=>{const t=e.target.value;if(q(t,e),_(t),!S||!a(S))return;const[n,i]=S(t);L(!n),P(i)},Q=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==b&&e.jsx("input",{id:o.id,style:null!==(t=null==K?void 0:K.input)&&void 0!==t?t:{},ref:u,type:b,value:W,onFocus:()=>(R(!0),void N(o.onFocus)),onBlur:e=>(e=>{var t;R(!1),N(null===(t=o.onBlur)||void 0===t?void 0:t.call(o,e))})(e),placeholder:h||"Enter here",onChange:J,onKeyDown:e=>G(e)}),"multiline"===b&&e.jsx("textarea",{value:W,ref:u,onFocus:()=>R(!0),onBlur:()=>R(!1),placeholder:h||"Enter here",onChange:J,onKeyDown:e=>G(e)})]})};return e.jsxs(s.RootContainer,Object.assign({width:o.width,height:o.height,state:C,type:b,style:null!==(c=null==K?void 0:K.RootContainer)&&void 0!==c?c:{}},{children:[!T&&(!!I||!!D)&&e.jsxs(s.InputFooter,Object.assign({invalid:!!D},{children:[!!D&&e.jsx(r.default,{width:16,height:16}),D||I]})),e.jsxs(s.InputWrapper,Object.assign({variant:m,state:C,width:o.width,isActive:"active"===C||M,isInvalid:A,style:null!==(d=null==K?void 0:K.InputWrapper)&&void 0!==d?d:{}},{children:[!!B&&e.jsx(s.IconHolder,Object.assign({variant:m,iconSize:z,onClick:()=>N(null==f?void 0:f.callback),isLeft:!0,style:null!==(v=null==K?void 0:K.IconHolder)&&void 0!==v?v:{}},{children:e.jsx(B,{})})),!!E&&e.jsx(s.PrefixHolder,Object.assign({variant:m},{children:E})),"default"===m&&e.jsx(s.InputContainer,{children:Q()}),"small"===m&&e.jsx(s.InputContainerSmall,{children:Q()}),!!F&&e.jsx(s.IconHolder,Object.assign({variant:m,iconSize:z,onClick:()=>N(null==j?void 0:j.callback),isLeft:!1},{children:e.jsx(F,{})})),!!O&&e.jsx(s.SuffixHolder,Object.assign({variant:m},{children:O})),w&&w.text&&e.jsx(n.Button,{buttonText:w.text,onClick:()=>N(null==w?void 0:w.onClick)})]})),(!!p||!!g)&&"default"===m&&e.jsxs(s.InputHeader,Object.assign({invalid:A},{children:[e.jsxs(i.BodySecondary,{children:[p,y?e.jsx("span",{children:"*"}):""]}),g>0&&e.jsxs(s.MaxCharStyle,{children:[null===(x=o.value)||void 0===x?void 0:x.length,"/",g]})]}))]}))}));o.displayName="Input",exports.Input=o;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../button/Button.js"),i=require("../TypographyStyle.js"),r=require("../../assets/icons/errorInfo.svg.js"),l=require("./context/InputStyleProvider.js"),s=require("./Input.styled.js");const a=e=>e&&"function"==typeof e,o=o=>{var u,c,d,v;const{placeholder:x,leftIcon:h,rightIcon:f,labelText:j,maxCharLimit:p,isRequired:g,hintText:y,type:I,state:b,validate:C,variant:S,button:m,suffixText:E,prefixText:O,onChangeText:w,value:q,noErrorHint:H,reset:T}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},o),k=null==h?void 0:h.icon,B=null==f?void 0:f.icon,[A,F]=t.useState(!1),[R,L]=t.useState(!1),[M,D]=t.useState(),P="small"===S?"18px":"22px",z=t.useContext(l.InputStyleContext),[K,W]=t.useState(),_=t.useRef();t.useEffect((()=>{W(q)}),[q]),t.useEffect((()=>{var e;_.current&&(null===(e=o.onReferenceInit)||void 0===e||e.call(o,_.current))}),[_]),t.useEffect((()=>{T&&W("")}),[T]),t.useEffect((()=>{var e;L(!!o.isActive),o.isActive&&(null===(e=_.current)||void 0===e||e.focus())}),[o.isActive]),t.useEffect((()=>{D(o.errorMessage)}),[o.errorMessage]),t.useEffect((()=>{var e;F(!1),("invalid"===o.state||M)&&F(!0),"active"===o.state&&(null===(e=_.current)||void 0===e||e.focus())}),[o.state,M]),t.useEffect((()=>{F(!!M)}),[M]);const N=function(e){if(a(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)}},G=e=>{const t=p||125;w(q||"",e),![8].includes(e.which)&&t>0&&e.target.value.length===t&&e.preventDefault()},J=e=>{const t=e.target.value;if(w(t,e),W(t),!C||!a(C))return;const[n,i]=C(t);F(!n),D(i)},Q=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==I&&e.jsx("input",{id:o.id,style:null!==(t=null==z?void 0:z.input)&&void 0!==t?t:{},ref:_,type:I,value:K,onFocus:()=>(L(!0),void N(o.onFocus)),onBlur:e=>(e=>{var t;L(!1),N(null===(t=o.onBlur)||void 0===t?void 0:t.call(o,e))})(e),placeholder:x||"Enter here",onChange:J,onKeyDown:e=>G(e)}),"multiline"===I&&e.jsx("textarea",{value:K,ref:_,onFocus:()=>L(!0),onBlur:()=>L(!1),placeholder:x||"Enter here",onChange:J,onKeyDown:e=>G(e)})]})};return e.jsxs(s.RootContainer,Object.assign({width:o.width,height:o.height,state:b,type:I,style:null!==(u=null==z?void 0:z.RootContainer)&&void 0!==u?u:{}},{children:[!H&&(!!y||!!M)&&e.jsxs(s.InputFooter,Object.assign({invalid:!!M},{children:[!!M&&e.jsx(r.default,{width:16,height:16}),M||y]})),e.jsxs(s.InputWrapper,Object.assign({variant:S,state:b,width:o.width,isActive:"active"===b||R,isInvalid:A,style:null!==(c=null==z?void 0:z.InputWrapper)&&void 0!==c?c:{}},{children:[!!k&&e.jsx(s.IconHolder,Object.assign({variant:S,iconSize:P,onClick:()=>N(null==h?void 0:h.callback),isLeft:!0,style:null!==(d=null==z?void 0:z.IconHolder)&&void 0!==d?d:{}},{children:e.jsx(k,{})})),!!O&&e.jsx(s.PrefixHolder,Object.assign({variant:S},{children:O})),"default"===S&&e.jsx(s.InputContainer,{children:Q()}),"small"===S&&e.jsx(s.InputContainerSmall,{children:Q()}),!!B&&e.jsx(s.IconHolder,Object.assign({variant:S,iconSize:P,onClick:()=>N(null==f?void 0:f.callback),isLeft:!1},{children:e.jsx(B,{})})),!!E&&e.jsx(s.SuffixHolder,Object.assign({variant:S},{children:E})),m&&m.text&&e.jsx(n.Button,{buttonText:m.text,onClick:()=>N(null==m?void 0:m.onClick)})]})),(!!j||!!p)&&"default"===S&&e.jsxs(s.InputHeader,Object.assign({invalid:A},{children:[e.jsxs(i.BodySecondary,{children:[j,g?e.jsx("span",{children:"*"}):""]}),p>0&&e.jsxs(s.MaxCharStyle,{children:[null===(v=o.value)||void 0===v?void 0:v.length,"/",p]})]}))]}))};o.displayName="Input",exports.Input=o;

package/dist/cjs/components/searchBar/searchBar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputVariant } from '../input/Input';
 export interface SearchBarProps {
     width: string;

package/dist/cjs/components/stepper/WorkingStepper.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const WorkingStepper: () => JSX.Element;
 export declare enum STEPENUM {
     STEP1 = "STEP1",

package/dist/esm/components/input/Input.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 export type InputVariant = 'default' | 'small';
 export type InputStateI = 'invalid' | 'active' | 'read-only' | 'disabled' | 'none';
 export type InputTypeI = 'number' | 'email' | 'text' | 'multiline';
@@ -40,5 +40,9 @@ export interface InputProps {
     onFocus?: () => void;
     isActive?: boolean;
     id?: string;
+    onReferenceInit?: (element: HTMLInputElement | HTMLTextAreaElement) => void;
 }
-export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
+export declare const Input: {
+    (props: InputProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/components/input/Input.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import{forwardRef as n,useState as l,useContext as r,useEffect as o}from"react";import{Button as a}from"../button/Button.js";import{BodySecondary as s}from"../TypographyStyle.js";import c from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as d}from"./context/InputStyleProvider.js";import{RootContainer as u,InputFooter as v,InputWrapper as h,IconHolder as p,PrefixHolder as f,InputContainer as g,InputContainerSmall as m,SuffixHolder as x,InputHeader as y,MaxCharStyle as b}from"./Input.styled.js";const j=e=>e&&"function"==typeof e,C=n(((n,C)=>{var w,I,O,T;const{placeholder:k,leftIcon:A,rightIcon:B,labelText:L,maxCharLimit:S,isRequired:D,hintText:E,type:F,state:z,validate:H,variant:K,button:M,suffixText:R,prefixText:q,onChangeText:N,value:P,noErrorHint:W,reset:G}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},n),J=null==A?void 0:A.icon,Q=null==B?void 0:B.icon,[U,V]=l(!1),[X,Y]=l(!1),[Z,$]=l(),_="small"===K?"18px":"22px",ee=r(d),[te,ie]=l();o((()=>{te||ie(P)}),[P]),o((()=>{G&&ie("")}),[G]),o((()=>{Y(!!n.isActive)}),[n.isActive]),o((()=>{$(n.errorMessage)}),[n.errorMessage]),o((()=>{V(!1),("invalid"===n.state||Z)&&V(!0)}),[n.state,Z]),o((()=>{V(!!Z)}),[Z]);const ne=function(e){if(j(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)}},le=e=>{N(P||"",e),![8].includes(e.which)&&S>0&&e.target.value.length===S&&e.preventDefault()},re=e=>{const t=e.target.value;if(N(t,e),ie(t),!H||!j(H))return;const[i,n]=H(t);V(!i),$(n)},oe=()=>{var l;return e(i,{children:["multiline"!==F&&t("input",{id:n.id,style:null!==(l=null==ee?void 0:ee.input)&&void 0!==l?l:{},ref:C,type:F,value:te,onFocus:()=>(Y(!0),void ne(n.onFocus)),onBlur:e=>(e=>{var t;Y(!1),ne(null===(t=n.onBlur)||void 0===t?void 0:t.call(n,e))})(e),placeholder:k||"Enter here",onChange:re,onKeyDown:e=>le(e)}),"multiline"===F&&t("textarea",{value:te,ref:C,onFocus:()=>Y(!0),onBlur:()=>Y(!1),placeholder:k||"Enter here",onChange:re,onKeyDown:e=>le(e)})]})};return e(u,Object.assign({width:n.width,height:n.height,state:z,type:F,style:null!==(w=null==ee?void 0:ee.RootContainer)&&void 0!==w?w:{}},{children:[!W&&(!!E||!!Z)&&e(v,Object.assign({invalid:!!Z},{children:[!!Z&&t(c,{width:16,height:16}),Z||E]})),e(h,Object.assign({variant:K,state:z,width:n.width,isActive:"active"===z||X,isInvalid:U,style:null!==(I=null==ee?void 0:ee.InputWrapper)&&void 0!==I?I:{}},{children:[!!J&&t(p,Object.assign({variant:K,iconSize:_,onClick:()=>ne(null==A?void 0:A.callback),isLeft:!0,style:null!==(O=null==ee?void 0:ee.IconHolder)&&void 0!==O?O:{}},{children:t(J,{})})),!!q&&t(f,Object.assign({variant:K},{children:q})),"default"===K&&t(g,{children:oe()}),"small"===K&&t(m,{children:oe()}),!!Q&&t(p,Object.assign({variant:K,iconSize:_,onClick:()=>ne(null==B?void 0:B.callback),isLeft:!1},{children:t(Q,{})})),!!R&&t(x,Object.assign({variant:K},{children:R})),M&&M.text&&t(a,{buttonText:M.text,onClick:()=>ne(null==M?void 0:M.onClick)})]})),(!!L||!!S)&&"default"===K&&e(y,Object.assign({invalid:U},{children:[e(s,{children:[L,D?t("span",{children:"*"}):""]}),S>0&&e(b,{children:[null===(T=n.value)||void 0===T?void 0:T.length,"/",S]})]}))]}))}));C.displayName="Input";export{C as Input};
+import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{useState as i,useContext as l,useRef as r,useEffect as o}from"react";import{Button as a}from"../button/Button.js";import{BodySecondary as c}from"../TypographyStyle.js";import s from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as u}from"./context/InputStyleProvider.js";import{RootContainer as d,InputFooter as v,InputWrapper as h,IconHolder as p,PrefixHolder as f,InputContainer as g,InputContainerSmall as m,SuffixHolder as x,InputHeader as y,MaxCharStyle as b}from"./Input.styled.js";const j=e=>e&&"function"==typeof e,C=C=>{var I,w,O,T;const{placeholder:k,leftIcon:A,rightIcon:B,labelText:L,maxCharLimit:S,isRequired:D,hintText:E,type:F,state:R,validate:z,variant:H,button:K,suffixText:M,prefixText:q,onChangeText:N,value:P,noErrorHint:W,reset:G}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},C),J=null==A?void 0:A.icon,Q=null==B?void 0:B.icon,[U,V]=i(!1),[X,Y]=i(!1),[Z,$]=i(),_="small"===H?"18px":"22px",ee=l(u),[te,ne]=i(),ie=r();o((()=>{ne(P)}),[P]),o((()=>{var e;ie.current&&(null===(e=C.onReferenceInit)||void 0===e||e.call(C,ie.current))}),[ie]),o((()=>{G&&ne("")}),[G]),o((()=>{var e;Y(!!C.isActive),C.isActive&&(null===(e=ie.current)||void 0===e||e.focus())}),[C.isActive]),o((()=>{$(C.errorMessage)}),[C.errorMessage]),o((()=>{var e;V(!1),("invalid"===C.state||Z)&&V(!0),"active"===C.state&&(null===(e=ie.current)||void 0===e||e.focus())}),[C.state,Z]),o((()=>{V(!!Z)}),[Z]);const le=function(e){if(j(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)}},re=e=>{const t=S||125;N(P||"",e),![8].includes(e.which)&&t>0&&e.target.value.length===t&&e.preventDefault()},oe=e=>{const t=e.target.value;if(N(t,e),ne(t),!z||!j(z))return;const[n,i]=z(t);V(!n),$(i)},ae=()=>{var i;return e(n,{children:["multiline"!==F&&t("input",{id:C.id,style:null!==(i=null==ee?void 0:ee.input)&&void 0!==i?i:{},ref:ie,type:F,value:te,onFocus:()=>(Y(!0),void le(C.onFocus)),onBlur:e=>(e=>{var t;Y(!1),le(null===(t=C.onBlur)||void 0===t?void 0:t.call(C,e))})(e),placeholder:k||"Enter here",onChange:oe,onKeyDown:e=>re(e)}),"multiline"===F&&t("textarea",{value:te,ref:ie,onFocus:()=>Y(!0),onBlur:()=>Y(!1),placeholder:k||"Enter here",onChange:oe,onKeyDown:e=>re(e)})]})};return e(d,Object.assign({width:C.width,height:C.height,state:R,type:F,style:null!==(I=null==ee?void 0:ee.RootContainer)&&void 0!==I?I:{}},{children:[!W&&(!!E||!!Z)&&e(v,Object.assign({invalid:!!Z},{children:[!!Z&&t(s,{width:16,height:16}),Z||E]})),e(h,Object.assign({variant:H,state:R,width:C.width,isActive:"active"===R||X,isInvalid:U,style:null!==(w=null==ee?void 0:ee.InputWrapper)&&void 0!==w?w:{}},{children:[!!J&&t(p,Object.assign({variant:H,iconSize:_,onClick:()=>le(null==A?void 0:A.callback),isLeft:!0,style:null!==(O=null==ee?void 0:ee.IconHolder)&&void 0!==O?O:{}},{children:t(J,{})})),!!q&&t(f,Object.assign({variant:H},{children:q})),"default"===H&&t(g,{children:ae()}),"small"===H&&t(m,{children:ae()}),!!Q&&t(p,Object.assign({variant:H,iconSize:_,onClick:()=>le(null==B?void 0:B.callback),isLeft:!1},{children:t(Q,{})})),!!M&&t(x,Object.assign({variant:H},{children:M})),K&&K.text&&t(a,{buttonText:K.text,onClick:()=>le(null==K?void 0:K.onClick)})]})),(!!L||!!S)&&"default"===H&&e(y,Object.assign({invalid:U},{children:[e(c,{children:[L,D?t("span",{children:"*"}):""]}),S>0&&e(b,{children:[null===(T=C.value)||void 0===T?void 0:T.length,"/",S]})]}))]}))};C.displayName="Input";export{C as Input};

package/dist/esm/components/searchBar/searchBar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputVariant } from '../input/Input';
 export interface SearchBarProps {
     width: string;

package/dist/esm/components/stepper/WorkingStepper.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const WorkingStepper: () => JSX.Element;
 export declare enum STEPENUM {
     STEP1 = "STEP1",

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.88",
+	"version": "0.0.89",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",