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

package/dist/esm/components/tabs/MrlTabGroup/MrlTabGroup.js

@@ -0,0 +1,180 @@
+import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as React from 'react';
+import classnames from 'classnames';
+import { chevronLeft, chevronRight } from '@muraldevkit/ds-icons';
+import styles from './MrlTabGroup.module.scss.js';
+import { MrlIconButton } from '../../button/MrlIconButton/MrlIconButton.js';
+import { MrlSvg } from '../../svg/MrlSvg/MrlSvg.js';
+import { preventDefault } from '../../../utils/preventDefault/preventDefault.js';
+
+var _excluded = ["children", "className", "disablePageControls", "label"];
+var MrlTabGroup = /*#__PURE__*/React.memo(function (_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    disablePageControls = _ref.disablePageControls,
+    label = _ref.label,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _React$useState = React.useState(0),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    page = _React$useState2[0],
+    setPage = _React$useState2[1];
+  // We need `pageCount` in the state so when the component is mounted
+  // the values of `isFirstPage` and `isLastPage` are correctly calculated.
+  var _React$useState3 = React.useState(0),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    pageCount = _React$useState4[0],
+    setPageCount = _React$useState4[1];
+  var tabGroup = React.useRef(null);
+  var prevButtonContainer = React.useRef(null);
+  var nextButtonContainer = React.useRef(null);
+  var _React$useState5 = React.useState([]),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    tabButtons = _React$useState6[0],
+    setTabButtons = _React$useState6[1];
+  var prevPage = React.useCallback(function () {
+    setPage(page - 1);
+  }, [page]);
+  var nextPage = React.useCallback(function () {
+    setPage(page + 1);
+  }, [page]);
+
+  // **************************
+  // Keyboard Navigation
+  // **************************
+
+  var handleKeyUp = function handleKeyUp(e) {
+    var actions = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End'];
+    if (actions.includes(e.key)) {
+      preventDefault(e);
+    }
+  };
+
+  /**
+   * Focus management when someone is using a keyboard to navigate the menu
+   * @param e - keyboard event
+   */
+  var handleKeyDown = function handleKeyDown(e) {
+    var _tabButtons$nextIndex, _tabButtons$nextIndex2, _tabButtons$nextIndex3, _tabButtons$nextIndex4, _tabButtons$, _tabButtons$2, _tabButtons$lastTab, _tabButtons$lastTab2;
+    var currentIndex = tabButtons.findIndex(function (item) {
+      return document.activeElement === item;
+    });
+    var nextIndex;
+    var lastTab = tabButtons.length - 1;
+    switch (e.key) {
+      case 'ArrowDown':
+      case 'ArrowRight':
+        preventDefault(e);
+        nextIndex = currentIndex < tabButtons.length - 1 ? currentIndex + 1 : currentIndex;
+        (_tabButtons$nextIndex = tabButtons[nextIndex]) === null || _tabButtons$nextIndex === void 0 ? void 0 : _tabButtons$nextIndex.focus();
+        (_tabButtons$nextIndex2 = tabButtons[nextIndex]) === null || _tabButtons$nextIndex2 === void 0 ? void 0 : _tabButtons$nextIndex2.click();
+        break;
+      case 'ArrowUp':
+      case 'ArrowLeft':
+        preventDefault(e);
+        nextIndex = currentIndex > 0 ? currentIndex - 1 : 0;
+        (_tabButtons$nextIndex3 = tabButtons[nextIndex]) === null || _tabButtons$nextIndex3 === void 0 ? void 0 : _tabButtons$nextIndex3.focus();
+        (_tabButtons$nextIndex4 = tabButtons[nextIndex]) === null || _tabButtons$nextIndex4 === void 0 ? void 0 : _tabButtons$nextIndex4.click();
+        break;
+      case 'Home':
+        preventDefault(e);
+        (_tabButtons$ = tabButtons[0]) === null || _tabButtons$ === void 0 ? void 0 : _tabButtons$.focus();
+        (_tabButtons$2 = tabButtons[0]) === null || _tabButtons$2 === void 0 ? void 0 : _tabButtons$2.click();
+        break;
+      case 'End':
+        preventDefault(e);
+        (_tabButtons$lastTab = tabButtons[lastTab]) === null || _tabButtons$lastTab === void 0 ? void 0 : _tabButtons$lastTab.focus();
+        (_tabButtons$lastTab2 = tabButtons[lastTab]) === null || _tabButtons$lastTab2 === void 0 ? void 0 : _tabButtons$lastTab2.click();
+        break;
+    }
+  };
+  React.useEffect(function () {
+    var _tabGroup$current;
+    var foundMenuItems = Array.from(((_tabGroup$current = tabGroup.current) === null || _tabGroup$current === void 0 ? void 0 : _tabGroup$current.querySelectorAll('[role="tab"]')) || []);
+    setTabButtons(foundMenuItems);
+  }, [prevPage, nextPage]);
+
+  // **************************
+  // End Keyboard Navigation
+  // **************************
+
+  React.useEffect(function () {
+    if (!tabGroup.current || tabGroup.current.offsetWidth === 0) {
+      return;
+    }
+    var totalPages = Math.ceil(tabGroup.current.scrollWidth / tabGroup.current.offsetWidth);
+    setPageCount(totalPages);
+  }, [tabGroup]);
+  var previousButton = /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles['MrlTabGroup-nav'], " ").concat(styles['MrlTabGroup-prev']),
+    ref: prevButtonContainer
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles['MrlTabGroup-fade'], " ").concat(styles['MrlTabGroup-fadePrev'])
+  }), /*#__PURE__*/React.createElement(MrlIconButton, {
+    className: styles['MrlTabGroup-prevButton'],
+    icon: /*#__PURE__*/React.createElement(MrlSvg, {
+      svg: chevronLeft
+    }),
+    onClick: prevPage,
+    "data-qa": "previous-categories-button",
+    kind: "ghost",
+    position: "right",
+    size: "xsmall",
+    state: "default",
+    tabIndex: -1,
+    text: "Previous"
+  }));
+  var nextButton = /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles['MrlTabGroup-nav'], " ").concat(styles['MrlTabGroup-next']),
+    ref: nextButtonContainer
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles['MrlTabGroup-fade'], " ").concat(styles['MrlTabGroup-fadeNext'])
+  }), /*#__PURE__*/React.createElement(MrlIconButton, {
+    className: styles['MrlTabGroup-nextButton'],
+    icon: /*#__PURE__*/React.createElement(MrlSvg, {
+      svg: chevronRight
+    }),
+    onClick: nextPage,
+    "data-qa": "next-categories-button",
+    kind: "ghost",
+    position: "left",
+    state: "default",
+    size: "xsmall",
+    tabIndex: -1,
+    text: "Next"
+  }));
+  var isFirstPage = page === 0;
+  // If we don't have any pages yet (at rendering time for instance) don't show the arrow.
+  var isLastPage = pageCount === 0 || page === pageCount - 1;
+  var pxToTranslate = null;
+  var fadePx = 3.4375 * 16;
+
+  // Check if the component was mounted and has more than one page
+  if (tabGroup.current && pageCount !== 1) {
+    var pxPerPage = -tabGroup.current.offsetWidth * page;
+    var fadeOffset = isFirstPage || isLastPage ? fadePx : fadePx * 2;
+    var pxRemainingInContainer = tabGroup.current.offsetWidth - tabGroup.current.scrollWidth - fadeOffset;
+    pxToTranslate = Math.max(pxPerPage, pxRemainingInContainer);
+  }
+  var containerClass = classnames(className, 'mrl-tab-group', styles.MrlTabGroup);
+
+  // We do not need the tablist to be focusable, as the contents within it are
+  /* eslint-disable jsx-a11y/interactive-supports-focus */
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
+    className: styles['MrlTabGroup-container']
+  }), !disablePageControls && !isFirstPage && previousButton, /*#__PURE__*/React.createElement("div", {
+    "aria-label": label ? label : undefined,
+    className: containerClass,
+    onKeyUp: handleKeyUp,
+    onKeyDown: handleKeyDown,
+    ref: tabGroup,
+    role: "tablist",
+    style: pxToTranslate ? {
+      transform: "translateX(".concat(pxToTranslate / 16, "rem)")
+    } : undefined
+  }, children), !disablePageControls && !isLastPage && nextButton);
+  /* eslint-enable jsx-a11y/interactive-supports-focus */
+});
+MrlTabGroup.displayName = 'MrlTabGroup';
+
+export { MrlTabGroup };
+//# sourceMappingURL=MrlTabGroup.js.map

package/dist/esm/components/tabs/MrlTabGroup/MrlTabGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTabGroup.js","sources":["../../../../../src/components/tabs/MrlTabGroup/MrlTabGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { chevronLeft, chevronRight } from '@muraldevkit/ds-icons';\nimport { MrlIconButton, MrlSvg } from '../../';\nimport { TabActionType } from '../constants';\nimport { preventDefault } from '../../../utils';\n\nimport styles from './MrlTabGroup.module.scss';\n\nexport interface MrlTabGroupPropTypes {\n\tchildren: React.ReactNode;\n\t/** Class to be applied to the container element of the MrlTabGroup */\n\tclassName?: string;\n\tdisablePageControls?: boolean;\n\t/** A hidden label for the tab group for accessiblity purposes */\n\tlabel?: string;\n}\n\nexport const MrlTabGroup: React.FC<MrlTabGroupPropTypes> = React.memo(\n\t({ children, className, disablePageControls, label, ...rest }: MrlTabGroupPropTypes) => {\n\t\tconst [page, setPage] = React.useState(0);\n\t\t// We need `pageCount` in the state so when the component is mounted\n\t\t// the values of `isFirstPage` and `isLastPage` are correctly calculated.\n\t\tconst [pageCount, setPageCount] = React.useState(0);\n\n\t\tconst tabGroup = React.useRef<HTMLDivElement>(null);\n\t\tconst prevButtonContainer = React.useRef<HTMLDivElement>(null);\n\t\tconst nextButtonContainer = React.useRef<HTMLDivElement>(null);\n\t\tconst [tabButtons, setTabButtons] = React.useState<HTMLButtonElement[]>([]);\n\n\t\tconst prevPage = React.useCallback(() => {\n\t\t\tsetPage(page - 1);\n\t\t}, [page]);\n\n\t\tconst nextPage = React.useCallback(() => {\n\t\t\tsetPage(page + 1);\n\t\t}, [page]);\n\n\t\t// **************************\n\t\t// Keyboard Navigation\n\t\t// **************************\n\n\t\tconst handleKeyUp = (e: React.KeyboardEvent) => {\n\t\t\tconst actions: TabActionType[] = [\n\t\t\t\t'ArrowUp',\n\t\t\t\t'ArrowDown',\n\t\t\t\t'ArrowLeft',\n\t\t\t\t'ArrowRight',\n\t\t\t\t'Home',\n\t\t\t\t'End'\n\t\t\t];\n\n\t\t\tif (actions.includes(e.key as TabActionType)) {\n\t\t\t\tpreventDefault(e);\n\t\t\t}\n\t\t};\n\n\t\t/**\n\t\t * Focus management when someone is using a keyboard to navigate the menu\n\t\t * @param e - keyboard event\n\t\t */\n\t\tconst handleKeyDown = (e: React.KeyboardEvent) => {\n\t\t\tconst currentIndex = tabButtons.findIndex((item) => document.activeElement === item);\n\t\t\tlet nextIndex: number;\n\t\t\tconst lastTab = tabButtons.length - 1;\n\n\t\t\tswitch (e.key) {\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\tcase 'ArrowRight':\n\t\t\t\t\tpreventDefault(e);\n\t\t\t\t\tnextIndex = currentIndex < tabButtons.length - 1 ? currentIndex + 1 : currentIndex;\n\t\t\t\t\ttabButtons[nextIndex]?.focus();\n\t\t\t\t\ttabButtons[nextIndex]?.click();\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\tcase 'ArrowLeft':\n\t\t\t\t\tpreventDefault(e);\n\t\t\t\t\tnextIndex = currentIndex > 0 ? currentIndex - 1 : 0;\n\t\t\t\t\ttabButtons[nextIndex]?.focus();\n\t\t\t\t\ttabButtons[nextIndex]?.click();\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'Home':\n\t\t\t\t\tpreventDefault(e);\n\t\t\t\t\ttabButtons[0]?.focus();\n\t\t\t\t\ttabButtons[0]?.click();\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'End':\n\t\t\t\t\tpreventDefault(e);\n\t\t\t\t\ttabButtons[lastTab]?.focus();\n\t\t\t\t\ttabButtons[lastTab]?.click();\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t};\n\n\t\tReact.useEffect(() => {\n\t\t\tconst foundMenuItems = Array.from(\n\t\t\t\ttabGroup.current?.querySelectorAll('[role=\"tab\"]') || []\n\t\t\t) as HTMLButtonElement[];\n\n\t\t\tsetTabButtons(foundMenuItems);\n\t\t}, [prevPage, nextPage]);\n\n\t\t// **************************\n\t\t// End Keyboard Navigation\n\t\t// **************************\n\n\t\tReact.useEffect(() => {\n\t\t\tif (!tabGroup.current || tabGroup.current.offsetWidth === 0) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst totalPages = Math.ceil(tabGroup.current.scrollWidth / tabGroup.current.offsetWidth);\n\n\t\t\tsetPageCount(totalPages);\n\t\t}, [tabGroup]);\n\n\t\tconst previousButton = (\n\t\t\t<div\n\t\t\t\tclassName={`${styles['MrlTabGroup-nav']} ${styles['MrlTabGroup-prev']}`}\n\t\t\t\tref={prevButtonContainer}\n\t\t\t>\n\t\t\t\t<div className={`${styles['MrlTabGroup-fade']} ${styles['MrlTabGroup-fadePrev']}`} />\n\t\t\t\t<MrlIconButton\n\t\t\t\t\tclassName={styles['MrlTabGroup-prevButton']}\n\t\t\t\t\ticon={<MrlSvg svg={chevronLeft} />}\n\t\t\t\t\tonClick={prevPage}\n\t\t\t\t\tdata-qa=\"previous-categories-button\"\n\t\t\t\t\tkind=\"ghost\"\n\t\t\t\t\tposition=\"right\"\n\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\tstate=\"default\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\ttext=\"Previous\"\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\n\t\tconst nextButton = (\n\t\t\t<div\n\t\t\t\tclassName={`${styles['MrlTabGroup-nav']} ${styles['MrlTabGroup-next']}`}\n\t\t\t\tref={nextButtonContainer}\n\t\t\t>\n\t\t\t\t<div className={`${styles['MrlTabGroup-fade']} ${styles['MrlTabGroup-fadeNext']}`} />\n\t\t\t\t<MrlIconButton\n\t\t\t\t\tclassName={styles['MrlTabGroup-nextButton']}\n\t\t\t\t\ticon={<MrlSvg svg={chevronRight} />}\n\t\t\t\t\tonClick={nextPage}\n\t\t\t\t\tdata-qa=\"next-categories-button\"\n\t\t\t\t\tkind=\"ghost\"\n\t\t\t\t\tposition=\"left\"\n\t\t\t\t\tstate=\"default\"\n\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\ttext=\"Next\"\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\n\t\tconst isFirstPage = page === 0;\n\t\t// If we don't have any pages yet (at rendering time for instance) don't show the arrow.\n\t\tconst isLastPage = pageCount === 0 || page === pageCount - 1;\n\n\t\tlet pxToTranslate: number | null = null;\n\t\tconst fadePx = 3.4375 * 16;\n\n\t\t// Check if the component was mounted and has more than one page\n\t\tif (tabGroup.current && pageCount !== 1) {\n\t\t\tconst pxPerPage = -tabGroup.current.offsetWidth * page;\n\t\t\tconst fadeOffset = isFirstPage || isLastPage ? fadePx : fadePx * 2;\n\t\t\tconst pxRemainingInContainer =\n\t\t\t\ttabGroup.current.offsetWidth - tabGroup.current.scrollWidth - fadeOffset;\n\n\t\t\tpxToTranslate = Math.max(pxPerPage, pxRemainingInContainer);\n\t\t}\n\n\t\tconst containerClass = classnames(className, 'mrl-tab-group', styles.MrlTabGroup);\n\n\t\t// We do not need the tablist to be focusable, as the contents within it are\n\t\t/* eslint-disable jsx-a11y/interactive-supports-focus */\n\t\treturn (\n\t\t\t<div {...rest} className={styles['MrlTabGroup-container']}>\n\t\t\t\t{!disablePageControls && !isFirstPage && previousButton}\n\t\t\t\t<div\n\t\t\t\t\taria-label={label ? label : undefined}\n\t\t\t\t\tclassName={containerClass}\n\t\t\t\t\tonKeyUp={handleKeyUp}\n\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\tref={tabGroup}\n\t\t\t\t\trole=\"tablist\"\n\t\t\t\t\tstyle={pxToTranslate ? { transform: `translateX(${pxToTranslate / 16}rem)` } : undefined}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t\t{!disablePageControls && !isLastPage && nextButton}\n\t\t\t</div>\n\t\t);\n\t\t/* eslint-enable jsx-a11y/interactive-supports-focus */\n\t}\n);\n\nMrlTabGroup.displayName = 'MrlTabGroup';\n"],"names":["MrlTabGroup","React","memo","_ref","children","className","disablePageControls","label","rest","_objectWithoutProperties","_excluded","_React$useState","useState","_React$useState2","_slicedToArray","page","setPage","_React$useState3","_React$useState4","pageCount","setPageCount","tabGroup","useRef","prevButtonContainer","nextButtonContainer","_React$useState5","_React$useState6","tabButtons","setTabButtons","prevPage","useCallback","nextPage","handleKeyUp","e","actions","includes","key","preventDefault","handleKeyDown","_tabButtons$nextIndex","_tabButtons$nextIndex2","_tabButtons$nextIndex3","_tabButtons$nextIndex4","_tabButtons$","_tabButtons$2","_tabButtons$lastTab","_tabButtons$lastTab2","currentIndex","findIndex","item","document","activeElement","nextIndex","lastTab","length","focus","click","useEffect","_tabGroup$current","foundMenuItems","Array","from","current","querySelectorAll","offsetWidth","totalPages","Math","ceil","scrollWidth","previousButton","createElement","concat","styles","ref","MrlIconButton","icon","MrlSvg","svg","chevronLeft","onClick","kind","position","size","state","tabIndex","text","nextButton","chevronRight","isFirstPage","isLastPage","pxToTranslate","fadePx","pxPerPage","fadeOffset","pxRemainingInContainer","max","containerClass","classnames","_extends","undefined","onKeyUp","onKeyDown","role","style","transform","displayName"],"mappings":"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"}

package/dist/esm/components/tabs/MrlTabGroup/MrlTabGroup.module.scss.js

@@ -0,0 +1,4 @@
+var styles = {"MrlTabGroup-container":"MrlTabGroup-container--BeqbP","MrlTabGroup":"MrlTabGroup--RZrXc","MrlTabGroup-fade":"MrlTabGroup-fade--X9Xlh","MrlTabGroup-fadeNext":"MrlTabGroup-fadeNext--r9cuS","MrlTabGroup-fadePrev":"MrlTabGroup-fadePrev--eorIU","MrlTabGroup-nav":"MrlTabGroup-nav--dDS_a","MrlTabGroup-next":"MrlTabGroup-next--I8q2G","MrlTabGroup-prev":"MrlTabGroup-prev--wEM7T"};
+
+export { styles as default };
+//# sourceMappingURL=MrlTabGroup.module.scss.js.map

package/dist/esm/components/tabs/MrlTabGroup/MrlTabGroup.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTabGroup.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/tabs/MrlTabLink/MrlTabLink.js

@@ -0,0 +1,58 @@
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as React from 'react';
+import classnames from 'classnames';
+import { NavLink } from 'react-router-dom';
+import styles from '../MrlTab/MrlTab.module.scss.js';
+import { useMrlTabContext } from '../MrlTabs/MrlTabs.js';
+
+var _excluded = ["className", "children", "icon", "id", "hookClick", "text", "to"];
+/**
+ * Renders a tab component
+ *
+ * @param {MrlTabLinkProps} props the props for your MrlTabLink
+ * @returns {React.ReactElement} an a element containing the text you pass
+ */
+var MrlTabLink = function MrlTabLink(_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    icon = _ref.icon,
+    id = _ref.id,
+    hookClick = _ref.hookClick,
+    text = _ref.text,
+    to = _ref.to,
+    remainingProps = _objectWithoutProperties(_ref, _excluded);
+  var _useMrlTabContext = useMrlTabContext(),
+    activeTab = _useMrlTabContext.activeTab,
+    setActiveTab = _useMrlTabContext.setActiveTab;
+  var active = activeTab === id;
+  var buttonClasses = classnames(className, 'mrl-tab', _defineProperty(_defineProperty({}, styles['MrlTab'], true), styles['MrlTab-selected'], active));
+  var textClasses = classnames('mrl-tab--text', _defineProperty({}, styles['MrlTab-Text'], true));
+  var handleClick = function handleClick(id) {
+    if (hookClick) {
+      hookClick();
+    }
+    setActiveTab(id);
+  };
+  return /*#__PURE__*/React.createElement(NavLink, _extends({
+    "aria-selected": active,
+    className: buttonClasses,
+    "data-qa": "".concat(id, "-tab"),
+    "data-roving": "true",
+    id: id,
+    onClick: function onClick() {
+      return handleClick(id);
+    },
+    role: "tab",
+    tabIndex: active ? 0 : -1,
+    to: to
+  }, remainingProps), !!icon && /*#__PURE__*/React.createElement("span", {
+    className: styles['MrlTab-icon']
+  }, icon), !!text && /*#__PURE__*/React.createElement("span", {
+    className: textClasses
+  }, text), !!children && /*#__PURE__*/React.createElement("span", {
+    className: textClasses
+  }, children));
+};
+
+export { MrlTabLink };
+//# sourceMappingURL=MrlTabLink.js.map

package/dist/esm/components/tabs/MrlTabLink/MrlTabLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTabLink.js","sources":["../../../../../src/components/tabs/MrlTabLink/MrlTabLink.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { NavLink, NavLinkProps } from 'react-router-dom';\nimport { useMrlTabContext } from '../../..';\n\n/** MrlTab and MrlTabLink share styles as they should look identical */\nimport styles from '../MrlTab/MrlTab.module.scss';\n\nexport interface MrlTabLinkProps extends NavLinkProps {\n\t/** Class to be applied to the NavLink element of the MrlTabLink */\n\tclassName?: string;\n\t/** Children to be rendered within the text component */\n\tchildren?: React.ReactNode;\n\ticon?: React.ReactElement;\n\t/**\n\t * The id that will be passed to the MrlTabContext to set the active state.\n\t * NOTE: This must match the `tabId` set on `MrlTabContent`!\n\t */\n\tid: string;\n\t/** An addition function to call when clicking on a tab */\n\thookClick?: () => void;\n\t/**\n\t * Textual content when it's a static string; if you have nested elements,\n\t * use children to provide content\n\t */\n\ttext?: string;\n}\n\n/**\n * Renders a tab component\n *\n * @param {MrlTabLinkProps} props the props for your MrlTabLink\n * @returns {React.ReactElement} an a element containing the text you pass\n */\nexport const MrlTabLink = ({\n\tclassName,\n\tchildren,\n\ticon,\n\tid,\n\thookClick,\n\ttext,\n\tto,\n\t...remainingProps\n}: MrlTabLinkProps): React.ReactElement => {\n\tconst { activeTab, setActiveTab } = useMrlTabContext();\n\tconst active = activeTab === id;\n\tconst buttonClasses = classnames(className, 'mrl-tab', {\n\t\t[styles['MrlTab']]: true,\n\t\t[styles['MrlTab-selected']]: active\n\t});\n\n\tconst textClasses = classnames('mrl-tab--text', {\n\t\t[styles['MrlTab-Text']]: true\n\t});\n\n\tconst handleClick = (id: string) => {\n\t\tif (hookClick) {\n\t\t\thookClick();\n\t\t}\n\n\t\tsetActiveTab(id);\n\t};\n\n\treturn (\n\t\t<NavLink\n\t\t\taria-selected={active}\n\t\t\tclassName={buttonClasses}\n\t\t\tdata-qa={`${id}-tab`}\n\t\t\tdata-roving=\"true\"\n\t\t\tid={id}\n\t\t\tonClick={() => handleClick(id)}\n\t\t\trole=\"tab\"\n\t\t\ttabIndex={active ? 0 : -1}\n\t\t\tto={to}\n\t\t\t{...remainingProps}\n\t\t>\n\t\t\t{!!icon && <span className={styles['MrlTab-icon']}>{icon}</span>}\n\t\t\t{!!text && <span className={textClasses}>{text}</span>}\n\t\t\t{!!children && <span className={textClasses}>{children}</span>}\n\t\t</NavLink>\n\t);\n};\n"],"names":["MrlTabLink","_ref","className","children","icon","id","hookClick","text","to","remainingProps","_objectWithoutProperties","_excluded","_useMrlTabContext","useMrlTabContext","activeTab","setActiveTab","active","buttonClasses","classnames","_defineProperty","styles","textClasses","handleClick","React","createElement","NavLink","_extends","concat","onClick","role","tabIndex"],"mappings":";;;;;;;;AA4BA;AACA;AACA;AACA;AACA;AACA;IACaA,UAAU,GAAG,SAAbA,UAAUA,CAAAC,IAAA,EASoB;AAAA,EAAA,IAR1CC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACJC,EAAE,GAAAJ,IAAA,CAAFI,EAAE;IACFC,SAAS,GAAAL,IAAA,CAATK,SAAS;IACTC,IAAI,GAAAN,IAAA,CAAJM,IAAI;IACJC,EAAE,GAAAP,IAAA,CAAFO,EAAE;AACCC,IAAAA,cAAc,GAAAC,wBAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA;AAEjB,EAAA,IAAAC,iBAAA,GAAoCC,gBAAgB,EAAE;IAA9CC,SAAS,GAAAF,iBAAA,CAATE,SAAS;IAAEC,YAAY,GAAAH,iBAAA,CAAZG,YAAY;AAC/B,EAAA,IAAMC,MAAM,GAAGF,SAAS,KAAKT,EAAE;EAC/B,IAAMY,aAAa,GAAGC,UAAU,CAAChB,SAAS,EAAE,SAAS,EAAAiB,eAAA,CAAAA,eAAA,CAAA,EAAA,EACnDC,MAAM,CAAC,QAAQ,CAAC,EAAG,IAAI,CAAA,EACvBA,MAAM,CAAC,iBAAiB,CAAC,EAAGJ,MAAM,CACnC,CAAC;AAEF,EAAA,IAAMK,WAAW,GAAGH,UAAU,CAAC,eAAe,EAAAC,eAAA,CAAA,EAAA,EAC5CC,MAAM,CAAC,aAAa,CAAC,EAAG,IAAI,CAC7B,CAAC;AAEF,EAAA,IAAME,WAAW,GAAG,SAAdA,WAAWA,CAAIjB,EAAU,EAAK;AACnC,IAAA,IAAIC,SAAS,EAAE;AACdA,MAAAA,SAAS,EAAE;AACZ,IAAA;IAEAS,YAAY,CAACV,EAAE,CAAC;EACjB,CAAC;AAED,EAAA,oBACCkB,KAAA,CAAAC,aAAA,CAACC,OAAO,EAAAC,QAAA,CAAA;AACP,IAAA,eAAA,EAAeV,MAAO;AACtBd,IAAAA,SAAS,EAAEe,aAAc;IACzB,SAAA,EAAA,EAAA,CAAAU,MAAA,CAAYtB,EAAE,EAAA,MAAA,CAAO;AACrB,IAAA,aAAA,EAAY,MAAM;AAClBA,IAAAA,EAAE,EAAEA,EAAG;IACPuB,OAAO,EAAE,SAATA,OAAOA,GAAA;MAAA,OAAQN,WAAW,CAACjB,EAAE,CAAC;IAAA,CAAC;AAC/BwB,IAAAA,IAAI,EAAC,KAAK;AACVC,IAAAA,QAAQ,EAAEd,MAAM,GAAG,CAAC,GAAG,EAAG;AAC1BR,IAAAA,EAAE,EAAEA;GAAG,EACHC,cAAc,GAEjB,CAAC,CAACL,IAAI,iBAAImB,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IAAMtB,SAAS,EAAEkB,MAAM,CAAC,aAAa;GAAE,EAAEhB,IAAW,CAAC,EAC/D,CAAC,CAACG,IAAI,iBAAIgB,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMtB,IAAAA,SAAS,EAAEmB;GAAY,EAAEd,IAAW,CAAC,EACrD,CAAC,CAACJ,QAAQ,iBAAIoB,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMtB,IAAAA,SAAS,EAAEmB;GAAY,EAAElB,QAAe,CACrD,CAAC;AAEZ;;;;"}

package/dist/esm/components/tabs/MrlTabs/MrlTabs.js

@@ -0,0 +1,61 @@
+import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as React from 'react';
+import classnames from 'classnames';
+import { MrlTabContext } from '../../../contexts/MrlTabContext/MrlTabContext.js';
+
+var _excluded = ["capitalizeTabTitles", "children", "className", "selectedTab", "size", "spaceTabsEvenly"];
+var MrlTabs = /*#__PURE__*/React.memo(function (_ref) {
+  var capitalizeTabTitles = _ref.capitalizeTabTitles,
+    children = _ref.children,
+    className = _ref.className,
+    selectedTab = _ref.selectedTab,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'small' : _ref$size,
+    spaceTabsEvenly = _ref.spaceTabsEvenly,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _React$useState = React.useState(''),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    activeTab = _React$useState2[0],
+    setActiveTab = _React$useState2[1];
+  var tabsRef = React.useRef(null);
+  React.useEffect(function () {
+    var _tabsRef$current;
+    var foundTabs = Array.from(((_tabsRef$current = tabsRef.current) === null || _tabsRef$current === void 0 ? void 0 : _tabsRef$current.querySelectorAll('[role="tab"]')) || []);
+    var tabIds = foundTabs.map(function (tab) {
+      return tab.id;
+    });
+    var selectedTabValid = selectedTab && tabIds.indexOf(selectedTab);
+
+    // If we have a valid `selectedTab` - use it
+    // Otherwise, set the first tab to active.
+    setActiveTab(selectedTabValid ? selectedTab : tabIds[0]);
+  }, [selectedTab]);
+  var containerClass = classnames(className, 'mrl-tabs', _defineProperty(_defineProperty(_defineProperty({}, "MrlTabs-".concat(size), size !== 'small'), 'MrlTabs-caps', capitalizeTabTitles), 'MrlTabs-evenSpacing', spaceTabsEvenly));
+  return /*#__PURE__*/React.createElement(MrlTabContext.Provider, {
+    value: {
+      activeTab: activeTab,
+      setActiveTab: setActiveTab
+    }
+  }, /*#__PURE__*/React.createElement("div", _extends({
+    className: containerClass
+  }, rest, {
+    ref: tabsRef
+  }), children));
+});
+MrlTabs.displayName = 'MrlTabs';
+
+/**
+ * Tab context to prevent us from having to do any prop drilling.
+ *
+ * @returns {MrlTabContextProps} the context of the tabs
+ */
+function useMrlTabContext() {
+  var context = React.useContext(MrlTabContext);
+  if (context === undefined) {
+    throw new Error('useMrlTabContext must be used within a MrlTabProvider');
+  }
+  return context;
+}
+
+export { MrlTabs, useMrlTabContext };
+//# sourceMappingURL=MrlTabs.js.map

package/dist/esm/components/tabs/MrlTabs/MrlTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTabs.js","sources":["../../../../../src/components/tabs/MrlTabs/MrlTabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { MrlTabContext, MrlTabContextProps } from '../../../';\n\nexport type MrlTabSize = 'small' | 'large';\n\nexport interface MrlTabsPropTypes {\n\t/** Sets the tabs to be styled with capital case */\n\tcapitalizeTabTitles?: boolean;\n\tchildren: React.ReactNode;\n\t/** Class to be applied to the container element of the MrlTabs */\n\tclassName?: string;\n\t/** Sets the default active tab by id */\n\tselectedTab?: string;\n\tsize?: MrlTabSize;\n\tspaceTabsEvenly?: boolean;\n}\n\nexport const MrlTabs: React.FC<MrlTabsPropTypes> = React.memo(\n\t({\n\t\tcapitalizeTabTitles,\n\t\tchildren,\n\t\tclassName,\n\t\tselectedTab,\n\t\tsize = 'small',\n\t\tspaceTabsEvenly,\n\t\t...rest\n\t}: MrlTabsPropTypes) => {\n\t\tconst [activeTab, setActiveTab] = React.useState<string>('');\n\t\tconst tabsRef = React.useRef<HTMLDivElement>(null);\n\n\t\tReact.useEffect(() => {\n\t\t\tconst foundTabs = Array.from(\n\t\t\t\ttabsRef.current?.querySelectorAll('[role=\"tab\"]') || []\n\t\t\t) as HTMLButtonElement[];\n\n\t\t\tconst tabIds = foundTabs.map((tab) => tab.id);\n\t\t\tconst selectedTabValid = selectedTab && tabIds.indexOf(selectedTab);\n\n\t\t\t// If we have a valid `selectedTab` - use it\n\t\t\t// Otherwise, set the first tab to active.\n\t\t\tsetActiveTab(selectedTabValid ? selectedTab : tabIds[0]);\n\t\t}, [selectedTab]);\n\n\t\tconst containerClass = classnames(className, 'mrl-tabs', {\n\t\t\t[`MrlTabs-${size}`]: size !== 'small',\n\t\t\t['MrlTabs-caps']: capitalizeTabTitles,\n\t\t\t['MrlTabs-evenSpacing']: spaceTabsEvenly\n\t\t});\n\n\t\treturn (\n\t\t\t<MrlTabContext.Provider value={{ activeTab, setActiveTab }}>\n\t\t\t\t<div className={containerClass} {...rest} ref={tabsRef}>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</MrlTabContext.Provider>\n\t\t);\n\t}\n);\n\nMrlTabs.displayName = 'MrlTabs';\n\n/**\n * Tab context to prevent us from having to do any prop drilling.\n *\n * @returns {MrlTabContextProps} the context of the tabs\n */\nexport function useMrlTabContext(): MrlTabContextProps {\n\tconst context = React.useContext(MrlTabContext);\n\tif (context === undefined) {\n\t\tthrow new Error('useMrlTabContext must be used within a MrlTabProvider');\n\t}\n\n\treturn context;\n}\n"],"names":["MrlTabs","React","memo","_ref","capitalizeTabTitles","children","className","selectedTab","_ref$size","size","spaceTabsEvenly","rest","_objectWithoutProperties","_excluded","_React$useState","useState","_React$useState2","_slicedToArray","activeTab","setActiveTab","tabsRef","useRef","useEffect","_tabsRef$current","foundTabs","Array","from","current","querySelectorAll","tabIds","map","tab","id","selectedTabValid","indexOf","containerClass","classnames","_defineProperty","concat","createElement","MrlTabContext","Provider","value","_extends","ref","displayName","useMrlTabContext","context","useContext","undefined","Error"],"mappings":"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"}

package/dist/esm/components/text/MrlText/MrlText.js

@@ -0,0 +1,47 @@
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as React from 'react';
+import classnames from 'classnames';
+import { textDefaults } from '../constants.js';
+import styles from './MrlText.module.scss.js';
+import { setAttributes } from '../../../utils/setAttributes/setAttributes.js';
+
+var _excluded = ["attrs", "size", "children", "className", "text", "data-qa"];
+/**
+ * MrlText Component
+ *
+ * @param {MrlTextProps} props - MrlText component props
+ * @returns a paragraph element
+ */
+function MrlText(props) {
+  var _props$attrs = props.attrs,
+    attrs = _props$attrs === void 0 ? {} : _props$attrs,
+    _props$size = props.size,
+    size = _props$size === void 0 ? textDefaults.size : _props$size,
+    children = props.children,
+    className = props.className,
+    text = props.text,
+    _props$dataQa = props['data-qa'],
+    dataQa = _props$dataQa === void 0 ? attrs['data-qa'] : _props$dataQa,
+    rest = _objectWithoutProperties(props, _excluded);
+  var attributes = setAttributes(attrs, textDefaults.attrs);
+  var allClasses = classnames(
+  // @deprecated
+  'mrl-text', 'MrlText', styles['MrlText'], _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles["MrlText--".concat(size)], size !== textDefaults.size), "MrlText--".concat(size), size !== textDefaults.size), attributes.className, typeof attributes.className !== 'undefined'), attributes["class"], typeof attributes["class"] !== 'undefined'), className);
+
+  // @deprecated
+  delete attributes["class"];
+  delete attributes.className;
+  if (text && text !== '') {
+    return /*#__PURE__*/React.createElement("p", _extends({}, attributes, rest, {
+      "data-qa": dataQa,
+      className: allClasses
+    }), text);
+  }
+  return /*#__PURE__*/React.createElement("p", _extends({}, attributes, rest, {
+    "data-qa": dataQa,
+    className: allClasses
+  }), children);
+}
+
+export { MrlText };
+//# sourceMappingURL=MrlText.js.map

package/dist/esm/components/text/MrlText/MrlText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlText.js","sources":["../../../../../src/components/text/MrlText/MrlText.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { AttrsObject, setAttributes } from '../../../utils';\nimport { textDefaults, TextSizes } from '../constants';\nimport { DataQa } from '../../../utils/dataQa';\nimport styles from './MrlText.module.scss';\n\ninterface MrlTextProps extends React.ComponentPropsWithoutRef<'p'>, DataQa {\n\t/**\n\t * Applies additional HTML attributes to the text element\n\t *\n\t * @deprecated - use the regular HTML attributes instead.\n\t */\n\tattrs?: AttrsObject;\n\t/** Children to be rendered within the text component */\n\tchildren?: React.ReactNode;\n\t/** Visual size of the text element */\n\tsize?: TextSizes;\n\t/** Textual content when it's a static string; if you have nested elements, use children to provide content */\n\ttext?: string;\n}\n\n/**\n * MrlText Component\n *\n * @param {MrlTextProps} props - MrlText component props\n * @returns a paragraph element\n */\nexport function MrlText(props: MrlTextProps): JSX.Element {\n\tconst {\n\t\tattrs = {},\n\t\tsize = textDefaults.size,\n\t\tchildren,\n\t\tclassName,\n\t\ttext,\n\t\t['data-qa']: dataQa = attrs['data-qa'],\n\t\t...rest\n\t} = props;\n\n\tconst attributes = setAttributes(attrs, textDefaults.attrs);\n\tconst allClasses = classnames(\n\t\t// @deprecated\n\t\t'mrl-text',\n\t\t'MrlText',\n\t\tstyles['MrlText'],\n\t\t{\n\t\t\t[styles[`MrlText--${size}`]]: size !== textDefaults.size,\n\t\t\t[`MrlText--${size}`]: size !== textDefaults.size,\n\t\t\t[attributes.className]: typeof attributes.className !== 'undefined',\n\t\t\t[attributes.class]: typeof attributes.class !== 'undefined'\n\t\t},\n\t\tclassName\n\t);\n\n\t// @deprecated\n\tdelete attributes.class;\n\tdelete attributes.className;\n\n\tif (text && text !== '') {\n\t\treturn (\n\t\t\t<p {...attributes} {...rest} data-qa={dataQa}\n\t\t\t\tclassName={allClasses}>\n\t\t\t\t{text}\n\t\t\t</p>\n\t\t);\n\t}\n\n\treturn (\n\t\t<p {...attributes} {...rest} data-qa={dataQa}\n\t\t\tclassName={allClasses}>\n\t\t\t{children}\n\t\t</p>\n\t);\n}\n"],"names":["MrlText","props","_props$attrs","attrs","_props$size","size","textDefaults","children","className","text","_props$dataQa","dataQa","rest","_objectWithoutProperties","_excluded","attributes","setAttributes","allClasses","classnames","styles","_defineProperty","concat","React","createElement","_extends"],"mappings":";;;;;;;;AAsBA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,OAAOA,CAACC,KAAmB,EAAe;AACzD,EAAA,IAAAC,YAAA,GAQID,KAAK,CAPRE,KAAK;AAALA,IAAAA,KAAK,GAAAD,YAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,YAAA;IAAAE,WAAA,GAOPH,KAAK,CANRI,IAAI;AAAJA,IAAAA,IAAI,GAAAD,WAAA,KAAA,MAAA,GAAGE,YAAY,CAACD,IAAI,GAAAD,WAAA;IACxBG,QAAQ,GAKLN,KAAK,CALRM,QAAQ;IACRC,SAAS,GAINP,KAAK,CAJRO,SAAS;IACTC,IAAI,GAGDR,KAAK,CAHRQ,IAAI;IAAAC,aAAA,GAGDT,KAAK,CAFP,SAAS,CAAA;IAAGU,MAAM,GAAAD,aAAA,KAAA,MAAA,GAAGP,KAAK,CAAC,SAAS,CAAC,GAAAO,aAAA;AACnCE,IAAAA,IAAI,GAAAC,wBAAA,CACJZ,KAAK,EAAAa,SAAA,CAAA;EAET,IAAMC,UAAU,GAAGC,aAAa,CAACb,KAAK,EAAEG,YAAY,CAACH,KAAK,CAAC;EAC3D,IAAMc,UAAU,GAAGC,UAAU;AAC5B;AACA,EAAA,UAAU,EACV,SAAS,EACTC,MAAM,CAAC,SAAS,CAAC,EAAAC,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAA,EAAA,EAEfD,MAAM,CAAA,WAAA,CAAAE,MAAA,CAAahB,IAAI,CAAA,CAAG,EAAGA,IAAI,KAAKC,YAAY,CAACD,IAAI,CAAA,EAAA,WAAA,CAAAgB,MAAA,CAC3ChB,IAAI,CAAA,EAAKA,IAAI,KAAKC,YAAY,CAACD,IAAI,CAAA,EAC/CU,UAAU,CAACP,SAAS,EAAG,OAAOO,UAAU,CAACP,SAAS,KAAK,WAAW,CAAA,EAClEO,UAAU,CAAA,OAAA,CAAM,EAAG,OAAOA,UAAU,CAAA,OAAA,CAAM,KAAK,WAAW,CAAA,EAE5DP,SACD,CAAC;;AAED;AACA,EAAA,OAAOO,UAAU,CAAA,OAAA,CAAM;EACvB,OAAOA,UAAU,CAACP,SAAS;AAE3B,EAAA,IAAIC,IAAI,IAAIA,IAAI,KAAK,EAAE,EAAE;IACxB,oBACCa,KAAA,CAAAC,aAAA,CAAA,GAAA,EAAAC,QAAA,CAAA,EAAA,EAAOT,UAAU,EAAMH,IAAI,EAAA;AAAE,MAAA,SAAA,EAASD,MAAO;AAC5CH,MAAAA,SAAS,EAAES;AAAW,KAAA,CAAA,EACrBR,IACC,CAAC;AAEN,EAAA;EAEA,oBACCa,KAAA,CAAAC,aAAA,CAAA,GAAA,EAAAC,QAAA,CAAA,EAAA,EAAOT,UAAU,EAAMH,IAAI,EAAA;AAAE,IAAA,SAAA,EAASD,MAAO;AAC5CH,IAAAA,SAAS,EAAES;AAAW,GAAA,CAAA,EACrBV,QACC,CAAC;AAEN;;;;"}

package/dist/esm/components/text/MrlText/MrlText.module.scss.js

@@ -0,0 +1,4 @@
+var styles = {"MrlText":"MrlText--qWcjF","MrlText--large":"MrlText--large--Up17c","MrlText--small":"MrlText--small--oJ2NK","MrlText--xsmall":"MrlText--xsmall--OjNGe","MrlText--xxsmall":"MrlText--xxsmall--qfF1L"};
+
+export { styles as default };
+//# sourceMappingURL=MrlText.module.scss.js.map

package/dist/esm/components/text/MrlText/MrlText.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlText.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/text/MrlTextHeading/MrlTextHeading.js

@@ -0,0 +1,59 @@
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as React from 'react';
+import classnames from 'classnames';
+import { headingDefaults } from '../constants.js';
+import styles from './MrlTextHeading.module.scss.js';
+import { setAttributes } from '../../../utils/setAttributes/setAttributes.js';
+
+var _excluded = ["attrs", "children", "className", "hierarchy", "kind", "level", "size", "text", "data-qa"];
+/**
+ * MuralTextHeading component
+ * Used for creating semantic headings within a page
+ *
+ * @param {MrlTextHeadingProps} props - MrlTextHeading component props
+ * @returns a heading element
+ */
+function MrlTextHeading(props) {
+  var _props$attrs = props.attrs,
+    attrs = _props$attrs === void 0 ? {} : _props$attrs,
+    children = props.children,
+    className = props.className,
+    _props$hierarchy = props.hierarchy,
+    hierarchy = _props$hierarchy === void 0 ? headingDefaults.hierarchy : _props$hierarchy,
+    _props$kind = props.kind,
+    kind = _props$kind === void 0 ? headingDefaults.kind : _props$kind,
+    _props$level = props.level,
+    level = _props$level === void 0 ? headingDefaults.level : _props$level,
+    _props$size = props.size,
+    size = _props$size === void 0 ? headingDefaults.size : _props$size,
+    text = props.text,
+    _props$dataQa = props['data-qa'],
+    dataQa = _props$dataQa === void 0 ? attrs['data-qa'] : _props$dataQa,
+    rest = _objectWithoutProperties(props, _excluded);
+  var attributes = setAttributes(attrs, headingDefaults.attrs);
+  var allClasses = classnames(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles["MrlTextHeading-".concat(kind)], kind.length > 0), styles["MrlTextHeading-".concat(kind, "--").concat(size)], size !== 'medium'), styles["MrlTextHeading-".concat(kind, "--").concat(hierarchy)], hierarchy !== 'primary'), attributes.className, typeof attributes.className !== 'undefined'), attributes["class"], typeof attributes["class"] !== 'undefined'),
+  // @deprecated
+  'mrl-text-heading', 'MrlTextHeading', className);
+
+  // @todo - 2563 - move to setAttributes
+  delete attributes.className;
+  delete attributes["class"];
+
+  /**
+   * getting h1-h6 from the level prop
+   */
+  var Tag = "h".concat(level);
+  if (text && text !== '') {
+    return /*#__PURE__*/React.createElement(Tag, _extends({}, attributes, rest, {
+      "data-qa": dataQa,
+      className: allClasses
+    }), text);
+  }
+  return /*#__PURE__*/React.createElement(Tag, _extends({}, attributes, rest, {
+    "data-qa": dataQa,
+    className: allClasses
+  }), children);
+}
+
+export { MrlTextHeading };
+//# sourceMappingURL=MrlTextHeading.js.map

package/dist/esm/components/text/MrlTextHeading/MrlTextHeading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTextHeading.js","sources":["../../../../../src/components/text/MrlTextHeading/MrlTextHeading.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { AttrsObject, setAttributes } from '../../../utils';\nimport {\n\tLevelType,\n\theadingDefaults,\n\tHeadingHierarchies,\n\tHeadingSizes,\n\tTextSizes,\n\tHeadingKinds\n} from '../constants';\nimport { DataQa } from '../../../utils/dataQa';\n\nimport styles from './MrlTextHeading.module.scss';\n\ninterface MrlTextHeadingProps extends React.ComponentPropsWithRef<'h1'>, DataQa {\n\t/**\n\t * Applies additional HTML attributes to the text element\n\t *\n\t * @deprecated - use the regular HTML attributes instead.\n\t */\n\tattrs?: AttrsObject;\n\t/** Children to be rendered within the text heading component */\n\tchildren?: React.ReactNode;\n\t/** Set the semantic level of the heading based on its usage in the page hierarchy */\n\tlevel?: LevelType;\n\t/** Visual styling use case for the heading */\n\tkind?: HeadingKinds;\n\t/**\n\t * Visual size of the heading\n\t * xsmall and xxsmall are only supported when kind=\"title\"\n\t */\n\tsize?: HeadingSizes | TextSizes;\n\t/**\n\t * Clear and concise description of the content that the heading describes\n\t *\n\t * Note: hierarchy only impacts MrlTextHeading components with `kind=\"title\"`\n\t */\n\thierarchy?: HeadingHierarchies;\n\ttext?: string;\n\t/** Hierarchy level within the use case and sizing scales */\n}\n\n/**\n * MuralTextHeading component\n * Used for creating semantic headings within a page\n *\n * @param {MrlTextHeadingProps} props - MrlTextHeading component props\n * @returns a heading element\n */\nexport function MrlTextHeading(props: MrlTextHeadingProps): JSX.Element {\n\tconst {\n\t\tattrs = {},\n\t\tchildren,\n\t\tclassName,\n\t\thierarchy = headingDefaults.hierarchy,\n\t\tkind = headingDefaults.kind,\n\t\tlevel = headingDefaults.level,\n\t\tsize = headingDefaults.size,\n\t\ttext,\n\t\t['data-qa']: dataQa = attrs['data-qa'],\n\t\t...rest\n\t} = props;\n\tconst attributes = setAttributes(attrs, headingDefaults.attrs);\n\n\tconst allClasses = classnames(\n\t\t{\n\t\t\t[styles[`MrlTextHeading-${kind}`]]: kind.length > 0,\n\t\t\t[styles[`MrlTextHeading-${kind}--${size}`]]: size !== 'medium',\n\t\t\t[styles[`MrlTextHeading-${kind}--${hierarchy}`]]: hierarchy !== 'primary',\n\t\t\t[attributes.className]: typeof attributes.className !== 'undefined',\n\t\t\t[attributes.class]: typeof attributes.class !== 'undefined'\n\t\t},\n\t\t// @deprecated\n\t\t'mrl-text-heading',\n\t\t'MrlTextHeading',\n\t\tclassName\n\t);\n\n\t// @todo - 2563 - move to setAttributes\n\tdelete attributes.className;\n\tdelete attributes.class;\n\n\t/**\n\t * getting h1-h6 from the level prop\n\t */\n\tconst Tag: React.ElementType = `h${level}`;\n\n\tif (text && text !== '') {\n\t\treturn (\n\t\t\t<Tag {...attributes} {...rest} data-qa={dataQa}\n\t\t\t\tclassName={allClasses}>\n\t\t\t\t{text}\n\t\t\t</Tag>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Tag {...attributes} {...rest} data-qa={dataQa}\n\t\t\tclassName={allClasses}>\n\t\t\t{children}\n\t\t</Tag>\n\t);\n}\n"],"names":["MrlTextHeading","props","_props$attrs","attrs","children","className","_props$hierarchy","hierarchy","headingDefaults","_props$kind","kind","_props$level","level","_props$size","size","text","_props$dataQa","dataQa","rest","_objectWithoutProperties","_excluded","attributes","setAttributes","allClasses","classnames","_defineProperty","styles","concat","length","Tag","React","createElement","_extends"],"mappings":"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"}

package/dist/esm/components/text/MrlTextHeading/MrlTextHeading.module.scss.js

@@ -0,0 +1,4 @@
+var styles = {"MrlTextHeading-display":"MrlTextHeading-display--YPlsQ","MrlTextHeading-display--large":"MrlTextHeading-display--large--OoGc4","MrlTextHeading-display--small":"MrlTextHeading-display--small--gwHpu","MrlTextHeading-display--xsmall":"MrlTextHeading-display--xsmall--qgA98","MrlTextHeading-headline":"MrlTextHeading-headline--paxPG","MrlTextHeading-headline--large":"MrlTextHeading-headline--large--edpNl","MrlTextHeading-headline--small":"MrlTextHeading-headline--small--wvgZG","MrlTextHeading-title":"MrlTextHeading-title--Wlh8i","MrlTextHeading-title--large":"MrlTextHeading-title--large--VbutV","MrlTextHeading-title--small":"MrlTextHeading-title--small--BPZW2","MrlTextHeading-title--xsmall":"MrlTextHeading-title--xsmall--MkPpJ","MrlTextHeading-title--xxsmall":"MrlTextHeading-title--xxsmall--R9i95","MrlTextHeading-title--secondary":"MrlTextHeading-title--secondary--VzSQc"};
+
+export { styles as default };
+//# sourceMappingURL=MrlTextHeading.module.scss.js.map

package/dist/esm/components/text/MrlTextHeading/MrlTextHeading.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTextHeading.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/text/constants.js

@@ -0,0 +1,23 @@
+import { objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
+
+/**
+ * Default values for props on the Text component;
+ * Shared between the component and Storybook
+ */
+var textDefaults = {
+  attrs: {},
+  size: 'medium'
+};
+
+/**
+ * Default values for props on the Text component;
+ * Shared between the component and Storybook
+ */
+var headingDefaults = _objectSpread2(_objectSpread2({}, textDefaults), {}, {
+  hierarchy: 'primary',
+  kind: 'headline',
+  level: '2'
+});
+
+export { headingDefaults, textDefaults };
+//# sourceMappingURL=constants.js.map

package/dist/esm/components/text/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/components/text/constants.ts"],"sourcesContent":["import { AttrsObject } from '../../utils';\n\n/*\n * Text component\n * ------------------------------------------------------------------\n */\nexport type TextSizes = 'xxsmall' | 'xsmall' | 'small' | 'medium' | 'large';\n\nexport interface TextDefaults {\n\tattrs: AttrsObject;\n\tsize: TextSizes;\n}\n\nexport const textAllowedValues = {\n\tsizes: [\n\t\t'xxsmall',\n\t\t'xsmall',\n\t\t'small',\n\t\t'medium',\n\t\t'large'\n\t]\n};\n\n/**\n * Default values for props on the Text component;\n * Shared between the component and Storybook\n */\nexport const textDefaults: TextDefaults = {\n\tattrs: {},\n\tsize: 'medium'\n};\n\n/*\n * Heading component\n * ------------------------------------------------------------------\n */\nexport type LevelType = '1' | '2' | '3' | '4' | '5' | '6';\nexport type HeadingKinds = 'display' | 'headline' | 'title';\nexport type HeadingSizes = 'small' | 'medium' | 'large';\nexport type HeadingHierarchies = 'primary' | 'secondary';\n\n// Titles have additional options\nexport interface HeadingDefaults {\n\tattrs: AttrsObject;\n\thierarchy: HeadingHierarchies;\n\tkind: HeadingKinds;\n\tlevel: LevelType;\n\tsize: HeadingSizes | TextSizes;\n}\n\n/**\n * Defines all of classes allowed for the type attribute;\n * used for Storybook and testing\n */\nexport const headingAllowedValues = {\n\thierarchy: ['primary', 'secondary'],\n\tkinds: ['display', 'headline', 'title'],\n\tlevel: [\n\t\t'1',\n\t\t'2',\n\t\t'3',\n\t\t'4',\n\t\t'5',\n\t\t'6'\n\t],\n\tsizes: ['small', 'medium', 'large']\n};\n\n/**\n * Default values for props on the Text component;\n * Shared between the component and Storybook\n */\nexport const headingDefaults: HeadingDefaults = {\n\t...textDefaults,\n\thierarchy: 'primary',\n\tkind: 'headline',\n\tlevel: '2'\n};\n"],"names":["textDefaults","attrs","size","headingDefaults","_objectSpread","hierarchy","kind","level"],"mappings":";;AAuBA;AACA;AACA;AACA;AACO,IAAMA,YAA0B,GAAG;EACzCC,KAAK,EAAE,EAAE;AACTC,EAAAA,IAAI,EAAE;AACP;;AAsCA;AACA;AACA;AACA;IACaC,eAAgC,GAAAC,cAAA,CAAAA,cAAA,KACzCJ,YAAY,CAAA,EAAA,EAAA,EAAA;AACfK,EAAAA,SAAS,EAAE,SAAS;AACpBC,EAAAA,IAAI,EAAE,UAAU;AAChBC,EAAAA,KAAK,EAAE;AAAG,CAAA;;;;"}