npm - @ukic/web-components - Versions diffs - 2.1.0-beta.11 → 2.1.0-beta.12 - Mend

@ukic/web-components 2.1.0-beta.11 → 2.1.0-beta.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (443) hide show

package/dist/components/ic-popover-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-popover-menu.js","mappings":"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","names":[],"sources":["./src/components/ic-popover-menu/ic-popover-menu.css?tag=ic-popover-menu&encapsulation=shadow","./src/components/ic-popover-menu/ic-popover-menu.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n/** \n* @prop --ic-z-index-popover: z-index of popover menu. \n* @prop --max-height: Maximum height of the popover menu.\n* @prop --popover-width: Default width of the popover menu.\n/\n\n@media (prefers-reduced-motion: no-preference) {\n :host .opening-from-parent {\n animation: slide-in var(--ic-transition-duration-slow) ease-in-out;\n }\n\n :host .opening-from-child {\n animation: slide-out var(--ic-transition-duration-slow) ease-in-out;\n }\n}\n\n:host {\n border-radius: var(--ic-border-radius);\n color: var(--ic-color-primary-text);\n background-color: var(--ic-architectural-white);\n position: relative;\n z-index: var(--ic-z-index-popover);\n box-sizing: border-box;\n box-shadow: var(--ic-elevation-overlay);\n display: none;\n}\n\n.menu {\n border: 0.063rem solid var(--ic-architectural-400);\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-architectural-white);\n visibility: hidden;\n height: 0;\n}\n\n.button {\n text-decoration: none;\n list-style-type: none;\n}\n\n:host(:focus-within) {\n box-shadow: var(--ic-border-focus);\n}\n\n.menu:focus-visible {\n outline: none;\n}\n\n:host(.open) {\n display: block;\n min-width: calc(20rem - var(--ic-space-xl));\n width: var(--popover-width, 20rem);\n max-width: calc(100vw - var(--ic-space-xl));\n}\n\n:host(.open) .menu {\n visibility: visible;\n height: fit-content;\n max-height: var(--max-height, fit-content);\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n.parent-label {\n color: var(--ic-color-tertiary-text);\n margin: var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n@keyframes slide-in {\n from {\n opacity: 0;\n transform: translateX(10rem);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes slide-out {\n from {\n opacity: 0;\n transform: translateX(-10rem);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n","import {\n Component,\n Element,\n Host,\n h,\n Prop,\n Listen,\n Watch,\n State,\n Method,\n} from \"@stencil/core\";\nimport { getSlotElements } from \"../../utils/helpers\";\nimport { createPopper } from \"@popperjs/core\";\n\n@Component({\n tag: \"ic-popover-menu\",\n styleUrl: \"ic-popover-menu.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class PopoverMenu {\n @Element() host: HTMLIcPopoverMenuElement;\n\n /\n The ID of the element the popover menu will anchor itself to. This is required unless the popover is a submenu.\n /\n @Prop() anchor: string;\n\n /\n The unique identifier for a popover submenu.\n /\n @Prop() submenuId?: string;\n\n /\n If `true`, the popover menu will be displayed.\n /\n @Prop({ reflect: true, mutable: true }) open: boolean = undefined;\n\n /\n @internal The parent popover menu of a child popover menu.\n /\n @Prop() parentPopover?: HTMLIcPopoverMenuElement;\n\n /\n @internal The level of menu being displayed.\n /\n @Prop() submenuLevel: number = 1;\n\n /\n @internal The parent popover menu of a child popover menu.\n /\n @Prop() parentLabel?: string;\n\n @State() openingFromChild: boolean = false;\n\n @State() openingFromParent: boolean = false;\n\n @Listen(\"handleMenuItemClick\")\n handleMenuItemClick(ev: CustomEvent): void {\n if (!ev.detail.hasSubMenu && ev.detail.label !== \"Back\") {\n this.closeMenu();\n }\n }\n\n // This is listening for the event emitted when a menu item is acting as a trigger button\n @Listen(\"triggerPopoverMenuInstance\", { capture: true })\n handleSubmenuChange(ev: Event): void {\n // Finds the trigger menu item that has emitted the event\n const target = ev.target as HTMLIcMenuItemElement;\n this.open = false;\n\n // Find the popover menu that the menu item triggers (i.e. submenu-trigger-for === submenu-id).\n const childEl = document.querySelector(\n `ic-popover-menu[submenu-id=${target.submenuTriggerFor}]`\n ) as HTMLIcPopoverMenuElement;\n // Set the parent popover menu of the submenu and open the submenu\n childEl.parentPopover = this.host;\n childEl.anchor = this.anchor;\n childEl.ariaLabel = this.host.getAttribute(\"aria-label\");\n childEl.openFromParent();\n childEl.submenuLevel = this.submenuLevel + 1;\n // Set the label in the submenu using the label of the menu item that has emitted the event\n childEl.parentLabel = target.label;\n }\n\n @Watch(\"open\")\n watchOpenHandler(): void {\n if (this.open) {\n if (\n this.parentPopover !== undefined &&\n !this.popoverMenuEls.some((menuItem) => menuItem.id)\n ) {\n this.popoverMenuEls.unshift(this.backButton);\n }\n\n this.currentFocus = this.submenuId !== undefined ? 1 : 0;\n // Needed so that anchorEl isn't always focused\n setTimeout(this.setButtonFocus, 50);\n }\n }\n\n private setButtonFocus = () => {\n this.popoverMenuEls[this.currentFocus]?.focus();\n };\n\n private popoverMenuEls: HTMLIcMenuItemElement[] = [];\n private anchorEl: HTMLElement;\n private currentFocus: number;\n private backButton: HTMLIcMenuItemElement;\n\n // Checks that the popover menu has an anchor\n private findAnchorEl = (anchor: string): HTMLElement => {\n let anchorElement: HTMLElement = null;\n if (anchor === null \|\| anchor === undefined) {\n this.submenuId === undefined &&\n console.error(\"No anchor specified for popover component\");\n } else {\n anchorElement = document.querySelector(\n anchor.indexOf(\"#\") === 0 ? anchor : \"#\" + anchor\n );\n if (anchorElement === null) {\n console.error(`Popover anchor element '${anchor}' not found`);\n }\n }\n return anchorElement;\n };\n\n @Listen(\"click\", { target: \"document\" })\n handleClick(ev: Event): void {\n ev.preventDefault();\n if (this.open && this.isNotPopoverMenuEl(ev)) {\n // If menu is open and the next click on the document is not a popover El, close the popover\n this.closeMenu();\n }\n }\n\n /\n @internal Opens the menu from the child menu.\n /\n @Method()\n async openFromChild(): Promise<void> {\n this.open = true;\n this.openingFromChild = true;\n\n setTimeout(() => (this.openingFromChild = false), 1000);\n }\n\n /\n @internal Opens the menu from the parent menu.\n */\n @Method()\n async openFromParent(): Promise<void> {\n this.open = true;\n this.openingFromParent = true;\n\n setTimeout(() => (this.openingFromParent = false), 1000);\n }\n\n private isNotPopoverMenuEl = (ev: Event) => {\n const target = ev.target as HTMLElement;\n return (\n target.id !== this.anchor &&\n target.tagName !== \"IC-MENU-ITEM\" &&\n target.tagName !== \"IC-MENU-GROUP\" &&\n target.tagName !== \"IC-POPOVER-MENU\"\n );\n };\n\n private closeMenu = () => {\n this.open = false;\n this.anchorEl.focus();\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numButtons = this.popoverMenuEls.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n // Check if wrap around necessary\n if (nextItem < 0) {\n nextItem = numButtons;\n } else if (nextItem > numButtons) {\n nextItem = 0;\n }\n\n return nextItem;\n };\n\n // Manages the keyboard navigation in the popover menu\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyDown(ev: KeyboardEvent): void {\n switch (ev.key) {\n case \"ArrowDown\":\n ev.preventDefault();\n this.currentFocus = this.getNextItemToSelect(this.currentFocus, true);\n this.setButtonFocus();\n break;\n case \"ArrowUp\":\n ev.preventDefault();\n this.currentFocus = this.getNextItemToSelect(this.currentFocus, false);\n this.setButtonFocus();\n break;\n case \"Home\":\n //Sets home focus as first element, or back button\n this.currentFocus = 0;\n this.setButtonFocus();\n break;\n case \"End\":\n //Sets end focus as last element\n this.currentFocus = this.popoverMenuEls.length - 1;\n this.setButtonFocus();\n break;\n case \"Escape\":\n case \"Tab\":\n this.closeMenu();\n this.host.blur();\n break;\n }\n }\n\n private addMenuItems = (elements: Element[] \| NodeListOf<ChildNode>) => {\n for (let i = 0; i < elements.length; i++) {\n const el = elements[i] as HTMLIcMenuItemElement;\n if (el.tagName === \"IC-MENU-ITEM\") {\n this.popoverMenuEls.push(el);\n } else if (el.tagName === \"IC-MENU-GROUP\") {\n const groupSlotWrapper = el.shadowRoot.querySelector(\"ul\");\n const menuGroupElements = getSlotElements(groupSlotWrapper);\n\n this.addMenuItems(menuGroupElements);\n }\n }\n };\n\n private getMenuAriaLabel = (): string => {\n const ariaLabel = this.host.getAttribute(\"aria-label\");\n\n if (this.submenuId !== undefined) {\n return `${ariaLabel}, within nested level ${this.submenuLevel} ${this.parentLabel} submenu,`;\n } else {\n return ariaLabel;\n }\n };\n\n private handleBackButtonClick = (): void => {\n this.parentPopover.openFromChild();\n this.open = false;\n };\n\n componentDidRender(): void {\n if (this.open) {\n createPopper(this.anchorEl, this.host, {\n placement: \"bottom-start\",\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 4],\n },\n },\n ],\n });\n }\n }\n\n componentWillRender(): void {\n this.anchorEl = this.findAnchorEl(this.anchor);\n }\n\n componentDidLoad(): void {\n const slotWrapper = this.host.shadowRoot.querySelector(\"ul.button\");\n const popoverMenuElements = getSlotElements(slotWrapper);\n\n if (popoverMenuElements !== null) {\n this.addMenuItems(popoverMenuElements);\n }\n\n if (\n this.submenuId === undefined &&\n this.host.getAttribute(\"aria-label\") === null\n ) {\n console.error(\n `No aria-label specified for popover menu component - aria-label required`\n );\n }\n }\n\n render() {\n return (\n <Host\n class={{\n open: this.open,\n }}\n >\n <div\n id={\n this.parentPopover === undefined\n ? `ic-popover-submenu-${this.submenuId}`\n : \"\"\n }\n class={{\n menu: true,\n }}\n tabindex={open ? \"0\" : \"-1\"}\n >\n <div\n class={{\n \"opening-from-parent\": this.openingFromParent,\n \"opening-from-child\": this.openingFromChild,\n }}\n >\n {this.submenuId !== undefined && (\n <div>\n <ic-menu-item\n class=\"ic-popover-submenu-back-button\"\n ref={(el) => (this.backButton = el)}\n label=\"Back\"\n onClick={this.handleBackButtonClick}\n id={`ic-popover-submenu-back-button-${this.submenuLevel}`}\n >\n <svg\n slot=\"icon\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"submenu-back-icon\"\n >\n <path\n d=\"M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-menu-item>\n <ic-typography variant=\"subtitle-small\" class=\"parent-label\">\n {this.parentLabel}\n </ic-typography>\n </div>\n )}\n <ul\n class=\"button\"\n aria-label={this.getMenuAriaLabel()}\n role=\"menu\"\n aria-owns={\n this.submenuId !== undefined\n ? `ic-popover-submenu-back-button-${this.submenuLevel}`\n : false\n }\n aria-controls={\n this.submenuId !== undefined\n ? `ic-popover-submenu-back-button-${this.submenuLevel}`\n : false\n }\n >\n <slot></slot>\n </ul>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-popover-menu.js","mappings":"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","names":[],"sources":["./src/components/ic-popover-menu/ic-popover-menu.css?tag=ic-popover-menu&encapsulation=shadow","./src/components/ic-popover-menu/ic-popover-menu.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n/** \n* @prop --ic-z-index-popover: z-index of popover menu. \n* @prop --max-height: Maximum height of the popover menu.\n* @prop --popover-width: Default width of the popover menu.\n/\n\n@media (prefers-reduced-motion: no-preference) {\n :host .opening-from-parent {\n animation: slide-in var(--ic-transition-duration-slow) ease-in-out;\n }\n\n :host .opening-from-child {\n animation: slide-out var(--ic-transition-duration-slow) ease-in-out;\n }\n}\n\n:host {\n border-radius: var(--ic-border-radius);\n color: var(--ic-color-primary-text);\n background-color: var(--ic-architectural-white);\n position: relative;\n z-index: var(--ic-z-index-popover);\n box-sizing: border-box;\n box-shadow: var(--ic-elevation-overlay);\n display: none;\n}\n\n.menu {\n border: 0.063rem solid var(--ic-architectural-400);\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-architectural-white);\n visibility: hidden;\n height: 0;\n}\n\n.button {\n text-decoration: none;\n list-style-type: none;\n}\n\n:host(:focus-within) {\n box-shadow: var(--ic-border-focus);\n}\n\n.menu:focus-visible {\n outline: none;\n}\n\n:host(.open) {\n display: block;\n min-width: calc(20rem - var(--ic-space-xl));\n width: var(--popover-width, 20rem);\n max-width: calc(100vw - var(--ic-space-xl));\n}\n\n:host(.open) .menu {\n visibility: visible;\n height: fit-content;\n max-height: var(--max-height, fit-content);\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n.parent-label {\n color: var(--ic-color-tertiary-text);\n margin: var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n@keyframes slide-in {\n from {\n opacity: 0;\n transform: translateX(10rem);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes slide-out {\n from {\n opacity: 0;\n transform: translateX(-10rem);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n","import {\n Component,\n Element,\n Host,\n h,\n Prop,\n Listen,\n Watch,\n State,\n Method,\n} from \"@stencil/core\";\nimport { getSlotElements } from \"../../utils/helpers\";\nimport { createPopper } from \"@popperjs/core\";\n\n@Component({\n tag: \"ic-popover-menu\",\n styleUrl: \"ic-popover-menu.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class PopoverMenu {\n @Element() host: HTMLIcPopoverMenuElement;\n\n /\n The ID of the element the popover menu will anchor itself to. This is required unless the popover is a submenu.\n /\n @Prop() anchor: string;\n\n /\n The unique identifier for a popover submenu.\n /\n @Prop() submenuId?: string;\n\n /\n If `true`, the popover menu will be displayed.\n /\n @Prop({ reflect: true, mutable: true }) open: boolean = undefined;\n\n /\n @internal The parent popover menu of a child popover menu.\n /\n @Prop() parentPopover?: HTMLIcPopoverMenuElement;\n\n /\n @internal The level of menu being displayed.\n /\n @Prop() submenuLevel: number = 1;\n\n /\n @internal The parent popover menu of a child popover menu.\n /\n @Prop() parentLabel?: string;\n\n @State() openingFromChild: boolean = false;\n\n @State() openingFromParent: boolean = false;\n\n @Listen(\"handleMenuItemClick\")\n handleMenuItemClick(ev: CustomEvent): void {\n if (!ev.detail.hasSubMenu && ev.detail.label !== \"Back\") {\n this.closeMenu();\n }\n }\n\n // This is listening for the event emitted when a menu item is acting as a trigger button\n @Listen(\"triggerPopoverMenuInstance\", { capture: true })\n handleSubmenuChange(ev: Event): void {\n // Finds the trigger menu item that has emitted the event\n const target = ev.target as HTMLIcMenuItemElement;\n this.open = false;\n\n // Find the popover menu that the menu item triggers (i.e. submenu-trigger-for === submenu-id).\n const childEl = document.querySelector(\n `ic-popover-menu[submenu-id=${target.submenuTriggerFor}]`\n ) as HTMLIcPopoverMenuElement;\n // Set the parent popover menu of the submenu and open the submenu\n childEl.parentPopover = this.host;\n childEl.anchor = this.anchor;\n childEl.ariaLabel = this.host.getAttribute(\"aria-label\");\n childEl.openFromParent();\n childEl.submenuLevel = this.submenuLevel + 1;\n // Set the label in the submenu using the label of the menu item that has emitted the event\n childEl.parentLabel = target.label;\n }\n\n @Watch(\"open\")\n watchOpenHandler(): void {\n if (this.open) {\n if (\n this.parentPopover !== undefined &&\n !this.popoverMenuEls.some((menuItem) => menuItem.id)\n ) {\n this.popoverMenuEls.unshift(this.backButton);\n }\n\n this.currentFocus = this.submenuId !== undefined ? 1 : 0;\n // Needed so that anchorEl isn't always focused\n setTimeout(this.setButtonFocus, 50);\n }\n }\n\n private setButtonFocus = () => {\n this.popoverMenuEls[this.currentFocus]?.focus();\n };\n\n private popoverMenuEls: HTMLIcMenuItemElement[] = [];\n private anchorEl: HTMLElement;\n private currentFocus: number;\n private backButton: HTMLIcMenuItemElement;\n\n // Checks that the popover menu has an anchor\n private findAnchorEl = (anchor: string): HTMLElement => {\n let anchorElement: HTMLElement = null;\n if (anchor === null \|\| anchor === undefined) {\n this.submenuId === undefined &&\n console.error(\"No anchor specified for popover component\");\n } else {\n anchorElement = document.querySelector(\n anchor.indexOf(\"#\") === 0 ? anchor : \"#\" + anchor\n );\n if (anchorElement === null) {\n console.error(`Popover anchor element '${anchor}' not found`);\n }\n }\n return anchorElement;\n };\n\n @Listen(\"click\", { target: \"document\" })\n handleClick(ev: Event): void {\n ev.preventDefault();\n if (this.open && this.isNotPopoverMenuEl(ev)) {\n // If menu is open and the next click on the document is not a popover El, close the popover\n this.closeMenu();\n }\n }\n\n /\n @internal Opens the menu from the child menu.\n /\n @Method()\n async openFromChild(): Promise<void> {\n this.open = true;\n this.openingFromChild = true;\n\n setTimeout(() => (this.openingFromChild = false), 1000);\n }\n\n /\n @internal Opens the menu from the parent menu.\n */\n @Method()\n async openFromParent(): Promise<void> {\n this.open = true;\n this.openingFromParent = true;\n\n setTimeout(() => (this.openingFromParent = false), 1000);\n }\n\n private isNotPopoverMenuEl = (ev: Event) => {\n const target = ev.target as HTMLElement;\n return (\n target.id !== this.anchor &&\n target.tagName !== \"IC-MENU-ITEM\" &&\n target.tagName !== \"IC-MENU-GROUP\" &&\n target.tagName !== \"IC-POPOVER-MENU\"\n );\n };\n\n private closeMenu = () => {\n this.open = false;\n this.anchorEl?.focus();\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numButtons = this.popoverMenuEls.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n // Check if wrap around necessary\n if (nextItem < 0) {\n nextItem = numButtons;\n } else if (nextItem > numButtons) {\n nextItem = 0;\n }\n\n return nextItem;\n };\n\n // Manages the keyboard navigation in the popover menu\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyDown(ev: KeyboardEvent): void {\n switch (ev.key) {\n case \"ArrowDown\":\n ev.preventDefault();\n this.currentFocus = this.getNextItemToSelect(this.currentFocus, true);\n this.setButtonFocus();\n break;\n case \"ArrowUp\":\n ev.preventDefault();\n this.currentFocus = this.getNextItemToSelect(this.currentFocus, false);\n this.setButtonFocus();\n break;\n case \"Home\":\n //Sets home focus as first element, or back button\n this.currentFocus = 0;\n this.setButtonFocus();\n break;\n case \"End\":\n //Sets end focus as last element\n this.currentFocus = this.popoverMenuEls.length - 1;\n this.setButtonFocus();\n break;\n case \"Escape\":\n case \"Tab\":\n if (this.open) {\n this.closeMenu();\n this.host.blur();\n }\n break;\n }\n }\n\n private addMenuItems = (elements: Element[] \| NodeListOf<ChildNode>) => {\n for (let i = 0; i < elements.length; i++) {\n const el = elements[i] as HTMLIcMenuItemElement;\n if (el.tagName === \"IC-MENU-ITEM\") {\n this.popoverMenuEls.push(el);\n } else if (el.tagName === \"IC-MENU-GROUP\") {\n const groupSlotWrapper = el.shadowRoot.querySelector(\"ul\");\n const menuGroupElements = getSlotElements(groupSlotWrapper);\n\n this.addMenuItems(menuGroupElements);\n }\n }\n };\n\n private getMenuAriaLabel = (): string => {\n const ariaLabel = this.host.getAttribute(\"aria-label\");\n\n if (this.submenuId !== undefined) {\n return `${ariaLabel}, within nested level ${this.submenuLevel} ${this.parentLabel} submenu,`;\n } else {\n return ariaLabel;\n }\n };\n\n private handleBackButtonClick = (): void => {\n this.parentPopover.openFromChild();\n this.open = false;\n };\n\n componentDidRender(): void {\n if (this.open) {\n createPopper(this.anchorEl, this.host, {\n placement: \"bottom-start\",\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 4],\n },\n },\n ],\n });\n }\n }\n\n componentWillRender(): void {\n this.anchorEl = this.findAnchorEl(this.anchor);\n }\n\n componentDidLoad(): void {\n const slotWrapper = this.host.shadowRoot.querySelector(\"ul.button\");\n const popoverMenuElements = getSlotElements(slotWrapper);\n\n if (popoverMenuElements !== null) {\n this.addMenuItems(popoverMenuElements);\n }\n\n if (\n this.submenuId === undefined &&\n this.host.getAttribute(\"aria-label\") === null\n ) {\n console.error(\n `No aria-label specified for popover menu component - aria-label required`\n );\n }\n }\n\n render() {\n return (\n <Host class={{ open: this.open }}>\n <div\n id={\n this.parentPopover === undefined\n ? `ic-popover-submenu-${this.submenuId}`\n : \"\"\n }\n class={{\n menu: true,\n }}\n tabindex={open ? \"0\" : \"-1\"}\n >\n <div\n class={{\n \"opening-from-parent\": this.openingFromParent,\n \"opening-from-child\": this.openingFromChild,\n }}\n >\n {this.submenuId !== undefined && (\n <div>\n <ic-menu-item\n class=\"ic-popover-submenu-back-button\"\n ref={(el) => (this.backButton = el)}\n label=\"Back\"\n onClick={this.handleBackButtonClick}\n id={`ic-popover-submenu-back-button-${this.submenuLevel}`}\n >\n <svg\n slot=\"icon\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"submenu-back-icon\"\n >\n <path\n d=\"M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-menu-item>\n <ic-typography variant=\"subtitle-small\" class=\"parent-label\">\n {this.parentLabel}\n </ic-typography>\n </div>\n )}\n <ul\n class=\"button\"\n aria-label={this.getMenuAriaLabel()}\n role=\"menu\"\n aria-owns={\n this.submenuId !== undefined\n ? `ic-popover-submenu-back-button-${this.submenuLevel}`\n : false\n }\n aria-controls={\n this.submenuId !== undefined\n ? `ic-popover-submenu-back-button-${this.submenuLevel}`\n : false\n }\n >\n <slot></slot>\n </ul>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ic-radio-group.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { d as defineCustomElement$4 } from './ic-input-label2.js';
 import { d as defineCustomElement$3 } from './ic-input-validation2.js';
 import { d as defineCustomElement$2 } from './ic-typography2.js';
-const icRadioGroupCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}ic-input-label.error{color:var(--ic-status-error)}ic-input-validation{margin-top:var(--ic-space-sm)}:host([small]) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host([small]) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}.radio-buttons-container{display:flex;flex-direction:column;gap:var(--ic-space-xxs)}:host([small]) .radio-buttons-container{gap:var(--ic-space-xxxs)}:host([orientation=\"horizontal\"]) .radio-buttons-container{display:flex;flex-direction:row;gap:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host([small][orientation=\"horizontal\"]) .radio-buttons-container{gap:var(--ic-space-xl)}";
+const icRadioGroupCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}ic-input-label.error{color:var(--ic-status-error)}ic-input-validation{margin-top:var(--ic-space-sm)}:host(.small) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host(.small) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}.radio-buttons-container{display:flex;flex-direction:column;gap:var(--ic-space-xxs)}:host(.small) .radio-buttons-container{gap:var(--ic-space-xxxs)}:host([orientation=\"horizontal\"]) .radio-buttons-container{display:flex;flex-direction:row;gap:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host(.small[orientation=\"horizontal\"]) .radio-buttons-container{gap:var(--ic-space-xl)}";
 const RadioGroup = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -101,7 +101,7 @@ const RadioGroup = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   render() {
     renderHiddenInput(true, this.host, this.name, this.checkedValue, this.disabled);
-    return (h(Host, { onKeyDown: this.handleKeyDown }, h("div", { role: "radiogroup", "aria-label": `${this.label}${this.required ? ", required" : ""}` }, !this.hideLabel && (h("ic-input-label", { class: { [`${this.validationStatus}`]: true }, label: this.label, helperText: this.helperText, required: this.required, disabled: this.disabled })), h("div", { class: "radio-buttons-container" }, h("slot", null))), hasValidationStatus(this.validationStatus, this.disabled) && (h("ic-input-validation", { ariaLiveMode: "polite", status: this.validationStatus, message: this.validationText }))));
+    return (h(Host, { onKeyDown: this.handleKeyDown, class: { small: this.small } }, h("div", { role: "radiogroup", "aria-label": `${this.label}${this.required ? ", required" : ""}` }, !this.hideLabel && (h("ic-input-label", { class: { [`${this.validationStatus}`]: true }, label: this.label, helperText: this.helperText, required: this.required, disabled: this.disabled })), h("div", { class: "radio-buttons-container" }, h("slot", null))), hasValidationStatus(this.validationStatus, this.disabled) && (h("ic-input-validation", { ariaLiveMode: "polite", status: this.validationStatus, message: this.validationText }))));
   }
   get host() { return this; }
   static get style() { return icRadioGroupCss; }

package/dist/components/ic-radio-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-radio-group.js","mappings":"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","names":[],"sources":["./src/components/ic-radio-group/ic-radio-group.css?tag=ic-radio-group&encapsulation=shadow","./src/components/ic-radio-group/ic-radio-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n}\n\nic-input-label.error {\n color: var(--ic-status-error);\n}\n\nic-input-validation {\n margin-top: var(--ic-space-sm);\n}\n\n:host([small]) ic-input-validation {\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\nic-input-label ic-typography {\n margin-bottom: var(--ic-space-sm);\n}\n\n:host([small]) ic-input-label ic-typography {\n margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\n.radio-buttons-container {\n display: flex;\n flex-direction: column;\n gap: var(--ic-space-xxs);\n}\n\n:host([small]) .radio-buttons-container {\n gap: var(--ic-space-xxxs);\n}\n\n:host([orientation=\"horizontal\"]) .radio-buttons-container {\n display: flex;\n flex-direction: row;\n gap: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host([small][orientation=\"horizontal\"]) .radio-buttons-container {\n gap: var(--ic-space-xl);\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n State,\n Listen,\n Element,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport {\n hasValidationStatus,\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n} from \"../../utils/helpers\";\nimport { IcInformationStatusOrEmpty, IcOrientation } from \"../../utils/types\";\nimport { IcValueEventDetail } from \"../../interface\";\n\n@Component({\n tag: \"ic-radio-group\",\n styleUrl: \"ic-radio-group.css\",\n shadow: true,\n})\nexport class RadioGroup {\n private radioOptions: HTMLIcRadioOptionElement[];\n\n @Element() host: HTMLIcRadioGroupElement;\n\n /*\n The label for the radio group to be displayed.\n /\n @Prop() label!: string;\n\n /\n The name for the radio group to differentiate from other groups.\n /\n @Prop() name!: string;\n\n /\n If `true`, the radio group will require a value.\n /\n @Prop() required: boolean = false;\n\n /\n The orientation of the radio buttons in the radio group. If there are more than two radio buttons in a radio group or either of the radio buttons use the `additional-field` slot, then the orientation will always be vertical.\n /\n @Prop({ reflect: true, mutable: true }) orientation: IcOrientation =\n \"vertical\";\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel: boolean = false;\n\n /\n If `true`, the disabled state will be set.\n /\n @Prop() disabled: boolean = false;\n\n /\n The helper text that will be displayed for additional field guidance.\n /\n @Prop() helperText: string;\n\n /\n If `true`, the small styling will be applied to the radio group.\n /\n @Prop() small: boolean = false;\n /\n The validation status - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n /\n The validation text - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationText: string = \"\";\n /\n The checked state.\n /\n @State() checkedValue: string = \"\";\n @State() selectedChild: number = -1;\n\n /\n Emitted when a user selects a radio.\n */\n @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n @Listen(\"icCheck\")\n selectHandler(event: CustomEvent<IcValueEventDetail>): void {\n this.checkedValue = event.detail.value;\n this.icChange.emit({ value: this.checkedValue });\n\n if (this.radioOptions !== undefined) {\n this.radioOptions.forEach((radioOption, index) => {\n radioOption.selected = this.checkedValue === radioOption.value;\n if (radioOption.selected) {\n this.selectedChild = index;\n }\n });\n this.radioOptions[0].shadowRoot.querySelector(\"input\").tabIndex =\n this.selectedChild > 0 ? -1 : 0;\n }\n }\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowRight\":\n this.radioOptions[\n this.getNextItemToSelect(this.selectedChild, true)\n ].selected = true;\n event.preventDefault();\n break;\n case \"ArrowUp\":\n case \"ArrowLeft\":\n this.radioOptions[\n this.getNextItemToSelect(this.selectedChild, false)\n ].selected = true;\n event.preventDefault();\n }\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numRadios = this.radioOptions.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n //check if wrap around necessary\n if (nextItem < 0) {\n nextItem = numRadios;\n } else if (nextItem > numRadios) {\n nextItem = 0;\n }\n\n //if next item is disabled then find next\n if (this.radioOptions[nextItem].disabled) {\n nextItem = this.getNextItemToSelect(nextItem, movingDown);\n }\n\n return nextItem;\n };\n\n componentDidLoad(): void {\n this.radioOptions = Array.from(\n this.host.querySelectorAll(\"ic-radio-option\")\n );\n\n this.radioOptions.forEach((radioOption, index) => {\n if (!radioOption.selected) {\n radioOption.selected = this.checkedValue === radioOption.value;\n }\n radioOption.name = this.name;\n radioOption.groupLabel = this.label;\n if (radioOption.selected) {\n this.selectedChild = index;\n this.checkedValue = radioOption.value;\n }\n });\n this.radioOptions[0].shadowRoot.querySelector(\"input\").tabIndex =\n this.selectedChild > 0 ? -1 : 0;\n\n if (\n this.orientation === \"horizontal\" &&\n this.radioOptions !== undefined &&\n (this.radioOptions.length > 2 \|\|\n (this.radioOptions.length === 2 &&\n (isSlotUsed(this.radioOptions[0], \"additional-field\") \|\|\n isSlotUsed(this.radioOptions[1], \"additional-field\"))))\n ) {\n this.orientation = \"vertical\";\n }\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Radio Group\"\n );\n }\n\n render() {\n renderHiddenInput(\n true,\n this.host,\n this.name,\n this.checkedValue,\n this.disabled\n );\n\n return (\n <Host onKeyDown={this.handleKeyDown}>\n <div\n role=\"radiogroup\"\n aria-label={`${this.label}${this.required ? \", required\" : \"\"}`}\n >\n {!this.hideLabel && (\n <ic-input-label\n class={{ [`${this.validationStatus}`]: true }}\n label={this.label}\n helperText={this.helperText}\n required={this.required}\n disabled={this.disabled}\n ></ic-input-label>\n )}\n <div class=\"radio-buttons-container\">\n <slot></slot>\n </div>\n </div>\n {hasValidationStatus(this.validationStatus, this.disabled) && (\n <ic-input-validation\n ariaLiveMode=\"polite\"\n status={this.validationStatus}\n message={this.validationText}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-radio-group.js","mappings":"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","names":[],"sources":["./src/components/ic-radio-group/ic-radio-group.css?tag=ic-radio-group&encapsulation=shadow","./src/components/ic-radio-group/ic-radio-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n}\n\nic-input-label.error {\n color: var(--ic-status-error);\n}\n\nic-input-validation {\n margin-top: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-validation {\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\nic-input-label ic-typography {\n margin-bottom: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-label ic-typography {\n margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\n.radio-buttons-container {\n display: flex;\n flex-direction: column;\n gap: var(--ic-space-xxs);\n}\n\n:host(.small) .radio-buttons-container {\n gap: var(--ic-space-xxxs);\n}\n\n:host([orientation=\"horizontal\"]) .radio-buttons-container {\n display: flex;\n flex-direction: row;\n gap: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.small[orientation=\"horizontal\"]) .radio-buttons-container {\n gap: var(--ic-space-xl);\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n State,\n Listen,\n Element,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport {\n hasValidationStatus,\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n} from \"../../utils/helpers\";\nimport { IcInformationStatusOrEmpty, IcOrientation } from \"../../utils/types\";\nimport { IcValueEventDetail } from \"../../interface\";\n\n@Component({\n tag: \"ic-radio-group\",\n styleUrl: \"ic-radio-group.css\",\n shadow: true,\n})\nexport class RadioGroup {\n private radioOptions: HTMLIcRadioOptionElement[];\n\n @Element() host: HTMLIcRadioGroupElement;\n\n /*\n The label for the radio group to be displayed.\n /\n @Prop() label!: string;\n\n /\n The name for the radio group to differentiate from other groups.\n /\n @Prop() name!: string;\n\n /\n If `true`, the radio group will require a value.\n /\n @Prop() required: boolean = false;\n\n /\n The orientation of the radio buttons in the radio group. If there are more than two radio buttons in a radio group or either of the radio buttons use the `additional-field` slot, then the orientation will always be vertical.\n /\n @Prop({ reflect: true, mutable: true }) orientation: IcOrientation =\n \"vertical\";\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel: boolean = false;\n\n /\n If `true`, the disabled state will be set.\n /\n @Prop() disabled: boolean = false;\n\n /\n The helper text that will be displayed for additional field guidance.\n /\n @Prop() helperText: string;\n\n /\n If `true`, the small styling will be applied to the radio group.\n /\n @Prop() small: boolean = false;\n /\n The validation status - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n /\n The validation text - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationText: string = \"\";\n /\n The checked state.\n /\n @State() checkedValue: string = \"\";\n @State() selectedChild: number = -1;\n\n /\n Emitted when a user selects a radio.\n */\n @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n @Listen(\"icCheck\")\n selectHandler(event: CustomEvent<IcValueEventDetail>): void {\n this.checkedValue = event.detail.value;\n this.icChange.emit({ value: this.checkedValue });\n\n if (this.radioOptions !== undefined) {\n this.radioOptions.forEach((radioOption, index) => {\n radioOption.selected = this.checkedValue === radioOption.value;\n if (radioOption.selected) {\n this.selectedChild = index;\n }\n });\n this.radioOptions[0].shadowRoot.querySelector(\"input\").tabIndex =\n this.selectedChild > 0 ? -1 : 0;\n }\n }\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowRight\":\n this.radioOptions[\n this.getNextItemToSelect(this.selectedChild, true)\n ].selected = true;\n event.preventDefault();\n break;\n case \"ArrowUp\":\n case \"ArrowLeft\":\n this.radioOptions[\n this.getNextItemToSelect(this.selectedChild, false)\n ].selected = true;\n event.preventDefault();\n }\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numRadios = this.radioOptions.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n //check if wrap around necessary\n if (nextItem < 0) {\n nextItem = numRadios;\n } else if (nextItem > numRadios) {\n nextItem = 0;\n }\n\n //if next item is disabled then find next\n if (this.radioOptions[nextItem].disabled) {\n nextItem = this.getNextItemToSelect(nextItem, movingDown);\n }\n\n return nextItem;\n };\n\n componentDidLoad(): void {\n this.radioOptions = Array.from(\n this.host.querySelectorAll(\"ic-radio-option\")\n );\n\n this.radioOptions.forEach((radioOption, index) => {\n if (!radioOption.selected) {\n radioOption.selected = this.checkedValue === radioOption.value;\n }\n radioOption.name = this.name;\n radioOption.groupLabel = this.label;\n if (radioOption.selected) {\n this.selectedChild = index;\n this.checkedValue = radioOption.value;\n }\n });\n this.radioOptions[0].shadowRoot.querySelector(\"input\").tabIndex =\n this.selectedChild > 0 ? -1 : 0;\n\n if (\n this.orientation === \"horizontal\" &&\n this.radioOptions !== undefined &&\n (this.radioOptions.length > 2 \|\|\n (this.radioOptions.length === 2 &&\n (isSlotUsed(this.radioOptions[0], \"additional-field\") \|\|\n isSlotUsed(this.radioOptions[1], \"additional-field\"))))\n ) {\n this.orientation = \"vertical\";\n }\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Radio Group\"\n );\n }\n\n render() {\n renderHiddenInput(\n true,\n this.host,\n this.name,\n this.checkedValue,\n this.disabled\n );\n\n return (\n <Host onKeyDown={this.handleKeyDown} class={{ small: this.small }}>\n <div\n role=\"radiogroup\"\n aria-label={`${this.label}${this.required ? \", required\" : \"\"}`}\n >\n {!this.hideLabel && (\n <ic-input-label\n class={{ [`${this.validationStatus}`]: true }}\n label={this.label}\n helperText={this.helperText}\n required={this.required}\n disabled={this.disabled}\n ></ic-input-label>\n )}\n <div class=\"radio-buttons-container\">\n <slot></slot>\n </div>\n </div>\n {hasValidationStatus(this.validationStatus, this.disabled) && (\n <ic-input-validation\n ariaLiveMode=\"polite\"\n status={this.validationStatus}\n message={this.validationText}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ic-radio-option.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { u as getSlotContent, d as addFormResetListener, a as onComponentRequiredPropUndefined, r as removeFormResetListener } from './helpers.js';
 import { d as defineCustomElement$2 } from './ic-typography2.js';
-const icRadioOptionCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:flex;flex-direction:column;width:-moz-fit-content;width:fit-content}:host([additional-field-display=\"static\"]) ::slotted(ic-text-field){margin-top:calc(var(--ic-space-sm) / 2);margin-left:var(--ic-space-xl)}:host([disabled]){color:var(--ic-architectural-200)}.container input:focus+span.checkmark,:host(:focus) .container input:checked+span.checkmark{box-shadow:var(--ic-border-focus)}.container{display:grid;grid-template-columns:min-content auto;position:relative;cursor:pointer;align-items:center;margin:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs)}.container.disabled,.container.disabled input:disabled{cursor:default}.container input{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;position:absolute;cursor:pointer;height:var(--ic-space-lg);width:var(--ic-space-lg);border-radius:50%;border:none}.checkmark{display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:transparent;border:0.063rem solid #a7acb3;border-radius:50%;transition:var(--ic-easing-transition-fast);box-sizing:border-box}.container input:checked~.checkmark::after{display:inline-block}.container:hover input~.checkmark{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-hover);border:0.063rem solid var(--ic-action-default)}.container:active input~.checkmark{background-color:var(--ic-action-default-bg-active);border:0.063rem solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark{background-color:var(--ic-action-default-bg-active);border:0.125rem solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark::after{background-color:var(--ic-action-default-active)}.container input:checked~.checkmark{border:0.125rem solid var(--ic-action-default)}.container input:checked:disabled~.checkmark{background-color:transparent;border:0.125rem solid var(--ic-architectural-200)}.container input:disabled~.checkmark{border:0.063rem dashed var(--ic-architectural-200)}.container input:disabled~.checkmark::after{background:var(--ic-architectural-200)}.container:hover input:disabled~.checkmark{background-color:transparent;box-shadow:none;border:0.125rem solid none}.container:active input:disabled~.checkmark::after{background-color:var(--ic-architectural-200)}.container .checkmark::after{content:\"\";position:absolute;display:none;top:calc(50% - var(--ic-space-xs));left:calc(50% - var(--ic-space-xs));width:var(--ic-space-md);height:var(--ic-space-md);border-radius:50%;background:var(--ic-action-default)}.radio-label{margin-left:var(--ic-space-md)}.additional-field-wrapper{margin-left:var(--ic-space-xs)}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-action-default);border-left:0.125rem solid var(--ic-action-default);margin-left:-0.063rem}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-container.hidden{display:none}.dynamic-text{color:var(--ic-action-default);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.container input:checked~.checkmark,.container:active input:checked~.checkmark{border-color:Highlight}.container input:checked~.checkmark::after,.container:active input:checked~.checkmark::after{background-color:Highlight}.container input:disabled~.checkmark,.container input:checked:disabled~.checkmark{border-color:GrayText}.container input:disabled~.checkmark::after,.container:active input:disabled~.checkmark::after{background-color:GrayText}}";
+const icRadioOptionCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:flex;flex-direction:column;width:-moz-fit-content;width:fit-content}:host([additional-field-display=\"static\"]) ::slotted(ic-text-field){margin-top:calc(var(--ic-space-sm) / 2);margin-left:var(--ic-space-xl)}:host(.disabled){color:var(--ic-architectural-200)}.container input:focus+span.checkmark,:host(:focus) .container input:checked+span.checkmark{box-shadow:var(--ic-border-focus)}.container{display:grid;grid-template-columns:min-content auto;position:relative;cursor:pointer;align-items:center;margin:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs)}.container.disabled,.container.disabled input:disabled{cursor:default}.container input{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;position:absolute;cursor:pointer;height:var(--ic-space-lg);width:var(--ic-space-lg);border-radius:50%;border:none}.checkmark{display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:transparent;border:var(--ic-space-1px) solid #a7acb3;border-radius:50%;transition:var(--ic-easing-transition-fast);box-sizing:border-box}.container input:checked~.checkmark::after{display:inline-block}.container:hover input~.checkmark{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-hover);border:var(--ic-space-1px) solid var(--ic-action-default)}.container:active input~.checkmark{background-color:var(--ic-action-default-bg-active);border:var(--ic-space-1px) solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark{background-color:var(--ic-action-default-bg-active);border:0.125rem solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark::after{background-color:var(--ic-action-default-active)}.container input:checked~.checkmark{border:0.125rem solid var(--ic-action-default)}.container input:checked:disabled~.checkmark{background-color:transparent;border:0.125rem solid var(--ic-architectural-200)}.container input:disabled~.checkmark{border:var(--ic-space-1px) dashed var(--ic-architectural-200)}.container input:disabled~.checkmark::after{background:var(--ic-architectural-200)}.container:hover input:disabled~.checkmark{background-color:transparent;box-shadow:none;border:0.125rem solid none}.container:active input:disabled~.checkmark::after{background-color:var(--ic-architectural-200)}.container .checkmark::after{content:\"\";position:absolute;display:none;top:calc(50% - var(--ic-space-xs));left:calc(50% - var(--ic-space-xs));width:var(--ic-space-md);height:var(--ic-space-md);border-radius:50%;background:var(--ic-action-default)}.radio-label{margin-left:var(--ic-space-md)}.additional-field-wrapper{margin-left:var(--ic-space-xs)}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-action-default);border-left:0.125rem solid var(--ic-action-default);margin-left:calc(-1 * var(--ic-space-1px))}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-container.hidden{display:none}.dynamic-text{color:var(--ic-action-default);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.container input:checked~.checkmark,.container:active input:checked~.checkmark{border-color:Highlight}.container input:checked~.checkmark::after,.container:active input:checked~.checkmark::after{background-color:Highlight}.container input:disabled~.checkmark,.container input:checked:disabled~.checkmark{border-color:GrayText}.container input:disabled~.checkmark::after,.container:active input:disabled~.checkmark::after{background-color:GrayText}}";
 const RadioOption = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -118,7 +118,7 @@ const RadioOption = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   render() {
     const id = `ic-radio-option-${this.label !== undefined ? this.label : this.value}-${this.groupLabel}`;
-    return (h(Host, { onClick: this.handleClick }, h("div", { class: { ["container"]: true, ["disabled"]: this.disabled } }, h("div", null, h("input", { role: "radio", tabindex: this.selected ? "0" : "-1", type: "radio", name: this.name, id: id, value: this.value, disabled: this.disabled ? true : null, checked: this.selected, ref: (el) => (this.radioElement = el) }), h("span", { class: "checkmark" })), h("ic-typography", { class: "radio-label", variant: "body" }, h("label", { htmlFor: id }, this.label))), this.hasAdditionalField && (h("div", { onClick: this.swallowClick, class: {
+    return (h(Host, { onClick: this.handleClick, class: { disabled: this.disabled } }, h("div", { class: { ["container"]: true, ["disabled"]: this.disabled } }, h("div", null, h("input", { role: "radio", tabindex: this.selected ? "0" : "-1", type: "radio", name: this.name, id: id, value: this.value, disabled: this.disabled ? true : null, checked: this.selected, ref: (el) => (this.radioElement = el) }), h("span", { class: "checkmark" })), h("ic-typography", { class: "radio-label", variant: "body" }, h("label", { htmlFor: id }, this.label))), this.hasAdditionalField && (h("div", { onClick: this.swallowClick, class: {
         "dynamic-container": true,
         hidden: this.additionalFieldDisplay === "dynamic" && !this.selected,
       } }, this.additionalFieldDisplay === "dynamic" && (h("div", { class: "branch-corner" })), h("div", null, this.additionalFieldDisplay === "dynamic" && (h("ic-typography", { variant: "caption" }, h("p", { class: "dynamic-text" }, this.dynamicText))), h("div", { class: {

package/dist/components/ic-radio-option.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-radio-option.js","mappings":"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","names":[],"sources":["./src/components/ic-radio-option/ic-radio-option.css?tag=ic-radio-option&encapsulation=shadow","./src/components/ic-radio-option/ic-radio-option.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: flex;\n flex-direction: column;\n width: fit-content;\n}\n\n:host([additional-field-display=\"static\"]) ::slotted(ic-text-field) {\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-left: var(--ic-space-xl);\n}\n\n/* The label turns grey when disabled /\n:host([disabled]) {\n color: var(--ic-architectural-200);\n}\n\n/ Focus states /\n\n.container input:focus + span.checkmark,\n:host(:focus) .container input:checked + span.checkmark {\n box-shadow: var(--ic-border-focus);\n}\n\n/ The container /\n.container {\n display: grid;\n grid-template-columns: min-content auto;\n position: relative;\n cursor: pointer;\n align-items: center;\n margin: var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);\n}\n\n.container.disabled,\n.container.disabled input:disabled {\n cursor: default;\n}\n\n/ Hide the browser's default radio button /\n.container input {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: inline-block;\n position: absolute;\n cursor: pointer;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n border-radius: 50%;\n border: none;\n}\n\n/ Create a custom radio button /\n.checkmark {\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: transparent;\n border: 0.063rem solid #a7acb3;\n border-radius: 50%;\n transition: var(--ic-easing-transition-fast);\n box-sizing: border-box;\n}\n\n/ Show the indicator (dot/circle) when checked /\n.container input:checked ~ .checkmark::after {\n display: inline-block;\n}\n\n/ On mouse-over, add a light blue background color /\n.container:hover input ~ .checkmark {\n background-color: var(--ic-action-default-bg-hover);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-hover);\n border: 0.063rem solid var(--ic-action-default);\n}\n\n/ When pressed, adds the active colours /\n.container:active input ~ .checkmark {\n background-color: var(--ic-action-default-bg-active);\n border: 0.063rem solid var(--ic-action-default-active);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);\n}\n\n/ When pressed, adds the active colours /\n.container:active input:checked ~ .checkmark {\n background-color: var(--ic-action-default-bg-active);\n border: 0.125rem solid var(--ic-action-default-active);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);\n}\n\n/ When pressed and selected, adds the active colours /\n.container:active input:checked ~ .checkmark::after {\n background-color: var(--ic-action-default-active);\n}\n\n/ When the radio button is checked /\n.container input:checked ~ .checkmark {\n border: 0.125rem solid var(--ic-action-default);\n}\n\n/ When the radio button is checked and disabled /\n.container input:checked:disabled ~ .checkmark {\n background-color: transparent;\n border: 0.125rem solid var(--ic-architectural-200);\n}\n\n/ When the radio button is disabled /\n.container input:disabled ~ .checkmark {\n border: 0.063rem dashed var(--ic-architectural-200);\n}\n\n/ When the radio button is disabled /\n.container input:disabled ~ .checkmark::after {\n background: var(--ic-architectural-200);\n}\n\n/ On mouse-over inactive /\n.container:hover input:disabled ~ .checkmark {\n background-color: transparent;\n box-shadow: none;\n border: 0.125rem solid none;\n}\n\n.container:active input:disabled ~ .checkmark::after {\n background-color: var(--ic-architectural-200);\n}\n\n/ Style the indicator (dot/circle) /\n.container .checkmark::after {\n content: \"\";\n position: absolute;\n display: none;\n top: calc(50% - var(--ic-space-xs));\n left: calc(50% - var(--ic-space-xs));\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n border-radius: 50%;\n background: var(--ic-action-default);\n}\n\n.radio-label {\n margin-left: var(--ic-space-md);\n}\n\n.additional-field-wrapper {\n margin-left: var(--ic-space-xs);\n}\n\n/ The line /\n.branch-corner {\n color: var(--ic-action-default);\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 0.188rem;\n border-bottom: 0.125rem solid var(--ic-action-default);\n border-left: 0.125rem solid var(--ic-action-default);\n margin-left: -0.063rem;\n}\n\n/ The dynamic container /\n.dynamic-container {\n display: flex;\n position: relative;\n margin: var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-container.hidden {\n display: none;\n}\n\n.dynamic-text {\n color: var(--ic-action-default);\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n ::slotted(ic-text-field) {\n --input-width: 100%;\n }\n}\n\n@media (forced-colors: active) {\n / Styles here only apply to Forced Colors Mode /\n\n .container input:checked ~ .checkmark,\n .container:active input:checked ~ .checkmark {\n border-color: Highlight;\n }\n\n .container input:checked ~ .checkmark::after,\n .container:active input:checked ~ .checkmark::after {\n background-color: Highlight;\n }\n\n .container input:disabled ~ .checkmark,\n .container input:checked:disabled ~ .checkmark {\n border-color: GrayText;\n }\n\n .container input:disabled ~ .checkmark::after,\n .container:active input:disabled ~ .checkmark::after {\n background-color: GrayText;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n Listen,\n Watch,\n State,\n Method,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n getSlotContent,\n onComponentRequiredPropUndefined,\n addFormResetListener,\n removeFormResetListener,\n} from \"../../utils/helpers\";\nimport { IcValueEventDetail } from \"../../interface\";\n@Component({\n tag: \"ic-radio-option\",\n styleUrl: \"ic-radio-option.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class RadioOption {\n private radioElement: HTMLInputElement;\n /\n If `true`, the radio option will be displayed in a selected state.\n /\n @Prop({ reflect: true, mutable: true }) selected?: boolean = false;\n /\n If `true`, the disabled state will be set.\n /\n @Prop() disabled?: boolean = false;\n /\n The label for the radio option.\n /\n @Prop() label?: string;\n /\n The value for the radio option.\n /\n @Prop({ mutable: true }) value!: string;\n /\n The name for the radio option.\n /\n @Prop() name: string;\n /\n The group label for the radio option.\n /\n @Prop() groupLabel: string;\n /\n The text to be displayed when dynamic.\n /\n @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n /\n The style of additionalField that will be displayed if used.\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n\n @State() initiallySelected = this.selected;\n\n @Element() host: HTMLIcRadioOptionElement;\n\n /\n @deprecated This event should not be used anymore. Use icCheck instead.\n /\n @Event() radioOptionSelect: EventEmitter<IcValueEventDetail>;\n\n /\n Emitted when a radio is selected.\n /\n @Event() icCheck: EventEmitter<IcValueEventDetail>;\n\n @Watch(\"selected\")\n selectedChangeHandler(selected: boolean): void {\n if (selected) {\n this.handleClick();\n }\n }\n\n /\n Sets focus on the radio option.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.host.shadowRoot.querySelector(\"input\")) {\n this.host.shadowRoot.querySelector(\"input\").focus();\n }\n }\n\n private defaultRadioValue: string = \"\";\n private skipFocus = false;\n\n private handleClick = () => {\n if (!this.disabled) {\n if (this.skipFocus === false) {\n this.radioElement.focus();\n }\n this.skipFocus = false;\n\n if (this.hasAdditionalField) {\n const textfield = this.host.querySelector(\"ic-text-field\");\n this.value =\n textfield.value !== \"\" ? textfield.value : this.defaultRadioValue;\n }\n\n this.icCheck.emit({\n value: this.value,\n });\n\n this.radioOptionSelect.emit({\n value: this.value,\n });\n }\n };\n\n private swallowClick = (event: MouseEvent) => {\n event.stopPropagation();\n };\n\n private hasAdditionalField: boolean = false;\n componentWillLoad(): void {\n const additonalFieldContent = getSlotContent(this.host, \"additional-field\");\n\n if (additonalFieldContent !== null) {\n this.hasAdditionalField = true;\n const Element = additonalFieldContent[0] as HTMLElement;\n if (Element.tagName === \"IC-TEXT-FIELD\") {\n const textField = Element as HTMLIcTextFieldElement;\n textField.hiddenInput = false;\n }\n }\n\n this.defaultRadioValue = this.value;\n\n addFormResetListener(this.host, this.handleFormReset);\n }\n\n private handleFormReset = (): void => {\n this.skipFocus = true;\n this.selected = this.initiallySelected;\n };\n\n @Listen(\"icChange\")\n textfieldValueHandler(event: CustomEvent<{ value: string }>): void {\n const textFieldValue = event.detail.value;\n\n if (this.selected) {\n if (textFieldValue !== \"\") {\n this.value = event.detail.value;\n this.icCheck.emit({\n value: this.value,\n });\n this.radioOptionSelect.emit({\n value: this.value,\n });\n } else {\n this.value = this.defaultRadioValue;\n this.icCheck.emit({\n value: this.defaultRadioValue,\n });\n this.radioOptionSelect.emit({\n value: this.defaultRadioValue,\n });\n }\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.value, propName: \"value\" }],\n \"Radio Option\"\n );\n }\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.host.querySelector(\"ic-text-field\");\n if (!this.selected) {\n textfield && textfield.setAttribute(\"disabled\", \"\");\n } else {\n textfield && textfield.removeAttribute(\"disabled\");\n }\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.host, this.handleFormReset);\n }\n\n render() {\n const id = `ic-radio-option-${\n this.label !== undefined ? this.label : this.value\n }-${this.groupLabel}`;\n\n return (\n <Host onClick={this.handleClick}>\n <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n <div>\n <input\n role=\"radio\"\n tabindex={this.selected ? \"0\" : \"-1\"}\n type=\"radio\"\n name={this.name}\n id={id}\n value={this.value}\n disabled={this.disabled ? true : null}\n checked={this.selected}\n ref={(el) => (this.radioElement = el)}\n ></input>\n <span class=\"checkmark\"></span>\n </div>\n <ic-typography class=\"radio-label\" variant=\"body\">\n <label htmlFor={id}>{this.label}</label>\n </ic-typography>\n </div>\n\n {this.hasAdditionalField && (\n <div\n onClick={this.swallowClick}\n class={{\n \"dynamic-container\": true,\n hidden:\n this.additionalFieldDisplay === \"dynamic\" && !this.selected,\n }}\n >\n {this.additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {this.additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\">{this.dynamicText}</p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n this.additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-radio-option.js","mappings":"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","names":[],"sources":["./src/components/ic-radio-option/ic-radio-option.css?tag=ic-radio-option&encapsulation=shadow","./src/components/ic-radio-option/ic-radio-option.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: flex;\n flex-direction: column;\n width: fit-content;\n}\n\n:host([additional-field-display=\"static\"]) ::slotted(ic-text-field) {\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-left: var(--ic-space-xl);\n}\n\n/* The label turns grey when disabled /\n:host(.disabled) {\n color: var(--ic-architectural-200);\n}\n\n/ Focus states /\n\n.container input:focus + span.checkmark,\n:host(:focus) .container input:checked + span.checkmark {\n box-shadow: var(--ic-border-focus);\n}\n\n/ The container /\n.container {\n display: grid;\n grid-template-columns: min-content auto;\n position: relative;\n cursor: pointer;\n align-items: center;\n margin: var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);\n}\n\n.container.disabled,\n.container.disabled input:disabled {\n cursor: default;\n}\n\n/ Hide the browser's default radio button /\n.container input {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: inline-block;\n position: absolute;\n cursor: pointer;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n border-radius: 50%;\n border: none;\n}\n\n/ Create a custom radio button /\n.checkmark {\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: transparent;\n border: var(--ic-space-1px) solid #a7acb3;\n border-radius: 50%;\n transition: var(--ic-easing-transition-fast);\n box-sizing: border-box;\n}\n\n/ Show the indicator (dot/circle) when checked /\n.container input:checked ~ .checkmark::after {\n display: inline-block;\n}\n\n/ On mouse-over, add a light blue background color /\n.container:hover input ~ .checkmark {\n background-color: var(--ic-action-default-bg-hover);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-hover);\n border: var(--ic-space-1px) solid var(--ic-action-default);\n}\n\n/ When pressed, adds the active colours /\n.container:active input ~ .checkmark {\n background-color: var(--ic-action-default-bg-active);\n border: var(--ic-space-1px) solid var(--ic-action-default-active);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);\n}\n\n/ When pressed, adds the active colours /\n.container:active input:checked ~ .checkmark {\n background-color: var(--ic-action-default-bg-active);\n border: 0.125rem solid var(--ic-action-default-active);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);\n}\n\n/ When pressed and selected, adds the active colours /\n.container:active input:checked ~ .checkmark::after {\n background-color: var(--ic-action-default-active);\n}\n\n/ When the radio button is checked /\n.container input:checked ~ .checkmark {\n border: 0.125rem solid var(--ic-action-default);\n}\n\n/ When the radio button is checked and disabled /\n.container input:checked:disabled ~ .checkmark {\n background-color: transparent;\n border: 0.125rem solid var(--ic-architectural-200);\n}\n\n/ When the radio button is disabled /\n.container input:disabled ~ .checkmark {\n border: var(--ic-space-1px) dashed var(--ic-architectural-200);\n}\n\n/ When the radio button is disabled /\n.container input:disabled ~ .checkmark::after {\n background: var(--ic-architectural-200);\n}\n\n/ On mouse-over inactive /\n.container:hover input:disabled ~ .checkmark {\n background-color: transparent;\n box-shadow: none;\n border: 0.125rem solid none;\n}\n\n.container:active input:disabled ~ .checkmark::after {\n background-color: var(--ic-architectural-200);\n}\n\n/ Style the indicator (dot/circle) /\n.container .checkmark::after {\n content: \"\";\n position: absolute;\n display: none;\n top: calc(50% - var(--ic-space-xs));\n left: calc(50% - var(--ic-space-xs));\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n border-radius: 50%;\n background: var(--ic-action-default);\n}\n\n.radio-label {\n margin-left: var(--ic-space-md);\n}\n\n.additional-field-wrapper {\n margin-left: var(--ic-space-xs);\n}\n\n/ The line /\n.branch-corner {\n color: var(--ic-action-default);\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 0.188rem;\n border-bottom: 0.125rem solid var(--ic-action-default);\n border-left: 0.125rem solid var(--ic-action-default);\n margin-left: calc(-1 var(--ic-space-1px));\n}\n\n/* The dynamic container /\n.dynamic-container {\n display: flex;\n position: relative;\n margin: var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-container.hidden {\n display: none;\n}\n\n.dynamic-text {\n color: var(--ic-action-default);\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n ::slotted(ic-text-field) {\n --input-width: 100%;\n }\n}\n\n@media (forced-colors: active) {\n / Styles here only apply to Forced Colors Mode /\n\n .container input:checked ~ .checkmark,\n .container:active input:checked ~ .checkmark {\n border-color: Highlight;\n }\n\n .container input:checked ~ .checkmark::after,\n .container:active input:checked ~ .checkmark::after {\n background-color: Highlight;\n }\n\n .container input:disabled ~ .checkmark,\n .container input:checked:disabled ~ .checkmark {\n border-color: GrayText;\n }\n\n .container input:disabled ~ .checkmark::after,\n .container:active input:disabled ~ .checkmark::after {\n background-color: GrayText;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n Listen,\n Watch,\n State,\n Method,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n getSlotContent,\n onComponentRequiredPropUndefined,\n addFormResetListener,\n removeFormResetListener,\n} from \"../../utils/helpers\";\nimport { IcValueEventDetail } from \"../../interface\";\n@Component({\n tag: \"ic-radio-option\",\n styleUrl: \"ic-radio-option.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class RadioOption {\n private radioElement: HTMLInputElement;\n /\n If `true`, the radio option will be displayed in a selected state.\n /\n @Prop({ reflect: true, mutable: true }) selected?: boolean = false;\n /\n If `true`, the disabled state will be set.\n /\n @Prop() disabled?: boolean = false;\n /\n The label for the radio option.\n /\n @Prop() label?: string;\n /\n The value for the radio option.\n /\n @Prop({ mutable: true }) value!: string;\n /\n The name for the radio option.\n /\n @Prop() name: string;\n /\n The group label for the radio option.\n /\n @Prop() groupLabel: string;\n /\n The text to be displayed when dynamic.\n /\n @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n /\n The style of additionalField that will be displayed if used.\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n\n @State() initiallySelected = this.selected;\n\n @Element() host: HTMLIcRadioOptionElement;\n\n /\n @deprecated This event should not be used anymore. Use icCheck instead.\n /\n @Event() radioOptionSelect: EventEmitter<IcValueEventDetail>;\n\n /\n Emitted when a radio is selected.\n /\n @Event() icCheck: EventEmitter<IcValueEventDetail>;\n\n @Watch(\"selected\")\n selectedChangeHandler(selected: boolean): void {\n if (selected) {\n this.handleClick();\n }\n }\n\n /\n Sets focus on the radio option.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.host.shadowRoot.querySelector(\"input\")) {\n this.host.shadowRoot.querySelector(\"input\").focus();\n }\n }\n\n private defaultRadioValue: string = \"\";\n private skipFocus = false;\n\n private handleClick = () => {\n if (!this.disabled) {\n if (this.skipFocus === false) {\n this.radioElement.focus();\n }\n this.skipFocus = false;\n\n if (this.hasAdditionalField) {\n const textfield = this.host.querySelector(\"ic-text-field\");\n this.value =\n textfield.value !== \"\" ? textfield.value : this.defaultRadioValue;\n }\n\n this.icCheck.emit({\n value: this.value,\n });\n\n this.radioOptionSelect.emit({\n value: this.value,\n });\n }\n };\n\n private swallowClick = (event: MouseEvent) => {\n event.stopPropagation();\n };\n\n private hasAdditionalField: boolean = false;\n componentWillLoad(): void {\n const additonalFieldContent = getSlotContent(this.host, \"additional-field\");\n\n if (additonalFieldContent !== null) {\n this.hasAdditionalField = true;\n const Element = additonalFieldContent[0] as HTMLElement;\n if (Element.tagName === \"IC-TEXT-FIELD\") {\n const textField = Element as HTMLIcTextFieldElement;\n textField.hiddenInput = false;\n }\n }\n\n this.defaultRadioValue = this.value;\n\n addFormResetListener(this.host, this.handleFormReset);\n }\n\n private handleFormReset = (): void => {\n this.skipFocus = true;\n this.selected = this.initiallySelected;\n };\n\n @Listen(\"icChange\")\n textfieldValueHandler(event: CustomEvent<{ value: string }>): void {\n const textFieldValue = event.detail.value;\n\n if (this.selected) {\n if (textFieldValue !== \"\") {\n this.value = event.detail.value;\n this.icCheck.emit({\n value: this.value,\n });\n this.radioOptionSelect.emit({\n value: this.value,\n });\n } else {\n this.value = this.defaultRadioValue;\n this.icCheck.emit({\n value: this.defaultRadioValue,\n });\n this.radioOptionSelect.emit({\n value: this.defaultRadioValue,\n });\n }\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.value, propName: \"value\" }],\n \"Radio Option\"\n );\n }\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.host.querySelector(\"ic-text-field\");\n if (!this.selected) {\n textfield && textfield.setAttribute(\"disabled\", \"\");\n } else {\n textfield && textfield.removeAttribute(\"disabled\");\n }\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.host, this.handleFormReset);\n }\n\n render() {\n const id = `ic-radio-option-${\n this.label !== undefined ? this.label : this.value\n }-${this.groupLabel}`;\n\n return (\n <Host onClick={this.handleClick} class={{ disabled: this.disabled }}>\n <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n <div>\n <input\n role=\"radio\"\n tabindex={this.selected ? \"0\" : \"-1\"}\n type=\"radio\"\n name={this.name}\n id={id}\n value={this.value}\n disabled={this.disabled ? true : null}\n checked={this.selected}\n ref={(el) => (this.radioElement = el)}\n ></input>\n <span class=\"checkmark\"></span>\n </div>\n <ic-typography class=\"radio-label\" variant=\"body\">\n <label htmlFor={id}>{this.label}</label>\n </ic-typography>\n </div>\n\n {this.hasAdditionalField && (\n <div\n onClick={this.swallowClick}\n class={{\n \"dynamic-container\": true,\n hidden:\n this.additionalFieldDisplay === \"dynamic\" && !this.selected,\n }}\n >\n {this.additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {this.additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\">{this.dynamicText}</p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n this.additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ic-search-bar.js CHANGED Viewed

@@ -21,7 +21,7 @@ const searchIcon = `<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
     <path d="M13.1292 11.8792H12.4708L12.2375 11.6542C13.0542 10.7042 13.5458 9.47083 13.5458 8.12916C13.5458 5.13749 11.1208 2.71249 8.12916 2.71249C5.13749 2.71249 2.71249 5.13749 2.71249 8.12916C2.71249 11.1208 5.13749 13.5458 8.12916 13.5458C9.47083 13.5458 10.7042 13.0542 11.6542 12.2375L11.8792 12.4708V13.1292L16.0458 17.2875L17.2875 16.0458L13.1292 11.8792ZM8.12916 11.8792C6.05416 11.8792 4.37916 10.2042 4.37916 8.12916C4.37916 6.05416 6.05416 4.37916 8.12916 4.37916C10.2042 4.37916 11.8792 6.05416 11.8792 8.12916C11.8792 10.2042 10.2042 11.8792 8.12916 11.8792Z" fill="currentColor"/>
 </svg>`;
-const icSearchBarCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.search){--divider-height:1.5rem}:host(.search.small){--divider-height:1rem}:host(.fullwidth){width:100%}:host(.search) .disabled:hover{border-color:var(--ic-architectural-200)}:host(.search.disabled) .disabled svg{color:var(--ic-architectural-200)}:host(.search) .disabled svg{color:var(--ic-architectural-400)}.clear-button-container{align-items:center;margin-right:0.063rem;display:none;visibility:hidden}.clear-button{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition)}.clear-button:focus,.clear-button:active{background-color:var(--ic-focus-blue);box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow);border-radius:0.25rem}.clear-button:focus,.clear-button:active *{fill:white}.clear-button-visible{visibility:visible;display:flex}.search-submit-button-container{display:flex;align-items:center}.search-submit-button-disabled .ic-tooltip-container{display:none !important}.search-submit-button:focus,.search-submit-button:active{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow) !important;border-radius:var(--ic-space-xxs)}.search-submit-button:focus,.search-submit-button:active *{fill:white}.divider{width:0.063rem;background-color:var(--ic-action-dark-active);height:var(--divider-height)}:host(.dark) .divider{background-color:var(--ic-architectural-200)}.menu-container{width:var(--input-width, 20rem);position:relative;top:var(--ic-space-xxxs)}.menu-container.fullwidth{width:100%}ic-menu{transition:var(--ic-easing-transition-slow)}.no-results{cursor:not-allowed}.search-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:0.063rem;margin-bottom:-0.063rem;margin-right:-0.063rem;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:0.063rem}";
+const icSearchBarCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.search){--divider-height:1.5rem}:host(.search.small){--divider-height:1rem}:host(.fullwidth){width:100%}:host(.search) .disabled:hover{border-color:var(--ic-architectural-200)}:host(.search.disabled) .disabled svg{color:var(--ic-architectural-200)}:host(.search) .disabled svg{color:var(--ic-architectural-400)}.clear-button-container{align-items:center;margin-right:var(--ic-space-1px);display:none;visibility:hidden}.clear-button{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition)}.clear-button:focus,.clear-button:active{background-color:var(--ic-focus-blue);box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow);border-radius:0.25rem}.clear-button:focus,.clear-button:active *{fill:white}.clear-button-visible{visibility:visible;display:flex}.search-submit-button-container{display:flex;align-items:center}.search-submit-button-disabled .ic-tooltip-container{display:none !important}.search-submit-button:focus,.search-submit-button:active{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow) !important;border-radius:var(--ic-space-xxs)}.search-submit-button:focus,.search-submit-button:active *{fill:white}.divider{width:var(--ic-space-1px);background-color:var(--ic-action-dark-active);height:var(--divider-height)}:host(.dark) .divider{background-color:var(--ic-architectural-200)}.menu-container{width:var(--input-width, 20rem);position:relative;top:var(--ic-space-xxxs)}.menu-container.fullwidth{width:100%}ic-menu{transition:var(--ic-easing-transition-slow)}.no-results{cursor:not-allowed}.search-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:var(--ic-space-1px);margin-bottom:calc(-1 * var(--ic-space-1px));margin-right:calc(-1 * var(--ic-space-1px));overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:var(--ic-space-1px)}";
 let inputIds = 0;
 const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {

package/dist/components/ic-search-bar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-search-bar.js","mappings":"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","names":[],"sources":["./src/components/ic-search-bar/ic-search-bar.css?tag=ic-search-bar&encapsulation=shadow","./src/components/ic-search-bar/ic-search-bar.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/*\n @prop --ic-z-index-menu: z-index of search bar menu\n /\n\n:host(.search) {\n --divider-height: 1.5rem;\n}\n\n:host(.search.small) {\n --divider-height: 1rem;\n}\n\n:host(.fullwidth) {\n width: 100%;\n}\n\n:host(.search) .disabled:hover {\n border-color: var(--ic-architectural-200);\n}\n\n:host(.search.disabled) .disabled svg {\n color: var(--ic-architectural-200);\n}\n\n:host(.search) .disabled svg {\n color: var(--ic-architectural-400);\n}\n\n/ CLEAR /\n\n.clear-button-container {\n align-items: center;\n margin-right: 0.063rem;\n display: none;\n visibility: hidden;\n}\n\n.clear-button {\n border-radius: var(--ic-border-radius);\n transition: box-shadow var(--ic-easing-transition),\n border-radius var(--ic-easing-transition);\n}\n\n.clear-button:focus,\n.clear-button:active {\n background-color: var(--ic-focus-blue);\n box-shadow: inset 0 0 0 0.125rem var(--ic-focus-glow);\n border-radius: 0.25rem;\n}\n\n.clear-button:focus,\n.clear-button:active {\n fill: white;\n}\n\n.clear-button-visible {\n visibility: visible;\n display: flex;\n}\n\n.search-submit-button-container {\n display: flex;\n align-items: center;\n}\n\n.search-submit-button-disabled .ic-tooltip-container {\n display: none !important;\n}\n\n.search-submit-button:focus,\n.search-submit-button:active {\n background-color: var(--ic-focus-blue) !important;\n box-shadow: inset 0 0 0 0.125rem var(--ic-focus-glow) !important;\n border-radius: var(--ic-space-xxs);\n}\n\n.search-submit-button:focus,\n.search-submit-button:active * {\n fill: white;\n}\n\n.divider {\n width: 0.063rem;\n background-color: var(--ic-action-dark-active);\n height: var(--divider-height);\n}\n\n:host(.dark) .divider {\n background-color: var(--ic-architectural-200);\n}\n\n.menu-container {\n width: var(--input-width, 20rem);\n position: relative;\n top: var(--ic-space-xxxs);\n}\n\n.menu-container.fullwidth {\n width: 100%;\n}\n\nic-menu {\n transition: var(--ic-easing-transition-slow);\n}\n\n.no-results {\n cursor: not-allowed;\n}\n\n.search-results-status {\n border: 0;\n clip: rect(0, 0, 0, 0, 0);\n height: 0.063rem;\n margin-bottom: -0.063rem;\n margin-right: -0.063rem;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 0.063rem;\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n Method,\n h,\n} from \"@stencil/core\";\n\nimport {\n IcAutocompleteTypes,\n IcAutocorrectStates,\n IcThemeForegroundEnum,\n IcMenuOption,\n} from \"../../utils/types\";\nimport {\n getInputDescribedByText,\n renderHiddenInput,\n handleHiddenFormButtonClick,\n getLabelFromValue,\n onComponentRequiredPropUndefined,\n getFilteredMenuOptions,\n} from \"../../utils/helpers\";\nimport { IcSearchBarBlurEventDetail } from \"./ic-search-bar.types\";\nimport { IcValueEventDetail, IcBlurEventDetail } from \"../../interface\";\nimport {\n IcMenuChangeEventDetail,\n IcOptionSelectEventDetail,\n} from \"../ic-menu/ic-menu.types\";\n\nimport clearIcon from \"../../assets/clear-icon.svg\";\nimport searchIcon from \"../../assets/search-icon.svg\";\n\nlet inputIds = 0;\n\n@Component({\n tag: \"ic-search-bar\",\n styleUrl: \"ic-search-bar.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class SearchBar {\n @Element() el: HTMLIcSearchBarElement;\n\n private inputId = `ic-search-bar-input-${inputIds++}`;\n private inputEl: HTMLIcTextFieldElement;\n\n private menuId = `${this.inputId}-menu`;\n private searchSubmitButton: HTMLIcButtonElement;\n private menu: HTMLIcMenuElement;\n private menuCloseFromMenuChangeEvent: boolean = false;\n\n private anchorEl: HTMLElement;\n private truncateValue = false;\n\n private assistiveHintEl: HTMLSpanElement = null;\n private preventSubmit: boolean = false;\n private debounceAriaLive: number;\n\n /*\n The label for the search bar.\n /\n @Prop() label!: string;\n\n /\n If `true`, the search bar will require a value.\n /\n @Prop() required?: boolean = false;\n /\n If `true`, the disabled state will be set.\n /\n @Prop() disabled?: boolean = false;\n\n /\n If `true`, the readonly state will be set.\n /\n @Prop() readonly?: boolean = false;\n\n /\n The placeholder value to display.\n /\n @Prop() placeholder?: string = \"Search\";\n\n /\n Specify whether the search bar fills the full width of the container.\n * If `true`, this overrides the --input-width CSS variable.\n /\n @Prop() fullWidth?: boolean = false;\n\n /\n Specify whether to disable the built in filtering. For example, if options will already be filtered from external source.\n * If `true`, all options provided will be displayed.\n /\n @Prop() disableFilter?: boolean = false;\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel?: boolean = false;\n\n /\n The helper text that will be displayed for additional field guidance.\n /\n @Prop() helperText?: string = \"\";\n\n /\n If `true`, the small styling will be applied to the search bar.\n /\n @Prop() small?: boolean = false;\n\n /\n The value of the search input.\n /\n @Prop({ reflect: true, mutable: true }) value: string = \"\";\n\n /\n The automatic capitalisation of the text value as it is entered/edited by the user.\n * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n /\n @Prop() autocapitalize = \"off\";\n\n /\n The state of autocompletion the browser can apply on the text value.\n /\n @Prop() autocomplete?: IcAutocompleteTypes = \"off\";\n\n /\n The state of autocorrection the browser can apply when the user is entering/editing the text value.\n /\n @Prop() autocorrect?: IcAutocorrectStates = \"off\";\n\n /\n If `true`, the form control will have input focus when the page loads.\n /\n @Prop() autofocus = false;\n\n /\n The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n /\n @Prop() debounce?: number = 0;\n\n /\n The name of the control, which is submitted with the form data.\n /\n @Prop() name: string = this.inputId;\n\n /\n If `true`, the value of the search will have its spelling and grammar checked.\n /\n @Prop() spellcheck: boolean = false;\n /\n The suggested search options.\n /\n @Prop() options?: IcMenuOption[] = [];\n\n @Watch(\"options\")\n watchOptionsHandler(newOptions: IcMenuOption[]): void {\n if (this.disableFilter) {\n if (newOptions.length > 0) {\n this.filteredOptions = newOptions;\n } else {\n if (this.hadNoOptions()) {\n return;\n }\n this.setMenuChange(true);\n this.filteredOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n }\n }\n this.debounceAriaLiveUpdate();\n }\n\n /\n If `true`, the search bar will be focused when component loaded.\n /\n @Prop() focusOnLoad?: boolean = false;\n\n /\n The hint text for the hidden assistive description element.\n /\n @Prop() hintText?: string =\n \"When autocomplete results are available use the up and down arrows to choose and press enter to select\";\n\n /\n The text displayed when there are no options in the option list.\n /\n @Prop() emptyOptionListText = \"No results found\";\n\n /\n The number of characters until suggestions appear.\n /\n @Prop() charactersUntilSuggestion: number = 2;\n\n @Watch(\"value\")\n watchValueHandler(newValue: string): void {\n if (\n this.inputEl &&\n this.options &&\n !!getLabelFromValue(newValue, this.options)\n ) {\n this.inputEl.value = getLabelFromValue(newValue, this.options);\n } else if (this.inputEl && this.inputEl.value !== newValue) {\n this.inputEl.value = newValue;\n }\n }\n\n /\n Sets focus on the native `input`.\n /\n @Method()\n async setFocus(): Promise<void> {\n if (this.inputEl) {\n this.inputEl.setFocus();\n }\n }\n\n @Listen(\"icKeydown\", {})\n handleKeyDown(ev: CustomEvent): void {\n const keyEv: KeyboardEvent = ev.detail.event;\n if (this.menu && this.open) {\n this.menu.handleKeyboardOpen(keyEv);\n }\n }\n\n @Listen(\"keyup\", {})\n handleKeyUp(ev: KeyboardEvent): void {\n if (ev.key === \"Enter\") {\n if (this.preventSubmit \|\| this.isSubmitDisabled()) {\n return;\n }\n\n this.handleSubmitSearch();\n this.setMenuChange(false);\n }\n\n if (ev.key === \"Escape\") {\n this.setMenuChange(false);\n }\n\n if (this.preventSubmit) {\n this.preventSubmit = false;\n }\n }\n\n private handleSubmitSearch = () => {\n this.highlightedValue && (this.value = this.highlightedValue);\n this.highlightedValue = undefined;\n this.icSubmitSearch.emit({ value: this.value });\n\n const form: HTMLFormElement = this.el.closest(\"FORM\");\n\n if (this.searchSubmitButton && !!form && !this.preventSubmit) {\n handleHiddenFormButtonClick(form, this.searchSubmitButton);\n }\n };\n\n private handleSubmitSearchKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === \" \") {\n ev.preventDefault();\n this.handleSubmitSearch();\n }\n };\n\n // The icInput event is defined here so that it appears as an event for search bar\n // The actual event is emitted from the child ic-text-field\n /\n Emitted when a keyboard input occurred.\n /\n @Event() icInput: EventEmitter<IcValueEventDetail>;\n private onInput = (ev: Event) => {\n this.value = (ev.target as HTMLInputElement).value;\n\n const noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n\n if (this.options.length > 0) {\n this.setMenuChange(true);\n\n if (this.disableFilter === false) {\n const rawFilteredOptions = getFilteredMenuOptions(\n this.options,\n false,\n this.value,\n \"anywhere\"\n );\n\n this.filteredOptions =\n rawFilteredOptions.length > 0 ? rawFilteredOptions : noOptions;\n }\n }\n\n if (!this.showClearButton) {\n this.handleShowClearButton(true);\n }\n\n this.debounceAriaLiveUpdate();\n };\n\n private debounceAriaLiveUpdate() {\n clearTimeout(this.debounceAriaLive);\n\n this.debounceAriaLive = window.setTimeout(() => {\n this.updateSearchResultAriaLive();\n }, 500);\n }\n\n /\n @deprecated This event should not be used anymore. Use icSearchBarBlur instead.\n /\n @Event() icInputBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n private onInputBlur = (ev: Event) => {\n const value = (ev.target as HTMLInputElement).value;\n const nextFocus = (ev as FocusEvent).relatedTarget;\n\n this.icInputBlur.emit({ value: value, relatedTarget: nextFocus });\n };\n\n /\n @deprecated This event should not be used anymore. Use icSearchBarFocus instead.\n /\n @Event() icInputFocus: EventEmitter<IcValueEventDetail>;\n private onInputFocus = (ev: Event) => {\n const value = (ev.target as HTMLInputElement).value;\n this.icInputFocus.emit({ value: value });\n\n this.handleShowClearButton(true);\n };\n\n // The icChange event is defined here so that it appears as an event for search bar\n // The actual event is emitted from the child ic-text-field\n /\n Emitted when the value has changed.\n /\n @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n /\n Emitted when value is cleared with clear button\n /\n @Event() icClear: EventEmitter<void>;\n private handleClear = (ev: Event) => {\n const keyboardEvent = ev as KeyboardEvent;\n const mouseEvent = ev as MouseEvent;\n\n if (\n mouseEvent.type === \"click\" \|\|\n keyboardEvent.code === \"Enter\" \|\|\n keyboardEvent.code === \"Space\"\n ) {\n this.value = \"\";\n this.inputEl.value = \"\";\n this.el.setFocus();\n\n this.icClear.emit();\n ev.preventDefault();\n\n this.preventSubmit = true;\n }\n };\n\n private handleMouseDown = (ev: Event) => {\n ev.preventDefault();\n };\n\n /\n Emitted when the search value has been submitted\n /\n @Event() icSubmitSearch: EventEmitter<IcValueEventDetail>;\n\n /\n Emitted when option is highlighted within the menu\n /\n @Event() icOptionSelect: EventEmitter<IcOptionSelectEventDetail>;\n\n /\n Emitted when the state of the menu changes (i.e. open or close)\n /\n @Event() icMenuChange: EventEmitter<IcMenuChangeEventDetail>;\n /\n @internal - Emitted when blur is invoked from clear button\n /\n @Event() icClearBlur: EventEmitter<IcBlurEventDetail>;\n private handleClearBlur = (ev: Event) => {\n const nextFocus = (ev as FocusEvent).relatedTarget;\n\n this.icClearBlur.emit({ relatedTarget: nextFocus });\n\n this.clearButtonFocused = false;\n };\n\n /\n @internal - Emitted when blur is invoked from search submit button\n /\n @Event() icSubmitSearchBlur: EventEmitter<IcBlurEventDetail>;\n private handleSubmitSearchBlur = (ev: Event) => {\n const nextFocus = (ev as FocusEvent).relatedTarget;\n\n this.icSubmitSearchBlur.emit({ relatedTarget: nextFocus });\n\n this.searchSubmitFocused = false;\n };\n\n private handleSubmitSearchFocus = () => {\n this.handleMenuCloseFromMenuChange(true);\n this.searchSubmitFocused = true;\n };\n\n /\n Emitted when blur is invoked from ic-search-bar\n /\n @Event() icSearchBarBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n\n /\n Emitted when focus is invoked from ic-search-bar\n */\n @Event() icSearchBarFocus: EventEmitter<void>;\n\n @State() open: boolean = false;\n @State() filteredOptions: IcMenuOption[] = [];\n @State() ariaActiveDescendant: string;\n @State() showClearButton: boolean = false;\n @State() clearButtonFocused: boolean = false;\n @State() searchSubmitFocused: boolean = false;\n @State() prevNoOption: boolean = false;\n @State() highlightedValue: string;\n\n private handleOptionSelect = (ev: CustomEvent) => {\n if (ev.detail.label === this.emptyOptionListText) {\n this.el.setFocus();\n return;\n }\n\n this.value = ev.detail.value;\n this.icOptionSelect.emit({ value: this.value });\n };\n\n private handleMenuOptionHighlight = (ev: CustomEvent) => {\n const optionValue = ev.detail.optionId?.replace(`${this.menuId}-`, \"\");\n optionValue && (this.highlightedValue = optionValue);\n if (ev.detail.optionId) {\n this.ariaActiveDescendant = ev.detail.optionId;\n } else {\n this.ariaActiveDescendant = undefined;\n }\n };\n\n private handleMenuChange = (ev: CustomEvent) => {\n this.setMenuChange(ev.detail.open);\n if (!ev.detail.open) {\n this.handleMenuCloseFromMenuChange(true);\n if (ev.detail.focusInput === undefined \|\| ev.detail.focusInput) {\n this.el.setFocus();\n }\n }\n };\n\n private setMenuChange = (open: boolean) => {\n if (this.open !== open) {\n this.open = open;\n this.icMenuChange.emit({ open });\n }\n };\n\n private handleHostFocus = () => {\n if (this.options && this.value && !this.menuCloseFromMenuChangeEvent) {\n this.setMenuChange(true);\n }\n this.handleTruncateValue(false);\n\n this.icSearchBarFocus.emit();\n };\n\n private handleHostBlur = (ev: Event) => {\n const nextFocus = (ev as FocusEvent).relatedTarget;\n if (this.open && this.options && nextFocus !== this.menu) {\n this.setMenuChange(false);\n }\n\n this.handleShowClearButton(false);\n this.handleMenuCloseFromMenuChange(false);\n this.handleTruncateValue(true);\n this.icSearchBarBlur.emit({ relatedTarget: nextFocus, value: this.value });\n };\n\n private handleShowClearButton = (visible: boolean): void => {\n this.showClearButton = visible;\n };\n\n private handleFocusClearButton = (): void => {\n this.clearButtonFocused = true;\n };\n\n private handleMenuCloseFromMenuChange = (fromEvent: boolean): void => {\n this.menuCloseFromMenuChangeEvent = fromEvent;\n };\n\n private handleTruncateValue = (truncate: boolean): void => {\n this.truncateValue = truncate;\n };\n\n private renderAssistiveHintEl = (): void => {\n const input = this.el.shadowRoot\n .querySelector(\"ic-text-field\")\n ?.shadowRoot?.querySelector(`#${this.inputId}`);\n\n if (\n input &&\n Object.keys(input).length > 0 &&\n this.hasOptionsOrFilterDisabled()\n ) {\n this.assistiveHintEl = document.createElement(\"span\");\n this.assistiveHintEl.innerText = this.hintText;\n this.assistiveHintEl.id = `${this.inputId}-assistive-hint`;\n this.assistiveHintEl.style.display = \"none\";\n if (input.after !== undefined) {\n input.after(this.assistiveHintEl);\n }\n }\n };\n\n private updateSearchResultAriaLive = (): void => {\n const searchResultsStatusEl = this.el.shadowRoot.querySelector(\n \".search-results-status\"\n ) as HTMLParagraphElement;\n\n if (\n !this.open \|\|\n this.value === \"\" \|\|\n this.value.length < this.charactersUntilSuggestion\n ) {\n searchResultsStatusEl.innerText = \"\";\n } else if (\n this.hasOptionsOrFilterDisabled() &&\n this.filteredOptions.length > 0 &&\n this.open &&\n searchResultsStatusEl\n ) {\n if (this.hadNoOptions()) {\n searchResultsStatusEl.innerText = this.emptyOptionListText;\n } else {\n searchResultsStatusEl.innerText = `${\n this.filteredOptions.length\n } result${this.filteredOptions.length > 1 ? \"s\" : \"\"} available`;\n }\n }\n };\n\n private hasOptionsOrFilterDisabled = (): boolean =>\n this.options.length > 0 \|\| this.disableFilter;\n\n private hadNoOptions = (): boolean =>\n this.filteredOptions.length === 1 &&\n this.filteredOptions[0].label === this.emptyOptionListText;\n\n private isSubmitDisabled = (): boolean => {\n const valueNotSet =\n this.value === undefined \|\| this.value === null \|\| this.value === \"\";\n const valueLengthLess = this.value.length < this.charactersUntilSuggestion;\n return (\n valueNotSet \|\| valueLengthLess \|\| this.disabled \|\| this.hadNoOptions()\n );\n };\n\n private highlightFirstOptionAfterNoResults = () => {\n if (this.prevNoOption && this.menu) {\n this.menu.handleSetFirstOption();\n this.prevNoOption = false;\n }\n const prevNoOptionsList = this.filteredOptions.find(\n (filteredOption) => filteredOption.label === this.emptyOptionListText\n );\n if (prevNoOptionsList) {\n this.prevNoOption = true;\n }\n };\n\n componentWillRender(): void {\n this.highlightFirstOptionAfterNoResults();\n }\n\n componentWillLoad(): void {\n this.watchValueHandler(this.value);\n }\n\n componentDidLoad(): void {\n if (this.focusOnLoad) {\n this.el.setFocus();\n }\n\n if (this.hasOptionsOrFilterDisabled()) {\n this.renderAssistiveHintEl();\n if (this.disableFilter) {\n this.filteredOptions = this.options;\n }\n }\n\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Search Bar\"\n );\n\n if (this.inputEl !== undefined) {\n this.anchorEl = this.inputEl.shadowRoot.querySelector(\n \"ic-input-component-container\"\n );\n }\n }\n\n disconnectedCallback(): void {\n if (this.assistiveHintEl) {\n this.assistiveHintEl.remove();\n }\n }\n\n render() {\n const {\n inputId,\n name,\n label,\n required,\n small,\n placeholder,\n helperText,\n disabled,\n value,\n readonly,\n spellcheck,\n fullWidth,\n options,\n open,\n hideLabel,\n menuId,\n ariaActiveDescendant,\n truncateValue,\n autofocus,\n autocapitalize,\n autocomplete,\n filteredOptions,\n } = this;\n\n const disabledMode = readonly \|\| disabled ? true : false;\n\n const describedBy = getInputDescribedByText(\n inputId,\n helperText !== \"\",\n false\n ).trim();\n\n let describedById;\n\n if (describedBy !== \"\" && this.hasOptionsOrFilterDisabled()) {\n describedById = `${describedBy} ${this.inputId}-assistive-hint`;\n } else if (this.hasOptionsOrFilterDisabled()) {\n describedById = `${this.inputId}-assistive-hint`;\n } else if (describedBy !== \"\") {\n describedById = describedBy;\n } else {\n describedById = undefined;\n }\n\n const disabledText = disabledMode && !readonly;\n const hasSuggestedSearch = value && this.hasOptionsOrFilterDisabled();\n const menuOpen = hasSuggestedSearch && open && filteredOptions.length > 0;\n\n let expanded;\n\n if (options.length > 0) {\n if (menuOpen) {\n expanded = \"true\";\n } else {\n expanded = \"false\";\n }\n } else {\n expanded = undefined;\n }\n\n renderHiddenInput(true, this.el, name, value, disabledMode);\n\n return (\n <Host\n class={{\n [\"search\"]: true,\n [\"fullwidth\"]: fullWidth,\n [\"disabled\"]: disabled,\n [\"small\"]: small,\n }}\n onFocus={this.handleHostFocus}\n onBlur={this.handleHostBlur}\n >\n <ic-text-field\n ref={(el) => (this.inputEl = el)}\n inputId={inputId}\n label={label}\n helperText={helperText}\n required={required}\n disabled={disabledText}\n readonly={readonly}\n small={small}\n hideLabel={hideLabel}\n fullWidth={fullWidth}\n name={name}\n truncateValue={truncateValue}\n value={\n options && !!getLabelFromValue(value, options)\n ? getLabelFromValue(value, options)\n : value\n }\n placeholder={placeholder}\n onInput={this.onInput}\n onBlur={this.onInputBlur}\n onFocus={this.onInputFocus}\n aria-label={hideLabel ? label : \"\"}\n aria-describedby={describedById}\n aria-owns={hasSuggestedSearch ? menuId : undefined}\n aria-haspopup={options.length > 0 ? \"listbox\" : undefined}\n ariaExpanded={expanded}\n ariaActiveDescendant={ariaActiveDescendant}\n aria-autocomplete={hasSuggestedSearch ? \"list\" : undefined}\n role={hasSuggestedSearch ? \"combobox\" : undefined}\n autocomplete={autocomplete}\n autocapitalize={autocapitalize}\n autoFocus={autofocus}\n spellcheck={spellcheck}\n inputmode=\"search\"\n debounce={this.debounce}\n >\n <div\n class={{\n \"clear-button-container\": true,\n \"clear-button-visible\":\n value && !disabledMode && this.showClearButton,\n }}\n slot=\"clear-button\"\n >\n <ic-button\n id=\"clear-button\"\n class=\"clear-button\"\n aria-label=\"Clear\"\n innerHTML={clearIcon}\n onClick={this.handleClear}\n onMouseDown={this.handleMouseDown}\n size={small ? \"small\" : \"default\"}\n onFocus={this.handleFocusClearButton}\n onBlur={this.handleClearBlur}\n onKeyDown={this.handleClear}\n type=\"submit\"\n variant=\"icon\"\n appearance={\n this.clearButtonFocused\n ? IcThemeForegroundEnum.Light\n : IcThemeForegroundEnum.Dark\n }\n ></ic-button>\n <div class=\"divider\"></div>\n </div>\n <div\n class={{\n \"search-submit-button-container\": true,\n \"search-submit-button-disabled\": this.isSubmitDisabled(),\n }}\n slot=\"search-submit-button\"\n >\n <ic-button\n id=\"search-submit-button\"\n aria-label=\"Search\"\n ref={(el) => (this.searchSubmitButton = el)}\n class={{\n [\"search-submit-button\"]: true,\n [\"search-submit-button-small\"]: !!small,\n }}\n disabled={this.isSubmitDisabled()}\n innerHTML={searchIcon}\n size={small ? \"small\" : \"default\"}\n onClick={this.handleSubmitSearch}\n onMouseDown={this.handleMouseDown}\n onBlur={this.handleSubmitSearchBlur}\n onFocus={this.handleSubmitSearchFocus}\n onKeyDown={this.handleSubmitSearchKeyDown}\n type=\"submit\"\n variant=\"icon\"\n appearance={\n this.searchSubmitFocused\n ? IcThemeForegroundEnum.Light\n : IcThemeForegroundEnum.Default\n }\n ></ic-button>\n </div>\n <div\n class={{\n \"menu-container\": true,\n fullwidth: fullWidth,\n }}\n slot=\"menu\"\n >\n {menuOpen && value.length >= this.charactersUntilSuggestion && (\n <ic-menu\n class={{\n \"no-results\": this.hadNoOptions(),\n }}\n activationType=\"manual\"\n anchorEl={this.anchorEl}\n autoFocusOnSelected={false}\n inputEl={this.inputEl}\n inputLabel={label}\n ref={(el) => (this.menu = el)}\n small={small}\n fullWidth={fullWidth}\n menuId={menuId}\n open={true}\n options={filteredOptions}\n onMenuOptionSelect={this.handleOptionSelect}\n onMenuStateChange={this.handleMenuChange}\n onMenuOptionId={this.handleMenuOptionHighlight}\n parentEl={this.el}\n value={value}\n ></ic-menu>\n )}\n </div>\n </ic-text-field>\n <div\n aria-live=\"polite\"\n role=\"status\"\n class=\"search-results-status\"\n ></div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-search-bar.js","mappings":"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","names":[],"sources":["./src/components/ic-search-bar/ic-search-bar.css?tag=ic-search-bar&encapsulation=shadow","./src/components/ic-search-bar/ic-search-bar.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/*\n @prop --ic-z-index-menu: z-index of search bar menu\n /\n\n:host(.search) {\n --divider-height: 1.5rem;\n}\n\n:host(.search.small) {\n --divider-height: 1rem;\n}\n\n:host(.fullwidth) {\n width: 100%;\n}\n\n:host(.search) .disabled:hover {\n border-color: var(--ic-architectural-200);\n}\n\n:host(.search.disabled) .disabled svg {\n color: var(--ic-architectural-200);\n}\n\n:host(.search) .disabled svg {\n color: var(--ic-architectural-400);\n}\n\n/ CLEAR /\n\n.clear-button-container {\n align-items: center;\n margin-right: var(--ic-space-1px);\n display: none;\n visibility: hidden;\n}\n\n.clear-button {\n border-radius: var(--ic-border-radius);\n transition: box-shadow var(--ic-easing-transition),\n border-radius var(--ic-easing-transition);\n}\n\n.clear-button:focus,\n.clear-button:active {\n background-color: var(--ic-focus-blue);\n box-shadow: inset 0 0 0 0.125rem var(--ic-focus-glow);\n border-radius: 0.25rem;\n}\n\n.clear-button:focus,\n.clear-button:active {\n fill: white;\n}\n\n.clear-button-visible {\n visibility: visible;\n display: flex;\n}\n\n.search-submit-button-container {\n display: flex;\n align-items: center;\n}\n\n.search-submit-button-disabled .ic-tooltip-container {\n display: none !important;\n}\n\n.search-submit-button:focus,\n.search-submit-button:active {\n background-color: var(--ic-focus-blue) !important;\n box-shadow: inset 0 0 0 0.125rem var(--ic-focus-glow) !important;\n border-radius: var(--ic-space-xxs);\n}\n\n.search-submit-button:focus,\n.search-submit-button:active * {\n fill: white;\n}\n\n.divider {\n width: var(--ic-space-1px);\n background-color: var(--ic-action-dark-active);\n height: var(--divider-height);\n}\n\n:host(.dark) .divider {\n background-color: var(--ic-architectural-200);\n}\n\n.menu-container {\n width: var(--input-width, 20rem);\n position: relative;\n top: var(--ic-space-xxxs);\n}\n\n.menu-container.fullwidth {\n width: 100%;\n}\n\nic-menu {\n transition: var(--ic-easing-transition-slow);\n}\n\n.no-results {\n cursor: not-allowed;\n}\n\n.search-results-status {\n border: 0;\n clip: rect(0, 0, 0, 0, 0);\n height: var(--ic-space-1px);\n margin-bottom: calc(-1 * var(--ic-space-1px));\n margin-right: calc(-1 * var(--ic-space-1px));\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: var(--ic-space-1px);\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n Method,\n h,\n} from \"@stencil/core\";\n\nimport {\n IcAutocompleteTypes,\n IcAutocorrectStates,\n IcThemeForegroundEnum,\n IcMenuOption,\n} from \"../../utils/types\";\nimport {\n getInputDescribedByText,\n renderHiddenInput,\n handleHiddenFormButtonClick,\n getLabelFromValue,\n onComponentRequiredPropUndefined,\n getFilteredMenuOptions,\n} from \"../../utils/helpers\";\nimport { IcSearchBarBlurEventDetail } from \"./ic-search-bar.types\";\nimport { IcValueEventDetail, IcBlurEventDetail } from \"../../interface\";\nimport {\n IcMenuChangeEventDetail,\n IcOptionSelectEventDetail,\n} from \"../ic-menu/ic-menu.types\";\n\nimport clearIcon from \"../../assets/clear-icon.svg\";\nimport searchIcon from \"../../assets/search-icon.svg\";\n\nlet inputIds = 0;\n\n@Component({\n tag: \"ic-search-bar\",\n styleUrl: \"ic-search-bar.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class SearchBar {\n @Element() el: HTMLIcSearchBarElement;\n\n private inputId = `ic-search-bar-input-${inputIds++}`;\n private inputEl: HTMLIcTextFieldElement;\n\n private menuId = `${this.inputId}-menu`;\n private searchSubmitButton: HTMLIcButtonElement;\n private menu: HTMLIcMenuElement;\n private menuCloseFromMenuChangeEvent: boolean = false;\n\n private anchorEl: HTMLElement;\n private truncateValue = false;\n\n private assistiveHintEl: HTMLSpanElement = null;\n private preventSubmit: boolean = false;\n private debounceAriaLive: number;\n\n /*\n The label for the search bar.\n /\n @Prop() label!: string;\n\n /\n If `true`, the search bar will require a value.\n /\n @Prop() required?: boolean = false;\n /\n If `true`, the disabled state will be set.\n /\n @Prop() disabled?: boolean = false;\n\n /\n If `true`, the readonly state will be set.\n /\n @Prop() readonly?: boolean = false;\n\n /\n The placeholder value to display.\n /\n @Prop() placeholder?: string = \"Search\";\n\n /\n Specify whether the search bar fills the full width of the container.\n * If `true`, this overrides the --input-width CSS variable.\n /\n @Prop() fullWidth?: boolean = false;\n\n /\n Specify whether to disable the built in filtering. For example, if options will already be filtered from external source.\n * If `true`, all options provided will be displayed.\n /\n @Prop() disableFilter?: boolean = false;\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel?: boolean = false;\n\n /\n The helper text that will be displayed for additional field guidance.\n /\n @Prop() helperText?: string = \"\";\n\n /\n If `true`, the small styling will be applied to the search bar.\n /\n @Prop() small?: boolean = false;\n\n /\n The value of the search input.\n /\n @Prop({ reflect: true, mutable: true }) value: string = \"\";\n\n /\n The automatic capitalisation of the text value as it is entered/edited by the user.\n * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n /\n @Prop() autocapitalize = \"off\";\n\n /\n The state of autocompletion the browser can apply on the text value.\n /\n @Prop() autocomplete?: IcAutocompleteTypes = \"off\";\n\n /\n The state of autocorrection the browser can apply when the user is entering/editing the text value.\n /\n @Prop() autocorrect?: IcAutocorrectStates = \"off\";\n\n /\n If `true`, the form control will have input focus when the page loads.\n /\n @Prop() autofocus = false;\n\n /\n The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n /\n @Prop() debounce?: number = 0;\n\n /\n The name of the control, which is submitted with the form data.\n /\n @Prop() name: string = this.inputId;\n\n /\n If `true`, the value of the search will have its spelling and grammar checked.\n /\n @Prop() spellcheck: boolean = false;\n /\n The suggested search options.\n /\n @Prop() options?: IcMenuOption[] = [];\n\n @Watch(\"options\")\n watchOptionsHandler(newOptions: IcMenuOption[]): void {\n if (this.disableFilter) {\n if (newOptions.length > 0) {\n this.filteredOptions = newOptions;\n } else {\n if (this.hadNoOptions()) {\n return;\n }\n this.setMenuChange(true);\n this.filteredOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n }\n }\n this.debounceAriaLiveUpdate();\n }\n\n /\n If `true`, the search bar will be focused when component loaded.\n /\n @Prop() focusOnLoad?: boolean = false;\n\n /\n The hint text for the hidden assistive description element.\n /\n @Prop() hintText?: string =\n \"When autocomplete results are available use the up and down arrows to choose and press enter to select\";\n\n /\n The text displayed when there are no options in the option list.\n /\n @Prop() emptyOptionListText = \"No results found\";\n\n /\n The number of characters until suggestions appear.\n /\n @Prop() charactersUntilSuggestion: number = 2;\n\n @Watch(\"value\")\n watchValueHandler(newValue: string): void {\n if (\n this.inputEl &&\n this.options &&\n !!getLabelFromValue(newValue, this.options)\n ) {\n this.inputEl.value = getLabelFromValue(newValue, this.options);\n } else if (this.inputEl && this.inputEl.value !== newValue) {\n this.inputEl.value = newValue;\n }\n }\n\n /\n Sets focus on the native `input`.\n /\n @Method()\n async setFocus(): Promise<void> {\n if (this.inputEl) {\n this.inputEl.setFocus();\n }\n }\n\n @Listen(\"icKeydown\", {})\n handleKeyDown(ev: CustomEvent): void {\n const keyEv: KeyboardEvent = ev.detail.event;\n if (this.menu && this.open) {\n this.menu.handleKeyboardOpen(keyEv);\n }\n }\n\n @Listen(\"keyup\", {})\n handleKeyUp(ev: KeyboardEvent): void {\n if (ev.key === \"Enter\") {\n if (this.preventSubmit \|\| this.isSubmitDisabled()) {\n return;\n }\n\n this.handleSubmitSearch();\n this.setMenuChange(false);\n }\n\n if (ev.key === \"Escape\") {\n this.setMenuChange(false);\n }\n\n if (this.preventSubmit) {\n this.preventSubmit = false;\n }\n }\n\n private handleSubmitSearch = () => {\n this.highlightedValue && (this.value = this.highlightedValue);\n this.highlightedValue = undefined;\n this.icSubmitSearch.emit({ value: this.value });\n\n const form: HTMLFormElement = this.el.closest(\"FORM\");\n\n if (this.searchSubmitButton && !!form && !this.preventSubmit) {\n handleHiddenFormButtonClick(form, this.searchSubmitButton);\n }\n };\n\n private handleSubmitSearchKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === \" \") {\n ev.preventDefault();\n this.handleSubmitSearch();\n }\n };\n\n // The icInput event is defined here so that it appears as an event for search bar\n // The actual event is emitted from the child ic-text-field\n /\n Emitted when a keyboard input occurred.\n /\n @Event() icInput: EventEmitter<IcValueEventDetail>;\n private onInput = (ev: Event) => {\n this.value = (ev.target as HTMLInputElement).value;\n\n const noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n\n if (this.options.length > 0) {\n this.setMenuChange(true);\n\n if (this.disableFilter === false) {\n const rawFilteredOptions = getFilteredMenuOptions(\n this.options,\n false,\n this.value,\n \"anywhere\"\n );\n\n this.filteredOptions =\n rawFilteredOptions.length > 0 ? rawFilteredOptions : noOptions;\n }\n }\n\n if (!this.showClearButton) {\n this.handleShowClearButton(true);\n }\n\n this.debounceAriaLiveUpdate();\n };\n\n private debounceAriaLiveUpdate() {\n clearTimeout(this.debounceAriaLive);\n\n this.debounceAriaLive = window.setTimeout(() => {\n this.updateSearchResultAriaLive();\n }, 500);\n }\n\n /\n @deprecated This event should not be used anymore. Use icSearchBarBlur instead.\n /\n @Event() icInputBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n private onInputBlur = (ev: Event) => {\n const value = (ev.target as HTMLInputElement).value;\n const nextFocus = (ev as FocusEvent).relatedTarget;\n\n this.icInputBlur.emit({ value: value, relatedTarget: nextFocus });\n };\n\n /\n @deprecated This event should not be used anymore. Use icSearchBarFocus instead.\n /\n @Event() icInputFocus: EventEmitter<IcValueEventDetail>;\n private onInputFocus = (ev: Event) => {\n const value = (ev.target as HTMLInputElement).value;\n this.icInputFocus.emit({ value: value });\n\n this.handleShowClearButton(true);\n };\n\n // The icChange event is defined here so that it appears as an event for search bar\n // The actual event is emitted from the child ic-text-field\n /\n Emitted when the value has changed.\n /\n @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n /\n Emitted when value is cleared with clear button\n /\n @Event() icClear: EventEmitter<void>;\n private handleClear = (ev: Event) => {\n const keyboardEvent = ev as KeyboardEvent;\n const mouseEvent = ev as MouseEvent;\n\n if (\n mouseEvent.type === \"click\" \|\|\n keyboardEvent.code === \"Enter\" \|\|\n keyboardEvent.code === \"Space\"\n ) {\n this.value = \"\";\n this.inputEl.value = \"\";\n this.el.setFocus();\n\n this.icClear.emit();\n ev.preventDefault();\n\n this.preventSubmit = true;\n }\n };\n\n private handleMouseDown = (ev: Event) => {\n ev.preventDefault();\n };\n\n /\n Emitted when the search value has been submitted\n /\n @Event() icSubmitSearch: EventEmitter<IcValueEventDetail>;\n\n /\n Emitted when option is highlighted within the menu\n /\n @Event() icOptionSelect: EventEmitter<IcOptionSelectEventDetail>;\n\n /\n Emitted when the state of the menu changes (i.e. open or close)\n /\n @Event() icMenuChange: EventEmitter<IcMenuChangeEventDetail>;\n /\n @internal - Emitted when blur is invoked from clear button\n /\n @Event() icClearBlur: EventEmitter<IcBlurEventDetail>;\n private handleClearBlur = (ev: Event) => {\n const nextFocus = (ev as FocusEvent).relatedTarget;\n\n this.icClearBlur.emit({ relatedTarget: nextFocus });\n\n this.clearButtonFocused = false;\n };\n\n /\n @internal - Emitted when blur is invoked from search submit button\n /\n @Event() icSubmitSearchBlur: EventEmitter<IcBlurEventDetail>;\n private handleSubmitSearchBlur = (ev: Event) => {\n const nextFocus = (ev as FocusEvent).relatedTarget;\n\n this.icSubmitSearchBlur.emit({ relatedTarget: nextFocus });\n\n this.searchSubmitFocused = false;\n };\n\n private handleSubmitSearchFocus = () => {\n this.handleMenuCloseFromMenuChange(true);\n this.searchSubmitFocused = true;\n };\n\n /\n Emitted when blur is invoked from ic-search-bar\n /\n @Event() icSearchBarBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n\n /\n Emitted when focus is invoked from ic-search-bar\n */\n @Event() icSearchBarFocus: EventEmitter<void>;\n\n @State() open: boolean = false;\n @State() filteredOptions: IcMenuOption[] = [];\n @State() ariaActiveDescendant: string;\n @State() showClearButton: boolean = false;\n @State() clearButtonFocused: boolean = false;\n @State() searchSubmitFocused: boolean = false;\n @State() prevNoOption: boolean = false;\n @State() highlightedValue: string;\n\n private handleOptionSelect = (ev: CustomEvent) => {\n if (ev.detail.label === this.emptyOptionListText) {\n this.el.setFocus();\n return;\n }\n\n this.value = ev.detail.value;\n this.icOptionSelect.emit({ value: this.value });\n };\n\n private handleMenuOptionHighlight = (ev: CustomEvent) => {\n const optionValue = ev.detail.optionId?.replace(`${this.menuId}-`, \"\");\n optionValue && (this.highlightedValue = optionValue);\n if (ev.detail.optionId) {\n this.ariaActiveDescendant = ev.detail.optionId;\n } else {\n this.ariaActiveDescendant = undefined;\n }\n };\n\n private handleMenuChange = (ev: CustomEvent) => {\n this.setMenuChange(ev.detail.open);\n if (!ev.detail.open) {\n this.handleMenuCloseFromMenuChange(true);\n if (ev.detail.focusInput === undefined \|\| ev.detail.focusInput) {\n this.el.setFocus();\n }\n }\n };\n\n private setMenuChange = (open: boolean) => {\n if (this.open !== open) {\n this.open = open;\n this.icMenuChange.emit({ open });\n }\n };\n\n private handleHostFocus = () => {\n if (this.options && this.value && !this.menuCloseFromMenuChangeEvent) {\n this.setMenuChange(true);\n }\n this.handleTruncateValue(false);\n\n this.icSearchBarFocus.emit();\n };\n\n private handleHostBlur = (ev: Event) => {\n const nextFocus = (ev as FocusEvent).relatedTarget;\n if (this.open && this.options && nextFocus !== this.menu) {\n this.setMenuChange(false);\n }\n\n this.handleShowClearButton(false);\n this.handleMenuCloseFromMenuChange(false);\n this.handleTruncateValue(true);\n this.icSearchBarBlur.emit({ relatedTarget: nextFocus, value: this.value });\n };\n\n private handleShowClearButton = (visible: boolean): void => {\n this.showClearButton = visible;\n };\n\n private handleFocusClearButton = (): void => {\n this.clearButtonFocused = true;\n };\n\n private handleMenuCloseFromMenuChange = (fromEvent: boolean): void => {\n this.menuCloseFromMenuChangeEvent = fromEvent;\n };\n\n private handleTruncateValue = (truncate: boolean): void => {\n this.truncateValue = truncate;\n };\n\n private renderAssistiveHintEl = (): void => {\n const input = this.el.shadowRoot\n .querySelector(\"ic-text-field\")\n ?.shadowRoot?.querySelector(`#${this.inputId}`);\n\n if (\n input &&\n Object.keys(input).length > 0 &&\n this.hasOptionsOrFilterDisabled()\n ) {\n this.assistiveHintEl = document.createElement(\"span\");\n this.assistiveHintEl.innerText = this.hintText;\n this.assistiveHintEl.id = `${this.inputId}-assistive-hint`;\n this.assistiveHintEl.style.display = \"none\";\n if (input.after !== undefined) {\n input.after(this.assistiveHintEl);\n }\n }\n };\n\n private updateSearchResultAriaLive = (): void => {\n const searchResultsStatusEl = this.el.shadowRoot.querySelector(\n \".search-results-status\"\n ) as HTMLParagraphElement;\n\n if (\n !this.open \|\|\n this.value === \"\" \|\|\n this.value.length < this.charactersUntilSuggestion\n ) {\n searchResultsStatusEl.innerText = \"\";\n } else if (\n this.hasOptionsOrFilterDisabled() &&\n this.filteredOptions.length > 0 &&\n this.open &&\n searchResultsStatusEl\n ) {\n if (this.hadNoOptions()) {\n searchResultsStatusEl.innerText = this.emptyOptionListText;\n } else {\n searchResultsStatusEl.innerText = `${\n this.filteredOptions.length\n } result${this.filteredOptions.length > 1 ? \"s\" : \"\"} available`;\n }\n }\n };\n\n private hasOptionsOrFilterDisabled = (): boolean =>\n this.options.length > 0 \|\| this.disableFilter;\n\n private hadNoOptions = (): boolean =>\n this.filteredOptions.length === 1 &&\n this.filteredOptions[0].label === this.emptyOptionListText;\n\n private isSubmitDisabled = (): boolean => {\n const valueNotSet =\n this.value === undefined \|\| this.value === null \|\| this.value === \"\";\n const valueLengthLess = this.value.length < this.charactersUntilSuggestion;\n return (\n valueNotSet \|\| valueLengthLess \|\| this.disabled \|\| this.hadNoOptions()\n );\n };\n\n private highlightFirstOptionAfterNoResults = () => {\n if (this.prevNoOption && this.menu) {\n this.menu.handleSetFirstOption();\n this.prevNoOption = false;\n }\n const prevNoOptionsList = this.filteredOptions.find(\n (filteredOption) => filteredOption.label === this.emptyOptionListText\n );\n if (prevNoOptionsList) {\n this.prevNoOption = true;\n }\n };\n\n componentWillRender(): void {\n this.highlightFirstOptionAfterNoResults();\n }\n\n componentWillLoad(): void {\n this.watchValueHandler(this.value);\n }\n\n componentDidLoad(): void {\n if (this.focusOnLoad) {\n this.el.setFocus();\n }\n\n if (this.hasOptionsOrFilterDisabled()) {\n this.renderAssistiveHintEl();\n if (this.disableFilter) {\n this.filteredOptions = this.options;\n }\n }\n\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Search Bar\"\n );\n\n if (this.inputEl !== undefined) {\n this.anchorEl = this.inputEl.shadowRoot.querySelector(\n \"ic-input-component-container\"\n );\n }\n }\n\n disconnectedCallback(): void {\n if (this.assistiveHintEl) {\n this.assistiveHintEl.remove();\n }\n }\n\n render() {\n const {\n inputId,\n name,\n label,\n required,\n small,\n placeholder,\n helperText,\n disabled,\n value,\n readonly,\n spellcheck,\n fullWidth,\n options,\n open,\n hideLabel,\n menuId,\n ariaActiveDescendant,\n truncateValue,\n autofocus,\n autocapitalize,\n autocomplete,\n filteredOptions,\n } = this;\n\n const disabledMode = readonly \|\| disabled ? true : false;\n\n const describedBy = getInputDescribedByText(\n inputId,\n helperText !== \"\",\n false\n ).trim();\n\n let describedById;\n\n if (describedBy !== \"\" && this.hasOptionsOrFilterDisabled()) {\n describedById = `${describedBy} ${this.inputId}-assistive-hint`;\n } else if (this.hasOptionsOrFilterDisabled()) {\n describedById = `${this.inputId}-assistive-hint`;\n } else if (describedBy !== \"\") {\n describedById = describedBy;\n } else {\n describedById = undefined;\n }\n\n const disabledText = disabledMode && !readonly;\n const hasSuggestedSearch = value && this.hasOptionsOrFilterDisabled();\n const menuOpen = hasSuggestedSearch && open && filteredOptions.length > 0;\n\n let expanded;\n\n if (options.length > 0) {\n if (menuOpen) {\n expanded = \"true\";\n } else {\n expanded = \"false\";\n }\n } else {\n expanded = undefined;\n }\n\n renderHiddenInput(true, this.el, name, value, disabledMode);\n\n return (\n <Host\n class={{\n [\"search\"]: true,\n [\"fullwidth\"]: fullWidth,\n [\"disabled\"]: disabled,\n [\"small\"]: small,\n }}\n onFocus={this.handleHostFocus}\n onBlur={this.handleHostBlur}\n >\n <ic-text-field\n ref={(el) => (this.inputEl = el)}\n inputId={inputId}\n label={label}\n helperText={helperText}\n required={required}\n disabled={disabledText}\n readonly={readonly}\n small={small}\n hideLabel={hideLabel}\n fullWidth={fullWidth}\n name={name}\n truncateValue={truncateValue}\n value={\n options && !!getLabelFromValue(value, options)\n ? getLabelFromValue(value, options)\n : value\n }\n placeholder={placeholder}\n onInput={this.onInput}\n onBlur={this.onInputBlur}\n onFocus={this.onInputFocus}\n aria-label={hideLabel ? label : \"\"}\n aria-describedby={describedById}\n aria-owns={hasSuggestedSearch ? menuId : undefined}\n aria-haspopup={options.length > 0 ? \"listbox\" : undefined}\n ariaExpanded={expanded}\n ariaActiveDescendant={ariaActiveDescendant}\n aria-autocomplete={hasSuggestedSearch ? \"list\" : undefined}\n role={hasSuggestedSearch ? \"combobox\" : undefined}\n autocomplete={autocomplete}\n autocapitalize={autocapitalize}\n autoFocus={autofocus}\n spellcheck={spellcheck}\n inputmode=\"search\"\n debounce={this.debounce}\n >\n <div\n class={{\n \"clear-button-container\": true,\n \"clear-button-visible\":\n value && !disabledMode && this.showClearButton,\n }}\n slot=\"clear-button\"\n >\n <ic-button\n id=\"clear-button\"\n class=\"clear-button\"\n aria-label=\"Clear\"\n innerHTML={clearIcon}\n onClick={this.handleClear}\n onMouseDown={this.handleMouseDown}\n size={small ? \"small\" : \"default\"}\n onFocus={this.handleFocusClearButton}\n onBlur={this.handleClearBlur}\n onKeyDown={this.handleClear}\n type=\"submit\"\n variant=\"icon\"\n appearance={\n this.clearButtonFocused\n ? IcThemeForegroundEnum.Light\n : IcThemeForegroundEnum.Dark\n }\n ></ic-button>\n <div class=\"divider\"></div>\n </div>\n <div\n class={{\n \"search-submit-button-container\": true,\n \"search-submit-button-disabled\": this.isSubmitDisabled(),\n }}\n slot=\"search-submit-button\"\n >\n <ic-button\n id=\"search-submit-button\"\n aria-label=\"Search\"\n ref={(el) => (this.searchSubmitButton = el)}\n class={{\n [\"search-submit-button\"]: true,\n [\"search-submit-button-small\"]: !!small,\n }}\n disabled={this.isSubmitDisabled()}\n innerHTML={searchIcon}\n size={small ? \"small\" : \"default\"}\n onClick={this.handleSubmitSearch}\n onMouseDown={this.handleMouseDown}\n onBlur={this.handleSubmitSearchBlur}\n onFocus={this.handleSubmitSearchFocus}\n onKeyDown={this.handleSubmitSearchKeyDown}\n type=\"submit\"\n variant=\"icon\"\n appearance={\n this.searchSubmitFocused\n ? IcThemeForegroundEnum.Light\n : IcThemeForegroundEnum.Default\n }\n ></ic-button>\n </div>\n <div\n class={{\n \"menu-container\": true,\n fullwidth: fullWidth,\n }}\n slot=\"menu\"\n >\n {menuOpen && value.length >= this.charactersUntilSuggestion && (\n <ic-menu\n class={{\n \"no-results\": this.hadNoOptions(),\n }}\n activationType=\"manual\"\n anchorEl={this.anchorEl}\n autoFocusOnSelected={false}\n inputEl={this.inputEl}\n inputLabel={label}\n ref={(el) => (this.menu = el)}\n small={small}\n fullWidth={fullWidth}\n menuId={menuId}\n open={true}\n options={filteredOptions}\n onMenuOptionSelect={this.handleOptionSelect}\n onMenuStateChange={this.handleMenuChange}\n onMenuOptionId={this.handleMenuOptionHighlight}\n parentEl={this.el}\n value={value}\n ></ic-menu>\n )}\n </div>\n </ic-text-field>\n <div\n aria-live=\"polite\"\n role=\"status\"\n class=\"search-results-status\"\n ></div>\n </Host>\n );\n }\n}\n"],"version":3}