@hh.ru/magritte-ui-number-pages 4.1.43 → 4.1.45
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/NumberPages.d.ts +1 -1
- package/NumberPages.js +99 -78
- package/NumberPages.js.map +1 -1
- package/NumberPagesAction-Bf473X9E.js +35 -0
- package/{NumberPagesAction-BbLAYsN7.js.map → NumberPagesAction-Bf473X9E.js.map} +1 -1
- package/NumberPagesAction.d.ts +1 -1
- package/NumberPagesAction.js +1 -1
- package/index.css +69 -69
- package/index.d.ts +3 -3
- package/index.js +1 -1
- package/index.mock.d.ts +1 -1
- package/index.mock.js +4 -4
- package/index.mock.js.map +1 -1
- package/package.json +5 -5
- package/usePages.js +48 -49
- package/usePages.js.map +1 -1
- package/NumberPagesAction-BbLAYsN7.js +0 -17
package/NumberPages.d.ts
CHANGED
package/NumberPages.js
CHANGED
|
@@ -4,93 +4,114 @@ import { useState, useEffect, createElement } from 'react';
|
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';
|
|
6
6
|
import { ChevronRightOutlinedSize24, ChevronLeftOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
|
|
7
|
-
import { s as styles, N as NumberPagesAction } from './NumberPagesAction-
|
|
7
|
+
import { s as styles, N as NumberPagesAction } from './NumberPagesAction-Bf473X9E.js';
|
|
8
8
|
import { usePages, PageControls } from './usePages.js';
|
|
9
9
|
import '@hh.ru/magritte-ui-typography';
|
|
10
10
|
|
|
11
11
|
const baseRenderItem = ({ isPrevious, isNext, key, ...props }) => {
|
|
12
|
-
|
|
12
|
+
return /* @__PURE__ */ createElement(NumberPagesAction, { ...props, isIcon: isPrevious || isNext, key });
|
|
13
13
|
};
|
|
14
14
|
const getPropsByScreenSize = (isXS, isS) => {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
return [2, 1];
|
|
15
|
+
if (isXS) {
|
|
16
|
+
return [0, 0];
|
|
17
|
+
} else if (isS) {
|
|
18
|
+
return [1, 1];
|
|
19
|
+
}
|
|
20
|
+
return [2, 1];
|
|
22
21
|
};
|
|
23
|
-
const NumberPages = ({
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
22
|
+
const NumberPages = ({
|
|
23
|
+
first,
|
|
24
|
+
last,
|
|
25
|
+
current,
|
|
26
|
+
onChange,
|
|
27
|
+
"aria-label": ariaLabel,
|
|
28
|
+
renderItem = baseRenderItem,
|
|
29
|
+
renderNavigation = baseRenderItem,
|
|
30
|
+
getAriaLabelItem,
|
|
31
|
+
...props
|
|
32
|
+
}) => {
|
|
33
|
+
const { isXS, isS } = useBreakpoint();
|
|
34
|
+
const [initialSiblingCount, initialBoundaryCount] = getPropsByScreenSize(isXS, isS);
|
|
35
|
+
const [siblingCount, setSiblingCount] = useState(initialSiblingCount);
|
|
36
|
+
const [boundaryCount, setBoundaryCount] = useState(initialBoundaryCount);
|
|
37
|
+
const pages = usePages({ first, last, current, siblingCount, boundaryCount });
|
|
38
|
+
useEffect(() => {
|
|
39
|
+
const [siblingCount2, boundaryCount2] = getPropsByScreenSize(isXS, isS);
|
|
40
|
+
setSiblingCount(siblingCount2);
|
|
41
|
+
setBoundaryCount(boundaryCount2);
|
|
42
|
+
}, [isXS, isS]);
|
|
43
|
+
if (first > last) {
|
|
44
|
+
throw new Error(
|
|
45
|
+
`Magritte component NumberPages: First prop more than last prop. first: ${first}, last: ${last}`
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
if (current < first || current > last) {
|
|
49
|
+
throw new Error(
|
|
50
|
+
`Magritte component NumberPages: Current is wrong. current: ${current}, first: ${first}, last: ${last}`
|
|
51
|
+
);
|
|
52
|
+
}
|
|
53
|
+
if (last - first < 1) {
|
|
54
|
+
return null;
|
|
55
|
+
}
|
|
56
|
+
const renderPageItem = (item) => {
|
|
57
|
+
const isSelected = item === current;
|
|
58
|
+
const baseProps = {
|
|
59
|
+
selected: isSelected,
|
|
60
|
+
key: item,
|
|
61
|
+
"aria-label": getAriaLabelItem?.(item)
|
|
62
|
+
};
|
|
63
|
+
switch (item) {
|
|
64
|
+
case PageControls.Previous:
|
|
65
|
+
return renderNavigation({
|
|
66
|
+
...baseProps,
|
|
67
|
+
"data-qa": "number-pages-previous",
|
|
68
|
+
onClick: () => {
|
|
69
|
+
onChange?.(current - 1);
|
|
70
|
+
},
|
|
71
|
+
isPrevious: true,
|
|
72
|
+
page: current - 1,
|
|
73
|
+
children: /* @__PURE__ */ jsx(ChevronLeftOutlinedSize24, {})
|
|
74
|
+
});
|
|
75
|
+
case PageControls.StartEllipsis:
|
|
76
|
+
case PageControls.EndEllipsis:
|
|
77
|
+
return /* @__PURE__ */ jsx("li", { "data-qa": "number-pages-ellipsis", className: styles.numberPagesEllipsis, children: "..." }, item);
|
|
78
|
+
case PageControls.Next:
|
|
79
|
+
return renderNavigation({
|
|
80
|
+
...baseProps,
|
|
81
|
+
"data-qa": "number-pages-next",
|
|
82
|
+
onClick: () => {
|
|
83
|
+
onChange?.(current + 1);
|
|
84
|
+
},
|
|
85
|
+
isNext: true,
|
|
86
|
+
page: current + 1,
|
|
87
|
+
children: /* @__PURE__ */ jsx(ChevronRightOutlinedSize24, {})
|
|
88
|
+
});
|
|
89
|
+
default:
|
|
90
|
+
return renderItem({
|
|
91
|
+
...baseProps,
|
|
92
|
+
onClick: () => {
|
|
93
|
+
if (!isSelected) {
|
|
94
|
+
onChange?.(item);
|
|
95
|
+
}
|
|
96
|
+
},
|
|
97
|
+
"data-qa": `number-pages-${item} ${isSelected ? "number-pages-selected" : ""}`,
|
|
98
|
+
page: item,
|
|
99
|
+
selected: isSelected,
|
|
100
|
+
children: item
|
|
101
|
+
});
|
|
39
102
|
}
|
|
40
|
-
|
|
41
|
-
|
|
103
|
+
};
|
|
104
|
+
return /* @__PURE__ */ jsx(
|
|
105
|
+
"nav",
|
|
106
|
+
{
|
|
107
|
+
...props,
|
|
108
|
+
"aria-label": ariaLabel,
|
|
109
|
+
className: classnames(styles.numberPagesWrapper, {
|
|
110
|
+
[styles.numberPagesWrapperWithoutNavigationButtons]: !pages.includes(PageControls.Next) && !pages.includes(PageControls.Previous)
|
|
111
|
+
}),
|
|
112
|
+
children: /* @__PURE__ */ jsx("ul", { className: styles.numberPagesContainer, children: pages.map(renderPageItem) })
|
|
42
113
|
}
|
|
43
|
-
|
|
44
|
-
const isSelected = item === current;
|
|
45
|
-
const baseProps = {
|
|
46
|
-
selected: isSelected,
|
|
47
|
-
key: item,
|
|
48
|
-
'aria-label': getAriaLabelItem?.(item),
|
|
49
|
-
};
|
|
50
|
-
switch (item) {
|
|
51
|
-
case PageControls.Previous:
|
|
52
|
-
return renderNavigation({
|
|
53
|
-
...baseProps,
|
|
54
|
-
'data-qa': 'number-pages-previous',
|
|
55
|
-
onClick: () => {
|
|
56
|
-
onChange?.(current - 1);
|
|
57
|
-
},
|
|
58
|
-
isPrevious: true,
|
|
59
|
-
page: current - 1,
|
|
60
|
-
children: jsx(ChevronLeftOutlinedSize24, {}),
|
|
61
|
-
});
|
|
62
|
-
case PageControls.StartEllipsis:
|
|
63
|
-
case PageControls.EndEllipsis:
|
|
64
|
-
return (jsx("li", { "data-qa": "number-pages-ellipsis", className: styles.numberPagesEllipsis, children: "..." }, item));
|
|
65
|
-
case PageControls.Next:
|
|
66
|
-
return renderNavigation({
|
|
67
|
-
...baseProps,
|
|
68
|
-
'data-qa': 'number-pages-next',
|
|
69
|
-
onClick: () => {
|
|
70
|
-
onChange?.(current + 1);
|
|
71
|
-
},
|
|
72
|
-
isNext: true,
|
|
73
|
-
page: current + 1,
|
|
74
|
-
children: jsx(ChevronRightOutlinedSize24, {}),
|
|
75
|
-
});
|
|
76
|
-
default:
|
|
77
|
-
return renderItem({
|
|
78
|
-
...baseProps,
|
|
79
|
-
onClick: () => {
|
|
80
|
-
if (!isSelected) {
|
|
81
|
-
onChange?.(item);
|
|
82
|
-
}
|
|
83
|
-
},
|
|
84
|
-
'data-qa': `number-pages-${item} ${isSelected ? 'number-pages-selected' : ''}`,
|
|
85
|
-
page: item,
|
|
86
|
-
selected: isSelected,
|
|
87
|
-
children: item,
|
|
88
|
-
});
|
|
89
|
-
}
|
|
90
|
-
};
|
|
91
|
-
return (jsx("nav", { ...props, "aria-label": ariaLabel, className: classnames(styles.numberPagesWrapper, {
|
|
92
|
-
[styles.numberPagesWrapperWithoutNavigationButtons]: !pages.includes(PageControls.Next) && !pages.includes(PageControls.Previous),
|
|
93
|
-
}), children: jsx("ul", { className: styles.numberPagesContainer, children: pages.map(renderPageItem) }) }));
|
|
114
|
+
);
|
|
94
115
|
};
|
|
95
116
|
|
|
96
117
|
export { NumberPages };
|
package/NumberPages.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberPages.js","sources":["src/NumberPages.tsx"],"sourcesContent":["import { ReactNode, FC, useEffect, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { ChevronLeftOutlinedSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { NumberPagesAction } from '@hh.ru/magritte-ui-number-pages/NumberPagesAction';\nimport type { NumberPagesRenderItem, NumberPagesProps } from '@hh.ru/magritte-ui-number-pages/types';\nimport { usePages, PageControls } from '@hh.ru/magritte-ui-number-pages/usePages';\n\nimport styles from './styles.less';\n\nconst baseRenderItem: NumberPagesRenderItem = ({ isPrevious, isNext, key, ...props }) => {\n return <NumberPagesAction {...props} isIcon={isPrevious || isNext} key={key} />;\n};\n\nconst getPropsByScreenSize = (isXS: boolean, isS: boolean): number[] => {\n if (isXS) {\n return [0, 0];\n } else if (isS) {\n return [1, 1];\n }\n return [2, 1];\n};\n\nexport const NumberPages: FC<NumberPagesProps> = ({\n first,\n last,\n current,\n onChange,\n 'aria-label': ariaLabel,\n renderItem = baseRenderItem,\n renderNavigation = baseRenderItem,\n getAriaLabelItem,\n ...props\n}) => {\n const { isXS, isS } = useBreakpoint();\n const [initialSiblingCount, initialBoundaryCount] = getPropsByScreenSize(isXS, isS);\n const [siblingCount, setSiblingCount] = useState(initialSiblingCount);\n const [boundaryCount, setBoundaryCount] = useState(initialBoundaryCount);\n const pages = usePages({ first, last, current, siblingCount, boundaryCount });\n\n useEffect(() => {\n const [siblingCount, boundaryCount] = getPropsByScreenSize(isXS, isS);\n setSiblingCount(siblingCount);\n setBoundaryCount(boundaryCount);\n }, [isXS, isS]);\n\n if (first > last) {\n throw new Error(\n `Magritte component NumberPages: First prop more than last prop. first: ${first}, last: ${last}`\n );\n }\n\n if (current < first || current > last) {\n throw new Error(\n `Magritte component NumberPages: Current is wrong. current: ${current}, first: ${first}, last: ${last}`\n );\n }\n\n if (last - first < 1) {\n return null;\n }\n\n const renderPageItem = (item: number): ReactNode => {\n const isSelected = item === current;\n\n const baseProps = {\n selected: isSelected,\n key: item,\n 'aria-label': getAriaLabelItem?.(item),\n };\n\n switch (item) {\n case PageControls.Previous:\n return renderNavigation({\n ...baseProps,\n 'data-qa': 'number-pages-previous',\n onClick: () => {\n onChange?.(current - 1);\n },\n isPrevious: true,\n page: current - 1,\n children: <ChevronLeftOutlinedSize24 />,\n });\n case PageControls.StartEllipsis:\n case PageControls.EndEllipsis:\n return (\n <li key={item} data-qa=\"number-pages-ellipsis\" className={styles.numberPagesEllipsis}>\n ...\n </li>\n );\n case PageControls.Next:\n return renderNavigation({\n ...baseProps,\n 'data-qa': 'number-pages-next',\n onClick: () => {\n onChange?.(current + 1);\n },\n isNext: true,\n page: current + 1,\n children: <ChevronRightOutlinedSize24 />,\n });\n default:\n return renderItem({\n ...baseProps,\n onClick: () => {\n if (!isSelected) {\n onChange?.(item);\n }\n },\n 'data-qa': `number-pages-${item} ${isSelected ? 'number-pages-selected' : ''}`,\n page: item,\n selected: isSelected,\n children: item,\n });\n }\n };\n\n return (\n <nav\n {...props}\n aria-label={ariaLabel}\n className={classnames(styles.numberPagesWrapper, {\n [styles.numberPagesWrapperWithoutNavigationButtons]:\n !pages.includes(PageControls.Next) && !pages.includes(PageControls.Previous),\n })}\n >\n <ul className={styles.numberPagesContainer}>{pages.map(renderPageItem)}</ul>\n </nav>\n );\n};\n"],"names":["
|
|
1
|
+
{"version":3,"file":"NumberPages.js","sources":["src/NumberPages.tsx"],"sourcesContent":["import { ReactNode, FC, useEffect, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { ChevronLeftOutlinedSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { NumberPagesAction } from '@hh.ru/magritte-ui-number-pages/NumberPagesAction';\nimport type { NumberPagesRenderItem, NumberPagesProps } from '@hh.ru/magritte-ui-number-pages/types';\nimport { usePages, PageControls } from '@hh.ru/magritte-ui-number-pages/usePages';\n\nimport styles from './styles.less';\n\nconst baseRenderItem: NumberPagesRenderItem = ({ isPrevious, isNext, key, ...props }) => {\n return <NumberPagesAction {...props} isIcon={isPrevious || isNext} key={key} />;\n};\n\nconst getPropsByScreenSize = (isXS: boolean, isS: boolean): number[] => {\n if (isXS) {\n return [0, 0];\n } else if (isS) {\n return [1, 1];\n }\n return [2, 1];\n};\n\nexport const NumberPages: FC<NumberPagesProps> = ({\n first,\n last,\n current,\n onChange,\n 'aria-label': ariaLabel,\n renderItem = baseRenderItem,\n renderNavigation = baseRenderItem,\n getAriaLabelItem,\n ...props\n}) => {\n const { isXS, isS } = useBreakpoint();\n const [initialSiblingCount, initialBoundaryCount] = getPropsByScreenSize(isXS, isS);\n const [siblingCount, setSiblingCount] = useState(initialSiblingCount);\n const [boundaryCount, setBoundaryCount] = useState(initialBoundaryCount);\n const pages = usePages({ first, last, current, siblingCount, boundaryCount });\n\n useEffect(() => {\n const [siblingCount, boundaryCount] = getPropsByScreenSize(isXS, isS);\n setSiblingCount(siblingCount);\n setBoundaryCount(boundaryCount);\n }, [isXS, isS]);\n\n if (first > last) {\n throw new Error(\n `Magritte component NumberPages: First prop more than last prop. first: ${first}, last: ${last}`\n );\n }\n\n if (current < first || current > last) {\n throw new Error(\n `Magritte component NumberPages: Current is wrong. current: ${current}, first: ${first}, last: ${last}`\n );\n }\n\n if (last - first < 1) {\n return null;\n }\n\n const renderPageItem = (item: number): ReactNode => {\n const isSelected = item === current;\n\n const baseProps = {\n selected: isSelected,\n key: item,\n 'aria-label': getAriaLabelItem?.(item),\n };\n\n switch (item) {\n case PageControls.Previous:\n return renderNavigation({\n ...baseProps,\n 'data-qa': 'number-pages-previous',\n onClick: () => {\n onChange?.(current - 1);\n },\n isPrevious: true,\n page: current - 1,\n children: <ChevronLeftOutlinedSize24 />,\n });\n case PageControls.StartEllipsis:\n case PageControls.EndEllipsis:\n return (\n <li key={item} data-qa=\"number-pages-ellipsis\" className={styles.numberPagesEllipsis}>\n ...\n </li>\n );\n case PageControls.Next:\n return renderNavigation({\n ...baseProps,\n 'data-qa': 'number-pages-next',\n onClick: () => {\n onChange?.(current + 1);\n },\n isNext: true,\n page: current + 1,\n children: <ChevronRightOutlinedSize24 />,\n });\n default:\n return renderItem({\n ...baseProps,\n onClick: () => {\n if (!isSelected) {\n onChange?.(item);\n }\n },\n 'data-qa': `number-pages-${item} ${isSelected ? 'number-pages-selected' : ''}`,\n page: item,\n selected: isSelected,\n children: item,\n });\n }\n };\n\n return (\n <nav\n {...props}\n aria-label={ariaLabel}\n className={classnames(styles.numberPagesWrapper, {\n [styles.numberPagesWrapperWithoutNavigationButtons]:\n !pages.includes(PageControls.Next) && !pages.includes(PageControls.Previous),\n })}\n >\n <ul className={styles.numberPagesContainer}>{pages.map(renderPageItem)}</ul>\n </nav>\n );\n};\n"],"names":["siblingCount","boundaryCount"],"mappings":"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"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import './index.css';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import classnames from 'classnames';
|
|
4
|
+
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
5
|
+
|
|
6
|
+
var styles = {"number-pages-wrapper":"magritte-number-pages-wrapper___lYp70_4-1-45","numberPagesWrapper":"magritte-number-pages-wrapper___lYp70_4-1-45","number-pages-wrapper-without-navigation-buttons":"magritte-number-pages-wrapper-without-navigation-buttons___78a7R_4-1-45","numberPagesWrapperWithoutNavigationButtons":"magritte-number-pages-wrapper-without-navigation-buttons___78a7R_4-1-45","number-pages-container":"magritte-number-pages-container___YIJLn_4-1-45","numberPagesContainer":"magritte-number-pages-container___YIJLn_4-1-45","number-pages-ellipsis":"magritte-number-pages-ellipsis___GNIbV_4-1-45","numberPagesEllipsis":"magritte-number-pages-ellipsis___GNIbV_4-1-45","number-pages-action":"magritte-number-pages-action___e3ozw_4-1-45","numberPagesAction":"magritte-number-pages-action___e3ozw_4-1-45","number-pages-action-icon":"magritte-number-pages-action-icon___lwXFB_4-1-45","numberPagesActionIcon":"magritte-number-pages-action-icon___lwXFB_4-1-45","number-pages-action-selected":"magritte-number-pages-action-selected___N5Tl4_4-1-45","numberPagesActionSelected":"magritte-number-pages-action-selected___N5Tl4_4-1-45"};
|
|
7
|
+
|
|
8
|
+
const NumberPagesAction = ({
|
|
9
|
+
children,
|
|
10
|
+
selected = false,
|
|
11
|
+
isIcon = false,
|
|
12
|
+
Element = "button",
|
|
13
|
+
"aria-label": ariaLabel,
|
|
14
|
+
page,
|
|
15
|
+
...props
|
|
16
|
+
}) => {
|
|
17
|
+
const buttonProps = Element === "button" ? { type: "button" } : {};
|
|
18
|
+
return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Text, { typography: "label-2-regular", children: /* @__PURE__ */ jsx(
|
|
19
|
+
Element,
|
|
20
|
+
{
|
|
21
|
+
...props,
|
|
22
|
+
...buttonProps,
|
|
23
|
+
"aria-current": selected,
|
|
24
|
+
"aria-label": ariaLabel,
|
|
25
|
+
className: classnames(styles.numberPagesAction, {
|
|
26
|
+
[styles.numberPagesActionSelected]: selected,
|
|
27
|
+
[styles.numberPagesActionIcon]: isIcon
|
|
28
|
+
}),
|
|
29
|
+
children
|
|
30
|
+
}
|
|
31
|
+
) }) });
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
export { NumberPagesAction as N, styles as s };
|
|
35
|
+
//# sourceMappingURL=NumberPagesAction-Bf473X9E.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberPagesAction-
|
|
1
|
+
{"version":3,"file":"NumberPagesAction-Bf473X9E.js","sources":["src/NumberPagesAction.tsx"],"sourcesContent":["import classnames from 'classnames';\n\nimport type { PolymorphicComponent } from '@hh.ru/magritte-types';\nimport type { NumberPagesActionProps } from '@hh.ru/magritte-ui-number-pages/types';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './styles.less';\n\nexport const NumberPagesAction: PolymorphicComponent<NumberPagesActionProps, 'button'> = ({\n children,\n selected = false,\n isIcon = false,\n Element = 'button',\n 'aria-label': ariaLabel,\n page,\n ...props\n}) => {\n const buttonProps = Element === 'button' ? ({ type: 'button' } as const) : {};\n\n return (\n <li>\n <Text typography=\"label-2-regular\">\n <Element\n {...props}\n {...buttonProps}\n aria-current={selected}\n aria-label={ariaLabel}\n className={classnames(styles.numberPagesAction, {\n [styles.numberPagesActionSelected]: selected,\n [styles.numberPagesActionIcon]: isIcon,\n })}\n >\n {children}\n </Element>\n </Text>\n </li>\n );\n};\n"],"names":[],"mappings":";;;;;;AAQO,MAAM,oBAA4E,CAAC;AAAA,EACtF,QAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACX,MAAS,GAAA,KAAA;AAAA,EACT,OAAU,GAAA,QAAA;AAAA,EACV,YAAc,EAAA,SAAA;AAAA,EACd,IAAA;AAAA,EACA,GAAG,KAAA;AACP,CAAM,KAAA;AACF,EAAA,MAAM,cAAc,OAAY,KAAA,QAAA,GAAY,EAAE,IAAM,EAAA,QAAA,KAAuB,EAAC,CAAA;AAE5E,EAAA,uBACK,GAAA,CAAA,IAAA,EAAA,EACG,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,YAAW,iBACb,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACI,GAAG,KAAA;AAAA,MACH,GAAG,WAAA;AAAA,MACJ,cAAc,EAAA,QAAA;AAAA,MACd,YAAY,EAAA,SAAA;AAAA,MACZ,SAAA,EAAW,UAAW,CAAA,MAAA,CAAO,iBAAmB,EAAA;AAAA,QAC5C,CAAC,MAAO,CAAA,yBAAyB,GAAG,QAAA;AAAA,QACpC,CAAC,MAAO,CAAA,qBAAqB,GAAG,MAAA;AAAA,OACnC,CAAA;AAAA,MAEA,QAAA;AAAA,KAAA;AAAA,KAET,CACJ,EAAA,CAAA,CAAA;AAER;;;;"}
|
package/NumberPagesAction.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { PolymorphicComponent } from '@hh.ru/magritte-types';
|
|
2
|
-
import type { NumberPagesActionProps } from '
|
|
2
|
+
import type { NumberPagesActionProps } from './types';
|
|
3
3
|
export declare const NumberPagesAction: PolymorphicComponent<NumberPagesActionProps, 'button'>;
|
package/NumberPagesAction.js
CHANGED
|
@@ -2,5 +2,5 @@ import './index.css';
|
|
|
2
2
|
import 'react/jsx-runtime';
|
|
3
3
|
import 'classnames';
|
|
4
4
|
import '@hh.ru/magritte-ui-typography';
|
|
5
|
-
export { N as NumberPagesAction } from './NumberPagesAction-
|
|
5
|
+
export { N as NumberPagesAction } from './NumberPagesAction-Bf473X9E.js';
|
|
6
6
|
//# sourceMappingURL=NumberPagesAction.js.map
|
package/index.css
CHANGED
|
@@ -1,67 +1,67 @@
|
|
|
1
1
|
:root{
|
|
2
|
-
--magritte-color-component-number-pages-background-content-
|
|
3
|
-
--magritte-color-component-number-pages-stroke-content-
|
|
4
|
-
--magritte-color-component-number-pages-item-text-unselected-
|
|
5
|
-
--magritte-color-component-number-pages-item-text-selected-
|
|
6
|
-
--magritte-color-component-number-pages-item-text-state-unselected-hovered-
|
|
7
|
-
--magritte-color-component-number-pages-item-text-state-unselected-pressed-
|
|
8
|
-
--magritte-color-component-number-pages-item-icon-content-
|
|
9
|
-
--magritte-color-component-number-pages-item-icon-state-content-hovered-
|
|
10
|
-
--magritte-color-component-number-pages-item-icon-state-content-pressed-
|
|
11
|
-
--magritte-color-component-number-pages-item-background-selected-
|
|
12
|
-
--magritte-color-component-number-pages-item-background-unselected-
|
|
13
|
-
--magritte-color-component-number-pages-item-background-state-unselected-hovered-
|
|
14
|
-
--magritte-color-component-number-pages-item-background-state-unselected-pressed-
|
|
15
|
-
--magritte-color-component-number-pages-stroke-state-focused-accessible-
|
|
2
|
+
--magritte-color-component-number-pages-background-content-v26-0-1:#ffffff;
|
|
3
|
+
--magritte-color-component-number-pages-stroke-content-v26-0-1:#DCE3EB;
|
|
4
|
+
--magritte-color-component-number-pages-item-text-unselected-v26-0-1:#768694;
|
|
5
|
+
--magritte-color-component-number-pages-item-text-selected-v26-0-1:#000000;
|
|
6
|
+
--magritte-color-component-number-pages-item-text-state-unselected-hovered-v26-0-1:#000000;
|
|
7
|
+
--magritte-color-component-number-pages-item-text-state-unselected-pressed-v26-0-1:#000000;
|
|
8
|
+
--magritte-color-component-number-pages-item-icon-content-v26-0-1:#768694;
|
|
9
|
+
--magritte-color-component-number-pages-item-icon-state-content-hovered-v26-0-1:#000000;
|
|
10
|
+
--magritte-color-component-number-pages-item-icon-state-content-pressed-v26-0-1:#000000;
|
|
11
|
+
--magritte-color-component-number-pages-item-background-selected-v26-0-1:#F1F4F9;
|
|
12
|
+
--magritte-color-component-number-pages-item-background-unselected-v26-0-1:#dce3eb00;
|
|
13
|
+
--magritte-color-component-number-pages-item-background-state-unselected-hovered-v26-0-1:#F1F4F9;
|
|
14
|
+
--magritte-color-component-number-pages-item-background-state-unselected-pressed-v26-0-1:#DCE3EB;
|
|
15
|
+
--magritte-color-component-number-pages-stroke-state-focused-accessible-v26-0-1:#0070ff7a;
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
:root{
|
|
19
|
-
--magritte-semantic-animation-ease-in-out-100-timing-function-
|
|
20
|
-
--magritte-semantic-animation-ease-in-out-100-duration-
|
|
21
|
-
--magritte-semantic-animation-ease-in-out-200-timing-function-
|
|
22
|
-
--magritte-semantic-animation-ease-in-out-200-duration-
|
|
19
|
+
--magritte-semantic-animation-ease-in-out-100-timing-function-v26-0-1:cubic-bezier(0.25, 0.1, 0.25, 1);
|
|
20
|
+
--magritte-semantic-animation-ease-in-out-100-duration-v26-0-1:100ms;
|
|
21
|
+
--magritte-semantic-animation-ease-in-out-200-timing-function-v26-0-1:cubic-bezier(0.25, 0.1, 0.25, 1);
|
|
22
|
+
--magritte-semantic-animation-ease-in-out-200-duration-v26-0-1:200ms;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
25
|
.magritte-night-theme{
|
|
26
|
-
--magritte-color-component-number-pages-background-content-
|
|
27
|
-
--magritte-color-component-number-pages-stroke-content-
|
|
28
|
-
--magritte-color-component-number-pages-item-text-unselected-
|
|
29
|
-
--magritte-color-component-number-pages-item-text-selected-
|
|
30
|
-
--magritte-color-component-number-pages-item-text-state-unselected-hovered-
|
|
31
|
-
--magritte-color-component-number-pages-item-text-state-unselected-pressed-
|
|
32
|
-
--magritte-color-component-number-pages-item-icon-content-
|
|
33
|
-
--magritte-color-component-number-pages-item-icon-state-content-hovered-
|
|
34
|
-
--magritte-color-component-number-pages-item-icon-state-content-pressed-
|
|
35
|
-
--magritte-color-component-number-pages-item-background-selected-
|
|
36
|
-
--magritte-color-component-number-pages-item-background-state-unselected-hovered-
|
|
37
|
-
--magritte-color-component-number-pages-item-background-state-unselected-pressed-
|
|
38
|
-
}
|
|
39
|
-
.magritte-number-pages-wrapper___lYp70_4-1-
|
|
26
|
+
--magritte-color-component-number-pages-background-content-v26-0-1:#000000;
|
|
27
|
+
--magritte-color-component-number-pages-stroke-content-v26-0-1:#3B3B3B;
|
|
28
|
+
--magritte-color-component-number-pages-item-text-unselected-v26-0-1:#ABABAB;
|
|
29
|
+
--magritte-color-component-number-pages-item-text-selected-v26-0-1:#ffffff;
|
|
30
|
+
--magritte-color-component-number-pages-item-text-state-unselected-hovered-v26-0-1:#ffffff;
|
|
31
|
+
--magritte-color-component-number-pages-item-text-state-unselected-pressed-v26-0-1:#ffffff;
|
|
32
|
+
--magritte-color-component-number-pages-item-icon-content-v26-0-1:#ABABAB;
|
|
33
|
+
--magritte-color-component-number-pages-item-icon-state-content-hovered-v26-0-1:#ffffff;
|
|
34
|
+
--magritte-color-component-number-pages-item-icon-state-content-pressed-v26-0-1:#ffffff;
|
|
35
|
+
--magritte-color-component-number-pages-item-background-selected-v26-0-1:#262626;
|
|
36
|
+
--magritte-color-component-number-pages-item-background-state-unselected-hovered-v26-0-1:#262626;
|
|
37
|
+
--magritte-color-component-number-pages-item-background-state-unselected-pressed-v26-0-1:#262626;
|
|
38
|
+
}
|
|
39
|
+
.magritte-number-pages-wrapper___lYp70_4-1-45{
|
|
40
40
|
display:flex;
|
|
41
41
|
width:100%;
|
|
42
42
|
}
|
|
43
43
|
@media (min-width: 350px){
|
|
44
|
-
.magritte-number-pages-wrapper___lYp70_4-1-
|
|
44
|
+
.magritte-number-pages-wrapper___lYp70_4-1-45{
|
|
45
45
|
display:inline-flex;
|
|
46
46
|
width:auto;
|
|
47
47
|
}
|
|
48
48
|
}
|
|
49
|
-
.magritte-number-pages-wrapper-without-navigation-buttons___78a7R_4-1-
|
|
49
|
+
.magritte-number-pages-wrapper-without-navigation-buttons___78a7R_4-1-45{
|
|
50
50
|
display:inline-flex;
|
|
51
51
|
width:auto;
|
|
52
52
|
}
|
|
53
|
-
.magritte-number-pages-container___YIJLn_4-1-
|
|
53
|
+
.magritte-number-pages-container___YIJLn_4-1-45{
|
|
54
54
|
display:flex;
|
|
55
55
|
width:100%;
|
|
56
56
|
justify-content:space-between;
|
|
57
57
|
align-items:center;
|
|
58
58
|
border-radius:26px;
|
|
59
59
|
padding:calc(6px - 1px);
|
|
60
|
-
border:1px solid var(--magritte-color-component-number-pages-stroke-content-
|
|
61
|
-
background:var(--magritte-color-component-number-pages-background-content-
|
|
60
|
+
border:1px solid var(--magritte-color-component-number-pages-stroke-content-v26-0-1);
|
|
61
|
+
background:var(--magritte-color-component-number-pages-background-content-v26-0-1);
|
|
62
62
|
}
|
|
63
63
|
@media (min-width: 350px){
|
|
64
|
-
.magritte-number-pages-container___YIJLn_4-1-
|
|
64
|
+
.magritte-number-pages-container___YIJLn_4-1-45{
|
|
65
65
|
display:inline-flex;
|
|
66
66
|
justify-content:center;
|
|
67
67
|
gap:8px;
|
|
@@ -69,23 +69,23 @@
|
|
|
69
69
|
}
|
|
70
70
|
}
|
|
71
71
|
@media (min-width: 600px){
|
|
72
|
-
.magritte-number-pages-container___YIJLn_4-1-
|
|
72
|
+
.magritte-number-pages-container___YIJLn_4-1-45{
|
|
73
73
|
gap:4px;
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
76
|
@media (min-width: 640px){
|
|
77
|
-
.magritte-number-pages-container___YIJLn_4-1-
|
|
77
|
+
.magritte-number-pages-container___YIJLn_4-1-45{
|
|
78
78
|
gap:8px;
|
|
79
79
|
}
|
|
80
80
|
}
|
|
81
|
-
.magritte-number-pages-ellipsis___GNIbV_4-1-
|
|
81
|
+
.magritte-number-pages-ellipsis___GNIbV_4-1-45{
|
|
82
82
|
display:flex;
|
|
83
83
|
height:40px;
|
|
84
84
|
width:40px;
|
|
85
85
|
align-items:center;
|
|
86
86
|
justify-content:center;
|
|
87
87
|
}
|
|
88
|
-
.magritte-number-pages-action___e3ozw_4-1-
|
|
88
|
+
.magritte-number-pages-action___e3ozw_4-1-45{
|
|
89
89
|
display:flex;
|
|
90
90
|
align-items:center;
|
|
91
91
|
justify-content:center;
|
|
@@ -95,54 +95,54 @@
|
|
|
95
95
|
min-width:40px;
|
|
96
96
|
border-radius:20px;
|
|
97
97
|
padding:5px 14px;
|
|
98
|
-
color:var(--magritte-color-component-number-pages-item-text-unselected-
|
|
99
|
-
background-color:var(--magritte-color-component-number-pages-item-background-unselected-
|
|
100
|
-
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-content-
|
|
98
|
+
color:var(--magritte-color-component-number-pages-item-text-unselected-v26-0-1);
|
|
99
|
+
background-color:var(--magritte-color-component-number-pages-item-background-unselected-v26-0-1);
|
|
100
|
+
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-content-v26-0-1);
|
|
101
101
|
}
|
|
102
|
-
.magritte-number-pages-action___e3ozw_4-1-
|
|
103
|
-
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-state-content-pressed-
|
|
104
|
-
color:var(--magritte-color-component-number-pages-item-text-state-unselected-pressed-
|
|
105
|
-
background-color:var(--magritte-color-component-number-pages-item-background-state-unselected-pressed-
|
|
102
|
+
.magritte-number-pages-action___e3ozw_4-1-45:active{
|
|
103
|
+
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-state-content-pressed-v26-0-1);
|
|
104
|
+
color:var(--magritte-color-component-number-pages-item-text-state-unselected-pressed-v26-0-1);
|
|
105
|
+
background-color:var(--magritte-color-component-number-pages-item-background-state-unselected-pressed-v26-0-1);
|
|
106
106
|
}
|
|
107
107
|
@media (prefers-reduced-motion: no-preference){
|
|
108
|
-
.magritte-number-pages-action___e3ozw_4-1-
|
|
109
|
-
transition:transform var(--magritte-semantic-animation-ease-in-out-100-duration-
|
|
108
|
+
.magritte-number-pages-action___e3ozw_4-1-45:active{
|
|
109
|
+
transition:transform var(--magritte-semantic-animation-ease-in-out-100-duration-v26-0-1) var(--magritte-semantic-animation-ease-in-out-100-timing-function-v26-0-1);
|
|
110
110
|
transform:scale(0.96);
|
|
111
111
|
}
|
|
112
112
|
}
|
|
113
|
-
.magritte-number-pages-action___e3ozw_4-1-
|
|
114
|
-
outline:var(--magritte-color-component-number-pages-stroke-state-focused-accessible-
|
|
113
|
+
.magritte-number-pages-action___e3ozw_4-1-45.focus-visible{
|
|
114
|
+
outline:var(--magritte-color-component-number-pages-stroke-state-focused-accessible-v26-0-1) solid 4px;
|
|
115
115
|
}
|
|
116
116
|
@media (prefers-reduced-motion: no-preference){
|
|
117
|
-
.magritte-number-pages-action___e3ozw_4-1-
|
|
118
|
-
transition:transform var(--magritte-semantic-animation-ease-in-out-200-duration-
|
|
117
|
+
.magritte-number-pages-action___e3ozw_4-1-45{
|
|
118
|
+
transition:transform var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-1) var(--magritte-semantic-animation-ease-in-out-200-timing-function-v26-0-1);
|
|
119
119
|
transform:scale(1);
|
|
120
120
|
}
|
|
121
121
|
}
|
|
122
122
|
@media (min-width: 1020px){
|
|
123
|
-
body.magritte-old-layout .magritte-number-pages-action___e3ozw_4-1-
|
|
124
|
-
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-state-content-hovered-
|
|
125
|
-
color:var(--magritte-color-component-number-pages-item-text-state-unselected-hovered-
|
|
126
|
-
background-color:var(--magritte-color-component-number-pages-item-background-state-unselected-hovered-
|
|
123
|
+
body.magritte-old-layout .magritte-number-pages-action___e3ozw_4-1-45:hover:not(:active){
|
|
124
|
+
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-state-content-hovered-v26-0-1);
|
|
125
|
+
color:var(--magritte-color-component-number-pages-item-text-state-unselected-hovered-v26-0-1);
|
|
126
|
+
background-color:var(--magritte-color-component-number-pages-item-background-state-unselected-hovered-v26-0-1);
|
|
127
127
|
}
|
|
128
128
|
}
|
|
129
129
|
@media (min-width: 1024px){
|
|
130
|
-
body:not(.magritte-old-layout) .magritte-number-pages-action___e3ozw_4-1-
|
|
131
|
-
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-state-content-hovered-
|
|
132
|
-
color:var(--magritte-color-component-number-pages-item-text-state-unselected-hovered-
|
|
133
|
-
background-color:var(--magritte-color-component-number-pages-item-background-state-unselected-hovered-
|
|
130
|
+
body:not(.magritte-old-layout) .magritte-number-pages-action___e3ozw_4-1-45:hover:not(:active){
|
|
131
|
+
--magritte-ui-icon-color-override:var(--magritte-color-component-number-pages-item-icon-state-content-hovered-v26-0-1);
|
|
132
|
+
color:var(--magritte-color-component-number-pages-item-text-state-unselected-hovered-v26-0-1);
|
|
133
|
+
background-color:var(--magritte-color-component-number-pages-item-background-state-unselected-hovered-v26-0-1);
|
|
134
134
|
}
|
|
135
135
|
}
|
|
136
|
-
.magritte-number-pages-action-icon___lwXFB_4-1-
|
|
136
|
+
.magritte-number-pages-action-icon___lwXFB_4-1-45{
|
|
137
137
|
padding:5px 8px;
|
|
138
138
|
}
|
|
139
|
-
.magritte-number-pages-action-selected___N5Tl4_4-1-
|
|
140
|
-
.magritte-number-pages-action-selected___N5Tl4_4-1-
|
|
141
|
-
.magritte-number-pages-action-selected___N5Tl4_4-1-
|
|
139
|
+
.magritte-number-pages-action-selected___N5Tl4_4-1-45,
|
|
140
|
+
.magritte-number-pages-action-selected___N5Tl4_4-1-45:hover,
|
|
141
|
+
.magritte-number-pages-action-selected___N5Tl4_4-1-45:active{
|
|
142
142
|
pointer-events:none;
|
|
143
143
|
user-select:none;
|
|
144
144
|
transform:none;
|
|
145
|
-
color:var(--magritte-color-component-number-pages-item-text-selected-
|
|
146
|
-
background-color:var(--magritte-color-component-number-pages-item-background-selected-
|
|
145
|
+
color:var(--magritte-color-component-number-pages-item-text-selected-v26-0-1);
|
|
146
|
+
background-color:var(--magritte-color-component-number-pages-item-background-selected-v26-0-1);
|
|
147
147
|
cursor:default;
|
|
148
148
|
}
|
package/index.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export * from '
|
|
2
|
-
export * from '
|
|
3
|
-
export type { NumberPagesProps, NumberPagesRenderItem, NumberPagesActionProps, } from '
|
|
1
|
+
export * from './NumberPages';
|
|
2
|
+
export * from './NumberPagesAction';
|
|
3
|
+
export type { NumberPagesProps, NumberPagesRenderItem, NumberPagesActionProps, } from './types';
|
package/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
export { NumberPages } from './NumberPages.js';
|
|
3
|
-
export { N as NumberPagesAction } from './NumberPagesAction-
|
|
3
|
+
export { N as NumberPagesAction } from './NumberPagesAction-Bf473X9E.js';
|
|
4
4
|
import 'react/jsx-runtime';
|
|
5
5
|
import 'react';
|
|
6
6
|
import 'classnames';
|
package/index.mock.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
|
-
export type { NumberPagesProps, NumberPagesRenderItem, NumberPagesActionProps, } from '
|
|
2
|
+
export type { NumberPagesProps, NumberPagesRenderItem, NumberPagesActionProps, } from './types';
|
|
3
3
|
export declare const NumberPages: FC<Record<string, unknown>>;
|
|
4
4
|
export declare const NumberPagesAction: FC<Record<string, unknown>>;
|
package/index.mock.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { mockComponent } from '@hh.ru/magritte-ui-mock-component';
|
|
3
3
|
|
|
4
|
-
const NumberPages = mockComponent(
|
|
5
|
-
|
|
4
|
+
const NumberPages = mockComponent("NumberPages", void 0, {
|
|
5
|
+
withChildren: true
|
|
6
6
|
});
|
|
7
|
-
const NumberPagesAction = mockComponent(
|
|
8
|
-
|
|
7
|
+
const NumberPagesAction = mockComponent("NumberPagesAction", void 0, {
|
|
8
|
+
withChildren: false
|
|
9
9
|
});
|
|
10
10
|
|
|
11
11
|
export { NumberPages, NumberPagesAction };
|
package/index.mock.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mock.js","sources":["src/index.mock.ts"],"sourcesContent":["import { FC } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport type {\n NumberPagesProps,\n NumberPagesRenderItem,\n NumberPagesActionProps,\n} from '@hh.ru/magritte-ui-number-pages/types';\n\nexport const NumberPages: FC<Record<string, unknown>> = mockComponent('NumberPages', undefined, {\n withChildren: true,\n});\n\nexport const NumberPagesAction: FC<Record<string, unknown>> = mockComponent('NumberPagesAction', undefined, {\n withChildren: false,\n});\n"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"index.mock.js","sources":["src/index.mock.ts"],"sourcesContent":["import { FC } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport type {\n NumberPagesProps,\n NumberPagesRenderItem,\n NumberPagesActionProps,\n} from '@hh.ru/magritte-ui-number-pages/types';\n\nexport const NumberPages: FC<Record<string, unknown>> = mockComponent('NumberPages', undefined, {\n withChildren: true,\n});\n\nexport const NumberPagesAction: FC<Record<string, unknown>> = mockComponent('NumberPagesAction', undefined, {\n withChildren: false,\n});\n"],"names":[],"mappings":";;AAUa,MAAA,WAAA,GAA2C,aAAc,CAAA,aAAA,EAAe,KAAW,CAAA,EAAA;AAAA,EAC5F,YAAc,EAAA,IAAA;AAClB,CAAC,EAAA;AAEY,MAAA,iBAAA,GAAiD,aAAc,CAAA,mBAAA,EAAqB,KAAW,CAAA,EAAA;AAAA,EACxG,YAAc,EAAA,KAAA;AAClB,CAAC;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hh.ru/magritte-ui-number-pages",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.45",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"sideEffects": [
|
|
@@ -19,12 +19,12 @@
|
|
|
19
19
|
"watch": "yarn root:watch $(pwd)"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@hh.ru/magritte-design-tokens": "
|
|
22
|
+
"@hh.ru/magritte-design-tokens": "26.0.1",
|
|
23
23
|
"@hh.ru/magritte-types": "5.0.8",
|
|
24
24
|
"@hh.ru/magritte-ui-breakpoint": "6.1.2",
|
|
25
|
-
"@hh.ru/magritte-ui-icon": "15.1.
|
|
25
|
+
"@hh.ru/magritte-ui-icon": "15.1.5",
|
|
26
26
|
"@hh.ru/magritte-ui-mock-component": "1.1.8",
|
|
27
|
-
"@hh.ru/magritte-ui-typography": "5.3.
|
|
27
|
+
"@hh.ru/magritte-ui-typography": "5.3.16"
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
30
30
|
"classnames": ">=2.3.2",
|
|
@@ -33,5 +33,5 @@
|
|
|
33
33
|
"publishConfig": {
|
|
34
34
|
"access": "public"
|
|
35
35
|
},
|
|
36
|
-
"gitHead": "
|
|
36
|
+
"gitHead": "f6539d7a0e7cd42dd851458db1de04a748bbee03"
|
|
37
37
|
}
|
package/usePages.js
CHANGED
|
@@ -1,61 +1,60 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
const range = (start, end) => {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
return Array.from({ length }, (_, i) => start + i);
|
|
3
|
+
const length = end - start + 1;
|
|
4
|
+
return Array.from({ length }, (_, i) => start + i);
|
|
6
5
|
};
|
|
7
|
-
var PageControls
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
})(PageControls ||
|
|
6
|
+
var PageControls = /* @__PURE__ */ ((PageControls2) => {
|
|
7
|
+
PageControls2[PageControls2["Previous"] = -1] = "Previous";
|
|
8
|
+
PageControls2[PageControls2["Next"] = -2] = "Next";
|
|
9
|
+
PageControls2[PageControls2["StartEllipsis"] = -3] = "StartEllipsis";
|
|
10
|
+
PageControls2[PageControls2["EndEllipsis"] = -4] = "EndEllipsis";
|
|
11
|
+
return PageControls2;
|
|
12
|
+
})(PageControls || {});
|
|
14
13
|
const CURENT_PAGE_AND_ELLIPSIS_POSITION = 2;
|
|
15
14
|
const usePages = ({ last, first, current, boundaryCount, siblingCount }) => {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
15
|
+
const count = last - first + 1;
|
|
16
|
+
const startPages = range(first, Math.min(first - 1 + boundaryCount, last));
|
|
17
|
+
const endPages = range(Math.max(count - boundaryCount + first, boundaryCount + first), last);
|
|
18
|
+
const siblingsStart = Math.max(
|
|
19
|
+
Math.min(
|
|
20
|
+
// Настоящее начальное значение для siblings node
|
|
21
|
+
current - siblingCount,
|
|
22
|
+
// Нижняя граница, от max
|
|
23
|
+
last - boundaryCount - siblingCount * 2 - CURENT_PAGE_AND_ELLIPSIS_POSITION
|
|
24
|
+
),
|
|
24
25
|
// Больше стартовой страницы
|
|
25
|
-
startPages.length > 0 ? startPages[0] + CURENT_PAGE_AND_ELLIPSIS_POSITION : first + 1
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
26
|
+
startPages.length > 0 ? startPages[0] + CURENT_PAGE_AND_ELLIPSIS_POSITION : first + 1
|
|
27
|
+
);
|
|
28
|
+
const siblingsEnd = Math.min(
|
|
29
|
+
Math.max(
|
|
30
|
+
// Настоящее конечное значение для siblings node
|
|
31
|
+
current + siblingCount,
|
|
32
|
+
// Верхняя граница, от min
|
|
33
|
+
first + boundaryCount + siblingCount * 2 + CURENT_PAGE_AND_ELLIPSIS_POSITION
|
|
34
|
+
),
|
|
31
35
|
// Меньше чем endPages
|
|
32
|
-
endPages.length > 0 ? endPages[0] - CURENT_PAGE_AND_ELLIPSIS_POSITION : last - 1
|
|
33
|
-
|
|
36
|
+
endPages.length > 0 ? endPages[0] - CURENT_PAGE_AND_ELLIPSIS_POSITION : last - 1
|
|
37
|
+
);
|
|
38
|
+
const startEllipsis = (
|
|
34
39
|
// eslint-disable-next-line no-nested-ternary
|
|
35
|
-
siblingsStart > first + boundaryCount + 1
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
? [boundaryCount + first]
|
|
39
|
-
: [];
|
|
40
|
-
const endEllipsis =
|
|
40
|
+
siblingsStart > first + boundaryCount + 1 ? [-3 /* StartEllipsis */] : boundaryCount + first < last - boundaryCount ? [boundaryCount + first] : []
|
|
41
|
+
);
|
|
42
|
+
const endEllipsis = (
|
|
41
43
|
// eslint-disable-next-line no-nested-ternary
|
|
42
|
-
siblingsEnd < last - boundaryCount - 1
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
...endPages,
|
|
57
|
-
...(hasNext ? [PageControls.Next] : []),
|
|
58
|
-
];
|
|
44
|
+
siblingsEnd < last - boundaryCount - 1 ? [-4 /* EndEllipsis */] : last - boundaryCount > boundaryCount ? [last - boundaryCount] : []
|
|
45
|
+
);
|
|
46
|
+
const hasPrevious = first < current && startEllipsis[0] === -3 /* StartEllipsis */;
|
|
47
|
+
const hasNext = current < last && endEllipsis[0] === -4 /* EndEllipsis */;
|
|
48
|
+
return [
|
|
49
|
+
...hasPrevious ? [-1 /* Previous */] : [],
|
|
50
|
+
...startPages,
|
|
51
|
+
...startEllipsis,
|
|
52
|
+
// Sibling страницы вместе с текущей
|
|
53
|
+
...range(siblingsStart, siblingsEnd),
|
|
54
|
+
...endEllipsis,
|
|
55
|
+
...endPages,
|
|
56
|
+
...hasNext ? [-2 /* Next */] : []
|
|
57
|
+
];
|
|
59
58
|
};
|
|
60
59
|
|
|
61
60
|
export { PageControls, usePages };
|
package/usePages.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePages.js","sources":["src/usePages.tsx"],"sourcesContent":["const range = (start: number, end: number): number[] => {\n const length = end - start + 1;\n // eslint-disable-next-line no-restricted-properties\n return Array.from({ length }, (_, i) => start + i);\n};\n\ninterface UsePagesProps {\n last: number;\n first: number;\n current: number;\n boundaryCount: number;\n siblingCount: number;\n}\n\nexport enum PageControls {\n Previous = -1,\n Next = -2,\n StartEllipsis = -3,\n EndEllipsis = -4,\n}\n\nconst CURENT_PAGE_AND_ELLIPSIS_POSITION = 2;\n\nexport const usePages = ({ last, first, current, boundaryCount, siblingCount }: UsePagesProps): number[] => {\n const count = last - first + 1;\n\n const startPages = range(first, Math.min(first - 1 + boundaryCount, last));\n const endPages = range(Math.max(count - boundaryCount + first, boundaryCount + first), last);\n\n const siblingsStart = Math.max(\n Math.min(\n // Настоящее начальное значение для siblings node\n current - siblingCount,\n // Нижняя граница, от max\n last - boundaryCount - siblingCount * 2 - CURENT_PAGE_AND_ELLIPSIS_POSITION\n ),\n // Больше стартовой страницы\n startPages.length > 0 ? startPages[0] + CURENT_PAGE_AND_ELLIPSIS_POSITION : first + 1\n );\n\n const siblingsEnd = Math.min(\n Math.max(\n // Настоящее конечное значение для siblings node\n current + siblingCount,\n // Верхняя граница, от min\n first + boundaryCount + siblingCount * 2 + CURENT_PAGE_AND_ELLIPSIS_POSITION\n ),\n // Меньше чем endPages\n endPages.length > 0 ? endPages[0] - CURENT_PAGE_AND_ELLIPSIS_POSITION : last - 1\n );\n\n const startEllipsis =\n // eslint-disable-next-line no-nested-ternary\n siblingsStart > first + boundaryCount + 1\n ? [PageControls.StartEllipsis]\n : boundaryCount + first < last - boundaryCount\n ? [boundaryCount + first]\n : [];\n\n const endEllipsis =\n // eslint-disable-next-line no-nested-ternary\n siblingsEnd < last - boundaryCount - 1\n ? [PageControls.EndEllipsis]\n : last - boundaryCount > boundaryCount\n ? [last - boundaryCount]\n : [];\n\n const hasPrevious = first < current && startEllipsis[0] === PageControls.StartEllipsis;\n const hasNext = current < last && endEllipsis[0] === PageControls.EndEllipsis;\n\n return [\n ...(hasPrevious ? [PageControls.Previous] : []),\n ...startPages,\n ...startEllipsis,\n // Sibling страницы вместе с текущей\n ...range(siblingsStart, siblingsEnd),\n ...endEllipsis,\n ...endPages,\n ...(hasNext ? [PageControls.Next] : []),\n ];\n};\n"],"names":[],"mappings":"AAAA,MAAM,
|
|
1
|
+
{"version":3,"file":"usePages.js","sources":["src/usePages.tsx"],"sourcesContent":["const range = (start: number, end: number): number[] => {\n const length = end - start + 1;\n // eslint-disable-next-line no-restricted-properties\n return Array.from({ length }, (_, i) => start + i);\n};\n\ninterface UsePagesProps {\n last: number;\n first: number;\n current: number;\n boundaryCount: number;\n siblingCount: number;\n}\n\nexport enum PageControls {\n Previous = -1,\n Next = -2,\n StartEllipsis = -3,\n EndEllipsis = -4,\n}\n\nconst CURENT_PAGE_AND_ELLIPSIS_POSITION = 2;\n\nexport const usePages = ({ last, first, current, boundaryCount, siblingCount }: UsePagesProps): number[] => {\n const count = last - first + 1;\n\n const startPages = range(first, Math.min(first - 1 + boundaryCount, last));\n const endPages = range(Math.max(count - boundaryCount + first, boundaryCount + first), last);\n\n const siblingsStart = Math.max(\n Math.min(\n // Настоящее начальное значение для siblings node\n current - siblingCount,\n // Нижняя граница, от max\n last - boundaryCount - siblingCount * 2 - CURENT_PAGE_AND_ELLIPSIS_POSITION\n ),\n // Больше стартовой страницы\n startPages.length > 0 ? startPages[0] + CURENT_PAGE_AND_ELLIPSIS_POSITION : first + 1\n );\n\n const siblingsEnd = Math.min(\n Math.max(\n // Настоящее конечное значение для siblings node\n current + siblingCount,\n // Верхняя граница, от min\n first + boundaryCount + siblingCount * 2 + CURENT_PAGE_AND_ELLIPSIS_POSITION\n ),\n // Меньше чем endPages\n endPages.length > 0 ? endPages[0] - CURENT_PAGE_AND_ELLIPSIS_POSITION : last - 1\n );\n\n const startEllipsis =\n // eslint-disable-next-line no-nested-ternary\n siblingsStart > first + boundaryCount + 1\n ? [PageControls.StartEllipsis]\n : boundaryCount + first < last - boundaryCount\n ? [boundaryCount + first]\n : [];\n\n const endEllipsis =\n // eslint-disable-next-line no-nested-ternary\n siblingsEnd < last - boundaryCount - 1\n ? [PageControls.EndEllipsis]\n : last - boundaryCount > boundaryCount\n ? [last - boundaryCount]\n : [];\n\n const hasPrevious = first < current && startEllipsis[0] === PageControls.StartEllipsis;\n const hasNext = current < last && endEllipsis[0] === PageControls.EndEllipsis;\n\n return [\n ...(hasPrevious ? [PageControls.Previous] : []),\n ...startPages,\n ...startEllipsis,\n // Sibling страницы вместе с текущей\n ...range(siblingsStart, siblingsEnd),\n ...endEllipsis,\n ...endPages,\n ...(hasNext ? [PageControls.Next] : []),\n ];\n};\n"],"names":["PageControls"],"mappings":"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"}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import './index.css';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import classnames from 'classnames';
|
|
4
|
-
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
5
|
-
|
|
6
|
-
var styles = {"number-pages-wrapper":"magritte-number-pages-wrapper___lYp70_4-1-43","numberPagesWrapper":"magritte-number-pages-wrapper___lYp70_4-1-43","number-pages-wrapper-without-navigation-buttons":"magritte-number-pages-wrapper-without-navigation-buttons___78a7R_4-1-43","numberPagesWrapperWithoutNavigationButtons":"magritte-number-pages-wrapper-without-navigation-buttons___78a7R_4-1-43","number-pages-container":"magritte-number-pages-container___YIJLn_4-1-43","numberPagesContainer":"magritte-number-pages-container___YIJLn_4-1-43","number-pages-ellipsis":"magritte-number-pages-ellipsis___GNIbV_4-1-43","numberPagesEllipsis":"magritte-number-pages-ellipsis___GNIbV_4-1-43","number-pages-action":"magritte-number-pages-action___e3ozw_4-1-43","numberPagesAction":"magritte-number-pages-action___e3ozw_4-1-43","number-pages-action-icon":"magritte-number-pages-action-icon___lwXFB_4-1-43","numberPagesActionIcon":"magritte-number-pages-action-icon___lwXFB_4-1-43","number-pages-action-selected":"magritte-number-pages-action-selected___N5Tl4_4-1-43","numberPagesActionSelected":"magritte-number-pages-action-selected___N5Tl4_4-1-43"};
|
|
7
|
-
|
|
8
|
-
const NumberPagesAction = ({ children, selected = false, isIcon = false, Element = 'button', 'aria-label': ariaLabel, page, ...props }) => {
|
|
9
|
-
const buttonProps = Element === 'button' ? { type: 'button' } : {};
|
|
10
|
-
return (jsx("li", { children: jsx(Text, { typography: "label-2-regular", children: jsx(Element, { ...props, ...buttonProps, "aria-current": selected, "aria-label": ariaLabel, className: classnames(styles.numberPagesAction, {
|
|
11
|
-
[styles.numberPagesActionSelected]: selected,
|
|
12
|
-
[styles.numberPagesActionIcon]: isIcon,
|
|
13
|
-
}), children: children }) }) }));
|
|
14
|
-
};
|
|
15
|
-
|
|
16
|
-
export { NumberPagesAction as N, styles as s };
|
|
17
|
-
//# sourceMappingURL=NumberPagesAction-BbLAYsN7.js.map
|