@bikdotai/bik-component-library 0.0.743-beta.2 → 0.0.743-quick1

package/dist/esm/components/ProgressChecklist/ProgressChecklist.style.js

@@ -1,133 +0,0 @@
-import e from"styled-components";import{COLORS as i}from"../../constants/Theme.js";const o=e.div`
-	border-radius: 8px;
-	border: 1px solid #e0e0e0;
-	padding: 24px;
-	display: flex;
-	flex-direction: column;
-	gap: 10px;
-	background: ${i.surface.standard};
-
-	.accordion__overview {
-		padding: 16px !important;
-		border-bottom: none;
-	}
-`,r=e.div`
-	display: flex;
-	flex-direction: column;
-	gap: 8px;
-`,t=e.div`
-	display: flex;
-	flex-direction: row;
-	gap: 12px;
-`;e.div`
-	display: flex;
-	flex-direction: column;
-	gap: 16px;
-	overflow-y: auto;
-	flex: 1;
-
-	&::-webkit-scrollbar {
-		width: 6px;
-	}
-
-	&::-webkit-scrollbar-track {
-		background: transparent;
-	}
-
-	&::-webkit-scrollbar-thumb {
-		background: ${i.stroke.primary};
-		border-radius: 3px;
-	}
-`,e.div`
-	display: flex;
-	align-items: flex-start;
-	gap: 12px;
-	padding: 12px;
-	background: ${e=>e.completed?"#F0F7F4":i.surface.standard};
-	border: 1px solid
-		${e=>e.completed?"#D4E9E3":i.stroke.primary};
-	border-radius: 6px;
-	cursor: pointer;
-	transition: all 0.2s ease;
-
-	&:hover {
-		background: ${e=>e.completed?"#E8F4F0":i.background.base};
-	}
-`,e.input`
-	width: 18px;
-	height: 18px;
-	margin-top: 2px;
-	cursor: pointer;
-	flex-shrink: 0;
-`,e.div`
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-	flex: 1;
-`,e.p`
-	margin: 0;
-	font-size: 14px;
-	font-weight: 500;
-	line-height: 20px;
-	color: ${e=>e.completed?i.content.secondary:i.content.primary};
-	text-decoration: ${e=>e.completed?"line-through":"none"};
-`,e.p`
-	margin: 0;
-	font-size: 12px;
-	font-weight: 400;
-	line-height: 16px;
-	color: ${i.content.secondary};
-	opacity: ${e=>e.completed?.6:1};
-`;const n=e.div`
-	border-radius: 8px;
-	border: 1px solid
-		${e=>e.isActive?i.stroke.primary:"#E0E0E0"};
-	padding: 16px;
-	display: flex;
-	flex-direction: column;
-	gap: 12px;
-	background: ${i.surface.standard};
-	transition: all 0.2s ease;
-
-	&:hover {
-		border-color: ${e=>e.isActive?i.stroke.primary:"#D0D0D0"};
-	}
-`,p=e.div`
-	display: flex;
-	align-items: center;
-	gap: 16px;
-	width: 100%;
-`,a=e.div`
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex-shrink: 0;
-`,d=e.div`
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-	flex: 1;
-`,l=e.div`
-	font-size: 16px;
-	font-weight: 600;
-	line-height: 24px;
-	color: ${e=>e.completed?i.background.positive.vibrant:e.isActive?i.content.primary:i.content.placeholder} !important;
-	margin: 0;
-	display: flex;
-	flex-direction: row;
-	gap: 12px;
-`,c=e.div`
-	font-size: 14px;
-	font-weight: 400;
-	line-height: 20px;
-	color: ${e=>e.isActive?i.content.secondary:i.content.placeholder};
-	margin: 0;
-`,s=e.div`
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	flex-shrink: 0;
-`,x=e.div`
-	width: 100%;
-	margin-top: 8px;
-`;export{r as HeaderSection,t as ProgressBarSection,o as ProgressChecklistContainer,s as SingleChecklistActionWrapper,x as SingleChecklistAlertRow,d as SingleChecklistContent,l as SingleChecklistHeader,a as SingleChecklistIconWrapper,n as SingleChecklistItem,p as SingleChecklistMainRow,c as SingleChecklistSubheader};

package/dist/esm/components/ProgressChecklist/ProgressStepper.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-interface StepItem {
-    id?: string;
-    text: string;
-    label?: string;
-    onClick?: () => void;
-    isCompleted?: boolean;
-}
-interface ProgressStepperProps {
-    steps?: StepItem[];
-    onStepClick?: (id: string) => void;
-}
-declare const _default: React.NamedExoticComponent<ProgressStepperProps>;
-export default _default;

package/dist/esm/components/ProgressChecklist/ProgressStepper.js

@@ -1 +0,0 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import i,{useState as n}from"react";import{COLORS as l}from"../../constants/Theme.js";import{Button as d}from"../button/Button.js";const o=o=>{let{steps:s=[],onStepClick:r}=o;var a,c;const h=s.length>0?s:[{id:"step-1",text:"Step One"},{id:"step-2",text:"Step Two"},{id:"step-3",text:"Step Three"}],[p,g]=n(null!==(c=null===(a=h[0])||void 0===a?void 0:a.id)&&void 0!==c?c:null);return e("div",Object.assign({style:{paddingLeft:52}},{children:e("div",Object.assign({style:{margin:0,padding:0,display:"flex",flexDirection:"column",gap:12}},{children:h.map(((n,o)=>{var s,a,c,v,u,x,m;return t(i.Fragment,{children:[t("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[(()=>{var i;const l=0===o||!0===(null===(i=h[o-1])||void 0===i?void 0:i.isCompleted),d=!0===n.isCompleted;return e("div",d?Object.assign({style:{width:24,height:24,flex:"0 0 24px"},"aria-hidden":!0},{children:t("svg",Object.assign({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e("rect",{x:"0.5",y:"0.5",width:"23",height:"23",rx:"11.5",fill:"#EFE6F9"}),e("rect",{x:"0.5",y:"0.5",width:"23",height:"23",rx:"11.5",stroke:"#4B1583"}),e("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M17.8047 7.52851C18.0651 7.78886 18.0651 8.21097 17.8047 8.47132L10.4714 15.8047C10.2111 16.065 9.78894 16.065 9.5286 15.8047L6.19526 12.4713C5.93491 12.211 5.93491 11.7889 6.19526 11.5285C6.45561 11.2682 6.87772 11.2682 7.13807 11.5285L10 14.3904L16.8619 7.52851C17.1223 7.26816 17.5444 7.26816 17.8047 7.52851Z",fill:"#4B1583"})]}))}):Object.assign({style:{width:24,height:24,borderRadius:30,padding:4,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box",background:l?"#4B1583":"transparent",color:l?"#FFFFFF":"#BDBDBD",border:"1px solid "+(l?"#4B1583":"#E0E0E0"),fontSize:12,lineHeight:"12px",flex:"0 0 24px"},"aria-hidden":!0},{children:e("span",Object.assign({style:{fontSize:12,fontWeight:500}},{children:o+1}))}))})(),e("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"flex-start",minWidth:0},"aria-label":`Open ${null!==(a=null!==(s=n.label)&&void 0!==s?s:n.text)&&void 0!==a?a:`step ${o+1}`}`},{children:e(d,{buttonText:null!==(v=null!==(c=n.label)&&void 0!==c?c:n.text)&&void 0!==v?v:`Step ${o+1}`,buttonType:"text",buttonTextColor:n.isCompleted?l.text.secondary:0===o||!0===(null===(u=h[o-1])||void 0===u?void 0:u.isCompleted)?l.stroke.brand:l.content.inactive,matchParentWidth:!1,size:"small",style:{width:"fit-content",paddingLeft:0,textDecoration:"none",textDecorationLine:"none"},onClick:()=>{var e,t;g(null!==(e=n.id)&&void 0!==e?e:p),n.isCompleted||0!==o&&!0!==(null===(t=h[o-1])||void 0===t?void 0:t.isCompleted)||(n.onClick?n.onClick():n.id&&(null==r||r(n.id)))}})})),!n.isCompleted&&(0===o||!0===(null===(x=h[o-1])||void 0===x?void 0:x.isCompleted))&&e("div",Object.assign({style:{width:20,height:20,display:"flex",alignItems:"center",justifyContent:"center"},"aria-hidden":!0},{children:e("svg",Object.assign({width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M5.83333 6.66667C5.3731 6.66667 5 6.29357 5 5.83333C5 5.3731 5.3731 5 5.83333 5H14.1667C14.6269 5 15 5.3731 15 5.83333V14.1667C15 14.6269 14.6269 15 14.1667 15C13.7064 15 13.3333 14.6269 13.3333 14.1667V7.84518L6.42259 14.7559C6.09715 15.0814 5.56951 15.0814 5.24408 14.7559C4.91864 14.4305 4.91864 13.9028 5.24408 13.5774L12.1548 6.66667H5.83333Z",fill:"#4B1583"})}))}))]})),o!==h.length-1&&e("div",{"aria-hidden":!0,style:{width:8,height:1,borderRadius:2,background:"#BDBDBD",transform:"rotate(90deg)",marginLeft:8}})]},null!==(m=n.id)&&void 0!==m?m:`step-${o}`)}))}))}))};var s=i.memo(o);export{s as default};

package/dist/esm/components/ProgressChecklist/SimpleChecklistItem.d.ts

@@ -1,19 +0,0 @@
-import React from 'react';
-interface TagProps {
-    tagText: string | number;
-    variant?: 'regular' | 'circle' | 'compressed';
-    type?: 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
-    theme?: 'light' | 'dark';
-}
-interface SimpleChecklistItemProps {
-    header: string;
-    subheader?: string;
-    icon?: React.ReactNode;
-    activeIcon?: React.ReactNode;
-    completedIcon?: React.ReactNode;
-    isActive?: boolean;
-    isCompleted?: boolean;
-    tag?: TagProps;
-}
-declare const SimpleChecklistItem: React.FC<SimpleChecklistItemProps>;
-export default SimpleChecklistItem;

package/dist/esm/components/ProgressChecklist/SimpleChecklistItem.js

@@ -1 +0,0 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{ActiveChecklistIcon as i}from"../../assets/icons/ActiveChecklistIcon.js";import{CompletedChecklistIcon as s}from"../../assets/icons/CompletedChecklistIcon.js";import{InactiveChecklistIcon as c}from"../../assets/icons/InactiveChecklistIcon.js";import{Tag as n}from"../tag/Tag.js";import{SingleChecklistMainRow as r,SingleChecklistIconWrapper as l,SingleChecklistContent as o,SingleChecklistHeader as a,SingleChecklistSubheader as m}from"./ProgressChecklist.style.js";const d=d=>{let{header:h,subheader:p,icon:g,activeIcon:v,completedIcon:j,isActive:f,isCompleted:u,tag:I}=d;return e("div",{children:t(r,{children:[e(l,{children:u?null!=j?j:e(s,{}):f?null!=v?v:e(i,{}):null!=g?g:e(c,{})}),t(o,{children:[t("div",Object.assign({style:{display:"flex",alignItems:"center",gap:12}},{children:[e(a,Object.assign({completed:u,isActive:f},{children:h})),(null==I?void 0:I.tagText)&&e(n,{tagText:I.tagText,variant:I.variant,type:I.type,theme:I.theme})]})),p&&e(m,Object.assign({isActive:f},{children:p}))]})]})})};export{d as default};

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

@@ -1,2 +0,0 @@
-export { default as ProgressChecklist } from './ProgressChecklist';
-export type { ChecklistItemType } from './ProgressChecklist';

package/dist/esm/components/post-live-checklist/PostLiveChecklist.d.ts

@@ -1,23 +0,0 @@
-import React from 'react';
-export interface ChecklistItem {
-    id: string;
-    isCompleted: boolean;
-    isOpen?: boolean;
-    header: string;
-    image?: string;
-    subHeader?: string;
-}
-export interface ButtonGroupItem {
-    id: string;
-    title: string;
-    icon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-}
-export interface PostLiveChecklistProps {
-    title?: string;
-    subtitle?: string;
-    marketingChecklist?: ChecklistItem[];
-    supportChecklist?: ChecklistItem[];
-    onChecklistSetup?: (itemId: string, analyticsButtonId: string) => void;
-    useCaseType?: 'marketing' | 'support' | 'both' | string;
-}
-export declare const PostLiveChecklist: React.FC<PostLiveChecklistProps>;

package/dist/esm/components/post-live-checklist/PostLiveChecklist.js

@@ -1 +0,0 @@
-import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import{useState as r,useEffect as o}from"react";import{ButtonGroup as s}from"../buttonGroup/ButtonGroup.js";import{PostLiveChecklistItem as n}from"../post-live-checklist-item/PostLiveChecklistItem.js";import{TitleRegular as a,BodySecondary as l}from"../TypographyStyle.js";import{COLORS as d}from"../../constants/Theme.js";const p=p=>{let{title:m="Boost Performance",subtitle:c="Enable these features to make your assistant smarter",marketingChecklist:u=[],supportChecklist:g=[],onChecklistSetup:b,useCaseType:h}=p;var k,f;const[C,v]=r("marketing"),[y,j]=r("none"),[O,x]=r("marketing");o((()=>{const e=u.filter((e=>!e.isCompleted)).length,t=g.filter((e=>!e.isCompleted)).length;0!==e||0!==t?e>0&&t>0?j("tabs"):(j("list"),e>0&&x("marketing"),t>0&&x("support")):j("none")}),[u,g]);const S=(()=>{const e=[{id:"marketing",title:"Marketing"},{id:"support",title:"Support"}];if(!h)return e;return"support"===String(h).toLowerCase()?[e[1],e[0]]:e})();o((()=>{"tabs"===y&&S.length>0&&v(S[0].id)}),[y,h]);const T=e=>e.toUpperCase(),B=(e,t)=>{b&&b(e,t)};if("none"===y)return null;const H="tabs"===y?"marketing"===C?u:g:"marketing"===O?u:g;return e("div",Object.assign({style:{padding:16,border:`1px solid ${d.stroke.primary}`,backgroundColor:d.surface.standard,borderRadius:8}},{children:[e("div",{children:[t(a,Object.assign({color:(null===(k=d.background)||void 0===k?void 0:k.brand)||"#4B1583"},{children:m})),t(l,Object.assign({color:(null===(f=d.content)||void 0===f?void 0:f.secondary)||"#666666"},{children:c}))]}),t("div",Object.assign({style:{marginTop:12}},{children:"tabs"===y?e(i,{children:[t(s,{size:"medium",gap:"12px",onButtonClick:e=>v(e),activeButtonId:C,buttonGroup:S}),t("div",Object.assign({style:{marginTop:12,display:"flex",flexDirection:"column",gap:12}},{children:H.map((e=>t(n,{isCompleted:e.isCompleted,isOpen:e.isOpen,header:e.header,image:e.image,subHeader:e.subHeader,onSetup:()=>B(e.id,T(C))},e.id)))}))]}):t("div",Object.assign({style:{marginTop:12,display:"flex",flexDirection:"column",gap:12}},{children:H.map((e=>t(n,{isCompleted:e.isCompleted,isOpen:e.isOpen,header:e.header,image:e.image,subHeader:e.subHeader,onSetup:()=>B(e.id,T(O))},e.id)))}))}))]}))};export{p as PostLiveChecklist};

package/dist/esm/components/post-live-checklist/PostLiveChecklist.stories.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import { ComponentMeta, ComponentStory } from '@storybook/react';
-declare const _default: ComponentMeta<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export default _default;
-export declare const Default: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export declare const WithBothChecklists: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export declare const SupportFirstOrdering: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export declare const ListModeSupport: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export declare const ListModeMarketing: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export declare const AllCompleted: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export declare const CustomTitles: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;
-export declare const WithSomeCompleted: ComponentStory<import("react").FC<import("./PostLiveChecklist").PostLiveChecklistProps>>;

package/dist/esm/components/post-live-checklist/index.d.ts

@@ -1,2 +0,0 @@
-export { PostLiveChecklist } from './PostLiveChecklist';
-export type { PostLiveChecklistProps, ChecklistItem, } from './PostLiveChecklist';

package/dist/esm/components/post-live-checklist-item/PostLiveChecklistItem.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-export interface PostLiveChecklistItemProps {
-    isCompleted: boolean;
-    header: string;
-    subHeader?: string;
-    isOpen?: boolean;
-    onSetup?: () => void;
-    image?: string;
-}
-export declare const PostLiveChecklistItem: React.FC<PostLiveChecklistItemProps>;

package/dist/esm/components/post-live-checklist-item/PostLiveChecklistItem.js

@@ -1 +0,0 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{CheckIndicatorIcon as i}from"../../assets/icons/CheckIndicatorIcon.js";import s from"../../assets/icons/chevronDown.svg.js";import n from"../../assets/icons/chevronUpOutline.svg.js";import{useState as r,useEffect as o}from"react";import{Button as c}from"../button/Button.js";import{TitleSmall as l,BodySecondary as d}from"../TypographyStyle.js";import{COLORS as a}from"../../constants/Theme.js";const p=p=>{const{isCompleted:m,header:f,subHeader:g,isOpen:h=!1}=p,{onSetup:u}=p,[y,b]=r(h);return o((()=>{b(h)}),[h]),e("div",Object.assign({style:{backgroundColor:y?a.surface.subdued:a.surface.standard,borderRadius:8}},{children:[e("div",Object.assign({style:{color:a.surface.standard,padding:16,display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",cursor:m?"default":"pointer"},onClick:()=>!m&&b(!y)},{children:[t(l,Object.assign({color:y?"#4B1583":a.content.primary},{children:f})),m?t(i,{}):t(y?n:s,{width:24,height:24,color:a.content.secondary})]})),t("div",{children:y&&t("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:e("div",Object.assign({style:{padding:16,paddingTop:0,gap:16,display:"flex",flexDirection:"column"}},{children:[t("div",Object.assign({style:{height:200,backgroundColor:"#EFE6F9",borderRadius:8,overflow:"hidden"}},{children:t("img",{src:p.image,alt:"checklist item",style:{width:"100%",height:"100%",objectFit:"cover",display:"block"}})})),e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center",gap:16}},{children:[t("div",Object.assign({style:{flex:2}},{children:t(d,Object.assign({color:a.content.primary,numberOfLines:3},{children:g}))})),t("div",Object.assign({style:{flex:1,display:"flex",justifyContent:"flex-end"}},{children:t(c,{buttonType:"primary",size:"small",buttonText:"Setup",onClick:()=>{u&&u()}})}))]}))]}))}))})]}))};export{p as PostLiveChecklistItem};

package/dist/esm/components/post-live-checklist-item/index.d.ts

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