(\n 'a, button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"]), iframe',\n ),\n ).filter(\n (el) =>\n !el.hasAttribute(\"disabled\") &&\n !el[\"hidden\"] &&\n el[\"offsetParent\"] !== null &&\n el.tabIndex > -1,\n );\n\n const updateFocusableElements = () => {\n const focusableElements = getVisibleFocusableElements();\n firstFocusableEl = focusableElements[0];\n lastFocusableEl = focusableElements[focusableElements.length - 1];\n };\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Tab\") {\n if (event.shiftKey) {\n /* shift + tab */\n if (document.activeElement === firstFocusableEl) {\n lastFocusableEl.focus();\n event.preventDefault();\n }\n } /* tab */ else {\n if (document.activeElement === lastFocusableEl) {\n firstFocusableEl.focus();\n event.preventDefault();\n }\n }\n }\n if (!node.contains(event.target as Node)) {\n event.preventDefault();\n firstFocusableEl?.focus();\n }\n };\n\n const observeChanges = new MutationObserver(updateFocusableElements);\n\n updateFocusableElements();\n tick().then(() => {\n firstFocusableEl?.focus();\n });\n\n observeChanges.observe(node, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: [\"hidden\", \"tabindex\", \"disabled\"],\n });\n\n return unify([\n keydown(node.ownerDocument, handleKeyDown),\n {\n destroy: () => {\n return observeChanges.disconnect();\n },\n },\n ]);\n}\n\nexport function scrollLock(n: HTMLElement) {\n lock(n);\n return {\n destroy() {\n unlock(n);\n },\n };\n}\n","export { setAttribute, trackAttribute } from \"./attribute\";\nexport { autofocus, setCheckArgument as setAutoFocusCheckArgument } from \"./autofocus\";\nexport { clickOutside, listen } from \"./events\";\nexport { focusTrap, focusable, returnFocus, scrollLock } from \"./focus\";\nexport { escape, keyUpDown, keydown } from \"./keyboard\";\nexport { place, type AlignModes as PlaceAlignModes } from \"./place\";\nexport { portal } from \"./portal\";\nexport { useActions } from \"./use-actions\";\n\nexport type SvelteActionReturn = {\n update?: (params?: P) => void;\n destroy?: () => void;\n} | void;\n\nexport type SvelteAction
= (element: HTMLElement, params?: P) => SvelteActionReturn
;\n\nexport type SvelteActionArray
= Array | [SvelteAction, P]>;\n\nexport function unify
(destroies: Array>) {\n const destroys = destroies\n .filter(\n (d): d is Exclude, void> =>\n d != null && typeof d !== \"undefined\" && typeof d.destroy === \"function\",\n )\n .map((d) => d.destroy);\n return {\n destroy() {\n destroys.forEach((destroy) => destroy());\n },\n };\n}\n","export type AlignModes =\n | \"TopLeft\"\n | \"Top\"\n | \"TopRight\"\n | \"RightTop\"\n | \"Right\"\n | \"RightBottom\"\n | \"BottomRight\"\n | \"Bottom\"\n | \"BottomLeft\"\n | \"LeftBottom\"\n | \"Left\"\n | \"LeftTop\"\n | \"Center\";\n\nexport const AlignOrigin = {\n Center: \"\",\n Top: \"origin-bottom\",\n TopLeft: \"origin-bottom-left\",\n TopRight: \"origin-bottom-right\",\n Right: \"origin-left\",\n RightTop: \"origin-top-left\",\n RightBottom: \"origin-bottom-left\",\n Bottom: \"origin-top\",\n BottomRight: \"origin-top-right\",\n BottomLeft: \"origin-top-left\",\n Left: \"origin-right\",\n LeftBottom: \"origin-bottom-right\",\n LeftTop: \"origin-top-right\",\n};\n\ninterface ActionOptions {\n reference: { getBoundingClientRect(): DOMRect };\n align: AlignModes;\n threshold?: number;\n}\n\nexport function place(node: HTMLElement, options: ActionOptions) {\n let _options = options;\n\n const observer = new MutationObserver(() => placeNode(node, _options));\n observer.observe(node, {\n childList: true,\n subtree: true,\n attributes: true,\n });\n\n placeNode(node, options);\n\n return {\n update: (options: ActionOptions) => {\n _options = options;\n placeNode(node, options);\n },\n };\n}\n\nfunction placeNode(node: HTMLElement, options: ActionOptions) {\n const { reference, align, threshold = 0 } = options;\n\n if (!reference) return;\n\n let rect = reference.getBoundingClientRect();\n const { width, height } = node.getBoundingClientRect();\n\n // clamp to viewport\n const e = document.documentElement;\n\n const viewTop = e.scrollTop + threshold; // Apply threshold\n const viewLeft = e.scrollLeft + threshold; // Apply threshold\n const viewBottom = viewTop + window.innerHeight - 2 * threshold; // Apply threshold to both top and bottom\n const viewRight = viewLeft + window.innerWidth - 2 * threshold; // Apply threshold to both left and right\n\n // turn bounds into document coordinates\n let bounds = {\n top: rect.top + e.scrollTop,\n left: rect.left + e.scrollLeft,\n right: rect.right + e.scrollLeft,\n bottom: rect.bottom + e.scrollTop,\n width: rect.width,\n height: rect.height,\n };\n\n const clampTop = (value: number) =>\n Math.max(Math.min(value, viewBottom - height), viewTop) + \"px\";\n const clampLeft = (value: number) =>\n Math.max(Math.min(value, viewRight - width), viewLeft) + \"px\";\n\n switch (align) {\n case \"TopLeft\":\n node.style.top = clampTop(bounds.top - height);\n node.style.left = clampLeft(bounds.left);\n break;\n case \"Top\":\n node.style.top = clampTop(bounds.top - height);\n node.style.left = clampLeft(bounds.left + bounds.width / 2 - width / 2);\n break;\n case \"TopRight\":\n node.style.top = clampTop(bounds.top - height);\n node.style.left = clampLeft(bounds.right - width);\n break;\n case \"RightTop\":\n node.style.top = clampTop(bounds.top);\n node.style.left = clampLeft(bounds.right);\n break;\n case \"Right\":\n node.style.top = clampTop(bounds.top + bounds.height / 2 - height / 2);\n node.style.left = clampLeft(bounds.right);\n break;\n case \"RightBottom\":\n node.style.top = clampTop(bounds.bottom - height);\n node.style.left = clampLeft(bounds.right);\n break;\n case \"Bottom\":\n node.style.top = clampTop(bounds.bottom);\n node.style.left = clampLeft(bounds.left + bounds.width / 2 - width / 2);\n break;\n case \"BottomRight\":\n node.style.top = clampTop(bounds.bottom);\n node.style.left = clampLeft(bounds.right - width);\n break;\n case \"BottomLeft\":\n node.style.top = clampTop(bounds.bottom);\n node.style.left = clampLeft(bounds.left);\n break;\n case \"Left\":\n node.style.top = clampTop(bounds.top + bounds.height / 2 - height / 2);\n node.style.left = clampLeft(bounds.left - width);\n break;\n case \"LeftBottom\":\n node.style.top = clampTop(bounds.bottom - height);\n node.style.left = clampLeft(bounds.left - width);\n break;\n case \"LeftTop\":\n node.style.top = clampTop(bounds.top);\n node.style.left = clampLeft(bounds.left - width);\n break;\n case \"Center\":\n node.style.top = clampTop(bounds.top + bounds.height / 2 - height / 2);\n node.style.left = clampLeft(bounds.left + bounds.width / 2 - width / 2);\n break;\n }\n}\n","/**\n * @param text The text containing {...} placeholder\n * @param values The values to inject into placeholder\n * @returns The replaced text\n */\nexport function interpolate(text: string, values: { [key: string]: string }) {\n return text.replace(/{(.*?)}/g, (match: string, $1: string) => {\n return values[$1.trim()] || \"\";\n });\n}\n\n/**\n * Helper function that traverses a data structure with depth/child first and\n * invokes the given closure on every item in structure.\n * @param data The data to traverse on\n * @param func The closure function to invoke on every item - make sure to return an item\n * @returns The same data after traversation. If the closure returns different items the returned data is mapped.\n */\nexport function depthFirst(data: any, func: (d: any) => any): any {\n // handle arrays\n if (Array.isArray(data)) return func(data.map((item) => depthFirst(item, func)));\n\n // handle objects\n if (typeof data === \"object\" && data != undefined) {\n Object.keys(data).forEach((key) => {\n data[key] = depthFirst(data[key], func);\n });\n }\n\n return func(data);\n}\n\n/**\n * A function that generates a unique id.\n */\nlet count = 0;\nexport function uniqueId(prefix: string = \"label\") {\n return prefix + \"-\" + ++count;\n}\n","import { unify } from \"@lernetz/svelte-common/actions\";\nimport { get, writable } from \"svelte/store\";\nimport { createField } from \"./createField\";\n\nexport type FieldNode = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;\n\nexport function createForm(defaultValues: Values) {\n const store = writable(defaultValues);\n type Field = { name: keyof Values };\n\n const fields: Array = [];\n\n const addField = (field: Field) => {\n fields.push(field);\n };\n\n const removeField = (field: Field) => {\n const index = fields.indexOf(field);\n if (index !== -1) {\n fields.splice(index, 1);\n }\n };\n\n const isMultiNode = (name: keyof Values) => {\n return fields.filter((f) => f.name === name).length > 1;\n };\n\n const bind = (node: FieldNode, name: keyof Values) => {\n const field = createField(node, name, store, setValue, getValue, isMultiNode);\n addField(field);\n\n return unify([\n field.bind(),\n {\n destroy: () => {\n removeField(field);\n },\n },\n ]);\n };\n\n const setValue = (name: keyof Values, value: any) => {\n store.update((values) => {\n return {\n ...values,\n [name]: value,\n };\n });\n };\n\n const getValue = (name: keyof Values) => {\n return get(store)[name];\n };\n\n const reset = () => {\n store.set(defaultValues);\n };\n\n return {\n subscribe: store.subscribe,\n bind,\n setValue,\n getValue,\n reset,\n };\n}\n\nexport type Form = ReturnType;\n","import { listen, setAttribute, unify } from \"@lernetz/svelte-common/actions\";\nimport type { Readable } from \"svelte/store\";\n\nexport type FieldNode = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;\n\nexport function createField(\n node: FieldNode,\n name: keyof Values,\n store: Readable,\n setValue: (name: keyof Values, value: unknown) => void,\n getValue: (name: keyof Values) => unknown,\n isMultiNode: (name: keyof Values) => boolean,\n) {\n if (node instanceof HTMLInputElement && node.type == \"checkbox\") {\n }\n\n const bind = () => {\n // set the name attribute to the node\n setAttribute(node, { name });\n\n // initialize the node with the current value\n handleValueChange();\n\n return unify([\n // listen to node changes to update store\n listen(node, {\n type:\n node instanceof HTMLInputElement && (node.type === \"checkbox\" || node.type === \"radio\")\n ? \"change\"\n : \"input\",\n handler: handleDomChange,\n }),\n\n // listen to store changes to update node\n {\n destroy: store.subscribe(handleValueChange),\n },\n ]);\n };\n\n // if the node changes, update the store\n const handleDomChange = () => {\n // handle fields that have more than one node\n if (isMultiNode(name)) {\n // handle multiple checkboxes they are stored as arrays\n if (node instanceof HTMLInputElement && node.type === \"checkbox\") {\n let current = getValue(name) as Array;\n if (!Array.isArray(current)) current = [];\n setValue(\n name,\n node.checked ? [...current, node.value] : current.filter((i) => i != node.value),\n );\n }\n\n // handle multiple radio inputs, they are stored as a string\n if (node instanceof HTMLInputElement && node.type === \"radio\") {\n setValue(name, node.value);\n }\n\n return;\n }\n\n // single checkbox will turn into boolean value\n if (node instanceof HTMLInputElement && node.type === \"checkbox\") {\n setValue(name, node.checked);\n }\n\n // multi select with turn into string array\n else if (node instanceof HTMLSelectElement && node.multiple) {\n setValue(\n name,\n Array.from(node.selectedOptions).map((o) => o.value),\n );\n }\n\n // regular select with turn into string value\n else if (node instanceof HTMLSelectElement) {\n setValue(name, node.value);\n }\n\n // bind all regular inputs as string\n else if (node instanceof HTMLInputElement || node instanceof HTMLTextAreaElement) {\n setValue(name, node.value);\n }\n };\n\n // if the store changes, update the node\n const handleValueChange = () => {\n const value = getValue(name);\n\n // handle multiple checkboxes where value is stored as array\n if (node instanceof HTMLInputElement && node.type === \"checkbox\" && Array.isArray(value)) {\n node.checked = value.includes(node.value);\n }\n\n // handle radio input where value is stored as string\n else if (\n node instanceof HTMLInputElement &&\n node.type === \"radio\" &&\n typeof value === \"string\"\n ) {\n node.checked = value == node.value;\n }\n\n // handle checkboxes where value is stored as boolean\n else if (\n node instanceof HTMLInputElement &&\n node.type === \"checkbox\" &&\n typeof value === \"boolean\"\n ) {\n node.checked = value;\n }\n\n // multi select with turn into string array\n else if (node instanceof HTMLSelectElement && node.multiple && Array.isArray(value)) {\n for (const option of node.options) {\n option.selected = value.includes(option.value);\n }\n }\n\n // all other simply set the value\n else {\n node.value = value as string;\n }\n };\n\n return {\n name,\n bind,\n };\n}\n","import {\n keyUpDown,\n keydown,\n listen,\n setAttribute,\n trackAttribute,\n unify,\n} from \"@lernetz/svelte-common/actions\";\nimport { getContext } from \"svelte\";\nimport { writable } from \"svelte/store\";\nimport type { Overlay } from \"./overlay\";\n\nexport type Menu = ReturnType;\nexport type RadioGroup = ReturnType;\n\nexport const DropdownContext = Symbol(\"DropdownContext\");\nexport const DropdownRadioGroupContext = Symbol(\"DropdownRadioGroupContext\");\n\nexport const createDropdownMenu = (overlay: Overlay) => {\n const root = (node: HTMLElement) => {\n let focusedIndex = -1;\n let menuItems: HTMLElement[] = [];\n\n const updateMenuItems = () => {\n menuItems = Array.from(\n node.querySelectorAll(\n \"[role='menuitem']:not([aria-disabled='true']), [role='menuitemradio']:not([aria-disabled='true']), [role='menuitemcheckbox']:not([aria-disabled='true'])\",\n ),\n );\n };\n\n const handleArrowKeys = (direction: \"up\" | \"down\") => (event: KeyboardEvent) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (direction === \"up\") {\n focusedIndex = focusedIndex <= 0 ? menuItems.length - 1 : focusedIndex - 1;\n } else {\n focusedIndex = focusedIndex >= menuItems.length - 1 ? 0 : focusedIndex + 1;\n }\n\n menuItems[focusedIndex].focus();\n };\n\n setAttribute(node, {\n role: \"menu\",\n \"aria-orientation\": \"vertical\",\n tabindex: \"-1\",\n });\n\n updateMenuItems();\n\n const observeChanges = new MutationObserver(updateMenuItems);\n\n observeChanges.observe(node, {\n childList: true,\n subtree: true,\n });\n\n return keyUpDown(node.ownerDocument, {\n up: handleArrowKeys(\"up\"),\n down: handleArrowKeys(\"down\"),\n });\n };\n\n const separator = (node: HTMLElement) => {\n setAttribute(node, {\n role: \"separator\",\n \"aria-orientation\": \"horizontal\",\n tabindex: \"-1\",\n });\n };\n\n const menuItem = (\n node: HTMLElement,\n options?: {\n closeOnSelect?: boolean;\n disabled?: boolean;\n onSelect?: () => void;\n },\n ) => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n event.stopPropagation();\n node.click();\n }\n };\n\n const handleClick = (event: MouseEvent) => {\n if (options?.disabled) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n if (options?.onSelect) {\n event.preventDefault();\n event.stopPropagation();\n\n options?.onSelect();\n }\n if (options?.closeOnSelect) overlay.close();\n };\n\n setAttribute(node, {\n role: \"menuitem\",\n tabindex: \"-1\",\n \"aria-disabled\": options?.disabled ? \"true\" : \"false\",\n });\n\n return unify([\n keydown(node, handleKeyDown),\n listen(node, { type: \"click\", handler: handleClick }),\n ]);\n };\n\n const checkboxItem = (\n node: HTMLElement,\n options: {\n closeOnSelect?: boolean;\n checked: boolean;\n disabled?: boolean;\n onChange: (checked: boolean) => void;\n },\n ) => {\n let checked = options.checked;\n\n const handleChange = (event: Event) => {\n if (options.disabled) return;\n event.preventDefault();\n event.stopPropagation();\n options.onChange(!checked);\n\n if (options.closeOnSelect) overlay.close();\n };\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n handleChange(event);\n }\n };\n\n const handleClick = (event: MouseEvent) => {\n handleChange(event);\n };\n\n setAttribute(node, {\n role: \"menuitemcheckbox\",\n tabindex: \"-1\",\n \"aria-checked\": checked ? \"true\" : \"false\",\n \"aria-disabled\": options.disabled ? \"true\" : \"false\",\n });\n\n return {\n ...unify([\n keydown(node, handleKeyDown),\n listen(node, { type: \"click\", handler: handleClick }),\n ]),\n update(options: { checked: boolean; disabled?: boolean }) {\n checked = options.checked;\n node.setAttribute(\"aria-checked\", options.checked ? \"true\" : \"false\");\n node.setAttribute(\"aria-disabled\", options.disabled ? \"true\" : \"false\");\n },\n };\n };\n\n return {\n root,\n item: menuItem,\n checkbox: checkboxItem,\n separator,\n };\n};\n\nexport type DropDownMenuType = ReturnType;\n\nexport const createDropdownRadioGroup = (initialValue: string) => {\n const { overlay } = getContext<{ overlay: Overlay }>(DropdownContext);\n const internalValue = writable(null);\n\n const root = (node: HTMLElement) => {\n node.setAttribute(\"role\", \"group\");\n };\n\n const radioGroupItem = (\n node: HTMLElement,\n options: {\n value: string;\n closeOnSelect?: boolean;\n disabled?: boolean;\n },\n ) => {\n const handleChange = (event: Event) => {\n if (options.disabled) return;\n event.preventDefault();\n event.stopPropagation();\n internalValue.set(options.value);\n\n if (options.closeOnSelect) overlay.close();\n };\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n handleChange(event);\n }\n };\n\n const handleClick = (event: MouseEvent) => {\n handleChange(event);\n };\n\n setAttribute(node, {\n role: \"menuitemradio\",\n tabindex: \"-1\",\n \"aria-disabled\": options.disabled ? \"true\" : \"false\",\n });\n\n trackAttribute(node, {\n attribute: \"aria-checked\",\n store: internalValue,\n value: (newValue) => (newValue === options.value ? \"true\" : \"false\"),\n });\n\n return {\n ...unify([\n keydown(node, handleKeyDown),\n listen(node, { type: \"click\", handler: handleClick }),\n ]),\n update(options: { disabled?: boolean }) {\n node.setAttribute(\"aria-disabled\", options.disabled ? \"true\" : \"false\");\n },\n };\n };\n\n return {\n root,\n item: radioGroupItem,\n value: internalValue,\n };\n};\n\nexport type DropdownRadioGroupType = ReturnType;\n","import { uniqueId } from \"@lernetz/svelte-common\";\nimport { listen, setAttribute, trackAttribute, unify } from \"@lernetz/svelte-common/actions\";\nimport { get, writable } from \"svelte/store\";\n\ninterface OverlayStore {\n opened: boolean;\n id: string;\n}\n\nexport type Overlay = ReturnType;\n\nexport type OverlayHtmlType = \"menu\" | \"listbox\" | \"dialog\" | \"tree\" | \"grid\" | \"dialog\";\n\nexport function createOverlay(type: OverlayHtmlType = \"menu\", group?: string) {\n const store = writable({ opened: false, id: uniqueId(\"overlay\") });\n const { set, update, subscribe } = store;\n\n let triggerReference: HTMLElement;\n\n const open = () => update((s) => ({ ...s, opened: true }));\n const close = () => update((s) => ({ ...s, opened: false }));\n const toggle = () => update((s) => ({ ...s, opened: !s.opened }));\n\n if (group) {\n subscribe((s) => {\n if (s.opened) {\n setCurrentOverlayInGroup(group, { id: s.id, close });\n }\n });\n }\n\n function trigger(node: HTMLElement, options?: { handler?: (event: MouseEvent) => void }) {\n triggerReference = node;\n\n let handler = options?.handler || toggle;\n\n return unify([\n setAttribute(node, {\n role: \"button\",\n type: \"button\",\n \"aria-haspopup\": type,\n \"aria-controls\": get(store).id,\n id: uniqueId(\"trigger\"),\n }),\n trackAttribute(node, { attribute: \"aria-expanded\", store, value: (s) => s.opened + \"\" }),\n listen(node, {\n type: \"click\",\n handler: handler,\n }),\n ]);\n }\n\n function autoclose(node: HTMLElement) {\n return listen(node, { type: \"click\", handler: close });\n }\n\n return {\n open,\n close,\n toggle,\n trigger,\n autoclose,\n triggerReference: () => triggerReference,\n subscribe,\n set,\n update,\n };\n}\n\nexport type OverlayType = ReturnType;\n\n// The following infrastructure keeps track of each overlay group's current overlay,\n// so that it can be auto-closed when another overlay from the same group gets opened.\n\ninterface OverlayCloseInfo {\n id: string;\n close: () => void;\n}\n\nconst groups = new Map();\n\nfunction setCurrentOverlayInGroup(group: string, current: OverlayCloseInfo): void {\n const previous = groups.get(group);\n if (previous && previous.id !== current.id) {\n previous.close();\n }\n groups.set(group, current);\n}\n","/**\n * This module contains the [[Show]] helper component used to conditionally render HTML.\n */\n\n/***/\nimport { Scope } from './Scope';\nimport { Model } from '../Model';\nimport { Template } from '../view/Template';\nimport { View, create } from '../view/View';\nimport { observeProperties } from '../Observer';\nimport { Subscription } from '../Signal';\n\n/**\n * A helper view that renders the contents of its node into the DOM only if some condition is true.\n *\n * ### Basic usage:\n *\n * ```html\n * \n * This is rendered only if `someBooleanCondition` evaluates to true.\n *
\n * ```\n */\nexport class Show extends View implements Scope {\n\n\tprivate contentTemplate:Template;\n\tprivate dataSubscription:Subscription;\n\n\tconstructor( ) {\n\t\tsuper( { template:'', data:{ if:true } } );\n\t}\n\n\tprepareContent( node:Element, template:Template ) {\n\t\tthis.contentTemplate = new Template( node.innerHTML );\n\t\tnode.innerHTML = '';\n\t}\n\n\tinit() {\n\t\tthis.checkVisibility();\n\t\tthis.dataSubscription = observeProperties( this.data, 'if' ).propertyChange.filter( e => e.name == 'if' ).subscribe( this.checkVisibility.bind( this ) );\n\t}\n\n\tcheckVisibility() {\n\t\tlet n = this.contentTemplate.node;\n\t\tif( this.data.if ) {\n\t\t\t// check if its rendered\n\t\t\tif( !n ) {\n\t\t\t\tthis.contentTemplate.context = this.template.context.parent;\n\t\t\t\tthis.contentTemplate.render();\n\t\t\t\tn = this.contentTemplate.node;\n\t\t\t}\n\t\t\tthis.node.appendChild( n );\n\t\t} else {\n\t\t\tn?.parentNode?.removeChild( n );\n\t\t}\n\t}\n\n\tdeinit() {\n\t\tif( this.dataSubscription ) this.dataSubscription.unsubscribe();\n\t}\n}\n\n\nclass ShowModel {\n\tif:boolean;\n}\n","import { compile } from './view/Compiler';\nimport { context } from './view/Template';\n\nvar _source = {};\n\nexport function source( obj:{} ) {\n\t_source = obj;\n};\n\n/**\n * translates the given key.\n */\nexport function translate( key:string, opts:{ data?:any, condition?:number } = {} ):any {\n\tif( key == undefined ) return '';\n\n\tvar def = lookup( key );\n\tif( opts.condition != undefined ) def = matchCondition( def, opts.condition );\n\tif( opts.data ) def = compile( def ).call( context, opts.data );\n\n\treturn def;\n}\n\nfunction matchCondition( value:string, num:number ) {\n\n\tvar parts = value.split( '|' );\n\n\t// check conditions\n\tvar found = parseConditions( parts, num )\n\tif( found ) return found.trim();\n\n\tif( parts.length == 1 ) return clearConditions( parts[0] );\n\n\t// check simple | split\n\treturn clearConditions( parts[ ( num == 1 ) ? 0 : 1 ] );\n}\n\n\nfunction parseConditions( parts, number:number ):string {\n\t// loop over parts\n\tfor( var i = 0; i < parts.length; i++ ) {\n\t\tvar regex = /^[\\{\\[]([^\\[\\]\\{\\}]*)[\\}\\]](.*)/;\n\t\tvar match = regex.exec( parts[i] );\n\n\t\t// no proper condition\n\t\tif( match == null || match.length != 3 ) continue;\n\n\t\tvar value = match[2];\n\t\tvar condition = match[1];\n\t\tvar num = number;\n\n\t\t// range condition\n\t\tif( condition.indexOf( ',' ) > -1 ) {\n\n\t\t\tvar [ from , to ] = condition.split( ',' );\n\n\t\t\tif ( to == '*' && num >= parseInt( from ) ) {\n\t\t\t\treturn value;\n\t\t\t} else if ( from == '*' && num <= parseInt( to ) ) {\n\t\t\t\treturn value;\n\t\t\t} else if ( num >= parseInt( from ) && num <= parseInt( to ) ) {\n\t\t\t\treturn value;\n\t\t\t}\n\n\t\t// exact condition\n\t\t} else if( parseInt( condition ) == num ) {\n\t\t\treturn value;\n\t\t}\n\t}\n}\n\nfunction clearConditions( s:string ):string {\n\treturn s.replace( /^[\\{\\[]([^\\[\\]\\{\\}]*)[\\}\\]]/, '' ).trim();\n}\n\nfunction lookup( key:string ) {\n\n\t// translate `x.y` to `data[\"x\"][\"y\"]` which is safe even when special chars are present:\n\tlet template = '[[ data' + key.split( '.' ).map( k => '[\"' + k + '\"]' ).join( '' ) + ' ]]';\n\n\t// lookup property / string in source\n\tlet result = compile( template ).call( context, _source );\n\n\t// return result only if its a valid string otherwise return key\n\treturn ( typeof result == 'string' ) ? result : key;\n}\n","import { Signal } from './Signal';\nimport { Registry } from './Registry';\nimport { PropertyObserver, PropertyChanged, observeProperties } from './Observer';\n\n\n\n\n/**\n * A common model class that has getters and setters\n */\nexport class Model implements PropertyObserver {\n\n\t/**\n\t * Raised when a property's value has changed.\n\t *\n\t * @event\n\t */\n\tpublic propertyChange:Signal;\n\n\n\tconstructor( dto?:object ) {\n\t\tif( dto ) {\n\t\t\tObject.assign( this, dto );\n\t\t\tobserveProperties( this );\n\t\t}\n\t}\n}\n\n\n\n\n\n\n\n/**\n * A registry for modelName to Model class mappings\n */\nexport class ModelRegistry extends Registry {}\n\n/**\n * This helper function maps objects in the given data on registered models\n * @param data The data structure to map models\n * @param registry The registry to lookup model defintions\n * @param property the object property to lookup keys\n */\nexport function map( data:any, registry:ModelRegistry, lookup?:( obj:object ) => string ) {\n\n\tif( !lookup ) lookup = ( obj:any ) => obj.modelName || 'default';\n\n\t// handle arrays\n\tif( Array.isArray( data ) ) {\n\t\tdata = data.map( item => map( item, registry, lookup ) );\n\t}\n\n\t// handle objects\n\tif( data && data.constructor == Object ) {\n\n\t\tlet factory = registry.get( lookup( data ) );\n\n\t\tObject.keys( data ).forEach( name => {\n\t\t\tdata[ name ] = map( data[ name ], registry, lookup );\n\t\t});\n\n\t\treturn ( factory ) ? factory( data ) : data;\n\t}\n\n\treturn data;\n}\n","import { Signal } from './Signal';\n\n/**\n * Checks whether the specified object implements [[PropertyObserver]].\n * If its possible to observe its properties\n *\n * @param obj The object that should be tested.\n */\nexport function isPropertyObserver( obj:any ):obj is PropertyObserver {\n\treturn obj && obj[ 'propertyChange' ] instanceof Signal;\n}\n\n\n/**\n * Describes the payload of the [[PropertyChangedSignal.propertyChanged]] observable.\n */\nexport interface PropertyChanged {\n\tname:string\n}\n\n\n/**\n * Types that implement this interface publish all property value changes as an [[Observable]].\n *\n * @see observeProperties that turns an object into a PropertyObserver\n */\nexport interface PropertyObserver {\n\n\t/**\n\t * Raised when a property's value has changed.\n\t *\n\t * @event\n\t */\n\tpropertyChange:Signal;\n}\n\n\n\nexport function dependProperty( target:T, targetProperty:( keyof T ), source:S, sourceProperty:( keyof S ) ) {\n\n\n\t// make sure the properties are observed\n\tlet targetObserved = observeProperties( target, targetProperty );\n\tlet sourceObserved = observeProperties( source, sourceProperty );\n\n\t// only subscript on valid target / source\n\tif( !targetObserved || !sourceObserved ) return;\n\n\tsourceObserved.propertyChange.filter( e => e.name == sourceProperty ).subscribe( () => {\n\t\ttargetObserved.propertyChange.dispatch( { name:targetProperty as string } );\n\t});\n}\n\n\n/**\n * Observes a list of properties\n * @param target The model to observe properties on\n * @param properties The list of property name to observe\n */\nexport function observeProperties(target:T, ...properties:(keyof T)[] ):T&PropertyObserver {\n\n\t// do not observe any null / undefined targets\n\tif( !target ) return;\n\n\tlet t = target as T&PropertyObserver;\n\n\t// make sure signal exists and has proper functions, otherwise recreate\n\tif( !t.propertyChange || typeof t.propertyChange.subscribe != 'function' ) t.propertyChange = new Signal();\n\n\t// if there are no properties take all properties of the target\n\tif( properties.length == 0 ) properties = Object.keys( t ) as (keyof T)[];\n\n\t// loop over properties an check if there are accessors\n\tlet obj:any = {};\n\tfor ( const prop of properties ) {\n\n\t\t// no accessors for propertyChanged\n\t\tif( prop == 'propertyChange' ) continue;\n\n\t\t// lookup prototype chain for property descriptor\n\t\tlet c = t;\n\t\tlet desc;\n\t\twhile( c != null && desc == null ) {\n\t\t\tdesc = Object.getOwnPropertyDescriptor( c, prop );\n\t\t\tc = Object.getPrototypeOf( c );\n\t\t}\n\n\t\t// if property does not exist on target add undefined accessor\n\t\tif( !desc ) {\n\t\t\tobj[ prop ] = undefined;\n\t\t\tcontinue;\n\t\t}\n\n\t\t// check if it has already a getter/setter - do nothing\n\t\tif( desc.get || desc.set ) continue;\n\n\t\tobj[ prop ] = target[ prop ];\n\t}\n\n\t// generate accessors for all props\n\tfor( let attr in obj ) {\n\n\t\t// create dynamic property\n\t\tObject.defineProperty( t, attr, {\n\t\t\tget() {\n\t\t\t\treturn obj[ attr ];\n\t\t\t},\n\t\t\tset( value ) {\n\t\t\t\tlet old = obj[ attr ];\n\t\t\t\tif( old !== value ) {\n\t\t\t\t\tobj[ attr ] = value;\n\t\t\t\t\tt.propertyChange.dispatch( { name:attr } );\n\t\t\t\t}\n\t\t\t},\n\t\t\tenumerable: true,\n\t\t\tconfigurable: true\n\t\t});\n\t}\n\n\treturn t;\n}\n\n\n\n\n/**\n * A guard that checks whether the specified object implements [[ArrayObserver]].\n *\n * @param obj The object that should be tested.\n */\nexport function isArrayObserver( obj:any ):obj is ArrayObserver {\n\treturn obj && obj[ 'arrayChange' ] instanceof Signal;\n}\n\n\n/**\n * Arrays that implement this interface observe changes on the array itself\n *\n */\nexport interface ArrayObserver {\n\n\t/**\n\t * Raised when the items of the array have changed.\n\t *\n\t * @event\n\t */\n\tarrayChange:Signal<{}>;\n}\n\n/**\n * Observes an array on changes\n */\nexport function observeArray( a:Array ):Array&ArrayObserver {\n\n\t// do not observe other than arrays\n\tif( !Array.isArray( a ) ) return;\n\n\tlet t = a as Array&ArrayObserver;\n\n\t// check if its already observed\n\tif( t.arrayChange ) return t;\n\n\tt.arrayChange = new Signal();\n\n\tfor (const method of [ 'push', 'pop', 'shift', 'unshift', 'splice', 'sort', 'reverse' ] ) {\n\t\tconst org = t[method];\n\t\t// overwrite function to inject signal notification\n\t\tt[method] = function ( ...args ) {\n\t\t\tconst res = org.apply( this, args );\n\t\t\tt.arrayChange.dispatch({});\n\t\t\treturn res;\n\t\t}\n\t}\n\n\treturn t;\n}\n","interface RegistryFactoryClosure {\n\t( value:FactoryIn ): FactoryOut;\n}\n\n\n/**\n * A class that handles key value mappings with sub mappings\n */\nexport class Registry {\n\n\tprotected entries:Map>;\n\n\tconstructor() {\n\t\tthis.entries = new Map();\n\t}\n\n\tadd( key:any, closure:RegistryFactoryClosure ) {\n\t\tthis.entries.set( key, closure );\n\t\treturn this;\n\t}\n\n\tget( key:any ) {\n\t\t// check for entry\n\t\tlet found = this.entries.get( key );\n\n\t\t// return entry if it has and search on constructor if available\n\t\treturn found ? found : ( key && key.constructor ) ? this.entries.get( key.constructor ) : undefined;\n\n\t}\n}\n\n","import { Signal } from \"./Signal\";\n\n\ninterface ProgressSignal {\n\tloaded: number,\n\ttotal: number\n}\n\n/**\n * HttpRequest Class\n */\n\nexport class HttpRequest {\n\n\tprotected _method: string = 'GET';\n\tprotected _url: string;\n\tprotected _headers: { [key: string]: string } = {};\n\tprotected _timeout?: number;\n\tprotected request: XMLHttpRequest;\n\n\t/** @event */\n\tpublic progress: Signal = new Signal();\n\n\n\t/**\n\t * Create a new instance with the given url\n\t * @param url\n\t */\n\tconstructor(url: string) {\n\t\tthis._url = url;\n\n\t\tthis.request = new XMLHttpRequest();\n\t\tthis.request.onprogress = (event) => {\n\t\t\tthis.progress.dispatch(event);\n\t\t}\n\t}\n\n\t/**\n\t * Set the method for the request\n\t * @param method\n\t */\n\tpublic method(method: string): HttpRequest {\n\t\tthis._method = method;\n\t\treturn this;\n\t}\n\n\t/**\n\t * Set the headers for the request\n\t * @param headers\n\t */\n\tpublic headers(headers: {}): HttpRequest {\n\t\tObject.assign( this._headers, headers );\n\t\treturn this\n\t}\n\n\t/**\n\t * Set the timeout (in milliseconds) for the request\n\t * @param milliseconds\n\t * @returns\n\t */\n\tpublic timeout( milliseconds: number ): HttpRequest {\n\t\tthis._timeout = milliseconds;\n\t\treturn this;\n\t}\n\n\t/**\n\t * Send/Load the request without sending data\n\t */\n\tpublic load(): Promise {\n\t\treturn this.sendRequest().then(this.parseJson);\n\t}\n\n\t/**\n\t * Send the request with the given data\n\t * @param data\n\t */\n\tpublic send(data: any): Promise {\n\t\treturn this.sendRequest(data).then(this.parseJson);\n\t}\n\n\t/**\n\t * Returns the full url of the request\n\t * @returns The url of the request\n\t */\n\tpublic url(): string {\n\t\treturn this._url;\n\t}\n\n\t/**\n\t * Creates a json api request to a specific subpath.\n\t * It presets the method to POST and the headers to application/json.\n\t * It further sends the given data as json body.\n\t * @param path The relative path for the json api request\n\t * @param data The data for the json api requests\n\t */\n\tpublic jsonApi(path: string, data: object = {}): Promise {\n\n\t\tconst sub = this.relative( path );\n\t\tsub.headers( { 'Accept': 'application/json', 'Content-Type': 'application/json' } );\n\t\tsub.method('POST');\n\t\treturn sub.send(JSON.stringify(data))\n\t\t\t.then((reponse: { data?: object, errors?: Array; }) => reponse?.data as unknown as Response)\n\t\t\t.catch( e => {\n\t\t\t\t// catch and retrigger json api errors\n\t\t\t\tlet data = this.parseJson( e ) as any;\n\t\t\t\tthrow new JsonApiError( data.errors );\n\t\t\t});\n\n\n\t}\n\n\n /**\n * Creates a new HttpRequest that is relative to this one.\n * It copies all seetings from this request\n */\n public relative( path:string ):HttpRequest {\n const fullPath = (this._url.endsWith('/') ? this._url.slice(0, -1) : this._url) + (path.startsWith('/') ? path : '/' + path);\n const child = new HttpRequest( fullPath );\n child.headers( this._headers );\n child.method( this._method );\n child.timeout( this._timeout );\n return child;\n }\n\n\t/**\n\t * Open and send the request with the given parameters\n\t * and data\n\t * @param data\n\t */\n\tprivate sendRequest(data: any = null): Promise {\n\n\t\tvar request = this.request;\n\t\tvar promise = this.promise(request);\n\n\t\trequest.open(this._method, this._url);\n\n\t\tObject.keys(this._headers).forEach(key => {\n\t\t\trequest.setRequestHeader(key, this._headers[key]);\n\t\t});\n\n\t\trequest.send(data);\n\n\t\treturn promise;\n\t}\n\n\t/**\n\t * Create a promise with the request\n\t * The promise resolves in case of a successful request - jejects otherwise\n\t */\n\tprivate promise(request: XMLHttpRequest) {\n\t\treturn new Promise((resolve, reject) => {\n\n\t\t\tvar abortTimeout: ReturnType;\n\t\t\tif( this._timeout ) {\n\t\t\t\tabortTimeout = setTimeout( () => request.abort(), this._timeout );\n\t\t\t}\n\n\t\t\tvar abortHandler = function() {\n\t\t\t\tconst message = `Request \\`${this._method} ${this._url}\\` has exceeded its timeout of ${this._timeout} milliseconds.`;\n\t\t\t\tconst abortException = new DOMException( message, 'AbortError' );\n\t\t\t\tRequest.error.dispatch({ error: message, request:request } );\n\t\t\t\treject( abortException );\n\t\t\t}.bind( this );\n\n\t\t\tvar errorHandler = function () {\n\t\t\t\tif( abortTimeout ) clearTimeout( abortTimeout );\n\t\t\t\tlet message = 'Request `' + this._method + ' ' + this._url + '` failed with `' + request.status;\n\t\t\t\tconst reasonPhrase = request.statusText;\n\t\t\t\tmessage += reasonPhrase ? ' ' + reasonPhrase + '`' : '`';\n\t\t\t\tconst body = request.responseText;\n\t\t\t\tmessage += body ? ':\\n' + body : '.';\n\t\t\t\tconst exception = new Error( message );\n\t\t\t\tRequest.error.dispatch({ error: message, request:request } );\n\t\t\t\treject( exception );\n\t\t\t}.bind( this );\n\n\t\t\trequest.onload = function () {\n\t\t\t\tif( abortTimeout ) clearTimeout( abortTimeout );\n\t\t\t\tif (request.status >= 200 && request.status < 300) {\n\t\t\t\t\tresolve(request.responseText);\n\t\t\t\t} else {\n\t\t\t\t\terrorHandler();\n\t\t\t\t}\n\t\t\t};\n\n\t\t\trequest.onabort = abortHandler;\n\t\t\trequest.onerror = errorHandler;\n\t\t});\n\t}\n\n\t/**\n\t * tries to parse response otherwise returns original string data\n\t */\n\tprivate parseJson(data: string): string | {} {\n\t\tif( data ) {\n\t\t\ttry {\n\t\t\t\treturn JSON.parse( data );\n\t\t\t}\n\t\t\tcatch( e ) {}\n\t\t}\n\t\treturn data;\n\t}\n}\n\nexport interface ErrorSignal {\n\terror: string,\n\trequest:XMLHttpRequest\n}\n\nclass JsonApiError extends Error {\n\terrors:Array<{}>;\n\tconstructor( errors:Array<{}> ) {\n\t\tsuper( 'JsonApiError' );\n\t\tthis.errors = errors;\n\t}\n}\n\n/**\n * Static Request Class\n */\nexport class Request {\n\n\t/** @event */\n\tpublic static error: Signal = new Signal();\n\t/**\n\t * Creates a new post HttpRequest\n\t */\n\tpublic static post(url: string): HttpRequest {\n\t\treturn new HttpRequest(url).method('POST');\n\t}\n\n\t/**\n\t * Creates a new get HttpRequest\n\t */\n\tpublic static get(url: string): HttpRequest {\n\t\treturn new HttpRequest(url).method('GET');\n\t}\n\n\t/**\n\t * Creates a new put HttpRequest\n\t */\n\tpublic static put(url: string): HttpRequest {\n\t\treturn new HttpRequest(url).method('PUT');\n\t}\n\n\t/**\n\t * Creates a new delete HttpRequest\n\t */\n\tpublic static delete(url: string): HttpRequest {\n\t\treturn new HttpRequest(url).method('DELETE');\n\t}\n}\n","import { source } from './Lang';\nimport { map, ModelRegistry } from './Model';\nimport { HttpRequest } from './Request';\nimport { compile, empty, log } from './view/Compiler';\nimport { context } from './view/Template';\n\n\nexport interface SetupConfig {\n\troutes?:{ [key:string]:{ url:string, method?:string, headers?:{ [key:string]:string } } },\n\tdata?:{ [key:string]:{} },\n\tassets?:{ [key:string]:{ url:string, type?:'js'|'css' } },\n\tlang?:{},\n}\n\nvar config:SetupConfig;\n\nexport function setup( c:SetupConfig, registry?:ModelRegistry ) {\n\tconfig = c;\n\n\t// setup lang translations\n\tif( config.lang ) source( config.lang );\n\n\t// map data if there is data and a registry\n\tif( config.data && registry ) {\n\t\tconfig.data = map( config.data, registry );\n\t}\n}\n\nexport function data( key:string ):any {\n\treturn lookup( key, config.data );\n}\n\nexport function asset( key ):Asset {\n\treturn new Asset( lookup( key, config.assets ) );\n}\n\n\nexport function route( key:string, urlParams:{} = {} ):HttpRequest {\n\tlet c = lookup( key, config.routes );\n\n\tif( !c ) throw new Error( \"Route: '\" + key + \"' could not be found in setup routes.\" );\n\n\tlet url = compile( c.url ).call( { empty:empty, log:contextLog }, urlParams );\n\tlet request = new HttpRequest( url );\n\n\tif( c.method ) request.method( c.method );\n\tif( c.headers ) request.headers( c.headers );\n\n\treturn request;\n}\n\nexport function lookup( key:string, data:any = config ) {\n\treturn compile( '[[ ' + key + ' ]]' ).call( {\n\t\tempty:empty,\n\t\tlog: contextLog,\n\t}, data );\n}\n\n\nfunction contextLog( ...params ) {\n\tif( !context.logging ) return;\n\tlog( ...params );\n}\n\n\n\ninterface AssetConfig {\n\turl: string,\n\ttype?: \"js\" | \"css\",\n}\n\n\n\nclass Asset {\n\n\t// store which assets are already loaded.\n\tstatic promises:{ [index:string]: Promise } = {};\n\n\tconfig:AssetConfig;\n\n\n\tconstructor( config:AssetConfig ) {\n\t\tif( !config.type ) config.type = this.guessType( config.url );\n\t\tthis.config = config;\n\t}\n\n\n\tload():Promise {\n\n\t\t// if not loaded create promise\n\t\tif( !Asset.promises[ this.config.url ] ) {\n\t\t\t( this.config.type == \"js\" ) ? this.loadScript() : this.loadCSS();\n\t\t}\n\n\t\treturn Asset.promises[ this.config.url ];\n\t}\n\n\t/**\n\t * Loads a js file into dom\n\t */\n\tprivate loadScript() {\n\n\t\tvar url = this.config.url;\n\n\t\tAsset.promises[ url ] = new Promise( ( resolve, reject ) => {\n\t\t\tvar element = document.createElement( 'script' );\n\t\t\telement.src = url;\n\t\t\telement.addEventListener( 'load', event => resolve() );\n\t\t\telement.addEventListener( 'error', event => reject() );\n\t\t\tdocument.body.appendChild( element );\n\t\t}).then( event => {\n\t\t\tthis.finalize( url );\n\t\t});\n\t}\n\n\t/**\n\t * Loads a css file into the dom\n\t */\n\tprivate loadCSS() {\n\n\t\tvar url = this.config.url;\n\n\t\tAsset.promises[ url ] = new Promise( ( resolve, reject ) => {\n\t\t\tvar element = document.createElement( 'link' );\n\t\t\telement.type = 'text/css';\n\t\t\telement.rel = 'stylesheet';\n\t\t\telement.href = url;\n\t\t\telement.addEventListener( 'load', event => resolve() );\n\t\t\telement.addEventListener( 'error', event => reject() );\n\t\t\tdocument.head.appendChild( element );\n\t\t}).then( event => {\n\t\t\tthis.finalize( url );\n\t\t});\n\t}\n\n\tprivate finalize( url:string ) {\n\t\tAsset.promises[ url ] = new Promise( ( resolve, reject ) => resolve() );\n\t}\n\n\t/**\n\t * Guesses the type based on the given url\n\t */\n\tprivate guessType( url:string ):\"js\"|\"css\" {\n\t\treturn ( url.split('.').pop() == \"js\" ) ? 'js' : 'css';\n\t}\n}\n\n","/**\n * This module contains the [[Observable]] interface and its principal implementation, [[Signal]].\n * See https://tc39.es/proposal-observable/ and https://rxjs.dev/ for more in-depth information\n * about observables.\n */\n\n\n/**\n * An [[Observer]] is a callback function that will receive `T` values from a [[Observable]]\n * after it has been [[subscribe]]d to it.\n */\nexport type Observer = (arg: T) => void;\n\n\n/**\n * A subscription gets returned to you when you [[Observable.subscribe]] an [[Observer]] to an [[Observable]].\n * It is via this object that you can [[unsubscribe]] the observer again.\n */\nexport interface Subscription {\n\n\t/**\n\t * Unsubscribes the observer from the [[Observable]] so it will no longer receive its values.\n\t */\n unsubscribe(): void;\n}\n\n\n/**\n * An [[Observable]] is a composable sequence of `T` values that will be *pushed* to observers\n * as they become available. This is the reverse of collections, which allow you to *pull* values\n * out of it via iteration.\n *\n * * `subscription = subscribe(observer)` to start receiving values.\n *\n * * `subscription.unsubscribe()` to stop receiving values.\n *\n * @example\n *\n * ```typescript\n * import {node} from '.../core/node/Node';\n *\n * const clicks = node(document.querySelector('#someElement')).clicks;\n * const subscription = clicks.subscribe(e => console.log('You clicked on ', e.target));\n * ...\n * subscription.unsubscribe();\n * ```\n *\n * @seealso https://tc39.es/proposal-observable/\n * @seealso https://rxjs.dev/\n */\nexport class Observable {\n\n private readonly subscribe_: (observer: Observer) => Subscription;\n\n\t/**\n\t * Initializes a new instance of the [[Observable]] class.\n\t *\n\t * @param subscribe The implementation of the [[subscribe]] method.\n\t */\n public constructor(subscribe: (observer: Observer) => Subscription) {\n this.subscribe_ = subscribe;\n }\n\n\t/**\n\t * Returns a new observable where all values of the original observable are delayed\n\t * as long as new values are pushed to observers. Once there hasn't been a new value for\n\t * `wait` milliseconds, the last value gets pushed.\n\t *\n\t * @param wait The number of milliseconds to wait after the last value before it is pushed.\n\t */\n public debounce(wait: number): Observable {\n return new Observable(observer => {\n let timeout;\n return this.subscribe(arg => {\n const later = () => {\n timeout = null;\n observer(arg);\n };\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n });\n });\n }\n\n\t/**\n\t * Gets a new observable containing only the values that fulfill the given predicate `fn`.\n\t * Think [Array.prototype.filter()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter).\n\t *\n\t * @param fn A predicate that specifies which values from the original observable to keep.\n\t */\n public filter(fn: (arg: T) => boolean): Observable {\n return new Observable(observer => {\n return this.subscribe(arg => {\n if (fn(arg)) {\n observer(arg);\n }\n });\n });\n }\n\n\t/**\n\t * Gets a new observable where each value has been transformed by the given function `fn`.\n\t * Think [Array.prototype.map()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map).\n\t *\n\t * @param fn A function that maps a value to another value.\n\t */\n public map(fn: (arg: T) => U): Observable {\n return new Observable(observer => {\n return this.subscribe(arg => {\n observer(fn(arg));\n });\n });\n }\n\n\t/**\n\t * Subscribes the given `observer` (a callback function) to this observable which will start\n\t * receiving its values. Returns a [[Subscription]] via which you can [[unsubscribe]] the observer.\n\t *\n\t * @param observer The callback function that should receive `T` values from this observable.\n\t */\n public subscribe(observer: Observer): Subscription {\n return this.subscribe_(observer);\n }\n}\n\n\n/**\n * A kind of [[Observable]] that can dispatch `T` values via [[Signal.dispatch]].\n */\nexport class Signal extends Observable {\n\n private observers_?: Observer[];\n\n\t/**\n\t * Initializes a new instance of the [[Signal]] class.\n\t */\n public constructor() {\n super(observer => {\n if (!this.observers_) {\n this.observers_ = [observer];\n }\n else if (this.observers_.indexOf(observer) < 0) {\n this.observers_.push(observer);\n }\n const observers = this.observers_;\n return {\n unsubscribe: () => {\n const index = observers.indexOf(observer);\n if (index >= 0) {\n observers.splice(index, 1);\n }\n }\n };\n });\n this.observers_ = [];\n }\n\n\t/**\n\t * Dispatches the given value `arg` to this signal's observers.\n\t *\n\t * @param arg The value to dispatch to observers.\n\t */\n public dispatch(arg: T) {\n if (this.observers_) {\n for (const observer of [...this.observers_]) {\n observer(arg);\n }\n }\n }\n}\n\n/**\n * Listens to an event target event and creates an observable instance\n * @param el the event target tzo listen to\n * @param event the name of the event to listen to\n */\nexport function observable( event:string, el:EventTarget ):Observable {\n\treturn new Observable( observer => {\n\t\tlet handler = ( event ) => observer( event );\n\t\tel.addEventListener( event, handler );\n\t\treturn {\n\t\t\tunsubscribe:() => {\n\t\t\t\tel.removeEventListener( event, handler );\n\t\t\t}\n\t\t}\n\t});\n}\n","import { Model } from \"../Model\";\nimport { observeArray, observeProperties } from \"../Observer\";\nimport { Subscription } from \"../Signal\";\nimport { Template } from \"../view/Template\";\nimport { View } from \"../view/View\";\nimport { Scope } from \"./Scope\";\n\n\nexport class Repeat extends View implements Scope {\n\n\tprotected itemTemplate: string;\n\tprotected arraySubscription: Subscription;\n\tprotected dataSubscription: Subscription;\n\n\tprotected cache: Map = new Map();\n\n\tconstructor(config?) {\n\t\tsuper({ template: '', data: new RepeatModel(), ...config });\n\t}\n\n\tprepareContent(node: Element, template: Template) {\n\t\tthis.itemTemplate = node.innerHTML;\n\t}\n\n\tinit() {\n\t\tthis.onDataChange();\n\t}\n\n\tdeinit() {\n\t\tthis.unsubscribe();\n\n\n\t\t// destroy all templates.\n\t\tfor (const template of this.cache.values() ) {\n\t\t\ttemplate.destroy();\n\t\t}\n\t}\n\n\tonDataChange() {\n\t\tthis.unsubscribe();\n\t\tthis.subscribe();\n\n\t\tthis.renderItems();\n\t}\n\n\n\trenderItems() {\n\n\t\t// check for valid array\n\t\tlet items = this.data.items;\n\t\tif (!Array.isArray(items)) items = [];\n\n\t\t// create new cache.\n\t\tlet existing = this.cache;\n\t\tthis.cache = new Map();\n\n\t\titems.forEach((item, index) => {\n\n\t\t\tlet cacheKey = this.data.getCacheKey( item );\n\n\t\t\t// check if template is already rendered\n\t\t\tlet template = existing.get( cacheKey );\n\n\t\t\t// no already rendered template - create it\n\t\t\tif( !template ) {\n\t\t\t\ttemplate = this.createTemplate(items, item, index);\n\n\t\t\t} else {\n\t\t\t\t// remove from existing cache to prevent removing template\n\t\t\t\texisting.delete( cacheKey );\n\t\t\t}\n\n\t\t\tthis.cache.set( cacheKey, template );\n\n\t\t\t// adjust template order in node if its not already there\n\t\t\tif( this.node.childNodes?.[ index ] != template.node ) {\n\t\t\t\tthis.node.insertBefore( template.node, this.node.childNodes?.[ index ] );\n\t\t\t}\n\t\t});\n\n\t\t// remove old templates\n\t\texisting.forEach( ( template, item ) => {\n\t\t\ttemplate.node?.parentNode?.removeChild( template.node );\n\t\t\ttemplate.destroy();\n\t\t});\n\t}\n\n\n\n\n\n\tcreateTemplate(items: Array, item: any, index: number) {\n\n\t\t// create template if not in cache\n\t\tlet template = new Template(this.itemTemplate);\n\t\tlet data = {\n\t\t\tparent: this.template.context.parent.data,\n\t\t\tindex: index,\n\t\t\titems: items,\n\t\t\tisFirst: item == items[0],\n\t\t\tisLast: item == items[items.length - 1],\n\t\t};\n\n\t\t// inject item\n\t\tdata[this.data.as] = item;\n\n\t\ttemplate.context.data = data;\n\t\ttemplate.extendContext(this.template.context);\n\n\t\ttemplate.render();\n\n\t\treturn template;\n\t}\n\n\t/**\n\t * Subscribes to the data\n\t */\n\tsubscribe() {\n\t\tthis.dataSubscription = observeProperties(this.data, 'items')?.propertyChange.filter(c => c.name == 'items').subscribe(this.onDataChange.bind(this));\n\t\tthis.arraySubscription = observeArray(this.data.items)?.arrayChange.subscribe(this.onDataChange.bind(this));\n\t}\n\n\tunsubscribe() {\n\t\tthis.dataSubscription?.unsubscribe();\n\t\tthis.arraySubscription?.unsubscribe();\n\t}\n}\n\n\ninterface CacheKey {\n\t(data: any): any;\n}\n\nexport class RepeatModel extends Model {\n\n\tas: string;\n\titems: any[];\n\tcaching: boolean;\n\n\tconstructor(config?) {\n\t\tsuper({ as: 'item', items: [], caching: true, ...config });\n\t}\n\n\t/**\n\t * A setter to allow to set the length of the loop by number\n\t */\n\tset count(num: number) {\n\t\tthis.items = Array.from(Array(num).keys());\n\t}\n\n\tgetCacheKey(item: any) {\n\t\tif (this.caching === true && typeof item == 'object' ) return item;\n\t\t// create a new object for every item to have a unique key.\n\t\treturn { key:item };\n\t}\n}\n\n","\n\nvar pass = {\n\tregex:/\\[\\[([\\s\\S]+?)\\]\\]/g,\n\tmapper: function( match, inner ) {\n\t\treturn \"function() {\\n try { with( data ) {\\n return \" + inner + \" } } catch (error) { this.log( error ) } }.call( this )\";\n\t}\n};\n\nvar cache = {};\n\n\n/**\n * Compiles a template string into a template function.\n */\nexport function compile( templateString:string, args:string[] = [ 'data' ] ):Function {\n\n\tlet key = templateString + args.join( ' ' );\n\n\t// handle caching\n\tif( cache[ key ] ) return cache[ key ]\n\n\t// check if template is one single [[ .. ]] expression\n\tlet matches = templateString.match( /\\[\\[([\\s\\S]+?)\\]\\]/ );\n\tif( matches && matches[0] == templateString ) {\n\t\tvar source = parseValue( templateString );\n\t} else {\n\t\tvar source = parseString( templateString );\n\t}\n\n\tvar render = new Function( ...args, source );\n\n\t// store for caching\n\tcache[ key ] = render;\n\n\treturn render;\n}\n\n\n/**\n* Turns the given template into a function body code.\n*/\nfunction parseString( template:string ):string {\n\n\ttemplate = template.replace( pass.regex, ( match, inner:string ) => {\n\t\treturn \"` + this.empty( \" + pass.mapper( match, inner ) + \" ) + `\";\n\t});\n\n\treturn \"return `\" + template + \"`;\";\n}\n\n/**\n* Turns the given template into a function body code.\n*/\nfunction parseValue( template:string ):string {\n\t// simply return the inner template content\n\treturn template.replace( pass.regex, ( match, inner:string ) => {\n\t\treturn \"return \" + pass.mapper( match, inner ) + \";\";\n\t});\n}\n\n/**\n * Tests if the value of the template is empty or not\n */\nexport function empty( data:any ):string {\n\treturn data || data === 0 ? data : '';\n}\n\n/**\n * Logs errors to the console\n */\nexport function log( ...params ) {\n\tif( console ) {\n\t\t( console.trace ) ? console.trace( ...params ) : console.log( ...params );\n\t}\n}\n\n/**\n * Stops the debugger\n */\nexport function debug() {\n\tdebugger;\n}\n\n/**\n * Tests if the given string has an expression\n * @param string\n */\nexport function hasExpression( string:string ):boolean {\n\tpass.regex.lastIndex = 0; // reset global regex\n\treturn pass.regex.test( string );\n}\n\n/**\n * Returns only the content of the expressions [[...]] within the given string\n */\nexport function getContent( string:string ) {\n\tlet content = '';\n\tstring.replace( pass.regex, ( match, inner ) => {\n\t\tcontent += inner;\n\t\treturn '';\n\t});\n\treturn content;\n}\n\n/**\n * Replaces the expression of the given templatee with the content of the closure\n */\nexport function replace( template:string, replacer:( match:string, inner ) => string ) {\n\treturn template.replace( pass.regex, replacer );\n}\n","import { Subscription } from \"../../Signal\";\nimport { TemplateContext } from \"../Template\";\n\n\n\n/**\n * Super class of all expressions to store the expression and its context.\n * It handles also the subscription on observables\n */\nexport abstract class Expression {\n\n\texpression:Function;\n\tcontext:TemplateContext;\n\n\tconstructor( context:TemplateContext ) {\n\t\tthis.context = context;\n\t}\n\n\tabstract destroy();\n}\n\n\nexport interface ExpressionWithInital {\n\tinital();\n}\n\n/**\n * A guard that checks whether the specified object has an inital function to invoke\n *\n * @param obj The object that should be tested.\n */\nexport function hasInital( obj:any ):obj is ExpressionWithInital {\n\treturn obj && obj[ 'inital' ];\n}\n\n\n\n\nexport function snakeToCamel( string ):string {\n\treturn string.replace( /(\\-\\w)/g, match => match[1].toUpperCase() );\n}\n\nexport function camelToSnake( string ) {\n\treturn string.split(/(?=[A-Z])/).join('-').toLowerCase();\n}\n\n","import { Expression } from \"./Expression\";\nimport { TemplateContext } from \"../Template\";\nimport { Observable, observable, Signal, Subscription } from \"../../Signal\";\nimport { compile } from \"../Compiler\";\n\n/**\n * Super class of expressions that will invoke a closure on observable dispatch.\n */\nexport class ClosureExpression extends Expression {\n\n\tsubscription: Subscription;\n\n\n\tconstructor( context:TemplateContext, expression:string ) {\n\t\tsuper( context );\n\t\tthis.expression = compile( expression, [ 'event','data' ] );\n\t}\n\n\tsubscribe( observable:Observable ) {\n\t\tthis.unsubscribe();\n\t\tthis.subscription = observable.subscribe( this.invoke.bind( this ) );\n\t}\n\n\tunsubscribe() {\n\t\tif( this.subscription ) this.subscription.unsubscribe();\n\t}\n\n\tinvoke( event ) {\n\t\tthis.expression.call( this.context, event, this.context.data );\n\t}\n\n\tdestroy() {\n\t\tthis.unsubscribe();\n\t}\n}\n\n\n/**\n * This class subscribes node events and invokes the corresponding closure like:
\n */\nexport class NodeEventExpression extends ClosureExpression {\n\n\tevent:string;\n\tnode:Node;\n\n\tconstructor( context:TemplateContext, expression:string, event:string, node:Node ) {\n\t\tsuper( context, expression );\n\t\tthis.event = event;\n\t\tthis.node = node;\n\n\t\tthis.updateSubscription();\n\t}\n\n\tupdateSubscription() {\n\t\tthis.subscribe( observable( this.event, this.node ) );\n\t}\n}\n\n\n\n","import { observeArray, observeProperties, PropertyObserver } from \"../../Observer\";\nimport { Subscription } from \"../../Signal\";\nimport { compile, replace } from \"../Compiler\";\nimport { context as globalContext, TemplateContext } from \"../Template\";\nimport { Expression } from \"./Expression\";\n\n/**\n * Super class of expression that will render something into to dom\n */\nexport abstract class RenderExpression extends Expression {\n\n\n\troot:ObjectSubscriber;\n\n\n\tconstructor( context:TemplateContext, expression:string ) {\n\t\tsuper( context );\n\t\tthis.expression = compile( expression, [ 'data' ] );\n\n\t\t// disable logging in trace phase\n\t\tconst prevLogging = globalContext.logging;\n\t\tglobalContext.logging = false;\n\t\tthis.trace();\n\t\tglobalContext.logging = prevLogging;\n\n\t\tthis.subscribe();\n\t}\n\n\n\t/**\n\t * updates the dom when the data changes\n\t */\n\tabstract update();\n\n\n\t/**\n\t * The inital render call is called to render the first time\n\t */\n\tinital() {\n\t\tthis.update();\n\t}\n\n\t/**\n\t * Implements subscribe to listen on changes of context data\n\t */\n\tsubscribe() {\n\t\tthis.root.subscribeTo( this.context.data );\n\t}\n\n\n\n\tdestroy() {\n\t\tthis.root.destroy();\n\t}\n\n\n\t/**\n\t * Traces the expression to collect property access\n\t */\n\ttrace() {\n\n\t\tthis.root = new ObjectSubscriber( this );\n\n\t\tvar trapper = {\n\t\t\thas: () => {\n\t\t\t\treturn true;\n\t\t\t},\n\t\t\tget:( t, key, p ) => {\n\n\t\t\t\tif( key == Symbol.unscopables ) return {};\n\t\t\t\tif( key == Symbol.toPrimitive ) return ( hint ) => {\n\t\t\t\t\tif( hint == 'number' ) return 1;\n\t\t\t\t\treturn '';\n\t\t\t\t};\n\n\t\t\t\t// check blacklisted global vars\n\t\t\t\t// *this* is the access on the this context in IE Edge Legacy\n\t\t\t\tif( [ 'JSON', 'Math', '*this*' ].indexOf( key ) >= 0 ) return;\n\n\t\t\t\t// handle data access\n\t\t\t\tif( key == 'data' && t == this.root ) return t;\n\n\n\t\t\t\t// create objectobserver for property if there is not already one.\n\t\t\t\tif( !t.properties.has( key ) ) {\n\t\t\t\t\tt.properties.set( key, new ObjectSubscriber( t.expression ) );\n\t\t\t\t}\n\n\t\t\t\treturn new Proxy( t.properties.get( key ), trapper );\n\t\t\t},\n\t\t}\n\n\t\tthis.expression.call( this.context, new Proxy( this.root, trapper ) );\n\t}\n\n\n\t/**\n\t * Helper function that returns the value of the expression\n\t */\n\tgetExpressionValue() {\n\t\treturn this.expression.call( this.context, this.context.data );\n\t}\n}\n\n\nconst booleanAttributes = {\n\t'checked': [\n\t\tHTMLInputElement,\n\t],\n\t'disabled': [\n\t\tHTMLButtonElement,\n\t\tHTMLFieldSetElement,\n\t\tHTMLInputElement,\n\t\tHTMLOptGroupElement,\n\t\tHTMLOptionElement,\n\t\tHTMLSelectElement,\n\t\tHTMLTextAreaElement,\n\t],\n\t'selected': [\n\t\tHTMLOptionElement,\n\t],\n\t'hidden': [\n\t\tElement,\n\t],\n\t'readonly': [\n\t\tHTMLInputElement,\n\t\tHTMLTextAreaElement,\n\t],\n\t'required': [\n\t\tHTMLInputElement,\n\t\tHTMLTextAreaElement,\n\t\tHTMLSelectElement,\n\t],\n};\n\n/**\n * This class monitors expression on node attributes like:
\n */\nexport class AttributeExpression extends RenderExpression {\n\n\tnode:Element;\n\tattribute:Attr;\n\tboolean:boolean;\n\n\tconstructor( node:Element, attribute:Attr, context:TemplateContext ) {\n\t\tsuper( context, attribute.value );\n\t\tthis.node = node;\n\t\tthis.attribute = attribute;\n\t\tthis.boolean = booleanAttributes[ attribute.name ]?.some( elementType => node instanceof elementType );\n\t}\n\n\tupdate() {\n\t\t// handle input value\n if( this.node instanceof HTMLInputElement || this.node instanceof HTMLTextAreaElement ) {\n if( this.attribute.name == 'value' || this.attribute.name == 'checked' ) {\n this.node[ this.attribute.name ] = this.getExpressionValue();\n }\n }\n\n\t\tif( this.boolean ) {\n\t\t\tif( this.getExpressionValue() ) {\n\t\t\t\tthis.node.setAttribute( this.attribute.name, 'true' );\n\t\t\t} else {\n\t\t\t\tthis.node.removeAttribute( this.attribute.name );\n\t\t\t}\n\t\t}\n\t\telse {\n\t\t\tthis.node.setAttribute( this.attribute.name, this.getExpressionValue() );\n\t\t}\n\t}\n}\n\n\n/**\n * This class monitors expression on node class attibute like:
\n * It supports the object syntax for classes: [[ { 'demo':true } ]]\n */\nexport class CSSExpression extends AttributeExpression {\n\n\texpressionString:string;\n\n\tconstructor( node:Element, attribute:Attr, context:TemplateContext ) {\n\t\tsuper( node, attribute, context );\n\t\tthis.expressionString = attribute.value;\n\t}\n\n\tgetExpressionValue() {\n\t\t// replace all parts of the template for exp. \"static [[ exp1 ]] demo [[ exp2 ]]\"\n\t\treturn replace( this.expressionString, ( match ) => {\n\t\t\tlet value = compile( match ).call( this.context, this.context.data );\n\n\t\t\t// if its an object handle\n\t\t\tif( value && typeof value == 'object' ) return Object.keys( value ).filter( key => value[key] ).join( ' ' );\n\n\t\t\treturn value;\n\t\t});\n\t}\n}\n\n\n\n/**\n * This class monitors expression on text nodes like: [[ my expression ]]
\n */\nexport class TextExpression extends RenderExpression {\n\n\tnode:Node;\n\n\tconstructor( node:Node, context:TemplateContext ) {\n\t\tsuper( context, node.nodeValue );\n\t\tthis.node = node;\n\t}\n\n\tupdate() {\n\t\tthis.node.nodeValue = this.context.empty( this.getExpressionValue() );\n\t}\n}\n\n\n\n/**\n * A helper class to manage subscriptions on objects with a given set of properties\n */\nclass ObjectSubscriber {\n\n\tsubscription:Subscription;\n\tproperties:Map;\n\texpression:RenderExpression;\n\n\tconstructor( exp:RenderExpression ) {\n\t\tthis.properties = new Map();\n\t\tthis.expression = exp;\n\t}\n\n\n\tsubscribeTo( obj:any ) {\n\n\t\tthis.unsubscribe();\n\n\t\t// do not subscribe on undefined\n\t\tif( !obj ) return;\n\n\t\t// do not subscribe on anythinf else than object\n\t\tif( !( obj instanceof Object) ) return;\n\n\t\t// check if we have properties to listen\n\t\tif( !this.hasProperties() ) return;\n\n\t\t// subscribe on arrays\n\t\tif( Array.isArray( obj ) ) {\n\t\t\tthis.subscription = observeArray( obj ).arrayChange.subscribe( this.onArrayChange.bind( this ) );\n\n\t\t// subscribe to object\n\t\t} else {\n\t\t\t// observe properties of expression in given obj\n\t\t\tlet props =[ ...this.properties.keys() ];\n\t\t\tprops.unshift( obj );\n\t\t\tlet obs = observeProperties.apply( null, props ) as PropertyObserver;\n\n\t\t\t// subscribe to changes on obj\n\t\t\tthis.subscription = obs.propertyChange.subscribe( this.onObjectChange.bind( this ) );\n\t\t}\n\n\n\t\t// subscribe child properties\n\t\tthis.properties.forEach( ( value, key ) => {\n\t\t\tvalue.subscribeTo( obj[ key ] );\n\t\t});\n\t}\n\n\n\tunsubscribe() {\n\t\tif( this.subscription ) this.subscription.unsubscribe();\n\t\tthis.properties.forEach( ( value, key ) => {\n\t\t\tvalue.unsubscribe();\n\t\t});\n\t}\n\n\n\tonObjectChange( e:{ name:string } ) {\n\n\t\t// check if this expression has the changed property\n\t\tlet obj = this.properties.get( e.name );\n\t\tif( obj ) {\n\n\t\t\t// update expression content\n\t\t\tthis.expression.update();\n\n\t\t\t// if the changed propery has sub properties we need to resubscribe\n\t\t\tif( obj.hasProperties() ) this.expression.subscribe();\n\t\t}\n\t}\n\n\tonArrayChange( e ) {\n\t\t// update expression content\n\t\tthis.expression.update();\n\n\t\t// resubscribe if there is an access on array indices/properties = 0,1,...\n\t\tif( this.properties.size > 0 ) {\n\t\t\tthis.expression.subscribe();\n\t\t}\n\t}\n\n\n\thasProperties() {\n\t\treturn this.properties.size > 0;\n\t}\n\n\tdestroy() {\n\n\t\tthis.unsubscribe();\n\n\t\tfor (const child of this.properties.values() ) {\n\t\t\tchild.destroy();\n\t\t}\n\n\t\tthis.properties = new Map();\n\t}\n}\n","import { isScope } from '../../components/Scope';\nimport { isPropertyObserver, observeArray, observeProperties } from '../../Observer';\nimport { Observable, Signal, Subscription } from '../../Signal';\nimport { compile } from '../Compiler';\nimport { context, Template, TemplateContext } from '../Template';\nimport { create, invokeInit, View } from '../View';\nimport { ClosureExpression, NodeEventExpression } from './ClosureExpression';\nimport { Expression, hasInital, snakeToCamel } from './Expression';\nimport { AttributeExpression, RenderExpression } from './RenderExpression';\n\n\n/**\n * This class monitors expression on the node view attribute like:
\n */\nexport class ViewExpression extends AttributeExpression {\n\n\texpressions: Expression[];\n\ttemplate: Template;\n\tview: View;\n\tmergers: Array;\n\trerenderCheck: RerenderCheck;\n\tinnerTemplates: Array<{ name:string, template:string, data:string }>;\n\n\tconstructor( node: Element, template: Template ) {\n\t\tsuper( node, node.attributes.getNamedItem( 'view' ), template.context );\n\t\tthis.template = template;\n\t\tthis.expressions = [];\n\t\tthis.mergers = [];\n\n\t\tthis.parseAttributes();\n\t\tthis.parseInnerTemplates();\n\n\t}\n\n\tinital() {\n\t\tthis.renderView();\n\t}\n\n\n\tupdate() {\n\t\t// flag rerendering\n\t\tthis.rerenderCheck.flag = true;\n\t}\n\n\trenderView() {\n\n\t\t// restore original attribute values from mergers\n\t\tfor( const merger of this.mergers ) {\n\t\t\tmerger.reset();\n\t\t}\n\t\t// delete old mergers\n\t\tthis.mergers = [];\n\n\t\t// destroy old view if there is any\n\t\tif( this.view ) this.view.destroy();\n\n\t\tlet viewName = this.getExpressionValue();\n\n\t\t// create view baed on its context\n\t\tthis.view = create( viewName, this.context );\n\n\t\t// stop rendering if there is no valid view\n\t\tif( !this.view ) return;\n\n\n\t\t// inital execute render expression so the view data is correctly set\n\t\tthis.expressions.forEach( expr => {\n\t\t\tif( hasInital( expr ) ) expr.inital();\n\t\t} );\n\n\t\t// check for scope view that need the inner content of this node\n\t\tif( isScope( this.view ) ) this.view.prepareContent( this.node, this.template );\n\n\t\t// register inner templates\n\t\tfor (const template of this.innerTemplates ) {\n\t\t\tthis.view.registry.add( template.name, () => {\n\t\t\t\t// if there is a template expression for the data invoke it with this context.\n\t\t\t\tconst data = ( template.data ) ? compile( template.data, [ 'data' ] ).call( this.context, this.context.data ) : this.context.data;\n\t\t\t\treturn new View( { template:template.template, data } );\n\t\t\t})\n\t\t}\n\n\t\t// render the view to merge it afterwards\n\t\tthis.view.template.render();\n\n\t\t// properly set the view attribute based on the registred key\n\t\tthis.node.setAttribute( 'view', this.getViewName( viewName ) );\n\n\t\t// define what attributes should merge from outside/inside\n\t\tthis.mergeNodes();\n\n\n\t\t// subscribe on data events after render\n\t\tthis.expressions.forEach( expr => {\n\t\t\tif( expr instanceof DataEventExpression ) expr.updateSubscription();\n\t\t} );\n\n\t\t// make sure rerender check is last\n\t\tthis.rerenderCheck.subscribe();\n\n\t\t// call init after node is correctly set\n\t\tinvokeInit( this.view );\n\t}\n\n\n\n\n\t/**\n\t * Parses node attributes of this view node\n\t */\n\tparseAttributes() {\n\n\t\tlet attrs = Array.prototype.slice.call( this.node.attributes );\n\n\t\tfor( const attr of attrs ) {\n\n\t\t\t// check on data expression\n\t\t\tif( attr.name == 'data' ) {\n\t\t\t\tlet dataExpr = new DataExpression( this, attr.value );\n\t\t\t\tthis.rerenderCheck = new RerenderCheck( this, attr.value + ' ' + this.node.getAttribute( 'view' ) );\n\t\t\t\tthis.node.removeAttribute( attr.name );\n\t\t\t\tthis.expressions.unshift( dataExpr ); // make sure data is set first\n\t\t\t} else {\n\t\t\t\tthis.rerenderCheck = new RerenderCheck( this, this.node.getAttribute( 'view' ) );\n\t\t\t}\n\n\t\t\t// check on data attribite expression\n\t\t\tif( attr.name.indexOf( 'data-' ) == 0 ) {\n\t\t\t\tlet expr = new DataAttributeExpression( this, attr.value, snakeToCamel( attr.name.substring( 5 ) ) );\n\t\t\t\tthis.node.removeAttribute( attr.name );\n\t\t\t\tthis.expressions.push( expr );\n\t\t\t}\n\n\t\t\t// handle propertyChanged events\n\t\t\tif( attr.name.indexOf( 'on-data-' ) == 0 ) {\n\t\t\t\tlet event = snakeToCamel( attr.name.replace( 'on-data-', '' ) );\n\t\t\t\tlet eventExpression = new AttributeEventExpression( this, attr.value, event );\n\t\t\t\tthis.node.removeAttribute( attr.name );\n\t\t\t\tthis.expressions.push( eventExpression );\n\t\t\t}\n\n\t\t\t// handle custom signal events\n\t\t\tif( attr.name.indexOf( 'on-' ) == 0 ) {\n\t\t\t\tlet event = snakeToCamel( attr.name.replace( 'on-', '' ) );\n\t\t\t\tlet expr = new SignalEventExpression( this, attr.value, event );\n\t\t\t\tthis.node.removeAttribute( attr.name );\n\t\t\t\tthis.expressions.push( expr );\n\t\t\t}\n\n\t\t}\n\t}\n\n\n\tparseInnerTemplates( ) {\n\t\t// parse all nodes\n\t\tconst templateNodes = Array.from( this.node.children ).filter( n => n.tagName == 'TEMPLATE' );\n\t\tthis.innerTemplates = Array.from( templateNodes ).map( node => {\n\t\t\tnode.parentNode.removeChild( node );\n\t\t\treturn {\n\t\t\t\tname: node.getAttribute( 'name' ),\n\t\t\t\ttemplate: node.innerHTML,\n\t\t\t\tdata: node.getAttribute( 'data' )\n\t\t\t}\n\t\t});\n\n\t\t// if there is an inner content auto register as 'Content?\n\t\tif( this.node.innerHTML.trim() != '' ) {\n\t\t\tthis.innerTemplates.push( {\n\t\t\t\tname: 'Content',\n\t\t\t\ttemplate: this.node.innerHTML,\n\t\t\t\tdata: undefined\n\t\t\t})\n\t\t}\n\t}\n\n\n\tdestroy() {\n\t\tif( this.view ) this.view.destroy();\n\t\tfor( const exp of this.expressions ) {\n\t\t\texp.destroy();\n\t\t}\n\t\tthis.rerenderCheck.destroy();\n\t}\n\n\n\n\t/**\n\t * Merges inner view node with the other view node.\n\t */\n\tmergeNodes() {\n\n\t\t// get all attributes from outside and inside and make them unique\n\t\tlet attributes = Array.prototype.slice.call( this.node.attributes ).concat( Array.prototype.slice.call( this.view.node.attributes ) ).map( attr => attr.name );\n\t\tattributes = attributes.filter( ( item, i ) => attributes.indexOf( item ) === i );\n\n\t\t// merge each attribute\n\t\tattributes.forEach( attr => {\n\n\t\t\tlet merger = new AttributeMerger( this.node, attr );\n\t\t\tmerger.setupInner( this.view.template );\n\t\t\tmerger.setupOuter( this.template );\n\t\t\tmerger.update();\n\n\t\t\tthis.mergers.push( merger );\n\t\t} );\n\n\t\t// empty target node\n\t\tthis.node.innerHTML = '';\n\n\t\t// copy children\n\t\twhile( this.view.node.hasChildNodes() ) {\n\t\t\tthis.node.appendChild( this.view.node.firstChild );\n\t\t}\n\n\n\t\t// adjust event expressions to new node\n\t\tlet eventExpressions = this.view.template.filterExpressions( expr => expr instanceof NodeEventExpression && expr.node == this.view.node ) as NodeEventExpression[];\n\t\teventExpressions.forEach( expr => {\n\t\t\texpr.node = this.node;\n\t\t\texpr.updateSubscription(); // will reregister on new target\n\t\t} );\n\n\t\t// properly setup node refenrence\n\t\tthis.view.template.node = this.node;\n\n\t}\n\n\n\tgetViewName( key: any ) {\n\t\tif( typeof key == 'string' ) return key;\n\t\tif( typeof key == 'function' ) return key.toString().match( /function\\s(.*?)\\(/ )[ 1 ];\n\t\tif( typeof key == 'object' && key !== null ) {\n\t\t\t// match es6 class\n\t\t\tlet m = key.constructor.toString().match( /class\\s(.*?)\\s/ );\n\t\t\tif( m ) return m[ 1 ];\n\t\t\t// match es5 class\n\t\t\tm = key.constructor.toString().match( /function\\s(.*?)\\(/ );\n\t\t\tif( m ) return m[ 1 ];\n\t\t}\n\t\treturn '';\n\t}\n\n}\n\n\n/**\n * This class monitors expression on data attributes like:
\n */\nclass DataAttributeExpression extends RenderExpression {\n\n\tattribute: string;\n\tviewExpression: ViewExpression;\n\n\tconstructor( viewExpression: ViewExpression, expression: string, attribute: string ) {\n\t\tsuper( viewExpression.context, expression );\n\t\tthis.attribute = attribute;\n\t\tthis.viewExpression = viewExpression;\n\t}\n\n\tupdate() {\n\t\tthis.viewExpression.view.data[ this.attribute ] = this.getExpressionValue();\n\t}\n}\n\n/**\n * This class monitors expression on data the attributes like:
\n */\nclass DataExpression extends RenderExpression {\n\n\tviewExpression: ViewExpression;\n\n\tconstructor( viewExpression: ViewExpression, templateString: string ) {\n\t\tsuper( viewExpression.context, templateString );\n\t\tthis.viewExpression = viewExpression;\n\t}\n\n\tinital() {\n\t\tconst d = this.getExpressionValue();\n\t\t// only set data if there is a valid data\n\t\tif( d != undefined ) this.viewExpression.view.data = d;\n\t}\n\n\tupdate() {\n\t\t// flag rerendering\n\t\tthis.viewExpression.rerenderCheck.flag = true;\n\t}\n}\n\n\n\n\n/**\n * Super\n */\nclass DataEventExpression extends ClosureExpression {\n\n\tviewExpression: ViewExpression;\n\n\tconstructor( viewExpression: ViewExpression, expression: string ) {\n\t\tsuper( viewExpression.context, expression );\n\t\tthis.viewExpression = viewExpression;\n\t}\n\n\tupdateSubscription() {\n\n\t}\n}\n/**\n * This class monitors expression of data events like:
\n */\nclass AttributeEventExpression extends DataEventExpression {\n\n\tattribute: string;\n\tarraySubscription:Subscription;\n\n\tconstructor( viewExpression: ViewExpression, expression: string, attribute: string ) {\n\t\tsuper( viewExpression, expression );\n\t\tthis.attribute = attribute;\n\t}\n\n\tupdateSubscription() {\n\n\t\tlet data = this.viewExpression.view.data as any;\n\t\tif (!data) { return; }\n\n\t\t// register on view data\n\t\tlet d = observeProperties( data, this.attribute );\n\t\tthis.subscribe( d.propertyChange.filter( e => e.name == this.attribute ) );\n\n\t\t// register on array changes if its an array attribute\n\t\tlet value = data[ this.attribute ];\n\t\tif( Array.isArray( value ) ) this.subscribeArray( observeArray( value ).arrayChange );\n\n\t\t// inital invoke to adjust values outside\n\t\tthis.invoke();\n\t}\n\n\tinvoke() {\n\t\tsuper.invoke( { name: this.attribute, value: this.viewExpression.view.data[ this.attribute ] } );\n\t}\n\n\tsubscribeArray( observable:Observable ) {\n\t\tthis.unsubscribeArray();\n\t\tthis.arraySubscription = observable.subscribe( this.invoke.bind( this ) );\n\t}\n\n\tunsubscribeArray() {\n\t\tif( this.arraySubscription ) this.subscription.unsubscribe();\n\t}\n\n\tdestroy() {\n\t\tsuper.destroy();\n\t\tthis.unsubscribeArray();\n\t}\n}\n\n/**\n * This class subscribes model signals and invokes the corresponding closure like:
\n */\nclass SignalEventExpression extends DataEventExpression {\n\n\tsignalName: string;\n\n\tconstructor( viewExpression: ViewExpression, expression: string, signalName: string ) {\n\t\tsuper( viewExpression, expression );\n\t\tthis.signalName = signalName;\n\t}\n\n\tupdateSubscription() {\n\n\t\tconst data = this.viewExpression.view.data;\n\t\tif (!data) { return; }\n\t\t// check for valid signal and subscribe\n\t\tlet signal = data[ this.signalName ];\n\n\t\tif( signal instanceof Signal ) {\n\t\t\tthis.subscribe( signal );\n\t\t}\n\t}\n}\n\n\nclass AttributeMerger {\n\n\tnode: Element;\n\tattr: string;\n\tinner: AttributeExpression;\n\touter: AttributeExpression;\n\n\tconstructor( node: Element, attr: string ) {\n\t\tthis.node = node;\n\t\tthis.attr = attr;\n\t}\n\n\tsetupInner( template: Template ) {\n\t\tthis.inner = template.filterExpressions( expr => expr instanceof AttributeExpression && expr.node == template.node && expr.attribute.name == this.attr )[ 0 ] as AttributeExpression;\n\t\tif( this.inner && !( this.inner instanceof ViewExpression ) ) {\n\t\t\t// use merge function to update\n\t\t\tthis.inner.update = this.update.bind( this );\n\t\t} else {\n\t\t\t// create dummy expression for later use\n\t\t\tthis.inner = new AttributeExpression( template.node, this.getAttrOf( template.node ), template.context );\n\t\t}\n\t}\n\n\tsetupOuter( template: Template ) {\n\t\tthis.outer = template.filterExpressions( expr => expr instanceof AttributeExpression && expr.node == this.node && expr.attribute.name == this.attr )[ 0 ] as AttributeExpression;\n\t\tif( this.outer && !( this.outer instanceof ViewExpression ) ) {\n\t\t\tthis.outer.update = this.update.bind( this );\n\t\t} else {\n\t\t\tthis.outer = new AttributeExpression( this.node, this.getAttrOf( this.node ), template.context );\n\t\t}\n\t}\n\n\n\tupdate() {\n\n\t\tlet outerContent = this.outer.getExpressionValue();\n\t\tlet innerContent = this.inner.getExpressionValue();\n\n\t\t// handle class attribute to join inner & outer classes\n\t\tif( this.attr == 'class' ) {\n\n\t\t\tlet classes = ( outerContent + ' ' + innerContent ).split( ' ' ).filter( c => c.length > 0 );\n\t\t\tlet list = this.node.classList;\n\n\t\t\tthis.node.setAttribute( 'class', '' ); // reset\n\t\t\tlist.add.apply( list, classes );\n\n\t\t\t// handle all regular attributes where inner wins\n\t\t} else {\n\t\t\tthis.node.setAttribute( this.attr, innerContent ? innerContent : outerContent );\n\t\t}\n\t}\n\n\tgetAttrOf( node: Element ) {\n\t\tlet attr = node.attributes[ this.attr ];\n\t\tif( !attr ) attr = { name: this.attr, value: '' };\n\t\treturn attr;\n\t}\n\n\treset() {\n\t\tthis.node.setAttribute( this.attr, this.outer.getExpressionValue() );\n\t}\n\n}\n\n\n/**\n * Observes both view=\"..\" and data=\"...\" expressions to control rendering of view\n */\nclass RerenderCheck extends RenderExpression {\n\n\tflag: boolean = false;\n\tviewExpression: ViewExpression;\n\n\tconstructor( viewExpression :ViewExpression, expression:string ) {\n\t\tsuper( viewExpression.context, expression )\n\t\tthis.viewExpression = viewExpression;\n\t}\n\n\tupdate() {\n\t\tif( this.flag ) this.viewExpression.renderView();\n\t\tthis.flag = false;\n\t}\n\n}\n","import { Template } from \"../view/Template\";\n\nexport interface Scope {\n\tprepareContent( node:Element, template:Template );\n}\n\n/**\n * A guard that checks whether the specified object is a [[Scope]].\n *\n * @param obj The object that should be tested.\n */\nexport function isScope( obj:any ):obj is Scope {\n\treturn obj && obj[ 'prepareContent' ];\n}\n\n","import { Subscription, observable } from '../Signal';\nimport { empty, hasExpression, log, debug } from './Compiler';\nimport { Expression, snakeToCamel } from './expressions/Expression';\nimport { ViewExpression } from './expressions/ViewExpression';\nimport { ViewRegistry } from './View';\nimport { translate } from '../Lang';\nimport { data, route, asset, lookup } from '../Setup';\nimport { isPropertyObserver } from '../Observer';\nimport { RenderExpression, TextExpression, CSSExpression, AttributeExpression } from './expressions/RenderExpression';\nimport { NodeEventExpression } from './expressions/ClosureExpression';\n\n\nexport interface TemplateContext {\n\tregistry:ViewRegistry,\n\tdata: {},\n\t[x: string]: any\n}\n\n\nexport class Template {\n\n\tpublic node:Element;\n\tpublic context:TemplateContext;\n\tpublic expressions:Array = [];\n\tpublic content:string|Element;\n\n\tprivate dataSubscription:Subscription;\n\n\tconstructor( content:string|Element ) {\n\t\tthis.content = content;\n\t\tthis.context = {\n\t\t\tdata: {},\n\t\t\tregistry: new ViewRegistry(),\n\t\t}\n\n\t\tObject.setPrototypeOf( this.context, context );\n\t}\n\n\trender() {\n\n\t\tthis.node = ( this.content instanceof Element ) ? this.content : createNode( this.content );\n\n\t\t// inject template reference\n\t\tthis.node['template'] = this;\n\n\t\t// recusive search for expression\n\t\tthis.traverse();\n\n\t\t// initial render\n\t\tthis.expressions.forEach( expr => {\n\t\t\tif( expr instanceof RenderExpression ) expr.inital();\n\t\t})\n\t}\n\n\ttraverse() {\n\n\t\t// handle children\n\t\tlet treeWalker = document.createTreeWalker( this.node, NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT, {\n\t\t\t// do not process scripts\n\t\t\tacceptNode: ( n:Node ) => {\n\t\t\t\treturn n.nodeName.toLowerCase() == 'script' ? NodeFilter.FILTER_REJECT : NodeFilter.FILTER_ACCEPT;\n\t\t\t}\n\t\t} );\n\n\t\tlet current:Node = this.node;\n\n\t\twhile( current ) {\n\n\n\n\t\t\tthis.processNode( current as Element|Text );\n\n\t\t\t// dont dig into view nodes\n\t\t\tif( current instanceof Element && current.getAttribute( 'view' ) ) {\n\t\t\t\tcurrent = treeWalker.nextSibling();\n\t\t\t\t// there is no sibling if it is the last child - goto ancestor's sibling\n\t\t\t\tif( !current ) {\n\t\t\t\t\twhile( treeWalker.parentNode() ) {\n\t\t\t\t\t\tif( current = treeWalker.nextSibling() ) break;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\tcurrent = treeWalker.nextNode();\n\t\t}\n\t}\n\n\tprocessNode( node:Element|Text ) {\n\n\t\t// check on text node\n\t\tif( node instanceof Text ) {\n\n\t\t\t// only if there is an expression\n\t\t\tif( hasExpression( node.nodeValue ) ) {\n\t\t\t\tthis.expressions.push( new TextExpression( node, this.context ) );\n\t\t\t}\n\n\t\t\treturn;\n\t\t}\n\n\t\t// handle <.. view=\"...\"> nodes\n\t\tif( node.getAttribute( 'view' ) ) {\n\t\t\tthis.processAttributes( node );\n\n\t\t\tlet expr = new ViewExpression( node, this );\n\t\t\tthis.expressions.push( expr );\n\n\t\t\treturn;\n\t\t}\n\n\t\t// handle events and attribute expressions\n\t\tthis.processAttributes( node );\n\t}\n\n\n\n\tprocessAttributes( node:Element ) {\n\n\t\tArray.prototype.slice.call( node.attributes ).forEach( ( attr:Attr ) => {\n\n\t\t\t// do not create expressions for view= and data-..= attributes\n\t\t\tif( attr.name.indexOf( 'data-' ) == 0 || attr.name == 'view' ) return;\n\n\t\t\t// handle node events\n\t\t\tif( attr.name.indexOf( 'on-' ) == 0 ) {\n\t\t\t\tlet event = snakeToCamel( attr.name.replace( 'on-', '' ) );\n\n\t\t\t\t// check if its a native node event - check on \"on..\" property like \"onclick\"\n\t\t\t\tif( node[ 'on' + event ] !== undefined ) {\n\t\t\t\t\tlet expr = new NodeEventExpression( this.context, attr.value, event, node );\n\t\t\t\t\tthis.expressions.push( expr );\n\t\t\t\t\tnode.removeAttribute( attr.name );\n\t\t\t\t}\n\n\t\t\t// handle attribute expressions & ignore view data attributes & ignore\n\t\t\t} else if( hasExpression( attr.value ) ) {\n\t\t\t\tlet kind = ( attr.name == \"class\" ) ? CSSExpression : AttributeExpression;\n\t\t\t\tlet expr = new kind( node, attr, this.context );\n\t\t\t\tthis.expressions.push( expr );\n\t\t\t}\n\t\t});\n\t}\n\n\n\n\tdestroy() {\n\t\tthis.expressions.forEach( expr => expr.destroy() );\n\t}\n\n\t/**\n\t * Returns an array of expressions with the given filter\n\t * @param filter the callback for the filter\n\t */\n\tfilterExpressions( filter:( expr:Expression ) => boolean ) {\n\t\treturn this.expressions.filter( filter );\n\t}\n\n\t/**\n\t * Extends this context from the given parent context.\n\t * Injecting the parent reference and setup prototype chain\n\t * @param parent The parent context\n\t */\n\textendContext( parent:TemplateContext ) {\n\t\tthis.context.parent = parent;\n\t\tObject.setPrototypeOf( this.context, parent );\n\t}\n\n}\n\n\nfunction createNode( html:string ) {\n\n\tlet template = document.createElement( 'template' );\n\ttemplate.innerHTML = html;\n\n\t// if template has one root node, return that\n\tif( template.content.children.length == 1 ) {\n\t\treturn template.content.children[0];\n\n\t// if template has multiple root nodes wrap them into a div\n\t} else {\n\t\tlet temp = document.createElement('div' );\n\t\ttemp.appendChild( template.content );\n\t\treturn temp;\n\t}\n}\n\n\n\n\n\n/**\n * The global template context that is available as \"this...\" in all template expressions\n */\nexport var context:any = {\n\tlogging: false,\n\tempty: empty,\n\tlog: ( ...params ) => {\n\t\tif( !context.logging ) return;\n\t\tlog( ...params );\n\t},\n\t// inject translations\n\ttrans: translate,\n\t// inject setup helpers\n\tsetup: {\n\t\tdata:data,\n\t\troute:route,\n\t\tasset:asset,\n\t\tlookup:lookup\n\t},\n\t// inject debugger\n\tdebug: () => {\n\t\tdebugger;\n\t}\n}\n\n\n/**\n * A helper function to template scan on a node or a html string.\n * @param opts.root The root node or html string to scan for expressions\n * @param opts.registry The view registry to lookup views in view=\"..\" expressions\n * @param opts.data The data passed into the template.\n */\nexport function scan( opts:{ root:Element|string, registry?:ViewRegistry, data?:any } ) {\n\tlet template = new Template( opts.root );\n\n\t// setup registry\n\tif( opts.registry ) template.context.registry = opts.registry;\n\n\t// setup data\n\tif( opts.data ) template.context.data = opts.data;\n\n\ttemplate.render();\n\n\treturn template;\n}\n\n\n\n\n\n\n\n","import { Registry } from '../Registry';\nimport { Template, TemplateContext } from './Template';\n\n\n\n\nexport interface ViewConfig {\n\tdata?:TData,\n\ttemplate?:string|Element,\n\tregistry?:ViewRegistry,\n}\n\n\n/**\n * A common view class that has a container to render content/template into.\n */\nexport class View {\n\n\tprivate _template:Template;\n\n\tconstructor( config:ViewConfig = {} ) {\n\n\t\tthis._template = new Template( config.template );\n\n\t\tif( config.registry ) this._template.context.registry = config.registry;\n\t\tif( config.data ) this._template.context.data = config.data;\n\n\t\tthis._template.context.view = this;\n\t}\n\n\n\t/**\n\t * Renders the view template.\n\t * If an empty target is given, the template is rendered into to given target.\n\t * If the target is not empty, the content of the target is used as the template.\n\t */\n\tpublic render() {\n\n\t\t// do rendering of template\n\t\tthis._template.render();\n\n\t\t// everything is ready now we can invoke view's init\n\t\tinvokeInit( this );\n\t}\n\n\t/**\n\t * The init function is automatically called after the render function.\n\t * So everything is rendered and the node is ready to be used.\n\t * Overwrite the init function for custom dom manipulations.\n\t */\n\tpublic init() {\n\n\t}\n\n\t/**\n\t * Destroys properly the view\n\t */\n\tdestroy() {\n\t\tthis._template.destroy();\n\t\tinvokeDeinit( this );\n\t}\n\n\t/**\n\t * The deinit function is automatically called after the view is destroyed.\n\t * Use it to unsubscribe signals etc\n\t */\n\tpublic deinit() {\n\n\t}\n\n\n\t/**\n\t * Returns the root node of the view\n\t */\n\tget node():Element {\n\t\treturn this._template.node;\n\t}\n\n\tget data():TData {\n\t\treturn this._template.context.data as TData;\n\t}\n\tset data( d:TData ) {\n\t\tthis._template.context.data = d;\n\t}\n\n\tget context() {\n\t\treturn this._template.context;\n\t}\n\tget registry() {\n\t\treturn this._template.context.registry;\n\t}\n\tget template() {\n\t\treturn this._template;\n\t}\n}\n\n\n/**\n * A registry to lookup views\n */\nexport class ViewRegistry extends Registry {}\n\n\n/**\n * A factory function that creates a view based on the given key to lookup and its context\n */\nexport function create( key:any, context:TemplateContext ) {\n\n\t/**\n\t * Lookups the viewName in the template context registry.\n\t * Furthermore it lookups in all parent template contexts\n\t */\n\tfunction lookup( key:any, context:TemplateContext ) {\n\n\t\twhile( context ) {\n\t\t\tlet found = context.registry.get( key );\n\t\t\tif( found ) return found;\n\t\t\tcontext = context.parent;\n\t\t}\n\n\t\treturn null;\n\t}\n\n\tlet factory = lookup( key, context );\n\n\t// no view found with name\n\tif( !factory ) throw new Error( \"No registered view found with name: \" + key );\n\n\tlet view = factory( key );\n\n\t/// inject parent template in context\n\tview.template.extendContext( context );\n\n\treturn view;\n}\n\n\n/**\n * Internal helper function that executes init functions on view & data\n */\nexport function invokeInit( v:View ) {\n\tif( v.data && typeof v.data[ 'init' ] == 'function' ) v.data.init();\n\tv.init();\n}\n\n/**\n * Internal helper function that executes init functions on view & data\n */\nexport function invokeDeinit( v:View ) {\n\tif( v.data && typeof v.data[ 'deinit' ] == 'function' ) v.data.deinit();\n\tv.deinit();\n}\n","import { Model } from \"@lernetz/ts-lib\";\nimport { View, ViewConfig } from \"@lernetz/ts-lib/src/view/View\";\nimport { viewportDimension } from \"@lernetz/ts-lib/src/dom\";\nimport { route } from \"@lernetz/ts-lib/src/Setup\";\n\nexport class Image extends Model {\n route:string;\n viewWidth:number;\n viewHeight:number;\n [key:string]:any;\n srcset:{[key:string]:{[key:string]:string}};\n}\n\nexport class ImageView extends View {\n\n errorhandle;\n\n constructor( config?:ViewConfig ) {\n super( { data:new Image( { route:'image' } ), template:'', ...config } );\n }\n\n init() {\n this.setAttributes( [ 'width', 'height' ] );\n\n // inject\n let viewport = viewportDimension();\n this.data.viewWidth = viewport.width;\n this.data.viewHeight = viewport.height;\n\n // register for image load\n this.errorhandle = this.onError.bind( this );\n this.node.addEventListener( 'error', this.errorhandle );\n\n // load image\n this.load();\n }\n\n deinit() {\n this.node.removeEventListener( 'error', this.errorhandle );\n }\n\n load() {\n this.node.setAttribute( 'src', route( this.data.route, this.data ).url() );\n\n if( this.data.srcset ) {\n\n // loop over all conditions an generate routes\n let srcset = Object.keys( this.data.srcset ).map( condition => {\n return route( this.data.route, { ...this.data, ...this.data.srcset[ condition ] } ).url() + ' ' + condition;\n }).join( ',' );\n\n this.node.setAttribute( 'srcset', srcset );\n\n }\n }\n\n onError( e ) {\n this.node.setAttribute( 'src', 'https://fakeimg.pl/500x300/?text=Error' );\n }\n\n setAttributes( names ) {\n for( const name of names ) {\n if( this.data[ name ] ) this.node.setAttribute( name, this.data[ name ] );\n }\n }\n}\n","\n\n/**\n * Defines scroll infomations like top, left and width, height\n * The width/height is the max value for the scrollTop/scrollLeft value.\n */\nexport interface ScrollInfo {\n\ttop:number;\n\theight:number;\n\tleft:number;\n\twidth:number;\n}\n\n/**\n * Defines a dimension with width & height\n */\nexport interface Dimension {\n\theight:number;\n\twidth:number;\n}\n\n\n\n/**\n * Returns the scroll top position of the window/body.\n */\nexport function scrollInfo():ScrollInfo {\n\n\tvar e = document.documentElement;\n\tvar b = document.body;\n\tvar doc = documentDimension();\n\tvar view = viewportDimension();\n\n\treturn {\n\t\ttop: ( e && e.scrollTop ) || b.scrollTop,\n\t\tleft: ( e && e.scrollLeft ) || b.scrollLeft,\n\t\twidth: doc.width - view.width,\n\t\theight: doc.height - view.height\n\t}\n}\n\n/**\n * Returns the dimensions of the document without the scrollbars\n */\nexport function documentDimension():Dimension {\n\treturn {\n\t\twidth: document.documentElement.offsetWidth || document.body.offsetWidth,\n\t\theight: Math.max(\t\t// Hack for IE 10 document height\n\t\t\tdocument.body.scrollHeight, document.documentElement.scrollHeight,\n\t\t\tdocument.body.offsetHeight, document.documentElement.offsetHeight,\n\t\t\tdocument.body.clientHeight, document.documentElement.clientHeight\n\t\t)\n\t}\n}\n\n\n/**\n * Returns the dimensions of the viewport including the scrollbars\n */\nexport function viewportDimension():Dimension {\n\treturn {\n\t\twidth: window.innerWidth || document.body.clientWidth,\n\t\theight: window.innerHeight || document.body.clientHeight\n\t}\n}\n\n/**\n * Returns the bounding box of this node including values for top, bottom, left, right relative to the current viewport\n */\nexport function relativeBounds( node:Element ) {\n\tlet c = node.getBoundingClientRect();\n\tlet r = { top: c.top, left: c.left, right: c.right, bottom: c.bottom, height: c.height, width: c.width };\n\n\tif ( r.height == undefined ) r.height = r.bottom - r.top;\n\tif ( r.width == undefined ) r.width = r.right - r.left;\n\n\treturn r;\n}\n\n/**\n * Returns the bounding box of this node including values for top, bottom, left, right in absolute document coordinates\n */\nexport function absoluteBounds( node:Element ) {\n\tlet box = relativeBounds( node );\n\n\tbox.top += document.body.scrollTop || document.documentElement.scrollTop;\n\tbox.bottom += document.body.scrollTop || document.documentElement.scrollTop;\n\tbox.left += document.body.scrollLeft || document.documentElement.scrollLeft;\n\tbox.right += document.body.scrollLeft || document.documentElement.scrollLeft;\n\n\treturn box;\n}\n","import { View } from \"@lernetz/ts-lib\";\nimport { parse } from 'regexparam';\nimport { IRoute, Router } from \"./Router\";\n\nexport interface ContentFactory {\n ( params: any, route: Route ): RouterContent;\n}\n\nexport interface RouteConfig {\n pattern: string,\n content: ContentFactory,\n caching?: boolean,\n name?: string;\n}\n\nexport class Route implements IRoute {\n\n readonly name: string;\n\n private pattern: Pattern;\n private content: ContentFactory;\n private caching: boolean;\n private cache: Map;\n\n constructor( config: RouteConfig ) {\n Object.assign( this, { caching: true, cache: new Map() }, config, { pattern: new Pattern( config.pattern ) } );\n }\n\n\n invoke( path: string, router: Router, restoreScroll:boolean ) {\n\n // check if there is a view already in the cache\n let content = ( this.caching && this.cache.get( path ) ) ? this.cache.get( path ) : this.content( this.pattern.params( path ), this );\n\n // store in cache\n if( content && this.caching ) this.cache.set( path, content );\n\n // create route content\n router.content = content;\n\n // set scrollpos\n router.scrollHistory.setPos( path, restoreScroll );\n\n // push history when go to a new path\n router.writeURL( path );\n }\n\n\n /**\n * Returns true if the given path matches this route definition\n * @param path The path to check\n */\n test( path ) {\n return this.pattern.test( path );\n }\n\n pathOf( params: {} ) {\n return this.pattern.pathOf( params );\n }\n}\n\n\ninterface RedirectAction {\n ( params: any, route: Redirect, router: Router ): void;\n}\n\nexport interface RedirectConfig {\n pattern: string,\n action: RedirectAction;\n}\n\nexport class Redirect implements IRoute {\n\n pattern: Pattern;\n action: RedirectAction;\n\n constructor( config: RedirectConfig ) {\n this.pattern = new Pattern( config.pattern );\n this.action = config.action;\n }\n\n test( path: string ): boolean {\n return this.pattern.test( path );\n }\n invoke( path: string, router: Router ) {\n this.action( this.pattern.params( path ), this, router );\n }\n pathOf( params: any ): string {\n return this.pattern.pathOf( params );\n }\n\n}\n\n\nexport class Pattern {\n\n private pattern: string;\n private matcher: { pattern: RegExp, keys: string[]; };\n\n constructor( pattern: string ) {\n this.matcher = parse( pattern );\n this.pattern = pattern;\n }\n\n /**\n * Tests if the given path matches this pattern\n * @param path The path to test\n */\n test( path: string ) {\n return this.matcher.pattern.test( path );\n }\n\n\n /**\n * Extract parameters based on this pattern of the given path\n * @param path the path to extract params\n */\n params( path ) {\n\n let i = 0, params = {};\n let matches = this.matcher.pattern.exec( path );\n while( i < this.matcher.keys.length ) {\n params[ this.matcher.keys[ i ] ] = matches[ ++i ] || null;\n }\n\n return params;\n }\n\n\n /**\n * Returns a path of this pattern with the given parameters\n * @param params The route pattern parameters\n */\n pathOf( params: {} ) {\n return this.pattern.replace( /(\\/:[^\\/]+|\\/\\*)/gm, ( s ) => {\n let key = s.replace( /\\/|:|\\?/gm, '' );\n return ( params[ key ] ) ? '/' + params[ key ] : '';\n } );\n }\n}\n","export interface ScrollPos {\n x:number,\n y:number\n}\n\n\n\nexport class ScrollHistory {\n\n private history:{[key:string]:ScrollPos} = {};\n target:Window | Element = window;\n\n constructor() {\n // make sure only we controll scroll pos.\n if (history.scrollRestoration) {\n history.scrollRestoration = 'manual';\n }\n }\n\n getPos( key:string ) {\n let t = this.target;\n this.history[ key ] = ( t instanceof Window ) ? { x:t.scrollX, y:t.scrollY } : { x:t.scrollLeft, y:t.scrollTop };\n }\n\n setPos( key, restore:boolean = false ) {\n let pos = ( restore && this.history[ key ] ) ? this.history[ key ] : { x:0, y:0 };\n this.target.scrollTo( pos.x, pos.y );\n }\n\n}\n","import { Model, View } from \"@lernetz/ts-lib\";\nimport template from './Router.html';\nimport { ScrollHistory } from \"./ScrollHistory\";\n\nexport class RouterView extends View {\n\n constructor( config?) {\n super( { data: new Router(), template, ...config } );\n\n this.registry.add( undefined, () => new View( { template: '' } ) );\n }\n\n init() {\n\n // inject router to view context\n this.context.router = this.data;\n\n // listen to history back events\n window.addEventListener( 'popstate', this.data.onPopState.bind( this.data ) );\n\n // render current active path\n this.data.toCurrentPath();\n }\n\n}\n\n\nexport interface IRoute {\n readonly name?: string;\n test( path: string ): boolean;\n invoke( path: string, router: Router, restoreScroll:boolean );\n pathOf( params: any ): string;\n}\n\nexport interface DefaultRouterContent {\n view: any;\n data: any;\n}\n\n\nexport class Router extends Model {\n\n protected routes: IRoute[];\n content: RouterContent;\n protected _current: {\n route: IRoute,\n path: string,\n };\n readonly scrollHistory:ScrollHistory;\n mode: RouterMode;\n notFound: ( path:string ) => void;\n\n constructor( config?: { mode?: RouterMode, routes?: IRoute[]; } ) {\n super( {\n content: { data: {} },\n _current: {},\n mode: new HistoryMode(),\n scrollHistory: new ScrollHistory(),\n routes: [],\n notFound: ( path ) => {\n console.log( 'Invalid path: ' + path );\n },\n ...config\n } );\n\n }\n\n\n /**\n * Navigates to the given path and shows the correspondoing content and pushes the path into the history\n * @param path the new path to go to\n */\n toPath( path: string, restoreScroll:boolean = false ) {\n\n // check for missing starting /\n if( path[ 0 ] != '/' ) path = '/' + path;\n\n // search over all routes for matches\n for( const route of this.routes ) {\n\n // check if current route matches\n if( route.test( path ) ) {\n\n // store old scrollpos\n this.scrollHistory.getPos( this._current.path );\n\n // set new current path\n this._current = { route, path };\n\n // invoke route action\n route.invoke( path, this, restoreScroll );\n\n // inform that the current path has changed\n this.propertyChange.dispatch( { name: 'current' } );\n\n // dont invoke another router after first match\n return;\n }\n }\n\n this.notFound( path );\n }\n\n /**\n * Navigates to a route with the given name and generates the path based on the given parameters\n * @param name The name of the route\n * @param params The parameters for the route\n */\n toRoute( name: string, params: any = {} ) {\n\n // search for route with name\n let found = this.routes.find( r => r.name == name );\n\n if( found ) this.toPath( found.pathOf( params ) );\n }\n\n /**\n * Returns the absolute url of a route\n * @param name The name of the route\n * @param params Any parameters for the route\n */\n urlOf( name:string, params: any = {} ) {\n\n // search for route with name\n let found = this.routes.find( r => r.name == name ) as IRoute;\n\n if( !found ) return;\n\n return this.mode.getURL( found.pathOf( params ) );\n }\n\n\n\n /**\n * Callback when the browser navigates in the history states\n * @param e The event\n */\n onPopState( e: PopStateEvent ) {\n //The event happens after the new location has loaded\n // so we can simply load the current location\n this.toPath( this.mode.readURL(), true );\n }\n\n /**\n * Navigates to the current path in the URL\n */\n toCurrentPath() {\n this.toPath( this.mode.readURL() );\n }\n\n /**\n * Writes the given path in the URL without changing any views\n * @param path the new path to be written\n */\n writeURL( path: string ) {\n this.mode.writeURL( path );\n }\n\n /**\n * Reads the current path from the URL\n */\n readURL(): string {\n return this.mode.readURL();\n }\n\n /**\n * Adds a new Route definition\n * @param config\n */\n add( route:IRoute ) {\n this.routes.push( route );\n }\n\n /**\n * Gets the current route/path object\n */\n get current():{ route: IRoute, path: string } {\n return this._current;\n }\n}\n\n\n\n\n\n\nexport interface RouterMode {\n /**\n * Updates the URL in the browser\n * @param path The new path to store in history\n */\n writeURL( path: string );\n\n\n /**\n * Reads the browser URL and returns the current path\n */\n readURL(): string;\n\n /**\n * Returns the full url of a path\n */\n getURL( path:string ):string;\n}\n\n\n\n\nexport class HistoryMode implements RouterMode {\n\n base: string;\n query: string;\n hash: string;\n\n constructor( config?: { base: string; } ) {\n Object.assign( this, { base: window.location.origin, query: window.location.search, hash: window.location.hash }, config );\n }\n\n /**\n * Stores the new path into the browser history\n * @param path The new path to store/write\n */\n writeURL( path: string ) {\n let currentPath = window.location.href;\n let newPath = this.getURL( path );\n\n // only push if current path is different\n if( newPath != currentPath ) history.pushState( {}, '', newPath );\n }\n\n /**\n * Reads the browser url pathname and subtracts the base path\n */\n readURL() {\n // get url without query/hash\n let url = window.location.origin + window.location.pathname;\n return ( url.indexOf( this.base, 0 ) === 0 ) ? url.substr( this.base.length ) : url;\n }\n\n\n /**\n * Returns the full url of a path\n */\n getURL( path:string ) {\n return this.base + path + this.query + ( this.hash ? this.hash : '' );\n }\n}\n\n/**\n * Writes / reads the path from the URL hash\n */\nexport class HashMode implements RouterMode {\n\n writeURL( path: string ) {\n\n let currentPath = window.location.href;\n let newPath = this.getURL( path );\n\n // only push if current path is different\n if( newPath != currentPath ) history.pushState( {}, '', newPath );\n }\n\n readURL(): string {\n return window.location.hash.substring( 1 );\n }\n\n getURL(path: string): string {\n return window.location.href.split( \"#\" )[ 0 ] + \"#\" + path;\n }\n\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { Model, View } from \"@lernetz/ts-lib\";\nimport { Pattern } from \"../router/Route\";\nimport { DefaultRouterContent, IRoute, Router } from \"../router/Router\";\n\nimport template from './Stack.html';\n\nexport class StackView extends View {\n constructor( config?) {\n super( { template, ...config } );\n }\n}\n\n\nexport class Stack extends Model {\n\n private stack: Segment[];\n\n readonly route: StackRoute;\n\n root: Segment;\n\n constructor( config: { pattern: string, root: Segment, name?: string; } ) {\n super( {} );\n this.route = new StackRoute( { pattern: config.pattern, name: config.name, stack: this } );\n\n this.stack = [];\n this.root = config.root;\n }\n\n\n async invoke( fullPath: string ) {\n\n // get all segments as array\n let params = this.route.params( fullPath );\n let urlSegments = params?.wild ? params.wild.split( '/' ) : [];\n\n\n // check every index of segments if url and stack match\n for( var index = 0; index < Math.min( this.stack.length, urlSegments.length ); index++ ) {\n if( this.stack[ index ].url != urlSegments[ index ] ) break;\n }\n\n // cut stack to matching index\n // start resolving for latest matching segment\n this.stack.splice( index );\n\n // cut url segments to start resolving from the sgements after the match\n urlSegments = urlSegments.slice( index );\n\n // load resuming segments of path\n for( const urlSeg of urlSegments ) {\n let s = await this.top.resolve( urlSeg );\n if( s ) this.stack.push( s );\n }\n\n // inform that the top has changed\n this.propertyChange.dispatch( { name:'top' } );\n }\n\n get top(): Segment {\n return this.stack.length == 0 ? this.root : this.stack[ this.stack.length - 1 ];\n }\n\n get segments() {\n return this.stack.slice();\n }\n\n /**\n * Pushes a new segment on top of the stack\n * @param s The new segment\n */\n push( s: Segment ) {\n this.set( [ ...this.stack, s ] );\n }\n\n /**\n * Removes the last / top segment on the stack\n */\n pop(): Segment {\n // do not pop root element\n if( this.stack.length == 0 ) return;\n\n this.set( this.stack.slice( 0, -1 ), true );\n }\n\n /**\n * Travels back in stack to the given segment\n * @param s the target segment\n */\n to( s: Segment ) {\n let index = this.stack.indexOf( s );\n if( index >= 0 ) {\n this.set( this.stack.splice( index ) );\n }\n }\n\n /**\n * Sets the stack with the given segments\n */\n set( segments: Segment | Segment[], restoreScroll = false ) {\n\n if( !Array.isArray( segments ) ) segments = [ segments ];\n\n this.route.router.toPath( this.route.segmentsPath( segments ), restoreScroll );\n }\n\n}\n\n\n\nexport interface Segment {\n resolve( urlSegment: string ): Promise;\n readonly url: string;\n readonly view: any,\n readonly data: any,\n}\n\n\n/**\n * A base class for segments that represents a model\n */\nexport class ModelSegment implements Segment {\n\n\n constructor( public model: T ) {\n }\n\n resolve( childSegment: string ): Promise {\n throw new Error( \"Method not implemented.\" );\n }\n\n get view() {\n return this.model[ 'modelName' ];\n }\n\n get url() {\n return this.model[ 'id' ];\n }\n\n get data() {\n return this.model;\n }\n}\n\n\n/**\n * Inner class that handles route logic for the router.\n */\nclass StackRoute implements IRoute {\n\n private pattern: Pattern;\n private content: { view: string, data: Stack; };\n\n router: Router;\n name: string;\n\n constructor( config: { pattern: string, name?: string, stack: Stack; } ) {\n this.pattern = new Pattern( config.pattern );\n this.content = { view: 'Stack', data: config.stack };\n this.name = config.name;\n }\n\n test( path: string ): boolean {\n return this.pattern.test( path );\n }\n async invoke( path: string, router: Router, restoreScroll:boolean ) {\n\n this.router = router;\n router.content = this.content;\n\n await this.stack.invoke( path );\n\n // set scrollpos\n router.scrollHistory.setPos( path, restoreScroll );\n this.router.writeURL( this.pathOf() );\n }\n pathOf( params?: any, ): string {\n return this.segmentsPath( this.stack.segments );\n }\n params( fullPath: string ) {\n return this.pattern.params( fullPath ) as { wild: string; };\n }\n\n segmentsPath( segments:Segment[] ) {\n return this.pattern.pathOf( { '*': segments.map( s => s.url ).join( '/' ) } );\n }\n\n get stack() {\n return this.content.data;\n }\n}\n\n\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { Model, Repeat } from \"@lernetz/ts-lib\";\nimport { observeProperties } from \"@lernetz/ts-lib/src/Observer\";\nimport { View, ViewConfig } from \"@lernetz/ts-lib/src/view/View\";\nimport template from \"./Carousel.html\";\n\nexport interface CarouselConfig {\n currentItem:object;\n items?:object[];\n}\n\nexport class Carousel extends Model {\n\n public currentItem:object;\n public items: object[];\n\n public constructor( config?:CarouselConfig ) {\n super( { currentItem: null, items: [], ...config } );\n\n observeProperties( this, 'currentItem', 'items' );\n this.propertyChange.filter( p => p.name === 'items' ).subscribe( () => {\n this.currentItem = this.items?.length ? this.items[0] : null;\n });\n }\n\n next() {\n this.currentItem = this.items[ ( this.currentItemIndex + 1 ) % this.items.length ];\n }\n\n previous() {\n this.currentItem = this.items[ ( this.items.length + this.currentItemIndex - 1 ) % this.items.length ];\n }\n\n protected get currentItemIndex() {\n return this.items.indexOf( this.currentItem );\n }\n}\n\nexport class CarouselView extends View {\n\n public constructor( config?:ViewConfig ) {\n super( { data: new Carousel(), template, ...config } );\n\n this.registry.add( 'Repeat', () => new Repeat() );\n }\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { Carousel as BaseCarousel, CarouselView as BaseCarouselView } from \"@lernetz/ui-components/src/carousel/Carousel\";\nimport { View, ViewConfig } from \"@lernetz/ts-lib/src/view/View\";\nimport template from \"./Carousel.html\";\nimport imageTemplate from \"./Image.html\";\nimport leftTemplate from \"./leftTemplate.html\";\nimport rightTemplate from \"./rightTemplate.html\";\nimport {Image} from './../image/Image';\n\nexport class Carousel extends BaseCarousel {\n constructor(dto) {\n super();\n this.items = dto.images;\n this.currentItem = dto.images[0];\n }\n}\n\nexport class CarouselView extends BaseCarouselView {\n\n\n constructor( config?: ViewConfig ) {\n super( { ...config, template } );\n this.registry.add('ControlLeft', () => new View({template: leftTemplate }) );\n this.registry.add('ControlRight', () => new View({template: rightTemplate }) );\n this.registry.add(Image, () => new View({template: imageTemplate }) );\n\n }\n\n init() {\n\n // this.data.propertyChange.filter( arg => arg.name == 'currentItem' ).subscribe( () => {\n // this.resizeHeight();\n // } );\n //\n // this.resizeHeight();\n\n }\n\n private resizeHeight() {\n setTimeout( () => {\n const imageNode = this.node.querySelector( '.content img' ) as HTMLImageElement;\n const contentNode = this.node.querySelector( '.content' ) as HTMLElement;\n contentNode.style.height = `${imageNode.getBoundingClientRect().height}px`;\n }, 1000 );\n\n }\n\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","// Module\nvar code = \"\";\n// Exports\nexport default code;","// Module\nvar code = \" \";\n// Exports\nexport default code;","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { Model } from '@lernetz/ts-lib';\nimport { View, ViewConfig } from '@lernetz/ts-lib/src/view/View';\nimport { route } from '@lernetz/ts-lib/src/Setup';\nimport template from './Iframely.html';\n\nexport interface IframelyConfig {\n route?:string;\n url:string;\n}\n\nexport class Iframely extends Model {\n\n public readonly route:string;\n public readonly url:string;\n\n public fallbackUrl:string;\n\n public constructor( config?:IframelyConfig ) {\n super( { fallbackUrl:null, route:'iframely', ...config } );\n }\n}\n\nexport class IframelyView extends View {\n\n private html:string;\n\n public constructor( config?:ViewConfig ) {\n super( { template, ...config } );\n }\n\n async init() {\n if( !this.html ) {\n const iframelyResult = await route( this.data.route, this.data ).load();\n this.html = iframelyResult[ 'html' ];\n }\n\n if (this.html) {\n this.node.innerHTML = this.html;\n }\n else {\n this.data.fallbackUrl = this.data.url;\n }\n }\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { View, ViewConfig } from '@lernetz/ts-lib/src/view/View';\nimport { Iframely, IframelyView } from '@lernetz/ui-components/src/iframely/Iframely';\nimport template from './DecoratedIframely.html';\n\nimport baseIframeTemplate from \"./Iframely.html\";\n\nexport class DecoratedIframely extends Iframely {\n\n caption: string;\n widthStyle: string;\n\n public constructor( dto ) {\n super( dto );\n }\n\n}\n\nexport class DecoratedIframelyView extends View {\n\n public constructor( config?: ViewConfig ) {\n super( { template, ...config } );\n this.registry.add( 'Iframely', () => new IframelyView({ template: baseIframeTemplate}) );\n }\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { View } from \"@lernetz/ts-lib\";\nimport { translate } from \"@lernetz/ts-lib/src/Lang\";\nimport { Image as BaseImage } from \"@lernetz/ui-components/src/image/Image\";\nimport template from './Image.html';\n\nexport class Image extends BaseImage {\n\n caption: string;\n image: any;\n widthStyle: any;\n preset: string = 'large';\n\n constructor( dto ) {\n super( dto );\n }\n\n get height() {\n return this.image.height;\n };\n get width() {\n return this.image.width;\n }\n\n}\n\nexport class ImageView extends View {\n\n constructor() {\n super( {\n template: template\n } );\n }\n\n init() {\n if( !this.data.image ) {\n let message = translate( 'no-image' );\n this.node.querySelector( 'img' ).setAttribute( 'src', 'https://via.placeholder.com/960x540.png?text=' + message );\n }\n }\n\n}\n","// Module\nvar code = \" [[ caption ]] \";\n// Exports\nexport default code;","import { Model, View } from \"@lernetz/ts-lib\";\n\nimport template from './MaterialList.html';\nimport downloadTemplate from './Download.html';\nimport linkTemplate from './Link.html';\n\n\nexport class MaterialList extends Model {\n\n elements: Model[];\n}\n\nexport class MaterialListView extends View {\n\n constructor() {\n super( { template: template } );\n\n this.registry.add( 'App\\\\Download', () => new View( { template: downloadTemplate } ) );\n this.registry.add( 'App\\\\Link', () => new View( { template: linkTemplate } ) );\n }\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","// Module\nvar code = \" \";\n// Exports\nexport default code;","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { View } from '@lernetz/ts-lib/src/view/View';\nimport { Model } from '@lernetz/ts-lib';\nimport template from './Paragraph.html';\n\nexport class Paragraph extends Model {\n\n text: string;\n widthStyle: string;\n fontStyle: string;\n}\n\nexport class ParagraphView extends View {\n\n constructor() {\n super( { template: template } );\n }\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","import {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./PersonalImpact.html\";\nimport imageTemplate from \"./visual/image.html\";\nimport {Image} from \"../image/Image\";\n\nexport class PersonalImpactView extends View {\n constructor() {\n super({ template })\n this.registry.add(Image, () => new View({template: imageTemplate}));\n this.registry.add('empty', () => new View({template: ''}));\n }\n}\n\nexport class PersonalImpact extends Model {\n}\n","// Module\nvar code = \" [[ this.trans('personal-impact') ]]
[[personName]]
[[personInfo]]
[[url]] \";\n// Exports\nexport default code;","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { Model, View } from \"@lernetz/ts-lib\";\nimport template from \"./Podcast.html\";\n\nexport class PodcastView extends View {\n constructor() {\n super({template});\n }\n}\n\nexport class Podcast extends Model {\n public url: string;\n public selectors: string[];\n public imageUrl: string;\n episodes: any[];\n constructor(dto: any) {\n super(dto);\n }\n}\n","// Module\nvar code = \" [[episode.title]] [[episode.pubDate]]
[[episode.description]]
Your browser does not support the audio element. [[ this.trans('subscribe')]] \";\n// Exports\nexport default code;","import { Model, View, ViewConfig } from '@lernetz/ts-lib';\nimport template from './RawHtml.html';\n\nexport class RawHtml extends Model {\n\n public readonly caption: string;\n public readonly html: string;\n public readonly widthStyle: string;\n\n public constructor( dto ) {\n super( dto );\n this.caption = dto.caption;\n this.html = dto.html;\n this.widthStyle = dto.widthStyle || '';\n\n this.html = this.html.replace( /\\>\\s+\\<' ).replace( /^\\s+|\\s+$/g, '' );\n }\n}\n\nexport class RawHtmlView extends View {\n\n public constructor( config?: ViewConfig ) {\n super( { template, ...config } );\n }\n}\n","// Module\nvar code = \"\";\n// Exports\nexport default code;","import {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./related-content.component.html\";\n\nexport class RelatedContentView extends View {\n constructor() {\n super({ template });\n }\n}\n\nexport class RelatedContent extends Model {\n constructor(dto) {\n super(dto);\n }\n}\n","// Module\nvar code = \" \";\n// Exports\nexport default code;","import { View } from '@lernetz/ts-lib/src/view/View';\nimport { Model } from '@lernetz/ts-lib';\n\nimport template from './Title.html';\n\nexport class Title extends Model {\n\n title: string;\n level: number;\n}\n\n\nexport class TitleView extends View {\n\n constructor() {\n super( { template: template } );\n }\n\n}\n","// Module\nvar code = \"<div> <div view=\\\"Heading\\\" data-html=\\\"[[ title ]]\\\" data-level=\\\"[[ level ]]\\\"></div> </div> \";\n// Exports\nexport default code;","import {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./Toggle.html\"\n\nexport class ToggleView extends View {\n constructor() {\n super({ template })\n }\n}\n\nexport class Toggle extends Model {\n constructor(dto) {\n super(dto);\n }\n}\n","// Module\nvar code = \"<div aria-label=\\\"[[ this.trans('toggle-element') ]]\\\" alt=\\\"[[ this.trans('toggle-element') ]]\\\" title=\\\"[[ this.trans('toggle-element') ]]\\\"> <div class=\\\"flex flex-col p-4 border-t border-b\\\"> <button role=\\\"button\\\" aria-label=\\\"[[ this.trans('click-to-open-element') ]]\\\" alt=\\\"[[ this.trans('click-to-open-element') ]]\\\" title=\\\"[[ this.trans('click-to-open-element') ]]\\\" class=\\\"flex justify-between items-center text-2xl font-semibold cursor-pointer hover:italic\\\" on-click=\\\"[[ open = !open]]\\\"> <div class=\\\"text-left\\\">[[ title ]]</div> <svg view=\\\"Icon\\\" class=\\\"w-6 h-6 fixedwith-svgicon\\\" data-name=\\\"icon-arrow-[[ open ? 'up' : 'down' ]]\\\"></svg> </button> <div view=\\\"Show\\\" data-if=\\\"[[ open ]]\\\" aria-live=\\\"polite\\\"> <div>[[ text ]]</div> <div view=\\\"Repeat\\\" data-items=\\\"[[ content_elements]]\\\" data-as=\\\"element\\\" class=\\\"mt-4 leading-relaxed\\\"> <div view=\\\"[[ element ]]\\\" data=\\\"[[ element ]]\\\"></div> </div> </div> </div> </div> \";\n// Exports\nexport default code;","import {ModelSegment} from \"@lernetz/ui-components/src/stack/Stack\";\nimport {WizardQuestion} from \"./wizard.model\";\n\nexport class WizardSegment extends ModelSegment {\n constructor(model: WizardQuestion) {\n super(model);\n }\n get view() {\n return \"Wizard\";\n }\n async resolve(urlSegment: string) {\n\n function compareAnswerIdToUrlSegment(answer) {\n try {\n if (answer.action) {\n return answer.action.id === urlSegment;\n }\n } catch (error) {\n console.log(error);\n console.log(\"error with comparing the segment\");\n console.log(\"urlSegment: \" + urlSegment );\n console.log(\"answser.action.id: \" + answer.action.id );\n }\n return null;\n }\n\n const followUpQuestion = this.data.answers.find( compareAnswerIdToUrlSegment ).action;\n followUpQuestion.level = this.model.level + 1;\n return new WizardSegment(followUpQuestion);\n\n }\n}\n","import {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./infobox.component.html\";\n\nexport class InfoboxView extends View {\n constructor() {\n super({template})\n }\n}\n\nexport class Infobox extends Model {\n}\n","// Module\nvar code = \"<div aria-label=\\\"[[ this.trans('infobox-element') ]]\\\" alt=\\\"[[ this.trans('infobox-element') ]]\\\" title=\\\"[[ this.trans('infobox-element') ]]\\\" class=\\\"my-12 md:my-16\\\"> <div class=\\\"w-20 h-2.5 bg-yellow mb-3\\\"></div> <div view=\\\"Html\\\" data-html=\\\"[[ info ]]\\\" class=\\\"infobox-content text-xl text-grey_4\\\">[[info]]</div> </div> \";\n// Exports\nexport default code;","import {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./quote.component.html\";\n\nexport class QuoteView extends View {\n constructor() {\n super({template})\n }\n}\n\nexport class Quote extends Model {\n}\n","// Module\nvar code = \"<div aria-label=\\\"[[ this.trans('quote-element') ]]\\\" alt=\\\"[[ this.trans('quote-element') ]]\\\" title=\\\"[[ this.trans('quote-element') ]]\\\" class=\\\"flex flex-col items-baseline my-12 md:px-24 md:my-16\\\"> <div class=\\\"text-[26px] italic font-medium mb-4\\\">«[[quote]]»</div> <div class=\\\"font-mono text-active\\\">[[person]]</div> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport template from \"./author-info.component.html\";\n\nexport class AuthorCardView extends View {\n constructor() {\n super({ template });\n }\n};\n","// Module\nvar code = \"<div class=\\\"flex\\\"> <div class=\\\"mr-8\\\"> <div class=\\\"relative rounded-full overflow-hidden w-36\\\"> <img class=\\\"object-cover h-36 w-full\\\" view=\\\"Image\\\" aria-label=\\\"[[ name ]]\\\" alt=\\\"[[ name ]]\\\" title=\\\"[[ name ]]\\\" data-route=\\\"asset\\\" data-preset=\\\"medium\\\" data-file_name=\\\"[[ image.file_name ]]\\\" data-ext=\\\"[[ image.ext ]]\\\"/> </div> </div> <div> <div class=\\\"mb-4 text-xl font-semibold leading-relaxed\\\">[[ name ]]</div> <div class=\\\"leading-relaxed\\\">[[ description ]]</div> </div> </div> \";\n// Exports\nexport default code;","import {ViewRegistry} from \"@lernetz/ts-lib\"\nimport {Route} from \"@lernetz/ui-components/src/router/Route\";\nimport {UiModule} from \"../core/interface\";\nimport {AuthorCardView} from \"../pages/good-practice/details/author-info.component\";\nimport {gateway} from \"../services/gateway\";\nimport {trackEvent} from \"../services/tracker\";\nimport {Infobox, InfoboxView} from \"./components/article/infobox.component\";\nimport {Quote, QuoteView} from \"./components/article/quote.component\"\n\nconst views = new ViewRegistry()\nviews.add(Quote, () => new QuoteView());\nviews.add(Infobox, () => new InfoboxView());\nviews.add(\"AuthorCard\", () => new AuthorCardView());\n\nconst GoodPracticeModule: UiModule = {\n views,\n routes: [\n new Route({\n name: \"good-practice-details\",\n pattern: \"/:lang/good-practice/:id\",\n content: (params, route) => {\n let data = {} as any;\n gateway.goodPracticeGateway.get(params.id).then( goodPractice => {\n data.goodPractice = {\n ...goodPractice,\n headerAuthors: goodPractice.authors.filter( (author: any) => !author.hideInHeader)\n };\n trackEvent('good-practice-details', { goodPractice: goodPractice.title})\n });\n return {\n view: \"GoodPracticeDetailsPage\",\n data,\n };\n },\n }),\n new Route({\n name: \"good-practice\",\n pattern: \"/:lang/good-practice\",\n content: (params, route) => {\n let data = {} as any;\n gateway.goodPracticeGateway.find().then( goodPractices => {\n data.goodPractices = goodPractices\n });\n return {\n view: \"GoodPracticePage\",\n data,\n };\n },\n }),\n ]\n}\n\nexport default GoodPracticeModule\n","import {Model, View} from \"@lernetz/ts-lib\";\nimport {gateway} from \"../services/gateway\";\nimport {languageService} from \"../services/lang\";\nimport {router} from \"../services/router\";\nimport template from \"./Home.html\";\n\nexport class HomeView extends View {\n constructor() {\n super({ template, data: new HomeController() });\n }\n\n}\n\nexport class HomeController extends Model {\n topics: any;\n feeds: any;\n activeTopic: any;\n items: [];\n currentLang: any;\n\n applyFilter(tag) {\n this.activeTopic !== tag ? this.activeTopic = tag : this.activeTopic = false;\n this.updateUrl();\n if (this.activeTopic) {\n this.loadItems();\n } else {\n this.items = null;\n }\n }\n\n init() {\n this.currentLang = languageService.currentLang;\n gateway.loadTopics().then(topics => {\n this.topics = topics\n this.activeTopic = this.parseParams();\n if (this.activeTopic) {\n this.loadItems();\n }\n });\n gateway.toolGateway.feed().then( tools => {\n this.feeds = tools\n });\n }\n\n loadItems() {\n gateway.toolGateway\n .loadFilteredTools(this.createParams(this.activeTopic))\n .then((tools) => (this.items = tools));\n }\n\n private updateUrl() {\n const params = this.createParams(this.activeTopic);\n const newUrl = params ? `/${this.currentLang}/home/${params}` : '/';\n router.writeURL(newUrl);\n }\n\n private createParams(filters) {\n const paramParts = [];\n if (filters) {\n paramParts.push(`tags=${filters.slug}`);\n }\n const paramsUrl = paramParts.length ? `?${paramParts.join(\"&\")}` : \"\";\n return paramsUrl;\n }\n\n private parseParams() {\n const searchParams = new URLSearchParams(window.location.search);\n const tag = searchParams.has(\"tags\") ? searchParams.get(\"tags\") : null\n return this.activeTopic = this.topics.tags.find( t => t.slug === tag)\n }\n}\n","// Module\nvar code = \"<div class=\\\"w-full\\\"> <div class=\\\"w-full min-h-[320px] h-[45vh] flex items-center bg-cover bg-center\\\" style=\\\"background-image:url('/static/banner-reduced.jpg')\\\"> <h1 class=\\\"items-center w-full p-6 mx-auto text-6xl italic font-bold text-white md:p-16 md:text-8xl max-w-screen-xl\\\"> let’s teach </h1> </div> <article id=\\\"maincontent\\\" class=\\\"px-8 py-16 mx-auto max-w-screen-xl\\\"> <div id=\\\"searchrow\\\" class=\\\"py-8 border-b-2 border-grey_2\\\" view=\\\"SearchRow\\\"></div> <div class=\\\"py-8 border-b-2 border-grey_2\\\" view=\\\"Topics\\\" data-topics=\\\"[[topics.tags]]\\\" data-name=\\\"[[topics.name]]\\\" data-active=\\\"[[ activeTopic ]]\\\" on-choice=\\\"[[applyFilter(event)]]\\\"></div> <div view=\\\"Show\\\" data-if=\\\"[[ items && items.length ]]\\\"> <div aria-live=\\\"polite\\\" view=\\\"CardList\\\" data-tools=\\\"[[ items ]]\\\" data-title=\\\"[[ items.length ]] [[this.trans('results')]]\\\" data-label=\\\"[[ this.trans('filtered-tool-list')]]\\\" class=\\\"mb-xxl\\\"></div> </div> <div view=\\\"Repeat\\\" data-items=\\\"[[ feeds ]]\\\" data-as=\\\"feed\\\"> <div view=\\\"CardList\\\" data-tools=\\\"[[ feed.tools ]]\\\" data-title=\\\"[[ feed.title ]]\\\" class=\\\"mt-8 mb-24\\\"></div> </div> </article> <div view=\\\"Footer\\\"></div> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {languageService} from \"../services/lang\";\nimport template from \"./Missing.html\"\n\nexport class MissingPageView extends View {\n constructor() {\n super({template})\n }\n}\n\nexport class MissingPageController {\n currentLang: any;\n init() {\n this.currentLang = languageService.currentLang;\n }\n}\n","// Module\nvar code = \"<div class=\\\"w-full\\\"> <div class=\\\"w-full px-8 mx-auto max-w-screen-xl\\\"> <h1 class=\\\"mt-8 mb-8 italic font-bold md:mt-32 text-myh1\\\">[[ this.trans('missingTitle')]]</h1> <div class=\\\"md:grid md:grid-cols-2 gap-8\\\"> <div class=\\\"mb-8\\\"> <img src=\\\"/static/404.gif\\\"/> </div> <div class=\\\"text-xl leading-[1.8]\\\"> <p class=\\\"mb-4 text-2xl font-semibold\\\">[[ this.trans('missingText-1')]]</p> <p class=\\\"mb-4\\\">[[ this.trans('missingText-2')]]</p> <p class=\\\"mb-4\\\">[[ this.trans('missingText-3')]]</p> <button on-click=\\\"[[ this.router.toRoute('search', {lang: currentLang})]]\\\" class=\\\"flex w-full md:w-fit md:pr-32 text-xl black text-black py-2.5 border-[3px] border-black relative my-8\\\"> <svg class=\\\"w-6 h-6 mx-5 shrink-0\\\" view=\\\"Icon\\\" data-name=\\\"icon-lupe\\\"></svg> <span class=\\\"overflow-x-hidden whitespace-nowrap overflow-ellipsis\\\">Tools, Methoden, Good Practices, ...</span> </button> <div class=\\\"flex-1\\\"></div> <button on-click=\\\"[[ this.router.toRoute('wizard', {lang: currentLang})]]\\\" class=\\\"flex text-white py-3.5 px-5 bg-black rounded-full text-xl font-medium buttonsuchhilfedefault my-8 hover:italic group\\\"> <svg class=\\\"mr-5 w-7 h-7 block group-hover:hidden\\\" view=\\\"Icon\\\" data-name=\\\"icon-zauberstab-side\\\"></svg> <svg class=\\\"mr-5 w-7 h-7 hidden group-hover:block\\\" view=\\\"Icon\\\" data-name=\\\"icon-zauberstab-side-hover\\\"></svg> <div>[[ this.trans('wizardStart') ]]</div> </button> </div> </div> </div> </div> \";\n// Exports\nexport default code;","import {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./column-layout.component.html\";\n\n\nexport class ColumnLayoutView extends View {\n constructor() {\n super({template});\n }\n}\n\nexport class ColumnLayout extends Model {\n}\n","// Module\nvar code = \"<div> <div view=\\\"Repeat\\\" data-items=\\\"[[columns]]\\\" data-as=\\\"column\\\" class=\\\"mt-16 md:flex md:space-x-6\\\"> <div view=\\\"[[ column ]]\\\" data=\\\"[[ column]]\\\" class=\\\"flex-[[column.width]]\\\"></div> </div> </div> \";\n// Exports\nexport default code;","\nimport {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./column.component.html\";\n\n\nexport class ColumnView extends View {\n constructor() {\n super({template});\n }\n}\n\nexport class Column extends Model {\n}\n","// Module\nvar code = \"<div> <div class=\\\"md:-mt-16\\\" view=\\\"Repeat\\\" data-items=\\\"[[content_elements]]\\\" data-as=\\\"element\\\"> <div class=\\\"md:first:mt-16\\\" view=\\\"[[element]]\\\" data=\\\"[[ element ]]\\\"></div> </div> </div> \";\n// Exports\nexport default code;","import {Model, View} from \"@lernetz/ts-lib\";\nimport template from \"./contact.component.html\";\n\nexport class ContactView extends View {\n constructor() {\n super({template});\n }\n}\n\nexport class Contact extends Model {\n}\n","// Module\nvar code = \"<div> <img class=\\\"object-cover w-full my-6 h-60\\\" src=\\\"[[ this.setup.route('asset', { preset:'large', ext:image.ext, file_name:image.file_name }).url() ]]\\\"/> <div class=\\\"mt-6 mb-4 text-xl font-semibold leading-relaxed\\\">[[ name ]]</div> <div class=\\\"mb-4 tt-para\\\">[[ shortText ]]</div> <a href=\\\"mailto:[[ email ]]\\\" class=\\\"flex items-center mb-2 space-x-4 group\\\"> <svg view=\\\"Icon\\\" data-name=\\\"icon-mail\\\" class=\\\"w-5 h-5 shrink-0\\\"></svg> <div class=\\\"group-hover:italic group-hover:text-active\\\">[[ email ]]</div> </a> <a href=\\\"[[ link.link.url ]]\\\" target=\\\"_blank\\\" class=\\\"flex items-center mb-4 space-x-4 group\\\"> <svg view=\\\"Icon\\\" data-name=\\\"icon-[[ link.icon]]\\\" class=\\\"w-5 h-5 shrink-0\\\"></svg> <div class=\\\"group-hover:italic group-hover:text-active\\\">[[ link.link.text ]]</div> </a> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {gateway} from \"../../services/gateway\";\nimport {ColumnLayout, ColumnLayoutView} from \"./article-elements/column-layout/column-layout.component\";\nimport {Column, ColumnView} from \"./article-elements/column-layout/column.component\";\nimport {Contact, ContactView} from \"./article-elements/contact/contact.component\";\nimport template from \"./generic.component.html\";\n\nexport class GenericPage extends View {\n constructor() {\n super({template});\n this.registry.add( Column, () => new ColumnView())\n this.registry.add( ColumnLayout, () => new ColumnLayoutView())\n this.registry.add( Contact, () => new ContactView())\n }\n}\n\nexport class GenericPageController {\n content: any;\n general: any;\n routeInit(slug: string) {\n gateway.loadPage(slug).then( res => {\n this.content = res;\n });\n gateway.loadGeneralInfos().then(generalInfos => {\n this.general = generalInfos;\n });\n }\n}\n","// Module\nvar code = \"<div class=\\\"\\\"> <article id=\\\"maincontent\\\" class=\\\"px-8 mx-auto max-w-screen-xl\\\"> <div class=\\\"py-20 [[ { 'hidden': content.slug !== 'contact' && content.slug !== 'kontakt'} ]]\\\"> <div class=\\\"\\\"> <h1 class=\\\"text-5xl italic font-bold mb-xl\\\">[[this.trans('contact')]]</h1> <div class=\\\"text-[2rem] font-semibold mb-8\\\"> <div view=\\\"Html\\\" data-html=\\\"[[ general.contactTitle ]]\\\" data-styles=\\\"[[ {} ]]\\\"></div> </div> <div class=\\\"pb-16 border-b-2 border-grey_2 md:grid md:grid-cols-3\\\"> <div class=\\\"mb-6 leading-7\\\"> <div view=\\\"Html\\\" data-html=\\\"[[ general.contactAddress ]]\\\" data-styles=\\\"[[ {} ]]\\\"></div> </div> <div class=\\\"leading-7\\\" view=\\\"Repeat\\\" data-items=\\\"[[general.contact_links]]\\\" data-as=\\\"contactLink\\\"> <a href=\\\"[[contactLink.link.url]]\\\" class=\\\"flex items-center\\\"><svg class=\\\"w-5 h-5 mr-4\\\" view=\\\"Icon\\\" data-name=\\\"icon-[[contactLink.icon]]\\\"></svg>[[contactLink.link.text]]</a> </div> </div> </div> </div> <div> <div view=\\\"Repeat\\\" data-items=\\\"[[content.content_elements]]\\\" data-as=\\\"element\\\"> <div view=\\\"[[ element ]]\\\" data=\\\"[[ element ]]\\\"></div> </div> </div> </article> <div view=\\\"Footer\\\"></div> </div> \";\n// Exports\nexport default code;","import {Model, View} from \"@lernetz/ts-lib\";\nimport {gateway} from \"../../services/gateway\";\nimport {paramService} from \"../../services/params.service\";\nimport {tagService} from \"../../services/tag.service\";\nimport template from \"./results.component.html\";\n\nexport class ResultPage extends View {\n constructor() {\n super({ template });\n }\n}\n\nexport class ResultPageController extends Model {\n tags: string[];\n tools: any;\n constructor(private currentLang: string) {\n super();\n }\n init() {\n gateway.loadFilters().then(filterCategories => {\n const tagSlugs = paramService.parseParams();\n this.tags = tagService.getActiveTagsFromParam(filterCategories, tagSlugs);\n this.loadItems();\n })\n }\n\n loadItems() {\n gateway.toolGateway\n .loadFilteredTools(paramService.createParams(this.tags))\n .then((tools) => (this.tools = tools));\n }\n}\n","// Module\nvar code = \"<div class=\\\"\\\"> <article id=\\\"maincontent\\\" class=\\\"px-8 mx-auto max-w-screen-xl\\\"> <div class=\\\"py-20\\\"> <h1 class=\\\"mb-8 italic font-bold tt-h1\\\">[[ this.trans('result-title') ]]</h1> </div> <div view=\\\"ActiveTags\\\" data-action=\\\"[[false]]\\\" data-active-filters=\\\"[[ tags ]]\\\"></div> <div view=\\\"CardList\\\" data-tools=\\\"[[ tools ]]\\\" data-label=\\\"\\\" class=\\\"mb-xxl\\\"></div> </article> <div view=\\\"Footer\\\"></div> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {gateway} from \"../../services/gateway\";\nimport {languageService} from \"../../services/lang\";\nimport {trackEvent} from \"../../services/tracker\";\nimport template from \"./search.html\";\n\nexport class SearchPage extends View {\n constructor() {\n super({ template });\n }\n\n init() {\n const el = this.node.querySelector('input#search') as HTMLInputElement;\n this.data.el = el;\n el.focus();\n el.addEventListener('input', (event: InputEvent) => {\n this.data.loading = true;\n this.data.search((event.target as HTMLInputElement).value);\n })\n }\n}\n\nexport class SearchPageController {\n searchResults: {\n tools: any;\n goodPractices: any;\n };\n currentLang: any;\n loading: boolean;\n el: HTMLInputElement;\n init() {\n this.currentLang = languageService.currentLang;\n }\n search(query) {\n this.loading = true;\n this.debouncedSearch(query);\n }\n overrideSearch(term) {\n this.el.value = term;\n this.search(term);\n }\n\n test() {\n // debugger;\n }\n\n debouncedSearch = debounce( (query) => {\n if (query) {\n gateway.search(query).then( res => {\n this.loading = false;\n this.searchResults = res;\n trackEvent('search', { query })\n });\n } else {\n this.searchResults = null;\n }\n })\n\n}\n\n\nconst debouncedTrack = debounce( (query) => {\n});\n\nfunction debounce(func, timeout = 800){\n let timer;\n return (...args) => {\n clearTimeout(timer);\n timer = setTimeout(() => { func.apply(this, args); }, timeout);\n };\n}\n","// Module\nvar code = \"<div class=\\\"w-full\\\"> <article id=\\\"maincontent\\\" class=\\\"flex flex-col items-baseline w-full px-8 mx-auto mt-16 max-w-screen-xl\\\"> <input autofocus id=\\\"search\\\" type=\\\"text\\\" aria-label=\\\"[[ this.trans('press-tab-to-jump-to-the-results') ]]\\\" class=\\\"w-full font-semibold placeholder-black border-0 outline-none tt-h1 overflow-ellipsis my-9 focus:placeholder-gray-400\\\" placeholder=\\\"[[this.trans('searchPlaceholder')]]\\\" on-input=\\\"[[ test() ]]\\\"> <hr role=\\\"presentation\\\" class=\\\"w-full border-2 border-black\\\"/> <div class=\\\"search-results\\\" aria-live=\\\"polite\\\"> <div view=\\\"Show\\\" data-if=\\\"[[ searchResults.tools]]\\\"> <h2 class=\\\"mt-8 -mb-8 font-semibold\\\">[[ searchResults.tools.length ]] [[this.trans('results') ]] in [[ this.trans('tools')]]</h2> <div view=\\\"CardList\\\" data-tools=\\\"[[ searchResults.tools ]]\\\" data-label=\\\"[[ this.trans('list-with-tool-results') ]]\\\" class=\\\"mb-xxl\\\"></div> </div> <div view=\\\"Show\\\" data-if=\\\"[[ searchResults.goodPractice]]\\\"> <h2 class=\\\"mt-8 -mb-8 font-semibold\\\">[[ searchResults.goodPractice.length ]] [[this.trans('results') ]] in [[ this.trans('good-practices')]]</h2> <div view=\\\"CardList\\\" data-tools=\\\"[[ searchResults.goodPractice ]]\\\" data-label=\\\"[[ this.trans('list-with-goodpractice-results') ]]\\\" class=\\\"mb-xxl\\\"></div> </div> </div> </article> </div> \";\n// Exports\nexport default code;","import { Model, View } from \"@lernetz/ts-lib\";\nimport { Subscription } from \"@lernetz/ts-lib/src/Signal\";\nimport { Image } from \"../../../components/article-elements/image/Image\";\nimport { gateway } from \"../../../services/gateway\";\nimport { trackEvent } from \"../../../services/tracker\";\nimport { getState } from \"../../../state\";\nimport { ToolModule } from \"../../../tool/tool.module\";\nimport template from \"./tool-details.view.html\";\n\nexport class ToolDetailsView extends View {\n constructor() {\n super({ template, registry: ToolModule.views });\n }\n}\n\nexport class ToolDetailsController extends Model {\n tool: any;\n infos: { metainfos: any; hint: { title: any; text: any }; downloads: any };\n listener: void;\n isSticky: any;\n scrollTopChangingPoint: number;\n scrollSubscription: Subscription;\n load(toolId) {\n gateway.toolGateway.get(toolId).then((tool) => {\n this.tool = tool;\n this.infos = {\n metainfos: tool.metainfos,\n hint: {\n title: tool.hintTitle,\n text: tool.hintText,\n },\n downloads: tool.downloads,\n };\n trackEvent(\"tool-details\", { tool: tool.title });\n });\n }\n init() {\n const globalState = getState();\n this.scrollSubscription = globalState.scroll.subscribe((event) => {\n if (window.matchMedia(\"(min-width: 1024px)\").matches) {\n const scrollContainer =\n document.getElementById(\"scroll-container\");\n const stickyBox = document.getElementById(\"sticky-box\");\n const extraInfoContainer = document.getElementById(\"extraInfo-container\");\n const { top: scrollContainerTop } =\n scrollContainer.getBoundingClientRect();\n const { top: stickyBoxTop , bottom: stickyBoxBottom} = stickyBox.getBoundingClientRect();\n const { top: extraInfoTop } = extraInfoContainer.getBoundingClientRect();\n if (!this.isSticky && stickyBoxTop < scrollContainerTop) {\n this.isSticky = true;\n const stickyBoxDistanceToTop =\n scrollContainerTop - stickyBoxTop;\n this.scrollTopChangingPoint =\n scrollContainer.scrollTop - stickyBoxDistanceToTop;\n stickyBox.classList.add(\"fixed\");\n stickyBox.classList.add(\"z-10\");\n stickyBox.classList.add(\"w-80\");\n stickyBox.style.top = `${scrollContainerTop}px`;\n } else if (\n this.isSticky &&\n scrollContainer.scrollTop < this.scrollTopChangingPoint\n ) {\n this.isSticky = false;\n stickyBox.classList.remove(\"fixed\");\n stickyBox.classList.remove(\"z-10\");\n stickyBox.classList.remove(\"w-80\");\n stickyBox.style.top = null;\n }\n const offset = 100;\n if (\n this.isSticky &&\n extraInfoTop < stickyBoxBottom + offset\n ) {\n stickyBox.classList.add(\"opacity-0\");\n stickyBox.classList.remove(\"opacity-100\");\n // stickyBox.classList.add(\"invisible\");\n } else if (\n this.isSticky &&\n extraInfoTop > stickyBoxBottom - offset\n ) {\n stickyBox.classList.add(\"opacity-100\");\n stickyBox.classList.remove(\"opacity-0\");\n // stickyBox.classList.remove(\"invisible\");\n }\n }\n });\n }\n deinit() {\n this.scrollSubscription.unsubscribe();\n }\n}\n","// Module\nvar code = \"<div class=\\\"w-full\\\"> <div class=\\\"relative\\\"> <img class=\\\"object-cover w-full h-96 brightness-90\\\" src=\\\"[[ this.setup.route('asset', { preset:'original', ext:tool.preview_image.ext, file_name:tool.preview_image.file_name }).url() ]]\\\" alt=\\\"\\\" role=\\\"presentation\\\"/> </div> <article aria-label=\\\"[[ this.trans('content-area-tools-detail-page') ]]\\\" id=\\\"maincontent\\\" class=\\\"px-8 mx-auto my-16 mb-6 lg:flex max-w-screen-xl md:space-x-16\\\"> <div class=\\\"w-full lg:w-1/4\\\"> <div aria-label=\\\"[[ this.trans('meta-information-box') ]]\\\" id=\\\"sticky-box\\\" class=\\\"p-4 mb-16 bg-white transition-opacity\\\" view=\\\"MetaInfos\\\" data-infos=\\\"[[infos]]\\\"></div> </div> <div class=\\\"lg:w-3/4 lg:ml-16\\\"> <h1 class=\\\"mb-16 overflow-hidden font-semibold leading-tight tt-h1 bottom-8 max-w-screen-xl text-ellipsis\\\"> [[ tool.title ]] </h1> <p class=\\\"font-semibold tt-h2 mb-16\\\">[[tool.lead]]</p> <div view=\\\"Repeat\\\" data-items=\\\"[[ tool.content_elements]]\\\" data-as=\\\"element\\\" class=\\\"text-xl\\\"> <div view=\\\"[[ element ]]\\\" data=\\\"[[ element ]]\\\"></div> </div> </div> </article> <div id=\\\"extraInfo-container\\\" view=\\\"Repeat\\\" data-items=\\\"[[ tool.extra_infos]]\\\" data-as=\\\"element\\\" class=\\\"\\\"> <div view=\\\"[[ element ]]\\\" data=\\\"[[ element ]]\\\"></div> </div> <div view=\\\"Footer\\\"></div> </div> \";\n// Exports\nexport default code;","import { Model, View } from \"@lernetz/ts-lib\";\nimport { gateway } from \"../../services/gateway\";\nimport { router } from \"../../services/router\";\nimport template from \"./tools.view.html\";\n\nimport { Tag, toggleFilter } from \"../../components/filter/filter.helpers\";\nimport {tagService} from \"../../services/tag.service\";\nimport {languageService} from \"../../services/lang\";\n\nexport class ToolsPageView extends View<ToolsPageController> {\n constructor() {\n super({ template });\n }\n}\n\nexport class ToolsPageController extends Model {\n canLoadMore: boolean;\n tools: any;\n topics: string | {};\n tags: string[];\n filters: string | {};\n activeFilters: any;\n currentLang: string;\n constructor(searchString: string) {\n super();\n }\n init() {\n this.currentLang = languageService.currentLang;\n gateway.loadTopics().then((topics) => (this.topics = topics));\n gateway.loadFilters().then((filterCategories) => {\n this.activeFilters = tagService.getActiveTagsFromParam(\n filterCategories,\n this.parseParams()\n );\n this.loadTools(this.activeFilters);\n this.filters = this.prepareFilters(\n filterCategories,\n this.activeFilters\n );\n });\n }\n\n private loadTools(activeFilters) {\n const searchParams = this.apiSearchParams(activeFilters);\n gateway.toolGateway\n .loadFilteredTools(searchParams)\n .then((tools) => (this.tools = tools));\n }\n\n private apiSearchParams(activeFilters) {\n if (!this.activeFilters.length) {\n this.canLoadMore = true;\n return \"?limit=9\";\n } else {\n return this.createParams();\n }\n }\n\n loadMore() {\n this.canLoadMore = false;\n gateway.toolGateway\n .loadFilteredTools(this.createParams())\n .then((tools) => (this.tools = tools));\n }\n\n private parseParams() {\n const searchParams = new URLSearchParams(window.location.search);\n return searchParams.has(\"tags\")\n ? searchParams.get(\"tags\").split(\",\")\n : null;\n }\n\n setActiveTags(tags: Tag[]) {\n this.activeFilters = tags;\n this.filters = this.prepareFilters(this.filters, this.activeFilters);\n this.loadTools(this.activeFilters);\n this.updateUri();\n }\n\n updateUri() {\n const params = this.createParams();\n const uri = params\n ? `/${this.currentLang}/tools/${params}` //`/${this.currentLang}/filter/tools/${params}`\n : `/${this.currentLang}/tools`;\n // router.writeURL(uri);\n // route writes url wrong with query params\n\n let currentPath = window.location.href;\n let url = new URL( currentPath );\n let newPath = `${url.origin}${uri}`;\n\n // only push if current path is different\n if( newPath != currentPath ) history.pushState( {}, '', newPath );\n }\n\n createParams() {\n const tagSlugs = this.activeFilters.map((f) => f.slug);\n return tagSlugs.length ? `?tags=${encodeURI(tagSlugs.join(\",\"))}` : \"\";\n }\n\n private prepareFilters(filterCategories, selectedTags) {\n const activeSlugs = selectedTags.map((tag) => tag.slug);\n\n const filters = filterCategories.map((filter) => {\n return {\n ...filter,\n tags: filter.tags.map((tag) => {\n return {\n active: activeSlugs.includes(tag.slug),\n ...tag,\n };\n }),\n };\n });\n return filters;\n }\n}\n\n\nclass FilterDropDown extends Model {\n constructor(dto) {\n super(dto);\n }\n}\n","// Module\nvar code = \"<div class=\\\"\\\"> <article id=\\\"maincontent\\\" class=\\\"px-8 mx-auto max-w-screen-xl\\\"> <div class=\\\"py-20\\\"> <h1 class=\\\"text-5xl italic font-bold mb-xl\\\">Tools</h1> <div class=\\\"text-3xl\\\"> [[this.trans('tool-lead')]] </div> </div> <div class=\\\"py-8 border-b-2 border-grey_2\\\"> <div view=\\\"Filter\\\" data-filters=\\\"[[ filters ]]\\\" data-active-tags=\\\"[[ activeFilters ]]\\\" data-tools=\\\"[[ data ]]\\\"></div> </div> <div view=\\\"CardList\\\" data-tools=\\\"[[ tools ]]\\\" data-label=\\\"\\\" class=\\\"mb-xxl\\\"></div> <div view=\\\"Show\\\" data-if=\\\"[[canLoadMore]]\\\" class=\\\"flex justify-center -mt-24\\\"> <button on-click=\\\"[[ loadMore() ]]\\\" class=\\\"mx-auto text-white bg-black rounded-full py-3.5 text-xl font-medium px-5\\\">[[ this.trans('loadMore') ]]</button> </div> </article> <div view=\\\"Footer\\\"></div> </div> \";\n// Exports\nexport default code;","import { Registry } from \"./Registry\";\n\n\nexport interface Transformation extends Registry<string, any, any> {\n transform( data:any ):any;\n}\n\n\nexport class Gateway {\n\n in:Transformation;\n out:Transformation;\n\n constructor( transformations:{ in?:Transformation, out?:Transformation } = {} ) {\n this.in = transformations.in ?? new InTransform();\n this.out = transformations.out ?? new OutTransform();\n }\n}\n\n\nexport interface KeyLookup {\n ( any ): string;\n}\n\n\nexport class InTransform extends Registry<string, any, any> implements Transformation {\n\n lookup: KeyLookup;\n\n constructor( lookup: KeyLookup = defaultLookup ) {\n super();\n this.lookup = lookup;\n }\n\n\n transform( data: any ) {\n\n // handle arrays\n if( Array.isArray( data ) ) {\n return data.map( item => this.transform( item ) );\n }\n\n // handle objects\n if( typeof data === 'object' && data !== null ) {\n\n let factory = this.get( this.lookup( data ) );\n\n Object.keys( data ).forEach( name => {\n data[ name ] = this.transform( data[ name ] );\n } );\n\n return ( factory ) ? factory( data ) : data;\n }\n\n return data;\n }\n}\n\n\n\nexport class OutTransform extends Registry<string, any, any> implements Transformation {\n\n lookup: KeyLookup;\n\n constructor( lookup: KeyLookup = defaultLookup ) {\n super();\n this.lookup = lookup;\n }\n\n transform( data: any ) {\n\n let factory = this.get( this.lookup( data ) );\n data = ( factory ) ? factory( data ) : data;\n\n // handle arrays\n if( Array.isArray( data ) ) {\n data = data.map( item => this.transform( item ) );\n }\n\n // handle objects\n if( typeof data === 'object' && data !== null ) {\n\n\n Object.keys( data ).forEach( name => {\n data[ name ] = this.transform( data[ name ] );\n } );\n }\n\n return data;\n }\n}\n\n\n\nfunction defaultLookup( d: any ) {\n return d?.modelName || 'default';\n}\n","import { Model } from \"@lernetz/ts-lib\";\nimport {languageService} from \"../../services/lang\";\nimport {paramService} from \"../../services/params.service\";\nimport { router, wizardStack, toRoute } from \"../../services/router\";\nimport { WizardSegment } from \"./wizard.segment\";\n\nexport class WizardQuestion extends Model implements IWizardQuestion {\n id: string;\n question: string;\n answers: IWizardAnswer[];\n level: any;\n activeTags = [];\n currentLang: any;\n constructor(dto) {\n super(dto);\n this.currentLang = languageService.currentLang;\n }\n\n back() {\n router.current.path.search(/wizard\\/.*/) !== -1\n ? wizardStack[this.currentLang].pop()\n : router.toRoute(\"wizard\");\n }\n}\n\nexport class WizardAnswer extends Model implements IWizardAnswer {\n id: string;\n answer: string;\n action?: WizardQuestion;\n tags: any[];\n overrideTags: boolean;\n currentLang: string;\n\n constructor(dto) {\n super(dto);\n this.currentLang = languageService.currentLang;\n }\n\n goTo(level, activeTags) {\n const newTags = this.mutateActiveTags(activeTags, this.tags, this.overrideTags);\n const followUpQuestion = this.action;\n if (followUpQuestion) {\n followUpQuestion.level = level + 1;\n followUpQuestion.activeTags = newTags;\n wizardStack[this.currentLang].push(new WizardSegment(followUpQuestion));\n } else {\n toRoute('results', { query: paramService.createParams(newTags)});\n }\n }\n\n private mutateActiveTags(previousTags, newTags, overrideTags?: boolean) {\n return overrideTags ? [ ...previousTags, ...newTags ] : [ ...newTags ];\n }\n\n}\n\ninterface IWizardQuestion {\n id: string;\n answers: IWizardAnswer[];\n}\n\ninterface IWizardAnswer {\n id: string;\n answer: string;\n action?: IWizardQuestion;\n tags: any[];\n}\n","import {route} from \"@lernetz/ts-lib\";\nimport {Gateway} from \"@lernetz/ts-lib/src/Gateway\";\nimport {languageService} from \"../services/lang\";\nimport {Infobox} from \"./components/article/infobox.component\";\nimport {Quote} from \"./components/article/quote.component\";\nimport {RawHtml} from \"../components/article-elements/rawhtml/RawHtml\";\n\n\n\nexport class GoodPracticeGateway extends Gateway {\n routeBase = \"api.goodPractices\";\n constructor(config) {\n super(config);\n this.in.add('App\\\\GoodPractice', dto => {\n const date = new Date(dto.date.split(' ')[0]);\n const locale = languageService.currentLang === 'en' ? 'en-US' : 'de-CH';\n const formattedDate = date.toLocaleDateString(locale, { day: 'numeric', month: 'long', year: 'numeric'});\n dto.date = formattedDate;\n return dto;\n });\n this.in.add('App\\\\Quote', dto => new Quote(dto));\n this.in.add('App\\\\Infobox', dto => new Infobox(dto));\n this.in.add( \"App\\\\RawHtml\", ( dto ) => new RawHtml( dto ) );\n }\n async find() {\n const goodPractices = await route(this.routeBase).load();\n return this.in.transform(goodPractices);\n }\n async get(id) {\n const goodPractices = await route(`${this.routeBase}.details`, { good_practice: id}).load();\n return this.in.transform(goodPractices);\n }\n}\n","import {Model} from \"@lernetz/ts-lib\";\nimport {ToolDto} from \"./tool.interface\";\n\nexport class Tool extends Model {\n constructor(dto: ToolDto) {\n super(dto);\n }\n}\n","import {route} from \"@lernetz/ts-lib\";\nimport {Gateway} from \"@lernetz/ts-lib/src/Gateway\";\nimport {ToolModel} from \".\";\nimport {Carousel} from \"../components/article-elements/carousel/Carousel\";\nimport {DecoratedIframely} from \"../components/article-elements/decoratedIframely/DecoratedIframely\";\nimport {MaterialList} from \"../components/article-elements/materiallist/MaterialList\";\nimport {RawHtml} from \"../components/article-elements/rawhtml/RawHtml\";\nimport {PersonalImpact} from \"../components/article-elements/personal-impact/PersonalImpact\";\nimport {RelatedContent} from \"../components/article-elements/related-content/related-content.component\";\nimport {Toggle} from \"../components/article-elements/toggle/Toggle\";\n\n\nexport class ToolGateway extends Gateway {\n routeBase = \"api.tools\";\n constructor(config) {\n super(config);\n this.in.add('App\\\\Tool', dto => new ToolModel(dto))\n this.in.add( \"App\\\\IFrame\", ( dto ) => new DecoratedIframely( dto ) );\n this.in.add( \"App\\\\Toggle\", ( dto ) => new Toggle( dto ) );\n this.in.add( \"App\\\\Carousel\", ( dto ) => new Carousel( dto ) );\n this.in.add( \"App\\\\MaterialList\", ( dto ) => new MaterialList( dto ) );\n this.in.add( \"App\\\\RawHtml\", ( dto ) => new RawHtml( dto ) );\n\n // extraInfos\n this.in.add( \"App\\\\PersonalImpact\", ( dto ) => new PersonalImpact( dto ) );\n this.in.add( \"App\\\\RelatedContent\", ( dto ) => new RelatedContent( dto ) );\n }\n async feed() {\n const tool = await route(`api.feed`).load() as { data: any};\n return this.in.transform(tool.data);\n }\n async get(id) {\n const tool = (await route(`${this.routeBase}.details`, { tool: id }).load() as any).data;\n return this.in.transform(tool);\n }\n async loadFilteredTools(filterQuery: string) {\n // return route(`${this.routeBase}`)\n const url = filterQuery ? `/api/tools${filterQuery}` : `/api/tools`;\n return fetch(url).then(res => res.json()).then(res => res.data);\n }\n}\n","import { route } from \"@lernetz/ts-lib\";\nimport { Gateway } from \"@lernetz/ts-lib/src/Gateway\";\n// import {Image} from \"@lernetz/ui-components/src/image/Image\";\nimport {Image} from \"../components/article-elements/image/Image\";\nimport {Paragraph} from \"../components/article-elements/paragraph/Paragraph\";\nimport { Podcast } from \"../components/article-elements/podcast/Podcast\";\nimport {Title} from \"../components/article-elements/title/Title\";\nimport { WizardAnswer, WizardQuestion } from \"../components/wizard/wizard.model\";\nimport {GoodPracticeGateway} from \"../good-practice/good-practice.gateway\";\nimport {ColumnLayout} from \"../pages/generic/article-elements/column-layout/column-layout.component\";\nimport {Column} from \"../pages/generic/article-elements/column-layout/column.component\";\nimport {Contact} from \"../pages/generic/article-elements/contact/contact.component\";\nimport {ToolGateway} from \"../tool/tool.gateway\";\nimport {httpService, lookup} from \"./api-service\";\n\nclass WizardGateway extends Gateway {\n toolGateway: ToolGateway;\n goodPracticeGateway: GoodPracticeGateway;\n constructor() {\n super({});\n this.in.add(\n \"App\\\\WizardQuestion\",\n (dto: any) => new WizardQuestion(dto)\n );\n this.in.add(\n \"App\\\\WizardAnswer\",\n (dto: any) => new WizardAnswer(dto)\n );\n this.in.add( 'App\\\\Title', ( dto: any ) => new Title( dto ) );\n this.in.add( 'App\\\\Paragraph', ( dto: any ) => new Paragraph( dto ) );\n this.in.add( 'App\\\\Image', ( dto: any ) => new Image(dto)\n // return new Image({ ...dto.image, route: 'asset', preset: 'original'}, )\n );\n\n this.in.add( 'App\\\\ColumnLayout', ( dto: any ) => new ColumnLayout( dto ) );\n this.in.add( 'App\\\\Column', ( dto: any ) => new Column( dto ) );\n this.in.add( 'App\\\\Contact', ( dto: any ) => new Contact( dto ) );\n this.in.add( 'App\\\\Podcast', ( dto: any ) => new Podcast( dto ) );\n\n this.toolGateway = new ToolGateway( { in: this.in, out: this.out } );\n this.goodPracticeGateway = new GoodPracticeGateway( { in: this.in, out: this.out } );\n }\n\n async loadInitialWizardQuestion() {\n return route(\"api.wizard.start\")\n .load()\n .then((res: { data: any }) => {\n return this.in.transform(res.data);\n });\n }\n\n async get(id: string) {\n return route(\"api.wizard.question\", {id})\n .load()\n .then((res: { data: any }) => {\n return this.in.transform(res.data);\n });\n }\n\n async loadPage(slug) {\n const page = await route(\"api.page\", {slug}).load();\n return this.in.transform(page);\n }\n\n async loadFilters() {\n return route(\"api.filter\").load();\n }\n\n async loadTopics() {\n // return httpService.get(lookup(\"api.topics\").url)\n\n return route(\"api.topics\").load() as any;\n }\n\n async search(q) {\n const res = await route(\"api.search\").send(JSON.stringify({q})) as any;\n return this.in.transform(res);\n }\n\n async loadGeneralInfos() {\n const res = await route(\"api.general\").load() as any;\n return this.in.transform(res);\n }\n\n}\n\ninterface WizardDto {\n id: string;\n}\n\nexport const gateway = new WizardGateway();\n","import {compile, empty, log} from \"@lernetz/ts-lib/src/view/Compiler\";\nimport {getState} from \"../state\";\n\nclass ApiService {\n private interceptors: Function[] = [];\n async get(uri) {\n const request = new Request(uri);\n const processedRequest = this.applyInterceptors(request)\n const res = await fetch(processedRequest)\n return res.json();\n }\n\n async post(uri, body) {\n const request = new Request(uri, {\n method: \"POST\",\n body\n });\n const processedRequest = this.applyInterceptors(request)\n const res = await fetch(processedRequest)\n return res.json();\n }\n\n private applyInterceptors(request: Request) {\n let processedRequest = { ...request };\n this.interceptors.forEach( interceptor => {\n processedRequest = interceptor(processedRequest)\n })\n return processedRequest;\n }\n\n addInterceptor() {\n\n }\n\n}\n\nexport const httpService = new ApiService();\n\nexport function lookup(key) {\n const data = getState();\n const c = compile( '[[ ' + key + ' ]]' ).call( { empty:empty, log:log }, data.routes );\n if( !c ) throw new Error( \"Route: '\" + key + \"' could not be found in setup routes.\" );\n return c;\n}\n\n","import {httpService} from \"./api-service\";\n// import {router} from \"./router\";\n\nclass LanguageService {\n currentLang = 'en'\n switchLanguage() {\n }\n correctUrl() {\n\n }\n determineLanguage() {\n this.currentLang =\n window.localStorage.getItem(\"lang\") ||\n this.getLangFromBrowser() ||\n \"de\";\n }\n private getLangFromBrowser() {\n const lang = navigator.language.split(\"-\")[0];\n return [\"en\", \"de\"].includes(lang) ? lang : null;\n }\n\n changeLanguage(lang, router) {\n this.currentLang = lang;\n window.localStorage.setItem(\"lang\", lang);\n const uri = router.current.path;\n const uriParts = uri.split(\"/\");\n // immutable versions of splice and unshift\n const newUri = [\"en\", \"de\"].includes(uriParts[1])\n ? [...uriParts.slice(0,1), lang, ...uriParts.slice(2)]\n : [...uriParts.slice(0,1), lang, ...uriParts.slice(1)];\n window.location.href = newUri.join('/')\n }\n\n addHeaderInterceptor() {\n httpService.addInterceptor()\n }\n}\n\nexport const languageService = new LanguageService();\n","\nclass ParamService {\n parseParams() {\n const searchParams = new URLSearchParams(window.location.search);\n return searchParams.has(\"tags\") ? searchParams.get(\"tags\").split(',') : null\n }\n\n createParams(filters) {\n const paramParts = [];\n if (filters) {\n const tagSlugs = filters.map(f=>f.slug).join(',');\n paramParts.push(`tags=${tagSlugs}`);\n }\n const paramsUrl = paramParts.length ? `?${paramParts.join(\"&\")}` : \"\";\n return paramsUrl;\n }\n}\n\nexport const paramService = new ParamService();\n","// import { Route } from \"@lernetz/ui-components/src/router/Route\";\nimport { Route } from \"@lernetz/ui-components/src/router/Route\";\nimport { Router as BaseRouter } from \"@lernetz/ui-components/src/router/Router\";\nimport { Segment, Stack } from \"@lernetz/ui-components/src/stack/Stack\";\nimport GoodPracticeModule from \"../good-practice/good-practice.module\";\nimport {ToolModule} from \"../tool/tool.module\";\n// import {WizardRootSegment} from \"../components/wizard/Wizard\";\nimport { gateway } from \"./gateway\";\nimport {trackEvent} from \"./tracker\";\nimport {languageService} from \"./lang\";\nimport {WizardSegment} from \"../components/wizard/wizard.segment\";\n\nimport {HomeController} from \"../pages/Home\";\nimport {ResultPageController} from \"../pages/results/results.component\";\nimport {SearchPageController} from \"../pages/search/search\";\nimport {MissingPageController} from \"../pages/Missing\";\nimport {GenericPageController} from \"../pages/generic/generic.component\";\n\nconst routes = [\n new Route({\n pattern: \"/\",\n name: \"home\",\n // caching: true,\n content: () => {\n const data = {\n feeds: []\n } as any;\n\n languageService.correctUrl();\n return { view: \"Home\", data: new HomeController() };\n },\n }),\n new Route({\n pattern: \"/:lang/home/:topicSlug\",\n name: \"home\",\n // caching: true,\n content: () => {\n const data = {\n feeds: []\n } as any;\n return { view: \"Home\", data: new HomeController() };\n },\n }),\n ...GoodPracticeModule.routes,\n ...ToolModule.routes,\n new Route({\n name: \"search\",\n pattern: \"/:lang/search\",\n content: (params, route) => {\n let data = new SearchPageController()\n\n return {\n view: \"SearchPage\",\n data,\n };\n },\n }),\n new Route({\n name: \"page\",\n pattern: \"/:lang/p/:slug\",\n content: (params, route) => {\n const data = new GenericPageController();\n data.routeInit(params.slug);\n\n return {\n view: \"GenericPage\",\n data,\n };\n },\n }),\n new Route({\n name: \"wizard\",\n pattern: \"/:lang/wizard\",\n content: (params, route) => {\n const component = {\n view: \"WizardStart\",\n data: {\n },\n };\n gateway\n .loadInitialWizardQuestion()\n .then((wq) => {\n Object.assign(component.data, wq)\n });\n\n return component;\n },\n }),\n new Route({\n name: \"results\",\n pattern: \"/:lang/result/:query\",\n content: (params, route) => {\n const resultController = new ResultPageController(params.lang);\n // resultController.routeInit(params.query);\n return {\n view: \"ResultPage\",\n data: resultController\n };\n },\n }),\n new Route({\n pattern: \"/:lang\",\n name: \"home\",\n // caching: true,\n content: (params) => {\n // backend renders normal frontapge when wrong lang-prefix are used\n if (['en', 'de'].includes(params.lang)) {\n return { view: \"Home\", data: new HomeController() };\n } else if (params.lang === 'index.php?id=tools') {\n // old bookmarks are stored with this\n return { view: \"Home\", data: new HomeController() };\n } else {\n trackEvent(\"404\", { url: window.location.href, referrer: document.referrer })\n return { view: \"Missing\", data: new MissingPageController() };\n }\n },\n }),\n];\n\nexport class WizardRootSegment implements Segment {\n view: string = \"Wizard\";\n data = {} as any;\n currentLang: string;\n url: '';\n\n constructor() {\n this.currentLang = languageService.currentLang;\n }\n\n async resolve(urlSeg: string) {\n this.data = await gateway.get(urlSeg);\n this.data.level = 0;\n return new WizardSegment(this.data);\n }\n}\n\nexport const wizardStack = {\n de: new Stack({\n name: \"wizardStep\",\n pattern: \"/de/wizard/*\",\n root: new WizardRootSegment(),\n }),\n en: new Stack({\n name: \"wizardStep\",\n pattern: \"/en/wizard/*\",\n root: new WizardRootSegment(),\n })\n};\n\nclass Router extends BaseRouter {\n toPath( path: string ) {\n super.toPath(path);\n resetScrollPosition();\n }\n}\n\nexport const router = new Router({\n routes: [\n ...routes,\n ...Object.values(wizardStack).map( s => s.route),\n // enStack.route,\n new Route({\n pattern: \"/*\",\n name: \"404\",\n // caching: true,\n content: () => {\n // gateway.loadInitialWizardQuestion().then( wizardSteps => data.wizardSteps = wizardSteps);\n trackEvent(\"404\", { url: window.location.href, referrer: document.referrer })\n return { view: \"Missing\", data: new MissingPageController() };\n },\n }),\n ],\n});\n\nfunction resetScrollPosition() {\n // window.scrollTo(0, 0);\n const el = document.getElementById(\"scroll-container\");\n if (el) {\n // el.scrollTo( { behavior: \"smooth\", top: 0, left: 0 } );\n el.scrollTo(0,0);\n }\n}\n\nexport function toRoute(urlName: string, params?) {\n router.toRoute(urlName, { lang: languageService.currentLang, ...params});\n}\n","class TagService {\n\n getActiveTagsFromParam(filterCategories, tagParams: string[]) {\n if (!tagParams) {\n return [];\n }\n const allTags = filterCategories.flatMap(\n (filterCategory) => filterCategory.tags\n );\n const selectedTags = tagParams.map((tagParam) =>\n allTags.find((tag) => tag.slug === tagParam)\n );\n return selectedTags;\n }\n}\n\nexport const tagService = new TagService();\n","\n\nexport function trackEvent(eventName: string, data) {\n if ((window as any).plausible) {\n (window as any).plausible(eventName, {\n props: data\n });\n }\n}\n","\nlet state;\n\nexport function getState() {\n return state;\n}\n\nexport function setState(newState) {\n state = Object.freeze(newState);\n}\n","import {ViewRegistry} from \"@lernetz/ts-lib\";\nimport {Route} from \"@lernetz/ui-components/src/router/Route\";\nimport {UiModule} from \"../core/interface\";\nimport {Infobox, InfoboxView} from \"../good-practice/components/article/infobox.component\";\nimport {Quote, QuoteView} from \"../good-practice/components/article/quote.component\";\nimport {ToolDetailsController} from \"../pages/tools/details/tool-details.view\";\nimport {ToolsPageController} from \"../pages/tools/tools.view\";\n\nconst views = new ViewRegistry();\nviews.add(Quote, () => new QuoteView());\nviews.add(Infobox, () => new InfoboxView());\n\nexport const ToolModule: UiModule = {\n views,\n routes: [\n new Route({\n name: \"tools\",\n pattern: \"/:lang/tools\",\n content: (params, route) => {\n return {\n view: \"ToolsPage\",\n data: new ToolsPageController(\"\")\n };\n },\n }),\n new Route({\n name: \"tools-filter\",\n pattern: \"/:lang/filter/tools/:toolId\",\n content: (params, route) => {\n return {\n view: \"ToolsPage\",\n // this fix is not good\n data: new ToolsPageController(params.toolId)\n };\n },\n }),\n new Route({\n name: \"tools-details\",\n pattern: \"/:lang/tools/:toolId\",\n content: (params, route) => {\n const data = new ToolDetailsController()\n data.load(params.toolId);\n\n return {\n view: \"ToolDetailsPage\",\n data,\n };\n },\n }),\n ]\n}\n\n","/**\n * tua-body-scroll-lock v1.5.0\n * (c) 2024 Evinma, BuptStEve\n * @license MIT\n */\n\n(function (global, factory) {\n typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :\n typeof define === 'function' && define.amd ? define(['exports'], factory) :\n (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.bodyScrollLock = {}));\n})(this, (function (exports) { 'use strict';\n\n var isServer = function isServer() {\n return typeof window === 'undefined';\n };\n var detectOS = function detectOS(ua) {\n ua = ua || navigator.userAgent;\n var ipad = /(iPad).*OS\\s([\\d_]+)/.test(ua);\n var iphone = !ipad && /(iPhone\\sOS)\\s([\\d_]+)/.test(ua);\n var android = /(Android);?[\\s/]+([\\d.]+)?/.test(ua);\n var ios = iphone || ipad;\n return {\n ios: ios,\n android: android\n };\n };\n function getEventListenerOptions(options) {\n /* istanbul ignore if */\n if (isServer()) return false;\n if (!options) {\n throw new Error('options must be provided');\n }\n var isSupportOptions = false;\n var listenerOptions = {\n get passive() {\n isSupportOptions = true;\n return undefined;\n }\n };\n /* istanbul ignore next */\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n var noop = function noop() {};\n var testEvent = '__TUA_BSL_TEST_PASSIVE__';\n window.addEventListener(testEvent, noop, listenerOptions);\n window.removeEventListener(testEvent, noop, listenerOptions);\n var capture = options.capture;\n /* istanbul ignore next */\n return isSupportOptions ? options : typeof capture !== 'undefined' ? capture : false;\n }\n function noticeRequiredTargetElement(targetElement) {\n if (targetElement) return false;\n if (targetElement === null) return false;\n /* istanbul ignore if */\n {\n console.warn('If scrolling is also required in the floating layer, ' + 'the target element must be provided.');\n }\n return true;\n }\n /**\n * Get global function that calls preventDefault\n */\n function getPreventEventDefault() {\n if ('__BSL_PREVENT_DEFAULT__' in window) {\n return window.__BSL_PREVENT_DEFAULT__;\n }\n window.__BSL_PREVENT_DEFAULT__ = function (event) {\n if (!event.cancelable) return;\n event.preventDefault();\n };\n return window.__BSL_PREVENT_DEFAULT__;\n }\n\n var initialLockState = {\n lockedNum: 0,\n lockedElements: [],\n unLockCallback: null,\n documentListenerAdded: false,\n initialClientPos: {\n clientX: 0,\n clientY: 0\n }\n };\n function getLockState(options) {\n if (isServer()) return initialLockState;\n /** use local lockState */\n if (!(options === null || options === void 0 ? void 0 : options.useGlobalLockState)) return getLockState.lockState;\n /** use global lockState */\n var lockState = '__BSL_LOCK_STATE__' in window ? Object.assign(Object.assign({}, initialLockState), window.__BSL_LOCK_STATE__) : initialLockState;\n /** assign to global */\n window.__BSL_LOCK_STATE__ = lockState;\n return lockState;\n }\n getLockState.lockState = initialLockState;\n\n function handleScroll(event, targetElement, initialClientPos) {\n if (targetElement) {\n var scrollTop = targetElement.scrollTop,\n scrollLeft = targetElement.scrollLeft,\n scrollWidth = targetElement.scrollWidth,\n scrollHeight = targetElement.scrollHeight,\n clientWidth = targetElement.clientWidth,\n clientHeight = targetElement.clientHeight;\n var clientX = event.targetTouches[0].clientX - initialClientPos.clientX;\n var clientY = event.targetTouches[0].clientY - initialClientPos.clientY;\n var isVertical = Math.abs(clientY) > Math.abs(clientX);\n var isOnTop = clientY > 0 && scrollTop === 0;\n var isOnLeft = clientX > 0 && scrollLeft === 0;\n var isOnRight = clientX < 0 && scrollLeft + clientWidth + 1 >= scrollWidth;\n var isOnBottom = clientY < 0 && scrollTop + clientHeight + 1 >= scrollHeight;\n if (isVertical && (isOnTop || isOnBottom) || !isVertical && (isOnLeft || isOnRight)) {\n return getPreventEventDefault()(event);\n }\n }\n event.stopPropagation();\n return true;\n }\n\n function setOverflowHiddenPc() {\n var $html = document.documentElement;\n var htmlStyle = Object.assign({}, $html.style);\n var scrollBarWidth = window.innerWidth - $html.clientWidth;\n var previousPaddingRight = parseInt(window.getComputedStyle($html).paddingRight, 10);\n $html.style.overflow = 'hidden';\n $html.style.boxSizing = 'border-box';\n $html.style.paddingRight = \"\".concat(scrollBarWidth + previousPaddingRight, \"px\");\n return function () {\n ['overflow', 'boxSizing', 'paddingRight'].forEach(function (x) {\n $html.style[x] = htmlStyle[x] || '';\n });\n };\n }\n function setOverflowHiddenMobile(options) {\n var $html = document.documentElement;\n var $body = document.body;\n var scrollTop = $html.scrollTop || $body.scrollTop;\n var htmlStyle = Object.assign({}, $html.style);\n var bodyStyle = Object.assign({}, $body.style);\n $html.style.height = '100%';\n $html.style.overflow = 'hidden';\n $body.style.top = \"-\".concat(scrollTop, \"px\");\n $body.style.width = '100%';\n $body.style.height = 'auto';\n $body.style.position = 'fixed';\n $body.style.overflow = (options === null || options === void 0 ? void 0 : options.overflowType) || 'hidden';\n return function () {\n $html.style.height = htmlStyle.height || '';\n $html.style.overflow = htmlStyle.overflow || '';\n ['top', 'width', 'height', 'overflow', 'position'].forEach(function (x) {\n $body.style[x] = bodyStyle[x] || '';\n });\n var supportsNativeSmoothScroll = ('scrollBehavior' in document.documentElement.style);\n if (supportsNativeSmoothScroll) {\n window.scrollTo({\n top: scrollTop,\n behavior: 'instant'\n });\n } else {\n window.scrollTo(0, scrollTop);\n }\n };\n }\n\n var eventListenerOptions = getEventListenerOptions({\n passive: false\n });\n function lock(targetElement, options) {\n if (isServer()) return;\n noticeRequiredTargetElement(targetElement);\n var lockState = getLockState(options);\n if (detectOS().ios) {\n // iOS\n if (targetElement) {\n var elementArray = Array.isArray(targetElement) ? targetElement : [targetElement];\n elementArray.forEach(function (element) {\n if (element && lockState.lockedElements.indexOf(element) === -1) {\n element.ontouchstart = function (event) {\n var _event$targetTouches$ = event.targetTouches[0],\n clientX = _event$targetTouches$.clientX,\n clientY = _event$targetTouches$.clientY;\n lockState.initialClientPos = {\n clientX: clientX,\n clientY: clientY\n };\n };\n element.ontouchmove = function (event) {\n if (event.targetTouches.length !== 1) return;\n handleScroll(event, element, lockState.initialClientPos);\n };\n lockState.lockedElements.push(element);\n }\n });\n }\n if (!lockState.documentListenerAdded) {\n document.addEventListener('touchmove', getPreventEventDefault(), eventListenerOptions);\n lockState.documentListenerAdded = true;\n }\n } else if (lockState.lockedNum <= 0) {\n lockState.unLockCallback = detectOS().android ? setOverflowHiddenMobile(options) : setOverflowHiddenPc();\n }\n lockState.lockedNum += 1;\n }\n function unlock(targetElement, options) {\n if (isServer()) return;\n noticeRequiredTargetElement(targetElement);\n var lockState = getLockState(options);\n lockState.lockedNum -= 1;\n if (lockState.lockedNum > 0) return;\n if (!detectOS().ios && typeof lockState.unLockCallback === 'function') {\n lockState.unLockCallback();\n return;\n }\n // iOS\n if (targetElement) {\n var elementArray = Array.isArray(targetElement) ? targetElement : [targetElement];\n elementArray.forEach(function (element) {\n var index = lockState.lockedElements.indexOf(element);\n if (index !== -1) {\n element.ontouchmove = null;\n element.ontouchstart = null;\n lockState.lockedElements.splice(index, 1);\n }\n });\n }\n if (lockState.documentListenerAdded) {\n document.removeEventListener('touchmove', getPreventEventDefault(), eventListenerOptions);\n lockState.documentListenerAdded = false;\n }\n }\n function clearBodyLocks(options) {\n if (isServer()) return;\n var lockState = getLockState(options);\n lockState.lockedNum = 0;\n if (!detectOS().ios && typeof lockState.unLockCallback === 'function') {\n lockState.unLockCallback();\n return;\n }\n // iOS\n if (lockState.lockedElements.length) {\n // clear events\n var element = lockState.lockedElements.pop();\n while (element) {\n element.ontouchmove = null;\n element.ontouchstart = null;\n element = lockState.lockedElements.pop();\n }\n }\n if (lockState.documentListenerAdded) {\n document.removeEventListener('touchmove', getPreventEventDefault(), eventListenerOptions);\n lockState.documentListenerAdded = false;\n }\n }\n\n exports.clearBodyLocks = clearBodyLocks;\n exports.lock = lock;\n exports.unlock = unlock;\n\n}));\n","import { PUBLIC_VERSION } from '../../../shared/version.js';\n\nif (typeof window !== 'undefined')\n\t// @ts-ignore\n\t(window.__svelte || (window.__svelte = { v: new Set() })).v.add(PUBLIC_VERSION);\n","/** @returns {void} */\nexport function noop() {}\n\nexport const identity = (x) => x;\n\n/**\n * @template T\n * @template S\n * @param {T} tar\n * @param {S} src\n * @returns {T & S}\n */\nexport function assign(tar, src) {\n\t// @ts-ignore\n\tfor (const k in src) tar[k] = src[k];\n\treturn /** @type {T & S} */ (tar);\n}\n\n// Adapted from https://github.com/then/is-promise/blob/master/index.js\n// Distributed under MIT License https://github.com/then/is-promise/blob/master/LICENSE\n/**\n * @param {any} value\n * @returns {value is PromiseLike<any>}\n */\nexport function is_promise(value) {\n\treturn (\n\t\t!!value &&\n\t\t(typeof value === 'object' || typeof value === 'function') &&\n\t\ttypeof (/** @type {any} */ (value).then) === 'function'\n\t);\n}\n\n/** @returns {void} */\nexport function add_location(element, file, line, column, char) {\n\telement.__svelte_meta = {\n\t\tloc: { file, line, column, char }\n\t};\n}\n\nexport function run(fn) {\n\treturn fn();\n}\n\nexport function blank_object() {\n\treturn Object.create(null);\n}\n\n/**\n * @param {Function[]} fns\n * @returns {void}\n */\nexport function run_all(fns) {\n\tfns.forEach(run);\n}\n\n/**\n * @param {any} thing\n * @returns {thing is Function}\n */\nexport function is_function(thing) {\n\treturn typeof thing === 'function';\n}\n\n/** @returns {boolean} */\nexport function safe_not_equal(a, b) {\n\treturn a != a ? b == b : a !== b || (a && typeof a === 'object') || typeof a === 'function';\n}\n\nlet src_url_equal_anchor;\n\n/**\n * @param {string} element_src\n * @param {string} url\n * @returns {boolean}\n */\nexport function src_url_equal(element_src, url) {\n\tif (element_src === url) return true;\n\tif (!src_url_equal_anchor) {\n\t\tsrc_url_equal_anchor = document.createElement('a');\n\t}\n\t// This is actually faster than doing URL(..).href\n\tsrc_url_equal_anchor.href = url;\n\treturn element_src === src_url_equal_anchor.href;\n}\n\n/** @param {string} srcset */\nfunction split_srcset(srcset) {\n\treturn srcset.split(',').map((src) => src.trim().split(' ').filter(Boolean));\n}\n\n/**\n * @param {HTMLSourceElement | HTMLImageElement} element_srcset\n * @param {string | undefined | null} srcset\n * @returns {boolean}\n */\nexport function srcset_url_equal(element_srcset, srcset) {\n\tconst element_urls = split_srcset(element_srcset.srcset);\n\tconst urls = split_srcset(srcset || '');\n\n\treturn (\n\t\turls.length === element_urls.length &&\n\t\turls.every(\n\t\t\t([url, width], i) =>\n\t\t\t\twidth === element_urls[i][1] &&\n\t\t\t\t// We need to test both ways because Vite will create an a full URL with\n\t\t\t\t// `new URL(asset, import.meta.url).href` for the client when `base: './'`, and the\n\t\t\t\t// relative URLs inside srcset are not automatically resolved to absolute URLs by\n\t\t\t\t// browsers (in contrast to img.src). This means both SSR and DOM code could\n\t\t\t\t// contain relative or absolute URLs.\n\t\t\t\t(src_url_equal(element_urls[i][0], url) || src_url_equal(url, element_urls[i][0]))\n\t\t)\n\t);\n}\n\n/** @returns {boolean} */\nexport function not_equal(a, b) {\n\treturn a != a ? b == b : a !== b;\n}\n\n/** @returns {boolean} */\nexport function is_empty(obj) {\n\treturn Object.keys(obj).length === 0;\n}\n\n/** @returns {void} */\nexport function validate_store(store, name) {\n\tif (store != null && typeof store.subscribe !== 'function') {\n\t\tthrow new Error(`'${name}' is not a store with a 'subscribe' method`);\n\t}\n}\n\nexport function subscribe(store, ...callbacks) {\n\tif (store == null) {\n\t\tfor (const callback of callbacks) {\n\t\t\tcallback(undefined);\n\t\t}\n\t\treturn noop;\n\t}\n\tconst unsub = store.subscribe(...callbacks);\n\treturn unsub.unsubscribe ? () => unsub.unsubscribe() : unsub;\n}\n\n/**\n * Get the current value from a store by subscribing and immediately unsubscribing.\n *\n * https://svelte.dev/docs/svelte-store#get\n * @template T\n * @param {import('../store/public.js').Readable<T>} store\n * @returns {T}\n */\nexport function get_store_value(store) {\n\tlet value;\n\tsubscribe(store, (_) => (value = _))();\n\treturn value;\n}\n\n/** @returns {void} */\nexport function component_subscribe(component, store, callback) {\n\tcomponent.$$.on_destroy.push(subscribe(store, callback));\n}\n\nexport function create_slot(definition, ctx, $$scope, fn) {\n\tif (definition) {\n\t\tconst slot_ctx = get_slot_context(definition, ctx, $$scope, fn);\n\t\treturn definition[0](slot_ctx);\n\t}\n}\n\nfunction get_slot_context(definition, ctx, $$scope, fn) {\n\treturn definition[1] && fn ? assign($$scope.ctx.slice(), definition[1](fn(ctx))) : $$scope.ctx;\n}\n\nexport function get_slot_changes(definition, $$scope, dirty, fn) {\n\tif (definition[2] && fn) {\n\t\tconst lets = definition[2](fn(dirty));\n\t\tif ($$scope.dirty === undefined) {\n\t\t\treturn lets;\n\t\t}\n\t\tif (typeof lets === 'object') {\n\t\t\tconst merged = [];\n\t\t\tconst len = Math.max($$scope.dirty.length, lets.length);\n\t\t\tfor (let i = 0; i < len; i += 1) {\n\t\t\t\tmerged[i] = $$scope.dirty[i] | lets[i];\n\t\t\t}\n\t\t\treturn merged;\n\t\t}\n\t\treturn $$scope.dirty | lets;\n\t}\n\treturn $$scope.dirty;\n}\n\n/** @returns {void} */\nexport function update_slot_base(\n\tslot,\n\tslot_definition,\n\tctx,\n\t$$scope,\n\tslot_changes,\n\tget_slot_context_fn\n) {\n\tif (slot_changes) {\n\t\tconst slot_context = get_slot_context(slot_definition, ctx, $$scope, get_slot_context_fn);\n\t\tslot.p(slot_context, slot_changes);\n\t}\n}\n\n/** @returns {void} */\nexport function update_slot(\n\tslot,\n\tslot_definition,\n\tctx,\n\t$$scope,\n\tdirty,\n\tget_slot_changes_fn,\n\tget_slot_context_fn\n) {\n\tconst slot_changes = get_slot_changes(slot_definition, $$scope, dirty, get_slot_changes_fn);\n\tupdate_slot_base(slot, slot_definition, ctx, $$scope, slot_changes, get_slot_context_fn);\n}\n\n/** @returns {any[] | -1} */\nexport function get_all_dirty_from_scope($$scope) {\n\tif ($$scope.ctx.length > 32) {\n\t\tconst dirty = [];\n\t\tconst length = $$scope.ctx.length / 32;\n\t\tfor (let i = 0; i < length; i++) {\n\t\t\tdirty[i] = -1;\n\t\t}\n\t\treturn dirty;\n\t}\n\treturn -1;\n}\n\n/** @returns {{}} */\nexport function exclude_internal_props(props) {\n\tconst result = {};\n\tfor (const k in props) if (k[0] !== '$') result[k] = props[k];\n\treturn result;\n}\n\n/** @returns {{}} */\nexport function compute_rest_props(props, keys) {\n\tconst rest = {};\n\tkeys = new Set(keys);\n\tfor (const k in props) if (!keys.has(k) && k[0] !== '$') rest[k] = props[k];\n\treturn rest;\n}\n\n/** @returns {{}} */\nexport function compute_slots(slots) {\n\tconst result = {};\n\tfor (const key in slots) {\n\t\tresult[key] = true;\n\t}\n\treturn result;\n}\n\n/** @returns {(this: any, ...args: any[]) => void} */\nexport function once(fn) {\n\tlet ran = false;\n\treturn function (...args) {\n\t\tif (ran) return;\n\t\tran = true;\n\t\tfn.call(this, ...args);\n\t};\n}\n\nexport function null_to_empty(value) {\n\treturn value == null ? '' : value;\n}\n\nexport function set_store_value(store, ret, value) {\n\tstore.set(value);\n\treturn ret;\n}\n\nexport const has_prop = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);\n\nexport function action_destroyer(action_result) {\n\treturn action_result && is_function(action_result.destroy) ? action_result.destroy : noop;\n}\n\n/** @param {number | string} value\n * @returns {[number, string]}\n */\nexport function split_css_unit(value) {\n\tconst split = typeof value === 'string' && value.match(/^\\s*(-?[\\d.]+)([^\\s]*)\\s*$/);\n\treturn split ? [parseFloat(split[1]), split[2] || 'px'] : [/** @type {number} */ (value), 'px'];\n}\n\nexport const contenteditable_truthy_values = ['', true, 1, 'true', 'contenteditable'];\n","import { noop } from './utils.js';\n\nexport const is_client = typeof window !== 'undefined';\n\n/** @type {() => number} */\nexport let now = is_client ? () => window.performance.now() : () => Date.now();\n\nexport let raf = is_client ? (cb) => requestAnimationFrame(cb) : noop;\n\n// used internally for testing\n/** @returns {void} */\nexport function set_now(fn) {\n\tnow = fn;\n}\n\n/** @returns {void} */\nexport function set_raf(fn) {\n\traf = fn;\n}\n","import { raf } from './environment.js';\n\nconst tasks = new Set();\n\n/**\n * @param {number} now\n * @returns {void}\n */\nfunction run_tasks(now) {\n\ttasks.forEach((task) => {\n\t\tif (!task.c(now)) {\n\t\t\ttasks.delete(task);\n\t\t\ttask.f();\n\t\t}\n\t});\n\tif (tasks.size !== 0) raf(run_tasks);\n}\n\n/**\n * For testing purposes only!\n * @returns {void}\n */\nexport function clear_loops() {\n\ttasks.clear();\n}\n\n/**\n * Creates a new task that runs on each raf frame\n * until it returns a falsy value or is aborted\n * @param {import('./private.js').TaskCallback} callback\n * @returns {import('./private.js').Task}\n */\nexport function loop(callback) {\n\t/** @type {import('./private.js').TaskEntry} */\n\tlet task;\n\tif (tasks.size === 0) raf(run_tasks);\n\treturn {\n\t\tpromise: new Promise((fulfill) => {\n\t\t\ttasks.add((task = { c: callback, f: fulfill }));\n\t\t}),\n\t\tabort() {\n\t\t\ttasks.delete(task);\n\t\t}\n\t};\n}\n","/** @type {typeof globalThis} */\nexport const globals =\n\ttypeof window !== 'undefined'\n\t\t? window\n\t\t: typeof globalThis !== 'undefined'\n\t\t? globalThis\n\t\t: // @ts-ignore Node typings have this\n\t\t global;\n","import { globals } from './globals.js';\n\n/**\n * Resize observer singleton.\n * One listener per element only!\n * https://groups.google.com/a/chromium.org/g/blink-dev/c/z6ienONUb5A/m/F5-VcUZtBAAJ\n */\nexport class ResizeObserverSingleton {\n\t/**\n\t * @private\n\t * @readonly\n\t * @type {WeakMap<Element, import('./private.js').Listener>}\n\t */\n\t_listeners = 'WeakMap' in globals ? new WeakMap() : undefined;\n\n\t/**\n\t * @private\n\t * @type {ResizeObserver}\n\t */\n\t_observer = undefined;\n\n\t/** @type {ResizeObserverOptions} */\n\toptions;\n\n\t/** @param {ResizeObserverOptions} options */\n\tconstructor(options) {\n\t\tthis.options = options;\n\t}\n\n\t/**\n\t * @param {Element} element\n\t * @param {import('./private.js').Listener} listener\n\t * @returns {() => void}\n\t */\n\tobserve(element, listener) {\n\t\tthis._listeners.set(element, listener);\n\t\tthis._getObserver().observe(element, this.options);\n\t\treturn () => {\n\t\t\tthis._listeners.delete(element);\n\t\t\tthis._observer.unobserve(element); // this line can probably be removed\n\t\t};\n\t}\n\n\t/**\n\t * @private\n\t */\n\t_getObserver() {\n\t\treturn (\n\t\t\tthis._observer ??\n\t\t\t(this._observer = new ResizeObserver((entries) => {\n\t\t\t\tfor (const entry of entries) {\n\t\t\t\t\tResizeObserverSingleton.entries.set(entry.target, entry);\n\t\t\t\t\tthis._listeners.get(entry.target)?.(entry);\n\t\t\t\t}\n\t\t\t}))\n\t\t);\n\t}\n}\n\n// Needs to be written like this to pass the tree-shake-test\nResizeObserverSingleton.entries = 'WeakMap' in globals ? new WeakMap() : undefined;\n","import { contenteditable_truthy_values, has_prop } from './utils.js';\n\nimport { ResizeObserverSingleton } from './ResizeObserverSingleton.js';\n\n// Track which nodes are claimed during hydration. Unclaimed nodes can then be removed from the DOM\n// at the end of hydration without touching the remaining nodes.\nlet is_hydrating = false;\n\n/**\n * @returns {void}\n */\nexport function start_hydrating() {\n\tis_hydrating = true;\n}\n\n/**\n * @returns {void}\n */\nexport function end_hydrating() {\n\tis_hydrating = false;\n}\n\n/**\n * @param {number} low\n * @param {number} high\n * @param {(index: number) => number} key\n * @param {number} value\n * @returns {number}\n */\nfunction upper_bound(low, high, key, value) {\n\t// Return first index of value larger than input value in the range [low, high)\n\twhile (low < high) {\n\t\tconst mid = low + ((high - low) >> 1);\n\t\tif (key(mid) <= value) {\n\t\t\tlow = mid + 1;\n\t\t} else {\n\t\t\thigh = mid;\n\t\t}\n\t}\n\treturn low;\n}\n\n/**\n * @param {NodeEx} target\n * @returns {void}\n */\nfunction init_hydrate(target) {\n\tif (target.hydrate_init) return;\n\ttarget.hydrate_init = true;\n\t// We know that all children have claim_order values since the unclaimed have been detached if target is not <head>\n\n\tlet children = /** @type {ArrayLike<NodeEx2>} */ (target.childNodes);\n\t// If target is <head>, there may be children without claim_order\n\tif (target.nodeName === 'HEAD') {\n\t\tconst my_children = [];\n\t\tfor (let i = 0; i < children.length; i++) {\n\t\t\tconst node = children[i];\n\t\t\tif (node.claim_order !== undefined) {\n\t\t\t\tmy_children.push(node);\n\t\t\t}\n\t\t}\n\t\tchildren = my_children;\n\t}\n\t/*\n\t * Reorder claimed children optimally.\n\t * We can reorder claimed children optimally by finding the longest subsequence of\n\t * nodes that are already claimed in order and only moving the rest. The longest\n\t * subsequence of nodes that are claimed in order can be found by\n\t * computing the longest increasing subsequence of .claim_order values.\n\t *\n\t * This algorithm is optimal in generating the least amount of reorder operations\n\t * possible.\n\t *\n\t * Proof:\n\t * We know that, given a set of reordering operations, the nodes that do not move\n\t * always form an increasing subsequence, since they do not move among each other\n\t * meaning that they must be already ordered among each other. Thus, the maximal\n\t * set of nodes that do not move form a longest increasing subsequence.\n\t */\n\t// Compute longest increasing subsequence\n\t// m: subsequence length j => index k of smallest value that ends an increasing subsequence of length j\n\tconst m = new Int32Array(children.length + 1);\n\t// Predecessor indices + 1\n\tconst p = new Int32Array(children.length);\n\tm[0] = -1;\n\tlet longest = 0;\n\tfor (let i = 0; i < children.length; i++) {\n\t\tconst current = children[i].claim_order;\n\t\t// Find the largest subsequence length such that it ends in a value less than our current value\n\t\t// upper_bound returns first greater value, so we subtract one\n\t\t// with fast path for when we are on the current longest subsequence\n\t\tconst seq_len =\n\t\t\t(longest > 0 && children[m[longest]].claim_order <= current\n\t\t\t\t? longest + 1\n\t\t\t\t: upper_bound(1, longest, (idx) => children[m[idx]].claim_order, current)) - 1;\n\t\tp[i] = m[seq_len] + 1;\n\t\tconst new_len = seq_len + 1;\n\t\t// We can guarantee that current is the smallest value. Otherwise, we would have generated a longer sequence.\n\t\tm[new_len] = i;\n\t\tlongest = Math.max(new_len, longest);\n\t}\n\t// The longest increasing subsequence of nodes (initially reversed)\n\n\t/**\n\t * @type {NodeEx2[]}\n\t */\n\tconst lis = [];\n\t// The rest of the nodes, nodes that will be moved\n\n\t/**\n\t * @type {NodeEx2[]}\n\t */\n\tconst to_move = [];\n\tlet last = children.length - 1;\n\tfor (let cur = m[longest] + 1; cur != 0; cur = p[cur - 1]) {\n\t\tlis.push(children[cur - 1]);\n\t\tfor (; last >= cur; last--) {\n\t\t\tto_move.push(children[last]);\n\t\t}\n\t\tlast--;\n\t}\n\tfor (; last >= 0; last--) {\n\t\tto_move.push(children[last]);\n\t}\n\tlis.reverse();\n\t// We sort the nodes being moved to guarantee that their insertion order matches the claim order\n\tto_move.sort((a, b) => a.claim_order - b.claim_order);\n\t// Finally, we move the nodes\n\tfor (let i = 0, j = 0; i < to_move.length; i++) {\n\t\twhile (j < lis.length && to_move[i].claim_order >= lis[j].claim_order) {\n\t\t\tj++;\n\t\t}\n\t\tconst anchor = j < lis.length ? lis[j] : null;\n\t\ttarget.insertBefore(to_move[i], anchor);\n\t}\n}\n\n/**\n * @param {Node} target\n * @param {Node} node\n * @returns {void}\n */\nexport function append(target, node) {\n\ttarget.appendChild(node);\n}\n\n/**\n * @param {Node} target\n * @param {string} style_sheet_id\n * @param {string} styles\n * @returns {void}\n */\nexport function append_styles(target, style_sheet_id, styles) {\n\tconst append_styles_to = get_root_for_style(target);\n\tif (!append_styles_to.getElementById(style_sheet_id)) {\n\t\tconst style = element('style');\n\t\tstyle.id = style_sheet_id;\n\t\tstyle.textContent = styles;\n\t\tappend_stylesheet(append_styles_to, style);\n\t}\n}\n\n/**\n * @param {Node} node\n * @returns {ShadowRoot | Document}\n */\nexport function get_root_for_style(node) {\n\tif (!node) return document;\n\tconst root = node.getRootNode ? node.getRootNode() : node.ownerDocument;\n\tif (root && /** @type {ShadowRoot} */ (root).host) {\n\t\treturn /** @type {ShadowRoot} */ (root);\n\t}\n\treturn node.ownerDocument;\n}\n\n/**\n * @param {Node} node\n * @returns {CSSStyleSheet}\n */\nexport function append_empty_stylesheet(node) {\n\tconst style_element = element('style');\n\t// For transitions to work without 'style-src: unsafe-inline' Content Security Policy,\n\t// these empty tags need to be allowed with a hash as a workaround until we move to the Web Animations API.\n\t// Using the hash for the empty string (for an empty tag) works in all browsers except Safari.\n\t// So as a workaround for the workaround, when we append empty style tags we set their content to /* empty */.\n\t// The hash 'sha256-9OlNO0DNEeaVzHL4RZwCLsBHA8WBQ8toBp/4F5XV2nc=' will then work even in Safari.\n\tstyle_element.textContent = '/* empty */';\n\tappend_stylesheet(get_root_for_style(node), style_element);\n\treturn style_element.sheet;\n}\n\n/**\n * @param {ShadowRoot | Document} node\n * @param {HTMLStyleElement} style\n * @returns {CSSStyleSheet}\n */\nfunction append_stylesheet(node, style) {\n\tappend(/** @type {Document} */ (node).head || node, style);\n\treturn style.sheet;\n}\n\n/**\n * @param {NodeEx} target\n * @param {NodeEx} node\n * @returns {void}\n */\nexport function append_hydration(target, node) {\n\tif (is_hydrating) {\n\t\tinit_hydrate(target);\n\t\tif (\n\t\t\ttarget.actual_end_child === undefined ||\n\t\t\t(target.actual_end_child !== null && target.actual_end_child.parentNode !== target)\n\t\t) {\n\t\t\ttarget.actual_end_child = target.firstChild;\n\t\t}\n\t\t// Skip nodes of undefined ordering\n\t\twhile (target.actual_end_child !== null && target.actual_end_child.claim_order === undefined) {\n\t\t\ttarget.actual_end_child = target.actual_end_child.nextSibling;\n\t\t}\n\t\tif (node !== target.actual_end_child) {\n\t\t\t// We only insert if the ordering of this node should be modified or the parent node is not target\n\t\t\tif (node.claim_order !== undefined || node.parentNode !== target) {\n\t\t\t\ttarget.insertBefore(node, target.actual_end_child);\n\t\t\t}\n\t\t} else {\n\t\t\ttarget.actual_end_child = node.nextSibling;\n\t\t}\n\t} else if (node.parentNode !== target || node.nextSibling !== null) {\n\t\ttarget.appendChild(node);\n\t}\n}\n\n/**\n * @param {Node} target\n * @param {Node} node\n * @param {Node} [anchor]\n * @returns {void}\n */\nexport function insert(target, node, anchor) {\n\ttarget.insertBefore(node, anchor || null);\n}\n\n/**\n * @param {NodeEx} target\n * @param {NodeEx} node\n * @param {NodeEx} [anchor]\n * @returns {void}\n */\nexport function insert_hydration(target, node, anchor) {\n\tif (is_hydrating && !anchor) {\n\t\tappend_hydration(target, node);\n\t} else if (node.parentNode !== target || node.nextSibling != anchor) {\n\t\ttarget.insertBefore(node, anchor || null);\n\t}\n}\n\n/**\n * @param {Node} node\n * @returns {void}\n */\nexport function detach(node) {\n\tif (node.parentNode) {\n\t\tnode.parentNode.removeChild(node);\n\t}\n}\n\n/**\n * @returns {void} */\nexport function destroy_each(iterations, detaching) {\n\tfor (let i = 0; i < iterations.length; i += 1) {\n\t\tif (iterations[i]) iterations[i].d(detaching);\n\t}\n}\n\n/**\n * @template {keyof HTMLElementTagNameMap} K\n * @param {K} name\n * @returns {HTMLElementTagNameMap[K]}\n */\nexport function element(name) {\n\treturn document.createElement(name);\n}\n\n/**\n * @template {keyof HTMLElementTagNameMap} K\n * @param {K} name\n * @param {string} is\n * @returns {HTMLElementTagNameMap[K]}\n */\nexport function element_is(name, is) {\n\treturn document.createElement(name, { is });\n}\n\n/**\n * @template T\n * @template {keyof T} K\n * @param {T} obj\n * @param {K[]} exclude\n * @returns {Pick<T, Exclude<keyof T, K>>}\n */\nexport function object_without_properties(obj, exclude) {\n\tconst target = /** @type {Pick<T, Exclude<keyof T, K>>} */ ({});\n\tfor (const k in obj) {\n\t\tif (\n\t\t\thas_prop(obj, k) &&\n\t\t\t// @ts-ignore\n\t\t\texclude.indexOf(k) === -1\n\t\t) {\n\t\t\t// @ts-ignore\n\t\t\ttarget[k] = obj[k];\n\t\t}\n\t}\n\treturn target;\n}\n\n/**\n * @template {keyof SVGElementTagNameMap} K\n * @param {K} name\n * @returns {SVGElement}\n */\nexport function svg_element(name) {\n\treturn document.createElementNS('http://www.w3.org/2000/svg', name);\n}\n\n/**\n * @param {string} data\n * @returns {Text}\n */\nexport function text(data) {\n\treturn document.createTextNode(data);\n}\n\n/**\n * @returns {Text} */\nexport function space() {\n\treturn text(' ');\n}\n\n/**\n * @returns {Text} */\nexport function empty() {\n\treturn text('');\n}\n\n/**\n * @param {string} content\n * @returns {Comment}\n */\nexport function comment(content) {\n\treturn document.createComment(content);\n}\n\n/**\n * @param {EventTarget} node\n * @param {string} event\n * @param {EventListenerOrEventListenerObject} handler\n * @param {boolean | AddEventListenerOptions | EventListenerOptions} [options]\n * @returns {() => void}\n */\nexport function listen(node, event, handler, options) {\n\tnode.addEventListener(event, handler, options);\n\treturn () => node.removeEventListener(event, handler, options);\n}\n\n/**\n * @returns {(event: any) => any} */\nexport function prevent_default(fn) {\n\treturn function (event) {\n\t\tevent.preventDefault();\n\t\t// @ts-ignore\n\t\treturn fn.call(this, event);\n\t};\n}\n\n/**\n * @returns {(event: any) => any} */\nexport function stop_propagation(fn) {\n\treturn function (event) {\n\t\tevent.stopPropagation();\n\t\t// @ts-ignore\n\t\treturn fn.call(this, event);\n\t};\n}\n\n/**\n * @returns {(event: any) => any} */\nexport function stop_immediate_propagation(fn) {\n\treturn function (event) {\n\t\tevent.stopImmediatePropagation();\n\t\t// @ts-ignore\n\t\treturn fn.call(this, event);\n\t};\n}\n\n/**\n * @returns {(event: any) => void} */\nexport function self(fn) {\n\treturn function (event) {\n\t\t// @ts-ignore\n\t\tif (event.target === this) fn.call(this, event);\n\t};\n}\n\n/**\n * @returns {(event: any) => void} */\nexport function trusted(fn) {\n\treturn function (event) {\n\t\t// @ts-ignore\n\t\tif (event.isTrusted) fn.call(this, event);\n\t};\n}\n\n/**\n * @param {Element} node\n * @param {string} attribute\n * @param {string} [value]\n * @returns {void}\n */\nexport function attr(node, attribute, value) {\n\tif (value == null) node.removeAttribute(attribute);\n\telse if (node.getAttribute(attribute) !== value) node.setAttribute(attribute, value);\n}\n/**\n * List of attributes that should always be set through the attr method,\n * because updating them through the property setter doesn't work reliably.\n * In the example of `width`/`height`, the problem is that the setter only\n * accepts numeric values, but the attribute can also be set to a string like `50%`.\n * If this list becomes too big, rethink this approach.\n */\nconst always_set_through_set_attribute = ['width', 'height'];\n\n/**\n * @param {Element & ElementCSSInlineStyle} node\n * @param {{ [x: string]: string }} attributes\n * @returns {void}\n */\nexport function set_attributes(node, attributes) {\n\t// @ts-ignore\n\tconst descriptors = Object.getOwnPropertyDescriptors(node.__proto__);\n\tfor (const key in attributes) {\n\t\tif (attributes[key] == null) {\n\t\t\tnode.removeAttribute(key);\n\t\t} else if (key === 'style') {\n\t\t\tnode.style.cssText = attributes[key];\n\t\t} else if (key === '__value') {\n\t\t\t/** @type {any} */ (node).value = node[key] = attributes[key];\n\t\t} else if (\n\t\t\tdescriptors[key] &&\n\t\t\tdescriptors[key].set &&\n\t\t\talways_set_through_set_attribute.indexOf(key) === -1\n\t\t) {\n\t\t\tnode[key] = attributes[key];\n\t\t} else {\n\t\t\tattr(node, key, attributes[key]);\n\t\t}\n\t}\n}\n\n/**\n * @param {Element & ElementCSSInlineStyle} node\n * @param {{ [x: string]: string }} attributes\n * @returns {void}\n */\nexport function set_svg_attributes(node, attributes) {\n\tfor (const key in attributes) {\n\t\tattr(node, key, attributes[key]);\n\t}\n}\n\n/**\n * @param {Record<string, unknown>} data_map\n * @returns {void}\n */\nexport function set_custom_element_data_map(node, data_map) {\n\tObject.keys(data_map).forEach((key) => {\n\t\tset_custom_element_data(node, key, data_map[key]);\n\t});\n}\n\n/**\n * @returns {void} */\nexport function set_custom_element_data(node, prop, value) {\n\tconst lower = prop.toLowerCase(); // for backwards compatibility with existing behavior we do lowercase first\n\tif (lower in node) {\n\t\tnode[lower] = typeof node[lower] === 'boolean' && value === '' ? true : value;\n\t} else if (prop in node) {\n\t\tnode[prop] = typeof node[prop] === 'boolean' && value === '' ? true : value;\n\t} else {\n\t\tattr(node, prop, value);\n\t}\n}\n\n/**\n * @param {string} tag\n */\nexport function set_dynamic_element_data(tag) {\n\treturn /-/.test(tag) ? set_custom_element_data_map : set_attributes;\n}\n\n/**\n * @returns {void}\n */\nexport function xlink_attr(node, attribute, value) {\n\tnode.setAttributeNS('http://www.w3.org/1999/xlink', attribute, value);\n}\n\n/**\n * @param {HTMLElement} node\n * @returns {string}\n */\nexport function get_svelte_dataset(node) {\n\treturn node.dataset.svelteH;\n}\n\n/**\n * @returns {unknown[]} */\nexport function get_binding_group_value(group, __value, checked) {\n\tconst value = new Set();\n\tfor (let i = 0; i < group.length; i += 1) {\n\t\tif (group[i].checked) value.add(group[i].__value);\n\t}\n\tif (!checked) {\n\t\tvalue.delete(__value);\n\t}\n\treturn Array.from(value);\n}\n\n/**\n * @param {HTMLInputElement[]} group\n * @returns {{ p(...inputs: HTMLInputElement[]): void; r(): void; }}\n */\nexport function init_binding_group(group) {\n\t/**\n\t * @type {HTMLInputElement[]} */\n\tlet _inputs;\n\treturn {\n\t\t/* push */ p(...inputs) {\n\t\t\t_inputs = inputs;\n\t\t\t_inputs.forEach((input) => group.push(input));\n\t\t},\n\t\t/* remove */ r() {\n\t\t\t_inputs.forEach((input) => group.splice(group.indexOf(input), 1));\n\t\t}\n\t};\n}\n\n/**\n * @param {number[]} indexes\n * @returns {{ u(new_indexes: number[]): void; p(...inputs: HTMLInputElement[]): void; r: () => void; }}\n */\nexport function init_binding_group_dynamic(group, indexes) {\n\t/**\n\t * @type {HTMLInputElement[]} */\n\tlet _group = get_binding_group(group);\n\n\t/**\n\t * @type {HTMLInputElement[]} */\n\tlet _inputs;\n\n\tfunction get_binding_group(group) {\n\t\tfor (let i = 0; i < indexes.length; i++) {\n\t\t\tgroup = group[indexes[i]] = group[indexes[i]] || [];\n\t\t}\n\t\treturn group;\n\t}\n\n\t/**\n\t * @returns {void} */\n\tfunction push() {\n\t\t_inputs.forEach((input) => _group.push(input));\n\t}\n\n\t/**\n\t * @returns {void} */\n\tfunction remove() {\n\t\t_inputs.forEach((input) => _group.splice(_group.indexOf(input), 1));\n\t}\n\treturn {\n\t\t/* update */ u(new_indexes) {\n\t\t\tindexes = new_indexes;\n\t\t\tconst new_group = get_binding_group(group);\n\t\t\tif (new_group !== _group) {\n\t\t\t\tremove();\n\t\t\t\t_group = new_group;\n\t\t\t\tpush();\n\t\t\t}\n\t\t},\n\t\t/* push */ p(...inputs) {\n\t\t\t_inputs = inputs;\n\t\t\tpush();\n\t\t},\n\t\t/* remove */ r: remove\n\t};\n}\n\n/** @returns {number} */\nexport function to_number(value) {\n\treturn value === '' ? null : +value;\n}\n\n/** @returns {any[]} */\nexport function time_ranges_to_array(ranges) {\n\tconst array = [];\n\tfor (let i = 0; i < ranges.length; i += 1) {\n\t\tarray.push({ start: ranges.start(i), end: ranges.end(i) });\n\t}\n\treturn array;\n}\n\n/**\n * @param {Element} element\n * @returns {ChildNode[]}\n */\nexport function children(element) {\n\treturn Array.from(element.childNodes);\n}\n\n/**\n * @param {ChildNodeArray} nodes\n * @returns {void}\n */\nfunction init_claim_info(nodes) {\n\tif (nodes.claim_info === undefined) {\n\t\tnodes.claim_info = { last_index: 0, total_claimed: 0 };\n\t}\n}\n\n/**\n * @template {ChildNodeEx} R\n * @param {ChildNodeArray} nodes\n * @param {(node: ChildNodeEx) => node is R} predicate\n * @param {(node: ChildNodeEx) => ChildNodeEx | undefined} process_node\n * @param {() => R} create_node\n * @param {boolean} dont_update_last_index\n * @returns {R}\n */\nfunction claim_node(nodes, predicate, process_node, create_node, dont_update_last_index = false) {\n\t// Try to find nodes in an order such that we lengthen the longest increasing subsequence\n\tinit_claim_info(nodes);\n\tconst result_node = (() => {\n\t\t// We first try to find an element after the previous one\n\t\tfor (let i = nodes.claim_info.last_index; i < nodes.length; i++) {\n\t\t\tconst node = nodes[i];\n\t\t\tif (predicate(node)) {\n\t\t\t\tconst replacement = process_node(node);\n\t\t\t\tif (replacement === undefined) {\n\t\t\t\t\tnodes.splice(i, 1);\n\t\t\t\t} else {\n\t\t\t\t\tnodes[i] = replacement;\n\t\t\t\t}\n\t\t\t\tif (!dont_update_last_index) {\n\t\t\t\t\tnodes.claim_info.last_index = i;\n\t\t\t\t}\n\t\t\t\treturn node;\n\t\t\t}\n\t\t}\n\t\t// Otherwise, we try to find one before\n\t\t// We iterate in reverse so that we don't go too far back\n\t\tfor (let i = nodes.claim_info.last_index - 1; i >= 0; i--) {\n\t\t\tconst node = nodes[i];\n\t\t\tif (predicate(node)) {\n\t\t\t\tconst replacement = process_node(node);\n\t\t\t\tif (replacement === undefined) {\n\t\t\t\t\tnodes.splice(i, 1);\n\t\t\t\t} else {\n\t\t\t\t\tnodes[i] = replacement;\n\t\t\t\t}\n\t\t\t\tif (!dont_update_last_index) {\n\t\t\t\t\tnodes.claim_info.last_index = i;\n\t\t\t\t} else if (replacement === undefined) {\n\t\t\t\t\t// Since we spliced before the last_index, we decrease it\n\t\t\t\t\tnodes.claim_info.last_index--;\n\t\t\t\t}\n\t\t\t\treturn node;\n\t\t\t}\n\t\t}\n\t\t// If we can't find any matching node, we create a new one\n\t\treturn create_node();\n\t})();\n\tresult_node.claim_order = nodes.claim_info.total_claimed;\n\tnodes.claim_info.total_claimed += 1;\n\treturn result_node;\n}\n\n/**\n * @param {ChildNodeArray} nodes\n * @param {string} name\n * @param {{ [key: string]: boolean }} attributes\n * @param {(name: string) => Element | SVGElement} create_element\n * @returns {Element | SVGElement}\n */\nfunction claim_element_base(nodes, name, attributes, create_element) {\n\treturn claim_node(\n\t\tnodes,\n\t\t/** @returns {node is Element | SVGElement} */\n\t\t(node) => node.nodeName === name,\n\t\t/** @param {Element} node */\n\t\t(node) => {\n\t\t\tconst remove = [];\n\t\t\tfor (let j = 0; j < node.attributes.length; j++) {\n\t\t\t\tconst attribute = node.attributes[j];\n\t\t\t\tif (!attributes[attribute.name]) {\n\t\t\t\t\tremove.push(attribute.name);\n\t\t\t\t}\n\t\t\t}\n\t\t\tremove.forEach((v) => node.removeAttribute(v));\n\t\t\treturn undefined;\n\t\t},\n\t\t() => create_element(name)\n\t);\n}\n\n/**\n * @param {ChildNodeArray} nodes\n * @param {string} name\n * @param {{ [key: string]: boolean }} attributes\n * @returns {Element | SVGElement}\n */\nexport function claim_element(nodes, name, attributes) {\n\treturn claim_element_base(nodes, name, attributes, element);\n}\n\n/**\n * @param {ChildNodeArray} nodes\n * @param {string} name\n * @param {{ [key: string]: boolean }} attributes\n * @returns {Element | SVGElement}\n */\nexport function claim_svg_element(nodes, name, attributes) {\n\treturn claim_element_base(nodes, name, attributes, svg_element);\n}\n\n/**\n * @param {ChildNodeArray} nodes\n * @returns {Text}\n */\nexport function claim_text(nodes, data) {\n\treturn claim_node(\n\t\tnodes,\n\t\t/** @returns {node is Text} */\n\t\t(node) => node.nodeType === 3,\n\t\t/** @param {Text} node */\n\t\t(node) => {\n\t\t\tconst data_str = '' + data;\n\t\t\tif (node.data.startsWith(data_str)) {\n\t\t\t\tif (node.data.length !== data_str.length) {\n\t\t\t\t\treturn node.splitText(data_str.length);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tnode.data = data_str;\n\t\t\t}\n\t\t},\n\t\t() => text(data),\n\t\ttrue // Text nodes should not update last index since it is likely not worth it to eliminate an increasing subsequence of actual elements\n\t);\n}\n\n/**\n * @returns {Text} */\nexport function claim_space(nodes) {\n\treturn claim_text(nodes, ' ');\n}\n\n/**\n * @param {ChildNodeArray} nodes\n * @returns {Comment}\n */\nexport function claim_comment(nodes, data) {\n\treturn claim_node(\n\t\tnodes,\n\t\t/** @returns {node is Comment} */\n\t\t(node) => node.nodeType === 8,\n\t\t/** @param {Comment} node */\n\t\t(node) => {\n\t\t\tnode.data = '' + data;\n\t\t\treturn undefined;\n\t\t},\n\t\t() => comment(data),\n\t\ttrue\n\t);\n}\n\nfunction get_comment_idx(nodes, text, start) {\n\tfor (let i = start; i < nodes.length; i += 1) {\n\t\tconst node = nodes[i];\n\t\tif (node.nodeType === 8 /* comment node */ && node.textContent.trim() === text) {\n\t\t\treturn i;\n\t\t}\n\t}\n\treturn -1;\n}\n\n/**\n * @param {boolean} is_svg\n * @returns {HtmlTagHydration}\n */\nexport function claim_html_tag(nodes, is_svg) {\n\t// find html opening tag\n\tconst start_index = get_comment_idx(nodes, 'HTML_TAG_START', 0);\n\tconst end_index = get_comment_idx(nodes, 'HTML_TAG_END', start_index + 1);\n\tif (start_index === -1 || end_index === -1) {\n\t\treturn new HtmlTagHydration(is_svg);\n\t}\n\n\tinit_claim_info(nodes);\n\tconst html_tag_nodes = nodes.splice(start_index, end_index - start_index + 1);\n\tdetach(html_tag_nodes[0]);\n\tdetach(html_tag_nodes[html_tag_nodes.length - 1]);\n\tconst claimed_nodes = html_tag_nodes.slice(1, html_tag_nodes.length - 1);\n\tif (claimed_nodes.length === 0) {\n\t\treturn new HtmlTagHydration(is_svg);\n\t}\n\tfor (const n of claimed_nodes) {\n\t\tn.claim_order = nodes.claim_info.total_claimed;\n\t\tnodes.claim_info.total_claimed += 1;\n\t}\n\treturn new HtmlTagHydration(is_svg, claimed_nodes);\n}\n\n/**\n * @param {Text} text\n * @param {unknown} data\n * @returns {void}\n */\nexport function set_data(text, data) {\n\tdata = '' + data;\n\tif (text.data === data) return;\n\ttext.data = /** @type {string} */ (data);\n}\n\n/**\n * @param {Text} text\n * @param {unknown} data\n * @returns {void}\n */\nexport function set_data_contenteditable(text, data) {\n\tdata = '' + data;\n\tif (text.wholeText === data) return;\n\ttext.data = /** @type {string} */ (data);\n}\n\n/**\n * @param {Text} text\n * @param {unknown} data\n * @param {string} attr_value\n * @returns {void}\n */\nexport function set_data_maybe_contenteditable(text, data, attr_value) {\n\tif (~contenteditable_truthy_values.indexOf(attr_value)) {\n\t\tset_data_contenteditable(text, data);\n\t} else {\n\t\tset_data(text, data);\n\t}\n}\n\n/**\n * @returns {void} */\nexport function set_input_value(input, value) {\n\tinput.value = value == null ? '' : value;\n}\n\n/**\n * @returns {void} */\nexport function set_input_type(input, type) {\n\ttry {\n\t\tinput.type = type;\n\t} catch (e) {\n\t\t// do nothing\n\t}\n}\n\n/**\n * @returns {void} */\nexport function set_style(node, key, value, important) {\n\tif (value == null) {\n\t\tnode.style.removeProperty(key);\n\t} else {\n\t\tnode.style.setProperty(key, value, important ? 'important' : '');\n\t}\n}\n\n/**\n * @returns {void} */\nexport function select_option(select, value, mounting) {\n\tfor (let i = 0; i < select.options.length; i += 1) {\n\t\tconst option = select.options[i];\n\t\tif (option.__value === value) {\n\t\t\toption.selected = true;\n\t\t\treturn;\n\t\t}\n\t}\n\tif (!mounting || value !== undefined) {\n\t\tselect.selectedIndex = -1; // no option should be selected\n\t}\n}\n\n/**\n * @returns {void} */\nexport function select_options(select, value) {\n\tfor (let i = 0; i < select.options.length; i += 1) {\n\t\tconst option = select.options[i];\n\t\toption.selected = ~value.indexOf(option.__value);\n\t}\n}\n\nexport function select_value(select) {\n\tconst selected_option = select.querySelector(':checked');\n\treturn selected_option && selected_option.__value;\n}\n\nexport function select_multiple_value(select) {\n\treturn [].map.call(select.querySelectorAll(':checked'), (option) => option.__value);\n}\n// unfortunately this can't be a constant as that wouldn't be tree-shakeable\n// so we cache the result instead\n\n/**\n * @type {boolean} */\nlet crossorigin;\n\n/**\n * @returns {boolean} */\nexport function is_crossorigin() {\n\tif (crossorigin === undefined) {\n\t\tcrossorigin = false;\n\t\ttry {\n\t\t\tif (typeof window !== 'undefined' && window.parent) {\n\t\t\t\tvoid window.parent.document;\n\t\t\t}\n\t\t} catch (error) {\n\t\t\tcrossorigin = true;\n\t\t}\n\t}\n\treturn crossorigin;\n}\n\n/**\n * @param {HTMLElement} node\n * @param {() => void} fn\n * @returns {() => void}\n */\nexport function add_iframe_resize_listener(node, fn) {\n\tconst computed_style = getComputedStyle(node);\n\tif (computed_style.position === 'static') {\n\t\tnode.style.position = 'relative';\n\t}\n\tconst iframe = element('iframe');\n\tiframe.setAttribute(\n\t\t'style',\n\t\t'display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; ' +\n\t\t\t'overflow: hidden; border: 0; opacity: 0; pointer-events: none; z-index: -1;'\n\t);\n\tiframe.setAttribute('aria-hidden', 'true');\n\tiframe.tabIndex = -1;\n\tconst crossorigin = is_crossorigin();\n\n\t/**\n\t * @type {() => void}\n\t */\n\tlet unsubscribe;\n\tif (crossorigin) {\n\t\tiframe.src = \"data:text/html,<script>onresize=function(){parent.postMessage(0,'*')}</script>\";\n\t\tunsubscribe = listen(\n\t\t\twindow,\n\t\t\t'message',\n\t\t\t/** @param {MessageEvent} event */ (event) => {\n\t\t\t\tif (event.source === iframe.contentWindow) fn();\n\t\t\t}\n\t\t);\n\t} else {\n\t\tiframe.src = 'about:blank';\n\t\tiframe.onload = () => {\n\t\t\tunsubscribe = listen(iframe.contentWindow, 'resize', fn);\n\t\t\t// make sure an initial resize event is fired _after_ the iframe is loaded (which is asynchronous)\n\t\t\t// see https://github.com/sveltejs/svelte/issues/4233\n\t\t\tfn();\n\t\t};\n\t}\n\tappend(node, iframe);\n\treturn () => {\n\t\tif (crossorigin) {\n\t\t\tunsubscribe();\n\t\t} else if (unsubscribe && iframe.contentWindow) {\n\t\t\tunsubscribe();\n\t\t}\n\t\tdetach(iframe);\n\t};\n}\nexport const resize_observer_content_box = /* @__PURE__ */ new ResizeObserverSingleton({\n\tbox: 'content-box'\n});\nexport const resize_observer_border_box = /* @__PURE__ */ new ResizeObserverSingleton({\n\tbox: 'border-box'\n});\nexport const resize_observer_device_pixel_content_box = /* @__PURE__ */ new ResizeObserverSingleton(\n\t{ box: 'device-pixel-content-box' }\n);\nexport { ResizeObserverSingleton };\n\n/**\n * @returns {void} */\nexport function toggle_class(element, name, toggle) {\n\t// The `!!` is required because an `undefined` flag means flipping the current state.\n\telement.classList.toggle(name, !!toggle);\n}\n\n/**\n * @template T\n * @param {string} type\n * @param {T} [detail]\n * @param {{ bubbles?: boolean, cancelable?: boolean }} [options]\n * @returns {CustomEvent<T>}\n */\nexport function custom_event(type, detail, { bubbles = false, cancelable = false } = {}) {\n\treturn new CustomEvent(type, { detail, bubbles, cancelable });\n}\n\n/**\n * @param {string} selector\n * @param {HTMLElement} parent\n * @returns {ChildNodeArray}\n */\nexport function query_selector_all(selector, parent = document.body) {\n\treturn Array.from(parent.querySelectorAll(selector));\n}\n\n/**\n * @param {string} nodeId\n * @param {HTMLElement} head\n * @returns {any[]}\n */\nexport function head_selector(nodeId, head) {\n\tconst result = [];\n\tlet started = 0;\n\tfor (const node of head.childNodes) {\n\t\tif (node.nodeType === 8 /* comment node */) {\n\t\t\tconst comment = node.textContent.trim();\n\t\t\tif (comment === `HEAD_${nodeId}_END`) {\n\t\t\t\tstarted -= 1;\n\t\t\t\tresult.push(node);\n\t\t\t} else if (comment === `HEAD_${nodeId}_START`) {\n\t\t\t\tstarted += 1;\n\t\t\t\tresult.push(node);\n\t\t\t}\n\t\t} else if (started > 0) {\n\t\t\tresult.push(node);\n\t\t}\n\t}\n\treturn result;\n}\n/** */\nexport class HtmlTag {\n\t/**\n\t * @private\n\t * @default false\n\t */\n\tis_svg = false;\n\t/** parent for creating node */\n\te = undefined;\n\t/** html tag nodes */\n\tn = undefined;\n\t/** target */\n\tt = undefined;\n\t/** anchor */\n\ta = undefined;\n\tconstructor(is_svg = false) {\n\t\tthis.is_svg = is_svg;\n\t\tthis.e = this.n = null;\n\t}\n\n\t/**\n\t * @param {string} html\n\t * @returns {void}\n\t */\n\tc(html) {\n\t\tthis.h(html);\n\t}\n\n\t/**\n\t * @param {string} html\n\t * @param {HTMLElement | SVGElement} target\n\t * @param {HTMLElement | SVGElement} anchor\n\t * @returns {void}\n\t */\n\tm(html, target, anchor = null) {\n\t\tif (!this.e) {\n\t\t\tif (this.is_svg)\n\t\t\t\tthis.e = svg_element(/** @type {keyof SVGElementTagNameMap} */ (target.nodeName));\n\t\t\t/** #7364 target for <template> may be provided as #document-fragment(11) */ else\n\t\t\t\tthis.e = element(\n\t\t\t\t\t/** @type {keyof HTMLElementTagNameMap} */ (\n\t\t\t\t\t\ttarget.nodeType === 11 ? 'TEMPLATE' : target.nodeName\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\tthis.t =\n\t\t\t\ttarget.tagName !== 'TEMPLATE'\n\t\t\t\t\t? target\n\t\t\t\t\t: /** @type {HTMLTemplateElement} */ (target).content;\n\t\t\tthis.c(html);\n\t\t}\n\t\tthis.i(anchor);\n\t}\n\n\t/**\n\t * @param {string} html\n\t * @returns {void}\n\t */\n\th(html) {\n\t\tthis.e.innerHTML = html;\n\t\tthis.n = Array.from(\n\t\t\tthis.e.nodeName === 'TEMPLATE' ? this.e.content.childNodes : this.e.childNodes\n\t\t);\n\t}\n\n\t/**\n\t * @returns {void} */\n\ti(anchor) {\n\t\tfor (let i = 0; i < this.n.length; i += 1) {\n\t\t\tinsert(this.t, this.n[i], anchor);\n\t\t}\n\t}\n\n\t/**\n\t * @param {string} html\n\t * @returns {void}\n\t */\n\tp(html) {\n\t\tthis.d();\n\t\tthis.h(html);\n\t\tthis.i(this.a);\n\t}\n\n\t/**\n\t * @returns {void} */\n\td() {\n\t\tthis.n.forEach(detach);\n\t}\n}\n\nexport class HtmlTagHydration extends HtmlTag {\n\t/** @type {Element[]} hydration claimed nodes */\n\tl = undefined;\n\n\tconstructor(is_svg = false, claimed_nodes) {\n\t\tsuper(is_svg);\n\t\tthis.e = this.n = null;\n\t\tthis.l = claimed_nodes;\n\t}\n\n\t/**\n\t * @param {string} html\n\t * @returns {void}\n\t */\n\tc(html) {\n\t\tif (this.l) {\n\t\t\tthis.n = this.l;\n\t\t} else {\n\t\t\tsuper.c(html);\n\t\t}\n\t}\n\n\t/**\n\t * @returns {void} */\n\ti(anchor) {\n\t\tfor (let i = 0; i < this.n.length; i += 1) {\n\t\t\tinsert_hydration(this.t, this.n[i], anchor);\n\t\t}\n\t}\n}\n\n/**\n * @param {NamedNodeMap} attributes\n * @returns {{}}\n */\nexport function attribute_to_object(attributes) {\n\tconst result = {};\n\tfor (const attribute of attributes) {\n\t\tresult[attribute.name] = attribute.value;\n\t}\n\treturn result;\n}\n\nconst escaped = {\n\t'\"': '"',\n\t'&': '&',\n\t'<': '<'\n};\n\nconst regex_attribute_characters_to_escape = /[\"&<]/g;\n\n/**\n * Note that the attribute itself should be surrounded in double quotes\n * @param {any} attribute\n */\nfunction escape_attribute(attribute) {\n\treturn String(attribute).replace(regex_attribute_characters_to_escape, (match) => escaped[match]);\n}\n\n/**\n * @param {Record<string, string>} attributes\n */\nexport function stringify_spread(attributes) {\n\tlet str = ' ';\n\tfor (const key in attributes) {\n\t\tif (attributes[key] != null) {\n\t\t\tstr += `${key}=\"${escape_attribute(attributes[key])}\" `;\n\t\t}\n\t}\n\n\treturn str;\n}\n\n/**\n * @param {HTMLElement} element\n * @returns {{}}\n */\nexport function get_custom_elements_slots(element) {\n\tconst result = {};\n\telement.childNodes.forEach(\n\t\t/** @param {Element} node */ (node) => {\n\t\t\tresult[node.slot || 'default'] = true;\n\t\t}\n\t);\n\treturn result;\n}\n\nexport function construct_svelte_component(component, props) {\n\treturn new component(props);\n}\n\n/**\n * @typedef {Node & {\n * \tclaim_order?: number;\n * \thydrate_init?: true;\n * \tactual_end_child?: NodeEx;\n * \tchildNodes: NodeListOf<NodeEx>;\n * }} NodeEx\n */\n\n/** @typedef {ChildNode & NodeEx} ChildNodeEx */\n\n/** @typedef {NodeEx & { claim_order: number }} NodeEx2 */\n\n/**\n * @typedef {ChildNodeEx[] & {\n * \tclaim_info?: {\n * \t\tlast_index: number;\n * \t\ttotal_claimed: number;\n * \t};\n * }} ChildNodeArray\n */\n","import { append_empty_stylesheet, detach, get_root_for_style } from './dom.js';\nimport { raf } from './environment.js';\n\n// we need to store the information for multiple documents because a Svelte application could also contain iframes\n// https://github.com/sveltejs/svelte/issues/3624\n/** @type {Map<Document | ShadowRoot, import('./private.d.ts').StyleInformation>} */\nconst managed_styles = new Map();\n\nlet active = 0;\n\n// https://github.com/darkskyapp/string-hash/blob/master/index.js\n/**\n * @param {string} str\n * @returns {number}\n */\nfunction hash(str) {\n\tlet hash = 5381;\n\tlet i = str.length;\n\twhile (i--) hash = ((hash << 5) - hash) ^ str.charCodeAt(i);\n\treturn hash >>> 0;\n}\n\n/**\n * @param {Document | ShadowRoot} doc\n * @param {Element & ElementCSSInlineStyle} node\n * @returns {{ stylesheet: any; rules: {}; }}\n */\nfunction create_style_information(doc, node) {\n\tconst info = { stylesheet: append_empty_stylesheet(node), rules: {} };\n\tmanaged_styles.set(doc, info);\n\treturn info;\n}\n\n/**\n * @param {Element & ElementCSSInlineStyle} node\n * @param {number} a\n * @param {number} b\n * @param {number} duration\n * @param {number} delay\n * @param {(t: number) => number} ease\n * @param {(t: number, u: number) => string} fn\n * @param {number} uid\n * @returns {string}\n */\nexport function create_rule(node, a, b, duration, delay, ease, fn, uid = 0) {\n\tconst step = 16.666 / duration;\n\tlet keyframes = '{\\n';\n\tfor (let p = 0; p <= 1; p += step) {\n\t\tconst t = a + (b - a) * ease(p);\n\t\tkeyframes += p * 100 + `%{${fn(t, 1 - t)}}\\n`;\n\t}\n\tconst rule = keyframes + `100% {${fn(b, 1 - b)}}\\n}`;\n\tconst name = `__svelte_${hash(rule)}_${uid}`;\n\tconst doc = get_root_for_style(node);\n\tconst { stylesheet, rules } = managed_styles.get(doc) || create_style_information(doc, node);\n\tif (!rules[name]) {\n\t\trules[name] = true;\n\t\tstylesheet.insertRule(`@keyframes ${name} ${rule}`, stylesheet.cssRules.length);\n\t}\n\tconst animation = node.style.animation || '';\n\tnode.style.animation = `${\n\t\tanimation ? `${animation}, ` : ''\n\t}${name} ${duration}ms linear ${delay}ms 1 both`;\n\tactive += 1;\n\treturn name;\n}\n\n/**\n * @param {Element & ElementCSSInlineStyle} node\n * @param {string} [name]\n * @returns {void}\n */\nexport function delete_rule(node, name) {\n\tconst previous = (node.style.animation || '').split(', ');\n\tconst next = previous.filter(\n\t\tname\n\t\t\t? (anim) => anim.indexOf(name) < 0 // remove specific animation\n\t\t\t: (anim) => anim.indexOf('__svelte') === -1 // remove all Svelte animations\n\t);\n\tconst deleted = previous.length - next.length;\n\tif (deleted) {\n\t\tnode.style.animation = next.join(', ');\n\t\tactive -= deleted;\n\t\tif (!active) clear_rules();\n\t}\n}\n\n/** @returns {void} */\nexport function clear_rules() {\n\traf(() => {\n\t\tif (active) return;\n\t\tmanaged_styles.forEach((info) => {\n\t\t\tconst { ownerNode } = info.stylesheet;\n\t\t\t// there is no ownerNode if it runs on jsdom.\n\t\t\tif (ownerNode) detach(ownerNode);\n\t\t});\n\t\tmanaged_styles.clear();\n\t});\n}\n","import { custom_event } from './dom.js';\n\nexport let current_component;\n\n/** @returns {void} */\nexport function set_current_component(component) {\n\tcurrent_component = component;\n}\n\nexport function get_current_component() {\n\tif (!current_component) throw new Error('Function called outside component initialization');\n\treturn current_component;\n}\n\n/**\n * Schedules a callback to run immediately before the component is updated after any state change.\n *\n * The first time the callback runs will be before the initial `onMount`\n *\n * https://svelte.dev/docs/svelte#beforeupdate\n * @param {() => any} fn\n * @returns {void}\n */\nexport function beforeUpdate(fn) {\n\tget_current_component().$$.before_update.push(fn);\n}\n\n/**\n * The `onMount` function schedules a callback to run as soon as the component has been mounted to the DOM.\n * It must be called during the component's initialisation (but doesn't need to live *inside* the component;\n * it can be called from an external module).\n *\n * If a function is returned _synchronously_ from `onMount`, it will be called when the component is unmounted.\n *\n * `onMount` does not run inside a [server-side component](https://svelte.dev/docs#run-time-server-side-component-api).\n *\n * https://svelte.dev/docs/svelte#onmount\n * @template T\n * @param {() => import('./private.js').NotFunction<T> | Promise<import('./private.js').NotFunction<T>> | (() => any)} fn\n * @returns {void}\n */\nexport function onMount(fn) {\n\tget_current_component().$$.on_mount.push(fn);\n}\n\n/**\n * Schedules a callback to run immediately after the component has been updated.\n *\n * The first time the callback runs will be after the initial `onMount`\n *\n * https://svelte.dev/docs/svelte#afterupdate\n * @param {() => any} fn\n * @returns {void}\n */\nexport function afterUpdate(fn) {\n\tget_current_component().$$.after_update.push(fn);\n}\n\n/**\n * Schedules a callback to run immediately before the component is unmounted.\n *\n * Out of `onMount`, `beforeUpdate`, `afterUpdate` and `onDestroy`, this is the\n * only one that runs inside a server-side component.\n *\n * https://svelte.dev/docs/svelte#ondestroy\n * @param {() => any} fn\n * @returns {void}\n */\nexport function onDestroy(fn) {\n\tget_current_component().$$.on_destroy.push(fn);\n}\n\n/**\n * Creates an event dispatcher that can be used to dispatch [component events](https://svelte.dev/docs#template-syntax-component-directives-on-eventname).\n * Event dispatchers are functions that can take two arguments: `name` and `detail`.\n *\n * Component events created with `createEventDispatcher` create a\n * [CustomEvent](https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent).\n * These events do not [bubble](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Event_bubbling_and_capture).\n * The `detail` argument corresponds to the [CustomEvent.detail](https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail)\n * property and can contain any type of data.\n *\n * The event dispatcher can be typed to narrow the allowed event names and the type of the `detail` argument:\n * ```ts\n * const dispatch = createEventDispatcher<{\n * loaded: never; // does not take a detail argument\n * change: string; // takes a detail argument of type string, which is required\n * optional: number | null; // takes an optional detail argument of type number\n * }>();\n * ```\n *\n * https://svelte.dev/docs/svelte#createeventdispatcher\n * @template {Record<string, any>} [EventMap=any]\n * @returns {import('./public.js').EventDispatcher<EventMap>}\n */\nexport function createEventDispatcher() {\n\tconst component = get_current_component();\n\treturn (type, detail, { cancelable = false } = {}) => {\n\t\tconst callbacks = component.$$.callbacks[type];\n\t\tif (callbacks) {\n\t\t\t// TODO are there situations where events could be dispatched\n\t\t\t// in a server (non-DOM) environment?\n\t\t\tconst event = custom_event(/** @type {string} */ (type), detail, { cancelable });\n\t\t\tcallbacks.slice().forEach((fn) => {\n\t\t\t\tfn.call(component, event);\n\t\t\t});\n\t\t\treturn !event.defaultPrevented;\n\t\t}\n\t\treturn true;\n\t};\n}\n\n/**\n * Associates an arbitrary `context` object with the current component and the specified `key`\n * and returns that object. The context is then available to children of the component\n * (including slotted content) with `getContext`.\n *\n * Like lifecycle functions, this must be called during component initialisation.\n *\n * https://svelte.dev/docs/svelte#setcontext\n * @template T\n * @param {any} key\n * @param {T} context\n * @returns {T}\n */\nexport function setContext(key, context) {\n\tget_current_component().$$.context.set(key, context);\n\treturn context;\n}\n\n/**\n * Retrieves the context that belongs to the closest parent component with the specified `key`.\n * Must be called during component initialisation.\n *\n * https://svelte.dev/docs/svelte#getcontext\n * @template T\n * @param {any} key\n * @returns {T}\n */\nexport function getContext(key) {\n\treturn get_current_component().$$.context.get(key);\n}\n\n/**\n * Retrieves the whole context map that belongs to the closest parent component.\n * Must be called during component initialisation. Useful, for example, if you\n * programmatically create a component and want to pass the existing context to it.\n *\n * https://svelte.dev/docs/svelte#getallcontexts\n * @template {Map<any, any>} [T=Map<any, any>]\n * @returns {T}\n */\nexport function getAllContexts() {\n\treturn get_current_component().$$.context;\n}\n\n/**\n * Checks whether a given `key` has been set in the context of a parent component.\n * Must be called during component initialisation.\n *\n * https://svelte.dev/docs/svelte#hascontext\n * @param {any} key\n * @returns {boolean}\n */\nexport function hasContext(key) {\n\treturn get_current_component().$$.context.has(key);\n}\n\n// TODO figure out if we still want to support\n// shorthand events, or if we want to implement\n// a real bubbling mechanism\n/**\n * @param component\n * @param event\n * @returns {void}\n */\nexport function bubble(component, event) {\n\tconst callbacks = component.$$.callbacks[event.type];\n\tif (callbacks) {\n\t\t// @ts-ignore\n\t\tcallbacks.slice().forEach((fn) => fn.call(this, event));\n\t}\n}\n","import { run_all } from './utils.js';\nimport { current_component, set_current_component } from './lifecycle.js';\n\nexport const dirty_components = [];\nexport const intros = { enabled: false };\nexport const binding_callbacks = [];\n\nlet render_callbacks = [];\n\nconst flush_callbacks = [];\n\nconst resolved_promise = /* @__PURE__ */ Promise.resolve();\n\nlet update_scheduled = false;\n\n/** @returns {void} */\nexport function schedule_update() {\n\tif (!update_scheduled) {\n\t\tupdate_scheduled = true;\n\t\tresolved_promise.then(flush);\n\t}\n}\n\n/** @returns {Promise<void>} */\nexport function tick() {\n\tschedule_update();\n\treturn resolved_promise;\n}\n\n/** @returns {void} */\nexport function add_render_callback(fn) {\n\trender_callbacks.push(fn);\n}\n\n/** @returns {void} */\nexport function add_flush_callback(fn) {\n\tflush_callbacks.push(fn);\n}\n\n// flush() calls callbacks in this order:\n// 1. All beforeUpdate callbacks, in order: parents before children\n// 2. All bind:this callbacks, in reverse order: children before parents.\n// 3. All afterUpdate callbacks, in order: parents before children. EXCEPT\n// for afterUpdates called during the initial onMount, which are called in\n// reverse order: children before parents.\n// Since callbacks might update component values, which could trigger another\n// call to flush(), the following steps guard against this:\n// 1. During beforeUpdate, any updated components will be added to the\n// dirty_components array and will cause a reentrant call to flush(). Because\n// the flush index is kept outside the function, the reentrant call will pick\n// up where the earlier call left off and go through all dirty components. The\n// current_component value is saved and restored so that the reentrant call will\n// not interfere with the \"parent\" flush() call.\n// 2. bind:this callbacks cannot trigger new flush() calls.\n// 3. During afterUpdate, any updated components will NOT have their afterUpdate\n// callback called a second time; the seen_callbacks set, outside the flush()\n// function, guarantees this behavior.\nconst seen_callbacks = new Set();\n\nlet flushidx = 0; // Do *not* move this inside the flush() function\n\n/** @returns {void} */\nexport function flush() {\n\t// Do not reenter flush while dirty components are updated, as this can\n\t// result in an infinite loop. Instead, let the inner flush handle it.\n\t// Reentrancy is ok afterwards for bindings etc.\n\tif (flushidx !== 0) {\n\t\treturn;\n\t}\n\tconst saved_component = current_component;\n\tdo {\n\t\t// first, call beforeUpdate functions\n\t\t// and update components\n\t\ttry {\n\t\t\twhile (flushidx < dirty_components.length) {\n\t\t\t\tconst component = dirty_components[flushidx];\n\t\t\t\tflushidx++;\n\t\t\t\tset_current_component(component);\n\t\t\t\tupdate(component.$$);\n\t\t\t}\n\t\t} catch (e) {\n\t\t\t// reset dirty state to not end up in a deadlocked state and then rethrow\n\t\t\tdirty_components.length = 0;\n\t\t\tflushidx = 0;\n\t\t\tthrow e;\n\t\t}\n\t\tset_current_component(null);\n\t\tdirty_components.length = 0;\n\t\tflushidx = 0;\n\t\twhile (binding_callbacks.length) binding_callbacks.pop()();\n\t\t// then, once components are updated, call\n\t\t// afterUpdate functions. This may cause\n\t\t// subsequent updates...\n\t\tfor (let i = 0; i < render_callbacks.length; i += 1) {\n\t\t\tconst callback = render_callbacks[i];\n\t\t\tif (!seen_callbacks.has(callback)) {\n\t\t\t\t// ...so guard against infinite loops\n\t\t\t\tseen_callbacks.add(callback);\n\t\t\t\tcallback();\n\t\t\t}\n\t\t}\n\t\trender_callbacks.length = 0;\n\t} while (dirty_components.length);\n\twhile (flush_callbacks.length) {\n\t\tflush_callbacks.pop()();\n\t}\n\tupdate_scheduled = false;\n\tseen_callbacks.clear();\n\tset_current_component(saved_component);\n}\n\n/** @returns {void} */\nfunction update($$) {\n\tif ($$.fragment !== null) {\n\t\t$$.update();\n\t\trun_all($$.before_update);\n\t\tconst dirty = $$.dirty;\n\t\t$$.dirty = [-1];\n\t\t$$.fragment && $$.fragment.p($$.ctx, dirty);\n\t\t$$.after_update.forEach(add_render_callback);\n\t}\n}\n\n/**\n * Useful for example to execute remaining `afterUpdate` callbacks before executing `destroy`.\n * @param {Function[]} fns\n * @returns {void}\n */\nexport function flush_render_callbacks(fns) {\n\tconst filtered = [];\n\tconst targets = [];\n\trender_callbacks.forEach((c) => (fns.indexOf(c) === -1 ? filtered.push(c) : targets.push(c)));\n\ttargets.forEach((c) => c());\n\trender_callbacks = filtered;\n}\n","import { identity as linear, is_function, noop, run_all } from './utils.js';\nimport { now } from './environment.js';\nimport { loop } from './loop.js';\nimport { create_rule, delete_rule } from './style_manager.js';\nimport { custom_event } from './dom.js';\nimport { add_render_callback } from './scheduler.js';\n\n/**\n * @type {Promise<void> | null}\n */\nlet promise;\n\n/**\n * @returns {Promise<void>}\n */\nfunction wait() {\n\tif (!promise) {\n\t\tpromise = Promise.resolve();\n\t\tpromise.then(() => {\n\t\t\tpromise = null;\n\t\t});\n\t}\n\treturn promise;\n}\n\n/**\n * @param {Element} node\n * @param {INTRO | OUTRO | boolean} direction\n * @param {'start' | 'end'} kind\n * @returns {void}\n */\nfunction dispatch(node, direction, kind) {\n\tnode.dispatchEvent(custom_event(`${direction ? 'intro' : 'outro'}${kind}`));\n}\n\nconst outroing = new Set();\n\n/**\n * @type {Outro}\n */\nlet outros;\n\n/**\n * @returns {void} */\nexport function group_outros() {\n\toutros = {\n\t\tr: 0,\n\t\tc: [],\n\t\tp: outros // parent group\n\t};\n}\n\n/**\n * @returns {void} */\nexport function check_outros() {\n\tif (!outros.r) {\n\t\trun_all(outros.c);\n\t}\n\toutros = outros.p;\n}\n\n/**\n * @param {import('./private.js').Fragment} block\n * @param {0 | 1} [local]\n * @returns {void}\n */\nexport function transition_in(block, local) {\n\tif (block && block.i) {\n\t\toutroing.delete(block);\n\t\tblock.i(local);\n\t}\n}\n\n/**\n * @param {import('./private.js').Fragment} block\n * @param {0 | 1} local\n * @param {0 | 1} [detach]\n * @param {() => void} [callback]\n * @returns {void}\n */\nexport function transition_out(block, local, detach, callback) {\n\tif (block && block.o) {\n\t\tif (outroing.has(block)) return;\n\t\toutroing.add(block);\n\t\toutros.c.push(() => {\n\t\t\toutroing.delete(block);\n\t\t\tif (callback) {\n\t\t\t\tif (detach) block.d(1);\n\t\t\t\tcallback();\n\t\t\t}\n\t\t});\n\t\tblock.o(local);\n\t} else if (callback) {\n\t\tcallback();\n\t}\n}\n\n/**\n * @type {import('../transition/public.js').TransitionConfig}\n */\nconst null_transition = { duration: 0 };\n\n/**\n * @param {Element & ElementCSSInlineStyle} node\n * @param {TransitionFn} fn\n * @param {any} params\n * @returns {{ start(): void; invalidate(): void; end(): void; }}\n */\nexport function create_in_transition(node, fn, params) {\n\t/**\n\t * @type {TransitionOptions} */\n\tconst options = { direction: 'in' };\n\tlet config = fn(node, params, options);\n\tlet running = false;\n\tlet animation_name;\n\tlet task;\n\tlet uid = 0;\n\n\t/**\n\t * @returns {void} */\n\tfunction cleanup() {\n\t\tif (animation_name) delete_rule(node, animation_name);\n\t}\n\n\t/**\n\t * @returns {void} */\n\tfunction go() {\n\t\tconst {\n\t\t\tdelay = 0,\n\t\t\tduration = 300,\n\t\t\teasing = linear,\n\t\t\ttick = noop,\n\t\t\tcss\n\t\t} = config || null_transition;\n\t\tif (css) animation_name = create_rule(node, 0, 1, duration, delay, easing, css, uid++);\n\t\ttick(0, 1);\n\t\tconst start_time = now() + delay;\n\t\tconst end_time = start_time + duration;\n\t\tif (task) task.abort();\n\t\trunning = true;\n\t\tadd_render_callback(() => dispatch(node, true, 'start'));\n\t\ttask = loop((now) => {\n\t\t\tif (running) {\n\t\t\t\tif (now >= end_time) {\n\t\t\t\t\ttick(1, 0);\n\t\t\t\t\tdispatch(node, true, 'end');\n\t\t\t\t\tcleanup();\n\t\t\t\t\treturn (running = false);\n\t\t\t\t}\n\t\t\t\tif (now >= start_time) {\n\t\t\t\t\tconst t = easing((now - start_time) / duration);\n\t\t\t\t\ttick(t, 1 - t);\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn running;\n\t\t});\n\t}\n\tlet started = false;\n\treturn {\n\t\tstart() {\n\t\t\tif (started) return;\n\t\t\tstarted = true;\n\t\t\tdelete_rule(node);\n\t\t\tif (is_function(config)) {\n\t\t\t\tconfig = config(options);\n\t\t\t\twait().then(go);\n\t\t\t} else {\n\t\t\t\tgo();\n\t\t\t}\n\t\t},\n\t\tinvalidate() {\n\t\t\tstarted = false;\n\t\t},\n\t\tend() {\n\t\t\tif (running) {\n\t\t\t\tcleanup();\n\t\t\t\trunning = false;\n\t\t\t}\n\t\t}\n\t};\n}\n\n/**\n * @param {Element & ElementCSSInlineStyle} node\n * @param {TransitionFn} fn\n * @param {any} params\n * @returns {{ end(reset: any): void; }}\n */\nexport function create_out_transition(node, fn, params) {\n\t/** @type {TransitionOptions} */\n\tconst options = { direction: 'out' };\n\tlet config = fn(node, params, options);\n\tlet running = true;\n\tlet animation_name;\n\tconst group = outros;\n\tgroup.r += 1;\n\t/** @type {boolean} */\n\tlet original_inert_value;\n\n\t/**\n\t * @returns {void} */\n\tfunction go() {\n\t\tconst {\n\t\t\tdelay = 0,\n\t\t\tduration = 300,\n\t\t\teasing = linear,\n\t\t\ttick = noop,\n\t\t\tcss\n\t\t} = config || null_transition;\n\n\t\tif (css) animation_name = create_rule(node, 1, 0, duration, delay, easing, css);\n\n\t\tconst start_time = now() + delay;\n\t\tconst end_time = start_time + duration;\n\t\tadd_render_callback(() => dispatch(node, false, 'start'));\n\n\t\tif ('inert' in node) {\n\t\t\toriginal_inert_value = /** @type {HTMLElement} */ (node).inert;\n\t\t\tnode.inert = true;\n\t\t}\n\n\t\tloop((now) => {\n\t\t\tif (running) {\n\t\t\t\tif (now >= end_time) {\n\t\t\t\t\ttick(0, 1);\n\t\t\t\t\tdispatch(node, false, 'end');\n\t\t\t\t\tif (!--group.r) {\n\t\t\t\t\t\t// this will result in `end()` being called,\n\t\t\t\t\t\t// so we don't need to clean up here\n\t\t\t\t\t\trun_all(group.c);\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\t\t\t\tif (now >= start_time) {\n\t\t\t\t\tconst t = easing((now - start_time) / duration);\n\t\t\t\t\ttick(1 - t, t);\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn running;\n\t\t});\n\t}\n\n\tif (is_function(config)) {\n\t\twait().then(() => {\n\t\t\t// @ts-ignore\n\t\t\tconfig = config(options);\n\t\t\tgo();\n\t\t});\n\t} else {\n\t\tgo();\n\t}\n\n\treturn {\n\t\tend(reset) {\n\t\t\tif (reset && 'inert' in node) {\n\t\t\t\tnode.inert = original_inert_value;\n\t\t\t}\n\t\t\tif (reset && config.tick) {\n\t\t\t\tconfig.tick(1, 0);\n\t\t\t}\n\t\t\tif (running) {\n\t\t\t\tif (animation_name) delete_rule(node, animation_name);\n\t\t\t\trunning = false;\n\t\t\t}\n\t\t}\n\t};\n}\n\n/**\n * @param {Element & ElementCSSInlineStyle} node\n * @param {TransitionFn} fn\n * @param {any} params\n * @param {boolean} intro\n * @returns {{ run(b: 0 | 1): void; end(): void; }}\n */\nexport function create_bidirectional_transition(node, fn, params, intro) {\n\t/**\n\t * @type {TransitionOptions} */\n\tconst options = { direction: 'both' };\n\tlet config = fn(node, params, options);\n\tlet t = intro ? 0 : 1;\n\n\t/**\n\t * @type {Program | null} */\n\tlet running_program = null;\n\n\t/**\n\t * @type {PendingProgram | null} */\n\tlet pending_program = null;\n\tlet animation_name = null;\n\n\t/** @type {boolean} */\n\tlet original_inert_value;\n\n\t/**\n\t * @returns {void} */\n\tfunction clear_animation() {\n\t\tif (animation_name) delete_rule(node, animation_name);\n\t}\n\n\t/**\n\t * @param {PendingProgram} program\n\t * @param {number} duration\n\t * @returns {Program}\n\t */\n\tfunction init(program, duration) {\n\t\tconst d = /** @type {Program['d']} */ (program.b - t);\n\t\tduration *= Math.abs(d);\n\t\treturn {\n\t\t\ta: t,\n\t\t\tb: program.b,\n\t\t\td,\n\t\t\tduration,\n\t\t\tstart: program.start,\n\t\t\tend: program.start + duration,\n\t\t\tgroup: program.group\n\t\t};\n\t}\n\n\t/**\n\t * @param {INTRO | OUTRO} b\n\t * @returns {void}\n\t */\n\tfunction go(b) {\n\t\tconst {\n\t\t\tdelay = 0,\n\t\t\tduration = 300,\n\t\t\teasing = linear,\n\t\t\ttick = noop,\n\t\t\tcss\n\t\t} = config || null_transition;\n\n\t\t/**\n\t\t * @type {PendingProgram} */\n\t\tconst program = {\n\t\t\tstart: now() + delay,\n\t\t\tb\n\t\t};\n\n\t\tif (!b) {\n\t\t\t// @ts-ignore todo: improve typings\n\t\t\tprogram.group = outros;\n\t\t\toutros.r += 1;\n\t\t}\n\n\t\tif ('inert' in node) {\n\t\t\tif (b) {\n\t\t\t\tif (original_inert_value !== undefined) {\n\t\t\t\t\t// aborted/reversed outro — restore previous inert value\n\t\t\t\t\tnode.inert = original_inert_value;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\toriginal_inert_value = /** @type {HTMLElement} */ (node).inert;\n\t\t\t\tnode.inert = true;\n\t\t\t}\n\t\t}\n\n\t\tif (running_program || pending_program) {\n\t\t\tpending_program = program;\n\t\t} else {\n\t\t\t// if this is an intro, and there's a delay, we need to do\n\t\t\t// an initial tick and/or apply CSS animation immediately\n\t\t\tif (css) {\n\t\t\t\tclear_animation();\n\t\t\t\tanimation_name = create_rule(node, t, b, duration, delay, easing, css);\n\t\t\t}\n\t\t\tif (b) tick(0, 1);\n\t\t\trunning_program = init(program, duration);\n\t\t\tadd_render_callback(() => dispatch(node, b, 'start'));\n\t\t\tloop((now) => {\n\t\t\t\tif (pending_program && now > pending_program.start) {\n\t\t\t\t\trunning_program = init(pending_program, duration);\n\t\t\t\t\tpending_program = null;\n\t\t\t\t\tdispatch(node, running_program.b, 'start');\n\t\t\t\t\tif (css) {\n\t\t\t\t\t\tclear_animation();\n\t\t\t\t\t\tanimation_name = create_rule(\n\t\t\t\t\t\t\tnode,\n\t\t\t\t\t\t\tt,\n\t\t\t\t\t\t\trunning_program.b,\n\t\t\t\t\t\t\trunning_program.duration,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\teasing,\n\t\t\t\t\t\t\tconfig.css\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tif (running_program) {\n\t\t\t\t\tif (now >= running_program.end) {\n\t\t\t\t\t\ttick((t = running_program.b), 1 - t);\n\t\t\t\t\t\tdispatch(node, running_program.b, 'end');\n\t\t\t\t\t\tif (!pending_program) {\n\t\t\t\t\t\t\t// we're done\n\t\t\t\t\t\t\tif (running_program.b) {\n\t\t\t\t\t\t\t\t// intro — we can tidy up immediately\n\t\t\t\t\t\t\t\tclear_animation();\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t// outro — needs to be coordinated\n\t\t\t\t\t\t\t\tif (!--running_program.group.r) run_all(running_program.group.c);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\trunning_program = null;\n\t\t\t\t\t} else if (now >= running_program.start) {\n\t\t\t\t\t\tconst p = now - running_program.start;\n\t\t\t\t\t\tt = running_program.a + running_program.d * easing(p / running_program.duration);\n\t\t\t\t\t\ttick(t, 1 - t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn !!(running_program || pending_program);\n\t\t\t});\n\t\t}\n\t}\n\treturn {\n\t\trun(b) {\n\t\t\tif (is_function(config)) {\n\t\t\t\twait().then(() => {\n\t\t\t\t\tconst opts = { direction: b ? 'in' : 'out' };\n\t\t\t\t\t// @ts-ignore\n\t\t\t\t\tconfig = config(opts);\n\t\t\t\t\tgo(b);\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tgo(b);\n\t\t\t}\n\t\t},\n\t\tend() {\n\t\t\tclear_animation();\n\t\t\trunning_program = pending_program = null;\n\t\t}\n\t};\n}\n\n/** @typedef {1} INTRO */\n/** @typedef {0} OUTRO */\n/** @typedef {{ direction: 'in' | 'out' | 'both' }} TransitionOptions */\n/** @typedef {(node: Element, params: any, options: TransitionOptions) => import('../transition/public.js').TransitionConfig} TransitionFn */\n\n/**\n * @typedef {Object} Outro\n * @property {number} r\n * @property {Function[]} c\n * @property {Object} p\n */\n\n/**\n * @typedef {Object} PendingProgram\n * @property {number} start\n * @property {INTRO|OUTRO} b\n * @property {Outro} [group]\n */\n\n/**\n * @typedef {Object} Program\n * @property {number} a\n * @property {INTRO|OUTRO} b\n * @property {1|-1} d\n * @property {number} duration\n * @property {number} start\n * @property {number} end\n * @property {Outro} [group]\n */\n","import { is_promise } from './utils.js';\nimport { check_outros, group_outros, transition_in, transition_out } from './transitions.js';\nimport { flush } from './scheduler.js';\nimport { get_current_component, set_current_component } from './lifecycle.js';\n\n/**\n * @template T\n * @param {Promise<T>} promise\n * @param {import('./private.js').PromiseInfo<T>} info\n * @returns {boolean}\n */\nexport function handle_promise(promise, info) {\n\tconst token = (info.token = {});\n\t/**\n\t * @param {import('./private.js').FragmentFactory} type\n\t * @param {0 | 1 | 2} index\n\t * @param {number} [key]\n\t * @param {any} [value]\n\t * @returns {void}\n\t */\n\tfunction update(type, index, key, value) {\n\t\tif (info.token !== token) return;\n\t\tinfo.resolved = value;\n\t\tlet child_ctx = info.ctx;\n\t\tif (key !== undefined) {\n\t\t\tchild_ctx = child_ctx.slice();\n\t\t\tchild_ctx[key] = value;\n\t\t}\n\t\tconst block = type && (info.current = type)(child_ctx);\n\t\tlet needs_flush = false;\n\t\tif (info.block) {\n\t\t\tif (info.blocks) {\n\t\t\t\tinfo.blocks.forEach((block, i) => {\n\t\t\t\t\tif (i !== index && block) {\n\t\t\t\t\t\tgroup_outros();\n\t\t\t\t\t\ttransition_out(block, 1, 1, () => {\n\t\t\t\t\t\t\tif (info.blocks[i] === block) {\n\t\t\t\t\t\t\t\tinfo.blocks[i] = null;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t});\n\t\t\t\t\t\tcheck_outros();\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tinfo.block.d(1);\n\t\t\t}\n\t\t\tblock.c();\n\t\t\ttransition_in(block, 1);\n\t\t\tblock.m(info.mount(), info.anchor);\n\t\t\tneeds_flush = true;\n\t\t}\n\t\tinfo.block = block;\n\t\tif (info.blocks) info.blocks[index] = block;\n\t\tif (needs_flush) {\n\t\t\tflush();\n\t\t}\n\t}\n\tif (is_promise(promise)) {\n\t\tconst current_component = get_current_component();\n\t\tpromise.then(\n\t\t\t(value) => {\n\t\t\t\tset_current_component(current_component);\n\t\t\t\tupdate(info.then, 1, info.value, value);\n\t\t\t\tset_current_component(null);\n\t\t\t},\n\t\t\t(error) => {\n\t\t\t\tset_current_component(current_component);\n\t\t\t\tupdate(info.catch, 2, info.error, error);\n\t\t\t\tset_current_component(null);\n\t\t\t\tif (!info.hasCatch) {\n\t\t\t\t\tthrow error;\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t\t// if we previously had a then/catch block, destroy it\n\t\tif (info.current !== info.pending) {\n\t\t\tupdate(info.pending, 0);\n\t\t\treturn true;\n\t\t}\n\t} else {\n\t\tif (info.current !== info.then) {\n\t\t\tupdate(info.then, 1, info.value, promise);\n\t\t\treturn true;\n\t\t}\n\t\tinfo.resolved = /** @type {T} */ (promise);\n\t}\n}\n\n/** @returns {void} */\nexport function update_await_block_branch(info, ctx, dirty) {\n\tconst child_ctx = ctx.slice();\n\tconst { resolved } = info;\n\tif (info.current === info.then) {\n\t\tchild_ctx[info.value] = resolved;\n\t}\n\tif (info.current === info.catch) {\n\t\tchild_ctx[info.error] = resolved;\n\t}\n\tinfo.block.p(child_ctx, dirty);\n}\n","/** @returns {{}} */\nexport function get_spread_update(levels, updates) {\n\tconst update = {};\n\tconst to_null_out = {};\n\tconst accounted_for = { $$scope: 1 };\n\tlet i = levels.length;\n\twhile (i--) {\n\t\tconst o = levels[i];\n\t\tconst n = updates[i];\n\t\tif (n) {\n\t\t\tfor (const key in o) {\n\t\t\t\tif (!(key in n)) to_null_out[key] = 1;\n\t\t\t}\n\t\t\tfor (const key in n) {\n\t\t\t\tif (!accounted_for[key]) {\n\t\t\t\t\tupdate[key] = n[key];\n\t\t\t\t\taccounted_for[key] = 1;\n\t\t\t\t}\n\t\t\t}\n\t\t\tlevels[i] = n;\n\t\t} else {\n\t\t\tfor (const key in o) {\n\t\t\t\taccounted_for[key] = 1;\n\t\t\t}\n\t\t}\n\t}\n\tfor (const key in to_null_out) {\n\t\tif (!(key in update)) update[key] = undefined;\n\t}\n\treturn update;\n}\n\nexport function get_spread_object(spread_props) {\n\treturn typeof spread_props === 'object' && spread_props !== null ? spread_props : {};\n}\n","import { set_current_component, current_component } from './lifecycle.js';\nimport { run_all, blank_object } from './utils.js';\nimport { boolean_attributes } from '../../shared/boolean_attributes.js';\nimport { ensure_array_like } from './each.js';\nexport { is_void } from '../../shared/utils/names.js';\n\nexport const invalid_attribute_name_character =\n\t/[\\s'\">/=\\u{FDD0}-\\u{FDEF}\\u{FFFE}\\u{FFFF}\\u{1FFFE}\\u{1FFFF}\\u{2FFFE}\\u{2FFFF}\\u{3FFFE}\\u{3FFFF}\\u{4FFFE}\\u{4FFFF}\\u{5FFFE}\\u{5FFFF}\\u{6FFFE}\\u{6FFFF}\\u{7FFFE}\\u{7FFFF}\\u{8FFFE}\\u{8FFFF}\\u{9FFFE}\\u{9FFFF}\\u{AFFFE}\\u{AFFFF}\\u{BFFFE}\\u{BFFFF}\\u{CFFFE}\\u{CFFFF}\\u{DFFFE}\\u{DFFFF}\\u{EFFFE}\\u{EFFFF}\\u{FFFFE}\\u{FFFFF}\\u{10FFFE}\\u{10FFFF}]/u;\n// https://html.spec.whatwg.org/multipage/syntax.html#attributes-2\n// https://infra.spec.whatwg.org/#noncharacter\n\n/** @returns {string} */\nexport function spread(args, attrs_to_add) {\n\tconst attributes = Object.assign({}, ...args);\n\tif (attrs_to_add) {\n\t\tconst classes_to_add = attrs_to_add.classes;\n\t\tconst styles_to_add = attrs_to_add.styles;\n\t\tif (classes_to_add) {\n\t\t\tif (attributes.class == null) {\n\t\t\t\tattributes.class = classes_to_add;\n\t\t\t} else {\n\t\t\t\tattributes.class += ' ' + classes_to_add;\n\t\t\t}\n\t\t}\n\t\tif (styles_to_add) {\n\t\t\tif (attributes.style == null) {\n\t\t\t\tattributes.style = style_object_to_string(styles_to_add);\n\t\t\t} else {\n\t\t\t\tattributes.style = style_object_to_string(\n\t\t\t\t\tmerge_ssr_styles(attributes.style, styles_to_add)\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t}\n\tlet str = '';\n\tObject.keys(attributes).forEach((name) => {\n\t\tif (invalid_attribute_name_character.test(name)) return;\n\t\tconst value = attributes[name];\n\t\tif (value === true) str += ' ' + name;\n\t\telse if (boolean_attributes.has(name.toLowerCase())) {\n\t\t\tif (value) str += ' ' + name;\n\t\t} else if (value != null) {\n\t\t\tstr += ` ${name}=\"${value}\"`;\n\t\t}\n\t});\n\treturn str;\n}\n\n/** @returns {{}} */\nexport function merge_ssr_styles(style_attribute, style_directive) {\n\tconst style_object = {};\n\tfor (const individual_style of style_attribute.split(';')) {\n\t\tconst colon_index = individual_style.indexOf(':');\n\t\tconst name = individual_style.slice(0, colon_index).trim();\n\t\tconst value = individual_style.slice(colon_index + 1).trim();\n\t\tif (!name) continue;\n\t\tstyle_object[name] = value;\n\t}\n\tfor (const name in style_directive) {\n\t\tconst value = style_directive[name];\n\t\tif (value) {\n\t\t\tstyle_object[name] = value;\n\t\t} else {\n\t\t\tdelete style_object[name];\n\t\t}\n\t}\n\treturn style_object;\n}\n\nconst ATTR_REGEX = /[&\"]/g;\nconst CONTENT_REGEX = /[&<]/g;\n\n/**\n * Note: this method is performance sensitive and has been optimized\n * https://github.com/sveltejs/svelte/pull/5701\n * @param {unknown} value\n * @returns {string}\n */\nexport function escape(value, is_attr = false) {\n\tconst str = String(value);\n\tconst pattern = is_attr ? ATTR_REGEX : CONTENT_REGEX;\n\tpattern.lastIndex = 0;\n\tlet escaped = '';\n\tlet last = 0;\n\twhile (pattern.test(str)) {\n\t\tconst i = pattern.lastIndex - 1;\n\t\tconst ch = str[i];\n\t\tescaped += str.substring(last, i) + (ch === '&' ? '&' : ch === '\"' ? '"' : '<');\n\t\tlast = i + 1;\n\t}\n\treturn escaped + str.substring(last);\n}\n\nexport function escape_attribute_value(value) {\n\t// keep booleans, null, and undefined for the sake of `spread`\n\tconst should_escape = typeof value === 'string' || (value && typeof value === 'object');\n\treturn should_escape ? escape(value, true) : value;\n}\n\n/** @returns {{}} */\nexport function escape_object(obj) {\n\tconst result = {};\n\tfor (const key in obj) {\n\t\tresult[key] = escape_attribute_value(obj[key]);\n\t}\n\treturn result;\n}\n\n/** @returns {string} */\nexport function each(items, fn) {\n\titems = ensure_array_like(items);\n\tlet str = '';\n\tfor (let i = 0; i < items.length; i += 1) {\n\t\tstr += fn(items[i], i);\n\t}\n\treturn str;\n}\n\nexport const missing_component = {\n\t$$render: () => ''\n};\n\nexport function validate_component(component, name) {\n\tif (!component || !component.$$render) {\n\t\tif (name === 'svelte:component') name += ' this={...}';\n\t\tthrow new Error(\n\t\t\t`<${name}> is not a valid SSR component. You may need to review your build config to ensure that dependencies are compiled, rather than imported as pre-compiled modules. Otherwise you may need to fix a <${name}>.`\n\t\t);\n\t}\n\treturn component;\n}\n\n/** @returns {string} */\nexport function debug(file, line, column, values) {\n\tconsole.log(`{@debug} ${file ? file + ' ' : ''}(${line}:${column})`); // eslint-disable-line no-console\n\tconsole.log(values); // eslint-disable-line no-console\n\treturn '';\n}\n\nlet on_destroy;\n\n/** @returns {{ render: (props?: {}, { $$slots, context }?: { $$slots?: {}; context?: Map<any, any>; }) => { html: any; css: { code: string; map: any; }; head: string; }; $$render: (result: any, props: any, bindings: any, slots: any, context: any) => any; }} */\nexport function create_ssr_component(fn) {\n\tfunction $$render(result, props, bindings, slots, context) {\n\t\tconst parent_component = current_component;\n\t\tconst $$ = {\n\t\t\ton_destroy,\n\t\t\tcontext: new Map(context || (parent_component ? parent_component.$$.context : [])),\n\t\t\t// these will be immediately discarded\n\t\t\ton_mount: [],\n\t\t\tbefore_update: [],\n\t\t\tafter_update: [],\n\t\t\tcallbacks: blank_object()\n\t\t};\n\t\tset_current_component({ $$ });\n\t\tconst html = fn(result, props, bindings, slots);\n\t\tset_current_component(parent_component);\n\t\treturn html;\n\t}\n\treturn {\n\t\trender: (props = {}, { $$slots = {}, context = new Map() } = {}) => {\n\t\t\ton_destroy = [];\n\t\t\tconst result = { title: '', head: '', css: new Set() };\n\t\t\tconst html = $$render(result, props, {}, $$slots, context);\n\t\t\trun_all(on_destroy);\n\t\t\treturn {\n\t\t\t\thtml,\n\t\t\t\tcss: {\n\t\t\t\t\tcode: Array.from(result.css)\n\t\t\t\t\t\t.map((css) => css.code)\n\t\t\t\t\t\t.join('\\n'),\n\t\t\t\t\tmap: null // TODO\n\t\t\t\t},\n\t\t\t\thead: result.title + result.head\n\t\t\t};\n\t\t},\n\t\t$$render\n\t};\n}\n\n/** @returns {string} */\nexport function add_attribute(name, value, boolean) {\n\tif (value == null || (boolean && !value)) return '';\n\tconst assignment = boolean && value === true ? '' : `=\"${escape(value, true)}\"`;\n\treturn ` ${name}${assignment}`;\n}\n\n/** @returns {string} */\nexport function add_classes(classes) {\n\treturn classes ? ` class=\"${classes}\"` : '';\n}\n\n/** @returns {string} */\nfunction style_object_to_string(style_object) {\n\treturn Object.keys(style_object)\n\t\t.filter((key) => style_object[key])\n\t\t.map((key) => `${key}: ${escape_attribute_value(style_object[key])};`)\n\t\t.join(' ');\n}\n\n/** @returns {string} */\nexport function add_styles(style_object) {\n\tconst styles = style_object_to_string(style_object);\n\treturn styles ? ` style=\"${styles}\"` : '';\n}\n","import {\n\tadd_render_callback,\n\tflush,\n\tflush_render_callbacks,\n\tschedule_update,\n\tdirty_components\n} from './scheduler.js';\nimport { current_component, set_current_component } from './lifecycle.js';\nimport { blank_object, is_empty, is_function, run, run_all, noop } from './utils.js';\nimport {\n\tchildren,\n\tdetach,\n\tstart_hydrating,\n\tend_hydrating,\n\tget_custom_elements_slots,\n\tinsert,\n\telement,\n\tattr\n} from './dom.js';\nimport { transition_in } from './transitions.js';\n\n/** @returns {void} */\nexport function bind(component, name, callback) {\n\tconst index = component.$$.props[name];\n\tif (index !== undefined) {\n\t\tcomponent.$$.bound[index] = callback;\n\t\tcallback(component.$$.ctx[index]);\n\t}\n}\n\n/** @returns {void} */\nexport function create_component(block) {\n\tblock && block.c();\n}\n\n/** @returns {void} */\nexport function claim_component(block, parent_nodes) {\n\tblock && block.l(parent_nodes);\n}\n\n/** @returns {void} */\nexport function mount_component(component, target, anchor) {\n\tconst { fragment, after_update } = component.$$;\n\tfragment && fragment.m(target, anchor);\n\t// onMount happens before the initial afterUpdate\n\tadd_render_callback(() => {\n\t\tconst new_on_destroy = component.$$.on_mount.map(run).filter(is_function);\n\t\t// if the component was destroyed immediately\n\t\t// it will update the `$$.on_destroy` reference to `null`.\n\t\t// the destructured on_destroy may still reference to the old array\n\t\tif (component.$$.on_destroy) {\n\t\t\tcomponent.$$.on_destroy.push(...new_on_destroy);\n\t\t} else {\n\t\t\t// Edge case - component was destroyed immediately,\n\t\t\t// most likely as a result of a binding initialising\n\t\t\trun_all(new_on_destroy);\n\t\t}\n\t\tcomponent.$$.on_mount = [];\n\t});\n\tafter_update.forEach(add_render_callback);\n}\n\n/** @returns {void} */\nexport function destroy_component(component, detaching) {\n\tconst $$ = component.$$;\n\tif ($$.fragment !== null) {\n\t\tflush_render_callbacks($$.after_update);\n\t\trun_all($$.on_destroy);\n\t\t$$.fragment && $$.fragment.d(detaching);\n\t\t// TODO null out other refs, including component.$$ (but need to\n\t\t// preserve final state?)\n\t\t$$.on_destroy = $$.fragment = null;\n\t\t$$.ctx = [];\n\t}\n}\n\n/** @returns {void} */\nfunction make_dirty(component, i) {\n\tif (component.$$.dirty[0] === -1) {\n\t\tdirty_components.push(component);\n\t\tschedule_update();\n\t\tcomponent.$$.dirty.fill(0);\n\t}\n\tcomponent.$$.dirty[(i / 31) | 0] |= 1 << i % 31;\n}\n\n// TODO: Document the other params\n/**\n * @param {SvelteComponent} component\n * @param {import('./public.js').ComponentConstructorOptions} options\n *\n * @param {import('./utils.js')['not_equal']} not_equal Used to compare props and state values.\n * @param {(target: Element | ShadowRoot) => void} [append_styles] Function that appends styles to the DOM when the component is first initialised.\n * This will be the `add_css` function from the compiled component.\n *\n * @returns {void}\n */\nexport function init(\n\tcomponent,\n\toptions,\n\tinstance,\n\tcreate_fragment,\n\tnot_equal,\n\tprops,\n\tappend_styles = null,\n\tdirty = [-1]\n) {\n\tconst parent_component = current_component;\n\tset_current_component(component);\n\t/** @type {import('./private.js').T$$} */\n\tconst $$ = (component.$$ = {\n\t\tfragment: null,\n\t\tctx: [],\n\t\t// state\n\t\tprops,\n\t\tupdate: noop,\n\t\tnot_equal,\n\t\tbound: blank_object(),\n\t\t// lifecycle\n\t\ton_mount: [],\n\t\ton_destroy: [],\n\t\ton_disconnect: [],\n\t\tbefore_update: [],\n\t\tafter_update: [],\n\t\tcontext: new Map(options.context || (parent_component ? parent_component.$$.context : [])),\n\t\t// everything else\n\t\tcallbacks: blank_object(),\n\t\tdirty,\n\t\tskip_bound: false,\n\t\troot: options.target || parent_component.$$.root\n\t});\n\tappend_styles && append_styles($$.root);\n\tlet ready = false;\n\t$$.ctx = instance\n\t\t? instance(component, options.props || {}, (i, ret, ...rest) => {\n\t\t\t\tconst value = rest.length ? rest[0] : ret;\n\t\t\t\tif ($$.ctx && not_equal($$.ctx[i], ($$.ctx[i] = value))) {\n\t\t\t\t\tif (!$$.skip_bound && $$.bound[i]) $$.bound[i](value);\n\t\t\t\t\tif (ready) make_dirty(component, i);\n\t\t\t\t}\n\t\t\t\treturn ret;\n\t\t })\n\t\t: [];\n\t$$.update();\n\tready = true;\n\trun_all($$.before_update);\n\t// `false` as a special case of no DOM component\n\t$$.fragment = create_fragment ? create_fragment($$.ctx) : false;\n\tif (options.target) {\n\t\tif (options.hydrate) {\n\t\t\tstart_hydrating();\n\t\t\t// TODO: what is the correct type here?\n\t\t\t// @ts-expect-error\n\t\t\tconst nodes = children(options.target);\n\t\t\t$$.fragment && $$.fragment.l(nodes);\n\t\t\tnodes.forEach(detach);\n\t\t} else {\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\t$$.fragment && $$.fragment.c();\n\t\t}\n\t\tif (options.intro) transition_in(component.$$.fragment);\n\t\tmount_component(component, options.target, options.anchor);\n\t\tend_hydrating();\n\t\tflush();\n\t}\n\tset_current_component(parent_component);\n}\n\nexport let SvelteElement;\n\nif (typeof HTMLElement === 'function') {\n\tSvelteElement = class extends HTMLElement {\n\t\t/** The Svelte component constructor */\n\t\t$$ctor;\n\t\t/** Slots */\n\t\t$$s;\n\t\t/** The Svelte component instance */\n\t\t$$c;\n\t\t/** Whether or not the custom element is connected */\n\t\t$$cn = false;\n\t\t/** Component props data */\n\t\t$$d = {};\n\t\t/** `true` if currently in the process of reflecting component props back to attributes */\n\t\t$$r = false;\n\t\t/** @type {Record<string, CustomElementPropDefinition>} Props definition (name, reflected, type etc) */\n\t\t$$p_d = {};\n\t\t/** @type {Record<string, Function[]>} Event listeners */\n\t\t$$l = {};\n\t\t/** @type {Map<Function, Function>} Event listener unsubscribe functions */\n\t\t$$l_u = new Map();\n\n\t\tconstructor($$componentCtor, $$slots, use_shadow_dom) {\n\t\t\tsuper();\n\t\t\tthis.$$ctor = $$componentCtor;\n\t\t\tthis.$$s = $$slots;\n\t\t\tif (use_shadow_dom) {\n\t\t\t\tthis.attachShadow({ mode: 'open' });\n\t\t\t}\n\t\t}\n\n\t\taddEventListener(type, listener, options) {\n\t\t\t// We can't determine upfront if the event is a custom event or not, so we have to\n\t\t\t// listen to both. If someone uses a custom event with the same name as a regular\n\t\t\t// browser event, this fires twice - we can't avoid that.\n\t\t\tthis.$$l[type] = this.$$l[type] || [];\n\t\t\tthis.$$l[type].push(listener);\n\t\t\tif (this.$$c) {\n\t\t\t\tconst unsub = this.$$c.$on(type, listener);\n\t\t\t\tthis.$$l_u.set(listener, unsub);\n\t\t\t}\n\t\t\tsuper.addEventListener(type, listener, options);\n\t\t}\n\n\t\tremoveEventListener(type, listener, options) {\n\t\t\tsuper.removeEventListener(type, listener, options);\n\t\t\tif (this.$$c) {\n\t\t\t\tconst unsub = this.$$l_u.get(listener);\n\t\t\t\tif (unsub) {\n\t\t\t\t\tunsub();\n\t\t\t\t\tthis.$$l_u.delete(listener);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tasync connectedCallback() {\n\t\t\tthis.$$cn = true;\n\t\t\tif (!this.$$c) {\n\t\t\t\t// We wait one tick to let possible child slot elements be created/mounted\n\t\t\t\tawait Promise.resolve();\n\t\t\t\tif (!this.$$cn || this.$$c) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfunction create_slot(name) {\n\t\t\t\t\treturn () => {\n\t\t\t\t\t\tlet node;\n\t\t\t\t\t\tconst obj = {\n\t\t\t\t\t\t\tc: function create() {\n\t\t\t\t\t\t\t\tnode = element('slot');\n\t\t\t\t\t\t\t\tif (name !== 'default') {\n\t\t\t\t\t\t\t\t\tattr(node, 'name', name);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * @param {HTMLElement} target\n\t\t\t\t\t\t\t * @param {HTMLElement} [anchor]\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\tm: function mount(target, anchor) {\n\t\t\t\t\t\t\t\tinsert(target, node, anchor);\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\td: function destroy(detaching) {\n\t\t\t\t\t\t\t\tif (detaching) {\n\t\t\t\t\t\t\t\t\tdetach(node);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t};\n\t\t\t\t\t\treturn obj;\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t\tconst $$slots = {};\n\t\t\t\tconst existing_slots = get_custom_elements_slots(this);\n\t\t\t\tfor (const name of this.$$s) {\n\t\t\t\t\tif (name in existing_slots) {\n\t\t\t\t\t\t$$slots[name] = [create_slot(name)];\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tfor (const attribute of this.attributes) {\n\t\t\t\t\t// this.$$data takes precedence over this.attributes\n\t\t\t\t\tconst name = this.$$g_p(attribute.name);\n\t\t\t\t\tif (!(name in this.$$d)) {\n\t\t\t\t\t\tthis.$$d[name] = get_custom_element_value(name, attribute.value, this.$$p_d, 'toProp');\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t// Port over props that were set programmatically before ce was initialized\n\t\t\t\tfor (const key in this.$$p_d) {\n\t\t\t\t\tif (!(key in this.$$d) && this[key] !== undefined) {\n\t\t\t\t\t\tthis.$$d[key] = this[key]; // don't transform, these were set through JavaScript\n\t\t\t\t\t\tdelete this[key]; // remove the property that shadows the getter/setter\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tthis.$$c = new this.$$ctor({\n\t\t\t\t\ttarget: this.shadowRoot || this,\n\t\t\t\t\tprops: {\n\t\t\t\t\t\t...this.$$d,\n\t\t\t\t\t\t$$slots,\n\t\t\t\t\t\t$$scope: {\n\t\t\t\t\t\t\tctx: []\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t});\n\n\t\t\t\t// Reflect component props as attributes\n\t\t\t\tconst reflect_attributes = () => {\n\t\t\t\t\tthis.$$r = true;\n\t\t\t\t\tfor (const key in this.$$p_d) {\n\t\t\t\t\t\tthis.$$d[key] = this.$$c.$$.ctx[this.$$c.$$.props[key]];\n\t\t\t\t\t\tif (this.$$p_d[key].reflect) {\n\t\t\t\t\t\t\tconst attribute_value = get_custom_element_value(\n\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\tthis.$$d[key],\n\t\t\t\t\t\t\t\tthis.$$p_d,\n\t\t\t\t\t\t\t\t'toAttribute'\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tif (attribute_value == null) {\n\t\t\t\t\t\t\t\tthis.removeAttribute(this.$$p_d[key].attribute || key);\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tthis.setAttribute(this.$$p_d[key].attribute || key, attribute_value);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tthis.$$r = false;\n\t\t\t\t};\n\t\t\t\tthis.$$c.$$.after_update.push(reflect_attributes);\n\t\t\t\treflect_attributes(); // once initially because after_update is added too late for first render\n\n\t\t\t\tfor (const type in this.$$l) {\n\t\t\t\t\tfor (const listener of this.$$l[type]) {\n\t\t\t\t\t\tconst unsub = this.$$c.$on(type, listener);\n\t\t\t\t\t\tthis.$$l_u.set(listener, unsub);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tthis.$$l = {};\n\t\t\t}\n\t\t}\n\n\t\t// We don't need this when working within Svelte code, but for compatibility of people using this outside of Svelte\n\t\t// and setting attributes through setAttribute etc, this is helpful\n\t\tattributeChangedCallback(attr, _oldValue, newValue) {\n\t\t\tif (this.$$r) return;\n\t\t\tattr = this.$$g_p(attr);\n\t\t\tthis.$$d[attr] = get_custom_element_value(attr, newValue, this.$$p_d, 'toProp');\n\t\t\tthis.$$c?.$set({ [attr]: this.$$d[attr] });\n\t\t}\n\n\t\tdisconnectedCallback() {\n\t\t\tthis.$$cn = false;\n\t\t\t// In a microtask, because this could be a move within the DOM\n\t\t\tPromise.resolve().then(() => {\n\t\t\t\tif (!this.$$cn && this.$$c) {\n\t\t\t\t\tthis.$$c.$destroy();\n\t\t\t\t\tthis.$$c = undefined;\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\n\t\t$$g_p(attribute_name) {\n\t\t\treturn (\n\t\t\t\tObject.keys(this.$$p_d).find(\n\t\t\t\t\t(key) =>\n\t\t\t\t\t\tthis.$$p_d[key].attribute === attribute_name ||\n\t\t\t\t\t\t(!this.$$p_d[key].attribute && key.toLowerCase() === attribute_name)\n\t\t\t\t) || attribute_name\n\t\t\t);\n\t\t}\n\t};\n}\n\n/**\n * @param {string} prop\n * @param {any} value\n * @param {Record<string, CustomElementPropDefinition>} props_definition\n * @param {'toAttribute' | 'toProp'} [transform]\n */\nfunction get_custom_element_value(prop, value, props_definition, transform) {\n\tconst type = props_definition[prop]?.type;\n\tvalue = type === 'Boolean' && typeof value !== 'boolean' ? value != null : value;\n\tif (!transform || !props_definition[prop]) {\n\t\treturn value;\n\t} else if (transform === 'toAttribute') {\n\t\tswitch (type) {\n\t\t\tcase 'Object':\n\t\t\tcase 'Array':\n\t\t\t\treturn value == null ? null : JSON.stringify(value);\n\t\t\tcase 'Boolean':\n\t\t\t\treturn value ? '' : null;\n\t\t\tcase 'Number':\n\t\t\t\treturn value == null ? null : value;\n\t\t\tdefault:\n\t\t\t\treturn value;\n\t\t}\n\t} else {\n\t\tswitch (type) {\n\t\t\tcase 'Object':\n\t\t\tcase 'Array':\n\t\t\t\treturn value && JSON.parse(value);\n\t\t\tcase 'Boolean':\n\t\t\t\treturn value; // conversion already handled above\n\t\t\tcase 'Number':\n\t\t\t\treturn value != null ? +value : value;\n\t\t\tdefault:\n\t\t\t\treturn value;\n\t\t}\n\t}\n}\n\n/**\n * @internal\n *\n * Turn a Svelte component into a custom element.\n * @param {import('./public.js').ComponentType} Component A Svelte component constructor\n * @param {Record<string, CustomElementPropDefinition>} props_definition The props to observe\n * @param {string[]} slots The slots to create\n * @param {string[]} accessors Other accessors besides the ones for props the component has\n * @param {boolean} use_shadow_dom Whether to use shadow DOM\n * @param {(ce: new () => HTMLElement) => new () => HTMLElement} [extend]\n */\nexport function create_custom_element(\n\tComponent,\n\tprops_definition,\n\tslots,\n\taccessors,\n\tuse_shadow_dom,\n\textend\n) {\n\tlet Class = class extends SvelteElement {\n\t\tconstructor() {\n\t\t\tsuper(Component, slots, use_shadow_dom);\n\t\t\tthis.$$p_d = props_definition;\n\t\t}\n\t\tstatic get observedAttributes() {\n\t\t\treturn Object.keys(props_definition).map((key) =>\n\t\t\t\t(props_definition[key].attribute || key).toLowerCase()\n\t\t\t);\n\t\t}\n\t};\n\tObject.keys(props_definition).forEach((prop) => {\n\t\tObject.defineProperty(Class.prototype, prop, {\n\t\t\tget() {\n\t\t\t\treturn this.$$c && prop in this.$$c ? this.$$c[prop] : this.$$d[prop];\n\t\t\t},\n\t\t\tset(value) {\n\t\t\t\tvalue = get_custom_element_value(prop, value, props_definition);\n\t\t\t\tthis.$$d[prop] = value;\n\t\t\t\tthis.$$c?.$set({ [prop]: value });\n\t\t\t}\n\t\t});\n\t});\n\taccessors.forEach((accessor) => {\n\t\tObject.defineProperty(Class.prototype, accessor, {\n\t\t\tget() {\n\t\t\t\treturn this.$$c?.[accessor];\n\t\t\t}\n\t\t});\n\t});\n\tif (extend) {\n\t\t// @ts-expect-error - assigning here is fine\n\t\tClass = extend(Class);\n\t}\n\tComponent.element = /** @type {any} */ (Class);\n\treturn Class;\n}\n\n/**\n * Base class for Svelte components. Used when dev=false.\n *\n * @template {Record<string, any>} [Props=any]\n * @template {Record<string, any>} [Events=any]\n */\nexport class SvelteComponent {\n\t/**\n\t * ### PRIVATE API\n\t *\n\t * Do not use, may change at any time\n\t *\n\t * @type {any}\n\t */\n\t$$ = undefined;\n\t/**\n\t * ### PRIVATE API\n\t *\n\t * Do not use, may change at any time\n\t *\n\t * @type {any}\n\t */\n\t$$set = undefined;\n\n\t/** @returns {void} */\n\t$destroy() {\n\t\tdestroy_component(this, 1);\n\t\tthis.$destroy = noop;\n\t}\n\n\t/**\n\t * @template {Extract<keyof Events, string>} K\n\t * @param {K} type\n\t * @param {((e: Events[K]) => void) | null | undefined} callback\n\t * @returns {() => void}\n\t */\n\t$on(type, callback) {\n\t\tif (!is_function(callback)) {\n\t\t\treturn noop;\n\t\t}\n\t\tconst callbacks = this.$$.callbacks[type] || (this.$$.callbacks[type] = []);\n\t\tcallbacks.push(callback);\n\t\treturn () => {\n\t\t\tconst index = callbacks.indexOf(callback);\n\t\t\tif (index !== -1) callbacks.splice(index, 1);\n\t\t};\n\t}\n\n\t/**\n\t * @param {Partial<Props>} props\n\t * @returns {void}\n\t */\n\t$set(props) {\n\t\tif (this.$$set && !is_empty(props)) {\n\t\t\tthis.$$.skip_bound = true;\n\t\t\tthis.$$set(props);\n\t\t\tthis.$$.skip_bound = false;\n\t\t}\n\t}\n}\n\n/**\n * @typedef {Object} CustomElementPropDefinition\n * @property {string} [attribute]\n * @property {boolean} [reflect]\n * @property {'String'|'Boolean'|'Number'|'Array'|'Object'} [type]\n */\n","const _boolean_attributes = /** @type {const} */ ([\n\t'allowfullscreen',\n\t'allowpaymentrequest',\n\t'async',\n\t'autofocus',\n\t'autoplay',\n\t'checked',\n\t'controls',\n\t'default',\n\t'defer',\n\t'disabled',\n\t'formnovalidate',\n\t'hidden',\n\t'inert',\n\t'ismap',\n\t'loop',\n\t'multiple',\n\t'muted',\n\t'nomodule',\n\t'novalidate',\n\t'open',\n\t'playsinline',\n\t'readonly',\n\t'required',\n\t'reversed',\n\t'selected'\n]);\n\n/**\n * List of HTML boolean attributes (e.g. `<input disabled>`).\n * Source: https://html.spec.whatwg.org/multipage/indices.html\n *\n * @type {Set<string>}\n */\nexport const boolean_attributes = new Set([..._boolean_attributes]);\n\n/** @typedef {typeof _boolean_attributes[number]} BooleanAttributes */\n","import {\n\tcustom_event,\n\tappend,\n\tappend_hydration,\n\tinsert,\n\tinsert_hydration,\n\tdetach,\n\tlisten,\n\tattr\n} from './dom.js';\nimport { SvelteComponent } from './Component.js';\nimport { is_void } from '../../shared/utils/names.js';\nimport { VERSION } from '../../shared/version.js';\nimport { contenteditable_truthy_values } from './utils.js';\nimport { ensure_array_like } from './each.js';\n\n/**\n * @template T\n * @param {string} type\n * @param {T} [detail]\n * @returns {void}\n */\nexport function dispatch_dev(type, detail) {\n\tdocument.dispatchEvent(custom_event(type, { version: VERSION, ...detail }, { bubbles: true }));\n}\n\n/**\n * @param {Node} target\n * @param {Node} node\n * @returns {void}\n */\nexport function append_dev(target, node) {\n\tdispatch_dev('SvelteDOMInsert', { target, node });\n\tappend(target, node);\n}\n\n/**\n * @param {Node} target\n * @param {Node} node\n * @returns {void}\n */\nexport function append_hydration_dev(target, node) {\n\tdispatch_dev('SvelteDOMInsert', { target, node });\n\tappend_hydration(target, node);\n}\n\n/**\n * @param {Node} target\n * @param {Node} node\n * @param {Node} [anchor]\n * @returns {void}\n */\nexport function insert_dev(target, node, anchor) {\n\tdispatch_dev('SvelteDOMInsert', { target, node, anchor });\n\tinsert(target, node, anchor);\n}\n\n/** @param {Node} target\n * @param {Node} node\n * @param {Node} [anchor]\n * @returns {void}\n */\nexport function insert_hydration_dev(target, node, anchor) {\n\tdispatch_dev('SvelteDOMInsert', { target, node, anchor });\n\tinsert_hydration(target, node, anchor);\n}\n\n/**\n * @param {Node} node\n * @returns {void}\n */\nexport function detach_dev(node) {\n\tdispatch_dev('SvelteDOMRemove', { node });\n\tdetach(node);\n}\n\n/**\n * @param {Node} before\n * @param {Node} after\n * @returns {void}\n */\nexport function detach_between_dev(before, after) {\n\twhile (before.nextSibling && before.nextSibling !== after) {\n\t\tdetach_dev(before.nextSibling);\n\t}\n}\n\n/**\n * @param {Node} after\n * @returns {void}\n */\nexport function detach_before_dev(after) {\n\twhile (after.previousSibling) {\n\t\tdetach_dev(after.previousSibling);\n\t}\n}\n\n/**\n * @param {Node} before\n * @returns {void}\n */\nexport function detach_after_dev(before) {\n\twhile (before.nextSibling) {\n\t\tdetach_dev(before.nextSibling);\n\t}\n}\n\n/**\n * @param {Node} node\n * @param {string} event\n * @param {EventListenerOrEventListenerObject} handler\n * @param {boolean | AddEventListenerOptions | EventListenerOptions} [options]\n * @param {boolean} [has_prevent_default]\n * @param {boolean} [has_stop_propagation]\n * @param {boolean} [has_stop_immediate_propagation]\n * @returns {() => void}\n */\nexport function listen_dev(\n\tnode,\n\tevent,\n\thandler,\n\toptions,\n\thas_prevent_default,\n\thas_stop_propagation,\n\thas_stop_immediate_propagation\n) {\n\tconst modifiers =\n\t\toptions === true ? ['capture'] : options ? Array.from(Object.keys(options)) : [];\n\tif (has_prevent_default) modifiers.push('preventDefault');\n\tif (has_stop_propagation) modifiers.push('stopPropagation');\n\tif (has_stop_immediate_propagation) modifiers.push('stopImmediatePropagation');\n\tdispatch_dev('SvelteDOMAddEventListener', { node, event, handler, modifiers });\n\tconst dispose = listen(node, event, handler, options);\n\treturn () => {\n\t\tdispatch_dev('SvelteDOMRemoveEventListener', { node, event, handler, modifiers });\n\t\tdispose();\n\t};\n}\n\n/**\n * @param {Element} node\n * @param {string} attribute\n * @param {string} [value]\n * @returns {void}\n */\nexport function attr_dev(node, attribute, value) {\n\tattr(node, attribute, value);\n\tif (value == null) dispatch_dev('SvelteDOMRemoveAttribute', { node, attribute });\n\telse dispatch_dev('SvelteDOMSetAttribute', { node, attribute, value });\n}\n\n/**\n * @param {Element} node\n * @param {string} property\n * @param {any} [value]\n * @returns {void}\n */\nexport function prop_dev(node, property, value) {\n\tnode[property] = value;\n\tdispatch_dev('SvelteDOMSetProperty', { node, property, value });\n}\n\n/**\n * @param {HTMLElement} node\n * @param {string} property\n * @param {any} [value]\n * @returns {void}\n */\nexport function dataset_dev(node, property, value) {\n\tnode.dataset[property] = value;\n\tdispatch_dev('SvelteDOMSetDataset', { node, property, value });\n}\n\n/**\n * @param {Text} text\n * @param {unknown} data\n * @returns {void}\n */\nexport function set_data_dev(text, data) {\n\tdata = '' + data;\n\tif (text.data === data) return;\n\tdispatch_dev('SvelteDOMSetData', { node: text, data });\n\ttext.data = /** @type {string} */ (data);\n}\n\n/**\n * @param {Text} text\n * @param {unknown} data\n * @returns {void}\n */\nexport function set_data_contenteditable_dev(text, data) {\n\tdata = '' + data;\n\tif (text.wholeText === data) return;\n\tdispatch_dev('SvelteDOMSetData', { node: text, data });\n\ttext.data = /** @type {string} */ (data);\n}\n\n/**\n * @param {Text} text\n * @param {unknown} data\n * @param {string} attr_value\n * @returns {void}\n */\nexport function set_data_maybe_contenteditable_dev(text, data, attr_value) {\n\tif (~contenteditable_truthy_values.indexOf(attr_value)) {\n\t\tset_data_contenteditable_dev(text, data);\n\t} else {\n\t\tset_data_dev(text, data);\n\t}\n}\n\nexport function ensure_array_like_dev(arg) {\n\tif (\n\t\ttypeof arg !== 'string' &&\n\t\t!(arg && typeof arg === 'object' && 'length' in arg) &&\n\t\t!(typeof Symbol === 'function' && arg && Symbol.iterator in arg)\n\t) {\n\t\tthrow new Error('{#each} only works with iterable values.');\n\t}\n\treturn ensure_array_like(arg);\n}\n\n/**\n * @returns {void} */\nexport function validate_slots(name, slot, keys) {\n\tfor (const slot_key of Object.keys(slot)) {\n\t\tif (!~keys.indexOf(slot_key)) {\n\t\t\tconsole.warn(`<${name}> received an unexpected slot \"${slot_key}\".`);\n\t\t}\n\t}\n}\n\n/**\n * @param {unknown} tag\n * @returns {void}\n */\nexport function validate_dynamic_element(tag) {\n\tconst is_string = typeof tag === 'string';\n\tif (tag && !is_string) {\n\t\tthrow new Error('<svelte:element> expects \"this\" attribute to be a string.');\n\t}\n}\n\n/**\n * @param {undefined | string} tag\n * @returns {void}\n */\nexport function validate_void_dynamic_element(tag) {\n\tif (tag && is_void(tag)) {\n\t\tconsole.warn(`<svelte:element this=\"${tag}\"> is self-closing and cannot have content.`);\n\t}\n}\n\nexport function construct_svelte_component_dev(component, props) {\n\tconst error_message = 'this={...} of <svelte:component> should specify a Svelte component.';\n\ttry {\n\t\tconst instance = new component(props);\n\t\tif (!instance.$$ || !instance.$set || !instance.$on || !instance.$destroy) {\n\t\t\tthrow new Error(error_message);\n\t\t}\n\t\treturn instance;\n\t} catch (err) {\n\t\tconst { message } = err;\n\t\tif (typeof message === 'string' && message.indexOf('is not a constructor') !== -1) {\n\t\t\tthrow new Error(error_message);\n\t\t} else {\n\t\t\tthrow err;\n\t\t}\n\t}\n}\n\n/**\n * Base class for Svelte components with some minor dev-enhancements. Used when dev=true.\n *\n * Can be used to create strongly typed Svelte components.\n *\n * #### Example:\n *\n * You have component library on npm called `component-library`, from which\n * you export a component called `MyComponent`. For Svelte+TypeScript users,\n * you want to provide typings. Therefore you create a `index.d.ts`:\n * ```ts\n * import { SvelteComponent } from \"svelte\";\n * export class MyComponent extends SvelteComponent<{foo: string}> {}\n * ```\n * Typing this makes it possible for IDEs like VS Code with the Svelte extension\n * to provide intellisense and to use the component like this in a Svelte file\n * with TypeScript:\n * ```svelte\n * <script lang=\"ts\">\n * \timport { MyComponent } from \"component-library\";\n * </script>\n * <MyComponent foo={'bar'} />\n * ```\n * @template {Record<string, any>} [Props=any]\n * @template {Record<string, any>} [Events=any]\n * @template {Record<string, any>} [Slots=any]\n * @extends {SvelteComponent<Props, Events>}\n */\nexport class SvelteComponentDev extends SvelteComponent {\n\t/**\n\t * For type checking capabilities only.\n\t * Does not exist at runtime.\n\t * ### DO NOT USE!\n\t *\n\t * @type {Props}\n\t */\n\t$$prop_def;\n\t/**\n\t * For type checking capabilities only.\n\t * Does not exist at runtime.\n\t * ### DO NOT USE!\n\t *\n\t * @type {Events}\n\t */\n\t$$events_def;\n\t/**\n\t * For type checking capabilities only.\n\t * Does not exist at runtime.\n\t * ### DO NOT USE!\n\t *\n\t * @type {Slots}\n\t */\n\t$$slot_def;\n\n\t/** @param {import('./public.js').ComponentConstructorOptions<Props>} options */\n\tconstructor(options) {\n\t\tif (!options || (!options.target && !options.$$inline)) {\n\t\t\tthrow new Error(\"'target' is a required option\");\n\t\t}\n\t\tsuper();\n\t}\n\n\t/** @returns {void} */\n\t$destroy() {\n\t\tsuper.$destroy();\n\t\tthis.$destroy = () => {\n\t\t\tconsole.warn('Component was already destroyed'); // eslint-disable-line no-console\n\t\t};\n\t}\n\n\t/** @returns {void} */\n\t$capture_state() {}\n\n\t/** @returns {void} */\n\t$inject_state() {}\n}\n/**\n * @template {Record<string, any>} [Props=any]\n * @template {Record<string, any>} [Events=any]\n * @template {Record<string, any>} [Slots=any]\n * @deprecated Use `SvelteComponent` instead. See PR for more information: https://github.com/sveltejs/svelte/pull/8512\n * @extends {SvelteComponentDev<Props, Events, Slots>}\n */\nexport class SvelteComponentTyped extends SvelteComponentDev {}\n\n/** @returns {() => void} */\nexport function loop_guard(timeout) {\n\tconst start = Date.now();\n\treturn () => {\n\t\tif (Date.now() - start > timeout) {\n\t\t\tthrow new Error('Infinite loop detected');\n\t\t}\n\t};\n}\n","import { transition_in, transition_out } from './transitions.js';\nimport { run_all } from './utils.js';\n\n// general each functions:\n\nexport function ensure_array_like(array_like_or_iterator) {\n\treturn array_like_or_iterator?.length !== undefined\n\t\t? array_like_or_iterator\n\t\t: Array.from(array_like_or_iterator);\n}\n\n// keyed each functions:\n\n/** @returns {void} */\nexport function destroy_block(block, lookup) {\n\tblock.d(1);\n\tlookup.delete(block.key);\n}\n\n/** @returns {void} */\nexport function outro_and_destroy_block(block, lookup) {\n\ttransition_out(block, 1, 1, () => {\n\t\tlookup.delete(block.key);\n\t});\n}\n\n/** @returns {void} */\nexport function fix_and_destroy_block(block, lookup) {\n\tblock.f();\n\tdestroy_block(block, lookup);\n}\n\n/** @returns {void} */\nexport function fix_and_outro_and_destroy_block(block, lookup) {\n\tblock.f();\n\toutro_and_destroy_block(block, lookup);\n}\n\n/** @returns {any[]} */\nexport function update_keyed_each(\n\told_blocks,\n\tdirty,\n\tget_key,\n\tdynamic,\n\tctx,\n\tlist,\n\tlookup,\n\tnode,\n\tdestroy,\n\tcreate_each_block,\n\tnext,\n\tget_context\n) {\n\tlet o = old_blocks.length;\n\tlet n = list.length;\n\tlet i = o;\n\tconst old_indexes = {};\n\twhile (i--) old_indexes[old_blocks[i].key] = i;\n\tconst new_blocks = [];\n\tconst new_lookup = new Map();\n\tconst deltas = new Map();\n\tconst updates = [];\n\ti = n;\n\twhile (i--) {\n\t\tconst child_ctx = get_context(ctx, list, i);\n\t\tconst key = get_key(child_ctx);\n\t\tlet block = lookup.get(key);\n\t\tif (!block) {\n\t\t\tblock = create_each_block(key, child_ctx);\n\t\t\tblock.c();\n\t\t} else if (dynamic) {\n\t\t\t// defer updates until all the DOM shuffling is done\n\t\t\tupdates.push(() => block.p(child_ctx, dirty));\n\t\t}\n\t\tnew_lookup.set(key, (new_blocks[i] = block));\n\t\tif (key in old_indexes) deltas.set(key, Math.abs(i - old_indexes[key]));\n\t}\n\tconst will_move = new Set();\n\tconst did_move = new Set();\n\t/** @returns {void} */\n\tfunction insert(block) {\n\t\ttransition_in(block, 1);\n\t\tblock.m(node, next);\n\t\tlookup.set(block.key, block);\n\t\tnext = block.first;\n\t\tn--;\n\t}\n\twhile (o && n) {\n\t\tconst new_block = new_blocks[n - 1];\n\t\tconst old_block = old_blocks[o - 1];\n\t\tconst new_key = new_block.key;\n\t\tconst old_key = old_block.key;\n\t\tif (new_block === old_block) {\n\t\t\t// do nothing\n\t\t\tnext = new_block.first;\n\t\t\to--;\n\t\t\tn--;\n\t\t} else if (!new_lookup.has(old_key)) {\n\t\t\t// remove old block\n\t\t\tdestroy(old_block, lookup);\n\t\t\to--;\n\t\t} else if (!lookup.has(new_key) || will_move.has(new_key)) {\n\t\t\tinsert(new_block);\n\t\t} else if (did_move.has(old_key)) {\n\t\t\to--;\n\t\t} else if (deltas.get(new_key) > deltas.get(old_key)) {\n\t\t\tdid_move.add(new_key);\n\t\t\tinsert(new_block);\n\t\t} else {\n\t\t\twill_move.add(old_key);\n\t\t\to--;\n\t\t}\n\t}\n\twhile (o--) {\n\t\tconst old_block = old_blocks[o];\n\t\tif (!new_lookup.has(old_block.key)) destroy(old_block, lookup);\n\t}\n\twhile (n) insert(new_blocks[n - 1]);\n\trun_all(updates);\n\treturn new_blocks;\n}\n\n/** @returns {void} */\nexport function validate_each_keys(ctx, list, get_context, get_key) {\n\tconst keys = new Map();\n\tfor (let i = 0; i < list.length; i++) {\n\t\tconst key = get_key(get_context(ctx, list, i));\n\t\tif (keys.has(key)) {\n\t\t\tlet value = '';\n\t\t\ttry {\n\t\t\t\tvalue = `with value '${String(key)}' `;\n\t\t\t} catch (e) {\n\t\t\t\t// can't stringify\n\t\t\t}\n\t\t\tthrow new Error(\n\t\t\t\t`Cannot have duplicate keys in a keyed each: Keys at index ${keys.get(\n\t\t\t\t\tkey\n\t\t\t\t)} and ${i} ${value}are duplicates`\n\t\t\t);\n\t\t}\n\t\tkeys.set(key, i);\n\t}\n}\n","import {\n\trun_all,\n\tsubscribe,\n\tnoop,\n\tsafe_not_equal,\n\tis_function,\n\tget_store_value\n} from '../internal/index.js';\n\nconst subscriber_queue = [];\n\n/**\n * Creates a `Readable` store that allows reading by subscription.\n *\n * https://svelte.dev/docs/svelte-store#readable\n * @template T\n * @param {T} [value] initial value\n * @param {import('./public.js').StartStopNotifier<T>} [start]\n * @returns {import('./public.js').Readable<T>}\n */\nexport function readable(value, start) {\n\treturn {\n\t\tsubscribe: writable(value, start).subscribe\n\t};\n}\n\n/**\n * Create a `Writable` store that allows both updating and reading by subscription.\n *\n * https://svelte.dev/docs/svelte-store#writable\n * @template T\n * @param {T} [value] initial value\n * @param {import('./public.js').StartStopNotifier<T>} [start]\n * @returns {import('./public.js').Writable<T>}\n */\nexport function writable(value, start = noop) {\n\t/** @type {import('./public.js').Unsubscriber} */\n\tlet stop;\n\t/** @type {Set<import('./private.js').SubscribeInvalidateTuple<T>>} */\n\tconst subscribers = new Set();\n\t/** @param {T} new_value\n\t * @returns {void}\n\t */\n\tfunction set(new_value) {\n\t\tif (safe_not_equal(value, new_value)) {\n\t\t\tvalue = new_value;\n\t\t\tif (stop) {\n\t\t\t\t// store is ready\n\t\t\t\tconst run_queue = !subscriber_queue.length;\n\t\t\t\tfor (const subscriber of subscribers) {\n\t\t\t\t\tsubscriber[1]();\n\t\t\t\t\tsubscriber_queue.push(subscriber, value);\n\t\t\t\t}\n\t\t\t\tif (run_queue) {\n\t\t\t\t\tfor (let i = 0; i < subscriber_queue.length; i += 2) {\n\t\t\t\t\t\tsubscriber_queue[i][0](subscriber_queue[i + 1]);\n\t\t\t\t\t}\n\t\t\t\t\tsubscriber_queue.length = 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * @param {import('./public.js').Updater<T>} fn\n\t * @returns {void}\n\t */\n\tfunction update(fn) {\n\t\tset(fn(value));\n\t}\n\n\t/**\n\t * @param {import('./public.js').Subscriber<T>} run\n\t * @param {import('./private.js').Invalidator<T>} [invalidate]\n\t * @returns {import('./public.js').Unsubscriber}\n\t */\n\tfunction subscribe(run, invalidate = noop) {\n\t\t/** @type {import('./private.js').SubscribeInvalidateTuple<T>} */\n\t\tconst subscriber = [run, invalidate];\n\t\tsubscribers.add(subscriber);\n\t\tif (subscribers.size === 1) {\n\t\t\tstop = start(set, update) || noop;\n\t\t}\n\t\trun(value);\n\t\treturn () => {\n\t\t\tsubscribers.delete(subscriber);\n\t\t\tif (subscribers.size === 0 && stop) {\n\t\t\t\tstop();\n\t\t\t\tstop = null;\n\t\t\t}\n\t\t};\n\t}\n\treturn { set, update, subscribe };\n}\n\n/**\n * Derived value store by synchronizing one or more readable stores and\n * applying an aggregation function over its input values.\n *\n * https://svelte.dev/docs/svelte-store#derived\n * @template {import('./private.js').Stores} S\n * @template T\n * @overload\n * @param {S} stores - input stores\n * @param {(values: import('./private.js').StoresValues<S>, set: (value: T) => void, update: (fn: import('./public.js').Updater<T>) => void) => import('./public.js').Unsubscriber | void} fn - function callback that aggregates the values\n * @param {T} [initial_value] - initial value\n * @returns {import('./public.js').Readable<T>}\n */\n\n/**\n * Derived value store by synchronizing one or more readable stores and\n * applying an aggregation function over its input values.\n *\n * https://svelte.dev/docs/svelte-store#derived\n * @template {import('./private.js').Stores} S\n * @template T\n * @overload\n * @param {S} stores - input stores\n * @param {(values: import('./private.js').StoresValues<S>) => T} fn - function callback that aggregates the values\n * @param {T} [initial_value] - initial value\n * @returns {import('./public.js').Readable<T>}\n */\n\n/**\n * @template {import('./private.js').Stores} S\n * @template T\n * @param {S} stores\n * @param {Function} fn\n * @param {T} [initial_value]\n * @returns {import('./public.js').Readable<T>}\n */\nexport function derived(stores, fn, initial_value) {\n\tconst single = !Array.isArray(stores);\n\t/** @type {Array<import('./public.js').Readable<any>>} */\n\tconst stores_array = single ? [stores] : stores;\n\tif (!stores_array.every(Boolean)) {\n\t\tthrow new Error('derived() expects stores as input, got a falsy value');\n\t}\n\tconst auto = fn.length < 2;\n\treturn readable(initial_value, (set, update) => {\n\t\tlet started = false;\n\t\tconst values = [];\n\t\tlet pending = 0;\n\t\tlet cleanup = noop;\n\t\tconst sync = () => {\n\t\t\tif (pending) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tcleanup();\n\t\t\tconst result = fn(single ? values[0] : values, set, update);\n\t\t\tif (auto) {\n\t\t\t\tset(result);\n\t\t\t} else {\n\t\t\t\tcleanup = is_function(result) ? result : noop;\n\t\t\t}\n\t\t};\n\t\tconst unsubscribers = stores_array.map((store, i) =>\n\t\t\tsubscribe(\n\t\t\t\tstore,\n\t\t\t\t(value) => {\n\t\t\t\t\tvalues[i] = value;\n\t\t\t\t\tpending &= ~(1 << i);\n\t\t\t\t\tif (started) {\n\t\t\t\t\t\tsync();\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t() => {\n\t\t\t\t\tpending |= 1 << i;\n\t\t\t\t}\n\t\t\t)\n\t\t);\n\t\tstarted = true;\n\t\tsync();\n\t\treturn function stop() {\n\t\t\trun_all(unsubscribers);\n\t\t\tcleanup();\n\t\t\t// We need to set this to false because callbacks can still happen despite having unsubscribed:\n\t\t\t// Callbacks might already be placed in the queue which doesn't know it should no longer\n\t\t\t// invoke this derived store.\n\t\t\tstarted = false;\n\t\t};\n\t});\n}\n\n/**\n * Takes a store and returns a new one derived from the old one that is readable.\n *\n * https://svelte.dev/docs/svelte-store#readonly\n * @template T\n * @param {import('./public.js').Readable<T>} store - store to make readonly\n * @returns {import('./public.js').Readable<T>}\n */\nexport function readonly(store) {\n\treturn {\n\t\tsubscribe: store.subscribe.bind(store)\n\t};\n}\n\nexport { get_store_value as get };\n","/*\nAdapted from https://github.com/mattdesl\nDistributed under MIT License https://github.com/mattdesl/eases/blob/master/LICENSE.md\n*/\nexport { identity as linear } from '../internal/index.js';\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function backInOut(t) {\n\tconst s = 1.70158 * 1.525;\n\tif ((t *= 2) < 1) return 0.5 * (t * t * ((s + 1) * t - s));\n\treturn 0.5 * ((t -= 2) * t * ((s + 1) * t + s) + 2);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function backIn(t) {\n\tconst s = 1.70158;\n\treturn t * t * ((s + 1) * t - s);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function backOut(t) {\n\tconst s = 1.70158;\n\treturn --t * t * ((s + 1) * t + s) + 1;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function bounceOut(t) {\n\tconst a = 4.0 / 11.0;\n\tconst b = 8.0 / 11.0;\n\tconst c = 9.0 / 10.0;\n\tconst ca = 4356.0 / 361.0;\n\tconst cb = 35442.0 / 1805.0;\n\tconst cc = 16061.0 / 1805.0;\n\tconst t2 = t * t;\n\treturn t < a\n\t\t? 7.5625 * t2\n\t\t: t < b\n\t\t? 9.075 * t2 - 9.9 * t + 3.4\n\t\t: t < c\n\t\t? ca * t2 - cb * t + cc\n\t\t: 10.8 * t * t - 20.52 * t + 10.72;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function bounceInOut(t) {\n\treturn t < 0.5 ? 0.5 * (1.0 - bounceOut(1.0 - t * 2.0)) : 0.5 * bounceOut(t * 2.0 - 1.0) + 0.5;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function bounceIn(t) {\n\treturn 1.0 - bounceOut(1.0 - t);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function circInOut(t) {\n\tif ((t *= 2) < 1) return -0.5 * (Math.sqrt(1 - t * t) - 1);\n\treturn 0.5 * (Math.sqrt(1 - (t -= 2) * t) + 1);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function circIn(t) {\n\treturn 1.0 - Math.sqrt(1.0 - t * t);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function circOut(t) {\n\treturn Math.sqrt(1 - --t * t);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function cubicInOut(t) {\n\treturn t < 0.5 ? 4.0 * t * t * t : 0.5 * Math.pow(2.0 * t - 2.0, 3.0) + 1.0;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function cubicIn(t) {\n\treturn t * t * t;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function cubicOut(t) {\n\tconst f = t - 1.0;\n\treturn f * f * f + 1.0;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function elasticInOut(t) {\n\treturn t < 0.5\n\t\t? 0.5 * Math.sin(((+13.0 * Math.PI) / 2) * 2.0 * t) * Math.pow(2.0, 10.0 * (2.0 * t - 1.0))\n\t\t: 0.5 *\n\t\t\t\tMath.sin(((-13.0 * Math.PI) / 2) * (2.0 * t - 1.0 + 1.0)) *\n\t\t\t\tMath.pow(2.0, -10.0 * (2.0 * t - 1.0)) +\n\t\t\t\t1.0;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function elasticIn(t) {\n\treturn Math.sin((13.0 * t * Math.PI) / 2) * Math.pow(2.0, 10.0 * (t - 1.0));\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function elasticOut(t) {\n\treturn Math.sin((-13.0 * (t + 1.0) * Math.PI) / 2) * Math.pow(2.0, -10.0 * t) + 1.0;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function expoInOut(t) {\n\treturn t === 0.0 || t === 1.0\n\t\t? t\n\t\t: t < 0.5\n\t\t? +0.5 * Math.pow(2.0, 20.0 * t - 10.0)\n\t\t: -0.5 * Math.pow(2.0, 10.0 - t * 20.0) + 1.0;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function expoIn(t) {\n\treturn t === 0.0 ? t : Math.pow(2.0, 10.0 * (t - 1.0));\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function expoOut(t) {\n\treturn t === 1.0 ? t : 1.0 - Math.pow(2.0, -10.0 * t);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quadInOut(t) {\n\tt /= 0.5;\n\tif (t < 1) return 0.5 * t * t;\n\tt--;\n\treturn -0.5 * (t * (t - 2) - 1);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quadIn(t) {\n\treturn t * t;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quadOut(t) {\n\treturn -t * (t - 2.0);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quartInOut(t) {\n\treturn t < 0.5 ? +8.0 * Math.pow(t, 4.0) : -8.0 * Math.pow(t - 1.0, 4.0) + 1.0;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quartIn(t) {\n\treturn Math.pow(t, 4.0);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quartOut(t) {\n\treturn Math.pow(t - 1.0, 3.0) * (1.0 - t) + 1.0;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quintInOut(t) {\n\tif ((t *= 2) < 1) return 0.5 * t * t * t * t * t;\n\treturn 0.5 * ((t -= 2) * t * t * t * t + 2);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quintIn(t) {\n\treturn t * t * t * t * t;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function quintOut(t) {\n\treturn --t * t * t * t * t + 1;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function sineInOut(t) {\n\treturn -0.5 * (Math.cos(Math.PI * t) - 1);\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function sineIn(t) {\n\tconst v = Math.cos(t * Math.PI * 0.5);\n\tif (Math.abs(v) < 1e-14) return 1;\n\telse return 1 - v;\n}\n\n/**\n * https://svelte.dev/docs/svelte-easing\n * @param {number} t\n * @returns {number}\n */\nexport function sineOut(t) {\n\treturn Math.sin((t * Math.PI) / 2);\n}\n","import { cubicOut, cubicInOut, linear } from '../easing/index.js';\nimport { assign, split_css_unit, is_function } from '../internal/index.js';\n\n/**\n * Animates a `blur` filter alongside an element's opacity.\n *\n * https://svelte.dev/docs/svelte-transition#blur\n * @param {Element} node\n * @param {import('./public').BlurParams} [params]\n * @returns {import('./public').TransitionConfig}\n */\nexport function blur(\n\tnode,\n\t{ delay = 0, duration = 400, easing = cubicInOut, amount = 5, opacity = 0 } = {}\n) {\n\tconst style = getComputedStyle(node);\n\tconst target_opacity = +style.opacity;\n\tconst f = style.filter === 'none' ? '' : style.filter;\n\tconst od = target_opacity * (1 - opacity);\n\tconst [value, unit] = split_css_unit(amount);\n\treturn {\n\t\tdelay,\n\t\tduration,\n\t\teasing,\n\t\tcss: (_t, u) => `opacity: ${target_opacity - od * u}; filter: ${f} blur(${u * value}${unit});`\n\t};\n}\n\n/**\n * Animates the opacity of an element from 0 to the current opacity for `in` transitions and from the current opacity to 0 for `out` transitions.\n *\n * https://svelte.dev/docs/svelte-transition#fade\n * @param {Element} node\n * @param {import('./public').FadeParams} [params]\n * @returns {import('./public').TransitionConfig}\n */\nexport function fade(node, { delay = 0, duration = 400, easing = linear } = {}) {\n\tconst o = +getComputedStyle(node).opacity;\n\treturn {\n\t\tdelay,\n\t\tduration,\n\t\teasing,\n\t\tcss: (t) => `opacity: ${t * o}`\n\t};\n}\n\n/**\n * Animates the x and y positions and the opacity of an element. `in` transitions animate from the provided values, passed as parameters to the element's default values. `out` transitions animate from the element's default values to the provided values.\n *\n * https://svelte.dev/docs/svelte-transition#fly\n * @param {Element} node\n * @param {import('./public').FlyParams} [params]\n * @returns {import('./public').TransitionConfig}\n */\nexport function fly(\n\tnode,\n\t{ delay = 0, duration = 400, easing = cubicOut, x = 0, y = 0, opacity = 0 } = {}\n) {\n\tconst style = getComputedStyle(node);\n\tconst target_opacity = +style.opacity;\n\tconst transform = style.transform === 'none' ? '' : style.transform;\n\tconst od = target_opacity * (1 - opacity);\n\tconst [xValue, xUnit] = split_css_unit(x);\n\tconst [yValue, yUnit] = split_css_unit(y);\n\treturn {\n\t\tdelay,\n\t\tduration,\n\t\teasing,\n\t\tcss: (t, u) => `\n\t\t\ttransform: ${transform} translate(${(1 - t) * xValue}${xUnit}, ${(1 - t) * yValue}${yUnit});\n\t\t\topacity: ${target_opacity - od * u}`\n\t};\n}\n\n/**\n * Slides an element in and out.\n *\n * https://svelte.dev/docs/svelte-transition#slide\n * @param {Element} node\n * @param {import('./public').SlideParams} [params]\n * @returns {import('./public').TransitionConfig}\n */\nexport function slide(node, { delay = 0, duration = 400, easing = cubicOut, axis = 'y' } = {}) {\n\tconst style = getComputedStyle(node);\n\tconst opacity = +style.opacity;\n\tconst primary_property = axis === 'y' ? 'height' : 'width';\n\tconst primary_property_value = parseFloat(style[primary_property]);\n\tconst secondary_properties = axis === 'y' ? ['top', 'bottom'] : ['left', 'right'];\n\tconst capitalized_secondary_properties = secondary_properties.map(\n\t\t(e) => `${e[0].toUpperCase()}${e.slice(1)}`\n\t);\n\tconst padding_start_value = parseFloat(style[`padding${capitalized_secondary_properties[0]}`]);\n\tconst padding_end_value = parseFloat(style[`padding${capitalized_secondary_properties[1]}`]);\n\tconst margin_start_value = parseFloat(style[`margin${capitalized_secondary_properties[0]}`]);\n\tconst margin_end_value = parseFloat(style[`margin${capitalized_secondary_properties[1]}`]);\n\tconst border_width_start_value = parseFloat(\n\t\tstyle[`border${capitalized_secondary_properties[0]}Width`]\n\t);\n\tconst border_width_end_value = parseFloat(\n\t\tstyle[`border${capitalized_secondary_properties[1]}Width`]\n\t);\n\treturn {\n\t\tdelay,\n\t\tduration,\n\t\teasing,\n\t\tcss: (t) =>\n\t\t\t'overflow: hidden;' +\n\t\t\t`opacity: ${Math.min(t * 20, 1) * opacity};` +\n\t\t\t`${primary_property}: ${t * primary_property_value}px;` +\n\t\t\t`padding-${secondary_properties[0]}: ${t * padding_start_value}px;` +\n\t\t\t`padding-${secondary_properties[1]}: ${t * padding_end_value}px;` +\n\t\t\t`margin-${secondary_properties[0]}: ${t * margin_start_value}px;` +\n\t\t\t`margin-${secondary_properties[1]}: ${t * margin_end_value}px;` +\n\t\t\t`border-${secondary_properties[0]}-width: ${t * border_width_start_value}px;` +\n\t\t\t`border-${secondary_properties[1]}-width: ${t * border_width_end_value}px;`\n\t};\n}\n\n/**\n * Animates the opacity and scale of an element. `in` transitions animate from an element's current (default) values to the provided values, passed as parameters. `out` transitions animate from the provided values to an element's default values.\n *\n * https://svelte.dev/docs/svelte-transition#scale\n * @param {Element} node\n * @param {import('./public').ScaleParams} [params]\n * @returns {import('./public').TransitionConfig}\n */\nexport function scale(\n\tnode,\n\t{ delay = 0, duration = 400, easing = cubicOut, start = 0, opacity = 0 } = {}\n) {\n\tconst style = getComputedStyle(node);\n\tconst target_opacity = +style.opacity;\n\tconst transform = style.transform === 'none' ? '' : style.transform;\n\tconst sd = 1 - start;\n\tconst od = target_opacity * (1 - opacity);\n\treturn {\n\t\tdelay,\n\t\tduration,\n\t\teasing,\n\t\tcss: (_t, u) => `\n\t\t\ttransform: ${transform} scale(${1 - sd * u});\n\t\t\topacity: ${target_opacity - od * u}\n\t\t`\n\t};\n}\n\n/**\n * Animates the stroke of an SVG element, like a snake in a tube. `in` transitions begin with the path invisible and draw the path to the screen over time. `out` transitions start in a visible state and gradually erase the path. `draw` only works with elements that have a `getTotalLength` method, like `<path>` and `<polyline>`.\n *\n * https://svelte.dev/docs/svelte-transition#draw\n * @param {SVGElement & { getTotalLength(): number }} node\n * @param {import('./public').DrawParams} [params]\n * @returns {import('./public').TransitionConfig}\n */\nexport function draw(node, { delay = 0, speed, duration, easing = cubicInOut } = {}) {\n\tlet len = node.getTotalLength();\n\tconst style = getComputedStyle(node);\n\tif (style.strokeLinecap !== 'butt') {\n\t\tlen += parseInt(style.strokeWidth);\n\t}\n\tif (duration === undefined) {\n\t\tif (speed === undefined) {\n\t\t\tduration = 800;\n\t\t} else {\n\t\t\tduration = len / speed;\n\t\t}\n\t} else if (typeof duration === 'function') {\n\t\tduration = duration(len);\n\t}\n\treturn {\n\t\tdelay,\n\t\tduration,\n\t\teasing,\n\t\tcss: (_, u) => `\n\t\t\tstroke-dasharray: ${len};\n\t\t\tstroke-dashoffset: ${u * len};\n\t\t`\n\t};\n}\n\n/**\n * The `crossfade` function creates a pair of [transitions](https://svelte.dev/docs#template-syntax-element-directives-transition-fn) called `send` and `receive`. When an element is 'sent', it looks for a corresponding element being 'received', and generates a transition that transforms the element to its counterpart's position and fades it out. When an element is 'received', the reverse happens. If there is no counterpart, the `fallback` transition is used.\n *\n * https://svelte.dev/docs/svelte-transition#crossfade\n * @param {import('./public').CrossfadeParams & {\n * \tfallback?: (node: Element, params: import('./public').CrossfadeParams, intro: boolean) => import('./public').TransitionConfig;\n * }} params\n * @returns {[(node: any, params: import('./public').CrossfadeParams & { key: any; }) => () => import('./public').TransitionConfig, (node: any, params: import('./public').CrossfadeParams & { key: any; }) => () => import('./public').TransitionConfig]}\n */\nexport function crossfade({ fallback, ...defaults }) {\n\t/** @type {Map<any, Element>} */\n\tconst to_receive = new Map();\n\t/** @type {Map<any, Element>} */\n\tconst to_send = new Map();\n\t/**\n\t * @param {Element} from_node\n\t * @param {Element} node\n\t * @param {import('./public').CrossfadeParams} params\n\t * @returns {import('./public').TransitionConfig}\n\t */\n\tfunction crossfade(from_node, node, params) {\n\t\tconst {\n\t\t\tdelay = 0,\n\t\t\tduration = (d) => Math.sqrt(d) * 30,\n\t\t\teasing = cubicOut\n\t\t} = assign(assign({}, defaults), params);\n\t\tconst from = from_node.getBoundingClientRect();\n\t\tconst to = node.getBoundingClientRect();\n\t\tconst dx = from.left - to.left;\n\t\tconst dy = from.top - to.top;\n\t\tconst dw = from.width / to.width;\n\t\tconst dh = from.height / to.height;\n\t\tconst d = Math.sqrt(dx * dx + dy * dy);\n\t\tconst style = getComputedStyle(node);\n\t\tconst transform = style.transform === 'none' ? '' : style.transform;\n\t\tconst opacity = +style.opacity;\n\t\treturn {\n\t\t\tdelay,\n\t\t\tduration: is_function(duration) ? duration(d) : duration,\n\t\t\teasing,\n\t\t\tcss: (t, u) => `\n\t\t\t\topacity: ${t * opacity};\n\t\t\t\ttransform-origin: top left;\n\t\t\t\ttransform: ${transform} translate(${u * dx}px,${u * dy}px) scale(${t + (1 - t) * dw}, ${\n\t\t\t\tt + (1 - t) * dh\n\t\t\t});\n\t\t\t`\n\t\t};\n\t}\n\n\t/**\n\t * @param {Map<any, Element>} items\n\t * @param {Map<any, Element>} counterparts\n\t * @param {boolean} intro\n\t * @returns {(node: any, params: import('./public').CrossfadeParams & { key: any; }) => () => import('./public').TransitionConfig}\n\t */\n\tfunction transition(items, counterparts, intro) {\n\t\treturn (node, params) => {\n\t\t\titems.set(params.key, node);\n\t\t\treturn () => {\n\t\t\t\tif (counterparts.has(params.key)) {\n\t\t\t\t\tconst other_node = counterparts.get(params.key);\n\t\t\t\t\tcounterparts.delete(params.key);\n\t\t\t\t\treturn crossfade(other_node, node, params);\n\t\t\t\t}\n\t\t\t\t// if the node is disappearing altogether\n\t\t\t\t// (i.e. wasn't claimed by the other list)\n\t\t\t\t// then we need to supply an outro\n\t\t\t\titems.delete(params.key);\n\t\t\t\treturn fallback && fallback(node, params, intro);\n\t\t\t};\n\t\t};\n\t}\n\treturn [transition(to_send, to_receive, false), transition(to_receive, to_send, true)];\n}\n","// generated during release, do not modify\n\n/**\n * The current version, as set in package.json.\n *\n * https://svelte.dev/docs/svelte-compiler#svelte-version\n * @type {string}\n */\nexport const VERSION = '4.2.16';\nexport const PUBLIC_VERSION = '4';\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\tid: moduleId,\n\t\tloaded: false,\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n\t// Flag the module as loaded\n\tmodule.loaded = true;\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.g = (function() {\n\tif (typeof globalThis === 'object') return globalThis;\n\ttry {\n\t\treturn this || new Function('return this')();\n\t} catch (e) {\n\t\tif (typeof window === 'object') return window;\n\t}\n})();","__webpack_require__.hmd = (module) => {\n\tmodule = Object.create(module);\n\tif (!module.children) module.children = [];\n\tObject.defineProperty(module, 'exports', {\n\t\tenumerable: true,\n\t\tset: () => {\n\t\t\tthrow new Error('ES Modules may not assign module.exports or exports.*, Use ESM export syntax, instead: ' + module.id);\n\t\t}\n\t});\n\treturn module;\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import { data, Signal, View } from \"@lernetz/ts-lib\";\nimport {gateway} from \"../../services/gateway\";\nimport template from './App.html';\n\nexport class AppView extends View {\n constructor( config? ) {\n super( { template, ...config } );\n }\n}\n\nexport class AppController {\n scrollEvent: Signal<unknown>;\n modal: any;\n scrollElement: HTMLElement;\n constructor() {\n this.scrollEvent = new Signal();\n gateway.loadGeneralInfos().then(generalInfos => {\n\n this.modal = {\n 'enable': generalInfos.modalEnable,\n 'title': generalInfos.modalTitle,\n 'description': generalInfos.modalDescription,\n 'buttonLink': generalInfos.modalButtonLink,\n 'buttonLinkText': generalInfos.modalButtonLinkText,\n };\n });\n }\n}\n","// Module\nvar code = \"<div id=\\\"skip-navigation\\\"><a href=\\\"#maincontent\\\" tabindex=\\\"1\\\">[[ this.trans('jump-to-the-main-content')]]</a></div> <div class=\\\"flex flex-col h-full\\\"> <div view=\\\"Navigation\\\" data-scroll-observable=\\\"[[ ctrl.scrollEvent ]]\\\"></div> <main id=\\\"scroll-container\\\" class=\\\"h-[calc(100vh-96px)] overflow-y-auto flex flex-col\\\" on-scroll=\\\"[[ ctrl.scrollEvent.dispatch(event) ]]\\\"> <div view=\\\"Router\\\" class=\\\"h-full\\\"></div> </main> <div view=\\\"Modal\\\" data-info=\\\"[[ ctrl.modal ]]\\\"></div> </div> \";\n// Exports\nexport default code;","import { View, Model } from \"@lernetz/ts-lib\";\nimport { ViewConfig } from '@lernetz/ts-lib/src/view/View';\n\nconst defaultStyles = {\n 'h1': 'text-style -h1',\n 'h2': 'text-style -h2',\n 'h3': 'text-style -h3',\n 'h4': 'text-style -h4',\n 'h5': 'text-style -h5',\n 'h6': 'text-style -h6',\n};\n\nexport class Heading extends Model {\n html: string;\n level: 1 | 2 | 3 | 4 | 5 | 6;\n readonly styles?: { [ tagName:string ]:string };\n}\n\nexport class HeadingView extends View<Heading> {\n\n private readonly _styles: { [tagName:string ]:string };\n\n public constructor( config?:ViewConfig<Heading> ) {\n super( { data:new Heading(), ...config } );\n }\n\n public init() {\n this.update();\n }\n\n public update() {\n if( this.data ) {\n const { level, html } = this.data;\n let validatedLevel = Number( level ) || 6;\n if( validatedLevel < 1 || 6 < validatedLevel) validatedLevel = 6;\n this.node.innerHTML = `<h${validatedLevel}>${html}</h${validatedLevel}>`;\n }\n else {\n this.node.innerHTML = '';\n }\n\n this.applyStyles();\n }\n\n applyStyles() {\n const walker = document.createTreeWalker( this.node, NodeFilter.SHOW_ELEMENT );\n const styles = this?.data?.styles ?? defaultStyles;\n while( walker.nextNode() ) {\n const key = walker.currentNode.nodeName.toLowerCase();\n if( key in styles ) {\n const element = walker.currentNode as Element;\n element.classList.add.apply( element.classList, styles[ key ].split( ' ' ) );\n }\n }\n }\n}\n","import { View, ViewConfig } from \"@lernetz/ts-lib\";\nimport template from './SvgIcon.html';\n\nvar mounted;\n\nexport interface SvgIconViewConfig extends ViewConfig<SvgIcon> {\n symbols: string;\n shadowDom?: boolean;\n}\n\nexport class SvgIconView extends View {\n\n symbols: string;\n shadowDom: boolean = false;\n\n constructor( config: SvgIconViewConfig ) {\n super( { template, data: {}, ...config } );\n this.symbols = config.symbols;\n }\n\n\n init() {\n if( mounted ) return;\n\n mounted = true;\n\n if( this.shadowDom ) {\n requestAnimationFrame( () => {\n mount( this.symbols, this.node.getRootNode() );\n });\n } else {\n mount( this.symbols, document.body );\n }\n }\n\n\n}\n\nexport interface SvgIcon {\n name: string;\n}\n\n\nexport function mount( symbols: string, root:Node ) {\n let div = document.createElement( 'div' );\n div.style.display = 'none';\n div.innerHTML = symbols;\n root.insertBefore( div, root.firstChild );\n}\n\n\n","import { View, Model, Template } from \"@lernetz/ts-lib\";\nimport { ViewConfig } from \"@lernetz/ts-lib/src/view/View\";\nimport { Subscription } from \"@lernetz/ts-lib/src/Signal\";\nimport { observeProperties } from \"@lernetz/ts-lib/src/Observer\";\n\nvar defaultStyles = {\n 'p': 'text-style -para',\n 'b': 'text-style -b',\n 'i': 'text-style -i',\n 'a': 'text-style -a',\n 'ul': 'text-style -list',\n 'ol': 'text-style -list',\n}\n\nexport class Html extends Model {\n styles:{[key:string]:string};\n html:string;\n}\n\nexport class HtmlView extends View<Html> {\n\n subscription: Subscription;\n\n constructor( config?:ViewConfig<Html> ) {\n super( { data:new Html( { styles:defaultStyles } ), ...config } );\n }\n\n init() {\n this.subscription = observeProperties( this.data, 'html' ).propertyChange.filter( e => e.name == 'html' ).subscribe( this.update.bind( this ) );\n this.update();\n }\n\n deinit() {\n this.subscription.unsubscribe();\n }\n\n update() {\n this.node.innerHTML = this.data.html ? this.data.html : '';\n this.applyStyles();\n this.resolveViews();\n }\n\n resolveViews() {\n\n // remove view attribute to prevent reinitalize\n let viewName = this.node.getAttribute( 'view' );\n this.node.removeAttribute( 'view' );\n\n let sub = new Template( this.node );\n // inject parent data to resolve from outside\n sub.context.data = this.context.parent.data;\n // add this context to prototype chaine of sub context\n Object.setPrototypeOf( sub.context, this.context );\n\n sub.render();\n\n // reapply view name\n this.node.setAttribute( 'view', viewName );\n }\n\n applyStyles() {\n const walker = document.createTreeWalker( this.node, NodeFilter.SHOW_ELEMENT );\n while( walker.nextNode() ) {\n const key = walker.currentNode.nodeName.toLowerCase();\n if( key in this.data.styles ) {\n const element = walker.currentNode as Element;\n element.classList.add.apply( element.classList, this.data.styles[key].split( ' ' ) );\n }\n }\n }\n}\n","// Module\nvar code = \"<svg class=\\\"svg-icon\\\"> <use xlink:href=\\\"#[[ name ]]\\\"/> </svg> \";\n// Exports\nexport default code;","import { Signal, View } from \"@lernetz/ts-lib\";\nimport {observeProperties} from \"@lernetz/ts-lib/src/Observer\";\nimport {languageService} from \"../../services/lang\";\nimport { router } from \"../../services/router\";\nimport template from \"./Navigation.html\";\n\nexport class NavigationView extends View {\n constructor() {\n super({ template, data: new NavigationController() });\n }\n\n init() {}\n}\n\nclass NavigationController {\n router = router;\n currentLang: string;\n mobileMenuOpen: boolean;\n showZoom = true;\n\n scrollObservable: Signal<unknown>;\n scrollHandler: any;\n\n constructor() {\n this.currentLang = languageService.currentLang;\n observeProperties(this.router, 'current').propertyChange.subscribe(arg => {\n if (this.router.current.route.name === 'home') {\n this.showZoom = false;\n if (!this.scrollHandler) {\n this.scrollHandler = this.scrollObservable.subscribe(() => {\n this.updateZoomState();\n });\n }\n } else {\n this.showZoom = true;\n }\n });\n }\n changeLanguage(lang) {\n languageService.changeLanguage(lang, router);\n }\n\n mobileToRoute(urlName, params?) {\n this.mobileMenuOpen = false;\n this.router.toRoute(urlName, params);\n }\n\n updateZoomState() {\n const rect = document.getElementById('searchrow').getBoundingClientRect().top;\n if (rect < 0 && !this.showZoom) {\n this.showZoom = true;\n } else if (rect > 0 && this.showZoom) {\n this.showZoom = false;\n }\n }\n\n}\n\n","// Module\nvar code = \"<nav class=\\\"fixed z-50 w-full bg-white\\\"> <div aria-label=\\\"[[ this.trans('header-area') ]]\\\" role=\\\"navigation\\\" class=\\\"flex items-center h-16 px-6 lg:h-24\\\"> <a view=\\\"RouteLink\\\" data-path=\\\"[[`/${currentLang}`]]\\\" class=\\\"cursor-pointer h-full pt-1 pb-1\\\" aria-label=\\\"[[ this.trans('to-the-landing-page') ]]\\\" alt=\\\"[[ this.trans('to-the-landing-page') ]]\\\" title=\\\"[[ this.trans('to-the-landing-page') ]]\\\" tabindex=\\\"2\\\"> <div class=\\\"h-full\\\"> <img src=\\\"/static/logo-t-tools.svg\\\" class=\\\"h-full\\\" alt=\\\"[[ this.trans('uzh-and-tt-logo') ]]\\\" title=\\\"[[ this.trans('uzh-and-tt-logo') ]]\\\"/> </div> </a> <div class=\\\"flex-1\\\"></div> <ul class=\\\"items-center hidden lg:flex\\\"> <li> <a view=\\\"RouteLink\\\" class=\\\"whitespace-nowrap\\\" data-path=\\\"[[`/${currentLang}/tools`]]\\\" aria-label=\\\"[[ this.trans('to-the-tools') ]]\\\" alt=\\\"[[ this.trans('to-the-tools') ]]\\\" title=\\\"[[ this.trans('to-the-tools') ]]\\\" tabindex=\\\"3\\\"> <div class=\\\"ml-6 text-2xl font-semibold nav-item [[{ 'nav-active': router._current.route.name.includes('tools') }]]\\\">Tools</div> </a> </li> <li> <a class=\\\"whitespace-nowrap ml-6 text-2xl font-semibold nav-item [[{ 'nav-active': router._current.route.name.includes('good-practice'), 'italic': router._current.route.name.includes('good-practice') }]]\\\" on-click=\\\"[[ router.toRoute('good-practice', { lang: currentLang }) ]]\\\" aria-label=\\\"[[ this.trans('to-the-good-practices') ]]\\\" alt=\\\"[[ this.trans('to-the-good-practices') ]]\\\" title=\\\"[[ this.trans('to-the-good-practices') ]]\\\" tabindex=\\\"4\\\"> Good Practice </a> </li> </ul> <ul class=\\\"flex items-center\\\"> <li class=\\\"hidden lg:block\\\" view=\\\"Show\\\" data-if=\\\"[[ showZoom ]]\\\"> <button on-click=\\\"[[router.toRoute('search', {lang: currentLang})]]\\\" class=\\\"flex ml-8 pr-5 text-xl black text-black py-2.5 border-[3px] border-black relative overflow-ellipsis\\\" aria-label=\\\"[[ this.trans('to-the-search') ]]\\\" alt=\\\"[[ this.trans('to-the-search') ]]\\\" title=\\\"[[ this.trans('to-the-search') ]]\\\" tabindex=\\\"5\\\"> <svg class=\\\"w-6 h-6 mx-5\\\" view=\\\"Icon\\\" data-name=\\\"icon-lupe\\\"></svg> <span class=\\\"whitespace-nowrap\\\">[[ this.trans('search') ]]</span> </button> </li> <li class=\\\"ml-6 lg:hidden\\\" view=\\\"Show\\\" data-if=\\\"[[ showZoom ]]\\\"> <button on-click=\\\"[[router.toRoute('search', {lang: currentLang})]]\\\" class=\\\"flex select-none\\\" aria-label=\\\"[[ this.trans('to-the-search') ]]\\\" alt=\\\"[[ this.trans('to-the-search') ]]\\\" title=\\\"[[ this.trans('to-the-search') ]]\\\" tabindex=\\\"5\\\"> <svg class=\\\"w-8 lg:w-10\\\" view=\\\"Icon\\\" data-name=\\\"icon-lupe\\\"></svg> </button> </li> <li view=\\\"Show\\\" data-if=\\\"[[ showZoom ]]\\\" class=\\\"ml-4 lg:ml-8\\\"> <div on-click=\\\"[[router.toRoute('wizard', {lang: currentLang})]]\\\" class=\\\"bg-black rounded-full lg:w-[56px] lg:h-[56px] w-8 h-8 cursor-pointer flex items-center justify-center text-white group\\\" aria-label=\\\"[[ this.trans('to-the-wizard') ]]\\\" alt=\\\"[[ this.trans('to-the-wizard') ]]\\\" title=\\\"[[ this.trans('to-the-wizard') ]]\\\" tabindex=\\\"6\\\" role=\\\"link\\\"> <svg class=\\\"w-5 h-5 lg:w-8 lg:h-8 block group-hover:hidden\\\" view=\\\"Icon\\\" data-name=\\\"icon-zauberstab-side\\\"></svg> <svg class=\\\"w-5 h-5 lg:w-8 lg:h-8 hidden group-hover:block\\\" view=\\\"Icon\\\" data-name=\\\"icon-zauberstab-side-hover\\\"></svg> </div> </li> </ul> <div class=\\\"hidden lg:block\\\"> <a on-click=\\\"[[ router.toRoute('page', {lang: currentLang, slug: 'kontakt'})]]\\\" class=\\\"ml-8 nav-item\\\" href=\\\"/[[currentLang]]/p/kontakt\\\" aria-label=\\\"[[ this.trans('to-the-contact-page') ]]\\\" alt=\\\"[[ this.trans('to-the-contact-page') ]]\\\" title=\\\"[[ this.trans('to-the-contact-page') ]]\\\" tabindex=\\\"7\\\"> [[this.trans('contact')]] </a> </div> <div class=\\\"hidden mx-6 lg:flex\\\"> <a on-click=\\\"[[changeLanguage('de', router)]]\\\" class=\\\"language-link [[ { '-active': currentLang == 'de'}]] cursor-pointer\\\" aria-label=\\\"[[ this.trans('language-chooser-german') ]]\\\" alt=\\\"[[ this.trans('language-chooser-german') ]]\\\" title=\\\"[[ this.trans('language-chooser-german') ]]\\\" tabindex=\\\"8\\\">DE</a> <a on-click=\\\"[[changeLanguage('en', router)]]\\\" class=\\\"language-link [[ { '-active': currentLang == 'en'}]] cursor-pointer\\\" aria-label=\\\"[[ this.trans('language-chooser-english') ]]\\\" alt=\\\"[[ this.trans('language-chooser-english') ]]\\\" title=\\\"[[ this.trans('language-chooser-english') ]]\\\" tabindex=\\\"9\\\">EN</a> </div> <div on-click=\\\"[[mobileMenuOpen = !mobileMenuOpen]]\\\" class=\\\"ml-4 select-none lg:hidden\\\" aria-label=\\\"[[ this.trans('open-menu') ]]\\\" alt=\\\"[[ this.trans('open-menu') ]]\\\" title=\\\"[[ this.trans('open-menu') ]]\\\" tabindex=\\\"7\\\" role=\\\"button\\\"> <svg view=\\\"Icon\\\" data-name=\\\"[[ mobileMenuOpen ? 'icon-menu-close' : 'icon-menu' ]]\\\" class=\\\"w-8 h-8 cursor-pointer\\\"> </svg> </div> </div> </nav> <div view=\\\"Overlay\\\" role=\\\"dialog\\\" class=\\\"lg:hidden [[ {'hidden': !mobileMenuOpen}]]\\\" on-signal=\\\"[[mobileMenuOpen=false]]\\\"> <div role=\\\"navigation\\\" class=\\\"flex flex-col items-baseline p-6 bg-white left-1/4 space-y-6\\\"> <a class=\\\"text-2xl font-semibold cursor-pointer hover:italic [[{ 'nav-active': router._current.route.name.includes('tools') }]]\\\" on-click=\\\"[[ mobileToRoute('tools', { lang: currentLang})]]\\\" aria-label=\\\"[[ this.trans('to-the-tools') ]]\\\" alt=\\\"[[ this.trans('to-the-tools') ]]\\\" title=\\\"[[ this.trans('to-the-tools') ]]\\\" tabindex=\\\"12\\\">Tools</a> <a class=\\\"text-2xl font-semibold cursor-pointer hover:italic [[{ 'text-active': router._current.route.name.includes('good-practice'), 'italic': router._current.route.name.includes('good-practice') }]]\\\" on-click=\\\"[[ mobileToRoute('good-practice', { lang: currentLang })]]\\\" aria-label=\\\"[[ this.trans('to-the-good-practices') ]]\\\" alt=\\\"[[ this.trans('to-the-good-practices') ]]\\\" title=\\\"[[ this.trans('to-the-good-practices') ]]\\\" tabindex=\\\"13\\\">Good Practice</a> <a class=\\\"font-medium hover:italic\\\" href=\\\"/[[currentLang]]/p/kontakt\\\" on-click=\\\"[[ mobileToRoute('page', {lang: currentLang, slug: 'kontakt'})]]\\\" aria-label=\\\"[[ this.trans('to-the-contact-page') ]]\\\" alt=\\\"[[ this.trans('to-the-contact-page') ]]\\\" title=\\\"[[ this.trans('to-the-contact-page') ]]\\\" tabindex=\\\"14\\\"> [[this.trans('contact')]] </a> <div class=\\\"lg:flex\\\"> <a on-click=\\\"[[changeLanguage('de', router)]]\\\" class=\\\"cursor-pointer [[ { 'text-grey_3': currentLang !== 'de'}]]\\\" aria-label=\\\"[[ this.trans('language-chooser-german') ]]\\\" alt=\\\"[[ this.trans('language-chooser-german') ]]\\\" title=\\\"[[ this.trans('language-chooser-german') ]]\\\" tabindex=\\\"15\\\">DE</a> | <a on-click=\\\"[[changeLanguage('en', router)]]\\\" class=\\\"cursor-pointer [[ { 'text-grey_3': currentLang !== 'en'}]]\\\" aria-label=\\\"[[ this.trans('language-chooser-english') ]]\\\" alt=\\\"[[ this.trans('language-chooser-english') ]]\\\" title=\\\"[[ this.trans('language-chooser-english') ]]\\\" tabindex=\\\"16\\\">EN</a> </div> </div> </div> <div class=\\\"h-16 lg:h-24\\\"></div> \";\n// Exports\nexport default code;","import {Model, Signal, View} from \"@lernetz/ts-lib\"\nimport template from \"./Topics.html\";\n\nexport class Topics extends View {\n\n constructor() {\n super({ template, data: new TopicsController()})\n }\n\n}\n\nclass TopicsController extends Model {\n // inputs\n public topics;\n choice: Signal<unknown>;\n active: any;\n\n constructor() {\n super();\n this.choice = new Signal();\n }\n\n choose(item) {\n if (window.innerWidth < 768) {\n document.querySelector('#topics').scrollIntoView({\n behavior: 'smooth'\n });\n }\n this.choice.dispatch(item);\n }\n\n}\n","// Module\nvar code = \"<div id=\\\"topics\\\"> <h2 aria-label=\\\"[[ this.trans('choose-topic-to-filter-tools') ]]\\\" class=\\\"text-[26px] font-semibold\\\">[[ name ]]</h2> <div view=\\\"Slider\\\" class=\\\"h-56 lg:h-52\\\"> <template name=\\\"MainContent\\\"> <div> <div view=\\\"Repeat\\\" data-items=\\\"[[ topics ]]\\\" data-as=\\\"topic\\\" class=\\\"flex items-center space-x-8 h-52\\\"> <button on-click=\\\"[[parent.choose(topic)]]\\\" class=\\\"flex justify-center px-6 w-[calc(100vw-96px)] sm:w-[calc(50vw-64px)] md:w-[calc(33vw-64px)] lg:w-[calc(25vw-64px)] xl:w-64 text-xl transition [[ parent.active === topic ? 'scale-110 italic' : '' ]] hover:scale-110 hover:italic font-semibold my-2.5 place-items-center vertical h-44 topic-box flex-shrink-0\\\"> [[ topic.name ]] </button> </div> </div> </template> <template name=\\\"ControlLeft\\\"> <div> <div class=\\\"flex items-center justify-center bg-black rounded-full w-14 h-14 cursor-pointer\\\"> <svg class=\\\"text-white w-7 h-7\\\" view=\\\"Icon\\\" data-name=\\\"icon-arrow-left\\\"></svg> </div> </div> </template> <template name=\\\"ControlRight\\\"> <div> <div class=\\\"flex items-center justify-center bg-black rounded-full w-14 h-14 cursor-pointer\\\"> <svg class=\\\"text-white w-7 h-7\\\" view=\\\"Icon\\\" data-name=\\\"icon-arrow-right\\\"></svg> </div> </div> </template> </div> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport template from './Wizard.html';\n\nexport class WizardView extends View {\n constructor() {\n super({template})\n }\n\n}\n\n","// Module\nvar code = \"<article id=\\\"maincontent\\\"> <div class=\\\"w-full md:h-full md:grid md:grid-cols-2\\\"> <div class=\\\"pt-6 md:pt-[30px] pb-20 px-6 md:px-20 [[ {'bg-t_blue': level%5 === 0, 'bg-brown': level%5===1, 'bg-coral': level%5===2, 'bg-green': level%5===3, 'bg-yellow': level%5===4 } ]]\\\"> <div view=\\\"Show\\\" data-if=\\\"[[ level!==0]]\\\" class=\\\"\\\"> <a on-click=\\\"[[ back() ]]\\\" class=\\\"flex items-center cursor-pointer md:-ml-10 space-x-4\\\"> <svg view=\\\"Icon\\\" data-name=\\\"icon-arrow-left\\\" class=\\\"w-6 h-6 shrink-0\\\"></svg> <span class=\\\"text-xl\\\">[[this.trans('back')]]</span> </a> </div> <h1 class=\\\"mt-12 md:mt-16 tt-h3\\\">[[ question ]]</h1> </div> <div class=\\\"px-6 py-12 bg-black md:p-20\\\"> <div view=\\\"Repeat\\\" data-items=\\\"[[ answers ]]\\\" data-as=\\\"answer\\\" class=\\\"flex flex-col h-full space-y-4\\\"> <button tabindex=\\\"9\\\" on-click=\\\"[[ answer.goTo(parent.level, parent.activeTags) ]]\\\" class=\\\"text-left p-6 font-semibold bg-white cursor-pointer hover:italic\\\">[[ answer.answer ]]</button> </div> </div> </div> </article> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {languageService} from \"../../services/lang\";\nimport template from \"./good-practice.view.html\";\n\nexport class GoodPracticeView extends View {\n currentLang: any;\n constructor() {\n super({ template });\n }\n init() {\n this.data.currentLang = languageService.currentLang;\n }\n}\n","// Module\nvar code = \"<div class=\\\"w-full\\\"> <article id=\\\"maincontent\\\" class=\\\"px-8 mx-auto max-w-screen-xl\\\"> <div class=\\\"py-20\\\"> <h1 class=\\\"text-5xl italic font-bold mb-xl\\\">Good Practice</h1> <div class=\\\"text-3xl\\\">[[ this.trans('good-practice-lead') ]]</div> </div> <div view=\\\"Repeat\\\" data-items=\\\"[[ goodPractices ]]\\\" data-as=\\\"goodPractice\\\" class=\\\"md:grid gap-16 grid-cols-2\\\"> <a href=\\\"/[[ parent.currentLang ]]/good-practice/[[ goodPractice.slug]]\\\" class=\\\"flex flex-col cursor-pointer group\\\"> <div class=\\\"w-full overflow-hidden h-60\\\"> <img class=\\\"object-cover w-full h-60 group-hover:scale-125 transition duration-300 ease-in-out\\\" src=\\\"[[ this.setup.route('asset', { preset:'large', ext:goodPractice.preview_image.ext, file_name:goodPractice.preview_image.file_name }).url() ]]\\\"/> </div> <div class=\\\"py-8 md:px-8\\\"> <h2 class=\\\"mb-4 font-semibold text-myh3 group-hover:italic\\\">[[ goodPractice.title ]]</h2> <span view=\\\"Repeat\\\" data-items=\\\"[[ goodPractice.authors ]]\\\" data-as=\\\"author\\\"> <span class=\\\"mr-4 font-mono\\\">[[ author.author.name ]], </span> </span> <span class=\\\"font-mono\\\">[[goodPractice.date]]</span> </div> </a> </div> </article> <div view=\\\"Footer\\\"></div> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {observeArray} from \"@lernetz/ts-lib/src/Observer\";\nimport template from \"./list.view.html\";\nimport toolTemplate from \"./cards/tool.template.html\";\nimport gpTemplate from \"./cards/good-practice.template.html\";\nimport {languageService} from \"../../../services/lang\";\n\nexport class ToolListView extends View {\n constructor() {\n super({ template })\n this.registry.add('App\\\\Tool', () => new View({template: toolTemplate}));\n this.registry.add('App\\\\GoodPractice', () => new View({template: gpTemplate}));\n }\n init() {\n observeArray(this.data.tools);\n this.data.lang = languageService.currentLang\n }\n}\n","// Module\nvar code = \"<div class=\\\"\\\"> <h2 class=\\\"text-[26px] font-semibold my-m\\\">[[ title ]]</h2> <ul aria-label=\\\"[[ label ]]\\\" tabindex=\\\"0\\\" view=\\\"Repeat\\\" data-items=\\\"[[ tools ]]\\\" data-as=\\\"tool\\\" class=\\\"-mx-4 sm:grid sm:grid-cols-2 lg:grid-cols-3\\\"> <li view=\\\"[[tool.modelName]]\\\" data=\\\"[[tool]]\\\" data-lang=\\\"[[ parent.lang ]]\\\" class=\\\"px-4 my-6 custom-divide-x-2\\\"> </li> </ul> </div> \";\n// Exports\nexport default code;","// Module\nvar code = \"<div class=\\\"tool-template\\\"> <a href=\\\"[[ '/' + lang + '/tools/' + slug ]]\\\" on-click=\\\"[[ this.router.toPath( '/' + lang + '/tools/' + slug )]]\\\" class=\\\"cursor-pointer group\\\"> <div class=\\\"w-full overflow-hidden h-60 relative\\\"> <div view=\\\"Show\\\" role=\\\"presentation\\\" alt=\\\"\\\" title=\\\"\\\" class=\\\"absolute top-4 left-0 z-10\\\" data-if=\\\"[[ badge ]]\\\"> <div class=\\\"h-10 flex items-center\\\"> <img src=\\\"/static/new-flag-left.svg\\\" class=\\\"h-full\\\" alt=\\\"\\\"/> <div class=\\\"flex bg-flag_coral h-full pr-2 items-center\\\"> <div class=\\\"text-[13px] italic font-bold\\\" aria-label=\\\"[[ this.trans('new-tool') ]]\\\">[[this.trans(badge)]]</div> </div> <img src=\\\"/static/new-flag-right.svg\\\" class=\\\"h-full\\\"/> </div> </div> <img class=\\\"object-cover w-full h-full group-hover:scale-110 transition duration-300 ease-in-out\\\" src=\\\"[[ this.setup.route('asset', { preset:'medium', ext:preview_image.ext, file_name:preview_image.file_name }).url() ]]\\\"/> </div> <div class=\\\"py-m md:px-m\\\"> <span class=\\\"text-[13px] italic text-active\\\">[[ this.trans('tool') ]]</span> <h3 class=\\\"mt-3 mb-2 text-[1.625rem] font-semibold group-hover:italic line-clamp-2\\\">[[ title ]]</h3> <span class=\\\"\\\">[[ lead ]]</span> </div> </a> </div> \";\n// Exports\nexport default code;","// Module\nvar code = \"<div> <a href=\\\"[[ '/' + lang + '/good-practice/' + slug ]]\\\" on-click=\\\"[[ this.router.toPath( '/' + lang + '/good-practice/' + slug )]]\\\" class=\\\"cursor-pointer group\\\"> <div class=\\\"w-full overflow-hidden h-60\\\"> <img class=\\\"object-cover w-full h-full group-hover:scale-110 transition duration-300 ease-in-out\\\" src=\\\"[[ this.setup.route('asset', { preset:'medium', ext:preview_image.ext, file_name:preview_image.file_name }).url() ]]\\\"/> </div> <div class=\\\"overflow-x-hidden py-m md:px-m text-ellipsis\\\"> <span class=\\\"text-[13px] italic text-active\\\">[[ this.trans('good-practice') ]]</span> <h3 class=\\\"mt-3 mb-2 text-[1.625rem] font-semibold group-hover:italic line-clamp-2\\\">[[ title ]]</h3> <div> <span view=\\\"Repeat\\\" data-items=\\\"[[ authors ]]\\\" data-as=\\\"author\\\"> <span class=\\\"mr-2 font-mono\\\">[[ author.author.name ]], </span> </span> <span class=\\\"font-mono\\\">[[ date]]</span> </div> </div> </a> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {languageService} from \"../../services/lang\";\nimport template from \"./search-row.html\";\n\nexport class SearchRow extends View {\n constructor() {\n super({ template, data: new SearchRowContorller() })\n }\n init() {\n this.data.router = this.context.router;\n this.data.currentLang = languageService.currentLang;\n }\n}\n\nclass SearchRowContorller {\n}\n","// Module\nvar code = \"<div class=\\\"flex flex-wrap items-center\\\"> <button on-click=\\\"[[ router.toRoute('search', {lang: currentLang})]]\\\" class=\\\"flex pr-5 md:pr-30 text-xl black text-black py-2.5 border-[3px] border-black relative overflow-ellipsis flex-1 md:flex-0\\\" aria-label=\\\"[[ this.trans('to-the-search') ]]\\\" alt=\\\"[[ this.trans('to-the-search') ]]\\\" title=\\\"[[ this.trans('to-the-search') ]]\\\"> <svg class=\\\"w-6 h-6 mx-5\\\" view=\\\"Icon\\\" data-name=\\\"icon-lupe\\\"></svg> <span class=\\\"hidden md:block whitespace-nowrap\\\">[[ this.trans('searchHomePlaceholder')]]</span> <span class=\\\"md:hidden whitespace-nowrap\\\">[[ this.trans('search')]]</span> </button> <div class=\\\"hidden md:block md:flex-1\\\"></div> <button on-click=\\\"[[ router.toRoute('wizard', {lang: currentLang})]]\\\" class=\\\"ml-8 flex text-white py-3.5 px-3.5 md:px-5 bg-black rounded-full text-xl font-medium aspect-square md:aspect-auto buttonsuchhilfedefault hover:italic group\\\" aria-label=\\\"[[ this.trans('to-the-wizard') ]]\\\" alt=\\\"[[ this.trans('to-the-wizard') ]]\\\" title=\\\"[[ this.trans('to-the-wizard') ]]\\\"> <svg class=\\\"md:mr-5 w-7 h-7 block group-hover:hidden\\\" view=\\\"Icon\\\" data-name=\\\"icon-zauberstab-side\\\"></svg> <svg class=\\\"md:mr-5 w-7 h-7 hidden group-hover:block\\\" view=\\\"Icon\\\" data-name=\\\"icon-zauberstab-side-hover\\\"></svg> <div class=\\\"hidden md:block\\\">[[ this.trans('wizardStart')]]</div> </button> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport template from \"./slider.component.html\";\n\nexport class SliderView extends View {\n sliderPosition = 0;\n controlToggleClass = 'md:flex';\n\n constructor() {\n super({template, data: new SliderController()})\n }\n init() {\n const controlLeft = this.node.querySelector( \"[view='ControlLeft']\");\n controlLeft.classList.add('hidden');\n }\n\n goLeft() {\n this.sliderPosition -= 200\n if (this.isSliderStart()) {\n this.sliderPosition = 0\n }\n this.applyTranslate()\n }\n\n goRight() {\n this.sliderPosition += 200;\n if (this.isSliderEnd()) {\n // Math.max ensures not a negative sliderposition\n this.sliderPosition = Math.max(this.maxPosition(), 0)\n }\n this.applyTranslate()\n }\n\n private isSliderStart() {\n return this.sliderPosition <= 0\n }\n\n private isSliderEnd() {\n return this.sliderPosition >= this.maxPosition()\n }\n\n private maxPosition() {\n const innerWidth = this.getInnerWidth()\n const containerPadding = parseFloat(window.getComputedStyle(this.node, null).getPropertyValue('padding-left'))\n + parseFloat(window.getComputedStyle(this.node, null).getPropertyValue('padding-right'))\n const containerWidth = this.node.clientWidth - containerPadding\n return innerWidth - containerWidth\n }\n\n private getInnerWidth() {\n return this.node.querySelector(\"[view='MainContent']\").clientWidth;\n }\n\n private applyTranslate() {\n const slidingElement = this.node.querySelector( \"[view='MainContent']\") as HTMLElement;\n slidingElement.style.transform = `translateX(-${this.sliderPosition}px)`\n this.showControls()\n }\n\n private showControls() {\n const controlRight = this.node.querySelector( \"[view='ControlRight']\") as HTMLElement\n if (this.isSliderEnd()) {\n controlRight.classList.remove(this.controlToggleClass)\n } else {\n controlRight.classList.add(this.controlToggleClass)\n }\n\n const controlLeft = this.node.querySelector( \"[view='ControlLeft']\") as HTMLElement\n if (this.isSliderStart()) {\n controlLeft.classList.remove(this.controlToggleClass)\n } else {\n controlLeft.classList.add(this.controlToggleClass)\n }\n }\n\n}\n\nclass SliderController {\n}\n","// Module\nvar code = \"<div class=\\\"relative overflow-x-auto md:overflow-x-hidden h-54 lg:h-52 -ml-8 -mr-8\\\"> <div class=\\\"absolute top-0 bottom-0 transition-transform pl-8 pr-8\\\" view=\\\"MainContent\\\"></div> <div on-click=\\\"[[this.view.goLeft()]]\\\" class=\\\"absolute top-0 bottom-0 left-8 hidden items-center select-none\\\" view=\\\"ControlLeft\\\"></div> <div on-click=\\\"[[this.view.goRight()]]\\\" class=\\\"absolute top-0 bottom-0 hidden md:flex items-center select-none right-8\\\" view=\\\"ControlRight\\\"></div> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {gateway} from \"../../services/gateway\";\nimport {languageService} from \"../../services/lang\";\nimport template from \"./footer.component.html\";\n\nexport class FooterView extends View {\n footer: {address: string;};\n constructor() {\n super({template, data: {lang: languageService.currentLang}});\n gateway.loadGeneralInfos().then(generalInfos => {\n this.data.footer = {\n 'address': generalInfos.footerAddress,\n };\n });\n }\n}\n","// Module\nvar code = \"<footer aria-label=\\\"[[ this.trans('footer-area') ]]\\\" class=\\\"py-8 mt-24 border-t-2 md:mt-32 border-grey_2\\\"> <div class=\\\"w-full px-8 mx-auto md:flex max-w-screen-xl\\\"> <div class=\\\"flex flex-col items-baseline max-w-lg mr-4 md:mr-32\\\"> <div class=\\\"flex-1 mb-8 font-semibold tt-h3\\\"> <p>[[ this.trans('footer-question')]]</p> <p>[[ this.trans('footer-promise')]]</p> </div> <img class=\\\"hidden h-12 mt-8 md:block\\\" src=\\\"/static/logo.svg\\\" alt=\\\"Logo Universität Zürich\\\"> </div> <div class=\\\"flex flex-col items-baseline leading-relaxed\\\"> <div view=\\\"Html\\\" data-html=\\\"[[footer.address]]\\\" data-styles=\\\"[[ null ]]\\\">[[ footer.address]]</div> <a aria-label=\\\"[[ this.trans('phone-link') ]]: +41 44 634 21 15\\\" alt=\\\"[[ this.trans('phone-link') ]]: +41 44 634 21 15\\\" title=\\\"[[ this.trans('phone-link') ]]: +41 44 634 21 15\\\" href=\\\"tel:+41446342115\\\" class=\\\"flex items-center mt-8\\\"><svg class=\\\"w-5 h-5 mr-4\\\" view=\\\"Icon\\\" data-name=\\\"icon-phone\\\"></svg>+41 44 634 21 15</a> <a aria-label=\\\"[[ this.trans('email-link') ]]: teachingtools@education.uzh.ch\\\" alt=\\\"[[ this.trans('email-link') ]]: teachingtools@education.uzh.ch\\\" title=\\\"[[ this.trans('email-link') ]]: teachingtools@education.uzh.ch\\\" href=\\\"mailto:teachingtools@education.uzh.ch\\\" class=\\\"flex items-center mt-2\\\"><svg class=\\\"w-5 h-5 mr-4\\\" view=\\\"Icon\\\" data-name=\\\"icon-mail\\\"></svg>teachingtools@education.uzh.ch</a> <a href=\\\"[[`/${lang}/p/impressum`]]\\\" class=\\\"mt-6 hover:nav-active\\\">Impressum</a> <a href=\\\"[[`/${lang}/p/datenschutz`]]\\\" class=\\\"mt-6 hover:nav-active\\\">Datenschutz</a> </div> <img class=\\\"h-12 mt-8 md:hidden\\\" src=\\\"/static/logo.svg\\\" alt=\\\"Logo Universität Zürich\\\"> </div> </footer> \";\n// Exports\nexport default code;","import { Model } from '@lernetz/ts-lib';\nimport { Signal } from '@lernetz/ts-lib/src/Signal';\nimport { Repeat } from '@lernetz/ts-lib/src/components/Repeat';\nimport { View, ViewConfig } from '@lernetz/ts-lib/src/view/View';\n\nexport class DropDownView<TItem = any> extends View<DropDown<TItem>> {\n\n private closeHandler:(event) => void;\n\n constructor( config?:ViewConfig<DropDown> ) {\n super( { data:new DropDown(), ...config } );\n\n // handler to close dropdown from everywhere\n this.closeHandler = ( event ) => {\n this.data.open = false;\n }\n\n this.registry.add( 'Repeat', () => new Repeat() );\n }\n\n init() {\n // swallow click event\n this.node.addEventListener( 'click', ( event ) => {\n event.stopImmediatePropagation();\n });\n\n // listen on list open\n this.data.propertyChange.filter( ( change ) => change.name == 'open' && this.data.open ).subscribe( this.onOpen.bind( this ) );\n\n // listen on list close\n this.data.propertyChange.filter( ( change ) => change.name == 'open' && !this.data.open ).subscribe( this.onClose.bind( this ) );\n }\n\n onOpen() {\n document.addEventListener( 'click', this.closeHandler );\n }\n\n onClose() {\n document.removeEventListener( 'click', this.closeHandler );\n }\n}\n\n/**\n * Specialized `View` class that auto-closes the `DropDown` when it loses focus.\n *\n * This requires a template where the drop-down can receive the input focus.\n * Typically, you'll want to make the toggle `.button` focusable, as well as every\n * `.list .item` – e.g. by means of `tabindex=\"0\"`.\n */\nexport class FocusableDropDownView<TItem = any> extends View<DropDown<TItem>> {\n\n constructor( config?:ViewConfig<DropDown> ) {\n super( { data: config?.data ?? new DropDown<unknown>(), ...config } );\n\n this.registry.add( 'Repeat', () => new Repeat() );\n }\n\n init() {\n this.node.addEventListener( 'focusout', () => this.data.open &&= this.node.matches( ':focus-within' ) );\n }\n}\n\n/**\n * Specialized `FocusableDropDownView` class that adds keyboard support.\n */\nexport class AccessibleDropDownView<TItem = any> extends FocusableDropDownView<DropDown<TItem>> {\n\n init() {\n super.init();\n\n this.node.addEventListener( 'keydown', ( e: KeyboardEvent ) => {\n if( !this.data.disabled && this.onKey( e, e.altKey || e.ctrlKey || e.metaKey || e.shiftKey ) ) {\n e.stopPropagation();\n e.preventDefault();\n }\n } );\n }\n\n protected onKey( e: KeyboardEvent, hasAnyModifierKey: boolean ): boolean {\n switch( e.key ) {\n case 'ArrowDown': return this.onArrowDownKey( e, hasAnyModifierKey );\n case 'ArrowUp': return this.onArrowUpKey ( e, hasAnyModifierKey );\n case ' ': return this.onSpaceKey ( e, hasAnyModifierKey );\n case 'Enter': return this.onEnterKey ( e, hasAnyModifierKey );\n }\n }\n\n protected onArrowDownKey( e: KeyboardEvent, hasAnyModifierKey: boolean ): boolean {\n if( hasAnyModifierKey ) return;\n\n const index = 1 + ( this.data.items?.indexOf( this.data.selection ) ?? -1 );\n if( index < this.data.items?.length ?? 0 ) {\n this.data.selection = this.data.items[ index ];\n }\n return true;\n }\n\n protected onArrowUpKey( e: KeyboardEvent, hasAnyModifierKey: boolean ): boolean {\n if( hasAnyModifierKey ) return;\n\n const index = -1 + ( this.data.items?.indexOf( this.data.selection ) ?? -1 );\n if( index >= 0 ) {\n this.data.selection = this.data.items[ index ];\n }\n return true;\n }\n\n protected onEnterKey( e: KeyboardEvent, hasAnyModifierKey: boolean ): boolean {\n return this.onEnterOrSpaceKey( e, hasAnyModifierKey );\n }\n\n protected onSpaceKey( e: KeyboardEvent, hasAnyModifierKey: boolean ): boolean {\n return this.onEnterOrSpaceKey( e, hasAnyModifierKey );\n }\n\n private onEnterOrSpaceKey( e: KeyboardEvent, hasAnyModifierKey: boolean ): boolean {\n if( hasAnyModifierKey ) return;\n\n const listFocused = this.node.querySelector( '.list' )?.matches( ':focus-within' );\n if( listFocused ) {\n const focusedElement = e.target;\n if( focusedElement instanceof HTMLElement ) {\n focusedElement.click();\n const button = this.node.querySelector( '.button' );\n if( button instanceof HTMLElement ) {\n button.focus();\n }\n this.data.open = false;\n return true;\n }\n }\n else {\n this.data.open = !this.data.open;\n return true;\n }\n }\n}\n\nexport interface DropDownConfig<TItem = any> {\n disabled?: boolean;\n items?: TItem[];\n open?: boolean;\n selection?: TItem;\n}\n\nexport class DropDown<TItem = any> extends Model {\n\n public disabled: boolean;\n public items: TItem[];\n public open: boolean;\n public selection?: TItem;\n\n constructor( config?: DropDownConfig<TItem> ) {\n super( { disabled: false, open: false, items: [], selection: null, ...config } );\n }\n\n select( item: TItem ) {\n if( this.disabled ) return;\n this.selection = item;\n this.open = false;\n }\n\n getIndex( item ) {\n return this.items.indexOf( item );\n }\n}\n","import {View} from \"@lernetz/ts-lib\";\nimport template from \"./banner-image.component.html\";\n\nexport class BannerImage extends View {\n constructor() {\n super({template})\n }\n\n}\n\n","// Module\nvar code = \"<div> <img view=\\\"Image\\\" data-route=\\\"asset\\\" data-preset=\\\"original\\\" data-file_name=\\\"[[image.file_name]]\\\" data-ext=\\\"[[ image.ext ]]\\\"/> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\"\nimport template from \"./metainfos.component.html\";\nimport downloadTemplate from \"./downloads/download.component.html\";\nimport linkTemplate from \"./downloads/link.component.html\";\n\nexport class MetaInfos extends View {\n constructor() {\n super({ template });\n this.registry.add('App\\\\Download', () => new View({ template: downloadTemplate}));\n this.registry.add('App\\\\Link', () => new View({ template: linkTemplate}));\n }\n}\n","// Module\nvar code = \"<div class=\\\"text-sm\\\"> <dl view=\\\"Repeat\\\" data-items=\\\"[[ infos.metainfos ]]\\\" data-as=\\\"info\\\" aria-label=\\\"[[ this.trans('meta-infos') ]]\\\" role=\\\"list\\\"> <div role=\\\"group\\\" class=\\\"flex py-4 border-b\\\"> <dt role=\\\"term\\\" class=\\\"flex w-1/2 space-x-1\\\"> <svg class=\\\"w-5 h-5 mr-4 shrink-0\\\" view=\\\"Icon\\\" alt=\\\"\\\" role=\\\"presentation\\\" data-name=\\\"info-[[ info.icon ? info.icon : 'datenschutz' ]]\\\"></svg> <div class=\\\"font-semibold\\\">[[ info.key ]]</div> </dt> <dd role=\\\"definition\\\" class=\\\"w-1/2 ml-2\\\">[[ info.value ]]</dd> </div> </dl> <div view=\\\"Show\\\" data-if=\\\"[[ infos.hint.title || infos.hint.text]]\\\"> <div class=\\\"py-5 border-b\\\"> <div class=\\\"font-semibold\\\">[[ infos.hint.title ]]</div> <div>[[ infos.hint.text ]]</div> </div> </div> <div view=\\\"Show\\\" data-if=\\\"[[ infos.downloads.length]]\\\"> <div class=\\\"py-5 border-b\\\"> <div class=\\\"mb-2 font-semibold\\\">[[ this.trans('materials') ]]</div> <div class=\\\"flex flex-col space-y-2\\\" view=\\\"Repeat\\\" data-items=\\\"[[ infos.downloads]]\\\" data-as=\\\"download\\\"> <div view=\\\"[[download.modelName]]\\\" data=\\\"[[download]]\\\"></div> </div> </div> </div> </div> \";\n// Exports\nexport default code;","// Module\nvar code = \"<div> <a class=\\\"flex items-center hover:italic\\\" href=\\\"[[ this.setup.route( 'download', { file_name:file.file_name } ).url() ]]\\\" target=\\\"[[ target ]]\\\"> <svg class=\\\"w-5 h-5 mr-4 shrink-0\\\" view=\\\"Icon\\\" data-name=\\\"icon-download\\\"></svg> <span class=\\\"\\\">[[ text ]]</span> </a> </div> \";\n// Exports\nexport default code;","// Module\nvar code = \"<div> <a class=\\\"flex items-center hover:italic\\\" href=\\\"[[ url ]]\\\" target=\\\"[[ target ]]\\\"> <svg view=\\\"Icon\\\" data-name=\\\"icon-link-blank\\\" class=\\\"w-5 h-5 mr-5 shrink-0\\\"></svg> <span class=\\\"\\\">[[ text ]]</span> </a> </div> \";\n// Exports\nexport default code;","import {Model, Signal} from \"@lernetz/ts-lib\";\n\nexport class DropDownController extends Model {\n filterChange: Signal<unknown>;\n filterOpen: Signal<unknown>;\n constructor() {\n super();\n this.filterChange = new Signal();\n this.filterOpen = new Signal();\n }\n clickTag(tag) {\n tag.active = !tag.active;\n this.filterChange.dispatch(tag);\n }\n}\n","import {View} from \"@lernetz/ts-lib\";\nimport GoodPracticeModule from \"../../../good-practice/good-practice.module\";\nimport template from \"./good-practice-details.component.html\";\n\nexport class GoodPracticeDetails extends View {\n constructor() {\n super({ template, registry: GoodPracticeModule.views });\n }\n}\n","// Module\nvar code = \"<div aria-label=\\\"[[ this.trans('content-area-good-practice-detail-page') ]]\\\" class=\\\"w-full\\\"> <article id=\\\"maincontent\\\" class=\\\"px-8 mx-auto my-32 max-w-screen-md\\\"> <h1 class=\\\"font-semibold tt-h1\\\">[[goodPractice.title]]</h1> <div class=\\\"my-8 tt-big\\\">[[goodPractice.lead]]</div> <div class=\\\"flex flex-wrap my-8 mb-16 font-mono\\\"> <span view=\\\"Repeat\\\" data-items=\\\"[[ goodPractice.headerAuthors ]]\\\" data-as=\\\"author\\\" class=\\\"flex\\\"> <span class=\\\"mr-4\\\">[[author.author.name]], </span> </span> <span>[[goodPractice.date]]</span> </div> <div view=\\\"Repeat\\\" data-items=\\\"[[ goodPractice.content_elements]]\\\" data-as=\\\"element\\\" class=\\\"\\\"> <div view=\\\"[[ element ]]\\\" data=\\\"[[ element ]]\\\"></div> </div> <div view=\\\"Repeat\\\" data-items=\\\"[[ goodPractice.authors ]]\\\" data-as=\\\"author\\\"> <div class=\\\"pt-8 mt-8 border-t-2 border-grey_2\\\" view=\\\"AuthorCard\\\" data=\\\"[[ author.author ]]\\\"></div> </div> </article> <div view=\\\"Footer\\\"></div> </div> \";\n// Exports\nexport default code;","import checked from '@lernetz/ui-components/src/toggle/defaults/checkboxChecked.html';\nimport unchecked from '@lernetz/ui-components/src/toggle/defaults/checkboxUnchecked.html';\nimport template from './checkboxComponent.html';\nimport {Signal, View} from \"@lernetz/ts-lib\";\nimport {observeProperties} from \"@lernetz/ts-lib/src/Observer\";\n\nexport class CheckboxToggle extends View {\n // checkedTemplate: string;\n // uncheckedTemplate: string;\n public constructor() {\n super({ data: { condition: false}});\n // this.checkedTemplate = template;\n // this.uncheckedTemplate = template;\n }\n\n init() {\n // this.update();\n this.node.innerHTML = template;\n // observeProperties(this.data);\n // this.data.propertyChange.subscribe( event => {\n // debugger;\n // this.update();\n // })\n }\n\n // update(): void {\n // this.node.innerHTML = this.data.condition ? checked : unchecked;\n // }\n}\n","// Module\nvar code = \"<svg view=\\\"Icon\\\" data-name=\\\"[[ tag.active ? 'icon-checkbox-checked' : 'icon-checkbox-default' ]]\\\"></svg> \";\n// Exports\nexport default code;","import {Signal, View} from \"@lernetz/ts-lib\";\nimport template from \"./overlay.component.html\"\n\nexport class Overlay extends View {\n constructor() {\n super({ template, data: new OverlayController()});\n }\n init() {\n this.node.addEventListener( 'click', ( event ) => {\n event.stopImmediatePropagation();\n this.data.signal.dispatch(event);\n });\n }\n}\n\nexport class OverlayController {\n signal: Signal<unknown>;\n constructor() {\n this.signal = new Signal();\n }\n}\n","// Module\nvar code = \"<div class=\\\"absolute top-0 bottom-0 left-0 right-0 z-50 bg-black/80\\\" on-click=\\\"[[closeMenu]]\\\"> <div view=\\\"Content\\\" class=\\\"absolute top-0 bottom-0 left-0 right-0 overflow-y-auto border-t\\\"> </div> <div role=\\\"button\\\" tabindex=\\\"99\\\" class=\\\"absolute top-8 right-8\\\" alt=\\\"[[ this.trans('close-dialog') ]]\\\" title=\\\"[[ this.trans('close-dialog') ]]\\\"> <div class=\\\"flex items-center justify-center w-12 h-12 rounded-full bg-black/80 hover:bg-black cursor-pointer\\\"> <svg view=\\\"Icon\\\" data-name=\\\"icon-hamburger-close\\\" class=\\\"w-8 h-8 text-white cursor-pointer svg-icon\\\"></svg> </div> </div> </div> \";\n// Exports\nexport default code;","// Module\nvar code = \"<svg width=\\\"359px\\\" height=\\\"344px\\\" viewBox=\\\"0 0 359 344\\\" version=\\\"1.1\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\" xmlns:xlink=\\\"http://www.w3.org/1999/xlink\\\"> <g id=\\\"Screendesign-@Umsetzung\\\" stroke=\\\"none\\\" stroke-width=\\\"1\\\" fill=\\\"none\\\" fill-rule=\\\"evenodd\\\"> <g id=\\\"l_Wizard_Start\\\" transform=\\\"translate(-731.000000, -254.000000)\\\"> <g id=\\\"Group-3\\\" transform=\\\"translate(731.000000, 254.268685)\\\"> <path d=\\\"M151.290994,226.731315 L129,204.440321 L245.709006,87.7313151 L268,110.022309 L151.290994,226.731315 Z M223.418172,139.743262 L215.987894,132.312983 L143.861456,204.439528 L151.291787,211.869859 L223.418172,139.743262 Z\\\" class=\\\"wiggle1\\\" fill=\\\"#232323\\\"></path> <circle class=\\\"blink\\\" fill=\\\"#E7DBF9\\\" cx=\\\"207.184211\\\" cy=\\\"336.231315\\\" r=\\\"7.5\\\"></circle> <circle class=\\\"blink\\\" fill=\\\"#8EC9BB\\\" cx=\\\"7.5\\\" cy=\\\"136.126052\\\" r=\\\"7.5\\\"></circle> <polygon class=\\\"blink-2\\\" fill=\\\"#FB8E7E\\\" transform=\\\"translate(335.338764, 220.450456) rotate(-29.000000) translate(-335.338764, -220.450456) \\\" points=\\\"335.484946 231.119952 324.824212 236.577997 326.752631 224.813003 317.998987 216.380699 329.963223 214.779994 335.213909 204.110498 340.679795 214.886202 352.67854 216.724395 344.092407 224.984851 346.257354 236.790413\\\"></polygon> <polygon class=\\\"blink-2\\\" fill=\\\"#FB8E7E\\\" transform=\\\"translate(92.737486, 36.458302) rotate(-29.000000) translate(-92.737486, -36.458302) \\\" points=\\\"92.9722921 53.5962071 75.8484603 62.3632066 78.9459878 43.4656549 64.8854256 29.9212447 84.1030107 27.3501086 92.5369372 10.2122032 101.316531 27.5207054 120.589546 30.4733075 106.798048 43.7416863 110.2755 62.7044002\\\"></polygon> <polygon class=\\\"blink-3\\\" fill=\\\"#ADCBE1\\\" transform=\\\"translate(80.645974, 290.687530) rotate(64.000000) translate(-80.645974, -290.687530) \\\" points=\\\"80.4160527 308.99986 62.4314612 318.713025 66.0354505 298.462122 51.6883934 284.278091 71.7247283 281.141413 80.842351 262.662035 89.6214976 280.974365 109.603555 283.737513 94.9930315 298.191833 98.2249998 318.378929\\\"></polygon> <circle class=\\\"blink\\\" fill=\\\"#E7DBF9\\\" cx=\\\"292.5\\\" cy=\\\"70.2313151\\\" r=\\\"7.5\\\"></circle> <circle class=\\\"blink-3\\\" fill=\\\"#E2C0A8\\\" cx=\\\"134.5\\\" cy=\\\"126.231315\\\" r=\\\"7.5\\\"></circle> </g> </g> </g> </svg> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport template from \"./MagicWand.component.html\";\n\nexport const MagicWand = new View({template})\n\n","import {View, ViewRegistry} from \"@lernetz/ts-lib\";\nimport {languageService} from \"../../services/lang\";\nimport {MagicWand} from \"./MagicWand.component\";\nimport template from \"./WizardStart.html\";\n\nconst registry = new ViewRegistry();\nregistry.add('MagicWand', () => MagicWand);\n\nexport class WizardStart extends View {\n constructor() {\n super({\n template, registry\n });\n }\n init() {\n this.data.currentLang = languageService.currentLang;\n }\n}\n\n\n","// Module\nvar code = \"<article id=\\\"maincontent\\\"> <div class=\\\"flex w-full min-h-full bg-yellow max-h-fit\\\"> <div class=\\\"px-8 mx-auto md:grid md:grid-cols-2 max-w-screen-xl mt-36 h-fit\\\"> <div class=\\\"\\\"> <h1 class=\\\"mb-3 md:mb-8 tt-h1\\\">[[ this.trans('wizardStartText') ]]</h1> <button class=\\\"my-6 md:my-8 px-6 py-3.5 text-white text-xl font-medium bg-black rounded-full\\\" on-click=\\\"[[ this.router.toPath(`/${currentLang}/wizard/${id}`)]]\\\" aria-label=\\\"[[ this.trans('start-wizard') ]]\\\" alt=\\\"[[ this.trans('start-wizard') ]]\\\" title=\\\"[[ this.trans('start-wizard') ]]\\\">[[ this.trans('start') ]]</button> </div> <div> <svg view=\\\"MagicWand\\\" class=\\\"w-full\\\" role=\\\"presentation\\\" alt=\\\"\\\" title=\\\"\\\"></svg> </div> </div> </div> </article> \";\n// Exports\nexport default code;","import {Signal, View} from '@lernetz/ts-lib';\nimport template from './active-tags.component.html';\n\nexport class ActiveTags extends View {\n choose: Signal<unknown>;\n constructor() {\n super({template});\n this.choose = new Signal();\n }\n}\n","// Module\nvar code = \"<div> <div view=\\\"Repeat\\\" data-items=\\\"[[activeFilters]]\\\" data-as=\\\"filter\\\" class=\\\"flex flex-wrap space-x-4\\\"> <button class=\\\"mb-6 py-1.5 px-3.5 rounded-full flex justify-between [[ action ? 'text-white bg-black ' : 'text-black white border-2 border-black font-medium' ]]\\\" on-click=\\\"[[parent.choose.dispatch(filter)]]\\\"> <div class=\\\"whitespace-nowrap\\\">[[filter.name]]</div> <svg class=\\\"w-6 h-6 [[ !action ? 'hidden' : '']]\\\" view=\\\"Icon\\\" data-name=\\\"icon-hamburger-close\\\"></svg> </button> </div> </div> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport {Router} from \"@lernetz/ui-components/src/router/Router\";\nimport {languageService} from \"../../../services/lang\";\nimport template from \"./route-link.component.html\";\n\n\nexport class RouteLink extends View {\n constructor(router: Router) {\n super({ template, data: new RouteLinkController(router)})\n }\n}\n\nclass RouteLinkController {\n path: any;\n routeName: string;\n routeParams: any;\n isActive: boolean;\n currentLang: any;\n constructor(private router) {\n this.currentLang = languageService.currentLang\n }\n\n goTo(event) {\n if (this.path) {\n event.preventDefault();\n this.router.toPath(this.path);\n }\n if (this.routeName) {\n event.preventDefault();\n this.router.toRoute(this.routeName, {lang: this.currentLang, ...this.routeParams });\n }\n }\n\n init() {\n if (this.path) {\n this.isActive = window.location.pathname === this.path;\n }\n if (this.routeName) {\n if (this.router.current.route) {\n this.isActive = this.router.current.route.name === this.routeName;\n } else {\n let found = this.router.routes.find( r => r.name == this.routeName );\n this.isActive = found.pathOf( this.routeParams ) === window.location.pathname;\n\n\n }\n }\n }\n}\n","// Module\nvar code = \"<a href=\\\"[[ url ]]\\\" target=\\\"[[target]]\\\" class=\\\"cursor-pointer\\\" on-click=\\\"[[goTo(event)]]\\\"> <div view=\\\"Content\\\"></div> </a> \";\n// Exports\nexport default code;","import {View} from \"@lernetz/ts-lib\";\nimport template from \"./modal.component.html\";\n\nexport class ModalView extends View {\n constructor() {\n super({template, data: new ModalViewController()})\n }\n\n}\nclass ModalViewController {\n info: any;\n hidden: boolean;\n init() {\n this.hidden = !!window.localStorage.getItem(\"bannerHidden\");\n }\n hide() {\n this.hidden = true;\n window.localStorage.setItem(\"bannerHidden\", \"true\");\n }\n show() {\n this.hidden = false;\n window.localStorage.removeItem(\"bannerHidden\");\n }\n}\n","// Module\nvar code = \"<div> <div view=\\\"Show\\\" data-if=\\\"[[ info.enable && !hidden ]]\\\"> <div class=\\\"fixed bottom-0 left-0 sm:w-1/2 lg:w-1/3\\\" role=\\\"presentation\\\" tabindex=\\\"-1\\\" aria-hidden=\\\"true\\\"> <div class=\\\"relative flex flex-col items-start p-6 bg-yellow\\\"> <div class=\\\"absolute top-4 right-4\\\"><button type=\\\"button\\\" on-click=\\\"[[hide()]]\\\" role=\\\"presentation\\\" tabindex=\\\"-1\\\" aria-hidden=\\\"true\\\"> <svg class=\\\"w-5 h-5\\\" view=\\\"Icon\\\" data-name=\\\"icon-menu-close\\\"></svg></button></div> <div class=\\\"mb-4 italic font-bold tt-h2\\\">[[info.title]]</div> <div>[[info.description]]</div> <a class=\\\"border-black border-[3px] rounded-3xl mt-6 py-3 pl-6 pr-3 font-medium leading-normal text-[18px] md:text-[20px]\\\" href=\\\"[[info.buttonLink]]\\\" role=\\\"presentation\\\" tabindex=\\\"-1\\\" aria-hidden=\\\"true\\\">[[info.buttonLinkText]]</a> </div> </div> </div> <div view=\\\"Show\\\" data-if=\\\"[[ info.enable && hidden ]]\\\"> <div class=\\\"fixed left-0 bottom-4\\\"> <div class=\\\"flex items-center h-8 rounded-r-lg bg-yellow\\\"> <button type=\\\"button\\\" on-click=\\\"[[show()]]\\\" role=\\\"presentation\\\" tabindex=\\\"-1\\\" aria-hidden=\\\"true\\\" aria-label=\\\"[[ this.trans('to-the-survey') ]]\\\" alt=\\\"[[ this.trans('to-the-survey') ]]\\\" title=\\\"[[ this.trans('to-the-survey') ]]\\\"><svg class=\\\"w-5 h-5\\\" view=\\\"Icon\\\" data-name=\\\"icon-arrow-right\\\"></svg></button> </div> </div> </div> </div> \";\n// Exports\nexport default code;","import { Model, View } from \"@lernetz/ts-lib\";\n\nexport class SvelteView extends View<Model> {\n root: any;\n instance: any;\n\n constructor(root: any) {\n super({ template: \"\" });\n\n this.root = root;\n }\n\n init() {\n this.data = new Model(this.data);\n\n let context = new Map();\n context.set(\"ts-lib-context\", this.template.context);\n\n this.instance = new this.root({\n target: this.node,\n props: this.data,\n context,\n });\n\n this.data.propertyChange.subscribe((e) => {\n let d = {};\n d[e.name] = this.data[e.name];\n this.instance.$$set(d);\n });\n }\n}\n","import { ViewRegistry, ModelRegistry, Repeat, Show } from '@lernetz/ts-lib';\nimport {RouterView} from '@lernetz/ui-components/src/router/Router';\nimport {StackView} from '@lernetz/ui-components/src/stack/Stack';\nimport {Heading, HeadingView} from '@lernetz/ui-components/src/heading/Heading';\nimport {Html, HtmlView } from '@lernetz/ui-components/src/html/Html';\nimport {SvgIconView} from \"@lernetz/ui-components/src/svg-icons/SvgIcon\";\n\nimport { AppView } from './components/app/App';\nimport {Paragraph, ParagraphView} from './components/article-elements/paragraph/Paragraph';\nimport {Title, TitleView} from './components/article-elements/title/Title';\nimport {NavigationView} from './components/navigation/Navigation';\nimport {Topics} from './components/topics/Topics';\nimport {WizardView} from './components/wizard/Wizard';\nimport {GoodPracticeView} from './pages/good-practice/good-practice.view';\nimport {HomeView} from './pages/Home';\nimport {ToolDetailsView} from './pages/tools/details/tool-details.view';\nimport {ToolsPageView} from './pages/tools/tools.view';\nimport {router} from './services/router';\nimport {ToolListView} from './tool/components/list/list.view';\nimport StackTemplate from './pages/Stack.html';\nimport {SearchPage} from './pages/search/search';\nimport {SearchRow} from './components/search-row/search-row.component';\nimport {SliderView} from './components/common/slider/slider.component';\nimport {FooterView} from './components/footer/footer.component';\nimport {FilterView} from './components/filter/filter.component';\nimport { DropDownView } from '@lernetz/ui-components/src/drop-down/DropDown';\nimport dropDownTemplate from './components/common/dropdown/DropDown.component.html';\nimport symbols from './icons/symbols.html';\nimport {Image, ImageView} from './components/article-elements/image/Image';\nimport { DecoratedIframely, DecoratedIframelyView } from './components/article-elements/decoratedIframely/DecoratedIframely';\nimport { ImageView as BaseImageView } from '@lernetz/ui-components/src/image/Image';\nimport {BannerImage} from './components/common/banner-image/banner-image.component';\nimport {MetaInfos} from './pages/tools/details/metainfos.component';\nimport {DropDownController} from './components/common/dropdown/dropdown.component';\nimport {GoodPracticeDetails} from './pages/good-practice/details/good-practice-details.component';\nimport {Toggle, ToggleView} from './components/article-elements/toggle/Toggle';\nimport {PersonalImpact, PersonalImpactView} from './components/article-elements/personal-impact/PersonalImpact';\nimport {Carousel, CarouselView} from './components/article-elements/carousel/Carousel';\nimport {GenericPage} from './pages/generic/generic.component';\nimport {MaterialList, MaterialListView} from './components/article-elements/materiallist/MaterialList';\nimport {CheckboxToggle} from './components/common/checkbox/checkbox.component';\nimport {MissingPageView} from './pages/Missing';\nimport {Overlay} from './components/common/overlay/overlay.component';\nimport {WizardStart} from './components/wizard/WizardStart';\nimport {ResultPage} from './pages/results/results.component';\nimport {ActiveTags} from './components/tags/active-tags.component';\nimport {RelatedContent, RelatedContentView} from './components/article-elements/related-content/related-content.component';\nimport {RouteLink} from './components/common/route-link/route-link.component';\nimport {ModalView} from './components/modal/modal.component';\nimport { Podcast, PodcastView } from './components/article-elements/podcast/Podcast';\nimport { SvelteView } from \"@lernetz/svelte-compatibility\";\nimport Filter from \"./components/filter/Filter.svelte\";\nimport { RawHtml, RawHtmlView } from \"./components/article-elements/rawhtml/RawHtml\";\n\n\nexport const viewRegistry = new ViewRegistry();\nviewRegistry.add( 'App', () => new AppView() );\nviewRegistry.add( 'Router', () => new RouterView( { data: router } ) );\nviewRegistry.add( 'RouteLink', () => new RouteLink(router) );\nviewRegistry.add( 'Stack', () => new StackView({ template: StackTemplate }) );\n\n// Pages\nviewRegistry.add( 'Missing', () => new MissingPageView() );\nviewRegistry.add( 'Home', () => new HomeView() );\n\nviewRegistry.add( 'Wizard', () => new WizardView() );\nviewRegistry.add( 'WizardStart', () => new WizardStart() );\n\nviewRegistry.add( 'GoodPracticePage', () => new GoodPracticeView() );\nviewRegistry.add( 'GoodPracticeDetailsPage', () => new GoodPracticeDetails() );\nviewRegistry.add( 'ToolsPage', () => new ToolsPageView() );\nviewRegistry.add( 'ToolDetailsPage', () => new ToolDetailsView() );\nviewRegistry.add( 'SearchPage', () => new SearchPage() );\nviewRegistry.add( 'GenericPage', () => new GenericPage() );\nviewRegistry.add( 'ResultPage', () => new ResultPage() );\n\nviewRegistry.add( 'Navigation', () => new NavigationView() );\nviewRegistry.add( 'Footer', () => new FooterView() );\nviewRegistry.add( 'Topics', () => new Topics() );\nviewRegistry.add( 'SearchRow', () => new SearchRow() );\nviewRegistry.add( 'CardList', () => new ToolListView() );\nviewRegistry.add('Filter', () => new SvelteView(Filter));\n//viewRegistry.add('Filter', () => new FilterView());\nviewRegistry.add('ActiveTags', () => new ActiveTags());\n\nviewRegistry.add( 'Show', () => new Show() );\nviewRegistry.add( 'Repeat', () => new Repeat() );\nviewRegistry.add( 'DropDown', () => new DropDownView({ template: dropDownTemplate, data: new DropDownController() as any}) );\nviewRegistry.add('Icon', () => new SvgIconView({ symbols }) );\nviewRegistry.add('Checkbox', () => new CheckboxToggle());\nviewRegistry.add('Overlay', () => new Overlay());\n\nviewRegistry.add('MetaInfos', () => new MetaInfos());\n\nviewRegistry.add( 'Slider', () => new SliderView());\n\n// article\nviewRegistry.add( Title, () => new TitleView() );\nviewRegistry.add( 'Heading', () => new HeadingView( { data: new Heading({\n styles: {\n 'h1': 'tt-h1 mt-24 md:mt-32 mb-12 md:mb-16',\n 'h2': 'tt-h2 mt-12 md:mt-16 mb-6 md:mb-8',\n 'h3': 'tt-h3 mt-6 md:mt-8 mb-4',\n 'h4': 'tt-h4 mt-4 mb-4',\n 'h5': '',\n 'h6': '',\n }\n}) } ) );\nviewRegistry.add( 'Html', () => {\n const html = new Html({\n styles: {\n 'p': 'text-style -para',\n 'b': 'text-style -b',\n 'i': 'text-style -i',\n 'a': 'text-style -a',\n 'ul': 'text-style -list',\n 'ol': 'text-style -list',\n }\n })\n return new HtmlView({ data: html});\n});\n\nviewRegistry.add(\"BannerImage\", () => new BannerImage());\nviewRegistry.add(\"Image\", () => new BaseImageView());\n// viewRegistry.add( Image, () => new View({template: '<img view=\"Image\" data=[[this.data]]></img>'}) );\nviewRegistry.add( Image, () => new ImageView() );\nviewRegistry.add( Carousel, () => new CarouselView() );\nviewRegistry.add( MaterialList, () => new MaterialListView() );\nviewRegistry.add( DecoratedIframely, () => new DecoratedIframelyView() );\nviewRegistry.add( Paragraph, () => new ParagraphView() );\nviewRegistry.add( RelatedContent, () => new RelatedContentView());\nviewRegistry.add( Toggle, () => new ToggleView());\nviewRegistry.add( PersonalImpact, () => new PersonalImpactView());\nviewRegistry.add( \"Modal\", () => new ModalView());\nviewRegistry.add( Podcast, () => new PodcastView());\nviewRegistry.add( RawHtml, () => new RawHtmlView() );\n\n\n\nexport var modelRegistry = new ModelRegistry();\n","// Module\nvar code = \"<div class=\\\"h-full\\\"> <div view=\\\"[[ top.view ]]\\\" data=\\\"[[ top.data ]]\\\"></div> </div> \";\n// Exports\nexport default code;","// Module\nvar code = \"<div class=\\\"relative\\\"> <button class=\\\"flex items-center w-full px-6 py-3 md:mb-4 text-left border-2 border-black text-l\\\" on-click=\\\"[[ filterOpen.dispatch(category)]]\\\"> <div class=\\\"flex-1 overflow-x-hidden overflow-ellipsis whitespace-nowrap font-medium\\\">[[ category.name ]]</div> <svg class=\\\"w-6 h-6 text-black shrink-0\\\" view=\\\"Icon\\\" data-name=\\\"[[ open ? 'icon-arrow-up' : 'icon-arrow-down']]\\\"></svg> </button> <div class=\\\"md:absolute z-10 px-6 py-4 border-black border-x-2 sm:border-t-2 border-b-2 bg-white md:top-[120%] [[ open ? '' : 'hidden']]\\\"> <div class=\\\"flex flex-col space-y-4\\\" view=\\\"Repeat\\\" data-items=\\\"[[ category.tags ]]\\\" data-as=\\\"tag\\\"> <div class=\\\"flex cursor-pointer group\\\" on-click=\\\"[[ parent.clickTag(tag)]]\\\"> <svg class=\\\"w-5 h-5 shrink-0 block group-hover:hidden\\\" view=\\\"Icon\\\" data-name=\\\"[[ tag.active ? 'icon-checkbox-checked' : 'icon-checkbox-default' ]]\\\"></svg> <svg class=\\\"w-5 h-5 ml-0 shrink-0 hidden group-hover:block\\\" view=\\\"Icon\\\" data-name=\\\"[[ tag.active ? 'icon-checkbox-checked' : 'icon-checkbox-hover' ]]\\\"></svg> <div class=\\\"ml-4\\\">[[ tag.name ]]</div> </div> </div> </div> </div> \";\n// Exports\nexport default code;","// Module\nvar code = \"<svg><defs><clipPath id=\\\"b\\\"><path fill=\\\"#00f\\\" fill-rule=\\\"evenodd\\\" d=\\\"M-1.255-.597h18.174v37.594H-1.255z\\\"/></clipPath><clipPath id=\\\"b\\\"><rect width=\\\"15.595\\\" height=\\\"36.753\\\" x=\\\"85.656\\\" y=\\\"-.305\\\" fill=\\\"#00f\\\" fill-rule=\\\"evenodd\\\" ry=\\\"0\\\"/></clipPath></defs><symbol id=\\\"icon-arrow-down\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" d=\\\"m16.426 8.088 1.486 1.338L12 15.995l-5.912-6.57 1.486-1.337L12 13.005z\\\"/></symbol><symbol id=\\\"icon-arrow-left\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"currentcolor\\\" d=\\\"m15.454 8.116-1.338-1.487-6.57 5.912 6.57 5.913 1.338-1.487-4.918-4.426z\\\"/></symbol><symbol id=\\\"icon-arrow-right\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"currentcolor\\\" d=\\\"m7.546 8.116 1.338-1.487 6.57 5.912-6.57 5.913-1.338-1.487 4.918-4.426z\\\"/></symbol><symbol id=\\\"icon-arrow-up\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" d=\\\"m16.426 15.995 1.486-1.338L12 8.087l-5.912 6.57 1.486 1.338L12 11.078z\\\"/></symbol><symbol id=\\\"icon-checkbox-checked\\\" viewBox=\\\"0 0 24 24\\\"><g fill=\\\"none\\\" fill-rule=\\\"evenodd\\\"><path fill=\\\"#f2e359\\\" d=\\\"M3 3h18v18H3z\\\" class=\\\"background\\\"/><path stroke=\\\"#232323\\\" stroke-linecap=\\\"square\\\" stroke-width=\\\"2\\\" d=\\\"m8 12 3 3 5-6\\\"/></g></symbol><symbol id=\\\"icon-checkbox-default\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" d=\\\"M21 3H3v18h18zm-2 2v14H5V5z\\\"/></symbol><symbol id=\\\"icon-checkbox-hover\\\" viewBox=\\\"0 0 24 24\\\"><g fill=\\\"none\\\" fill-rule=\\\"evenodd\\\"><path fill=\\\"#f2e359\\\" d=\\\"M3 3h18v18H3z\\\"/><path fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\" d=\\\"M21 3H3v18h18zm-2 2v14H5V5z\\\"/></g></symbol><symbol id=\\\"icon-download\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"currentcolor\\\" d=\\\"M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0m0 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2m1 3v10.084l3.5-3.498L17.914 13 12 18.914 6.086 13 7.5 11.586l3.5 3.5V5z\\\"/></symbol><symbol id=\\\"icon-enhance\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"currentcolor\\\" d=\\\"M13.707 17.364v2H4.636v-9.071h2v7.07zm5.657-12.728v9.071h-2v-7.07l-7.071-.001v-2z\\\"/></symbol><symbol id=\\\"icon-filter\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"currentcolor\\\" d=\\\"M18 17v2H6v-2zm2-6v2H4v-2zm2-6v2H2V5z\\\"/></symbol><symbol id=\\\"icon-hamburger-close\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#fff\\\" d=\\\"M17.657 7.757 13.414 12l4.243 4.243-1.414 1.414L12 13.414l-4.243 4.243-1.414-1.414L10.586 12 6.343 7.757l1.414-1.414L12 10.586l4.243-4.243z\\\"/></symbol><symbol id=\\\"icon-link-blank\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"currentcolor\\\" d=\\\"M8.263 4v2H3v15h15v-5.263h2V23H1V4zm14.864-2.67v8.365h-2l-.002-4.949-8.544 8.545-1.415-1.414 8.545-8.545-4.948-.001v-2h8.364z\\\"/></symbol><symbol id=\\\"icon-lupe\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" d=\\\"M3.657 3.657c3.905-3.905 10.237-3.905 14.142 0 3.666 3.666 3.89 9.471.673 13.4l3.802 3.803-1.414 1.414-3.803-3.803c-3.928 3.219-9.734 2.995-13.4-.672-3.905-3.905-3.905-10.237 0-14.142M5.07 5.07a8 8 0 1 0 11.314 11.314A8 8 0 0 0 5.07 5.07\\\"/></symbol><symbol id=\\\"icon-mail\\\" viewBox=\\\"0 0 23 23\\\"><path fill=\\\"#232323\\\" d=\\\"M23 3.692v14.77H0V3.692zm-1.917 2.972L11.5 13.127 1.916 6.664v9.951h19.167v-9.95zM19.41 5.538H3.589l7.911 5.335z\\\"/></symbol><symbol id=\\\"icon-menu-close\\\" viewBox=\\\"0 0 24 24\\\"><path d=\\\"m18.364 4.222 1.414 1.414L13.414 12l6.364 6.364-1.414 1.414L12 13.414l-6.364 6.364-1.414-1.414L10.586 12 4.222 5.636l1.414-1.414L12 10.586z\\\"/></symbol><symbol id=\\\"icon-menu\\\" viewBox=\\\"0 0 24 24\\\"><path d=\\\"M22 17v2H2v-2zm0-6v2H2v-2zm0-6v2H2V5z\\\"/></symbol><symbol id=\\\"icon-phone\\\" viewBox=\\\"0 0 23 23\\\"><path fill=\\\"none\\\" stroke=\\\"#000\\\" stroke-linecap=\\\"round\\\" stroke-width=\\\"2\\\" d=\\\"M21.083 14.77v4.673q-8.384 2.943-15.333-3.75Q0 10.153 2.875 1.845h4.894l1.947 5.609L7.748 9.24a7 7 0 0 0 1.968 3.356q1.461 1.403 3.873 2.253l1.97-1.786z\\\"/></symbol><symbol id=\\\"icon-twitter\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\" d=\\\"M7.53 21.61c9.063 0 14.018-7.546 14.018-14.086 0-.216 0-.432-.01-.637A10.1 10.1 0 0 0 24 4.32a10 10 0 0 1-2.83.78 4.94 4.94 0 0 0 2.166-2.74 10 10 0 0 1-3.127 1.2A4.9 4.9 0 0 0 16.613 2c-2.718 0-4.925 2.218-4.925 4.949 0 .39.041.77.133 1.129-4.097-.205-7.724-2.177-10.156-5.175a5 5 0 0 0-.664 2.485c0 1.715.869 3.234 2.197 4.117A4.8 4.8 0 0 1 .971 8.89v.062a4.95 4.95 0 0 0 3.954 4.856 5 5 0 0 1-1.298.174c-.317 0-.623-.03-.93-.092a4.92 4.92 0 0 0 4.598 3.44A9.87 9.87 0 0 1 0 19.371a13.7 13.7 0 0 0 7.53 2.238\\\"/></symbol><symbol id=\\\"icon-zauberstab-side-hover\\\" viewBox=\\\"0 0 359 344\\\"><g fill=\\\"none\\\" fill-rule=\\\"evenodd\\\" transform=\\\"translate(-731 -254)\\\"><path fill=\\\"currentcolor\\\" d=\\\"m804.635 585.14-49.463-49.464L1014.148 276.7l49.463 49.463zm160.05-193.026-16.488-16.488-160.048 160.048 16.488 16.488z\\\" class=\\\"wiggle1\\\" style=\\\"stroke-width:2.21899\\\"/><circle cx=\\\"922.087\\\" cy=\\\"551.808\\\" r=\\\"22.252\\\" fill=\\\"#8ec9bb\\\" class=\\\"blink\\\" style=\\\"stroke-width:2.96698\\\"/><circle cx=\\\"776.856\\\" cy=\\\"414.099\\\" r=\\\"24.434\\\" fill=\\\"#e2c0a8\\\" class=\\\"blink\\\" style=\\\"stroke-width:3.25784\\\"/><path fill=\\\"#f2e359\\\" d=\\\"m873.252 300.794 20.632 25.124-32.966.713-18.088 26.929-10.88-30.403-31.81-8.481 26.24-19.503-1.572-32.171 27.099 18.35 30.839-11.402z\\\" class=\\\"blink-2\\\"/><path fill=\\\"#adcbe1\\\" d=\\\"m1030.407 415.951 17.91 25.676 31.807.145-19.466 24.571 9.688 29.592-29.94-10.49-25.82 18.145.961-31.054-25.645-18.38 30.534-8.702z\\\" class=\\\"blink-3\\\"/><circle cx=\\\"1073.831\\\" cy=\\\"293.53\\\" r=\\\"15.544\\\" fill=\\\"#e7dbf9\\\" class=\\\"blink\\\" style=\\\"stroke-width:2.07255\\\"/><path fill=\\\"#fb8e7e\\\" d=\\\"m1026.874 566.135-15.327 10.77.571-18.434-15.223-10.91 18.125-5.166 5.919-17.513 10.631 15.241 18.881.087-11.555 14.585 5.751 17.566z\\\" class=\\\"blink-3\\\"/></g></symbol><symbol id=\\\"icon-zauberstab-side\\\" viewBox=\\\"0 0 359 344\\\"><g fill=\\\"currentcolor\\\" fill-rule=\\\"evenodd\\\" transform=\\\"translate(-731 -254)\\\"><path d=\\\"m804.635 585.14-49.463-49.464L1014.148 276.7l49.463 49.463zm160.05-193.026-16.488-16.488-160.048 160.048 16.488 16.488z\\\" class=\\\"wiggle1\\\" style=\\\"stroke-width:2.21899\\\"/><circle cx=\\\"922.087\\\" cy=\\\"551.808\\\" r=\\\"22.252\\\" class=\\\"blink\\\" style=\\\"stroke-width:2.96698\\\"/><circle cx=\\\"776.856\\\" cy=\\\"414.099\\\" r=\\\"24.434\\\" class=\\\"blink\\\" style=\\\"stroke-width:3.25784\\\"/><path d=\\\"m873.252 300.794 20.632 25.124-32.966.713-18.088 26.929-10.88-30.403-31.81-8.481 26.24-19.503-1.572-32.171 27.099 18.35 30.839-11.402z\\\" class=\\\"blink-2\\\"/><path d=\\\"m1030.407 415.951 17.91 25.676 31.807.145-19.466 24.571 9.688 29.592-29.94-10.49-25.82 18.145.961-31.054-25.645-18.38 30.534-8.702z\\\" class=\\\"blink-3\\\"/><circle cx=\\\"1073.831\\\" cy=\\\"293.53\\\" r=\\\"15.544\\\" class=\\\"blink\\\" style=\\\"stroke-width:2.07255\\\"/><path d=\\\"m1026.874 566.135-15.327 10.77.571-18.434-15.223-10.91 18.125-5.166 5.919-17.513 10.631 15.241 18.881.087-11.555 14.585 5.751 17.566z\\\" class=\\\"blink-3\\\"/></g></symbol><symbol id=\\\"icon-zauberstab\\\" viewBox=\\\"0 0 359 344\\\"><g fill=\\\"none\\\" fill-rule=\\\"evenodd\\\" transform=\\\"translate(0 .269)\\\"><path fill=\\\"#232323\\\" d=\\\"M151.291 226.731 129 204.441 245.709 87.73 268 110.022zm72.127-86.988-7.43-7.43-72.127 72.127 7.43 7.43z\\\" class=\\\"wiggle1\\\"/><circle cx=\\\"207.184\\\" cy=\\\"336.231\\\" r=\\\"7.5\\\" fill=\\\"#e7dbf9\\\" class=\\\"blink\\\"/><circle cx=\\\"7.5\\\" cy=\\\"136.126\\\" r=\\\"7.5\\\" fill=\\\"#8ec9bb\\\" class=\\\"blink\\\"/><path fill=\\\"#fb8e7e\\\" d=\\\"m340.64 229.711-6.679 9.942-4.017-11.224-11.744-3.132 9.688-7.2-.58-11.877 10.005 6.774 11.385-4.209-3.505 11.387 7.617 9.276zM101.251 51.334l-10.726 15.97-6.453-18.03-18.864-5.03L80.77 32.678 79.838 13.6l16.07 10.882 18.288-6.761-5.63 18.29 12.235 14.9z\\\" class=\\\"blink-2\\\"/><path fill=\\\"#adcbe1\\\" d=\\\"m64.086 298.508-16.614-11.906 19.781-5.638 6.46-19.113 11.602 16.633 20.606.094-12.61 15.919 6.276 19.17-19.397-6.795-16.727 11.755z\\\" class=\\\"blink-3\\\"/><circle cx=\\\"292.5\\\" cy=\\\"70.231\\\" r=\\\"7.5\\\" fill=\\\"#e7dbf9\\\" class=\\\"blink\\\"/><circle cx=\\\"134.5\\\" cy=\\\"126.231\\\" r=\\\"7.5\\\" fill=\\\"#e2c0a8\\\" class=\\\"blink-3\\\"/></g></symbol><symbol id=\\\"info-datenschutz\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\" d=\\\"M24 0v20.099C24 22.325 21.773 24 19.143 24H4C1.841 24 .108 22.204.005 19.979L0 19.769V16h4V0zm-2 2H6v20h13.143l.193-.004c1.533-.07 2.664-.958 2.664-1.897zM4 18H2v1.77c0 1.193.835 2.144 1.86 2.224L4 22zM14 4a3 3 0 0 1 2.995 2.824L17 7h-2a1 1 0 0 0-2 0c0 .156.042.257.19.43l.104.106.184.172.976.883.548.504.133.127a3 3 0 0 1 .628 5.205l.136.124.263.251q.113.11.17.177c.44.517.668 1.065.668 1.728a3 3 0 0 1-5.995.176L11 16.707h2a1 1 0 0 0 2 0c0-.156-.042-.256-.19-.43l-.104-.106-.184-.172-.976-.883-.208-.19a3.001 3.001 0 0 1-.918-5.477l-.32-.293-.262-.251a3 3 0 0 1-.17-.177C11.228 8.21 11 7.663 11 7a3 3 0 0 1 3-3m0 7a1 1 0 1 0 0 2 1 1 0 0 0 0-2\\\"/></symbol><symbol id=\\\"info-dida-niveau\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\" d=\\\"M15 8v16H9V8zm8-8v24h-6V0zM7 16v8H1v-8zm6-6h-2v12h2zm8-8h-2v20h2zM5 18H3v4h2z\\\"/></symbol><symbol id=\\\"info-material\\\" viewBox=\\\"0 0 24 24\\\"><g fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\"><path d=\\\"M10 0v18.013l-5 5.469-5-5.469V0zM7.301 18H2.698L5 20.517zM8 2H2v14h6zM6 4v8.75H4V4zM24 0v24H14V0zm-2 2h-6v3h4v2h-4v4h4v2h-4v4h4v2h-4v3h6z\\\"/></g></symbol><symbol id=\\\"info-person\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\" d=\\\"M12.571 0a4.048 4.048 0 0 1 2.877 6.895q.519.312.96.732a4.048 4.048 0 0 1 5.04 6.268 5.57 5.57 0 0 1 2.69 4.553l.005.219V24h-2v-5.333a3.571 3.571 0 0 0-7.138-.19l-.005.19V24h-2v-5.333a5.57 5.57 0 0 1 2.695-4.773 4.03 4.03 0 0 1-1.171-2.846c0-.714.185-1.385.509-1.967a3.55 3.55 0 0 0-2.462-.986 3.56 3.56 0 0 0-3.114 1.821q.16.541.162 1.132c0 1.11-.447 2.116-1.171 2.847a5.57 5.57 0 0 1 2.69 4.553l.005.219V24h-2v-5.333a3.571 3.571 0 0 0-7.138-.19l-.005.19V24H0v-5.333a5.57 5.57 0 0 1 2.695-4.773 4.048 4.048 0 0 1 5.621-5.821c.394-.47.861-.867 1.38-1.179A4.048 4.048 0 0 1 12.571 0m6 9a2.048 2.048 0 1 0 0 4.095 2.048 2.048 0 0 0 0-4.095m-13 0a2.048 2.048 0 1 0 0 4.095 2.048 2.048 0 0 0 0-4.095m7-7a2.048 2.048 0 1 0 0 4.095 2.048 2.048 0 0 0 0-4.095\\\"/></symbol><symbol id=\\\"info-vorwissen\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\" d=\\\"m16.025 0 .224.006a5 5 0 0 1 4.742 5.297l-.001-.005.003-.06L21 5.5q0 .438-.067.863l-.015.077.049.035a7.49 7.49 0 0 1 3.028 5.747L24 12.5a7.5 7.5 0 0 1-3.913 6.588l-.09.046-.002.083a5 5 0 0 1-4.778 4.778L15 24a5 5 0 0 1-2.82-.87l-.181-.131-.179.13a5 5 0 0 1-2.564.865L9 24a5 5 0 0 1-5-5l.002.135-.09-.047A7.5 7.5 0 0 1 .02 13.054l-.015-.276L0 12.5a7.5 7.5 0 0 1 3.033-6.025l.048-.036-.014-.077q-.045-.284-.06-.572L3 5.5q0-.158.009-.314l-.003.051-.004-.085L3 5A5.005 5.005 0 0 1 7.776.005L8.025 0l.218.006L8.5 0c1.239 0 2.411.413 3.357 1.143l.143.115.143-.115A5.5 5.5 0 0 1 15.236.006L15.5 0q.158 0 .314.009L15.76.006zM8.523 2l-.34.005L8.025 2l-.176.004a3 3 0 0 0-2.844 3.178v.117A3.6 3.6 0 0 0 5.17 6.58l.248.765-.693.406a5.5 5.5 0 0 0-.388 9.25L10 17v2H6a3 3 0 0 0 5.001 2.234V3.05A3.47 3.47 0 0 0 8.523 2M16 2l-.185.006H15.7A3.488 3.488 0 0 0 13 3.05v18.185A3 3 0 0 0 18 19h.001-3v-2l4.663.001a5.5 5.5 0 0 0-.387-9.25l-.694-.406.248-.765c.112-.345.17-.708.17-1.08l-.006-.2v-.117L19 5c0-1.601-1.258-2.918-2.825-2.995zM17 5v2.15l2.406 3.006-1.562 1.25L15 7.85V5zm-6.594 0v2.85l-2.844 3.556L6 10.156 8.406 7.15V5z\\\"/></symbol><symbol id=\\\"info-zeitaufwand\\\" viewBox=\\\"0 0 24 24\\\"><path fill=\\\"#232323\\\" fill-rule=\\\"nonzero\\\" d=\\\"M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0m0 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2m.5 3v6H17v2h-6.5V5z\\\"/></symbol><symbol id=\\\"new-flag-left\\\" viewBox=\\\"0 0 16.919 36\\\"><path fill=\\\"#fbb47e\\\" fill-rule=\\\"evenodd\\\" d=\\\"M1.189 0H98.81c.658 0 1.19.448 1.19 1 0 .197-.07.39-.2.554L86.786 18l13.016 16.446c.363.46.215 1.08-.331 1.386-.195.11-.424.168-.659.168H1.19C.532 36 0 35.552 0 35V1c0-.552.532-1 1.189-1\\\" clip-path=\\\"url(#b)\\\"/></symbol><symbol id=\\\"new-flag-right\\\" viewBox=\\\"0 0 14.345 36\\\"><path fill=\\\"#fbb47e\\\" fill-rule=\\\"evenodd\\\" d=\\\"M1.189 0H98.81c.658 0 1.19.448 1.19 1 0 .197-.07.39-.2.554L86.786 18l13.016 16.446c.363.46.215 1.08-.331 1.386-.195.11-.424.168-.659.168H1.19C.532 36 0 35.552 0 35V1c0-.552.532-1 1.189-1\\\" clip-path=\\\"url(#b)\\\" transform=\\\"translate(-85.656)\\\"/></symbol></svg>\";\n// Exports\nexport default code;","import { setup, scan, route } from '@lernetz/ts-lib';\nimport {AppController} from './components/app/App';\nimport { modelRegistry, viewRegistry } from './register';\nimport {languageService} from './services/lang';\nimport {getState, setState} from './state';\n// extend HttpRequest with a method (move to ts-lib)\n//\nimport \"../styling/main.css\";\n\nexport function init( setupData ) {\n setup(setupData, modelRegistry);\n\n setState(setupData);\n\n languageService.determineLanguage();\n\n // set translation for svelte\n\n const data = {\n ...setupData.data,\n ctrl: new AppController(),\n };\n setState({ ...getState(), scroll: data.ctrl.scrollEvent });\n\n scan({ root: document.body, registry: viewRegistry, data });\n}\n"],"names":["exports","str","loose","RegExp","keys","pattern","c","o","tmp","ext","arr","split","shift","push","indexOf","substring","length","svelteInsert","Error","window","__SVELTE_HMR_ADAPTER","constructor","instance","this","insertionPoint","afterMount","bind","rerender","_noOverlay","hotOptions","noOverlay","getErrorOverlay","noCreate","errorOverlay","errors","compileError","style","setTitle","title","overlay","h1","textContent","show","el","parentNode","document","body","appendChild","update","innerHTML","errorEl","renderError","forEach","message","remove","hide","div","createElement","h2","pre","section","createOverlay","addError","error","stack","clearErrors","element","removeChild","setCompileError","renderCompileError","dispose","clearError","target","anchor","debugName","createComment","refreshComponent","err","moduleName","label","description","_target","labelledBy","describedBy","n","setAttribute","updateTarget","id","defaultValues","resetOnSubmit","form","dispatch","subscribe","values","submit","$form","reset","opened","close","align","reference","triggerReference","threshold","handler","include","group","isOpen","menu","$overlay","class","name","slug","tags","map","t","filters","activeTags","tools","filterEnable","getTag","filter","found","find","tag","onChange","setActiveTags","e","detail","setValue","getValue","globalListeners","__SVELTE_HMR","on","event","fn","toLowerCase","dispatchEvent","CustomEvent","g","globalKey","Symbol","updatingCount","notifyStart","notifyError","reload","errString","console","notifyEnd","log","hotStates","trackAttribute","node","options","destroy","store","s","attribute","value","DOM_PROPERTIES","Set","attributes","Object","key","has","removeAttribute","setAttributeOrProperty","portalParents","WeakMap","portal","set","parentElement","querySelector","delete","clickOutside","init","_condition","condition","nodes","contains","container","current","get","getParent","listen","documentElement","type","mouseDown","pointerType","some","clientWidth","capture","addEventListener","passive","removeEventListener","ArrowUp","ArrowDown","keyUpDown","up","down","_handler","newOptions","ownerDocument","returnFocus","_","previouslyFocusedElement","activeElement","HTMLElement","focus","focusTrap","firstFocusableEl","lastFocusableEl","updateFocusableElements","focusableElements","Array","from","querySelectorAll","hasAttribute","tabIndex","observeChanges","MutationObserver","then","observe","childList","subtree","attributeFilter","unify","shiftKey","preventDefault","disconnect","scrollLock","lock","unlock","destroies","destroys","d","AlignOrigin","Center","Top","TopLeft","TopRight","Right","RightTop","RightBottom","Bottom","BottomRight","BottomLeft","Left","LeftBottom","LeftTop","place","_options","placeNode","rect","getBoundingClientRect","width","height","viewTop","scrollTop","viewLeft","scrollLeft","viewBottom","innerHeight","viewRight","innerWidth","bounds","top","left","right","bottom","clampTop","Math","max","min","clampLeft","count","uniqueId","prefix","createForm","fields","isMultiNode","f","field","HTMLInputElement","handleDomChange","isArray","checked","i","HTMLSelectElement","multiple","selectedOptions","HTMLTextAreaElement","handleValueChange","includes","option","selected","createField","addField","index","splice","removeField","DropdownContext","DropdownRadioGroupContext","createDropdownMenu","root","focusedIndex","menuItems","updateMenuItems","handleArrowKeys","direction","stopPropagation","role","tabindex","item","disabled","click","onSelect","closeOnSelect","checkbox","handleChange","separator","createDropdownRadioGroup","initialValue","internalValue","newValue","toggle","previous","groups","setCurrentOverlayInGroup","open","trigger","autoclose","Map","Show","View","super","template","data","if","prepareContent","contentTemplate","Template","checkVisibility","dataSubscription","propertyChange","context","parent","render","deinit","unsubscribe","_source","source","obj","translate","opts","undefined","num","parts","def","k","join","result","call","lookup","number","match","exec","to","parseInt","parseConditions","trim","clearConditions","replace","Model","dto","assign","ModelRegistry","registry","modelName","factory","observeProperties","properties","prop","desc","getOwnPropertyDescriptor","getPrototypeOf","attr","defineProperty","enumerable","configurable","observeArray","a","arrayChange","method","org","args","res","apply","Registry","entries","add","closure","HttpRequest","url","_method","_headers","progress","Signal","_url","request","XMLHttpRequest","onprogress","headers","timeout","milliseconds","_timeout","load","sendRequest","parseJson","send","jsonApi","path","sub","relative","JSON","stringify","reponse","catch","JsonApiError","fullPath","endsWith","slice","startsWith","child","promise","setRequestHeader","Promise","resolve","reject","abortTimeout","setTimeout","abort","abortHandler","abortException","DOMException","Request","errorHandler","clearTimeout","status","reasonPhrase","statusText","responseText","exception","onload","onabort","onerror","parse","post","put","config","setup","lang","asset","Asset","assets","route","urlParams","routes","empty","contextLog","params","logging","guessType","promises","loadScript","loadCSS","src","finalize","rel","href","head","pop","Observable","subscribe_","debounce","wait","observer","arg","observers_","observers","observable","Repeat","RepeatModel","cache","itemTemplate","onDataChange","renderItems","items","existing","cacheKey","getCacheKey","createTemplate","childNodes","insertBefore","isFirst","isLast","as","extendContext","arraySubscription","caching","pass","regex","mapper","inner","compile","templateString","matches","Function","trace","hasExpression","string","lastIndex","test","replacer","Expression","snakeToCamel","toUpperCase","ClosureExpression","expression","subscription","invoke","NodeEventExpression","updateSubscription","RenderExpression","prevLogging","inital","subscribeTo","ObjectSubscriber","trapper","p","unscopables","toPrimitive","hint","Proxy","getExpressionValue","booleanAttributes","HTMLButtonElement","HTMLFieldSetElement","HTMLOptGroupElement","HTMLOptionElement","Element","AttributeExpression","boolean","elementType","CSSExpression","expressionString","TextExpression","nodeValue","exp","hasProperties","onArrayChange","props","unshift","obs","onObjectChange","size","ViewExpression","getNamedItem","expressions","mergers","parseAttributes","parseInnerTemplates","renderView","rerenderCheck","flag","merger","view","viewName","expr","innerTemplates","getViewName","mergeNodes","DataEventExpression","attrs","prototype","dataExpr","DataExpression","RerenderCheck","getAttribute","DataAttributeExpression","eventExpression","AttributeEventExpression","SignalEventExpression","templateNodes","children","tagName","concat","AttributeMerger","setupInner","setupOuter","hasChildNodes","firstChild","filterExpressions","toString","m","viewExpression","subscribeArray","unsubscribeArray","signalName","signal","getAttrOf","outer","outerContent","innerContent","classes","list","classList","content","setPrototypeOf","html","temp","createNode","traverse","treeWalker","createTreeWalker","NodeFilter","SHOW_ELEMENT","SHOW_TEXT","acceptNode","nodeName","FILTER_REJECT","FILTER_ACCEPT","processNode","nextSibling","nextNode","Text","processAttributes","trans","debug","scan","_template","invokeInit","v","ViewRegistry","create","Image","ImageView","setAttributes","viewport","clientHeight","viewWidth","viewHeight","errorhandle","onError","srcset","names","Route","Pattern","router","restoreScroll","scrollHistory","setPos","writeURL","pathOf","matcher","ScrollHistory","history","scrollRestoration","getPos","Window","x","scrollX","y","scrollY","restore","pos","scrollTo","RouterView","onPopState","toCurrentPath","_current","mode","HistoryMode","notFound","toPath","toRoute","r","urlOf","getURL","readURL","base","location","origin","query","search","hash","currentPath","newPath","pushState","pathname","substr","StackView","StackRoute","urlSegments","wild","urlSeg","segments","segmentsPath","ModelSegment","model","childSegment","currentItem","next","currentItemIndex","images","CarouselView","resizeHeight","imageNode","fallbackUrl","IframelyView","iframelyResult","DecoratedIframelyView","preset","image","MaterialListView","ParagraphView","PersonalImpactView","PodcastView","caption","widthStyle","RawHtmlView","RelatedContentView","RelatedContent","TitleView","ToggleView","WizardSegment","urlSegment","followUpQuestion","answers","answer","action","level","InfoboxView","Infobox","QuoteView","Quote","AuthorCardView","views","gateway","goodPracticeGateway","goodPractice","headerAuthors","authors","author","hideInHeader","goodPractices","HomeView","HomeController","applyFilter","activeTopic","updateUrl","loadItems","currentLang","loadTopics","topics","parseParams","toolGateway","feed","feeds","loadFilteredTools","createParams","newUrl","paramParts","searchParams","URLSearchParams","MissingPageView","MissingPageController","ColumnLayoutView","ColumnLayout","ColumnView","Column","ContactView","Contact","GenericPage","GenericPageController","routeInit","loadPage","loadGeneralInfos","generalInfos","general","ResultPage","ResultPageController","loadFilters","filterCategories","tagSlugs","getActiveTagsFromParam","SearchPage","loading","SearchPageController","debouncedSearch","searchResults","overrideSearch","term","func","timer","ToolDetailsView","ToolDetailsController","toolId","tool","infos","metainfos","hintTitle","text","hintText","downloads","globalState","scrollSubscription","scroll","matchMedia","scrollContainer","getElementById","stickyBox","extraInfoContainer","scrollContainerTop","stickyBoxTop","stickyBoxBottom","extraInfoTop","isSticky","stickyBoxDistanceToTop","scrollTopChangingPoint","offset","ToolsPageView","ToolsPageController","searchString","activeFilters","loadTools","prepareFilters","apiSearchParams","canLoadMore","loadMore","updateUri","uri","URL","encodeURI","selectedTags","activeSlugs","active","Gateway","transformations","in","InTransform","out","OutTransform","defaultLookup","transform","WizardQuestion","back","WizardAnswer","goTo","newTags","mutateActiveTags","overrideTags","previousTags","GoodPracticeGateway","routeBase","date","Date","locale","formattedDate","toLocaleDateString","day","month","year","RawHtml","good_practice","Tool","ToolGateway","DecoratedIframely","Toggle","Carousel","MaterialList","PersonalImpact","filterQuery","fetch","json","Title","Paragraph","Podcast","loadInitialWizardQuestion","page","q","httpService","interceptors","processedRequest","applyInterceptors","interceptor","addInterceptor","languageService","switchLanguage","correctUrl","determineLanguage","localStorage","getItem","getLangFromBrowser","navigator","language","changeLanguage","setItem","uriParts","newUri","addHeaderInterceptor","paramService","component","wq","referrer","WizardRootSegment","wizardStack","de","en","Router","resetScrollPosition","urlName","tagService","tagParams","allTags","flatMap","filterCategory","tagParam","trackEvent","eventName","plausible","state","getState","setState","newState","freeze","ToolModule","isServer","detectOS","ua","userAgent","ipad","ios","android","noticeRequiredTargetElement","targetElement","warn","getPreventEventDefault","__BSL_PREVENT_DEFAULT__","cancelable","initialLockState","lockedNum","lockedElements","unLockCallback","documentListenerAdded","initialClientPos","clientX","clientY","getLockState","useGlobalLockState","lockState","__BSL_LOCK_STATE__","eventListenerOptions","isSupportOptions","listenerOptions","noop","testEvent","getEventListenerOptions","clearBodyLocks","ontouchmove","ontouchstart","_event$targetTouches$","targetTouches","scrollWidth","scrollHeight","isVertical","abs","handleScroll","$html","$body","htmlStyle","bodyStyle","overflow","position","overflowType","behavior","setOverflowHiddenMobile","scrollBarWidth","previousPaddingRight","getComputedStyle","paddingRight","boxSizing","__svelte","identity","tar","add_location","file","line","column","char","__svelte_meta","loc","run","fns","thing","safe_not_equal","b","validate_store","callbacks","callback","unsub","get_store_value","component_subscribe","$$","on_destroy","create_slot","definition","ctx","$$scope","slot_ctx","get_slot_context","get_slot_changes","dirty","lets","merged","len","update_slot_base","slot","slot_definition","slot_changes","get_slot_context_fn","slot_context","get_all_dirty_from_scope","exclude_internal_props","compute_rest_props","rest","set_store_value","ret","action_destroyer","action_result","split_css_unit","parseFloat","is_client","performance","now","raf","cb","requestAnimationFrame","tasks","run_tasks","task","globals","globalThis","global","ResizeObserverSingleton","_listeners","_observer","listener","_getObserver","unobserve","ResizeObserver","entry","is_hydrating","upper_bound","low","high","mid","append","get_root_for_style","getRootNode","host","append_empty_stylesheet","style_element","sheet","append_stylesheet","insert","hydrate_init","my_children","claim_order","Int32Array","longest","seq_len","idx","new_len","lis","to_move","last","cur","reverse","sort","j","init_hydrate","actual_end_child","detach","destroy_each","iterations","detaching","svg_element","createElementNS","createTextNode","space","prevent_default","always_set_through_set_attribute","set_attributes","descriptors","getOwnPropertyDescriptors","__proto__","cssText","xlink_attr","setAttributeNS","custom_event","bubbles","managed_styles","duration","delay","ease","uid","step","keyframes","rule","charCodeAt","doc","stylesheet","rules","info","create_style_information","insertRule","cssRules","animation","get_current_component","createEventDispatcher","defaultPrevented","setContext","getContext","dirty_components","binding_callbacks","render_callbacks","flush_callbacks","resolved_promise","update_scheduled","schedule_update","flush","tick","add_flush_callback","seen_callbacks","flushidx","saved_component","clear","fragment","before_update","after_update","kind","outroing","outros","group_outros","check_outros","block","local","null_transition","create_bidirectional_transition","intro","original_inert_value","running_program","pending_program","animation_name","clear_animation","anim","deleted","ownerNode","program","start","end","go","easing","css","inert","fulfill","handle_promise","token","resolved","child_ctx","needs_flush","blocks","mount","current_component","hasCatch","pending","update_await_block_branch","get_spread_update","levels","updates","to_null_out","accounted_for","SvelteElement","bound","create_component","mount_component","new_on_destroy","on_mount","destroy_component","filtered","targets","flush_render_callbacks","create_fragment","not_equal","append_styles","parent_component","on_disconnect","skip_bound","ready","fill","make_dirty","hydrate","l","get_custom_element_value","props_definition","$$ctor","$$s","$$c","$$cn","$$d","$$r","$$p_d","$$l","$$l_u","$$componentCtor","$$slots","use_shadow_dom","attachShadow","$on","connectedCallback","existing_slots","get_custom_elements_slots","$$g_p","shadowRoot","reflect_attributes","reflect","attribute_value","attributeChangedCallback","_oldValue","$set","disconnectedCallback","$destroy","attribute_name","SvelteComponent","$$set","dispatch_dev","version","append_dev","insert_dev","detach_dev","listen_dev","has_prevent_default","has_stop_propagation","has_stop_immediate_propagation","modifiers","attr_dev","prop_dev","property","set_data_dev","ensure_array_like_dev","iterator","array_like_or_iterator","validate_slots","slot_key","construct_svelte_component_dev","error_message","SvelteComponentDev","$$prop_def","$$events_def","$$slot_def","$$inline","$capture_state","$inject_state","subscriber_queue","writable","stop","subscribers","new_value","run_queue","subscriber","invalidate","fade","opacity","fly","target_opacity","od","xValue","xUnit","yValue","yUnit","u","VERSION","PUBLIC_VERSION","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","module","loaded","__webpack_modules__","hmd","hasOwnProperty","toStringTag","AppView","AppController","scrollEvent","modal","modalEnable","modalTitle","modalDescription","modalButtonLink","modalButtonLinkText","defaultStyles","Heading","HeadingView","validatedLevel","Number","applyStyles","walker","styles","currentNode","mounted","Html","HtmlView","resolveViews","SvgIconView","shadowDom","symbols","display","NavigationView","NavigationController","showZoom","scrollHandler","scrollObservable","updateZoomState","mobileToRoute","mobileMenuOpen","Topics","TopicsController","choice","choose","scrollIntoView","WizardView","GoodPracticeView","ToolListView","SearchRow","SearchRowContorller","SliderView","SliderController","sliderPosition","controlToggleClass","goLeft","isSliderStart","applyTranslate","goRight","isSliderEnd","maxPosition","getInnerWidth","containerPadding","getPropertyValue","showControls","controlRight","controlLeft","FooterView","footer","footerAddress","DropDownView","DropDown","closeHandler","stopImmediatePropagation","change","onOpen","onClose","selection","select","getIndex","BannerImage","MetaInfos","DropDownController","filterChange","filterOpen","clickTag","GoodPracticeDetails","CheckboxToggle","Overlay","OverlayController","MagicWand","WizardStart","ActiveTags","RouteLink","RouteLinkController","routeName","routeParams","isActive","ModalView","ModalViewController","hidden","removeItem","SvelteView","viewRegistry","Stack","Missing","Home","R","modelRegistry","setupData","ctrl"],"sourceRoot":""}