@cube-dev/ui-kit 0.0.0-canary-8b12353 → 0.0.0-canary-056f608

package/es/utils/transitions.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-8b12353
+ * @cube-dev/ui-kit v0.0.0-canary-056f608
  * 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.0.0-canary-8b12353
+ * @cube-dev/ui-kit v0.0.0-canary-056f608
  * 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.0.0-canary-8b12353
+ * @cube-dev/ui-kit v0.0.0-canary-056f608
  * Released under the MIT license.
  */
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cube-dev/ui-kit",
-  "version": "0.0.0-canary-8b12353",
+  "version": "0.0.0-canary-056f608",
   "description": "UIKit for Cube Projects",
   "keywords": [
     "uikit"
@@ -59,14 +59,14 @@
     "@react-types/switch": "^3.1.2",
     "@react-types/textfield": "^3.3.0",
     "@react-types/tooltip": "^3.1.2",
+    "clipboard-copy": "^4.0.1",
     "clsx": "^1.1.1",
     "email-validator": "^2.0.4",
     "prismjs": "^1.25.0",
     "react-is": "^17.0.0",
     "react-transition-group": "^4.4.2",
     "tiny-invariant": "^1.2.0",
-    "valid-url": "^1.0.9",
-    "clipboard-copy": "^4.0.1"
+    "valid-url": "^1.0.9"
   },
   "module": "./es/index.js",
   "types": "./types/index.d.ts",

package/types/components/Base.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { AllBaseProps } from './types';
 /**
- * @deprecated consider using tasty() instead
+ * @deprecated consider using styled() instead
  */
 declare const _Base: import("react").ForwardRefExoticComponent<AllBaseProps<keyof HTMLElementTagNameMap> & import("react").RefAttributes<unknown>>;
 export { _Base as Base };

package/types/components/portal/storybook/templates/CustomRoot.d.ts

@@ -0,0 +1,3 @@
+import { Story } from '@storybook/react';
+import { PortalProps } from '../../types';
+export declare const CustomRootTemplate: Story<PortalProps>;

package/types/components/portal/storybook/templates/PortalOrder.d.ts

@@ -0,0 +1,3 @@
+import { Story } from '@storybook/react';
+import { PortalProps } from '../../types';
+export declare const PortalOrderTemplate: Story<PortalProps>;

package/types/components/portal/storybook/templates/index.d.ts

@@ -1 +1,3 @@
 export * from './basic';
+export * from './PortalOrder';
+export * from './CustomRoot';

package/types/index.d.ts

@@ -148,7 +148,7 @@ export * from './styles/list';
 export * from './styles/index';
 export { ModalProvider } from '@react-aria/overlays';
 export * from './utils/react';
-export * from './tasty';
+export * from './styled';
 export { default as copy } from 'clipboard-copy';
 export * from '@react-aria/ssr';
 export * from './components/forms/Form';

package/types/test/index.d.ts

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

package/types/test/utils/index.d.ts

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

package/types/test/utils/wait.d.ts

@@ -0,0 +1 @@
+export declare function wait(timeout?: number): Promise<void>;

package/cjs/tasty/tasty.js

@@ -1,102 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-8b12353
- * 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.tasty = 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 BreakpointsProvider_1 = require("../providers/BreakpointsProvider");
-const react_2 = require("../utils/react");
-const renderStyles_1 = require("../utils/renderStyles");
-const responsive_1 = require("../utils/responsive");
-const list_1 = require("../styles/list");
-const mergeStyles_1 = require("../utils/mergeStyles");
-// Implementation
-function tasty(Component, options) {
-    var _a, _b, _c, _d;
-    if (typeof Component === 'string') {
-        let selector = Component;
-        let styles = options;
-        let Element = (0, styled_components_1.createGlobalStyle) `${(css) => css}`;
-        const _StyleDeclarationComponent = ({ breakpoints, }) => {
-            let contextBreakpoints = (0, react_1.useContext)(BreakpointsProvider_1.BreakpointsContext);
-            let zones = (0, responsive_1.pointsToZones)(breakpoints || contextBreakpoints);
-            let css = (0, react_1.useMemo)(() => (styles ? `\n{}${selector}{${(0, renderStyles_1.renderStyles)(styles, zones)}}` : ''), [zones.join(',')]);
-            return (0, jsx_runtime_1.jsx)(Element, { css: css }, void 0);
-        };
-        _StyleDeclarationComponent.displayName = `TastyStyleDeclaration(${Component})`;
-        return _StyleDeclarationComponent;
-    }
-    if ((0, react_is_1.isValidElementType)(Component)) {
-        let { styles: extendStyles, as: extendTag, ...defaultProps } = options !== null && options !== void 0 ? options : {};
-        const _WrappedComponent = (0, react_1.forwardRef)((props, ref) => {
-            const { styles, as, ...restProps } = props;
-            const mergedStyles = (0, react_1.useMemo)(() => {
-                if (extendStyles != null && styles != null) {
-                    return (0, mergeStyles_1.mergeStyles)(extendStyles, styles);
-                }
-                return extendStyles;
-            }, [styles]);
-            return ((0, jsx_runtime_1.jsx)(Component, { ref: ref, ...defaultProps, ...restProps, styles: mergedStyles, as: as !== null && as !== void 0 ? as : extendTag }, void 0));
-        });
-        _WrappedComponent.displayName = `TastyWrappedComponent(${(_d = (_c = (_b = (_a = Component.displayName) !== null && _a !== void 0 ? _a : Component.name) !== null && _b !== void 0 ? _b : defaultProps.qa) !== null && _c !== void 0 ? _c : extendTag) !== null && _d !== void 0 ? _d : 'Anonymous'})`;
-        return _WrappedComponent;
-    }
-    options = Component;
-    let { as: originalAs = 'div', css: defaultCSS, styles: defaultStyles, styleProps, ...defaultProps } = options;
-    let Element = styled_components_1.default[originalAs](({ css }) => css);
-    let _TastyComponent = (0, react_1.forwardRef)((allProps, ref) => {
-        let { as, styles, breakpoints, mods, element, qa, qaVal, css, ...otherProps } = allProps;
-        let { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps !== null && defaultProps !== void 0 ? defaultProps : {};
-        let propStyles = (0, react_1.useMemo)(() => (styleProps
-            ? styleProps.concat(list_1.BASE_STYLES)
-            : list_1.BASE_STYLES).reduce((map, prop) => {
-            if (prop in otherProps) {
-                map[prop] = otherProps[prop];
-                delete otherProps[prop];
-            }
-            return map;
-        }, {}), [otherProps]);
-        let allStyles = (0, react_1.useMemo)(() => (0, mergeStyles_1.mergeStyles)(defaultStyles, styles, propStyles), [styles, propStyles]);
-        let contextBreakpoints = (0, react_1.useContext)(BreakpointsProvider_1.BreakpointsContext);
-        let zones = (0, responsive_1.pointsToZones)(breakpoints !== null && breakpoints !== void 0 ? breakpoints : contextBreakpoints);
-        css = `${typeof defaultCSS === 'function'
-            ? defaultCSS(otherProps)
-            : defaultCSS !== null && defaultCSS !== void 0 ? defaultCSS : ''}${typeof css === 'function' ? css(otherProps) : css !== null && css !== void 0 ? css : ''}${allStyles ? (0, renderStyles_1.renderStyles)(allStyles, zones) : ''}`;
-        if (mods) {
-            Object.assign(otherProps, (0, react_2.modAttrs)(mods));
-        }
-        return ((0, jsx_runtime_1.jsx)(Element, { as: as !== null && as !== void 0 ? as : originalAs, "data-element": element, "data-qa": qa || defaultQa, "data-qaval": qaVal || defaultQaVal, ...otherDefaultProps, ...otherProps, ref: ref, css: css }, void 0));
-    });
-    _TastyComponent.displayName = `TastyComponent(${defaultProps.qa || originalAs})`;
-    return _TastyComponent;
-}
-exports.tasty = tasty;
-
-        

package/es/tasty/tasty.js

@@ -1,80 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-8b12353
- * 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 { BreakpointsContext } from '../providers/BreakpointsProvider';
-import { modAttrs } from '../utils/react';
-import { renderStyles } from '../utils/renderStyles';
-import { pointsToZones } from '../utils/responsive';
-import { BASE_STYLES } from '../styles/list';
-import { mergeStyles } from '../utils/mergeStyles';
-// Implementation
-function tasty(Component, options) {
-    var _a, _b, _c, _d;
-    if (typeof Component === 'string') {
-        let selector = Component;
-        let styles = options;
-        let Element = createGlobalStyle `${(css) => css}`;
-        const _StyleDeclarationComponent = ({ breakpoints, }) => {
-            let contextBreakpoints = useContext(BreakpointsContext);
-            let zones = pointsToZones(breakpoints || contextBreakpoints);
-            let css = useMemo(() => (styles ? `\n{}${selector}{${renderStyles(styles, zones)}}` : ''), [zones.join(',')]);
-            return _jsx(Element, { css: css }, void 0);
-        };
-        _StyleDeclarationComponent.displayName = `TastyStyleDeclaration(${Component})`;
-        return _StyleDeclarationComponent;
-    }
-    if (isValidElementType(Component)) {
-        let { styles: extendStyles, as: extendTag, ...defaultProps } = options !== null && options !== void 0 ? options : {};
-        const _WrappedComponent = forwardRef((props, ref) => {
-            const { styles, as, ...restProps } = props;
-            const mergedStyles = useMemo(() => {
-                if (extendStyles != null && styles != null) {
-                    return mergeStyles(extendStyles, styles);
-                }
-                return extendStyles;
-            }, [styles]);
-            return (_jsx(Component, { ref: ref, ...defaultProps, ...restProps, styles: mergedStyles, as: as !== null && as !== void 0 ? as : extendTag }, void 0));
-        });
-        _WrappedComponent.displayName = `TastyWrappedComponent(${(_d = (_c = (_b = (_a = Component.displayName) !== null && _a !== void 0 ? _a : Component.name) !== null && _b !== void 0 ? _b : defaultProps.qa) !== null && _c !== void 0 ? _c : extendTag) !== null && _d !== void 0 ? _d : 'Anonymous'})`;
-        return _WrappedComponent;
-    }
-    options = Component;
-    let { as: originalAs = 'div', css: defaultCSS, styles: defaultStyles, styleProps, ...defaultProps } = options;
-    let Element = styledComponents[originalAs](({ css }) => css);
-    let _TastyComponent = forwardRef((allProps, ref) => {
-        let { as, styles, breakpoints, mods, element, qa, qaVal, css, ...otherProps } = allProps;
-        let { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps !== null && defaultProps !== void 0 ? defaultProps : {};
-        let propStyles = useMemo(() => (styleProps
-            ? styleProps.concat(BASE_STYLES)
-            : BASE_STYLES).reduce((map, prop) => {
-            if (prop in otherProps) {
-                map[prop] = otherProps[prop];
-                delete otherProps[prop];
-            }
-            return map;
-        }, {}), [otherProps]);
-        let allStyles = useMemo(() => mergeStyles(defaultStyles, styles, propStyles), [styles, propStyles]);
-        let contextBreakpoints = useContext(BreakpointsContext);
-        let zones = pointsToZones(breakpoints !== null && breakpoints !== void 0 ? breakpoints : contextBreakpoints);
-        css = `${typeof defaultCSS === 'function'
-            ? defaultCSS(otherProps)
-            : defaultCSS !== null && defaultCSS !== void 0 ? defaultCSS : ''}${typeof css === 'function' ? css(otherProps) : css !== null && css !== void 0 ? css : ''}${allStyles ? renderStyles(allStyles, zones) : ''}`;
-        if (mods) {
-            Object.assign(otherProps, modAttrs(mods));
-        }
-        return (_jsx(Element, { as: as !== null && as !== void 0 ? as : originalAs, "data-element": element, "data-qa": qa || defaultQa, "data-qaval": qaVal || defaultQaVal, ...otherDefaultProps, ...otherProps, ref: ref, css: css }, void 0));
-    });
-    _TastyComponent.displayName = `TastyComponent(${defaultProps.qa || originalAs})`;
-    return _TastyComponent;
-}
-export { tasty };
-
-        

package/types/tasty/tasty.d.ts

@@ -1,33 +0,0 @@
-import { ComponentType } from 'react';
-import { AllBaseProps, BaseStyleProps } from '../components/types';
-import { Styles, StylesInterface } from '../styles/types';
-import { ResponsiveStyleValue } from '../utils/styles';
-export declare type TastyProps<K extends (keyof StylesInterface)[], DefaultProps> = {
-    /** The tag name of the element. */
-    as?: string;
-    /** Default styles of the element. */
-    styles?: Styles;
-    /** Default css of the element. */
-    css?: string;
-    /** The list of styles that can be provided by props */
-    styleProps?: K;
-} & Omit<DefaultProps, 'as' | 'styles' | 'css' | 'styleProps'>;
-export interface GlobalTastyProps {
-    breakpoints?: number[];
-}
-export declare type AllBasePropsWithMods<K extends (keyof StylesInterface)[]> = 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 : {
-    [key in Extract<keyof Props, keyof DefaultProps>]?: Props[key];
-} & {
-    [key in keyof Omit<Props, keyof DefaultProps>]: Props[key];
-};
-declare function tasty<K extends (keyof StylesInterface)[], Props, DefaultProps extends Partial<Props> = Partial<Props>>(options: TastyProps<K, DefaultProps>, secondArg?: never): any;
-declare function tasty(selector: string, styles?: Styles): any;
-declare function tasty<K extends (keyof StylesInterface)[], Props extends {
-    styles?: Styles;
-}, DefaultProps extends Partial<Props> = Partial<Props>>(Component: ComponentType<Props>, options?: TastyProps<K, Props>): ComponentType<TastyPropsWithDefaults<Props, DefaultProps>>;
-export { tasty };