@cube-dev/ui-kit 0.77.1 → 0.77.3

package/es/components/fields/FilterPicker/index.js

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

package/es/components/fields/Input/Input.js

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

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

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

package/es/components/fields/ListBox/ListBox.js

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

package/es/components/fields/ListBox/index.js

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

package/es/components/fields/NumberInput/NumberInput.js

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

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

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

package/es/components/fields/PasswordInput/PasswordInput.js

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

package/es/components/fields/RadioGroup/Radio.js

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

package/es/components/fields/RadioGroup/RadioGroup.js

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

package/es/components/fields/RadioGroup/context.js

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

package/es/components/fields/RadioGroup/index.js

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

package/es/components/fields/SearchInput/SearchInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.77.1
+ * @cube-dev/ui-kit v0.77.3
  * Released under the MIT license.
  */
 
@@ -11,24 +11,11 @@ import { useSearchField } from 'react-aria';
 import { useSearchFieldState } from 'react-stately';
 import { CloseIcon, SearchIcon } from '../../../icons';
 import { useProviderProps } from '../../../provider';
-import { tasty } from '../../../tasty';
 import { ariaToCubeButtonProps } from '../../../utils/react/mapProps';
 import { castNullableStringValue, } from '../../../utils/react/nullableValue';
-import { Button } from '../../actions';
+import { ItemAction } from '../../actions';
 import { TextInputBase } from '../TextInput';
 export { useSearchFieldState, useSearchField };
-const ClearButton = tasty(Button, {
-    icon: _jsx(CloseIcon, {}),
-    styles: {
-        radius: 'right (1r - 1bw)',
-        width: {
-            '': '3x',
-            '[data-size="large"]': '4x',
-        },
-        height: 'auto',
-        placeSelf: 'stretch',
-    },
-});
 export const SearchInput = forwardRef(function SearchInput(props, ref) {
     props = castNullableStringValue(props);
     props = useProviderProps(props);
@@ -37,7 +24,7 @@ export const SearchInput = forwardRef(function SearchInput(props, ref) {
     let state = useSearchFieldState(props);
     let { inputProps, clearButtonProps } = useSearchField(props, state, inputRef);
     let showClearButton = isClearable && state.value !== '' && !props.isReadOnly;
-    return (_jsx(TextInputBase, { ref: ref, inputProps: inputProps, inputRef: inputRef, type: "search", icon: _jsx(SearchIcon, {}), suffixPosition: "after", ...props, suffix: props.suffix || showClearButton ? (_jsxs(_Fragment, { children: [props.suffix, showClearButton && (_jsx(ClearButton, { size: props.size, type: validationState === 'invalid' ? 'clear' : 'neutral', theme: validationState === 'invalid' ? 'danger' : undefined, ...ariaToCubeButtonProps(clearButtonProps) }))] })) : undefined }));
+    return (_jsx(TextInputBase, { ref: ref, inputProps: inputProps, inputRef: inputRef, type: "search", icon: _jsx(SearchIcon, {}), suffixPosition: "after", ...props, suffix: props.suffix || showClearButton ? (_jsxs(_Fragment, { children: [props.suffix, showClearButton && (_jsx(ItemAction, { icon: _jsx(CloseIcon, {}), size: props.size, type: validationState === 'invalid' ? 'clear' : 'neutral', theme: validationState === 'invalid' ? 'danger' : undefined, ...ariaToCubeButtonProps(clearButtonProps) }))] })) : undefined }));
 });
 
         

package/es/components/fields/SearchInput/index.js

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

package/es/components/fields/Select/Select.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.77.1
+ * @cube-dev/ui-kit v0.77.3
  * Released under the MIT license.
  */
 
@@ -10,7 +10,8 @@ import { cloneElement, useEffect, useMemo, useRef, } from 'react';
 import { DismissButton, FocusScope, HiddenSelect, useButton, useHover, useListBox, useListBoxSection, useOption, useOverlay, useOverlayPosition, useSelect, } from 'react-aria';
 import { Section as BaseSection, useSelectState } from 'react-stately';
 import styled from 'styled-components';
-import { DirectionIcon, LoadingIcon } from '../../../icons/index';
+import { useEvent } from '../../../_internal';
+import { CloseIcon, DirectionIcon, LoadingIcon } from '../../../icons/index';
 import { useProviderProps } from '../../../provider';
 import { BASE_STYLES, COLOR_STYLES, extractStyles, OUTER_STYLES, tasty, } from '../../../tasty/index';
 import { generateRandomId } from '../../../utils/random';
@@ -18,6 +19,7 @@ import { forwardRefWithGenerics, mergeProps, useCombinedRefs, } from '../../../u
 import { useFocus } from '../../../utils/react/interactions';
 import { useEventBus } from '../../../utils/react/useEventBus';
 import { getOverlayTransitionCSS } from '../../../utils/transitions';
+import { ItemAction } from '../../actions';
 import { StyledDivider as ListDivider, StyledSectionHeading as ListSectionHeading, StyledSection as ListSectionWrapper, } from '../../actions/Menu/styled';
 import { ItemBase } from '../../content/ItemBase';
 import { useFieldProps, useFormProps, wrapWithField } from '../../form';
@@ -116,7 +118,7 @@ function Select(props, ref) {
             onSelectionChange: onChange,
         }),
     });
-    let { qa, label, extra, icon, rightIcon, labelStyles, isRequired, necessityIndicator, validationState, prefix, isDisabled, autoFocus, inputProps, triggerRef, popoverRef, listBoxRef, isLoading, loadingIndicator, overlayOffset = 8, inputStyles, triggerStyles, optionStyles, wrapperStyles, listBoxStyles, overlayStyles, suffix, message, description, descriptionPlacement, hotkeys, direction = 'bottom', shouldFlip = true, placeholder, tooltip, size = 'medium', styles, type = 'outline', theme = 'default', labelSuffix, suffixPosition = 'before', ...otherProps } = props;
+    let { qa, label, extra, icon, rightIcon, labelStyles, isRequired, necessityIndicator, validationState, prefix, isDisabled, autoFocus, inputProps, triggerRef, popoverRef, listBoxRef, isLoading, loadingIndicator, overlayOffset = 8, inputStyles, triggerStyles, optionStyles, wrapperStyles, listBoxStyles, overlayStyles, suffix, message, description, descriptionPlacement, hotkeys, direction = 'bottom', shouldFlip = true, placeholder, tooltip, size = 'medium', styles, type = 'outline', theme = 'default', labelSuffix, suffixPosition = 'before', isClearable, ...otherProps } = props;
     let state = useSelectState(props);
     // Generate a unique ID for this select instance
     const selectId = useMemo(() => generateRandomId(), []);
@@ -161,6 +163,20 @@ function Select(props, ref) {
     let isInvalid = validationState === 'invalid';
     let validationIcon = isInvalid ? InvalidIcon : ValidIcon;
     let validation = cloneElement(validationIcon);
+    // Clear button logic
+    let hasSelection = state.selectedItem != null;
+    let showClearButton = isClearable && hasSelection && !isDisabled && !props.isReadOnly;
+    // Clear function
+    let clearValue = useEvent(() => {
+        props.onSelectionChange?.(null);
+        state.setSelectedKey(null);
+        // Close the popup if it's open
+        if (state.isOpen) {
+            state.close();
+        }
+        // Return focus to the trigger for better UX
+        triggerRef.current?.focus?.();
+    });
     let triggerWidth = triggerRef?.current?.offsetWidth;
     const showPlaceholder = !!placeholder?.trim() && !state.selectedItem;
     const modifiers = useMemo(() => ({
@@ -192,7 +208,7 @@ function Select(props, ref) {
                 // Ensure this button never submits a surrounding form in tests or runtime
                 htmlType: "button", 
                 // Preserve visual variant via data attribute instead of conflicting with HTML attribute
-                type: type, mods: modifiers, prefix: prefix, suffix: suffix, icon: icon, rightIcon: rightIcon !== undefined ? (rightIcon) : isLoading ? (_jsx(LoadingIcon, {})) : (_jsx(DirectionIcon, { to: state.isOpen ? 'up' : 'down' })), description: description, descriptionPlacement: descriptionPlacement, hotkeys: hotkeys, tooltip: tooltip, labelProps: valueProps, children: state.selectedItem
+                type: type, mods: modifiers, prefix: prefix, suffix: suffix, icon: icon, rightIcon: rightIcon !== undefined ? (rightIcon) : showClearButton ? (_jsx(ItemAction, { icon: _jsx(CloseIcon, {}), size: size, theme: validationState === 'invalid' ? 'danger' : undefined, qa: "SelectClearButton", mods: { pressed: false }, onPress: clearValue })) : isLoading ? (_jsx(LoadingIcon, {})) : (_jsx(DirectionIcon, { to: state.isOpen ? 'up' : 'down' })), description: description, descriptionPlacement: descriptionPlacement, hotkeys: hotkeys, tooltip: tooltip, labelProps: valueProps, children: state.selectedItem
                     ? state.selectedItem.rendered
                     : placeholder || _jsx(_Fragment, { children: "\u00A0" }) }), _jsx(OverlayWrapper, { isOpen: state.isOpen && !isDisabled, children: _jsx(ListBoxPopup, { ...menuProps, popoverRef: popoverRef, listBoxRef: listBoxRef, overlayProps: overlayProps, placement: placement, state: state, listBoxStyles: listBoxStyles, overlayStyles: overlayStyles, optionStyles: optionStyles, minWidth: triggerWidth, triggerRef: triggerRef }) })] }));
     return wrapWithField(selectField, ref, mergeProps({

package/es/components/fields/Select/index.js

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

package/es/components/fields/Slider/Gradation.js

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

package/es/components/fields/Slider/Header.js

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

package/es/components/fields/Slider/RangeSlider.js

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

package/es/components/fields/Slider/Slider.js

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

package/es/components/fields/Slider/SliderBase.js

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

package/es/components/fields/Slider/SliderInput.js

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

package/es/components/fields/Slider/SliderThumb.js

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

package/es/components/fields/Slider/SliderTrack.js

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

package/es/components/fields/Slider/elements.js

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

package/es/components/fields/Slider/index.js

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

package/es/components/fields/Slider/types.js

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

package/es/components/fields/Switch/Switch.js

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

package/es/components/fields/Switch/index.js

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

package/es/components/fields/TextArea/TextArea.js

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

package/es/components/fields/TextArea/index.js

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

package/es/components/fields/TextInput/TextInput.js

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

package/es/components/fields/TextInput/TextInputBase.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.77.1
+ * @cube-dev/ui-kit v0.77.3
  * Released under the MIT license.
  */
 
@@ -73,14 +73,14 @@ export const INPUT_WRAPPER_STYLES = {
     transition: 'theme',
     backgroundClip: 'content-box',
     height: {
-        '': '$size-md $size-md',
-        '[data-size="small"]': '$size-sm $size-sm',
-        '[data-size="medium"]': '$size-md $size-md',
-        '[data-size="large"]': '$size-lg $size-lg',
-        multiline: 'min $size-md',
-        '[data-size="small"] & multiline': 'min $size-sm',
-        '[data-size="medium"] & multiline': 'min $size-md',
-        '[data-size="large"] & multiline': 'min $size-lg',
+        '': '$size $size',
+        multiline: 'min $size',
+    },
+    $size: {
+        '': '$size-md',
+        '[data-size="small"]': '$size-sm',
+        '[data-size="medium"]': '$size-md',
+        '[data-size="large"]': '$size-lg',
     },
     Prefix: ADD_STYLES,
     Suffix: ADD_STYLES,

package/es/components/fields/TextInput/index.js

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

package/es/components/fields/TextInputMapper/TextInputMapper.js

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

package/es/components/fields/TextInputMapper/index.js

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

package/es/components/fields/index.js

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

package/es/components/form/FieldWrapper/FieldWrapper.js

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

package/es/components/form/FieldWrapper/extract-field-wrapper-props.js

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

package/es/components/form/FieldWrapper/index.js

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

package/es/components/form/FieldWrapper/types.js

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

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

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

package/es/components/form/Form/Form.js

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

package/es/components/form/Form/ResetButton/ResetButton.js

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

package/es/components/form/Form/ResetButton/index.js

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

package/es/components/form/Form/SubmitButton/SubmitButton.js

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

package/es/components/form/Form/SubmitButton/index.js

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

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

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

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

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

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

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

package/es/components/form/Form/use-field/index.js

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

package/es/components/form/Form/use-field/types.js

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