@react-md/core 6.0.1 → 6.1.0

package/src/transition/ScaleTransition.tsx

@@ -61,7 +61,7 @@ export interface ScaleTransitionProps<E extends HTMLElement>
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/scale-transition | ScaleTransition Demos}
+ * @see {@link https://react-md.dev/components/scale-transition | ScaleTransition Demos}
  * @typeParam E - The HTMLElement type used or the ref required for the
  * transition.
  * @since 2.0.0

package/src/transition/SkeletonPlaceholder.tsx

@@ -135,7 +135,7 @@ export interface SkeletonPlaceholderProps
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/skeleton-placeholder | SkeletonPlaceholder Demos}
+ * @see {@link https://react-md.dev/components/skeleton-placeholder | SkeletonPlaceholder Demos}
  * @since 6.0.0
  */
 export const SkeletonPlaceholder = forwardRef<

package/src/transition/Slide.tsx

@@ -41,7 +41,7 @@ export interface SlideProps
  * A reasonable default for handling a slide transition using
  * {@link useSlideTransition}.
  *
- * @see {@link https://next.react-md.dev/components/slide | Slide Demos}
+ * @see {@link https://react-md.dev/components/slide | Slide Demos}
  * @see {@link SlideContainer} for example usage.
  * @since 6.0.0
  */

package/src/transition/SlideContainer.tsx

@@ -123,7 +123,7 @@ export interface SlideContainerProps
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/slide | Slide Demos}
+ * @see {@link https://react-md.dev/components/slide | Slide Demos}
  * @since 6.0.0
  */
 export const SlideContainer = forwardRef<HTMLDivElement, SlideContainerProps>(

package/src/transition/useCSSTransition.ts

@@ -155,8 +155,8 @@ import { getTransitionClassNames } from "./utils.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/hooks/use-css-transition | useCSSTransition Demos}
- * @see {@link https://next.react-md.dev/components/css-transition | CSSTransition Demos}
+ * @see {@link https://react-md.dev/hooks/use-css-transition | useCSSTransition Demos}
+ * @see {@link https://react-md.dev/components/css-transition | CSSTransition Demos}
  * @typeParam E - An HTMLElement type used for the ref required for the
  * transition.
  * @since 4.0.0

package/src/transition/useCarousel.ts

@@ -170,7 +170,7 @@ export interface CarouselOptions {
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/carousel | Carousel Demos}
+ * @see {@link https://react-md.dev/components/carousel | Carousel Demos}
  * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/carousel/}
  * @see {@link https://www.w3.org/WAI/ARIA/apg/example-index/carousel/carousel-2-tablist.html}
  * @since 6.0.0

package/src/transition/useCollapseTransition.ts

@@ -278,8 +278,8 @@ export interface CollapseTransitionHookReturnValue<E extends HTMLElement>
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/hooks/use-collapse-transition | useCollapseTransition Demos}
- * @see {@link https://next.react-md.dev/components/collapse | Collapse Demos}
+ * @see {@link https://react-md.dev/hooks/use-collapse-transition | useCollapseTransition Demos}
+ * @see {@link https://react-md.dev/components/collapse | Collapse Demos}
  * @typeParam E - An HTMLElement type used for the ref required for the
  * transition.
  * @since 4.0.0

package/src/transition/useCrossFadeTransition.ts

@@ -69,8 +69,8 @@ export interface CrossFadeTransitionHookOptions<E extends HTMLElement>
  * distance. This is generally used for full page transitions when a route
  * changes.
  *
- * @see {@link https://next.react-md.dev/hooks/use-cross-fade-transition | useCrossFadeTransition Demos}
- * @see {@link https://next.react-md.dev/components/cross-fade | CrossFade Demos}
+ * @see {@link https://react-md.dev/hooks/use-cross-fade-transition | useCrossFadeTransition Demos}
+ * @see {@link https://react-md.dev/components/cross-fade | CrossFade Demos}
  * @typeParam E - An HTMLElement type used for the ref required for the
  * transition.
  * @since 4.0.0

package/src/transition/useScaleTransition.ts

@@ -129,8 +129,8 @@ export interface ScaleTransitionHookOptions<E extends HTMLElement>
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/hooks/use-scale-transition | useScaleTransition Demos}
- * @see {@link https://next.react-md.dev/components/scale | Scale Demos}
+ * @see {@link https://react-md.dev/hooks/use-scale-transition | useScaleTransition Demos}
+ * @see {@link https://react-md.dev/components/scale | Scale Demos}
  * @typeParam E - The HTMLElement type used or the ref required for the
  * transition.
  * @since 4.0.0

package/src/transition/useSkeletonPlaceholder.ts

@@ -218,8 +218,8 @@ export interface SkeletonPlaceholderStylingProps {
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/hooks/use-skeleton-placeholder-transition | useSkeletonPlaceholder Demos}
- * @see {@link https://next.react-md.dev/components/skeleton-placeholder | SkeletonPlaceholder Demos}
+ * @see {@link https://react-md.dev/hooks/use-skeleton-placeholder-transition | useSkeletonPlaceholder Demos}
+ * @see {@link https://react-md.dev/components/skeleton-placeholder | SkeletonPlaceholder Demos}
  * @since 6.0.0
  */
 export function useSkeletonPlaceholder(

package/src/transition/useSlideTransition.ts

@@ -84,7 +84,7 @@ export type SlideTransitionOptions<E extends HTMLElement> =
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/slide | Slide Demos}
+ * @see {@link https://react-md.dev/components/slide | Slide Demos}
  * @see {@link SlideContainer} and {@link Slide} for convenient default
  * implementations.
  * @since 6.0.0

package/src/transition/useTransition.ts

@@ -29,7 +29,7 @@ const noop = (): void => {
  * since this is just a low-level hook that can be used to transition using
  * timeouts.
  *
- * @see {@link https://next.react-md.dev/hooks/use-transition | useTransition Demos}
+ * @see {@link https://react-md.dev/hooks/use-transition | useTransition Demos}
  * @typeParam E - The HTMLElement type used or the ref required for the
  * transition.
  * @since 4.0.0

package/src/tree/DefaultTreeItemRenderer.tsx

@@ -17,7 +17,7 @@ import {
  * Look at the `Tree` component for an example of creating a custom
  * implementation.
  *
- * @see {@link https://next.react-md.dev/components/tree | Tree Demos}
+ * @see {@link https://react-md.dev/components/tree | Tree Demos}
  * @since 6.0.0
  */
 export function DefaultTreeItemRenderer<

package/src/tree/Tree.tsx

@@ -222,7 +222,7 @@ export interface TreeProps<T extends TreeItemNode>
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/tree | Tree Demos}
+ * @see {@link https://react-md.dev/components/tree | Tree Demos}
  * @see {@link TreeProps.renderer} for a custom tree item example.
  * @since 6.0.0 There was a major API change and the `id` is now `optional`.
  * In addition, the following props were removed:

package/src/tree/TreeItem.tsx

@@ -87,7 +87,7 @@ export interface TreeItemProps
 /**
  * **Client Component**
  *
- * @see {@link https://next.react-md.dev/components/tree | Tree Demos}
+ * @see {@link https://react-md.dev/components/tree | Tree Demos}
  * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/treeview/}
  * @since 6.0.0 No longer forwards refs. The ref must be provided using
  * `contentRef` instead.

package/src/tree/useTree.ts

@@ -51,7 +51,7 @@ export interface TreeImplementation extends TreeSelection, TreeExpansion {}
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/tree | Tree Demos}
+ * @see {@link https://react-md.dev/components/tree | Tree Demos}
  * @since 6.0.0
  */
 export function useTree(options: TreeHookOptions = {}): TreeImplementation {

package/src/tree/useTreeExpansion.ts

@@ -17,7 +17,7 @@ export interface TreeExpansion {
 }
 
 /**
- * @see {@link https://next.react-md.dev/components/tree | Tree Demos}
+ * @see {@link https://react-md.dev/components/tree | Tree Demos}
  * @since 6.0.0 Renamed from `useTreeItemExpansion` and uses a Set
  * instead of a list to increase performance.
  */

package/src/tree/useTreeItems.ts

@@ -106,7 +106,7 @@ export interface TreeItems<T extends TreeItemNode> {
  * This is mostly an internal hook, but can be used to build tree-like
  * data structures without the need of the `Tree` component.
  *
- * @see {@link https://next.react-md.dev/components/tree | Tree Demos}
+ * @see {@link https://react-md.dev/components/tree | Tree Demos}
  * @since 6.0.0 converted to use an object argument instead of
  * multiple arguments. Also logs any orphaned items that do not have a parent
  */

package/src/tree/useTreeSelection.ts

@@ -19,7 +19,7 @@ export interface TreeSelection {
 }
 
 /**
- * @see {@link https://next.react-md.dev/components/tree | Tree Demos}
+ * @see {@link https://react-md.dev/components/tree | Tree Demos}
  * @since 6.0.0 Renamed from `useTreeItemSelection` and uses a Set
  * instead of a list to increase performance.
  */

package/src/typography/HighlightText.tsx

@@ -125,7 +125,7 @@ export interface HighlightTextProps {
  * }
  *
  * ```
- * @see {@link https://next.react-md.dev/components/highlight-text | HighlightText Demos}
+ * @see {@link https://react-md.dev/components/highlight-text | HighlightText Demos}
  * @since 6.0.0
  */
 export function HighlightText(

package/src/typography/Mark.tsx

@@ -26,7 +26,7 @@ export interface MarkProps extends HTMLAttributes<HTMLElement> {
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/mark | Mark Demos}
+ * @see {@link https://react-md.dev/components/mark | Mark Demos}
  * @since 6.0.0
  */
 export const Mark = forwardRef<HTMLElement, MarkProps>(

package/src/typography/SrOnly.tsx

@@ -50,7 +50,7 @@ export interface SrOnlyProps extends HTMLAttributes<TypographyHTMLElement> {
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/sr-only | SrOnly Demos}
+ * @see {@link https://react-md.dev/components/sr-only | SrOnly Demos}
  */
 export const SrOnly = forwardRef<TypographyHTMLElement, SrOnlyProps>(
   function SrOnly(props, ref) {

package/src/typography/TextContainer.tsx

@@ -47,7 +47,7 @@ export interface TextContainerProps
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/text-container | TextContainer Demos}
+ * @see {@link https://react-md.dev/components/text-container | TextContainer Demos}
  * @see {@link textContainer} If you only want to apply this class to an
  * element.
  * @since 6.0.0 Removed the `size` option since there is no longer a

package/src/typography/Typography.tsx

@@ -136,7 +136,7 @@ export interface TypographyProps
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/typography | Typography Demos}
+ * @see {@link https://react-md.dev/components/typography | Typography Demos}
  * @since 6.0.0 Removed the children render function behavior . Use the
  * `typography` class name utility instead.
  */

package/src/typography/WritingDirectionProvider.tsx

@@ -195,7 +195,7 @@ export const DEFAULT_WRITING_DIRECTION = (): Dir => {
  * );
  * ```
  *
- * @see {@link https://next.react-md.dev/components/writing-direction-provider | WritingDirectionProvider Demos}
+ * @see {@link https://react-md.dev/components/writing-direction-provider | WritingDirectionProvider Demos}
  * @since 6.0.0 Renamed from `Dir`
  */
 export function WritingDirectionProvider(

package/src/useEnsuredState.ts

@@ -12,6 +12,7 @@ export interface EnsuredStateOptions<
   V,
   Setter extends Dispatch<V> | UseStateSetter<V> = UseStateSetter<V>,
 > {
+  name?: string;
   value?: V;
   setValue?: Setter;
   defaultValue?: UseStateInitializer<V>;
@@ -30,20 +31,22 @@ export function useEnsuredState<
 >(
   options: EnsuredStateOptions<V, Setter>
 ): readonly [value: V, setValue: Setter] {
-  const { value, setValue, defaultValue } = options;
+  const { name = "value", value, setValue, defaultValue } = options;
   if (typeof value !== "undefined" && typeof setValue !== "undefined") {
     return [value, setValue];
   }
 
   if (typeof value !== "undefined" || typeof setValue !== "undefined") {
+    const pascalName = name.charAt(0).toUpperCase() + name.substring(1);
     throw new Error(
-      "Both a `value` and `setValue` must be defined for controlled components."
+      `Both a \`${name}\` and \`set${pascalName}\` must be defined for controlled components.`
     );
   }
 
   if (typeof defaultValue === "undefined") {
+    const pascalName = name.charAt(0).toUpperCase() + name.substring(1);
     throw new Error(
-      "A `defaultValue` must be defined for uncontrolled components."
+      `A \`default${pascalName}\` must be defined for uncontrolled components.`
     );
   }
 

package/src/utils/RenderRecursively.tsx

@@ -244,7 +244,7 @@ export interface RenderRecursivelyProps<
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/render-recursively | RenderRecursively Demos}
+ * @see {@link https://react-md.dev/components/render-recursively | RenderRecursively Demos}
  * @since 6.0.0
  */
 export function RenderRecursively<Item, Data>(

package/src/utils/bem.ts

@@ -8,7 +8,7 @@ function modify(base: string, modifier?: BEMModifier): string {
   const hasOwn = Object.prototype.hasOwnProperty;
   return Object.keys(modifier).reduce((s, mod) => {
     if (hasOwn.call(modifier, mod) && modifier[mod]) {
-      s = `${s} ${base}--${mod}`;
+      return `${s} ${base}--${mod}`;
     }
 
     return s;

package/src/utils/parseCssLengthUnit.ts

@@ -43,6 +43,10 @@ export function parseCssLengthUnit(options: ParseCssLengthUnitOptions): number {
     return value;
   }
 
+  if (value.includes("calc")) {
+    throw new Error(`Unable to parse a unit with \`calc\`: "${value}"`);
+  }
+
   const parsed = parseFloat(value);
   if (/px$/i.test(value)) {
     return parsed;

package/src/window-splitter/WindowSplitter.tsx

@@ -92,7 +92,7 @@ export type WindowSplitterProps = LabelRequiredForA11y<BaseWindowSplitterProps>;
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/window-splitter | WindowSplitter Demos}
+ * @see {@link https://react-md.dev/components/window-splitter | WindowSplitter Demos}
  * @since 6.0.0
  */
 export const WindowSplitter = forwardRef<