@bikdotai/bik-component-library 0.0.685-beta.10 → 0.0.685-beta.12

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/cross.svg.js"),r=require("./Alert.styled.js"),o=require("./AlertHelper.js"),i=require("../TypographyStyle.js"),n=require("../../constants/Theme.js");exports.Alert=l=>{var s,c;return e.jsxs(r.AlertStyle,Object.assign({type:l.type,contentPosition:l.contentPosition,style:l.containerStyle},{children:[e.jsxs(r.AlertContentWrapper,{children:[l.icon&&e.jsx("div",Object.assign({style:Object.assign(Object.assign({},null==l?void 0:l.iconStyle),{display:(null===(s=null==l?void 0:l.iconStyle)||void 0===s?void 0:s.display)||"flex",alignSelf:(null===(c=null==l?void 0:l.iconStyle)||void 0===c?void 0:c.alignSelf)||"flex-start"})},{children:e.jsx(l.icon,{color:o.COLOR_CONFIG_MAP[l.type].textColor,height:16,width:16})})),e.jsx(i.BodyCaption,Object.assign({style:{color:l.textColor||o.COLOR_CONFIG_MAP[l.type].textColor,marginLeft:8,marginRight:4}},{children:l.text})),l.redirectToText&&l.redirectTo&&e.jsx(i.BodyCaption,Object.assign({style:{color:n.COLORS.text.brand,cursor:"pointer",textDecoration:"underline"},onClick:()=>{"INTERNAL"===l.redirectTo&&l.handleRedirectButtonClick?l.handleRedirectButtonClick():l.redirectTo&&window.open(l.redirectTo,"_blank")}},{children:l.redirectToText}))]}),l.showCrossButton&&e.jsx(r.CloseIconWrapper,{children:e.jsx(t.default,{width:20,height:20,color:n.COLORS.content.secondary,onClick:()=>{(null==l?void 0:l.handleCrossIconClick)&&l.handleCrossIconClick()}})})]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/cross.svg.js"),r=require("./Alert.styled.js"),o=require("./AlertHelper.js"),i=require("../TypographyStyle.js"),n=require("../../constants/Theme.js");exports.Alert=l=>{var s,c;return e.jsxs(r.AlertStyle,Object.assign({type:l.type,contentPosition:l.contentPosition,style:l.containerStyle},{children:[e.jsxs(r.AlertContentWrapper,Object.assign({style:l.containerStyle},{children:[l.icon&&e.jsx("div",Object.assign({style:Object.assign(Object.assign({},null==l?void 0:l.iconStyle),{display:(null===(s=null==l?void 0:l.iconStyle)||void 0===s?void 0:s.display)||"flex",alignSelf:(null===(c=null==l?void 0:l.iconStyle)||void 0===c?void 0:c.alignSelf)||"flex-start"})},{children:e.jsx(l.icon,{color:o.COLOR_CONFIG_MAP[l.type].textColor,height:16,width:16})})),e.jsx(i.BodyCaption,Object.assign({style:{color:l.textColor||o.COLOR_CONFIG_MAP[l.type].textColor,marginLeft:8,marginRight:4}},{children:l.text})),l.redirectToText&&l.redirectTo&&e.jsx(i.BodyCaption,Object.assign({style:{color:n.COLORS.text.brand,cursor:"pointer",textDecoration:"underline"},onClick:()=>{"INTERNAL"===l.redirectTo&&l.handleRedirectButtonClick?l.handleRedirectButtonClick():l.redirectTo&&window.open(l.redirectTo,"_blank")}},{children:l.redirectToText}))]})),l.showCrossButton&&e.jsx(r.CloseIconWrapper,{children:e.jsx(t.default,{width:20,height:20,color:n.COLORS.content.secondary,onClick:()=>{(null==l?void 0:l.handleCrossIconClick)&&l.handleCrossIconClick()}})})]}))};
@@ -3,5 +3,7 @@ export declare const AlertStyle: import("styled-components").StyledComponent<"di
3
3
  type: ALERT_TYPES;
4
4
  contentPosition?: CONTENT_POSITION | undefined;
5
5
  }, never>;
6
- export declare const AlertContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
6
+ export declare const AlertContentWrapper: import("styled-components").StyledComponent<"div", any, {
7
+ contentPosition?: CONTENT_POSITION | undefined;
8
+ }, never>;
7
9
  export declare const CloseIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("./AlertHelper.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const l=o.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("./AlertHelper.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const n=o.default.div`
2
2
  display: flex;
3
3
  align-items: center;
4
4
  justify-content: ${e=>e.contentPosition||t.CONTENT_POSITION.CENTER};
@@ -6,12 +6,12 @@
6
6
  background-color: ${e=>t.COLOR_CONFIG_MAP[e.type].backgroundColor};
7
7
  border-radius: 4px;
8
8
  border: 1px solid ${e=>t.COLOR_CONFIG_MAP[e.type].borderColor};
9
- `,n=o.default.div`
9
+ `,l=o.default.div`
10
10
  flex: 1;
11
11
  display: flex;
12
- justify-content: center;
12
+ justify-content: ${e=>e.contentPosition||t.CONTENT_POSITION.CENTER};
13
13
  `,i=o.default.div`
14
14
  margin-left: 16px;
15
15
  display: flex;
16
16
  align-items: center;
17
- `;exports.AlertContentWrapper=n,exports.AlertStyle=l,exports.CloseIconWrapper=i;
17
+ `;exports.AlertContentWrapper=l,exports.AlertStyle=n,exports.CloseIconWrapper=i;
@@ -68,5 +68,6 @@ export interface InputProps {
68
68
  hideBorder?: boolean;
69
69
  inputWrapperStyles?: React.CSSProperties;
70
70
  minCharsToTrigger?: number;
71
+ isDisabled?: boolean;
71
72
  }
72
73
  export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement | null>>;
@@ -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"),l=require("./Input-helper.js"),r=require("../tooltips/Tooltip.js"),s=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),a=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const d=n.forwardRef(((d,h)=>{var v,g,p,x,j,f,m,b;const{placeholder:y,leftIcon:C,rightIcon:O,labelText:T,maxCharLimit:I,isRequired:S,hintText:w,type:E,state:k,validate:H,variant:q,button:B,suffixText:L,prefixText:M,onChangeText:F,value:P,noErrorHint:R,reset:D,rangeValidation:z,noKeyDownChange:A,version:K,noMaxCharCheck:N,labelElement:_,autoGrow:W,minHeight:G,maxHeight:V,labelTextBold:$,truncateText:J,maxCharLimitPosition:Q,hightlightInputColor:U,onKeyDownEvent:X,hideInputHeader:Y,hideBorder:Z,inputWrapperStyles:ee,minCharsToTrigger:te}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0},d),ne=null==C?void 0:C.icon,ie=null==O?void 0:O.icon,[le,re]=n.useState(!1),[se,oe]=n.useState(!1),[ae,ue]=n.useState(),ce="x-small"===q?"12px":"small"===q?"18px":"22px",de=n.useContext(u.InputStyleContext),[he,ve]=n.useState(),ge=n.useRef(null),pe=null!=h?h:ge;n.useEffect((()=>{ve(P),!P&&W&&(pe.current.style.height=G||"48px")}),[P]),n.useEffect((()=>{var e;pe.current&&(null===(e=d.onReferenceInit)||void 0===e||e.call(d,pe.current))}),[pe]),n.useEffect((()=>{const e=pe.current;if(e&&["phonenumber","zip","number"].includes(E))return e.addEventListener("wheel",me,{passive:!1}),()=>{e.removeEventListener("wheel",me)}}),[]),n.useEffect((()=>{D&&ve("")}),[D]),n.useEffect((()=>{var e;oe(!!d.isActive),d.isActive&&(null===(e=pe.current)||void 0===e||e.focus())}),[d.isActive]),n.useEffect((()=>{ue(d.errorMessage)}),[d.errorMessage]),n.useEffect((()=>{var e;re(!1),("invalid"===d.state||ae||"disabled-invalid"===d.state)&&re(!0),"active"===d.state&&(null===(e=pe.current)||void 0===e||e.focus())}),[d.state,ae]),n.useEffect((()=>{re(!!ae||"invalid"===d.state)}),[ae,d.state]);const xe=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)}},je=()=>"zip"===E?6:2e3,fe=e=>{const t=0!==I?I:je(),n=te,i=e.target.value;X&&(!i.length||i.length>=n)&&X(e),A||i.length&&!(i.length>=n)||F(P||"",e),N||![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},me=e=>{e.preventDefault()},be=e=>{let t=e.target.value;const n=0!==I?I+1:je(),i=te;if(!N&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),d.textControl||ve(t),i&&t&&t.length<i)return;F(t,e),W&&(pe.current.style.height=`${pe.current.scrollHeight}px`,t||(pe.current.style.height=G||"48px"));const r=H||l.validateInput;if(!r||!l.isFunction(r))return;const[s,o]=r(t,E,z);re(!s),ue(d.errorMessage?d.errorMessage:o)},ye=e=>{var t;d.skipFocus||oe(!0),xe(null===(t=d.onFocus)||void 0===t?void 0:t.call(d,e))},Ce=e=>{var t;d.skipFocus||oe(!1),xe(null===(t=d.onBlur)||void 0===t?void 0:t.call(d,e))},Oe=()=>{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==de?void 0:de.input)&&void 0!==t?t:{},ref:pe,type:["phonenumber","zip","number"].includes(E)?"number":E,value:he,onFocus:e=>ye(e),onBlur:e=>Ce(e),placeholder:y||"Enter here",onChange:be,onClick:e=>xe(d.onClick),onKeyDown:e=>fe(e)}),"multiline"===E&&e.jsx("textarea",{"data-test":d["data-test"],value:he,ref:pe,onFocus:e=>ye(e),onBlur:e=>Ce(e),onClick:e=>xe(d.onClick),placeholder:y||"Enter here",onChange:be,onKeyDown:e=>fe(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==de?void 0:de.RootContainer)&&void 0!==v?v:{}},{children:[e.jsxs("div",Object.assign({className:"flex-align-center"},{children:[!R&&(!!w||!!ae)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!ae},{children:[!!ae&&e.jsx(a.default,{width:16,height:16}),ae||w]})),I>0&&"BOTTOM"===Q&&e.jsxs(c.MaxCharStyle,Object.assign({position:"BOTTOM"},{children:[null!==(p=null===(g=(null!=P?P:"").toString())||void 0===g?void 0:g.length)&&void 0!==p?p:0,"/",I]}))]})),e.jsxs(c.InputWrapper,Object.assign({variant:q,state:k,width:d.width,isActive:"active"===k||se,isInvalid:le,style:null!==(j=null!==(x=null==de?void 0:de.InputWrapper)&&void 0!==x?x:ee)&&void 0!==j?j:{},version:K,height:d.height,hightlightInputColor:U,hideBorder:Z},{children:[!!ne&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:ce,onClick:()=>xe(null==C?void 0:C.callback),isLeft:!0,style:null!==(f=null==de?void 0:de.IconHolder)&&void 0!==f?f:{}},{children:e.jsx(ne,{})})),!!M&&e.jsx(c.PrefixHolder,Object.assign({variant:q},{children:M})),"default"===q&&e.jsx(c.InputContainer,Object.assign({height:d.height,type:d.type,minHeight:G,maxHeight:V,autoGrow:W},{children:Oe()})),["x-small","small"].includes(q)&&e.jsx(c.InputContainerSmall,Object.assign({height:d.height,type:d.type},{children:Oe()})),!!ie&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:ce,onClick:()=>xe(null==O?void 0:O.callback),isLeft:!1},{children:e.jsx(ie,{})})),!!L&&e.jsx(c.SuffixHolder,Object.assign({variant:q},{children:L})),B&&B.text&&e.jsx(i.Button,{buttonText:B.text,onClick:()=>xe(null==B?void 0:B.onClick)}),B&&B.buttonProps&&e.jsx(i.Button,Object.assign({},B.buttonProps))]})),!Y&&(!!T||!!I)&&e.jsxs(c.InputHeader,Object.assign({invalid:le},{children:[_&&_,e.jsxs("div",Object.assign({className:"label__container"},{children:[$?e.jsxs(s.TitleSmall,{children:[T,S?e.jsx("span",{children:"*"}):""]}):e.jsxs(s.BodySecondary,{children:[T,S?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:le?o.COLORS.content.negative:o.COLORS.content.primary})})}))]})),I>0&&"TOP"===Q&&e.jsxs(c.MaxCharStyle,{children:[null!==(b=null===(m=(null!=P?P:"").toString())||void 0===m?void 0:m.length)&&void 0!==b?b:0,"/",I]})]}))]}))}));d.displayName="Input",exports.Input=d;
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,g,p,x,j,f,m,b;const{placeholder:y,leftIcon:C,rightIcon:O,labelText:T,maxCharLimit:I,isRequired:S,hintText:w,type:E,state:k,validate:H,variant:q,button:B,suffixText:L,prefixText:M,onChangeText:F,value:P,noErrorHint:R,reset:D,rangeValidation:z,noKeyDownChange:A,version:K,noMaxCharCheck:N,labelElement:_,autoGrow:W,minHeight:G,maxHeight:V,labelTextBold:$,truncateText:J,maxCharLimitPosition:Q,hightlightInputColor:U,onKeyDownEvent:X,hideInputHeader:Y,hideBorder:Z,inputWrapperStyles:ee,minCharsToTrigger:te,isDisabled:ne=!1}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0},d),ie=null==C?void 0:C.icon,le=null==O?void 0:O.icon,[se,re]=n.useState(!1),[ae,oe]=n.useState(!1),[ue,ce]=n.useState(),de="x-small"===q?"12px":"small"===q?"18px":"22px",he=n.useContext(u.InputStyleContext),[ve,ge]=n.useState(),pe=n.useRef(null),xe=null!=h?h:pe;n.useEffect((()=>{ge(P),!P&&W&&(xe.current.style.height=G||"48px")}),[P]),n.useEffect((()=>{var e;xe.current&&(null===(e=d.onReferenceInit)||void 0===e||e.call(d,xe.current))}),[xe]),n.useEffect((()=>{const e=xe.current;if(e&&["phonenumber","zip","number"].includes(E))return e.addEventListener("wheel",be,{passive:!1}),()=>{e.removeEventListener("wheel",be)}}),[]),n.useEffect((()=>{D&&ge("")}),[D]),n.useEffect((()=>{var e;oe(!!d.isActive),d.isActive&&(null===(e=xe.current)||void 0===e||e.focus())}),[d.isActive]),n.useEffect((()=>{ce(d.errorMessage)}),[d.errorMessage]),n.useEffect((()=>{var e;re(!1),("invalid"===d.state||ue||"disabled-invalid"===d.state)&&re(!0),"active"===d.state&&(null===(e=xe.current)||void 0===e||e.focus())}),[d.state,ue]),n.useEffect((()=>{re(!!ue||"invalid"===d.state)}),[ue,d.state]);const je=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)}},fe=()=>"zip"===E?6:2e3,me=e=>{const t=0!==I?I:fe(),n=te,i=e.target.value;X&&(!i.length||i.length>=n)&&X(e),A||i.length&&!(i.length>=n)||F(P||"",e),N||![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},be=e=>{e.preventDefault()},ye=e=>{let t=e.target.value;const n=0!==I?I+1:fe(),i=te;if(!N&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),d.textControl||ge(t),i&&t&&t.length<i)return;F(t,e),W&&(xe.current.style.height=`${xe.current.scrollHeight}px`,t||(xe.current.style.height=G||"48px"));const s=H||l.validateInput;if(!s||!l.isFunction(s))return;const[r,a]=s(t,E,z);re(!r),ce(d.errorMessage?d.errorMessage:a)},Ce=e=>{var t;d.skipFocus||oe(!0),je(null===(t=d.onFocus)||void 0===t?void 0:t.call(d,e))},Oe=e=>{var t;d.skipFocus||oe(!1),je(null===(t=d.onBlur)||void 0===t?void 0:t.call(d,e))},Te=()=>{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==he?void 0:he.input)&&void 0!==t?t:{},ref:xe,disabled:ne,type:["phonenumber","zip","number"].includes(E)?"number":E,value:ve,onFocus:e=>Ce(e),onBlur:e=>Oe(e),placeholder:y||"Enter here",onChange:ye,onClick:e=>je(d.onClick),onKeyDown:e=>me(e)}),"multiline"===E&&e.jsx("textarea",{"data-test":d["data-test"],value:ve,ref:xe,onFocus:e=>Ce(e),onBlur:e=>Oe(e),onClick:e=>je(d.onClick),disabled:ne,placeholder:y||"Enter here",onChange:ye,onKeyDown:e=>me(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==he?void 0:he.RootContainer)&&void 0!==v?v:{}},{children:[e.jsxs("div",Object.assign({className:"flex-align-center"},{children:[!R&&(!!w||!!ue)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!ue},{children:[!!ue&&e.jsx(o.default,{width:16,height:16}),ue||w]})),I>0&&"BOTTOM"===Q&&e.jsxs(c.MaxCharStyle,Object.assign({position:"BOTTOM"},{children:[null!==(p=null===(g=(null!=P?P:"").toString())||void 0===g?void 0:g.length)&&void 0!==p?p:0,"/",I]}))]})),e.jsxs(c.InputWrapper,Object.assign({variant:q,state:k,width:d.width,isActive:"active"===k||ae,isInvalid:se,style:null!==(j=null!==(x=null==he?void 0:he.InputWrapper)&&void 0!==x?x:ee)&&void 0!==j?j:{},version:K,height:d.height,hightlightInputColor:U,hideBorder:Z},{children:[!!ie&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:de,onClick:()=>je(null==C?void 0:C.callback),isLeft:!0,style:null!==(f=null==he?void 0:he.IconHolder)&&void 0!==f?f:{}},{children:e.jsx(ie,{})})),!!M&&e.jsx(c.PrefixHolder,Object.assign({variant:q},{children:M})),"default"===q&&e.jsx(c.InputContainer,Object.assign({height:d.height,type:d.type,minHeight:G,maxHeight:V,autoGrow:W},{children:Te()})),["x-small","small"].includes(q)&&e.jsx(c.InputContainerSmall,Object.assign({height:d.height,type:d.type},{children:Te()})),!!le&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:de,onClick:()=>je(null==O?void 0:O.callback),isLeft:!1},{children:e.jsx(le,{})})),!!L&&e.jsx(c.SuffixHolder,Object.assign({variant:q},{children:L})),B&&B.text&&e.jsx(i.Button,{buttonText:B.text,onClick:()=>je(null==B?void 0:B.onClick)}),B&&B.buttonProps&&e.jsx(i.Button,Object.assign({},B.buttonProps))]})),!Y&&(!!T||!!I)&&e.jsxs(c.InputHeader,Object.assign({invalid:se},{children:[_&&_,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:se?a.COLORS.content.negative:a.COLORS.content.primary})})}))]})),I>0&&"TOP"===Q&&e.jsxs(c.MaxCharStyle,{children:[null!==(b=null===(m=(null!=P?P:"").toString())||void 0===m?void 0:m.length)&&void 0!==b?b:0,"/",I]})]}))]}))}));d.displayName="Input",exports.Input=d;
@@ -1 +1 @@
1
- import{jsxs as t,jsx as e}from"react/jsx-runtime";import o from"../../assets/icons/cross.svg.js";import{AlertStyle as i,AlertContentWrapper as r,CloseIconWrapper as n}from"./Alert.styled.js";import{COLOR_CONFIG_MAP as l}from"./AlertHelper.js";import{BodyCaption as c}from"../TypographyStyle.js";import{COLORS as s}from"../../constants/Theme.js";const d=d=>{var a,h;return t(i,Object.assign({type:d.type,contentPosition:d.contentPosition,style:d.containerStyle},{children:[t(r,{children:[d.icon&&e("div",Object.assign({style:Object.assign(Object.assign({},null==d?void 0:d.iconStyle),{display:(null===(a=null==d?void 0:d.iconStyle)||void 0===a?void 0:a.display)||"flex",alignSelf:(null===(h=null==d?void 0:d.iconStyle)||void 0===h?void 0:h.alignSelf)||"flex-start"})},{children:e(d.icon,{color:l[d.type].textColor,height:16,width:16})})),e(c,Object.assign({style:{color:d.textColor||l[d.type].textColor,marginLeft:8,marginRight:4}},{children:d.text})),d.redirectToText&&d.redirectTo&&e(c,Object.assign({style:{color:s.text.brand,cursor:"pointer",textDecoration:"underline"},onClick:()=>{"INTERNAL"===d.redirectTo&&d.handleRedirectButtonClick?d.handleRedirectButtonClick():d.redirectTo&&window.open(d.redirectTo,"_blank")}},{children:d.redirectToText}))]}),d.showCrossButton&&e(n,{children:e(o,{width:20,height:20,color:s.content.secondary,onClick:()=>{(null==d?void 0:d.handleCrossIconClick)&&d.handleCrossIconClick()}})})]}))};export{d as Alert};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import o from"../../assets/icons/cross.svg.js";import{AlertStyle as i,AlertContentWrapper as n,CloseIconWrapper as r}from"./Alert.styled.js";import{COLOR_CONFIG_MAP as l}from"./AlertHelper.js";import{BodyCaption as c}from"../TypographyStyle.js";import{COLORS as s}from"../../constants/Theme.js";const d=d=>{var a,y;return t(i,Object.assign({type:d.type,contentPosition:d.contentPosition,style:d.containerStyle},{children:[t(n,Object.assign({style:d.containerStyle},{children:[d.icon&&e("div",Object.assign({style:Object.assign(Object.assign({},null==d?void 0:d.iconStyle),{display:(null===(a=null==d?void 0:d.iconStyle)||void 0===a?void 0:a.display)||"flex",alignSelf:(null===(y=null==d?void 0:d.iconStyle)||void 0===y?void 0:y.alignSelf)||"flex-start"})},{children:e(d.icon,{color:l[d.type].textColor,height:16,width:16})})),e(c,Object.assign({style:{color:d.textColor||l[d.type].textColor,marginLeft:8,marginRight:4}},{children:d.text})),d.redirectToText&&d.redirectTo&&e(c,Object.assign({style:{color:s.text.brand,cursor:"pointer",textDecoration:"underline"},onClick:()=>{"INTERNAL"===d.redirectTo&&d.handleRedirectButtonClick?d.handleRedirectButtonClick():d.redirectTo&&window.open(d.redirectTo,"_blank")}},{children:d.redirectToText}))]})),d.showCrossButton&&e(r,{children:e(o,{width:20,height:20,color:s.content.secondary,onClick:()=>{(null==d?void 0:d.handleCrossIconClick)&&d.handleCrossIconClick()}})})]}))};export{d as Alert};
@@ -3,5 +3,7 @@ export declare const AlertStyle: import("styled-components").StyledComponent<"di
3
3
  type: ALERT_TYPES;
4
4
  contentPosition?: CONTENT_POSITION | undefined;
5
5
  }, never>;
6
- export declare const AlertContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
6
+ export declare const AlertContentWrapper: import("styled-components").StyledComponent<"div", any, {
7
+ contentPosition?: CONTENT_POSITION | undefined;
8
+ }, never>;
7
9
  export declare const CloseIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -1,17 +1,17 @@
1
- import e from"styled-components";import{CONTENT_POSITION as o,COLOR_CONFIG_MAP as t}from"./AlertHelper.js";const r=e.div`
1
+ import o from"styled-components";import{CONTENT_POSITION as e,COLOR_CONFIG_MAP as t}from"./AlertHelper.js";const i=o.div`
2
2
  display: flex;
3
3
  align-items: center;
4
- justify-content: ${e=>e.contentPosition||o.CENTER};
4
+ justify-content: ${o=>o.contentPosition||e.CENTER};
5
5
  padding: 8px 16px;
6
- background-color: ${e=>t[e.type].backgroundColor};
6
+ background-color: ${o=>t[o.type].backgroundColor};
7
7
  border-radius: 4px;
8
- border: 1px solid ${e=>t[e.type].borderColor};
9
- `,i=e.div`
8
+ border: 1px solid ${o=>t[o.type].borderColor};
9
+ `,r=o.div`
10
10
  flex: 1;
11
11
  display: flex;
12
- justify-content: center;
13
- `,n=e.div`
12
+ justify-content: ${o=>o.contentPosition||e.CENTER};
13
+ `,n=o.div`
14
14
  margin-left: 16px;
15
15
  display: flex;
16
16
  align-items: center;
17
- `;export{i as AlertContentWrapper,r as AlertStyle,n as CloseIconWrapper};
17
+ `;export{r as AlertContentWrapper,i as AlertStyle,n as CloseIconWrapper};
@@ -68,5 +68,6 @@ export interface InputProps {
68
68
  hideBorder?: boolean;
69
69
  inputWrapperStyles?: React.CSSProperties;
70
70
  minCharsToTrigger?: number;
71
+ isDisabled?: boolean;
71
72
  }
72
73
  export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement | null>>;
@@ -1 +1 @@
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 h,validateInput as u}from"./Input-helper.js";import{Tooltip as d}from"../tooltips/Tooltip.js";import{TitleSmall as v,BodySecondary as g}from"../TypographyStyle.js";import{COLORS as p}from"../../constants/Theme.js";import m from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as x}from"./context/InputStyleProvider.js";import{RootContainer as b,InputFooter as f,MaxCharStyle as y,InputWrapper as j,IconHolder as C,PrefixHolder as T,InputContainer as O,InputContainerSmall as w,SuffixHolder as I,InputHeader as k}from"./Input.styled.js";const B=l(((l,B)=>{var L,H,E,M,P,S,D,z;const{placeholder:A,leftIcon:F,rightIcon:K,labelText:N,maxCharLimit:R,isRequired:G,hintText:W,type:_,state:q,validate:V,variant:$,button:J,suffixText:Q,prefixText:U,onChangeText:X,value:Y,noErrorHint:Z,reset:ee,rangeValidation:te,noKeyDownChange:ne,version:ie,noMaxCharCheck:le,labelElement:re,autoGrow:oe,minHeight:ae,maxHeight:se,labelTextBold:ce,truncateText:he,maxCharLimitPosition:ue,hightlightInputColor:de,onKeyDownEvent:ve,hideInputHeader:ge,hideBorder:pe,inputWrapperStyles:me,minCharsToTrigger:xe}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0},l),be=null==F?void 0:F.icon,fe=null==K?void 0:K.icon,[ye,je]=r(!1),[Ce,Te]=r(!1),[Oe,we]=r(),Ie="x-small"===$?"12px":"small"===$?"18px":"22px",ke=o(x),[Be,Le]=r(),He=a(null),Ee=null!=B?B:He;s((()=>{Le(Y),!Y&&oe&&(Ee.current.style.height=ae||"48px")}),[Y]),s((()=>{var e;Ee.current&&(null===(e=l.onReferenceInit)||void 0===e||e.call(l,Ee.current))}),[Ee]),s((()=>{const e=Ee.current;if(e&&["phonenumber","zip","number"].includes(_))return e.addEventListener("wheel",De,{passive:!1}),()=>{e.removeEventListener("wheel",De)}}),[]),s((()=>{ee&&Le("")}),[ee]),s((()=>{var e;Te(!!l.isActive),l.isActive&&(null===(e=Ee.current)||void 0===e||e.focus())}),[l.isActive]),s((()=>{we(l.errorMessage)}),[l.errorMessage]),s((()=>{var e;je(!1),("invalid"===l.state||Oe||"disabled-invalid"===l.state)&&je(!0),"active"===l.state&&(null===(e=Ee.current)||void 0===e||e.focus())}),[l.state,Oe]),s((()=>{je(!!Oe||"invalid"===l.state)}),[Oe,l.state]);const Me=function(e){if(h(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)}},Pe=()=>"zip"===_?6:2e3,Se=e=>{const t=0!==R?R:Pe(),n=xe,i=e.target.value;ve&&(!i.length||i.length>=n)&&ve(e),ne||i.length&&!(i.length>=n)||X(Y||"",e),le||![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},De=e=>{e.preventDefault()},ze=e=>{let t=e.target.value;const n=0!==R?R+1:Pe(),i=xe;if(!le&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),l.textControl||Le(t),i&&t&&t.length<i)return;X(t,e),oe&&(Ee.current.style.height=`${Ee.current.scrollHeight}px`,t||(Ee.current.style.height=ae||"48px"));const r=V||u;if(!r||!h(r))return;const[o,a]=r(t,_,te);je(!o),we(l.errorMessage?l.errorMessage:a)},Ae=e=>{var t;l.skipFocus||Te(!0),Me(null===(t=l.onFocus)||void 0===t?void 0:t.call(l,e))},Fe=e=>{var t;l.skipFocus||Te(!1),Me(null===(t=l.onBlur)||void 0===t?void 0:t.call(l,e))},Ke=()=>{var i;return e(n,{children:["multiline"!==_&&t("input",{className:he?"truncate-class":"","data-test":l["data-test"],id:l.id,style:null!==(i=null==ke?void 0:ke.input)&&void 0!==i?i:{},ref:Ee,type:["phonenumber","zip","number"].includes(_)?"number":_,value:Be,onFocus:e=>Ae(e),onBlur:e=>Fe(e),placeholder:A||"Enter here",onChange:ze,onClick:e=>Me(l.onClick),onKeyDown:e=>Se(e)}),"multiline"===_&&t("textarea",{"data-test":l["data-test"],value:Be,ref:Ee,onFocus:e=>Ae(e),onBlur:e=>Fe(e),onClick:e=>Me(l.onClick),placeholder:A||"Enter here",onChange:ze,onKeyDown:e=>Se(e),maxLength:R>0?R:void 0})]})};return e(b,Object.assign({width:l.width,height:l.height,state:q,type:_,style:null!==(L=null==ke?void 0:ke.RootContainer)&&void 0!==L?L:{}},{children:[e("div",Object.assign({className:"flex-align-center"},{children:[!Z&&(!!W||!!Oe)&&e(f,Object.assign({invalid:!!Oe},{children:[!!Oe&&t(m,{width:16,height:16}),Oe||W]})),R>0&&"BOTTOM"===ue&&e(y,Object.assign({position:"BOTTOM"},{children:[null!==(E=null===(H=(null!=Y?Y:"").toString())||void 0===H?void 0:H.length)&&void 0!==E?E:0,"/",R]}))]})),e(j,Object.assign({variant:$,state:q,width:l.width,isActive:"active"===q||Ce,isInvalid:ye,style:null!==(P=null!==(M=null==ke?void 0:ke.InputWrapper)&&void 0!==M?M:me)&&void 0!==P?P:{},version:ie,height:l.height,hightlightInputColor:de,hideBorder:pe},{children:[!!be&&t(C,Object.assign({variant:$,iconSize:Ie,onClick:()=>Me(null==F?void 0:F.callback),isLeft:!0,style:null!==(S=null==ke?void 0:ke.IconHolder)&&void 0!==S?S:{}},{children:t(be,{})})),!!U&&t(T,Object.assign({variant:$},{children:U})),"default"===$&&t(O,Object.assign({height:l.height,type:l.type,minHeight:ae,maxHeight:se,autoGrow:oe},{children:Ke()})),["x-small","small"].includes($)&&t(w,Object.assign({height:l.height,type:l.type},{children:Ke()})),!!fe&&t(C,Object.assign({variant:$,iconSize:Ie,onClick:()=>Me(null==K?void 0:K.callback),isLeft:!1},{children:t(fe,{})})),!!Q&&t(I,Object.assign({variant:$},{children:Q})),J&&J.text&&t(c,{buttonText:J.text,onClick:()=>Me(null==J?void 0:J.onClick)}),J&&J.buttonProps&&t(c,Object.assign({},J.buttonProps))]})),!ge&&(!!N||!!R)&&e(k,Object.assign({invalid:ye},{children:[re&&re,e("div",Object.assign({className:"label__container"},{children:[e(ce?v:g,{children:[N,G?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:ye?p.content.negative:p.content.primary})})}))]})),R>0&&"TOP"===ue&&e(y,{children:[null!==(z=null===(D=(null!=Y?Y:"").toString())||void 0===D?void 0:D.length)&&void 0!==z?z:0,"/",R]})]}))]}))}));B.displayName="Input";export{B as Input};
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 d}from"./Input-helper.js";import{Tooltip as u}from"../tooltips/Tooltip.js";import{TitleSmall as v,BodySecondary as g}from"../TypographyStyle.js";import{COLORS as p}from"../../constants/Theme.js";import m from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as b}from"./context/InputStyleProvider.js";import{RootContainer as x,InputFooter as f,MaxCharStyle as y,InputWrapper as j,IconHolder as C,PrefixHolder as T,InputContainer as O,InputContainerSmall as w,SuffixHolder as I,InputHeader as k}from"./Input.styled.js";const B=l(((l,B)=>{var L,H,D,E,M,P,S,z;const{placeholder:A,leftIcon:F,rightIcon:K,labelText:N,maxCharLimit:R,isRequired:G,hintText:W,type:_,state:q,validate:V,variant:$,button:J,suffixText:Q,prefixText:U,onChangeText:X,value:Y,noErrorHint:Z,reset:ee,rangeValidation:te,noKeyDownChange:ie,version:ne,noMaxCharCheck:le,labelElement:re,autoGrow:oe,minHeight:ae,maxHeight:se,labelTextBold:ce,truncateText:he,maxCharLimitPosition:de,hightlightInputColor:ue,onKeyDownEvent:ve,hideInputHeader:ge,hideBorder:pe,inputWrapperStyles:me,minCharsToTrigger:be,isDisabled:xe=!1}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0},l),fe=null==F?void 0:F.icon,ye=null==K?void 0:K.icon,[je,Ce]=r(!1),[Te,Oe]=r(!1),[we,Ie]=r(),ke="x-small"===$?"12px":"small"===$?"18px":"22px",Be=o(b),[Le,He]=r(),De=a(null),Ee=null!=B?B:De;s((()=>{He(Y),!Y&&oe&&(Ee.current.style.height=ae||"48px")}),[Y]),s((()=>{var e;Ee.current&&(null===(e=l.onReferenceInit)||void 0===e||e.call(l,Ee.current))}),[Ee]),s((()=>{const e=Ee.current;if(e&&["phonenumber","zip","number"].includes(_))return e.addEventListener("wheel",ze,{passive:!1}),()=>{e.removeEventListener("wheel",ze)}}),[]),s((()=>{ee&&He("")}),[ee]),s((()=>{var e;Oe(!!l.isActive),l.isActive&&(null===(e=Ee.current)||void 0===e||e.focus())}),[l.isActive]),s((()=>{Ie(l.errorMessage)}),[l.errorMessage]),s((()=>{var e;Ce(!1),("invalid"===l.state||we||"disabled-invalid"===l.state)&&Ce(!0),"active"===l.state&&(null===(e=Ee.current)||void 0===e||e.focus())}),[l.state,we]),s((()=>{Ce(!!we||"invalid"===l.state)}),[we,l.state]);const Me=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)}},Pe=()=>"zip"===_?6:2e3,Se=e=>{const t=0!==R?R:Pe(),i=be,n=e.target.value;ve&&(!n.length||n.length>=i)&&ve(e),ie||n.length&&!(n.length>=i)||X(Y||"",e),le||![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},ze=e=>{e.preventDefault()},Ae=e=>{let t=e.target.value;const i=0!==R?R+1:Pe(),n=be;if(!le&&i>0&&t.length>=i&&(t=t.substring(0,i-1)),l.textControl||He(t),n&&t&&t.length<n)return;X(t,e),oe&&(Ee.current.style.height=`${Ee.current.scrollHeight}px`,t||(Ee.current.style.height=ae||"48px"));const r=V||d;if(!r||!h(r))return;const[o,a]=r(t,_,te);Ce(!o),Ie(l.errorMessage?l.errorMessage:a)},Fe=e=>{var t;l.skipFocus||Oe(!0),Me(null===(t=l.onFocus)||void 0===t?void 0:t.call(l,e))},Ke=e=>{var t;l.skipFocus||Oe(!1),Me(null===(t=l.onBlur)||void 0===t?void 0:t.call(l,e))},Ne=()=>{var n;return e(i,{children:["multiline"!==_&&t("input",{className:he?"truncate-class":"","data-test":l["data-test"],id:l.id,style:null!==(n=null==Be?void 0:Be.input)&&void 0!==n?n:{},ref:Ee,disabled:xe,type:["phonenumber","zip","number"].includes(_)?"number":_,value:Le,onFocus:e=>Fe(e),onBlur:e=>Ke(e),placeholder:A||"Enter here",onChange:Ae,onClick:e=>Me(l.onClick),onKeyDown:e=>Se(e)}),"multiline"===_&&t("textarea",{"data-test":l["data-test"],value:Le,ref:Ee,onFocus:e=>Fe(e),onBlur:e=>Ke(e),onClick:e=>Me(l.onClick),disabled:xe,placeholder:A||"Enter here",onChange:Ae,onKeyDown:e=>Se(e),maxLength:R>0?R:void 0})]})};return e(x,Object.assign({width:l.width,height:l.height,state:q,type:_,style:null!==(L=null==Be?void 0:Be.RootContainer)&&void 0!==L?L:{}},{children:[e("div",Object.assign({className:"flex-align-center"},{children:[!Z&&(!!W||!!we)&&e(f,Object.assign({invalid:!!we},{children:[!!we&&t(m,{width:16,height:16}),we||W]})),R>0&&"BOTTOM"===de&&e(y,Object.assign({position:"BOTTOM"},{children:[null!==(D=null===(H=(null!=Y?Y:"").toString())||void 0===H?void 0:H.length)&&void 0!==D?D:0,"/",R]}))]})),e(j,Object.assign({variant:$,state:q,width:l.width,isActive:"active"===q||Te,isInvalid:je,style:null!==(M=null!==(E=null==Be?void 0:Be.InputWrapper)&&void 0!==E?E:me)&&void 0!==M?M:{},version:ne,height:l.height,hightlightInputColor:ue,hideBorder:pe},{children:[!!fe&&t(C,Object.assign({variant:$,iconSize:ke,onClick:()=>Me(null==F?void 0:F.callback),isLeft:!0,style:null!==(P=null==Be?void 0:Be.IconHolder)&&void 0!==P?P:{}},{children:t(fe,{})})),!!U&&t(T,Object.assign({variant:$},{children:U})),"default"===$&&t(O,Object.assign({height:l.height,type:l.type,minHeight:ae,maxHeight:se,autoGrow:oe},{children:Ne()})),["x-small","small"].includes($)&&t(w,Object.assign({height:l.height,type:l.type},{children:Ne()})),!!ye&&t(C,Object.assign({variant:$,iconSize:ke,onClick:()=>Me(null==K?void 0:K.callback),isLeft:!1},{children:t(ye,{})})),!!Q&&t(I,Object.assign({variant:$},{children:Q})),J&&J.text&&t(c,{buttonText:J.text,onClick:()=>Me(null==J?void 0:J.onClick)}),J&&J.buttonProps&&t(c,Object.assign({},J.buttonProps))]})),!ge&&(!!N||!!R)&&e(k,Object.assign({invalid:je},{children:[re&&re,e("div",Object.assign({className:"label__container"},{children:[e(ce?v:g,{children:[N,G?t("span",{children:"*"}):""]}),l.tooltipText&&t(u,Object.assign({body:l.tooltipText,placement:"top"},{children:t("span",{children:t(n,{style:{marginTop:-3},width:18,height:18,color:je?p.content.negative:p.content.primary})})}))]})),R>0&&"TOP"===de&&e(y,{children:[null!==(z=null===(S=(null!=Y?Y:"").toString())||void 0===S?void 0:S.length)&&void 0!==z?z:0,"/",R]})]}))]}))}));B.displayName="Input";export{B as Input};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.685-beta.10",
3
+ "version": "0.0.685-beta.12",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",