@backstage/ui 0.15.1-next.0 → 0.16.0

package/dist/components/Tabs/TabsIndicators.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabsIndicators.esm.js","sources":["../../../src/components/Tabs/TabsIndicators.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { TabListStateContext } from 'react-aria-components';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { TabsIndicatorsDefinition } from './definition';\nimport { useContext, useEffect, useCallback, useRef } from 'react';\nimport type { TabsIndicatorsProps } from './types';\n\n/**\n * A component that renders the indicators for the toolbar.\n *\n * @internal\n */\nexport const TabsIndicators = (props: TabsIndicatorsProps) => {\n  const { ownProps } = useDefinition(TabsIndicatorsDefinition, props);\n  const { classes, tabRefs, tabsRef, hoveredKey, prevHoveredKey } = ownProps;\n  const state = useContext(TabListStateContext);\n  const prevSelectedKey = useRef<string | null>(null);\n\n  const updateCSSVariables = useCallback(() => {\n    // When rendered inside CollectionBuilder's hidden tree (for collection\n    // building), there is no TabListStateContext provider, so state is null.\n    // Bail out to avoid overwriting CSS variables on the shared tabsRef DOM\n    // element that the real instance also writes to.\n    if (state == null) return;\n\n    if (!tabsRef.current) return;\n\n    const tabsRect = tabsRef.current.getBoundingClientRect();\n\n    // Set active tab variables\n    if (state?.selectedKey != null && state.selectedKey !== '') {\n      const activeTab = tabRefs.current.get(state.selectedKey.toString());\n\n      if (activeTab) {\n        const activeRect = activeTab.getBoundingClientRect();\n        const relativeLeft = activeRect.left - tabsRect.left;\n        const relativeTop = activeRect.top - tabsRect.top;\n\n        // Control transition timing based on whether this is the first time setting active tab\n        const isFirstActiveTab = prevSelectedKey.current === null;\n\n        if (isFirstActiveTab) {\n          // First time setting active tab: no transitions for position\n          tabsRef.current.style.setProperty(\n            '--active-transition-duration',\n            '0s',\n          );\n          // Enable transitions on next frame for future tab switches\n          requestAnimationFrame(() => {\n            if (tabsRef.current) {\n              tabsRef.current.style.setProperty(\n                '--active-transition-duration',\n                '0.25s',\n              );\n            }\n          });\n        } else {\n          // Switching between tabs: full transitions\n          tabsRef.current.style.setProperty(\n            '--active-transition-duration',\n            '0.25s',\n          );\n        }\n\n        // Update previous selected key for next time\n        prevSelectedKey.current = state.selectedKey.toString();\n\n        tabsRef.current.style.setProperty(\n          '--active-tab-left',\n          `${relativeLeft}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-right',\n          `${relativeLeft + activeRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-top',\n          `${relativeTop}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-bottom',\n          `${relativeTop + activeRect.height}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-width',\n          `${activeRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-height',\n          `${activeRect.height}px`,\n        );\n        tabsRef.current.style.setProperty('--active-tab-opacity', '1');\n      }\n    } else {\n      tabsRef.current.style.setProperty('--active-tab-opacity', '0');\n      prevSelectedKey.current = null;\n    }\n\n    // Set hovered tab variables\n    if (hoveredKey) {\n      const hoveredTab = tabRefs.current.get(hoveredKey);\n      if (hoveredTab) {\n        const hoveredRect = hoveredTab.getBoundingClientRect();\n        const relativeLeft = hoveredRect.left - tabsRect.left;\n        const relativeTop = hoveredRect.top - tabsRect.top;\n\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-left',\n          `${relativeLeft}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-right',\n          `${relativeLeft + hoveredRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-top',\n          `${relativeTop}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-bottom',\n          `${relativeTop + hoveredRect.height}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-width',\n          `${hoveredRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-height',\n          `${hoveredRect.height}px`,\n        );\n        // Control transition timing based on whether this is a new hover session\n        const isNewHoverSession = prevHoveredKey.current === null;\n\n        if (isNewHoverSession) {\n          // Starting new hover session: no transitions for position\n          tabsRef.current.style.setProperty(\n            '--hovered-transition-duration',\n            '0s',\n          );\n          // Enable transitions on next frame for future tab switches\n          requestAnimationFrame(() => {\n            if (tabsRef.current) {\n              tabsRef.current.style.setProperty(\n                '--hovered-transition-duration',\n                '0.2s',\n              );\n            }\n          });\n        } else {\n          // Moving between tabs in same session: full transitions\n          tabsRef.current.style.setProperty(\n            '--hovered-transition-duration',\n            '0.2s',\n          );\n        }\n\n        // Update previous hover key for next time\n        prevHoveredKey.current = hoveredKey;\n\n        tabsRef.current.style.setProperty('--hovered-tab-opacity', '1');\n      }\n    } else {\n      // When not hovering, hide with opacity and reset for next hover session\n      tabsRef.current.style.setProperty('--hovered-tab-opacity', '0');\n\n      // Reset previous hover key so next hover is treated as new session\n      prevHoveredKey.current = null;\n    }\n  }, [state?.selectedKey, hoveredKey, tabRefs.current]);\n\n  useEffect(() => {\n    updateCSSVariables();\n  }, [updateCSSVariables, tabRefs.current.size]);\n\n  useEffect(() => {\n    const handleResize = () => updateCSSVariables();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [updateCSSVariables]);\n\n  return (\n    <>\n      <div className={classes.root} />\n      <div className={classes.hovered} />\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TabsIndicators.esm.js","sources":["../../../src/components/Tabs/TabsIndicators.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { TabListStateContext } from 'react-aria-components';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { TabsIndicatorsDefinition } from './definition';\nimport { useContext, useEffect, useCallback, useRef } from 'react';\nimport type { TabsIndicatorsProps } from './types';\n\n/**\n * A component that renders the indicators for the toolbar.\n *\n * @internal\n */\nexport const TabsIndicators = (props: TabsIndicatorsProps) => {\n  const { ownProps } = useDefinition(TabsIndicatorsDefinition, props);\n  const { classes, tabRefs, tabsRef, hoveredKey, prevHoveredKey } = ownProps;\n  const state = useContext(TabListStateContext);\n  const prevSelectedKey = useRef<string | null>(null);\n\n  const updateCSSVariables = useCallback(\n    (animate = true) => {\n      // When rendered inside CollectionBuilder's hidden tree (for collection\n      // building), there is no TabListStateContext provider, so state is null.\n      // Bail out to avoid overwriting CSS variables on the shared tabsRef DOM\n      // element that the real instance also writes to.\n      if (state == null) return;\n\n      if (!tabsRef.current) return;\n\n      const tabsRect = tabsRef.current.getBoundingClientRect();\n\n      // Set active tab variables\n      if (state?.selectedKey != null && state.selectedKey !== '') {\n        const activeTab = tabRefs.current.get(state.selectedKey.toString());\n\n        if (activeTab) {\n          const activeRect = activeTab.getBoundingClientRect();\n          const relativeLeft = activeRect.left - tabsRect.left;\n          const relativeTop = activeRect.top - tabsRect.top;\n\n          // Control transition timing based on whether this is the first time setting active tab\n          const isFirstActiveTab = prevSelectedKey.current === null;\n\n          if (isFirstActiveTab || !animate) {\n            // First time setting active tab or non-animated reposition (e.g.\n            // tab resize): no transitions for position\n            tabsRef.current.style.setProperty(\n              '--active-transition-duration',\n              '0s',\n            );\n            // Enable transitions on next frame for future tab switches, unless\n            // more non-animated updates may follow (e.g. a resize in progress)\n            if (animate) {\n              requestAnimationFrame(() => {\n                if (tabsRef.current) {\n                  tabsRef.current.style.setProperty(\n                    '--active-transition-duration',\n                    '0.25s',\n                  );\n                }\n              });\n            }\n          } else {\n            // Switching between tabs: full transitions\n            tabsRef.current.style.setProperty(\n              '--active-transition-duration',\n              '0.25s',\n            );\n          }\n\n          // Update previous selected key for next time\n          prevSelectedKey.current = state.selectedKey.toString();\n\n          tabsRef.current.style.setProperty(\n            '--active-tab-left',\n            `${relativeLeft}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--active-tab-right',\n            `${relativeLeft + activeRect.width}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--active-tab-top',\n            `${relativeTop}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--active-tab-bottom',\n            `${relativeTop + activeRect.height}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--active-tab-width',\n            `${activeRect.width}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--active-tab-height',\n            `${activeRect.height}px`,\n          );\n          tabsRef.current.style.setProperty('--active-tab-opacity', '1');\n        }\n      } else {\n        tabsRef.current.style.setProperty('--active-tab-opacity', '0');\n        prevSelectedKey.current = null;\n      }\n\n      // Set hovered tab variables\n      if (hoveredKey) {\n        const hoveredTab = tabRefs.current.get(hoveredKey);\n        if (hoveredTab) {\n          const hoveredRect = hoveredTab.getBoundingClientRect();\n          const relativeLeft = hoveredRect.left - tabsRect.left;\n          const relativeTop = hoveredRect.top - tabsRect.top;\n\n          tabsRef.current.style.setProperty(\n            '--hovered-tab-left',\n            `${relativeLeft}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--hovered-tab-right',\n            `${relativeLeft + hoveredRect.width}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--hovered-tab-top',\n            `${relativeTop}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--hovered-tab-bottom',\n            `${relativeTop + hoveredRect.height}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--hovered-tab-width',\n            `${hoveredRect.width}px`,\n          );\n          tabsRef.current.style.setProperty(\n            '--hovered-tab-height',\n            `${hoveredRect.height}px`,\n          );\n          // Control transition timing based on whether this is a new hover session\n          const isNewHoverSession = prevHoveredKey.current === null;\n\n          if (isNewHoverSession || !animate) {\n            // Starting new hover session or non-animated reposition (e.g. tab\n            // resize): no transitions for position\n            tabsRef.current.style.setProperty(\n              '--hovered-transition-duration',\n              '0s',\n            );\n            // Enable transitions on next frame for future tab switches, unless\n            // more non-animated updates may follow (e.g. a resize in progress)\n            if (animate) {\n              requestAnimationFrame(() => {\n                if (tabsRef.current) {\n                  tabsRef.current.style.setProperty(\n                    '--hovered-transition-duration',\n                    '0.2s',\n                  );\n                }\n              });\n            }\n          } else {\n            // Moving between tabs in same session: full transitions\n            tabsRef.current.style.setProperty(\n              '--hovered-transition-duration',\n              '0.2s',\n            );\n          }\n\n          // Update previous hover key for next time\n          prevHoveredKey.current = hoveredKey;\n\n          tabsRef.current.style.setProperty('--hovered-tab-opacity', '1');\n        }\n      } else {\n        // When not hovering, hide with opacity and reset for next hover session\n        tabsRef.current.style.setProperty('--hovered-tab-opacity', '0');\n\n        // Reset previous hover key so next hover is treated as new session\n        prevHoveredKey.current = null;\n      }\n    },\n    [state?.selectedKey, hoveredKey, tabRefs.current],\n  );\n\n  useEffect(() => {\n    updateCSSVariables();\n  }, [updateCSSVariables, tabRefs.current.size]);\n\n  useEffect(() => {\n    const handleResize = () => updateCSSVariables(false);\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [updateCSSVariables]);\n\n  useEffect(() => {\n    // ResizeObserver is not available in some environments (e.g. Jest/jsdom)\n    if (typeof ResizeObserver === 'undefined') {\n      return undefined;\n    }\n\n    let frame: number | null = null;\n    const scheduleUpdate = () => {\n      if (frame !== null) {\n        return;\n      }\n\n      frame = requestAnimationFrame(() => {\n        frame = null;\n        updateCSSVariables(false);\n      });\n    };\n\n    const resizeObserver = new ResizeObserver(scheduleUpdate);\n    const observeTabs = () => {\n      resizeObserver.disconnect();\n      for (const tab of tabRefs.current.values()) {\n        resizeObserver.observe(tab);\n      }\n    };\n    observeTabs();\n\n    // Tab elements can be added, removed, or replaced without this component\n    // re-rendering, so watch the DOM to keep the observed set in sync.\n    const mutationObserver = new MutationObserver(() => {\n      observeTabs();\n      scheduleUpdate();\n    });\n\n    if (tabsRef.current) {\n      mutationObserver.observe(tabsRef.current, {\n        childList: true,\n        subtree: true,\n      });\n    }\n\n    return () => {\n      if (frame !== null) {\n        cancelAnimationFrame(frame);\n      }\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n    };\n  }, [updateCSSVariables, tabRefs, tabsRef]);\n\n  return (\n    <>\n      <div className={classes.root} />\n      <div className={classes.hovered} />\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/css/styles.css

@@ -234,10 +234,10 @@
 
     /* Neutral background colors */
     --bui-bg-app: #333333;
-    --bui-bg-neutral-1: #1a1a1a;
-    --bui-bg-neutral-2: #282828;
-    --bui-bg-neutral-3: #393939;
-    --bui-bg-neutral-4: #474747;
+    --bui-bg-neutral-1: #424141;
+    --bui-bg-neutral-2: #504f4f;
+    --bui-bg-neutral-3: #5c5c5c;
+    --bui-bg-neutral-4: #676767;
 
     /* Foreground colors */
     --bui-fg-primary: var(--bui-white);

package/dist/hooks/useCollectionAdapter.esm.js

@@ -0,0 +1,67 @@
+import { useRef } from 'react';
+import { isAsyncListSource, getItemKeys } from '../utils/selectableCollection.esm.js';
+
+function useCollectionAdapter({
+  items,
+  selectedKeys = [],
+  search,
+  loading,
+  retainSelectedItems = true
+}) {
+  const retainedItems = useRef(/* @__PURE__ */ new Map());
+  let asyncSource;
+  let sourceItems;
+  if (isAsyncListSource(items)) {
+    asyncSource = items;
+    sourceItems = [...items.items];
+  } else {
+    sourceItems = Array.from(items);
+  }
+  const selectedIdSet = new Set(selectedKeys);
+  const searchProps = typeof search === "object" ? search : void 0;
+  const isServerSearch = searchProps?.mode === "server";
+  for (const key of retainedItems.current.keys()) {
+    if (!selectedIdSet.has(key)) {
+      retainedItems.current.delete(key);
+    }
+  }
+  for (const item of sourceItems) {
+    if (selectedIdSet.has(item.id)) {
+      retainedItems.current.set(item.id, item);
+    }
+  }
+  const sourceIds = getItemKeys(sourceItems);
+  const shouldRetainSelectedItems = isServerSearch && retainSelectedItems;
+  let canonicalItems = sourceItems;
+  let visibleIds;
+  if (shouldRetainSelectedItems) {
+    const missingSelectedItems = Array.from(retainedItems.current.entries()).filter(([id]) => !sourceIds.has(id)).map(([, item]) => item);
+    canonicalItems = [...sourceItems, ...missingSelectedItems];
+    visibleIds = sourceIds;
+  }
+  let resolvedLoading = loading;
+  if (asyncSource) {
+    resolvedLoading = {
+      state: asyncSource.loadingState,
+      onLoadMore: asyncSource.loadMore
+    };
+  }
+  let inputValue = searchProps?.inputValue;
+  let onInputChange = searchProps?.onInputChange;
+  if (asyncSource && isServerSearch) {
+    inputValue = asyncSource.filterText;
+    onInputChange = asyncSource.setFilterText;
+  }
+  return {
+    canonicalItems,
+    visibleIds,
+    loading: resolvedLoading,
+    isStale: sourceItems.length > 0 && (resolvedLoading?.state === "filtering" || resolvedLoading?.state === "sorting"),
+    inputValue,
+    defaultInputValue: searchProps?.defaultInputValue,
+    onInputChange
+  };
+}
+
+export { useCollectionAdapter };
+//# sourceMappingURL=useCollectionAdapter.esm.js.map

package/dist/hooks/useCollectionAdapter.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCollectionAdapter.esm.js","sources":["../../src/hooks/useCollectionAdapter.ts"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useRef } from 'react';\nimport type { Key } from 'react-aria-components';\nimport type {\n  AsyncListSource,\n  CollectionItem,\n  LoadingConfig,\n} from '../types/selectableCollection';\nimport { getItemKeys, isAsyncListSource } from '../utils/selectableCollection';\n\ntype CollectionAdapterSearch =\n  | true\n  | {\n      mode?: 'client' | 'server';\n      inputValue?: string;\n      defaultInputValue?: string;\n      onInputChange?: (value: string) => void;\n    };\n\ntype UseCollectionAdapterProps<T extends CollectionItem> = {\n  items: Iterable<T> | AsyncListSource<T>;\n  selectedKeys?: Iterable<Key>;\n  search?: CollectionAdapterSearch;\n  loading?: LoadingConfig;\n  retainSelectedItems?: boolean;\n};\n\n/** @internal */\nexport type CollectionAdapterResult<T extends CollectionItem> = {\n  canonicalItems: T[];\n  visibleIds?: Set<Key>;\n  loading?: LoadingConfig;\n  isStale: boolean;\n  inputValue?: string;\n  defaultInputValue?: string;\n  onInputChange?: (value: string) => void;\n};\n\n/** @internal */\nexport function useCollectionAdapter<T extends CollectionItem>({\n  items,\n  selectedKeys = [],\n  search,\n  loading,\n  retainSelectedItems = true,\n}: UseCollectionAdapterProps<T>): CollectionAdapterResult<T> {\n  const retainedItems = useRef(new Map<Key, T>());\n  let asyncSource: AsyncListSource<T> | undefined;\n  let sourceItems: T[];\n\n  if (isAsyncListSource(items)) {\n    asyncSource = items;\n    sourceItems = [...items.items];\n  } else {\n    sourceItems = Array.from(items);\n  }\n\n  const selectedIdSet = new Set(selectedKeys);\n  const searchProps = typeof search === 'object' ? search : undefined;\n  const isServerSearch = searchProps?.mode === 'server';\n\n  for (const key of retainedItems.current.keys()) {\n    if (!selectedIdSet.has(key)) {\n      retainedItems.current.delete(key);\n    }\n  }\n\n  for (const item of sourceItems) {\n    if (selectedIdSet.has(item.id)) {\n      retainedItems.current.set(item.id, item);\n    }\n  }\n\n  const sourceIds = getItemKeys(sourceItems);\n  const shouldRetainSelectedItems = isServerSearch && retainSelectedItems;\n  let canonicalItems = sourceItems;\n  let visibleIds: Set<Key> | undefined;\n\n  if (shouldRetainSelectedItems) {\n    const missingSelectedItems = Array.from(retainedItems.current.entries())\n      .filter(([id]) => !sourceIds.has(id))\n      .map(([, item]) => item);\n\n    canonicalItems = [...sourceItems, ...missingSelectedItems];\n    visibleIds = sourceIds;\n  }\n\n  let resolvedLoading = loading;\n  if (asyncSource) {\n    resolvedLoading = {\n      state: asyncSource.loadingState,\n      onLoadMore: asyncSource.loadMore,\n    };\n  }\n\n  let inputValue = searchProps?.inputValue;\n  let onInputChange = searchProps?.onInputChange;\n  if (asyncSource && isServerSearch) {\n    inputValue = asyncSource.filterText;\n    onInputChange = asyncSource.setFilterText;\n  }\n\n  return {\n    canonicalItems,\n    visibleIds,\n    loading: resolvedLoading,\n    isStale:\n      sourceItems.length > 0 &&\n      (resolvedLoading?.state === 'filtering' ||\n        resolvedLoading?.state === 'sorting'),\n    inputValue,\n    defaultInputValue: searchProps?.defaultInputValue,\n    onInputChange,\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/hooks/useDelayedVisibility.esm.js

@@ -0,0 +1,17 @@
+import { useState, useEffect } from 'react';
+
+function useDelayedVisibility(isVisible, delayMs) {
+  const [isDelayedVisible, setIsDelayedVisible] = useState(false);
+  useEffect(() => {
+    if (!isVisible) {
+      setIsDelayedVisible(false);
+      return void 0;
+    }
+    const timer = setTimeout(() => setIsDelayedVisible(true), delayMs);
+    return () => clearTimeout(timer);
+  }, [delayMs, isVisible]);
+  return isVisible && isDelayedVisible;
+}
+
+export { useDelayedVisibility };
+//# sourceMappingURL=useDelayedVisibility.esm.js.map

package/dist/hooks/useDelayedVisibility.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDelayedVisibility.esm.js","sources":["../../src/hooks/useDelayedVisibility.ts"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useEffect, useState } from 'react';\n\n/** @internal */\nexport function useDelayedVisibility(isVisible: boolean, delayMs: number) {\n  const [isDelayedVisible, setIsDelayedVisible] = useState(false);\n\n  useEffect(() => {\n    if (!isVisible) {\n      setIsDelayedVisible(false);\n      return undefined;\n    }\n\n    const timer = setTimeout(() => setIsDelayedVisible(true), delayMs);\n    return () => clearTimeout(timer);\n  }, [delayMs, isVisible]);\n\n  return isVisible && isDelayedVisible;\n}\n"],"names":[],"mappings":";;AAmBO,SAAS,oBAAA,CAAqB,WAAoB,OAAA,EAAiB;AACxE,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,SAAS,KAAK,CAAA;AAE9D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,SAAA,EAAW;AACd,MAAA,mBAAA,CAAoB,KAAK,CAAA;AACzB,MAAA,OAAO,MAAA;AAAA,IACT;AAEA,IAAA,MAAM,QAAQ,UAAA,CAAW,MAAM,mBAAA,CAAoB,IAAI,GAAG,OAAO,CAAA;AACjE,IAAA,OAAO,MAAM,aAAa,KAAK,CAAA;AAAA,EACjC,CAAA,EAAG,CAAC,OAAA,EAAS,SAAS,CAAC,CAAA;AAEvB,EAAA,OAAO,SAAA,IAAa,gBAAA;AACtB;;;;"}

package/dist/hooks/useTrackedSelectionKeys.esm.js

@@ -0,0 +1,23 @@
+import { useState, useCallback } from 'react';
+
+function useTrackedSelectionKeys({
+  selectedKeys,
+  defaultSelectedKeys,
+  onSelectionChange
+}) {
+  const [uncontrolledSelectedKeys, setUncontrolledSelectedKeys] = useState(() => defaultSelectedKeys ?? /* @__PURE__ */ new Set());
+  const handleSelectionChange = useCallback(
+    (keys) => {
+      setUncontrolledSelectedKeys(keys);
+      onSelectionChange?.(keys);
+    },
+    [onSelectionChange]
+  );
+  return {
+    selectedKeys: selectedKeys ?? uncontrolledSelectedKeys,
+    onSelectionChange: handleSelectionChange
+  };
+}
+
+export { useTrackedSelectionKeys };
+//# sourceMappingURL=useTrackedSelectionKeys.esm.js.map

package/dist/hooks/useTrackedSelectionKeys.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrackedSelectionKeys.esm.js","sources":["../../src/hooks/useTrackedSelectionKeys.ts"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useCallback, useState } from 'react';\nimport type { Key, Selection } from 'react-aria-components';\n\ntype UseTrackedSelectionKeysProps = {\n  selectedKeys?: Selection;\n  defaultSelectedKeys?: Selection;\n  onSelectionChange?: (keys: Selection) => void;\n};\n\nexport function useTrackedSelectionKeys({\n  selectedKeys,\n  defaultSelectedKeys,\n  onSelectionChange,\n}: UseTrackedSelectionKeysProps) {\n  const [uncontrolledSelectedKeys, setUncontrolledSelectedKeys] =\n    useState<Selection>(() => defaultSelectedKeys ?? new Set<Key>());\n\n  const handleSelectionChange = useCallback(\n    (keys: Selection) => {\n      setUncontrolledSelectedKeys(keys);\n      onSelectionChange?.(keys);\n    },\n    [onSelectionChange],\n  );\n\n  return {\n    selectedKeys: selectedKeys ?? uncontrolledSelectedKeys,\n    onSelectionChange: handleSelectionChange,\n  };\n}\n"],"names":[],"mappings":";;AAyBO,SAAS,uBAAA,CAAwB;AAAA,EACtC,YAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF,CAAA,EAAiC;AAC/B,EAAA,MAAM,CAAC,0BAA0B,2BAA2B,CAAA,GAC1D,SAAoB,MAAM,mBAAA,oBAAuB,IAAI,GAAA,EAAU,CAAA;AAEjE,EAAA,MAAM,qBAAA,GAAwB,WAAA;AAAA,IAC5B,CAAC,IAAA,KAAoB;AACnB,MAAA,2BAAA,CAA4B,IAAI,CAAA;AAChC,MAAA,iBAAA,GAAoB,IAAI,CAAA;AAAA,IAC1B,CAAA;AAAA,IACA,CAAC,iBAAiB;AAAA,GACpB;AAEA,EAAA,OAAO;AAAA,IACL,cAAc,YAAA,IAAgB,wBAAA;AAAA,IAC9B,iBAAA,EAAmB;AAAA,GACrB;AACF;;;;"}