@ozen-ui/kit 0.0.1

package/__inner__/esm/hooks/useMultiRef/useMultiRef.js

@@ -0,0 +1,22 @@
+import { useMemo, useRef } from 'react';
+/** Создает несколько ссылок (ref) на один DOM-элемент. */
+export function useMultiRef(refs) {
+    // Мемоизирует массив ref'ов
+    var arrRefs = useRef(refs);
+    return useMemo(function () {
+        if (!arrRefs.current.length) {
+            return null;
+        }
+        return function (node) {
+            arrRefs.current.forEach(function (ref) {
+                if (typeof ref === 'function') {
+                    ref(node);
+                }
+                else if (ref) {
+                    // eslint-disable-next-line no-param-reassign
+                    ref.current = node;
+                }
+            });
+        };
+    }, [arrRefs]);
+}

package/__inner__/esm/hooks/usePrevious/index.d.ts

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

package/__inner__/esm/hooks/usePrevious/index.js

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

package/__inner__/esm/hooks/usePrevious/usePrevious.d.ts

@@ -0,0 +1,2 @@
+/** Хук, который возвращает предыдущее значение */
+export declare function usePrevious<T>(value: T): T | null;

package/__inner__/esm/hooks/usePrevious/usePrevious.js

@@ -0,0 +1,9 @@
+import { useEffect, useRef } from 'react';
+/** Хук, который возвращает предыдущее значение */
+export function usePrevious(value) {
+    var ref = useRef(null);
+    useEffect(function () {
+        ref.current = value;
+    }, [value]);
+    return ref.current;
+}

package/__inner__/esm/hooks/useThemeProps/index.d.ts

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

package/__inner__/esm/hooks/useThemeProps/index.js

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

package/__inner__/esm/hooks/useThemeProps/useThemeProps.d.ts

@@ -0,0 +1,7 @@
+import { type Theme } from '../../components/ThemeProvider';
+type UseThemeProps<T> = {
+    props: T;
+    name: keyof Theme['defaultProps'];
+};
+export declare const useThemeProps: <T>({ props, name }: UseThemeProps<T>) => T;
+export {};

package/__inner__/esm/hooks/useThemeProps/useThemeProps.js

@@ -0,0 +1,8 @@
+import { __assign } from "tslib";
+import { useTheme } from '../../components/ThemeProvider';
+export var useThemeProps = function (_a) {
+    var _b;
+    var props = _a.props, name = _a.name;
+    var defaultProps = (_b = useTheme()) === null || _b === void 0 ? void 0 : _b.defaultProps;
+    return __assign(__assign({}, defaultProps === null || defaultProps === void 0 ? void 0 : defaultProps[name]), props);
+};

package/__inner__/esm/hooks/useThemeVars/index.d.ts

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

package/__inner__/esm/hooks/useThemeVars/index.js

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

package/__inner__/esm/hooks/useThemeVars/useThemeVars.d.ts

@@ -0,0 +1,9 @@
+import { themeHelper } from '../../components/ThemeProvider';
+type VariablesVariant = 'color' | 'breakpoint' | 'zIndex' | 'space' | 'borderRadius' | 'borderWidth' | 'shadow' | 'typography' | 'transition';
+export type ThemeVariables = {
+    [P in VariablesVariant]: {
+        [key in (typeof themeHelper)[P][number]]: string;
+    };
+};
+export declare function useThemeVars(): ThemeVariables;
+export {};

package/__inner__/esm/hooks/useThemeVars/useThemeVars.js

@@ -0,0 +1,36 @@
+import { __assign, __read, __values } from "tslib";
+import { useMemo } from 'react';
+import { useTheme, cnThemeProvider, themeHelper, } from '../../components/ThemeProvider';
+var lastThemeTokens;
+var res;
+export function useThemeVars() {
+    var themeTokens = (useTheme() || {}).tokens;
+    return useMemo(function () {
+        var e_1, _a, _b;
+        if (lastThemeTokens === themeTokens) {
+            return res;
+        }
+        lastThemeTokens = themeTokens;
+        var el = document.createElement('div');
+        el.className = cnThemeProvider(themeTokens);
+        document.body.appendChild(el);
+        try {
+            for (var _c = __values(Object.entries(themeHelper)), _d = _c.next(); !_d.done; _d = _c.next()) {
+                var _e = __read(_d.value, 2), key = _e[0], value = _e[1];
+                res = __assign(__assign({}, res), (_b = {}, _b[key] = value.reduce(function (acc, value) {
+                    var _a;
+                    return (__assign(__assign({}, acc), (_a = {}, _a[value] = window.getComputedStyle(el).getPropertyValue(value).trim(), _a)));
+                }, {}), _b));
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (_d && !_d.done && (_a = _c["return"])) _a.call(_c);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        el.remove();
+        return res;
+    }, [themeTokens]);
+}

package/__inner__/esm/hooks/useTimer/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const USE_TIMER_ERROR_EQ_TIME = "[\u00D6zen-UI] useInterval: `startTime` \u043D\u0435 \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u0440\u0430\u0432\u0435\u043D `endTime`.";
+export declare const USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_START_TIME = "[\u00D6zen-UI] useInterval: `interval` \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u043A\u0440\u0430\u0442\u043D\u044B\u043C `startTime`.";
+export declare const USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_END_TIME = "[\u00D6zen-UI] useInterval: `interval` \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u043A\u0440\u0430\u0442\u043D\u044B\u043C `endTime`.";

package/__inner__/esm/hooks/useTimer/constants.js

@@ -0,0 +1,3 @@
+export var USE_TIMER_ERROR_EQ_TIME = '[Özen-UI] useInterval: `startTime` не должен быть равен `endTime`.';
+export var USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_START_TIME = '[Özen-UI] useInterval: `interval` должен быть кратным `startTime`.';
+export var USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_END_TIME = '[Özen-UI] useInterval: `interval` должен быть кратным `endTime`.';

package/__inner__/esm/hooks/useTimer/index.d.ts

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

package/__inner__/esm/hooks/useTimer/index.js

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

package/__inner__/esm/hooks/useTimer/useTimer.d.ts

@@ -0,0 +1,23 @@
+export type TimerOptions = {
+    /** Время старта таймера (миллисекунды) */
+    startTime?: number;
+    /** Время завершения таймера (миллисекунды) */
+    endTime?: number;
+    /** Интервал в миллисекундах */
+    interval?: number;
+    /** Callback-функция вызываемая при завершении времени таймера */
+    onTimerEnd?: () => void;
+};
+export type TimerValues = {
+    /** Счетчик отсчета */
+    count: number;
+    /** Признак запущенного счетчика */
+    isTimerRunning: boolean;
+    /** Запустить таймер */
+    startTimer: () => void;
+    /** Остановить таймер */
+    pauseTimer: () => void;
+    /** Сбросить таймер – сбрасывает count в исходное состояние и останавливает таймер */
+    resetTimer: () => void;
+};
+export declare function useTimer({ startTime, endTime, interval, onTimerEnd, }: TimerOptions): TimerValues;

package/__inner__/esm/hooks/useTimer/useTimer.js

@@ -0,0 +1,76 @@
+import { __assign, __read } from "tslib";
+import { useEffect, useRef, useState } from 'react';
+import { useInterval } from '../useInterval';
+import { USE_TIMER_ERROR_EQ_TIME, USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_END_TIME, USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_START_TIME, } from './constants';
+export function useTimer(_a) {
+    var _b = _a.startTime, startTime = _b === void 0 ? 0 : _b, _c = _a.endTime, endTime = _c === void 0 ? 0 : _c, _d = _a.interval, interval = _d === void 0 ? 1000 : _d, onTimerEnd = _a.onTimerEnd;
+    var _e = __read(useState({
+        count: startTime,
+        isTimerRunning: false
+    }), 2), state = _e[0], setState = _e[1];
+    var savedOnTimerEnd = useRef();
+    var timerCallback = function () {
+        setState(function (_a) {
+            var prevCount = _a.count;
+            var DEC = startTime > endTime;
+            var newCount = DEC ? prevCount - interval : prevCount + interval;
+            if ((DEC && newCount < endTime) || (!DEC && newCount > endTime)) {
+                newCount = endTime;
+            }
+            return {
+                isTimerRunning: newCount !== endTime,
+                count: newCount
+            };
+        });
+    };
+    useInterval(timerCallback, state.isTimerRunning ? interval : null);
+    var resetTimer = function () {
+        setState(function () { return ({
+            isTimerRunning: false,
+            count: startTime
+        }); });
+    };
+    var pauseTimer = function () {
+        setState(function (state) { return (__assign(__assign({}, state), { isTimerRunning: false })); });
+    };
+    var startTimer = function () {
+        setState(function (_a) {
+            var count = _a.count;
+            return ({
+                // Если счетчик завершился – сбрасываем счетчик
+                // Если не завершился продолжаем с текущего счетчика
+                count: count === endTime ? startTime : count,
+                isTimerRunning: startTime !== endTime
+            });
+        });
+    };
+    useEffect(function () {
+        savedOnTimerEnd.current = onTimerEnd;
+    }, [onTimerEnd]);
+    useEffect(function () {
+        if (process.env.NODE_ENV !== 'production') {
+            if (startTime === endTime) {
+                console.error(USE_TIMER_ERROR_EQ_TIME);
+            }
+            if (startTime % interval) {
+                console.error(USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_START_TIME);
+            }
+            if (endTime % interval) {
+                console.error(USE_TIMER_ERROR_MULTIPLICITY_INTERVAL_TO_END_TIME);
+            }
+        }
+    }, [startTime, endTime, interval]);
+    useEffect(function () {
+        var _a;
+        if (state.count === endTime && startTime !== endTime) {
+            (_a = savedOnTimerEnd === null || savedOnTimerEnd === void 0 ? void 0 : savedOnTimerEnd.current) === null || _a === void 0 ? void 0 : _a.call(savedOnTimerEnd);
+        }
+    }, [state.count, endTime, startTime]);
+    return {
+        count: state.count,
+        isTimerRunning: state.isTimerRunning,
+        startTimer: startTimer,
+        pauseTimer: pauseTimer,
+        resetTimer: resetTimer
+    };
+}

package/__inner__/esm/hooks/useUniqueId/index.d.ts

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

package/__inner__/esm/hooks/useUniqueId/index.js

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

package/__inner__/esm/hooks/useUniqueId/useUniqueId.d.ts

@@ -0,0 +1 @@
+export declare function useUniqueId(prefix?: string): string;

package/__inner__/esm/hooks/useUniqueId/useUniqueId.js

@@ -0,0 +1,14 @@
+import { useRef } from 'react';
+var uniqueId = 0;
+var getUniqueId = function () {
+    uniqueId += 1;
+    return uniqueId;
+};
+export function useUniqueId(prefix) {
+    if (prefix === void 0) { prefix = ''; }
+    var idRef = useRef();
+    if (idRef.current === undefined) {
+        idRef.current = getUniqueId();
+    }
+    return "".concat(prefix).concat(idRef.current);
+}

package/__inner__/esm/mixins/MixSpacing/MixSpacing.css

@@ -0,0 +1,336 @@
+.MixSpacing_mt_0 {
+    margin-top: 0 !important;
+  }
+    .MixSpacing_mt_auto {
+    margin-top: auto !important;
+  }
+    .MixSpacing_mt_xs {
+    margin-top: var(--space-xs) !important;
+  }
+    .MixSpacing_mt_s {
+    margin-top: var(--space-s) !important;
+  }
+    .MixSpacing_mt_m {
+    margin-top: var(--space-m) !important;
+  }
+    .MixSpacing_mt_l {
+    margin-top: var(--space-l) !important;
+  }
+    .MixSpacing_mt_xl {
+    margin-top: var(--space-xl) !important;
+  }
+    .MixSpacing_mt_2xl {
+    margin-top: var(--space-2xl) !important;
+  }
+    .MixSpacing_mt_3xl {
+    margin-top: var(--space-3xl) !important;
+  }
+    .MixSpacing_mt_4xl {
+    margin-top: var(--space-4xl) !important;
+  }
+    .MixSpacing_mt_5xl {
+    margin-top: var(--space-5xl) !important;
+  }
+    .MixSpacing_mt_6xl {
+    margin-top: var(--space-6xl) !important;
+  }
+    .MixSpacing_mt_7xl {
+    margin-top: var(--space-7xl) !important;
+  }
+    .MixSpacing_mt_8xl {
+    margin-top: var(--space-8xl) !important;
+  }
+  .MixSpacing_mr_0 {
+    margin-right: 0 !important;
+  }
+  .MixSpacing_mr_auto {
+    margin-right: auto !important;
+  }
+  .MixSpacing_mr_xs {
+    margin-right: var(--space-xs) !important;
+  }
+  .MixSpacing_mr_s {
+    margin-right: var(--space-s) !important;
+  }
+  .MixSpacing_mr_m {
+    margin-right: var(--space-m) !important;
+  }
+  .MixSpacing_mr_l {
+    margin-right: var(--space-l) !important;
+  }
+  .MixSpacing_mr_xl {
+    margin-right: var(--space-xl) !important;
+  }
+  .MixSpacing_mr_2xl {
+    margin-right: var(--space-2xl) !important;
+  }
+  .MixSpacing_mr_3xl {
+    margin-right: var(--space-3xl) !important;
+  }
+  .MixSpacing_mr_4xl {
+    margin-right: var(--space-4xl) !important;
+  }
+  .MixSpacing_mr_5xl {
+    margin-right: var(--space-5xl) !important;
+  }
+  .MixSpacing_mr_6xl {
+    margin-right: var(--space-6xl) !important;
+  }
+  .MixSpacing_mr_7xl {
+    margin-right: var(--space-7xl) !important;
+  }
+  .MixSpacing_mr_8xl {
+    margin-right: var(--space-8xl) !important;
+  }
+  .MixSpacing_mb_0 {
+    margin-bottom: 0 !important;
+  }
+  .MixSpacing_mb_auto {
+    margin-bottom: auto !important;
+  }
+  .MixSpacing_mb_xs {
+    margin-bottom: var(--space-xs) !important;
+  }
+  .MixSpacing_mb_s {
+    margin-bottom: var(--space-s) !important;
+  }
+  .MixSpacing_mb_m {
+    margin-bottom: var(--space-m) !important;
+  }
+  .MixSpacing_mb_l {
+    margin-bottom: var(--space-l) !important;
+  }
+  .MixSpacing_mb_xl {
+    margin-bottom: var(--space-xl) !important;
+  }
+  .MixSpacing_mb_2xl {
+    margin-bottom: var(--space-2xl) !important;
+  }
+  .MixSpacing_mb_3xl {
+    margin-bottom: var(--space-3xl) !important;
+  }
+  .MixSpacing_mb_4xl {
+    margin-bottom: var(--space-4xl) !important;
+  }
+  .MixSpacing_mb_5xl {
+    margin-bottom: var(--space-5xl) !important;
+  }
+  .MixSpacing_mb_6xl {
+    margin-bottom: var(--space-6xl) !important;
+  }
+  .MixSpacing_mb_7xl {
+    margin-bottom: var(--space-7xl) !important;
+  }
+  .MixSpacing_mb_8xl {
+    margin-bottom: var(--space-8xl) !important;
+  }
+  .MixSpacing_ml_0 {
+    margin-left: 0 !important;
+  }
+  .MixSpacing_ml_auto {
+    margin-left: auto !important;
+  }
+  .MixSpacing_ml_xs {
+    margin-left: var(--space-xs) !important;
+  }
+  .MixSpacing_ml_s {
+    margin-left: var(--space-s) !important;
+  }
+  .MixSpacing_ml_m {
+    margin-left: var(--space-m) !important;
+  }
+  .MixSpacing_ml_l {
+    margin-left: var(--space-l) !important;
+  }
+  .MixSpacing_ml_xl {
+    margin-left: var(--space-xl) !important;
+  }
+  .MixSpacing_ml_2xl {
+    margin-left: var(--space-2xl) !important;
+  }
+  .MixSpacing_ml_3xl {
+    margin-left: var(--space-3xl) !important;
+  }
+  .MixSpacing_ml_4xl {
+    margin-left: var(--space-4xl) !important;
+  }
+  .MixSpacing_ml_5xl {
+    margin-left: var(--space-5xl) !important;
+  }
+  .MixSpacing_ml_6xl {
+    margin-left: var(--space-6xl) !important;
+  }
+  .MixSpacing_ml_7xl {
+    margin-left: var(--space-7xl) !important;
+  }
+  .MixSpacing_ml_8xl {
+    margin-left: var(--space-8xl) !important;
+  }
+  .MixSpacing_pt_0 {
+    padding-top: 0 !important;
+  }
+  .MixSpacing_pt_auto {
+    padding-top: auto !important;
+  }
+  .MixSpacing_pt_xs {
+    padding-top: var(--space-xs) !important;
+  }
+  .MixSpacing_pt_s {
+    padding-top: var(--space-s) !important;
+  }
+  .MixSpacing_pt_m {
+    padding-top: var(--space-m) !important;
+  }
+  .MixSpacing_pt_l {
+    padding-top: var(--space-l) !important;
+  }
+  .MixSpacing_pt_xl {
+    padding-top: var(--space-xl) !important;
+  }
+  .MixSpacing_pt_2xl {
+    padding-top: var(--space-2xl) !important;
+  }
+  .MixSpacing_pt_3xl {
+    padding-top: var(--space-3xl) !important;
+  }
+  .MixSpacing_pt_4xl {
+    padding-top: var(--space-4xl) !important;
+  }
+  .MixSpacing_pt_5xl {
+    padding-top: var(--space-5xl) !important;
+  }
+  .MixSpacing_pt_6xl {
+    padding-top: var(--space-6xl) !important;
+  }
+  .MixSpacing_pt_7xl {
+    padding-top: var(--space-7xl) !important;
+  }
+  .MixSpacing_pt_8xl {
+    padding-top: var(--space-8xl) !important;
+  }
+  .MixSpacing_pr_0 {
+    padding-right: 0 !important;
+  }
+  .MixSpacing_pr_auto {
+    padding-right: auto !important;
+  }
+  .MixSpacing_pr_xs {
+    padding-right: var(--space-xs) !important;
+  }
+  .MixSpacing_pr_s {
+    padding-right: var(--space-s) !important;
+  }
+  .MixSpacing_pr_m {
+    padding-right: var(--space-m) !important;
+  }
+  .MixSpacing_pr_l {
+    padding-right: var(--space-l) !important;
+  }
+  .MixSpacing_pr_xl {
+    padding-right: var(--space-xl) !important;
+  }
+  .MixSpacing_pr_2xl {
+    padding-right: var(--space-2xl) !important;
+  }
+  .MixSpacing_pr_3xl {
+    padding-right: var(--space-3xl) !important;
+  }
+  .MixSpacing_pr_4xl {
+    padding-right: var(--space-4xl) !important;
+  }
+  .MixSpacing_pr_5xl {
+    padding-right: var(--space-5xl) !important;
+  }
+  .MixSpacing_pr_6xl {
+    padding-right: var(--space-6xl) !important;
+  }
+  .MixSpacing_pr_7xl {
+    padding-right: var(--space-7xl) !important;
+  }
+  .MixSpacing_pr_8xl {
+    padding-right: var(--space-8xl) !important;
+  }
+  .MixSpacing_pb_0 {
+    padding-bottom: 0 !important;
+  }
+  .MixSpacing_pb_auto {
+    padding-bottom: auto !important;
+  }
+  .MixSpacing_pb_xs {
+    padding-bottom: var(--space-xs) !important;
+  }
+  .MixSpacing_pb_s {
+    padding-bottom: var(--space-s) !important;
+  }
+  .MixSpacing_pb_m {
+    padding-bottom: var(--space-m) !important;
+  }
+  .MixSpacing_pb_l {
+    padding-bottom: var(--space-l) !important;
+  }
+  .MixSpacing_pb_xl {
+    padding-bottom: var(--space-xl) !important;
+  }
+  .MixSpacing_pb_2xl {
+    padding-bottom: var(--space-2xl) !important;
+  }
+  .MixSpacing_pb_3xl {
+    padding-bottom: var(--space-3xl) !important;
+  }
+  .MixSpacing_pb_4xl {
+    padding-bottom: var(--space-4xl) !important;
+  }
+  .MixSpacing_pb_5xl {
+    padding-bottom: var(--space-5xl) !important;
+  }
+  .MixSpacing_pb_6xl {
+    padding-bottom: var(--space-6xl) !important;
+  }
+  .MixSpacing_pb_7xl {
+    padding-bottom: var(--space-7xl) !important;
+  }
+  .MixSpacing_pb_8xl {
+    padding-bottom: var(--space-8xl) !important;
+  }
+  .MixSpacing_pl_0 {
+    padding-left: 0 !important;
+  }
+  .MixSpacing_pl_auto {
+    padding-left: auto !important;
+  }
+  .MixSpacing_pl_xs {
+    padding-left: var(--space-xs) !important;
+  }
+  .MixSpacing_pl_s {
+    padding-left: var(--space-s) !important;
+  }
+  .MixSpacing_pl_m {
+    padding-left: var(--space-m) !important;
+  }
+  .MixSpacing_pl_l {
+    padding-left: var(--space-l) !important;
+  }
+  .MixSpacing_pl_xl {
+    padding-left: var(--space-xl) !important;
+  }
+  .MixSpacing_pl_2xl {
+    padding-left: var(--space-2xl) !important;
+  }
+  .MixSpacing_pl_3xl {
+    padding-left: var(--space-3xl) !important;
+  }
+  .MixSpacing_pl_4xl {
+    padding-left: var(--space-4xl) !important;
+  }
+  .MixSpacing_pl_5xl {
+    padding-left: var(--space-5xl) !important;
+  }
+  .MixSpacing_pl_6xl {
+    padding-left: var(--space-6xl) !important;
+  }
+  .MixSpacing_pl_7xl {
+    padding-left: var(--space-7xl) !important;
+  }
+  .MixSpacing_pl_8xl {
+    padding-left: var(--space-8xl) !important;
+  }

package/__inner__/esm/mixins/MixSpacing/MixSpacing.d.ts

@@ -0,0 +1,11 @@
+import './MixSpacing.css';
+export type MixSpacingSpaceValue = 0 | 'auto' | 'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | '8xl';
+export declare const mixSpacingMarginVariant: readonly ["m", "mt", "mr", "ml", "mb", "mx", "my"];
+export declare const mixSpacingPaddingVariant: readonly ["p", "pt", "pr", "pl", "pb", "px", "py"];
+export declare const mixSpacingSpaceVariant: ("p" | "m" | "mt" | "mr" | "ml" | "mb" | "mx" | "my" | "pt" | "pr" | "pl" | "pb" | "px" | "py")[];
+export type MixSpacingSpaceVariant = (typeof mixSpacingSpaceVariant)[number];
+export type MixSpacingProps = {
+    [key in MixSpacingSpaceVariant]?: MixSpacingSpaceValue;
+};
+export declare const cnMixSpacing: import("@bem-react/classname").ClassNameFormatter;
+export declare const spacing: (props?: MixSpacingProps) => string;

package/__inner__/esm/mixins/MixSpacing/MixSpacing.js

@@ -0,0 +1,42 @@
+import { __assign, __read, __spreadArray } from "tslib";
+import { cn } from '../../utils/classname';
+import './MixSpacing.css';
+export var mixSpacingMarginVariant = [
+    'm',
+    'mt',
+    'mr',
+    'ml',
+    'mb',
+    'mx',
+    'my',
+];
+export var mixSpacingPaddingVariant = [
+    'p',
+    'pt',
+    'pr',
+    'pl',
+    'pb',
+    'px',
+    'py',
+];
+export var mixSpacingSpaceVariant = __spreadArray(__spreadArray([], __read(mixSpacingMarginVariant), false), __read(mixSpacingPaddingVariant), false);
+export var cnMixSpacing = cn('MixSpacing');
+export var spacing = function (props) {
+    var spaces = props &&
+        Object.entries(props).reduce(function (acc, _a) {
+            var _b;
+            var _c = __read(_a, 2), key = _c[0], value = _c[1];
+            return (__assign(__assign({}, acc), (_b = {}, _b[key] = String(value), _b)));
+        }, {});
+    var _a = spaces || {}, mt = _a.mt, mr = _a.mr, mb = _a.mb, ml = _a.ml, pt = _a.pt, pr = _a.pr, pb = _a.pb, pl = _a.pl, p = _a.p, m = _a.m, mx = _a.mx, my = _a.my, px = _a.px, py = _a.py;
+    return cnMixSpacing({
+        mt: mt || my || m,
+        mr: mr || mx || m,
+        mb: mb || my || m,
+        ml: ml || mx || m,
+        pt: pt || py || p,
+        pr: pr || px || p,
+        pb: pb || py || p,
+        pl: pl || px || p
+    });
+};

package/__inner__/esm/mixins/MixSpacing/index.d.ts

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

package/__inner__/esm/mixins/MixSpacing/index.js

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

package/__inner__/esm/types/Breakpoints.d.ts

@@ -0,0 +1,2 @@
+export declare const breakpointVariant: readonly ["xs", "s", "m", "l"];
+export type BreakpointVariant = (typeof breakpointVariant)[number];

package/__inner__/esm/types/Breakpoints.js

@@ -0,0 +1 @@
+export var breakpointVariant = ['xs', 's', 'm', 'l'];

package/__inner__/esm/types/ExtendableProps.d.ts

@@ -0,0 +1 @@
+export type ExtendableProps<ExtendedProps = Record<string, unknown>, OverrideProps = Record<string, unknown>> = OverrideProps & Omit<ExtendedProps, keyof OverrideProps>;

package/__inner__/esm/types/ExtendableProps.js

@@ -0,0 +1 @@
+export {};