@react-md/core 1.0.0-next.14 → 1.0.0-next.15

package/src/tooltip/useTooltip.ts

@@ -1,25 +1,34 @@
 "use client";
 import { cnb } from "cnbuilder";
-import type {
-  CSSProperties,
-  FocusEvent,
-  MouseEvent,
-  MutableRefObject,
-  Ref,
-  RefObject,
-  TouchEvent,
+import {
+  useCallback,
+  useEffect,
+  useId,
+  useRef,
+  type CSSProperties,
+  type FocusEvent,
+  type MouseEvent,
+  type MutableRefObject,
+  type Ref,
+  type RefObject,
+  type TouchEvent,
 } from "react";
-import { useCallback, useEffect, useId, useRef } from "react";
 import {
   useHoverMode,
   type ControlledHoverModeImplementation,
 } from "../hoverMode/useHoverMode.js";
-import type { UserInteractionMode } from "../interaction/UserInteractionModeProvider.js";
-import { useUserInteractionMode } from "../interaction/UserInteractionModeProvider.js";
-import type { SimplePosition } from "../positioning/types.js";
-import type { FixedPositioningTransitionCallbacks } from "../positioning/useFixedPositioning.js";
-import { useFixedPositioning } from "../positioning/useFixedPositioning.js";
-import type { UseStateSetter } from "../types.js";
+import {
+  useUserInteractionMode,
+  type UserInteractionMode,
+} from "../interaction/UserInteractionModeProvider.js";
+import { type SimplePosition } from "../positioning/types.js";
+import {
+  useFixedPositioning,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  type FixedPositioningOptions,
+  type FixedPositioningTransitionCallbacks,
+} from "../positioning/useFixedPositioning.js";
+import { type UseStateSetter } from "../types.js";
 import { usePageInactive } from "../usePageInactive.js";
 import { parseCssLengthUnit } from "../utils/parseCssLengthUnit.js";
 import { useTooltipHoverMode } from "./TooltipHoverModeProvider.js";
@@ -31,8 +40,10 @@ import {
   DEFAULT_TOOLTIP_THRESHOLD,
   TOOLTIP_SPACING_VAR,
 } from "./constants.js";
-import type { TooltipPositionHookOptions } from "./useTooltipPosition.js";
-import { useTooltipPosition } from "./useTooltipPosition.js";
+import {
+  useTooltipPosition,
+  type TooltipPositionHookOptions,
+} from "./useTooltipPosition.js";
 import { getAnchor } from "./utils.js";
 
 declare module "react" {
@@ -52,35 +63,46 @@ export interface TooltipPositioningOptions {
   style?: CSSProperties;
 
   /**
-   * @defaultValue `DEFAULT_TOOLTIP_MARGIN`
-   * @see {@link DEFAULT_TOOLTIP_MARGIN}
+   * @see {@link FixedPositioningOptions.vwMargin}
+   * @defaultValue `16`
    */
   vwMargin?: number;
 
   /**
-   * @defaultValue `DEFAULT_TOOLTIP_MARGIN`
-   * @see {@link DEFAULT_TOOLTIP_MARGIN}
+   * @see {@link FixedPositioningOptions.vhMargin}
+   * @defaultValue `16`
    */
   vhMargin?: number;
 
   /**
+   * Set this to `true` to reduce the font size and padding on the tooltip and
+   * the amount of spacing between the tooltipped element and the tooltip.
+   *
    * @defaultValue `false`
    */
   dense?: boolean;
 
   /**
-   * @defaultValue `DEFAULT_TOOLTIP_SPACING`
-   * @see {@link DEFAULT_TOOLTIP_SPACING}
+   * The amount of spacing to use between the tooltipped element and the tooltip
+   * when {@link disableAutoSpacing} is `false`.
+   *
+   * @defaultValue `"1.5rem`
    */
   spacing?: number | string;
 
   /**
-   * @defaultValue `DEFAULT_TOOLTIP_DENSE_SPACING`
-   * @see {@link DEFAULT_TOOLTIP_DENSE_SPACING}
+   * The amount of spacing to use between the tooltipped element and the tooltip
+   * when {@link disableAutoSpacing} is `false` and {@link dense} is `true`.
+   *
+   * @defaultValue `"0.875rem`
    */
   denseSpacing?: number | string;
 
   /**
+   * Set this to `true` to prevent the {@link defaultPosition} to swap to the
+   * other side of the tooltipped element when it is too close to the viewport
+   * edge. This will always be `true` if a {@link position} is provided.
+   *
    * @defaultValue `false`
    */
   disableSwapping?: boolean;
@@ -109,7 +131,10 @@ export interface TooltippedElementEventHandlers<
   onContextMenu?(event: MouseEvent<E>): void;
 }
 
-/** @since 2.8.0 */
+/**
+ * @since 2.8.0
+ * @since 6.0.0 Renamed from `TooltipHookProvidedElementProps`
+ */
 export interface ProvidedTooltippedElementProps<E extends HTMLElement>
   extends Required<TooltippedElementEventHandlers<E>> {
   "aria-describedby": string | undefined;
@@ -206,7 +231,7 @@ export interface TooltipOptions<
    * The default value is really the current hover timeout from the
    * `TooltipHoverModeProvider`.
    *
-   * @defaultValue `DEFAULT_TOOLTIP_DELAY`
+   * @defaultValue `1000`
    */
   hoverTimeout?: number;
 

package/src/tooltip/useTooltipPosition.ts

@@ -30,8 +30,7 @@ export interface TooltipPositionHookOptions {
    * Vertical - `"below"` or `"above"`
    * Horizontal - `"left"` or `"right"`
    *
-   * @defaultValue `DEFAULT_TOOLTIP_POSITION`
-   * @see {@link DEFAULT_TOOLTIP_POSITION}
+   * @defaultValue `"below"`
    */
   defaultPosition?: SimplePosition;
 
@@ -42,8 +41,7 @@ export interface TooltipPositionHookOptions {
    *
    * You _probably_ won't ever really need to update this value.
    *
-   * @defaultValue `DEFAULT_TOOLTIP_THRESHOLD`
-   * @see {@link DEFAULT_TOOLTIP_THRESHOLD}
+   * @defaultValue `0.75`
    */
   threshold?: number;
 }

package/src/transition/types.ts

@@ -370,13 +370,31 @@ export interface PreconfiguredCSSTransitionOptions<E extends HTMLElement>
   transitionIn: boolean;
 }
 
+/**
+ * @since 6.0.0
+ */
+export interface SSRTransitionOptions {
+  /**
+   * This is mostly used internally to make it so that you can render portalled
+   * elements inline with content if SSR is enabled in your app. To enable this
+   * feature, the {@link CoreProvidersProps.ssr} must be set to `true`.
+   *
+   * This value will be `true` if a portalled element was rendered by default
+   * from the server and remain true until it unmounts from the DOM.
+   *
+   * @defaultValue `false`
+   */
+  disablePortal?: boolean;
+}
+
 /**
  * @typeParam E - An HTMLElement type used for the ref required for the
  * transition.
  * @since 4.0.0
  */
 export interface TransitionHookOptions<E extends HTMLElement>
-  extends TransitionOptions<E> {
+  extends TransitionOptions<E>,
+    SSRTransitionOptions {
   /**
    * Boolean if the DOM should forcefully be reflow each time a transition
    * change occurs. This is generally required for any CSS transition and is
@@ -385,12 +403,6 @@ export interface TransitionHookOptions<E extends HTMLElement>
    * @defaultValue `false`
    */
   reflow?: boolean;
-
-  /**
-   * @since 6.0.0
-   * @defaultValue `false`
-   */
-  disablePortal?: boolean;
 }
 
 /**
@@ -422,7 +434,8 @@ export interface TransitionState {
  * @since 4.0.0
  */
 export interface TransitionHookReturnValue<E extends HTMLElement>
-  extends TransitionState {
+  extends TransitionState,
+    Required<SSRTransitionOptions> {
   /**
    * A ref that is required for the transition to occur and should be passed to
    * the element affected by the transition.
@@ -466,19 +479,6 @@ export interface TransitionHookReturnValue<E extends HTMLElement>
    * @param stage - The {@link TransitionStage} to set to
    */
   transitionTo(stage: TransitionStage): void;
-
-  /**
-   * This is mostly used internally to make it so that you can render portalled
-   * elements inline with content if SSR is enabled in your app. To enable this
-   * feature, the {@link CoreProvidersProps.ssr} must be set to `true`.
-   *
-   * This value will be `true` if a portalled element was rendered by default
-   * from the server and remain true until it unmounts from the DOM.
-   *
-   * @defaultValue `false`
-   * @since 6.0.0
-   */
-  disablePortal: boolean;
 }
 
 /**
@@ -487,16 +487,12 @@ export interface TransitionHookReturnValue<E extends HTMLElement>
  * @since 4.0.0
  */
 export interface CSSTransitionHookOptions<E extends HTMLElement>
-  extends PreconfiguredCSSTransitionOptions<E> {
+  extends PreconfiguredCSSTransitionOptions<E>,
+    SSRTransitionOptions {
   /** {@inheritDoc TransitionTimeout} */
   timeout: TransitionTimeout;
   /** {@inheritDoc CSSTransitionClassNames} */
   classNames: CSSTransitionClassNames;
-
-  /**
-   * @since 6.0.0
-   */
-  disablePortal?: boolean;
 }
 
 /**

package/src/transition/useTransition.ts

@@ -30,6 +30,7 @@ const noop = (): void => {
  * @typeParam E - The HTMLElement type used or the ref required for the
  * transition.
  * @since 4.0.0
+ * @since 6.0.0 Added the `disablePortal` flag to the return value for SSR.
  */
 export function useTransition<E extends HTMLElement>(
   options: TransitionHookOptions<E>

package/src/tree/useTree.ts

@@ -1,9 +1,7 @@
 "use client";
-import type { TreeItemDefaultIds } from "./types.js";
-import type { TreeExpansion } from "./useTreeExpansion.js";
-import { useTreeExpansion } from "./useTreeExpansion.js";
-import type { TreeSelection } from "./useTreeSelection.js";
-import { useTreeSelection } from "./useTreeSelection.js";
+import { type TreeItemDefaultIds } from "./types.js";
+import { useTreeExpansion, type TreeExpansion } from "./useTreeExpansion.js";
+import { useTreeSelection, type TreeSelection } from "./useTreeSelection.js";
 
 /**
  * @since 6.0.0

package/src/typography/TextContainer.tsx

@@ -7,6 +7,8 @@ import {
 /**
  * @since 6.0.0 Removed the `size` option since there is no longer a
  * different line-length for mobile and desktop.
+ * @since 6.0.0 Removed the `clone` prop and the children render function
+ * behavior. Use the `textContainer` class name utility instead.
  */
 export interface TextContainerProps
   extends HTMLAttributes<HTMLDivElement>,
@@ -42,6 +44,8 @@ export interface TextContainerProps
  * element.
  * @since 6.0.0 Removed the `size` option since there is no longer a
  * different line-length for mobile and desktop.
+ * @since 6.0.0 Removed the `clone` prop and the children render function
+ * behavior. Use the `textContainer` class name utility instead.
  */
 export const TextContainer = forwardRef<HTMLDivElement, TextContainerProps>(
   function TextContainer(props, ref) {

package/src/typography/Typography.tsx

@@ -65,6 +65,11 @@ function getComponent(
   }
 }
 
+/**
+ * @since 6.0.0 Renamed `component` to `as`.
+ * @since 6.0.0 Removed the children render function behavior. Use the
+ * `typography` class name utility instead.
+ */
 export interface TypographyProps
   extends HTMLAttributes<TypographyHTMLElement>,
     TypographyClassNameOptions {
@@ -85,6 +90,8 @@ export interface TypographyProps
    * - `"body-2"     -> <p>`
    * - `"caption"    -> <caption>`
    * - `"overline"   -> <span>`
+   *
+   * @since 6.0.0 Renamed from `component`
    */
   as?: CustomTypographyComponent;
 }
@@ -129,6 +136,9 @@ export interface TypographyProps
  *   ):
  * }
  * ```
+ *
+ * @since 6.0.0 Removed the children render function behavior . Use the
+ * `typography` class name utility instead.
  */
 export const Typography = forwardRef<TypographyHTMLElement, TypographyProps>(
   function Typography(props, ref): ReactElement {

package/src/useResizeListener.ts

@@ -2,7 +2,7 @@
 import { useEffect } from "react";
 import { delegateEvent } from "./delegateEvent.js";
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { useResizeObserver } from "./useResizeObserver.js";
+import { type useResizeObserver } from "./useResizeObserver.js";
 
 /**
  * @since 6.0.0  Updated the API