@cube-dev/ui-kit 0.69.1 → 0.69.3

package/es/tasty/utils/modAttrs.js

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

package/es/tasty/utils/renderStyles.js

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

package/es/tasty/utils/responsive.js

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

package/es/tasty/utils/string.js

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

package/es/tasty/utils/styles.js

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

package/es/tasty/utils/warnings.js

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

package/es/tokens.js

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

package/es/type-checks.js

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

package/es/utils/ResizeSensor.js

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

package/es/utils/modules.js

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

package/es/utils/promise.js

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

package/es/utils/random.js

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

package/es/utils/range.js

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

package/es/utils/react/Slots.js

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

package/es/utils/react/chain.js

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

package/es/utils/react/index.js

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

package/es/utils/react/interactions.js

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

package/es/utils/react/isTextOnly.js

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

package/es/utils/react/mapProps.js

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

package/es/utils/react/mergeProps.js

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

package/es/utils/react/nullableValue.js

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

package/es/utils/react/sharedStore.js

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

package/es/utils/react/useCombinedRefs.js

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

package/es/utils/react/useControlledFocusVisible.js

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

package/es/utils/react/useEventBus.js

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

package/es/utils/react/useId.js

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

package/es/utils/react/useIsDarwin.js

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

package/es/utils/react/useKeySymbols.js

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

package/es/utils/react/useLayoutEffect.js

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

package/es/utils/react/useQaProps.js

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

package/es/utils/react/useViewportSize.js

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

package/es/utils/tree.js

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

package/es/version.js

@@ -1,13 +1,13 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.69.1
+ * @cube-dev/ui-kit v0.69.3
  * Released under the MIT license.
  */
 
 "use strict";
 if (typeof window !== 'undefined') {
-    const version = '0.69.1';
+    const version = '0.69.3';
     // 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.69.1",
+  "version": "0.69.3",
   "description": "UIKit for Cube Projects",
   "keywords": [
     "uikit"

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

@@ -12,8 +12,16 @@ export interface CubeButtonProps extends CubeActionProps {
 export type ButtonVariant = 'default.primary' | 'default.secondary' | 'default.outline' | 'default.neutral' | 'default.clear' | 'default.link' | 'danger.primary' | 'danger.secondary' | 'danger.outline' | 'danger.neutral' | 'danger.clear' | 'danger.link' | 'success.primary' | 'success.secondary' | 'success.outline' | 'success.neutral' | 'success.clear' | 'success.link' | 'special.primary' | 'special.secondary' | 'special.outline' | 'special.neutral' | 'special.clear' | 'special.link';
 export declare const DEFAULT_BUTTON_STYLES: {
     readonly display: "inline-grid";
-    readonly placeItems: "center stretch";
-    readonly placeContent: "center";
+    readonly flow: "column";
+    readonly placeItems: "center start";
+    readonly placeContent: {
+        readonly '': "center";
+        readonly 'right-icon | suffix': "center stretch";
+    };
+    readonly gridColumns: {
+        readonly '': "initial";
+        readonly 'left-icon | loading | prefix': "max-content";
+    };
     readonly position: "relative";
     readonly margin: 0;
     readonly boxSizing: "border-box";
@@ -25,7 +33,6 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly '': ".75x";
         readonly '[data-size="small"]': ".5x";
     };
-    readonly flow: "column";
     readonly preset: {
         readonly '': "t3m";
         readonly '[data-size="xsmall"]': "t4";
@@ -37,19 +44,19 @@ export declare const DEFAULT_BUTTON_STYLES: {
     readonly outlineOffset: 1;
     readonly padding: {
         readonly '': ".5x (1.5x - 1bw)";
-        readonly '[data-size="small"] | [data-size="xsmall"]': ".5x (1x - 1bw)";
+        readonly '[data-size="small"] | [data-size="xsmall"]': ".5x (1.25x - 1bw)";
         readonly '[data-size="medium"]': ".5x (1.5x - 1bw)";
-        readonly '[data-size="large"]': ".5x (2x - 1bw)";
-        readonly '[data-size="xlarge"]': ".5x (2.25x - 1bw)";
-        readonly 'single-icon-only | [data-type="link"]': 0;
+        readonly '[data-size="large"]': ".5x (1.75x - 1bw)";
+        readonly '[data-size="xlarge"]': ".5x (2x - 1bw)";
+        readonly 'single-icon | [data-type="link"]': 0;
     };
     readonly width: {
         readonly '': "initial";
-        readonly '[data-size="xsmall"] & single-icon-only': "@size-xs @size-xs";
-        readonly '[data-size="small"] & single-icon-only': "@size-sm @size-sm";
-        readonly '[data-size="medium"] & single-icon-only': "@size-md @size-md";
-        readonly '[data-size="large"] & single-icon-only': "@size-lg @size-lg";
-        readonly '[data-size="xlarge"] & single-icon-only': "@size-xl @size-xl";
+        readonly '[data-size="xsmall"] & single-icon': "@size-xs @size-xs";
+        readonly '[data-size="small"] & single-icon': "@size-sm @size-sm";
+        readonly '[data-size="medium"] & single-icon': "@size-md @size-md";
+        readonly '[data-size="large"] & single-icon': "@size-lg @size-lg";
+        readonly '[data-size="xlarge"] & single-icon': "@size-xl @size-xl";
         readonly '[data-type="link"]': "initial";
     };
     readonly height: {
@@ -66,6 +73,17 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly '': true;
         readonly '[data-type="link"] & !focused': 0;
     };
+    readonly ButtonIcon: {
+        readonly width: "min 1fs";
+    };
+    readonly '& [data-element="ButtonIcon"]:first-child:not(:last-child)': {
+        readonly marginLeft: "-.5x";
+        readonly placeSelf: "center start";
+    };
+    readonly '& [data-element="ButtonIcon"]:last-child:not(:first-child)': {
+        readonly marginRight: "-.5x";
+        readonly placeSelf: "center end";
+    };
 };
 export declare const DEFAULT_PRIMARY_STYLES: Styles;
 export declare const DEFAULT_SECONDARY_STYLES: Styles;

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

@@ -5,35 +5,35 @@ import { Styles } from '../../../tasty';
 import { CubeListBoxProps } from '../ListBox/ListBox';
 import type { FieldBaseProps } from '../../../shared';
 type FilterFn = (textValue: string, inputValue: string) => boolean;
-export interface CubeFilterListBoxProps<T> extends Omit<CubeListBoxProps<T>, 'children'>, FieldBaseProps {
+export interface CubeFilterListBoxProps<T> extends CubeListBoxProps<T>, FieldBaseProps {
     /** Placeholder text for the search input */
     searchPlaceholder?: string;
     /** Whether the search input should have autofocus */
     autoFocus?: boolean;
-    /** The filter function used to determine if an option should be included in the filtered list */
+    /** Custom filter function for determining if an option should be included in search results */
     filter?: FilterFn;
     /** Custom label to display when no results are found after filtering */
     emptyLabel?: ReactNode;
     /** Custom styles for the search input */
     searchInputStyles?: Styles;
-    /** Whether the FilterListBox as a whole is loading (generic loading indicator) */
+    /** Whether the FilterListBox is in loading state (shows loading icon in search input) */
     isLoading?: boolean;
-    /** Ref for the search input */
+    /** Ref for accessing the search input element */
     searchInputRef?: RefObject<HTMLInputElement>;
-    /** Children (ListBox.Item and ListBox.Section elements) */
-    children?: ReactNode;
-    /** Allow entering a custom value that is not present in the options */
+    /** Whether to allow entering custom values that are not present in the predefined options */
     allowsCustomValue?: boolean;
-    /** Mods for the FilterListBox */
+    /** Additional modifiers for styling the FilterListBox */
     mods?: Record<string, boolean>;
+    /** Custom styles for the list box */
+    listBoxStyles?: Styles;
     /**
-     * Optional callback fired when the user presses `Escape` while the search input is empty.
+     * Callback fired when the user presses Escape key while the search input is empty.
      * Can be used by parent components (e.g. FilterPicker) to close an enclosing Dialog.
      */
     onEscape?: () => void;
     /**
-     * Whether the options in the FilterListBox are checkable.
-     * This adds a checkbox icon to the left of the option.
+     * Whether to show checkboxes for multiple selection mode.
+     * This adds a checkbox icon to the left of each option.
      */
     isCheckable?: boolean;
     /**

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

@@ -1,50 +1,54 @@
 import { ForwardedRef, MutableRefObject, ReactElement, ReactNode } from 'react';
-import { Section as BaseSection, Item } from 'react-stately';
+import { Section as BaseSection, Item, ListState } from 'react-stately';
 import { BasePropsWithoutChildren, BaseStyleProps, ColorStyleProps, OuterStyleProps, Styles } from '../../../tasty';
+import { CubeButtonProps } from '../../actions';
 import { CubeFilterListBoxProps } from '../FilterListBox/FilterListBox';
 import type { FieldBaseProps } from '../../../shared';
-export interface CubeFilterPickerProps<T> extends Omit<CubeFilterListBoxProps<T>, 'children'>, BasePropsWithoutChildren, BaseStyleProps, OuterStyleProps, ColorStyleProps, FieldBaseProps {
+export interface CubeFilterPickerProps<T> extends Omit<CubeFilterListBoxProps<T>, 'size'>, BasePropsWithoutChildren, BaseStyleProps, OuterStyleProps, ColorStyleProps, FieldBaseProps, Pick<CubeButtonProps, 'type' | 'theme' | 'icon' | 'rightIcon'> {
     /** Placeholder text when no selection is made */
     placeholder?: string;
-    /** Icon to show in the trigger */
+    /** Icon to show in the trigger button */
     icon?: ReactElement;
-    /** Type of button styling */
+    /** Button styling type */
     type?: 'outline' | 'clear' | 'primary' | 'secondary' | 'neutral' | (string & {});
     /** Button theme */
     theme?: 'default' | 'special';
-    /** Size of the component */
+    /** Size of the picker component */
     size?: 'small' | 'medium' | 'large';
-    /** Children (FilterListBox.Item and FilterListBox.Section elements) */
-    children?: ReactNode;
-    /** Custom styles for the list box */
+    /** Custom styles for the list box popover */
     listBoxStyles?: Styles;
-    /** Custom styles for the popover */
+    /** Custom styles for the popover container */
     popoverStyles?: Styles;
-    /** Whether the filter picker is checkable */
+    /** Custom styles for the trigger button */
+    triggerStyles?: Styles;
+    /** Whether to show checkboxes for multiple selection mode */
     isCheckable?: boolean;
+    /** Whether to flip the popover placement */
+    shouldFlip?: boolean;
     /**
-     * Custom renderer for the summary shown inside the trigger **when there is a selection**.
+     * Custom renderer for the summary shown inside the trigger when there is a selection.
      *
      * For `selectionMode="multiple"` the function receives:
      *  - `selectedLabels`: array of labels of the selected items.
-     *  - `selectedKeys`: array of keys of the selected items.
+     *  - `selectedKeys`: array of keys of the selected items or "all".
      *
      * For `selectionMode="single"` the function receives:
      *  - `selectedLabel`: label of the selected item.
      *  - `selectedKey`: key of the selected item.
      *
      * The function should return a `ReactNode` that will be rendered inside the trigger.
+     * Set to `false` to hide the summary text completely.
      */
     renderSummary?: ((args: {
-        selectedLabels: string[];
-        selectedKeys: (string | number)[];
+        selectedLabels?: string[];
+        selectedKeys?: 'all' | (string | number)[];
         selectedLabel?: string;
         selectedKey?: string | number | null;
-        selectionMode: 'single' | 'multiple';
+        selectionMode?: 'single' | 'multiple';
     }) => ReactNode) | false;
-    /** Optional ref to access internal ListBox state (from FilterListBox) */
-    listStateRef?: MutableRefObject<any | null>;
-    /** Mods for the FilterPicker */
+    /** Ref to access internal ListBox state (from FilterListBox) */
+    listStateRef?: MutableRefObject<ListState<T>>;
+    /** Additional modifiers for styling the FilterPicker */
     mods?: Record<string, boolean>;
 }
 export declare const FilterPicker: (<T>(props: CubeFilterPickerProps<T> & {