@telefonica/mistica 16.1.1 → 16.2.0

package/dist/text-field-components.css-mistica.js

@@ -18,45 +18,51 @@ _export(exports, {
     LABEL_SCALE_MOBILE: function() {
         return e;
     },
-    disabled: function() {
+    background: function() {
         return y;
     },
-    field: function() {
+    disabled: function() {
         return k;
     },
+    field: function() {
+        return l;
+    },
     fieldContainer: function() {
         return i;
     },
     fullWidth: function() {
-        return l;
+        return t;
     },
     helperContainer: function() {
         return h;
     },
     helperText: function() {
-        return t;
+        return o;
     },
     labelContainer: function() {
-        return o;
+        return u;
     },
     labelText: function() {
-        return p;
+        return d;
     },
     leftHelperText: function() {
-        return u;
+        return p;
     },
     normalWidth: function() {
         return L;
     },
     shrinked: function() {
-        return d;
+        return E;
     },
     warnIcon: function() {
-        return E;
+        return T;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./icon-button.css.ts.vanilla.css-mistica.js");
 require("./text-field-base.css.ts.vanilla.css-mistica.js");
 require("./text-field-components.css.ts.vanilla.css-mistica.js");
-var a = 328, f = 0.78, e = 0.75, y = "_15k6ur97", k = "_1y2v1nfkl _1y2v1nfk1 _1y2v1nfhk _1y2v1nfka _1y2v1nfhe", i = "_15k6ur96 _1y2v1nfhk _1y2v1nfhq", l = "_1y2v1nfi7", h = "_1y2v1nfa7 _1y2v1nfbj _1y2v1nfhk", t = "_1y2v1nfi5 _1y2v1nf7j", o = "_15k6ur91 _1y2v1nfhf _1y2v1nfhk _1y2v1nfhp", p = "_15k6ur93 _1y2v1nfkl _1y2v1nfi3", u = "_15k6ur9e _1y2v1nfhk", L = "_15k6ur99 _1y2v1nfi7", d = "_15k6ur94", E = "_15k6ur9g";
+var a = 328, f = 0.78, e = 0.75, y = {
+    default: "_1y2v1nf3q",
+    readOnly: "_1y2v1nf5k"
+}, k = "_15k6ur97", l = "_1y2v1nfkl _1y2v1nfk1 _1y2v1nfhk _1y2v1nfka _1y2v1nfhe", i = "_15k6ur96 _1y2v1nfhk _1y2v1nfhq", t = "_1y2v1nfi7", h = "_1y2v1nfa7 _1y2v1nfbj _1y2v1nfhk", o = "_1y2v1nfi5 _1y2v1nf7j", u = "_15k6ur91 _1y2v1nfhf _1y2v1nfhk _1y2v1nfhp", d = "_15k6ur93 _1y2v1nfkl _1y2v1nfi3", p = "_15k6ur9e _1y2v1nfhk", L = "_15k6ur99 _1y2v1nfi7", E = "_15k6ur94", T = "_15k6ur9g";

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

@@ -13,3 +13,4 @@ export declare const helperContainer: string;
 export declare const leftHelperText: string;
 export declare const helperText: string;
 export declare const warnIcon: string;
+export declare const background: Record<"default" | "readOnly", string>;

package/dist/text-field-components.js

@@ -11,13 +11,13 @@ function _export(target, all) {
 }
 _export(exports, {
     FieldContainer: function() {
-        return Z;
+        return Y;
     },
     HelperText: function() {
-        return Y;
+        return X;
     },
     Label: function() {
-        return X;
+        return U;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -27,7 +27,6 @@ const _themevariantcontext = require("./theme-variant-context.js");
 const _hooks = require("./hooks.js");
 const _text = require("./text.js");
 const _textfieldcomponentscssmistica = require("./text-field-components.css-mistica.js");
-const _sprinklescssmistica = require("./sprinkles.css-mistica.js");
 const _skincontractcssmistica = require("./skins/skin-contract.css-mistica.js");
 const _dom = require("./utils/dom.js");
 const _texttokens = require("./text-tokens.js");
@@ -130,26 +129,26 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const X = (param)=>{
-    let { shrinkLabel: t, forId: l, inputState: e, error: s, children: i, style: n, optional: a } = param;
-    const f = t || e === "focused" || e === "filled", [u, p] = _react.useState("initial"), { texts: d, t: N } = (0, _hooks.useTheme)();
+const U = (param)=>{
+    let { shrinkLabel: o, forId: l, inputState: e, error: s, children: i, style: a, optional: n } = param;
+    const f = o || e === "focused" || e === "filled", [u, h] = _react.useState("initial"), { texts: d, t: y } = (0, _hooks.useTheme)();
     _react.useEffect(()=>{
-        const y = setTimeout(()=>{
-            process.env.NODE_ENV !== "test" && p("transform 150ms, width 150ms");
+        const N = setTimeout(()=>{
+            process.env.NODE_ENV !== "test" && h("transform 150ms, width 150ms");
         });
         return ()=>{
-            clearTimeout(y);
+            clearTimeout(N);
         };
     }, []);
-    let h = _skincontractcssmistica.vars.colors.textSecondary;
-    return s && e !== "default" ? h = _skincontractcssmistica.vars.colors.textError : e === "focused" && (h = _skincontractcssmistica.vars.colors.textActivated), /* @__PURE__ */ (0, _jsxruntime.jsxs)("label", {
+    let p = _skincontractcssmistica.vars.colors.textSecondary;
+    return s && e !== "default" ? p = _skincontractcssmistica.vars.colors.textError : e === "focused" && (p = _skincontractcssmistica.vars.colors.textActivated), /* @__PURE__ */ (0, _jsxruntime.jsxs)("label", {
         className: (0, _classnames.default)(_textfieldcomponentscssmistica.labelContainer, {
             [_textfieldcomponentscssmistica.shrinked]: f
-        }, (0, _sprinklescssmistica.sprinkles)({
-            color: h
-        })),
+        }),
         htmlFor: l,
-        style: _object_spread_props(_object_spread({}, n), {
+        style: _object_spread_props(_object_spread({
+            color: p
+        }, a), {
             transition: u
         }),
         children: [
@@ -157,42 +156,42 @@ const X = (param)=>{
                 className: _textfieldcomponentscssmistica.labelText,
                 children: i
             }),
-            a ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("span", {
+            n ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("span", {
                 children: [
                     "\xa0(",
-                    d.formFieldOptionalLabelSuffix || N(_texttokens.formFieldOptionalLabelSuffix),
+                    d.formFieldOptionalLabelSuffix || y(_texttokens.formFieldOptionalLabelSuffix),
                     ")"
                 ]
             }) : null
         ]
     });
-}, Y = (param)=>{
-    let { leftText: t, rightText: l, error: e, id: s } = param;
-    const i = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), n = i ? _skincontractcssmistica.vars.colors.textPrimaryInverse : e ? _skincontractcssmistica.vars.colors.textError : _skincontractcssmistica.vars.colors.textSecondary, a = i ? _skincontractcssmistica.vars.colors.textPrimaryInverse : _skincontractcssmistica.vars.colors.textSecondary;
+}, X = (param)=>{
+    let { leftText: o, rightText: l, error: e, id: s } = param;
+    const i = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), a = i ? _skincontractcssmistica.vars.colors.textPrimaryInverse : e ? _skincontractcssmistica.vars.colors.textError : _skincontractcssmistica.vars.colors.textSecondary, n = i ? _skincontractcssmistica.vars.colors.textPrimaryInverse : _skincontractcssmistica.vars.colors.textSecondary;
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            t && /* @__PURE__ */ (0, _jsxruntime.jsxs)("p", {
+            o && /* @__PURE__ */ (0, _jsxruntime.jsxs)("p", {
                 className: (0, _classnames.default)(_textfieldcomponentscssmistica.helperText, _textfieldcomponentscssmistica.leftHelperText),
                 children: [
                     e && /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text1, {
                         regular: !0,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconwarningregular.default, {
-                            color: n,
+                            color: a,
                             className: _textfieldcomponentscssmistica.warnIcon
                         })
                     }),
                     /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text1, {
-                        color: n,
+                        color: a,
                         regular: !0,
                         id: s,
-                        children: t
+                        children: o
                     })
                 ]
             }),
             l && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)(_textfieldcomponentscssmistica.helperText),
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text1, {
-                    color: a,
+                    color: n,
                     regular: !0,
                     as: "p",
                     textAlign: "right",
@@ -201,23 +200,21 @@ const X = (param)=>{
             })
         ]
     });
-}, Z = (param)=>{
-    let { multiline: t, disabled: l, children: e, helperText: s, className: i, fieldRef: n, fullWidth: a, readOnly: f, dataAttributes: u } = param;
+}, Y = (param)=>{
+    let { multiline: o, disabled: l, children: e, helperText: s, className: i, fieldRef: a, fullWidth: n, readOnly: f, dataAttributes: u } = param;
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({
-        className: (0, _classnames.default)(_textfieldcomponentscssmistica.fieldContainer, a ? _textfieldcomponentscssmistica.fullWidth : _textfieldcomponentscssmistica.normalWidth, {
+        className: (0, _classnames.default)(_textfieldcomponentscssmistica.fieldContainer, n ? _textfieldcomponentscssmistica.fullWidth : _textfieldcomponentscssmistica.normalWidth, {
             [_textfieldcomponentscssmistica.disabled]: l
         }),
-        onClick: (p)=>{
+        onClick: (h)=>{
             var d;
-            (d = p.currentTarget.querySelector(t ? "textarea" : "input")) == null || d.focus();
+            (d = h.currentTarget.querySelector(o ? "textarea" : "input")) == null || d.focus();
         }
     }, (0, _dom.getPrefixedDataAttributes)(u)), {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                className: (0, _classnames.default)(_textfieldcomponentscssmistica.field, (0, _sprinklescssmistica.sprinkles)({
-                    background: f ? _skincontractcssmistica.vars.colors.neutralLow : _skincontractcssmistica.vars.colors.backgroundContainer
-                }), i),
-                ref: n,
+                className: (0, _classnames.default)(_textfieldcomponentscssmistica.field, f ? _textfieldcomponentscssmistica.background.readOnly : _textfieldcomponentscssmistica.background.default, i),
+                ref: a,
                 children: e
             }),
             s && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {

package/dist/timer.js

@@ -11,16 +11,15 @@ function _export(target, all) {
 }
 _export(exports, {
     TextTimer: function() {
-        return Oe;
+        return Re;
     },
     Timer: function() {
-        return Ee;
+        return _e;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
 const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
-const _box = /*#__PURE__*/ _interop_require_default(require("./box.js"));
 const _hooks = require("./hooks.js");
 const _inline = /*#__PURE__*/ _interop_require_default(require("./inline.js"));
 const _screenreaderonly = /*#__PURE__*/ _interop_require_default(require("./screen-reader-only.js"));
@@ -129,7 +128,7 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s, a, o, i)=>{
+const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, ge = $ * P, H = (s, a, o, i)=>{
     a = i === "none" && a === "days" ? "hours" : a, o = i === "none" && o === "days" ? "hours" : o;
     const c = [
         "seconds",
@@ -168,20 +167,20 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
     }, [
         s
     ]);
-    const e = H("days", o, i, a), t = H("hours", o, i, a), p = H("minutes", o, i, a), l = e ? "days" : t ? "hours" : p ? "minutes" : "seconds", g = Math.floor(L / P) % 24, M = Math.floor(L / Z) % 60, D = Math.floor(L / C) % 60, h = Math.floor(L / Se), S = l === "hours" ? g + h * $ : g, f = l === "minutes" ? M + V * (h * $ + S) : M, r = l === "seconds" ? D + X * (h * $ * V + S * V + f) : D, [n, d] = _react.useState(W({
+    const e = H("days", o, i, a), t = H("hours", o, i, a), p = H("minutes", o, i, a), l = e ? "days" : t ? "hours" : p ? "minutes" : "seconds", g = Math.floor(L / P) % 24, M = Math.floor(L / Z) % 60, D = Math.floor(L / C) % 60, h = Math.floor(L / ge), S = l === "hours" ? g + h * $ : g, y = l === "minutes" ? M + V * (h * $ + S) : M, n = l === "seconds" ? D + X * (h * $ * V + S * V + y) : D, [r, d] = _react.useState(W({
         days: h,
         hours: S,
-        minutes: f,
-        seconds: r
+        minutes: y,
+        seconds: n
     }, o, i, a));
     return _react.useEffect(()=>{
         const u = W({
             days: h,
             hours: S,
-            minutes: f,
-            seconds: r
+            minutes: y,
+            seconds: n
         }, o, i, a);
-        if (!(0, _helpers.isEqual)(u, n)) {
+        if (!(0, _helpers.isEqual)(u, r)) {
             d(u);
             const N = {};
             u.forEach((I)=>N[I.unit] = I.value), c == null || c(N);
@@ -189,15 +188,15 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
     }, [
         h,
         S,
-        f,
-        r,
+        y,
+        n,
         a,
         o,
         i,
-        n,
+        r,
         c
-    ]), n;
-}, Oe = (param)=>{
+    ]), r;
+}, Re = (param)=>{
     let { endTimestamp: s, labelType: a = "none", minTimeUnit: o, maxTimeUnit: i, onProgress: c, dataAttributes: L, "aria-label": b } = param;
     const { texts: e, t } = (0, _hooks.useTheme)(), p = _react.useId(), l = U({
         endTimestamp: s,
@@ -220,50 +219,50 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
         hours: e.timerHoursLongLabel || t(_texttokens.timerHoursLongLabel),
         minutes: e.timerMinutesLongLabel || t(_texttokens.timerMinutesLongLabel),
         seconds: e.timerSecondsLongLabel || t(_texttokens.timerSecondsLongLabel)
-    }, h = (r)=>{
-        const n = Math.max(String(r).length, a === "long" ? 1 : 2);
+    }, h = (n)=>{
+        const r = Math.max(String(n).length, a === "long" ? 1 : 2);
         return /* @__PURE__ */ (0, _jsxruntime.jsx)("span", {
             className: _timercssmistica.unitContainer,
             style: {
-                minWidth: `${n}ch`
+                minWidth: `${r}ch`
             },
-            children: String(r).padStart(n, "0")
+            children: String(n).padStart(r, "0")
         });
     }, S = ()=>{
         switch(a){
             case "none":
-                return l.map((r, n)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)(_react.Fragment, {
+                return l.map((n, r)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)(_react.Fragment, {
                         children: [
-                            n > 0 && ":",
-                            h(r.value)
+                            r > 0 && ":",
+                            h(n.value)
                         ]
-                    }, n));
+                    }, r));
             case "short":
-                return l.map((r, n)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)(_react.Fragment, {
+                return l.map((n, r)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)(_react.Fragment, {
                         children: [
-                            n > 0 && " ",
+                            r > 0 && " ",
                             /* @__PURE__ */ (0, _jsxruntime.jsxs)("span", {
                                 className: _timercssmistica.shortLabelText,
                                 children: [
-                                    h(r.value),
-                                    ` ${g[r.unit]}`
+                                    h(n.value),
+                                    ` ${g[n.unit]}`
                                 ]
                             })
                         ]
-                    }, n));
+                    }, r));
             case "long":
             default:
-                return l.map((r, n)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)(_react.Fragment, {
+                return l.map((n, r)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)(_react.Fragment, {
                         children: [
-                            n > 0 && " ",
-                            h(r.value),
-                            ` ${r.value === 1 ? M[r.unit] : D[r.unit]}`,
-                            n === l.length - 2 && ` ${e.timerAnd || t(_texttokens.timerAnd)}`,
-                            n < l.length - 2 && ","
+                            r > 0 && " ",
+                            h(n.value),
+                            ` ${n.value === 1 ? M[n.unit] : D[n.unit]}`,
+                            r === l.length - 2 && ` ${e.timerAnd || t(_texttokens.timerAnd)}`,
+                            r < l.length - 2 && ","
                         ]
-                    }, n));
+                    }, r));
         }
-    }, f = l.map((r, n)=>`${r.value} ${r.value === 1 ? M[r.unit] : D[r.unit]}${n === l.length - 1 ? "" : n === l.length - 2 ? ` ${e.timerAnd || t(_texttokens.timerAnd)} ` : ", "}`).join("");
+    }, y = l.map((n, r)=>`${n.value} ${n.value === 1 ? M[n.unit] : D[n.unit]}${r === l.length - 1 ? "" : r === l.length - 2 ? ` ${e.timerAnd || t(_texttokens.timerAnd)} ` : ", "}`).join("");
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)("span", _object_spread_props(_object_spread({
         role: "timer",
         "aria-labelledby": p,
@@ -277,7 +276,7 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_screenreaderonly.default, {
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("span", {
                     id: p,
-                    children: b ? `${b}. ${f}` : f
+                    children: b ? `${b}. ${y}` : y
                 })
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("span", {
@@ -287,7 +286,7 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
             })
         ]
     }));
-}, Ee = (param)=>{
+}, _e = (param)=>{
     let { boxed: s, endTimestamp: a, minTimeUnit: o, maxTimeUnit: i, onProgress: c, dataAttributes: L, "aria-label": b } = param;
     const { texts: e, t } = (0, _hooks.useTheme)(), p = _react.useId(), l = (0, _themevariantcontext.useThemeVariant)(), g = U({
         endTimestamp: a,
@@ -314,7 +313,7 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
         hours: e.timerHoursLongLabel || t(_texttokens.timerHoursLongLabel),
         minutes: e.timerMinutesLongLabel || t(_texttokens.timerMinutesLongLabel),
         seconds: e.timerSecondsLongLabel || t(_texttokens.timerSecondsLongLabel)
-    }, f = (d)=>{
+    }, y = (d)=>{
         const u = Math.max(String(d).length, 2);
         return /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text6, {
             children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
@@ -325,7 +324,7 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
                 children: String(d).padStart(u, "0")
             })
         });
-    }, r = g.map((d, u)=>`${d.value} ${d.value === 1 ? h[d.unit] : S[d.unit]}${u === g.length - 1 ? "" : u === g.length - 2 ? ` ${e.timerAnd || t(_texttokens.timerAnd)} ` : ", "}`).join(""), n = ()=>g.map((d, u)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
+    }, n = g.map((d, u)=>`${d.value} ${d.value === 1 ? h[d.unit] : S[d.unit]}${u === g.length - 1 ? "" : u === g.length - 2 ? ` ${e.timerAnd || t(_texttokens.timerAnd)} ` : ", "}`).join(""), r = ()=>g.map((d, u)=>/* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)({
                     [_timercssmistica.boxedTimerValueContainer[l]]: s
                 }),
@@ -336,7 +335,7 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
                             [_timercssmistica.boxedTimerDisplayValue]: s
                         }),
                         children: [
-                            f(d.value),
+                            y(d.value),
                             /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
                                 regular: !0,
                                 children: d.value === 1 ? M[d.unit] : D[d.unit]
@@ -354,7 +353,7 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_screenreaderonly.default, {
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("span", {
                     id: p,
-                    children: b ? `${b}. ${r}` : r
+                    children: b ? `${b}. ${n}` : n
                 })
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
@@ -362,7 +361,7 @@ const $ = 24, V = 60, X = 60, C = 1e3, Z = X * C, P = V * Z, Se = $ * P, H = (s,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_inline.default, {
                     space: s ? 8 : 16,
                     wrap: !0,
-                    children: n()
+                    children: r()
                 })
             })
         ]

package/dist/tooltip.d.ts

@@ -6,6 +6,7 @@ type Props = {
     extra?: React.ReactNode;
     description?: string;
     target: React.ReactNode;
+    targetStyle?: React.CSSProperties;
     title?: string;
     position?: Position;
     width?: number;
@@ -17,6 +18,7 @@ type Props = {
 type BaseTooltipProps = {
     content?: React.ReactNode;
     target: React.ReactNode;
+    targetStyle?: React.CSSProperties;
     position?: Position;
     width?: number;
     delay?: boolean;
@@ -28,6 +30,6 @@ type BaseTooltipProps = {
     closeButtonLabel?: string;
     trackingEvent?: TrackingEvent | ReadonlyArray<TrackingEvent>;
 };
-export declare const BaseTooltip: ({ content, target, width, position, dataAttributes, delay, centerContent, open, onClose, closeButtonLabel, hasPointerInteractionOnly, trackingEvent, }: BaseTooltipProps) => JSX.Element;
+export declare const BaseTooltip: ({ content, target, targetStyle, width, position, dataAttributes, delay, centerContent, open, onClose, closeButtonLabel, hasPointerInteractionOnly, trackingEvent, }: BaseTooltipProps) => JSX.Element;
 declare const Tooltip: ({ centerContent, extra, children, dataAttributes, title, description, ...props }: Props) => JSX.Element;
 export default Tooltip;