@cloud-ru/uikit-product-quota 0.6.4 → 0.6.6

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.6.6 (2025-11-13)
+
+### Only dependencies have been changed
+* [@cloud-ru/uikit-product-button-predefined@0.7.6](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/button-predefined/CHANGELOG.md)
+* [@cloud-ru/uikit-product-icons@15.1.3](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/icons/CHANGELOG.md)
+* [@cloud-ru/uikit-product-utils@7.0.2](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/utils/CHANGELOG.md)
+
+
+
+
+
+## 0.6.5 (2025-11-12)
+
+
+### Bug Fixes
+
+* **PD-3377:** contributors update to publish all packages ([719fd3e](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/719fd3e1249e247443b125c47ea408d92c8395c3))
+
+
+
+
+
 ## 0.6.4 (2025-11-12)
 
 ### Only dependencies have been changed

package/dist/cjs/components/QuotaButtonDropdown/QuotaDropdown.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+import { ButtonDropdownProps } from '@sbercloud/uikit-product-button-predefined';
+import { WithSupportProps } from '@sbercloud/uikit-product-utils';
+export type QuotaDropdownProps = WithSupportProps<{
+    /** Заголовок */
+    title: string;
+    /** Описание */
+    description?: string;
+    /** Quota cards */
+    children: ReactNode;
+    /** Флаг наличия ошибки при загрузке квот */
+    dataError?: boolean;
+    /** Колбек кнопки повтора */
+    onRetry?(): void;
+    /** Расположение выпадающего меню */
+    placement?: ButtonDropdownProps['placement'];
+    /** Размер кнопки */
+    size?: ButtonDropdownProps['size'];
+    /** Тип макета */
+    layoutType?: ButtonDropdownProps['layoutType'];
+    /** CSS класс */
+    className?: string;
+}>;
+export declare function QuotaDropdown({ placement, layoutType, className, size, ...props }: QuotaDropdownProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/QuotaButtonDropdown/QuotaDropdown.js

@@ -0,0 +1,36 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuotaDropdown = QuotaDropdown;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const uikit_product_button_predefined_1 = require("@sbercloud/uikit-product-button-predefined");
+const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
+const utils_1 = require("../../utils");
+const components_1 = require("./components");
+function QuotaDropdown(_a) {
+    var { placement = 'bottom-end', layoutType = 'desktop', className, size } = _a, props = __rest(_a, ["placement", "layoutType", "className", "size"]);
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const { t } = (0, uikit_product_locale_1.useLocale)('Quota');
+    const quotaExceededCount = (0, react_1.useMemo)(() => react_1.Children.toArray(props.children).reduce((count, child) => {
+        var _a, _b, _c, _d, _e, _f;
+        return (0, react_1.isValidElement)(child) &&
+            !((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.loading) &&
+            !((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.unlimited) &&
+            (0, utils_1.checkExceeded)(((_d = (_c = child === null || child === void 0 ? void 0 : child.props) === null || _c === void 0 ? void 0 : _c.limit) !== null && _d !== void 0 ? _d : 0) - ((_f = (_e = child === null || child === void 0 ? void 0 : child.props) === null || _e === void 0 ? void 0 : _e.created) !== null && _f !== void 0 ? _f : 0))
+            ? count + 1
+            : count;
+    }, 0), [props.children]);
+    const isQuotaExceededCountVisible = !props.dataError && quotaExceededCount > 0;
+    return ((0, jsx_runtime_1.jsx)(uikit_product_button_predefined_1.ButtonDropdown, { open: open, placement: placement, onOpenChange: setOpen, label: t('quotas'), className: className, layoutType: layoutType, size: size, counter: isQuotaExceededCountVisible ? { appearance: 'red', value: quotaExceededCount } : undefined, content: (0, jsx_runtime_1.jsx)(components_1.QuotaDropdownContent, Object.assign({}, props)) }));
+}

package/dist/cjs/components/QuotaButtonDropdown/components/NoData.d.ts

@@ -0,0 +1,5 @@
+type NoDataProps = {
+    onRetry?(): void;
+};
+export declare function NoData({ onRetry }: NoDataProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/QuotaButtonDropdown/components/NoData.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NoData = NoData;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
+const button_1 = require("@snack-uikit/button");
+const styles_module_scss_1 = __importDefault(require('../styles.module.css'));
+function NoData({ onRetry }) {
+    const { t } = (0, uikit_product_locale_1.useLocale)('Quota');
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.noDataWrapper, children: [(0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.noData, children: t('noData') }), (0, jsx_runtime_1.jsx)(button_1.ButtonFunction, { size: 'm', icon: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.RepeatSVG, {}), onClick: onRetry, className: styles_module_scss_1.default.retryButton })] }));
+}

package/dist/cjs/components/QuotaButtonDropdown/components/QuotaDropdownContent.d.ts

@@ -0,0 +1,2 @@
+import { QuotaDropdownProps } from '../QuotaDropdown';
+export declare function QuotaDropdownContent({ onRetry, dataError, children, ...rest }: Omit<QuotaDropdownProps, 'layoutType'>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/QuotaButtonDropdown/components/QuotaDropdownContent.js

@@ -0,0 +1,24 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuotaDropdownContent = QuotaDropdownContent;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const NoData_1 = require("./NoData");
+const QuotaDropdownLayout_1 = require("./QuotaDropdownLayout");
+function QuotaDropdownContent(_a) {
+    var { onRetry, dataError, children } = _a, rest = __rest(_a, ["onRetry", "dataError", "children"]);
+    if (!dataError) {
+        return (0, jsx_runtime_1.jsx)(QuotaDropdownLayout_1.QuotaDropdownLayout, Object.assign({}, rest, { children: children }));
+    }
+    return (0, jsx_runtime_1.jsx)(QuotaDropdownLayout_1.QuotaDropdownLayout, Object.assign({}, rest, { children: (0, jsx_runtime_1.jsx)(NoData_1.NoData, { onRetry: onRetry }) }));
+}

package/dist/cjs/components/QuotaButtonDropdown/components/QuotaDropdownLayout.d.ts

@@ -0,0 +1,2 @@
+import { QuotaDropdownProps } from '../QuotaDropdown';
+export declare function QuotaDropdownLayout({ title, description, children }: Omit<QuotaDropdownProps, 'layoutType'>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/QuotaButtonDropdown/components/QuotaDropdownLayout.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuotaDropdownLayout = QuotaDropdownLayout;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const scroll_1 = require("@snack-uikit/scroll");
+const truncate_string_1 = require("@snack-uikit/truncate-string");
+const styles_module_scss_1 = __importDefault(require('../styles.module.css'));
+function QuotaDropdownLayout({ title, description, children }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.wrapper, children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.header, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.titleContainer, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.title, children: (0, jsx_runtime_1.jsx)(truncate_string_1.TruncateString, { text: title, maxLines: 1 }) }) }), description && ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.description, children: (0, jsx_runtime_1.jsx)(truncate_string_1.TruncateString, { text: description, maxLines: 2 }) }))] }), (0, jsx_runtime_1.jsx)(scroll_1.Scroll, { className: styles_module_scss_1.default.scroll, barHideStrategy: 'never', children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.content, children: children }) })] }));
+}

package/dist/cjs/components/QuotaButtonDropdown/components/index.d.ts

@@ -0,0 +1 @@
+export * from './QuotaDropdownContent';

package/dist/cjs/components/QuotaButtonDropdown/components/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./QuotaDropdownContent"), exports);

package/dist/cjs/components/QuotaButtonDropdown/index.d.ts

@@ -0,0 +1,2 @@
+export * from './QuotaDropdown';
+export * from './components/QuotaDropdownContent';

package/dist/cjs/components/QuotaButtonDropdown/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./QuotaDropdown"), exports);
+__exportStar(require("./components/QuotaDropdownContent"), exports);

package/dist/cjs/components/QuotaButtonDropdown/styles.module.css

@@ -0,0 +1,106 @@
+.title{
+  font-family:var(--sans-title-m-font-family, SB Sans Interface);
+  font-weight:var(--sans-title-m-font-weight, Semibold);
+  line-height:var(--sans-title-m-line-height, 24px);
+  font-size:var(--sans-title-m-font-size, 16px);
+  letter-spacing:var(--sans-title-m-letter-spacing, 0.15px);
+  paragraph-spacing:var(--sans-title-m-paragraph-spacing, 8.8px);
+  color:var(--sys-neutral-text-main, #41424e);
+  overflow:hidden;
+}
+
+.titleContainer{
+  display:flex;
+  gap:4px;
+  align-items:center;
+}
+
+.wrapper{
+  max-width:768px;
+  max-height:446px;
+  padding:12px 0 12px 16px;
+  flex-direction:column;
+  align-items:flex-start;
+  display:flex;
+  gap:16px;
+}
+
+.description{
+  font-family:var(--sans-body-s-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-s-font-weight, Regular);
+  line-height:var(--sans-body-s-line-height, 16px);
+  font-size:var(--sans-body-s-font-size, 12px);
+  letter-spacing:var(--sans-body-s-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-s-paragraph-spacing, 6.6px);
+  color:var(--sys-neutral-text-support, #6d707f);
+}
+
+.content{
+  display:flex;
+  flex-wrap:wrap;
+  align-items:flex-start;
+  justify-content:flex-start;
+  gap:8px;
+}
+
+.header,
+.scroll{
+  max-width:752px;
+}
+
+.scroll{
+  max-height:396px;
+}
+
+.scroll,
+.os-scrollbar-vertical,
+.os-scrollbar-unusable{
+  padding-right:16px;
+}
+
+@media (max-width: 816px){
+  .header,
+  .scroll{
+    max-width:508px;
+  }
+  .scroll{
+    max-height:300px;
+  }
+}
+@media (max-width: 574px){
+  .header,
+  .scroll{
+    max-width:256px;
+  }
+  .scroll{
+    max-height:240px;
+  }
+}
+.noDataWrapper{
+  display:flex;
+  flex-direction:column;
+  width:100%;
+  justify-content:center;
+  gap:24px;
+  align-items:center;
+}
+
+.noData{
+  font-family:var(--sans-body-s-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-s-font-weight, Regular);
+  line-height:var(--sans-body-s-line-height, 16px);
+  font-size:var(--sans-body-s-font-size, 12px);
+  letter-spacing:var(--sans-body-s-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-s-paragraph-spacing, 6.6px);
+  text-align:center;
+  color:var(--sys-neutral-text-support, #6d707f);
+}
+
+.retryButton svg{
+  transform:rotate(-360deg);
+  transition:transform 0.5s;
+}
+.retryButton:active svg{
+  transform:rotate(0deg);
+  transition-duration:0s;
+}

package/dist/cjs/components/QuotaCard/QuotaCard.d.ts

@@ -0,0 +1,22 @@
+import { WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { ButtonTonalProps } from '@snack-uikit/button';
+type QuotaCardCommonProps = WithSupportProps<{
+    loading?: boolean;
+    title: string;
+    created?: number;
+    limit?: number;
+    unlimited?: boolean;
+    increaseLink?: Pick<ButtonTonalProps, 'target' | 'href' | 'onClick'>;
+    onRetry?(): void;
+}>;
+export type QuotaCardProps = QuotaCardCommonProps & ({
+    type?: 'instances' | 'value';
+    customUnit?: never;
+    customLabel?: never;
+} | {
+    type: 'custom';
+    customUnit: string;
+    customLabel: string;
+});
+export declare function QuotaCard({ loading, title, limit, created, increaseLink, onRetry, unlimited, type, customUnit, customLabel, ...rest }: QuotaCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/QuotaCard/QuotaCard.js

@@ -0,0 +1,48 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuotaCard = QuotaCard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
+const uikit_product_utils_1 = require("@sbercloud/uikit-product-utils");
+const button_1 = require("@snack-uikit/button");
+const truncate_string_1 = require("@snack-uikit/truncate-string");
+const utils_1 = require("../../utils");
+const components_1 = require("./components");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function QuotaCard(_a) {
+    var { loading, title, limit, created, increaseLink, onRetry, unlimited = false, type = 'instances', customUnit, customLabel } = _a, rest = __rest(_a, ["loading", "title", "limit", "created", "increaseLink", "onRetry", "unlimited", "type", "customUnit", "customLabel"]);
+    const available = (limit !== null && limit !== void 0 ? limit : 0) - (created !== null && created !== void 0 ? created : 0);
+    const exceeded = (0, utils_1.checkExceeded)(available);
+    const { t } = (0, uikit_product_locale_1.useLocale)('Quota');
+    const noData = limit === undefined || created === undefined;
+    const { unit, label } = (0, react_1.useMemo)(() => {
+        switch (type) {
+            case 'value':
+                return { unit: t('gb'), label: t('filled') };
+            case 'custom':
+                return { unit: customUnit !== null && customUnit !== void 0 ? customUnit : '', label: customLabel !== null && customLabel !== void 0 ? customLabel : '' };
+            default:
+                return { unit: t('peace'), label: t('created') };
+        }
+    }, [t, type, customUnit, customLabel]);
+    if (noData) {
+        return ((0, jsx_runtime_1.jsx)(components_1.QuotaCardLayout, Object.assign({ title: title, exceeded: exceeded, loading: loading }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: (0, jsx_runtime_1.jsx)(components_1.NoData, { onRetry: onRetry }) })));
+    }
+    return ((0, jsx_runtime_1.jsxs)(components_1.QuotaCardLayout, Object.assign({ title: title, exceeded: exceeded, loading: loading }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: [(0, jsx_runtime_1.jsx)(components_1.DataRow, { unit: unit, label: label, value: created, className: styles_module_scss_1.default.created }), exceeded && !unlimited ? ((0, jsx_runtime_1.jsx)(components_1.DataRow, { unit: unit, label: (0, jsx_runtime_1.jsxs)("span", { className: styles_module_scss_1.default.exceededState, children: [(0, jsx_runtime_1.jsx)(uikit_product_icons_1.CrossFilledSVG, { size: 16 }), (0, jsx_runtime_1.jsx)(truncate_string_1.TruncateString, { text: t('exceeded'), maxLines: 1 })] }), value: increaseLink ? (0, jsx_runtime_1.jsx)(button_1.ButtonTonal, Object.assign({ size: 'xs', label: t('increase') }, increaseLink)) : undefined, className: styles_module_scss_1.default.available })) : ((0, jsx_runtime_1.jsx)(components_1.DataRow, { unit: unit, label: t('available'), value: unlimited ? (0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.text, children: t('unlimited') }) : available, className: styles_module_scss_1.default.available }))] })));
+}

package/dist/cjs/components/QuotaCard/components/DataRow.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+type DataRowProps = {
+    label: ReactNode;
+    value: number | ReactNode;
+    className?: string;
+    unit: string;
+};
+export declare function DataRow({ value, label, className, unit }: DataRowProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/QuotaCard/components/DataRow.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataRow = DataRow;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const truncate_string_1 = require("@snack-uikit/truncate-string");
+const styles_module_scss_1 = __importDefault(require('../styles.module.css'));
+function DataRow({ value, label, className, unit }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.dataRow, className), children: [(0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.text, children: typeof label === 'string' ? (0, jsx_runtime_1.jsx)(truncate_string_1.TruncateString, { text: label, maxLines: 1 }) : label }), typeof value === 'number' ? ((0, jsx_runtime_1.jsxs)("span", { className: styles_module_scss_1.default.text, children: [value, " ", unit] })) : (value)] }));
+}

package/dist/cjs/components/QuotaCard/components/DataSkeleton.d.ts

@@ -0,0 +1 @@
+export declare function DataSkeleton(): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/QuotaCard/components/DataSkeleton.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataSkeleton = DataSkeleton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const skeleton_1 = require("@snack-uikit/skeleton");
+const styles_module_scss_1 = __importDefault(require('../styles.module.css'));
+function DataSkeleton() {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.dataWrapper, children: [(0, jsx_runtime_1.jsx)(skeleton_1.SkeletonText, { lines: 1, className: styles_module_scss_1.default.text }), (0, jsx_runtime_1.jsx)(skeleton_1.SkeletonText, { lines: 1, className: styles_module_scss_1.default.text })] }));
+}

package/dist/cjs/components/QuotaCard/components/NoData.d.ts

@@ -0,0 +1,5 @@
+type NoDataProps = {
+    onRetry?(): void;
+};
+export declare function NoData({ onRetry }: NoDataProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/QuotaCard/components/NoData.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NoData = NoData;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
+const button_1 = require("@snack-uikit/button");
+const styles_module_scss_1 = __importDefault(require('../styles.module.css'));
+function NoData({ onRetry }) {
+    const { t } = (0, uikit_product_locale_1.useLocale)('Quota');
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.noDataWrapper, children: [(0, jsx_runtime_1.jsx)(button_1.ButtonFunction, { size: 'xs', icon: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.RepeatSVG, {}), onClick: onRetry, className: styles_module_scss_1.default.retryButton }), (0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.noData, children: t('noData') })] }));
+}

package/dist/cjs/components/QuotaCard/components/QuotaCardLayout.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+import { WithSupportProps } from '@sbercloud/uikit-product-utils';
+type QuotaCardLayoutProps = WithSupportProps<{
+    loading?: boolean;
+    title: string;
+    exceeded?: boolean;
+    children?: ReactNode;
+}>;
+export declare function QuotaCardLayout({ title, exceeded, loading, children, ...rest }: QuotaCardLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/QuotaCard/components/QuotaCardLayout.js

@@ -0,0 +1,27 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuotaCardLayout = QuotaCardLayout;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_product_utils_1 = require("@sbercloud/uikit-product-utils");
+const skeleton_1 = require("@snack-uikit/skeleton");
+const truncate_string_1 = require("@snack-uikit/truncate-string");
+const styles_module_scss_1 = __importDefault(require('../styles.module.css'));
+const DataSkeleton_1 = require("./DataSkeleton");
+function QuotaCardLayout(_a) {
+    var { title, exceeded, loading, children } = _a, rest = __rest(_a, ["title", "exceeded", "loading", "children"]);
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: styles_module_scss_1.default.quotaCard, "data-exceeded": exceeded || undefined }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.title, children: (0, jsx_runtime_1.jsx)(truncate_string_1.TruncateString, { text: title, maxLines: 1 }) }), (0, jsx_runtime_1.jsx)(skeleton_1.WithSkeleton, { loading: loading, skeleton: (0, jsx_runtime_1.jsx)(DataSkeleton_1.DataSkeleton, {}), children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.dataWrapper, children: children }) })] })));
+}

package/dist/cjs/components/QuotaCard/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from './QuotaCardLayout';
+export * from './NoData';
+export * from './DataRow';

package/dist/cjs/components/QuotaCard/components/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./QuotaCardLayout"), exports);
+__exportStar(require("./NoData"), exports);
+__exportStar(require("./DataRow"), exports);

package/dist/cjs/components/QuotaCard/index.d.ts

@@ -0,0 +1 @@
+export * from './QuotaCard';

package/dist/cjs/components/QuotaCard/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./QuotaCard"), exports);

package/dist/cjs/components/QuotaCard/styles.module.css

@@ -0,0 +1,106 @@
+.title{
+  font-family:var(--sans-title-s-font-family, SB Sans Interface);
+  font-weight:var(--sans-title-s-font-weight, Semibold);
+  line-height:var(--sans-title-s-line-height, 20px);
+  font-size:var(--sans-title-s-font-size, 14px);
+  letter-spacing:var(--sans-title-s-letter-spacing, 0.15px);
+  paragraph-spacing:var(--sans-title-s-paragraph-spacing, 7.7px);
+  color:var(--sys-neutral-text-main, #41424e);
+  overflow:hidden;
+  width:100%;
+}
+
+.dataWrapper{
+  display:flex;
+  flex-direction:column;
+  gap:8px;
+  width:100%;
+}
+
+.dataRow{
+  display:grid;
+  grid-template-columns:1fr auto;
+  gap:4px;
+  width:100%;
+}
+
+.text{
+  font-family:var(--light-label-m-font-family, SB Sans Interface);
+  font-weight:var(--light-label-m-font-weight, Regular);
+  line-height:var(--light-label-m-line-height, 16px);
+  font-size:var(--light-label-m-font-size, 12px);
+  letter-spacing:var(--light-label-m-letter-spacing, 0px);
+  paragraph-spacing:var(--light-label-m-paragraph-spacing, 6.6px);
+  align-content:center;
+  overflow:hidden;
+}
+
+.created{
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+
+.available{
+  color:var(--sys-neutral-text-support, #6d707f);
+  height:24px;
+}
+
+.exceededState{
+  display:flex;
+  align-items:center;
+  gap:2px;
+}
+.exceededState svg{
+  color:var(--sys-red-accent-default, #cb3f3e);
+}
+
+.quotaCard{
+  box-sizing:border-box;
+  display:flex;
+  width:240px;
+  min-width:240px;
+  max-width:240px;
+  height:100px;
+  min-height:100px;
+  max-height:104px;
+  padding:12px;
+  flex-direction:column;
+  align-items:flex-start;
+  gap:8px;
+  border-radius:4px;
+  overflow:hidden;
+  border-style:solid;
+  border-width:1px;
+  border-color:var(--sys-neutral-decor-default, #dde0ea);
+  background-color:var(--sys-neutral-background1-level, #fdfdfd);
+}
+.quotaCard[data-exceeded] .text .exceededState{
+  color:var(--sys-red-text-support, #ae514c);
+}
+
+.noDataWrapper{
+  display:flex;
+  flex-direction:column;
+  width:100%;
+  justify-content:center;
+  align-items:center;
+}
+
+.noData{
+  font-family:var(--sans-body-s-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-s-font-weight, Regular);
+  line-height:var(--sans-body-s-line-height, 16px);
+  font-size:var(--sans-body-s-font-size, 12px);
+  letter-spacing:var(--sans-body-s-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-s-paragraph-spacing, 6.6px);
+  text-align:center;
+  color:var(--sys-neutral-text-support, #6d707f);
+}
+
+.retryButton svg{
+  transform:rotate(-360deg);
+  transition:transform 0.5s;
+}
+.retryButton:active svg{
+  transform:rotate(0deg);
+  transition-duration:0s;
+}