@cube-dev/ui-kit 0.0.0-canary-423c3d2 → 0.0.0-canary-ed2a55b

package/cjs/components/pickers/Select/Select.js

@@ -1,11 +1,14 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = exports.ListBoxPopup = void 0;
 const react_1 = require("react");
@@ -22,117 +25,127 @@ const overlays_1 = require("@react-aria/overlays");
 const Form_1 = require("../../forms/Form/Form");
 const interactions_1 = require("@react-aria/interactions");
 const provider_1 = require("../../../provider");
-const Base_1 = require("../../Base");
 const tasty_1 = require("../../../tasty");
 const interactions_2 = require("../../../utils/react/interactions");
 const FieldWrapper_1 = require("../../forms/FieldWrapper");
 const collections_1 = require("@react-stately/collections");
 const OverlayWrapper_1 = require("../../overlays/OverlayWrapper");
 const transitions_1 = require("../../../utils/transitions");
-const StyleProvider_1 = require("../../../providers/StyleProvider");
+const styled_components_1 = __importDefault(require("styled-components"));
 const CaretDownIcon = () => ((0, jsx_runtime_1.jsx)("svg", { "aria-hidden": "true", width: "14", height: "14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M11.49 4.102H2.51c-.269 0-.42.284-.253.478l4.49 5.206a.342.342 0 00.506 0l4.49-5.206c.167-.194.016-.478-.253-.478z", fill: "currentColor" }, void 0) }, void 0));
-const SELECT_STYLES = {
-    display: 'grid',
-    position: 'relative',
-};
-const INPUT_STYLES = {
-    display: 'grid',
-    flow: 'column',
-    gridColumns: {
-        '': '1fr auto',
-        'with-prefix': 'auto 1fr auto',
-    },
-    placeItems: 'center stretch',
-    placeContent: 'center stretch',
-    gap: '1x',
-    padding: {
-        '': '(1.25x - 1bw) 1x (1.25x - 1bw) (1.5x - 1bw)',
-        '[data-size="small"]': '(.75x - 1px) 1x (.75x - 1px)  (1.5x - 1px)',
+const SelectWrapperElement = (0, tasty_1.tasty)({
+    styles: {
+        display: 'grid',
+        position: 'relative',
     },
-    border: {
-        '': true,
-        invalid: '#danger-text.50',
-        valid: '#success-text.50',
-        focused: true,
+});
+const SelectElement = (0, tasty_1.tasty)({
+    as: 'button',
+    qa: 'Button',
+    styles: {
+        display: 'grid',
+        flow: 'column',
+        gridColumns: {
+            '': '1fr auto',
+            'with-prefix': 'auto 1fr auto',
+        },
+        placeItems: 'center stretch',
+        placeContent: 'center stretch',
+        gap: '1x',
+        padding: {
+            '': '(1.25x - 1bw) 1x (1.25x - 1bw) (1.5x - 1bw)',
+            '[data-size="small"]': '(.75x - 1px) 1x (.75x - 1px)  (1.5x - 1px)',
+        },
+        border: {
+            '': true,
+            invalid: '#danger-text.50',
+            valid: '#success-text.50',
+            focused: true,
+        },
+        radius: true,
+        reset: 'input',
+        preset: 'default',
+        outline: {
+            '': '#purple-03.0',
+            focused: '#purple-03',
+        },
+        color: {
+            '': '#dark.85',
+            invalid: '#danger-text',
+            focused: '#dark.85',
+            disabled: '#dark.30',
+        },
+        fill: {
+            '': '#purple.0',
+            hovered: '#dark.04',
+            pressed: '#dark.08',
+            disabled: '#dark.04',
+        },
+        fontWeight: 400,
+        textAlign: 'left',
+        cursor: 'pointer',
+        transition: 'theme',
     },
-    radius: true,
-    reset: 'input',
-    preset: 'default',
-    outline: {
-        '': '#purple-03.0',
-        focused: '#purple-03',
+});
+const ListBoxElement = (0, tasty_1.tasty)({
+    as: 'ul',
+    styles: {
+        display: 'flex',
+        gap: '.5x',
+        flow: 'column',
+        margin: '0',
+        padding: '.5x',
+        listStyle: 'none',
+        radius: true,
+        fill: '#white',
+        shadow: '0px 4px 16px #shadow',
+        height: 'initial 30x',
+        overflow: 'hidden auto',
+        styledScrollbar: true,
     },
-    color: {
-        '': '#dark.85',
-        invalid: '#danger-text',
-        focused: '#dark.85',
-        disabled: '#dark.30',
+});
+const OptionElement = (0, tasty_1.tasty)({
+    as: 'li',
+    styles: {
+        display: 'block',
+        padding: '(1x - 1px) (1.5x - 1px)',
+        cursor: 'pointer',
+        radius: true,
+        fill: {
+            '': '#white',
+            focused: '#dark.04',
+            selected: '#purple',
+            'focused & selected': '#purple-text',
+            disabled: '#dark.04',
+        },
+        color: {
+            '': '#dark.85',
+            selected: '#white',
+            disabled: '#dark.30',
+        },
+        preset: 't3m',
+        transition: 'theme',
     },
-    fill: {
-        '': '#purple.0',
-        hovered: '#dark.04',
-        pressed: '#dark.08',
-        disabled: '#dark.04',
+});
+const OverlayElement = (0, tasty_1.tasty)({
+    styles: {
+        position: 'absolute',
+        width: 'min @overlay-min-width',
     },
-    fontWeight: 400,
-    textAlign: 'left',
-    cursor: 'pointer',
-    transition: 'theme',
-};
-const OVERLAY_STYLES = {
-    position: 'absolute',
-};
-const LISTBOX_STYLES = {
-    display: 'flex',
-    gap: '.5x',
-    flow: 'column',
-    margin: '0',
-    padding: '.5x',
-    listStyle: 'none',
-    radius: true,
-    fill: '#white',
-    shadow: '0px 4px 16px #shadow',
-    height: 'initial 30x',
-    overflow: 'hidden auto',
-    styledScrollbar: true,
-};
-const OPTION_STYLES = {
-    display: 'block',
-    padding: '(1x - 1px) (1.5x - 1px)',
-    cursor: 'pointer',
-    radius: true,
-    fill: {
-        '': '#white',
-        focused: '#dark.04',
-        selected: '#purple',
-        'focused & selected': '#purple-text',
-        disabled: '#dark.04',
-    },
-    color: {
-        '': '#dark.85',
-        selected: '#white',
-        disabled: '#dark.30',
-    },
-    preset: 't3m',
-};
+});
+const StyledOverlayElement = (0, styled_components_1.default)(OverlayElement) `
+  ${(props) => {
+    return (0, transitions_1.getOverlayTransitionCSS)({ placement: props === null || props === void 0 ? void 0 : props['data-position'] });
+}}
+`;
 function Select(props, ref) {
     var _a;
     props = (0, provider_1.useProviderProps)(props);
     props = (0, Form_1.useFormProps)(props);
     let { qa, label, extra, labelPosition = 'top', labelStyles, isRequired, necessityIndicator, validationState, prefix, isDisabled, autoFocus, inputProps, triggerRef, popoverRef, listBoxRef, isLoading, loadingIndicator, overlayOffset = 8, inputStyles, optionStyles, suffix, listBoxStyles, overlayStyles, message, description, direction = 'bottom', shouldFlip = true, requiredMark = true, placeholder, tooltip, size, styles, ...otherProps } = props;
     let state = (0, select_1.useSelectState)(props);
-    const outerStyles = (0, tasty_1.extractStyles)(otherProps, tasty_1.OUTER_STYLES, {
-        ...SELECT_STYLES,
-        ...(0, StyleProvider_1.useContextStyles)('Select_Wrapper', otherProps),
-        ...styles,
-    });
-    inputStyles = (0, tasty_1.extractStyles)(otherProps, tasty_1.BLOCK_STYLES, {
-        ...INPUT_STYLES,
-        ...(0, StyleProvider_1.useContextStyles)('Select', otherProps),
-        ...inputStyles,
-    });
-    if (styles) {
-    }
+    const outerStyles = (0, tasty_1.extractStyles)(otherProps, tasty_1.OUTER_STYLES, styles);
+    inputStyles = (0, tasty_1.extractStyles)(otherProps, tasty_1.BLOCK_STYLES, inputStyles);
     ref = (0, react_2.useCombinedRefs)(ref);
     triggerRef = (0, react_2.useCombinedRefs)(triggerRef);
     popoverRef = (0, react_2.useCombinedRefs)(popoverRef);
@@ -157,20 +170,22 @@ function Select(props, ref) {
     let validationIcon = isInvalid ? ((0, jsx_runtime_1.jsx)(icons_1.WarningOutlined, { style: { color: 'var(--danger-color)' } }, void 0)) : ((0, jsx_runtime_1.jsx)(icons_1.CheckOutlined, { style: { color: 'var(--success-color)' } }, void 0));
     let validation = (0, react_3.cloneElement)(validationIcon);
     let triggerWidth = (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth;
-    let selectField = ((0, jsx_runtime_1.jsxs)(Base_1.Base, { qa: "SelectWrapper", mods: {
+    let selectField = ((0, jsx_runtime_1.jsxs)(SelectWrapperElement, { qa: qa || 'Select', mods: {
             invalid: isInvalid,
             valid: validationState === 'valid',
             disabled: isDisabled,
             hovered: isHovered,
             focused: isFocused,
-        }, styles: outerStyles, "data-size": size, children: [(0, jsx_runtime_1.jsx)(select_2.HiddenSelect, { state: state, triggerRef: triggerRef, label: props.label, name: props.name }, void 0), (0, jsx_runtime_1.jsxs)(Base_1.Base, { qa: qa || 'Select', as: "button", ...(0, react_2.mergeProps)(buttonProps, hoverProps, focusProps), ref: triggerRef, styles: inputStyles, "data-size": size, mods: {
+        }, styles: outerStyles, "data-size": size, children: [(0, jsx_runtime_1.jsx)(select_2.HiddenSelect, { state: state, triggerRef: triggerRef, label: props.label, name: props.name }, void 0), (0, jsx_runtime_1.jsxs)(SelectElement, { ...(0, react_2.mergeProps)(buttonProps, hoverProps, focusProps), ref: triggerRef, styles: inputStyles, "data-size": size, mods: {
                     invalid: isInvalid,
                     valid: validationState === 'valid',
                     disabled: isDisabled,
                     hovered: isHovered,
                     focused: isFocused,
                     'with-prefix': !!prefix,
-                }, children: [prefix, (0, jsx_runtime_1.jsx)("span", { ...valueProps, children: state.selectedItem ? state.selectedItem.rendered : placeholder }, void 0), (validationState || isLoading || suffix) && ((0, jsx_runtime_1.jsxs)("div", { children: [validationState && !isLoading ? validation : null, isLoading && (0, jsx_runtime_1.jsx)(icons_1.LoadingOutlined, {}, void 0), suffix] }, void 0)), (0, jsx_runtime_1.jsx)(CaretDownIcon, {}, void 0)] }, void 0), (0, jsx_runtime_1.jsx)(OverlayWrapper_1.OverlayWrapper, { isOpen: state.isOpen && !isDisabled, children: (0, jsx_runtime_1.jsx)(ListBoxPopup, { ...menuProps, popoverRef: popoverRef, listBoxRef: listBoxRef, overlayProps: overlayProps, placement: placement, state: state, listBoxStyles: listBoxStyles, overlayStyles: overlayStyles, optionStyles: optionStyles, minWidth: triggerWidth }, void 0) }, void 0)] }, void 0));
+                }, children: [prefix, (0, jsx_runtime_1.jsx)("span", { ...valueProps, children: state.selectedItem
+                            ? state.selectedItem.rendered
+                            : placeholder || (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "\u00A0" }, void 0) }, void 0), (validationState || isLoading || suffix) && ((0, jsx_runtime_1.jsxs)("div", { children: [validationState && !isLoading ? validation : null, isLoading && (0, jsx_runtime_1.jsx)(icons_1.LoadingOutlined, {}, void 0), suffix] }, void 0)), (0, jsx_runtime_1.jsx)(CaretDownIcon, {}, void 0)] }, void 0), (0, jsx_runtime_1.jsx)(OverlayWrapper_1.OverlayWrapper, { isOpen: state.isOpen && !isDisabled, children: (0, jsx_runtime_1.jsx)(ListBoxPopup, { ...menuProps, popoverRef: popoverRef, listBoxRef: listBoxRef, overlayProps: overlayProps, placement: placement, state: state, listBoxStyles: listBoxStyles, overlayStyles: overlayStyles, optionStyles: optionStyles, minWidth: triggerWidth }, void 0) }, void 0)] }, void 0));
     return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { ...{
             labelPosition,
             label,
@@ -197,11 +212,6 @@ function ListBoxPopup({ state, popoverRef, listBoxRef, listBoxStyles, overlaySty
         shouldUseVirtualFocus,
         ...otherProps,
     }, state, listBoxRef);
-    listBoxStyles = {
-        ...LISTBOX_STYLES,
-        ...(0, StyleProvider_1.useContextStyles)('ListBoxPopup'),
-        ...listBoxStyles,
-    };
     // Handle events that should cause the popup to close,
     // e.g. blur, clicking outside, or pressing the escape key.
     let { overlayProps } = (0, overlays_1.useOverlay)({
@@ -214,11 +224,10 @@ function ListBoxPopup({ state, popoverRef, listBoxRef, listBoxStyles, overlaySty
     // trigger when the popup is closed. In addition, add hidden
     // <DismissButton> components at the start and end of the list
     // to allow screen reader users to dismiss the popup easily.
-    return ((0, jsx_runtime_1.jsx)(Base_1.Base, { styles: {
-            minWidth: minWidth ? `${minWidth}px` : 'initial',
-            ...OVERLAY_STYLES,
-            overlayStyles,
-        }, ...parentOverlayProps, ...overlayProps, css: (0, transitions_1.getOverlayTransitionCSS)({ placement }), "data-position": placement, ref: popoverRef, children: (0, jsx_runtime_1.jsxs)(focus_1.FocusScope, { restoreFocus: true, children: [(0, jsx_runtime_1.jsx)(overlays_1.DismissButton, { onDismiss: () => state.close() }, void 0), (0, jsx_runtime_1.jsx)(Base_1.Base, { as: "ul", styles: listBoxStyles, ...(0, react_2.mergeProps)(listBoxProps, otherProps), ref: listBoxRef, children: Array.from(state.collection).map((item) => ((0, jsx_runtime_1.jsx)(Option, { item: item, state: state, styles: optionStyles, shouldUseVirtualFocus: shouldUseVirtualFocus }, item.key))) }, void 0), (0, jsx_runtime_1.jsx)(overlays_1.DismissButton, { onDismiss: () => state.close() }, void 0)] }, void 0) }, void 0));
+    return ((0, jsx_runtime_1.jsx)(StyledOverlayElement, { ...overlayProps, ...parentOverlayProps, styles: overlayStyles, style: {
+            '--overlay-min-width': minWidth ? `${minWidth}px` : 'initial',
+            ...parentOverlayProps === null || parentOverlayProps === void 0 ? void 0 : parentOverlayProps.style,
+        }, "data-position": placement, ref: popoverRef, children: (0, jsx_runtime_1.jsxs)(focus_1.FocusScope, { restoreFocus: true, children: [(0, jsx_runtime_1.jsx)(overlays_1.DismissButton, { onDismiss: () => state.close() }, void 0), (0, jsx_runtime_1.jsx)(ListBoxElement, { styles: listBoxStyles, ...(0, react_2.mergeProps)(listBoxProps, otherProps), ref: listBoxRef, children: Array.from(state.collection).map((item) => ((0, jsx_runtime_1.jsx)(Option, { item: item, state: state, styles: optionStyles, shouldUseVirtualFocus: shouldUseVirtualFocus }, item.key))) }, void 0), (0, jsx_runtime_1.jsx)(overlays_1.DismissButton, { onDismiss: () => state.close() }, void 0)] }, void 0) }, void 0));
 }
 exports.ListBoxPopup = ListBoxPopup;
 function Option({ item, state, styles, shouldUseVirtualFocus }) {
@@ -226,11 +235,6 @@ function Option({ item, state, styles, shouldUseVirtualFocus }) {
     let isDisabled = state.disabledKeys.has(item.key);
     let isSelected = state.selectionManager.isSelected(item.key);
     let isVirtualFocused = state.selectionManager.focusedKey === item.key;
-    styles = {
-        ...OPTION_STYLES,
-        ...(0, StyleProvider_1.useContextStyles)('Option'),
-        ...styles,
-    };
     let { optionProps } = (0, listbox_1.useOption)({
         key: item.key,
         isDisabled,
@@ -243,7 +247,7 @@ function Option({ item, state, styles, shouldUseVirtualFocus }) {
     // style to the focused option
     let [isFocused, setFocused] = (0, react_3.useState)(false);
     let { focusProps } = (0, interactions_1.useFocus)({ onFocusChange: setFocused });
-    return ((0, react_1.createElement)(Base_1.Base, { as: "li", ...(0, react_2.mergeProps)(optionProps, focusProps), ref: ref, mods: {
+    return ((0, react_1.createElement)(OptionElement, { ...(0, react_2.mergeProps)(optionProps, focusProps), ref: ref, mods: {
             selected: isSelected,
             focused: shouldUseVirtualFocus ? isVirtualFocused : isFocused,
             disabled: isDisabled,

package/cjs/components/portal/Portal.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/PortalProvider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/storybook/templates/CustomRoot.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/storybook/templates/PortalOrder.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/storybook/templates/basic.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/storybook/templates/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/types.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/portal/usePortal.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/components/status/LoadingAnimation/LoadingAnimation.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -20,11 +20,11 @@ const POSITIONS = [
     [49, 49],
     [98, 25],
 ];
-const cubeImage = 'data:image/svg+xml,%3Csvg width=\'36\' height=\'41\' fill=\'none\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cpath d=\'M35.899 10.351l-18 10.25L.1 10.25l18-10.25L35.9 10.351z\' fill=\'%23FAFAFF\'/%3E%3Cpath d=\'M18 41L0 30.75l.101-20.5L18 20.5\' fill=\'%23E5E5F6\'/%3E%3Cpath d=\'M36 30.75L18 41V20.6l17.899-10.25L36 30.75z\' fill=\'%23C0C0EA\'/%3E%3C/svg%3E';
+const cubeImage = "data:image/svg+xml,%3Csvg width='36' height='41' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M35.899 10.351l-18 10.25L.1 10.25l18-10.25L35.9 10.351z' fill='%23FAFAFF'/%3E%3Cpath d='M18 41L0 30.75l.101-20.5L18 20.5' fill='%23E5E5F6'/%3E%3Cpath d='M36 30.75L18 41V20.6l17.899-10.25L36 30.75z' fill='%23C0C0EA'/%3E%3C/svg%3E";
 function pos(index) {
     return `transform: translate(${POSITIONS[index][0]}%, ${POSITIONS[index][1]}%);`;
 }
-const RawImg = styled_components_1.default.img(({ index }) => `
+const ImgElement = styled_components_1.default.img(({ index }) => `
   display: block;
   position: absolute;
   width: 50%;
@@ -123,7 +123,7 @@ const RawImg = styled_components_1.default.img(({ index }) => `
     : ''}
 `);
 const Cube = (props) => {
-    return (0, jsx_runtime_1.jsx)(RawImg, { role: "presentation", src: cubeImage, alt: "", ...props }, void 0);
+    return (0, jsx_runtime_1.jsx)(ImgElement, { role: "presentation", src: cubeImage, alt: "", ...props }, void 0);
 };
 const SIZE_MAP = {
     small: 32,

package/cjs/components/status/Spin/Spin.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -21,7 +21,7 @@ const Spin = ({ size, spinning, style, children, ...props }, ref) => {
     if (spinning === false) {
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children }, void 0);
     }
-    return ((0, jsx_runtime_1.jsx)(Block_1.Block, { ref: ref, role: "img", "aria-label": "Loading animation", height: "1em", opacity: ".8", style: {
+    return ((0, jsx_runtime_1.jsx)(Block_1.Block, { ref: ref, role: "img", "aria-label": "Loading animation", height: "1em 1em", opacity: ".8", style: {
             fontSize: localSize * 8,
             position: 'relative',
             ...(style || {}),

package/cjs/data/themes.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/provider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/providers/StyleProvider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/services/notification.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/shared/form.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/shared/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/stories/FormFieldArgs.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/stories/components/ConfirmDeletionDialogForm.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/stories/components/DialogFormApp.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/stories/components/StyledButton.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/stories/lists/baseProps.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/styled/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/styled/styled.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/tasty/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -17,9 +17,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.tasty = void 0;
+exports.Element = exports.tasty = void 0;
 var tasty_1 = require("./tasty");
 Object.defineProperty(exports, "tasty", { enumerable: true, get: function () { return tasty_1.tasty; } });
+Object.defineProperty(exports, "Element", { enumerable: true, get: function () { return tasty_1.Element; } });
 __exportStar(require("./utils/filterBaseProps"), exports);
 __exportStar(require("./utils/colors"), exports);
 __exportStar(require("./utils/styles"), exports);

package/cjs/tasty/providers/BreakpointsProvider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/tasty/styles/align.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/cjs/tasty/styles/border.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */