@bikdotai/bik-component-library 0.0.821-beta.9 → 0.0.821

package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.js

@@ -1,310 +0,0 @@
-import i, { css as o } from "styled-components";
-import { BodyTiny as d } from "../../TypographyStyle.js";
-import { COLORS as t, BASE_COLORS as n, FONTS as r } from "../../../constants/Theme.js";
-const x = i.div`
-	background-color: #28034e;
-	width: 72px;
-	justify-content: space-between;
-	position: sticky;
-	top: 0;
-	left: 0;
-	z-index: 10;
-	overflow-y: auto;
-	height: 100vh;
-
-	.bik-header-logo {
-		padding: 8px 8px 0 8px;
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-		align-items: center;
-		width: 100%;
-		cursor: pointer;
-		img {
-			width: 100%;
-			height: 100%;
-			object-fit: container;
-		}
-	}
-`, c = i.div`
-	margin: 0px 0px 16px;
-	padding-bottom: 8px;
-`, u = i.div``, g = i.div`
-	padding: 0px 6px;
-	margin-bottom: 6px;
-	> * {
-		gap: 4px;
-	}
-`, l = i.div`
-	position: absolute;
-	right: 5px;
-	background: ${t.stroke.warning.vibrant} !important;
-	font-size: 7.7px;
-	font-family: 'Inter';
-	line-height: 10px;
-	padding: 2px 9.27px 2px 9.27px;
-	border-radius: 16px 16px 0px 16px;
-	background: ${t.background.inverse};
-	${({ isLastSticky: e }) => e && o`
-			@media (min-height: 768px) {
-				bottom: 116px;
-				z-index: 1;
-			}
-		`}
-`, m = i.div`
-	position: absolute;
-	right: 10px;
-	margin-top: -5px;
-	${({ isLastSticky: e }) => e && o`
-			@media (min-height: 768px) {
-				bottom: 116px;
-				z-index: 1;
-			}
-		`}
-	${({ is2ndLastSticky: e }) => e && o`
-			@media (min-height: 768px) {
-				bottom: 48px;
-				z-index: 1;
-			}
-		`}
-`, h = i.div`
-	display: flex;
-	flex-direction: column;
-	border-radius: 10px;
-	align-items: center;
-	justify-content: space-around;
-	cursor: pointer;
-	> * {
-		gap: 10px;
-	}
-	padding: 8px 0px;
-
-	${({ isNew: e }) => e && o`
-			padding-top: 14px;
-		`}
-
-	${({ isActive: e }) => e && o`
-			border-radius: 8px;
-			background-color: ${n.brand[850]};
-			color: ${t.content.primaryInverse};
-			box-shadow: inset 0 0 0 1px ${t.stroke.brandSubdued};
-		`}
-
-	${({ isHovered: e }) => e && o`
-			background: ${t.background.brandHovered};
-			border-radius: 8px;
-		`}
-
-	&:hover:not([data-active='true']) {
-		background: ${t.background.brandHovered};
-		border-radius: 8px;
-	}
-
-	${({ isActive: e, isHovered: a }) => e && a && o`
-			border-radius: 8px;
-			box-shadow: inset 0 0 0 1px ${n.brand[700]};
-			background-color: ${n.brand[800]};
-		`}
-
-	${({ isLastSticky: e }) => e && o`
-			@media (min-height: 768px) {
-				position: absolute;
-				bottom: 72px;
-				left: 6px;
-				right: 6px;
-			}
-		`}
-
-	${({ is2ndLastSticky: e }) => e && o`
-			@media (min-height: 768px) {
-				position: absolute;
-				bottom: 8px;
-				left: 6px;
-				right: 6px;
-			}
-		`}
-
-	${({ stickyBottom: e }) => e !== void 0 && o`
-			@media (min-height: 768px) {
-				position: absolute;
-				bottom: ${e}px;
-				left: 6px;
-				right: 6px;
-			}
-		`}
-`, f = i.div`
-	display: flex;
-	flex-direction: row;
-	width: 100%;
-	cursor: pointer;
-`, $ = i(d)`
-	user-select: none;
-	width: 100%;
-	color: ${({ isActive: e }) => e ? t.content.primaryInverse : t.content.secondaryInverse};
-	margin-bottom: 0px;
-	text-align: center;
-`, v = i.div`
-	.transform-class {
-		position: relative;
-		animation: animatebottom 0.2s;
-		transition-timing-function: ease-out;
-	}
-	@keyframes animatebottom {
-		from {
-			opacity: 0;
-		}
-
-		to {
-			opacity: 1;
-		}
-	}
-	.sidebar-right-menu {
-		position: ${(e) => e.postion ? e.postion : "sticky"};
-		top: ${(e) => e.top ? e.top : 0}px;
-		left: ${(e) => e.left ? e.left : 0}px; //72
-		width: ${(e) => e.width ? e.width : 240}px;
-		z-index: ${(e) => e.zIndex ? e.zIndex : 2};
-		background-color: ${(e) => e.theme == "brand" ? t.background.inverse : t.surface.standard};
-		height: ${(e) => e.isNewSidebar ? "fit-content" : "100vh"};
-		display: flex;
-		flex-direction: column;
-		padding: 4px;
-		border-radius: ${(e) => e.isNewSidebar ? "8px" : ""};
-
-		.sidebar-bridge {
-			position: absolute;
-			right: 100%;
-			top: 0;
-			width: 6px;
-			height: 100%;
-		}
-	}
-
-	.sub-child-menu {
-		display: flex;
-		align-items: center;
-		justify-content: flex-start;
-		margin-bottom: ${(e) => e.isNewSidebar ? "" : "8px"};
-		cursor: pointer;
-		background: ${(e) => e.theme == "brand" ? t.background.inverse : "transparent"};
-		border-radius: 4px;
-		.sub-child-text {
-			color: ${(e) => e.theme == "brand" ? t.surface.standard : ""};
-			margin-bottom: 0px;
-			padding: 8px 12px;
-			font-size: ${r.caption.fontSize}px;
-			line-height: ${r.caption.lineHeight}px;
-			font-weight: ${r.caption.fontWeight};
-			white-space: nowrap;
-			overflow: hidden;
-			text-overflow: ellipsis;
-		}
-		.sub-child-new-tag {
-			padding: 2px 9px 2px 9px;
-			border-radius: 16px;
-			background-color: rgba(254, 192, 45, 1);
-			font-family: Inter;
-			font-size: 7px;
-			font-weight: 600;
-			line-height: 10px;
-			color: rgba(40, 3, 78, 1);
-		}
-		.sub-child-active-text {
-			display: none;
-		}
-		.active-bold-weight {
-			font-weight: 600;
-			color: ${(e) => e.isNewSidebar ? t.background.warning.vibrant : ""};
-		}
-		.sub-child-active-menu-style {
-			color: ${(e) => e.isNewSidebar ? t.background.warning.vibrant : ""};
-		}
-	}
-	.sub-child-menu:hover {
-		background: ${(e) => e.theme == "brand" ? t.background.brandHovered : t.background.base};
-		border-radius: 4px;
-	}
-	.sub-child-active-menu {
-		background: ${(e) => e.theme == "brand" ? t.background.brandHovered : t.background.base};
-		border-radius: 4px;
-		border: ${(e) => e.theme == "brand" ? `1px solid ${t.stroke.brandSubdued}` : "none"};
-		.sub-child-active-text {
-			background: ${(e) => e.theme == "brand" ? t.stroke.brandSubdued : t.background.warning.vibrant};
-		}
-	}
-	.sub-child-active-menu:hover {
-		background: ${(e) => e.theme == "brand" ? t.background.inverseLight : t.background.base};
-		border-radius: 4px;
-		border: ${(e) => e.theme == "brand" ? `1px solid ${t.stroke.brandSubdued}` : "none"};
-		.sub-child-active-text {
-			background: ${(e) => e.theme == "brand" ? t.stroke.brandSubdued : t.background.warning.vibrant};
-		}
-	}
-	.sub-child-display-name {
-		padding: 14px 12px;
-		color: ${(e) => e.theme == "brand" ? t.content.secondaryInverse : t.text.secondary};
-	}
-	.lower-sticky-panel {
-		position: ${(e) => e.isNewSidebar ? "relative" : "absolute"};
-		bottom: ${(e) => e.isNewSidebar ? "" : "16px"};
-		margin-top: ${(e) => e.isNewSidebar ? "auto" : ""};
-		margin-bottom: ${(e) => e.isNewSidebar ? "16px" : ""};
-		.title-text {
-			padding: 8px 12px;
-			text-align: center;
-		}
-		.upgrade-button {
-			margin: auto;
-		}
-	}
-	.sidebar-skeleton {
-		padding: 8px;
-	}
-`, k = i.div`
-	.sidebar-right-menu {
-		border-radius: 8px;
-		border: 0.5px solid var(--stroke-color-stroke-primary, #e0e0e0);
-		box-shadow: 0px 0px 12px 0px rgba(222, 236, 255, 0.6);
-		position: ${(e) => e.postion ? e.postion : "sticky"};
-		top: ${(e) => e.top ? e.top : void 0}px;
-		bottom: 10px;
-		left: ${(e) => e.left ? e.left : 0}px; //72
-		z-index: ${(e) => e.zIndex ? e.zIndex : 2};
-		background-color: ${(e) => e.theme == "brand" ? "#381062" : t.surface.standard};
-		display: flex;
-		flex-direction: column;
-		padding: 4px;
-		gap: 4px;
-		min-height: 100px;
-		overflow-y: auto;
-	}
-	.each-menu {
-		padding: 8px;
-		gap: 4px;
-		display: flex;
-		flex-direction: column;
-		justify-content: flex-start;
-		align-items: flex-start;
-		border-bottom: 0.5px solid #e0e0e0;
-		cursor: pointer;
-		max-width: 320px;
-		&:hover {
-			background-color: ${t.background.base};
-			border-radius: 8px;
-		}
-	}
-`;
-export {
-  c as MainSideBarV2MenuWrapper,
-  u as SibeBarV2MenuItem,
-  x as SideBarV2Container,
-  m as SidebarLockedChannel,
-  g as SidebarMainMenu,
-  f as SidebarMenuItemContainer,
-  h as SidebarMenuItemInner,
-  $ as SidebarMenuItemText,
-  l as SidebarNewTag,
-  k as SidebarV2PopupContainer,
-  v as SimpleSidebarV2Container
-};
-//# sourceMappingURL=SidebarV2Styles.js.map

package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidebarV2Styles.js","sources":["../../../../../src/components/bik-layout/BikSidebarV2/SidebarV2Styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { BodyTiny } from '@src/components/TypographyStyle';\nimport { BASE_COLORS, COLORS, FONTS } from '@src/constants/Theme';\nimport { SidebarV2Theme } from './SidebarV2.model';\n\nexport const SideBarV2Container = styled.div`\n\tbackground-color: #28034e;\n\twidth: 72px;\n\tjustify-content: space-between;\n\tposition: sticky;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 10;\n\toverflow-y: auto;\n\theight: 100vh;\n\n\t.bik-header-logo {\n\t\tpadding: 8px 8px 0 8px;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\twidth: 100%;\n\t\tcursor: pointer;\n\t\timg {\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tobject-fit: container;\n\t\t}\n\t}\n`;\n\nexport const MainSideBarV2MenuWrapper = styled.div`\n\tmargin: 0px 0px 16px;\n\tpadding-bottom: 8px;\n`;\n\nexport const SibeBarV2MenuItem = styled.div``;\n\nexport const SidebarMainMenu = styled.div`\n\tpadding: 0px 6px;\n\tmargin-bottom: 6px;\n\t> * {\n\t\tgap: 4px;\n\t}\n`;\n\nexport const SidebarNewTag = styled.div<{ isLastSticky?: boolean }>`\n\tposition: absolute;\n\tright: 5px;\n\tbackground: ${COLORS.stroke.warning.vibrant} !important;\n\tfont-size: 7.7px;\n\tfont-family: 'Inter';\n\tline-height: 10px;\n\tpadding: 2px 9.27px 2px 9.27px;\n\tborder-radius: 16px 16px 0px 16px;\n\tbackground: ${COLORS.background.inverse};\n\t${({ isLastSticky }) =>\n\t\tisLastSticky &&\n\t\tcss`\n\t\t\t@media (min-height: 768px) {\n\t\t\t\tbottom: 116px;\n\t\t\t\tz-index: 1;\n\t\t\t}\n\t\t`}\n`;\n\nexport const SidebarLockedChannel = styled.div<{\n\tisLastSticky?: boolean;\n\tis2ndLastSticky?: boolean;\n}>`\n\tposition: absolute;\n\tright: 10px;\n\tmargin-top: -5px;\n\t${({ isLastSticky }) =>\n\t\tisLastSticky &&\n\t\tcss`\n\t\t\t@media (min-height: 768px) {\n\t\t\t\tbottom: 116px;\n\t\t\t\tz-index: 1;\n\t\t\t}\n\t\t`}\n\t${({ is2ndLastSticky }) =>\n\t\tis2ndLastSticky &&\n\t\tcss`\n\t\t\t@media (min-height: 768px) {\n\t\t\t\tbottom: 48px;\n\t\t\t\tz-index: 1;\n\t\t\t}\n\t\t`}\n`;\n\nexport const SidebarMenuItemInner = styled.div<{\n\tisActive?: boolean;\n\tisHovered?: boolean;\n\tisNew?: boolean;\n\tisLastSticky?: boolean;\n\tis2ndLastSticky?: boolean;\n\tstickyBottom?: number;\n}>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tborder-radius: 10px;\n\talign-items: center;\n\tjustify-content: space-around;\n\tcursor: pointer;\n\t> * {\n\t\tgap: 10px;\n\t}\n\tpadding: 8px 0px;\n\n\t${({ isNew }) =>\n\t\tisNew &&\n\t\tcss`\n\t\t\tpadding-top: 14px;\n\t\t`}\n\n\t${({ isActive }) =>\n\t\tisActive &&\n\t\tcss`\n\t\t\tborder-radius: 8px;\n\t\t\tbackground-color: ${BASE_COLORS.brand['850']};\n\t\t\tcolor: ${COLORS.content.primaryInverse};\n\t\t\tbox-shadow: inset 0 0 0 1px ${COLORS.stroke.brandSubdued};\n\t\t`}\n\n\t${({ isHovered }) =>\n\t\tisHovered &&\n\t\tcss`\n\t\t\tbackground: ${COLORS.background.brandHovered};\n\t\t\tborder-radius: 8px;\n\t\t`}\n\n\t&:hover:not([data-active='true']) {\n\t\tbackground: ${COLORS.background.brandHovered};\n\t\tborder-radius: 8px;\n\t}\n\n\t${({ isActive, isHovered }) =>\n\t\tisActive &&\n\t\tisHovered &&\n\t\tcss`\n\t\t\tborder-radius: 8px;\n\t\t\tbox-shadow: inset 0 0 0 1px ${BASE_COLORS.brand['700']};\n\t\t\tbackground-color: ${BASE_COLORS.brand['800']};\n\t\t`}\n\n\t${({ isLastSticky }) =>\n\t\tisLastSticky &&\n\t\tcss`\n\t\t\t@media (min-height: 768px) {\n\t\t\t\tposition: absolute;\n\t\t\t\tbottom: 72px;\n\t\t\t\tleft: 6px;\n\t\t\t\tright: 6px;\n\t\t\t}\n\t\t`}\n\n\t${({ is2ndLastSticky }) =>\n\t\tis2ndLastSticky &&\n\t\tcss`\n\t\t\t@media (min-height: 768px) {\n\t\t\t\tposition: absolute;\n\t\t\t\tbottom: 8px;\n\t\t\t\tleft: 6px;\n\t\t\t\tright: 6px;\n\t\t\t}\n\t\t`}\n\n\t${({ stickyBottom }) =>\n\t\tstickyBottom !== undefined &&\n\t\tcss`\n\t\t\t@media (min-height: 768px) {\n\t\t\t\tposition: absolute;\n\t\t\t\tbottom: ${stickyBottom}px;\n\t\t\t\tleft: 6px;\n\t\t\t\tright: 6px;\n\t\t\t}\n\t\t`}\n`;\n\nexport const SidebarMenuItemContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\twidth: 100%;\n\tcursor: pointer;\n`;\n\nexport const SidebarMenuItemText = styled(BodyTiny)<{ isActive?: boolean }>`\n\tuser-select: none;\n\twidth: 100%;\n\tcolor: ${({ isActive }) =>\n\t\tisActive ? COLORS.content.primaryInverse : COLORS.content.secondaryInverse};\n\tmargin-bottom: 0px;\n\ttext-align: center;\n`;\n\nexport const SimpleSidebarV2Container = styled.div<{\n\tpostion?: 'fixed' | 'sticky';\n\ttop?: number;\n\ttheme: SidebarV2Theme;\n\twidth?: number;\n\tzIndex?: number;\n\tleft?: number;\n\tisNewSidebar?: boolean;\n}>`\n\t.transform-class {\n\t\tposition: relative;\n\t\tanimation: animatebottom 0.2s;\n\t\ttransition-timing-function: ease-out;\n\t}\n\t@keyframes animatebottom {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t}\n\n\t\tto {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t.sidebar-right-menu {\n\t\tposition: ${(props) => (props.postion ? props.postion : 'sticky')};\n\t\ttop: ${(props) => (props.top ? props.top : 0)}px;\n\t\tleft: ${(props) => (props.left ? props.left : 0)}px; //72\n\t\twidth: ${(props) => (props.width ? props.width : 240)}px;\n\t\tz-index: ${(props) => (props.zIndex ? props.zIndex : 2)};\n\t\tbackground-color: ${(props) =>\n\t\t\tprops.theme == 'brand'\n\t\t\t\t? COLORS.background.inverse\n\t\t\t\t: COLORS.surface.standard};\n\t\theight: ${(props) => (props.isNewSidebar ? 'fit-content' : '100vh')};\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tpadding: 4px;\n\t\tborder-radius: ${(props) => (props.isNewSidebar ? '8px' : '')};\n\n\t\t.sidebar-bridge {\n\t\t\tposition: absolute;\n\t\t\tright: 100%;\n\t\t\ttop: 0;\n\t\t\twidth: 6px;\n\t\t\theight: 100%;\n\t\t}\n\t}\n\n\t.sub-child-menu {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: flex-start;\n\t\tmargin-bottom: ${(props) => (props.isNewSidebar ? '' : '8px')};\n\t\tcursor: pointer;\n\t\tbackground: ${(props) =>\n\t\t\tprops.theme == 'brand' ? COLORS.background.inverse : 'transparent'};\n\t\tborder-radius: 4px;\n\t\t.sub-child-text {\n\t\t\tcolor: ${(props) =>\n\t\t\t\tprops.theme == 'brand' ? COLORS.surface.standard : ''};\n\t\t\tmargin-bottom: 0px;\n\t\t\tpadding: 8px 12px;\n\t\t\tfont-size: ${FONTS.caption.fontSize}px;\n\t\t\tline-height: ${FONTS.caption.lineHeight}px;\n\t\t\tfont-weight: ${FONTS.caption.fontWeight};\n\t\t\twhite-space: nowrap;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t}\n\t\t.sub-child-new-tag {\n\t\t\tpadding: 2px 9px 2px 9px;\n\t\t\tborder-radius: 16px;\n\t\t\tbackground-color: rgba(254, 192, 45, 1);\n\t\t\tfont-family: Inter;\n\t\t\tfont-size: 7px;\n\t\t\tfont-weight: 600;\n\t\t\tline-height: 10px;\n\t\t\tcolor: rgba(40, 3, 78, 1);\n\t\t}\n\t\t.sub-child-active-text {\n\t\t\tdisplay: none;\n\t\t}\n\t\t.active-bold-weight {\n\t\t\tfont-weight: 600;\n\t\t\tcolor: ${(props) =>\n\t\t\t\tprops.isNewSidebar ? COLORS.background.warning.vibrant : ''};\n\t\t}\n\t\t.sub-child-active-menu-style {\n\t\t\tcolor: ${(props) =>\n\t\t\t\tprops.isNewSidebar ? COLORS.background.warning.vibrant : ''};\n\t\t}\n\t}\n\t.sub-child-menu:hover {\n\t\tbackground: ${(props) =>\n\t\t\tprops.theme == 'brand'\n\t\t\t\t? COLORS.background.brandHovered\n\t\t\t\t: COLORS.background.base};\n\t\tborder-radius: 4px;\n\t}\n\t.sub-child-active-menu {\n\t\tbackground: ${(props) =>\n\t\t\tprops.theme == 'brand'\n\t\t\t\t? COLORS.background.brandHovered\n\t\t\t\t: COLORS.background.base};\n\t\tborder-radius: 4px;\n\t\tborder: ${(props) =>\n\t\t\tprops.theme == 'brand'\n\t\t\t\t? `1px solid ${COLORS.stroke.brandSubdued}`\n\t\t\t\t: 'none'};\n\t\t.sub-child-active-text {\n\t\t\tbackground: ${(props) =>\n\t\t\t\tprops.theme == 'brand'\n\t\t\t\t\t? COLORS.stroke.brandSubdued\n\t\t\t\t\t: COLORS.background.warning.vibrant};\n\t\t}\n\t}\n\t.sub-child-active-menu:hover {\n\t\tbackground: ${(props) =>\n\t\t\tprops.theme == 'brand'\n\t\t\t\t? COLORS.background.inverseLight\n\t\t\t\t: COLORS.background.base};\n\t\tborder-radius: 4px;\n\t\tborder: ${(props) =>\n\t\t\tprops.theme == 'brand'\n\t\t\t\t? `1px solid ${COLORS.stroke.brandSubdued}`\n\t\t\t\t: 'none'};\n\t\t.sub-child-active-text {\n\t\t\tbackground: ${(props) =>\n\t\t\t\tprops.theme == 'brand'\n\t\t\t\t\t? COLORS.stroke.brandSubdued\n\t\t\t\t\t: COLORS.background.warning.vibrant};\n\t\t}\n\t}\n\t.sub-child-display-name {\n\t\tpadding: 14px 12px;\n\t\tcolor: ${(props) =>\n\t\t\tprops.theme == 'brand'\n\t\t\t\t? COLORS.content.secondaryInverse\n\t\t\t\t: COLORS.text.secondary};\n\t}\n\t.lower-sticky-panel {\n\t\tposition: ${(props) => (props.isNewSidebar ? 'relative' : 'absolute')};\n\t\tbottom: ${(props) => (props.isNewSidebar ? '' : '16px')};\n\t\tmargin-top: ${(props) => (props.isNewSidebar ? 'auto' : '')};\n\t\tmargin-bottom: ${(props) => (props.isNewSidebar ? '16px' : '')};\n\t\t.title-text {\n\t\t\tpadding: 8px 12px;\n\t\t\ttext-align: center;\n\t\t}\n\t\t.upgrade-button {\n\t\t\tmargin: auto;\n\t\t}\n\t}\n\t.sidebar-skeleton {\n\t\tpadding: 8px;\n\t}\n`;\n\nexport const SidebarV2PopupContainer = styled.div<{\n\tpostion?: 'fixed' | 'sticky';\n\ttop?: number;\n\ttheme: SidebarV2Theme;\n\tzIndex?: number;\n\tleft?: number;\n\tbottom?: number;\n}>`\n\t.sidebar-right-menu {\n\t\tborder-radius: 8px;\n\t\tborder: 0.5px solid var(--stroke-color-stroke-primary, #e0e0e0);\n\t\tbox-shadow: 0px 0px 12px 0px rgba(222, 236, 255, 0.6);\n\t\tposition: ${(props) => (props.postion ? props.postion : 'sticky')};\n\t\ttop: ${(props) => (props.top ? props.top : undefined)}px;\n\t\tbottom: 10px;\n\t\tleft: ${(props) => (props.left ? props.left : 0)}px; //72\n\t\tz-index: ${(props) => (props.zIndex ? props.zIndex : 2)};\n\t\tbackground-color: ${(props) =>\n\t\t\tprops.theme == 'brand' ? '#381062' : COLORS.surface.standard};\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tpadding: 4px;\n\t\tgap: 4px;\n\t\tmin-height: 100px;\n\t\toverflow-y: auto;\n\t}\n\t.each-menu {\n\t\tpadding: 8px;\n\t\tgap: 4px;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: flex-start;\n\t\talign-items: flex-start;\n\t\tborder-bottom: 0.5px solid #e0e0e0;\n\t\tcursor: pointer;\n\t\tmax-width: 320px;\n\t\t&:hover {\n\t\t\tbackground-color: ${COLORS.background.base};\n\t\t\tborder-radius: 8px;\n\t\t}\n\t}\n`;\n"],"names":["SideBarV2Container","styled","MainSideBarV2MenuWrapper","SibeBarV2MenuItem","SidebarMainMenu","SidebarNewTag","COLORS","isLastSticky","css","SidebarLockedChannel","is2ndLastSticky","SidebarMenuItemInner","isNew","isActive","BASE_COLORS","isHovered","stickyBottom","SidebarMenuItemContainer","SidebarMenuItemText","BodyTiny","SimpleSidebarV2Container","props","FONTS","SidebarV2PopupContainer"],"mappings":"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"}

package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts

@@ -1,2 +0,0 @@
-import { SimpleSidebarV2Props } from './SidebarV2.model';
-export declare const SimpleSidebarV2: React.FC<SimpleSidebarV2Props>;

package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js

@@ -1,107 +0,0 @@
-import { jsx as a, jsxs as t } from "react/jsx-runtime";
-import { useState as x } from "react";
-import { COLORS as C } from "../../../constants/Theme.js";
-import { NavigationHyperlink as L } from "../../navigation-hyperlink/NavigationHyperlink.js";
-import { BodyCaption as m, TitleSmall as O } from "../../TypographyStyle.js";
-import { SimpleSidebarV2Container as U } from "./SidebarV2Styles.js";
-import { Button as A } from "../../button/Button.js";
-const $ = (u) => {
-  const {
-    menuList: c,
-    activeMenu: d,
-    theme: r,
-    showAccessUpgradePanel: p = !1,
-    header: b,
-    width: h,
-    zIndex: v,
-    left: N,
-    postion: g,
-    top: y,
-    router: f,
-    onMouseLeaveOnMenu: k,
-    onMouseEnterOnMenu: M,
-    onMenuClick: S,
-    onUpgrade: n,
-    isNewSidebar: o
-  } = u, [i, w] = x(d), l = (e, s) => /* @__PURE__ */ t(
-    "div",
-    {
-      className: `sub-child-menu  ${i?.key == e?.key ? "sub-child-active-menu" : ""}`,
-      onClick: () => {
-        w(e), S(e, !e.page);
-      },
-      "aria-hidden": "true",
-      children: [
-        /* @__PURE__ */ a(
-          "span",
-          {
-            className: i?.key == e?.key && r == "brand" ? "sub-child-active-text" : ""
-          }
-        ),
-        /* @__PURE__ */ a(
-          m,
-          {
-            className: `sub-child-text ${i?.key == e?.key && r == "white" ? "active-bold-weight" : ""}`,
-            children: e?.displayName
-          }
-        ),
-        e.isNew && /* @__PURE__ */ a("div", { className: "sub-child-new-tag", children: "NEW" })
-      ]
-    },
-    s
-  );
-  return /* @__PURE__ */ a(
-    U,
-    {
-      width: h,
-      zIndex: v,
-      left: N,
-      theme: r,
-      postion: g,
-      top: y,
-      isNewSidebar: o,
-      children: /* @__PURE__ */ t(
-        "div",
-        {
-          id: "_sub-menu",
-          className: "sidebar-right-menu transform-class",
-          onMouseLeave: k,
-          onMouseEnter: M,
-          children: [
-            /* @__PURE__ */ a("div", { className: "sidebar-bridge" }),
-            /* @__PURE__ */ t("div", { children: [
-              !o && /* @__PURE__ */ a(m, { className: "sub-child-display-name", children: b }),
-              c?.map((e, s) => e.page ? /* @__PURE__ */ a(L, { href: e.page, router: f, children: l(e, s) }) : l(e, s))
-            ] }),
-            p && /* @__PURE__ */ t("div", { className: "lower-sticky-panel", children: [
-              /* @__PURE__ */ a(
-                O,
-                {
-                  className: "title-text",
-                  style: { color: C.surface.standard },
-                  children: "Upgrade plan to access this feature."
-                }
-              ),
-              /* @__PURE__ */ a(
-                A,
-                {
-                  className: "upgrade-button",
-                  buttonText: "Upgrade plan",
-                  buttonType: "primary",
-                  size: "small",
-                  inverse: !0,
-                  onClick: () => n ? n() : ""
-                }
-              )
-            ] })
-          ]
-        },
-        "_sub-menu"
-      )
-    }
-  );
-};
-export {
-  $ as SimpleSidebarV2
-};
-//# sourceMappingURL=SimpleSidebarV2.js.map

package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SimpleSidebarV2.js","sources":["../../../../../src/components/bik-layout/BikSidebarV2/SimpleSidebarV2.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { Button } from '../../button';\nimport { NavigationHyperlink } from '../../navigation-hyperlink/NavigationHyperlink';\nimport { BodyCaption, TitleSmall } from '../../TypographyStyle';\nimport { Menu, SimpleSidebarV2Props } from './SidebarV2.model';\nimport { SimpleSidebarV2Container } from './SidebarV2Styles';\n\nexport const SimpleSidebarV2: React.FC<SimpleSidebarV2Props> = (\n\tsimpleSidebarProps,\n) => {\n\tconst {\n\t\tmenuList,\n\t\tactiveMenu,\n\t\ttheme,\n\t\tshowAccessUpgradePanel = false,\n\t\theader,\n\t\twidth,\n\t\tzIndex,\n\t\tleft,\n\t\tpostion,\n\t\ttop,\n\t\trouter,\n\t\tonMouseLeaveOnMenu,\n\t\tonMouseEnterOnMenu,\n\t\tonMenuClick,\n\t\tonUpgrade,\n\t\tisNewSidebar,\n\t} = simpleSidebarProps;\n\n\tconst [isActiveMenu, setIsActiveMenu] = useState(activeMenu);\n\tconst getChildSideBar = (child: Menu, hoveredIndex: number) => {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={`sub-child-menu  ${\n\t\t\t\t\tisActiveMenu?.key == child?.key ? 'sub-child-active-menu' : ''\n\t\t\t\t}`}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tsetIsActiveMenu(child);\n\t\t\t\t\tonMenuClick(child, !child.page);\n\t\t\t\t}}\n\t\t\t\tkey={hoveredIndex}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t<span\n\t\t\t\t\tclassName={\n\t\t\t\t\t\tisActiveMenu?.key == child?.key && theme == 'brand'\n\t\t\t\t\t\t\t? 'sub-child-active-text'\n\t\t\t\t\t\t\t: ''\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<BodyCaption\n\t\t\t\t\tclassName={`sub-child-text ${\n\t\t\t\t\t\tisActiveMenu?.key == child?.key && theme == 'white'\n\t\t\t\t\t\t\t? 'active-bold-weight'\n\t\t\t\t\t\t\t: ''\n\t\t\t\t\t}`}\n\t\t\t\t>\n\t\t\t\t\t{child?.displayName}\n\t\t\t\t</BodyCaption>\n\t\t\t\t{child.isNew && <div className=\"sub-child-new-tag\">NEW</div>}\n\t\t\t</div>\n\t\t);\n\t};\n\n\treturn (\n\t\t<SimpleSidebarV2Container\n\t\t\twidth={width}\n\t\t\tzIndex={zIndex}\n\t\t\tleft={left}\n\t\t\ttheme={theme}\n\t\t\tpostion={postion}\n\t\t\ttop={top}\n\t\t\tisNewSidebar={isNewSidebar}\n\t\t>\n\t\t\t<div\n\t\t\t\tid={'_sub-menu'}\n\t\t\t\tkey={'_sub-menu'}\n\t\t\t\tclassName={'sidebar-right-menu' + ' transform-class'}\n\t\t\t\tonMouseLeave={onMouseLeaveOnMenu}\n\t\t\t\tonMouseEnter={onMouseEnterOnMenu}\n\t\t\t>\n\t\t\t\t<div className=\"sidebar-bridge\" />\n\t\t\t\t<div>\n\t\t\t\t\t{!isNewSidebar && (\n\t\t\t\t\t\t<BodyCaption className=\"sub-child-display-name\">\n\t\t\t\t\t\t\t{header}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{menuList?.map((child, hoveredIndex) => {\n\t\t\t\t\t\treturn child.page ? (\n\t\t\t\t\t\t\t<NavigationHyperlink href={child.page} router={router}>\n\t\t\t\t\t\t\t\t{getChildSideBar(child, hoveredIndex)}\n\t\t\t\t\t\t\t</NavigationHyperlink>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tgetChildSideBar(child, hoveredIndex)\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t\t{showAccessUpgradePanel && (\n\t\t\t\t\t<div className=\"lower-sticky-panel\">\n\t\t\t\t\t\t<TitleSmall\n\t\t\t\t\t\t\tclassName=\"title-text\"\n\t\t\t\t\t\t\tstyle={{ color: COLORS.surface.standard }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tUpgrade plan to access this feature.\n\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"upgrade-button\"\n\t\t\t\t\t\t\tbuttonText=\"Upgrade plan\"\n\t\t\t\t\t\t\tbuttonType=\"primary\"\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tinverse\n\t\t\t\t\t\t\tonClick={() => (onUpgrade ? onUpgrade() : '')}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</SimpleSidebarV2Container>\n\t);\n};\n"],"names":["SimpleSidebarV2","simpleSidebarProps","menuList","activeMenu","theme","showAccessUpgradePanel","header","width","zIndex","left","postion","top","router","onMouseLeaveOnMenu","onMouseEnterOnMenu","onMenuClick","onUpgrade","isNewSidebar","isActiveMenu","setIsActiveMenu","useState","getChildSideBar","child","hoveredIndex","jsxs","jsx","BodyCaption","SimpleSidebarV2Container","NavigationHyperlink","TitleSmall","COLORS","Button"],"mappings":"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"}

package/dist/esm/components/dual-icon-button/DualIconButton.d.ts

@@ -1,3 +0,0 @@
-import { default as React } from 'react';
-import { DualIconButtonProps } from './model';
-export declare const DualIconButton: React.ForwardRefExoticComponent<DualIconButtonProps & React.RefAttributes<HTMLDivElement>>;

package/dist/esm/components/dual-icon-button/DualIconButton.js

@@ -1,53 +0,0 @@
-import { jsxs as y, jsx as t } from "react/jsx-runtime";
-import n, { forwardRef as v } from "react";
-import { COLORS as e } from "../../constants/Theme.js";
-import { Container as C, IconHalf as c, Divider as k } from "./DualIconButton.styled.js";
-const I = v(
-  ({
-    id: i,
-    LeftIcon: l,
-    RightIcon: m,
-    onLeftClick: a,
-    onRightClick: h,
-    disabled: o,
-    leftIconColor: p,
-    rightIconColor: f,
-    style: s
-  }, u) => {
-    const r = o ? e.content.inactive : e.content.primaryInverse;
-    return /* @__PURE__ */ y(C, { id: i, ref: u, disabled: o, style: s, children: [
-      /* @__PURE__ */ t(
-        c,
-        {
-          disabled: o,
-          onClick: o ? void 0 : a,
-          children: n.createElement(l, {
-            height: 16,
-            width: 16,
-            color: p || r,
-            style: { display: "block" }
-          })
-        }
-      ),
-      /* @__PURE__ */ t(k, {}),
-      /* @__PURE__ */ t(
-        c,
-        {
-          disabled: o,
-          onClick: o ? void 0 : h,
-          children: n.createElement(m, {
-            height: 16,
-            width: 16,
-            color: f || r,
-            style: { display: "block" }
-          })
-        }
-      )
-    ] });
-  }
-);
-I.displayName = "DualIconButton";
-export {
-  I as DualIconButton
-};
-//# sourceMappingURL=DualIconButton.js.map

package/dist/esm/components/dual-icon-button/DualIconButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DualIconButton.js","sources":["../../../../src/components/dual-icon-button/DualIconButton.tsx"],"sourcesContent":["import React from 'react';\nimport { forwardRef } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport * as Sc from './DualIconButton.styled';\nimport { DualIconButtonProps } from './model';\n\nexport const DualIconButton = forwardRef<HTMLDivElement, DualIconButtonProps>(\n\t(\n\t\t{\n\t\t\tid,\n\t\t\tLeftIcon,\n\t\t\tRightIcon,\n\t\t\tonLeftClick,\n\t\t\tonRightClick,\n\t\t\tdisabled,\n\t\t\tleftIconColor,\n\t\t\trightIconColor,\n\t\t\tstyle,\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst iconColor = disabled\n\t\t\t? COLORS.content.inactive\n\t\t\t: COLORS.content.primaryInverse;\n\n\t\treturn (\n\t\t\t<Sc.Container id={id} ref={ref} disabled={disabled} style={style}>\n\t\t\t\t<Sc.IconHalf\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={disabled ? undefined : onLeftClick}\n\t\t\t\t>\n\t\t\t\t\t{React.createElement(LeftIcon, {\n\t\t\t\t\t\theight: 16,\n\t\t\t\t\t\twidth: 16,\n\t\t\t\t\t\tcolor: leftIconColor || iconColor,\n\t\t\t\t\t\tstyle: { display: 'block' },\n\t\t\t\t\t})}\n\t\t\t\t</Sc.IconHalf>\n\t\t\t\t<Sc.Divider />\n\t\t\t\t<Sc.IconHalf\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={disabled ? undefined : onRightClick}\n\t\t\t\t>\n\t\t\t\t\t{React.createElement(RightIcon, {\n\t\t\t\t\t\theight: 16,\n\t\t\t\t\t\twidth: 16,\n\t\t\t\t\t\tcolor: rightIconColor || iconColor,\n\t\t\t\t\t\tstyle: { display: 'block' },\n\t\t\t\t\t})}\n\t\t\t\t</Sc.IconHalf>\n\t\t\t</Sc.Container>\n\t\t);\n\t},\n);\n\nDualIconButton.displayName = 'DualIconButton';\n"],"names":["DualIconButton","forwardRef","id","LeftIcon","RightIcon","onLeftClick","onRightClick","disabled","leftIconColor","rightIconColor","style","ref","iconColor","COLORS","Sc.Container","jsx","Sc.IconHalf","React","Sc.Divider"],"mappings":";;;;AAMO,MAAMA,IAAiBC;AAAA,EAC7B,CACC;AAAA,IACC,IAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,OAAAC;AAAA,EAAA,GAEDC,MACI;AACJ,UAAMC,IAAYL,IACfM,EAAO,QAAQ,WACfA,EAAO,QAAQ;AAElB,6BACEC,GAAA,EAAa,IAAAZ,GAAQ,KAAAS,GAAU,UAAAJ,GAAoB,OAAAG,GACnD,UAAA;AAAA,MAAA,gBAAAK;AAAA,QAACC;AAAAA,QAAA;AAAA,UACA,UAAAT;AAAA,UACA,SAASA,IAAW,SAAYF;AAAA,UAE/B,UAAAY,EAAM,cAAcd,GAAU;AAAA,YAC9B,QAAQ;AAAA,YACR,OAAO;AAAA,YACP,OAAOK,KAAiBI;AAAA,YACxB,OAAO,EAAE,SAAS,QAAA;AAAA,UAAQ,CAC1B;AAAA,QAAA;AAAA,MAAA;AAAA,MAEF,gBAAAG,EAACG,GAAA,EAAW;AAAA,MACZ,gBAAAH;AAAA,QAACC;AAAAA,QAAA;AAAA,UACA,UAAAT;AAAA,UACA,SAASA,IAAW,SAAYD;AAAA,UAE/B,UAAAW,EAAM,cAAcb,GAAW;AAAA,YAC/B,QAAQ;AAAA,YACR,OAAO;AAAA,YACP,OAAOK,KAAkBG;AAAA,YACzB,OAAO,EAAE,SAAS,QAAA;AAAA,UAAQ,CAC1B;AAAA,QAAA;AAAA,MAAA;AAAA,IACF,GACD;AAAA,EAEF;AACD;AAEAZ,EAAe,cAAc;"}

package/dist/esm/components/dual-icon-button/DualIconButton.styled.d.ts

@@ -1,7 +0,0 @@
-export declare const Container: import('styled-components').StyledComponent<"div", any, {
-    disabled?: boolean | undefined;
-}, never>;
-export declare const IconHalf: import('styled-components').StyledComponent<"button", any, {
-    disabled?: boolean | undefined;
-}, never>;
-export declare const Divider: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/esm/components/dual-icon-button/DualIconButton.styled.js

@@ -1,40 +0,0 @@
-import n from "styled-components";
-import { COLORS as i } from "../../constants/Theme.js";
-const t = n.div`
-	display: inline-flex;
-	align-items: center;
-	border-radius: 4px;
-	overflow: hidden;
-	background: ${(e) => e.disabled ? i.background.inactive : i.background.inverseLight};
-`, d = n.button`
-	all: unset;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 24px;
-	height: 24px;
-	padding: 4px;
-	box-sizing: border-box;
-	cursor: ${(e) => e.disabled ? "not-allowed" : "pointer"};
-	background: transparent;
-
-	${(e) => e.disabled ? "" : `
-		:hover {
-			background-color: ${i.background.inverse};
-		}
-		:active {
-			box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);
-		}
-	`}
-`, a = n.div`
-	width: 1px;
-	height: 12px;
-	background: rgba(255, 255, 255, 0.3);
-	flex-shrink: 0;
-`;
-export {
-  t as Container,
-  a as Divider,
-  d as IconHalf
-};
-//# sourceMappingURL=DualIconButton.styled.js.map

package/dist/esm/components/dual-icon-button/DualIconButton.styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DualIconButton.styled.js","sources":["../../../../src/components/dual-icon-button/DualIconButton.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div<{ disabled?: boolean }>`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tborder-radius: 4px;\n\toverflow: hidden;\n\tbackground: ${(props) =>\n\t\tprops.disabled\n\t\t\t? COLORS.background.inactive\n\t\t\t: COLORS.background.inverseLight};\n`;\n\nexport const IconHalf = styled.button<{ disabled?: boolean }>`\n\tall: unset;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tpadding: 4px;\n\tbox-sizing: border-box;\n\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\tbackground: transparent;\n\n\t${(props) =>\n\t\t!props.disabled\n\t\t\t? `\n\t\t:hover {\n\t\t\tbackground-color: ${COLORS.background.inverse};\n\t\t}\n\t\t:active {\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t}\n\t`\n\t\t\t: ''}\n`;\n\nexport const Divider = styled.div`\n\twidth: 1px;\n\theight: 12px;\n\tbackground: rgba(255, 255, 255, 0.3);\n\tflex-shrink: 0;\n`;\n"],"names":["Container","styled","props","COLORS","IconHalf","Divider"],"mappings":";;AAGO,MAAMA,IAAYC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKjB,CAACC,MACdA,EAAM,WACHC,EAAO,WAAW,WAClBA,EAAO,WAAW,YAAY;AAAA,GAGtBC,IAAWH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WASpB,CAACC,MAAWA,EAAM,WAAW,gBAAgB,SAAU;AAAA;AAAA;AAAA,GAG/D,CAACA,MACDA,EAAM,WASJ,KARA;AAAA;AAAA,uBAEkBC,EAAO,WAAW,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAMzC;AAAA,GAGME,IAAUJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/esm/components/dual-icon-button/index.d.ts

@@ -1,2 +0,0 @@
-export * from './DualIconButton';
-export type { DualIconButtonProps } from './model';

package/dist/esm/components/dual-icon-button/model.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-export interface DualIconButtonProps {
-    LeftIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    RightIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    onLeftClick?: React.MouseEventHandler<HTMLButtonElement>;
-    onRightClick?: React.MouseEventHandler<HTMLButtonElement>;
-    disabled?: boolean;
-    leftIconColor?: string;
-    rightIconColor?: string;
-    id?: string;
-    style?: React.CSSProperties;
-}