@muraldevkit/ui-toolkit 4.66.0-dev-DhSN.1 → 4.66.0-dev-T3Jw.1

package/dist/cjs/utils/isElementAriaDisabled/isElementAriaDisabled.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isElementAriaDisabled = void 0;
-/**
- * Checks if an element has aria-disabled="true"
- *
- * @param {HTMLElement | null | undefined} element - The element to check for aria-disabled attribute
- * @returns {boolean} - true if the element has aria-disabled="true", false otherwise
- */
-const isElementAriaDisabled = (element) => {
-    if (!element)
-        return false;
-    const ariaDisabled = element.getAttribute('aria-disabled');
-    return (ariaDisabled === null || ariaDisabled === void 0 ? void 0 : ariaDisabled.trim()) === 'true';
-};
-exports.isElementAriaDisabled = isElementAriaDisabled;

package/dist/cjs/utils/isElementScrollable/index.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isElementScrollable = void 0;
-/**
- * Test if an element is scrollable
- *
- * @param {HTMLElement} element - the element you want to test
- * @returns {boolean} - true if the element is scrollable, false if it is not scrollable
- */
-const isElementScrollable = (element) => {
-    return element.scrollHeight > element.clientHeight;
-};
-exports.isElementScrollable = isElementScrollable;

package/dist/cjs/utils/isImagePath/index.js

@@ -1,47 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isImagePath = void 0;
-const path = __importStar(require("path-browserify"));
-/**
- * Checks if a passed image string is a valid URL
- *
- * @param {string} image - the image string being tested
- * @returns {boolean} - if the image is an image URL
- */
-const isImagePath = (image) => {
-    try {
-        if (typeof image !== 'string')
-            return false;
-        const result = path.parse(image);
-        if (!result)
-            throw result;
-    }
-    catch (err) {
-        return false;
-    }
-    return true;
-};
-exports.isImagePath = isImagePath;

package/dist/cjs/utils/isImageUri/index.js

@@ -1,22 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isImageUri = void 0;
-/**
- * Checks if a passed image string is an image URI
- *
- * @param {string} image - the image string being tested
- * @returns {boolean} - if the image is an image URI
- */
-const isImageUri = (image) => {
-    try {
-        if (typeof image !== 'string')
-            return false;
-        // eslint-disable-next-line no-new
-        new URL(image);
-    }
-    catch (err) {
-        return false;
-    }
-    return true;
-};
-exports.isImageUri = isImageUri;

package/dist/cjs/utils/isObject/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isObject = void 0;
-const isObject_1 = require("./isObject");
-Object.defineProperty(exports, "isObject", { enumerable: true, get: function () { return isObject_1.isObject; } });

package/dist/cjs/utils/isObject/isObject.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isObject = void 0;
-/**
- * Tests that a variable is actually an object and not an array  or null
- * which can mistakenly be flagged as an object
- *
- * @param {Item} item - variable to tests
- * @returns {boolean} - value if item is actually an Object
- */
-const isObject = (item) => {
-    if (item && Array.isArray(item)) {
-        return false;
-    }
-    return item instanceof Object;
-};
-exports.isObject = isObject;

package/dist/cjs/utils/isTouch/index.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isTouchDevice = void 0;
-/**
- * Check if the device is a touch device
- *
- * @returns {boolean} - True if the device is a touch device
- */
-const isTouchDevice = () => {
-    return 'ontouchstart' in window || navigator.maxTouchPoints > 0;
-};
-exports.isTouchDevice = isTouchDevice;

package/dist/cjs/utils/layers/index.js

@@ -1,32 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getCurrentPortalLayer = exports.PORTAL_LAYERS = void 0;
-/* eslint-disable sort-keys */
-/**
- * References to the different portal layers
- */
-exports.PORTAL_LAYERS = {
-    ROOT: { name: 'mrl-root-portal', zIndex: 50000 },
-    TOAST: { name: 'mrl-toast-portal', zIndex: 50001 },
-    MENU: { name: 'mrl-menu-portal', zIndex: 50002 },
-    POPOVER: { name: 'mrl-popover-portal', zIndex: 50003 },
-    POPOVER_MENU: { name: 'mrl-popover-menu-portal', zIndex: 50004 },
-    CALLOUT: { name: 'mrl-callout-portal', zIndex: 50004 },
-    MODAL: { name: 'mrl-modal', zIndex: 50005 },
-    SELECT: { name: 'mrl-select-portal', zIndex: 50006 },
-    TOOLTIP: { name: 'mrl-tooltip-portal', zIndex: 50007 },
-    TOP: { name: 'mrl-top-portal', zIndex: 50008 }
-};
-/**
- * Get the current portal layer based on the provided element
- *
- * @param element - the element to check for the closest portal layer
- * @returns the portal layer id
- */
-const getCurrentPortalLayer = (element) => {
-    if (!element)
-        return null;
-    const closestWithDataLayerId = element.closest('[data-layer-id]');
-    return closestWithDataLayerId ? closestWithDataLayerId.getAttribute('data-layer-id') : null;
-};
-exports.getCurrentPortalLayer = getCurrentPortalLayer;

package/dist/cjs/utils/noop/index.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.noop = void 0;
-/**
- * No operation function to be used as a default callback.
- *
- * Example usage: in tests where there is a required handler, but we do not want to do anything.
- * Better than passing a console log which clutters up our test output.
- */
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-const noop = () => { };
-exports.noop = noop;

package/dist/cjs/utils/preventDefault/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./preventDefault"), exports);

package/dist/cjs/utils/preventDefault/preventDefault.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.preventDefault = void 0;
-/**
- * Prevent default on event
- *
- * @param e - The event
- */
-const preventDefault = (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-};
-exports.preventDefault = preventDefault;

package/dist/cjs/utils/setAttributes/index.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.setClasses = exports.setAttributes = exports.getUniqueId = void 0;
-const setAttributes_1 = require("./setAttributes");
-Object.defineProperty(exports, "getUniqueId", { enumerable: true, get: function () { return setAttributes_1.getUniqueId; } });
-Object.defineProperty(exports, "setAttributes", { enumerable: true, get: function () { return setAttributes_1.setAttributes; } });
-Object.defineProperty(exports, "setClasses", { enumerable: true, get: function () { return setAttributes_1.setClasses; } });

package/dist/cjs/utils/setAttributes/setAttributes.js

@@ -1,87 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getUniqueId = exports.setAttributes = exports.setClasses = void 0;
-const classnames_1 = __importDefault(require("classnames"));
-const isObject_1 = require("../isObject");
-/**
- * Parse a string of attributes into a JSON object
- *
- * @param {string} attributes - the custom attributes passed to a component
- * @returns {AttrsObject} - an object of attributes
- */
-const parseAttributes = (attributes) => {
-    try {
-        return JSON.parse(attributes);
-    }
-    catch (error) {
-        console.error('The attrs property is not properly-formatted JSON:');
-        console.error(attributes);
-        console.error(error);
-        return error;
-    }
-};
-/**
- * Sets up a classObject to be used by the className prop
- *
- * @todo - 2563 - use setClasses across components
- * @param {string} customClasses - custom classes to apply via the attrs prop
- * @param {ClassObject} defaultClasses - design system component classes to apply
- * @returns {ClassObject} - with all classes
- */
-const setClasses = (customClasses, defaultClasses) => {
-    /**
-     * If a string is passed, we must parse it into a valid JSON object.
-     * Otherwise, we can assign the passed attributes directly to the returned object.
-     */
-    const parsedAttr = typeof customClasses === 'string' ? parseAttributes(customClasses) : customClasses;
-    if (parsedAttr && (0, isObject_1.isObject)(parsedAttr) && parsedAttr.class) {
-        return Object.assign({ [`${parsedAttr.class}`]: typeof parsedAttr.class !== 'undefined' && parsedAttr.class.length > 0 }, defaultClasses);
-    }
-    return defaultClasses;
-};
-exports.setClasses = setClasses;
-/**
- * Set an object of attributes to be used in a given component.
- *
- * @param {AttrsObject} attributes - The custom attributes passed to the component
- * @param {AttrsObject} defaults - An optional object of the default attributes of a component
- * @param {string} className - Default classes to apply to the component
- *
- * Use when applying attributes such as a className directly to a react component.
- * @returns {AttrsObject} - An object of component attributes
- */
-const setAttributes = (attributes, defaults = {}, className) => {
-    /**
-     * If a string is passed, we must parse it into a valid JSON object.
-     * Otherwise, we can assign the passed attributes directly to the returned object.
-     */
-    const customAttributes = typeof attributes === 'string' ? parseAttributes(attributes) : attributes;
-    if (customAttributes) {
-        /**
-         * Assign the defaults and the passed attributes to a new object
-         * to ensure that one attributes object without duplicated keys
-         * can be passed to the component.
-         */
-        // Applies className instead of class when forReact is true
-        return Object.assign({}, defaults, customAttributes, {
-            className: (0, classnames_1.default)(className, customAttributes.className)
-        });
-    }
-    return {};
-};
-exports.setAttributes = setAttributes;
-let lastId = 0;
-/**
- *  Generates unique identifier
- *
- * @param {string} prefix  - prefix for identifier
- * @returns {string} - prefixed unique identifier
- */
-const getUniqueId = (prefix = 'mrl') => {
-    lastId++;
-    return `${prefix}-${lastId}`;
-};
-exports.getUniqueId = getUniqueId;

package/dist/cjs/utils/trapFocus/index.js

@@ -1,152 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.trapFocus = exports.getElementWithAutofocus = exports.getFocusableElementsInsideElement = exports.FOCUSABLE_ELEMENTS_SELECTOR = void 0;
-const A_SELECTOR = 'a[href]:not([disabled])';
-const BUTTON_SELECTOR = 'button:not([disabled]):not([tabindex="-1"])';
-const TEXTAREA_SELECTOR = 'textarea:not([disabled])';
-const INPUT = 'input:not([type="hidden"]):not([disabled])';
-const SEARCH_INPUT = 'input[type="search"]:not([disabled])';
-const SELECT_SELECTOR = 'select:not([disabled])';
-const TAB_INDEX = '[tabindex]:not([tabindex="-1"]):not([disabled])';
-const WEB_COMPONENTS = 'mrl-icon-button:not([tabindex="-1"])';
-const TABBABLE_CONTENT_AREAS = 'div[tabindex="0"]';
-exports.FOCUSABLE_ELEMENTS_SELECTOR = [
-    A_SELECTOR,
-    BUTTON_SELECTOR,
-    TEXTAREA_SELECTOR,
-    INPUT,
-    SEARCH_INPUT,
-    SELECT_SELECTOR,
-    TAB_INDEX,
-    WEB_COMPONENTS,
-    TABBABLE_CONTENT_AREAS
-].join(', ');
-/**
- * Focus trap logic
- * @param {HTMLElement} element - The component props.
- * @returns {HTMLElement[]} - The focusable elements inside the element.
- */
-const getFocusableElementsInsideElement = (element) => {
-    const focusableElements = Array.from(element.querySelectorAll(exports.FOCUSABLE_ELEMENTS_SELECTOR)).filter((n) => n instanceof HTMLElement);
-    // If no focusable elements are found, check if the container can be focused
-    if (focusableElements.length === 0) {
-        // Check if the element has a -1 tabindex, if it doesn't let's add it so it can be focused
-        if (!element.hasAttribute('tabindex') || element.tabIndex < 0) {
-            element.setAttribute('tabindex', '-1');
-        }
-        focusableElements.push(element);
-    }
-    return focusableElements;
-};
-exports.getFocusableElementsInsideElement = getFocusableElementsInsideElement;
-/**
- * Gets the first element with the data-autofocus="true" attribute within the container element
- * @param {HTMLElement} containerElement - container element
- * @returns {HTMLElement | undefined} - the first element that has autofocus="true" or undefined
- */
-const getElementWithAutofocus = (containerElement) => {
-    const focusableElements = (0, exports.getFocusableElementsInsideElement)(containerElement);
-    return focusableElements.find((el) => {
-        return el.getAttribute('data-autofocus') === 'true';
-    });
-};
-exports.getElementWithAutofocus = getElementWithAutofocus;
-/**
- * Returns if an element is a radio element
- * @param {Element} el - The element
- * @returns {HTMLInputElement} Returns true if the element is a radio
- */
-const isElementRadioButton = (el) => {
-    return el.tagName === 'INPUT' && el.type === 'radio';
-};
-/**
- * Traps focus inside of an element
- * Adapted from https://hidde.blog/using-javascript-to-trap-focus-in-an-element/
- * @param {HTMLElement} element // Element to trap focus in
- * @param {boolean} disableAutofocus // Whether to disable autofocus
- * @returns {Function}          // Cleanup function to be run when component is
- *                              // removed from the DOM
- */
-const trapFocus = (element, disableAutofocus = false) => {
-    const previouslyFocusedEl = document.activeElement;
-    const mutationObserver = new MutationObserver(() => {
-        const [firstFocusableElement] = (0, exports.getFocusableElementsInsideElement)(element);
-        // The previously focused element was removed from the DOM
-        if (!document.activeElement) {
-            firstFocusableElement.focus();
-        }
-    });
-    const tabListener = (e) => {
-        if (e.key !== 'Tab') {
-            return;
-        }
-        const focusableElements = (0, exports.getFocusableElementsInsideElement)(element);
-        const firstFocusableElement = focusableElements[0];
-        const lastFocusableElement = focusableElements[focusableElements.length - 1];
-        if (e.shiftKey) {
-            // If the activeElement is a radio button and shares the same 'name' attribute as the firstFocusableElement
-            if (document.activeElement &&
-                isElementRadioButton(document.activeElement) &&
-                isElementRadioButton(firstFocusableElement) &&
-                document.activeElement.name === firstFocusableElement.name) {
-                lastFocusableElement.focus();
-                e.preventDefault();
-                return;
-            }
-            // Reverse in tab order, but we're at the beginning of the list
-            if (document.activeElement === firstFocusableElement) {
-                lastFocusableElement.focus();
-                e.preventDefault();
-                return;
-            }
-        }
-        else if (document.activeElement === lastFocusableElement) {
-            // Forward in tab order, but we're at the end of the list
-            firstFocusableElement.focus();
-            e.preventDefault();
-        }
-    };
-    mutationObserver.observe(element, { childList: true, subtree: true });
-    element.addEventListener('keydown', tabListener);
-    /**
-     * In the event an element has its tabindex set after component mounting has completed, we need
-     * to allow the callstack to clear to ensure it's properly set before we can focus the first element.
-     */
-    setTimeout(() => {
-        const elementWithAutofocus = (0, exports.getElementWithAutofocus)(element);
-        if (elementWithAutofocus) {
-            elementWithAutofocus.focus();
-            return;
-        }
-        if (!disableAutofocus) {
-            const [firstFocusableElement] = (0, exports.getFocusableElementsInsideElement)(element);
-            firstFocusableElement === null || firstFocusableElement === void 0 ? void 0 : firstFocusableElement.focus();
-        }
-    }, 20);
-    return () => {
-        element.removeEventListener('keydown', tabListener);
-        mutationObserver.disconnect();
-        /**
-         * Restore focus to element that was in focus before the focus trap was activated
-         *
-         * Conditions to move focus:
-         * - If it is still inside the trap, or effectively "lost"
-         * - If focus has been intentionally moved outside, do nothing
-         */
-        const active = document.activeElement;
-        const focusIsInside = !!active && element.contains(active);
-        const focusIsLost = !active || active === document.body;
-        if (focusIsInside || focusIsLost) {
-            const body = document.body;
-            // get data-focus-item attribute from body
-            const focusItemId = body.dataset.focusItem;
-            const focusItemEl = focusItemId ? document.getElementById(focusItemId) : null;
-            const focusTarget = focusItemEl !== null && focusItemEl !== void 0 ? focusItemEl : previouslyFocusedEl;
-            if (focusTarget instanceof HTMLElement) {
-                focusTarget.focus();
-            }
-            delete body.dataset.focusItem;
-        }
-    };
-};
-exports.trapFocus = trapFocus;

package/dist/esm/components/avatar/MrlAvatar/MrlAvatar.js

@@ -1,97 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { lock, facilitatorBadge } from '@muraldevkit/ds-icons';
-import { hexToRgb, isValidHexColor, isValidRgbString, isValidRgbaString, stickyTextColor } from '@tactivos/mural-shared/lib/colors';
-import * as React from 'react';
-import classNames from 'classnames';
-import { MrlSvg } from '../../svg/MrlSvg/MrlSvg';
-import styles from './MrlAvatar.module.scss.js';
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const avatarValues = {
-    kind: ['default', 'facilitator', 'lock'],
-    size: ['xsmall', 'small', 'medium', 'large']
-};
-export const defaultAvatarValues = {
-    avatarColor: '#2f2f2f',
-    kind: 'default',
-    size: 'medium'
-};
-/**
- * Renders an avatar component
- * @param {MrlAvatarPropTypes} props the props for your MrlAvatar
- * @returns {React.ReactElement} an avatar containing the props you pass
- */
-export const MrlAvatar = (_a) => {
-    var { alt, avatarColor = defaultAvatarValues.avatarColor, dataQa, kind = defaultAvatarValues.kind, image, name, onImageError, showBorder = false, size = defaultAvatarValues.size } = _a, rest = __rest(_a, ["alt", "avatarColor", "dataQa", "kind", "image", "name", "onImageError", "showBorder", "size"]);
-    const containerClasses = classNames(styles['MrlAvatar'], 'MrlAvatar', {
-        [styles[`MrlAvatar--${size}`]]: size && size !== 'medium'
-    });
-    const isFacilitatorSize = size === 'small' || size === 'xsmall';
-    const showIcon = kind !== 'default' && isFacilitatorSize;
-    const iconContainerClasses = classNames(styles['MrlAvatar-icon-container'], {
-        [styles[`MrlAvatar-icon-container--${size}`]]: size && size !== 'medium'
-    });
-    const getAvatarRgb = () => {
-        if (isValidHexColor(avatarColor)) {
-            return hexToRgb(avatarColor).toString();
-        }
-        if (isValidRgbString(avatarColor)) {
-            return avatarColor.substring(4, avatarColor.length - 1);
-        }
-        if (isValidRgbaString(avatarColor)) {
-            const lastComma = avatarColor.lastIndexOf(',');
-            return avatarColor.substring(5, lastComma);
-        }
-    };
-    const renderImage = () => {
-        if (typeof image === 'string') {
-            const imgAltText = alt ? alt : name ? `${name}'s avatar` : 'Participant avatar';
-            return (React.createElement("img", { alt: imgAltText, className: styles['MrlAvatar-image'], "data-qa": `${dataQa || 'avatar'}-image`, onError: onImageError, src: image }));
-        }
-        return image;
-    };
-    const getInitials = (str) => {
-        if (!str) {
-            return '';
-        }
-        const textLength = size === 'xsmall' ? 1 : 2;
-        // Take the name passed in.
-        return (str
-            // Split it at each space to create an array of words
-            .split(' ')
-            // Take the first character from each word.
-            .map((item) => item.charAt(0).toUpperCase())
-            // Bring the characters back into one word
-            .join('')
-            // Make sure we remove spaces
-            .replace(/ /g, '')
-            // Return the correct number of characters
-            .substring(0, textLength));
-    };
-    const isDarkText = stickyTextColor(avatarColor, '#000000', '#ffffff') === '#ffffff';
-    const safeColor = getAvatarRgb();
-    const backgroundColor = image && typeof image === 'string'
-        ? 'rgba(var(--mrl-color-white), 1)'
-        : `rgba(${safeColor}, 0.08)`;
-    const borderColor = showIcon || showBorder ? `rgba(${safeColor}, 1` : 'transparent';
-    const textColor = isDarkText ? `rgba(${safeColor}, 1` : 'rgba(--mrl-gray-90, 1)';
-    return (React.createElement("div", Object.assign({ className: containerClasses, "data-qa": dataQa }, rest),
-        React.createElement("span", { "aria-label": name, className: `${styles['MrlAvatar-content']} MrlAvatar-content`, "data-qa": dataQa && `avatar-${image ? 'image-container' : 'initials'}`, style: {
-                backgroundColor: backgroundColor,
-                borderColor: borderColor,
-                color: textColor
-            } }, image ? renderImage() : React.createElement("span", { "aria-hidden": "true" }, getInitials(name))),
-        showIcon && (React.createElement("span", { className: iconContainerClasses, style: {
-                backgroundColor: borderColor
-            } },
-            React.createElement(MrlSvg, { className: styles['MrlAvatar-icon'], size: "auto", svg: kind === 'facilitator' ? facilitatorBadge : lock })))));
-};

package/dist/esm/components/avatar/MrlAvatar/MrlAvatar.module.css

@@ -1,102 +0,0 @@
-.MrlAvatar-content--UQV5P {
-  border: var(--mrl-stroke-02) solid transparent;
-  border-radius: var(--mrl-radii-03);
-  display: block;
-  font-size: var(--mrl-font-size-04);
-  font-weight: var(--mrl-font-weight-04);
-  height: 100%;
-  line-height: 2.875rem;
-  max-width: 100%;
-  overflow: hidden;
-  text-align: center;
-  width: 100%;
-}
-.MrlAvatar-content--UQV5P .MrlSvgContainer {
-  display: block;
-  height: auto;
-  max-width: 100%;
-  width: 100%;
-}
-
-.MrlAvatar--CSmJ1 {
-  border-radius: var(--mrl-radii-03);
-  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.04) inset;
-  box-sizing: border-box;
-  display: block;
-  height: var(--mrl-spacing-10);
-  position: relative;
-  width: var(--mrl-spacing-10);
-}
-.MrlAvatar--xsmall--zH7bY {
-  height: var(--mrl-spacing-07);
-  width: var(--mrl-spacing-07);
-}
-.MrlAvatar--xsmall--zH7bY .MrlAvatar-content--UQV5P {
-  font-size: var(--mrl-font-size-02);
-  line-height: 1.375rem;
-}
-.MrlAvatar--small--0DC-V {
-  height: var(--mrl-spacing-08);
-  width: var(--mrl-spacing-08);
-}
-.MrlAvatar--small--0DC-V .MrlAvatar-content--UQV5P {
-  font-size: var(--mrl-font-size-02);
-  line-height: 1.875rem;
-}
-.MrlAvatar--large--PVJ9- {
-  border-radius: var(--mrl-radii-06);
-  height: var(--mrl-spacing-13);
-  width: var(--mrl-spacing-13);
-}
-.MrlAvatar--large--PVJ9- .MrlAvatar-content--UQV5P {
-  border-radius: var(--mrl-radii-06);
-  font-size: var(--mrl-font-size-07);
-  line-height: 5.875rem;
-}
-
-.MrlAvatar-image--JrO9I {
-  display: block;
-  height: auto;
-  max-width: 100%;
-  width: 100%;
-}
-
-.MrlAvatar-icon-container--O40ga {
-  border-radius: 1rem;
-  bottom: -0.1875rem;
-  color: var(--mrl-color-background);
-  position: absolute;
-}
-.MrlAvatar-icon-container--O40ga .MrlAvatar-icon--dPg3T {
-  display: block;
-  left: 50%;
-  position: absolute;
-}
-.MrlAvatar-icon-container--O40ga .MrlAvatar-icon--dPg3T .mrl-svg {
-  margin: 0;
-}
-
-.MrlAvatar-icon-container--small--oLvxG {
-  height: 1rem;
-  right: -0.1875rem;
-  width: 1rem;
-}
-.MrlAvatar-icon-container--small--oLvxG .MrlAvatar-icon--dPg3T {
-  height: 1rem;
-  margin-left: -0.3125rem;
-  top: 0;
-  width: 0.625rem;
-}
-
-.MrlAvatar-icon-container--xsmall--6Wbc1 {
-  border-radius: 0.75rem;
-  height: 0.75rem;
-  right: -0.125rem;
-  width: 0.75rem;
-}
-.MrlAvatar-icon-container--xsmall--6Wbc1 .MrlAvatar-icon--dPg3T {
-  height: 0.5rem;
-  margin-left: -0.225rem;
-  top: -0.1rem;
-  width: 0.5rem;
-}