npm - @infineon/infineon-design-system-stencil - Versions diffs - 39.5.9--canary.2093.03bc2aff532ca6fadf723c6491decb1badddcc80.0 → 39.5.9--canary.2093.8eff86be1239664ebc03c7c9e59ab0afc596d55f.0 - Mend

@infineon/infineon-design-system-stencil 39.5.9--canary.2093.03bc2aff532ca6fadf723c6491decb1badddcc80.0 → 39.5.9--canary.2093.8eff86be1239664ebc03c7c9e59ab0afc596d55f.0

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 (18) hide show

package/dist/components/ifx-date-picker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ifx-date-picker.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n\n & .asterisk { \n display: none;\n &.required {\n display: inline;\n margin-left: 4px;\n \n &.error {\n color: tokens.$ifxColorRed500;\n }\n }\n }\n\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n box-sizing: border-box;\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 0px 14px;\n box-sizing: border-box;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n\n &:disabled {\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering300;\n background-color: tokens.$ifxColorEngineering300;\n cursor: default;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &:disabled::-webkit-datetime-edit,\n &:disabled::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n z-index: 1;\n }\n\n &.firefox__classes {\n\n &:focus-visible::after {\n content: '';\n position: absolute;\n top: -4px;\n left: -4px;\n right: -4px;\n bottom: -4px;\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 15%;\n }\n\n &::before {\n content: '';\n position: absolute;\n inset: -4px;\n background-color: tokens.$ifxColorBaseWhite;\n }\n }\n}","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n \n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n // formAssociated: true,\n})\n\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Prop() value: string;\n @Prop() type: string = 'date'\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getDate(e) { \n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1; \n const year = selectedDate.getFullYear();\n \n if (!inputValue) {\n //this.internals.setFormValue(null);\n\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year});\n }\n return;\n }\n\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n input.classList.add('has-value');\n\n //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year})\n }\n }\n\n handleInputFocusOnIconClick() { \n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n if (!input) return;\n\n input.focus();\n\n if(typeof input.showPicker === 'function') {\n input.showPicker();\n } else {\n input.click();\n }\n }\n\n handleIconKeyDown(e: KeyboardEvent) {\n if (this.disabled) return;\n if (e.key === 'Enter' && this.getBrowser() === 'Firefox') {\n e.preventDefault();\n this.handleInputFocusOnIconClick();\n }\n } \n\n getBrowser() {\n if( navigator.userAgent.indexOf(\"Chrome\") != -1 ) {\n return \"Chrome\";\n } else if( navigator.userAgent.indexOf(\"Opera\") != -1 ) {\n return \"Opera\";\n } else if( navigator.userAgent.indexOf(\"MSIE\") != -1 ) {\n return \"IE\";\n } else if( navigator.userAgent.indexOf(\"Firefox\") != -1 ) {\n return \"Firefox\";\n } else {\n return \"unknown\";\n }\n }\n\n setFireFoxClasses() { \n const browser = this.getBrowser()\n const input = this.el.shadowRoot.querySelector('.date__picker-input');\n const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');\n\n if(browser === 'Firefox') { \n input.classList.add('firefox__classes')\n iconWrapper.classList.add('firefox__classes')\n } else if(input.classList.contains('firefox__classes')) { \n input.classList.remove('firefox__classes')\n iconWrapper.classList.remove('firefox__classes')\n }\n }\n\n getTabIndex(): number \| undefined {\n return this.getBrowser() === 'Firefox' ? 0 : undefined;\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-date-picker', await framework)\n }\n this.setFireFoxClasses()\n }\n\n componentWillUpdate() { \n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n // formResetCallback() {\n // this.internals.setFormValue(null);\n // }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled': ''}`}>\n\n <label class='label__wrapper' htmlFor={ this.inputId }>\n { this.label?.trim() }\n <span class={`asterisk ${this.required ? 'required' : \"\"} ${this.error ? 'error' : \"\"}`}>*</span>\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : \"\"} ${this.success ? \"success\" : \"\"}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={(e) => this.getDate(e)} />\n <div class=\"icon__wrapper\" tabIndex={this.getTabIndex()} onClick={() => this.handleInputFocusOnIconClick()} onKeyDown={(e) => this.handleIconKeyDown(e as KeyboardEvent)}>\n <ifx-icon icon='calendar16' aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n { this.caption?.trim() && (\n <div class='caption__wrapper'>\n { this.caption.trim() }\n </div> \n )}\n </div>\n )\n }\n}\n\nlet datePickerId = 0;"],"version":3}
1	+ {"file":"ifx-date-picker.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n\n & .asterisk { \n display: none;\n &.required {\n display: inline;\n margin-left: 4px;\n \n &.error {\n color: tokens.$ifxColorRed500;\n }\n }\n }\n\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n box-sizing: border-box;\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 0px 14px;\n box-sizing: border-box;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n\n &:disabled {\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering300;\n background-color: tokens.$ifxColorEngineering300;\n cursor: default;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &:disabled::-webkit-datetime-edit,\n &:disabled::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background: none;\n color: tokens.$ifxColorBaseWhite;\n &.firefox__classes { \n display: none;\n }\n }\n & .icon__wrapper { \n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n z-index: 1;\n }\n\n &.firefox__classes {\n &:focus-visible::after {\n content: '';\n position: absolute;\n top: -4px;\n left: -4px;\n right: -4px;\n bottom: -4px;\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 15%;\n }\n\n &::before {\n content: '';\n position: absolute;\n inset: -4px;\n background-color: tokens.$ifxColorBaseWhite;\n }\n }\n}","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n // formAssociated: true,\n})\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Prop() value: string;\n @Prop() type: string = 'date';\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getInput() {\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n return input;\n }\n\n getDate(e) {\n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1;\n const year = selectedDate.getFullYear();\n\n if (!inputValue) {\n //this.internals.setFormValue(null);\n\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n return;\n }\n\n const input = this.getInput();\n input.classList.add('has-value');\n\n //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n }\n\n handleIconKeyDown(e: KeyboardEvent) {\n if (this.disabled) return;\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n if (e.key === 'Enter' && browserIsFirefox) {\n e.preventDefault();\n if (input.showPicker) {\n input.showPicker();\n }\n }\n }\n\n isFirefox() {\n const isFirefox = navigator.userAgent.indexOf('Firefox') !== -1;\n return isFirefox;\n }\n\n setFireFoxClasses() {\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');\n\n if (browserIsFirefox) {\n input.classList.add('firefox__classes');\n iconWrapper.classList.add('firefox__classes');\n } else if (input.classList.contains('firefox__classes')) {\n input.classList.remove('firefox__classes');\n iconWrapper.classList.remove('firefox__classes');\n }\n }\n\n async componentDidLoad() {\n if (!isNestedInIfxComponent(this.el)) {\n const framework = detectFramework();\n trackComponent('ifx-date-picker', await framework);\n }\n this.setFireFoxClasses();\n }\n\n componentWillUpdate() {\n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n // formResetCallback() {\n // this.internals.setFormValue(null);\n // }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}`}>\n <label class=\"label__wrapper\" htmlFor={this.inputId}>\n {this.label?.trim()}\n <span class={`asterisk ${this.required ? 'required' : ''} ${this.error ? 'error' : ''}`}>*</span>\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : ''} ${this.success ? 'success' : ''}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={e => this.getDate(e)}\n />\n <div class=\"icon__wrapper\" tabIndex={this.isFirefox() ? 0 : undefined} onKeyDown={e => this.handleIconKeyDown(e as KeyboardEvent)}>\n <ifx-icon icon=\"calendar16\" aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n {this.caption?.trim() && <div class=\"caption__wrapper\">{this.caption.trim()}</div>}\n </div>\n );\n }\n}\n\nlet datePickerId = 0;\n"],"version":3}

package/dist/esm/ifx-date-picker.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, a as getElement } from './i
 import { d as detectFramework, t as trackComponent } from './framework-detection-DcmcuUOA.js';
 import { i as isNestedInIfxComponent } from './dom-utils-Bw2fh5LT.js';
-const datePickerCss = ".date__picker-container{display:flex;flex-direction:column}.date__picker-container .label__wrapper{color:#1D1D1D;font:400 1rem/1.5rem \"Source Sans 3\"}.date__picker-container .label__wrapper .asterisk{display:none}.date__picker-container .label__wrapper .asterisk.required{display:inline;margin-left:4px}.date__picker-container .label__wrapper .asterisk.required.error{color:#CD002F}.date__picker-container.disabled .label__wrapper{color:#BFBBBB}.date__picker-container.error .caption__wrapper{color:#CD002F}.date__picker-container.disabled .caption__wrapper{color:#BFBBBB}.date__picker-container .caption__wrapper{margin-top:4px;color:#1D1D1D;font:400 0.75rem/1rem \"Source Sans 3\"}.date__picker-input{box-sizing:border-box;font-family:\"Source Sans 3\";outline:none;width:100%;cursor:pointer;border-radius:1px;border:1px solid #8D8786;height:100%}.date__picker-input.firefox__classes{padding:0px 14px;box-sizing:border-box;color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px;cursor:pointer}.date__picker-input.firefox__classes:disabled{color:#FFFFFF}.date__picker-input:focus:not(.error,.success){border-color:#0A8276}.date__picker-input:hover:not(:disabled,:focus,.error,.success){border-color:#575352}.date__picker-input:disabled{border-color:#BFBBBB;background-color:#BFBBBB;cursor:default}.date__picker-input.error{border-color:#CD002F}.date__picker-input.success:not(.error){border-color:#4CA460}.date__picker-input::-webkit-datetime-edit-text{color:#8D8786;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.date__picker-input:disabled::-webkit-datetime-edit,.date__picker-input:disabled::-webkit-datetime-edit-text{color:#FFFFFF}.date__picker-input.has-value::-webkit-datetime-edit-text{color:#1D1D1D}.date__picker-input.has-value::-webkit-datetime-edit{color:#1D1D1D}::-webkit-datetime-edit{color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px}::-webkit-datetime-edit-fields-wrapper{padding:8px 16px;padding-bottom:9px;transform:translateY(1px)}::-webkit-inner-spin-button{display:none}::-webkit-calendar-picker-indicator{position:absolute;right:15px;font-size:19px;cursor:pointer;border-radius:1px}::-webkit-calendar-picker-indicator:focus-within{outline:2px solid #0A8276;outline-offset:2px}.input__wrapper{display:flex;justify-content:space-between;align-items:center;align-self:stretch;background:#FFFFFF;position:relative}.input__wrapper.large{height:40px}.input__wrapper.small{height:36px}.input__wrapper.disabled .icon__wrapper{background-color:#BFBBBB;color:#FFFFFF}.icon__wrapper{position:absolute;right:17px;padding:2px;display:flex;justify-content:flex-end;align-items:center;pointer-events:none;z-index:100;background-color:#FFFFFF;line-height:16px}.icon__wrapper ifx-icon{vertical-align:middle;z-index:1}.icon__wrapper.firefox__classes:focus-visible::after{content:\"\";position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;border:2px solid #0A8276;border-radius:15%}.icon__wrapper.firefox__classes::before{content:\"\";position:absolute;inset:-4px;background-color:#FFFFFF}";
+const datePickerCss = ".date__picker-container{display:flex;flex-direction:column}.date__picker-container .label__wrapper{color:#1D1D1D;font:400 1rem/1.5rem \"Source Sans 3\"}.date__picker-container .label__wrapper .asterisk{display:none}.date__picker-container .label__wrapper .asterisk.required{display:inline;margin-left:4px}.date__picker-container .label__wrapper .asterisk.required.error{color:#CD002F}.date__picker-container.disabled .label__wrapper{color:#BFBBBB}.date__picker-container.error .caption__wrapper{color:#CD002F}.date__picker-container.disabled .caption__wrapper{color:#BFBBBB}.date__picker-container .caption__wrapper{margin-top:4px;color:#1D1D1D;font:400 0.75rem/1rem \"Source Sans 3\"}.date__picker-input{box-sizing:border-box;font-family:\"Source Sans 3\";outline:none;width:100%;cursor:pointer;border-radius:1px;border:1px solid #8D8786;height:100%}.date__picker-input.firefox__classes{padding:0px 14px;box-sizing:border-box;color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px;cursor:pointer}.date__picker-input.firefox__classes:disabled{color:#FFFFFF}.date__picker-input:focus:not(.error,.success){border-color:#0A8276}.date__picker-input:hover:not(:disabled,:focus,.error,.success){border-color:#575352}.date__picker-input:disabled{border-color:#BFBBBB;background-color:#BFBBBB;cursor:default}.date__picker-input.error{border-color:#CD002F}.date__picker-input.success:not(.error){border-color:#4CA460}.date__picker-input::-webkit-datetime-edit-text{color:#8D8786;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.date__picker-input:disabled::-webkit-datetime-edit,.date__picker-input:disabled::-webkit-datetime-edit-text{color:#FFFFFF}.date__picker-input.has-value::-webkit-datetime-edit-text{color:#1D1D1D}.date__picker-input.has-value::-webkit-datetime-edit{color:#1D1D1D}::-webkit-datetime-edit{color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px}::-webkit-datetime-edit-fields-wrapper{padding:8px 16px;padding-bottom:9px;transform:translateY(1px)}::-webkit-inner-spin-button{display:none}::-webkit-calendar-picker-indicator{position:absolute;right:15px;font-size:19px;cursor:pointer;border-radius:1px}::-webkit-calendar-picker-indicator:focus-within{outline:2px solid #0A8276;outline-offset:2px}.input__wrapper{display:flex;justify-content:space-between;align-items:center;align-self:stretch;background:#FFFFFF;position:relative}.input__wrapper.large{height:40px}.input__wrapper.small{height:36px}.input__wrapper.disabled .icon__wrapper{background:none;color:#FFFFFF}.input__wrapper.disabled .icon__wrapper.firefox__classes{display:none}.input__wrapper.disabled .icon__wrapper{background-color:#BFBBBB;color:#FFFFFF}.icon__wrapper{position:absolute;right:17px;padding:2px;display:flex;justify-content:flex-end;align-items:center;pointer-events:none;z-index:100;background-color:#FFFFFF;line-height:16px}.icon__wrapper ifx-icon{vertical-align:middle;z-index:1}.icon__wrapper.firefox__classes:focus-visible::after{content:\"\";position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;border:2px solid #0A8276;border-radius:15%}.icon__wrapper.firefox__classes::before{content:\"\";position:absolute;inset:-4px;background-color:#FFFFFF}";
 const DatePicker = class {
     constructor(hostRef) {
@@ -24,6 +24,10 @@ const DatePicker = class {
         this.required = false;
         this.autocomplete = 'on';
     }
+    getInput() {
+        const input = this.el.shadowRoot.querySelector('.date__picker-input');
+        return input;
+    }
     getDate(e) {
         const inputValue = e.target.value;
         const selectedDate = new Date(inputValue);
@@ -42,7 +46,7 @@ const DatePicker = class {
             }
             return;
         }
-        const input = this.el.shadowRoot.querySelector('.date__picker-input');
+        const input = this.getInput();
         input.classList.add('has-value');
         //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))
         if (this.type === 'datetime-local') {
@@ -54,48 +58,27 @@ const DatePicker = class {
             this.ifxDate.emit({ day, month, year });
         }
     }
-    handleInputFocusOnIconClick() {
-        const input = this.el.shadowRoot.querySelector('.date__picker-input');
-        if (!input)
-            return;
-        input.focus();
-        if (typeof input.showPicker === 'function') {
-            input.showPicker();
-        }
-        else {
-            input.click();
-        }
-    }
     handleIconKeyDown(e) {
         if (this.disabled)
             return;
-        if (e.key === 'Enter' && this.getBrowser() === 'Firefox') {
+        const browserIsFirefox = this.isFirefox();
+        const input = this.getInput();
+        if (e.key === 'Enter' && browserIsFirefox) {
             e.preventDefault();
-            this.handleInputFocusOnIconClick();
+            if (input.showPicker) {
+                input.showPicker();
+            }
         }
     }
-    getBrowser() {
-        if (navigator.userAgent.indexOf("Chrome") != -1) {
-            return "Chrome";
-        }
-        else if (navigator.userAgent.indexOf("Opera") != -1) {
-            return "Opera";
-        }
-        else if (navigator.userAgent.indexOf("MSIE") != -1) {
-            return "IE";
-        }
-        else if (navigator.userAgent.indexOf("Firefox") != -1) {
-            return "Firefox";
-        }
-        else {
-            return "unknown";
-        }
+    isFirefox() {
+        const isFirefox = navigator.userAgent.indexOf('Firefox') !== -1;
+        return isFirefox;
     }
     setFireFoxClasses() {
-        const browser = this.getBrowser();
-        const input = this.el.shadowRoot.querySelector('.date__picker-input');
+        const browserIsFirefox = this.isFirefox();
+        const input = this.getInput();
         const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');
-        if (browser === 'Firefox') {
+        if (browserIsFirefox) {
             input.classList.add('firefox__classes');
             iconWrapper.classList.add('firefox__classes');
         }
@@ -104,9 +87,6 @@ const DatePicker = class {
             iconWrapper.classList.remove('firefox__classes');
         }
     }
-    getTabIndex() {
-        return this.getBrowser() === 'Firefox' ? 0 : undefined;
-    }
     async componentDidLoad() {
         if (!isNestedInIfxComponent(this.el)) {
             const framework = detectFramework();
@@ -124,8 +104,8 @@ const DatePicker = class {
     // }
     render() {
         var _a, _b;
-        return (h("div", { key: '4d127a913e88df8287ad825db4680dcc86624811', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '85d337e9fffc97fdbbb2809ecc6b60eda975c085', class: 'label__wrapper', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.trim(), h("span", { key: 'c31f701469375a183cac02178a36dbec1a073d4e', class: `asterisk ${this.required ? 'required' : ""} ${this.error ? 'error' : ""}` }, "*")), h("div", { key: '1d8b0be7ee3fd6490705ab3b8a876e76e7e764bc', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '930bc9dc48a17122a0b4a8d047830513e6c8b856', type: this.type, autocomplete: this.autocomplete, class: `date__picker-input ${this.error ? 'error' : ""} ${this.success ? "success" : ""}`, disabled: this.disabled ? true : undefined, "aria-invalid": this.error ? true : undefined, "aria-label": this.ariaLabel, max: this.max, min: this.min, value: this.value, required: this.required, onChange: (e) => this.getDate(e) }), h("div", { key: 'e8633bbf5ac2726851b343be22c1e1833c45dbfd', class: "icon__wrapper", tabIndex: this.getTabIndex(), onClick: () => this.handleInputFocusOnIconClick(), onKeyDown: (e) => this.handleIconKeyDown(e) }, h("ifx-icon", { key: 'be198db9b59c1140a2857ba9ca319d7e32571fb7', icon: 'calendar16', "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: '7fb86a0f789061c5998f3a58665d68bd8e0b1395', class: 'caption__wrapper' }, this.caption.trim()))));
+        return (h("div", { key: 'c5a9cbf6cf78e68f29e469c47d225b7fa43395ce', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '58768f5801a2af813731546261fa2f4b1071c3ea', class: "label__wrapper", htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.trim(), h("span", { key: '3549aefb36c31c78bcf40b0d4b7eccacd4254fea', class: `asterisk ${this.required ? 'required' : ''} ${this.error ? 'error' : ''}` }, "*")), h("div", { key: '56d78df19a3cd59f0c7d2d23c50e204e77c9db98', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '0df030854c2d0cbbd13d0d06a5af7503f91cbf7c', type: this.type, autocomplete: this.autocomplete, class: `date__picker-input ${this.error ? 'error' : ''} ${this.success ? 'success' : ''}`, disabled: this.disabled ? true : undefined, "aria-invalid": this.error ? true : undefined, "aria-label": this.ariaLabel, max: this.max, min: this.min, value: this.value, required: this.required, onChange: e => this.getDate(e) }), h("div", { key: '70cbc9028903d19b1a07991f8c5ca89a39a244b5', class: "icon__wrapper", tabIndex: this.isFirefox() ? 0 : undefined, onKeyDown: e => this.handleIconKeyDown(e) }, h("ifx-icon", { key: '8c6cecb12e9f388a0db594236753922db6a44fb8', icon: "calendar16", "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && h("div", { key: 'e730e0de7be1c2c79cf03f8dafccf341b0b59990', class: "caption__wrapper" }, this.caption.trim())));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/ifx-date-picker.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ifx-date-picker.entry.js","sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n\n & .asterisk { \n display: none;\n &.required {\n display: inline;\n margin-left: 4px;\n \n &.error {\n color: tokens.$ifxColorRed500;\n }\n }\n }\n\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n box-sizing: border-box;\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 0px 14px;\n box-sizing: border-box;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n\n &:disabled {\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering300;\n background-color: tokens.$ifxColorEngineering300;\n cursor: default;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &:disabled::-webkit-datetime-edit,\n &:disabled::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n z-index: 1;\n }\n\n &.firefox__classes {\n\n &:focus-visible::after {\n content: '';\n position: absolute;\n top: -4px;\n left: -4px;\n right: -4px;\n bottom: -4px;\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 15%;\n }\n\n &::before {\n content: '';\n position: absolute;\n inset: -4px;\n background-color: tokens.$ifxColorBaseWhite;\n }\n }\n}","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n \n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n // formAssociated: true,\n})\n\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Prop() value: string;\n @Prop() type: string = 'date'\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getDate(e) { \n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1; \n const year = selectedDate.getFullYear();\n \n if (!inputValue) {\n //this.internals.setFormValue(null);\n\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year});\n }\n return;\n }\n\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n input.classList.add('has-value');\n\n //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year})\n }\n }\n\n handleInputFocusOnIconClick() { \n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n if (!input) return;\n\n input.focus();\n\n if(typeof input.showPicker === 'function') {\n input.showPicker();\n } else {\n input.click();\n }\n }\n\n handleIconKeyDown(e: KeyboardEvent) {\n if (this.disabled) return;\n if (e.key === 'Enter' && this.getBrowser() === 'Firefox') {\n e.preventDefault();\n this.handleInputFocusOnIconClick();\n }\n } \n\n getBrowser() {\n if( navigator.userAgent.indexOf(\"Chrome\") != -1 ) {\n return \"Chrome\";\n } else if( navigator.userAgent.indexOf(\"Opera\") != -1 ) {\n return \"Opera\";\n } else if( navigator.userAgent.indexOf(\"MSIE\") != -1 ) {\n return \"IE\";\n } else if( navigator.userAgent.indexOf(\"Firefox\") != -1 ) {\n return \"Firefox\";\n } else {\n return \"unknown\";\n }\n }\n\n setFireFoxClasses() { \n const browser = this.getBrowser()\n const input = this.el.shadowRoot.querySelector('.date__picker-input');\n const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');\n\n if(browser === 'Firefox') { \n input.classList.add('firefox__classes')\n iconWrapper.classList.add('firefox__classes')\n } else if(input.classList.contains('firefox__classes')) { \n input.classList.remove('firefox__classes')\n iconWrapper.classList.remove('firefox__classes')\n }\n }\n\n getTabIndex(): number \| undefined {\n return this.getBrowser() === 'Firefox' ? 0 : undefined;\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-date-picker', await framework)\n }\n this.setFireFoxClasses()\n }\n\n componentWillUpdate() { \n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n // formResetCallback() {\n // this.internals.setFormValue(null);\n // }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled': ''}`}>\n\n <label class='label__wrapper' htmlFor={ this.inputId }>\n { this.label?.trim() }\n <span class={`asterisk ${this.required ? 'required' : \"\"} ${this.error ? 'error' : \"\"}`}>*</span>\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : \"\"} ${this.success ? \"success\" : \"\"}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={(e) => this.getDate(e)} />\n <div class=\"icon__wrapper\" tabIndex={this.getTabIndex()} onClick={() => this.handleInputFocusOnIconClick()} onKeyDown={(e) => this.handleIconKeyDown(e as KeyboardEvent)}>\n <ifx-icon icon='calendar16' aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n { this.caption?.trim() && (\n <div class='caption__wrapper'>\n { this.caption.trim() }\n </div> \n )}\n </div>\n )\n }\n}\n\nlet datePickerId = 0;"],"names":[],"mappings":";;;;AAAA,MAAM,aAAa,GAAG,wjGAAwjG;;MCajkG,UAAU,GAAA,MAAA;AAPvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;;;;;;AAQU,QAAA,IAAA,CAAA,OAAO,GAAW,mBAAmB,EAAE,YAAY,EAAE;AAGrD,QAAA,IAAI,CAAA,IAAA,GAAW,GAAG;AAClB,QAAA,IAAK,CAAA,KAAA,GAAY,KAAK;AACtB,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AACxB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAGzB,QAAA,IAAI,CAAA,IAAA,GAAW,MAAM;AAGrB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAGzB,QAAA,IAAY,CAAA,YAAA,GAAW,IAAI;AAiJpC;AA3IC,IAAA,OAAO,CAAC,CAAC,EAAA;AACP,QAAA,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK;AACjC,QAAA,MAAM,YAAY,GAAG,IAAI,IAAI,CAAC,UAAU,CAAC;AACzC,QAAA,MAAM,GAAG,GAAG,YAAY,CAAC,OAAO,EAAE;QAClC,MAAM,KAAK,GAAG,YAAY,CAAC,QAAQ,EAAE,GAAG,CAAC;AACzC,QAAA,MAAM,IAAI,GAAG,YAAY,CAAC,WAAW,EAAE;QAEvC,IAAI,CAAC,UAAU,EAAE;;AAGf,YAAA,IAAG,IAAI,CAAC,IAAI,KAAK,gBAAgB,EAAE;AACjC,gBAAA,MAAM,KAAK,GAAG,YAAY,CAAC,QAAQ,EAAE;AACrC,gBAAA,MAAM,OAAO,GAAG,YAAY,CAAC,UAAU,EAAE;AACzC,gBAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAC,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAC,CAAC;;iBAChD;AACL,gBAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAC,GAAG,EAAE,KAAK,EAAE,IAAI,EAAC,CAAC;;YAEvC;;AAGF,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,CAAqB;AACzF,QAAA,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC;;AAGhC,QAAA,IAAG,IAAI,CAAC,IAAI,KAAK,gBAAgB,EAAE;AACjC,YAAA,MAAM,KAAK,GAAG,YAAY,CAAC,QAAQ,EAAE;AACrC,YAAA,MAAM,OAAO,GAAG,YAAY,CAAC,UAAU,EAAE;AACzC,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAC,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAC,CAAC;;aAChD;AACL,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAC,GAAG,EAAE,KAAK,EAAE,IAAI,EAAC,CAAC;;;IAIzC,2BAA2B,GAAA;AACzB,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,CAAqB;AACzF,QAAA,IAAI,CAAC,KAAK;YAAE;QAEZ,KAAK,CAAC,KAAK,EAAE;AAEb,QAAA,IAAG,OAAO,KAAK,CAAC,UAAU,KAAK,UAAU,EAAE;YACzC,KAAK,CAAC,UAAU,EAAE;;aACb;YACL,KAAK,CAAC,KAAK,EAAE;;;AAIjB,IAAA,iBAAiB,CAAC,CAAgB,EAAA;QAChC,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,IAAI,CAAC,UAAU,EAAE,KAAK,SAAS,EAAE;YACxD,CAAC,CAAC,cAAc,EAAE;YAClB,IAAI,CAAC,2BAA2B,EAAE;;;IAIvC,UAAU,GAAA;AACP,QAAA,IAAI,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAG;AAChD,YAAA,OAAO,QAAQ;;AACV,aAAA,IAAI,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,EAAG;AACtD,YAAA,OAAO,OAAO;;AACT,aAAA,IAAI,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,EAAG;AACrD,YAAA,OAAO,IAAI;;AACN,aAAA,IAAI,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,EAAG;AACxD,YAAA,OAAO,SAAS;;aACX;AACL,YAAA,OAAO,SAAS;;;IAIpB,iBAAiB,GAAA;AACf,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE;AACjC,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,CAAC;AACrE,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,gBAAgB,CAAC;AAEtE,QAAA,IAAG,OAAO,KAAK,SAAS,EAAE;AACxB,YAAA,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC;AACvC,YAAA,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC;;aACxC,IAAG,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE;AACtD,YAAA,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC;AAC1C,YAAA,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC;;;IAIpD,WAAW,GAAA;AACT,QAAA,OAAO,IAAI,CAAC,UAAU,EAAE,KAAK,SAAS,GAAG,CAAC,GAAG,SAAS;;AAGxD,IAAA,MAAM,gBAAgB,GAAA;QACpB,IAAG,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;AACnC,YAAA,MAAM,SAAS,GAAG,eAAe,EAAE;AACnC,YAAA,cAAc,CAAC,iBAAiB,EAAE,MAAM,SAAS,CAAC;;QAEpD,IAAI,CAAC,iBAAiB,EAAE;;IAG1B,mBAAmB,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;;;;;;IAQnD,MAAM,GAAA;;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,uBAAA,EAA0B,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAE,EAAE,EAAE,EAAA,EAEjG,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAG,IAAI,CAAC,OAAO,EAAA,EAChD,CAAA,EAAA,GAAA,IAAI,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA;AAAE,YAAA,EAAA,CAAA,IAAI,EAAE,EACpB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,YAAY,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE,CAAE,CAAA,EAAA,EAAA,GAAA,CAAU,CAC3F,EAER,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,kBAAkB,IAAI,CAAC,IAAI,KAAK,GAAG,GAAG,OAAO,GAAG,OAAO,CAAA,CAAA,EAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EAAA,EACtG,CACA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,KAAK,EAAE,CAAsB,mBAAA,EAAA,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,EAAE,CAAA,CAAE,EACzF,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,SAAS,kBAC5B,IAAI,CAAC,KAAK,GAAG,IAAI,GAAG,SAAS,EAC/B,YAAA,EAAA,IAAI,CAAC,SAAS,EAC1B,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAI,CAAA,EACpC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,2BAA2B,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAkB,CAAC,EAAA,EACtK,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,YAAY,iBAAa,MAAM,EAAA,CAAY,CACtD,CACF,EAEJ,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,EAAE,MAClB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,kBAAkB,EACzB,EAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CACjB,CACP,CACC;;;;AAKZ,IAAI,YAAY,GAAG,CAAC;;;;;"}
1	+ {"version":3,"file":"ifx-date-picker.entry.js","sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n\n & .asterisk { \n display: none;\n &.required {\n display: inline;\n margin-left: 4px;\n \n &.error {\n color: tokens.$ifxColorRed500;\n }\n }\n }\n\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n box-sizing: border-box;\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 0px 14px;\n box-sizing: border-box;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n\n &:disabled {\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering300;\n background-color: tokens.$ifxColorEngineering300;\n cursor: default;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &:disabled::-webkit-datetime-edit,\n &:disabled::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background: none;\n color: tokens.$ifxColorBaseWhite;\n &.firefox__classes { \n display: none;\n }\n }\n & .icon__wrapper { \n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n z-index: 1;\n }\n\n &.firefox__classes {\n &:focus-visible::after {\n content: '';\n position: absolute;\n top: -4px;\n left: -4px;\n right: -4px;\n bottom: -4px;\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 15%;\n }\n\n &::before {\n content: '';\n position: absolute;\n inset: -4px;\n background-color: tokens.$ifxColorBaseWhite;\n }\n }\n}","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n // formAssociated: true,\n})\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Prop() value: string;\n @Prop() type: string = 'date';\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getInput() {\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n return input;\n }\n\n getDate(e) {\n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1;\n const year = selectedDate.getFullYear();\n\n if (!inputValue) {\n //this.internals.setFormValue(null);\n\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n return;\n }\n\n const input = this.getInput();\n input.classList.add('has-value');\n\n //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n }\n\n handleIconKeyDown(e: KeyboardEvent) {\n if (this.disabled) return;\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n if (e.key === 'Enter' && browserIsFirefox) {\n e.preventDefault();\n if (input.showPicker) {\n input.showPicker();\n }\n }\n }\n\n isFirefox() {\n const isFirefox = navigator.userAgent.indexOf('Firefox') !== -1;\n return isFirefox;\n }\n\n setFireFoxClasses() {\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');\n\n if (browserIsFirefox) {\n input.classList.add('firefox__classes');\n iconWrapper.classList.add('firefox__classes');\n } else if (input.classList.contains('firefox__classes')) {\n input.classList.remove('firefox__classes');\n iconWrapper.classList.remove('firefox__classes');\n }\n }\n\n async componentDidLoad() {\n if (!isNestedInIfxComponent(this.el)) {\n const framework = detectFramework();\n trackComponent('ifx-date-picker', await framework);\n }\n this.setFireFoxClasses();\n }\n\n componentWillUpdate() {\n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n // formResetCallback() {\n // this.internals.setFormValue(null);\n // }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}`}>\n <label class=\"label__wrapper\" htmlFor={this.inputId}>\n {this.label?.trim()}\n <span class={`asterisk ${this.required ? 'required' : ''} ${this.error ? 'error' : ''}`}>*</span>\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : ''} ${this.success ? 'success' : ''}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={e => this.getDate(e)}\n />\n <div class=\"icon__wrapper\" tabIndex={this.isFirefox() ? 0 : undefined} onKeyDown={e => this.handleIconKeyDown(e as KeyboardEvent)}>\n <ifx-icon icon=\"calendar16\" aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n {this.caption?.trim() && <div class=\"caption__wrapper\">{this.caption.trim()}</div>}\n </div>\n );\n }\n}\n\nlet datePickerId = 0;\n"],"names":[],"mappings":";;;;AAAA,MAAM,aAAa,GAAG,osGAAosG;;MCY7sG,UAAU,GAAA,MAAA;AANvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;;;;;;AAOU,QAAA,IAAA,CAAA,OAAO,GAAW,mBAAmB,EAAE,YAAY,EAAE;AAGrD,QAAA,IAAI,CAAA,IAAA,GAAW,GAAG;AAClB,QAAA,IAAK,CAAA,KAAA,GAAY,KAAK;AACtB,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AACxB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAGzB,QAAA,IAAI,CAAA,IAAA,GAAW,MAAM;AAGrB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAGzB,QAAA,IAAY,CAAA,YAAA,GAAW,IAAI;AA4HpC;IAtHC,QAAQ,GAAA;AACN,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,CAAqB;AACzF,QAAA,OAAO,KAAK;;AAGd,IAAA,OAAO,CAAC,CAAC,EAAA;AACP,QAAA,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK;AACjC,QAAA,MAAM,YAAY,GAAG,IAAI,IAAI,CAAC,UAAU,CAAC;AACzC,QAAA,MAAM,GAAG,GAAG,YAAY,CAAC,OAAO,EAAE;QAClC,MAAM,KAAK,GAAG,YAAY,CAAC,QAAQ,EAAE,GAAG,CAAC;AACzC,QAAA,MAAM,IAAI,GAAG,YAAY,CAAC,WAAW,EAAE;QAEvC,IAAI,CAAC,UAAU,EAAE;;AAGf,YAAA,IAAI,IAAI,CAAC,IAAI,KAAK,gBAAgB,EAAE;AAClC,gBAAA,MAAM,KAAK,GAAG,YAAY,CAAC,QAAQ,EAAE;AACrC,gBAAA,MAAM,OAAO,GAAG,YAAY,CAAC,UAAU,EAAE;AACzC,gBAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC;;iBAClD;AACL,gBAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;;YAEzC;;AAGF,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;AAC7B,QAAA,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC;;AAGhC,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,gBAAgB,EAAE;AAClC,YAAA,MAAM,KAAK,GAAG,YAAY,CAAC,QAAQ,EAAE;AACrC,YAAA,MAAM,OAAO,GAAG,YAAY,CAAC,UAAU,EAAE;AACzC,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC;;aAClD;AACL,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;;;AAI3C,IAAA,iBAAiB,CAAC,CAAgB,EAAA;QAChC,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,EAAE;AACzC,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;QAC7B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,gBAAgB,EAAE;YACzC,CAAC,CAAC,cAAc,EAAE;AAClB,YAAA,IAAI,KAAK,CAAC,UAAU,EAAE;gBACpB,KAAK,CAAC,UAAU,EAAE;;;;IAKxB,SAAS,GAAA;AACP,QAAA,MAAM,SAAS,GAAG,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE;AAC/D,QAAA,OAAO,SAAS;;IAGlB,iBAAiB,GAAA;AACf,QAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,EAAE;AACzC,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;AAC7B,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,gBAAgB,CAAC;QAEtE,IAAI,gBAAgB,EAAE;AACpB,YAAA,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC;AACvC,YAAA,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC;;aACxC,IAAI,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE;AACvD,YAAA,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC;AAC1C,YAAA,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC;;;AAIpD,IAAA,MAAM,gBAAgB,GAAA;QACpB,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;AACpC,YAAA,MAAM,SAAS,GAAG,eAAe,EAAE;AACnC,YAAA,cAAc,CAAC,iBAAiB,EAAE,MAAM,SAAS,CAAC;;QAEpD,IAAI,CAAC,iBAAiB,EAAE;;IAG1B,mBAAmB,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;;;;;;IAQnD,MAAM,GAAA;;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,uBAAA,EAA0B,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EAAA,EAClG,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,EAAA,EAChD,CAAA,EAAA,GAAA,IAAI,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA;AAAE,YAAA,EAAA,CAAA,IAAI,EAAE,EACnB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,YAAY,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE,CAAA,CAAE,EAAA,EAAA,GAAA,CAAU,CAC3F,EAER,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,eAAA,EAAkB,IAAI,CAAC,IAAI,KAAK,GAAG,GAAG,OAAO,GAAG,OAAO,CAAI,CAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAA,CAAE,EAAA,EACtG,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,KAAK,EAAE,CAAsB,mBAAA,EAAA,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,EAAE,CAAE,CAAA,EACzF,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,SAAS,kBAC5B,IAAI,CAAC,KAAK,GAAG,IAAI,GAAG,SAAS,EAAA,YAAA,EAC/B,IAAI,CAAC,SAAS,EAC1B,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAC9B,CAAA,EACF,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,GAAG,SAAS,EAAE,SAAS,EAAE,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAkB,CAAC,EAAA,EAC/H,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,YAAY,iBAAa,MAAM,EAAA,CAAY,CACtD,CACF,EAEL,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,0CAAE,IAAI,EAAE,KAAI,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,kBAAkB,EAAE,EAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAO,CAC9E;;;;AAKZ,IAAI,YAAY,GAAG,CAAC;;;;;"}

package/dist/infineon-design-system-stencil/ifx-date-picker.entry.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ifx-date-picker.entry.esm.js","sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n\n & .asterisk { \n display: none;\n &.required {\n display: inline;\n margin-left: 4px;\n \n &.error {\n color: tokens.$ifxColorRed500;\n }\n }\n }\n\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n box-sizing: border-box;\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 0px 14px;\n box-sizing: border-box;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n\n &:disabled {\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering300;\n background-color: tokens.$ifxColorEngineering300;\n cursor: default;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &:disabled::-webkit-datetime-edit,\n &:disabled::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n z-index: 1;\n }\n\n &.firefox__classes {\n\n &:focus-visible::after {\n content: '';\n position: absolute;\n top: -4px;\n left: -4px;\n right: -4px;\n bottom: -4px;\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 15%;\n }\n\n &::before {\n content: '';\n position: absolute;\n inset: -4px;\n background-color: tokens.$ifxColorBaseWhite;\n }\n }\n}","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n \n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n // formAssociated: true,\n})\n\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Prop() value: string;\n @Prop() type: string = 'date'\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getDate(e) { \n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1; \n const year = selectedDate.getFullYear();\n \n if (!inputValue) {\n //this.internals.setFormValue(null);\n\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year});\n }\n return;\n }\n\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n input.classList.add('has-value');\n\n //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year})\n }\n }\n\n handleInputFocusOnIconClick() { \n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n if (!input) return;\n\n input.focus();\n\n if(typeof input.showPicker === 'function') {\n input.showPicker();\n } else {\n input.click();\n }\n }\n\n handleIconKeyDown(e: KeyboardEvent) {\n if (this.disabled) return;\n if (e.key === 'Enter' && this.getBrowser() === 'Firefox') {\n e.preventDefault();\n this.handleInputFocusOnIconClick();\n }\n } \n\n getBrowser() {\n if( navigator.userAgent.indexOf(\"Chrome\") != -1 ) {\n return \"Chrome\";\n } else if( navigator.userAgent.indexOf(\"Opera\") != -1 ) {\n return \"Opera\";\n } else if( navigator.userAgent.indexOf(\"MSIE\") != -1 ) {\n return \"IE\";\n } else if( navigator.userAgent.indexOf(\"Firefox\") != -1 ) {\n return \"Firefox\";\n } else {\n return \"unknown\";\n }\n }\n\n setFireFoxClasses() { \n const browser = this.getBrowser()\n const input = this.el.shadowRoot.querySelector('.date__picker-input');\n const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');\n\n if(browser === 'Firefox') { \n input.classList.add('firefox__classes')\n iconWrapper.classList.add('firefox__classes')\n } else if(input.classList.contains('firefox__classes')) { \n input.classList.remove('firefox__classes')\n iconWrapper.classList.remove('firefox__classes')\n }\n }\n\n getTabIndex(): number \| undefined {\n return this.getBrowser() === 'Firefox' ? 0 : undefined;\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-date-picker', await framework)\n }\n this.setFireFoxClasses()\n }\n\n componentWillUpdate() { \n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n // formResetCallback() {\n // this.internals.setFormValue(null);\n // }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled': ''}`}>\n\n <label class='label__wrapper' htmlFor={ this.inputId }>\n { this.label?.trim() }\n <span class={`asterisk ${this.required ? 'required' : \"\"} ${this.error ? 'error' : \"\"}`}>*</span>\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : \"\"} ${this.success ? \"success\" : \"\"}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={(e) => this.getDate(e)} />\n <div class=\"icon__wrapper\" tabIndex={this.getTabIndex()} onClick={() => this.handleInputFocusOnIconClick()} onKeyDown={(e) => this.handleIconKeyDown(e as KeyboardEvent)}>\n <ifx-icon icon='calendar16' aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n { this.caption?.trim() && (\n <div class='caption__wrapper'>\n { this.caption.trim() }\n </div> \n )}\n </div>\n )\n }\n}\n\nlet datePickerId = 0;"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"ifx-date-picker.entry.esm.js","sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n\n & .asterisk { \n display: none;\n &.required {\n display: inline;\n margin-left: 4px;\n \n &.error {\n color: tokens.$ifxColorRed500;\n }\n }\n }\n\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n box-sizing: border-box;\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 0px 14px;\n box-sizing: border-box;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n\n &:disabled {\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering300;\n background-color: tokens.$ifxColorEngineering300;\n cursor: default;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &:disabled::-webkit-datetime-edit,\n &:disabled::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background: none;\n color: tokens.$ifxColorBaseWhite;\n &.firefox__classes { \n display: none;\n }\n }\n & .icon__wrapper { \n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n z-index: 1;\n }\n\n &.firefox__classes {\n &:focus-visible::after {\n content: '';\n position: absolute;\n top: -4px;\n left: -4px;\n right: -4px;\n bottom: -4px;\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 15%;\n }\n\n &::before {\n content: '';\n position: absolute;\n inset: -4px;\n background-color: tokens.$ifxColorBaseWhite;\n }\n }\n}","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n // formAssociated: true,\n})\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Prop() value: string;\n @Prop() type: string = 'date';\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getInput() {\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n return input;\n }\n\n getDate(e) {\n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1;\n const year = selectedDate.getFullYear();\n\n if (!inputValue) {\n //this.internals.setFormValue(null);\n\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n return;\n }\n\n const input = this.getInput();\n input.classList.add('has-value');\n\n //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n }\n\n handleIconKeyDown(e: KeyboardEvent) {\n if (this.disabled) return;\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n if (e.key === 'Enter' && browserIsFirefox) {\n e.preventDefault();\n if (input.showPicker) {\n input.showPicker();\n }\n }\n }\n\n isFirefox() {\n const isFirefox = navigator.userAgent.indexOf('Firefox') !== -1;\n return isFirefox;\n }\n\n setFireFoxClasses() {\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');\n\n if (browserIsFirefox) {\n input.classList.add('firefox__classes');\n iconWrapper.classList.add('firefox__classes');\n } else if (input.classList.contains('firefox__classes')) {\n input.classList.remove('firefox__classes');\n iconWrapper.classList.remove('firefox__classes');\n }\n }\n\n async componentDidLoad() {\n if (!isNestedInIfxComponent(this.el)) {\n const framework = detectFramework();\n trackComponent('ifx-date-picker', await framework);\n }\n this.setFireFoxClasses();\n }\n\n componentWillUpdate() {\n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n // formResetCallback() {\n // this.internals.setFormValue(null);\n // }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}`}>\n <label class=\"label__wrapper\" htmlFor={this.inputId}>\n {this.label?.trim()}\n <span class={`asterisk ${this.required ? 'required' : ''} ${this.error ? 'error' : ''}`}>*</span>\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : ''} ${this.success ? 'success' : ''}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={e => this.getDate(e)}\n />\n <div class=\"icon__wrapper\" tabIndex={this.isFirefox() ? 0 : undefined} onKeyDown={e => this.handleIconKeyDown(e as KeyboardEvent)}>\n <ifx-icon icon=\"calendar16\" aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n {this.caption?.trim() && <div class=\"caption__wrapper\">{this.caption.trim()}</div>}\n </div>\n );\n }\n}\n\nlet datePickerId = 0;\n"],"names":[],"mappings":"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"}

package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{p as e,H as a,g as l,b as i}from"./p-DtIEDtZ8.js";export{s as setNonce}from"./p-DtIEDtZ8.js";var t=()=>{{n(a.prototype)}const l=import.meta.url;const i={};if(l!==""){i.resourcesUrl=new URL(".",l).href}return e(i)};var n=e=>{const a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}const l=a.call(this,false);const i=this.childNodes;if(e){for(let e=0;e<i.length;e++){if(i[e].nodeType!==2){l.appendChild(i[e].cloneNode(true))}}}return l}};t().then((async e=>{await l();return i(JSON.parse('[["p-0d9da371",[[257,"ifx-table",{"cols":[8],"rows":[8],"buttonRendererOptions":[16,"button-renderer-options"],"iconButtonRendererOptions":[16,"icon-button-renderer-options"],"checkboxRendererOptions":[16,"checkbox-renderer-options"],"rowHeight":[1,"row-height"],"tableHeight":[1,"table-height"],"pagination":[4],"paginationItemsPerPage":[1,"pagination-items-per-page"],"filterOrientation":[1,"filter-orientation"],"headline":[1],"variant":[1],"serverSidePagination":[4,"server-side-pagination"],"serverPageChangeHandler":[16,"server-page-change-handler"],"enableSelection":[4,"enable-selection"],"showLoading":[4,"show-loading"],"currentPage":[32],"rowData":[32],"colData":[32],"filterOptions":[32],"currentFilters":[32],"uniqueKey":[32],"paginationPageSize":[32],"showSidebarFilters":[32],"matchingResultsCount":[32],"selectedRows":[32],"selectAll":[32],"selectedRowsData":[32],"onBtShowLoading":[64]},[[0,"ifxItemsPerPageChange","handleResultsPerPageChange"],[0,"ifxChange","handleChipChange"]],{"rows":["rowsChanged"],"cols":["colsChanged"],"buttonRendererOptions":["onButtonRendererOptionsChanged"],"iconButtonRendererOptions":["onIconButtonRendererOptionsChanged"],"checkboxRendererOptions":["onCheckboxRendererOptionsChanged"]}]]],["p-372fa9eb",[[257,"ifx-templates-ui",null,[[0,"fieldError","handleError"],[0,"toggleTemplates","filterTemplates"]]]]],["p-d4fea918",[[257,"ifx-set-filter",{"filterName":[1,"filter-name"],"filterLabel":[1,"filter-label"],"placeholder":[1],"type":[1],"options":[1],"filterValues":[32]}]]],["p-29d78bf2",[[257,"ifx-file-upload",{"dragAndDrop":[4,"drag-and-drop"],"required":[4],"disabled":[4],"maxFileSizeMB":[2,"max-file-size-m-b"],"allowedFileTypes":[1,"allowed-file-types"],"additionalAllowedFileTypes":[1,"additional-allowed-file-types"],"allowAnyFileType":[4,"allow-any-file-type"],"allowedFileExtensions":[1,"allowed-file-extensions"],"uploadHandler":[16,"upload-handler"],"maxFiles":[6146,"max-files"],"label":[1],"labelRequiredError":[1,"label-required-error"],"labelBrowseFiles":[1,"label-browse-files"],"labelDragAndDrop":[1,"label-drag-and-drop"],"labelUploadedFilesHeading":[1,"label-uploaded-files-heading"],"labelFileTooLarge":[1,"label-file-too-large"],"labelUnsupportedFileType":[1,"label-unsupported-file-type"],"labelUploaded":[1,"label-uploaded"],"labelUploadFailed":[1,"label-upload-failed"],"labelSupportedFormatsTemplate":[1,"label-supported-formats-template"],"labelFileSingular":[1,"label-file-singular"],"labelFilePlural":[1,"label-file-plural"],"labelMaxFilesInfo":[1,"label-max-files-info"],"labelMaxFilesExceeded":[1,"label-max-files-exceeded"],"ariaLabelBrowseFiles":[1,"aria-label-browse-files"],"ariaLabelDropzone":[1,"aria-label-dropzone"],"ariaLabelFileInput":[1,"aria-label-file-input"],"ariaLabelRemoveFile":[1,"aria-label-remove-file"],"ariaLabelCancelUpload":[1,"aria-label-cancel-upload"],"ariaLabelRetryUpload":[1,"aria-label-retry-upload"],"ariaLabelUploadingStatus":[1,"aria-label-uploading-status"],"ariaLabelUploadedStatus":[1,"aria-label-uploaded-status"],"ariaLabelUploadFailedStatus":[1,"aria-label-upload-failed-status"],"isDragOver":[32],"files":[32],"uploadTasks":[32],"rejectedSizeFiles":[32],"rejectedTypeFiles":[32],"requiredError":[32],"statusMessage":[32],"injectDemoState":[64],"triggerDemoValidation":[64]}]]],["p-76e88a63",[[257,"ifx-icons-preview",{"iconsArray":[32],"isCopied":[32],"copiedIndex":[32],"copiedIcon":[32],"htmlTag":[32],"iconName":[32],"searchTerm":[32]}]]],["p-e7b72d33",[[257,"ifx-faq"]]],["p-ba4ee343",[[257,"ifx-list-entry",{"value":[1028],"label":[1],"type":[1]},[[0,"ifxChange","handleFilterEntryChange"]],{"value":["valueChanged"]}]]],["p-fd206fce",[[257,"ifx-overview-table"]]],["p-55227732",[[257,"ifx-dropdown-trigger-button",{"isOpen":[4,"is-open"],"theme":[1],"variant":[1],"size":[1],"disabled":[4],"hideArrow":[4,"hide-arrow"]}]]],["p-83816596",[[257,"ifx-filter-accordion",{"maxVisibleItems":[2,"max-visible-items"],"filterGroupName":[1,"filter-group-name"],"expanded":[32],"count":[32],"totalItems":[32]}]]],["p-d3a6bbf7",[[257,"ifx-filter-bar",{"maxShownFilters":[2,"max-shown-filters"],"showMoreFiltersButton":[4,"show-more-filters-button"],"selectedOptions":[32],"showAllFilters":[32],"visibleSlots":[32]}]]],["p-b5efb1d6",[[257,"ifx-filter-search",{"filterName":[1,"filter-name"],"disabled":[4],"filterValue":[1025,"filter-value"],"filterKey":[1,"filter-key"],"filterOrientation":[1,"filter-orientation"],"placeholder":[1],"showDeleteIcon":[32]},[[0,"ifxInput","handleFilterSearchChange"]],{"value":["valueChanged"]}]]],["p-7468590a",[[257,"ifx-list",{"name":[1],"maxVisibleItems":[2,"max-visible-items"],"type":[1],"resetTrigger":[1028,"reset-trigger"],"expanded":[32],"showMore":[32],"selectedCount":[32],"totalItems":[32],"internalResetTrigger":[32]},null,{"type":["handleTypeChange"],"resetTrigger":["resetTriggerChanged"]}]]],["p-550283fa",[[257,"ifx-modal",{"opened":[1540],"caption":[1],"captionAriaLabel":[1,"caption-aria-label"],"closeOnOverlayClick":[4,"close-on-overlay-click"],"variant":[1],"size":[1],"alertIcon":[1,"alert-icon"],"okButtonLabel":[1,"ok-button-label"],"cancelButtonLabel":[1,"cancel-button-label"],"closeButtonAriaLabel":[1,"close-button-aria-label"],"showCloseButton":[4,"show-close-button"],"showModal":[32],"slotButtonsPresent":[32]},null,{"opened":["openedChanged"]}]]],["p-8c44be53",[[257,"ifx-navbar-item",{"showLabel":[4,"show-label"],"icon":[1],"href":[1],"target":[1],"hideOnMobile":[4,"hide-on-mobile"],"numberIndicator":[2,"number-indicator"],"dotIndicator":[4,"dot-indicator"],"internalHref":[32],"isMenuItem":[32],"hasChildNavItems":[32],"isSidebarMenuItem":[32],"itemPosition":[32],"hideComponent":[64],"showComponent":[64],"toggleChildren":[64],"moveChildComponentsIntoSubLayerMenu":[64],"toggleFirstLayerItem":[64],"addMenuItemClass":[64],"moveChildComponentsBackIntoNavbar":[64],"returnToFirstLayer":[64],"setMenuItemPosition":[64],"setItemSideSpecifications":[64]},[[0,"focusout","handleFocusOut"],[5,"mousedown","handleOutsideClick"]]]]],["p-249372a1",[[257,"ifx-search-bar",{"isOpen":[4,"is-open"],"disabled":[4],"value":[1025],"maxlength":[2],"autocomplete":[1],"internalState":[32],"onNavbarMobile":[64]},null,{"isOpen":["handlePropChange"]}]]],["p-58552d96",[[257,"ifx-sidebar-item",{"icon":[1],"href":[1],"target":[1],"numberIndicator":[2,"number-indicator"],"active":[4],"isActionItem":[4,"is-action-item"],"handleItemClick":[16,"handle-item-click"],"showIcon":[32],"showIconWrapper":[32],"internalHref":[32],"isExpandable":[32],"isNested":[32],"isSubMenuItem":[32],"indicatorVariant":[32],"internalActiveState":[32],"setActiveClasses":[64],"expandMenu":[64],"isItemExpandable":[64]},[[0,"consoleError","handleConsoleError"]],{"active":["handleActiveChange"],"numberIndicator":["handleNumberIndicatorChange"]}]]],["p-98c2e3a9",[[257,"ifx-tabs",{"orientation":[1],"activeTabIndex":[1026,"active-tab-index"],"fullWidth":[4,"full-width"],"internalOrientation":[32],"internalActiveTabIndex":[32],"tabObjects":[32],"canScrollLeft":[32],"canScrollRight":[32]},[[9,"resize","updateBorderOnWindowResize"],[0,"tabHeaderChange","handleTabHeaderChange"],[0,"slotchange","onSlotChange"],[0,"keydown","handleKeyDown"]],{"activeTabIndex":["activeTabIndexChanged"]}]]],["p-22a45c93",[[257,"ifx-tree-view-item",{"expanded":[1540],"initiallyExpanded":[4,"initially-expanded"],"disableItem":[4,"disable-item"],"ariaLabel":[1,"aria-label"],"initiallySelected":[4,"initially-selected"],"value":[1],"hasChildren":[32],"isChecked":[32],"partialChecked":[32],"level":[32],"disableAllItems":[32],"expandAllItems":[32],"suppressExpandEvents":[32]},null,{"expanded":["handleExpandedChange"],"disableItem":["handleDisableItemChange"]}]]],["p-6af7d062",[[257,"ifx-breadcrumb-item-label",{"icon":[1],"href":[1],"target":[1]}]]],["p-4850e2df",[[257,"ifx-checkbox-group",{"alignment":[1],"size":[1],"showGroupLabel":[4,"show-group-label"],"groupLabelText":[1,"group-label-text"],"showCaption":[4,"show-caption"],"captionText":[1,"caption-text"],"showCaptionIcon":[4,"show-caption-icon"],"required":[4],"hasErrors":[32],"setGroupError":[64]},[[0,"ifxError","handleCheckboxError"]]]]],["p-fb0a1c71",[[257,"ifx-date-picker",{"size":[1],"error":[4],"success":[4],"disabled":[4],"ariaLabel":[1,"aria-label"],"value":[1],"type":[1],"max":[1],"min":[1],"required":[4],"label":[1],"caption":[1],"autocomplete":[1]}]]],["p-f68887c5",[[257,"ifx-download",{"tokens":[1]}]]],["p-240a4cb3",[[257,"ifx-dropdown-item",{"icon":[1],"href":[1],"target":[1],"hide":[4],"size":[32]},[[16,"menuSize","handleMenuSize"]]]]],["p-6ceae9a3",[[257,"ifx-navbar",{"applicationName":[1,"application-name"],"fixed":[4],"showLogoAndAppname":[4,"show-logo-and-appname"],"logoHref":[1,"logo-href"],"logoHrefTarget":[1,"logo-href-target"],"main":[32],"products":[32],"applications":[32],"design":[32],"support":[32],"about":[32],"hasLeftMenuItems":[32],"searchBarIsOpen":[32],"internalLogoHref":[32],"internalLogoHrefTarget":[32]},[[0,"ifxNavItem","clearFirstLayerMenu"],[0,"ifxOpen","handleSearchBarToggle"]]]]],["p-1c2d0b17",[[257,"ifx-radio-button-group",{"alignment":[1],"size":[1],"showGroupLabel":[4,"show-group-label"],"groupLabelText":[1,"group-label-text"],"showCaption":[4,"show-caption"],"captionText":[1,"caption-text"],"showCaptionIcon":[4,"show-caption-icon"],"required":[4],"hasErrors":[32],"setGroupError":[64]},[[0,"ifxError","handleRadioButtonError"]]]]],["p-9ea43bb7",[[257,"ifx-segment",{"icon":[1],"segmentIndex":[2,"segment-index"],"selected":[1028],"value":[1]}]]],["p-f5811026",[[257,"ifx-segmented-control",{"caption":[1],"label":[1],"size":[1],"required":[4],"error":[4]},[[0,"segmentSelect","onSegmentSelect"]]]]],["p-4c846056",[[257,"ifx-sidebar",{"applicationName":[1,"application-name"],"initialCollapse":[4,"initial-collapse"],"showFooter":[4,"show-footer"],"showHeader":[4,"show-header"],"termsOfUse":[1,"terms-of-use"],"imprint":[1],"privacyPolicy":[1,"privacy-policy"],"target":[1],"copyrightText":[1,"copyright-text"],"collapsible":[4],"collapsed":[4],"hideMenuLabel":[1,"hide-menu-label"],"currentYear":[32],"internalTermsofUse":[32],"internalImprint":[32],"internalPrivacyPolicy":[32],"internalShowFooter":[32],"activeItem":[32],"isCollapsed":[32],"toggleCollapse":[64],"collapse":[64],"expand":[64]},[[0,"ifxSidebarMenu","handleSidebarItemInteraction"],[0,"ifxSidebarNavigationItem","handleSidebarItemActivated"]],{"collapsible":["handleCollapsibleChange"],"collapsed":["handleCollapsedPropChange"]}]]],["p-3f3a5140",[[257,"ifx-slider",{"min":[2],"max":[2],"step":[2],"value":[2],"minValueHandle":[2,"min-value-handle"],"maxValueHandle":[2,"max-value-handle"],"disabled":[4],"showPercentage":[4,"show-percentage"],"leftIcon":[1,"left-icon"],"rightIcon":[1,"right-icon"],"leftText":[1,"left-text"],"rightText":[1,"right-text"],"type":[1],"ariaLabel":[1,"aria-label"],"internalValue":[32],"percentage":[32],"internalMinValue":[32],"internalMaxValue":[32]},null,{"value":["valueChanged"],"minValueHandle":["minValueChanged"],"maxValueHandle":["maxValueChanged"]}]]],["p-880ff9af",[[257,"ifx-step",{"complete":[4],"disabled":[4],"error":[1028],"lastStep":[4,"last-step"],"stepId":[2,"step-id"],"stepperState":[16,"stepper-state"],"active":[32],"clickable":[32]},[[4,"ifxChange","onStepChange"]],{"stepperState":["updateCurrentStep"],"active":["updateErrorState"]}]]],["p-913a8693",[[257,"ifx-tooltip",{"header":[1],"text":[1],"position":[1],"ariaLabel":[1,"aria-label"],"variant":[1],"icon":[1],"tooltipVisible":[32],"internalPosition":[32]},null,{"position":["positionChanged"]}]]],["p-765dd1b4",[[257,"ifx-action-list",{"listAriaLabel":[1,"list-aria-label"]}]]],["p-1df9b181",[[257,"ifx-action-list-item",{"itemTitle":[1,"item-title"],"description":[1],"value":[1],"href":[1],"target":[1],"disabled":[4],"itemAriaLabel":[1,"item-aria-label"]},null,{"disabled":["onDisabledChange"]}]]],["p-54785004",[[256,"ifx-basic-table",{"cols":[1],"rows":[1],"rowHeight":[1,"row-height"],"tableHeight":[1,"table-height"],"variant":[1],"gridOptions":[32],"columnDefs":[32],"rowData":[32],"uniqueKey":[32]}]]],["p-43943864",[[257,"ifx-breadcrumb"]]],["p-3f29b8fd",[[257,"ifx-breadcrumb-item",{"isLastItem":[32],"uniqueId":[32],"hasDropdownMenu":[32]},[[5,"mousedown","handleOutsideClick"],[0,"keydown","handleKeyDown"],[0,"breadcrumbMenuIconWrapper","menuWrapperEventReEmitter"]]]]],["p-84735ae2",[[257,"ifx-card",{"direction":[1],"href":[1],"target":[1],"ariaLabel":[1,"aria-label"],"noBtns":[32],"alignment":[32],"noImg":[32],"internalHref":[32]},[[0,"imgPosition","setImgPosition"]]]]],["p-d56ee584",[[257,"ifx-card-headline",{"direction":[32],"hasDesc":[32]}]]],["p-27808b00",[[257,"ifx-card-image",{"src":[1],"alt":[1],"position":[1]}]]],["p-7910df8a",[[257,"ifx-card-links"]]],["p-cae1ea22",[[257,"ifx-card-overline"]]],["p-ee2ca575",[[257,"ifx-card-text",{"hasBtn":[32]}]]],["p-0dbe2818",[[257,"ifx-content-switcher",{"items":[32],"activeIndex":[32],"hoverIndex":[32],"focusIndex":[32],"dividers":[32]}]]],["p-dfd77261",[[257,"ifx-content-switcher-item",{"selected":[4],"value":[1]}]]],["p-2151de2a",[[257,"ifx-dropdown",{"placement":[1],"defaultOpen":[4,"default-open"],"noAppendToBody":[4,"no-append-to-body"],"disabled":[4],"noCloseOnOutsideClick":[4,"no-close-on-outside-click"],"noCloseOnMenuClick":[4,"no-close-on-menu-click"],"internalIsOpen":[32],"trigger":[32],"menu":[32],"isOpen":[64],"closeDropdown":[64],"openDropdown":[64]},[[5,"mousedown","handleOutsideClick"],[4,"focusin","handleFocusOutside"],[0,"slotchange","watchHandlerSlot"]],{"defaultOpen":["watchHandlerIsOpen"],"disabled":["watchHandlerDisabled"]}]]],["p-c6fa6fd3",[[257,"ifx-dropdown-header"]]],["p-b969b2c0",[[257,"ifx-dropdown-menu",{"isOpen":[4,"is-open"],"size":[1],"hideTopPadding":[32],"filteredItems":[32]},[[0,"ifxInput","handleMenuFilter"],[0,"ifxDropdownItem","handleDropdownItemValueEmission"]]]]],["p-8a9d3e04",[[257,"ifx-dropdown-separator"]]],["p-4afddabf",[[257,"ifx-dropdown-trigger",{"isOpen":[4,"is-open"]}]]],["p-eed36710",[[257,"ifx-filter-type-group",{"selectedOptions":[32]}]]],["p-b5db443a",[[257,"ifx-footer",{"copyrightText":[1,"copyright-text"],"currentYear":[32]}]]],["p-3cdd03ed",[[257,"ifx-footer-column"]]],["p-5c673497",[[257,"ifx-navbar-profile",{"showLabel":[4,"show-label"],"href":[1],"imageUrl":[1,"image-url"],"target":[1],"alt":[1],"userName":[1,"user-name"],"internalHref":[32],"isMenuItem":[32],"hasChildNavItems":[32],"internalImageUrl":[32],"hideComponent":[64],"showComponent":[64]},[[5,"mousedown","handleOutsideClick"]]]]],["p-412f510b",[[257,"ifx-sidebar-title",{"showInCollapsed":[4,"show-in-collapsed"]}]]],["p-5f285e9d",[[257,"ifx-status",{"label":[1],"border":[4],"color":[1]}]]],["p-6504f8d0",[[257,"ifx-stepper",{"activeStep":[1026,"active-step"],"indicatorPosition":[1,"indicator-position"],"showStepNumber":[4,"show-step-number"],"variant":[1],"ariaLabel":[1,"aria-label"],"ariaCurrent":[1,"aria-current"],"stepsCount":[32],"shouldEmitEvent":[32],"emittedByClick":[32]},[[0,"ifxChange","onStepChange"]],{"activeStep":["handleActiveStep"]}]]],["p-fe373208",[[257,"ifx-switch",{"checked":[4],"name":[1],"disabled":[4],"value":[1],"internalChecked":[32],"isChecked":[64]},null,{"checked":["valueChanged"]}]]],["p-c9d594e1",[[260,"ifx-tab",{"header":[1],"disabled":[4],"icon":[1],"iconPosition":[1,"icon-position"]}]]],["p-dcc7240e",[[257,"ifx-textarea",{"caption":[1],"cols":[2],"disabled":[4],"error":[4],"label":[1],"maxlength":[2],"name":[1],"placeholder":[1],"required":[4],"readOnly":[4,"read-only"],"resize":[1],"rows":[2],"value":[1025],"wrap":[1],"fullWidth":[513,"full-width"],"reset":[64]}]]],["p-0d4211db",[[257,"ifx-tree-view",{"label":[1],"disableAllItems":[4,"disable-all-items"],"expandAllItems":[4,"expand-all-items"],"ariaLabel":[1,"aria-label"]},null,{"expandAllItems":["handleExpandAllItemsChange"],"disableAllItems":["handleDisableAllItemsChange"]}]]],["p-a1c63832",[[257,"ifx-notification",{"icon":[1],"variant":[1],"linkText":[1,"link-text"],"linkHref":[1,"link-href"],"linkTarget":[1,"link-target"]}]]],["p-4016e7cf",[[257,"ifx-progress-bar",{"value":[2],"size":[1],"showLabel":[4,"show-label"],"internalValue":[32]},null,{"value":["valueChanged"]}]]],["p-dd1b2b14",[[257,"ifx-radio-button",{"disabled":[4],"value":[1],"error":[4],"size":[513],"name":[513],"checked":[1028],"internalChecked":[32],"hasSlot":[32],"isChecked":[64]},[[0,"keydown","handleKeyDown"],[4,"change","handleExternalChange"]],{"checked":["handleCheckedChange"],"internalChecked":["updateFormValue"],"error":["errorChanged"]}]]],["p-13fed6df",[[257,"ifx-template",{"name":[1],"thumbnail":[1],"repoDetails":[32],"repoUrl":[32],"showDetails":[32],"isTemplatePage":[32],"isLoading":[32],"repoError":[32],"toggleTemplate":[64]}],[257,"ifx-alert",{"variant":[1],"icon":[1],"closable":[4],"AriaLive":[1,"aria-live"],"uniqueId":[32]}]]],["p-6407c496",[[257,"ifx-multiselect",{"name":[1],"disabled":[4],"required":[4],"error":[4],"caption":[1],"label":[1],"placeholder":[1],"showSearch":[4,"show-search"],"showSelectAll":[4,"show-select-all"],"showClearButton":[4,"show-clear-button"],"showExpandCollapse":[4,"show-expand-collapse"],"noResultsMessage":[1,"no-results-message"],"showNoResultsMessage":[4,"show-no-results-message"],"searchPlaceholder":[1,"search-placeholder"],"selectAllLabel":[1,"select-all-label"],"expandLabel":[1,"expand-label"],"collapseLabel":[1,"collapse-label"],"ariaMultiSelectLabel":[1,"aria-multi-select-label"],"ariaMultiSelectLabelledBy":[1,"aria-multi-select-labelled-by"],"ariaMultiSelectDescribedBy":[1,"aria-multi-select-described-by"],"ariaSearchLabel":[1,"aria-search-label"],"ariaClearLabel":[1,"aria-clear-label"],"ariaToggleLabel":[1,"aria-toggle-label"],"ariaSelectAllLabel":[1,"aria-select-all-label"],"ariaExpandAllLabel":[1,"aria-expand-all-label"],"ariaCollapseAllLabel":[1,"aria-collapse-all-label"],"internalError":[32],"persistentSelectedOptions":[32],"dropdownOpen":[32],"dropdownFlipped":[32],"searchTerm":[32],"clearSelection":[64]},null,{"error":["updateInternalError"],"persistentSelectedOptions":["onSelectionChange"]}],[257,"ifx-multiselect-option",{"value":[1],"selected":[1540],"disabled":[1540],"indeterminate":[1540],"isExpanded":[32],"hasChildren":[32],"depth":[32],"searchTerm":[32],"isSearchActive":[32],"isSearchDisabled":[32]},[[0,"click","handleClick"],[0,"keydown","handleKeyDown"]]]]],["p-933da006",[[257,"ifx-accordion-item",{"caption":[1],"open":[1028],"AriaLevel":[2,"aria-level"],"internalOpen":[32]},[[0,"keydown","handleKeydown"]],{"open":["openChanged"]}],[273,"ifx-accordion",{"autoCollapse":[4,"auto-collapse"]},[[0,"ifxOpen","onItemOpen"]]]]],["p-242fc6b0",[[256,"ifx-select",{"value":[1],"name":[1],"items":[16],"choices":[1],"renderChoiceLimit":[2,"render-choice-limit"],"maxItemCount":[2,"max-item-count"],"addItems":[4,"add-items"],"removeItems":[4,"remove-items"],"removeItemButton":[4,"remove-item-button"],"editItems":[4,"edit-items"],"duplicateItemsAllowed":[4,"duplicate-items-allowed"],"delimiter":[1],"paste":[4],"showSearch":[4,"show-search"],"searchChoices":[4,"search-choices"],"searchFields":[1,"search-fields"],"searchFloor":[2,"search-floor"],"searchResultLimit":[2,"search-result-limit"],"position":[1],"resetScrollPosition":[4,"reset-scroll-position"],"shouldSort":[4,"should-sort"],"shouldSortItems":[4,"should-sort-items"],"sorter":[16],"placeholder":[8],"searchPlaceholderValue":[1,"search-placeholder-value"],"prependValue":[1,"prepend-value"],"appendValue":[1,"append-value"],"renderSelectedChoices":[1,"render-selected-choices"],"loadingText":[1,"loading-text"],"noResultsText":[1,"no-results-text"],"noChoicesText":[1,"no-choices-text"],"itemSelectText":[1,"item-select-text"],"addItemText":[1,"add-item-text"],"maxItemText":[1,"max-item-text"],"uniqueItemText":[1,"unique-item-text"],"classNames":[16,"class-names"],"fuseOptions":[16,"fuse-options"],"addItemFilter":[1,"add-item-filter"],"customAddItemText":[1,"custom-add-item-text"],"callbackOnInit":[16,"callback-on-init"],"callbackOnCreateTemplates":[16,"callback-on-create-templates"],"valueComparer":[16,"value-comparer"],"error":[4],"label":[1],"caption":[1],"disabled":[4],"required":[4],"placeholderValue":[1,"placeholder-value"],"options":[1025],"size":[1],"showClearButton":[4,"show-clear-button"],"selectedOption":[32],"optionIsSelected":[32],"clearSelection":[64],"handleChange":[64],"highlightItem":[64],"unhighlightItem":[64],"highlightAll":[64],"unhighlightAll":[64],"removeActiveItemsByValue":[64],"removeActiveItems":[64],"removeHighlightedItems":[64],"showDropdown":[64],"hideDropdown":[64],"getValue":[64],"setValue":[64],"setChoiceByValue":[64],"setChoices":[64],"clearChoices":[64],"clearStore":[64],"clearInput":[64],"ajax":[64],"handleDeleteIcon":[64]},[[5,"mousedown","handleOutsideClick"]],{"disabled":["watchDisabled"]}]]],["p-8ab64504",[[257,"ifx-spinner",{"size":[1],"variant":[1],"inverted":[4],"ariaLabel":[1,"aria-label"]}],[257,"ifx-text-field",{"placeholder":[1],"value":[1025],"error":[4],"label":[1],"icon":[1],"caption":[1],"size":[1],"required":[4],"success":[4],"disabled":[4],"readOnly":[4,"read-only"],"maxlength":[2],"showDeleteIcon":[4,"show-delete-icon"],"autocomplete":[1],"type":[1],"internalId":[1,"internal-id"],"internalType":[32],"reset":[64]},null,{"value":["valueWatcher"]}]]],["p-b23596f4",[[257,"ifx-search-field",{"value":[1025],"suggestions":[16],"showSuggestions":[4,"show-suggestions"],"maxSuggestions":[2,"max-suggestions"],"maxHistoryItems":[2,"max-history-items"],"enableHistory":[4,"enable-history"],"historyKey":[1,"history-key"],"historyHeaderText":[1,"history-header-text"],"ariaLabel":[1,"aria-label"],"ariaLabelledBy":[1,"aria-labelled-by"],"ariaDescribedBy":[1,"aria-described-by"],"deleteIconAriaLabel":[1,"delete-icon-aria-label"],"historyDeleteAriaLabel":[1,"history-delete-aria-label"],"dropdownAriaLabel":[1,"dropdown-aria-label"],"suggestionAriaLabel":[1,"suggestion-aria-label"],"historyItemAriaLabel":[1,"history-item-aria-label"],"showDeleteIcon":[4,"show-delete-icon"],"disabled":[4],"size":[1],"placeholder":[1],"autocomplete":[1],"maxlength":[2],"showDropdown":[32],"filteredSuggestions":[32],"selectedSuggestionIndex":[32],"searchHistory":[32],"showDeleteIconInternalState":[32],"isFocused":[32]},[[5,"mousedown","handleOutsideClick"],[0,"keydown","handleKeyDown"]],{"value":["valueWatcher"],"suggestions":["suggestionsWatcher"]}]]],["p-91ce7e7b",[[257,"ifx-icon-button",{"variant":[1],"size":[1],"disabled":[4],"icon":[1],"href":[1],"target":[1],"shape":[1],"ariaLabel":[1,"aria-label"],"internalIcon":[32],"setFocus":[64]},[[2,"click","handleClick"]],{"icon":["updateIcon"]}]]],["p-ad702dcc",[[257,"ifx-button",{"variant":[1],"theme":[1],"size":[1],"disabled":[4],"href":[1],"target":[1],"type":[1],"fullWidth":[4,"full-width"],"ariaLabel":[1,"aria-label"],"internalHref":[32],"setFocus":[64]},[[0,"keydown","handleKeyDown"],[2,"click","handleHostClick"]],{"href":["setInternalHref"]}]]],["p-0100cbfb",[[257,"ifx-indicator",{"inverted":[4],"ariaLabel":[1,"aria-label"],"variant":[1],"number":[2],"filteredNumber":[32]}]]],["p-f63ba4a3",[[257,"ifx-checkbox",{"disabled":[4],"checked":[4],"error":[4],"size":[1],"indeterminate":[4],"value":[1],"internalChecked":[32],"internalIndeterminate":[32],"isChecked":[64],"toggleCheckedState":[64]},null,{"checked":["valueChanged"],"error":["errorChanged"],"indeterminate":["indeterminateChanged"]}]]],["p-ae513612",[[257,"ifx-pagination",{"currentPage":[2,"current-page"],"showItemsPerPage":[4,"show-items-per-page"],"total":[2],"itemsPerPage":[1,"items-per-page"],"internalPage":[32],"internalItemsPerPage":[32],"numberOfPages":[32],"filteredItemsPerPage":[32],"visiblePages":[32]},[[0,"ifxSelect","setItemsPerPage"]],{"total":["watchTotalHandler"],"currentPage":["currentPageWatcher"]}],[257,"ifx-chip",{"placeholder":[1],"size":[1],"value":[1025],"variant":[1],"theme":[1],"readOnly":[4,"read-only"],"ariaLabel":[1,"aria-label"],"disabled":[4],"icon":[1],"opened":[32],"selectedOptions":[32]},[[5,"mousedown","closeDropdownOnOutsideClick"],[0,"keydown","handleKeyDown"],[0,"ifxChipItemSelect","updateSelectedOptions"]],{"value":["handleValueChange"],"readOnly":["handleReadOnlyChange"]}],[257,"ifx-chip-item",{"value":[1],"chipState":[16,"chip-state"],"selected":[1540]},[[16,"ifxChipItemSelect","updateItemSelection"]],{"selected":["validateSelected"]}]]],["p-d3236a63",[[257,"ifx-link",{"href":[1],"target":[1],"variant":[1],"size":[1],"disabled":[4],"download":[1],"ariaLabel":[1,"aria-label"],"internalHref":[32],"internalTarget":[32],"internalVariant":[32]}]]],["p-bbd819a8",[[256,"ifx-icon",{"icon":[1025],"ifxIcon":[1032,"ifx-icon"],"internalIcon":[32]},null,{"icon":["updateIcon"]}]]]]'),e)}));
+import{p as e,H as a,g as l,b as i}from"./p-DtIEDtZ8.js";export{s as setNonce}from"./p-DtIEDtZ8.js";var t=()=>{{n(a.prototype)}const l=import.meta.url;const i={};if(l!==""){i.resourcesUrl=new URL(".",l).href}return e(i)};var n=e=>{const a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}const l=a.call(this,false);const i=this.childNodes;if(e){for(let e=0;e<i.length;e++){if(i[e].nodeType!==2){l.appendChild(i[e].cloneNode(true))}}}return l}};t().then((async e=>{await l();return i(JSON.parse('[["p-0d9da371",[[257,"ifx-table",{"cols":[8],"rows":[8],"buttonRendererOptions":[16,"button-renderer-options"],"iconButtonRendererOptions":[16,"icon-button-renderer-options"],"checkboxRendererOptions":[16,"checkbox-renderer-options"],"rowHeight":[1,"row-height"],"tableHeight":[1,"table-height"],"pagination":[4],"paginationItemsPerPage":[1,"pagination-items-per-page"],"filterOrientation":[1,"filter-orientation"],"headline":[1],"variant":[1],"serverSidePagination":[4,"server-side-pagination"],"serverPageChangeHandler":[16,"server-page-change-handler"],"enableSelection":[4,"enable-selection"],"showLoading":[4,"show-loading"],"currentPage":[32],"rowData":[32],"colData":[32],"filterOptions":[32],"currentFilters":[32],"uniqueKey":[32],"paginationPageSize":[32],"showSidebarFilters":[32],"matchingResultsCount":[32],"selectedRows":[32],"selectAll":[32],"selectedRowsData":[32],"onBtShowLoading":[64]},[[0,"ifxItemsPerPageChange","handleResultsPerPageChange"],[0,"ifxChange","handleChipChange"]],{"rows":["rowsChanged"],"cols":["colsChanged"],"buttonRendererOptions":["onButtonRendererOptionsChanged"],"iconButtonRendererOptions":["onIconButtonRendererOptionsChanged"],"checkboxRendererOptions":["onCheckboxRendererOptionsChanged"]}]]],["p-372fa9eb",[[257,"ifx-templates-ui",null,[[0,"fieldError","handleError"],[0,"toggleTemplates","filterTemplates"]]]]],["p-d4fea918",[[257,"ifx-set-filter",{"filterName":[1,"filter-name"],"filterLabel":[1,"filter-label"],"placeholder":[1],"type":[1],"options":[1],"filterValues":[32]}]]],["p-29d78bf2",[[257,"ifx-file-upload",{"dragAndDrop":[4,"drag-and-drop"],"required":[4],"disabled":[4],"maxFileSizeMB":[2,"max-file-size-m-b"],"allowedFileTypes":[1,"allowed-file-types"],"additionalAllowedFileTypes":[1,"additional-allowed-file-types"],"allowAnyFileType":[4,"allow-any-file-type"],"allowedFileExtensions":[1,"allowed-file-extensions"],"uploadHandler":[16,"upload-handler"],"maxFiles":[6146,"max-files"],"label":[1],"labelRequiredError":[1,"label-required-error"],"labelBrowseFiles":[1,"label-browse-files"],"labelDragAndDrop":[1,"label-drag-and-drop"],"labelUploadedFilesHeading":[1,"label-uploaded-files-heading"],"labelFileTooLarge":[1,"label-file-too-large"],"labelUnsupportedFileType":[1,"label-unsupported-file-type"],"labelUploaded":[1,"label-uploaded"],"labelUploadFailed":[1,"label-upload-failed"],"labelSupportedFormatsTemplate":[1,"label-supported-formats-template"],"labelFileSingular":[1,"label-file-singular"],"labelFilePlural":[1,"label-file-plural"],"labelMaxFilesInfo":[1,"label-max-files-info"],"labelMaxFilesExceeded":[1,"label-max-files-exceeded"],"ariaLabelBrowseFiles":[1,"aria-label-browse-files"],"ariaLabelDropzone":[1,"aria-label-dropzone"],"ariaLabelFileInput":[1,"aria-label-file-input"],"ariaLabelRemoveFile":[1,"aria-label-remove-file"],"ariaLabelCancelUpload":[1,"aria-label-cancel-upload"],"ariaLabelRetryUpload":[1,"aria-label-retry-upload"],"ariaLabelUploadingStatus":[1,"aria-label-uploading-status"],"ariaLabelUploadedStatus":[1,"aria-label-uploaded-status"],"ariaLabelUploadFailedStatus":[1,"aria-label-upload-failed-status"],"isDragOver":[32],"files":[32],"uploadTasks":[32],"rejectedSizeFiles":[32],"rejectedTypeFiles":[32],"requiredError":[32],"statusMessage":[32],"injectDemoState":[64],"triggerDemoValidation":[64]}]]],["p-76e88a63",[[257,"ifx-icons-preview",{"iconsArray":[32],"isCopied":[32],"copiedIndex":[32],"copiedIcon":[32],"htmlTag":[32],"iconName":[32],"searchTerm":[32]}]]],["p-e7b72d33",[[257,"ifx-faq"]]],["p-ba4ee343",[[257,"ifx-list-entry",{"value":[1028],"label":[1],"type":[1]},[[0,"ifxChange","handleFilterEntryChange"]],{"value":["valueChanged"]}]]],["p-fd206fce",[[257,"ifx-overview-table"]]],["p-55227732",[[257,"ifx-dropdown-trigger-button",{"isOpen":[4,"is-open"],"theme":[1],"variant":[1],"size":[1],"disabled":[4],"hideArrow":[4,"hide-arrow"]}]]],["p-83816596",[[257,"ifx-filter-accordion",{"maxVisibleItems":[2,"max-visible-items"],"filterGroupName":[1,"filter-group-name"],"expanded":[32],"count":[32],"totalItems":[32]}]]],["p-d3a6bbf7",[[257,"ifx-filter-bar",{"maxShownFilters":[2,"max-shown-filters"],"showMoreFiltersButton":[4,"show-more-filters-button"],"selectedOptions":[32],"showAllFilters":[32],"visibleSlots":[32]}]]],["p-b5efb1d6",[[257,"ifx-filter-search",{"filterName":[1,"filter-name"],"disabled":[4],"filterValue":[1025,"filter-value"],"filterKey":[1,"filter-key"],"filterOrientation":[1,"filter-orientation"],"placeholder":[1],"showDeleteIcon":[32]},[[0,"ifxInput","handleFilterSearchChange"]],{"value":["valueChanged"]}]]],["p-7468590a",[[257,"ifx-list",{"name":[1],"maxVisibleItems":[2,"max-visible-items"],"type":[1],"resetTrigger":[1028,"reset-trigger"],"expanded":[32],"showMore":[32],"selectedCount":[32],"totalItems":[32],"internalResetTrigger":[32]},null,{"type":["handleTypeChange"],"resetTrigger":["resetTriggerChanged"]}]]],["p-550283fa",[[257,"ifx-modal",{"opened":[1540],"caption":[1],"captionAriaLabel":[1,"caption-aria-label"],"closeOnOverlayClick":[4,"close-on-overlay-click"],"variant":[1],"size":[1],"alertIcon":[1,"alert-icon"],"okButtonLabel":[1,"ok-button-label"],"cancelButtonLabel":[1,"cancel-button-label"],"closeButtonAriaLabel":[1,"close-button-aria-label"],"showCloseButton":[4,"show-close-button"],"showModal":[32],"slotButtonsPresent":[32]},null,{"opened":["openedChanged"]}]]],["p-8c44be53",[[257,"ifx-navbar-item",{"showLabel":[4,"show-label"],"icon":[1],"href":[1],"target":[1],"hideOnMobile":[4,"hide-on-mobile"],"numberIndicator":[2,"number-indicator"],"dotIndicator":[4,"dot-indicator"],"internalHref":[32],"isMenuItem":[32],"hasChildNavItems":[32],"isSidebarMenuItem":[32],"itemPosition":[32],"hideComponent":[64],"showComponent":[64],"toggleChildren":[64],"moveChildComponentsIntoSubLayerMenu":[64],"toggleFirstLayerItem":[64],"addMenuItemClass":[64],"moveChildComponentsBackIntoNavbar":[64],"returnToFirstLayer":[64],"setMenuItemPosition":[64],"setItemSideSpecifications":[64]},[[0,"focusout","handleFocusOut"],[5,"mousedown","handleOutsideClick"]]]]],["p-249372a1",[[257,"ifx-search-bar",{"isOpen":[4,"is-open"],"disabled":[4],"value":[1025],"maxlength":[2],"autocomplete":[1],"internalState":[32],"onNavbarMobile":[64]},null,{"isOpen":["handlePropChange"]}]]],["p-58552d96",[[257,"ifx-sidebar-item",{"icon":[1],"href":[1],"target":[1],"numberIndicator":[2,"number-indicator"],"active":[4],"isActionItem":[4,"is-action-item"],"handleItemClick":[16,"handle-item-click"],"showIcon":[32],"showIconWrapper":[32],"internalHref":[32],"isExpandable":[32],"isNested":[32],"isSubMenuItem":[32],"indicatorVariant":[32],"internalActiveState":[32],"setActiveClasses":[64],"expandMenu":[64],"isItemExpandable":[64]},[[0,"consoleError","handleConsoleError"]],{"active":["handleActiveChange"],"numberIndicator":["handleNumberIndicatorChange"]}]]],["p-98c2e3a9",[[257,"ifx-tabs",{"orientation":[1],"activeTabIndex":[1026,"active-tab-index"],"fullWidth":[4,"full-width"],"internalOrientation":[32],"internalActiveTabIndex":[32],"tabObjects":[32],"canScrollLeft":[32],"canScrollRight":[32]},[[9,"resize","updateBorderOnWindowResize"],[0,"tabHeaderChange","handleTabHeaderChange"],[0,"slotchange","onSlotChange"],[0,"keydown","handleKeyDown"]],{"activeTabIndex":["activeTabIndexChanged"]}]]],["p-22a45c93",[[257,"ifx-tree-view-item",{"expanded":[1540],"initiallyExpanded":[4,"initially-expanded"],"disableItem":[4,"disable-item"],"ariaLabel":[1,"aria-label"],"initiallySelected":[4,"initially-selected"],"value":[1],"hasChildren":[32],"isChecked":[32],"partialChecked":[32],"level":[32],"disableAllItems":[32],"expandAllItems":[32],"suppressExpandEvents":[32]},null,{"expanded":["handleExpandedChange"],"disableItem":["handleDisableItemChange"]}]]],["p-6af7d062",[[257,"ifx-breadcrumb-item-label",{"icon":[1],"href":[1],"target":[1]}]]],["p-4850e2df",[[257,"ifx-checkbox-group",{"alignment":[1],"size":[1],"showGroupLabel":[4,"show-group-label"],"groupLabelText":[1,"group-label-text"],"showCaption":[4,"show-caption"],"captionText":[1,"caption-text"],"showCaptionIcon":[4,"show-caption-icon"],"required":[4],"hasErrors":[32],"setGroupError":[64]},[[0,"ifxError","handleCheckboxError"]]]]],["p-1d32590c",[[257,"ifx-date-picker",{"size":[1],"error":[4],"success":[4],"disabled":[4],"ariaLabel":[1,"aria-label"],"value":[1],"type":[1],"max":[1],"min":[1],"required":[4],"label":[1],"caption":[1],"autocomplete":[1]}]]],["p-f68887c5",[[257,"ifx-download",{"tokens":[1]}]]],["p-240a4cb3",[[257,"ifx-dropdown-item",{"icon":[1],"href":[1],"target":[1],"hide":[4],"size":[32]},[[16,"menuSize","handleMenuSize"]]]]],["p-6ceae9a3",[[257,"ifx-navbar",{"applicationName":[1,"application-name"],"fixed":[4],"showLogoAndAppname":[4,"show-logo-and-appname"],"logoHref":[1,"logo-href"],"logoHrefTarget":[1,"logo-href-target"],"main":[32],"products":[32],"applications":[32],"design":[32],"support":[32],"about":[32],"hasLeftMenuItems":[32],"searchBarIsOpen":[32],"internalLogoHref":[32],"internalLogoHrefTarget":[32]},[[0,"ifxNavItem","clearFirstLayerMenu"],[0,"ifxOpen","handleSearchBarToggle"]]]]],["p-1c2d0b17",[[257,"ifx-radio-button-group",{"alignment":[1],"size":[1],"showGroupLabel":[4,"show-group-label"],"groupLabelText":[1,"group-label-text"],"showCaption":[4,"show-caption"],"captionText":[1,"caption-text"],"showCaptionIcon":[4,"show-caption-icon"],"required":[4],"hasErrors":[32],"setGroupError":[64]},[[0,"ifxError","handleRadioButtonError"]]]]],["p-9ea43bb7",[[257,"ifx-segment",{"icon":[1],"segmentIndex":[2,"segment-index"],"selected":[1028],"value":[1]}]]],["p-f5811026",[[257,"ifx-segmented-control",{"caption":[1],"label":[1],"size":[1],"required":[4],"error":[4]},[[0,"segmentSelect","onSegmentSelect"]]]]],["p-4c846056",[[257,"ifx-sidebar",{"applicationName":[1,"application-name"],"initialCollapse":[4,"initial-collapse"],"showFooter":[4,"show-footer"],"showHeader":[4,"show-header"],"termsOfUse":[1,"terms-of-use"],"imprint":[1],"privacyPolicy":[1,"privacy-policy"],"target":[1],"copyrightText":[1,"copyright-text"],"collapsible":[4],"collapsed":[4],"hideMenuLabel":[1,"hide-menu-label"],"currentYear":[32],"internalTermsofUse":[32],"internalImprint":[32],"internalPrivacyPolicy":[32],"internalShowFooter":[32],"activeItem":[32],"isCollapsed":[32],"toggleCollapse":[64],"collapse":[64],"expand":[64]},[[0,"ifxSidebarMenu","handleSidebarItemInteraction"],[0,"ifxSidebarNavigationItem","handleSidebarItemActivated"]],{"collapsible":["handleCollapsibleChange"],"collapsed":["handleCollapsedPropChange"]}]]],["p-3f3a5140",[[257,"ifx-slider",{"min":[2],"max":[2],"step":[2],"value":[2],"minValueHandle":[2,"min-value-handle"],"maxValueHandle":[2,"max-value-handle"],"disabled":[4],"showPercentage":[4,"show-percentage"],"leftIcon":[1,"left-icon"],"rightIcon":[1,"right-icon"],"leftText":[1,"left-text"],"rightText":[1,"right-text"],"type":[1],"ariaLabel":[1,"aria-label"],"internalValue":[32],"percentage":[32],"internalMinValue":[32],"internalMaxValue":[32]},null,{"value":["valueChanged"],"minValueHandle":["minValueChanged"],"maxValueHandle":["maxValueChanged"]}]]],["p-880ff9af",[[257,"ifx-step",{"complete":[4],"disabled":[4],"error":[1028],"lastStep":[4,"last-step"],"stepId":[2,"step-id"],"stepperState":[16,"stepper-state"],"active":[32],"clickable":[32]},[[4,"ifxChange","onStepChange"]],{"stepperState":["updateCurrentStep"],"active":["updateErrorState"]}]]],["p-913a8693",[[257,"ifx-tooltip",{"header":[1],"text":[1],"position":[1],"ariaLabel":[1,"aria-label"],"variant":[1],"icon":[1],"tooltipVisible":[32],"internalPosition":[32]},null,{"position":["positionChanged"]}]]],["p-765dd1b4",[[257,"ifx-action-list",{"listAriaLabel":[1,"list-aria-label"]}]]],["p-1df9b181",[[257,"ifx-action-list-item",{"itemTitle":[1,"item-title"],"description":[1],"value":[1],"href":[1],"target":[1],"disabled":[4],"itemAriaLabel":[1,"item-aria-label"]},null,{"disabled":["onDisabledChange"]}]]],["p-54785004",[[256,"ifx-basic-table",{"cols":[1],"rows":[1],"rowHeight":[1,"row-height"],"tableHeight":[1,"table-height"],"variant":[1],"gridOptions":[32],"columnDefs":[32],"rowData":[32],"uniqueKey":[32]}]]],["p-43943864",[[257,"ifx-breadcrumb"]]],["p-3f29b8fd",[[257,"ifx-breadcrumb-item",{"isLastItem":[32],"uniqueId":[32],"hasDropdownMenu":[32]},[[5,"mousedown","handleOutsideClick"],[0,"keydown","handleKeyDown"],[0,"breadcrumbMenuIconWrapper","menuWrapperEventReEmitter"]]]]],["p-84735ae2",[[257,"ifx-card",{"direction":[1],"href":[1],"target":[1],"ariaLabel":[1,"aria-label"],"noBtns":[32],"alignment":[32],"noImg":[32],"internalHref":[32]},[[0,"imgPosition","setImgPosition"]]]]],["p-d56ee584",[[257,"ifx-card-headline",{"direction":[32],"hasDesc":[32]}]]],["p-27808b00",[[257,"ifx-card-image",{"src":[1],"alt":[1],"position":[1]}]]],["p-7910df8a",[[257,"ifx-card-links"]]],["p-cae1ea22",[[257,"ifx-card-overline"]]],["p-ee2ca575",[[257,"ifx-card-text",{"hasBtn":[32]}]]],["p-0dbe2818",[[257,"ifx-content-switcher",{"items":[32],"activeIndex":[32],"hoverIndex":[32],"focusIndex":[32],"dividers":[32]}]]],["p-dfd77261",[[257,"ifx-content-switcher-item",{"selected":[4],"value":[1]}]]],["p-2151de2a",[[257,"ifx-dropdown",{"placement":[1],"defaultOpen":[4,"default-open"],"noAppendToBody":[4,"no-append-to-body"],"disabled":[4],"noCloseOnOutsideClick":[4,"no-close-on-outside-click"],"noCloseOnMenuClick":[4,"no-close-on-menu-click"],"internalIsOpen":[32],"trigger":[32],"menu":[32],"isOpen":[64],"closeDropdown":[64],"openDropdown":[64]},[[5,"mousedown","handleOutsideClick"],[4,"focusin","handleFocusOutside"],[0,"slotchange","watchHandlerSlot"]],{"defaultOpen":["watchHandlerIsOpen"],"disabled":["watchHandlerDisabled"]}]]],["p-c6fa6fd3",[[257,"ifx-dropdown-header"]]],["p-b969b2c0",[[257,"ifx-dropdown-menu",{"isOpen":[4,"is-open"],"size":[1],"hideTopPadding":[32],"filteredItems":[32]},[[0,"ifxInput","handleMenuFilter"],[0,"ifxDropdownItem","handleDropdownItemValueEmission"]]]]],["p-8a9d3e04",[[257,"ifx-dropdown-separator"]]],["p-4afddabf",[[257,"ifx-dropdown-trigger",{"isOpen":[4,"is-open"]}]]],["p-eed36710",[[257,"ifx-filter-type-group",{"selectedOptions":[32]}]]],["p-b5db443a",[[257,"ifx-footer",{"copyrightText":[1,"copyright-text"],"currentYear":[32]}]]],["p-3cdd03ed",[[257,"ifx-footer-column"]]],["p-5c673497",[[257,"ifx-navbar-profile",{"showLabel":[4,"show-label"],"href":[1],"imageUrl":[1,"image-url"],"target":[1],"alt":[1],"userName":[1,"user-name"],"internalHref":[32],"isMenuItem":[32],"hasChildNavItems":[32],"internalImageUrl":[32],"hideComponent":[64],"showComponent":[64]},[[5,"mousedown","handleOutsideClick"]]]]],["p-412f510b",[[257,"ifx-sidebar-title",{"showInCollapsed":[4,"show-in-collapsed"]}]]],["p-5f285e9d",[[257,"ifx-status",{"label":[1],"border":[4],"color":[1]}]]],["p-6504f8d0",[[257,"ifx-stepper",{"activeStep":[1026,"active-step"],"indicatorPosition":[1,"indicator-position"],"showStepNumber":[4,"show-step-number"],"variant":[1],"ariaLabel":[1,"aria-label"],"ariaCurrent":[1,"aria-current"],"stepsCount":[32],"shouldEmitEvent":[32],"emittedByClick":[32]},[[0,"ifxChange","onStepChange"]],{"activeStep":["handleActiveStep"]}]]],["p-fe373208",[[257,"ifx-switch",{"checked":[4],"name":[1],"disabled":[4],"value":[1],"internalChecked":[32],"isChecked":[64]},null,{"checked":["valueChanged"]}]]],["p-c9d594e1",[[260,"ifx-tab",{"header":[1],"disabled":[4],"icon":[1],"iconPosition":[1,"icon-position"]}]]],["p-dcc7240e",[[257,"ifx-textarea",{"caption":[1],"cols":[2],"disabled":[4],"error":[4],"label":[1],"maxlength":[2],"name":[1],"placeholder":[1],"required":[4],"readOnly":[4,"read-only"],"resize":[1],"rows":[2],"value":[1025],"wrap":[1],"fullWidth":[513,"full-width"],"reset":[64]}]]],["p-0d4211db",[[257,"ifx-tree-view",{"label":[1],"disableAllItems":[4,"disable-all-items"],"expandAllItems":[4,"expand-all-items"],"ariaLabel":[1,"aria-label"]},null,{"expandAllItems":["handleExpandAllItemsChange"],"disableAllItems":["handleDisableAllItemsChange"]}]]],["p-a1c63832",[[257,"ifx-notification",{"icon":[1],"variant":[1],"linkText":[1,"link-text"],"linkHref":[1,"link-href"],"linkTarget":[1,"link-target"]}]]],["p-4016e7cf",[[257,"ifx-progress-bar",{"value":[2],"size":[1],"showLabel":[4,"show-label"],"internalValue":[32]},null,{"value":["valueChanged"]}]]],["p-dd1b2b14",[[257,"ifx-radio-button",{"disabled":[4],"value":[1],"error":[4],"size":[513],"name":[513],"checked":[1028],"internalChecked":[32],"hasSlot":[32],"isChecked":[64]},[[0,"keydown","handleKeyDown"],[4,"change","handleExternalChange"]],{"checked":["handleCheckedChange"],"internalChecked":["updateFormValue"],"error":["errorChanged"]}]]],["p-13fed6df",[[257,"ifx-template",{"name":[1],"thumbnail":[1],"repoDetails":[32],"repoUrl":[32],"showDetails":[32],"isTemplatePage":[32],"isLoading":[32],"repoError":[32],"toggleTemplate":[64]}],[257,"ifx-alert",{"variant":[1],"icon":[1],"closable":[4],"AriaLive":[1,"aria-live"],"uniqueId":[32]}]]],["p-6407c496",[[257,"ifx-multiselect",{"name":[1],"disabled":[4],"required":[4],"error":[4],"caption":[1],"label":[1],"placeholder":[1],"showSearch":[4,"show-search"],"showSelectAll":[4,"show-select-all"],"showClearButton":[4,"show-clear-button"],"showExpandCollapse":[4,"show-expand-collapse"],"noResultsMessage":[1,"no-results-message"],"showNoResultsMessage":[4,"show-no-results-message"],"searchPlaceholder":[1,"search-placeholder"],"selectAllLabel":[1,"select-all-label"],"expandLabel":[1,"expand-label"],"collapseLabel":[1,"collapse-label"],"ariaMultiSelectLabel":[1,"aria-multi-select-label"],"ariaMultiSelectLabelledBy":[1,"aria-multi-select-labelled-by"],"ariaMultiSelectDescribedBy":[1,"aria-multi-select-described-by"],"ariaSearchLabel":[1,"aria-search-label"],"ariaClearLabel":[1,"aria-clear-label"],"ariaToggleLabel":[1,"aria-toggle-label"],"ariaSelectAllLabel":[1,"aria-select-all-label"],"ariaExpandAllLabel":[1,"aria-expand-all-label"],"ariaCollapseAllLabel":[1,"aria-collapse-all-label"],"internalError":[32],"persistentSelectedOptions":[32],"dropdownOpen":[32],"dropdownFlipped":[32],"searchTerm":[32],"clearSelection":[64]},null,{"error":["updateInternalError"],"persistentSelectedOptions":["onSelectionChange"]}],[257,"ifx-multiselect-option",{"value":[1],"selected":[1540],"disabled":[1540],"indeterminate":[1540],"isExpanded":[32],"hasChildren":[32],"depth":[32],"searchTerm":[32],"isSearchActive":[32],"isSearchDisabled":[32]},[[0,"click","handleClick"],[0,"keydown","handleKeyDown"]]]]],["p-933da006",[[257,"ifx-accordion-item",{"caption":[1],"open":[1028],"AriaLevel":[2,"aria-level"],"internalOpen":[32]},[[0,"keydown","handleKeydown"]],{"open":["openChanged"]}],[273,"ifx-accordion",{"autoCollapse":[4,"auto-collapse"]},[[0,"ifxOpen","onItemOpen"]]]]],["p-242fc6b0",[[256,"ifx-select",{"value":[1],"name":[1],"items":[16],"choices":[1],"renderChoiceLimit":[2,"render-choice-limit"],"maxItemCount":[2,"max-item-count"],"addItems":[4,"add-items"],"removeItems":[4,"remove-items"],"removeItemButton":[4,"remove-item-button"],"editItems":[4,"edit-items"],"duplicateItemsAllowed":[4,"duplicate-items-allowed"],"delimiter":[1],"paste":[4],"showSearch":[4,"show-search"],"searchChoices":[4,"search-choices"],"searchFields":[1,"search-fields"],"searchFloor":[2,"search-floor"],"searchResultLimit":[2,"search-result-limit"],"position":[1],"resetScrollPosition":[4,"reset-scroll-position"],"shouldSort":[4,"should-sort"],"shouldSortItems":[4,"should-sort-items"],"sorter":[16],"placeholder":[8],"searchPlaceholderValue":[1,"search-placeholder-value"],"prependValue":[1,"prepend-value"],"appendValue":[1,"append-value"],"renderSelectedChoices":[1,"render-selected-choices"],"loadingText":[1,"loading-text"],"noResultsText":[1,"no-results-text"],"noChoicesText":[1,"no-choices-text"],"itemSelectText":[1,"item-select-text"],"addItemText":[1,"add-item-text"],"maxItemText":[1,"max-item-text"],"uniqueItemText":[1,"unique-item-text"],"classNames":[16,"class-names"],"fuseOptions":[16,"fuse-options"],"addItemFilter":[1,"add-item-filter"],"customAddItemText":[1,"custom-add-item-text"],"callbackOnInit":[16,"callback-on-init"],"callbackOnCreateTemplates":[16,"callback-on-create-templates"],"valueComparer":[16,"value-comparer"],"error":[4],"label":[1],"caption":[1],"disabled":[4],"required":[4],"placeholderValue":[1,"placeholder-value"],"options":[1025],"size":[1],"showClearButton":[4,"show-clear-button"],"selectedOption":[32],"optionIsSelected":[32],"clearSelection":[64],"handleChange":[64],"highlightItem":[64],"unhighlightItem":[64],"highlightAll":[64],"unhighlightAll":[64],"removeActiveItemsByValue":[64],"removeActiveItems":[64],"removeHighlightedItems":[64],"showDropdown":[64],"hideDropdown":[64],"getValue":[64],"setValue":[64],"setChoiceByValue":[64],"setChoices":[64],"clearChoices":[64],"clearStore":[64],"clearInput":[64],"ajax":[64],"handleDeleteIcon":[64]},[[5,"mousedown","handleOutsideClick"]],{"disabled":["watchDisabled"]}]]],["p-8ab64504",[[257,"ifx-spinner",{"size":[1],"variant":[1],"inverted":[4],"ariaLabel":[1,"aria-label"]}],[257,"ifx-text-field",{"placeholder":[1],"value":[1025],"error":[4],"label":[1],"icon":[1],"caption":[1],"size":[1],"required":[4],"success":[4],"disabled":[4],"readOnly":[4,"read-only"],"maxlength":[2],"showDeleteIcon":[4,"show-delete-icon"],"autocomplete":[1],"type":[1],"internalId":[1,"internal-id"],"internalType":[32],"reset":[64]},null,{"value":["valueWatcher"]}]]],["p-b23596f4",[[257,"ifx-search-field",{"value":[1025],"suggestions":[16],"showSuggestions":[4,"show-suggestions"],"maxSuggestions":[2,"max-suggestions"],"maxHistoryItems":[2,"max-history-items"],"enableHistory":[4,"enable-history"],"historyKey":[1,"history-key"],"historyHeaderText":[1,"history-header-text"],"ariaLabel":[1,"aria-label"],"ariaLabelledBy":[1,"aria-labelled-by"],"ariaDescribedBy":[1,"aria-described-by"],"deleteIconAriaLabel":[1,"delete-icon-aria-label"],"historyDeleteAriaLabel":[1,"history-delete-aria-label"],"dropdownAriaLabel":[1,"dropdown-aria-label"],"suggestionAriaLabel":[1,"suggestion-aria-label"],"historyItemAriaLabel":[1,"history-item-aria-label"],"showDeleteIcon":[4,"show-delete-icon"],"disabled":[4],"size":[1],"placeholder":[1],"autocomplete":[1],"maxlength":[2],"showDropdown":[32],"filteredSuggestions":[32],"selectedSuggestionIndex":[32],"searchHistory":[32],"showDeleteIconInternalState":[32],"isFocused":[32]},[[5,"mousedown","handleOutsideClick"],[0,"keydown","handleKeyDown"]],{"value":["valueWatcher"],"suggestions":["suggestionsWatcher"]}]]],["p-91ce7e7b",[[257,"ifx-icon-button",{"variant":[1],"size":[1],"disabled":[4],"icon":[1],"href":[1],"target":[1],"shape":[1],"ariaLabel":[1,"aria-label"],"internalIcon":[32],"setFocus":[64]},[[2,"click","handleClick"]],{"icon":["updateIcon"]}]]],["p-ad702dcc",[[257,"ifx-button",{"variant":[1],"theme":[1],"size":[1],"disabled":[4],"href":[1],"target":[1],"type":[1],"fullWidth":[4,"full-width"],"ariaLabel":[1,"aria-label"],"internalHref":[32],"setFocus":[64]},[[0,"keydown","handleKeyDown"],[2,"click","handleHostClick"]],{"href":["setInternalHref"]}]]],["p-0100cbfb",[[257,"ifx-indicator",{"inverted":[4],"ariaLabel":[1,"aria-label"],"variant":[1],"number":[2],"filteredNumber":[32]}]]],["p-f63ba4a3",[[257,"ifx-checkbox",{"disabled":[4],"checked":[4],"error":[4],"size":[1],"indeterminate":[4],"value":[1],"internalChecked":[32],"internalIndeterminate":[32],"isChecked":[64],"toggleCheckedState":[64]},null,{"checked":["valueChanged"],"error":["errorChanged"],"indeterminate":["indeterminateChanged"]}]]],["p-ae513612",[[257,"ifx-pagination",{"currentPage":[2,"current-page"],"showItemsPerPage":[4,"show-items-per-page"],"total":[2],"itemsPerPage":[1,"items-per-page"],"internalPage":[32],"internalItemsPerPage":[32],"numberOfPages":[32],"filteredItemsPerPage":[32],"visiblePages":[32]},[[0,"ifxSelect","setItemsPerPage"]],{"total":["watchTotalHandler"],"currentPage":["currentPageWatcher"]}],[257,"ifx-chip",{"placeholder":[1],"size":[1],"value":[1025],"variant":[1],"theme":[1],"readOnly":[4,"read-only"],"ariaLabel":[1,"aria-label"],"disabled":[4],"icon":[1],"opened":[32],"selectedOptions":[32]},[[5,"mousedown","closeDropdownOnOutsideClick"],[0,"keydown","handleKeyDown"],[0,"ifxChipItemSelect","updateSelectedOptions"]],{"value":["handleValueChange"],"readOnly":["handleReadOnlyChange"]}],[257,"ifx-chip-item",{"value":[1],"chipState":[16,"chip-state"],"selected":[1540]},[[16,"ifxChipItemSelect","updateItemSelection"]],{"selected":["validateSelected"]}]]],["p-d3236a63",[[257,"ifx-link",{"href":[1],"target":[1],"variant":[1],"size":[1],"disabled":[4],"download":[1],"ariaLabel":[1,"aria-label"],"internalHref":[32],"internalTarget":[32],"internalVariant":[32]}]]],["p-bbd819a8",[[256,"ifx-icon",{"icon":[1025],"ifxIcon":[1032,"ifx-icon"],"internalIcon":[32]},null,{"icon":["updateIcon"]}]]]]'),e)}));
 //# sourceMappingURL=infineon-design-system-stencil.esm.js.map

package/dist/infineon-design-system-stencil/p-1d32590c.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,c as i,h as t,a as r}from"./p-DtIEDtZ8.js";import{d as a,t as o}from"./p-DcmcuUOA.js";import{i as s}from"./p-Bw2fh5LT.js";const n='.date__picker-container{display:flex;flex-direction:column}.date__picker-container .label__wrapper{color:#1D1D1D;font:400 1rem/1.5rem "Source Sans 3"}.date__picker-container .label__wrapper .asterisk{display:none}.date__picker-container .label__wrapper .asterisk.required{display:inline;margin-left:4px}.date__picker-container .label__wrapper .asterisk.required.error{color:#CD002F}.date__picker-container.disabled .label__wrapper{color:#BFBBBB}.date__picker-container.error .caption__wrapper{color:#CD002F}.date__picker-container.disabled .caption__wrapper{color:#BFBBBB}.date__picker-container .caption__wrapper{margin-top:4px;color:#1D1D1D;font:400 0.75rem/1rem "Source Sans 3"}.date__picker-input{box-sizing:border-box;font-family:"Source Sans 3";outline:none;width:100%;cursor:pointer;border-radius:1px;border:1px solid #8D8786;height:100%}.date__picker-input.firefox__classes{padding:0px 14px;box-sizing:border-box;color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px;cursor:pointer}.date__picker-input.firefox__classes:disabled{color:#FFFFFF}.date__picker-input:focus:not(.error,.success){border-color:#0A8276}.date__picker-input:hover:not(:disabled,:focus,.error,.success){border-color:#575352}.date__picker-input:disabled{border-color:#BFBBBB;background-color:#BFBBBB;cursor:default}.date__picker-input.error{border-color:#CD002F}.date__picker-input.success:not(.error){border-color:#4CA460}.date__picker-input::-webkit-datetime-edit-text{color:#8D8786;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.date__picker-input:disabled::-webkit-datetime-edit,.date__picker-input:disabled::-webkit-datetime-edit-text{color:#FFFFFF}.date__picker-input.has-value::-webkit-datetime-edit-text{color:#1D1D1D}.date__picker-input.has-value::-webkit-datetime-edit{color:#1D1D1D}::-webkit-datetime-edit{color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px}::-webkit-datetime-edit-fields-wrapper{padding:8px 16px;padding-bottom:9px;transform:translateY(1px)}::-webkit-inner-spin-button{display:none}::-webkit-calendar-picker-indicator{position:absolute;right:15px;font-size:19px;cursor:pointer;border-radius:1px}::-webkit-calendar-picker-indicator:focus-within{outline:2px solid #0A8276;outline-offset:2px}.input__wrapper{display:flex;justify-content:space-between;align-items:center;align-self:stretch;background:#FFFFFF;position:relative}.input__wrapper.large{height:40px}.input__wrapper.small{height:36px}.input__wrapper.disabled .icon__wrapper{background:none;color:#FFFFFF}.input__wrapper.disabled .icon__wrapper.firefox__classes{display:none}.input__wrapper.disabled .icon__wrapper{background-color:#BFBBBB;color:#FFFFFF}.icon__wrapper{position:absolute;right:17px;padding:2px;display:flex;justify-content:flex-end;align-items:center;pointer-events:none;z-index:100;background-color:#FFFFFF;line-height:16px}.icon__wrapper ifx-icon{vertical-align:middle;z-index:1}.icon__wrapper.firefox__classes:focus-visible::after{content:"";position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;border:2px solid #0A8276;border-radius:15%}.icon__wrapper.firefox__classes::before{content:"";position:absolute;inset:-4px;background-color:#FFFFFF}';const c=class{constructor(t){e(this,t);this.ifxDate=i(this,"ifxDate",7);if(t.$hostElement$["s-ei"]){this.internals=t.$hostElement$["s-ei"]}else{this.internals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.internals}this.inputId=`ifx-date-picker-${++p}`;this.size="s";this.error=false;this.success=false;this.disabled=false;this.type="date";this.required=false;this.autocomplete="on"}getInput(){const e=this.el.shadowRoot.querySelector(".date__picker-input");return e}getDate(e){const i=e.target.value;const t=new Date(i);const r=t.getDate();const a=t.getMonth()+1;const o=t.getFullYear();if(!i){if(this.type==="datetime-local"){const e=t.getHours();const i=t.getMinutes();this.ifxDate.emit({day:r,month:a,year:o,hours:e,minutes:i})}else{this.ifxDate.emit({day:r,month:a,year:o})}return}const s=this.getInput();s.classList.add("has-value");if(this.type==="datetime-local"){const e=t.getHours();const i=t.getMinutes();this.ifxDate.emit({day:r,month:a,year:o,hours:e,minutes:i})}else{this.ifxDate.emit({day:r,month:a,year:o})}}handleIconKeyDown(e){if(this.disabled)return;const i=this.isFirefox();const t=this.getInput();if(e.key==="Enter"&&i){e.preventDefault();if(t.showPicker){t.showPicker()}}}isFirefox(){const e=navigator.userAgent.indexOf("Firefox")!==-1;return e}setFireFoxClasses(){const e=this.isFirefox();const i=this.getInput();const t=this.el.shadowRoot.querySelector(".icon__wrapper");if(e){i.classList.add("firefox__classes");t.classList.add("firefox__classes")}else if(i.classList.contains("firefox__classes")){i.classList.remove("firefox__classes");t.classList.remove("firefox__classes")}}async componentDidLoad(){if(!s(this.el)){const e=a();o("ifx-date-picker",await e)}this.setFireFoxClasses()}componentWillUpdate(){if(this.value){this.getDate({target:{value:this.value}})}}render(){var e,i;return t("div",{key:"c5a9cbf6cf78e68f29e469c47d225b7fa43395ce",class:`date__picker-container ${this.error?"error":""} ${this.disabled?"disabled":""}`},t("label",{key:"58768f5801a2af813731546261fa2f4b1071c3ea",class:"label__wrapper",htmlFor:this.inputId},(e=this.label)===null\|\|e===void 0?void 0:e.trim(),t("span",{key:"3549aefb36c31c78bcf40b0d4b7eccacd4254fea",class:`asterisk ${this.required?"required":""} ${this.error?"error":""}`},"*")),t("div",{key:"56d78df19a3cd59f0c7d2d23c50e204e77c9db98",class:`input__wrapper ${this.size==="l"?"large":"small"} ${this.disabled?"disabled":""}`},t("input",{key:"0df030854c2d0cbbd13d0d06a5af7503f91cbf7c",type:this.type,autocomplete:this.autocomplete,class:`date__picker-input ${this.error?"error":""} ${this.success?"success":""}`,disabled:this.disabled?true:undefined,"aria-invalid":this.error?true:undefined,"aria-label":this.ariaLabel,max:this.max,min:this.min,value:this.value,required:this.required,onChange:e=>this.getDate(e)}),t("div",{key:"70cbc9028903d19b1a07991f8c5ca89a39a244b5",class:"icon__wrapper",tabIndex:this.isFirefox()?0:undefined,onKeyDown:e=>this.handleIconKeyDown(e)},t("ifx-icon",{key:"8c6cecb12e9f388a0db594236753922db6a44fb8",icon:"calendar16","aria-hidden":"true"}))),((i=this.caption)===null\|\|i===void 0?void 0:i.trim())&&t("div",{key:"e730e0de7be1c2c79cf03f8dafccf341b0b59990",class:"caption__wrapper"},this.caption.trim()))}get el(){return r(this)}};let p=0;c.style=n;export{c as ifx_date_picker};
2	+ //# sourceMappingURL=p-1d32590c.entry.js.map

package/dist/infineon-design-system-stencil/p-1d32590c.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["datePickerCss","DatePicker","constructor","hostRef","this","inputId","datePickerId","size","error","success","disabled","type","required","autocomplete","getInput","input","el","shadowRoot","querySelector","getDate","e","inputValue","target","value","selectedDate","Date","day","month","getMonth","year","getFullYear","hours","getHours","minutes","getMinutes","ifxDate","emit","classList","add","handleIconKeyDown","browserIsFirefox","isFirefox","key","preventDefault","showPicker","navigator","userAgent","indexOf","setFireFoxClasses","iconWrapper","contains","remove","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","componentWillUpdate","render","h","class","htmlFor","_a","label","trim","undefined","ariaLabel","max","min","onChange","tabIndex","onKeyDown","icon","_b","caption"],"sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n\n & .asterisk { \n display: none;\n &.required {\n display: inline;\n margin-left: 4px;\n \n &.error {\n color: tokens.$ifxColorRed500;\n }\n }\n }\n\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering300;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n box-sizing: border-box;\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 0px 14px;\n box-sizing: border-box;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n\n &:disabled {\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering300;\n background-color: tokens.$ifxColorEngineering300;\n cursor: default;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &:disabled::-webkit-datetime-edit,\n &:disabled::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background: none;\n color: tokens.$ifxColorBaseWhite;\n &.firefox__classes { \n display: none;\n }\n }\n & .icon__wrapper { \n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n z-index: 1;\n }\n\n &.firefox__classes {\n &:focus-visible::after {\n content: '';\n position: absolute;\n top: -4px;\n left: -4px;\n right: -4px;\n bottom: -4px;\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 15%;\n }\n\n &::before {\n content: '';\n position: absolute;\n inset: -4px;\n background-color: tokens.$ifxColorBaseWhite;\n }\n }\n}","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n // formAssociated: true,\n})\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string | null;\n @Prop() value: string;\n @Prop() type: string = 'date';\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getInput() {\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n return input;\n }\n\n getDate(e) {\n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1;\n const year = selectedDate.getFullYear();\n\n if (!inputValue) {\n //this.internals.setFormValue(null);\n\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n return;\n }\n\n const input = this.getInput();\n input.classList.add('has-value');\n\n //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if (this.type === 'datetime-local') {\n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({ day, month, year, hours, minutes });\n } else {\n this.ifxDate.emit({ day, month, year });\n }\n }\n\n handleIconKeyDown(e: KeyboardEvent) {\n if (this.disabled) return;\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n if (e.key === 'Enter' && browserIsFirefox) {\n e.preventDefault();\n if (input.showPicker) {\n input.showPicker();\n }\n }\n }\n\n isFirefox() {\n const isFirefox = navigator.userAgent.indexOf('Firefox') !== -1;\n return isFirefox;\n }\n\n setFireFoxClasses() {\n const browserIsFirefox = this.isFirefox();\n const input = this.getInput();\n const iconWrapper = this.el.shadowRoot.querySelector('.icon__wrapper');\n\n if (browserIsFirefox) {\n input.classList.add('firefox__classes');\n iconWrapper.classList.add('firefox__classes');\n } else if (input.classList.contains('firefox__classes')) {\n input.classList.remove('firefox__classes');\n iconWrapper.classList.remove('firefox__classes');\n }\n }\n\n async componentDidLoad() {\n if (!isNestedInIfxComponent(this.el)) {\n const framework = detectFramework();\n trackComponent('ifx-date-picker', await framework);\n }\n this.setFireFoxClasses();\n }\n\n componentWillUpdate() {\n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n // formResetCallback() {\n // this.internals.setFormValue(null);\n // }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}`}>\n <label class=\"label__wrapper\" htmlFor={this.inputId}>\n {this.label?.trim()}\n <span class={`asterisk ${this.required ? 'required' : ''} ${this.error ? 'error' : ''}`}>*</span>\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : ''} ${this.success ? 'success' : ''}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={e => this.getDate(e)}\n />\n <div class=\"icon__wrapper\" tabIndex={this.isFirefox() ? 0 : undefined} onKeyDown={e => this.handleIconKeyDown(e as KeyboardEvent)}>\n <ifx-icon icon=\"calendar16\" aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n {this.caption?.trim() && <div class=\"caption__wrapper\">{this.caption.trim()}</div>}\n </div>\n );\n }\n}\n\nlet datePickerId = 0;\n"],"mappings":"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","ignoreList":[]}