@bikdotai/bik-component-library 0.0.596 → 0.0.597

package/dist/cjs/assets/icons/retryIcon.svg.js

@@ -0,0 +1 @@
+"use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}Object.defineProperty(exports,"__esModule",{value:!0});var t,r,n=e(require("react"));function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},a.apply(this,arguments)}var l=e=>n.createElement("svg",a({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 64 64"},e),t||(t=n.createElement("rect",{width:64,height:64,fill:"#1A872C",rx:32})),r||(r=n.createElement("path",{fill:"#fff",d:"M41.012 14.51a1.667 1.667 0 0 0-2.971-.167l-1.873 3.244c-6.476-1.878-13.635.813-17.157 6.913-4.143 7.174-1.684 16.348 5.49 20.49 7.174 4.143 16.348 1.684 20.49-5.49a14.938 14.938 0 0 0 2.012-7.501 1.667 1.667 0 1 0-3.333.003 11.606 11.606 0 0 1-1.566 5.831c-3.221 5.58-10.356 7.492-15.936 4.27-5.58-3.221-7.492-10.356-4.27-15.936 2.593-4.493 7.724-6.608 12.538-5.58l-1.11 1.92a1.667 1.667 0 0 0 1.632 2.49l7.883-.892a1.667 1.667 0 0 0 1.34-2.322l-3.169-7.273Z"})));exports.default=l;

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),n=require("../../utils/DateUtils.js"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/arrow_down.svg.js"),l=require("../../assets/icons/arrow_up.svg.js"),a=require("../../assets/icons/info.svg.js"),o=require("../tag/Tag.js"),c=require("../tooltips/Tooltip.js"),d=require("../TypographyStyle.js"),g=require("./chart/utils/calcPercentage.js"),u=require("./CommonStyles.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var y=h(t);const m=i=>{let{percent:a,direction:o,timeline:c,customRange:u,trendRaw:h,prefixSymbol:y,trendIconStyle:m}=i;const p="negative"===o?s.default:l.default,j="negative"===o?r.COLORS.background.negative.vibrant:"positive"===o?r.COLORS.background.positive.vibrant:r.COLORS.content.placeholder,x=t.useRef("today"===c?"vs yesterday":"yesterday"===c?"vs 1 day before":"7 days"===c?"vs last 7 days":"30 days"===c?"vs last 30 days":"custom"===c&&u?n.default.getAnalyticsCustomDateTimelineText(u):""),b=t.useRef((()=>{const e=((null!=h?h:0)>0?"+":"")+(null!=y?y:"");return void 0===h?"--":`${null!=e?e:""}${g.truncateValueTo10K(h)}`})());return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof a&&e.jsx(p,{color:j,height:16,width:16,style:Object.assign({marginRight:2},null!=m?m:{})}),"number"==typeof a&&o&&e.jsxs(d.Caption,Object.assign({style:{color:j}},{children:["neutral"===o?0:a<1e3?a:">999","%"]})),!!h&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`(${b.current})`})),c&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:x.current}))]}))};exports.AnalyticsTrend=t=>{let{title:n,value:s,trendPercent:l,type:h="horizontal",timeline:p,customRange:j,tooltip:x,card:b=!0,rightSeparator:f=!1,size:O="big",share:v=!1,formatVal:S,prefixSymbol:T,trailingIcon:C,onTrailIconClick:R,iconTooltipBody:w,funnelPercent:$,isLoading:L,trendRaw:q,suffixText:I,trendStyle:D,trendContainerStyle:M,trendIconStyle:k,containerStyle:P,prevTrendDiff:z,relativePercentageDiff:F}=t;const _="big"===O?d.TitleLarge:d.TitleMedium,A=void 0!==l?l<0?"negative":0===l?"neutral":"positive":void 0,N=void 0!==l?v?Math.round(l):Math.abs(Math.round(l)):void 0;return e.jsx(u.AnalyticsTrendContainer,Object.assign({card:b,style:Object.assign({},P)},{children:e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:4,borderRightWidth:f?1:0,borderRightColor:r.COLORS.stroke.primary,borderRightStyle:"solid",paddingLeft:b?0:24,paddingRight:b?0:24,height:"100%",justifyContent:"space-between",alignItems:"center"},null!=M?M:{})},{children:[e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=D?D:{})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsx(d.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:n})),x&&e.jsx(c.Tooltip,Object.assign({body:x,placement:"right",width:300},{children:e.jsx("div",Object.assign({style:{display:"flex",alignItems:"center",cursor:"pointer"}},{children:e.jsx(a.default,{color:r.COLORS.content.primary,height:16,width:16})}))}))]})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},v?{justifyContent:"space-between"}:{})},{children:[L&&e.jsx(i.ShimmerComponentStyled,{width:108,height:26}),!L&&e.jsx(_,Object.assign({style:{color:r.COLORS.content.primary}},{children:void 0===s?"--":"number"==typeof s&&S?s>9999?`${null!=T?T:""}${g.truncateValueTo10K(s)} ${null!=I?I:""}`:`${null!=T?T:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(s)} ${null!=I?I:""}`:`${null!=T?T:""}${s} ${null!=I?I:""}`})),"number"==typeof F&&e.jsx(o.Tag,{tagText:`${F}%`,theme:"light",type:"neutral"}),"horizontal"===h&&!L&&!v&&e.jsx(m,{timeline:p,customRange:j,percent:N,direction:A,trendRaw:q,prefixSymbol:T,trendIconStyle:k}),L&&!v&&"horizontal"===h&&e.jsx(i.ShimmerComponentStyled,{height:20,width:141,marginTop:6}),"vertical"===h&&!L&&void 0!==$&&e.jsx(o.Tag,{tagText:`${$} %`,theme:"light",type:"neutral"}),v&&!L&&void 0!==N&&e.jsx(o.Tag,{tagText:`${N} %`,theme:"light",type:"neutral"}),v||L||!z||0==z?e.jsx(e.Fragment,{}):e.jsx(o.Tag,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(z),theme:"light",type:"neutral"})]})),"vertical"===h&&!L&&!v&&e.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsx(m,{timeline:p,customRange:j,percent:N,direction:A,trendRaw:q,prefixSymbol:T,trendIconStyle:k})})),L&&"vertical"===h&&e.jsx(i.ShimmerComponentStyled,{height:20,width:141,marginTop:6})]})),w&&!L&&e.jsx(c.Tooltip,Object.assign({body:w,placement:"right"},{children:C&&e.jsx("div",Object.assign({className:"icon--holder",onClick:R},{children:y.default.createElement(C,{height:20,width:20,color:r.COLORS.content.secondary})}))}))]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),n=require("../../utils/DateUtils.js"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/arrow_down.svg.js"),l=require("../../assets/icons/arrow_up.svg.js"),a=require("../../assets/icons/info.svg.js"),o=require("../tag/Tag.js"),c=require("../tooltips/Tooltip.js"),d=require("../TypographyStyle.js"),g=require("./chart/utils/calcPercentage.js"),u=require("./CommonStyles.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var y=h(t);const m=i=>{let{percent:a,direction:o,timeline:c,customRange:u,trendRaw:h,prefixSymbol:y,trendIconStyle:m}=i;const p="negative"===o?s.default:l.default,j="negative"===o?r.COLORS.background.negative.vibrant:"positive"===o?r.COLORS.background.positive.vibrant:r.COLORS.content.placeholder,[x,f]=t.useState("");t.useEffect((()=>{f("today"===c?"vs yesterday":"yesterday"===c?"vs 1 day before":"7 days"===c?"vs last 7 days":"30 days"===c?"vs last 30 days":"custom"===c&&u?n.default.getAnalyticsCustomDateTimelineText(u):"")}),[c,u]);const b=t.useRef((()=>{const e=((null!=h?h:0)>0?"+":"")+(null!=y?y:"");return void 0===h?"--":`${null!=e?e:""}${g.truncateValueTo10K(h)}`})());return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof a&&e.jsx(p,{color:j,height:16,width:16,style:Object.assign({marginRight:2},null!=m?m:{})}),"number"==typeof a&&o&&e.jsxs(d.Caption,Object.assign({style:{color:j}},{children:["neutral"===o?0:a<1e3?a:">999","%"]})),!!h&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`(${b.current})`})),c&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:x}))]}))};exports.AnalyticsTrend=t=>{let{title:n,value:s,trendPercent:l,type:h="horizontal",timeline:p,customRange:j,tooltip:x,card:f=!0,rightSeparator:b=!1,size:O="big",share:v=!1,formatVal:S,prefixSymbol:T,trailingIcon:C,onTrailIconClick:R,iconTooltipBody:w,funnelPercent:$,isLoading:L,trendRaw:q,suffixText:I,trendStyle:D,trendContainerStyle:M,trendIconStyle:k,containerStyle:P,prevTrendDiff:z,relativePercentageDiff:F}=t;const _="big"===O?d.TitleLarge:d.TitleMedium,A=void 0!==l?l<0?"negative":0===l?"neutral":"positive":void 0,N=void 0!==l?v?Math.round(l):Math.abs(Math.round(l)):void 0;return e.jsx(u.AnalyticsTrendContainer,Object.assign({card:f,style:Object.assign({},P)},{children:e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:4,borderRightWidth:b?1:0,borderRightColor:r.COLORS.stroke.primary,borderRightStyle:"solid",paddingLeft:f?0:24,paddingRight:f?0:24,height:"100%",justifyContent:"space-between",alignItems:"center"},null!=M?M:{})},{children:[e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=D?D:{})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsx(d.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:n})),x&&e.jsx(c.Tooltip,Object.assign({body:x,placement:"right",width:300},{children:e.jsx("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e.jsx(a.default,{color:r.COLORS.content.primary,height:16,width:16})}))}))]})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},v?{justifyContent:"space-between"}:{})},{children:[L&&e.jsx(i.ShimmerComponentStyled,{width:108,height:26}),!L&&e.jsx(_,Object.assign({style:{color:r.COLORS.content.primary}},{children:void 0===s?"--":"number"==typeof s&&S?s>9999?`${null!=T?T:""}${g.truncateValueTo10K(s)} ${null!=I?I:""}`:`${null!=T?T:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(s)} ${null!=I?I:""}`:`${null!=T?T:""}${s} ${null!=I?I:""}`})),"number"==typeof F&&e.jsx(o.Tag,{tagText:`${F}%`,theme:"light",type:"neutral"}),"horizontal"===h&&!L&&!v&&e.jsx(m,{timeline:p,customRange:j,percent:N,direction:A,trendRaw:q,prefixSymbol:T,trendIconStyle:k}),L&&!v&&"horizontal"===h&&e.jsx(i.ShimmerComponentStyled,{height:20,width:141,marginTop:6}),"vertical"===h&&!L&&void 0!==$&&e.jsx(o.Tag,{tagText:`${$} %`,theme:"light",type:"neutral"}),v&&!L&&void 0!==N&&e.jsx(o.Tag,{tagText:`${N} %`,theme:"light",type:"neutral"}),v||L||!z||0==z?e.jsx(e.Fragment,{}):e.jsx(o.Tag,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(z),theme:"light",type:"neutral"})]})),"vertical"===h&&!L&&!v&&e.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsx(m,{timeline:p,customRange:j,percent:N,direction:A,trendRaw:q,prefixSymbol:T,trendIconStyle:k})})),L&&"vertical"===h&&e.jsx(i.ShimmerComponentStyled,{height:20,width:141,marginTop:6})]})),w&&!L&&e.jsx(c.Tooltip,Object.assign({body:w,placement:"right"},{children:C&&e.jsx("div",Object.assign({className:"icon--holder",onClick:R},{children:y.default.createElement(C,{height:20,width:20,color:r.COLORS.content.secondary})}))}))]}))}))};

package/dist/cjs/components/states/StateComponent.d.ts

@@ -5,7 +5,8 @@ export declare enum StateInterface {
     SUCCESS = "success",
     ERROR = "error",
     WARNING = "warning",
-    LOADING = "loading"
+    LOADING = "loading",
+    RETRY = "retry"
 }
 export declare enum ButtonActions {
     CANCEL = "cancel",
@@ -33,5 +34,6 @@ export type StateComponentProps = {
     iconHeight?: number;
     iconWidth?: number;
     closeButtonType?: Type;
+    secondaryButtonText?: string;
 };
 export declare const StateComponent: React.FC<React.PropsWithChildren<StateComponentProps>>;

package/dist/cjs/components/states/StateComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t,n,s=require("react/jsx-runtime"),o=require("../../constants/Theme.js"),r=require("../../assets/icons/errorIcon.svg.js"),i=require("../../assets/icons/successIcon.svg.js"),c=require("../../assets/icons/warningIcon.svg.js"),a=require("../button/Button.js"),u=require("../spinner/Spinner.js"),d=require("../TypographyStyle.js"),l=require("./StateComponent.styled.js");exports.StateInterface=void 0,(e=exports.StateInterface||(exports.StateInterface={})).SUCCESS="success",e.ERROR="error",e.WARNING="warning",e.LOADING="loading",exports.ButtonActions=void 0,(t=exports.ButtonActions||(exports.ButtonActions={})).CANCEL="cancel",t.OTHER="other",exports.ButtonTypes=void 0,(n=exports.ButtonTypes||(exports.ButtonTypes={})).SINGLE="SINGLE",n.DOUBLE="DOUBLE";exports.StateComponent=e=>{var t;const n=()=>x==exports.StateInterface.SUCCESS?s.jsx(i.default,{}):x==exports.StateInterface.WARNING?s.jsx(c.default,{}):x==exports.StateInterface.ERROR?s.jsx(r.default,{}):x===exports.StateInterface.LOADING?s.jsx(u.Spinner,{size:"large"}):void 0,{states:x,heading:p,subline:j,icon:S=n(),isButtonEnabled:h,type:g,buttonText:y,buttonType:B,onButtonClick:I,leadingIcon:L,width:O,headerImage:C,iconWidth:b,iconHeight:T,closeButtonType:A}=e;return s.jsxs(l.StateComponentContainer,Object.assign({width:O},{children:[s.jsx(l.StateIcon,Object.assign({iconWidth:b,iconHeight:T},{children:C?s.jsx("img",{src:C,width:"100%",height:"auto",alt:""}):S})),s.jsxs(l.StateHeading,Object.assign({size:e.size},{children:["SMALL"===e.size&&s.jsx(d.TitleRegular,{children:p}),"SMALL"!==e.size&&s.jsx(d.TitleMedium,{children:p})]})),s.jsxs(l.StateSubline,{children:["SMALL"!==e.size&&s.jsx(d.BodyPrimary,Object.assign({color:o.COLORS.content.secondary},{children:j})),"SMALL"===e.size&&s.jsx(d.BodySecondary,Object.assign({color:o.COLORS.content.secondary},{children:j}))]}),null!==(t=e.children)&&void 0!==t?t:s.jsx(s.Fragment,{}),h&&s.jsx(s.Fragment,{children:s.jsxs(l.ButtonContainer,Object.assign({size:e.size},{children:[g==exports.ButtonTypes.DOUBLE&&s.jsx(a.Button,{onClick:()=>I&&I(exports.ButtonActions.CANCEL),buttonType:A||"secondary",buttonText:"Cancel",matchParentWidth:!0}),s.jsx(a.Button,{onClick:()=>I&&I(exports.ButtonActions.OTHER),buttonType:null!=B?B:"primary",LeadingIcon:L,buttonText:null!=y?y:"Retry",matchParentWidth:!0})]}))})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t,s,n=require("react/jsx-runtime"),r=require("../../constants/Theme.js"),o=require("../../assets/icons/errorIcon.svg.js"),i=require("../../assets/icons/retryIcon.svg.js"),a=require("../../assets/icons/successIcon.svg.js"),c=require("../../assets/icons/warningIcon.svg.js"),u=require("../button/Button.js"),d=require("../spinner/Spinner.js"),l=require("../TypographyStyle.js"),x=require("./StateComponent.styled.js");exports.StateInterface=void 0,(e=exports.StateInterface||(exports.StateInterface={})).SUCCESS="success",e.ERROR="error",e.WARNING="warning",e.LOADING="loading",e.RETRY="retry",exports.ButtonActions=void 0,(t=exports.ButtonActions||(exports.ButtonActions={})).CANCEL="cancel",t.OTHER="other",exports.ButtonTypes=void 0,(s=exports.ButtonTypes||(exports.ButtonTypes={})).SINGLE="SINGLE",s.DOUBLE="DOUBLE";exports.StateComponent=e=>{var t;const s=()=>p==exports.StateInterface.SUCCESS?n.jsx(a.default,{}):p==exports.StateInterface.WARNING?n.jsx(c.default,{}):p==exports.StateInterface.ERROR?n.jsx(o.default,{}):p===exports.StateInterface.LOADING?n.jsx(d.Spinner,{size:"large"}):p===exports.StateInterface.RETRY?n.jsx(i.default,{}):void 0,{states:p,heading:j,subline:S,icon:h=s(),isButtonEnabled:g,type:y,buttonText:B,buttonType:I,onButtonClick:L,leadingIcon:O,width:T,headerImage:C,iconWidth:R,iconHeight:b,closeButtonType:E,secondaryButtonText:A}=e;return n.jsxs(x.StateComponentContainer,Object.assign({width:T},{children:[n.jsx(x.StateIcon,Object.assign({iconWidth:R,iconHeight:b},{children:C?n.jsx("img",{src:C,width:"100%",height:"auto",alt:""}):h})),n.jsxs(x.StateHeading,Object.assign({size:e.size},{children:["SMALL"===e.size&&n.jsx(l.TitleRegular,{children:j}),"SMALL"!==e.size&&n.jsx(l.TitleMedium,{children:j})]})),n.jsxs(x.StateSubline,{children:["SMALL"!==e.size&&n.jsx(l.BodyPrimary,Object.assign({color:r.COLORS.content.secondary},{children:S})),"SMALL"===e.size&&n.jsx(l.BodySecondary,Object.assign({color:r.COLORS.content.secondary},{children:S}))]}),null!==(t=e.children)&&void 0!==t?t:n.jsx(n.Fragment,{}),g&&n.jsx(n.Fragment,{children:n.jsxs(x.ButtonContainer,Object.assign({size:e.size},{children:[y==exports.ButtonTypes.DOUBLE&&n.jsx(u.Button,{onClick:()=>L&&L(exports.ButtonActions.CANCEL),buttonType:E||"secondary",buttonText:A||"Cancel",matchParentWidth:!0}),n.jsx(u.Button,{onClick:()=>L&&L(exports.ButtonActions.OTHER),buttonType:null!=I?I:"primary",LeadingIcon:O,buttonText:null!=B?B:"Retry",matchParentWidth:!0})]}))})]}))};

package/dist/esm/assets/icons/retryIcon.svg.js

@@ -0,0 +1 @@
+import*as t from"react";var e,r;function a(){return a=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(t[a]=r[a])}return t},a.apply(this,arguments)}var l=l=>t.createElement("svg",a({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 64 64"},l),e||(e=t.createElement("rect",{width:64,height:64,fill:"#1A872C",rx:32})),r||(r=t.createElement("path",{fill:"#fff",d:"M41.012 14.51a1.667 1.667 0 0 0-2.971-.167l-1.873 3.244c-6.476-1.878-13.635.813-17.157 6.913-4.143 7.174-1.684 16.348 5.49 20.49 7.174 4.143 16.348 1.684 20.49-5.49a14.938 14.938 0 0 0 2.012-7.501 1.667 1.667 0 1 0-3.333.003 11.606 11.606 0 0 1-1.566 5.831c-3.221 5.58-10.356 7.492-15.936 4.27-5.58-3.221-7.492-10.356-4.27-15.936 2.593-4.493 7.724-6.608 12.538-5.58l-1.11 1.92a1.667 1.667 0 0 0 1.632 2.49l7.883-.892a1.667 1.667 0 0 0 1.34-2.322l-3.169-7.273Z"})));export{l as default};

package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsTrend.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import n,{useRef as r}from"react";import{ShimmerComponentStyled as o}from"../shimmer/ShimmerComponent/ShimmerStyled.js";import l from"../../utils/DateUtils.js";import{COLORS as s}from"../../constants/Theme.js";import a from"../../assets/icons/arrow_down.svg.js";import c from"../../assets/icons/arrow_up.svg.js";import d from"../../assets/icons/info.svg.js";import{Tag as g}from"../tag/Tag.js";import{Tooltip as m}from"../tooltips/Tooltip.js";import{BodyCaption as h,Caption as p,TitleLarge as y,TitleMedium as u}from"../TypographyStyle.js";import{truncateValueTo10K as f}from"./chart/utils/calcPercentage.js";import{AnalyticsTrendContainer as b}from"./CommonStyles.js";const v=r=>{let{title:l,value:a,trendPercent:c,type:p="horizontal",timeline:v,customRange:x,tooltip:w,card:O=!0,rightSeparator:S=!1,size:T="big",share:$=!1,formatVal:I,prefixSymbol:R,trailingIcon:D,onTrailIconClick:C,iconTooltipBody:k,funnelPercent:z,isLoading:L,trendRaw:M,suffixText:P,trendStyle:F,trendContainerStyle:N,trendIconStyle:W,containerStyle:_,prevTrendDiff:A,relativePercentageDiff:B}=r;const E="big"===T?y:u,U=void 0!==c?c<0?"negative":0===c?"neutral":"positive":void 0,V=void 0!==c?$?Math.round(c):Math.abs(Math.round(c)):void 0;return e(b,Object.assign({card:O,style:Object.assign({},_)},{children:t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:4,borderRightWidth:S?1:0,borderRightColor:s.stroke.primary,borderRightStyle:"solid",paddingLeft:O?0:24,paddingRight:O?0:24,height:"100%",justifyContent:"space-between",alignItems:"center"},null!=N?N:{})},{children:[t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=F?F:{})},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e(h,Object.assign({style:{color:s.content.secondary}},{children:l})),w&&e(m,Object.assign({body:w,placement:"right",width:300},{children:e("div",Object.assign({style:{display:"flex",alignItems:"center",cursor:"pointer"}},{children:e(d,{color:s.content.primary,height:16,width:16})}))}))]})),t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},$?{justifyContent:"space-between"}:{})},{children:[L&&e(o,{width:108,height:26}),!L&&e(E,Object.assign({style:{color:s.content.primary}},{children:void 0===a?"--":"number"==typeof a&&I?a>9999?`${null!=R?R:""}${f(a)} ${null!=P?P:""}`:`${null!=R?R:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(a)} ${null!=P?P:""}`:`${null!=R?R:""}${a} ${null!=P?P:""}`})),"number"==typeof B&&e(g,{tagText:`${B}%`,theme:"light",type:"neutral"}),"horizontal"===p&&!L&&!$&&e(j,{timeline:v,customRange:x,percent:V,direction:U,trendRaw:M,prefixSymbol:R,trendIconStyle:W}),L&&!$&&"horizontal"===p&&e(o,{height:20,width:141,marginTop:6}),"vertical"===p&&!L&&void 0!==z&&e(g,{tagText:`${z} %`,theme:"light",type:"neutral"}),$&&!L&&void 0!==V&&e(g,{tagText:`${V} %`,theme:"light",type:"neutral"}),$||L||!A||0==A?e(i,{}):e(g,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(A),theme:"light",type:"neutral"})]})),"vertical"===p&&!L&&!$&&e("div",Object.assign({style:{marginTop:10}},{children:e(j,{timeline:v,customRange:x,percent:V,direction:U,trendRaw:M,prefixSymbol:R,trendIconStyle:W})})),L&&"vertical"===p&&e(o,{height:20,width:141,marginTop:6})]})),k&&!L&&e(m,Object.assign({body:k,placement:"right"},{children:D&&e("div",Object.assign({className:"icon--holder",onClick:C},{children:n.createElement(D,{height:20,width:20,color:s.content.secondary})}))}))]}))}))},j=i=>{let{percent:n,direction:o,timeline:d,customRange:g,trendRaw:m,prefixSymbol:h,trendIconStyle:y}=i;const u="negative"===o?a:c,b="negative"===o?s.background.negative.vibrant:"positive"===o?s.background.positive.vibrant:s.content.placeholder,v=r("today"===d?"vs yesterday":"yesterday"===d?"vs 1 day before":"7 days"===d?"vs last 7 days":"30 days"===d?"vs last 30 days":"custom"===d&&g?l.getAnalyticsCustomDateTimelineText(g):""),j=r((()=>{const e=((null!=m?m:0)>0?"+":"")+(null!=h?h:"");return void 0===m?"--":`${null!=e?e:""}${f(m)}`})());return t("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof n&&e(u,{color:b,height:16,width:16,style:Object.assign({marginRight:2},null!=y?y:{})}),"number"==typeof n&&o&&t(p,Object.assign({style:{color:b}},{children:["neutral"===o?0:n<1e3?n:">999","%"]})),!!m&&e(p,Object.assign({style:{marginLeft:4,color:s.content.placeholder}},{children:`(${j.current})`})),d&&e(p,Object.assign({style:{marginLeft:4,color:s.content.placeholder}},{children:v.current}))]}))};export{v as AnalyticsTrend};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import n,{useState as r,useEffect as o,useRef as l}from"react";import{ShimmerComponentStyled as s}from"../shimmer/ShimmerComponent/ShimmerStyled.js";import a from"../../utils/DateUtils.js";import{COLORS as c}from"../../constants/Theme.js";import d from"../../assets/icons/arrow_down.svg.js";import g from"../../assets/icons/arrow_up.svg.js";import m from"../../assets/icons/info.svg.js";import{Tag as h}from"../tag/Tag.js";import{Tooltip as p}from"../tooltips/Tooltip.js";import{BodyCaption as y,Caption as u,TitleLarge as f,TitleMedium as b}from"../TypographyStyle.js";import{truncateValueTo10K as v}from"./chart/utils/calcPercentage.js";import{AnalyticsTrendContainer as j}from"./CommonStyles.js";const x=r=>{let{title:o,value:l,trendPercent:a,type:d="horizontal",timeline:g,customRange:u,tooltip:x,card:O=!0,rightSeparator:S=!1,size:T="big",share:$=!1,formatVal:R,prefixSymbol:I,trailingIcon:D,onTrailIconClick:C,iconTooltipBody:k,funnelPercent:z,isLoading:L,trendRaw:M,suffixText:P,trendStyle:F,trendContainerStyle:N,trendIconStyle:W,containerStyle:_,prevTrendDiff:A,relativePercentageDiff:B}=r;const E="big"===T?f:b,U=void 0!==a?a<0?"negative":0===a?"neutral":"positive":void 0,V=void 0!==a?$?Math.round(a):Math.abs(Math.round(a)):void 0;return e(j,Object.assign({card:O,style:Object.assign({},_)},{children:t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:4,borderRightWidth:S?1:0,borderRightColor:c.stroke.primary,borderRightStyle:"solid",paddingLeft:O?0:24,paddingRight:O?0:24,height:"100%",justifyContent:"space-between",alignItems:"center"},null!=N?N:{})},{children:[t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=F?F:{})},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e(y,Object.assign({style:{color:c.content.secondary}},{children:o})),x&&e(p,Object.assign({body:x,placement:"right",width:300},{children:e("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e(m,{color:c.content.primary,height:16,width:16})}))}))]})),t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},$?{justifyContent:"space-between"}:{})},{children:[L&&e(s,{width:108,height:26}),!L&&e(E,Object.assign({style:{color:c.content.primary}},{children:void 0===l?"--":"number"==typeof l&&R?l>9999?`${null!=I?I:""}${v(l)} ${null!=P?P:""}`:`${null!=I?I:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(l)} ${null!=P?P:""}`:`${null!=I?I:""}${l} ${null!=P?P:""}`})),"number"==typeof B&&e(h,{tagText:`${B}%`,theme:"light",type:"neutral"}),"horizontal"===d&&!L&&!$&&e(w,{timeline:g,customRange:u,percent:V,direction:U,trendRaw:M,prefixSymbol:I,trendIconStyle:W}),L&&!$&&"horizontal"===d&&e(s,{height:20,width:141,marginTop:6}),"vertical"===d&&!L&&void 0!==z&&e(h,{tagText:`${z} %`,theme:"light",type:"neutral"}),$&&!L&&void 0!==V&&e(h,{tagText:`${V} %`,theme:"light",type:"neutral"}),$||L||!A||0==A?e(i,{}):e(h,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(A),theme:"light",type:"neutral"})]})),"vertical"===d&&!L&&!$&&e("div",Object.assign({style:{marginTop:10}},{children:e(w,{timeline:g,customRange:u,percent:V,direction:U,trendRaw:M,prefixSymbol:I,trendIconStyle:W})})),L&&"vertical"===d&&e(s,{height:20,width:141,marginTop:6})]})),k&&!L&&e(p,Object.assign({body:k,placement:"right"},{children:D&&e("div",Object.assign({className:"icon--holder",onClick:C},{children:n.createElement(D,{height:20,width:20,color:c.content.secondary})}))}))]}))}))},w=i=>{let{percent:n,direction:s,timeline:m,customRange:h,trendRaw:p,prefixSymbol:y,trendIconStyle:f}=i;const b="negative"===s?d:g,j="negative"===s?c.background.negative.vibrant:"positive"===s?c.background.positive.vibrant:c.content.placeholder,[x,w]=r("");o((()=>{w("today"===m?"vs yesterday":"yesterday"===m?"vs 1 day before":"7 days"===m?"vs last 7 days":"30 days"===m?"vs last 30 days":"custom"===m&&h?a.getAnalyticsCustomDateTimelineText(h):"")}),[m,h]);const O=l((()=>{const e=((null!=p?p:0)>0?"+":"")+(null!=y?y:"");return void 0===p?"--":`${null!=e?e:""}${v(p)}`})());return t("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof n&&e(b,{color:j,height:16,width:16,style:Object.assign({marginRight:2},null!=f?f:{})}),"number"==typeof n&&s&&t(u,Object.assign({style:{color:j}},{children:["neutral"===s?0:n<1e3?n:">999","%"]})),!!p&&e(u,Object.assign({style:{marginLeft:4,color:c.content.placeholder}},{children:`(${O.current})`})),m&&e(u,Object.assign({style:{marginLeft:4,color:c.content.placeholder}},{children:x}))]}))};export{x as AnalyticsTrend};

package/dist/esm/components/states/StateComponent.d.ts

@@ -5,7 +5,8 @@ export declare enum StateInterface {
     SUCCESS = "success",
     ERROR = "error",
     WARNING = "warning",
-    LOADING = "loading"
+    LOADING = "loading",
+    RETRY = "retry"
 }
 export declare enum ButtonActions {
     CANCEL = "cancel",
@@ -33,5 +34,6 @@ export type StateComponentProps = {
     iconHeight?: number;
     iconWidth?: number;
     closeButtonType?: Type;
+    secondaryButtonText?: string;
 };
 export declare const StateComponent: React.FC<React.PropsWithChildren<StateComponentProps>>;

package/dist/esm/components/states/StateComponent.js

@@ -1 +1 @@
-import{jsxs as n,jsx as t,Fragment as e}from"react/jsx-runtime";import{COLORS as i}from"../../constants/Theme.js";import o from"../../assets/icons/errorIcon.svg.js";import s from"../../assets/icons/successIcon.svg.js";import r from"../../assets/icons/warningIcon.svg.js";import{Button as c}from"../button/Button.js";import{Spinner as a}from"../spinner/Spinner.js";import{TitleRegular as l,TitleMedium as d,BodyPrimary as h,BodySecondary as m}from"../TypographyStyle.js";import{StateComponentContainer as u,StateIcon as g,StateHeading as p,StateSubline as L,ButtonContainer as b}from"./StateComponent.styled.js";var j,O,S;!function(n){n.SUCCESS="success",n.ERROR="error",n.WARNING="warning",n.LOADING="loading"}(j||(j={})),function(n){n.CANCEL="cancel",n.OTHER="other"}(O||(O={})),function(n){n.SINGLE="SINGLE",n.DOUBLE="DOUBLE"}(S||(S={}));const y=y=>{var E;const C=()=>f==j.SUCCESS?t(s,{}):f==j.WARNING?t(r,{}):f==j.ERROR?t(o,{}):f===j.LOADING?t(a,{size:"large"}):void 0,{states:f,heading:I,subline:R,icon:T=C(),isButtonEnabled:A,type:N,buttonText:z,buttonType:v,onButtonClick:B,leadingIcon:G,width:W,headerImage:w,iconWidth:x,iconHeight:D,closeButtonType:U}=y;return n(u,Object.assign({width:W},{children:[t(g,Object.assign({iconWidth:x,iconHeight:D},{children:w?t("img",{src:w,width:"100%",height:"auto",alt:""}):T})),n(p,Object.assign({size:y.size},{children:["SMALL"===y.size&&t(l,{children:I}),"SMALL"!==y.size&&t(d,{children:I})]})),n(L,{children:["SMALL"!==y.size&&t(h,Object.assign({color:i.content.secondary},{children:R})),"SMALL"===y.size&&t(m,Object.assign({color:i.content.secondary},{children:R}))]}),null!==(E=y.children)&&void 0!==E?E:t(e,{}),A&&t(e,{children:n(b,Object.assign({size:y.size},{children:[N==S.DOUBLE&&t(c,{onClick:()=>B&&B(O.CANCEL),buttonType:U||"secondary",buttonText:"Cancel",matchParentWidth:!0}),t(c,{onClick:()=>B&&B(O.OTHER),buttonType:null!=v?v:"primary",LeadingIcon:G,buttonText:null!=z?z:"Retry",matchParentWidth:!0})]}))})]}))};export{O as ButtonActions,S as ButtonTypes,y as StateComponent,j as StateInterface};
+import{jsxs as t,jsx as n,Fragment as e}from"react/jsx-runtime";import{COLORS as o}from"../../constants/Theme.js";import i from"../../assets/icons/errorIcon.svg.js";import s from"../../assets/icons/retryIcon.svg.js";import r from"../../assets/icons/successIcon.svg.js";import c from"../../assets/icons/warningIcon.svg.js";import{Button as a}from"../button/Button.js";import{Spinner as l}from"../spinner/Spinner.js";import{TitleRegular as d,TitleMedium as h,BodyPrimary as m,BodySecondary as u}from"../TypographyStyle.js";import{StateComponentContainer as g,StateIcon as p,StateHeading as L,StateSubline as y,ButtonContainer as j}from"./StateComponent.styled.js";var E,b,O;!function(t){t.SUCCESS="success",t.ERROR="error",t.WARNING="warning",t.LOADING="loading",t.RETRY="retry"}(E||(E={})),function(t){t.CANCEL="cancel",t.OTHER="other"}(b||(b={})),function(t){t.SINGLE="SINGLE",t.DOUBLE="DOUBLE"}(O||(O={}));const R=R=>{var S;const T=()=>f==E.SUCCESS?n(r,{}):f==E.WARNING?n(c,{}):f==E.ERROR?n(i,{}):f===E.LOADING?n(l,{size:"large"}):f===E.RETRY?n(s,{}):void 0,{states:f,heading:C,subline:I,icon:A=T(),isButtonEnabled:N,type:z,buttonText:v,buttonType:B,onButtonClick:x,leadingIcon:G,width:W,headerImage:w,iconWidth:D,iconHeight:U,closeButtonType:H,secondaryButtonText:M}=R;return t(g,Object.assign({width:W},{children:[n(p,Object.assign({iconWidth:D,iconHeight:U},{children:w?n("img",{src:w,width:"100%",height:"auto",alt:""}):A})),t(L,Object.assign({size:R.size},{children:["SMALL"===R.size&&n(d,{children:C}),"SMALL"!==R.size&&n(h,{children:C})]})),t(y,{children:["SMALL"!==R.size&&n(m,Object.assign({color:o.content.secondary},{children:I})),"SMALL"===R.size&&n(u,Object.assign({color:o.content.secondary},{children:I}))]}),null!==(S=R.children)&&void 0!==S?S:n(e,{}),N&&n(e,{children:t(j,Object.assign({size:R.size},{children:[z==O.DOUBLE&&n(a,{onClick:()=>x&&x(b.CANCEL),buttonType:H||"secondary",buttonText:M||"Cancel",matchParentWidth:!0}),n(a,{onClick:()=>x&&x(b.OTHER),buttonType:null!=B?B:"primary",LeadingIcon:G,buttonText:null!=v?v:"Retry",matchParentWidth:!0})]}))})]}))};export{b as ButtonActions,O as ButtonTypes,R as StateComponent,E as StateInterface};

package/package.json

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