@cube-dev/ui-kit 0.17.0 → 0.18.1

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';

package/types/styled/styled.d.ts

@@ -1,47 +0,0 @@
-import { ComponentType } from 'react';
-import { Styles, StylesInterface } from '../tasty';
-export type StyledProps<K extends (keyof StylesInterface)[], DefaultProps> = {
-    /** The name of the element. It can be used to override styles in context. */
-    name?: string;
-    /** The tag name of the element. */
-    tag?: string;
-    /** Default styles of the element. */
-    styles?: Styles;
-    /** Default css of the element. */
-    css?: string;
-    props?: DefaultProps;
-    /** The list of styles that can be provided by props */
-    styleProps?: K;
-};
-type StyledPropsWithDefaults<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];
-};
-type EitherLegacyPropsOrInlined<K extends (keyof StylesInterface)[], DefaultProps> = ((Pick<StyledProps<K, DefaultProps>, 'name' | 'tag' | 'styles'> & {
-    /**
-     * @deprecated
-     */
-    props?: DefaultProps;
-}) & {
-    [key in keyof DefaultProps]?: 'You Should use either legacy props field or inline props';
-}) | ({
-    props?: 'You Should use either legacy props field or inline props';
-} & DefaultProps);
-/**
- * @deprecated Use `tasty()` helper instead.
- */
-declare function styled<K extends (keyof StylesInterface)[], Props, DefaultProps extends Partial<Props> = Partial<Props>>(options: StyledProps<K, DefaultProps>, secondArg?: never): any;
-/**
- * @deprecated Use `tasty()` helper instead.
- */
-declare function styled(selector: string, styles?: Styles): any;
-/**
- * @deprecated Use `tasty()` helper instead.
- */
-declare function styled<K extends (keyof StylesInterface)[], Props extends {
-    styles?: Styles;
-}, DefaultProps extends Partial<Props> = Partial<Props>>(Component: ComponentType<Props>, options?: EitherLegacyPropsOrInlined<K, DefaultProps>): ComponentType<StyledPropsWithDefaults<Props, DefaultProps>>;
-export { styled };