@alfalab/core-components-pagination 1.1.0

package/dist/modern/components/default-view/index.js

@@ -0,0 +1,47 @@
+import React, { useCallback } from 'react';
+import 'classnames';
+import '@alfalab/core-components-tag/dist/modern';
+import { Tag } from '../tag/index.js';
+
+var styles = {"dots":"pagination__dots_kix4e"};
+require('./index.css')
+
+const DefaultView = ({ sidePadding = 2, activePadding = 1, pagesCount, currentPageIndex, onPageChange = () => null, }) => {
+    const maxHalfCount = sidePadding + activePadding + 1;
+    const maxElementsCount = maxHalfCount * 2 + 1;
+    const itemsFit = pagesCount <= maxElementsCount;
+    const elementsCount = itemsFit ? pagesCount : maxElementsCount;
+    const getPageIndex = useCallback((elementIndex) => {
+        const lastIndex = pagesCount - 1;
+        const reverseIndex = lastIndex - currentPageIndex;
+        const lastElementIndex = elementsCount - 1;
+        const reverseElementIndex = lastElementIndex - elementIndex;
+        const hasCollapsedItems = (index) => !itemsFit && index >= maxHalfCount;
+        if (elementIndex < sidePadding) {
+            return elementIndex;
+        }
+        if (elementIndex === sidePadding && hasCollapsedItems(currentPageIndex)) {
+            return null;
+        }
+        if (reverseElementIndex === sidePadding && hasCollapsedItems(reverseIndex)) {
+            return null;
+        }
+        if (reverseElementIndex < sidePadding) {
+            return lastIndex - reverseElementIndex;
+        }
+        const computedIndex = currentPageIndex - maxHalfCount + elementIndex;
+        return Math.min(lastIndex - reverseElementIndex, Math.max(elementIndex, computedIndex));
+    }, [currentPageIndex, elementsCount, itemsFit, maxHalfCount, pagesCount, sidePadding]);
+    return (React.createElement(React.Fragment, null, Array(elementsCount)
+        .fill('')
+        .map((_, i) => {
+        const pageIndex = getPageIndex(i);
+        if (pageIndex === null) {
+            return (React.createElement("div", { key: i.toString(), className: styles.dots }, "..."));
+        }
+        const active = currentPageIndex === pageIndex;
+        return (React.createElement(Tag, { key: i.toString(), checked: active, disabled: active, onClick: () => onPageChange(pageIndex) }, pageIndex + 1));
+    })));
+};
+
+export { DefaultView };

package/dist/modern/components/per-page-view/index.css

@@ -0,0 +1,16 @@
+/* hash: 1ylzb */
+:root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+}
+:root {
+    --gap-m: 16px;
+}
+.pagination__component_begf8 {
+    display: block;
+    margin: 0 var(--gap-m);
+}

package/dist/modern/components/per-page-view/index.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { PaginationProps } from "../../Component";
+type PerPageViewProps = Pick<PaginationProps, 'pagesCount' | 'currentPageIndex'>;
+declare const PerPageView: FC<PerPageViewProps>;
+export { PerPageView };

package/dist/modern/components/per-page-view/index.js

@@ -0,0 +1,12 @@
+import React from 'react';
+
+var styles = {"component":"pagination__component_begf8"};
+require('./index.css')
+
+const PerPageView = ({ pagesCount, currentPageIndex }) => (React.createElement("span", { className: styles.component },
+    currentPageIndex + 1,
+    " \u0438\u0437 ",
+    pagesCount,
+    " \u0441\u0442\u0440\u0430\u043D\u0438\u0446"));
+
+export { PerPageView };

package/dist/modern/components/tag/index.css

@@ -0,0 +1,52 @@
+/* hash: x8h03 */
+:root {
+    --color-light-bg-neutral: #dbdee1;
+    --color-light-bg-secondary-inverted: #233549;
+    --color-light-bg-tertiary: #e7e9eb;
+    --color-light-text-primary: #0b1f35;
+    --color-light-text-primary-inverted: #fff;
+    --color-light-text-secondary: #546272;
+}
+:root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+}
+:root {
+    --border-radius-m: 8px;
+}
+.pagination__tag_1gidc.pagination__tag_1gidc {
+    color: var(--color-light-text-secondary);
+    border-radius: var(--border-radius-m);
+    border: none;
+    flex-shrink: 0;
+    min-width: auto;
+    min-height: auto;
+    width: 32px;
+    height: 32px;
+    padding: 0
+}
+.pagination__tag_1gidc.pagination__tag_1gidc:disabled:not(.pagination__checked_1gidc) {
+        opacity: 0.3;
+    }
+.pagination__tag_1gidc.pagination__tag_1gidc:hover:not(:disabled) {
+        background-color: var(--color-light-bg-tertiary);
+        color: var(--color-light-text-primary);
+    }
+.pagination__tag_1gidc.pagination__tag_1gidc:active:not(:disabled) {
+        background-color: var(--color-light-bg-neutral);
+    }
+.pagination__tag_1gidc.pagination__tag_1gidc.pagination__checked_1gidc {
+        cursor: default;
+        background-color: var(--color-light-bg-secondary-inverted);
+        color: var(--color-light-text-primary-inverted);
+    }
+.pagination__tag_1gidc.pagination__tag_1gidc.pagination__checked_1gidc:hover:not(:disabled) {
+        color: var(--color-light-text-primary-inverted);
+    }
+.pagination__tag_1gidc.pagination__tag_1gidc.pagination__checked_1gidc:active:not(:disabled) {
+        color: var(--color-light-text-primary);
+    }

package/dist/modern/components/tag/index.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { TagProps } from "@alfalab/core-components-tag";
+declare const Tag: FC<TagProps>;
+export { Tag };

package/dist/modern/components/tag/index.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import cn from 'classnames';
+import { Tag as Tag$1 } from '@alfalab/core-components-tag/dist/modern';
+
+var styles = {"tag":"pagination__tag_1gidc","checked":"pagination__checked_1gidc"};
+require('./index.css')
+
+const Tag = ({ className, checked, ...restProps }) => (React.createElement(Tag$1, Object.assign({}, restProps, { checked: checked, size: 'xxs', className: cn(className, styles.tag, { [styles.checked]: checked }) })));
+
+export { Tag };

package/dist/modern/index.css

@@ -0,0 +1,32 @@
+/* hash: 1ncx7 */
+:root {
+    --color-light-text-primary: #0b1f35;
+}
+:root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+}
+:root {
+    --gap-xs: 8px;
+}
+.pagination__component_1bqlk {
+    font-size: 14px;
+    line-height: 20px;
+    font-weight: 400;
+
+    display: flex;
+    align-items: center;
+    color: var(--color-light-text-primary);
+    font-feature-settings: "tnum";
+    font-variant-numeric: tabular-nums;
+}
+.pagination__default_1bqlk > * {
+        margin-right: var(--gap-xs)
+    }
+.pagination__default_1bqlk > *:last-child {
+            margin-right: 0;
+        }

package/dist/modern/index.d.ts

@@ -0,0 +1 @@
+export * from "./Component";

package/dist/modern/index.js

@@ -0,0 +1,9 @@
+import 'react';
+import 'classnames';
+import '@alfalab/icons-glyph/ChevronBackMIcon';
+import '@alfalab/icons-glyph/ChevronForwardMIcon';
+import '@alfalab/core-components-tag/dist/modern';
+import './components/tag/index.js';
+import './components/default-view/index.js';
+import './components/per-page-view/index.js';
+export { Pagination } from './Component.js';

package/dist/send-stats.js

@@ -0,0 +1,82 @@
+const http = require('http');
+const fs = require('fs');
+const { promisify } = require('util');
+const path = require('path');
+
+const readFile = promisify(fs.readFile);
+
+async function main() {
+    const remoteHost = process.env.NIS_HOST || 'digital';
+    const remotePort = process.env.NIS_PORT || 80;
+    const remotePath = process.env.NIS_PATH || '/npm-install-stats/api/install-stats';
+
+    try {
+        const [_, node, os, arch] =
+            /node\/v(\d+\.\d+\.\d+) (\w+) (\w+)/.exec(process.env.npm_config_user_agent) || [];
+        const [__, npm] = /npm\/(\d+\.\d+\.\d+)/.exec(process.env.npm_config_user_agent) || [];
+        const [___, yarn] = /yarn\/(\d+\.\d+\.\d+)/.exec(process.env.npm_config_user_agent) || [];
+
+        let ownPackageJson, packageJson;
+
+        try {
+            const result = await Promise.all([
+                readFile(path.join(process.cwd(), 'package.json'), 'utf-8'),
+                readFile(path.join(process.cwd(), '../../../package.json'), 'utf-8'),
+            ]);
+
+            ownPackageJson = JSON.parse(result[0]);
+            packageJson = JSON.parse(result[1]);
+        } catch (err) {
+            ownPackageJson = '';
+            packageJson = '';
+        }
+
+        const data = {
+            node,
+            npm,
+            yarn,
+            os,
+            arch,
+            ownPackageJson: JSON.stringify(ownPackageJson),
+            packageJson: JSON.stringify(packageJson),
+        };
+
+        const body = JSON.stringify(data);
+
+        const options = {
+            host: remoteHost,
+            port: remotePort,
+            path: remotePath,
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+                'Content-Length': body.length,
+            },
+        };
+
+        return new Promise((resolve, reject) => {
+            const req = http.request(options, res => {
+                res.on('end', () => {
+                    resolve();
+                });
+            });
+
+            req.on('error', () => {
+                reject();
+            });
+
+            req.write(body);
+            req.end();
+        });
+    } catch (error) {
+        throw error;
+    }
+}
+
+main()
+    .then(() => {
+        process.exit(0);
+    })
+    .catch(() => {
+        process.exit(0);
+    });

package/package.json

@@ -0,0 +1,25 @@
+{
+    "name": "@alfalab/core-components-pagination",
+    "version": "1.1.0",
+    "description": "",
+    "keywords": [],
+    "license": "MIT",
+    "main": "dist/index.js",
+    "module": "./dist/esm/index.js",
+    "files": [
+        "dist"
+    ],
+    "publishConfig": {
+        "access": "public"
+    },
+    "peerDependencies": {
+        "react": "^16.9.0 || ^17.0.1",
+        "react-dom": "^16.9.0 || ^17.0.1"
+    },
+    "dependencies": {
+        "@alfalab/core-components-button": "^5.0.3",
+        "@alfalab/core-components-tag": "^4.0.0",
+        "classnames": "^2.2.6"
+    },
+    "gitHead": "94999e533968aa575e92106dffa8bbbb8e7ac71d"
+}