@sima-land/ui-nucleons 45.0.0-alpha.5 → 45.0.0-alpha.50

package/dist/checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/checkbox/index.ts"],"names":[],"mappings":";;;AACA,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA"}

package/dist/checkbox/types.d.ts

@@ -0,0 +1,2 @@
+import type { CheckboxInputProps } from '../types';
+export type CheckboxProps = CheckboxInputProps;

package/dist/checkbox/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/checkbox/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/checkbox/types.ts"],"names":[],"mappings":""}

package/dist/chip/chip-util.scss

@@ -0,0 +1,53 @@
+@use '../colors';
+
+@mixin colors-light {
+  // default
+  --chip-background: #{colors.$basic-gray8};
+  --chip-color: #{colors.$basic-gray87};
+  --chip-hover-background: #{colors.$basic-gray4};
+  --chip-hover-color: #{colors.$basic-gray76};
+
+  // disabled
+  --chip-disabled-background: #{colors.$basic-gray8};
+  --chip-disabled-color: #{colors.$basic-gray38};
+  --chip-disabled-hover-background: #{colors.$basic-gray8};
+  --chip-disabled-hover-color: #{colors.$basic-gray38};
+
+  // checked
+  --chip-checked-background: #{colors.$basic-gray87};
+  --chip-checked-color: #{colors.$basic-white};
+  --chip-checked-hover-background: #{colors.$basic-gray76};
+  --chip-checked-hover-color: #{colors.$basic-gray8};
+
+  // checked + disabled
+  --chip-checked-disabled-background: #{colors.$basic-gray87};
+  --chip-checked-disabled-color: #{colors.$basic-gray38};
+  --chip-checked-disabled-hover-background: #{colors.$basic-gray87};
+  --chip-checked-disabled-hover-color: #{colors.$basic-gray38};
+}
+
+@mixin colors-dark {
+  // default
+  --chip-background: #{colors.$basic-gray76};
+  --chip-color: #{colors.$basic-white};
+  --chip-hover-background: #{colors.$basic-gray66};
+  --chip-hover-color: #{colors.$basic-gray8};
+
+  // disabled
+  --chip-disabled-background: #{colors.$basic-gray76};
+  --chip-disabled-color: #{colors.$basic-gray38};
+  --chip-disabled-hover-background: #{colors.$basic-gray76};
+  --chip-disabled-hover-color: #{colors.$basic-gray38};
+
+  // checked
+  --chip-checked-background: #{colors.$basic-white};
+  --chip-checked-color: #{colors.$basic-gray87};
+  --chip-checked-hover-background: #{colors.$basic-gray4};
+  --chip-checked-hover-color: #{colors.$basic-gray76};
+
+  // checked + disabled
+  --chip-checked-disabled-background: #{colors.$basic-white};
+  --chip-checked-disabled-color: #{colors.$basic-gray38};
+  --chip-checked-disabled-hover-background: #{colors.$basic-white};
+  --chip-checked-disabled-hover-color: #{colors.$basic-gray38};
+}

package/dist/chip/chip.d.ts

@@ -0,0 +1,14 @@
+import { ButtonHTMLAttributes } from 'react';
+import { ChipProps } from './types';
+/**
+ * Чип - компактный элемент для вывода атрибутов или опций.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function Chip(props: ChipProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Кнопка в чипе.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function ChipIconButton({ children, className, ...restProps }: ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;

package/dist/chip/chip.js

@@ -0,0 +1,38 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Chip = Chip;
+exports.ChipIconButton = ChipIconButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const bind_1 = __importDefault(require("classnames/bind"));
+const chip_m_scss_1 = __importDefault(require("./chip.m.scss"));
+const cx = bind_1.default.bind(chip_m_scss_1.default);
+/**
+ * Чип - компактный элемент для вывода атрибутов или опций.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function Chip(props) {
+    const { checked, shape = 'square', colors = 'light', className, endAdornment, children, disabled, padding = 'x', adornmentGutter = 'default', 'data-testid': testId = 'chip', ...restProps } = props;
+    const rootClassName = cx('root', shape !== 'unset' && `shape-${shape}`, colors !== 'unset' && `colors-${colors}`, padding !== 'unset' && `padding-${padding}`, adornmentGutter !== 'unset' && `adornment-gutter-${adornmentGutter}`, checked && 'checked', disabled && 'disabled', className);
+    const content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: cx('section-main'), children: children }), endAdornment && (0, jsx_runtime_1.jsx)("span", { className: cx('section-end-adornment'), children: endAdornment })] }));
+    if (restProps.as === 'anchor') {
+        // @todo унифицировать поведение для disabled-ссылок в виде функции getDisabledAnchorProps()?
+        return ((0, jsx_runtime_1.jsx)("a", { className: rootClassName, ...restProps, "data-testid": testId, children: content }));
+    }
+    if (restProps.as === 'button') {
+        return ((0, jsx_runtime_1.jsx)("button", { disabled: disabled, className: rootClassName, ...restProps, "data-testid": testId, children: content }));
+    }
+    return ((0, jsx_runtime_1.jsx)("span", { className: rootClassName, ...restProps, "data-testid": testId, children: content }));
+}
+/**
+ * Кнопка в чипе.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function ChipIconButton({ children, className, ...restProps }) {
+    return ((0, jsx_runtime_1.jsx)("button", { className: cx('icon-button', className), ...restProps, children: children }));
+}
+//# sourceMappingURL=chip.js.map

package/dist/chip/chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../src/chip/chip.tsx"],"names":[],"mappings":";;;;;AAYA,oBAuDC;AAOD,wCAUC;;AAlFD,2DAAyC;AACzC,gEAAmC;AAEnC,MAAM,EAAE,GAAG,cAAU,CAAC,IAAI,CAAC,qBAAM,CAAC,CAAC;AAEnC;;;;GAIG;AACH,SAAgB,IAAI,CAAC,KAAgB;IACnC,MAAM,EACJ,OAAO,EACP,KAAK,GAAG,QAAQ,EAChB,MAAM,GAAG,OAAO,EAChB,SAAS,EACT,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,OAAO,GAAG,GAAG,EACb,eAAe,GAAG,SAAS,EAC3B,aAAa,EAAE,MAAM,GAAG,MAAM,EAC9B,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,aAAa,GAAG,EAAE,CACtB,MAAM,EACN,KAAK,KAAK,OAAO,IAAI,SAAS,KAAK,EAAE,EACrC,MAAM,KAAK,OAAO,IAAI,UAAU,MAAM,EAAE,EACxC,OAAO,KAAK,OAAO,IAAI,WAAW,OAAO,EAAE,EAC3C,eAAe,KAAK,OAAO,IAAI,oBAAoB,eAAe,EAAE,EACpE,OAAO,IAAI,SAAS,EACpB,QAAQ,IAAI,UAAU,EACtB,SAAS,CACV,CAAC;IAEF,MAAM,OAAO,GAAG,CACd,6DACE,iCAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,YAAG,QAAQ,GAAQ,EACrD,YAAY,IAAI,iCAAM,SAAS,EAAE,EAAE,CAAC,uBAAuB,CAAC,YAAG,YAAY,GAAQ,IACnF,CACJ,CAAC;IAEF,IAAI,SAAS,CAAC,EAAE,KAAK,QAAQ,EAAE,CAAC;QAC9B,6FAA6F;QAC7F,OAAO,CACL,8BAAG,SAAS,EAAE,aAAa,KAAM,SAAS,iBAAe,MAAM,YAC5D,OAAO,GACN,CACL,CAAC;IACJ,CAAC;IAED,IAAI,SAAS,CAAC,EAAE,KAAK,QAAQ,EAAE,CAAC;QAC9B,OAAO,CACL,mCAAQ,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,KAAM,SAAS,iBAAe,MAAM,YACrF,OAAO,GACD,CACV,CAAC;IACJ,CAAC;IAED,OAAO,CACL,iCAAM,SAAS,EAAE,aAAa,KAAM,SAAS,iBAAe,MAAM,YAC/D,OAAO,GACH,CACR,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,SAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,SAAS,EACT,GAAG,SAAS,EAC4B;IACxC,OAAO,CACL,mCAAQ,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,SAAS,CAAC,KAAM,SAAS,YAC3D,QAAQ,GACF,CACV,CAAC;AACJ,CAAC"}

package/dist/chip/chip.m.scss

@@ -0,0 +1,157 @@
+@use '../colors';
+@use '../utils';
+@use './chip-util';
+
+.root {
+  @include utils.reset-button;
+}
+
+.root {
+  flex-grow: 0;
+  flex-shrink: 0;
+  max-width: 100%;
+  display: flex;
+  align-items: center;
+  height: 32px;
+  box-sizing: border-box;
+  font: inherit;
+  font-size: 12px;
+  font-weight: 600;
+  line-height: 16px;
+  text-decoration: none;
+  padding: 0 12px;
+  background: var(--chip-background);
+  color: var(--chip-color);
+  transition:
+    background 100ms ease-in,
+    color 100ms ease-in;
+  &:focus-visible {
+    @include utils.focus-visible-style;
+  }
+
+  // ВАЖНО: переопределяем стили монолита для ссылок
+  &,
+  &:link,
+  &:visited {
+    background: var(--chip-background);
+    color: var(--chip-color);
+  }
+
+  // ВАЖНО: эффект при наведении определяем **после** переопределения стилей монолита
+  &:hover {
+    cursor: pointer;
+    background: var(--chip-hover-background);
+    color: var(--chip-hover-color);
+  }
+  &.disabled {
+    pointer-events: none;
+    user-select: none;
+    background: var(--chip-disabled-background);
+    color: var(--chip-disabled-color);
+  }
+  &.checked {
+    background: var(--chip-checked-background);
+    color: var(--chip-checked-color);
+  }
+  &.checked:hover {
+    background: var(--chip-checked-hover-background);
+    color: var(--chip-checked-hover-color);
+  }
+  &.checked.disabled {
+    background: var(--chip-checked-disabled-background);
+    color: var(--chip-checked-disabled-color);
+  }
+}
+
+.padding-x {
+  padding: 0 12px;
+}
+
+.padding-start {
+  padding: 0 0 0 12px;
+}
+
+.adornment-gutter-default {
+  --chip-adornment-gutter: 8px;
+}
+
+.colors-light {
+  @include chip-util.colors-light;
+}
+
+.colors-dark {
+  @include chip-util.colors-dark;
+}
+
+.shape-square {
+  border-radius: 4px;
+}
+
+.shape-pill {
+  border-radius: 999999px;
+}
+
+.section-main {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.section-end-adornment {
+  height: 100%;
+  display: flex;
+  align-items: center;
+  margin-left: var(--chip-adornment-gutter);
+}
+
+.icon-button {
+  @include utils.reset-button;
+}
+
+.icon-button {
+  display: flex;
+  align-items: center;
+  height: 32px;
+  margin-left: 4px;
+  padding-left: 4px;
+  padding-right: 12px;
+  background: transparent;
+  border-radius: 4px;
+  cursor: pointer;
+  &:focus-visible {
+    @include utils.focus-visible-style;
+  }
+  &:not(:hover) {
+    color: var(--chip-color);
+  }
+  &:hover {
+    color: var(--chip-hover-color);
+  }
+}
+
+.disabled .icon-button {
+  &:not(:hover) {
+    color: var(--chip-disabled-color);
+  }
+  &:hover {
+    color: var(--chip-disabled-hover-color);
+  }
+}
+
+.checked .icon-button {
+  &:not(:hover) {
+    color: var(--chip-checked-color);
+  }
+  &:hover {
+    color: var(--chip-checked-hover-color);
+  }
+}
+
+.checked.disabled .icon-button {
+  &:not(:hover) {
+    color: var(--chip-checked-disabled-color);
+  }
+  &:hover {
+    color: var(--chip-checked-disabled-hover-color);
+  }
+}

package/dist/chip/index.d.ts

@@ -0,0 +1,3 @@
+export type { ChipProps, ChipAs, ChipShape, ChipColors } from './types';
+export { Chip, ChipIconButton } from './chip';
+export { getDeletableChipProps } from './utils';

package/dist/chip/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDeletableChipProps = exports.ChipIconButton = exports.Chip = void 0;
+var chip_1 = require("./chip");
+Object.defineProperty(exports, "Chip", { enumerable: true, get: function () { return chip_1.Chip; } });
+Object.defineProperty(exports, "ChipIconButton", { enumerable: true, get: function () { return chip_1.ChipIconButton; } });
+var utils_1 = require("./utils");
+Object.defineProperty(exports, "getDeletableChipProps", { enumerable: true, get: function () { return utils_1.getDeletableChipProps; } });
+//# sourceMappingURL=index.js.map

package/dist/chip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/chip/index.ts"],"names":[],"mappings":";;;AACA,+BAA8C;AAArC,4FAAA,IAAI,OAAA;AAAE,sGAAA,cAAc,OAAA;AAC7B,iCAAgD;AAAvC,8GAAA,qBAAqB,OAAA"}

package/dist/chip/types.d.ts

@@ -0,0 +1,53 @@
+import type { AnchorHTMLAttributes, ButtonHTMLAttributes, CSSProperties, HTMLAttributes, ReactNode } from 'react';
+import type { WithTestId } from '../types';
+export type ChipAs = 'span' | 'anchor' | 'button';
+export type ChipShape = 'square' | 'pill';
+export type ChipColors = 'light' | 'dark';
+export interface ChipStyle extends CSSProperties {
+    '--chip-adornment-gutter'?: string;
+    '--chip-background'?: string;
+    '--chip-color'?: string;
+    '--chip-hover-background'?: string;
+    '--chip-hover-color'?: string;
+    '--chip-disabled-background'?: string;
+    '--chip-disabled-color'?: string;
+    '--chip-disabled-hover-background'?: string;
+    '--chip-disabled-hover-color'?: string;
+    '--chip-checked-background'?: string;
+    '--chip-checked-color'?: string;
+    '--chip-checked-hover-background'?: string;
+    '--chip-checked-hover-color'?: string;
+    '--chip-checked-disabled-background'?: string;
+    '--chip-checked-disabled-color'?: string;
+    '--chip-checked-disabled-hover-background'?: string;
+    '--chip-checked-disabled-hover-color'?: string;
+}
+interface CommonProps<T extends ChipAs = ChipAs> extends WithTestId {
+    /** Какой элемент использовать в качестве корневого элемента. */
+    as?: T;
+    /** Выбран ли чип. */
+    checked?: boolean;
+    /** Отключен ли чип. */
+    disabled?: boolean;
+    /** Украшение в конце. */
+    endAdornment?: ReactNode;
+    /** Форма. */
+    shape?: ChipShape | 'unset';
+    /** Цвета. */
+    colors?: ChipColors | 'unset';
+    /** Внутренние отступы. */
+    padding?: 'x' | 'start' | 'unset';
+    /** Отступ от основного контента до украшений. */
+    adornmentGutter?: 'default' | 'unset';
+}
+type AsSpanProps = CommonProps & Omit<HTMLAttributes<HTMLDivElement>, keyof CommonProps> & {
+    as?: 'span';
+};
+type AsAnchorProps = CommonProps & Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof CommonProps> & {
+    as: 'anchor';
+};
+type AsButtonProps = CommonProps & Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof CommonProps> & {
+    as: 'button';
+};
+export type ChipProps = AsSpanProps | AsAnchorProps | AsButtonProps;
+export {};

package/dist/chip/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/chip/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/chip/types.ts"],"names":[],"mappings":""}

package/dist/chip/utils.d.ts

@@ -0,0 +1,9 @@
+import type { ChipProps } from './types';
+/**
+ * Возвращает свойства для чипа, добавляющие ему кнопку удаления.
+ * @param options Опции.
+ * @return Свойства.
+ */
+export declare function getDeletableChipProps({ onDelete }?: {
+    onDelete?: VoidFunction;
+}): ChipProps;

package/dist/chip/utils.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDeletableChipProps = getDeletableChipProps;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const chip_1 = require("./chip");
+const Cross_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Cross"));
+/**
+ * Возвращает свойства для чипа, добавляющие ему кнопку удаления.
+ * @param options Опции.
+ * @return Свойства.
+ */
+function getDeletableChipProps({ onDelete } = {}) {
+    return {
+        padding: 'start',
+        adornmentGutter: 'unset',
+        endAdornment: ((0, jsx_runtime_1.jsx)(chip_1.ChipIconButton, { type: 'button', onClick: onDelete, children: (0, jsx_runtime_1.jsx)(Cross_1.default, { fill: 'currentColor' }) })),
+    };
+}
+//# sourceMappingURL=utils.js.map

package/dist/chip/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/chip/utils.tsx"],"names":[],"mappings":";;;;;AASA,sDAUC;;AAlBD,iCAAwC;AACxC,2FAAsE;AAEtE;;;;GAIG;AACH,SAAgB,qBAAqB,CAAC,EAAE,QAAQ,KAAkC,EAAE;IAClF,OAAO;QACL,OAAO,EAAE,OAAO;QAChB,eAAe,EAAE,OAAO;QACxB,YAAY,EAAE,CACZ,uBAAC,qBAAc,IAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,QAAQ,YAC7C,uBAAC,eAAQ,IAAC,IAAI,EAAC,cAAc,GAAG,GACjB,CAClB;KACF,CAAC;AACJ,CAAC"}

package/dist/clean-buttons/clean-button.d.ts

@@ -0,0 +1,7 @@
+import type { CleanButtonProps } from './types';
+/**
+ * Прозрачная кнопка.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function CleanButton({ size: sizeProp, href, asLink, children, className, 'data-testid': testId, ...rest }: CleanButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/clean-buttons/clean-button.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CleanButton = CleanButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const link_1 = require("../link");
+const utils_1 = require("./utils");
+const bind_1 = __importDefault(require("classnames/bind"));
+const clean_button_m_scss_1 = __importDefault(require("./clean-button.m.scss"));
+const cx = bind_1.default.bind(clean_button_m_scss_1.default);
+/**
+ * Прозрачная кнопка.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function CleanButton({ size: sizeProp, href, asLink = Boolean(href), children, className, 'data-testid': testId = 'clean-button', ...rest }) {
+    const context = (0, react_1.useContext)(utils_1.CleanButtonContext);
+    const size = sizeProp ?? context.size ?? 's';
+    return ((0, jsx_runtime_1.jsx)(link_1.Link, { ...rest, className: cx('button', `size-${size}`, className, context.className), pseudo: !asLink, href: href, "data-testid": testId, children: children }));
+}
+//# sourceMappingURL=clean-button.js.map

package/dist/clean-buttons/clean-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clean-button.js","sourceRoot":"","sources":["../../src/clean-buttons/clean-button.tsx"],"names":[],"mappings":";;;;;AAcA,kCAwBC;;AArCD,iCAAmC;AACnC,kCAA+B;AAC/B,mCAA6C;AAC7C,2DAAyC;AACzC,gFAA2C;AAE3C,MAAM,EAAE,GAAG,cAAU,CAAC,IAAI,CAAC,6BAAM,CAAC,CAAC;AAEnC;;;;GAIG;AACH,SAAgB,WAAW,CAAC,EAC1B,IAAI,EAAE,QAAQ,EACd,IAAI,EACJ,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,aAAa,EAAE,MAAM,GAAG,cAAc,EACtC,GAAG,IAAI,EACU;IACjB,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,0BAAkB,CAAC,CAAC;IAE/C,MAAM,IAAI,GAAG,QAAQ,IAAI,OAAO,CAAC,IAAI,IAAI,GAAG,CAAC;IAE7C,OAAO,CACL,uBAAC,WAAI,OACC,IAAI,EACR,SAAS,EAAE,EAAE,CAAC,QAAQ,EAAE,QAAQ,IAAI,EAAE,EAAE,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EACrE,MAAM,EAAE,CAAC,MAAM,EACf,IAAI,EAAE,IAAI,iBACG,MAAM,YAElB,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC"}

package/dist/clean-buttons/clean-button.m.scss

@@ -0,0 +1,28 @@
+@use './clean-buttons-util';
+
+.button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-family: inherit;
+
+  // перебиваем стили Link (font-weight: inherit) чтобы не менять их так как компонент много где используется
+  font-weight: 600 !important;
+
+  font-size: 16px;
+  line-height: 24px;
+  overflow: hidden;
+  height: var(--clean-group-height);
+}
+
+.size-s {
+  @include clean-buttons-util.size-s;
+}
+
+.size-m {
+  @include clean-buttons-util.size-m;
+}
+
+.size-l {
+  @include clean-buttons-util.size-l;
+}

package/dist/clean-buttons/clean-group.d.ts

@@ -0,0 +1,8 @@
+import type { CleanGroupProps } from './types';
+/**
+ * Группа прозрачных кнопок.
+ * @todo Добавить возможность задавать свойства корневому элементу.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function CleanGroup({ size: sizeFromProps, children }: CleanGroupProps): import("react/jsx-runtime").JSX.Element;

package/dist/clean-buttons/clean-group.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CleanGroup = CleanGroup;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const utils_1 = require("./utils");
+const bind_1 = __importDefault(require("classnames/bind"));
+const clean_group_m_scss_1 = __importDefault(require("./clean-group.m.scss"));
+const cx = bind_1.default.bind(clean_group_m_scss_1.default);
+/**
+ * Группа прозрачных кнопок.
+ * @todo Добавить возможность задавать свойства корневому элементу.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function CleanGroup({ size: sizeFromProps, children }) {
+    const { size: sizeFromContext, ...itemProps } = (0, react_1.useContext)(utils_1.CleanButtonContext);
+    const size = sizeFromProps ?? sizeFromContext;
+    const itemClassName = cx('item', itemProps.className);
+    return ((0, jsx_runtime_1.jsx)(utils_1.CleanButtonContext.Provider, { value: { size, className: itemClassName }, children: (0, jsx_runtime_1.jsx)("div", { className: cx('group'), children: children }) }));
+}
+//# sourceMappingURL=clean-group.js.map

package/dist/clean-buttons/clean-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clean-group.js","sourceRoot":"","sources":["../../src/clean-buttons/clean-group.tsx"],"names":[],"mappings":";;;;;AAcA,gCAYC;;AAzBD,iCAAmC;AACnC,mCAA6C;AAC7C,2DAAyC;AACzC,8EAA0C;AAE1C,MAAM,EAAE,GAAG,cAAU,CAAC,IAAI,CAAC,4BAAM,CAAC,CAAC;AAEnC;;;;;GAKG;AACH,SAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAmB;IAC3E,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE,GAAG,IAAA,kBAAU,EAAC,0BAAkB,CAAC,CAAC;IAE/E,MAAM,IAAI,GAAG,aAAa,IAAI,eAAe,CAAC;IAE9C,MAAM,aAAa,GAAG,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAEtD,OAAO,CACL,uBAAC,0BAAkB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAE,YACpE,gCAAK,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,YAAG,QAAQ,GAAO,GACjB,CAC/B,CAAC;AACJ,CAAC"}

package/dist/clean-buttons/clean-group.m.scss

@@ -0,0 +1,16 @@
+@use '../colors';
+
+.group {
+  display: flex;
+  flex-wrap: nowrap;
+  overflow: hidden;
+  width: 100%;
+  .item {
+    flex-grow: 1;
+    flex-shrink: 1;
+    flex-basis: 0;
+    + .item {
+      border-left: 1px solid colors.$basic-gray12;
+    }
+  }
+}

package/dist/clean-buttons/index.d.ts

@@ -0,0 +1,3 @@
+export type { CleanButtonSize, CleanButtonProps, CleanGroupProps } from './types';
+export { CleanButton } from './clean-button';
+export { CleanGroup } from './clean-group';

package/dist/clean-buttons/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CleanGroup = exports.CleanButton = void 0;
+var clean_button_1 = require("./clean-button");
+Object.defineProperty(exports, "CleanButton", { enumerable: true, get: function () { return clean_button_1.CleanButton; } });
+var clean_group_1 = require("./clean-group");
+Object.defineProperty(exports, "CleanGroup", { enumerable: true, get: function () { return clean_group_1.CleanGroup; } });
+//# sourceMappingURL=index.js.map

package/dist/clean-buttons/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/clean-buttons/index.ts"],"names":[],"mappings":";;;AACA,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,6CAA2C;AAAlC,yGAAA,UAAU,OAAA"}

package/dist/clean-buttons/types.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from 'react';
+import type { LinkProps } from '../link';
+/**
+ * Размер прозрачных кнопок (высота) по дизайн-гайдам.
+ */
+export type CleanButtonSize = 's' | 'm' | 'l';
+export interface CleanGroupProps {
+    /** Размер (высота). */
+    size?: CleanButtonSize | 'unset';
+    /** Содержимое. */
+    children?: ReactNode;
+}
+export interface CleanButtonProps extends LinkProps {
+    asLink?: boolean;
+    /** Размер (высота). */
+    size?: CleanButtonSize | 'unset';
+}

package/dist/clean-buttons/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/clean-buttons/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/clean-buttons/types.ts"],"names":[],"mappings":""}

package/dist/clean-buttons/utils.d.ts

@@ -0,0 +1,6 @@
+import type { CleanButtonProps } from './types';
+/**
+ * Контекст установки размера группы прозрачных кнопок CleanGroup.
+ * Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
+ */
+export declare const CleanButtonContext: import("react").Context<Pick<CleanButtonProps, "size" | "className">>;

package/dist/clean-buttons/utils.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CleanButtonContext = void 0;
+const react_1 = require("react");
+/**
+ * Контекст установки размера группы прозрачных кнопок CleanGroup.
+ * Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
+ */
+exports.CleanButtonContext = (0, react_1.createContext)({});
+//# sourceMappingURL=utils.js.map

package/dist/clean-buttons/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/clean-buttons/utils.ts"],"names":[],"mappings":";;;AACA,iCAAsC;AAEtC;;;GAGG;AACU,QAAA,kBAAkB,GAAG,IAAA,qBAAa,EAA+C,EAAE,CAAC,CAAC"}

package/dist/colors/index.d.ts

@@ -0,0 +1,45 @@
+/** Цвета дизайн-системы. */
+export declare const COLOR: {
+    readonly 'basic-blue': "#1f84db";
+    readonly 'basic-black': "#000";
+    readonly 'basic-gray87': "#212121";
+    readonly 'basic-gray76': "#3a3a3b";
+    readonly 'basic-gray66': "#545455";
+    readonly 'basic-gray54': "#757575";
+    readonly 'basic-gray38': "#9e9e9e";
+    readonly 'basic-gray24': "#c2c2c2";
+    readonly 'basic-gray12': "#e0e0e0";
+    readonly 'basic-gray8': "#ebebeb";
+    readonly 'basic-gray4': "#f5f5f5";
+    readonly 'basic-gray2': "#fafafa";
+    readonly 'basic-white': "#fff";
+    readonly 'additional-deep-red': "#d50000";
+    readonly 'additional-red': "#fb3a2f";
+    readonly 'additional-light-red': "#feebea";
+    readonly 'additional-dark-teal': "#089176";
+    readonly 'additional-teal': "#09ab8b";
+    readonly 'additional-green': "#00c853";
+    readonly 'additional-light-green': "#64dd17";
+    readonly 'additional-lime': "#aeea00";
+    readonly 'additional-faded-green': "#eff9ea";
+    readonly 'additional-pink': "#e82e5c";
+    readonly 'additional-purple': "#b52ea8";
+    readonly 'additional-violet': "#902bd0";
+    readonly 'additional-deep-purple': "#634bdf";
+    readonly 'additional-electric-blue': "#2962ff";
+    readonly 'additional-light-blue': "#0091ea";
+    readonly 'additional-cyan': "#00b8d4";
+    readonly 'additional-sky': "#e4f1f9";
+    readonly 'additional-deep-orange': "#ff7200";
+    readonly 'additional-amber': "#ffab00";
+    readonly 'additional-yellow': "#ffd600";
+    readonly 'additional-gold': "#d5a43b";
+    readonly 'additional-brown': "#795548";
+    readonly 'additional-blue-gray': "#607d8b";
+    readonly 'additional-deep-blue': "#00599d";
+    readonly 'additional-dark-blue': "#002b41";
+    readonly 'additional-unlit-blue': "#1b75c2";
+    readonly 'additional-crimson': "#f4446b";
+};
+export type Token = keyof typeof COLOR;
+export declare const COLORS: Map<Token, string>;