@telefonica/mistica 16.59.0-beta.1 → 16.59.0

package/src/utils/dom.tsx

@@ -1,155 +0,0 @@
-import {isServerSide} from './environment';
-
-import type {DataAttributes} from './types';
-
-/**
- * Returns true if provided type is supported <input> type
- */
-export const isInputTypeSupported = (type: string): boolean => {
-    if (isServerSide()) {
-        return false;
-    }
-    const input = document.createElement('input');
-    input.setAttribute('type', type);
-    return input.type === type;
-};
-
-export const cancelEvent = (event: Event | React.SyntheticEvent): void => {
-    event.stopPropagation();
-    event.preventDefault();
-};
-
-export const createChangeEvent = (
-    target: HTMLInputElement,
-    value: string
-): React.ChangeEvent<HTMLInputElement> => {
-    const event = new Event('change') as any;
-    target.value = value;
-    return {...event, target, currentTarget: target};
-};
-
-/**
- * Detect passive event listeners support
- * See passiveeventlisteners.js at https://github.com/Modernizr/Modernizr/
- */
-let supportsPassive = false;
-try {
-    const options = Object.defineProperty({}, 'passive', {
-        get() {
-            supportsPassive = true;
-            return undefined;
-        },
-    });
-    window.addEventListener('test' as any, () => {}, options);
-} catch (e) {
-    // does not support passive event listeners :(
-}
-
-export const addPassiveEventListener = (
-    el: EventTarget,
-    eventName: string,
-    listener: (e: any) => void
-): void => el.addEventListener(eventName, listener, supportsPassive ? {passive: true} : false);
-
-export const removePassiveEventListener = (
-    el: EventTarget,
-    eventName: string,
-    listener: (e: any) => void
-): void => el.removeEventListener(eventName, listener, false);
-
-/**
- * Prefixes given attributes with `data-`
- *
- * For example: `{foo: 'bar'}` => `{data-foo: 'bar'}`
- */
-export const getPrefixedDataAttributes = (attrs?: DataAttributes, componentName?: string): DataAttributes => {
-    const result: DataAttributes = componentName
-        ? // TODO: remove deprecated component-name in next major release
-          {'data-component-name': componentName, 'data-testid': componentName}
-        : {};
-    if (attrs) {
-        Object.keys(attrs).forEach((key) => {
-            result['data-' + key] = attrs[key];
-        });
-    }
-    return result;
-};
-
-type ScrollAxis = 'X' | 'Y';
-
-const isScrollable = (el: Element, axis: ScrollAxis): boolean => {
-    const overflowKey: 'overflowX' | 'overflowY' = `overflow${axis}`;
-    const overflowValue = window.getComputedStyle(el)[overflowKey];
-    return ['auto', 'scroll', 'overlay'].includes(overflowValue);
-};
-
-export const getScrollableParentElement = (el?: HTMLElement | null, axis: ScrollAxis = 'Y'): HTMLElement => {
-    let result = el?.parentElement;
-    while (result && !isScrollable(result, axis)) {
-        result = result.parentElement;
-    }
-    return result || document.documentElement;
-};
-
-export const getScrollDistanceToBottom = (el: HTMLElement): number =>
-    el.scrollHeight - el.scrollTop - el.clientHeight;
-
-export const hasScroll = (el: HTMLElement): boolean => el.scrollHeight > el.clientHeight;
-
-type ResizeListener = (entries: Array<ResizeObserverEntry>, observer: ResizeObserver) => void;
-export const listenResize = (element: Element, handler: ResizeListener): (() => void) => {
-    const getResizeObserverPromise = (): Promise<typeof window.ResizeObserver | null> => {
-        if (isServerSide()) {
-            return Promise.resolve(null);
-        }
-        return window.ResizeObserver
-            ? Promise.resolve(ResizeObserver)
-            : import(/* webpackChunkName: "@juggle/resize-observer" */ '@juggle/resize-observer').then(
-                  (m: any) => m.ResizeObserver
-              );
-    };
-    let cancelled = false;
-    let resizeObserver: ResizeObserver | null = null;
-    getResizeObserverPromise().then((ResizeObserver) => {
-        if (!cancelled && ResizeObserver) {
-            resizeObserver = new ResizeObserver(handler);
-            resizeObserver.observe(element);
-        }
-    });
-
-    return () => {
-        cancelled = true;
-        if (resizeObserver) {
-            resizeObserver.disconnect();
-        }
-    };
-};
-
-const parseVarCall = (cssVar: string) => {
-    const [varName, fallback] = cssVar
-        .replace(/^var\(/, '')
-        .replace(/\)$/, '')
-        .split(/\s*,\s*(.*)/);
-    return {varName, fallback};
-};
-
-export const isCssVar = (cssVar: string): boolean => cssVar.startsWith('var(') || cssVar.startsWith('--');
-
-export const getCssVarValue = (cssVar: string, element?: Element): string => {
-    if (!isCssVar(cssVar)) {
-        throw new Error(`Invalid css var: ${cssVar}`);
-    }
-
-    if (cssVar.startsWith('var(')) {
-        const {varName, fallback} = parseVarCall(cssVar);
-        const value = getCssVarValue(varName, element);
-        if (!value && fallback) {
-            if (!isCssVar(fallback)) {
-                return fallback;
-            }
-            return getCssVarValue(fallback, element);
-        }
-        return value;
-    }
-    return getComputedStyle(element ?? document.documentElement).getPropertyValue(cssVar);
-};

package/src/utils/environment.tsx

@@ -1,6 +0,0 @@
-export const isServerSide = (): boolean => typeof window === 'undefined';
-
-export const isClientSide = (): boolean => !isServerSide();
-
-export const isTouchableDevice = (): boolean =>
-    isClientSide() ? window.matchMedia('(pointer: coarse)').matches : false;

package/src/utils/headings.tsx

@@ -1,18 +0,0 @@
-import type {HeadingType} from './types';
-
-/**
- * @returns {boolean} - Returns true if the first heading is bigger, false otherwise.
- */
-export const isBiggerHeading = (heading: HeadingType, otherHeading?: HeadingType): boolean => {
-    // In case headings are equal, we consider that the first one has more priority
-    if (!otherHeading || heading === otherHeading) {
-        return true;
-    }
-
-    if (heading === 'span') {
-        return false;
-    }
-
-    // Both are header tags
-    return heading < otherHeading;
-};

package/src/utils/helpers.tsx

@@ -1,182 +0,0 @@
-/** These functions are copies of the ones located in webapp packages */
-
-type Debounced<T> = T & {cancel: () => void; flush: () => void};
-
-/**
- * Creates a debounced function that delays invoking func until after wait milliseconds
- * have elapsed since the last time the debounced function was invoked. The debounced function
- * comes with a cancel method to cancel delayed func invocations and a flush method to immediately
- * invoke them. The func is invoked with the last arguments provided to the debounced function.
- * Subsequent calls to the debounced function return the result of the last func invocation.
- */
-export const debounce = <T extends (...args: Array<any>) => any>(
-    func: T,
-    wait: number,
-    options: {
-        leading?: boolean;
-        trailing?: boolean;
-        maxWait?: number;
-    } = {}
-): Debounced<T> => {
-    const waitTime = wait;
-    const leading = options.leading ?? false;
-    const trailing = options.trailing ?? true;
-    const maxWait = options.maxWait !== undefined ? Math.max(options.maxWait, waitTime) : undefined;
-
-    let currentArgs: Parameters<T> | undefined;
-    let lastInvokeTime = 0;
-    let lastCallTime = -1;
-    let result: any;
-
-    let timerId: ReturnType<typeof setTimeout> | undefined;
-
-    const invokeFunction = (time: number): any => {
-        lastInvokeTime = time;
-        if (currentArgs) {
-            result = func(...currentArgs);
-        }
-        currentArgs = undefined;
-        return result;
-    };
-
-    const shouldInvoke = (time: number): boolean => {
-        const timeSinceLastCall = time - lastCallTime;
-        const timeSinceLastInvoke = time - lastInvokeTime;
-
-        return (
-            lastCallTime < 0 ||
-            timeSinceLastCall >= wait ||
-            timeSinceLastCall < 0 ||
-            (maxWait !== undefined && timeSinceLastInvoke >= maxWait)
-        );
-    };
-
-    const remainingWait = (time: number): number => {
-        const timeSinceLastCall = time - lastCallTime;
-        const timeSinceLastInvoke = time - lastInvokeTime;
-        const timeWaiting = wait - timeSinceLastCall;
-        return maxWait !== undefined ? Math.min(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
-    };
-
-    const trailingEdge = (time: number): any => {
-        timerId = undefined;
-
-        if (trailing && currentArgs) {
-            return invokeFunction(time);
-        }
-
-        currentArgs = undefined;
-        return result;
-    };
-
-    const timerExpired = (): any => {
-        const time = Date.now();
-        if (shouldInvoke(time)) {
-            return trailingEdge(time);
-        }
-        timerId = setTimeout(timerExpired, remainingWait(time));
-    };
-
-    const leadingEdge = (time: number): any => {
-        lastInvokeTime = time;
-
-        timerId = setTimeout(timerExpired, waitTime);
-        return leading ? invokeFunction(time) : result;
-    };
-
-    const debounced = (...args: Parameters<T>) => {
-        const time = Date.now();
-        const isInvoking = shouldInvoke(time);
-
-        currentArgs = args;
-        lastCallTime = time;
-
-        if (isInvoking) {
-            if (timerId === undefined) {
-                return leadingEdge(lastCallTime);
-            }
-            if (maxWait !== undefined) {
-                timerId = setTimeout(timerExpired, waitTime);
-                return invokeFunction(lastCallTime);
-            }
-        }
-        if (timerId === undefined) {
-            timerId = setTimeout(timerExpired, waitTime);
-        }
-        return result;
-    };
-
-    debounced.cancel = (): void => {
-        if (timerId !== undefined) {
-            clearTimeout(timerId);
-            timerId = undefined;
-        }
-        lastInvokeTime = 0;
-        lastCallTime = -1;
-        currentArgs = undefined;
-    };
-
-    debounced.flush = (): any => {
-        return timerId === undefined ? result : trailingEdge(Date.now());
-    };
-
-    return debounced as Debounced<T>;
-};
-
-const isPrimitive = (v: unknown): v is string | number | undefined | null | boolean | symbol => {
-    if (v === null) {
-        return true;
-    }
-    if (typeof v === 'object' || typeof v === 'function') {
-        return false;
-    }
-    return true;
-};
-
-/**
- * Performs a deep comparison between two values to determine if they are equivalent.
- */
-export const isEqual = (a: unknown, b: unknown): boolean => {
-    if (a === b) {
-        return true;
-    }
-
-    if (typeof a === 'number' && typeof b === 'number' && isNaN(a) && isNaN(b)) {
-        return true;
-    }
-
-    if (isPrimitive(a) || isPrimitive(b)) {
-        return false;
-    }
-
-    if (typeof a !== typeof b) {
-        return false;
-    }
-
-    if (typeof a === 'function') {
-        // no need to check typeof b === 'function' because of the previous check
-        return false;
-    }
-
-    if (Array.isArray(a) || Array.isArray(b)) {
-        if (Array.isArray(a) && Array.isArray(b)) {
-            return a.length === b.length && a.every((value, index) => isEqual(value, b[index]));
-        }
-        return false;
-    }
-
-    if (a instanceof Date || b instanceof Date) {
-        if (a instanceof Date && b instanceof Date) {
-            return a.getTime() === b.getTime();
-        }
-        return false;
-    }
-
-    const keysA = Object.keys(a as any);
-    const keysB = Object.keys(b as any);
-    if (keysA.length === keysB.length) {
-        return keysA.every((key) => isEqual((a as any)[key], (b as any)[key]));
-    }
-
-    return false;
-};

package/src/utils/keys.tsx

@@ -1,8 +0,0 @@
-export const LEFT = 'ArrowLeft';
-export const UP = 'ArrowUp';
-export const RIGHT = 'ArrowRight';
-export const DOWN = 'ArrowDown';
-export const ENTER = 'Enter';
-export const ESC = 'Escape';
-export const SPACE = ' ';
-export const TAB = 'Tab';

package/src/utils/locale.tsx

@@ -1,27 +0,0 @@
-export type Locale =
-    | 'ca-ES'
-    | 'en-US'
-    | 'en-GB'
-    | 'de-DE'
-    | 'es-AR'
-    | 'es-CO'
-    | 'es-EC'
-    | 'es-ES'
-    | 'es-MX'
-    | 'es-PE'
-    | 'es-UY'
-    | 'eu-ES'
-    | 'gl-ES'
-    | 'pt-BR';
-
-const SUPPORTED_LANGUAGES = ['en', 'es', 'pt', 'de'] as const;
-
-export type Language = (typeof SUPPORTED_LANGUAGES)[number];
-
-export const localeToLanguage = (locale: Locale): Language => {
-    const lang = locale.split('-')[0] as Language;
-    if (SUPPORTED_LANGUAGES.includes(lang)) {
-        return lang;
-    }
-    return 'en';
-};

package/src/utils/platform.tsx

@@ -1,94 +0,0 @@
-import {isWebViewBridgeAvailable} from '@tef-novum/webview-bridge';
-
-import type {Theme} from '../theme';
-
-const getUserAgent = (platformOverrides: Theme['platformOverrides'] = {}): string => {
-    if (typeof self === 'undefined') {
-        return platformOverrides.userAgent ?? '';
-    }
-    return self.navigator?.userAgent ?? '';
-};
-
-export const isInsideNovumNativeApp = (platformOverrides: Theme['platformOverrides'] = {}): boolean => {
-    if (typeof platformOverrides.insideNovumNativeApp !== 'undefined') {
-        return platformOverrides.insideNovumNativeApp;
-    }
-    return isWebViewBridgeAvailable();
-};
-
-export const isRunningAcceptanceTest = (platformOverrides: Theme['platformOverrides'] = {}): boolean =>
-    getUserAgent(platformOverrides).includes('acceptance-test') && !process.env.SSR_TEST;
-
-const isEdgeOrIE = Boolean(typeof self !== 'undefined' && (self as any).MSStream);
-
-export const isAndroid = (platformOverrides: Theme['platformOverrides']): boolean => {
-    if (platformOverrides.platform === 'android') {
-        return true;
-    }
-
-    return getUserAgent(platformOverrides).toLowerCase().includes('android') && !isEdgeOrIE;
-};
-
-export const isIos = (platformOverrides: Theme['platformOverrides']): boolean => {
-    if (platformOverrides.platform === 'ios') {
-        return true;
-    }
-
-    // IE and Edge mobile browsers includes Android and iPhone in the user agent
-    if (/iPad|iPhone|iPod/.test(getUserAgent(platformOverrides)) && !isEdgeOrIE) {
-        return true;
-    }
-
-    // In iOS13, iPad uses the Mac OS user-agent, but we know it's an iOS device when it runs inside our
-    // native app and is not Android
-    if (isInsideNovumNativeApp(platformOverrides) && !isAndroid(platformOverrides)) {
-        return true;
-    }
-
-    return false;
-};
-
-/**
- * Returns true if the browser is a safari browser:
- * webview, mobile, desktop or a browser like Chrome for iOS which is just a safari with a skin
- *
- * Note that this function checks the navigator vendor. It doesn't use platformOverrides or userAgent.
- */
-export const isSafari = (): boolean => {
-    return navigator.vendor.includes('Apple');
-};
-
-export const isFirefox = (platformOverrides?: Theme['platformOverrides']): boolean =>
-    !!getUserAgent(platformOverrides).match(/Firefox\/([0-9]+)\./);
-
-export const isChrome = (platformOverrides: Theme['platformOverrides']): boolean =>
-    !!getUserAgent(platformOverrides).match(/Chrom(e|ium)\/([0-9]+)\./);
-
-const SEMVER_ZERO = '0.0.0';
-export const getIosVersion = (platformOverrides: Theme['platformOverrides']): string => {
-    if (!isIos(platformOverrides)) {
-        return SEMVER_ZERO;
-    }
-    const raw = getUserAgent(platformOverrides).match(/OS ((\d+_?){1,3})[\s_]/);
-    if (!raw || !raw[1]) {
-        return SEMVER_ZERO;
-    }
-    const [major, minor = '0', patch = '0'] = raw[1].split('_');
-    return [major, minor, patch].join('.');
-};
-
-export const getPlatform = (
-    platformOverrides: Theme['platformOverrides'] = {}
-): 'ios' | 'android' | 'desktop' => {
-    const overridenPlatform = platformOverrides.platform;
-    if (overridenPlatform) {
-        return overridenPlatform;
-    }
-    if (isIos(platformOverrides)) {
-        return 'ios';
-    }
-    if (isAndroid(platformOverrides)) {
-        return 'android';
-    }
-    return 'desktop';
-};

package/src/utils/region-code.tsx

@@ -1 +0,0 @@
-export type RegionCode = 'AR' | 'BR' | 'CO' | 'DE' | 'EC' | 'ES' | 'GB' | 'MX' | 'PE' | 'UY';

package/src/utils/renders-element.tsx

@@ -1,6 +0,0 @@
-import type * as React from 'react';
-
-export type RendersElement<T extends keyof JSX.IntrinsicElements | React.JSXElementConstructor<any>> =
-    React.ReactComponentElement<T>;
-export type RendersNullableElement<T extends keyof JSX.IntrinsicElements | React.JSXElementConstructor<any>> =
-    React.ReactComponentElement<T> | null;

package/src/utils/time.tsx

@@ -1,22 +0,0 @@
-export const getLocalDateString = (date: Date): string => {
-    const yyyy = date.getFullYear();
-    const mm = String(date.getMonth() + 1).padStart(2, '0');
-    const dd = String(date.getDate()).padStart(2, '0');
-    return `${yyyy}-${mm}-${dd}`;
-};
-
-export const getLocalYearMonthString = (date: Date): string => {
-    const yyyy = date.getFullYear();
-    const mm = String(date.getMonth() + 1).padStart(2, '0');
-    return `${yyyy}-${mm}`;
-};
-
-export const getLocalTimeString = (date: Date): string => {
-    const h = String(date.getHours()).padStart(2, '0');
-    const m = String(date.getMinutes()).padStart(2, '0');
-    return `${h}:${m}`;
-};
-
-export const getLocalDateTimeString = (date: Date): string => {
-    return `${getLocalDateString(date)}T${getLocalTimeString(date)}`;
-};

package/src/utils/types.tsx

@@ -1,19 +0,0 @@
-export type {RendersElement, RendersNullableElement} from './renders-element';
-
-export type {TrackingEvent} from '@tef-novum/webview-bridge';
-
-export type DataAttributes = {
-    [name: string]: string | number | boolean | undefined;
-    testid?: string;
-};
-
-export type IconProps = {
-    color?: string;
-    size?: string | number;
-    className?: string;
-    style?: React.CSSProperties;
-};
-
-export type ByBreakpoint<T> = T | {mobile: T; tablet?: T; desktop: T};
-
-export type HeadingType = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';

package/src/utils/utility-types.tsx

@@ -1,8 +0,0 @@
-type AllKeys<T> = T extends unknown ? keyof T : never;
-export type Id<T> = T extends infer U ? {[K in keyof U]: U[K]} : never;
-type _ExclusifyUnion<T, K extends PropertyKey> = T extends unknown
-    ? Id<T & Partial<Record<Exclude<K, keyof T>, never>>>
-    : never;
-
-// https://juhanajauhiainen.com/posts/how-to-type-an-object-with-exclusive-or-properties-in-typescript
-export type ExclusifyUnion<T> = _ExclusifyUnion<T, AllKeys<T>>;

package/src/video.css.ts

@@ -1,11 +0,0 @@
-import {sprinkles} from './sprinkles.css';
-
-export const video = sprinkles({
-    top: 0,
-    left: 0,
-    display: 'block',
-    background: 'transparent',
-    maxWidth: '100%',
-    maxHeight: '100%',
-    objectFit: 'cover',
-});