\n \n ${endSlotTemplate(context, definition)}\n \n x.disabled}\"\n class=\"listbox\"\n id=\"listbox\"\n part=\"listbox\"\n role=\"listbox\"\n ?disabled=\"${x => x.disabled}\"\n ?hidden=\"${x => !x.open}\"\n ${ref(\"listbox\")}\n >\n \n \n \n`;\n","/**\n * a method to filter out any whitespace _only_ nodes, to be used inside a template\n * @param value - The Node that is being inspected\n * @param index - The index of the node within the array\n * @param array - The Node array that is being filtered\n *\n * @public\n */\nexport function whitespaceFilter(value, index, array) {\n return value.nodeType !== Node.TEXT_NODE\n ? true\n : typeof value.nodeValue === \"string\" && !!value.nodeValue.trim().length;\n}\n","import { html, ref } from \"@microsoft/fast-element\";\n/**\n * A mixin class implementing start and end elements.\n * These are generally used to decorate text elements with icons or other visual indicators.\n * @public\n */\nexport class StartEnd {\n handleStartContentChange() {\n this.startContainer.classList.toggle(\"start\", this.start.assignedNodes().length > 0);\n }\n handleEndContentChange() {\n this.endContainer.classList.toggle(\"end\", this.end.assignedNodes().length > 0);\n }\n}\n/**\n * The template for the end element.\n * For use with {@link StartEnd}\n *\n * @public\n */\nexport const endSlotTemplate = (context, definition) => html `\n (definition.end ? \"end\" : void 0)}\n >\n x.handleEndContentChange()}\">\n ${definition.end || \"\"}\n \n \n`;\n/**\n * The template for the start element.\n * For use with {@link StartEnd}\n *\n * @public\n */\nexport const startSlotTemplate = (context, definition) => html `\n (definition.start ? \"start\" : void 0)}\"\n >\n x.handleStartContentChange()}\"\n >\n ${definition.start || \"\"}\n \n \n`;\n/**\n * The template for the end element.\n * For use with {@link StartEnd}\n *\n * @public\n * @deprecated - use endSlotTemplate\n */\nexport const endTemplate = html `\n \n x.handleEndContentChange()}\"\n >\n \n`;\n/**\n * The template for the start element.\n * For use with {@link StartEnd}\n *\n * @public\n * @deprecated - use startSlotTemplate\n */\nexport const startTemplate = html `\n \n x.handleStartContentChange()}\"\n >\n \n`;\n","import { html } from \"@microsoft/fast-element\";\nimport { endSlotTemplate, startSlotTemplate } from \"../patterns/start-end\";\n/**\n * The template for the {@link @microsoft/fast-foundation#(ListboxOption:class)} component.\n * @public\n */\nexport const listboxOptionTemplate = (context, definition) => html `\n x.selected}\"\n class=\"${x => (x.selected ? \"selected\" : \"\")} ${x => x.disabled ? \"disabled\" : \"\"}\"\n role=\"option\"\n >\n ${startSlotTemplate(context, definition)}\n \n \n \n ${endSlotTemplate(context, definition)}\n \n`;\n","import { html, slotted } from \"@microsoft/fast-element\";\n/**\n * The template for the {@link @microsoft/fast-foundation#(Radio:class)} component.\n * @public\n */\nexport const radioTemplate = (context, definition) => html `\n (x.checked ? \"checked\" : \"\")} ${x => x.readOnly ? \"readonly\" : \"\"}\"\n aria-checked=\"${x => x.checked}\"\n aria-required=\"${x => x.required}\"\n aria-disabled=\"${x => x.disabled}\"\n aria-readonly=\"${x => x.readOnly}\"\n @keypress=\"${(x, c) => x.keypressHandler(c.event)}\"\n @click=\"${(x, c) => x.clickHandler(c.event)}\"\n >\n
\n \n \n`;\n","import { __decorate } from \"tslib\";\nimport { FASTElement, observable } from \"@microsoft/fast-element\";\nimport { ComponentPresentation, DefaultComponentPresentation, } from \"../design-system/component-presentation\";\n/**\n * Defines a foundation element class that:\n * 1. Connects the element to its ComponentPresentation\n * 2. Allows resolving the element template from the instance or ComponentPresentation\n * 3. Allows resolving the element styles from the instance or ComponentPresentation\n *\n * @public\n */\nexport class FoundationElement extends FASTElement {\n constructor() {\n super(...arguments);\n this._presentation = void 0;\n }\n /**\n * A property which resolves the ComponentPresentation instance\n * for the current component.\n * @public\n */\n get $presentation() {\n if (this._presentation === void 0) {\n this._presentation = ComponentPresentation.forTag(this.tagName, this);\n }\n return this._presentation;\n }\n templateChanged() {\n if (this.template !== undefined) {\n this.$fastController.template = this.template;\n }\n }\n stylesChanged() {\n if (this.styles !== undefined) {\n this.$fastController.styles = this.styles;\n }\n }\n /**\n * The connected callback for this FASTElement.\n * @remarks\n * This method is invoked by the platform whenever this FoundationElement\n * becomes connected to the document.\n * @public\n */\n connectedCallback() {\n if (this.$presentation !== null) {\n this.$presentation.applyTo(this);\n }\n super.connectedCallback();\n }\n /**\n * Defines an element registry function with a set of element definition defaults.\n * @param elementDefinition - The definition of the element to create the registry\n * function for.\n * @public\n */\n static compose(elementDefinition) {\n return (overrideDefinition = {}) => new FoundationElementRegistry(this === FoundationElement\n ? class extends FoundationElement {\n }\n : this, elementDefinition, overrideDefinition);\n }\n}\n__decorate([\n observable\n], FoundationElement.prototype, \"template\", void 0);\n__decorate([\n observable\n], FoundationElement.prototype, \"styles\", void 0);\nfunction resolveOption(option, context, definition) {\n if (typeof option === \"function\") {\n return option(context, definition);\n }\n return option;\n}\n/**\n * Registry capable of defining presentation properties for a DOM Container hierarchy.\n *\n * @internal\n */\n/* eslint-disable @typescript-eslint/no-unused-vars */\nexport class FoundationElementRegistry {\n constructor(type, elementDefinition, overrideDefinition) {\n this.type = type;\n this.elementDefinition = elementDefinition;\n this.overrideDefinition = overrideDefinition;\n this.definition = Object.assign(Object.assign({}, this.elementDefinition), this.overrideDefinition);\n }\n register(container, context) {\n const definition = this.definition;\n const overrideDefinition = this.overrideDefinition;\n const prefix = definition.prefix || context.elementPrefix;\n const name = `${prefix}-${definition.baseName}`;\n context.tryDefineElement({\n name,\n type: this.type,\n baseClass: this.elementDefinition.baseClass,\n callback: x => {\n const presentation = new DefaultComponentPresentation(resolveOption(definition.template, x, definition), resolveOption(definition.styles, x, definition));\n x.definePresentation(presentation);\n let shadowOptions = resolveOption(definition.shadowOptions, x, definition);\n if (x.shadowRootMode) {\n // If the design system has overridden the shadow root mode, we need special handling.\n if (shadowOptions) {\n // If there are shadow options present in the definition, then\n // either the component itself has specified an option or the\n // registry function has overridden it.\n if (!overrideDefinition.shadowOptions) {\n // There were shadow options provided by the component and not overridden by\n // the registry.\n shadowOptions.mode = x.shadowRootMode;\n }\n }\n else if (shadowOptions !== null) {\n // If the component author did not provide shadow options,\n // and did not null them out (light dom opt-in) then they\n // were relying on the FASTElement default. So, if the\n // design system provides a mode, we need to create the options\n // to override the default.\n shadowOptions = { mode: x.shadowRootMode };\n }\n }\n x.defineElement({\n elementOptions: resolveOption(definition.elementOptions, x, definition),\n shadowOptions,\n attributes: resolveOption(definition.attributes, x, definition),\n });\n },\n });\n }\n}\n/* eslint-enable @typescript-eslint/no-unused-vars */\n","import { html, ref, when } from \"@microsoft/fast-element\";\n/**\n * The template for the {@link @microsoft/fast-foundation#Dialog} component.\n * @public\n */\nexport const dialogTemplate = (context, definition) => html `\n
\n ${when(x => x.modal, html `\n x.dismiss()}\"\n >
\n `)}\n x.modal}\"\n aria-describedby=\"${x => x.ariaDescribedby}\"\n aria-labelledby=\"${x => x.ariaLabelledby}\"\n aria-label=\"${x => x.ariaLabel}\"\n ${ref(\"dialog\")}\n >\n \n \n \n`;\n","import { canUseFocusVisible } from \"@microsoft/fast-web-utilities\";\n/**\n * The string representing the focus selector to be used. Value\n * will be \"focus-visible\" when https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo\n * is supported and \"focus\" when it is not.\n *\n * @public\n */\nexport const focusVisible = canUseFocusVisible() ? \"focus-visible\" : \"focus\";\n","/**\n * This set of exported strings reference https://developer.mozilla.org/en-US/docs/Web/Events\n * and should include all non-deprecated and non-experimental Standard events\n */\nexport const eventAbort = \"abort\";\nexport const eventAfterPrint = \"afterprint\";\nexport const eventAnimationCancel = \"animationcancel\";\nexport const eventAnimationEnd = \"animationend\";\nexport const eventAnimationIteration = \"animationiteration\";\nexport const eventAnimationStart = \"animationstart\";\nexport const eventAppInstalled = \"appinstalled\";\nexport const eventBeforePrint = \"beforeprint\";\nexport const eventBeforeUnload = \"beforeunload\";\nexport const eventBeginEvent = \"beginEvent\";\nexport const eventBlocked = \"blocked\";\nexport const eventBlur = \"blur\";\nexport const eventCanPlay = \"canplay\";\nexport const eventCanPlayThrough = \"canplaythrough\";\nexport const eventChange = \"change\";\nexport const eventChargingChange = \"chargingchange\";\nexport const eventChargingTimeChange = \"chargingtimechange\";\nexport const eventClick = \"click\";\nexport const eventClose = \"close\";\nexport const eventComplete = \"complete\";\nexport const eventCompositionEnd = \"compositionend\";\nexport const eventCompositionStart = \"compositionstart\";\nexport const eventCompositionUpdate = \"compositionupdate\";\nexport const eventContextMenu = \"contextmenu\";\nexport const eventCopy = \"copy\";\nexport const eventCut = \"cut\";\nexport const eventDblClick = \"dblclick\";\nexport const eventDeviceChange = \"devicechange\";\nexport const eventDeviceMotion = \"devicemotion\";\nexport const eventDeviceOrientation = \"deviceorientation\";\nexport const eventDischargingTimeChange = \"dischargingtimechange\";\nexport const eventDrag = \"drag\";\nexport const eventDragEnd = \"dragend\";\nexport const eventDragEnter = \"dragenter\";\nexport const eventDragLeave = \"dragleave\";\nexport const eventDragOver = \"dragover\";\nexport const eventDragStart = \"dragstart\";\nexport const eventDrop = \"drop\";\nexport const eventDurationChange = \"durationchange\";\nexport const eventEmptied = \"emptied\";\nexport const eventEnded = \"ended\";\nexport const eventEndEvent = \"endevent\";\nexport const eventError = \"error\";\nexport const eventFocus = \"focus\";\nexport const eventFocusIn = \"focusin\";\nexport const eventFocusOut = \"focusout\";\nexport const eventFullScreenChange = \"fullscreenchange\";\nexport const eventFullScreenError = \"fullscreenerror\";\nexport const eventGamePadConnected = \"gamepadconnected\";\nexport const eventGamePadDisconnected = \"gamepaddisconnected\";\nexport const eventGotPointerCapture = \"gotpointercapture\";\nexport const eventHashChange = \"hashchange\";\nexport const eventLostPointerCapture = \"lostpointercapture\";\nexport const eventInput = \"input\";\nexport const eventInvalid = \"invalid\";\nexport const eventKeyDown = \"keydown\";\nexport const eventKeyUp = \"keyup\";\nexport const eventLevelChange = \"levelchange\";\nexport const eventLoad = \"load\";\nexport const eventLoadedData = \"loadeddata\";\nexport const eventLoadedMetaData = \"loadedmetadata\";\nexport const eventLoadEnd = \"loadend\";\nexport const eventLoadStart = \"loadstart\";\nexport const eventMessage = \"message\";\nexport const eventMessageError = \"messageerror\";\nexport const eventMouseDown = \"mousedown\";\nexport const eventMouseEnter = \"mouseenter\";\nexport const eventMouseLeave = \"mouseleave\";\nexport const eventMouseMove = \"mousemove\";\nexport const eventMouseOut = \"mouseout\";\nexport const eventMouseOver = \"mouseover\";\nexport const eventMouseUp = \"mouseup\";\nexport const eventNotificationClick = \"notificationclick\";\nexport const eventOffline = \"offline\";\nexport const eventOnline = \"online\";\nexport const eventOpen = \"open\";\nexport const eventOrientationChange = \"orientationchange\";\nexport const eventPageHide = \"pagehide\";\nexport const eventPageShow = \"pageshow\";\nexport const eventPaste = \"paste\";\nexport const eventPause = \"pause\";\nexport const eventPointerCancel = \"pointercancel\";\nexport const eventPointerDown = \"pointerdown\";\nexport const eventPointerEnter = \"pointerenter\";\nexport const eventPointerLeave = \"pointerleave\";\nexport const eventPointerLockChange = \"pointerlockchange\";\nexport const eventPointerLockError = \"pointerlockerror\";\nexport const eventPointerMove = \"pointermove\";\nexport const eventPointerOut = \"pointerout\";\nexport const eventPointerOver = \"pointerover\";\nexport const eventPointerUp = \"pointerup\";\nexport const eventPlay = \"play\";\nexport const eventPlaying = \"playing\";\nexport const eventPopState = \"popstate\";\nexport const eventProgress = \"progress\";\nexport const eventPush = \"push\";\nexport const eventPushSubscriptionChange = \"pushsubscriptionchange\";\nexport const eventRateChange = \"ratechange\";\nexport const eventReadyStateChange = \"readystatechange\";\nexport const eventRepeatEvent = \"repeatevent\";\nexport const eventReset = \"reset\";\nexport const eventResize = \"resize\";\nexport const eventResourceTimingBufferFull = \"resourcetimingbufferfull\";\nexport const eventScroll = \"scroll\";\nexport const eventSeeked = \"seeked\";\nexport const eventSeeking = \"seeking\";\nexport const eventSelect = \"select\";\nexport const eventShow = \"show\";\nexport const eventSlotChange = \"slotchange\";\nexport const eventStalled = \"stalled\";\nexport const eventStart = \"start\";\nexport const eventStorage = \"storage\";\nexport const eventSubmit = \"submit\";\nexport const eventSuccess = \"success\";\nexport const eventSuspend = \"suspend\";\nexport const eventSVGAbort = \"SVGAbort\";\nexport const eventSVGError = \"SVGError\";\nexport const eventSVGLoad = \"SVGLoad\";\nexport const eventSVGResize = \"SVGResize\";\nexport const eventSVGScroll = \"SVGScroll\";\nexport const eventSVGUnload = \"SVGUnload\";\nexport const eventSVGZoom = \"SVGZoom\";\nexport const eventTimeOut = \"timeout\";\nexport const eventTimeUpdate = \"timeupdate\";\nexport const eventTouchCancel = \"touchcancel\";\nexport const eventTouchEnd = \"touchend\";\nexport const eventTouchMove = \"touchmove\";\nexport const eventTouchStart = \"touchstart\";\nexport const eventTransitionEnd = \"transitionend\";\nexport const eventUnload = \"unload\";\nexport const eventUpgradeNeeded = \"upgradeneeded\";\nexport const eventUserProximity = \"userproximity\";\nexport const eventVersionChange = \"versionchange\";\nexport const eventVisibilityChange = \"visibilitychange\";\nexport const eventVolumeChange = \"volumechange\";\nexport const eventWaiting = \"waiting\";\nexport const eventWheel = \"wheel\";\n","import { html } from \"@microsoft/fast-element\";\n/**\n * The template for the {@link @microsoft/fast-foundation#TabPanel} component.\n * @public\n */\nexport const tabPanelTemplate = (context, definition) => html `\n \n \n \n`;\n","import { html, slotted } from \"@microsoft/fast-element\";\n/**\n * The template for the {@link @microsoft/fast-foundation#Menu} component.\n * @public\n */\nexport const menuTemplate = (context, definition) => html `\n (x.slot ? x.slot : x.isNestedMenu() ? \"submenu\" : void 0)}\"\n role=\"menu\"\n @keydown=\"${(x, c) => x.handleMenuKeyDown(c.event)}\"\n @focusout=\"${(x, c) => x.handleFocusOut(c.event)}\"\n >\n \n \n`;\n","/**\n * Menu items roles.\n * @public\n */\nexport var MenuItemRole;\n(function (MenuItemRole) {\n /**\n * The menu item has a \"menuitem\" role\n */\n MenuItemRole[\"menuitem\"] = \"menuitem\";\n /**\n * The menu item has a \"menuitemcheckbox\" role\n */\n MenuItemRole[\"menuitemcheckbox\"] = \"menuitemcheckbox\";\n /**\n * The menu item has a \"menuitemradio\" role\n */\n MenuItemRole[\"menuitemradio\"] = \"menuitemradio\";\n})(MenuItemRole || (MenuItemRole = {}));\n/**\n * @internal\n */\nexport const roleForMenuItem = {\n [MenuItemRole.menuitem]: \"menuitem\",\n [MenuItemRole.menuitemcheckbox]: \"menuitemcheckbox\",\n [MenuItemRole.menuitemradio]: \"menuitemradio\",\n};\n","export var Orientation;\n(function (Orientation) {\n Orientation[\"horizontal\"] = \"horizontal\";\n Orientation[\"vertical\"] = \"vertical\";\n})(Orientation || (Orientation = {}));\n","/**\n * Apply mixins to a constructor.\n * Sourced from {@link https://www.typescriptlang.org/docs/handbook/mixins.html | TypeScript Documentation }.\n * @public\n */\nexport function applyMixins(derivedCtor, ...baseCtors) {\n baseCtors.forEach(baseCtor => {\n Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {\n if (name !== \"constructor\") {\n Object.defineProperty(derivedCtor.prototype, name, \n /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */\n Object.getOwnPropertyDescriptor(baseCtor.prototype, name));\n }\n });\n if (baseCtor.attributes) {\n const existing = derivedCtor.attributes || [];\n derivedCtor.attributes = existing.concat(baseCtor.attributes);\n }\n });\n}\n","/**\n * Expose ltr and rtl strings\n */\nexport var Direction;\n(function (Direction) {\n Direction[\"ltr\"] = \"ltr\";\n Direction[\"rtl\"] = \"rtl\";\n})(Direction || (Direction = {}));\n","import { elements, html, slotted } from \"@microsoft/fast-element\";\nimport { Orientation } from \"@microsoft/fast-web-utilities\";\n/**\n * The template for the {@link @microsoft/fast-foundation#RadioGroup} component.\n * @public\n */\nexport const radioGroupTemplate = (context, definition) => html `\n x.disabled}\"\n aria-readonly=\"${x => x.readOnly}\"\n @click=\"${(x, c) => x.clickHandler(c.event)}\"\n @keydown=\"${(x, c) => x.keydownHandler(c.event)}\"\n @focusout=\"${(x, c) => x.focusOutHandler(c.event)}\"\n >\n \n x.orientation === Orientation.horizontal ? \"horizontal\" : \"vertical\"}\"\n part=\"positioning-region\"\n >\n \n \n \n`;\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","/**\n * Text field sub-types\n * @public\n */\nexport var TextFieldType;\n(function (TextFieldType) {\n /**\n * An email TextField\n */\n TextFieldType[\"email\"] = \"email\";\n /**\n * A password TextField\n */\n TextFieldType[\"password\"] = \"password\";\n /**\n * A telephone TextField\n */\n TextFieldType[\"tel\"] = \"tel\";\n /**\n * A text TextField\n */\n TextFieldType[\"text\"] = \"text\";\n /**\n * A URL TextField\n */\n TextFieldType[\"url\"] = \"url\";\n})(TextFieldType || (TextFieldType = {}));\n","import { FormAssociated } from \"../form-associated/form-associated\";\nimport { FoundationElement } from \"../foundation-element\";\nclass _TextField extends FoundationElement {\n}\n/**\n * A form-associated base class for the {@link @microsoft/fast-foundation#(TextField:class)} component.\n *\n * @internal\n */\nexport class FormAssociatedTextField extends FormAssociated(_TextField) {\n constructor() {\n super(...arguments);\n this.proxy = document.createElement(\"input\");\n }\n}\n","import { __decorate } from \"tslib\";\nimport { attr, DOM, nullableNumberConverter, observable } from \"@microsoft/fast-element\";\nimport { ARIAGlobalStatesAndProperties, StartEnd, } from \"../patterns/index\";\nimport { applyMixins } from \"../utilities/index\";\nimport { FormAssociatedTextField } from \"./text-field.form-associated\";\nimport { TextFieldType } from \"./text-field.options\";\nexport { TextFieldType };\n/**\n * A Text Field Custom HTML Element.\n * Based largely on the {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/text | element }.\n *\n * @public\n */\nexport class TextField extends FormAssociatedTextField {\n constructor() {\n super(...arguments);\n /**\n * Allows setting a type or mode of text.\n * @public\n * @remarks\n * HTML Attribute: type\n */\n this.type = TextFieldType.text;\n }\n readOnlyChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.readOnly = this.readOnly;\n this.validate();\n }\n }\n autofocusChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.autofocus = this.autofocus;\n this.validate();\n }\n }\n placeholderChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.placeholder = this.placeholder;\n }\n }\n typeChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.type = this.type;\n this.validate();\n }\n }\n listChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.setAttribute(\"list\", this.list);\n this.validate();\n }\n }\n maxlengthChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.maxLength = this.maxlength;\n this.validate();\n }\n }\n minlengthChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.minLength = this.minlength;\n this.validate();\n }\n }\n patternChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.pattern = this.pattern;\n this.validate();\n }\n }\n sizeChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.size = this.size;\n }\n }\n spellcheckChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.spellcheck = this.spellcheck;\n }\n }\n /**\n * @internal\n */\n connectedCallback() {\n super.connectedCallback();\n this.proxy.setAttribute(\"type\", this.type);\n this.validate();\n if (this.autofocus) {\n DOM.queueUpdate(() => {\n this.focus();\n });\n }\n }\n /**\n * Handles the internal control's `input` event\n * @internal\n */\n handleTextInput() {\n this.value = this.control.value;\n }\n /**\n * Change event handler for inner control.\n * @remarks\n * \"Change\" events are not `composable` so they will not\n * permeate the shadow DOM boundary. This fn effectively proxies\n * the change event, emitting a `change` event whenever the internal\n * control emits a `change` event\n * @internal\n */\n handleChange() {\n this.$emit(\"change\");\n }\n}\n__decorate([\n attr({ attribute: \"readonly\", mode: \"boolean\" })\n], TextField.prototype, \"readOnly\", void 0);\n__decorate([\n attr({ mode: \"boolean\" })\n], TextField.prototype, \"autofocus\", void 0);\n__decorate([\n attr\n], TextField.prototype, \"placeholder\", void 0);\n__decorate([\n attr\n], TextField.prototype, \"type\", void 0);\n__decorate([\n attr\n], TextField.prototype, \"list\", void 0);\n__decorate([\n attr({ converter: nullableNumberConverter })\n], TextField.prototype, \"maxlength\", void 0);\n__decorate([\n attr({ converter: nullableNumberConverter })\n], TextField.prototype, \"minlength\", void 0);\n__decorate([\n attr\n], TextField.prototype, \"pattern\", void 0);\n__decorate([\n attr({ converter: nullableNumberConverter })\n], TextField.prototype, \"size\", void 0);\n__decorate([\n attr({ mode: \"boolean\" })\n], TextField.prototype, \"spellcheck\", void 0);\n__decorate([\n observable\n], TextField.prototype, \"defaultSlottedNodes\", void 0);\n/**\n * Includes ARIA states and properties relating to the ARIA textbox role\n *\n * @public\n */\nexport class DelegatesARIATextbox {\n}\napplyMixins(DelegatesARIATextbox, ARIAGlobalStatesAndProperties);\napplyMixins(TextField, StartEnd, DelegatesARIATextbox);\n","import { CheckableFormAssociated } from \"../form-associated/form-associated\";\nimport { FoundationElement } from \"../foundation-element\";\nclass _Radio extends FoundationElement {\n}\n/**\n * A form-associated base class for the {@link @microsoft/fast-foundation#(Radio:class)} component.\n *\n * @internal\n */\nexport class FormAssociatedRadio extends CheckableFormAssociated(_Radio) {\n constructor() {\n super(...arguments);\n this.proxy = document.createElement(\"input\");\n }\n}\n","import { __decorate } from \"tslib\";\nimport { attr, observable } from \"@microsoft/fast-element\";\nimport { keySpace } from \"@microsoft/fast-web-utilities\";\nimport { FormAssociatedRadio } from \"./radio.form-associated\";\n/**\n * A Radio Custom HTML Element.\n * Implements the {@link https://www.w3.org/TR/wai-aria-1.1/#radio | ARIA radio }.\n *\n * @public\n */\nexport class Radio extends FormAssociatedRadio {\n constructor() {\n super();\n /**\n * The element's value to be included in form submission when checked.\n * Default to \"on\" to reach parity with input[type=\"radio\"]\n *\n * @internal\n */\n this.initialValue = \"on\";\n /**\n * @internal\n */\n this.keypressHandler = (e) => {\n switch (e.key) {\n case keySpace:\n if (!this.checked && !this.readOnly) {\n this.checked = true;\n }\n return;\n }\n return true;\n };\n this.proxy.setAttribute(\"type\", \"radio\");\n }\n readOnlyChanged() {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.readOnly = this.readOnly;\n }\n }\n /**\n * @internal\n */\n defaultCheckedChanged() {\n var _a;\n if (this.$fastController.isConnected && !this.dirtyChecked) {\n // Setting this.checked will cause us to enter a dirty state,\n // but if we are clean when defaultChecked is changed, we want to stay\n // in a clean state, so reset this.dirtyChecked\n if (!this.isInsideRadioGroup()) {\n this.checked = (_a = this.defaultChecked) !== null && _a !== void 0 ? _a : false;\n this.dirtyChecked = false;\n }\n }\n }\n /**\n * @internal\n */\n connectedCallback() {\n var _a, _b;\n super.connectedCallback();\n this.validate();\n if (((_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.getAttribute(\"role\")) !== \"radiogroup\" &&\n this.getAttribute(\"tabindex\") === null) {\n if (!this.disabled) {\n this.setAttribute(\"tabindex\", \"0\");\n }\n }\n if (this.checkedAttribute) {\n if (!this.dirtyChecked) {\n // Setting this.checked will cause us to enter a dirty state,\n // but if we are clean when defaultChecked is changed, we want to stay\n // in a clean state, so reset this.dirtyChecked\n if (!this.isInsideRadioGroup()) {\n this.checked = (_b = this.defaultChecked) !== null && _b !== void 0 ? _b : false;\n this.dirtyChecked = false;\n }\n }\n }\n }\n isInsideRadioGroup() {\n const parent = this.closest(\"[role=radiogroup]\");\n return parent !== null;\n }\n /**\n * @internal\n */\n clickHandler(e) {\n if (!this.disabled && !this.readOnly && !this.checked) {\n this.checked = true;\n }\n }\n}\n__decorate([\n attr({ attribute: \"readonly\", mode: \"boolean\" })\n], Radio.prototype, \"readOnly\", void 0);\n__decorate([\n observable\n], Radio.prototype, \"name\", void 0);\n__decorate([\n observable\n], Radio.prototype, \"defaultSlottedNodes\", void 0);\n","import { composedParent } from \"./composed-parent\";\n/**\n * Determines if the reference element contains the test element in a \"composed\" DOM tree that\n * ignores shadow DOM boundaries.\n *\n * Returns true of the test element is a descendent of the reference, or exist in\n * a shadow DOM that is a logical descendent of the reference. Otherwise returns false.\n * @param reference - The element to test for containment against.\n * @param test - The element being tested for containment.\n *\n * @public\n */\nexport function composedContains(reference, test) {\n let current = test;\n while (current !== null) {\n if (current === reference) {\n return true;\n }\n current = composedParent(current);\n }\n return false;\n}\n","import { html, ref, slotted } from \"@microsoft/fast-element\";\nimport { endSlotTemplate, startSlotTemplate } from \"../patterns\";\nimport { whitespaceFilter } from \"../utilities\";\n/**\n * The template for the {@link @microsoft/fast-foundation#(TextField:class)} component.\n * @public\n */\nexport const textFieldTemplate = (context, definition) => html `\n (x.readOnly ? \"readonly\" : \"\")}\n \"\n >\n x.defaultSlottedNodes && x.defaultSlottedNodes.length\n ? \"label\"\n : \"label label__hidden\"}\"\n >\n \n \n
\n \n`;\n","import { __decorate } from \"tslib\";\nimport { attr } from \"@microsoft/fast-element\";\nimport { FoundationElement } from \"../foundation-element\";\n/**\n * A Tab Component to be used with {@link @microsoft/fast-foundation#(Tabs:class)}\n * @public\n */\nexport class Tab extends FoundationElement {\n}\n__decorate([\n attr({ mode: \"boolean\" })\n], Tab.prototype, \"disabled\", void 0);\n"],"sourceRoot":""}