@telefonica/mistica 14.10.0 → 14.11.0

package/dist/chip.css-mistica.js

@@ -17,11 +17,11 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./chip.css.ts.vanilla.js");
-var c = "_1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf9o _1y2v1nf5k", t = {
+var c = "_1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nfa2 _1y2v1nf5y", t = {
     light: "cc7htnb cc7htn9",
     dark: "cc7htnc cc7htn9"
 }, f = {
-    default: "cc7htn1 _1y2v1nf5r _1y2v1nf5z _1y2v1nf65 _1y2v1nf9n _1y2v1nf2u _1y2v1nf1s",
-    overAlternative: "cc7htn1 _1y2v1nf5r _1y2v1nf5z _1y2v1nf65 _1y2v1nf9n _1y2v1nf2x _1y2v1nf1s",
-    active: "cc7htn8 cc7htn2 cc7htn1 _1y2v1nf5r _1y2v1nf5z _1y2v1nf65 _1y2v1nf9n _1y2v1nf12 _1y2v1nf59"
+    default: "cc7htn1 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nfa1 _1y2v1nf31 _1y2v1nf1w",
+    overAlternative: "cc7htn1 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nfa1 _1y2v1nf38 _1y2v1nf1w",
+    active: "cc7htn8 cc7htn2 cc7htn1 _1y2v1nf65 _1y2v1nf6d _1y2v1nf6j _1y2v1nfa1 _1y2v1nf16 _1y2v1nf5k"
 }, y = "cc7htnd", _ = "cc7htne";

package/dist/circle.css-mistica.js

@@ -8,4 +8,4 @@ Object.defineProperty(exports, "circle", {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./circle.css.ts.vanilla.js");
-var r = "_1wpwyyp1 _1y2v1nf5q _1y2v1nf65 _1y2v1nf5z _1y2v1nf9p";
+var r = "_1wpwyyp1 _1y2v1nf64 _1y2v1nf6j _1y2v1nf6d _1y2v1nfa3";

package/dist/credit-card-number-field.css-mistica.js

@@ -16,7 +16,7 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./credit-card-number-field.css.ts.vanilla.js");
-var a = "yvyo3q0", o = "yvyo3q2", r = "_1y2v1nf5m", f = {
-    default: "yvyo3q4 _1y2v1nf5l yvyo3q5",
-    backface: "yvyo3q4 _1y2v1nf5l yvyo3q6"
+var a = "yvyo3q0", o = "yvyo3q2", r = "_1y2v1nf60", f = {
+    default: "yvyo3q4 _1y2v1nf5z yvyo3q5",
+    backface: "yvyo3q4 _1y2v1nf5z yvyo3q6"
 };

package/dist/cvv-field.css-mistica.js

@@ -14,4 +14,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./cvv-field.css.ts.vanilla.js");
-var v = "_10ijton2 _1y2v1nf1s", n = "_1y2v1nf5q _1y2v1nf65";
+var v = "_10ijton2 _1y2v1nf1w", n = "_1y2v1nf64 _1y2v1nf6j";

package/dist/dialog.css-mistica.js

@@ -12,8 +12,8 @@ _export(exports, {
     closedModalContent: ()=>_,
     closedOpactityLayer: ()=>y,
     dialogActions: ()=>f,
-    dialogContent: ()=>l,
-    iconContainer: ()=>a,
+    dialogContent: ()=>a,
+    iconContainer: ()=>l,
     modalCloseButtonContainer: ()=>d,
     modalContent: ()=>o,
     modalOpacityLayer: ()=>r,
@@ -22,7 +22,7 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./dialog.css.ts.vanilla.js");
-var _ = "_3dl29lb", y = "_3dl29l6", f = "_3dl29ll _1y2v1nf6j", l = "_3dl29lj _1y2v1nf6c _1y2v1nf97", a = "_3dl29lm", d = "_3dl29l8 _1y2v1nf6i _1y2v1nf6w _1y2v1nf7a _1y2v1nf7o _1y2v1nf5m _1y2v1nfa8 _1y2v1nfb0", o = "_3dl29la _1y2v1nf2t _1y2v1nf9x", r = "_3dl29l5 _1y2v1nf5n _1y2v1nf5q _1y2v1nf5z _1y2v1nf65 _1y2v1nf5w _1y2v1nfa8 _1y2v1nfb0 _1y2v1nfbe _1y2v1nfam _1y2v1nf30", t = {
-    dialog: "_3dl29ld _1y2v1nf5q _1y2v1nf5w _1y2v1nf62 _1y2v1nf7b _1y2v1nf7p _1y2v1nf6l _1y2v1nf6x",
-    default: "_3dl29ld _1y2v1nf5q _1y2v1nf5w _1y2v1nf62 _1y2v1nf6j _1y2v1nf6x _1y2v1nf7b _1y2v1nf7p"
-}, e = "_3dl29l3 _1y2v1nf5l";
+var _ = "_3dl29lb", y = "_3dl29l6", f = "_3dl29ll _1y2v1nf6x", a = "_3dl29lj _1y2v1nf6q _1y2v1nf9l", l = "_3dl29lm", d = "_3dl29l8 _1y2v1nf6w _1y2v1nf7a _1y2v1nf7o _1y2v1nf82 _1y2v1nf60 _1y2v1nfam _1y2v1nfbe", o = "_3dl29la _1y2v1nf30 _1y2v1nfab", r = "_3dl29l5 _1y2v1nf61 _1y2v1nf64 _1y2v1nf6d _1y2v1nf6j _1y2v1nf6a _1y2v1nfam _1y2v1nfbe _1y2v1nfbs _1y2v1nfb0 _1y2v1nf3b", t = {
+    dialog: "_3dl29ld _1y2v1nf64 _1y2v1nf6a _1y2v1nf6g _1y2v1nf7p _1y2v1nf83 _1y2v1nf6z _1y2v1nf7b",
+    default: "_3dl29ld _1y2v1nf64 _1y2v1nf6a _1y2v1nf6g _1y2v1nf6x _1y2v1nf7b _1y2v1nf7p _1y2v1nf83"
+}, e = "_3dl29l3 _1y2v1nf5z";

package/dist/double-field.css-mistica.js

@@ -10,6 +10,6 @@ require("./sprinkles.css.ts.vanilla.js");
 require("./text-field-components.css.ts.vanilla.js");
 require("./double-field.css.ts.vanilla.js");
 var n = {
-    default: "skrulh1 _1y2v1nf5q _1y2v1nf5v _1y2v1nf7x",
-    fullWidth: "skrulh2 _1y2v1nf5q _1y2v1nf5v _1y2v1nf7x"
+    default: "skrulh1 _1y2v1nf64 _1y2v1nf69 _1y2v1nf8b",
+    fullWidth: "skrulh2 _1y2v1nf64 _1y2v1nf69 _1y2v1nf8b"
 };

package/dist/empty-state-card.css-mistica.js

@@ -9,10 +9,10 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    container: ()=>a,
+    container: ()=>n,
     iconContainer: ()=>o,
-    image: ()=>p
+    image: ()=>v
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./empty-state-card.css.ts.vanilla.js");
-var a = "_1azor6p0", o = "_1azor6p4 _1y2v1nf88 _1y2v1nf8n", p = "_1azor6p2 _1y2v1nf5s _1y2v1nf8p";
+var n = "_1azor6p0", o = "_1azor6p4 _1y2v1nf8m _1y2v1nf91", v = "_1azor6p2 _1y2v1nf66 _1y2v1nf93";

package/dist/empty-state.css-mistica.js

@@ -20,9 +20,9 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./empty-state.css.ts.vanilla.js");
-var n = "_13fzrua2 _1y2v1nf5q _1y2v1nf5k", v = {
+var n = "_13fzrua2 _1y2v1nf64 _1y2v1nf5y", v = {
     default: "_13fzrua3",
     largeImage: "_13fzrua4"
-}, e = "_13fzrua9 _1y2v1nf8a _1y2v1nf8p", f = "_13fzruac", _ = "_13fzrua7 _1y2v1nf8d", o = "_13fzrua5", u = "_13fzruab _1y2v1nf5s", t = {
+}, e = "_13fzrua9 _1y2v1nf8o _1y2v1nf93", f = "_13fzruac", _ = "_13fzrua7 _1y2v1nf8r", o = "_13fzrua5", u = "_13fzruab _1y2v1nf66", t = {
     backgroundColor: "var(--_13fzrua0)"
 };

package/dist/feedback.css-mistica.js

@@ -9,8 +9,8 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    container: ()=>n,
-    desktopContainer: ()=>r,
+    container: ()=>r,
+    desktopContainer: ()=>n,
     desktopContent: ()=>t,
     feedbackData: ()=>v,
     feedbackDataAppear: ()=>f,
@@ -19,4 +19,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./feedback.css.ts.vanilla.js");
-var n = "gx6h6a3 _1y2v1nf5q _1y2v1nf8d _1y2v1nf7x", r = "_1y2v1nf9y _1y2v1nf5q _1y2v1nf62", t = "gx6h6a1", v = "gx6h6a7", f = "gx6h6a5", o = "gx6h6a6", p = "gx6h6a4";
+var r = "gx6h6a3 _1y2v1nf64 _1y2v1nf8r _1y2v1nf8b", n = "_1y2v1nfac _1y2v1nf64 _1y2v1nf6g", t = "gx6h6a1", v = "gx6h6a7", f = "gx6h6a5", o = "gx6h6a6", p = "gx6h6a4";

package/dist/fixed-footer-layout.css-mistica.js

@@ -10,15 +10,15 @@ function _export(target, all) {
 }
 _export(exports, {
     container: ()=>v,
-    elevated: ()=>t,
-    fixedFooter: ()=>a,
-    footer: ()=>j,
+    elevated: ()=>a,
+    fixedFooter: ()=>j,
+    footer: ()=>t,
     vars: ()=>e,
     withoutFooter: ()=>p
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./fixed-footer-layout.css.ts.vanilla.js");
-var v = "p5j8j58", t = "p5j8j56 _1y2v1nf2u", a = "p5j8j54", j = "p5j8j53 _1y2v1nf7x _1y2v1nf2t", e = {
+var v = "p5j8j58", a = "p5j8j56 _1y2v1nf31", j = "p5j8j54", t = "p5j8j53 _1y2v1nf8b _1y2v1nf30", e = {
     footerHeight: "var(--p5j8j50)",
     backgroundColor: "var(--p5j8j51)"
-}, p = "_1y2v1nf5p";
+}, p = "_1y2v1nf63";

package/dist/form-context.d.ts

@@ -61,7 +61,7 @@ export declare const useFieldProps: ({ name, value, defaultValue, processValue,
     optional: boolean | undefined;
     error: boolean | undefined;
     disabled: boolean | undefined;
-    onBlur: ((event: React.FocusEvent<Element>) => void) | undefined;
+    onBlur?: React.FocusEventHandler<Element> | undefined;
     validate: ((value: any, rawValue: string) => string | undefined) | undefined;
     onChange: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
     onChangeValue: ((value: any, rawValue: string) => void) | undefined;
@@ -73,7 +73,7 @@ export declare const useFieldProps: ({ name, value, defaultValue, processValue,
     required: boolean;
     error: boolean;
     disabled: boolean;
-    onBlur: (event: React.FocusEvent<Element>) => void;
+    onBlur: React.FocusEventHandler;
     inputRef: (field: HTMLInputElement | null) => void;
     onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
 };

package/dist/grid.css-mistica.js

@@ -0,0 +1,161 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    alignSelf: ()=>i,
+    columnStart: ()=>m,
+    fullColumns: ()=>f,
+    fullRows: ()=>y,
+    grid: ()=>k,
+    gridAlignContent: ()=>e,
+    gridAlignItems: ()=>r,
+    gridAutoFlow: ()=>a,
+    gridJustifyContent: ()=>t,
+    gridJustifyItems: ()=>n,
+    gridTemplateColumns: ()=>s,
+    gridTemplateColumnsAutoRepeat: ()=>o,
+    gridTemplateRows: ()=>l,
+    gridTemplateRowsAutoRepeat: ()=>c,
+    justifySelf: ()=>d,
+    rowStart: ()=>u,
+    spanColumns: ()=>p,
+    spanRows: ()=>g,
+    vars: ()=>w
+});
+require("./grid.css.ts.vanilla.js");
+var i = {
+    start: "mfyikv36",
+    end: "mfyikv37",
+    center: "mfyikv38",
+    stretch: "mfyikv39",
+    baseline: "mfyikv3a"
+}, m = {
+    1: "mfyikv2e",
+    2: "mfyikv2f",
+    3: "mfyikv2g",
+    4: "mfyikv2h",
+    5: "mfyikv2i",
+    6: "mfyikv2j",
+    7: "mfyikv2k",
+    8: "mfyikv2l",
+    9: "mfyikv2m",
+    10: "mfyikv2n",
+    11: "mfyikv2o",
+    12: "mfyikv2p"
+}, f = "mfyikv1o", y = "mfyikv1p", k = "mfyikv6", e = {
+    start: "mfyikv1h",
+    end: "mfyikv1i",
+    center: "mfyikv1j",
+    stretch: "mfyikv1k",
+    "space-between": "mfyikv1l",
+    "space-around": "mfyikv1m",
+    "space-evenly": "mfyikv1n"
+}, r = {
+    start: "mfyikv15",
+    end: "mfyikv16",
+    center: "mfyikv17",
+    stretch: "mfyikv18",
+    baseline: "mfyikv19"
+}, a = {
+    column: "mfyikvx",
+    row: "mfyikvy",
+    "row dense": "mfyikvz",
+    "column dense": "mfyikv10"
+}, t = {
+    start: "mfyikv1a",
+    end: "mfyikv1b",
+    center: "mfyikv1c",
+    stretch: "mfyikv1d",
+    "space-between": "mfyikv1e",
+    "space-around": "mfyikv1f",
+    "space-evenly": "mfyikv1g"
+}, n = {
+    start: "mfyikv11",
+    end: "mfyikv12",
+    center: "mfyikv13",
+    stretch: "mfyikv14"
+}, s = {
+    1: "mfyikv9",
+    2: "mfyikva",
+    3: "mfyikvb",
+    4: "mfyikvc",
+    5: "mfyikvd",
+    6: "mfyikve",
+    7: "mfyikvf",
+    8: "mfyikvg",
+    9: "mfyikvh",
+    10: "mfyikvi",
+    11: "mfyikvj",
+    12: "mfyikvk"
+}, o = "mfyikv7", l = {
+    1: "mfyikvl",
+    2: "mfyikvm",
+    3: "mfyikvn",
+    4: "mfyikvo",
+    5: "mfyikvp",
+    6: "mfyikvq",
+    7: "mfyikvr",
+    8: "mfyikvs",
+    9: "mfyikvt",
+    10: "mfyikvu",
+    11: "mfyikvv",
+    12: "mfyikvw"
+}, c = "mfyikv8", d = {
+    start: "mfyikv32",
+    end: "mfyikv33",
+    center: "mfyikv34",
+    stretch: "mfyikv35"
+}, u = {
+    1: "mfyikv2q",
+    2: "mfyikv2r",
+    3: "mfyikv2s",
+    4: "mfyikv2t",
+    5: "mfyikv2u",
+    6: "mfyikv2v",
+    7: "mfyikv2w",
+    8: "mfyikv2x",
+    9: "mfyikv2y",
+    10: "mfyikv2z",
+    11: "mfyikv30",
+    12: "mfyikv31"
+}, p = {
+    1: "mfyikv1q",
+    2: "mfyikv1r",
+    3: "mfyikv1s",
+    4: "mfyikv1t",
+    5: "mfyikv1u",
+    6: "mfyikv1v",
+    7: "mfyikv1w",
+    8: "mfyikv1x",
+    9: "mfyikv1y",
+    10: "mfyikv1z",
+    11: "mfyikv20",
+    12: "mfyikv21"
+}, g = {
+    1: "mfyikv22",
+    2: "mfyikv23",
+    3: "mfyikv24",
+    4: "mfyikv25",
+    5: "mfyikv26",
+    6: "mfyikv27",
+    7: "mfyikv28",
+    8: "mfyikv29",
+    9: "mfyikv2a",
+    10: "mfyikv2b",
+    11: "mfyikv2c",
+    12: "mfyikv2d"
+}, w = {
+    rowGap: "var(--mfyikv0)",
+    columnGap: "var(--mfyikv1)",
+    rowMinSize: "var(--mfyikv2)",
+    rowMaxSize: "var(--mfyikv3)",
+    columnMinSize: "var(--mfyikv4)",
+    columnMaxSize: "var(--mfyikv5)"
+};

package/dist/grid.css.d.ts

@@ -0,0 +1,26 @@
+export declare const vars: {
+    rowGap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    columnGap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    rowMinSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    rowMaxSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    columnMinSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    columnMaxSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const grid: string;
+export declare const gridTemplateColumnsAutoRepeat: string;
+export declare const gridTemplateRowsAutoRepeat: string;
+export declare const gridTemplateColumns: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const gridTemplateRows: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const gridAutoFlow: Record<"column" | "row" | "row dense" | "column dense", string>;
+export declare const gridJustifyItems: Record<"center" | "stretch" | "end" | "start", string>;
+export declare const gridAlignItems: Record<"center" | "stretch" | "end" | "start" | "baseline", string>;
+export declare const gridJustifyContent: Record<"center" | "space-around" | "space-between" | "space-evenly" | "stretch" | "end" | "start", string>;
+export declare const gridAlignContent: Record<"center" | "space-around" | "space-between" | "space-evenly" | "stretch" | "end" | "start", string>;
+export declare const fullColumns: string;
+export declare const fullRows: string;
+export declare const spanColumns: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const spanRows: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const columnStart: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const rowStart: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const justifySelf: Record<"center" | "stretch" | "end" | "start", string>;
+export declare const alignSelf: Record<"center" | "stretch" | "end" | "start" | "baseline", string>;

package/dist/grid.css.ts.vanilla.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: ()=>s
+});
+const s = "";

package/dist/grid.d.ts

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import type { DataAttributes } from './utils/types';
+type RowsColumns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type Gap = 0 | 2 | 4 | 8 | 12 | 16 | 24 | 32 | 40 | 48 | 56 | 64 | 72 | 80;
+type AutoFillConfig = {
+    minSize?: string | number;
+    /**
+     * default: 1fr
+     */
+    maxSize?: string | number;
+};
+type GridProps = {
+    rows?: RowsColumns | AutoFillConfig;
+    columns?: RowsColumns | AutoFillConfig;
+    gap?: Gap | [Gap, Gap];
+    flow?: 'column' | 'row' | 'column dense' | 'row dense';
+    justifyItems?: 'start' | 'end' | 'center' | 'stretch';
+    alignItems?: 'start' | 'end' | 'center' | 'stretch' | 'baseline';
+    justifyContent?: 'start' | 'end' | 'center' | 'stretch' | 'space-around' | 'space-between' | 'space-evenly';
+    alignContent?: 'start' | 'end' | 'center' | 'stretch' | 'space-around' | 'space-between' | 'space-evenly';
+    height?: string | number;
+    minHeight?: string | number;
+    children: React.ReactNode;
+    as?: React.ComponentType<any> | string;
+    /** "data-" prefix is automatically added. For example, use "testid" instead of "data-testid" */
+    dataAttributes?: DataAttributes;
+};
+export declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLDivElement>>;
+type Span = RowsColumns | 'full';
+type GridItemProps = {
+    columnStart?: RowsColumns;
+    rowStart?: RowsColumns;
+    span?: [Span, Span] | Span;
+    columnSpan?: Span;
+    rowSpan?: Span;
+    justifySelf?: 'start' | 'end' | 'center' | 'stretch';
+    alignSelf?: 'start' | 'end' | 'center' | 'stretch' | 'baseline';
+    children?: React.ReactNode;
+    as?: React.ComponentType<any> | string;
+    /** "data-" prefix is automatically added. For example, use "testid" instead of "data-testid" */
+    dataAttributes?: DataAttributes;
+};
+export declare const GridItem: React.ForwardRefExoticComponent<GridItemProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/grid.js

@@ -0,0 +1,118 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    Grid: ()=>Q,
+    GridItem: ()=>U
+});
+const _dynamic = require("@vanilla-extract/dynamic");
+const _classnames = /*#__PURE__*/ _interopRequireDefault(require("classnames"));
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _gridCssMisticaJs = require("./grid.css-mistica.js");
+const _domJs = require("./utils/dom.js");
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function _defineProperty(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 _objectSpread(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) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
+const B = (i, e)=>{
+    const t = {}, m = (r)=>typeof r == "number" ? `min(${r}px, 100%)` : r, f = (r)=>typeof r == "number" ? `${r}px` : r;
+    return i && typeof i != "number" && (typeof i.minSize < "u" && (t[_gridCssMisticaJs.vars.rowMinSize] = m(i.minSize)), typeof i.maxSize < "u" && (t[_gridCssMisticaJs.vars.rowMaxSize] = f(i.maxSize))), e && typeof e != "number" && (typeof e.minSize < "u" && (t[_gridCssMisticaJs.vars.columnMinSize] = m(e.minSize)), typeof e.maxSize < "u" && (t[_gridCssMisticaJs.vars.columnMaxSize] = f(e.maxSize))), t;
+}, Q = /*#__PURE__*/ _react.forwardRef((param, R)=>{
+    let { rows: i , columns: e , gap: t = 0 , flow: m , justifyItems: f , alignItems: r , justifyContent: n , alignContent: o , height: u , minHeight: l , children: p , as: g = "div" , dataAttributes: A  } = param;
+    const [y, x] = Array.isArray(t) ? t : [
+        t,
+        t
+    ];
+    return /*#__PURE__*/ _react.createElement(g, _objectSpread({
+        ref: R,
+        className: (0, _classnames.default)(_gridCssMisticaJs.grid, e ? typeof e == "number" ? _gridCssMisticaJs.gridTemplateColumns[e] : _gridCssMisticaJs.gridTemplateColumnsAutoRepeat : "", i ? typeof i == "number" ? _gridCssMisticaJs.gridTemplateRows[i] : _gridCssMisticaJs.gridTemplateRowsAutoRepeat : "", m ? _gridCssMisticaJs.gridAutoFlow[m] : "", f ? _gridCssMisticaJs.gridJustifyItems[f] : "", r ? _gridCssMisticaJs.gridAlignItems[r] : "", n ? _gridCssMisticaJs.gridJustifyContent[n] : "", o ? _gridCssMisticaJs.gridAlignContent[o] : ""),
+        style: _objectSpread({
+            height: u,
+            minHeight: l
+        }, (0, _dynamic.assignInlineVars)(_objectSpread({
+            [_gridCssMisticaJs.vars.columnGap]: y ? `${y}px` : "",
+            [_gridCssMisticaJs.vars.rowGap]: x ? `${x}px` : ""
+        }, B(i, e))))
+    }, (0, _domJs.getPrefixedDataAttributes)(A)), p);
+}), U = /*#__PURE__*/ _react.forwardRef((param, p)=>{
+    let { rowStart: i , rowSpan: e , columnStart: t , columnSpan: m , span: f , justifySelf: r , alignSelf: n , children: o , as: u = "div" , dataAttributes: l  } = param;
+    return f && (Array.isArray(f) ? (m = f[0], e = f[1]) : (m = f, e = f)), /*#__PURE__*/ _react.createElement(u, _objectSpread({
+        ref: p,
+        className: (0, _classnames.default)(m ? m === "full" ? _gridCssMisticaJs.fullColumns : _gridCssMisticaJs.spanColumns[m] : "", e ? e === "full" ? _gridCssMisticaJs.fullRows : _gridCssMisticaJs.spanRows[e] : "", t ? _gridCssMisticaJs.columnStart[t] : "", i ? _gridCssMisticaJs.rowStart[i] : "", r ? _gridCssMisticaJs.justifySelf[r] : "", n ? _gridCssMisticaJs.alignSelf[n] : "")
+    }, (0, _domJs.getPrefixedDataAttributes)(l)), o);
+});

package/dist/hero.css-mistica.js

@@ -10,8 +10,8 @@ function _export(target, all) {
 }
 _export(exports, {
     actions: ()=>v,
-    container: ()=>n,
-    containerDesktop: ()=>a,
+    container: ()=>a,
+    containerDesktop: ()=>n,
     containerMobile: ()=>_,
     layout: ()=>i,
     vars: ()=>p
@@ -19,6 +19,6 @@ _export(exports, {
 require("./sprinkles.css.ts.vanilla.js");
 require("./responsive-layout.css.ts.vanilla.js");
 require("./hero.css.ts.vanilla.js");
-var v = "_16rbpto6 _1y2v1nf5q _1y2v1nf6c _1y2v1nf66", n = "_16rbpto2 _1y2v1nf5q", a = "_1y2v1nf65 _1y2v1nf8d", _ = "_1y2v1nf5w", i = "_16rbpto7", p = {
+var v = "_16rbpto6 _1y2v1nf64 _1y2v1nf6q _1y2v1nf6k", a = "_16rbpto2 _1y2v1nf64", n = "_1y2v1nf6j _1y2v1nf8r", _ = "_1y2v1nf6a", i = "_16rbpto7", p = {
     height: "var(--_16rbpto0)"
 };

package/dist/highlighted-card.css-mistica.js

@@ -9,14 +9,14 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    container: ()=>f,
-    imageContent: ()=>y,
+    container: ()=>y,
+    imageContent: ()=>f,
     textContainerVariant: ()=>_,
     touchableContainer: ()=>r
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./highlighted-card.css.ts.vanilla.js");
-var f = "wrb8722 _1y2v1nf5q _1y2v1nf5v _1y2v1nf62 _1y2v1nf68", y = "wrb8725 _1y2v1nf5q", _ = {
-    withImage: "wrb8728 wrb8727 _1y2v1nf5q _1y2v1nf5w _1y2v1nf64 _1y2v1nf6j _1y2v1nf6x _1y2v1nf7a",
-    withoutImage: "wrb8729 wrb8727 _1y2v1nf5q _1y2v1nf5w _1y2v1nf64 _1y2v1nf6j _1y2v1nf6x _1y2v1nf7a"
-}, r = "_1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf5q _1y2v1nf68 _1y2v1nf9o _1y2v1nf7x _1y2v1nf5k";
+var y = "wrb8722 _1y2v1nf64 _1y2v1nf69 _1y2v1nf6g _1y2v1nf6m", f = "wrb8725 _1y2v1nf64", _ = {
+    withImage: "wrb8728 wrb8727 _1y2v1nf64 _1y2v1nf6a _1y2v1nf6i _1y2v1nf6x _1y2v1nf7b _1y2v1nf7o",
+    withoutImage: "wrb8729 wrb8727 _1y2v1nf64 _1y2v1nf6a _1y2v1nf6i _1y2v1nf6x _1y2v1nf7b _1y2v1nf7o"
+}, r = "_1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nf64 _1y2v1nf6m _1y2v1nfa2 _1y2v1nf8b _1y2v1nf5y";

package/dist/horizontal-scroll.css-mistica.js

@@ -15,4 +15,4 @@ _export(exports, {
 require("./sprinkles.css.ts.vanilla.js");
 require("./responsive-layout.css.ts.vanilla.js");
 require("./horizontal-scroll.css.ts.vanilla.js");
-var m = "_1gl3gmv2", v = "_1gl3gmv1 _1y2v1nf5q";
+var m = "_1gl3gmv2", v = "_1gl3gmv1 _1y2v1nf64";

package/dist/icon-button.css-mistica.js

@@ -8,4 +8,4 @@ Object.defineProperty(exports, "base", {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./icon-button.css.ts.vanilla.js");
-var t = "yqt1oe1 _1y2v1nf5u";
+var t = "yqt1oe1 _1y2v1nf68";

package/dist/image.css-mistica.js

@@ -14,4 +14,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./image.css.ts.vanilla.js");
-var f = 300, n = "_17tt25r1 _1y2v1nfa8 _1y2v1nfam _1y2v1nf5s _1y2v1nf7x _1y2v1nf8d _1y2v1nfbs _1y2v1nf9l _1y2v1nf9m";
+var f = 300, n = "_17tt25r1 _1y2v1nfam _1y2v1nfb0 _1y2v1nf66 _1y2v1nf8b _1y2v1nf8r _1y2v1nfc6 _1y2v1nf9z _1y2v1nfa0";

package/dist/image.d.ts

@@ -8,6 +8,7 @@ export declare const MediaBorderRadiusProvider: ({ children, value, }: {
 type ImageErrorProps = {
     noBorderRadius?: boolean;
     withIcon?: boolean;
+    border?: boolean;
 };
 export declare const ImageError: React.ForwardRefExoticComponent<ImageErrorProps & React.RefAttributes<HTMLDivElement>>;
 export type AspectRatio = '1:1' | '16:9' | '7:10' | '4:3';
@@ -33,6 +34,7 @@ export type ImageProps = {
     onLoad?: () => void;
     loadingFallback?: boolean;
     errorFallback?: boolean;
+    border?: boolean;
 };
 export declare const ImageContent: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLImageElement>>;
 declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLImageElement>>;