@telefonica/mistica 15.20.1 → 16.1.0

package/dist/sheet-root.js

@@ -11,25 +11,17 @@ function _export(target, all) {
 }
 _export(exports, {
     SheetRoot: function() {
-        return M;
+        return f;
     },
     default: function() {
-        return F;
+        return d;
     },
     showSheet: function() {
-        return B;
+        return p;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
-const _sheet = require("./sheet.js");
-const _image = /*#__PURE__*/ _interop_require_default(require("./image.js"));
-const _hooks = require("./hooks.js");
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
 function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
     var cacheBabelInterop = new WeakMap();
@@ -71,320 +63,54 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
-    try {
-        var info = gen[key](arg);
-        var value = info.value;
-    } catch (error) {
-        reject(error);
-        return;
-    }
-    if (info.done) {
-        resolve(value);
-    } else {
-        Promise.resolve(value).then(_next, _throw);
-    }
-}
-function _async_to_generator(fn) {
-    return function() {
-        var self = this, args = arguments;
-        return new Promise(function(resolve, reject) {
-            var gen = fn.apply(self, args);
-            function _next(value) {
-                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
-            }
-            function _throw(err) {
-                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
-            }
-            _next(undefined);
-        });
-    };
-}
-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;
-}
-let p = null, n = null, l = null;
-const d = (r)=>Array.isArray(r) ? r.length ? r.join(`
-
-`) : void 0 : r, L = (param)=>{
-    let { title: r, subtitle: c, description: e, selectedId: s, items: t } = param;
-    return l({
-        title: r,
-        subtitle: c,
-        // TODO: add multiline support to native sheet
-        description: d(e),
-        content: [
-            {
-                type: "LIST",
-                id: "list-0",
-                listType: "SINGLE_SELECTION",
-                autoSubmit: !0,
-                selectedIds: typeof s == "string" ? [
-                    s
-                ] : [],
-                items: t
-            }
-        ]
-    }).then((param)=>{
-        let { action: o, result: a } = param;
-        return o === "SUBMIT" ? {
-            action: o,
-            selectedId: a[0].selectedIds[0]
-        } : {
-            action: o,
-            selectedId: null
-        };
-    });
-}, k = (param)=>{
-    let { title: r, subtitle: c, description: e, items: s } = param;
-    return l({
-        title: r,
-        subtitle: c,
-        // TODO: add multiline support to native sheet
-        description: d(e),
-        content: [
-            {
-                type: "LIST",
-                id: "list-0",
-                listType: "ACTIONS",
-                autoSubmit: !0,
-                selectedIds: [],
-                items: s
-            }
-        ]
-    }).then((param)=>{
-        let { action: t, result: o } = param;
-        return t === "SUBMIT" ? {
-            action: t,
-            selectedId: o[0].selectedIds[0]
-        } : {
-            action: t,
-            selectedId: null
-        };
-    });
-}, b = function() {
-    var _ref = _async_to_generator(function*(param) {
-        let { title: r, subtitle: c, description: e, items: s } = param;
-        yield l({
-            title: r,
-            subtitle: c,
-            // TODO: add multiline support to native sheet
-            description: d(e),
-            content: [
-                {
-                    type: "LIST",
-                    id: "list-0",
-                    listType: "INFORMATIVE",
-                    autoSubmit: !1,
-                    selectedIds: [],
-                    items: s
-                }
-            ]
-        });
-    });
-    return function b(_) {
-        return _ref.apply(this, arguments);
-    };
-}(), C = function() {
-    var _ref = _async_to_generator(function*(param) {
-        let { title: r, subtitle: c, description: e, button: s, secondaryButton: t, link: o } = param;
-        return l({
-            title: r,
-            subtitle: c,
-            // TODO: add multiline support to native sheet
-            description: d(e),
-            content: [
-                {
-                    type: "BOTTOM_ACTIONS",
-                    id: "bottom-actions-0",
-                    button: s,
-                    secondaryButton: t,
-                    link: o
-                }
-            ]
-        }).then((param)=>{
-            let { action: a, result: i } = param;
-            if (a === "SUBMIT") {
-                const f = i.find((param)=>{
-                    let { id: T } = param;
-                    return T === "bottom-actions-0";
-                }), I = f == null ? void 0 : f.selectedIds[0];
-                if (I === "PRIMARY" || I === "SECONDARY" || I === "LINK") return {
-                    action: I
-                };
-            }
-            return {
-                action: "DISMISS"
-            };
-        });
-    });
-    return function C(_) {
-        return _ref.apply(this, arguments);
-    };
-}();
-let h = !1;
-const B = (r)=>{
-    const c = ()=>{
-        if (!p) return Promise.reject(new Error("Tried to show a Sheet but the SheetRoot component was not mounted"));
-        if (h) return Promise.reject(new Error("Tried to show a Sheet but there is already one open"));
-        h = !0, p(r);
-        const e = new Promise((s)=>{
-            n = s;
+const h = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "sheet-web" */ "./sheet-web.js"))));
+let i = null, s = null, l = null, u = !1;
+const p = (t)=>{
+    const o = ()=>{
+        if (!s) return Promise.reject(new Error("Tried to show a Sheet but the SheetRoot component was not mounted"));
+        if (u) return Promise.reject(new Error("Tried to show a Sheet but there is already one open"));
+        u = !0, s(t);
+        const n = new Promise((e)=>{
+            l = e;
         });
-        return e.finally(()=>{
-            h = !1;
-        }), e;
+        return n.finally(()=>{
+            u = !1;
+        }), n;
     };
-    if (l) {
-        let e;
-        const { type: s, props: t } = r;
-        switch(s){
-            case "INFO":
-                e = b(t);
-                break;
-            case "ACTIONS_LIST":
-                e = k(t);
-                break;
-            case "RADIO_LIST":
-                e = L(t);
-                break;
-            case "ACTIONS":
-                e = C(t);
-                break;
-            default:
-                const o = s;
-                throw new Error(`Unknown sheet type: ${o}`);
-        }
-        return e.catch((o)=>{
-            if (o.code === "400") return c();
-            throw o;
+    if (i) {
+        const n = i;
+        return Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "sheet-native" */ "./sheet-native.js"))).then((param)=>{
+            let { showNativeSheet: e } = param;
+            return e(n, t);
+        }).catch((e)=>{
+            if (e.code === "400") return o();
+            throw e;
         });
-    } else return c();
-}, M = (r)=>{
-    const { isDarkMode: c } = (0, _hooks.useTheme)(), [e, s] = _react.useState(null), t = _react.useRef(null);
-    if (_react.useEffect(()=>{
-        if (r.nativeImplementation) return l = r.nativeImplementation, ()=>{
-            l = null;
+    } else return o();
+}, f = (t)=>{
+    const [o, n] = _react.useState(null);
+    return _react.useEffect(()=>{
+        if (t.nativeImplementation) return i = t.nativeImplementation, ()=>{
+            i = null;
         };
     }, [
-        r.nativeImplementation
-    ]), _react.useEffect(()=>(p = (i)=>{
-            t.current = null, s(i);
+        t.nativeImplementation
+    ]), _react.useEffect(()=>(s = (e)=>{
+            n(e);
         }, ()=>{
-            p = null;
-        }), []), !e) return null;
-    const o = ()=>{
-        switch(s(null), e.type){
-            case "INFO":
-                n == null || n(void 0);
-                break;
-            case "ACTIONS_LIST":
-                t.current ? n == null || n({
-                    action: "SUBMIT",
-                    selectedId: t.current
-                }) : n == null || n({
-                    action: "DISMISS"
-                });
-                break;
-            case "RADIO_LIST":
-                t.current ? n == null || n({
-                    action: "SUBMIT",
-                    selectedId: t.current
-                }) : n == null || n({
-                    action: "DISMISS"
-                });
-                break;
-            case "ACTIONS":
-                t.current === "PRIMARY" || t.current === "SECONDARY" || t.current === "LINK" ? n == null || n({
-                    action: t.current
-                }) : n == null || n({
-                    action: "DISMISS"
-                });
-                break;
-            default:
-                throw new Error(`Unknown sheet type: ${e.type}`);
-        }
-    }, a = (i)=>{
-        t.current = i;
-    };
-    switch(e.type){
-        case "INFO":
-            return /* @__PURE__ */ (0, _jsxruntime.jsx)(_sheet.InfoSheet, _object_spread_props(_object_spread({}, e.props), {
-                onClose: o
-            }));
-        case "ACTIONS_LIST":
-            return /* @__PURE__ */ (0, _jsxruntime.jsx)(_sheet.ActionsListSheet, _object_spread_props(_object_spread({}, e.props), {
-                onClose: o,
-                onSelect: a
-            }));
-        case "RADIO_LIST":
-            return /* @__PURE__ */ (0, _jsxruntime.jsx)(_sheet.RadioListSheet, _object_spread_props(_object_spread({}, e.props), {
-                items: e.props.items.map((i)=>_object_spread_props(_object_spread({}, i), {
-                        asset: i.icon && /* @__PURE__ */ (0, _jsxruntime.jsx)(_image.default, {
-                            circular: !0,
-                            src: c && i.icon.urlDark ? i.icon.urlDark : i.icon.url,
-                            width: i.icon.size === "small" ? 24 : 40
-                        })
-                    })),
-                onClose: o,
-                onSelect: a
-            }));
-        case "ACTIONS":
-            return /* @__PURE__ */ (0, _jsxruntime.jsx)(_sheet.ActionsSheet, _object_spread_props(_object_spread({}, e.props), {
-                buttonLink: e.props.link,
-                onClose: o,
-                onPressButton: a
-            }));
-        default:
-            throw new Error(`Unknown sheet type: ${e.type}`);
-    }
-}, F = M;
+            s = null;
+        }), []), /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+        children: [
+            t.children,
+            o && /* @__PURE__ */ (0, _jsxruntime.jsx)(_react.Suspense, {
+                fallback: null,
+                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(h, {
+                    sheetProps: o,
+                    onResolve: (e)=>{
+                        n(null), l == null || l(e);
+                    }
+                })
+            })
+        ]
+    });
+}, d = f;

package/dist/sheet-types.d.ts

@@ -0,0 +1,88 @@
+export type NativeSheetImplementation = (typeof import('@tef-novum/webview-bridge'))['bottomSheet'];
+import type { ExclusifyUnion, Id } from './utils/utility-types';
+type InfoIcon = ExclusifyUnion<{
+    type: 'small' | 'regular';
+    url: string;
+    urlDark?: string;
+} | {
+    type: 'bullet';
+}>;
+type SheetProps<T> = Id<{
+    title?: string;
+    subtitle?: string;
+    description?: string | Array<string>;
+} & T>;
+export type SheetPropsByType = {
+    RADIO_LIST: SheetProps<{
+        selectedId?: string;
+        items: Array<{
+            id: string;
+            title?: string;
+            description?: string;
+            icon?: {
+                size?: 'small' | 'large';
+                url: string;
+                urlDark?: string;
+            };
+        }>;
+    }>;
+    ACTIONS_LIST: SheetProps<{
+        items: Array<{
+            id: string;
+            title: string;
+            style?: 'normal' | 'destructive';
+            icon?: {
+                url: string;
+                urlDark?: string;
+            };
+        }>;
+    }>;
+    INFO: SheetProps<{
+        items: Array<{
+            id: string;
+            title: string;
+            description?: string;
+            icon: InfoIcon;
+        }>;
+    }>;
+    ACTIONS: SheetProps<{
+        button: {
+            text: string;
+        };
+        secondaryButton?: {
+            text: string;
+        };
+        link?: {
+            text: string;
+            withChevron?: boolean;
+        };
+    }>;
+};
+export type SheetType = keyof SheetPropsByType;
+export type SheetResultByType = {
+    RADIO_LIST: {
+        action: 'SUBMIT';
+        selectedId: string;
+    } | {
+        action: 'DISMISS';
+    };
+    ACTIONS_LIST: {
+        action: 'SUBMIT';
+        selectedId: string;
+    } | {
+        action: 'DISMISS';
+    };
+    INFO: void;
+    ACTIONS: {
+        action: 'PRIMARY' | 'SECONDARY' | 'LINK' | 'DISMISS';
+    };
+};
+export type SheetTypeWithProps<T extends SheetType> = Id<{
+    type: T;
+    props: SheetPropsByType[T];
+}>;
+export type SheetTypeWithPropsUnion = {
+    [T in SheetType]: SheetTypeWithProps<T>;
+}[SheetType];
+export type SheetPromiseResolve = <T>(value: T extends SheetType ? SheetResultByType[T] : 'You must provide a type parameter') => void;
+export {};

package/dist/sheet-web.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import type { SheetPromiseResolve, SheetTypeWithPropsUnion } from './sheet-types';
+type SheetWebProps = {
+    sheetProps: SheetTypeWithPropsUnion;
+    onResolve: SheetPromiseResolve;
+};
+declare const SheetWeb: ({ sheetProps, onResolve }: SheetWebProps) => JSX.Element;
+export default SheetWeb;

package/dist/sheet-web.js

@@ -0,0 +1,183 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return w;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _hooks = require("./hooks.js");
+const _image = /*#__PURE__*/ _interop_require_default(require("./image.js"));
+function _interop_require_default(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 _interop_require_wildcard(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 = {
+        __proto__: null
+    };
+    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 _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;
+}
+const S = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "sheet-actions" */ "./sheet-actions.js")))), I = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "sheet-info" */ "./sheet-info.js")))), p = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "sheet-action-list" */ "./sheet-actions-list.js")))), d = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "sheet-radio-list" */ "./sheet-radio-list.js")))), w = (param)=>{
+    let { sheetProps: t, onResolve: e } = param;
+    const { isDarkMode: s } = (0, _hooks.useTheme)(), r = _react.useRef(null), i = (n)=>{
+        r.current = n;
+    }, a = ()=>{
+        if (!e) throw new Error("onResolve handler is not set");
+        switch(t.type){
+            case "INFO":
+                e(void 0);
+                break;
+            case "ACTIONS_LIST":
+                r.current ? e({
+                    action: "SUBMIT",
+                    selectedId: r.current
+                }) : e({
+                    action: "DISMISS"
+                });
+                break;
+            case "RADIO_LIST":
+                r.current ? e({
+                    action: "SUBMIT",
+                    selectedId: r.current
+                }) : e({
+                    action: "DISMISS"
+                });
+                break;
+            case "ACTIONS":
+                r.current === "PRIMARY" || r.current === "SECONDARY" || r.current === "LINK" ? e({
+                    action: r.current
+                }) : e({
+                    action: "DISMISS"
+                });
+                break;
+            default:
+                throw new Error(`Unknown sheet type: ${t.type}`);
+        }
+        r.current = null;
+    };
+    switch(t.type){
+        case "INFO":
+            return /* @__PURE__ */ (0, _jsxruntime.jsx)(I, _object_spread_props(_object_spread({}, t.props), {
+                onClose: a
+            }));
+        case "ACTIONS_LIST":
+            return /* @__PURE__ */ (0, _jsxruntime.jsx)(p, _object_spread_props(_object_spread({}, t.props), {
+                onClose: a,
+                onSelect: i
+            }));
+        case "RADIO_LIST":
+            return /* @__PURE__ */ (0, _jsxruntime.jsx)(d, _object_spread_props(_object_spread({}, t.props), {
+                items: t.props.items.map((n)=>_object_spread_props(_object_spread({}, n), {
+                        asset: n.icon && /* @__PURE__ */ (0, _jsxruntime.jsx)(_image.default, {
+                            circular: !0,
+                            src: s && n.icon.urlDark ? n.icon.urlDark : n.icon.url,
+                            width: n.icon.size === "small" ? 24 : 40
+                        })
+                    })),
+                onClose: a,
+                onSelect: i
+            }));
+        case "ACTIONS":
+            return /* @__PURE__ */ (0, _jsxruntime.jsx)(S, _object_spread_props(_object_spread({}, t.props), {
+                buttonLink: t.props.link,
+                onClose: a,
+                onPressButton: i
+            }));
+        default:
+            throw new Error(`Unknown sheet type: ${t.type}`);
+    }
+};

package/dist/skeleton-base.js

@@ -19,9 +19,9 @@ function _interop_require_default(obj) {
         default: obj
     };
 }
-const d = (param)=>{
+const c = (param)=>{
     let { width: e = "100%", height: o = 8, radius: s = _skincontractcssmistica.vars.borderRadii.container, className: a, noBorderRadius: n = !1 } = param;
-    const t = (0, _themevariantcontext.useIsInverseVariant)();
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
         className: (0, _classnames.default)(a, (0, _sprinklescssmistica.sprinkles)({
             background: t ? _skincontractcssmistica.vars.colors.backgroundSkeletonInverse : _skincontractcssmistica.vars.colors.backgroundSkeleton
@@ -33,4 +33,4 @@ const d = (param)=>{
         },
         "aria-hidden": !0
     });
-}, v = d;
+}, v = c;