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

package/es/components/content/Card/Card.js

@@ -1,26 +1,28 @@
 /**
  * @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.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import { Base } from '../../Base';
-import { CONTAINER_STYLES, extractStyles, filterBaseProps, } from '../../../tasty';
-const DEFAULT_STYLES = {
-    display: 'block',
-    flow: 'column',
-    radius: '1r',
-    fill: '#white',
-    border: true,
-    padding: '1.5x',
-    preset: 't3',
-};
+import { CONTAINER_STYLES, filterBaseProps, tasty, } from '../../../tasty';
+const CardElement = tasty({
+    role: 'region',
+    styles: {
+        display: 'block',
+        flow: 'column',
+        radius: '1r',
+        fill: '#white',
+        border: true,
+        padding: '1.5x',
+        preset: 't3',
+    },
+    styleProps: CONTAINER_STYLES,
+});
 export const Card = forwardRef((props, ref) => {
-    const styles = extractStyles(props, CONTAINER_STYLES, DEFAULT_STYLES);
-    return (_jsx(Base, { role: "region", ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    return (_jsx(CardElement, { ...filterBaseProps(props, { eventProps: true }), styles: props.styles, ref: ref }, void 0));
 });
 
         

package/es/components/content/Content.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.
  */
 
@@ -10,7 +10,7 @@ import { forwardRef } from 'react';
 import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, TEXT_STYLES, } from '../../tasty';
 import { useSlotProps } from '../../utils/react';
 const STYLE_LIST = [...CONTAINER_STYLES, ...TEXT_STYLES];
-const RawContent = tasty({
+const ContentElement = tasty({
     qa: 'Content',
     as: 'section',
     styles: {
@@ -27,7 +27,7 @@ const RawContent = tasty({
 export const Content = forwardRef((props, ref) => {
     props = useSlotProps(props, 'content');
     const styles = extractStyles(props, STYLE_LIST);
-    return (_jsx(RawContent, { ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    return (_jsx(ContentElement, { ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
 });
 
         

package/es/components/content/CopySnippet/CopySnippet.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.
  */
 
@@ -9,19 +9,19 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import copy from 'clipboard-copy';
 import { Action, Button } from '../../actions';
 import { Card } from '../Card/Card';
-import { Grid } from '../../layout/Grid';
 import { tasty } from '../../../tasty';
 import { PrismCode, } from '../../content/PrismCode/PrismCode';
 import { notification } from '../../../services/notification';
 import { CopyOutlined } from '@ant-design/icons';
 import { TooltipTrigger } from '../../overlays/Tooltip/TooltipTrigger';
 import { Tooltip } from '../../overlays/Tooltip/Tooltip';
-const POSITION_ACTION = {
-    position: 'absolute',
-    right: 0,
-    top: 0,
-    zIndex: 1,
-};
+const ActionElement = tasty(Action, {
+    styles: {
+        display: 'block',
+        cursor: 'default',
+        width: '100%',
+    },
+});
 const StyledBlock = tasty({
     styles: {
         position: 'relative',
@@ -61,6 +61,49 @@ const ButtonContainer = tasty({
         },
     },
 });
+const CopySnippetElement = tasty(Card, {
+    qa: 'CopySnippet',
+    styles: {
+        fill: '#grey-light',
+        radius: '1r',
+        border: 0,
+        padding: 0,
+        Grid: {
+            display: 'grid',
+            flow: 'row',
+            gridColumns: 'minmax(0, 1fr) 5x',
+            width: 'min 20x',
+            radius: '1r',
+            position: 'relative',
+            overflow: 'hidden',
+        },
+    },
+});
+const CopyButton = tasty(Button, {
+    type: 'clear',
+    icon: _jsx(CopyOutlined, {}, void 0),
+    styles: {
+        padding: '1x 1.5x',
+        fontWeight: 500,
+        radius: {
+            '': '0 1r 1r 0',
+            'multiline | with-scroll': '0 1r',
+        },
+        placeSelf: {
+            '': 'none',
+            '!multiline & !with-scroll': 'stretch',
+        },
+        border: '#clear',
+        outline: {
+            '': '#purple-03.0',
+            'focused & focus-visible': '#purple-03 inset',
+        },
+        position: 'absolute',
+        right: 0,
+        top: 0,
+        zIndex: 1,
+    },
+});
 export function CopySnippet(allProps) {
     let { code, title, nowrap, prefix, language, showScroll = true, serif, children, padding, showOverlay = true, showTooltip = false, styles, ...props } = allProps;
     padding = padding || '1.125x 1.5x';
@@ -79,24 +122,17 @@ export function CopySnippet(allProps) {
         preset: 'default',
         ...styles,
     };
-    const Snippet = (_jsx(Card, { "data-qa": "CopySnippet", fill: "#grey-light", radius: "1r", border: 0, padding: 0, styles: styles, ...props, children: _jsxs(Grid, { columns: "minmax(0, 1fr) 5x", width: "min 20x", radius: "1r", style: { position: 'relative', overflow: 'hidden' }, children: [_jsx(StyledBlock, { mods: {
+    const Snippet = (_jsx(CopySnippetElement, { styles: styles, ...props, children: _jsxs("div", { "data-element": "Grid", children: [_jsx(StyledBlock, { mods: {
                         nowrap,
                         multiline,
                         scroll: showScroll,
                         serif,
-                    }, styles: { padding }, children: _jsx(PrismCode, { style: { margin: 0, overflow: 'visible' }, code: formattedCode, language: language || 'javascript' }, void 0) }, void 0), _jsx(ButtonContainer, { styles: { padding }, mods: { overlay: showOverlay } }, void 0), _jsx(Button, { label: `Copy ${codeTitle}`, type: "clear", styles: {
-                        padding: '1x 1.5x',
-                        fontWeight: 500,
-                        radius: multiline || showScroll ? '0 1r' : '0 1r 1r 0',
-                        placeSelf: !multiline && !showScroll ? 'stretch' : 'none',
-                        border: '#clear',
-                        outline: {
-                            '': '#purple-03.0',
-                            'focused & focus-visible': '#purple-03 inset',
-                        },
-                    }, style: POSITION_ACTION, onPress: onCopy, icon: _jsx(CopyOutlined, {}, void 0) }, void 0)] }, void 0) }, void 0));
+                    }, styles: { padding }, children: _jsx(PrismCode, { style: { margin: 0, overflow: 'visible' }, code: formattedCode, language: language || 'javascript' }, void 0) }, void 0), _jsx(ButtonContainer, { styles: { padding }, mods: { overlay: showOverlay }, children: _jsx(CopyButton, { label: `Copy ${codeTitle}`, mods: {
+                            multiline,
+                            'with-scroll': showScroll,
+                        }, onPress: onCopy }, void 0) }, void 0)] }, void 0) }, void 0));
     if (showTooltip) {
-        return (_jsxs(TooltipTrigger, { children: [_jsx(Action, { styles: { display: 'block', cursor: 'default', width: '100%' }, children: Snippet }, void 0), _jsx(Tooltip, { children: formattedCode }, void 0)] }, void 0));
+        return (_jsxs(TooltipTrigger, { children: [_jsx(ActionElement, { children: Snippet }, void 0), _jsx(Tooltip, { children: formattedCode }, void 0)] }, void 0));
     }
     return Snippet;
 }

package/es/components/content/CopySnippet/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/es/components/content/Divider.js

@@ -1,48 +1,48 @@
 /**
  * @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.
  */
 
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import { Base } from '../Base';
-import { BASE_STYLES, COLOR_STYLES, extractStyles, filterBaseProps, OUTER_STYLES, } from '../../tasty';
+import { BASE_STYLES, COLOR_STYLES, filterBaseProps, OUTER_STYLES, tasty, } from '../../tasty';
 import { useSlotProps } from '../../utils/react';
-const STYLE_LIST = [...OUTER_STYLES, ...BASE_STYLES, ...COLOR_STYLES];
-const DEFAULT_STYLES = {
-    gridArea: 'divider',
-    display: {
-        '': 'block',
-        text: 'grid',
+const DividerElement = tasty({
+    styles: {
+        gridArea: 'divider',
+        display: {
+            '': 'block',
+            text: 'grid',
+        },
+        gridColumns: '1fr auto 1fr',
+        placeItems: 'center stretch',
+        gap: '1x',
+        preset: 'c1',
+        height: {
+            '': '1bw 1bw',
+            text: 'auto',
+        },
+        fill: {
+            '': '#border',
+            text: 'none',
+        },
+        border: '0',
+        margin: '0',
+        Line: {
+            height: '1bw 1bw',
+            fill: '#border',
+        },
     },
-    gridColumns: '1fr auto 1fr',
-    placeItems: 'center stretch',
-    gap: '1x',
-    preset: 'c1',
-    height: {
-        '': '1bw 1bw',
-        text: 'auto',
-    },
-    fill: {
-        '': '#border',
-        text: 'none',
-    },
-    border: '0',
-    margin: '0',
-    Line: {
-        height: '1bw 1bw',
-        fill: '#border',
-    },
-};
+    styleProps: [...OUTER_STYLES, ...BASE_STYLES, ...COLOR_STYLES],
+});
 export const Divider = forwardRef((props, ref) => {
-    const { mods, children, ...otherProps } = useSlotProps(props, 'divider');
-    const styles = extractStyles(otherProps, STYLE_LIST, DEFAULT_STYLES);
-    return (_jsx(Base, { as: children ? 'div' : 'hr', role: children ? 'separator' : undefined, mods: {
+    const { mods, children, styles, ...otherProps } = useSlotProps(props, 'divider');
+    return (_jsx(DividerElement, { as: children ? 'div' : 'hr', role: children ? 'separator' : undefined, mods: {
             text: !!children,
             ...mods,
-        }, "data-id": "Divider", ...filterBaseProps(otherProps, { eventProps: true }), styles: styles, ref: ref, children: children && (_jsxs(_Fragment, { children: [_jsx("div", { "data-element": "Line" }, void 0), _jsx("div", { children: children }, void 0), _jsx("div", { "data-element": "Line" }, void 0)] }, void 0)) }, void 0));
+        }, ...filterBaseProps(otherProps, { eventProps: true }), styles: styles, ref: ref, children: children && (_jsxs(_Fragment, { children: [_jsx("div", { "data-element": "Line" }, void 0), _jsx("div", { children: children }, void 0), _jsx("div", { "data-element": "Line" }, void 0)] }, void 0)) }, void 0));
 });
 
         

package/es/components/content/Footer.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.
  */
 
@@ -10,7 +10,7 @@ import { forwardRef } from 'react';
 import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, TEXT_STYLES, } from '../../tasty';
 import { useSlotProps } from '../../utils/react';
 const STYLE_LIST = [...CONTAINER_STYLES, ...TEXT_STYLES];
-const RawFooter = tasty({
+const FooterElement = tasty({
     qa: 'Footer',
     'data-id': 'Footer',
     styles: {
@@ -22,7 +22,7 @@ const RawFooter = tasty({
 export const Footer = forwardRef((props, ref) => {
     props = useSlotProps(props, 'footer');
     const styles = extractStyles(props, STYLE_LIST);
-    return (_jsx(RawFooter, { ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    return (_jsx(FooterElement, { ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
 });
 
         

package/es/components/content/Header.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.
  */
 
@@ -10,7 +10,7 @@ import { forwardRef } from 'react';
 import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, TEXT_STYLES, } from '../../tasty';
 import { useSlotProps } from '../../utils/react';
 const STYLE_LIST = [...CONTAINER_STYLES, ...TEXT_STYLES];
-const RawHeader = tasty({
+const HeaderElement = tasty({
     qa: 'Header',
     as: 'header',
     styles: {
@@ -22,7 +22,7 @@ const RawHeader = tasty({
 export const Header = forwardRef((props, ref) => {
     props = useSlotProps(props, 'header');
     const styles = extractStyles(props, STYLE_LIST);
-    return (_jsx(RawHeader, { ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    return (_jsx(HeaderElement, { ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
 });
 
         

package/es/components/content/Paragraph.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/es/components/content/Placeholder/Placeholder.js

@@ -1,27 +1,42 @@
 /**
  * @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.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import { Base } from '../../Base';
-import { CONTAINER_STYLES, extractStyles, filterBaseProps, } from '../../../tasty';
-const DEFAULT_STYLES = {
-    display: 'block',
-    fill: '#dark.10',
-    height: '2x',
-    opacity: '.35',
-};
-const CSS = `
+import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, } from '../../../tasty';
+import styled from 'styled-components';
+const PlaceholderElement = tasty({
+    role: 'alert',
+    'aria-live': 'polite',
+    'aria-label': 'Content is loading',
+    styles: {
+        display: 'block',
+        fill: '#dark.10',
+        height: '2x',
+        opacity: '.35',
+    },
+});
+const StyledPlaceholder = styled(PlaceholderElement) `
   --placeholder-animation-time: 1.4s;
   --placeholder-animation-size: calc((180rem + 100vw) / 3);
-  background-image: linear-gradient(135deg, rgba(var(--dark-color-rgb), .15) 0%, rgba(var(--dark-color-rgb), .15) 5%, rgba(var(--dark-color-rgb), 0) 35%, rgba(var(--dark-03-color-rgb), .2) 50%, rgba(var(--dark-03-color-rgb), 0) 65%, rgba(var(--dark-color-rgb), .15) 95%, rgba(var(--dark-color-rgb), .15) 100%);
+  background-image: linear-gradient(
+    135deg,
+    rgba(var(--dark-color-rgb), 0.15) 0%,
+    rgba(var(--dark-color-rgb), 0.15) 5%,
+    rgba(var(--dark-color-rgb), 0) 35%,
+    rgba(var(--dark-03-color-rgb), 0.2) 50%,
+    rgba(var(--dark-03-color-rgb), 0) 65%,
+    rgba(var(--dark-color-rgb), 0.15) 95%,
+    rgba(var(--dark-color-rgb), 0.15) 100%
+  );
   background-repeat: repeat;
   background-size: var(--placeholder-animation-size);
-  animation: placeholder-animation var(--placeholder-animation-time) linear infinite;
+  animation: placeholder-animation var(--placeholder-animation-time) linear
+    infinite;
 
   @keyframes placeholder-animation {
     0% {
@@ -34,13 +49,13 @@ const CSS = `
 `;
 export const Placeholder = forwardRef((allProps, ref) => {
     let { size = '2x', circle, ...props } = allProps;
-    const styles = extractStyles(props, CONTAINER_STYLES, {
-        ...DEFAULT_STYLES,
-        height: size,
-        width: circle ? size : false,
-        radius: circle ? '9999rem' : '1r',
-    });
-    return (_jsx(Base, { role: "region", css: CSS, ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    let styles = extractStyles(props, CONTAINER_STYLES);
+    return (_jsx(StyledPlaceholder, { role: "region", ...filterBaseProps(props, { eventProps: true }), styles: {
+            height: size,
+            width: circle ? size : false,
+            radius: circle ? '9999rem' : '1r',
+            ...styles,
+        }, ref: ref }, void 0));
 });
 
         

package/es/components/content/PrismCode/PrismCode.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.
  */
 
@@ -9,7 +9,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useEffect } from 'react';
 import Prism from 'prismjs';
 import { CONTAINER_STYLES, tasty, } from '../../../tasty';
-const RawPre = tasty({
+const PreElement = tasty({
     as: 'pre',
     qa: 'CodeBlock',
     styleProps: CONTAINER_STYLES.concat([]),
@@ -26,7 +26,7 @@ function PrismCode(props, ref) {
     useEffect(() => {
         Prism.highlightAll();
     });
-    return (_jsx(RawPre, { ref: ref, className: "cube-prism-code", ...otherProps, children: _jsx("code", { "data-element": "Code", className: `language-${language}`, children: code }, void 0) }, void 0));
+    return (_jsx(PreElement, { ref: ref, className: "cube-prism-code", ...otherProps, children: _jsx("code", { "data-element": "Code", className: `language-${language}`, children: code }, void 0) }, void 0));
 }
 /**
  * Code block with syntax highlighting

package/es/components/content/Result/Result.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/es/components/content/Skeleton/Skeleton.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/es/components/content/Tag/Tag.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.
  */
 
@@ -11,9 +11,8 @@ import THEMES from '../../../data/themes';
 import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, } from '../../../tasty';
 import { Action } from '../../actions/Action';
 import { Suffix } from '../../layout/Suffix';
-import { Block } from '../../Block';
 import { CloseOutlined } from '@ant-design/icons';
-const RawTag = tasty({
+const TagElement = tasty({
     qa: 'Tag',
     role: 'status',
     styles: {
@@ -52,14 +51,13 @@ const RawTag = tasty({
                 return map;
             }, {}),
         },
-    },
-});
-const RawContent = tasty(Block, {
-    styles: {
-        width: 'max 100%',
-        textOverflow: 'ellipsis',
-        overflow: 'hidden',
-        pointerEvents: 'none',
+        Content: {
+            display: 'block',
+            width: 'max 100%',
+            textOverflow: 'ellipsis',
+            overflow: 'hidden',
+            pointerEvents: 'none',
+        },
     },
 });
 const CloseAction = tasty(Action, {
@@ -78,9 +76,9 @@ const CloseAction = tasty(Action, {
     },
 });
 const Tag = (allProps, ref) => {
-    let { type, isClosable, onClose, children, ...props } = allProps;
+    let { type, isClosable, onClose, closeButtonStyles, children, ...props } = allProps;
     const styles = extractStyles(props, CONTAINER_STYLES);
-    return (_jsxs(RawTag, { ...filterBaseProps(props, { eventProps: true }), styles: styles, "data-type": type, mods: { closable: isClosable }, ref: ref, children: [_jsx(RawContent, { mods: { closable: isClosable }, children: children }, void 0), isClosable ? (_jsx(Suffix, { outerGap: "0", children: _jsx(CloseAction, { onPress: onClose, children: _jsx(CloseOutlined, { style: {
+    return (_jsxs(TagElement, { ...filterBaseProps(props, { eventProps: true }), styles: styles, "data-type": type, mods: { closable: isClosable }, ref: ref, children: [_jsx("div", { "data-element": "Content", children: children }, void 0), isClosable ? (_jsx(Suffix, { outerGap: "0", children: _jsx(CloseAction, { styles: closeButtonStyles, onPress: onClose, children: _jsx(CloseOutlined, { style: {
                             fontSize: 'calc(var(--font-size) - (var(--border-width) * 2))',
                         } }, void 0) }, void 0) }, void 0)) : undefined] }, void 0));
 };

package/es/components/content/Text.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.
  */
 
@@ -15,7 +15,7 @@ export const TEXT_PROP_MAP = {
     weight: 'fontWeight',
     italic: 'fontStyle',
 };
-const RawText = tasty({
+const TextElement = tasty({
     qa: 'Text',
     as: 'span',
     styles: {
@@ -46,7 +46,7 @@ const _Text = forwardRef(function Text(allProps, ref) {
     allProps = useSlotProps(allProps, 'text');
     const { as, qa, block, styleName, ellipsis, nowrap, ...props } = allProps;
     const styles = extractStyles(props, STYLE_LIST, {}, TEXT_PROP_MAP);
-    return (_jsx(RawText, { as: as || 'span', qa: qa || 'Text', styleName: styleName, mods: {
+    return (_jsx(TextElement, { as: as || 'span', qa: qa || 'Text', styleName: styleName, mods: {
             nowrap,
             ellipsis,
         }, block: !!(block || ellipsis), ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));

package/es/components/content/Title.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.
  */
 
@@ -11,7 +11,7 @@ import { TEXT_PROP_MAP } from './Text';
 import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, TEXT_STYLES, } from '../../tasty';
 import { useSlotProps } from '../../utils/react';
 const STYLE_LIST = [...TEXT_STYLES, ...CONTAINER_STYLES];
-const RawTitle = tasty({
+const TitleElement = tasty({
     qa: 'Title',
     as: 'h1',
     styles: {
@@ -41,7 +41,7 @@ const _Title = forwardRef(({ qa, as, styleName, inline, nowrap, ellipsis, level,
     props = useSlotProps(props, 'heading');
     const tag = `h${level || 1}`;
     const styles = extractStyles(props, STYLE_LIST, {}, TEXT_PROP_MAP);
-    return (_jsx(RawTitle, { qa: qa || 'Title', as: as || tag, styleName: styleName, "data-level": level || 1, mods: {
+    return (_jsx(TitleElement, { qa: qa || 'Title', as: as || tag, styleName: styleName, "data-level": level || 1, mods: {
             nowrap,
             ellipsis,
         }, inline: inline, ...filterBaseProps(props, { eventProps: true }), styles: styles, ref: ref }, void 0));