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

package/dist/cjs/components/table/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../src/components/table/utils.ts"],"sourcesContent":["import { sortAsc, sortDes } from '@muraldevkit/ds-icons';\nimport { MrlSortDirection } from './constants';\n\n/**\n * Used as a generic sort comparator for unknown types by coercing each value\n * to a string and sorting alphabetically. It will likely produce unexpected and/or\n * undesirable results for anything other than the most basic text or numeric data.\n *\n * @param {unknown} a first of two values\n * @param {unknown} b second of two values\n * @returns {number} A negative number if a occurs before b; positive if the\n * a occurs after b; 0 if they are equivalent.\n */\nexport const sortAlphabeticallyAsCoercedStrings = (a: unknown, b: unknown): number => {\n\treturn `${a}`.localeCompare(`${b}`);\n};\n\n/**\n * Used to generate consistent keys for the entire structure of MrlSmartTable\n *\n * @param {string} prefix the unique structure prefix\n * @param {string} elementType the element type to generate a key for\n * @param {string[]} keys a set of properties to uniquely identify the element\n * @returns {string} the generated key\n */\nexport const keyFor = (\n\tprefix: string,\n\telementType: 'header' | 'column' | 'body' | 'row' | 'row-cell',\n\t...keys: string[]\n): string => `${prefix}-${elementType}-${keys.join('-')}`;\n\n/**\n * Provides sort icon based on direction.\n *\n * @param {MrlSortDirection} direction the sort direction\n * @returns {typeof sortAsc | typeof sortDes} the icon\n */\nexport const sortIcon = (direction: MrlSortDirection): typeof sortAsc | typeof sortDes =>\n\tdirection > 0 ? sortAsc : sortDes;\n\n/**\n * Provides text label based on sort direction.\n *\n * @param {MrlSortDirection} direction the sort direction\n * @returns {string} the text label\n */\nexport const sortText = (direction: MrlSortDirection): string =>\n\tdirection > 0 ? 'ascending' : 'descending';\n\n/**\n * Provides next sort direction based on current direction.\n *\n * @param {MrlSortDirection} current sort direction\n * @returns {MrlSortDirection} next sort direction\n */\nexport const nextSortDirection = (current?: MrlSortDirection): MrlSortDirection =>\n\tcurrent ? current * -1 : MrlSortDirection.ASC;\n"],"names":["sortAlphabeticallyAsCoercedStrings","a","b","concat","localeCompare","keyFor","prefix","elementType","_len","arguments","length","keys","Array","_key","join","sortIcon","direction","sortAsc","sortDes","sortText","nextSortDirection","current","MrlSortDirection","ASC"],"mappings":";;;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMA,kCAAkC,GAAG,SAArCA,kCAAkCA,CAAIC,CAAU,EAAEC,CAAU,EAAa;EACrF,OAAO,EAAA,CAAAC,MAAA,CAAGF,CAAC,CAAA,CAAGG,aAAa,CAAA,EAAA,CAAAD,MAAA,CAAID,CAAC,CAAE,CAAC;AACpC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMG,MAAM,GAAG,SAATA,MAAMA,CAClBC,MAAc,EACdC,WAA8D,EAAA;EAAA,KAAA,IAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAC3DC,IAAI,OAAAC,KAAA,CAAAJ,IAAA,GAAA,CAAA,GAAAA,IAAA,WAAAK,IAAA,GAAA,CAAA,EAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,EAAA,EAAA;AAAJF,IAAAA,IAAI,CAAAE,IAAA,GAAA,CAAA,CAAA,GAAAJ,SAAA,CAAAI,IAAA,CAAA;AAAA,EAAA;AAAA,EAAA,OAAA,EAAA,CAAAV,MAAA,CACQG,MAAM,EAAA,GAAA,CAAA,CAAAH,MAAA,CAAII,WAAW,EAAA,GAAA,CAAA,CAAAJ,MAAA,CAAIQ,IAAI,CAACG,IAAI,CAAC,GAAG,CAAC,CAAA;AAAA;;AAEvD;AACA;AACA;AACA;AACA;AACA;IACaC,QAAQ,GAAG,SAAXA,QAAQA,CAAIC,SAA2B,EAAA;AAAA,EAAA,OACnDA,SAAS,GAAG,CAAC,GAAGC,eAAO,GAAGC,eAAO;AAAA;;AAElC;AACA;AACA;AACA;AACA;AACA;IACaC,QAAQ,GAAG,SAAXA,QAAQA,CAAIH,SAA2B,EAAA;AAAA,EAAA,OACnDA,SAAS,GAAG,CAAC,GAAG,WAAW,GAAG,YAAY;AAAA;;AAE3C;AACA;AACA;AACA;AACA;AACA;IACaI,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,OAA0B,EAAA;EAAA,OAC3DA,OAAO,GAAGA,OAAO,GAAG,EAAE,GAAGC,0BAAgB,CAACC,GAAG;AAAA;;;;;;;;"}

package/dist/cjs/components/tabs/MrlTab/MrlTab.js

@@ -0,0 +1,73 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var classnames = require('classnames');
+var MrlTab_module = require('./MrlTab.module.scss.js');
+var MrlTabs = require('../MrlTabs/MrlTabs.js');
+
+function _interopNamespaceDefault(e) {
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n.default = e;
+	return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+var _excluded = ["className", "icon", "id", "hookClick", "text"];
+/**
+ * Renders a tab component
+ * @param {MrlTabProps} props the props for your MrlTab
+ * @returns {React.ReactElement} an a element containing the text you pass
+ */
+var MrlTab = function MrlTab(_ref) {
+  var className = _ref.className,
+    icon = _ref.icon,
+    id = _ref.id,
+    hookClick = _ref.hookClick,
+    text = _ref.text,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var _useMrlTabContext = MrlTabs.useMrlTabContext(),
+    activeTab = _useMrlTabContext.activeTab,
+    setActiveTab = _useMrlTabContext.setActiveTab;
+  var active = activeTab === id;
+  var buttonClasses = classnames(className, 'mrl-tab', _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlTab_module.default['MrlTab'], true), MrlTab_module.default['MrlTab-selected'], active));
+  var textClasses = classnames('mrl-tab--text', _rollupPluginBabelHelpers.defineProperty({}, MrlTab_module.default['MrlTab-Text'], true));
+  var handleClick = function handleClick(id) {
+    if (hookClick) {
+      hookClick();
+    }
+    setActiveTab(id);
+  };
+  return /*#__PURE__*/React__namespace.createElement("button", _rollupPluginBabelHelpers.extends({}, rest, {
+    "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,
+    type: "button"
+  }), !!icon && /*#__PURE__*/React__namespace.createElement("span", {
+    className: MrlTab_module.default['MrlTab-icon']
+  }, icon), /*#__PURE__*/React__namespace.createElement("span", {
+    className: textClasses
+  }, text));
+};
+
+exports.MrlTab = MrlTab;
+//# sourceMappingURL=MrlTab.js.map

package/dist/cjs/components/tabs/MrlTab/MrlTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTab.js","sources":["../../../../../src/components/tabs/MrlTab/MrlTab.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { useMrlTabContext } from '../../..';\n\n/** MrlTab and MrlTabLink share styles as they should look identical */\nimport styles from './MrlTab.module.scss';\n\nexport interface MrlTabProps extends React.ComponentProps<'button'> {\n\t/** Class to be applied to the button element of the MrlTab */\n\tclassName?: string;\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\ttext: string;\n}\n\n/**\n * Renders a tab component\n * @param {MrlTabProps} props the props for your MrlTab\n * @returns {React.ReactElement} an a element containing the text you pass\n */\nexport const MrlTab = ({\n\tclassName,\n\ticon,\n\tid,\n\thookClick,\n\ttext,\n\t...rest\n}: MrlTabProps): 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<button\n\t\t\t{...rest}\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\ttype=\"button\"\n\t\t>\n\t\t\t{!!icon && <span className={styles['MrlTab-icon']}>{icon}</span>}\n\t\t\t<span className={textClasses}>{text}</span>\n\t\t</button>\n\t);\n};\n"],"names":["MrlTab","_ref","className","icon","id","hookClick","text","rest","_objectWithoutProperties","_excluded","_useMrlTabContext","useMrlTabContext","activeTab","setActiveTab","active","buttonClasses","classnames","_defineProperty","styles","textClasses","handleClick","React","createElement","_extends","concat","onClick","role","tabIndex","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA;AACA;AACA;AACA;AACA;IACaA,MAAM,GAAG,SAATA,MAAMA,CAAAC,IAAA,EAOoB;AAAA,EAAA,IANtCC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,EAAE,GAAAH,IAAA,CAAFG,EAAE;IACFC,SAAS,GAAAJ,IAAA,CAATI,SAAS;IACTC,IAAI,GAAAL,IAAA,CAAJK,IAAI;AACDC,IAAAA,IAAI,GAAAC,iDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;AAEP,EAAA,IAAAC,iBAAA,GAAoCC,wBAAgB,EAAE;IAA9CC,SAAS,GAAAF,iBAAA,CAATE,SAAS;IAAEC,YAAY,GAAAH,iBAAA,CAAZG,YAAY;AAC/B,EAAA,IAAMC,MAAM,GAAGF,SAAS,KAAKR,EAAE;EAC/B,IAAMW,aAAa,GAAGC,UAAU,CAACd,SAAS,EAAE,SAAS,EAAAe,wCAAA,CAAAA,wCAAA,CAAA,EAAA,EACnDC,qBAAM,CAAC,QAAQ,CAAC,EAAG,IAAI,CAAA,EACvBA,qBAAM,CAAC,iBAAiB,CAAC,EAAGJ,MAAM,CACnC,CAAC;AAEF,EAAA,IAAMK,WAAW,GAAGH,UAAU,CAAC,eAAe,EAAAC,wCAAA,CAAA,EAAA,EAC5CC,qBAAM,CAAC,aAAa,CAAC,EAAG,IAAI,CAC7B,CAAC;AAEF,EAAA,IAAME,WAAW,GAAG,SAAdA,WAAWA,CAAIhB,EAAU,EAAK;AACnC,IAAA,IAAIC,SAAS,EAAE;AACdA,MAAAA,SAAS,EAAE;AACZ,IAAA;IAEAQ,YAAY,CAACT,EAAE,CAAC;EACjB,CAAC;AAED,EAAA,oBACCiB,gBAAA,CAAAC,aAAA,CAAA,QAAA,EAAAC,iCAAA,KACKhB,IAAI,EAAA;AACR,IAAA,eAAA,EAAeO,MAAO;AACtBZ,IAAAA,SAAS,EAAEa,aAAc;IACzB,SAAA,EAAA,EAAA,CAAAS,MAAA,CAAYpB,EAAE,EAAA,MAAA,CAAO;AACrB,IAAA,aAAA,EAAY,MAAM;AAClBA,IAAAA,EAAE,EAAEA,EAAG;IACPqB,OAAO,EAAE,SAATA,OAAOA,GAAA;MAAA,OAAQL,WAAW,CAAChB,EAAE,CAAC;IAAA,CAAC;AAC/BsB,IAAAA,IAAI,EAAC,KAAK;AACVC,IAAAA,QAAQ,EAAEb,MAAM,GAAG,CAAC,GAAG,EAAG;AAC1Bc,IAAAA,IAAI,EAAC;AAAQ,GAAA,CAAA,EAEZ,CAAC,CAACzB,IAAI,iBAAIkB,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IAAMpB,SAAS,EAAEgB,qBAAM,CAAC,aAAa;AAAE,GAAA,EAAEf,IAAW,CAAC,eAChEkB,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMpB,IAAAA,SAAS,EAAEiB;GAAY,EAAEb,IAAW,CACnC,CAAC;AAEX;;;;"}

package/dist/cjs/components/tabs/MrlTab/MrlTab.module.scss.js

@@ -0,0 +1,8 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {"MrlTab-Text":"MrlTab-Text--FSRrk","MrlTab-icon":"MrlTab-icon--NYAn0","MrlTab":"MrlTab--or1g5","MrlTab-selected":"MrlTab-selected--yG1_K"};
+
+exports.default = styles;
+//# sourceMappingURL=MrlTab.module.scss.js.map

package/dist/cjs/components/tabs/MrlTab/MrlTab.module.scss.js.map

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

package/dist/cjs/components/tabs/MrlTabContent/MrlTabContent.js

@@ -0,0 +1,59 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var classnames = require('classnames');
+var MrlTabContent_module = require('./MrlTabContent.module.scss.js');
+var index = require('../../../utils/trapFocus/index.js');
+var MrlTabs = require('../MrlTabs/MrlTabs.js');
+
+function _interopNamespaceDefault(e) {
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n.default = e;
+	return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+var _excluded = ["children", "className", "tabId"];
+var MrlTabContent = /*#__PURE__*/React__namespace.memo(function (_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    tabId = _ref.tabId,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var _useMrlTabContext = MrlTabs.useMrlTabContext(),
+    activeTab = _useMrlTabContext.activeTab;
+  var isHidden = activeTab !== tabId;
+  var panelRef = React__namespace.useRef(null);
+  var _React$useState = React__namespace.useState([]),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    focusableElementsInPanel = _React$useState2[0],
+    setFocusableElementsInPanel = _React$useState2[1];
+  var containerClass = classnames(className, 'mrl-tab-content', _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlTabContent_module.default.MrlTabContent, true), MrlTabContent_module.default['MrlTabContent-hidden'], isHidden));
+  React__namespace.useEffect(function () {
+    var focusableElements = index.getFocusableElementsInsideElement(panelRef.current);
+    setFocusableElementsInPanel(focusableElements);
+  }, []);
+  return /*#__PURE__*/React__namespace.createElement("div", _rollupPluginBabelHelpers.extends({
+    "aria-labelledby": tabId,
+    className: containerClass,
+    role: "tabpanel",
+    tabIndex: focusableElementsInPanel.length ? -1 : 0,
+    ref: panelRef
+  }, rest), children);
+});
+MrlTabContent.displayName = 'MrlTabContent';
+
+exports.MrlTabContent = MrlTabContent;
+//# sourceMappingURL=MrlTabContent.js.map

package/dist/cjs/components/tabs/MrlTabContent/MrlTabContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlTabContent.js","sources":["../../../../../src/components/tabs/MrlTabContent/MrlTabContent.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { getFocusableElementsInsideElement, useMrlTabContext } from '../../../';\n\nimport styles from './MrlTabContent.module.scss';\n\nexport interface MrlTabContentPropTypes {\n\tchildren: React.ReactNode;\n\t/** Class to be applied to the container element of the MrlTabContent */\n\tclassName?: string;\n\t/** The id of the tab button associated to this content */\n\ttabId: string;\n}\n\nexport const MrlTabContent: React.FC<MrlTabContentPropTypes> = React.memo(\n\t({ children, className, tabId, ...rest }: MrlTabContentPropTypes) => {\n\t\tconst { activeTab } = useMrlTabContext();\n\t\tconst isHidden = activeTab !== tabId;\n\n\t\tconst panelRef = React.useRef<HTMLDivElement>(null);\n\t\tconst [focusableElementsInPanel, setFocusableElementsInPanel] = React.useState<HTMLElement[]>(\n\t\t\t[]\n\t\t);\n\n\t\tconst containerClass = classnames(className, 'mrl-tab-content', {\n\t\t\t[styles.MrlTabContent]: true,\n\t\t\t[styles['MrlTabContent-hidden']]: isHidden\n\t\t});\n\n\t\tReact.useEffect(() => {\n\t\t\tconst focusableElements = getFocusableElementsInsideElement(panelRef.current as HTMLElement);\n\t\t\tsetFocusableElementsInPanel(focusableElements);\n\t\t}, []);\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\taria-labelledby={tabId}\n\t\t\t\tclassName={containerClass}\n\t\t\t\trole=\"tabpanel\"\n\t\t\t\ttabIndex={focusableElementsInPanel.length ? -1 : 0}\n\t\t\t\tref={panelRef}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t);\n\t}\n);\n\nMrlTabContent.displayName = 'MrlTabContent';\n"],"names":["MrlTabContent","React","memo","_ref","children","className","tabId","rest","_objectWithoutProperties","_excluded","_useMrlTabContext","useMrlTabContext","activeTab","isHidden","panelRef","useRef","_React$useState","useState","_React$useState2","_slicedToArray","focusableElementsInPanel","setFocusableElementsInPanel","containerClass","classnames","_defineProperty","styles","useEffect","focusableElements","getFocusableElementsInsideElement","current","createElement","_extends","role","tabIndex","length","ref","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,IAAMA,aAA+C,gBAAGC,gBAAK,CAACC,IAAI,CACxE,UAAAC,IAAA,EAAqE;AAAA,EAAA,IAAlEC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,KAAK,GAAAH,IAAA,CAALG,KAAK;AAAKC,IAAAA,IAAI,GAAAC,iDAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA;AACrC,EAAA,IAAAC,iBAAA,GAAsBC,wBAAgB,EAAE;IAAhCC,SAAS,GAAAF,iBAAA,CAATE,SAAS;AACjB,EAAA,IAAMC,QAAQ,GAAGD,SAAS,KAAKN,KAAK;AAEpC,EAAA,IAAMQ,QAAQ,GAAGb,gBAAK,CAACc,MAAM,CAAiB,IAAI,CAAC;AACnD,EAAA,IAAAC,eAAA,GAAgEf,gBAAK,CAACgB,QAAQ,CAC7E,EACD,CAAC;IAAAC,gBAAA,GAAAC,uCAAA,CAAAH,eAAA,EAAA,CAAA,CAAA;AAFMI,IAAAA,wBAAwB,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,2BAA2B,GAAAH,gBAAA,CAAA,CAAA,CAAA;EAI5D,IAAMI,cAAc,GAAGC,UAAU,CAAClB,SAAS,EAAE,iBAAiB,EAAAmB,wCAAA,CAAAA,wCAAA,CAAA,EAAA,EAC5DC,4BAAM,CAACzB,aAAa,EAAG,IAAI,CAAA,EAC3ByB,4BAAM,CAAC,sBAAsB,CAAC,EAAGZ,QAAQ,CAC1C,CAAC;EAEFZ,gBAAK,CAACyB,SAAS,CAAC,YAAM;AACrB,IAAA,IAAMC,iBAAiB,GAAGC,uCAAiC,CAACd,QAAQ,CAACe,OAAsB,CAAC;IAC5FR,2BAA2B,CAACM,iBAAiB,CAAC;EAC/C,CAAC,EAAE,EAAE,CAAC;AAEN,EAAA,oBACC1B,gBAAA,CAAA6B,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA;AACC,IAAA,iBAAA,EAAiBzB,KAAM;AACvBD,IAAAA,SAAS,EAAEiB,cAAe;AAC1BU,IAAAA,IAAI,EAAC,UAAU;IACfC,QAAQ,EAAEb,wBAAwB,CAACc,MAAM,GAAG,EAAE,GAAG,CAAE;AACnDC,IAAAA,GAAG,EAAErB;GAAS,EACVP,IAAI,CAAA,EAEPH,QACG,CAAC;AAER,CACD;AAEAJ,aAAa,CAACoC,WAAW,GAAG,eAAe;;;;"}

package/dist/cjs/components/tabs/MrlTabContent/MrlTabContent.module.scss.js

@@ -0,0 +1,8 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {"MrlTabContent":"MrlTabContent--ns5y2","MrlTabContent-hidden":"MrlTabContent-hidden--_6_cT"};
+
+exports.default = styles;
+//# sourceMappingURL=MrlTabContent.module.scss.js.map

package/dist/cjs/components/tabs/MrlTabContent/MrlTabContent.module.scss.js.map

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

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

@@ -0,0 +1,201 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var classnames = require('classnames');
+var dsIcons = require('@muraldevkit/ds-icons');
+var MrlTabGroup_module = require('./MrlTabGroup.module.scss.js');
+var MrlIconButton = require('../../button/MrlIconButton/MrlIconButton.js');
+var MrlSvg = require('../../svg/MrlSvg/MrlSvg.js');
+var preventDefault = require('../../../utils/preventDefault/preventDefault.js');
+
+function _interopNamespaceDefault(e) {
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n.default = e;
+	return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+var _excluded = ["children", "className", "disablePageControls", "label"];
+var MrlTabGroup = /*#__PURE__*/React__namespace.memo(function (_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    disablePageControls = _ref.disablePageControls,
+    label = _ref.label,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var _React$useState = React__namespace.useState(0),
+    _React$useState2 = _rollupPluginBabelHelpers.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__namespace.useState(0),
+    _React$useState4 = _rollupPluginBabelHelpers.slicedToArray(_React$useState3, 2),
+    pageCount = _React$useState4[0],
+    setPageCount = _React$useState4[1];
+  var tabGroup = React__namespace.useRef(null);
+  var prevButtonContainer = React__namespace.useRef(null);
+  var nextButtonContainer = React__namespace.useRef(null);
+  var _React$useState5 = React__namespace.useState([]),
+    _React$useState6 = _rollupPluginBabelHelpers.slicedToArray(_React$useState5, 2),
+    tabButtons = _React$useState6[0],
+    setTabButtons = _React$useState6[1];
+  var prevPage = React__namespace.useCallback(function () {
+    setPage(page - 1);
+  }, [page]);
+  var nextPage = React__namespace.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.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.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.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.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.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__namespace.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__namespace.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__namespace.createElement("div", {
+    className: "".concat(MrlTabGroup_module.default['MrlTabGroup-nav'], " ").concat(MrlTabGroup_module.default['MrlTabGroup-prev']),
+    ref: prevButtonContainer
+  }, /*#__PURE__*/React__namespace.createElement("div", {
+    className: "".concat(MrlTabGroup_module.default['MrlTabGroup-fade'], " ").concat(MrlTabGroup_module.default['MrlTabGroup-fadePrev'])
+  }), /*#__PURE__*/React__namespace.createElement(MrlIconButton.MrlIconButton, {
+    className: MrlTabGroup_module.default['MrlTabGroup-prevButton'],
+    icon: /*#__PURE__*/React__namespace.createElement(MrlSvg.MrlSvg, {
+      svg: dsIcons.chevronLeft
+    }),
+    onClick: prevPage,
+    "data-qa": "previous-categories-button",
+    kind: "ghost",
+    position: "right",
+    size: "xsmall",
+    state: "default",
+    tabIndex: -1,
+    text: "Previous"
+  }));
+  var nextButton = /*#__PURE__*/React__namespace.createElement("div", {
+    className: "".concat(MrlTabGroup_module.default['MrlTabGroup-nav'], " ").concat(MrlTabGroup_module.default['MrlTabGroup-next']),
+    ref: nextButtonContainer
+  }, /*#__PURE__*/React__namespace.createElement("div", {
+    className: "".concat(MrlTabGroup_module.default['MrlTabGroup-fade'], " ").concat(MrlTabGroup_module.default['MrlTabGroup-fadeNext'])
+  }), /*#__PURE__*/React__namespace.createElement(MrlIconButton.MrlIconButton, {
+    className: MrlTabGroup_module.default['MrlTabGroup-nextButton'],
+    icon: /*#__PURE__*/React__namespace.createElement(MrlSvg.MrlSvg, {
+      svg: dsIcons.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', MrlTabGroup_module.default.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__namespace.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
+    className: MrlTabGroup_module.default['MrlTabGroup-container']
+  }), !disablePageControls && !isFirstPage && previousButton, /*#__PURE__*/React__namespace.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';
+
+exports.MrlTabGroup = MrlTabGroup;
+//# sourceMappingURL=MrlTabGroup.js.map

package/dist/cjs/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/cjs/components/tabs/MrlTabGroup/MrlTabGroup.module.scss.js

@@ -0,0 +1,8 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+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"};
+
+exports.default = styles;
+//# sourceMappingURL=MrlTabGroup.module.scss.js.map

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

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

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

@@ -0,0 +1,79 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var classnames = require('classnames');
+var reactRouterDom = require('react-router-dom');
+var MrlTab_module = require('../MrlTab/MrlTab.module.scss.js');
+var MrlTabs = require('../MrlTabs/MrlTabs.js');
+
+function _interopNamespaceDefault(e) {
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n.default = e;
+	return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+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 = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var _useMrlTabContext = MrlTabs.useMrlTabContext(),
+    activeTab = _useMrlTabContext.activeTab,
+    setActiveTab = _useMrlTabContext.setActiveTab;
+  var active = activeTab === id;
+  var buttonClasses = classnames(className, 'mrl-tab', _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlTab_module.default['MrlTab'], true), MrlTab_module.default['MrlTab-selected'], active));
+  var textClasses = classnames('mrl-tab--text', _rollupPluginBabelHelpers.defineProperty({}, MrlTab_module.default['MrlTab-Text'], true));
+  var handleClick = function handleClick(id) {
+    if (hookClick) {
+      hookClick();
+    }
+    setActiveTab(id);
+  };
+  return /*#__PURE__*/React__namespace.createElement(reactRouterDom.NavLink, _rollupPluginBabelHelpers.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__namespace.createElement("span", {
+    className: MrlTab_module.default['MrlTab-icon']
+  }, icon), !!text && /*#__PURE__*/React__namespace.createElement("span", {
+    className: textClasses
+  }, text), !!children && /*#__PURE__*/React__namespace.createElement("span", {
+    className: textClasses
+  }, children));
+};
+
+exports.MrlTabLink = MrlTabLink;
+//# sourceMappingURL=MrlTabLink.js.map

package/dist/cjs/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,iDAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA;AAEjB,EAAA,IAAAC,iBAAA,GAAoCC,wBAAgB,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,wCAAA,CAAAA,wCAAA,CAAA,EAAA,EACnDC,qBAAM,CAAC,QAAQ,CAAC,EAAG,IAAI,CAAA,EACvBA,qBAAM,CAAC,iBAAiB,CAAC,EAAGJ,MAAM,CACnC,CAAC;AAEF,EAAA,IAAMK,WAAW,GAAGH,UAAU,CAAC,eAAe,EAAAC,wCAAA,CAAA,EAAA,EAC5CC,qBAAM,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,gBAAA,CAAAC,aAAA,CAACC,sBAAO,EAAAC,iCAAA,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,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IAAMtB,SAAS,EAAEkB,qBAAM,CAAC,aAAa;GAAE,EAAEhB,IAAW,CAAC,EAC/D,CAAC,CAACG,IAAI,iBAAIgB,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMtB,IAAAA,SAAS,EAAEmB;GAAY,EAAEd,IAAW,CAAC,EACrD,CAAC,CAACJ,QAAQ,iBAAIoB,gBAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMtB,IAAAA,SAAS,EAAEmB;GAAY,EAAElB,QAAe,CACrD,CAAC;AAEZ;;;;"}

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

@@ -0,0 +1,83 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var classnames = require('classnames');
+var MrlTabContext = require('../../../contexts/MrlTabContext/MrlTabContext.js');
+
+function _interopNamespaceDefault(e) {
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n.default = e;
+	return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+var _excluded = ["capitalizeTabTitles", "children", "className", "selectedTab", "size", "spaceTabsEvenly"];
+var MrlTabs = /*#__PURE__*/React__namespace.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 = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var _React$useState = React__namespace.useState(''),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    activeTab = _React$useState2[0],
+    setActiveTab = _React$useState2[1];
+  var tabsRef = React__namespace.useRef(null);
+  React__namespace.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', _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "MrlTabs-".concat(size), size !== 'small'), 'MrlTabs-caps', capitalizeTabTitles), 'MrlTabs-evenSpacing', spaceTabsEvenly));
+  return /*#__PURE__*/React__namespace.createElement(MrlTabContext.MrlTabContext.Provider, {
+    value: {
+      activeTab: activeTab,
+      setActiveTab: setActiveTab
+    }
+  }, /*#__PURE__*/React__namespace.createElement("div", _rollupPluginBabelHelpers.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__namespace.useContext(MrlTabContext.MrlTabContext);
+  if (context === undefined) {
+    throw new Error('useMrlTabContext must be used within a MrlTabProvider');
+  }
+  return context;
+}
+
+exports.MrlTabs = MrlTabs;
+exports.useMrlTabContext = useMrlTabContext;
+//# sourceMappingURL=MrlTabs.js.map

package/dist/cjs/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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"}