@bikdotai/bik-component-library 0.0.467-beta-analytics-2 → 0.0.467-beta-analytics-3
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("react"),i=require("../../utils/DateUtils.js"),s=require("../../constants/Theme.js"),n=require("../../assets/icons/arrow_down.svg.js"),r=require("../../assets/icons/arrow_up.svg.js"),a=require("../../assets/icons/info.svg.js"),o=require("../tag/Tag.js"),l=require("../tooltips/Tooltip.js"),c=require("../TypographyStyle.js"),d=require("./CommonStyles.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=g(t);const y=a=>{let{percent:o,direction:l,timeline:d,customRange:g}=a;const u="negative"===l?n.default:r.default,y="negative"===l?s.COLORS.background.negative.vibrant:"positive"===l?s.COLORS.background.positive.vibrant:s.COLORS.content.placeholder,h=t.useRef("today"===d?"vs yesterday":"yesterday"===d?"vs 1 day before":"7 days"===d?"vs last 7 days":"30 days"===d?"vs last 30 days":"
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../../utils/DateUtils.js"),s=require("../../constants/Theme.js"),n=require("../../assets/icons/arrow_down.svg.js"),r=require("../../assets/icons/arrow_up.svg.js"),a=require("../../assets/icons/info.svg.js"),o=require("../tag/Tag.js"),l=require("../tooltips/Tooltip.js"),c=require("../TypographyStyle.js"),d=require("./CommonStyles.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=g(t);const y=a=>{let{percent:o,direction:l,timeline:d,customRange:g}=a;const u="negative"===l?n.default:r.default,y="negative"===l?s.COLORS.background.negative.vibrant:"positive"===l?s.COLORS.background.positive.vibrant:s.COLORS.content.placeholder,h=t.useRef("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?i.default.getAnalyticsCustomDateTimelineText(g):"");return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row"}},{children:["number"==typeof o&&e.jsx(u,{color:y,height:20,width:20,style:{marginRight:2}}),"number"==typeof o&&l&&e.jsxs(c.TitleSmall,Object.assign({style:{color:y}},{children:["neutral"===l?0:o,"%"]})),d&&e.jsx(c.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:h.current}))]}))};exports.AnalyticsTrend=t=>{let{title:i,value:n,trendPercent:r,type:g="horizontal",timeline:h,customRange:j,tooltip:p,card:m=!0,rightSeparator:x=!1,size:b="big",share:v=!1,formatVal:f,prefixSymbol:O,trailingIcon:T,onTrailIconClick:R,iconTooltipBody:C,funnelPercent:S}=t;const w="big"===b?c.TitleLarge:c.TitleMedium,L=void 0!==r?r<0?"negative":0===r?"neutral":"positive":void 0,q=void 0!==r?v?Math.round(r):Math.abs(Math.round(r)):void 0;return e.jsx(d.AnalyticsTrendContainer,Object.assign({card:m},{children:e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,borderRightWidth:x?1:0,borderRightColor:s.COLORS.stroke.primary,borderRightStyle:"solid",paddingLeft:m?0:24,paddingRight:m?0:24,height:"100%",justifyContent:"space-between",alignItems:"center"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:4,height:"100%"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsx(c.BodySecondary,Object.assign({style:{color:s.COLORS.content.secondary}},{children:i})),p&&e.jsx(l.Tooltip,Object.assign({body:p,placement:"right",width:300},{children:e.jsx("div",Object.assign({style:{display:"flex",alignItems:"center",cursor:"pointer"}},{children:e.jsx(a.default,{color:s.COLORS.content.inactive,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:[e.jsx(w,Object.assign({style:{color:s.COLORS.content.primary}},{children:void 0===n?"--":"number"==typeof n&&f?`${null!=O?O:""}${new Intl.NumberFormat("en-IN",{}).format(n)}`:`${null!=O?O:""}${n}`})),"horizontal"===g&&!v&&e.jsx(y,{timeline:h,customRange:j,percent:q,direction:L}),"vertical"===g&&void 0!==S&&e.jsx(o.Tag,{tagText:`${S} %`,theme:"light",type:"neutral"}),v&&void 0!==q&&e.jsx(o.Tag,{tagText:`${q} %`,theme:"light",type:"neutral"})]})),"vertical"===g&&!v&&e.jsx("div",Object.assign({style:{marginTop:6}},{children:e.jsx(y,{timeline:h,customRange:j,percent:q,direction:L})}))]})),C&&e.jsx(l.Tooltip,Object.assign({body:C,placement:"right"},{children:T&&e.jsx("div",Object.assign({className:"icon--holder",onClick:R},{children:u.default.createElement(T,{height:20,width:20,color:s.COLORS.content.secondary})}))}))]}))}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import i,{useRef as n
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import i,{useRef as n}from"react";import r from"../../utils/DateUtils.js";import{COLORS as o}from"../../constants/Theme.js";import s from"../../assets/icons/arrow_down.svg.js";import a from"../../assets/icons/arrow_up.svg.js";import l from"../../assets/icons/info.svg.js";import{Tag as c}from"../tag/Tag.js";import{Tooltip as d}from"../tooltips/Tooltip.js";import{BodySecondary as g,TitleSmall as m,Caption as p,TitleLarge as h,TitleMedium as y}from"../TypographyStyle.js";import{AnalyticsTrendContainer as b}from"./CommonStyles.js";const f=n=>{let{title:r,value:s,trendPercent:a,type:m="horizontal",timeline:p,customRange:f,tooltip:u,card:j=!0,rightSeparator:x=!1,size:O="big",share:w=!1,formatVal:T,prefixSymbol:I,trailingIcon:R,onTrailIconClick:C,iconTooltipBody:D,funnelPercent:$}=n;const k="big"===O?h:y,S=void 0!==a?a<0?"negative":0===a?"neutral":"positive":void 0,z=void 0!==a?w?Math.round(a):Math.abs(Math.round(a)):void 0;return e(b,Object.assign({card:j},{children:t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,borderRightWidth:x?1:0,borderRightColor:o.stroke.primary,borderRightStyle:"solid",paddingLeft:j?0:24,paddingRight:j?0:24,height:"100%",justifyContent:"space-between",alignItems:"center"}},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:4,height:"100%"}},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e(g,Object.assign({style:{color:o.content.secondary}},{children:r})),u&&e(d,Object.assign({body:u,placement:"right",width:300},{children:e("div",Object.assign({style:{display:"flex",alignItems:"center",cursor:"pointer"}},{children:e(l,{color:o.content.inactive,height:16,width:16})}))}))]})),t("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},w?{justifyContent:"space-between"}:{})},{children:[e(k,Object.assign({style:{color:o.content.primary}},{children:void 0===s?"--":"number"==typeof s&&T?`${null!=I?I:""}${new Intl.NumberFormat("en-IN",{}).format(s)}`:`${null!=I?I:""}${s}`})),"horizontal"===m&&!w&&e(v,{timeline:p,customRange:f,percent:z,direction:S}),"vertical"===m&&void 0!==$&&e(c,{tagText:`${$} %`,theme:"light",type:"neutral"}),w&&void 0!==z&&e(c,{tagText:`${z} %`,theme:"light",type:"neutral"})]})),"vertical"===m&&!w&&e("div",Object.assign({style:{marginTop:6}},{children:e(v,{timeline:p,customRange:f,percent:z,direction:S})}))]})),D&&e(d,Object.assign({body:D,placement:"right"},{children:R&&e("div",Object.assign({className:"icon--holder",onClick:C},{children:i.createElement(R,{height:20,width:20,color:o.content.secondary})}))}))]}))}))},v=i=>{let{percent:l,direction:c,timeline:d,customRange:g}=i;const h="negative"===c?s:a,y="negative"===c?o.background.negative.vibrant:"positive"===c?o.background.positive.vibrant:o.content.placeholder,b=n("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?r.getAnalyticsCustomDateTimelineText(g):"");return t("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row"}},{children:["number"==typeof l&&e(h,{color:y,height:20,width:20,style:{marginRight:2}}),"number"==typeof l&&c&&t(m,Object.assign({style:{color:y}},{children:["neutral"===c?0:l,"%"]})),d&&e(p,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:b.current}))]}))};export{f as AnalyticsTrend};
|