{"file":"patternlib-language-picker.entry.js","mappings":"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","names":[],"sources":["./src/components/patternlib-language-picker/patternlib-language-picker.scss?tag=patternlib-language-picker&encapsulation=shadow","./src/components/patternlib-language-picker/patternlib-language-picker.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\n\nimport { LhLanguageSelectEvent } from '../../utils/events/select';\nimport { ClassNames } from '../../utils/interfaces';\nimport { returnScreenSize } from '../../utils/screen';\nimport { observeRootChange } from '../../utils/utils';\n\nexport interface OptionItem {\n label: string;\n value: string;\n detail: string;\n}\n\n@Component({\n tag: 'patternlib-language-picker',\n styleUrl: 'patternlib-language-picker.scss',\n shadow: true,\n})\nexport class PatternlibLanguagePicker {\n private _optionData: OptionItem[] | null = null;\n private observer: MutationObserver;\n\n @Element() hostElement: HTMLPatternlibLanguagePickerElement;\n\n /**\n * Set the LanguagePicker select options\n */\n @Prop() options: OptionItem[] | string;\n\n /**\n * Set the LanguagePicker default selected value\n */\n @Prop() selected: string;\n\n /**\n * Set the width of the Flyoutmenu in px\n */\n @Prop() width = '256px';\n\n /**\n * Show the Flyoutmenu\n */\n @Prop() show?: boolean = false;\n\n /**\n * Set the flyout position of the Flyoutmenu\n */\n @Prop() flyoutPosition: 'top' | 'bottom' | 'auto' = 'auto';\n\n /**\n * Internal state to memorize if Flyoutmenu is open\n **/\n @State() isOpen: boolean = this.show;\n\n @State() mobile = false;\n\n /**\n * Internal state to save available option items\n */\n @State() languages: OptionItem[] = [];\n\n /**\n * Internal state to save current selected option item\n */\n @State() selectedLanguage: OptionItem | null = null;\n\n /**\n * Monitoring the options data\n */\n @Watch('options')\n arrayDataWatcher(newValue: OptionItem[] | string) {\n if (typeof newValue === 'string') {\n this._optionData = JSON.parse(newValue);\n } else {\n this._optionData = newValue;\n }\n this.languages = this._optionData;\n this.stringDataWatcher(this.selected);\n }\n\n /**\n * Monitoring the selected data\n */\n @Watch('selected')\n stringDataWatcher(defaultValue: OptionItem[] | string) {\n if (typeof defaultValue === 'string' && defaultValue != '' && this._optionData !== null && this._optionData.length > 0) {\n const defaultSelectedItem = this._optionData.filter(item => item.value === defaultValue);\n this.selectedLanguage = defaultSelectedItem[0];\n }\n }\n\n /**\n * Set the LanguagePicker event for other components to listen to the selected option item\n */\n @Event({ eventName: 'lhSelect' }) select: EventEmitter;\n\n constructor() {\n this.selectItemClick = this.selectItemClick.bind(this);\n this.openFlyoutmenu = this.openFlyoutmenu.bind(this);\n this.onFlyoutClosed = this.onFlyoutClosed.bind(this);\n }\n\n componentWillLoad() {\n this.arrayDataWatcher(this.options);\n this.stringDataWatcher(this.selected);\n const screen = returnScreenSize();\n if (screen === 'isMobile') {\n this.mobile = true;\n }\n }\n\n connectedCallback() {\n const target = document.documentElement;\n const attribute = 'breakpoint';\n const options = {\n attributes: true,\n };\n\n const callback = e => {\n const screen = observeRootChange(attribute, e);\n if (screen !== null) {\n this.mobile = screen === 'isMobile';\n }\n };\n\n this.observer = new MutationObserver(callback);\n this.observer.observe(target, options);\n }\n\n disconnectedCallback() {\n this.observer.disconnect();\n }\n\n /**\n * Provide a method to monitor if the component gets clicked outside\n */\n @Listen('click', { target: 'window' })\n handleWindowClick(e) {\n if (this.isOpen) {\n if (e.target != this.hostElement) {\n this.isOpen = false;\n }\n }\n }\n\n private async openFlyoutmenu(e: MouseEvent) {\n this.isOpen = !this.isOpen;\n\n /* IE11 fix without it would also trigger handleWindowClick and set isOpen to false again */\n e.stopPropagation();\n e.preventDefault();\n }\n\n private selectItemClick(item: OptionItem) {\n return (_: MouseEvent) => {\n this.stringDataWatcher(item.value);\n this.select.emit({ selected: item.value });\n this.isOpen = false;\n };\n }\n\n private onFlyoutClosed() {\n this.isOpen = false;\n }\n\n render() {\n const flyoutmenuContentClasses: ClassNames = {\n 'grid py-4 px-0 w-full box-border': true,\n };\n\n return (\n \n \n \n \n \n
\n {this.languages?.map(item => {\n return ;\n })}\n
\n \n \n );\n }\n}\n"],"version":3}