@davincihealthcare/elty-design-system-vue 1.49.1 → 1.50.1

package/dist/table/ElMobileTable.vue.d.ts

@@ -0,0 +1,158 @@
+import { OptionType } from '../types';
+import { ElTagColor } from '../ElTag.vue';
+import { default as ElButton, ElButtonProps } from '../ElButton.vue';
+import { ElListItemProps } from '../ElListItem.vue';
+
+export type SelectOptions = OptionType[];
+export type MobileTableFiltersStatus = {
+    freeSearch?: string;
+    fromDate?: number;
+    multiSelect: {
+        mainText?: string[];
+        secondaryRow?: string[];
+        tertiaryRow?: string[];
+        tags?: string[];
+        time?: string[];
+        amount?: string[];
+        avatar?: string[];
+    };
+};
+export type MobileTableFilter = {
+    freeSearch?: {
+        placeholder?: string;
+        filterOn: ('mainText' | 'secondaryRow' | 'tertiaryRow' | 'amount' | 'tags' | 'time' | 'avatar')[];
+    };
+    multiValue?: {
+        mainText?: {
+            enabled: boolean;
+            label: string;
+            selectOptions?: SelectOptions;
+        };
+        secondaryRow?: {
+            enabled: boolean;
+            label: string;
+            selectOptions?: SelectOptions;
+        };
+        tertiaryRow?: {
+            enabled: boolean;
+            label: string;
+            selectOptions?: SelectOptions;
+        };
+        amount?: {
+            enabled: boolean;
+            label: string;
+            selectOptions?: SelectOptions;
+        };
+        tags?: {
+            enabled: boolean;
+            label: string;
+            selectOptions?: SelectOptions;
+        };
+        time?: {
+            enabled: boolean;
+            label: string;
+            selectOptions?: SelectOptions;
+        };
+        avatar?: {
+            enabled: boolean;
+            label: string;
+            selectOptions?: SelectOptions;
+        };
+    };
+    dateRange?: {
+        enabled: boolean;
+        label: string;
+    };
+    resetButton?: boolean;
+    managed?: boolean;
+};
+export type MobileTableRow = Omit<ElListItemProps, 'color'> & {
+    id: string;
+    rowNotSelectable?: boolean;
+    relatedObject?: any;
+    clickAction?: (payload: PointerEvent) => void;
+    actions?: {
+        primary: InstanceType<typeof ElButton>['$props'];
+        secondary?: InstanceType<typeof ElButton>['$props'];
+    };
+    sortableAndFilterableValue?: string;
+    details: {
+        label: string;
+        value: {
+            type: 'default';
+            text: string;
+        } | {
+            type: 'tag';
+            text: string;
+            color?: ElTagColor;
+        } | {
+            type: 'avatar';
+            label?: string;
+            picture?: string;
+        };
+    }[];
+};
+export interface ElMobileTableProps {
+    color: 'primary' | 'secondary';
+    filters: MobileTableFilter;
+    loading?: boolean;
+    selection?: {
+        enabled: boolean;
+        selectionMode?: 'single' | 'multiple';
+        destructiveAction?: {
+            enabled: boolean;
+            button: Omit<ElButtonProps, 'variant' | 'type' | 'label' | 'error' | 'onClick'> & {
+                label?: (count: number) => string;
+            };
+        };
+        bulkActionButton: Omit<ElButtonProps, 'variant' | 'type' | 'label' | 'error' | 'onClick'> & {
+            label: (count: number) => string;
+        };
+        selectedLabel?: (selectionCount: number) => string;
+        cancelText?: (selectionCount: number) => string;
+    };
+    sortBy?: {
+        on: 'mainText' | 'secondaryRow' | 'tertiaryRow' | 'amount' | 'tags' | 'time' | 'avatar';
+        order: 'asc' | 'desc';
+    };
+    data: MobileTableRow[];
+}
+declare function __VLS_template(): {
+    default?(_: {}): any;
+    "after-list"?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<ElMobileTableProps>, {
+    filteredData: import('vue').ComputedRef<MobileTableRow[]>;
+    selectRows: (rowsIds: string[]) => void;
+    unselectAllRows: () => void;
+    getDataRows: () => MobileTableRow[];
+    getSelectedRows: () => MobileTableRow[];
+}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "destructive:click": (selectedItems: MobileTableRow[]) => void;
+    "bulk:click": (selectedItems: MobileTableRow[]) => void;
+    "selection:exit": () => void;
+    "rows-selected": (selectedItems: MobileTableRow[]) => void;
+    "filters-updated": (filters: MobileTableFiltersStatus) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ElMobileTableProps>>> & {
+    "onRows-selected"?: ((selectedItems: MobileTableRow[]) => any) | undefined;
+    "onDestructive:click"?: ((selectedItems: MobileTableRow[]) => any) | undefined;
+    "onBulk:click"?: ((selectedItems: MobileTableRow[]) => any) | undefined;
+    "onSelection:exit"?: (() => any) | undefined;
+    "onFilters-updated"?: ((filters: MobileTableFiltersStatus) => any) | undefined;
+}, {}, {}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/table/ElResponsiveTable.vue.d.ts

@@ -0,0 +1,141 @@
+import { DefaultCell } from './ElTableCell.vue';
+import { default as ElDropdown } from '../ElDropdown.vue';
+import { default as ElIconButton } from '../ElIconButton.vue';
+import { default as ElButton } from '../ElButton.vue';
+import { default as ElAvatar } from '../ElAvatar.vue';
+import { ElIconProps } from '../ElIcon.vue';
+import { ElTextCellColor, ElTextCellStyle } from '../ElTextCell.vue';
+import { ElTagColor } from '../ElTag.vue';
+import { ElMobileTableProps, MobileTableRow } from './ElMobileTable.vue';
+import { DataRow, FilterType } from './commonTypes';
+
+export type ResponsiveDataCell = ResponsiveDefaultDataCell | ResponsiveTagDataCell | ResponsiveActionDataCell;
+export type ResponsiveDefaultDataCell = {
+    type: 'default';
+    sortableAndFilterableValue?: string;
+    mainText: string;
+    mainTextStyle?: ElTextCellStyle;
+    mainTextColor?: ElTextCellColor;
+    subText?: string;
+    avatar?: Pick<InstanceType<typeof ElAvatar>['$props'], 'picture' | 'label'>;
+    clickAction?: (payload?: PointerEvent) => void;
+    desktopBehaviour?: Pick<DefaultCell, 'mainIcon' | 'subIcon' | 'longText' | 'truncateSubText'>;
+    mobileBehaviour?: {
+        tertiaryText?: string;
+        amountText?: string;
+        timeText?: string;
+    };
+};
+export type ResponsiveTagDataCell = {
+    type: 'tag';
+    text: string;
+    color?: ElTagColor;
+    desktopBehaviour?: {
+        subText?: string;
+        truncateSubText?: boolean;
+    };
+    sortableAndFilterableValue?: string;
+};
+export type ResponsiveActionDataCell = {
+    type: 'action';
+    buttons?: InstanceType<typeof ElButton>['$props'][];
+    iconButtons?: InstanceType<typeof ElIconButton>['$props'][];
+    dropdown?: InstanceType<typeof ElDropdown>['$props'];
+    mobileBehaviour?: {
+        primary: number;
+        secondary?: number;
+    };
+};
+export type ResponsiveDataRow<T = any> = {
+    id: string;
+    rowNotSelectable?: boolean;
+    relatedObject?: T;
+    cells: ResponsiveDataCell[];
+    mobileBehaviour?: {
+        trailingIcon?: ElIconProps;
+    };
+};
+export type ResponsiveTableColumn = {
+    title: string;
+    filter?: {
+        type: FilterType;
+        placeholder?: string;
+        mobileBehaviour?: {
+            /**
+             * Used only if filter type === 'MULTI_VALUE' and column.mobileBehaviour.position is an array
+             */
+            position?: 'mainText' | 'secondaryRow' | 'tertiaryRow' | 'amount' | 'time' | 'tags' | 'avatar';
+        };
+    } | {
+        type: 'RESET_FILTERS_BUTTON';
+    };
+    desktopBehaviour?: {
+        alignRight?: boolean;
+        noSort?: boolean;
+    };
+    mobileBehaviour?: {
+        position: 'mainText' | 'secondaryRow' | 'tertiaryRow' | 'amount' | 'time' | 'tags' | 'avatar' | ({
+            take: keyof Pick<ResponsiveDefaultDataCell, 'mainText' | 'subText'>;
+            to: 'mainText' | 'secondaryRow' | 'tertiaryRow' | 'amount' | 'time';
+            withLabel: string;
+        } | {
+            withLabel: string;
+            to: 'avatar';
+        })[];
+    };
+};
+export interface ElResponsiveTableProps {
+    columns: ResponsiveTableColumn[];
+    data: ResponsiveDataRow[];
+    tableId?: number | string;
+    noFilters?: boolean;
+    rowsSelectionMode?: 'single' | 'multiple';
+    rowsSelectionDisabled?: boolean;
+    color: 'primary' | 'secondary';
+    loading?: boolean;
+    sortBy?: {
+        column?: number;
+        order?: 'asc' | 'desc';
+    };
+    desktopBehaviour?: {
+        noFooter?: boolean;
+        initialRows?: number;
+    };
+    mobileBehaviour?: {
+        selection?: Pick<NonNullable<ElMobileTableProps['selection']>, 'destructiveAction' | 'bulkActionButton' | 'selectedLabel' | 'cancelText'>;
+    };
+}
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<ElResponsiveTableProps>, {
+    filteredData: import('vue').ComputedRef<DataRow<any>[] | MobileTableRow[] | undefined>;
+    selectRows: (rowsIds: string[]) => Promise<void>;
+    unselectAllRows: () => void;
+    getDataRows: () => ResponsiveDataRow<any>[];
+    getSelectedRows: () => ResponsiveDataRow<any>[];
+}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "rows-selected": (rows: ResponsiveDataRow<any>[]) => void;
+    "mobile:bulk:click": (rows: ResponsiveDataRow<any>[]) => void;
+    "mobile:destructive:click": (rows: ResponsiveDataRow<any>[]) => void;
+    "mobile:selection:exit": () => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ElResponsiveTableProps>>> & {
+    "onRows-selected"?: ((rows: ResponsiveDataRow<any>[]) => any) | undefined;
+    "onMobile:bulk:click"?: ((rows: ResponsiveDataRow<any>[]) => any) | undefined;
+    "onMobile:destructive:click"?: ((rows: ResponsiveDataRow<any>[]) => any) | undefined;
+    "onMobile:selection:exit"?: (() => any) | undefined;
+}, {}, {}>, {
+    mobile?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/table/ElServerSideMobileTable.vue.d.ts

@@ -0,0 +1,48 @@
+import { DataControls } from './ElServerSideTable.vue';
+import { ElMobileTableProps, MobileTableFilter, MobileTableFiltersStatus, MobileTableRow } from './ElMobileTable.vue';
+
+export type MobileDataControls = Pick<DataControls, 'paginationStatus'> & {
+    triggeredEvent: 'paginate' | 'filter' | 'firstLoad';
+    filterStatus: MobileTableFiltersStatus;
+};
+export type ElServerSideMobileTableProps = Pick<ElMobileTableProps, 'selection' | 'color'> & {
+    filters?: {
+        freeSearch?: Omit<NonNullable<MobileTableFilter['freeSearch']>, 'filterOn'>;
+    } & Pick<MobileTableFilter, 'dateRange' | 'multiValue' | 'resetButton'>;
+    dataController: (args: MobileDataControls) => Promise<{
+        data: MobileTableRow[];
+        totalRows: number;
+    }>;
+};
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<ElServerSideMobileTableProps>, {
+    selectRows: (rowsIds: string[]) => void;
+    unselectAllRows: () => void | undefined;
+    getSelectedRows: () => MobileTableRow[];
+}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "bulk:click": (rows: MobileTableRow[]) => void;
+    "destructive:click": (rows: MobileTableRow[]) => void;
+    "selection:exit": () => void;
+    "rows-selected": (rows: MobileTableRow[]) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ElServerSideMobileTableProps>>> & {
+    "onRows-selected"?: ((rows: MobileTableRow[]) => any) | undefined;
+    "onDestructive:click"?: ((rows: MobileTableRow[]) => any) | undefined;
+    "onBulk:click"?: ((rows: MobileTableRow[]) => any) | undefined;
+    "onSelection:exit"?: (() => any) | undefined;
+}, {}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/table/ElServerSideResponsiveTable.vue.d.ts

@@ -0,0 +1,67 @@
+import { MobileTableFiltersStatus } from './ElMobileTable.vue';
+import { FilterType } from './commonTypes';
+import { default as ElInputSelect } from '../forms/ElInputSelect.vue';
+import { DataControls, TableColumn } from './ElServerSideTable.vue';
+import { ElResponsiveTableProps, ResponsiveTableColumn, ResponsiveDataRow } from './ElResponsiveTable.vue';
+
+export type ResponsiveServerSideTableColumn = Pick<TableColumn, 'title'> & {
+    desktopBehaviour?: Pick<TableColumn, 'alignRight' | 'noSort'>;
+    filter?: {
+        type: Exclude<FilterType, 'MULTI_VALUE'>;
+        placeholder?: string;
+    } | {
+        type: Extract<FilterType, 'MULTI_VALUE'>;
+        selectOptions: InstanceType<typeof ElInputSelect>['$props']['options'];
+        mobileBehaviour?: {
+            position?: 'mainText' | 'secondaryRow' | 'tertiaryRow' | 'amount' | 'time' | 'tags' | 'avatar';
+        };
+    } | {
+        type: 'RESET_FILTERS_BUTTON';
+    };
+} & Pick<ResponsiveTableColumn, 'mobileBehaviour'>;
+export type ResponsiveDataControls = Pick<DataControls, 'paginationStatus' | 'filterStatus' | 'triggeredEvent'> & ({
+    tableType: 'desktop';
+    sortStatus: DataControls['sortStatus'];
+} | {
+    tableType: 'mobile';
+    mobileFiltersStatus: MobileTableFiltersStatus;
+});
+export type ElServerSideResponsiveTableDataController = (args: ResponsiveDataControls) => Promise<{
+    data: ResponsiveDataRow[];
+    totalRows: number;
+}>;
+export type ElServerSideResponsiveTableProps = Pick<ElResponsiveTableProps, 'mobileBehaviour' | 'desktopBehaviour' | 'sortBy' | 'color' | 'rowsSelectionMode' | 'rowsSelectionDisabled'> & {
+    columns: ResponsiveServerSideTableColumn[];
+    dataController: ElServerSideResponsiveTableDataController;
+    rowsPerPage?: number;
+};
+declare function __VLS_template(): {
+    mobile?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<ElServerSideResponsiveTableProps>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "rows-selected": (rows: ResponsiveDataRow[]) => void;
+    "mobile:bulk:click": (rows: ResponsiveDataRow[]) => void;
+    "mobile:destructive:click": (rows: ResponsiveDataRow[]) => void;
+    "mobile:selection:exit": () => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ElServerSideResponsiveTableProps>>> & {
+    "onRows-selected"?: ((rows: ResponsiveDataRow[]) => any) | undefined;
+    "onMobile:bulk:click"?: ((rows: ResponsiveDataRow[]) => any) | undefined;
+    "onMobile:destructive:click"?: ((rows: ResponsiveDataRow[]) => any) | undefined;
+    "onMobile:selection:exit"?: (() => any) | undefined;
+}, {}, {}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/table/ElServerSideTable.vue.d.ts

@@ -46,11 +46,15 @@ export interface ServerSideTableProps {
         totalRows: number;
     }>;
 }
-type FilterStatus = {
+export type FilterStatus = TextFilterStatus | DateFilterStatus;
+export type TextFilterStatus = {
     textSearch: string;
+    columnTitle: string;
     type: Extract<FilterType, 'FREE_SEARCH' | 'MULTI_VALUE'>;
-} | {
+};
+export type DateFilterStatus = {
     dateFrom: number;
+    columnTitle: string;
     type: Extract<FilterType, 'DATE_RANGE'>;
 };
 declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ServerSideTableProps>, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@davincihealthcare/elty-design-system-vue",
-  "version": "1.49.1",
+  "version": "1.50.1",
   "license": "UNLICENSED",
   "main": "dist/index.umd.cjs",
   "types": "dist/index.d.ts",