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

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavItem/MrlSidebarNavItem.js

@@ -1,63 +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;
-};
-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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MrlSidebarNavItem = void 0;
-const React = __importStar(require("react"));
-const classnames_1 = __importDefault(require("classnames"));
-const __1 = require("../../");
-const MrlSidebarNavItem_module_scss_1 = __importDefault(require("./MrlSidebarNavItem.module.scss.js"));
-/**
- * Sidebar nav item component
- * @param {MrlSidebarNavItemProps} props - the component props
- * @returns a sidebar nav item
- */
-function MrlSidebarNavItem(_a) {
-    var { className, ['data-qa']: qa, icon, isSelected, text, renderLink } = _a, rest = __rest(_a, ["className", 'data-qa', "icon", "isSelected", "text", "renderLink"]);
-    const allClasses = (0, classnames_1.default)('MrlSidebarNavItem', MrlSidebarNavItem_module_scss_1.default['MrlSidebarNavItem'], {
-        [MrlSidebarNavItem_module_scss_1.default['MrlSidebarNavItem-selected']]: isSelected,
-        'MrlSidebarNavItem-selected': isSelected,
-        [MrlSidebarNavItem_module_scss_1.default['hasIcon']]: typeof icon !== 'undefined'
-    }, className);
-    return (React.createElement("li", Object.assign({}, rest, { "data-qa": qa, className: allClasses }), renderLink({
-        linkContent: (React.createElement(React.Fragment, null,
-            icon && (React.createElement(__1.MrlSvg, { "aria-hidden": "true", svg: icon, className: MrlSidebarNavItem_module_scss_1.default['MrlSidebarNavItem-icon'], size: "auto" })),
-            text))
-    })));
-}
-exports.MrlSidebarNavItem = MrlSidebarNavItem;

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavItem/MrlSidebarNavItem.module.css

@@ -1,132 +0,0 @@
-/* stylelint-disable scss/operator-no-newline-after */
-.mrl-u-focus-wrapper--Ta1qj {
-  position: relative;
-}
-
-.MrlSidebarNavItem--c5els {
-  height: var(--mrl-spacing-08);
-  margin-bottom: var(--mrl-spacing-01);
-}
-.MrlSidebarNavItem--c5els > a {
-  align-items: center;
-  border-radius: var(--mrl-border-radius-content-large);
-  color: var(--mrl-color-text-heading);
-  display: inline-flex;
-  height: 100%;
-  outline: none;
-  padding: var(--mrl-spacing-03) var(--mrl-spacing-04);
-  position: relative;
-  text-decoration: none;
-  width: 100%;
-  font-family: var(--mrl-body-font);
-  font-size: var(--mrl-type-size-text-xsmall);
-  font-weight: var(--mrl-type-weight-interactive);
-  letter-spacing: var(--mrl-type-spacing-interactive-xsmall);
-  line-height: var(--mrl-type-line-height-interactive-xsmall);
-}
-.MrlSidebarNavItem--c5els > a:focus-visible::after {
-  animation-duration: var(--mrl-duration-03);
-  animation-fill-mode: forwards;
-  animation-iteration-count: 1;
-  animation-timing-function: var(--mrl-timing-m3);
-  border: 0 solid transparent;
-  border-radius: calc(
-		var(--mrl-border-radius-functional) + var(--mrl-line-width-focus) + var(--mrl-space-offset-focus)
-	);
-  bottom: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
-  content: "";
-  display: block;
-  left: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
-  position: absolute;
-  right: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
-  top: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
-  z-index: 1;
-  animation-name: border-animation--dZKon;
-}
-@keyframes border-animation--dZKon {
-  0% {
-    border-color: transparent;
-    border-width: 0;
-    bottom: var(--mrl-space-offset-focus);
-    left: var(--mrl-space-offset-focus);
-    right: var(--mrl-space-offset-focus);
-    top: var(--mrl-space-offset-focus);
-  }
-  50% {
-    border-color: var(--mrl-color-focus);
-    border-width: 0.25rem;
-    bottom: calc(var(--mrl-spacing-02) * -1);
-    left: calc(var(--mrl-spacing-02) * -1);
-    right: calc(var(--mrl-spacing-02) * -1);
-    top: calc(var(--mrl-spacing-02) * -1);
-  }
-  100% {
-    border-color: var(--mrl-color-focus);
-    border-width: var(--mrl-line-width-focus);
-    bottom: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-    left: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-    right: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-    top: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-  }
-}
-@keyframes border-animation-inverse--aZk9W {
-  0% {
-    border-color: transparent;
-    border-width: 0;
-    bottom: var(--mrl-space-offset-focus);
-    left: var(--mrl-space-offset-focus);
-    right: var(--mrl-space-offset-focus);
-    top: var(--mrl-space-offset-focus);
-  }
-  50% {
-    border-color: var(--mrl-color-focus-inverse);
-    border-width: 0.25rem;
-    bottom: calc(var(--mrl-spacing-02) * -1);
-    left: calc(var(--mrl-spacing-02) * -1);
-    right: calc(var(--mrl-spacing-02) * -1);
-    top: calc(var(--mrl-spacing-02) * -1);
-  }
-  100% {
-    border-color: var(--mrl-color-focus-inverse);
-    border-width: var(--mrl-line-width-focus);
-    bottom: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-    left: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-    right: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-    top: calc((
-						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
-					) * -1);
-  }
-}
-.MrlSidebarNavItem--c5els > a:hover {
-  background-color: rgba(var(--mrl-gray-20), 1);
-}
-.MrlSidebarNavItem--c5els > a:active {
-  background-color: rgba(var(--mrl-gray-30), 1);
-}
-.MrlSidebarNavItem--c5els.hasIcon--Id011 > a {
-  padding: calc(var(--mrl-spacing-01) + var(--mrl-spacing-02)) calc(var(--mrl-spacing-01) + var(--mrl-spacing-03));
-}
-.MrlSidebarNavItem--c5els.MrlSidebarNavItem-selected--vVSo- a, .MrlSidebarNavItem--c5els.MrlSidebarNavItem-selected--vVSo- a:hover {
-  background-color: var(--mrl-color-background-highlight-active);
-  color: var(--mrl-color-text-inverse-active);
-}
-
-.MrlSidebarNavItem-icon--YvDsP {
-  height: var(--mrl-spacing-06);
-  margin-right: calc(var(--mrl-spacing-01) + var(--mrl-spacing-03));
-  width: var(--mrl-spacing-06);
-}

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavItem/MrlSidebarNavItem.module.scss.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-require("./MrlSidebarNavItem.module.css");
-exports.default = {
-	"mrl-u-focus-wrapper": "mrl-u-focus-wrapper--Ta1qj",
-	"MrlSidebarNavItem": "MrlSidebarNavItem--c5els",
-	"border-animation": "border-animation--dZKon",
-	"hasIcon": "hasIcon--Id011",
-	"MrlSidebarNavItem-selected": "MrlSidebarNavItem-selected--vVSo-",
-	"MrlSidebarNavItem-icon": "MrlSidebarNavItem-icon--YvDsP",
-	"border-animation-inverse": "border-animation-inverse--aZk9W"
-};

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavItem/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("./MrlSidebarNavItem"), exports);

package/dist/cjs/components/navigation-sidebar/index.js

@@ -1,18 +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("./MrlSidebarNavGroup"), exports);
-__exportStar(require("./MrlSidebarNavItem"), exports);

package/dist/cjs/components/notification/MrlBlockNotification/MrlBlockNotification.global.css

@@ -1,21 +0,0 @@
-/* stylelint-disable scss/operator-no-newline-after */
-.mrl-u-focus-wrapper {
-  position: relative;
-}
-
-.mrl-blockNotification {
-  border-radius: var(--mrl-blockNotification-radius);
-}
-.mrl-blockNotification.mrl-is--transitioning {
-  opacity: 0;
-}
-.mrl-blockNotification.mrl-is--closed {
-  display: none;
-  padding: 0;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .mrl-blockNotification.mrl-is--transitioning {
-    margin-top: calc(var(--mrl-blockNotification-height) * -1);
-  }
-}

package/dist/cjs/components/notification/MrlBlockNotification/MrlBlockNotification.js

@@ -1,162 +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;
-};
-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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MrlBlockNotification = void 0;
-const React = __importStar(require("react"));
-const ds_icons_1 = require("@muraldevkit/ds-icons");
-const classnames_1 = __importDefault(require("classnames"));
-const utils_1 = require("../../../utils");
-const constants_1 = require("../constants");
-const MrlSvg_1 = require("../../svg/MrlSvg/MrlSvg");
-const MrlIconButton_1 = require("../../button/MrlIconButton/MrlIconButton");
-const MrlTextHeading_1 = require("../../text/MrlTextHeading/MrlTextHeading");
-const MrlBlockNotification_module_scss_1 = __importDefault(require("./MrlBlockNotification.module.scss.js"));
-require("./MrlBlockNotification.global.css");
-const useAutoClose_1 = require("../../../hooks/useAutoClose");
-/**
- * Configuration options for icons
- */
-const iconOptions = {
-    error: ds_icons_1.error,
-    info: ds_icons_1.info,
-    success: ds_icons_1.check,
-    warning: ds_icons_1.warning
-};
-/**
- * Block Notification Component
- * @param props - Component props
- * @returns {Element} Block Notification
- */
-const MrlBlockNotification = (props) => {
-    const { attrs, autoCloseAfterMs, children, className, closeQa, cta, kind = constants_1.defaults.kind, dismissible = constants_1.defaults.dismissible, heading, hookClose, hookOpen, customIcon, level = constants_1.defaults.level, message, onAutoClose, scope = constants_1.defaults.scope, shouldAutoClose = false, state = constants_1.defaults.state } = props, rest = __rest(props, ["attrs", "autoCloseAfterMs", "children", "className", "closeQa", "cta", "kind", "dismissible", "heading", "hookClose", "hookOpen", "customIcon", "level", "message", "onAutoClose", "scope", "shouldAutoClose", "state"]);
-    /**
-     * Sets the open/close state of the notification
-     */
-    const [notificationState, setNotificationState] = React.useState(constants_1.defaults.state);
-    /**
-     * Reference to the notification
-     */
-    const notification = React.useRef(null);
-    /**
-     * Handles logic for opening the notification
-     */
-    const handleOpen = React.useCallback(() => {
-        setNotificationState('open');
-        setTimeout(() => {
-            hookOpen && hookOpen();
-        }, constants_1.TransitionDuration);
-    }, [hookOpen]);
-    /**
-     * It is an accessibility anti-pattern to auto-close an interactive element.
-     * Both the dismiss button and cta are interactive elements.
-     */
-    const isInteractiveElementPresent = dismissible || cta;
-    /**
-     * Controls auto-close behavior of the notification
-     */
-    const [autoClosed] = (0, useAutoClose_1.useAutoClose)(shouldAutoClose && !isInteractiveElementPresent, autoCloseAfterMs, onAutoClose);
-    /**
-     * Handles logic for closing the notification
-     */
-    const handleClose = React.useCallback(() => {
-        setNotificationState('close');
-        setTimeout(() => {
-            var _a;
-            // add class mrl-is--closed
-            (_a = notification.current) === null || _a === void 0 ? void 0 : _a.classList.add('mrl-is--closed');
-            hookClose && hookClose();
-        }, constants_1.TransitionDuration);
-    }, [hookClose]);
-    /**
-     * Toggles the open/closed state based on the state of the component
-     */
-    React.useEffect(() => {
-        if (notificationState === 'open' && autoClosed !== true) {
-            handleOpen();
-        }
-        else {
-            handleClose();
-        }
-    }, [notificationState, handleClose, handleOpen, autoClosed]);
-    /**
-     * Updates the internal state of the component when the state prop changes
-     */
-    React.useEffect(() => {
-        setNotificationState(state || constants_1.defaults.state);
-    }, [state]);
-    /**
-     * Renders a custom icon or a default icon if the kind supports it.
-     * @returns ReactElement | null
-     */
-    const renderIcon = () => {
-        const notificationIcon = typeof customIcon === 'undefined' ? iconOptions[kind] : customIcon;
-        // It could be undefined if the kind doesn't support a default icon.
-        if (!notificationIcon)
-            return null;
-        return (React.createElement("div", { className: (0, classnames_1.default)(MrlBlockNotification_module_scss_1.default['mrl-blockNotification-icon'], 'mrl-blockNotification-icon') },
-            React.createElement(MrlSvg_1.MrlSvg, { size: "small", svg: notificationIcon })));
-    };
-    const attributes = (0, utils_1.setAttributes)(attrs, {
-        'aria-hidden': (state === 'close').toString(),
-        // @todo need to determine if we want errors to always be assertive or
-        // if we want an easier ability to overwrite than the attrs object.
-        'aria-live': kind === 'error' ? 'assertive' : 'polite',
-        role: 'status'
-    });
-    const allClasses = (0, classnames_1.default)(MrlBlockNotification_module_scss_1.default['mrl-blockNotification'], className, 'mrl-blockNotification', {
-        [MrlBlockNotification_module_scss_1.default['mrl-blockNotification--dismissible']]: Boolean(dismissible),
-        'mrl-is--transitioning': notificationState === 'close'
-    });
-    const closeButtonKind = React.useMemo(() => {
-        return kind === 'warning' ? 'ghost' : 'ghost-inverse';
-    }, [kind]);
-    delete attributes.class;
-    delete attributes.className;
-    return (React.createElement("div", Object.assign({}, rest, { className: allClasses }, attributes, { "data-kind": kind, "data-scope": scope, ref: notification }),
-        renderIcon(),
-        React.createElement("div", { className: (0, classnames_1.default)(MrlBlockNotification_module_scss_1.default['mrl-blockNotification-message'], 'mrl-blockNotification-message') },
-            heading && (React.createElement(MrlTextHeading_1.MrlTextHeading, { className: (0, classnames_1.default)(MrlBlockNotification_module_scss_1.default['mrl-blockNotification-heading'], 'mrl-blockNotification-heading'), kind: "title", size: "small", level: level, text: heading })),
-            message && (React.createElement("p", { className: (0, classnames_1.default)(MrlBlockNotification_module_scss_1.default['mrl-blockNotification-text'], 'mrl-blockNotification-text') }, message)),
-            children && React.createElement(React.Fragment, null, children)),
-        cta && React.createElement("div", { className: (0, classnames_1.default)('cta', MrlBlockNotification_module_scss_1.default['cta']) }, cta),
-        dismissible && (React.createElement(MrlIconButton_1.MrlIconButton, { attrs: {
-                'data-qa': closeQa
-            }, icon: React.createElement(MrlSvg_1.MrlSvg, { svg: ds_icons_1.close, size: "small" }), onClick: handleClose, text: "Close", size: "small", kind: closeButtonKind, state: "default", position: "bottom", tipAnchor: "center", wrapperClassName: (0, classnames_1.default)(MrlBlockNotification_module_scss_1.default['mrl-blockNotification-close-wrapper'], 'mrl-blockNotification-close-wrapper') }))));
-};
-exports.MrlBlockNotification = MrlBlockNotification;

package/dist/cjs/components/notification/MrlBlockNotification/MrlBlockNotification.module.css

@@ -1,222 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable scss/operator-no-newline-after */
-.mrl-u-focus-wrapper--CHrqj {
-  position: relative;
-}
-
-:root {
-  --mrl-button-background-color-skeleton: var(--mrl-color-skeleton);
-  --mrl-button-border-radius: var(--mrl-border-radius-functional);
-}
-
-.mrl-u-preHydrateSkeleton--JduHS mrl-button:not(.hydrated--O8dMR),
-.mrl-u-preHydrateSkeleton--JduHS mrl-icon-button:not(.hydrated--O8dMR),
-.mrl-u-preHydrateSkeleton--JduHS mrl-shadow-button:not(.hydrated--O8dMR) {
-  min-height: var(--mrl-spacing-09);
-  min-width: var(--mrl-spacing-09);
-  background: var(--mrl-button-background-color-skeleton);
-  border-radius: var(--mrl-button-border-radius);
-  box-shadow: none;
-  color: transparent;
-  display: inline-flex;
-  font-family: var(--mrl-body-font);
-  pointer-events: none;
-  visibility: inherit;
-}
-.mrl-u-preHydrateSkeleton--JduHS mrl-button[kind=inverse]:not(.hydrated--O8dMR),
-.mrl-u-preHydrateSkeleton--JduHS mrl-button[kind=ghost-inverse]:not(.hydrated--O8dMR),
-.mrl-u-preHydrateSkeleton--JduHS mrl-icon-button[kind=inverse]:not(.hydrated--O8dMR),
-.mrl-u-preHydrateSkeleton--JduHS mrl-icon-button[kind=ghost-inverse]:not(.hydrated--O8dMR),
-.mrl-u-preHydrateSkeleton--JduHS mrl-shadow-button[kind=inverse]:not(.hydrated--O8dMR),
-.mrl-u-preHydrateSkeleton--JduHS mrl-shadow-button[kind=ghost-inverse]:not(.hydrated--O8dMR) {
-  --mrl-button-background-color-skeleton: var(--mrl-color-skeleton-inverse);
-}
-
-mrl-button[size=small],
-mrl-shadow-button[size=small] {
-  min-height: var(--mrl-spacing-08);
-}
-
-mrl-icon-button[size=small] {
-  min-height: var(--mrl-spacing-08);
-  min-width: var(--mrl-spacing-08);
-}
-
-mrl-button[size=large],
-mrl-shadow-button[size=large] {
-  min-height: calc(var(--mrl-spacing-09) + var(--mrl-spacing-02));
-}
-
-mrl-icon-button[size=large] {
-  min-height: calc(var(--mrl-spacing-09) + var(--mrl-spacing-02));
-  min-width: calc(var(--mrl-spacing-09) + var(--mrl-spacing-02));
-}
-
-mrl-icon-button[size=xsmall][kind=ghost],
-mrl-icon-button[size=xsmall][kind=ghost-inverse] {
-  min-height: var(--mrl-spacing-07);
-  min-width: var(--mrl-spacing-07);
-}
-
-.mrl-blockNotification--GuV4C {
-  --mrl-blockNotification-background: var(--mrl-color-background-info);
-  --mrl-blockNotification-background-general: rgba(var(--mrl-gray-100), 1);
-  --mrl-blockNotification-color: rgba(var(--mrl-gray-10), 1);
-  --mrl-blockNotification-heading-color: var(--mrl-color-text-inverse);
-  --mrl-blockNotification-height: var(--mrl-spacing-09);
-  --mrl-blockNotification-inline-spacing: var(--mrl-spacing-03);
-  --mrl-blockNotification-inline-spacing-message: var(--mrl-spacing-02);
-  --mrl-blockNotification-inset-spacing: var(--mrl-spacing-02) var(--mrl-spacing-07);
-  --mrl-blockNotification-radius: 0;
-  --mrl-blockNotification-svg-color: var(--mrl-color-text-inverse);
-}
-
-.mrl-blockNotification--GuV4C[data-kind=info] {
-  --mrl-blockNotification-background: var(--mrl-color-background-info);
-}
-.mrl-blockNotification--GuV4C[data-kind=info][data-scope=inline] {
-  --mrl-blockNotification-background: var(--mrl-color-background-info-light);
-  --mrl-blockNotification-color: var(--mrl-color-text-info);
-  --mrl-blockNotification-svg-color: var(--mrl-color-text-info);
-  --mrl-blockNotification-heading-color: var(--mrl-color-text-info);
-}
-
-.mrl-blockNotification--GuV4C[data-kind=error] {
-  --mrl-blockNotification-background: var(--mrl-color-background-error);
-}
-.mrl-blockNotification--GuV4C[data-kind=error][data-scope=inline] {
-  --mrl-blockNotification-background: var(--mrl-color-background-error-light);
-  --mrl-blockNotification-color: var(--mrl-color-text-error);
-  --mrl-blockNotification-svg-color: var(--mrl-color-text-error);
-  --mrl-blockNotification-heading-color: var(--mrl-color-text-error);
-}
-
-.mrl-blockNotification--GuV4C[data-kind=success] {
-  --mrl-blockNotification-background: var(--mrl-color-background-success);
-}
-.mrl-blockNotification--GuV4C[data-kind=success][data-scope=inline] {
-  --mrl-blockNotification-background: var(--mrl-color-background-success-light);
-  --mrl-blockNotification-color: var(--mrl-color-text-success);
-  --mrl-blockNotification-svg-color: var(--mrl-color-text-success);
-  --mrl-blockNotification-heading-color: var(--mrl-color-text-success);
-}
-
-.mrl-blockNotification--GuV4C[data-kind=warning] {
-  --mrl-blockNotification-background: var(--mrl-color-background-warning);
-  --mrl-blockNotification-color: rgba(var(--mrl-gray-90), 1);
-  --mrl-blockNotification-heading-color: rgba(var(--mrl-black), 1);
-  --mrl-blockNotification-svg-color: rgba(var(--mrl-color-text-warning), 1);
-}
-.mrl-blockNotification--GuV4C[data-kind=warning][data-scope=inline] {
-  --mrl-blockNotification-background: var(--mrl-color-background-warning-light);
-  --mrl-blockNotification-color: var(--mrl-color-text-warning);
-  --mrl-blockNotification-heading-color: var(--mrl-color-text-warning);
-  --mrl-blockNotification-svg-color: rgba(var(--mrl-status-warning), 1);
-}
-
-.mrl-blockNotification--GuV4C[data-kind=general],
-.mrl-blockNotification--GuV4C[data-kind=private] {
-  --mrl-blockNotification-background: var(--mrl-blockNotification-background-general);
-}
-
-.mrl-blockNotification--GuV4C[data-scope=inline] {
-  --mrl-blockNotification-radius: var(--mrl-border-radius-content-large);
-  --mrl-blockNotification-inset-spacing: calc(var(--mrl-spacing-03) + var(--mrl-spacing-01))
-  	var(--mrl-spacing-04);
-  --mrl-blockNotification-cta-spacing: calc(
-  		calc(var(--mrl-spacing-03) - var(--mrl-spacing-01)) * -1
-  	)
-  	calc(var(--mrl-spacing-03) * -1) calc(calc(var(--mrl-spacing-03) - var(--mrl-spacing-01)) * -1)
-  	0;
-}
-
-/**
- * @todo v2 - we should apply a class to the mrl-svg element instead
- * of targeting the element. However, the class should be `mrl-blockNotification-icon`
- * so we would want to rename the existing class to `mrl-blockNotification-iconWrapper`
- * which is a breaking change. Also we could explore if we need this div at all?
- **/
-.mrl-blockNotification-icon--bD-Y1 {
-  display: flex;
-  min-width: fit-content;
-}
-.mrl-blockNotification-icon--bD-Y1 svg {
-  color: var(--mrl-blockNotification-svg-color);
-}
-
-.mrl-blockNotification--GuV4C {
-  margin-top: 0;
-  opacity: 1;
-  transition-duration: var(--mrl-duration-03);
-  transition-property: margin opacity;
-  transition-timing-function: var(--mrl-timing-m1);
-  align-items: center;
-  background: var(--mrl-blockNotification-background);
-  color: var(--mrl-blockNotification-color);
-  display: flex;
-  flex-direction: row;
-  gap: var(--mrl-blockNotification-inline-spacing);
-  justify-content: center;
-  min-height: var(--mrl-blockNotification-height);
-  padding: var(--mrl-blockNotification-inset-spacing);
-  position: relative;
-  width: 100%;
-}
-.mrl-blockNotification--GuV4C .mrl-blockNotification-close-wrapper--SUgir {
-  position: absolute;
-  right: var(--mrl-spacing-02);
-  top: 50%;
-  transform: translateY(-50%);
-}
-.mrl-blockNotification--GuV4C .mrl-blockNotification-close-wrapper--SUgir svg {
-  color: var(--mrl-blockNotification-color);
-}
-.mrl-blockNotification--GuV4C[data-scope=inline] {
-  display: inline-flex;
-  justify-content: start;
-  position: relative;
-  width: 100%;
-}
-.mrl-blockNotification--GuV4C[data-scope=inline] .cta--tfUz9 {
-  margin: var(--mrl-blockNotification-cta-spacing);
-}
-.mrl-blockNotification--GuV4C[data-scope=inline] .mrl-blockNotification-icon--bD-Y1 {
-  align-self: baseline;
-}
-.mrl-blockNotification--GuV4C[data-scope=inline] .mrl-blockNotification-close-wrapper--SUgir {
-  position: absolute;
-  top: 20px;
-}
-
-.mrl-blockNotification--dismissible--YqHi0 {
-  padding-right: calc(
-		var(--mrl-spacing-02) + var(--mrl-blockNotification-inline-spacing) + var(--mrl-spacing-08)
-	);
-  position: relative;
-}
-
-.mrl-blockNotification-message--mYKg9 {
-  align-items: center;
-  max-width: 45rem;
-}
-.mrl-blockNotification-message--mYKg9 h2,
-.mrl-blockNotification-message--mYKg9 p {
-  display: contents;
-}
-.mrl-blockNotification-message--mYKg9 h2::after {
-  content: " ";
-  display: contents;
-}
-.mrl-blockNotification-message--mYKg9 p {
-  font-family: var(--mrl-body-font);
-  font-size: var(--mrl-type-size-text-small);
-  font-weight: var(--mrl-type-weight-text);
-  letter-spacing: var(--mrl-type-spacing-text);
-  line-height: var(--mrl-type-line-height-text-small);
-}
-
-.mrl-blockNotification-heading--U1dYc {
-  color: var(--mrl-blockNotification-heading-color);
-  display: inline;
-  margin-right: var(--mrl-blockNotification-inline-spacing-message);
-}

package/dist/cjs/components/notification/MrlBlockNotification/MrlBlockNotification.module.scss.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-require("./MrlBlockNotification.module.css");
-exports.default = {
-	"mrl-u-focus-wrapper": "mrl-u-focus-wrapper--CHrqj",
-	"mrl-u-preHydrateSkeleton": "mrl-u-preHydrateSkeleton--JduHS",
-	"hydrated": "hydrated--O8dMR",
-	"mrl-blockNotification": "mrl-blockNotification--GuV4C",
-	"mrl-blockNotification-icon": "mrl-blockNotification-icon--bD-Y1",
-	"mrl-blockNotification-close-wrapper": "mrl-blockNotification-close-wrapper--SUgir",
-	"cta": "cta--tfUz9",
-	"mrl-blockNotification--dismissible": "mrl-blockNotification--dismissible--YqHi0",
-	"mrl-blockNotification-message": "mrl-blockNotification-message--mYKg9",
-	"mrl-blockNotification-heading": "mrl-blockNotification-heading--U1dYc"
-};

package/dist/cjs/components/notification/MrlBlockNotification/index.js

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