{"version":3,"file":"polythene-css-standalone.js","sources":["../../polythene-core-css/node_modules/j2c/dist/j2c.commonjs.js","../../polythene-core/dist/polythene-core.mjs","../../polythene-core-css/dist/polythene-core-css.mjs","../../polythene-style/dist/polythene-style.mjs","../../polythene-css-base-spinner/dist/polythene-css-base-spinner.mjs","../../polythene-css-shadow/dist/polythene-css-shadow.mjs","../../polythene-css-button/dist/polythene-css-button.mjs","../../polythene-css-button-group/dist/polythene-css-button-group.mjs","../../polythene-css-card/dist/polythene-css-card.mjs","../../polythene-css-selection-control/dist/polythene-css-selection-control.mjs","../../polythene-css-checkbox/dist/polythene-css-checkbox.mjs","../../polythene-css-dialog-pane/dist/polythene-css-dialog-pane.mjs","../../polythene-css-dialog/dist/polythene-css-dialog.mjs","../../polythene-css-drawer/dist/polythene-css-drawer.mjs","../../polythene-css-fab/dist/polythene-css-fab.mjs","../../polythene-css-icon/dist/polythene-css-icon.mjs","../../polythene-css-icon-button/dist/polythene-css-icon-button.mjs","../../polythene-css-ios-spinner/dist/polythene-css-ios-spinner.mjs","../../polythene-css-list/dist/polythene-css-list.mjs","../../polythene-css-list-tile/dist/polythene-css-list-tile.mjs","../../polythene-css-material-design-spinner/dist/polythene-css-material-design-spinner.mjs","../../polythene-css-material-design-progress-spinner/dist/polythene-css-material-design-progress-spinner.mjs","../../polythene-css-menu/dist/polythene-css-menu.mjs","../../polythene-css-notification/dist/polythene-css-notification.mjs","../../polythene-css-radio-button/dist/polythene-css-radio-button.mjs","../../polythene-css-ripple/dist/polythene-css-ripple.mjs","../../polythene-css-search/dist/polythene-css-search.mjs","../../polythene-css-slider/dist/polythene-css-slider.mjs","../../polythene-css-snackbar/dist/polythene-css-snackbar.mjs","../../polythene-css-svg/dist/polythene-css-svg.mjs","../../polythene-css-switch/dist/polythene-css-switch.mjs","../../polythene-css-tabs/dist/polythene-css-tabs.mjs","../../polythene-css-textfield/dist/polythene-css-textfield.mjs","../../polythene-css-toolbar/dist/polythene-css-toolbar.mjs","../../polythene-css-core/dist/polythene-css-core.mjs","../../polythene-utilities/dist/polythene-utilities.mjs","../../polythene-css-typography/dist/polythene-css-typography.mjs"],"sourcesContent":["'use strict';\n\nvar emptyArray = [];\nvar emptyObject = {};\nvar type = emptyObject.toString;\nvar ARRAY = type.call(emptyArray);\nvar OBJECT = type.call(emptyObject);\nvar STRING = type.call('');\nvar FUNCTION = type.call(type);\nvar own = emptyObject.hasOwnProperty;\nvar freeze = Object.freeze || function(o) {return o};\n\n\nfunction defaults(target, source) {\n for (var k in source) if (own.call(source, k)) {\n if (k.indexOf('$') && !(k in target)) target[k] = source[k];\n }\n return target\n}\n\nfunction cartesian(a,b) {\n var res = [], i, j;\n for (j in b) if(own.call(b, j))\n for (i in a) if(own.call(a, i))\n res.push(a[i] + b[j]);\n return res\n}\n\n// \"Tokenizes\" the selectors into parts relevant for the next function.\n// Strings and comments are matched, but ignored afterwards.\n// This is not a full tokenizers. It only recognizes comas, parentheses,\n// strings and comments.\n// regexp generated by scripts/regexps.js then trimmed by hand\nvar selectorTokenizer = /[(),]|\"(?:\\\\.|[^\"\\n])*\"|'(?:\\\\.|[^'\\n])*'|\\/\\*[\\s\\S]*?\\*\\//g;\n\n\n/**\n * This will split a coma-separated selector list into individual selectors,\n * ignoring comas in strings, comments and in :pseudo-selectors(parameter, lists).\n *\n * @param {string} selector\n * @return {string[]}\n */\n\nfunction splitSelector(selector) {\n var indices = [], res = [], inParen = 0, o;\n /*eslint-disable no-cond-assign*/\n while (o = selectorTokenizer.exec(selector)) {\n /*eslint-enable no-cond-assign*/\n switch (o[0]) {\n case '(': inParen++; break\n case ')': inParen--; break\n case ',': if (inParen) break; indices.push(o.index);\n }\n }\n for (o = indices.length; o--;){\n res.unshift(selector.slice(indices[o] + 1));\n selector = selector.slice(0, indices[o]);\n }\n res.unshift(selector);\n return res\n}\n\n// Like the `selectorTokenizer`, but for the `&` operator\nvar ampersandTokenizer = /&|\"(?:\\\\.|[^\"\\n])*\"|'(?:\\\\.|[^'\\n])*'|\\/\\*[\\s\\S]*?\\*\\//g;\n\nfunction ampersand (selector, parents) {\n var indices = [], split = [], res, o;\n /*eslint-disable no-cond-assign*/\n while (o = ampersandTokenizer.exec(selector)) {\n /*eslint-enable no-cond-assign*/\n if (o[0] == '&') indices.push(o.index);\n }\n for (o = indices.length; o--;){\n split.unshift(selector.slice(indices[o] + 1));\n selector = selector.slice(0, indices[o]);\n }\n split.unshift(selector);\n if (split.length === 1) split.unshift('');\n res = [split[0]];\n for (o = 1; o < split.length; o++) {\n res = cartesian(res, cartesian(parents, [split[o]]));\n }\n return res.join(',')\n}\n\nfunction flatIter (f) {\n return function iter(arg) {\n if (type.call(arg) === ARRAY) for (var i= 0 ; i < arg.length; i ++) iter(arg[i]);\n else f(arg);\n }\n}\n\nfunction decamelize(match) {\n return '-' + match.toLowerCase()\n}\n\n/**\n * Handles the property:value; pairs.\n *\n * @param {object} state - holds the localizer- and walker-related methods\n * and state\n * @param {object} emit - the contextual emitters to the final buffer\n * @param {string} prefix - the current property or a prefix in case of nested\n * sub-properties.\n * @param {array|object|string} o - the declarations.\n * @param {boolean} local - are we in @local or in @global scope.\n */\n\nfunction declarations(state, emit, prefix, o, local) {\n var k, v, kk;\n if (o==null) return\n\n switch ( type.call(o = o.valueOf()) ) {\n case ARRAY:\n for (k = 0; k < o.length; k++)\n\n declarations(state, emit, prefix, o[k], local);\n\n break\n case OBJECT:\n // prefix is falsy iif it is the empty string, which means we're at the root\n // of the declarations list.\n prefix = (prefix && prefix + '-');\n for (k in o) if (own.call(o, k)){\n v = o[k];\n if (/\\$/.test(k)) {\n for (kk in (k = k.split('$'))) if (own.call(k, kk)) {\n\n declarations(state, emit, prefix + k[kk], v, local);\n\n }\n } else {\n\n declarations(state, emit, prefix + k, v, local);\n\n }\n }\n break\n default:\n // prefix is falsy when it is \"\", which means that we're\n // at the top level.\n // `o` is then treated as a `property:value` pair, or a\n // semi-colon-separated list thereof.\n // Otherwise, `prefix` is the property name, and\n // `o` is the value.\n\n // restore the dashes\n k = prefix.replace(/_/g, '-').replace(/[A-Z]/g, decamelize);\n\n if (local && (k == 'animation-name' || k == 'animation' || k == 'list-style')) {\n // no need to tokenize here a plain `.split(',')` has all bases covered.\n // We may 'localize' a comment, but it's not a big deal.\n o = o.split(',').map(function (o) {\n\n return o.replace(/^\\s*(?:(var\\([^)]+\\))|:?global\\(\\s*([_A-Za-z][-\\w]*)\\s*\\)|()(-?[_A-Za-z][-\\w]*))/, state.localizeReplacer)\n\n }).join(',');\n }\n\n emit.decl(k, o);\n\n }\n}\n\n/**\n * Handles a single at-rules\n *\n * @param {object} state - holds the localizer- and walker-related methods\n * and state\n * @param {object} emit - the contextual emitters to the final buffer\n * @param {array} k - The parsed at-rule, including the parameters,\n * if takes both parameters and a block.\n * k == [match, fullAtRule, atRuleType, params?]\n * So in `@-webkit-keyframes foo`, we have\n * - match = \"@-webkit-keyframes foo\"\n * - fullAtRule = \"@-webkit-keyframes\"\n * - atRuleType = \"keyframes\"\n * - params = \"foo\"\n * @param {string|string[]|object|object[]} v - Either parameters for\n * block-less rules or\n * their block\n * for the others.\n * @param {string} prefix - the current selector or the selector prefix\n * in case of nested rules\n * @param {boolean} local - are we in @local or in @global scope?\n * @param {string} nestingDepth - are we nested in an at-rule or a selector?\n */\n\nfunction atRules(state, emit, k, v, prefix, local, nestingDepth) {\n\n // First iterate over user-provided at-rules and return if one of them corresponds to the current one\n for (var i = 0; i < state.$atHandlers.length; i++) {\n\n if (state.$atHandlers[i](state, emit, k, v, prefix, local, nestingDepth)) return\n\n }\n\n // using `/^global$/.test(k[2])` rather that 'global' == k[2] gzips\n // slightly better thanks to the regexps tests further down.\n // It is slightly less efficient but this isn't a critical path.\n\n if (!k[3] && /^global$/.test(k[2])) {\n\n rules(state, emit, prefix, v, 0, nestingDepth);\n\n\n } else if (!k[3] && /^local$/.test(k[2])) {\n\n rules(state, emit, prefix, v, 1, nestingDepth);\n\n\n } else if (k[3] && /^adopt$/.test(k[2])) {\n\n if (!local || nestingDepth) return emit.err('@adopt global or nested: ' + k[0])\n\n if (!/^\\.?[_A-Za-z][-\\w]*$/.test(k[3])) return emit.err('bad adopter ' + JSON.stringify(k[3]) + ' in ' + k[0])\n\n i = [];\n flatIter(function(adoptee, asString) {\n\n if(adoptee == null || !/^\\.?[_A-Za-z][-\\w]*(?:\\s+\\.?[_A-Za-z][-\\w]*)*$/.test(asString = adoptee + '')) emit.err('bad adoptee '+ JSON.stringify(adoptee) + ' in ' + k[0]);\n\n else i.push(asString.replace(/\\./g, ''));\n\n })(v);\n\n // we may end up with duplicate classes but AFAIK it has no consequences on specificity.\n if (i.length) {\n state.localize(k[3] = k[3].replace(/\\./g, ''));\n state.names[k[3]] += (' ' + i.join(' '));\n }\n\n\n } else if (!k[3] && /^(?:namespace|import|charset)$/.test(k[2])) {\n flatIter(function(v) {\n\n emit.atrule(k[1], k[2], v);\n\n })(v);\n\n\n } else if (!k[3] && /^(?:font-face|viewport)$/.test(k[2])) {\n flatIter(function(v) {\n\n emit.atrule(k[1], k[2], k[3], 1);\n\n declarations(state, emit, '', v, local);\n\n emit._atrule();\n\n })(v);\n\n } else if (k[3] && /^(?:media|supports|page|keyframes)$/.test(k[2])) {\n\n if (local && 'keyframes' == k[2]) {\n k[3] = k[3].replace(\n // generated by script/regexps.js\n /(var\\([^)]+\\))|:?global\\(\\s*([_A-Za-z][-\\w]*)\\s*\\)|()(-?[_A-Za-z][-\\w]*)/,\n state.localizeReplacer\n );\n }\n\n\n emit.atrule(k[1], k[2], k[3], 1);\n\n if ('page' == k[2]) {\n\n declarations(state, emit, '', v, local);\n\n } else {\n\n rules(\n state, emit,\n 'keyframes' == k[2] ? '' : prefix,\n v, local, nestingDepth + 1\n );\n\n }\n\n emit._atrule();\n\n } else {\n\n emit.err('Unsupported at-rule: ' + k[0]);\n\n }\n}\n\n/**\n * Add rulesets and other CSS tree to the sheet.\n *\n * @param {object} state - holds the localizer- and walker-related methods\n * and state\n * @param {object} emit - the contextual emitters to the final buffer\n * @param {string} prefix - the current selector or a prefix in case of nested rules\n * @param {array|string|object} tree - a source object or sub-object.\n * @param {string} nestingDepth - are we nested in an at-rule?\n * @param {boolean} local - are we in @local or in @global scope?\n */\nfunction rules(state, emit, prefix, tree, local, nestingDepth) {\n var k, v, inDeclaration, kk;\n\n switch (type.call(tree)) {\n\n case OBJECT:\n for (k in tree) if (own.call(tree, k)) {\n v = tree[k];\n\n if (prefix.length > 0 && /^[-\\w$]+$/.test(k)) {\n if (!inDeclaration) {\n inDeclaration = 1;\n\n emit.rule(prefix);\n\n }\n if (/\\$/.test(k)) {\n for (kk in (k = k.split('$'))) if (own.call(k, kk)) {\n\n declarations(state, emit, k[kk], v, local);\n\n }\n } else {\n\n declarations(state, emit, k, v, local);\n\n }\n\n } else if (/^@/.test(k)) {\n // Handle At-rules\n inDeclaration = 0;\n\n atRules(state, emit,\n /^(.(?:-[\\w]+-)?([_A-Za-z][-\\w]*))\\b\\s*(.*?)\\s*$/.exec(k) || [k,'@','',''],\n v, prefix, local, nestingDepth\n );\n\n } else {\n // selector or nested sub-selectors\n inDeclaration = 0;\n\n rules(\n state, emit,\n // build the selector `prefix` for the next iteration.\n // ugly and full of redundant bits but so far the fastest/shortest.gz\n /*0 if*/(prefix.length > 0 && (/,/.test(prefix) || /,/.test(k))) ?\n\n /*0 then*/ (kk = splitSelector(prefix), splitSelector(\n local ?\n\n k.replace(\n /(\"(?:\\\\.|[^\"\\n])*\"|'(?:\\\\.|[^'\\n])*'|\\/\\*[\\s\\S]*?\\*\\/)|:global\\(\\s*(\\.-?[_A-Za-z][-\\w]*)\\s*\\)|(\\.)(-?[_A-Za-z][-\\w]*)/g,\n state.localizeReplacer\n ) :\n\n k\n ).map(function (k) {\n return /&/.test(k) ? ampersand(k, kk) : kk.map(function(kk) {\n return kk + k\n }).join(',')\n }).join(',')) :\n\n /*0 else*/ /*1 if*/ /&/.test(k) ?\n\n /*1 then*/ ampersand(\n local ?\n\n k.replace(\n /(\"(?:\\\\.|[^\"\\n])*\"|'(?:\\\\.|[^'\\n])*'|\\/\\*[\\s\\S]*?\\*\\/)|:global\\(\\s*(\\.-?[_A-Za-z][-\\w]*)\\s*\\)|(\\.)(-?[_A-Za-z][-\\w]*)/g,\n state.localizeReplacer\n ) :\n\n k,\n [prefix]\n ) :\n\n /*1 else*/ prefix + (\n local ?\n\n k.replace(\n /(\"(?:\\\\.|[^\"\\n])*\"|'(?:\\\\.|[^'\\n])*'|\\/\\*[\\s\\S]*?\\*\\/)|:global\\(\\s*(\\.-?[_A-Za-z][-\\w]*)\\s*\\)|(\\.)(-?[_A-Za-z][-\\w]*)/g,\n state.localizeReplacer\n ) :\n\n k\n ),\n v, local, nestingDepth + 1\n );\n\n }\n }\n\n break\n\n case ARRAY:\n for (k = 0; k < tree.length; k++){\n\n rules(state, emit, prefix, tree[k], local, nestingDepth);\n\n }\n break\n\n case STRING:\n // CSS hacks or ouptut of `j2c.inline`.\n if (!prefix.length) emit.err('No selector');\n emit.rule(prefix || ' ');\n\n declarations(state, emit, '', tree, local);\n\n }\n}\n\n// This is the first entry in the filters array, which is\n// actually the last step of the compiler. It inserts\n// closing braces to close normal (non at-) rules (those\n// that start with a selector). Doing it earlier is\n// impossible without passing state around in unrelated code\n// or ending up with duplicated selectors when the source tree\n// contains arrays.\n// There's no `_rule` handler, because the core compiler never\n// calls it.\nfunction closeSelectors(next, inline) {\n var lastSelector;\n return inline ? next : {\n init: function(){lastSelector = 0; next.init();},\n done: function (raw) {\n if (lastSelector) {next._rule(); lastSelector = 0;}\n return next.done(raw)\n },\n atrule: function (rule, kind, param, takesBlock) {\n if (lastSelector) {next._rule(); lastSelector = 0;}\n next.atrule(rule, kind, param, takesBlock);\n },\n _atrule: function (rule) {\n if (lastSelector) {next._rule(); lastSelector = 0;}\n next._atrule(rule);\n },\n rule: function (selector) {\n if (selector !== lastSelector){\n if (lastSelector) next._rule();\n next.rule(selector);\n lastSelector = selector;\n }\n }\n }\n}\n\nfunction global(x) {\n return ':global(' + x + ')'\n}\n\nfunction kv (k, v, o) {\n o = {};\n o[k] = v;\n return o\n}\n\nfunction at (rule, params, block) {\n if (\n arguments.length < 3\n ) {\n // inner curry!\n var _at = at.bind.apply(at, [null].concat([].slice.call(arguments,0)));\n // So that it can be used as a key in an ES6 object literal.\n _at.toString = function(){return '@' + rule + ' ' + params};\n return _at\n }\n else return kv('@' + rule +' ' + params, block)\n}\n\nfunction j2c() {\n\n // the buffer that accumulates the output. Initialized in `$sink.i()`\n var buf, err;\n\n // the bottom of the 'codegen' stream. Mirrors the `$filter` plugin API.\n var $sink = {\n init: function(){buf=[], err=[];},\n done: function (raw) {\n if (err.length != 0) throw new Error('j2c error(s): ' + JSON.stringify(err,null,2) + 'in context:\\n' + buf.join(''))\n return raw ? buf : buf.join('')\n },\n err: function(msg) {\n err.push(msg);\n buf.push('/* +++ ERROR +++ ' + msg + ' */\\n');\n },\n atrule: function (rule, kind, param, takesBlock) {\n buf.push(rule, param && ' ', param, takesBlock ? ' {' : ';', _instance.endline);\n },\n // close atrule\n _atrule: function () {buf.push('}', _instance.endline);},\n rule: function (selector) {buf.push(selector, ' {', _instance.endline);},\n // close rule\n _rule: function () {buf.push('}', _instance.endline);},\n decl: function (prop, value) {buf.push(prop, prop && ':', value, ';', _instance.endline);}\n };\n\n // holds the `$filter` and `$at` handlers\n var $filters = [closeSelectors];\n var $atHandlers = [];\n\n // the public API (see the main docs)\n var _instance = {\n at: at,\n global: global,\n kv: kv,\n names: {},\n endline: '\\n',\n suffix: '__j2c-' +\n // 128 bits of randomness\n Math.floor(Math.random() * 0x100000000).toString(36) + '-' +\n Math.floor(Math.random() * 0x100000000).toString(36) + '-' +\n Math.floor(Math.random() * 0x100000000).toString(36) + '-' +\n Math.floor(Math.random() * 0x100000000).toString(36),\n $plugins: [],\n sheet: function(tree) {\n var emit = _createOrRetrieveStream(0);\n emit.init();\n rules(\n _walkers[0],\n emit,\n '', // prefix\n tree,\n 1, // local, by default\n 0 // nesting depth\n );\n\n return emit.done()\n },\n inline: function (tree, options) {\n var emit = _createOrRetrieveStream(1);\n emit.init();\n declarations(\n _walkers[1],\n emit,\n '', // prefix\n tree,\n !(options && options.global) // local, by default\n );\n return emit.done()\n }\n };\n\n // The `state` (for the core functions) / `walker` (for the plugins) tables.\n var _walkers = [\n // for j2c.sheet\n {\n // helpers for locaizing class and animation names\n localizeReplacer: _localizeReplacer, // second argument to String.prototype.replace\n localize: _localize, // mangles local names\n names: _instance.names, // local => mangled mapping\n $atHandlers: $atHandlers, // extra at-rules\n // The core walker methods, to be provided to plugins\n atrule: atRules,\n decl: declarations,\n rule: rules\n },\n // likewise, for j2c.inline (idem with `$a`, `a` and `s` removed)\n {\n localizeReplacer: _localizeReplacer,\n localize: _localize,\n names: _instance.names,\n decl: declarations\n }\n ];\n\n\n // inner helpers\n\n var _use = flatIter(function(plugin) {\n // `~n` is falsy for `n === -1` and truthy otherwise.\n // Works well to turn the result of `a.indexOf(x)`\n // into a value that reflects the presence of `x` in\n // `a`.\n if (~_instance.$plugins.indexOf(plugin)) return\n\n _instance.$plugins.push(plugin);\n\n if (type.call(plugin) === FUNCTION) plugin = plugin(_instance);\n\n if (!plugin) return\n\n flatIter(function(filter) {\n $filters.push(filter);\n })(plugin.$filter || emptyArray);\n\n flatIter(function(handler) {\n $atHandlers.push(handler);\n })(plugin.$at || emptyArray);\n\n defaults(_instance.names, plugin.$names || emptyObject);\n\n _use(plugin.$plugins || emptyArray);\n\n $sink = plugin.$sink || $sink;\n\n defaults(_instance, plugin);\n });\n\n\n var _streams = [];\n /**\n * returns the codegen streams, creating them if necessary\n * @param\n */\n function _createOrRetrieveStream(inline) {\n // build the stream processors if needed\n if (!_streams.length) {\n // append the $sink as the ultimate filter\n $filters.push(function(_, inline) {return inline ? {init:$sink.init, decl:$sink.decl, done:$sink.done, err: $sink.err} : $sink});\n for(var i = 0; i < 2; i++){ // 0 for j2c.sheet, 1 for j2c.inline\n for (var j = $filters.length; j--;) {\n _streams[i] = freeze(\n defaults(\n $filters[j](_streams[i], !!i),\n _streams[i]\n )\n );\n }\n }\n }\n return _streams[inline]\n }\n\n /**\n * Returns a localized version of a given name.\n * Registers the pair in `instnace.name` if needed.\n *\n * @param {string} name - the name to localize\n * @return {string} - the localized version\n */\n function _localize(name) {\n if (!_instance.names[name]) _instance.names[name] = name + _instance.suffix;\n return _instance.names[name].match(/^\\S+/)\n }\n\n /**\n * Used as second argument for str.replace(localizeRegex, replacer)\n * `ignore`, `global` and `(dot, name)` are mutually exclusive\n *\n * @param {string} match - the whole match (ignored)\n * @param {string|null} ignore - a comment or a string literal\n * @param {string|null} global - a global name\n * @param {string|null} dot - either '.' for a local class name or the empty string otherwise\n * @param {string|null} name - the name to localize\n * @return {string}\n */\n function _localizeReplacer(match, ignore, global$$1, dot, name) {\n return ignore || global$$1 || dot + _localize(name)\n }\n\n _use(emptyArray.slice.call(arguments));\n return _instance\n}\n\nmodule.exports = j2c;\n","function _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n}\n\nfunction ownKeys(object, enumerableOnly) {\n var keys = Object.keys(object);\n\n if (Object.getOwnPropertySymbols) {\n var symbols = Object.getOwnPropertySymbols(object);\n if (enumerableOnly) symbols = symbols.filter(function (sym) {\n return Object.getOwnPropertyDescriptor(object, sym).enumerable;\n });\n keys.push.apply(keys, symbols);\n }\n\n return keys;\n}\n\nfunction _objectSpread2(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i] != null ? arguments[i] : {};\n\n if (i % 2) {\n ownKeys(source, true).forEach(function (key) {\n _defineProperty(target, key, source[key]);\n });\n } else if (Object.getOwnPropertyDescriptors) {\n Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));\n } else {\n ownKeys(source).forEach(function (key) {\n Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));\n });\n }\n }\n\n return target;\n}\n\nfunction _objectWithoutPropertiesLoose(source, excluded) {\n if (source == null) return {};\n var target = {};\n var sourceKeys = Object.keys(source);\n var key, i;\n\n for (i = 0; i < sourceKeys.length; i++) {\n key = sourceKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n target[key] = source[key];\n }\n\n return target;\n}\n\nfunction _objectWithoutProperties(source, excluded) {\n if (source == null) return {};\n\n var target = _objectWithoutPropertiesLoose(source, excluded);\n\n var key, i;\n\n if (Object.getOwnPropertySymbols) {\n var sourceSymbolKeys = Object.getOwnPropertySymbols(source);\n\n for (i = 0; i < sourceSymbolKeys.length; i++) {\n key = sourceSymbolKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;\n target[key] = source[key];\n }\n }\n\n return target;\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _arr = [];\n var _n = true;\n var _d = false;\n var _e = undefined;\n\n try {\n for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {\n _arr.push(_s.value);\n\n if (i && _arr.length === i) break;\n }\n } catch (err) {\n _d = true;\n _e = err;\n } finally {\n try {\n if (!_n && _i[\"return\"] != null) _i[\"return\"]();\n } finally {\n if (_d) throw _e;\n }\n }\n\n return _arr;\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance\");\n}\n\n// @ts-check\nvar modes = {\n hidden: \"hidden\",\n visible: \"visible\",\n exposing: \"exposing\",\n hiding: \"hiding\"\n};\nvar _Conditional = function _Conditional(_ref) {\n var h = _ref.h,\n useState = _ref.useState,\n useEffect = _ref.useEffect,\n props = _objectWithoutProperties(_ref, [\"h\", \"useState\", \"useEffect\"]);\n\n var initialMode = props.permanent ? modes.visible : props.permanent || props.show ? modes.visible : modes.hidden;\n\n var _useState = useState(initialMode),\n _useState2 = _slicedToArray(_useState, 2),\n mode = _useState2[0],\n setMode = _useState2[1];\n\n useEffect(function () {\n var newMode = mode;\n\n if (props.permanent) {\n if (mode === modes.visible && props.show) {\n newMode = modes.exposing;\n } else if (mode === modes.exposing && !props.show) {\n newMode = modes.hiding;\n }\n } else {\n // \"normal\" type\n if (mode === modes.hidden && props.show) {\n newMode = modes.visible;\n } else if (mode === modes.visible && !props.show) {\n newMode = modes.hiding;\n }\n }\n\n if (newMode !== mode) {\n setMode(newMode);\n }\n }, [props]);\n var placeholder = h(\"span\", {\n className: props.placeholderClassName\n }); // No didHide callback passed: use normal visibility evaluation\n\n if (!props.didHide) {\n return props.permanent || props.inactive || props.show ? h(props.instance, props) : placeholder;\n }\n\n var visible = mode !== modes.hidden;\n return visible ? h(props.instance, _objectSpread2({}, props, {\n didHide:\n /**\n * @param {any} args\n */\n function didHide(args) {\n return props.didHide(args), setMode(props.permanent ? modes.visible : modes.hidden);\n }\n }, mode === modes.hiding ? {\n show: true,\n hide: true\n } : undefined)) : placeholder;\n};\n\n// @ts-check\n\n/**\n * \n * @param {string} component \n * @param {object} params\n * @param {string} [params.option]\n * @param {string} [params.newOption]\n * @param {string} [params.newOption]\n * @param {string} [params.newComponent]\n * @param {string} [params.since]\n */\nvar deprecation = function deprecation(component, _ref) {\n var option = _ref.option,\n newOption = _ref.newOption,\n newComponent = _ref.newComponent,\n since = _ref.since;\n var version = since ? \"Since version \".concat(since, \".\") : \"\";\n return option && console.warn(\"\".concat(component, \": option '\").concat(option, \"' is deprecated and will be removed in later versions. Use '\").concat(newOption, \"' instead. \").concat(version)), // eslint-disable-line no-console\n newComponent && !newOption && console.warn(\"\".concat(component, \": this component is deprecated and will be removed in later versions. Use component '\").concat(newComponent, \"' instead. \").concat(version)), // eslint-disable-line no-console\n newComponent && newOption && console.warn(\"\".concat(component, \": this component is deprecated and will be removed in later versions. Use component '\").concat(newComponent, \"' with option '\").concat(newOption, \"' instead. \").concat(version)) // eslint-disable-line no-console\n ;\n};\n\n// @ts-check\n\n/**\n * Reducer helper function.\n * @param {object} acc \n * @param {string} p \n * @returns {object}\n */\nvar r = function r(acc, p) {\n return acc[p] = 1, acc;\n};\n/**\n * List of default attributes.\n * Separately handled:\n * - class\n * - element\n * @type Array defaultAttrs\n */\n\n\nvar defaultAttrs = [// Universal\n\"key\", \"style\", \"href\", \"id\", \"data-index\", // React\n\"tabIndex\", // Mithril\n\"tabindex\", \"oninit\", \"oncreate\", \"onupdate\", \"onbeforeremove\", \"onremove\", \"onbeforeupdate\"];\n/**\n * \n * @param {{[s: string]: string}} attrs \n * @param {object} [modifications] \n * @param {Array} [modifications.add]\n * @param {Array} [modifications.remove]\n * @returns {object}\n */\n\nvar filterSupportedAttributes = function filterSupportedAttributes(attrs) {\n var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},\n add = _ref.add,\n remove = _ref.remove;\n\n /**\n * @type {{[s: string]: string}} removeLookup \n */\n var removeLookup = remove ? remove.reduce(r, {}) : {};\n /**\n * @type {Array} attrsList \n */\n\n var attrsList = add ? defaultAttrs.concat(add) : defaultAttrs;\n var supported = attrsList.filter(function (item) {\n return !removeLookup[item];\n }).reduce(r, {});\n return Object.keys(attrs).reduce(\n /**\n * @param {object} acc\n * @param {string} key\n */\n function (acc, key) {\n return supported[key] ? acc[key] = attrs[key] : null, acc;\n }, {});\n};\n/**\n * \n * @param {object|function} attrs \n * @returns {object}\n */\n\nvar unpackAttrs = function unpackAttrs(attrs) {\n return typeof attrs === \"function\" ? attrs() : attrs;\n};\n/**\n * \n * @param {{[s: string]: string}} classes \n * @returns {{[s: string]: string}}\n */\n\nvar sizeClasses = function sizeClasses(classes) {\n return {\n small: classes.small,\n regular: classes.regular,\n medium: classes.medium,\n large: classes.large,\n fab: classes.fab\n };\n};\n/**\n * \n * @param {{[s: string]: string}} classes \n * @param {string} [size] \n * @returns {object}\n */\n\n\nvar classForSize = function classForSize(classes) {\n var size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : \"regular\";\n return sizeClasses(classes)[size];\n};\n\nvar isClient = typeof document !== \"undefined\";\nvar isServer = !isClient;\n\n// @ts-check\n/**\n * @type {{[s: string]: string}} evts\n */\n\nvar evts = {\n \"animation\": \"animationend\",\n \"OAnimation\": \"oAnimationEnd\",\n \"MozAnimation\": \"animationend\",\n \"WebkitAnimation\": \"webkitAnimationEnd\"\n};\nvar getAnimationEndEvent = function getAnimationEndEvent() {\n if (isClient) {\n var el = document.createElement(\"fakeelement\");\n /**\n * @type {string} a\n */\n\n for (var a in evts) {\n /**\n * @type {object} style\n */\n var style = el.style;\n\n if (style[a] !== undefined) {\n return evts[a];\n }\n }\n }\n};\n\n// @ts-check\n\n/**\n * @param {object} params\n * @param {object} params.element\n * @param {string} [params.selector]\n * @param {string} [params.pseudoSelector]\n * @param {string} params.prop\n * @returns {object|undefined}\n */\nvar getStyle = function getStyle(_ref) {\n var element = _ref.element,\n selector = _ref.selector,\n pseudoSelector = _ref.pseudoSelector,\n prop = _ref.prop;\n var el = selector ? element.querySelector(selector) : element;\n\n if (!el) {\n return undefined;\n }\n\n if (el.currentStyle) {\n return el.currentStyle;\n }\n\n if (window.getComputedStyle) {\n var defaultView = document.defaultView;\n\n if (defaultView) {\n var style = defaultView.getComputedStyle(el, pseudoSelector);\n\n if (style) {\n return style.getPropertyValue(prop);\n }\n }\n }\n\n return undefined;\n};\n/**\n * \n * @param {object} params\n * @param {object} params.element\n * @param {string} [params.selector]\n * @param {string} [params.pseudoSelector]\n * @param {string} params.prop\n * @param {string} [params.equals]\n * @param {string} [params.contains]\n * @returns {boolean}\n */\n\nvar stylePropCompare = function stylePropCompare(_ref2) {\n var element = _ref2.element,\n selector = _ref2.selector,\n pseudoSelector = _ref2.pseudoSelector,\n prop = _ref2.prop,\n equals = _ref2.equals,\n contains = _ref2.contains;\n var el = selector ? element.querySelector(selector) : element;\n\n if (!el) {\n return false;\n }\n\n var defaultView = document.defaultView;\n\n if (defaultView) {\n if (equals !== undefined) {\n return equals === defaultView.getComputedStyle(el, pseudoSelector).getPropertyValue(prop);\n }\n\n if (contains !== undefined) {\n return defaultView.getComputedStyle(el, pseudoSelector).getPropertyValue(prop).indexOf(contains) !== -1;\n }\n }\n\n return false;\n};\n/**\n * \n * @param {object} params\n * @param {object} params.element\n * @param {string} params.selector\n * @returns {boolean}\n */\n\nvar isRTL = function isRTL(_ref3) {\n var _ref3$element = _ref3.element,\n element = _ref3$element === void 0 ? document : _ref3$element,\n selector = _ref3.selector;\n return stylePropCompare({\n element: element,\n selector: selector,\n prop: \"direction\",\n equals: \"rtl\"\n });\n};\n/**\n * \n * @param {string} durationStr \n * @returns {number}\n */\n\nvar styleDurationToMs = function styleDurationToMs(durationStr) {\n var parsed = parseFloat(durationStr) * (durationStr.indexOf(\"ms\") === -1 ? 1000 : 1);\n return isNaN(parsed) ? 0 : parsed;\n};\n\nvar iconDropdownUp = \"\";\nvar iconDropdownDown = \"\";\n\n// @ts-check\nvar isTouch = isServer ? false : \"ontouchstart\" in document.documentElement;\nvar pointerStartEvent = isTouch ? [\"touchstart\", \"click\"] : [\"click\"];\nvar pointerEndEvent = isTouch ? [\"click\", \"mouseup\"] : [\"mouseup\"];\nvar pointerStartDownEvent = isTouch ? [\"touchstart\", \"mousedown\"] : [\"mousedown\"];\nvar pointerMoveEvent = isTouch ? [\"touchmove\", \"mousemove\"] : [\"mousemove\"];\nvar pointerEndDownEvent = isTouch ? [\"touchend\", \"mouseup\"] : [\"mouseup\"];\n\nif (isClient) {\n var htmlElement = document.querySelector(\"html\");\n\n if (htmlElement) {\n htmlElement.classList.add(isTouch ? \"pe-touch\" : \"pe-no-touch\");\n }\n}\n\n// @ts-check\n/**\n * @type {{[s: string]: Array}} listeners\n */\n\nvar listeners = {};\n/**\n * @param {function} func\n * @param {number} [s]\n * @param {object} [context]\n * @returns {function}\n * @see https://gist.github.com/Eartz/fe651f2fadcc11444549\n */\n\nvar throttle = function throttle(func) {\n var s = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0.05;\n var context = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : isClient ? window : {};\n var wait = false;\n return function () {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n var later = function later() {\n return func.apply(context, args);\n };\n\n if (!wait) {\n later();\n wait = true;\n setTimeout(function () {\n return wait = false;\n }, s);\n }\n };\n};\n/**\n * \n * @param {string} eventName \n * @param {object} listener \n * @param {number} [delay] \n */\n\nvar subscribe = function subscribe(eventName, listener, delay) {\n listeners[eventName] = listeners[eventName] || [];\n listeners[eventName].push(delay ? throttle(listener, delay) : listener);\n};\n/**\n * \n * @param {string} eventName \n * @param {object} listener \n */\n\nvar unsubscribe = function unsubscribe(eventName, listener) {\n if (!listeners[eventName]) {\n return;\n }\n\n var index = listeners[eventName].indexOf(listener);\n\n if (index > -1) {\n listeners[eventName].splice(index, 1);\n }\n};\n/**\n * \n * @param {string} eventName \n * @param {object} event \n */\n\nvar emit = function emit(eventName, event) {\n if (!listeners[eventName]) {\n return;\n }\n\n listeners[eventName].forEach(function (listener) {\n return listener(event);\n });\n};\n\nif (isClient) {\n window.addEventListener(\"resize\", function (e) {\n return emit(\"resize\", e);\n });\n window.addEventListener(\"scroll\", function (e) {\n return emit(\"scroll\", e);\n });\n window.addEventListener(\"keydown\", function (e) {\n return emit(\"keydown\", e);\n });\n pointerEndEvent.forEach(function (eventName) {\n return window.addEventListener(eventName, function (e) {\n return emit(eventName, e);\n });\n });\n}\n\n/**\n * @typedef {object} Item \n */\n\n/**\n * \n * @param {object} params\n * @param {object} params.options\n */\n\nvar Multi = function Multi(_ref) {\n var mOptions = _ref.options;\n\n /**\n * @type {Array} items\n */\n var items = []; // This is shared between all instances of a type (Dialog, Notification, ...)\n\n /*\n @param e: { id, eventName }\n */\n\n var onChange = function onChange(e) {\n emit(mOptions.name, e);\n };\n\n var itemIndex = function itemIndex(id) {\n var item = findItem(id);\n return items.indexOf(item);\n };\n\n var removeItem = function removeItem(id) {\n var index = itemIndex(id);\n\n if (index !== -1) {\n items.splice(index, 1);\n onChange({\n id: id,\n name: \"removeItem\"\n });\n }\n };\n\n var replaceItem = function replaceItem(id, newItem) {\n var index = itemIndex(id);\n\n if (index !== -1) {\n items[index] = newItem;\n }\n };\n\n var findItem = function findItem(id) {\n // traditional for loop for IE10\n for (var i = 0; i < items.length; i++) {\n if (items[i].instanceId === id) {\n return items[i];\n }\n }\n };\n\n var next = function next() {\n if (items.length) {\n items[0].show = true;\n }\n\n onChange({\n id: items.length ? items[0].instanceId : null,\n name: \"next\"\n });\n };\n\n var remove = function remove() {\n var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId;\n\n if (mOptions.queue) {\n items.shift();\n next();\n } else {\n removeItem(instanceId);\n }\n };\n\n var removeAll = function removeAll() {\n items.length = 0;\n onChange({\n id: null,\n name: \"removeAll\"\n });\n };\n\n var setPauseState = function setPauseState(pause, instanceId) {\n var item = findItem(instanceId);\n\n if (item) {\n item.pause = pause;\n item.unpause = !pause;\n onChange({\n id: instanceId,\n name: pause ? \"pause\" : \"unpause\"\n });\n }\n };\n\n var createItem = function createItem(itemAttrs, instanceId, spawn) {\n var resolveShow;\n var resolveHide;\n var props = unpackAttrs(itemAttrs);\n\n var didShow = function didShow() {\n if (props.didShow) {\n props.didShow(instanceId);\n }\n\n onChange({\n id: instanceId,\n name: \"didShow\"\n });\n return resolveShow(instanceId);\n };\n\n var showPromise = new Promise(function (resolve) {\n return resolveShow = resolve;\n });\n var hidePromise = new Promise(function (resolve) {\n return resolveHide = resolve;\n });\n\n var didHide = function didHide() {\n if (props.didHide) {\n props.didHide(instanceId);\n }\n\n onChange({\n id: instanceId,\n name: \"didHide\"\n });\n remove(instanceId);\n return resolveHide(instanceId);\n };\n\n return _objectSpread2({}, mOptions, {\n // keyId: mOptions.queue ? new Date().getTime() : undefined, // to force rendering a new component\n instanceId: instanceId,\n spawn: spawn,\n props: itemAttrs,\n show: mOptions.queue ? false : true,\n showPromise: showPromise,\n hidePromise: hidePromise,\n didShow: didShow,\n didHide: didHide\n });\n };\n\n var count = function count() {\n return items.length;\n };\n\n var pause = function pause() {\n var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId;\n return setPauseState(true, instanceId);\n };\n\n var unpause = function unpause() {\n var instanceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : mOptions.defaultId;\n return setPauseState(false, instanceId);\n };\n\n var show = function show() {\n var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n var spawnOpts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n var instanceId = spawnOpts.id || mOptions.defaultId;\n var spawn = spawnOpts.spawn || mOptions.defaultId;\n var item = createItem(props, instanceId, spawn);\n onChange({\n id: instanceId,\n name: \"show\"\n });\n\n if (mOptions.queue) {\n items.push(item);\n\n if (items.length === 1) {\n next();\n }\n } else {\n var storedItem = findItem(instanceId);\n\n if (!storedItem) {\n items.push(item);\n } else {\n replaceItem(instanceId, item);\n }\n }\n\n return item.showPromise;\n };\n\n var hide = function hide() {\n var spawnOpts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n var instanceId = spawnOpts.id || mOptions.defaultId;\n var item = mOptions.queue && items.length ? items[0] : findItem(instanceId);\n\n if (item) {\n item.hide = true;\n }\n\n onChange({\n id: instanceId,\n name: \"hide\"\n });\n return item ? item.hidePromise : Promise.resolve(instanceId);\n };\n\n var clear = removeAll;\n\n var render = function render(_ref2) {\n var h = _ref2.h,\n useState = _ref2.useState,\n useEffect = _ref2.useEffect,\n props = _objectWithoutProperties(_ref2, [\"h\", \"useState\", \"useEffect\"]);\n\n var _useState = useState(),\n _useState2 = _slicedToArray(_useState, 2),\n setCurrent = _useState2[1];\n\n useEffect(function () {\n subscribe(mOptions.name, setCurrent);\n return function () {\n unsubscribe(mOptions.name, setCurrent);\n };\n }, []);\n var spawn = props.spawn || mOptions.defaultId;\n var candidates = items.filter(function (item) {\n return item.show && item.spawn === spawn;\n });\n\n if (mOptions.htmlShowClass && isClient && document.documentElement) {\n document.documentElement.classList[candidates.length ? \"add\" : \"remove\"](mOptions.htmlShowClass);\n }\n\n return !candidates.length ? h(mOptions.placeholder) // placeholder because we cannot return null\n : h(mOptions.holderSelector, {\n className: props.position === \"container\" ? \"pe-multiple--container\" : \"pe-multiple--screen\"\n }, candidates.map(function (itemData) {\n return h(mOptions.instance, _objectSpread2({}, unpackAttrs(props), {\n fromMultipleClear: clear,\n spawnId: spawn,\n // from mOptions:\n fromMultipleClassName: mOptions.className,\n holderSelector: mOptions.holderSelector,\n transitions: mOptions.transitions,\n // from itemData:\n fromMultipleDidHide: itemData.didHide,\n fromMultipleDidShow: itemData.didShow,\n hide: itemData.hide,\n instanceId: itemData.instanceId,\n key: itemData.key !== undefined ? itemData.key : itemData.keyId,\n pause: itemData.pause,\n show: itemData.show,\n unpause: itemData.unpause\n }, unpackAttrs(itemData.props)));\n }));\n };\n\n return {\n clear: clear,\n count: count,\n hide: hide,\n pause: pause,\n remove: remove,\n show: show,\n unpause: unpause,\n render: render\n };\n};\nMulti[\"displayName\"] = \"Multi\";\n\nvar TRANSITION_TYPES = {\n SHOW: \"show\",\n HIDE: \"hide\",\n SHOW_DONE: \"show-done\",\n HIDE_DONE: \"hide-done\"\n};\nvar initialTransitionState = {\n isVisible: false,\n isTransitioning: false\n};\nvar transitionStateReducer = function transitionStateReducer(state, type) {\n switch (type) {\n case TRANSITION_TYPES.SHOW:\n return _objectSpread2({}, state, {\n isTransitioning: true,\n isVisible: true\n });\n\n case TRANSITION_TYPES.HIDE:\n return _objectSpread2({}, state, {\n isTransitioning: true\n });\n\n case TRANSITION_TYPES.SHOW_DONE:\n return _objectSpread2({}, state, {\n isTransitioning: false,\n isVisible: true\n });\n\n case TRANSITION_TYPES.HIDE_DONE:\n return _objectSpread2({}, state, {\n isTransitioning: false,\n isVisible: false\n });\n\n default:\n throw new Error(\"Unhandled action type: \".concat(type));\n }\n};\n/**\n * \n * @typedef {{ el?: HTMLElement, duration?: number, hasDuration?: boolean, delay?: number, hasDelay?: boolean, timingFunction?: string, transitionClass?: string, before?: () => void, after?: () => void, transition?: () => void, showClass?: string, showClassElement?: HTMLElement }} TransitionOpts\n */\n\nvar DEFAULT_DURATION = .240;\nvar DEFAULT_DELAY = 0;\n/**\n * \n * @param {TransitionOpts} opts \n * @returns {Promise}\n */\n\nvar show = function show(opts) {\n return transition(opts, \"show\");\n};\n/**\n * \n * @param {TransitionOpts} opts\n * @returns {Promise} \n */\n\nvar hide = function hide(opts) {\n return transition(opts, \"hide\");\n};\n/**\n * \n * @param {TransitionOpts} opts \n * @param {\"show\"|\"hide\"} state \n * @returns {Promise}\n */\n\nvar transition = function transition(opts, state) {\n var el = opts.el;\n\n if (!el) {\n return Promise.resolve();\n } else {\n return new Promise(function (resolve) {\n var style = el.style;\n /**\n * @type {object} computedStyle\n */\n\n var computedStyle = isClient ? window.getComputedStyle(el) : {};\n var duration = opts.hasDuration && opts.duration !== undefined ? opts.duration * 1000.0 : styleDurationToMs(computedStyle.transitionDuration);\n var delay = opts.hasDelay && opts.delay !== undefined ? opts.delay * 1000.0 : styleDurationToMs(computedStyle.transitionDelay);\n var timingFunction = opts.timingFunction || computedStyle.transitionTimingFunction;\n\n if (opts.transitionClass) {\n el.classList.add(opts.transitionClass);\n }\n\n var before = function before() {\n style.transitionDuration = \"0ms\";\n style.transitionDelay = \"0ms\";\n\n if (opts.before && typeof opts.before === \"function\") {\n opts.before();\n }\n };\n\n var maybeBefore = opts.before && state === \"show\" ? before : opts.before && state === \"hide\" ? before : null;\n\n var after = function after() {\n if (opts.after && typeof opts.after === \"function\") {\n opts.after();\n }\n };\n\n var applyTransition = function applyTransition() {\n style.transitionDuration = duration + \"ms\";\n style.transitionDelay = delay + \"ms\";\n\n if (timingFunction) {\n style.transitionTimingFunction = timingFunction;\n }\n\n if (opts.showClass) {\n var showClassElement = opts.showClassElement || el;\n showClassElement.classList[state === \"show\" ? \"add\" : \"remove\"](opts.showClass);\n }\n\n if (opts.transition) {\n opts.transition();\n }\n };\n\n var doTransition = function doTransition() {\n applyTransition();\n setTimeout(function () {\n if (after) {\n after();\n }\n\n if (opts.transitionClass) {\n el.classList.remove(opts.transitionClass);\n el.offsetHeight; // force reflow\n }\n\n resolve();\n }, duration + delay);\n };\n\n var maybeDelayTransition = function maybeDelayTransition() {\n if (duration === 0) {\n doTransition();\n } else {\n setTimeout(doTransition, 0);\n }\n };\n\n if (maybeBefore) {\n maybeBefore();\n el.offsetHeight; // force reflow\n\n setTimeout(function () {\n maybeDelayTransition();\n }, 0);\n } else {\n maybeDelayTransition();\n }\n });\n }\n};\n/**\n * \n * @param {object} params\n * @param {(string) => void} [params.dispatchTransitionState]\n * @param {boolean} [params.isShow]\n * @param {boolean} [params.isTransitioning]\n * @param {string} [params.instanceId]\n * @param {(boolean) => void} [params.setIsTransitioning]\n * @param {(boolean) => void} [params.setIsVisible]\n * @param {object} [params.props]\n * @param {object} [params.domElements]\n * @param {() => void} [params.beforeTransition]\n * @param {() => void} [params.afterTransition]\n * @param {string} [params.showClass]\n * @param {string} [params.transitionClass]\n * @param {string} [params.referrer]\n * @returns {Promise}\n */\n\n\nvar transitionComponent = function transitionComponent(_ref) {\n var dispatchTransitionState = _ref.dispatchTransitionState,\n isTransitioning = _ref.isTransitioning,\n instanceId = _ref.instanceId,\n isShow = _ref.isShow,\n props = _ref.props,\n domElements = _ref.domElements,\n beforeTransition = _ref.beforeTransition,\n afterTransition = _ref.afterTransition,\n showClass = _ref.showClass,\n transitionClass = _ref.transitionClass,\n referrer = _ref.referrer;\n\n if (isTransitioning) {\n return Promise.resolve();\n }\n\n dispatchTransitionState(isShow ? TRANSITION_TYPES.SHOW : TRANSITION_TYPES.HIDE);\n\n if (beforeTransition) {\n beforeTransition();\n }\n\n var duration = isShow ? props.showDuration : props.hideDuration;\n var delay = isShow ? props.showDelay : props.hideDelay;\n var timingFunction = isShow ? props.showTimingFunction : props.hideTimingFunction;\n var transitions = props.transitions;\n var fn = isShow ? show : hide;\n\n var opts1 = _objectSpread2({}, props, {}, domElements, {\n showClass: showClass,\n transitionClass: transitionClass,\n duration: duration,\n delay: delay,\n timingFunction: timingFunction\n });\n\n var opts2 = _objectSpread2({}, opts1, {}, transitions ? (isShow ? transitions.show : transitions.hide)(opts1) : undefined);\n\n var opts3 = _objectSpread2({}, opts2, {}, {\n duration: opts2.duration !== undefined ? opts2.duration : DEFAULT_DURATION,\n hasDuration: opts2.duration !== undefined,\n delay: opts2.delay !== undefined ? opts2.delay : DEFAULT_DELAY,\n hasDelay: opts2.delay !== undefined\n });\n\n return fn(opts3).then(function () {\n var id = instanceId;\n\n if (afterTransition) {\n afterTransition();\n } // Component may unmount after this point\n\n\n if (isShow ? props.fromMultipleDidShow : props.fromMultipleDidHide) {\n (isShow ? props.fromMultipleDidShow : props.fromMultipleDidHide)(id); // when used with Multiple; this will call props.didShow / props.didHide\n } else if (isShow ? props.didShow : props.didHide) {\n (isShow ? props.didShow : props.didHide)(id); // when used directly\n }\n\n dispatchTransitionState(isShow ? TRANSITION_TYPES.SHOW_DONE : TRANSITION_TYPES.HIDE_DONE);\n });\n};\n\nexport { Multi, _Conditional, classForSize, deprecation, emit, filterSupportedAttributes, getAnimationEndEvent, getStyle, hide, iconDropdownDown, iconDropdownUp, initialTransitionState, isClient, isRTL, isServer, isTouch, pointerEndDownEvent, pointerEndEvent, pointerMoveEvent, pointerStartDownEvent, pointerStartEvent, show, styleDurationToMs, stylePropCompare, subscribe, throttle, transitionComponent, transitionStateReducer, unpackAttrs, unsubscribe };\n","import J2c from 'j2c';\nimport { isServer } from 'polythene-core';\n\n// @ts-check\n\n/**\n * @typedef {{[selector:string] : object}} Style\n * @typedef {Array element.\n * @param {...Array} styles - List of style Objects\n * @returns {void}\n */\n\nvar add = function add(id) {\n for (var _len = arguments.length, styles = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n styles[_key - 1] = arguments[_key];\n }\n\n return addToDocument.apply(void 0, [{\n id: id\n }].concat(styles));\n};\n/**\n * Removes a style from head.\n * @param {string} id - Identifier, used as HTMLElement id for the attached element.\n * @returns {void}\n */\n\n\nvar remove = function remove(id) {\n if (isServer) return;\n\n if (id) {\n var old = document.getElementById(id);\n\n if (old && old.parentNode) {\n old.parentNode.removeChild(old);\n }\n }\n};\n/**\n * Adds styles to the head.\n * @param {object} params\n * @param {string} params.id - Identifier, used as HTMLElement id for the attached element.\n * @param {object} [params.document] - Document reference.\n * @param {...Array} styles - List of style Objects.\n * @returns {void}\n */\n\n\nvar addToDocument = function addToDocument(_ref) {\n var id = _ref.id,\n document = _ref.document;\n if (isServer) return;\n var safeId = id.replace(ID_REGEX, \"_\");\n remove(safeId);\n var documentRef = document || window.document;\n var styleEl = documentRef.createElement(\"style\");\n\n if (safeId) {\n styleEl.setAttribute(\"id\", safeId);\n }\n\n for (var _len2 = arguments.length, styles = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {\n styles[_key2 - 1] = arguments[_key2];\n }\n\n styles.forEach(function (styles) {\n // each style returns a list\n if (Object.keys(styles).length) {\n styles.forEach(function (style) {\n var scoped = {\n \"@global\": style\n };\n var sheet = j2c.sheet(scoped);\n styleEl.appendChild(documentRef.createTextNode(sheet));\n });\n }\n });\n documentRef.head.appendChild(styleEl);\n};\n/**\n * \n * @param {object} params\n * @param {StyleObject|Array} params.styles\n * @param {string} [params.scope]\n * @returns {Array}\n */\n\n\nvar wrapInScope = function wrapInScope(_ref2) {\n var styles = _ref2.styles,\n scope = _ref2.scope;\n return scope ? [_defineProperty({}, scope, styles)] : styles;\n};\n/**\n * Adds component styles to head.\n * @param {object} params\n * @param {Array} params.selectors\n * @param {Array} params.fns\n * @param {object} params.vars\n * @param {object} [params.customVars]\n * @param {string} [params.mediaQuery]\n * @param {string} [params.scope]\n * @param {string} [params.identifier]\n * @returns {void}\n */\n\n\nvar addStyle = function addStyle(_ref4) {\n var selectors = _ref4.selectors,\n styleFns = _ref4.fns,\n vars = _ref4.vars,\n customVars = _ref4.customVars,\n mediaQuery = _ref4.mediaQuery,\n scope = _ref4.scope,\n identifier = _ref4.identifier;\n var prefix = scope ? \" \" : \"\";\n var selector = prefix + selectors.join(\"\");\n var styles = styleFns.map(function (fn) {\n return fn(selector, vars, customVars);\n }).filter(function (list) {\n return list.length > 0;\n });\n\n if (styles.length === 0) {\n return;\n }\n\n var id = identifier || selector.trim().replace(/^[^a-z]?(.*)/, \"$1\");\n add(id, wrapInScope({\n styles: wrapInScope({\n styles: styles,\n scope: scope\n }),\n scope: mediaQuery\n }));\n};\n/**\n * Returns a list of style objects for a component.\n * @param {object} params\n * @param {Array} params.selectors\n * @param {Array} params.fns\n * @param {object} params.vars - Style configuration variables\n * @param {object} [params.customVars] - Style configuration variables\n * @param {string} [params.mediaQuery] - Mediaquery string\n * @param {string} [params.scope] - Scope selector\n * @returns {Array}\n */\n\n\nvar getStyle = function getStyle(_ref5) {\n var selectors = _ref5.selectors,\n styleFns = _ref5.fns,\n vars = _ref5.vars,\n customVars = _ref5.customVars,\n mediaQuery = _ref5.mediaQuery,\n scope = _ref5.scope;\n var prefix = scope ? \" \" : \"\";\n var selector = prefix + selectors.join(\"\");\n var styles = styleFns.map(function (fn) {\n return fn(selector, vars, customVars);\n });\n return wrapInScope({\n styles: wrapInScope({\n styles: styles,\n scope: scope\n }),\n scope: mediaQuery\n });\n};\n/**\n * Adds component styles to head.\n * @param {string} selector \n * @param {Array} fns \n * @param {object} vars - Style configuration variables\n */\n\n\nvar createAddStyle = function createAddStyle(selector, fns, vars) {\n return (\n /**\n * @param {string} [customSelector=\"\"]\n * @param {object} customVars\n * @param {object} [scoping={}]\n * @param {string} [scoping.mediaQuery]\n * @param {string} [scoping.scope]\n * @returns {void}\n */\n function () {\n var customSelector = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : \"\";\n var customVars = arguments.length > 1 ? arguments[1] : undefined;\n\n var _ref6 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},\n mediaQuery = _ref6.mediaQuery,\n scope = _ref6.scope;\n\n return addStyle({\n selectors: [selector, customSelector],\n fns: fns,\n vars: vars,\n customVars: customVars,\n mediaQuery: mediaQuery,\n scope: scope\n });\n }\n );\n};\n/**\n * Returns styles for a component.\n * @param {string} selector \n * @param {Array} fns \n * @param {object} vars - Style configuration variables\n */\n\n\nvar createGetStyle = function createGetStyle(selector, fns, vars) {\n return (\n /**\n * @param {string} [customSelector=\"\"]\n * @param {object} customVars\n * @param {object} [scoping={}]\n * @param {string} [scoping.mediaQuery]\n * @param {string} [scoping.scope]\n * @returns {Array}\n */\n function () {\n var customSelector = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : \"\";\n var customVars = arguments.length > 1 ? arguments[1] : undefined;\n\n var _ref7 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},\n mediaQuery = _ref7.mediaQuery,\n scope = _ref7.scope;\n\n return [getStyle({\n selectors: [selector, customSelector],\n fns: fns,\n vars: vars,\n customVars: customVars,\n mediaQuery: mediaQuery,\n scope: scope\n })];\n }\n );\n};\n\nvar styler = {\n add: add,\n addStyle: addStyle,\n addToDocument: addToDocument,\n createAddStyle: createAddStyle,\n createGetStyle: createGetStyle,\n getStyle: getStyle,\n remove: remove\n};\n\n// @ts-check\n\n/**\n * @typedef {(selector: string, vars: object, customVars?: object) => Array} StyleFn\n * @typedef {{[s: string]: StyleFn}} StyleCollection\n */\n\n/**\n * Wraps an object with a selector.\n * @param {string} selector \n * @param {object} o \n * @returns {object}\n */\nvar sel = function sel(selector, o) {\n return _defineProperty({}, selector, o);\n};\n/**\n * Creates a right-to-left selector.\n * @param {string} selector\n * @returns {string}\n */\n\nvar selectorRTL = function selectorRTL(selector) {\n return \"*[dir=rtl] \".concat(selector, \", .pe-rtl \").concat(selector);\n};\n/**\n * Creates a rgba CSS color string.\n * @param {string} colorStr \n * @param {number} opacity \n * @returns {string}\n */\n\nvar rgba = function rgba(colorStr) {\n var opacity = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;\n return \"rgba(\".concat(colorStr, \", \").concat(opacity, \")\");\n};\n/**\n * @param {object} params\n * @param {string} [params.selector]\n * @param {string} [params.scopedSelector]\n * @param {StyleCollection} [params.varFns]\n * @param {StyleCollection} [params.customVarFns]\n * @param {StyleFn} [params.superStyle]\n * @param {(_:any) => StyleCollection} [params.varMixin]\n * @param {StyleCollection} [params.componentVars]\n * @param {StyleCollection} [params.customVars]\n * @returns {Array}\n */\n\nvar createStyle = function createStyle(_ref2) {\n var varFns = _ref2.varFns,\n customVarFns = _ref2.customVarFns,\n superStyle = _ref2.superStyle,\n varMixin = _ref2.varMixin,\n selector = _ref2.selector,\n scopedSelector = _ref2.scopedSelector,\n _ref2$componentVars = _ref2.componentVars,\n componentVars = _ref2$componentVars === void 0 ? {} : _ref2$componentVars,\n customVars = _ref2.customVars;\n\n var allVars = _objectSpread2({}, componentVars, {}, customVars);\n\n var currentVars = customVars ? customVars : allVars;\n\n var general_styles = componentVars.general_styles,\n otherVars = _objectWithoutProperties(componentVars, [\"general_styles\"]);\n\n var baseLayout = superStyle !== undefined ? customVars !== undefined ? superStyle(selector, componentVars, customVars) : superStyle(selector, otherVars) : [];\n\n var fns = _objectSpread2({}, customVars ? customVarFns : {}, {}, varFns);\n\n return baseLayout.concat(Object.keys(varMixin(currentVars)).map(function (v) {\n return fns && fns[v] !== undefined ? fns[v](scopedSelector, allVars) : null;\n }).filter(function (s) {\n return s;\n }));\n};\n/**\n * \n * @param {object} params\n * @param {StyleCollection} [params.varFns]\n * @param {StyleCollection} [params.customVarFns]\n * @param {StyleFn} [params.superLayout]\n * @param {(_:any) => StyleCollection} [params.varMixin]\n * @returns {StyleFn}\n */\n\n\nvar createLayout = function createLayout(_ref3) {\n var varFns = _ref3.varFns,\n customVarFns = _ref3.customVarFns,\n superLayout = _ref3.superLayout,\n _ref3$varMixin = _ref3.varMixin,\n varMixin = _ref3$varMixin === void 0 ? function (o) {\n return o;\n } : _ref3$varMixin;\n return (\n /**\n * @param {string} selector\n * @param {object} componentVars\n * @param {object} [customVars]\n * @returns {Array}\n */\n function (selector, componentVars, customVars) {\n return createStyle({\n varFns: varFns,\n customVarFns: customVarFns,\n superStyle: superLayout,\n varMixin: varMixin,\n selector: selector,\n scopedSelector: selector,\n componentVars: componentVars,\n customVars: customVars\n });\n }\n );\n};\n/**\n * \n * @param {object} params\n * @param {string} [params.selector]\n * @param {string} [params.scopedSelector]\n * @param {object} [params.componentVars]\n * @param {object} [params.customVars] \n * @param {StyleFn} [params.superColor]\n * @param {StyleCollection} [params.varFns]\n * @param {(_:any) => StyleCollection} [params.varMixin]\n * @returns {Array}\n */\n\nvar createColorStyle = function createColorStyle(_ref4) {\n var selector = _ref4.selector,\n scopedSelector = _ref4.scopedSelector,\n componentVars = _ref4.componentVars,\n customVars = _ref4.customVars,\n varFns = _ref4.varFns,\n superColor = _ref4.superColor,\n varMixin = _ref4.varMixin;\n return createStyle({\n varFns: varFns,\n superStyle: superColor,\n varMixin: varMixin,\n selector: selector,\n scopedSelector: scopedSelector,\n componentVars: componentVars,\n customVars: customVars\n });\n};\n/**\n * \n * @param {object} params \n * @param {Array} params.scopes\n * @param {string} params.selector\n * @param {boolean} params.isNoTouch\n* @returns {string}\n */\n\nvar appendPseudoClass = function appendPseudoClass(_ref5) {\n var scopes = _ref5.scopes,\n selector = _ref5.selector,\n isNoTouch = _ref5.isNoTouch;\n return isNoTouch ? scopes.map(function (s) {\n return s + selector + \":hover\";\n }).join(\",\") : scopes.map(function (s) {\n return s + selector;\n }).join(\",\");\n};\n/**\n * \n * @param {object} params \n * @param {Array} params.scopes\n * @param {string} params.selector\n * @param {boolean} [params.isNoTouch]\n * @returns {string}\n */\n\n\nvar createScopedSelector = function createScopedSelector(_ref6) {\n var scopes = _ref6.scopes,\n selector = _ref6.selector,\n _ref6$isNoTouch = _ref6.isNoTouch,\n isNoTouch = _ref6$isNoTouch === void 0 ? false : _ref6$isNoTouch;\n return selector.split(/\\s*,\\s*/).map(function (s) {\n return appendPseudoClass({\n scopes: scopes,\n selector: s,\n isNoTouch: isNoTouch\n });\n }).join(\"\");\n};\n/**\n * @typedef {object} ColorScopeObject\n * @property {Array} scopes\n * @property {string} varFnName\n * @property {boolean} isNoTouch\n */\n\n/**\n * @type {Array} colorScopes\n */\n\n\nvar colorScopes = [{\n // has/inside dark tone\n scopes: [\".pe-dark-tone\", \".pe-dark-tone \"],\n varFnName: \"darkTintFns\",\n isNoTouch: false\n}, {\n // normal, has/inside light tone\n scopes: [\"\", \".pe-light-tone\", \".pe-light-tone \"],\n varFnName: \"lightTintFns\",\n isNoTouch: false\n}, {\n // has/inside dark tone\n scopes: [\".pe-no-touch .pe-dark-tone \"],\n varFnName: \"darkTintHoverFns\",\n isNoTouch: true\n}, {\n // normal, has/inside light tone\n scopes: [\".pe-no-touch \", \".pe-no-touch .pe-light-tone \"],\n varFnName: \"lightTintHoverFns\",\n isNoTouch: true\n}];\n/**\n * \n * @param {object} params\n * @param {object} [params.varFns]\n * @param {StyleFn} [params.superColor]\n * @param {(_:any) => StyleCollection} [params.varMixin]\n * @returns {StyleFn}\n */\n\nvar createColor = function createColor(_ref7) {\n var _ref7$varFns = _ref7.varFns,\n varFns = _ref7$varFns === void 0 ? {} : _ref7$varFns,\n superColor = _ref7.superColor,\n _ref7$varMixin = _ref7.varMixin,\n varMixin = _ref7$varMixin === void 0 ? function (o) {\n return o;\n } : _ref7$varMixin;\n return (\n /**\n * @param {string} selector\n * @param {object} componentVars\n * @param {object} [customVars]\n * @returns {Array}\n */\n function (selector, componentVars, customVars) {\n return colorScopes.map(function (_ref8) {\n var scopes = _ref8.scopes,\n varFnName = _ref8.varFnName,\n isNoTouch = _ref8.isNoTouch;\n return createColorStyle({\n selector: selector,\n scopedSelector: createScopedSelector({\n scopes: scopes,\n selector: selector,\n isNoTouch: isNoTouch\n }),\n componentVars: componentVars,\n customVars: customVars,\n varFns: varFns[varFnName],\n superColor: superColor,\n varMixin: varMixin\n });\n });\n }\n );\n};\n/**\n * @param {object} vars \n * @param {object} behaviorVars\n * @returns {string|undefined} \n */\n\nvar createMarkerValue = function createMarkerValue(vars, behaviorVars) {\n var marker = Object.keys(behaviorVars).filter(function (bvar) {\n return vars[bvar] === true;\n }).join(\".\");\n return marker ? \"\\\"\".concat(marker, \"\\\"\") : undefined;\n};\n/**\n * Creates a CSS style from which the key can be read from the `content` property.\n * @param {object} vars \n * @param {object} behaviorVars \n * @returns {object}\n */\n\n\nvar createMarker = function createMarker(vars, behaviorVars) {\n if (!vars) {\n console.error(\"createMarker requires param `vars`\"); // eslint-disable-line no-console\n }\n\n var value = createMarkerValue(vars, behaviorVars);\n return value ? {\n \":before\": {\n content: value,\n display: \"none\"\n }\n } : undefined;\n};\n\n// @ts-check\n/**\n * @typedef {{[selector:string] : Style | any}} Style\n */\n\n/**\n * @type {Array