@cube-dev/ui-kit 0.17.0 → 0.18.0

package/es/utils/react/useCombinedRefs.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/es/utils/react/useId.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/es/utils/react/useLayoutEffect.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/es/utils/react/useViewportSize.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/es/utils/react/wrapNodeIfPlain.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/es/utils/transitions.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/es/utils/tree.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/es/utils/warnings.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.0
  * Released under the MIT license.
  */
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cube-dev/ui-kit",
-  "version": "0.17.0",
+  "version": "0.18.0",
   "description": "UIKit for Cube Projects",
   "keywords": [
     "uikit"
@@ -13,68 +13,68 @@
     "styled-components": ">= 5.3.0"
   },
   "dependencies": {
-    "@ant-design/icons": "^4.7.0",
-    "@react-aria/button": "3.6.2",
-    "@react-aria/checkbox": "3.6.0",
-    "@react-aria/combobox": "3.4.2",
-    "@react-aria/dialog": "3.4.0",
-    "@react-aria/focus": "3.9.0",
-    "@react-aria/i18n": "3.6.1",
-    "@react-aria/interactions": "3.12.0",
-    "@react-aria/listbox": "3.7.0",
-    "@react-aria/menu": "3.6.2",
-    "@react-aria/numberfield": "3.3.2",
-    "@react-aria/overlays": "3.11.0",
-    "@react-aria/radio": "3.4.0",
+    "@ant-design/icons": "^5.0.1",
+    "@react-aria/button": "3.6.4",
+    "@react-aria/checkbox": "3.7.1",
+    "@react-aria/combobox": "3.4.4",
+    "@react-aria/dialog": "3.4.2",
+    "@react-aria/focus": "3.10.1",
+    "@react-aria/i18n": "3.6.3",
+    "@react-aria/interactions": "3.13.1",
+    "@react-aria/listbox": "3.7.2",
+    "@react-aria/menu": "3.7.1",
+    "@react-aria/numberfield": "3.3.4",
+    "@react-aria/overlays": "3.12.1",
+    "@react-aria/radio": "3.4.2",
     "@react-aria/searchfield": "3.4.4",
-    "@react-aria/select": "3.8.2",
-    "@react-aria/selection": "3.11.0",
-    "@react-aria/separator": "3.2.4",
+    "@react-aria/select": "3.8.4",
+    "@react-aria/selection": "3.12.1",
+    "@react-aria/separator": "3.2.6",
     "@react-aria/slider": "3.2.4",
-    "@react-aria/ssr": "3.3.0",
-    "@react-aria/switch": "3.2.4",
-    "@react-aria/textfield": "3.7.2",
-    "@react-aria/tooltip": "3.3.2",
-    "@react-aria/utils": "3.14.0",
-    "@react-aria/visually-hidden": "3.5.0",
-    "@react-spectrum/utils": "3.7.4",
-    "@react-stately/checkbox": "3.3.0",
-    "@react-stately/collections": "3.4.4",
-    "@react-stately/combobox": "3.2.2",
-    "@react-stately/list": "3.5.4",
-    "@react-stately/menu": "3.4.2",
-    "@react-stately/numberfield": "3.2.2",
-    "@react-stately/overlays": "3.4.2",
-    "@react-stately/radio": "3.6.0",
+    "@react-aria/ssr": "3.4.1",
+    "@react-aria/switch": "3.3.1",
+    "@react-aria/textfield": "3.8.1",
+    "@react-aria/tooltip": "3.3.4",
+    "@react-aria/utils": "3.14.2",
+    "@react-aria/visually-hidden": "3.6.1",
+    "@react-spectrum/utils": "3.8.1",
+    "@react-stately/checkbox": "3.3.2",
+    "@react-stately/collections": "3.5.1",
+    "@react-stately/combobox": "3.3.1",
+    "@react-stately/list": "3.6.1",
+    "@react-stately/menu": "3.4.4",
+    "@react-stately/numberfield": "3.3.1",
+    "@react-stately/overlays": "3.4.4",
+    "@react-stately/radio": "3.6.2",
     "@react-stately/searchfield": "3.3.4",
-    "@react-stately/select": "3.3.2",
-    "@react-stately/selection": "^3.11.2",
+    "@react-stately/select": "3.3.4",
+    "@react-stately/selection": "3.11.2",
     "@react-stately/slider": "3.2.4",
-    "@react-stately/toggle": "3.4.2",
-    "@react-stately/tooltip": "3.2.2",
-    "@react-stately/tree": "3.3.4",
-    "@react-stately/utils": "3.5.1",
-    "@react-types/button": "3.6.2",
-    "@react-types/checkbox": "3.4.0",
-    "@react-types/combobox": "3.5.4",
-    "@react-types/dialog": "3.4.4",
-    "@react-types/menu": "3.7.2",
-    "@react-types/numberfield": "3.3.4",
-    "@react-types/overlays": "3.6.4",
-    "@react-types/radio": "3.3.0",
-    "@react-types/select": "3.6.4",
-    "@react-types/shared": "3.15.0",
+    "@react-stately/toggle": "3.4.4",
+    "@react-stately/tooltip": "3.2.4",
+    "@react-stately/tree": "3.4.1",
+    "@react-stately/utils": "3.5.2",
+    "@react-types/button": "3.7.0",
+    "@react-types/checkbox": "3.4.1",
+    "@react-types/combobox": "3.5.5",
+    "@react-types/dialog": "3.4.5",
+    "@react-types/menu": "3.7.3",
+    "@react-types/numberfield": "3.3.5",
+    "@react-types/overlays": "3.6.5",
+    "@react-types/radio": "3.3.1",
+    "@react-types/select": "3.6.5",
+    "@react-types/shared": "3.16.0",
     "@react-types/slider": "3.3.1",
-    "@react-types/switch": "3.2.4",
-    "@react-types/textfield": "3.6.0",
-    "@react-types/tooltip": "3.2.4",
+    "@react-types/switch": "3.2.5",
+    "@react-types/textfield": "3.6.2",
+    "@react-types/tooltip": "3.2.5",
     "clipboard-copy": "^4.0.1",
     "clsx": "^1.1.1",
     "email-validator": "^2.0.4",
     "prismjs": "^1.25.0",
-    "react-focus-lock": "^2.9.3",
+    "react-focus-lock": "^2.9.4",
     "react-is": "^17.0.0",
-    "react-keyed-flatten-children": "1.3.0",
+    "react-keyed-flatten-children": "^1.3.0",
     "react-transition-group": "^4.4.2",
     "tiny-invariant": "^1.3.1",
     "valid-url": "^1.0.9"

package/types/components/Root.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import { BaseProps } from '../tasty';
+import { TrackingProps } from '../providers/TrackingProvider';
 export interface CubeRootProps extends BaseProps {
     tokens?: {
         [key: string]: string;
@@ -13,5 +14,6 @@ export interface CubeRootProps extends BaseProps {
     font?: string;
     monospaceFont?: string;
     applyLegacyTokens?: boolean;
+    tracking?: TrackingProps;
 }
 export declare function Root(allProps: CubeRootProps): JSX.Element;

package/types/components/actions/use-action.d.ts

@@ -21,7 +21,12 @@ export declare function parseTo(to: any): {
     nativeRoute: boolean;
     href: string | undefined;
 };
-export declare function performClickHandler(evt: any, router: any, to: any, onPress: any): void;
+export declare function performClickHandler(evt: any, { router, to, onPress, tracking }: {
+    router: any;
+    to: any;
+    onPress: any;
+    tracking: any;
+}): void;
 export declare const useAction: ({ to, as, htmlType, label, mods, onPress, ...props }: CubeUseActionProps, ref: FocusableRef<HTMLElement>) => {
     actionProps: {
         'aria-label': string | undefined;

package/types/components/overlays/Dialog/DialogForm.d.ts

@@ -3,7 +3,7 @@ import { CubeFormProps } from '../../forms/Form/Form';
 import { CubeButtonProps } from '../../actions';
 import { FieldTypes } from '../../forms';
 import { CubeDialogProps } from './Dialog';
-export interface CubeDialogFormProps<T extends FieldTypes = FieldTypes> extends CubeDialogProps, Omit<CubeFormProps<T>, 'role'> {
+export interface CubeDialogFormProps<T extends FieldTypes = FieldTypes> extends Omit<CubeDialogProps, 'children'>, Omit<CubeFormProps<T>, 'role' | 'children'> {
     /** Whether the submit button has a `danger` theme */
     danger?: boolean;
     /** Properties for submit button. Use `label` to change text. */
@@ -16,6 +16,8 @@ export interface CubeDialogFormProps<T extends FieldTypes = FieldTypes> extends
     noActions?: boolean;
     /** The title of the dialog */
     title?: string;
+    /** Children nodes or render function  */
+    children?: CubeFormProps['children'] | ((onLocalDismiss: () => void) => CubeFormProps['children']);
 }
 export interface CubeDialogFormRef {
     open: () => void;

package/types/index.d.ts

@@ -131,7 +131,6 @@ export declare const Typography: {
 };
 export { Text, Title, Paragraph };
 export type { CubeTextProps, CubeTitleProps, CubeParagraphProps };
-export { useContextStyles, StyleProvider } from './providers/StyleProvider';
 export { Provider } from './provider';
 export type { useProviderProps } from './provider';
 export { Portal } from './components/portal';
@@ -141,7 +140,6 @@ export type { TagName, TagNameProps, AllBaseProps, BaseProps, BaseStyleProps, Di
 export * from './tasty';
 export { ModalProvider } from '@react-aria/overlays';
 export * from './utils/react';
-export * from './styled';
 export * from './tasty';
 export { default as copy } from 'clipboard-copy';
 export * from '@react-aria/ssr';

package/types/providers/TrackingProvider.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode, RefObject } from 'react';
+export interface TrackingProps {
+    event?: (name: string, data?: Record<string, any>, ref?: RefObject<HTMLElement>) => void;
+}
+export declare const TrackingContext: import("react").Context<TrackingProps>;
+export interface CubeTrackingProviderProps extends TrackingProps {
+    children?: ReactNode;
+}
+export declare function TrackingProvider({ children, event, }: CubeTrackingProviderProps): JSX.Element;
+export declare function useTracking(): TrackingProps;

package/types/stories/components/StyledButton.d.ts

@@ -105,13 +105,13 @@ export declare const StyledButton: import("react").ComponentType<{
     onPressEnd?: ((e: import("@react-types/shared").PressEvent) => void) | undefined;
     onFocusChange?: ((isFocused: boolean) => void) | undefined;
     excludeFromTabOrder?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    isSelected?: boolean | undefined;
     onPressChange?: ((isPressed: boolean) => void) | undefined;
     onPressUp?: ((e: import("@react-types/shared").PressEvent) => void) | undefined;
     elementType?: "button" | import("react").JSXElementConstructor<any> | undefined;
     to?: string | undefined;
     htmlType?: "button" | "reset" | "submit" | undefined;
-    isLoading?: boolean | undefined;
-    isSelected?: boolean | undefined;
     icon?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
     rightIcon?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
 } & {}>;

package/cjs/providers/StyleProvider.js

@@ -1,48 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
- * 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 }));
-}
-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,26 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./styled"), exports);
-
-        

package/cjs/styled/styled.js

@@ -1,106 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __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 });
-        };
-        _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 }));
-        });
-        _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 }));
-    });
-    _StyledComponent.displayName = `CubeStyled(${Element.displayName ?? Element.name ?? tag})`;
-    return _StyledComponent;
-}
-exports.styled = styled;
-
-        

package/es/providers/StyleProvider.js

@@ -1,43 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
- * 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 }));
-}
-/**
- * @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.17.0
- * Released under the MIT license.
- */
-
-export * from './styled';
-
-        

package/es/styled/styled.js

@@ -1,80 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import styledComponents, { createGlobalStyle } from 'styled-components';
-import { forwardRef, useContext, useMemo } from 'react';
-import { isValidElementType } from 'react-is';
-import { BASE_STYLES, BreakpointsContext, modAttrs, pointsToZones, renderStyles, mergeStyles, deprecationWarning, getDisplayName, } from '../tasty';
-import { useContextStyles } from '../providers/StyleProvider';
-// Implementation
-function styled(Component, options) {
-    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 = createGlobalStyle `${(css) => css}`;
-        const _Component = ({ breakpoints }) => {
-            let contextBreakpoints = useContext(BreakpointsContext);
-            let zones = pointsToZones(breakpoints || contextBreakpoints);
-            let css = `${styles ? `\n{}${selector}{${renderStyles(styles, zones)}}` : ''}`;
-            return _jsx(Element, { css: css });
-        };
-        _Component.displayName = `CubeStyled(${Element.displayName ?? Element.name ?? Component})`;
-        return _Component;
-    }
-    if (isValidElementType(Component)) {
-        let { styles: extendStyles, props: legacyDefaultProps, name, tag: extendTag, ...defaultProps } = options ?? {};
-        const _StyledComponent = forwardRef((props, ref) => {
-            const { styles, styleName, as, ...restProps } = props;
-            const mergedStyles = useMemo(() => {
-                if (extendStyles != null && styles != null) {
-                    return mergeStyles(extendStyles, styles);
-                }
-                return extendStyles;
-            }, [styles]);
-            return (_jsx(Component, { ref: ref, ...legacyDefaultProps, ...defaultProps, ...restProps, styles: mergedStyles, styleName: styleName ?? name, as: as ?? extendTag }));
-        });
-        _StyledComponent.displayName = `CubeStyled(${getDisplayName(Component)})`;
-        return _StyledComponent;
-    }
-    options = Component;
-    let { name, tag = 'div', css: defaultCSS, styles: defaultStyles, props: defaultProps, styleProps, } = options;
-    let Element = styledComponents[tag](({ css }) => css);
-    let _StyledComponent = forwardRef((allProps, ref) => {
-        let { as, styles, styleName, breakpoints, mods, element, qa, qaVal, css, ...props } = allProps;
-        let { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps ?? {};
-        let propStyles = useMemo(() => (styleProps
-            ? styleProps.concat(BASE_STYLES)
-            : BASE_STYLES).reduce((map, prop) => {
-            if (prop in props) {
-                map[prop] = props[prop];
-                delete props[prop];
-            }
-            return map;
-        }, {}), [props]);
-        let contextStyles = useContextStyles(styleName ?? name, props);
-        let allStyles = useMemo(() => mergeStyles(defaultStyles, contextStyles, styles, propStyles), [contextStyles, styles, propStyles]);
-        let contextBreakpoints = useContext(BreakpointsContext);
-        let zones = pointsToZones(breakpoints ?? contextBreakpoints);
-        let renderedStyles = useMemo(() => renderStyles(allStyles, zones), [allStyles, zones]);
-        css = `${defaultCSS ?? ''}${css ?? ''}${allStyles ? renderedStyles : ''}`;
-        if (mods) {
-            Object.assign(props, modAttrs(mods));
-        }
-        return (_jsx(Element, { as: as ?? tag, "data-element": element, "data-qa": qa || defaultQa, "data-qaval": qaVal || defaultQaVal, ...otherDefaultProps, ...props, ref: ref, css: css }));
-    });
-    _StyledComponent.displayName = `CubeStyled(${Element.displayName ?? Element.name ?? tag})`;
-    return _StyledComponent;
-}
-export { styled };
-
-        

package/types/providers/StyleProvider.d.ts

@@ -1,16 +0,0 @@
-import { ReactNode } from 'react';
-import { Styles } from '../tasty';
-export declare const StyleContext: import("react").Context<any>;
-interface StyleProviderProps {
-    children?: ReactNode;
-    [key: string]: any;
-}
-/**
- * @deprecated
- */
-export declare function StyleProvider({ children, ...props }: StyleProviderProps): JSX.Element;
-/**
- * @deprecated
- */
-export declare function useContextStyles(name: string, props?: Record<string, any>): Styles | null;
-export {};

package/types/styled/index.d.ts

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