react-aria/dist/private/disclosure/useDisclosure.cjs.map

Spectrum UI components in React

{"mappings":"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","sources":["packages/react-aria/src/disclosure/useDisclosure.ts"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the 'License');\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '../button/useButton';\n\nimport {DisclosureState} from 'react-stately/useDisclosureState';\nimport {flushSync} from 'react-dom';\nimport {HTMLAttributes, RefObject, useCallback, useEffect, useRef} from 'react';\nimport {useEvent} from '../utils/useEvent';\nimport {useId} from '../utils/useId';\nimport {useIsSSR} from '../ssr/SSRProvider';\nimport {useLayoutEffect} from '../utils/useLayoutEffect';\n\nexport interface AriaDisclosureProps {\n  /** Whether the disclosure is disabled. */\n  isDisabled?: boolean;\n  /** Handler that is called when the disclosure's expanded state changes. */\n  onExpandedChange?: (isExpanded: boolean) => void;\n  /** Whether the disclosure is expanded (controlled). */\n  isExpanded?: boolean;\n  /** Whether the disclosure is expanded by default (uncontrolled). */\n  defaultExpanded?: boolean;\n}\n\nexport interface DisclosureAria {\n  /** Props for the disclosure button. */\n  buttonProps: AriaButtonProps;\n  /** Props for the disclosure panel. */\n  panelProps: HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Provides the behavior and accessibility implementation for a disclosure component.\n *\n * @param props - Props for the disclosure.\n * @param state - State for the disclosure, as returned by `useDisclosureState`.\n * @param ref - A ref for the disclosure panel.\n */\nexport function useDisclosure(\n  props: AriaDisclosureProps,\n  state: DisclosureState,\n  ref: RefObject<HTMLElement | null>\n): DisclosureAria {\n  let {isDisabled} = props;\n  let triggerId = useId();\n  let panelId = useId();\n  let isSSR = useIsSSR();\n\n  let raf = useRef<number | null>(null);\n\n  let handleBeforeMatch = useCallback(() => {\n    // Wait a frame to revert browser's removal of hidden attribute\n    raf.current = requestAnimationFrame(() => {\n      if (ref.current) {\n        ref.current.setAttribute('hidden', 'until-found');\n      }\n    });\n    // Force sync state update\n    flushSync(() => {\n      state.toggle();\n    });\n  }, [ref, state]);\n\n  // @ts-ignore https://github.com/facebook/react/pull/24741\n  useEvent(ref, 'beforematch', handleBeforeMatch);\n\n  let isExpandedRef = useRef<boolean | null>(null);\n  useLayoutEffect(() => {\n    // Cancel any pending RAF to prevent stale updates\n    if (raf.current) {\n      cancelAnimationFrame(raf.current);\n    }\n    if (ref.current && !isSSR) {\n      let panel = ref.current;\n\n      if (isExpandedRef.current == null || typeof panel.getAnimations !== 'function') {\n        // On initial render (and in tests), set attributes without animation.\n        if (state.isExpanded) {\n          panel.removeAttribute('hidden');\n          panel.style.setProperty('--disclosure-panel-width', 'auto');\n          panel.style.setProperty('--disclosure-panel-height', 'auto');\n        } else {\n          panel.setAttribute('hidden', 'until-found');\n          panel.style.setProperty('--disclosure-panel-width', '0px');\n          panel.style.setProperty('--disclosure-panel-height', '0px');\n        }\n      } else if (state.isExpanded !== isExpandedRef.current) {\n        if (state.isExpanded) {\n          panel.removeAttribute('hidden');\n\n          // Set the width and height as pixels so they can be animated.\n          panel.style.setProperty('--disclosure-panel-width', panel.scrollWidth + 'px');\n          panel.style.setProperty('--disclosure-panel-height', panel.scrollHeight + 'px');\n\n          Promise.all(panel.getAnimations().map(a => a.finished))\n            .then(() => {\n              // After the animations complete, switch back to auto so the content can resize.\n              panel.style.setProperty('--disclosure-panel-width', 'auto');\n              panel.style.setProperty('--disclosure-panel-height', 'auto');\n            })\n            .catch(() => {});\n        } else {\n          panel.style.setProperty('--disclosure-panel-width', panel.scrollWidth + 'px');\n          panel.style.setProperty('--disclosure-panel-height', panel.scrollHeight + 'px');\n\n          // Force style re-calculation to trigger animations.\n          window.getComputedStyle(panel).height;\n\n          // Animate to zero size.\n          panel.style.setProperty('--disclosure-panel-width', '0px');\n          panel.style.setProperty('--disclosure-panel-height', '0px');\n\n          // Wait for animations to apply the hidden attribute.\n          Promise.all(panel.getAnimations().map(a => a.finished))\n            .then(() => panel.setAttribute('hidden', 'until-found'))\n            .catch(() => {});\n        }\n      }\n\n      isExpandedRef.current = state.isExpanded;\n    }\n  }, [isDisabled, ref, state.isExpanded, isSSR]);\n\n  useEffect(() => {\n    return () => {\n      if (raf.current) {\n        cancelAnimationFrame(raf.current);\n      }\n    };\n  }, []);\n\n  return {\n    buttonProps: {\n      id: triggerId,\n      'aria-expanded': state.isExpanded,\n      'aria-controls': panelId,\n      onPress: e => {\n        if (!isDisabled && e.pointerType !== 'keyboard') {\n          state.toggle();\n        }\n      },\n      isDisabled,\n      onPressStart(e) {\n        if (e.pointerType === 'keyboard' && !isDisabled) {\n          state.toggle();\n        }\n      }\n    },\n    panelProps: {\n      id: panelId,\n      // This can be overridden at the panel element level.\n      role: 'group',\n      'aria-labelledby': triggerId,\n      'aria-hidden': !state.isExpanded,\n      hidden: isSSR ? !state.isExpanded : undefined\n    }\n  };\n}\n"],"names":[],"version":3,"file":"useDisclosure.cjs.map"}