wj-elements 0.3.1 → 0.3.2

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.
package/dist/wje-tab.js CHANGED
@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
3
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
4
  import WJElement from "./wje-element.js";
5
- import { b as bindRouterLinks } from "./router-links-wjqCnncc.js";
5
+ import { b as bindRouterLinks } from "./router-links-DU0wTw84.js";
6
6
  import { event } from "./event.js";
7
7
  const styles = `/*
8
8
  [ WJ Tab ]
@@ -1 +1 @@
1
- {"version":3,"file":"wje-tab.js","sources":["../packages/wje-tab/tab.element.js","../packages/wje-tab/tab.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport { bindRouterLinks } from 'slick-router/middlewares/router-links.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Tab` is a custom web component that represents a tab.\n * @summary This element represents a tab.\n * @documentation https://elements.webjet.sk/components/tab\n * @status stable\n * @augments {WJElement}\n * @param {string} panel The name of the tab panel. This is used to identify the corresponding tab panel.\n * @param {string} route The route to navigate to when the tab is clicked.\n * @cssproperty [--wje-tab-text-transform=uppercase] - The text transformation for the tab (e.g., uppercase, lowercase).\n * @cssproperty [--wje-tab-font-weight=500] - The font weight of the tab text.\n * @cssproperty [--wje-tab-letter-spacing=0.06em] - The letter spacing of the tab text.\n * @cssproperty [--wje-tab-padding-inline=1rem] - The horizontal padding of the tab.\n * @cssproperty [--wje-tab-padding-top=.75rem] - The top padding of the tab text.\n * @cssproperty [--wje-tab-padding-bottom=.75rem] - The bottom padding of the tab text.\n * @cssproperty [--wje-tab-color-active=var(--wje-color-primary-11)] - The text color of the active tab.\n * @cssproperty [--wje-tab-color-hover=var(--wje-color-primary-1)] - The text color of the tab when hovered.\n * //@fires wje-tab:change - Dispatched when the tab is changed.\n * @tag wje-tab\n */\nexport default class Tab extends WJElement {\n /**\n * Creates an instance of Tab.\n */\n constructor() {\n super();\n\n /**\n * Indicates whether this is the last tab.\n * @type {boolean}\n */\n this.last = false;\n this._hasPanel = false;\n }\n\n /**\n * Sets the panel attribute to the specified value.\n * @param {string} value The value to set for the panel attribute.\n */\n set panel(value) {\n this.setAttribute('panel', value);\n }\n\n /**\n * Retrieves the value of the 'panel' attribute of the element.\n * @returns {string|null} Returns the 'panel' attribute value if it exists; otherwise, returns null.\n */\n get panel() {\n return this.getAttribute('panel') || null;\n }\n\n /**\n * Sets the value of the 'route' attribute for the current object.\n * @param {string} value The new value to set for the 'route' attribute.\n */\n set route(value) {\n this.setAttribute('route', value);\n }\n\n /**\n * Retrieves the value of the 'route' attribute.\n * If the 'route' attribute is not set, it returns null.\n * @returns {string|null} The value of the 'route' attribute or null if not set.\n */\n get route() {\n return this.getAttribute('route') || null;\n }\n\n /**\n * The class name for the component.\n */\n className = 'Tab';\n\n /**\n * Returns the CSS styles for the component.\n * @static\n * @returns {CSSStyleSheet}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n this.setAttribute('active-class', 'active');\n\n this.setAriaState({\n role: 'tab',\n selected: false,\n disabled: this.hasAttribute('disabled'),\n });\n }\n /**\n * Draws the component for the tab.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let slot = document.createElement('slot');\n\n let href = this.panel || this.route || \"#\";\n\n let a = document.createElement('a');\n a.setAttribute('href', (this.panel ? \"#\" : \"\") + href);\n a.setAttribute('part', 'native');\n a.classList.add('native-tab');\n a.appendChild(slot);\n\n fragment.appendChild(a);\n\n this.slotEl = slot;\n\n return fragment;\n }\n\n /**\n * Sets up event listeners after the component is rendered.\n * // @fires wje-tab:change - Dispatched when the component is clicked, indicating a tab change.\n */\n afterDraw() {\n this.bindRouterLinks();\n if (!this.unbindRouterLinks) {\n queueMicrotask(() => this.bindRouterLinks());\n }\n event.addListener(this, 'click', 'wje-tab:change');\n this.syncAriaLabel();\n this.slotEl?.addEventListener('slotchange', () => this.syncAriaLabel());\n }\n\n bindRouterLinks() {\n const parent = this.parentElement;\n if (!parent) return;\n\n this.unbindRouterLinks?.();\n this.unbindRouterLinks = bindRouterLinks(parent, { selector: false });\n }\n\n /**\n * Sync aria-label on host based on slotted text when not provided.\n */\n syncAriaLabel() {\n if (this.hasAttribute('aria-label') || this.hasAttribute('aria-labelledby')) return;\n const text = (this.slotEl?.assignedNodes({ flatten: true }) || [])\n .map((node) => node.textContent || '')\n .join('')\n .trim();\n if (text) {\n this.setAttribute('aria-label', text);\n }\n }\n\n /**\n * Sets the roving tabindex on the internal focusable anchor.\n * @param {number} value\n */\n setRovingTabIndex(value) {\n const anchor = this.context?.querySelector('a');\n if (!anchor) return;\n anchor.setAttribute('tabindex', String(value));\n }\n\n /**\n * Cleans up before the component is disconnected.\n */\n beforeDisconnect() {\n this.unbindRouterLinks?.();\n }\n}\n","import Tab from './tab.element.js';\n\nexport default Tab;\n\nTab.define('wje-tab', Tab);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"wje-tab.js","sources":["../packages/wje-tab/tab.element.js","../packages/wje-tab/tab.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport { bindRouterLinks } from '../utils/router-links.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Tab` is a custom web component that represents a tab.\n * @summary This element represents a tab.\n * @documentation https://elements.webjet.sk/components/tab\n * @status stable\n * @augments {WJElement}\n * @param {string} panel The name of the tab panel. This is used to identify the corresponding tab panel.\n * @param {string} route The route to navigate to when the tab is clicked.\n * @cssproperty [--wje-tab-text-transform=uppercase] - The text transformation for the tab (e.g., uppercase, lowercase).\n * @cssproperty [--wje-tab-font-weight=500] - The font weight of the tab text.\n * @cssproperty [--wje-tab-letter-spacing=0.06em] - The letter spacing of the tab text.\n * @cssproperty [--wje-tab-padding-inline=1rem] - The horizontal padding of the tab.\n * @cssproperty [--wje-tab-padding-top=.75rem] - The top padding of the tab text.\n * @cssproperty [--wje-tab-padding-bottom=.75rem] - The bottom padding of the tab text.\n * @cssproperty [--wje-tab-color-active=var(--wje-color-primary-11)] - The text color of the active tab.\n * @cssproperty [--wje-tab-color-hover=var(--wje-color-primary-1)] - The text color of the tab when hovered.\n * //@fires wje-tab:change - Dispatched when the tab is changed.\n * @tag wje-tab\n */\nexport default class Tab extends WJElement {\n /**\n * Creates an instance of Tab.\n */\n constructor() {\n super();\n\n /**\n * Indicates whether this is the last tab.\n * @type {boolean}\n */\n this.last = false;\n this._hasPanel = false;\n }\n\n /**\n * Sets the panel attribute to the specified value.\n * @param {string} value The value to set for the panel attribute.\n */\n set panel(value) {\n this.setAttribute('panel', value);\n }\n\n /**\n * Retrieves the value of the 'panel' attribute of the element.\n * @returns {string|null} Returns the 'panel' attribute value if it exists; otherwise, returns null.\n */\n get panel() {\n return this.getAttribute('panel') || null;\n }\n\n /**\n * Sets the value of the 'route' attribute for the current object.\n * @param {string} value The new value to set for the 'route' attribute.\n */\n set route(value) {\n this.setAttribute('route', value);\n }\n\n /**\n * Retrieves the value of the 'route' attribute.\n * If the 'route' attribute is not set, it returns null.\n * @returns {string|null} The value of the 'route' attribute or null if not set.\n */\n get route() {\n return this.getAttribute('route') || null;\n }\n\n /**\n * The class name for the component.\n */\n className = 'Tab';\n\n /**\n * Returns the CSS styles for the component.\n * @static\n * @returns {CSSStyleSheet}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n this.setAttribute('active-class', 'active');\n\n this.setAriaState({\n role: 'tab',\n selected: false,\n disabled: this.hasAttribute('disabled'),\n });\n }\n /**\n * Draws the component for the tab.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let slot = document.createElement('slot');\n\n let href = this.panel || this.route || \"#\";\n\n let a = document.createElement('a');\n a.setAttribute('href', (this.panel ? \"#\" : \"\") + href);\n a.setAttribute('part', 'native');\n a.classList.add('native-tab');\n a.appendChild(slot);\n\n fragment.appendChild(a);\n\n this.slotEl = slot;\n\n return fragment;\n }\n\n /**\n * Sets up event listeners after the component is rendered.\n * // @fires wje-tab:change - Dispatched when the component is clicked, indicating a tab change.\n */\n afterDraw() {\n this.bindRouterLinks();\n if (!this.unbindRouterLinks) {\n queueMicrotask(() => this.bindRouterLinks());\n }\n event.addListener(this, 'click', 'wje-tab:change');\n this.syncAriaLabel();\n this.slotEl?.addEventListener('slotchange', () => this.syncAriaLabel());\n }\n\n bindRouterLinks() {\n const parent = this.parentElement;\n if (!parent) return;\n\n this.unbindRouterLinks?.();\n this.unbindRouterLinks = bindRouterLinks(parent, { selector: false });\n }\n\n /**\n * Sync aria-label on host based on slotted text when not provided.\n */\n syncAriaLabel() {\n if (this.hasAttribute('aria-label') || this.hasAttribute('aria-labelledby')) return;\n const text = (this.slotEl?.assignedNodes({ flatten: true }) || [])\n .map((node) => node.textContent || '')\n .join('')\n .trim();\n if (text) {\n this.setAttribute('aria-label', text);\n }\n }\n\n /**\n * Sets the roving tabindex on the internal focusable anchor.\n * @param {number} value\n */\n setRovingTabIndex(value) {\n const anchor = this.context?.querySelector('a');\n if (!anchor) return;\n anchor.setAttribute('tabindex', String(value));\n }\n\n /**\n * Cleans up before the component is disconnected.\n */\n beforeDisconnect() {\n this.unbindRouterLinks?.();\n }\n}\n","import Tab from './tab.element.js';\n\nexport default Tab;\n\nTab.define('wje-tab', Tab);\n"],"names":[],"mappings":"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"}
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.3.1",
4
+ "version": "0.3.2",
5
5
  "homepage": "https://github.com/lencys/wj-elements",
6
6
  "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
7
7
  "license": "MIT",
@@ -1 +0,0 @@
1
- {"version":3,"file":"router-links-wjqCnncc.js","sources":["../node_modules/slick-router/lib/middlewares/router-links.js"],"sourcesContent":["const routerLinksData = Symbol('routerLinksData')\nconst linkContainers = new Set()\nlet router\n\n/**\n * @callback RoutePropCallback\n * @param {string} routeName\n * @param {HTMLElement} routeEl\n * @return {Record<string, any>}\n *\n * @typedef RouterLinksOptions\n * @property {Record<string, any> | RoutePropCallback} [params]\n * @property {Record<string, any> | RoutePropCallback} [query]\n * @property {string} [event='click']\n */\n\n// Make a event delegation handler for the given `eventName` and `selector`\n// and attach it to `el`.\n// If selector is empty, the listener will be bound to `el`. If not, a\n// new handler that will recursively traverse up the event target's DOM\n// hierarchy looking for a node that matches the selector. If one is found,\n// the event's `delegateTarget` property is set to it and the return the\n// result of calling bound `listener` with the parameters given to the\n// handler.\n\n/**\n * @param {HTMLElement} el\n * @param {string} eventName\n * @param {string} selector\n * @param {Function} listener\n * @param {*} context\n * @return {Function}\n */\nconst delegate = function (el, eventName, selector, listener, context) {\n const handler = function (e) {\n let node = e.target\n for (; node && node !== el; node = node.parentNode) {\n if (node.matches && node.matches(selector)) {\n e.selectorTarget = node\n listener.call(context, e)\n }\n }\n }\n\n handler.eventName = eventName\n el.addEventListener(eventName, handler, false)\n return handler\n}\n\nfunction isModifiedEvent(event) {\n return !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey)\n}\n\nconst undelegate = function (el, handler) {\n const eventName = handler.eventName\n el.removeEventListener(eventName, handler, false)\n}\n\nconst camelize = (str) => {\n if (str.indexOf('-') === -1) return str\n const words = str.split('-')\n let result = ''\n for (let i = 0; i < words.length; i++) {\n const word = words[i]\n result += i ? word.charAt(0).toUpperCase() + word.slice(1) : word\n }\n return result\n}\n\nfunction mutationHandler(mutations, observer) {\n mutations.forEach(function (mutation) {\n if (mutation.type === 'attributes') {\n const attr = mutation.attributeName\n if (attr.indexOf('param-') === 0 || attr.indexOf('query-') === 0) {\n updateLink(mutation.target, observer.rootEl)\n }\n } else {\n mutation.addedNodes.forEach((node) => {\n if (node.nodeType === 1) {\n if (node.getAttribute('route')) updateLink(node, observer.rootEl)\n createLinks(observer.rootEl, node)\n }\n })\n }\n })\n}\n\nconst elementsObserverConfig = { childList: true, subtree: true, attributes: true }\n\nfunction getAttributeValues(el, prefix, result) {\n const attributes = el.attributes\n\n for (let i = 0; i < attributes.length; i++) {\n const attr = attributes[i]\n if (attr.name.indexOf(prefix) === 0) {\n const paramName = camelize(attr.name.slice(prefix.length))\n result[paramName] = attr.value\n }\n }\n return result\n}\n\nfunction getDefaults(rootEl, routeName, propName, routeEl, options) {\n let result = options[propName]\n if (typeof result === 'function') result = result.call(rootEl, routeName, routeEl)\n return result || {}\n}\n\nfunction getRouteProp(rootEl, routeName, routeEl, propName, attrPrefix) {\n const options = rootEl[routerLinksData].options\n const defaults = getDefaults(rootEl, routeName, propName, routeEl, options)\n getAttributeValues(rootEl, attrPrefix, defaults)\n return getAttributeValues(routeEl, attrPrefix, defaults)\n}\n\nfunction updateActiveClass(el, routeName, params, query) {\n const activeClass = el.hasAttribute('active-class') ? el.getAttribute('active-class') : 'active'\n if (activeClass) {\n const isActive = router.isActive(routeName, params, query, el.hasAttribute('exact'))\n el.classList.toggle(activeClass, isActive)\n }\n}\n\nfunction updateLink(el, rootEl) {\n const routeName = el.getAttribute('route')\n if (!routeName) return\n const params = getRouteProp(rootEl, routeName, el, 'params', 'param-')\n const query = getRouteProp(rootEl, routeName, el, 'query', 'query-')\n try {\n const href = router.generate(routeName, params, query)\n const anchorEl = el.tagName === 'A' ? el : el.querySelector('a')\n if (anchorEl) anchorEl.setAttribute('href', href)\n if (!router.state.activeTransition) {\n updateActiveClass(el, routeName, params, query)\n }\n } catch (error) {\n console.warn(`Error generating link for \"${routeName}\": ${error}`)\n }\n}\n\n/**\n * @param {HTMLElement} rootEl\n */\nfunction createLinks(rootEl) {\n const routeEls = rootEl.querySelectorAll('[route]')\n\n routeEls.forEach((el) => {\n updateLink(el, rootEl)\n })\n}\n\n/**\n * @param {Event} e\n * @returns\n */\nfunction linkClickHandler(e) {\n if (e.type === 'click' && (e.button !== 0 || isModifiedEvent(e))) return\n e.preventDefault()\n const el = e.selectorTarget\n const routeName = el.getAttribute('route')\n if (!routeName) return\n const params = getRouteProp(this, routeName, el, 'params', 'param-')\n const query = getRouteProp(this, routeName, el, 'query', 'query-')\n const method = el.hasAttribute('replace') ? 'replaceWith' : 'transitionTo'\n router[method](routeName, params, query)\n}\n\n/**\n * @export\n * @param {HTMLElement} rootEl\n * @param {RouterLinksOptions} [options={}]\n * @return {Function}\n */\nexport function bindRouterLinks(rootEl, options = {}) {\n const observer = new MutationObserver(mutationHandler)\n\n observer.rootEl = rootEl\n rootEl[routerLinksData] = { options, observer }\n\n const eventHandler = delegate(\n rootEl,\n options.event || 'click',\n '[route]',\n linkClickHandler,\n rootEl,\n )\n createLinks(rootEl)\n observer.observe(rootEl, elementsObserverConfig)\n\n linkContainers.add(rootEl)\n\n return function () {\n linkContainers.delete(rootEl)\n undelegate(rootEl, eventHandler)\n }\n}\n\nfunction create(instance) {\n router = instance\n}\n\nfunction done() {\n linkContainers.forEach((rootEl) => {\n rootEl.querySelectorAll('[route]').forEach((el) => {\n const routeName = el.getAttribute('route')\n if (!routeName) return\n const params = getRouteProp(rootEl, routeName, el, 'params', 'param-')\n const query = getRouteProp(rootEl, routeName, el, 'query', 'query-')\n updateActiveClass(el, routeName, params, query)\n })\n })\n}\n\nexport const routerLinks = {\n create,\n done,\n}\n"],"names":[],"mappings":"AAAA,MAAM,kBAAkB,OAAO,iBAAiB;AAChD,MAAM,iBAAiB,oBAAI,IAAG;AAC9B,IAAI;AA+BJ,MAAM,WAAW,SAAU,IAAI,WAAW,UAAU,UAAU,SAAS;AACrE,QAAM,UAAU,SAAU,GAAG;AAC3B,QAAI,OAAO,EAAE;AACb,WAAO,QAAQ,SAAS,IAAI,OAAO,KAAK,YAAY;AAClD,UAAI,KAAK,WAAW,KAAK,QAAQ,QAAQ,GAAG;AAC1C,UAAE,iBAAiB;AACnB,iBAAS,KAAK,SAAS,CAAC;AAAA,MAC1B;AAAA,IACF;AAAA,EACF;AAEA,UAAQ,YAAY;AACpB,KAAG,iBAAiB,WAAW,SAAS,KAAK;AAC7C,SAAO;AACT;AAEA,SAAS,gBAAgB,OAAO;AAC9B,SAAO,CAAC,EAAE,MAAM,WAAW,MAAM,UAAU,MAAM,WAAW,MAAM;AACpE;AAEA,MAAM,aAAa,SAAU,IAAI,SAAS;AACxC,QAAM,YAAY,QAAQ;AAC1B,KAAG,oBAAoB,WAAW,SAAS,KAAK;AAClD;AAEA,MAAM,WAAW,CAAC,QAAQ;AACxB,MAAI,IAAI,QAAQ,GAAG,MAAM,GAAI,QAAO;AACpC,QAAM,QAAQ,IAAI,MAAM,GAAG;AAC3B,MAAI,SAAS;AACb,WAAS,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;AACrC,UAAM,OAAO,MAAM,CAAC;AACpB,cAAU,IAAI,KAAK,OAAO,CAAC,EAAE,YAAW,IAAK,KAAK,MAAM,CAAC,IAAI;AAAA,EAC/D;AACA,SAAO;AACT;AAEA,SAAS,gBAAgB,WAAW,UAAU;AAC5C,YAAU,QAAQ,SAAU,UAAU;AACpC,QAAI,SAAS,SAAS,cAAc;AAClC,YAAM,OAAO,SAAS;AACtB,UAAI,KAAK,QAAQ,QAAQ,MAAM,KAAK,KAAK,QAAQ,QAAQ,MAAM,GAAG;AAChE,mBAAW,SAAS,QAAQ,SAAS,MAAM;AAAA,MAC7C;AAAA,IACF,OAAO;AACL,eAAS,WAAW,QAAQ,CAAC,SAAS;AACpC,YAAI,KAAK,aAAa,GAAG;AACvB,cAAI,KAAK,aAAa,OAAO,EAAG,YAAW,MAAM,SAAS,MAAM;AAChE,sBAAY,SAAS,MAAY;AAAA,QACnC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AACH;AAEA,MAAM,yBAAyB,EAAE,WAAW,MAAM,SAAS,MAAM,YAAY,KAAI;AAEjF,SAAS,mBAAmB,IAAI,QAAQ,QAAQ;AAC9C,QAAM,aAAa,GAAG;AAEtB,WAAS,IAAI,GAAG,IAAI,WAAW,QAAQ,KAAK;AAC1C,UAAM,OAAO,WAAW,CAAC;AACzB,QAAI,KAAK,KAAK,QAAQ,MAAM,MAAM,GAAG;AACnC,YAAM,YAAY,SAAS,KAAK,KAAK,MAAM,OAAO,MAAM,CAAC;AACzD,aAAO,SAAS,IAAI,KAAK;AAAA,IAC3B;AAAA,EACF;AACA,SAAO;AACT;AAEA,SAAS,YAAY,QAAQ,WAAW,UAAU,SAAS,SAAS;AAClE,MAAI,SAAS,QAAQ,QAAQ;AAC7B,MAAI,OAAO,WAAW,WAAY,UAAS,OAAO,KAAK,QAAQ,WAAW,OAAO;AACjF,SAAO,UAAU,CAAA;AACnB;AAEA,SAAS,aAAa,QAAQ,WAAW,SAAS,UAAU,YAAY;AACtE,QAAM,UAAU,OAAO,eAAe,EAAE;AACxC,QAAM,WAAW,YAAY,QAAQ,WAAW,UAAU,SAAS,OAAO;AAC1E,qBAAmB,QAAQ,YAAY,QAAQ;AAC/C,SAAO,mBAAmB,SAAS,YAAY,QAAQ;AACzD;AAEA,SAAS,kBAAkB,IAAI,WAAW,QAAQ,OAAO;AACvD,QAAM,cAAc,GAAG,aAAa,cAAc,IAAI,GAAG,aAAa,cAAc,IAAI;AACxF,MAAI,aAAa;AACf,UAAM,WAAW,OAAO,SAAS,WAAW,QAAQ,OAAO,GAAG,aAAa,OAAO,CAAC;AACnF,OAAG,UAAU,OAAO,aAAa,QAAQ;AAAA,EAC3C;AACF;AAEA,SAAS,WAAW,IAAI,QAAQ;AAC9B,QAAM,YAAY,GAAG,aAAa,OAAO;AACzC,MAAI,CAAC,UAAW;AAChB,QAAM,SAAS,aAAa,QAAQ,WAAW,IAAI,UAAU,QAAQ;AACrE,QAAM,QAAQ,aAAa,QAAQ,WAAW,IAAI,SAAS,QAAQ;AACnE,MAAI;AACF,UAAM,OAAO,OAAO,SAAS,WAAW,QAAQ,KAAK;AACrD,UAAM,WAAW,GAAG,YAAY,MAAM,KAAK,GAAG,cAAc,GAAG;AAC/D,QAAI,SAAU,UAAS,aAAa,QAAQ,IAAI;AAChD,QAAI,CAAC,OAAO,MAAM,kBAAkB;AAClC,wBAAkB,IAAI,WAAW,QAAQ,KAAK;AAAA,IAChD;AAAA,EACF,SAAS,OAAO;AACd,YAAQ,KAAK,8BAA8B,SAAS,MAAM,KAAK,EAAE;AAAA,EACnE;AACF;AAKA,SAAS,YAAY,QAAQ;AAC3B,QAAM,WAAW,OAAO,iBAAiB,SAAS;AAElD,WAAS,QAAQ,CAAC,OAAO;AACvB,eAAW,IAAI,MAAM;AAAA,EACvB,CAAC;AACH;AAMA,SAAS,iBAAiB,GAAG;AAC3B,MAAI,EAAE,SAAS,YAAY,EAAE,WAAW,KAAK,gBAAgB,CAAC,GAAI;AAClE,IAAE,eAAc;AAChB,QAAM,KAAK,EAAE;AACb,QAAM,YAAY,GAAG,aAAa,OAAO;AACzC,MAAI,CAAC,UAAW;AAChB,QAAM,SAAS,aAAa,MAAM,WAAW,IAAI,UAAU,QAAQ;AACnE,QAAM,QAAQ,aAAa,MAAM,WAAW,IAAI,SAAS,QAAQ;AACjE,QAAM,SAAS,GAAG,aAAa,SAAS,IAAI,gBAAgB;AAC5D,SAAO,MAAM,EAAE,WAAW,QAAQ,KAAK;AACzC;AAQO,SAAS,gBAAgB,QAAQ,UAAU,IAAI;AACpD,QAAM,WAAW,IAAI,iBAAiB,eAAe;AAErD,WAAS,SAAS;AAClB,SAAO,eAAe,IAAI,EAAE,SAAS,SAAQ;AAE7C,QAAM,eAAe;AAAA,IACnB;AAAA,IACA,QAAQ,SAAS;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AACE,cAAY,MAAM;AAClB,WAAS,QAAQ,QAAQ,sBAAsB;AAE/C,iBAAe,IAAI,MAAM;AAEzB,SAAO,WAAY;AACjB,mBAAe,OAAO,MAAM;AAC5B,eAAW,QAAQ,YAAY;AAAA,EACjC;AACF;AAEA,SAAS,OAAO,UAAU;AACxB,WAAS;AACX;AAEA,SAAS,OAAO;AACd,iBAAe,QAAQ,CAAC,WAAW;AACjC,WAAO,iBAAiB,SAAS,EAAE,QAAQ,CAAC,OAAO;AACjD,YAAM,YAAY,GAAG,aAAa,OAAO;AACzC,UAAI,CAAC,UAAW;AAChB,YAAM,SAAS,aAAa,QAAQ,WAAW,IAAI,UAAU,QAAQ;AACrE,YAAM,QAAQ,aAAa,QAAQ,WAAW,IAAI,SAAS,QAAQ;AACnE,wBAAkB,IAAI,WAAW,QAAQ,KAAK;AAAA,IAChD,CAAC;AAAA,EACH,CAAC;AACH;AAEY,MAAC,cAAc;AAAA,EACzB;AAAA,EACA;AACF;","x_google_ignoreList":[0]}