@salt-ds/lab 1.0.0-alpha.16 → 1.0.0-alpha.17

package/dist-es/responsive/useDynamicCollapse.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDynamicCollapse.js","sources":["../src/responsive/useDynamicCollapse.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { useCallback, useState } from \"react\";\nimport {\n  ElementRef,\n  OverflowItem,\n  OverflowHookProps,\n  DynamicCollapseHookResult,\n} from \"./overflowTypes\";\nimport { byDescendingPriority } from \"./overflowUtils\";\nimport {\n  getElementForItem,\n  getRuntimePadding,\n  isCollapsed,\n  isCollapsible,\n  measureContainerOverflow,\n  measureElementSize,\n} from \"./overflowUtils\";\n\nconst UNCOLLAPSED_DYNAMIC_ITEMS =\n  '[data-collapsible=\"dynamic\"]:not([data-collapsed=\"true\"]):not([data-collapsing=\"true\"])';\n\nconst hasUncollapsedDynamicItems = (containerRef: ElementRef) =>\n  containerRef.current!.querySelector(UNCOLLAPSED_DYNAMIC_ITEMS) !== null;\n\nconst thereAreCollapsibleItemsAndTheyAreAllCollapsed = (\n  items: OverflowItem[]\n) => {\n  const collapsibleItems = items.filter(isCollapsible);\n  return collapsibleItems.length > 0 && collapsibleItems.every(isCollapsed);\n};\n\nconst nextItemToCollapse = (listItems: OverflowItem[]): OverflowItem =>\n  listItems.filter(isCollapsible).sort(byDescendingPriority).slice(-1)[0];\n\nexport const useDynamicCollapse = ({\n  collectionHook,\n  innerContainerSize = 0,\n  label = \"Toolbar\",\n  overflowItemsRef: managedItemsRef,\n  overflowContainerRef: ref,\n  orientation,\n}: OverflowHookProps): DynamicCollapseHookResult => {\n  const { dispatch } = collectionHook;\n  const [newCollapsingItem, setNewCollapsingItem] =\n    useState<OverflowItem | null>(null);\n  const restoreCollapsingItem = useCallback(() => {\n    dispatch({\n      type: \"restore-collapsing-item\",\n    });\n  }, [dispatch]);\n\n  const collapseCollapsingItem = useCallback(\n    (item: OverflowItem, target: HTMLElement, minSize: number) => {\n      const styleDimension =\n        orientation === \"horizontal\" ? \"minWidth\" : \"minHeight\";\n      // TODO do we really want to do this here ?\n      target.style[styleDimension] = `${minSize}px`;\n      const size = measureElementSize(target);\n\n      dispatch({\n        type: \"collapse-dynamic-item\",\n        overflowItem: item,\n        collapsedSize: size,\n        minSize,\n      });\n    },\n    [dispatch, orientation]\n  );\n\n  const checkDynamicContent = useCallback(\n    (containerHasGrown?: boolean) => {\n      const { current: managedItems } = managedItemsRef;\n      // The order must matter here\n      const collapsingChild = managedItems.find(\n        ({ collapsible, collapsing }) => collapsible === \"dynamic\" && collapsing\n      );\n      const collapsedChild = managedItems.find(\n        ({ collapsible, collapsed }) => collapsible === \"dynamic\" && collapsed\n      );\n\n      if (!collapsingChild && !collapsedChild) {\n        return;\n      }\n      if (collapsedChild && !collapsingChild) {\n        // TODO do we need a check to see whether we now have enough space to completely uncollapse the item ?\n        // We may be able to uncollapse one or more items before the one we set to collapsing\n\n        dispatch({\n          type: \"uncollapse-dynamic-item\",\n          overflowItem: collapsedChild,\n        });\n      } else if (collapsingChild) {\n        if (containerHasGrown && collapsedChild) {\n          const collapsingElement = getElementForItem(ref, collapsingChild);\n          const dimension = orientation === \"horizontal\" ? \"width\" : \"height\";\n          // can we avoid measuring ths element on every resize event ?\n          const size = measureElementSize(collapsingElement, dimension);\n          // collapsingElement.getBoundingClientRect();\n\n          // We don't restore a collapsing item unless there is at least one collapsed item\n          if (collapsedChild && size === collapsingChild.size) {\n            restoreCollapsingItem();\n          }\n        } else {\n          // Note we are going to compare width with minWidth. Margin is ignored\n          // use getBoundingClientRect rather than measureNode\n          const dimension = orientation === \"horizontal\" ? \"width\" : \"height\";\n          const collapsingElement = getElementForItem(ref, collapsingChild);\n          const { [dimension]: measuredSizeOfCollapsingElement } =\n            collapsingElement.getBoundingClientRect();\n          // minsize should be the size of the last item in the tooltray\n          const [padStart, padEnd] = getRuntimePadding(\n            collapsingElement,\n            \"left\",\n            \"right\"\n          );\n          //TODO we don't really want to measure the last item in the collapsing container\n          // we want to measure the width of the item that will be the last to overflow.\n          const lastTooltrayItem = collapsingElement.querySelector(\n            \".Responsive-inner > :last-child\"\n          );\n          if (lastTooltrayItem) {\n            const { [dimension]: childMinSize } =\n              lastTooltrayItem.getBoundingClientRect();\n            const minSize = padStart + childMinSize + padEnd;\n            if (Math.floor(measuredSizeOfCollapsingElement) <= minSize) {\n              collapseCollapsingItem(\n                collapsingChild,\n                collapsingElement,\n                minSize\n              );\n            }\n          }\n        }\n      }\n    },\n    [\n      collapseCollapsingItem,\n      dispatch,\n      managedItemsRef,\n      orientation,\n      ref,\n      restoreCollapsingItem,\n    ]\n  );\n\n  const handleResize = useCallback(\n    (size: number, containerHasGrown?: boolean) => {\n      const { current: managedItems } = managedItemsRef;\n      const { isOverflowing: willOverflow } = measureContainerOverflow(\n        ref,\n        orientation\n      );\n\n      const collapsingItem = managedItems.find((item) => item.collapsing);\n\n      if (collapsingItem) {\n        checkDynamicContent(containerHasGrown);\n      } else if (\n        containerHasGrown &&\n        !willOverflow &&\n        thereAreCollapsibleItemsAndTheyAreAllCollapsed(managedItems)\n      ) {\n        checkDynamicContent(true);\n      }\n    },\n    [checkDynamicContent, managedItemsRef, orientation, ref]\n  );\n\n  const resetMeasurements = useCallback(() => {\n    const { current: managedItems } = managedItemsRef;\n    const hasDynamicItems = hasUncollapsedDynamicItems(ref);\n    if (hasDynamicItems) {\n      const collapsingItem = nextItemToCollapse(managedItems);\n      setNewCollapsingItem(collapsingItem);\n\n      dispatch({\n        type: \"collapsing-item\",\n        overflowItem: collapsingItem,\n      });\n      return true;\n    } else {\n      return false;\n    }\n  }, [dispatch, managedItemsRef, ref]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (newCollapsingItem) {\n      checkDynamicContent(false);\n    }\n  }, [checkDynamicContent, newCollapsingItem]);\n\n  return {\n    onResize: handleResize,\n    resetMeasurements,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useDynamicCollapse.js","sources":["../src/responsive/useDynamicCollapse.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { useCallback, useState } from \"react\";\nimport {\n  ElementRef,\n  OverflowItem,\n  OverflowHookProps,\n  DynamicCollapseHookResult,\n} from \"./overflowTypes\";\nimport {\n  byDescendingPriority,\n  getElementForItem,\n  getRuntimePadding,\n  isCollapsed,\n  isCollapsible,\n  measureContainerOverflow,\n  measureElementSize,\n} from \"./overflowUtils\";\n\nconst UNCOLLAPSED_DYNAMIC_ITEMS =\n  '[data-collapsible=\"dynamic\"]:not([data-collapsed=\"true\"]):not([data-collapsing=\"true\"])';\n\nconst hasUncollapsedDynamicItems = (containerRef: ElementRef) =>\n  containerRef.current!.querySelector(UNCOLLAPSED_DYNAMIC_ITEMS) !== null;\n\nconst thereAreCollapsibleItemsAndTheyAreAllCollapsed = (\n  items: OverflowItem[]\n) => {\n  const collapsibleItems = items.filter(isCollapsible);\n  return collapsibleItems.length > 0 && collapsibleItems.every(isCollapsed);\n};\n\nconst nextItemToCollapse = (listItems: OverflowItem[]): OverflowItem =>\n  listItems.filter(isCollapsible).sort(byDescendingPriority).slice(-1)[0];\n\nexport const useDynamicCollapse = ({\n  collectionHook,\n  innerContainerSize = 0,\n  label = \"Toolbar\",\n  overflowItemsRef: managedItemsRef,\n  overflowContainerRef: ref,\n  orientation,\n}: OverflowHookProps): DynamicCollapseHookResult => {\n  const { dispatch } = collectionHook;\n  const [newCollapsingItem, setNewCollapsingItem] =\n    useState<OverflowItem | null>(null);\n  const restoreCollapsingItem = useCallback(() => {\n    dispatch({\n      type: \"restore-collapsing-item\",\n    });\n  }, [dispatch]);\n\n  const collapseCollapsingItem = useCallback(\n    (item: OverflowItem, target: HTMLElement, minSize: number) => {\n      const styleDimension =\n        orientation === \"horizontal\" ? \"minWidth\" : \"minHeight\";\n      // TODO do we really want to do this here ?\n      target.style[styleDimension] = `${minSize}px`;\n      const size = measureElementSize(target);\n\n      dispatch({\n        type: \"collapse-dynamic-item\",\n        overflowItem: item,\n        collapsedSize: size,\n        minSize,\n      });\n    },\n    [dispatch, orientation]\n  );\n\n  const checkDynamicContent = useCallback(\n    (containerHasGrown?: boolean) => {\n      const { current: managedItems } = managedItemsRef;\n      // The order must matter here\n      const collapsingChild = managedItems.find(\n        ({ collapsible, collapsing }) => collapsible === \"dynamic\" && collapsing\n      );\n      const collapsedChild = managedItems.find(\n        ({ collapsible, collapsed }) => collapsible === \"dynamic\" && collapsed\n      );\n\n      if (!collapsingChild && !collapsedChild) {\n        return;\n      }\n      if (collapsedChild && !collapsingChild) {\n        // TODO do we need a check to see whether we now have enough space to completely uncollapse the item ?\n        // We may be able to uncollapse one or more items before the one we set to collapsing\n\n        dispatch({\n          type: \"uncollapse-dynamic-item\",\n          overflowItem: collapsedChild,\n        });\n      } else if (collapsingChild) {\n        if (containerHasGrown && collapsedChild) {\n          const collapsingElement = getElementForItem(ref, collapsingChild);\n          const dimension = orientation === \"horizontal\" ? \"width\" : \"height\";\n          // can we avoid measuring ths element on every resize event ?\n          const size = measureElementSize(collapsingElement, dimension);\n          // collapsingElement.getBoundingClientRect();\n\n          // We don't restore a collapsing item unless there is at least one collapsed item\n          if (collapsedChild && size === collapsingChild.size) {\n            restoreCollapsingItem();\n          }\n        } else {\n          // Note we are going to compare width with minWidth. Margin is ignored\n          // use getBoundingClientRect rather than measureNode\n          const dimension = orientation === \"horizontal\" ? \"width\" : \"height\";\n          const collapsingElement = getElementForItem(ref, collapsingChild);\n          const { [dimension]: measuredSizeOfCollapsingElement } =\n            collapsingElement.getBoundingClientRect();\n          // minsize should be the size of the last item in the tooltray\n          const [padStart, padEnd] = getRuntimePadding(\n            collapsingElement,\n            \"left\",\n            \"right\"\n          );\n          //TODO we don't really want to measure the last item in the collapsing container\n          // we want to measure the width of the item that will be the last to overflow.\n          const lastTooltrayItem = collapsingElement.querySelector(\n            \".Responsive-inner > :last-child\"\n          );\n          if (lastTooltrayItem) {\n            const { [dimension]: childMinSize } =\n              lastTooltrayItem.getBoundingClientRect();\n            const minSize = padStart + childMinSize + padEnd;\n            if (Math.floor(measuredSizeOfCollapsingElement) <= minSize) {\n              collapseCollapsingItem(\n                collapsingChild,\n                collapsingElement,\n                minSize\n              );\n            }\n          }\n        }\n      }\n    },\n    [\n      collapseCollapsingItem,\n      dispatch,\n      managedItemsRef,\n      orientation,\n      ref,\n      restoreCollapsingItem,\n    ]\n  );\n\n  const handleResize = useCallback(\n    (size: number, containerHasGrown?: boolean) => {\n      const { current: managedItems } = managedItemsRef;\n      const { isOverflowing: willOverflow } = measureContainerOverflow(\n        ref,\n        orientation\n      );\n\n      const collapsingItem = managedItems.find((item) => item.collapsing);\n\n      if (collapsingItem) {\n        checkDynamicContent(containerHasGrown);\n      } else if (\n        containerHasGrown &&\n        !willOverflow &&\n        thereAreCollapsibleItemsAndTheyAreAllCollapsed(managedItems)\n      ) {\n        checkDynamicContent(true);\n      }\n    },\n    [checkDynamicContent, managedItemsRef, orientation, ref]\n  );\n\n  const resetMeasurements = useCallback(() => {\n    const { current: managedItems } = managedItemsRef;\n    const hasDynamicItems = hasUncollapsedDynamicItems(ref);\n    if (hasDynamicItems) {\n      const collapsingItem = nextItemToCollapse(managedItems);\n      setNewCollapsingItem(collapsingItem);\n\n      dispatch({\n        type: \"collapsing-item\",\n        overflowItem: collapsingItem,\n      });\n      return true;\n    } else {\n      return false;\n    }\n  }, [dispatch, managedItemsRef, ref]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (newCollapsingItem) {\n      checkDynamicContent(false);\n    }\n  }, [checkDynamicContent, newCollapsingItem]);\n\n  return {\n    onResize: handleResize,\n    resetMeasurements,\n  };\n};\n"],"names":[],"mappings":"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"}

package/dist-es/responsive/useOverflowLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOverflowLayout.js","sources":["../src/responsive/useOverflowLayout.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from \"react\";\nimport {\n  ElementRef,\n  ManagedListRef,\n  OverflowItem,\n  OverflowLayoutHookProps,\n} from \"./overflowTypes\";\n\nimport { getIsOverflowed } from \"./overflowUtils\";\nimport { useDynamicCollapse } from \"./useDynamicCollapse\";\nimport { useInstantCollapse } from \"./useInstantCollapse\";\nimport { useOverflow } from \"./useOverflow\";\nimport { useReclaimSpace } from \"./useReclaimSpace\";\nimport { ResizeHandler, useResizeObserver } from \"../responsive\";\n\nimport { measureContainerOverflow } from \"./overflowUtils\";\n\nconst MONITORED_DIMENSIONS: { [key: string]: string[] } = {\n  horizontal: [\"width\", \"scrollHeight\"],\n  vertical: [\"height\", \"scrollWidth\"],\n  none: [],\n};\n\ntype overflowUpdate = (item1: OverflowItem, item2: OverflowItem) => void;\n\n// we need id, just to be able to assign id to overflowIndicator in useOverflow\nexport const useOverflowLayout = ({\n  collectionHook,\n  id,\n  orientation,\n  label = \"Toolbar\",\n  disableOverflow = false,\n}: OverflowLayoutHookProps): [ElementRef, overflowUpdate] => {\n  const overflowContainerRef: ElementRef = useRef(null);\n  const overflowItemsRef: ManagedListRef = useRef([]);\n  const measurement = useRef({ innerContainerSize: 0, rootContainerDepth: 0 });\n  const { innerContainerSize } = measurement.current;\n\n  const { dispatch, version: collectionVersion } = collectionHook;\n  overflowItemsRef.current = collectionHook.data;\n\n  const {\n    onResize: onOverflowResize,\n    resetMeasurements: resetOverflowMeasurements,\n  } = useOverflow({\n    collectionHook,\n    id,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const hasOverflowedItems = getIsOverflowed(collectionHook.data);\n  // const hasOverflowedItems = getIsOverflowed(managedItems);\n\n  const {\n    onResize: onDynamicResize,\n    resetMeasurements: resetDynamicMeasurements,\n  } = useDynamicCollapse({\n    collectionHook,\n    innerContainerSize,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const {\n    onResize: onInstantResize,\n    resetMeasurements: resetInstantMeasurements,\n  } = useInstantCollapse({\n    collectionHook,\n    hasOverflowedItems,\n    innerContainerSize,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const { onResize: onReclaimResize } = useReclaimSpace({\n    collectionHook,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const resizeHandler: ResizeHandler = useCallback(\n    ({\n      scrollHeight,\n      height = scrollHeight,\n      scrollWidth,\n      width = scrollWidth,\n    }) => {\n      const size = orientation === \"horizontal\" ? width : height;\n      if (typeof size === \"number\") {\n        const { innerContainerSize } = measurement.current;\n        const sizeDiff = size - innerContainerSize;\n        // Tiny size diffs seem to be down to the relative sub-pixel innaccuracy of\n        // ResizeObserver vs getBoundingClientRect\n        if (Math.abs(sizeDiff) > 0.5) {\n          measurement.current.innerContainerSize = size;\n          const containerHasGrown = size > innerContainerSize;\n          // Note: any one of these hooks may trigger a render which\n          // may affect the overflow state that the next hook sees.\n          // Hence, they all test for overflow internally and independently.\n          onDynamicResize(size, containerHasGrown);\n          onInstantResize(size, containerHasGrown);\n          onOverflowResize(size, containerHasGrown);\n          onReclaimResize(size, containerHasGrown);\n        }\n      }\n    },\n    [\n      onDynamicResize,\n      onInstantResize,\n      onOverflowResize,\n      onReclaimResize,\n      orientation,\n    ]\n  );\n\n  const measureAndInitialize = useCallback(() => {\n    const { isOverflowing, ...contentWidthAndDepth } = measureContainerOverflow(\n      overflowContainerRef,\n      orientation\n    );\n\n    measurement.current = contentWidthAndDepth;\n    const { innerContainerSize } = contentWidthAndDepth;\n    // TODO check this with complex combinations\n    let handled = resetInstantMeasurements(isOverflowing);\n    if (!handled) {\n      handled = resetDynamicMeasurements();\n      if (!handled) {\n        resetOverflowMeasurements?.(isOverflowing, innerContainerSize);\n      }\n    }\n  }, [\n    orientation,\n    resetInstantMeasurements,\n    resetDynamicMeasurements,\n    resetOverflowMeasurements,\n  ]);\n\n  const switchPriorities = useCallback(\n    (item1: OverflowItem, item2: OverflowItem) => {\n      const { priority: priority1 } = item1;\n      const { priority: priority2 } = item2;\n      if (priority1 !== priority2) {\n        dispatch({\n          type: \"update-items\",\n          overflowItems: [\n            { id: item1.id, priority: priority2 },\n            { id: item2.id, priority: priority1 },\n          ],\n        });\n        // Why do we need a timeout here when we don't inside resizeHandler ?\n        setTimeout(measureAndInitialize, 0);\n      }\n    },\n    [dispatch, measureAndInitialize]\n  );\n\n  // Important that we register our resize handler before we measure and\n  // initialize. The initialization may trigger changes which we want the\n  // resize observer to detect (when we have nested overflowables).\n  useResizeObserver(\n    overflowContainerRef,\n    MONITORED_DIMENSIONS[disableOverflow ? \"none\" : orientation],\n    resizeHandler\n  );\n\n  // This hook runs after a measurememnt cycle, not after every single change to\n  // collection data. The version attribute has been introduced specifically for this.\n  useEffect(() => {\n    if (!disableOverflow) {\n      measureAndInitialize();\n    }\n  }, [collectionVersion, disableOverflow, measureAndInitialize]);\n\n  return [overflowContainerRef, switchPriorities];\n};\n"],"names":["innerContainerSize"],"mappings":"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"}
+{"version":3,"file":"useOverflowLayout.js","sources":["../src/responsive/useOverflowLayout.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from \"react\";\nimport {\n  ElementRef,\n  ManagedListRef,\n  OverflowItem,\n  OverflowLayoutHookProps,\n} from \"./overflowTypes\";\n\nimport { getIsOverflowed, measureContainerOverflow } from \"./overflowUtils\";\nimport { useDynamicCollapse } from \"./useDynamicCollapse\";\nimport { useInstantCollapse } from \"./useInstantCollapse\";\nimport { useOverflow } from \"./useOverflow\";\nimport { useReclaimSpace } from \"./useReclaimSpace\";\nimport { ResizeHandler, useResizeObserver } from \"../responsive\";\n\nconst MONITORED_DIMENSIONS: { [key: string]: string[] } = {\n  horizontal: [\"width\", \"scrollHeight\"],\n  vertical: [\"height\", \"scrollWidth\"],\n  none: [],\n};\n\ntype overflowUpdate = (item1: OverflowItem, item2: OverflowItem) => void;\n\n// we need id, just to be able to assign id to overflowIndicator in useOverflow\nexport const useOverflowLayout = ({\n  collectionHook,\n  id,\n  orientation,\n  label = \"Toolbar\",\n  disableOverflow = false,\n}: OverflowLayoutHookProps): [ElementRef, overflowUpdate] => {\n  const overflowContainerRef: ElementRef = useRef(null);\n  const overflowItemsRef: ManagedListRef = useRef([]);\n  const measurement = useRef({ innerContainerSize: 0, rootContainerDepth: 0 });\n  const { innerContainerSize } = measurement.current;\n\n  const { dispatch, version: collectionVersion } = collectionHook;\n  overflowItemsRef.current = collectionHook.data;\n\n  const {\n    onResize: onOverflowResize,\n    resetMeasurements: resetOverflowMeasurements,\n  } = useOverflow({\n    collectionHook,\n    id,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const hasOverflowedItems = getIsOverflowed(collectionHook.data);\n  // const hasOverflowedItems = getIsOverflowed(managedItems);\n\n  const {\n    onResize: onDynamicResize,\n    resetMeasurements: resetDynamicMeasurements,\n  } = useDynamicCollapse({\n    collectionHook,\n    innerContainerSize,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const {\n    onResize: onInstantResize,\n    resetMeasurements: resetInstantMeasurements,\n  } = useInstantCollapse({\n    collectionHook,\n    hasOverflowedItems,\n    innerContainerSize,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const { onResize: onReclaimResize } = useReclaimSpace({\n    collectionHook,\n    label,\n    overflowItemsRef,\n    orientation,\n    overflowContainerRef,\n  });\n\n  const resizeHandler: ResizeHandler = useCallback(\n    ({\n      scrollHeight,\n      height = scrollHeight,\n      scrollWidth,\n      width = scrollWidth,\n    }) => {\n      const size = orientation === \"horizontal\" ? width : height;\n      if (typeof size === \"number\") {\n        const { innerContainerSize } = measurement.current;\n        const sizeDiff = size - innerContainerSize;\n        // Tiny size diffs seem to be down to the relative sub-pixel innaccuracy of\n        // ResizeObserver vs getBoundingClientRect\n        if (Math.abs(sizeDiff) > 0.5) {\n          measurement.current.innerContainerSize = size;\n          const containerHasGrown = size > innerContainerSize;\n          // Note: any one of these hooks may trigger a render which\n          // may affect the overflow state that the next hook sees.\n          // Hence, they all test for overflow internally and independently.\n          onDynamicResize(size, containerHasGrown);\n          onInstantResize(size, containerHasGrown);\n          onOverflowResize(size, containerHasGrown);\n          onReclaimResize(size, containerHasGrown);\n        }\n      }\n    },\n    [\n      onDynamicResize,\n      onInstantResize,\n      onOverflowResize,\n      onReclaimResize,\n      orientation,\n    ]\n  );\n\n  const measureAndInitialize = useCallback(() => {\n    const { isOverflowing, ...contentWidthAndDepth } = measureContainerOverflow(\n      overflowContainerRef,\n      orientation\n    );\n\n    measurement.current = contentWidthAndDepth;\n    const { innerContainerSize } = contentWidthAndDepth;\n    // TODO check this with complex combinations\n    let handled = resetInstantMeasurements(isOverflowing);\n    if (!handled) {\n      handled = resetDynamicMeasurements();\n      if (!handled) {\n        resetOverflowMeasurements?.(isOverflowing, innerContainerSize);\n      }\n    }\n  }, [\n    orientation,\n    resetInstantMeasurements,\n    resetDynamicMeasurements,\n    resetOverflowMeasurements,\n  ]);\n\n  const switchPriorities = useCallback(\n    (item1: OverflowItem, item2: OverflowItem) => {\n      const { priority: priority1 } = item1;\n      const { priority: priority2 } = item2;\n      if (priority1 !== priority2) {\n        dispatch({\n          type: \"update-items\",\n          overflowItems: [\n            { id: item1.id, priority: priority2 },\n            { id: item2.id, priority: priority1 },\n          ],\n        });\n        // Why do we need a timeout here when we don't inside resizeHandler ?\n        setTimeout(measureAndInitialize, 0);\n      }\n    },\n    [dispatch, measureAndInitialize]\n  );\n\n  // Important that we register our resize handler before we measure and\n  // initialize. The initialization may trigger changes which we want the\n  // resize observer to detect (when we have nested overflowables).\n  useResizeObserver(\n    overflowContainerRef,\n    MONITORED_DIMENSIONS[disableOverflow ? \"none\" : orientation],\n    resizeHandler\n  );\n\n  // This hook runs after a measurememnt cycle, not after every single change to\n  // collection data. The version attribute has been introduced specifically for this.\n  useEffect(() => {\n    if (!disableOverflow) {\n      measureAndInitialize();\n    }\n  }, [collectionVersion, disableOverflow, measureAndInitialize]);\n\n  return [overflowContainerRef, switchPriorities];\n};\n"],"names":["innerContainerSize"],"mappings":"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"}

package/dist-es/tabs/useActivationIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"useActivationIndicator.js","sources":["../src/tabs/useActivationIndicator.ts"],"sourcesContent":["import { RefObject, useCallback, useEffect, useRef, useState } from \"react\";\nimport { orientationType } from \"../responsive\";\nimport { useResizeObserver, WidthOnly } from \"../responsive\";\n\ntype activationIndicatorStyles = {\n  height?: number;\n  left?: number;\n  top?: number;\n  width?: number;\n  hasChanged?: boolean;\n};\n\nconst MEASUREMENTS = {\n  horizontal: {\n    pos: \"left\" as keyof activationIndicatorStyles,\n    size: \"width\" as keyof activationIndicatorStyles,\n  },\n  vertical: {\n    pos: \"top\" as keyof activationIndicatorStyles,\n    size: \"height\" as keyof activationIndicatorStyles,\n  },\n};\n\n// Overflow can affect tab positions, so we recalculate when it changes\nexport function useActivationIndicator({\n  rootRef,\n  tabId,\n  orientation,\n}: {\n  rootRef: RefObject<HTMLDivElement | null>;\n  tabId?: string | null;\n  orientation: orientationType;\n}): activationIndicatorStyles {\n  const [style, setStyle] = useState<activationIndicatorStyles>({\n    left: 0,\n    width: 0,\n  });\n  // Keep style in a ref, so style is not a dependency for createIndicatorStyle, which in turn\n  // means our useEffect below will re-run only when the tab changes, not after every style change\n  // as well.\n\n  const styleRef = useRef(style);\n\n  const getTabPos = useCallback(() => {\n    const { pos, size } = MEASUREMENTS[orientation];\n    return [pos, size];\n  }, [orientation]);\n\n  const createIndicatorStyle = useCallback(\n    (tabElement: HTMLElement | null): activationIndicatorStyles => {\n      if (tabElement) {\n        const tabRect = tabElement.getBoundingClientRect() as any;\n        if (rootRef.current && tabRect) {\n          const rootRect = rootRef.current.getBoundingClientRect() as any;\n          const [pos, size] = getTabPos();\n          const { [pos]: existingPos, [size]: existingSize } = styleRef.current;\n          const newPos = tabRect[pos] - rootRect[pos];\n          const newSize = tabRect[size];\n\n          return {\n            [pos]: newPos,\n            [size]: newSize,\n            hasChanged: newPos !== existingPos || newSize !== existingSize,\n          };\n        }\n      }\n      return {};\n    },\n    [orientation, rootRef]\n  );\n\n  const onResize = useCallback(() => {\n    requestAnimationFrame(() => {\n      if (tabId) {\n        const tabEl = document.getElementById(tabId);\n        const { hasChanged, ...newStyle } = createIndicatorStyle(tabEl);\n        if (hasChanged) {\n          setStyle(newStyle);\n        }\n      }\n    });\n  }, [createIndicatorStyle, tabId]);\n\n  useEffect(() => {\n    if (tabId) {\n      // The timeout is employed in case selectedTab has been selected from\n      // overflow menu. In this case, the tab is only restored to visibility\n      // in the render cycle after selection.\n      setTimeout(() => {\n        const tabEl = document.getElementById(tabId);\n        const { hasChanged, ...newStyle } = createIndicatorStyle(tabEl);\n        if (hasChanged) {\n          setStyle((styleRef.current = newStyle));\n        }\n      }, 50);\n    }\n  }, [createIndicatorStyle, tabId]);\n\n  useResizeObserver(rootRef, WidthOnly, onResize);\n\n  return style;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useActivationIndicator.js","sources":["../src/tabs/useActivationIndicator.ts"],"sourcesContent":["import { RefObject, useCallback, useEffect, useRef, useState } from \"react\";\nimport { orientationType, useResizeObserver, WidthOnly } from \"../responsive\";\n\ntype activationIndicatorStyles = {\n  height?: number;\n  left?: number;\n  top?: number;\n  width?: number;\n  hasChanged?: boolean;\n};\n\nconst MEASUREMENTS = {\n  horizontal: {\n    pos: \"left\" as keyof activationIndicatorStyles,\n    size: \"width\" as keyof activationIndicatorStyles,\n  },\n  vertical: {\n    pos: \"top\" as keyof activationIndicatorStyles,\n    size: \"height\" as keyof activationIndicatorStyles,\n  },\n};\n\n// Overflow can affect tab positions, so we recalculate when it changes\nexport function useActivationIndicator({\n  rootRef,\n  tabId,\n  orientation,\n}: {\n  rootRef: RefObject<HTMLDivElement | null>;\n  tabId?: string | null;\n  orientation: orientationType;\n}): activationIndicatorStyles {\n  const [style, setStyle] = useState<activationIndicatorStyles>({\n    left: 0,\n    width: 0,\n  });\n  // Keep style in a ref, so style is not a dependency for createIndicatorStyle, which in turn\n  // means our useEffect below will re-run only when the tab changes, not after every style change\n  // as well.\n\n  const styleRef = useRef(style);\n\n  const getTabPos = useCallback(() => {\n    const { pos, size } = MEASUREMENTS[orientation];\n    return [pos, size];\n  }, [orientation]);\n\n  const createIndicatorStyle = useCallback(\n    (tabElement: HTMLElement | null): activationIndicatorStyles => {\n      if (tabElement) {\n        const tabRect = tabElement.getBoundingClientRect() as any;\n        if (rootRef.current && tabRect) {\n          const rootRect = rootRef.current.getBoundingClientRect() as any;\n          const [pos, size] = getTabPos();\n          const { [pos]: existingPos, [size]: existingSize } = styleRef.current;\n          const newPos = tabRect[pos] - rootRect[pos];\n          const newSize = tabRect[size];\n\n          return {\n            [pos]: newPos,\n            [size]: newSize,\n            hasChanged: newPos !== existingPos || newSize !== existingSize,\n          };\n        }\n      }\n      return {};\n    },\n    [orientation, rootRef]\n  );\n\n  const onResize = useCallback(() => {\n    requestAnimationFrame(() => {\n      if (tabId) {\n        const tabEl = document.getElementById(tabId);\n        const { hasChanged, ...newStyle } = createIndicatorStyle(tabEl);\n        if (hasChanged) {\n          setStyle(newStyle);\n        }\n      }\n    });\n  }, [createIndicatorStyle, tabId]);\n\n  useEffect(() => {\n    if (tabId) {\n      // The timeout is employed in case selectedTab has been selected from\n      // overflow menu. In this case, the tab is only restored to visibility\n      // in the render cycle after selection.\n      setTimeout(() => {\n        const tabEl = document.getElementById(tabId);\n        const { hasChanged, ...newStyle } = createIndicatorStyle(tabEl);\n        if (hasChanged) {\n          setStyle((styleRef.current = newStyle));\n        }\n      }, 50);\n    }\n  }, [createIndicatorStyle, tabId]);\n\n  useResizeObserver(rootRef, WidthOnly, onResize);\n\n  return style;\n}\n"],"names":[],"mappings":"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"}

package/dist-es/tabs-next/TabNext.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Class applied to root Tab element */\n.saltTabNext {\n  align-items: center;\n  justify-content: center;\n  appearance: none;\n  display: inline-flex;\n  background: var(--salt-navigable-primary-background);\n  border: 0 solid transparent;\n  border-radius: 0;\n  white-space: pre;\n  min-width: 4em;\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-inline: var(--salt-spacing-100);\n  padding-block: var(--salt-spacing-50);\n  position: relative;\n  flex-shrink: 0;\n\n  color: var(--salt-text-secondary-foreground);\n  font-weight: var(--salt-navigable-fontWeight);\n  font-family: var(--salt-text-fontFamily);\n  text-align: var(--salt-text-textAlign);\n  letter-spacing: var(--salt-text-letterSpacing);\n  line-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n}\n\n.saltTabNext:hover {\n  cursor: var(--salt-navigable-cursor-hover);\n  background: var(--salt-navigable-primary-background-hover);\n  color: var(--salt-text-primary-foreground);\n}\n\n.saltTabNext:hover::before,\n.saltTabNext:focus-visible::before {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  height: var(--salt-size-bar);\n  background: var(--salt-navigable-indicator-hover);\n}\n\n.saltTabNext:focus-visible {\n  outline: var(--salt-focused-outline);\n  background: var(--salt-navigable-primary-background-hover);\n  color: var(--salt-text-primary-foreground);\n}\n\n.saltTabNext[aria-selected=\"true\"] {\n  color: var(--salt-text-primary-foreground);\n}\n\n.saltTabNext[aria-selected=\"true\"]::after {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  height: var(--salt-size-bar);\n  background: var(--salt-navigable-indicator-active);\n}\n\n.saltTabNext:disabled {\n  cursor: var(--salt-navigable-cursor-disabled);\n  color: var(--salt-text-primary-foreground-disabled);\n  background: var(--salt-navigable-primary-background);\n}\n\n.saltTabNext:disabled:before {\n  background: transparent;\n}\n";
+var css_248z = "/* Class applied to root Tab element */\n.saltTabNext {\n  align-items: center;\n  justify-content: center;\n  appearance: none;\n  -webkit-appearance: none;\n  display: inline-flex;\n  background: var(--salt-navigable-primary-background);\n  border: 0 solid transparent;\n  border-radius: 0;\n  white-space: pre;\n  min-width: 4em;\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding: var(--salt-spacing-50) var(--salt-spacing-100);\n  position: relative;\n  flex-shrink: 0;\n\n  color: var(--salt-text-secondary-foreground);\n  font-weight: var(--salt-navigable-fontWeight);\n  font-family: var(--salt-text-fontFamily);\n  text-align: var(--salt-text-textAlign);\n  letter-spacing: var(--salt-text-letterSpacing);\n  line-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n}\n\n.saltTabNext:hover {\n  cursor: var(--salt-navigable-cursor-hover);\n  background: var(--salt-navigable-primary-background-hover);\n  color: var(--salt-text-primary-foreground);\n}\n\n.saltTabNext:hover::before,\n.saltTabNext:focus-visible::before {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  height: var(--salt-size-bar);\n  background: var(--salt-navigable-indicator-hover);\n}\n\n.saltTabNext:focus-visible {\n  outline: var(--salt-focused-outline);\n  background: var(--salt-navigable-primary-background-hover);\n  color: var(--salt-text-primary-foreground);\n}\n\n.saltTabNext[aria-selected=\"true\"] {\n  color: var(--salt-text-primary-foreground);\n}\n\n.saltTabNext[aria-selected=\"true\"]::after {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  height: var(--salt-size-bar);\n  background: var(--salt-navigable-indicator-active);\n}\n\n.saltTabNext:disabled {\n  cursor: var(--salt-navigable-cursor-disabled);\n  color: var(--salt-text-primary-foreground-disabled);\n  background: var(--salt-navigable-primary-background);\n}\n\n.saltTabNext:disabled:before {\n  background: transparent;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=TabNext.css.js.map

package/dist-types/combo-box-next/ComboBoxNext.d.ts

@@ -1,13 +1,8 @@
-import { ComponentPropsWithoutRef, FocusEvent, KeyboardEvent, ReactElement, Ref, SyntheticEvent } from "react";
-import { InputProps } from "@salt-ds/core";
+import { ComponentPropsWithoutRef, ReactElement, Ref, SyntheticEvent } from "react";
 import { ListNextProps } from "../list-next";
 import { ComboBoxItemProps } from "./utils";
 import { UseComboBoxPortalProps } from "./useComboboxPortal";
-export interface ComboBoxNextProps<T> extends Omit<ComponentPropsWithoutRef<"input">, "onChange"> {
-    /**
-     * Additional props for the input component.
-     */
-    InputProps?: InputProps;
+export interface ComboBoxNextProps<T> extends Omit<ComponentPropsWithoutRef<"input">, "onChange" | "onSelect"> {
     /**
      * Additional props for the list component.
      */
@@ -17,36 +12,38 @@ export interface ComboBoxNextProps<T> extends Omit<ComponentPropsWithoutRef<"inp
      */
     PortalProps?: UseComboBoxPortalProps;
     /**
-     * If `true`, the component will be disabled.
+     * Controlled prop. Controls the Input value in the Combo Box Input.
+     */
+    inputValue?: string;
+    /**
+     * Controlled prop. Controls the Highlighted item in the Combo Box list.
      */
-    disabled: boolean;
     highlightedItem?: string;
-    selected?: string;
-    defaultSelected?: string;
     /**
-     * The source of combobox items.
+     * Controlled prop. Controls the Selected value in the Combo Box list.
      */
-    source: T[];
+    selected?: string;
     /**
-     * Callback for blur event
+     * Initial input value for when the list is uncontrolled.
      */
-    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    defaultInputValue?: string;
     /**
-     * Callback for focus event
+     * Initial selected value for when the list is uncontrolled.
      */
-    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+    defaultSelected?: string;
     /**
-     * Callback for keyDown event
+     * If `true`, the component will be disabled.
      */
-    onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;
+    disabled?: boolean;
     /**
-     * Callback for mouse over event
+     * Styling variant. Defaults to "primary".
      */
-    onMouseOver?: (event: SyntheticEvent) => void;
+    variant?: "primary" | "secondary";
     /**
-     * Optional ref for the input component
+    /**
+     * The source of combobox items.
      */
-    inputRef?: Ref<HTMLInputElement>;
+    source: T[];
     /**
      * Optional ref for the list component
      */
@@ -54,17 +51,33 @@ export interface ComboBoxNextProps<T> extends Omit<ComponentPropsWithoutRef<"inp
     /**
      * The component used for item instead of the default.
      */
-    ListItem: (props: ComboBoxItemProps<T>) => ReactElement<ComboBoxItemProps<T>>;
+    ListItem?: (props: ComboBoxItemProps<T>) => ReactElement<ComboBoxItemProps<T>>;
     /**
      * Function to be used as filter.
      */
     itemFilter?: (source: T[], filterValue?: string) => T[];
-    onChange?: (event: SyntheticEvent, data: {
+    /**
+     * Callback for mouse over event
+     */
+    onMouseOver?: (event: SyntheticEvent) => void;
+    /**
+     * Callback for list selection event
+     */
+    onSelect?: (event: SyntheticEvent, data: {
         value: string;
     }) => void;
     /**
-     * Styling variant. Defaults to "primary".
+    /**
+     * Callback for list change event
      */
-    variant?: "primary" | "secondary";
+    onListChange?: (event: SyntheticEvent, data: {
+        value: string | undefined;
+    }) => void;
+    /**
+     * Callback for input change event
+     */
+    onChange?: (event: SyntheticEvent, data: {
+        value: string;
+    }) => void;
 }
 export declare const ComboBoxNext: import("react").ForwardRefExoticComponent<ComboBoxNextProps<unknown> & import("react").RefAttributes<HTMLInputElement>>;

package/dist-types/combo-box-next/useComboBox.d.ts

@@ -2,6 +2,8 @@ import { FocusEvent, KeyboardEvent, SyntheticEvent } from "react";
 import { UseListProps } from "../list-next/useList";
 import { UseComboBoxPortalProps } from "./useComboboxPortal";
 interface UseComboBoxProps {
+    inputValue?: string;
+    defaultInputValue?: string;
     onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
     onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
     onMouseOver?: (event: SyntheticEvent) => void;
@@ -9,7 +11,9 @@ interface UseComboBoxProps {
     PortalProps?: UseComboBoxPortalProps;
     listProps: UseListProps;
 }
-export declare const useComboBox: ({ onFocus, onBlur, onMouseOver, onKeyDown, PortalProps, listProps, }: UseComboBoxProps) => {
+export declare const useComboBox: ({ defaultInputValue, onFocus, onBlur, onMouseOver, onKeyDown, inputValue: inputValueProp, PortalProps, listProps, }: UseComboBoxProps) => {
+    inputValue: string | undefined;
+    setInputValue: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
     portalProps: {
         open: boolean;
         setOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
@@ -18,8 +22,6 @@ export declare const useComboBox: ({ onFocus, onBlur, onMouseOver, onKeyDown, Po
         getTriggerProps: () => Record<string, unknown>;
         getPortalProps: () => import("react").HTMLProps<HTMLDivElement>;
     };
-    inputValue: string | undefined;
-    setInputValue: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
     selectedItem: string | undefined;
     setSelectedItem: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
     highlightedItem: string | undefined;

package/dist-types/combo-box-next/utils.d.ts

@@ -5,4 +5,4 @@ export interface ComboBoxItemProps<T> extends Omit<ListItemNextProps, "value"> {
     value: T;
     matchPattern?: RegExp | string;
 }
-export declare const DefaultListItem: ({ value, matchPattern, onMouseDown, ...rest }: ComboBoxItemProps<string>) => JSX.Element;
+export declare const DefaultListItem: import("react").ForwardRefExoticComponent<ComboBoxItemProps<string> & import("react").RefAttributes<unknown>>;

package/dist-types/dropdown-next/DropdownNext.d.ts

@@ -1,8 +1,7 @@
 import { ListNextProps } from "../list-next";
-import { UseFloatingUIProps } from "@salt-ds/core";
-import { HTMLAttributes, Ref } from "react";
+import { Ref, SyntheticEvent, ComponentPropsWithoutRef } from "react";
 import { Placement } from "@floating-ui/react";
-export interface DropdownNextProps extends Pick<UseFloatingUIProps, "open" | "onOpenChange" | "placement">, HTMLAttributes<HTMLButtonElement> {
+export interface DropdownNextProps extends Omit<ComponentPropsWithoutRef<"button">, "onSelect"> {
     /**
      * If `true`, dropdown will be disabled.
      */
@@ -36,6 +35,14 @@ export interface DropdownNextProps extends Pick<UseFloatingUIProps, "open" | "on
      */
     ListProps?: ListNextProps;
     open?: boolean;
+    /**
+     * Callback for list selection event
+     */
+    onSelect?: (event: SyntheticEvent, data: {
+        value: string;
+    }) => void;
+    /**
+    /* Selected prop for use in controlled component. */
     selected?: string;
     highlightedItem?: string;
 }

package/dist-types/list-next/ListNext.d.ts

@@ -1,5 +1,5 @@
 import { ComponentPropsWithoutRef, SyntheticEvent } from "react";
-export interface ListNextProps extends Omit<ComponentPropsWithoutRef<"ul">, "onChange"> {
+export interface ListNextProps extends Omit<ComponentPropsWithoutRef<"ul">, "onChange" | "onSelect"> {
     /**
      * If true, all items in list will be disabled.
      */
@@ -8,6 +8,9 @@ export interface ListNextProps extends Omit<ComponentPropsWithoutRef<"ul">, "onC
     highlightedItem?: string;
     selected?: string;
     onChange?: (event: SyntheticEvent, data: {
+        value: string | undefined;
+    }) => void;
+    onSelect?: (event: SyntheticEvent, data: {
         value: string;
     }) => void;
     defaultSelected?: string;

package/dist-types/list-next/useList.d.ts

@@ -8,12 +8,15 @@ export interface UseListProps {
     selected?: string;
     defaultSelected?: string;
     onChange?: (e: SyntheticEvent, data: {
+        value: string | undefined;
+    }) => void;
+    onSelect?: (e: SyntheticEvent, data: {
         value: string;
     }) => void;
     id?: string;
     ref: RefObject<HTMLUListElement>;
 }
-export declare const useList: ({ disabled, highlightedItem: highLightedItemProp, selected: selectedProp, defaultSelected, onChange, id, ref, }: UseListProps) => {
+export declare const useList: ({ disabled, highlightedItem: highlightedItemProp, selected: selectedProp, defaultSelected, onChange, onSelect, id, ref, }: UseListProps) => {
     focusHandler: (event: FocusEvent<HTMLUListElement | HTMLElement>) => void;
     keyDownHandler: (event: KeyboardEvent<HTMLElement>) => void;
     blurHandler: () => void;

package/dist-types/navigation-item/ConditionalWrapper.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from "react";
+import { NavigationItemProps } from "./NavigationItem";
+interface ConditionalWrapperProps extends Pick<NavigationItemProps, "parent" | "expanded" | "onExpand" | "active" | "href"> {
+    children: ReactNode;
+    className: string;
+}
+export declare const ConditionalWrapper: ({ children, className, parent, expanded, onExpand, active, href, }: ConditionalWrapperProps) => JSX.Element;
+export {};

package/dist-types/navigation-item/NavigationItem.d.ts

@@ -5,9 +5,9 @@ export interface NavigationItemProps extends ComponentPropsWithoutRef<"div"> {
      */
     active?: boolean;
     /**
-     * Whether the parent navigation item has active nested items.
+     * Whether the nested group is collapsed and there is an active nested item within it.
      */
-    blurSelected?: boolean;
+    blurActive?: boolean;
     /**
      * Whether the navigation item is expanded.
      */

package/package.json

@@ -1,9 +1,36 @@
 {
   "name": "@salt-ds/lab",
-  "version": "1.0.0-alpha.16",
+  "version": "1.0.0-alpha.17",
   "license": "Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/jpmorganchase/salt-ds.git",
+    "directory": "packages/lab"
+  },
+  "bugs": "https://github.com/jpmorganchase/salt-ds/issues",
   "main": "dist-cjs/index.js",
   "sideEffects": false,
+  "dependencies": {
+    "@floating-ui/react": "^0.23.0",
+    "@fluentui/react-overflow": "^9.0.19",
+    "@internationalized/date": "^3.0.0",
+    "@types/react-window": "^1.8.2",
+    "aria-hidden": "^1.1.1",
+    "attr-accept": "^2.0.0",
+    "clipboard-copy": "^4.0.1",
+    "clsx": "^2.0.0",
+    "compute-scroll-into-view": "^3.0.0",
+    "deepmerge": "^4.2.2",
+    "no-scroll": "^2.1.1",
+    "react-color": "^2.19.3",
+    "react-window": "^1.8.6",
+    "rifm": "^0.12.0",
+    "tinycolor2": "^1.4.2",
+    "@salt-ds/core": "^1.8.2",
+    "@salt-ds/window": "^0.1.1",
+    "@salt-ds/styles": "^0.1.1",
+    "@salt-ds/icons": "^1.7.0"
+  },
   "peerDependencies": {
     "@types/react": ">=16.14.0",
     "react": ">=16.14.0",
@@ -20,35 +47,10 @@
   },
   "module": "dist-es/index.js",
   "typings": "dist-types/index.d.ts",
-  "dependencies": {
-    "@salt-ds/core": "^1.8.1",
-    "clsx": "^2.0.0",
-    "react-window": "^1.8.6",
-    "compute-scroll-into-view": "^3.0.0",
-    "@salt-ds/window": "^0.1.1",
-    "@salt-ds/styles": "^0.1.1",
-    "@salt-ds/icons": "^1.6.0",
-    "@floating-ui/react": "^0.23.0",
-    "@internationalized/date": "^3.0.0",
-    "tinycolor2": "^1.4.2",
-    "react-color": "^2.19.3",
-    "deepmerge": "^4.2.2",
-    "clipboard-copy": "^4.0.1",
-    "attr-accept": "^2.0.0",
-    "rifm": "^0.12.0",
-    "aria-hidden": "^1.1.1",
-    "no-scroll": "^2.1.1",
-    "@fluentui/react-overflow": "^9.0.19"
-  },
   "files": [
     "dist-cjs",
     "dist-es",
     "dist-types",
     "README.md"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/jpmorganchase/salt-ds",
-    "directory": "packages/lab"
-  }
+  ]
 }