@bikdotai/bik-component-library 0.0.687-beta.7 → 0.0.687-beta.9

package/dist/cjs/components/plans/SubscriptionPlanSelector.js

@@ -0,0 +1,101 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),o=require("@emotion/styled"),s=require("../../assets/icons/check.svg.js"),n=require("../../assets/icons/info.svg.js"),i=require("../../assets/icons/phone.svg.js"),r=require("../modals/styledModal.js"),a=require("./SubscriptionPlan.js"),d=require("../../constants/Theme.js"),p=require("../button/Button.js"),c=require("../tabs/Tabs.js"),l=require("../TypographyStyle.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=u(o);const h=x.default.div`
+	display: flex;
+	column-gap: 22px;
+	align-items: stretch;
+	padding: 24px;
+`,g=x.default.div`
+	color: ${d.COLORS.content.negative};
+	padding: 0px 24px;
+`,m=x.default.div`
+	padding: 24px 24px 0px 24px;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	.sub--header {
+		margin-top: 8px;
+		color: ${d.COLORS.content.secondary} !important;
+	}
+`,b=x.default.div`
+	padding: 0px 24px 24px 24px;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	flex-wrap: wrap;
+	gap: 8px;
+	.coupon-code {
+		display: flex;
+		align-items: center;
+		justify-content: flex-start;
+		gap: 8px;
+	}
+	.coupon--success--chip {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 4px 8px;
+		border-radius: 4px;
+		border: 1px solid #c3e4c4;
+		background: #e6f4e7;
+	}
+	.coupon-input {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+	.dotted--border {
+		border: 1px dotted #e0e0e0;
+		padding: 8px 8px 8px 16px;
+		min-width: 10%;
+		border-radius: 4px;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.error--border {
+		border: 1px dotted ${d.COLORS.content.negative} !important;
+	}
+	.input--class {
+		border: none;
+		:active,
+		:focus {
+			border: none;
+			outline: none;
+		}
+	}
+	.success--inside--chip {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 4px 8px;
+		align-items: center;
+		gap: 6px;
+		border-radius: 4px;
+		background: ${d.COLORS.background.positive.vibrant};
+	}
+	.demo--wrapper {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		gap: 8px;
+	}
+	.demo--input {
+		color: ${d.COLORS.background.brand};
+		border-bottom: 1px solid ${d.COLORS.background.brand};
+		width: fit-content;
+		cursor: pointer;
+	}
+	.demo--phone {
+		display: flex;
+		padding: 8px;
+		align-items: center;
+		gap: 10px;
+		border-radius: 50%;
+		background-color: ${d.COLORS.background.brandLight};
+	}
+	.button--wrapper {
+		display: flex;
+		align-items: center;
+		justify-content: flex-start;
+		gap: 8px;
+	}
+`,y=[{key:"Monthly",title:"Monthly"},{key:"yearly",title:"Yearly"}];exports.BottomWrapper=b,exports.HeaderWrapper=m,exports.SubscriptionPlanSelector=o=>{const[u,x]=t.useState(o.discountInputProperties?.defaultValue),j=o.staticWidthMultiplier?o.staticWidthMultiplier:275;return e.jsxs(r.StyledModal,{centralContainerStyles:{width:o.plans.length*j},open:!0,closeOnOutsideClick:!0,onClose:o.onClose,children:[e.jsxs(m,{children:[e.jsxs("div",{children:[e.jsx(l.TitleMedium,{children:o.header||"Select a plan to proceed"}),e.jsx(l.BodyPrimary,{className:"sub--header",children:o.subHeader||""})]}),o.showMonthlyTabs?e.jsx(c.Tabs,{tabs:o.tabProperties&&o.tabProperties.tabs?o.tabProperties.tabs:y,onTabSelected:e=>o.tabProperties?.onTabSelected?o.tabProperties?.onTabSelected(e):"",isSquared:!0}):e.jsx(e.Fragment,{})]}),o.warningDescription&&e.jsx(g,{children:o.warningDescription}),e.jsx(h,{children:o.plans.map((e=>t.createElement(a.SubscriptionPlan,{...e,showMonthly:!0,showMonthlyOptions:o.showMonthlyOptions||!1,showTrialOptions:o.showTrialOptions||!1,onPlanSelect:o.onPlanSelect,key:e.planName})))}),(o.showCouponApplicationCode||o.showBookAdemo)&&e.jsxs(b,{children:[e.jsx("div",{children:o.showCouponApplicationCode&&e.jsxs("div",{className:"coupon-code",children:[e.jsxs("div",{className:"coupon-input",children:[e.jsx(l.BodyPrimary,{style:{color:o.discountInputProperties?.errorMessage?d.COLORS.content.negative:""},children:"Apply coupon code"}),e.jsxs("div",{className:"button--wrapper",children:[e.jsxs("div",{className:o.discountInputProperties?.errorMessage?"error--border dotted--border":"dotted--border",children:[e.jsx("input",{className:"input--class",onChange:e=>{x(e.target.value),o.discountInputProperties?.onChangeText(e.target.value)},value:u,placeholder:"eg:PLAN20",disabled:o.discountInputProperties?.isLoading}),o.discountInputProperties?.successText&&e.jsxs("div",{className:"success--inside--chip",children:[e.jsx(s.default,{height:16,width:16,color:d.COLORS.content.primaryInverse}),e.jsx(l.BodyCaption,{style:{color:d.COLORS.content.primaryInverse},children:"Coupon applied"})]})]}),!o.discountInputProperties?.successText&&e.jsx(p.Button,{buttonText:"Apply",buttonType:"primary",onClick:o?.discountInputProperties?.onCouponApply,isLoading:o.discountInputProperties?.isLoading})]}),o.discountInputProperties?.errorMessage&&e.jsxs("div",{className:"d-flex",style:{gap:8},children:[e.jsx(n.default,{height:16,width:16,color:d.COLORS.content.negative}),e.jsx(l.BodyCaption,{style:{color:d.COLORS.content.negative},children:o.discountInputProperties?.errorMessage??"Enter a valid code"})]}),o.discountInputProperties?.showRemoveCoupon&&e.jsx("div",{className:"demo--input",onClick:()=>{x(""),o.discountInputProperties?.removeCoupon&&o.discountInputProperties?.removeCoupon()},children:"Remove coupon"})]}),o.discountInputProperties?.successText&&e.jsx("div",{className:"coupon--success--chip",children:e.jsx(l.BodyCaption,{style:{color:"#00580E",maxWidth:180},children:o.discountInputProperties?.successText})})]})}),o.showBookAdemo&&e.jsxs("div",{className:"demo--wrapper",children:[e.jsx("div",{className:"demo--phone",children:e.jsx(i.default,{height:16,width:16,color:d.COLORS.background.brand})}),e.jsx(l.BodyPrimary,{className:"demo--input",onClick:()=>o.demoLink?window.open(o.demoLink,"_blank"):o.onClickingBookADemo?o.onClickingBookADemo():"",children:"Book a demo with the team"})]})]})]})},exports.defaultTabs=y;

package/dist/cjs/components/plans/SubscriptionPlanStyled.js

@@ -0,0 +1,266 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@emotion/styled"),t=require("../../constants/Theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(e);const a=r.default.div`
+	position: relative;
+
+	border: 1px solid ${t.COLORS.stroke.primary};
+	border: 1px solid
+		${e=>e.isSelected?t.COLORS.text.altSecondary:t.COLORS.stroke.primary};
+
+	box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
+	border-radius: 4px;
+
+	.box {
+		height: ${e=>e.isManifestPlan?"400px":"600px"};
+		padding: 24px;
+		background-color: ${t.COLORS.surface.standard};
+		display: flex;
+		flex-direction: column;
+
+		.button-box {
+			margin-top: auto;
+			display: flex;
+		}
+	}
+
+	.box.selected {
+		background-color: ${t.COLORS.background.brandLight};
+	}
+
+	.rounded-corners {
+		border-top-left-radius: 4px;
+		border-top-right-radius: 4px;
+	}
+
+	width: 100%;
+
+	.most-popular {
+		background: linear-gradient(90.05deg, #743979 1.22%, #526dca 99.95%),
+			#4b1583;
+		padding: 4px;
+		border-top-left-radius: 4px;
+		border-top-right-radius: 4px;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+
+		.text {
+			color: ${t.COLORS.surface.standard};
+		}
+	}
+
+	.trial {
+		margin-top: 16px;
+		margin-bottom: 12px;
+		padding: 4px 8px;
+		border-radius: 4px;
+		color: ${t.COLORS.content.secondary};
+		background-color: ${t.COLORS.surface.hovered};
+	}
+
+	.trial.selected {
+		background-color: ${t.COLORS.surface.standard};
+	}
+
+	.feature {
+		display: flex;
+		align-items: center;
+
+		.feature-text {
+			margin-left: 12px;
+			color: ${t.COLORS.content.secondary};
+		}
+
+		margin-top: 4px;
+	}
+
+	.price-block {
+		display: flex;
+		margin-bottom: 4px;
+		align-items: center;
+	}
+
+	.per-message-price {
+		display: flex;
+	}
+
+	.plan-bottom-information {
+		margin-top: auto;
+		text-align: center;
+		background: ${t.COLORS.background.brandLight};
+		padding: 4px;
+
+		.text {
+			color: ${t.COLORS.background.inverse};
+		}
+
+		border-bottom-left-radius: 4px;
+		border-bottom-right-radius: 4px;
+	}
+
+	.disabled {
+		* {
+			color: ${t.COLORS.content.inactive} !important;
+		}
+	}
+
+	.plan-bottom-information.disabled {
+		background: ${t.COLORS.background.base};
+	}
+
+	.plan-bottom-information.selected {
+		background: ${t.COLORS.surface.standard};
+		color: ${t.COLORS.content.placeholder};
+	}
+	.old--price {
+		color: ${t.COLORS.content.secondary};
+		text-decoration: line-through;
+		margin-right: 4px;
+	}
+`,i=r.default.div`
+	position: relative;
+	cursor: pointer;
+	border: 1px solid ${t.COLORS.stroke.primary};
+	box-shadow: ${e=>e.showMostPopularChip?"0px 0px 12px 0px rgba(116, 0, 255, 0.24)":""};
+	border-radius: 8px;
+	width: 100;
+
+	.box {
+		border-radius: 8px;
+		min-height: ${e=>e.height?e.height:"525px"};
+		padding: 16px;
+		background-color: ${t.COLORS.surface.standard};
+		display: flex;
+		flex-direction: column;
+		gap: 12px;
+
+		.button-box {
+			margin-top: auto;
+			display: flex;
+		}
+	}
+
+	.trial {
+		margin-top: 16px;
+		margin-bottom: 12px;
+		padding: 4px 8px;
+		border-radius: 4px;
+		color: ${t.COLORS.content.secondary};
+		background-color: ${t.COLORS.surface.hovered};
+	}
+
+	.trial.selected {
+		background-color: ${t.COLORS.surface.standard};
+	}
+	.features {
+		display: flex;
+		flex-direction: column;
+		gap: 2px;
+	}
+	.feature {
+		display: flex;
+		align-items: baseline;
+		gap: 9px;
+		justify-content: flex-start;
+		flex-direction: row;
+
+		.feature-text {
+			color: ${t.COLORS.content.secondary};
+		}
+	}
+
+	.price-block {
+		display: flex;
+		align-items: center;
+	}
+
+	.per-message-price {
+		display: flex;
+	}
+
+	.plan-bottom-information {
+		margin-top: auto;
+		text-align: center;
+		background: ${t.COLORS.background.brandLight};
+		padding: 4px;
+
+		.text {
+			color: ${t.COLORS.background.inverse};
+		}
+
+		border-bottom-left-radius: 4px;
+		border-bottom-right-radius: 4px;
+	}
+
+	.disabled {
+		* {
+			color: ${t.COLORS.content.inactive} !important;
+		}
+	}
+
+	.plan-bottom-information.disabled {
+		background: ${t.COLORS.background.base};
+	}
+
+	.plan-bottom-information.selected {
+		background: ${t.COLORS.surface.standard};
+		color: ${t.COLORS.content.placeholder};
+	}
+	.old--price {
+		color: ${t.COLORS.content.secondary};
+		text-decoration: line-through;
+		margin-right: 4px;
+	}
+	.most-popular-chip {
+		border-radius: 25px 25px 0px 0px;
+		background: linear-gradient(180deg, #28034e -0.65%, #731dcf 99.55%);
+		position: absolute;
+		padding: 7px 18px 5px 18px;
+		top: -28px;
+		right: 16px;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: center;
+		gap: 4px;
+	}
+	.popular-text {
+		color: ${t.COLORS.surface.subdued};
+		font-size: 10.345px;
+	}
+	.radio-flex {
+		display: flex;
+		align-items: baseline;
+		justify-content: flex-start;
+		gap: 8px;
+	}
+	.extra-include-margin {
+		margin-top: 8px;
+	}
+	.buisness-desc {
+		font-size: 14px;
+		font-style: normal;
+		font-weight: 400;
+		color: ${t.COLORS.content.secondary};
+	}
+	.popular-testimony {
+		display: flex;
+		padding: 12px;
+		align-items: flex-start;
+		gap: 12px;
+		border-radius: 8px;
+		background: ${t.COLORS.background.brandLight};
+	}
+	.testimony-text {
+		font-size: 12px;
+		font-style: normal;
+		font-weight: 600;
+		line-height: 16px;
+	}
+	.radio-button {
+		width: 18px;
+		height: 18px;
+	}
+
+	input[type='radio'] {
+		accent-color: ${t.COLORS.stroke.positive.vibrant};
+	}
+`;exports.NewSubscriptionStyled=i,exports.SubscriptionPlanStyled=a;

package/dist/cjs/components/plans/SubscriptionPlansCollected.d.ts

@@ -0,0 +1,18 @@
+import { FunctionComponent } from 'react';
+import { NewSubscriptionPlanProps } from './NewSubscriptionPlan.js';
+
+type Props = {
+    plans: NewSubscriptionPlanProps[];
+    onPlanSelect: (code: string) => void;
+    onClickShowAllFeatures?: () => void;
+    showTrialOptions?: boolean;
+    staticWidth?: string;
+    selectedTab?: 'monthly' | 'annually';
+    selectedPlan?: string;
+    currentPlan?: string;
+    maxWidth?: string;
+    minHeightOfFeatures?: number;
+};
+declare const SubscriptionPlansCollected: FunctionComponent<Props>;
+
+export { SubscriptionPlansCollected };

package/dist/cjs/components/plans/SubscriptionPlansCollected.js

@@ -0,0 +1,19 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("styled-components"),i=require("./NewSubscriptionPlan.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const r=a(l).default.div`
+	display: flex;
+	column-gap: 22px;
+	align-items: stretch;
+	overflow-x: scroll;
+	max-width: ${e=>e.maxWidth??"100%"};
+	&::-webkit-scrollbar-thumb {
+		background: #888;
+		border-radius: 8px;
+	}
+	&::-webkit-scrollbar {
+		height: 5px;
+		display: block;
+		width: 8px;
+	}
+	&::-webkit-scrollbar-thumb:horizontal {
+		width: 8px;
+	}
+`;exports.SubscriptionPlansCollected=l=>{const[a,o]=t.useState(l.selectedPlan??"");return e.jsx(r,{style:{padding:"28px 0px 5px 0px"},maxWidth:l.maxWidth,children:l.plans.map(((r,n)=>e.jsx("div",{style:{minWidth:l.staticWidth??280,maxWidth:l.staticWidth??280},children:t.createElement(i.NewSubscriptionPlan,{...r,showMonthly:!0,showMonthlyOptions:"monthly"==l.selectedTab,showTrialOptions:l.showTrialOptions||!1,onPlanSelect:e=>{l.onPlanSelect(e),o(e)},key:r.planName,isPlanSelected:a==("monthly"==l.selectedTab?r.code:r.yearlyCode),onClickShowAllFeatures:l.onClickShowAllFeatures,showSelectedPlanChip:l.currentPlan==("monthly"==l.selectedTab?r.code:r.yearlyCode),minHeightOfFeatures:l.minHeightOfFeatures})},n)))})};

package/dist/cjs/components/postPicker/PostPicker.styled.js

@@ -0,0 +1,128 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../TypographyStyle.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=i(e);o.default.div`
+	position: fixed;
+	top: 0;
+	left: 0;
+	cursor: default;
+	width: 100%;
+	height: 100%;
+	display: flex;
+	background-color: rgba(0, 0, 0, 0.5);
+	align-items: center;
+	justify-content: center;
+`,o.default.div`
+	background-color: #fff;
+	width: 1032px;
+	height: auto;
+	max-height: 600px;
+	border-radius: 4px;
+	padding: 24px;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	position: relative;
+`,o.default.div`
+	display: flex;
+	justify-content: space-between;
+	flex-direction: row;
+	gap: 20px;
+	width: 1032px;
+`,o.default(t.TitleMedium)`
+	padding: 6px 6px 20px 6px;
+`,o.default.div`
+	padding: 6px 6px 20px 6px;
+`;const d=o.default.div`
+	display: grid;
+	grid-template-columns: repeat(
+		${e=>"post"==e.mediaType?6:8},
+		${e=>"post"==e.mediaType?156:113}px
+	);
+	grid-gap: 16px;
+	overflow-y: scroll;
+	height: calc(564px - 140px);
+	overflow-y: auto;
+	padding: 0 24px;
+
+	/* Hide scrollbar by default */
+	&::-webkit-scrollbar {
+		width: 0.5em;
+	}
+	/* Show scrollbar on hover */
+	&:hover::-webkit-scrollbar {
+		width: 0.5em;
+	}
+`,p=o.default.div`
+	position: relative;
+	cursor: pointer;
+	height: ${e=>"post"==e.mediaType?155:180}px;
+	padding: 2px;
+	border-radius: 4px;
+	border: 2px solid transparent;
+
+	img {
+		object-fit: cover;
+		border-radius: 4px;
+	}
+
+	.overlay {
+		position: absolute;
+		top: 2px;
+		left: 2px;
+		width: ${e=>"post"==e.mediaType?148:104}px;
+		height: ${e=>"post"==e.mediaType?148:172}px;
+		background-color: rgba(255, 255, 255, 0.9);
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: space-between;
+		opacity: 0;
+		transition: opacity 0.2s ease-in-out;
+		border-radius: 4px;
+
+		a {
+			text-decoration: none;
+		}
+	}
+
+	.overlay__caption {
+		text-align: center;
+		background: #fafafa;
+		padding: 10px 20px;
+		height: 40px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.overlay__redirection {
+		display: flex;
+		justify-content: center;
+		gap: 5px;
+		padding: 10px;
+	}
+
+	&:hover .overlay {
+		opacity: 1;
+	}
+
+	&.selected {
+		border: 2px solid #731dcf;
+	}
+`;o.default.div`
+	width: 100%;
+	display: flex;
+	flex-direction: row;
+	padding-top: 12px;
+	justify-content: space-between;
+	border-top: 1px solid #e0e0e0;
+`,o.default.div`
+	flex: 1;
+	padding-top: 10px;
+	display: flex;
+	justify-content: flex-start;
+`,o.default.div`
+	flex: 1;
+	display: flex;
+	flex-direction: row;
+	justify-content: flex-end;
+	gap: 10px;
+`,exports.StyledProduct=p,exports.StyledProductGrid=d;

package/dist/cjs/components/postPicker/postPicker.d.ts

@@ -0,0 +1,51 @@
+import React__default from 'react';
+
+declare enum MEDIA_TYPES {
+    STORY = "story",
+    POST = "post",
+    REEL = "reel"
+}
+type Media = {
+    imageUrl: string;
+    redirectionUrl: string;
+    overlayCaption: string;
+    id: string;
+    timestamp?: string;
+};
+type PostPickerProps = {
+    title: string;
+    showModal: boolean;
+    onClose: () => void;
+    onSelect: (Media: Media[]) => void;
+    media: Media[];
+    mediaType: MEDIA_TYPES;
+    previouslySelected?: Media[];
+    limit?: number;
+    selected: Media[];
+    showFilter?: boolean;
+};
+declare enum DateKeys {
+    'Today' = "Today",
+    '7_Days' = "7",
+    '30_Days' = "30",
+    'custom' = "custom",
+    'Yesterday' = "Yesterday"
+}
+interface DateOptionI {
+    label: string;
+    value: string;
+    key: DateKeys;
+    typeValue?: [Date, Date];
+    selectedRange?: [Date, Date];
+    isCustom?: boolean;
+    dateRangeSelectionOptions?: {
+        selectRange: boolean;
+        maxDate?: Date;
+        minDate?: Date;
+    };
+}
+declare const dateOptions: DateOptionI[];
+declare const PostPicker: React__default.FC<PostPickerProps>;
+
+export { DateKeys, MEDIA_TYPES, PostPicker, dateOptions };
+export type { DateOptionI, Media, PostPickerProps };

package/dist/cjs/components/postPicker/postPicker.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/searchIcon.js"),a=require("react"),r=require("./PostPicker.styled.js"),s=require("../tag/Tag.js"),n=require("../TypographyStyle.js"),i=require("../../utils/unCamelCase.js"),o=require("../../constants/colors.js"),l=require("../../constants/Theme.js"),d=require("../../assets/icons/instagram.svg.js"),c=require("../../assets/icons/warning.svg.js");require("../tooltips/Tooltip.js"),require("../analytics-chips-and-dropdowns/CommonStyles.js");var p=require("../analytics-chips-and-dropdowns/AnalyticsDropdown.js");require("../analytics-chips-and-dropdowns/AnalyticsMetric.js"),require("../shimmer/ShimmerComponent/ShimmerStyled.js"),require("../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js"),require("react-bootstrap"),require("../analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js"),require("../analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js"),require("../analytics-chips-and-dropdowns/chart/Pie/PieChart.js"),require("../analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js"),require("../analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js"),require("../analytics-chips-and-dropdowns/chart/VerticalBarGraph/FunnelVerticalBarGraph.js"),require("../analytics-chips-and-dropdowns/chart/heatmap/HeatMapStyled.js"),require("../analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js"),require("../analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js");var h=require("../modals/styledModal.js"),u=require("../shimmer/ShimmerComponent/BikShimmer.js"),y=require("../shimmer-image/ShimmerImage.js"),m=require("../states/StateComponent.js"),g=(e=>(e.STORY="story",e.POST="post",e.REEL="reel",e))(g||{}),j=(e=>(e.Today="Today",e["7_Days"]="7",e["30_Days"]="30",e.custom="custom",e.Yesterday="Yesterday",e))(j||{});const x=[{label:"Today",value:"today",key:"Today",typeValue:[new Date,new Date]},{label:"Last 7 days",value:"7 days",key:"7",typeValue:[new Date((new Date).setDate((new Date).getDate()-6)),new Date]},{label:"Last 30 days",value:"30 days",key:"30",typeValue:[new Date((new Date).setDate((new Date).getDate()-29)),new Date]},{label:"Custom range",value:"calender",key:"custom",isCustom:!0,dateRangeSelectionOptions:{selectRange:!0,maxDate:new Date((new Date).setMonth((new Date).getMonth()+3))}}];exports.DateKeys=j,exports.MEDIA_TYPES=g,exports.PostPicker=g=>{const[j,w]=a.useState(g.previouslySelected??[]),[C,S]=a.useState(""),[f,v]=a.useState(!1),[D,T]=a.useState(g.media),[q,k]=a.useState(!1),[B,b]=a.useState(!1),[I,L]=a.useState(!1),O=a.useRef(null);a.useEffect((()=>{g.media.length||(v(!0),setTimeout((()=>{v(!1)}),2e3)),w(g.selected||[])}),[]),a.useEffect((()=>{g.media.length>0&&(T(g.media),v(!1))}),[g?.media?.length]),a.useEffect((()=>{j.length>0&&S("")}),[j.length]),a.useEffect((()=>{q&&(T(g.media),b(!1))}),[q]),a.useEffect((()=>{const e=e=>{document.getElementById("analytic-dropdown").contains(e.target)||L(!I)},t=document.getElementById("post-picker");return t&&t.addEventListener("click",e),()=>{t&&t.removeEventListener("click",e)}}));return e.jsx("div",{ref:O,children:e.jsxs(h.StyledModal,{zIndex:201,open:g.showModal,headingTitle:g.title,onClose:g.onClose,centralContainerStyles:{width:1071,height:g.showFilter?650:564},primaryButton:{disabled:!D.length,buttonType:"primary",buttonText:`Select ${i.unCamelCase(g.mediaType)}`,onClick:()=>{j.length?g.onSelect(j):S(`Please select a ${g.mediaType} to proceed`)}},secondaryButton:{buttonType:"secondary",buttonText:"Back",onClick:()=>g.onClose()},footerLeftCustomElement:C?e.jsx(s.Tag,{tagText:C,type:"negative",LeadingIcon:c.default}):j.length?e.jsxs(n.BodySecondary,{children:[j.length," selected"]}):null,id:"post-picker",children:[g.showFilter&&e.jsxs("div",{style:{marginTop:24,marginBottom:24,padding:"0 24px",display:"flex",flexDirection:"row",gap:8,alignItems:"center"},children:[e.jsx(p.AnalyticsDropdown,{options:x,placeholder:"posted on",resetDropdown:q,onOptionSelected:e=>{let t=null,a=null;"Custom range"===e.label?(t=e?.selectedRange?.[0]||new Date,a=e?.selectedRange?.[1]||new Date):(t=e.typeValue[0],a=e.typeValue[1]);const r=g.media.filter((e=>function(e,t,a){const r=new Date(e),s=new Date(t),n=new Date(a);return r>=s&&r<=n}(e.timestamp,t,a)));T(r),b(!0),k(!1)},closeDropdown:I}),B&&e.jsx(n.ButtonRegular,{color:l.COLORS.content.secondary,onClick:()=>k(!0),style:{cursor:"pointer"},children:"Clear"})]}),f?e.jsx("div",{style:{padding:"0 24px"},children:e.jsx(u.BikShimmer,{boxes:[{width:("post"==g.mediaType?148:104)+"px",height:("post"==g.mediaType?148:172)+"px"}]})}):e.jsx(e.Fragment,{children:D&&D.length?e.jsx(r.StyledProductGrid,{mediaType:g.mediaType,children:D.map((t=>{return e.jsxs(r.StyledProduct,{mediaType:g.mediaType,className:""+(a=t,s=j,s.some((e=>e.id===a.id))?"selected":""),onClick:()=>{return e=t,void w((()=>j.find((t=>t.id===e.id))?j.filter((t=>t.id!==e.id)):!g.limit||j.length<g.limit?[...j,e]:(S(`Only ${g.limit} ${g.mediaType}s can be selected`),j)));var e},children:[e.jsx(y.ShimmerImage,{imageUrl:t.imageUrl,width:"post"==g.mediaType?148:104,height:"post"==g.mediaType?148:172,alt:t.overlayCaption}),e.jsxs("div",{className:"overlay",children:[e.jsx("a",{target:"_blank",rel:"noreferrer",href:t.redirectionUrl,children:e.jsxs("div",{className:"overlay__redirection",children:[e.jsx(d.default,{height:22,width:22}),e.jsx(n.BodyPrimary,{color:o.PRIMARY,style:{fontWeight:500},children:"View"})]})}),e.jsx("div",{className:"overlay__caption",children:e.jsx(n.BodyCaption,{color:l.COLORS.content.placeholder,children:t.overlayCaption})})]})]},t.id);var a,s}))}):e.jsx("div",{style:{justifyContent:"center",alignItems:"center",display:"flex",height:422},children:g.media.length?D.length?e.jsx(e.Fragment,{}):e.jsxs("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"16px"},children:[e.jsx("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",width:"48px",height:"48px",backgroundColor:`${l.COLORS.background.inverse}`,borderRadius:"50%"},children:e.jsx(t.SearchIcon,{color:l.COLORS.content.primaryInverse})}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:"8px"},children:[e.jsx(n.TitleMedium,{children:"No results found"}),e.jsx(n.BodyPrimary,{children:"Sorry we could not find any results for the selected filter"})]}),e.jsx("div",{onClick:()=>{k(!0)},style:{cursor:"pointer"},children:e.jsx(n.ButtonLarge,{color:`${l.COLORS.content.brand}`,children:"Clear Filter"})})]}):e.jsx(m.StateComponent,{states:m.StateInterface.WARNING,heading:`No ${g.mediaType}s on your account`,subline:`There seems to be no ${g.mediaType}s on your account`,isButtonEnabled:!1,width:400})})})]})})},exports.dateOptions=x;

package/dist/cjs/components/product-picker/ProductPicker.styled.js

@@ -0,0 +1,71 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@emotion/styled"),r=require("../../constants/Theme.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=t(e);const i=o.default.div`
+	height: 364px;
+	background-color: ${r.DEFAULT_THEME.colorsV2.surface.standard};
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	gap: 8px;
+	flex-direction: column;
+
+	.icon__container {
+		height: 48px;
+		width: 48px;
+		border-radius: 50%;
+		background-color: ${r.DEFAULT_THEME.colorsV2.background.base};
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+`,p=o.default.div`
+	margin-top: 8px;
+	.post__wrapper {
+		margin-top: 8px;
+		border-top: 1px solid ${r.DEFAULT_THEME.colorsV2.stroke.primary};
+		background-color: ${r.DEFAULT_THEME.colorsV2.background.warning.light};
+		padding: 12px 24px;
+		display: flex;
+		align-items: center;
+		gap: 16px;
+	}
+
+	.post__thumbnail {
+		height: 68px;
+		width: 68px;
+		object-fit: cover;
+		border-radius: 4px;
+	}
+	.post__info-wrapper {
+		display: flex;
+		gap: 8px;
+		flex-direction: column;
+		width: 350px;
+	}
+	.loader__wrapper {
+		height: 350px;
+		width: 100%;
+		margin-top: 4px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+	.product__wrapper {
+		padding: 12px 24px;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		gap: 19px;
+		border-bottom: 1px solid ${r.DEFAULT_THEME.colorsV2.stroke.primary};
+	}
+	.product__info-wrapper {
+		display: flex;
+		gap: 16px;
+		align-items: center;
+		order: 2;
+	}
+	.product__image {
+		height: 40px;
+		width: 40px;
+		object-fit: cover;
+		border-radius: 4px;
+	}
+`;exports.StyledProductPickerContainer=p,exports.StyledZeroState=i;

package/dist/cjs/components/product-picker/ProductPickerModal.d.ts

@@ -0,0 +1,7 @@
+import React__default from 'react';
+import { ProductPickerProps } from './type.js';
+
+declare const ProductPickerContent: React__default.FC<ProductPickerProps>;
+declare const PricePleaseProductPicker: React__default.FC<ProductPickerProps>;
+
+export { PricePleaseProductPicker, ProductPickerContent };