@cube-dev/ui-kit 0.59.8 → 0.59.10

package/es/utils/react/useLayoutEffect.js

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

package/es/utils/react/useQaProps.js

@@ -0,0 +1,44 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.59.10
+ * Released under the MIT license.
+ */
+
+/**
+ * Processes QA props.
+ * If `qa` or `qaVal` props are present, they are not modified and have higher priority.
+ * Otherwise, maps `data-qa` to `qa` and `data-qa-val` to `qaVal`.
+ * Data attributes are always removed.
+ * Modifies the original props object without copying it.
+ * Accepts only non-falsy values, otherwise deletes both props.
+ *
+ * @param props - The object to process
+ * @returns The modified object
+ */
+export function useQaProps(props) {
+    // Helper function to process qa attributes
+    const processQaAttribute = (propName, dataAttrName) => {
+        if (props[propName] !== undefined || props[dataAttrName] !== undefined) {
+            const propValue = props[propName];
+            const dataAttrValue = props[dataAttrName];
+            if (!propValue) {
+                if (dataAttrValue) {
+                    // If prop is empty but data-attr is truthy, map data-attr to prop
+                    props[propName] = dataAttrValue;
+                }
+                else {
+                    // Both values are falsy, delete both
+                    delete props[propName];
+                }
+            }
+            delete props[dataAttrName];
+        }
+    };
+    // Process qa attributes
+    processQaAttribute('qa', 'data-qa');
+    processQaAttribute('qaVal', 'data-qa-val');
+    return props;
+}
+
+        

package/es/utils/react/useViewportSize.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.59.8
+ * @cube-dev/ui-kit v0.59.10
  * 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.59.8
+ * @cube-dev/ui-kit v0.59.10
  * 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.59.8
+ * @cube-dev/ui-kit v0.59.10
  * Released under the MIT license.
  */
 
@@ -30,7 +30,7 @@ export const getOverlayTransitionCSS = ({ suffix = '', placement = 'initial', mi
     --overlay-hidden-y-scale: ${placement === 'left' || placement === 'right' ? '1' : minScale};
     --overlay-translate-visible: translate(0px, 0px);
     --overlay-translate-hidden: ${TRANSLATE_MAP[placement]};
-    --overlay-transition: 180ms;
+    --overlay-transition: 120ms;
     --overlay-hidden-scale: scale(var(--overlay-hidden-x-scale), var(--overlay-hidden-y-scale));
     --overlay-normal-scale: scale(1, 1);
   }

package/es/utils/tree.js

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

package/es/version.js

@@ -1,13 +1,13 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.59.8
+ * @cube-dev/ui-kit v0.59.10
  * Released under the MIT license.
  */
 
 "use strict";
 if (typeof window !== 'undefined') {
-    const version = '0.59.8';
+    const version = '0.59.10';
     // Ensure CubeUIKit is defined on window in a way bundlers recognize
     window.CubeUIKit = window.CubeUIKit || { version };
     // Check for multiple versions

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cube-dev/ui-kit",
-  "version": "0.59.8",
+  "version": "0.59.10",
   "description": "UIKit for Cube Projects",
   "keywords": [
     "uikit"
@@ -18,6 +18,7 @@
   },
   "dependencies": {
     "@ant-design/icons": "^5.5.1",
+    "@ianvs/prettier-plugin-sort-imports": "^4.4.1",
     "@internationalized/date": "^3.7.0",
     "@react-aria/focus": "^3.19.1",
     "@react-aria/i18n": "^3.12.5",
@@ -28,12 +29,14 @@
     "@react-spectrum/utils": "^3.12.1",
     "@react-stately/utils": "^3.10.5",
     "@react-types/shared": "^3.27.0",
+    "@trivago/prettier-plugin-sort-imports": "^5.2.2",
     "@vitejs/plugin-react": "^4.3.2",
     "clipboard-copy": "^4.0.1",
     "clsx": "^1.1.1",
     "diff": "^7.0.0",
     "email-validator": "^2.0.4",
-    "prismjs": "^1.27.0",
+    "globals": "^16.0.0",
+    "prismjs": "^1.30.0",
     "react-aria": "^3.37.0",
     "react-focus-lock": "^2.13.5",
     "react-is": "^18.3.1",
@@ -43,6 +46,7 @@
     "react-types": "^0.1.0",
     "remark-gfm": "^4.0.1",
     "tiny-invariant": "^1.3.3",
+    "typescript-eslint": "^8.31.0",
     "usehooks-ts": "^3.1.0",
     "valid-url": "^1.0.9"
   },

package/types/components/Root.d.ts

@@ -1,5 +1,5 @@
-import { BaseProps } from '../tasty';
 import { TrackingProps } from '../providers/TrackingProvider';
+import { BaseProps } from '../tasty';
 export interface CubeRootProps extends BaseProps {
     tokens?: {
         [key: string]: string;

package/types/components/actions/Action/Action.d.ts

@@ -1,5 +1,5 @@
 import { AriaButtonProps } from 'react-aria';
-import { AllBaseProps, BaseStyleProps, ContainerStyleProps, TextStyleProps, TagName } from '../../../tasty';
+import { AllBaseProps, BaseStyleProps, ContainerStyleProps, TagName, TextStyleProps } from '../../../tasty';
 export interface CubeActionProps<T extends TagName = 'a' | 'button' | 'span' | 'div'> extends Omit<AllBaseProps<T>, 'htmlType'>, BaseStyleProps, ContainerStyleProps, TextStyleProps, Omit<AriaButtonProps, 'type'> {
     to?: string;
     label?: string;

package/types/components/actions/Button/Button.d.ts

@@ -1,6 +1,6 @@
 import { ReactElement } from 'react';
-import { CubeActionProps } from '../Action/Action';
 import { Styles } from '../../../tasty';
+import { CubeActionProps } from '../Action/Action';
 export interface CubeButtonProps extends CubeActionProps {
     icon?: ReactElement;
     rightIcon?: ReactElement;

package/types/components/actions/use-action.d.ts

@@ -1,5 +1,5 @@
-import { AriaButtonProps } from 'react-aria';
 import { FocusableRef } from '@react-types/shared';
+import { AriaButtonProps } from 'react-aria';
 import { AllBaseProps, TagName } from '../../tasty';
 export interface CubeUseActionProps<T extends TagName = 'a' | 'button' | 'span' | 'div'> extends AllBaseProps<T>, Omit<AriaButtonProps, 'type'> {
     to?: string;

package/types/components/content/Alert/types.d.ts

@@ -1,5 +1,5 @@
-import { BaseProps, ContainerStyleProps, TextStyleProps } from '../../../tasty';
 import THEMES from '../../../data/themes';
+import { BaseProps, ContainerStyleProps, TextStyleProps } from '../../../tasty';
 export interface CubeAlertProps extends Omit<BaseProps, 'theme'>, ContainerStyleProps, TextStyleProps {
     /**
      * ***Deprecated***

package/types/components/content/CopyPasteBlock/CopyPasteBlock.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
-import { CubeCardProps } from '../Card/Card';
 import { PositionStyleProps, Styles } from '../../../tasty';
+import { CubeCardProps } from '../Card/Card';
 export interface CubeCopyPasteBlockProps extends CubeCardProps, PositionStyleProps {
     padding?: Styles['padding'];
     /** The code snippet */

package/types/components/content/CopySnippet/CopySnippet.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
-import { CubeCardProps } from '../Card/Card';
 import { CubePrismCodeProps } from '../../content/PrismCode/PrismCode';
+import { CubeCardProps } from '../Card/Card';
 declare const ActionButton: import("react").ComponentType<{
     [x: string]: any;
     [x: number]: any;

package/types/components/content/PrismCode/PrismCode.d.ts

@@ -1,7 +1,7 @@
-import 'prismjs/components/prism-yaml';
-import 'prismjs/components/prism-sql';
-import 'prismjs/components/prism-javascript';
 import 'prismjs/components/prism-diff';
+import 'prismjs/components/prism-javascript';
+import 'prismjs/components/prism-sql';
+import 'prismjs/components/prism-yaml';
 import 'prismjs/plugins/diff-highlight/prism-diff-highlight';
 import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 export interface CubePrismCodeProps extends ContainerStyleProps {

package/types/components/content/Skeleton/Skeleton.d.ts

@@ -1,6 +1,6 @@
-import { CubePlaceholderProps } from '../Placeholder/Placeholder';
-import { CubeGridProps } from '../../layout/Grid';
 import { BaseProps, ContainerStyleProps } from '../../../tasty';
+import { CubeGridProps } from '../../layout/Grid';
+import { CubePlaceholderProps } from '../Placeholder/Placeholder';
 declare const LAYOUT_MAP: {
     readonly page: ({ lines, children, isStatic, ...props }: CubeSkeletonProps) => import("react/jsx-runtime").JSX.Element;
     readonly content: ({ children, lines, isStatic, ...props }: CubeSkeletonProps) => import("react/jsx-runtime").JSX.Element;

package/types/components/fields/Checkbox/Checkbox.d.ts

@@ -1,6 +1,6 @@
-import { useCheckbox, AriaCheckboxProps } from 'react-aria';
-import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
+import { AriaCheckboxProps, useCheckbox } from 'react-aria';
 import { FieldBaseProps } from '../../../shared';
+import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 import { CheckboxGroup } from './CheckboxGroup';
 export interface CubeCheckboxProps extends BaseProps, ContainerStyleProps, AriaCheckboxProps, FieldBaseProps {
     inputStyles?: Styles;

package/types/components/fields/Checkbox/CheckboxGroup.d.ts

@@ -1,6 +1,6 @@
 import { AriaCheckboxGroupProps } from 'react-aria';
-import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 import { FieldBaseProps } from '../../../shared';
+import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 export interface CubeCheckboxGroupProps extends BaseProps, AriaCheckboxGroupProps, FieldBaseProps, ContainerStyleProps {
     orientation?: 'vertical' | 'horizontal';
     inputStyles?: Styles;

package/types/components/fields/ComboBox/ComboBox.d.ts

@@ -1,8 +1,8 @@
 import { ForwardedRef, ReactElement, RefObject } from 'react';
 import { AriaComboBoxProps, AriaTextFieldProps } from 'react-aria';
 import { Item } from 'react-stately';
-import { CubeSelectBaseProps } from '../Select';
 import type { KeyboardDelegate, LoadingState } from '@react-types/shared';
+import type { CubeSelectBaseProps } from '../Select';
 type FilterFn = (textValue: string, inputValue: string) => boolean;
 export type MenuTriggerAction = 'focus' | 'input' | 'manual';
 export interface CubeComboBoxProps<T> extends Omit<CubeSelectBaseProps<T>, 'onOpenChange' | 'onBlur' | 'onFocus' | 'validate' | 'onSelectionChange'>, AriaComboBoxProps<T>, AriaTextFieldProps {

package/types/components/fields/DatePicker/DateInput.d.ts

@@ -1,7 +1,7 @@
 import { FocusableRef } from '@react-types/shared';
 import { AriaDateFieldProps, DateValue } from 'react-aria';
-import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 import { FieldBaseProps, ValidationState } from '../../../shared';
+import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 export interface CubeDateInputProps<T extends DateValue = DateValue> extends AriaDateFieldProps<T>, BaseProps, ContainerStyleProps, FieldBaseProps {
     wrapperStyles?: Styles;
     inputStyles?: Styles;

package/types/components/fields/DatePicker/DateInputBase.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { ContainerStyleProps, Props, Styles } from '../../../tasty';
 import { ValidationState } from '../../../shared';
+import { ContainerStyleProps, Props, Styles } from '../../../tasty';
 interface CubeDateAtomInputProps extends ContainerStyleProps {
     isDisabled?: boolean;
     children?: React.ReactNode;

package/types/components/fields/DatePicker/DatePicker.d.ts

@@ -1,6 +1,6 @@
 import { AriaDatePickerProps, DateValue } from 'react-aria';
-import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 import { FieldBaseProps, ValidationState } from '../../../shared';
+import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 import { DateFieldBase } from './types';
 export interface CubeDatePickerProps<T extends DateValue = DateValue> extends AriaDatePickerProps<T>, DateFieldBase<T>, BaseProps, ContainerStyleProps, FieldBaseProps {
     wrapperStyles?: Styles;