\n
\n \n ${when(x => x.childItems &&\n x.childItemLength() > 0 &&\n (x.expanded || x.renderCollapsedChildren), html `\n \n ${when(x => x.childItems && x.childItemLength() > 0, html `\n x.handleExpandCollapseButtonClick(c.event)}\"\n ${ref(\"expandCollapseButton\")}\n >\n \n \n \n
\n `)}\n ${startTemplate}\n \n
\n `)}\n \n`;\n","import { canUseDOM } from \"exenv-es6\";\nimport { isBoolean } from \"lodash-es\";\n/**\n * A test that ensures that all arguments are HTML Elements\n */\nexport function isHTMLElement(...args) {\n return args.every((arg) => arg instanceof HTMLElement);\n}\n/**\n * Returns all displayed elements inside of a root node that match a provided selector\n */\nexport function getDisplayedNodes(rootNode, selector) {\n if (!isHTMLElement(rootNode)) {\n return;\n }\n const nodes = Array.from(rootNode.querySelectorAll(selector));\n // offsetParent will be null if the element isn't currently displayed,\n // so this will allow us to operate only on visible nodes\n return nodes.filter((node) => node.offsetParent !== null);\n}\n/**\n * Gets the numeric key code associated with a keyboard event. This method is for use with DOM level 3 events\n * that still use the deprecated keyCode property.\n */\nexport function getKeyCode(event) {\n return event === null ? null : event.which || event.keyCode || event.charCode;\n}\n/**\n * Test if the document supports :focus-visible\n */\nlet _canUseFocusVisible;\nexport function canUseFocusVisible() {\n if (isBoolean(_canUseFocusVisible)) {\n return _canUseFocusVisible;\n }\n if (!canUseDOM()) {\n _canUseFocusVisible = false;\n return _canUseFocusVisible;\n }\n // Check to see if the document supports the focus-visible element\n const styleElement = document.createElement(\"style\");\n document.head.appendChild(styleElement);\n try {\n styleElement.sheet.insertRule(\"foo:focus-visible {color:inherit}\", 0);\n _canUseFocusVisible = true;\n }\n catch (e) {\n _canUseFocusVisible = false;\n }\n finally {\n document.head.removeChild(styleElement);\n }\n return _canUseFocusVisible;\n}\nlet _canUseCssGrid;\nexport function canUseCssGrid() {\n if (isBoolean(_canUseCssGrid)) {\n return _canUseCssGrid;\n }\n try {\n _canUseCssGrid = CSS.supports(\"display\", \"grid\");\n }\n catch (_a) {\n _canUseCssGrid = false;\n }\n return _canUseCssGrid;\n}\nexport function canUseForcedColors() {\n return (canUseDOM() &&\n (window.matchMedia(\"(forced-colors: none)\").matches ||\n window.matchMedia(\"(forced-colors: active)\").matches));\n}\n/**\n * @deprecated Use 'canUseForcedColors' instead\n */\nexport const canUsedForcedColors = canUseForcedColors;\n","// © Microsoft Corporation. All rights reserved.\nimport { __decorate } from \"tslib\";\nimport { TreeItem } from \"@microsoft/fast-foundation\";\nimport { isHTMLElement } from \"@microsoft/fast-web-utilities\";\nimport { attr } from \"@microsoft/fast-element\";\nexport class HamburgerMenuItem extends TreeItem {\n constructor() {\n super(...arguments);\n /**\n * Handles clicks on the hamburger menu item\n * @param e mouse event\n */\n this.handleContainerClick = (e) => {\n const expandButton = this.expandCollapseButton;\n const isButtonAnHTMLElement = isHTMLElement(expandButton);\n if ((!isButtonAnHTMLElement ||\n (isButtonAnHTMLElement && expandButton !== e.target)) &&\n !this.disabled) {\n this.handleMenuItemSelection(e);\n }\n };\n }\n /**\n * Handles menu item selection. For hamburger menu, we don't want users to be able to deselect items so we use this\n * method to protect against that. Emits a custom selected-change event\n * @param e mouse or keyboard event\n */\n handleMenuItemSelection(e) {\n if (this.selected) {\n return;\n }\n this.selected = !this.selected;\n // Keeping as \"selected-change\" event because TreeView and TreeItem depend on that event in their base classes\n this.$emit(\"selected-change\", e);\n }\n}\n__decorate([\n attr()\n], HamburgerMenuItem.prototype, \"id\", void 0);\n","/**\n * Define system colors for use in CSS stylesheets.\n *\n * https://drafts.csswg.org/css-color/#css-system-colors\n */\nexport var SystemColors;\n(function (SystemColors) {\n SystemColors[\"Canvas\"] = \"Canvas\";\n SystemColors[\"CanvasText\"] = \"CanvasText\";\n SystemColors[\"LinkText\"] = \"LinkText\";\n SystemColors[\"VisitedText\"] = \"VisitedText\";\n SystemColors[\"ActiveText\"] = \"ActiveText\";\n SystemColors[\"ButtonFace\"] = \"ButtonFace\";\n SystemColors[\"ButtonText\"] = \"ButtonText\";\n SystemColors[\"Field\"] = \"Field\";\n SystemColors[\"FieldText\"] = \"FieldText\";\n SystemColors[\"Highlight\"] = \"Highlight\";\n SystemColors[\"HighlightText\"] = \"HighlightText\";\n SystemColors[\"GrayText\"] = \"GrayText\";\n})(SystemColors || (SystemColors = {}));\n","// © Microsoft Corporation. All rights reserved.\nimport { accentForegroundRestBehavior, heightNumber, neutralFillStealthActiveBehavior, neutralFillStealthHoverBehavior, neutralFillStealthRestBehavior, neutralFillStealthSelectedBehavior, neutralFocusBehavior, neutralFocusInnerAccentBehavior, neutralForegroundActiveBehavior, neutralForegroundRestBehavior, neutralLayerFloatingBehavior, } from \"@fluentui/web-components\";\nimport { DirectionalStyleSheetBehavior, disabledCursor, display, focusVisible, forcedColorsStylesheetBehavior, } from \"@microsoft/fast-foundation\";\nimport { SystemColors } from \"@microsoft/fast-web-utilities\";\nimport { css } from \"@microsoft/fast-element\";\nconst ltr = css `\n .expand-collapse-glyph {\n transform: rotate(-45deg);\n }\n :host(.nested) .expand-collapse-button {\n left: var(--expand-collapse-button-nested-width, calc(${heightNumber} * -1px));\n }\n :host([selected])::after {\n left: calc(var(--focus-outline-width) * 1px);\n }\n :host(.expanded) > .positioning-region .expand-collapse-glyph {\n transform: rotate(0deg);\n }\n`;\nconst rtl = css `\n .expand-collapse-glyph {\n transform: rotate(135deg);\n }\n :host(.nested) .expand-collapse-button {\n right: var(--expand-collapse-button-nested-width, calc(${heightNumber} * -1px));\n }\n :host([selected])::after {\n right: calc(var(--focus-outline-width) * 1px);\n }\n :host(.expanded) > .positioning-region .expand-collapse-glyph {\n transform: rotate(90deg);\n }\n`;\nexport const HamburgerMenuItemStyles = css `\n ${display(\"block\")} :host {\n background: ${neutralLayerFloatingBehavior.var};\n color: ${neutralForegroundRestBehavior.var};\n contain: content;\n cursor: pointer;\n font-family: var(--body-font);\n outline: none;\n position: relative;\n --expand-collapse-button-size: calc(${heightNumber} * 1px);\n --tree-item-nested-width: 0;\n }\n :host([disabled]) .content-region {\n cursor: ${disabledCursor};\n opacity: var(--disabled-opacity);\n }\n :host([expanded]) > .items {\n display: block;\n }\n :host(:focus) .content-region {\n outline: none;\n }\n :host(:focus) > .positioning-region {\n outline: none;\n }\n :host(:${focusVisible}) .positioning-region {\n border: ${neutralFocusBehavior.var} 1px solid;\n border-radius: calc(var(--corner-radius) * 1px);\n color: ${neutralForegroundActiveBehavior.var};\n }\n :host([nested]) .content-region {\n font-size: var(--type-ramp-base-font-size);\n font-weight: 400;\n line-height: var(--type-ramp-base-line-height);\n margin-inline-start: var(--expand-collapse-button-size);\n position: relative;\n }\n :host([nested]) .expand-collapse-button {\n position: absolute;\n }\n :host([selected])::after {\n background: ${accentForegroundRestBehavior.var};\n border-radius: calc(var(--corner-radius) * 1px);\n content: \"\";\n display: block;\n height: 25px;\n position: absolute;\n top: 12px;\n width: 3px;\n }\n :host([selected]) .positioning-region {\n background: ${neutralFillStealthSelectedBehavior.var};\n }\n\n .content-region {\n align-items: center;\n display: flex;\n font-size: var(--type-ramp-plus-1-font-size);\n font-weight: 600;\n height: calc(${heightNumber} * 1px);\n line-height: var(--type-ramp-plus-1-line-height);\n margin-inline-end: 20px;\n margin-inline-start: calc(var(--design-unit) * 2px + 2px);\n width: 100%;\n white-space: nowrap;\n }\n .content-region .start:first-child {\n margin-inline-start: 32px;\n width: 16px;\n }\n .content-region span:first-child {\n width: 58px;\n }\n .end {\n ${\n/* need to swap out once we understand how horizontalSpacing will work */ \"\"} margin-inline-start: calc(var(--design-unit) * 2px + 2px);\n }\n .expand-collapse-button {\n align-items: center;\n background: none;\n border: none;\n cursor: pointer;\n display: flex;\n height: var(--expand-collapse-button-size);\n justify-content: center;\n outline: none;\n padding: 0;\n ${\n/* Width and Height should be based off calc(glyph-size-number + (design-unit * 4) * 1px) -\nupdate when density story is figured out */ \"\"} width: var(--expand-collapse-button-size);\n }\n .expand-collapse-glyph {\n fill: ${neutralForegroundRestBehavior.var};\n height: 16px;\n pointer-events: none;\n transition: transform 0.1s linear;\n ${\n/* Glyph size is temporary -\nreplace when glyph-size var is added */ \"\"} width: 16px;\n }\n .items {\n display: none;\n ${\n/* Font size should be based off calc(1em + (design-unit + glyph-size-number) * 1px) -\nupdate when density story is figured out */ \"\"} font-size: calc(1em + var(--type-ramp-base-font-size));\n }\n .positioning-region {\n align-items: center;\n border: transparent 1px solid;\n box-sizing: border-box;\n display: flex;\n height: 50px;\n position: relative;\n }\n .positioning-region::before {\n content: \"\";\n display: block;\n flex-shrink: 0;\n width: var(--tree-item-nested-width);\n }\n .positioning-region:hover {\n background: ${neutralFillStealthHoverBehavior.var};\n }\n .positioning-region:active {\n background: ${neutralFillStealthActiveBehavior.var};\n }\n .start, .end {\n fill: ${neutralForegroundRestBehavior.var};\n height: 16px;\n ${\n/* Glyph size is temporary -\nreplace when glyph-size var is added */ \"\"} width: 16px;\n }\n .start {\n ${\n/* need to swap out once we understand how horizontalSpacing will work */ \"\"} margin-inline-end: calc(var(--design-unit) * 2px + 2px);\n }\n ::slotted(fluent-tree-item) {\n --expand-collapse-button-nested-width: calc(${heightNumber} * -1px);\n --tree-item-nested-width: 1em;\n }\n`.withBehaviors(accentForegroundRestBehavior, neutralFillStealthSelectedBehavior, neutralFillStealthActiveBehavior, neutralFillStealthHoverBehavior, neutralFillStealthRestBehavior, neutralFocusBehavior, neutralFocusInnerAccentBehavior, neutralForegroundActiveBehavior, neutralForegroundRestBehavior, neutralLayerFloatingBehavior, new DirectionalStyleSheetBehavior(ltr, rtl), forcedColorsStylesheetBehavior(css `\n :host {\n background: ${SystemColors.Field};\n border-color: transparent;\n forced-color-adjust: none;\n }\n :host .content-region {\n color: ${SystemColors.FieldText};\n }\n :host .content-region .expand-collapse-glyph,\n :host .content-region .start,\n :host .content-region .end {\n fill: ${SystemColors.FieldText};\n }\n :host .positioning-region:hover,\n :host([selected]) .positioning-region {\n background: ${SystemColors.Highlight};\n }\n :host .positioning-region:hover .content-region,\n :host([selected]) .positioning-region .content-region {\n color: ${SystemColors.HighlightText};\n }\n :host .positioning-region:hover .content-region .expand-collapse-glyph,\n :host .positioning-region:hover .content-region .start,\n :host .positioning-region:hover .content-region .end,\n :host([selected]) .content-region .expand-collapse-glyph,\n :host([selected]) .content-region .start,\n :host([selected]) .content-region .end {\n fill: ${SystemColors.HighlightText};\n }\n :host([selected])::after {\n background: ${SystemColors.Field}\n }\n :host(:${focusVisible}) .positioning-region {\n border-color: ${SystemColors.FieldText};\n box-shadow: 0 0 0 2px inset ${SystemColors.Field};\n }\n :host([disabled]) .content-region,\n :host([disabled]) .positioning-region:hover .content-region {\n color: ${SystemColors.GrayText};\n opacity: 1;\n }\n :host([disabled]) .content-region .expand-collapse-glyph,\n :host([disabled]) .content-region .start,\n :host([disabled]) .content-region .end,\n :host([disabled]) .positioning-region:hover .content-region .expand-collapse-glyph,\n :host([disabled]) .positioning-region:hover .content-region .start,\n :host([disabled]) .positioning-region:hover .content-region .end {\n fill: ${SystemColors.GrayText};\n }\n :host([disabled]) .positioning-region:hover {\n background: ${SystemColors.Field};\n }\n `));\n","// © Microsoft Corporation. All rights reserved.\nimport { __decorate } from \"tslib\";\nimport { customElement } from \"@microsoft/fast-element\";\nimport { TreeItemTemplate as template } from \"@microsoft/fast-foundation\";\nimport { HamburgerMenuItem } from \"./hamburger-menu-item\";\nimport { HamburgerMenuItemStyles as styles } from \"./hamburger-menu-item.styles\";\n/**\n * @public\n */\nlet MsftHamburgerMenuItem = class MsftHamburgerMenuItem extends HamburgerMenuItem {\n};\nMsftHamburgerMenuItem = __decorate([\n customElement({\n name: \"msft-hamburger-menu-item\",\n template,\n styles,\n })\n], MsftHamburgerMenuItem);\nexport { MsftHamburgerMenuItem };\n","import { mergeWith } from \"lodash-es\";\nimport React from \"react\";\nimport { designSystemContext } from \"./context\";\nimport SheetManager from \"./sheet-manager\";\nexport function mergeClassNames(a, b) {\n if (typeof a === \"string\" && typeof b === \"string\") {\n return a.concat(\" \", b);\n }\n else if (typeof a === \"string\") {\n return a;\n }\n else if (typeof b === \"string\") {\n return b;\n }\n}\nclass JSSManager extends React.Component {\n constructor(props, context) {\n super(props, context);\n /**\n * Simple switch to track the initial creation of styles.\n * Because the \"styles\" property is abstract and abstract properties\n * are not accessible in the constructor, we need to compile styles\n * inside the first call of the render function\n */\n this.hasCreatedIntialStyleSheets = false;\n this.index = JSSManager.index -= 1;\n this.designSystem = context;\n }\n /**\n * Sets the JSS instance used by all JSSManger instances\n */\n static set jss(instance) {\n JSSManager.sheetManager.jss = instance;\n }\n /**\n * Get the JSS instance used by all JSSManger instances\n */\n static get jss() {\n return JSSManager.sheetManager.jss;\n }\n static subscribe(subscriber) {\n return JSSManager.sheetManager.subscribe(subscriber);\n }\n static unsubscribe(subscriber) {\n JSSManager.sheetManager.unsubscribe(subscriber);\n }\n render() {\n if (!this.hasCreatedIntialStyleSheets) {\n if (this.styles) {\n const options = {\n meta: this.managedComponent.displayName || this.managedComponent.name,\n index: this.index,\n };\n if (typeof JSSManager.createGenerateClassName === \"function\") {\n options.generateClassName = JSSManager.createGenerateClassName(this.designSystem);\n }\n JSSManager.sheetManager.add(this.styles, this.designSystem, options);\n }\n if (this.props.jssStyleSheet) {\n this.createPropStyleSheet();\n }\n this.hasCreatedIntialStyleSheets = true;\n }\n return React.createElement(this.managedComponent, this.managedComponentProps());\n }\n componentDidUpdate(prevProps) {\n const hasSheetProps = !!this.props.jssStyleSheet;\n const hadSheetProps = !!prevProps.jssStyleSheet;\n if (this.designSystem !== this.context) {\n if (this.styles) {\n JSSManager.sheetManager.update(this.styles, this.designSystem, this.context);\n this.forceUpdate();\n }\n if (hadSheetProps && hasSheetProps) {\n if (prevProps.jssStyleSheet === this.props.jssStyleSheet) {\n JSSManager.sheetManager.update(this.props.jssStyleSheet, this.designSystem, this.context);\n }\n else {\n JSSManager.sheetManager.remove(prevProps.jssStyleSheet, this.designSystem);\n this.createPropStyleSheet(this.context);\n }\n this.forceUpdate();\n }\n else if (hadSheetProps && !hasSheetProps) {\n JSSManager.sheetManager.remove(prevProps.jssStyleSheet, this.designSystem);\n }\n else if (!hadSheetProps && hasSheetProps) {\n this.createPropStyleSheet(this.context);\n this.forceUpdate();\n }\n this.designSystem = this.context;\n }\n else if (hadSheetProps &&\n hasSheetProps &&\n prevProps.jssStyleSheet !== this.props.jssStyleSheet) {\n JSSManager.sheetManager.remove(prevProps.jssStyleSheet, this.designSystem);\n this.createPropStyleSheet();\n this.forceUpdate();\n }\n if (hadSheetProps && !hasSheetProps) {\n JSSManager.sheetManager.remove(prevProps.jssStyleSheet, this.designSystem);\n }\n else if (!hadSheetProps && hasSheetProps) {\n this.createPropStyleSheet();\n this.forceUpdate();\n }\n }\n componentWillUnmount() {\n if (this.styles) {\n JSSManager.sheetManager.remove(this.styles, this.designSystem);\n }\n if (this.props.jssStyleSheet) {\n JSSManager.sheetManager.remove(this.props.jssStyleSheet, this.designSystem);\n }\n JSSManager.index++;\n // reset style creation tracker in case the instance is re-used\n this.hasCreatedIntialStyleSheets = false;\n }\n /**\n * Return the JSSStyleSheet associated with the current designSystem and style\n */\n primaryStyleSheet() {\n if (this.styles) {\n return JSSManager.sheetManager.get(this.styles, this.designSystem);\n }\n }\n /**\n * Return the JSSStylesheet associated with the jssStyleSheet prop\n */\n secondaryStyleSheet() {\n if (this.props.jssStyleSheet) {\n return JSSManager.sheetManager.get(this.props.jssStyleSheet, this.designSystem);\n }\n }\n /**\n * Generate a prop object to give to the managed component\n */\n managedComponentProps() {\n const props = Object.assign(Object.assign({}, this.props), { managedClasses: this.getManagedClassNames(), ref: this.props.innerRef });\n delete props.jssStyleSheet;\n delete props.innerRef;\n return props;\n }\n /**\n * Returns the classes to pass down to the managed component\n */\n getManagedClassNames() {\n let primaryClasses = {};\n let secondaryClasses = {};\n const primarySheet = this.primaryStyleSheet();\n const secondarySheet = this.secondaryStyleSheet();\n if (!!primarySheet && primarySheet.hasOwnProperty(\"classes\")) {\n primaryClasses = Object.assign({}, primarySheet.classes);\n }\n if (!!secondarySheet && secondarySheet.hasOwnProperty(\"classes\")) {\n secondaryClasses = Object.assign({}, secondarySheet.classes);\n }\n return mergeWith(primaryClasses, secondaryClasses, mergeClassNames);\n }\n createPropStyleSheet(designSystem = this.designSystem) {\n const stylesheet = this.primaryStyleSheet();\n const options = {\n meta: `${this.managedComponent.displayName || this.managedComponent.name} - jssStyleSheet`,\n index: stylesheet ? stylesheet.options.index + 1 : this.index + 1,\n };\n if (typeof JSSManager.createGenerateClassName === \"function\") {\n options.generateClassName = JSSManager.createGenerateClassName(designSystem);\n }\n JSSManager.sheetManager.add(this.props.jssStyleSheet, designSystem, options);\n }\n}\n/**\n * Define the contextType for the manager to be the design system context\n */\nJSSManager.contextType = designSystemContext;\n/**\n * JSS allows us to use an index to order the created style elements. The higher the index,\n * the later in the document the style element will be created.\n *\n * This static index allows us to globally track every stylesheet created by the JSSManager. Each\n * instance decrements this index and assigns itself the decremented value. The effect of this is that\n * a React parent will always have a higher index than it's children because react constructs trees\n * recursively starting at the root. With a parent always having a higher index then it's children,\n * we can inform JSS of this order preference and ensure parent stylesheets always come later in the DOM.\n *\n * Inspiration for this approach to style element ordering comes from\n * https://github.com/cssinjs/react-jss/blob/master/src/injectSheet.js\n */\nJSSManager.index = -1000;\n/**\n * Manages stylesheets\n */\nJSSManager.sheetManager = new SheetManager();\nexport { JSSManager };\n","import { jss, stylesheetRegistry } from \"./jss\";\n/**\n * A class for managing instance of stylesheets. The SheetManager\n * tracks and associates compiled stylesheets with their style/design-system inputs,\n * as well as tracking number of times a style/design-system combination has been used.\n * Tracking this allows us to memoize compiled stylesheets and only compile a new sheet\n * when one does not already exist.\n */\nexport default class SheetManager {\n constructor() {\n this.jss = jss;\n this.registry = new WeakMap();\n }\n /**\n * Creates a new JSS stylesheet from a stylesheet and design-system.\n * If a JSS style sheet has been created with this stylesheet and design system already,\n * then simply track that another instance has been added\n */\n add(styles, designSystem, options) {\n const tracker = this.getTracker(styles, designSystem);\n if (Array.isArray(tracker)) {\n tracker[1]++;\n return;\n }\n let designSystemRegistry = this.registry.get(styles);\n if (designSystemRegistry === undefined) {\n // If we don't have any design system instances for the current stylesheet,\n // we need to create a new map to store them\n designSystemRegistry = new WeakMap();\n this.registry.set(styles, designSystemRegistry);\n }\n this.registry\n .get(styles)\n .set(designSystem, [this.createStyleSheet(styles, designSystem, options), 1]);\n }\n /**\n * Return the compiled jss stylesheet associated with a given style object and design system\n */\n get(styles, designSystem) {\n const tracker = this.getTracker(styles, designSystem);\n if (Array.isArray(tracker) && !!tracker[0]) {\n return tracker[0];\n }\n return;\n }\n /**\n * Removes a reference for a stylesheet and designSystem and adds a new reference. Useful\n * when the design system changes and the stylesheet should be associated with a new\n * design system\n */\n update(styles, previousDesignSystem, nextDesignSystem) {\n const tracker = this.getTracker(styles, previousDesignSystem);\n if (!tracker) {\n return;\n }\n /**\n * If we only have one sheet and this sheet isn't associated with the next design system, *and* it's an object,\n * we can simply update the sheet and move it's reference instead of completely tearing down the sheet and\n * re-creating a style element\n */\n if (tracker[1] === 1 &&\n !this.get(styles, nextDesignSystem) &&\n !!styles &&\n typeof styles === \"object\") {\n const sheet = tracker[0];\n sheet.update(nextDesignSystem);\n this.notify(\"update\", sheet);\n this.registry.get(styles).delete(previousDesignSystem);\n this.registry.get(styles).set(nextDesignSystem, tracker);\n }\n else {\n this.remove(styles, previousDesignSystem);\n this.add(styles, nextDesignSystem, tracker[0].options);\n }\n }\n /**\n * Reduces the internal count for a stylesheet and designsystem. If the count becomes zero,\n * the sheet will be detached\n */\n remove(styles, designSystem) {\n const tracker = this.getTracker(styles, designSystem);\n if (Array.isArray(tracker)) {\n tracker[1]--;\n if (tracker[1] === 0) {\n const sheet = tracker[0];\n this.jss.removeStyleSheet(sheet);\n stylesheetRegistry.remove(sheet);\n this.notify(\"remove\", sheet);\n this.registry.get(styles).delete(designSystem);\n }\n }\n }\n /**\n * Returns the number of components using a stylesheet with a designSystem\n */\n count(styles, designSystem) {\n const tracker = this.getTracker(styles, designSystem);\n if (Array.isArray(tracker)) {\n return tracker[1];\n }\n return -1;\n }\n /**\n * Removes all entries\n */\n clean() {\n this.registry = new WeakMap();\n }\n /**\n * Retrieve the sheet tracker tracking the styles and design system\n */\n getTracker(styles, designSystem) {\n const designSystemRegistry = this.registry.get(styles);\n if (designSystemRegistry instanceof WeakMap) {\n const tracker = designSystemRegistry.get(designSystem);\n if (Array.isArray(tracker)) {\n return tracker;\n }\n }\n }\n /**\n * Creates a JSS StyleSheet and attaches it to the DOM\n */\n createStyleSheet(styles, designSystem, options = {}) {\n const stylesheet = typeof styles === \"function\" ? styles(designSystem) : styles;\n const sheet = this.jss.createStyleSheet(stylesheet, Object.assign({ link: true }, options));\n sheet.update(designSystem).attach();\n stylesheetRegistry.add(sheet);\n this.notify(\"add\", sheet);\n return sheet;\n }\n notify(type, sheet) {\n if (Array.isArray(this.subscribers)) {\n this.subscribers.forEach((subscriber) => subscriber({ type, sheet }));\n }\n }\n /**\n * Subscribe to add, update, and remove events taken by the sheet manager.\n * @param subscriber The subscription function to invoke\n */\n subscribe(subscriber) {\n if (!Array.isArray(this.subscribers)) {\n this.subscribers = [];\n }\n if (this.subscribers.indexOf(subscriber) === -1) {\n this.subscribers.push(subscriber);\n }\n return () => {\n this.unsubscribe(subscriber);\n };\n }\n unsubscribe(subscriber) {\n if (Array.isArray(this.subscribers)) {\n const index = this.subscribers.indexOf(subscriber);\n if (index !== -1) {\n this.subscribers.splice(index, 1);\n }\n }\n }\n}\n","/* global window */\nimport ponyfill from './ponyfill.js';\n\nvar root;\n\nif (typeof self !== 'undefined') {\n root = self;\n} else if (typeof window !== 'undefined') {\n root = window;\n} else if (typeof global !== 'undefined') {\n root = global;\n} else if (typeof module !== 'undefined') {\n root = module;\n} else {\n root = Function('return this')();\n}\n\nvar result = ponyfill(root);\nexport default result;\n","/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\nexport default freeGlobal;\n","/**\n * Creates a function that returns `value`.\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Util\n * @param {*} value The value to return from the new function.\n * @returns {Function} Returns the new constant function.\n * @example\n *\n * var objects = _.times(2, _.constant({ 'a': 1 }));\n *\n * console.log(objects);\n * // => [{ 'a': 1 }, { 'a': 1 }]\n *\n * console.log(objects[0] === objects[1]);\n * // => true\n */\nfunction constant(value) {\n return function() {\n return value;\n };\n}\n\nexport default constant;\n","/**\n * Creates a unary function that invokes `func` with its argument transformed.\n *\n * @private\n * @param {Function} func The function to wrap.\n * @param {Function} transform The argument transform.\n * @returns {Function} Returns the new function.\n */\nfunction overArg(func, transform) {\n return function(arg) {\n return func(transform(arg));\n };\n}\n\nexport default overArg;\n","import assignValue from './_assignValue.js';\nimport castPath from './_castPath.js';\nimport isIndex from './_isIndex.js';\nimport isObject from './isObject.js';\nimport toKey from './_toKey.js';\n\n/**\n * The base implementation of `_.set`.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {Array|string} path The path of the property to set.\n * @param {*} value The value to set.\n * @param {Function} [customizer] The function to customize path creation.\n * @returns {Object} Returns `object`.\n */\nfunction baseSet(object, path, value, customizer) {\n if (!isObject(object)) {\n return object;\n }\n path = castPath(path, object);\n\n var index = -1,\n length = path.length,\n lastIndex = length - 1,\n nested = object;\n\n while (nested != null && ++index < length) {\n var key = toKey(path[index]),\n newValue = value;\n\n if (index != lastIndex) {\n var objValue = nested[key];\n newValue = customizer ? customizer(objValue, key, nested) : undefined;\n if (newValue === undefined) {\n newValue = isObject(objValue)\n ? objValue\n : (isIndex(path[index + 1]) ? [] : {});\n }\n }\n assignValue(nested, key, newValue);\n nested = nested[key];\n }\n return object;\n}\n\nexport default baseSet;\n","import root from './_root.js';\n\n/** Detect free variable `exports`. */\nvar freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports = freeModule && freeModule.exports === freeExports;\n\n/** Built-in value references. */\nvar Buffer = moduleExports ? root.Buffer : undefined,\n allocUnsafe = Buffer ? Buffer.allocUnsafe : undefined;\n\n/**\n * Creates a clone of `buffer`.\n *\n * @private\n * @param {Buffer} buffer The buffer to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Buffer} Returns the cloned buffer.\n */\nfunction cloneBuffer(buffer, isDeep) {\n if (isDeep) {\n return buffer.slice();\n }\n var length = buffer.length,\n result = allocUnsafe ? allocUnsafe(length) : new buffer.constructor(length);\n\n buffer.copy(result);\n return result;\n}\n\nexport default cloneBuffer;\n","import cloneArrayBuffer from './_cloneArrayBuffer.js';\n\n/**\n * Creates a clone of `typedArray`.\n *\n * @private\n * @param {Object} typedArray The typed array to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Object} Returns the cloned typed array.\n */\nfunction cloneTypedArray(typedArray, isDeep) {\n var buffer = isDeep ? cloneArrayBuffer(typedArray.buffer) : typedArray.buffer;\n return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length);\n}\n\nexport default cloneTypedArray;\n","import baseGetTag from './_baseGetTag.js';\nimport getPrototype from './_getPrototype.js';\nimport isObjectLike from './isObjectLike.js';\n\n/** `Object#toString` result references. */\nvar objectTag = '[object Object]';\n\n/** Used for built-in method references. */\nvar funcProto = Function.prototype,\n objectProto = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString = funcProto.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty = objectProto.hasOwnProperty;\n\n/** Used to infer the `Object` constructor. */\nvar objectCtorString = funcToString.call(Object);\n\n/**\n * Checks if `value` is a plain object, that is, an object created by the\n * `Object` constructor or one with a `[[Prototype]]` of `null`.\n *\n * @static\n * @memberOf _\n * @since 0.8.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a plain object, else `false`.\n * @example\n *\n * function Foo() {\n * this.a = 1;\n * }\n *\n * _.isPlainObject(new Foo);\n * // => false\n *\n * _.isPlainObject([1, 2, 3]);\n * // => false\n *\n * _.isPlainObject({ 'x': 0, 'y': 0 });\n * // => true\n *\n * _.isPlainObject(Object.create(null));\n * // => true\n */\nfunction isPlainObject(value) {\n if (!isObjectLike(value) || baseGetTag(value) != objectTag) {\n return false;\n }\n var proto = getPrototype(value);\n if (proto === null) {\n return true;\n }\n var Ctor = hasOwnProperty.call(proto, 'constructor') && proto.constructor;\n return typeof Ctor == 'function' && Ctor instanceof Ctor &&\n funcToString.call(Ctor) == objectCtorString;\n}\n\nexport default isPlainObject;\n","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _jssTemplate = require('jss-template');\n\nvar _jssTemplate2 = _interopRequireDefault(_jssTemplate);\n\nvar _jssGlobal = require('jss-global');\n\nvar _jssGlobal2 = _interopRequireDefault(_jssGlobal);\n\nvar _jssExtend = require('jss-extend');\n\nvar _jssExtend2 = _interopRequireDefault(_jssExtend);\n\nvar _jssNested = require('jss-nested');\n\nvar _jssNested2 = _interopRequireDefault(_jssNested);\n\nvar _jssCompose = require('jss-compose');\n\nvar _jssCompose2 = _interopRequireDefault(_jssCompose);\n\nvar _jssCamelCase = require('jss-camel-case');\n\nvar _jssCamelCase2 = _interopRequireDefault(_jssCamelCase);\n\nvar _jssDefaultUnit = require('jss-default-unit');\n\nvar _jssDefaultUnit2 = _interopRequireDefault(_jssDefaultUnit);\n\nvar _jssExpand = require('jss-expand');\n\nvar _jssExpand2 = _interopRequireDefault(_jssExpand);\n\nvar _jssVendorPrefixer = require('jss-vendor-prefixer');\n\nvar _jssVendorPrefixer2 = _interopRequireDefault(_jssVendorPrefixer);\n\nvar _jssPropsSort = require('jss-props-sort');\n\nvar _jssPropsSort2 = _interopRequireDefault(_jssPropsSort);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nexports.default = function () {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n return {\n plugins: [(0, _jssTemplate2.default)(options.template), (0, _jssGlobal2.default)(options.global), (0, _jssExtend2.default)(options.extend), (0, _jssNested2.default)(options.nested), (0, _jssCompose2.default)(options.compose), (0, _jssCamelCase2.default)(options.camelCase), (0, _jssDefaultUnit2.default)(options.defaultUnit), (0, _jssExpand2.default)(options.expand), (0, _jssVendorPrefixer2.default)(options.vendorPrefixer), (0, _jssPropsSort2.default)(options.propsSort)]\n };\n};","/**\n * The base implementation of `_.findIndex` and `_.findLastIndex` without\n * support for iteratee shorthands.\n *\n * @private\n * @param {Array} array The array to inspect.\n * @param {Function} predicate The function invoked per iteration.\n * @param {number} fromIndex The index to search from.\n * @param {boolean} [fromRight] Specify iterating from right to left.\n * @returns {number} Returns the index of the matched value, else `-1`.\n */\nfunction baseFindIndex(array, predicate, fromIndex, fromRight) {\n var length = array.length,\n index = fromIndex + (fromRight ? 1 : -1);\n\n while ((fromRight ? index-- : ++index < length)) {\n if (predicate(array[index], index, array)) {\n return index;\n }\n }\n return -1;\n}\n\nexport default baseFindIndex;\n","import castPath from './_castPath.js';\nimport isArguments from './isArguments.js';\nimport isArray from './isArray.js';\nimport isIndex from './_isIndex.js';\nimport isLength from './isLength.js';\nimport toKey from './_toKey.js';\n\n/**\n * Checks if `path` exists on `object`.\n *\n * @private\n * @param {Object} object The object to query.\n * @param {Array|string} path The path to check.\n * @param {Function} hasFunc The function to check properties.\n * @returns {boolean} Returns `true` if `path` exists, else `false`.\n */\nfunction hasPath(object, path, hasFunc) {\n path = castPath(path, object);\n\n var index = -1,\n length = path.length,\n result = false;\n\n while (++index < length) {\n var key = toKey(path[index]);\n if (!(result = object != null && hasFunc(object, key))) {\n break;\n }\n object = object[key];\n }\n if (result || ++index != length) {\n return result;\n }\n length = object == null ? 0 : object.length;\n return !!length && isLength(length) && isIndex(key, length) &&\n (isArray(object) || isArguments(object));\n}\n\nexport default hasPath;\n","/**\n * A specialized version of `_.some` for arrays without support for iteratee\n * shorthands.\n *\n * @private\n * @param {Array} [array] The array to iterate over.\n * @param {Function} predicate The function invoked per iteration.\n * @returns {boolean} Returns `true` if any element passes the predicate check,\n * else `false`.\n */\nfunction arraySome(array, predicate) {\n var index = -1,\n length = array == null ? 0 : array.length;\n\n while (++index < length) {\n if (predicate(array[index], index, array)) {\n return true;\n }\n }\n return false;\n}\n\nexport default arraySome;\n","/**\n * Checks if a `cache` value for `key` exists.\n *\n * @private\n * @param {Object} cache The cache to query.\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction cacheHas(cache, key) {\n return cache.has(key);\n}\n\nexport default cacheHas;\n","import arrayPush from './_arrayPush.js';\nimport isArray from './isArray.js';\n\n/**\n * The base implementation of `getAllKeys` and `getAllKeysIn` which uses\n * `keysFunc` and `symbolsFunc` to get the enumerable property names and\n * symbols of `object`.\n *\n * @private\n * @param {Object} object The object to query.\n * @param {Function} keysFunc The function to get the keys of `object`.\n * @param {Function} symbolsFunc The function to get the symbols of `object`.\n * @returns {Array} Returns the array of property names and symbols.\n */\nfunction baseGetAllKeys(object, keysFunc, symbolsFunc) {\n var result = keysFunc(object);\n return isArray(object) ? result : arrayPush(result, symbolsFunc(object));\n}\n\nexport default baseGetAllKeys;\n","/**\n * This method returns a new empty array.\n *\n * @static\n * @memberOf _\n * @since 4.13.0\n * @category Util\n * @returns {Array} Returns the new empty array.\n * @example\n *\n * var arrays = _.times(2, _.stubArray);\n *\n * console.log(arrays);\n * // => [[], []]\n *\n * console.log(arrays[0] === arrays[1]);\n * // => false\n */\nfunction stubArray() {\n return [];\n}\n\nexport default stubArray;\n","/** Used to compose unicode character classes. */\nvar rsAstralRange = '\\\\ud800-\\\\udfff',\n rsComboMarksRange = '\\\\u0300-\\\\u036f',\n reComboHalfMarksRange = '\\\\ufe20-\\\\ufe2f',\n rsComboSymbolsRange = '\\\\u20d0-\\\\u20ff',\n rsComboRange = rsComboMarksRange + reComboHalfMarksRange + rsComboSymbolsRange,\n rsVarRange = '\\\\ufe0e\\\\ufe0f';\n\n/** Used to compose unicode capture groups. */\nvar rsZWJ = '\\\\u200d';\n\n/** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */\nvar reHasUnicode = RegExp('[' + rsZWJ + rsAstralRange + rsComboRange + rsVarRange + ']');\n\n/**\n * Checks if `string` contains Unicode symbols.\n *\n * @private\n * @param {string} string The string to inspect.\n * @returns {boolean} Returns `true` if a symbol is found, else `false`.\n */\nfunction hasUnicode(string) {\n return reHasUnicode.test(string);\n}\n\nexport default hasUnicode;\n","import arrayPush from './_arrayPush.js';\nimport getPrototype from './_getPrototype.js';\nimport getSymbols from './_getSymbols.js';\nimport stubArray from './stubArray.js';\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeGetSymbols = Object.getOwnPropertySymbols;\n\n/**\n * Creates an array of the own and inherited enumerable symbols of `object`.\n *\n * @private\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of symbols.\n */\nvar getSymbolsIn = !nativeGetSymbols ? stubArray : function(object) {\n var result = [];\n while (object) {\n arrayPush(result, getSymbols(object));\n object = getPrototype(object);\n }\n return result;\n};\n\nexport default getSymbolsIn;\n","import baseFor from './_baseFor.js';\nimport keys from './keys.js';\n\n/**\n * The base implementation of `_.forOwn` without support for iteratee shorthands.\n *\n * @private\n * @param {Object} object The object to iterate over.\n * @param {Function} iteratee The function invoked per iteration.\n * @returns {Object} Returns `object`.\n */\nfunction baseForOwn(object, iteratee) {\n return object && baseFor(object, iteratee, keys);\n}\n\nexport default baseForOwn;\n","/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeFloor = Math.floor,\n nativeRandom = Math.random;\n\n/**\n * The base implementation of `_.random` without support for returning\n * floating-point numbers.\n *\n * @private\n * @param {number} lower The lower bound.\n * @param {number} upper The upper bound.\n * @returns {number} Returns the random number.\n */\nfunction baseRandom(lower, upper) {\n return lower + nativeFloor(nativeRandom() * (upper - lower + 1));\n}\n\nexport default baseRandom;\n","import { roundToPrecisionSmall } from \"./math-utilities\";\n/**\n * This uses Hue values in \"degree\" format. So expect a range of [0,360]. Some other implementations instead uses radians or a normalized Hue with range [0,1]. Be aware of this when checking values or using other libraries.\n *\n * @public\n */\nexport class ColorHSV {\n constructor(hue, sat, val) {\n this.h = hue;\n this.s = sat;\n this.v = val;\n }\n /**\n * Construct a {@link ColorHSV} from a config object.\n */\n static fromObject(data) {\n if (data && !isNaN(data.h) && !isNaN(data.s) && !isNaN(data.v)) {\n return new ColorHSV(data.h, data.s, data.v);\n }\n return null;\n }\n /**\n * Determines if a color is equal to another\n * @param rhs - the value to compare\n */\n equalValue(rhs) {\n return this.h === rhs.h && this.s === rhs.s && this.v === rhs.v;\n }\n /**\n * Returns a new {@link ColorHSV} rounded to the provided precision\n * @param precision - the precision to round to\n */\n roundToPrecision(precision) {\n return new ColorHSV(roundToPrecisionSmall(this.h, precision), roundToPrecisionSmall(this.s, precision), roundToPrecisionSmall(this.v, precision));\n }\n /**\n * Returns the {@link ColorHSV} formatted as an object.\n */\n toObject() {\n return { h: this.h, s: this.s, v: this.v };\n }\n}\n","import baseGet from './_baseGet.js';\nimport baseSet from './_baseSet.js';\nimport castPath from './_castPath.js';\n\n/**\n * The base implementation of `_.pickBy` without support for iteratee shorthands.\n *\n * @private\n * @param {Object} object The source object.\n * @param {string[]} paths The property paths to pick.\n * @param {Function} predicate The function invoked per property.\n * @returns {Object} Returns the new object.\n */\nfunction basePickBy(object, paths, predicate) {\n var index = -1,\n length = paths.length,\n result = {};\n\n while (++index < length) {\n var path = paths[index],\n value = baseGet(object, path);\n\n if (predicate(value, path)) {\n baseSet(result, castPath(path, object), value);\n }\n }\n return result;\n}\n\nexport default basePickBy;\n","/**\n * The base implementation of `_.clamp` which doesn't coerce arguments.\n *\n * @private\n * @param {number} number The number to clamp.\n * @param {number} [lower] The lower bound.\n * @param {number} upper The upper bound.\n * @returns {number} Returns the clamped number.\n */\nfunction baseClamp(number, lower, upper) {\n if (number === number) {\n if (upper !== undefined) {\n number = number <= upper ? number : upper;\n }\n if (lower !== undefined) {\n number = number >= lower ? number : lower;\n }\n }\n return number;\n}\n\nexport default baseClamp;\n","// A singleton Range instance used to efficiently remove ranges of DOM nodes.\n// See the implementation of HTMLView below for further details.\nconst range = document.createRange();\n/**\n * The standard View implementation, which also implements ElementView and SyntheticView.\n * @public\n */\nexport class HTMLView {\n /**\n * Constructs an instance of HTMLView.\n * @param fragment - The html fragment that contains the nodes for this view.\n * @param behaviors - The behaviors to be applied to this view.\n */\n constructor(fragment, behaviors) {\n this.fragment = fragment;\n this.behaviors = behaviors;\n /**\n * The data that the view is bound to.\n */\n this.source = null;\n /**\n * The execution context the view is running within.\n */\n this.context = null;\n this.firstChild = fragment.firstChild;\n this.lastChild = fragment.lastChild;\n }\n /**\n * Appends the view's DOM nodes to the referenced node.\n * @param node - The parent node to append the view's DOM nodes to.\n */\n appendTo(node) {\n node.appendChild(this.fragment);\n }\n /**\n * Inserts the view's DOM nodes before the referenced node.\n * @param node - The node to insert the view's DOM before.\n */\n insertBefore(node) {\n if (this.fragment.hasChildNodes()) {\n node.parentNode.insertBefore(this.fragment, node);\n }\n else {\n const parentNode = node.parentNode;\n const end = this.lastChild;\n let current = this.firstChild;\n let next;\n while (current !== end) {\n next = current.nextSibling;\n parentNode.insertBefore(current, node);\n current = next;\n }\n parentNode.insertBefore(end, node);\n }\n }\n /**\n * Removes the view's DOM nodes.\n * The nodes are not disposed and the view can later be re-inserted.\n */\n remove() {\n const fragment = this.fragment;\n const end = this.lastChild;\n let current = this.firstChild;\n let next;\n while (current !== end) {\n next = current.nextSibling;\n fragment.appendChild(current);\n current = next;\n }\n fragment.appendChild(end);\n }\n /**\n * Removes the view and unbinds its behaviors, disposing of DOM nodes afterward.\n * Once a view has been disposed, it cannot be inserted or bound again.\n */\n dispose() {\n const parent = this.firstChild.parentNode;\n const end = this.lastChild;\n let current = this.firstChild;\n let next;\n while (current !== end) {\n next = current.nextSibling;\n parent.removeChild(current);\n current = next;\n }\n parent.removeChild(end);\n const behaviors = this.behaviors;\n const oldSource = this.source;\n for (let i = 0, ii = behaviors.length; i < ii; ++i) {\n behaviors[i].unbind(oldSource);\n }\n }\n /**\n * Binds a view's behaviors to its binding source.\n * @param source - The binding source for the view's binding behaviors.\n * @param context - The execution context to run the behaviors within.\n */\n bind(source, context) {\n const behaviors = this.behaviors;\n if (this.source === source) {\n return;\n }\n else if (this.source !== null) {\n const oldSource = this.source;\n this.source = source;\n this.context = context;\n for (let i = 0, ii = behaviors.length; i < ii; ++i) {\n const current = behaviors[i];\n current.unbind(oldSource);\n current.bind(source, context);\n }\n }\n else {\n this.source = source;\n this.context = context;\n for (let i = 0, ii = behaviors.length; i < ii; ++i) {\n behaviors[i].bind(source, context);\n }\n }\n }\n /**\n * Unbinds a view's behaviors from its binding source.\n */\n unbind() {\n if (this.source === null) {\n return;\n }\n const behaviors = this.behaviors;\n const oldSource = this.source;\n for (let i = 0, ii = behaviors.length; i < ii; ++i) {\n behaviors[i].unbind(oldSource);\n }\n this.source = null;\n }\n /**\n * Efficiently disposes of a contiguous range of synthetic view instances.\n * @param views - A contiguous range of views to be disposed.\n */\n static disposeContiguousBatch(views) {\n if (views.length === 0) {\n return;\n }\n // Get the first node of the first view in the range.\n range.setStart(views[0].firstChild, 0);\n // Get the last node of the last view in the range. Then go one further\n // because the deleteContents operation isn't inclusive of the end node.\n // In all cases where we use this API, the node after the last node of\n // the last view is the comment node that we use as a placeholder.\n range.setEnd(views[views.length - 1].lastChild.nextSibling, 0);\n range.deleteContents();\n for (let i = 0, ii = views.length; i < ii; ++i) {\n const view = views[i];\n const behaviors = view.behaviors;\n const oldSource = view.source;\n for (let j = 0, jj = behaviors.length; j < jj; ++j) {\n behaviors[j].unbind(oldSource);\n }\n }\n }\n}\n","import { Observable } from \"../observation/observable\";\nimport { emptyArray } from \"../interfaces\";\n/**\n * Creates a function that can be used to filter a Node array, selecting only elements.\n * @param selector - An optional selector to restrict the filter to.\n * @public\n */\nexport function elements(selector) {\n if (selector) {\n return function (value, index, array) {\n return value.nodeType === 1 && value.matches(selector);\n };\n }\n return function (value, index, array) {\n return value.nodeType === 1;\n };\n}\n/**\n * A base class for node observation.\n * @internal\n */\nexport class NodeObservationBehavior {\n /**\n * Creates an instance of NodeObservationBehavior.\n * @param target - The target to assign the nodes property on.\n * @param options - The options to use in configuring node observation.\n */\n constructor(target, options) {\n this.target = target;\n this.options = options;\n this.source = null;\n }\n /**\n * Bind this behavior to the source.\n * @param source - The source to bind to.\n * @param context - The execution context that the binding is operating within.\n */\n bind(source) {\n const name = this.options.property;\n this.shouldUpdate = Observable.getAccessors(source).some((x) => x.name === name);\n this.source = source;\n this.updateTarget(this.computeNodes());\n if (this.shouldUpdate) {\n this.observe();\n }\n }\n /**\n * Unbinds this behavior from the source.\n * @param source - The source to unbind from.\n */\n unbind() {\n this.updateTarget(emptyArray);\n this.source = null;\n if (this.shouldUpdate) {\n this.disconnect();\n }\n }\n /** @internal */\n handleEvent() {\n this.updateTarget(this.computeNodes());\n }\n computeNodes() {\n let nodes = this.getNodes();\n if (this.options.filter !== void 0) {\n nodes = nodes.filter(this.options.filter);\n }\n return nodes;\n }\n updateTarget(value) {\n this.source[this.options.property] = value;\n }\n}\n","/**\n * base64.ts\n *\n * Licensed under the BSD 3-Clause License.\n * http://opensource.org/licenses/BSD-3-Clause\n *\n * References:\n * http://en.wikipedia.org/wiki/Base64\n *\n * @author Dan Kogai (https://github.com/dankogai)\n */\nconst version = '3.4.5';\n/**\n * @deprecated use lowercase `version`.\n */\nconst VERSION = version;\nconst _hasatob = typeof atob === 'function';\nconst _hasbtoa = typeof btoa === 'function';\nconst _hasBuffer = typeof Buffer === 'function';\nconst b64ch = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';\nconst b64chs = [...b64ch];\nconst b64tab = ((a) => {\n let tab = {};\n a.forEach((c, i) => tab[c] = i);\n return tab;\n})(b64chs);\nconst b64re = /^(?:[A-Za-z\\d+\\/]{4})*?(?:[A-Za-z\\d+\\/]{2}(?:==)?|[A-Za-z\\d+\\/]{3}=?)?$/;\nconst _fromCC = String.fromCharCode.bind(String);\nconst _U8Afrom = typeof Uint8Array.from === 'function'\n ? Uint8Array.from.bind(Uint8Array)\n : (it, fn = (x) => x) => new Uint8Array(Array.prototype.slice.call(it, 0).map(fn));\nconst _mkUriSafe = (src) => src\n .replace(/[+\\/]/g, (m0) => m0 == '+' ? '-' : '_')\n .replace(/=+$/m, '');\nconst _tidyB64 = (s) => s.replace(/[^A-Za-z0-9\\+\\/]/g, '');\n/**\n * polyfill version of `btoa`\n */\nconst btoaPolyfill = (bin) => {\n // console.log('polyfilled');\n let u32, c0, c1, c2, asc = '';\n const pad = bin.length % 3;\n for (let i = 0; i < bin.length;) {\n if ((c0 = bin.charCodeAt(i++)) > 255 ||\n (c1 = bin.charCodeAt(i++)) > 255 ||\n (c2 = bin.charCodeAt(i++)) > 255)\n throw new TypeError('invalid character found');\n u32 = (c0 << 16) | (c1 << 8) | c2;\n asc += b64chs[u32 >> 18 & 63]\n + b64chs[u32 >> 12 & 63]\n + b64chs[u32 >> 6 & 63]\n + b64chs[u32 & 63];\n }\n return pad ? asc.slice(0, pad - 3) + \"===\".substring(pad) : asc;\n};\n/**\n * does what `window.btoa` of web browsers do.\n * @param {String} bin binary string\n * @returns {string} Base64-encoded string\n */\nconst _btoa = _hasbtoa ? (bin) => btoa(bin)\n : _hasBuffer ? (bin) => Buffer.from(bin, 'binary').toString('base64')\n : btoaPolyfill;\nconst _fromUint8Array = _hasBuffer\n ? (u8a) => Buffer.from(u8a).toString('base64')\n : (u8a) => {\n // cf. https://stackoverflow.com/questions/12710001/how-to-convert-uint8-array-to-base64-encoded-string/12713326#12713326\n const maxargs = 0x1000;\n let strs = [];\n for (let i = 0, l = u8a.length; i < l; i += maxargs) {\n strs.push(_fromCC.apply(null, u8a.subarray(i, i + maxargs)));\n }\n return _btoa(strs.join(''));\n };\n/**\n * converts a Uint8Array to a Base64 string.\n * @param {boolean} [urlsafe] URL-and-filename-safe a la RFC4648 §5\n * @returns {string} Base64 string\n */\nconst fromUint8Array = (u8a, urlsafe = false) => urlsafe ? _mkUriSafe(_fromUint8Array(u8a)) : _fromUint8Array(u8a);\n/**\n * @deprecated should have been internal use only.\n * @param {string} src UTF-8 string\n * @returns {string} UTF-16 string\n */\nconst utob = (src) => unescape(encodeURIComponent(src));\n//\nconst _encode = _hasBuffer\n ? (s) => Buffer.from(s, 'utf8').toString('base64')\n : (s) => _btoa(utob(s));\n/**\n * converts a UTF-8-encoded string to a Base64 string.\n * @param {boolean} [urlsafe] if `true` make the result URL-safe\n * @returns {string} Base64 string\n */\nconst encode = (src, urlsafe = false) => urlsafe\n ? _mkUriSafe(_encode(src))\n : _encode(src);\n/**\n * converts a UTF-8-encoded string to URL-safe Base64 RFC4648 §5.\n * @returns {string} Base64 string\n */\nconst encodeURI = (src) => encode(src, true);\n/**\n * @deprecated should have been internal use only.\n * @param {string} src UTF-16 string\n * @returns {string} UTF-8 string\n */\nconst btou = (src) => decodeURIComponent(escape(src));\n/**\n * polyfill version of `atob`\n */\nconst atobPolyfill = (asc) => {\n // console.log('polyfilled');\n asc = asc.replace(/\\s+/g, '');\n if (!b64re.test(asc))\n throw new TypeError('malformed base64.');\n asc += '=='.slice(2 - (asc.length & 3));\n let u24, bin = '', r1, r2;\n for (let i = 0; i < asc.length;) {\n u24 = b64tab[asc.charAt(i++)] << 18\n | b64tab[asc.charAt(i++)] << 12\n | (r1 = b64tab[asc.charAt(i++)]) << 6\n | (r2 = b64tab[asc.charAt(i++)]);\n bin += r1 === 64 ? _fromCC(u24 >> 16 & 255)\n : r2 === 64 ? _fromCC(u24 >> 16 & 255, u24 >> 8 & 255)\n : _fromCC(u24 >> 16 & 255, u24 >> 8 & 255, u24 & 255);\n }\n return bin;\n};\n/**\n * does what `window.atob` of web browsers do.\n * @param {String} asc Base64-encoded string\n * @returns {string} binary string\n */\nconst _atob = _hasatob ? (asc) => atob(_tidyB64(asc))\n : _hasBuffer ? (asc) => Buffer.from(asc, 'base64').toString('binary')\n : atobPolyfill;\nconst _decode = _hasBuffer\n ? (a) => Buffer.from(a, 'base64').toString('utf8')\n : (a) => btou(_atob(a));\nconst _unURI = (a) => _tidyB64(a.replace(/[-_]/g, (m0) => m0 == '-' ? '+' : '/'));\n/**\n * converts a Base64 string to a UTF-8 string.\n * @param {String} src Base64 string. Both normal and URL-safe are supported\n * @returns {string} UTF-8 string\n */\nconst decode = (src) => _decode(_unURI(src));\n/**\n * converts a Base64 string to a Uint8Array.\n */\nconst toUint8Array = _hasBuffer\n ? (a) => _U8Afrom(Buffer.from(_unURI(a), 'base64'))\n : (a) => _U8Afrom(_atob(_unURI(a)), c => c.charCodeAt(0));\nconst _noEnum = (v) => {\n return {\n value: v, enumerable: false, writable: true, configurable: true\n };\n};\n/**\n * extend String.prototype with relevant methods\n */\nconst extendString = function () {\n const _add = (name, body) => Object.defineProperty(String.prototype, name, _noEnum(body));\n _add('fromBase64', function () { return decode(this); });\n _add('toBase64', function (urlsafe) { return encode(this, urlsafe); });\n _add('toBase64URI', function () { return encode(this, true); });\n _add('toBase64URL', function () { return encode(this, true); });\n _add('toUint8Array', function () { return toUint8Array(this); });\n};\n/**\n * extend Uint8Array.prototype with relevant methods\n */\nconst extendUint8Array = function () {\n const _add = (name, body) => Object.defineProperty(Uint8Array.prototype, name, _noEnum(body));\n _add('toBase64', function (urlsafe) { return fromUint8Array(this, urlsafe); });\n _add('toBase64URI', function () { return fromUint8Array(this, true); });\n _add('toBase64URL', function () { return fromUint8Array(this, true); });\n};\n/**\n * extend Builtin prototypes with relevant methods\n */\nconst extendBuiltins = () => {\n extendString();\n extendUint8Array();\n};\nconst gBase64 = {\n version: version,\n VERSION: VERSION,\n atob: _atob,\n atobPolyfill: atobPolyfill,\n btoa: _btoa,\n btoaPolyfill: btoaPolyfill,\n fromBase64: decode,\n toBase64: encode,\n encode: encode,\n encodeURI: encodeURI,\n encodeURL: encodeURI,\n utob: utob,\n btou: btou,\n decode: decode,\n fromUint8Array: fromUint8Array,\n toUint8Array: toUint8Array,\n extendString: extendString,\n extendUint8Array: extendUint8Array,\n extendBuiltins: extendBuiltins,\n};\n// makecjs:CUT //\nexport { version };\nexport { VERSION };\nexport { _atob as atob };\nexport { atobPolyfill };\nexport { _btoa as btoa };\nexport { btoaPolyfill };\nexport { decode as fromBase64 };\nexport { encode as toBase64 };\nexport { utob };\nexport { encode };\nexport { encodeURI };\nexport { encodeURI as encodeURL };\nexport { btou };\nexport { decode };\nexport { fromUint8Array };\nexport { toUint8Array };\nexport { extendString };\nexport { extendUint8Array };\nexport { extendBuiltins };\n// and finally,\nexport { gBase64 as Base64 };\n","import React from \"react\";\nimport Foundation from \"@microsoft/fast-components-foundation-react\";\nimport { getDisplayedNodes, isHTMLElement } from \"../utilities/dom\";\nimport { classNames, keyCodeEnd, keyCodeHome } from \"@microsoft/fast-web-utilities\";\nimport { canUseDOM } from \"exenv-es6\";\nexport const TreeViewContext = React.createContext({\n setLastFocused: null,\n adjustNestedTreeItemCount: null,\n nested: false,\n});\n/**\n * Simple state machine to track how many nodes have nested nodes\n */\nclass ChildNodeCountTracker {\n constructor() {\n this._count = 0;\n }\n get count() {\n return this._count;\n }\n adjust(delta) {\n this._count += 1;\n }\n}\n/* tslint:disable:max-classes-per-file */\n/**\n * @deprecated - Use @microsoft/fast-components-react-msft tree view instead\n * Will be removed in the next major version\n */\nexport default class TreeView extends Foundation {\n constructor(props) {\n super(props);\n this.handledProps = {\n managedClasses: void 0,\n children: void 0,\n };\n this.rootElement = React.createRef();\n /**\n * Track how many tree-items have children\n */\n this.nestedTreeItemTracker = new ChildNodeCountTracker();\n this.setLastFocused = (ref) => {\n this.setState({\n lastFocused: ref,\n });\n };\n this.adjustNestedTreeItemCount = (delta) => {\n this.nestedTreeItemTracker.adjust(delta);\n if (this.nestedTreeItemTracker.count > 0 && !this.state.nested) {\n this.setState({ nested: true });\n }\n else if (this.nestedTreeItemTracker.count === 0 && this.state.nested) {\n this.setState({ nested: false });\n }\n };\n this.handleBlur = (e) => {\n const root = this.rootElement.current;\n /**\n * If we focus outside of the tree\n */\n if (isHTMLElement(root) && !root.contains(e.relatedTarget)) {\n this.setState({\n focusable: true,\n });\n }\n };\n this.handleFocus = (e) => {\n if (!canUseDOM() || !isHTMLElement(this.rootElement.current)) {\n return;\n }\n const root = this.rootElement.current;\n const lastFocused = this.state\n .lastFocused;\n /**\n * If the tree view is receiving focus\n */\n if (isHTMLElement(root) && root === e.target) {\n // If we have a last focused item, focus it - otherwise focus the first \"[role='tree']\"\n // If there is no \"[role='tree']\" to be focused AND no last-focused, then there are likely no children\n // or children are malformed so keep the tree in the tab-order in the hopes that the author cleans up\n // the children\n const toBeFocused = !!lastFocused\n ? lastFocused.current\n : root.querySelector(\"[role='treeitem']\");\n if (isHTMLElement(toBeFocused)) {\n toBeFocused.focus();\n if (this.state.focusable) {\n this.setState({ focusable: false });\n }\n }\n }\n else {\n // A child is receiving focus. While focus is within the tree, we simply need to ensure\n // that the tree is not focusable.\n if (this.state.focusable) {\n this.setState({\n focusable: false,\n });\n }\n }\n };\n this.handleKeyDown = (e) => {\n let nodes;\n if (canUseDOM()) {\n switch (e.keyCode) {\n case keyCodeHome:\n nodes = this.getVisibleNodes();\n if (nodes.length) {\n nodes[0].focus();\n }\n break;\n case keyCodeEnd:\n nodes = this.getVisibleNodes();\n if (nodes.length) {\n nodes[nodes.length - 1].focus();\n }\n break;\n }\n }\n };\n this.state = {\n focusable: true,\n lastFocused: null,\n nested: false,\n };\n }\n render() {\n return (React.createElement(\"div\", Object.assign({}, this.unhandledProps(), { role: \"tree\", tabIndex: this.state.focusable ? 0 : -1, className: this.generateClassNames(), ref: this.rootElement, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown }),\n React.createElement(TreeViewContext.Provider, { value: {\n setLastFocused: this.setLastFocused,\n adjustNestedTreeItemCount: this.adjustNestedTreeItemCount,\n nested: this.state.nested,\n } }, this.props.children)));\n }\n componentDidUpdate() {\n this.ensureFocusability();\n }\n generateClassNames() {\n return super.generateClassNames(classNames(this.props.managedClasses.treeView));\n }\n /**\n * Verifies that the tree has a focusable child.\n * If it does not, the tree will begin to accept focus\n */\n ensureFocusability() {\n if (canUseDOM() &&\n !this.state.focusable &&\n isHTMLElement(this.rootElement.current)) {\n const focusableChild = this.rootElement.current.querySelector(\"[role='treeitem'][tabindex='0']\");\n if (!isHTMLElement(focusableChild)) {\n this.setState({\n focusable: true,\n });\n }\n }\n }\n getVisibleNodes() {\n return canUseDOM()\n ? getDisplayedNodes(this.rootElement.current, \"[role='treeitem']\")\n : [];\n }\n}\nTreeView.defaultProps = {\n managedClasses: {},\n};\n","/**\n * Gets the last element of `array`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Array\n * @param {Array} array The array to query.\n * @returns {*} Returns the last element of `array`.\n * @example\n *\n * _.last([1, 2, 3]);\n * // => 3\n */\nfunction last(array) {\n var length = array == null ? 0 : array.length;\n return length ? array[length - 1] : undefined;\n}\n\nexport default last;\n","import { useCallbackRef } from './useRef';\nimport { assignRef } from './assignRef';\n/**\n * Merges two or more refs together providing a single interface to set their value\n * @param {RefObject|Ref} refs\n * @returns {MutableRefObject} - a new ref, which translates all changes to {refs}\n *\n * @see {@link mergeRefs} a version without buit-in memoization\n * @see https://github.com/theKashey/use-callback-ref#usemergerefs\n * @example\n * const Component = React.forwardRef((props, ref) => {\n * const ownRef = useRef();\n * const domRef = useMergeRefs([ref, ownRef]); // 👈 merge together\n * return ...
\n * }\n */\nexport function useMergeRefs(refs, defaultValue) {\n return useCallbackRef(defaultValue, function (newValue) {\n return refs.forEach(function (ref) { return assignRef(ref, newValue); });\n });\n}\n","import { useState } from 'react';\n/**\n * creates a MutableRef with ref change callback\n * @param initialValue - initial ref value\n * @param {Function} callback - a callback to run when value changes\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n *\n * @see https://reactjs.org/docs/hooks-reference.html#useref\n * @see https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n * @returns {MutableRefObject}\n */\nexport function useCallbackRef(initialValue, callback) {\n var ref = useState(function () { return ({\n // value\n value: initialValue,\n // last callback\n callback: callback,\n // \"memoized\" public interface\n facade: {\n get current() {\n return ref.value;\n },\n set current(value) {\n var last = ref.value;\n if (last !== value) {\n ref.value = value;\n ref.callback(value, last);\n }\n }\n }\n }); })[0];\n // update callback\n ref.callback = callback;\n return ref.facade;\n}\n","/**\n * Assigns a value for a given ref, no matter of the ref format\n * @param {RefObject} ref - a callback function or ref object\n * @param value - a new value\n *\n * @see https://github.com/theKashey/use-callback-ref#assignref\n * @example\n * const refObject = useRef();\n * const refFn = (ref) => {....}\n *\n * assignRef(refObject, \"refValue\");\n * assignRef(refFn, \"refValue\");\n */\nexport function assignRef(ref, value) {\n if (typeof ref === 'function') {\n ref(value);\n }\n else if (ref) {\n ref.current = value;\n }\n return ref;\n}\n","import * as React from 'react';\nimport PropTypes from 'prop-types';\nexport var hiddenGuard = {\n width: '1px',\n height: '0px',\n padding: 0,\n overflow: 'hidden',\n position: 'fixed',\n top: '1px',\n left: '1px'\n};\n\nvar InFocusGuard = function InFocusGuard(_ref) {\n var children = _ref.children;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"div\", {\n key: \"guard-first\",\n \"data-focus-guard\": true,\n \"data-focus-auto-guard\": true,\n style: hiddenGuard\n }), children, children && /*#__PURE__*/React.createElement(\"div\", {\n key: \"guard-last\",\n \"data-focus-guard\": true,\n \"data-focus-auto-guard\": true,\n style: hiddenGuard\n }));\n};\n\nInFocusGuard.propTypes = process.env.NODE_ENV !== \"production\" ? {\n children: PropTypes.node\n} : {};\nInFocusGuard.defaultProps = {\n children: null\n};\nexport default InFocusGuard;","import * as tslib_1 from \"tslib\";\nfunction ItoI(a) {\n return a;\n}\nfunction innerCreateMedium(defaults, middleware) {\n if (middleware === void 0) { middleware = ItoI; }\n var buffer = [];\n var assigned = false;\n var medium = {\n read: function () {\n if (assigned) {\n throw new Error('Sidecar: could not `read` from an `assigned` medium. `read` could be used only with `useMedium`.');\n }\n if (buffer.length) {\n return buffer[buffer.length - 1];\n }\n return defaults;\n },\n useMedium: function (data) {\n var item = middleware(data, assigned);\n buffer.push(item);\n return function () {\n buffer = buffer.filter(function (x) { return x !== item; });\n };\n },\n assignSyncMedium: function (cb) {\n assigned = true;\n while (buffer.length) {\n var cbs = buffer;\n buffer = [];\n cbs.forEach(cb);\n }\n buffer = {\n push: function (x) { return cb(x); },\n filter: function () { return buffer; },\n };\n },\n assignMedium: function (cb) {\n assigned = true;\n var pendingQueue = [];\n if (buffer.length) {\n var cbs = buffer;\n buffer = [];\n cbs.forEach(cb);\n pendingQueue = buffer;\n }\n var executeQueue = function () {\n var cbs = pendingQueue;\n pendingQueue = [];\n cbs.forEach(cb);\n };\n var cycle = function () { return Promise.resolve().then(executeQueue); };\n cycle();\n buffer = {\n push: function (x) {\n pendingQueue.push(x);\n cycle();\n },\n filter: function (filter) {\n pendingQueue = pendingQueue.filter(filter);\n return buffer;\n },\n };\n },\n };\n return medium;\n}\nexport function createMedium(defaults, middleware) {\n if (middleware === void 0) { middleware = ItoI; }\n return innerCreateMedium(defaults, middleware);\n}\nexport function createSidecarMedium(options) {\n if (options === void 0) { options = {}; }\n var medium = innerCreateMedium(null);\n medium.options = tslib_1.__assign({ async: true, ssr: false }, options);\n return medium;\n}\n","import { createMedium, createSidecarMedium } from 'use-sidecar';\nexport var mediumFocus = createMedium({}, function (_ref) {\n var target = _ref.target,\n currentTarget = _ref.currentTarget;\n return {\n target: target,\n currentTarget: currentTarget\n };\n});\nexport var mediumBlur = createMedium();\nexport var mediumEffect = createMedium();\nexport var mediumSidecar = createSidecarMedium({\n async: true\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { node, bool, string, any, arrayOf, oneOfType, object, func } from 'prop-types';\nimport * as constants from 'focus-lock/constants';\nimport { useMergeRefs } from 'use-callback-ref';\nimport { hiddenGuard } from './FocusGuard';\nimport { mediumFocus, mediumBlur, mediumSidecar } from './medium';\nvar emptyArray = [];\nvar FocusLock = /*#__PURE__*/React.forwardRef(function (props, parentRef) {\n var _extends2;\n\n var _React$useState = React.useState(),\n realObserved = _React$useState[0],\n setObserved = _React$useState[1];\n\n var observed = React.useRef();\n var isActive = React.useRef(false);\n var originalFocusedElement = React.useRef(null);\n var children = props.children,\n disabled = props.disabled,\n noFocusGuards = props.noFocusGuards,\n persistentFocus = props.persistentFocus,\n crossFrame = props.crossFrame,\n autoFocus = props.autoFocus,\n allowTextSelection = props.allowTextSelection,\n group = props.group,\n className = props.className,\n whiteList = props.whiteList,\n _props$shards = props.shards,\n shards = _props$shards === void 0 ? emptyArray : _props$shards,\n _props$as = props.as,\n Container = _props$as === void 0 ? 'div' : _props$as,\n _props$lockProps = props.lockProps,\n containerProps = _props$lockProps === void 0 ? {} : _props$lockProps,\n SideCar = props.sideCar,\n shouldReturnFocus = props.returnFocus,\n onActivationCallback = props.onActivation,\n onDeactivationCallback = props.onDeactivation;\n\n var _React$useState2 = React.useState({}),\n id = _React$useState2[0]; // SIDE EFFECT CALLBACKS\n\n\n var onActivation = React.useCallback(function () {\n originalFocusedElement.current = originalFocusedElement.current || document && document.activeElement;\n\n if (observed.current && onActivationCallback) {\n onActivationCallback(observed.current);\n }\n\n isActive.current = true;\n }, [onActivationCallback]);\n var onDeactivation = React.useCallback(function () {\n isActive.current = false;\n\n if (onDeactivationCallback) {\n onDeactivationCallback(observed.current);\n }\n }, [onDeactivationCallback]);\n var returnFocus = React.useCallback(function (allowDefer) {\n var current = originalFocusedElement.current;\n\n if (Boolean(shouldReturnFocus) && current && current.focus) {\n var focusOptions = typeof shouldReturnFocus === 'object' ? shouldReturnFocus : undefined;\n originalFocusedElement.current = null;\n\n if (allowDefer) {\n // React might return focus after update\n // it's safer to defer the action\n Promise.resolve().then(function () {\n return current.focus(focusOptions);\n });\n } else {\n current.focus(focusOptions);\n }\n }\n }, [shouldReturnFocus]); // MEDIUM CALLBACKS\n\n var onFocus = React.useCallback(function (event) {\n if (isActive.current) {\n mediumFocus.useMedium(event);\n }\n }, []);\n var onBlur = mediumBlur.useMedium; // REF PROPAGATION\n // not using real refs due to race conditions\n\n var setObserveNode = React.useCallback(function (newObserved) {\n if (observed.current !== newObserved) {\n observed.current = newObserved;\n setObserved(newObserved);\n }\n }, []);\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof allowTextSelection !== 'undefined') {\n // eslint-disable-next-line no-console\n console.warn('React-Focus-Lock: allowTextSelection is deprecated and enabled by default');\n }\n\n React.useEffect(function () {\n if (!observed.current) {\n // eslint-disable-next-line no-console\n console.error('FocusLock: could not obtain ref to internal node');\n }\n }, []);\n }\n\n var lockProps = _extends((_extends2 = {}, _extends2[constants.FOCUS_DISABLED] = disabled && 'disabled', _extends2[constants.FOCUS_GROUP] = group, _extends2), containerProps);\n\n var hasLeadingGuards = noFocusGuards !== true;\n var hasTailingGuards = hasLeadingGuards && noFocusGuards !== 'tail';\n var mergedRef = useMergeRefs([parentRef, setObserveNode]);\n return /*#__PURE__*/React.createElement(React.Fragment, null, hasLeadingGuards && [/*#__PURE__*/React.createElement(\"div\", {\n key: \"guard-first\",\n \"data-focus-guard\": true,\n tabIndex: disabled ? -1 : 0,\n style: hiddenGuard\n }),\n /*#__PURE__*/\n // nearest focus guard\n React.createElement(\"div\", {\n key: \"guard-nearest\",\n \"data-focus-guard\": true,\n tabIndex: disabled ? -1 : 1,\n style: hiddenGuard\n }) // first tabbed element guard\n ], !disabled && /*#__PURE__*/React.createElement(SideCar, {\n id: id,\n sideCar: mediumSidecar,\n observed: realObserved,\n disabled: disabled,\n persistentFocus: persistentFocus,\n crossFrame: crossFrame,\n autoFocus: autoFocus,\n whiteList: whiteList,\n shards: shards,\n onActivation: onActivation,\n onDeactivation: onDeactivation,\n returnFocus: returnFocus\n }), /*#__PURE__*/React.createElement(Container, _extends({\n ref: mergedRef\n }, lockProps, {\n className: className,\n onBlur: onBlur,\n onFocus: onFocus\n }), children), hasTailingGuards && /*#__PURE__*/React.createElement(\"div\", {\n \"data-focus-guard\": true,\n tabIndex: disabled ? -1 : 0,\n style: hiddenGuard\n }));\n});\nFocusLock.propTypes = process.env.NODE_ENV !== \"production\" ? {\n children: node,\n disabled: bool,\n returnFocus: oneOfType([bool, object]),\n noFocusGuards: bool,\n allowTextSelection: bool,\n autoFocus: bool,\n persistentFocus: bool,\n crossFrame: bool,\n group: string,\n className: string,\n whiteList: func,\n shards: arrayOf(any),\n as: oneOfType([string, func, object]),\n lockProps: object,\n onActivation: func,\n onDeactivation: func,\n sideCar: any.isRequired\n} : {};\nFocusLock.defaultProps = {\n children: undefined,\n disabled: false,\n returnFocus: false,\n noFocusGuards: false,\n autoFocus: true,\n persistentFocus: false,\n crossFrame: true,\n allowTextSelection: undefined,\n group: undefined,\n className: undefined,\n whiteList: undefined,\n shards: undefined,\n as: 'div',\n lockProps: {},\n onActivation: undefined,\n onDeactivation: undefined\n};\nexport default FocusLock;","export var FOCUS_GROUP = 'data-focus-lock';\nexport var FOCUS_DISABLED = 'data-focus-lock-disabled';\nexport var FOCUS_ALLOW = 'data-no-focus-lock';\nexport var FOCUS_AUTO = 'data-autofocus-inside';","import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';\nimport _defineProperty from '@babel/runtime/helpers/esm/defineProperty';\nimport React, { PureComponent } from 'react';\n\nfunction withSideEffect(reducePropsToState, handleStateChangeOnClient) {\n if (process.env.NODE_ENV !== \"production\") {\n if (typeof reducePropsToState !== 'function') {\n throw new Error('Expected reducePropsToState to be a function.');\n }\n\n if (typeof handleStateChangeOnClient !== 'function') {\n throw new Error('Expected handleStateChangeOnClient to be a function.');\n }\n }\n\n function getDisplayName(WrappedComponent) {\n return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n }\n\n return function wrap(WrappedComponent) {\n if (process.env.NODE_ENV !== \"production\") {\n if (typeof WrappedComponent !== 'function') {\n throw new Error('Expected WrappedComponent to be a React component.');\n }\n }\n\n var mountedInstances = [];\n var state;\n\n function emitChange() {\n state = reducePropsToState(mountedInstances.map(function (instance) {\n return instance.props;\n }));\n handleStateChangeOnClient(state);\n }\n\n var SideEffect =\n /*#__PURE__*/\n function (_PureComponent) {\n _inheritsLoose(SideEffect, _PureComponent);\n\n function SideEffect() {\n return _PureComponent.apply(this, arguments) || this;\n }\n\n // Try to use displayName of wrapped component\n SideEffect.peek = function peek() {\n return state;\n };\n\n var _proto = SideEffect.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n mountedInstances.push(this);\n emitChange();\n };\n\n _proto.componentDidUpdate = function componentDidUpdate() {\n emitChange();\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n var index = mountedInstances.indexOf(this);\n mountedInstances.splice(index, 1);\n emitChange();\n };\n\n _proto.render = function render() {\n return React.createElement(WrappedComponent, this.props);\n };\n\n return SideEffect;\n }(PureComponent);\n\n _defineProperty(SideEffect, \"displayName\", \"SideEffect(\" + getDisplayName(WrappedComponent) + \")\");\n\n return SideEffect;\n };\n}\n\nexport default withSideEffect;\n","export default function _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n}","export var toArray = function toArray(a) {\n var ret = Array(a.length);\n for (var i = 0; i < a.length; ++i) {\n ret[i] = a[i];\n }\n return ret;\n};\n\nexport var arrayFind = function arrayFind(array, search) {\n return array.filter(function (a) {\n return a === search;\n })[0];\n};\n\nexport var asArray = function asArray(a) {\n return Array.isArray(a) ? a : [a];\n};","import { toArray } from './utils/array';\nimport { FOCUS_ALLOW } from './constants';\n\nvar focusIsHidden = function focusIsHidden() {\n return document && toArray(document.querySelectorAll('[' + FOCUS_ALLOW + ']')).some(function (node) {\n return node.contains(document.activeElement);\n });\n};\n\nexport default focusIsHidden;","var _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; };\n\nimport { FOCUS_DISABLED, FOCUS_GROUP } from '../constants';\nimport { asArray, toArray } from './array';\n\nvar filterNested = function filterNested(nodes) {\n var l = nodes.length;\n for (var i = 0; i < l; i += 1) {\n var _loop = function _loop(j) {\n if (i !== j) {\n if (nodes[i].contains(nodes[j])) {\n return {\n v: filterNested(nodes.filter(function (x) {\n return x !== nodes[j];\n }))\n };\n }\n }\n };\n\n for (var j = 0; j < l; j += 1) {\n var _ret = _loop(j);\n\n if ((typeof _ret === 'undefined' ? 'undefined' : _typeof(_ret)) === \"object\") return _ret.v;\n }\n }\n return nodes;\n};\n\nvar getTopParent = function getTopParent(node) {\n return node.parentNode ? getTopParent(node.parentNode) : node;\n};\n\nvar getAllAffectedNodes = function getAllAffectedNodes(node) {\n var nodes = asArray(node);\n return nodes.filter(Boolean).reduce(function (acc, currentNode) {\n var group = currentNode.getAttribute(FOCUS_GROUP);\n acc.push.apply(acc, group ? filterNested(toArray(getTopParent(currentNode).querySelectorAll('[' + FOCUS_GROUP + '=\"' + group + '\"]:not([' + FOCUS_DISABLED + '=\"disabled\"])'))) : [currentNode]);\n return acc;\n }, []);\n};\n\nexport default getAllAffectedNodes;","import getAllAffectedNodes from './utils/all-affected';\nimport { arrayFind, toArray } from './utils/array';\n\nvar focusInFrame = function focusInFrame(frame) {\n return frame === document.activeElement;\n};\n\nvar focusInsideIframe = function focusInsideIframe(topNode) {\n return !!arrayFind(toArray(topNode.querySelectorAll('iframe')), focusInFrame);\n};\n\nvar focusInside = function focusInside(topNode) {\n var activeElement = document && document.activeElement;\n\n if (!activeElement || activeElement.dataset && activeElement.dataset.focusGuard) {\n return false;\n }\n return getAllAffectedNodes(topNode).reduce(function (result, node) {\n return result || node.contains(activeElement) || focusInsideIframe(node);\n }, false);\n};\n\nexport default focusInside;","import { toArray } from './array';\n\nexport var tabSort = function tabSort(a, b) {\n var tabDiff = a.tabIndex - b.tabIndex;\n var indexDiff = a.index - b.index;\n\n if (tabDiff) {\n if (!a.tabIndex) return 1;\n if (!b.tabIndex) return -1;\n }\n\n return tabDiff || indexDiff;\n};\n\nexport var orderByTabIndex = function orderByTabIndex(nodes, filterNegative, keepGuards) {\n return toArray(nodes).map(function (node, index) {\n return {\n node: node,\n index: index,\n tabIndex: keepGuards && node.tabIndex === -1 ? (node.dataset || {}).focusGuard ? 0 : -1 : node.tabIndex\n };\n }).filter(function (data) {\n return !filterNegative || data.tabIndex >= 0;\n }).sort(tabSort);\n};","export default ['button:enabled:not([readonly])', 'select:enabled:not([readonly])', 'textarea:enabled:not([readonly])', 'input:enabled:not([readonly])', 'a[href]', 'area[href]', 'iframe', 'object', 'embed', '[tabindex]', '[contenteditable]', '[autofocus]'];","import tabbables from './tabbables';\nimport { toArray } from './array';\nimport { FOCUS_AUTO } from '../constants';\n\nvar queryTabbables = tabbables.join(',');\nvar queryGuardTabbables = queryTabbables + ', [data-focus-guard]';\n\nexport var getFocusables = function getFocusables(parents, withGuards) {\n return parents.reduce(function (acc, parent) {\n return acc.concat(\n // add all tabbables inside\n toArray(parent.querySelectorAll(withGuards ? queryGuardTabbables : queryTabbables)),\n // add if node is tabble itself\n parent.parentNode ? toArray(parent.parentNode.querySelectorAll(tabbables.join(','))).filter(function (node) {\n return node === parent;\n }) : []);\n }, []);\n};\n\nexport var getParentAutofocusables = function getParentAutofocusables(parent) {\n var parentFocus = parent.querySelectorAll('[' + FOCUS_AUTO + ']');\n return toArray(parentFocus).map(function (node) {\n return getFocusables([node]);\n }).reduce(function (acc, nodes) {\n return acc.concat(nodes);\n }, []);\n};","import { orderByTabIndex } from './tabOrder';\nimport { getFocusables, getParentAutofocusables } from './tabUtils';\nimport { toArray } from './array';\n\nvar isElementHidden = function isElementHidden(computedStyle) {\n if (!computedStyle || !computedStyle.getPropertyValue) {\n return false;\n }\n return computedStyle.getPropertyValue('display') === 'none' || computedStyle.getPropertyValue('visibility') === 'hidden';\n};\n\nexport var isVisible = function isVisible(node) {\n return !node || node === document || node.nodeType === Node.DOCUMENT_NODE || !isElementHidden(window.getComputedStyle(node, null)) && isVisible(node.parentNode && node.parentNode.nodeType === node.DOCUMENT_FRAGMENT_NODE ? node.parentNode.host : node.parentNode);\n};\n\nexport var notHiddenInput = function notHiddenInput(node) {\n return !((node.tagName === 'INPUT' || node.tagName === 'BUTTON') && (node.type === 'hidden' || node.disabled));\n};\n\nvar getParents = function getParents(node) {\n var parents = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];\n\n parents.push(node);\n if (node.parentNode) {\n getParents(node.parentNode, parents);\n }\n return parents;\n};\n\nexport var getCommonParent = function getCommonParent(nodea, nodeb) {\n var parentsA = getParents(nodea);\n var parentsB = getParents(nodeb);\n\n for (var i = 0; i < parentsA.length; i += 1) {\n var currentParent = parentsA[i];\n if (parentsB.indexOf(currentParent) >= 0) {\n return currentParent;\n }\n }\n return false;\n};\n\nexport var filterFocusable = function filterFocusable(nodes) {\n return toArray(nodes).filter(function (node) {\n return isVisible(node);\n }).filter(function (node) {\n return notHiddenInput(node);\n });\n};\n\nexport var getTabbableNodes = function getTabbableNodes(topNodes, withGuards) {\n return orderByTabIndex(filterFocusable(getFocusables(topNodes, withGuards)), true, withGuards);\n};\n\n/**\n * actually anything focusable\n */\nexport var getAllTabbableNodes = function getAllTabbableNodes(topNodes) {\n return orderByTabIndex(filterFocusable(getFocusables(topNodes)), false);\n};\n\nexport var parentAutofocusables = function parentAutofocusables(topNode) {\n return filterFocusable(getParentAutofocusables(topNode));\n};","var isRadio = function isRadio(node) {\n return node.tagName === 'INPUT' && node.type === 'radio';\n};\n\nvar findSelectedRadio = function findSelectedRadio(node, nodes) {\n return nodes.filter(isRadio).filter(function (el) {\n return el.name === node.name;\n }).filter(function (el) {\n return el.checked;\n })[0] || node;\n};\n\nexport var correctNode = function correctNode(node, nodes) {\n if (isRadio(node) && node.name) {\n return findSelectedRadio(node, nodes);\n }\n return node;\n};\n\nexport var correctNodes = function correctNodes(nodes) {\n // IE11 has no Set constructor\n var resultSet = new Set();\n nodes.forEach(function (node) {\n return resultSet.add(correctNode(node, nodes));\n });\n // using filter to support IE11\n return nodes.filter(function (node) {\n return resultSet.has(node);\n });\n};","import { correctNode } from './correctFocus';\n\nvar pickFirstFocus = function pickFirstFocus(nodes) {\n if (nodes[0] && nodes.length > 1) {\n return correctNode(nodes[0], nodes);\n }\n return nodes[0];\n};\n\nexport var pickFocusable = function pickFocusable(nodes, index) {\n if (nodes.length > 1) {\n return nodes.indexOf(correctNode(nodes[index], nodes));\n }\n return index;\n};\n\nexport default pickFirstFocus;","import { getCommonParent, getTabbableNodes, getAllTabbableNodes, parentAutofocusables } from './utils/DOMutils';\nimport pickFirstFocus, { pickFocusable } from './utils/firstFocus';\nimport getAllAffectedNodes from './utils/all-affected';\nimport { asArray } from './utils/array';\nimport { correctNodes } from './utils/correctFocus';\n\nvar findAutoFocused = function findAutoFocused(autoFocusables) {\n return function (node) {\n return !!node.autofocus || node.dataset && !!node.dataset.autofocus || autoFocusables.indexOf(node) >= 0;\n };\n};\n\nvar isGuard = function isGuard(node) {\n return node && node.dataset && node.dataset.focusGuard;\n};\nvar notAGuard = function notAGuard(node) {\n return !isGuard(node);\n};\n\nexport var NEW_FOCUS = 'NEW_FOCUS';\n\nexport var newFocus = function newFocus(innerNodes, outerNodes, activeElement, lastNode) {\n var cnt = innerNodes.length;\n var firstFocus = innerNodes[0];\n var lastFocus = innerNodes[cnt - 1];\n var isOnGuard = isGuard(activeElement);\n\n // focus is inside\n if (innerNodes.indexOf(activeElement) >= 0) {\n return undefined;\n }\n\n var activeIndex = outerNodes.indexOf(activeElement);\n var lastIndex = outerNodes.indexOf(lastNode || activeIndex);\n var lastNodeInside = innerNodes.indexOf(lastNode);\n var indexDiff = activeIndex - lastIndex;\n var firstNodeIndex = outerNodes.indexOf(firstFocus);\n var lastNodeIndex = outerNodes.indexOf(lastFocus);\n\n var correctedNodes = correctNodes(outerNodes);\n var correctedIndexDiff = correctedNodes.indexOf(activeElement) - correctedNodes.indexOf(lastNode || activeIndex);\n\n var returnFirstNode = pickFocusable(innerNodes, 0);\n var returnLastNode = pickFocusable(innerNodes, cnt - 1);\n\n // new focus\n if (activeIndex === -1 || lastNodeInside === -1) {\n return NEW_FOCUS;\n }\n // old focus\n if (!indexDiff && lastNodeInside >= 0) {\n return lastNodeInside;\n }\n // first element\n if (activeIndex <= firstNodeIndex && isOnGuard && Math.abs(indexDiff) > 1) {\n return returnLastNode;\n }\n // last element\n if (activeIndex >= lastNodeIndex && isOnGuard && Math.abs(indexDiff) > 1) {\n return returnFirstNode;\n }\n // jump out, but not on the guard\n if (indexDiff && Math.abs(correctedIndexDiff) > 1) {\n return lastNodeInside;\n }\n // focus above lock\n if (activeIndex <= firstNodeIndex) {\n return returnLastNode;\n }\n // focus below lock\n if (activeIndex > lastNodeIndex) {\n return returnFirstNode;\n }\n // index is inside tab order, but outside Lock\n if (indexDiff) {\n if (Math.abs(indexDiff) > 1) {\n return lastNodeInside;\n }\n return (cnt + lastNodeInside + indexDiff) % cnt;\n }\n // do nothing\n return undefined;\n};\n\nvar getTopCommonParent = function getTopCommonParent(baseActiveElement, leftEntry, rightEntries) {\n var activeElements = asArray(baseActiveElement);\n var leftEntries = asArray(leftEntry);\n var activeElement = activeElements[0];\n var topCommon = null;\n leftEntries.filter(Boolean).forEach(function (entry) {\n topCommon = getCommonParent(topCommon || entry, entry) || topCommon;\n rightEntries.filter(Boolean).forEach(function (subEntry) {\n var common = getCommonParent(activeElement, subEntry);\n if (common) {\n if (!topCommon || common.contains(topCommon)) {\n topCommon = common;\n } else {\n topCommon = getCommonParent(common, topCommon);\n }\n }\n });\n });\n return topCommon;\n};\n\nvar allParentAutofocusables = function allParentAutofocusables(entries) {\n return entries.reduce(function (acc, node) {\n return acc.concat(parentAutofocusables(node));\n }, []);\n};\n\nvar reorderNodes = function reorderNodes(srcNodes, dstNodes) {\n var remap = new Map();\n // no Set(dstNodes) for IE11 :(\n dstNodes.forEach(function (entity) {\n return remap.set(entity.node, entity);\n });\n // remap to dstNodes\n return srcNodes.map(function (node) {\n return remap.get(node);\n }).filter(Boolean);\n};\n\nexport var getFocusabledIn = function getFocusabledIn(topNode) {\n var entries = getAllAffectedNodes(topNode).filter(notAGuard);\n var commonParent = getTopCommonParent(topNode, topNode, entries);\n var outerNodes = getTabbableNodes([commonParent], true);\n var innerElements = getTabbableNodes(entries).filter(function (_ref) {\n var node = _ref.node;\n return notAGuard(node);\n }).map(function (_ref2) {\n var node = _ref2.node;\n return node;\n });\n\n return outerNodes.map(function (_ref3) {\n var node = _ref3.node,\n index = _ref3.index;\n return {\n node: node,\n index: index,\n lockItem: innerElements.indexOf(node) >= 0,\n guard: isGuard(node)\n };\n });\n};\n\nvar getFocusMerge = function getFocusMerge(topNode, lastNode) {\n var activeElement = document && document.activeElement;\n var entries = getAllAffectedNodes(topNode).filter(notAGuard);\n\n var commonParent = getTopCommonParent(activeElement || topNode, topNode, entries);\n\n var anyFocusable = getAllTabbableNodes(entries);\n var innerElements = getTabbableNodes(entries).filter(function (_ref4) {\n var node = _ref4.node;\n return notAGuard(node);\n });\n\n if (!innerElements[0]) {\n innerElements = anyFocusable;\n if (!innerElements[0]) {\n return undefined;\n }\n }\n\n var outerNodes = getAllTabbableNodes([commonParent]).map(function (_ref5) {\n var node = _ref5.node;\n return node;\n });\n var orderedInnerElements = reorderNodes(outerNodes, innerElements);\n var innerNodes = orderedInnerElements.map(function (_ref6) {\n var node = _ref6.node;\n return node;\n });\n\n var newId = newFocus(innerNodes, outerNodes, activeElement, lastNode);\n\n if (newId === \"NEW_FOCUS\") {\n var autoFocusable = anyFocusable.map(function (_ref7) {\n var node = _ref7.node;\n return node;\n }).filter(findAutoFocused(allParentAutofocusables(entries)));\n\n return {\n node: autoFocusable && autoFocusable.length ? pickFirstFocus(autoFocusable) : pickFirstFocus(innerNodes)\n };\n }\n\n if (newId === undefined) {\n return newId;\n }\n return orderedInnerElements[newId];\n};\n\nexport default getFocusMerge;","import getFocusMerge from './focusMerge';\n\nexport var focusOn = function focusOn(target) {\n target.focus();\n if (target.contentWindow) {\n target.contentWindow.focus();\n }\n};\n\nvar guardCount = 0;\nvar lockDisabled = false;\n\nexport default (function (topNode, lastNode) {\n var focusable = getFocusMerge(topNode, lastNode);\n\n if (lockDisabled) {\n return;\n }\n\n if (focusable) {\n if (guardCount > 2) {\n // eslint-disable-next-line no-console\n console.error('FocusLock: focus-fighting detected. Only one focus management system could be active. ' + 'See https://github.com/theKashey/focus-lock/#focus-fighting');\n lockDisabled = true;\n setTimeout(function () {\n lockDisabled = false;\n }, 1);\n return;\n }\n guardCount++;\n focusOn(focusable.node);\n guardCount--;\n }\n});","import tabHook from './tabHook';\nimport focusMerge, { getFocusabledIn } from './focusMerge';\nimport focusInside from './focusInside';\nimport focusIsHidden from './focusIsHidden';\nimport setFocus from './setFocus';\nimport * as constants from './constants';\nimport getAllAffectedNodes from './utils/all-affected';\n\nexport { tabHook, focusInside, focusIsHidden, focusMerge, getFocusabledIn, constants, getAllAffectedNodes };\n\nexport default setFocus;","export function deferAction(action) {\n // Hidding setImmediate from Webpack to avoid inserting polyfill\n var _window = window,\n setImmediate = _window.setImmediate;\n\n if (typeof setImmediate !== 'undefined') {\n setImmediate(action);\n } else {\n setTimeout(action, 1);\n }\n}\nexport var inlineProp = function inlineProp(name, value) {\n var obj = {};\n obj[name] = value;\n return obj;\n};","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport withSideEffect from 'react-clientside-effect';\nimport moveFocusInside, { focusInside, focusIsHidden, getFocusabledIn } from 'focus-lock';\nimport { deferAction } from './util';\nimport { mediumFocus, mediumBlur, mediumEffect } from './medium';\n\nvar focusOnBody = function focusOnBody() {\n return document && document.activeElement === document.body;\n};\n\nvar isFreeFocus = function isFreeFocus() {\n return focusOnBody() || focusIsHidden();\n};\n\nvar lastActiveTrap = null;\nvar lastActiveFocus = null;\nvar lastPortaledElement = null;\nvar focusWasOutsideWindow = false;\n\nvar defaultWhitelist = function defaultWhitelist() {\n return true;\n};\n\nvar focusWhitelisted = function focusWhitelisted(activeElement) {\n return (lastActiveTrap.whiteList || defaultWhitelist)(activeElement);\n};\n\nvar recordPortal = function recordPortal(observerNode, portaledElement) {\n lastPortaledElement = {\n observerNode: observerNode,\n portaledElement: portaledElement\n };\n};\n\nvar focusIsPortaledPair = function focusIsPortaledPair(element) {\n return lastPortaledElement && lastPortaledElement.portaledElement === element;\n};\n\nfunction autoGuard(startIndex, end, step, allNodes) {\n var lastGuard = null;\n var i = startIndex;\n\n do {\n var item = allNodes[i];\n\n if (item.guard) {\n if (item.node.dataset.focusAutoGuard) {\n lastGuard = item;\n }\n } else if (item.lockItem) {\n if (i !== startIndex) {\n // we will tab to the next element\n return;\n }\n\n lastGuard = null;\n } else {\n break;\n }\n } while ((i += step) !== end);\n\n if (lastGuard) {\n lastGuard.node.tabIndex = 0;\n }\n}\n\nvar extractRef = function extractRef(ref) {\n return ref && 'current' in ref ? ref.current : ref;\n};\n\nvar focusWasOutside = function focusWasOutside(crossFrameOption) {\n if (crossFrameOption) {\n // with cross frame return true for any value\n return Boolean(focusWasOutsideWindow);\n } // in other case return only of focus went a while aho\n\n\n return focusWasOutsideWindow === 'meanwhile';\n};\n\nvar activateTrap = function activateTrap() {\n var result = false;\n\n if (lastActiveTrap) {\n var _lastActiveTrap = lastActiveTrap,\n observed = _lastActiveTrap.observed,\n persistentFocus = _lastActiveTrap.persistentFocus,\n autoFocus = _lastActiveTrap.autoFocus,\n shards = _lastActiveTrap.shards,\n crossFrame = _lastActiveTrap.crossFrame;\n var workingNode = observed || lastPortaledElement && lastPortaledElement.portaledElement;\n var activeElement = document && document.activeElement;\n\n if (workingNode) {\n var workingArea = [workingNode].concat(shards.map(extractRef).filter(Boolean));\n\n if (!activeElement || focusWhitelisted(activeElement)) {\n if (persistentFocus || focusWasOutside(crossFrame) || !isFreeFocus() || !lastActiveFocus && autoFocus) {\n if (workingNode && !(focusInside(workingArea) || focusIsPortaledPair(activeElement, workingNode))) {\n if (document && !lastActiveFocus && activeElement && !autoFocus) {\n // Check if blur() exists, which is missing on certain elements on IE\n if (activeElement.blur) {\n activeElement.blur();\n }\n\n document.body.focus();\n } else {\n result = moveFocusInside(workingArea, lastActiveFocus);\n lastPortaledElement = {};\n }\n }\n\n focusWasOutsideWindow = false;\n lastActiveFocus = document && document.activeElement;\n }\n }\n\n if (document) {\n var newActiveElement = document && document.activeElement;\n var allNodes = getFocusabledIn(workingArea);\n var focusedIndex = allNodes.map(function (_ref) {\n var node = _ref.node;\n return node;\n }).indexOf(newActiveElement);\n\n if (focusedIndex > -1) {\n // remove old focus\n allNodes.filter(function (_ref2) {\n var guard = _ref2.guard,\n node = _ref2.node;\n return guard && node.dataset.focusAutoGuard;\n }).forEach(function (_ref3) {\n var node = _ref3.node;\n return node.removeAttribute('tabIndex');\n });\n autoGuard(focusedIndex, allNodes.length, +1, allNodes);\n autoGuard(focusedIndex, -1, -1, allNodes);\n }\n }\n }\n }\n\n return result;\n};\n\nvar onTrap = function onTrap(event) {\n if (activateTrap() && event) {\n // prevent scroll jump\n event.stopPropagation();\n event.preventDefault();\n }\n};\n\nvar onBlur = function onBlur() {\n return deferAction(activateTrap);\n};\n\nvar onFocus = function onFocus(event) {\n // detect portal\n var source = event.target;\n var currentNode = event.currentTarget;\n\n if (!currentNode.contains(source)) {\n recordPortal(currentNode, source);\n }\n};\n\nvar FocusWatcher = function FocusWatcher() {\n return null;\n};\n\nvar FocusTrap = function FocusTrap(_ref4) {\n var children = _ref4.children;\n return /*#__PURE__*/React.createElement(\"div\", {\n onBlur: onBlur,\n onFocus: onFocus\n }, children);\n};\n\nFocusTrap.propTypes = process.env.NODE_ENV !== \"production\" ? {\n children: PropTypes.node.isRequired\n} : {};\n\nvar onWindowBlur = function onWindowBlur() {\n focusWasOutsideWindow = 'just'; // using setTimeout to set this variable after React/sidecar reaction\n\n setTimeout(function () {\n focusWasOutsideWindow = 'meanwhile';\n }, 0);\n};\n\nvar attachHandler = function attachHandler() {\n document.addEventListener('focusin', onTrap, true);\n document.addEventListener('focusout', onBlur);\n window.addEventListener('blur', onWindowBlur);\n};\n\nvar detachHandler = function detachHandler() {\n document.removeEventListener('focusin', onTrap, true);\n document.removeEventListener('focusout', onBlur);\n window.removeEventListener('blur', onWindowBlur);\n};\n\nfunction reducePropsToState(propsList) {\n return propsList.filter(function (_ref5) {\n var disabled = _ref5.disabled;\n return !disabled;\n });\n}\n\nfunction handleStateChangeOnClient(traps) {\n var trap = traps.slice(-1)[0];\n\n if (trap && !lastActiveTrap) {\n attachHandler();\n }\n\n var lastTrap = lastActiveTrap;\n var sameTrap = lastTrap && trap && trap.id === lastTrap.id;\n lastActiveTrap = trap;\n\n if (lastTrap && !sameTrap) {\n lastTrap.onDeactivation(); // return focus only of last trap was removed\n\n if (!traps.filter(function (_ref6) {\n var id = _ref6.id;\n return id === lastTrap.id;\n }).length) {\n // allow defer is no other trap is awaiting restore\n lastTrap.returnFocus(!trap);\n }\n }\n\n if (trap) {\n lastActiveFocus = null;\n\n if (!sameTrap || lastTrap.observed !== trap.observed) {\n trap.onActivation();\n }\n\n activateTrap(true);\n deferAction(activateTrap);\n } else {\n detachHandler();\n lastActiveFocus = null;\n }\n} // bind medium\n\n\nmediumFocus.assignSyncMedium(onFocus);\nmediumBlur.assignMedium(onBlur);\nmediumEffect.assignMedium(function (cb) {\n return cb({\n moveFocusInside: moveFocusInside,\n focusInside: focusInside\n });\n});\nexport default withSideEffect(reducePropsToState, handleStateChangeOnClient)(FocusWatcher);","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport FocusLockUI from './Lock';\nimport FocusTrap from './Trap';\n/* that would be a BREAKING CHANGE!\n// delaying sidecar execution till the first usage\nconst RequireSideCar = (props) => {\n // eslint-disable-next-line global-require\n const SideCar = require('./Trap').default;\n return '],\n\t' ' : ['
'],\n\t'-': ['
']\n};\n\n/** Outdent a string based on the first indented line's leading whitespace\n *\t@private\n */\nfunction outdent(str) {\n\treturn str.replace(RegExp('^'+(str.match(/^(\\t| )+/) || '')[0], 'gm'), '');\n}\n\n/** Encode special attribute characters to HTML entities in a String.\n *\t@private\n */\nfunction encodeAttr(str) {\n\treturn (str+'').replace(/\"/g, '"').replace(//g, '>');\n}\n\n/** Parse Markdown into an HTML String. */\nfunction parse(md) {\n\tvar tokenizer = /((?:^|\\n+)(?:\\n---+|\\* \\*(?: \\*)+)\\n)|(?:^```(\\w*)\\n([\\s\\S]*?)\\n```$)|((?:(?:^|\\n+)(?:\\t| {2,}).+)+\\n*)|((?:(?:^|\\n)([>*+-]|\\d+\\.)\\s+.*)+)|(?:\\!\\[([^\\]]*?)\\]\\(([^\\)]+?)\\))|(\\[)|(\\](?:\\(([^\\)]+?)\\))?)|(?:(?:^|\\n+)([^\\s].*)\\n(\\-{3,}|={3,})(?:\\n+|$))|(?:(?:^|\\n+)(#{1,3})\\s*(.+)(?:\\n+|$))|(?:`([^`].*?)`)|( \\n\\n*|\\n{2,}|__|\\*\\*|[_*])/gm,\n\t\tcontext = [],\n\t\tout = '',\n\t\tlast = 0,\n\t\tlinks = {},\n\t\tchunk, prev, token, inner, t;\n\n\tfunction tag(token) {\n\t\tvar desc = TAGS[token.replace(/\\*/g,'_')[1] || ''],\n\t\t\tend = context[context.length-1]==token;\n\t\tif (!desc) { return token; }\n\t\tif (!desc[1]) { return desc[0]; }\n\t\tcontext[end?'pop':'push'](token);\n\t\treturn desc[end|0];\n\t}\n\n\tfunction flush() {\n\t\tvar str = '';\n\t\twhile (context.length) { str += tag(context[context.length-1]); }\n\t\treturn str;\n\t}\n\n\tmd = md.replace(/^\\[(.+?)\\]:\\s*(.+)$/gm, function (s, name, url) {\n\t\tlinks[name.toLowerCase()] = url;\n\t\treturn '';\n\t}).replace(/^\\n+|\\n+$/g, '');\n\n\twhile ( (token=tokenizer.exec(md)) ) {\n\t\tprev = md.substring(last, token.index);\n\t\tlast = tokenizer.lastIndex;\n\t\tchunk = token[0];\n\t\tif (prev.match(/[^\\\\](\\\\\\\\)*\\\\$/)) {\n\t\t\t// escaped\n\t\t}\n\t\t// Code/Indent blocks:\n\t\telse if (token[3] || token[4]) {\n\t\t\tchunk = '
'+outdent(encodeAttr(token[3] || token[4]).replace(/^\\n+|\\n+$/g, ''))+'';\n\t\t}\n\t\t// > Quotes, -* lists:\n\t\telse if (token[6]) {\n\t\t\tt = token[6];\n\t\t\tif (t.match(/\\./)) {\n\t\t\t\ttoken[5] = token[5].replace(/^\\d+/gm, '');\n\t\t\t}\n\t\t\tinner = parse(outdent(token[5].replace(/^\\s*[>*+.-]/gm, '')));\n\t\t\tif (t==='>') { t = 'blockquote'; }\n\t\t\telse {\n\t\t\t\tt = t.match(/\\./) ? 'ol' : 'ul';\n\t\t\t\tinner = inner.replace(/^(.*)(\\n|$)/gm, '
'+encodeAttr(token[16])+'';\n\t\t}\n\t\t// Inline formatting: *em*, **strong** & friends\n\t\telse if (token[17] || token[1]) {\n\t\t\tchunk = tag(token[17] || '--');\n\t\t}\n\t\tout += prev;\n\t\tout += chunk;\n\t}\n\n\treturn (out + md.substring(last) + flush()).trim();\n}\n\nexport default parse;\n//# sourceMappingURL=snarkdown.es.js.map\n","/**\n * Copyright 2016 Google Inc. All Rights Reserved.\n *\n * Licensed under the W3C SOFTWARE AND DOCUMENT NOTICE AND LICENSE.\n *\n * https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document\n *\n */\n(function() {\n'use strict';\n\n// Exit early if we're not running in a browser.\nif (typeof window !== 'object') {\n return;\n}\n\n// Exit early if all IntersectionObserver and IntersectionObserverEntry\n// features are natively supported.\nif ('IntersectionObserver' in window &&\n 'IntersectionObserverEntry' in window &&\n 'intersectionRatio' in window.IntersectionObserverEntry.prototype) {\n\n // Minimal polyfill for Edge 15's lack of `isIntersecting`\n // See: https://github.com/w3c/IntersectionObserver/issues/211\n if (!('isIntersecting' in window.IntersectionObserverEntry.prototype)) {\n Object.defineProperty(window.IntersectionObserverEntry.prototype,\n 'isIntersecting', {\n get: function () {\n return this.intersectionRatio > 0;\n }\n });\n }\n return;\n}\n\n\n/**\n * A local reference to the document.\n */\nvar document = window.document;\n\n\n/**\n * An IntersectionObserver registry. This registry exists to hold a strong\n * reference to IntersectionObserver instances currently observing a target\n * element. Without this registry, instances without another reference may be\n * garbage collected.\n */\nvar registry = [];\n\n\n/**\n * Creates the global IntersectionObserverEntry constructor.\n * https://w3c.github.io/IntersectionObserver/#intersection-observer-entry\n * @param {Object} entry A dictionary of instance properties.\n * @constructor\n */\nfunction IntersectionObserverEntry(entry) {\n this.time = entry.time;\n this.target = entry.target;\n this.rootBounds = entry.rootBounds;\n this.boundingClientRect = entry.boundingClientRect;\n this.intersectionRect = entry.intersectionRect || getEmptyRect();\n this.isIntersecting = !!entry.intersectionRect;\n\n // Calculates the intersection ratio.\n var targetRect = this.boundingClientRect;\n var targetArea = targetRect.width * targetRect.height;\n var intersectionRect = this.intersectionRect;\n var intersectionArea = intersectionRect.width * intersectionRect.height;\n\n // Sets intersection ratio.\n if (targetArea) {\n // Round the intersection ratio to avoid floating point math issues:\n // https://github.com/w3c/IntersectionObserver/issues/324\n this.intersectionRatio = Number((intersectionArea / targetArea).toFixed(4));\n } else {\n // If area is zero and is intersecting, sets to 1, otherwise to 0\n this.intersectionRatio = this.isIntersecting ? 1 : 0;\n }\n}\n\n\n/**\n * Creates the global IntersectionObserver constructor.\n * https://w3c.github.io/IntersectionObserver/#intersection-observer-interface\n * @param {Function} callback The function to be invoked after intersection\n * changes have queued. The function is not invoked if the queue has\n * been emptied by calling the `takeRecords` method.\n * @param {Object=} opt_options Optional configuration options.\n * @constructor\n */\nfunction IntersectionObserver(callback, opt_options) {\n\n var options = opt_options || {};\n\n if (typeof callback != 'function') {\n throw new Error('callback must be a function');\n }\n\n if (options.root && options.root.nodeType != 1) {\n throw new Error('root must be an Element');\n }\n\n // Binds and throttles `this._checkForIntersections`.\n this._checkForIntersections = throttle(\n this._checkForIntersections.bind(this), this.THROTTLE_TIMEOUT);\n\n // Private properties.\n this._callback = callback;\n this._observationTargets = [];\n this._queuedEntries = [];\n this._rootMarginValues = this._parseRootMargin(options.rootMargin);\n\n // Public properties.\n this.thresholds = this._initThresholds(options.threshold);\n this.root = options.root || null;\n this.rootMargin = this._rootMarginValues.map(function(margin) {\n return margin.value + margin.unit;\n }).join(' ');\n}\n\n\n/**\n * The minimum interval within which the document will be checked for\n * intersection changes.\n */\nIntersectionObserver.prototype.THROTTLE_TIMEOUT = 100;\n\n\n/**\n * The frequency in which the polyfill polls for intersection changes.\n * this can be updated on a per instance basis and must be set prior to\n * calling `observe` on the first target.\n */\nIntersectionObserver.prototype.POLL_INTERVAL = null;\n\n/**\n * Use a mutation observer on the root element\n * to detect intersection changes.\n */\nIntersectionObserver.prototype.USE_MUTATION_OBSERVER = true;\n\n\n/**\n * Starts observing a target element for intersection changes based on\n * the thresholds values.\n * @param {Element} target The DOM element to observe.\n */\nIntersectionObserver.prototype.observe = function(target) {\n var isTargetAlreadyObserved = this._observationTargets.some(function(item) {\n return item.element == target;\n });\n\n if (isTargetAlreadyObserved) {\n return;\n }\n\n if (!(target && target.nodeType == 1)) {\n throw new Error('target must be an Element');\n }\n\n this._registerInstance();\n this._observationTargets.push({element: target, entry: null});\n this._monitorIntersections();\n this._checkForIntersections();\n};\n\n\n/**\n * Stops observing a target element for intersection changes.\n * @param {Element} target The DOM element to observe.\n */\nIntersectionObserver.prototype.unobserve = function(target) {\n this._observationTargets =\n this._observationTargets.filter(function(item) {\n\n return item.element != target;\n });\n if (!this._observationTargets.length) {\n this._unmonitorIntersections();\n this._unregisterInstance();\n }\n};\n\n\n/**\n * Stops observing all target elements for intersection changes.\n */\nIntersectionObserver.prototype.disconnect = function() {\n this._observationTargets = [];\n this._unmonitorIntersections();\n this._unregisterInstance();\n};\n\n\n/**\n * Returns any queue entries that have not yet been reported to the\n * callback and clears the queue. This can be used in conjunction with the\n * callback to obtain the absolute most up-to-date intersection information.\n * @return {Array} The currently queued entries.\n */\nIntersectionObserver.prototype.takeRecords = function() {\n var records = this._queuedEntries.slice();\n this._queuedEntries = [];\n return records;\n};\n\n\n/**\n * Accepts the threshold value from the user configuration object and\n * returns a sorted array of unique threshold values. If a value is not\n * between 0 and 1 and error is thrown.\n * @private\n * @param {Array|number=} opt_threshold An optional threshold value or\n * a list of threshold values, defaulting to [0].\n * @return {Array} A sorted list of unique and valid threshold values.\n */\nIntersectionObserver.prototype._initThresholds = function(opt_threshold) {\n var threshold = opt_threshold || [0];\n if (!Array.isArray(threshold)) threshold = [threshold];\n\n return threshold.sort().filter(function(t, i, a) {\n if (typeof t != 'number' || isNaN(t) || t < 0 || t > 1) {\n throw new Error('threshold must be a number between 0 and 1 inclusively');\n }\n return t !== a[i - 1];\n });\n};\n\n\n/**\n * Accepts the rootMargin value from the user configuration object\n * and returns an array of the four margin values as an object containing\n * the value and unit properties. If any of the values are not properly\n * formatted or use a unit other than px or %, and error is thrown.\n * @private\n * @param {string=} opt_rootMargin An optional rootMargin value,\n * defaulting to '0px'.\n * @return {Array\n`;\n","import { css } from '@microsoft/fast-element';\nimport { AccentButtonStyles, accentFillActiveBehavior, accentFillHoverBehavior, accentFillRestBehavior, accentForegroundActiveBehavior, accentForegroundCutRestBehavior, accentForegroundHoverBehavior, accentForegroundRestBehavior, BaseButtonStyles, HypertextStyles, LightweightButtonStyles, neutralFillActiveBehavior, neutralFillFocusBehavior, neutralFillHoverBehavior, neutralFillRestBehavior, neutralFillStealthActiveBehavior, neutralFillStealthHoverBehavior, neutralFillStealthRestBehavior, neutralFocusBehavior, neutralFocusInnerAccentBehavior, neutralForegroundRestBehavior, neutralOutlineActiveBehavior, neutralOutlineHoverBehavior, neutralOutlineRestBehavior, OutlineButtonStyles, StealthButtonStyles, } from '../styles/';\nexport const AnchorStyles = css `\n ${BaseButtonStyles}\n ${AccentButtonStyles}\n ${HypertextStyles}\n ${LightweightButtonStyles}\n ${OutlineButtonStyles}\n ${StealthButtonStyles}\n`.withBehaviors(accentFillActiveBehavior, accentFillHoverBehavior, accentFillRestBehavior, accentForegroundActiveBehavior, accentForegroundCutRestBehavior, accentForegroundHoverBehavior, accentForegroundRestBehavior, neutralFillActiveBehavior, neutralFillFocusBehavior, neutralFillHoverBehavior, neutralFillRestBehavior, neutralFillStealthActiveBehavior, neutralFillStealthHoverBehavior, neutralFillStealthRestBehavior, neutralFocusBehavior, neutralFocusInnerAccentBehavior, neutralForegroundRestBehavior, neutralOutlineActiveBehavior, neutralOutlineHoverBehavior, neutralOutlineRestBehavior);\n","import { __decorate } from \"tslib\";\nimport { attr, customElement } from '@microsoft/fast-element';\nimport { Anchor, AnchorTemplate as template } from '@microsoft/fast-foundation';\nimport { AnchorStyles as styles } from './anchor.styles';\n/**\n * The Fluent Anchor Element. Implements {@link @microsoft/fast-foundation#Anchor},\n * {@link @microsoft/fast-foundation#AnchorTemplate}\n *\n *\n * @public\n * @remarks\n * HTML Element: \\