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

package/spinner/index.d.ts

@@ -1,34 +0,0 @@
-/// <reference types="react" />
-import { Token } from '../colors';
-/**
- * @deprecated Следует использовать 's' | 'm' | 'l'.
- */
-type SpinnerLegacySize = 'small' | 'medium' | 'large';
-export type SpinnerSize = 's' | 'm' | 'l';
-export interface SpinnerProps {
-    /** Размер. */
-    size?: SpinnerSize | SpinnerLegacySize;
-    /** Цвет. */
-    color?: Token;
-    /** Класс. */
-    className?: string;
-    /** Стили. */
-    style?: React.CSSProperties;
-    /** Идентификатор для систем автоматизированного тестирования. */
-    'data-testid'?: string | null;
-}
-export declare const DIAMETERS: Record<SpinnerSize | SpinnerLegacySize, number>;
-/**
- * Компонент спиннера.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function Spinner({ size, color, className, style, 'data-testid': testId, }: SpinnerProps): JSX.Element;
-/**
- * Спиннер.
- * Выделен в отдельный компонент для возможности использования без обертки в виде div.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function SpinnerSVG({ size, color, className, style, 'data-testid': testId, }: SpinnerProps): JSX.Element;
-export {};

package/spinner/index.js

@@ -1,45 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SpinnerSVG = exports.Spinner = exports.DIAMETERS = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const lodash_1 = require("lodash");
-const colors_1 = require("../colors");
-const bind_1 = __importDefault(require("classnames/bind"));
-const spinner_module_scss_1 = __importDefault(require("./spinner.module.scss"));
-const cx = bind_1.default.bind(spinner_module_scss_1.default);
-exports.DIAMETERS = {
-    s: 20,
-    m: 48,
-    l: 80,
-    // legacy, @todo удалить со временем:
-    small: 20,
-    medium: 48,
-    large: 80,
-};
-const DEFAULT_COLOR = 'basic-blue';
-/**
- * Компонент спиннера.
- * @param props Свойства.
- * @return Элемент.
- */
-function Spinner({ size = 'm', color = DEFAULT_COLOR, className, style, 'data-testid': testId = 'spinner', }) {
-    const readySize = (0, lodash_1.has)(exports.DIAMETERS, size) ? size : 'm';
-    const readyColor = colors_1.COLORS.has(color) ? color : DEFAULT_COLOR;
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: className, style: style, "data-testid": testId }, { children: (0, jsx_runtime_1.jsx)(SpinnerSVG, { size: readySize, color: readyColor, "data-testid": null }) })));
-}
-exports.Spinner = Spinner;
-/**
- * Спиннер.
- * Выделен в отдельный компонент для возможности использования без обертки в виде div.
- * @param props Свойства.
- * @return Элемент.
- */
-function SpinnerSVG({ size = 'm', color = DEFAULT_COLOR, className, style, 'data-testid': testId = 'spinner', }) {
-    const diameter = exports.DIAMETERS[size];
-    const radius = diameter / 2;
-    return ((0, jsx_runtime_1.jsx)("svg", Object.assign({ style: style, className: cx('spinner', `size-${size}`, className), viewBox: `0 0 ${diameter} ${diameter}`, width: diameter, height: diameter, stroke: colors_1.COLORS.get(color), "data-testid": testId }, { children: (0, jsx_runtime_1.jsx)("circle", { className: cx('circle'), cx: radius, cy: radius, r: radius - 1 }) })));
-}
-exports.SpinnerSVG = SpinnerSVG;

package/spinner/spinner.module.scss

@@ -1,79 +0,0 @@
-@use 'sass:map';
-
-$pi: 3.141592653589793;
-$sizes: (
-  s: 20,
-  m: 48,
-  l: 80,
-  // legacy, @todo удалить со временем:
-  small: 20,
-  medium: 48,
-  large: 80,
-);
-$durations: (
-  s: 600ms,
-  m: 750ms,
-  l: 950ms,
-  // legacy, @todo удалить со временем:
-  small: 600ms,
-  medium: 750ms,
-  large: 950ms,
-);
-
-.spinner {
-  display: block;
-  .circle {
-    fill: none;
-    stroke-width: 2;
-    stroke-linecap: round;
-  }
-  @each $sizeKey, $size in $sizes {
-    $diameter: $size - 2;
-    $perimeter: $diameter * $pi;
-    &.size-#{$sizeKey} {
-      width: #{$diameter}px;
-      height: #{$diameter}px;
-      .circle {
-        animation: dash-#{$sizeKey} map.get($durations, $sizeKey) linear infinite;
-      }
-      @keyframes dash-#{$sizeKey} {
-        0% {
-          stroke-dasharray: $perimeter * 0.125, $perimeter * 0.875;
-          stroke-dashoffset: $perimeter * 0.25;
-        }
-        50% {
-          stroke-dasharray: $perimeter * 0.5, $perimeter * 0.5;
-        }
-        100% {
-          stroke-dasharray: $perimeter * 0.125, $perimeter * 0.875;
-          stroke-dashoffset: -$perimeter + ($perimeter * 0.25);
-        }
-      }
-    }
-  }
-}
-
-// fallback (в IE не поддерживается CSS-анимация SVG)
-@media all and (-ms-high-contrast: none) {
-  @each $sizeKey, $size in $sizes {
-    $diameter: $size - 2;
-    $perimeter: $diameter * $pi;
-
-    // IE11 only
-    *::-ms-backdrop,
-    .spinner {
-      animation: rotate 2s linear infinite;
-    }
-    *::-ms-backdrop,
-    .spinner.size-#{$sizeKey} .circle {
-      stroke-dasharray: $perimeter * 0.75, $perimeter * 0.25;
-      stroke-dashoffset: $perimeter * 0.25;
-    }
-  }
-}
-
-@keyframes rotate {
-  to {
-    transform: rotate(360deg);
-  }
-}

package/stepper/index.d.ts

@@ -1,38 +0,0 @@
-import { CSSProperties, InputHTMLAttributes, MouseEventHandler } from 'react';
-/** Размер Stepper (влияет на высоту и минимальную ширину). */
-export type StepperSize = 's' | 'm';
-/** Стили Stepper. */
-export interface StepperStyle extends CSSProperties {
-    /** Ширина. */
-    '--stepper-width'?: string;
-}
-export interface StepperProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'style'> {
-    /** Нужно ли выводить кнопку добавления. */
-    canAdd?: boolean;
-    /** Нужно ли выводить кнопку вычитания. */
-    canSubtract?: boolean;
-    /** Делает кнопку "+" отключенной. */
-    plusDisabled?: boolean;
-    /** Делает кнопку "-" отключенной. */
-    minusDisabled?: boolean;
-    /** Нужно ли предотвращать blur на поле при нажатии "+/-". */
-    buttonClickBehavior?: 'prevent-input-blur';
-    /** Сработает при добавлении. */
-    onAdd?: MouseEventHandler;
-    /** Сработает при вычитании. */
-    onSubtract?: MouseEventHandler;
-    /** Размер. */
-    size?: StepperSize;
-    /** Идентификатор для систем автоматизированного тестирования. */
-    'data-testid'?: string;
-    /** Стили корневого элемента. */
-    style?: StepperStyle;
-    /** Нужно ли показывать состояние ошибки. */
-    failed?: boolean;
-}
-/**
- * Stepper - поле ввода количества.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare const Stepper: import("react").ForwardRefExoticComponent<StepperProps & import("react").RefAttributes<HTMLInputElement>>;

package/stepper/index.js

@@ -1,49 +0,0 @@
-"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.Stepper = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Plus_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Plus"));
-const Minus_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Minus"));
-const stepper_module_scss_1 = __importDefault(require("./stepper.module.scss"));
-const bind_1 = __importDefault(require("classnames/bind"));
-const cx = bind_1.default.bind(stepper_module_scss_1.default);
-/**
- * Stepper - поле ввода количества.
- * @param props Свойства.
- * @return Элемент.
- */
-exports.Stepper = (0, react_1.forwardRef)(function Stepper(_a, forwardedRef) {
-    var _b, _c;
-    var { buttonClickBehavior, canAdd = true, canSubtract = true, className, disabled, plusDisabled = disabled, minusDisabled = disabled, readOnly, onAdd, onBlur, onChange, onFocus, onSubtract, size = 'm', style, value, failed, 'data-testid': testId = 'stepper' } = _a, inputProps = __rest(_a, ["buttonClickBehavior", "canAdd", "canSubtract", "className", "disabled", "plusDisabled", "minusDisabled", "readOnly", "onAdd", "onBlur", "onChange", "onFocus", "onSubtract", "size", "style", "value", "failed", 'data-testid']);
-    const ref = (0, react_1.useRef)(null);
-    const [focused, setFocused] = (0, react_1.useState)(false);
-    (0, react_1.useImperativeHandle)(forwardedRef, () => ref.current);
-    const noBlurOnMousedown = (0, react_1.useCallback)(event => {
-        if (focused && event.target !== ref.current && buttonClickBehavior === 'prevent-input-blur') {
-            event.preventDefault();
-        }
-    }, [focused, buttonClickBehavior]);
-    const rootClassName = cx('root', `size-${size}`, { disabled, focused, failed }, className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ "data-testid": testId, style: style, className: rootClassName, onMouseDown: noBlurOnMousedown }, { children: [(0, jsx_runtime_1.jsx)("button", Object.assign({ tabIndex: -1, hidden: !canSubtract, disabled: (_b = minusDisabled !== null && minusDisabled !== void 0 ? minusDisabled : disabled) !== null && _b !== void 0 ? _b : readOnly, className: cx('button'), "data-testid": 'stepper:minus', "aria-label": '\u0423\u043C\u0435\u043D\u044C\u0448\u0438\u0442\u044C', onMouseDown: noBlurOnMousedown, onClick: canSubtract && !minusDisabled && !disabled && !readOnly ? onSubtract : undefined }, { children: (0, jsx_runtime_1.jsx)(Minus_1.default, { className: stepper_module_scss_1.default.svg }) })), (0, jsx_runtime_1.jsx)("input", Object.assign({}, inputProps, { ref: ref, readOnly: readOnly, "data-testid": 'stepper:input', className: cx('input'), value: value, disabled: disabled, onChange: onChange, onFocus: e => {
-                    setFocused(true);
-                    onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
-                }, onBlur: e => {
-                    setFocused(false);
-                    onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
-                } })), (0, jsx_runtime_1.jsx)("button", Object.assign({ tabIndex: -1, hidden: !canAdd, disabled: (_c = plusDisabled !== null && plusDisabled !== void 0 ? plusDisabled : disabled) !== null && _c !== void 0 ? _c : readOnly, className: cx('button'), "data-testid": 'stepper:plus', "aria-label": '\u0423\u0432\u0435\u043B\u0438\u0447\u0438\u0442\u044C', onMouseDown: noBlurOnMousedown, onClick: canAdd && !plusDisabled && !disabled && !readOnly ? onAdd : undefined }, { children: (0, jsx_runtime_1.jsx)(Plus_1.default, { className: stepper_module_scss_1.default.svg }) }))] })));
-});

package/stepper/stepper.module.scss

@@ -1,82 +0,0 @@
-@use '../colors';
-
-.root {
-  display: flex;
-  align-items: center;
-  border: 1px solid transparent;
-  border-radius: 4px;
-  color: colors.$basic-gray87;
-  background: colors.$basic-gray8;
-  &.focused {
-    border-color: colors.$basic-blue;
-  }
-  &.disabled {
-    color: colors.$basic-gray24;
-    border-color: colors.$basic-gray4;
-    background: colors.$basic-gray4;
-  }
-  &.failed {
-    color: colors.$additional-deep-red;
-  }
-  &.size-s {
-    --stepper-button-width: 24px;
-    width: var(--stepper-width, 122px);
-    height: 40px;
-  }
-  &.size-m {
-    --stepper-button-width: 32px;
-    width: var(--stepper-width, 160px);
-    height: 48px;
-  }
-}
-
-.input {
-  border: 0;
-  padding: 0;
-
-  // не надо делать transparent: https://stackoverflow.com/q/43483363/13166471
-  background: inherit;
-  outline: 0;
-  width: 0;
-  flex-grow: 1;
-  text-align: center;
-  color: inherit;
-  font: inherit;
-  font-weight: 600;
-  height: 100%;
-  font-size: 16px;
-  line-height: 24px;
-}
-
-.button {
-  display: flex;
-  align-items: center;
-  border: 0;
-  padding: 0;
-  background: transparent;
-  width: var(--stepper-button-width);
-  height: 100%;
-  color: colors.$basic-gray87;
-  flex-shrink: 0;
-  &:first-child {
-    justify-content: flex-end;
-  }
-  &:last-child {
-    justify-content: flex-start;
-  }
-  &:not(.hidden):not(:disabled) {
-    cursor: pointer;
-  }
-  &:disabled {
-    color: colors.$basic-gray24;
-    pointer-events: none;
-  }
-  &[hidden] {
-    pointer-events: none;
-    opacity: 0;
-  }
-}
-
-.svg {
-  fill: currentColor;
-}

package/stroked-svg/index.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="react" />
-export interface StrokedSVGProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
-    /** Компонент, выводящий svg-элемент. */
-    component: React.ComponentType<React.SVGAttributes<SVGSVGElement>>;
-    /** Цвет внешней обводки. */
-    stroke?: string;
-    /** Ширина внешней обводки. */
-    strokeWidth?: number;
-    /** Цвет заливки. */
-    fill?: string;
-}
-/**
- * Выводит иконку с внешней обводкой.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare const StrokedSVG: import("react").ForwardRefExoticComponent<StrokedSVGProps & import("react").RefAttributes<HTMLDivElement>>;

package/stroked-svg/index.js

@@ -1,32 +0,0 @@
-"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.StrokedSVG = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const colors_1 = require("../colors");
-const classnames_1 = __importDefault(require("classnames"));
-const index_module_scss_1 = __importDefault(require("./index.module.scss"));
-/**
- * Выводит иконку с внешней обводкой.
- * @param props Свойства.
- * @return Элемент.
- */
-exports.StrokedSVG = (0, react_1.forwardRef)((_a, ref) => {
-    var { component: Tag, fill, stroke = colors_1.COLORS.get('basic-gray4'), strokeWidth = 1, className } = _a, restProps = __rest(_a, ["component", "fill", "stroke", "strokeWidth", "className"]);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: (0, classnames_1.default)(index_module_scss_1.default.root, className) }, restProps, { children: [(0, jsx_runtime_1.jsx)(Tag, { stroke: stroke, strokeWidth: `${strokeWidth * 2}px`, className: index_module_scss_1.default.stroke }), (0, jsx_runtime_1.jsx)(Tag, { fill: fill, className: index_module_scss_1.default.svg })] })));
-});
-exports.StrokedSVG.displayName = 'StrokedSVG';

package/styling/borders.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InnerBorder = void 0;
-const bind_1 = __importDefault(require("classnames/bind"));
-const borders_module_scss_1 = __importDefault(require("./borders.module.scss"));
-const cx = bind_1.default.bind(borders_module_scss_1.default);
-/** @deprecated */
-exports.InnerBorder = {
-    y: cx('inner-border-y'),
-    top: cx('inner-border-top'),
-    bottom: cx('inner-border-bottom'),
-};

package/styling/borders.module.scss

@@ -1,13 +0,0 @@
-@use '../colors';
-
-.inner-border-top {
-  box-shadow: inset 0 1px 0 colors.$basic-gray12;
-}
-
-.inner-border-bottom {
-  box-shadow: inset 0 -1px 0 colors.$basic-gray12;
-}
-
-.inner-border-y {
-  box-shadow: inset 0 1px 0 colors.$basic-gray12, inset 0 -1px 0 colors.$basic-gray12;
-}

package/styling/colors.d.ts

@@ -1,10 +0,0 @@
-/** @deprecated */
-export declare const color: (value: "basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue") => string | undefined;
-/** @deprecated */
-export declare const hoverColor: (value: "basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue") => string | undefined;
-/** @deprecated */
-export declare const bgColor: (value: "basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue") => string | undefined;
-/** @deprecated */
-export declare const stroke: (value: "basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue") => string | undefined;
-/** @deprecated */
-export declare const fill: (value: "basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue") => string | undefined;

package/styling/colors.js

@@ -1,20 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.fill = exports.stroke = exports.bgColor = exports.hoverColor = exports.color = void 0;
-const utils_1 = require("./utils");
-const colors_1 = require("../colors");
-const colors_module_scss_1 = __importDefault(require("./colors.module.scss"));
-const isColorKey = colors_1.COLORS.has.bind(colors_1.COLORS);
-/** @deprecated */
-exports.color = (0, utils_1.ClassGetter)(colors_module_scss_1.default, isColorKey, 'color__');
-/** @deprecated */
-exports.hoverColor = (0, utils_1.ClassGetter)(colors_module_scss_1.default, isColorKey, 'hover-color__');
-/** @deprecated */
-exports.bgColor = (0, utils_1.ClassGetter)(colors_module_scss_1.default, isColorKey, 'bg-color__');
-/** @deprecated */
-exports.stroke = (0, utils_1.ClassGetter)(colors_module_scss_1.default, isColorKey, 'stroke__');
-/** @deprecated */
-exports.fill = (0, utils_1.ClassGetter)(colors_module_scss_1.default, isColorKey, 'fill__');

package/styling/colors.module.scss

@@ -1,19 +0,0 @@
-@use '../colors';
-
-@each $key, $color in module-variables(colors) {
-  .color__#{$key} {
-    color: $color;
-  }
-  .hover-color__#{$key}:hover {
-    color: $color;
-  }
-  .bg-color__#{$key} {
-    background-color: $color;
-  }
-  .stroke__#{$key} {
-    stroke: $color;
-  }
-  .fill__#{$key} {
-    fill: $color;
-  }
-}

package/styling/fonts.js

@@ -1,17 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.weight = exports.lineHeight = exports.size = exports.WEIGHTS = exports.LINE_HEIGHTS = exports.SIZES = void 0;
-const utils_1 = require("./utils");
-const fonts_module_scss_1 = __importDefault(require("./fonts.module.scss"));
-exports.SIZES = new Set([12, 14, 16, 20, 24, 32, 48, 64]);
-exports.LINE_HEIGHTS = new Set([16, 20, 24, 28, 32, 40, 60, 80]);
-exports.WEIGHTS = new Set([400, 600, 700]);
-/** @deprecated */
-exports.size = (0, utils_1.ClassGetter)(fonts_module_scss_1.default, exports.SIZES.has.bind(exports.SIZES), 'size-');
-/** @deprecated */
-exports.lineHeight = (0, utils_1.ClassGetter)(fonts_module_scss_1.default, exports.LINE_HEIGHTS.has.bind(exports.LINE_HEIGHTS), 'line-height-');
-/** @deprecated */
-exports.weight = (0, utils_1.ClassGetter)(fonts_module_scss_1.default, exports.WEIGHTS.has.bind(exports.WEIGHTS), 'weight-');

package/styling/shadows.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BoxShadow = void 0;
-const shadows_module_scss_1 = __importDefault(require("./shadows.module.scss"));
-/** @deprecated */
-exports.BoxShadow = {
-    z1: shadows_module_scss_1.default['shadow-z1'],
-    z2: shadows_module_scss_1.default['shadow-z2'],
-    z2straight: shadows_module_scss_1.default['shadow-z2-straight'],
-    z3: shadows_module_scss_1.default['shadow-z3'],
-    z4: shadows_module_scss_1.default['shadow-z4'],
-};

package/styling/shadows.module.scss

@@ -1,19 +0,0 @@
-.shadow-z1 {
-  box-shadow: 0 0 4px rgba(0, 0, 0, 0.04), 0 2px 4px rgba(0, 0, 0, 0.08);
-}
-
-.shadow-z2 {
-  box-shadow: 0 0 4px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.1);
-}
-
-.shadow-z2-straight {
-  box-shadow: 0 0 15px rgba(0, 0, 0, 0.12);
-}
-
-.shadow-z3 {
-  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08), 0 0 4px rgba(0, 0, 0, 0.04);
-}
-
-.shadow-z4 {
-  box-shadow: 0 0 4px rgba(0, 0, 0, 0.04), 0 12px 30px rgba(0, 0, 0, 0.1);
-}

package/styling/shapes.js

@@ -1,31 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MediumRounds = exports.SmallRounds = void 0;
-const shapes_module_scss_1 = __importDefault(require("./shapes.module.scss"));
-/** @deprecated */
-exports.SmallRounds = {
-    all: shapes_module_scss_1.default['rounds-sm__all'],
-    top: shapes_module_scss_1.default['rounds-sm__t'],
-    right: shapes_module_scss_1.default['rounds-sm__r'],
-    bottom: shapes_module_scss_1.default['rounds-sm__b'],
-    left: shapes_module_scss_1.default['rounds-sm__l'],
-    topLeft: shapes_module_scss_1.default['rounds-sm__t-l'],
-    topRight: shapes_module_scss_1.default['rounds-sm__t-r'],
-    bottomLeft: shapes_module_scss_1.default['rounds-sm__b-l'],
-    bottomRight: shapes_module_scss_1.default['rounds-sm__b-r'],
-};
-/** @deprecated */
-exports.MediumRounds = {
-    all: shapes_module_scss_1.default['rounds-md__all'],
-    top: shapes_module_scss_1.default['rounds-md__t'],
-    right: shapes_module_scss_1.default['rounds-md__r'],
-    bottom: shapes_module_scss_1.default['rounds-md__b'],
-    left: shapes_module_scss_1.default['rounds-md__l'],
-    topLeft: shapes_module_scss_1.default['rounds-md__t-l'],
-    topRight: shapes_module_scss_1.default['rounds-md__t-r'],
-    bottomLeft: shapes_module_scss_1.default['rounds-md__b-l'],
-    bottomRight: shapes_module_scss_1.default['rounds-md__b-r'],
-};

package/styling/sizes.js

@@ -1,40 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.paddingLeft = exports.paddingBottom = exports.paddingRight = exports.paddingTop = exports.marginLeft = exports.marginBottom = exports.marginRight = exports.marginTop = exports.isPadding = exports.isMargin = void 0;
-const utils_1 = require("./utils");
-const sizes_module_scss_1 = __importDefault(require("./sizes.module.scss"));
-/**
- * Проверяет, является ли значение шагом дизайн-системы для внешних отступов.
- * @deprecated
- * @param value Значение.
- * @return Результат.
- */
-const isMargin = (value) => Number.isInteger(value) && value >= -8 && value <= 32;
-exports.isMargin = isMargin;
-/**
- * Проверяет, является ли значение шагом дизайн-системы для внутренних отступов.
- * @deprecated
- * @param value Значение.
- * @return Результат.
- */
-const isPadding = (value) => Number.isInteger(value) && value >= 0 && value <= 32;
-exports.isPadding = isPadding;
-/** @deprecated */
-exports.marginTop = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isMargin, 'M-t__');
-/** @deprecated */
-exports.marginRight = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isMargin, 'M-r__');
-/** @deprecated */
-exports.marginBottom = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isMargin, 'M-b__');
-/** @deprecated */
-exports.marginLeft = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isMargin, 'M-l__');
-/** @deprecated */
-exports.paddingTop = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isPadding, 'P-t__');
-/** @deprecated */
-exports.paddingRight = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isPadding, 'P-r__');
-/** @deprecated */
-exports.paddingBottom = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isPadding, 'P-b__');
-/** @deprecated */
-exports.paddingLeft = (0, utils_1.ClassGetter)(sizes_module_scss_1.default, exports.isPadding, 'P-l__');

package/styling/utils.d.ts

@@ -1,9 +0,0 @@
-/**
- * Фабрика геттеров CSS-классов.
- * @param classes Классы из CSS-модуля.
- * @param isValidKey Функция проверки ключа для класса.
- * @param [prefix=''] Префикс имени класса.
- * @return Геттер CSS-класса.
- * @deprecated
- */
-export declare const ClassGetter: <T = string | number>(classes: Record<string, string>, isValidKey: (s: T) => boolean, prefix?: string) => (value: T) => string | undefined;

package/styling/utils.js

@@ -1,20 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ClassGetter = void 0;
-const bind_1 = __importDefault(require("classnames/bind"));
-/**
- * Фабрика геттеров CSS-классов.
- * @param classes Классы из CSS-модуля.
- * @param isValidKey Функция проверки ключа для класса.
- * @param [prefix=''] Префикс имени класса.
- * @return Геттер CSS-класса.
- * @deprecated
- */
-const ClassGetter = (classes, isValidKey, prefix = '') => {
-    const cx = bind_1.default.bind(classes);
-    return (value) => (isValidKey(value) ? cx(`${prefix}${value}`) : undefined);
-};
-exports.ClassGetter = ClassGetter;

package/super-ellipse-clip-path/index.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-export interface SuperEllipseClipPathProps {
-    /** Идентификатор. */
-    id?: string;
-}
-/**
- * Выводит svg-элемент, содержащий clipPath в форме "супер-эллипса".
- * @param props Свойства.
- * @return Элемент.
- */
-export declare const SuperEllipseClipPath: ({ id }: SuperEllipseClipPathProps) => JSX.Element;