npm - @cube-dev/ui-kit - Versions diffs - 0.17.0 → 0.18.1 - Mend

@cube-dev/ui-kit 0.17.0 → 0.18.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (567) hide show

package/es/components/Root.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.1
  * Released under the MIT license.
  */
@@ -13,6 +13,7 @@ import { BASE_STYLES, BLOCK_STYLES, extractStyles, filterBaseProps, tasty, } fro
 import { Provider } from '../provider';
 import { TOKENS } from '../tokens';
 import { useViewportSize } from '../utils/react';
+import { TrackingProvider } from '../providers/TrackingProvider';
 import { PortalProvider } from './portal';
 import { GlobalStyles } from './GlobalStyles';
 import { AlertDialogApiProvider } from './overlays/AlertDialog';
@@ -36,7 +37,7 @@ const IS_DVH_SUPPORTED = typeof CSS !== 'undefined' && typeof CSS?.supports ===
 export function Root(allProps) {
     let { children,
     /** Raw css styles for body element */
-    bodyStyles, fonts, publicUrl, router, font, monospaceFont, applyLegacyTokens, ...props } = allProps;
+    bodyStyles, fonts, publicUrl, router, font, monospaceFont, applyLegacyTokens, tracking, ...props } = allProps;
     const ref = useRef(null);
     const [rootRef, setRootRef] = useState();
     // We need to measure the window's height in JS rather than using percentages in CSS
@@ -77,9 +78,11 @@ export function Root(allProps) {
         }
     }, []);
     const styles = extractStyles(props, STYLES, DEFAULT_STYLES);
-    return (_jsx(Provider, { router: router, root: rootRef, children: _jsx(StyleSheetManager, { disableVendorPrefixes: true, children: _jsxs(RootElement, { ref: ref, ...filterBaseProps(props, { eventProps: true }), styles: styles, style: {
-                    '--cube-dynamic-viewport-height': height ? height + 'px' : '100dvh',
-                }, children: [_jsx(GlobalStyles, { bodyStyles: bodyStyles, applyLegacyTokens: applyLegacyTokens, publicUrl: publicUrl, fonts: fonts, font: font, monospaceFont: monospaceFont }), _jsx(ModalProvider, { children: _jsx(PortalProvider, { value: ref, children: _jsx(NotificationsProvider, { rootRef: ref, children: _jsx(AlertDialogApiProvider, { children: children }) }) }) })] }) }) }));
+    return (_jsx(Provider, { router: router, root: rootRef, children: _jsx(TrackingProvider, { event: tracking?.event, children: _jsx(StyleSheetManager, { disableVendorPrefixes: true, children: _jsxs(RootElement, { ref: ref, ...filterBaseProps(props, { eventProps: true }), styles: styles, style: {
+                        '--cube-dynamic-viewport-height': height
+                            ? height + 'px'
+                            : '100dvh',
+                    }, children: [_jsx(GlobalStyles, { bodyStyles: bodyStyles, applyLegacyTokens: applyLegacyTokens, publicUrl: publicUrl, fonts: fonts, font: font, monospaceFont: monospaceFont }), _jsx(ModalProvider, { children: _jsx(PortalProvider, { value: ref, children: _jsx(NotificationsProvider, { rootRef: ref, children: _jsx(AlertDialogApiProvider, { children: children }) }) }) })] }) }) }) }));
 }

package/es/components/actions/Action.js CHANGED Viewed

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

package/es/components/actions/Button/Button.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.1
  * Released under the MIT license.
  */
@@ -213,19 +213,21 @@ export const Button = forwardRef(function Button(allProps, ref) {
     const isDisabled = props.isDisabled || props.isLoading;
     const isLoading = props.isLoading;
     const isSelected = props.isSelected;
+    children = children || icon || rightIcon ? children : label;
     if (!children) {
         if (icon) {
             if (!label) {
                 accessibilityWarning('If you provide `icon` property for a Button and do not provide any children then you should specify the `label` property to make sure the Button element stays accessible.');
+                label = 'Unnamed'; // fix to avoid warning in production
             }
         }
         else {
             if (!label) {
                 accessibilityWarning('If you provide no children for a Button then you should specify the `label` property to make sure the Button element stays accessible.');
+                label = 'Unnamed'; // fix to avoid warning in production
             }
         }
     }
-    children = children || icon || rightIcon ? children : label;
     if (icon) {
         icon = cloneElement(icon, {
             'data-element': 'ButtonIcon',
@@ -244,7 +246,7 @@ export const Button = forwardRef(function Button(allProps, ref) {
         'single-icon-only': singleIcon,
         ...mods,
     }), [mods, isDisabled, isLoading, isSelected, singleIcon]);
-    const { actionProps } = useAction({ ...allProps, isDisabled, mods: modifiers }, ref);
+    const { actionProps } = useAction({ ...allProps, isDisabled, mods: modifiers, ...(label ? { label } : {}) }, ref);
     const styles = extractStyles(props, STYLE_PROPS);
     return (_jsxs(ButtonElement, { ...actionProps, variant: theme, "data-theme": theme, "data-type": type ?? 'secondary', "data-size": size ?? 'medium', styles: styles, children: [icon || isLoading ? !isLoading ? icon : _jsx(LoadingOutlined, {}) : null, children, rightIcon] }));
 });

package/es/components/actions/Button/Submit.js CHANGED Viewed

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

package/es/components/actions/Button/index.js CHANGED Viewed

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

package/es/components/actions/ButtonGroup/ButtonGroup.js CHANGED Viewed

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

package/es/components/actions/index.js CHANGED Viewed

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

package/es/components/actions/use-action.js CHANGED Viewed

@@ -1,11 +1,11 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.1
  * Released under the MIT license.
  */
-import { useCallback, useContext } from 'react';
+import { useContext } from 'react';
 import { useHover } from '@react-aria/interactions';
 import { useButton } from '@react-aria/button';
 import { useFocusableRef } from '@react-spectrum/utils';
@@ -13,6 +13,10 @@ import { UIKitContext } from '../../provider';
 import { mergeProps } from '../../utils/react';
 import { useFocus } from '../../utils/react/interactions';
 import { filterBaseProps } from '../../tasty';
+import { useTracking } from '../../providers/TrackingProvider';
+import { useEvent } from '../../_internal';
+const LINK_PRESS_EVENT = 'Link Press';
+const BUTTON_PRESS_EVENT = 'Button Press';
 const FILTER_OPTIONS = { propNames: new Set(['onMouseEnter', 'onMouseLeave']) };
 /**
  * Helper to open link.
@@ -43,21 +47,28 @@ export function parseTo(to) {
         href,
     };
 }
-export function performClickHandler(evt, router, to, onPress) {
+export function performClickHandler(evt, { router, to, onPress, tracking }) {
     const { newTab, nativeRoute, href } = parseTo(to);
+    const element = evt.target;
+    const qa = element?.getAttribute('data-qa');
     onPress?.(evt);
-    if (!to)
+    if (!to) {
+        tracking.event(BUTTON_PRESS_EVENT, { qa }, element);
         return;
+    }
     if (evt.shiftKey || evt.metaKey || newTab) {
         openLink(href, true);
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'tab' }, element);
         return;
     }
     if (nativeRoute) {
         openLink(href || window.location.href);
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'native' }, element);
     }
     else if (href && href.startsWith('#')) {
         const id = href.slice(1);
         const element = document.getElementById(id);
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'hash', target: id }, element);
         if (element) {
             element.scrollIntoView({
                 behavior: 'smooth',
@@ -68,23 +79,27 @@ export function performClickHandler(evt, router, to, onPress) {
         }
     }
     if (router) {
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'router' }, element);
         router.push(href);
     }
     else if (href) {
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'native' }, element);
         window.location.href = href;
     }
 }
 export const useAction = function useAction({ to, as, htmlType, label, mods, onPress, ...props }, ref) {
     as = to ? 'a' : as || 'button';
+    const tracking = useTracking();
     const router = useContext(UIKitContext).router;
     const isDisabled = props.isDisabled;
     const { newTab, href } = parseTo(to);
     const target = newTab ? '_blank' : undefined;
     const domRef = useFocusableRef(ref);
-    const customOnPress = useCallback((evt) => {
-        performClickHandler(evt, router, to, onPress);
-    }, [router, to, onPress]);
+    const customOnPress = useEvent((evt) => {
+        performClickHandler(evt, { router, to, onPress, tracking });
+    });
     let { buttonProps, isPressed } = useButton({
+        'aria-label': label,
         ...props,
         onPress: customOnPress,
     }, domRef);
@@ -107,7 +122,6 @@ export const useAction = function useAction({ to, as, htmlType, label, mods, onP
                 ...mods,
             },
             ...mergeProps(buttonProps, hoverProps, focusProps, customProps, filterBaseProps(props, FILTER_OPTIONS)),
-            'aria-label': label,
             ref: domRef,
             type: htmlType || 'button',
             rel: as === 'a' && newTab ? 'rel="noopener noreferrer"' : undefined,

package/es/components/content/ActiveZone/ActiveZone.js CHANGED Viewed

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

package/es/components/content/Alert/Alert.js CHANGED Viewed

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

package/es/components/content/Alert/index.js CHANGED Viewed

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

package/es/components/content/Alert/types.js CHANGED Viewed

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

package/es/components/content/Alert/use-alert.js CHANGED Viewed

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

package/es/components/content/Avatar/Avatar.js CHANGED Viewed

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

package/es/components/content/Badge/Badge.js CHANGED Viewed

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

package/es/components/content/Card/Card.js CHANGED Viewed

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

package/es/components/content/Content.js CHANGED Viewed

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

package/es/components/content/CopySnippet/CopySnippet.js CHANGED Viewed

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

package/es/components/content/CopySnippet/index.js CHANGED Viewed

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

package/es/components/content/Divider.js CHANGED Viewed

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

package/es/components/content/Footer.js CHANGED Viewed

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

package/es/components/content/Header.js CHANGED Viewed

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

package/es/components/content/Paragraph.js CHANGED Viewed

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

package/es/components/content/Placeholder/Placeholder.js CHANGED Viewed

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

package/es/components/content/PrismCode/PrismCode.js CHANGED Viewed

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

package/es/components/content/Result/Result.js CHANGED Viewed

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

package/es/components/content/Skeleton/Skeleton.js CHANGED Viewed

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

package/es/components/content/Tag/Tag.js CHANGED Viewed

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

package/es/components/content/Text.js CHANGED Viewed

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

package/es/components/content/Title.js CHANGED Viewed

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

package/es/components/forms/Checkbox/Checkbox.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.17.0
+ * @cube-dev/ui-kit v0.18.1
  * Released under the MIT license.
  */
@@ -94,6 +94,7 @@ function Checkbox(props, ref) {
     let { hoverProps, isHovered } = useHover({ isDisabled });
     let inputRef = useRef(null);
     let domRef = useFocusableRef(ref, inputRef);
+    const toggleState = useToggleState(props);
     let { inputProps } = groupState // eslint-disable-next-line react-hooks/rules-of-hooks
         ? useCheckboxGroupItem({
             ...props,
@@ -105,7 +106,12 @@ function Checkbox(props, ref) {
             isRequired: originalProps.isRequired,
             validationState: originalProps.validationState,
         }, groupState, inputRef) // eslint-disable-next-line react-hooks/rules-of-hooks
-        : useCheckbox(props, useToggleState(props), inputRef);
+        : useCheckbox({
+            ...props,
+            ...(typeof label === 'string' && label.trim()
+                ? { 'aria-label': label }
+                : {}),
+        }, toggleState, inputRef);
     let markIcon = isIndeterminate ? _jsx(IndeterminateOutline, {}) : _jsx(CheckOutlined, {});
     if (groupState) {
         for (let key of ['isSelected', 'defaultSelected', 'isEmphasized']) {

package/es/components/forms/Checkbox/CheckboxGroup.js CHANGED Viewed

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

package/es/components/forms/Checkbox/context.js CHANGED Viewed

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

package/es/components/forms/FieldWrapper.js CHANGED Viewed

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

package/es/components/forms/FileInput/FileInput.js CHANGED Viewed

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

package/es/components/forms/Form/Field.js CHANGED Viewed

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

package/es/components/forms/Form/Form.js CHANGED Viewed

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

package/es/components/forms/Form/SubmitError.js CHANGED Viewed

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

package/es/components/forms/Form/index.js CHANGED Viewed

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

package/es/components/forms/Form/types.js CHANGED Viewed

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

package/es/components/forms/Form/useForm.js CHANGED Viewed

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

package/es/components/forms/Form/validation.js CHANGED Viewed

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

package/es/components/forms/Input/Input.js CHANGED Viewed

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

package/es/components/forms/Input/index.js CHANGED Viewed

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

package/es/components/forms/Label.js CHANGED Viewed

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

package/es/components/forms/NumberInput/NumberInput.js CHANGED Viewed

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

package/es/components/forms/NumberInput/StepButton.js CHANGED Viewed

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

package/es/components/forms/PasswordInput/PasswordInput.js CHANGED Viewed

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