@streamoid/ui 0.4.4 → 0.4.6

package/dist/index.css

@@ -1381,30 +1381,30 @@
     --x-0: 72%;
     --s-start-0: 8%;
     --s-end-0: 32%;
-    --c-0: #1030ff;
+    --c-0: #D91536;
     --y-0: 90%;
     --x-1: 33%;
     --s-start-1: 8.392%;
     --s-end-1: 22.109%;
-    --c-1: #21bdff;
+    --c-1: #FFA585;
     --y-1: -7%;
     --s-start-2: 8%;
     --s-end-2: 34%;
     --x-2: 93%;
-    --c-2: #1030ff;
+    --c-2: #D91536;
     --y-2: 63%;
     --s-start-3: 8%;
     --s-end-3: 64%;
     --x-3: 7%;
-    --c-3: #21bdff;
+    --c-3: #FFA585;
     --y-3: -20%;
-    --c-4: #21bdff;
+    --c-4: #FFA585;
     --s-start-4: 8.392%;
     --s-end-4: 22.109%;
     --x-4: 33%;
     --y-4: -7%;
     --y-5: -7%;
-    --c-5: #21bdff;
+    --c-5: #FFA585;
     --s-start-5: 8.392%;
     --s-end-5: 22.109%;
     --x-5: 33%;
@@ -1413,30 +1413,30 @@
     --x-0: 8%;
     --s-start-0: 12%;
     --s-end-0: 121%;
-    --c-0: #1030ff;
+    --c-0: #D91536;
     --y-0: 59%;
     --x-1: 42%;
     --s-start-1: 8.392%;
     --s-end-1: 41.694%;
-    --c-1: #21bdff;
+    --c-1: #FFA585;
     --y-1: 10%;
     --s-start-2: 12%;
     --s-end-2: 86%;
     --x-2: 2%;
-    --c-2: #1030ff;
+    --c-2: #D91536;
     --y-2: 59%;
     --s-start-3: 8%;
     --s-end-3: 54%;
     --x-3: 55%;
-    --c-3: #21bdff;
+    --c-3: #FFA585;
     --y-3: 10%;
-    --c-4: #21bdff;
+    --c-4: #FFA585;
     --s-start-4: 8.392%;
     --s-end-4: 41.694%;
     --x-4: 42%;
     --y-4: 10%;
     --y-5: 10%;
-    --c-5: #21bdff;
+    --c-5: #FFA585;
     --s-start-5: 8.392%;
     --s-end-5: 41.694%;
     --x-5: 42%;
@@ -1445,30 +1445,30 @@
     --x-0: 40%;
     --s-start-0: 10%;
     --s-end-0: 80%;
-    --c-0: #1030ff;
+    --c-0: #D91536;
     --y-0: 75%;
     --x-1: 76%;
     --s-start-1: 8.392%;
     --s-end-1: 59.322%;
-    --c-1: #21bdff;
+    --c-1: #FFA585;
     --y-1: -3%;
     --s-start-2: 12%;
     --s-end-2: 86%;
     --x-2: 2%;
-    --c-2: #1030ff;
+    --c-2: #D91536;
     --y-2: 59%;
     --s-start-3: 8%;
     --s-end-3: 92%;
     --x-3: 76%;
-    --c-3: #21bdff;
+    --c-3: #FFA585;
     --y-3: -3%;
-    --c-4: #21bdff;
+    --c-4: #FFA585;
     --s-start-4: 8.392%;
     --s-end-4: 59.322%;
     --x-4: 76%;
     --y-4: -3%;
     --y-5: -3%;
-    --c-5: #21bdff;
+    --c-5: #FFA585;
     --s-start-5: 8.392%;
     --s-end-5: 59.322%;
     --x-5: 76%;
@@ -1477,30 +1477,30 @@
     --x-0: 55%;
     --s-start-0: 9%;
     --s-end-0: 55%;
-    --c-0: #1030ff;
+    --c-0: #D91536;
     --y-0: 82%;
     --x-1: 76%;
     --s-start-1: 8.392%;
     --s-end-1: 59.322%;
-    --c-1: #21bdff;
+    --c-1: #FFA585;
     --y-1: -3%;
     --s-start-2: 10%;
     --s-end-2: 60%;
     --x-2: 48%;
-    --c-2: #1030ff;
+    --c-2: #D91536;
     --y-2: 61%;
     --s-start-3: 8%;
     --s-end-3: 78%;
     --x-3: 40%;
-    --c-3: #21bdff;
+    --c-3: #FFA585;
     --y-3: -10%;
-    --c-4: #21bdff;
+    --c-4: #FFA585;
     --s-start-4: 8.392%;
     --s-end-4: 40%;
     --x-4: 55%;
     --y-4: -5%;
     --y-5: -5%;
-    --c-5: #21bdff;
+    --c-5: #FFA585;
     --s-start-5: 8.392%;
     --s-end-5: 40%;
     --x-5: 55%;
@@ -1509,36 +1509,36 @@
 .ScButton_scButton.ScButton_state-default.ScButton_variant-primary.ScButton_type-primary,
 .ScButton_scButton.ScButton_state-disabled.ScButton_variant-primary.ScButton_type-primary {
   --x-0: 72%;
-  --c-0: #1030ff;
+  --c-0: #D91536;
   --y-0: 90%;
   --s-start-0: 8%;
   --s-end-0: 32%;
   --x-1: 33%;
-  --c-1: #21bdff;
+  --c-1: #FFA585;
   --y-1: -7%;
   --s-start-1: 8.392%;
   --s-end-1: 22.109%;
   --x-2: 93%;
-  --c-2: #1030ff;
+  --c-2: #D91536;
   --y-2: 63%;
   --s-start-2: 8%;
   --s-end-2: 34%;
   --x-3: 7%;
-  --c-3: #21bdff;
+  --c-3: #FFA585;
   --y-3: -20%;
   --s-start-3: 8%;
   --s-end-3: 64%;
-  --c-4: #21bdff;
+  --c-4: #FFA585;
   --x-4: 33%;
   --y-4: -7%;
   --s-start-4: 8.392%;
   --s-end-4: 22.109%;
-  --c-5: #21bdff;
+  --c-5: #FFA585;
   --x-5: 33%;
   --y-5: -7%;
   --s-start-5: 8.392%;
   --s-end-5: 22.109%;
-  background-color: #1661FF;
+  background-color: #E33A38;
   background-image:
     radial-gradient(
       circle at var(--x-0) var(--y-0),
@@ -4069,51 +4069,46 @@
 .ScSideBarLogoUnit_row {
   display: flex;
   align-items: center;
-  width: 100%;
-}
-.ScSideBarLogoUnit_chip {
-  flex: 1 0 0;
-  display: flex;
-  align-items: center;
-  min-width: 0;
-  background-color: var(--alias-surface-canvas, #0b0b0b);
-  border-radius: var(--radius-xl, 0.75rem);
+  justify-content: space-between;
+  height: 4rem;
   padding: var(--spacing-3xl, 1rem) var(--spacing-xl, 0.75rem) var(--spacing-3xl, 1rem) var(--spacing-3xl, 1rem);
-  margin-right: -0.875rem;
+  border-radius: var(--radius-xl, 0.75rem);
+  width: 100%;
+  background: transparent;
   border: none;
   cursor: pointer;
   text-align: left;
   font: inherit;
   color: inherit;
+  transition: background-color 120ms ease-out;
 }
-.ScSideBarLogoUnit_chip:disabled,
-.ScSideBarLogoUnit_chip.ScSideBarLogoUnit_nonInteractive {
+.ScSideBarLogoUnit_row:disabled,
+.ScSideBarLogoUnit_row.ScSideBarLogoUnit_nonInteractive {
   cursor: default;
 }
-.ScSideBarLogoUnit_chip > * {
+.ScSideBarLogoUnit_row:hover,
+.ScSideBarLogoUnit_row.ScSideBarLogoUnit_forceHover {
+  background-color: var(--alias-surface-subtle, #1a1a1a);
+}
+.ScSideBarLogoUnit_wordmarkSlot {
   display: inline-flex;
   align-items: center;
-  flex-shrink: 0;
   height: 2rem;
+  flex-shrink: 0;
 }
 .ScSideBarLogoUnit_switch {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  background-color: var(--alias-fill-neutral-neutral, #1a1a1a);
-  border-radius: var(--radius-md, 0.5rem);
   padding: var(--spacing-sm, 0.375rem);
-  border: none;
-  cursor: pointer;
+  border-radius: var(--radius-md, 0.5rem);
   flex-shrink: 0;
-  position: relative;
-}
-.ScSideBarLogoUnit_switch:hover {
-  background-color: var(--alias-fill-neutral-neutraltohover, #1f1f1f);
+  background-color: var(--alias-fill-neutral-neutral, #1a1a1a);
+  transition: background-color 120ms ease-out;
 }
-.ScSideBarLogoUnit_switch:disabled {
-  cursor: default;
-  opacity: 0.5;
+.ScSideBarLogoUnit_row:hover .ScSideBarLogoUnit_switch,
+.ScSideBarLogoUnit_row.ScSideBarLogoUnit_forceHover .ScSideBarLogoUnit_switch {
+  background-color: var(--alias-fill-neutral-neutralplus, #151515);
 }
 .ScSideBarLogoUnit_switchIcon {
   display: inline-flex;

package/dist/index.d.mts

@@ -390,6 +390,9 @@ interface IScGuideProps {
     skipLabel?: ReactNode;
     /** Label for the right-hand primary action. Defaults to "Next". */
     nextLabel?: ReactNode;
+    /** Icon rendered after the Next label. Defaults to a right-chevron.
+     *  Use for terminal steps where the action is "Done" + checkmark, etc. */
+    nextIcon?: ReactNode;
     /** Click handler for the Skip action. */
     onSkip?: () => void;
     /** Click handler for the Next action. */
@@ -403,31 +406,39 @@ interface IScGuideProps {
     className?: string;
     style?: CSSProperties;
 }
-declare const ScGuide: ({ title, description, skipLabel, nextLabel, onSkip, onNext, hideSkip, hideNext, disabled, className, style, }: IScGuideProps) => JSX.Element;
+declare const ScGuide: ({ title, description, skipLabel, nextLabel, nextIcon, onSkip, onNext, hideSkip, hideNext, disabled, className, style, }: IScGuideProps) => JSX.Element;
 
 interface IScSideBarLogoUnitProps {
-    /** "expanded" renders the wordmark chip + switcher. "collapsed" renders a
-     *  bare clickable product icon (no chip, no switcher). */
+    /** "expanded" renders the merged wordmark + switcher row.
+     *  "collapsed" renders a bare clickable product icon. */
     state?: "expanded" | "collapsed";
     /** In expanded state: the stacked "Product / Streamoid" wordmark `<img>`.
      *  In collapsed state: the square product icon `<img>`. */
     wordmark?: ReactNode;
-    /** Click handler for the wordmark chip / collapsed icon (e.g. navigate home). */
+    /** Click handler for the whole row (wordmark + switcher are one click
+     *  target now — matches the design intent). */
     onClick?: () => void;
-    /** Click handler for the double-arrow product / workspace switcher.
-     *  Ignored when state="collapsed". */
+    /** Back-compat: fires alongside `onClick` if both are set. Either prop
+     *  alone is enough. */
     onSwitchClick?: () => void;
-    /** Accessible label for the switch button. Defaults to "Switch product". */
+    /** Accessible label for the row when it acts as the product switcher.
+     *  Defaults to "Switch product". */
     switchAriaLabel?: string;
-    /** Hide the switch button (useful when there's nothing to switch to).
-     *  Only applies in expanded state — collapsed has no switch button. */
+    /** Hide the switch icon (rare; the design always shows it). */
     hideSwitch?: boolean;
+    /**
+     * Force the hover styling on or off, regardless of the mouse position.
+     * - `true`: row + switch pill render with their hover backgrounds.
+     * - `false`: hover backgrounds are suppressed even on mouse hover.
+     * - `undefined` (default): CSS `:hover` drives the visual state.
+     */
+    hover?: boolean;
     /** Disable interactions. */
     disabled?: boolean;
     className?: string;
     style?: CSSProperties;
 }
-declare const ScSideBarLogoUnit: ({ state, wordmark, onClick, onSwitchClick, switchAriaLabel, hideSwitch, disabled, className, style, }: IScSideBarLogoUnitProps) => JSX.Element;
+declare const ScSideBarLogoUnit: ({ state, wordmark, onClick, onSwitchClick, switchAriaLabel, hideSwitch, hover, disabled, className, style, }: IScSideBarLogoUnitProps) => JSX.Element;
 
 interface IScSidebarMenuProps extends React.HTMLAttributes<HTMLDivElement> {
     icon?: JSX.Element;

package/dist/index.d.ts

@@ -390,6 +390,9 @@ interface IScGuideProps {
     skipLabel?: ReactNode;
     /** Label for the right-hand primary action. Defaults to "Next". */
     nextLabel?: ReactNode;
+    /** Icon rendered after the Next label. Defaults to a right-chevron.
+     *  Use for terminal steps where the action is "Done" + checkmark, etc. */
+    nextIcon?: ReactNode;
     /** Click handler for the Skip action. */
     onSkip?: () => void;
     /** Click handler for the Next action. */
@@ -403,31 +406,39 @@ interface IScGuideProps {
     className?: string;
     style?: CSSProperties;
 }
-declare const ScGuide: ({ title, description, skipLabel, nextLabel, onSkip, onNext, hideSkip, hideNext, disabled, className, style, }: IScGuideProps) => JSX.Element;
+declare const ScGuide: ({ title, description, skipLabel, nextLabel, nextIcon, onSkip, onNext, hideSkip, hideNext, disabled, className, style, }: IScGuideProps) => JSX.Element;
 
 interface IScSideBarLogoUnitProps {
-    /** "expanded" renders the wordmark chip + switcher. "collapsed" renders a
-     *  bare clickable product icon (no chip, no switcher). */
+    /** "expanded" renders the merged wordmark + switcher row.
+     *  "collapsed" renders a bare clickable product icon. */
     state?: "expanded" | "collapsed";
     /** In expanded state: the stacked "Product / Streamoid" wordmark `<img>`.
      *  In collapsed state: the square product icon `<img>`. */
     wordmark?: ReactNode;
-    /** Click handler for the wordmark chip / collapsed icon (e.g. navigate home). */
+    /** Click handler for the whole row (wordmark + switcher are one click
+     *  target now — matches the design intent). */
     onClick?: () => void;
-    /** Click handler for the double-arrow product / workspace switcher.
-     *  Ignored when state="collapsed". */
+    /** Back-compat: fires alongside `onClick` if both are set. Either prop
+     *  alone is enough. */
     onSwitchClick?: () => void;
-    /** Accessible label for the switch button. Defaults to "Switch product". */
+    /** Accessible label for the row when it acts as the product switcher.
+     *  Defaults to "Switch product". */
     switchAriaLabel?: string;
-    /** Hide the switch button (useful when there's nothing to switch to).
-     *  Only applies in expanded state — collapsed has no switch button. */
+    /** Hide the switch icon (rare; the design always shows it). */
     hideSwitch?: boolean;
+    /**
+     * Force the hover styling on or off, regardless of the mouse position.
+     * - `true`: row + switch pill render with their hover backgrounds.
+     * - `false`: hover backgrounds are suppressed even on mouse hover.
+     * - `undefined` (default): CSS `:hover` drives the visual state.
+     */
+    hover?: boolean;
     /** Disable interactions. */
     disabled?: boolean;
     className?: string;
     style?: CSSProperties;
 }
-declare const ScSideBarLogoUnit: ({ state, wordmark, onClick, onSwitchClick, switchAriaLabel, hideSwitch, disabled, className, style, }: IScSideBarLogoUnitProps) => JSX.Element;
+declare const ScSideBarLogoUnit: ({ state, wordmark, onClick, onSwitchClick, switchAriaLabel, hideSwitch, hover, disabled, className, style, }: IScSideBarLogoUnitProps) => JSX.Element;
 
 interface IScSidebarMenuProps extends React.HTMLAttributes<HTMLDivElement> {
     icon?: JSX.Element;

package/dist/index.js

@@ -3026,11 +3026,12 @@ function StreamoidSidebar({
                       ) : null
                     ] }),
                     !!(topItems?.length || config.topItem) && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {}),
                       /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                         "div",
                         {
                           className: "flex flex-col items-stretch shrink-0 w-full",
-                          style: { gap: "var(--spacing-md)", paddingBottom: "var(--spacing-md)" },
+                          style: { gap: "var(--spacing-md)", paddingTop: "var(--spacing-md)", paddingBottom: "var(--spacing-md)" },
                           children: (topItems ?? (config.topItem ? [config.topItem] : [])).map(
                             (item) => renderMenuItem({
                               item,
@@ -3208,11 +3209,12 @@ function StreamoidSidebar({
                 children: [
                   collapsedLogo,
                   !!(topItems?.length || config.topItem) ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HDivider, {}),
                     /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                       "div",
                       {
                         className: "flex flex-col items-center shrink-0",
-                        style: { gap: "var(--spacing-xxs)", paddingBottom: "var(--spacing-xxs)" },
+                        style: { gap: "var(--spacing-xxs)", paddingTop: "var(--spacing-xxs)", paddingBottom: "var(--spacing-xxs)" },
                         children: (topItems ?? (config.topItem ? [config.topItem] : [])).map(
                           (item) => renderMenuItem({
                             item,
@@ -3671,6 +3673,7 @@ var ScGuide = ({
   description = "Description",
   skipLabel = "Skip",
   nextLabel = "Next",
+  nextIcon,
   onSkip,
   onNext,
   hideSkip = false,
@@ -3710,7 +3713,7 @@ var ScGuide = ({
               disabled,
               children: [
                 /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: ScGuide_default.nextLabel, children: nextLabel }),
-                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: ScGuide_default.nextIcon, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons36.SiconRight, { size: 16, strokeWidth: 1.5 }) })
+                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: ScGuide_default.nextIcon, children: nextIcon ?? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons36.SiconRight, { size: 16, strokeWidth: 1.5 }) })
               ]
             }
           )
@@ -3724,8 +3727,9 @@ var ScGuide = ({
 var ScSideBarLogoUnit_default = {
   scSideBarLogoUnit: "ScSideBarLogoUnit_scSideBarLogoUnit",
   row: "ScSideBarLogoUnit_row",
-  chip: "ScSideBarLogoUnit_chip",
   nonInteractive: "ScSideBarLogoUnit_nonInteractive",
+  forceHover: "ScSideBarLogoUnit_forceHover",
+  wordmarkSlot: "ScSideBarLogoUnit_wordmarkSlot",
   switch: "ScSideBarLogoUnit_switch",
   switchIcon: "ScSideBarLogoUnit_switchIcon",
   collapsed: "ScSideBarLogoUnit_collapsed",
@@ -3742,11 +3746,17 @@ var ScSideBarLogoUnit = ({
   onSwitchClick,
   switchAriaLabel = "Switch product",
   hideSwitch = false,
+  hover,
   disabled = false,
   className,
   style
 }) => {
-  const interactive = !!onClick && !disabled;
+  const interactive = !disabled && (!!onClick || !!onSwitchClick);
+  const handleClick = () => {
+    if (!interactive) return;
+    onClick?.();
+    onSwitchClick?.();
+  };
   if (state === "collapsed") {
     return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
       "div",
@@ -3758,8 +3768,9 @@ var ScSideBarLogoUnit = ({
           {
             type: "button",
             className: ScSideBarLogoUnit_default.collapsedTrigger + (interactive ? "" : " " + ScSideBarLogoUnit_default.nonInteractive),
-            onClick: interactive ? onClick : void 0,
+            onClick: interactive ? handleClick : void 0,
             disabled,
+            "aria-label": interactive ? switchAriaLabel : void 0,
             "aria-disabled": !interactive || disabled,
             children: wordmark
           }
@@ -3767,35 +3778,38 @@ var ScSideBarLogoUnit = ({
       }
     );
   }
+  const rowClasses = [
+    ScSideBarLogoUnit_default.row,
+    interactive ? "" : ScSideBarLogoUnit_default.nonInteractive,
+    hover === true ? ScSideBarLogoUnit_default.forceHover : ""
+  ].filter(Boolean).join(" ");
   return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
     "div",
     {
       className: ScSideBarLogoUnit_default.scSideBarLogoUnit + (className ? " " + className : ""),
-      style,
-      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: ScSideBarLogoUnit_default.row, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
-          "button",
-          {
-            type: "button",
-            className: ScSideBarLogoUnit_default.chip + (interactive ? "" : " " + ScSideBarLogoUnit_default.nonInteractive),
-            onClick: interactive ? onClick : void 0,
-            disabled,
-            "aria-disabled": !interactive || disabled,
-            children: wordmark
-          }
-        ),
-        hideSwitch ? null : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
-          "button",
-          {
-            type: "button",
-            className: ScSideBarLogoUnit_default.switch,
-            onClick: onSwitchClick,
-            disabled: disabled || !onSwitchClick,
-            "aria-label": switchAriaLabel,
-            children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: ScSideBarLogoUnit_default.switchIcon, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_icons37.SiconDoubleArrow, { size: 16, strokeWidth: 1.5 }) })
-          }
-        )
-      ] })
+      style: {
+        ...style,
+        // Suppressing hover when `hover === false` — overrides CSS :hover.
+        ...hover === false ? { pointerEvents: "auto" } : null
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+        "button",
+        {
+          type: "button",
+          className: rowClasses,
+          onClick: interactive ? handleClick : void 0,
+          disabled,
+          "aria-label": interactive ? switchAriaLabel : void 0,
+          "aria-disabled": !interactive || disabled,
+          style: hover === false ? {
+            backgroundColor: "transparent"
+          } : void 0,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: ScSideBarLogoUnit_default.wordmarkSlot, children: wordmark }),
+            hideSwitch ? null : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: ScSideBarLogoUnit_default.switch, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: ScSideBarLogoUnit_default.switchIcon, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_icons37.SiconDoubleArrow, { size: 16, strokeWidth: 1.5 }) }) })
+          ]
+        }
+      )
     }
   );
 };

package/dist/index.mjs

@@ -2917,11 +2917,12 @@ function StreamoidSidebar({
                       ) : null
                     ] }),
                     !!(topItems?.length || config.topItem) && /* @__PURE__ */ jsxs32(Fragment14, { children: [
+                      /* @__PURE__ */ jsx40(HDivider, {}),
                       /* @__PURE__ */ jsx40(
                         "div",
                         {
                           className: "flex flex-col items-stretch shrink-0 w-full",
-                          style: { gap: "var(--spacing-md)", paddingBottom: "var(--spacing-md)" },
+                          style: { gap: "var(--spacing-md)", paddingTop: "var(--spacing-md)", paddingBottom: "var(--spacing-md)" },
                           children: (topItems ?? (config.topItem ? [config.topItem] : [])).map(
                             (item) => renderMenuItem({
                               item,
@@ -3099,11 +3100,12 @@ function StreamoidSidebar({
                 children: [
                   collapsedLogo,
                   !!(topItems?.length || config.topItem) ? /* @__PURE__ */ jsxs32(Fragment14, { children: [
+                    /* @__PURE__ */ jsx40(HDivider, {}),
                     /* @__PURE__ */ jsx40(
                       "div",
                       {
                         className: "flex flex-col items-center shrink-0",
-                        style: { gap: "var(--spacing-xxs)", paddingBottom: "var(--spacing-xxs)" },
+                        style: { gap: "var(--spacing-xxs)", paddingTop: "var(--spacing-xxs)", paddingBottom: "var(--spacing-xxs)" },
                         children: (topItems ?? (config.topItem ? [config.topItem] : [])).map(
                           (item) => renderMenuItem({
                             item,
@@ -3570,6 +3572,7 @@ var ScGuide = ({
   description = "Description",
   skipLabel = "Skip",
   nextLabel = "Next",
+  nextIcon,
   onSkip,
   onNext,
   hideSkip = false,
@@ -3609,7 +3612,7 @@ var ScGuide = ({
               disabled,
               children: [
                 /* @__PURE__ */ jsx42("span", { className: ScGuide_default.nextLabel, children: nextLabel }),
-                /* @__PURE__ */ jsx42("span", { className: ScGuide_default.nextIcon, children: /* @__PURE__ */ jsx42(SiconRight2, { size: 16, strokeWidth: 1.5 }) })
+                /* @__PURE__ */ jsx42("span", { className: ScGuide_default.nextIcon, children: nextIcon ?? /* @__PURE__ */ jsx42(SiconRight2, { size: 16, strokeWidth: 1.5 }) })
               ]
             }
           )
@@ -3623,8 +3626,9 @@ var ScGuide = ({
 var ScSideBarLogoUnit_default = {
   scSideBarLogoUnit: "ScSideBarLogoUnit_scSideBarLogoUnit",
   row: "ScSideBarLogoUnit_row",
-  chip: "ScSideBarLogoUnit_chip",
   nonInteractive: "ScSideBarLogoUnit_nonInteractive",
+  forceHover: "ScSideBarLogoUnit_forceHover",
+  wordmarkSlot: "ScSideBarLogoUnit_wordmarkSlot",
   switch: "ScSideBarLogoUnit_switch",
   switchIcon: "ScSideBarLogoUnit_switchIcon",
   collapsed: "ScSideBarLogoUnit_collapsed",
@@ -3641,11 +3645,17 @@ var ScSideBarLogoUnit = ({
   onSwitchClick,
   switchAriaLabel = "Switch product",
   hideSwitch = false,
+  hover,
   disabled = false,
   className,
   style
 }) => {
-  const interactive = !!onClick && !disabled;
+  const interactive = !disabled && (!!onClick || !!onSwitchClick);
+  const handleClick = () => {
+    if (!interactive) return;
+    onClick?.();
+    onSwitchClick?.();
+  };
   if (state === "collapsed") {
     return /* @__PURE__ */ jsx43(
       "div",
@@ -3657,8 +3667,9 @@ var ScSideBarLogoUnit = ({
           {
             type: "button",
             className: ScSideBarLogoUnit_default.collapsedTrigger + (interactive ? "" : " " + ScSideBarLogoUnit_default.nonInteractive),
-            onClick: interactive ? onClick : void 0,
+            onClick: interactive ? handleClick : void 0,
             disabled,
+            "aria-label": interactive ? switchAriaLabel : void 0,
             "aria-disabled": !interactive || disabled,
             children: wordmark
           }
@@ -3666,35 +3677,38 @@ var ScSideBarLogoUnit = ({
       }
     );
   }
+  const rowClasses = [
+    ScSideBarLogoUnit_default.row,
+    interactive ? "" : ScSideBarLogoUnit_default.nonInteractive,
+    hover === true ? ScSideBarLogoUnit_default.forceHover : ""
+  ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx43(
     "div",
     {
       className: ScSideBarLogoUnit_default.scSideBarLogoUnit + (className ? " " + className : ""),
-      style,
-      children: /* @__PURE__ */ jsxs35("div", { className: ScSideBarLogoUnit_default.row, children: [
-        /* @__PURE__ */ jsx43(
-          "button",
-          {
-            type: "button",
-            className: ScSideBarLogoUnit_default.chip + (interactive ? "" : " " + ScSideBarLogoUnit_default.nonInteractive),
-            onClick: interactive ? onClick : void 0,
-            disabled,
-            "aria-disabled": !interactive || disabled,
-            children: wordmark
-          }
-        ),
-        hideSwitch ? null : /* @__PURE__ */ jsx43(
-          "button",
-          {
-            type: "button",
-            className: ScSideBarLogoUnit_default.switch,
-            onClick: onSwitchClick,
-            disabled: disabled || !onSwitchClick,
-            "aria-label": switchAriaLabel,
-            children: /* @__PURE__ */ jsx43("span", { className: ScSideBarLogoUnit_default.switchIcon, children: /* @__PURE__ */ jsx43(SiconDoubleArrow, { size: 16, strokeWidth: 1.5 }) })
-          }
-        )
-      ] })
+      style: {
+        ...style,
+        // Suppressing hover when `hover === false` — overrides CSS :hover.
+        ...hover === false ? { pointerEvents: "auto" } : null
+      },
+      children: /* @__PURE__ */ jsxs35(
+        "button",
+        {
+          type: "button",
+          className: rowClasses,
+          onClick: interactive ? handleClick : void 0,
+          disabled,
+          "aria-label": interactive ? switchAriaLabel : void 0,
+          "aria-disabled": !interactive || disabled,
+          style: hover === false ? {
+            backgroundColor: "transparent"
+          } : void 0,
+          children: [
+            /* @__PURE__ */ jsx43("span", { className: ScSideBarLogoUnit_default.wordmarkSlot, children: wordmark }),
+            hideSwitch ? null : /* @__PURE__ */ jsx43("span", { className: ScSideBarLogoUnit_default.switch, children: /* @__PURE__ */ jsx43("span", { className: ScSideBarLogoUnit_default.switchIcon, children: /* @__PURE__ */ jsx43(SiconDoubleArrow, { size: 16, strokeWidth: 1.5 }) }) })
+          ]
+        }
+      )
     }
   );
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamoid/ui",
-  "version": "0.4.4",
+  "version": "0.4.6",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",