npm - @siemens/ix - Versions diffs - 2.2.0 → 2.2.1 - Mend

@siemens/ix 2.2.0 → 2.2.1

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

package/dist/cjs/ix-time-picker.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-time-picker.entry.cjs.js","mappings":"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","names":["DateTime","h","Host","index"],"sources":["src/components/time-picker/time-picker.scss?tag=ix-time-picker&encapsulation=shadow","src/components/time-picker/time-picker.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n@import 'components/form/input';\n\n:host {\n @include ix-component;\n @import 'legacy/components/forms';\n\n display: block;\n position: relative;\n width: 22rem;\n\n @media (max-width: 576px) {\n .clock {\n padding: 1.5rem 0;\n }\n\n .header {\n height: $medium-control-height !important;\n }\n }\n\n @media (min-width: 576px) {\n .clock {\n padding: 4.25rem 0;\n }\n\n .header {\n height: $large-control-height !important;\n }\n }\n\n .header {\n display: flex;\n align-items: center;\n justify-content: center;\n height: $large-control-height;\n }\n\n .flex {\n display: flex;\n }\n\n .clock {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n input,\n .time-reference {\n width: 2.625rem;\n height: $large-space;\n text-align: center;\n margin-top: 0.25rem;\n margin-bottom: 0.25rem;\n\n / Chrome, Safari, Edge, Opera /\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0 0.3125rem;\n }\n\n / Firefox /\n &[type='number'] {\n -moz-appearance: textfield;\n }\n }\n\n .form-control[type='number'] {\n text-align: center;\n }\n\n .columns {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-around;\n }\n\n .column-seperator {\n display: flex;\n align-items: center;\n margin: 0 $tiny-space;\n }\n\n .button {\n display: flex;\n justify-content: flex-end;\n }\n\n .default-space {\n margin-left: $default-space;\n }\n\n .text-align {\n text-align: center;\n }\n\n .hidden {\n display: none;\n }\n\n .time-reference {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nexport type TimePickerCorners = DateTimeCardCorners;\n\ninterface TimePickerDescriptor {\n unit: 'hour' \| 'minute' \| 'second';\n placeholder: string;\n hidden: boolean;\n}\n\ninterface TimeOutputFormat {\n hour: string;\n minute: string;\n second: string;\n}\n\n@Component({\n tag: 'ix-time-picker',\n styleUrl: 'time-picker.scss',\n shadow: true,\n})\nexport class TimePicker {\n /\n Format of time string\n * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n \n @since 1.1.0\n /\n @Prop() format: string = 'TT';\n\n /\n Corner style\n /\n @Prop() corners: TimePickerCorners = 'rounded';\n\n /\n Controls the visual presentation and styling of the component when it is displayed as a standalone element\n /\n @Prop() standaloneAppearance: boolean = true;\n\n /\n @deprecated Not supported since 2.0.0.\n /\n @Prop() individual: boolean = true;\n\n /\n Show hour input\n /\n @Prop() showHour = true;\n\n /\n Show minutes input\n /\n @Prop() showMinutes = true;\n\n /\n Show seconds input\n /\n @Prop() showSeconds = true;\n\n /\n Select time with format string\n * Format has to match the `format` property.\n \n @since 1.1.0\n /\n @Prop() time: string = DateTime.now().toFormat(this.format);\n\n @Watch('time')\n watchTimePropHandler(newValue: string) {\n this._time = DateTime.fromFormat(newValue, this.format);\n if (!this._time.isValid) {\n throw new Error('Format is not supported or not correct');\n }\n }\n\n /\n Show time reference input\n \n @since 1.1.0 time reference is default aligned with format tt\n * @deprecated Since 2.0.0 time reference will be displayed depending on format.\n /\n // eslint-disable-next-line @stencil-community/strict-mutable\n @Prop({ mutable: true }) showTimeReference?: boolean = undefined;\n\n /\n Set time reference\n /\n @Prop() timeReference: 'AM' \| 'PM' \| undefined;\n\n /\n Text of date select button\n \n @since 1.1.0\n /\n @Prop() textSelectTime = 'Done';\n\n /\n Text for top label\n \n @since 2.1.0\n /\n @Prop() textTime: string = 'Time';\n\n /\n Time event\n /\n @Event() timeSelect: EventEmitter<string>;\n\n /\n Time event\n * @deprecated Will be removed in 3.0.0. Use `time-select` event.\n /\n @Event() done: EventEmitter<string>;\n\n /\n Time change event\n /\n @Event() timeChange: EventEmitter<string>;\n\n @State() private _time: DateTime;\n @State() private _timeRef: 'AM' \| 'PM' \| undefined;\n @State() private _formattedTime: TimeOutputFormat;\n\n componentWillLoad() {\n this._time = DateTime.fromFormat(this.time, this.format);\n\n if (!this._time.isValid) {\n console.error(\n `Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`\n );\n return;\n }\n\n this._timeRef = this.format.includes('a')\n ? (DateTime.fromFormat(this.time, this.format).toFormat('a') as\n \| 'AM'\n \| 'PM')\n : undefined;\n this.formatTime();\n }\n\n @Watch('_time')\n formatTime() {\n const [hour, minute, second] = this._time\n .toFormat(this.format)\n .split(' ')[0]\n .split(':');\n\n this._formattedTime = {\n hour: hour,\n minute: minute,\n second: second,\n };\n }\n\n @Watch('_time')\n onInternalTimeChange() {\n this.timeChange.emit(this._time.toFormat(this.format));\n if (this._timeRef) this._timeRef = this._time.toFormat('a') as 'AM' \| 'PM';\n }\n\n timeUpdate(unit: 'hour' \| 'minute' \| 'second', value: number): number {\n let maxValue = DateTime.now().endOf('day').get(unit);\n\n if (this._timeRef === 'PM' && unit === 'hour') value += 12;\n if (this._timeRef === 'AM' && unit === 'hour') maxValue = 12;\n\n if (value > maxValue) {\n value = maxValue;\n } else if (value < 0) {\n value = 0;\n }\n\n this._time = this._time.set({\n [unit]: value,\n });\n return value;\n }\n\n changeTimeReference() {\n this._timeRef = this._timeRef === 'AM' ? 'PM' : 'AM';\n\n if (!this._time.toFormat('a').includes(this._timeRef)) {\n this._time = this._time.plus({\n hour: 12,\n });\n }\n }\n\n /\n Get the current time based on the wanted format\n */\n @Method()\n async getCurrentTime() {\n return this._time.toFormat(this.format);\n }\n\n render() {\n let timepickerInformation: TimePickerDescriptor[] = [\n {\n unit: 'hour',\n placeholder: 'HH',\n hidden: !this.showHour,\n },\n {\n unit: 'minute',\n placeholder: 'MM',\n hidden: !this.showMinutes,\n },\n {\n unit: 'second',\n placeholder: 'SS',\n hidden: !this.showSeconds,\n },\n ];\n\n timepickerInformation = timepickerInformation.filter(\n (item) => !item.hidden\n );\n\n return (\n <Host>\n <ix-date-time-card\n standaloneAppearance={this.standaloneAppearance}\n corners={this.corners}\n >\n <div class=\"header\" slot=\"header\">\n <ix-typography variant=\"default-title\">\n {this.textTime \|\| 'Time'}\n </ix-typography>\n </div>\n <div class=\"clock\">\n {timepickerInformation.map((descriptor, index: number) => (\n <div class=\"flex\">\n <div class={{ columns: true, hidden: descriptor.hidden }}>\n <ix-icon-button\n size=\"16\"\n onClick={() =>\n (this._time = this._time.plus({\n [descriptor.unit]: 1,\n }))\n }\n ghost\n icon=\"chevron-up\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n\n <input\n class=\"form-control\"\n name={descriptor.unit}\n type=\"number\"\n placeholder={descriptor.placeholder}\n value={\n this._formattedTime\n ? this._formattedTime[descriptor.unit]\n : null\n }\n onKeyDown={(e) => {\n if (e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return;\n\n const value = e.key === 'ArrowUp' ? 1 : -1;\n this._time = this._time.plus({\n [descriptor.unit]: value,\n });\n e.preventDefault();\n }}\n onChange={(e: any) => {\n let inputElement = e.target as HTMLInputElement;\n inputElement.value = this.timeUpdate(\n descriptor.unit,\n +inputElement.value\n ).toString();\n }}\n ></input>\n\n <ix-icon-button\n size=\"16\"\n onClick={() =>\n (this._time = this._time.minus({\n [descriptor.unit]: 1,\n }))\n }\n ghost\n icon=\"chevron-down\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n </div>\n\n {index !== timepickerInformation.length - 1 && (\n <div\n class={{\n 'column-seperator': true,\n hidden: descriptor.hidden,\n }}\n >\n :\n </div>\n )}\n </div>\n ))}\n\n <div\n class={{\n columns: true,\n 'default-space': true,\n hidden: this._timeRef === undefined,\n }}\n >\n <ix-icon-button\n size=\"16\"\n onClick={() => this.changeTimeReference()}\n ghost\n icon=\"chevron-up\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n <div class=\"time-reference\">{this._timeRef}</div>\n <ix-icon-button\n size=\"16\"\n onClick={() => this.changeTimeReference()}\n ghost\n icon=\"chevron-down\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n </div>\n </div>\n <div class={{ button: true, hidden: !this.standaloneAppearance }}>\n <ix-button\n onClick={() => {\n this.timeSelect.emit(this._time.toFormat(this.format));\n this.done.emit(this._time.toFormat(this.format));\n }}\n >\n {this.textSelectTime}\n </ix-button>\n </div>\n </ix-date-time-card>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-time-picker.entry.cjs.js","mappings":"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","names":["DateTime","h","Host","index"],"sources":["src/components/time-picker/time-picker.scss?tag=ix-time-picker&encapsulation=shadow","src/components/time-picker/time-picker.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n@import 'components/form/input';\n\n:host {\n @include ix-component;\n @import 'legacy/components/forms';\n\n display: block;\n position: relative;\n width: 22rem;\n\n @media (max-width: 576px) {\n .clock {\n padding: 1.5rem 0;\n }\n\n .header {\n height: $medium-control-height !important;\n }\n }\n\n @media (min-width: 576px) {\n .clock {\n padding: 4.25rem 0;\n }\n\n .header {\n height: $large-control-height !important;\n }\n }\n\n .header {\n display: flex;\n align-items: center;\n justify-content: center;\n height: $large-control-height;\n }\n\n .flex {\n display: flex;\n }\n\n .clock {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n input,\n .time-reference {\n width: 2.625rem;\n height: $large-space;\n text-align: center;\n margin-top: 0.25rem;\n margin-bottom: 0.25rem;\n\n / Chrome, Safari, Edge, Opera /\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0 0.3125rem;\n }\n\n / Firefox /\n &[type='number'] {\n -moz-appearance: textfield;\n }\n }\n\n .form-control[type='number'] {\n text-align: center;\n }\n\n .columns {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-around;\n }\n\n .column-seperator {\n display: flex;\n align-items: center;\n margin: 0 $tiny-space;\n }\n\n .button {\n display: flex;\n justify-content: flex-end;\n }\n\n .default-space {\n margin-left: $default-space;\n }\n\n .text-align {\n text-align: center;\n }\n\n .hidden {\n display: none;\n }\n\n .time-reference {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nexport type TimePickerCorners = DateTimeCardCorners;\n\ninterface TimePickerDescriptor {\n unit: 'hour' \| 'minute' \| 'second';\n placeholder: string;\n hidden: boolean;\n}\n\ninterface TimeOutputFormat {\n hour: string;\n minute: string;\n second: string;\n}\n\n@Component({\n tag: 'ix-time-picker',\n styleUrl: 'time-picker.scss',\n shadow: true,\n})\nexport class TimePicker {\n /\n Format of time string\n * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n \n @since 1.1.0\n /\n @Prop() format: string = 'TT';\n\n /\n Corner style\n /\n @Prop() corners: TimePickerCorners = 'rounded';\n\n /\n Controls the visual presentation and styling of the component when it is displayed as a standalone element\n /\n @Prop() standaloneAppearance: boolean = true;\n\n /\n @deprecated Not supported since 2.0.0.\n /\n @Prop() individual: boolean = true;\n\n /\n Show hour input\n /\n @Prop() showHour = true;\n\n /\n Show minutes input\n /\n @Prop() showMinutes = true;\n\n /\n Show seconds input\n /\n @Prop() showSeconds = true;\n\n /\n Select time with format string\n * Format has to match the `format` property.\n \n @since 1.1.0\n /\n @Prop() time: string = DateTime.now().toFormat(this.format);\n\n @Watch('time')\n watchTimePropHandler(newValue: string) {\n this._time = DateTime.fromFormat(newValue, this.format);\n if (!this._time.isValid) {\n throw new Error('Format is not supported or not correct');\n }\n }\n\n /\n Show time reference input\n \n @since 1.1.0 time reference is default aligned with format tt\n * @deprecated Since 2.0.0 time reference will be displayed depending on format.\n /\n // eslint-disable-next-line @stencil-community/strict-mutable\n @Prop({ mutable: true }) showTimeReference?: boolean = undefined;\n\n /\n Set time reference\n /\n @Prop() timeReference: 'AM' \| 'PM' \| undefined;\n\n /\n Text of date select button\n \n @since 1.1.0\n /\n @Prop() textSelectTime = 'Done';\n\n /\n Text for top label\n \n @since 2.1.0\n /\n @Prop() textTime: string = 'Time';\n\n /\n Time event\n /\n @Event() timeSelect: EventEmitter<string>;\n\n /\n Time event\n * @deprecated Will be removed in 3.0.0. Use `time-select` event.\n /\n @Event() done: EventEmitter<string>;\n\n /\n Time change event\n /\n @Event() timeChange: EventEmitter<string>;\n\n @State() private _time: DateTime;\n @State() private _timeRef: 'AM' \| 'PM' \| undefined;\n @State() private _formattedTime: TimeOutputFormat;\n\n componentWillLoad() {\n this._time = DateTime.fromFormat(this.time, this.format);\n\n if (!this._time.isValid) {\n console.error(\n `Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`\n );\n return;\n }\n\n this._timeRef = this.format.includes('a')\n ? (DateTime.fromFormat(this.time, this.format).toFormat('a') as\n \| 'AM'\n \| 'PM')\n : undefined;\n this.formatTime();\n }\n\n @Watch('_time')\n formatTime() {\n const [hour, minute, second] = this._time\n .toFormat(this.format)\n .split(' ')[0]\n .split(':');\n\n this._formattedTime = {\n hour: hour,\n minute: minute,\n second: second,\n };\n }\n\n @Watch('_time')\n onInternalTimeChange() {\n this.timeChange.emit(this._time.toFormat(this.format));\n if (this._timeRef) this._timeRef = this._time.toFormat('a') as 'AM' \| 'PM';\n }\n\n timeUpdate(unit: 'hour' \| 'minute' \| 'second', value: number): number {\n let maxValue = DateTime.now().endOf('day').get(unit);\n\n if (this._timeRef === 'PM' && unit === 'hour') value += 12;\n if (this._timeRef === 'AM' && unit === 'hour') maxValue = 12;\n\n if (value > maxValue) {\n value = maxValue;\n } else if (value < 0) {\n value = 0;\n }\n\n this._time = this._time.set({\n [unit]: value,\n });\n return value;\n }\n\n changeTimeReference() {\n this._timeRef = this._timeRef === 'AM' ? 'PM' : 'AM';\n\n if (!this._time.toFormat('a').includes(this._timeRef)) {\n this._time = this._time.plus({\n hour: 12,\n });\n }\n }\n\n /\n Get the current time based on the wanted format\n */\n @Method()\n async getCurrentTime() {\n return this._time.toFormat(this.format);\n }\n\n render() {\n let timepickerInformation: TimePickerDescriptor[] = [\n {\n unit: 'hour',\n placeholder: 'HH',\n hidden: !this.showHour,\n },\n {\n unit: 'minute',\n placeholder: 'MM',\n hidden: !this.showMinutes,\n },\n {\n unit: 'second',\n placeholder: 'SS',\n hidden: !this.showSeconds,\n },\n ];\n\n timepickerInformation = timepickerInformation.filter(\n (item) => !item.hidden\n );\n\n return (\n <Host>\n <ix-date-time-card\n standaloneAppearance={this.standaloneAppearance}\n corners={this.corners}\n >\n <div class=\"header\" slot=\"header\">\n <ix-typography variant=\"default-title\">\n {this.textTime \|\| 'Time'}\n </ix-typography>\n </div>\n <div class=\"clock\">\n {timepickerInformation.map((descriptor, index: number) => (\n <div class=\"flex\">\n <div class={{ columns: true, hidden: descriptor.hidden }}>\n <ix-icon-button\n size=\"16\"\n onClick={() =>\n (this._time = this._time.plus({\n [descriptor.unit]: 1,\n }))\n }\n ghost\n icon=\"chevron-up\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n\n <input\n class=\"form-control\"\n name={descriptor.unit}\n type=\"number\"\n placeholder={descriptor.placeholder}\n value={\n this._formattedTime\n ? this._formattedTime[descriptor.unit]\n : null\n }\n onKeyDown={(e) => {\n if (e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return;\n\n const value = e.key === 'ArrowUp' ? 1 : -1;\n this._time = this._time.plus({\n [descriptor.unit]: value,\n });\n e.preventDefault();\n }}\n onChange={(e: any) => {\n let inputElement = e.target as HTMLInputElement;\n inputElement.value = this.timeUpdate(\n descriptor.unit,\n +inputElement.value\n ).toString();\n }}\n ></input>\n\n <ix-icon-button\n size=\"16\"\n onClick={() =>\n (this._time = this._time.minus({\n [descriptor.unit]: 1,\n }))\n }\n ghost\n icon=\"chevron-down\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n </div>\n\n {index !== timepickerInformation.length - 1 && (\n <div\n class={{\n 'column-seperator': true,\n hidden: descriptor.hidden,\n }}\n >\n :\n </div>\n )}\n </div>\n ))}\n\n <div\n class={{\n columns: true,\n 'default-space': true,\n hidden: this._timeRef === undefined,\n }}\n >\n <ix-icon-button\n size=\"16\"\n onClick={() => this.changeTimeReference()}\n ghost\n icon=\"chevron-up\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n <div class=\"time-reference\">{this._timeRef}</div>\n <ix-icon-button\n size=\"16\"\n onClick={() => this.changeTimeReference()}\n ghost\n icon=\"chevron-down\"\n variant=\"primary\"\n class=\"arrows\"\n ></ix-icon-button>\n </div>\n </div>\n <div class={{ button: true, hidden: !this.standaloneAppearance }}>\n <ix-button\n onClick={() => {\n this.timeSelect.emit(this._time.toFormat(this.format));\n this.done.emit(this._time.toFormat(this.format));\n }}\n >\n {this.textSelectTime}\n </ix-button>\n </div>\n </ix-date-time-card>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/collection/components/category-filter/category-filter.css CHANGED Viewed

@@ -999,7 +999,7 @@ label.label-alignment-left {
   padding: 6px 0px;
 }
-input, input:-webkit-autofill {
+input {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -1021,9 +1021,18 @@ input, input:-webkit-autofill {
   box-shadow: var(--theme-input--box-shadow);
 }
 input:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+input:-webkit-autofill, input:autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 input::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -1032,13 +1041,13 @@ input::placeholder {
   color: var(--theme-input-hint--color);
 }
 input.hover, input:hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 input.focus, input:focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 input:-moz-read-only {
   box-shadow: none;
@@ -1091,7 +1100,7 @@ textarea {
   height: 3.25rem;
   padding: 0.375rem 1.25rem 0.375rem 0.5rem;
 }
-textarea, textarea:-webkit-autofill {
+textarea {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -1113,9 +1122,18 @@ textarea, textarea:-webkit-autofill {
   box-shadow: var(--theme-input--box-shadow);
 }
 textarea:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+textarea:-webkit-autofill, textarea:autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 textarea::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -1124,13 +1142,13 @@ textarea::placeholder {
   color: var(--theme-input-hint--color);
 }
 textarea.hover, textarea:hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 textarea.focus, textarea:focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 textarea:-moz-read-only {
   box-shadow: none;
@@ -1283,7 +1301,7 @@ form:not(.was-validated) .valid-feedback {
   max-height: 3.75rem;
   padding: 1px 1.5rem 1px 1.75rem !important;
 }
-:host .input-container:not(.readonly):not(.disabled), :host .input-container:not(.readonly):not(.disabled):-webkit-autofill {
+:host .input-container:not(.readonly):not(.disabled) {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -1305,9 +1323,18 @@ form:not(.was-validated) .valid-feedback {
   box-shadow: var(--theme-input--box-shadow);
 }
 :host .input-container:not(.readonly):not(.disabled):-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+:host .input-container:not(.readonly):not(.disabled):-webkit-autofill, :host .input-container:not(.readonly):not(.disabled):autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 :host .input-container:not(.readonly):not(.disabled)::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -1316,13 +1343,13 @@ form:not(.was-validated) .valid-feedback {
   color: var(--theme-input-hint--color);
 }
 :host .input-container:not(.readonly):not(.disabled).hover, :host .input-container:not(.readonly):not(.disabled):hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 :host .input-container:not(.readonly):not(.disabled).focus, :host .input-container:not(.readonly):not(.disabled):focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 :host .input-container:not(.readonly):not(.disabled):disabled {
   box-shadow: none;
@@ -1342,7 +1369,7 @@ form:not(.was-validated) .valid-feedback {
   color: var(--theme-input--color--disabled);
   border-bottom: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled);
 }
-:host .input-container.readonly, :host .input-container.readonly:-webkit-autofill {
+:host .input-container.readonly {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -1364,9 +1391,18 @@ form:not(.was-validated) .valid-feedback {
   box-shadow: var(--theme-input--box-shadow);
 }
 :host .input-container.readonly:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+:host .input-container.readonly:-webkit-autofill, :host .input-container.readonly:autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 :host .input-container.readonly::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -1375,13 +1411,13 @@ form:not(.was-validated) .valid-feedback {
   color: var(--theme-input-hint--color);
 }
 :host .input-container.readonly.hover, :host .input-container.readonly:hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 :host .input-container.readonly.focus, :host .input-container.readonly:focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 :host .input-container.readonly:-moz-read-only {
   box-shadow: none;

package/dist/collection/components/dropdown/dropdown.js CHANGED Viewed

@@ -119,6 +119,9 @@ export class Dropdown {
         }));
     }
     registerKeyListener() {
+        if (!this.triggerElement) {
+            return;
+        }
         this.disposeKeyListener = addDisposableEventListener(this.triggerElement, 'keydown', (event) => {
             if (event.key !== 'ArrowDown') {
                 return;
@@ -308,7 +311,7 @@ export class Dropdown {
         this.applyDropdownPosition();
     }
     render() {
-        return (h(Host, { key: '6c86b142d9963a895cfde491883f6a68e3ff9c6d', "data-ix-dropdown": this.localUId, ref: (ref) => (this.dropdownRef = ref), class: {
+        return (h(Host, { key: 'afb0bd3099fd4e5363c4b48f9a718d6b58a29570', "data-ix-dropdown": this.localUId, ref: (ref) => (this.dropdownRef = ref), class: {
                 'dropdown-menu': true,
                 show: this.show,
                 overflow: true,
@@ -316,7 +319,7 @@ export class Dropdown {
                 margin: '0',
                 minWidth: '0px',
                 position: this.positioningStrategy,
-            }, role: "list", onClick: (event) => this.onDropdownClick(event) }, h("div", { key: '2dea0ac7c557fcd1ec0eaaf1939920c12773b6b4', style: { display: 'contents' } }, this.header && h("div", { class: "dropdown-header" }, this.header), h("slot", { key: '3ba4873f1241bd87c55dfb8e46b5f678efd0c514' }))));
+            }, role: "list", onClick: (event) => this.onDropdownClick(event) }, h("div", { key: '19fd27ae702d808e76cf7484c2bca3a7cab38b53', style: { display: 'contents' } }, this.header && h("div", { class: "dropdown-header" }, this.header), h("slot", { key: 'cfaf1630739aba4c96fabf38a7d59780ba7b7a7c' }))));
     }
     static get is() { return "ix-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropdown/dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport { ArrowFocusController } from '../utils/focus';\nimport {\n addDisposableEventListener,\n CloseBehavior,\n dropdownController,\n DropdownInterface,\n hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\n\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /\n Suppress the automatic placement of the dropdown.\n \n @since 2.0.0\n /\n @Prop() suppressAutomaticPlacement = false;\n\n /\n Show dropdown\n /\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /\n Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n /\n @Prop() trigger: string \| HTMLElement \| Promise<HTMLElement>;\n\n /\n Define an anchor element\n /\n @Prop() anchor: string \| HTMLElement;\n\n /\n Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n /\n @Prop() closeBehavior: CloseBehavior = 'both';\n\n /\n Placement of the dropdown\n /\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /\n Position strategy\n /\n @Prop() positioningStrategy: 'absolute' \| 'fixed' = 'fixed';\n\n /\n An optional header shown at the top of the dropdown\n /\n @Prop() header?: string;\n\n /\n Move dropdown along main axis of alignment\n \n @internal\n /\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /\n @internal\n /\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /\n @internal\n * If initialisation of this dropdown is expected to be defered submenu discovery will have to be re-run globally by the controller.\n * This property indicates the need for that to the controller.\n /\n @Prop() discoverAllSubmenus = false;\n\n /\n Fire event after visibility of dropdown has changed\n /\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n private localUId = `dropdown-${sequenceId++}`;\n private assignedSubmenu: string[] = [];\n\n private arrowFocusController: ArrowFocusController;\n private focusDropdownItemBind = this.focusDropdownItem.bind(this);\n\n private itemObserver = new MutationObserver(() => {\n this.arrowFocusController.items = this.dropdownItems;\n });\n\n connectedCallback(): void {\n dropdownController.connected(this);\n\n if (this.trigger != undefined) {\n this.registerListener(this.trigger);\n }\n }\n\n @Listen('ix-assign-sub-menu')\n cacheSubmenuId(event: CustomEvent<string>) {\n event.stopImmediatePropagation();\n event.preventDefault();\n\n const { detail } = event;\n\n if (this.assignedSubmenu.indexOf(detail) === -1) {\n this.assignedSubmenu.push(detail);\n }\n }\n\n disconnectedCallback() {\n dropdownController.dismiss(this);\n dropdownController.disconnected(this);\n\n if (this.disposeClickListener) {\n this.disposeClickListener();\n }\n\n if (this.disposeKeyListener) {\n this.disposeKeyListener();\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n }\n\n getAssignedSubmenuIds() {\n return this.assignedSubmenu;\n }\n\n isPresent() {\n return this.show;\n }\n\n present() {\n this.show = true;\n }\n\n dismiss() {\n this.show = false;\n }\n\n getId() {\n return this.localUId;\n }\n\n willDismiss() {\n const { defaultPrevented } = this.showChanged.emit(false);\n return !defaultPrevented;\n }\n\n willPresent() {\n const { defaultPrevented } = this.showChanged.emit(true);\n return !defaultPrevented;\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot.querySelector('slot');\n }\n\n private disposeClickListener?: () => void;\n private disposeKeyListener?: () => void;\n\n private addEventListenersFor() {\n this.disposeClickListener?.();\n this.disposeKeyListener?.();\n\n const toggleController = () => {\n if (!this.isPresent()) {\n dropdownController.present(this);\n } else {\n dropdownController.dismiss(this);\n }\n\n dropdownController.dismissOthers(this.getId());\n };\n\n this.disposeClickListener = addDisposableEventListener(\n this.triggerElement,\n 'click',\n (event: PointerEvent) => {\n if (!event.defaultPrevented) {\n toggleController();\n }\n }\n );\n\n this.triggerElement?.setAttribute(\n 'data-ix-dropdown-trigger',\n this.localUId\n );\n }\n\n /* @internal /\n @Method()\n async discoverSubmenu() {\n this.triggerElement?.dispatchEvent(\n new CustomEvent('ix-assign-sub-menu', {\n bubbles: true,\n composed: false,\n cancelable: true,\n detail: this.localUId,\n })\n );\n }\n\n private registerKeyListener() {\n this.disposeKeyListener = addDisposableEventListener(\n this.triggerElement,\n 'keydown',\n (event: KeyboardEvent) => {\n if (event.key !== 'ArrowDown') {\n return;\n }\n\n if (document.activeElement !== this.triggerElement) {\n return;\n }\n\n dropdownController.present(this);\n\n setTimeout(() => {\n this.focusDropdownItem(0);\n });\n }\n );\n }\n\n private async registerListener(\n element: string \| HTMLElement \| Promise<HTMLElement>\n ) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n this.addEventListenersFor();\n this.discoverSubmenu();\n }\n }\n\n private async resolveElement(\n element: string \| HTMLElement \| Promise<HTMLElement>\n ) {\n const el = await this.findElement(element);\n\n return this.checkForSubmenuAnchor(el);\n }\n\n private async checkForSubmenuAnchor(element: Element) {\n if (!element) {\n return null;\n }\n\n if (hasDropdownItemWrapperImplemented(element)) {\n const dropdownItem = await element.getDropdownItemElement();\n dropdownItem.isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n if (element.tagName === 'IX-DROPDOWN-ITEM') {\n (element as HTMLIxDropdownItemElement).isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n return element;\n }\n\n private findElement(\n element: string \| HTMLElement \| Promise<HTMLElement>\n ): Promise<Element> {\n if (element instanceof Promise) {\n return element;\n }\n\n if (typeof element === 'object') {\n return Promise.resolve(element);\n }\n\n if (typeof element != 'string') {\n return;\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n\n this.arrowFocusController = new ArrowFocusController(\n this.dropdownItems,\n this.dropdownRef,\n this.focusDropdownItemBind\n );\n\n this.itemObserver.observe(this.dropdownRef, {\n childList: true,\n subtree: true,\n });\n\n this.registerKeyListener();\n } else {\n this.arrowFocusController.disconnect();\n this.itemObserver.disconnect();\n this.disposeKeyListener?.();\n }\n }\n\n @Watch('trigger')\n changedTrigger(newTriggerValue: string \| HTMLElement \| Promise<HTMLElement>) {\n this.registerListener(newTriggerValue);\n }\n\n private isAnchorSubmenu(): boolean {\n if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n // Is no official dropdown-item, but check if any dropdown-item\n // is placed somewhere up the DOM\n return !!this.anchorElement?.closest('ix-dropdown-item');\n }\n\n return true;\n }\n\n private async applyDropdownPosition() {\n if (!this.show) {\n return;\n }\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n private focusDropdownItem(index: number) {\n requestAnimationFrame(() => {\n this.dropdownItems[index]?.shadowRoot.querySelector('button').focus();\n });\n }\n\n async componentDidLoad() {\n this.changedTrigger(this.trigger);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n }\n\n private isTriggerElement(element: HTMLElement) {\n const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n return trigger;\n }\n\n private onDropdownClick(event: PointerEvent) {\n if (dropdownController.pathIncludesTrigger(event.composedPath())) {\n event.preventDefault();\n\n if (this.isTriggerElement(event.target as HTMLElement)) {\n return;\n }\n }\n\n if (this.closeBehavior === 'inside' \|\| this.closeBehavior === 'both') {\n dropdownController.dismissAll([this.getId()]);\n }\n\n dropdownController.dismissOthers(this.getId());\n }\n\n /\n Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n data-ix-dropdown={this.localUId}\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div style={{ display: 'contents' }}>\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport { ArrowFocusController } from '../utils/focus';\nimport {\n addDisposableEventListener,\n CloseBehavior,\n dropdownController,\n DropdownInterface,\n hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\n\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /\n Suppress the automatic placement of the dropdown.\n \n @since 2.0.0\n /\n @Prop() suppressAutomaticPlacement = false;\n\n /\n Show dropdown\n /\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /\n Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n /\n @Prop() trigger: string \| HTMLElement \| Promise<HTMLElement>;\n\n /\n Define an anchor element\n /\n @Prop() anchor: string \| HTMLElement;\n\n /\n Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n /\n @Prop() closeBehavior: CloseBehavior = 'both';\n\n /\n Placement of the dropdown\n /\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /\n Position strategy\n /\n @Prop() positioningStrategy: 'absolute' \| 'fixed' = 'fixed';\n\n /\n An optional header shown at the top of the dropdown\n /\n @Prop() header?: string;\n\n /\n Move dropdown along main axis of alignment\n \n @internal\n /\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /\n @internal\n /\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /\n @internal\n * If initialisation of this dropdown is expected to be defered submenu discovery will have to be re-run globally by the controller.\n * This property indicates the need for that to the controller.\n /\n @Prop() discoverAllSubmenus = false;\n\n /\n Fire event after visibility of dropdown has changed\n /\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n private localUId = `dropdown-${sequenceId++}`;\n private assignedSubmenu: string[] = [];\n\n private arrowFocusController: ArrowFocusController;\n private focusDropdownItemBind = this.focusDropdownItem.bind(this);\n\n private itemObserver = new MutationObserver(() => {\n this.arrowFocusController.items = this.dropdownItems;\n });\n\n connectedCallback(): void {\n dropdownController.connected(this);\n\n if (this.trigger != undefined) {\n this.registerListener(this.trigger);\n }\n }\n\n @Listen('ix-assign-sub-menu')\n cacheSubmenuId(event: CustomEvent<string>) {\n event.stopImmediatePropagation();\n event.preventDefault();\n\n const { detail } = event;\n\n if (this.assignedSubmenu.indexOf(detail) === -1) {\n this.assignedSubmenu.push(detail);\n }\n }\n\n disconnectedCallback() {\n dropdownController.dismiss(this);\n dropdownController.disconnected(this);\n\n if (this.disposeClickListener) {\n this.disposeClickListener();\n }\n\n if (this.disposeKeyListener) {\n this.disposeKeyListener();\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n }\n\n getAssignedSubmenuIds() {\n return this.assignedSubmenu;\n }\n\n isPresent() {\n return this.show;\n }\n\n present() {\n this.show = true;\n }\n\n dismiss() {\n this.show = false;\n }\n\n getId() {\n return this.localUId;\n }\n\n willDismiss() {\n const { defaultPrevented } = this.showChanged.emit(false);\n return !defaultPrevented;\n }\n\n willPresent() {\n const { defaultPrevented } = this.showChanged.emit(true);\n return !defaultPrevented;\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot.querySelector('slot');\n }\n\n private disposeClickListener?: () => void;\n private disposeKeyListener?: () => void;\n\n private addEventListenersFor() {\n this.disposeClickListener?.();\n this.disposeKeyListener?.();\n\n const toggleController = () => {\n if (!this.isPresent()) {\n dropdownController.present(this);\n } else {\n dropdownController.dismiss(this);\n }\n\n dropdownController.dismissOthers(this.getId());\n };\n\n this.disposeClickListener = addDisposableEventListener(\n this.triggerElement,\n 'click',\n (event: PointerEvent) => {\n if (!event.defaultPrevented) {\n toggleController();\n }\n }\n );\n\n this.triggerElement?.setAttribute(\n 'data-ix-dropdown-trigger',\n this.localUId\n );\n }\n\n /* @internal /\n @Method()\n async discoverSubmenu() {\n this.triggerElement?.dispatchEvent(\n new CustomEvent('ix-assign-sub-menu', {\n bubbles: true,\n composed: false,\n cancelable: true,\n detail: this.localUId,\n })\n );\n }\n\n private registerKeyListener() {\n if (!this.triggerElement) {\n return;\n }\n\n this.disposeKeyListener = addDisposableEventListener(\n this.triggerElement,\n 'keydown',\n (event: KeyboardEvent) => {\n if (event.key !== 'ArrowDown') {\n return;\n }\n\n if (document.activeElement !== this.triggerElement) {\n return;\n }\n\n dropdownController.present(this);\n\n setTimeout(() => {\n this.focusDropdownItem(0);\n });\n }\n );\n }\n\n private async registerListener(\n element: string \| HTMLElement \| Promise<HTMLElement>\n ) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n this.addEventListenersFor();\n this.discoverSubmenu();\n }\n }\n\n private async resolveElement(\n element: string \| HTMLElement \| Promise<HTMLElement>\n ) {\n const el = await this.findElement(element);\n\n return this.checkForSubmenuAnchor(el);\n }\n\n private async checkForSubmenuAnchor(element: Element) {\n if (!element) {\n return null;\n }\n\n if (hasDropdownItemWrapperImplemented(element)) {\n const dropdownItem = await element.getDropdownItemElement();\n dropdownItem.isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n if (element.tagName === 'IX-DROPDOWN-ITEM') {\n (element as HTMLIxDropdownItemElement).isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n return element;\n }\n\n private findElement(\n element: string \| HTMLElement \| Promise<HTMLElement>\n ): Promise<Element> {\n if (element instanceof Promise) {\n return element;\n }\n\n if (typeof element === 'object') {\n return Promise.resolve(element);\n }\n\n if (typeof element != 'string') {\n return;\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n\n this.arrowFocusController = new ArrowFocusController(\n this.dropdownItems,\n this.dropdownRef,\n this.focusDropdownItemBind\n );\n\n this.itemObserver.observe(this.dropdownRef, {\n childList: true,\n subtree: true,\n });\n\n this.registerKeyListener();\n } else {\n this.arrowFocusController.disconnect();\n this.itemObserver.disconnect();\n this.disposeKeyListener?.();\n }\n }\n\n @Watch('trigger')\n changedTrigger(newTriggerValue: string \| HTMLElement \| Promise<HTMLElement>) {\n this.registerListener(newTriggerValue);\n }\n\n private isAnchorSubmenu(): boolean {\n if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n // Is no official dropdown-item, but check if any dropdown-item\n // is placed somewhere up the DOM\n return !!this.anchorElement?.closest('ix-dropdown-item');\n }\n\n return true;\n }\n\n private async applyDropdownPosition() {\n if (!this.show) {\n return;\n }\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n private focusDropdownItem(index: number) {\n requestAnimationFrame(() => {\n this.dropdownItems[index]?.shadowRoot.querySelector('button').focus();\n });\n }\n\n async componentDidLoad() {\n this.changedTrigger(this.trigger);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n }\n\n private isTriggerElement(element: HTMLElement) {\n const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n return trigger;\n }\n\n private onDropdownClick(event: PointerEvent) {\n if (dropdownController.pathIncludesTrigger(event.composedPath())) {\n event.preventDefault();\n\n if (this.isTriggerElement(event.target as HTMLElement)) {\n return;\n }\n }\n\n if (this.closeBehavior === 'inside' \|\| this.closeBehavior === 'both') {\n dropdownController.dismissAll([this.getId()]);\n }\n\n dropdownController.dismissOthers(this.getId());\n }\n\n /\n Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n data-ix-dropdown={this.localUId}\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div style={{ display: 'contents' }}>\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/form-field/form-field.css CHANGED Viewed

@@ -43,7 +43,7 @@ label.label-alignment-left {
   padding: 6px 0px;
 }
-input, input:-webkit-autofill {
+input {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -65,9 +65,18 @@ input, input:-webkit-autofill {
   box-shadow: var(--theme-input--box-shadow);
 }
 input:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+input:-webkit-autofill, input:autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 input::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -76,13 +85,13 @@ input::placeholder {
   color: var(--theme-input-hint--color);
 }
 input.hover, input:hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 input.focus, input:focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 input:-moz-read-only {
   box-shadow: none;
@@ -135,7 +144,7 @@ textarea {
   height: 3.25rem;
   padding: 0.375rem 1.25rem 0.375rem 0.5rem;
 }
-textarea, textarea:-webkit-autofill {
+textarea {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -157,9 +166,18 @@ textarea, textarea:-webkit-autofill {
   box-shadow: var(--theme-input--box-shadow);
 }
 textarea:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+textarea:-webkit-autofill, textarea:autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 textarea::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -168,13 +186,13 @@ textarea::placeholder {
   color: var(--theme-input-hint--color);
 }
 textarea.hover, textarea:hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 textarea.focus, textarea:focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 textarea:-moz-read-only {
   box-shadow: none;

package/dist/collection/components/time-picker/time-picker.css CHANGED Viewed

@@ -71,7 +71,7 @@ label.label-alignment-left {
   padding: 6px 0px;
 }
-input, input:-webkit-autofill {
+input {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -93,9 +93,18 @@ input, input:-webkit-autofill {
   box-shadow: var(--theme-input--box-shadow);
 }
 input:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+input:-webkit-autofill, input:autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 input::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -104,13 +113,13 @@ input::placeholder {
   color: var(--theme-input-hint--color);
 }
 input.hover, input:hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 input.focus, input:focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 input:-moz-read-only {
   box-shadow: none;
@@ -163,7 +172,7 @@ textarea {
   height: 3.25rem;
   padding: 0.375rem 1.25rem 0.375rem 0.5rem;
 }
-textarea, textarea:-webkit-autofill {
+textarea {
   font-feature-settings: "clig" off, "liga" off;
   font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
   font-style: normal;
@@ -185,9 +194,18 @@ textarea, textarea:-webkit-autofill {
   box-shadow: var(--theme-input--box-shadow);
 }
 textarea:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
-  -webkit-text-fill-color: var(--theme-input--color) !important;
-  border-color: var(--theme-input--border-color) !important;
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
+}
+textarea:-webkit-autofill, textarea:autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-color-component-info) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color--autofill) !important;
+  background-color: var(--theme-input--background--autofill) !important;
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;
+  color: var(--theme-input--color--autofill) !important;
 }
 textarea::-moz-placeholder {
   color: var(--theme-input-hint--color);
@@ -196,13 +214,13 @@ textarea::placeholder {
   color: var(--theme-input-hint--color);
 }
 textarea.hover, textarea:hover {
-  border-color: var(--theme-input--border-color--hover);
+  border-color: var(--theme-input--border-color--hover) !important;
   background-color: var(--theme-input--background--hover);
 }
 textarea.focus, textarea:focus {
   outline: 1px solid var(--theme-color-focus-bdr);
   outline-offset: var(--theme-input--focus--outline-offset);
-  border-color: var(--theme-input--border-color--focus);
+  border-color: var(--theme-input--border-color--focus) !important;
 }
 textarea:-moz-read-only {
   box-shadow: none;