ModalCore

Ключевой компонент для работы с модальными окнами. Используется для создания кастомных модальных окон.

import type { WritableComputedRef } from 'vue';

import type ExposedPromise from '#sf/utils/exposed-promise';
import type { MaybeArray } from '#sf/types';

export type VNodeClassObject = Record<string, boolean>;

type Vue2DataObjectClass = MaybeArray<
  VNodeClassObject | string | undefined | null | undefined
>;

export type StaticModalCoreTransitionConfig = {
  keyframes: Array<Keyframe>;

  options?: KeyframeAnimationOptions;
};

export type DynamicModalCoreTransitionConfig = (
  el: HTMLElement,
  isLeave: boolean,
) => StaticModalCoreTransitionConfig;

export type ModalCoreTransitionConfig =
  | StaticModalCoreTransitionConfig
  | DynamicModalCoreTransitionConfig;

export type ModalVisibilityPromiseType = 'close' | 'open';

export interface ModalInstanceExposedApi {
  open: () => InstanceType<typeof ExposedPromise<ModalVisibilityPromiseType>>;
  close: (
    enforce?: boolean,
  ) =>
    | InstanceType<typeof ExposedPromise<ModalVisibilityPromiseType>>
    | Promise<void>;
}

export interface ModalCoreProps {
  attach: boolean | string;
  modelValue: boolean;
  name: string;
  overlayTransition: ModalCoreTransitionConfig;
  contentTransition: ModalCoreTransitionConfig;
  closable: boolean;
  closeOnEscape: boolean;
  closeOnOutClick: boolean;
  renderOnOpenOnly: boolean;
  rootClass: Vue2DataObjectClass;
  rootStyle: Record<string, any> | null;
}

export interface ModalCoreInternalState extends ModalInstanceExposedApi {
  compModelValue: WritableComputedRef<boolean>;
}