@yamada-ui/react/dist/types/components/modal/modal.style.d.ts

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

import { ComponentSlotStyle } from "../../core/system/index.types.js";
import { CSSModifierObject, CSSSlotObject } from "../../core/css/index.types.js";
import "../../index.js";

//#region src/components/modal/modal.style.d.ts
declare const modalStyle: ComponentSlotStyle<"body" | "footer" | "header" | "title" | "content" | "overlay" | "closeButton" | "root", {
  /**
   * The placement of the modal.
   *
   * @default 'center'
   */
  placement: {
    center: {
      root: {
        alignItems: "center";
        justifyContent: "center";
      };
    };
    "center-center": {
      root: {
        alignItems: "center";
        justifyContent: "center";
      };
    };
    "center-end": {
      root: {
        alignItems: "center";
        justifyContent: "flex-end";
      };
    };
    "center-start": {
      root: {
        alignItems: "center";
        justifyContent: "flex-start";
      };
    };
    "end-center": {
      root: {
        alignItems: "flex-end";
        justifyContent: "center";
      };
    };
    "end-end": {
      root: {
        alignItems: "flex-end";
        justifyContent: "flex-end";
      };
    };
    "end-start": {
      root: {
        alignItems: "flex-end";
        justifyContent: "flex-start";
      };
    };
    "start-center": {
      root: {
        alignItems: "flex-start";
        justifyContent: "center";
      };
    };
    "start-end": {
      root: {
        alignItems: "flex-start";
        justifyContent: "flex-end";
      };
    };
    "start-start": {
      root: {
        alignItems: "flex-start";
        justifyContent: "flex-start";
      };
    };
  };
  /**
   * Where scroll behavior should originate.
   *
   * - `inside`: scroll only occurs within the `ModalBody`.
   * - `outside`: the entire `ModalContent` will scroll within the viewport.
   *
   * @default 'inside'
   */
  scrollBehavior: {
    inside: {
      body: {
        overflow: "auto";
      };
    };
    outside: {
      content: {
        overflow: "auto";
      };
    };
  };
}, {
  xs: {
    content: {
      maxW: "xs";
    };
  };
  sm: {
    content: {
      maxW: "sm";
    };
  };
  md: {
    content: {
      maxW: "md";
    };
  };
  lg: {
    content: {
      maxW: "lg";
    };
  };
  xl: {
    content: {
      maxW: "xl";
    };
  };
  "2xl": {
    content: {
      maxW: "2xl";
    };
  };
  "3xl": {
    content: {
      maxW: "3xl";
    };
  };
  "4xl": {
    content: {
      maxW: "4xl";
    };
  };
  "5xl": {
    content: {
      maxW: "5xl";
    };
  };
  "6xl": {
    content: {
      maxW: "6xl";
    };
  };
  cover: {
    content: {
      boxSize: "full";
    };
  };
  full: {
    content: {
      minH: "dvh";
      minW: "vw";
      rounded: "0";
    };
    root: {
      p: "0";
    };
  };
}, CSSModifierObject<CSSSlotObject<"body" | "footer" | "header" | "title" | "content" | "overlay" | "closeButton" | "root">>>;
type ModalStyle = typeof modalStyle;
//#endregion
export { ModalStyle, modalStyle };
//# sourceMappingURL=modal.style.d.ts.map