@telefonica/mistica 14.17.0 → 14.18.0

package/dist-es/carousel.css-mistica.js

@@ -2,10 +2,10 @@ import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./responsive-layout.css.ts.vanilla.css-mistica.js";
 import "./grid-layout.css.ts.vanilla.css-mistica.js";
 import "./carousel.css.ts.vanilla.css-mistica.js";
-var f = "_1abcu71 _1y2v1nf8k _1y2v1nf90 _1y2v1nfab _1y2v1nf44", y = "_1abcu72 _1abcu71 _1y2v1nf8k _1y2v1nf90 _1y2v1nfab _1y2v1nf45", r = "_1abcu72 _1abcu71 _1y2v1nf8k _1y2v1nf90 _1y2v1nfab _1y2v1nf4k", b = "_1abcu75 _1abcu71 _1y2v1nf8k _1y2v1nf90 _1y2v1nfab", e = "_1abcu7l _1abcu7b _1y2v1nf64 _1y2v1nf9c", u = "_1y2v1nf64 _1y2v1nf6d", c = "_1y2v1nf9p _1y2v1nf5z", t = "_1abcu7o", o = "_1abcu7s _1abcu7q _1abcu7d _1y2v1nf64 _1y2v1nf6j _1y2v1nf6d _1y2v1nfab _1y2v1nf31 _1y2v1nf8q _1y2v1nf96 _1y2v1nfa9 _1y2v1nf60", l = "_1abcu7r _1abcu7q _1abcu7d _1y2v1nf64 _1y2v1nf6j _1y2v1nf6d _1y2v1nfab _1y2v1nf31 _1y2v1nf8q _1y2v1nf96 _1y2v1nfa9 _1y2v1nf60", s = "_1abcu7m", i = "_1abcu7n", d = "_1abcu7v _1abcu7b _1y2v1nf64 _1y2v1nf9c", m = "_1abcu713 _1y2v1nf60 _1y2v1nfca _1y2v1nf64 _1y2v1nf6d _1y2v1nf8f", w = "_1y2v1nf5z", h = "_1abcu7x _1y2v1nf8f _1y2v1nf6m", p = "_1abcu711 _1abcu7q _1abcu7d _1y2v1nf64 _1y2v1nf6j _1y2v1nf6d _1y2v1nfab _1y2v1nf31 _1y2v1nf8q _1y2v1nf96 _1y2v1nfa9 _1y2v1nf60 _1y2v1nfbv", q = "_1abcu7z _1abcu7q _1abcu7d _1y2v1nf64 _1y2v1nf6j _1y2v1nf6d _1y2v1nfab _1y2v1nf31 _1y2v1nf8q _1y2v1nf96 _1y2v1nfa9 _1y2v1nf60 _1y2v1nfbg", P = {
+var f = "_1abcu71 _1y2v1nfbw _1y2v1nfcc _1y2v1nfdn _1y2v1nf44", b = "_1abcu72 _1abcu71 _1y2v1nfbw _1y2v1nfcc _1y2v1nfdn _1y2v1nf45", y = "_1abcu72 _1abcu71 _1y2v1nfbw _1y2v1nfcc _1y2v1nfdn _1y2v1nf4k", c = "_1abcu75 _1abcu71 _1y2v1nfbw _1y2v1nfcc _1y2v1nfdn", r = "_1abcu7l _1abcu7b _1y2v1nfb4 _1y2v1nfco", e = "_1y2v1nfb4 _1y2v1nfbd", u = "_1y2v1nfd1 _1y2v1nfaz", l = "_1abcu7o", o = "_1abcu7s _1abcu7q _1abcu7d _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn _1y2v1nf31 _1y2v1nfc2 _1y2v1nfci _1y2v1nfdl _1y2v1nfb0", t = "_1abcu7r _1abcu7q _1abcu7d _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn _1y2v1nf31 _1y2v1nfc2 _1y2v1nfci _1y2v1nfdl _1y2v1nfb0", s = "_1abcu7m", d = "_1abcu7n", i = "_1abcu7v _1abcu7b _1y2v1nfb4 _1y2v1nfco", w = "_1abcu713 _1y2v1nfb0 _1y2v1nffm _1y2v1nfb4 _1y2v1nfbd _1y2v1nfbr", m = "_1y2v1nfaz", h = "_1abcu7x _1y2v1nfbr _1y2v1nfbm", P = "_1abcu711 _1abcu7q _1abcu7d _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn _1y2v1nf31 _1y2v1nfc2 _1y2v1nfci _1y2v1nfdl _1y2v1nfb0 _1y2v1nff7", p = "_1abcu7z _1abcu7q _1abcu7d _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn _1y2v1nf31 _1y2v1nfc2 _1y2v1nfci _1y2v1nfdl _1y2v1nfb0 _1y2v1nfes", A = {
     itemsPerPageMobile: "var(--_1abcu7g)",
     itemsPerPageTablet: "var(--_1abcu7h)",
     itemsPerPageDesktop: "var(--_1abcu7i)",
     gap: "var(--_1abcu7j)"
 };
-export { f as bullet, y as bulletActive, r as bulletActiveInverse, b as bulletInverse, e as carousel, u as carouselBullets, c as carouselContainer, t as carouselItem, o as carouselNextArrowButton, l as carouselPrevArrowButton, s as carouselWithScroll, i as centeredCarousel, d as slideshow, m as slideshowBullets, w as slideshowContainer, h as slideshowItem, p as slideshowNextArrowButton, q as slideshowPrevArrowButton, P as vars };
+export { f as bullet, b as bulletActive, y as bulletActiveInverse, c as bulletInverse, r as carousel, e as carouselBullets, u as carouselContainer, l as carouselItem, o as carouselNextArrowButton, t as carouselPrevArrowButton, s as carouselWithScroll, d as centeredCarousel, i as slideshow, w as slideshowBullets, m as slideshowContainer, h as slideshowItem, P as slideshowNextArrowButton, p as slideshowPrevArrowButton, A as vars };

package/dist-es/checkbox.css-mistica.js

@@ -1,8 +1,8 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./checkbox.css.ts.vanilla.css-mistica.js";
-var n = {
-    ios: "_1rz9b16 _1rz9b15 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nf6m _1y2v1nfam _1y2v1nf30",
-    rest: "_1rz9b17 _1rz9b15 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nf6m _1y2v1nfam _1y2v1nf30",
-    checked: "_1rz9b18 _1rz9b15 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nf6m _1y2v1nfam _1y2v1nf30"
-}, r = "_1rz9b1a _1y2v1nf66", f = "_1rz9b1b", y = "_1rz9b12 _1rz9b11 _1y2v1nf67", b = "_1rz9b13 _1rz9b11 _1y2v1nf67", a = "_1rz9b1c";
-export { n as boxVariant, r as check, f as checkChecked, y as checkboxContainer, b as checkboxContainerDisabled, a as disabled };
+var v = {
+    ios: "_1rz9b16 _1rz9b15 _1y2v1nfb5 _1y2v1nfbd _1y2v1nfbj _1y2v1nfbm _1y2v1nfdy _1y2v1nf30",
+    rest: "_1rz9b17 _1rz9b15 _1y2v1nfb5 _1y2v1nfbd _1y2v1nfbj _1y2v1nfbm _1y2v1nfdy _1y2v1nf30",
+    checked: "_1rz9b18 _1rz9b15 _1y2v1nfb5 _1y2v1nfbd _1y2v1nfbj _1y2v1nfbm _1y2v1nfdy _1y2v1nf30"
+}, n = "_1rz9b1a _1y2v1nfb6", r = "_1rz9b1b", y = "_1rz9b12 _1rz9b11 _1y2v1nfb7", f = "_1rz9b13 _1rz9b11 _1y2v1nfb7", e = "_1rz9b1c";
+export { v as boxVariant, n as check, r as checkChecked, y as checkboxContainer, f as checkboxContainerDisabled, e as disabled };

package/dist-es/chip.css-mistica.js

@@ -1,11 +1,11 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./chip.css.ts.vanilla.css-mistica.js";
-var c = "_1y2v1nf6r _1y2v1nf76 _1y2v1nf7l _1y2v1nf80 _1y2v1nfaa _1y2v1nf5y", t = {
+var c = "_1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfdm _1y2v1nf5y", t = {
     light: "cc7htnb cc7htn9",
     dark: "cc7htnc cc7htn9"
 }, f = {
-    default: "cc7htn1 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nfa9 _1y2v1nf31 _1y2v1nf1w",
-    overAlternative: "cc7htn1 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nfa9 _1y2v1nf38 _1y2v1nf1w",
-    active: "cc7htn8 cc7htn2 cc7htn1 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nfa9 _1y2v1nf16 _1y2v1nf5k"
+    default: "cc7htn1 _1y2v1nfb5 _1y2v1nfbd _1y2v1nfbj _1y2v1nfdl _1y2v1nf31 _1y2v1nf1w",
+    overAlternative: "cc7htn1 _1y2v1nfb5 _1y2v1nfbd _1y2v1nfbj _1y2v1nfdl _1y2v1nf38 _1y2v1nf1w",
+    active: "cc7htn8 cc7htn2 cc7htn1 _1y2v1nfb5 _1y2v1nfbd _1y2v1nfbj _1y2v1nfdl _1y2v1nf16 _1y2v1nf5k"
 }, y = "cc7htnd", _ = "cc7htne";
 export { c as button, t as chipInteractiveVariants, f as chipVariants, y as icon, _ as iconActive };

package/dist-es/circle.css-mistica.js

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./circle.css.ts.vanilla.css-mistica.js";
-var r = "_1wpwyyp1 _1y2v1nf64 _1y2v1nf6j _1y2v1nf6d _1y2v1nfab";
-export { r as circle };
+var p = "_1wpwyyp1 _1y2v1nfb4 _1y2v1nfbj _1y2v1nfbd _1y2v1nfdn";
+export { p as circle };

package/dist-es/circle.js

@@ -1,19 +1,73 @@
-import { jsx as i } from "react/jsx-runtime";
-import { circle as d } from "./circle.css-mistica.js";
-import { vars as m } from "./skins/skin-contract.css-mistica.js";
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+import { jsx as m } from "react/jsx-runtime";
+import { circle as a } from "./circle.css-mistica.js";
+import { vars as d } from "./skins/skin-contract.css-mistica.js";
+import { getPrefixedDataAttributes as f } from "./utils/dom.js";
 const n = (param)=>{
-    let { children: e , backgroundColor: s , backgroundImage: o , size: t , border: r = !1  } = param;
-    const l = r === !0 ? m.colors.border : r, c = r ? `1px solid ${l}` : void 0;
-    return /* @__PURE__ */ i("div", {
-        className: d,
+    let { children: e , backgroundColor: i , backgroundImage: o , size: t , border: r = !1 , dataAttributes: s  } = param;
+    const l = r === !0 ? d.colors.border : r, c = r ? `1px solid ${l}` : void 0;
+    return /* @__PURE__ */ m("div", _object_spread_props(_object_spread({
+        className: a,
         style: {
             width: t,
             height: t,
-            backgroundColor: s,
+            backgroundColor: i,
             backgroundImage: o ? `url(${o})` : "none",
             border: c
-        },
+        }
+    }, f(s, "Circle")), {
         children: e
-    });
-}, u = n;
-export { u as default };
+    }));
+}, b = n;
+export { b as default };

package/dist-es/community/advanced-data-card.css-mistica.js

@@ -0,0 +1,7 @@
+import "../sprinkles.css.ts.vanilla.css-mistica.js";
+import "./advanced-data-card.css.ts.vanilla.css-mistica.js";
+var _ = "_1x00fru3 _1x00fru1 _1y2v1nf8w _1y2v1nfa5 _1y2v1nfb4 _1y2v1nfbq _1y2v1nfbg _1y2v1nf7t", n = {
+    default: "_1x00frui",
+    mobile: "_1x00fruj"
+}, v = "_1x00fruq", a = "_1x00fru5 _1y2v1nfb4", t = "_1x00frul", y = "_1x00frum _1x00frul", u = "_1x00fru8 _1x00fru1 _1y2v1nf8w _1y2v1nfa5 _1y2v1nfb4 _1y2v1nf68 _1y2v1nf7t", x = "_1y2v1nfb4 _1y2v1nfbq _1y2v1nfba _1y2v1nfbr _1y2v1nfc8 _1x00fru9", i = "_1x00frug", o = "_1x00frun", b = "_1x00frup _1y2v1nfb4 _1y2v1nfb9", e = "_1y2v1nfb4 _1y2v1nfbq _1y2v1nfbj _1y2v1nfdd", d = "_1x00fru6", g = "_1x00fruk", m = "_1y2v1nff5", c = "_1x00fru9", l = "_1x00fru1 _1y2v1nf8w _1y2v1nfa5";
+export { _ as actions, n as actionsVariants, v as adjustButtonLink, a as boxed, t as button, y as buttonMobile, u as cardContentStyle, x as dataCard, i as divider, o as extraTop, b as footerDirection, e as footerText, d as interaction, g as marginRightAuto, m as marginRightButton, c as minHeight, l as paddingX };

package/dist-es/community/advanced-data-card.css.ts.vanilla.css-mistica.js

@@ -0,0 +1,2 @@
+const a = "";
+export { a as default };

package/dist-es/community/advanced-data-card.js

@@ -0,0 +1,256 @@
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+import { jsx as e, jsxs as r, Fragment as F } from "react/jsx-runtime";
+import * as V from "react";
+import { Boxed as W } from "../boxed.js";
+import { sprinkles as s } from "../sprinkles.css-mistica.js";
+import f from "../stack.js";
+import { boxed as X, dataCard as Y, interaction as q, cardContentStyle as E, minHeight as J, extraTop as K, paddingX as O, divider as Q, actions as U, actionsVariants as Z, marginRightButton as _, buttonMobile as D, footerDirection as $, marginRightAuto as ee, footerText as re, adjustButtonLink as te, button as ae } from "./advanced-data-card.css-mistica.js";
+import R from "../divider.js";
+import { Text2 as v, Text as ie } from "../text.js";
+import { vars as y } from "../skins/skin-contract.css-mistica.js";
+import N from "../box.js";
+import oe from "../touchable.js";
+import p from "classnames";
+import { CardActionsGroup as ne } from "../card.js";
+import { useTheme as se } from "../hooks.js";
+const ce = (param)=>{
+    let { headline: a , pretitle: i , pretitleAs: c = "p" , pretitleLinesMax: u , title: d , titleAs: l = "h3" , titleLinesMax: h , subtitle: m , subtitleLinesMax: o , description: t , descriptionLinesMax: g  } = param;
+    const { textPresets: x  } = se();
+    return /* @__PURE__ */ e(F, {
+        children: /* @__PURE__ */ e(f, {
+            space: 4,
+            children: /* @__PURE__ */ e("header", {
+                children: /* @__PURE__ */ r(f, {
+                    space: 4,
+                    children: [
+                        a,
+                        /* @__PURE__ */ r(f, {
+                            space: 4,
+                            children: [
+                                i && /* @__PURE__ */ e(v, {
+                                    color: y.colors.textPrimary,
+                                    truncate: u,
+                                    as: c,
+                                    regular: !0,
+                                    hyphens: "auto",
+                                    children: i
+                                }),
+                                /* @__PURE__ */ e(ie, {
+                                    mobileSize: 18,
+                                    mobileLineHeight: "24px",
+                                    desktopSize: 20,
+                                    desktopLineHeight: "28px",
+                                    truncate: h,
+                                    weight: x.cardTitle.weight,
+                                    as: l,
+                                    hyphens: "auto",
+                                    children: d
+                                }),
+                                /* @__PURE__ */ e(v, {
+                                    color: y.colors.textPrimary,
+                                    truncate: o,
+                                    as: "p",
+                                    regular: !0,
+                                    hyphens: "auto",
+                                    children: m
+                                })
+                            ]
+                        }),
+                        t && /* @__PURE__ */ e(v, {
+                            truncate: g,
+                            as: "p",
+                            regular: !0,
+                            color: y.colors.textSecondary,
+                            hyphens: "auto",
+                            children: t
+                        })
+                    ]
+                })
+            })
+        })
+    });
+}, de = (param)=>{
+    let { button: a , footerImage: i , footerText: c , footerTextLinesMax: u , buttonLink: d  } = param;
+    const l = !!a, h = !!i, m = !!c, o = !!d, t = l && (h || m) && o, g = o && !t ? "178px" : "";
+    return /* @__PURE__ */ r(F, {
+        children: [
+            /* @__PURE__ */ e("div", {
+                className: Q,
+                children: /* @__PURE__ */ e(R, {})
+            }),
+            /* @__PURE__ */ r("div", {
+                className: p(U, Z[t ? "mobile" : "default"]),
+                children: [
+                    l && /* @__PURE__ */ e("div", {
+                        className: p(_, D),
+                        children: a
+                    }),
+                    /* @__PURE__ */ r("div", {
+                        className: p($, t ? ee : s({
+                            paddingTop: 16
+                        })),
+                        children: [
+                            h && /* @__PURE__ */ e(N, {
+                                paddingRight: 16,
+                                className: s({
+                                    alignItems: "center",
+                                    display: "flex"
+                                }),
+                                children: i
+                            }),
+                            m && /* @__PURE__ */ e("div", {
+                                style: {
+                                    maxWidth: g
+                                },
+                                className: re,
+                                children: /* @__PURE__ */ e(v, {
+                                    truncate: u,
+                                    regular: !0,
+                                    children: c
+                                })
+                            })
+                        ]
+                    }),
+                    o && /* @__PURE__ */ e("div", {
+                        className: p(te, t ? ae : D),
+                        children: d
+                    })
+                ]
+            })
+        ]
+    });
+}, le = /*#__PURE__*/ V.forwardRef((param, L)=>{
+    let { onPress: a , stackingGroup: i , headline: c , pretitle: u , pretitleAs: d , pretitleLinesMax: l , title: h , titleAs: m , titleLinesMax: o , subtitle: t , subtitleLinesMax: g , description: x , descriptionLinesMax: S , extra: n , extraDividerPadding: k = 24 , button: b , footerImage: T , footerText: C , footerTextLinesMax: j , buttonLink: A , dataAttributes: H , actions: P , "aria-label": z , onClose: I  } = param;
+    const G = {
+        button: b,
+        footerImage: T,
+        footerText: C,
+        footerTextLinesMax: j,
+        buttonLink: A
+    }, B = !!b || !!T || !!C || !!A;
+    return /* @__PURE__ */ e("section", {
+        className: s({
+            position: "relative",
+            height: "100%"
+        }),
+        children: /* @__PURE__ */ e(W, {
+            className: X,
+            dataAttributes: _object_spread({
+                "component-name": "AdvancedDataCard"
+            }, H),
+            ref: L,
+            width: "100%",
+            height: "100%",
+            children: /* @__PURE__ */ r("div", {
+                className: Y,
+                children: [
+                    /* @__PURE__ */ e(oe, {
+                        onPress: a,
+                        tabIndex: 0,
+                        maybe: !0,
+                        className: s({
+                            position: "relative",
+                            height: "100%"
+                        }),
+                        "aria-label": z,
+                        children: /* @__PURE__ */ r("div", {
+                            className: a ? q : "",
+                            children: [
+                                /* @__PURE__ */ r("div", {
+                                    className: p(E, !B && !n ? J : ""),
+                                    children: [
+                                        /* @__PURE__ */ e(N, {
+                                            paddingTop: 8,
+                                            children: /* @__PURE__ */ r(f, {
+                                                space: 8,
+                                                className: s({
+                                                    flex: 1
+                                                }),
+                                                children: [
+                                                    i,
+                                                    /* @__PURE__ */ e(ce, {
+                                                        headline: c,
+                                                        pretitle: u,
+                                                        pretitleAs: d,
+                                                        pretitleLinesMax: l,
+                                                        title: h,
+                                                        titleAs: m,
+                                                        titleLinesMax: o,
+                                                        subtitle: t,
+                                                        subtitleLinesMax: g,
+                                                        description: x,
+                                                        descriptionLinesMax: S
+                                                    })
+                                                ]
+                                            })
+                                        }),
+                                        /* @__PURE__ */ e(ne, {
+                                            actions: P,
+                                            onClose: I
+                                        })
+                                    ]
+                                }),
+                                /* @__PURE__ */ e("div", {
+                                    className: K,
+                                    children: n && n != null && n.length ? /* @__PURE__ */ e(N, {
+                                        paddingTop: 16,
+                                        paddingBottom: 24,
+                                        children: n.map((M, w)=>/* @__PURE__ */ r("div", {
+                                                children: [
+                                                    /* @__PURE__ */ e("div", {
+                                                        className: s({
+                                                            display: "flex",
+                                                            width: "100%"
+                                                        }),
+                                                        children: /* @__PURE__ */ e("div", {
+                                                            className: p(s({
+                                                                width: "100%"
+                                                            }), O),
+                                                            children: M
+                                                        })
+                                                    }),
+                                                    w + 1 !== n.length && /* @__PURE__ */ e(N, {
+                                                        paddingY: k,
+                                                        children: /* @__PURE__ */ e(R, {})
+                                                    })
+                                                ]
+                                            }, w))
+                                    }) : null
+                                })
+                            ]
+                        })
+                    }),
+                    B && /* @__PURE__ */ e(de, _object_spread({}, G))
+                ]
+            })
+        })
+    });
+}), Ae = le;
+export { le as AdvancedDataCard, Ae as default };

package/dist-es/community/blocks.css-mistica.js

@@ -0,0 +1,4 @@
+import "../sprinkles.css.ts.vanilla.css-mistica.js";
+import "./blocks.css.ts.vanilla.css-mistica.js";
+var t = "_1y2v1nfb4 _1y2v1nfba", o = "llrsen1";
+export { t as column, o as rightContent };

package/dist-es/community/blocks.css.ts.vanilla.css-mistica.js

@@ -0,0 +1,2 @@
+const s = "";
+export { s as default };

package/dist-es/community/blocks.js

@@ -0,0 +1,224 @@
+import { jsx as r, jsxs as a } from "react/jsx-runtime";
+import p from "../stack.js";
+import { column as x, rightContent as y } from "./blocks.css-mistica.js";
+import { Text2 as i, Text5 as f, Text8 as h, Text3 as v } from "../text.js";
+import { vars as c } from "../skins/skin-contract.css-mistica.js";
+import s from "../inline.js";
+import u from "../box.js";
+import S from "../progress-bar.js";
+import B from "classnames";
+const g = (param)=>{
+    let { title: o , description: e  } = param;
+    const l = typeof e == "string" ? [
+        e
+    ] : e;
+    return /* @__PURE__ */ a("div", {
+        className: x,
+        children: [
+            /* @__PURE__ */ r(v, {
+                regular: !0,
+                color: c.colors.textPrimary,
+                children: o
+            }),
+            l && l.map((t, n)=>/* @__PURE__ */ r(i, {
+                    regular: !0,
+                    color: c.colors.textSecondary,
+                    as: "p",
+                    children: t
+                }, n))
+        ]
+    });
+}, L = (param)=>/* @__PURE__ */ {
+    let { title: o , stackingGroup: e , description: l , "aria-label": t  } = param;
+    return r("div", {
+        "aria-label": t,
+        children: /* @__PURE__ */ a(s, {
+            space: "between",
+            alignItems: "center",
+            children: [
+                o && /* @__PURE__ */ r(u, {
+                    paddingRight: 32,
+                    children: /* @__PURE__ */ r(i, {
+                        regular: !0,
+                        children: o
+                    })
+                }),
+                e || /* @__PURE__ */ r(i, {
+                    regular: !0,
+                    color: c.colors.textSecondary,
+                    children: l
+                })
+            ]
+        })
+    });
+}, V = (param)=>/* @__PURE__ */ {
+    let { image: o , description: e , "aria-label": l  } = param;
+    return r("div", {
+        "aria-label": l,
+        children: /* @__PURE__ */ a(s, {
+            space: 16,
+            alignItems: "center",
+            children: [
+                o,
+                /* @__PURE__ */ r(i, {
+                    regular: !0,
+                    color: c.colors.textSecondary,
+                    children: e
+                })
+            ]
+        })
+    });
+}, q = (param)=>/* @__PURE__ */ {
+    let { title: o , description: e , secondaryValue: l , value: t , valueColor: n = c.colors.textPrimary , "aria-label": d  } = param;
+    return a(s, {
+        space: "between",
+        alignItems: "flex-end",
+        "aria-label": d,
+        children: [
+            /* @__PURE__ */ r(g, {
+                title: o,
+                description: e
+            }),
+            /* @__PURE__ */ a("div", {
+                className: B(x, y),
+                children: [
+                    /* @__PURE__ */ r(i, {
+                        regular: !0,
+                        color: c.colors.textSecondary,
+                        children: l
+                    }),
+                    /* @__PURE__ */ r(f, {
+                        color: n,
+                        children: t
+                    })
+                ]
+            })
+        ]
+    });
+}, z = (param)=>/* @__PURE__ */ {
+    let { headline: o , mainHeading: e , secondHeading: l , secondaryValue: t , title: n , description: d , valueColor: m = c.colors.textPrimary , "aria-label": b  } = param;
+    return a("div", {
+        "aria-label": b,
+        children: [
+            o && /* @__PURE__ */ r(u, {
+                paddingBottom: 24,
+                children: o
+            }),
+            /* @__PURE__ */ a(p, {
+                space: 2,
+                children: [
+                    /* @__PURE__ */ a(s, {
+                        space: 8,
+                        alignItems: "baseline",
+                        children: [
+                            /* @__PURE__ */ r(h, {
+                                color: m,
+                                children: e.value
+                            }),
+                            /* @__PURE__ */ r(i, {
+                                regular: !0,
+                                color: c.colors.textSecondary,
+                                children: e.text
+                            })
+                        ]
+                    }),
+                    l && /* @__PURE__ */ a(s, {
+                        space: 8,
+                        alignItems: "baseline",
+                        children: [
+                            /* @__PURE__ */ r(h, {
+                                color: m,
+                                children: l.value
+                            }),
+                            /* @__PURE__ */ r(i, {
+                                regular: !0,
+                                color: c.colors.textSecondary,
+                                children: l.text
+                            })
+                        ]
+                    }),
+                    t && /* @__PURE__ */ r(h, {
+                        color: c.colors.textSecondary,
+                        children: t
+                    })
+                ]
+            }),
+            n || d ? /* @__PURE__ */ r(u, {
+                paddingTop: 8,
+                children: /* @__PURE__ */ r(g, {
+                    title: n,
+                    description: d
+                })
+            }) : null
+        ]
+    });
+}, A = (param)=>/* @__PURE__ */ {
+    let { title: o , value: e , description: l , valueColor: t = c.colors.textPrimary , "aria-label": n  } = param;
+    return a("div", {
+        "aria-label": n,
+        className: x,
+        children: [
+            /* @__PURE__ */ r(i, {
+                regular: !0,
+                color: c.colors.textPrimary,
+                children: o
+            }),
+            /* @__PURE__ */ r(h, {
+                color: t,
+                children: e
+            }),
+            /* @__PURE__ */ r(g, {
+                description: l
+            })
+        ]
+    });
+}, D = (param)=>/* @__PURE__ */ {
+    let { title: o , stackingGroup: e , progressPercent: l , reverse: t , heading: n , description: d , "aria-label": m  } = param;
+    return r("div", {
+        "aria-label": m,
+        children: /* @__PURE__ */ a(p, {
+            space: 8,
+            children: [
+                /* @__PURE__ */ a(s, {
+                    space: "between",
+                    alignItems: "flex-end",
+                    children: [
+                        /* @__PURE__ */ r(u, {
+                            paddingRight: 32,
+                            children: /* @__PURE__ */ r(i, {
+                                regular: !0,
+                                children: o
+                            })
+                        }),
+                        e
+                    ]
+                }),
+                l && /* @__PURE__ */ r(S, {
+                    progressPercent: l,
+                    reverse: t
+                }),
+                /* @__PURE__ */ a(s, {
+                    space: 8,
+                    alignItems: "baseline",
+                    children: [
+                        /* @__PURE__ */ r(h, {
+                            color: n.valueColor || c.colors.textPrimary,
+                            children: n.value
+                        }),
+                        /* @__PURE__ */ r(i, {
+                            regular: !0,
+                            color: c.colors.textSecondary,
+                            children: n.text
+                        })
+                    ]
+                }),
+                d && /* @__PURE__ */ r(i, {
+                    regular: !0,
+                    color: c.colors.textSecondary,
+                    children: d
+                })
+            ]
+        })
+    });
+};
+export { z as HighlightedValueBlock, q as InformationBlock, D as ProgressBlock, L as RowBlock, V as SimpleBlock, A as ValueBlock };

package/dist-es/community/index.js

@@ -1,2 +1,4 @@
-import { default as a } from "./example-component.js";
-export { a as ExampleComponent };
+import { default as l } from "./example-component.js";
+import { default as r } from "./advanced-data-card.js";
+import { HighlightedValueBlock as c, InformationBlock as m, ProgressBlock as d, RowBlock as f, SimpleBlock as k, ValueBlock as p } from "./blocks.js";
+export { r as AdvancedDataCard, l as ExampleComponent, c as HighlightedValueBlock, m as InformationBlock, d as ProgressBlock, f as RowBlock, k as SimpleBlock, p as ValueBlock };