@cube-dev/ui-kit 0.16.4 → 0.18.0

package/types/tasty/styles/types.d.ts

@@ -1,9 +1,9 @@
 import { CSSProperties } from 'react';
 import { ResponsiveStyleValue } from '../utils/styles';
-declare type NamedColor = 'purple' | 'purple-text' | 'purple-01' | 'purple-02' | 'purple-03' | 'purple-04' | 'dark' | 'dark-01' | 'dark-02' | 'dark-03' | 'dark-04' | 'dark-05' | 'text' | 'primary' | 'disabled' | 'disabled-bg' | 'disabled-text' | 'danger' | 'danger-bg' | 'danger-text' | 'success' | 'success-bg' | 'success-text' | 'note' | 'note-bg' | 'note-text' | 'white' | 'light' | 'light-grey' | 'black' | 'pink' | 'pink-01' | 'pink-02' | 'border' | 'clear' | 'shadow' | 'draft' | 'minor';
-declare type Digit = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
-declare type OpaquePercentage = '' | `.${Digit}` | `.${Digit}${Digit}` | '.100';
-export declare type NoType = false | null | undefined;
+type NamedColor = 'purple' | 'purple-text' | 'purple-01' | 'purple-02' | 'purple-03' | 'purple-04' | 'dark' | 'dark-01' | 'dark-02' | 'dark-03' | 'dark-04' | 'dark-05' | 'text' | 'primary' | 'disabled' | 'disabled-bg' | 'disabled-text' | 'danger' | 'danger-bg' | 'danger-text' | 'success' | 'success-bg' | 'success-text' | 'note' | 'note-bg' | 'note-text' | 'white' | 'light' | 'light-grey' | 'black' | 'pink' | 'pink-01' | 'pink-02' | 'border' | 'clear' | 'shadow' | 'draft' | 'minor';
+type Digit = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
+type OpaquePercentage = '' | `.${Digit}` | `.${Digit}${Digit}` | '.100';
+export type NoType = false | null | undefined;
 export interface StylesInterface extends Omit<CSSProperties, 'color' | 'fill' | 'font' | 'outline' | 'type'> {
     /** Set the background color of the element.
      * ```
@@ -103,13 +103,13 @@ export interface StylesInterface extends Omit<CSSProperties, 'color' | 'fill' |
      */
     justify?: CSSProperties['justifyItems'] | CSSProperties['justifyContent'];
 }
-export declare type SuffixForSelector = '&' | '.' | 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I' | 'J' | 'K' | 'L' | 'M' | 'N' | 'O' | 'P' | 'Q' | 'R' | 'S' | 'T' | 'U' | 'V' | 'W' | 'X' | 'Y' | 'Z';
-export declare type Selector = `${SuffixForSelector}${string}`;
-export declare type NotSelector = Exclude<string, Selector | keyof StylesInterface>;
-export declare type StylesWithoutSelectors = {
+export type SuffixForSelector = '&' | '.' | 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I' | 'J' | 'K' | 'L' | 'M' | 'N' | 'O' | 'P' | 'Q' | 'R' | 'S' | 'T' | 'U' | 'V' | 'W' | 'X' | 'Y' | 'Z';
+export type Selector = `${SuffixForSelector}${string}`;
+export type NotSelector = Exclude<string, Selector | keyof StylesInterface>;
+export type StylesWithoutSelectors = {
     [key in keyof StylesInterface]?: ResponsiveStyleValue<StylesInterface[key]>;
 };
-export declare type Styles = StylesWithoutSelectors & {
+export type Styles = StylesWithoutSelectors & {
     [key: string]: ResponsiveStyleValue<string | number | boolean | undefined> | StylesWithoutSelectors;
 };
 export {};

package/types/tasty/tasty.d.ts

@@ -2,10 +2,17 @@ import { ComponentType } from 'react';
 import { AllBaseProps, BaseProps, BaseStyleProps, Props } from './types';
 import { Styles, StylesInterface } from './styles/types';
 import { ResponsiveStyleValue } from './utils/styles';
-declare type StyleList = readonly (keyof {
+type StyleList = readonly (keyof {
     [key in keyof StylesInterface]: StylesInterface[key];
 })[];
-export declare type TastyProps<K extends StyleList, DefaultProps = Props> = {
+export type PropsWithStyles = {
+    styles?: Styles;
+} & Omit<Props, 'styles'>;
+export type VariantMap = Record<string, Styles>;
+export type WithVariant<V extends VariantMap> = {
+    variant?: keyof V;
+};
+export type TastyProps<K extends StyleList, V extends VariantMap, DefaultProps = Props> = {
     /** The tag name of the element. */
     as?: string;
     /** Default styles of the element. */
@@ -13,24 +20,21 @@ export declare type TastyProps<K extends StyleList, DefaultProps = Props> = {
     /** The list of styles that can be provided by props */
     styleProps?: K;
     element?: BaseProps['element'];
-} & Partial<Omit<DefaultProps, 'as' | 'styles' | 'styleProps'>>;
+    variants?: V;
+} & Partial<Omit<DefaultProps, 'as' | 'styles' | 'styleProps'>> & Pick<BaseProps, 'qa' | 'qaVal'> & WithVariant<V>;
 export interface GlobalTastyProps {
     breakpoints?: number[];
 }
-export declare type AllBasePropsWithMods<K extends StyleList> = AllBaseProps & {
+export type AllBasePropsWithMods<K extends StyleList> = AllBaseProps & {
     [key in K[number]]?: ResponsiveStyleValue<StylesInterface[key]>;
 } & BaseStyleProps;
-declare type TastyPropsWithDefaults<Props extends {
-    styles?: Styles;
-}, DefaultProps extends Partial<Props>> = keyof DefaultProps extends never ? Props : {
+type TastyComponentPropsWithDefaults<Props extends PropsWithStyles, DefaultProps extends Partial<Props>> = keyof DefaultProps extends never ? Props : {
     [key in Extract<keyof Props, keyof DefaultProps>]?: Props[key];
 } & {
     [key in keyof Omit<Props, keyof DefaultProps>]: Props[key];
 };
-declare function tasty<K extends StyleList>(options: TastyProps<K>, secondArg?: never): any;
+declare function tasty<K extends StyleList, V extends VariantMap>(options: TastyProps<K, V>, secondArg?: never): ComponentType<Omit<Props, 'variant'> & WithVariant<V>>;
 declare function tasty(selector: string, styles?: Styles): any;
-declare function tasty<Props extends {
-    styles?: Styles;
-}, DefaultProps extends Partial<Props> = Partial<Props>>(Component: ComponentType<Props>, options?: TastyProps<never, Props>): ComponentType<TastyPropsWithDefaults<Props, DefaultProps>>;
-declare const Element: any;
+declare function tasty<Props extends PropsWithStyles, DefaultProps extends Partial<Props> = Partial<Props>>(Component: ComponentType<Props>, options?: TastyProps<never, never, Props>): ComponentType<TastyComponentPropsWithDefaults<Props, DefaultProps>>;
+declare const Element: ComponentType<Omit<Props, "variant"> & WithVariant<VariantMap>>;
 export { tasty, Element };

package/types/tasty/types.d.ts

@@ -4,7 +4,7 @@ import { BASE_STYLES, BLOCK_STYLES, COLOR_STYLES, CONTAINER_STYLES, DIMENSION_ST
 export interface GlobalStyledProps {
     breakpoints?: number[];
 }
-declare type Caps = 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I' | 'J' | 'K' | 'L' | 'M' | 'N' | 'O' | 'P' | 'Q' | 'R' | 'S' | 'T' | 'U' | 'V' | 'W' | 'X' | 'Y' | 'Z';
+type Caps = 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I' | 'J' | 'K' | 'L' | 'M' | 'N' | 'O' | 'P' | 'Q' | 'R' | 'S' | 'T' | 'U' | 'V' | 'W' | 'X' | 'Y' | 'Z';
 export interface BasePropsWithoutChildren extends Pick<AllHTMLAttributes<HTMLElement>, 'className' | 'role' | 'id'> {
     /** QA ID for e2e testing. An alias for `data-qa` attribute. */
     qa?: string;
@@ -44,16 +44,16 @@ export interface BaseProps extends BasePropsWithoutChildren, Pick<AllHTMLAttribu
 export interface AllBaseProps<K extends keyof HTMLElementTagNameMap = 'div'> extends BaseProps, Omit<AllHTMLAttributes<HTMLElementTagNameMap[K]>, 'style' | 'size' | 'disabled' | 'hidden' | 'css' | 'color' | 'height' | 'width'> {
     as?: string;
 }
-export declare type BaseStyleProps = Pick<Styles, typeof BASE_STYLES[number]>;
-export declare type PositionStyleProps = Pick<Styles, typeof POSITION_STYLES[number]>;
-export declare type BlockStyleProps = Pick<Styles, typeof BLOCK_STYLES[number]>;
-export declare type ColorStyleProps = Pick<Styles, typeof COLOR_STYLES[number]>;
-export declare type TextStyleProps = Pick<Styles, typeof TEXT_STYLES[number]>;
-export declare type DimensionStyleProps = Pick<Styles, typeof DIMENSION_STYLES[number]>;
-export declare type FlowStyleProps = Pick<Styles, typeof FLOW_STYLES[number]>;
-export declare type ContainerStyleProps = Pick<Styles, typeof CONTAINER_STYLES[number]>;
-export declare type OuterStyleProps = Pick<Styles, typeof OUTER_STYLES[number]>;
-export declare type ShortGridStyles = {
+export type BaseStyleProps = Pick<Styles, (typeof BASE_STYLES)[number]>;
+export type PositionStyleProps = Pick<Styles, (typeof POSITION_STYLES)[number]>;
+export type BlockStyleProps = Pick<Styles, (typeof BLOCK_STYLES)[number]>;
+export type ColorStyleProps = Pick<Styles, (typeof COLOR_STYLES)[number]>;
+export type TextStyleProps = Pick<Styles, (typeof TEXT_STYLES)[number]>;
+export type DimensionStyleProps = Pick<Styles, (typeof DIMENSION_STYLES)[number]>;
+export type FlowStyleProps = Pick<Styles, (typeof FLOW_STYLES)[number]>;
+export type ContainerStyleProps = Pick<Styles, (typeof CONTAINER_STYLES)[number]>;
+export type OuterStyleProps = Pick<Styles, (typeof OUTER_STYLES)[number]>;
+export type ShortGridStyles = {
     template?: Styles['gridTemplate'];
     columns?: Styles['gridColumns'];
     rows?: Styles['gridRows'];
@@ -62,7 +62,7 @@ export declare type ShortGridStyles = {
 export interface Props {
     [key: string]: any;
 }
-export declare type TagName = keyof HTMLElementTagNameMap;
+export type TagName = keyof HTMLElementTagNameMap;
 export interface TagNameProps {
     /** The tag name you want to use for the element */
     as?: TagName;

package/types/tasty/utils/cache-wrapper.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Create a function that caches the result up to the limit.
+ */
+export declare function cacheWrapper<T extends (firstArg: any, secondArg?: string) => any>(handler: T, limit?: number): T;

package/types/tasty/utils/case-converter.d.ts

@@ -0,0 +1 @@
+export declare function camelToKebab(str: string): string;

package/types/tasty/utils/modAttrs.d.ts

@@ -2,4 +2,6 @@
  * Generate data DOM attributes from modifier map.
  */
 import { AllBaseProps } from '../types';
-export declare function modAttrs(map: AllBaseProps['mods']): Record<string, string> | null;
+declare function modAttrs(map: AllBaseProps['mods']): Record<string, string> | null;
+declare const _modAttrs: typeof modAttrs;
+export { _modAttrs as modAttrs };

package/types/tasty/utils/renderStyles.d.ts

@@ -7,4 +7,4 @@ export declare function isSelector(key: any): any;
  * @param {string} [suffix]
  * @return {string}
  */
-export declare function renderStyles(styles: Styles, responsive: number[], suffix?: string): any;
+export declare function renderStyles(styles?: Styles, responsive?: number[], suffix?: string): any;

package/types/tasty/utils/styles.d.ts

@@ -1,18 +1,18 @@
 import { Styles } from '../styles/types';
-export declare type StyleValue<T = string> = T | boolean | number | null | undefined;
-export declare type StyleValueStateMap<T = string> = {
+export type StyleValue<T = string> = T | boolean | number | null | undefined;
+export type StyleValueStateMap<T = string> = {
     [key: string]: StyleValue<T>;
 };
-export declare type ResponsiveStyleValue<T = string> = StyleValue<T> | StyleValue<T>[] | StyleValueStateMap<T> | StyleValueStateMap<T>[];
-export declare type ComputeModel = string | number;
-export declare type CSSMap = {
+export type ResponsiveStyleValue<T = string> = StyleValue<T> | StyleValue<T>[] | StyleValueStateMap<T> | StyleValueStateMap<T>[];
+export type ComputeModel = string | number;
+export type CSSMap = {
     $?: string | string[];
 } & {
     [key: string]: string | string[];
 };
-export declare type StyleHandlerResult = CSSMap | CSSMap[] | void;
-export declare type RawStyleHandler = (value: StyleValueStateMap, suffix?: string) => StyleHandlerResult;
-export declare type StyleHandler = RawStyleHandler & {
+export type StyleHandlerResult = CSSMap | CSSMap[] | void;
+export type RawStyleHandler = (value: StyleValueStateMap, suffix?: string) => StyleHandlerResult;
+export type StyleHandler = RawStyleHandler & {
     __lookupStyles: string[];
 };
 export interface StyleStateData {
@@ -37,8 +37,8 @@ export interface ParsedColor {
     name?: string;
     opacity?: number;
 }
-export declare type StyleStateDataList = StyleStateData[];
-export declare type StyleStateDataListMap = {
+export type StyleStateDataList = StyleStateData[];
+export type StyleStateDataListMap = {
     [key: string]: StyleStateDataList;
 };
 /** An object that describes a relation between specific modifiers and style value. **/
@@ -58,23 +58,23 @@ export interface RenderedStyleState {
     /** The value to apply */
     value: string;
 }
-export declare type ComputeUnit = string | (string | string[])[];
-export declare type StyleStateList = StyleState[];
-export declare type RenderedStyleStateList = RenderedStyleState[];
-export declare type StyleMap = {
+export type ComputeUnit = string | (string | string[])[];
+export type StyleStateList = StyleState[];
+export type RenderedStyleStateList = RenderedStyleState[];
+export type StyleMap = {
     [key: string]: ResponsiveStyleValue;
 };
-export declare type StyleStateMap = {
+export type StyleStateMap = {
     [key: string]: StyleState;
 };
-export declare type RenderedStyleStateMap = {
+export type RenderedStyleStateMap = {
     [key: string]: RenderedStyleState;
 };
-export declare type StyleStateMapList = StyleStateMap[];
-export declare type RenderedStyleStateMapList = {
+export type StyleStateMapList = StyleStateMap[];
+export type RenderedStyleStateMapList = {
     [key: string]: RenderedStyleStateMap;
 };
-export declare type StyleStateListMap = {
+export type StyleStateListMap = {
     [key: string]: StyleStateList;
 };
 export declare const CUSTOM_UNITS: {
@@ -189,8 +189,4 @@ export declare const COMPUTE_FUNC_MAP: {
 export declare function computeState(computeModel: ComputeModel, valueMap: (number | boolean)[] | {
     [key: string]: boolean;
 } | Function): any;
-/**
- * Create a function that caches the result up to the limit.
- */
-export declare function cacheWrapper<T extends (firstArg: any, secondArg?: string) => any>(handler: T, limit?: number): T;
 export {};

package/types/utils/react/mergeProps.d.ts

@@ -1,10 +1,5 @@
 import { Props } from '../../tasty';
-declare type TupleTypes<T> = {
-    [P in keyof T]: T[P];
-} extends {
-    [key: number]: infer V;
-} ? V : never;
-declare type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+type Merge<T> = T extends [infer F, ...infer R] ? F extends undefined ? Merge<R> : F & Merge<R> : T extends [infer L] ? L : unknown;
 /**
  * Merges multiple props objects together. Event handlers are chained,
  * classNames are combined, and ids are deduplicated - different ids
@@ -12,5 +7,5 @@ declare type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) e
  * For all other props, the last prop object overrides all previous ones.
  * @param args - Multiple sets of props to merge together.
  */
-export declare function mergeProps<T extends (Props | undefined)[], K = UnionToIntersection<TupleTypes<T>>>(...args: T): K;
+export declare function mergeProps<T extends (Props | undefined)[], K = Merge<T>>(...args: T): K;
 export {};

package/types/utils/react/nullableValue.d.ts

@@ -5,15 +5,15 @@ export declare function castNullableArrayValue<T>(props: T): T;
 export declare function castNullableIsSelected<T>(props: T): T;
 export declare function castNullableSelectedKey<T>(props: T): T;
 export declare function castNullableField<T>(props: T, keys: string[], type?: string, cast?: (k: any) => any): T;
-export declare type WithNullableValue<T extends Props> = Omit<T, 'value' | 'defaultValue'> & {
+export type WithNullableValue<T extends Props> = Omit<T, 'value' | 'defaultValue'> & {
     value?: T['value'] | any;
     defaultValue?: T['defaultValue'] | any;
 };
-export declare type WithNullableSelected<T extends Props> = Omit<T, 'isSelected' | 'defaultSelected'> & {
+export type WithNullableSelected<T extends Props> = Omit<T, 'isSelected' | 'defaultSelected'> & {
     isSelected?: T['isSelected'] | any;
     defaultSelected?: T['defaultSelected'] | any;
 };
-export declare type WithNullableSelectedKey<T extends Props> = Omit<T, 'selectedKey' | 'defaultSelectedKey'> & {
+export type WithNullableSelectedKey<T extends Props> = Omit<T, 'selectedKey' | 'defaultSelectedKey'> & {
     selectedKey?: T['selectedKey'] | any;
     defaultSelectedKey?: T['defaultSelectedKey'] | any;
 };

package/cjs/providers/StyleProvider.js

@@ -1,48 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useContextStyles = exports.StyleProvider = exports.StyleContext = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-exports.StyleContext = (0, react_1.createContext)({});
-/**
- * @deprecated
- */
-function StyleProvider({ children, ...props }) {
-    const styles = Object.assign({}, (0, react_1.useContext)(exports.StyleContext));
-    Object.keys(props).forEach((propName) => {
-        if (styles[propName]) {
-            styles[propName] = [...styles[propName], props[propName]];
-        }
-        else {
-            styles[propName] = [props[propName]];
-        }
-    });
-    // @ts-ignore
-    return ((0, jsx_runtime_1.jsx)(exports.StyleContext.Provider, { value: styles, children: children }, void 0));
-}
-exports.StyleProvider = StyleProvider;
-/**
- * @deprecated
- */
-function useContextStyles(name, props) {
-    const contextStyles = (0, react_1.useContext)(exports.StyleContext);
-    if (!name)
-        return null;
-    const styles = {};
-    if (contextStyles[name]) {
-        contextStyles[name].forEach((handler) => {
-            Object.assign(styles, typeof handler === 'function' ? handler(props) : handler);
-        });
-    }
-    return styles;
-}
-exports.useContextStyles = useContextStyles;
-
-        

package/cjs/styled/index.js

@@ -1,22 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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("./styled"), exports);
-
-        

package/cjs/styled/styled.js

@@ -1,102 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.styled = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = __importStar(require("styled-components"));
-const react_1 = require("react");
-const react_is_1 = require("react-is");
-const tasty_1 = require("../tasty");
-const StyleProvider_1 = require("../providers/StyleProvider");
-// Implementation
-function styled(Component, options) {
-    (0, tasty_1.deprecationWarning)(options?.props == null, {
-        property: 'props',
-        name: 'styled api',
-        betterAlternative: "inline props directly in styled(), eg: styled({ type: 'confirm' })",
-    });
-    if (typeof Component === 'string') {
-        let selector = Component;
-        let styles = options;
-        let Element = (0, styled_components_1.createGlobalStyle) `${(css) => css}`;
-        const _Component = ({ breakpoints }) => {
-            let contextBreakpoints = (0, react_1.useContext)(tasty_1.BreakpointsContext);
-            let zones = (0, tasty_1.pointsToZones)(breakpoints || contextBreakpoints);
-            let css = `${styles ? `\n{}${selector}{${(0, tasty_1.renderStyles)(styles, zones)}}` : ''}`;
-            return (0, jsx_runtime_1.jsx)(Element, { css: css }, void 0);
-        };
-        _Component.displayName = `CubeStyled(${Element.displayName ?? Element.name ?? Component})`;
-        return _Component;
-    }
-    if ((0, react_is_1.isValidElementType)(Component)) {
-        let { styles: extendStyles, props: legacyDefaultProps, name, tag: extendTag, ...defaultProps } = options ?? {};
-        const _StyledComponent = (0, react_1.forwardRef)((props, ref) => {
-            const { styles, styleName, as, ...restProps } = props;
-            const mergedStyles = (0, react_1.useMemo)(() => {
-                if (extendStyles != null && styles != null) {
-                    return (0, tasty_1.mergeStyles)(extendStyles, styles);
-                }
-                return extendStyles;
-            }, [styles]);
-            return ((0, jsx_runtime_1.jsx)(Component, { ref: ref, ...legacyDefaultProps, ...defaultProps, ...restProps, styles: mergedStyles, styleName: styleName ?? name, as: as ?? extendTag }, void 0));
-        });
-        _StyledComponent.displayName = `CubeStyled(${(0, tasty_1.getDisplayName)(Component)})`;
-        return _StyledComponent;
-    }
-    options = Component;
-    let { name, tag = 'div', css: defaultCSS, styles: defaultStyles, props: defaultProps, styleProps, } = options;
-    let Element = styled_components_1.default[tag](({ css }) => css);
-    let _StyledComponent = (0, react_1.forwardRef)((allProps, ref) => {
-        let { as, styles, styleName, breakpoints, mods, element, qa, qaVal, css, ...props } = allProps;
-        let { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps ?? {};
-        let propStyles = (0, react_1.useMemo)(() => (styleProps
-            ? styleProps.concat(tasty_1.BASE_STYLES)
-            : tasty_1.BASE_STYLES).reduce((map, prop) => {
-            if (prop in props) {
-                map[prop] = props[prop];
-                delete props[prop];
-            }
-            return map;
-        }, {}), [props]);
-        let contextStyles = (0, StyleProvider_1.useContextStyles)(styleName ?? name, props);
-        let allStyles = (0, react_1.useMemo)(() => (0, tasty_1.mergeStyles)(defaultStyles, contextStyles, styles, propStyles), [contextStyles, styles, propStyles]);
-        let contextBreakpoints = (0, react_1.useContext)(tasty_1.BreakpointsContext);
-        let zones = (0, tasty_1.pointsToZones)(breakpoints ?? contextBreakpoints);
-        let renderedStyles = (0, react_1.useMemo)(() => (0, tasty_1.renderStyles)(allStyles, zones), [allStyles, zones]);
-        css = `${defaultCSS ?? ''}${css ?? ''}${allStyles ? renderedStyles : ''}`;
-        if (mods) {
-            Object.assign(props, (0, tasty_1.modAttrs)(mods));
-        }
-        return ((0, jsx_runtime_1.jsx)(Element, { as: as ?? tag, "data-element": element, "data-qa": qa || defaultQa, "data-qaval": qaVal || defaultQaVal, ...otherDefaultProps, ...props, ref: ref, css: css }, void 0));
-    });
-    _StyledComponent.displayName = `CubeStyled(${Element.displayName ?? Element.name ?? tag})`;
-    return _StyledComponent;
-}
-exports.styled = styled;
-
-        

package/cjs/test/index.js

@@ -1,23 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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("./utils"), exports);
-__exportStar(require("./render"), exports);
-
-        

package/cjs/test/render.js

@@ -1,49 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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 });
-exports.renderWithForm = exports.renderWithRoot = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("@testing-library/react");
-const forms_1 = require("../components/forms");
-const Root_1 = require("../components/Root");
-function renderWithRoot(ui, options) {
-    return (0, react_1.render)(ui, { ...options, wrapper: Root_1.Root });
-}
-exports.renderWithRoot = renderWithRoot;
-function renderWithForm(ui, options) {
-    const { formProps, ...testingLibraryOptions } = options ?? {};
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    let formInstance;
-    return {
-        ...(0, react_1.render)(ui, {
-            ...testingLibraryOptions,
-            wrapper: function Wrapper({ children }) {
-                const [form] = forms_1.Form.useForm();
-                formInstance = form;
-                return ((0, jsx_runtime_1.jsx)(Root_1.Root, { children: (0, jsx_runtime_1.jsx)(forms_1.Form, { ...formProps, form: form, children: children }, void 0) }, void 0));
-            },
-        }),
-        // @ts-expect-error TS2454
-        formInstance,
-    };
-}
-exports.renderWithForm = renderWithForm;
-__exportStar(require("@testing-library/react"), exports);
-
-        

package/cjs/test/setup.js

@@ -1,20 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-require("@testing-library/jest-dom");
-require("@testing-library/jest-dom/extend-expect");
-require("jest-styled-components");
-const react_1 = require("@testing-library/react");
-const react_transition_group_1 = require("react-transition-group");
-const node_abort_controller_1 = require("node-abort-controller");
-global.AbortController = node_abort_controller_1.AbortController;
-react_transition_group_1.config.disabled = true;
-(0, react_1.configure)({ testIdAttribute: 'data-qa', asyncUtilTimeout: 10000 });
-
-        

package/cjs/test/utils/index.js

@@ -1,22 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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("./wait"), exports);
-
-        

package/cjs/test/utils/wait.js

@@ -1,16 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.wait = void 0;
-function wait(timeout = 100) {
-    return new Promise((res) => setTimeout(res, timeout));
-}
-exports.wait = wait;
-
-        

package/es/providers/StyleProvider.js

@@ -1,43 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext } from 'react';
-export const StyleContext = createContext({});
-/**
- * @deprecated
- */
-export function StyleProvider({ children, ...props }) {
-    const styles = Object.assign({}, useContext(StyleContext));
-    Object.keys(props).forEach((propName) => {
-        if (styles[propName]) {
-            styles[propName] = [...styles[propName], props[propName]];
-        }
-        else {
-            styles[propName] = [props[propName]];
-        }
-    });
-    // @ts-ignore
-    return (_jsx(StyleContext.Provider, { value: styles, children: children }, void 0));
-}
-/**
- * @deprecated
- */
-export function useContextStyles(name, props) {
-    const contextStyles = useContext(StyleContext);
-    if (!name)
-        return null;
-    const styles = {};
-    if (contextStyles[name]) {
-        contextStyles[name].forEach((handler) => {
-            Object.assign(styles, typeof handler === 'function' ? handler(props) : handler);
-        });
-    }
-    return styles;
-}
-
-        

package/es/styled/index.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.4
- * Released under the MIT license.
- */
-
-export * from './styled';
-
-