@cube-dev/ui-kit 0.14.10 → 0.14.12

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

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

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

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

package/es/components/actions/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.12
  * Released under the MIT license.
  */
 
@@ -10,6 +10,7 @@ import { ButtonGroup } from './ButtonGroup/ButtonGroup';
 const Button = Object.assign(__Button, { Group: ButtonGroup });
 export * from './Button';
 export * from './Action';
+export * from './use-action';
 export { Button, ButtonGroup };
 
         

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

@@ -0,0 +1,122 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.14.12
+ * Released under the MIT license.
+ */
+
+import { useCallback, useContext } from 'react';
+import { useHover } from '@react-aria/interactions';
+import { useButton } from '@react-aria/button';
+import { useFocusableRef } from '@react-spectrum/utils';
+import { UIKitContext } from '../../provider';
+import { mergeProps } from '../../utils/react';
+import { useFocus } from '../../utils/react/interactions';
+import { filterBaseProps } from '../../tasty';
+const FILTER_OPTIONS = { propNames: new Set(['onMouseEnter', 'onMouseLeave']) };
+/**
+ * Helper to open link.
+ * @param {String} href
+ * @param {String|Boolean} [target]
+ */
+export function openLink(href, target) {
+    const link = document.createElement('a');
+    link.href = href;
+    if (target) {
+        link.target = target === true ? '_blank' : target;
+    }
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+}
+export function parseTo(to) {
+    const newTab = to && typeof to === 'string' && to.startsWith('!');
+    const nativeRoute = to && typeof to === 'string' && to.startsWith('@');
+    const href = to && typeof to === 'string'
+        ? newTab || nativeRoute
+            ? to.slice(1)
+            : to
+        : undefined;
+    return {
+        newTab,
+        nativeRoute,
+        href,
+    };
+}
+export function performClickHandler(evt, router, to, onPress) {
+    const { newTab, nativeRoute, href } = parseTo(to);
+    onPress?.(evt);
+    if (!to)
+        return;
+    if (evt.shiftKey || evt.metaKey || newTab) {
+        openLink(href, true);
+        return;
+    }
+    if (nativeRoute) {
+        openLink(href || window.location.href);
+    }
+    else if (href && href.startsWith('#')) {
+        const id = href.slice(1);
+        const element = document.getElementById(id);
+        if (element) {
+            element.scrollIntoView({
+                behavior: 'smooth',
+                block: 'start',
+                inline: 'nearest',
+            });
+            return;
+        }
+    }
+    if (router) {
+        router.push(href);
+    }
+    else if (href) {
+        window.location.href = href;
+    }
+}
+export const useAction = function useAction({ to, as, htmlType, label, mods, onPress, ...props }, ref) {
+    as = to ? 'a' : as || 'button';
+    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]);
+    let { buttonProps, isPressed } = useButton({
+        ...props,
+        onPress: customOnPress,
+    }, domRef);
+    let { hoverProps, isHovered } = useHover({ isDisabled });
+    let { focusProps, isFocused } = useFocus({ isDisabled }, true);
+    const customProps = to
+        ? {
+            onClick(evt) {
+                evt.preventDefault();
+            },
+        }
+        : {};
+    return {
+        actionProps: {
+            mods: {
+                hovered: isHovered && !isDisabled,
+                pressed: isPressed && !isDisabled,
+                focused: isFocused && !isDisabled,
+                disabled: isDisabled,
+                ...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,
+            as,
+            isDisabled,
+            target,
+            href,
+        },
+    };
+};
+
+        

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.12
  * Released under the MIT license.
  */
 
@@ -14,7 +14,7 @@ import { mergeProps } from '../../../utils/react';
 import { CONTAINER_STYLES, Element, extractStyles, filterBaseProps, TEXT_STYLES, } from '../../../tasty';
 import { useFocus } from '../../../utils/react/interactions';
 const DEFAULT_STYLES = {
-    display: 'inline-block',
+    display: 'inline-grid',
     position: 'relative',
     opacity: {
         '': 1,

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

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

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

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

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

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

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

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

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

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

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

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

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

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

package/es/components/content/Content.js

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

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

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

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

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

package/es/components/content/Divider.js

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

package/es/components/content/Footer.js

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

package/es/components/content/Header.js

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

package/es/components/content/Paragraph.js

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

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

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

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

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

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

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

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

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

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.12
  * Released under the MIT license.
  */
 
@@ -10,7 +10,7 @@ import { forwardRef } from 'react';
 import { CloseOutlined } from '@ant-design/icons';
 import THEMES from '../../../data/themes';
 import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, } from '../../../tasty';
-import { Action } from '../../actions/Action';
+import { Action } from '../../actions';
 import { Suffix } from '../../layout/Suffix';
 const TagElement = tasty({
     qa: 'Tag',
@@ -18,6 +18,7 @@ const TagElement = tasty({
     styles: {
         position: 'relative',
         display: 'inline-flex',
+        gap: '1x',
         placeContent: 'center start',
         placeItems: 'center start',
         radius: '1r',
@@ -51,6 +52,9 @@ const TagElement = tasty({
                 return map;
             }, {}),
         },
+        Icon: {
+            fontSize: '@icon-size',
+        },
         Content: {
             display: 'block',
             width: 'max 100%',
@@ -76,10 +80,10 @@ const CloseAction = tasty(Action, {
     },
 });
 function Tag(allProps, ref) {
-    let { type, isClosable, onClose, closeButtonStyles, children, ...props } = allProps;
+    let { type, icon, isClosable, onClose, closeButtonStyles, children, ...props } = allProps;
     const styles = extractStyles(props, CONTAINER_STYLES);
-    return (_jsxs(TagElement, { ...filterBaseProps(props, { eventProps: true }), ref: ref, styles: styles, "data-type": type, mods: { closable: isClosable }, children: [_jsx("div", { "data-element": "Content", children: children }, void 0), isClosable ? (_jsx(Suffix, { outerGap: "0", children: _jsx(CloseAction, { styles: closeButtonStyles, onPress: onClose, children: _jsx(CloseOutlined, { style: {
-                            fontSize: 'calc(var(--font-size) - (var(--border-width) * 2))',
+    return (_jsxs(TagElement, { ...filterBaseProps(props, { eventProps: true }), ref: ref, styles: styles, "data-type": type, mods: { closable: isClosable }, children: [icon ? _jsx("div", { "data-element": "TagIcon", children: icon }, void 0) : null, _jsx("div", { "data-element": "Content", children: children }, void 0), isClosable ? (_jsx(Suffix, { outerGap: "0", children: _jsx(CloseAction, { styles: closeButtonStyles, onPress: onClose, children: _jsx(CloseOutlined, { style: {
+                            fontSize: 'var(--font-size, inherit)',
                         } }, void 0) }, void 0) }, void 0)) : undefined] }, void 0));
 }
 const _Tag = forwardRef(Tag);

package/es/components/content/Text.js

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

package/es/components/content/Title.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.12
  * Released under the MIT license.
  */
 
@@ -29,12 +29,21 @@ const TitleElement = tasty({
         },
         margin: '0',
         whiteSpace: {
-            '': 'initial',
+            '': 'inherit',
             'nowrap | ellipsis': 'nowrap',
         },
-        textOverflow: 'ellipsis',
-        overflow: 'hidden',
-        width: 'max 100%',
+        textOverflow: {
+            '': false,
+            ellipsis: 'ellipsis',
+        },
+        overflow: {
+            '': false,
+            ellipsis: 'hidden',
+        },
+        width: {
+            '': false,
+            ellipsis: 'max 100%',
+        },
     },
 });
 const _Title = forwardRef(function Title({ qa, as, styleName, inline, nowrap, ellipsis, level, ...props }, ref) {

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

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

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

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

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

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

package/es/components/forms/FieldWrapper.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.12
  * Released under the MIT license.
  */
 
@@ -66,7 +66,10 @@ const MessageElement = tasty({
 });
 function FieldWrapper(props, ref) {
     const { as, labelPosition = 'top', label, extra, styles, isRequired, isDisabled, labelStyles, necessityIndicator, labelProps, fieldProps, message, messageStyles, description, Component, validationState, requiredMark = true, tooltip, isHidden, labelSuffix, } = props;
-    const labelComponent = label ? (_jsx(Label, { as: as === 'label' ? 'div' : 'label', styles: labelStyles, labelPosition: labelPosition, isRequired: requiredMark ? isRequired : false, isDisabled: isDisabled, necessityIndicator: necessityIndicator, validationState: validationState, "aria-label": label, ...labelProps, children: _jsxs(Flex, { placeContent: "baseline space-between", width: "100%", children: [_jsxs(Space, { placeItems: "center", gap: "0.25x", children: [_jsx("div", { children: label }, void 0), tooltip ? (_jsx(TooltipProvider, { activeWrap: true, title: tooltip, width: "initial max-content 40x", children: _jsx(InfoCircleOutlined, { style: { color: 'var(--primary-color)', margin: '0 4px' } }, void 0) }, void 0)) : null, _jsx("div", { children: labelSuffix }, void 0)] }, void 0), extra && _jsx(Text, { preset: "t3", children: extra }, void 0)] }, void 0) }, void 0)) : null;
+    const labelComponent = label ? (_jsx(Label, { as: as === 'label' ? 'div' : 'label', styles: labelStyles, labelPosition: labelPosition, isRequired: requiredMark ? isRequired : false, isDisabled: isDisabled, necessityIndicator: necessityIndicator, validationState: validationState, "aria-label": label, ...labelProps, children: _jsxs(Flex, { placeContent: "baseline space-between", width: "100%", children: [_jsxs(Space, { placeItems: "center", gap: "0.25x", children: [_jsx("div", { children: label }, void 0), tooltip ? (_jsx(TooltipProvider, { activeWrap: true, title: tooltip, width: "initial max-content 40x", children: _jsx(InfoCircleOutlined, { style: {
+                                    color: 'var(--primary-color)',
+                                    margin: '0 4px',
+                                } }, void 0) }, void 0)) : null, _jsx("div", { children: labelSuffix }, void 0)] }, void 0), extra && _jsx(Text, { preset: "t3", children: extra }, void 0)] }, void 0) }, void 0)) : null;
     let descriptionComponent = description ? (_jsx("div", { "data-element": "Description", children: wrapNodeIfPlain(description, () => (_jsx(Paragraph, { children: description }, void 0))) }, void 0)) : null;
     const mods = {
         'has-sider': labelPosition === 'side',

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

package/es/components/forms/Label.js

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

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.12
  * Released under the MIT license.
  */
 
@@ -35,7 +35,7 @@ function NumberInput(props, ref) {
     let state = useNumberFieldState({ ...props, locale });
     let inputRef = useRef(null);
     let { groupProps, labelProps, inputProps, incrementButtonProps, decrementButtonProps, } = useNumberField(props, state, inputRef);
-    return (_jsx(TextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: "after", suffix: showStepper ? (_jsxs(StepperContainer, { children: [_jsx(StepButton, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), _jsx(StepButton, { isDisabled: props.isDisabled, direction: "down", ...decrementButtonProps, size: otherProps.size }, void 0)] }, void 0)) : (suffix) }, void 0));
+    return (_jsx(TextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: "after", textAlign: "center", suffix: showStepper ? (_jsxs(StepperContainer, { children: [_jsx(StepButton, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), _jsx(StepButton, { isDisabled: props.isDisabled, direction: "down", ...decrementButtonProps, size: otherProps.size }, void 0)] }, void 0)) : (suffix) }, void 0));
 }
 /**
  * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.

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

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

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

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