@telefonica/mistica 12.11.1 → 12.13.0

package/dist/text-field-components.d.ts

@@ -1,9 +1,5 @@
 import * as React from 'react';
 export declare type InputState = 'focused' | 'filled' | 'default';
-export declare const DEFAULT_WIDTH = 328;
-export declare const LABEL_LEFT_POSITION = 12;
-export declare const LABEL_SCALE_DESKTOP: number;
-export declare const LABEL_SCALE_MOBILE: number;
 declare type LabelProps = {
     shrinkLabel?: boolean;
     forId: string;

package/dist/text-field-components.js

@@ -9,34 +9,24 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    DEFAULT_WIDTH: function() {
-        return C;
-    },
     FieldContainer: function() {
-        return D;
+        return J;
     },
     HelperText: function() {
-        return B;
-    },
-    LABEL_LEFT_POSITION: function() {
-        return d;
-    },
-    LABEL_SCALE_DESKTOP: function() {
-        return f;
-    },
-    LABEL_SCALE_MOBILE: function() {
-        return p;
+        return G;
     },
     Label: function() {
-        return _;
+        return B;
     }
 });
 var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var _classnames = /*#__PURE__*/ _interopRequireDefault(require("classnames"));
-var _jssJs = require("./jss.js");
 var _themeVariantContextJs = require("./theme-variant-context.js");
 var _hooksJs = require("./hooks.js");
 var _textJs = require("./text.js");
+var _textFieldComponentsCssMisticaJs = require("./text-field-components.css-mistica.js");
+var _sprinklesCssMisticaJs = require("./sprinkles.css-mistica.js");
+var _skinContractCssMisticaJs = require("./skins/skin-contract.css-mistica.js");
 var _jsxRuntimeJs = require("./_virtual/jsx-runtime.js");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
@@ -180,180 +170,77 @@ function _unsupportedIterableToArray(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
 }
-var C = 328, d = 12, f = parseFloat("0.78"), p = parseFloat("0.75"), w = (0, _jssJs.createUseStyles)(function(e) {
-    var _obj;
-    return {
-        labelContainer: (_obj = {
-            position: "absolute",
-            pointerEvents: "none",
-            left: d,
-            top: 0,
-            transformOrigin: "0 0",
-            height: 24,
-            display: "flex",
-            flexDirection: "row",
-            transform: "translateY(18px) scale(1)",
-            fontSize: 18,
-            lineHeight: "24px",
-            color: function color(param) {
-                var r = param.inputState, t = param.error;
-                return t && r !== "default" ? e.colors.error : r === "focused" ? e.colors.controlActivated : e.colors.textSecondary;
-            }
-        }, _defineProperty(_obj, e.mq.tabletOrSmaller, {
-            fontSize: 16,
-            transform: "translateY(16px) scale(1)"
-        }), _defineProperty(_obj, "width", "calc(100% - ".concat(d * 2, "px)")), _obj),
-        labelText: {
-            "-webkit-line-clamp": 1,
-            lineClamp: 1,
-            wordBreak: "break-all",
-            display: "box",
-            overflow: "hidden",
-            boxOrient: "vertical",
-            flexShrink: 1
-        },
-        shrinked: _defineProperty({
-            transform: "translateY(8px) scale(".concat(f, ")"),
-            height: 20 / f,
-            lineHeight: "".concat(20 / f, "px"),
-            width: "calc(100% - ".concat(d * 2, "px) / ").concat(f)
-        }, e.mq.tabletOrSmaller, {
-            transform: "translateY(8px) scale(".concat(p, ")"),
-            height: 16 / p,
-            lineHeight: "".concat(16 / p, "px"),
-            width: "calc(100% - ".concat(d * 2, "px) / ").concat(p)
-        })
-    };
-}), _ = function _(param) {
-    var e = param.shrinkLabel, r = param.forId, t = param.inputState, s = param.error, l = param.children, o = param.style, a = param.optional;
-    var c = e || t === "focused" || t === "filled", i = w({
-        inputState: t,
-        error: s
-    }), ref = _slicedToArray(_react.useState(""), 2), S = ref[0], y = ref[1], ref1 = (0, _hooksJs.useTheme)(), v = ref1.texts;
-    return _react.useEffect(function() {
-        var T = setTimeout(function() {
-            process.env.NODE_ENV !== "test" && y("transform 150ms, width 150ms");
+var B = function B(param) {
+    var o = param.shrinkLabel, t = param.forId, r = param.inputState, s = param.error, e = param.children, i = param.style, n = param.optional;
+    var m = o || r === "focused" || r === "filled", ref = _slicedToArray(_react.useState(""), 2), T = ref[0], b = ref[1], ref1 = (0, _hooksJs.useTheme)(), N = ref1.texts;
+    _react.useEffect(function() {
+        var y = setTimeout(function() {
+            process.env.NODE_ENV !== "test" && b("transform 150ms, width 150ms");
         });
         return function() {
-            clearTimeout(T);
+            clearTimeout(y);
         };
-    }, []), /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("label", {
-        className: (0, _classnames.default)(i.labelContainer, _defineProperty({}, i.shrinked, c)),
-        htmlFor: r,
-        style: _objectSpreadProps(_objectSpread({}, o), {
-            transition: S
+    }, []);
+    var f = _skinContractCssMisticaJs.vars.colors.textSecondary;
+    return s && r !== "default" ? f = _skinContractCssMisticaJs.vars.colors.error : r === "focused" && (f = _skinContractCssMisticaJs.vars.colors.controlActivated), /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("label", {
+        className: (0, _classnames.default)(_textFieldComponentsCssMisticaJs.labelContainer, _defineProperty({}, _textFieldComponentsCssMisticaJs.shrinked, m), (0, _sprinklesCssMisticaJs.sprinkles)({
+            color: f
+        })),
+        htmlFor: t,
+        style: _objectSpreadProps(_objectSpread({}, i), {
+            transition: T
         }),
         children: [
             /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("span", {
-                className: i.labelText,
-                children: l
+                className: _textFieldComponentsCssMisticaJs.labelText,
+                children: e
             }),
-            a ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("span", {
+            n ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("span", {
                 children: [
                     "\xa0(",
-                    v.formFieldOptionalLabelSuffix,
+                    N.formFieldOptionalLabelSuffix,
                     ")"
                 ]
             }) : null
         ]
     });
-}, E = (0, _jssJs.createUseStyles)(function() {
-    return {
-        helperContainer: {
-            paddingLeft: 12,
-            paddingRight: 16,
-            "& div": {
-                margin: 0,
-                marginTop: 4,
-                flexGrow: 1
-            },
-            display: "flex"
-        },
-        leftText: {
-            textAlign: "left"
-        },
-        rightText: {
-            textAlign: "right"
-        }
-    };
-}), B = function B(param) {
-    var e = param.leftText, r = param.rightText, t = param.error;
-    var s = (0, _themeVariantContextJs.useIsInverseVariant)(), ref = (0, _hooksJs.useTheme)(), l = ref.colors, o = E(), a = s ? l.textPrimaryInverse : t ? l.error : l.textSecondary, c = s ? l.textPrimaryInverse : l.textSecondary;
+}, G = function G(param) {
+    var o = param.leftText, t = param.rightText, r = param.error;
+    var s = (0, _themeVariantContextJs.useIsInverseVariant)(), ref = (0, _hooksJs.useTheme)(), e = ref.colors, i = s ? e.textPrimaryInverse : r ? e.error : e.textSecondary, n = s ? e.textPrimaryInverse : e.textSecondary;
     return /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
-        className: o.helperContainer,
+        className: _textFieldComponentsCssMisticaJs.helperContainer,
         children: [
-            e && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                className: o.leftText,
+            o && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
+                className: (0, _classnames.default)(_textFieldComponentsCssMisticaJs.helperText, _textFieldComponentsCssMisticaJs.leftText),
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text1, {
-                    color: a,
+                    color: i,
                     regular: !0,
                     as: "p",
-                    children: e
+                    children: o
                 })
             }),
-            r && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                className: o.rightText,
+            t && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
+                className: (0, _classnames.default)(_textFieldComponentsCssMisticaJs.helperText, _textFieldComponentsCssMisticaJs.rightText),
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text1, {
-                    color: c,
+                    color: n,
                     regular: !0,
                     as: "p",
-                    children: r
+                    children: t
                 })
             })
         ]
     });
-}, O = (0, _jssJs.createUseStyles)(function(e) {
-    var _obj, _obj1;
-    return {
-        fieldContainer: (_obj = {
-            opacity: function opacity(param) {
-                var r = param.disabled;
-                return r ? 0.5 : 1;
-            },
-            display: "flex",
-            flexDirection: "column",
-            minWidth: 96
-        }, _defineProperty(_obj, e.mq.tabletOrSmaller, {
-            width: "100%"
-        }), _defineProperty(_obj, e.mq.desktopOrBigger, {
-            width: function width(param) {
-                var r = param.fullWidth;
-                return r ? "100%" : C;
-            }
-        }), _obj),
-        border: (_obj1 = {
-            overflow: "hidden",
-            border: "1px solid ".concat(e.colors.border),
-            borderRadius: 8,
-            height: function height(param) {
-                var r = param.multiline;
-                return r ? 152 : 60;
-            }
-        }, _defineProperty(_obj1, e.mq.tabletOrSmaller, {
-            height: function height(param) {
-                var r = param.multiline;
-                return r ? 152 : 56;
-            }
-        }), _defineProperty(_obj1, "display", "flex"), _defineProperty(_obj1, "position", "relative"), _defineProperty(_obj1, "backgroundColor", function(param) {
-            var r = param.readOnly;
-            return r ? e.colors.neutralLow : e.colors.backgroundContainer;
-        }), _obj1)
-    };
-}), D = function D(param) {
-    var e = param.multiline, r = param.disabled, t = param.children, s = param.helperText, l = param.className, o = param.fieldRef, a = param.fullWidth, c = param.readOnly;
-    var i = O({
-        multiline: e,
-        fullWidth: a,
-        disabled: r,
-        readOnly: c
-    });
+}, J = function J(param) {
+    var o = param.multiline, t = param.disabled, r = param.children, s = param.helperText, e = param.className, i = param.fieldRef, n = param.fullWidth, m = param.readOnly;
     return /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
-        className: i.fieldContainer,
+        className: (0, _classnames.default)(_textFieldComponentsCssMisticaJs.fieldContainer, n ? _textFieldComponentsCssMisticaJs.fullWidth : _textFieldComponentsCssMisticaJs.normalWidth, _defineProperty({}, _textFieldComponentsCssMisticaJs.disabled, t)),
         children: [
             /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                className: (0, _classnames.default)(i.border, l),
-                ref: o,
-                children: t
+                className: (0, _classnames.default)(_textFieldComponentsCssMisticaJs.field, o ? _textFieldComponentsCssMisticaJs.fieldMulti : _textFieldComponentsCssMisticaJs.fieldSingle, (0, _sprinklesCssMisticaJs.sprinkles)({
+                    background: m ? _skinContractCssMisticaJs.vars.colors.neutralLow : _skinContractCssMisticaJs.vars.colors.backgroundContainer
+                }), e),
+                ref: i,
+                children: r
             }),
             s
         ]

package/dist/text-field-components.js.flow

@@ -2,10 +2,6 @@
 
 import * as React from "react";
 export type InputState = "focused" | "filled" | "default";
-declare export var DEFAULT_WIDTH: 328;
-declare export var LABEL_LEFT_POSITION: 12;
-declare export var LABEL_SCALE_DESKTOP: number;
-declare export var LABEL_SCALE_MOBILE: number;
 declare type LabelProps = {
   shrinkLabel?: boolean,
   forId: string,

package/dist/text-link.css-mistica.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, "variants", {
 require("./sprinkles.css.ts.vanilla.js");
 require("./text-link.css.ts.vanilla.js");
 var v = {
-    default: "_1m1n0pr1 _1y2v1nf9j _1y2v1nf7e _1y2v1nfbg _1y2v1nf1t",
-    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nf9j _1y2v1nf7e _1y2v1nfbg _1y2v1nf1u",
-    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nf9j _1y2v1nf7e _1y2v1nfbg _1y2v1nf1t"
+    default: "_1m1n0pr1 _1y2v1nf76 _1y2v1nf51 _1y2v1nf93 _1y2v1nf1t",
+    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nf76 _1y2v1nf51 _1y2v1nf93 _1y2v1nf1u",
+    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nf76 _1y2v1nf51 _1y2v1nf93 _1y2v1nf1t"
 };

package/dist/text.js

@@ -10,40 +10,40 @@ function _export(target, all) {
 }
 _export(exports, {
     Text: function() {
-        return r;
+        return n;
     },
     Text1: function() {
         return ge;
     },
     Text10: function() {
-        return re;
+        return oe;
     },
     Text2: function() {
-        return ce;
+        return le;
     },
     Text3: function() {
-        return me;
+        return pe;
     },
     Text4: function() {
-        return xe;
+        return ae;
     },
     Text5: function() {
-        return he;
+        return xe;
     },
     Text6: function() {
-        return le;
+        return me;
     },
     Text7: function() {
         return se;
     },
     Text8: function() {
-        return oe;
+        return re;
     },
     Text9: function() {
         return ne;
     },
     default: function() {
-        return r;
+        return n;
     }
 });
 var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
@@ -152,6 +152,33 @@ function _objectSpreadProps(target, source) {
     }
     return target;
 }
+function _objectWithoutProperties(source, excluded) {
+    if (source == null) return {};
+    var target = _objectWithoutPropertiesLoose(source, excluded);
+    var key, i;
+    if (Object.getOwnPropertySymbols) {
+        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+        for(i = 0; i < sourceSymbolKeys.length; i++){
+            key = sourceSymbolKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+function _objectWithoutPropertiesLoose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for(i = 0; i < sourceKeys.length; i++){
+        key = sourceKeys[i];
+        if (excluded.indexOf(key) >= 0) continue;
+        target[key] = source[key];
+    }
+    return target;
+}
 var J = {
     light: 300,
     regular: 400,
@@ -159,138 +186,178 @@ var J = {
     bold: 700
 }, K = function K(e) {
     return e === !0 ? 1 : e || "initial";
-}, r = function r(param) {
-    var e = param.weight, tmp = param.color, t = tmp === void 0 ? _skinContractCssMisticaJs.vars.colors.textPrimary : tmp, c = param.decoration, s = param.truncate, z = param.transform, tmp1 = param.wordBreak, d = tmp1 === void 0 ? !0 : tmp1, w = param.hyphens, tmp2 = param.as, H = tmp2 === void 0 ? "span" : tmp2, g = param.children, a = param.size, tmp3 = param.mobileSize, u = tmp3 === void 0 ? a : tmp3, tmp4 = param.desktopSize, p = tmp4 === void 0 ? a : tmp4, S = param.lineHeight, tmp5 = param.mobileLineHeight, k = tmp5 === void 0 ? S : tmp5, tmp6 = param.desktopLineHeight, L = tmp6 === void 0 ? S : tmp6, T = param.letterSpacing, v = param.textAlign, P = param.id, y = param.role, I = param["aria-level"], W = param.dataAttributes;
-    var b;
+}, n = function n(param) {
+    var e = param.weight, tmp = param.color, t = tmp === void 0 ? _skinContractCssMisticaJs.vars.colors.textPrimary : tmp, i = param.decoration, m = param.truncate, f = param.transform, tmp1 = param.wordBreak, h = tmp1 === void 0 ? !0 : tmp1, z = param.hyphens, tmp2 = param.as, w = tmp2 === void 0 ? "span" : tmp2, g = param.children, c = param.size, tmp3 = param.mobileSize, u = tmp3 === void 0 ? c : tmp3, tmp4 = param.desktopSize, d = tmp4 === void 0 ? c : tmp4, b = param.lineHeight, tmp5 = param.mobileLineHeight, T = tmp5 === void 0 ? b : tmp5, tmp6 = param.desktopLineHeight, S = tmp6 === void 0 ? b : tmp6, H = param.letterSpacing, v = param.textAlign, P = param.id, y = param.role, A = param["aria-level"], I = param.dataAttributes;
+    var k;
     var _obj;
-    var V = (0, _themeVariantContextJs.useIsInverseVariant)(), C = K(s), ref = (0, _hooksJs.useTheme)(), l = ref.colors, D = (_obj = {}, _defineProperty(_obj, _skinContractCssMisticaJs.vars.colors.textPrimary, _skinContractCssMisticaJs.vars.colors.textPrimaryInverse), _defineProperty(_obj, _skinContractCssMisticaJs.vars.colors.textSecondary, _skinContractCssMisticaJs.vars.colors.textSecondaryInverse), _defineProperty(_obj, _skinContractCssMisticaJs.vars.colors.textLink, _skinContractCssMisticaJs.vars.colors.textLinkInverse), _defineProperty(_obj, l.textPrimary, l.textPrimaryInverse), _defineProperty(_obj, l.textSecondary, l.textSecondaryInverse), _defineProperty(_obj, l.textLink, l.textLinkInverse), _obj);
+    var W = (0, _themeVariantContextJs.useIsInverseVariant)(), V = K(m), ref = (0, _hooksJs.useTheme)(), x = ref.colors, C = (_obj = {}, _defineProperty(_obj, _skinContractCssMisticaJs.vars.colors.textPrimary, _skinContractCssMisticaJs.vars.colors.textPrimaryInverse), _defineProperty(_obj, _skinContractCssMisticaJs.vars.colors.textSecondary, _skinContractCssMisticaJs.vars.colors.textSecondaryInverse), _defineProperty(_obj, _skinContractCssMisticaJs.vars.colors.textLink, _skinContractCssMisticaJs.vars.colors.textLinkInverse), _defineProperty(_obj, x.textPrimary, x.textPrimaryInverse), _defineProperty(_obj, x.textSecondary, x.textSecondaryInverse), _defineProperty(_obj, x.textLink, x.textLinkInverse), _obj);
     if (!g && g !== 0) return null;
     var _obj1, _obj2;
-    var M = (0, _classnames.default)(_textCssMisticaJs.text, d ? _textCssMisticaJs.withWordBreak : _textCssMisticaJs.withoutWordBreak, (_obj1 = {}, _defineProperty(_obj1, _textCssMisticaJs.truncateToOneLine, s === 1 || s === !0), _defineProperty(_obj1, _textCssMisticaJs.truncateToMoreThanOneLine, s && s > 1), _obj1)), O = (0, _dynamic.assignInlineVars)((_obj2 = {}, _defineProperty(_obj2, _textCssMisticaJs.vars.mobileSize, u ? (0, _cssJs.pxToRem)(u) : ""), _defineProperty(_obj2, _textCssMisticaJs.vars.mobileLineHeight, k ? (0, _cssJs.pxToRem)(k) : ""), _defineProperty(_obj2, _textCssMisticaJs.vars.desktopSize, p ? (0, _cssJs.pxToRem)(p) : ""), _defineProperty(_obj2, _textCssMisticaJs.vars.desktopLineHeight, L ? (0, _cssJs.pxToRem)(L) : ""), _obj2)), R = s ? (0, _dynamic.assignInlineVars)(_defineProperty({}, _textCssMisticaJs.vars.lineClamp, String(C))) : {};
-    return /*#__PURE__*/ _react.createElement(H, _objectSpreadProps(_objectSpread({
-        className: M,
+    var D = (0, _classnames.default)(_textCssMisticaJs.text, h ? _textCssMisticaJs.withWordBreak : _textCssMisticaJs.withoutWordBreak, (_obj1 = {}, _defineProperty(_obj1, _textCssMisticaJs.truncateToOneLine, m === 1 || m === !0), _defineProperty(_obj1, _textCssMisticaJs.truncateToMoreThanOneLine, m && m > 1), _obj1)), M = (0, _dynamic.assignInlineVars)((_obj2 = {}, _defineProperty(_obj2, _textCssMisticaJs.vars.mobileSize, u ? (0, _cssJs.pxToRem)(u) : ""), _defineProperty(_obj2, _textCssMisticaJs.vars.mobileLineHeight, T ? (0, _cssJs.pxToRem)(T) : ""), _defineProperty(_obj2, _textCssMisticaJs.vars.desktopSize, d ? (0, _cssJs.pxToRem)(d) : ""), _defineProperty(_obj2, _textCssMisticaJs.vars.desktopLineHeight, S ? (0, _cssJs.pxToRem)(S) : ""), _obj2)), O = m ? (0, _dynamic.assignInlineVars)(_defineProperty({}, _textCssMisticaJs.vars.lineClamp, String(V))) : {};
+    return /*#__PURE__*/ _react.createElement(w, _objectSpreadProps(_objectSpread({
+        className: D,
         id: P,
         role: y,
-        "aria-level": I
-    }, (0, _domJs.getPrefixedDataAttributes)(W)), {
-        style: _objectSpreadProps(_objectSpread({}, O, R), {
-            hyphens: w,
-            letterSpacing: T,
+        "aria-level": A
+    }, (0, _domJs.getPrefixedDataAttributes)(I)), {
+        style: _objectSpreadProps(_objectSpread({}, M, O), {
+            hyphens: z,
+            letterSpacing: H,
             fontWeight: e ? J[e] : "inherit",
-            textTransform: z || "inherit",
-            textDecoration: c != null ? c : "inherit",
-            overflowWrap: d ? "anywhere" : "inherit",
-            color: V && (b = D[t]) != null ? b : t,
+            textTransform: f || "inherit",
+            textDecoration: i != null ? i : "inherit",
+            overflowWrap: h ? "anywhere" : "inherit",
+            color: W && (k = C[t]) != null ? k : t,
             textAlign: v
         })
     }), g);
-}, m = function m(e) {
+}, l = function l(e) {
     if (e.light) return "light";
     if (e.regular) return "regular";
     if (e.medium) return "medium";
-}, re = function re(e) {
-    var ref = (0, _hooksJs.useTheme)(), t = ref.textPresets;
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+}, oe = function oe(_param) {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    var ref = (0, _hooksJs.useTheme)(), i = ref.textPresets;
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 32,
         mobileLineHeight: "40px",
         desktopSize: 64,
         desktopLineHeight: "72px",
-        weight: t.text10.weight
-    }, e), {
-        children: e.children
-    }));
-}, ne = function ne(e) {
-    var ref = (0, _hooksJs.useTheme)(), t = ref.textPresets;
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: i.text10.weight,
+        dataAttributes: _objectSpread({
+            "component-name": "Text10"
+        }, e)
+    }, t));
+}, ne = function ne(_param) {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    var ref = (0, _hooksJs.useTheme)(), i = ref.textPresets;
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 32,
         mobileLineHeight: "40px",
         desktopSize: 56,
         desktopLineHeight: "64px",
-        weight: t.text9.weight
-    }, e), {
-        children: e.children
-    }));
-}, oe = function oe(e) {
-    var ref = (0, _hooksJs.useTheme)(), t = ref.textPresets;
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: i.text9.weight,
+        dataAttributes: _objectSpread({
+            "component-name": "Text9"
+        }, e)
+    }, t));
+}, re = function re(_param) {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    var ref = (0, _hooksJs.useTheme)(), i = ref.textPresets;
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 32,
         mobileLineHeight: "40px",
         desktopSize: 48,
         desktopLineHeight: "56px",
-        weight: t.text8.weight
-    }, e), {
-        children: e.children
-    }));
-}, se = function se(e) {
-    var ref = (0, _hooksJs.useTheme)(), t = ref.textPresets;
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: i.text8.weight,
+        dataAttributes: _objectSpread({
+            "component-name": "Text8"
+        }, e)
+    }, t));
+}, se = function se(_param) {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    var ref = (0, _hooksJs.useTheme)(), i = ref.textPresets;
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 28,
         mobileLineHeight: "32px",
         desktopSize: 40,
         desktopLineHeight: "48px",
-        weight: t.text7.weight
-    }, e), {
-        children: e.children
-    }));
-}, le = function le(e) {
-    var ref = (0, _hooksJs.useTheme)(), t = ref.textPresets;
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: i.text7.weight,
+        dataAttributes: _objectSpread({
+            "component-name": "Text7"
+        }, e)
+    }, t));
+}, me = function me(_param) {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    var ref = (0, _hooksJs.useTheme)(), i = ref.textPresets;
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 24,
         mobileLineHeight: "32px",
         desktopSize: 32,
         desktopLineHeight: "40px",
-        weight: t.text6.weight
-    }, e), {
-        children: e.children
-    }));
-}, he = function he(e) {
-    var ref = (0, _hooksJs.useTheme)(), t = ref.textPresets;
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: i.text6.weight,
+        dataAttributes: _objectSpread({
+            "component-name": "Text6"
+        }, e)
+    }, t));
+}, xe = function xe(_param) {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    var ref = (0, _hooksJs.useTheme)(), i = ref.textPresets;
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 22,
         mobileLineHeight: "24px",
         desktopSize: 28,
         desktopLineHeight: "32px",
-        weight: t.text5.weight
-    }, e), {
-        children: e.children
-    }));
-}, xe = function xe(e) {
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: i.text5.weight,
+        dataAttributes: _objectSpread({
+            "component-name": "Text5"
+        }, e)
+    }, t));
+}, ae = function ae(_param) /* @__PURE__ */ {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    return (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 18,
         mobileLineHeight: "24px",
         desktopSize: 20,
         desktopLineHeight: "28px",
-        weight: m(e)
-    }, e), {
-        children: e.children
-    }));
-}, me = function me(e) {
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: l(t),
+        dataAttributes: _objectSpread({
+            "component-name": "Text4"
+        }, e)
+    }, t));
+}, pe = function pe(_param) /* @__PURE__ */ {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    return (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 16,
         desktopSize: 18,
         lineHeight: "24px",
-        weight: m(e)
-    }, e), {
-        children: e.children
-    }));
-}, ce = function ce(e) {
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: l(t),
+        dataAttributes: _objectSpread({
+            "component-name": "Text3"
+        }, e)
+    }, t));
+}, le = function le(_param) /* @__PURE__ */ {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    return (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 14,
         mobileLineHeight: "20px",
         desktopSize: 16,
         desktopLineHeight: "24px",
-        weight: m(e)
-    }, e), {
-        children: e.children
-    }));
-}, ge = function ge(e) {
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(r, _objectSpreadProps(_objectSpread({
+        weight: l(t),
+        dataAttributes: _objectSpread({
+            "component-name": "Text2"
+        }, e)
+    }, t));
+}, ge = function ge(_param) /* @__PURE__ */ {
+    var e = _param.dataAttributes, t = _objectWithoutProperties(_param, [
+        "dataAttributes"
+    ]);
+    return (0, _jsxRuntimeJs.jsx)(n, _objectSpread({
         mobileSize: 12,
         mobileLineHeight: "16px",
         desktopSize: 14,
         desktopLineHeight: "20px",
-        weight: m(e)
-    }, e), {
-        children: e.children
-    }));
+        weight: l(t),
+        dataAttributes: _objectSpread({
+            "component-name": "Text1"
+        }, e)
+    }, t));
 };