@cube-dev/ui-kit 0.9.12 → 0.10.4

package/es/tasty/tasty.js

@@ -0,0 +1,90 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.10.4
+ * 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/modAttrs';
+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);
+            breakpoints = breakpoints !== null && breakpoints !== void 0 ? breakpoints : contextBreakpoints;
+            let css = useMemo(() => styles
+                ? `\n{}${selector}{${renderStyles(styles, pointsToZones(breakpoints || contextBreakpoints))}}`
+                : '', [breakpoints.join(',')]);
+            return _jsx(Element, { css: css }, void 0);
+        };
+        _StyleDeclarationComponent.displayName = `TastyStyleDeclaration(${Component})`;
+        return _StyleDeclarationComponent;
+    }
+    if (isValidElementType(Component)) {
+        let { as: extendTag, element: extendElement, ...defaultProps } = options !== null && options !== void 0 ? options : {};
+        let propsWithStyles = ['styles'].concat(Object.keys(defaultProps).filter((prop) => prop.endsWith('Styles')));
+        let _WrappedComponent = forwardRef((props, ref) => {
+            const { as, element, ...restProps } = props;
+            const propsWithStylesValues = propsWithStyles.map((prop) => props[prop]);
+            const mergedStylesMap = useMemo(() => {
+                return propsWithStyles.reduce((map, prop) => {
+                    if (restProps[prop] != null && defaultProps[prop] != null) {
+                        map[prop] = mergeStyles(restProps[prop], defaultProps[prop]);
+                    }
+                    else {
+                        map[prop] = restProps[prop] || defaultProps[prop];
+                    }
+                    return map;
+                }, {});
+            }, propsWithStylesValues);
+            return (_jsx(Component, { ref: ref, ...defaultProps, ...restProps, ...mergedStylesMap, as: as !== null && as !== void 0 ? as : extendTag, element: element || extendElement }, 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', element: defaultElement, styles: defaultStyles, styleProps, ...defaultProps } = options;
+    let Element = styledComponents[originalAs](({ css }) => css);
+    let _TastyComponent = forwardRef((allProps, ref) => {
+        let { as, styles, breakpoints, mods, element, qa, qaVal, ...otherProps } = allProps;
+        let { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps !== null && defaultProps !== void 0 ? defaultProps : {};
+        let propStyles = (styleProps
+            ? styleProps.concat(BASE_STYLES)
+            : BASE_STYLES).reduce((map, prop) => {
+            if (prop in otherProps) {
+                map[prop] = otherProps[prop];
+                delete otherProps[prop];
+            }
+            return map;
+        }, {});
+        let allStyles = useMemo(() => mergeStyles(defaultStyles, styles, propStyles), [styles, propStyles]);
+        let contextBreakpoints = useContext(BreakpointsContext);
+        breakpoints = breakpoints !== null && breakpoints !== void 0 ? breakpoints : contextBreakpoints;
+        let renderedStyles = useMemo(() => allStyles
+            ? renderStyles(allStyles, pointsToZones(breakpoints))
+            : '', [allStyles, breakpoints]);
+        if (mods) {
+            Object.assign(otherProps, modAttrs(mods));
+        }
+        return (_jsx(Element, { as: as !== null && as !== void 0 ? as : originalAs, "data-element": element || defaultElement, "data-qa": qa || defaultQa, "data-qaval": qaVal || defaultQaVal, ...otherDefaultProps, ...otherProps, ref: ref, css: renderedStyles }, void 0));
+    });
+    _TastyComponent.displayName = `TastyComponent(${defaultProps.qa || originalAs})`;
+    return _TastyComponent;
+}
+const Element = tasty({});
+export { tasty, Element };
+
+        

package/es/tasty/types.js

@@ -0,0 +1,10 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.10.4
+ * Released under the MIT license.
+ */
+
+export {};
+
+        

package/es/{utils → tasty/utils}/colors.js

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

package/es/{utils → tasty/utils}/dotize.js

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

package/es/{utils → tasty/utils}/filterBaseProps.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */
 
@@ -15,6 +15,7 @@ const labelablePropNames = new Set([
 const BasePropNames = new Set([
     'role',
     'as',
+    'element',
     'css',
     'qa',
     'mods',
@@ -47,15 +48,15 @@ export function filterBaseProps(props, opts = {}) {
     let { labelable, propNames, eventProps } = opts;
     let filteredProps = {};
     for (const prop in props) {
-        if (Object.prototype.hasOwnProperty.call(props, prop)
-            && (DOMPropNames.has(prop)
-                || BasePropNames.has(prop)
-                || (labelable && labelablePropNames.has(prop))
-                || (eventProps
-                    && eventRe.test(prop)
-                    && !ignoreEventPropsNames.has(prop))
-                || (propNames === null || propNames === void 0 ? void 0 : propNames.has(prop))
-                || propRe.test(prop))) {
+        if (Object.prototype.hasOwnProperty.call(props, prop) &&
+            (DOMPropNames.has(prop) ||
+                BasePropNames.has(prop) ||
+                (labelable && labelablePropNames.has(prop)) ||
+                (eventProps &&
+                    eventRe.test(prop) &&
+                    !ignoreEventPropsNames.has(prop)) ||
+                (propNames === null || propNames === void 0 ? void 0 : propNames.has(prop)) ||
+                propRe.test(prop))) {
             filteredProps[prop] = props[prop];
         }
     }

package/es/{utils → tasty/utils}/index.js

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

package/es/{utils → tasty/utils}/mergeStyles.js

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

package/es/{utils/react → tasty/utils}/modAttrs.js

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

package/es/{utils → tasty/utils}/renderStyles.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */
 
@@ -113,11 +113,13 @@ export function renderStyles(styles, responsive, suffix) {
                 });
             }
             else {
-                rawStyles
-                    += handler(styleMap, suffix) || '';
+                rawStyles +=
+                    handler(styleMap, suffix) || '';
             }
         });
-        STYLE_CACHE[cacheKey] = `outline: none;\n&[hidden]{display: none !important;}${rawStyles}${responsive && responsive.length
+        STYLE_CACHE[cacheKey] = `outline: none;\n&[hidden]{display: none !important;}${rawStyles}${responsive &&
+            responsive.length &&
+            responsiveStyles.filter((s) => s).length
             ? mediaWrapper(responsiveStyles, zones)
             : ''}${innerStyles}`;
     }

package/es/{utils → tasty/utils}/responsive.js

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

package/es/{utils → tasty/utils}/string.js

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

package/es/{utils → tasty/utils}/styles.js

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

package/es/tasty/utils/warnings.js

@@ -0,0 +1,32 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.10.4
+ * Released under the MIT license.
+ */
+
+const PREFIX = 'Tasty';
+export function warn(...args) {
+    console.warn(`${PREFIX}:`, ...args);
+}
+export function deprecationWarning(
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+condition, { property, name, betterAlternative, reason, }) {
+    if (condition)
+        return;
+    if (process.env.NODE_ENV === 'production') {
+        return warn(`DEPRECATION ${name} "${property}" -> ${typeof betterAlternative === 'function'
+            ? betterAlternative()
+            : betterAlternative}`);
+    }
+    // we can make deprecations even better if we add the md syntax in the console.
+    // anyway, everything down below will be stripped in the production build
+    console.group(`⚠️ ${PREFIX}: Deprecation in ${name}`);
+    warn(`"${property}" is deprecated, consider better alternative: ${typeof betterAlternative === 'function'
+        ? betterAlternative()
+        : betterAlternative}`);
+    reason && warn(`Reason: ${typeof reason === 'function' ? reason() : reason}`);
+    console.groupEnd();
+}
+
+        

package/es/test/index.js

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

package/es/test/render.js

@@ -0,0 +1,14 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.10.4
+ * Released under the MIT license.
+ */
+
+import { render } from '@testing-library/react';
+import { Root } from '../components/Root';
+export function renderWithRoot(ui, options) {
+    return render(ui, { ...options, wrapper: Root });
+}
+
+        

package/es/test/setup.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */
 
@@ -9,6 +9,10 @@ import '@testing-library/jest-dom';
 import '@testing-library/jest-dom/extend-expect';
 import 'jest-styled-components';
 import { configure } from '@testing-library/react';
+import { config } from 'react-transition-group';
+import { AbortController } from 'node-abort-controller';
+global.AbortController = AbortController;
+config.disabled = true;
 configure({ testIdAttribute: 'data-qa', asyncUtilTimeout: 10000 });
 
         

package/es/test/utils/index.js

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

package/es/test/utils/wait.js

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

package/es/tokens.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */
 
@@ -135,6 +135,11 @@ const TOKENS = {
     't2-line-height': '22px',
     't2-letter-spacing': '0.01em',
     't2-font-weight': '400',
+    // t2m
+    't2m-font-size': '16px',
+    't2m-line-height': '22px',
+    't2m-letter-spacing': '0.005em',
+    't2m-font-weight': '500',
     // t3
     't3-font-size': '14px',
     't3-line-height': '20px',
@@ -145,6 +150,11 @@ const TOKENS = {
     't3m-line-height': '20px',
     't3m-letter-spacing': '0.015em',
     't3m-font-weight': '500',
+    // t3s
+    't3s-font-size': '14px',
+    't3s-line-height': '20px',
+    't3s-letter-spacing': '0.015em',
+    't3s-font-weight': '600',
     // t4
     't4-font-size': '12px',
     't4-line-height': '18px',

package/es/type-checks.js

@@ -0,0 +1,17 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.10.4
+ * Released under the MIT license.
+ */
+
+import { tasty } from './tasty';
+import { RadioButton } from './components/forms/RadioGroup/Radio';
+tasty(RadioButton, {
+    // value is required
+    inputStyles: {
+        fill: '#clear',
+    },
+});
+
+        

package/es/utils/ResizeSensor.js

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

package/es/utils/modules.js

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

package/es/utils/promise.js

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

package/es/utils/react/Slots.js

@@ -1,12 +1,12 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
-import { mergeProps } from '../../utils/react/mergeProps';
+import { mergeProps } from './mergeProps';
 import { createContext, Children, cloneElement, useContext, useMemo, } from 'react';
 let SlotContext = createContext({});
 export function useSlotProps(props, defaultSlot) {

package/es/utils/react/chain.js

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

package/es/utils/react/index.js

@@ -1,14 +1,14 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */
 
 export { chain } from './chain';
 export { isTextOnly } from './isTextOnly';
 export { mergeProps } from './mergeProps';
-export { modAttrs } from './modAttrs';
+export { modAttrs } from '../../tasty';
 export { useSlotProps, SlotProvider, ClearSlots } from './Slots';
 export { useLayoutEffect } from './useLayoutEffect';
 export { useCombinedRefs } from './useCombinedRefs';

package/es/utils/{interactions.js → react/interactions.js}

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

package/es/utils/react/isTextOnly.js

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

package/es/utils/react/mapProps.js

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

package/es/utils/react/mergeProps.js

@@ -1,12 +1,13 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */
 
 import clsx from 'clsx';
 import { chain, mergeIds } from '@react-aria/utils';
+import { mergeStyles } from '../../tasty';
 /**
  * Merges multiple props objects together. Event handlers are chained,
  * classNames are combined, and ids are deduplicated - different ids
@@ -19,32 +20,32 @@ export function mergeProps(...args) {
     for (let props of args) {
         for (let key in result) {
             // Chain events
-            if (/^on[A-Z]/.test(key)
-                && typeof result[key] === 'function'
-                && props
-                && typeof props[key] === 'function') {
+            if (/^on[A-Z]/.test(key) &&
+                typeof result[key] === 'function' &&
+                props &&
+                typeof props[key] === 'function') {
                 result[key] = chain(result[key], props[key]);
                 // Merge classnames, sometimes classNames are empty string which eval to false, so we just need to do a type check
             }
-            else if (key === 'className'
-                && typeof result.className === 'string'
-                && props
-                && typeof props.className === 'string') {
+            else if (key === 'className' &&
+                typeof result.className === 'string' &&
+                props &&
+                typeof props.className === 'string') {
                 result[key] = clsx(result.className, props.className);
             }
-            else if (key === 'styles'
-                && typeof result.styles === 'object'
-                && props
-                && typeof props.styles === 'object') {
-                result[key] = { ...result.styles, ...props.styles };
+            else if ((key === 'styles' || key.endsWith('Styles')) &&
+                typeof result.styles === 'object' &&
+                props &&
+                typeof props.styles === 'object') {
+                result[key] = mergeStyles(result[key], props[key]);
             }
             else if (key === 'id' && result.id && (props === null || props === void 0 ? void 0 : props.id)) {
                 result.id = mergeIds(result.id, props === null || props === void 0 ? void 0 : props.id);
                 // Override others
             }
             else {
-                result[key]
-                    = props && props[key] !== undefined ? props[key] : result[key];
+                result[key] =
+                    props && props[key] !== undefined ? props[key] : result[key];
             }
         }
         // Add props from b that are not in a

package/es/utils/react/nullableValue.js

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

package/es/utils/react/useCombinedRefs.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.12
+ * @cube-dev/ui-kit v0.10.4
  * 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.9.12
+ * @cube-dev/ui-kit v0.10.4
  * 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.9.12
+ * @cube-dev/ui-kit v0.10.4
  * 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.9.12
+ * @cube-dev/ui-kit v0.10.4
  * 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.9.12
+ * @cube-dev/ui-kit v0.10.4
  * 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.9.12
+ * @cube-dev/ui-kit v0.10.4
  * Released under the MIT license.
  */