@webx-ui/core 0.4.0 → 0.5.0

package/dist/components/Kanban/Kanban.d.ts

@@ -0,0 +1,82 @@
+import { KanbanCard, KanbanColumn, KanbanId, KanbanProps, KanbanVia } from './types';
+declare const _default: <T extends KanbanCard = KanbanCard>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly onAdd?: ((column: KanbanColumn<T>) => any) | undefined;
+        readonly "onUpdate:collapsed"?: ((value: KanbanId[]) => any) | undefined;
+        readonly onMove?: ((move: import('./types').KanbanMove<T>) => any) | undefined;
+        readonly "onColumn-move"?: ((move: import('./types').KanbanColumnMove<T>) => any) | undefined;
+        readonly "onAdd-column"?: (() => any) | undefined;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onAdd" | "onUpdate:collapsed" | "onMove" | "onColumn-move" | "onAdd-column"> & ({
+        collapsed?: KanbanId[];
+    } & KanbanProps<T>) & Partial<{}>> & import('vue').PublicProps;
+    expose(exposed: import('vue').ShallowUnwrapRef<{
+        move: (from: KanbanColumn<T>, fromIndex: number, to: KanbanColumn<T>, toIndex: number, via: KanbanVia) => void;
+        moveColumn: (from: number, to: number, via: KanbanVia) => void;
+        toggle: (column: KanbanColumn<T>) => void;
+    }>): void;
+    attrs: any;
+    slots: Readonly<{
+        /** One card. Without it the board falls back to the card's own title. */
+        card?: (props: {
+            card: T;
+            column: KanbanColumn<T>;
+            index: number;
+        }) => unknown;
+        /** Replaces the title and the count above a column. */
+        'column-header'?: (props: {
+            column: KanbanColumn<T>;
+            count: number;
+            overLimit: boolean;
+        }) => unknown;
+        /** The end of a column's heading — a plus, a menu, whatever the column can do. */
+        'column-actions'?: (props: {
+            column: KanbanColumn<T>;
+            collapsed: boolean;
+        }) => unknown;
+        /** Under the cards, where the add button would be. */
+        'column-footer'?: (props: {
+            column: KanbanColumn<T>;
+        }) => unknown;
+        /** Shown in a column holding no cards. */
+        empty?: (props: {
+            column: KanbanColumn<T>;
+        }) => unknown;
+        /** After the last column, in place of the add-a-column button. */
+        default?: () => unknown;
+    }> & {
+        /** One card. Without it the board falls back to the card's own title. */
+        card?: (props: {
+            card: T;
+            column: KanbanColumn<T>;
+            index: number;
+        }) => unknown;
+        /** Replaces the title and the count above a column. */
+        'column-header'?: (props: {
+            column: KanbanColumn<T>;
+            count: number;
+            overLimit: boolean;
+        }) => unknown;
+        /** The end of a column's heading — a plus, a menu, whatever the column can do. */
+        'column-actions'?: (props: {
+            column: KanbanColumn<T>;
+            collapsed: boolean;
+        }) => unknown;
+        /** Under the cards, where the add button would be. */
+        'column-footer'?: (props: {
+            column: KanbanColumn<T>;
+        }) => unknown;
+        /** Shown in a column holding no cards. */
+        empty?: (props: {
+            column: KanbanColumn<T>;
+        }) => unknown;
+        /** After the last column, in place of the add-a-column button. */
+        default?: () => unknown;
+    };
+    emit: (((evt: "add", column: KanbanColumn<T>) => void) & ((evt: "move", move: import('./types').KanbanMove<T>) => void) & ((evt: "column-move", move: import('./types').KanbanColumnMove<T>) => void) & ((evt: "add-column") => void)) & ((evt: "update:collapsed", value: KanbanId[]) => void);
+}>) => import('vue').VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

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

@@ -0,0 +1,2 @@
+export { default as WxKanban } from './Kanban';
+export type * from './types';

package/dist/components/Kanban/types.d.ts

@@ -0,0 +1,83 @@
+export type KanbanId = string | number;
+/** Colour of the line above a column's heading. */
+export type KanbanTone = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
+export type KanbanSize = 'sm' | 'md';
+/** How something was moved — worth knowing when you animate or undo. */
+export type KanbanVia = 'pointer' | 'keyboard';
+/** The least a card has to carry: something to key it by. */
+export interface KanbanCard {
+    id: KanbanId;
+    [key: string]: unknown;
+}
+export interface KanbanColumn<T extends KanbanCard = KanbanCard> {
+    id: KanbanId;
+    title?: string;
+    /** The cards, in the order they are shown. The board writes moves back into it. */
+    items: T[];
+    /**
+     * How many cards the column is meant to hold. At the limit the count turns red and
+     * nothing more can be dropped in — a work-in-progress limit, the point of a board.
+     */
+    limit?: number;
+    /** Colour of the rule above the heading. */
+    tone?: KanbanTone;
+    /** Cards can be neither taken from this column nor put into it. */
+    disabled?: boolean;
+}
+/** Where a card came from and where it went. */
+export interface KanbanMove<T extends KanbanCard = KanbanCard> {
+    card: T;
+    from: {
+        column: KanbanId;
+        index: number;
+    };
+    to: {
+        column: KanbanId;
+        index: number;
+    };
+    via: KanbanVia;
+}
+/** Where a column came from and where it went. */
+export interface KanbanColumnMove<T extends KanbanCard = KanbanCard> {
+    column: KanbanColumn<T>;
+    from: number;
+    to: number;
+    via: KanbanVia;
+}
+export interface KanbanProps<T extends KanbanCard = KanbanCard> {
+    /** The columns, each carrying its own cards. */
+    columns: KanbanColumn<T>[];
+    /** Boards that share a name exchange cards. Left alone, a board keeps to itself. */
+    group?: string;
+    size?: KanbanSize;
+    /** Width of a column: a number is pixels, a string is any CSS length. */
+    columnWidth?: number | string;
+    /** Nothing on the board can be moved. */
+    disabled?: boolean;
+    /** CSS selector for the part of a card that starts a drag. */
+    handle?: string;
+    /** Shows an add button under every column, which emits `add`. */
+    addable?: boolean;
+    addLabel?: string;
+    /** Lets a column be folded down to a strip. Use `v-model:collapsed` to remember it. */
+    collapsible?: boolean;
+    /** Columns can be dragged into another order, by their heading. */
+    reorderColumns?: boolean;
+    /** Shows an add button after the last column, which emits `add-column`. */
+    columnAddable?: boolean;
+    addColumnLabel?: string;
+    /** Shown in a column with no cards. */
+    emptyText?: string;
+    /** Accessible name for the board. */
+    ariaLabel?: string;
+}
+export interface KanbanEmits<T extends KanbanCard = KanbanCard> {
+    /** A card changed position or column. The arrays have already been updated. */
+    move: [move: KanbanMove<T>];
+    /** A column changed position. */
+    'column-move': [move: KanbanColumnMove<T>];
+    /** The add button under a column was pressed. */
+    add: [column: KanbanColumn<T>];
+    /** The add button after the last column was pressed. */
+    'add-column': [];
+}

package/dist/components/index.d.ts

@@ -25,6 +25,7 @@ export * from './Icon';
 export * from './Indicator';
 export * from './Input';
 export * from './InputNumber';
+export * from './Kanban';
 export * from './Link';
 export * from './Pagination';
 export * from './Popover';