@streamoid/ui 0.6.0 → 0.6.1

package/dist/index.css

@@ -2304,198 +2304,6 @@
   background: var(--alias-fill-neutral-neutralhover, #242424);
 }
 
-/* src/SC-Plan card/ScPlanCard.module.css */
-.ScPlanCard_scPlanCard,
-.ScPlanCard_scPlanCard * {
-  box-sizing: border-box;
-}
-.ScPlanCard_scPlanCard {
-  background: var(--alias-surface-base, #101010);
-  border-radius: var(--radius-3xl, 1rem);
-  border-style: solid;
-  border-color: var(--alias-border-subtle, #242424);
-  border-width: 0.0625rem;
-  padding: var(--spacing-6xl, 1.5rem) var(--spacing-6xl, 1.5rem) var(--spacing-8xl, 2rem) var(--spacing-6xl, 1.5rem);
-  display: flex;
-  flex-direction: column;
-  gap: var(--spacing-6xl, 1.5rem);
-  align-items: flex-start;
-  justify-content: flex-start;
-  position: relative;
-  backdrop-filter: blur(0.25rem);
-}
-.ScPlanCard_planHeader {
-  display: flex;
-  flex-direction: row;
-  gap: var(--spacing-md, 0.5rem);
-  align-items: flex-start;
-  justify-content: flex-start;
-  align-self: stretch;
-  flex-shrink: 0;
-  position: relative;
-}
-.ScPlanCard_planInfo {
-  display: flex;
-  flex-direction: column;
-  gap: var(--spacing-none, 0rem);
-  align-items: center;
-  justify-content: center;
-  flex: 1;
-  position: relative;
-}
-.ScPlanCard_planName {
-  color: var(--alias-text-and-icons-primary, #f5f5f5);
-  text-align: left;
-  font-family: var( --lead-text-lead-text-md-bold-font-family, "Inter-Bold", sans-serif );
-  font-size: var(--lead-text-lead-text-md-bold-font-size, 1.5rem);
-  line-height: var(--lead-text-lead-text-md-bold-line-height, 2rem);
-  font-weight: var(--lead-text-lead-text-md-bold-font-weight, 700);
-  position: relative;
-  align-self: stretch;
-}
-.ScPlanCard_planPrice {
-  color: var(--alias-text-and-icons-secondary, #dadada);
-  text-align: left;
-  font-family: var( --lead-text-lead-text-sm-medium-font-family, "Inter-Medium", sans-serif );
-  font-size: var(--lead-text-lead-text-sm-medium-font-size, 1.25rem);
-  line-height: var(--lead-text-lead-text-sm-medium-line-height, 1.75rem);
-  font-weight: var(--lead-text-lead-text-sm-medium-font-weight, 500);
-  position: relative;
-  align-self: stretch;
-}
-.ScPlanCard_creditsWrapper {
-  position: relative;
-  align-self: stretch;
-  flex-shrink: 0;
-}
-.ScPlanCard_creditsContainer {
-  background: var(--alias-fill-neutral-neutralplus, #151515);
-  border-radius: var(--radius-3xl, 1rem);
-  padding: var(--spacing-3xl, 1rem);
-  display: flex;
-  flex-direction: row;
-  gap: 0.5rem;
-  align-items: center;
-  justify-content: center;
-  align-self: stretch;
-  flex-shrink: 0;
-  position: relative;
-  height: 4rem;
-}
-.ScPlanCard_creditsContainerPopular {
-  background: var(--alias-fill-neutral-neutralactive, #313131);
-  padding-left: var(--spacing-3xl, 1rem);
-  padding-right: var(--spacing-xl, 0.75rem);
-}
-.ScPlanCard_siconCreditsInstance {
-  flex-shrink: 0;
-  width: 1.5rem;
-  height: 1.5rem;
-  position: relative;
-  overflow: visible;
-}
-.ScPlanCard_creditsText {
-  color: var(--alias-text-and-icons-primary, #f5f5f5);
-  text-align: left;
-  font-family: var( --text-text-md-semibold-font-family, "Inter-SemiBold", sans-serif );
-  font-size: var(--text-text-md-semibold-font-size, 1rem);
-  line-height: var(--text-text-md-semibold-line-height, 1.5rem);
-  font-weight: var(--text-text-md-semibold-font-weight, 600);
-  position: relative;
-  flex: 1;
-}
-.ScPlanCard_increaseCreditsBtn {
-  background: var(--alias-fill-neutral-neutralselected, #242424);
-  border: none;
-  border-radius: var(--medium-5, 0.75rem);
-  padding: var(--spacing-xs, 0.25rem) var(--spacing-md, 0.5rem) var(--spacing-xs, 0.25rem) var(--spacing-lg, 0.625rem);
-  display: flex;
-  flex-direction: row;
-  gap: var(--spacing-xs, 0.25rem);
-  align-items: center;
-  justify-content: center;
-  height: 2rem;
-  flex-shrink: 0;
-  cursor: pointer;
-  color: var(--alias-text-and-icons-primary, #f5f5f5);
-}
-.ScPlanCard_increaseCreditsLabel {
-  font-family: var( --text-text-xs-regular-font-family, "Inter-Regular", sans-serif );
-  font-size: var(--text-text-xs-regular-font-size, 0.75rem);
-  line-height: var(--text-text-xs-regular-line-height, 1.125rem);
-  font-weight: var(--text-text-xs-regular-font-weight, 400);
-  white-space: nowrap;
-}
-.ScPlanCard_increaseCreditsArrow {
-  flex-shrink: 0;
-  width: 0.75rem;
-  height: 0.75rem;
-}
-.ScPlanCard_scButtonInstance {
-  align-self: stretch !important;
-  flex-shrink: 0 !important;
-}
-.ScPlanCard_scHDividerInstance {
-  align-self: stretch !important;
-  flex-shrink: 0 !important;
-  width: unset !important;
-}
-.ScPlanCard_featuresSection {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  align-items: flex-start;
-  justify-content: flex-start;
-  align-self: stretch;
-  flex-shrink: 0;
-  position: relative;
-}
-.ScPlanCard_sectionTitle {
-  color: var(--alias-text-and-icons-primary, #f5f5f5);
-  text-align: left;
-  font-family: var( --text-text-sm-semibold-font-family, "Inter-SemiBold", sans-serif );
-  font-size: var(--text-text-sm-semibold-font-size, 0.875rem);
-  line-height: var(--text-text-sm-semibold-line-height, 1.25rem);
-  font-weight: var(--text-text-sm-semibold-font-weight, 600);
-  position: relative;
-  align-self: stretch;
-}
-.ScPlanCard_featureRow {
-  display: flex;
-  flex-direction: row;
-  gap: var(--gp8, 0.5rem);
-  align-items: center;
-  align-self: stretch;
-  flex-shrink: 0;
-}
-.ScPlanCard_featureText {
-  color: var(--alias-text-and-icons-tertiary, #9e9e9e);
-  text-align: left;
-  font-family: var( --text-text-sm-regular-font-family, "Inter-Regular", sans-serif );
-  font-size: var(--text-text-sm-regular-font-size, 0.875rem);
-  line-height: var(--text-text-sm-regular-line-height, 1.25rem);
-  font-weight: var(--text-text-sm-regular-font-weight, 400);
-}
-.ScPlanCard_description {
-  color: var(--alias-text-and-icons-tertiary, #9e9e9e);
-  text-align: left;
-  font-family: var( --lead-text-lead-text-xs-regular-font-family, "Inter-Regular", sans-serif );
-  font-size: var(--lead-text-lead-text-xs-regular-font-size, 1.125rem);
-  line-height: var(--lead-text-lead-text-xs-regular-line-height, 1.625rem);
-  font-weight: var(--lead-text-lead-text-xs-regular-font-weight, 400);
-  position: relative;
-  align-self: stretch;
-}
-.ScPlanCard_scPlanCard.ScPlanCard_type-popular .ScPlanCard_planName {
-  color: var(--alias-text-and-icons-warningcont, #ffba3a);
-}
-.ScPlanCard_scPlanCard.ScPlanCard_type-custom {
-  background: var(--alias-surface-base, #101010);
-}
-.ScPlanCard_scPlanCard .ScPlanCard_scButtonInstanceDisabled {
-  opacity: 0.5;
-}
-
 /* src/SC-Plan details card/ScPlanDetailsCard.module.css */
 .ScPlanDetailsCard_scPlanDetailsCard,
 .ScPlanDetailsCard_scPlanDetailsCard * {
@@ -3508,6 +3316,7 @@
   height: 2.5rem;
   position: relative;
   cursor: pointer;
+  transition: background-color 120ms ease;
 }
 .ScSidebarMenu_scSidebarMenu > :first-child {
   width: 1.25rem;
@@ -3562,7 +3371,10 @@
   display: flex;
 }
 .ScSidebarMenu_scSidebarMenu.ScSidebarMenu_variant-collapsed {
+  width: 2.5rem;
+  height: 2.5rem;
   padding: var(--spacing-md, 0.5rem);
+  justify-content: center;
   align-self: unset;
 }
 
@@ -4011,7 +3823,7 @@
   box-sizing: border-box;
 }
 .ScSidebarSwitchMenu_scSidebarSwitchMenu {
-  border-radius: var(--radius-3xl, 1rem);
+  border-radius: 0;
   padding: var(--spacing-md, 0.5rem) var(--spacing-xl, 0.75rem) var(--spacing-md, 0.5rem) var(--spacing-xl, 0.75rem);
   display: flex;
   flex-direction: row;
@@ -4022,6 +3834,7 @@
   flex-shrink: 0;
   position: relative;
   cursor: pointer;
+  transition: background-color 120ms ease;
 }
 .ScSidebarSwitchMenu_iconWrapper {
   width: 1.25rem;
@@ -4104,6 +3917,7 @@
   justify-content: center;
   width: 2.5rem;
   height: 2.5rem;
+  border-radius: var(--radius-3xl, 1rem);
 }
 
 /* src/SC-SideBarLogoUnit/ScSideBarLogoUnit.module.css */

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-import React$1, { HTMLAttributes, ReactNode, CSSProperties } from 'react';
+import React$1, { CSSProperties, HTMLAttributes, ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 interface IScAccessProps {
@@ -10,6 +10,31 @@ interface IScAccessProps {
 }
 declare const ScAccess: ({ component, component2, component3, visibleSiconCatalogix, className, }: IScAccessProps) => JSX.Element;
 
+/** One switchable product, supplied by the host app (built from its service
+ *  catalog). The current app is expected to be excluded by the host. */
+interface ScAppSwitchItem {
+    key: string;
+    /** Product name — used to match the embedded wordmark (and as fallback text). */
+    name: string;
+    /** Tagline shown only for products without an embedded wordmark. */
+    description?: string;
+    onSelect: () => void;
+}
+interface IScAppSwitchPanelProps {
+    apps: ScAppSwitchItem[];
+    className?: string;
+    style?: CSSProperties;
+}
+/** One switch row: product wordmark (gray → brightens on hover) + a `>` chevron
+ *  that fades in on hover. Products without a wordmark fall back to name/desc. */
+declare const ScAppSwitchRow: ({ item }: {
+    item: ScAppSwitchItem;
+}) => JSX.Element;
+/** Shared product-switch list — the same across every Streamoid app. The host
+ *  passes its product list (current app excluded) and its own logo lives in the
+ *  surrounding sidebar; only this content is identical everywhere. */
+declare const ScAppSwitchPanel: ({ apps, className, style }: IScAppSwitchPanelProps) => JSX.Element;
+
 interface IScBadgesProps {
     text?: string;
     variant?: "default" | "success" | "warning" | "error" | "info";
@@ -185,20 +210,67 @@ interface PlanFeatureSection {
 }
 interface IScPlanCardProps {
     planName?: string;
+    /** Formatted price from the billing API, incl. currency symbol (e.g.
+     *  "$49.99", "₹49.99", "$0"). The leading symbol renders small, the amount
+     *  large, per the design. */
     price?: string;
+    /** Period suffix shown muted (default "/ month"). */
+    pricePeriod?: string;
+    /** Short one-line tagline under the price. */
+    tagline?: ReactNode;
+    /** Back-compat alias for `tagline`. */
+    description?: ReactNode;
+    /** Credits text, fed from the billing API (e.g. "1000 Credits"). */
     credits?: string;
     type?: "free" | "popular" | "custom";
-    features?: PlanFeatureSection[];
-    description?: ReactNode;
+    /** Label on the credit-tier pill (popular only). Default "Increase". */
+    increaseLabel?: string;
+    onIncreaseCredits?: () => void;
+    /** Dropdown panel rendered under the credits chip (popular only). */
+    creditsDropdown?: ReactNode;
     buttonText?: string;
     buttonState?: "default" | "disabled";
+    /** "primary" → red→orange gradient (Upgrade); "secondary" → white fill. */
     buttonVariant?: "primary" | "secondary" | "tertiary" | "outline" | "error";
     onUpgrade?: () => void;
-    onIncreaseCredits?: () => void;
-    creditsDropdown?: ReactNode;
+    /** @deprecated no longer rendered — features live in ScPlanComparison. */
+    features?: PlanFeatureSection[];
+    className?: string;
+    style?: CSSProperties;
+}
+declare const ScPlanCard: ({ planName, price, pricePeriod, tagline, description, credits, type, increaseLabel, onIncreaseCredits, creditsDropdown, buttonText, buttonState, buttonVariant, onUpgrade, className, style, }: IScPlanCardProps) => JSX.Element;
+
+interface PlanComparisonRow {
+    /** Left-column feature label (may be blank for sub-rows, per the design). */
+    label?: ReactNode;
+    /** One value per plan column, in column order (Free, Pro, Enterprise). */
+    values: ReactNode[];
+}
+interface PlanComparisonSection {
+    /** Full-width section header (e.g. "Artifax (Design & Insights)"). Omit for
+     *  un-grouped rows (e.g. the leading "Usage volume" row). */
+    header?: string;
+    rows: PlanComparisonRow[];
+}
+interface IScPlanComparisonProps {
+    /** Collapsible section title (e.g. "Compare Plans"). */
+    title?: string;
+    /** Top-left header cell label (e.g. "Compare plans"). */
+    firstColumnLabel?: string;
+    /** Plan column headers, e.g. ["Free", "Pro", "Enterprise"]. */
+    columns: string[];
+    /** Caption shown directly under the column header row. */
+    note?: ReactNode;
+    sections: PlanComparisonSection[];
+    /** Which value column gets the highlighted (Pro) styling. Default 1. */
+    highlightColumnIndex?: number;
+    defaultOpen?: boolean;
+    /** "table" = full grid (desktop); "tabbed" = tab switcher + 2 columns (mobile). */
+    layout?: "table" | "tabbed";
     className?: string;
+    style?: CSSProperties;
 }
-declare const ScPlanCard: ({ planName, price, credits, type, features, description, buttonText, buttonState, buttonVariant, onUpgrade, onIncreaseCredits, creditsDropdown, className, }: IScPlanCardProps) => JSX.Element;
+declare const ScPlanComparison: ({ title, firstColumnLabel, columns, note, sections, highlightColumnIndex, defaultOpen, layout, className, style, }: IScPlanComparisonProps) => JSX.Element;
 
 interface IScPlanDetailsCardProps extends React.HTMLAttributes<HTMLDivElement> {
     planName?: string;
@@ -320,6 +392,14 @@ interface StreamoidSidebarProps {
     preFooterContent?: ReactNode;
     bodyContent?: ReactNode;
     showBody?: boolean;
+    /** App‑switch panel (e.g. the list of other products). When `switchPanelOpen`
+     *  is true, the expanded logo and this panel render together inside one
+     *  bordered card and the rest of the sidebar dims behind a backdrop.
+     *  Expanded, non‑mobile layout only. */
+    switchPanel?: ReactNode;
+    switchPanelOpen?: boolean;
+    /** Called when the dimmed backdrop behind the open switch panel is clicked. */
+    onSwitchPanelClose?: () => void;
     isMobile?: boolean;
     className?: string;
     style?: CSSProperties;
@@ -328,7 +408,7 @@ interface StreamoidSidebarProps {
     /** Explicit state override per top item id — takes priority over activeItemId/highlightedItemIds for top items */
     topItemStates?: Record<string, "default" | "active" | "hover" | "default-highlight" | "default-active">;
 }
-declare function StreamoidSidebar({ expanded, onToggle, config, iconMap, activeItemId, highlightedItemIds, onItemSelect, moreIcon, onMoreClick, expandedLogo, collapsedLogo, profile, versionText, toggleIcon, toggleInProfile, hideFooter, preFooterContent, bodyContent, showBody, isMobile, className, style, topItems, topItemStates, }: StreamoidSidebarProps): react_jsx_runtime.JSX.Element;
+declare function StreamoidSidebar({ expanded, onToggle, config, iconMap, activeItemId, highlightedItemIds, onItemSelect, moreIcon, onMoreClick, expandedLogo, collapsedLogo, profile, versionText, toggleIcon, toggleInProfile, hideFooter, preFooterContent, bodyContent, showBody, switchPanel, switchPanelOpen, onSwitchPanelClose, isMobile, className, style, topItems, topItemStates, }: StreamoidSidebarProps): react_jsx_runtime.JSX.Element;
 
 interface ArtifaxMenuItem {
     id: string;
@@ -1183,4 +1263,4 @@ interface IScPlanDetailsCardMobileProps extends React.HTMLAttributes<HTMLDivElem
 }
 declare const ScPlanDetailsCardMobile: ({ planName, planCredits, planPrice, badgeText, badgeSubText, currentPlanLabel, upgradeButtonText, isLoading, onUpgrade, className, ...props }: IScPlanDetailsCardMobileProps) => JSX.Element;
 
-export { type ArtifaxMenuItem, type ArtifaxSection, type ArtifaxSidebarAssistantCta, type ArtifaxSidebarCreditWarning, type ArtifaxSidebarIconContext, type ArtifaxSidebarIconMap, type ArtifaxSidebarIconRenderer, type ArtifaxSidebarProfile, type CatalogixNavItem, type CatalogixSidebarCreditWarning, type CatalogixSidebarIconContext, type CatalogixSidebarIconMap, type CatalogixSidebarIconRenderer, type CatalogixSidebarProfile, type CatalogixSwitchApp, CreditWarningBanner, type CreditWarningBannerProps, type IInvoiceHistoryMobileProps, type IScAccessProps, type IScAppCardProps, type IScAppCardV3Props, type IScAppFieldProps, type IScAppListingCardProps, type IScArtifaxInviteProps, type IScArtifaxSidebarProps, type IScBadgesProps, type IScBillingHistoryHeaderProps, type IScBillingHistoryTableListProps, type IScBillingLogsTableHeaderProps, type IScBillingLogsTableListProps, type IScBriefCardProps, type IScButtonProps, type IScCalendarDateCompsProps, type IScCalendarProps, type IScCatalogixInviteProps, type IScCatalogixSidebarProps, type IScCheckFieldProps, type IScCheckboxProps, type IScCreditsUsageCardMobileProps, type IScCreditsUsageCardProps, type IScFieldButtonProps, type IScGoogleSignInProps, type IScGuideProps, type IScHDividerProps, type IScHeaderProps, type IScImageFieldProps, type IScIntialProfileCoverProps, type IScLogoUnitProps, type IScMenuOptionsProps, type IScMobileBottomActionProps, type IScMobileTopNavProps, type IScOnlyFieldProps, type IScOnlyIconProps, type IScPairtextProps, type IScPendingActionProps, type IScPhtogenixInviteProps, type IScPlanCardProps, type IScPlanDetailsCardMobileProps, type IScPlanDetailsCardProps, type IScPopUpMenuProps, type IScProfileImageUpdateProps, type IScProfileOptionsProps, type IScProfileProps, type IScProfileSettingsCompProps, type IScProfileV2MobileProps, type IScProgressBarProps, type IScQuickPromptProps, type IScRadioProps, type IScReferralCardMobileProps, type IScReferralTableHeaderProps, type IScReferralTableListProps, type IScRoleMobileProps, type IScRoleProps, type IScSettingsNavProps, type IScSettingsTabCompProps, type IScSideBarLogoUnitProps, type IScSidebarIconsProps, type IScSidebarMenuProps, type IScSidebarProfileProps, type IScSidebarProps, type IScSidebarSwitchMenuProps, type IScSliderProps, type IScStrLogoProps, type IScTabCompProps, type IScTabFieldProps, type IScTabSwitcherProps, type IScTableHeaderProps, type IScTableListMobileProps, type IScTableListProps, type IScTextFieldProps, type IScToggleSwitchProps, type IScVDividerProps, type IScVersionProps, type IScWorkspaceCardProps, type IScWorkspaceSettingsMobileProps, type IScWorkspaceSwitchMobileProps, type IScWorkspaceSwitchMobileV2Props, type IUsageHistoryMobileProps, InvoiceHistoryMobile, NscWorkspaceSwitch, type PlanFeatureSection, ProductCollapsedMark, ProductWordmark, ScAccess, ScAppCard, ScAppCardV3, ScAppField, ScAppListingCard, ScArtifaxInvite, ScArtifaxSidebar, ScBadges, ScBillingHistoryHeader, ScBillingHistoryTableList, ScBillingLogsTableHeader, ScBillingLogsTableList, ScBriefCard, ScButton, ScCalendar, ScCalendarDateComps, ScCatalogixInvite, ScCatalogixSidebar, ScCheckField, ScCheckbox, ScCreditsUsageCard, ScCreditsUsageCardMobile, ScDp, type ScDpProps, ScFieldButton, ScGoogleSignIn, ScGuide, ScHDivider, ScHeader, ScImageField, ScIntialProfileCover, ScLogoUnit, ScMenuOptions, ScMobileBottomAction, ScMobileTopNav, ScOnlyField, ScOnlyIcon, ScPairtext, ScPendingAction, ScPhtogenixInvite, ScPlanCard, ScPlanDetailsCard, ScPlanDetailsCardMobile, ScPopUpMenu, ScProfile, ScProfileImageUpdate, ScProfileOptions, ScProfileSettingsComp, ScProfileV2Mobile, ScProgressBar, ScQuickPrompt, ScRadio, ScReferralCardMobile, ScReferralTableHeader, ScReferralTableList, ScRole, ScRoleMobile, ScSettingsNav, ScSettingsTabComp, ScSideBarLogoUnit, ScSidebar, ScSidebarIcons, ScSidebarMenu, ScSidebarProfile, ScSidebarSwitchMenu, ScSlider, ScStrLogo, ScTabComp, ScTabField, ScTabSwitcher, ScTableHeader, ScTableList, ScTableListMobile, ScTextField, ScToggleSwitch, ScVDivider, ScVersion, ScWorkspaceCard, ScWorkspaceSettingsMobile, ScWorkspaceSwitchCard, type ScWorkspaceSwitchCardProps, ScWorkspaceSwitchMobile, ScWorkspaceSwitchMobileV2, type SidebarConfig, type SidebarIconContext, type SidebarIconMap, type SidebarIconRenderer, type SidebarMenuItemConfig, type SidebarProduct, type SidebarProfileConfig, type SidebarSectionConfig, StreamoidSidebar, type StreamoidSidebarProps, StreamoidWorkspaceSwitcher, type StreamoidWorkspaceSwitcherProps, UsageHistoryMobile, type WorkspaceSwitcherConfig, type WorkspaceSwitcherItem, hasCollapsedMark };
+export { type ArtifaxMenuItem, type ArtifaxSection, type ArtifaxSidebarAssistantCta, type ArtifaxSidebarCreditWarning, type ArtifaxSidebarIconContext, type ArtifaxSidebarIconMap, type ArtifaxSidebarIconRenderer, type ArtifaxSidebarProfile, type CatalogixNavItem, type CatalogixSidebarCreditWarning, type CatalogixSidebarIconContext, type CatalogixSidebarIconMap, type CatalogixSidebarIconRenderer, type CatalogixSidebarProfile, type CatalogixSwitchApp, CreditWarningBanner, type CreditWarningBannerProps, type IInvoiceHistoryMobileProps, type IScAccessProps, type IScAppCardProps, type IScAppCardV3Props, type IScAppFieldProps, type IScAppListingCardProps, type IScAppSwitchPanelProps, type IScArtifaxInviteProps, type IScArtifaxSidebarProps, type IScBadgesProps, type IScBillingHistoryHeaderProps, type IScBillingHistoryTableListProps, type IScBillingLogsTableHeaderProps, type IScBillingLogsTableListProps, type IScBriefCardProps, type IScButtonProps, type IScCalendarDateCompsProps, type IScCalendarProps, type IScCatalogixInviteProps, type IScCatalogixSidebarProps, type IScCheckFieldProps, type IScCheckboxProps, type IScCreditsUsageCardMobileProps, type IScCreditsUsageCardProps, type IScFieldButtonProps, type IScGoogleSignInProps, type IScGuideProps, type IScHDividerProps, type IScHeaderProps, type IScImageFieldProps, type IScIntialProfileCoverProps, type IScLogoUnitProps, type IScMenuOptionsProps, type IScMobileBottomActionProps, type IScMobileTopNavProps, type IScOnlyFieldProps, type IScOnlyIconProps, type IScPairtextProps, type IScPendingActionProps, type IScPhtogenixInviteProps, type IScPlanCardProps, type IScPlanComparisonProps, type IScPlanDetailsCardMobileProps, type IScPlanDetailsCardProps, type IScPopUpMenuProps, type IScProfileImageUpdateProps, type IScProfileOptionsProps, type IScProfileProps, type IScProfileSettingsCompProps, type IScProfileV2MobileProps, type IScProgressBarProps, type IScQuickPromptProps, type IScRadioProps, type IScReferralCardMobileProps, type IScReferralTableHeaderProps, type IScReferralTableListProps, type IScRoleMobileProps, type IScRoleProps, type IScSettingsNavProps, type IScSettingsTabCompProps, type IScSideBarLogoUnitProps, type IScSidebarIconsProps, type IScSidebarMenuProps, type IScSidebarProfileProps, type IScSidebarProps, type IScSidebarSwitchMenuProps, type IScSliderProps, type IScStrLogoProps, type IScTabCompProps, type IScTabFieldProps, type IScTabSwitcherProps, type IScTableHeaderProps, type IScTableListMobileProps, type IScTableListProps, type IScTextFieldProps, type IScToggleSwitchProps, type IScVDividerProps, type IScVersionProps, type IScWorkspaceCardProps, type IScWorkspaceSettingsMobileProps, type IScWorkspaceSwitchMobileProps, type IScWorkspaceSwitchMobileV2Props, type IUsageHistoryMobileProps, InvoiceHistoryMobile, NscWorkspaceSwitch, type PlanComparisonRow, type PlanComparisonSection, type PlanFeatureSection, ProductCollapsedMark, ProductWordmark, ScAccess, ScAppCard, ScAppCardV3, ScAppField, ScAppListingCard, type ScAppSwitchItem, ScAppSwitchPanel, ScAppSwitchRow, ScArtifaxInvite, ScArtifaxSidebar, ScBadges, ScBillingHistoryHeader, ScBillingHistoryTableList, ScBillingLogsTableHeader, ScBillingLogsTableList, ScBriefCard, ScButton, ScCalendar, ScCalendarDateComps, ScCatalogixInvite, ScCatalogixSidebar, ScCheckField, ScCheckbox, ScCreditsUsageCard, ScCreditsUsageCardMobile, ScDp, type ScDpProps, ScFieldButton, ScGoogleSignIn, ScGuide, ScHDivider, ScHeader, ScImageField, ScIntialProfileCover, ScLogoUnit, ScMenuOptions, ScMobileBottomAction, ScMobileTopNav, ScOnlyField, ScOnlyIcon, ScPairtext, ScPendingAction, ScPhtogenixInvite, ScPlanCard, ScPlanComparison, ScPlanDetailsCard, ScPlanDetailsCardMobile, ScPopUpMenu, ScProfile, ScProfileImageUpdate, ScProfileOptions, ScProfileSettingsComp, ScProfileV2Mobile, ScProgressBar, ScQuickPrompt, ScRadio, ScReferralCardMobile, ScReferralTableHeader, ScReferralTableList, ScRole, ScRoleMobile, ScSettingsNav, ScSettingsTabComp, ScSideBarLogoUnit, ScSidebar, ScSidebarIcons, ScSidebarMenu, ScSidebarProfile, ScSidebarSwitchMenu, ScSlider, ScStrLogo, ScTabComp, ScTabField, ScTabSwitcher, ScTableHeader, ScTableList, ScTableListMobile, ScTextField, ScToggleSwitch, ScVDivider, ScVersion, ScWorkspaceCard, ScWorkspaceSettingsMobile, ScWorkspaceSwitchCard, type ScWorkspaceSwitchCardProps, ScWorkspaceSwitchMobile, ScWorkspaceSwitchMobileV2, type SidebarConfig, type SidebarIconContext, type SidebarIconMap, type SidebarIconRenderer, type SidebarMenuItemConfig, type SidebarProduct, type SidebarProfileConfig, type SidebarSectionConfig, StreamoidSidebar, type StreamoidSidebarProps, StreamoidWorkspaceSwitcher, type StreamoidWorkspaceSwitcherProps, UsageHistoryMobile, type WorkspaceSwitcherConfig, type WorkspaceSwitcherItem, hasCollapsedMark };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import React$1, { HTMLAttributes, ReactNode, CSSProperties } from 'react';
+import React$1, { CSSProperties, HTMLAttributes, ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 interface IScAccessProps {
@@ -10,6 +10,31 @@ interface IScAccessProps {
 }
 declare const ScAccess: ({ component, component2, component3, visibleSiconCatalogix, className, }: IScAccessProps) => JSX.Element;
 
+/** One switchable product, supplied by the host app (built from its service
+ *  catalog). The current app is expected to be excluded by the host. */
+interface ScAppSwitchItem {
+    key: string;
+    /** Product name — used to match the embedded wordmark (and as fallback text). */
+    name: string;
+    /** Tagline shown only for products without an embedded wordmark. */
+    description?: string;
+    onSelect: () => void;
+}
+interface IScAppSwitchPanelProps {
+    apps: ScAppSwitchItem[];
+    className?: string;
+    style?: CSSProperties;
+}
+/** One switch row: product wordmark (gray → brightens on hover) + a `>` chevron
+ *  that fades in on hover. Products without a wordmark fall back to name/desc. */
+declare const ScAppSwitchRow: ({ item }: {
+    item: ScAppSwitchItem;
+}) => JSX.Element;
+/** Shared product-switch list — the same across every Streamoid app. The host
+ *  passes its product list (current app excluded) and its own logo lives in the
+ *  surrounding sidebar; only this content is identical everywhere. */
+declare const ScAppSwitchPanel: ({ apps, className, style }: IScAppSwitchPanelProps) => JSX.Element;
+
 interface IScBadgesProps {
     text?: string;
     variant?: "default" | "success" | "warning" | "error" | "info";
@@ -185,20 +210,67 @@ interface PlanFeatureSection {
 }
 interface IScPlanCardProps {
     planName?: string;
+    /** Formatted price from the billing API, incl. currency symbol (e.g.
+     *  "$49.99", "₹49.99", "$0"). The leading symbol renders small, the amount
+     *  large, per the design. */
     price?: string;
+    /** Period suffix shown muted (default "/ month"). */
+    pricePeriod?: string;
+    /** Short one-line tagline under the price. */
+    tagline?: ReactNode;
+    /** Back-compat alias for `tagline`. */
+    description?: ReactNode;
+    /** Credits text, fed from the billing API (e.g. "1000 Credits"). */
     credits?: string;
     type?: "free" | "popular" | "custom";
-    features?: PlanFeatureSection[];
-    description?: ReactNode;
+    /** Label on the credit-tier pill (popular only). Default "Increase". */
+    increaseLabel?: string;
+    onIncreaseCredits?: () => void;
+    /** Dropdown panel rendered under the credits chip (popular only). */
+    creditsDropdown?: ReactNode;
     buttonText?: string;
     buttonState?: "default" | "disabled";
+    /** "primary" → red→orange gradient (Upgrade); "secondary" → white fill. */
     buttonVariant?: "primary" | "secondary" | "tertiary" | "outline" | "error";
     onUpgrade?: () => void;
-    onIncreaseCredits?: () => void;
-    creditsDropdown?: ReactNode;
+    /** @deprecated no longer rendered — features live in ScPlanComparison. */
+    features?: PlanFeatureSection[];
+    className?: string;
+    style?: CSSProperties;
+}
+declare const ScPlanCard: ({ planName, price, pricePeriod, tagline, description, credits, type, increaseLabel, onIncreaseCredits, creditsDropdown, buttonText, buttonState, buttonVariant, onUpgrade, className, style, }: IScPlanCardProps) => JSX.Element;
+
+interface PlanComparisonRow {
+    /** Left-column feature label (may be blank for sub-rows, per the design). */
+    label?: ReactNode;
+    /** One value per plan column, in column order (Free, Pro, Enterprise). */
+    values: ReactNode[];
+}
+interface PlanComparisonSection {
+    /** Full-width section header (e.g. "Artifax (Design & Insights)"). Omit for
+     *  un-grouped rows (e.g. the leading "Usage volume" row). */
+    header?: string;
+    rows: PlanComparisonRow[];
+}
+interface IScPlanComparisonProps {
+    /** Collapsible section title (e.g. "Compare Plans"). */
+    title?: string;
+    /** Top-left header cell label (e.g. "Compare plans"). */
+    firstColumnLabel?: string;
+    /** Plan column headers, e.g. ["Free", "Pro", "Enterprise"]. */
+    columns: string[];
+    /** Caption shown directly under the column header row. */
+    note?: ReactNode;
+    sections: PlanComparisonSection[];
+    /** Which value column gets the highlighted (Pro) styling. Default 1. */
+    highlightColumnIndex?: number;
+    defaultOpen?: boolean;
+    /** "table" = full grid (desktop); "tabbed" = tab switcher + 2 columns (mobile). */
+    layout?: "table" | "tabbed";
     className?: string;
+    style?: CSSProperties;
 }
-declare const ScPlanCard: ({ planName, price, credits, type, features, description, buttonText, buttonState, buttonVariant, onUpgrade, onIncreaseCredits, creditsDropdown, className, }: IScPlanCardProps) => JSX.Element;
+declare const ScPlanComparison: ({ title, firstColumnLabel, columns, note, sections, highlightColumnIndex, defaultOpen, layout, className, style, }: IScPlanComparisonProps) => JSX.Element;
 
 interface IScPlanDetailsCardProps extends React.HTMLAttributes<HTMLDivElement> {
     planName?: string;
@@ -320,6 +392,14 @@ interface StreamoidSidebarProps {
     preFooterContent?: ReactNode;
     bodyContent?: ReactNode;
     showBody?: boolean;
+    /** App‑switch panel (e.g. the list of other products). When `switchPanelOpen`
+     *  is true, the expanded logo and this panel render together inside one
+     *  bordered card and the rest of the sidebar dims behind a backdrop.
+     *  Expanded, non‑mobile layout only. */
+    switchPanel?: ReactNode;
+    switchPanelOpen?: boolean;
+    /** Called when the dimmed backdrop behind the open switch panel is clicked. */
+    onSwitchPanelClose?: () => void;
     isMobile?: boolean;
     className?: string;
     style?: CSSProperties;
@@ -328,7 +408,7 @@ interface StreamoidSidebarProps {
     /** Explicit state override per top item id — takes priority over activeItemId/highlightedItemIds for top items */
     topItemStates?: Record<string, "default" | "active" | "hover" | "default-highlight" | "default-active">;
 }
-declare function StreamoidSidebar({ expanded, onToggle, config, iconMap, activeItemId, highlightedItemIds, onItemSelect, moreIcon, onMoreClick, expandedLogo, collapsedLogo, profile, versionText, toggleIcon, toggleInProfile, hideFooter, preFooterContent, bodyContent, showBody, isMobile, className, style, topItems, topItemStates, }: StreamoidSidebarProps): react_jsx_runtime.JSX.Element;
+declare function StreamoidSidebar({ expanded, onToggle, config, iconMap, activeItemId, highlightedItemIds, onItemSelect, moreIcon, onMoreClick, expandedLogo, collapsedLogo, profile, versionText, toggleIcon, toggleInProfile, hideFooter, preFooterContent, bodyContent, showBody, switchPanel, switchPanelOpen, onSwitchPanelClose, isMobile, className, style, topItems, topItemStates, }: StreamoidSidebarProps): react_jsx_runtime.JSX.Element;
 
 interface ArtifaxMenuItem {
     id: string;
@@ -1183,4 +1263,4 @@ interface IScPlanDetailsCardMobileProps extends React.HTMLAttributes<HTMLDivElem
 }
 declare const ScPlanDetailsCardMobile: ({ planName, planCredits, planPrice, badgeText, badgeSubText, currentPlanLabel, upgradeButtonText, isLoading, onUpgrade, className, ...props }: IScPlanDetailsCardMobileProps) => JSX.Element;
 
-export { type ArtifaxMenuItem, type ArtifaxSection, type ArtifaxSidebarAssistantCta, type ArtifaxSidebarCreditWarning, type ArtifaxSidebarIconContext, type ArtifaxSidebarIconMap, type ArtifaxSidebarIconRenderer, type ArtifaxSidebarProfile, type CatalogixNavItem, type CatalogixSidebarCreditWarning, type CatalogixSidebarIconContext, type CatalogixSidebarIconMap, type CatalogixSidebarIconRenderer, type CatalogixSidebarProfile, type CatalogixSwitchApp, CreditWarningBanner, type CreditWarningBannerProps, type IInvoiceHistoryMobileProps, type IScAccessProps, type IScAppCardProps, type IScAppCardV3Props, type IScAppFieldProps, type IScAppListingCardProps, type IScArtifaxInviteProps, type IScArtifaxSidebarProps, type IScBadgesProps, type IScBillingHistoryHeaderProps, type IScBillingHistoryTableListProps, type IScBillingLogsTableHeaderProps, type IScBillingLogsTableListProps, type IScBriefCardProps, type IScButtonProps, type IScCalendarDateCompsProps, type IScCalendarProps, type IScCatalogixInviteProps, type IScCatalogixSidebarProps, type IScCheckFieldProps, type IScCheckboxProps, type IScCreditsUsageCardMobileProps, type IScCreditsUsageCardProps, type IScFieldButtonProps, type IScGoogleSignInProps, type IScGuideProps, type IScHDividerProps, type IScHeaderProps, type IScImageFieldProps, type IScIntialProfileCoverProps, type IScLogoUnitProps, type IScMenuOptionsProps, type IScMobileBottomActionProps, type IScMobileTopNavProps, type IScOnlyFieldProps, type IScOnlyIconProps, type IScPairtextProps, type IScPendingActionProps, type IScPhtogenixInviteProps, type IScPlanCardProps, type IScPlanDetailsCardMobileProps, type IScPlanDetailsCardProps, type IScPopUpMenuProps, type IScProfileImageUpdateProps, type IScProfileOptionsProps, type IScProfileProps, type IScProfileSettingsCompProps, type IScProfileV2MobileProps, type IScProgressBarProps, type IScQuickPromptProps, type IScRadioProps, type IScReferralCardMobileProps, type IScReferralTableHeaderProps, type IScReferralTableListProps, type IScRoleMobileProps, type IScRoleProps, type IScSettingsNavProps, type IScSettingsTabCompProps, type IScSideBarLogoUnitProps, type IScSidebarIconsProps, type IScSidebarMenuProps, type IScSidebarProfileProps, type IScSidebarProps, type IScSidebarSwitchMenuProps, type IScSliderProps, type IScStrLogoProps, type IScTabCompProps, type IScTabFieldProps, type IScTabSwitcherProps, type IScTableHeaderProps, type IScTableListMobileProps, type IScTableListProps, type IScTextFieldProps, type IScToggleSwitchProps, type IScVDividerProps, type IScVersionProps, type IScWorkspaceCardProps, type IScWorkspaceSettingsMobileProps, type IScWorkspaceSwitchMobileProps, type IScWorkspaceSwitchMobileV2Props, type IUsageHistoryMobileProps, InvoiceHistoryMobile, NscWorkspaceSwitch, type PlanFeatureSection, ProductCollapsedMark, ProductWordmark, ScAccess, ScAppCard, ScAppCardV3, ScAppField, ScAppListingCard, ScArtifaxInvite, ScArtifaxSidebar, ScBadges, ScBillingHistoryHeader, ScBillingHistoryTableList, ScBillingLogsTableHeader, ScBillingLogsTableList, ScBriefCard, ScButton, ScCalendar, ScCalendarDateComps, ScCatalogixInvite, ScCatalogixSidebar, ScCheckField, ScCheckbox, ScCreditsUsageCard, ScCreditsUsageCardMobile, ScDp, type ScDpProps, ScFieldButton, ScGoogleSignIn, ScGuide, ScHDivider, ScHeader, ScImageField, ScIntialProfileCover, ScLogoUnit, ScMenuOptions, ScMobileBottomAction, ScMobileTopNav, ScOnlyField, ScOnlyIcon, ScPairtext, ScPendingAction, ScPhtogenixInvite, ScPlanCard, ScPlanDetailsCard, ScPlanDetailsCardMobile, ScPopUpMenu, ScProfile, ScProfileImageUpdate, ScProfileOptions, ScProfileSettingsComp, ScProfileV2Mobile, ScProgressBar, ScQuickPrompt, ScRadio, ScReferralCardMobile, ScReferralTableHeader, ScReferralTableList, ScRole, ScRoleMobile, ScSettingsNav, ScSettingsTabComp, ScSideBarLogoUnit, ScSidebar, ScSidebarIcons, ScSidebarMenu, ScSidebarProfile, ScSidebarSwitchMenu, ScSlider, ScStrLogo, ScTabComp, ScTabField, ScTabSwitcher, ScTableHeader, ScTableList, ScTableListMobile, ScTextField, ScToggleSwitch, ScVDivider, ScVersion, ScWorkspaceCard, ScWorkspaceSettingsMobile, ScWorkspaceSwitchCard, type ScWorkspaceSwitchCardProps, ScWorkspaceSwitchMobile, ScWorkspaceSwitchMobileV2, type SidebarConfig, type SidebarIconContext, type SidebarIconMap, type SidebarIconRenderer, type SidebarMenuItemConfig, type SidebarProduct, type SidebarProfileConfig, type SidebarSectionConfig, StreamoidSidebar, type StreamoidSidebarProps, StreamoidWorkspaceSwitcher, type StreamoidWorkspaceSwitcherProps, UsageHistoryMobile, type WorkspaceSwitcherConfig, type WorkspaceSwitcherItem, hasCollapsedMark };
+export { type ArtifaxMenuItem, type ArtifaxSection, type ArtifaxSidebarAssistantCta, type ArtifaxSidebarCreditWarning, type ArtifaxSidebarIconContext, type ArtifaxSidebarIconMap, type ArtifaxSidebarIconRenderer, type ArtifaxSidebarProfile, type CatalogixNavItem, type CatalogixSidebarCreditWarning, type CatalogixSidebarIconContext, type CatalogixSidebarIconMap, type CatalogixSidebarIconRenderer, type CatalogixSidebarProfile, type CatalogixSwitchApp, CreditWarningBanner, type CreditWarningBannerProps, type IInvoiceHistoryMobileProps, type IScAccessProps, type IScAppCardProps, type IScAppCardV3Props, type IScAppFieldProps, type IScAppListingCardProps, type IScAppSwitchPanelProps, type IScArtifaxInviteProps, type IScArtifaxSidebarProps, type IScBadgesProps, type IScBillingHistoryHeaderProps, type IScBillingHistoryTableListProps, type IScBillingLogsTableHeaderProps, type IScBillingLogsTableListProps, type IScBriefCardProps, type IScButtonProps, type IScCalendarDateCompsProps, type IScCalendarProps, type IScCatalogixInviteProps, type IScCatalogixSidebarProps, type IScCheckFieldProps, type IScCheckboxProps, type IScCreditsUsageCardMobileProps, type IScCreditsUsageCardProps, type IScFieldButtonProps, type IScGoogleSignInProps, type IScGuideProps, type IScHDividerProps, type IScHeaderProps, type IScImageFieldProps, type IScIntialProfileCoverProps, type IScLogoUnitProps, type IScMenuOptionsProps, type IScMobileBottomActionProps, type IScMobileTopNavProps, type IScOnlyFieldProps, type IScOnlyIconProps, type IScPairtextProps, type IScPendingActionProps, type IScPhtogenixInviteProps, type IScPlanCardProps, type IScPlanComparisonProps, type IScPlanDetailsCardMobileProps, type IScPlanDetailsCardProps, type IScPopUpMenuProps, type IScProfileImageUpdateProps, type IScProfileOptionsProps, type IScProfileProps, type IScProfileSettingsCompProps, type IScProfileV2MobileProps, type IScProgressBarProps, type IScQuickPromptProps, type IScRadioProps, type IScReferralCardMobileProps, type IScReferralTableHeaderProps, type IScReferralTableListProps, type IScRoleMobileProps, type IScRoleProps, type IScSettingsNavProps, type IScSettingsTabCompProps, type IScSideBarLogoUnitProps, type IScSidebarIconsProps, type IScSidebarMenuProps, type IScSidebarProfileProps, type IScSidebarProps, type IScSidebarSwitchMenuProps, type IScSliderProps, type IScStrLogoProps, type IScTabCompProps, type IScTabFieldProps, type IScTabSwitcherProps, type IScTableHeaderProps, type IScTableListMobileProps, type IScTableListProps, type IScTextFieldProps, type IScToggleSwitchProps, type IScVDividerProps, type IScVersionProps, type IScWorkspaceCardProps, type IScWorkspaceSettingsMobileProps, type IScWorkspaceSwitchMobileProps, type IScWorkspaceSwitchMobileV2Props, type IUsageHistoryMobileProps, InvoiceHistoryMobile, NscWorkspaceSwitch, type PlanComparisonRow, type PlanComparisonSection, type PlanFeatureSection, ProductCollapsedMark, ProductWordmark, ScAccess, ScAppCard, ScAppCardV3, ScAppField, ScAppListingCard, type ScAppSwitchItem, ScAppSwitchPanel, ScAppSwitchRow, ScArtifaxInvite, ScArtifaxSidebar, ScBadges, ScBillingHistoryHeader, ScBillingHistoryTableList, ScBillingLogsTableHeader, ScBillingLogsTableList, ScBriefCard, ScButton, ScCalendar, ScCalendarDateComps, ScCatalogixInvite, ScCatalogixSidebar, ScCheckField, ScCheckbox, ScCreditsUsageCard, ScCreditsUsageCardMobile, ScDp, type ScDpProps, ScFieldButton, ScGoogleSignIn, ScGuide, ScHDivider, ScHeader, ScImageField, ScIntialProfileCover, ScLogoUnit, ScMenuOptions, ScMobileBottomAction, ScMobileTopNav, ScOnlyField, ScOnlyIcon, ScPairtext, ScPendingAction, ScPhtogenixInvite, ScPlanCard, ScPlanComparison, ScPlanDetailsCard, ScPlanDetailsCardMobile, ScPopUpMenu, ScProfile, ScProfileImageUpdate, ScProfileOptions, ScProfileSettingsComp, ScProfileV2Mobile, ScProgressBar, ScQuickPrompt, ScRadio, ScReferralCardMobile, ScReferralTableHeader, ScReferralTableList, ScRole, ScRoleMobile, ScSettingsNav, ScSettingsTabComp, ScSideBarLogoUnit, ScSidebar, ScSidebarIcons, ScSidebarMenu, ScSidebarProfile, ScSidebarSwitchMenu, ScSlider, ScStrLogo, ScTabComp, ScTabField, ScTabSwitcher, ScTableHeader, ScTableList, ScTableListMobile, ScTextField, ScToggleSwitch, ScVDivider, ScVersion, ScWorkspaceCard, ScWorkspaceSettingsMobile, ScWorkspaceSwitchCard, type ScWorkspaceSwitchCardProps, ScWorkspaceSwitchMobile, ScWorkspaceSwitchMobileV2, type SidebarConfig, type SidebarIconContext, type SidebarIconMap, type SidebarIconRenderer, type SidebarMenuItemConfig, type SidebarProduct, type SidebarProfileConfig, type SidebarSectionConfig, StreamoidSidebar, type StreamoidSidebarProps, StreamoidWorkspaceSwitcher, type StreamoidWorkspaceSwitcherProps, UsageHistoryMobile, type WorkspaceSwitcherConfig, type WorkspaceSwitcherItem, hasCollapsedMark };