naive-ui 2.30.3 → 2.30.6

package/lib/pagination/src/Pagination.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 const vue_1 = require("vue");
 const vooks_1 = require("vooks");
+const popselect_1 = require("../../popselect");
 const select_1 = require("../../select");
 const input_1 = require("../../input");
 const _internal_1 = require("../../_internal");
@@ -79,8 +80,40 @@ exports.default = (0, vue_1.defineComponent)({
                 return Math.max(pageCount, 1);
             return 1;
         });
-        const showFastForwardRef = (0, vue_1.ref)(false);
-        const showFastBackwardRef = (0, vue_1.ref)(false);
+        const fastForwardActiveRef = (0, vue_1.ref)(false);
+        const fastBackwardActiveRef = (0, vue_1.ref)(false);
+        const showFastForwardMenuRef = (0, vue_1.ref)(false);
+        const showFastBackwardMenuRef = (0, vue_1.ref)(false);
+        const handleFastForwardMouseenter = () => {
+            fastForwardActiveRef.value = true;
+            disableTransitionOneTick();
+        };
+        const handleFastForwardMouseleave = () => {
+            fastForwardActiveRef.value = false;
+            disableTransitionOneTick();
+        };
+        const handleFastBackwardMouseenter = () => {
+            fastBackwardActiveRef.value = true;
+            disableTransitionOneTick();
+        };
+        const handleFastBackwardMouseleave = () => {
+            fastBackwardActiveRef.value = false;
+            disableTransitionOneTick();
+        };
+        const handleMenuSelect = (value) => {
+            doUpdatePage(value);
+        };
+        const pageItemsInfo = (0, vue_1.computed)(() => (0, utils_1.createPageItemsInfo)(mergedPageRef.value, mergedPageCountRef.value, props.pageSlot));
+        (0, vue_1.watchEffect)(() => {
+            if (!pageItemsInfo.value.hasFastBackward) {
+                fastBackwardActiveRef.value = false;
+                showFastBackwardMenuRef.value = false;
+            }
+            else if (!pageItemsInfo.value.hasFastForward) {
+                fastForwardActiveRef.value = false;
+                showFastForwardMenuRef.value = false;
+            }
+        });
         const pageSizeOptionsRef = (0, vue_1.computed)(() => {
             const suffix = localeRef.value.selectionSuffix;
             return props.pageSizes.map((size) => {
@@ -180,13 +213,13 @@ exports.default = (0, vue_1.defineComponent)({
         function fastForward() {
             if (props.disabled)
                 return;
-            const page = Math.min(mergedPageRef.value + (props.pageSlot - 4), mergedPageCountRef.value);
+            const page = Math.min(pageItemsInfo.value.fastForwardTo, mergedPageCountRef.value);
             doUpdatePage(page);
         }
         function fastBackward() {
             if (props.disabled)
                 return;
-            const page = Math.max(mergedPageRef.value - (props.pageSlot - 4), 1);
+            const page = Math.max(pageItemsInfo.value.fastBackwardTo, 1);
             doUpdatePage(page);
         }
         function handleSizePickerChange(value) {
@@ -218,36 +251,6 @@ exports.default = (0, vue_1.defineComponent)({
                     break;
             }
         }
-        function handlePageItemMouseEnter(pageItem) {
-            if (props.disabled)
-                return;
-            switch (pageItem.type) {
-                case 'fast-backward':
-                    showFastBackwardRef.value = true;
-                    break;
-                case 'fast-forward':
-                    showFastForwardRef.value = true;
-                    break;
-                default:
-                    return;
-            }
-            disableTransitionOneTick();
-        }
-        function handlePageItemMouseLeave(pageItem) {
-            if (props.disabled)
-                return;
-            switch (pageItem.type) {
-                case 'fast-backward':
-                    showFastBackwardRef.value = false;
-                    break;
-                case 'fast-forward':
-                    showFastForwardRef.value = false;
-                    break;
-                default:
-                    return;
-            }
-            disableTransitionOneTick();
-        }
         function handleJumperInput(value) {
             jumperValueRef.value = value.replace(/\D+/g, '');
         }
@@ -320,9 +323,9 @@ exports.default = (0, vue_1.defineComponent)({
             selfRef,
             jumperRef,
             mergedPage: mergedPageRef,
-            showFastBackward: showFastBackwardRef,
-            showFastForward: showFastForwardRef,
-            pageItems: (0, vue_1.computed)(() => (0, utils_1.pageItems)(mergedPageRef.value, mergedPageCountRef.value, props.pageSlot)),
+            pageItems: (0, vue_1.computed)(() => {
+                return pageItemsInfo.value.items;
+            }),
             mergedItemCount: mergedItemCountRef,
             jumperValue: jumperValueRef,
             pageSizeOptions: pageSizeOptionsRef,
@@ -333,14 +336,21 @@ exports.default = (0, vue_1.defineComponent)({
             mergedPageCount: mergedPageCountRef,
             startIndex: startIndexRef,
             endIndex: endIndexRef,
+            showFastForwardMenu: showFastForwardMenuRef,
+            showFastBackwardMenu: showFastBackwardMenuRef,
+            fastForwardActive: fastForwardActiveRef,
+            fastBackwardActive: fastBackwardActiveRef,
+            handleMenuSelect,
+            handleFastForwardMouseenter,
+            handleFastForwardMouseleave,
+            handleFastBackwardMouseenter,
+            handleFastBackwardMouseleave,
             handleJumperInput,
             handleBackwardClick: backward,
             handleForwardClick: forward,
             handlePageItemClick,
             handleSizePickerChange,
             handleQuickJumperKeyUp,
-            handlePageItemMouseEnter,
-            handlePageItemMouseLeave,
             cssVars: inlineThemeDisabled ? undefined : cssVarsRef,
             themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass,
             onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender
@@ -348,7 +358,7 @@ exports.default = (0, vue_1.defineComponent)({
     },
     render() {
         // it's ok to expand all prop here since no slots' deps
-        const { $slots, mergedClsPrefix, disabled, cssVars, mergedPage, mergedPageCount, pageItems, showFastBackward, showFastForward, showSizePicker, showQuickJumper, mergedTheme, locale, inputSize, selectSize, mergedPageSize, pageSizeOptions, jumperValue, prev, next, prefix, suffix, label, handleJumperInput, handleSizePickerChange, handleBackwardClick, handlePageItemClick, handlePageItemMouseEnter, handlePageItemMouseLeave, handleForwardClick, handleQuickJumperKeyUp, onRender } = this;
+        const { $slots, mergedClsPrefix, disabled, cssVars, mergedPage, mergedPageCount, pageItems, showSizePicker, showQuickJumper, mergedTheme, locale, inputSize, selectSize, mergedPageSize, pageSizeOptions, jumperValue, prev, next, prefix, suffix, label, handleJumperInput, handleSizePickerChange, handleBackwardClick, handlePageItemClick, handleForwardClick, handleQuickJumperKeyUp, onRender } = this;
         onRender === null || onRender === void 0 ? void 0 : onRender();
         const renderPrefix = $slots.prefix || prefix;
         const renderSuffix = $slots.suffix || suffix;
@@ -386,7 +396,10 @@ exports.default = (0, vue_1.defineComponent)({
             }))),
             pageItems.map((pageItem, index) => {
                 let contentNode;
-                switch (pageItem.type) {
+                let onMouseenter;
+                let onMouseleave;
+                const { type } = pageItem;
+                switch (type) {
                     case 'page':
                         // eslint-disable-next-line no-case-declarations
                         const pageNode = pageItem.label;
@@ -403,44 +416,94 @@ exports.default = (0, vue_1.defineComponent)({
                         break;
                     case 'fast-forward':
                         // eslint-disable-next-line no-case-declarations
-                        const fastForwardNode = showFastForward ? ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, {
+                        const fastForwardNode = this.fastForwardActive ? ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, {
                             default: () => this.rtlEnabled ? ((0, vue_1.h)(icons_1.FastBackwardIcon, null)) : ((0, vue_1.h)(icons_1.FastForwardIcon, null))
                         })) : ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => (0, vue_1.h)(icons_1.MoreIcon, null) }));
                         if (renderLabel) {
                             contentNode = renderLabel({
                                 type: 'fast-forward',
                                 node: fastForwardNode,
-                                active: showFastForward
+                                active: this.fastForwardActive || this.showFastForwardMenu
                             });
                         }
                         else {
                             contentNode = fastForwardNode;
                         }
+                        onMouseenter = this.handleFastForwardMouseenter;
+                        onMouseleave = this.handleFastForwardMouseleave;
                         break;
                     case 'fast-backward':
                         // eslint-disable-next-line no-case-declarations
-                        const fastBackwardNode = showFastBackward ? ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, {
+                        const fastBackwardNode = this.fastBackwardActive ? ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, {
                             default: () => this.rtlEnabled ? ((0, vue_1.h)(icons_1.FastForwardIcon, null)) : ((0, vue_1.h)(icons_1.FastBackwardIcon, null))
                         })) : ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => (0, vue_1.h)(icons_1.MoreIcon, null) }));
                         if (renderLabel) {
                             contentNode = renderLabel({
                                 type: 'fast-backward',
                                 node: fastBackwardNode,
-                                active: showFastBackward
+                                active: this.fastBackwardActive || this.showFastBackwardMenu
                             });
                         }
                         else {
                             contentNode = fastBackwardNode;
                         }
+                        onMouseenter = this.handleFastBackwardMouseenter;
+                        onMouseleave = this.handleFastBackwardMouseleave;
                         break;
                 }
-                return ((0, vue_1.h)("div", { key: index, class: [
+                const itemNode = ((0, vue_1.h)("div", { key: index, class: [
                         `${mergedClsPrefix}-pagination-item`,
-                        {
-                            [`${mergedClsPrefix}-pagination-item--active`]: pageItem.active,
-                            [`${mergedClsPrefix}-pagination-item--disabled`]: disabled
-                        }
-                    ], onClick: () => handlePageItemClick(pageItem), onMouseenter: () => handlePageItemMouseEnter(pageItem), onMouseleave: () => handlePageItemMouseLeave(pageItem) }, contentNode));
+                        pageItem.active && `${mergedClsPrefix}-pagination-item--active`,
+                        type !== 'page' &&
+                            ((type === 'fast-backward' && this.showFastBackwardMenu) ||
+                                (type === 'fast-forward' && this.showFastForwardMenu)) &&
+                            `${mergedClsPrefix}-pagination-item--hover`,
+                        disabled && `${mergedClsPrefix}-pagination-item--disabled`,
+                        type === 'page' &&
+                            `${mergedClsPrefix}-pagination-item--clickable`
+                    ], onClick: () => handlePageItemClick(pageItem), onMouseenter: onMouseenter, onMouseleave: onMouseleave }, contentNode));
+                if (type === 'page' &&
+                    !pageItem.mayBeFastBackward &&
+                    !pageItem.mayBeFastForward) {
+                    return itemNode;
+                }
+                else {
+                    const key = pageItem.type === 'page'
+                        ? pageItem.mayBeFastBackward
+                            ? 'fast-backward'
+                            : 'fast-forward'
+                        : pageItem.type;
+                    return ((0, vue_1.h)(popselect_1.NPopselect, { key: key, trigger: "hover", virtualScroll: true, style: { width: '60px' }, theme: mergedTheme.peers.Popselect, themeOverrides: mergedTheme.peerOverrides.Popselect, builtinThemeOverrides: {
+                            peers: {
+                                InternalSelectMenu: {
+                                    height: 'calc(var(--n-option-height) * 4.6)'
+                                }
+                            }
+                        }, nodeProps: () => ({
+                            style: {
+                                justifyContent: 'center'
+                            }
+                        }), show: type === 'page'
+                            ? false
+                            : type === 'fast-backward'
+                                ? this.showFastBackwardMenu
+                                : this.showFastForwardMenu, onUpdateShow: (value) => {
+                            if (type === 'page')
+                                return;
+                            if (value) {
+                                if (type === 'fast-backward') {
+                                    this.showFastBackwardMenu = value;
+                                }
+                                else {
+                                    this.showFastForwardMenu = value;
+                                }
+                            }
+                            else {
+                                this.showFastBackwardMenu = false;
+                                this.showFastForwardMenu = false;
+                            }
+                        }, options: pageItem.type !== 'page' ? pageItem.options : [], onUpdateValue: this.handleMenuSelect, scrollable: true, internalShowCheckmark: false }, { default: () => itemNode }));
+                }
             }),
             (0, vue_1.h)("div", { class: [
                     `${mergedClsPrefix}-pagination-item`,

package/lib/pagination/src/interface.d.ts

@@ -1,4 +1,4 @@
-import { VNode, VNodeChild } from 'vue';
+import { VNodeChild } from 'vue';
 import { SelectBaseOption } from '../../select/src/interface';
 export declare type Size = 'small' | 'medium' | 'large';
 export declare type PaginationInfo = Parameters<RenderPrefix>[0];
@@ -16,7 +16,7 @@ export declare type RenderNext = RenderPrefix;
 export declare type RenderPrev = RenderPrefix;
 export declare type PaginationRenderLabel = (info: {
     type: 'fast-backward' | 'fast-forward';
-    node: VNode;
+    node: VNodeChild;
     active: boolean;
 } | {
     type: 'page';

package/lib/pagination/src/styles/index.cssr.js

@@ -4,7 +4,18 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-const cssr_1 = require("../../../_utils/cssr"); // vars:
+const cssr_1 = require("../../../_utils/cssr");
+
+const hoverStyleProps = `
+ background: var(--n-item-color-hover);
+ color: var(--n-item-text-color-hover);
+ border: var(--n-item-border-hover);
+`;
+const hoverStyleChildren = [(0, cssr_1.cM)('button', `
+ background: var(--n-button-color-hover);
+ border: var(--n-button-border-hover);
+ color: var(--n-button-icon-color-hover);
+ `)]; // vars:
 // --n-item-font-size
 // --n-select-width
 // --n-input-width
@@ -41,7 +52,6 @@ const cssr_1 = require("../../../_utils/cssr"); // vars:
 // --n-button-color-hover
 // --n-button-color-pressed
 
-
 exports.default = (0, cssr_1.cB)('pagination', `
  display: flex;
  vertical-align: middle;
@@ -97,15 +107,7 @@ exports.default = (0, cssr_1.cB)('pagination', `
  padding: 0;
  `, [(0, cssr_1.cB)('base-icon', `
  font-size: var(--n-button-icon-size);
- `)]), (0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:hover', `
- background: var(--n-item-color-hover);
- color: var(--n-item-text-color-hover);
- border: var(--n-item-border-hover);
- `, [(0, cssr_1.cM)('button', `
- background: var(--n-button-color-hover);
- border: var(--n-button-border-hover);
- color: var(--n-button-icon-color-hover);
- `)]), (0, cssr_1.c)('&:active', `
+ `)]), (0, cssr_1.cNotM)('disabled', [(0, cssr_1.cM)('hover', hoverStyleProps, hoverStyleChildren), (0, cssr_1.c)('&:hover', hoverStyleProps, hoverStyleChildren), (0, cssr_1.c)('&:active', `
  background: var(--n-item-color-pressed);
  color: var(--n-item-text-color-pressed);
  border: var(--n-item-border-pressed);

package/lib/pagination/src/utils.d.ts

@@ -1,13 +1,23 @@
-declare function pagesToShow(currentPage: number, pageCount: number, pageSlot?: number): number[];
+declare function createPageItemsInfo(currentPage: number, pageCount: number, pageSlot: number): {
+    hasFastBackward: boolean;
+    hasFastForward: boolean;
+    fastBackwardTo: number;
+    fastForwardTo: number;
+    items: PageItem[];
+};
 export declare type PageItem = {
     type: 'fast-backward' | 'fast-forward';
-    label?: undefined;
+    label: undefined;
     active: false;
+    options: Array<{
+        label: string;
+        value: number;
+    }>;
 } | {
     type: 'page';
     label: number;
     active: boolean;
+    mayBeFastForward: boolean;
+    mayBeFastBackward: boolean;
 };
-declare function mapPagesToPageItems(pages: number[], currentPage: number): PageItem[];
-declare function pageItems(currentPage: number, pageCount: number, pageSlot?: number): PageItem[];
-export { pagesToShow, mapPagesToPageItems, pageItems };
+export { createPageItemsInfo };

package/lib/pagination/src/utils.js

@@ -1,11 +1,52 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.pageItems = exports.mapPagesToPageItems = exports.pagesToShow = void 0;
-function pagesToShow(currentPage, pageCount, pageSlot = 9) {
-    if (pageCount === 1)
-        return [1];
-    if (pageCount === 2)
-        return [1, 2];
+exports.createPageItemsInfo = void 0;
+function createPageItemsInfo(currentPage, pageCount, pageSlot) {
+    let hasFastBackward = false;
+    let hasFastForward = false;
+    let fastBackwardTo = 1;
+    let fastForwardTo = pageCount;
+    if (pageCount === 1) {
+        return {
+            hasFastBackward: false,
+            hasFastForward: false,
+            fastForwardTo,
+            fastBackwardTo,
+            items: [
+                {
+                    type: 'page',
+                    label: 1,
+                    active: currentPage === 1,
+                    mayBeFastBackward: false,
+                    mayBeFastForward: false
+                }
+            ]
+        };
+    }
+    if (pageCount === 2) {
+        return {
+            hasFastBackward: false,
+            hasFastForward: false,
+            fastForwardTo,
+            fastBackwardTo,
+            items: [
+                {
+                    type: 'page',
+                    label: 1,
+                    active: currentPage === 1,
+                    mayBeFastBackward: false,
+                    mayBeFastForward: false
+                },
+                {
+                    type: 'page',
+                    label: 2,
+                    active: currentPage === 2,
+                    mayBeFastBackward: true,
+                    mayBeFastForward: false
+                }
+            ]
+        };
+    }
     const firstPage = 1;
     const lastPage = pageCount;
     let middleStart = currentPage;
@@ -22,62 +63,86 @@ function pagesToShow(currentPage, pageCount, pageSlot = 9) {
     if (middleEnd < lastPage - 2)
         rightSplit = true;
     const items = [];
-    items.push(firstPage);
+    items.push({
+        type: 'page',
+        label: 1,
+        active: currentPage === 1,
+        mayBeFastBackward: false,
+        mayBeFastForward: false
+    });
     if (leftSplit) {
-        items.push(-2);
+        hasFastBackward = true;
+        fastBackwardTo = middleStart - 1;
+        items.push({
+            type: 'fast-backward',
+            active: false,
+            label: undefined,
+            options: createRange(firstPage + 1, middleStart - 1)
+        });
     }
     else if (lastPage >= firstPage + 1) {
-        items.push(firstPage + 1);
+        items.push({
+            type: 'page',
+            label: firstPage + 1,
+            mayBeFastBackward: true,
+            mayBeFastForward: false,
+            active: currentPage === firstPage + 1
+        });
     }
     for (let i = middleStart; i <= middleEnd; ++i) {
-        items.push(i);
+        items.push({
+            type: 'page',
+            label: i,
+            mayBeFastBackward: false,
+            mayBeFastForward: false,
+            active: currentPage === i
+        });
     }
     if (rightSplit) {
-        items.push(-1);
+        hasFastForward = true;
+        fastForwardTo = middleEnd + 1;
+        items.push({
+            type: 'fast-forward',
+            active: false,
+            label: undefined,
+            options: createRange(middleEnd + 1, lastPage - 1)
+        });
     }
     else if (middleEnd === lastPage - 2 &&
-        items[items.length - 1] !== lastPage - 1) {
-        items.push(lastPage - 1);
+        items[items.length - 1].label !== lastPage - 1) {
+        items.push({
+            type: 'page',
+            mayBeFastForward: true,
+            mayBeFastBackward: false,
+            label: lastPage - 1,
+            active: currentPage === lastPage - 1
+        });
     }
-    if (items[items.length - 1] !== lastPage)
-        items.push(lastPage);
-    return items;
-}
-exports.pagesToShow = pagesToShow;
-function mapPagesToPageItems(pages, currentPage) {
-    return pages.map((page) => {
-        switch (page) {
-            case -2:
-                return {
-                    type: 'fast-backward',
-                    active: false
-                };
-            case -1:
-                return {
-                    type: 'fast-forward',
-                    active: false
-                };
-            default:
-                if (page === currentPage) {
-                    return {
-                        type: 'page',
-                        label: page,
-                        active: true
-                    };
-                }
-                else {
-                    return {
-                        type: 'page',
-                        label: page,
-                        active: false
-                    };
-                }
-        }
-    });
+    if (items[items.length - 1].label !== lastPage) {
+        items.push({
+            type: 'page',
+            mayBeFastForward: false,
+            mayBeFastBackward: false,
+            label: lastPage,
+            active: currentPage === lastPage
+        });
+    }
+    return {
+        hasFastBackward,
+        hasFastForward,
+        fastBackwardTo,
+        fastForwardTo,
+        items
+    };
 }
-exports.mapPagesToPageItems = mapPagesToPageItems;
-function pageItems(currentPage, pageCount, pageSlot) {
-    const pages = pagesToShow(currentPage, pageCount, pageSlot);
-    return mapPagesToPageItems(pages, currentPage);
+exports.createPageItemsInfo = createPageItemsInfo;
+function createRange(from, to) {
+    const range = [];
+    for (let i = from; i <= to; ++i) {
+        range.push({
+            label: `${i}`,
+            value: i
+        });
+    }
+    return range;
 }
-exports.pageItems = pageItems;

package/lib/pagination/styles/dark.js

@@ -1,16 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const seemly_1 = require("seemly");
-const styles_1 = require("../../select/styles");
-const styles_2 = require("../../input/styles");
+const styles_1 = require("../../popselect/styles");
+const styles_2 = require("../../select/styles");
+const styles_3 = require("../../input/styles");
 const common_1 = require("../../_styles/common");
 const light_1 = require("./light");
 const paginationDark = {
     name: 'Pagination',
     common: common_1.commonDark,
     peers: {
-        Select: styles_1.selectDark,
-        Input: styles_2.inputDark
+        Select: styles_2.selectDark,
+        Input: styles_3.inputDark,
+        Popselect: styles_1.popselectDark
     },
     self(vars) {
         const { primaryColor, opacity3 } = vars;

package/lib/pagination/styles/light.d.ts

@@ -330,6 +330,77 @@ declare const paginationLight: import("../../_mixins").Theme<"Pagination", {
         paddingLarge: string;
         clearSize: string;
     }, any>;
+    Popselect: import("../../_mixins").Theme<"Popselect", {
+        menuBoxShadow: string;
+    }, {
+        Popover: import("../../_mixins").Theme<"Popover", {
+            fontSize: string;
+            borderRadius: string;
+            color: string;
+            dividerColor: string;
+            textColor: string;
+            boxShadow: string;
+            space: string;
+            spaceArrow: string;
+            arrowOffset: string;
+            arrowOffsetVertical: string;
+            arrowHeight: string;
+            padding: string;
+        }, any>;
+        InternalSelectMenu: import("../../_mixins").Theme<"InternalSelectMenu", {
+            optionFontSizeSmall: string;
+            optionFontSizeMedium: string;
+            optionFontSizeLarge: string;
+            optionFontSizeHuge: string;
+            optionHeightSmall: string;
+            optionHeightMedium: string;
+            optionHeightLarge: string;
+            optionHeightHuge: string;
+            borderRadius: string;
+            color: string;
+            groupHeaderTextColor: string;
+            actionDividerColor: string;
+            optionTextColor: string;
+            optionTextColorPressed: string;
+            optionTextColorDisabled: string;
+            optionTextColorActive: string;
+            optionOpacityDisabled: string;
+            optionCheckColor: string;
+            optionColorPending: string;
+            optionColorActive: string;
+            optionColorActivePending: string;
+            actionTextColor: string;
+            loadingColor: string;
+            height: string;
+            paddingSmall: string;
+            paddingMedium: string;
+            paddingLarge: string;
+            paddingHuge: string;
+            optionPaddingSmall: string;
+            optionPaddingMedium: string;
+            optionPaddingLarge: string;
+            optionPaddingHuge: string;
+            loadingSize: string;
+        }, {
+            Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
+                color: string;
+                colorHover: string;
+            }, any>;
+            Empty: import("../../_mixins").Theme<"Empty", {
+                fontSizeSmall: string;
+                fontSizeMedium: string;
+                fontSizeLarge: string;
+                fontSizeHuge: string;
+                textColor: string;
+                iconColor: string;
+                extraTextColor: string;
+                iconSizeSmall: string;
+                iconSizeMedium: string;
+                iconSizeLarge: string;
+                iconSizeHuge: string;
+            }, any>;
+        }>;
+    }>;
 }>;
 export default paginationLight;
 export declare type PaginationTheme = typeof paginationLight;

package/lib/pagination/styles/light.js

@@ -4,8 +4,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.self = void 0;
-const styles_1 = require("../../select/styles");
-const styles_2 = require("../../input/styles");
+const styles_1 = require("../../popselect/styles");
+const styles_2 = require("../../select/styles");
+const styles_3 = require("../../input/styles");
 const common_1 = require("../../_styles/common");
 const _common_1 = __importDefault(require("./_common"));
 const _mixins_1 = require("../../_mixins");
@@ -22,8 +23,9 @@ const paginationLight = (0, _mixins_1.createTheme)({
     name: 'Pagination',
     common: common_1.commonLight,
     peers: {
-        Select: styles_1.selectLight,
-        Input: styles_2.inputLight
+        Select: styles_2.selectLight,
+        Input: styles_3.inputLight,
+        Popselect: styles_1.popselectLight
     },
     self: exports.self
 });