@zeedhi/vuetify 1.92.0 → 1.93.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeedhi/vuetify",
-  "version": "1.92.0",
+  "version": "1.93.1",
   "description": "Zeedhi Components based on Vuetify",
   "author": "Zeedhi <zeedhi@teknisa.com>",
   "license": "ISC",
@@ -51,5 +51,5 @@
     "@types/prismjs": "1.26.*",
     "@types/sortablejs": "1.15.*"
   },
-  "gitHead": "9cfbaa72ac85f6fbae10cb532c3957905333e543"
+  "gitHead": "65fc7d4e60ddd637d29cb7fa5d5714d73567e413"
 }

package/types/components/public.d.ts

@@ -35,8 +35,10 @@ import ZdGridAction from './zd-grid/subcomponents/cell/ZdGridAction';
 import ZdGridCell from './zd-grid/subcomponents/cell/ZdGridCell';
 import ZdGridCellContent from './zd-grid/subcomponents/cell/ZdGridCellContent';
 import ZdGridCellEdit from './zd-grid/subcomponents/cell/ZdGridCellEdit';
+import ZdGridEditableCell from './zd-grid/subcomponents/cell/ZdGridEditableCell';
 import ZdGridEditableCellContent from './zd-grid/subcomponents/cell/ZdGridEditableCellContent';
 import ZdGridRow from './zd-grid/subcomponents/cell/ZdGridRow';
+import ZdGridCheckbox from './zd-grid/subcomponents/cell/ZdGridCheckbox';
 import ZdTreeGridCellContent from './zd-tree-grid/cell/ZdTreeGridCellContent';
 import ZdGridEditable from './zd-grid/ZdGridEditable';
 import ZdHeader from './zd-header/ZdHeader';
@@ -91,4 +93,4 @@ import ZdTooltip from './zd-tooltip/ZdTooltip';
 import ZdTree from './zd-tree/ZdTree';
 import ZdTreeGrid from './zd-tree-grid/ZdTreeGrid';
 import ZdTreeGridEditable from './zd-tree-grid/ZdTreeGridEditable';
-export { ZdAlert, ZdApexChart, ZdBadge, ZdBreadcrumbs, ZdButton, ZdButtonGroup, ZdCard, ZdCarousel, ZdCheckbox, ZdCheckboxMultiple, ZdChip, ZdCodeEditor, ZdCol, ZdCollapseCard, ZdComponent, ZdComponentRender, ZdContainer, ZdCurrency, ZdDashboard, ZdDate, ZdDateRange, ZdDialog, ZdDivider, ZdDropdown, ZdFileInput, ZdFooter, ZdForm, ZdFrame, ZdFramePage, ZdGrid, ZdGridFooter, ZdGridEditable, ZdIterableNoData, ZdGridTop, ZdGridAction, ZdGridCell, ZdGridCellContent, ZdGridCellEdit, ZdGridEditableCellContent, ZdGridRow, ZdTreeGridCellContent, ZdHeader, ZdImage, ZdIncrement, ZdInput, ZdIterable, ZdIterableComponentRender, ZdIterableColumnsButton, ZdIterablePagination, ZdIterablePageSize, ZdIterablePageInfo, ZdList, ZdListItem, ZdListGroup, ZdLoading, ZdLogin, ZdLoginButton, ZdMasterDetail, ZdMenu, ZdMenuLink, ZdMenuGroup, ZdMenuButton, ZdMenuSeparator, ZdModal, ZdModalCloseButton, ZdMonth, ZdNumber, ZdPassword, ZdProgress, ZdRadio, ZdRangeSlider, ZdRow, ZdSearch, ZdSelectableList, ZdSelect, ZdSelectTree, ZdSelectTreeMultiple, ZdSpeedDial, ZdSteppers, ZdSvgMap, ZdSwitch, ZdTable, ZdTabs, ZdTag, ZdText, ZdTextarea, ZdTextInput, ZdTime, ZdToggleable, ZdTooltip, ZdTree, ZdTreeGrid, ZdTreeGridEditable, };
+export { ZdAlert, ZdApexChart, ZdBadge, ZdBreadcrumbs, ZdButton, ZdButtonGroup, ZdCard, ZdCarousel, ZdCheckbox, ZdCheckboxMultiple, ZdChip, ZdCodeEditor, ZdCol, ZdCollapseCard, ZdComponent, ZdComponentRender, ZdContainer, ZdCurrency, ZdDashboard, ZdDate, ZdDateRange, ZdDialog, ZdDivider, ZdDropdown, ZdFileInput, ZdFooter, ZdForm, ZdFrame, ZdFramePage, ZdGrid, ZdGridFooter, ZdGridEditable, ZdIterableNoData, ZdGridTop, ZdGridAction, ZdGridCell, ZdGridCellContent, ZdGridCellEdit, ZdGridEditableCell, ZdGridEditableCellContent, ZdGridRow, ZdGridCheckbox, ZdTreeGridCellContent, ZdHeader, ZdImage, ZdIncrement, ZdInput, ZdIterable, ZdIterableComponentRender, ZdIterableColumnsButton, ZdIterablePagination, ZdIterablePageSize, ZdIterablePageInfo, ZdList, ZdListItem, ZdListGroup, ZdLoading, ZdLogin, ZdLoginButton, ZdMasterDetail, ZdMenu, ZdMenuLink, ZdMenuGroup, ZdMenuButton, ZdMenuSeparator, ZdModal, ZdModalCloseButton, ZdMonth, ZdNumber, ZdPassword, ZdProgress, ZdRadio, ZdRangeSlider, ZdRow, ZdSearch, ZdSelectableList, ZdSelect, ZdSelectTree, ZdSelectTreeMultiple, ZdSpeedDial, ZdSteppers, ZdSvgMap, ZdSwitch, ZdTable, ZdTabs, ZdTag, ZdText, ZdTextarea, ZdTextInput, ZdTime, ZdToggleable, ZdTooltip, ZdTree, ZdTreeGrid, ZdTreeGridEditable, };

package/types/components/zd-grid/ZdGrid.d.ts

@@ -29,6 +29,7 @@ export default class ZdGrid extends ZdIterable {
     showSelectAll: boolean | string;
     selectAllPages: boolean | string;
     toolbarSlot: IComponentRender[];
+    cellSelection: boolean | string;
     instance: Grid;
     instanceType: typeof Grid;
     /**
@@ -40,7 +41,7 @@ export default class ZdGrid extends ZdIterable {
     change(value: any): void;
     changeColumns(): void;
     changeLoading(value: boolean): void;
-    get allselectedState(): 1 | 0 | 2;
+    get allselectedState(): 0 | 1 | 2;
     /**
      * Left distance for each column
      */
@@ -82,6 +83,7 @@ export default class ZdGrid extends ZdIterable {
     }): void;
     selectAllClick(isSelected: boolean, event: Event): void;
     cellClick(row: IDictionary<any>, column: GridColumn, event: Event): void;
+    cellFocus(row: IDictionary<any>, column: GridColumn): void;
     isCurrentRow(row: IDictionary<any>): boolean;
     changeData(): void;
     protected calcScrollData(): void;

package/types/components/zd-grid/ZdGridEditable.d.ts

@@ -18,13 +18,9 @@ export default class ZdGridEditable extends ZdGrid {
     instance: GridEditable;
     instanceType: typeof GridEditable;
     isTrVisible: boolean;
-    private navigationKeyMapping;
     getColWidth(col: Column): boolean;
     protected registerOnVisible(): void;
     mounted(): void;
-    beforeDestroy(): void;
-    private navigateUp;
-    private navigateDown;
     hasToggleIcon(column: Column, row: IDictionary<any>): boolean;
     getWidthStyle(column: Column): IColumnWidths;
 }

package/types/components/zd-grid/ZdGridFooter.d.ts

@@ -0,0 +1,6 @@
+import { IComponentRender } from '@zeedhi/common';
+import Vue from 'vue';
+export default class ZdGridFooter extends Vue {
+    footerSlot: IComponentRender[];
+    instance: any;
+}

package/types/components/zd-grid/ZdGridNoData.d.ts

@@ -0,0 +1,8 @@
+import { IComponentRender } from '@zeedhi/common';
+import Vue from 'vue';
+export default class ZdGridNoData extends Vue {
+    errorSlot: IComponentRender[];
+    noDataSlot: IComponentRender[];
+    noResultSlot: IComponentRender[];
+    instance: any;
+}

package/types/components/zd-grid/ZdGridTop.d.ts

@@ -0,0 +1,6 @@
+import { IComponentRender } from '@zeedhi/common';
+import Vue from 'vue';
+export default class ZdGridTop extends Vue {
+    toolbarSlot: IComponentRender[];
+    instance: any;
+}

package/types/components/zd-grid/subcomponents/cell/ZdGridAction.d.ts

@@ -11,4 +11,5 @@ export default class ZdGridAction extends Vue {
     rowKey: string | number;
     actions: ComponentRender[];
     change(): void;
+    focusin(event: FocusEvent): void;
 }

package/types/components/zd-grid/subcomponents/cell/ZdGridCell.d.ts

@@ -10,6 +10,11 @@ export default class ZdGridCell extends Vue {
     cellsApplied?: IDictionary<any>;
     cellClass?: (IDictionary<boolean> | string)[];
     cellStyle?: IDictionary[];
+    cellSelection?: boolean;
+    isCurrent: boolean;
+    get tabindex(): 0 | "";
+    focusin(event: FocusEvent): void;
+    focusout(event: FocusEvent): void;
     click(event: Event): void;
     get cellProps(): {};
 }

package/types/components/zd-grid/subcomponents/cell/ZdGridCellContent.d.ts

@@ -15,6 +15,7 @@ export default class ZdGridCellContent extends Vue {
     visibleValue: any;
     mouseenter(event: Event): void;
     mouseleave(event: Event): void;
+    focus(event: Event): void;
     get cellProps(): {
         [x: string]: any;
     };

package/types/components/zd-grid/subcomponents/cell/ZdGridCheckbox.d.ts

@@ -0,0 +1,16 @@
+import Vue from 'vue';
+/**
+ * Grid cell component
+ */
+export default class ZdGridCheckbox extends Vue {
+    cellSelection?: boolean;
+    selectable?: boolean;
+    disabled?: boolean;
+    isSelected?: boolean;
+    indeterminate?: boolean;
+    theme?: string;
+    isCurrent: boolean;
+    focusin(event: FocusEvent): void;
+    focusout(event: FocusEvent): void;
+    click(event: Event): void;
+}

package/types/components/zd-grid/subcomponents/cell/ZdGridEditableCell.d.ts

@@ -0,0 +1,53 @@
+import { Column } from '@zeedhi/common';
+import { IDictionary } from '@zeedhi/core';
+import ZdGridCell from './ZdGridCell';
+/**
+ * Grid editable cell component
+ */
+export default class ZdGridEditableCell extends ZdGridCell {
+    column: Column;
+    rowStyle?: IDictionary<any>;
+    cellsApplied?: IDictionary<any>;
+    row: IDictionary<any>;
+    rowKey: string | number;
+    getEditableComponent: Function;
+    getWidthStyle: Function;
+    hasToggleIcon: Function;
+    getVisibleValue: Function;
+    isEdited: Function;
+    isValid: Function;
+    register: Function;
+    isCellEditable: Function;
+    canEdit: boolean;
+    cssClass: (IDictionary<boolean> | string)[];
+    cellSelection: boolean;
+    get cellProps(): {};
+    get editable(): any;
+    get tabindex(): 0 | "";
+    component: any;
+    updateComponent(): void;
+    visibleValue: null;
+    getNewVisibleValue(): any;
+    updateVisibleValue(): void;
+    edited: boolean;
+    updateEdited(): void;
+    valid: boolean;
+    updateValid(): void;
+    get id(): string;
+    registerComponent(): void;
+    mounted(): void;
+    /**
+     * Forces the component to update
+     * this is needed to avoid reactivity to crosstab editedRows,
+     * which can cause unnecessary rerenders
+     */
+    forceUpdate(): void;
+    rowChange(): void;
+    editing: boolean;
+    enterEdit(event?: Event): void;
+    leaveEdit(): void;
+    click(event: Event): void;
+    focus(event: Event): void;
+    focusInput(): void;
+    keydown(event: KeyboardEvent): void;
+}

package/types/components/zd-grid/subcomponents/cell/ZdGridEditableCellContent.d.ts

@@ -20,6 +20,7 @@ export default class ZdGridEditableCellContent extends Vue {
     isCellEditable: Function;
     canEdit: boolean;
     cssClass: (IDictionary<boolean> | string)[];
+    cellSelection: boolean;
     get cellProps(): {};
     get editable(): any;
     get tabindex(): 0 | -1;

package/types/components/zd-iterable/ZdIterableColumnsButton.d.ts

@@ -0,0 +1,23 @@
+import { IterableColumnsButton } from '@zeedhi/common';
+import ZdButton from '../zd-button/ZdButton.vue';
+/**
+ * Iterable Columns Button component
+ */
+export default class ZdIterableColumnsButton extends ZdButton {
+    iterableComponentName: string;
+    iconName: string;
+    icon: boolean | string;
+    instance: IterableColumnsButton;
+    instanceType: typeof IterableColumnsButton;
+    getEvents(on: any): {
+        [x: string]: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        blur?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        click?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        focus?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        onCreated?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        onBeforeMount?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        onMounted?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        onBeforeDestroy?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+        onDestroyed?: string | import("@zeedhi/core").IEvent<import("@zeedhi/common").IButtonEvent> | undefined;
+    };
+}

package/types/components/zd-iterable/ZdIterablePageInfo.d.ts

@@ -0,0 +1,9 @@
+import { IterablePageInfo } from '@zeedhi/common';
+import ZdIterablePageComponent from './ZdIterablePageComponent';
+/**
+ * Iterable page info component
+ */
+export default class ZdIterablePageInfo extends ZdIterablePageComponent {
+    instance: IterablePageInfo;
+    instanceType: typeof IterablePageInfo;
+}

package/types/components/zd-iterable/ZdIterablePageSize.d.ts

@@ -0,0 +1,20 @@
+import { IDictionary } from '@zeedhi/core';
+import { IterablePageSize } from '@zeedhi/common';
+import ZdSelect from '../zd-select/ZdSelect.vue';
+/**
+ * Iterable page size component
+ */
+export default class ZdIterablePageSize extends ZdSelect {
+    iterableComponentName: string;
+    clearable: boolean | string;
+    dataText: string | string[];
+    dataValue: string;
+    dense: boolean | string;
+    autocomplete: boolean | string;
+    showHelper: boolean | string;
+    showLabel: boolean | string;
+    validations: IDictionary<IDictionary<string | number>>;
+    instance: IterablePageSize;
+    instanceType: typeof IterablePageSize;
+    mounted(): void;
+}

package/types/components/zd-iterable/ZdIterablePagination.d.ts

@@ -0,0 +1,35 @@
+import { IterablePagination } from '@zeedhi/common';
+import ZdIterablePageComponent from './ZdIterablePageComponent';
+/**
+ * Iterable pagination component
+ */
+export default class ZdIterablePagination extends ZdIterablePageComponent {
+    circle: boolean;
+    maxButtons?: number;
+    nextIcon: string;
+    prevIcon: string;
+    instance: IterablePagination;
+    instanceType: typeof IterablePagination;
+    private lastLength?;
+    private element;
+    private paginationComponent;
+    mounted(): void;
+    private initRefs;
+    /**
+     * Vuetify doesn't wait for nextTick to calculate maxButtons when resizing,
+     * so we have to refresh it
+     */
+    private refreshMaxButtons;
+    private updateIterableEvent;
+    /**
+     * Fix maxButtons when pagination is not visible initially
+     */
+    private initMaxButtons;
+    private lengthChange;
+    growPagination(): void;
+    /**
+     * Approach to "width: auto + 17px", because vuetify pagination requires parent element
+     * to have 17px of extra width relative to children to calculate the number of buttons displayed
+     */
+    updateWidth(): void;
+}

package/types/components/zd-iterable/ZdSearch.d.ts

@@ -0,0 +1,16 @@
+import { Search } from '@zeedhi/common';
+import ZdTextInput from '../zd-text-input/ZdTextInput.vue';
+/**
+ * Search component
+ */
+export default class ZdSearch extends ZdTextInput {
+    iterableComponentName: string;
+    showLabel: string;
+    showHelper: string;
+    appendIcon: string;
+    placeholder: string;
+    cssClass: string;
+    instance: Search;
+    instanceType: typeof Search;
+    getSearchValue(): string;
+}

package/types/components/zd-tree-grid/ZdTreeGridEditable.d.ts

@@ -13,13 +13,9 @@ export default class ZdTreeGridEditable extends ZdTreeGrid {
     instance: TreeGridEditable;
     instanceType: typeof TreeGridEditable;
     isTrVisible: boolean;
-    private navigationKeyMapping;
     getColWidth(col: Column): boolean;
     private registerOnVisible;
     mounted(): void;
-    beforeDestroy(): void;
-    private navigateUp;
-    private navigateDown;
     hasToggleIcon(column: Column, row: IDictionary<any>): boolean;
     getWidthStyle(column: Column): IColumnWidths;
 }

package/types/mixins/editable-mixin/EditableMixin.d.ts

@@ -1,5 +1,5 @@
 import Vue from 'vue';
-import { GridColumnEditable, GridEditable, IGridColumnEditable } from '@zeedhi/common';
+import { GridColumn, GridColumnEditable, GridEditable, IGridColumnEditable } from '@zeedhi/common';
 import { IDictionary } from '@zeedhi/core';
 interface IUpdatableComponent {
     forceUpdate: () => void;
@@ -8,6 +8,10 @@ interface IUpdatableComponent {
     registerComponent: () => void;
     focusInput: () => void;
 }
+interface ICellEvent {
+    event: Event;
+    component: IUpdatableComponent;
+}
 export default class EditableMixin extends Vue {
     instance: GridEditable;
     rowKey: Function;
@@ -59,18 +63,10 @@ export default class EditableMixin extends Vue {
     };
     cellClick(row: IDictionary<any>, column: GridColumnEditable, event: Event, canEdit?: boolean, componentId?: string): void;
     callCellClick(row: IDictionary<any>, column: GridColumnEditable, event: Event, canEdit: boolean, componentId: string): void;
-    cellFocus(component: IUpdatableComponent, id: string): void;
+    editableCellFocus(component: IUpdatableComponent, id: string, row: IDictionary<any>, column: GridColumn): void;
     getVisibleValue(row: IDictionary, column: GridColumnEditable): any;
-    /**
-     * Focus an element or its first focusable children
-     * @param element element to be focused
-     */
-    focusElement(element?: HTMLElement | null): void;
-    private getTdNode;
-    private getArrayFromElementTag;
-    private getArrayFromTdElement;
-    private getArrayFromTrElement;
-    private findNextTd;
-    navigate(up: boolean): void;
+    cellFocus(row: IDictionary<any>, column: GridColumn): void;
+    fieldFocusout({ event, component }: ICellEvent): void;
+    enterEditEvent(row: IDictionary, column: GridColumnEditable, event: Event): void;
 }
 export {};

package/types/mixins/index.d.ts

@@ -1,2 +1,3 @@
 import EditableMixin from './editable-mixin/EditableMixin';
-export { EditableMixin, };
+import NavigableTableMixin from './navigable-table-mixin/NavigableTableMixin';
+export { EditableMixin, NavigableTableMixin, };

package/types/mixins/navigable-table-mixin/NavigableTableMixin.d.ts

@@ -0,0 +1,26 @@
+import Vue from 'vue';
+import { Grid } from '@zeedhi/common';
+/**
+ * Mixin for tabular components that can be navigated using keyboard keys,
+ * Grids in general
+ */
+export default class NavigableTableMixin extends Vue {
+    instance: Grid;
+    mounted(): void;
+    private viewNavigate;
+    private navigateRight;
+    private navigateLeft;
+    private isElementVisible;
+    focusableSelector: string;
+    /**
+     * Focus an element or its first focusable children
+     * @param element element to be focused
+     */
+    focusElement(element?: HTMLElement | null): void;
+    private getTdNode;
+    private getArrayFromElementTag;
+    private getArrayFromTdElement;
+    private getArrayFromTrElement;
+    private findNextTd;
+    navigateVertical(up: boolean): void;
+}

package/types/utils/getIconPlugin.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (name: string) => string;
+export default _default;

package/types/utils/plugins/index.d.ts

@@ -6,4 +6,5 @@ import isDarkPlugin from './isDarkPlugin';
 import isLightPlugin from './isLightPlugin';
 import styleObjectPlugin from './styleObjectPlugin';
 import onVisiblePlugin from './onVisiblePlugin';
-export { getIconPlugin, formatSizePlugin, doubleClickPlugin, isMobilePlugin, onVisiblePlugin, isDarkPlugin, isLightPlugin, styleObjectPlugin, };
+import solidColorPlugin from './solidColorPlugin';
+export { getIconPlugin, formatSizePlugin, doubleClickPlugin, isMobilePlugin, onVisiblePlugin, isDarkPlugin, isLightPlugin, styleObjectPlugin, solidColorPlugin, };

package/types/utils/plugins/solidColorPlugin.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (foregroundHex: string, opacity: number, backgroundHex: string) => string;
+export default _default;