@bikdotai/bik-component-library 0.0.1-chips-beta → 0.0.1-dropdown-beta

package/dist/esm/components/template-preview/utils/TemplateHelperUtils.d.ts

@@ -0,0 +1,6 @@
+import { templateVariable } from '../models/WhatsAppTemplate';
+export declare class TemplateHelperUtils {
+    fillVariablesValInBodyText(text: string, variableStore: templateVariable[], usePlaceholderName?: boolean): string;
+    getTemplateVariablesFromState(text: string): string[] | undefined;
+    whatsappOnlyFillVariablesValueInBodyText(text: string, variableStore: templateVariable[], usePlaceholderName?: boolean): string;
+}

package/dist/esm/components/template-preview/utils/TemplateHelperUtils.js

@@ -0,0 +1 @@
+import{templateVariablePattern as l,globalVariablePattern as e}from"../constants/regexPatterns.js";class a{fillVariablesValInBodyText(e,a){let i=arguments.length>2&&void 0!==arguments[2]&&arguments[2];const r=e.match(l),t=e.split(l);if(e&&(null==r?void 0:r.length)){return t.map(((l,e)=>{var n,o,v,d,u;const m=null===(n=null==r?void 0:r[e])||void 0===n?void 0:n.replace("{{","").replace("}}","");return t.length-1===e?l:(null===(v=null===(o=null==a?void 0:a[e])||void 0===o?void 0:o.variableName)||void 0===v?void 0:v.trim())===m.trim()||(null===(u=null===(d=null==a?void 0:a[e])||void 0===d?void 0:d.variableVal)||void 0===u?void 0:u.trim())===m.trim()?a[e].editable?`${l}${i?"{{":""}${a[e].variableVal}${i?"}}":""}`:`${l}${i?"{{":""}${a[e].variableName}${i?"}}":""}`:l})).join("")}return e}getTemplateVariablesFromState(l){var a;return null===(a=l.match(e))||void 0===a?void 0:a.map((l=>l.replace("{{","").replace("}}","")))}whatsappOnlyFillVariablesValueInBodyText(e,a){let i=arguments.length>2&&void 0!==arguments[2]&&arguments[2];const r=e.match(l),t=e.split(l);if(e&&(null==r?void 0:r.length)){return t.map(((l,e)=>{var n;const o=null===(n=null==r?void 0:r[e])||void 0===n?void 0:n.replace("{{","").replace("}}","");if(t.length-1===e)return l;const v=a.findIndex((l=>l.variableName===o));if(v>-1){let e=a[v].variableVal;return i||(e=!a[v].variableVal&&a[v].variableName.startsWith("editableVariable")?a[v].variableName:null==e?void 0:e.replace("[[","").replace("]]","")),a[v].editable?`${l}${i?"{{":""}${e}${i?"}}":""}`:`${l}${i?"{{":""}${o}${i?"}}":""}`}return l})).join("")}return e}}export{a as TemplateHelperUtils};

package/dist/esm/components/template-preview/utils/getPreviewPropLen.d.ts

@@ -0,0 +1,2 @@
+import { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';
+export declare const getPreviewPropLen: (props: WhatsappLikePreviewTypes) => number;

package/dist/esm/components/template-preview/utils/getPreviewPropLen.js

@@ -0,0 +1 @@
+const r=r=>Object.keys(r).filter((t=>{const e=r[t];return e&&Array.isArray(e)?!!e.length:!!e})).length;export{r as getPreviewPropLen};

package/dist/esm/components/thumbnail/Thumbnail.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { SIZE } from "../avatar/AvatarHelper";
+export declare enum RATIO {
+    ONE_ONE = "ONE_ONE",
+    VERTICAL = "VERTICAL",
+    HORIZONTAL = "HORIZONTAL"
+}
+export type ThumbnailProps = {
+    size: SIZE;
+    ratio: RATIO;
+    imageUrl: string;
+};
+export declare const Thumbnail: React.FC<ThumbnailProps>;

package/dist/esm/components/thumbnail/Thumbnail.js

@@ -0,0 +1 @@
+import{jsx as i}from"react/jsx-runtime";import{SIZE as t}from"../avatar/AvatarHelper.js";import{THUMBNAIL_SIZE_MAP as e}from"./constants.js";import{ThumbnailStyle as r}from"./Thumbnail.styled.js";var h;!function(i){i.ONE_ONE="ONE_ONE",i.VERTICAL="VERTICAL",i.HORIZONTAL="HORIZONTAL"}(h||(h={}));const o={[h.VERTICAL]:{[t.SMALL]:{width:30,height:40},[t.MEDIUM]:{width:48,height:64},[t.LARGE]:{width:60,height:80}},[h.HORIZONTAL]:{[t.SMALL]:{width:40,height:30},[t.MEDIUM]:{width:64,height:48},[t.LARGE]:{width:80,height:60}},[h.ONE_ONE]:{}},s=t=>{var s,a;return i(r,Object.assign({size:t.size},{children:i("img",{alt:"",width:(null===(s=o[t.ratio][t.size])||void 0===s?void 0:s.width)||e[t.size],height:(null===(a=o[t.ratio][t.size])||void 0===a?void 0:a.height)||e[t.size],style:{borderRadius:t.ratio===h.ONE_ONE?4:0,objectFit:"cover"},src:t.imageUrl})}))};export{h as RATIO,s as Thumbnail};

package/dist/esm/components/thumbnail/Thumbnail.styled.d.ts

@@ -0,0 +1,4 @@
+import { SIZE } from "../avatar/AvatarHelper";
+export declare const ThumbnailStyle: import("styled-components").StyledComponent<"div", any, {
+    size: SIZE;
+}, never>;

package/dist/esm/components/thumbnail/Thumbnail.styled.js

@@ -0,0 +1,10 @@
+import r from"styled-components";import{THUMBNAIL_SIZE_MAP as t}from"./constants.js";import{COLORS as o}from"../../constants/Theme.js";const e=r.div`
+	width: ${r=>t[r.size]+"px"};
+	height: ${r=>t[r.size]+"px"};
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	background-color: ${o.surface.standard};
+	border: 1px solid ${o.stroke.primary};
+	border-radius: 4px;
+`;export{e as ThumbnailStyle};

package/dist/esm/components/thumbnail/constants.d.ts

@@ -0,0 +1,5 @@
+export declare const THUMBNAIL_SIZE_MAP: {
+    SMALL: number;
+    MEDIUM: number;
+    LARGE: number;
+};

package/dist/esm/components/thumbnail/constants.js

@@ -0,0 +1 @@
+import{SIZE as r}from"../avatar/AvatarHelper.js";const a={[r.SMALL]:40,[r.MEDIUM]:64,[r.LARGE]:80};export{a as THUMBNAIL_SIZE_MAP};

package/dist/esm/components/thumbnail/index.d.ts

@@ -0,0 +1 @@
+export * from './Thumbnail';

package/dist/esm/components/toaster/Toaster.d.ts

@@ -0,0 +1,26 @@
+import React, { FunctionComponent } from 'react';
+import { ToastPosition } from 'react-toastify';
+import { IconProps } from 'react-toastify/dist/components';
+export type ToasterButtonProps = {
+    showButton?: boolean;
+    onButtonClick?: any;
+    buttonText?: string;
+};
+export type ToasterProps = {
+    text: string;
+    position?: ToastPosition;
+    type?: 'info' | 'success' | 'error' | 'default';
+    closeOnClick?: boolean;
+    hideProgressBar?: boolean;
+    autoClose?: number | false | undefined;
+    leftIcon?: React.ReactElement<IconProps>;
+    hideLeftIcon?: boolean;
+    buttonProps?: ToasterButtonProps;
+    onCloseToast?: <T>(props: T) => void;
+    width?: string;
+    height?: string;
+    hideCloseButton?: boolean;
+};
+type Props = ToasterProps;
+export declare const Toaster: FunctionComponent<Props>;
+export {};

package/dist/esm/components/toaster/Toaster.js

@@ -0,0 +1 @@
+import{jsx as t,Fragment as o,jsxs as e}from"react/jsx-runtime";import n from"../../assets/icons/cross.svg.js";import{useEffect as s}from"react";import{ToastContainer as i,toast as r}from"react-toastify";import{ToasterStyled as l}from"./Toaster.styled.js";import{BodyPrimary as c,ButtonRegular as u}from"../TypographyStyle.js";import{COLORS as d}from"../../constants/Theme.js";const a=o=>{const e="default"===o.type?d.content.secondary:("success"===o.type||o.type,d.content.secondaryInverse);return t("div",Object.assign({tabIndex:0,role:"button",style:{width:20,display:"flex",margin:"auto",cursor:"pointer"},onClick:o.closeToast,onKeyDown:t=>{"Enter"===t.key&&o.closeToast()}},{children:t(n,{height:20,width:20,color:e})}))},p=n=>{const s="default"===n.type?d.stroke.primary:"success"===n.type?d.background.positive.vibrant:"error"===n.type?d.background.negative.vibrant:d.background.inverseLight;return t(o,{children:e("div",Object.assign({style:{display:"flex",flexGrow:1,borderRight:n.hideCloseButton?"unset":`1px solid ${s}`}},{children:[t("div",Object.assign({style:{flexGrow:1,marginRight:n.showButton?16:n.hideCloseButton?0:12}},{children:t(c,Object.assign({color:"inherit"},{children:n.toastText}))})),n.showButton&&t(u,Object.assign({style:{marginRight:n.hideCloseButton?0:12,marginTop:"auto",marginBottom:"auto",display:"flex",cursor:"pointer"},onClick:n.onButtonClick,color:"default"===n.type?d.content.brand:"inherit"},{children:n.buttonText}))]}))})},h=o=>(s((()=>{var e,n,s,i,l,c;void 0!==o.hideLeftIcon||o.leftIcon?r(t(p,{toastText:o.text,type:o.type||"info",buttonText:null===(e=o.buttonProps)||void 0===e?void 0:e.buttonText,showButton:null===(n=o.buttonProps)||void 0===n?void 0:n.showButton,onButtonClick:null===(s=o.buttonProps)||void 0===s?void 0:s.onButtonClick,hideCloseButton:o.hideCloseButton}),{onClose:o.onCloseToast?o.onCloseToast:()=>({}),icon:t=>!1!==o.hideLeftIcon&&(o.leftIcon?o.leftIcon:null),type:o.type,closeButton:!o.hideCloseButton&&t(a,{type:o.type||"default"})}):r(t(p,{toastText:o.text,type:o.type||"info",buttonText:null===(i=o.buttonProps)||void 0===i?void 0:i.buttonText,showButton:null===(l=o.buttonProps)||void 0===l?void 0:l.showButton,onButtonClick:null===(c=o.buttonProps)||void 0===c?void 0:c.onButtonClick,hideCloseButton:o.hideCloseButton}),{onClose:o.onCloseToast?o.onCloseToast:()=>({}),type:o.type,closeButton:!o.hideCloseButton&&t(a,{type:o.type||"info"})})}),[]),t(l,Object.assign({width:o.width,height:o.height},{children:t(i,{position:o.position||"top-right",closeOnClick:o.closeOnClick||!1,hideProgressBar:o.hideProgressBar||!1,draggable:!1,autoClose:o.autoClose||!1,theme:"colored"})})));export{h as Toaster};

package/dist/esm/components/toaster/Toaster.styled.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare const ToasterStyled: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    width?: string | undefined;
+    height?: string | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/esm/components/toaster/Toaster.styled.js

@@ -0,0 +1 @@
+import t from"@emotion/styled/base";import{COLORS as c}from"../../constants/Theme.js";const b=t("div","production"===process.env.NODE_ENV?{target:"e1tdeuzc0"}:{target:"e1tdeuzc0",label:"ToasterStyled"})("--toastify-color-light:#fff;--toastify-color-dark:#121212;--toastify-color-info:",c.background.inverse,";--toastify-color-success:",c.content.positive,";--toastify-color-error:",c.content.negative,";--toastify-text-color-light:",c.content.primary,';--toastify-toast-width:"fit-content";--toastify-toast-min-height:',(t=>t.height||"44px"),";--toastify-toast-max-height:",(t=>t.height||"fit-content"),";font-family:inherit;.custom-position{position:relative;}.Toastify__toast{padding:6px;max-width:",(t=>t.width),";.Toastify__close-button{display:block;margin:auto;}.Toastify__toast-body{padding:0 6px;}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--default{background:",c.content.brand,";}.Toastify__toast-body>div:last-child{display:flex;}}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvYXN0ZXIuc3R5bGVkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFd0MiLCJmaWxlIjoiVG9hc3Rlci5zdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xyXG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzL1RoZW1lXCI7XHJcbmV4cG9ydCBjb25zdCBUb2FzdGVyU3R5bGVkID0gc3R5bGVkLmRpdiBgXG5cblx0LS10b2FzdGlmeS1jb2xvci1saWdodDogI2ZmZjtcblx0LS10b2FzdGlmeS1jb2xvci1kYXJrOiAjMTIxMjEyO1xuXHQtLXRvYXN0aWZ5LWNvbG9yLWluZm86ICR7Q09MT1JTLmJhY2tncm91bmQuaW52ZXJzZX07XG5cdC0tdG9hc3RpZnktY29sb3Itc3VjY2VzczogJHtDT0xPUlMuY29udGVudC5wb3NpdGl2ZX07XG5cdC0tdG9hc3RpZnktY29sb3ItZXJyb3I6ICR7Q09MT1JTLmNvbnRlbnQubmVnYXRpdmV9O1xuXHQtLXRvYXN0aWZ5LXRleHQtY29sb3ItbGlnaHQ6ICR7Q09MT1JTLmNvbnRlbnQucHJpbWFyeX07XG5cdC0tdG9hc3RpZnktdG9hc3Qtd2lkdGg6IFwiZml0LWNvbnRlbnRcIjtcblx0LS10b2FzdGlmeS10b2FzdC1taW4taGVpZ2h0OiAkeyhwcm9wcykgPT4gcHJvcHMuaGVpZ2h0IHx8ICc0NHB4J307XG5cdC0tdG9hc3RpZnktdG9hc3QtbWF4LWhlaWdodDogJHsocHJvcHMpID0+IHByb3BzLmhlaWdodCB8fCAnZml0LWNvbnRlbnQnfTtcblx0Zm9udC1mYW1pbHk6IGluaGVyaXQ7XG5cblx0LmN1c3RvbS1wb3NpdGlvbiB7XG5cdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHR9XG5cdC5Ub2FzdGlmeV9fdG9hc3Qge1xuXHRcdHBhZGRpbmc6IDZweDtcblx0XHRtYXgtd2lkdGg6ICR7KHByb3BzKSA9PiBwcm9wcy53aWR0aH07XG5cblx0LlRvYXN0aWZ5X19jbG9zZS1idXR0b24ge1xuXHRcdGRpc3BsYXk6IGJsb2NrO1xuXHRcdG1hcmdpbjogYXV0bztcblx0fVxuXG5cdC5Ub2FzdGlmeV9fdG9hc3QtYm9keXtcblx0XHRwYWRkaW5nOiAwIDZweDtcblx0fVxuXG5cdC5Ub2FzdGlmeV9fcHJvZ3Jlc3MtYmFyLXRoZW1lLS1jb2xvcmVkLlRvYXN0aWZ5X19wcm9ncmVzcy1iYXItLWRlZmF1bHQge1xuXHRcdGJhY2tncm91bmQ6ICR7Q09MT1JTLmNvbnRlbnQuYnJhbmR9O1xuXHR9XG5cblx0LlRvYXN0aWZ5X190b2FzdC1ib2R5ID4gZGl2Omxhc3QtY2hpbGQge1xuXHRcdGRpc3BsYXk6IGZsZXg7XG5cdH1cbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPVRvYXN0ZXIuc3R5bGVkLmpzLm1hcCJdfQ== */"));export{b as ToasterStyled};

package/dist/esm/components/toaster/index.d.ts

@@ -0,0 +1 @@
+export * from './Toaster';

package/dist/esm/components/tooltips/Tooltip.d.ts

@@ -0,0 +1,10 @@
+import { FunctionComponent, ReactNode } from 'react';
+import { TooltipInternalProps } from "./TooltipInternal";
+export type Placement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+export interface TooltipProps extends TooltipInternalProps {
+    width?: number;
+    placement?: Placement;
+    children: ReactNode;
+    tooltipContent?: JSX.Element;
+}
+export declare const Tooltip: FunctionComponent<TooltipProps>;

package/dist/esm/components/tooltips/Tooltip.js

@@ -0,0 +1 @@
+import{jsxs as t,Fragment as n,jsx as o}from"react/jsx-runtime";import r from"@tippyjs/react";import e from"react";import i from"./TooltipInternal.js";import{COLORS as p}from"../../constants/Theme.js";const l=`\n  .tippy-content {\n    padding: 0px;\n  }\n  .tippy-arrow {\n    \tcolor: ${t=>p.content.primary};\n  }\n`,a=p=>e.isValidElement(p.children)?t(n,{children:[o("style",{children:l}),o(r,Object.assign({placement:p.placement||"right",maxWidth:p.width,animation:"fade",arrow:!0,interactive:!0,content:p.tooltipContent?p.tooltipContent:o(i,{title:p.title,body:p.body,buttonProps:p.buttonProps})},{children:p.children}))]}):null;export{a as Tooltip};

package/dist/esm/components/tooltips/TooltipInternal.d.ts

@@ -0,0 +1,10 @@
+import { FunctionComponent } from 'react';
+import { ButtonProps } from "../button/model";
+export interface TooltipInternalProps {
+    title?: string;
+    body: string;
+    buttonProps?: ButtonProps;
+}
+type Props = TooltipInternalProps;
+declare const TooltipInternal: FunctionComponent<Props>;
+export default TooltipInternal;

package/dist/esm/components/tooltips/TooltipInternal.js

@@ -0,0 +1 @@
+import c from"@emotion/styled/base";import{jsxs as b,jsx as t}from"react/jsx-runtime";import{Button as o}from"../button/Button.js";import{TitleSmall as n,BodyCaption as l}from"../TypographyStyle.js";import{COLORS as e}from"../../constants/Theme.js";const y=c("div","production"===process.env.NODE_ENV?{target:"e6ps8400"}:{target:"e6ps8400",label:"TooltipStyled"})("box-shadow:0px 2px 8px rgba(0, 0, 0, 0.12);border-radius:4px;padding:8px;background-color:",(c=>e.content.primary),";color:",(c=>e.content.primaryInverse),";"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvb2x0aXBJbnRlcm5hbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS2lDIiwiZmlsZSI6IlRvb2x0aXBJbnRlcm5hbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBqc3ggYXMgX2pzeCwganN4cyBhcyBfanN4cyB9IGZyb20gXCJyZWFjdC9qc3gtcnVudGltZVwiO1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XHJcbmltcG9ydCB7IEJ1dHRvbiB9IGZyb20gXCIuLi9idXR0b25cIjtcclxuaW1wb3J0IHsgQm9keUNhcHRpb24sIFRpdGxlU21hbGwgfSBmcm9tIFwiLi4vVHlwb2dyYXBoeVN0eWxlXCI7XHJcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gXCIuLi8uLi9jb25zdGFudHMvVGhlbWVcIjtcclxuY29uc3QgVG9vbHRpcFN0eWxlZCA9IHN0eWxlZC5kaXYgYFxuXHRib3gtc2hhZG93OiAwcHggMnB4IDhweCByZ2JhKDAsIDAsIDAsIDAuMTIpO1xuXHRib3JkZXItcmFkaXVzOiA0cHg7XG5cdHBhZGRpbmc6IDhweDtcblx0YmFja2dyb3VuZC1jb2xvcjogJHsocHJvcHMpID0+IENPTE9SUy5jb250ZW50LnByaW1hcnl9O1xuXHRjb2xvcjogJHsocHJvcHMpID0+IENPTE9SUy5jb250ZW50LnByaW1hcnlJbnZlcnNlfTtcbmA7XHJcbmNvbnN0IFRvb2x0aXBJbnRlcm5hbCA9IChwcm9wcykgPT4ge1xyXG4gICAgLy8gVG9kbyAoYXNodXRvc2gpIG1ha2Ugc3VyZSB0aGF0IHRoZSBidXR0b24gd2hpY2ggaXMgcGFzc2VkIGlzIGludmVyc2VcclxuICAgIHJldHVybiAoX2pzeHMoVG9vbHRpcFN0eWxlZCwgeyBjaGlsZHJlbjogW3Byb3BzLnRpdGxlICYmIChfanN4KFRpdGxlU21hbGwsIE9iamVjdC5hc3NpZ24oeyBjb2xvcjogQ09MT1JTLmNvbnRlbnQucHJpbWFyeUludmVyc2UsIHN0eWxlOiB7IG1hcmdpbkJvdHRvbTogJzhweCcgfSB9LCB7IGNoaWxkcmVuOiBwcm9wcy50aXRsZSB9KSkpLCBfanN4KEJvZHlDYXB0aW9uLCBPYmplY3QuYXNzaWduKHsgY29sb3I6IENPTE9SUy5jb250ZW50LnByaW1hcnlJbnZlcnNlLCBzdHlsZTogeyBtYXJnaW5Cb3R0b206IHByb3BzLmJ1dHRvblByb3BzID8gJzhweCcgOiAnMHB4JyB9IH0sIHsgY2hpbGRyZW46IHByb3BzLmJvZHkgfSkpLCBwcm9wcy5idXR0b25Qcm9wcyAmJiBfanN4KEJ1dHRvbiwgT2JqZWN0LmFzc2lnbih7fSwgcHJvcHMuYnV0dG9uUHJvcHMpKV0gfSkpO1xyXG59O1xyXG5leHBvcnQgZGVmYXVsdCBUb29sdGlwSW50ZXJuYWw7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPVRvb2x0aXBJbnRlcm5hbC5qcy5tYXAiXX0= */")),g=c=>b(y,{children:[c.title&&t(n,Object.assign({color:e.content.primaryInverse,style:{marginBottom:"8px"}},{children:c.title})),t(l,Object.assign({color:e.content.primaryInverse,style:{marginBottom:c.buttonProps?"8px":"0px"}},{children:c.body})),c.buttonProps&&t(o,Object.assign({},c.buttonProps))]});export{g as default};

package/dist/esm/components/tooltips/index.d.ts

@@ -0,0 +1 @@
+export * from './Tooltip';

package/dist/esm/components/zeroState/ZeroState.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare const ZeroState: React.FC<{
+    title: string;
+    subTitle?: string;
+    IconHolderStyle?: React.CSSProperties;
+    style?: React.CSSProperties /** now this component is extendable through styled-component */;
+}>;

package/dist/esm/components/zeroState/ZeroState.js

@@ -0,0 +1,17 @@
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import n from"styled-components";import{TitleRegular as r,BodyCaption as o}from"../TypographyStyle.js";import{COLORS as s}from"../../constants/Theme.js";import l from"../../assets/icons/alert.svg.js";const i=n.div`
+	background: ${s.surface.standard};
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	flex: 1;
+`,c=n.div`
+	background: ${s.background.base};
+	width: 48px;
+	height: 48px;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	border-radius: 24px;
+`,a=n=>{let{subTitle:a,title:d,IconHolderStyle:m,style:p}=n;return e(i,Object.assign({style:null!=p?p:{}},{children:[t(c,Object.assign({style:null!=m?m:{}},{children:t(l,{color:s.content.placeholder,height:24,width:24})})),t(r,Object.assign({style:{marginTop:8,color:s.content.primary}},{children:null!=d?d:"No results found"})),!!a&&t(o,Object.assign({style:{marginTop:4,color:s.content.secondary}},{children:a}))]}))};export{a as ZeroState};