@cube-dev/ui-kit 0.17.0 → 0.18.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @cube-dev/ui-kit
 
+## 0.18.0
+
+### Minor Changes
+
+- [#305](https://github.com/cube-js/cube-ui-kit/pull/305) [`89c18da`](https://github.com/cube-js/cube-ui-kit/commit/89c18da9c457e5ed4d19a94d73e40f71ceb4bf20) Thanks [@tenphi](https://github.com/tenphi)! - Remove legacy `styled` and `StyleProvider`. Add `TrackingProvider` for analytics purposes.
+
+### Patch Changes
+
+- [#304](https://github.com/cube-js/cube-ui-kit/pull/304) [`c663fd1`](https://github.com/cube-js/cube-ui-kit/commit/c663fd1c0e0d8cd1e53f94f9ee2a4a2c02b0cf36) Thanks [@dangreen](https://github.com/dangreen)! - upgrade production dependencies
+
 ## 0.17.0
 
 ### Minor Changes

package/cjs/_internal/hooks/index.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/cjs/_internal/hooks/use-chained-callback.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/cjs/_internal/hooks/use-deprecation-warning.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/cjs/_internal/hooks/use-event.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/cjs/_internal/hooks/use-sync-ref.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/cjs/_internal/hooks/use-timer/index.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/cjs/_internal/hooks/use-timer/timer.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/cjs/_internal/hooks/use-timer/use-timer.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/cjs/_internal/index.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/cjs/components/Base.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/cjs/components/Block.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/cjs/components/GlobalStyles.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/cjs/components/GridProvider.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/cjs/components/HiddenInput.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/cjs/components/OpenTrasition.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/cjs/components/Root.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.
  */
 
@@ -16,6 +16,7 @@ const tasty_1 = require("../tasty");
 const provider_1 = require("../provider");
 const tokens_1 = require("../tokens");
 const react_2 = require("../utils/react");
+const TrackingProvider_1 = require("../providers/TrackingProvider");
 const portal_1 = require("./portal");
 const GlobalStyles_1 = require("./GlobalStyles");
 const AlertDialog_1 = require("./overlays/AlertDialog");
@@ -39,7 +40,7 @@ const IS_DVH_SUPPORTED = typeof CSS !== 'undefined' && typeof CSS?.supports ===
 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 = (0, react_1.useRef)(null);
     const [rootRef, setRootRef] = (0, react_1.useState)();
     // We need to measure the window's height in JS rather than using percentages in CSS
@@ -80,9 +81,11 @@ function Root(allProps) {
         }
     }, []);
     const styles = (0, tasty_1.extractStyles)(props, STYLES, DEFAULT_STYLES);
-    return ((0, jsx_runtime_1.jsx)(provider_1.Provider, { router: router, root: rootRef, children: (0, jsx_runtime_1.jsx)(styled_components_1.StyleSheetManager, { disableVendorPrefixes: true, children: (0, jsx_runtime_1.jsxs)(RootElement, { ref: ref, ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), styles: styles, style: {
-                    '--cube-dynamic-viewport-height': height ? height + 'px' : '100dvh',
-                }, children: [(0, jsx_runtime_1.jsx)(GlobalStyles_1.GlobalStyles, { bodyStyles: bodyStyles, applyLegacyTokens: applyLegacyTokens, publicUrl: publicUrl, fonts: fonts, font: font, monospaceFont: monospaceFont }), (0, jsx_runtime_1.jsx)(overlays_1.ModalProvider, { children: (0, jsx_runtime_1.jsx)(portal_1.PortalProvider, { value: ref, children: (0, jsx_runtime_1.jsx)(NewNotifications_1.NotificationsProvider, { rootRef: ref, children: (0, jsx_runtime_1.jsx)(AlertDialog_1.AlertDialogApiProvider, { children: children }) }) }) })] }) }) }));
+    return ((0, jsx_runtime_1.jsx)(provider_1.Provider, { router: router, root: rootRef, children: (0, jsx_runtime_1.jsx)(TrackingProvider_1.TrackingProvider, { event: tracking?.event, children: (0, jsx_runtime_1.jsx)(styled_components_1.StyleSheetManager, { disableVendorPrefixes: true, children: (0, jsx_runtime_1.jsxs)(RootElement, { ref: ref, ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), styles: styles, style: {
+                        '--cube-dynamic-viewport-height': height
+                            ? height + 'px'
+                            : '100dvh',
+                    }, children: [(0, jsx_runtime_1.jsx)(GlobalStyles_1.GlobalStyles, { bodyStyles: bodyStyles, applyLegacyTokens: applyLegacyTokens, publicUrl: publicUrl, fonts: fonts, font: font, monospaceFont: monospaceFont }), (0, jsx_runtime_1.jsx)(overlays_1.ModalProvider, { children: (0, jsx_runtime_1.jsx)(portal_1.PortalProvider, { value: ref, children: (0, jsx_runtime_1.jsx)(NewNotifications_1.NotificationsProvider, { rootRef: ref, children: (0, jsx_runtime_1.jsx)(AlertDialog_1.AlertDialogApiProvider, { children: children }) }) }) })] }) }) }) }));
 }
 exports.Root = Root;
 

package/cjs/components/actions/Action.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/cjs/components/actions/Button/Button.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/cjs/components/actions/Button/Submit.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/cjs/components/actions/Button/index.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/cjs/components/actions/ButtonGroup/ButtonGroup.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/cjs/components/actions/index.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/cjs/components/actions/use-action.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.
  */
 
@@ -16,6 +16,10 @@ const provider_1 = require("../../provider");
 const react_2 = require("../../utils/react");
 const interactions_2 = require("../../utils/react/interactions");
 const tasty_1 = require("../../tasty");
+const TrackingProvider_1 = require("../../providers/TrackingProvider");
+const _internal_1 = require("../../_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.
@@ -48,21 +52,28 @@ function parseTo(to) {
     };
 }
 exports.parseTo = parseTo;
-function performClickHandler(evt, router, to, onPress) {
+function performClickHandler(evt, { router, to, onPress, tracking }) {
     const { newTab, nativeRoute, href } = parseTo(to);
+    const ref = evt.target;
+    const qa = ref?.getAttribute('data-qa');
     onPress?.(evt);
-    if (!to)
+    if (!to) {
+        tracking.event(BUTTON_PRESS_EVENT, { qa }, ref);
         return;
+    }
     if (evt.shiftKey || evt.metaKey || newTab) {
         openLink(href, true);
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'tab' }, ref);
         return;
     }
     if (nativeRoute) {
         openLink(href || window.location.href);
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'native' }, ref);
     }
     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 }, ref);
         if (element) {
             element.scrollIntoView({
                 behavior: 'smooth',
@@ -73,23 +84,26 @@ function performClickHandler(evt, router, to, onPress) {
         }
     }
     if (router) {
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'router' }, ref);
         router.push(href);
     }
     else if (href) {
+        tracking.event(LINK_PRESS_EVENT, { qa, href, type: 'native' }, ref);
         window.location.href = href;
     }
 }
 exports.performClickHandler = performClickHandler;
 const useAction = function useAction({ to, as, htmlType, label, mods, onPress, ...props }, ref) {
     as = to ? 'a' : as || 'button';
+    const tracking = (0, TrackingProvider_1.useTracking)();
     const router = (0, react_1.useContext)(provider_1.UIKitContext).router;
     const isDisabled = props.isDisabled;
     const { newTab, href } = parseTo(to);
     const target = newTab ? '_blank' : undefined;
     const domRef = (0, utils_1.useFocusableRef)(ref);
-    const customOnPress = (0, react_1.useCallback)((evt) => {
-        performClickHandler(evt, router, to, onPress);
-    }, [router, to, onPress]);
+    const customOnPress = (0, _internal_1.useEvent)((evt) => {
+        performClickHandler(evt, { router, to, onPress, tracking });
+    });
     let { buttonProps, isPressed } = (0, button_1.useButton)({
         ...props,
         onPress: customOnPress,

package/cjs/components/content/ActiveZone/ActiveZone.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/cjs/components/content/Alert/Alert.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/cjs/components/content/Alert/index.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/cjs/components/content/Alert/types.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/cjs/components/content/Alert/use-alert.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/cjs/components/content/Avatar/Avatar.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/cjs/components/content/Badge/Badge.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/cjs/components/content/Card/Card.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/cjs/components/content/Content.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/cjs/components/content/CopySnippet/CopySnippet.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/cjs/components/content/CopySnippet/index.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/cjs/components/content/Divider.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/cjs/components/content/Footer.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/cjs/components/content/Header.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/cjs/components/content/Paragraph.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/cjs/components/content/Placeholder/Placeholder.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/cjs/components/content/PrismCode/PrismCode.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/cjs/components/content/Result/Result.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/cjs/components/content/Skeleton/Skeleton.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/cjs/components/content/Tag/Tag.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/cjs/components/content/Text.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/cjs/components/content/Title.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/cjs/components/forms/Checkbox/Checkbox.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/cjs/components/forms/Checkbox/CheckboxGroup.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/cjs/components/forms/Checkbox/context.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/cjs/components/forms/FieldWrapper.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/cjs/components/forms/FileInput/FileInput.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/cjs/components/forms/Form/Field.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/cjs/components/forms/Form/Form.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/cjs/components/forms/Form/SubmitError.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.
  */