@cube-dev/ui-kit 0.0.0-canary-dfe4967 → 0.0.0-canary-c56f761

package/cjs/components/Base.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -30,7 +30,7 @@ const INLINE_MAP = {
 };
 const BaseElement = styled_components_1.default.div(({ css }) => css);
 /**
- * @deprecated consider using styled() instead
+ * @deprecated consider using tasty() instead
  */
 const Base = function Base(allProps, ref) {
     let { as, styles: originalStyles, breakpoints, block, mods, inline, isHidden, isDisabled, qa, qaVal, css, element, ...props } = allProps;
@@ -56,7 +56,7 @@ const Base = function Base(allProps, ref) {
     return ((0, jsx_runtime_1.jsx)(BaseElement, { as: as, "data-element": element, "data-qa": qa, "data-qaval": qaVal, ...props, hidden: isHidden, disabled: isDisabled, ref: ref, css: css }, void 0));
 };
 /**
- * @deprecated consider using styled() instead
+ * @deprecated consider using tasty() instead
  */
 const _Base = (0, react_1.forwardRef)(Base);
 exports.Base = _Base;

package/cjs/components/Block.js

@@ -1,25 +1,27 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Block = exports.CUBE_BLOCK_STYLES = void 0;
+exports.Block = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const list_1 = require("../styles/list");
 const styles_1 = require("../utils/styles");
 const filterBaseProps_1 = require("../utils/filterBaseProps");
-const Base_1 = require("./Base");
-exports.CUBE_BLOCK_STYLES = {
-    display: 'block',
-};
+const tasty_1 = require("../tasty");
+const RawBlock = (0, tasty_1.tasty)({
+    styled: {
+        display: 'block',
+    },
+});
 exports.Block = (0, react_1.forwardRef)((props, ref) => {
-    const styles = (0, styles_1.extractStyles)(props, list_1.CONTAINER_STYLES, exports.CUBE_BLOCK_STYLES);
-    return ((0, jsx_runtime_1.jsx)(Base_1.Base, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    const styles = (0, styles_1.extractStyles)(props, list_1.CONTAINER_STYLES);
+    return ((0, jsx_runtime_1.jsx)(RawBlock, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
 });
 
         

package/cjs/components/GlobalStyles.js

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

package/cjs/components/GridProvider.js

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

package/cjs/components/HiddenInput.js

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

package/cjs/components/OpenTrasition.js

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

package/cjs/components/Root.js

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

package/cjs/components/actions/Action.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -100,7 +100,7 @@ const DEFAULT_STYLES = {
     cursor: 'pointer',
 };
 const STYLE_PROPS = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-exports.Action = (0, react_1.forwardRef)(({ to, as, htmlType, label, theme, css, mods, onPress, ...props }, ref) => {
+exports.Action = (0, react_1.forwardRef)(({ to, as, htmlType, label, theme, mods, onPress, ...props }, ref) => {
     as = to ? 'a' : as || 'button';
     const router = (0, react_1.useContext)(provider_1.UIKitContext).router;
     const isDisabled = props.isDisabled;
@@ -130,7 +130,7 @@ exports.Action = (0, react_1.forwardRef)(({ to, as, htmlType, label, theme, css,
             focused: isFocused && !isDisabled,
             disabled: isDisabled,
             ...mods,
-        }, "aria-label": label, "data-theme": theme, ...(0, react_2.mergeProps)(buttonProps, hoverProps, focusProps, customProps, (0, filterBaseProps_1.filterBaseProps)(props, FILTER_OPTIONS)), type: htmlType || 'button', rel: as === 'a' && newTab ? 'rel="noopener noreferrer"' : undefined, ref: domRef, as: as, isDisabled: isDisabled, styles: styles, target: target, href: href, css: css }, void 0));
+        }, "aria-label": label, "data-theme": theme, ...(0, react_2.mergeProps)(buttonProps, hoverProps, focusProps, customProps, (0, filterBaseProps_1.filterBaseProps)(props, FILTER_OPTIONS)), type: htmlType || 'button', rel: as === 'a' && newTab ? 'rel="noopener noreferrer"' : undefined, ref: domRef, as: as, isDisabled: isDisabled, styles: styles, target: target, href: href }, void 0));
 });
 
         

package/cjs/components/actions/Button/Button.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -253,7 +253,7 @@ const DEFAULT_STYLES = {
     },
 };
 exports.Button = (0, react_1.forwardRef)((allProps, ref) => {
-    let { type, size, label, styles, children, theme, css, icon, mods, ...props } = allProps;
+    let { type, size, label, styles, children, theme, icon, mods, ...props } = allProps;
     const isDisabled = props.isDisabled;
     const isLoading = props.isLoading;
     const isSelected = props.isSelected;
@@ -291,7 +291,7 @@ exports.Button = (0, react_1.forwardRef)((allProps, ref) => {
         styles.fontSize = '1em';
         styles.lineHeight = '1em';
     }
-    return ((0, jsx_runtime_1.jsxs)(Action_1.Action, { as: props.to ? 'a' : undefined, css: css, ...props, ref: ref, isDisabled: isLoading || isDisabled, theme: theme, "data-type": type, "data-is-loading": isLoading ? '' : undefined, "data-is-selected": isSelected ? '' : undefined, "data-size": size, mods: mods, styles: styles, label: label, children: [icon || isLoading ? !isLoading ? icon : (0, jsx_runtime_1.jsx)(icons_1.LoadingOutlined, {}, void 0) : null, children] }, void 0));
+    return ((0, jsx_runtime_1.jsxs)(Action_1.Action, { as: props.to ? 'a' : undefined, ...props, ref: ref, isDisabled: isLoading || isDisabled, theme: theme, "data-type": type, "data-is-loading": isLoading ? '' : undefined, "data-is-selected": isSelected ? '' : undefined, "data-size": size, mods: mods, styles: styles, label: label, children: [icon || isLoading ? !isLoading ? icon : (0, jsx_runtime_1.jsx)(icons_1.LoadingOutlined, {}, void 0) : null, children] }, void 0));
 });
 
         

package/cjs/components/actions/Button/Submit.js

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

package/cjs/components/actions/Button/index.js

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

package/cjs/components/actions/ButtonGroup/ButtonGroup.js

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

package/cjs/components/actions/index.js

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

package/cjs/components/content/ActiveZone/ActiveZone.js

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

package/cjs/components/content/Avatar/Avatar.js

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

package/cjs/components/content/Badge/Badge.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -17,10 +17,10 @@ const themes_1 = __importDefault(require("../../../data/themes"));
 const list_1 = require("../../../styles/list");
 const styles_1 = require("../../../utils/styles");
 const filterBaseProps_1 = require("../../../utils/filterBaseProps");
-const styled_1 = require("../../../styled");
-const RawBadge = (0, styled_1.styled)({
-    name: 'Badge',
-    props: { role: 'region' },
+const tasty_1 = require("../../../tasty");
+const RawBadge = (0, tasty_1.tasty)({
+    qa: 'Badge',
+    role: 'region',
     styles: {
         display: 'inline-flex',
         placeContent: 'center',

package/cjs/components/content/Card/Card.js

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

package/cjs/components/content/Content.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -10,15 +10,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Content = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const styled_1 = require("../../styled");
+const tasty_1 = require("../../tasty");
 const list_1 = require("../../styles/list");
 const styles_1 = require("../../utils/styles");
 const filterBaseProps_1 = require("../../utils/filterBaseProps");
 const react_2 = require("../../utils/react");
 const STYLE_LIST = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-const RawContent = (0, styled_1.styled)({
-    name: 'Content',
-    tag: 'section',
+const RawContent = (0, tasty_1.tasty)({
+    qa: 'Content',
+    as: 'section',
     styles: {
         gridArea: 'content',
         preset: 'p3',
@@ -29,9 +29,6 @@ const RawContent = (0, styled_1.styled)({
         overflow: 'auto',
         styledScrollbar: true,
     },
-    props: {
-        'data-id': 'Content',
-    },
 });
 exports.Content = (0, react_1.forwardRef)((props, ref) => {
     props = (0, react_2.useSlotProps)(props, 'content');

package/cjs/components/content/Divider.js

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

package/cjs/components/content/Footer.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -14,18 +14,16 @@ const list_1 = require("../../styles/list");
 const styles_1 = require("../../utils/styles");
 const filterBaseProps_1 = require("../../utils/filterBaseProps");
 const react_2 = require("../../utils/react");
-const styled_1 = require("../../styled");
+const tasty_1 = require("../../tasty");
 const STYLE_LIST = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-const RawFooter = (0, styled_1.styled)({
-    name: 'Footer',
+const RawFooter = (0, tasty_1.tasty)({
+    qa: 'Footer',
+    'data-id': 'Footer',
     styles: {
         gridArea: 'footer',
         display: 'block',
         flow: 'column',
     },
-    props: {
-        'data-id': 'Footer',
-    },
 });
 exports.Footer = (0, react_1.forwardRef)((props, ref) => {
     props = (0, react_2.useSlotProps)(props, 'footer');

package/cjs/components/content/Header.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -10,16 +10,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Header = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const styled_1 = require("../../styled");
+const tasty_1 = require("../../tasty");
 const list_1 = require("../../styles/list");
 const styles_1 = require("../../utils/styles");
 const filterBaseProps_1 = require("../../utils/filterBaseProps");
 const react_2 = require("../../utils/react");
 const STYLE_LIST = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-const RawHeader = (0, styled_1.styled)({
-    name: 'Header',
-    tag: 'header',
-    props: { 'data-id': 'Header' },
+const RawHeader = (0, tasty_1.tasty)({
+    qa: 'Header',
+    as: 'header',
     styles: {
         display: 'block',
         gridArea: 'header',

package/cjs/components/content/Paragraph.js

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

package/cjs/components/content/Placeholder/Placeholder.js

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

package/cjs/components/content/PrismCode/PrismCode.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -14,13 +14,13 @@ exports.PrismCode = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const prismjs_1 = __importDefault(require("prismjs"));
-const styled_1 = require("../../../styled");
+const tasty_1 = require("../../../tasty");
 const list_1 = require("../../../styles/list");
-const RawPre = (0, styled_1.styled)({
-    name: 'CodeBlock',
-    tag: 'pre',
+const RawPre = (0, tasty_1.tasty)({
+    as: 'pre',
+    qa: 'CodeBlock',
     styleProps: list_1.CONTAINER_STYLES.concat([]),
-    props: { className: 'cube-prism-code' },
+    className: 'cube-prism-code',
     styles: {
         margin: 0,
         Code: {

package/cjs/components/content/Result/Result.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -12,14 +12,14 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const icons_1 = require("@ant-design/icons");
 const Title_1 = require("../Title");
-const styled_1 = require("../../../styled");
+const tasty_1 = require("../../../tasty");
 const list_1 = require("../../../styles/list");
 const filterBaseProps_1 = require("../../../utils/filterBaseProps");
 const styles_1 = require("../../../utils/styles");
 const react_2 = require("../../../utils/react");
-const Container = (0, styled_1.styled)({
-    name: 'ResultContainer',
-    tag: 'section',
+const Container = (0, tasty_1.tasty)({
+    qa: 'Result_Container',
+    as: 'section',
     styles: {
         display: 'flex',
         flow: 'column',
@@ -38,7 +38,7 @@ const Container = (0, styled_1.styled)({
         },
     },
 });
-const IconWrapper = (0, styled_1.styled)({
+const IconWrapper = (0, tasty_1.tasty)({
     styles: {
         fontSize: '10x',
     },

package/cjs/components/content/Skeleton/Skeleton.js

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

package/cjs/components/content/Tag/Tag.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -21,9 +21,10 @@ const Action_1 = require("../../actions/Action");
 const Suffix_1 = require("../../layout/Suffix");
 const Block_1 = require("../../Block");
 const icons_1 = require("@ant-design/icons");
-const styled_1 = require("../../../styled");
-const RawTag = (0, styled_1.styled)({
-    name: 'Tag',
+const tasty_1 = require("../../../tasty");
+const RawTag = (0, tasty_1.tasty)({
+    qa: 'Tag',
+    role: 'status',
     styles: {
         position: 'relative',
         display: 'inline-flex',
@@ -61,30 +62,34 @@ const RawTag = (0, styled_1.styled)({
             }, {}),
         },
     },
-    props: { role: 'status' },
 });
-const DEFAULT_CONTENT_STYLES = {
-    width: 'max 100%',
-    textOverflow: 'ellipsis',
-    overflow: 'hidden',
-    pointerEvents: 'none',
-};
-const DEFAULT_CLOSE_STYLES = {
-    display: 'grid',
-    placeItems: 'center',
-    color: true,
-    placeSelf: 'center',
-    opacity: {
-        '': 0.85,
-        'pressed | hovered': 1,
+const RawContent = (0, tasty_1.tasty)(Block_1.Block, {
+    styles: {
+        width: 'max 100%',
+        textOverflow: 'ellipsis',
+        overflow: 'hidden',
+        pointerEvents: 'none',
     },
-    transition: 'opacity',
-    padding: '0 .5x',
-};
+});
+const CloseAction = (0, tasty_1.tasty)(Action_1.Action, {
+    label: 'Close',
+    styles: {
+        display: 'grid',
+        placeItems: 'center',
+        color: true,
+        placeSelf: 'center',
+        opacity: {
+            '': 0.85,
+            'pressed | hovered': 1,
+        },
+        transition: 'opacity',
+        padding: '0 .5x',
+    },
+});
 const Tag = (allProps, ref) => {
     let { type, isClosable, onClose, children, ...props } = allProps;
     const styles = (0, styles_1.extractStyles)(props, list_1.CONTAINER_STYLES);
-    return ((0, jsx_runtime_1.jsxs)(RawTag, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, "data-type": type, mods: { closable: isClosable }, ref: ref, children: [(0, jsx_runtime_1.jsx)(Block_1.Block, { mods: { closable: isClosable }, styles: DEFAULT_CONTENT_STYLES, children: children }, void 0), isClosable ? ((0, jsx_runtime_1.jsx)(Suffix_1.Suffix, { outerGap: "0", children: (0, jsx_runtime_1.jsx)(Action_1.Action, { onPress: onClose, styles: DEFAULT_CLOSE_STYLES, label: "Close", children: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, { style: {
+    return ((0, jsx_runtime_1.jsxs)(RawTag, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, "data-type": type, mods: { closable: isClosable }, ref: ref, children: [(0, jsx_runtime_1.jsx)(RawContent, { mods: { closable: isClosable }, children: children }, void 0), isClosable ? ((0, jsx_runtime_1.jsx)(Suffix_1.Suffix, { outerGap: "0", children: (0, jsx_runtime_1.jsx)(CloseAction, { onPress: onClose, children: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, { style: {
                             fontSize: 'calc(var(--font-size) - (var(--border-width) * 2))',
                         } }, void 0) }, void 0) }, void 0)) : undefined] }, void 0));
 };

package/cjs/components/content/Text.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-dfe4967
+ * @cube-dev/ui-kit v0.0.0-canary-c56f761
  * Released under the MIT license.
  */
 
@@ -13,50 +13,49 @@ const react_1 = require("react");
 const list_1 = require("../../styles/list");
 const styles_1 = require("../../utils/styles");
 const filterBaseProps_1 = require("../../utils/filterBaseProps");
-const styled_1 = require("../../styled");
+const tasty_1 = require("../../tasty");
 const react_2 = require("../../utils/react");
 const STYLE_LIST = [...list_1.BASE_STYLES, ...list_1.TEXT_STYLES, ...list_1.COLOR_STYLES];
-const DEFAULT_STYLES = {
-    display: {
-        '': 'inline',
-        ellipsis: 'block',
-    },
-    margin: '0',
-    whiteSpace: {
-        '': 'inherit',
-        'nowrap | ellipsis': 'nowrap',
-    },
-    textOverflow: {
-        '': false,
-        ellipsis: 'ellipsis',
-    },
-    overflow: {
-        '': false,
-        ellipsis: 'hidden',
-    },
-    width: {
-        '': false,
-        ellipsis: 'max 100%',
-    },
-};
 exports.TEXT_PROP_MAP = {
     transform: 'textTransform',
     weight: 'fontWeight',
     italic: 'fontStyle',
 };
-const RawText = (0, styled_1.styled)({
-    name: 'Text',
-    tag: 'span',
-    styles: DEFAULT_STYLES,
+const RawText = (0, tasty_1.tasty)({
+    qa: 'Text',
+    as: 'span',
+    styles: {
+        display: {
+            '': 'inline',
+            ellipsis: 'block',
+        },
+        margin: '0',
+        whiteSpace: {
+            '': 'inherit',
+            'nowrap | ellipsis': 'nowrap',
+        },
+        textOverflow: {
+            '': false,
+            ellipsis: 'ellipsis',
+        },
+        overflow: {
+            '': false,
+            ellipsis: 'hidden',
+        },
+        width: {
+            '': false,
+            ellipsis: 'max 100%',
+        },
+    },
 });
 const _Text = (0, react_1.forwardRef)((allProps, ref) => {
     allProps = (0, react_2.useSlotProps)(allProps, 'text');
-    const { as, qa, block, styleName, ellipsis, css, nowrap, ...props } = allProps;
+    const { as, qa, block, styleName, ellipsis, nowrap, ...props } = allProps;
     const styles = (0, styles_1.extractStyles)(props, STYLE_LIST, {}, exports.TEXT_PROP_MAP);
     return ((0, jsx_runtime_1.jsx)(RawText, { as: as || 'span', qa: qa || 'Text', styleName: styleName, mods: {
             nowrap,
             ellipsis,
-        }, block: !!(block || ellipsis), css: css, ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+        }, block: !!(block || ellipsis), ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
 });
 const Text = Object.assign(_Text, {
     Minor: (0, react_1.forwardRef)(function MinorText(props, ref) {