@radix-ui/react-collapsible 1.1.1-rc.9 → 1.1.2-rc.1

package/dist/index.d.mts

@@ -1,18 +1,8 @@
+import * as _radix_ui_react_context from '@radix-ui/react-context';
 import * as React from 'react';
 import { Primitive } from '@radix-ui/react-primitive';
 
-type Scope<C = any> = {
-    [scopeName: string]: React.Context<C>[];
-} | undefined;
-type ScopeHook = (scope: Scope) => {
-    [__scopeProp: string]: Scope;
-};
-interface CreateScope {
-    scopeName: string;
-    (): ScopeHook;
-}
-
-declare const createCollapsibleScope: CreateScope;
+declare const createCollapsibleScope: _radix_ui_react_context.CreateScope;
 type PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;
 interface CollapsibleProps extends PrimitiveDivProps {
     defaultOpen?: boolean;

package/dist/index.d.ts

@@ -1,18 +1,8 @@
+import * as _radix_ui_react_context from '@radix-ui/react-context';
 import * as React from 'react';
 import { Primitive } from '@radix-ui/react-primitive';
 
-type Scope<C = any> = {
-    [scopeName: string]: React.Context<C>[];
-} | undefined;
-type ScopeHook = (scope: Scope) => {
-    [__scopeProp: string]: Scope;
-};
-interface CreateScope {
-    scopeName: string;
-    (): ScopeHook;
-}
-
-declare const createCollapsibleScope: CreateScope;
+declare const createCollapsibleScope: _radix_ui_react_context.CreateScope;
 type PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;
 interface CollapsibleProps extends PrimitiveDivProps {
     defaultOpen?: boolean;

package/dist/index.js

@@ -135,7 +135,7 @@ var CollapsibleContentImpl = React.forwardRef((props, forwardedRef) => {
   const width = widthRef.current;
   const isOpen = context.open || isPresent;
   const isMountAnimationPreventedRef = React.useRef(isOpen);
-  const originalStylesRef = React.useRef();
+  const originalStylesRef = React.useRef(void 0);
   React.useEffect(() => {
     const rAF = requestAnimationFrame(() => isMountAnimationPreventedRef.current = false);
     return () => cancelAnimationFrame(rAF);

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/index.ts", "../src/Collapsible.tsx"],
-  "sourcesContent": ["'use client';\nexport {\n  createCollapsibleScope,\n  //\n  Collapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n  //\n  Root,\n  Trigger,\n  Content,\n} from './Collapsible';\nexport type {\n  CollapsibleProps,\n  CollapsibleTriggerProps,\n  CollapsibleContentProps,\n} from './Collapsible';\n", "import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useLayoutEffect } from '@radix-ui/react-use-layout-effect';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Presence } from '@radix-ui/react-presence';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Collapsible\n * -----------------------------------------------------------------------------------------------*/\n\nconst COLLAPSIBLE_NAME = 'Collapsible';\n\ntype ScopedProps<P> = P & { __scopeCollapsible?: Scope };\nconst [createCollapsibleContext, createCollapsibleScope] = createContextScope(COLLAPSIBLE_NAME);\n\ntype CollapsibleContextValue = {\n  contentId: string;\n  disabled?: boolean;\n  open: boolean;\n  onOpenToggle(): void;\n};\n\nconst [CollapsibleProvider, useCollapsibleContext] =\n  createCollapsibleContext<CollapsibleContextValue>(COLLAPSIBLE_NAME);\n\ntype CollapsibleElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface CollapsibleProps extends PrimitiveDivProps {\n  defaultOpen?: boolean;\n  open?: boolean;\n  disabled?: boolean;\n  onOpenChange?(open: boolean): void;\n}\n\nconst Collapsible = React.forwardRef<CollapsibleElement, CollapsibleProps>(\n  (props: ScopedProps<CollapsibleProps>, forwardedRef) => {\n    const {\n      __scopeCollapsible,\n      open: openProp,\n      defaultOpen,\n      disabled,\n      onOpenChange,\n      ...collapsibleProps\n    } = props;\n\n    const [open = false, setOpen] = useControllableState({\n      prop: openProp,\n      defaultProp: defaultOpen,\n      onChange: onOpenChange,\n    });\n\n    return (\n      <CollapsibleProvider\n        scope={__scopeCollapsible}\n        disabled={disabled}\n        contentId={useId()}\n        open={open}\n        onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n      >\n        <Primitive.div\n          data-state={getState(open)}\n          data-disabled={disabled ? '' : undefined}\n          {...collapsibleProps}\n          ref={forwardedRef}\n        />\n      </CollapsibleProvider>\n    );\n  }\n);\n\nCollapsible.displayName = COLLAPSIBLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'CollapsibleTrigger';\n\ntype CollapsibleTriggerElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface CollapsibleTriggerProps extends PrimitiveButtonProps {}\n\nconst CollapsibleTrigger = React.forwardRef<CollapsibleTriggerElement, CollapsibleTriggerProps>(\n  (props: ScopedProps<CollapsibleTriggerProps>, forwardedRef) => {\n    const { __scopeCollapsible, ...triggerProps } = props;\n    const context = useCollapsibleContext(TRIGGER_NAME, __scopeCollapsible);\n    return (\n      <Primitive.button\n        type=\"button\"\n        aria-controls={context.contentId}\n        aria-expanded={context.open || false}\n        data-state={getState(context.open)}\n        data-disabled={context.disabled ? '' : undefined}\n        disabled={context.disabled}\n        {...triggerProps}\n        ref={forwardedRef}\n        onClick={composeEventHandlers(props.onClick, context.onOpenToggle)}\n      />\n    );\n  }\n);\n\nCollapsibleTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'CollapsibleContent';\n\ntype CollapsibleContentElement = CollapsibleContentImplElement;\ninterface CollapsibleContentProps extends Omit<CollapsibleContentImplProps, 'present'> {\n  /**\n   * Used to force mounting when more control is needed. Useful when\n   * controlling animation with React animation libraries.\n   */\n  forceMount?: true;\n}\n\nconst CollapsibleContent = React.forwardRef<CollapsibleContentElement, CollapsibleContentProps>(\n  (props: ScopedProps<CollapsibleContentProps>, forwardedRef) => {\n    const { forceMount, ...contentProps } = props;\n    const context = useCollapsibleContext(CONTENT_NAME, props.__scopeCollapsible);\n    return (\n      <Presence present={forceMount || context.open}>\n        {({ present }) => (\n          <CollapsibleContentImpl {...contentProps} ref={forwardedRef} present={present} />\n        )}\n      </Presence>\n    );\n  }\n);\n\nCollapsibleContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype CollapsibleContentImplElement = React.ElementRef<typeof Primitive.div>;\ninterface CollapsibleContentImplProps extends PrimitiveDivProps {\n  present: boolean;\n}\n\nconst CollapsibleContentImpl = React.forwardRef<\n  CollapsibleContentImplElement,\n  CollapsibleContentImplProps\n>((props: ScopedProps<CollapsibleContentImplProps>, forwardedRef) => {\n  const { __scopeCollapsible, present, children, ...contentProps } = props;\n  const context = useCollapsibleContext(CONTENT_NAME, __scopeCollapsible);\n  const [isPresent, setIsPresent] = React.useState(present);\n  const ref = React.useRef<CollapsibleContentImplElement>(null);\n  const composedRefs = useComposedRefs(forwardedRef, ref);\n  const heightRef = React.useRef<number | undefined>(0);\n  const height = heightRef.current;\n  const widthRef = React.useRef<number | undefined>(0);\n  const width = widthRef.current;\n  // when opening we want it to immediately open to retrieve dimensions\n  // when closing we delay `present` to retrieve dimensions before closing\n  const isOpen = context.open || isPresent;\n  const isMountAnimationPreventedRef = React.useRef(isOpen);\n  const originalStylesRef = React.useRef<Record<string, string>>();\n\n  React.useEffect(() => {\n    const rAF = requestAnimationFrame(() => (isMountAnimationPreventedRef.current = false));\n    return () => cancelAnimationFrame(rAF);\n  }, []);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node) {\n      originalStylesRef.current = originalStylesRef.current || {\n        transitionDuration: node.style.transitionDuration,\n        animationName: node.style.animationName,\n      };\n      // block any animations/transitions so the element renders at its full dimensions\n      node.style.transitionDuration = '0s';\n      node.style.animationName = 'none';\n\n      // get width and height from full dimensions\n      const rect = node.getBoundingClientRect();\n      heightRef.current = rect.height;\n      widthRef.current = rect.width;\n\n      // kick off any animations/transitions that were originally set up if it isn't the initial mount\n      if (!isMountAnimationPreventedRef.current) {\n        node.style.transitionDuration = originalStylesRef.current.transitionDuration;\n        node.style.animationName = originalStylesRef.current.animationName;\n      }\n\n      setIsPresent(present);\n    }\n    /**\n     * depends on `context.open` because it will change to `false`\n     * when a close is triggered but `present` will be `false` on\n     * animation end (so when close finishes). This allows us to\n     * retrieve the dimensions *before* closing.\n     */\n  }, [context.open, present]);\n\n  return (\n    <Primitive.div\n      data-state={getState(context.open)}\n      data-disabled={context.disabled ? '' : undefined}\n      id={context.contentId}\n      hidden={!isOpen}\n      {...contentProps}\n      ref={composedRefs}\n      style={{\n        [`--radix-collapsible-content-height` as any]: height ? `${height}px` : undefined,\n        [`--radix-collapsible-content-width` as any]: width ? `${width}px` : undefined,\n        ...props.style,\n      }}\n    >\n      {isOpen && children}\n    </Primitive.div>\n  );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n  return open ? 'open' : 'closed';\n}\n\nconst Root = Collapsible;\nconst Trigger = CollapsibleTrigger;\nconst Content = CollapsibleContent;\n\nexport {\n  createCollapsibleScope,\n  //\n  Collapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n  //\n  Root,\n  Trigger,\n  Content,\n};\nexport type { CollapsibleProps, CollapsibleTriggerProps, CollapsibleContentProps };\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client';\nexport {\n  createCollapsibleScope,\n  //\n  Collapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n  //\n  Root,\n  Trigger,\n  Content,\n} from './Collapsible';\nexport type {\n  CollapsibleProps,\n  CollapsibleTriggerProps,\n  CollapsibleContentProps,\n} from './Collapsible';\n", "import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useLayoutEffect } from '@radix-ui/react-use-layout-effect';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Presence } from '@radix-ui/react-presence';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Collapsible\n * -----------------------------------------------------------------------------------------------*/\n\nconst COLLAPSIBLE_NAME = 'Collapsible';\n\ntype ScopedProps<P> = P & { __scopeCollapsible?: Scope };\nconst [createCollapsibleContext, createCollapsibleScope] = createContextScope(COLLAPSIBLE_NAME);\n\ntype CollapsibleContextValue = {\n  contentId: string;\n  disabled?: boolean;\n  open: boolean;\n  onOpenToggle(): void;\n};\n\nconst [CollapsibleProvider, useCollapsibleContext] =\n  createCollapsibleContext<CollapsibleContextValue>(COLLAPSIBLE_NAME);\n\ntype CollapsibleElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface CollapsibleProps extends PrimitiveDivProps {\n  defaultOpen?: boolean;\n  open?: boolean;\n  disabled?: boolean;\n  onOpenChange?(open: boolean): void;\n}\n\nconst Collapsible = React.forwardRef<CollapsibleElement, CollapsibleProps>(\n  (props: ScopedProps<CollapsibleProps>, forwardedRef) => {\n    const {\n      __scopeCollapsible,\n      open: openProp,\n      defaultOpen,\n      disabled,\n      onOpenChange,\n      ...collapsibleProps\n    } = props;\n\n    const [open = false, setOpen] = useControllableState({\n      prop: openProp,\n      defaultProp: defaultOpen,\n      onChange: onOpenChange,\n    });\n\n    return (\n      <CollapsibleProvider\n        scope={__scopeCollapsible}\n        disabled={disabled}\n        contentId={useId()}\n        open={open}\n        onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n      >\n        <Primitive.div\n          data-state={getState(open)}\n          data-disabled={disabled ? '' : undefined}\n          {...collapsibleProps}\n          ref={forwardedRef}\n        />\n      </CollapsibleProvider>\n    );\n  }\n);\n\nCollapsible.displayName = COLLAPSIBLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'CollapsibleTrigger';\n\ntype CollapsibleTriggerElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface CollapsibleTriggerProps extends PrimitiveButtonProps {}\n\nconst CollapsibleTrigger = React.forwardRef<CollapsibleTriggerElement, CollapsibleTriggerProps>(\n  (props: ScopedProps<CollapsibleTriggerProps>, forwardedRef) => {\n    const { __scopeCollapsible, ...triggerProps } = props;\n    const context = useCollapsibleContext(TRIGGER_NAME, __scopeCollapsible);\n    return (\n      <Primitive.button\n        type=\"button\"\n        aria-controls={context.contentId}\n        aria-expanded={context.open || false}\n        data-state={getState(context.open)}\n        data-disabled={context.disabled ? '' : undefined}\n        disabled={context.disabled}\n        {...triggerProps}\n        ref={forwardedRef}\n        onClick={composeEventHandlers(props.onClick, context.onOpenToggle)}\n      />\n    );\n  }\n);\n\nCollapsibleTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'CollapsibleContent';\n\ntype CollapsibleContentElement = CollapsibleContentImplElement;\ninterface CollapsibleContentProps extends Omit<CollapsibleContentImplProps, 'present'> {\n  /**\n   * Used to force mounting when more control is needed. Useful when\n   * controlling animation with React animation libraries.\n   */\n  forceMount?: true;\n}\n\nconst CollapsibleContent = React.forwardRef<CollapsibleContentElement, CollapsibleContentProps>(\n  (props: ScopedProps<CollapsibleContentProps>, forwardedRef) => {\n    const { forceMount, ...contentProps } = props;\n    const context = useCollapsibleContext(CONTENT_NAME, props.__scopeCollapsible);\n    return (\n      <Presence present={forceMount || context.open}>\n        {({ present }) => (\n          <CollapsibleContentImpl {...contentProps} ref={forwardedRef} present={present} />\n        )}\n      </Presence>\n    );\n  }\n);\n\nCollapsibleContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype CollapsibleContentImplElement = React.ElementRef<typeof Primitive.div>;\ninterface CollapsibleContentImplProps extends PrimitiveDivProps {\n  present: boolean;\n}\n\nconst CollapsibleContentImpl = React.forwardRef<\n  CollapsibleContentImplElement,\n  CollapsibleContentImplProps\n>((props: ScopedProps<CollapsibleContentImplProps>, forwardedRef) => {\n  const { __scopeCollapsible, present, children, ...contentProps } = props;\n  const context = useCollapsibleContext(CONTENT_NAME, __scopeCollapsible);\n  const [isPresent, setIsPresent] = React.useState(present);\n  const ref = React.useRef<CollapsibleContentImplElement>(null);\n  const composedRefs = useComposedRefs(forwardedRef, ref);\n  const heightRef = React.useRef<number | undefined>(0);\n  const height = heightRef.current;\n  const widthRef = React.useRef<number | undefined>(0);\n  const width = widthRef.current;\n  // when opening we want it to immediately open to retrieve dimensions\n  // when closing we delay `present` to retrieve dimensions before closing\n  const isOpen = context.open || isPresent;\n  const isMountAnimationPreventedRef = React.useRef(isOpen);\n  const originalStylesRef = React.useRef<Record<string, string>>(undefined);\n\n  React.useEffect(() => {\n    const rAF = requestAnimationFrame(() => (isMountAnimationPreventedRef.current = false));\n    return () => cancelAnimationFrame(rAF);\n  }, []);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node) {\n      originalStylesRef.current = originalStylesRef.current || {\n        transitionDuration: node.style.transitionDuration,\n        animationName: node.style.animationName,\n      };\n      // block any animations/transitions so the element renders at its full dimensions\n      node.style.transitionDuration = '0s';\n      node.style.animationName = 'none';\n\n      // get width and height from full dimensions\n      const rect = node.getBoundingClientRect();\n      heightRef.current = rect.height;\n      widthRef.current = rect.width;\n\n      // kick off any animations/transitions that were originally set up if it isn't the initial mount\n      if (!isMountAnimationPreventedRef.current) {\n        node.style.transitionDuration = originalStylesRef.current.transitionDuration;\n        node.style.animationName = originalStylesRef.current.animationName;\n      }\n\n      setIsPresent(present);\n    }\n    /**\n     * depends on `context.open` because it will change to `false`\n     * when a close is triggered but `present` will be `false` on\n     * animation end (so when close finishes). This allows us to\n     * retrieve the dimensions *before* closing.\n     */\n  }, [context.open, present]);\n\n  return (\n    <Primitive.div\n      data-state={getState(context.open)}\n      data-disabled={context.disabled ? '' : undefined}\n      id={context.contentId}\n      hidden={!isOpen}\n      {...contentProps}\n      ref={composedRefs}\n      style={{\n        [`--radix-collapsible-content-height` as any]: height ? `${height}px` : undefined,\n        [`--radix-collapsible-content-width` as any]: width ? `${width}px` : undefined,\n        ...props.style,\n      }}\n    >\n      {isOpen && children}\n    </Primitive.div>\n  );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n  return open ? 'open' : 'closed';\n}\n\nconst Root = Collapsible;\nconst Trigger = CollapsibleTrigger;\nconst Content = CollapsibleContent;\n\nexport {\n  createCollapsibleScope,\n  //\n  Collapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n  //\n  Root,\n  Trigger,\n  Content,\n};\nexport type { CollapsibleProps, CollapsibleTriggerProps, CollapsibleContentProps };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/index.mjs

@@ -94,7 +94,7 @@ var CollapsibleContentImpl = React.forwardRef((props, forwardedRef) => {
   const width = widthRef.current;
   const isOpen = context.open || isPresent;
   const isMountAnimationPreventedRef = React.useRef(isOpen);
-  const originalStylesRef = React.useRef();
+  const originalStylesRef = React.useRef(void 0);
   React.useEffect(() => {
     const rAF = requestAnimationFrame(() => isMountAnimationPreventedRef.current = false);
     return () => cancelAnimationFrame(rAF);

package/dist/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/Collapsible.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useLayoutEffect } from '@radix-ui/react-use-layout-effect';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Presence } from '@radix-ui/react-presence';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Collapsible\n * -----------------------------------------------------------------------------------------------*/\n\nconst COLLAPSIBLE_NAME = 'Collapsible';\n\ntype ScopedProps<P> = P & { __scopeCollapsible?: Scope };\nconst [createCollapsibleContext, createCollapsibleScope] = createContextScope(COLLAPSIBLE_NAME);\n\ntype CollapsibleContextValue = {\n  contentId: string;\n  disabled?: boolean;\n  open: boolean;\n  onOpenToggle(): void;\n};\n\nconst [CollapsibleProvider, useCollapsibleContext] =\n  createCollapsibleContext<CollapsibleContextValue>(COLLAPSIBLE_NAME);\n\ntype CollapsibleElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface CollapsibleProps extends PrimitiveDivProps {\n  defaultOpen?: boolean;\n  open?: boolean;\n  disabled?: boolean;\n  onOpenChange?(open: boolean): void;\n}\n\nconst Collapsible = React.forwardRef<CollapsibleElement, CollapsibleProps>(\n  (props: ScopedProps<CollapsibleProps>, forwardedRef) => {\n    const {\n      __scopeCollapsible,\n      open: openProp,\n      defaultOpen,\n      disabled,\n      onOpenChange,\n      ...collapsibleProps\n    } = props;\n\n    const [open = false, setOpen] = useControllableState({\n      prop: openProp,\n      defaultProp: defaultOpen,\n      onChange: onOpenChange,\n    });\n\n    return (\n      <CollapsibleProvider\n        scope={__scopeCollapsible}\n        disabled={disabled}\n        contentId={useId()}\n        open={open}\n        onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n      >\n        <Primitive.div\n          data-state={getState(open)}\n          data-disabled={disabled ? '' : undefined}\n          {...collapsibleProps}\n          ref={forwardedRef}\n        />\n      </CollapsibleProvider>\n    );\n  }\n);\n\nCollapsible.displayName = COLLAPSIBLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'CollapsibleTrigger';\n\ntype CollapsibleTriggerElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface CollapsibleTriggerProps extends PrimitiveButtonProps {}\n\nconst CollapsibleTrigger = React.forwardRef<CollapsibleTriggerElement, CollapsibleTriggerProps>(\n  (props: ScopedProps<CollapsibleTriggerProps>, forwardedRef) => {\n    const { __scopeCollapsible, ...triggerProps } = props;\n    const context = useCollapsibleContext(TRIGGER_NAME, __scopeCollapsible);\n    return (\n      <Primitive.button\n        type=\"button\"\n        aria-controls={context.contentId}\n        aria-expanded={context.open || false}\n        data-state={getState(context.open)}\n        data-disabled={context.disabled ? '' : undefined}\n        disabled={context.disabled}\n        {...triggerProps}\n        ref={forwardedRef}\n        onClick={composeEventHandlers(props.onClick, context.onOpenToggle)}\n      />\n    );\n  }\n);\n\nCollapsibleTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'CollapsibleContent';\n\ntype CollapsibleContentElement = CollapsibleContentImplElement;\ninterface CollapsibleContentProps extends Omit<CollapsibleContentImplProps, 'present'> {\n  /**\n   * Used to force mounting when more control is needed. Useful when\n   * controlling animation with React animation libraries.\n   */\n  forceMount?: true;\n}\n\nconst CollapsibleContent = React.forwardRef<CollapsibleContentElement, CollapsibleContentProps>(\n  (props: ScopedProps<CollapsibleContentProps>, forwardedRef) => {\n    const { forceMount, ...contentProps } = props;\n    const context = useCollapsibleContext(CONTENT_NAME, props.__scopeCollapsible);\n    return (\n      <Presence present={forceMount || context.open}>\n        {({ present }) => (\n          <CollapsibleContentImpl {...contentProps} ref={forwardedRef} present={present} />\n        )}\n      </Presence>\n    );\n  }\n);\n\nCollapsibleContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype CollapsibleContentImplElement = React.ElementRef<typeof Primitive.div>;\ninterface CollapsibleContentImplProps extends PrimitiveDivProps {\n  present: boolean;\n}\n\nconst CollapsibleContentImpl = React.forwardRef<\n  CollapsibleContentImplElement,\n  CollapsibleContentImplProps\n>((props: ScopedProps<CollapsibleContentImplProps>, forwardedRef) => {\n  const { __scopeCollapsible, present, children, ...contentProps } = props;\n  const context = useCollapsibleContext(CONTENT_NAME, __scopeCollapsible);\n  const [isPresent, setIsPresent] = React.useState(present);\n  const ref = React.useRef<CollapsibleContentImplElement>(null);\n  const composedRefs = useComposedRefs(forwardedRef, ref);\n  const heightRef = React.useRef<number | undefined>(0);\n  const height = heightRef.current;\n  const widthRef = React.useRef<number | undefined>(0);\n  const width = widthRef.current;\n  // when opening we want it to immediately open to retrieve dimensions\n  // when closing we delay `present` to retrieve dimensions before closing\n  const isOpen = context.open || isPresent;\n  const isMountAnimationPreventedRef = React.useRef(isOpen);\n  const originalStylesRef = React.useRef<Record<string, string>>();\n\n  React.useEffect(() => {\n    const rAF = requestAnimationFrame(() => (isMountAnimationPreventedRef.current = false));\n    return () => cancelAnimationFrame(rAF);\n  }, []);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node) {\n      originalStylesRef.current = originalStylesRef.current || {\n        transitionDuration: node.style.transitionDuration,\n        animationName: node.style.animationName,\n      };\n      // block any animations/transitions so the element renders at its full dimensions\n      node.style.transitionDuration = '0s';\n      node.style.animationName = 'none';\n\n      // get width and height from full dimensions\n      const rect = node.getBoundingClientRect();\n      heightRef.current = rect.height;\n      widthRef.current = rect.width;\n\n      // kick off any animations/transitions that were originally set up if it isn't the initial mount\n      if (!isMountAnimationPreventedRef.current) {\n        node.style.transitionDuration = originalStylesRef.current.transitionDuration;\n        node.style.animationName = originalStylesRef.current.animationName;\n      }\n\n      setIsPresent(present);\n    }\n    /**\n     * depends on `context.open` because it will change to `false`\n     * when a close is triggered but `present` will be `false` on\n     * animation end (so when close finishes). This allows us to\n     * retrieve the dimensions *before* closing.\n     */\n  }, [context.open, present]);\n\n  return (\n    <Primitive.div\n      data-state={getState(context.open)}\n      data-disabled={context.disabled ? '' : undefined}\n      id={context.contentId}\n      hidden={!isOpen}\n      {...contentProps}\n      ref={composedRefs}\n      style={{\n        [`--radix-collapsible-content-height` as any]: height ? `${height}px` : undefined,\n        [`--radix-collapsible-content-width` as any]: width ? `${width}px` : undefined,\n        ...props.style,\n      }}\n    >\n      {isOpen && children}\n    </Primitive.div>\n  );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n  return open ? 'open' : 'closed';\n}\n\nconst Root = Collapsible;\nconst Trigger = CollapsibleTrigger;\nconst Content = CollapsibleContent;\n\nexport {\n  createCollapsibleScope,\n  //\n  Collapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n  //\n  Root,\n  Trigger,\n  Content,\n};\nexport type { CollapsibleProps, CollapsibleTriggerProps, CollapsibleContentProps };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useLayoutEffect } from '@radix-ui/react-use-layout-effect';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Presence } from '@radix-ui/react-presence';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Collapsible\n * -----------------------------------------------------------------------------------------------*/\n\nconst COLLAPSIBLE_NAME = 'Collapsible';\n\ntype ScopedProps<P> = P & { __scopeCollapsible?: Scope };\nconst [createCollapsibleContext, createCollapsibleScope] = createContextScope(COLLAPSIBLE_NAME);\n\ntype CollapsibleContextValue = {\n  contentId: string;\n  disabled?: boolean;\n  open: boolean;\n  onOpenToggle(): void;\n};\n\nconst [CollapsibleProvider, useCollapsibleContext] =\n  createCollapsibleContext<CollapsibleContextValue>(COLLAPSIBLE_NAME);\n\ntype CollapsibleElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface CollapsibleProps extends PrimitiveDivProps {\n  defaultOpen?: boolean;\n  open?: boolean;\n  disabled?: boolean;\n  onOpenChange?(open: boolean): void;\n}\n\nconst Collapsible = React.forwardRef<CollapsibleElement, CollapsibleProps>(\n  (props: ScopedProps<CollapsibleProps>, forwardedRef) => {\n    const {\n      __scopeCollapsible,\n      open: openProp,\n      defaultOpen,\n      disabled,\n      onOpenChange,\n      ...collapsibleProps\n    } = props;\n\n    const [open = false, setOpen] = useControllableState({\n      prop: openProp,\n      defaultProp: defaultOpen,\n      onChange: onOpenChange,\n    });\n\n    return (\n      <CollapsibleProvider\n        scope={__scopeCollapsible}\n        disabled={disabled}\n        contentId={useId()}\n        open={open}\n        onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n      >\n        <Primitive.div\n          data-state={getState(open)}\n          data-disabled={disabled ? '' : undefined}\n          {...collapsibleProps}\n          ref={forwardedRef}\n        />\n      </CollapsibleProvider>\n    );\n  }\n);\n\nCollapsible.displayName = COLLAPSIBLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'CollapsibleTrigger';\n\ntype CollapsibleTriggerElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface CollapsibleTriggerProps extends PrimitiveButtonProps {}\n\nconst CollapsibleTrigger = React.forwardRef<CollapsibleTriggerElement, CollapsibleTriggerProps>(\n  (props: ScopedProps<CollapsibleTriggerProps>, forwardedRef) => {\n    const { __scopeCollapsible, ...triggerProps } = props;\n    const context = useCollapsibleContext(TRIGGER_NAME, __scopeCollapsible);\n    return (\n      <Primitive.button\n        type=\"button\"\n        aria-controls={context.contentId}\n        aria-expanded={context.open || false}\n        data-state={getState(context.open)}\n        data-disabled={context.disabled ? '' : undefined}\n        disabled={context.disabled}\n        {...triggerProps}\n        ref={forwardedRef}\n        onClick={composeEventHandlers(props.onClick, context.onOpenToggle)}\n      />\n    );\n  }\n);\n\nCollapsibleTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'CollapsibleContent';\n\ntype CollapsibleContentElement = CollapsibleContentImplElement;\ninterface CollapsibleContentProps extends Omit<CollapsibleContentImplProps, 'present'> {\n  /**\n   * Used to force mounting when more control is needed. Useful when\n   * controlling animation with React animation libraries.\n   */\n  forceMount?: true;\n}\n\nconst CollapsibleContent = React.forwardRef<CollapsibleContentElement, CollapsibleContentProps>(\n  (props: ScopedProps<CollapsibleContentProps>, forwardedRef) => {\n    const { forceMount, ...contentProps } = props;\n    const context = useCollapsibleContext(CONTENT_NAME, props.__scopeCollapsible);\n    return (\n      <Presence present={forceMount || context.open}>\n        {({ present }) => (\n          <CollapsibleContentImpl {...contentProps} ref={forwardedRef} present={present} />\n        )}\n      </Presence>\n    );\n  }\n);\n\nCollapsibleContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype CollapsibleContentImplElement = React.ElementRef<typeof Primitive.div>;\ninterface CollapsibleContentImplProps extends PrimitiveDivProps {\n  present: boolean;\n}\n\nconst CollapsibleContentImpl = React.forwardRef<\n  CollapsibleContentImplElement,\n  CollapsibleContentImplProps\n>((props: ScopedProps<CollapsibleContentImplProps>, forwardedRef) => {\n  const { __scopeCollapsible, present, children, ...contentProps } = props;\n  const context = useCollapsibleContext(CONTENT_NAME, __scopeCollapsible);\n  const [isPresent, setIsPresent] = React.useState(present);\n  const ref = React.useRef<CollapsibleContentImplElement>(null);\n  const composedRefs = useComposedRefs(forwardedRef, ref);\n  const heightRef = React.useRef<number | undefined>(0);\n  const height = heightRef.current;\n  const widthRef = React.useRef<number | undefined>(0);\n  const width = widthRef.current;\n  // when opening we want it to immediately open to retrieve dimensions\n  // when closing we delay `present` to retrieve dimensions before closing\n  const isOpen = context.open || isPresent;\n  const isMountAnimationPreventedRef = React.useRef(isOpen);\n  const originalStylesRef = React.useRef<Record<string, string>>(undefined);\n\n  React.useEffect(() => {\n    const rAF = requestAnimationFrame(() => (isMountAnimationPreventedRef.current = false));\n    return () => cancelAnimationFrame(rAF);\n  }, []);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node) {\n      originalStylesRef.current = originalStylesRef.current || {\n        transitionDuration: node.style.transitionDuration,\n        animationName: node.style.animationName,\n      };\n      // block any animations/transitions so the element renders at its full dimensions\n      node.style.transitionDuration = '0s';\n      node.style.animationName = 'none';\n\n      // get width and height from full dimensions\n      const rect = node.getBoundingClientRect();\n      heightRef.current = rect.height;\n      widthRef.current = rect.width;\n\n      // kick off any animations/transitions that were originally set up if it isn't the initial mount\n      if (!isMountAnimationPreventedRef.current) {\n        node.style.transitionDuration = originalStylesRef.current.transitionDuration;\n        node.style.animationName = originalStylesRef.current.animationName;\n      }\n\n      setIsPresent(present);\n    }\n    /**\n     * depends on `context.open` because it will change to `false`\n     * when a close is triggered but `present` will be `false` on\n     * animation end (so when close finishes). This allows us to\n     * retrieve the dimensions *before* closing.\n     */\n  }, [context.open, present]);\n\n  return (\n    <Primitive.div\n      data-state={getState(context.open)}\n      data-disabled={context.disabled ? '' : undefined}\n      id={context.contentId}\n      hidden={!isOpen}\n      {...contentProps}\n      ref={composedRefs}\n      style={{\n        [`--radix-collapsible-content-height` as any]: height ? `${height}px` : undefined,\n        [`--radix-collapsible-content-width` as any]: width ? `${width}px` : undefined,\n        ...props.style,\n      }}\n    >\n      {isOpen && children}\n    </Primitive.div>\n  );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n  return open ? 'open' : 'closed';\n}\n\nconst Root = Collapsible;\nconst Trigger = CollapsibleTrigger;\nconst Content = CollapsibleContent;\n\nexport {\n  createCollapsibleScope,\n  //\n  Collapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n  //\n  Root,\n  Trigger,\n  Content,\n};\nexport type { CollapsibleProps, CollapsibleTriggerProps, CollapsibleContentProps };\n"],
+  "mappings": "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",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-collapsible",
-  "version": "1.1.1-rc.9",
+  "version": "1.1.2-rc.1",
   "license": "MIT",
   "exports": {
     ".": {
@@ -28,12 +28,12 @@
     "version": "yarn version"
   },
   "dependencies": {
-    "@radix-ui/primitive": "1.1.0",
-    "@radix-ui/react-compose-refs": "1.1.0",
-    "@radix-ui/react-context": "1.1.1-rc.2",
+    "@radix-ui/primitive": "1.1.1-rc.1",
+    "@radix-ui/react-compose-refs": "1.1.1-rc.1",
+    "@radix-ui/react-context": "1.1.1",
     "@radix-ui/react-id": "1.1.0",
-    "@radix-ui/react-presence": "1.1.1-rc.9",
-    "@radix-ui/react-primitive": "2.0.0",
+    "@radix-ui/react-presence": "1.1.2-rc.1",
+    "@radix-ui/react-primitive": "2.0.1-rc.1",
     "@radix-ui/react-use-controllable-state": "1.1.0",
     "@radix-ui/react-use-layout-effect": "1.1.0"
   },
@@ -59,5 +59,5 @@
   "bugs": {
     "url": "https://github.com/radix-ui/primitives/issues"
   },
-  "stableVersion": "1.1.0"
+  "stableVersion": "1.1.1"
 }