@mezzanine-ui/core 0.11.3 → 0.12.0

package/_internal/input-check/inputCheck.d.ts

@@ -1,5 +1,5 @@
 import { Size } from '@mezzanine-ui/system/size';
-export declare type InputCheckSize = Size;
+export type InputCheckSize = Size;
 export declare const inputCheckPrefix = "mzn-input-check";
 export declare const inputCheckClasses: {
     readonly host: "mzn-input-check";

package/_internal/input-check/inputCheckGroup.d.ts

@@ -1,5 +1,5 @@
 import { Orientation } from '@mezzanine-ui/system/orientation';
-export declare type InputCheckGroupOrientation = Orientation;
+export type InputCheckGroupOrientation = Orientation;
 export declare const inputCheckGroupPrefix: "mzn-input-check-group";
 export declare const inputCheckGroupClasses: {
     readonly host: "mzn-input-check-group";

package/_styles.scss

@@ -28,6 +28,11 @@
   @include _load-styles($options, calendar);
   @include _load-styles($options, time-panel);
 
+  // Data Entry Common
+  @include _load-styles($options, _internal/input-check, input-check);
+  @include _load-styles($options, _internal/input-trigger-popper, input-trigger-popper);
+  @include _load-styles($options, text-field);
+
   // Navigation
   @include _load-styles($options, menu);
   @include _load-styles($options, tabs);
@@ -47,11 +52,6 @@
   @include _load-styles($options, tree);
   @include _load-styles($options, table);
 
-  // Data Entry Common
-  @include _load-styles($options, _internal/input-check, input-check);
-  @include _load-styles($options, _internal/input-trigger-popper, input-trigger-popper);
-  @include _load-styles($options, text-field);
-
   // Data Entry
   @include _load-styles($options, checkbox);
   @include _load-styles($options, input);

package/alert/alert.d.ts

@@ -1,5 +1,5 @@
 import { Severity } from '@mezzanine-ui/system/severity';
-export declare type AlertSeverity = Severity;
+export type AlertSeverity = Severity;
 export declare const alertPrefix = "mzn-alert";
 export declare const alertIcons: {
     readonly success: import("@mezzanine-ui/icons").IconDefinition;

package/app-bar/_app-bar-styles.scss

@@ -49,7 +49,7 @@ $vertical-support-max-height: 96px !default;
         padding-right: spacing.level(4);
       }
 
-      &:not(:first-child):not(:last-child) {
+      &:not(:first-child, :last-child) {
         padding: 0 spacing.level(4);
       }
     }
@@ -93,7 +93,7 @@ $vertical-support-max-height: 96px !default;
         padding-bottom: spacing.level(5);
       }
 
-      &:not(:first-child):not(:last-child) {
+      &:not(:first-child, :last-child) {
         padding: spacing.level(5) 0;
       }
     }

package/app-bar/appBar.d.ts

@@ -1,6 +1,6 @@
 import { Orientation } from '@mezzanine-ui/system/orientation';
 export declare const appBarPrefix = "mzn-app-bar";
-export declare type AppBarOrientation = Orientation;
+export type AppBarOrientation = Orientation;
 export declare const appBarClasses: {
     readonly host: "mzn-app-bar";
     readonly horizontal: "mzn-app-bar--horizontal";

package/button/_button-styles.scss

@@ -11,7 +11,7 @@
 $colors-and-danger: list.push($colors, danger);
 
 @function _get-colors($name) {
-  @return if($name == "danger", "error", $name);
+  @return if($name == 'danger', 'error', $name);
 }
 
 $label-min-width: 32px !default;

package/button/button.d.ts

@@ -1,8 +1,8 @@
 import { MainColor } from '@mezzanine-ui/system/palette';
 import { Size } from '@mezzanine-ui/system/size';
-export declare type ButtonColor = Extract<MainColor, 'primary' | 'secondary'>;
-export declare type ButtonSize = Size;
-export declare type ButtonVariant = 'contained' | 'outlined' | 'text';
+export type ButtonColor = Extract<MainColor, 'primary' | 'secondary'>;
+export type ButtonSize = Size;
+export type ButtonVariant = 'contained' | 'outlined' | 'text';
 export declare const buttonPrefix = "mzn-button";
 export declare const buttonClasses: {
     host: string;

package/button/buttonGroup.d.ts

@@ -2,8 +2,8 @@ import { CssVarInterpolations } from '@mezzanine-ui/system/css';
 import { Orientation } from '@mezzanine-ui/system/orientation';
 import { SpacingLevel } from '@mezzanine-ui/system/spacing';
 import { ButtonSize } from './button';
-export declare type ButtonGroupOrientation = Orientation;
-export declare type ButtonGroupSpacing = SpacingLevel;
+export type ButtonGroupOrientation = Orientation;
+export type ButtonGroupSpacing = SpacingLevel;
 export interface ButtonGroupCssVars {
     size: ButtonSize;
     spacing?: ButtonGroupSpacing;

package/calendar/_calendar-styles.scss

@@ -22,7 +22,7 @@
 
   @include typography.inherit;
 
-  &[aria-disabled=true] {
+  &[aria-disabled='true'] {
     cursor: default;
   }
 
@@ -125,7 +125,7 @@
   justify-content: center;
   position: relative;
   width: 100%;
-  margin: 0 0 12px 0;
+  margin: 0 0 12px;
 
   &__icon-button {
     position: absolute;

package/calendar/calendar.d.ts

@@ -1,7 +1,7 @@
 /** Types */
-export declare type CalendarMode = 'year' | 'month' | 'week' | 'day';
+export type CalendarMode = 'year' | 'month' | 'week' | 'day';
 /** ISO 8601 text */
-export declare type DateType = string;
+export type DateType = string;
 /** Classes */
 export declare const calendarPrefix = "mzn-calendar";
 export declare const calendarBoardPrefix: string;

package/calendar/typings.d.ts

@@ -1,6 +1,6 @@
 import { DateType } from './calendar';
 /** Method Types */
-export declare type CalendarMethods<TDateType = DateType> = {
+export type CalendarMethods<TDateType = DateType> = {
     /** Get date infos */
     getNow: () => TDateType;
     getSecond: (value: TDateType) => number;

package/checkbox/_checkbox-styles.scss

@@ -40,7 +40,7 @@ $indeterminate-line-width-small: 5px !default;
   &::after {
     display: block;
     position: absolute;
-    content: "";
+    content: '';
     opacity: 0;
     transition: transition.standard(opacity);
     will-change: opacity;

package/checkbox/checkbox.d.ts

@@ -1,6 +1,6 @@
 import { InputCheckGroupOrientation, InputCheckSize } from '../_internal/input-check';
-export declare type CheckboxSize = InputCheckSize;
-export declare type CheckboxGroupOrientation = InputCheckGroupOrientation;
+export type CheckboxSize = InputCheckSize;
+export type CheckboxGroupOrientation = InputCheckGroupOrientation;
 export interface CheckboxGroupOption {
     disabled?: boolean;
     label: string | number;

package/drawer/drawer.d.ts

@@ -1,5 +1,5 @@
 export declare const drawerPrefix = "mzn-drawer";
-export declare type DrawerPlacement = 'top' | 'right' | 'bottom' | 'left';
+export type DrawerPlacement = 'top' | 'right' | 'bottom' | 'left';
 export declare const drawerClasses: {
     host: string;
     overlay: string;

package/icon/icon.d.ts

@@ -1,6 +1,6 @@
 import { CssVarInterpolations } from '@mezzanine-ui/system/css';
 import { MainColor } from '@mezzanine-ui/system/palette';
-export declare type IconColor = 'inherit' | MainColor | 'disabled';
+export type IconColor = 'inherit' | MainColor | 'disabled';
 export interface IconCssVars {
     color?: IconColor;
     size?: number;

package/input/_input-styles.scss

@@ -34,18 +34,18 @@
     padding-right: var(--#{text-field.$prefix}-padding-right);
 
     /* clears the 'X' from Internet Explorer */
-    &[type="search"]::-ms-clear,
-    &[type="search"]::-ms-reveal {
+    &[type='search']::-ms-clear,
+    &[type='search']::-ms-reveal {
       display: none;
       width: 0;
       height: 0;
     }
 
     /* clears the 'X' from Chrome */
-    &[type="search"]::-webkit-search-decoration,
-    &[type="search"]::-webkit-search-cancel-button,
-    &[type="search"]::-webkit-search-results-button,
-    &[type="search"]::-webkit-search-results-decoration {
+    &[type='search']::-webkit-search-decoration,
+    &[type='search']::-webkit-search-cancel-button,
+    &[type='search']::-webkit-search-results-button,
+    &[type='search']::-webkit-search-results-decoration {
       display: none;
     }
   }

package/input/input.d.ts

@@ -1,5 +1,5 @@
 import { Size } from '@mezzanine-ui/system/size';
-export declare type InputSize = Size;
+export type InputSize = Size;
 export declare const inputPrefix = "mzn-input";
 export declare const inputClasses: {
     readonly host: "mzn-input";

package/menu/menu.d.ts

@@ -1,6 +1,6 @@
 import { CssVarInterpolations } from '@mezzanine-ui/system/css';
 import { Size } from '@mezzanine-ui/system/size';
-export declare type MenuSize = Size;
+export type MenuSize = Size;
 export interface MenuCssVars {
     itemsInView: number;
     maxHeight?: number;

package/message/_message-styles.scss

@@ -39,7 +39,7 @@ $icon-size: 24px !default;
 
   @each $severity in $severities {
     &--#{$severity} {
-      --#{$prefix}-color: #{palette.color(if($severity == "info", primary, $severity))};
+      --#{$prefix}-color: #{palette.color(if($severity == 'info', primary, $severity))};
     }
   }
 

package/message/message.d.ts

@@ -1,5 +1,5 @@
 import { SeverityWithInfo } from '@mezzanine-ui/system/severity';
-export declare type MessageSeverity = SeverityWithInfo;
+export type MessageSeverity = SeverityWithInfo;
 export declare const messagePrefix = "mzn-message";
 export declare const messageIcons: {
     readonly success: import("@mezzanine-ui/icons").IconDefinition;

package/modal/modal.d.ts

@@ -1,7 +1,7 @@
 import { SeverityWithInfo } from '@mezzanine-ui/system/severity';
 import { Size } from '@mezzanine-ui/system/size';
-export declare type ModalSeverity = SeverityWithInfo;
-export declare type ModalSize = Size | 'extraLarge';
+export type ModalSeverity = SeverityWithInfo;
+export type ModalSize = Size | 'extraLarge';
 export declare const modalPrefix = "mzn-modal";
 export declare const modalSeverityIcons: {
     readonly success: import("@mezzanine-ui/icons").IconDefinition;

package/navigation/_navigation-styles.scss

@@ -72,7 +72,7 @@ $icon-size: 24px !default;
         overflow: hidden;
         background-color: palette.color(surface);
         border-color: palette.color(border);
-        border-width: 0 1px 1px 1px;
+        border-width: 0 1px 1px;
         border-style: solid;
         .#{$item-prefix} {
           @include typography.variant(input1);

package/navigation/navigation.d.ts

@@ -1,6 +1,6 @@
 import { Orientation } from '@mezzanine-ui/system/orientation';
 export declare const navigationPrefix = "mzn-navigation";
-export declare type NavigationOrientation = Orientation;
+export type NavigationOrientation = Orientation;
 export declare const navigationClasses: {
     readonly host: "mzn-navigation";
     readonly horizontal: "mzn-navigation--horizontal";

package/notification/_notification-styles.scss

@@ -24,7 +24,7 @@ $icon-gap: 12px !default;
 
   @each $severity in $severities {
     &--#{$severity} {
-      --#{$prefix}-color: #{palette.color(if($severity == "info", primary, $severity))};
+      --#{$prefix}-color: #{palette.color(if($severity == 'info', primary, $severity))};
 
       border: 1px solid var(--#{$prefix}-color);
     }
@@ -41,7 +41,7 @@ $icon-gap: 12px !default;
 
   &__title {
     padding-right: 48px;
-    margin: 0 0 8px 0;
+    margin: 0 0 8px;
 
     @include typography.variant(h4);
   }

package/notification/notification.d.ts

@@ -1,5 +1,5 @@
 import { SeverityWithInfo } from '@mezzanine-ui/system/severity';
-export declare type NotificationSeverity = SeverityWithInfo;
+export type NotificationSeverity = SeverityWithInfo;
 export declare const notificationPrefix = "mzn-notif";
 export declare const notificationRootPrefix: string;
 export declare const notificationIcons: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mezzanine-ui/core",
-  "version": "0.11.3",
+  "version": "0.12.0",
   "description": "Core for mezzanine-ui",
   "author": "Mezzanine",
   "repository": {
@@ -28,17 +28,17 @@
     "moment": "^2.29.1"
   },
   "peerDependenciesMeta": {
-    "moment": {
+    "dayjs": {
       "optional": true
     },
-    "dayjs": {
+    "moment": {
       "optional": true
     }
   },
   "dependencies": {
-    "@mezzanine-ui/icons": "^0.11.3",
-    "@mezzanine-ui/system": "^0.11.3",
+    "@mezzanine-ui/icons": "^0.12.0",
+    "@mezzanine-ui/system": "^0.12.0",
     "lodash": "^4.17.21",
-    "tslib": "^2.1.0"
+    "tslib": "^2.4.1"
   }
 }

package/pagination/_pagination-styles.scss

@@ -14,6 +14,9 @@ $jumper-margin-left: 24px !default;
 $jumper-item-gap: 16px 8px !default;
 $jumper-item-columns: 32px 64px 66px !default;
 
+$page-size-margin-right: 24px !default;
+$page-size-gap: 8px !default;
+
 .#{$prefix} {
   &__container {
     display: grid;
@@ -32,6 +35,10 @@ $jumper-item-columns: 32px 64px 66px !default;
     justify-content: center;
   }
 
+  &__page-size {
+    margin-right: $page-size-margin-right - $item-gap;
+  }
+
   &__jumper {
     margin-left: $jumper-margin-left - $item-gap;
   }
@@ -112,8 +119,20 @@ $jumper-item-columns: 32px 64px 66px !default;
       margin: 0;
     }
 
-    &[type=number] {
+    &[type='number'] {
       appearance: textfield;
     }
   }
 }
+
+.#{$page-size-prefix} {
+  display: flex;
+  flex-flow: row;
+  align-items: center;
+  gap: $page-size-gap;
+
+  &__select {
+    max-width: 120px;
+    min-width: unset;
+  }
+}

package/pagination/_pagination.scss

@@ -1,3 +1,4 @@
 $prefix: mzn-pagination;
 $item-prefix: #{$prefix}-item;
 $jumper-prefix: #{$prefix}-jumper;
+$page-size-prefix: #{$prefix}-page-size;

package/pagination/index.d.ts

@@ -1,3 +1,4 @@
 export * from './pagination';
 export * from './paginationItem';
 export * from './paginationJumper';
+export * from './paginationPageSize';

package/pagination/index.js

@@ -1,3 +1,4 @@
 export { paginationClasses, paginationPrefix } from './pagination.js';
 export { paginationItemClasses, paginationItemPrefix } from './paginationItem.js';
 export { paginationJumperClasses, paginationJumperPrefix } from './paginationJumper.js';
+export { paginationPageSizeClasses, paginationPageSizePrefix } from './paginationPageSize.js';

package/pagination/pagination.d.ts

@@ -4,4 +4,5 @@ export declare const paginationClasses: {
     readonly container: "mzn-pagination__container";
     readonly item: "mzn-pagination__item";
     readonly jumper: "mzn-pagination__jumper";
+    readonly pageSize: "mzn-pagination__page-size";
 };

package/pagination/pagination.js

@@ -4,6 +4,7 @@ const paginationClasses = {
     container: `${paginationPrefix}__container`,
     item: `${paginationPrefix}__item`,
     jumper: `${paginationPrefix}__jumper`,
+    pageSize: `${paginationPrefix}__page-size`,
 };
 
 export { paginationClasses, paginationPrefix };

package/pagination/paginationItem.d.ts

@@ -1,5 +1,5 @@
 export declare const paginationItemPrefix = "mzn-pagination-item";
-export declare type PaginationItemType = 'page' | 'ellipsis' | 'previous' | 'next' | string;
+export type PaginationItemType = 'page' | 'ellipsis' | 'previous' | 'next' | string;
 export declare const paginationItemClasses: {
     readonly host: "mzn-pagination-item";
     readonly button: "mzn-pagination-item__button";

package/pagination/paginationPageSize.d.ts

@@ -0,0 +1,5 @@
+export declare const paginationPageSizePrefix = "mzn-pagination-page-size";
+export declare const paginationPageSizeClasses: {
+    readonly host: "mzn-pagination-page-size";
+    readonly select: "mzn-pagination-page-size__select";
+};

package/pagination/paginationPageSize.js

@@ -0,0 +1,7 @@
+const paginationPageSizePrefix = 'mzn-pagination-page-size';
+const paginationPageSizeClasses = {
+    host: paginationPageSizePrefix,
+    select: `${paginationPageSizePrefix}__select`,
+};
+
+export { paginationPageSizeClasses, paginationPageSizePrefix };

package/picker/picker.d.ts

@@ -6,5 +6,5 @@ export declare const pickerClasses: {
     readonly arrowIcon: "mzn-picker__arrow-icon";
 };
 /** Types */
-export declare type RangePickerValue<T = DateType> = undefined[] | [T, T];
-export declare type RangePickerPickingValue<T = DateType> = RangePickerValue | [T] | [undefined, T] | [T, undefined];
+export type RangePickerValue<T = DateType> = undefined[] | [T, T];
+export type RangePickerPickingValue<T = DateType> = RangePickerValue | [T] | [undefined, T] | [T, undefined];

package/progress/progress.d.ts

@@ -14,12 +14,12 @@ export declare const progressClasses: {
     readonly success: "mzn-progress--success";
     readonly size: (size: Size) => string;
 };
-export declare type ProgressType = 'line' | 'circle';
+export type ProgressType = 'line' | 'circle';
 export declare enum ProgressTypes {
     line = "line",
     circle = "circle"
 }
-export declare type ProgressStatus = 'normal' | 'success' | 'error';
+export type ProgressStatus = 'normal' | 'success' | 'error';
 export declare enum ProgressStatuses {
     normal = "normal",
     success = "success",

package/radio/_radio-styles.scss

@@ -22,7 +22,7 @@ $dot-size-small: 6px !default;
   &::before {
     display: block;
     position: absolute;
-    content: "";
+    content: '';
     top: var(--#{$prefix}-dot-top);
     left: var(--#{$prefix}-dot-top);
     width: var(--#{$prefix}-dot-size);

package/radio/radio.d.ts

@@ -1,11 +1,11 @@
 import { InputCheckGroupOrientation, InputCheckSize } from '../_internal/input-check';
-export declare type RadioSize = InputCheckSize;
+export type RadioSize = InputCheckSize;
 export interface RadioGroupOption {
     disabled?: boolean;
     label: string | number;
     value: string;
 }
-export declare type RadioGroupOrientation = InputCheckGroupOrientation;
+export type RadioGroupOrientation = InputCheckGroupOrientation;
 export declare const radioPrefix = "mzn-radio";
 export declare const radioClasses: {
     readonly host: "mzn-radio";

package/select/_select-styles.scss

@@ -33,18 +33,18 @@ $tags-gap: 4px !default;
     }
 
     /* clears the 'X' from Internet Explorer */
-    &[type="search"]::-ms-clear,
-    &[type="search"]::-ms-reveal {
+    &[type='search']::-ms-clear,
+    &[type='search']::-ms-reveal {
       display: none;
       width: 0;
       height: 0;
     }
 
     /* clears the 'X' from Chrome */
-    &[type="search"]::-webkit-search-decoration,
-    &[type="search"]::-webkit-search-cancel-button,
-    &[type="search"]::-webkit-search-results-button,
-    &[type="search"]::-webkit-search-results-decoration {
+    &[type='search']::-webkit-search-decoration,
+    &[type='search']::-webkit-search-cancel-button,
+    &[type='search']::-webkit-search-results-button,
+    &[type='search']::-webkit-search-results-decoration {
       display: none;
     }
   }

package/select/select.d.ts

@@ -1,6 +1,6 @@
 import { Size } from '@mezzanine-ui/system/size';
-export declare type SelectInputSize = Size;
-export declare type SelectMode = 'single' | 'multiple';
+export type SelectInputSize = Size;
+export type SelectMode = 'single' | 'multiple';
 export declare const selectPrefix = "mzn-select";
 export declare const treeSelectPrefix = "mzn-tree-select";
 export declare const selectTriggerPrefix: string;

package/slider/_slider-styles.scss

@@ -50,7 +50,7 @@ $handler-scale-size: 24px !default;
         margin: 0;
       }
 
-      &[type=number] {
+      &[type='number'] {
         appearance: textfield;
       }
     }

package/slider/slider.d.ts

@@ -1,9 +1,9 @@
 import { CssVarInterpolations } from '@mezzanine-ui/system/css';
 /** Types */
-export declare type SingleSliderValue = number;
-export declare type RangeSliderValue = [number, number];
-export declare type SliderValue = SingleSliderValue | RangeSliderValue;
-export declare type SliderRect = Pick<DOMRect, 'left' | 'width'>;
+export type SingleSliderValue = number;
+export type RangeSliderValue = [number, number];
+export type SliderValue = SingleSliderValue | RangeSliderValue;
+export type SliderRect = Pick<DOMRect, 'left' | 'width'>;
 /** Classes */
 export declare const sliderPrefix = "mzn-slider";
 export declare const sliderHandlerPrefix: string;

package/switch/_switch-styles.scss

@@ -36,7 +36,7 @@ $icon-size-large: $height-large - ($control-gap * 2);
 
   &__control {
     position: absolute;
-    content: "";
+    content: '';
     top: $control-gap;
     left: $control-gap;
     font-size: var(--#{$prefix}-icon-size);

package/switch/switch.d.ts

@@ -1,6 +1,6 @@
 import type { IconDefinition } from '@mezzanine-ui/icons';
 import { Size } from '@mezzanine-ui/system/size';
-export declare type SwitchSize = Extract<Size, 'medium' | 'large'>;
+export type SwitchSize = Extract<Size, 'medium' | 'large'>;
 export declare const switchPrefix = "mzn-switch";
 export declare const SwitchSpinnerIcon: IconDefinition;
 export declare const switchClasses: {

package/table/table.d.ts

@@ -26,18 +26,18 @@ export declare const tableClasses: {
     readonly paginationActions: "mzn-table__pagination__actions";
     readonly refresh: "mzn-table__refresh";
 };
-export declare type TableRecord<T> = Record<string, T>;
+export type TableRecord<T> = Record<string, T>;
 export interface TableDataSourceWithKey extends TableRecord<unknown> {
     key: string | number;
 }
 export interface TableDataSourceWithID extends TableRecord<unknown> {
     id: string | number;
 }
-export declare type TableDataSource = TableDataSourceWithKey | TableDataSourceWithID;
-export declare type TableColumn<SourceType> = {
+export type TableDataSource = TableDataSourceWithKey | TableDataSourceWithID;
+export type TableColumn<SourceType> = {
     dataIndex: string;
     title?: string;
-    render?(column: TableColumn<SourceType>, source: SourceType, index: number): any;
+    render?(source: SourceType, index: number, column: TableColumn<SourceType>): any;
     renderTitle?(classes: typeof tableClasses): any;
     renderTooltipTitle?(source: SourceType): string;
     align?: 'start' | 'center' | 'end';
@@ -53,8 +53,8 @@ export declare type TableColumn<SourceType> = {
     /** force display tooltip whenever content is hovered */
     forceShownTooltipWhenHovered?: boolean;
 };
-export declare type ExpandedTableColumn = Omit<TableColumn<TableRecord<unknown>>, 'title' | 'renderTitle' | 'align' | 'headerClassName' | 'width' | 'sorter' | 'onSorted' | 'editable' | 'setCellProps'>;
-export declare type TableFetchMore = {
+export type ExpandedTableColumn = Omit<TableColumn<TableRecord<unknown>>, 'title' | 'renderTitle' | 'align' | 'headerClassName' | 'width' | 'sorter' | 'onSorted' | 'editable' | 'setCellProps'>;
+export type TableFetchMore = {
     callback?(): any;
     isReachEnd?: boolean;
     isFetching?: boolean;
@@ -72,13 +72,14 @@ export interface TableRowSelection {
     actions?: TableRowAction[];
 }
 /** === Feature Expandable */
+export type ExpandRowBySources = {
+    dataSource: TableDataSource[];
+    columns?: ExpandedTableColumn[];
+    className?: string;
+};
 export interface TableExpandable<SourceType> {
     className?: string;
-    expandedRowRender(record: SourceType): string | {
-        dataSource: TableDataSource[];
-        columns?: ExpandedTableColumn[];
-        className?: string;
-    };
+    expandedRowRender(record: SourceType): string | ExpandRowBySources;
     rowExpandable?(record: SourceType): boolean;
     onExpand?(record: SourceType, status: boolean): void;
 }
@@ -95,7 +96,18 @@ export interface TablePagination {
         disabled?: boolean;
         hideNextButton?: boolean;
         hidePreviousButton?: boolean;
+        jumperButtonText?: string;
+        jumperHintText?: string;
+        jumperInputPlaceholder?: string;
+        onChangePageSize?: (pageSize: number) => void;
         pageSize?: number;
+        pageSizeLabel?: string;
+        pageSizeOptions?: number[];
+        pageSizeUnit?: string;
+        renderPageSizeOptionName?: (pageSize: number) => string;
+        renderPaginationSummary?: (start: number, end: number) => string;
+        showJumper?: boolean;
+        showPageSizeOptions?: boolean;
         siblingCount?: number;
     };
 }

package/tag/tag.d.ts

@@ -1,5 +1,5 @@
 import { Size } from '@mezzanine-ui/system/size';
-export declare type TagSize = Size;
+export type TagSize = Size;
 export declare const tagPrefix = "mzn-tag";
 export declare const tagClasses: {
     readonly host: "mzn-tag";

package/text-field/_text-field-styles.scss

@@ -164,7 +164,11 @@ $prefix-suffix-gap: 4px !default;
   &:hover,
   &:focus-within {
     &:not(.#{$prefix}--disabled) {
-      &:not(.#{$prefix}--error, .#{form.$field-prefix}--success, .#{form.$field-prefix}--error, .#{form.$field-prefix}--warning) {
+      &:not(
+      .#{$prefix}--error,
+      .#{form.$field-prefix}--success,
+      .#{form.$field-prefix}--error,
+      .#{form.$field-prefix}--warning) {
         --#{$prefix}-status-color: #{palette.color(primary)};
       }
     }

package/text-field/textField.d.ts

@@ -1,5 +1,5 @@
 import { Size } from '@mezzanine-ui/system/size';
-export declare type TextFieldSize = Size;
+export type TextFieldSize = Size;
 export declare const textFieldPrefix = "mzn-text-field";
 export declare const textFieldClasses: {
     readonly host: "mzn-text-field";

package/textarea/textarea.d.ts

@@ -1,5 +1,5 @@
 import { Size } from '@mezzanine-ui/system/size';
-export declare type TextareaSize = Size;
+export type TextareaSize = Size;
 export declare const textareaPrefix = "mzn-textarea";
 export declare const textareaClasses: {
     readonly host: "mzn-textarea";

package/time-panel/timePanel.d.ts

@@ -1,10 +1,10 @@
 /** Types */
-export declare type TimePanelUnitValue = number;
-export declare type TimePanelUnit = {
+export type TimePanelUnitValue = number;
+export type TimePanelUnit = {
     value: TimePanelUnitValue;
     label: string;
 };
-export declare type TimePanelMode = 'hour' | 'minute' | 'second';
+export type TimePanelMode = 'hour' | 'minute' | 'second';
 /** Classes */
 export declare const timePanelPrefix = "mzn-time-panel";
 export declare const timePanelColumnsPrefix: string;

package/tree/tree.d.ts

@@ -1,12 +1,12 @@
-export declare type TreeSelectMethod = 'toggle' | 'target';
-export declare type TreeSize = 'small' | 'medium' | 'large';
-export declare type TreeNodeValue = string | number;
+export type TreeSelectMethod = 'toggle' | 'target';
+export type TreeSize = 'small' | 'medium' | 'large';
+export type TreeNodeValue = string | number;
 export interface TreeState {
     checkable?: boolean;
     disabled?: boolean;
     selectable?: boolean;
 }
-export declare type TreeNodeState = {
+export type TreeNodeState = {
     disabled?: boolean;
     expanded?: boolean;
     indeterminate?: boolean;

package/typography/typography.d.ts

@@ -1,10 +1,10 @@
 import { CssVarInterpolations } from '@mezzanine-ui/system/css';
 import { GradualMainColor, MainColor, TextColor } from '@mezzanine-ui/system/palette';
 import { TypographyVariant } from '@mezzanine-ui/system/typography';
-export declare type TypographyAlign = 'left' | 'center' | 'right' | 'justify';
-export declare type TypographyColor = 'inherit' | MainColor | GradualMainColor | TextColor;
-declare type TypographyDisplayBase = 'block' | 'flex';
-export declare type TypographyDisplay = TypographyDisplayBase | `inline-${TypographyDisplayBase}`;
+export type TypographyAlign = 'left' | 'center' | 'right' | 'justify';
+export type TypographyColor = 'inherit' | MainColor | GradualMainColor | TextColor;
+type TypographyDisplayBase = 'block' | 'flex';
+export type TypographyDisplay = TypographyDisplayBase | `inline-${TypographyDisplayBase}`;
 export interface TypographyCssVars {
     align?: TypographyAlign;
     color?: TypographyColor;

package/upload/_upload-result-styles.scss

@@ -56,7 +56,7 @@ $name-icon-gap: 4px !default;
 
     &::before {
       position: absolute;
-      content: "";
+      content: '';
       top: 0;
       left: 0;
       width: 100%;

package/upload/uploadResult.d.ts

@@ -1,7 +1,7 @@
 import { CssVarInterpolations } from '@mezzanine-ui/system/css';
 import { Size } from '@mezzanine-ui/system/size';
-export declare type UploadResultSize = Size;
-export declare type UploadResultStatus = 'done' | 'error' | 'loading';
+export type UploadResultSize = Size;
+export type UploadResultStatus = 'done' | 'error' | 'loading';
 export interface UploadResultCssVars {
     percentage?: number;
 }