x-next 0.0.0-alpha.6 → 0.0.0-alpha.61

package/dist/components/grid/Col.vue.d.ts

@@ -0,0 +1,188 @@
+import { PropType } from 'vue';
+import { FlexType } from './interface';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 栅格占位格数
+     * @en Number of grid space
+     */
+    span: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * @zh 栅格左侧的间隔格数，间隔内不可以有栅格
+     * @en The number of grids on the left side of the grid. There can be no grids in the grid.
+     */
+    offset: {
+        type: NumberConstructor;
+    };
+    /**
+     * @zh 对元素进行排序
+     * @en Sort elements
+     */
+    order: {
+        type: NumberConstructor;
+    };
+    /**
+     * @zh < 576px 响应式栅格
+     * @en <576px responsive grid
+     */
+    xs: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 576px 响应式栅格
+     * @en >= 576px responsive grid
+     */
+    sm: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 768px 响应式栅格
+     * @en >= 768px responsive grid
+     */
+    md: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 992px 响应式栅格
+     * @en >= 992px responsive grid
+     */
+    lg: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 1200px 响应式栅格
+     * @en >= 1200px responsive grid
+     */
+    xl: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 1600px 响应式栅格
+     * @en >= 1600px responsive grid
+     */
+    xxl: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh 设置 flex 布局属性
+     * @en Set flex layout properties
+     * @version 2.10.0
+     */
+    flex: {
+        type: PropType<number | string | "initial" | "auto" | "none">;
+    };
+}>, {
+    visible: import('vue').ComputedRef<boolean>;
+    classNames: import('vue').ComputedRef<string | {
+        [x: string]: number | boolean | undefined;
+    }>;
+    styles: import('vue').ComputedRef<{
+        flex?: FlexType;
+        paddingLeft?: string;
+        paddingRight?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+    }>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 栅格占位格数
+     * @en Number of grid space
+     */
+    span: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * @zh 栅格左侧的间隔格数，间隔内不可以有栅格
+     * @en The number of grids on the left side of the grid. There can be no grids in the grid.
+     */
+    offset: {
+        type: NumberConstructor;
+    };
+    /**
+     * @zh 对元素进行排序
+     * @en Sort elements
+     */
+    order: {
+        type: NumberConstructor;
+    };
+    /**
+     * @zh < 576px 响应式栅格
+     * @en <576px responsive grid
+     */
+    xs: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 576px 响应式栅格
+     * @en >= 576px responsive grid
+     */
+    sm: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 768px 响应式栅格
+     * @en >= 768px responsive grid
+     */
+    md: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 992px 响应式栅格
+     * @en >= 992px responsive grid
+     */
+    lg: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 1200px 响应式栅格
+     * @en >= 1200px responsive grid
+     */
+    xl: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh >= 1600px 响应式栅格
+     * @en >= 1600px responsive grid
+     */
+    xxl: {
+        type: PropType<number | {
+            [key: string]: any;
+        }>;
+    };
+    /**
+     * @zh 设置 flex 布局属性
+     * @en Set flex layout properties
+     * @version 2.10.0
+     */
+    flex: {
+        type: PropType<number | string | "initial" | "auto" | "none">;
+    };
+}>> & Readonly<{}>, {
+    span: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/grid/Grid.vue.d.ts

@@ -0,0 +1,108 @@
+import { PropType } from 'vue';
+import { ResponsiveValue } from './interface';
+/**
+ * @version 2.15.0
+ * @zh 响应式配置从 `2.18.0` 开始支持，具体配置 [ResponsiveValue](#responsivevalue)
+ * @en Responsive configuration has been supported since `2.18.0`, the specific configuration [ResponsiveValue](#responsivevalue)
+ */
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 每一行展示的列数
+     * @en Number of columns displayed in each row
+     */
+    cols: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 行与行之间的间距
+     * @en The space in row-to-row
+     */
+    rowGap: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 列与列之间的间距
+     * @en The space in column-to-column
+     */
+    colGap: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 是否折叠
+     * @en Whether to collapsed
+     */
+    collapsed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * @zh 折叠时显示的行数
+     * @en Number of rows displayed when collapsed
+     */
+    collapsedRows: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, {
+    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, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 每一行展示的列数
+     * @en Number of columns displayed in each row
+     */
+    cols: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 行与行之间的间距
+     * @en The space in row-to-row
+     */
+    rowGap: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 列与列之间的间距
+     * @en The space in column-to-column
+     */
+    colGap: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 是否折叠
+     * @en Whether to collapsed
+     */
+    collapsed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * @zh 折叠时显示的行数
+     * @en Number of rows displayed when collapsed
+     */
+    collapsedRows: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    rowGap: number | ResponsiveValue;
+    cols: number | ResponsiveValue;
+    collapsed: boolean;
+    collapsedRows: number;
+    colGap: number | ResponsiveValue;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/grid/GridItem.vue.d.ts

@@ -0,0 +1,78 @@
+import { PropType } from 'vue';
+import { ResponsiveValue } from './interface';
+/**
+ * @version 2.15.0
+ * @zh 响应式配置从 `2.18.0` 开始支持，具体配置 [ResponsiveValue](#responsivevalue)
+ * @en Responsive configuration has been supported since `2.18.0`, the specific configuration [ResponsiveValue](#responsivevalue)
+ */
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 跨越的格数
+     * @en Number of grids spanned
+     */
+    span: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 左侧的间隔格数
+     * @en Number of grids on the left
+     */
+    offset: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 是否是后缀元素
+     * @en Is it a suffix element
+     */
+    suffix: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {
+    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, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 跨越的格数
+     * @en Number of grids spanned
+     */
+    span: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 左侧的间隔格数
+     * @en Number of grids on the left
+     */
+    offset: {
+        type: PropType<number | ResponsiveValue>;
+        default: number;
+    };
+    /**
+     * @zh 是否是后缀元素
+     * @en Is it a suffix element
+     */
+    suffix: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    span: number | ResponsiveValue;
+    suffix: boolean;
+    offset: number | ResponsiveValue;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/grid/Row.vue.d.ts

@@ -0,0 +1,102 @@
+import { PropType } from 'vue';
+import { ResponsiveValue } from './interface';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 栅格间隔，单位是`px` 栅格间隔。可传入响应式对象写法 { xs: 4, sm: 6, md: 12}，传入数组 [ 水平间距， 垂直间距 ] 来设置两个方向。
+     * @en Grid interval in `px`. Pass in the responsive object like {xs: 4, sm: 6, md: 12}. Pass in the array [horizontal spacing, vertical spacing] to set two directions.
+     */
+    gutter: {
+        type: PropType<number | ResponsiveValue | [number | ResponsiveValue, number | ResponsiveValue]>;
+        default: number;
+    };
+    /**
+     * @zh 水平对齐方式 (`justify-content`)
+     * @en Horizontal alignment (`justify-content`)
+     */
+    justify: {
+        type: PropType<"start" | "center" | "end" | "space-around" | "space-between">;
+        default: string;
+    };
+    /**
+     * @zh 竖直对齐方式 ( `align-items` )
+     * @en Vertical alignment (`align-items`)
+     */
+    align: {
+        type: PropType<"start" | "center" | "end" | "stretch">;
+        default: string;
+    };
+    /**
+     * @zh 开启这个选项`Row`和`Col`都会被当作div而不会附带任何Grid相关的类和样式
+     * @en Enabling this option `Row` and `Col` will be treated as divs without any Grid-related classes and styles
+     */
+    div: {
+        type: BooleanConstructor;
+    };
+    /**
+     * @zh `Col` 是否支持换行
+     * @en Whether `Col` can wrap onto multiple lines
+     * @version 2.13.0
+     */
+    wrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {
+    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, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /**
+     * @zh 栅格间隔，单位是`px` 栅格间隔。可传入响应式对象写法 { xs: 4, sm: 6, md: 12}，传入数组 [ 水平间距， 垂直间距 ] 来设置两个方向。
+     * @en Grid interval in `px`. Pass in the responsive object like {xs: 4, sm: 6, md: 12}. Pass in the array [horizontal spacing, vertical spacing] to set two directions.
+     */
+    gutter: {
+        type: PropType<number | ResponsiveValue | [number | ResponsiveValue, number | ResponsiveValue]>;
+        default: number;
+    };
+    /**
+     * @zh 水平对齐方式 (`justify-content`)
+     * @en Horizontal alignment (`justify-content`)
+     */
+    justify: {
+        type: PropType<"start" | "center" | "end" | "space-around" | "space-between">;
+        default: string;
+    };
+    /**
+     * @zh 竖直对齐方式 ( `align-items` )
+     * @en Vertical alignment (`align-items`)
+     */
+    align: {
+        type: PropType<"start" | "center" | "end" | "stretch">;
+        default: string;
+    };
+    /**
+     * @zh 开启这个选项`Row`和`Col`都会被当作div而不会附带任何Grid相关的类和样式
+     * @en Enabling this option `Row` and `Col` will be treated as divs without any Grid-related classes and styles
+     */
+    div: {
+        type: BooleanConstructor;
+    };
+    /**
+     * @zh `Col` 是否支持换行
+     * @en Whether `Col` can wrap onto multiple lines
+     * @version 2.13.0
+     */
+    wrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    div: boolean;
+    wrap: boolean;
+    justify: "center" | "space-around" | "space-between" | "end" | "start";
+    align: "center" | "stretch" | "end" | "start";
+    gutter: number | ResponsiveValue | [number | ResponsiveValue, number | ResponsiveValue];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

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

@@ -0,0 +1,19 @@
+import { InjectionKey } from 'vue';
+import { GridItemData } from './interface';
+export type RowContextContext = Readonly<{
+    gutter?: [number, number];
+    div?: boolean;
+}>;
+export declare const RowContextInjectionKey: InjectionKey<RowContextContext>;
+export type GridContext = Readonly<{
+    overflow: boolean;
+    displayIndexList: number[];
+    cols: number;
+    colGap: number;
+}>;
+export declare const GridContextInjectionKey: InjectionKey<GridContext>;
+export type GridDataCollector = Readonly<{
+    collectItemData: (index: number, itemData: GridItemData) => void;
+    removeItemData: (index: number) => void;
+}>;
+export declare const GridDataCollectorInjectionKey: InjectionKey<GridDataCollector>;

package/dist/components/grid/hook/use-responsive-state.d.ts

@@ -0,0 +1,3 @@
+import { Ref } from 'vue';
+import { ResponsiveValue } from '../interface';
+export declare function useResponsiveState(val: Ref<number | ResponsiveValue>, defaultVal: number, fallbackToXs?: boolean): import('vue').ComputedRef<number>;

package/dist/components/grid/hook/use-responsive-value.d.ts

@@ -0,0 +1,24 @@
+import { Ref } from 'vue';
+import { ResponsiveValue } from '../interface';
+export declare function useResponsiveValue(props: Ref<{
+    val: number;
+    key: string;
+    xs?: number | {
+        [key: string]: any;
+    };
+    sm?: number | {
+        [key: string]: any;
+    };
+    md?: number | {
+        [key: string]: any;
+    };
+    lg?: number | {
+        [key: string]: any;
+    };
+    xl?: number | {
+        [key: string]: any;
+    };
+    xxl?: number | {
+        [key: string]: any;
+    };
+}>): import('vue').ComputedRef<number | ResponsiveValue>;