@bikdotai/bik-component-library 0.0.636 → 0.0.638-0
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.
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.d.ts +1 -0
- package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.js +1 -1
- package/dist/cjs/components/bik-layout/MockMenus.d.ts +1 -0
- package/dist/cjs/components/datePicker/DatePickerWrapper.js +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsTrend.d.ts +1 -0
- package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsTrend.js +1 -1
- package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
- package/dist/esm/components/datePicker/DatePickerWrapper.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -27,5 +27,6 @@ export interface AnalyticsTrendInterface {
|
|
|
27
27
|
prevTrendDiff?: number;
|
|
28
28
|
relativePercentageDiff?: number;
|
|
29
29
|
isInternationalStore?: boolean;
|
|
30
|
+
Icon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
|
|
30
31
|
}
|
|
31
32
|
export declare const AnalyticsTrend: React.FC<AnalyticsTrendInterface>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),i=require("../../utils/DateUtils.js"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/arrow_down.svg.js"),a=require("../../assets/icons/arrow_up.svg.js"),l=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=n=>{let{percent:l,direction:o,timeline:c,customRange:u,trendRaw:h,prefixSymbol:y,trendIconStyle:m,isInternationalStore:p}=n;const j="negative"===o?s.default:a.default,x="negative"===o?r.COLORS.background.negative.vibrant:"positive"===o?r.COLORS.background.positive.vibrant:r.COLORS.content.placeholder,[b,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?i.default.getAnalyticsCustomDateTimelineText(u):"")}),[c,u]);const S=e=>{let t;return t=p?g.truncateValueForInternationalStore(Math.abs(e)):g.truncateValueForIndianStore(Math.abs(e)),console.log("trendRawAbs",t),console.log("trendRaw",e),e<0?"-"+t:t},O=t.useRef((()=>{const e=((null!=h?h:0)>0?"+":"")+(null!=y?y:"");return void 0===h?"--":`${null!=e?e:""}${S(h)}`})());return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof l&&e.jsx(j,{color:x,height:16,width:16,style:Object.assign({marginRight:2},null!=m?m:{})}),"number"==typeof l&&o&&e.jsxs(d.Caption,Object.assign({style:{color:x}},{children:["neutral"===o?0:l<1e3?l:">999","%"]})),!!h&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`(${O.current})`})),c&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:b}))]}))};exports.AnalyticsTrend=t=>{let{title:i,value:s,trendPercent:a,type:h="horizontal",timeline:p,customRange:j,tooltip:x,card:b=!0,rightSeparator:f=!1,size:S="big",share:O=!1,formatVal:v,prefixSymbol:C,trailingIcon:T,onTrailIconClick:R,iconTooltipBody:w,funnelPercent:I,isLoading:$,trendRaw:L,suffixText:q,trendStyle:D,trendContainerStyle:F,trendIconStyle:M,containerStyle:k,prevTrendDiff:P,relativePercentageDiff:V,isInternationalStore:z}=t;const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),i=require("../../utils/DateUtils.js"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/arrow_down.svg.js"),a=require("../../assets/icons/arrow_up.svg.js"),l=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=n=>{let{percent:l,direction:o,timeline:c,customRange:u,trendRaw:h,prefixSymbol:y,trendIconStyle:m,isInternationalStore:p}=n;const j="negative"===o?s.default:a.default,x="negative"===o?r.COLORS.background.negative.vibrant:"positive"===o?r.COLORS.background.positive.vibrant:r.COLORS.content.placeholder,[b,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?i.default.getAnalyticsCustomDateTimelineText(u):"")}),[c,u]);const S=e=>{let t;return t=p?g.truncateValueForInternationalStore(Math.abs(e)):g.truncateValueForIndianStore(Math.abs(e)),console.log("trendRawAbs",t),console.log("trendRaw",e),e<0?"-"+t:t},O=t.useRef((()=>{const e=((null!=h?h:0)>0?"+":"")+(null!=y?y:"");return void 0===h?"--":`${null!=e?e:""}${S(h)}`})());return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof l&&e.jsx(j,{color:x,height:16,width:16,style:Object.assign({marginRight:2},null!=m?m:{})}),"number"==typeof l&&o&&e.jsxs(d.Caption,Object.assign({style:{color:x}},{children:["neutral"===o?0:l<1e3?l:">999","%"]})),!!h&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`(${O.current})`})),c&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:b}))]}))};exports.AnalyticsTrend=t=>{let{title:i,value:s,trendPercent:a,type:h="horizontal",timeline:p,customRange:j,tooltip:x,card:b=!0,rightSeparator:f=!1,size:S="big",share:O=!1,formatVal:v,prefixSymbol:C,trailingIcon:T,onTrailIconClick:R,iconTooltipBody:w,funnelPercent:I,isLoading:$,trendRaw:L,suffixText:q,trendStyle:D,trendContainerStyle:F,trendIconStyle:M,containerStyle:k,prevTrendDiff:P,relativePercentageDiff:V,isInternationalStore:z,Icon:A}=t;const _="big"===S?d.TitleLarge:d.TitleMedium,N=void 0!==a?a<0?"negative":0===a?"neutral":"positive":void 0,B=void 0!==a?O?Math.round(a):Math.abs(Math.round(a)):void 0;return e.jsx(u.AnalyticsTrendContainer,Object.assign({card:b,style:Object.assign({},k)},{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!=F?F:{})},{children:[!!A&&e.jsx(A,{}),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:i})),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(l.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"},O?{justifyContent:"space-between"}:{})},{children:[$&&e.jsx(n.ShimmerComponentStyled,{width:108,height:26}),!$&&e.jsx(_,Object.assign({style:{color:r.COLORS.content.primary}},{children:void 0===s?"--":"number"==typeof s&&v?s>999?z?`${null!=C?C:""}${g.truncateValueForInternationalStore(s)} ${null!=q?q:""}`:`${null!=C?C:""}${g.truncateValueForIndianStore(s)} ${null!=q?q:""}`:`${null!=C?C:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(s)} ${null!=q?q:""}`:`${null!=C?C:""}${s} ${null!=q?q:""}`})),"number"==typeof V&&e.jsx(o.Tag,{tagText:`${V}%`,theme:"light",type:"neutral"}),"horizontal"===h&&!$&&!O&&e.jsx(m,{timeline:p,customRange:j,percent:B,direction:N,trendRaw:L,prefixSymbol:C,trendIconStyle:M,isInternationalStore:z}),$&&!O&&"horizontal"===h&&e.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6}),"vertical"===h&&!$&&void 0!==I&&e.jsx(o.Tag,{tagText:`${I} %`,theme:"light",type:"neutral"}),O&&!$&&void 0!==B&&e.jsx(o.Tag,{tagText:`${B} %`,theme:"light",type:"neutral"}),O||$||!P||0==P?e.jsx(e.Fragment,{}):e.jsx(o.Tag,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(P),theme:"light",type:"neutral"})]})),"vertical"===h&&!$&&!O&&e.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsx(m,{timeline:p,customRange:j,percent:B,direction:N,trendRaw:L,prefixSymbol:C,trendIconStyle:M,isInternationalStore:z})})),$&&"vertical"===h&&e.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6})]})),w&&!$&&e.jsx(c.Tooltip,Object.assign({body:w,placement:"right"},{children:T&&e.jsx("div",Object.assign({className:"icon--holder",onClick:R},{children:y.default.createElement(T,{height:20,width:20,color:r.COLORS.content.secondary})}))}))]}))}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("react-calendar"),a=require("../../hooks/useOutside.js"),n=require("../../utils/DateUtils.js"),o=require("../../constants/Theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("react-calendar"),a=require("../../hooks/useOutside.js"),n=require("../../utils/DateUtils.js"),o=require("../../constants/Theme.js"),s=require("../../assets/icons/calendar.svg.js"),i=require("../TypographyStyle.js"),l=require("./DatePickerWrapper.styled.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c,d=u(r);exports.DateButtonType=void 0,(c=exports.DateButtonType||(exports.DateButtonType={})).DEFAULT="default",c.LARGE="large";exports.DatePickerWrapper=r=>{let{val:u,onChange:c,calendarProps:O,disabled:y,pickerStyles:D,nativeID:p,maxDate:g,minDate:S,dateButtonType:L,dateButtonStyles:v}=r;const[C,j]=t.useState(!1),x=t.useRef(null),b=t.useRef(null);a.useOutside(b,(()=>{j(!1)}));const R=()=>{var e,t,r,a;return u?Array.isArray(u)?(null===(e=null==u?void 0:u[0])||void 0===e?void 0:e.toString())&&(null===(t=null==u?void 0:u[1])||void 0===t?void 0:t.toString())?`${new Date(null===(r=null==u?void 0:u[0])||void 0===r?void 0:r.toString()).toLocaleDateString()}-${new Date(null===(a=null==u?void 0:u[1])||void 0===a?void 0:a.toString()).toLocaleDateString()}`:`${n.default.getPastDate(new Date,30).toLocaleDateString()}-${(new Date).toLocaleDateString()}`:new Date(u.toString()).toLocaleDateString():(new Date).toLocaleDateString()};return e.jsxs(e.Fragment,{children:[e.jsxs(l.DateBtn,Object.assign({id:p,ref:x,bgColor:y?o.COLORS.background.base:o.COLORS.surface.standard,borderColor:o.COLORS.stroke.primary,onClick:()=>j(!C),dateButtonType:L||exports.DateButtonType.DEFAULT,style:v},{children:[L===exports.DateButtonType.LARGE?e.jsx(i.BodyPrimary,Object.assign({style:{color:y?o.COLORS.content.inactive:o.COLORS.content.primary,flex:1}},{children:R()})):e.jsx(i.BodySecondary,Object.assign({style:{color:y?o.COLORS.content.inactive:o.COLORS.content.primary,flex:1}},{children:R()})),e.jsx(s.default,{width:L===exports.DateButtonType.LARGE?24:20,height:L===exports.DateButtonType.LARGE?24:20,color:y?o.COLORS.content.inactive:o.COLORS.content.primary})]})),C&&!y&&e.jsx(l.PickerContainer,Object.assign({ref:b,style:Object.assign({},D),contentPrimary:o.COLORS.content.primary,subDued:o.COLORS.surface.subdued,brandColor:o.COLORS.background.brand,bgColor:o.COLORS.surface.standard,borderColor:o.COLORS.stroke.primary},{children:e.jsx(d.default,Object.assign({tileClassName:["custom__tile"],className:["custom__calendar"],onChange:e=>{c(e),j(!1)},maxDate:g,minDate:S,value:u?Array.isArray(u)?2===u.length?[new Date(u[0]),new Date(u[1])]:null:new Date(u):null},O))}))]})};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -27,5 +27,6 @@ export interface AnalyticsTrendInterface {
|
|
|
27
27
|
prevTrendDiff?: number;
|
|
28
28
|
relativePercentageDiff?: number;
|
|
29
29
|
isInternationalStore?: boolean;
|
|
30
|
+
Icon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
|
|
30
31
|
}
|
|
31
32
|
export declare const AnalyticsTrend: React.FC<AnalyticsTrendInterface>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
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 a}from"../shimmer/ShimmerComponent/ShimmerStyled.js";import s 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 b,TitleMedium as f}from"../TypographyStyle.js";import{truncateValueForInternationalStore as v,truncateValueForIndianStore as j}from"./chart/utils/calcPercentage.js";import{AnalyticsTrendContainer as x}from"./CommonStyles.js";const w=r=>{let{title:o,value:l,trendPercent:s,type:d="horizontal",timeline:g,customRange:u,tooltip:w,card:O=!0,rightSeparator:$=!1,size:
|
|
1
|
+
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 a}from"../shimmer/ShimmerComponent/ShimmerStyled.js";import s 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 b,TitleMedium as f}from"../TypographyStyle.js";import{truncateValueForInternationalStore as v,truncateValueForIndianStore as j}from"./chart/utils/calcPercentage.js";import{AnalyticsTrendContainer as x}from"./CommonStyles.js";const w=r=>{let{title:o,value:l,trendPercent:s,type:d="horizontal",timeline:g,customRange:u,tooltip:w,card:O=!0,rightSeparator:$=!1,size:I="big",share:T=!1,formatVal:R,prefixSymbol:D,trailingIcon:C,onTrailIconClick:M,iconTooltipBody:k,funnelPercent:z,isLoading:L,trendRaw:P,suffixText:F,trendStyle:N,trendContainerStyle:A,trendIconStyle:W,containerStyle:_,prevTrendDiff:B,relativePercentageDiff:E,isInternationalStore:U,Icon:V}=r;const q="big"===I?b:f,G=void 0!==s?s<0?"negative":0===s?"neutral":"positive":void 0,H=void 0!==s?T?Math.round(s):Math.abs(Math.round(s)):void 0;return e(x,Object.assign({card:O,style:Object.assign({},_)},{children:t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:4,borderRightWidth:$?1:0,borderRightColor:c.stroke.primary,borderRightStyle:"solid",paddingLeft:O?0:24,paddingRight:O?0:24,height:"100%",justifyContent:"space-between",alignItems:"center"},null!=A?A:{})},{children:[!!V&&e(V,{}),t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=N?N:{})},{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})),w&&e(p,Object.assign({body:w,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"},T?{justifyContent:"space-between"}:{})},{children:[L&&e(a,{width:108,height:26}),!L&&e(q,Object.assign({style:{color:c.content.primary}},{children:void 0===l?"--":"number"==typeof l&&R?l>999?U?`${null!=D?D:""}${v(l)} ${null!=F?F:""}`:`${null!=D?D:""}${j(l)} ${null!=F?F:""}`:`${null!=D?D:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(l)} ${null!=F?F:""}`:`${null!=D?D:""}${l} ${null!=F?F:""}`})),"number"==typeof E&&e(h,{tagText:`${E}%`,theme:"light",type:"neutral"}),"horizontal"===d&&!L&&!T&&e(S,{timeline:g,customRange:u,percent:H,direction:G,trendRaw:P,prefixSymbol:D,trendIconStyle:W,isInternationalStore:U}),L&&!T&&"horizontal"===d&&e(a,{height:20,width:141,marginTop:6}),"vertical"===d&&!L&&void 0!==z&&e(h,{tagText:`${z} %`,theme:"light",type:"neutral"}),T&&!L&&void 0!==H&&e(h,{tagText:`${H} %`,theme:"light",type:"neutral"}),T||L||!B||0==B?e(i,{}):e(h,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(B),theme:"light",type:"neutral"})]})),"vertical"===d&&!L&&!T&&e("div",Object.assign({style:{marginTop:10}},{children:e(S,{timeline:g,customRange:u,percent:H,direction:G,trendRaw:P,prefixSymbol:D,trendIconStyle:W,isInternationalStore:U})})),L&&"vertical"===d&&e(a,{height:20,width:141,marginTop:6})]})),k&&!L&&e(p,Object.assign({body:k,placement:"right"},{children:C&&e("div",Object.assign({className:"icon--holder",onClick:M},{children:n.createElement(C,{height:20,width:20,color:c.content.secondary})}))}))]}))}))},S=i=>{let{percent:n,direction:a,timeline:m,customRange:h,trendRaw:p,prefixSymbol:y,trendIconStyle:b,isInternationalStore:f}=i;const x="negative"===a?d:g,w="negative"===a?c.background.negative.vibrant:"positive"===a?c.background.positive.vibrant:c.content.placeholder,[S,O]=r("");o((()=>{O("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?s.getAnalyticsCustomDateTimelineText(h):"")}),[m,h]);const $=e=>{let t;return t=f?v(Math.abs(e)):j(Math.abs(e)),console.log("trendRawAbs",t),console.log("trendRaw",e),e<0?"-"+t:t},I=l((()=>{const e=((null!=p?p:0)>0?"+":"")+(null!=y?y:"");return void 0===p?"--":`${null!=e?e:""}${$(p)}`})());return t("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof n&&e(x,{color:w,height:16,width:16,style:Object.assign({marginRight:2},null!=b?b:{})}),"number"==typeof n&&a&&t(u,Object.assign({style:{color:w}},{children:["neutral"===a?0:n<1e3?n:">999","%"]})),!!p&&e(u,Object.assign({style:{marginLeft:4,color:c.content.placeholder}},{children:`(${I.current})`})),m&&e(u,Object.assign({style:{marginLeft:4,color:c.content.placeholder}},{children:S}))]}))};export{w as AnalyticsTrend};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as t,Fragment as e,jsx as r}from"react/jsx-runtime";import{useState as
|
|
1
|
+
import{jsxs as t,Fragment as e,jsx as r}from"react/jsx-runtime";import{useState as o,useRef as a}from"react";import n from"react-calendar";import{useOutside as i}from"../../hooks/useOutside.js";import l from"../../utils/DateUtils.js";import{COLORS as s}from"../../constants/Theme.js";import c from"../../assets/icons/calendar.svg.js";import{BodyPrimary as d,BodySecondary as m}from"../TypographyStyle.js";import{DateBtn as u,PickerContainer as g}from"./DatePickerWrapper.styled.js";var D;!function(t){t.DEFAULT="default",t.LARGE="large"}(D||(D={}));const p=p=>{let{val:y,onChange:v,calendarProps:b,disabled:f,pickerStyles:h,nativeID:S,maxDate:j,minDate:L,dateButtonType:w,dateButtonStyles:A}=p;const[C,k]=o(!1),O=a(null),x=a(null);i(x,(()=>{k(!1)}));const E=()=>{var t,e,r,o;return y?Array.isArray(y)?(null===(t=null==y?void 0:y[0])||void 0===t?void 0:t.toString())&&(null===(e=null==y?void 0:y[1])||void 0===e?void 0:e.toString())?`${new Date(null===(r=null==y?void 0:y[0])||void 0===r?void 0:r.toString()).toLocaleDateString()}-${new Date(null===(o=null==y?void 0:y[1])||void 0===o?void 0:o.toString()).toLocaleDateString()}`:`${l.getPastDate(new Date,30).toLocaleDateString()}-${(new Date).toLocaleDateString()}`:new Date(y.toString()).toLocaleDateString():(new Date).toLocaleDateString()};return t(e,{children:[t(u,Object.assign({id:S,ref:O,bgColor:f?s.background.base:s.surface.standard,borderColor:s.stroke.primary,onClick:()=>k(!C),dateButtonType:w||D.DEFAULT,style:A},{children:[w===D.LARGE?r(d,Object.assign({style:{color:f?s.content.inactive:s.content.primary,flex:1}},{children:E()})):r(m,Object.assign({style:{color:f?s.content.inactive:s.content.primary,flex:1}},{children:E()})),r(c,{width:w===D.LARGE?24:20,height:w===D.LARGE?24:20,color:f?s.content.inactive:s.content.primary})]})),C&&!f&&r(g,Object.assign({ref:x,style:Object.assign({},h),contentPrimary:s.content.primary,subDued:s.surface.subdued,brandColor:s.background.brand,bgColor:s.surface.standard,borderColor:s.stroke.primary},{children:r(n,Object.assign({tileClassName:["custom__tile"],className:["custom__calendar"],onChange:t=>{v(t),k(!1)},maxDate:j,minDate:L,value:y?Array.isArray(y)?2===y.length?[new Date(y[0]),new Date(y[1])]:null:new Date(y):null},b))}))]})};export{D as DateButtonType,p as DatePickerWrapper};
|