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

package/dist/cssUtils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/cssUtils.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\n/**\n * - `primary -> $primary-color`\n * - `secondary -> $secondary-color`\n * - `warning -> $warning-color`\n * - `success -> $success-color`\n * - `error -> $error-color`\n *\n * @since 6.0.0\n */\nexport type ThemeColor =\n  | \"primary\"\n  | \"secondary\"\n  | \"warning\"\n  | \"success\"\n  | \"error\";\n\n/**\n * - `text-primary -> $text-primary-color`\n * - `text-secondary -> $text-secondary-color`\n * - `text-hint -> $text-hint-color`\n * - `text-disabled -> $text-disabled-color`\n *\n * @since 6.0.0\n */\nexport type TextColor =\n  | \"text-primary\"\n  | \"text-secondary\"\n  | \"text-hint\"\n  | \"text-disabled\"\n  | `on-${ThemeColor}`;\n\n/**\n * @since 6.0.0\n */\nexport type OutlineColor = ThemeColor | \"greyscale\" | \"current-color\";\n\n/**\n * @since 6.0.0\n */\nexport type BackgroundColor = ThemeColor | \"surface\" | \"current-color\";\n\nexport type TextAlign = \"left\" | \"center\" | \"right\";\nexport type TextDecoration = \"underline\" | \"overline\" | \"line-through\" | \"none\";\nexport type TextTransform = \"capitalize\" | \"uppercase\" | \"lowercase\";\nexport type FontStyle = \"italic\" | \"oblique\" | \"normal\";\n\n/**\n * The supported css `font-weight` values.\n *\n * Note: You will need to ensure that you are using a web safe font for all the\n * font weights to work, use variable fonts, or load all font weights for your\n * custom font.\n *\n * @see {@link https://www.google.com/search?q=web+safe+fonts | Web Safe Fonts}\n * @see {@link https://www.google.com/search?q=variable+fonts | Variable FOnts}\n * @since 6.0.0 This was `TextWeight` beforehand.\n */\nexport type FontWeight =\n  | \"thin\"\n  | \"light\"\n  | \"regular\"\n  | \"medium\"\n  | \"bold\"\n  | \"semi-bold\"\n  | \"black\";\n\n/**\n * Since the typography within react-md tries to not modify base elements, the\n * default margin applied to heading tags (h1-h6) and paragraph (p) might have\n * large margin that you don't want applied when using this component. You can\n * disable:\n *\n * - only the top margin by setting this prop to `\"bottom\"`\n * - only the bottom margin by setting this prop to `\"top\"`\n * - top and bottom margin by setting this prop to `\"none\"`\n * - or keep the initial behavior: `\"initial\"`\n *\n * @since 6.0.0\n */\nexport type Margin = \"none\" | \"top\" | \"bottom\" | \"centered\";\n\n/** @since 6.0.0 */\nexport type TextOverflow = \"allow\" | \"nowrap\" | \"ellipsis\";\n\n/** @since 6.0.0 */\nexport interface TextCssUtilsOptions {\n  textColor?: ThemeColor | TextColor | null;\n\n  textAlign?: TextAlign;\n\n  textDecoration?: TextDecoration;\n\n  textTransform?: TextTransform;\n\n  fontWeight?: FontWeight;\n\n  fontStyle?: FontStyle;\n\n  /**\n   * This can be used to remove margin from an element (usually typography\n   * elements since the browser applies default margin for those elements).\n   *\n   * @see {@link Margin}\n   */\n  margin?: Margin;\n\n  /**\n   * Set this to `\"nowrap\"` to only prevent line wrap behavior or `\"ellipsis\"`\n   * to also hide additional text with ellipsis.\n   *\n   * @defaultValue `\"allow\"`\n   */\n  textOverflow?: TextOverflow;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface CssUtilsOptions extends TextCssUtilsOptions {\n  className?: string;\n\n  /**\n   * Set this to `true` to allow the content to only be visible for screen\n   * readers. Set this to `\"focusable\"` to allow the content to be visible to\n   * screen readers and once focused. Set this to `\"phone\"` to only render the\n   * the content as screen reader only text on phones.\n   *\n   * @defaultValue `false`\n   */\n  srOnly?: boolean | \"focusable\" | \"phone\";\n\n  /**\n   * Set this to `\"current-color\"` to inherit the current text color or a\n   * specific theme color as the outline `box-shadow`.\n   */\n  outlineColor?: OutlineColor;\n\n  /**\n   * When this is defined, a specific theme background-color will be applied\n   * along with updating the text color be either `#000` or `#fff` depending on\n   * which has the highest contrast ratio.\n   */\n  backgroundColor?: BackgroundColor;\n\n  /**\n   * Set this to `true` if the element should act as an interaction surface\n   * which will:\n   * - display a pointer while hovered\n   * - increase the z-index of children to enable higher contrast when\n   *   `core.$interaction-disable-higher-contrast` is not `true`\n   * - add a `::before` pseudo element that will:\n   *   - gain the focus shadow while `:focus`-ed\n   *   - add a background-color while `:hover`-ed\n   *   - show no hover/focus styles while `:disabled` or `[aria-disabled=\"true\"]`\n   *\n   * @defaultValue `false`\n   */\n  surface?: boolean;\n\n  /**\n   * Set this to `\"light\"` or `\"dark\"` to update the hover, focus, press,\n   * selected, and ripple colors for the surface type. `\"light\"` surfaces will\n   * use `#000` while `\"dark\"` will use `#fff`.\n   */\n  surfaceColor?: \"light\" | \"dark\";\n}\n\n/**\n * This is used to apply css utility functions to any element within your\n * application such as:\n * - specific theme colors as background, text, or outline color\n * - removing margin\n * - screen reader visible only text\n * - text-align, text-decoration, text-transform, font-style, font-weight\n * - disable line wrap\n *\n * @since 6.0.0\n */\nexport function cssUtils(options: CssUtilsOptions): string {\n  const {\n    className,\n    srOnly,\n    textColor,\n    outlineColor,\n    backgroundColor,\n    surface,\n    surfaceColor,\n    margin,\n    fontStyle,\n    fontWeight,\n    textAlign,\n    textDecoration,\n    textTransform,\n    textOverflow,\n  } = options;\n\n  const isMarginTop = margin === \"top\";\n  const isTextColor =\n    textColor === \"text-primary\" ||\n    textColor === \"text-secondary\" ||\n    textColor === \"text-hint\" ||\n    textColor === \"text-disabled\";\n\n  return cnb(\n    !backgroundColor && !isTextColor && textColor && `rmd-${textColor}-color`,\n    !backgroundColor && isTextColor && `rmd-${textColor}-color`,\n    backgroundColor && \"rmd-background-container\",\n    backgroundColor &&\n      backgroundColor !== \"current-color\" &&\n      `rmd-${backgroundColor}-container`,\n    outlineColor && \"rmd-outline\",\n    outlineColor && `rmd-${outlineColor}-outline`,\n    (isMarginTop || margin === \"bottom\") &&\n      `rmd-no-margin-${isMarginTop ? \"bottom\" : \"top\"}`,\n    margin === \"none\" && \"rmd-no-margin\",\n    margin === \"centered\" && \"rmd-centered\",\n    textAlign && `rmd-align-${textAlign}`,\n    textDecoration && `rmd-${textDecoration}`,\n    textTransform && `rmd-${textTransform}`,\n    fontStyle && `rmd-${fontStyle}`,\n    fontWeight && `rmd-${fontWeight}`,\n    srOnly && srOnly !== \"phone\" && \"rmd-sr-only\",\n    srOnly === \"phone\" && \"rmd-phone-sr-only\",\n    srOnly === \"focusable\" && \"rmd-sr-only--focusable\",\n    surfaceColor === \"light\" && \"rmd-light-surface\",\n    surfaceColor === \"dark\" && \"rmd-dark-surface\",\n    textOverflow && textOverflow !== \"allow\" && \"rmd-nowrap\",\n    textOverflow === \"ellipsis\" && \"rmd-ellipsis\",\n    surface && \"rmd-interaction-surface\",\n    className\n  );\n}\n"],"names":["cnb","cssUtils","options","className","srOnly","textColor","outlineColor","backgroundColor","surface","surfaceColor","margin","fontStyle","fontWeight","textAlign","textDecoration","textTransform","textOverflow","isMarginTop","isTextColor"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAyKhC;;;;;;;;;;CAUC,GACD,OAAO,SAASC,SAASC,OAAwB;IAC/C,MAAM,EACJC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,YAAY,EACZC,eAAe,EACfC,OAAO,EACPC,YAAY,EACZC,MAAM,EACNC,SAAS,EACTC,UAAU,EACVC,SAAS,EACTC,cAAc,EACdC,aAAa,EACbC,YAAY,EACb,GAAGd;IAEJ,MAAMe,cAAcP,WAAW;IAC/B,MAAMQ,cACJb,cAAc,kBACdA,cAAc,oBACdA,cAAc,eACdA,cAAc;IAEhB,OAAOL,IACL,CAACO,mBAAmB,CAACW,eAAeb,aAAa,CAAC,IAAI,EAAEA,UAAU,MAAM,CAAC,EACzE,CAACE,mBAAmBW,eAAe,CAAC,IAAI,EAAEb,UAAU,MAAM,CAAC,EAC3DE,mBAAmB,4BACnBA,mBACEA,oBAAoB,mBACpB,CAAC,IAAI,EAAEA,gBAAgB,UAAU,CAAC,EACpCD,gBAAgB,eAChBA,gBAAgB,CAAC,IAAI,EAAEA,aAAa,QAAQ,CAAC,EAC7C,AAACW,CAAAA,eAAeP,WAAW,QAAO,KAChC,CAAC,cAAc,EAAEO,cAAc,WAAW,MAAM,CAAC,EACnDP,WAAW,UAAU,iBACrBA,WAAW,cAAc,gBACzBG,aAAa,CAAC,UAAU,EAAEA,UAAU,CAAC,EACrCC,kBAAkB,CAAC,IAAI,EAAEA,eAAe,CAAC,EACzCC,iBAAiB,CAAC,IAAI,EAAEA,cAAc,CAAC,EACvCJ,aAAa,CAAC,IAAI,EAAEA,UAAU,CAAC,EAC/BC,cAAc,CAAC,IAAI,EAAEA,WAAW,CAAC,EACjCR,UAAUA,WAAW,WAAW,eAChCA,WAAW,WAAW,qBACtBA,WAAW,eAAe,0BAC1BK,iBAAiB,WAAW,qBAC5BA,iBAAiB,UAAU,oBAC3BO,gBAAgBA,iBAAiB,WAAW,cAC5CA,iBAAiB,cAAc,gBAC/BR,WAAW,2BACXL;AAEJ"}
+{"version":3,"sources":["../src/cssUtils.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\n/**\n * - `primary -> $primary-color`\n * - `secondary -> $secondary-color`\n * - `warning -> $warning-color`\n * - `success -> $success-color`\n * - `error -> $error-color`\n *\n * @since 6.0.0\n */\nexport type ThemeColor =\n  | \"primary\"\n  | \"secondary\"\n  | \"warning\"\n  | \"success\"\n  | \"error\";\n\n/**\n * - `text-primary -> $text-primary-color`\n * - `text-secondary -> $text-secondary-color`\n * - `text-hint -> $text-hint-color`\n * - `text-disabled -> $text-disabled-color`\n *\n * @since 6.0.0\n */\nexport type TextColor =\n  | \"text-primary\"\n  | \"text-secondary\"\n  | \"text-hint\"\n  | \"text-disabled\"\n  | `on-${ThemeColor}`;\n\n/**\n * @since 6.0.0\n */\nexport type OutlineColor = ThemeColor | \"greyscale\" | \"current-color\";\n\n/**\n * @since 6.0.0\n */\nexport type BackgroundColor = ThemeColor | \"surface\" | \"current-color\";\n\nexport type TextAlign = \"left\" | \"center\" | \"right\";\nexport type TextDecoration = \"underline\" | \"overline\" | \"line-through\" | \"none\";\nexport type TextTransform = \"capitalize\" | \"uppercase\" | \"lowercase\";\nexport type FontStyle = \"italic\" | \"oblique\" | \"normal\";\n\n/**\n * The supported css `font-weight` values.\n *\n * Note: You will need to ensure that you are using a web safe font for all the\n * font weights to work, use variable fonts, or load all font weights for your\n * custom font.\n *\n * @see {@link https://www.google.com/search?q=web+safe+fonts | Web Safe Fonts}\n * @see {@link https://www.google.com/search?q=variable+fonts | Variable FOnts}\n * @since 6.0.0 This was `TextWeight` beforehand.\n */\nexport type FontWeight =\n  | \"thin\"\n  | \"light\"\n  | \"regular\"\n  | \"medium\"\n  | \"bold\"\n  | \"semi-bold\"\n  | \"black\";\n\n/**\n * Since the typography within react-md tries to not modify base elements, the\n * default margin applied to heading tags (h1-h6) and paragraph (p) might have\n * large margin that you don't want applied when using this component. You can\n * disable:\n *\n * - only the top margin by setting this prop to `\"bottom\"`\n * - only the bottom margin by setting this prop to `\"top\"`\n * - top and bottom margin by setting this prop to `\"none\"`\n * - or keep the initial behavior: `\"initial\"`\n *\n * @since 6.0.0\n */\nexport type Margin = \"none\" | \"top\" | \"bottom\" | \"centered\";\n\n/** @since 6.0.0 */\nexport type TextOverflow = \"allow\" | \"nowrap\" | \"ellipsis\";\n\n/** @since 6.0.0 */\nexport interface TextCssUtilsOptions {\n  textColor?: ThemeColor | TextColor | null;\n\n  textAlign?: TextAlign;\n\n  textDecoration?: TextDecoration;\n\n  textTransform?: TextTransform;\n\n  fontWeight?: FontWeight;\n\n  fontStyle?: FontStyle;\n\n  /**\n   * This can be used to remove margin from an element (usually typography\n   * elements since the browser applies default margin for those elements).\n   *\n   * @see {@link Margin}\n   */\n  margin?: Margin;\n\n  /**\n   * Set this to `\"nowrap\"` to only prevent line wrap behavior or `\"ellipsis\"`\n   * to also hide additional text with ellipsis.\n   *\n   * @defaultValue `\"allow\"`\n   */\n  textOverflow?: TextOverflow;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface CssUtilsOptions extends TextCssUtilsOptions {\n  className?: string;\n\n  /**\n   * Set this to `true` to allow the content to only be visible for screen\n   * readers. Set this to `\"focusable\"` to allow the content to be visible to\n   * screen readers and once focused. Set this to `\"phone\"` to only render the\n   * the content as screen reader only text on phones.\n   *\n   * @defaultValue `false`\n   */\n  srOnly?: boolean | \"focusable\" | \"phone\";\n\n  /**\n   * Set this to `\"current-color\"` to inherit the current text color or a\n   * specific theme color as the outline `box-shadow`.\n   */\n  outlineColor?: OutlineColor;\n\n  /**\n   * When this is defined, a specific theme background-color will be applied\n   * along with updating the text color be either `#000` or `#fff` depending on\n   * which has the highest contrast ratio.\n   */\n  backgroundColor?: BackgroundColor;\n\n  /**\n   * Set this to `true` if the element should act as an interaction surface\n   * which will:\n   * - display a pointer while hovered\n   * - increase the z-index of children to enable higher contrast when\n   *   `core.$interaction-disable-higher-contrast` is not `true`\n   * - add a `::before` pseudo element that will:\n   *   - gain the focus shadow while `:focus`-ed\n   *   - add a background-color while `:hover`-ed\n   *   - show no hover/focus styles while `:disabled` or `[aria-disabled=\"true\"]`\n   *\n   * @defaultValue `false`\n   */\n  surface?: boolean;\n\n  /**\n   * Set this to `\"light\"` or `\"dark\"` to update the hover, focus, press,\n   * selected, and ripple colors for the surface type. `\"light\"` surfaces will\n   * use `#000` while `\"dark\"` will use `#fff`.\n   */\n  surfaceColor?: \"light\" | \"dark\";\n}\n\n/**\n * This is used to apply css utility functions to any element within your\n * application such as:\n * - specific theme colors as background, text, or outline color\n * - removing margin\n * - screen reader visible only text\n * - text-align, text-decoration, text-transform, font-style, font-weight\n * - disable line wrap\n *\n * @since 6.0.0\n */\nexport function cssUtils(options: CssUtilsOptions): string {\n  const {\n    className,\n    srOnly,\n    textColor,\n    outlineColor,\n    backgroundColor,\n    surface,\n    surfaceColor,\n    margin,\n    fontStyle,\n    fontWeight,\n    textAlign,\n    textDecoration,\n    textTransform,\n    textOverflow,\n  } = options;\n\n  const isMarginTop = margin === \"top\";\n  const isTextColor =\n    textColor === \"text-primary\" ||\n    textColor === \"text-secondary\" ||\n    textColor === \"text-hint\" ||\n    textColor === \"text-disabled\";\n\n  return cnb(\n    !backgroundColor && !isTextColor && textColor && `rmd-${textColor}-color`,\n    !backgroundColor && isTextColor && `rmd-${textColor}-color`,\n    backgroundColor && \"rmd-background-container\",\n    backgroundColor &&\n      backgroundColor !== \"current-color\" &&\n      `rmd-${backgroundColor}-container`,\n    outlineColor && \"rmd-outline\",\n    outlineColor && `rmd-${outlineColor}-outline`,\n    (isMarginTop || margin === \"bottom\") &&\n      `rmd-no-margin-${isMarginTop ? \"bottom\" : \"top\"}`,\n    margin === \"none\" && \"rmd-no-margin\",\n    margin === \"centered\" && \"rmd-centered\",\n    textAlign && `rmd-align-${textAlign}`,\n    textDecoration && `rmd-${textDecoration}`,\n    textTransform && `rmd-${textTransform}`,\n    fontStyle && `rmd-${fontStyle}`,\n    fontWeight && `rmd-${fontWeight}`,\n    srOnly && srOnly !== \"phone\" && \"rmd-sr-only\",\n    srOnly === \"phone\" && \"rmd-phone-sr-only\",\n    srOnly === \"focusable\" && \"rmd-sr-only--focusable\",\n    surfaceColor === \"light\" && \"rmd-light-surface\",\n    surfaceColor === \"dark\" && \"rmd-dark-surface\",\n    textOverflow && textOverflow !== \"allow\" && \"rmd-nowrap\",\n    textOverflow === \"ellipsis\" && \"rmd-ellipsis\",\n    surface && \"rmd-interaction-surface\",\n    className\n  );\n}\n"],"names":["cnb","cssUtils","options","className","srOnly","textColor","outlineColor","backgroundColor","surface","surfaceColor","margin","fontStyle","fontWeight","textAlign","textDecoration","textTransform","textOverflow","isMarginTop","isTextColor"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAyKhC;;;;;;;;;;CAUC,GACD,OAAO,SAASC,SAASC,OAAwB;IAC/C,MAAM,EACJC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,YAAY,EACZC,eAAe,EACfC,OAAO,EACPC,YAAY,EACZC,MAAM,EACNC,SAAS,EACTC,UAAU,EACVC,SAAS,EACTC,cAAc,EACdC,aAAa,EACbC,YAAY,EACb,GAAGd;IAEJ,MAAMe,cAAcP,WAAW;IAC/B,MAAMQ,cACJb,cAAc,kBACdA,cAAc,oBACdA,cAAc,eACdA,cAAc;IAEhB,OAAOL,IACL,CAACO,mBAAmB,CAACW,eAAeb,aAAa,CAAC,IAAI,EAAEA,UAAU,MAAM,CAAC,EACzE,CAACE,mBAAmBW,eAAe,CAAC,IAAI,EAAEb,UAAU,MAAM,CAAC,EAC3DE,mBAAmB,4BACnBA,mBACEA,oBAAoB,mBACpB,CAAC,IAAI,EAAEA,gBAAgB,UAAU,CAAC,EACpCD,gBAAgB,eAChBA,gBAAgB,CAAC,IAAI,EAAEA,aAAa,QAAQ,CAAC,EAC7C,AAACW,CAAAA,eAAeP,WAAW,QAAO,KAChC,CAAC,cAAc,EAAEO,cAAc,WAAW,OAAO,EACnDP,WAAW,UAAU,iBACrBA,WAAW,cAAc,gBACzBG,aAAa,CAAC,UAAU,EAAEA,WAAW,EACrCC,kBAAkB,CAAC,IAAI,EAAEA,gBAAgB,EACzCC,iBAAiB,CAAC,IAAI,EAAEA,eAAe,EACvCJ,aAAa,CAAC,IAAI,EAAEA,WAAW,EAC/BC,cAAc,CAAC,IAAI,EAAEA,YAAY,EACjCR,UAAUA,WAAW,WAAW,eAChCA,WAAW,WAAW,qBACtBA,WAAW,eAAe,0BAC1BK,iBAAiB,WAAW,qBAC5BA,iBAAiB,UAAU,oBAC3BO,gBAAgBA,iBAAiB,WAAW,cAC5CA,iBAAiB,cAAc,gBAC/BR,WAAW,2BACXL;AAEJ"}

package/dist/delegateEvent.d.ts

@@ -12,11 +12,11 @@ export interface DelegatedEventHandler {
     /**
      * Adds the provided callback to the throttled event listener.
      */
-    add(callback: EventListener): void;
+    add: (callback: EventListener) => void;
     /**
      * Attempts to remove the provided callback from the throttled event listener.
      */
-    remove(callback: EventListener): void;
+    remove: (callback: EventListener) => void;
 }
 /** @internal */
 export interface DelegableEvent {

package/dist/delegateEvent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/delegateEvent.ts"],"sourcesContent":["/** @internal */\nexport type DelegatedEventTarget = Window | Document | HTMLElement;\n\n/**\n * This is a \"shared\" event handler for the provided `eventType`. The event\n * listener will only be created once, but every single callback will be called\n * when the throttled event is triggered. This means that you will need to make\n * sure to remove the provided callback when it is no longer in use.\n *\n * @internal\n */\nexport interface DelegatedEventHandler {\n  /**\n   * Adds the provided callback to the throttled event listener.\n   */\n  add(callback: EventListener): void;\n\n  /**\n   * Attempts to remove the provided callback from the throttled event listener.\n   */\n  remove(callback: EventListener): void;\n}\n\n/** @internal */\nexport interface DelegableEvent {\n  type: string;\n  target: DelegatedEventTarget;\n  throttle: boolean;\n  handler: DelegatedEventHandler;\n  options?: boolean | AddEventListenerOptions;\n}\n\nconst delegatedEvents: DelegableEvent[] = [];\n\n/**\n * Creates the delegated event handler that will run all the callbacks once an\n * event happens. The callbacks' invocation can also be throttled for event\n * types that trigger rapidly for additional performance.\n *\n * The `<K extends keyof WindowEventMap` is a nice thing I found while looking\n * through the `lib.d.ts` implementation of `addEventListener` that will allow\n * you to get the \"correct\" event type when using the `add` and `remove`\n * functions once you have created this event handler. Otherwise there'd be ts\n * errors trying to do `MouseEvent` or `KeyboardEvent` in your listeners.\n */\nfunction createEventHandler<K extends keyof WindowEventMap>(\n  throttle: boolean,\n  callbacks: readonly EventListener[]\n): (event: WindowEventMap[K]) => void {\n  let running = false;\n  const runCallbacks = (event: WindowEventMap[K]) => () => {\n    for (let i = 0; i < callbacks.length; i += 1) {\n      callbacks[i](event);\n    }\n\n    running = false;\n  };\n\n  return function eventHandler(event) {\n    if (!throttle) {\n      runCallbacks(event)();\n      return;\n    }\n\n    if (running) {\n      return;\n    }\n\n    running = true;\n    window.requestAnimationFrame(runCallbacks(event));\n  };\n}\n\n/**\n * Creates a throttled event handler for the provided event type and event\n * target.\n */\nfunction createDelegatedEventHandler(\n  eventType: string,\n  eventTarget: DelegatedEventTarget = window,\n  throttle = false,\n  options?: boolean | AddEventListenerOptions\n): DelegatedEventHandler {\n  const callbacks: EventListener[] = [];\n  const handler = createEventHandler(throttle, callbacks);\n\n  return {\n    /**\n     * Attempts to add the provided callback to the list of callbacks for the\n     * throttled event. If this is the first callback to be added, the throttled\n     * event will also be started.\n     */\n    add: (callback: EventListener) => {\n      if (!callbacks.length) {\n        eventTarget.addEventListener(eventType, handler, options);\n      }\n\n      if (callbacks.indexOf(callback) === -1) {\n        callbacks.push(callback);\n      }\n    },\n\n    /**\n     * Attempts to remove the provided callback from the list of callbacks for\n     * the throttled event. If this is the last callback that was removed, the\n     * throttled event will also be stopped.\n     */\n    remove: (callback: EventListener) => {\n      const i = callbacks.indexOf(callback);\n      if (i >= 0) {\n        callbacks.splice(i, 1);\n\n        if (!callbacks.length) {\n          eventTarget.removeEventListener(eventType, handler, options);\n        }\n      }\n    },\n  };\n}\n\n/**\n * Creates a delegated event listener using custom events. Most of this code\n * comes from the MDN about resize listeners.\n *\n * This will return an object for adding or removing event handlers for the\n * provided `eventType` since only one base throttled event listener will be\n * created. Each callback that is added will be called with the event each time\n * the event is triggered. This does mean that you will manually need to remove\n * your callback like normal or else it can be called when no longer in use.\n * This also means that it doesn't \"hurt\" to call this function without\n * immediately calling the `add` function since the event won't start until\n * there is at least 1 callback.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/Events/resize#Examples\n * @param eventType - One of the event types that should be used to create a\n * delegated event for. This should be things like resize, click, scroll, etc.\n * @param eventTarget - The target that should have the delegated event handler\n * attached to. This is normally the window, but can be any element as needed.\n * @param throttle - Boolean if the event should be throttled or not. Normally\n * only event types like resize or scroll should be throttled for performance\n * boosts, but anything can be.\n * @returns The delegated event handler that allows you to add or remove\n * `EventListener`s to that event.\n * @internal\n */\nexport function delegateEvent(\n  eventType: string,\n  eventTarget: DelegatedEventTarget = window,\n  throttle: boolean = eventType === \"resize\" || eventType === \"scroll\",\n  options?: boolean | AddEventListenerOptions\n): DelegatedEventHandler {\n  let index = delegatedEvents.findIndex(\n    (event) =>\n      event.type === eventType &&\n      event.target === eventTarget &&\n      event.options === options &&\n      event.throttle === throttle\n  );\n\n  if (index === -1) {\n    delegatedEvents.push({\n      type: eventType,\n      target: eventTarget,\n      options,\n      throttle,\n      handler: createDelegatedEventHandler(\n        eventType,\n        eventTarget,\n        throttle,\n        options\n      ),\n    });\n\n    index = delegatedEvents.length - 1;\n  }\n\n  return delegatedEvents[index].handler;\n}\n"],"names":["delegatedEvents","createEventHandler","throttle","callbacks","running","runCallbacks","event","i","length","eventHandler","window","requestAnimationFrame","createDelegatedEventHandler","eventType","eventTarget","options","handler","add","callback","addEventListener","indexOf","push","remove","splice","removeEventListener","delegateEvent","index","findIndex","type","target"],"mappings":"AAAA,cAAc,GAgCd,MAAMA,kBAAoC,EAAE;AAE5C;;;;;;;;;;CAUC,GACD,SAASC,mBACPC,QAAiB,EACjBC,SAAmC;IAEnC,IAAIC,UAAU;IACd,MAAMC,eAAe,CAACC,QAA6B;YACjD,IAAK,IAAIC,IAAI,GAAGA,IAAIJ,UAAUK,MAAM,EAAED,KAAK,EAAG;gBAC5CJ,SAAS,CAACI,EAAE,CAACD;YACf;YAEAF,UAAU;QACZ;IAEA,OAAO,SAASK,aAAaH,KAAK;QAChC,IAAI,CAACJ,UAAU;YACbG,aAAaC;YACb;QACF;QAEA,IAAIF,SAAS;YACX;QACF;QAEAA,UAAU;QACVM,OAAOC,qBAAqB,CAACN,aAAaC;IAC5C;AACF;AAEA;;;CAGC,GACD,SAASM,4BACPC,SAAiB,EACjBC,cAAoCJ,MAAM,EAC1CR,WAAW,KAAK,EAChBa,OAA2C;IAE3C,MAAMZ,YAA6B,EAAE;IACrC,MAAMa,UAAUf,mBAAmBC,UAAUC;IAE7C,OAAO;QACL;;;;KAIC,GACDc,KAAK,CAACC;YACJ,IAAI,CAACf,UAAUK,MAAM,EAAE;gBACrBM,YAAYK,gBAAgB,CAACN,WAAWG,SAASD;YACnD;YAEA,IAAIZ,UAAUiB,OAAO,CAACF,cAAc,CAAC,GAAG;gBACtCf,UAAUkB,IAAI,CAACH;YACjB;QACF;QAEA;;;;KAIC,GACDI,QAAQ,CAACJ;YACP,MAAMX,IAAIJ,UAAUiB,OAAO,CAACF;YAC5B,IAAIX,KAAK,GAAG;gBACVJ,UAAUoB,MAAM,CAAChB,GAAG;gBAEpB,IAAI,CAACJ,UAAUK,MAAM,EAAE;oBACrBM,YAAYU,mBAAmB,CAACX,WAAWG,SAASD;gBACtD;YACF;QACF;IACF;AACF;AAEA;;;;;;;;;;;;;;;;;;;;;;;;CAwBC,GACD,OAAO,SAASU,cACdZ,SAAiB,EACjBC,cAAoCJ,MAAM,EAC1CR,WAAoBW,cAAc,YAAYA,cAAc,QAAQ,EACpEE,OAA2C;IAE3C,IAAIW,QAAQ1B,gBAAgB2B,SAAS,CACnC,CAACrB,QACCA,MAAMsB,IAAI,KAAKf,aACfP,MAAMuB,MAAM,KAAKf,eACjBR,MAAMS,OAAO,KAAKA,WAClBT,MAAMJ,QAAQ,KAAKA;IAGvB,IAAIwB,UAAU,CAAC,GAAG;QAChB1B,gBAAgBqB,IAAI,CAAC;YACnBO,MAAMf;YACNgB,QAAQf;YACRC;YACAb;YACAc,SAASJ,4BACPC,WACAC,aACAZ,UACAa;QAEJ;QAEAW,QAAQ1B,gBAAgBQ,MAAM,GAAG;IACnC;IAEA,OAAOR,eAAe,CAAC0B,MAAM,CAACV,OAAO;AACvC"}
+{"version":3,"sources":["../src/delegateEvent.ts"],"sourcesContent":["/** @internal */\nexport type DelegatedEventTarget = Window | Document | HTMLElement;\n\n/**\n * This is a \"shared\" event handler for the provided `eventType`. The event\n * listener will only be created once, but every single callback will be called\n * when the throttled event is triggered. This means that you will need to make\n * sure to remove the provided callback when it is no longer in use.\n *\n * @internal\n */\nexport interface DelegatedEventHandler {\n  /**\n   * Adds the provided callback to the throttled event listener.\n   */\n  add: (callback: EventListener) => void;\n\n  /**\n   * Attempts to remove the provided callback from the throttled event listener.\n   */\n  remove: (callback: EventListener) => void;\n}\n\n/** @internal */\nexport interface DelegableEvent {\n  type: string;\n  target: DelegatedEventTarget;\n  throttle: boolean;\n  handler: DelegatedEventHandler;\n  options?: boolean | AddEventListenerOptions;\n}\n\nconst delegatedEvents: DelegableEvent[] = [];\n\n/**\n * Creates the delegated event handler that will run all the callbacks once an\n * event happens. The callbacks' invocation can also be throttled for event\n * types that trigger rapidly for additional performance.\n *\n * The `<K extends keyof WindowEventMap` is a nice thing I found while looking\n * through the `lib.d.ts` implementation of `addEventListener` that will allow\n * you to get the \"correct\" event type when using the `add` and `remove`\n * functions once you have created this event handler. Otherwise there'd be ts\n * errors trying to do `MouseEvent` or `KeyboardEvent` in your listeners.\n */\nfunction createEventHandler(\n  throttle: boolean,\n  callbacks: readonly EventListener[]\n): (event: WindowEventMap[keyof WindowEventMap]) => void {\n  let running = false;\n  const runCallbacks = (event: WindowEventMap[keyof WindowEventMap]) => () => {\n    for (let i = 0; i < callbacks.length; i += 1) {\n      callbacks[i](event);\n    }\n\n    running = false;\n  };\n\n  return function eventHandler(event) {\n    if (!throttle) {\n      runCallbacks(event)();\n      return;\n    }\n\n    if (running) {\n      return;\n    }\n\n    running = true;\n    window.requestAnimationFrame(runCallbacks(event));\n  };\n}\n\n/**\n * Creates a throttled event handler for the provided event type and event\n * target.\n */\nfunction createDelegatedEventHandler(\n  eventType: string,\n  eventTarget: DelegatedEventTarget = window,\n  throttle = false,\n  options?: boolean | AddEventListenerOptions\n): DelegatedEventHandler {\n  const callbacks: EventListener[] = [];\n  const handler = createEventHandler(throttle, callbacks);\n\n  return {\n    /**\n     * Attempts to add the provided callback to the list of callbacks for the\n     * throttled event. If this is the first callback to be added, the throttled\n     * event will also be started.\n     */\n    add: (callback: EventListener) => {\n      if (!callbacks.length) {\n        eventTarget.addEventListener(eventType, handler, options);\n      }\n\n      if (callbacks.indexOf(callback) === -1) {\n        callbacks.push(callback);\n      }\n    },\n\n    /**\n     * Attempts to remove the provided callback from the list of callbacks for\n     * the throttled event. If this is the last callback that was removed, the\n     * throttled event will also be stopped.\n     */\n    remove: (callback: EventListener) => {\n      const i = callbacks.indexOf(callback);\n      if (i >= 0) {\n        callbacks.splice(i, 1);\n\n        if (!callbacks.length) {\n          eventTarget.removeEventListener(eventType, handler, options);\n        }\n      }\n    },\n  };\n}\n\n/**\n * Creates a delegated event listener using custom events. Most of this code\n * comes from the MDN about resize listeners.\n *\n * This will return an object for adding or removing event handlers for the\n * provided `eventType` since only one base throttled event listener will be\n * created. Each callback that is added will be called with the event each time\n * the event is triggered. This does mean that you will manually need to remove\n * your callback like normal or else it can be called when no longer in use.\n * This also means that it doesn't \"hurt\" to call this function without\n * immediately calling the `add` function since the event won't start until\n * there is at least 1 callback.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/Events/resize#Examples\n * @param eventType - One of the event types that should be used to create a\n * delegated event for. This should be things like resize, click, scroll, etc.\n * @param eventTarget - The target that should have the delegated event handler\n * attached to. This is normally the window, but can be any element as needed.\n * @param throttle - Boolean if the event should be throttled or not. Normally\n * only event types like resize or scroll should be throttled for performance\n * boosts, but anything can be.\n * @returns The delegated event handler that allows you to add or remove\n * `EventListener`s to that event.\n * @internal\n */\nexport function delegateEvent(\n  eventType: string,\n  eventTarget: DelegatedEventTarget = window,\n  throttle: boolean = eventType === \"resize\" || eventType === \"scroll\",\n  options?: boolean | AddEventListenerOptions\n): DelegatedEventHandler {\n  let index = delegatedEvents.findIndex(\n    (event) =>\n      event.type === eventType &&\n      event.target === eventTarget &&\n      event.options === options &&\n      event.throttle === throttle\n  );\n\n  if (index === -1) {\n    delegatedEvents.push({\n      type: eventType,\n      target: eventTarget,\n      options,\n      throttle,\n      handler: createDelegatedEventHandler(\n        eventType,\n        eventTarget,\n        throttle,\n        options\n      ),\n    });\n\n    index = delegatedEvents.length - 1;\n  }\n\n  return delegatedEvents[index].handler;\n}\n"],"names":["delegatedEvents","createEventHandler","throttle","callbacks","running","runCallbacks","event","i","length","eventHandler","window","requestAnimationFrame","createDelegatedEventHandler","eventType","eventTarget","options","handler","add","callback","addEventListener","indexOf","push","remove","splice","removeEventListener","delegateEvent","index","findIndex","type","target"],"mappings":"AAAA,cAAc,GAgCd,MAAMA,kBAAoC,EAAE;AAE5C;;;;;;;;;;CAUC,GACD,SAASC,mBACPC,QAAiB,EACjBC,SAAmC;IAEnC,IAAIC,UAAU;IACd,MAAMC,eAAe,CAACC,QAAgD;YACpE,IAAK,IAAIC,IAAI,GAAGA,IAAIJ,UAAUK,MAAM,EAAED,KAAK,EAAG;gBAC5CJ,SAAS,CAACI,EAAE,CAACD;YACf;YAEAF,UAAU;QACZ;IAEA,OAAO,SAASK,aAAaH,KAAK;QAChC,IAAI,CAACJ,UAAU;YACbG,aAAaC;YACb;QACF;QAEA,IAAIF,SAAS;YACX;QACF;QAEAA,UAAU;QACVM,OAAOC,qBAAqB,CAACN,aAAaC;IAC5C;AACF;AAEA;;;CAGC,GACD,SAASM,4BACPC,SAAiB,EACjBC,cAAoCJ,MAAM,EAC1CR,WAAW,KAAK,EAChBa,OAA2C;IAE3C,MAAMZ,YAA6B,EAAE;IACrC,MAAMa,UAAUf,mBAAmBC,UAAUC;IAE7C,OAAO;QACL;;;;KAIC,GACDc,KAAK,CAACC;YACJ,IAAI,CAACf,UAAUK,MAAM,EAAE;gBACrBM,YAAYK,gBAAgB,CAACN,WAAWG,SAASD;YACnD;YAEA,IAAIZ,UAAUiB,OAAO,CAACF,cAAc,CAAC,GAAG;gBACtCf,UAAUkB,IAAI,CAACH;YACjB;QACF;QAEA;;;;KAIC,GACDI,QAAQ,CAACJ;YACP,MAAMX,IAAIJ,UAAUiB,OAAO,CAACF;YAC5B,IAAIX,KAAK,GAAG;gBACVJ,UAAUoB,MAAM,CAAChB,GAAG;gBAEpB,IAAI,CAACJ,UAAUK,MAAM,EAAE;oBACrBM,YAAYU,mBAAmB,CAACX,WAAWG,SAASD;gBACtD;YACF;QACF;IACF;AACF;AAEA;;;;;;;;;;;;;;;;;;;;;;;;CAwBC,GACD,OAAO,SAASU,cACdZ,SAAiB,EACjBC,cAAoCJ,MAAM,EAC1CR,WAAoBW,cAAc,YAAYA,cAAc,QAAQ,EACpEE,OAA2C;IAE3C,IAAIW,QAAQ1B,gBAAgB2B,SAAS,CACnC,CAACrB,QACCA,MAAMsB,IAAI,KAAKf,aACfP,MAAMuB,MAAM,KAAKf,eACjBR,MAAMS,OAAO,KAAKA,WAClBT,MAAMJ,QAAQ,KAAKA;IAGvB,IAAIwB,UAAU,CAAC,GAAG;QAChB1B,gBAAgBqB,IAAI,CAAC;YACnBO,MAAMf;YACNgB,QAAQf;YACRC;YACAb;YACAc,SAASJ,4BACPC,WACAC,aACAZ,UACAa;QAEJ;QAEAW,QAAQ1B,gBAAgBQ,MAAM,GAAG;IACnC;IAEA,OAAOR,eAAe,CAAC0B,MAAM,CAACV,OAAO;AACvC"}

package/dist/dialog/Dialog.d.ts

@@ -1,26 +1,8 @@
 import { type HTMLAttributes } from "react";
 import { type FocusContainerComponentProps } from "../focus/useFocusContainer.js";
-import { type CSSTransitionClassNames, type CSSTransitionComponentProps, type TransitionActions, type TransitionTimeout } from "../transition/types.js";
+import { type CSSTransitionComponentProps, type TransitionActions } from "../transition/types.js";
 import { type LabelRequiredForA11y } from "../types.js";
-import { type DialogType } from "./styles.js";
-declare module "react" {
-    interface CSSProperties {
-        "--rmd-dialog-background-color"?: string;
-        "--rmd-dialog-color"?: string;
-        "--rmd-dialog-min-width"?: string | number;
-        "--rmd-dialog-horizontal-margin"?: string | number;
-        "--rmd-dialog-vertical-margin"?: string | number;
-        "--rmd-dialog-z-index"?: string | number;
-        "--rmd-dialog-header-padding"?: string | number;
-        "--rmd-dialog-header-padding-bottom"?: string | number;
-        "--rmd-dialog-content-padding"?: string | number;
-        "--rmd-dialog-footer-padding"?: string | number;
-    }
-}
-/** @since 4.0.0 */
-export declare const DEFAULT_DIALOG_CLASSNAMES: Readonly<CSSTransitionClassNames>;
-/** @since 4.0.0 */
-export declare const DEFAULT_DIALOG_TIMEOUT: Readonly<TransitionTimeout>;
+import { type DialogWidth, type DialogType } from "./styles.js";
 export interface BaseDialogProps extends HTMLAttributes<HTMLDivElement>, CSSTransitionComponentProps, TransitionActions, FocusContainerComponentProps {
     /**
      * @defaultValue `"dialog-" + useId()`
@@ -30,6 +12,11 @@ export interface BaseDialogProps extends HTMLAttributes<HTMLDivElement>, CSSTran
      * @defaultValue `"centered"`
      */
     type?: DialogType;
+    /**
+     * @see {@link DialogWidth}
+     * @defaultValue `"auto"`
+     */
+    width?: DialogWidth;
     /**
      * @defaultValue `"dialog"`
      */
@@ -45,7 +32,7 @@ export interface BaseDialogProps extends HTMLAttributes<HTMLDivElement>, CSSTran
      *   the user presses the `"Escape"` key.
      * - The overlay element is clicked
      */
-    onRequestClose(): void;
+    onRequestClose: () => void;
     /** @defaultValue `false` */
     disableTransition?: boolean;
     /** @defaultValue `-1` */

package/dist/dialog/Dialog.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cnb } from "cnbuilder";
 import { forwardRef, useState } from "react";
 import { useSsr } from "../SsrProvider.js";
 import { useFocusContainer } from "../focus/useFocusContainer.js";
@@ -9,22 +8,8 @@ import { Portal } from "../portal/Portal.js";
 import { useScrollLock } from "../scroll/useScrollLock.js";
 import { useCSSTransition } from "../transition/useCSSTransition.js";
 import { useEnsuredId } from "../useEnsuredId.js";
-import { DISPLAY_NONE_CLASS } from "../utils/isElementVisible.js";
-import { DialogContainer } from "./DialogContainer.js";
 import { NestedDialogProvider, useNestedDialogContext } from "./NestedDialogProvider.js";
-import { dialog } from "./styles.js";
-/** @since 4.0.0 */ export const DEFAULT_DIALOG_CLASSNAMES = {
-    appear: "rmd-dialog--enter",
-    appearActive: "rmd-dialog--enter-active",
-    enter: "rmd-dialog--enter",
-    enterActive: "rmd-dialog--enter-active",
-    exit: "rmd-dialog--exit",
-    exitActive: "rmd-dialog--exit-active"
-};
-/** @since 4.0.0 */ export const DEFAULT_DIALOG_TIMEOUT = {
-    enter: 200,
-    exit: 150
-};
+import { DEFAULT_DIALOG_CLASSNAMES, DEFAULT_DIALOG_TIMEOUT, dialog, dialogContainer } from "./styles.js";
 const noop = ()=>{
 // do nothing
 };
@@ -82,17 +67,32 @@ const noopBool = ()=>false;
  * within once it becomes visible. You must manually add `autoFocus` to a
  * element instead.
  */ export const Dialog = /*#__PURE__*/ forwardRef(function Dialog(props, ref) {
-    const { id: propId, fixed = false, modal = false, role = modal ? "alertdialog" : "dialog", type = "centered", tabIndex = -1, visible, onRequestClose, containerProps, temporary = true, className, timeout = DEFAULT_DIALOG_TIMEOUT, classNames = DEFAULT_DIALOG_CLASSNAMES, disableTransition = false, appear, enter, exit, onEnter = noop, onEntering = noop, onEntered, onExit = noop, onExiting = noop, onExited, exitedHidden = true, disableOverlay = false, overlayProps, overlayHidden, onKeyDown = noop, isFocusTypeDisabled = noopBool, disablePortal: propDisablePortal, disableScrollLock = false, disableEscapeClose = modal, disableFocusOutline = type === "full-page", children, ...remaining } = props;
+    const { id: propId, fixed = false, modal = false, role = modal ? "alertdialog" : "dialog", type = "centered", width, tabIndex = -1, visible, onRequestClose, containerProps, temporary = true, className, timeout = DEFAULT_DIALOG_TIMEOUT, classNames = DEFAULT_DIALOG_CLASSNAMES, disableTransition = false, appear = false, enter = true, exit = true, onEnter = noop, onEntering = noop, onEntered = noop, onExit = noop, onExiting = noop, onExited = noop, exitedHidden = true, disableOverlay = false, overlayProps, overlayHidden, onKeyDown = noop, isFocusTypeDisabled = noopBool, disablePortal: propDisablePortal, disableScrollLock = false, disableEscapeClose = modal, disableFocusOutline = type === "full-page", children, ...remaining } = props;
     const id = useEnsuredId(propId, "dialog");
     const ssr = useSsr();
     const setChildVisible = useNestedDialogContext();
+    // this makes it so that as more non-full page dialogs become visible, the
+    // overlay does not become darker as more and more overlays are stacked upon
+    // each other. only the top-most overlay will have and active background
+    // color.
+    const [isChildVisible, setIsChildVisible] = useState(false);
     const { eventHandlers, transitionOptions } = useFocusContainer({
         nodeRef: ref,
         activate: visible,
-        onEntered,
+        onEntered (appear) {
+            onEntered(appear);
+            // this needs to be called onEnter and onEntered just in case the
+            // transition is disabled
+            setChildVisible(type !== "full-page");
+        },
         onEntering,
         onExiting,
-        onExited,
+        onExited () {
+            onExited();
+            // this needs to be called onExit and onExited just in case the
+            // transition is disabled
+            setChildVisible(false);
+        },
         disableTransition,
         onKeyDown (event) {
             onKeyDown(event);
@@ -111,8 +111,10 @@ const noopBool = ()=>false;
         classNames,
         className: dialog({
             type,
+            width,
             fixed,
             outline: !disableFocusOutline,
+            disableBoxShadow: isChildVisible,
             className
         }),
         appear: appear && !disableTransition && !ssr,
@@ -132,11 +134,6 @@ const noopBool = ()=>false;
         ...transitionOptions
     });
     useScrollLock(!disableScrollLock && visible);
-    // this makes it so that as more non-full page dialogs become visible, the
-    // overlay does not become darker as more and more overlays are stacked upon
-    // each other. only the top-most overlay will have and active background
-    // color.
-    const [isChildVisible, setIsChildVisible] = useState(false);
     return /*#__PURE__*/ _jsxs(NestedDialogProvider, {
         value: setIsChildVisible,
         children: [
@@ -152,10 +149,13 @@ const noopBool = ()=>false;
             }),
             /*#__PURE__*/ _jsx(Portal, {
                 disabled: disablePortal,
-                children: rendered && /*#__PURE__*/ _jsx(DialogContainer, {
+                children: rendered && /*#__PURE__*/ _jsx("div", {
                     ...containerProps,
-                    className: cnb(containerProps?.className, !temporary && exitedHidden && stage === "exited" && DISPLAY_NONE_CLASS),
-                    enabled: type === "centered",
+                    className: dialogContainer({
+                        className: containerProps?.className,
+                        centered: type === "centered",
+                        displayNone: !temporary && exitedHidden && stage === "exited"
+                    }),
                     children: /*#__PURE__*/ _jsx("div", {
                         "aria-modal": modal || undefined,
                         ...remaining,

package/dist/dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef, useState, type HTMLAttributes } from \"react\";\nimport { useSsr } from \"../SsrProvider.js\";\nimport {\n  useFocusContainer,\n  type FocusContainerComponentProps,\n} from \"../focus/useFocusContainer.js\";\nimport { Overlay } from \"../overlay/Overlay.js\";\nimport { Portal } from \"../portal/Portal.js\";\nimport { useScrollLock } from \"../scroll/useScrollLock.js\";\nimport {\n  type CSSTransitionClassNames,\n  type CSSTransitionComponentProps,\n  type TransitionActions,\n  type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useCSSTransition } from \"../transition/useCSSTransition.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { DISPLAY_NONE_CLASS } from \"../utils/isElementVisible.js\";\nimport { DialogContainer } from \"./DialogContainer.js\";\nimport {\n  NestedDialogProvider,\n  useNestedDialogContext,\n} from \"./NestedDialogProvider.js\";\nimport { dialog, type DialogType } from \"./styles.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-dialog-background-color\"?: string;\n    \"--rmd-dialog-color\"?: string;\n    \"--rmd-dialog-min-width\"?: string | number;\n    \"--rmd-dialog-horizontal-margin\"?: string | number;\n    \"--rmd-dialog-vertical-margin\"?: string | number;\n    \"--rmd-dialog-z-index\"?: string | number;\n    \"--rmd-dialog-header-padding\"?: string | number;\n    \"--rmd-dialog-header-padding-bottom\"?: string | number;\n    \"--rmd-dialog-content-padding\"?: string | number;\n    \"--rmd-dialog-footer-padding\"?: string | number;\n  }\n}\n\n/** @since 4.0.0 */\nexport const DEFAULT_DIALOG_CLASSNAMES: Readonly<CSSTransitionClassNames> = {\n  appear: \"rmd-dialog--enter\",\n  appearActive: \"rmd-dialog--enter-active\",\n  enter: \"rmd-dialog--enter\",\n  enterActive: \"rmd-dialog--enter-active\",\n  exit: \"rmd-dialog--exit\",\n  exitActive: \"rmd-dialog--exit-active\",\n};\n\n/** @since 4.0.0 */\nexport const DEFAULT_DIALOG_TIMEOUT: Readonly<TransitionTimeout> = {\n  enter: 200,\n  exit: 150,\n};\n\nconst noop = (): void => {\n  // do nothing\n};\n\nconst noopBool = (): boolean => false;\n\nexport interface BaseDialogProps\n  extends HTMLAttributes<HTMLDivElement>,\n    CSSTransitionComponentProps,\n    TransitionActions,\n    FocusContainerComponentProps {\n  /**\n   * @defaultValue `\"dialog-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * @defaultValue `\"centered\"`\n   */\n  type?: DialogType;\n\n  /**\n   * @defaultValue `\"dialog\"`\n   */\n  role?: \"dialog\" | \"alertdialog\" | \"menu\" | \"none\";\n\n  /**\n   * This value controls the visibility of the dialog.\n   */\n  visible: boolean;\n\n  /**\n   * This function should set the {@link visible} prop to false to hide the\n   * modal when:\n   * - the {@link modal} and {@link disableEscapeClose} props are `false` and\n   *   the user presses the `\"Escape\"` key.\n   * - The overlay element is clicked\n   */\n  onRequestClose(): void;\n\n  /** @defaultValue `false` */\n  disableTransition?: boolean;\n\n  /** @defaultValue `-1` */\n  tabIndex?: number;\n\n  /**\n   * Set this value to `true` if the dialog should behave as a modal which\n   * prevents the modal from being closed by pressing the `\"Escape\"` key or\n   * clicking the overlay. The user **must** click one of the actions within the\n   * dialog instead.\n   *\n   * @defaultValue `false`\n   */\n  modal?: boolean;\n\n  /**\n   * @internal\n   * @defaultValue `false`\n   */\n  fixed?: boolean;\n\n  /**\n   * Set this to `true` if the dialog should no longer use the `Portal`\n   * behavior.\n   *\n   * @defaultValue `false`\n   */\n  disablePortal?: boolean;\n\n  /**\n   * Set this to `true` if you want the page to still be scrollable while the\n   * dialog is visible. This should normally be `true` for popovers/fixed\n   * dialogs.\n   *\n   * @defaultValue `type === \"custom\"`\n   */\n  disableScrollLock?: boolean;\n\n  /**\n   * Set this to `true` to prevent the dialog from being closed when the\n   * `\"Escape\"` key is pressed. This is `true` by default when the {@link modal}\n   * prop is `true`\n   *\n   * @defaultValue `modal`\n   */\n  disableEscapeClose?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should not appear behind the dialog.\n   *\n   * Note: this was changed from `type === \"full-page\"` to `false` so that you\n   * can change between full-page and centered based on media queries. If the\n   * type changes the overlay would end up rendering above the dialog instead of\n   * behind.\n   *\n   * @see {@link overlayHidden}\n   * @defaultValue `false`\n   */\n  disableOverlay?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should be appear behind the dialog but\n   * have an `opacity: 0`. This is useful if you want to prevent other elements\n   * on the page from being clicked while the dialog is visible, but don't want\n   * a dark background. i.e. popovers/fixed dialogs.\n   *\n   * @defaultValue `false`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * Any additional props that should be passed to the overlay element if it is\n   * rendered.\n   */\n  overlayProps?: HTMLAttributes<HTMLSpanElement>;\n\n  /**\n   * Any additional props that should be passed to the container element when\n   * the `type === \"centered\"`.\n   */\n  containerProps?: HTMLAttributes<HTMLDivElement>;\n\n  /**\n   * @see {@link DEFAULT_DIALOG_TIMEOUT}\n   * @defaultValue `DEFAULT_DIALOG_TIMEOUT`\n   */\n  timeout?: CSSTransitionComponentProps[\"timeout\"];\n\n  /**\n   * @see {@link DEFAULT_DIALOG_CLASSNAMES}\n   * @defaultValue `DEFAULT_DIALOG_CLASSNAMES`\n   */\n  classNames?: CSSTransitionComponentProps[\"classNames\"];\n\n  /**\n   * Set this to `true` if the `Dialog` should not gain the normal focus box\n   * shadow while it is focused. The `Dialog` should normally only gain focus\n   * when it becomes visible and no child elements have `autoFocus` enabled.\n   *\n   * @since 6.0.0\n   * @defaultValue `type === \"full-page\"`\n   */\n  disableFocusOutline?: boolean;\n}\n\nexport type DialogProps = LabelRequiredForA11y<BaseDialogProps>;\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import {\n *   Button,\n *   Dialog,\n *   DialogHeader,\n *   DialogTitle,\n *   DialogContent,\n *   DialogFooter,\n *   Typography,\n *   useToggle,\n * } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *\n *   return (\n *     <>\n *       <Button onClick={toggle}>Toggle</Button>\n *       <Dialog\n *         aria-labelledby=\"dialog-title\"\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id=\"dialog-title\">Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </Dialog>\n *     </>\n *   );\n * }\n * ```\n *\n * @since 6.0.0 The `Dialog` no longer supports focusing elements\n * within once it becomes visible. You must manually add `autoFocus` to a\n * element instead.\n */\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(\n  function Dialog(props, ref) {\n    const {\n      id: propId,\n      fixed = false,\n      modal = false,\n      role = modal ? \"alertdialog\" : \"dialog\",\n      type = \"centered\",\n      tabIndex = -1,\n      visible,\n      onRequestClose,\n      containerProps,\n      temporary = true,\n      className,\n      timeout = DEFAULT_DIALOG_TIMEOUT,\n      classNames = DEFAULT_DIALOG_CLASSNAMES,\n      disableTransition = false,\n      appear,\n      enter,\n      exit,\n      onEnter = noop,\n      onEntering = noop,\n      onEntered,\n      onExit = noop,\n      onExiting = noop,\n      onExited,\n      exitedHidden = true,\n      disableOverlay = false,\n      overlayProps,\n      overlayHidden,\n      onKeyDown = noop,\n      isFocusTypeDisabled = noopBool,\n      disablePortal: propDisablePortal,\n      disableScrollLock = false,\n      disableEscapeClose = modal,\n      disableFocusOutline = type === \"full-page\",\n      children,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"dialog\");\n\n    const ssr = useSsr();\n    const setChildVisible = useNestedDialogContext();\n    const { eventHandlers, transitionOptions } = useFocusContainer({\n      nodeRef: ref,\n      activate: visible,\n      onEntered,\n      onEntering,\n      onExiting,\n      onExited,\n      disableTransition,\n      onKeyDown(event) {\n        onKeyDown(event);\n        if (\n          event.isPropagationStopped() ||\n          modal ||\n          disableEscapeClose ||\n          event.key !== \"Escape\"\n        ) {\n          return;\n        }\n\n        // prevent parent dialogs from closing as well\n        event.stopPropagation();\n        onRequestClose();\n      },\n      isFocusTypeDisabled,\n    });\n    const { elementProps, stage, rendered, disablePortal } = useCSSTransition({\n      transitionIn: visible,\n      timeout,\n      classNames,\n      className: dialog({\n        type,\n        fixed,\n        outline: !disableFocusOutline,\n        className,\n      }),\n      appear: appear && !disableTransition && !ssr,\n      enter: enter && !disableTransition,\n      exit: exit && !disableTransition,\n      onEnter(appearing) {\n        onEnter(appearing);\n        setChildVisible(type !== \"full-page\");\n      },\n      onExit() {\n        onExit();\n        setChildVisible(false);\n      },\n      temporary,\n      exitedHidden,\n      disablePortal: propDisablePortal,\n      ...transitionOptions,\n    });\n    useScrollLock(!disableScrollLock && visible);\n\n    // this makes it so that as more non-full page dialogs become visible, the\n    // overlay does not become darker as more and more overlays are stacked upon\n    // each other. only the top-most overlay will have and active background\n    // color.\n    const [isChildVisible, setIsChildVisible] = useState(false);\n\n    return (\n      <NestedDialogProvider value={setIsChildVisible}>\n        {!disableOverlay && (\n          <Overlay\n            visible={visible}\n            disableTransition={disableTransition}\n            temporary={temporary}\n            disablePortal={disablePortal}\n            {...overlayProps}\n            onClick={modal ? noop : onRequestClose}\n            clickable={!modal}\n            noOpacity={overlayHidden || isChildVisible}\n          />\n        )}\n        <Portal disabled={disablePortal}>\n          {rendered && (\n            <DialogContainer\n              {...containerProps}\n              className={cnb(\n                containerProps?.className,\n                !temporary &&\n                  exitedHidden &&\n                  stage === \"exited\" &&\n                  DISPLAY_NONE_CLASS\n              )}\n              enabled={type === \"centered\"}\n            >\n              <div\n                aria-modal={modal || undefined}\n                {...remaining}\n                {...elementProps}\n                {...eventHandlers}\n                id={id}\n                role={role}\n                tabIndex={tabIndex}\n              >\n                {children}\n              </div>\n            </DialogContainer>\n          )}\n        </Portal>\n      </NestedDialogProvider>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","useState","useSsr","useFocusContainer","Overlay","Portal","useScrollLock","useCSSTransition","useEnsuredId","DISPLAY_NONE_CLASS","DialogContainer","NestedDialogProvider","useNestedDialogContext","dialog","DEFAULT_DIALOG_CLASSNAMES","appear","appearActive","enter","enterActive","exit","exitActive","DEFAULT_DIALOG_TIMEOUT","noop","noopBool","Dialog","props","ref","id","propId","fixed","modal","role","type","tabIndex","visible","onRequestClose","containerProps","temporary","className","timeout","classNames","disableTransition","onEnter","onEntering","onEntered","onExit","onExiting","onExited","exitedHidden","disableOverlay","overlayProps","overlayHidden","onKeyDown","isFocusTypeDisabled","disablePortal","propDisablePortal","disableScrollLock","disableEscapeClose","disableFocusOutline","children","remaining","ssr","setChildVisible","eventHandlers","transitionOptions","nodeRef","activate","event","isPropagationStopped","key","stopPropagation","elementProps","stage","rendered","transitionIn","outline","appearing","isChildVisible","setIsChildVisible","value","onClick","clickable","noOpacity","disabled","enabled","div","aria-modal","undefined"],"mappings":"AAAA;;AACA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,EAAEC,QAAQ,QAA6B,QAAQ;AAClE,SAASC,MAAM,QAAQ,oBAAoB;AAC3C,SACEC,iBAAiB,QAEZ,gCAAgC;AACvC,SAASC,OAAO,QAAQ,wBAAwB;AAChD,SAASC,MAAM,QAAQ,sBAAsB;AAC7C,SAASC,aAAa,QAAQ,6BAA6B;AAO3D,SAASC,gBAAgB,QAAQ,oCAAoC;AAErE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,kBAAkB,QAAQ,+BAA+B;AAClE,SAASC,eAAe,QAAQ,uBAAuB;AACvD,SACEC,oBAAoB,EACpBC,sBAAsB,QACjB,4BAA4B;AACnC,SAASC,MAAM,QAAyB,cAAc;AAiBtD,iBAAiB,GACjB,OAAO,MAAMC,4BAA+D;IAC1EC,QAAQ;IACRC,cAAc;IACdC,OAAO;IACPC,aAAa;IACbC,MAAM;IACNC,YAAY;AACd,EAAE;AAEF,iBAAiB,GACjB,OAAO,MAAMC,yBAAsD;IACjEJ,OAAO;IACPE,MAAM;AACR,EAAE;AAEF,MAAMG,OAAO;AACX,aAAa;AACf;AAEA,MAAMC,WAAW,IAAe;AAgJhC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDC,GACD,OAAO,MAAMC,uBAASxB,WACpB,SAASwB,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EACJC,IAAIC,MAAM,EACVC,QAAQ,KAAK,EACbC,QAAQ,KAAK,EACbC,OAAOD,QAAQ,gBAAgB,QAAQ,EACvCE,OAAO,UAAU,EACjBC,WAAW,CAAC,CAAC,EACbC,OAAO,EACPC,cAAc,EACdC,cAAc,EACdC,YAAY,IAAI,EAChBC,SAAS,EACTC,UAAUlB,sBAAsB,EAChCmB,aAAa1B,yBAAyB,EACtC2B,oBAAoB,KAAK,EACzB1B,MAAM,EACNE,KAAK,EACLE,IAAI,EACJuB,UAAUpB,IAAI,EACdqB,aAAarB,IAAI,EACjBsB,SAAS,EACTC,SAASvB,IAAI,EACbwB,YAAYxB,IAAI,EAChByB,QAAQ,EACRC,eAAe,IAAI,EACnBC,iBAAiB,KAAK,EACtBC,YAAY,EACZC,aAAa,EACbC,YAAY9B,IAAI,EAChB+B,sBAAsB9B,QAAQ,EAC9B+B,eAAeC,iBAAiB,EAChCC,oBAAoB,KAAK,EACzBC,qBAAqB3B,KAAK,EAC1B4B,sBAAsB1B,SAAS,WAAW,EAC1C2B,QAAQ,EACR,GAAGC,WACJ,GAAGnC;IACJ,MAAME,KAAKnB,aAAaoB,QAAQ;IAEhC,MAAMiC,MAAM3D;IACZ,MAAM4D,kBAAkBlD;IACxB,MAAM,EAAEmD,aAAa,EAAEC,iBAAiB,EAAE,GAAG7D,kBAAkB;QAC7D8D,SAASvC;QACTwC,UAAUhC;QACVU;QACAD;QACAG;QACAC;QACAN;QACAW,WAAUe,KAAK;YACbf,UAAUe;YACV,IACEA,MAAMC,oBAAoB,MAC1BtC,SACA2B,sBACAU,MAAME,GAAG,KAAK,UACd;gBACA;YACF;YAEA,8CAA8C;YAC9CF,MAAMG,eAAe;YACrBnC;QACF;QACAkB;IACF;IACA,MAAM,EAAEkB,YAAY,EAAEC,KAAK,EAAEC,QAAQ,EAAEnB,aAAa,EAAE,GAAG/C,iBAAiB;QACxEmE,cAAcxC;QACdK;QACAC;QACAF,WAAWzB,OAAO;YAChBmB;YACAH;YACA8C,SAAS,CAACjB;YACVpB;QACF;QACAvB,QAAQA,UAAU,CAAC0B,qBAAqB,CAACoB;QACzC5C,OAAOA,SAAS,CAACwB;QACjBtB,MAAMA,QAAQ,CAACsB;QACfC,SAAQkC,SAAS;YACflC,QAAQkC;YACRd,gBAAgB9B,SAAS;QAC3B;QACAa;YACEA;YACAiB,gBAAgB;QAClB;QACAzB;QACAW;QACAM,eAAeC;QACf,GAAGS,iBAAiB;IACtB;IACA1D,cAAc,CAACkD,qBAAqBtB;IAEpC,0EAA0E;IAC1E,4EAA4E;IAC5E,wEAAwE;IACxE,SAAS;IACT,MAAM,CAAC2C,gBAAgBC,kBAAkB,GAAG7E,SAAS;IAErD,qBACE,MAACU;QAAqBoE,OAAOD;;YAC1B,CAAC7B,gCACA,KAAC7C;gBACC8B,SAASA;gBACTO,mBAAmBA;gBACnBJ,WAAWA;gBACXiB,eAAeA;gBACd,GAAGJ,YAAY;gBAChB8B,SAASlD,QAAQR,OAAOa;gBACxB8C,WAAW,CAACnD;gBACZoD,WAAW/B,iBAAiB0B;;0BAGhC,KAACxE;gBAAO8E,UAAU7B;0BACfmB,0BACC,KAAC/D;oBACE,GAAG0B,cAAc;oBAClBE,WAAWvC,IACTqC,gBAAgBE,WAChB,CAACD,aACCW,gBACAwB,UAAU,YACV/D;oBAEJ2E,SAASpD,SAAS;8BAElB,cAAA,KAACqD;wBACCC,cAAYxD,SAASyD;wBACpB,GAAG3B,SAAS;wBACZ,GAAGW,YAAY;wBACf,GAAGR,aAAa;wBACjBpC,IAAIA;wBACJI,MAAMA;wBACNE,UAAUA;kCAET0B;;;;;;AAOf,GACA"}
+{"version":3,"sources":["../../src/dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, useState, type HTMLAttributes } from \"react\";\nimport { useSsr } from \"../SsrProvider.js\";\nimport {\n  useFocusContainer,\n  type FocusContainerComponentProps,\n} from \"../focus/useFocusContainer.js\";\nimport { Overlay } from \"../overlay/Overlay.js\";\nimport { Portal } from \"../portal/Portal.js\";\nimport { useScrollLock } from \"../scroll/useScrollLock.js\";\nimport {\n  type CSSTransitionComponentProps,\n  type TransitionActions,\n} from \"../transition/types.js\";\nimport { useCSSTransition } from \"../transition/useCSSTransition.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n  NestedDialogProvider,\n  useNestedDialogContext,\n} from \"./NestedDialogProvider.js\";\nimport {\n  DEFAULT_DIALOG_CLASSNAMES,\n  DEFAULT_DIALOG_TIMEOUT,\n  dialog,\n  dialogContainer,\n  type DialogWidth,\n  type DialogType,\n} from \"./styles.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\nconst noopBool = (): boolean => false;\n\nexport interface BaseDialogProps\n  extends HTMLAttributes<HTMLDivElement>,\n    CSSTransitionComponentProps,\n    TransitionActions,\n    FocusContainerComponentProps {\n  /**\n   * @defaultValue `\"dialog-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * @defaultValue `\"centered\"`\n   */\n  type?: DialogType;\n\n  /**\n   * @see {@link DialogWidth}\n   * @defaultValue `\"auto\"`\n   */\n  width?: DialogWidth;\n\n  /**\n   * @defaultValue `\"dialog\"`\n   */\n  role?: \"dialog\" | \"alertdialog\" | \"menu\" | \"none\";\n\n  /**\n   * This value controls the visibility of the dialog.\n   */\n  visible: boolean;\n\n  /**\n   * This function should set the {@link visible} prop to false to hide the\n   * modal when:\n   * - the {@link modal} and {@link disableEscapeClose} props are `false` and\n   *   the user presses the `\"Escape\"` key.\n   * - The overlay element is clicked\n   */\n  onRequestClose: () => void;\n\n  /** @defaultValue `false` */\n  disableTransition?: boolean;\n\n  /** @defaultValue `-1` */\n  tabIndex?: number;\n\n  /**\n   * Set this value to `true` if the dialog should behave as a modal which\n   * prevents the modal from being closed by pressing the `\"Escape\"` key or\n   * clicking the overlay. The user **must** click one of the actions within the\n   * dialog instead.\n   *\n   * @defaultValue `false`\n   */\n  modal?: boolean;\n\n  /**\n   * @internal\n   * @defaultValue `false`\n   */\n  fixed?: boolean;\n\n  /**\n   * Set this to `true` if the dialog should no longer use the `Portal`\n   * behavior.\n   *\n   * @defaultValue `false`\n   */\n  disablePortal?: boolean;\n\n  /**\n   * Set this to `true` if you want the page to still be scrollable while the\n   * dialog is visible. This should normally be `true` for popovers/fixed\n   * dialogs.\n   *\n   * @defaultValue `type === \"custom\"`\n   */\n  disableScrollLock?: boolean;\n\n  /**\n   * Set this to `true` to prevent the dialog from being closed when the\n   * `\"Escape\"` key is pressed. This is `true` by default when the {@link modal}\n   * prop is `true`\n   *\n   * @defaultValue `modal`\n   */\n  disableEscapeClose?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should not appear behind the dialog.\n   *\n   * Note: this was changed from `type === \"full-page\"` to `false` so that you\n   * can change between full-page and centered based on media queries. If the\n   * type changes the overlay would end up rendering above the dialog instead of\n   * behind.\n   *\n   * @see {@link overlayHidden}\n   * @defaultValue `false`\n   */\n  disableOverlay?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should be appear behind the dialog but\n   * have an `opacity: 0`. This is useful if you want to prevent other elements\n   * on the page from being clicked while the dialog is visible, but don't want\n   * a dark background. i.e. popovers/fixed dialogs.\n   *\n   * @defaultValue `false`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * Any additional props that should be passed to the overlay element if it is\n   * rendered.\n   */\n  overlayProps?: HTMLAttributes<HTMLSpanElement>;\n\n  /**\n   * Any additional props that should be passed to the container element when\n   * the `type === \"centered\"`.\n   */\n  containerProps?: HTMLAttributes<HTMLDivElement>;\n\n  /**\n   * @see {@link DEFAULT_DIALOG_TIMEOUT}\n   * @defaultValue `DEFAULT_DIALOG_TIMEOUT`\n   */\n  timeout?: CSSTransitionComponentProps[\"timeout\"];\n\n  /**\n   * @see {@link DEFAULT_DIALOG_CLASSNAMES}\n   * @defaultValue `DEFAULT_DIALOG_CLASSNAMES`\n   */\n  classNames?: CSSTransitionComponentProps[\"classNames\"];\n\n  /**\n   * Set this to `true` if the `Dialog` should not gain the normal focus box\n   * shadow while it is focused. The `Dialog` should normally only gain focus\n   * when it becomes visible and no child elements have `autoFocus` enabled.\n   *\n   * @since 6.0.0\n   * @defaultValue `type === \"full-page\"`\n   */\n  disableFocusOutline?: boolean;\n}\n\nexport type DialogProps = LabelRequiredForA11y<BaseDialogProps>;\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import {\n *   Button,\n *   Dialog,\n *   DialogHeader,\n *   DialogTitle,\n *   DialogContent,\n *   DialogFooter,\n *   Typography,\n *   useToggle,\n * } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *\n *   return (\n *     <>\n *       <Button onClick={toggle}>Toggle</Button>\n *       <Dialog\n *         aria-labelledby=\"dialog-title\"\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id=\"dialog-title\">Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </Dialog>\n *     </>\n *   );\n * }\n * ```\n *\n * @since 6.0.0 The `Dialog` no longer supports focusing elements\n * within once it becomes visible. You must manually add `autoFocus` to a\n * element instead.\n */\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(\n  function Dialog(props, ref) {\n    const {\n      id: propId,\n      fixed = false,\n      modal = false,\n      role = modal ? \"alertdialog\" : \"dialog\",\n      type = \"centered\",\n      width,\n      tabIndex = -1,\n      visible,\n      onRequestClose,\n      containerProps,\n      temporary = true,\n      className,\n      timeout = DEFAULT_DIALOG_TIMEOUT,\n      classNames = DEFAULT_DIALOG_CLASSNAMES,\n      disableTransition = false,\n      appear = false,\n      enter = true,\n      exit = true,\n      onEnter = noop,\n      onEntering = noop,\n      onEntered = noop,\n      onExit = noop,\n      onExiting = noop,\n      onExited = noop,\n      exitedHidden = true,\n      disableOverlay = false,\n      overlayProps,\n      overlayHidden,\n      onKeyDown = noop,\n      isFocusTypeDisabled = noopBool,\n      disablePortal: propDisablePortal,\n      disableScrollLock = false,\n      disableEscapeClose = modal,\n      disableFocusOutline = type === \"full-page\",\n      children,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"dialog\");\n\n    const ssr = useSsr();\n    const setChildVisible = useNestedDialogContext();\n\n    // this makes it so that as more non-full page dialogs become visible, the\n    // overlay does not become darker as more and more overlays are stacked upon\n    // each other. only the top-most overlay will have and active background\n    // color.\n    const [isChildVisible, setIsChildVisible] = useState(false);\n    const { eventHandlers, transitionOptions } = useFocusContainer({\n      nodeRef: ref,\n      activate: visible,\n      onEntered(appear) {\n        onEntered(appear);\n        // this needs to be called onEnter and onEntered just in case the\n        // transition is disabled\n        setChildVisible(type !== \"full-page\");\n      },\n      onEntering,\n      onExiting,\n      onExited() {\n        onExited();\n        // this needs to be called onExit and onExited just in case the\n        // transition is disabled\n        setChildVisible(false);\n      },\n      disableTransition,\n      onKeyDown(event) {\n        onKeyDown(event);\n        if (\n          event.isPropagationStopped() ||\n          modal ||\n          disableEscapeClose ||\n          event.key !== \"Escape\"\n        ) {\n          return;\n        }\n\n        // prevent parent dialogs from closing as well\n        event.stopPropagation();\n        onRequestClose();\n      },\n      isFocusTypeDisabled,\n    });\n    const { elementProps, stage, rendered, disablePortal } = useCSSTransition({\n      transitionIn: visible,\n      timeout,\n      classNames,\n      className: dialog({\n        type,\n        width,\n        fixed,\n        outline: !disableFocusOutline,\n        disableBoxShadow: isChildVisible,\n        className,\n      }),\n      appear: appear && !disableTransition && !ssr,\n      enter: enter && !disableTransition,\n      exit: exit && !disableTransition,\n      onEnter(appearing) {\n        onEnter(appearing);\n        setChildVisible(type !== \"full-page\");\n      },\n      onExit() {\n        onExit();\n        setChildVisible(false);\n      },\n      temporary,\n      exitedHidden,\n      disablePortal: propDisablePortal,\n      ...transitionOptions,\n    });\n    useScrollLock(!disableScrollLock && visible);\n\n    return (\n      <NestedDialogProvider value={setIsChildVisible}>\n        {!disableOverlay && (\n          <Overlay\n            visible={visible}\n            disableTransition={disableTransition}\n            temporary={temporary}\n            disablePortal={disablePortal}\n            {...overlayProps}\n            onClick={modal ? noop : onRequestClose}\n            clickable={!modal}\n            noOpacity={overlayHidden || isChildVisible}\n          />\n        )}\n        <Portal disabled={disablePortal}>\n          {rendered && (\n            <div\n              {...containerProps}\n              className={dialogContainer({\n                className: containerProps?.className,\n                centered: type === \"centered\",\n                displayNone: !temporary && exitedHidden && stage === \"exited\",\n              })}\n            >\n              <div\n                aria-modal={modal || undefined}\n                {...remaining}\n                {...elementProps}\n                {...eventHandlers}\n                id={id}\n                role={role}\n                tabIndex={tabIndex}\n              >\n                {children}\n              </div>\n            </div>\n          )}\n        </Portal>\n      </NestedDialogProvider>\n    );\n  }\n);\n"],"names":["forwardRef","useState","useSsr","useFocusContainer","Overlay","Portal","useScrollLock","useCSSTransition","useEnsuredId","NestedDialogProvider","useNestedDialogContext","DEFAULT_DIALOG_CLASSNAMES","DEFAULT_DIALOG_TIMEOUT","dialog","dialogContainer","noop","noopBool","Dialog","props","ref","id","propId","fixed","modal","role","type","width","tabIndex","visible","onRequestClose","containerProps","temporary","className","timeout","classNames","disableTransition","appear","enter","exit","onEnter","onEntering","onEntered","onExit","onExiting","onExited","exitedHidden","disableOverlay","overlayProps","overlayHidden","onKeyDown","isFocusTypeDisabled","disablePortal","propDisablePortal","disableScrollLock","disableEscapeClose","disableFocusOutline","children","remaining","ssr","setChildVisible","isChildVisible","setIsChildVisible","eventHandlers","transitionOptions","nodeRef","activate","event","isPropagationStopped","key","stopPropagation","elementProps","stage","rendered","transitionIn","outline","disableBoxShadow","appearing","value","onClick","clickable","noOpacity","disabled","div","centered","displayNone","aria-modal","undefined"],"mappings":"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"}

package/dist/dialog/DialogContent.d.ts

@@ -3,8 +3,8 @@ import { type DialogContentClassNameOptions } from "./styles.js";
 export interface DialogContentProps extends HTMLAttributes<HTMLDivElement>, DialogContentClassNameOptions {
 }
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogContent` component should be used as a child of the `Dialog`
+ * component that applies some reasonable default styles. Look at the `Dialog`
+ * or `FixedDialog` components for example usage.
  */
 export declare const DialogContent: import("react").ForwardRefExoticComponent<DialogContentProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/dialog/DialogContent.js

@@ -2,9 +2,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { dialogContent } from "./styles.js";
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogContent` component should be used as a child of the `Dialog`
+ * component that applies some reasonable default styles. Look at the `Dialog`
+ * or `FixedDialog` components for example usage.
  */ export const DialogContent = /*#__PURE__*/ forwardRef(function DialogContent({ children, className, disablePadding = false, ...props }, ref) {
     return /*#__PURE__*/ _jsx("div", {
         ...props,

package/dist/dialog/DialogContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogContent.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { dialogContent, type DialogContentClassNameOptions } from \"./styles.js\";\n\nexport interface DialogContentProps\n  extends HTMLAttributes<HTMLDivElement>,\n    DialogContentClassNameOptions {}\n\n/**\n * **Server Component**\n *\n * Look at the `Dialog` or `FixedDialog` components for example usage.\n */\nexport const DialogContent = forwardRef<HTMLDivElement, DialogContentProps>(\n  function DialogContent(\n    { children, className, disablePadding = false, ...props },\n    ref\n  ) {\n    return (\n      <div\n        {...props}\n        ref={ref}\n        className={dialogContent({\n          className,\n          disablePadding,\n        })}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","dialogContent","DialogContent","children","className","disablePadding","props","ref","div"],"mappings":";AAAA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SAASC,aAAa,QAA4C,cAAc;AAMhF;;;;CAIC,GACD,OAAO,MAAMC,8BAAgBF,WAC3B,SAASE,cACP,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,iBAAiB,KAAK,EAAE,GAAGC,OAAO,EACzDC,GAAG;IAEH,qBACE,KAACC;QACE,GAAGF,KAAK;QACTC,KAAKA;QACLH,WAAWH,cAAc;YACvBG;YACAC;QACF;kBAECF;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogContent.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { dialogContent, type DialogContentClassNameOptions } from \"./styles.js\";\n\nexport interface DialogContentProps\n  extends HTMLAttributes<HTMLDivElement>,\n    DialogContentClassNameOptions {}\n\n/**\n * The `DialogContent` component should be used as a child of the `Dialog`\n * component that applies some reasonable default styles. Look at the `Dialog`\n * or `FixedDialog` components for example usage.\n */\nexport const DialogContent = forwardRef<HTMLDivElement, DialogContentProps>(\n  function DialogContent(\n    { children, className, disablePadding = false, ...props },\n    ref\n  ) {\n    return (\n      <div\n        {...props}\n        ref={ref}\n        className={dialogContent({\n          className,\n          disablePadding,\n        })}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","dialogContent","DialogContent","children","className","disablePadding","props","ref","div"],"mappings":";AAAA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SAASC,aAAa,QAA4C,cAAc;AAMhF;;;;CAIC,GACD,OAAO,MAAMC,8BAAgBF,WAC3B,SAASE,cACP,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,iBAAiB,KAAK,EAAE,GAAGC,OAAO,EACzDC,GAAG;IAEH,qBACE,KAACC;QACE,GAAGF,KAAK;QACTC,KAAKA;QACLH,WAAWH,cAAc;YACvBG;YACAC;QACF;kBAECF;;AAGP,GACA"}

package/dist/dialog/DialogFooter.d.ts

@@ -3,8 +3,7 @@ import { type DialogFooterClassNameOptions } from "./styles.js";
 export interface DialogFooterProps extends HTMLAttributes<HTMLDivElement>, DialogFooterClassNameOptions {
 }
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogFooter` is a simple `<footer>` with simple `display: flex` styles
+ * applied. Look at the `Dialog` or `FixedDialog` components for example usage.
  */
 export declare const DialogFooter: import("react").ForwardRefExoticComponent<DialogFooterProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/dialog/DialogFooter.js

@@ -2,9 +2,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { dialogFooter } from "./styles.js";
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogFooter` is a simple `<footer>` with simple `display: flex` styles
+ * applied. Look at the `Dialog` or `FixedDialog` components for example usage.
  */ export const DialogFooter = /*#__PURE__*/ forwardRef(function DialogFooter({ children, className, align = "end", ...props }, ref) {
     return /*#__PURE__*/ _jsx("footer", {
         ...props,

package/dist/dialog/DialogFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogFooter.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { dialogFooter, type DialogFooterClassNameOptions } from \"./styles.js\";\n\nexport interface DialogFooterProps\n  extends HTMLAttributes<HTMLDivElement>,\n    DialogFooterClassNameOptions {}\n\n/**\n * **Server Component**\n *\n * Look at the `Dialog` or `FixedDialog` components for example usage.\n */\nexport const DialogFooter = forwardRef<HTMLDivElement, DialogFooterProps>(\n  function DialogFooter({ children, className, align = \"end\", ...props }, ref) {\n    return (\n      <footer\n        {...props}\n        ref={ref}\n        className={dialogFooter({\n          align,\n          className,\n        })}\n      >\n        {children}\n      </footer>\n    );\n  }\n);\n"],"names":["forwardRef","dialogFooter","DialogFooter","children","className","align","props","ref","footer"],"mappings":";AAAA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SAASC,YAAY,QAA2C,cAAc;AAM9E;;;;CAIC,GACD,OAAO,MAAMC,6BAAeF,WAC1B,SAASE,aAAa,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,KAAK,EAAE,GAAGC,OAAO,EAAEC,GAAG;IACzE,qBACE,KAACC;QACE,GAAGF,KAAK;QACTC,KAAKA;QACLH,WAAWH,aAAa;YACtBI;YACAD;QACF;kBAECD;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogFooter.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { dialogFooter, type DialogFooterClassNameOptions } from \"./styles.js\";\n\nexport interface DialogFooterProps\n  extends HTMLAttributes<HTMLDivElement>,\n    DialogFooterClassNameOptions {}\n\n/**\n * The `DialogFooter` is a simple `<footer>` with simple `display: flex` styles\n * applied. Look at the `Dialog` or `FixedDialog` components for example usage.\n */\nexport const DialogFooter = forwardRef<HTMLDivElement, DialogFooterProps>(\n  function DialogFooter({ children, className, align = \"end\", ...props }, ref) {\n    return (\n      <footer\n        {...props}\n        ref={ref}\n        className={dialogFooter({\n          align,\n          className,\n        })}\n      >\n        {children}\n      </footer>\n    );\n  }\n);\n"],"names":["forwardRef","dialogFooter","DialogFooter","children","className","align","props","ref","footer"],"mappings":";AAAA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SAASC,YAAY,QAA2C,cAAc;AAM9E;;;CAGC,GACD,OAAO,MAAMC,6BAAeF,WAC1B,SAASE,aAAa,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,KAAK,EAAE,GAAGC,OAAO,EAAEC,GAAG;IACzE,qBACE,KAACC;QACE,GAAGF,KAAK;QACTC,KAAKA;QACLH,WAAWH,aAAa;YACtBI;YACAD;QACF;kBAECD;;AAGP,GACA"}

package/dist/dialog/DialogHeader.d.ts

@@ -1,8 +1,8 @@
 import { type HTMLAttributes } from "react";
 export type DialogHeaderProps = HTMLAttributes<HTMLDivElement>;
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogHeader` component should be rendered within a `Dialog` component
+ * and generally contains the `DialogTitle`. Look at the `Dialog` or
+ * `FixedDialog` components for example usage.
  */
 export declare const DialogHeader: import("react").ForwardRefExoticComponent<DialogHeaderProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/dialog/DialogHeader.js

@@ -2,9 +2,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { dialogHeader } from "./styles.js";
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogHeader` component should be rendered within a `Dialog` component
+ * and generally contains the `DialogTitle`. Look at the `Dialog` or
+ * `FixedDialog` components for example usage.
  */ export const DialogHeader = /*#__PURE__*/ forwardRef(function DialogHeader(props, ref) {
     const { children, className, ...remaining } = props;
     return /*#__PURE__*/ _jsx("div", {

package/dist/dialog/DialogHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogHeader.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { dialogHeader } from \"./styles.js\";\n\nexport type DialogHeaderProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * **Server Component**\n *\n * Look at the `Dialog` or `FixedDialog` components for example usage.\n */\nexport const DialogHeader = forwardRef<HTMLDivElement, DialogHeaderProps>(\n  function DialogHeader(props, ref) {\n    const { children, className, ...remaining } = props;\n\n    return (\n      <div {...remaining} ref={ref} className={dialogHeader({ className })}>\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","dialogHeader","DialogHeader","props","ref","children","className","remaining","div"],"mappings":";AAAA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SAASC,YAAY,QAAQ,cAAc;AAI3C;;;;CAIC,GACD,OAAO,MAAMC,6BAAeF,WAC1B,SAASE,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGJ;IAE9C,qBACE,KAACK;QAAK,GAAGD,SAAS;QAAEH,KAAKA;QAAKE,WAAWL,aAAa;YAAEK;QAAU;kBAC/DD;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogHeader.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { dialogHeader } from \"./styles.js\";\n\nexport type DialogHeaderProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * The `DialogHeader` component should be rendered within a `Dialog` component\n * and generally contains the `DialogTitle`. Look at the `Dialog` or\n * `FixedDialog` components for example usage.\n */\nexport const DialogHeader = forwardRef<HTMLDivElement, DialogHeaderProps>(\n  function DialogHeader(props, ref) {\n    const { children, className, ...remaining } = props;\n\n    return (\n      <div {...remaining} ref={ref} className={dialogHeader({ className })}>\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","dialogHeader","DialogHeader","props","ref","children","className","remaining","div"],"mappings":";AAAA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SAASC,YAAY,QAAQ,cAAc;AAI3C;;;;CAIC,GACD,OAAO,MAAMC,6BAAeF,WAC1B,SAASE,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGJ;IAE9C,qBACE,KAACK;QAAK,GAAGD,SAAS;QAAEH,KAAKA;QAAKE,WAAWL,aAAa;YAAEK;QAAU;kBAC/DD;;AAGP,GACA"}

package/dist/dialog/DialogTitle.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type Margin } from "../cssUtils.js";
 import { type CustomTypographyComponent, type TypographyProps } from "../typography/Typography.js";
 import { type TypographyType } from "../typography/typographyStyles.js";
@@ -15,8 +14,8 @@ export interface DialogTitleProps extends TypographyProps {
     margin?: Margin;
 }
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogTitle` component is a simple `Typography` component wrapper with
+ * sensible defaults to be rendered within a `Dialog`. Look at the `Dialog` or
+ * `FixedDialog` components for example usage.
  */
 export declare const DialogTitle: import("react").ForwardRefExoticComponent<DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;

package/dist/dialog/DialogTitle.js

@@ -3,9 +3,9 @@ import { cnb } from "cnbuilder";
 import { forwardRef } from "react";
 import { Typography } from "../typography/Typography.js";
 /**
- * **Server Component**
- *
- * Look at the `Dialog` or `FixedDialog` components for example usage.
+ * The `DialogTitle` component is a simple `Typography` component wrapper with
+ * sensible defaults to be rendered within a `Dialog`. Look at the `Dialog` or
+ * `FixedDialog` components for example usage.
  */ export const DialogTitle = /*#__PURE__*/ forwardRef(function DialogTitle({ as = "h2", type = "headline-4", margin = "none", children, className, ...props }, ref) {
     return /*#__PURE__*/ _jsx(Typography, {
         ...props,

package/dist/dialog/DialogTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogTitle.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\nimport { type Margin } from \"../cssUtils.js\";\nimport {\n  Typography,\n  type CustomTypographyComponent,\n  type TypographyProps,\n} from \"../typography/Typography.js\";\nimport { type TypographyType } from \"../typography/typographyStyles.js\";\n\n/**\n * @since 6.0.0 Inherits the `TypographyProps` instead of\n * `HTMLAttributes<HTMLHeadingElement>`.\n */\nexport interface DialogTitleProps extends TypographyProps {\n  /** @defaultValue `\"h2\"` */\n  as?: CustomTypographyComponent;\n\n  /** @defaultValue `\"headline-4\"` */\n  type?: TypographyType;\n\n  /** @defaultValue `\"none\"` */\n  margin?: Margin;\n}\n\n/**\n * **Server Component**\n *\n * Look at the `Dialog` or `FixedDialog` components for example usage.\n */\nexport const DialogTitle = forwardRef<HTMLHeadingElement, DialogTitleProps>(\n  function DialogTitle(\n    {\n      as = \"h2\",\n      type = \"headline-4\",\n      margin = \"none\",\n      children,\n      className,\n      ...props\n    },\n    ref\n  ) {\n    return (\n      <Typography\n        {...props}\n        ref={ref}\n        as={as}\n        type={type}\n        margin={margin}\n        // Note: This class applies no styles at this time\n        className={cnb(\"rmd-dialog__title\", className)}\n      >\n        {children}\n      </Typography>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","Typography","DialogTitle","as","type","margin","children","className","props","ref"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SACEC,UAAU,QAGL,8BAA8B;AAkBrC;;;;CAIC,GACD,OAAO,MAAMC,4BAAcF,WACzB,SAASE,YACP,EACEC,KAAK,IAAI,EACTC,OAAO,YAAY,EACnBC,SAAS,MAAM,EACfC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACJ,EACDC,GAAG;IAEH,qBACE,KAACR;QACE,GAAGO,KAAK;QACTC,KAAKA;QACLN,IAAIA;QACJC,MAAMA;QACNC,QAAQA;QACR,kDAAkD;QAClDE,WAAWR,IAAI,qBAAqBQ;kBAEnCD;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogTitle.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\nimport { type Margin } from \"../cssUtils.js\";\nimport {\n  Typography,\n  type CustomTypographyComponent,\n  type TypographyProps,\n} from \"../typography/Typography.js\";\nimport { type TypographyType } from \"../typography/typographyStyles.js\";\n\n/**\n * @since 6.0.0 Inherits the `TypographyProps` instead of\n * `HTMLAttributes<HTMLHeadingElement>`.\n */\nexport interface DialogTitleProps extends TypographyProps {\n  /** @defaultValue `\"h2\"` */\n  as?: CustomTypographyComponent;\n\n  /** @defaultValue `\"headline-4\"` */\n  type?: TypographyType;\n\n  /** @defaultValue `\"none\"` */\n  margin?: Margin;\n}\n\n/**\n * The `DialogTitle` component is a simple `Typography` component wrapper with\n * sensible defaults to be rendered within a `Dialog`. Look at the `Dialog` or\n * `FixedDialog` components for example usage.\n */\nexport const DialogTitle = forwardRef<HTMLHeadingElement, DialogTitleProps>(\n  function DialogTitle(\n    {\n      as = \"h2\",\n      type = \"headline-4\",\n      margin = \"none\",\n      children,\n      className,\n      ...props\n    },\n    ref\n  ) {\n    return (\n      <Typography\n        {...props}\n        ref={ref}\n        as={as}\n        type={type}\n        margin={margin}\n        // Note: This class applies no styles at this time\n        className={cnb(\"rmd-dialog__title\", className)}\n      >\n        {children}\n      </Typography>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","Typography","DialogTitle","as","type","margin","children","className","props","ref"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SACEC,UAAU,QAGL,8BAA8B;AAkBrC;;;;CAIC,GACD,OAAO,MAAMC,4BAAcF,WACzB,SAASE,YACP,EACEC,KAAK,IAAI,EACTC,OAAO,YAAY,EACnBC,SAAS,MAAM,EACfC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACJ,EACDC,GAAG;IAEH,qBACE,KAACR;QACE,GAAGO,KAAK;QACTC,KAAKA;QACLN,IAAIA;QACJC,MAAMA;QACNC,QAAQA;QACR,kDAAkD;QAClDE,WAAWR,IAAI,qBAAqBQ;kBAEnCD;;AAGP,GACA"}

package/dist/dialog/FixedDialog.d.ts

@@ -1,13 +1,12 @@
 import { type RefObject } from "react";
 import { type CalculateFixedPositionOptions, type PositionAnchor } from "../positioning/types.js";
-import { type CSSTransitionClassNamesObject } from "../transition/types.js";
 import { type LabelRequiredForA11y } from "../types.js";
 import { type BaseDialogProps } from "./Dialog.js";
 export interface BaseFixedDialogProps extends Omit<BaseDialogProps, "type"> {
     anchor?: PositionAnchor;
     fixedTo: RefObject<HTMLElement>;
     options?: CalculateFixedPositionOptions;
-    getFixedPositionOptions?(): CalculateFixedPositionOptions;
+    getFixedPositionOptions?: () => CalculateFixedPositionOptions;
     /**
      * @defaultValue `true`
      */
@@ -18,7 +17,6 @@ export interface BaseFixedDialogProps extends Omit<BaseDialogProps, "type"> {
     disableScrollLock?: boolean;
 }
 export type FixedDialogProps = LabelRequiredForA11y<BaseFixedDialogProps>;
-export declare const DEFAULT_FIXED_DIALOG_CLASSNAMES: Readonly<CSSTransitionClassNamesObject>;
 /**
  * **Client Component**
  *

package/dist/dialog/FixedDialog.js

@@ -8,14 +8,6 @@ import { Dialog } from "./Dialog.js";
 const noop = ()=>{
 // do nothing
 };
-export const DEFAULT_FIXED_DIALOG_CLASSNAMES = {
-    appear: "rmd-dialog--fixed-enter",
-    appearActive: "rmd-dialog--fixed-enter-active",
-    enter: "rmd-dialog--fixed-enter",
-    enterActive: "rmd-dialog--fixed-enter-active",
-    exit: "rmd-dialog--fixed-exit",
-    exitActive: "rmd-dialog--fixed-exit-active"
-};
 /**
  * **Client Component**
  *

package/dist/dialog/FixedDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/FixedDialog.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, useRef, type RefObject } from \"react\";\nimport { TOP_INNER_RIGHT_ANCHOR } from \"../positioning/constants.js\";\nimport {\n  type CalculateFixedPositionOptions,\n  type PositionAnchor,\n} from \"../positioning/types.js\";\nimport { useFixedPositioning } from \"../positioning/useFixedPositioning.js\";\nimport { type CSSTransitionClassNamesObject } from \"../transition/types.js\";\nimport { SCALE_CLASSNAMES } from \"../transition/useScaleTransition.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { Dialog, type BaseDialogProps } from \"./Dialog.js\";\n\nexport interface BaseFixedDialogProps extends Omit<BaseDialogProps, \"type\"> {\n  anchor?: PositionAnchor;\n  fixedTo: RefObject<HTMLElement>;\n  options?: CalculateFixedPositionOptions;\n  getFixedPositionOptions?(): CalculateFixedPositionOptions;\n\n  /**\n   * @defaultValue `true`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * @defaultValue `true`\n   */\n  disableScrollLock?: boolean;\n}\n\nexport type FixedDialogProps = LabelRequiredForA11y<BaseFixedDialogProps>;\n\nconst noop = (): void => {\n  // do nothing\n};\nexport const DEFAULT_FIXED_DIALOG_CLASSNAMES: Readonly<CSSTransitionClassNamesObject> =\n  {\n    appear: \"rmd-dialog--fixed-enter\",\n    appearActive: \"rmd-dialog--fixed-enter-active\",\n    enter: \"rmd-dialog--fixed-enter\",\n    enterActive: \"rmd-dialog--fixed-enter-active\",\n    exit: \"rmd-dialog--fixed-exit\",\n    exitActive: \"rmd-dialog--fixed-exit-active\",\n  };\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import {\n *   Button,\n *   DialogHeader,\n *   DialogTitle,\n *   DialogContent,\n *   DialogFooter,\n *   FixedDialog,\n *   Typography,\n *   useToggle,\n * } from \"@react-md/core\";\n * import { useId, useRef, type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *   const titleId = useId();\n *   const fixedTo = useRef<HTMLButtonElement>(null)\n *\n *   return (\n *     <>\n *       <Button ref={fixedTo} onClick={toggle}>Toggle</Button>\n *       <FixedDialog\n *         aria-labelledby={titleId}\n *         fixedTo={fixedTo}\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id={titleId}>Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </FixedDialog>\n *     </>\n *   );\n * }\n * ```\n */\nexport const FixedDialog = forwardRef<HTMLDivElement, FixedDialogProps>(\n  function FixedDialog(props, nodeRef) {\n    const {\n      fixedTo,\n      style: propStyle,\n      classNames = SCALE_CLASSNAMES,\n      children,\n      anchor = TOP_INNER_RIGHT_ANCHOR,\n      options,\n      getFixedPositionOptions,\n      onEnter,\n      onEntering,\n      onEntered,\n      onExited = noop,\n      onRequestClose,\n      overlayHidden = true,\n      disableScrollLock = true,\n      isFocusTypeDisabled = noop,\n      ...remaining\n    } = props;\n\n    const disableExitFocus = useRef(false);\n    const { ref, style, callbacks } = useFixedPositioning({\n      nodeRef,\n      style: propStyle,\n      transformOrigin: true,\n      onEnter,\n      onEntering,\n      onEntered,\n      onExited() {\n        onExited();\n        disableExitFocus.current = false;\n      },\n      anchor,\n      fixedTo,\n      onScroll(_event, data) {\n        if (!data.visible) {\n          disableExitFocus.current = true;\n          onRequestClose();\n        }\n      },\n      ...options,\n      getFixedPositionOptions,\n    });\n\n    return (\n      <Dialog\n        {...remaining}\n        {...callbacks}\n        ref={ref}\n        type=\"custom\"\n        fixed\n        style={style}\n        classNames={classNames}\n        onRequestClose={onRequestClose}\n        overlayHidden={overlayHidden}\n        disableScrollLock={disableScrollLock}\n        isFocusTypeDisabled={(type) =>\n          isFocusTypeDisabled(type) ||\n          (type === \"unmount\" && disableExitFocus.current)\n        }\n      >\n        {children}\n      </Dialog>\n    );\n  }\n);\n"],"names":["forwardRef","useRef","TOP_INNER_RIGHT_ANCHOR","useFixedPositioning","SCALE_CLASSNAMES","Dialog","noop","DEFAULT_FIXED_DIALOG_CLASSNAMES","appear","appearActive","enter","enterActive","exit","exitActive","FixedDialog","props","nodeRef","fixedTo","style","propStyle","classNames","children","anchor","options","getFixedPositionOptions","onEnter","onEntering","onEntered","onExited","onRequestClose","overlayHidden","disableScrollLock","isFocusTypeDisabled","remaining","disableExitFocus","ref","callbacks","transformOrigin","current","onScroll","_event","data","visible","type","fixed"],"mappings":"AAAA;;AACA,SAASA,UAAU,EAAEC,MAAM,QAAwB,QAAQ;AAC3D,SAASC,sBAAsB,QAAQ,8BAA8B;AAKrE,SAASC,mBAAmB,QAAQ,wCAAwC;AAE5E,SAASC,gBAAgB,QAAQ,sCAAsC;AAEvE,SAASC,MAAM,QAA8B,cAAc;AAqB3D,MAAMC,OAAO;AACX,aAAa;AACf;AACA,OAAO,MAAMC,kCACX;IACEC,QAAQ;IACRC,cAAc;IACdC,OAAO;IACPC,aAAa;IACbC,MAAM;IACNC,YAAY;AACd,EAAE;AAEJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmDC,GACD,OAAO,MAAMC,4BAAcd,WACzB,SAASc,YAAYC,KAAK,EAAEC,OAAO;IACjC,MAAM,EACJC,OAAO,EACPC,OAAOC,SAAS,EAChBC,aAAahB,gBAAgB,EAC7BiB,QAAQ,EACRC,SAASpB,sBAAsB,EAC/BqB,OAAO,EACPC,uBAAuB,EACvBC,OAAO,EACPC,UAAU,EACVC,SAAS,EACTC,WAAWtB,IAAI,EACfuB,cAAc,EACdC,gBAAgB,IAAI,EACpBC,oBAAoB,IAAI,EACxBC,sBAAsB1B,IAAI,EAC1B,GAAG2B,WACJ,GAAGlB;IAEJ,MAAMmB,mBAAmBjC,OAAO;IAChC,MAAM,EAAEkC,GAAG,EAAEjB,KAAK,EAAEkB,SAAS,EAAE,GAAGjC,oBAAoB;QACpDa;QACAE,OAAOC;QACPkB,iBAAiB;QACjBZ;QACAC;QACAC;QACAC;YACEA;YACAM,iBAAiBI,OAAO,GAAG;QAC7B;QACAhB;QACAL;QACAsB,UAASC,MAAM,EAAEC,IAAI;YACnB,IAAI,CAACA,KAAKC,OAAO,EAAE;gBACjBR,iBAAiBI,OAAO,GAAG;gBAC3BT;YACF;QACF;QACA,GAAGN,OAAO;QACVC;IACF;IAEA,qBACE,KAACnB;QACE,GAAG4B,SAAS;QACZ,GAAGG,SAAS;QACbD,KAAKA;QACLQ,MAAK;QACLC,KAAK;QACL1B,OAAOA;QACPE,YAAYA;QACZS,gBAAgBA;QAChBC,eAAeA;QACfC,mBAAmBA;QACnBC,qBAAqB,CAACW,OACpBX,oBAAoBW,SACnBA,SAAS,aAAaT,iBAAiBI,OAAO;kBAGhDjB;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/FixedDialog.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, useRef, type RefObject } from \"react\";\nimport { TOP_INNER_RIGHT_ANCHOR } from \"../positioning/constants.js\";\nimport {\n  type CalculateFixedPositionOptions,\n  type PositionAnchor,\n} from \"../positioning/types.js\";\nimport { useFixedPositioning } from \"../positioning/useFixedPositioning.js\";\nimport { SCALE_CLASSNAMES } from \"../transition/useScaleTransition.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { Dialog, type BaseDialogProps } from \"./Dialog.js\";\n\nexport interface BaseFixedDialogProps extends Omit<BaseDialogProps, \"type\"> {\n  anchor?: PositionAnchor;\n  fixedTo: RefObject<HTMLElement>;\n  options?: CalculateFixedPositionOptions;\n  getFixedPositionOptions?: () => CalculateFixedPositionOptions;\n\n  /**\n   * @defaultValue `true`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * @defaultValue `true`\n   */\n  disableScrollLock?: boolean;\n}\n\nexport type FixedDialogProps = LabelRequiredForA11y<BaseFixedDialogProps>;\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import {\n *   Button,\n *   DialogHeader,\n *   DialogTitle,\n *   DialogContent,\n *   DialogFooter,\n *   FixedDialog,\n *   Typography,\n *   useToggle,\n * } from \"@react-md/core\";\n * import { useId, useRef, type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *   const titleId = useId();\n *   const fixedTo = useRef<HTMLButtonElement>(null)\n *\n *   return (\n *     <>\n *       <Button ref={fixedTo} onClick={toggle}>Toggle</Button>\n *       <FixedDialog\n *         aria-labelledby={titleId}\n *         fixedTo={fixedTo}\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id={titleId}>Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </FixedDialog>\n *     </>\n *   );\n * }\n * ```\n */\nexport const FixedDialog = forwardRef<HTMLDivElement, FixedDialogProps>(\n  function FixedDialog(props, nodeRef) {\n    const {\n      fixedTo,\n      style: propStyle,\n      classNames = SCALE_CLASSNAMES,\n      children,\n      anchor = TOP_INNER_RIGHT_ANCHOR,\n      options,\n      getFixedPositionOptions,\n      onEnter,\n      onEntering,\n      onEntered,\n      onExited = noop,\n      onRequestClose,\n      overlayHidden = true,\n      disableScrollLock = true,\n      isFocusTypeDisabled = noop,\n      ...remaining\n    } = props;\n\n    const disableExitFocus = useRef(false);\n    const { ref, style, callbacks } = useFixedPositioning({\n      nodeRef,\n      style: propStyle,\n      transformOrigin: true,\n      onEnter,\n      onEntering,\n      onEntered,\n      onExited() {\n        onExited();\n        disableExitFocus.current = false;\n      },\n      anchor,\n      fixedTo,\n      onScroll(_event, data) {\n        if (!data.visible) {\n          disableExitFocus.current = true;\n          onRequestClose();\n        }\n      },\n      ...options,\n      getFixedPositionOptions,\n    });\n\n    return (\n      <Dialog\n        {...remaining}\n        {...callbacks}\n        ref={ref}\n        type=\"custom\"\n        fixed\n        style={style}\n        classNames={classNames}\n        onRequestClose={onRequestClose}\n        overlayHidden={overlayHidden}\n        disableScrollLock={disableScrollLock}\n        isFocusTypeDisabled={(type) =>\n          isFocusTypeDisabled(type) ||\n          (type === \"unmount\" && disableExitFocus.current)\n        }\n      >\n        {children}\n      </Dialog>\n    );\n  }\n);\n"],"names":["forwardRef","useRef","TOP_INNER_RIGHT_ANCHOR","useFixedPositioning","SCALE_CLASSNAMES","Dialog","noop","FixedDialog","props","nodeRef","fixedTo","style","propStyle","classNames","children","anchor","options","getFixedPositionOptions","onEnter","onEntering","onEntered","onExited","onRequestClose","overlayHidden","disableScrollLock","isFocusTypeDisabled","remaining","disableExitFocus","ref","callbacks","transformOrigin","current","onScroll","_event","data","visible","type","fixed"],"mappings":"AAAA;;AACA,SAASA,UAAU,EAAEC,MAAM,QAAwB,QAAQ;AAC3D,SAASC,sBAAsB,QAAQ,8BAA8B;AAKrE,SAASC,mBAAmB,QAAQ,wCAAwC;AAC5E,SAASC,gBAAgB,QAAQ,sCAAsC;AAEvE,SAASC,MAAM,QAA8B,cAAc;AAqB3D,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmDC,GACD,OAAO,MAAMC,4BAAcP,WACzB,SAASO,YAAYC,KAAK,EAAEC,OAAO;IACjC,MAAM,EACJC,OAAO,EACPC,OAAOC,SAAS,EAChBC,aAAaT,gBAAgB,EAC7BU,QAAQ,EACRC,SAASb,sBAAsB,EAC/Bc,OAAO,EACPC,uBAAuB,EACvBC,OAAO,EACPC,UAAU,EACVC,SAAS,EACTC,WAAWf,IAAI,EACfgB,cAAc,EACdC,gBAAgB,IAAI,EACpBC,oBAAoB,IAAI,EACxBC,sBAAsBnB,IAAI,EAC1B,GAAGoB,WACJ,GAAGlB;IAEJ,MAAMmB,mBAAmB1B,OAAO;IAChC,MAAM,EAAE2B,GAAG,EAAEjB,KAAK,EAAEkB,SAAS,EAAE,GAAG1B,oBAAoB;QACpDM;QACAE,OAAOC;QACPkB,iBAAiB;QACjBZ;QACAC;QACAC;QACAC;YACEA;YACAM,iBAAiBI,OAAO,GAAG;QAC7B;QACAhB;QACAL;QACAsB,UAASC,MAAM,EAAEC,IAAI;YACnB,IAAI,CAACA,KAAKC,OAAO,EAAE;gBACjBR,iBAAiBI,OAAO,GAAG;gBAC3BT;YACF;QACF;QACA,GAAGN,OAAO;QACVC;IACF;IAEA,qBACE,KAACZ;QACE,GAAGqB,SAAS;QACZ,GAAGG,SAAS;QACbD,KAAKA;QACLQ,MAAK;QACLC,KAAK;QACL1B,OAAOA;QACPE,YAAYA;QACZS,gBAAgBA;QAChBC,eAAeA;QACfC,mBAAmBA;QACnBC,qBAAqB,CAACW,OACpBX,oBAAoBW,SACnBA,SAAS,aAAaT,iBAAiBI,OAAO;kBAGhDjB;;AAGP,GACA"}

package/dist/dialog/NestedDialogProvider.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export type SetChildDialogVisible = (visible: boolean) => void;
 export declare const NestedDialogProvider: import("react").Provider<SetChildDialogVisible>;
 export declare function useNestedDialogContext(): SetChildDialogVisible;