wj-elements 0.1.198 → 0.1.200
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -184,6 +184,8 @@ class RouterOutlet extends AnimatedOutlet {
|
|
|
184
184
|
* @type {string}
|
|
185
185
|
*/
|
|
186
186
|
__publicField(this, "className", "RouterOutlet");
|
|
187
|
+
}
|
|
188
|
+
connectedCallback() {
|
|
187
189
|
const styleEl = document.createElement("style");
|
|
188
190
|
styleEl.textContent = styles;
|
|
189
191
|
this.parentNode.insertBefore(styleEl, this);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wje-router-outlet.js","sources":["../node_modules/slick-router/lib/components/animated-outlet.js","../packages/wje-router-outlet/router-outlet.element.js","../packages/wje-router-outlet/router-outlet.js"],"sourcesContent":["export class AnimationHook {\r\n constructor(options = {}) {\r\n this.options = options\r\n }\r\n\r\n getOption(outlet, name) {\r\n return outlet.hasAttribute(name) ? outlet.getAttribute(name) : this.options[name]\r\n }\r\n\r\n hasOption(outlet, name) {\r\n return outlet.hasAttribute(name) || this.options[name]\r\n }\r\n\r\n runParallel(outlet) {\r\n return this.hasOption(outlet, 'parallel')\r\n }\r\n\r\n beforeEnter(outlet, el) {}\r\n\r\n enter(outlet, el) {}\r\n\r\n leave(outlet, el, done) {\r\n done()\r\n }\r\n}\r\n\r\n// code extracted from vue\r\nconst raf = window.requestAnimationFrame\r\nconst TRANSITION = 'transition'\r\nconst ANIMATION = 'animation'\r\n\r\n// Transition property/event sniffing\r\nconst transitionProp = 'transition'\r\nconst transitionEndEvent = 'transitionend'\r\nconst animationProp = 'animation'\r\nconst animationEndEvent = 'animationend'\r\n\r\nfunction nextFrame(fn) {\r\n raf(function () {\r\n raf(fn)\r\n })\r\n}\r\n\r\nfunction whenTransitionEnds(el, cb) {\r\n const ref = getTransitionInfo(el)\r\n const type = ref.type\r\n const timeout = ref.timeout\r\n const propCount = ref.propCount\r\n if (!type) {\r\n return cb()\r\n }\r\n const event = type === TRANSITION ? transitionEndEvent : animationEndEvent\r\n let ended = 0\r\n const end = function () {\r\n el.removeEventListener(event, onEnd)\r\n cb()\r\n }\r\n const onEnd = function (e) {\r\n if (e.target === el) {\r\n if (++ended >= propCount) {\r\n end()\r\n }\r\n }\r\n }\r\n setTimeout(function () {\r\n if (ended < propCount) {\r\n end()\r\n }\r\n }, timeout + 1)\r\n el.addEventListener(event, onEnd)\r\n}\r\n\r\nfunction getTransitionInfo(el) {\r\n const styles = window.getComputedStyle(el)\r\n // JSDOM may return undefined for transition properties\r\n const transitionDelays = (styles[transitionProp + 'Delay'] || '').split(', ')\r\n const transitionDurations = (styles[transitionProp + 'Duration'] || '').split(', ')\r\n const transitionTimeout = getTimeout(transitionDelays, transitionDurations)\r\n const animationDelays = (styles[animationProp + 'Delay'] || '').split(', ')\r\n const animationDurations = (styles[animationProp + 'Duration'] || '').split(', ')\r\n const animationTimeout = getTimeout(animationDelays, animationDurations)\r\n\r\n const timeout = Math.max(transitionTimeout, animationTimeout)\r\n const type = timeout > 0 ? (transitionTimeout > animationTimeout ? TRANSITION : ANIMATION) : null\r\n const propCount = type\r\n ? type === TRANSITION\r\n ? transitionDurations.length\r\n : animationDurations.length\r\n : 0\r\n\r\n return {\r\n type,\r\n timeout,\r\n propCount,\r\n }\r\n}\r\n\r\nfunction getTimeout(delays, durations) {\r\n /* istanbul ignore next */\r\n while (delays.length < durations.length) {\r\n delays = delays.concat(delays)\r\n }\r\n\r\n return Math.max.apply(\r\n null,\r\n durations.map(function (d, i) {\r\n return toMs(d) + toMs(delays[i])\r\n }),\r\n )\r\n}\r\n\r\n// Old versions of Chromium (below 61.0.3163.100) formats floating pointer numbers\r\n// in a locale-dependent way, using a comma instead of a dot.\r\n// If comma is not replaced with a dot, the input will be rounded down (i.e. acting\r\n// as a floor function) causing unexpected behaviors\r\nfunction toMs(s) {\r\n return Number(s.slice(0, -1).replace(',', '.')) * 1000\r\n}\r\n\r\nfunction runTransition(el, name, type, cb) {\r\n el.classList.add(`${name}-${type}-active`)\r\n nextFrame(function () {\r\n el.classList.remove(`${name}-${type}`)\r\n el.classList.add(`${name}-${type}-to`)\r\n whenTransitionEnds(el, function () {\r\n el.classList.remove(`${name}-${type}-active`, `${name}-${type}-to`)\r\n if (cb) cb()\r\n })\r\n })\r\n}\r\n\r\nexport class GenericCSS extends AnimationHook {\r\n beforeEnter(outlet, el) {\r\n const name = outlet.getAttribute('animation') || 'outlet'\r\n el.classList.add(`${name}-enter`)\r\n }\r\n\r\n enter(outlet, el) {\r\n const name = outlet.getAttribute('animation') || 'outlet'\r\n runTransition(el, name, 'enter')\r\n }\r\n\r\n leave(outlet, el, done) {\r\n const name = outlet.getAttribute('animation') || 'outlet'\r\n el.classList.add(`${name}-leave`)\r\n runTransition(el, name, 'leave', done)\r\n }\r\n}\r\n\r\nexport class AnimateCSS extends AnimationHook {\r\n beforeEnter(outlet, el) {\r\n const enter = this.getOption(outlet, 'enter')\r\n if (enter) {\r\n el.style.display = 'none'\r\n }\r\n }\r\n\r\n enter(outlet, el) {\r\n const enter = this.getOption(outlet, 'enter')\r\n if (!enter) return\r\n el.style.display = 'block'\r\n el.classList.add('animated', enter)\r\n el.addEventListener(\r\n 'animationend',\r\n () => {\r\n el.classList.remove('animated', enter)\r\n },\r\n { once: true },\r\n )\r\n }\r\n\r\n leave(outlet, el, done) {\r\n const leave = this.getOption(outlet, 'leave')\r\n if (!leave) {\r\n done()\r\n return\r\n }\r\n el.classList.add('animated', leave)\r\n el.addEventListener('animationend', done, { once: true })\r\n }\r\n}\r\n\r\nconst animationRegistry = {}\r\nlet defaultHook\r\n\r\nexport function registerAnimation(name, AnimationHookClass, options = {}) {\r\n animationRegistry[name] = new AnimationHookClass(options)\r\n}\r\n\r\nexport function setDefaultAnimation(AnimationHookClass, options = {}) {\r\n defaultHook = new AnimationHookClass(options)\r\n}\r\n\r\nfunction getAnimationHook(name) {\r\n return animationRegistry[name] || defaultHook || (defaultHook = new GenericCSS())\r\n}\r\n\r\nexport class AnimatedOutlet extends HTMLElement {\r\n appendChild(el) {\r\n if (!this.hasAttribute('animation')) {\r\n super.appendChild(el)\r\n return\r\n }\r\n const hook = getAnimationHook(this.getAttribute('animation'))\r\n const runParallel = hook.runParallel(this)\r\n\r\n hook.beforeEnter(this, el)\r\n super.appendChild(el)\r\n if (!runParallel && this.removing) {\r\n // when removing a previous el, append animation is run after remove one\r\n this.appending = el\r\n } else {\r\n hook.enter(this, el)\r\n }\r\n }\r\n\r\n removeChild(el) {\r\n if (!this.hasAttribute('animation')) {\r\n super.removeChild(el)\r\n return\r\n }\r\n const hook = getAnimationHook(this.getAttribute('animation'))\r\n\r\n if (this.removing && this.removing.parentNode === this) {\r\n super.removeChild(this.removing)\r\n }\r\n\r\n if (el === this.appending) {\r\n if (el.parentNode === this) {\r\n super.removeChild(el)\r\n }\r\n this.removing = null\r\n return\r\n }\r\n\r\n this.removing = el\r\n hook.leave(this, el, () => {\r\n if (this.removing && this.removing.parentNode === this) {\r\n super.removeChild(this.removing)\r\n }\r\n if (this.appending) hook.enter(this, this.appending)\r\n this.appending = null\r\n this.removing = null\r\n })\r\n }\r\n}\r\n","import { AnimatedOutlet, GenericCSS, setDefaultAnimation } from 'slick-router/components/animated-outlet.js';\n\nimport styles from './styles/styles.css?inline';\n\nsetDefaultAnimation(GenericCSS);\n\n/**\n * `Route` is a custom web component that represents a route in a routing system.\n * @summary This element represents a route in a routing system.\n * @documentation https://elements.webjet.sk/components/route\n * @status stable\n * @augments AnimatedOutlet\n * @tag wje-router-outlet\n */\nexport default class RouterOutlet extends AnimatedOutlet {\n /**\n * Creates an instance of Route.\n */\n constructor() {\n super();\n\n const styleEl = document.createElement('style');\n styleEl.textContent = styles;\n this.parentNode.insertBefore(styleEl, this);\n }\n\n /**\n * The class name for the component.\n * @type {string}\n */\n className = 'RouterOutlet';\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport RouterOutlet from './router-outlet.element.js';\n\nexport default RouterOutlet;\n\nWJElement.define('wje-router-outlet', RouterOutlet);\n"],"names":["styles"],"mappings":";;;;AAAO,MAAM,cAAc;AAAA,EACzB,YAAY,UAAU,IAAI;AACxB,SAAK,UAAU;AAAA,EAChB;AAAA,EAED,UAAU,QAAQ,MAAM;AACtB,WAAO,OAAO,aAAa,IAAI,IAAI,OAAO,aAAa,IAAI,IAAI,KAAK,QAAQ,IAAI;AAAA,EACjF;AAAA,EAED,UAAU,QAAQ,MAAM;AACtB,WAAO,OAAO,aAAa,IAAI,KAAK,KAAK,QAAQ,IAAI;AAAA,EACtD;AAAA,EAED,YAAY,QAAQ;AAClB,WAAO,KAAK,UAAU,QAAQ,UAAU;AAAA,EACzC;AAAA,EAED,YAAY,QAAQ,IAAI;AAAA,EAAE;AAAA,EAE1B,MAAM,QAAQ,IAAI;AAAA,EAAE;AAAA,EAEpB,MAAM,QAAQ,IAAI,MAAM;AACtB,SAAM;AAAA,EACP;AACH;AAGA,MAAM,MAAM,OAAO;AACnB,MAAM,aAAa;AACnB,MAAM,YAAY;AAGlB,MAAM,iBAAiB;AACvB,MAAM,qBAAqB;AAC3B,MAAM,gBAAgB;AACtB,MAAM,oBAAoB;AAE1B,SAAS,UAAU,IAAI;AACrB,MAAI,WAAY;AACd,QAAI,EAAE;AAAA,EACV,CAAG;AACH;AAEA,SAAS,mBAAmB,IAAI,IAAI;AAClC,QAAM,MAAM,kBAAkB,EAAE;AAChC,QAAM,OAAO,IAAI;AACjB,QAAM,UAAU,IAAI;AACpB,QAAM,YAAY,IAAI;AACtB,MAAI,CAAC,MAAM;AACT,WAAO,GAAI;AAAA,EACZ;AACD,QAAM,QAAQ,SAAS,aAAa,qBAAqB;AACzD,MAAI,QAAQ;AACZ,QAAM,MAAM,WAAY;AACtB,OAAG,oBAAoB,OAAO,KAAK;AACnC,OAAI;AAAA,EACL;AACD,QAAM,QAAQ,SAAU,GAAG;AACzB,QAAI,EAAE,WAAW,IAAI;AACnB,UAAI,EAAE,SAAS,WAAW;AACxB,YAAK;AAAA,MACN;AAAA,IACF;AAAA,EACF;AACD,aAAW,WAAY;AACrB,QAAI,QAAQ,WAAW;AACrB,UAAK;AAAA,IACN;AAAA,EACL,GAAK,UAAU,CAAC;AACd,KAAG,iBAAiB,OAAO,KAAK;AAClC;AAEA,SAAS,kBAAkB,IAAI;AAC7B,QAAMA,UAAS,OAAO,iBAAiB,EAAE;AAEzC,QAAM,oBAAoBA,QAAO,iBAAiB,OAAO,KAAK,IAAI,MAAM,IAAI;AAC5E,QAAM,uBAAuBA,QAAO,iBAAiB,UAAU,KAAK,IAAI,MAAM,IAAI;AAClF,QAAM,oBAAoB,WAAW,kBAAkB,mBAAmB;AAC1E,QAAM,mBAAmBA,QAAO,gBAAgB,OAAO,KAAK,IAAI,MAAM,IAAI;AAC1E,QAAM,sBAAsBA,QAAO,gBAAgB,UAAU,KAAK,IAAI,MAAM,IAAI;AAChF,QAAM,mBAAmB,WAAW,iBAAiB,kBAAkB;AAEvE,QAAM,UAAU,KAAK,IAAI,mBAAmB,gBAAgB;AAC5D,QAAM,OAAO,UAAU,IAAK,oBAAoB,mBAAmB,aAAa,YAAa;AAC7F,QAAM,YAAY,OACd,SAAS,aACP,oBAAoB,SACpB,mBAAmB,SACrB;AAEJ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACH;AAEA,SAAS,WAAW,QAAQ,WAAW;AAErC,SAAO,OAAO,SAAS,UAAU,QAAQ;AACvC,aAAS,OAAO,OAAO,MAAM;AAAA,EAC9B;AAED,SAAO,KAAK,IAAI;AAAA,IACd;AAAA,IACA,UAAU,IAAI,SAAU,GAAG,GAAG;AAC5B,aAAO,KAAK,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC;AAAA,IACrC,CAAK;AAAA,EACF;AACH;AAMA,SAAS,KAAK,GAAG;AACf,SAAO,OAAO,EAAE,MAAM,GAAG,EAAE,EAAE,QAAQ,KAAK,GAAG,CAAC,IAAI;AACpD;AAEA,SAAS,cAAc,IAAI,MAAM,MAAM,IAAI;AACzC,KAAG,UAAU,IAAI,GAAG,IAAI,IAAI,IAAI,SAAS;AACzC,YAAU,WAAY;AACpB,OAAG,UAAU,OAAO,GAAG,IAAI,IAAI,IAAI,EAAE;AACrC,OAAG,UAAU,IAAI,GAAG,IAAI,IAAI,IAAI,KAAK;AACrC,uBAAmB,IAAI,WAAY;AACjC,SAAG,UAAU,OAAO,GAAG,IAAI,IAAI,IAAI,WAAW,GAAG,IAAI,IAAI,IAAI,KAAK;AAClE,UAAI,GAAI,IAAI;AAAA,IAClB,CAAK;AAAA,EACL,CAAG;AACH;AAEO,MAAM,mBAAmB,cAAc;AAAA,EAC5C,YAAY,QAAQ,IAAI;AACtB,UAAM,OAAO,OAAO,aAAa,WAAW,KAAK;AACjD,OAAG,UAAU,IAAI,GAAG,IAAI,QAAQ;AAAA,EACjC;AAAA,EAED,MAAM,QAAQ,IAAI;AAChB,UAAM,OAAO,OAAO,aAAa,WAAW,KAAK;AACjD,kBAAc,IAAI,MAAM,OAAO;AAAA,EAChC;AAAA,EAED,MAAM,QAAQ,IAAI,MAAM;AACtB,UAAM,OAAO,OAAO,aAAa,WAAW,KAAK;AACjD,OAAG,UAAU,IAAI,GAAG,IAAI,QAAQ;AAChC,kBAAc,IAAI,MAAM,SAAS,IAAI;AAAA,EACtC;AACH;AAmCA,MAAM,oBAAoB,CAAE;AAC5B,IAAI;AAMG,SAAS,oBAAoB,oBAAoB,UAAU,IAAI;AACpE,gBAAc,IAAI,mBAAmB,OAAO;AAC9C;AAEA,SAAS,iBAAiB,MAAM;AAC9B,SAAO,kBAAkB,IAAI,KAAK,gBAAgB,cAAc,IAAI;AACtE;AAEO,MAAM,uBAAuB,YAAY;AAAA,EAC9C,YAAY,IAAI;AACd,QAAI,CAAC,KAAK,aAAa,WAAW,GAAG;AACnC,YAAM,YAAY,EAAE;AACpB;AAAA,IACD;AACD,UAAM,OAAO,iBAAiB,KAAK,aAAa,WAAW,CAAC;AAC5D,UAAM,cAAc,KAAK,YAAY,IAAI;AAEzC,SAAK,YAAY,MAAM,EAAE;AACzB,UAAM,YAAY,EAAE;AACpB,QAAI,CAAC,eAAe,KAAK,UAAU;AAEjC,WAAK,YAAY;AAAA,IACvB,OAAW;AACL,WAAK,MAAM,MAAM,EAAE;AAAA,IACpB;AAAA,EACF;AAAA,EAED,YAAY,IAAI;AACd,QAAI,CAAC,KAAK,aAAa,WAAW,GAAG;AACnC,YAAM,YAAY,EAAE;AACpB;AAAA,IACD;AACD,UAAM,OAAO,iBAAiB,KAAK,aAAa,WAAW,CAAC;AAE5D,QAAI,KAAK,YAAY,KAAK,SAAS,eAAe,MAAM;AACtD,YAAM,YAAY,KAAK,QAAQ;AAAA,IAChC;AAED,QAAI,OAAO,KAAK,WAAW;AACzB,UAAI,GAAG,eAAe,MAAM;AAC1B,cAAM,YAAY,EAAE;AAAA,MACrB;AACD,WAAK,WAAW;AAChB;AAAA,IACD;AAED,SAAK,WAAW;AAChB,SAAK,MAAM,MAAM,IAAI,MAAM;AACzB,UAAI,KAAK,YAAY,KAAK,SAAS,eAAe,MAAM;AACtD,cAAM,YAAY,KAAK,QAAQ;AAAA,MAChC;AACD,UAAI,KAAK,UAAW,MAAK,MAAM,MAAM,KAAK,SAAS;AACnD,WAAK,YAAY;AACjB,WAAK,WAAW;AAAA,IACtB,CAAK;AAAA,EACF;AACH;;ACjPA,oBAAoB,UAAU;AAUf,MAAM,qBAAqB,eAAe;AAAA;AAAA;AAAA;AAAA,EAIrD,cAAc;AACV,UAAO;AAWX;AAAA;AAAA;AAAA;AAAA,qCAAY;AATR,UAAM,UAAU,SAAS,cAAc,OAAO;AAC9C,YAAQ,cAAc;AACtB,SAAK,WAAW,aAAa,SAAS,IAAI;AAAA,EAClD;AAOA;AC1BA,UAAU,OAAO,qBAAqB,YAAY;","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"wje-router-outlet.js","sources":["../node_modules/slick-router/lib/components/animated-outlet.js","../packages/wje-router-outlet/router-outlet.element.js","../packages/wje-router-outlet/router-outlet.js"],"sourcesContent":["export class AnimationHook {\r\n constructor(options = {}) {\r\n this.options = options\r\n }\r\n\r\n getOption(outlet, name) {\r\n return outlet.hasAttribute(name) ? outlet.getAttribute(name) : this.options[name]\r\n }\r\n\r\n hasOption(outlet, name) {\r\n return outlet.hasAttribute(name) || this.options[name]\r\n }\r\n\r\n runParallel(outlet) {\r\n return this.hasOption(outlet, 'parallel')\r\n }\r\n\r\n beforeEnter(outlet, el) {}\r\n\r\n enter(outlet, el) {}\r\n\r\n leave(outlet, el, done) {\r\n done()\r\n }\r\n}\r\n\r\n// code extracted from vue\r\nconst raf = window.requestAnimationFrame\r\nconst TRANSITION = 'transition'\r\nconst ANIMATION = 'animation'\r\n\r\n// Transition property/event sniffing\r\nconst transitionProp = 'transition'\r\nconst transitionEndEvent = 'transitionend'\r\nconst animationProp = 'animation'\r\nconst animationEndEvent = 'animationend'\r\n\r\nfunction nextFrame(fn) {\r\n raf(function () {\r\n raf(fn)\r\n })\r\n}\r\n\r\nfunction whenTransitionEnds(el, cb) {\r\n const ref = getTransitionInfo(el)\r\n const type = ref.type\r\n const timeout = ref.timeout\r\n const propCount = ref.propCount\r\n if (!type) {\r\n return cb()\r\n }\r\n const event = type === TRANSITION ? transitionEndEvent : animationEndEvent\r\n let ended = 0\r\n const end = function () {\r\n el.removeEventListener(event, onEnd)\r\n cb()\r\n }\r\n const onEnd = function (e) {\r\n if (e.target === el) {\r\n if (++ended >= propCount) {\r\n end()\r\n }\r\n }\r\n }\r\n setTimeout(function () {\r\n if (ended < propCount) {\r\n end()\r\n }\r\n }, timeout + 1)\r\n el.addEventListener(event, onEnd)\r\n}\r\n\r\nfunction getTransitionInfo(el) {\r\n const styles = window.getComputedStyle(el)\r\n // JSDOM may return undefined for transition properties\r\n const transitionDelays = (styles[transitionProp + 'Delay'] || '').split(', ')\r\n const transitionDurations = (styles[transitionProp + 'Duration'] || '').split(', ')\r\n const transitionTimeout = getTimeout(transitionDelays, transitionDurations)\r\n const animationDelays = (styles[animationProp + 'Delay'] || '').split(', ')\r\n const animationDurations = (styles[animationProp + 'Duration'] || '').split(', ')\r\n const animationTimeout = getTimeout(animationDelays, animationDurations)\r\n\r\n const timeout = Math.max(transitionTimeout, animationTimeout)\r\n const type = timeout > 0 ? (transitionTimeout > animationTimeout ? TRANSITION : ANIMATION) : null\r\n const propCount = type\r\n ? type === TRANSITION\r\n ? transitionDurations.length\r\n : animationDurations.length\r\n : 0\r\n\r\n return {\r\n type,\r\n timeout,\r\n propCount,\r\n }\r\n}\r\n\r\nfunction getTimeout(delays, durations) {\r\n /* istanbul ignore next */\r\n while (delays.length < durations.length) {\r\n delays = delays.concat(delays)\r\n }\r\n\r\n return Math.max.apply(\r\n null,\r\n durations.map(function (d, i) {\r\n return toMs(d) + toMs(delays[i])\r\n }),\r\n )\r\n}\r\n\r\n// Old versions of Chromium (below 61.0.3163.100) formats floating pointer numbers\r\n// in a locale-dependent way, using a comma instead of a dot.\r\n// If comma is not replaced with a dot, the input will be rounded down (i.e. acting\r\n// as a floor function) causing unexpected behaviors\r\nfunction toMs(s) {\r\n return Number(s.slice(0, -1).replace(',', '.')) * 1000\r\n}\r\n\r\nfunction runTransition(el, name, type, cb) {\r\n el.classList.add(`${name}-${type}-active`)\r\n nextFrame(function () {\r\n el.classList.remove(`${name}-${type}`)\r\n el.classList.add(`${name}-${type}-to`)\r\n whenTransitionEnds(el, function () {\r\n el.classList.remove(`${name}-${type}-active`, `${name}-${type}-to`)\r\n if (cb) cb()\r\n })\r\n })\r\n}\r\n\r\nexport class GenericCSS extends AnimationHook {\r\n beforeEnter(outlet, el) {\r\n const name = outlet.getAttribute('animation') || 'outlet'\r\n el.classList.add(`${name}-enter`)\r\n }\r\n\r\n enter(outlet, el) {\r\n const name = outlet.getAttribute('animation') || 'outlet'\r\n runTransition(el, name, 'enter')\r\n }\r\n\r\n leave(outlet, el, done) {\r\n const name = outlet.getAttribute('animation') || 'outlet'\r\n el.classList.add(`${name}-leave`)\r\n runTransition(el, name, 'leave', done)\r\n }\r\n}\r\n\r\nexport class AnimateCSS extends AnimationHook {\r\n beforeEnter(outlet, el) {\r\n const enter = this.getOption(outlet, 'enter')\r\n if (enter) {\r\n el.style.display = 'none'\r\n }\r\n }\r\n\r\n enter(outlet, el) {\r\n const enter = this.getOption(outlet, 'enter')\r\n if (!enter) return\r\n el.style.display = 'block'\r\n el.classList.add('animated', enter)\r\n el.addEventListener(\r\n 'animationend',\r\n () => {\r\n el.classList.remove('animated', enter)\r\n },\r\n { once: true },\r\n )\r\n }\r\n\r\n leave(outlet, el, done) {\r\n const leave = this.getOption(outlet, 'leave')\r\n if (!leave) {\r\n done()\r\n return\r\n }\r\n el.classList.add('animated', leave)\r\n el.addEventListener('animationend', done, { once: true })\r\n }\r\n}\r\n\r\nconst animationRegistry = {}\r\nlet defaultHook\r\n\r\nexport function registerAnimation(name, AnimationHookClass, options = {}) {\r\n animationRegistry[name] = new AnimationHookClass(options)\r\n}\r\n\r\nexport function setDefaultAnimation(AnimationHookClass, options = {}) {\r\n defaultHook = new AnimationHookClass(options)\r\n}\r\n\r\nfunction getAnimationHook(name) {\r\n return animationRegistry[name] || defaultHook || (defaultHook = new GenericCSS())\r\n}\r\n\r\nexport class AnimatedOutlet extends HTMLElement {\r\n appendChild(el) {\r\n if (!this.hasAttribute('animation')) {\r\n super.appendChild(el)\r\n return\r\n }\r\n const hook = getAnimationHook(this.getAttribute('animation'))\r\n const runParallel = hook.runParallel(this)\r\n\r\n hook.beforeEnter(this, el)\r\n super.appendChild(el)\r\n if (!runParallel && this.removing) {\r\n // when removing a previous el, append animation is run after remove one\r\n this.appending = el\r\n } else {\r\n hook.enter(this, el)\r\n }\r\n }\r\n\r\n removeChild(el) {\r\n if (!this.hasAttribute('animation')) {\r\n super.removeChild(el)\r\n return\r\n }\r\n const hook = getAnimationHook(this.getAttribute('animation'))\r\n\r\n if (this.removing && this.removing.parentNode === this) {\r\n super.removeChild(this.removing)\r\n }\r\n\r\n if (el === this.appending) {\r\n if (el.parentNode === this) {\r\n super.removeChild(el)\r\n }\r\n this.removing = null\r\n return\r\n }\r\n\r\n this.removing = el\r\n hook.leave(this, el, () => {\r\n if (this.removing && this.removing.parentNode === this) {\r\n super.removeChild(this.removing)\r\n }\r\n if (this.appending) hook.enter(this, this.appending)\r\n this.appending = null\r\n this.removing = null\r\n })\r\n }\r\n}\r\n","import { AnimatedOutlet, GenericCSS, setDefaultAnimation } from 'slick-router/components/animated-outlet.js';\n\nimport styles from './styles/styles.css?inline';\n\nsetDefaultAnimation(GenericCSS);\n\n/**\n * `Route` is a custom web component that represents a route in a routing system.\n * @summary This element represents a route in a routing system.\n * @documentation https://elements.webjet.sk/components/route\n * @status stable\n * @augments AnimatedOutlet\n * @tag wje-router-outlet\n */\nexport default class RouterOutlet extends AnimatedOutlet {\n /**\n * Creates an instance of Route.\n */\n constructor() {\n super();\n }\n\n /**\n * The class name for the component.\n * @type {string}\n */\n className = 'RouterOutlet';\n\n connectedCallback() {\n const styleEl = document.createElement('style');\n styleEl.textContent = styles;\n this.parentNode.insertBefore(styleEl, this);\n }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport RouterOutlet from './router-outlet.element.js';\n\nexport default RouterOutlet;\n\nWJElement.define('wje-router-outlet', RouterOutlet);\n"],"names":["styles"],"mappings":"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","x_google_ignoreList":[0]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "wj-elements",
|
|
3
3
|
"description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
|
|
4
|
-
"version": "0.1.
|
|
4
|
+
"version": "0.1.200",
|
|
5
5
|
"homepage": "https://github.com/lencys/wj-elements",
|
|
6
6
|
"author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
|
|
7
7
|
"license": "MIT",
|