[Progress] Move types to namespaces (#712)

docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.tsx

@@ -19,7 +19,7 @@ export default function UnstyledProgressIntroduction() {
 }
 
 const Progress = React.forwardRef(function Progress(
-  props: BaseProgress.RootProps,
+  props: BaseProgress.Root.Props,
   ref: React.ForwardedRef<HTMLDivElement>,
 ) {
   return (
@@ -39,7 +39,7 @@ const Progress = React.forwardRef(function Progress(
 });
 
 const ProgressTrack = React.forwardRef(function ProgressTrack(
-  props: BaseProgress.TrackProps,
+  props: BaseProgress.Track.Props,
   ref: React.ForwardedRef<HTMLDivElement>,
 ) {
   return (
@@ -59,7 +59,7 @@ const ProgressTrack = React.forwardRef(function ProgressTrack(
 });
 
 const ProgressIndicator = React.forwardRef(function ProgressIndicator(
-  props: BaseProgress.IndicatorProps,
+  props: BaseProgress.Indicator.Props,
   ref: React.ForwardedRef<HTMLDivElement>,
 ) {
   return (

packages/mui-base/src/Progress/Indicator/ProgressIndicator.test.tsx

@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import * as Progress from '@base_ui/react/Progress';
-import { ProgressContext } from '@base_ui/react/Progress';
 import { createRenderer, describeConformance } from '#test-utils';
-import type { ProgressContextValue } from '../Root/ProgressRoot.types';
+import { ProgressRootContext } from '../Root/ProgressRootContext';
 
-const contextValue: ProgressContextValue = {
+const contextValue: ProgressRootContext = {
   direction: 'ltr',
   max: 100,
   min: 0,
@@ -24,7 +23,7 @@ describe('<Progress.Indicator />', () => {
   describeConformance(<Progress.Indicator />, () => ({
     render: (node) => {
       return render(
-        <ProgressContext.Provider value={contextValue}>{node}</ProgressContext.Provider>,
+        <ProgressRootContext.Provider value={contextValue}>{node}</ProgressRootContext.Provider>,
       );
     },
     refInstanceof: window.HTMLSpanElement,

packages/mui-base/src/Progress/Indicator/ProgressIndicator.tsx

@@ -3,9 +3,10 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useComponentRenderer } from '../../utils/useComponentRenderer';
 import { useProgressIndicator } from './useProgressIndicator';
-import { useProgressContext } from '../Root/ProgressContext';
+import { ProgressRoot } from '../Root/ProgressRoot';
+import { useProgressRootContext } from '../Root/ProgressRootContext';
 import { progressStyleHookMapping } from '../Root/styleHooks';
-import { ProgressIndicatorProps } from './ProgressIndicator.types';
+import { BaseUIComponentProps } from '../../utils/types';
 
 /**
  *
@@ -18,12 +19,12 @@ import { ProgressIndicatorProps } from './ProgressIndicator.types';
  * - [ProgressIndicator API](https://base-ui.netlify.app/components/react-progress/#api-reference-ProgressIndicator)
  */
 const ProgressIndicator = React.forwardRef(function ProgressIndicator(
-  props: ProgressIndicatorProps,
+  props: ProgressIndicator.Props,
   forwardedRef: React.ForwardedRef<HTMLSpanElement>,
 ) {
   const { render, className, ...otherProps } = props;
 
-  const { direction, max, min, value, ownerState } = useProgressContext();
+  const { direction, max, min, value, ownerState } = useProgressRootContext();
 
   const { getRootProps } = useProgressIndicator({
     direction,
@@ -45,6 +46,12 @@ const ProgressIndicator = React.forwardRef(function ProgressIndicator(
   return renderElement();
 });
 
+namespace ProgressIndicator {
+  export interface OwnerState extends ProgressRoot.OwnerState {}
+
+  export interface Props extends BaseUIComponentProps<'span', OwnerState> {}
+}
+
 ProgressIndicator.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │

packages/mui-base/src/Progress/Indicator/useProgressIndicator.ts

@@ -1,18 +1,15 @@
 'use client';
 import * as React from 'react';
 import { mergeReactProps } from '../../utils/mergeReactProps';
-import {
-  UseProgressIndicatorParameters,
-  UseProgressIndicatorReturnValue,
-} from './ProgressIndicator.types';
+import { ProgressDirection } from '../Root/useProgressRoot';
 
 function valueToPercent(value: number, min: number, max: number) {
   return ((value - min) * 100) / (max - min);
 }
 
 function useProgressIndicator(
-  parameters: UseProgressIndicatorParameters,
-): UseProgressIndicatorReturnValue {
+  parameters: useProgressIndicator.Parameters,
+): useProgressIndicator.ReturnValue {
   const { direction, max = 100, min = 0, value } = parameters;
 
   const isRtl = direction === 'rtl';
@@ -32,7 +29,7 @@ function useProgressIndicator(
     };
   }, [isRtl, percentageValue]);
 
-  const getRootProps: UseProgressIndicatorReturnValue['getRootProps'] = React.useCallback(
+  const getRootProps: useProgressIndicator.ReturnValue['getRootProps'] = React.useCallback(
     (externalProps = {}) =>
       mergeReactProps<'span'>(externalProps, {
         style: getStyles(),
@@ -45,4 +42,34 @@ function useProgressIndicator(
   };
 }
 
+namespace useProgressIndicator {
+  export interface Parameters {
+    /**
+     * The direction that progress bars fill in
+     * @default 'ltr'
+     */
+    direction?: ProgressDirection;
+    /**
+     * The maximum value
+     * @default 100
+     */
+    max?: number;
+    /**
+     * The minimum value
+     * @default 0
+     */
+    min?: number;
+    /**
+     * The current value. The component is indeterminate when value is `null`.
+     */
+    value: number | null;
+  }
+
+  export interface ReturnValue {
+    getRootProps: (
+      externalProps?: React.ComponentPropsWithRef<'span'>,
+    ) => React.ComponentPropsWithRef<'span'>;
+  }
+}
+
 export { useProgressIndicator };

packages/mui-base/src/Progress/Root/ProgressRoot.test.tsx

@@ -2,9 +2,9 @@ import { expect } from 'chai';
 import * as React from 'react';
 import * as Progress from '@base_ui/react/Progress';
 import { createRenderer, describeConformance } from '#test-utils';
-import type { ProgressRootProps } from './ProgressRoot.types';
+import type { ProgressRoot } from './ProgressRoot';
 
-function TestProgress(props: ProgressRootProps) {
+function TestProgress(props: ProgressRoot.Props) {
   return (
     <Progress.Root {...props}>
       <Progress.Track>

packages/mui-base/src/Progress/Root/ProgressRoot.tsx

@@ -2,14 +2,10 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useComponentRenderer } from '../../utils/useComponentRenderer';
-import { useProgressRoot } from './useProgressRoot';
-import { ProgressContext } from './ProgressContext';
+import { type ProgressDirection, useProgressRoot } from './useProgressRoot';
+import { ProgressRootContext } from './ProgressRootContext';
 import { progressStyleHookMapping } from './styleHooks';
-import {
-  ProgressContextValue,
-  ProgressRootOwnerState,
-  ProgressRootProps,
-} from './ProgressRoot.types';
+import { BaseUIComponentProps } from '../../utils/types';
 
 /**
  *
@@ -22,7 +18,7 @@ import {
  * - [ProgressRoot API](https://base-ui.netlify.app/components/react-progress/#api-reference-ProgressRoot)
  */
 const ProgressRoot = React.forwardRef(function ProgressRoot(
-  props: ProgressRootProps,
+  props: ProgressRoot.Props,
   forwardedRef: React.ForwardedRef<HTMLDivElement>,
 ) {
   const {
@@ -52,7 +48,7 @@ const ProgressRoot = React.forwardRef(function ProgressRoot(
     value,
   });
 
-  const ownerState: ProgressRootOwnerState = React.useMemo(
+  const ownerState: ProgressRoot.OwnerState = React.useMemo(
     () => ({
       direction,
       max,
@@ -62,7 +58,7 @@ const ProgressRoot = React.forwardRef(function ProgressRoot(
     [direction, max, min, progress.state],
   );
 
-  const contextValue: ProgressContextValue = React.useMemo(
+  const contextValue: ProgressRootContext = React.useMemo(
     () => ({
       ...progress,
       ownerState,
@@ -81,10 +77,24 @@ const ProgressRoot = React.forwardRef(function ProgressRoot(
   });
 
   return (
-    <ProgressContext.Provider value={contextValue}>{renderElement()}</ProgressContext.Provider>
+    <ProgressRootContext.Provider value={contextValue}>
+      {renderElement()}
+    </ProgressRootContext.Provider>
   );
 });
 
+namespace ProgressRoot {
+  export type OwnerState = {
+    direction: ProgressDirection;
+    max: number;
+    min: number;
+  };
+
+  export interface Props
+    extends useProgressRoot.Parameters,
+      BaseUIComponentProps<'div', OwnerState> {}
+}
+
 ProgressRoot.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │