{"version":3,"sources":["webpack:///./src/tc/js/components/Component.js","webpack:///./src/tc/js/components/TabModule.js"],"names":["domTree","WeakMap","configuration","Component","el","config","arguments","length","undefined","_classCallCheck","this","Error","$el","jQuery","$","set","hasOwnProperty","dom","setupDefaults","addListeners","get","elements","_component","__webpack_require__","_constants","timeout","keys","direction","37","38","39","40","TabModule","_possibleConstructorReturn","__proto__","Object","getPrototypeOf","call","$tabs","find","$tablist","setDirection","openHashedTab","_this2","each","index","tab","unbind","on","handleClick","bind","handleKeydown","handleKeyup","window","handleResize","_this3","clearTimeout","setTimeout","verifyOpenTab","event","target","attr","parentElement","tagName","activateTab","keyCode","determineOrientation","preventDefault","focusLastTab","focusFirstTab","first","focus","last","inArray","proceed","switchTabOnArrowPress","setFocus","vertical","isTabOpen","deactivateTabs","removeAttr","history","replaceState","document","title","trigger","matchMedia","BREAKPOINT","tablet","matches","hash","location","click"],"mappings":"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","file":"32.712f7c70078d90ed38ed.js","sourcesContent":["const domTree = new WeakMap();\nconst configuration = new WeakMap();\n\n/**\n * Component is a class that should be extended for every component that's being made. It\n * is a helper class to keep the code uniform.\n *\n * __PLEASE NOTE__: This is only to be extended, not instantiated.\n *\n * @example\n * import Component from 'component';\n *\n * class Foo extends Component {\n * construction(el){\n * super(el);\n * }\n *\n * setupDefaults(){\n * // ...defaults go here\n * }\n *\n * addListeners(){\n * // ...listeners go here\n * }\n * }\n *\n * // Create a new Foo component\n * new Foo('.foo');\n */\nclass Component {\n /**\n * Component constructor - see {@link config} on how to pass in additional configuration to the constructor\n *\n * @param {string|Object} el - Main DOM element, you can pass a string such as `'.foo'` __or__ a jQuery object such as `$('.foo')`\n * @param {Object} [config={ }] - Additional component configuration; reachable with `this.config`\n */\n constructor(el, config = {}){\n if (typeof el === 'undefined') {\n throw new Error('You must provide an element as a String type or a jQuery object type');\n }\n\n /**\n * Main class element, this will be a jQuery instance\n * This can be reachable at any time in your superclass with `this.$el`\n *\n * @type {Object}\n */\n this.$el = el instanceof jQuery ? el : $(el);\n\n if (this.$el.length === 0) return;\n\n domTree.set(this, {});\n configuration.set(this, config);\n\n if (this.config.hasOwnProperty('dom')) {\n this.dom = this.config.dom;\n }\n\n this.setupDefaults();\n this.addListeners();\n }\n\n /**\n * This method is used for override;\n * It's called directly after the element and configuration have been set up\n * @abstract\n */\n setupDefaults(){}\n\n /**\n * This method is used for override;\n * It's called directly after `setupDefaults()`, so everything is ready and setup at this point.\n * @abstract\n */\n addListeners(){}\n\n /**\n * Get component configuration\n *\n * @example\n * class Foo extends Component {\n * construction(el, config){\n * super(el, config);\n * }\n *\n * setupDefaults(){\n * console.log(this.config.name); // Outputs \"Foo\"\n * }\n * }\n *\n * // Create a new Foo component with some configuration\n * new Foo('.foo', {\n * name: 'Foo'\n * });\n *\n * @type {Object}\n */\n get config(){\n return configuration.get(this);\n }\n\n /**\n * Set DOM object\n *\n * @example\n * class Foo extends Component {\n * construction(el){\n * super(el);\n * }\n *\n * setupDefaults(){\n * this.dom = {\n * $container: this.$el.find('.container')\n * }\n * }\n *\n * addListeners(){\n * //DOM object is available\n * console.log(this.dom.$container);\n * }\n * }\n *\n * // Create a new Foo component\n * new Foo('.foo');\n *\n * @type {Object}\n */\n set dom(elements){\n elements = {\n ...this.dom,\n ...elements\n };\n\n domTree.set(this, elements);\n }\n\n /**\n * Get DOM object\n *\n * @example\n * this.dom\n *\n * @type {Object}\n */\n get dom(){\n return domTree.get(this);\n }\n}\n\nexport default Component;\n\n\n\n// WEBPACK FOOTER //\n// ./src/tc/js/components/Component.js","import Component from 'component';\nimport { BREAKPOINT } from '../constants';\n\nlet timeout = false;\n\nconst keys = {\n end: 35,\n home: 36,\n left: 37,\n up: 38,\n right: 39,\n down: 40,\n space: 32\n};\n\nconst direction = {\n 37: -1,\n 38: -1,\n 39: 1,\n 40: 1\n};\n\nclass TabModule extends Component {\n constructor(el) {\n super(el);\n }\n\n setupDefaults() {\n this.dom = {\n $tabs: this.$el.find('[role=\"tab\"]'),\n $tablist: this.$el.find('[role=\"tablist\"]')\n };\n\n this.setDirection();\n this.openHashedTab();\n }\n\n addListeners() {\n this.dom.$tabs.each((index, tab) => {\n $(tab).unbind('click');\n $(tab).on('click', ::this.handleClick);\n $(tab).on('keydown', ::this.handleKeydown);\n $(tab).on('keyup', ::this.handleKeyup);\n });\n\n $(window).on('resize', ::this.handleResize);\n }\n\n handleResize() {\n clearTimeout(timeout);\n\n timeout = setTimeout(() => {\n this.setDirection();\n this.verifyOpenTab();\n }, 200);\n }\n\n handleClick(event) {\n let target = event.target;\n\n if ($(event.target).attr('role') !== 'tab') {\n target = event.target.parentElement;\n }\n\n if (event.target.tagName !== 'A') {\n this.activateTab(target, false);\n }\n }\n\n handleKeydown(event) {\n switch (event.keyCode) {\n case keys.left:\n case keys.right:\n this.determineOrientation(event.keyCode, event.target);\n break;\n case keys.space:\n this.activateTab(event.target);\n break;\n default:\n break;\n }\n }\n\n handleKeyup(event) {\n event.preventDefault();\n\n switch (event.keyCode) {\n case keys.end:\n this.focusLastTab();\n break;\n case keys.home:\n this.focusFirstTab();\n break;\n case keys.up:\n case keys.down:\n this.determineOrientation(event.keyCode, event.target);\n break;\n default:\n break;\n }\n }\n\n focusFirstTab() {\n this.dom.$tabs.first().focus();\n }\n\n focusLastTab() {\n this.dom.$tabs.last().focus();\n }\n\n switchTabOnArrowPress(keyCode, target) {\n const index = $.inArray(target, this.dom.$tabs);\n\n if (direction[keyCode]) {\n if (index !== -1) {\n if (this.dom.$tabs[index + direction[keyCode]]) {\n this.dom.$tabs[index + direction[keyCode]].focus();\n } else if (keyCode === keys.left || keyCode === keys.up) {\n this.focusLastTab();\n } else if (keyCode === keys.right || keyCode === keys.down) {\n this.focusFirstTab();\n }\n }\n }\n }\n\n determineOrientation(keyCode, target) {\n const vertical = this.dom.$tablist.attr('aria-orientation') === 'vertical';\n let proceed = false;\n\n if (vertical) {\n if (keyCode === keys.up || keyCode === keys.down) {\n proceed = true;\n }\n } else {\n if (keyCode === keys.left || keyCode === keys.right) {\n proceed = true;\n }\n }\n\n if (proceed) {\n this.switchTabOnArrowPress(keyCode, target);\n }\n }\n\n activateTab(tab, setFocus = true) {\n const vertical = this.dom.$tablist.attr('aria-orientation') === 'vertical';\n const isTabOpen = $(tab).attr('aria-selected') === 'true';\n\n this.deactivateTabs();\n\n if (!isTabOpen || !vertical) {\n $(tab).removeAttr('tabindex');\n $(tab).attr('aria-selected', 'true');\n\n if ($(tab).attr('id')) {\n window.history.replaceState({}, document.title, `#${$(tab).attr('id')}`);\n }\n }\n\n if (setFocus) {\n $(tab).focus();\n }\n\n $(window).trigger('tabChange');\n setTimeout(() => {\n $(window).trigger('resize');\n }, 0);\n }\n\n deactivateTabs() {\n this.dom.$tabs.each((index, tab) => {\n $(tab).attr('tabindex', '-1');\n $(tab).attr('aria-selected', 'false');\n });\n }\n\n setDirection() {\n if (window.matchMedia(`(max-width: ${BREAKPOINT.tablet}px)`).matches) {\n this.dom.$tablist.attr('aria-orientation', 'vertical');\n } else {\n this.dom.$tablist.attr('aria-orientation', 'horizontal');\n }\n }\n\n verifyOpenTab() {\n const isSomeTabOpen = this.$el.find('[aria-selected=\"true\"]');\n\n if (!isSomeTabOpen.length) {\n if (window.matchMedia(`(min-width: ${BREAKPOINT.tablet}px)`).matches) {\n this.dom.$tabs.first().attr('aria-selected', 'true');\n }\n }\n }\n\n openHashedTab() {\n const hash = window.location.hash;\n\n if (hash) {\n this.$el.find(hash).click();\n this.$el.find(hash).focus();\n }\n\n return;\n }\n}\n\nexport default TabModule;\n\n\n\n// WEBPACK FOOTER //\n// ./src/tc/js/components/TabModule.js"],"sourceRoot":""}