@muraldevkit/ui-toolkit 4.68.0-dev-NFbt.1 → 4.68.0-dev-nPeA.1

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

@@ -12,7 +12,10 @@ var MrlTextHeading = require('../../text/MrlTextHeading/MrlTextHeading.js');
 var MrlIconButton = require('../../button/MrlIconButton/MrlIconButton.js');
 var MrlSvg = require('../../svg/MrlSvg/MrlSvg.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -29,7 +32,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["attrs", "autoCloseAfterMs", "children", "className", "closeQa", "cta", "kind", "dismissible", "heading", "hookClose", "hookOpen", "customIcon", "level", "message", "onAutoClose", "scope", "shouldAutoClose", "state"];
 /**
@@ -47,7 +51,7 @@ var iconOptions = {
  * @param props - Component props
  * @returns {Element} Block Notification
  */
-var MrlBlockNotification = function MrlBlockNotification(props) {
+var MrlBlockNotification = props => {
   var attrs = props.attrs,
     autoCloseAfterMs = props.autoCloseAfterMs,
     children = props.children,
@@ -90,9 +94,9 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
   /**
    * Handles logic for opening the notification
    */
-  var handleOpen = React__namespace.useCallback(function () {
+  var handleOpen = React__namespace.useCallback(() => {
     setNotificationState('open');
-    setTimeout(function () {
+    setTimeout(() => {
       hookOpen && hookOpen();
     }, constants.TransitionDuration);
   }, [hookOpen]);
@@ -112,9 +116,9 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
   /**
    * Handles logic for closing the notification
    */
-  var handleClose = React__namespace.useCallback(function () {
+  var handleClose = React__namespace.useCallback(() => {
     setNotificationState('close');
-    setTimeout(function () {
+    setTimeout(() => {
       var _notification$current;
       // add class mrl-is--closed
       (_notification$current = notification.current) === null || _notification$current === void 0 ? void 0 : _notification$current.classList.add('mrl-is--closed');
@@ -125,7 +129,7 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
   /**
    * Toggles the open/closed state based on the state of the component
    */
-  React__namespace.useEffect(function () {
+  React__namespace.useEffect(() => {
     if (notificationState === 'open' && autoClosed !== true) {
       handleOpen();
     } else {
@@ -136,7 +140,7 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
   /**
    * Updates the internal state of the component when the state prop changes
    */
-  React__namespace.useEffect(function () {
+  React__namespace.useEffect(() => {
     setNotificationState(state || constants.defaults.state);
   }, [state]);
 
@@ -144,13 +148,13 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
    * Renders a custom icon or a default icon if the kind supports it.
    * @returns ReactElement | null
    */
-  var renderIcon = function renderIcon() {
+  var renderIcon = () => {
     var 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 /*#__PURE__*/React__namespace.createElement("div", {
-      className: classnames(MrlBlockNotification_module.default['mrl-blockNotification-icon'], 'mrl-blockNotification-icon')
+      className: classnames__default.default(MrlBlockNotification_module.default['mrl-blockNotification-icon'], 'mrl-blockNotification-icon')
     }, /*#__PURE__*/React__namespace.createElement(MrlSvg.MrlSvg, {
       size: "small",
       svg: notificationIcon
@@ -163,11 +167,14 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
     'aria-live': kind === 'error' ? 'assertive' : 'polite',
     role: 'status'
   });
-  var allClasses = classnames(MrlBlockNotification_module.default['mrl-blockNotification'], className, 'mrl-blockNotification', _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlBlockNotification_module.default['mrl-blockNotification--dismissible'], Boolean(dismissible)), 'mrl-is--transitioning', notificationState === 'close'));
-  var closeButtonKind = React__namespace.useMemo(function () {
+  var allClasses = classnames__default.default(MrlBlockNotification_module.default['mrl-blockNotification'], className, 'mrl-blockNotification', {
+    [MrlBlockNotification_module.default['mrl-blockNotification--dismissible']]: Boolean(dismissible),
+    'mrl-is--transitioning': notificationState === 'close'
+  });
+  var closeButtonKind = React__namespace.useMemo(() => {
     return kind === 'warning' ? 'ghost' : 'ghost-inverse';
   }, [kind]);
-  delete attributes["class"];
+  delete attributes.class;
   delete attributes.className;
   return /*#__PURE__*/React__namespace.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
     className: allClasses
@@ -176,17 +183,17 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
     "data-scope": scope,
     ref: notification
   }), renderIcon(), /*#__PURE__*/React__namespace.createElement("div", {
-    className: classnames(MrlBlockNotification_module.default['mrl-blockNotification-message'], 'mrl-blockNotification-message')
+    className: classnames__default.default(MrlBlockNotification_module.default['mrl-blockNotification-message'], 'mrl-blockNotification-message')
   }, heading && /*#__PURE__*/React__namespace.createElement(MrlTextHeading.MrlTextHeading, {
-    className: classnames(MrlBlockNotification_module.default['mrl-blockNotification-heading'], 'mrl-blockNotification-heading'),
+    className: classnames__default.default(MrlBlockNotification_module.default['mrl-blockNotification-heading'], 'mrl-blockNotification-heading'),
     kind: "title",
     size: "small",
     level: level,
     text: heading
   }), message && /*#__PURE__*/React__namespace.createElement("p", {
-    className: classnames(MrlBlockNotification_module.default['mrl-blockNotification-text'], 'mrl-blockNotification-text')
+    className: classnames__default.default(MrlBlockNotification_module.default['mrl-blockNotification-text'], 'mrl-blockNotification-text')
   }, message), children && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, children)), cta && /*#__PURE__*/React__namespace.createElement("div", {
-    className: classnames('cta', MrlBlockNotification_module.default['cta'])
+    className: classnames__default.default('cta', MrlBlockNotification_module.default['cta'])
   }, cta), dismissible && /*#__PURE__*/React__namespace.createElement(MrlIconButton.MrlIconButton, {
     attrs: {
       'data-qa': closeQa
@@ -202,7 +209,7 @@ var MrlBlockNotification = function MrlBlockNotification(props) {
     state: "default",
     position: "bottom",
     tipAnchor: "center",
-    wrapperClassName: classnames(MrlBlockNotification_module.default['mrl-blockNotification-close-wrapper'], 'mrl-blockNotification-close-wrapper')
+    wrapperClassName: classnames__default.default(MrlBlockNotification_module.default['mrl-blockNotification-close-wrapper'], 'mrl-blockNotification-close-wrapper')
   }));
 };
 

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

@@ -1 +1 @@
-{"version":3,"file":"MrlBlockNotification.js","sources":["../../../../../src/components/notification/MrlBlockNotification/MrlBlockNotification.tsx"],"sourcesContent":["import * as React from 'react';\nimport { check, close, error, info, warning } from '@muraldevkit/ds-icons';\nimport classNames from 'classnames';\nimport { AttrsObject, setAttributes } from '../../../utils';\nimport {\n\tdefaults,\n\tNotificationKind,\n\tNotificationScope,\n\tNotificationState,\n\tNotificationLevel,\n\tTransitionDuration\n} from '../constants';\nimport { DSIconType, MrlIconButton, MrlSvg, MrlTextHeading } from '../..';\n\nimport styles from './MrlBlockNotification.module.scss';\nimport './MrlBlockNotification.global.scss';\nimport { useAutoClose } from '../../../hooks/useAutoClose';\n\nexport interface MrlBlockNotificationProps {\n\t/**\n\t * Block Notification Wrapper Class\n\t */\n\tclassName?: string;\n\n\t/**\n\t * QA attribute for close button to allow tests to find the element easier\n\t */\n\tcloseQa?: string;\n\n\t/**\n\t * Children\n\t *\n\t * IMPORTANT! — Make sure to set shouldAutoClose: false if children of this component\n\t * contain interactive elements. Autoclosing interactive elements is an accessibility\n\t * anti-pattern and should be avoided.\n\t */\n\tchildren?: React.ReactNode;\n\n\t/**\n\t * Adds CTA button to the notification\n\t */\n\tcta?: React.ReactElement;\n\n\t/**\n\t * The kind of notification to display.\n\t *\n\t * Examples: warning, error, info, success\n\t */\n\tkind?: NotificationKind;\n\n\t/**\n\t * A custom DS icon.\n\t */\n\tcustomIcon?: DSIconType;\n\n\t/**\n\t * Sets header text for notification\n\t */\n\theading?: string;\n\n\t/**\n\t * Adds a close button to notificaiton if true\n\t */\n\tdismissible?: boolean;\n\n\t/**\n\t * Sets the primary content for the notification\n\t */\n\tmessage?: React.ReactNode;\n\n\t/**\n\t * Sets the scope of the notification\n\t */\n\tscope?: NotificationScope;\n\n\t/**\n\t * Open/Close state of the notification\n\t */\n\tstate?: NotificationState;\n\n\t/**\n\t * Open notification callback\n\t * @returns {void}\n\t */\n\thookOpen?: () => void;\n\n\t/**\n\t * Close notification callback\n\t * @returns {void}\n\t */\n\thookClose?: () => void;\n\n\t/**\n\t * Sets the header level\n\t * Example output: h1, h2, h3, h4\n\t */\n\tlevel?: NotificationLevel;\n\n\t/**\n\t * Attributes that are applied to the component during the initial render.\n\t *\n\t * Example usage: html attributes, custom data attributes (data-qa), aria\n\t */\n\tattrs?: AttrsObject;\n\n\t/**\n\t * When false prevents automated close (e.g. can be used to prevent auto-dismissal of interactive elements, an accessibility anti-pattern) (see useAutoClose)\n\t */\n\tshouldAutoClose?: Parameters<useAutoClose>[0];\n\n\t/**\n\t * Delay in milliseconds before the component closes (see useAutoClose)\n\t */\n\tautoCloseAfterMs?: Parameters<useAutoClose>[1];\n\n\t/**\n\t * Callback to be called when component closes (see useAutoClose)\n\t */\n\tonAutoClose?: Parameters<useAutoClose>[2];\n}\n\n/**\n * Configuration options for icons\n */\nconst iconOptions: Record<string, DSIconType> = {\n\terror,\n\tinfo,\n\tsuccess: check,\n\twarning\n};\n\n/**\n * Block Notification Component\n * @param props - Component props\n * @returns {Element} Block Notification\n */\nexport const MrlBlockNotification = (props: MrlBlockNotificationProps): JSX.Element => {\n\tconst {\n\t\tattrs,\n\t\tautoCloseAfterMs,\n\t\tchildren,\n\t\tclassName,\n\t\tcloseQa,\n\t\tcta,\n\t\tkind = defaults.kind,\n\t\tdismissible = defaults.dismissible,\n\t\theading,\n\t\thookClose,\n\t\thookOpen,\n\t\tcustomIcon,\n\t\tlevel = defaults.level,\n\t\tmessage,\n\t\tonAutoClose,\n\t\tscope = defaults.scope,\n\t\tshouldAutoClose = false,\n\t\tstate = defaults.state,\n\t\t...rest\n\t} = props;\n\n\t/**\n\t * Sets the open/close state of the notification\n\t */\n\tconst [notificationState, setNotificationState] = React.useState<NotificationState>(\n\t\tdefaults.state\n\t);\n\n\t/**\n\t * Reference to the notification\n\t */\n\tconst notification = React.useRef<HTMLDivElement>(null);\n\n\t/**\n\t * Handles logic for opening the notification\n\t */\n\tconst handleOpen = React.useCallback(() => {\n\t\tsetNotificationState('open');\n\n\t\tsetTimeout(() => {\n\t\t\thookOpen && hookOpen();\n\t\t}, TransitionDuration);\n\t}, [hookOpen]);\n\n\t/**\n\t * It is an accessibility anti-pattern to auto-close an interactive element.\n\t * Both the dismiss button and cta are interactive elements.\n\t */\n\tconst isInteractiveElementPresent = dismissible || cta;\n\t/**\n\t * Controls auto-close behavior of the notification\n\t */\n\tconst [autoClosed] = useAutoClose(\n\t\tshouldAutoClose && !isInteractiveElementPresent,\n\t\tautoCloseAfterMs,\n\t\tonAutoClose\n\t);\n\n\t/**\n\t * Handles logic for closing the notification\n\t */\n\tconst handleClose = React.useCallback(() => {\n\t\tsetNotificationState('close');\n\n\t\tsetTimeout(() => {\n\t\t\t// add class mrl-is--closed\n\t\t\tnotification.current?.classList.add('mrl-is--closed');\n\t\t\thookClose && hookClose();\n\t\t}, TransitionDuration);\n\t}, [hookClose]);\n\n\t/**\n\t * Toggles the open/closed state based on the state of the component\n\t */\n\tReact.useEffect(() => {\n\t\tif (notificationState === 'open' && autoClosed !== true) {\n\t\t\thandleOpen();\n\t\t} else {\n\t\t\thandleClose();\n\t\t}\n\t}, [notificationState, handleClose, handleOpen, autoClosed]);\n\n\t/**\n\t * Updates the internal state of the component when the state prop changes\n\t */\n\tReact.useEffect(() => {\n\t\tsetNotificationState(state || defaults.state);\n\t}, [state]);\n\n\t/**\n\t * Renders a custom icon or a default icon if the kind supports it.\n\t * @returns ReactElement | null\n\t */\n\tconst renderIcon = (): React.ReactElement | null => {\n\t\tconst notificationIcon = typeof customIcon === 'undefined' ? iconOptions[kind] : customIcon;\n\n\t\t// It could be undefined if the kind doesn't support a default icon.\n\t\tif (!notificationIcon) return null;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={classNames(styles['mrl-blockNotification-icon'], 'mrl-blockNotification-icon')}\n\t\t\t>\n\t\t\t\t<MrlSvg size=\"small\" svg={notificationIcon} />\n\t\t\t</div>\n\t\t);\n\t};\n\n\tconst attributes = setAttributes(attrs, {\n\t\t'aria-hidden': (state === 'close').toString(),\n\n\t\t// @todo need to determine if we want errors to always be assertive or\n\t\t// if we want an easier ability to overwrite than the attrs object.\n\t\t'aria-live': kind === 'error' ? 'assertive' : 'polite',\n\t\trole: 'status'\n\t});\n\n\tconst allClasses = classNames(\n\t\tstyles['mrl-blockNotification'],\n\t\tclassName,\n\t\t'mrl-blockNotification',\n\t\t{\n\t\t\t[styles['mrl-blockNotification--dismissible']]: Boolean(dismissible),\n\t\t\t'mrl-is--transitioning': notificationState === 'close'\n\t\t}\n\t);\n\n\tconst closeButtonKind = React.useMemo(() => {\n\t\treturn kind === 'warning' ? 'ghost' : 'ghost-inverse';\n\t}, [kind]);\n\n\tdelete attributes.class;\n\tdelete attributes.className;\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tclassName={allClasses}\n\t\t\t{...attributes}\n\t\t\tdata-kind={kind}\n\t\t\tdata-scope={scope}\n\t\t\tref={notification}\n\t\t>\n\t\t\t{renderIcon()}\n\t\t\t<div\n\t\t\t\tclassName={classNames(\n\t\t\t\t\tstyles['mrl-blockNotification-message'],\n\t\t\t\t\t'mrl-blockNotification-message'\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{/* // to do, add configurable header based on level, when MrlText is completed */}\n\t\t\t\t{heading && (\n\t\t\t\t\t<MrlTextHeading\n\t\t\t\t\t\tclassName={classNames(\n\t\t\t\t\t\t\tstyles['mrl-blockNotification-heading'],\n\t\t\t\t\t\t\t'mrl-blockNotification-heading'\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tkind=\"title\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tlevel={level}\n\t\t\t\t\t\ttext={heading}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{message && (\n\t\t\t\t\t<p\n\t\t\t\t\t\tclassName={classNames(\n\t\t\t\t\t\t\tstyles['mrl-blockNotification-text'],\n\t\t\t\t\t\t\t'mrl-blockNotification-text'\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{message}\n\t\t\t\t\t</p>\n\t\t\t\t)}\n\t\t\t\t{children && <>{children}</>}\n\t\t\t</div>\n\t\t\t{cta && <div className={classNames('cta', styles['cta'])}>{cta}</div>}\n\t\t\t{dismissible && (\n\t\t\t\t<MrlIconButton\n\t\t\t\t\tattrs={{\n\t\t\t\t\t\t'data-qa': closeQa\n\t\t\t\t\t}}\n\t\t\t\t\ticon={<MrlSvg svg={close} size=\"small\" />}\n\t\t\t\t\tonClick={handleClose}\n\t\t\t\t\ttext=\"Close\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tkind={closeButtonKind}\n\t\t\t\t\tstate=\"default\"\n\t\t\t\t\tposition=\"bottom\"\n\t\t\t\t\ttipAnchor=\"center\"\n\t\t\t\t\twrapperClassName={classNames(\n\t\t\t\t\t\tstyles['mrl-blockNotification-close-wrapper'],\n\t\t\t\t\t\t'mrl-blockNotification-close-wrapper'\n\t\t\t\t\t)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["iconOptions","error","info","success","check","warning","MrlBlockNotification","props","attrs","autoCloseAfterMs","children","className","closeQa","cta","_props$kind","kind","defaults","_props$dismissible","dismissible","heading","hookClose","hookOpen","customIcon","_props$level","level","message","onAutoClose","_props$scope","scope","_props$shouldAutoClos","shouldAutoClose","_props$state","state","rest","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","notificationState","setNotificationState","notification","useRef","handleOpen","useCallback","setTimeout","TransitionDuration","isInteractiveElementPresent","_useAutoClose","useAutoClose","_useAutoClose2","autoClosed","handleClose","_notification$current","current","classList","add","useEffect","renderIcon","notificationIcon","createElement","classNames","styles","MrlSvg","size","svg","attributes","setAttributes","toString","role","allClasses","_defineProperty","Boolean","closeButtonKind","useMemo","_extends","ref","MrlTextHeading","text","Fragment","MrlIconButton","icon","close","onClick","position","tipAnchor","wrapperClassName"],"mappings":"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"}
+{"version":3,"file":"MrlBlockNotification.js","sources":["../../../../../src/components/notification/MrlBlockNotification/MrlBlockNotification.tsx"],"sourcesContent":["import * as React from 'react';\nimport { check, close, error, info, warning } from '@muraldevkit/ds-icons';\nimport classNames from 'classnames';\nimport { AttrsObject, setAttributes } from '../../../utils';\nimport {\n\tdefaults,\n\tNotificationKind,\n\tNotificationScope,\n\tNotificationState,\n\tNotificationLevel,\n\tTransitionDuration\n} from '../constants';\nimport { DSIconType, MrlIconButton, MrlSvg, MrlTextHeading } from '../..';\n\nimport styles from './MrlBlockNotification.module.scss';\nimport './MrlBlockNotification.global.scss';\nimport { useAutoClose } from '../../../hooks/useAutoClose';\n\nexport interface MrlBlockNotificationProps {\n\t/**\n\t * Block Notification Wrapper Class\n\t */\n\tclassName?: string;\n\n\t/**\n\t * QA attribute for close button to allow tests to find the element easier\n\t */\n\tcloseQa?: string;\n\n\t/**\n\t * Children\n\t *\n\t * IMPORTANT! — Make sure to set shouldAutoClose: false if children of this component\n\t * contain interactive elements. Autoclosing interactive elements is an accessibility\n\t * anti-pattern and should be avoided.\n\t */\n\tchildren?: React.ReactNode;\n\n\t/**\n\t * Adds CTA button to the notification\n\t */\n\tcta?: React.ReactElement;\n\n\t/**\n\t * The kind of notification to display.\n\t *\n\t * Examples: warning, error, info, success\n\t */\n\tkind?: NotificationKind;\n\n\t/**\n\t * A custom DS icon.\n\t */\n\tcustomIcon?: DSIconType;\n\n\t/**\n\t * Sets header text for notification\n\t */\n\theading?: string;\n\n\t/**\n\t * Adds a close button to notificaiton if true\n\t */\n\tdismissible?: boolean;\n\n\t/**\n\t * Sets the primary content for the notification\n\t */\n\tmessage?: React.ReactNode;\n\n\t/**\n\t * Sets the scope of the notification\n\t */\n\tscope?: NotificationScope;\n\n\t/**\n\t * Open/Close state of the notification\n\t */\n\tstate?: NotificationState;\n\n\t/**\n\t * Open notification callback\n\t * @returns {void}\n\t */\n\thookOpen?: () => void;\n\n\t/**\n\t * Close notification callback\n\t * @returns {void}\n\t */\n\thookClose?: () => void;\n\n\t/**\n\t * Sets the header level\n\t * Example output: h1, h2, h3, h4\n\t */\n\tlevel?: NotificationLevel;\n\n\t/**\n\t * Attributes that are applied to the component during the initial render.\n\t *\n\t * Example usage: html attributes, custom data attributes (data-qa), aria\n\t */\n\tattrs?: AttrsObject;\n\n\t/**\n\t * When false prevents automated close (e.g. can be used to prevent auto-dismissal of interactive elements, an accessibility anti-pattern) (see useAutoClose)\n\t */\n\tshouldAutoClose?: Parameters<useAutoClose>[0];\n\n\t/**\n\t * Delay in milliseconds before the component closes (see useAutoClose)\n\t */\n\tautoCloseAfterMs?: Parameters<useAutoClose>[1];\n\n\t/**\n\t * Callback to be called when component closes (see useAutoClose)\n\t */\n\tonAutoClose?: Parameters<useAutoClose>[2];\n}\n\n/**\n * Configuration options for icons\n */\nconst iconOptions: Record<string, DSIconType> = {\n\terror,\n\tinfo,\n\tsuccess: check,\n\twarning\n};\n\n/**\n * Block Notification Component\n * @param props - Component props\n * @returns {Element} Block Notification\n */\nexport const MrlBlockNotification = (props: MrlBlockNotificationProps): JSX.Element => {\n\tconst {\n\t\tattrs,\n\t\tautoCloseAfterMs,\n\t\tchildren,\n\t\tclassName,\n\t\tcloseQa,\n\t\tcta,\n\t\tkind = defaults.kind,\n\t\tdismissible = defaults.dismissible,\n\t\theading,\n\t\thookClose,\n\t\thookOpen,\n\t\tcustomIcon,\n\t\tlevel = defaults.level,\n\t\tmessage,\n\t\tonAutoClose,\n\t\tscope = defaults.scope,\n\t\tshouldAutoClose = false,\n\t\tstate = defaults.state,\n\t\t...rest\n\t} = props;\n\n\t/**\n\t * Sets the open/close state of the notification\n\t */\n\tconst [notificationState, setNotificationState] = React.useState<NotificationState>(\n\t\tdefaults.state\n\t);\n\n\t/**\n\t * Reference to the notification\n\t */\n\tconst notification = React.useRef<HTMLDivElement>(null);\n\n\t/**\n\t * Handles logic for opening the notification\n\t */\n\tconst handleOpen = React.useCallback(() => {\n\t\tsetNotificationState('open');\n\n\t\tsetTimeout(() => {\n\t\t\thookOpen && hookOpen();\n\t\t}, TransitionDuration);\n\t}, [hookOpen]);\n\n\t/**\n\t * It is an accessibility anti-pattern to auto-close an interactive element.\n\t * Both the dismiss button and cta are interactive elements.\n\t */\n\tconst isInteractiveElementPresent = dismissible || cta;\n\t/**\n\t * Controls auto-close behavior of the notification\n\t */\n\tconst [autoClosed] = useAutoClose(\n\t\tshouldAutoClose && !isInteractiveElementPresent,\n\t\tautoCloseAfterMs,\n\t\tonAutoClose\n\t);\n\n\t/**\n\t * Handles logic for closing the notification\n\t */\n\tconst handleClose = React.useCallback(() => {\n\t\tsetNotificationState('close');\n\n\t\tsetTimeout(() => {\n\t\t\t// add class mrl-is--closed\n\t\t\tnotification.current?.classList.add('mrl-is--closed');\n\t\t\thookClose && hookClose();\n\t\t}, TransitionDuration);\n\t}, [hookClose]);\n\n\t/**\n\t * Toggles the open/closed state based on the state of the component\n\t */\n\tReact.useEffect(() => {\n\t\tif (notificationState === 'open' && autoClosed !== true) {\n\t\t\thandleOpen();\n\t\t} else {\n\t\t\thandleClose();\n\t\t}\n\t}, [notificationState, handleClose, handleOpen, autoClosed]);\n\n\t/**\n\t * Updates the internal state of the component when the state prop changes\n\t */\n\tReact.useEffect(() => {\n\t\tsetNotificationState(state || defaults.state);\n\t}, [state]);\n\n\t/**\n\t * Renders a custom icon or a default icon if the kind supports it.\n\t * @returns ReactElement | null\n\t */\n\tconst renderIcon = (): React.ReactElement | null => {\n\t\tconst notificationIcon = typeof customIcon === 'undefined' ? iconOptions[kind] : customIcon;\n\n\t\t// It could be undefined if the kind doesn't support a default icon.\n\t\tif (!notificationIcon) return null;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={classNames(styles['mrl-blockNotification-icon'], 'mrl-blockNotification-icon')}\n\t\t\t>\n\t\t\t\t<MrlSvg size=\"small\" svg={notificationIcon} />\n\t\t\t</div>\n\t\t);\n\t};\n\n\tconst attributes = setAttributes(attrs, {\n\t\t'aria-hidden': (state === 'close').toString(),\n\n\t\t// @todo need to determine if we want errors to always be assertive or\n\t\t// if we want an easier ability to overwrite than the attrs object.\n\t\t'aria-live': kind === 'error' ? 'assertive' : 'polite',\n\t\trole: 'status'\n\t});\n\n\tconst allClasses = classNames(\n\t\tstyles['mrl-blockNotification'],\n\t\tclassName,\n\t\t'mrl-blockNotification',\n\t\t{\n\t\t\t[styles['mrl-blockNotification--dismissible']]: Boolean(dismissible),\n\t\t\t'mrl-is--transitioning': notificationState === 'close'\n\t\t}\n\t);\n\n\tconst closeButtonKind = React.useMemo(() => {\n\t\treturn kind === 'warning' ? 'ghost' : 'ghost-inverse';\n\t}, [kind]);\n\n\tdelete attributes.class;\n\tdelete attributes.className;\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tclassName={allClasses}\n\t\t\t{...attributes}\n\t\t\tdata-kind={kind}\n\t\t\tdata-scope={scope}\n\t\t\tref={notification}\n\t\t>\n\t\t\t{renderIcon()}\n\t\t\t<div\n\t\t\t\tclassName={classNames(\n\t\t\t\t\tstyles['mrl-blockNotification-message'],\n\t\t\t\t\t'mrl-blockNotification-message'\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{/* // to do, add configurable header based on level, when MrlText is completed */}\n\t\t\t\t{heading && (\n\t\t\t\t\t<MrlTextHeading\n\t\t\t\t\t\tclassName={classNames(\n\t\t\t\t\t\t\tstyles['mrl-blockNotification-heading'],\n\t\t\t\t\t\t\t'mrl-blockNotification-heading'\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tkind=\"title\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tlevel={level}\n\t\t\t\t\t\ttext={heading}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{message && (\n\t\t\t\t\t<p\n\t\t\t\t\t\tclassName={classNames(\n\t\t\t\t\t\t\tstyles['mrl-blockNotification-text'],\n\t\t\t\t\t\t\t'mrl-blockNotification-text'\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{message}\n\t\t\t\t\t</p>\n\t\t\t\t)}\n\t\t\t\t{children && <>{children}</>}\n\t\t\t</div>\n\t\t\t{cta && <div className={classNames('cta', styles['cta'])}>{cta}</div>}\n\t\t\t{dismissible && (\n\t\t\t\t<MrlIconButton\n\t\t\t\t\tattrs={{\n\t\t\t\t\t\t'data-qa': closeQa\n\t\t\t\t\t}}\n\t\t\t\t\ticon={<MrlSvg svg={close} size=\"small\" />}\n\t\t\t\t\tonClick={handleClose}\n\t\t\t\t\ttext=\"Close\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tkind={closeButtonKind}\n\t\t\t\t\tstate=\"default\"\n\t\t\t\t\tposition=\"bottom\"\n\t\t\t\t\ttipAnchor=\"center\"\n\t\t\t\t\twrapperClassName={classNames(\n\t\t\t\t\t\tstyles['mrl-blockNotification-close-wrapper'],\n\t\t\t\t\t\t'mrl-blockNotification-close-wrapper'\n\t\t\t\t\t)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["iconOptions","error","info","success","check","warning","MrlBlockNotification","props","attrs","autoCloseAfterMs","children","className","closeQa","cta","_props$kind","kind","defaults","_props$dismissible","dismissible","heading","hookClose","hookOpen","customIcon","_props$level","level","message","onAutoClose","_props$scope","scope","_props$shouldAutoClos","shouldAutoClose","_props$state","state","rest","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","notificationState","setNotificationState","notification","useRef","handleOpen","useCallback","setTimeout","TransitionDuration","isInteractiveElementPresent","_useAutoClose","useAutoClose","_useAutoClose2","autoClosed","handleClose","_notification$current","current","classList","add","useEffect","renderIcon","notificationIcon","createElement","classNames","styles","MrlSvg","size","svg","attributes","setAttributes","toString","role","allClasses","Boolean","closeButtonKind","useMemo","class","_extends","ref","MrlTextHeading","text","Fragment","MrlIconButton","icon","close","onClick","position","tipAnchor","wrapperClassName"],"mappings":"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"}

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

@@ -7,7 +7,10 @@ var classnames = require('classnames');
 var MrlInlineMessage_module = require('./MrlInlineMessage.module.scss.js');
 var MrlSvg = require('../../svg/MrlSvg/MrlSvg.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -24,10 +27,11 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["children", "customIcon", "id", "kind", "message", "data-qa"];
-var getIcon = function getIcon(kind, customIcon) {
+var getIcon = (kind, customIcon) => {
   switch (kind) {
     case 'error':
       return dsIcons.error;
@@ -41,7 +45,7 @@ var getIcon = function getIcon(kind, customIcon) {
       return customIcon ? customIcon : undefined;
   }
 };
-var renderIcon = function renderIcon(icon, iconClasses) {
+var renderIcon = (icon, iconClasses) => {
   if (icon) {
     return /*#__PURE__*/React__namespace.createElement("span", {
       className: iconClasses
@@ -57,7 +61,7 @@ var renderIcon = function renderIcon(icon, iconClasses) {
  * @param props - The properties of the component.
  * @returns A React component.
  */
-var MrlInlineMessage = function MrlInlineMessage(_ref) {
+var MrlInlineMessage = _ref => {
   var children = _ref.children,
     customIcon = _ref.customIcon,
     id = _ref.id,
@@ -67,8 +71,14 @@ var MrlInlineMessage = function MrlInlineMessage(_ref) {
     qa = _ref$dataQa === void 0 ? 'mrl-inline-notification' : _ref$dataQa,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var icon = getIcon(kind, customIcon);
-  var iconClasses = classnames(MrlInlineMessage_module.default['MrlInlineMessage-icon']);
-  var notificationClasses = classnames(MrlInlineMessage_module.default['MrlInlineMessage'], 'MrlInlineMessage', _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlInlineMessage_module.default.error, kind === 'error'), MrlInlineMessage_module.default.information, kind === 'info'), MrlInlineMessage_module.default.success, kind === 'success'), MrlInlineMessage_module.default.warning, kind === 'warning'), MrlInlineMessage_module.default.helper, kind === 'helper'));
+  var iconClasses = classnames__default.default(MrlInlineMessage_module.default['MrlInlineMessage-icon']);
+  var notificationClasses = classnames__default.default(MrlInlineMessage_module.default['MrlInlineMessage'], 'MrlInlineMessage', {
+    [MrlInlineMessage_module.default.error]: kind === 'error',
+    [MrlInlineMessage_module.default.information]: kind === 'info',
+    [MrlInlineMessage_module.default.success]: kind === 'success',
+    [MrlInlineMessage_module.default.warning]: kind === 'warning',
+    [MrlInlineMessage_module.default.helper]: kind === 'helper'
+  });
   return /*#__PURE__*/React__namespace.createElement("span", _rollupPluginBabelHelpers.extends({}, rest, {
     className: notificationClasses,
     "data-qa": qa,

package/dist/cjs/components/notification/MrlInlineMessage/MrlInlineMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlInlineMessage.js","sources":["../../../../../src/components/notification/MrlInlineMessage/MrlInlineMessage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { error, info, warning, check } from '@muraldevkit/ds-icons';\nimport { DSIconType, MrlSvg } from '../../svg';\nimport classNames from 'classnames';\nimport styles from './MrlInlineMessage.module.scss';\n\nexport type InlineMessageKind = 'error' | 'info' | 'warning' | 'success' | 'helper';\n\nexport interface MrlInlineMessageProps {\n\t/**\n\t * A custom DS icon which is only applied if the alert is not an error, info, or warning type\n\t */\n\tcustomIcon?: DSIconType;\n\n\t/**\n\t * The id of the notification.\n\t *\n\t * Used to link the notification to a form field using aria-describedby.\n\t */\n\tid: string;\n\n\t/**\n\t * Choose the kind of notification to display.\n\t *\n\t * Accepted values: error, info, warning, success, helper\n\t */\n\tkind: InlineMessageKind;\n\n\t/**\n\t * The text to be displayed in the notification. If not provided, children will be used.\n\t */\n\tmessage?: string;\n\n\t/**\n\t * Children to be rendered within the component, it will be used as the message if message is not provided.\n\t */\n\tchildren?: React.ReactNode;\n\n\t/**\n\t * The data-qa attribute for testing purposes.\n\t */\n\t['data-qa']?: string;\n}\n\nconst getIcon = (kind: InlineMessageKind, customIcon?: DSIconType): DSIconType | undefined => {\n\tswitch (kind) {\n\t\tcase 'error':\n\t\t\treturn error;\n\t\tcase 'info':\n\t\t\treturn info;\n\t\tcase 'warning':\n\t\t\treturn warning;\n\t\tcase 'success':\n\t\t\treturn check;\n\t\tdefault:\n\t\t\treturn customIcon ? customIcon : undefined;\n\t}\n};\n\nconst renderIcon = (\n\ticon: DSIconType | undefined,\n\ticonClasses: string\n): React.ReactElement | undefined => {\n\tif (icon) {\n\t\treturn (\n\t\t\t<span className={iconClasses}>\n\t\t\t\t<MrlSvg size=\"auto\" svg={icon} />\n\t\t\t</span>\n\t\t);\n\t}\n};\n\n/**\n * MrlInlineMessage is a notification component that can be used to display messages to the user.\n * @param props - The properties of the component.\n * @returns A React component.\n */\nexport const MrlInlineMessage = ({\n\tchildren,\n\tcustomIcon,\n\tid,\n\tkind,\n\tmessage,\n\t['data-qa']: qa = 'mrl-inline-notification',\n\t...rest\n}: MrlInlineMessageProps): React.ReactElement => {\n\tconst icon = getIcon(kind, customIcon);\n\tconst iconClasses = classNames(styles['MrlInlineMessage-icon']);\n\n\tconst notificationClasses = classNames(styles['MrlInlineMessage'], 'MrlInlineMessage', {\n\t\t[styles.error]: kind === 'error',\n\t\t[styles.information]: kind === 'info',\n\t\t[styles.success]: kind === 'success',\n\t\t[styles.warning]: kind === 'warning',\n\t\t[styles.helper]: kind === 'helper'\n\t});\n\n\treturn (\n\t\t<span {...rest} className={notificationClasses} data-qa={qa} id={id}>\n\t\t\t{renderIcon(icon, iconClasses)}\n\t\t\t<span className=\"MrlInlineMessage-message\">\n\t\t\t\t{typeof message !== 'undefined' ? message : children}\n\t\t\t</span>\n\t\t</span>\n\t);\n};\n"],"names":["getIcon","kind","customIcon","error","info","warning","check","undefined","renderIcon","icon","iconClasses","React","createElement","className","MrlSvg","size","svg","MrlInlineMessage","_ref","children","id","message","_ref$dataQa","qa","rest","_objectWithoutProperties","_excluded","classNames","styles","notificationClasses","_defineProperty","information","success","helper","_extends"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,IAAMA,OAAO,GAAG,SAAVA,OAAOA,CAAIC,IAAuB,EAAEC,UAAuB,EAA6B;AAC7F,EAAA,QAAQD,IAAI;AACX,IAAA,KAAK,OAAO;AACX,MAAA,OAAOE,aAAK;AACb,IAAA,KAAK,MAAM;AACV,MAAA,OAAOC,YAAI;AACZ,IAAA,KAAK,SAAS;AACb,MAAA,OAAOC,eAAO;AACf,IAAA,KAAK,SAAS;AACb,MAAA,OAAOC,aAAK;AACb,IAAA;AACC,MAAA,OAAOJ,UAAU,GAAGA,UAAU,GAAGK,SAAS;AAC5C;AACD,CAAC;AAED,IAAMC,UAAU,GAAG,SAAbA,UAAUA,CACfC,IAA4B,EAC5BC,WAAmB,EACiB;AACpC,EAAA,IAAID,IAAI,EAAE;IACT,oBACCE,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,MAAAA,SAAS,EAAEH;AAAY,KAAA,eAC5BC,gBAAA,CAAAC,aAAA,CAACE,aAAM,EAAA;AAACC,MAAAA,IAAI,EAAC,MAAM;AAACC,MAAAA,GAAG,EAAEP;AAAK,KAAE,CAC3B,CAAC;AAET,EAAA;AACD,CAAC;;AAED;AACA;AACA;AACA;AACA;IACaQ,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,EAQoB;AAAA,EAAA,IAPhDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRjB,UAAU,GAAAgB,IAAA,CAAVhB,UAAU;IACVkB,EAAE,GAAAF,IAAA,CAAFE,EAAE;IACFnB,IAAI,GAAAiB,IAAA,CAAJjB,IAAI;IACJoB,OAAO,GAAAH,IAAA,CAAPG,OAAO;IAAAC,WAAA,GAAAJ,IAAA,CACN,SAAS,CAAA;AAAGK,IAAAA,EAAE,GAAAD,WAAA,KAAA,MAAA,GAAG,yBAAyB,GAAAA,WAAA;AACxCE,IAAAA,IAAI,GAAAC,iDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;AAEP,EAAA,IAAMjB,IAAI,GAAGT,OAAO,CAACC,IAAI,EAAEC,UAAU,CAAC;EACtC,IAAMQ,WAAW,GAAGiB,UAAU,CAACC,+BAAM,CAAC,uBAAuB,CAAC,CAAC;AAE/D,EAAA,IAAMC,mBAAmB,GAAGF,UAAU,CAACC,+BAAM,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,EAAAE,wCAAA,CAAAA,wCAAA,CAAAA,wCAAA,CAAAA,wCAAA,CAAAA,wCAAA,CAAA,EAAA,EACnFF,+BAAM,CAACzB,KAAK,EAAGF,IAAI,KAAK,OAAO,CAAA,EAC/B2B,+BAAM,CAACG,WAAW,EAAG9B,IAAI,KAAK,MAAM,CAAA,EACpC2B,+BAAM,CAACI,OAAO,EAAG/B,IAAI,KAAK,SAAS,CAAA,EACnC2B,+BAAM,CAACvB,OAAO,EAAGJ,IAAI,KAAK,SAAS,CAAA,EACnC2B,+BAAM,CAACK,MAAM,EAAGhC,IAAI,KAAK,QAAQ,CAClC,CAAC;AAEF,EAAA,oBACCU,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAAsB,iCAAA,KAAUV,IAAI,EAAA;AAAEX,IAAAA,SAAS,EAAEgB,mBAAoB;AAAC,IAAA,SAAA,EAASN,EAAG;AAACH,IAAAA,EAAE,EAAEA;GAAG,CAAA,EAClEZ,UAAU,CAACC,IAAI,EAAEC,WAAW,CAAC,eAC9BC,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC;GAA0B,EACxC,OAAOQ,OAAO,KAAK,WAAW,GAAGA,OAAO,GAAGF,QACvC,CACD,CAAC;AAET;;;;"}
+{"version":3,"file":"MrlInlineMessage.js","sources":["../../../../../src/components/notification/MrlInlineMessage/MrlInlineMessage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { error, info, warning, check } from '@muraldevkit/ds-icons';\nimport { DSIconType, MrlSvg } from '../../svg';\nimport classNames from 'classnames';\nimport styles from './MrlInlineMessage.module.scss';\n\nexport type InlineMessageKind = 'error' | 'info' | 'warning' | 'success' | 'helper';\n\nexport interface MrlInlineMessageProps {\n\t/**\n\t * A custom DS icon which is only applied if the alert is not an error, info, or warning type\n\t */\n\tcustomIcon?: DSIconType;\n\n\t/**\n\t * The id of the notification.\n\t *\n\t * Used to link the notification to a form field using aria-describedby.\n\t */\n\tid: string;\n\n\t/**\n\t * Choose the kind of notification to display.\n\t *\n\t * Accepted values: error, info, warning, success, helper\n\t */\n\tkind: InlineMessageKind;\n\n\t/**\n\t * The text to be displayed in the notification. If not provided, children will be used.\n\t */\n\tmessage?: string;\n\n\t/**\n\t * Children to be rendered within the component, it will be used as the message if message is not provided.\n\t */\n\tchildren?: React.ReactNode;\n\n\t/**\n\t * The data-qa attribute for testing purposes.\n\t */\n\t['data-qa']?: string;\n}\n\nconst getIcon = (kind: InlineMessageKind, customIcon?: DSIconType): DSIconType | undefined => {\n\tswitch (kind) {\n\t\tcase 'error':\n\t\t\treturn error;\n\t\tcase 'info':\n\t\t\treturn info;\n\t\tcase 'warning':\n\t\t\treturn warning;\n\t\tcase 'success':\n\t\t\treturn check;\n\t\tdefault:\n\t\t\treturn customIcon ? customIcon : undefined;\n\t}\n};\n\nconst renderIcon = (\n\ticon: DSIconType | undefined,\n\ticonClasses: string\n): React.ReactElement | undefined => {\n\tif (icon) {\n\t\treturn (\n\t\t\t<span className={iconClasses}>\n\t\t\t\t<MrlSvg size=\"auto\" svg={icon} />\n\t\t\t</span>\n\t\t);\n\t}\n};\n\n/**\n * MrlInlineMessage is a notification component that can be used to display messages to the user.\n * @param props - The properties of the component.\n * @returns A React component.\n */\nexport const MrlInlineMessage = ({\n\tchildren,\n\tcustomIcon,\n\tid,\n\tkind,\n\tmessage,\n\t['data-qa']: qa = 'mrl-inline-notification',\n\t...rest\n}: MrlInlineMessageProps): React.ReactElement => {\n\tconst icon = getIcon(kind, customIcon);\n\tconst iconClasses = classNames(styles['MrlInlineMessage-icon']);\n\n\tconst notificationClasses = classNames(styles['MrlInlineMessage'], 'MrlInlineMessage', {\n\t\t[styles.error]: kind === 'error',\n\t\t[styles.information]: kind === 'info',\n\t\t[styles.success]: kind === 'success',\n\t\t[styles.warning]: kind === 'warning',\n\t\t[styles.helper]: kind === 'helper'\n\t});\n\n\treturn (\n\t\t<span {...rest} className={notificationClasses} data-qa={qa} id={id}>\n\t\t\t{renderIcon(icon, iconClasses)}\n\t\t\t<span className=\"MrlInlineMessage-message\">\n\t\t\t\t{typeof message !== 'undefined' ? message : children}\n\t\t\t</span>\n\t\t</span>\n\t);\n};\n"],"names":["getIcon","kind","customIcon","error","info","warning","check","undefined","renderIcon","icon","iconClasses","React","createElement","className","MrlSvg","size","svg","MrlInlineMessage","_ref","children","id","message","_ref$dataQa","qa","rest","_objectWithoutProperties","_excluded","classNames","styles","notificationClasses","information","success","helper","_extends"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,IAAMA,OAAO,GAAGA,CAACC,IAAuB,EAAEC,UAAuB,KAA6B;AAC7F,EAAA,QAAQD,IAAI;AACX,IAAA,KAAK,OAAO;AACX,MAAA,OAAOE,aAAK;AACb,IAAA,KAAK,MAAM;AACV,MAAA,OAAOC,YAAI;AACZ,IAAA,KAAK,SAAS;AACb,MAAA,OAAOC,eAAO;AACf,IAAA,KAAK,SAAS;AACb,MAAA,OAAOC,aAAK;AACb,IAAA;AACC,MAAA,OAAOJ,UAAU,GAAGA,UAAU,GAAGK,SAAS;AAC5C;AACD,CAAC;AAED,IAAMC,UAAU,GAAGA,CAClBC,IAA4B,EAC5BC,WAAmB,KACiB;AACpC,EAAA,IAAID,IAAI,EAAE;IACT,oBACCE,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,MAAAA,SAAS,EAAEH;AAAY,KAAA,eAC5BC,gBAAA,CAAAC,aAAA,CAACE,aAAM,EAAA;AAACC,MAAAA,IAAI,EAAC,MAAM;AAACC,MAAAA,GAAG,EAAEP;AAAK,KAAE,CAC3B,CAAC;AAET,EAAA;AACD,CAAC;;AAED;AACA;AACA;AACA;AACA;AACO,IAAMQ,gBAAgB,GAAGC,IAAA,IAQiB;AAAA,EAAA,IAPhDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRjB,UAAU,GAAAgB,IAAA,CAAVhB,UAAU;IACVkB,EAAE,GAAAF,IAAA,CAAFE,EAAE;IACFnB,IAAI,GAAAiB,IAAA,CAAJjB,IAAI;IACJoB,OAAO,GAAAH,IAAA,CAAPG,OAAO;IAAAC,WAAA,GAAAJ,IAAA,CACN,SAAS,CAAA;AAAGK,IAAAA,EAAE,GAAAD,WAAA,KAAA,MAAA,GAAG,yBAAyB,GAAAA,WAAA;AACxCE,IAAAA,IAAI,GAAAC,iDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;AAEP,EAAA,IAAMjB,IAAI,GAAGT,OAAO,CAACC,IAAI,EAAEC,UAAU,CAAC;EACtC,IAAMQ,WAAW,GAAGiB,2BAAU,CAACC,+BAAM,CAAC,uBAAuB,CAAC,CAAC;EAE/D,IAAMC,mBAAmB,GAAGF,2BAAU,CAACC,+BAAM,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,EAAE;AACtF,IAAA,CAACA,+BAAM,CAACzB,KAAK,GAAGF,IAAI,KAAK,OAAO;AAChC,IAAA,CAAC2B,+BAAM,CAACE,WAAW,GAAG7B,IAAI,KAAK,MAAM;AACrC,IAAA,CAAC2B,+BAAM,CAACG,OAAO,GAAG9B,IAAI,KAAK,SAAS;AACpC,IAAA,CAAC2B,+BAAM,CAACvB,OAAO,GAAGJ,IAAI,KAAK,SAAS;AACpC,IAAA,CAAC2B,+BAAM,CAACI,MAAM,GAAG/B,IAAI,KAAK;AAC3B,GAAC,CAAC;AAEF,EAAA,oBACCU,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAAqB,iCAAA,KAAUT,IAAI,EAAA;AAAEX,IAAAA,SAAS,EAAEgB,mBAAoB;AAAC,IAAA,SAAA,EAASN,EAAG;AAACH,IAAAA,EAAE,EAAEA;GAAG,CAAA,EAClEZ,UAAU,CAACC,IAAI,EAAEC,WAAW,CAAC,eAC9BC,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC;GAA0B,EACxC,OAAOQ,OAAO,KAAK,WAAW,GAAGA,OAAO,GAAGF,QACvC,CACD,CAAC;AAET;;;;"}

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

@@ -13,7 +13,10 @@ var MrlLink = require('../../link/MrlLink/MrlLink.js');
 var MrlButton = require('../../button/MrlButton/MrlButton.js');
 var MrlIconButton = require('../../button/MrlIconButton/MrlIconButton.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -30,7 +33,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["data-qa", "autoClose", "avatar", "backgroundColor", "className", "closeAfterMs", "kind", "link", "onClose", "primaryCTA", "primaryMessage", "secondaryCTA", "secondaryMessage", "showCloseButton", "showIcon"];
 /**
@@ -38,7 +42,7 @@ var _excluded = ["data-qa", "autoClose", "avatar", "backgroundColor", "className
  * @param {MrlToastProps} props - The props for the MrlToast component.
  * @returns {React.ReactElement} The MrlToast component.
  */
-var MrlToast = function MrlToast(_ref) {
+var MrlToast = _ref => {
   var _ref$dataQa = _ref['data-qa'],
     qa = _ref$dataQa === void 0 ? 'toast-notification' : _ref$dataQa,
     _ref$autoClose = _ref.autoClose,
@@ -74,13 +78,13 @@ var MrlToast = function MrlToast(_ref) {
     _useAutoClose2 = _rollupPluginBabelHelpers.slicedToArray(_useAutoClose, 2),
     closed = _useAutoClose2[0],
     setClosed = _useAutoClose2[1];
-  var handleClose = function handleClose() {
+  var handleClose = () => {
     setClosed(true);
 
     // Slightly delay the onClose callback to allow the toast to animate out.
     // This will prevent the toast from disappearing abruptly depending on how
     // it is implemented within the application
-    setTimeout(function () {
+    setTimeout(() => {
       if (onClose) onClose();
     }, 500);
   };
@@ -88,17 +92,22 @@ var MrlToast = function MrlToast(_ref) {
     collaborator: dsIcons.lock,
     error: dsIcons.error,
     info: dsIcons.info,
-    "private": dsIcons.modePrivate,
+    private: dsIcons.modePrivate,
     success: dsIcons.check,
     warning: dsIcons.warning
   };
   var hasAvatar = typeof avatar !== 'undefined' && kind === 'collaborator';
   var darkCollaborator = kind === 'collaborator' && backgroundColor && colors.stickyTextColor(backgroundColor, 'light', 'dark') === 'light';
-  var classes = classnames(MrlToast_module.default['MrlToast'], className, MrlToast_module.default["".concat(kind, "Notification")], _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlToast_module.default.darkCollaborator, !!darkCollaborator), MrlToast_module.default.closing, closed), MrlToast_module.default['has-cta'], !!hasInteractiveElements), MrlToast_module.default['has-avatar'], hasAvatar));
+  var classes = classnames__default.default(MrlToast_module.default['MrlToast'], className, MrlToast_module.default["".concat(kind, "Notification")], {
+    [MrlToast_module.default.darkCollaborator]: !!darkCollaborator,
+    [MrlToast_module.default.closing]: closed,
+    [MrlToast_module.default['has-cta']]: !!hasInteractiveElements,
+    [MrlToast_module.default['has-avatar']]: hasAvatar
+  });
   var closeButtonkind = kind === 'warning' || darkCollaborator ? 'ghost' : 'ghost-inverse';
   var customTextColor = !!backgroundColor && kind === 'collaborator' ? colors.stickyTextColor(backgroundColor, '#000000', '#ffffff') : undefined;
-  var primaryMessageClasses = classnames(MrlToast_module.default.primaryMessage, 'MrlToast--primaryMessage');
-  var secondaryMessageClasses = classnames(MrlToast_module.default.secondaryMessage, 'MrlToast--secondaryMessage');
+  var primaryMessageClasses = classnames__default.default(MrlToast_module.default.primaryMessage, 'MrlToast--primaryMessage');
+  var secondaryMessageClasses = classnames__default.default(MrlToast_module.default.secondaryMessage, 'MrlToast--secondaryMessage');
   return /*#__PURE__*/React__namespace.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
     className: classes,
     "data-qa": qa,

package/dist/cjs/components/notification/MrlToast/MrlToast.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlToast.js","sources":["../../../../../src/components/notification/MrlToast/MrlToast.tsx"],"sourcesContent":["import * as React from 'react';\nimport { check, close, error, info, lock, modePrivate, warning } from '@muraldevkit/ds-icons';\nimport { stickyTextColor } from '@tactivos/mural-shared/lib/colors';\nimport { MrlIconButton, MrlButton } from '../../button';\nimport { MrlLink } from '../../link';\nimport { MrlSvg, DSIconType } from '../../svg';\nimport { MrlAvatarPropTypes } from '../../avatar/MrlAvatar';\nimport styles from './MrlToast.module.scss';\nimport classNames from 'classnames';\nimport { NotificationKind } from '../constants';\nimport { PORTAL_LAYERS as layers } from '../../../utils/layers';\nimport { useAutoClose } from '../../../hooks/useAutoClose';\n\nexport type MrlToastKind = NotificationKind | 'collaborator' | 'general';\n\nexport type MrlToastPosition = 'bottom' | 'top';\n\nexport interface MrlToastCTA {\n\tonClick: () => void;\n\ttext: string;\n\tdataQa: string;\n}\n\nexport interface MrlToastLink {\n\ttext: string;\n\turl: string;\n}\n\nexport interface MrlToastProps {\n\t['data-qa']?: string;\n\t/**\n\t * Determines whether the Toast Notification should automatically close after the time specified in `closeAfterMs` (default 3000ms).\n\t *\n\t * Note: auto-closing is only possible when no interactive elements (e.g. close button & CTA's) exist on the toast notification\n\t */\n\tautoClose?: boolean;\n\t/**\n\t * A MrlAvatar component instance to display in the toast notification.\n\t *\n\t * Note: This is only applicable when `kind` is set to 'collaborator'. When provided, the avatar will be shown instead of the default icon.\n\t * The `showIcon` prop will be ignored when `avatar` is present.\n\t *\n\t * @example\n\t * ```tsx\n\t * <MrlToast\n\t *   kind=\"collaborator\"\n\t *   avatar={<MrlAvatar name=\"John Doe\" size=\"small\" avatarColor=\"#FF5733\" />}\n\t *   primaryMessage=\"John Doe joined the mural\"\n\t * />\n\t * ```\n\t */\n\tavatar?: React.ReactElement<MrlAvatarPropTypes>;\n\t/**\n\t * Sets the background color of the toast notification.\n\t *\n\t * Note: this is only applicable when the `kind` is set to 'collaborator'.\n\t */\n\tbackgroundColor?: string;\n\tclassName?: string;\n\t/**\n\t * The time in milliseconds after which the toast notification should automatically close.\n\t */\n\tcloseAfterMs?: number;\n\tkind?: MrlToastKind;\n\tlink?: MrlToastLink;\n\tonClose?: () => void;\n\tprimaryCTA?: MrlToastCTA;\n\tprimaryMessage: string | JSX.Element;\n\tsecondaryCTA?: MrlToastCTA;\n\tsecondaryMessage?: string | JSX.Element;\n\t/** Determines whether the close icon button should be shown. */\n\tshowCloseButton?: boolean;\n\tshowIcon?: boolean;\n}\n\n/**\n * MrlToast component.\n * @param {MrlToastProps} props - The props for the MrlToast component.\n * @returns {React.ReactElement} The MrlToast component.\n */\nexport const MrlToast = ({\n\t['data-qa']: qa = 'toast-notification',\n\tautoClose = true,\n\tavatar,\n\tbackgroundColor,\n\tclassName,\n\tcloseAfterMs = 3000,\n\tkind = 'info',\n\tlink,\n\tonClose,\n\tprimaryCTA,\n\tprimaryMessage,\n\tsecondaryCTA,\n\tsecondaryMessage,\n\tshowCloseButton = false,\n\tshowIcon = true,\n\t...rest\n}: MrlToastProps): React.ReactElement => {\n\t// Set to true if any buttons exist on the toast, false otherwise\n\tconst hasInteractiveElements = showCloseButton || primaryCTA || secondaryCTA;\n\n\t// Allowing autoClose when there are interactive elements in the toast is an anti-pattern\n\t// and should be avoided. If autoClose is set to true and interactive elements exist, the\n\t// toast will not close automatically.\n\tconst shouldAutoClose = autoClose && !hasInteractiveElements;\n\n\t/* Boolean value tracking if the close timeout has been reached */\n\tconst [closed, setClosed] = useAutoClose(shouldAutoClose, closeAfterMs, onClose);\n\n\tconst handleClose = (): void => {\n\t\tsetClosed(true);\n\n\t\t// Slightly delay the onClose callback to allow the toast to animate out.\n\t\t// This will prevent the toast from disappearing abruptly depending on how\n\t\t// it is implemented within the application\n\t\tsetTimeout(() => {\n\t\t\tif (onClose) onClose();\n\t\t}, 500);\n\t};\n\n\tconst DEFAULT_ICONS: Partial<Record<MrlToastKind, DSIconType>> = {\n\t\tcollaborator: lock,\n\t\terror,\n\t\tinfo,\n\t\tprivate: modePrivate,\n\t\tsuccess: check,\n\t\twarning\n\t};\n\n\tconst hasAvatar = typeof avatar !== 'undefined' && kind === 'collaborator';\n\n\tconst darkCollaborator =\n\t\tkind === 'collaborator' &&\n\t\tbackgroundColor &&\n\t\tstickyTextColor(backgroundColor, 'light', 'dark') === 'light';\n\n\tconst classes = classNames(styles['MrlToast'], className, styles[`${kind}Notification`], {\n\t\t[styles.darkCollaborator]: !!darkCollaborator,\n\t\t[styles.closing]: closed,\n\t\t[styles['has-cta']]: !!hasInteractiveElements,\n\t\t[styles['has-avatar']]: hasAvatar\n\t});\n\n\tconst closeButtonkind = kind === 'warning' || darkCollaborator ? 'ghost' : 'ghost-inverse';\n\n\tconst customTextColor =\n\t\t!!backgroundColor && kind === 'collaborator'\n\t\t\t? stickyTextColor(backgroundColor, '#000000', '#ffffff')\n\t\t\t: undefined;\n\n\tconst primaryMessageClasses = classNames(styles.primaryMessage, 'MrlToast--primaryMessage');\n\tconst secondaryMessageClasses = classNames(styles.secondaryMessage, 'MrlToast--secondaryMessage');\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tclassName={classes}\n\t\t\tdata-qa={qa}\n\t\t\tstyle={{\n\t\t\t\tbackgroundColor: kind === 'collaborator' ? backgroundColor : undefined,\n\t\t\t\tcolor: customTextColor,\n\t\t\t\tzIndex: layers.TOAST.zIndex\n\t\t\t}}\n\t\t>\n\t\t\t<div className={styles.content}>\n\t\t\t\t{hasAvatar && <span className={styles.avatarWrapper}>{avatar}</span>}\n\t\t\t\t{!hasAvatar && showIcon && (\n\t\t\t\t\t<span className={styles.iconWrapper}>\n\t\t\t\t\t\t<MrlSvg size=\"small\" svg={DEFAULT_ICONS[kind] || info} />\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<span className={styles.textContent}>\n\t\t\t\t\t<span className={primaryMessageClasses} data-qa=\"toast-primary-content\">\n\t\t\t\t\t\t{primaryMessage}\n\t\t\t\t\t</span>{' '}\n\t\t\t\t\t<span className={secondaryMessageClasses}>{secondaryMessage}</span>\n\t\t\t\t\t{link && (\n\t\t\t\t\t\t<span className={styles.link}>\n\t\t\t\t\t\t\t<MrlLink\n\t\t\t\t\t\t\t\ttext={link.text}\n\t\t\t\t\t\t\t\thref={link.url}\n\t\t\t\t\t\t\t\tkind=\"simple\"\n\t\t\t\t\t\t\t\tstyle={{ color: 'inherit' }}\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\t\t\t\t</span>\n\t\t\t</div>\n\t\t\t{hasInteractiveElements && (\n\t\t\t\t<div className={styles['cta-container']}>\n\t\t\t\t\t{secondaryCTA && (\n\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\tattrs={{\n\t\t\t\t\t\t\t\tclassName: styles['cta--secondary']\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tdata-qa={secondaryCTA.dataQa}\n\t\t\t\t\t\t\tkind=\"inverse\"\n\t\t\t\t\t\t\tonClick={secondaryCTA.onClick}\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\ttext={secondaryCTA.text}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{primaryCTA && (\n\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\tattrs={{\n\t\t\t\t\t\t\t\tclassName: styles['cta--primary']\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tdata-qa={primaryCTA.dataQa}\n\t\t\t\t\t\t\tkind=\"inverse\"\n\t\t\t\t\t\t\tonClick={primaryCTA.onClick}\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\ttext={primaryCTA.text}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{showCloseButton && (\n\t\t\t\t\t\t<MrlIconButton\n\t\t\t\t\t\t\tattrs={{\n\t\t\t\t\t\t\t\tclassName: styles['cta--close']\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tdata-qa=\"mrl-toast-close-button\"\n\t\t\t\t\t\t\ticon={<MrlSvg svg={close} />}\n\t\t\t\t\t\t\tkind={closeButtonkind}\n\t\t\t\t\t\t\tonClick={handleClose}\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\ttext=\"Close\"\n\t\t\t\t\t\t\tstate=\"default\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["MrlToast","_ref","_ref$dataQa","qa","_ref$autoClose","autoClose","avatar","backgroundColor","className","_ref$closeAfterMs","closeAfterMs","_ref$kind","kind","link","onClose","primaryCTA","primaryMessage","secondaryCTA","secondaryMessage","_ref$showCloseButton","showCloseButton","_ref$showIcon","showIcon","rest","_objectWithoutProperties","_excluded","hasInteractiveElements","shouldAutoClose","_useAutoClose","useAutoClose","_useAutoClose2","_slicedToArray","closed","setClosed","handleClose","setTimeout","DEFAULT_ICONS","collaborator","lock","error","info","modePrivate","success","check","warning","hasAvatar","darkCollaborator","stickyTextColor","classes","classNames","styles","concat","_defineProperty","closing","closeButtonkind","customTextColor","undefined","primaryMessageClasses","secondaryMessageClasses","React","createElement","_extends","style","color","zIndex","layers","TOAST","content","avatarWrapper","iconWrapper","MrlSvg","size","svg","textContent","MrlLink","text","href","url","MrlButton","attrs","dataQa","onClick","MrlIconButton","icon","close","state"],"mappings":"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"}
+{"version":3,"file":"MrlToast.js","sources":["../../../../../src/components/notification/MrlToast/MrlToast.tsx"],"sourcesContent":["import * as React from 'react';\nimport { check, close, error, info, lock, modePrivate, warning } from '@muraldevkit/ds-icons';\nimport { stickyTextColor } from '@tactivos/mural-shared/lib/colors';\nimport { MrlIconButton, MrlButton } from '../../button';\nimport { MrlLink } from '../../link';\nimport { MrlSvg, DSIconType } from '../../svg';\nimport { MrlAvatarPropTypes } from '../../avatar/MrlAvatar';\nimport styles from './MrlToast.module.scss';\nimport classNames from 'classnames';\nimport { NotificationKind } from '../constants';\nimport { PORTAL_LAYERS as layers } from '../../../utils/layers';\nimport { useAutoClose } from '../../../hooks/useAutoClose';\n\nexport type MrlToastKind = NotificationKind | 'collaborator' | 'general';\n\nexport type MrlToastPosition = 'bottom' | 'top';\n\nexport interface MrlToastCTA {\n\tonClick: () => void;\n\ttext: string;\n\tdataQa: string;\n}\n\nexport interface MrlToastLink {\n\ttext: string;\n\turl: string;\n}\n\nexport interface MrlToastProps {\n\t['data-qa']?: string;\n\t/**\n\t * Determines whether the Toast Notification should automatically close after the time specified in `closeAfterMs` (default 3000ms).\n\t *\n\t * Note: auto-closing is only possible when no interactive elements (e.g. close button & CTA's) exist on the toast notification\n\t */\n\tautoClose?: boolean;\n\t/**\n\t * A MrlAvatar component instance to display in the toast notification.\n\t *\n\t * Note: This is only applicable when `kind` is set to 'collaborator'. When provided, the avatar will be shown instead of the default icon.\n\t * The `showIcon` prop will be ignored when `avatar` is present.\n\t *\n\t * @example\n\t * ```tsx\n\t * <MrlToast\n\t *   kind=\"collaborator\"\n\t *   avatar={<MrlAvatar name=\"John Doe\" size=\"small\" avatarColor=\"#FF5733\" />}\n\t *   primaryMessage=\"John Doe joined the mural\"\n\t * />\n\t * ```\n\t */\n\tavatar?: React.ReactElement<MrlAvatarPropTypes>;\n\t/**\n\t * Sets the background color of the toast notification.\n\t *\n\t * Note: this is only applicable when the `kind` is set to 'collaborator'.\n\t */\n\tbackgroundColor?: string;\n\tclassName?: string;\n\t/**\n\t * The time in milliseconds after which the toast notification should automatically close.\n\t */\n\tcloseAfterMs?: number;\n\tkind?: MrlToastKind;\n\tlink?: MrlToastLink;\n\tonClose?: () => void;\n\tprimaryCTA?: MrlToastCTA;\n\tprimaryMessage: string | JSX.Element;\n\tsecondaryCTA?: MrlToastCTA;\n\tsecondaryMessage?: string | JSX.Element;\n\t/** Determines whether the close icon button should be shown. */\n\tshowCloseButton?: boolean;\n\tshowIcon?: boolean;\n}\n\n/**\n * MrlToast component.\n * @param {MrlToastProps} props - The props for the MrlToast component.\n * @returns {React.ReactElement} The MrlToast component.\n */\nexport const MrlToast = ({\n\t['data-qa']: qa = 'toast-notification',\n\tautoClose = true,\n\tavatar,\n\tbackgroundColor,\n\tclassName,\n\tcloseAfterMs = 3000,\n\tkind = 'info',\n\tlink,\n\tonClose,\n\tprimaryCTA,\n\tprimaryMessage,\n\tsecondaryCTA,\n\tsecondaryMessage,\n\tshowCloseButton = false,\n\tshowIcon = true,\n\t...rest\n}: MrlToastProps): React.ReactElement => {\n\t// Set to true if any buttons exist on the toast, false otherwise\n\tconst hasInteractiveElements = showCloseButton || primaryCTA || secondaryCTA;\n\n\t// Allowing autoClose when there are interactive elements in the toast is an anti-pattern\n\t// and should be avoided. If autoClose is set to true and interactive elements exist, the\n\t// toast will not close automatically.\n\tconst shouldAutoClose = autoClose && !hasInteractiveElements;\n\n\t/* Boolean value tracking if the close timeout has been reached */\n\tconst [closed, setClosed] = useAutoClose(shouldAutoClose, closeAfterMs, onClose);\n\n\tconst handleClose = (): void => {\n\t\tsetClosed(true);\n\n\t\t// Slightly delay the onClose callback to allow the toast to animate out.\n\t\t// This will prevent the toast from disappearing abruptly depending on how\n\t\t// it is implemented within the application\n\t\tsetTimeout(() => {\n\t\t\tif (onClose) onClose();\n\t\t}, 500);\n\t};\n\n\tconst DEFAULT_ICONS: Partial<Record<MrlToastKind, DSIconType>> = {\n\t\tcollaborator: lock,\n\t\terror,\n\t\tinfo,\n\t\tprivate: modePrivate,\n\t\tsuccess: check,\n\t\twarning\n\t};\n\n\tconst hasAvatar = typeof avatar !== 'undefined' && kind === 'collaborator';\n\n\tconst darkCollaborator =\n\t\tkind === 'collaborator' &&\n\t\tbackgroundColor &&\n\t\tstickyTextColor(backgroundColor, 'light', 'dark') === 'light';\n\n\tconst classes = classNames(styles['MrlToast'], className, styles[`${kind}Notification`], {\n\t\t[styles.darkCollaborator]: !!darkCollaborator,\n\t\t[styles.closing]: closed,\n\t\t[styles['has-cta']]: !!hasInteractiveElements,\n\t\t[styles['has-avatar']]: hasAvatar\n\t});\n\n\tconst closeButtonkind = kind === 'warning' || darkCollaborator ? 'ghost' : 'ghost-inverse';\n\n\tconst customTextColor =\n\t\t!!backgroundColor && kind === 'collaborator'\n\t\t\t? stickyTextColor(backgroundColor, '#000000', '#ffffff')\n\t\t\t: undefined;\n\n\tconst primaryMessageClasses = classNames(styles.primaryMessage, 'MrlToast--primaryMessage');\n\tconst secondaryMessageClasses = classNames(styles.secondaryMessage, 'MrlToast--secondaryMessage');\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tclassName={classes}\n\t\t\tdata-qa={qa}\n\t\t\tstyle={{\n\t\t\t\tbackgroundColor: kind === 'collaborator' ? backgroundColor : undefined,\n\t\t\t\tcolor: customTextColor,\n\t\t\t\tzIndex: layers.TOAST.zIndex\n\t\t\t}}\n\t\t>\n\t\t\t<div className={styles.content}>\n\t\t\t\t{hasAvatar && <span className={styles.avatarWrapper}>{avatar}</span>}\n\t\t\t\t{!hasAvatar && showIcon && (\n\t\t\t\t\t<span className={styles.iconWrapper}>\n\t\t\t\t\t\t<MrlSvg size=\"small\" svg={DEFAULT_ICONS[kind] || info} />\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<span className={styles.textContent}>\n\t\t\t\t\t<span className={primaryMessageClasses} data-qa=\"toast-primary-content\">\n\t\t\t\t\t\t{primaryMessage}\n\t\t\t\t\t</span>{' '}\n\t\t\t\t\t<span className={secondaryMessageClasses}>{secondaryMessage}</span>\n\t\t\t\t\t{link && (\n\t\t\t\t\t\t<span className={styles.link}>\n\t\t\t\t\t\t\t<MrlLink\n\t\t\t\t\t\t\t\ttext={link.text}\n\t\t\t\t\t\t\t\thref={link.url}\n\t\t\t\t\t\t\t\tkind=\"simple\"\n\t\t\t\t\t\t\t\tstyle={{ color: 'inherit' }}\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\t\t\t\t</span>\n\t\t\t</div>\n\t\t\t{hasInteractiveElements && (\n\t\t\t\t<div className={styles['cta-container']}>\n\t\t\t\t\t{secondaryCTA && (\n\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\tattrs={{\n\t\t\t\t\t\t\t\tclassName: styles['cta--secondary']\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tdata-qa={secondaryCTA.dataQa}\n\t\t\t\t\t\t\tkind=\"inverse\"\n\t\t\t\t\t\t\tonClick={secondaryCTA.onClick}\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\ttext={secondaryCTA.text}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{primaryCTA && (\n\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\tattrs={{\n\t\t\t\t\t\t\t\tclassName: styles['cta--primary']\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tdata-qa={primaryCTA.dataQa}\n\t\t\t\t\t\t\tkind=\"inverse\"\n\t\t\t\t\t\t\tonClick={primaryCTA.onClick}\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\ttext={primaryCTA.text}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{showCloseButton && (\n\t\t\t\t\t\t<MrlIconButton\n\t\t\t\t\t\t\tattrs={{\n\t\t\t\t\t\t\t\tclassName: styles['cta--close']\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tdata-qa=\"mrl-toast-close-button\"\n\t\t\t\t\t\t\ticon={<MrlSvg svg={close} />}\n\t\t\t\t\t\t\tkind={closeButtonkind}\n\t\t\t\t\t\t\tonClick={handleClose}\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\ttext=\"Close\"\n\t\t\t\t\t\t\tstate=\"default\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["MrlToast","_ref","_ref$dataQa","qa","_ref$autoClose","autoClose","avatar","backgroundColor","className","_ref$closeAfterMs","closeAfterMs","_ref$kind","kind","link","onClose","primaryCTA","primaryMessage","secondaryCTA","secondaryMessage","_ref$showCloseButton","showCloseButton","_ref$showIcon","showIcon","rest","_objectWithoutProperties","_excluded","hasInteractiveElements","shouldAutoClose","_useAutoClose","useAutoClose","_useAutoClose2","_slicedToArray","closed","setClosed","handleClose","setTimeout","DEFAULT_ICONS","collaborator","lock","error","info","private","modePrivate","success","check","warning","hasAvatar","darkCollaborator","stickyTextColor","classes","classNames","styles","concat","closing","closeButtonkind","customTextColor","undefined","primaryMessageClasses","secondaryMessageClasses","React","createElement","_extends","style","color","zIndex","layers","TOAST","content","avatarWrapper","iconWrapper","MrlSvg","size","svg","textContent","MrlLink","text","href","url","MrlButton","attrs","dataQa","onClick","MrlIconButton","icon","close","state"],"mappings":"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"}

package/dist/cjs/components/pagination/MrlPagination/MrlPagination.js

@@ -5,7 +5,10 @@ var React = require('react');
 var classnames = require('classnames');
 var MrlPagination_module = require('./MrlPagination.module.scss.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -22,7 +25,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["children", "className", "heading", "style"];
 /**
@@ -38,7 +42,7 @@ function MrlPagination(_ref) {
     heading = _ref$heading === void 0 ? 'Pagination' : _ref$heading,
     style = _ref.style,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var allClasses = classnames(MrlPagination_module.default['MrlPagination'], className);
+  var allClasses = classnames__default.default(MrlPagination_module.default['MrlPagination'], className);
   return /*#__PURE__*/React__namespace.createElement("nav", _rollupPluginBabelHelpers.extends({
     className: allClasses,
     "aria-label": heading,

package/dist/cjs/components/pagination/MrlPagination/MrlPagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlPagination.js","sources":["../../../../../src/components/pagination/MrlPagination/MrlPagination.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\n\nimport styles from './MrlPagination.module.scss';\n\ninterface MrlPaginationProps extends React.ComponentPropsWithoutRef<'nav'> {\n\t/** Elements to be rendered by MrlPagination */\n\tchildren: React.ReactNode;\n\t/** Additional class to add to the nav element */\n\tclassName?: string;\n\t/** Pagination heading */\n\theading?: string;\n\t/** Styles to add to the wrapper for the unordered list */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * Pagination component\n *\n * @param {MrlPaginationProps} props - the component props\n * @returns pagination\n */\nexport function MrlPagination({\n\tchildren,\n\tclassName,\n\theading = 'Pagination',\n\tstyle,\n\t...rest\n}: MrlPaginationProps): JSX.Element {\n\tconst allClasses = classnames(styles['MrlPagination'], className);\n\n\treturn (\n\t\t<nav className={allClasses} aria-label={heading} style={style}\n\t\t\t{...rest}>\n\t\t\t<ul className={styles.MrlPaginationList}>{children}</ul>\n\t\t</nav>\n\t);\n}\n"],"names":["MrlPagination","_ref","children","className","_ref$heading","heading","style","rest","_objectWithoutProperties","_excluded","allClasses","classnames","styles","React","createElement","_extends","MrlPaginationList"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,aAAaA,CAAAC,IAAA,EAMO;AAAA,EAAA,IALnCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAAC,YAAA,GAAAH,IAAA,CACTI,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAA,MAAA,GAAG,YAAY,GAAAA,YAAA;IACtBE,KAAK,GAAAL,IAAA,CAALK,KAAK;AACFC,IAAAA,IAAI,GAAAC,iDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;EAEP,IAAMC,UAAU,GAAGC,UAAU,CAACC,4BAAM,CAAC,eAAe,CAAC,EAAET,SAAS,CAAC;AAEjE,EAAA,oBACCU,gBAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA;AAAKZ,IAAAA,SAAS,EAAEO,UAAW;AAAC,IAAA,YAAA,EAAYL,OAAQ;AAACC,IAAAA,KAAK,EAAEA;AAAM,GAAA,EACzDC,IAAI,CAAA,eACRM,gBAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;IAAIX,SAAS,EAAES,4BAAM,CAACI;GAAkB,EAAEd,QAAa,CACnD,CAAC;AAER;;;;"}
+{"version":3,"file":"MrlPagination.js","sources":["../../../../../src/components/pagination/MrlPagination/MrlPagination.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\n\nimport styles from './MrlPagination.module.scss';\n\ninterface MrlPaginationProps extends React.ComponentPropsWithoutRef<'nav'> {\n\t/** Elements to be rendered by MrlPagination */\n\tchildren: React.ReactNode;\n\t/** Additional class to add to the nav element */\n\tclassName?: string;\n\t/** Pagination heading */\n\theading?: string;\n\t/** Styles to add to the wrapper for the unordered list */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * Pagination component\n *\n * @param {MrlPaginationProps} props - the component props\n * @returns pagination\n */\nexport function MrlPagination({\n\tchildren,\n\tclassName,\n\theading = 'Pagination',\n\tstyle,\n\t...rest\n}: MrlPaginationProps): JSX.Element {\n\tconst allClasses = classnames(styles['MrlPagination'], className);\n\n\treturn (\n\t\t<nav className={allClasses} aria-label={heading} style={style}\n\t\t\t{...rest}>\n\t\t\t<ul className={styles.MrlPaginationList}>{children}</ul>\n\t\t</nav>\n\t);\n}\n"],"names":["MrlPagination","_ref","children","className","_ref$heading","heading","style","rest","_objectWithoutProperties","_excluded","allClasses","classnames","styles","React","createElement","_extends","MrlPaginationList"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,aAAaA,CAAAC,IAAA,EAMO;AAAA,EAAA,IALnCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAAC,YAAA,GAAAH,IAAA,CACTI,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAA,MAAA,GAAG,YAAY,GAAAA,YAAA;IACtBE,KAAK,GAAAL,IAAA,CAALK,KAAK;AACFC,IAAAA,IAAI,GAAAC,iDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;EAEP,IAAMC,UAAU,GAAGC,2BAAU,CAACC,4BAAM,CAAC,eAAe,CAAC,EAAET,SAAS,CAAC;AAEjE,EAAA,oBACCU,gBAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA;AAAKZ,IAAAA,SAAS,EAAEO,UAAW;AAAC,IAAA,YAAA,EAAYL,OAAQ;AAACC,IAAAA,KAAK,EAAEA;AAAM,GAAA,EACzDC,IAAI,CAAA,eACRM,gBAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;IAAIX,SAAS,EAAES,4BAAM,CAACI;GAAkB,EAAEd,QAAa,CACnD,CAAC;AAER;;;;"}

package/dist/cjs/components/pagination/MrlPaginationButton/MrlPaginationButton.js

@@ -9,7 +9,10 @@ var constants = require('../../tooltip/constants.js');
 var MrlIconButton = require('../../button/MrlIconButton/MrlIconButton.js');
 var MrlSvg = require('../../svg/MrlSvg/MrlSvg.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -26,7 +29,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["buttonClass", "className", "disabled", "kind", "handleClick", "text", "tooltipAnchor", "tooltipPosition"];
 /**
@@ -46,7 +50,7 @@ function MrlPaginationButton(_ref) {
     _ref$tooltipPosition = _ref.tooltipPosition,
     tooltipPosition = _ref$tooltipPosition === void 0 ? 'top' : _ref$tooltipPosition,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var itemClasses = classnames(MrlPagination_module.default['MrlPaginationItem'], className);
+  var itemClasses = classnames__default.default(MrlPagination_module.default['MrlPaginationItem'], className);
   var icons = {
     first: dsIcons.chevronGoToFirst,
     last: dsIcons.chevronGoToLast,

package/dist/cjs/components/pagination/MrlPaginationButton/MrlPaginationButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlPaginationButton.js","sources":["../../../../../src/components/pagination/MrlPaginationButton/MrlPaginationButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport {\n\tMrlIconButton,\n\tMrlSvg,\n\tMrlTooltipAnchor,\n\tMrlTooltipDefaults,\n\tMrlTooltipPosition\n} from '../..';\nimport { PaginationButtonType } from '../constants';\nimport {\n\tchevronGoToFirst,\n\tchevronGoToLast,\n\tchevronLeft,\n\tchevronRight\n} from '@muraldevkit/ds-icons';\n\nimport styles from '../MrlPagination/MrlPagination.module.scss';\n\ninterface MrlPaginationButtonProps {\n\t/** Additional class to add to the button element */\n\tbuttonClass?: string;\n\t/** Additional class to add to the container element */\n\tclassName?: string;\n\tdisabled?: boolean;\n\t/** The type of pagination item  */\n\tkind: PaginationButtonType;\n\t/**\n\t * Click event for the button.\n\t */\n\thandleClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n\t/** Pagination heading */\n\ttext?: string;\n\t/** The anchor of the tooltips on the buttons */\n\ttooltipAnchor?: MrlTooltipAnchor;\n\t/** The placement of the tooltips on the buttons */\n\ttooltipPosition?: MrlTooltipPosition;\n}\n\n/**\n * Pagination button component\n * @param {MrlPaginationButtonProps} props - the component props\n * @returns a pagintaion button\n */\nexport function MrlPaginationButton({\n\tbuttonClass,\n\tclassName,\n\tdisabled,\n\tkind,\n\thandleClick,\n\ttext,\n\ttooltipAnchor = MrlTooltipDefaults.anchor,\n\ttooltipPosition = 'top',\n\t...rest\n}: MrlPaginationButtonProps): JSX.Element {\n\tconst itemClasses = classnames(styles['MrlPaginationItem'], className);\n\tconst icons = {\n\t\tfirst: chevronGoToFirst,\n\t\tlast: chevronGoToLast,\n\t\tnext: chevronRight,\n\t\tprevious: chevronLeft\n\t};\n\tconst defaultText = {\n\t\tfirst: 'Beginning',\n\t\tlast: 'End',\n\t\tnext: 'Next',\n\t\tprevious: 'Previous'\n\t};\n\n\treturn (\n\t\t<li className={itemClasses}>\n\t\t\t<MrlIconButton\n\t\t\t\t{...rest}\n\t\t\t\tclassName={buttonClass}\n\t\t\t\tkind=\"ghost\"\n\t\t\t\ticon={<MrlSvg svg={icons[kind]} />}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tposition={tooltipPosition}\n\t\t\t\tstate={disabled ? 'disabled' : 'default'}\n\t\t\t\ttext={text || defaultText[kind]}\n\t\t\t\tsize=\"xsmall\"\n\t\t\t\ttipAnchor={tooltipAnchor}\n\t\t\t/>\n\t\t</li>\n\t);\n}\n"],"names":["MrlPaginationButton","_ref","buttonClass","className","disabled","kind","handleClick","text","_ref$tooltipAnchor","tooltipAnchor","MrlTooltipDefaults","anchor","_ref$tooltipPosition","tooltipPosition","rest","_objectWithoutProperties","_excluded","itemClasses","classnames","styles","icons","first","chevronGoToFirst","last","chevronGoToLast","next","chevronRight","previous","chevronLeft","defaultText","React","createElement","MrlIconButton","_extends","icon","MrlSvg","svg","onClick","position","state","size","tipAnchor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA;AACA;AACA;AACA;AACA;AACO,SAASA,mBAAmBA,CAAAC,IAAA,EAUO;AAAA,EAAA,IATzCC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IACXC,SAAS,GAAAF,IAAA,CAATE,SAAS;IACTC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IACJC,WAAW,GAAAL,IAAA,CAAXK,WAAW;IACXC,IAAI,GAAAN,IAAA,CAAJM,IAAI;IAAAC,kBAAA,GAAAP,IAAA,CACJQ,aAAa;AAAbA,IAAAA,aAAa,GAAAD,kBAAA,KAAA,MAAA,GAAGE,4BAAkB,CAACC,MAAM,GAAAH,kBAAA;IAAAI,oBAAA,GAAAX,IAAA,CACzCY,eAAe;AAAfA,IAAAA,eAAe,GAAAD,oBAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,oBAAA;AACpBE,IAAAA,IAAI,GAAAC,iDAAA,CAAAd,IAAA,EAAAe,SAAA,CAAA;EAEP,IAAMC,WAAW,GAAGC,UAAU,CAACC,4BAAM,CAAC,mBAAmB,CAAC,EAAEhB,SAAS,CAAC;AACtE,EAAA,IAAMiB,KAAK,GAAG;AACbC,IAAAA,KAAK,EAAEC,wBAAgB;AACvBC,IAAAA,IAAI,EAAEC,uBAAe;AACrBC,IAAAA,IAAI,EAAEC,oBAAY;AAClBC,IAAAA,QAAQ,EAAEC;GACV;AACD,EAAA,IAAMC,WAAW,GAAG;AACnBR,IAAAA,KAAK,EAAE,WAAW;AAClBE,IAAAA,IAAI,EAAE,KAAK;AACXE,IAAAA,IAAI,EAAE,MAAM;AACZE,IAAAA,QAAQ,EAAE;GACV;EAED,oBACCG,gBAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;AAAI5B,IAAAA,SAAS,EAAEc;GAAY,eAC1Ba,gBAAA,CAAAC,aAAA,CAACC,2BAAa,EAAAC,iCAAA,KACTnB,IAAI,EAAA;AACRX,IAAAA,SAAS,EAAED,WAAY;AACvBG,IAAAA,IAAI,EAAC,OAAO;AACZ6B,IAAAA,IAAI,eAAEJ,gBAAA,CAAAC,aAAA,CAACI,aAAM,EAAA;MAACC,GAAG,EAAEhB,KAAK,CAACf,IAAI;AAAE,KAAE,CAAE;AACnCgC,IAAAA,OAAO,EAAE/B,WAAY;AACrBgC,IAAAA,QAAQ,EAAEzB,eAAgB;AAC1B0B,IAAAA,KAAK,EAAEnC,QAAQ,GAAG,UAAU,GAAG,SAAU;AACzCG,IAAAA,IAAI,EAAEA,IAAI,IAAIsB,WAAW,CAACxB,IAAI,CAAE;AAChCmC,IAAAA,IAAI,EAAC,QAAQ;AACbC,IAAAA,SAAS,EAAEhC;AAAc,GAAA,CACzB,CACE,CAAC;AAEP;;;;"}
+{"version":3,"file":"MrlPaginationButton.js","sources":["../../../../../src/components/pagination/MrlPaginationButton/MrlPaginationButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport {\n\tMrlIconButton,\n\tMrlSvg,\n\tMrlTooltipAnchor,\n\tMrlTooltipDefaults,\n\tMrlTooltipPosition\n} from '../..';\nimport { PaginationButtonType } from '../constants';\nimport {\n\tchevronGoToFirst,\n\tchevronGoToLast,\n\tchevronLeft,\n\tchevronRight\n} from '@muraldevkit/ds-icons';\n\nimport styles from '../MrlPagination/MrlPagination.module.scss';\n\ninterface MrlPaginationButtonProps {\n\t/** Additional class to add to the button element */\n\tbuttonClass?: string;\n\t/** Additional class to add to the container element */\n\tclassName?: string;\n\tdisabled?: boolean;\n\t/** The type of pagination item  */\n\tkind: PaginationButtonType;\n\t/**\n\t * Click event for the button.\n\t */\n\thandleClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n\t/** Pagination heading */\n\ttext?: string;\n\t/** The anchor of the tooltips on the buttons */\n\ttooltipAnchor?: MrlTooltipAnchor;\n\t/** The placement of the tooltips on the buttons */\n\ttooltipPosition?: MrlTooltipPosition;\n}\n\n/**\n * Pagination button component\n * @param {MrlPaginationButtonProps} props - the component props\n * @returns a pagintaion button\n */\nexport function MrlPaginationButton({\n\tbuttonClass,\n\tclassName,\n\tdisabled,\n\tkind,\n\thandleClick,\n\ttext,\n\ttooltipAnchor = MrlTooltipDefaults.anchor,\n\ttooltipPosition = 'top',\n\t...rest\n}: MrlPaginationButtonProps): JSX.Element {\n\tconst itemClasses = classnames(styles['MrlPaginationItem'], className);\n\tconst icons = {\n\t\tfirst: chevronGoToFirst,\n\t\tlast: chevronGoToLast,\n\t\tnext: chevronRight,\n\t\tprevious: chevronLeft\n\t};\n\tconst defaultText = {\n\t\tfirst: 'Beginning',\n\t\tlast: 'End',\n\t\tnext: 'Next',\n\t\tprevious: 'Previous'\n\t};\n\n\treturn (\n\t\t<li className={itemClasses}>\n\t\t\t<MrlIconButton\n\t\t\t\t{...rest}\n\t\t\t\tclassName={buttonClass}\n\t\t\t\tkind=\"ghost\"\n\t\t\t\ticon={<MrlSvg svg={icons[kind]} />}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tposition={tooltipPosition}\n\t\t\t\tstate={disabled ? 'disabled' : 'default'}\n\t\t\t\ttext={text || defaultText[kind]}\n\t\t\t\tsize=\"xsmall\"\n\t\t\t\ttipAnchor={tooltipAnchor}\n\t\t\t/>\n\t\t</li>\n\t);\n}\n"],"names":["MrlPaginationButton","_ref","buttonClass","className","disabled","kind","handleClick","text","_ref$tooltipAnchor","tooltipAnchor","MrlTooltipDefaults","anchor","_ref$tooltipPosition","tooltipPosition","rest","_objectWithoutProperties","_excluded","itemClasses","classnames","styles","icons","first","chevronGoToFirst","last","chevronGoToLast","next","chevronRight","previous","chevronLeft","defaultText","React","createElement","MrlIconButton","_extends","icon","MrlSvg","svg","onClick","position","state","size","tipAnchor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA;AACA;AACA;AACA;AACA;AACO,SAASA,mBAAmBA,CAAAC,IAAA,EAUO;AAAA,EAAA,IATzCC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IACXC,SAAS,GAAAF,IAAA,CAATE,SAAS;IACTC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IACJC,WAAW,GAAAL,IAAA,CAAXK,WAAW;IACXC,IAAI,GAAAN,IAAA,CAAJM,IAAI;IAAAC,kBAAA,GAAAP,IAAA,CACJQ,aAAa;AAAbA,IAAAA,aAAa,GAAAD,kBAAA,KAAA,MAAA,GAAGE,4BAAkB,CAACC,MAAM,GAAAH,kBAAA;IAAAI,oBAAA,GAAAX,IAAA,CACzCY,eAAe;AAAfA,IAAAA,eAAe,GAAAD,oBAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,oBAAA;AACpBE,IAAAA,IAAI,GAAAC,iDAAA,CAAAd,IAAA,EAAAe,SAAA,CAAA;EAEP,IAAMC,WAAW,GAAGC,2BAAU,CAACC,4BAAM,CAAC,mBAAmB,CAAC,EAAEhB,SAAS,CAAC;AACtE,EAAA,IAAMiB,KAAK,GAAG;AACbC,IAAAA,KAAK,EAAEC,wBAAgB;AACvBC,IAAAA,IAAI,EAAEC,uBAAe;AACrBC,IAAAA,IAAI,EAAEC,oBAAY;AAClBC,IAAAA,QAAQ,EAAEC;GACV;AACD,EAAA,IAAMC,WAAW,GAAG;AACnBR,IAAAA,KAAK,EAAE,WAAW;AAClBE,IAAAA,IAAI,EAAE,KAAK;AACXE,IAAAA,IAAI,EAAE,MAAM;AACZE,IAAAA,QAAQ,EAAE;GACV;EAED,oBACCG,gBAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;AAAI5B,IAAAA,SAAS,EAAEc;GAAY,eAC1Ba,gBAAA,CAAAC,aAAA,CAACC,2BAAa,EAAAC,iCAAA,KACTnB,IAAI,EAAA;AACRX,IAAAA,SAAS,EAAED,WAAY;AACvBG,IAAAA,IAAI,EAAC,OAAO;AACZ6B,IAAAA,IAAI,eAAEJ,gBAAA,CAAAC,aAAA,CAACI,aAAM,EAAA;MAACC,GAAG,EAAEhB,KAAK,CAACf,IAAI;AAAE,KAAE,CAAE;AACnCgC,IAAAA,OAAO,EAAE/B,WAAY;AACrBgC,IAAAA,QAAQ,EAAEzB,eAAgB;AAC1B0B,IAAAA,KAAK,EAAEnC,QAAQ,GAAG,UAAU,GAAG,SAAU;AACzCG,IAAAA,IAAI,EAAEA,IAAI,IAAIsB,WAAW,CAACxB,IAAI,CAAE;AAChCmC,IAAAA,IAAI,EAAC,QAAQ;AACbC,IAAAA,SAAS,EAAEhC;AAAc,GAAA,CACzB,CACE,CAAC;AAEP;;;;"}

package/dist/cjs/components/pagination/MrlPaginationText/MrlPaginationText.js

@@ -6,7 +6,10 @@ var React = require('react');
 var MrlPagination_module = require('../MrlPagination/MrlPagination.module.scss.js');
 var MrlLiveRegion = require('../../live-region/MrlLiveRegion/MrlLiveRegion.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -23,7 +26,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 var _excluded = ["className", "isEstimate", "rangeStart", "rangeEnd", "textClass", "total"];
 /**
@@ -39,8 +43,8 @@ function MrlPaginationText(_ref) {
     textClass = _ref.textClass,
     total = _ref.total,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var itemClasses = classnames(MrlPagination_module.default['MrlPaginationItem'], className);
-  var textClasses = classnames(MrlPagination_module.default['MrlPaginationText'], textClass);
+  var itemClasses = classnames__default.default(MrlPagination_module.default['MrlPaginationItem'], className);
+  var textClasses = classnames__default.default(MrlPagination_module.default['MrlPaginationText'], textClass);
   var _Intl$NumberFormat = Intl.NumberFormat(),
     format = _Intl$NumberFormat.format;
   var totalText = isEstimate ? "".concat(format(total), "+") : format(total);