@react-md/core 6.5.2 → 7.0.0

package/dist/segmented-button/SegmentedButtonContainer.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { segmentedButtonContainer } from "./segmentedButtonContainerStyles.js";
 /**
  * Simple wrapper `div` to apply the segmented button container styles. You can
@@ -11,7 +10,7 @@ import { segmentedButtonContainer } from "./segmentedButtonContainerStyles.js";
  * import { segmentedButtonContainer } from "@react-md/core/segmented-button/SegmentedButtonContainer";
  * import type { ReactElement } from "react";
  *
- * import { CustomWrapperComponent } from "./CustomWrapperComponent.jsx";
+ * import { CustomWrapperComponent } from "./CustomWrapperComponent.js";
  *
  * function Example(): ReactElement {
  *   return (
@@ -26,8 +25,8 @@ import { segmentedButtonContainer } from "./segmentedButtonContainerStyles.js";
  *
  * @see {@link https://react-md.dev/components/segmented-button | SegmentedButton Demos}
  * @since 6.0.0
- */ export const SegmentedButtonContainer = /*#__PURE__*/ forwardRef(function SegmentedButtonContainer(props, ref) {
-    const { className, disableFullWidth, children, ...remaining } = props;
+ */ export function SegmentedButtonContainer(props) {
+    const { ref, className, disableFullWidth, children, ...remaining } = props;
     return /*#__PURE__*/ _jsx("div", {
         ...remaining,
         ref: ref,
@@ -37,6 +36,6 @@ import { segmentedButtonContainer } from "./segmentedButtonContainerStyles.js";
         }),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=SegmentedButtonContainer.js.map

package/dist/segmented-button/SegmentedButtonContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/segmented-button/SegmentedButtonContainer.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport {\n  type SegmentedButtonContainerClassNameOptions,\n  segmentedButtonContainer,\n} from \"./segmentedButtonContainerStyles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface SegmentedButtonContainerProps\n  extends\n    HTMLAttributes<HTMLDivElement>,\n    SegmentedButtonContainerClassNameOptions {\n  children: ReactNode;\n}\n\n/**\n * Simple wrapper `div` to apply the segmented button container styles. You can\n * just use the {@link segmentedButtonContainer} util function instead.\n *\n * @example Without This Component\n * ```tsx\n * import { SegmentedButton } from \"@react-md/core/segmented-button/SegmentedButton\";\n * import { segmentedButtonContainer } from \"@react-md/core/segmented-button/SegmentedButtonContainer\";\n * import type { ReactElement } from \"react\";\n *\n * import { CustomWrapperComponent } from \"./CustomWrapperComponent.jsx\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <CustomWrapperComponent className={segmentedButtonContainer()}>\n *       <SegmentedButton>One</SegmentedButton>\n *       <SegmentedButton>Two</SegmentedButton>\n *       <SegmentedButton>Three</SegmentedButton>\n *     </CustomWrapperComponent>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/segmented-button | SegmentedButton Demos}\n * @since 6.0.0\n */\nexport const SegmentedButtonContainer = forwardRef<\n  HTMLDivElement,\n  SegmentedButtonContainerProps\n>(function SegmentedButtonContainer(props, ref) {\n  const { className, disableFullWidth, children, ...remaining } = props;\n\n  return (\n    <div\n      {...remaining}\n      ref={ref}\n      className={segmentedButtonContainer({\n        className,\n        disableFullWidth,\n      })}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["forwardRef","segmentedButtonContainer","SegmentedButtonContainer","props","ref","className","disableFullWidth","children","remaining","div"],"mappings":";AAAA,SAA8CA,UAAU,QAAQ,QAAQ;AAExE,SAEEC,wBAAwB,QACnB,sCAAsC;AAY7C;;;;;;;;;;;;;;;;;;;;;;;;;CAyBC,GACD,OAAO,MAAMC,yCAA2BF,WAGtC,SAASE,yBAAyBC,KAAK,EAAEC,GAAG;IAC5C,MAAM,EAAEC,SAAS,EAAEC,gBAAgB,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGL;IAEhE,qBACE,KAACM;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLC,WAAWJ,yBAAyB;YAClCI;YACAC;QACF;kBAECC;;AAGP,GAAG"}
+{"version":3,"sources":["../../src/segmented-button/SegmentedButtonContainer.tsx"],"sourcesContent":["import {\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n} from \"react\";\n\nimport {\n  type SegmentedButtonContainerClassNameOptions,\n  segmentedButtonContainer,\n} from \"./segmentedButtonContainerStyles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface SegmentedButtonContainerProps\n  extends\n    HTMLAttributes<HTMLDivElement>,\n    SegmentedButtonContainerClassNameOptions {\n  ref?: Ref<HTMLDivElement>;\n\n  children: ReactNode;\n}\n\n/**\n * Simple wrapper `div` to apply the segmented button container styles. You can\n * just use the {@link segmentedButtonContainer} util function instead.\n *\n * @example Without This Component\n * ```tsx\n * import { SegmentedButton } from \"@react-md/core/segmented-button/SegmentedButton\";\n * import { segmentedButtonContainer } from \"@react-md/core/segmented-button/SegmentedButtonContainer\";\n * import type { ReactElement } from \"react\";\n *\n * import { CustomWrapperComponent } from \"./CustomWrapperComponent.js\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <CustomWrapperComponent className={segmentedButtonContainer()}>\n *       <SegmentedButton>One</SegmentedButton>\n *       <SegmentedButton>Two</SegmentedButton>\n *       <SegmentedButton>Three</SegmentedButton>\n *     </CustomWrapperComponent>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/segmented-button | SegmentedButton Demos}\n * @since 6.0.0\n */\nexport function SegmentedButtonContainer(\n  props: SegmentedButtonContainerProps\n): ReactElement {\n  const { ref, className, disableFullWidth, children, ...remaining } = props;\n\n  return (\n    <div\n      {...remaining}\n      ref={ref}\n      className={segmentedButtonContainer({\n        className,\n        disableFullWidth,\n      })}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["segmentedButtonContainer","SegmentedButtonContainer","props","ref","className","disableFullWidth","children","remaining","div"],"mappings":";AAOA,SAEEA,wBAAwB,QACnB,sCAAsC;AAc7C;;;;;;;;;;;;;;;;;;;;;;;;;CAyBC,GACD,OAAO,SAASC,yBACdC,KAAoC;IAEpC,MAAM,EAAEC,GAAG,EAAEC,SAAS,EAAEC,gBAAgB,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGL;IAErE,qBACE,KAACM;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLC,WAAWJ,yBAAyB;YAClCI;YACAC;QACF;kBAECC;;AAGP"}

package/dist/sheet/Sheet.d.ts

@@ -1,3 +1,4 @@
+import { type ReactElement } from "react";
 import { type BaseDialogProps } from "../dialog/Dialog.js";
 import { type LabelRequiredForA11y } from "../types.js";
 import { type BaseSheetClassNameOptions } from "./styles.js";
@@ -51,4 +52,4 @@ export type SheetProps = LabelRequiredForA11y<BaseSheetProps>;
  *
  * @see {@link https://react-md.dev/components/sheet | Sheet Demos}
  */
-export declare const Sheet: import("react").ForwardRefExoticComponent<SheetProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function Sheet(props: SheetProps): ReactElement;

package/dist/sheet/Sheet.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { Dialog } from "../dialog/Dialog.js";
 import { DEFAULT_SHEET_CLASSNAMES, DEFAULT_SHEET_TIMEOUT, sheet } from "./styles.js";
 /**
@@ -31,8 +30,8 @@ import { DEFAULT_SHEET_CLASSNAMES, DEFAULT_SHEET_TIMEOUT, sheet } from "./styles
  * ```
  *
  * @see {@link https://react-md.dev/components/sheet | Sheet Demos}
- */ export const Sheet = /*#__PURE__*/ forwardRef(function Sheet(props, ref) {
-    const { role = "dialog", className, position = "left", horizontalSize = "media", verticalSize = "recommended", timeout = DEFAULT_SHEET_TIMEOUT, classNames = DEFAULT_SHEET_CLASSNAMES, visible, temporary = true, exitedHidden = true, raised, children, ...remaining } = props;
+ */ export function Sheet(props) {
+    const { ref, role = "dialog", className, position = "left", horizontalSize = "media", verticalSize = "recommended", timeout = DEFAULT_SHEET_TIMEOUT, classNames = DEFAULT_SHEET_CLASSNAMES, visible, temporary = true, exitedHidden = true, raised, children, ...remaining } = props;
     const { disableOverlay } = props;
     return /*#__PURE__*/ _jsx(Dialog, {
         ...remaining,
@@ -53,6 +52,6 @@ import { DEFAULT_SHEET_CLASSNAMES, DEFAULT_SHEET_TIMEOUT, sheet } from "./styles
         }),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=Sheet.js.map

package/dist/sheet/Sheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/sheet/Sheet.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { type BaseDialogProps, Dialog } from \"../dialog/Dialog.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport {\n  type BaseSheetClassNameOptions,\n  DEFAULT_SHEET_CLASSNAMES,\n  DEFAULT_SHEET_TIMEOUT,\n  sheet,\n} from \"./styles.js\";\n\n/**\n * @since 6.0.0\n */\nexport type SheetDialogProps = Omit<BaseDialogProps, \"role\" | \"type\" | \"modal\">;\n\n/**\n * @since 6.0.0 extends the `SheetDialogProps` instead of `AllowedDialogProps`\n * and exports the `SheetDialogProps`.\n */\nexport interface BaseSheetProps\n  extends SheetDialogProps, BaseSheetClassNameOptions {\n  /**\n   * @defaultValue `\"dialog\"`\n   */\n  role?: \"dialog\" | \"menu\" | \"none\";\n\n  /**\n   * @defaultValue `true`\n   * @see {@link SheetDialogProps.exitedHidden}\n   * @since 6.0.0\n   */\n  exitedHidden?: boolean;\n}\n\nexport type SheetProps = LabelRequiredForA11y<BaseSheetProps>;\n\n/**\n * **Client Component**\n *\n * The `Sheet` component is a {@link Dialog} that is fixed to the top, right,\n * bottom, or left of the viewport.\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Sheet } from \"@react-md/core/sheet/Sheet\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import { type ReactElement } from \"react\";\n *\n * export function Example(): ReactElement {\n *   const { toggled, disable, enable } = useToggle();\n *\n *   return (\n *     <>\n *       <Button onClick={enable}>Show</Button>\n *       <Sheet aria-label=\"Customization\" visible={toggled} onRequestClose={disable}>\n *         Whatever Content\n *       </Sheet>\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/sheet | Sheet Demos}\n */\nexport const Sheet = forwardRef<HTMLDivElement, SheetProps>(\n  function Sheet(props, ref) {\n    const {\n      role = \"dialog\",\n      className,\n      position = \"left\",\n      horizontalSize = \"media\",\n      verticalSize = \"recommended\",\n      timeout = DEFAULT_SHEET_TIMEOUT,\n      classNames = DEFAULT_SHEET_CLASSNAMES,\n      visible,\n      temporary = true,\n      exitedHidden = true,\n      raised,\n      children,\n      ...remaining\n    } = props;\n    const { disableOverlay } = props;\n\n    return (\n      <Dialog\n        {...remaining}\n        ref={ref}\n        role={role}\n        type=\"custom\"\n        timeout={timeout}\n        classNames={classNames}\n        visible={visible}\n        temporary={temporary}\n        exitedHidden={exitedHidden}\n        className={sheet({\n          raised: raised ?? !disableOverlay,\n          position,\n          horizontalSize,\n          verticalSize,\n          className,\n        })}\n      >\n        {children}\n      </Dialog>\n    );\n  }\n);\n"],"names":["forwardRef","Dialog","DEFAULT_SHEET_CLASSNAMES","DEFAULT_SHEET_TIMEOUT","sheet","Sheet","props","ref","role","className","position","horizontalSize","verticalSize","timeout","classNames","visible","temporary","exitedHidden","raised","children","remaining","disableOverlay","type"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAA+BC,MAAM,QAAQ,sBAAsB;AAEnE,SAEEC,wBAAwB,EACxBC,qBAAqB,EACrBC,KAAK,QACA,cAAc;AA4BrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BC,GACD,OAAO,MAAMC,sBAAQL,WACnB,SAASK,MAAMC,KAAK,EAAEC,GAAG;IACvB,MAAM,EACJC,OAAO,QAAQ,EACfC,SAAS,EACTC,WAAW,MAAM,EACjBC,iBAAiB,OAAO,EACxBC,eAAe,aAAa,EAC5BC,UAAUV,qBAAqB,EAC/BW,aAAaZ,wBAAwB,EACrCa,OAAO,EACPC,YAAY,IAAI,EAChBC,eAAe,IAAI,EACnBC,MAAM,EACNC,QAAQ,EACR,GAAGC,WACJ,GAAGd;IACJ,MAAM,EAAEe,cAAc,EAAE,GAAGf;IAE3B,qBACE,KAACL;QACE,GAAGmB,SAAS;QACbb,KAAKA;QACLC,MAAMA;QACNc,MAAK;QACLT,SAASA;QACTC,YAAYA;QACZC,SAASA;QACTC,WAAWA;QACXC,cAAcA;QACdR,WAAWL,MAAM;YACfc,QAAQA,UAAU,CAACG;YACnBX;YACAC;YACAC;YACAH;QACF;kBAECU;;AAGP,GACA"}
+{"version":3,"sources":["../../src/sheet/Sheet.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement } from \"react\";\n\nimport { type BaseDialogProps, Dialog } from \"../dialog/Dialog.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport {\n  type BaseSheetClassNameOptions,\n  DEFAULT_SHEET_CLASSNAMES,\n  DEFAULT_SHEET_TIMEOUT,\n  sheet,\n} from \"./styles.js\";\n\n/**\n * @since 6.0.0\n */\nexport type SheetDialogProps = Omit<BaseDialogProps, \"role\" | \"type\" | \"modal\">;\n\n/**\n * @since 6.0.0 extends the `SheetDialogProps` instead of `AllowedDialogProps`\n * and exports the `SheetDialogProps`.\n */\nexport interface BaseSheetProps\n  extends SheetDialogProps, BaseSheetClassNameOptions {\n  /**\n   * @defaultValue `\"dialog\"`\n   */\n  role?: \"dialog\" | \"menu\" | \"none\";\n\n  /**\n   * @defaultValue `true`\n   * @see {@link SheetDialogProps.exitedHidden}\n   * @since 6.0.0\n   */\n  exitedHidden?: boolean;\n}\n\nexport type SheetProps = LabelRequiredForA11y<BaseSheetProps>;\n\n/**\n * **Client Component**\n *\n * The `Sheet` component is a {@link Dialog} that is fixed to the top, right,\n * bottom, or left of the viewport.\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Sheet } from \"@react-md/core/sheet/Sheet\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import { type ReactElement } from \"react\";\n *\n * export function Example(): ReactElement {\n *   const { toggled, disable, enable } = useToggle();\n *\n *   return (\n *     <>\n *       <Button onClick={enable}>Show</Button>\n *       <Sheet aria-label=\"Customization\" visible={toggled} onRequestClose={disable}>\n *         Whatever Content\n *       </Sheet>\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/sheet | Sheet Demos}\n */\nexport function Sheet(props: SheetProps): ReactElement {\n  const {\n    ref,\n    role = \"dialog\",\n    className,\n    position = \"left\",\n    horizontalSize = \"media\",\n    verticalSize = \"recommended\",\n    timeout = DEFAULT_SHEET_TIMEOUT,\n    classNames = DEFAULT_SHEET_CLASSNAMES,\n    visible,\n    temporary = true,\n    exitedHidden = true,\n    raised,\n    children,\n    ...remaining\n  } = props;\n  const { disableOverlay } = props;\n\n  return (\n    <Dialog\n      {...remaining}\n      ref={ref}\n      role={role}\n      type=\"custom\"\n      timeout={timeout}\n      classNames={classNames}\n      visible={visible}\n      temporary={temporary}\n      exitedHidden={exitedHidden}\n      className={sheet({\n        raised: raised ?? !disableOverlay,\n        position,\n        horizontalSize,\n        verticalSize,\n        className,\n      })}\n    >\n      {children}\n    </Dialog>\n  );\n}\n"],"names":["Dialog","DEFAULT_SHEET_CLASSNAMES","DEFAULT_SHEET_TIMEOUT","sheet","Sheet","props","ref","role","className","position","horizontalSize","verticalSize","timeout","classNames","visible","temporary","exitedHidden","raised","children","remaining","disableOverlay","type"],"mappings":"AAAA;;AAIA,SAA+BA,MAAM,QAAQ,sBAAsB;AAEnE,SAEEC,wBAAwB,EACxBC,qBAAqB,EACrBC,KAAK,QACA,cAAc;AA4BrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BC,GACD,OAAO,SAASC,MAAMC,KAAiB;IACrC,MAAM,EACJC,GAAG,EACHC,OAAO,QAAQ,EACfC,SAAS,EACTC,WAAW,MAAM,EACjBC,iBAAiB,OAAO,EACxBC,eAAe,aAAa,EAC5BC,UAAUV,qBAAqB,EAC/BW,aAAaZ,wBAAwB,EACrCa,OAAO,EACPC,YAAY,IAAI,EAChBC,eAAe,IAAI,EACnBC,MAAM,EACNC,QAAQ,EACR,GAAGC,WACJ,GAAGd;IACJ,MAAM,EAAEe,cAAc,EAAE,GAAGf;IAE3B,qBACE,KAACL;QACE,GAAGmB,SAAS;QACbb,KAAKA;QACLC,MAAMA;QACNc,MAAK;QACLT,SAASA;QACTC,YAAYA;QACZC,SAASA;QACTC,WAAWA;QACXC,cAAcA;QACdR,WAAWL,MAAM;YACfc,QAAQA,UAAU,CAACG;YACnBX;YACAC;YACAC;YACAH;QACF;kBAECU;;AAGP"}

package/dist/snackbar/Snackbar.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentType, type HTMLAttributes } from "react";
+import { type ComponentType, type HTMLAttributes, type ReactElement, type Ref } from "react";
 import { type ToastRendererProps } from "./DefaultToastRenderer.js";
 import { type ConfigurableToastProps } from "./Toast.js";
 import { type SnackbarPosition } from "./snackbarStyles.js";
@@ -6,6 +6,7 @@ import { type SnackbarPosition } from "./snackbarStyles.js";
  * @since 6.0.0 The `id` prop is optional
  */
 export interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {
+    ref?: Ref<HTMLDivElement>;
     /** @defaultValue `"snackbar-" + useId()` */
     id?: string;
     /**
@@ -130,4 +131,4 @@ export interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {
  * @since 6.0.0 Rewritten to use a new API that supports adding toasts
  * outside of React components and rendering multiple toasts at once.
  */
-export declare const Snackbar: import("react").ForwardRefExoticComponent<SnackbarProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function Snackbar(props: SnackbarProps): ReactElement;

package/dist/snackbar/Snackbar.js

@@ -1,7 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
-import { forwardRef } from "react";
 import { Portal } from "../portal/Portal.js";
 import { useEnsuredId } from "../useEnsuredId.js";
 import { DefaultToastRenderer } from "./DefaultToastRenderer.js";
@@ -38,8 +37,8 @@ import { snackbar } from "./snackbarStyles.js";
  * implementation.
  * @since 6.0.0 Rewritten to use a new API that supports adding toasts
  * outside of React components and rendering multiple toasts at once.
- */ export const Snackbar = /*#__PURE__*/ forwardRef(function Snackbar(props, ref) {
-    const { id: propId, className, limit = 1, absolute, position = "bottom", renderToast: RenderToast = DefaultToastRenderer, disablePortal, toastDefaults, ...remaining } = props;
+ */ export function Snackbar(props) {
+    const { ref, id: propId, className, limit = 1, absolute, position = "bottom", renderToast: RenderToast = DefaultToastRenderer, disablePortal, toastDefaults, ...remaining } = props;
     const id = useEnsuredId(propId, "snackbar");
     const queue = useToastQueue(limit);
     return /*#__PURE__*/ _jsx(Portal, {
@@ -60,6 +59,6 @@ import { snackbar } from "./snackbarStyles.js";
                 }))
         })
     });
-});
+}
 
 //# sourceMappingURL=Snackbar.js.map

package/dist/snackbar/Snackbar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/snackbar/Snackbar.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ComponentType, type HTMLAttributes, forwardRef } from \"react\";\n\nimport { Portal } from \"../portal/Portal.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n  DefaultToastRenderer,\n  type ToastRendererProps,\n} from \"./DefaultToastRenderer.js\";\nimport { type ConfigurableToastProps } from \"./Toast.js\";\nimport { useToastQueue } from \"./ToastManagerProvider.js\";\nimport { type SnackbarPosition, snackbar } from \"./snackbarStyles.js\";\n\n/**\n * @since 6.0.0 The `id` prop is optional\n */\nexport interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {\n  /** @defaultValue `\"snackbar-\" + useId()` */\n  id?: string;\n\n  /**\n   * Set this to the number of toasts that can be visible within the snackbar at\n   * the same time. Any toasts added after this value will be added into the\n   * queue to be shown.\n   *\n   * @defaultValue `1`\n   */\n  limit?: number;\n\n  /**\n   * Set this to `true` if the snackbar should use absolute positioning so it\n   * can be fixed within a `position: relative` container instead of the entire\n   * viewport.\n   *\n   * @defaultValue `false`\n   */\n  absolute?: boolean;\n\n  /** @defaultValue `\"bottom\"` */\n  position?: SnackbarPosition;\n\n  /** @defaultValue `false` */\n  disablePortal?: boolean;\n\n  /**\n   * This can be used to create a custom toast implementation.\n   *\n   * @example\n   * ```ts\n   * import { Snackbar } from \"@react-md/core/snackbar/Snackbar\";\n   * import { Toast } from \"@react-md/core/snackbar/Toast\";\n   * import { ToastContent } from \"@react-md/core/snackbar/ToastContent\";\n   * import { type ToastRendererProps } from \"@react-md/core/snackbar/DefaultToastRenderer\";\n   * import { useToastManager } from \"@react-md/core/snackbar/ToastManagerProvider\";\n   * import { type ReactElement } from \"react\";\n   *\n   * function CustomToast(props: CustomToastRendererProps): ReactElement {\n   *   // Pretend like we don't need anything else from the toast since the\n   *   // custom behavior is related to the `toastId`\n   *   const { toastId, visible, duplicates, visibleTime } = props;\n   *\n   *   const toastManager = useToastManager();\n   *\n   *   // Note: If you want to rely on the `action` and `closeButton` behavior,\n   *   // you must also wrap the `Toast` with:\n   *   // <RemoveToastProvider value={() => toastManager.removeToast(toastId, true)}>\n   *\n   *   return (\n   *     <Toast\n   *       theme={isError(toastId) ? \"error\" : \"surface\"}\n   *       visible={visible}\n   *       onEntered={() => {\n   *         toastManager.startRemoveTimeout(toastId);\n   *       }}\n   *       onExited={() => {\n   *         toastManager.removeToast(toastId, false)\n   *       }}\n   *       disableContentWrapper\n   *     >\n   *       <ToastContent>\n   *         <TranslateMessage id={toastId} />\n   *       </ToastContent>\n   *       {isActionable(toastId) && (\n   *         <Button\n   *           onClick={async () => {\n   *             await someApiCall();\n   *             toastManager.removeToast(toastId, true);\n   *           }}\n   *         >\n   *           Dismiss\n   *         </Button>\n   *       )}\n   *     </Toast>\n   *   );\n   * }\n   *\n   * function Example(): ReactElement {\n   *   return <Snackbar renderToast={CustomToast} />\n   * }\n   * ```\n   *\n   * @see {@link DefaultToastRenderer}\n   * @defaultValue `DefaultToastRenderer`\n   */\n  renderToast?: ComponentType<ToastRendererProps>;\n\n  /**\n   * Optional props that should be passed to each `Toast` from the `Snackbar`.\n   * This is a great way to enforce each toast having a close button, a custom\n   * class name, theme, etc.\n   *\n   * @see {@link DefaultToastRenderer}\n   */\n  toastDefaults?: ConfigurableToastProps;\n}\n\n/**\n * **Client Component**\n *\n * @example Super Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Snackbar } from \"@react-md/core/snackbar/Snackbar\";\n * import { addToast } from \"@react-md/core/snackbar/ToastManager\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <>\n *       <Button\n *         onClick={() => {\n *           addToast({ children: \"A new toast!\" });\n *         }}\n *       >\n *         Toast!\n *       </Button>\n *       <Snackbar />\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @see {@link SnackbarProps.renderToast} for creating a custom toast\n * implementation.\n * @since 6.0.0 Rewritten to use a new API that supports adding toasts\n * outside of React components and rendering multiple toasts at once.\n */\nexport const Snackbar = forwardRef<HTMLDivElement, SnackbarProps>(\n  function Snackbar(props, ref) {\n    const {\n      id: propId,\n      className,\n      limit = 1,\n      absolute,\n      position = \"bottom\",\n      renderToast: RenderToast = DefaultToastRenderer,\n      disablePortal,\n      toastDefaults,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"snackbar\");\n    const queue = useToastQueue(limit);\n\n    return (\n      <Portal disabled={disablePortal}>\n        {queue.length > 0 && (\n          <div\n            {...remaining}\n            id={id}\n            ref={ref}\n            className={snackbar({ absolute, position, className })}\n          >\n            {queue.map((toast) => (\n              <RenderToast\n                {...toast}\n                key={toast.toastId}\n                toastDefaults={toastDefaults}\n              />\n            ))}\n          </div>\n        )}\n      </Portal>\n    );\n  }\n);\n"],"names":["forwardRef","Portal","useEnsuredId","DefaultToastRenderer","useToastQueue","snackbar","Snackbar","props","ref","id","propId","className","limit","absolute","position","renderToast","RenderToast","disablePortal","toastDefaults","remaining","queue","disabled","length","div","map","toast","key","toastId"],"mappings":"AAAA;;;AAEA,SAAkDA,UAAU,QAAQ,QAAQ;AAE5E,SAASC,MAAM,QAAQ,sBAAsB;AAC7C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SACEC,oBAAoB,QAEf,4BAA4B;AAEnC,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAAgCC,QAAQ,QAAQ,sBAAsB;AAyGtE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BC,GACD,OAAO,MAAMC,yBAAWN,WACtB,SAASM,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,IAAIC,MAAM,EACVC,SAAS,EACTC,QAAQ,CAAC,EACTC,QAAQ,EACRC,WAAW,QAAQ,EACnBC,aAAaC,cAAcb,oBAAoB,EAC/Cc,aAAa,EACbC,aAAa,EACb,GAAGC,WACJ,GAAGZ;IACJ,MAAME,KAAKP,aAAaQ,QAAQ;IAChC,MAAMU,QAAQhB,cAAcQ;IAE5B,qBACE,KAACX;QAAOoB,UAAUJ;kBACfG,MAAME,MAAM,GAAG,mBACd,KAACC;YACE,GAAGJ,SAAS;YACbV,IAAIA;YACJD,KAAKA;YACLG,WAAWN,SAAS;gBAAEQ;gBAAUC;gBAAUH;YAAU;sBAEnDS,MAAMI,GAAG,CAAC,CAACC,sBACV,eAACT;oBACE,GAAGS,KAAK;oBACTC,KAAKD,MAAME,OAAO;oBAClBT,eAAeA;;;;AAO7B,GACA"}
+{"version":3,"sources":["../../src/snackbar/Snackbar.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type ComponentType,\n  type HTMLAttributes,\n  type ReactElement,\n  type Ref,\n} from \"react\";\n\nimport { Portal } from \"../portal/Portal.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n  DefaultToastRenderer,\n  type ToastRendererProps,\n} from \"./DefaultToastRenderer.js\";\nimport { type ConfigurableToastProps } from \"./Toast.js\";\nimport { useToastQueue } from \"./ToastManagerProvider.js\";\nimport { type SnackbarPosition, snackbar } from \"./snackbarStyles.js\";\n\n/**\n * @since 6.0.0 The `id` prop is optional\n */\nexport interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n\n  /** @defaultValue `\"snackbar-\" + useId()` */\n  id?: string;\n\n  /**\n   * Set this to the number of toasts that can be visible within the snackbar at\n   * the same time. Any toasts added after this value will be added into the\n   * queue to be shown.\n   *\n   * @defaultValue `1`\n   */\n  limit?: number;\n\n  /**\n   * Set this to `true` if the snackbar should use absolute positioning so it\n   * can be fixed within a `position: relative` container instead of the entire\n   * viewport.\n   *\n   * @defaultValue `false`\n   */\n  absolute?: boolean;\n\n  /** @defaultValue `\"bottom\"` */\n  position?: SnackbarPosition;\n\n  /** @defaultValue `false` */\n  disablePortal?: boolean;\n\n  /**\n   * This can be used to create a custom toast implementation.\n   *\n   * @example\n   * ```ts\n   * import { Snackbar } from \"@react-md/core/snackbar/Snackbar\";\n   * import { Toast } from \"@react-md/core/snackbar/Toast\";\n   * import { ToastContent } from \"@react-md/core/snackbar/ToastContent\";\n   * import { type ToastRendererProps } from \"@react-md/core/snackbar/DefaultToastRenderer\";\n   * import { useToastManager } from \"@react-md/core/snackbar/ToastManagerProvider\";\n   * import { type ReactElement } from \"react\";\n   *\n   * function CustomToast(props: CustomToastRendererProps): ReactElement {\n   *   // Pretend like we don't need anything else from the toast since the\n   *   // custom behavior is related to the `toastId`\n   *   const { toastId, visible, duplicates, visibleTime } = props;\n   *\n   *   const toastManager = useToastManager();\n   *\n   *   // Note: If you want to rely on the `action` and `closeButton` behavior,\n   *   // you must also wrap the `Toast` with:\n   *   // <RemoveToastProvider value={() => toastManager.removeToast(toastId, true)}>\n   *\n   *   return (\n   *     <Toast\n   *       theme={isError(toastId) ? \"error\" : \"surface\"}\n   *       visible={visible}\n   *       onEntered={() => {\n   *         toastManager.startRemoveTimeout(toastId);\n   *       }}\n   *       onExited={() => {\n   *         toastManager.removeToast(toastId, false)\n   *       }}\n   *       disableContentWrapper\n   *     >\n   *       <ToastContent>\n   *         <TranslateMessage id={toastId} />\n   *       </ToastContent>\n   *       {isActionable(toastId) && (\n   *         <Button\n   *           onClick={async () => {\n   *             await someApiCall();\n   *             toastManager.removeToast(toastId, true);\n   *           }}\n   *         >\n   *           Dismiss\n   *         </Button>\n   *       )}\n   *     </Toast>\n   *   );\n   * }\n   *\n   * function Example(): ReactElement {\n   *   return <Snackbar renderToast={CustomToast} />\n   * }\n   * ```\n   *\n   * @see {@link DefaultToastRenderer}\n   * @defaultValue `DefaultToastRenderer`\n   */\n  renderToast?: ComponentType<ToastRendererProps>;\n\n  /**\n   * Optional props that should be passed to each `Toast` from the `Snackbar`.\n   * This is a great way to enforce each toast having a close button, a custom\n   * class name, theme, etc.\n   *\n   * @see {@link DefaultToastRenderer}\n   */\n  toastDefaults?: ConfigurableToastProps;\n}\n\n/**\n * **Client Component**\n *\n * @example Super Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Snackbar } from \"@react-md/core/snackbar/Snackbar\";\n * import { addToast } from \"@react-md/core/snackbar/ToastManager\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <>\n *       <Button\n *         onClick={() => {\n *           addToast({ children: \"A new toast!\" });\n *         }}\n *       >\n *         Toast!\n *       </Button>\n *       <Snackbar />\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @see {@link SnackbarProps.renderToast} for creating a custom toast\n * implementation.\n * @since 6.0.0 Rewritten to use a new API that supports adding toasts\n * outside of React components and rendering multiple toasts at once.\n */\nexport function Snackbar(props: SnackbarProps): ReactElement {\n  const {\n    ref,\n    id: propId,\n    className,\n    limit = 1,\n    absolute,\n    position = \"bottom\",\n    renderToast: RenderToast = DefaultToastRenderer,\n    disablePortal,\n    toastDefaults,\n    ...remaining\n  } = props;\n  const id = useEnsuredId(propId, \"snackbar\");\n  const queue = useToastQueue(limit);\n\n  return (\n    <Portal disabled={disablePortal}>\n      {queue.length > 0 && (\n        <div\n          {...remaining}\n          id={id}\n          ref={ref}\n          className={snackbar({ absolute, position, className })}\n        >\n          {queue.map((toast) => (\n            <RenderToast\n              {...toast}\n              key={toast.toastId}\n              toastDefaults={toastDefaults}\n            />\n          ))}\n        </div>\n      )}\n    </Portal>\n  );\n}\n"],"names":["Portal","useEnsuredId","DefaultToastRenderer","useToastQueue","snackbar","Snackbar","props","ref","id","propId","className","limit","absolute","position","renderToast","RenderToast","disablePortal","toastDefaults","remaining","queue","disabled","length","div","map","toast","key","toastId"],"mappings":"AAAA;;;AASA,SAASA,MAAM,QAAQ,sBAAsB;AAC7C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SACEC,oBAAoB,QAEf,4BAA4B;AAEnC,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAAgCC,QAAQ,QAAQ,sBAAsB;AA2GtE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BC,GACD,OAAO,SAASC,SAASC,KAAoB;IAC3C,MAAM,EACJC,GAAG,EACHC,IAAIC,MAAM,EACVC,SAAS,EACTC,QAAQ,CAAC,EACTC,QAAQ,EACRC,WAAW,QAAQ,EACnBC,aAAaC,cAAcb,oBAAoB,EAC/Cc,aAAa,EACbC,aAAa,EACb,GAAGC,WACJ,GAAGZ;IACJ,MAAME,KAAKP,aAAaQ,QAAQ;IAChC,MAAMU,QAAQhB,cAAcQ;IAE5B,qBACE,KAACX;QAAOoB,UAAUJ;kBACfG,MAAME,MAAM,GAAG,mBACd,KAACC;YACE,GAAGJ,SAAS;YACbV,IAAIA;YACJD,KAAKA;YACLG,WAAWN,SAAS;gBAAEQ;gBAAUC;gBAAUH;YAAU;sBAEnDS,MAAMI,GAAG,CAAC,CAACC,sBACV,eAACT;oBACE,GAAGS,KAAK;oBACTC,KAAKD,MAAME,OAAO;oBAClBT,eAAeA;;;;AAO7B"}

package/dist/snackbar/Toast.d.ts

@@ -1,4 +1,4 @@
-import { type AriaRole, type HTMLAttributes, type ReactElement, type ReactNode } from "react";
+import { type AriaRole, type HTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
 import { type ButtonProps } from "../button/Button.js";
 import { type CSSTransitionClassNames, type TransitionCallbacks, type TransitionTimeout } from "../transition/types.js";
 import { type PropsWithRef } from "../types.js";
@@ -8,6 +8,7 @@ import { type BaseToastClasNameOptions } from "./toastStyles.js";
  * @since 6.0.0
  */
 export interface ConfigurableToastProps extends HTMLAttributes<HTMLDivElement>, BaseToastClasNameOptions, TransitionCallbacks {
+    ref?: Ref<HTMLDivElement>;
     /**
      * Note: this default value will only be generated in the `Toast` component.
      *
@@ -99,4 +100,4 @@ export interface ToastProps extends ConfigurableToastProps {
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
  */
-export declare const Toast: import("react").ForwardRefExoticComponent<ToastProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function Toast(props: ToastProps): ReactElement | null;

package/dist/snackbar/Toast.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, isValidElement } from "react";
+import { isValidElement } from "react";
 import { useScaleTransition } from "../transition/useScaleTransition.js";
 import { useEnsuredId } from "../useEnsuredId.js";
 import { ToastActionButton } from "./ToastActionButton.js";
@@ -15,8 +15,8 @@ import { toast } from "./toastStyles.js";
  *
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
- */ export const Toast = /*#__PURE__*/ forwardRef(function Toast(props, ref) {
-    const { id: propId, className, timeout, classNames, theme = "surface", action: propAction, actionButton: propActionButton, paused, visible, closeIcon: propCloseIcon, closeButtonProps, closeButton = !!closeButtonProps, contentProps, disableToastContent, stacked, multiline, onEnter, onEntering, onEntered, onExit, onExiting, onExited, children, ...remaining } = props;
+ */ export function Toast(props) {
+    const { ref, id: propId, className, timeout, classNames, theme = "surface", action: propAction, actionButton: propActionButton, paused, visible, closeIcon: propCloseIcon, closeButtonProps, closeButton = !!closeButtonProps, contentProps, disableToastContent, stacked, multiline, onEnter, onEntering, onEntered, onExit, onExiting, onExited, children, ...remaining } = props;
     const id = useEnsuredId(propId, "toast");
     let actionButton = propActionButton;
     if (propAction) {
@@ -93,6 +93,6 @@ import { toast } from "./toastStyles.js";
             })
         ]
     });
-});
+}
 
 //# sourceMappingURL=Toast.js.map

package/dist/snackbar/Toast.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/snackbar/Toast.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type AriaRole,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  forwardRef,\n  isValidElement,\n} from \"react\";\n\nimport { type ButtonProps } from \"../button/Button.js\";\nimport {\n  type CSSTransitionClassNames,\n  type TransitionCallbacks,\n  type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useScaleTransition } from \"../transition/useScaleTransition.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { ToastActionButton } from \"./ToastActionButton.js\";\nimport { ToastCloseButton } from \"./ToastCloseButton.js\";\nimport { ToastContent, type ToastContentProps } from \"./ToastContent.js\";\nimport { type BaseToastClasNameOptions, toast } from \"./toastStyles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableToastProps\n  extends\n    HTMLAttributes<HTMLDivElement>,\n    BaseToastClasNameOptions,\n    TransitionCallbacks {\n  /**\n   * Note: this default value will only be generated in the `Toast` component.\n   *\n   * @defaultValue `\"toast-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * Note: This is set while creating the toast.\n   *\n   * @defaultValue `visibleTime === null ? \"alert\" : \"status\"`\n   */\n  role?: AriaRole;\n\n  /**\n   * Set this to `true` to stack the content above the {@link action}. It is not\n   * recommended to enable this prop if the {@link closeButton} is enabled.\n   *\n   * @defaultValue `false`\n   */\n  stacked?: boolean;\n\n  /**\n   * If this is not provided, a `ResizeObserver` will be used to determine if\n   * there are multiple lines of content.\n   */\n  multiline?: boolean;\n\n  /**\n   * When this is a string or React element, it will be rendered as the\n   * `children` within a `Button`\n   */\n  action?: ButtonProps | ReactElement | string;\n\n  /**\n   * This can be used to replace the custom action button behavior.\n   */\n  actionButton?: ReactNode;\n\n  /**\n   * @defaultValue `getIcon(\"close\")`\n   */\n  closeIcon?: ReactNode;\n\n  /**\n   * Set this to `true` if a close button should be rendered to the right of the\n   * `children`.\n   *\n   * @defaultValue `!!closeButtonProps`\n   */\n  closeButton?: boolean;\n\n  /**\n   * Use this prop to override most of the close button behavior. The\n   */\n  closeButtonProps?: ButtonProps;\n\n  /**\n   * Any additional props that should be provided to the `<div>` that surrounds\n   * the toast `children`.\n   */\n  contentProps?: PropsWithRef<ToastContentProps>;\n\n  /**\n   * Set this to `true` if the `children` for the toast should no longer be\n   * wrapped in an additional `<div>` that applies some toast layout styles.\n   * This should normally only be used for custom `Toast` implementations.\n   *\n   * @see the `Snackbar`'s `renderToast` prop for an example.\n   */\n  disableToastContent?: boolean;\n\n  /**\n   * The toast's transition timeout for entering and exiting. This is **not**\n   * how long the toast should remain visible.\n   *\n   * @defaultValue `SCALE_TIMEOUT`\n   */\n  timeout?: TransitionTimeout;\n\n  /**\n   * The toast's transition class names for entering and exiting.\n   *\n   * @defaultValue `SCALE_CLASSNAMES`\n   */\n  classNames?: CSSTransitionClassNames;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ToastProps extends ConfigurableToastProps {\n  paused?: boolean;\n  visible: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This component is just used for toast styling and does not implement any of\n * the visibility behavior.\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n  function Toast(props, ref) {\n    const {\n      id: propId,\n      className,\n      timeout,\n      classNames,\n      theme = \"surface\",\n      action: propAction,\n      actionButton: propActionButton,\n      paused,\n      visible,\n      closeIcon: propCloseIcon,\n      closeButtonProps,\n      closeButton = !!closeButtonProps,\n      contentProps,\n      disableToastContent,\n      stacked,\n      multiline,\n      onEnter,\n      onEntering,\n      onEntered,\n      onExit,\n      onExiting,\n      onExited,\n      children,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"toast\");\n\n    let actionButton = propActionButton;\n    if (propAction) {\n      let overrides: ButtonProps = {};\n      let buttonChildren: ReactNode;\n      // have to use `any` to correctly filter out all react elements\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      if (isValidElement<any>(propAction) || typeof propAction !== \"object\") {\n        buttonChildren = propAction;\n      } else {\n        ({ children: buttonChildren, ...overrides } = propAction);\n      }\n\n      actionButton = (\n        <ToastActionButton\n          theme={theme === \"surface\" ? \"secondary\" : \"clear\"}\n          reordered={stacked && closeButton}\n          {...overrides}\n        >\n          {buttonChildren}\n        </ToastActionButton>\n      );\n    }\n\n    let closeIcon = propCloseIcon;\n    if (closeButtonProps?.children !== undefined) {\n      closeIcon = closeButtonProps.children;\n    }\n\n    const action = !!actionButton;\n    const reordered = stacked && action && closeButton;\n    const { elementProps, rendered } = useScaleTransition({\n      appear: true,\n      nodeRef: ref,\n      className: toast({\n        className,\n        theme,\n        action,\n        paused,\n        stacked,\n        reordered,\n        closeButton,\n      }),\n      timeout,\n      classNames,\n      onEnter,\n      onEntering,\n      onEntered,\n      onExit,\n      onExiting,\n      onExited,\n      temporary: true,\n      transitionIn: visible,\n      exitedHidden: true,\n    });\n\n    // this might get rid of the weird popping-back-in for a split second\n    // that sometimes happens on mobile firefox\n    if (!rendered) {\n      return null;\n    }\n\n    return (\n      <div {...remaining} {...elementProps} id={id}>\n        <ToastContent\n          action={action}\n          stacked={stacked}\n          multiline={multiline}\n          closeButton={closeButton}\n          disableWrapper={disableToastContent}\n          {...contentProps}\n        >\n          {children}\n        </ToastContent>\n        {actionButton}\n        {closeButton && (\n          <ToastCloseButton reordered={reordered} {...closeButtonProps}>\n            {closeIcon}\n          </ToastCloseButton>\n        )}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","isValidElement","useScaleTransition","useEnsuredId","ToastActionButton","ToastCloseButton","ToastContent","toast","Toast","props","ref","id","propId","className","timeout","classNames","theme","action","propAction","actionButton","propActionButton","paused","visible","closeIcon","propCloseIcon","closeButtonProps","closeButton","contentProps","disableToastContent","stacked","multiline","onEnter","onEntering","onEntered","onExit","onExiting","onExited","children","remaining","overrides","buttonChildren","reordered","undefined","elementProps","rendered","appear","nodeRef","temporary","transitionIn","exitedHidden","div","disableWrapper"],"mappings":"AAAA;;AAEA,SAKEA,UAAU,EACVC,cAAc,QACT,QAAQ;AAQf,SAASC,kBAAkB,QAAQ,sCAAsC;AAEzE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,iBAAiB,QAAQ,yBAAyB;AAC3D,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,YAAY,QAAgC,oBAAoB;AACzE,SAAwCC,KAAK,QAAQ,mBAAmB;AA0GxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,sBAAQR,WACnB,SAASQ,MAAMC,KAAK,EAAEC,GAAG;IACvB,MAAM,EACJC,IAAIC,MAAM,EACVC,SAAS,EACTC,OAAO,EACPC,UAAU,EACVC,QAAQ,SAAS,EACjBC,QAAQC,UAAU,EAClBC,cAAcC,gBAAgB,EAC9BC,MAAM,EACNC,OAAO,EACPC,WAAWC,aAAa,EACxBC,gBAAgB,EAChBC,cAAc,CAAC,CAACD,gBAAgB,EAChCE,YAAY,EACZC,mBAAmB,EACnBC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,QAAQ,EACR,GAAGC,WACJ,GAAG7B;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAEhC,IAAIO,eAAeC;IACnB,IAAIF,YAAY;QACd,IAAIqB,YAAyB,CAAC;QAC9B,IAAIC;QACJ,+DAA+D;QAC/D,8DAA8D;QAC9D,kBAAIvC,eAAoBiB,eAAe,OAAOA,eAAe,UAAU;YACrEsB,iBAAiBtB;QACnB,OAAO;YACJ,CAAA,EAAEmB,UAAUG,cAAc,EAAE,GAAGD,WAAW,GAAGrB,UAAS;QACzD;QAEAC,6BACE,KAACf;YACCY,OAAOA,UAAU,YAAY,cAAc;YAC3CyB,WAAWZ,WAAWH;YACrB,GAAGa,SAAS;sBAEZC;;IAGP;IAEA,IAAIjB,YAAYC;IAChB,IAAIC,kBAAkBY,aAAaK,WAAW;QAC5CnB,YAAYE,iBAAiBY,QAAQ;IACvC;IAEA,MAAMpB,SAAS,CAAC,CAACE;IACjB,MAAMsB,YAAYZ,WAAWZ,UAAUS;IACvC,MAAM,EAAEiB,YAAY,EAAEC,QAAQ,EAAE,GAAG1C,mBAAmB;QACpD2C,QAAQ;QACRC,SAASpC;QACTG,WAAWN,MAAM;YACfM;YACAG;YACAC;YACAI;YACAQ;YACAY;YACAf;QACF;QACAZ;QACAC;QACAgB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAW,WAAW;QACXC,cAAc1B;QACd2B,cAAc;IAChB;IAEA,qEAAqE;IACrE,2CAA2C;IAC3C,IAAI,CAACL,UAAU;QACb,OAAO;IACT;IAEA,qBACE,MAACM;QAAK,GAAGZ,SAAS;QAAG,GAAGK,YAAY;QAAEhC,IAAIA;;0BACxC,KAACL;gBACCW,QAAQA;gBACRY,SAASA;gBACTC,WAAWA;gBACXJ,aAAaA;gBACbyB,gBAAgBvB;gBACf,GAAGD,YAAY;0BAEfU;;YAEFlB;YACAO,6BACC,KAACrB;gBAAiBoC,WAAWA;gBAAY,GAAGhB,gBAAgB;0BACzDF;;;;AAKX,GACA"}
+{"version":3,"sources":["../../src/snackbar/Toast.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type AriaRole,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n  isValidElement,\n} from \"react\";\n\nimport { type ButtonProps } from \"../button/Button.js\";\nimport {\n  type CSSTransitionClassNames,\n  type TransitionCallbacks,\n  type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useScaleTransition } from \"../transition/useScaleTransition.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { ToastActionButton } from \"./ToastActionButton.js\";\nimport { ToastCloseButton } from \"./ToastCloseButton.js\";\nimport { ToastContent, type ToastContentProps } from \"./ToastContent.js\";\nimport { type BaseToastClasNameOptions, toast } from \"./toastStyles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableToastProps\n  extends\n    HTMLAttributes<HTMLDivElement>,\n    BaseToastClasNameOptions,\n    TransitionCallbacks {\n  ref?: Ref<HTMLDivElement>;\n\n  /**\n   * Note: this default value will only be generated in the `Toast` component.\n   *\n   * @defaultValue `\"toast-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * Note: This is set while creating the toast.\n   *\n   * @defaultValue `visibleTime === null ? \"alert\" : \"status\"`\n   */\n  role?: AriaRole;\n\n  /**\n   * Set this to `true` to stack the content above the {@link action}. It is not\n   * recommended to enable this prop if the {@link closeButton} is enabled.\n   *\n   * @defaultValue `false`\n   */\n  stacked?: boolean;\n\n  /**\n   * If this is not provided, a `ResizeObserver` will be used to determine if\n   * there are multiple lines of content.\n   */\n  multiline?: boolean;\n\n  /**\n   * When this is a string or React element, it will be rendered as the\n   * `children` within a `Button`\n   */\n  action?: ButtonProps | ReactElement | string;\n\n  /**\n   * This can be used to replace the custom action button behavior.\n   */\n  actionButton?: ReactNode;\n\n  /**\n   * @defaultValue `getIcon(\"close\")`\n   */\n  closeIcon?: ReactNode;\n\n  /**\n   * Set this to `true` if a close button should be rendered to the right of the\n   * `children`.\n   *\n   * @defaultValue `!!closeButtonProps`\n   */\n  closeButton?: boolean;\n\n  /**\n   * Use this prop to override most of the close button behavior. The\n   */\n  closeButtonProps?: ButtonProps;\n\n  /**\n   * Any additional props that should be provided to the `<div>` that surrounds\n   * the toast `children`.\n   */\n  contentProps?: PropsWithRef<ToastContentProps>;\n\n  /**\n   * Set this to `true` if the `children` for the toast should no longer be\n   * wrapped in an additional `<div>` that applies some toast layout styles.\n   * This should normally only be used for custom `Toast` implementations.\n   *\n   * @see the `Snackbar`'s `renderToast` prop for an example.\n   */\n  disableToastContent?: boolean;\n\n  /**\n   * The toast's transition timeout for entering and exiting. This is **not**\n   * how long the toast should remain visible.\n   *\n   * @defaultValue `SCALE_TIMEOUT`\n   */\n  timeout?: TransitionTimeout;\n\n  /**\n   * The toast's transition class names for entering and exiting.\n   *\n   * @defaultValue `SCALE_CLASSNAMES`\n   */\n  classNames?: CSSTransitionClassNames;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ToastProps extends ConfigurableToastProps {\n  paused?: boolean;\n  visible: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This component is just used for toast styling and does not implement any of\n * the visibility behavior.\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport function Toast(props: ToastProps): ReactElement | null {\n  const {\n    ref,\n    id: propId,\n    className,\n    timeout,\n    classNames,\n    theme = \"surface\",\n    action: propAction,\n    actionButton: propActionButton,\n    paused,\n    visible,\n    closeIcon: propCloseIcon,\n    closeButtonProps,\n    closeButton = !!closeButtonProps,\n    contentProps,\n    disableToastContent,\n    stacked,\n    multiline,\n    onEnter,\n    onEntering,\n    onEntered,\n    onExit,\n    onExiting,\n    onExited,\n    children,\n    ...remaining\n  } = props;\n  const id = useEnsuredId(propId, \"toast\");\n\n  let actionButton = propActionButton;\n  if (propAction) {\n    let overrides: ButtonProps = {};\n    let buttonChildren: ReactNode;\n    // have to use `any` to correctly filter out all react elements\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    if (isValidElement<any>(propAction) || typeof propAction !== \"object\") {\n      buttonChildren = propAction;\n    } else {\n      ({ children: buttonChildren, ...overrides } = propAction);\n    }\n\n    actionButton = (\n      <ToastActionButton\n        theme={theme === \"surface\" ? \"secondary\" : \"clear\"}\n        reordered={stacked && closeButton}\n        {...overrides}\n      >\n        {buttonChildren}\n      </ToastActionButton>\n    );\n  }\n\n  let closeIcon = propCloseIcon;\n  if (closeButtonProps?.children !== undefined) {\n    closeIcon = closeButtonProps.children;\n  }\n\n  const action = !!actionButton;\n  const reordered = stacked && action && closeButton;\n  const { elementProps, rendered } = useScaleTransition({\n    appear: true,\n    nodeRef: ref,\n    className: toast({\n      className,\n      theme,\n      action,\n      paused,\n      stacked,\n      reordered,\n      closeButton,\n    }),\n    timeout,\n    classNames,\n    onEnter,\n    onEntering,\n    onEntered,\n    onExit,\n    onExiting,\n    onExited,\n    temporary: true,\n    transitionIn: visible,\n    exitedHidden: true,\n  });\n\n  // this might get rid of the weird popping-back-in for a split second\n  // that sometimes happens on mobile firefox\n  if (!rendered) {\n    return null;\n  }\n\n  return (\n    <div {...remaining} {...elementProps} id={id}>\n      <ToastContent\n        action={action}\n        stacked={stacked}\n        multiline={multiline}\n        closeButton={closeButton}\n        disableWrapper={disableToastContent}\n        {...contentProps}\n      >\n        {children}\n      </ToastContent>\n      {actionButton}\n      {closeButton && (\n        <ToastCloseButton reordered={reordered} {...closeButtonProps}>\n          {closeIcon}\n        </ToastCloseButton>\n      )}\n    </div>\n  );\n}\n"],"names":["isValidElement","useScaleTransition","useEnsuredId","ToastActionButton","ToastCloseButton","ToastContent","toast","Toast","props","ref","id","propId","className","timeout","classNames","theme","action","propAction","actionButton","propActionButton","paused","visible","closeIcon","propCloseIcon","closeButtonProps","closeButton","contentProps","disableToastContent","stacked","multiline","onEnter","onEntering","onEntered","onExit","onExiting","onExited","children","remaining","overrides","buttonChildren","reordered","undefined","elementProps","rendered","appear","nodeRef","temporary","transitionIn","exitedHidden","div","disableWrapper"],"mappings":"AAAA;;AAEA,SAMEA,cAAc,QACT,QAAQ;AAQf,SAASC,kBAAkB,QAAQ,sCAAsC;AAEzE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,iBAAiB,QAAQ,yBAAyB;AAC3D,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,YAAY,QAAgC,oBAAoB;AACzE,SAAwCC,KAAK,QAAQ,mBAAmB;AA4GxE;;;;;;;;CAQC,GACD,OAAO,SAASC,MAAMC,KAAiB;IACrC,MAAM,EACJC,GAAG,EACHC,IAAIC,MAAM,EACVC,SAAS,EACTC,OAAO,EACPC,UAAU,EACVC,QAAQ,SAAS,EACjBC,QAAQC,UAAU,EAClBC,cAAcC,gBAAgB,EAC9BC,MAAM,EACNC,OAAO,EACPC,WAAWC,aAAa,EACxBC,gBAAgB,EAChBC,cAAc,CAAC,CAACD,gBAAgB,EAChCE,YAAY,EACZC,mBAAmB,EACnBC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,QAAQ,EACR,GAAGC,WACJ,GAAG7B;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAEhC,IAAIO,eAAeC;IACnB,IAAIF,YAAY;QACd,IAAIqB,YAAyB,CAAC;QAC9B,IAAIC;QACJ,+DAA+D;QAC/D,8DAA8D;QAC9D,kBAAIvC,eAAoBiB,eAAe,OAAOA,eAAe,UAAU;YACrEsB,iBAAiBtB;QACnB,OAAO;YACJ,CAAA,EAAEmB,UAAUG,cAAc,EAAE,GAAGD,WAAW,GAAGrB,UAAS;QACzD;QAEAC,6BACE,KAACf;YACCY,OAAOA,UAAU,YAAY,cAAc;YAC3CyB,WAAWZ,WAAWH;YACrB,GAAGa,SAAS;sBAEZC;;IAGP;IAEA,IAAIjB,YAAYC;IAChB,IAAIC,kBAAkBY,aAAaK,WAAW;QAC5CnB,YAAYE,iBAAiBY,QAAQ;IACvC;IAEA,MAAMpB,SAAS,CAAC,CAACE;IACjB,MAAMsB,YAAYZ,WAAWZ,UAAUS;IACvC,MAAM,EAAEiB,YAAY,EAAEC,QAAQ,EAAE,GAAG1C,mBAAmB;QACpD2C,QAAQ;QACRC,SAASpC;QACTG,WAAWN,MAAM;YACfM;YACAG;YACAC;YACAI;YACAQ;YACAY;YACAf;QACF;QACAZ;QACAC;QACAgB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAW,WAAW;QACXC,cAAc1B;QACd2B,cAAc;IAChB;IAEA,qEAAqE;IACrE,2CAA2C;IAC3C,IAAI,CAACL,UAAU;QACb,OAAO;IACT;IAEA,qBACE,MAACM;QAAK,GAAGZ,SAAS;QAAG,GAAGK,YAAY;QAAEhC,IAAIA;;0BACxC,KAACL;gBACCW,QAAQA;gBACRY,SAASA;gBACTC,WAAWA;gBACXJ,aAAaA;gBACbyB,gBAAgBvB;gBACf,GAAGD,YAAY;0BAEfU;;YAEFlB;YACAO,6BACC,KAACrB;gBAAiBoC,WAAWA;gBAAY,GAAGhB,gBAAgB;0BACzDF;;;;AAKX"}

package/dist/snackbar/ToastActionButton.d.ts

@@ -1,3 +1,4 @@
+import { type ReactElement } from "react";
 import { type ButtonProps } from "../button/Button.js";
 import { type ButtonTheme } from "../button/styles.js";
 /**
@@ -24,4 +25,4 @@ export interface ToastActionButtonProps extends ButtonProps {
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
  */
-export declare const ToastActionButton: import("react").ForwardRefExoticComponent<ToastActionButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const ToastActionButton: (props: ToastActionButtonProps) => ReactElement;

package/dist/snackbar/ToastActionButton.js

@@ -1,7 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cnb } from "cnbuilder";
-import { forwardRef } from "react";
 import { Button } from "../button/Button.js";
 import { bem } from "../utils/bem.js";
 import { useCurrentToastActions } from "./useCurrentToastActions.js";
@@ -17,8 +16,8 @@ const noop = ()=>{
  *
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
- */ export const ToastActionButton = /*#__PURE__*/ forwardRef(function ToastActionButton(props, ref) {
-    const { className, children, theme = "secondary", onClick = noop, reordered, ...remaining } = props;
+ */ export const ToastActionButton = function ToastActionButton(props) {
+    const { ref, className, children, theme = "secondary", onClick = noop, reordered, ...remaining } = props;
     const { removeToast } = useCurrentToastActions();
     return /*#__PURE__*/ _jsx(Button, {
         ...remaining,
@@ -36,6 +35,6 @@ const noop = ()=>{
         }), className),
         children: children
     });
-});
+};
 
 //# sourceMappingURL=ToastActionButton.js.map

package/dist/snackbar/ToastActionButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/snackbar/ToastActionButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonTheme } from \"../button/styles.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { useCurrentToastActions } from \"./useCurrentToastActions.js\";\n\nconst styles = bem(\"rmd-toast-action\");\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface ToastActionButtonProps extends ButtonProps {\n  /** @defaultValue `\"secondary\"` */\n  theme?: ButtonTheme;\n\n  /**\n   * Set this to `true` when there is a close button visible and the content is\n   * stacked. This will update the styles so the button renders in the bottom\n   * right below the content and close button.\n   *\n   * @defaultValue `false`\n   */\n  reordered?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This button will automatically close the toast when clicked unless\n * `event.stopPropagation()` is called from the `onClick` prop.\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport const ToastActionButton = forwardRef<\n  HTMLButtonElement,\n  ToastActionButtonProps\n>(function ToastActionButton(props, ref) {\n  const {\n    className,\n    children,\n    theme = \"secondary\",\n    onClick = noop,\n    reordered,\n    ...remaining\n  } = props;\n  const { removeToast } = useCurrentToastActions();\n\n  return (\n    <Button\n      {...remaining}\n      ref={ref}\n      onClick={(event) => {\n        onClick(event);\n        if (event.isPropagationStopped()) {\n          return;\n        }\n\n        removeToast(true);\n      }}\n      theme={theme}\n      className={cnb(styles({ reordered }), className)}\n    >\n      {children}\n    </Button>\n  );\n});\n"],"names":["cnb","forwardRef","Button","bem","useCurrentToastActions","styles","noop","ToastActionButton","props","ref","className","children","theme","onClick","reordered","remaining","removeToast","event","isPropagationStopped"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,sBAAsB,QAAQ,8BAA8B;AAErE,MAAMC,SAASF,IAAI;AACnB,MAAMG,OAAO;AACX,aAAa;AACf;AAmBA;;;;;;;;CAQC,GACD,OAAO,MAAMC,kCAAoBN,WAG/B,SAASM,kBAAkBC,KAAK,EAAEC,GAAG;IACrC,MAAM,EACJC,SAAS,EACTC,QAAQ,EACRC,QAAQ,WAAW,EACnBC,UAAUP,IAAI,EACdQ,SAAS,EACT,GAAGC,WACJ,GAAGP;IACJ,MAAM,EAAEQ,WAAW,EAAE,GAAGZ;IAExB,qBACE,KAACF;QACE,GAAGa,SAAS;QACbN,KAAKA;QACLI,SAAS,CAACI;YACRJ,QAAQI;YACR,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAF,YAAY;QACd;QACAJ,OAAOA;QACPF,WAAWV,IAAIK,OAAO;YAAES;QAAU,IAAIJ;kBAErCC;;AAGP,GAAG"}
+{"version":3,"sources":["../../src/snackbar/ToastActionButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { type ReactElement } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonTheme } from \"../button/styles.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { useCurrentToastActions } from \"./useCurrentToastActions.js\";\n\nconst styles = bem(\"rmd-toast-action\");\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface ToastActionButtonProps extends ButtonProps {\n  /** @defaultValue `\"secondary\"` */\n  theme?: ButtonTheme;\n\n  /**\n   * Set this to `true` when there is a close button visible and the content is\n   * stacked. This will update the styles so the button renders in the bottom\n   * right below the content and close button.\n   *\n   * @defaultValue `false`\n   */\n  reordered?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This button will automatically close the toast when clicked unless\n * `event.stopPropagation()` is called from the `onClick` prop.\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport const ToastActionButton = function ToastActionButton(\n  props: ToastActionButtonProps\n): ReactElement {\n  const {\n    ref,\n    className,\n    children,\n    theme = \"secondary\",\n    onClick = noop,\n    reordered,\n    ...remaining\n  } = props;\n  const { removeToast } = useCurrentToastActions();\n\n  return (\n    <Button\n      {...remaining}\n      ref={ref}\n      onClick={(event) => {\n        onClick(event);\n        if (event.isPropagationStopped()) {\n          return;\n        }\n\n        removeToast(true);\n      }}\n      theme={theme}\n      className={cnb(styles({ reordered }), className)}\n    >\n      {children}\n    </Button>\n  );\n};\n"],"names":["cnb","Button","bem","useCurrentToastActions","styles","noop","ToastActionButton","props","ref","className","children","theme","onClick","reordered","remaining","removeToast","event","isPropagationStopped"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAGhC,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,sBAAsB,QAAQ,8BAA8B;AAErE,MAAMC,SAASF,IAAI;AACnB,MAAMG,OAAO;AACX,aAAa;AACf;AAmBA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oBAAoB,SAASA,kBACxCC,KAA6B;IAE7B,MAAM,EACJC,GAAG,EACHC,SAAS,EACTC,QAAQ,EACRC,QAAQ,WAAW,EACnBC,UAAUP,IAAI,EACdQ,SAAS,EACT,GAAGC,WACJ,GAAGP;IACJ,MAAM,EAAEQ,WAAW,EAAE,GAAGZ;IAExB,qBACE,KAACF;QACE,GAAGa,SAAS;QACbN,KAAKA;QACLI,SAAS,CAACI;YACRJ,QAAQI;YACR,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAF,YAAY;QACd;QACAJ,OAAOA;QACPF,WAAWT,IAAII,OAAO;YAAES;QAAU,IAAIJ;kBAErCC;;AAGP,EAAE"}

package/dist/snackbar/ToastCloseButton.d.ts

@@ -1,3 +1,4 @@
+import { type ReactElement } from "react";
 import { type ButtonProps } from "../button/Button.js";
 import { type ButtonType } from "../button/styles.js";
 /**
@@ -31,4 +32,4 @@ export interface ToastCloseButtonProps extends ButtonProps {
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
  */
-export declare const ToastCloseButton: import("react").ForwardRefExoticComponent<ToastCloseButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare function ToastCloseButton(props: ToastCloseButtonProps): ReactElement;

package/dist/snackbar/ToastCloseButton.js

@@ -1,7 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cnb } from "cnbuilder";
-import { forwardRef } from "react";
 import { Button } from "../button/Button.js";
 import { getIcon } from "../icon/config.js";
 import { bem } from "../utils/bem.js";
@@ -18,8 +17,8 @@ const noop = ()=>{
  *
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
- */ export const ToastCloseButton = /*#__PURE__*/ forwardRef(function ToastCloseButton(props, ref) {
-    const { buttonType = "icon-square", "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel = buttonType !== "text" && !ariaLabelledBy ? "Close" : undefined, children: propChildren, className, onClick = noop, reordered, ...remaining } = props;
+ */ export function ToastCloseButton(props) {
+    const { ref, buttonType = "icon-square", "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel = buttonType !== "text" && !ariaLabelledBy ? "Close" : undefined, children: propChildren, className, onClick = noop, reordered, ...remaining } = props;
     const children = getIcon("close", propChildren);
     const { removeToast } = useCurrentToastActions();
     return /*#__PURE__*/ _jsx(Button, {
@@ -40,6 +39,6 @@ const noop = ()=>{
         buttonType: buttonType,
         children: children
     });
-});
+}
 
 //# sourceMappingURL=ToastCloseButton.js.map

package/dist/snackbar/ToastCloseButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/snackbar/ToastCloseButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonType } from \"../button/styles.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { useCurrentToastActions } from \"./useCurrentToastActions.js\";\n\nconst styles = bem(\"rmd-toast-x\");\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface ToastCloseButtonProps extends ButtonProps {\n  /**\n   * Note: This default value will only be used if the {@link buttonType} is not\n   * `\"text\"` and an `aria-labelledby` is not provided.\n   *\n   * @defaultValue `\"Close\"`\n   */\n  \"aria-label\"?: string;\n\n  /** @defaultValue `\"icon-square\"` */\n  buttonType?: ButtonType;\n\n  /**\n   * Set this to `true` when there is a close button visible and the content is\n   * stacked. This will update the styles so the button renders next to the\n   * content and above the action button.\n   *\n   * @defaultValue `false`\n   */\n  reordered?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This button will automatically close the toast when clicked unless\n * `event.stopPropagation()` is called from the `onClick` prop.\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport const ToastCloseButton = forwardRef<\n  HTMLButtonElement,\n  ToastCloseButtonProps\n>(function ToastCloseButton(props, ref) {\n  const {\n    buttonType = \"icon-square\",\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-label\": ariaLabel = buttonType !== \"text\" && !ariaLabelledBy\n      ? \"Close\"\n      : undefined,\n    children: propChildren,\n    className,\n    onClick = noop,\n    reordered,\n    ...remaining\n  } = props;\n\n  const children = getIcon(\"close\", propChildren);\n  const { removeToast } = useCurrentToastActions();\n\n  return (\n    <Button\n      {...remaining}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      ref={ref}\n      onClick={(event) => {\n        onClick(event);\n        if (event.isPropagationStopped()) {\n          return;\n        }\n\n        removeToast(true);\n      }}\n      className={cnb(styles({ reordered }), className)}\n      buttonType={buttonType}\n    >\n      {children}\n    </Button>\n  );\n});\n"],"names":["cnb","forwardRef","Button","getIcon","bem","useCurrentToastActions","styles","noop","ToastCloseButton","props","ref","buttonType","ariaLabelledBy","ariaLabel","undefined","children","propChildren","className","onClick","reordered","remaining","removeToast","aria-label","aria-labelledby","event","isPropagationStopped"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,sBAAsB,QAAQ,8BAA8B;AAErE,MAAMC,SAASF,IAAI;AACnB,MAAMG,OAAO;AACX,aAAa;AACf;AA2BA;;;;;;;;CAQC,GACD,OAAO,MAAMC,iCAAmBP,WAG9B,SAASO,iBAAiBC,KAAK,EAAEC,GAAG;IACpC,MAAM,EACJC,aAAa,aAAa,EAC1B,mBAAmBC,cAAc,EACjC,cAAcC,YAAYF,eAAe,UAAU,CAACC,iBAChD,UACAE,SAAS,EACbC,UAAUC,YAAY,EACtBC,SAAS,EACTC,UAAUX,IAAI,EACdY,SAAS,EACT,GAAGC,WACJ,GAAGX;IAEJ,MAAMM,WAAWZ,QAAQ,SAASa;IAClC,MAAM,EAAEK,WAAW,EAAE,GAAGhB;IAExB,qBACE,KAACH;QACE,GAAGkB,SAAS;QACbE,cAAYT;QACZU,mBAAiBX;QACjBF,KAAKA;QACLQ,SAAS,CAACM;YACRN,QAAQM;YACR,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAJ,YAAY;QACd;QACAJ,WAAWjB,IAAIM,OAAO;YAAEa;QAAU,IAAIF;QACtCN,YAAYA;kBAEXI;;AAGP,GAAG"}
+{"version":3,"sources":["../../src/snackbar/ToastCloseButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { type ReactElement } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonType } from \"../button/styles.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { useCurrentToastActions } from \"./useCurrentToastActions.js\";\n\nconst styles = bem(\"rmd-toast-x\");\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface ToastCloseButtonProps extends ButtonProps {\n  /**\n   * Note: This default value will only be used if the {@link buttonType} is not\n   * `\"text\"` and an `aria-labelledby` is not provided.\n   *\n   * @defaultValue `\"Close\"`\n   */\n  \"aria-label\"?: string;\n\n  /** @defaultValue `\"icon-square\"` */\n  buttonType?: ButtonType;\n\n  /**\n   * Set this to `true` when there is a close button visible and the content is\n   * stacked. This will update the styles so the button renders next to the\n   * content and above the action button.\n   *\n   * @defaultValue `false`\n   */\n  reordered?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This button will automatically close the toast when clicked unless\n * `event.stopPropagation()` is called from the `onClick` prop.\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport function ToastCloseButton(props: ToastCloseButtonProps): ReactElement {\n  const {\n    ref,\n    buttonType = \"icon-square\",\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-label\": ariaLabel = buttonType !== \"text\" && !ariaLabelledBy\n      ? \"Close\"\n      : undefined,\n    children: propChildren,\n    className,\n    onClick = noop,\n    reordered,\n    ...remaining\n  } = props;\n\n  const children = getIcon(\"close\", propChildren);\n  const { removeToast } = useCurrentToastActions();\n\n  return (\n    <Button\n      {...remaining}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      ref={ref}\n      onClick={(event) => {\n        onClick(event);\n        if (event.isPropagationStopped()) {\n          return;\n        }\n\n        removeToast(true);\n      }}\n      className={cnb(styles({ reordered }), className)}\n      buttonType={buttonType}\n    >\n      {children}\n    </Button>\n  );\n}\n"],"names":["cnb","Button","getIcon","bem","useCurrentToastActions","styles","noop","ToastCloseButton","props","ref","buttonType","ariaLabelledBy","ariaLabel","undefined","children","propChildren","className","onClick","reordered","remaining","removeToast","aria-label","aria-labelledby","event","isPropagationStopped"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAGhC,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,sBAAsB,QAAQ,8BAA8B;AAErE,MAAMC,SAASF,IAAI;AACnB,MAAMG,OAAO;AACX,aAAa;AACf;AA2BA;;;;;;;;CAQC,GACD,OAAO,SAASC,iBAAiBC,KAA4B;IAC3D,MAAM,EACJC,GAAG,EACHC,aAAa,aAAa,EAC1B,mBAAmBC,cAAc,EACjC,cAAcC,YAAYF,eAAe,UAAU,CAACC,iBAChD,UACAE,SAAS,EACbC,UAAUC,YAAY,EACtBC,SAAS,EACTC,UAAUX,IAAI,EACdY,SAAS,EACT,GAAGC,WACJ,GAAGX;IAEJ,MAAMM,WAAWZ,QAAQ,SAASa;IAClC,MAAM,EAAEK,WAAW,EAAE,GAAGhB;IAExB,qBACE,KAACH;QACE,GAAGkB,SAAS;QACbE,cAAYT;QACZU,mBAAiBX;QACjBF,KAAKA;QACLQ,SAAS,CAACM;YACRN,QAAQM;YACR,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAJ,YAAY;QACd;QACAJ,WAAWhB,IAAIK,OAAO;YAAEa;QAAU,IAAIF;QACtCN,YAAYA;kBAEXI;;AAGP"}

package/dist/snackbar/ToastContent.d.ts

@@ -1,8 +1,9 @@
-import { type HTMLAttributes } from "react";
+import { type HTMLAttributes, type ReactElement, type Ref } from "react";
 /**
  * @since 6.0.0
  */
 export interface ToastContentProps extends HTMLAttributes<HTMLDivElement> {
+    ref?: Ref<HTMLDivElement>;
     /** @defaultValue `false` */
     action?: boolean;
     /** @defaultValue `false` */
@@ -31,4 +32,4 @@ export interface ToastContentProps extends HTMLAttributes<HTMLDivElement> {
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
  */
-export declare const ToastContent: import("react").ForwardRefExoticComponent<ToastContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ToastContent(props: ToastContentProps): ReactElement;

package/dist/snackbar/ToastContent.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { forwardRef, useCallback, useState } from "react";
+import { useCallback, useState } from "react";
 import { useResizeObserver } from "../useResizeObserver.js";
 import { toastContent } from "./toastContentStyles.js";
 /**
@@ -8,8 +8,8 @@ import { toastContent } from "./toastContentStyles.js";
  *
  * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}
  * @since 6.0.0
- */ export const ToastContent = /*#__PURE__*/ forwardRef(function ToastContent(props, ref) {
-    const { className, children, action, stacked, multiline: propMultiline, closeButton, disableWrapper, ...remaining } = props;
+ */ export function ToastContent(props) {
+    const { ref, className, children, action, stacked, multiline: propMultiline, closeButton, disableWrapper, ...remaining } = props;
     const [isMultiline, setMultiline] = useState(false);
     const nodeRef = useResizeObserver({
         ref,
@@ -43,6 +43,6 @@ import { toastContent } from "./toastContentStyles.js";
         }),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=ToastContent.js.map

package/dist/snackbar/ToastContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/snackbar/ToastContent.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef, useCallback, useState } from \"react\";\n\nimport { useResizeObserver } from \"../useResizeObserver.js\";\nimport { toastContent } from \"./toastContentStyles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ToastContentProps extends HTMLAttributes<HTMLDivElement> {\n  /** @defaultValue `false` */\n  action?: boolean;\n\n  /** @defaultValue `false` */\n  stacked?: boolean;\n\n  /**\n   * Set this to `true` if you know that the {@link children} span multiple\n   * lines. When this is omitted, a `ResizeObserver` will be used to\n   * automatically detect multiline content.\n   */\n  multiline?: boolean;\n\n  /** @defaultValue `false` */\n  closeButton?: boolean;\n\n  /**\n   * Set this to `true` if you do not want to wrap the `children` in a `<div>`\n   * that applies some toast layout styles. This should really only be used for\n   * custom `Toast` implementations.\n   *\n   * @internal\n   * @defaultValue `false`\n   */\n  disableWrapper?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport const ToastContent = forwardRef<HTMLDivElement, ToastContentProps>(\n  function ToastContent(props, ref) {\n    const {\n      className,\n      children,\n      action,\n      stacked,\n      multiline: propMultiline,\n      closeButton,\n      disableWrapper,\n      ...remaining\n    } = props;\n\n    const [isMultiline, setMultiline] = useState(false);\n    const nodeRef = useResizeObserver({\n      ref,\n      disabled: disableWrapper || typeof propMultiline === \"boolean\",\n      disableWidth: true,\n      onUpdate: useCallback((entry) => {\n        const element = entry.target;\n        const style = globalThis.getComputedStyle(element);\n        const lineHeight = Number.parseFloat(style.lineHeight);\n        if (Number.isNaN(lineHeight)) {\n          return;\n        }\n\n        setMultiline(element.scrollHeight > lineHeight);\n      }, []),\n    });\n    const multiline = propMultiline ?? isMultiline;\n\n    if (disableWrapper) {\n      return <>{children}</>;\n    }\n\n    return (\n      <div\n        {...remaining}\n        ref={nodeRef}\n        className={toastContent({\n          action,\n          stacked,\n          multiline,\n          closeButton,\n          className,\n        })}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","useCallback","useState","useResizeObserver","toastContent","ToastContent","props","ref","className","children","action","stacked","multiline","propMultiline","closeButton","disableWrapper","remaining","isMultiline","setMultiline","nodeRef","disabled","disableWidth","onUpdate","entry","element","target","style","globalThis","getComputedStyle","lineHeight","Number","parseFloat","isNaN","scrollHeight","div"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,EAAEC,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AAE/E,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,YAAY,QAAQ,0BAA0B;AAiCvD;;;;;CAKC,GACD,OAAO,MAAMC,6BAAeL,WAC1B,SAASK,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,SAAS,EACTC,QAAQ,EACRC,MAAM,EACNC,OAAO,EACPC,WAAWC,aAAa,EACxBC,WAAW,EACXC,cAAc,EACd,GAAGC,WACJ,GAAGV;IAEJ,MAAM,CAACW,aAAaC,aAAa,GAAGhB,SAAS;IAC7C,MAAMiB,UAAUhB,kBAAkB;QAChCI;QACAa,UAAUL,kBAAkB,OAAOF,kBAAkB;QACrDQ,cAAc;QACdC,UAAUrB,YAAY,CAACsB;YACrB,MAAMC,UAAUD,MAAME,MAAM;YAC5B,MAAMC,QAAQC,WAAWC,gBAAgB,CAACJ;YAC1C,MAAMK,aAAaC,OAAOC,UAAU,CAACL,MAAMG,UAAU;YACrD,IAAIC,OAAOE,KAAK,CAACH,aAAa;gBAC5B;YACF;YAEAX,aAAaM,QAAQS,YAAY,GAAGJ;QACtC,GAAG,EAAE;IACP;IACA,MAAMjB,YAAYC,iBAAiBI;IAEnC,IAAIF,gBAAgB;QAClB,qBAAO;sBAAGN;;IACZ;IAEA,qBACE,KAACyB;QACE,GAAGlB,SAAS;QACbT,KAAKY;QACLX,WAAWJ,aAAa;YACtBM;YACAC;YACAC;YACAE;YACAN;QACF;kBAECC;;AAGP,GACA"}
+{"version":3,"sources":["../../src/snackbar/ToastContent.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type HTMLAttributes,\n  type ReactElement,\n  type Ref,\n  useCallback,\n  useState,\n} from \"react\";\n\nimport { useResizeObserver } from \"../useResizeObserver.js\";\nimport { toastContent } from \"./toastContentStyles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ToastContentProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n\n  /** @defaultValue `false` */\n  action?: boolean;\n\n  /** @defaultValue `false` */\n  stacked?: boolean;\n\n  /**\n   * Set this to `true` if you know that the {@link children} span multiple\n   * lines. When this is omitted, a `ResizeObserver` will be used to\n   * automatically detect multiline content.\n   */\n  multiline?: boolean;\n\n  /** @defaultValue `false` */\n  closeButton?: boolean;\n\n  /**\n   * Set this to `true` if you do not want to wrap the `children` in a `<div>`\n   * that applies some toast layout styles. This should really only be used for\n   * custom `Toast` implementations.\n   *\n   * @internal\n   * @defaultValue `false`\n   */\n  disableWrapper?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * @see {@link https://react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport function ToastContent(props: ToastContentProps): ReactElement {\n  const {\n    ref,\n    className,\n    children,\n    action,\n    stacked,\n    multiline: propMultiline,\n    closeButton,\n    disableWrapper,\n    ...remaining\n  } = props;\n\n  const [isMultiline, setMultiline] = useState(false);\n  const nodeRef = useResizeObserver({\n    ref,\n    disabled: disableWrapper || typeof propMultiline === \"boolean\",\n    disableWidth: true,\n    onUpdate: useCallback((entry) => {\n      const element = entry.target;\n      const style = globalThis.getComputedStyle(element);\n      const lineHeight = Number.parseFloat(style.lineHeight);\n      if (Number.isNaN(lineHeight)) {\n        return;\n      }\n\n      setMultiline(element.scrollHeight > lineHeight);\n    }, []),\n  });\n  const multiline = propMultiline ?? isMultiline;\n\n  if (disableWrapper) {\n    return <>{children}</>;\n  }\n\n  return (\n    <div\n      {...remaining}\n      ref={nodeRef}\n      className={toastContent({\n        action,\n        stacked,\n        multiline,\n        closeButton,\n        className,\n      })}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["useCallback","useState","useResizeObserver","toastContent","ToastContent","props","ref","className","children","action","stacked","multiline","propMultiline","closeButton","disableWrapper","remaining","isMultiline","setMultiline","nodeRef","disabled","disableWidth","onUpdate","entry","element","target","style","globalThis","getComputedStyle","lineHeight","Number","parseFloat","isNaN","scrollHeight","div"],"mappings":"AAAA;;AAEA,SAIEA,WAAW,EACXC,QAAQ,QACH,QAAQ;AAEf,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,YAAY,QAAQ,0BAA0B;AAmCvD;;;;;CAKC,GACD,OAAO,SAASC,aAAaC,KAAwB;IACnD,MAAM,EACJC,GAAG,EACHC,SAAS,EACTC,QAAQ,EACRC,MAAM,EACNC,OAAO,EACPC,WAAWC,aAAa,EACxBC,WAAW,EACXC,cAAc,EACd,GAAGC,WACJ,GAAGV;IAEJ,MAAM,CAACW,aAAaC,aAAa,GAAGhB,SAAS;IAC7C,MAAMiB,UAAUhB,kBAAkB;QAChCI;QACAa,UAAUL,kBAAkB,OAAOF,kBAAkB;QACrDQ,cAAc;QACdC,UAAUrB,YAAY,CAACsB;YACrB,MAAMC,UAAUD,MAAME,MAAM;YAC5B,MAAMC,QAAQC,WAAWC,gBAAgB,CAACJ;YAC1C,MAAMK,aAAaC,OAAOC,UAAU,CAACL,MAAMG,UAAU;YACrD,IAAIC,OAAOE,KAAK,CAACH,aAAa;gBAC5B;YACF;YAEAX,aAAaM,QAAQS,YAAY,GAAGJ;QACtC,GAAG,EAAE;IACP;IACA,MAAMjB,YAAYC,iBAAiBI;IAEnC,IAAIF,gBAAgB;QAClB,qBAAO;sBAAGN;;IACZ;IAEA,qBACE,KAACyB;QACE,GAAGlB,SAAS;QACbT,KAAKY;QACLX,WAAWJ,aAAa;YACtBM;YACAC;YACAC;YACAE;YACAN;QACF;kBAECC;;AAGP"}

package/dist/spinbutton/SpinButton.d.ts

@@ -1,10 +1,11 @@
-import { type HTMLAttributes } from "react";
+import { type HTMLAttributes, type ReactElement, type Ref } from "react";
 import { type LabelRequiredForA11y } from "../types.js";
-import { type SpinButtonOptions, type SpinButtonValueOptions } from "./types.js";
+import { type SpinButtonOptions } from "./types.js";
 /**
  * @since 6.4.0
  */
 export interface SpinButtonProps extends Omit<HTMLAttributes<HTMLDivElement>, keyof SpinButtonOptions>, Omit<SpinButtonOptions<HTMLDivElement>, "ref" | "children"> {
+    ref?: Ref<HTMLDivElement>;
 }
 /**
  * The `SpinButton` component can be used as a simple wrapper around the
@@ -13,4 +14,4 @@ export interface SpinButtonProps extends Omit<HTMLAttributes<HTMLDivElement>, ke
  *
  * @since 6.4.0
  */
-export declare const SpinButton: import("react").ForwardRefExoticComponent<(LabelRequiredForA11y<SpinButtonProps> & SpinButtonValueOptions) & import("react").RefAttributes<HTMLDivElement>>;
+export declare function SpinButton(props: LabelRequiredForA11y<SpinButtonProps>): ReactElement;

package/dist/spinbutton/SpinButton.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { defaultGetSpinButtonTextContent } from "./defaults.js";
 import { useSpinButton } from "./useSpinButton.js";
 /**
@@ -9,8 +8,8 @@ import { useSpinButton } from "./useSpinButton.js";
  * only the rendering behavior is required.
  *
  * @since 6.4.0
- */ export const SpinButton = /*#__PURE__*/ forwardRef(function SpinButton(props, ref) {
-    const { id, min, max, minDigits, maxDigits, step, form, error, disabled, readOnly, required, fallback, mappings, value, defaultValue, onValueChange, getValueText, getTextContent = defaultGetSpinButtonTextContent, placeholderChar, defaultKeyboardValue, ...remaining } = props;
+ */ export function SpinButton(props) {
+    const { ref, id, min, max, minDigits, maxDigits, step, form, error, disabled, readOnly, required, fallback, mappings, value, defaultValue, onValueChange, getValueText, getTextContent = defaultGetSpinButtonTextContent, placeholderChar, defaultKeyboardValue, ...remaining } = props;
     const valueProps = {
         value,
         defaultValue
@@ -50,6 +49,6 @@ import { useSpinButton } from "./useSpinButton.js";
             placeholderChar
         })
     });
-});
+}
 
 //# sourceMappingURL=SpinButton.js.map

package/dist/spinbutton/SpinButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/spinbutton/SpinButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { defaultGetSpinButtonTextContent } from \"./defaults.js\";\nimport {\n  type SpinButtonOptions,\n  type SpinButtonUncontrolledValueOptions,\n  type SpinButtonValueOptions,\n} from \"./types.js\";\nimport { useSpinButton } from \"./useSpinButton.js\";\n\n/**\n * @since 6.4.0\n */\nexport interface SpinButtonProps\n  extends\n    Omit<HTMLAttributes<HTMLDivElement>, keyof SpinButtonOptions>,\n    Omit<SpinButtonOptions<HTMLDivElement>, \"ref\" | \"children\"> {}\n\n/**\n * The `SpinButton` component can be used as a simple wrapper around the\n * {@link useSpinButton} hook if it should be rendered within a `<div>` and\n * only the rendering behavior is required.\n *\n * @since 6.4.0\n */\nexport const SpinButton = forwardRef<\n  HTMLDivElement,\n  LabelRequiredForA11y<SpinButtonProps> & SpinButtonValueOptions\n>(function SpinButton(props, ref) {\n  const {\n    id,\n    min,\n    max,\n    minDigits,\n    maxDigits,\n    step,\n    form,\n    error,\n    disabled,\n    readOnly,\n    required,\n    fallback,\n    mappings,\n    value,\n    defaultValue,\n    onValueChange,\n    getValueText,\n    getTextContent = defaultGetSpinButtonTextContent,\n    placeholderChar,\n    defaultKeyboardValue,\n    ...remaining\n  } = props;\n\n  const valueProps = {\n    value,\n    defaultValue,\n  } as SpinButtonUncontrolledValueOptions<HTMLDivElement>;\n\n  const { value: currentValue, spinButtonProps } = useSpinButton({\n    id,\n    ref,\n    min,\n    max,\n    minDigits,\n    maxDigits,\n    step,\n    form,\n    fallback,\n    mappings,\n    error,\n    disabled,\n    readOnly,\n    required,\n    ...valueProps,\n    onValueChange,\n    getValueText,\n    getTextContent,\n    placeholderChar,\n    defaultKeyboardValue,\n  });\n\n  return (\n    <div {...remaining} {...spinButtonProps}>\n      {getTextContent({\n        min,\n        max,\n        minDigits,\n        maxDigits,\n        value: currentValue,\n        fallback,\n        placeholderChar,\n      })}\n    </div>\n  );\n});\n"],"names":["forwardRef","defaultGetSpinButtonTextContent","useSpinButton","SpinButton","props","ref","id","min","max","minDigits","maxDigits","step","form","error","disabled","readOnly","required","fallback","mappings","value","defaultValue","onValueChange","getValueText","getTextContent","placeholderChar","defaultKeyboardValue","remaining","valueProps","currentValue","spinButtonProps","div"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAGxD,SAASC,+BAA+B,QAAQ,gBAAgB;AAMhE,SAASC,aAAa,QAAQ,qBAAqB;AAUnD;;;;;;CAMC,GACD,OAAO,MAAMC,2BAAaH,WAGxB,SAASG,WAAWC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,EAAE,EACFC,GAAG,EACHC,GAAG,EACHC,SAAS,EACTC,SAAS,EACTC,IAAI,EACJC,IAAI,EACJC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,KAAK,EACLC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,iBAAiBtB,+BAA+B,EAChDuB,eAAe,EACfC,oBAAoB,EACpB,GAAGC,WACJ,GAAGtB;IAEJ,MAAMuB,aAAa;QACjBR;QACAC;IACF;IAEA,MAAM,EAAED,OAAOS,YAAY,EAAEC,eAAe,EAAE,GAAG3B,cAAc;QAC7DI;QACAD;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAK;QACAC;QACAL;QACAC;QACAC;QACAC;QACA,GAAGW,UAAU;QACbN;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,qBACE,KAACK;QAAK,GAAGJ,SAAS;QAAG,GAAGG,eAAe;kBACpCN,eAAe;YACdhB;YACAC;YACAC;YACAC;YACAS,OAAOS;YACPX;YACAO;QACF;;AAGN,GAAG"}
+{"version":3,"sources":["../../src/spinbutton/SpinButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, type ReactElement, type Ref } from \"react\";\n\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { defaultGetSpinButtonTextContent } from \"./defaults.js\";\nimport {\n  type SpinButtonOptions,\n  type SpinButtonUncontrolledValueOptions,\n} from \"./types.js\";\nimport { useSpinButton } from \"./useSpinButton.js\";\n\n/**\n * @since 6.4.0\n */\nexport interface SpinButtonProps\n  extends\n    Omit<HTMLAttributes<HTMLDivElement>, keyof SpinButtonOptions>,\n    Omit<SpinButtonOptions<HTMLDivElement>, \"ref\" | \"children\"> {\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * The `SpinButton` component can be used as a simple wrapper around the\n * {@link useSpinButton} hook if it should be rendered within a `<div>` and\n * only the rendering behavior is required.\n *\n * @since 6.4.0\n */\nexport function SpinButton(\n  props: LabelRequiredForA11y<SpinButtonProps>\n): ReactElement {\n  const {\n    ref,\n    id,\n    min,\n    max,\n    minDigits,\n    maxDigits,\n    step,\n    form,\n    error,\n    disabled,\n    readOnly,\n    required,\n    fallback,\n    mappings,\n    value,\n    defaultValue,\n    onValueChange,\n    getValueText,\n    getTextContent = defaultGetSpinButtonTextContent,\n    placeholderChar,\n    defaultKeyboardValue,\n    ...remaining\n  } = props;\n\n  const valueProps = {\n    value,\n    defaultValue,\n  } as SpinButtonUncontrolledValueOptions<HTMLDivElement>;\n\n  const { value: currentValue, spinButtonProps } = useSpinButton({\n    id,\n    ref,\n    min,\n    max,\n    minDigits,\n    maxDigits,\n    step,\n    form,\n    fallback,\n    mappings,\n    error,\n    disabled,\n    readOnly,\n    required,\n    ...valueProps,\n    onValueChange,\n    getValueText,\n    getTextContent,\n    placeholderChar,\n    defaultKeyboardValue,\n  });\n\n  return (\n    <div {...remaining} {...spinButtonProps}>\n      {getTextContent({\n        min,\n        max,\n        minDigits,\n        maxDigits,\n        value: currentValue,\n        fallback,\n        placeholderChar,\n      })}\n    </div>\n  );\n}\n"],"names":["defaultGetSpinButtonTextContent","useSpinButton","SpinButton","props","ref","id","min","max","minDigits","maxDigits","step","form","error","disabled","readOnly","required","fallback","mappings","value","defaultValue","onValueChange","getValueText","getTextContent","placeholderChar","defaultKeyboardValue","remaining","valueProps","currentValue","spinButtonProps","div"],"mappings":"AAAA;;AAKA,SAASA,+BAA+B,QAAQ,gBAAgB;AAKhE,SAASC,aAAa,QAAQ,qBAAqB;AAYnD;;;;;;CAMC,GACD,OAAO,SAASC,WACdC,KAA4C;IAE5C,MAAM,EACJC,GAAG,EACHC,EAAE,EACFC,GAAG,EACHC,GAAG,EACHC,SAAS,EACTC,SAAS,EACTC,IAAI,EACJC,IAAI,EACJC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,KAAK,EACLC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,iBAAiBtB,+BAA+B,EAChDuB,eAAe,EACfC,oBAAoB,EACpB,GAAGC,WACJ,GAAGtB;IAEJ,MAAMuB,aAAa;QACjBR;QACAC;IACF;IAEA,MAAM,EAAED,OAAOS,YAAY,EAAEC,eAAe,EAAE,GAAG3B,cAAc;QAC7DI;QACAD;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAK;QACAC;QACAL;QACAC;QACAC;QACAC;QACA,GAAGW,UAAU;QACbN;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,qBACE,KAACK;QAAK,GAAGJ,SAAS;QAAG,GAAGG,eAAe;kBACpCN,eAAe;YACdhB;YACAC;YACAC;YACAC;YACAS,OAAOS;YACPX;YACAO;QACF;;AAGN"}

package/dist/spinbutton/types.d.ts

@@ -319,6 +319,6 @@ export interface ProvidedSpinButtonProps<E extends HTMLElement = HTMLDivElement>
 export interface SpinButtonImplementation<E extends HTMLElement = HTMLDivElement> {
     value: SpinButtonValue;
     setValue: (value: SpinButtonValue) => void;
-    spinButtonRef: RefObject<E>;
+    spinButtonRef: RefObject<E | null>;
     spinButtonProps: Readonly<ProvidedSpinButtonProps<E>>;
 }