@telefonica/mistica 14.33.0 → 14.35.0

package/dist-es/feedback.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -101,7 +102,7 @@ import { vars as d } from "./skins/skin-contract.css-mistica.js";
 import { innerContainer as M, iconContainer as ve, feedbackData as Fe, feedbackDataAppear as A, feedbackDataAppearActiveFast as Ie, feedbackDataAppearActiveMedium as _, feedbackDataAppearActiveSlow as Ae, desktopContainer as Be, desktopContent as Ne, container as xe } from "./feedback.css-mistica.js";
 import G from "./icons/icon-success-vivo-new.js";
 const P = (r)=>!be(r), U = (param)=>{
-    let { primaryButton: r , secondaryButton: o  } = param;
+    let { primaryButton: r, secondaryButton: o } = param;
     return !!r || !!o;
 }, ye = ()=>{
     const o = `body {background:${ie() ? d.colors.backgroundBrand : d.colors.background}}`;
@@ -128,7 +129,7 @@ const P = (r)=>!be(r), U = (param)=>{
         return ()=>window.cancelAnimationFrame(t);
     }, []), r;
 }, X = (param, n, s)=>{
-    let { icon: r , title: o , description: t , extra: c  } = param;
+    let { icon: r, title: o, description: t, extra: c } = param;
     const a = t && Array.isArray(t) ? /* @__PURE__ */ e(b, {
         space: 16,
         children: t.map((m, u)=>/* @__PURE__ */ e("p", {
@@ -179,7 +180,7 @@ const P = (r)=>!be(r), U = (param)=>{
         ]
     });
 }, Z = (param)=>/* @__PURE__ */ {
-    let { isInverse: r , inlineFeedbackBody: o , imageFit: t , imageUrl: c , dataAttributes: n  } = param;
+    let { isInverse: r, inlineFeedbackBody: o, imageFit: t, imageUrl: c, dataAttributes: n } = param;
     return l(Se, {
         className: Be,
         isInverse: r,
@@ -205,9 +206,9 @@ const P = (r)=>!be(r), U = (param)=>{
         ]
     });
 }, V = (param)=>{
-    let { title: r , description: o , children: t , extra: c , primaryButton: n , secondaryButton: s , link: a , hapticFeedback: m , icon: u , animateText: f = !1 , isInverse: i = !1 , unstable_inlineInDesktop: h , imageUrl: g , imageFit: v , dataAttributes: C  } = param;
+    let { title: r, description: o, children: t, extra: c, primaryButton: n, secondaryButton: s, link: a, hapticFeedback: m, icon: u, animateText: f = !1, isInverse: i = !1, unstable_inlineInDesktop: h, imageUrl: g, imageFit: v, dataAttributes: C } = param;
     J(m);
-    const { platformOverrides: F , isDarkMode: p , skinName: z  } = N(), ee = se(), { isTabletOrSmaller: I  } = x(), [oe, re] = S.useState(typeof self < "u"), [w, te] = S.useState(0), T = oe ? "100vh" : `${ee - w}px`, D = U({
+    const { platformOverrides: F, isDarkMode: p, skinName: z } = N(), ee = se(), { isTabletOrSmaller: I } = x(), [oe, re] = S.useState(typeof self < "u"), [w, te] = S.useState(0), T = oe ? "100vh" : `${ee - w}px`, D = U({
         primaryButton: n,
         secondaryButton: s,
         link: a
@@ -282,10 +283,10 @@ const P = (r)=>!be(r), U = (param)=>{
         })
     });
 }, Qe = (_param)=>{
-    var { dataAttributes: r  } = _param, o = _object_without_properties(_param, [
+    var { dataAttributes: r } = _param, o = _object_without_properties(_param, [
         "dataAttributes"
     ]);
-    const { isTabletOrSmaller: t  } = x(), { skinName: c  } = N();
+    const { isTabletOrSmaller: t } = x(), { skinName: c } = N();
     return /* @__PURE__ */ e(V, _object_spread_props(_object_spread({}, o), {
         isInverse: !o.unstable_inlineInDesktop || t,
         hapticFeedback: "success",
@@ -304,7 +305,7 @@ const P = (r)=>!be(r), U = (param)=>{
         }, r)
     }));
 }, Xe = (_param)=>/* @__PURE__ */ {
-    var { children: r , errorReference: o , dataAttributes: t  } = _param, c = _object_without_properties(_param, [
+    var { children: r, errorReference: o, dataAttributes: t } = _param, c = _object_without_properties(_param, [
         "children",
         "errorReference",
         "dataAttributes"
@@ -331,7 +332,7 @@ const P = (r)=>!be(r), U = (param)=>{
         })
     }));
 }, Ye = (_param)=>/* @__PURE__ */ {
-    var { dataAttributes: r , Icon: o = me  } = _param, t = _object_without_properties(_param, [
+    var { dataAttributes: r, Icon: o = me } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "Icon"
     ]);
@@ -344,9 +345,9 @@ const P = (r)=>!be(r), U = (param)=>{
         })
     }, t));
 }, Ze = (param)=>{
-    let { title: r , description: o , children: t , extra: c , primaryButton: n , secondaryButton: s , link: a , imageUrl: m , imageFit: u , dataAttributes: f  } = param;
+    let { title: r, description: o, children: t, extra: c, primaryButton: n, secondaryButton: s, link: a, imageUrl: m, imageFit: u, dataAttributes: f } = param;
     J("success");
-    const { isTabletOrSmaller: i  } = x(), { skinName: h , platformOverrides: g  } = N(), v = Q(), F = X({
+    const { isTabletOrSmaller: i } = x(), { skinName: h, platformOverrides: g } = N(), v = Q(), F = X({
         icon: h === W ? /* @__PURE__ */ e(j, {
             size: "100%"
         }) : h === K ? /* @__PURE__ */ e(G, {

package/dist-es/fixed-footer-layout.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -55,20 +56,19 @@ import * as l from "react";
 import W from "classnames";
 import { debounce as $ } from "./utils/helpers.js";
 import { isRunningAcceptanceTest as k } from "./utils/platform.js";
-import { useScreenSize as z, useTheme as N, useElementDimensions as P, useWindowHeight as j, useScreenHeight as B, useIsomorphicLayoutEffect as _, useIsWithinIFrame as H } from "./hooks.js";
+import { useScreenSize as z, useTheme as N, useElementDimensions as P, useIsWithinIFrame as j, useWindowHeight as B, useScreenHeight as _, useIsomorphicLayoutEffect as H } from "./hooks.js";
 import { getScrollableParentElement as V, addPassiveEventListener as v, removePassiveEventListener as h, hasScroll as q, getScrollDistanceToBottom as G } from "./utils/dom.js";
 import { container as J, vars as E, footer as K, withoutFooter as M, elevated as Q, fixedFooter as U } from "./fixed-footer-layout.css-mistica.js";
-import { assignInlineVars as X } from "@vanilla-extract/dynamic";
-import { safeAreaInsetBottom as x } from "./utils/css.js";
+import { applyCssVars as X, safeAreaInsetBottom as x } from "./utils/css.js";
 const Y = 2, Z = (e)=>e === document.documentElement ? window : e, C = (e)=>{
     const n = setTimeout(e, 0);
     return {
         cancel: ()=>clearTimeout(n)
     };
 }, ee = (param)=>{
-    let { isFooterVisible: e = !0 , footer: n , footerHeight: S = "auto" , footerBgColor: T , containerBgColor: m , children: g , onChangeFooterHeight: o  } = param;
-    const [y, w] = l.useState(!1), d = l.useRef(null), { isTabletOrSmaller: F  } = z(), { platformOverrides: u  } = N(), { height: s , ref: I  } = P(), b = H(), f = j(), A = B(), i = f - s > (b ? f : A) / Y;
-    _(()=>{
+    let { isFooterVisible: e = !0, footer: n, footerHeight: S = "auto", footerBgColor: T, containerBgColor: m, children: y, onChangeFooterHeight: o } = param;
+    const [g, w] = l.useState(!1), d = l.useRef(null), { isTabletOrSmaller: F } = z(), { platformOverrides: u } = N(), { height: s, ref: I } = P(), b = j(), f = B(), A = _(), i = f - s > (b ? f : A) / Y;
+    H(()=>{
         o == null || o(s);
     }, [
         o,
@@ -98,12 +98,12 @@ const Y = 2, Z = (e)=>e === document.documentElement ? window : e, C = (e)=>{
                 }), {
                     [E.footerHeight]: p ? `calc(${x} + ${s}px)` : "0px"
                 })),
-                children: g
+                children: y
             }),
             /* @__PURE__ */ c("div", {
                 className: W(K, {
                     [M]: !e,
-                    [Q]: y,
+                    [Q]: g,
                     [U]: p
                 }),
                 style: {
@@ -123,5 +123,5 @@ const Y = 2, Z = (e)=>e === document.documentElement ? window : e, C = (e)=>{
             })
         ]
     });
-}, me = ee;
-export { me as default };
+}, le = ee;
+export { le as default };

package/dist-es/fixed-to-top.js

@@ -1,7 +1,8 @@
+"use client";
 import { jsx as s } from "react/jsx-runtime";
 import * as e from "react";
 const t = /*#__PURE__*/ e.createContext(0), c = (param)=>{
-    let { children: r , height: n  } = param;
+    let { children: r, height: n } = param;
     const o = e.useContext(t);
     return /* @__PURE__ */ s(t.Provider, {
         value: o + n,

package/dist-es/focus-trap.js

@@ -1,7 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
 import u from "react-focus-lock";
 const a = (param)=>/* @__PURE__ */ {
-    let { children: o , disabled: r , className: s , group: c  } = param;
+    let { children: o, disabled: r, className: s, group: c } = param;
     return t(u, {
         noFocusGuards: !0,
         disabled: r,

package/dist-es/form-context.js

@@ -1,3 +1,4 @@
+"use client";
 import * as R from "react";
 const k = /*#__PURE__*/ R.createContext({
     values: {},
@@ -13,8 +14,8 @@ const k = /*#__PURE__*/ R.createContext({
     validate: ()=>({}),
     formId: ""
 }), P = ()=>R.useContext(k), y = (param)=>{
-    let { name: r , value: t , defaultValue: o , onChange: e , disabled: p  } = param;
-    const { setRawValue: f , setValue: c , rawValues: l , setFormError: d , register: u , formStatus: w  } = P();
+    let { name: r, value: t, defaultValue: o, onChange: e, disabled: p } = param;
+    const { setRawValue: f, setValue: c, rawValues: l, setFormError: d, register: u, formStatus: w } = P();
     var _l_r;
     return R.useEffect(()=>{
         if (l[r] === void 0) {
@@ -57,9 +58,9 @@ const k = /*#__PURE__*/ R.createContext({
         disabled: w === "sending" || p
     };
 }, z = (param)=>{
-    let { name: r , value: t , defaultValue: o , processValue: e , helperText: p , optional: f , error: c , disabled: l , onBlur: d , validate: u , onChange: w , onChangeValue: s  } = param;
+    let { name: r, value: t, defaultValue: o, processValue: e, helperText: p, optional: f, error: c, disabled: l, onBlur: d, validate: u, onChange: w, onChangeValue: s } = param;
     var _ref, _ref1;
-    const { setRawValue: E , setValue: V , rawValues: v , values: j , formErrors: b , formStatus: q , setFormError: S , register: I  } = P(), x = (_ref1 = (_ref = t !== null && t !== void 0 ? t : o) !== null && _ref !== void 0 ? _ref : v[r]) !== null && _ref1 !== void 0 ? _ref1 : "", N = R.useRef(e);
+    const { setRawValue: E, setValue: V, rawValues: v, values: j, formErrors: b, formStatus: q, setFormError: S, register: I } = P(), x = (_ref1 = (_ref = t !== null && t !== void 0 ? t : o) !== null && _ref !== void 0 ? _ref : v[r]) !== null && _ref1 !== void 0 ? _ref1 : "", N = R.useRef(e);
     var _v_r;
     return R.useEffect(()=>{
         E({

package/dist-es/form.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -58,27 +59,27 @@ import B from "classnames";
 import { sprinkles as L } from "./sprinkles.css-mistica.js";
 process.env.NODE_ENV !== "test" && typeof document < "u" && !("scrollBehavior" in document.documentElement.style) && import("scroll-behavior-polyfill").finally(()=>{});
 const W = (param)=>{
-    let { children: S , className: x , onSubmit: b , initialValues: h = {} , autoJump: k = !1 , onValidationErrors: a , id: C  } = param;
-    const f = n.useRef(!0), [i, E] = n.useState(h), [l, I] = n.useState(h), [w, m] = n.useState("filling"), [V, y] = n.useState({}), c = n.useRef(/* @__PURE__ */ new Map()), d = n.useRef(null), { texts: g  } = A(), v = _(C);
+    let { children: S, className: x, onSubmit: b, initialValues: h = {}, autoJump: k = !1, onValidationErrors: a, id: C } = param;
+    const f = n.useRef(!0), [i, E] = n.useState(h), [l, I] = n.useState(h), [w, m] = n.useState("filling"), [V, y] = n.useState({}), c = n.useRef(/* @__PURE__ */ new Map()), d = n.useRef(null), { texts: g } = A(), v = _(C);
     n.useEffect(()=>(f.current = !0, ()=>{
             f.current = !1;
         }), []);
     const j = n.useCallback((e, param)=>{
-        let { input: r , validator: o , focusableElement: t  } = param;
+        let { input: r, validator: o, focusableElement: t } = param;
         r || t ? c.current.set(e, {
             input: r,
             validator: o,
             focusableElement: t
         }) : c.current.delete(e);
     }, []), P = (param)=>{
-        let { name: e , error: r  } = param;
+        let { name: e, error: r } = param;
         return y((o)=>_object_spread_props(_object_spread({}, o), {
                 [e]: r
             }));
     }, p = n.useCallback(()=>{
         var o;
         const e = {};
-        for (const [t, { input: s , validator: u  }] of c.current)if (s) {
+        for (const [t, { input: s, validator: u }] of c.current)if (s) {
             if (s.disabled) continue;
             if (s.required && !((o = l[t]) != null && o.trim())) e[t] = g.formFieldErrorIsMandatory;
             else {
@@ -134,12 +135,12 @@ const W = (param)=>{
         p,
         i
     ]), D = n.useCallback((param)=>{
-        let { name: e , value: r  } = param;
+        let { name: e, value: r } = param;
         E((o)=>_object_spread_props(_object_spread({}, o), {
                 [e]: r
             }));
     }, []), M = n.useCallback((param)=>{
-        let { name: e , value: r  } = param;
+        let { name: e, value: r } = param;
         I((o)=>_object_spread_props(_object_spread({}, o), {
                 [e]: r
             }));

package/dist-es/generated/mistica-icons/icon-2-g-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as i } from "../../theme-variant-context.js";
 import { vars as r } from "../../skins/skin-contract.css-mistica.js";
 const n = (_param)=>{
-    var { color: e , size: a = 24  } = _param, l = _object_without_properties(_param, [
+    var { color: e, size: a = 24 } = _param, l = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-2-g-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as r } from "react/jsx-runtime";
 import { useIsInverseVariant as t } from "../../theme-variant-context.js";
 import { vars as v } from "../../skins/skin-contract.css-mistica.js";
 const s = (_param)=>{
-    var { color: o , size: a = 24  } = _param, h = _object_without_properties(_param, [
+    var { color: o, size: a = 24 } = _param, h = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-3-d-view-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsxs as c, jsx as r } from "react/jsx-runtime";
 import { useIsInverseVariant as n } from "../../theme-variant-context.js";
 import { vars as e } from "../../skins/skin-contract.css-mistica.js";
 const v = (_param)=>{
-    var { color: i , size: o = 24  } = _param, s = _object_without_properties(_param, [
+    var { color: i, size: o = 24 } = _param, s = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-3-d-view-light.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsxs as c, jsx as t } from "react/jsx-runtime";
 import { useIsInverseVariant as n } from "../../theme-variant-context.js";
 import { vars as s } from "../../skins/skin-contract.css-mistica.js";
 const a = (_param)=>{
-    var { color: e , size: o = 24  } = _param, i = _object_without_properties(_param, [
+    var { color: e, size: o = 24 } = _param, i = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-3-d-view-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as a } from "../../theme-variant-context.js";
 import { vars as e } from "../../skins/skin-contract.css-mistica.js";
 const i = (_param)=>{
-    var { color: l , size: r = 24  } = _param, t = _object_without_properties(_param, [
+    var { color: l, size: r = 24 } = _param, t = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-3-g-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as c } from "../../theme-variant-context.js";
 import { vars as r } from "../../skins/skin-contract.css-mistica.js";
 const i = (_param)=>{
-    var { color: e , size: a = 24  } = _param, l = _object_without_properties(_param, [
+    var { color: e, size: a = 24 } = _param, l = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-3-g-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as r } from "react/jsx-runtime";
 import { useIsInverseVariant as s } from "../../theme-variant-context.js";
 import { vars as v } from "../../skins/skin-contract.css-mistica.js";
 const t = (_param)=>{
-    var { color: o , size: a = 24  } = _param, c = _object_without_properties(_param, [
+    var { color: o, size: a = 24 } = _param, c = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-4-g-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -82,11 +83,11 @@ import { useTheme as s } from "../../hooks.js";
 import { useIsInverseVariant as n } from "../../theme-variant-context.js";
 import { vars as r } from "../../skins/skin-contract.css-mistica.js";
 const c = (_param)=>{
-    var { color: l , size: a = 24  } = _param, o = _object_without_properties(_param, [
+    var { color: l, size: a = 24 } = _param, o = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const t = n(), e = l !== null && l !== void 0 ? l : t ? r.colors.inverse : r.colors.neutralHigh, { skinName: i  } = s();
+    const t = n(), e = l !== null && l !== void 0 ? l : t ? r.colors.inverse : r.colors.neutralHigh, { skinName: i } = s();
     return i.match(/^blau/i) ? /* @__PURE__ */ h("svg", _object_spread_props(_object_spread({
         width: a,
         height: a,

package/dist-es/generated/mistica-icons/icon-4-g-light.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsxs as h, jsx as t } from "react/jsx-runtime";
 import { useIsInverseVariant as l } from "../../theme-variant-context.js";
 import { vars as s } from "../../skins/skin-contract.css-mistica.js";
 const n = (_param)=>{
-    var { color: a , size: o = 24  } = _param, e = _object_without_properties(_param, [
+    var { color: a, size: o = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-4-g-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -82,11 +83,11 @@ import { useTheme as i } from "../../hooks.js";
 import { useIsInverseVariant as s } from "../../theme-variant-context.js";
 import { vars as e } from "../../skins/skin-contract.css-mistica.js";
 const n = (_param)=>{
-    var { color: o , size: h = 24  } = _param, r = _object_without_properties(_param, [
+    var { color: o, size: h = 24 } = _param, r = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const t = s(), v = o !== null && o !== void 0 ? o : t ? e.colors.inverse : e.colors.neutralHigh, { skinName: c  } = i();
+    const t = s(), v = o !== null && o !== void 0 ? o : t ? e.colors.inverse : e.colors.neutralHigh, { skinName: c } = i();
     return c.match(/^blau/i) ? /* @__PURE__ */ a("svg", _object_spread_props(_object_spread({
         width: h,
         height: h,

package/dist-es/generated/mistica-icons/icon-5-g-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -82,11 +83,11 @@ import { useTheme as l } from "../../hooks.js";
 import { useIsInverseVariant as n } from "../../theme-variant-context.js";
 import { vars as r } from "../../skins/skin-contract.css-mistica.js";
 const s = (_param)=>{
-    var { color: c , size: a = 24  } = _param, o = _object_without_properties(_param, [
+    var { color: c, size: a = 24 } = _param, o = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const t = n(), h = c !== null && c !== void 0 ? c : t ? r.colors.inverse : r.colors.neutralHigh, { skinName: i  } = l();
+    const t = n(), h = c !== null && c !== void 0 ? c : t ? r.colors.inverse : r.colors.neutralHigh, { skinName: i } = l();
     return i.match(/^blau/i) ? /* @__PURE__ */ e("svg", _object_spread_props(_object_spread({
         width: a,
         height: a,

package/dist-es/generated/mistica-icons/icon-5-g-light.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsxs as i, jsx as t } from "react/jsx-runtime";
 import { useIsInverseVariant as n } from "../../theme-variant-context.js";
 import { vars as c } from "../../skins/skin-contract.css-mistica.js";
 const h = (_param)=>{
-    var { color: s , size: o = 24  } = _param, a = _object_without_properties(_param, [
+    var { color: s, size: o = 24 } = _param, a = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-5-g-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -82,11 +83,11 @@ import { useTheme as i } from "../../hooks.js";
 import { useIsInverseVariant as n } from "../../theme-variant-context.js";
 import { vars as o } from "../../skins/skin-contract.css-mistica.js";
 const s = (_param)=>{
-    var { color: v , size: a = 24  } = _param, e = _object_without_properties(_param, [
+    var { color: v, size: a = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const l = n(), c = v !== null && v !== void 0 ? v : l ? o.colors.inverse : o.colors.neutralHigh, { skinName: r  } = i();
+    const l = n(), c = v !== null && v !== void 0 ? v : l ? o.colors.inverse : o.colors.neutralHigh, { skinName: r } = i();
     return r.match(/^blau/i) ? /* @__PURE__ */ h("svg", _object_spread_props(_object_spread({
         width: a,
         height: a,

package/dist-es/generated/mistica-icons/icon-academic-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as t } from "../../theme-variant-context.js";
 import { vars as l } from "../../skins/skin-contract.css-mistica.js";
 const n = (_param)=>{
-    var { color: r , size: c = 24  } = _param, e = _object_without_properties(_param, [
+    var { color: r, size: c = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-academic-light.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as s } from "../../theme-variant-context.js";
 import { vars as r } from "../../skins/skin-contract.css-mistica.js";
 const n = (_param)=>{
-    var { color: t , size: c = 24  } = _param, e = _object_without_properties(_param, [
+    var { color: t, size: c = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-academic-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as r } from "react/jsx-runtime";
 import { useIsInverseVariant as s } from "../../theme-variant-context.js";
 import { vars as l } from "../../skins/skin-contract.css-mistica.js";
 const i = (_param)=>{
-    var { color: o , size: c = 24  } = _param, e = _object_without_properties(_param, [
+    var { color: o, size: c = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-accessories-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsxs as l, jsx as s } from "react/jsx-runtime";
 import { useIsInverseVariant as a } from "../../theme-variant-context.js";
 import { vars as r } from "../../skins/skin-contract.css-mistica.js";
 const n = (_param)=>{
-    var { color: e , size: c = 24  } = _param, i = _object_without_properties(_param, [
+    var { color: e, size: c = 24 } = _param, i = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-accessories-light.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsxs as h, jsx as c } from "react/jsx-runtime";
 import { useIsInverseVariant as i } from "../../theme-variant-context.js";
 import { vars as s } from "../../skins/skin-contract.css-mistica.js";
 const v = (_param)=>{
-    var { color: r , size: o = 24  } = _param, t = _object_without_properties(_param, [
+    var { color: r, size: o = 24 } = _param, t = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-accessories-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsxs as t, jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as h } from "../../theme-variant-context.js";
 import { vars as s } from "../../skins/skin-contract.css-mistica.js";
 const i = (_param)=>{
-    var { color: e , size: c = 24  } = _param, a = _object_without_properties(_param, [
+    var { color: e, size: c = 24 } = _param, a = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-add-bill-euro-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as r } from "react/jsx-runtime";
 import { useIsInverseVariant as t } from "../../theme-variant-context.js";
 import { vars as l } from "../../skins/skin-contract.css-mistica.js";
 const s = (_param)=>{
-    var { color: e , size: o = 24  } = _param, a = _object_without_properties(_param, [
+    var { color: e, size: o = 24 } = _param, a = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-add-bill-euro-light.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as h } from "react/jsx-runtime";
 import { useIsInverseVariant as s } from "../../theme-variant-context.js";
 import { vars as o } from "../../skins/skin-contract.css-mistica.js";
 const l = (_param)=>{
-    var { color: r , size: a = 24  } = _param, t = _object_without_properties(_param, [
+    var { color: r, size: a = 24 } = _param, t = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-add-bill-euro-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as t } from "../../theme-variant-context.js";
 import { vars as c } from "../../skins/skin-contract.css-mistica.js";
 const h = (_param)=>{
-    var { color: a , size: r = 24  } = _param, e = _object_without_properties(_param, [
+    var { color: a, size: r = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-add-bill-pound-filled.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as r } from "react/jsx-runtime";
 import { useIsInverseVariant as n } from "../../theme-variant-context.js";
 import { vars as l } from "../../skins/skin-contract.css-mistica.js";
 const t = (_param)=>{
-    var { color: a , size: o = 24  } = _param, c = _object_without_properties(_param, [
+    var { color: a, size: o = 24 } = _param, c = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-add-bill-pound-light.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { useIsInverseVariant as v } from "../../theme-variant-context.js";
 import { vars as r } from "../../skins/skin-contract.css-mistica.js";
 const e = (_param)=>{
-    var { color: h , size: a = 24  } = _param, t = _object_without_properties(_param, [
+    var { color: h, size: a = 24 } = _param, t = _object_without_properties(_param, [
         "color",
         "size"
     ]);

package/dist-es/generated/mistica-icons/icon-add-bill-pound-regular.js

@@ -1,3 +1,4 @@
+"use client";
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -81,7 +82,7 @@ import { jsx as r } from "react/jsx-runtime";
 import { useIsInverseVariant as s } from "../../theme-variant-context.js";
 import { vars as a } from "../../skins/skin-contract.css-mistica.js";
 const t = (_param)=>{
-    var { color: c , size: o = 24  } = _param, e = _object_without_properties(_param, [
+    var { color: c, size: o = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);