@streamoid/ui 0.6.41 → 0.6.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.css +18 -21
  2. package/dist/index.js +56 -31
  3. package/dist/index.mjs +56 -31
  4. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -4439,27 +4439,6 @@ button.ScSidebarShell_actionRow:hover {
4439
4439
  width: calc(100% + var(--spacing-md) + var(--spacing-md));
4440
4440
  margin-inline: calc(0px - var(--spacing-md));
4441
4441
  }
4442
- .ScArtifaxSidebar_scArtifaxSidebar [class*=workspaceTriggerExpanded] {
4443
- min-height: 40px;
4444
- padding: 8px;
4445
- }
4446
- .ScArtifaxSidebar_scArtifaxSidebar [class*=searchTriggerExpanded] {
4447
- height: 40px;
4448
- }
4449
- .ScArtifaxSidebar_scArtifaxSidebar [class*=workspaceName],
4450
- .ScArtifaxSidebar_scArtifaxSidebar [class*=searchLabel] {
4451
- font-size: 14px;
4452
- line-height: 20px;
4453
- font-weight: 500;
4454
- }
4455
- .ScArtifaxSidebar_scArtifaxSidebar [class*=appWordmark] {
4456
- height: 20px;
4457
- }
4458
- .ScArtifaxSidebar_scArtifaxSidebar [class*=appWordmark] > span,
4459
- .ScArtifaxSidebar_scArtifaxSidebar [class*=appWordmark] svg {
4460
- width: auto !important;
4461
- height: 20px !important;
4462
- }
4463
4442
  .ScArtifaxSidebar_body {
4464
4443
  -webkit-mask-image:
4465
4444
  linear-gradient(
@@ -4478,6 +4457,24 @@ button.ScSidebarShell_actionRow:hover {
4478
4457
  z-index: 1;
4479
4458
  background: var(--alias-surface-base, #101010);
4480
4459
  }
4460
+ .ScArtifaxSidebar_body > [class*=logoUnit]::after {
4461
+ content: "";
4462
+ position: absolute;
4463
+ inset-inline: 0;
4464
+ top: 100%;
4465
+ height: 20px;
4466
+ pointer-events: none;
4467
+ opacity: 0;
4468
+ transition: opacity 150ms ease-out;
4469
+ background:
4470
+ linear-gradient(
4471
+ to bottom,
4472
+ var(--alias-surface-base, #101010),
4473
+ transparent);
4474
+ }
4475
+ .ScArtifaxSidebar_body[data-scrolled=true] > [class*=logoUnit]::after {
4476
+ opacity: 1;
4477
+ }
4481
4478
 
4482
4479
  /* src/SC-Sidebar Switch menu/ScSidebarSwitchMenu.module.css */
4483
4480
  .ScSidebarSwitchMenu_scSidebarSwitchMenu,
package/dist/index.js CHANGED
@@ -6297,6 +6297,14 @@ function SectionHeader2({
6297
6297
  }
6298
6298
  );
6299
6299
  }
6300
+ function useScrolled() {
6301
+ const [scrolled, setScrolled] = (0, import_react18.useState)(false);
6302
+ const onScroll = (0, import_react18.useCallback)((event) => {
6303
+ const next = event.currentTarget.scrollTop > 0;
6304
+ setScrolled((prev) => prev === next ? prev : next);
6305
+ }, []);
6306
+ return { scrolled, onScroll };
6307
+ }
6300
6308
  var ScAppSidebar = ({
6301
6309
  expanded,
6302
6310
  onToggle,
@@ -6330,6 +6338,7 @@ var ScAppSidebar = ({
6330
6338
  }
6331
6339
  };
6332
6340
  const isControlled = !!openSections;
6341
+ const { scrolled, onScroll } = useScrolled();
6333
6342
  const [internalOpen, setInternalOpen] = (0, import_react18.useState)(
6334
6343
  () => {
6335
6344
  const init = {};
@@ -6389,30 +6398,38 @@ var ScAppSidebar = ({
6389
6398
  className: ScArtifaxSidebar_default.container + " " + ScArtifaxSidebar_default.expanded,
6390
6399
  children: [
6391
6400
  /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { "aria-hidden": "true", className: ScArtifaxSidebar_default.borderOverlayExpanded }),
6392
- /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScArtifaxSidebar_default.body, children: [
6393
- expandedLogo ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.logoUnitExpanded, children: expandedLogo }) : null,
6394
- sections.map((section, idx) => {
6395
- const open = section.label ? section.collapsible !== false ? isSectionOpen(section.id) : true : true;
6396
- const showHeader = !!section.label;
6397
- const canToggle = showHeader && section.collapsible !== false;
6398
- return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { children: [
6399
- idx > 0 ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ScHDivider, {}) : null,
6400
- /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScArtifaxSidebar_default.sectionContainer, children: [
6401
- showHeader ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
6402
- SectionHeader2,
6403
- {
6404
- label: section.label,
6405
- open,
6406
- onToggle: canToggle ? () => handleSectionToggle(section.id) : void 0
6407
- }
6408
- ) : null,
6409
- open ? section.items.map(
6410
- (item) => renderMenuItem2(item, section.id)
6411
- ) : null
6412
- ] })
6413
- ] }, section.id);
6414
- })
6415
- ] }),
6401
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
6402
+ "div",
6403
+ {
6404
+ className: ScArtifaxSidebar_default.body,
6405
+ "data-scrolled": scrolled ? "true" : void 0,
6406
+ onScroll,
6407
+ children: [
6408
+ expandedLogo ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.logoUnitExpanded, children: expandedLogo }) : null,
6409
+ sections.map((section, idx) => {
6410
+ const open = section.label ? section.collapsible !== false ? isSectionOpen(section.id) : true : true;
6411
+ const showHeader = !!section.label;
6412
+ const canToggle = showHeader && section.collapsible !== false;
6413
+ return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { children: [
6414
+ idx > 0 ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ScHDivider, {}) : null,
6415
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScArtifaxSidebar_default.sectionContainer, children: [
6416
+ showHeader ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
6417
+ SectionHeader2,
6418
+ {
6419
+ label: section.label,
6420
+ open,
6421
+ onToggle: canToggle ? () => handleSectionToggle(section.id) : void 0
6422
+ }
6423
+ ) : null,
6424
+ open ? section.items.map(
6425
+ (item) => renderMenuItem2(item, section.id)
6426
+ ) : null
6427
+ ] })
6428
+ ] }, section.id);
6429
+ })
6430
+ ]
6431
+ }
6432
+ ),
6416
6433
  preFooterContent,
6417
6434
  creditWarning ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.creditWarningSlot, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
6418
6435
  CreditWarningBanner,
@@ -6490,13 +6507,21 @@ var ScAppSidebar = ({
6490
6507
  className: ScArtifaxSidebar_default.container + " " + ScArtifaxSidebar_default.collapsed,
6491
6508
  children: [
6492
6509
  /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { "aria-hidden": "true", className: ScArtifaxSidebar_default.borderOverlayCollapsed }),
6493
- /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: ScArtifaxSidebar_default.body + " " + ScArtifaxSidebar_default.bodyCollapsed, children: [
6494
- collapsedLogo ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.logoUnitCollapsed, children: collapsedLogo }) : null,
6495
- sections.map((section, idx) => /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { children: [
6496
- idx > 0 ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ScHDivider, {}) : null,
6497
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.sectionContainerCollapsed, children: section.items.map((item) => renderMenuItem2(item, section.id)) })
6498
- ] }, section.id))
6499
- ] }),
6510
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
6511
+ "div",
6512
+ {
6513
+ className: ScArtifaxSidebar_default.body + " " + ScArtifaxSidebar_default.bodyCollapsed,
6514
+ "data-scrolled": scrolled ? "true" : void 0,
6515
+ onScroll,
6516
+ children: [
6517
+ collapsedLogo ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.logoUnitCollapsed, children: collapsedLogo }) : null,
6518
+ sections.map((section, idx) => /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { children: [
6519
+ idx > 0 ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ScHDivider, {}) : null,
6520
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.sectionContainerCollapsed, children: section.items.map((item) => renderMenuItem2(item, section.id)) })
6521
+ ] }, section.id))
6522
+ ]
6523
+ }
6524
+ ),
6500
6525
  preFooterContent,
6501
6526
  creditWarning ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: ScArtifaxSidebar_default.creditWarningSlot, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
6502
6527
  CreditWarningBanner,
package/dist/index.mjs CHANGED
@@ -6129,6 +6129,14 @@ function SectionHeader2({
6129
6129
  }
6130
6130
  );
6131
6131
  }
6132
+ function useScrolled() {
6133
+ const [scrolled, setScrolled] = useState15(false);
6134
+ const onScroll = useCallback3((event) => {
6135
+ const next = event.currentTarget.scrollTop > 0;
6136
+ setScrolled((prev) => prev === next ? prev : next);
6137
+ }, []);
6138
+ return { scrolled, onScroll };
6139
+ }
6132
6140
  var ScAppSidebar = ({
6133
6141
  expanded,
6134
6142
  onToggle,
@@ -6162,6 +6170,7 @@ var ScAppSidebar = ({
6162
6170
  }
6163
6171
  };
6164
6172
  const isControlled = !!openSections;
6173
+ const { scrolled, onScroll } = useScrolled();
6165
6174
  const [internalOpen, setInternalOpen] = useState15(
6166
6175
  () => {
6167
6176
  const init = {};
@@ -6221,30 +6230,38 @@ var ScAppSidebar = ({
6221
6230
  className: ScArtifaxSidebar_default.container + " " + ScArtifaxSidebar_default.expanded,
6222
6231
  children: [
6223
6232
  /* @__PURE__ */ jsx53("div", { "aria-hidden": "true", className: ScArtifaxSidebar_default.borderOverlayExpanded }),
6224
- /* @__PURE__ */ jsxs42("div", { className: ScArtifaxSidebar_default.body, children: [
6225
- expandedLogo ? /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.logoUnitExpanded, children: expandedLogo }) : null,
6226
- sections.map((section, idx) => {
6227
- const open = section.label ? section.collapsible !== false ? isSectionOpen(section.id) : true : true;
6228
- const showHeader = !!section.label;
6229
- const canToggle = showHeader && section.collapsible !== false;
6230
- return /* @__PURE__ */ jsxs42("div", { children: [
6231
- idx > 0 ? /* @__PURE__ */ jsx53(ScHDivider, {}) : null,
6232
- /* @__PURE__ */ jsxs42("div", { className: ScArtifaxSidebar_default.sectionContainer, children: [
6233
- showHeader ? /* @__PURE__ */ jsx53(
6234
- SectionHeader2,
6235
- {
6236
- label: section.label,
6237
- open,
6238
- onToggle: canToggle ? () => handleSectionToggle(section.id) : void 0
6239
- }
6240
- ) : null,
6241
- open ? section.items.map(
6242
- (item) => renderMenuItem2(item, section.id)
6243
- ) : null
6244
- ] })
6245
- ] }, section.id);
6246
- })
6247
- ] }),
6233
+ /* @__PURE__ */ jsxs42(
6234
+ "div",
6235
+ {
6236
+ className: ScArtifaxSidebar_default.body,
6237
+ "data-scrolled": scrolled ? "true" : void 0,
6238
+ onScroll,
6239
+ children: [
6240
+ expandedLogo ? /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.logoUnitExpanded, children: expandedLogo }) : null,
6241
+ sections.map((section, idx) => {
6242
+ const open = section.label ? section.collapsible !== false ? isSectionOpen(section.id) : true : true;
6243
+ const showHeader = !!section.label;
6244
+ const canToggle = showHeader && section.collapsible !== false;
6245
+ return /* @__PURE__ */ jsxs42("div", { children: [
6246
+ idx > 0 ? /* @__PURE__ */ jsx53(ScHDivider, {}) : null,
6247
+ /* @__PURE__ */ jsxs42("div", { className: ScArtifaxSidebar_default.sectionContainer, children: [
6248
+ showHeader ? /* @__PURE__ */ jsx53(
6249
+ SectionHeader2,
6250
+ {
6251
+ label: section.label,
6252
+ open,
6253
+ onToggle: canToggle ? () => handleSectionToggle(section.id) : void 0
6254
+ }
6255
+ ) : null,
6256
+ open ? section.items.map(
6257
+ (item) => renderMenuItem2(item, section.id)
6258
+ ) : null
6259
+ ] })
6260
+ ] }, section.id);
6261
+ })
6262
+ ]
6263
+ }
6264
+ ),
6248
6265
  preFooterContent,
6249
6266
  creditWarning ? /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.creditWarningSlot, children: /* @__PURE__ */ jsx53(
6250
6267
  CreditWarningBanner,
@@ -6322,13 +6339,21 @@ var ScAppSidebar = ({
6322
6339
  className: ScArtifaxSidebar_default.container + " " + ScArtifaxSidebar_default.collapsed,
6323
6340
  children: [
6324
6341
  /* @__PURE__ */ jsx53("div", { "aria-hidden": "true", className: ScArtifaxSidebar_default.borderOverlayCollapsed }),
6325
- /* @__PURE__ */ jsxs42("div", { className: ScArtifaxSidebar_default.body + " " + ScArtifaxSidebar_default.bodyCollapsed, children: [
6326
- collapsedLogo ? /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.logoUnitCollapsed, children: collapsedLogo }) : null,
6327
- sections.map((section, idx) => /* @__PURE__ */ jsxs42("div", { children: [
6328
- idx > 0 ? /* @__PURE__ */ jsx53(ScHDivider, {}) : null,
6329
- /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.sectionContainerCollapsed, children: section.items.map((item) => renderMenuItem2(item, section.id)) })
6330
- ] }, section.id))
6331
- ] }),
6342
+ /* @__PURE__ */ jsxs42(
6343
+ "div",
6344
+ {
6345
+ className: ScArtifaxSidebar_default.body + " " + ScArtifaxSidebar_default.bodyCollapsed,
6346
+ "data-scrolled": scrolled ? "true" : void 0,
6347
+ onScroll,
6348
+ children: [
6349
+ collapsedLogo ? /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.logoUnitCollapsed, children: collapsedLogo }) : null,
6350
+ sections.map((section, idx) => /* @__PURE__ */ jsxs42("div", { children: [
6351
+ idx > 0 ? /* @__PURE__ */ jsx53(ScHDivider, {}) : null,
6352
+ /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.sectionContainerCollapsed, children: section.items.map((item) => renderMenuItem2(item, section.id)) })
6353
+ ] }, section.id))
6354
+ ]
6355
+ }
6356
+ ),
6332
6357
  preFooterContent,
6333
6358
  creditWarning ? /* @__PURE__ */ jsx53("div", { className: ScArtifaxSidebar_default.creditWarningSlot, children: /* @__PURE__ */ jsx53(
6334
6359
  CreditWarningBanner,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@streamoid/ui",
3
- "version": "0.6.41",
3
+ "version": "0.6.42",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",