@stoplight/elements-core 7.5.15 → 7.5.16

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/index.esm.js +9 -3
  2. package/index.js +9 -3
  3. package/index.mjs +9 -3
  4. package/package.json +1 -1
package/index.esm.js CHANGED
@@ -2492,10 +2492,16 @@ function getHtmlIdFromItemId(id) {
2492
2492
  }
2493
2493
  function isGroupOpenByDefault(depth, item, activeId, maxDepthOpenByDefault = 0) {
2494
2494
  return (depth < maxDepthOpenByDefault ||
2495
- (activeId && (('id' in item && activeId === item.id) || hasActiveItem(item.items, activeId))));
2495
+ (activeId &&
2496
+ (('slug' in item && activeId === item.slug) ||
2497
+ ('id' in item && activeId === item.id) ||
2498
+ hasActiveItem(item.items, activeId))));
2496
2499
  }
2497
2500
  function hasActiveItem(items, activeId) {
2498
2501
  return items.some(item => {
2502
+ if ('slug' in item && activeId === item.slug) {
2503
+ return true;
2504
+ }
2499
2505
  if ('id' in item && activeId === item.id) {
2500
2506
  return true;
2501
2507
  }
@@ -2616,7 +2622,7 @@ const Item = React.memo(({ depth, isActive, id, title, meta, icon, onClick }) =>
2616
2622
  });
2617
2623
  const Node = React.memo(({ item, depth, meta, onClick, onLinkClick = () => { } }) => {
2618
2624
  const activeId = React.useContext(ActiveIdContext);
2619
- const isActive = activeId === item.id;
2625
+ const isActive = activeId === item.slug || activeId === item.id;
2620
2626
  const LinkComponent = React.useContext(LinkContext);
2621
2627
  const handleClick = (e) => {
2622
2628
  if (isActive) {
@@ -2631,7 +2637,7 @@ const Node = React.memo(({ item, depth, meta, onClick, onLinkClick = () => { } }
2631
2637
  }
2632
2638
  };
2633
2639
  return (React.createElement(Box, { as: LinkComponent, to: item.slug, display: "block", textDecoration: "no-underline", className: "ElementsTableOfContentsItem" },
2634
- React.createElement(Item, { id: getHtmlIdFromItemId(item.id), isActive: isActive, depth: depth, title: item.title, icon: NODE_TYPE_TITLE_ICON[item.type] && (React.createElement(Box, { as: Icon, color: NODE_TYPE_ICON_COLOR[item.type], icon: NODE_TYPE_TITLE_ICON[item.type] })), meta: meta, onClick: handleClick })));
2640
+ React.createElement(Item, { id: getHtmlIdFromItemId(item.slug || item.id), isActive: isActive, depth: depth, title: item.title, icon: NODE_TYPE_TITLE_ICON[item.type] && (React.createElement(Box, { as: Icon, color: NODE_TYPE_ICON_COLOR[item.type], icon: NODE_TYPE_TITLE_ICON[item.type] })), meta: meta, onClick: handleClick })));
2635
2641
  });
2636
2642
  const Version = ({ value }) => {
2637
2643
  return (React.createElement(Box, { mr: 2 },
package/index.js CHANGED
@@ -2546,10 +2546,16 @@ function getHtmlIdFromItemId(id) {
2546
2546
  }
2547
2547
  function isGroupOpenByDefault(depth, item, activeId, maxDepthOpenByDefault = 0) {
2548
2548
  return (depth < maxDepthOpenByDefault ||
2549
- (activeId && (('id' in item && activeId === item.id) || hasActiveItem(item.items, activeId))));
2549
+ (activeId &&
2550
+ (('slug' in item && activeId === item.slug) ||
2551
+ ('id' in item && activeId === item.id) ||
2552
+ hasActiveItem(item.items, activeId))));
2550
2553
  }
2551
2554
  function hasActiveItem(items, activeId) {
2552
2555
  return items.some(item => {
2556
+ if ('slug' in item && activeId === item.slug) {
2557
+ return true;
2558
+ }
2553
2559
  if ('id' in item && activeId === item.id) {
2554
2560
  return true;
2555
2561
  }
@@ -2670,7 +2676,7 @@ const Item = React__namespace.memo(({ depth, isActive, id, title, meta, icon, on
2670
2676
  });
2671
2677
  const Node = React__namespace.memo(({ item, depth, meta, onClick, onLinkClick = () => { } }) => {
2672
2678
  const activeId = React__namespace.useContext(ActiveIdContext);
2673
- const isActive = activeId === item.id;
2679
+ const isActive = activeId === item.slug || activeId === item.id;
2674
2680
  const LinkComponent = React__namespace.useContext(LinkContext);
2675
2681
  const handleClick = (e) => {
2676
2682
  if (isActive) {
@@ -2685,7 +2691,7 @@ const Node = React__namespace.memo(({ item, depth, meta, onClick, onLinkClick =
2685
2691
  }
2686
2692
  };
2687
2693
  return (React__namespace.createElement(mosaic.Box, { as: LinkComponent, to: item.slug, display: "block", textDecoration: "no-underline", className: "ElementsTableOfContentsItem" },
2688
- React__namespace.createElement(Item, { id: getHtmlIdFromItemId(item.id), isActive: isActive, depth: depth, title: item.title, icon: NODE_TYPE_TITLE_ICON[item.type] && (React__namespace.createElement(mosaic.Box, { as: mosaic.Icon, color: NODE_TYPE_ICON_COLOR[item.type], icon: NODE_TYPE_TITLE_ICON[item.type] })), meta: meta, onClick: handleClick })));
2694
+ React__namespace.createElement(Item, { id: getHtmlIdFromItemId(item.slug || item.id), isActive: isActive, depth: depth, title: item.title, icon: NODE_TYPE_TITLE_ICON[item.type] && (React__namespace.createElement(mosaic.Box, { as: mosaic.Icon, color: NODE_TYPE_ICON_COLOR[item.type], icon: NODE_TYPE_TITLE_ICON[item.type] })), meta: meta, onClick: handleClick })));
2689
2695
  });
2690
2696
  const Version = ({ value }) => {
2691
2697
  return (React__namespace.createElement(mosaic.Box, { mr: 2 },
package/index.mjs CHANGED
@@ -2492,10 +2492,16 @@ function getHtmlIdFromItemId(id) {
2492
2492
  }
2493
2493
  function isGroupOpenByDefault(depth, item, activeId, maxDepthOpenByDefault = 0) {
2494
2494
  return (depth < maxDepthOpenByDefault ||
2495
- (activeId && (('id' in item && activeId === item.id) || hasActiveItem(item.items, activeId))));
2495
+ (activeId &&
2496
+ (('slug' in item && activeId === item.slug) ||
2497
+ ('id' in item && activeId === item.id) ||
2498
+ hasActiveItem(item.items, activeId))));
2496
2499
  }
2497
2500
  function hasActiveItem(items, activeId) {
2498
2501
  return items.some(item => {
2502
+ if ('slug' in item && activeId === item.slug) {
2503
+ return true;
2504
+ }
2499
2505
  if ('id' in item && activeId === item.id) {
2500
2506
  return true;
2501
2507
  }
@@ -2616,7 +2622,7 @@ const Item = React.memo(({ depth, isActive, id, title, meta, icon, onClick }) =>
2616
2622
  });
2617
2623
  const Node = React.memo(({ item, depth, meta, onClick, onLinkClick = () => { } }) => {
2618
2624
  const activeId = React.useContext(ActiveIdContext);
2619
- const isActive = activeId === item.id;
2625
+ const isActive = activeId === item.slug || activeId === item.id;
2620
2626
  const LinkComponent = React.useContext(LinkContext);
2621
2627
  const handleClick = (e) => {
2622
2628
  if (isActive) {
@@ -2631,7 +2637,7 @@ const Node = React.memo(({ item, depth, meta, onClick, onLinkClick = () => { } }
2631
2637
  }
2632
2638
  };
2633
2639
  return (React.createElement(Box, { as: LinkComponent, to: item.slug, display: "block", textDecoration: "no-underline", className: "ElementsTableOfContentsItem" },
2634
- React.createElement(Item, { id: getHtmlIdFromItemId(item.id), isActive: isActive, depth: depth, title: item.title, icon: NODE_TYPE_TITLE_ICON[item.type] && (React.createElement(Box, { as: Icon, color: NODE_TYPE_ICON_COLOR[item.type], icon: NODE_TYPE_TITLE_ICON[item.type] })), meta: meta, onClick: handleClick })));
2640
+ React.createElement(Item, { id: getHtmlIdFromItemId(item.slug || item.id), isActive: isActive, depth: depth, title: item.title, icon: NODE_TYPE_TITLE_ICON[item.type] && (React.createElement(Box, { as: Icon, color: NODE_TYPE_ICON_COLOR[item.type], icon: NODE_TYPE_TITLE_ICON[item.type] })), meta: meta, onClick: handleClick })));
2635
2641
  });
2636
2642
  const Version = ({ value }) => {
2637
2643
  return (React.createElement(Box, { mr: 2 },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoplight/elements-core",
3
- "version": "7.5.15",
3
+ "version": "7.5.16",
4
4
  "main": "./index.js",
5
5
  "sideEffects": [
6
6
  "web-components.min.js",