@cube-dev/ui-kit 0.56.3 → 0.58.0

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
@@ -23,52 +23,15 @@ function isEqual(v1, v2) {
     return JSON.stringify(v1) === JSON.stringify(v2);
 }
 export class CubeFormInstance {
+    forceReRender = () => { };
+    defaultValues = {};
+    fields = {};
+    ref = {};
+    isSubmitting = false;
+    submitError = null;
+    onValuesChange = () => { };
+    onSubmit = () => { };
     constructor(forceReRender = () => { }) {
-        this.forceReRender = () => { };
-        this.defaultValues = {};
-        this.fields = {};
-        this.ref = {};
-        this.isSubmitting = false;
-        this.submitError = null;
-        this.onValuesChange = () => { };
-        this.onSubmit = () => { };
-        this.setFieldsValue = (newData, touched, skipRender, inputOnly = false) => {
-            let flag = false;
-            newData = { ...newData, ...dotize.convert(newData) };
-            Object.keys(newData).forEach((name) => {
-                let field = this.fields[name];
-                if (!field) {
-                    return;
-                }
-                if (!field || isEqual(field.value, newData[name])) {
-                    if (field) {
-                        field.errors = [];
-                        field.status = undefined;
-                    }
-                    return;
-                }
-                flag = true;
-                if (!inputOnly) {
-                    field.value = newData[name];
-                }
-                field.inputValue = newData[name];
-                field.errors = [];
-                field.status = undefined;
-                if (touched === true) {
-                    field.touched = touched;
-                }
-                else if (touched === false) {
-                    field.touched = false;
-                }
-            });
-            if (flag && !skipRender) {
-                if (touched && !inputOnly) {
-                    this.onValuesChange && this.onValuesChange(this.getFormData());
-                    this.submitError = null;
-                }
-                this.forceReRender();
-            }
-        };
         this.forceReRender = forceReRender;
         this.getFieldValue = this.getFieldValue.bind(this);
         this.getFieldsValue = this.getFieldsValue.bind(this);
@@ -88,6 +51,40 @@ export class CubeFormInstance {
     async submit() {
         return this.onSubmit?.(this.getFormData());
     }
+    setFieldsValue = (newData, touched, skipRender) => {
+        let flag = false;
+        newData = { ...newData, ...dotize.convert(newData) };
+        Object.keys(newData).forEach((name) => {
+            let field = this.fields[name];
+            if (!field) {
+                return;
+            }
+            if (!field || isEqual(field.value, newData[name])) {
+                if (field) {
+                    field.errors = [];
+                    field.status = undefined;
+                }
+                return;
+            }
+            flag = true;
+            field.value = newData[name];
+            field.errors = [];
+            field.status = undefined;
+            if (touched === true) {
+                field.touched = touched;
+            }
+            else if (touched === false) {
+                field.touched = false;
+            }
+        });
+        if (flag && !skipRender) {
+            if (touched) {
+                this.onValuesChange && this.onValuesChange(this.getFormData());
+                this.submitError = null;
+            }
+            this.forceReRender();
+        }
+    };
     getFieldValue(name) {
         return this.fields[name]?.value;
     }
@@ -114,30 +111,26 @@ export class CubeFormInstance {
             return map;
         }, {});
     }
-    setFieldValue(name, value, isTouched = false, skipRender = false, inputOnly = false) {
+    setFieldValue(name, value, isTouched = false, skipRender = false) {
         const field = this.fields[name];
-        if (!field || isEqual(value, inputOnly ? field.inputValue : field.value)) {
+        if (!field || isEqual(value, field.value)) {
             return;
         }
-        if (!inputOnly) {
-            field.value = value;
-            field.status = undefined; // reset validation status
-            if (typeof value === 'object' && !Array.isArray(value)) {
-                Object.keys(this.fields)
-                    .filter((key) => key.startsWith(`${name}.`))
-                    .forEach((key) => {
-                    const objKey = key.replace(`${name}.`, '');
-                    this.setFieldValue(key, value[objKey] ?? null, isTouched, false);
-                });
-            }
+        field.value = value;
+        if (typeof value === 'object' && !Array.isArray(value)) {
+            Object.keys(this.fields)
+                .filter((key) => key.startsWith(`${name}.`))
+                .forEach((key) => {
+                const objKey = key.replace(`${name}.`, '');
+                this.setFieldValue(key, value[objKey] ?? null, isTouched, false);
+            });
         }
-        field.inputValue = value;
         field.errors = [];
-        field.status = undefined;
+        field.status = undefined; // reset validation status
         if (isTouched) {
             field.touched = isTouched;
         }
-        if (isTouched && !inputOnly) {
+        if (isTouched) {
             this.onValuesChange && this.onValuesChange(this.getFormData());
             this.submitError = null;
         }
@@ -168,7 +161,6 @@ export class CubeFormInstance {
             const defaultValue = this.defaultValues[fieldName] ?? undefined;
             field.value = defaultValue;
             field.touched = false;
-            field.inputValue = defaultValue;
             field.errors = [];
             field.status = undefined;
             field.validationId = (field.validationId ?? 0) + 1;
@@ -371,10 +363,6 @@ export class CubeFormInstance {
             // it should be impossible to define or override status value
             status: data?.errors?.length ? 'invalid' : undefined,
         };
-        if (obj) {
-            // condition is here to avoid typing issues
-            obj.inputValue = obj.value;
-        }
         return obj;
     }
 }

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

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

package/es/components/form/Label.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
@@ -71,6 +71,7 @@ function Label(props, ref) {
                         : undefined, children: necessityLabel })), necessityIndicator === 'icon' && isRequired && icon] })) }));
 }
 let _Label = forwardRef(Label);
+_Label.displayName = 'Label';
 export { _Label as Label };
 
         

package/es/components/form/index.js

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

package/es/components/form/wrapper.js

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

package/es/components/layout/Flex.js

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

package/es/components/layout/Flow.js

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

package/es/components/layout/Grid.js

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

package/es/components/layout/Panel.js

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

package/es/components/layout/Prefix.js

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

package/es/components/layout/ResizablePanel.js

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

package/es/components/layout/Space.js

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

package/es/components/layout/Suffix.js

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

package/es/components/navigation/LegacyTabs/LegacyTabs.js

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

package/es/components/navigation/Link/Link.js

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

package/es/components/organisms/FileTabs/FileTabs.js

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

package/es/components/organisms/Modal/Modal.js

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

package/es/components/organisms/StatsCard/StatsCard.js

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

package/es/components/other/Base64Upload/Base64Upload.js

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

package/es/components/other/Calendar/Calendar.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
@@ -50,6 +50,7 @@ function Calendar(props, ref) {
     return (_jsxs(CalendarElement, { ...calendarProps, children: [_jsxs(CalendarHeaderElement, { children: [_jsx(Title, { level: 6, preset: "h6", children: title }), _jsxs(Button.Group, { gap: ".5x", children: [_jsx(Button, { size: "small", ...prevButtonProps, icon: _jsx(LeftIcon, {}) }), _jsx(Button, { size: "small", ...nextButtonProps, icon: _jsx(RightIcon, {}) })] })] }), _jsx(CalendarGrid, { state: state, selectedRange: props.selectedRange })] }));
 }
 const _Calendar = forwardRef(Calendar);
+_Calendar.displayName = 'Calendar';
 export { _Calendar as Calendar };
 
         

package/es/components/other/Calendar/CalendarCell.js

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

package/es/components/other/Calendar/CalendarGrid.js

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

package/es/components/other/Calendar/RangeCalendar.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
@@ -50,6 +50,7 @@ function RangeCalendar(props, ref) {
     return (_jsxs(CalendarElement, { ref: domRef, ...calendarProps, children: [_jsxs(CalendarHeaderElement, { children: [_jsx(Title, { level: 6, preset: "h6", children: title }), _jsxs(Button.Group, { gap: ".5x", children: [_jsx(Button, { size: "small", ...prevButtonProps, icon: _jsx(LeftIcon, {}) }), _jsx(Button, { size: "small", ...nextButtonProps, icon: _jsx(RightIcon, {}) })] })] }), _jsx(CalendarGrid, { state: state })] }));
 }
 const _RangeCalendar = forwardRef(RangeCalendar);
+_RangeCalendar.displayName = 'RangeCalendar';
 export { _RangeCalendar as RangeCalendar };
 
         

package/es/components/other/CloudLogo/CloudLogo.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
@@ -27,6 +27,7 @@ function CloudLogo(props, ref) {
     return (_jsxs(StyledLogoButton, { ...props, ref: ref, children: [_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "25", height: "36", viewBox: "0 0 25 27", "data-type": "image", children: [_jsx("path", { fill: "#ff6492", d: "M23.447 6.786 11.727 0v4.696l11.72 6.757V6.786Z" }), _jsx("path", { fill: "#141446", d: "M23.447 11.453 19.931 13.5l-8.206-4.743-4.689 2.7L3.52 9.559l8.207-4.863 11.72 6.757Z" }), _jsx("path", { fill: "#a14474", d: "M7.036 11.457 3.52 9.559v3.94l3.516-2.042Z" }), _jsx("path", { fill: "#141446", d: "M.003 20.213 11.725 13.5l11.722 6.713L11.725 27 .003 20.213Z" }), _jsx("path", { fill: "#ff6492", d: "m23.447 15.554-11.722-6.87V13.5l11.722 6.713v-4.659Z" }), _jsx("path", { fill: "#7a77ff", d: "M3.52 13.5V9.56l8.207-4.864V0L.003 6.786v13.427L11.725 13.5V8.684L3.52 13.5Z" })] }), _jsxs("svg", { width: "141", height: "27", viewBox: "0 0 141 27", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M12.7556 21.4555C15.323 21.4555 17.3322 20.1868 18.5322 18.2414L16.4671 16.6344C15.5462 17.9031 14.4021 18.7207 12.7835 18.7207C10.272 18.7207 8.48596 16.7753 8.48596 14.2097C8.48596 11.7005 10.272 9.72693 12.7835 9.72693C14.43 9.72693 15.5741 10.5727 16.4671 11.8414L18.5322 10.2062C17.3601 8.26086 15.3509 6.99214 12.7556 6.99214C8.70921 6.99214 5.5 10.1498 5.5 14.2097C5.5 18.2978 8.70921 21.4555 12.7556 21.4555Z", fill: "#141446" }), _jsx("path", { d: "M27.0647 21.4555C30.4135 21.4555 33.0088 19.0872 33.0088 15.3375V7.30227H30.0786V15.563C30.0786 17.5084 28.7391 18.7207 27.0647 18.7207C25.3346 18.7207 23.9672 17.5084 23.9672 15.563V7.30227H21.0649V15.3375C21.0649 19.0872 23.6602 21.4555 27.0647 21.4555Z", fill: "#141446" }), _jsx("path", { d: "M44.0683 6.99214C42.1707 6.99214 40.5243 7.72518 39.4917 8.99389V0.00012207H36.5616V21.1454H39.2964V19.2282C40.3289 20.6379 42.087 21.4555 44.0963 21.4555C47.9752 21.4555 50.7937 18.3542 50.7937 14.2379C50.7937 10.1216 47.9752 6.99214 44.0683 6.99214ZM43.5939 18.7489C41.5568 18.7489 39.4638 17.3956 39.4638 14.2379C39.4638 11.1084 41.5289 9.69873 43.5939 9.69873C45.9381 9.69873 47.7799 11.5313 47.7799 14.2097C47.7799 16.8881 45.966 18.7489 43.5939 18.7489Z", fill: "#141446" }), _jsx("path", { d: "M66.1661 13.3357C66.1661 9.69873 63.4871 6.99214 59.8314 6.99214C55.8408 6.99214 52.7433 10.178 52.7433 14.2379C52.7433 18.326 55.8688 21.4555 60.1105 21.4555C62.2872 21.4555 64.129 20.6097 65.5801 19.2282L64.1848 17.1982C63.0406 18.2132 61.7849 18.8335 60.1942 18.8335C57.8501 18.8335 56.1199 17.4802 55.7292 15.1965H65.9429C66.0266 14.83 66.1661 14.0969 66.1661 13.3357ZM59.7198 9.50138C61.5895 9.50138 63.1802 10.7137 63.236 12.8846H55.785C56.2315 10.8265 57.7943 9.50138 59.7198 9.50138Z", fill: "#141446" }), _jsx("path", { d: "M80.3867 21.4555C82.9541 21.4555 84.9634 20.1868 86.1633 18.2414L84.0983 16.6344C83.1774 17.9031 82.0332 18.7207 80.4147 18.7207C77.9031 18.7207 76.1171 16.7753 76.1171 14.2097C76.1171 11.7005 77.9031 9.72693 80.4147 9.72693C82.0611 9.72693 83.2053 10.5727 84.0983 11.8414L86.1633 10.2062C84.9913 8.26086 82.982 6.99214 80.3867 6.99214C76.3403 6.99214 73.1311 10.1498 73.1311 14.2097C73.1311 18.2978 76.3403 21.4555 80.3867 21.4555Z", fill: "#141446" }), _jsx("path", { d: "M88.8356 21.1454H91.7657V0.00012207H88.8356V21.1454Z", fill: "#141446" }), _jsx("path", { d: "M101.807 21.4555C105.882 21.4555 109.091 18.2414 109.091 14.2097C109.091 10.178 105.882 6.99214 101.807 6.99214C97.761 6.99214 94.5797 10.1498 94.5797 14.2097C94.5797 18.2414 97.761 21.4555 101.807 21.4555ZM101.807 18.7207C99.3795 18.7207 97.5656 16.8035 97.5656 14.2379C97.5656 11.6441 99.3795 9.69873 101.835 9.69873C104.235 9.69873 106.077 11.6441 106.077 14.2379C106.077 16.7753 104.235 18.7207 101.807 18.7207Z", fill: "#141446" }), _jsx("path", { d: "M117.752 21.4555C121.101 21.4555 123.696 19.0872 123.696 15.3375V7.30227H120.766V15.563C120.766 17.5084 119.427 18.7207 117.752 18.7207C116.022 18.7207 114.655 17.5084 114.655 15.563V7.30227H111.752V15.3375C111.752 19.0872 114.348 21.4555 117.752 21.4555Z", fill: "#141446" }), _jsx("path", { d: "M137.658 0.00012207V8.99389C136.626 7.72518 134.979 6.99214 133.082 6.99214C129.203 6.99214 126.384 10.1216 126.384 14.2379C126.384 18.3542 129.175 21.4555 133.082 21.4555C135.119 21.4555 136.877 20.6097 137.881 19.1718V21.1454H140.616V0.00012207H137.658ZM133.584 18.7489C131.184 18.7489 129.37 16.8881 129.37 14.2097C129.37 11.5313 131.212 9.69873 133.584 9.69873C135.621 9.69873 137.714 11.1084 137.714 14.2379C137.714 17.3956 135.621 18.7489 133.584 18.7489Z", fill: "#141446" })] })] }));
 }
 const _CloudLogo = forwardRef(CloudLogo);
+_CloudLogo.displayName = 'CloudLogo';
 export { _CloudLogo as CloudLogo };
 
         

package/es/components/overlays/AlertDialog/AlertDialog.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
@@ -51,6 +51,7 @@ function AlertDialog(props, ref) {
  * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.
  */
 const _AlertDialog = forwardRef(AlertDialog);
+_AlertDialog.displayName = 'AlertDialog';
 export { _AlertDialog as AlertDialog };
 
         

package/es/components/overlays/AlertDialog/AlertDialogApiProvider.js

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

package/es/components/overlays/AlertDialog/AlertDialogZone.js

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

package/es/components/overlays/AlertDialog/index.js

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

package/es/components/overlays/AlertDialog/types.js

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

package/es/components/overlays/Dialog/Dialog.js

@@ -1,14 +1,14 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useDOMRef } from '@react-spectrum/utils';
-import { DismissButton, FocusScope, useFocusManager } from 'react-aria';
-import { forwardRef, useEffect, useMemo, useState } from 'react';
+import { DismissButton } from 'react-aria';
+import { forwardRef, useEffect, useMemo } from 'react';
 import { useDialog, useMessageFormatter } from 'react-aria';
 import FocusLock from 'react-focus-lock';
 import { BASE_STYLES, BLOCK_STYLES, DIMENSION_STYLES, extractStyles, tasty, } from '../../../tasty';
@@ -59,7 +59,7 @@ const DialogElement = tasty({
             '[data-type="panel"]': 'auto',
         },
         placeSelf: 'stretch',
-        '@dialog-heading-padding-v': {
+        '@dialog-title-padding-v': {
             '': '2x',
             '[data-type="popover"]': '1x',
         },
@@ -86,6 +86,16 @@ const CLOSE_BUTTON_STYLES = {
     width: '5x',
     height: '5x',
     placeContent: 'center',
+    fill: {
+        '': '#dark.0',
+        hovered: '#dark.04',
+        pressed: '#dark.05',
+    },
+    color: {
+        '': '#dark-02',
+        hovered: '#dark-02',
+        pressed: '#purple',
+    },
 };
 const sizeMap = {
     S: 'small',
@@ -116,12 +126,11 @@ export const Dialog = forwardRef(function Dialog(props, ref) {
     }, [props, ref]);
     return (
     // This component is actually traps the focus inside the dialog.
-    _jsx(FocusLock, { returnFocus: true, disabled: !isEntered || context.type === 'panel', children: _jsx(FocusScope, { restoreFocus: true, children: content }) }));
+    _jsx(FocusLock, { returnFocus: true, autoFocus: false, disabled: !isEntered || context.type === 'panel', children: content }));
 });
 const DialogContent = forwardRef(function DialogContent(props, ref) {
     let { type = 'modal', ...contextProps } = useDialogContext();
     let { qa, children, size = 'S', isDismissable = contextProps.isDismissable, onDismiss = contextProps.onClose, closeIcon, closeButtonStyles, ...otherProps } = props;
-    const [isCloseDisabled, setIsCloseDisabled] = useState(true);
     size = sizeMap[size.toUpperCase()] || size;
     const styles = extractStyles(otherProps, STYLES_LIST);
     let formatMessage = useMessageFormatter(intlMessages);
@@ -133,23 +142,21 @@ const DialogContent = forwardRef(function DialogContent(props, ref) {
     if (type === 'popover' || type === 'tray') {
         dismissButton = _jsx(DismissButton, { onDismiss: onDismiss });
     }
-    const focusManager = useFocusManager();
     // Focus the first focusable element in the dialog when it opens
     useEffect(() => {
         if (contextProps.isOpen) {
             setTimeout(() => {
-                focusManager?.focusFirst();
-                setIsCloseDisabled(false);
+                if (domRef.current &&
+                    !domRef.current.contains(document.activeElement)) {
+                    domRef.current.querySelector('input[data-autofocus], [data-qa="ButtonGroup"] button[data-type="primary"]')?.focus();
+                }
             });
         }
-        else {
-            setIsCloseDisabled(true);
-        }
     }, [contextProps.isOpen]);
     // let hasHeader = useHasChild('[data-id="Header"]', domRef);
     // let hasFooter = useHasChild('[data-id="Footer"]', domRef);
     let slots = {
-        heading: {
+        title: {
             level: 2,
             preset: 'h4',
             ...titleProps,
@@ -173,7 +180,7 @@ const DialogContent = forwardRef(function DialogContent(props, ref) {
                 gap: '1x',
                 placeItems: 'baseline stretch',
                 placeContent: 'space-between',
-                padding: `@dialog-heading-padding-v ${isDismissable ? '(@dialog-padding-h + 4x)' : '@dialog-padding-h'} @dialog-heading-padding-v @dialog-padding-h`,
+                padding: `@dialog-title-padding-v ${isDismissable ? '(@dialog-padding-h + 4x)' : '@dialog-padding-h'} @dialog-title-padding-v @dialog-padding-h`,
                 border: 'bottom',
             },
         },
@@ -188,7 +195,7 @@ const DialogContent = forwardRef(function DialogContent(props, ref) {
             },
         },
     };
-    return (_jsxs(DialogElement, { ref: domRef, "data-id": "Dialog", "data-qa": qa || 'Dialog', styles: styles, as: "section", ...dialogProps, tabIndex: undefined, mods: { dismissable: isDismissable }, style: { '--dialog-size': `${sizePxMap[size] || 288}px` }, "data-type": type, "data-size": size, children: [dismissButton, _jsxs(SlotProvider, { slots: slots, children: [isDismissable && (_jsx(Button, { isDisabled: isCloseDisabled, qa: "ModalCloseButton", type: "neutral", styles: CLOSE_BUTTON_STYLES, icon: closeIcon || _jsx(CloseIcon, {}), label: formatMessage('dismiss'), onPress: () => onDismiss && onDismiss() })), children] })] }));
+    return (_jsxs(DialogElement, { ref: domRef, "data-id": "Dialog", "data-qa": qa || 'Dialog', styles: styles, as: "section", ...dialogProps, tabIndex: undefined, mods: { dismissable: isDismissable }, style: { '--dialog-size': `${sizePxMap[size] || 288}px` }, "data-type": type, "data-size": size, children: [dismissButton, _jsxs(SlotProvider, { slots: slots, children: [isDismissable && (_jsx(Button, { qa: "ModalCloseButton", type: "neutral", styles: CLOSE_BUTTON_STYLES, icon: closeIcon || _jsx(CloseIcon, {}), label: formatMessage('dismiss'), onPress: () => onDismiss && onDismiss() })), children] })] }));
 });
 
         

package/es/components/overlays/Dialog/DialogContainer.js

@@ -1,13 +1,13 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
+ * @cube-dev/ui-kit v0.58.0
  * Released under the MIT license.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Children, useRef, isValidElement, } from 'react';
-import { Modal } from '../Modal/Modal';
+import { Modal } from '../Modal';
 import { DialogContext } from './context';
 /**
  * A DialogContainer accepts a single Dialog as a child, and manages to show and hide
@@ -16,7 +16,7 @@ import { DialogContext } from './context';
  * or when the trigger unmounts while the dialog is open.
  */
 export function DialogContainer(props) {
-    const { children, type = 'modal', onDismiss, isDismissable, isKeyboardDismissDisabled, isOpen, } = props;
+    const { children, type = 'modal', onDismiss, isDismissable, isKeyboardDismissDisabled, isOpen, hideOnClose, } = props;
     const childArray = Children.toArray(children);
     if (childArray.length > 1) {
         throw new Error('Only a single child can be passed to DialogContainer.');
@@ -33,7 +33,7 @@ export function DialogContainer(props) {
         isDismissable,
         isOpen,
     };
-    return (_jsx(Modal, { isOpen: isActuallyOpened, type: type, isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, onClose: isDismissable ? onDismiss : undefined, children: _jsx(DialogContext.Provider, { value: context, children: child }) }));
+    return (_jsx(Modal, { isOpen: isActuallyOpened, type: type, hideOnClose: hideOnClose, isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, onClose: isDismissable ? onDismiss : undefined, children: _jsx(DialogContext.Provider, { value: context, children: child }) }));
 }
 
         

package/es/components/overlays/Dialog/DialogForm.js

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