x-next 0.0.0-alpha.7 → 0.0.0-alpha.70

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

@@ -0,0 +1,562 @@
+import { default as _GridRow } from './Row.vue';
+import { default as _GridCol } from './Col.vue';
+import { default as _Grid } from './Grid.vue';
+import { default as _GridItem } from './GridItem.vue';
+export type GridRowInstance = InstanceType<typeof _GridRow>;
+export type GridColInstance = InstanceType<typeof _GridCol>;
+export type GridInstance = InstanceType<typeof _Grid>;
+export type GridItemInstance = InstanceType<typeof _GridItem>;
+export type { ResponsiveValue, RowProps, ColProps, GridProps, GridItemProps } from './interface';
+export declare const Grid: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        cols: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        rowGap: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        colGap: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        collapsed: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        collapsedRows: {
+            type: NumberConstructor;
+            default: number;
+        };
+    }>> & Readonly<{}>, {
+        className: {
+            block: string;
+            element: (className: string) => string;
+            modifier: (className: string) => string;
+            is: (className: string) => string;
+        };
+        style: import('vue').ComputedRef<{
+            gap: string;
+            'grid-template-columns': string;
+        }[]>;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        rowGap: number | import('./interface').ResponsiveValue;
+        cols: number | import('./interface').ResponsiveValue;
+        collapsed: boolean;
+        collapsedRows: number;
+        colGap: number | import('./interface').ResponsiveValue;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        cols: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        rowGap: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        colGap: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        collapsed: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        collapsedRows: {
+            type: NumberConstructor;
+            default: number;
+        };
+    }>> & Readonly<{}>, {
+        className: {
+            block: string;
+            element: (className: string) => string;
+            modifier: (className: string) => string;
+            is: (className: string) => string;
+        };
+        style: import('vue').ComputedRef<{
+            gap: string;
+            'grid-template-columns': string;
+        }[]>;
+    }, {}, {}, {}, {
+        rowGap: number | import('./interface').ResponsiveValue;
+        cols: number | import('./interface').ResponsiveValue;
+        collapsed: boolean;
+        collapsedRows: number;
+        colGap: number | import('./interface').ResponsiveValue;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    cols: {
+        type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+        default: number;
+    };
+    rowGap: {
+        type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+        default: number;
+    };
+    colGap: {
+        type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+        default: number;
+    };
+    collapsed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    collapsedRows: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    className: {
+        block: string;
+        element: (className: string) => string;
+        modifier: (className: string) => string;
+        is: (className: string) => string;
+    };
+    style: import('vue').ComputedRef<{
+        gap: string;
+        'grid-template-columns': string;
+    }[]>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    rowGap: number | import('./interface').ResponsiveValue;
+    cols: number | import('./interface').ResponsiveValue;
+    collapsed: boolean;
+    collapsedRows: number;
+    colGap: number | import('./interface').ResponsiveValue;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
+    install(app: import('vue').App): void;
+};
+export declare const Row: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        gutter: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue | [number | import('./interface').ResponsiveValue, number | import('./interface').ResponsiveValue]>;
+            default: number;
+        };
+        justify: {
+            type: import('vue').PropType<"start" | "center" | "end" | "space-around" | "space-between">;
+            default: string;
+        };
+        align: {
+            type: import('vue').PropType<"start" | "center" | "end" | "stretch">;
+            default: string;
+        };
+        div: {
+            type: BooleanConstructor;
+        };
+        wrap: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{}>, {
+        classNames: import('vue').ComputedRef<{
+            [x: string]: boolean | "center" | "space-around" | "space-between" | "stretch" | "end" | "start";
+        }>;
+        styles: import('vue').ComputedRef<{
+            marginTop?: string;
+            marginBottom?: string;
+            marginLeft?: string;
+            marginRight?: string;
+        }>;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        div: boolean;
+        wrap: boolean;
+        justify: "center" | "space-around" | "space-between" | "end" | "start";
+        align: "center" | "stretch" | "end" | "start";
+        gutter: number | import('./interface').ResponsiveValue | [number | import('./interface').ResponsiveValue, number | import('./interface').ResponsiveValue];
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        gutter: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue | [number | import('./interface').ResponsiveValue, number | import('./interface').ResponsiveValue]>;
+            default: number;
+        };
+        justify: {
+            type: import('vue').PropType<"start" | "center" | "end" | "space-around" | "space-between">;
+            default: string;
+        };
+        align: {
+            type: import('vue').PropType<"start" | "center" | "end" | "stretch">;
+            default: string;
+        };
+        div: {
+            type: BooleanConstructor;
+        };
+        wrap: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{}>, {
+        classNames: import('vue').ComputedRef<{
+            [x: string]: boolean | "center" | "space-around" | "space-between" | "stretch" | "end" | "start";
+        }>;
+        styles: import('vue').ComputedRef<{
+            marginTop?: string;
+            marginBottom?: string;
+            marginLeft?: string;
+            marginRight?: string;
+        }>;
+    }, {}, {}, {}, {
+        div: boolean;
+        wrap: boolean;
+        justify: "center" | "space-around" | "space-between" | "end" | "start";
+        align: "center" | "stretch" | "end" | "start";
+        gutter: number | import('./interface').ResponsiveValue | [number | import('./interface').ResponsiveValue, number | import('./interface').ResponsiveValue];
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    gutter: {
+        type: import('vue').PropType<number | import('./interface').ResponsiveValue | [number | import('./interface').ResponsiveValue, number | import('./interface').ResponsiveValue]>;
+        default: number;
+    };
+    justify: {
+        type: import('vue').PropType<"start" | "center" | "end" | "space-around" | "space-between">;
+        default: string;
+    };
+    align: {
+        type: import('vue').PropType<"start" | "center" | "end" | "stretch">;
+        default: string;
+    };
+    div: {
+        type: BooleanConstructor;
+    };
+    wrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    classNames: import('vue').ComputedRef<{
+        [x: string]: boolean | "center" | "space-around" | "space-between" | "stretch" | "end" | "start";
+    }>;
+    styles: import('vue').ComputedRef<{
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+    }>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    div: boolean;
+    wrap: boolean;
+    justify: "center" | "space-around" | "space-between" | "end" | "start";
+    align: "center" | "stretch" | "end" | "start";
+    gutter: number | import('./interface').ResponsiveValue | [number | import('./interface').ResponsiveValue, number | import('./interface').ResponsiveValue];
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
+    install(app: import('vue').App): void;
+};
+export declare const Col: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        span: {
+            type: NumberConstructor;
+            default: number;
+        };
+        offset: {
+            type: NumberConstructor;
+        };
+        order: {
+            type: NumberConstructor;
+        };
+        xs: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        sm: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        md: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        lg: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        xl: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        xxl: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        flex: {
+            type: import('vue').PropType<number | string | "initial" | "auto" | "none">;
+        };
+    }>> & Readonly<{}>, {
+        visible: import('vue').ComputedRef<boolean>;
+        classNames: import('vue').ComputedRef<string | {
+            [x: string]: number | boolean | undefined;
+        }>;
+        styles: import('vue').ComputedRef<{
+            flex?: import('./interface').FlexType;
+            paddingLeft?: string;
+            paddingRight?: string;
+            paddingTop?: string;
+            paddingBottom?: string;
+        }>;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        span: number;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        span: {
+            type: NumberConstructor;
+            default: number;
+        };
+        offset: {
+            type: NumberConstructor;
+        };
+        order: {
+            type: NumberConstructor;
+        };
+        xs: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        sm: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        md: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        lg: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        xl: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        xxl: {
+            type: import('vue').PropType<number | {
+                [key: string]: any;
+            }>;
+        };
+        flex: {
+            type: import('vue').PropType<number | string | "initial" | "auto" | "none">;
+        };
+    }>> & Readonly<{}>, {
+        visible: import('vue').ComputedRef<boolean>;
+        classNames: import('vue').ComputedRef<string | {
+            [x: string]: number | boolean | undefined;
+        }>;
+        styles: import('vue').ComputedRef<{
+            flex?: import('./interface').FlexType;
+            paddingLeft?: string;
+            paddingRight?: string;
+            paddingTop?: string;
+            paddingBottom?: string;
+        }>;
+    }, {}, {}, {}, {
+        span: number;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    span: {
+        type: NumberConstructor;
+        default: number;
+    };
+    offset: {
+        type: NumberConstructor;
+    };
+    order: {
+        type: NumberConstructor;
+    };
+    xs: {
+        type: import('vue').PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    sm: {
+        type: import('vue').PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    md: {
+        type: import('vue').PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    lg: {
+        type: import('vue').PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    xl: {
+        type: import('vue').PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    xxl: {
+        type: import('vue').PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    flex: {
+        type: import('vue').PropType<number | string | "initial" | "auto" | "none">;
+    };
+}>> & Readonly<{}>, {
+    visible: import('vue').ComputedRef<boolean>;
+    classNames: import('vue').ComputedRef<string | {
+        [x: string]: number | boolean | undefined;
+    }>;
+    styles: import('vue').ComputedRef<{
+        flex?: import('./interface').FlexType;
+        paddingLeft?: string;
+        paddingRight?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+    }>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    span: number;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
+    install(app: import('vue').App): void;
+};
+export declare const GridItem: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        span: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        offset: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        suffix: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{}>, {
+        classNames: import('vue').ComputedRef<string[]>;
+        style: import('vue').ComputedRef<({
+            'margin-left': string;
+        } | {
+            'margin-left'?: undefined;
+        } | {
+            'grid-column': string;
+            display?: undefined;
+        } | {
+            display: string;
+            'grid-column'?: undefined;
+        })[]>;
+        domRef: import('vue').Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+        overflow: import('vue').ComputedRef<boolean>;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        span: number | import('./interface').ResponsiveValue;
+        suffix: boolean;
+        offset: number | import('./interface').ResponsiveValue;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        span: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        offset: {
+            type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+            default: number;
+        };
+        suffix: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{}>, {
+        classNames: import('vue').ComputedRef<string[]>;
+        style: import('vue').ComputedRef<({
+            'margin-left': string;
+        } | {
+            'margin-left'?: undefined;
+        } | {
+            'grid-column': string;
+            display?: undefined;
+        } | {
+            display: string;
+            'grid-column'?: undefined;
+        })[]>;
+        domRef: import('vue').Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+        overflow: import('vue').ComputedRef<boolean>;
+    }, {}, {}, {}, {
+        span: number | import('./interface').ResponsiveValue;
+        suffix: boolean;
+        offset: number | import('./interface').ResponsiveValue;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    span: {
+        type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+        default: number;
+    };
+    offset: {
+        type: import('vue').PropType<number | import('./interface').ResponsiveValue>;
+        default: number;
+    };
+    suffix: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    classNames: import('vue').ComputedRef<string[]>;
+    style: import('vue').ComputedRef<({
+        'margin-left': string;
+    } | {
+        'margin-left'?: undefined;
+    } | {
+        'grid-column': string;
+        display?: undefined;
+    } | {
+        display: string;
+        'grid-column'?: undefined;
+    })[]>;
+    domRef: import('vue').Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+    overflow: import('vue').ComputedRef<boolean>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    span: number | import('./interface').ResponsiveValue;
+    suffix: boolean;
+    offset: number | import('./interface').ResponsiveValue;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
+    install(app: import('vue').App): void;
+};
+export { Grid as default };

package/dist/components/grid/interface.d.ts

@@ -0,0 +1,80 @@
+export interface ResponsiveValue {
+    /**
+     * @zh >= 1600px 响应式配置
+     * @en >= 1600px responsive configuration
+     */
+    xxl?: number;
+    /**
+     * @zh >= 1200px 响应式配置
+     * @en >= 1200px responsive configuration
+     */
+    xl?: number;
+    /**
+     * @zh >= 992px 响应式配置
+     * @en >= 992px responsive configuration
+     */
+    lg?: number;
+    /**
+     * @zh >= 768px 响应式配置
+     * @en >= 768px responsive configuration
+     */
+    md?: number;
+    /**
+     * @zh >= 576px 响应式配置
+     * @en >= 576px responsive configuration
+     */
+    sm?: number;
+    /**
+     * @zh < 576px 响应式配置
+     * @en <576px responsive configuration
+     */
+    xs?: number;
+}
+export type FlexType = number | string | 'initial' | 'auto' | 'none';
+export interface RowProps {
+    gutter?: number | ResponsiveValue | ResponsiveValue[];
+    justify?: 'start' | 'center' | 'end' | 'space-around' | 'space-between';
+    align?: 'start' | 'center' | 'end' | 'stretch';
+    div?: boolean;
+    wrap?: boolean;
+}
+export interface ColProps {
+    span?: number;
+    offset?: number | undefined;
+    order?: number | undefined;
+    xs?: number | {
+        [key: string]: any;
+    } | undefined;
+    sm?: number | {
+        [key: string]: any;
+    } | undefined;
+    md?: number | {
+        [key: string]: any;
+    } | undefined;
+    lg?: number | {
+        [key: string]: any;
+    } | undefined;
+    xl?: number | {
+        [key: string]: any;
+    } | undefined;
+    xxl?: number | {
+        [key: string]: any;
+    } | undefined;
+    flex?: number | string | 'initial' | 'auto' | 'none' | undefined;
+}
+export interface GridProps {
+    cols?: number | ResponsiveValue;
+    rowGap?: number | ResponsiveValue;
+    colGap?: number | ResponsiveValue;
+    collapsed?: boolean;
+    collapsedRows?: number;
+}
+export interface GridItemProps {
+    span?: number | ResponsiveValue;
+    offset?: number | ResponsiveValue;
+    suffix?: boolean;
+}
+export interface GridItemData extends GridItemProps {
+    span: number;
+    offset: number;
+}

package/dist/components/grid/utils/index.d.ts

@@ -0,0 +1,11 @@
+import { GridItemData } from '../interface';
+export declare function resolveItemData(cols: number, props: GridItemData): GridItemData;
+export declare function setItemVisible({ cols, collapsed, collapsedRows, itemDataList, }: {
+    cols: number;
+    collapsed: boolean;
+    collapsedRows: number;
+    itemDataList: GridItemData[];
+}): {
+    overflow: boolean;
+    displayIndexList: number[];
+};