@bikdotai/bik-component-library 0.0.643-ddli-beta.3 → 0.0.643-zero.1
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/analytics-chips-and-dropdowns/chart/LineChart/LineChart.d.ts +0 -1
- package/dist/cjs/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js +1 -1
- package/dist/cjs/components/dropdown/Dropdown.d.ts +0 -1
- package/dist/cjs/components/dropdown/Dropdown.js +1 -1
- package/dist/cjs/components/zeroState/ZeroState.d.ts +2 -0
- package/dist/cjs/components/zeroState/ZeroState.js +3 -3
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.d.ts +0 -1
- package/dist/esm/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js +1 -1
- package/dist/esm/components/dropdown/Dropdown.d.ts +0 -1
- package/dist/esm/components/dropdown/Dropdown.js +1 -1
- package/dist/esm/components/zeroState/ZeroState.d.ts +2 -0
- package/dist/esm/components/zeroState/ZeroState.js +5 -5
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),l=require("react"),r=require("react-chartjs-2"),n=require("../../../TypographyStyle.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),l=require("react"),r=require("react-chartjs-2"),n=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:g=!1,stepSize:p,min:y,max:b,isZeroState:v,tension:C,isNewStyles:O,prefixCurrencyInYAxis:h,pointRadius:x,useKFormat:S,lineThickness:j,ticksLabelCallback:m,labelCallback:L,afterBodyCallBack:f,titleTooltipCallback:k,isInternationalStore:R}=t;var q,B,w;const[F,T]=l.useState(null),E=l.useRef();l.useEffect((()=>{var e,t,l,r;if(null===(r=null===(l=null===(t=null===(e=E.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===l?void 0:l.ticks)||void 0===r?void 0:r.length){const e=38*E.current.scales.y.ticks.length;T(e)}}),[E]);const z=u.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?i.COLORS.content.placeholder:i.COLORS.background.brand,square:e.squareLegends}))),I={labels:d,datasets:u.map(((e,t)=>{var l,r,n;return Object.assign(Object.assign({tension:null!=C?C:.4,fill:e.gradient?"start":0},((e,t)=>{const l={borderColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)};return O?Object.assign({pointStyle:"circle",pointRadius:x||(d&&d.length>10?2.5:4),pointBorderColor:"transparent",pointBackgroundColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)},l):Object.assign({pointRadius:null!=x?x:1},l)})(e.lineColor,e.dotted)),{borderDash:e.dotted?[8,3]:void 0,data:e.data,borderWidth:null!==(r=null!==(l=e.lineWidth)&&void 0!==l?l:j)&&void 0!==r?r:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,F?F-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})}))},$={maintainAspectRatio:g,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=O&&O,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:L,afterBody:f},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:v?0:y,max:v?10:b,ticks:{color:i.COLORS.content.secondary,callback:e=>{var t,l;return S?`${null!==(t=null==s?void 0:s.yPrefix)&&void 0!==t?t:""}${R?o.truncateValueForInternationalStore(e):o.truncateValueForIndianStore(e)}${null!=h?h:""}`:`${null!==(l=null==s?void 0:s.yPrefix)&&void 0!==l?l:""}${e}${null!=h?h:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:v?1:p,padding:O?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===(q=null==s?void 0:s.yDrawBorder)||void 0===q||q}},x:{ticks:{callback:m,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!==(B=null==s?void 0:s.xDrawBorder)&&void 0!==B&&B}}}};return e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},g?{}:{height:null!==(w=null!=c?c:F)&&void 0!==w?w:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[e.jsx(a.LegendWrapper,{children:z.map(((t,l)=>{let{text:r,color:i,square:o}=t;return r?e.jsxs(a.LegendContainer,{children:[e.jsx(a.LegendColor,{color:i,square:o,newStyle:O}),e.jsx(n.BodyTiny,Object.assign({color:"#667085"},{children:r}))]},l):e.jsx(e.Fragment,{})}))}),e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(r.Line,{ref:E,options:$,data:I})}))]}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),o=require("../../constants/Theme.js"),i=require("../../assets/icons/chevronDown.svg.js"),r=require("../input/Input.js"),l=require("../input/context/InputStyleProvider.js"),s=require("./ChipInput.js"),d=require("./DropdownPopover/index.js"),a=require("./OpenedDropdown/utils/iterationOnOptions.js");function u(){}const c=c=>{var p,h,v,g,j,{placeHolder:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),o=require("../../constants/Theme.js"),i=require("../../assets/icons/chevronDown.svg.js"),r=require("../input/Input.js"),l=require("../input/context/InputStyleProvider.js"),s=require("./ChipInput.js"),d=require("./DropdownPopover/index.js"),a=require("./OpenedDropdown/utils/iterationOnOptions.js");function u(){}const c=c=>{var p,h,v,g,j,{placeHolder:f,size:x,onSelect:w,defaultOptions:S,disabled:b,noErrorHint:I,placeHolderHeight:O,showPlaceholderWhenSelected:y=!1,inputStyle:D={},inputType:m="default",onDeleteChip:q,truncatedText:H,showLeadingIconInPlaceholder:C=!1}=c,P=e.__rest(c,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder"]);const[T,E]=n.useState(!1),_=null!=x?x:"default",z=n.useRef(),[W,A]=n.useState(null!=S?S:[]);n.useEffect((()=>{var e;const t=[];null===(e=null==P?void 0:P.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&t.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&t.push(e)})),A([...t])}),[P.options]),n.useEffect((()=>{S&&A([...S])}),[S]);const L=a.getSelectedOptionsAsText(W);return t.jsx(l.InputStyleContext.Provider,Object.assign({value:{InputWrapper:Object.assign({height:O||("small"===_?32:48),width:null!==(h=null!==(p=P.buttonWidth)&&void 0!==p?p:P.width)&&void 0!==h?h:"100%",zIndex:1,cursor:"pointer",padding:"6px 8px"},D),input:{minHeight:"100%"}}},{children:t.jsxs(d.DropdownPopover,Object.assign({"data-test":P["data-test"],ref:z,onSelect:function(e){Array.isArray(e)?A([...e]):A([e]),null==w||w(e)},disabled:b,onDropdownVisbilityChange:e=>E(e)},P,{children:["default"==m&&t.jsx(r.Input,{version:P.version,noErrorHint:I,state:b?"disabled":"none",value:y?f:null!=L?L:"",errorMessage:P.error,variant:_,placeholder:null!=f?f:"Select an option",width:null!==(v=P.width)&&void 0!==v?v:"100%",onChangeText:u,leftIcon:C&&(null===(g=W[0])||void 0===g?void 0:g.leadingIcon)?{icon:()=>{var e;return t.jsx(t.Fragment,{children:null===(e=W[0])||void 0===e?void 0:e.leadingIcon})}}:void 0,rightIcon:{icon:()=>t.jsx(i.default,{style:{transform:T?"rotate(180deg)":"rotate(0deg)"},onClick:u,width:"small"===_?20:24,height:"small"===_?20:24,color:o.COLORS.content.primary})},truncateText:null==H||H}),"chip"==m&&t.jsx(s.default,{placeholder:null!=f?f:"Select options",chips:W,onDeleteChip:e=>{null==q||q(e)},isDropdownOpened:T,sizeToUse:_,containerStyle:{width:null!==(j=P.width)&&void 0!==j?j:"100%",cursor:"pointer"}})]}))}))};c.displayName="Dropdown",exports.Dropdown=c;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { ButtonProps } from '../button/model';
|
|
2
3
|
export declare const ZeroState: React.FC<{
|
|
3
4
|
isLoading?: boolean;
|
|
4
5
|
title: string;
|
|
5
6
|
subTitle?: string;
|
|
6
7
|
IconHolderStyle?: React.CSSProperties;
|
|
7
8
|
style?: React.CSSProperties /** now this component is extendable through styled-component */;
|
|
9
|
+
actionButton?: ButtonProps;
|
|
8
10
|
}>;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("styled-components"),r=require("../spinner/Spinner.js"),i=require("../TypographyStyle.js"),s=require("../../constants/Theme.js"),l=require("../../assets/icons/alert.svg.js"),o=require("../button/Button.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=a(n);const u=c.default.div`
|
|
2
2
|
background: ${s.COLORS.surface.standard};
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
7
|
flex: 1;
|
|
8
|
-
`,c
|
|
8
|
+
`,d=c.default.div`
|
|
9
9
|
background: ${s.COLORS.background.base};
|
|
10
10
|
width: 48px;
|
|
11
11
|
height: 48px;
|
|
@@ -14,4 +14,4 @@
|
|
|
14
14
|
align-items: center;
|
|
15
15
|
justify-content: center;
|
|
16
16
|
border-radius: 24px;
|
|
17
|
-
`;exports.ZeroState=
|
|
17
|
+
`;exports.ZeroState=n=>{var{subTitle:a,title:c,IconHolderStyle:j,style:g,isLoading:y}=n,p=e.__rest(n,["subTitle","title","IconHolderStyle","style","isLoading"]);return t.jsxs(u,Object.assign({style:null!=g?g:{}},{children:[y?t.jsx(r.Spinner,{size:"large",color:s.COLORS.stroke.brand}):t.jsx(d,Object.assign({style:null!=j?j:{}},{children:t.jsx(l.default,{color:s.COLORS.content.placeholder,height:24,width:24})})),t.jsx(i.TitleRegular,Object.assign({style:{marginTop:8,color:s.COLORS.content.primary}},{children:y?"Loading...":c||"No results found"})),!!a&&!y&&t.jsx(i.BodyCaption,Object.assign({style:{marginTop:4,color:s.COLORS.content.secondary,textAlign:"center",maxWidth:184}},{children:a})),!!(null==p?void 0:p.actionButton)&&t.jsx(o.Button,Object.assign({},null==p?void 0:p.actionButton))]}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import{Chart as o,CategoryScale as r,LinearScale as n,PointElement as i,BarElement as a,LineElement as s,ArcElement as d,Filler as c,Title as u,Tooltip as p,Legend as g}from"chart.js";import{useState as b,useRef as
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import{Chart as o,CategoryScale as r,LinearScale as n,PointElement as i,BarElement as a,LineElement as s,ArcElement as d,Filler as c,Title as u,Tooltip as p,Legend as g}from"chart.js";import{useState as b,useRef as y,useEffect as m}from"react";import{Line as v}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";o.register(r,n,i,a,s,d,c,u,p,g);const B=o=>{let{scaleText:r,labels:n,canvasHeight:i,datas:a,maintainAspectRatio:s=!1,stepSize:d,min:c,max:u,isZeroState:p,tension:g,isNewStyles:B,prefixCurrencyInYAxis:S,pointRadius:O,useKFormat:z,lineThickness:T,ticksLabelCallback:$,labelCallback:F,afterBodyCallBack:R,titleTooltipCallback:q,isInternationalStore:A}=o;var D,I,L;const[P,E]=b(null),W=y();m((()=>{var e,t,l,o;if(null===(o=null===(l=null===(t=null===(e=W.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===l?void 0:l.ticks)||void 0===o?void 0:o.length){const e=38*W.current.scales.y.ticks.length;E(e)}}),[W]);const Z=a.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?f.content.placeholder:f.background.brand,square:e.squareLegends}))),G={labels:n,datasets:a.map(((e,t)=>{var l,o,r;return Object.assign(Object.assign({tension:null!=g?g:.4,fill:e.gradient?"start":0},((e,t)=>{const l={borderColor:e||(t?f.content.placeholder:f.background.brand)};return B?Object.assign({pointStyle:"circle",pointRadius:O||(n&&n.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!==(o=null!==(l=e.lineWidth)&&void 0!==l?l:T)&&void 0!==o?o:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,P?P-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})}))},H={maintainAspectRatio:s,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=B&&B,titleFont:()=>({weight:"600",size:14,family:"inter"}),titleColor:()=>f.content.primaryInverse,backgroundColor:f.content.primary,callbacks:{labelTextColor:()=>f.content.primaryInverse,title:q,label:F,afterBody:R},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:p?0:c,max:p?10:u,ticks:{color:f.content.secondary,callback:e=>{var t,l;return z?`${null!==(t=null==r?void 0:r.yPrefix)&&void 0!==t?t:""}${A?x(e):k(e)}${null!=S?S:""}`:`${null!==(l=null==r?void 0:r.yPrefix)&&void 0!==l?l:""}${e}${null!=S?S:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:p?1:d,padding:B?24:0},title:{display:!!(null==r?void 0:r.y),text:null==r?void 0:r.y},grid:{color:f.background.base,drawBorder:null===(D=null==r?void 0:r.yDrawBorder)||void 0===D||D}},x:{ticks:{callback:$,color:f.content.secondary,font:{family:"inter",size:12,weight:"400"}},title:{display:!!(null==r?void 0:r.x),text:null==r?void 0:r.x},grid:{display:!1,drawBorder:null!==(I=null==r?void 0:r.xDrawBorder)&&void 0!==I&&I}}}};return e("div",Object.assign({style:Object.assign(Object.assign({},s?{}:{height:null!==(L=null!=i?i:P)&&void 0!==L?L:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[t(C,{children:Z.map(((o,r)=>{let{text:n,color:i,square:a}=o;return n?e(j,{children:[t(w,{color:i,square:a,newStyle:B}),t(h,Object.assign({color:"#667085"},{children:n}))]},r):t(l,{})}))}),t("div",Object.assign({style:{flex:1}},{children:t(v,{ref:W,options:H,data:G})}))]}))};export{B as LineChart};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as o,jsxs as
|
|
1
|
+
import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as o,jsxs as t,Fragment as n}from"react/jsx-runtime";import{useState as i,useRef as l,useEffect as r}from"react";import{COLORS as s}from"../../constants/Theme.js";import d from"../../assets/icons/chevronDown.svg.js";import{Input as a}from"../input/Input.js";import{InputStyleContext as p}from"../input/context/InputStyleProvider.js";import c from"./ChipInput.js";import{DropdownPopover as u}from"./DropdownPopover/index.js";import{getSelectedOptionsAsText as h}from"./OpenedDropdown/utils/iterationOnOptions.js";function m(){}const v=v=>{var f,g,w,b,j,{placeHolder:I,size:y,onSelect:x,defaultOptions:O,disabled:S,noErrorHint:H,placeHolderHeight:D,showPlaceholderWhenSelected:T=!1,inputStyle:C={},inputType:P="default",onDeleteChip:E,truncatedText:z,showLeadingIconInPlaceholder:W=!1}=v,A=e(v,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder"]);const[L,_]=i(!1),k=null!=y?y:"default",M=l(),[N,U]=i(null!=O?O:[]);r((()=>{var e;const o=[];null===(e=null==A?void 0:A.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&o.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&o.push(e)})),U([...o])}),[A.options]),r((()=>{O&&U([...O])}),[O]);const V=h(N);return o(p.Provider,Object.assign({value:{InputWrapper:Object.assign({height:D||("small"===k?32:48),width:null!==(g=null!==(f=A.buttonWidth)&&void 0!==f?f:A.width)&&void 0!==g?g:"100%",zIndex:1,cursor:"pointer",padding:"6px 8px"},C),input:{minHeight:"100%"}}},{children:t(u,Object.assign({"data-test":A["data-test"],ref:M,onSelect:function(e){Array.isArray(e)?U([...e]):U([e]),null==x||x(e)},disabled:S,onDropdownVisbilityChange:e=>_(e)},A,{children:["default"==P&&o(a,{version:A.version,noErrorHint:H,state:S?"disabled":"none",value:T?I:null!=V?V:"",errorMessage:A.error,variant:k,placeholder:null!=I?I:"Select an option",width:null!==(w=A.width)&&void 0!==w?w:"100%",onChangeText:m,leftIcon:W&&(null===(b=N[0])||void 0===b?void 0:b.leadingIcon)?{icon:()=>{var e;return o(n,{children:null===(e=N[0])||void 0===e?void 0:e.leadingIcon})}}:void 0,rightIcon:{icon:()=>o(d,{style:{transform:L?"rotate(180deg)":"rotate(0deg)"},onClick:m,width:"small"===k?20:24,height:"small"===k?20:24,color:s.content.primary})},truncateText:null==z||z}),"chip"==P&&o(c,{placeholder:null!=I?I:"Select options",chips:N,onDeleteChip:e=>{null==E||E(e)},isDropdownOpened:L,sizeToUse:k,containerStyle:{width:null!==(j=A.width)&&void 0!==j?j:"100%",cursor:"pointer"}})]}))}))};v.displayName="Dropdown";export{v as Dropdown};
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { ButtonProps } from '../button/model';
|
|
2
3
|
export declare const ZeroState: React.FC<{
|
|
3
4
|
isLoading?: boolean;
|
|
4
5
|
title: string;
|
|
5
6
|
subTitle?: string;
|
|
6
7
|
IconHolderStyle?: React.CSSProperties;
|
|
7
8
|
style?: React.CSSProperties /** now this component is extendable through styled-component */;
|
|
9
|
+
actionButton?: ButtonProps;
|
|
8
10
|
}>;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import{jsxs as e,jsx as
|
|
2
|
-
background: ${
|
|
1
|
+
import{__rest as t}from"../../_virtual/_tslib.js";import{jsxs as e,jsx as n}from"react/jsx-runtime";import o from"styled-components";import{Spinner as r}from"../spinner/Spinner.js";import{TitleRegular as i,BodyCaption as s}from"../TypographyStyle.js";import{COLORS as l}from"../../constants/Theme.js";import c from"../../assets/icons/alert.svg.js";import{Button as a}from"../button/Button.js";const d=o.div`
|
|
2
|
+
background: ${l.surface.standard};
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
7
|
flex: 1;
|
|
8
|
-
`,
|
|
9
|
-
background: ${
|
|
8
|
+
`,m=o.div`
|
|
9
|
+
background: ${l.background.base};
|
|
10
10
|
width: 48px;
|
|
11
11
|
height: 48px;
|
|
12
12
|
display: flex;
|
|
@@ -14,4 +14,4 @@ import{jsxs as e,jsx as t}from"react/jsx-runtime";import n from"styled-component
|
|
|
14
14
|
align-items: center;
|
|
15
15
|
justify-content: center;
|
|
16
16
|
border-radius: 24px;
|
|
17
|
-
`,
|
|
17
|
+
`,u=o=>{var{subTitle:u,title:p,IconHolderStyle:g,style:y,isLoading:f}=o,b=t(o,["subTitle","title","IconHolderStyle","style","isLoading"]);return e(d,Object.assign({style:null!=y?y:{}},{children:[f?n(r,{size:"large",color:l.stroke.brand}):n(m,Object.assign({style:null!=g?g:{}},{children:n(c,{color:l.content.placeholder,height:24,width:24})})),n(i,Object.assign({style:{marginTop:8,color:l.content.primary}},{children:f?"Loading...":p||"No results found"})),!!u&&!f&&n(s,Object.assign({style:{marginTop:4,color:l.content.secondary,textAlign:"center",maxWidth:184}},{children:u})),!!(null==b?void 0:b.actionButton)&&n(a,Object.assign({},null==b?void 0:b.actionButton))]}))};export{u as ZeroState};
|