@bikdotai/bik-component-library 0.0.750-beta.12 → 0.0.750-beta.14
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 t=require("react/jsx-runtime"),e=require("../../assets/icons/alert_triangle.svg.js"),o=require("../../assets/icons/check.svg.js"),n=require("../../assets/icons/cross.svg.js"),s=require("../../assets/icons/errorInfo.svg.js"),i=require("../../assets/icons/info.svg.js"),r=require("react"),l=require("react-dom"),u=require("react-toastify"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("../../assets/icons/alert_triangle.svg.js"),o=require("../../assets/icons/check.svg.js"),n=require("../../assets/icons/cross.svg.js"),s=require("../../assets/icons/errorInfo.svg.js"),i=require("../../assets/icons/info.svg.js"),r=require("react"),l=require("react-dom"),u=require("react-toastify"),c=require("../button/Button.js"),a=require("./Toaster.styled.js"),d=require("../TypographyStyle.js"),x=require("../../constants/Theme.js");function h(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var p=h(r),y=h(l);const g=e=>t.jsxs(d.BodySecondary,Object.assign({color:"#9E9E9E",customStyles:{fontWeight:600,fontSize:14,width:25}},{children:[e.duration,"s"]})),v=e=>{const o="default"===e.type?x.COLORS.content.primary:"success"===e.type?x.COLORS.content.positive:"error"===e.type?x.COLORS.content.negative:"warning"===e.type?x.COLORS.content.warning:x.COLORS.content.brand,{timerValue:s}=r.useContext(b),i=(!e.blocking||-1!==s)&&(e.blocking&&s>0);return t.jsx("div",Object.assign({tabIndex:i?-1:0,role:"button",style:{width:s>0?25:20,display:"flex",cursor:i?"not-allowed":"pointer",alignSelf:""+(e.alignTop?"flex-start":"center"),opacity:i?.5:1},onClick:()=>{!i&&e.closeToast&&e.closeToast()},onKeyDown:t=>{"Enter"===t.key&&!i&&e.closeToast&&e.closeToast()}},{children:s>0?t.jsx(g,{duration:s}):t.jsx(n.default,{height:20,width:20,color:o})}))},f=e=>{var o,n;const s=x.COLORS.content.placeholder,{toasterText:i}=r.useContext(b);return t.jsx(t.Fragment,{children:t.jsxs("div",Object.assign({style:{display:"flex",flexGrow:1}},{children:[t.jsx("div",Object.assign({style:{flexGrow:1,marginRight:32,display:"flex",alignItems:"center"}},{children:t.jsxs("div",{children:[e.subText?t.jsx(d.TitleSmall,Object.assign({color:"inherit"},{children:null!==(o=e.toastText)&&void 0!==o?o:i})):t.jsx(d.BodySecondary,Object.assign({color:"inherit"},{children:null!==(n=e.toastText)&&void 0!==n?n:i})),e.subText&&t.jsx("div",Object.assign({style:{marginTop:2}},{children:t.jsx(d.BodyCaption,Object.assign({color:x.COLORS.content.secondary},{children:e.subText}))}))]})})),e.showButton&&t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px",marginRight:{showSecondButton:4,showButton:0}[e.showSecondButton?"showSecondButton":"showButton"]}},{children:t.jsx(c.Button,{buttonText:e.buttonText,buttonType:"tertiaryGray",color:x.COLORS.content.secondary,onClick:e.onButtonClick})})),e.showSecondButton&&t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px"}},{children:t.jsx(c.Button,{buttonText:e.secondButtonText,buttonType:"tertiaryGray",color:x.COLORS.content.secondary,onClick:e.onSecondButtonClick})})),e.showButton||e.showSecondButton?t.jsx("div",{style:{height:28,alignSelf:"center",marginLeft:8,marginRight:8,borderRight:`1px solid ${s}`,borderRadius:1}}):null]}))})},b=p.default.createContext({toasterText:"",timerValue:-1});exports.Toaster=n=>{const l=r.useRef(n.toastId||"default-toast"),[c,d]=r.useState(n.text),[h,p]=r.useState(n.duration||-1),g=u.cssTransition({enter:"Toastify__slide-enter",exit:"Toastify__slide-exit"}),j="default"===n.type?null:"success"===n.type?t.jsx(o.default,{width:20,height:20,color:x.COLORS.content.positive}):"error"===n.type?t.jsx(s.default,{width:20,height:20,color:x.COLORS.content.negative}):"warning"===n.type?t.jsx(e.default,{width:20,height:20,color:x.COLORS.content.warning}):t.jsx(i.default,{width:20,height:20,color:x.COLORS.content.brand});r.useEffect((()=>{l.current&&l.current===n.toastId?(d(n.text),u.toast.update(l.current,{autoClose:n.autoClose})):l.current&&l.current!==n.toastId&&T(n.text)}),[n.toastId,n.text]),r.useEffect((()=>{if(!n.duration)return;p(n.duration);const t=setInterval((()=>{p((e=>{const o=e-1;return o<=0?(clearInterval(t),-1):o}))}),1e3);return()=>clearInterval(t)}),[n.duration,n.toastId]);const T=e=>{var o,s,i,r,c,a,d,x,h,p,y,b,T,B,C,O;void 0!==n.hideLeftIcon||n.leftIcon?u.toast(t.jsx(f,{toastText:e,type:n.type||"info",buttonText:null===(o=n.buttonProps)||void 0===o?void 0:o.buttonText,secondButtonText:null===(s=n.secondButtonProps)||void 0===s?void 0:s.buttonText,showButton:null===(i=n.buttonProps)||void 0===i?void 0:i.showButton,showSecondButton:null===(r=n.secondButtonProps)||void 0===r?void 0:r.showButton,onButtonClick:null===(c=n.buttonProps)||void 0===c?void 0:c.onButtonClick,onSecondButtonClick:null===(a=n.secondButtonProps)||void 0===a?void 0:a.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),icon:!0!==n.hideLeftIcon&&(n.leftIcon?n.leftIcon:"default"!==n.type&&t.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:j}))),type:n.type,closeButton:t.jsx(v,{type:n.type||"default",alignTop:!(!n.subText||(null===(d=n.buttonProps)||void 0===d?void 0:d.showButton)||(null===(x=n.secondButtonProps)||void 0===x?void 0:x.showButton)),blocking:n.blocking}),toastId:n.toastId||"default-toast",transition:g}):l.current=u.toast(t.jsx(f,{toastText:e,type:n.type||"info",buttonText:null===(h=n.buttonProps)||void 0===h?void 0:h.buttonText,secondButtonText:null===(p=n.secondButtonProps)||void 0===p?void 0:p.buttonText,showButton:null===(y=n.buttonProps)||void 0===y?void 0:y.showButton,showSecondButton:null===(b=n.secondButtonProps)||void 0===b?void 0:b.showButton,onButtonClick:null===(T=n.buttonProps)||void 0===T?void 0:T.onButtonClick,onSecondButtonClick:null===(B=n.secondButtonProps)||void 0===B?void 0:B.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),type:n.type,icon:"default"!==n.type&&t.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:j})),closeButton:t.jsx(v,{type:n.type||"default",alignTop:!(!n.subText||(null===(C=n.buttonProps)||void 0===C?void 0:C.showButton)||(null===(O=n.secondButtonProps)||void 0===O?void 0:O.showButton)),blocking:n.blocking}),toastId:n.toastId||"default-toast",transition:g})};return r.useEffect((()=>{T()}),[]),y.default.createPortal(t.jsx(a.ToasterStyled,Object.assign({width:n.width,height:n.height,zIndex:n.zIndex,isSubTextIncluded:!!n.subText,type:n.type},{children:t.jsx(b.Provider,Object.assign({value:{toasterText:c,timerValue:h}},{children:t.jsx(u.ToastContainer,{position:n.position||"top-right",closeOnClick:n.closeOnClick||!1,hideProgressBar:n.hideProgressBar||!1,draggable:!1,autoClose:n.autoClose||!1,theme:"colored"})}))})),document.body)};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as t,Fragment as o,jsxs as e}from"react/jsx-runtime";import n from"../../assets/icons/alert_triangle.svg.js";import s from"../../assets/icons/check.svg.js";import i from"../../assets/icons/cross.svg.js";import r from"../../assets/icons/errorInfo.svg.js";import l from"../../assets/icons/info.svg.js";import c,{useRef as d,useState as a,useEffect as u,useContext as p}from"react";import h from"react-dom";import{cssTransition as g,toast as y,ToastContainer as v}from"react-toastify";import{Button as x}from"../button/Button.js";import{ToasterStyled as b}from"./Toaster.styled.js";import{TitleSmall as f,BodySecondary as T,BodyCaption as B}from"../TypographyStyle.js";import{COLORS as m}from"../../constants/Theme.js";const w=t=>e(T,Object.assign({color:"#9E9E9E",customStyles:{fontWeight:600,fontSize:14,width:25}},{children:[t.duration,"s"]})),C=o=>{const e="default"===o.type?m.content.primary:"success"===o.type?m.content.positive:"error"===o.type?m.content.negative:"warning"===o.type?m.content.warning:m.content.brand,{timerValue:n}=p(k),s=(!o.blocking||-1!==n)&&(o.blocking&&n>0);return t("div",Object.assign({tabIndex:s?-1:0,role:"button",style:{width:n>0?25:20,display:"flex",cursor:s?"not-allowed":"pointer",alignSelf:""+(o.alignTop?"flex-start":"center"),opacity:s?.5:1},onClick:()=>{!s&&o.closeToast&&o.closeToast()},onKeyDown:t=>{"Enter"===t.key&&!s&&o.closeToast&&o.closeToast()}},{children:n>0?t(w,{duration:n}):t(i,{height:20,width:20,color:e})}))},I=n=>{var s,i;const r=m.content.placeholder,{toasterText:l}=p(k);return t(o,{children:e("div",Object.assign({style:{display:"flex",flexGrow:1}},{children:[t("div",Object.assign({style:{flexGrow:1,marginRight:32,display:"flex",alignItems:"center"}},{children:e("div",{children:[n.subText?t(f,Object.assign({color:"inherit"},{children:null!==(s=n.toastText)&&void 0!==s?s:l})):t(T,Object.assign({color:"inherit"},{children:null!==(i=n.toastText)&&void 0!==i?i:l})),n.subText&&t("div",Object.assign({style:{marginTop:2}},{children:t(B,Object.assign({color:m.content.secondary},{children:n.subText}))}))]})})),n.showButton&&t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px",marginRight:{showSecondButton:4,showButton:0}[n.showSecondButton?"showSecondButton":"showButton"]}},{children:t(x,{buttonText:n.buttonText,buttonType:"tertiaryGray",color:m.content.secondary,onClick:n.onButtonClick})})),n.showSecondButton&&t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px"}},{children:t(x,{buttonText:n.secondButtonText,buttonType:"tertiaryGray",color:m.content.secondary,onClick:n.onSecondButtonClick})})),n.showButton||n.showSecondButton?t("div",{style:{height:28,alignSelf:"center",marginLeft:8,marginRight:8,borderRight:`1px solid ${r}`,borderRadius:1}}):null]}))})},j=o=>{const e=d(o.toastId||"default-toast"),[i,c]=a(o.text),[p,x]=a(o.duration||-1),f=g({enter:"Toastify__slide-enter",exit:"Toastify__slide-exit"}),T="default"===o.type?null:"success"===o.type?t(s,{width:20,height:20,color:m.content.positive}):"error"===o.type?t(r,{width:20,height:20,color:m.content.negative}):"warning"===o.type?t(n,{width:20,height:20,color:m.content.warning}):t(l,{width:20,height:20,color:m.content.brand});u((()=>{e.current&&e.current===o.toastId?(c(o.text),y.update(e.current,{autoClose:o.autoClose})):e.current&&e.current!==o.toastId&&B(o.text)}),[o.toastId,o.text]),u((()=>{if(!o.duration)return;x(o.duration);const t=setInterval((()=>{x((o=>{const e=o-1;return e<=0?(clearInterval(t),-1):e}))}),1e3);return()=>clearInterval(t)}),[o.duration,o.toastId]);const B=n=>{var s,i,r,l,c,d,a,u,p,h,g,v,x,b,B,m;void 0!==o.hideLeftIcon||o.leftIcon?y(t(I,{toastText:n,type:o.type||"info",buttonText:null===(s=o.buttonProps)||void 0===s?void 0:s.buttonText,secondButtonText:null===(i=o.secondButtonProps)||void 0===i?void 0:i.buttonText,showButton:null===(r=o.buttonProps)||void 0===r?void 0:r.showButton,showSecondButton:null===(l=o.secondButtonProps)||void 0===l?void 0:l.showButton,onButtonClick:null===(c=o.buttonProps)||void 0===c?void 0:c.onButtonClick,onSecondButtonClick:null===(d=o.secondButtonProps)||void 0===d?void 0:d.onButtonClick,subText:o.subText}),{onClose:o.onCloseToast?o.onCloseToast:()=>({}),icon:!0!==o.hideLeftIcon&&(o.leftIcon?o.leftIcon:"default"!==o.type&&t("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:T}))),type:o.type,closeButton:t(C,{type:o.type||"default",alignTop:!(!o.subText||(null===(a=o.buttonProps)||void 0===a?void 0:a.showButton)||(null===(u=o.secondButtonProps)||void 0===u?void 0:u.showButton)),blocking:o.blocking}),toastId:o.toastId||"default-toast",transition:f}):e.current=y(t(I,{toastText:n,type:o.type||"info",buttonText:null===(p=o.buttonProps)||void 0===p?void 0:p.buttonText,secondButtonText:null===(h=o.secondButtonProps)||void 0===h?void 0:h.buttonText,showButton:null===(g=o.buttonProps)||void 0===g?void 0:g.showButton,showSecondButton:null===(v=o.secondButtonProps)||void 0===v?void 0:v.showButton,onButtonClick:null===(x=o.buttonProps)||void 0===x?void 0:x.onButtonClick,onSecondButtonClick:null===(b=o.secondButtonProps)||void 0===b?void 0:b.onButtonClick,subText:o.subText}),{onClose:o.onCloseToast?o.onCloseToast:()=>({}),type:o.type,icon:"default"!==o.type&&t("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:T})),closeButton:t(C,{type:o.type||"default",alignTop:!(!o.subText||(null===(B=o.buttonProps)||void 0===B?void 0:B.showButton)||(null===(m=o.secondButtonProps)||void 0===m?void 0:m.showButton)),blocking:o.blocking}),toastId:o.toastId||"default-toast",transition:f})};return u((()=>{B()}),[]),h.createPortal(t(b,Object.assign({width:o.width,height:o.height,zIndex:o.zIndex,isSubTextIncluded:!!o.subText,type:o.type},{children:t(k.Provider,Object.assign({value:{toasterText:i,timerValue:p}},{children:t(v,{position:o.position||"top-right",closeOnClick:o.closeOnClick||!1,hideProgressBar:o.hideProgressBar||!1,draggable:!1,autoClose
|
|
1
|
+
import{jsx as t,Fragment as o,jsxs as e}from"react/jsx-runtime";import n from"../../assets/icons/alert_triangle.svg.js";import s from"../../assets/icons/check.svg.js";import i from"../../assets/icons/cross.svg.js";import r from"../../assets/icons/errorInfo.svg.js";import l from"../../assets/icons/info.svg.js";import c,{useRef as d,useState as a,useEffect as u,useContext as p}from"react";import h from"react-dom";import{cssTransition as g,toast as y,ToastContainer as v}from"react-toastify";import{Button as x}from"../button/Button.js";import{ToasterStyled as b}from"./Toaster.styled.js";import{TitleSmall as f,BodySecondary as T,BodyCaption as B}from"../TypographyStyle.js";import{COLORS as m}from"../../constants/Theme.js";const w=t=>e(T,Object.assign({color:"#9E9E9E",customStyles:{fontWeight:600,fontSize:14,width:25}},{children:[t.duration,"s"]})),C=o=>{const e="default"===o.type?m.content.primary:"success"===o.type?m.content.positive:"error"===o.type?m.content.negative:"warning"===o.type?m.content.warning:m.content.brand,{timerValue:n}=p(k),s=(!o.blocking||-1!==n)&&(o.blocking&&n>0);return t("div",Object.assign({tabIndex:s?-1:0,role:"button",style:{width:n>0?25:20,display:"flex",cursor:s?"not-allowed":"pointer",alignSelf:""+(o.alignTop?"flex-start":"center"),opacity:s?.5:1},onClick:()=>{!s&&o.closeToast&&o.closeToast()},onKeyDown:t=>{"Enter"===t.key&&!s&&o.closeToast&&o.closeToast()}},{children:n>0?t(w,{duration:n}):t(i,{height:20,width:20,color:e})}))},I=n=>{var s,i;const r=m.content.placeholder,{toasterText:l}=p(k);return t(o,{children:e("div",Object.assign({style:{display:"flex",flexGrow:1}},{children:[t("div",Object.assign({style:{flexGrow:1,marginRight:32,display:"flex",alignItems:"center"}},{children:e("div",{children:[n.subText?t(f,Object.assign({color:"inherit"},{children:null!==(s=n.toastText)&&void 0!==s?s:l})):t(T,Object.assign({color:"inherit"},{children:null!==(i=n.toastText)&&void 0!==i?i:l})),n.subText&&t("div",Object.assign({style:{marginTop:2}},{children:t(B,Object.assign({color:m.content.secondary},{children:n.subText}))}))]})})),n.showButton&&t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px",marginRight:{showSecondButton:4,showButton:0}[n.showSecondButton?"showSecondButton":"showButton"]}},{children:t(x,{buttonText:n.buttonText,buttonType:"tertiaryGray",color:m.content.secondary,onClick:n.onButtonClick})})),n.showSecondButton&&t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px"}},{children:t(x,{buttonText:n.secondButtonText,buttonType:"tertiaryGray",color:m.content.secondary,onClick:n.onSecondButtonClick})})),n.showButton||n.showSecondButton?t("div",{style:{height:28,alignSelf:"center",marginLeft:8,marginRight:8,borderRight:`1px solid ${r}`,borderRadius:1}}):null]}))})},j=o=>{const e=d(o.toastId||"default-toast"),[i,c]=a(o.text),[p,x]=a(o.duration||-1),f=g({enter:"Toastify__slide-enter",exit:"Toastify__slide-exit"}),T="default"===o.type?null:"success"===o.type?t(s,{width:20,height:20,color:m.content.positive}):"error"===o.type?t(r,{width:20,height:20,color:m.content.negative}):"warning"===o.type?t(n,{width:20,height:20,color:m.content.warning}):t(l,{width:20,height:20,color:m.content.brand});u((()=>{e.current&&e.current===o.toastId?(c(o.text),y.update(e.current,{autoClose:o.autoClose})):e.current&&e.current!==o.toastId&&B(o.text)}),[o.toastId,o.text]),u((()=>{if(!o.duration)return;x(o.duration);const t=setInterval((()=>{x((o=>{const e=o-1;return e<=0?(clearInterval(t),-1):e}))}),1e3);return()=>clearInterval(t)}),[o.duration,o.toastId]);const B=n=>{var s,i,r,l,c,d,a,u,p,h,g,v,x,b,B,m;void 0!==o.hideLeftIcon||o.leftIcon?y(t(I,{toastText:n,type:o.type||"info",buttonText:null===(s=o.buttonProps)||void 0===s?void 0:s.buttonText,secondButtonText:null===(i=o.secondButtonProps)||void 0===i?void 0:i.buttonText,showButton:null===(r=o.buttonProps)||void 0===r?void 0:r.showButton,showSecondButton:null===(l=o.secondButtonProps)||void 0===l?void 0:l.showButton,onButtonClick:null===(c=o.buttonProps)||void 0===c?void 0:c.onButtonClick,onSecondButtonClick:null===(d=o.secondButtonProps)||void 0===d?void 0:d.onButtonClick,subText:o.subText}),{onClose:o.onCloseToast?o.onCloseToast:()=>({}),icon:!0!==o.hideLeftIcon&&(o.leftIcon?o.leftIcon:"default"!==o.type&&t("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:T}))),type:o.type,closeButton:t(C,{type:o.type||"default",alignTop:!(!o.subText||(null===(a=o.buttonProps)||void 0===a?void 0:a.showButton)||(null===(u=o.secondButtonProps)||void 0===u?void 0:u.showButton)),blocking:o.blocking}),toastId:o.toastId||"default-toast",transition:f}):e.current=y(t(I,{toastText:n,type:o.type||"info",buttonText:null===(p=o.buttonProps)||void 0===p?void 0:p.buttonText,secondButtonText:null===(h=o.secondButtonProps)||void 0===h?void 0:h.buttonText,showButton:null===(g=o.buttonProps)||void 0===g?void 0:g.showButton,showSecondButton:null===(v=o.secondButtonProps)||void 0===v?void 0:v.showButton,onButtonClick:null===(x=o.buttonProps)||void 0===x?void 0:x.onButtonClick,onSecondButtonClick:null===(b=o.secondButtonProps)||void 0===b?void 0:b.onButtonClick,subText:o.subText}),{onClose:o.onCloseToast?o.onCloseToast:()=>({}),type:o.type,icon:"default"!==o.type&&t("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:T})),closeButton:t(C,{type:o.type||"default",alignTop:!(!o.subText||(null===(B=o.buttonProps)||void 0===B?void 0:B.showButton)||(null===(m=o.secondButtonProps)||void 0===m?void 0:m.showButton)),blocking:o.blocking}),toastId:o.toastId||"default-toast",transition:f})};return u((()=>{B()}),[]),h.createPortal(t(b,Object.assign({width:o.width,height:o.height,zIndex:o.zIndex,isSubTextIncluded:!!o.subText,type:o.type},{children:t(k.Provider,Object.assign({value:{toasterText:i,timerValue:p}},{children:t(v,{position:o.position||"top-right",closeOnClick:o.closeOnClick||!1,hideProgressBar:o.hideProgressBar||!1,draggable:!1,autoClose:o.autoClose||!1,theme:"colored"})}))})),document.body)},k=c.createContext({toasterText:"",timerValue:-1});export{j as Toaster};
|