@zanichelli/zanichelli-it-frontend-kit 1.1.0 → 1.1.1-RC.0

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.
Files changed (62) hide show
  1. package/dist/cjs/{index-xkrZykI_.js → index-q1XSBSqA.js} +3 -3
  2. package/dist/cjs/index-q1XSBSqA.js.map +1 -0
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/zanichelli-it-frontend-kit.cjs.js +1 -1
  5. package/dist/cjs/zanit-menubar.zanit-mobile-menubar.zanit-search-form.entry.cjs.js.map +1 -1
  6. package/dist/cjs/zanit-menubar_3.cjs.entry.js +30 -19
  7. package/dist/cjs/zanit-menubar_3.cjs.entry.js.map +1 -1
  8. package/dist/collection/components/menubar/menubar.js +24 -13
  9. package/dist/collection/components/menubar/menubar.js.map +1 -1
  10. package/dist/collection/components/menubar/mobile-menubar/mobile-menubar.js +2 -2
  11. package/dist/collection/components/menubar/mobile-menubar/mobile-menubar.js.map +1 -1
  12. package/dist/collection/components/menubar/search-form/search-form.js +2 -2
  13. package/dist/collection/components/menubar/search-form/search-form.js.map +1 -1
  14. package/dist/collection/utils/utils.js +1 -1
  15. package/dist/collection/utils/utils.js.map +1 -1
  16. package/dist/components/index.js +1 -1
  17. package/dist/components/index.js.map +1 -1
  18. package/dist/components/{p-D4SZRD-E.js → p-C_SXGfG9.js} +5 -5
  19. package/dist/components/p-C_SXGfG9.js.map +1 -0
  20. package/dist/components/{p-Cq6BKHcR.js → p-CoH6aY_p.js} +5 -5
  21. package/dist/components/p-CoH6aY_p.js.map +1 -0
  22. package/dist/components/zanit-menubar.js +26 -15
  23. package/dist/components/zanit-menubar.js.map +1 -1
  24. package/dist/components/zanit-mobile-menubar.js +1 -1
  25. package/dist/components/zanit-search-form.js +1 -1
  26. package/dist/esm/{index-BWVQ0LD4.js → index-CaWL2omE.js} +3 -3
  27. package/dist/esm/index-CaWL2omE.js.map +1 -0
  28. package/dist/esm/loader.js +2 -2
  29. package/dist/esm/zanichelli-it-frontend-kit.js +2 -2
  30. package/dist/esm/zanit-menubar.zanit-mobile-menubar.zanit-search-form.entry.js.map +1 -1
  31. package/dist/esm/zanit-menubar_3.entry.js +30 -19
  32. package/dist/esm/zanit-menubar_3.entry.js.map +1 -1
  33. package/dist/types/components/menubar/menubar.d.ts +1 -0
  34. package/dist/zanichelli-it-frontend-kit/p-6a501c27.entry.js +2 -0
  35. package/dist/zanichelli-it-frontend-kit/p-6a501c27.entry.js.map +1 -0
  36. package/{www/build/p-BWVQ0LD4.js → dist/zanichelli-it-frontend-kit/p-CaWL2omE.js} +2 -2
  37. package/dist/zanichelli-it-frontend-kit/p-CaWL2omE.js.map +1 -0
  38. package/dist/zanichelli-it-frontend-kit/zanichelli-it-frontend-kit.css +1 -1
  39. package/dist/zanichelli-it-frontend-kit/zanichelli-it-frontend-kit.esm.js +1 -1
  40. package/dist/zanichelli-it-frontend-kit/zanit-menubar.zanit-mobile-menubar.zanit-search-form.entry.esm.js.map +1 -1
  41. package/package.json +1 -1
  42. package/www/build/{p-54076593.js → p-4384a493.js} +1 -1
  43. package/www/build/p-43c395dc.css +1 -0
  44. package/www/build/p-6a501c27.entry.js +2 -0
  45. package/www/build/p-6a501c27.entry.js.map +1 -0
  46. package/{dist/zanichelli-it-frontend-kit/p-BWVQ0LD4.js → www/build/p-CaWL2omE.js} +2 -2
  47. package/www/build/p-CaWL2omE.js.map +1 -0
  48. package/www/build/zanichelli-it-frontend-kit.css +1 -1
  49. package/www/build/zanichelli-it-frontend-kit.esm.js +1 -1
  50. package/www/build/zanit-menubar.zanit-mobile-menubar.zanit-search-form.entry.esm.js.map +1 -1
  51. package/www/index.html +3 -1
  52. package/dist/cjs/index-xkrZykI_.js.map +0 -1
  53. package/dist/components/p-Cq6BKHcR.js.map +0 -1
  54. package/dist/components/p-D4SZRD-E.js.map +0 -1
  55. package/dist/esm/index-BWVQ0LD4.js.map +0 -1
  56. package/dist/zanichelli-it-frontend-kit/p-2bfa3d8f.entry.js +0 -2
  57. package/dist/zanichelli-it-frontend-kit/p-2bfa3d8f.entry.js.map +0 -1
  58. package/dist/zanichelli-it-frontend-kit/p-BWVQ0LD4.js.map +0 -1
  59. package/www/build/p-2bfa3d8f.entry.js +0 -2
  60. package/www/build/p-2bfa3d8f.entry.js.map +0 -1
  61. package/www/build/p-984b8fa6.css +0 -1
  62. package/www/build/p-BWVQ0LD4.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"names":["containsTarget","ancestor","event","composedPath","filter","el","document","window","some","contains","moveFocus","current","next","tabIndex","focus","preventScroll","DEFAULT_GROUP_KEY","DEFAULT_GROUP","id","label","getGroupedItems","items","groups","reduce","grouped","item","itemGroup","find","group","push","sort","a","b","Menu","controlledBy","currentPath","onItemKeyDown","length","isActive","includes","h","class","role","undefined","map","highlight","href","active","onKeyDown","target","menubarCss","menuCss","ZanitMenubar","openMenu","openNavbar","isMobile","loading","data","searchQuery","timerId","parseData","URL","this","fetchData","Promise","JSON","parse","Array","isArray","every","Error","url","onItemsChange","initTabindex","onCurrentChange","split","Boolean","connectedCallback","mobileMediaQuery","matchMedia","matches","onchange","mql","handleOutsideClick","host","handleKeydown","key","handleMouseover","clearTimeout","handleMouseout","setTimeout","handleFocusout","relatedTarget","shadowRoot","querySelector","fetch","json","error","console","cause","querySelectorAll","forEach","menubar","index","setAttribute","menuItems","menuItem","navbarItems","navbarItem","showMenu","getParentMenubarElements","itemEl","from","closest","focusPreviousItem","menubarElements","currentIndex","indexOf","prevItem","ariaHasPopup","focusNextItem","nextItem","handleItemKeydown","preventDefault","stopPropagation","firstItem","lastItem","pop","openItemMenu","getPreviousGroup","groupContainer","getNextGroup","firstMenuItem","handleMenuKeydown","itemElement","currentGroup","nextGroup","menuTriggerId","getAttribute","focusedItem","getElementById","nextGroupItems","prevGroup","prevGroupItems","render","_","Fragment","onPointerOver","name","width","height","onResetSearch","subitem","mobileMenubarCss","ZanitMobileMenubar","lastCurrent","parentItem","menuType","open","setupData","parent","menuItemsElement","toggleMenu","type","onClick","imageAlt","link","searchFormCss","ZanitSearchForm","formElement","showSearchbar","_searchQuery","onSearchQueryChange","openSearchbar","search","resetSearch","searchbarInput","resetSearchQuery","emit","handleInputChange","value","onSearchSubmit","searchEv","query","defaultPrevented","submit","searchbar","ref","method","action","onSubmit","onReset","disabled","placeholder","onInput","required"],"sources":["src/utils/utils.ts","src/components/menubar/menu/menu.tsx","src/components/menubar/menubar.css?tag=zanit-menubar&encapsulation=shadow","src/components/menubar/menu/menu.css?tag=zanit-menubar&encapsulation=shadow","src/components/menubar/menubar.tsx","src/components/menubar/mobile-menubar/mobile-menubar.css?tag=zanit-mobile-menubar&encapsulation=shadow","src/components/menubar/menu/menu.css?tag=zanit-mobile-menubar&encapsulation=shadow","src/components/menubar/mobile-menubar/mobile-menubar.tsx","src/components/menubar/search-form/search-form.css?tag=zanit-search-form&encapsulation=shadow","src/components/menubar/search-form/search-form.tsx"],"sourcesContent":["/**\n * Check if an element contains an event target by checking its composedPath.\n * Useful when an event target may come from a component's shadow DOM.\n */\nexport const containsTarget = (ancestor: HTMLElement, event: Event) => {\n return event\n .composedPath()\n .filter((el) => el !== document && el !== window.window)\n .some((el) => ancestor.contains(el as HTMLElement));\n};\n\n/** Move the focus to `next` element, set tabindex to 0 for `next` and -1 to `current`. */\nexport const moveFocus = (current: HTMLElement, next: HTMLElement) => {\n current.tabIndex = -1;\n next.tabIndex = 0;\n next.focus({ preventScroll: true });\n};\n","import { FunctionalComponent, h } from '@stencil/core';\nimport { MenuItem } from '../../../utils';\n\n/**\n * Menu of items that can be grouped.\n * @member {string} controlledBy - The HTML id of the element that controls the menu.\n * @member {MenuItem[]} items - The items to show in the menu.\n * @member {string[]} currentPath - Path of current item.\n * @member {function} onItemKeyDown - The function to call when a key is pressed from a menuitem.\n */\nexport interface MenuProps {\n controlledBy?: string;\n items?: MenuItem[];\n currentPath?: string[];\n onItemKeyDown?: (event: KeyboardEvent) => void;\n}\n\nconst DEFAULT_GROUP_KEY = 'default';\nconst DEFAULT_GROUP = {\n id: DEFAULT_GROUP_KEY,\n label: DEFAULT_GROUP_KEY,\n};\n\n/** Get the items grouped by their group. */\nconst getGroupedItems = (items: MenuItem[]) => {\n const groups = items.reduce<{ group: MenuProps['items'][number]['group']; items: MenuItem[] }[]>((grouped, item) => {\n const itemGroup = grouped.find(({ group }) => group.id === (item.group?.id || DEFAULT_GROUP.id));\n if (!itemGroup) {\n grouped.push({ group: item.group ?? DEFAULT_GROUP, items: [item] });\n } else {\n itemGroup.items.push(item);\n }\n\n return grouped;\n }, []);\n\n // Sort to keep default group at the end\n return groups.sort((a, b) => (a.group.id === DEFAULT_GROUP_KEY ? 1 : b.group.id === DEFAULT_GROUP_KEY ? -1 : 0));\n};\n\n/**\n * Floating menu component. It shows a list of items that can be grouped.\n */\nexport const Menu: FunctionalComponent<MenuProps> = ({ controlledBy, items, currentPath = [], onItemKeyDown }) => {\n if (!items?.length) {\n return null;\n }\n\n const groups = getGroupedItems(items);\n\n const isActive = (item: MenuItem) => currentPath.includes(controlledBy) && currentPath.includes(item.id);\n\n return (\n <div\n class=\"menu-wrapper\"\n role=\"none\"\n >\n <div\n class=\"menu\"\n aria-labelledby={controlledBy ?? undefined}\n role=\"menu\"\n >\n {groups.map(({ group, items }) => (\n <div class={{ group: true, highlight: items.some((item) => item.highlight) }}>\n {group.id !== DEFAULT_GROUP_KEY ? (\n <div\n class=\"group-name\"\n id={group.id}\n >\n {group.label}\n </div>\n ) : groups.length > 1 ? (\n // empty div to keep the same height as the other groups\n <div class=\"group-name\" />\n ) : null}\n <ul\n class=\"menu-list\"\n role=\"group\"\n aria-labelledby={group.id !== DEFAULT_GROUP_KEY ? group.id : undefined}\n >\n {items.map((item) => (\n <li role=\"none\">\n {item.href && (\n <a\n class={{\n 'menu-item': true,\n 'active': isActive(item),\n }}\n href={item.href}\n role=\"menuitem\"\n tabIndex={-1}\n aria-current={isActive(item) ? 'page' : 'false'}\n onKeyDown={(event) => onItemKeyDown(event)}\n target={item.target}\n >\n {item.label}\n </a>\n )}\n </li>\n ))}\n </ul>\n </div>\n ))}\n </div>\n </div>\n );\n};\n",":host {\n --zanit-menubar-max-width: ;\n\n position: relative;\n z-index: 2;\n display: flex;\n width: 100%;\n background-color: #fff;\n color: var(--gray900);\n font-family: var(--font-family-sans);\n}\n\n:host,\n*,\n::before,\n::after {\n box-sizing: border-box;\n}\n\n*:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\nul {\n padding: 0;\n margin: 0;\n list-style: none;\n}\n\na {\n color: var(--gray900);\n cursor: pointer;\n text-decoration: none;\n}\n\nbutton {\n all: unset;\n cursor: pointer;\n}\n\n:host nav {\n width: 100%;\n}\n\n.shadow-wrapper {\n position: relative;\n z-index: 1;\n display: flex;\n width: 100%;\n}\n\n.shadow-wrapper::after {\n position: absolute;\n top: 0;\n right: 0;\n width: 100%;\n height: 100%;\n background: transparent;\n box-shadow: var(--shadow-1);\n content: '';\n pointer-events: none;\n}\n\n.width-limiter {\n position: relative;\n display: flex;\n width: 100%;\n max-width: var(--zanit-menubar-max-width, 1366px);\n margin: 0 auto;\n}\n\n.shadow-wrapper + .shadow-wrapper {\n z-index: 0;\n}\n\n.sub-menubar > ul {\n gap: 28px;\n}\n\n.width-limiter > ul,\n.sub-menubar > ul {\n position: relative;\n display: flex;\n width: 100%;\n align-items: center;\n padding: 0 var(--grid-margin);\n margin-right: auto;\n margin-left: auto;\n gap: 20px;\n}\n\n.shadow-wrapper > .width-limiter,\n.shadow-wrapper > ul {\n width: 100%;\n max-width: var(--zanit-menubar-max-width, 1366px);\n}\n\nul.menubar {\n padding-right: 0;\n}\n\n.menubar z-ghost-loading {\n display: block;\n width: 120px;\n height: 1.25rem;\n}\n\n/* separator bar */\n.menubar > li[role='separator'] {\n width: 1px;\n height: 1.25rem;\n background-color: #000;\n}\n\n.menubar-item {\n position: relative;\n display: flex;\n align-items: center;\n padding: 14px 0;\n font-size: 1rem;\n gap: 8px;\n line-height: 1.25rem;\n}\n\n.menubar .menubar-item {\n text-transform: uppercase;\n}\n\n.menubar-item [data-text] {\n display: flex;\n flex-direction: column;\n}\n\n.menubar-item.active > [data-text],\n.menubar-item:hover > [data-text],\n.menubar-item:focus:focus-visible > [data-text] {\n font-weight: var(--font-bd);\n}\n\n/* To avoid size changes in the element, when it is hovered and becomes bold,\nwe put the same text already bold with height 0, so as to always occupy the maximum necessary width. */\n.menubar-item > [data-text]::after {\n height: 0;\n content: attr(data-text) / '';\n font-weight: var(--font-bd);\n letter-spacing: normal;\n pointer-events: none;\n user-select: none;\n visibility: hidden;\n}\n\n/* active item bottom border */\n.sub-menubar .menubar-item.active::after {\n position: absolute;\n z-index: -1;\n bottom: 0;\n left: -4px;\n width: calc(100% + 8px); /* the border is 4px per side larger than its container */\n height: 4px;\n background-color: var(--red500);\n content: '';\n}\n\nzanit-search-form {\n margin-left: auto;\n}\n",".menu-wrapper {\n width: 100%;\n background-color: #fff;\n}\n\n.menu {\n position: relative;\n display: flex;\n width: 100%;\n flex-direction: column;\n gap: 32px 0;\n}\n\n.menu .group {\n display: flex;\n flex-direction: column;\n}\n\n.menu .group .group-name {\n border-bottom: 1px solid currentcolor;\n margin-bottom: 4px;\n color: var(--red500);\n font-size: 0.875rem;\n font-weight: var(--font-md);\n}\n\n.menu .group .menu-list {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.menu .group .menu-list .menu-item {\n display: block;\n border-bottom: 2px solid transparent;\n font-size: 0.875rem;\n font-weight: var(--font-md);\n}\n\n.menu .menu-list .menu-item.active,\n.menu .menu-list .menu-item:hover {\n border-bottom-color: var(--red500);\n}\n\n.menu .group.highlight .menu-list .menu-item {\n font-size: 1rem;\n}\n\n@media (width >= 768px) {\n .menu-wrapper {\n position: absolute;\n top: 100%;\n left: 0;\n display: flex;\n justify-content: center;\n box-shadow: var(--shadow-1);\n }\n\n .menu {\n display: grid;\n width: 100%;\n max-width: var(--zanit-menubar-max-width, 1366px);\n padding: 16px var(--grid-margin);\n gap: 0 24px;\n grid-auto-columns: minmax(0, max-content);\n grid-auto-flow: column;\n grid-template-rows: minmax(0, max-content) max-content;\n }\n\n .menu .group {\n display: grid;\n grid-row: 1 / -1;\n grid-template-columns: 1fr;\n grid-template-rows: subgrid;\n }\n\n @supports not (grid-template-rows: subgrid) {\n .menu .group {\n grid-template-rows: repeat(auto-fit, minmax(0, max-content));\n }\n }\n\n .menu .group .group-name {\n border: none;\n margin-bottom: 16px;\n }\n\n .menu .group .menu-list .menu-item {\n font-size: 1rem;\n }\n\n .menu .group.highlight .menu-list .menu-item {\n font-size: 1.5rem;\n }\n}\n","import { Component, Element, Fragment, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { MenubarItem, containsTarget, moveFocus } from '../../utils';\nimport { Menu } from './menu/menu';\n\n/**\n * Main menubar component. Each item can have a menu with subitems\n * When a main menubar item is the current active one, a sub-menubar is shown and each subitem can have a menu with subitems.\n * @cssprop {--zanit-menubar-max-width} Maximum width of the menubar.\n */\n@Component({\n tag: 'zanit-menubar',\n styleUrls: ['menubar.css', 'menu/menu.css'],\n shadow: true,\n})\nexport class ZanitMenubar {\n @Element() host: HTMLZanitMenubarElement;\n\n /** Menubar items extracted from `data`. */\n @State()\n items: MenubarItem[] = [];\n\n /** ID of the currently open menu. */\n @State()\n openMenu: string | undefined = undefined;\n\n /** ID of the item to show the subitems navbar for. */\n @State()\n openNavbar: string | undefined = undefined;\n\n /** IDs of the current prop */\n @State()\n currentPath: string[] = [];\n\n @State()\n isMobile: boolean = false;\n\n @State()\n loading: boolean = false;\n\n /** The data to build the menu (as an array of `MenubarItem` or a JSON array) or the url to fetch to retrieve it. */\n @Prop()\n data: Promise<MenubarItem[]> | MenubarItem[] | URL | string;\n\n /** Path of the current item. */\n @Prop()\n current: string | undefined = undefined;\n\n /** Initial search query. */\n @Prop({ mutable: true })\n searchQuery: string | undefined = undefined;\n\n private timerId: number;\n\n /** Setup the list of items. */\n @Watch('data')\n async parseData(data: typeof this.data) {\n if (!data) {\n return;\n }\n\n if (data instanceof URL) {\n this.items = await this.fetchData(data);\n } else if (data instanceof Promise) {\n this.loading = true;\n this.items = await data;\n this.loading = false;\n } else if (typeof data === 'string') {\n try {\n this.items = JSON.parse(data);\n if (!Array.isArray(this.items) || !this.items?.every((item) => item satisfies MenubarItem)) {\n throw new Error('Expected an array of MenubarItem objects.');\n }\n } catch {\n let url: URL;\n try {\n url = new URL(data);\n } catch {\n throw new Error('Invalid string provided for `data` property: not a valid url or JSON.');\n }\n\n this.items = await this.fetchData(url);\n }\n } else if (Array.isArray(data) && data.every((item) => item satisfies MenubarItem)) {\n this.items = data;\n } else {\n throw new Error(\n 'Invalid `data` property value. Expected an url, a JSON or an array/promise of MenubarItem objects.'\n );\n }\n }\n\n @Watch('items')\n onItemsChange() {\n this.initTabindex();\n }\n\n @Watch('current')\n onCurrentChange() {\n this.currentPath = this.current?.split('/').filter(Boolean) || [];\n }\n\n async connectedCallback() {\n const mobileMediaQuery = window.matchMedia('(width < 768px)');\n this.isMobile = mobileMediaQuery.matches;\n mobileMediaQuery.onchange = (mql) => {\n this.isMobile = mql.matches;\n this.initTabindex();\n this.openMenu = undefined;\n };\n await this.parseData(this.data);\n this.onCurrentChange();\n this.initTabindex();\n }\n\n /** Close any open menu when clicking outside. */\n @Listen('click', { target: 'document', passive: true })\n handleOutsideClick(event: MouseEvent) {\n if (!this.openMenu || containsTarget(this.host, event)) {\n return;\n }\n\n this.openMenu = undefined;\n }\n\n /** Close any open menu when pressing Escape or Tab. */\n @Listen('keydown', { passive: true })\n handleKeydown(event: KeyboardEvent) {\n switch (event.key) {\n case 'Escape':\n case 'Tab':\n this.openMenu = undefined;\n break;\n }\n }\n\n @Listen('mouseover', { passive: true })\n handleMouseover() {\n clearTimeout(this.timerId);\n }\n\n /**\n * Automatically close any open menu on mouseout after with a little delay.\n * The delay is useful to avoid immediate closing when the pointer briefly leaves the component.\n */\n @Listen('mouseout', { passive: true })\n handleMouseout(event: MouseEvent) {\n this.timerId = window.setTimeout(() => {\n if (!this.openMenu || containsTarget(this.host, event)) {\n return;\n }\n\n this.openMenu = undefined;\n }, 500);\n }\n\n /** Close the menu when it loses focus. */\n @Listen('focusout', { passive: true })\n handleFocusout(event: FocusEvent) {\n const relatedTarget = event.relatedTarget as HTMLElement;\n if (!this.openMenu || this.host.shadowRoot.querySelector('.menu')?.contains(relatedTarget)) {\n return;\n }\n\n this.openMenu = undefined;\n }\n\n /** Fetch data from passed URL. */\n private async fetchData(url: URL) {\n try {\n this.loading = true;\n const data = await (await fetch(url)).json();\n this.loading = false;\n if (!Array.isArray(data) || !data.every((item) => item satisfies MenubarItem)) {\n throw new Error('Invalid data structure. Expected an array of MenuItem objects.');\n }\n\n return data as MenubarItem[];\n } catch (error) {\n this.loading = false;\n console.error('Error fetching menubar data:', error);\n throw new Error('Failed to fetch menubar data from the provided URL.', { cause: error });\n }\n }\n\n /** Initialize tabindex on menuitems of menubars, setting -1 to all but the first one. */\n private initTabindex() {\n setTimeout(() => {\n this.host.shadowRoot.querySelectorAll('[role=\"menubar\"]')?.forEach((menubar) => {\n menubar\n .querySelectorAll('[role=\"menuitem\"]')\n ?.forEach((item, index) => item.setAttribute('tabindex', index === 0 ? '0' : '-1'));\n });\n }, 100);\n }\n\n /** Indicates whether the element has to be highlighted by checking whether it is set as current or one of its descendants is. */\n private isActive(item: MenubarItem) {\n if (this.currentPath.length === 0) {\n return false;\n }\n\n if (this.currentPath.includes(item.id)) {\n return true;\n }\n\n if (item.menuItems?.length) {\n return item.menuItems.some((menuItem) => menuItem.id === this.current);\n }\n\n if (item.navbarItems?.length) {\n const isActive = item.navbarItems.some((navbarItem) => this.isActive(navbarItem));\n if (isActive) {\n return true;\n }\n }\n\n return false;\n }\n\n /** Opens the menu associated with the menubar `item`, if any. */\n private showMenu(item: MenubarItem) {\n this.openMenu = undefined; // close any open menu first\n if (!item.menuItems?.length) {\n return;\n }\n\n this.openMenu = item.id;\n }\n\n /** Get all elements with `menuitem` role inside parent's `menubar`. * */\n private getParentMenubarElements(itemEl: HTMLElement) {\n return Array.from(\n itemEl?.closest('[role=\"menubar\"]')?.querySelectorAll(':scope > li a[role=\"menuitem\"]') ?? []\n ) as HTMLElement[];\n }\n\n /** Move the focus to the previous menubar item, or the last one. Then open its menu if any other menu was open. */\n private focusPreviousItem(itemEl: HTMLElement) {\n this.openMenu = undefined; // close any open menu first\n const menubarElements = this.getParentMenubarElements(itemEl);\n const currentIndex = menubarElements.indexOf(itemEl);\n const prevItem = menubarElements[(currentIndex - 1 + menubarElements.length) % menubarElements.length]; // get previous item or last one\n moveFocus(itemEl, prevItem);\n // open the item's menu if any other menu was open\n if (prevItem.ariaHasPopup === 'true' && this.openMenu) {\n this.openMenu = prevItem.id;\n }\n }\n\n /** Move the focus to the next menubar item, or the first one. Then open its menu if any other menu was open. */\n private focusNextItem(itemEl: HTMLElement) {\n this.openMenu = undefined; // close any open menu first\n const menubarElements = this.getParentMenubarElements(itemEl);\n const currentIndex = menubarElements.indexOf(itemEl);\n const nextItem = menubarElements[(currentIndex + 1) % menubarElements.length]; // get next item or first one\n moveFocus(itemEl, nextItem);\n // open the item's menu if any other menu was open\n if (nextItem.ariaHasPopup === 'true' && this.openMenu) {\n this.openMenu = nextItem.id;\n }\n }\n\n /** Handles keyboard navigation on menubar items. */\n private handleItemKeydown(event: KeyboardEvent, item: MenubarItem) {\n const target = event.target as HTMLElement;\n switch (event.key) {\n case 'Home': {\n event.preventDefault();\n event.stopPropagation();\n const firstItem = this.getParentMenubarElements(target)[0];\n moveFocus(target, firstItem);\n break;\n }\n case 'End': {\n event.preventDefault();\n event.stopPropagation();\n const lastItem = this.getParentMenubarElements(target).pop();\n moveFocus(target, lastItem);\n break;\n }\n case 'ArrowUp': {\n if (!item.menuItems?.length) {\n break;\n }\n event.preventDefault();\n event.stopPropagation();\n this.openMenu = item.id;\n // focus last item of the menu\n setTimeout(() => {\n const menuItems = Array.from(\n this.host.shadowRoot.querySelectorAll(`[aria-labelledby=${item.id}] [role=\"menuitem\"]`)\n ) as HTMLElement[];\n moveFocus(target, menuItems[menuItems.length - 1]);\n }, 100);\n break;\n }\n case 'ArrowRight': {\n event.preventDefault();\n event.stopPropagation();\n this.focusNextItem(target);\n break;\n }\n case 'ArrowDown': {\n if (!item.menuItems?.length) {\n break;\n }\n\n this.openItemMenu(item);\n break;\n }\n case 'ArrowLeft': {\n event.preventDefault();\n event.stopPropagation();\n this.focusPreviousItem(target);\n break;\n }\n case ' ': {\n event.preventDefault();\n event.stopPropagation();\n if (this.openMenu === item.id) {\n this.openMenu = undefined;\n break;\n } else if (item.menuItems?.length) {\n this.openItemMenu(item);\n break;\n }\n }\n }\n }\n\n /** Get the previous element with `role=group`. */\n private getPreviousGroup(groupContainer: HTMLElement) {\n const groups = Array.from(\n groupContainer?.closest('[role=\"menu\"]')?.querySelectorAll('[role=\"group\"]') ?? []\n ) as HTMLElement[];\n const currentIndex = groups.indexOf(groupContainer);\n\n return groups[currentIndex - 1];\n }\n\n /** Get the next element with `role=group`. */\n private getNextGroup(groupContainer: HTMLElement) {\n const groups = Array.from(\n groupContainer?.closest('[role=\"menu\"]')?.querySelectorAll('[role=\"group\"]') ?? []\n ) as HTMLElement[];\n const currentIndex = groups.indexOf(groupContainer);\n\n return groups[currentIndex + 1];\n }\n\n private openItemMenu(item: MenubarItem) {\n this.openMenu = item.id;\n setTimeout(() => {\n // focus first item of the menu\n const firstMenuItem = this.host.shadowRoot.querySelector(\n `[aria-labelledby=${item.id}] [role=\"menuitem\"]`\n ) as HTMLElement;\n firstMenuItem.tabIndex = 0;\n firstMenuItem.focus({ preventScroll: true });\n }, 100);\n }\n\n /** Handles keyboard navigation events from `Menu` component. */\n private handleMenuKeydown(event: KeyboardEvent) {\n const itemElement = event.target as HTMLElement;\n const items = Array.from(\n itemElement.closest('[role=\"menu\"]')?.querySelectorAll('[role=\"menuitem\"]') ?? []\n ) as HTMLElement[];\n const currentIndex = items.indexOf(itemElement);\n switch (event.key) {\n case 'ArrowUp': {\n event.preventDefault();\n event.stopPropagation();\n const prevItem = items[currentIndex - 1] || items[items.length - 1];\n moveFocus(itemElement, prevItem);\n break;\n }\n // Move the focus to the first item of the next group if any, otherwise move it to the next menubar item\n case 'ArrowRight': {\n event.preventDefault();\n event.stopPropagation();\n const currentGroup = itemElement.closest('[role=group]') as HTMLElement;\n const nextGroup = this.getNextGroup(currentGroup);\n if (!nextGroup) {\n itemElement.tabIndex = -1;\n const menuTriggerId = itemElement.closest('[role=\"menu\"][aria-labelledby]').getAttribute('aria-labelledby');\n const focusedItem = this.host.shadowRoot.getElementById(menuTriggerId);\n this.focusNextItem(focusedItem);\n break;\n }\n\n const nextGroupItems = (nextGroup.querySelectorAll('[role=\"menuitem\"]') ?? []) as HTMLElement[];\n moveFocus(itemElement, nextGroupItems[0]);\n break;\n }\n case 'ArrowDown': {\n event.preventDefault();\n event.stopPropagation();\n const nextItem = items[currentIndex + 1] || items[0];\n moveFocus(itemElement, nextItem);\n break;\n }\n // Move the focus to the first item of the previous group if any, otherwise move it to the previous menubar item\n case 'ArrowLeft': {\n event.preventDefault();\n event.stopPropagation();\n const currentGroup = itemElement.closest('[role=group]') as HTMLElement;\n const prevGroup = this.getPreviousGroup(currentGroup);\n if (!prevGroup) {\n itemElement.tabIndex = -1;\n const menuTriggerId = itemElement.closest('[role=\"menu\"][aria-labelledby]').getAttribute('aria-labelledby');\n const focusedItem = this.host.shadowRoot.getElementById(menuTriggerId);\n this.focusPreviousItem(focusedItem);\n break;\n }\n\n const prevGroupItems = (prevGroup.querySelectorAll('[role=\"menuitem\"]') ?? []) as HTMLElement[];\n moveFocus(itemElement, prevGroupItems[0]);\n break;\n }\n case 'Home':\n // Move to the first menu item\n event.preventDefault();\n event.stopPropagation();\n moveFocus(itemElement, items[0]);\n break;\n case 'End':\n // Move to the last menu item\n event.preventDefault();\n event.stopPropagation();\n moveFocus(itemElement, items[items.length - 1]);\n break;\n }\n }\n\n render() {\n if (this.isMobile) {\n return (\n <zanit-mobile-menubar\n items={this.items}\n currentPath={this.currentPath}\n searchQuery={this.searchQuery}\n loading={this.loading}\n />\n );\n }\n\n return (\n <nav aria-label=\"Zanichelli.it\">\n <div class=\"shadow-wrapper\">\n <div class=\"width-limiter\">\n <ul\n class=\"menubar\"\n role=\"menubar\"\n aria-label=\"Zanichelli.it\"\n >\n {this.loading &&\n [...new Array(4)].map((_, index) => (\n <Fragment>\n <li role=\"none\">\n <div class=\"menubar-item\">\n <z-ghost-loading></z-ghost-loading>\n </div>\n </li>\n {index < 3 && <li role=\"separator\"></li>}\n </Fragment>\n ))}\n {this.items?.map((item, index) => (\n <Fragment>\n <li role=\"none\">\n <a\n class={{\n 'menubar-item': true,\n 'active': this.isActive(item),\n }}\n href={item.href}\n id={item.id}\n role=\"menuitem\"\n tabIndex={-1}\n aria-expanded={\n item.menuItems?.length ? (this.openMenu === item.id ? 'true' : 'false') : undefined\n }\n aria-haspopup={item.menuItems?.length ? 'true' : 'false'}\n aria-current={this.current.includes(item.id) ? 'page' : 'false'}\n onPointerOver={() => this.showMenu(item)}\n onKeyDown={(event) => this.handleItemKeydown(event, item)}\n target={item.target}\n >\n <span data-text={item.label}>{item.label}</span>\n {item.menuItems?.length > 0 && (\n <z-icon\n name={this.openMenu === item.id ? 'chevron-up' : 'chevron-down'}\n width=\"0.875rem\"\n height=\"0.875rem\"\n />\n )}\n </a>\n </li>\n {index < this.items?.length - 1 && <li role=\"separator\"></li>}\n </Fragment>\n ))}\n </ul>\n <zanit-search-form\n searchQuery={this.searchQuery}\n onResetSearch={() => (this.searchQuery = undefined)}\n />\n </div>\n\n {this.items.map(\n (item) =>\n this.openMenu === item.id && (\n <Menu\n controlledBy={item.id}\n items={item.menuItems}\n currentPath={this.currentPath}\n onItemKeyDown={(event) => this.handleMenuKeydown(event)}\n />\n )\n )}\n </div>\n\n {this.items\n ?.filter((item) => this.isActive(item))\n .map(\n (item) =>\n item.navbarItems?.length && (\n <nav class={{ 'sub-menubar': true, 'shadow-wrapper': true }}>\n <ul role=\"menubar\">\n {item.navbarItems.map((subitem) => (\n <Fragment>\n <li role=\"none\">\n <a\n class={{\n 'menubar-item': true,\n 'active': this.isActive(subitem),\n }}\n href={subitem.href}\n id={subitem.id}\n role=\"menuitem\"\n tabIndex={-1}\n aria-haspopup={subitem.menuItems?.length ? 'true' : 'false'}\n aria-expanded={\n subitem.menuItems?.length ? (this.openMenu === subitem.id ? 'true' : 'false') : undefined\n }\n aria-current={this.current.includes(subitem.id) ? 'page' : 'false'}\n onPointerOver={() => this.showMenu(subitem)}\n onKeyDown={(event) => this.handleItemKeydown(event, subitem)}\n target={item.target}\n >\n <span>{subitem.label}</span>\n {subitem.menuItems?.length > 0 && (\n <z-icon\n name={this.openMenu === subitem.id ? 'chevron-up' : 'chevron-down'}\n width=\"0.75rem\"\n height=\"0.75rem\"\n />\n )}\n </a>\n </li>\n </Fragment>\n ))}\n </ul>\n {item.navbarItems.map(\n (subitem) =>\n this.openMenu === subitem.id && (\n <Menu\n controlledBy={subitem.id}\n items={subitem.menuItems}\n currentPath={this.currentPath}\n onItemKeyDown={(event) => this.handleMenuKeydown(event)}\n />\n )\n )}\n </nav>\n )\n )}\n </nav>\n );\n }\n}\n",":host {\n position: relative;\n z-index: 2;\n display: block;\n width: 100%;\n max-width: 100%;\n background-color: #fff;\n color: var(--gray900);\n fill: var(--gray900);\n font-family: var(--font-family-sans);\n}\n\n:host,\n*,\n::before,\n::after {\n box-sizing: border-box;\n}\n\n*:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\nul {\n padding: 0;\n margin: 0;\n list-style: none;\n}\n\na {\n color: var(--gray900);\n cursor: pointer;\n text-decoration: none;\n}\n\nbutton {\n all: unset;\n cursor: pointer;\n}\n\nnav {\n display: flex;\n width: 100%;\n align-items: center;\n padding-left: var(--grid-margin);\n gap: 8px;\n}\n\nnav::after {\n position: absolute;\n top: 0;\n right: 0;\n width: 100%;\n height: 100%;\n background: transparent;\n box-shadow: var(--shadow-1);\n content: '';\n pointer-events: none;\n}\n\nz-logo {\n margin: 8px 0;\n}\n\n.mobile-menu {\n position: absolute;\n top: 100%;\n left: 0;\n display: flex;\n width: 100%;\n flex-direction: column;\n padding: 16px var(--grid-margin) 32px;\n background-color: #fff;\n box-shadow: var(--shadow-2);\n gap: 8px;\n}\n\n.mobile-menu li {\n width: 100%;\n}\n\n.mobile-menu .items-container {\n display: flex;\n min-height: 256px;\n flex-direction: column;\n gap: 8px;\n}\n\n.mobile-menu .items-container z-ghost-loading {\n width: 40%;\n height: 1.2rem;\n}\n\n.mobile-menu .items-container .menubar-item {\n display: block;\n width: 100%;\n padding: 8px 0;\n font-size: 1rem;\n text-align: left;\n}\n\n.mobile-menu .items-container li:not(:last-child) .menubar-item {\n border-bottom: 1px solid #000;\n}\n\n[role='menuitem'].parent {\n display: flex;\n width: fit-content;\n align-items: center;\n padding: 0;\n border: none;\n font-size: 0.875rem;\n gap: 8px;\n}\n\nzanit-search-form {\n margin-left: auto;\n}\n",".menu-wrapper {\n width: 100%;\n background-color: #fff;\n}\n\n.menu {\n position: relative;\n display: flex;\n width: 100%;\n flex-direction: column;\n gap: 32px 0;\n}\n\n.menu .group {\n display: flex;\n flex-direction: column;\n}\n\n.menu .group .group-name {\n border-bottom: 1px solid currentcolor;\n margin-bottom: 4px;\n color: var(--red500);\n font-size: 0.875rem;\n font-weight: var(--font-md);\n}\n\n.menu .group .menu-list {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.menu .group .menu-list .menu-item {\n display: block;\n border-bottom: 2px solid transparent;\n font-size: 0.875rem;\n font-weight: var(--font-md);\n}\n\n.menu .menu-list .menu-item.active,\n.menu .menu-list .menu-item:hover {\n border-bottom-color: var(--red500);\n}\n\n.menu .group.highlight .menu-list .menu-item {\n font-size: 1rem;\n}\n\n@media (width >= 768px) {\n .menu-wrapper {\n position: absolute;\n top: 100%;\n left: 0;\n display: flex;\n justify-content: center;\n box-shadow: var(--shadow-1);\n }\n\n .menu {\n display: grid;\n width: 100%;\n max-width: var(--zanit-menubar-max-width, 1366px);\n padding: 16px var(--grid-margin);\n gap: 0 24px;\n grid-auto-columns: minmax(0, max-content);\n grid-auto-flow: column;\n grid-template-rows: minmax(0, max-content) max-content;\n }\n\n .menu .group {\n display: grid;\n grid-row: 1 / -1;\n grid-template-columns: 1fr;\n grid-template-rows: subgrid;\n }\n\n @supports not (grid-template-rows: subgrid) {\n .menu .group {\n grid-template-rows: repeat(auto-fit, minmax(0, max-content));\n }\n }\n\n .menu .group .group-name {\n border: none;\n margin-bottom: 16px;\n }\n\n .menu .group .menu-list .menu-item {\n font-size: 1rem;\n }\n\n .menu .group.highlight .menu-list .menu-item {\n font-size: 1.5rem;\n }\n}\n","import { Component, Element, h, Listen, Prop, State, Watch } from '@stencil/core';\nimport { MenubarItem, MenuItem } from '../../../utils';\nimport { Menu } from '../menu/menu';\nimport { containsTarget, moveFocus } from '../../../utils';\n\n/** Mobile menubar component. */\n@Component({\n tag: 'zanit-mobile-menubar',\n styleUrls: ['mobile-menubar.css', '../menu/menu.css'],\n shadow: true,\n})\nexport class ZanitMobileMenubar {\n @Element() host: HTMLZanitMobileMenubarElement;\n\n /** IDs path of the current item. */\n @Prop() currentPath: string[] = [];\n\n /** Menubar items. */\n @Prop() items: MenubarItem[] = [];\n\n /** Initial search query. */\n @Prop({ mutable: true }) searchQuery: string | undefined = undefined;\n\n /** Whether the menubar is loading the data. */\n @Prop() loading: boolean = false;\n\n /** Last active item ID. */\n @State() lastCurrent: string | undefined = undefined;\n @State() parentItem: MenubarItem | undefined = undefined;\n @State() menuItems: MenubarItem[] | MenuItem[] | undefined = undefined;\n /** Whether the items to render come from a menubar or a menu. */\n @State() menuType: 'menubar' | 'menu' | undefined = undefined;\n @State() open: boolean;\n\n @Watch('items')\n @Watch('currentPath')\n onItemsChange() {\n this.lastCurrent = this.currentPath?.length ? this.currentPath[this.currentPath.length - 1] : undefined;\n this.setupData(this.items);\n }\n\n /**\n * Find the current item and take its parent, `menuItems` or the `navbarItems`.\n */\n private setupData(items: MenubarItem[], parent?: MenubarItem) {\n // If no current item is defined, we show all items\n if (this.lastCurrent === undefined) {\n this.parentItem = undefined;\n this.menuType = 'menubar';\n this.menuItems = items;\n return;\n }\n\n for (const item of items) {\n if (item.id === this.lastCurrent) {\n this.parentItem = parent;\n this.menuType = item.menuItems?.length ? 'menu' : 'menubar';\n this.menuItems = item.menuItems || item.navbarItems;\n return;\n }\n\n if (\n this.currentPath.length > 1 &&\n item.id === this.currentPath[this.currentPath.length - 2] &&\n item.menuItems?.some(({ id }) => id === this.lastCurrent)\n ) {\n this.parentItem = item;\n this.menuType = item.menuItems?.length ? 'menu' : 'menubar';\n this.menuItems = item.menuItems || item.navbarItems;\n return;\n }\n\n if (item.navbarItems?.length) {\n this.setupData(item.navbarItems, item);\n }\n }\n }\n\n private get menuItemsElement() {\n return Array.from(this.host.shadowRoot.querySelectorAll('[role=\"menuitem\"]')) as HTMLElement[];\n }\n\n /** Initialize tabindex on menuitems, setting -1 to all but the first one. */\n private initTabindex() {\n this.menuItemsElement.forEach((item, index) => item.setAttribute('tabindex', index === 0 ? '0' : '-1'));\n }\n\n private toggleMenu() {\n if (this.open) {\n this.open = false;\n } else {\n this.open = true;\n setTimeout(() => {\n this.initTabindex();\n this.menuItemsElement[0]?.focus({ preventScroll: true });\n }, 200);\n }\n }\n\n /** Handles keyboard navigation on mobile menu. */\n private handleItemKeydown(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowUp': {\n event.preventDefault();\n event.stopPropagation();\n const items = this.menuItemsElement;\n const currentIndex = items.indexOf(event.target as HTMLElement);\n const prevItem = items[(currentIndex - 1 + items.length) % items.length];\n moveFocus(items[currentIndex], prevItem);\n break;\n }\n case 'ArrowDown': {\n event.preventDefault();\n event.stopPropagation();\n const items = this.menuItemsElement;\n const currentIndex = items.indexOf(event.target as HTMLElement);\n const nextItem = items[(currentIndex + 1) % items.length];\n moveFocus(items[currentIndex], nextItem);\n break;\n }\n case 'Home': {\n event.preventDefault();\n event.stopPropagation();\n moveFocus(event.target as HTMLElement, this.menuItemsElement[0]);\n break;\n }\n case 'End': {\n event.preventDefault();\n event.stopPropagation();\n moveFocus(event.target as HTMLElement, this.menuItemsElement.pop());\n break;\n }\n }\n }\n\n connectedCallback() {\n this.lastCurrent = this.currentPath?.length ? this.currentPath[this.currentPath.length - 1] : undefined;\n this.setupData(this.items);\n }\n\n /** Close the menu when clicking outside. */\n @Listen('click', { target: 'document', passive: true })\n handleOutsideClick(event: MouseEvent) {\n if (containsTarget(this.host, event)) {\n return;\n }\n\n this.open = false;\n }\n\n /** Close the menu when pressing Escape or Tab. */\n @Listen('keydown', { passive: true })\n handleKeydown(event: KeyboardEvent) {\n switch (event.key) {\n case 'Escape':\n this.open = false;\n break;\n case 'Tab':\n if (containsTarget(this.host, event)) {\n break;\n }\n\n this.open = false;\n break;\n }\n }\n\n /** Close the menu when the focus goes out. */\n @Listen('focusin', { target: 'document', passive: true })\n handleFocusout(event: FocusEvent) {\n if (containsTarget(this.host, event)) {\n return;\n }\n\n this.open = false;\n }\n\n render() {\n return (\n <nav aria-label=\"Zanichelli.it\">\n <button\n class=\"burger-button\"\n type=\"button\"\n aria-expanded={this.open ? 'true' : 'false'}\n aria-controls=\"mobile-menu\"\n aria-label={this.open ? 'Chiudi menù' : 'Apri menù'}\n onClick={() => this.toggleMenu()}\n >\n <z-icon\n name={this.open ? 'multiply' : 'burger-menu'}\n width=\"1.5rem\"\n height=\"1.5rem\"\n ></z-icon>\n </button>\n\n <z-logo\n imageAlt=\"Logo Zanichelli\"\n link=\"/\"\n height={32}\n width={126}\n ></z-logo>\n\n <zanit-search-form\n searchQuery={this.searchQuery}\n onResetSearch={() => (this.searchQuery = undefined)}\n />\n\n {this.open && (\n <ul\n class=\"mobile-menu\"\n role=\"menubar\"\n >\n {!this.loading && this.currentPath && this.currentPath.length > 0 && (\n <li role=\"none\">\n <a\n class=\"parent\"\n href={this.parentItem?.href ?? '/'}\n id={this.parentItem?.id ?? undefined}\n role=\"menuitem\"\n tabIndex={-1}\n onKeyDown={(event) => this.handleItemKeydown(event)}\n target={this.parentItem?.target}\n >\n <z-icon\n name=\"arrow-left\"\n width=\"0.5rem\"\n height=\"0.5rem\"\n ></z-icon>\n <span>\n {/* Show the 'Home' label if the current item is a root child. */}\n {this.parentItem?.label || 'Home'}\n </span>\n </a>\n </li>\n )}\n\n {this.loading ? (\n <div\n class=\"items-container\"\n role=\"none\"\n >\n {[...new Array(4)].map(() => (\n <li role=\"none\">\n <div\n class=\"menubar-item\"\n role=\"none\"\n >\n <z-ghost-loading></z-ghost-loading>\n </div>\n </li>\n ))}\n </div>\n ) : this.menuType === 'menu' ? (\n <Menu\n items={this.menuItems}\n controlledBy={this.parentItem?.id}\n currentPath={this.currentPath}\n onItemKeyDown={(event) => this.handleItemKeydown(event)}\n />\n ) : (\n this.menuItems?.length > 0 && (\n <div\n class=\"items-container\"\n role=\"none\"\n >\n {this.menuItems.map((item) => (\n <li role=\"none\">\n <a\n class={{\n 'menu-item': this.menuType === 'menu',\n 'menubar-item': this.menuType === 'menubar',\n }}\n href={item.href}\n id={item.id}\n role=\"menuitem\"\n aria-current={this.lastCurrent === item.id ? 'page' : 'false'}\n tabIndex={-1}\n onKeyDown={(event) => this.handleItemKeydown(event)}\n target={item.target}\n >\n <span data-text={item.label}>{item.label}</span>\n </a>\n </li>\n ))}\n </div>\n )\n )}\n </ul>\n )}\n </nav>\n );\n }\n}\n",":host,\n*,\n::before,\n::after {\n box-sizing: border-box;\n}\n\n*:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\nbutton {\n all: unset;\n cursor: pointer;\n}\n\n.searchbar {\n --searchbar-button-x-padding: 14px;\n --searchbar-button-icon-width: 1.75rem;\n\n /* button horizontal padding + icon size + left border */\n --closed-searchbar-width: calc((var(--searchbar-button-x-padding) * 2) + var(--searchbar-button-icon-width) + 1px);\n\n position: absolute;\n top: 0;\n right: 0;\n display: flex;\n width: var(--closed-searchbar-width);\n justify-content: flex-end;\n transition: width 0.4s ease-in-out;\n}\n\n.searchbar.searchbar-open {\n width: 100%;\n}\n\n.searchbar .input-wrapper {\n display: flex;\n overflow: hidden;\n width: 100%;\n align-items: center;\n padding: 8px;\n padding-left: var(--grid-margin);\n background-color: #fff;\n gap: 8px;\n transition-duration: 0.4s;\n transition-property: padding-right, padding-left, width;\n transition-timing-function: ease-in-out;\n}\n\n.searchbar:not(.searchbar-open) .input-wrapper {\n overflow: hidden;\n width: 0;\n padding: 0;\n}\n\n.searchbar button[type='reset'] {\n --z-icon-width: 1rem;\n --z-icon-height: 1rem;\n\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n\n.searchbar input {\n z-index: 1;\n width: 100%;\n height: 100%;\n padding: 0;\n border: none;\n background-color: #fff;\n font-family: var(--font-family-sans);\n font-size: 1rem;\n}\n\n.searchbar.searchbar-open input:first-child {\n padding-left: 4px;\n margin-left: -4px; /* per evitare che la focus shadow vada fuori dallo schermo */\n}\n\n.searchbar input[type='search']::-webkit-search-cancel-button,\n.searchbar input[type='search']::-webkit-search-decoration {\n appearance: none;\n}\n\n.searchbar input::placeholder {\n color: var(--gray500);\n}\n\n.searchbar .searchbar-button {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px var(--searchbar-button-x-padding);\n border-left: 1px solid #000;\n background: var(--zanit-accent-color);\n font-family: inherit;\n font-size: inherit;\n gap: 64px;\n line-height: 1;\n}\n\n.searchbar .searchbar-button:focus-visible {\n z-index: 1;\n}\n\n.searchbar-button z-icon {\n --z-icon-width: var(--searchbar-button-icon-width);\n --z-icon-height: var(--searchbar-button-icon-width);\n}\n\n@media (width < 1152px) {\n .searchbar .searchbar-button > .searchbar-button-label {\n display: none;\n }\n}\n\n@media (width >= 768px) {\n .searchbar {\n --searchbar-button-x-padding: 16px;\n --searchbar-button-icon-width: 2rem;\n }\n\n .searchbar .input-wrapper {\n gap: 14px;\n }\n\n .searchbar button[type='reset'] {\n --z-icon-width: 1.5rem;\n --z-icon-height: 1.5rem;\n }\n\n .searchbar input,\n .searchbar .searchbar-button {\n font-size: 1.5rem;\n }\n\n .searchbar .searchbar-button {\n padding: 8px var(--searchbar-button-x-padding);\n }\n}\n\n@media (width >= 1152px) {\n .searchbar {\n --closed-searchbar-width: 190px;\n }\n}\n\n@media (width >= 1366px) {\n .searchbar .searchbar-button {\n border-right: 1px solid #000;\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\nimport { containsTarget } from '../../../utils';\n\n@Component({\n tag: 'zanit-search-form',\n styleUrl: 'search-form.css',\n shadow: true,\n})\nexport class ZanitSearchForm {\n private formElement: HTMLFormElement;\n\n @Element() host: HTMLZanitSearchFormElement;\n\n /** Indicates whether the searchbar is visible and usable. */\n @State()\n showSearchbar: boolean = false;\n\n /** Search query to apply. */\n @State()\n _searchQuery: string | undefined = undefined;\n\n /** Initial search query */\n @Prop({ mutable: true })\n searchQuery: string | undefined = undefined;\n\n @Watch('searchQuery')\n onSearchQueryChange() {\n this._searchQuery = this.searchQuery;\n if (this.searchQuery) {\n this.openSearchbar();\n }\n }\n\n /** Emitted on search form submission. */\n @Event({ cancelable: true }) search: EventEmitter<{ query: string }>;\n\n @Event() resetSearch: EventEmitter<void>;\n\n async connectedCallback() {\n this.showSearchbar = !!this.searchQuery;\n this._searchQuery = this.searchQuery;\n }\n\n /** Close open searchbar when clicking outside. */\n @Listen('click', { target: 'document', passive: true })\n handleOutsideClick(event: MouseEvent) {\n if (this.showSearchbar && this.formElement && !containsTarget(this.formElement, event)) {\n this.showSearchbar = false;\n }\n }\n\n /** Close the menu when pressing Escape or Tab. */\n @Listen('keydown', { passive: true })\n handleKeydown(event: KeyboardEvent) {\n switch (event.key) {\n case 'Escape':\n this.showSearchbar = false;\n break;\n case 'Tab':\n if (containsTarget(this.host, event)) {\n break;\n }\n\n this.showSearchbar = false;\n break;\n }\n }\n\n private openSearchbar() {\n this.showSearchbar = true;\n setTimeout(() => {\n const searchbarInput = this.host.shadowRoot.querySelector('#searchbar-input') as HTMLInputElement;\n searchbarInput.focus({ preventScroll: true });\n }, 500);\n }\n\n private resetSearchQuery() {\n this.searchQuery = undefined;\n this.resetSearch.emit();\n }\n\n private handleInputChange(event: Event) {\n this._searchQuery = (event.target as HTMLInputElement).value;\n if (!this._searchQuery) {\n this.searchQuery = undefined;\n }\n }\n\n private onSearchSubmit(event: Event) {\n event.preventDefault();\n if (!this._searchQuery) {\n return;\n }\n\n this.showSearchbar = false;\n const searchEv = this.search.emit({ query: this._searchQuery });\n // do not submit the form if the event default behavior was prevented\n if (searchEv.defaultPrevented) {\n return;\n }\n\n this.formElement.submit();\n }\n\n render() {\n return (\n <form\n class={{ 'searchbar': true, 'searchbar-open': this.showSearchbar }}\n ref={(el) => (this.formElement = el)}\n role=\"search\"\n aria-label=\"Cerca nel sito\"\n method=\"get\"\n action=\"/ricerca\"\n onSubmit={(event) => this.onSearchSubmit(event)}\n onReset={() => this.resetSearchQuery()}\n >\n <div\n class=\"input-wrapper\"\n role=\"none\"\n >\n {this.searchQuery && (\n <button\n type=\"reset\"\n aria-label=\"Svuota campo di ricerca\"\n disabled={!this.showSearchbar}\n >\n <z-icon name=\"multiply-circled\" />\n </button>\n )}\n <input\n id=\"searchbar-input\"\n name=\"q\"\n type=\"search\"\n disabled={!this.showSearchbar}\n placeholder=\"Cerca per parola chiave o ISBN\"\n onInput={(event) => this.handleInputChange(event)}\n value={this.searchQuery}\n required\n ></input>\n </div>\n\n <button\n class=\"searchbar-button\"\n aria-label=\"Esegui ricerca\"\n aria-controls=\"searchbar-input\"\n type={this.showSearchbar ? 'submit' : 'button'}\n onClick={() => this.openSearchbar()}\n >\n {this.showSearchbar ? null : <span class=\"searchbar-button-label\">Cerca</span>}\n <z-icon name=\"search\"></z-icon>\n </button>\n </form>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,3 +1,3 @@
1
- const e="zanichelli-it-frontend-kit";const t={hydratedSelectorName:"hydrated",lazyLoad:true,updatable:true};const i=()=>{};const l=":root{--font-md:500}.title-1,.title-2,.title-3,.title-4,.title-5,.title-6,.title-1-rg,.title-2-rg,.title-3-rg,.title-4-rg,.title-5-rg,.title-6-rg,.title-1-lt,.title-2-lt,.title-3-lt,.title-4-lt,.title-5-lt,.title-6-lt,.title-1-sb,.title-2-sb,.title-3-sb,.title-4-sb,.title-5-sb,.title-6-sb,.title-1-bd,.title-2-bd,.title-3-bd,.title-4-bd,.title-5-bd,.title-6-bd,.title-1-md,.title-2-md,.title-3-md,.title-4-md,.title-5-md,.title-6-md{font-family:var(--font-family-serif);font-weight:var(--font-rg)}.title-1-lt,.title-2-lt,.title-3-lt,.title-4-lt,.title-5-lt,.title-6-lt,.heading-1-lt,.heading-2-lt,.heading-3-lt,.heading-4-lt,.body-1-lt,.body-2-lt,.body-3-lt,.body-4-lt,.body-5-lt,.body-6-lt,.body-7-lt,.interactive-1-lt,.interactive-2-lt{font-weight:var(--font-lt)}.title-1-md,.title-2-md,.title-3-md,.title-4-md,.title-5-md,.title-6-md,.heading-1-md,.heading-2-md,.heading-3-md,.heading-4-md,.body-1-md,.body-2-md,.body-3-md,.body-4-md,.body-5-md,.body-6-md,.body-7-md,.interactive-1-md,.interactive-2-md{font-weight:var(--font-md)}.title-1-rg,.title-2-rg,.title-3-rg,.title-4-rg,.title-5-rg,.title-6-rg,.heading-1-rg,.heading-2-rg,.heading-3-rg,.heading-4-rg,.body-1-rg,.body-2-rg,.body-3-rg,.body-4-rg,.body-5-rg,.body-6-rg,.body-7-rg,.interactive-1-rg,.interactive-2-rg{font-weight:var(--font-rg)}.title-1-sb,.title-2-sb,.title-3-sb,.title-4-sb,.title-5-sb,.title-6-sb,.heading-1-sb,.heading-2-sb,.heading-3-sb,.heading-4-sb,.body-2-sb,.body-3-sb,.body-4-sb,.body-5-sb,.body-6-sb,.body-7-sb,.interactive-1-sb,.interactive-2-sb{font-weight:var(--font-sb)}.title-1-bd,.title-2-bd,.title-3-bd,.title-4-bd,.title-5-bd,.title-6-bd,.heading-1-bd,.heading-2-bd,.heading-3-bd,.heading-4-bd,.body-1-bd,.body-2-bd,.body-3-bd,.body-4-bd,.body-5-bd,.body-6-bd,.body-7-bd,.interactive-1-bd,.interactive-2-bd{font-weight:var(--font-bd)}.font-lt{font-weight:var(--font-lt)}.font-rg{font-weight:var(--font-rg)}.font-md{font-weight:var(--font-md)}.font-sb{font-weight:var(--font-sb)}.font-bd{font-weight:var(--font-bd)}.font-it{font-style:italic}.font-serif{font-family:var(--font-family-serif)}.font-sans{font-family:var(--font-family-sans)}.title-1,.title-1-sb,.title-1-bd,.title-1-rg,.title-1-lt,.title-1-md{font-size:4.5rem;line-height:5rem;}.title-2,.title-2-sb,.title-2-bd,.title-2-rg,.title-2-lt,.title-2-md{font-size:3rem;line-height:3.25rem;}.title-3,.title-3-sb,.title-3-bd,.title-3-rg,.title-3-lt,.title-3-md{font-size:2rem;line-height:2.75rem;}.title-4,.title-4-sb,.title-4-bd,.title-4-rg,.title-4-lt,.title-4-md{font-size:1.75rem;line-height:2rem;}.title-5,.title-5-sb,.title-5-bd,.title-5-rg,.title-5-lt,.title-5-md{font-size:1.5rem;line-height:1.75rem;}.title-6,.title-6-sb,.title-6-bd,.title-6-rg,.title-6-lt,.title-6-md{font-size:1.25rem;line-height:1.75rem;}.heading-1,.heading-1-sb,.heading-1-bd,.heading-1-rg,.heading-1-lt,.heading-1-md{font-size:2rem;line-height:2.75rem;}.heading-2,.heading-2-sb,.heading-2-bd,.heading-2-rg,.heading-2-lt,.heading-2-md{font-size:1.75rem;line-height:2rem;}.heading-3,.heading-3-sb,.heading-3-bd,.heading-3-rg,.heading-3-lt,.heading-3-md{font-size:1.5rem;line-height:1.75rem;}.heading-4,.heading-4-sb,.heading-4-bd,.heading-4-rg,.heading-4-lt,.heading-4-md{font-size:1.125rem;line-height:1.375rem;}.body-1,.body-1-sb,.body-1-bd,.body-1-rg,.body-1-lt,.body-1-md{font-size:1.5rem;line-height:2rem;}.body-2,.body-2-sb,.body-2-bd,.body-2-rg,.body-2-lt,.body-2-md{font-size:1.25rem;line-height:1.75rem;}.body-3,.body-3-sb,.body-3-bd,.body-3-rg,.body-3-lt,.body-3-md{font-size:1.125rem;line-height:1.5rem;}.body-4,.body-4-sb,.body-4-bd,.body-4-rg,.body-4-lt,.body-4-md{font-size:1rem;line-height:1.5rem;}.body-5,.body-5-sb,.body-5-bd,.body-5-rg,.body-5-lt,.body-5-md{font-size:0.875rem;line-height:1.125rem;}.body-6,.body-6-sb,.body-6-bd,.body-6-rg,.body-6-lt,.body-6-md{font-size:0.75rem;line-height:1rem;}.body-7,.body-7-sb,.body-7-bd,.body-7-rg,.body-7-lt,.body-7-md{font-size:0.625rem;line-height:0.875rem;}.interactive-1,.interactive-1-sb,.interactive-1-bd,.interactive-1-rg,.interactive-1-lt,.interactive-1-md{font-size:1rem;line-height:1.5rem;}.interactive-2,.interactive-2-sb,.interactive-2-bd,.interactive-2-rg,.interactive-2-lt,.interactive-2-md{font-size:0.875rem;line-height:1.125rem;}@media (width < 768px){.mobile-title-1,.mobile-title-1-sb,.mobile-title-1-bd,.mobile-title-1-rg,.mobile-title-1-lt,.mobile-title-1-md{font-size:4.5rem;line-height:5rem;}.mobile-title-2,.mobile-title-2-sb,.mobile-title-2-bd,.mobile-title-2-rg,.mobile-title-2-lt,.mobile-title-2-md{font-size:3rem;line-height:3.25rem;}.mobile-title-3,.mobile-title-3-sb,.mobile-title-3-bd,.mobile-title-3-rg,.mobile-title-3-lt,.mobile-title-3-md{font-size:2rem;line-height:2.75rem;}.mobile-title-4,.mobile-title-4-sb,.mobile-title-4-bd,.mobile-title-4-rg,.mobile-title-4-lt,.mobile-title-4-md{font-size:1.75rem;line-height:2rem;}.mobile-title-5,.mobile-title-5-sb,.mobile-title-5-bd,.mobile-title-5-rg,.mobile-title-5-lt,.mobile-title-5-md{font-size:1.5rem;line-height:1.75rem;}.mobile-title-6,.mobile-title-6-sb,.mobile-title-6-bd,.mobile-title-6-rg,.mobile-title-6-lt,.mobile-title-6-md{font-size:1.25rem;line-height:1.75rem;}.mobile-heading-1,.mobile-heading-1-sb,.mobile-heading-1-bd,.mobile-heading-1-rg,.mobile-heading-1-lt,.mobile-heading-1-md{font-size:2rem;line-height:2.75rem;}.mobile-heading-2,.mobile-heading-2-sb,.mobile-heading-2-bd,.mobile-heading-2-rg,.mobile-heading-2-lt,.mobile-heading-2-md{font-size:1.75rem;line-height:2rem;}.mobile-heading-3,.mobile-heading-3-sb,.mobile-heading-3-bd,.mobile-heading-3-rg,.mobile-heading-3-lt,.mobile-heading-3-md{font-size:1.5rem;line-height:1.75rem;}.mobile-heading-4,.mobile-heading-4-sb,.mobile-heading-4-bd,.mobile-heading-4-rg,.mobile-heading-4-lt,.mobile-heading-4-md{font-size:1.125rem;line-height:1.375rem;}.mobile-body-1,.mobile-body-1-sb,.mobile-body-1-bd,.mobile-body-1-rg,.mobile-body-1-lt,.mobile-body-1-md{font-size:1.5rem;line-height:2rem;}.mobile-body-2,.mobile-body-2-sb,.mobile-body-2-bd,.mobile-body-2-rg,.mobile-body-2-lt,.mobile-body-2-md{font-size:1.25rem;line-height:1.75rem;}.mobile-body-3,.mobile-body-3-sb,.mobile-body-3-bd,.mobile-body-3-rg,.mobile-body-3-lt,.mobile-body-3-md{font-size:1.125rem;line-height:1.5rem;}.mobile-body-4,.mobile-body-4-sb,.mobile-body-4-bd,.mobile-body-4-rg,.mobile-body-4-lt,.mobile-body-4-md{font-size:1rem;line-height:1.5rem;}.mobile-body-5,.mobile-body-5-sb,.mobile-body-5-bd,.mobile-body-5-rg,.mobile-body-5-lt,.mobile-body-5-md{font-size:0.875rem;line-height:1.125rem;}.mobile-body-6,.mobile-body-6-sb,.mobile-body-6-bd,.mobile-body-6-rg,.mobile-body-6-lt,.mobile-body-6-md{font-size:0.75rem;line-height:1rem;}.mobile-body-7,.mobile-body-7-sb,.mobile-body-7-bd,.mobile-body-7-rg,.mobile-body-7-lt,.mobile-body-7-md{font-size:0.625rem;line-height:0.875rem;}.mobile-interactive-1,.mobile-interactive-1-sb,.mobile-interactive-1-bd,.mobile-interactive-1-rg,.mobile-interactive-1-lt,.mobile-interactive-1-md{font-size:1rem;line-height:1.5rem;}.mobile-interactive-2,.mobile-interactive-2-sb,.mobile-interactive-2-bd,.mobile-interactive-2-rg,.mobile-interactive-2-lt,.mobile-interactive-2-md{font-size:0.875rem;line-height:1.125rem;}}@media (width >= 768px) and (width < 1152px){.tablet-title-1,.tablet-title-1-sb,.tablet-title-1-bd,.tablet-title-1-rg,.tablet-title-1-lt,.tablet-title-1-md{font-size:4.5rem;line-height:5rem;}.tablet-title-2,.tablet-title-2-sb,.tablet-title-2-bd,.tablet-title-2-rg,.tablet-title-2-lt,.tablet-title-2-md{font-size:3rem;line-height:3.25rem;}.tablet-title-3,.tablet-title-3-sb,.tablet-title-3-bd,.tablet-title-3-rg,.tablet-title-3-lt,.tablet-title-3-md{font-size:2rem;line-height:2.75rem;}.tablet-title-4,.tablet-title-4-sb,.tablet-title-4-bd,.tablet-title-4-rg,.tablet-title-4-lt,.tablet-title-4-md{font-size:1.75rem;line-height:2rem;}.tablet-title-5,.tablet-title-5-sb,.tablet-title-5-bd,.tablet-title-5-rg,.tablet-title-5-lt,.tablet-title-5-md{font-size:1.5rem;line-height:1.75rem;}.tablet-title-6,.tablet-title-6-sb,.tablet-title-6-bd,.tablet-title-6-rg,.tablet-title-6-lt,.tablet-title-6-md{font-size:1.25rem;line-height:1.75rem;}.tablet-heading-1,.tablet-heading-1-sb,.tablet-heading-1-bd,.tablet-heading-1-rg,.tablet-heading-1-lt,.tablet-heading-1-md{font-size:2rem;line-height:2.75rem;}.tablet-heading-2,.tablet-heading-2-sb,.tablet-heading-2-bd,.tablet-heading-2-rg,.tablet-heading-2-lt,.tablet-heading-2-md{font-size:1.75rem;line-height:2rem;}.tablet-heading-3,.tablet-heading-3-sb,.tablet-heading-3-bd,.tablet-heading-3-rg,.tablet-heading-3-lt,.tablet-heading-3-md{font-size:1.5rem;line-height:1.75rem;}.tablet-heading-4,.tablet-heading-4-sb,.tablet-heading-4-bd,.tablet-heading-4-rg,.tablet-heading-4-lt,.tablet-heading-4-md{font-size:1.125rem;line-height:1.375rem;}.tablet-body-1,.tablet-body-1-sb,.tablet-body-1-bd,.tablet-body-1-rg,.tablet-body-1-lt,.tablet-body-1-md{font-size:1.5rem;line-height:2rem;}.tablet-body-2,.tablet-body-2-sb,.tablet-body-2-bd,.tablet-body-2-rg,.tablet-body-2-lt,.tablet-body-2-md{font-size:1.25rem;line-height:1.75rem;}.tablet-body-3,.tablet-body-3-sb,.tablet-body-3-bd,.tablet-body-3-rg,.tablet-body-3-lt,.tablet-body-3-md{font-size:1.125rem;line-height:1.5rem;}.tablet-body-4,.tablet-body-4-sb,.tablet-body-4-bd,.tablet-body-4-rg,.tablet-body-4-lt,.tablet-body-4-md{font-size:1rem;line-height:1.5rem;}.tablet-body-5,.tablet-body-5-sb,.tablet-body-5-bd,.tablet-body-5-rg,.tablet-body-5-lt,.tablet-body-5-md{font-size:0.875rem;line-height:1.125rem;}.tablet-body-6,.tablet-body-6-sb,.tablet-body-6-bd,.tablet-body-6-rg,.tablet-body-6-lt,.tablet-body-6-md{font-size:0.75rem;line-height:1rem;}.tablet-body-7,.tablet-body-7-sb,.tablet-body-7-bd,.tablet-body-7-rg,.tablet-body-7-lt,.tablet-body-7-md{font-size:0.625rem;line-height:0.875rem;}.tablet-interactive-1,.tablet-interactive-1-sb,.tablet-interactive-1-bd,.tablet-interactive-1-rg,.tablet-interactive-1-lt,.tablet-interactive-1-md{font-size:1rem;line-height:1.5rem;}.tablet-interactive-2,.tablet-interactive-2-sb,.tablet-interactive-2-bd,.tablet-interactive-2-rg,.tablet-interactive-2-lt,.tablet-interactive-2-md{font-size:0.875rem;line-height:1.125rem;}}@media (width >= 1152px){.desktop-title-1,.desktop-title-1-sb,.desktop-title-1-bd,.desktop-title-1-rg,.desktop-title-1-lt,.desktop-title-1-md{font-size:4.5rem;line-height:5rem;}.desktop-title-2,.desktop-title-2-sb,.desktop-title-2-bd,.desktop-title-2-rg,.desktop-title-2-lt,.desktop-title-2-md{font-size:3rem;line-height:3.25rem;}.desktop-title-3,.desktop-title-3-sb,.desktop-title-3-bd,.desktop-title-3-rg,.desktop-title-3-lt,.desktop-title-3-md{font-size:2rem;line-height:2.75rem;}.desktop-title-4,.desktop-title-4-sb,.desktop-title-4-bd,.desktop-title-4-rg,.desktop-title-4-lt,.desktop-title-4-md{font-size:1.75rem;line-height:2rem;}.desktop-title-5,.desktop-title-5-sb,.desktop-title-5-bd,.desktop-title-5-rg,.desktop-title-5-lt,.desktop-title-5-md{font-size:1.5rem;line-height:1.75rem;}.desktop-title-6,.desktop-title-6-sb,.desktop-title-6-bd,.desktop-title-6-rg,.desktop-title-6-lt,.desktop-title-6-md{font-size:1.25rem;line-height:1.75rem;}.desktop-heading-1,.desktop-heading-1-sb,.desktop-heading-1-bd,.desktop-heading-1-rg,.desktop-heading-1-lt,.desktop-heading-1-md{font-size:2rem;line-height:2.75rem;}.desktop-heading-2,.desktop-heading-2-sb,.desktop-heading-2-bd,.desktop-heading-2-rg,.desktop-heading-2-lt,.desktop-heading-2-md{font-size:1.75rem;line-height:2rem;}.desktop-heading-3,.desktop-heading-3-sb,.desktop-heading-3-bd,.desktop-heading-3-rg,.desktop-heading-3-lt,.desktop-heading-3-md{font-size:1.5rem;line-height:1.75rem;}.desktop-heading-4,.desktop-heading-4-sb,.desktop-heading-4-bd,.desktop-heading-4-rg,.desktop-heading-4-lt,.desktop-heading-4-md{font-size:1.125rem;line-height:1.375rem;}.desktop-body-1,.desktop-body-1-sb,.desktop-body-1-bd,.desktop-body-1-rg,.desktop-body-1-lt,.desktop-body-1-md{font-size:1.5rem;line-height:2rem;}.desktop-body-2,.desktop-body-2-sb,.desktop-body-2-bd,.desktop-body-2-rg,.desktop-body-2-lt,.desktop-body-2-md{font-size:1.25rem;line-height:1.75rem;}.desktop-body-3,.desktop-body-3-sb,.desktop-body-3-bd,.desktop-body-3-rg,.desktop-body-3-lt,.desktop-body-3-md{font-size:1.125rem;line-height:1.5rem;}.desktop-body-4,.desktop-body-4-sb,.desktop-body-4-bd,.desktop-body-4-rg,.desktop-body-4-lt,.desktop-body-4-md{font-size:1rem;line-height:1.5rem;}.desktop-body-5,.desktop-body-5-sb,.desktop-body-5-bd,.desktop-body-5-rg,.desktop-body-5-lt,.desktop-body-5-md{font-size:0.875rem;line-height:1.125rem;}.desktop-body-6,.desktop-body-6-sb,.desktop-body-6-bd,.desktop-body-6-rg,.desktop-body-6-lt,.desktop-body-6-md{font-size:0.75rem;line-height:1rem;}.desktop-body-7,.desktop-body-7-sb,.desktop-body-7-bd,.desktop-body-7-rg,.desktop-body-7-lt,.desktop-body-7-md{font-size:0.625rem;line-height:0.875rem;}.desktop-interactive-1,.desktop-interactive-1-sb,.desktop-interactive-1-bd,.desktop-interactive-1-rg,.desktop-interactive-1-lt,.desktop-interactive-1-md{font-size:1rem;line-height:1.5rem;}.desktop-interactive-2,.desktop-interactive-2-sb,.desktop-interactive-2-bd,.desktop-interactive-2-rg,.desktop-interactive-2-lt,.desktop-interactive-2-md{font-size:0.875rem;line-height:1.125rem;}}z-button.zanit-button{--color-primary01:var(--red500);--color-hover-primary:var(--red800);--color-pressed-primary:var(--red400);--color-button-secondary:transparent;--color-primary02:transparent;--color-primary03:transparent}z-button.zanit-button-dark{--color-primary01:var(--gray950);--color-hover-primary:#000;--color-pressed-primary:var(--gray950);--color-button-secondary:transparent;--color-primary02:transparent;--color-primary03:transparent}:root{--zanit-accent-color:#ffe74c;--shadow-focus-primary:0 0 0 2px #fff, 0 0 2px 5px var(--gray950)}.zanit-link,.zanit-link-inverse{color:currentcolor;font-family:inherit;text-decoration:underline solid 12% var(--red500);text-underline-offset:28%}.zanit-link-inverse{color:var(--color-text-inverse);text-decoration-color:var(--color-text-inverse)}";var o=Object.defineProperty;var n=(e,t)=>{for(var i in t)o(e,i,{get:t[i],enumerable:true})};var r=(e,t)=>{var i;const l=t.t;const o=Object.entries((i=l.i)!=null?i:{});o.map((([i,[l]])=>{if(l&31||l&32){const l=e[i];const o=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(e),i);Object.defineProperty(e,i,{get(){return o.get.call(this)},set(e){o.set.call(this,e)},configurable:true,enumerable:true});e[i]=t.l.has(i)?t.l.get(i):l}}))};var d=e=>{if(e.__stencil__getHostRef){return e.__stencil__getHostRef()}return void 0};var s=(e,t)=>{e.__stencil__getHostRef=()=>t;t.o=e;{r(e,t)}};var b=(e,t)=>{const i={m:0,$hostElement$:e,t,l:new Map};{i.h=new Promise((e=>i.v=e));e["s-p"]=[];e["s-rc"]=[]}const l=i;e.__stencil__getHostRef=()=>l;return l};var a=(e,t)=>t in e;var m=(e,t)=>(0,console.error)(e,t);var f=new Map;var h=(e,t,i)=>{const l=e.p.replace(/-/g,"_");const o=e.u;if(!o){return void 0}const n=f.get(o);if(n){return n[l]}
1
+ const e="zanichelli-it-frontend-kit";const t={hydratedSelectorName:"hydrated",lazyLoad:true,updatable:true};const i=()=>{};const l=":root{--font-md:500}.title-1,.title-2,.title-3,.title-4,.title-5,.title-6,.title-1-rg,.title-2-rg,.title-3-rg,.title-4-rg,.title-5-rg,.title-6-rg,.title-1-lt,.title-2-lt,.title-3-lt,.title-4-lt,.title-5-lt,.title-6-lt,.title-1-sb,.title-2-sb,.title-3-sb,.title-4-sb,.title-5-sb,.title-6-sb,.title-1-bd,.title-2-bd,.title-3-bd,.title-4-bd,.title-5-bd,.title-6-bd,.title-1-md,.title-2-md,.title-3-md,.title-4-md,.title-5-md,.title-6-md{font-family:var(--font-family-serif);font-weight:var(--font-rg)}.title-1-lt,.title-2-lt,.title-3-lt,.title-4-lt,.title-5-lt,.title-6-lt,.heading-1-lt,.heading-2-lt,.heading-3-lt,.heading-4-lt,.body-1-lt,.body-2-lt,.body-3-lt,.body-4-lt,.body-5-lt,.body-6-lt,.body-7-lt,.interactive-1-lt,.interactive-2-lt{font-weight:var(--font-lt)}.title-1-md,.title-2-md,.title-3-md,.title-4-md,.title-5-md,.title-6-md,.heading-1-md,.heading-2-md,.heading-3-md,.heading-4-md,.body-1-md,.body-2-md,.body-3-md,.body-4-md,.body-5-md,.body-6-md,.body-7-md,.interactive-1-md,.interactive-2-md{font-weight:var(--font-md)}.title-1-rg,.title-2-rg,.title-3-rg,.title-4-rg,.title-5-rg,.title-6-rg,.heading-1-rg,.heading-2-rg,.heading-3-rg,.heading-4-rg,.body-1-rg,.body-2-rg,.body-3-rg,.body-4-rg,.body-5-rg,.body-6-rg,.body-7-rg,.interactive-1-rg,.interactive-2-rg{font-weight:var(--font-rg)}.title-1-sb,.title-2-sb,.title-3-sb,.title-4-sb,.title-5-sb,.title-6-sb,.heading-1-sb,.heading-2-sb,.heading-3-sb,.heading-4-sb,.body-2-sb,.body-3-sb,.body-4-sb,.body-5-sb,.body-6-sb,.body-7-sb,.interactive-1-sb,.interactive-2-sb{font-weight:var(--font-sb)}.title-1-bd,.title-2-bd,.title-3-bd,.title-4-bd,.title-5-bd,.title-6-bd,.heading-1-bd,.heading-2-bd,.heading-3-bd,.heading-4-bd,.body-1-bd,.body-2-bd,.body-3-bd,.body-4-bd,.body-5-bd,.body-6-bd,.body-7-bd,.interactive-1-bd,.interactive-2-bd{font-weight:var(--font-bd)}.font-lt{font-weight:var(--font-lt)}.font-rg{font-weight:var(--font-rg)}.font-md{font-weight:var(--font-md)}.font-sb{font-weight:var(--font-sb)}.font-bd{font-weight:var(--font-bd)}.font-it{font-style:italic}.font-serif{font-family:var(--font-family-serif)}.font-sans{font-family:var(--font-family-sans)}.title-1,.title-1-sb,.title-1-bd,.title-1-rg,.title-1-lt,.title-1-md{font-size:72px;line-height:80px}.title-2,.title-2-sb,.title-2-bd,.title-2-rg,.title-2-lt,.title-2-md{font-size:48px;line-height:52px}.title-3,.title-3-sb,.title-3-bd,.title-3-rg,.title-3-lt,.title-3-md{font-size:2rem;line-height:2.75rem;}.title-4,.title-4-sb,.title-4-bd,.title-4-rg,.title-4-lt,.title-4-md{font-size:1.75rem;line-height:2rem;}.title-5,.title-5-sb,.title-5-bd,.title-5-rg,.title-5-lt,.title-5-md{font-size:1.5rem;line-height:1.75rem;}.title-6,.title-6-sb,.title-6-bd,.title-6-rg,.title-6-lt,.title-6-md{font-size:1.25rem;line-height:1.75rem;}.heading-1,.heading-1-sb,.heading-1-bd,.heading-1-rg,.heading-1-lt,.heading-1-md{font-size:2rem;line-height:2.75rem;}.heading-2,.heading-2-sb,.heading-2-bd,.heading-2-rg,.heading-2-lt,.heading-2-md{font-size:1.75rem;line-height:2rem;}.heading-3,.heading-3-sb,.heading-3-bd,.heading-3-rg,.heading-3-lt,.heading-3-md{font-size:1.5rem;line-height:1.75rem;}.heading-4,.heading-4-sb,.heading-4-bd,.heading-4-rg,.heading-4-lt,.heading-4-md{font-size:1.125rem;line-height:1.375rem;}.body-1,.body-1-sb,.body-1-bd,.body-1-rg,.body-1-lt,.body-1-md{font-size:1.5rem;line-height:2rem;}.body-2,.body-2-sb,.body-2-bd,.body-2-rg,.body-2-lt,.body-2-md{font-size:1.25rem;line-height:1.75rem;}.body-3,.body-3-sb,.body-3-bd,.body-3-rg,.body-3-lt,.body-3-md{font-size:1.125rem;line-height:1.5rem;}.body-4,.body-4-sb,.body-4-bd,.body-4-rg,.body-4-lt,.body-4-md{font-size:1rem;line-height:1.5rem;}.body-5,.body-5-sb,.body-5-bd,.body-5-rg,.body-5-lt,.body-5-md{font-size:0.875rem;line-height:1.125rem;}.body-6,.body-6-sb,.body-6-bd,.body-6-rg,.body-6-lt,.body-6-md{font-size:0.75rem;line-height:1rem;}.body-7,.body-7-sb,.body-7-bd,.body-7-rg,.body-7-lt,.body-7-md{font-size:0.625rem;line-height:0.875rem;}.interactive-1,.interactive-1-sb,.interactive-1-bd,.interactive-1-rg,.interactive-1-lt,.interactive-1-md{font-size:1rem;line-height:1.5rem;}.interactive-2,.interactive-2-sb,.interactive-2-bd,.interactive-2-rg,.interactive-2-lt,.interactive-2-md{font-size:0.875rem;line-height:1.125rem;}@media (width < 768px){.mobile-title-1,.mobile-title-1-sb,.mobile-title-1-bd,.mobile-title-1-rg,.mobile-title-1-lt,.mobile-title-1-md{font-size:4.5rem;line-height:5rem;}.mobile-title-2,.mobile-title-2-sb,.mobile-title-2-bd,.mobile-title-2-rg,.mobile-title-2-lt,.mobile-title-2-md{font-size:3rem;line-height:3.25rem;}.mobile-title-3,.mobile-title-3-sb,.mobile-title-3-bd,.mobile-title-3-rg,.mobile-title-3-lt,.mobile-title-3-md{font-size:2rem;line-height:2.75rem;}.mobile-title-4,.mobile-title-4-sb,.mobile-title-4-bd,.mobile-title-4-rg,.mobile-title-4-lt,.mobile-title-4-md{font-size:1.75rem;line-height:2rem;}.mobile-title-5,.mobile-title-5-sb,.mobile-title-5-bd,.mobile-title-5-rg,.mobile-title-5-lt,.mobile-title-5-md{font-size:1.5rem;line-height:1.75rem;}.mobile-title-6,.mobile-title-6-sb,.mobile-title-6-bd,.mobile-title-6-rg,.mobile-title-6-lt,.mobile-title-6-md{font-size:1.25rem;line-height:1.75rem;}.mobile-heading-1,.mobile-heading-1-sb,.mobile-heading-1-bd,.mobile-heading-1-rg,.mobile-heading-1-lt,.mobile-heading-1-md{font-size:2rem;line-height:2.75rem;}.mobile-heading-2,.mobile-heading-2-sb,.mobile-heading-2-bd,.mobile-heading-2-rg,.mobile-heading-2-lt,.mobile-heading-2-md{font-size:1.75rem;line-height:2rem;}.mobile-heading-3,.mobile-heading-3-sb,.mobile-heading-3-bd,.mobile-heading-3-rg,.mobile-heading-3-lt,.mobile-heading-3-md{font-size:1.5rem;line-height:1.75rem;}.mobile-heading-4,.mobile-heading-4-sb,.mobile-heading-4-bd,.mobile-heading-4-rg,.mobile-heading-4-lt,.mobile-heading-4-md{font-size:1.125rem;line-height:1.375rem;}.mobile-body-1,.mobile-body-1-sb,.mobile-body-1-bd,.mobile-body-1-rg,.mobile-body-1-lt,.mobile-body-1-md{font-size:1.5rem;line-height:2rem;}.mobile-body-2,.mobile-body-2-sb,.mobile-body-2-bd,.mobile-body-2-rg,.mobile-body-2-lt,.mobile-body-2-md{font-size:1.25rem;line-height:1.75rem;}.mobile-body-3,.mobile-body-3-sb,.mobile-body-3-bd,.mobile-body-3-rg,.mobile-body-3-lt,.mobile-body-3-md{font-size:1.125rem;line-height:1.5rem;}.mobile-body-4,.mobile-body-4-sb,.mobile-body-4-bd,.mobile-body-4-rg,.mobile-body-4-lt,.mobile-body-4-md{font-size:1rem;line-height:1.5rem;}.mobile-body-5,.mobile-body-5-sb,.mobile-body-5-bd,.mobile-body-5-rg,.mobile-body-5-lt,.mobile-body-5-md{font-size:0.875rem;line-height:1.125rem;}.mobile-body-6,.mobile-body-6-sb,.mobile-body-6-bd,.mobile-body-6-rg,.mobile-body-6-lt,.mobile-body-6-md{font-size:0.75rem;line-height:1rem;}.mobile-body-7,.mobile-body-7-sb,.mobile-body-7-bd,.mobile-body-7-rg,.mobile-body-7-lt,.mobile-body-7-md{font-size:0.625rem;line-height:0.875rem;}.mobile-interactive-1,.mobile-interactive-1-sb,.mobile-interactive-1-bd,.mobile-interactive-1-rg,.mobile-interactive-1-lt,.mobile-interactive-1-md{font-size:1rem;line-height:1.5rem;}.mobile-interactive-2,.mobile-interactive-2-sb,.mobile-interactive-2-bd,.mobile-interactive-2-rg,.mobile-interactive-2-lt,.mobile-interactive-2-md{font-size:0.875rem;line-height:1.125rem;}}@media (width >= 768px) and (width < 1152px){.tablet-title-1,.tablet-title-1-sb,.tablet-title-1-bd,.tablet-title-1-rg,.tablet-title-1-lt,.tablet-title-1-md{font-size:4.5rem;line-height:5rem;}.tablet-title-2,.tablet-title-2-sb,.tablet-title-2-bd,.tablet-title-2-rg,.tablet-title-2-lt,.tablet-title-2-md{font-size:3rem;line-height:3.25rem;}.tablet-title-3,.tablet-title-3-sb,.tablet-title-3-bd,.tablet-title-3-rg,.tablet-title-3-lt,.tablet-title-3-md{font-size:2rem;line-height:2.75rem;}.tablet-title-4,.tablet-title-4-sb,.tablet-title-4-bd,.tablet-title-4-rg,.tablet-title-4-lt,.tablet-title-4-md{font-size:1.75rem;line-height:2rem;}.tablet-title-5,.tablet-title-5-sb,.tablet-title-5-bd,.tablet-title-5-rg,.tablet-title-5-lt,.tablet-title-5-md{font-size:1.5rem;line-height:1.75rem;}.tablet-title-6,.tablet-title-6-sb,.tablet-title-6-bd,.tablet-title-6-rg,.tablet-title-6-lt,.tablet-title-6-md{font-size:1.25rem;line-height:1.75rem;}.tablet-heading-1,.tablet-heading-1-sb,.tablet-heading-1-bd,.tablet-heading-1-rg,.tablet-heading-1-lt,.tablet-heading-1-md{font-size:2rem;line-height:2.75rem;}.tablet-heading-2,.tablet-heading-2-sb,.tablet-heading-2-bd,.tablet-heading-2-rg,.tablet-heading-2-lt,.tablet-heading-2-md{font-size:1.75rem;line-height:2rem;}.tablet-heading-3,.tablet-heading-3-sb,.tablet-heading-3-bd,.tablet-heading-3-rg,.tablet-heading-3-lt,.tablet-heading-3-md{font-size:1.5rem;line-height:1.75rem;}.tablet-heading-4,.tablet-heading-4-sb,.tablet-heading-4-bd,.tablet-heading-4-rg,.tablet-heading-4-lt,.tablet-heading-4-md{font-size:1.125rem;line-height:1.375rem;}.tablet-body-1,.tablet-body-1-sb,.tablet-body-1-bd,.tablet-body-1-rg,.tablet-body-1-lt,.tablet-body-1-md{font-size:1.5rem;line-height:2rem;}.tablet-body-2,.tablet-body-2-sb,.tablet-body-2-bd,.tablet-body-2-rg,.tablet-body-2-lt,.tablet-body-2-md{font-size:1.25rem;line-height:1.75rem;}.tablet-body-3,.tablet-body-3-sb,.tablet-body-3-bd,.tablet-body-3-rg,.tablet-body-3-lt,.tablet-body-3-md{font-size:1.125rem;line-height:1.5rem;}.tablet-body-4,.tablet-body-4-sb,.tablet-body-4-bd,.tablet-body-4-rg,.tablet-body-4-lt,.tablet-body-4-md{font-size:1rem;line-height:1.5rem;}.tablet-body-5,.tablet-body-5-sb,.tablet-body-5-bd,.tablet-body-5-rg,.tablet-body-5-lt,.tablet-body-5-md{font-size:0.875rem;line-height:1.125rem;}.tablet-body-6,.tablet-body-6-sb,.tablet-body-6-bd,.tablet-body-6-rg,.tablet-body-6-lt,.tablet-body-6-md{font-size:0.75rem;line-height:1rem;}.tablet-body-7,.tablet-body-7-sb,.tablet-body-7-bd,.tablet-body-7-rg,.tablet-body-7-lt,.tablet-body-7-md{font-size:0.625rem;line-height:0.875rem;}.tablet-interactive-1,.tablet-interactive-1-sb,.tablet-interactive-1-bd,.tablet-interactive-1-rg,.tablet-interactive-1-lt,.tablet-interactive-1-md{font-size:1rem;line-height:1.5rem;}.tablet-interactive-2,.tablet-interactive-2-sb,.tablet-interactive-2-bd,.tablet-interactive-2-rg,.tablet-interactive-2-lt,.tablet-interactive-2-md{font-size:0.875rem;line-height:1.125rem;}}@media (width >= 1152px){.desktop-title-1,.desktop-title-1-sb,.desktop-title-1-bd,.desktop-title-1-rg,.desktop-title-1-lt,.desktop-title-1-md{font-size:4.5rem;line-height:5rem;}.desktop-title-2,.desktop-title-2-sb,.desktop-title-2-bd,.desktop-title-2-rg,.desktop-title-2-lt,.desktop-title-2-md{font-size:3rem;line-height:3.25rem;}.desktop-title-3,.desktop-title-3-sb,.desktop-title-3-bd,.desktop-title-3-rg,.desktop-title-3-lt,.desktop-title-3-md{font-size:2rem;line-height:2.75rem;}.desktop-title-4,.desktop-title-4-sb,.desktop-title-4-bd,.desktop-title-4-rg,.desktop-title-4-lt,.desktop-title-4-md{font-size:1.75rem;line-height:2rem;}.desktop-title-5,.desktop-title-5-sb,.desktop-title-5-bd,.desktop-title-5-rg,.desktop-title-5-lt,.desktop-title-5-md{font-size:1.5rem;line-height:1.75rem;}.desktop-title-6,.desktop-title-6-sb,.desktop-title-6-bd,.desktop-title-6-rg,.desktop-title-6-lt,.desktop-title-6-md{font-size:1.25rem;line-height:1.75rem;}.desktop-heading-1,.desktop-heading-1-sb,.desktop-heading-1-bd,.desktop-heading-1-rg,.desktop-heading-1-lt,.desktop-heading-1-md{font-size:2rem;line-height:2.75rem;}.desktop-heading-2,.desktop-heading-2-sb,.desktop-heading-2-bd,.desktop-heading-2-rg,.desktop-heading-2-lt,.desktop-heading-2-md{font-size:1.75rem;line-height:2rem;}.desktop-heading-3,.desktop-heading-3-sb,.desktop-heading-3-bd,.desktop-heading-3-rg,.desktop-heading-3-lt,.desktop-heading-3-md{font-size:1.5rem;line-height:1.75rem;}.desktop-heading-4,.desktop-heading-4-sb,.desktop-heading-4-bd,.desktop-heading-4-rg,.desktop-heading-4-lt,.desktop-heading-4-md{font-size:1.125rem;line-height:1.375rem;}.desktop-body-1,.desktop-body-1-sb,.desktop-body-1-bd,.desktop-body-1-rg,.desktop-body-1-lt,.desktop-body-1-md{font-size:1.5rem;line-height:2rem;}.desktop-body-2,.desktop-body-2-sb,.desktop-body-2-bd,.desktop-body-2-rg,.desktop-body-2-lt,.desktop-body-2-md{font-size:1.25rem;line-height:1.75rem;}.desktop-body-3,.desktop-body-3-sb,.desktop-body-3-bd,.desktop-body-3-rg,.desktop-body-3-lt,.desktop-body-3-md{font-size:1.125rem;line-height:1.5rem;}.desktop-body-4,.desktop-body-4-sb,.desktop-body-4-bd,.desktop-body-4-rg,.desktop-body-4-lt,.desktop-body-4-md{font-size:1rem;line-height:1.5rem;}.desktop-body-5,.desktop-body-5-sb,.desktop-body-5-bd,.desktop-body-5-rg,.desktop-body-5-lt,.desktop-body-5-md{font-size:0.875rem;line-height:1.125rem;}.desktop-body-6,.desktop-body-6-sb,.desktop-body-6-bd,.desktop-body-6-rg,.desktop-body-6-lt,.desktop-body-6-md{font-size:0.75rem;line-height:1rem;}.desktop-body-7,.desktop-body-7-sb,.desktop-body-7-bd,.desktop-body-7-rg,.desktop-body-7-lt,.desktop-body-7-md{font-size:0.625rem;line-height:0.875rem;}.desktop-interactive-1,.desktop-interactive-1-sb,.desktop-interactive-1-bd,.desktop-interactive-1-rg,.desktop-interactive-1-lt,.desktop-interactive-1-md{font-size:1rem;line-height:1.5rem;}.desktop-interactive-2,.desktop-interactive-2-sb,.desktop-interactive-2-bd,.desktop-interactive-2-rg,.desktop-interactive-2-lt,.desktop-interactive-2-md{font-size:0.875rem;line-height:1.125rem;}}z-button.zanit-button{--color-primary01:var(--red500);--color-hover-primary:var(--red800);--color-pressed-primary:var(--red400);--color-button-secondary:transparent;--color-primary02:transparent;--color-primary03:transparent}z-button.zanit-button-dark{--color-primary01:var(--gray950);--color-hover-primary:#000;--color-pressed-primary:var(--gray950);--color-button-secondary:transparent;--color-primary02:transparent;--color-primary03:transparent}:root{--zanit-accent-color:#ffe74c;--shadow-focus-primary:0 0 0 2px #fff, 0 0 2px 5px var(--gray950)}.zanit-link,.zanit-link-inverse{color:currentcolor;font-family:inherit;text-decoration:underline solid 12% var(--red500);text-underline-offset:28%}.zanit-link-inverse{color:var(--color-text-inverse);text-decoration-color:var(--color-text-inverse)}";var o=Object.defineProperty;var n=(e,t)=>{for(var i in t)o(e,i,{get:t[i],enumerable:true})};var r=(e,t)=>{var i;const l=t.t;const o=Object.entries((i=l.i)!=null?i:{});o.map((([i,[l]])=>{if(l&31||l&32){const l=e[i];const o=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(e),i);Object.defineProperty(e,i,{get(){return o.get.call(this)},set(e){o.set.call(this,e)},configurable:true,enumerable:true});e[i]=t.l.has(i)?t.l.get(i):l}}))};var d=e=>{if(e.__stencil__getHostRef){return e.__stencil__getHostRef()}return void 0};var s=(e,t)=>{e.__stencil__getHostRef=()=>t;t.o=e;{r(e,t)}};var b=(e,t)=>{const i={m:0,$hostElement$:e,t,l:new Map};{i.h=new Promise((e=>i.v=e));e["s-p"]=[];e["s-rc"]=[]}const l=i;e.__stencil__getHostRef=()=>l;return l};var a=(e,t)=>t in e;var m=(e,t)=>(0,console.error)(e,t);var f=new Map;var h=(e,t,i)=>{const l=e.p.replace(/-/g,"_");const o=e.u;if(!o){return void 0}const n=f.get(o);if(n){return n[l]}
2
2
  /*!__STENCIL_STATIC_IMPORT_SWITCH__*/return import(`./${o}.entry.js${""}`).then((e=>{{f.set(o,e)}return e[l]}),(e=>{m(e,t.$hostElement$)}))};var c=new Map;var g="sty-id";var y="{visibility:hidden}.hydrated{visibility:inherit}";var v="slot-fb{display:contents}slot-fb[hidden]{display:none}";var p=typeof window!=="undefined"?window:{};var u={m:0,k:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,i,l)=>e.addEventListener(t,i,l),rel:(e,t,i,l)=>e.removeEventListener(t,i,l),ce:(e,t)=>new CustomEvent(e,t)};var k=(()=>{var e;let t=false;try{(e=p.document)==null?void 0:e.addEventListener("e",null,Object.defineProperty({},"passive",{get(){t=true}}))}catch(e){}return t})();var z=e=>Promise.resolve(e);var w=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replaceSync==="function"}catch(e){}return false})();var $=false;var S=[];var j=[];var x=(e,t)=>i=>{e.push(i);if(!$){$=true;if(t&&u.m&4){C(E)}else{u.raf(E)}}};var O=e=>{for(let t=0;t<e.length;t++){try{e[t](performance.now())}catch(e){m(e)}}e.length=0};var E=()=>{O(S);{O(j);if($=S.length>0){u.raf(E)}}};var C=e=>z().then(e);var M=x(j,true);var P=e=>{e=typeof e;return e==="object"||e==="function"};function U(e){var t,i,l;return(l=(i=(t=e.head)==null?void 0:t.querySelector('meta[name="csp-nonce"]'))==null?void 0:i.getAttribute("content"))!=null?l:void 0}var R=e=>e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&");var D={};n(D,{err:()=>W,map:()=>A,ok:()=>N,unwrap:()=>L,unwrapErr:()=>T});var N=e=>({isOk:true,isErr:false,value:e});var W=e=>({isOk:false,isErr:true,value:e});function A(e,t){if(e.isOk){const i=t(e.value);if(i instanceof Promise){return i.then((e=>N(e)))}else{return N(i)}}if(e.isErr){const t=e.value;return W(t)}throw"should never get here"}var L=e=>{if(e.isOk){return e.value}else{throw e.value}};var T=e=>{if(e.isErr){return e.value}else{throw e.value}};function F(e){const t=this.attachShadow({mode:"open"});if(w){const e=new CSSStyleSheet;e.replaceSync(l);t.adoptedStyleSheets.push(e)}}var H=(e,t="")=>{{return()=>{}}};var I=(e,t)=>{{return()=>{}}};var V=(e,t,...i)=>{let l=null;let o=null;let n=false;let r=false;const d=[];const s=t=>{for(let i=0;i<t.length;i++){l=t[i];if(Array.isArray(l)){s(l)}else if(l!=null&&typeof l!=="boolean"){if(n=typeof e!=="function"&&!P(l)){l=String(l)}if(n&&r){d[d.length-1].$+=l}else{d.push(n?q(null,l):l)}r=n}}};s(i);if(t){if(t.key){o=t.key}{const e=t.className||t.class;if(e){t.class=typeof e!=="object"?e:Object.keys(e).filter((t=>e[t])).join(" ")}}}if(typeof e==="function"){return e(t===null?{}:t,d,_)}const b=q(e,null);b.S=t;if(d.length>0){b.j=d}{b.O=o}return b};var q=(e,t)=>{const i={m:0,C:e,$:t,M:null,j:null};{i.S=null}{i.O=null}return i};var G={};var Y=e=>e&&e.C===G;var _={forEach:(e,t)=>e.map(B).forEach(t),map:(e,t)=>e.map(B).map(t).map(J)};var B=e=>({vattrs:e.S,vchildren:e.j,vkey:e.O,vname:e.P,vtag:e.C,vtext:e.$});var J=e=>{if(typeof e.vtag==="function"){const t={...e.vattrs};if(e.vkey){t.key=e.vkey}if(e.vname){t.name=e.vname}return V(e.vtag,t,...e.vchildren||[])}const t=q(e.vtag,e.vtext);t.S=e.vattrs;t.j=e.vchildren;t.O=e.vkey;t.P=e.vname;return t};var K=e=>{const t=R(e);return new RegExp(`(^|[^@]|@(?!supports\\s+selector\\s*\\([^{]*?${t}))(${t}\\b)`,"g")};K("::slotted");K(":host");K(":host-context");var Q=(e,t)=>{if(e!=null&&!P(e)){if(t&4){return e==="false"?false:e===""||!!e}if(t&1){return String(e)}return e}return e};var X=e=>d(e).$hostElement$;var Z=(e,t,i)=>{const l=X(e);return{emit:e=>ee(l,t,{bubbles:true,composed:true,cancelable:true,detail:e})}};var ee=(e,t,i)=>{const l=u.ce(t,i);e.dispatchEvent(l);return l};var te=new WeakMap;var ie=(e,t,i)=>{let l=c.get(e);if(w&&i){l=l||new CSSStyleSheet;if(typeof l==="string"){l=t}else{l.replaceSync(t)}}else{l=t}c.set(e,l)};var le=(e,t,i)=>{var l;const o=ne(t);const n=c.get(o);if(!p.document){return o}e=e.nodeType===11?e:p.document;if(n){if(typeof n==="string"){e=e.head||e;let i=te.get(e);let r;if(!i){te.set(e,i=new Set)}if(!i.has(o)){{r=document.querySelector(`[${g}="${o}"]`)||p.document.createElement("style");r.innerHTML=n;const i=(l=u.U)!=null?l:U(p.document);if(i!=null){r.setAttribute("nonce",i)}if(!(t.m&1)){if(e.nodeName==="HEAD"){const t=e.querySelectorAll("link[rel=preconnect]");const i=t.length>0?t[t.length-1].nextSibling:e.querySelector("style");e.insertBefore(r,(i==null?void 0:i.parentNode)===e?i:null)}else if("host"in e){if(w){const t=new CSSStyleSheet;t.replaceSync(n);e.adoptedStyleSheets=[t,...e.adoptedStyleSheets]}else{const t=e.querySelector("style");if(t){t.innerHTML=n+t.innerHTML}else{e.prepend(r)}}}else{e.append(r)}}if(t.m&1){e.insertBefore(r,null)}}if(t.m&4){r.innerHTML+=v}if(i){i.add(o)}}}else if(!e.adoptedStyleSheets.includes(n)){e.adoptedStyleSheets=[...e.adoptedStyleSheets,n]}}return o};var oe=e=>{const t=e.t;const i=e.$hostElement$;const l=t.m;const o=H("attachStyles",t.p);const n=le(i.shadowRoot?i.shadowRoot:i.getRootNode(),t);if(l&10){i["s-sc"]=n;i.classList.add(n+"-h")}o()};var ne=(e,t)=>"sc-"+e.p;var re=(e,t,i,l,o,n,r)=>{if(i===l){return}let d=a(e,t);let s=t.toLowerCase();if(t==="class"){const t=e.classList;const o=se(i);let n=se(l);{t.remove(...o.filter((e=>e&&!n.includes(e))));t.add(...n.filter((e=>e&&!o.includes(e))))}}else if(t==="key");else if(t==="ref"){if(l){l(e)}}else if(!d&&t[0]==="o"&&t[1]==="n"){if(t[2]==="-"){t=t.slice(3)}else if(a(p,s)){t=s.slice(2)}else{t=s[2]+t.slice(3)}if(i||l){const o=t.endsWith(be);t=t.replace(ae,"");if(i){u.rel(e,t,i,o)}if(l){u.ael(e,t,l,o)}}}else{const r=P(l);if((d||r&&l!==null)&&true){try{if(!e.tagName.includes("-")){const o=l==null?"":l;if(t==="list"){d=false}else if(i==null||e[t]!=o){if(typeof e.__lookupSetter__(t)==="function"){e[t]=o}else{e.setAttribute(t,o)}}}else if(e[t]!==l){e[t]=l}}catch(e){}}if(l==null||l===false){if(l!==false||e.getAttribute(t)===""){{e.removeAttribute(t)}}}else if((!d||n&4||o)&&!r&&e.nodeType===1){l=l===true?"":l;{e.setAttribute(t,l)}}}};var de=/\s/;var se=e=>{if(typeof e==="object"&&e&&"baseVal"in e){e=e.baseVal}if(!e||typeof e!=="string"){return[]}return e.split(de)};var be="Capture";var ae=new RegExp(be+"$");var me=(e,t,i,l)=>{const o=t.M.nodeType===11&&t.M.host?t.M.host:t.M;const n=e&&e.S||{};const r=t.S||{};{for(const e of fe(Object.keys(n))){if(!(e in r)){re(o,e,n[e],void 0,i,t.m)}}}for(const e of fe(Object.keys(r))){re(o,e,n[e],r[e],i,t.m)}};function fe(e){return e.includes("ref")?[...e.filter((e=>e!=="ref")),"ref"]:e}var he;var ce=false;var ge=(e,t,i)=>{const l=t.j[i];let o=0;let n;let r;if(l.$!==null){n=l.M=p.document.createTextNode(l.$)}else{if(!p.document){throw new Error("You are trying to render a Stencil component in an environment that doesn't support the DOM. Make sure to populate the [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window/window) object before rendering a component.")}n=l.M=p.document.createElement(l.C);{me(null,l,ce)}if(l.j){for(o=0;o<l.j.length;++o){r=ge(e,l,o);if(r){n.appendChild(r)}}}}n["s-hn"]=he;return n};var ye=(e,t,i,l,o,n)=>{let r=e;let d;if(r.shadowRoot&&r.tagName===he){r=r.shadowRoot}for(;o<=n;++o){if(l[o]){d=ge(null,i,o);if(d){l[o].M=d;we(r,d,t)}}}};var ve=(e,t,i)=>{for(let l=t;l<=i;++l){const t=e[l];if(t){const e=t.M;ze(t);if(e){e.remove()}}}};var pe=(e,t,i,l,o=false)=>{let n=0;let r=0;let d=0;let s=0;let b=t.length-1;let a=t[0];let m=t[b];let f=l.length-1;let h=l[0];let c=l[f];let g;let y;while(n<=b&&r<=f){if(a==null){a=t[++n]}else if(m==null){m=t[--b]}else if(h==null){h=l[++r]}else if(c==null){c=l[--f]}else if(ue(a,h,o)){ke(a,h,o);a=t[++n];h=l[++r]}else if(ue(m,c,o)){ke(m,c,o);m=t[--b];c=l[--f]}else if(ue(a,c,o)){ke(a,c,o);we(e,a.M,m.M.nextSibling);a=t[++n];c=l[--f]}else if(ue(m,h,o)){ke(m,h,o);we(e,m.M,a.M);m=t[--b];h=l[++r]}else{d=-1;{for(s=n;s<=b;++s){if(t[s]&&t[s].O!==null&&t[s].O===h.O){d=s;break}}}if(d>=0){y=t[d];if(y.C!==h.C){g=ge(t&&t[r],i,d)}else{ke(y,h,o);t[d]=void 0;g=y.M}h=l[++r]}else{g=ge(t&&t[r],i,r);h=l[++r]}if(g){{we(a.M.parentNode,g,a.M)}}}}if(n>b){ye(e,l[f+1]==null?null:l[f+1].M,i,l,r,f)}else if(r>f){ve(t,n,b)}};var ue=(e,t,i=false)=>{if(e.C===t.C){if(!i){return e.O===t.O}if(i&&!e.O&&t.O){e.O=t.O}return true}return false};var ke=(e,i,l=false)=>{const o=i.M=e.M;const n=e.j;const r=i.j;const d=i.$;if(d===null){{me(e,i,ce)}if(n!==null&&r!==null){pe(o,n,i,r,l)}else if(r!==null){if(e.$!==null){o.textContent=""}ye(o,null,i,r,0,r.length-1)}else if(!l&&t.updatable&&n!==null){ve(n,0,n.length-1)}}else if(e.$!==d){o.data=d}};var ze=e=>{{e.S&&e.S.ref&&e.S.ref(null);e.j&&e.j.map(ze)}};var we=(e,t,i)=>{{return e==null?void 0:e.insertBefore(t,i)}};var $e=(e,t,i=false)=>{const l=e.$hostElement$;const o=e.R||q(null,null);const n=Y(t);const r=n?t:V(null,null,t);he=l.tagName;if(i&&r.S){for(const e of Object.keys(r.S)){if(l.hasAttribute(e)&&!["key","ref","style","class"].includes(e)){r.S[e]=l[e]}}}r.C=null;r.m|=4;e.R=r;r.M=o.M=l.shadowRoot||l;ke(o,r,i)};var Se=(e,t)=>{if(t&&!e.D&&t["s-p"]){const i=t["s-p"].push(new Promise((l=>e.D=()=>{t["s-p"].splice(i-1,1);l()})))}};var je=(e,t)=>{{e.m|=16}if(e.m&4){e.m|=512;return}Se(e,e.N);const i=()=>xe(e,t);return M(i)};var xe=(e,t)=>{const i=e.$hostElement$;const l=H("scheduleUpdate",e.t.p);const o=e.o;if(!o){throw new Error(`Can't render component <${i.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`)}let n;if(t){{e.m|=256;if(e.W){e.W.map((([e,t])=>Re(o,e,t,i)));e.W=void 0}}n=Re(o,"componentWillLoad",void 0,i)}else{n=Re(o,"componentWillUpdate",void 0,i)}n=Oe(n,(()=>Re(o,"componentWillRender",void 0,i)));l();return Oe(n,(()=>Ce(e,o,t)))};var Oe=(e,t)=>Ee(e)?e.then(t).catch((e=>{console.error(e);t()})):t();var Ee=e=>e instanceof Promise||e&&e.then&&typeof e.then==="function";var Ce=async(e,t,i)=>{var l;const o=e.$hostElement$;const n=H("update",e.t.p);const r=o["s-rc"];if(i){oe(e)}const d=H("render",e.t.p);{Me(e,t,o,i)}if(r){r.map((e=>e()));o["s-rc"]=void 0}d();n();{const t=(l=o["s-p"])!=null?l:[];const i=()=>Pe(e);if(t.length===0){i()}else{Promise.all(t).then(i);e.m|=4;t.length=0}}};var Me=(e,t,i,l)=>{try{t=t.render();{e.m&=-17}{e.m|=2}{{{$e(e,t,l)}}}}catch(t){m(t,e.$hostElement$)}return null};var Pe=e=>{const t=e.t.p;const i=e.$hostElement$;const l=H("postUpdate",t);const o=e.o;const n=e.N;Re(o,"componentDidRender",void 0,i);if(!(e.m&64)){e.m|=64;{De(i)}Re(o,"componentDidLoad",void 0,i);l();{e.v(i);if(!n){Ue()}}}else{Re(o,"componentDidUpdate",void 0,i);l()}{if(e.D){e.D();e.D=void 0}if(e.m&512){C((()=>je(e,false)))}e.m&=-517}};var Ue=t=>{C((()=>ee(p,"appload",{detail:{namespace:e}})))};var Re=(e,t,i,l)=>{if(e&&e[t]){try{return e[t](i)}catch(e){m(e,l)}}return void 0};var De=e=>{var i;return e.classList.add((i=t.hydratedSelectorName)!=null?i:"hydrated")};var Ne=(e,t)=>d(e).l.get(t);var We=(e,t,i,l)=>{const o=d(e);if(!o){throw new Error(`Couldn't find host element for "${l.p}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`)}const n=o.$hostElement$;const r=o.l.get(t);const s=o.m;const b=o.o;i=Q(i,l.i[t][0]);const a=Number.isNaN(r)&&Number.isNaN(i);const f=i!==r&&!a;if((!(s&8)||r===void 0)&&f){o.l.set(t,i);if(b){if(l.A&&s&128){const e=l.A[t];if(e){e.map((e=>{try{b[e](i,r,t)}catch(e){m(e,n)}}))}}if((s&(2|16))===2){if(b.componentShouldUpdate){if(b.componentShouldUpdate(i,r,t)===false){return}}je(o,false)}}}};var Ae=(e,i,l)=>{var o,n;const r=e.prototype;if(i.i||(i.A||e.watchers)){if(e.watchers&&!i.A){i.A=e.watchers}const s=Object.entries((o=i.i)!=null?o:{});s.map((([e,[t]])=>{if(t&31||l&2&&t&32){const{get:o,set:n}=Object.getOwnPropertyDescriptor(r,e)||{};if(o)i.i[e][0]|=2048;if(n)i.i[e][0]|=4096;if(l&1||!o){Object.defineProperty(r,e,{get(){{if((i.i[e][0]&2048)===0){return Ne(this,e)}const t=d(this);const l=t?t.o:r;if(!l)return;return l[e]}},configurable:true,enumerable:true})}Object.defineProperty(r,e,{set(o){const r=d(this);if(n){const l=t&32?this[e]:r.$hostElement$[e];if(typeof l==="undefined"&&r.l.get(e)){o=r.l.get(e)}else if(!r.l.get(e)&&l){r.l.set(e,l)}n.apply(this,[Q(o,t)]);o=t&32?this[e]:r.$hostElement$[e];We(this,e,o,i);return}{if((l&1)===0||(i.i[e][0]&4096)===0){We(this,e,o,i);if(l&1&&!r.o){r.h.then((()=>{if(i.i[e][0]&4096&&r.o[e]!==r.l.get(e)){r.o[e]=o}}))}return}const n=()=>{const l=r.o[e];if(!r.l.get(e)&&l){r.l.set(e,l)}r.o[e]=Q(o,t);We(this,e,r.o[e],i)};if(r.o){n()}else{r.h.then((()=>n()))}}}})}}));if(l&1){const l=new Map;r.attributeChangedCallback=function(e,o,n){u.jmp((()=>{var s;const b=l.get(e);if(this.hasOwnProperty(b)&&t.lazyLoad){n=this[b];delete this[b]}else if(r.hasOwnProperty(b)&&typeof this[b]==="number"&&this[b]==n){return}else if(b==null){const t=d(this);const l=t==null?void 0:t.m;if(l&&!(l&8)&&l&128&&n!==o){const l=t.o;const r=(s=i.A)==null?void 0:s[e];r==null?void 0:r.forEach((t=>{if(l[t]!=null){l[t].call(l,n,o,e)}}))}return}const a=Object.getOwnPropertyDescriptor(r,b);n=n===null&&typeof this[b]==="boolean"?false:n;if(n!==this[b]&&(!a.get||!!a.set)){this[b]=n}}))};e.observedAttributes=Array.from(new Set([...Object.keys((n=i.A)!=null?n:{}),...s.filter((([e,t])=>t[0]&15)).map((([e,t])=>{const i=t[1]||e;l.set(i,e);return i}))]))}}return e};var Le=async(e,t,i,l)=>{let o;if((t.m&32)===0){t.m|=32;const l=i.u;if(l){const l=h(i,t);if(l&&"then"in l){const e=I();o=await l;e()}else{o=l}if(!o){throw new Error(`Constructor for "${i.p}#${t.L}" was not found`)}if(!o.isProxied){{i.A=o.watchers}Ae(o,i,2);o.isProxied=true}const n=H("createInstance",i.p);{t.m|=8}try{new o(t)}catch(t){m(t,e)}{t.m&=-9}{t.m|=128}n();Te(t.o,e)}else{o=e.constructor;const i=e.localName;customElements.whenDefined(i).then((()=>t.m|=128))}if(o&&o.style){let e;if(typeof o.style==="string"){e=o.style}const t=ne(i);if(!c.has(t)){const l=H("registerStyles",i.p);ie(t,e,!!(i.m&1));l()}}}const n=t.N;const r=()=>je(t,true);if(n&&n["s-rc"]){n["s-rc"].push(r)}else{r()}};var Te=(e,t)=>{{Re(e,"connectedCallback",void 0,t)}};var Fe=e=>{if((u.m&1)===0){const t=d(e);const i=t.t;const l=H("connectedCallback",i.p);if(!(t.m&1)){t.m|=1;{let i=e;while(i=i.parentNode||i.host){if(i["s-p"]){Se(t,t.N=i);break}}}if(i.i){Object.entries(i.i).map((([t,[i]])=>{if(i&31&&e.hasOwnProperty(t)){const i=e[t];delete e[t];e[t]=i}}))}{Le(e,t,i)}}else{Ge(e,t,i.T);if(t==null?void 0:t.o){Te(t.o,e)}else if(t==null?void 0:t.h){t.h.then((()=>Te(t.o,e)))}}l()}};var He=(e,t)=>{{Re(e,"disconnectedCallback",void 0,t||e)}};var Ie=async e=>{if((u.m&1)===0){const t=d(e);{if(t.F){t.F.map((e=>e()));t.F=void 0}}if(t==null?void 0:t.o){He(t.o,e)}else if(t==null?void 0:t.h){t.h.then((()=>He(t.o,e)))}}if(te.has(e)){te.delete(e)}if(e.shadowRoot&&te.has(e.shadowRoot)){te.delete(e.shadowRoot)}};var Ve=(e,t={})=>{var i;if(!p.document){console.warn("Stencil: No document found. Skipping bootstrapping lazy components.");return}const l=H();const o=[];const n=t.exclude||[];const r=p.customElements;const s=p.document.head;const a=s.querySelector("meta[charset]");const m=p.document.createElement("style");const f=[];let h;let c=true;Object.assign(u,t);u.k=new URL(t.resourcesUrl||"./",p.document.baseURI).href;let g=false;e.map((e=>{e[1].map((t=>{var i;const l={m:t[0],p:t[1],i:t[2],T:t[3]};if(l.m&4){g=true}{l.i=t[2]}{l.T=t[3]}{l.A=(i=t[4])!=null?i:{}}const s=l.p;const a=class extends HTMLElement{constructor(e){super(e);this.hasRegisteredEventListeners=false;e=this;b(e,l);if(l.m&1){{if(!e.shadowRoot){F.call(e,l)}else{if(e.shadowRoot.mode!=="open"){throw new Error(`Unable to re-use existing shadow root for ${l.p}! Mode is set to ${e.shadowRoot.mode} but Stencil only supports open shadow roots.`)}}}}}connectedCallback(){const e=d(this);if(!this.hasRegisteredEventListeners){this.hasRegisteredEventListeners=true;Ge(this,e,l.T)}if(h){clearTimeout(h);h=null}if(c){f.push(this)}else{u.jmp((()=>Fe(this)))}}disconnectedCallback(){u.jmp((()=>Ie(this)));u.raf((()=>{var e;const t=d(this);const i=f.findIndex((e=>e===this));if(i>-1){f.splice(i,1)}if(((e=t==null?void 0:t.R)==null?void 0:e.M)instanceof Node&&!t.R.M.isConnected){delete t.R.M}}))}componentOnReady(){return d(this).h}};l.u=e[0];if(!n.includes(s)&&!r.get(s)){o.push(s);r.define(s,Ae(a,l,1))}}))}));if(o.length>0){if(g){m.textContent+=v}{m.textContent+=o.sort()+y}if(m.innerHTML.length){m.setAttribute("data-styles","");const e=(i=u.U)!=null?i:U(p.document);if(e!=null){m.setAttribute("nonce",e)}s.insertBefore(m,a?a.nextSibling:s.firstChild)}}c=false;if(f.length){f.map((e=>e.connectedCallback()))}else{{u.jmp((()=>h=setTimeout(Ue,30)))}}l()};var qe=(e,t)=>t;var Ge=(e,t,i,l)=>{if(i&&p.document){i.map((([i,l,o])=>{const n=_e(p.document,e,i);const r=Ye(t,o);const d=Be(i);u.ael(n,l,r,d);(t.F=t.F||[]).push((()=>u.rel(n,l,r,d)))}))}};var Ye=(e,t)=>i=>{var l;try{{if(e.m&256){(l=e.o)==null?void 0:l[t](i)}else{(e.W=e.W||[]).push([t,i])}}}catch(t){m(t,e.$hostElement$)}};var _e=(e,t,i)=>{if(i&4){return e}return t};var Be=e=>k?{passive:(e&1)!==0,capture:(e&2)!==0}:(e&2)!==0;var Je=e=>u.U=e;export{qe as F,X as a,Ve as b,Z as c,i as g,V as h,z as p,s as r,Je as s};
3
- //# sourceMappingURL=p-BWVQ0LD4.js.map
3
+ //# sourceMappingURL=p-CaWL2omE.js.map