@bikdotai/bik-component-library 0.0.671-1 → 0.0.672
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/chart/LineChart/LineChart.d.ts +11 -0
- package/dist/cjs/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js +1 -1
- package/dist/cjs/components/bik-layout/MockMenus.d.ts +0 -1
- package/dist/cjs/components/tag/Tag.d.ts +1 -1
- package/dist/cjs/components/tag/Tag.js +1 -1
- package/dist/cjs/components/tag/Tag.stories.d.ts +22 -0
- package/dist/cjs/components/tag/model.d.ts +12 -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/chart/LineChart/LineChart.d.ts +11 -0
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js +1 -1
- package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
- package/dist/esm/components/tag/Tag.d.ts +1 -1
- package/dist/esm/components/tag/Tag.js +1 -1
- package/dist/esm/components/tag/Tag.stories.d.ts +22 -0
- package/dist/esm/components/tag/model.d.ts +12 -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;
|
|
@@ -11,14 +11,18 @@ export type LineChartProps = {
|
|
|
11
11
|
legend?: string;
|
|
12
12
|
lineWidth?: number;
|
|
13
13
|
squareLegends?: boolean;
|
|
14
|
+
useSecondYAxis?: boolean;
|
|
14
15
|
}[];
|
|
15
16
|
labels: Array<string>;
|
|
16
17
|
scaleText?: {
|
|
17
18
|
x?: string;
|
|
18
19
|
y?: string;
|
|
19
20
|
yPrefix?: string;
|
|
21
|
+
y2?: string;
|
|
22
|
+
y2Prefix?: string;
|
|
20
23
|
xDrawBorder?: boolean;
|
|
21
24
|
yDrawBorder?: boolean;
|
|
25
|
+
y2DrawBorder?: boolean;
|
|
22
26
|
};
|
|
23
27
|
legends: Array<string>;
|
|
24
28
|
stepSize?: number;
|
|
@@ -39,5 +43,12 @@ export type LineChartProps = {
|
|
|
39
43
|
customYHeaders?: any;
|
|
40
44
|
legendsAndIconDirection?: 'row-reverse' | 'row';
|
|
41
45
|
headerIcons?: React.ReactNode[];
|
|
46
|
+
hasSecondYAxis?: boolean;
|
|
47
|
+
min2?: number;
|
|
48
|
+
max2?: number;
|
|
49
|
+
stepSize2?: number;
|
|
50
|
+
prefixCurrencyInY2Axis?: string;
|
|
51
|
+
useKFormat2?: boolean;
|
|
52
|
+
customY2Headers?: any;
|
|
42
53
|
};
|
|
43
54
|
export declare const LineChart: React.FC<LineChartProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),n=require("react"),l=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),i=require("../../../../constants/Theme.js"),o=require("../utils/calcPercentage.js"),a=require("./LineChart.styled.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.PointElement,t.BarElement,t.LineElement,t.ArcElement,t.Filler,t.Title,t.Tooltip,t.Legend);exports.LineChart=t=>{let{scaleText:s,labels:d,canvasHeight:c,datas:u,maintainAspectRatio:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),n=require("react"),l=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),i=require("../../../../constants/Theme.js"),o=require("../utils/calcPercentage.js"),a=require("./LineChart.styled.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.PointElement,t.BarElement,t.LineElement,t.ArcElement,t.Filler,t.Title,t.Tooltip,t.Legend);exports.LineChart=t=>{let{scaleText:s,labels:d,canvasHeight:c,datas:u,maintainAspectRatio:y=!1,stepSize:g,min:p,max:v,isZeroState:x,tension:b,isNewStyles:h,prefixCurrencyInYAxis:C,pointRadius:O,useKFormat:m,lineThickness:S,ticksLabelCallback:j,labelCallback:f,afterBodyCallBack:L,titleTooltipCallback:k,isInternationalStore:R,customYHeaders:w,headerIcons:B=[],legendsAndIconDirection:q="row",hasSecondYAxis:F=!1,min2:I,max2:$,stepSize2:A,prefixCurrencyInY2Axis:z,useKFormat2:T,customY2Headers:D}=t;var E,P,Y,V;const[W,H]=n.useState(null),Z=n.useRef();n.useEffect((()=>{var e,t,n,l;if(null===(l=null===(n=null===(t=null===(e=Z.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===n?void 0:n.ticks)||void 0===l?void 0:l.length){const e=38*Z.current.scales.y.ticks.length;H(e)}}),[Z]);const K=u.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?i.COLORS.content.placeholder:i.COLORS.background.brand,square:e.squareLegends}))),_={labels:d,datasets:u.map(((e,t)=>{var n,l,r;return Object.assign(Object.assign({tension:null!=b?b:.4,fill:e.gradient?"start":0},((e,t)=>{const n={borderColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)};return h?Object.assign({pointStyle:"circle",pointRadius:O||(d&&d.length>10?2.5:4),pointBorderColor:"transparent",pointBackgroundColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)},n):Object.assign({pointRadius:null!=O?O:1},n)})(e.lineColor,e.dotted)),{borderDash:e.dotted?[8,3]:void 0,data:e.data,borderWidth:null!==(l=null!==(n=e.lineWidth)&&void 0!==n?n:S)&&void 0!==l?l:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,W?W-75:150);return t.addColorStop(0,"#F1EEFB"),t.addColorStop(1,"rgba(127, 86, 217, 0)"),t}:null!==(r=e.backgroundColor)&&void 0!==r?r:"transparent",legend:e.legend,yAxisID:e.useSecondYAxis?"y1":"y"})}))},G={maintainAspectRatio:y,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=h&&h,titleFont:()=>({weight:"600",size:14,family:"inter"}),titleColor:()=>i.COLORS.content.primaryInverse,backgroundColor:i.COLORS.content.primary,callbacks:{labelTextColor:()=>i.COLORS.content.primaryInverse,title:k,label:f,afterBody:L},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:x?0:p,max:x?10:v,position:"left",id:"y",ticks:{color:i.COLORS.content.secondary,callback:e=>{var t,n;return m?`${null!==(t=null==s?void 0:s.yPrefix)&&void 0!==t?t:""}${R?o.truncateValueForInternationalStore(e):o.truncateValueForIndianStore(e)}${null!=C?C:""}`:w&&Object.keys(w).length>0?w[e]:`${null!==(n=null==s?void 0:s.yPrefix)&&void 0!==n?n:""}${e}${null!=C?C:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:x?1:g,padding:h?24:0},title:{display:!!(null==s?void 0:s.y),text:null==s?void 0:s.y},grid:{color:i.COLORS.background.base,drawBorder:null===(E=null==s?void 0:s.yDrawBorder)||void 0===E||E}},y1:{beginAtZero:!0,min:x?0:I,max:x?10:$,position:"right",id:"y1",display:F,ticks:{color:i.COLORS.content.secondary,callback:e=>{var t,n;return T?`${null!==(t=null==s?void 0:s.y2Prefix)&&void 0!==t?t:""}${R?o.truncateValueForInternationalStore(e):o.truncateValueForIndianStore(e)}${null!=z?z:""}`:D&&Object.keys(D).length>0?D[e]:`${null!==(n=null==s?void 0:s.y2Prefix)&&void 0!==n?n:""}${e}${null!=z?z:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:x?1:A,padding:h?24:0},title:{display:!!(null==s?void 0:s.y2),text:null==s?void 0:s.y2},grid:{color:"transparent",drawBorder:null===(P=null==s?void 0:s.y2DrawBorder)||void 0===P||P}},x:{ticks:{callback:j,color:i.COLORS.content.secondary,font:{family:"inter",size:12,weight:"400"}},title:{display:!!(null==s?void 0:s.x),text:null==s?void 0:s.x},grid:{display:!1,drawBorder:null!==(Y=null==s?void 0:s.xDrawBorder)&&void 0!==Y&&Y}}}};return e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},y?{}:{height:null!==(V=null!=c?c:W)&&void 0!==V?V:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",justifyContent:"space-between",width:"100%",flexDirection:q}},{children:[e.jsx(a.LegendWrapper,{children:B.map(((t,n)=>e.jsx(a.LegendContainer,{children:t},n)))}),e.jsx(a.LegendWrapper,{children:K.map(((t,n)=>{let{text:l,color:i,square:o}=t;return l?e.jsxs(a.LegendContainer,{children:[e.jsx(a.LegendColor,{color:i,square:o,newStyle:h}),e.jsx(r.BodyTiny,Object.assign({color:"#667085"},{children:l}))]},n):e.jsx(e.Fragment,{})}))})]})),e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(l.Line,{ref:Z,options:G,data:_})}))]}))};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TagProps } from './model';
|
|
2
2
|
export declare const Tag: {
|
|
3
|
-
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),n=require("../
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),n=require("../tooltips/Tooltip.js"),t=require("../TypographyStyle.js"),a=require("./model.js"),r=require("./Tag.styled.js"),s=require("./themes.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=c(i);const l=i=>{let{tagText:c,LeadingIcon:l,TrailingIcon:d,onLeadingIconClicked:g,leadingIconId:p,trailingIconId:j,onTrailingIconClicked:u,theme:b="light",type:h="neutral",variant:m="regular",version:x,cursor:O,alignIcon:y,noBorder:T,tagHtmlText:I,contentPadding:C,leadingIconTooltip:f,trailingIconTooltip:w}=i,v=c;const N=b;let k=h;a.ValidTagTypeMap[m][h]||(k="neutral"),"circle"===m&&"number"==typeof v&&v>99&&(v="99+");const q={height:"compressed"===m?12:16,width:"compressed"===m?12:16,color:s.getTagIconColor(b,k),style:{display:"block"}};return e.jsx(r.Tag,Object.assign({cursor:O,theme:N,type:h,variant:m,version:x,alignIcon:y,noBorder:T,contentPadding:C},{children:e.jsxs("div",Object.assign({className:"container"},{children:[l&&(f?e.jsx(n.Tooltip,Object.assign({},f,{children:e.jsx("button",Object.assign({className:"icon-leading",onClick:g,id:`${p}-wrapper`||"leading-icon-wrapper"},{children:o.default.createElement(l,Object.assign(Object.assign({},q),{id:p||"leading-icon"}))}))})):e.jsx("button",Object.assign({className:"icon-leading",onClick:g,id:`${p}-wrapper`||"leading-icon-wrapper"},{children:o.default.createElement(l,Object.assign(Object.assign({},q),{id:p||"leading-icon"}))}))),I&&("ai"===h&&"light"===b?e.jsx(t.AiBodyCaption,{children:I}):e.jsx(t.BodyCaption,Object.assign({className:"text"},{children:I}))),!I&&""!==v&&("ai"===h&&"light"===b?e.jsx(t.AiBodyCaption,{children:v}):e.jsx(t.BodyCaption,Object.assign({className:"text"},{children:v}))),d&&(w?e.jsx(n.Tooltip,Object.assign({},w,{children:e.jsx("button",Object.assign({className:"icon-trailing",onClick:u,id:`${j}-wrapper`||"trailing-icon-wrapper"},{children:o.default.createElement(d,Object.assign(Object.assign({},q),{id:j||"trailing-icon"}))}))})):e.jsx("button",Object.assign({className:"icon-trailing",onClick:u,id:`${j}-wrapper`||"trailing-icon-wrapper"},{children:o.default.createElement(d,Object.assign(Object.assign({},q),{id:j||"trailing-icon"}))})))]}))}))};l.displayName="Tag",exports.Tag=l;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { ComponentMeta, ComponentStory } from '@storybook/react';
|
|
2
|
+
declare const _default: ComponentMeta<{
|
|
3
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
displayName: string;
|
|
5
|
+
}>;
|
|
6
|
+
export default _default;
|
|
7
|
+
export declare const Default: ComponentStory<{
|
|
8
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
displayName: string;
|
|
10
|
+
}>;
|
|
11
|
+
export declare const WithIcons: ComponentStory<{
|
|
12
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
displayName: string;
|
|
14
|
+
}>;
|
|
15
|
+
export declare const WithIconTooltips: ComponentStory<{
|
|
16
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
displayName: string;
|
|
18
|
+
}>;
|
|
19
|
+
export declare const DarkTheme: ComponentStory<{
|
|
20
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
displayName: string;
|
|
22
|
+
}>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { MouseEventHandler } from 'react';
|
|
3
|
+
import { TooltipProps } from '../tooltips/Tooltip';
|
|
3
4
|
export type TagTheme = 'light' | 'dark';
|
|
4
5
|
export type TagVariant = 'regular' | 'circle' | 'compressed';
|
|
5
6
|
export type TagType = 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
|
|
@@ -62,9 +63,14 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
62
63
|
*/
|
|
63
64
|
trailingIconId?: string;
|
|
64
65
|
/**
|
|
65
|
-
* The
|
|
66
|
+
* The right icon on click event, defaults to () => {}
|
|
66
67
|
*/
|
|
67
68
|
onTrailingIconClicked?: MouseEventHandler<HTMLButtonElement>;
|
|
69
|
+
/**
|
|
70
|
+
* Tooltip props for the trailing icon
|
|
71
|
+
* @default undefined
|
|
72
|
+
*/
|
|
73
|
+
trailingIconTooltip?: Omit<TooltipProps, 'children'>;
|
|
68
74
|
/**
|
|
69
75
|
* The icon component that is to the left of the text
|
|
70
76
|
* Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
|
|
@@ -80,6 +86,11 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
80
86
|
* @default leading-icon
|
|
81
87
|
*/
|
|
82
88
|
leadingIconId?: string;
|
|
89
|
+
/**
|
|
90
|
+
* Tooltip props for the leading icon
|
|
91
|
+
* @default undefined
|
|
92
|
+
*/
|
|
93
|
+
leadingIconTooltip?: Omit<TooltipProps, 'children'>;
|
|
83
94
|
tagText: string | number;
|
|
84
95
|
version?: '1.0' | '2.0';
|
|
85
96
|
cursor?: string;
|
|
@@ -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;
|
|
@@ -11,14 +11,18 @@ export type LineChartProps = {
|
|
|
11
11
|
legend?: string;
|
|
12
12
|
lineWidth?: number;
|
|
13
13
|
squareLegends?: boolean;
|
|
14
|
+
useSecondYAxis?: boolean;
|
|
14
15
|
}[];
|
|
15
16
|
labels: Array<string>;
|
|
16
17
|
scaleText?: {
|
|
17
18
|
x?: string;
|
|
18
19
|
y?: string;
|
|
19
20
|
yPrefix?: string;
|
|
21
|
+
y2?: string;
|
|
22
|
+
y2Prefix?: string;
|
|
20
23
|
xDrawBorder?: boolean;
|
|
21
24
|
yDrawBorder?: boolean;
|
|
25
|
+
y2DrawBorder?: boolean;
|
|
22
26
|
};
|
|
23
27
|
legends: Array<string>;
|
|
24
28
|
stepSize?: number;
|
|
@@ -39,5 +43,12 @@ export type LineChartProps = {
|
|
|
39
43
|
customYHeaders?: any;
|
|
40
44
|
legendsAndIconDirection?: 'row-reverse' | 'row';
|
|
41
45
|
headerIcons?: React.ReactNode[];
|
|
46
|
+
hasSecondYAxis?: boolean;
|
|
47
|
+
min2?: number;
|
|
48
|
+
max2?: number;
|
|
49
|
+
stepSize2?: number;
|
|
50
|
+
prefixCurrencyInY2Axis?: string;
|
|
51
|
+
useKFormat2?: boolean;
|
|
52
|
+
customY2Headers?: any;
|
|
42
53
|
};
|
|
43
54
|
export declare const LineChart: React.FC<LineChartProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import{Chart as
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import{Chart as i,CategoryScale as n,LinearScale as o,PointElement as r,BarElement as a,LineElement as s,ArcElement as d,Filler as c,Title as u,Tooltip as p,Legend as y}from"chart.js";import{useState as g,useRef as m,useEffect as v}from"react";import{Line as b}from"react-chartjs-2";import{BodyTiny as h}from"../../../TypographyStyle.js";import{COLORS as f}from"../../../../constants/Theme.js";import{truncateValueForInternationalStore as x,truncateValueForIndianStore as k}from"../utils/calcPercentage.js";import{LegendWrapper as C,LegendContainer as j,LegendColor as w}from"./LineChart.styled.js";i.register(n,o,r,a,s,d,c,u,p,y);const S=i=>{let{scaleText:n,labels:o,canvasHeight:r,datas:a,maintainAspectRatio:s=!1,stepSize:d,min:c,max:u,isZeroState:p,tension:y,isNewStyles:S,prefixCurrencyInYAxis:B,pointRadius:O,useKFormat:$,lineThickness:A,ticksLabelCallback:z,labelCallback:D,afterBodyCallBack:I,titleTooltipCallback:F,isInternationalStore:T,customYHeaders:Y,headerIcons:P=[],legendsAndIconDirection:R="row",hasSecondYAxis:q=!1,min2:L,max2:H,stepSize2:Z,prefixCurrencyInY2Axis:E,useKFormat2:K,customY2Headers:W}=i;var G,N,J,M;const[Q,U]=g(null),V=m();v((()=>{var e,t,l,i;if(null===(i=null===(l=null===(t=null===(e=V.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===l?void 0:l.ticks)||void 0===i?void 0:i.length){const e=38*V.current.scales.y.ticks.length;U(e)}}),[V]);const X=a.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?f.content.placeholder:f.background.brand,square:e.squareLegends}))),_={labels:o,datasets:a.map(((e,t)=>{var l,i,n;return Object.assign(Object.assign({tension:null!=y?y:.4,fill:e.gradient?"start":0},((e,t)=>{const l={borderColor:e||(t?f.content.placeholder:f.background.brand)};return S?Object.assign({pointStyle:"circle",pointRadius:O||(o&&o.length>10?2.5:4),pointBorderColor:"transparent",pointBackgroundColor:e||(t?f.content.placeholder:f.background.brand)},l):Object.assign({pointRadius:null!=O?O:1},l)})(e.lineColor,e.dotted)),{borderDash:e.dotted?[8,3]:void 0,data:e.data,borderWidth:null!==(i=null!==(l=e.lineWidth)&&void 0!==l?l:A)&&void 0!==i?i:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,Q?Q-75:150);return t.addColorStop(0,"#F1EEFB"),t.addColorStop(1,"rgba(127, 86, 217, 0)"),t}:null!==(n=e.backgroundColor)&&void 0!==n?n:"transparent",legend:e.legend,yAxisID:e.useSecondYAxis?"y1":"y"})}))},ee={maintainAspectRatio:s,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=S&&S,titleFont:()=>({weight:"600",size:14,family:"inter"}),titleColor:()=>f.content.primaryInverse,backgroundColor:f.content.primary,callbacks:{labelTextColor:()=>f.content.primaryInverse,title:F,label:D,afterBody:I},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:p?0:c,max:p?10:u,position:"left",id:"y",ticks:{color:f.content.secondary,callback:e=>{var t,l;return $?`${null!==(t=null==n?void 0:n.yPrefix)&&void 0!==t?t:""}${T?x(e):k(e)}${null!=B?B:""}`:Y&&Object.keys(Y).length>0?Y[e]:`${null!==(l=null==n?void 0:n.yPrefix)&&void 0!==l?l:""}${e}${null!=B?B:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:p?1:d,padding:S?24:0},title:{display:!!(null==n?void 0:n.y),text:null==n?void 0:n.y},grid:{color:f.background.base,drawBorder:null===(G=null==n?void 0:n.yDrawBorder)||void 0===G||G}},y1:{beginAtZero:!0,min:p?0:L,max:p?10:H,position:"right",id:"y1",display:q,ticks:{color:f.content.secondary,callback:e=>{var t,l;return K?`${null!==(t=null==n?void 0:n.y2Prefix)&&void 0!==t?t:""}${T?x(e):k(e)}${null!=E?E:""}`:W&&Object.keys(W).length>0?W[e]:`${null!==(l=null==n?void 0:n.y2Prefix)&&void 0!==l?l:""}${e}${null!=E?E:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:p?1:Z,padding:S?24:0},title:{display:!!(null==n?void 0:n.y2),text:null==n?void 0:n.y2},grid:{color:"transparent",drawBorder:null===(N=null==n?void 0:n.y2DrawBorder)||void 0===N||N}},x:{ticks:{callback:z,color:f.content.secondary,font:{family:"inter",size:12,weight:"400"}},title:{display:!!(null==n?void 0:n.x),text:null==n?void 0:n.x},grid:{display:!1,drawBorder:null!==(J=null==n?void 0:n.xDrawBorder)&&void 0!==J&&J}}}};return e("div",Object.assign({style:Object.assign(Object.assign({},s?{}:{height:null!==(M=null!=r?r:Q)&&void 0!==M?M:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[e("div",Object.assign({style:{display:"flex",justifyContent:"space-between",width:"100%",flexDirection:R}},{children:[t(C,{children:P.map(((e,l)=>t(j,{children:e},l)))}),t(C,{children:X.map(((i,n)=>{let{text:o,color:r,square:a}=i;return o?e(j,{children:[t(w,{color:r,square:a,newStyle:S}),t(h,Object.assign({color:"#667085"},{children:o}))]},n):t(l,{})}))})]})),t("div",Object.assign({style:{flex:1}},{children:t(b,{ref:V,options:ee,data:_})}))]}))};export{S as LineChart};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TagProps } from './model';
|
|
2
2
|
export declare const Tag: {
|
|
3
|
-
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as i,jsxs as e}from"react/jsx-runtime";import n from"react";import{Tooltip as t}from"../tooltips/Tooltip.js";import{AiBodyCaption as a,BodyCaption as c}from"../TypographyStyle.js";import{ValidTagTypeMap as r}from"./model.js";import{Tag as o}from"./Tag.styled.js";import{getTagIconColor as s}from"./themes.js";const l=l=>{let{tagText:g,LeadingIcon:d,TrailingIcon:p,onLeadingIconClicked:m,leadingIconId:b,trailingIconId:j,onTrailingIconClicked:h,theme:O="light",type:u="neutral",variant:I="regular",version:T,cursor:y,alignIcon:w,noBorder:f,tagHtmlText:N,contentPadding:k,leadingIconTooltip:x,trailingIconTooltip:C}=l,v=g;const E=O;let $=u;r[I][u]||($="neutral"),"circle"===I&&"number"==typeof v&&v>99&&(v="99+");const B={height:"compressed"===I?12:16,width:"compressed"===I?12:16,color:s(O,$),style:{display:"block"}};return i(o,Object.assign({cursor:y,theme:E,type:u,variant:I,version:T,alignIcon:w,noBorder:f,contentPadding:k},{children:e("div",Object.assign({className:"container"},{children:[d&&(x?i(t,Object.assign({},x,{children:i("button",Object.assign({className:"icon-leading",onClick:m,id:`${b}-wrapper`||"leading-icon-wrapper"},{children:n.createElement(d,Object.assign(Object.assign({},B),{id:b||"leading-icon"}))}))})):i("button",Object.assign({className:"icon-leading",onClick:m,id:`${b}-wrapper`||"leading-icon-wrapper"},{children:n.createElement(d,Object.assign(Object.assign({},B),{id:b||"leading-icon"}))}))),N&&("ai"===u&&"light"===O?i(a,{children:N}):i(c,Object.assign({className:"text"},{children:N}))),!N&&""!==v&&("ai"===u&&"light"===O?i(a,{children:v}):i(c,Object.assign({className:"text"},{children:v}))),p&&(C?i(t,Object.assign({},C,{children:i("button",Object.assign({className:"icon-trailing",onClick:h,id:`${j}-wrapper`||"trailing-icon-wrapper"},{children:n.createElement(p,Object.assign(Object.assign({},B),{id:j||"trailing-icon"}))}))})):i("button",Object.assign({className:"icon-trailing",onClick:h,id:`${j}-wrapper`||"trailing-icon-wrapper"},{children:n.createElement(p,Object.assign(Object.assign({},B),{id:j||"trailing-icon"}))})))]}))}))};l.displayName="Tag";export{l as Tag};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { ComponentMeta, ComponentStory } from '@storybook/react';
|
|
2
|
+
declare const _default: ComponentMeta<{
|
|
3
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
displayName: string;
|
|
5
|
+
}>;
|
|
6
|
+
export default _default;
|
|
7
|
+
export declare const Default: ComponentStory<{
|
|
8
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
displayName: string;
|
|
10
|
+
}>;
|
|
11
|
+
export declare const WithIcons: ComponentStory<{
|
|
12
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
displayName: string;
|
|
14
|
+
}>;
|
|
15
|
+
export declare const WithIconTooltips: ComponentStory<{
|
|
16
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
displayName: string;
|
|
18
|
+
}>;
|
|
19
|
+
export declare const DarkTheme: ComponentStory<{
|
|
20
|
+
({ tagText, LeadingIcon, TrailingIcon, onLeadingIconClicked, leadingIconId, trailingIconId, onTrailingIconClicked, theme, type, variant, version, cursor, alignIcon, noBorder, tagHtmlText, contentPadding, leadingIconTooltip, trailingIconTooltip, }: import("./model").TagProps): import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
displayName: string;
|
|
22
|
+
}>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { MouseEventHandler } from 'react';
|
|
3
|
+
import { TooltipProps } from '../tooltips/Tooltip';
|
|
3
4
|
export type TagTheme = 'light' | 'dark';
|
|
4
5
|
export type TagVariant = 'regular' | 'circle' | 'compressed';
|
|
5
6
|
export type TagType = 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
|
|
@@ -62,9 +63,14 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
62
63
|
*/
|
|
63
64
|
trailingIconId?: string;
|
|
64
65
|
/**
|
|
65
|
-
* The
|
|
66
|
+
* The right icon on click event, defaults to () => {}
|
|
66
67
|
*/
|
|
67
68
|
onTrailingIconClicked?: MouseEventHandler<HTMLButtonElement>;
|
|
69
|
+
/**
|
|
70
|
+
* Tooltip props for the trailing icon
|
|
71
|
+
* @default undefined
|
|
72
|
+
*/
|
|
73
|
+
trailingIconTooltip?: Omit<TooltipProps, 'children'>;
|
|
68
74
|
/**
|
|
69
75
|
* The icon component that is to the left of the text
|
|
70
76
|
* Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
|
|
@@ -80,6 +86,11 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
80
86
|
* @default leading-icon
|
|
81
87
|
*/
|
|
82
88
|
leadingIconId?: string;
|
|
89
|
+
/**
|
|
90
|
+
* Tooltip props for the leading icon
|
|
91
|
+
* @default undefined
|
|
92
|
+
*/
|
|
93
|
+
leadingIconTooltip?: Omit<TooltipProps, 'children'>;
|
|
83
94
|
tagText: string | number;
|
|
84
95
|
version?: '1.0' | '2.0';
|
|
85
96
|
cursor?: string;
|