@cube-dev/ui-kit 0.0.0-canary-ac3388b → 0.0.0-canary-df4eb9e

package/es/utils/react/useCombinedRefs.js

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

package/es/utils/react/useLocalStorage.js

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

package/es/version.js

@@ -1,11 +1,11 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-ac3388b
+ * @cube-dev/ui-kit v0.0.0-canary-df4eb9e
  * Released under the MIT license.
  */
 
-export const VERSION = '0.0.0-canary-ac3388b';
+export const VERSION = '0.0.0-canary-df4eb9e';
 if (typeof window !== 'undefined') {
     const version = VERSION;
     // Ensure CubeUIKit is defined on window in a way bundlers recognize

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cube-dev/ui-kit",
-  "version": "0.0.0-canary-ac3388b",
+  "version": "0.0.0-canary-df4eb9e",
   "description": "UIKit for Cube Projects",
   "keywords": [
     "uikit"

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

@@ -42,10 +42,6 @@ export declare const DEFAULT_BUTTON_STYLES: {
     readonly display: "inline-grid";
     readonly flow: "column dense";
     readonly gap: 0;
-    readonly gridTemplate: {
-        readonly '': "\"icon label rightIcon\" auto / $left-icon-size 1sf $right-icon-size";
-        readonly 'raw-children': "initial";
-    };
     readonly placeItems: {
         readonly '': "stretch";
         readonly 'raw-children': "center stretch";
@@ -71,8 +67,8 @@ export declare const DEFAULT_BUTTON_STYLES: {
     readonly outlineOffset: 1;
     readonly padding: {
         readonly '': 0;
-        readonly 'raw-children': "$block-padding $label-padding-right $block-padding $label-padding-left";
-        readonly 'raw-children & type=link': 0;
+        readonly 'has-label': "$block-padding ($padding-right + $right-icon-offset) $block-padding ($padding-left + $left-icon-offset)";
+        readonly 'type=link': 0;
     };
     readonly width: {
         readonly '': "min $size";
@@ -89,7 +85,7 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly '': true;
         readonly 'type=link & !focused': 0;
     };
-    readonly transition: "theme, grid-template";
+    readonly transition: "theme, grid-template, padding";
     readonly '$left-icon-size': {
         readonly '': 0;
         readonly 'has-icon': "($size - 2bw)";
@@ -98,6 +94,14 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly '': 0;
         readonly 'has-right-icon': "($size - 2bw)";
     };
+    readonly '$left-icon-offset': {
+        readonly '': "0px";
+        readonly 'has-icon': "($size - 2bw)";
+    };
+    readonly '$right-icon-offset': {
+        readonly '': "0px";
+        readonly 'has-right-icon': "($size - 2bw)";
+    };
     readonly $size: {
         readonly '': "$size-md";
         readonly 'size=xsmall': "$size-xs";
@@ -115,16 +119,16 @@ export declare const DEFAULT_BUTTON_STYLES: {
     };
     readonly '$inline-compensation': ".5x";
     readonly '$min-inline-padding': "(1x - 1bw)";
-    readonly '$label-padding-left': {
+    readonly '$padding-left': {
         readonly '': "$inline-padding";
-        readonly 'has-icon': 0;
+        readonly 'has-icon': "0px";
     };
-    readonly '$label-padding-right': {
+    readonly '$padding-right': {
         readonly '': "$inline-padding";
-        readonly 'has-right-icon': 0;
+        readonly 'has-right-icon': "0px";
     };
     readonly Icon: {
-        readonly gridArea: "icon";
+        readonly left: 0;
         readonly flexDirection?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.FlexDirection | undefined>;
         readonly grid?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Grid | undefined>;
         readonly flex?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Flex<string | number> | undefined>;
@@ -332,7 +336,6 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly justifyItems?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.JustifyItems | undefined>;
         readonly justifySelf?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.JustifySelf | undefined>;
         readonly justifyTracks?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.JustifyTracks | undefined>;
-        readonly left?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Left<string | number> | undefined>;
         readonly letterSpacing?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.LetterSpacing<string | number> | undefined>;
         readonly lineBreak?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.LineBreak | undefined>;
         readonly lineHeight?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.LineHeight<string | number> | undefined>;
@@ -540,6 +543,7 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly containIntrinsicSize?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.ContainIntrinsicSize<string | number> | undefined>;
         readonly container?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Container | undefined>;
         readonly flexFlow?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.FlexFlow | undefined>;
+        readonly gridArea?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.GridArea | undefined>;
         readonly gridColumn?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.GridColumn | undefined>;
         readonly gridRow?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.GridRow | undefined>;
         readonly insetBlock?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.InsetBlock<string | number> | undefined>;
@@ -952,7 +956,7 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly $?: string;
     };
     readonly RightIcon: {
-        readonly gridArea: "rightIcon";
+        readonly right: 0;
         readonly flexDirection?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.FlexDirection | undefined>;
         readonly grid?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Grid | undefined>;
         readonly flex?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Flex<string | number> | undefined>;
@@ -1255,7 +1259,6 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly printColorAdjust?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.PrintColorAdjust | undefined>;
         readonly quotes?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Quotes | undefined>;
         readonly resize?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Resize | undefined>;
-        readonly right?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Right<string | number> | undefined>;
         readonly rotate?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Rotate | undefined>;
         readonly rowGap?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.RowGap<string | number> | undefined>;
         readonly rubyAlign?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.RubyAlign | undefined>;
@@ -1368,6 +1371,7 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly containIntrinsicSize?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.ContainIntrinsicSize<string | number> | undefined>;
         readonly container?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.Container | undefined>;
         readonly flexFlow?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.FlexFlow | undefined>;
+        readonly gridArea?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.GridArea | undefined>;
         readonly gridColumn?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.GridColumn | undefined>;
         readonly gridRow?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.GridRow | undefined>;
         readonly insetBlock?: import("../../../tasty").ResponsiveStyleValue<import("csstype").Property.InsetBlock<string | number> | undefined>;
@@ -1781,7 +1785,6 @@ export declare const DEFAULT_BUTTON_STYLES: {
     };
     readonly Label: {
         readonly $: ">";
-        readonly gridArea: "label";
         readonly display: "block";
         readonly placeSelf: "center stretch";
         readonly boxSizing: "border-box";
@@ -1791,10 +1794,6 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly maxWidth: "100%";
         readonly textAlign: "center";
         readonly transition: "theme, padding";
-        readonly padding: {
-            readonly '': "$block-padding $label-padding-right $block-padding $label-padding-left";
-            readonly 'type=link': 0;
-        };
     };
 };
 export declare const Button: import("react").ForwardRefExoticComponent<Omit<CubeButtonProps, "ref"> & import("react").RefAttributes<import("@react-types/shared").FocusableRefValue<HTMLElement, HTMLElement>>>;

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

@@ -57,7 +57,7 @@ export interface CubeItemProps extends BaseProps, ContainerStyleProps {
      */
     disableActionsFocus?: boolean;
     size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'inline' | number | (string & {});
-    type?: 'item' | 'header' | 'primary' | 'secondary' | 'outline' | 'neutral' | 'clear' | 'link' | 'alert' | (string & {});
+    type?: 'item' | 'header' | 'primary' | 'secondary' | 'outline' | 'neutral' | 'clear' | 'link' | 'card' | (string & {});
     theme?: 'default' | 'danger' | 'success' | 'special' | 'note' | (string & {});
     /** Keyboard shortcut that triggers the element when pressed */
     hotkeys?: string;
@@ -113,6 +113,12 @@ export interface CubeItemProps extends BaseProps, ContainerStyleProps {
      * Ref to access the label element directly
      */
     labelRef?: RefObject<HTMLElement>;
+    /**
+     * Heading level for the Label element when type="header".
+     * Changes the Label's HTML tag to the corresponding heading (h1-h6).
+     * @default 3
+     */
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
     /**
      * String to highlight within children.
      * Only works when children is a plain string.

package/types/data/item-themes.d.ts

@@ -29,8 +29,8 @@ export declare const SPECIAL_NEUTRAL_STYLES: Styles;
 export declare const SPECIAL_CLEAR_STYLES: Styles;
 export declare const SPECIAL_LINK_STYLES: Styles;
 export declare const SPECIAL_ITEM_STYLES: Styles;
-export declare const DEFAULT_ALERT_STYLES: Styles;
-export declare const SUCCESS_ALERT_STYLES: Styles;
-export declare const DANGER_ALERT_STYLES: Styles;
-export declare const NOTE_ALERT_STYLES: Styles;
-export type ItemVariant = 'default.primary' | 'default.secondary' | 'default.outline' | 'default.neutral' | 'default.clear' | 'default.link' | 'default.item' | 'default.alert' | 'danger.primary' | 'danger.secondary' | 'danger.outline' | 'danger.neutral' | 'danger.clear' | 'danger.link' | 'danger.item' | 'danger.alert' | 'success.primary' | 'success.secondary' | 'success.outline' | 'success.neutral' | 'success.clear' | 'success.link' | 'success.item' | 'success.alert' | 'special.primary' | 'special.secondary' | 'special.outline' | 'special.neutral' | 'special.clear' | 'special.link' | 'special.item' | 'note.alert';
+export declare const DEFAULT_CARD_STYLES: Styles;
+export declare const SUCCESS_CARD_STYLES: Styles;
+export declare const DANGER_CARD_STYLES: Styles;
+export declare const NOTE_CARD_STYLES: Styles;
+export type ItemVariant = 'default.primary' | 'default.secondary' | 'default.outline' | 'default.neutral' | 'default.clear' | 'default.link' | 'default.item' | 'default.card' | 'danger.primary' | 'danger.secondary' | 'danger.outline' | 'danger.neutral' | 'danger.clear' | 'danger.link' | 'danger.item' | 'danger.card' | 'success.primary' | 'success.secondary' | 'success.outline' | 'success.neutral' | 'success.clear' | 'success.link' | 'success.item' | 'success.card' | 'special.primary' | 'special.secondary' | 'special.outline' | 'special.neutral' | 'special.clear' | 'special.link' | 'special.item' | 'note.card';