@fangzhongya/fang-ui 0.0.3 → 0.0.4

package/dist/components/alert/src/index.d.ts

@@ -1,8 +1,399 @@
-declare const _sfc_main: import("vue").DefineComponent<Readonly<import("vue").ComponentPropsOptions<{
-    [x: string]: unknown;
-}>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<readonly string[] | import("vue").ExtractPropTypes<Readonly<import("vue").ComponentObjectPropsOptions<{
-    [x: string]: unknown;
-}>>>> & {}, {
-    [x: number]: string;
-} | {}>;
-export default _sfc_main;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Partial<Record<string, (_: {}) => any>>;
+    refs: {
+        refEl: ({
+            $: import('vue').ComponentInternalInstance;
+            $data: {};
+            $props: Partial<{
+                readonly title: string;
+                readonly center: boolean;
+                readonly type: "success" | "warning" | "info" | "error";
+                readonly description: string;
+                readonly effect: "dark" | "light";
+                readonly closable: boolean;
+                readonly closeText: string;
+                readonly showIcon: boolean;
+            }> & Omit<{
+                readonly type: "success" | "warning" | "info" | "error";
+                readonly title: string;
+                readonly description: string;
+                readonly closable: boolean;
+                readonly closeText: string;
+                readonly showIcon: boolean;
+                readonly center: boolean;
+                readonly effect: "dark" | "light";
+                onClose?: ((evt: MouseEvent) => any) | undefined | undefined;
+            } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "type" | "title" | "description" | "closable" | "closeText" | "showIcon" | "center" | "effect">;
+            $attrs: {
+                [x: string]: unknown;
+            };
+            $refs: {
+                [x: string]: unknown;
+            };
+            $slots: Readonly<{
+                [name: string]: import('vue').Slot<any> | undefined;
+            }>;
+            $root: import('vue').ComponentPublicInstance | null;
+            $parent: import('vue').ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: (event: "close", evt: MouseEvent) => void;
+            $el: any;
+            $options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                readonly title: {
+                    readonly type: import('vue').PropType<string>;
+                    readonly required: false;
+                    readonly validator: ((val: unknown) => boolean) | undefined;
+                    __epPropKey: true;
+                } & {
+                    readonly default: "";
+                };
+                readonly description: {
+                    readonly type: import('vue').PropType<string>;
+                    readonly required: false;
+                    readonly validator: ((val: unknown) => boolean) | undefined;
+                    __epPropKey: true;
+                } & {
+                    readonly default: "";
+                };
+                readonly type: {
+                    readonly type: import('vue').PropType<"success" | "warning" | "info" | "error">;
+                    readonly required: false;
+                    readonly validator: ((val: unknown) => boolean) | undefined;
+                    __epPropKey: true;
+                } & {
+                    readonly default: "info";
+                };
+                readonly closable: {
+                    readonly type: import('vue').PropType<boolean>;
+                    readonly required: false;
+                    readonly validator: ((val: unknown) => boolean) | undefined;
+                    __epPropKey: true;
+                } & {
+                    readonly default: true;
+                };
+                readonly closeText: {
+                    readonly type: import('vue').PropType<string>;
+                    readonly required: false;
+                    readonly validator: ((val: unknown) => boolean) | undefined;
+                    __epPropKey: true;
+                } & {
+                    readonly default: "";
+                };
+                readonly showIcon: BooleanConstructor;
+                readonly center: BooleanConstructor;
+                readonly effect: {
+                    readonly type: import('vue').PropType<"dark" | "light">;
+                    readonly required: false;
+                    readonly validator: ((val: unknown) => boolean) | undefined;
+                    __epPropKey: true;
+                } & {
+                    readonly default: "light";
+                };
+            }>> & {
+                onClose?: ((evt: MouseEvent) => any) | undefined;
+            }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                close: (evt: MouseEvent) => void;
+            }, string, {
+                readonly title: string;
+                readonly center: boolean;
+                readonly type: "success" | "warning" | "info" | "error";
+                readonly description: string;
+                readonly effect: "dark" | "light";
+                readonly closable: boolean;
+                readonly closeText: string;
+                readonly showIcon: boolean;
+            }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+                beforeCreate?: (() => void) | (() => void)[];
+                created?: (() => void) | (() => void)[];
+                beforeMount?: (() => void) | (() => void)[];
+                mounted?: (() => void) | (() => void)[];
+                beforeUpdate?: (() => void) | (() => void)[];
+                updated?: (() => void) | (() => void)[];
+                activated?: (() => void) | (() => void)[];
+                deactivated?: (() => void) | (() => void)[];
+                beforeDestroy?: (() => void) | (() => void)[];
+                beforeUnmount?: (() => void) | (() => void)[];
+                destroyed?: (() => void) | (() => void)[];
+                unmounted?: (() => void) | (() => void)[];
+                renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+            };
+            $forceUpdate: () => void;
+            $nextTick: typeof import('vue').nextTick;
+            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+        } & Readonly<{
+            readonly title: string;
+            readonly center: boolean;
+            readonly type: "success" | "warning" | "info" | "error";
+            readonly description: string;
+            readonly effect: "dark" | "light";
+            readonly closable: boolean;
+            readonly closeText: string;
+            readonly showIcon: boolean;
+        }> & Omit<Readonly<import('vue').ExtractPropTypes<{
+            readonly title: {
+                readonly type: import('vue').PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly description: {
+                readonly type: import('vue').PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly type: {
+                readonly type: import('vue').PropType<"success" | "warning" | "info" | "error">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "info";
+            };
+            readonly closable: {
+                readonly type: import('vue').PropType<boolean>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: true;
+            };
+            readonly closeText: {
+                readonly type: import('vue').PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly showIcon: BooleanConstructor;
+            readonly center: BooleanConstructor;
+            readonly effect: {
+                readonly type: import('vue').PropType<"dark" | "light">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "light";
+            };
+        }>> & {
+            onClose?: ((evt: MouseEvent) => any) | undefined;
+        }, "type" | "title" | "description" | "closable" | "closeText" | "showIcon" | "center" | "effect"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+            $slots: {
+                icon?(_: {}): any;
+                title?(_: {}): any;
+                default?(_: {}): any;
+            };
+        }) | null;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<{}, {
+    refEl: import('vue').Ref<any, any>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    refEl: ({
+        $: import('vue').ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            readonly title: string;
+            readonly center: boolean;
+            readonly type: "success" | "warning" | "info" | "error";
+            readonly description: string;
+            readonly effect: "dark" | "light";
+            readonly closable: boolean;
+            readonly closeText: string;
+            readonly showIcon: boolean;
+        }> & Omit<{
+            readonly type: "success" | "warning" | "info" | "error";
+            readonly title: string;
+            readonly description: string;
+            readonly closable: boolean;
+            readonly closeText: string;
+            readonly showIcon: boolean;
+            readonly center: boolean;
+            readonly effect: "dark" | "light";
+            onClose?: ((evt: MouseEvent) => any) | undefined | undefined;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "type" | "title" | "description" | "closable" | "closeText" | "showIcon" | "center" | "effect">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import('vue').Slot<any> | undefined;
+        }>;
+        $root: import('vue').ComponentPublicInstance | null;
+        $parent: import('vue').ComponentPublicInstance | null;
+        $host: Element | null;
+        $emit: (event: "close", evt: MouseEvent) => void;
+        $el: any;
+        $options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+            readonly title: {
+                readonly type: import('vue').PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly description: {
+                readonly type: import('vue').PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly type: {
+                readonly type: import('vue').PropType<"success" | "warning" | "info" | "error">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "info";
+            };
+            readonly closable: {
+                readonly type: import('vue').PropType<boolean>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: true;
+            };
+            readonly closeText: {
+                readonly type: import('vue').PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly showIcon: BooleanConstructor;
+            readonly center: BooleanConstructor;
+            readonly effect: {
+                readonly type: import('vue').PropType<"dark" | "light">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "light";
+            };
+        }>> & {
+            onClose?: ((evt: MouseEvent) => any) | undefined;
+        }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            close: (evt: MouseEvent) => void;
+        }, string, {
+            readonly title: string;
+            readonly center: boolean;
+            readonly type: "success" | "warning" | "info" | "error";
+            readonly description: string;
+            readonly effect: "dark" | "light";
+            readonly closable: boolean;
+            readonly closeText: string;
+            readonly showIcon: boolean;
+        }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import('vue').nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+    } & Readonly<{
+        readonly title: string;
+        readonly center: boolean;
+        readonly type: "success" | "warning" | "info" | "error";
+        readonly description: string;
+        readonly effect: "dark" | "light";
+        readonly closable: boolean;
+        readonly closeText: string;
+        readonly showIcon: boolean;
+    }> & Omit<Readonly<import('vue').ExtractPropTypes<{
+        readonly title: {
+            readonly type: import('vue').PropType<string>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "";
+        };
+        readonly description: {
+            readonly type: import('vue').PropType<string>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "";
+        };
+        readonly type: {
+            readonly type: import('vue').PropType<"success" | "warning" | "info" | "error">;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "info";
+        };
+        readonly closable: {
+            readonly type: import('vue').PropType<boolean>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: true;
+        };
+        readonly closeText: {
+            readonly type: import('vue').PropType<string>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "";
+        };
+        readonly showIcon: BooleanConstructor;
+        readonly center: BooleanConstructor;
+        readonly effect: {
+            readonly type: import('vue').PropType<"dark" | "light">;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "light";
+        };
+    }>> & {
+        onClose?: ((evt: MouseEvent) => any) | undefined;
+    }, "type" | "title" | "description" | "closable" | "closeText" | "showIcon" | "center" | "effect"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+        $slots: {
+            icon?(_: {}): any;
+            title?(_: {}): any;
+            default?(_: {}): any;
+        };
+    }) | null;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/alert/src/index.js

@@ -1,28 +1,31 @@
-import { defineComponent, useAttrs, useSlots, resolveDirective, openBlock, createElementBlock, normalizeClass, unref, withDirectives, createBlock, normalizeProps, guardReactiveProps, createSlots, renderList, withCtx, renderSlot } from "vue";
-import { dataProps, dataEmits, dataExpose } from "./data.js";
+import { defineComponent, ref, useAttrs, useSlots, createElementBlock, openBlock, normalizeClass, unref, createVNode, mergeProps, createSlots, renderList, withCtx, renderSlot } from "vue";
+import { dataEmits, dataProps, dataExpose } from "./data.js";
 import { useCssName } from "../../../hooks/cssname/index.js";
-import "../../../hooks/global-config/index.js";
 import { useLocale } from "../../../hooks/locale/index.js";
 import { ElAlert } from "element-plus";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: dataProps,
   emits: dataEmits,
-  setup(__props, { expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const refEl = ref();
     const attrs = useAttrs();
     const slots = useSlots();
     const cs = useCssName("alert");
     useLocale();
-    expose({
-      ...dataExpose
+    __expose({
+      ...dataExpose,
+      refEl
     });
     return (_ctx, _cache) => {
-      const _directive_expose = resolveDirective("expose");
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(unref(cs).z())
       }, [
-        withDirectives((openBlock(), createBlock(unref(ElAlert), normalizeProps(guardReactiveProps(unref(attrs))), createSlots({ _: 2 }, [
-          renderList(Object.keys(unref(slots)), (k) => {
+        createVNode(unref(ElAlert), mergeProps(unref(attrs), {
+          ref_key: "refEl",
+          ref: refEl
+        }), createSlots({ _: 2 }, [
+          renderList(Object.keys(unref(slots)), (k, i) => {
             return {
               name: k,
               fn: withCtx(() => [
@@ -30,9 +33,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               ])
             };
           })
-        ]), 1040)), [
-          [_directive_expose]
-        ])
+        ]), 1040)
       ], 2);
     };
   }

package/dist/components/box/index.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+;/* empty css                 */
+const withInstall = require("../../utils/vues/withInstall.cjs");
+const index_vue_vue_type_script_setup_true_lang = require("./src/index.cjs");
+const Box = withInstall.withInstall(index_vue_vue_type_script_setup_true_lang.default, "Box");
+exports.Box = Box;
+exports.default = Box;

package/dist/components/box/index.css

@@ -0,0 +1,73 @@
+.com {
+  font-size: 20px;
+}
+
+.box-mask {
+  display: block;
+  opacity: 0.5;
+  z-index: 0;
+  position: fixed;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  background: rgba(2, 28, 39, 0.4);
+}
+
+.box-title {
+  padding: 10px;
+  position: relative;
+  background-color: #467ddc;
+  color: #fff;
+  align-items: center;
+  display: flex;
+}
+.box-title .box-title-name {
+  flex: 1;
+}
+.box-title .box-title-close {
+  right: 10px;
+  font-size: 18px;
+  display: flex;
+  align-items: center;
+}
+.box-title .box-title-close i {
+  width: 20px;
+  height: 20px;
+  margin: 0 4px;
+  cursor: pointer;
+}
+
+.box {
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  z-index: 1000;
+  top: 0;
+  left: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+.box .box-body {
+  position: relative;
+  z-index: 100;
+  background: #fff;
+  min-width: 30%;
+  min-height: 20%;
+  max-height: 90%;
+  display: flex;
+  flex-direction: column;
+}
+.box .box-body .box-body-div {
+  flex: 1;
+  overflow-y: auto;
+  padding: 20px;
+}
+.box .box-body.popup-center .box-body-div {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}

package/dist/components/box/index.d.ts

@@ -0,0 +1,66 @@
+declare const Box: import('../../utils/vues').WithInstall<{
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        title: {
+            type: StringConstructor;
+        };
+        modelValue: {
+            type: BooleanConstructor;
+        };
+        to: {
+            type: StringConstructor;
+        };
+        disabled: {
+            type: BooleanConstructor;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        modelValue: boolean;
+        disabled: boolean;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        title: {
+            type: StringConstructor;
+        };
+        modelValue: {
+            type: BooleanConstructor;
+        };
+        to: {
+            type: StringConstructor;
+        };
+        disabled: {
+            type: BooleanConstructor;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, {
+        modelValue: boolean;
+        disabled: boolean;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+    };
+    modelValue: {
+        type: BooleanConstructor;
+    };
+    to: {
+        type: StringConstructor;
+    };
+    disabled: {
+        type: BooleanConstructor;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    modelValue: boolean;
+    disabled: boolean;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: Partial<Record<string, (_: {}) => any>> & Partial<Record<string, (_: {}) => any>> & {
+        default?(_: {}): any;
+    };
+})> & Record<string, any>;
+export { Box, Box as default };

package/dist/components/box/index.js

@@ -0,0 +1,8 @@
+/* empty css               */
+import { withInstall } from "../../utils/vues/withInstall.js";
+import _sfc_main from "./src/index.js";
+const Box = withInstall(_sfc_main, "Box");
+export {
+  Box,
+  Box as default
+};

package/dist/components/box/index.scss

@@ -0,0 +1,44 @@
+// @use '../common.scss' as *;
+
+// @use '../box-mask/index.scss' as *;
+// @use '../box-title/index.scss' as *;
+
+@use '../common.scss' as *;
+@use '../box-mask/index.scss' as *;
+@use '../box-title/index.scss' as *;
+
+.#{$namespace}box {
+	position: fixed;
+	width: 100%;
+	height: 100%;
+	z-index: 1000;
+	top: 0;
+	left: 0;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	.#{$namespace}box-body {
+		position: relative;
+		z-index: 100;
+		background: #fff;
+		min-width: 30%;
+		min-height: 20%;
+		max-height: 90%;
+		display: flex;
+		flex-direction: column;
+		.#{$namespace}box-body-div {
+			flex: 1;
+			overflow-y: auto;
+			padding: 20px;
+		}
+		&.popup-center {
+			.#{$namespace}box-body-div {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				justify-content: center;
+			}
+		}
+	}
+}