@coreui/vue-pro 4.3.0-beta.0 → 4.3.0-beta.1

package/README.md

@@ -43,7 +43,7 @@
 
 Several quick start options are available:
 
-- [Download the latest release](https://github.com/coreui/coreui-vue-pro/archive/v4.3.0-beta.0.zip)
+- [Download the latest release](https://github.com/coreui/coreui-vue-pro/archive/v4.3.0-beta.1.zip)
 - Clone the repo: `git clone https://github.com/coreui/coreui-vue-pro.git`
 - Install with [npm](https://www.npmjs.com/): `npm install @coreui/vue-pro`
 - Install with [yarn](https://yarnpkg.com/): `yarn add @coreui/vue-pro`

package/dist/components/smart-table/CSmartTable.d.ts

@@ -3,8 +3,6 @@ import { Column, ColumnFilter, ColumnFilterValue, Item, ItemsPerPageSelect, Sort
 declare const CSmartTable: import("vue").DefineComponent<{
     /**
      * Sets active page. If 'pagination' prop is enabled, activePage is set only initially.
-     *
-     * @default 1
      */
     activePage: {
         type: NumberConstructor;
@@ -13,7 +11,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * When set, displays table cleaner above table, next to the table filter (or in place of table filter if `tableFilter` prop is not set)
-     * Cleaner resets `tableFilterValue`, `columnFilterValue`, `sorterValue`. If clean is possible it is clickable (`tabIndex="0"` `role="button"`, `color="danger"`), otherwise it is not clickable and transparent. Cleaner can be customized through the `cleaner` slot.
+     * Cleaner resets `tableFilterValue`, `columnFilterValue`, `sorterValue`. If clean is possible it is clickable (`tabIndex="0"` `role="button"`, `color="danger"`), otherwise it is not clickable and transparent. Cleaner can be customized through the `cleanerIcon` slot.
      *
      */
     cleaner: {
@@ -22,8 +20,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Style table items as clickable.
-     *
-     * @type boolean
      */
     clickableRows: {
         type: BooleanConstructor;
@@ -34,8 +30,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
      * Column filter can be customized, by passing prop as object with additional options as keys. Available options:
      * - external (Boolean) - Disables automatic filtering inside component.
      * - lazy (Boolean) - Set to true to trigger filter updates only on change event.
-     *
-     * @type boolean | ColumnFilter
      */
     columnFilter: {
         type: PropType<boolean | ColumnFilter>;
@@ -44,7 +38,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     /**
      * Value of table filter. To set pass object where keys are column names and values are filter strings e.g.:
      * { user: 'John', age: 12 }
-     * You can track state of this prop by setting .sync modifier.
      */
     columnFilterValue: {
         type: PropType<ColumnFilterValue>;
@@ -52,17 +45,17 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_classes')
+     * Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_props')
      *
      * In columns prop each array item represents one column. Item might be specified in two ways:
      * String: each item define column name equal to item value.
      * Object: item is object with following keys available as column configuration:
      * - key (required)(String) - define column name equal to item key.
+     * - filter (Boolean) - removes filter from column when set to false.
      * - label (String) - define visible label of column. If not defined, label will be generated automatically based on column name, by converting kebab-case and snake_case to individual words and capitalization of each word.
-     * - _classes (String/Array/Object) - adds classes to all cels in column
-     * - _style (String/Array/Object) - adds styles to the column header (useful for defining widths)
      * - sorter (Boolean) - disables sorting of the column when set to false
-     * - filter (Boolean) - removes filter from column when set to false.
+     * - [_props](https://coreui.io/vue/docs/components/table.html#ctableheadercell) (String/Array/Object) - add props to `CTableHeaderCell`.
+     * - _style (String/Array/Object) - adds styles to the column header (useful for defining widths)
      */
     columns: {
         type: PropType<string[] | Column[]>;
@@ -74,8 +67,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
      * Sorter can be customized, by passing prop as object with additional options as keys. Available options:
      * - external (Boolean) - Disables automatic sorting inside component.
      * - resetable (Boolean) - If set to true clicking on sorter have three states: ascending, descending and null. That means that third click on sorter will reset sorting, and restore table to original order.
-     *
-     * @type boolean | Sorter
      */
     columnSorter: {
         type: PropType<boolean | Sorter>;
@@ -91,8 +82,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Set to false to remove table header.
-     *
-     * @default true
      */
     header: {
         type: BooleanConstructor;
@@ -100,7 +89,11 @@ declare const CSmartTable: import("vue").DefineComponent<{
         default: boolean;
     };
     /**
-     * Array of objects, where each object represents one item - row in table. Additionally, you can add style classes to each row by passing them by '_classes' key and to single cell by '_cellClasses'.
+     * Array of objects, where each object represents one item - row in table. Additionally, you can customize each row by passing them by [_props](http://coreui.io/vue/docs/components/table.html#ctablerow) key and single cell by [_cellProps](http://coreui.io/vue/docs/components/table.html#ctabledatacell).
+     *
+     * Examples:
+     * - `_props: { color: 'primary', align: 'middle'}`
+     * - `_cellProps: { all: { class: 'fw-semibold'}, 'name': { color: 'info' }}`
      */
     items: {
         type: PropType<Item[]>;
@@ -109,8 +102,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Number of items per site, when pagination is enabled.
-     *
-     * @default 10
      */
     itemsPerPage: {
         type: NumberConstructor;
@@ -118,8 +109,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Label for items per page selector.
-     *
-     * @default 'Items per page:'
      */
     itemsPerPageLabel: {
         type: StringConstructor;
@@ -128,8 +117,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Items per page selector options.
-     *
-     * @default [5, 10, 20, 50]
      */
     itemsPerPageOptions: {
         type: PropType<number[]>;
@@ -156,7 +143,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * ReactNode or string for passing custom noItemsLabel texts.
-     * @default 'No items found'
      */
     noItemsLabel: {
         type: StringConstructor;
@@ -171,9 +157,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CSmartPagination` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/smart-pagination#csmartpagination
+     * Properties to [CSmartPagination](https://coreui.io/vue/docs/components/smart-pagination#csmartpagination) component.
      */
     paginationProps: {
         type: ObjectConstructor;
@@ -185,10 +169,8 @@ declare const CSmartTable: import("vue").DefineComponent<{
      */
     selectable: BooleanConstructor;
     /**
-     * State of the sorter. Name key is column name, direction can be 'asc' or 'desc'. Set .sync modifier to track changes. eg.:
+     * State of the sorter. Name key is column name, direction can be 'asc' or 'desc'. eg.:
      * { column: 'status', state: 'asc' }
-     *
-     * @type SorterValue
      */
     sorterValue: {
         type: PropType<SorterValue>;
@@ -196,9 +178,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTableBody` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctablebody
+     * Properties to [CTableBody](https://coreui.io/vue/docs/components/table/#ctablebody) component.
      */
     tableBodyProps: {
         type: ObjectConstructor;
@@ -206,9 +186,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTableFoot` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctablefoot
+     * Properties to [CTableFoot](https://coreui.io/vue/docs/components/table/#ctablefoot) component.
      */
     tableFootProps: {
         type: ObjectConstructor;
@@ -219,8 +197,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
      * When set, displays table filter above table, allowing filtering by specific column.
      *
      * Column filter can be customized, by passing prop as object with additional options as keys. Available options:
-     * - placeholder (String) - Sets custom table filter placeholder.
-     * - label (String) - Sets custom table filter label.
      * - external (Boolean) - Disables automatic filtering inside component.
      * - lazy (Boolean) - Set to true to trigger filter updates only on change event.
      */
@@ -238,8 +214,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Specifies a short hint that is visible in the search input.
-     *
-     * @default 'type string...'
      */
     tableFilterPlaceholder: {
         type: StringConstructor;
@@ -247,9 +221,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Value of table filter. Set .sync modifier to track changes.
-     *
-     * @default 'Filter:'
+     * Value of table filter.
      */
     tableFilterValue: {
         type: StringConstructor;
@@ -257,9 +229,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTableHead` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctablehead
+     * Properties to [CTableHead](https://coreui.io/vue/docs/components/table/#ctablehead) component.
      */
     tableHeadProps: {
         type: ObjectConstructor;
@@ -267,9 +237,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTable` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctable
+     * Properties to [CTable](https://coreui.io/vue/docs/components/table/#ctable) component.
      */
     tableProps: {
         type: ObjectConstructor;
@@ -281,8 +249,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
 }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("activePageChange" | "rowClick" | "columnFilterChange" | "filteredItemsChange" | "itemsPerPageChange" | "selectedItemsChange" | "sorterChange" | "tableFilterChange")[], "activePageChange" | "rowClick" | "columnFilterChange" | "filteredItemsChange" | "itemsPerPageChange" | "selectedItemsChange" | "sorterChange" | "tableFilterChange", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Sets active page. If 'pagination' prop is enabled, activePage is set only initially.
-     *
-     * @default 1
      */
     activePage: {
         type: NumberConstructor;
@@ -291,7 +257,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * When set, displays table cleaner above table, next to the table filter (or in place of table filter if `tableFilter` prop is not set)
-     * Cleaner resets `tableFilterValue`, `columnFilterValue`, `sorterValue`. If clean is possible it is clickable (`tabIndex="0"` `role="button"`, `color="danger"`), otherwise it is not clickable and transparent. Cleaner can be customized through the `cleaner` slot.
+     * Cleaner resets `tableFilterValue`, `columnFilterValue`, `sorterValue`. If clean is possible it is clickable (`tabIndex="0"` `role="button"`, `color="danger"`), otherwise it is not clickable and transparent. Cleaner can be customized through the `cleanerIcon` slot.
      *
      */
     cleaner: {
@@ -300,8 +266,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Style table items as clickable.
-     *
-     * @type boolean
      */
     clickableRows: {
         type: BooleanConstructor;
@@ -312,8 +276,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
      * Column filter can be customized, by passing prop as object with additional options as keys. Available options:
      * - external (Boolean) - Disables automatic filtering inside component.
      * - lazy (Boolean) - Set to true to trigger filter updates only on change event.
-     *
-     * @type boolean | ColumnFilter
      */
     columnFilter: {
         type: PropType<boolean | ColumnFilter>;
@@ -322,7 +284,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     /**
      * Value of table filter. To set pass object where keys are column names and values are filter strings e.g.:
      * { user: 'John', age: 12 }
-     * You can track state of this prop by setting .sync modifier.
      */
     columnFilterValue: {
         type: PropType<ColumnFilterValue>;
@@ -330,17 +291,17 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_classes')
+     * Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_props')
      *
      * In columns prop each array item represents one column. Item might be specified in two ways:
      * String: each item define column name equal to item value.
      * Object: item is object with following keys available as column configuration:
      * - key (required)(String) - define column name equal to item key.
+     * - filter (Boolean) - removes filter from column when set to false.
      * - label (String) - define visible label of column. If not defined, label will be generated automatically based on column name, by converting kebab-case and snake_case to individual words and capitalization of each word.
-     * - _classes (String/Array/Object) - adds classes to all cels in column
-     * - _style (String/Array/Object) - adds styles to the column header (useful for defining widths)
      * - sorter (Boolean) - disables sorting of the column when set to false
-     * - filter (Boolean) - removes filter from column when set to false.
+     * - [_props](https://coreui.io/vue/docs/components/table.html#ctableheadercell) (String/Array/Object) - add props to `CTableHeaderCell`.
+     * - _style (String/Array/Object) - adds styles to the column header (useful for defining widths)
      */
     columns: {
         type: PropType<string[] | Column[]>;
@@ -352,8 +313,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
      * Sorter can be customized, by passing prop as object with additional options as keys. Available options:
      * - external (Boolean) - Disables automatic sorting inside component.
      * - resetable (Boolean) - If set to true clicking on sorter have three states: ascending, descending and null. That means that third click on sorter will reset sorting, and restore table to original order.
-     *
-     * @type boolean | Sorter
      */
     columnSorter: {
         type: PropType<boolean | Sorter>;
@@ -369,8 +328,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Set to false to remove table header.
-     *
-     * @default true
      */
     header: {
         type: BooleanConstructor;
@@ -378,7 +335,11 @@ declare const CSmartTable: import("vue").DefineComponent<{
         default: boolean;
     };
     /**
-     * Array of objects, where each object represents one item - row in table. Additionally, you can add style classes to each row by passing them by '_classes' key and to single cell by '_cellClasses'.
+     * Array of objects, where each object represents one item - row in table. Additionally, you can customize each row by passing them by [_props](http://coreui.io/vue/docs/components/table.html#ctablerow) key and single cell by [_cellProps](http://coreui.io/vue/docs/components/table.html#ctabledatacell).
+     *
+     * Examples:
+     * - `_props: { color: 'primary', align: 'middle'}`
+     * - `_cellProps: { all: { class: 'fw-semibold'}, 'name': { color: 'info' }}`
      */
     items: {
         type: PropType<Item[]>;
@@ -387,8 +348,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Number of items per site, when pagination is enabled.
-     *
-     * @default 10
      */
     itemsPerPage: {
         type: NumberConstructor;
@@ -396,8 +355,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Label for items per page selector.
-     *
-     * @default 'Items per page:'
      */
     itemsPerPageLabel: {
         type: StringConstructor;
@@ -406,8 +363,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Items per page selector options.
-     *
-     * @default [5, 10, 20, 50]
      */
     itemsPerPageOptions: {
         type: PropType<number[]>;
@@ -434,7 +389,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * ReactNode or string for passing custom noItemsLabel texts.
-     * @default 'No items found'
      */
     noItemsLabel: {
         type: StringConstructor;
@@ -449,9 +403,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CSmartPagination` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/smart-pagination#csmartpagination
+     * Properties to [CSmartPagination](https://coreui.io/vue/docs/components/smart-pagination#csmartpagination) component.
      */
     paginationProps: {
         type: ObjectConstructor;
@@ -463,10 +415,8 @@ declare const CSmartTable: import("vue").DefineComponent<{
      */
     selectable: BooleanConstructor;
     /**
-     * State of the sorter. Name key is column name, direction can be 'asc' or 'desc'. Set .sync modifier to track changes. eg.:
+     * State of the sorter. Name key is column name, direction can be 'asc' or 'desc'. eg.:
      * { column: 'status', state: 'asc' }
-     *
-     * @type SorterValue
      */
     sorterValue: {
         type: PropType<SorterValue>;
@@ -474,9 +424,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTableBody` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctablebody
+     * Properties to [CTableBody](https://coreui.io/vue/docs/components/table/#ctablebody) component.
      */
     tableBodyProps: {
         type: ObjectConstructor;
@@ -484,9 +432,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTableFoot` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctablefoot
+     * Properties to [CTableFoot](https://coreui.io/vue/docs/components/table/#ctablefoot) component.
      */
     tableFootProps: {
         type: ObjectConstructor;
@@ -497,8 +443,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
      * When set, displays table filter above table, allowing filtering by specific column.
      *
      * Column filter can be customized, by passing prop as object with additional options as keys. Available options:
-     * - placeholder (String) - Sets custom table filter placeholder.
-     * - label (String) - Sets custom table filter label.
      * - external (Boolean) - Disables automatic filtering inside component.
      * - lazy (Boolean) - Set to true to trigger filter updates only on change event.
      */
@@ -516,8 +460,6 @@ declare const CSmartTable: import("vue").DefineComponent<{
     };
     /**
      * Specifies a short hint that is visible in the search input.
-     *
-     * @default 'type string...'
      */
     tableFilterPlaceholder: {
         type: StringConstructor;
@@ -525,9 +467,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Value of table filter. Set .sync modifier to track changes.
-     *
-     * @default 'Filter:'
+     * Value of table filter.
      */
     tableFilterValue: {
         type: StringConstructor;
@@ -535,9 +475,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTableHead` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctablehead
+     * Properties to [CTableHead](https://coreui.io/vue/docs/components/table/#ctablehead) component.
      */
     tableHeadProps: {
         type: ObjectConstructor;
@@ -545,9 +483,7 @@ declare const CSmartTable: import("vue").DefineComponent<{
         required: false;
     };
     /**
-     * Properties to `CTable` component.
-     *
-     * @link https://coreui.io/vue/docs/4.0/components/table/#ctable
+     * Properties to [CTable](https://coreui.io/vue/docs/components/table/#ctable) component.
      */
     tableProps: {
         type: ObjectConstructor;

package/dist/components/smart-table/CSmartTableInterface.d.ts

@@ -2,10 +2,10 @@
  * @ignore
  */
 export interface Column {
-    sorter?: boolean;
+    filter?: boolean;
     key: string;
     label?: string;
-    filter?: boolean;
+    sorter?: boolean;
     _style?: any;
     _props?: any;
 }
@@ -40,8 +40,8 @@ export interface SorterValue {
     state?: number | string;
 }
 export interface TableFilter {
-    lazy?: boolean;
     external?: boolean;
+    lazy?: boolean;
     label?: string;
     placeholder?: string;
 }