@vonage/vivid 5.3.0 → 5.5.0

package/lib/date-range-picker/date-range-picker.d.ts

@@ -11,8 +11,8 @@ declare const DateRangePicker_base: (abstract new (...args: any[]) => {
     _currentDate: string;
     _currentMonth: import("../../shared/datetime/month").Month;
     _isDateInValidRange(date: string): boolean;
-    "__#21@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
-    "__#21@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
     _isMonthInValidRange(month: import("../../shared/datetime/month").Month): boolean;
     _closePopup: ((restoreFocusToTextField?: boolean) => void) & ((restoreFocusToTextField?: boolean) => void);
     _onPickerButtonClick: (() => void) & (() => void);
@@ -55,20 +55,20 @@ declare const DateRangePicker_base: (abstract new (...args: any[]) => {
     _pickerButtonEl: import("../components").VwcButtonElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;
     readonly _dialogLabel: string;
@@ -901,8 +901,8 @@ declare const DateRangePicker_base: (abstract new (...args: any[]) => {
     readonly _resolvedMinDate: string;
     readonly _resolvedMaxDate: string;
     _isDateInValidRange(date: string): boolean;
-    "__#21@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
-    "__#21@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
     _isMonthInValidRange(month: import("../../shared/datetime/month").Month): boolean;
     _closePopup(restoreFocusToTextField?: boolean): void;
     _onPickerButtonClick(): void;
@@ -945,20 +945,20 @@ declare const DateRangePicker_base: (abstract new (...args: any[]) => {
     _pickerButtonEl: import("../components").VwcButtonElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;
     readonly _dialogLabel: string;

package/lib/date-time-picker/date-time-picker.d.ts

@@ -11,12 +11,12 @@ declare const DateTimePicker_base: (abstract new (...args: any[]) => {
     readonly _displaySeconds: boolean;
     readonly _use12hClock: boolean;
     readonly _timePlaceholder: string;
-    "__#23@#clockChangeHandler": {
+    "__#24@#clockChangeHandler": {
         handleChange: () => void;
     };
-    "__#23@#clockChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#23@#startObservingClockChanges"(): void;
-    "__#23@#stopObservingClockChanges"(): void;
+    "__#24@#clockChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#24@#startObservingClockChanges"(): void;
+    "__#24@#stopObservingClockChanges"(): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     _onPickerButtonClick(): void;
@@ -38,20 +38,20 @@ declare const DateTimePicker_base: (abstract new (...args: any[]) => {
     _textFieldEl: import("../components").VwcTextFieldElement;
     _dialogEl: HTMLElement;
     _pickerButtonEl: import("../components").VwcButtonElement;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _closePopup(restoreFocusToTextField?: boolean): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;
@@ -887,8 +887,8 @@ declare const DateTimePicker_base: (abstract new (...args: any[]) => {
     readonly _resolvedMinDate: string;
     readonly _resolvedMaxDate: string;
     _isDateInValidRange(date: string): boolean;
-    "__#21@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
-    "__#21@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
     _isMonthInValidRange(month: import("../../shared/datetime/month").Month): boolean;
     _closePopup: ((restoreFocusToTextField?: boolean) => void) & ((restoreFocusToTextField?: boolean) => void);
     _onPickerButtonClick: (() => void) & (() => void);
@@ -927,20 +927,20 @@ declare const DateTimePicker_base: (abstract new (...args: any[]) => {
     _pickerButtonEl: import("../components").VwcButtonElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;
     readonly _dialogLabel: string;
@@ -1789,20 +1789,20 @@ declare const DateTimePicker_base: (abstract new (...args: any[]) => {
     _pickerButtonEl: import("../components").VwcButtonElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _closePopup(restoreFocusToTextField?: boolean): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;
@@ -2632,8 +2632,8 @@ declare const DateTimePicker_base: (abstract new (...args: any[]) => {
     readonly _resolvedMinDate: string;
     readonly _resolvedMaxDate: string;
     _isDateInValidRange(date: string): boolean;
-    "__#21@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
-    "__#21@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthAfterValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
+    "__#22@#isMonthBeforeValidRange"(month: import("../../shared/datetime/month").Month): boolean | "";
     _isMonthInValidRange(month: import("../../shared/datetime/month").Month): boolean;
     _closePopup(restoreFocusToTextField?: boolean): void;
     _onPickerButtonClick(): void;
@@ -2676,20 +2676,20 @@ declare const DateTimePicker_base: (abstract new (...args: any[]) => {
     _pickerButtonEl: import("../components").VwcButtonElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;
     readonly _dialogLabel: string;

package/lib/dial-pad/dial-pad.d.ts

@@ -391,6 +391,7 @@ export declare class DialPad extends DialPad_base {
     endCallButtonLabel: string | null;
     callButtonLabel: string | null;
     deleteAriaLabel: string | null;
+    private _clearLongPressTimer;
     autofocus: boolean;
     focus(): void;
 }

package/lib/divider/divider.d.ts

@@ -7,7 +7,7 @@ export declare const DividerRole: {
     readonly separator: "separator";
     readonly presentation: "presentation";
 };
-type DividerRole = typeof DividerRole[keyof typeof DividerRole];
+type DividerRole = (typeof DividerRole)[keyof typeof DividerRole];
 declare const Divider_base: {
     new (...args: any[]): {
         _vividAriaBehaviour: "host";

package/lib/icon/icon.d.ts

@@ -1,6 +1,7 @@
 import type { Connotation } from '../enums';
 import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 import type { ExtractFromEnum } from '../../shared/utils/enums';
+export declare const resolveIcon: (iconId: string | undefined, signal: AbortSignal) => Promise<string>;
 export type IconConnotation = ExtractFromEnum<Connotation, Connotation.Accent | Connotation.CTA | Connotation.Success | Connotation.Alert | Connotation.Warning | Connotation.Information | Connotation.Announcement>;
 export declare class Icon extends VividElement {
     #private;

package/lib/menu-item/menu-item-role.d.ts

@@ -4,4 +4,4 @@ export declare const MenuItemRole: {
     readonly menuitemradio: "menuitemradio";
     readonly presentation: "presentation";
 };
-export type MenuItemRole = typeof MenuItemRole[keyof typeof MenuItemRole];
+export type MenuItemRole = (typeof MenuItemRole)[keyof typeof MenuItemRole];

package/lib/popup/popup.d.ts

@@ -5,7 +5,7 @@ export declare const PlacementStrategy: {
     readonly AutoPlacementHorizontal: "auto-placement-horizontal";
     readonly AutoPlacementVertical: "auto-placement-vertical";
 };
-type PlacementStrategyId = typeof PlacementStrategy[keyof typeof PlacementStrategy];
+type PlacementStrategyId = (typeof PlacementStrategy)[keyof typeof PlacementStrategy];
 export declare class Popup extends VividElement {
     #private;
     popupEl: HTMLElement;

package/lib/searchable-select/locale.d.ts

@@ -3,6 +3,10 @@ export interface SearchableSelectLocale {
     noOptionsMessage: string;
     noMatchesMessage: string;
     loadingOptionsMessage: string;
+    selectAllLabel: string;
+    deselectAllLabel: string;
+    selectedAllMessage: string;
+    deselectedAllMessage: string;
     removeTagButtonLabel: (label: string) => string;
     optionSelectedMessage: (name: string) => string;
     optionDeselectedMessage: (name: string) => string;

package/lib/searchable-select/searchable-select.d.ts

@@ -3581,6 +3581,9 @@ export declare class SearchableSelect extends SearchableSelect_base {
     loading: boolean;
     clearable: boolean;
     maxSelected: number | null;
+    enableSelectAll: boolean;
+    selectAllText: string | undefined;
+    deselectAllText: string | undefined;
     setFormValue: (value: File | string | FormData | null, state?: File | string | FormData | null) => void;
     connectedCallback(): void;
     disconnectedCallback(): void;

package/lib/select/select.d.ts

@@ -1,4 +1,5 @@
 import type { Appearance, Shape, Size } from '../enums';
+import type { ListboxOption } from '../option/option';
 import { Listbox } from '../../shared/foundation/listbox/listbox';
 import type { ExtractFromEnum } from '../../shared/utils/enums';
 export type SelectAppearance = ExtractFromEnum<Appearance, Appearance.Fieldset | Appearance.Ghost>;
@@ -3198,7 +3199,8 @@ export declare class Select extends Select_base {
     fixedDropdown: boolean;
     placeholder: string | undefined;
     get displayValue(): string;
-    setDefaultSelectedOption(): void;
+    _newDefaultSelectedIndex(prev: ListboxOption[], next: ListboxOption[], currentSelectIndex: number): number | null;
+    _isDefaultSelected(option: ListboxOption): boolean;
     formResetCallback(): void;
 }
 export {};

package/lib/simple-color-picker/simple-color-picker.d.ts

@@ -392,6 +392,7 @@ declare const SimpleColorPicker_base: {
         swatches: import("../../shared/color-picker").ColorSwatch[];
         connectedCallback(): void;
         _canvasColor: string;
+        readonly _computedCanvasColor: string;
         _refreshCanvasColor(): void;
         _applyContrastClass(color: string, threshold?: number): boolean;
         _getRowLength(): number;
@@ -402,7 +403,7 @@ declare const SimpleColorPicker_base: {
         _getGridCells(): HTMLElement[];
         _handleCellKeydown(event: KeyboardEvent, value: string, index: number, isSaveCell?: boolean | undefined): boolean;
         _focusSwatchByIndex(index: number): void;
-        _renderColorSwatch(iconTag: import("@microsoft/fast-element").InlineTemplateDirective): import("@microsoft/fast-element").ViewTemplate<import("../../shared/color-picker").ColorSwatch, any>;
+        _renderColorSwatch(iconTag: import("@microsoft/fast-element").InlineTemplateDirective, tooltipTag: import("@microsoft/fast-element").InlineTemplateDirective): import("@microsoft/fast-element").ViewTemplate<import("../../shared/color-picker").ColorSwatch, any>;
         readonly locale: import("../../shared/localization/Locale").Locale;
         _vividAriaBehaviour: import("../../shared/aria/aria-mixin").VividAriaBehaviour;
         readonly $fastController: import("@microsoft/fast-element").ElementController<HTMLElement>;

package/lib/slider/slider.d.ts

@@ -5,7 +5,7 @@ export type SliderConnotation = Connotation.Accent | Connotation.CTA;
 export declare const SliderMode: {
     readonly singleValue: "single-value";
 };
-export type SliderMode = typeof SliderMode[keyof typeof SliderMode];
+export type SliderMode = (typeof SliderMode)[keyof typeof SliderMode];
 declare const Slider_base: {
     new (...args: any[]): {
         readonly locale: import("../../shared/localization/Locale").Locale;

package/lib/tabs/tabs.d.ts

@@ -7,12 +7,12 @@ export declare const TabsGutters: {
     readonly None: "none";
     readonly Small: "small";
 };
-export type TabsGutters = typeof TabsGutters[keyof typeof TabsGutters];
+export type TabsGutters = (typeof TabsGutters)[keyof typeof TabsGutters];
 export declare const TabsOrientation: {
     readonly vertical: "vertical";
     readonly horizontal: "horizontal";
 };
-export type TabsOrientation = typeof TabsOrientation[keyof typeof TabsOrientation];
+export type TabsOrientation = (typeof TabsOrientation)[keyof typeof TabsOrientation];
 export declare class Tabs extends VividElement {
     #private;
     orientation: TabsOrientation;

package/lib/text-area/text-area.d.ts

@@ -7,7 +7,7 @@ export declare const TextAreaResize: {
     readonly horizontal: "horizontal";
     readonly vertical: "vertical";
 };
-export type TextAreaResize = typeof TextAreaResize[keyof typeof TextAreaResize];
+export type TextAreaResize = (typeof TextAreaResize)[keyof typeof TextAreaResize];
 declare const TextArea_base: {
     new (...args: any[]): {
         _contextualHelpSlottedContent?: HTMLElement[] | undefined;

package/lib/text-field/text-field.d.ts

@@ -12,7 +12,7 @@ export declare const TextFieldType: {
     readonly text: "text";
     readonly url: "url";
 };
-export type TextFieldType = typeof TextFieldType[keyof typeof TextFieldType];
+export type TextFieldType = (typeof TextFieldType)[keyof typeof TextFieldType];
 declare const TextField_base: {
     new (...args: any[]): {
         _contextualHelpSlottedContent?: HTMLElement[] | undefined;

package/lib/time-picker/time-picker.d.ts

@@ -13,12 +13,12 @@ declare const TimePicker_base: (abstract new (...args: any[]) => {
     readonly _displaySeconds: boolean;
     readonly _use12hClock: boolean;
     readonly _timePlaceholder: string;
-    "__#23@#clockChangeHandler": {
+    "__#24@#clockChangeHandler": {
         handleChange: () => void;
     };
-    "__#23@#clockChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#23@#startObservingClockChanges"(): void;
-    "__#23@#stopObservingClockChanges"(): void;
+    "__#24@#clockChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#24@#startObservingClockChanges"(): void;
+    "__#24@#stopObservingClockChanges"(): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     _onPickerButtonClick(): void;
@@ -40,20 +40,20 @@ declare const TimePicker_base: (abstract new (...args: any[]) => {
     _textFieldEl: import("../components").VwcTextFieldElement;
     _dialogEl: HTMLElement;
     _pickerButtonEl: import("../components").VwcButtonElement;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _closePopup(restoreFocusToTextField?: boolean): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;
@@ -893,20 +893,20 @@ declare const TimePicker_base: (abstract new (...args: any[]) => {
     _pickerButtonEl: import("../components").VwcButtonElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    "__#20@#onFocusIn": () => void;
-    "__#20@#onFocusOut": () => void;
+    "__#21@#onFocusIn": () => void;
+    "__#21@#onFocusOut": () => void;
     proxy: HTMLInputElement;
     validate(): void;
     _getCustomValidationError(): string | null;
-    "__#20@#localeChangeHandler": {
+    "__#21@#localeChangeHandler": {
         handleChange: () => void;
     };
-    "__#20@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
-    "__#20@#startObservingLocaleChanges"(): void;
-    "__#20@#stopObservingLocaleChanges"(): void;
+    "__#21@#localeChangeObserver": import("@microsoft/fast-element").ExpressionNotifier<any, any, any>;
+    "__#21@#startObservingLocaleChanges"(): void;
+    "__#21@#stopObservingLocaleChanges"(): void;
     _popupOpen: boolean;
-    "__#20@#dismissOnClickOutside": (event: MouseEvent) => void;
-    "__#20@#openPopupIfPossible"(): void;
+    "__#21@#dismissOnClickOutside": (event: MouseEvent) => void;
+    "__#21@#openPopupIfPossible"(): void;
     _closePopup(restoreFocusToTextField?: boolean): void;
     _onBaseKeyDown(event: KeyboardEvent): boolean;
     _focusableElsWithinDialog(): NodeListOf<HTMLElement>;

package/locales/de-DE.cjs

@@ -379,6 +379,10 @@ const deDE = {
     clearButtonLabel: "Auswahl löschen",
     noOptionsMessage: "Keine Optionen",
     noMatchesMessage: "Keine Optionen gefunden",
+    selectAllLabel: "Alles auswählen",
+    deselectAllLabel: "Auswahl aufheben",
+    selectedAllMessage: "Alle Optionen ausgewählt",
+    deselectedAllMessage: "Alle Optionen abgewählt",
     loadingOptionsMessage: "Laden...",
     removeTagButtonLabel: (
       /* istanbul ignore next */
@@ -478,12 +482,25 @@ const deDE = {
   },
   colorPicker: {
     popupLabel: "Farbwähler",
-    swatchesLabel: "Gespeicherte Farben:",
-    pickerButtonLabel: "Farbwähler öffnen",
+    swatchesLabel: "Gespeicherte Farben",
+    pickerButtonLabel: "Farbwähler",
+    hexInputLabel: "HEX-Farbcode",
     saveButtonLabel: "Aktuelle Farbe speichern",
     closeButtonLabel: "Farbwähler schließen",
     copyButtonLabel: "Farbe in die Zwischenablage kopieren",
-    copyErrorText: "Kopieren fehlgeschlagen. Zugriff auf die Zwischenablage wurde blockiert. Versuchen Sie es erneut."
+    copyErrorText: "Kopieren fehlgeschlagen. Zugriff auf die Zwischenablage wurde blockiert. Versuchen Sie es erneut.",
+    copySuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Farbe ${value} in die Zwischenablage kopiert.`
+    ),
+    selectionSuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Farbe ${value} ausgewählt.`
+    ),
+    maxSwatchesMessage: (
+      /* istanbul ignore next */
+      (total, limit) => `${total} von ${limit} Farben gespeichert.`
+    )
   }
 };
 

package/locales/de-DE.js

@@ -377,6 +377,10 @@ const deDE = {
     clearButtonLabel: "Auswahl löschen",
     noOptionsMessage: "Keine Optionen",
     noMatchesMessage: "Keine Optionen gefunden",
+    selectAllLabel: "Alles auswählen",
+    deselectAllLabel: "Auswahl aufheben",
+    selectedAllMessage: "Alle Optionen ausgewählt",
+    deselectedAllMessage: "Alle Optionen abgewählt",
     loadingOptionsMessage: "Laden...",
     removeTagButtonLabel: (
       /* istanbul ignore next */
@@ -476,12 +480,25 @@ const deDE = {
   },
   colorPicker: {
     popupLabel: "Farbwähler",
-    swatchesLabel: "Gespeicherte Farben:",
-    pickerButtonLabel: "Farbwähler öffnen",
+    swatchesLabel: "Gespeicherte Farben",
+    pickerButtonLabel: "Farbwähler",
+    hexInputLabel: "HEX-Farbcode",
     saveButtonLabel: "Aktuelle Farbe speichern",
     closeButtonLabel: "Farbwähler schließen",
     copyButtonLabel: "Farbe in die Zwischenablage kopieren",
-    copyErrorText: "Kopieren fehlgeschlagen. Zugriff auf die Zwischenablage wurde blockiert. Versuchen Sie es erneut."
+    copyErrorText: "Kopieren fehlgeschlagen. Zugriff auf die Zwischenablage wurde blockiert. Versuchen Sie es erneut.",
+    copySuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Farbe ${value} in die Zwischenablage kopiert.`
+    ),
+    selectionSuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Farbe ${value} ausgewählt.`
+    ),
+    maxSwatchesMessage: (
+      /* istanbul ignore next */
+      (total, limit) => `${total} von ${limit} Farben gespeichert.`
+    )
   }
 };
 

package/locales/en-GB.cjs

@@ -211,6 +211,10 @@ const enGB = {
     clearButtonLabel: "Clear selection",
     noOptionsMessage: "No options",
     noMatchesMessage: "No options found",
+    selectAllLabel: "Select All",
+    deselectAllLabel: "Deselect All",
+    selectedAllMessage: "All options selected",
+    deselectedAllMessage: "All options deselected",
     loadingOptionsMessage: "Loading...",
     removeTagButtonLabel: (
       /* istanbul ignore next */
@@ -310,12 +314,25 @@ const enGB = {
   },
   colorPicker: {
     popupLabel: "Colour Picker",
-    swatchesLabel: "Saved colours:",
-    pickerButtonLabel: "Open Colour Picker",
+    swatchesLabel: "Saved colours",
+    pickerButtonLabel: "Colour Picker",
+    hexInputLabel: "HEX color code",
     saveButtonLabel: "Save current colour",
     closeButtonLabel: "Close Colour Picker",
-    copyButtonLabel: "Copy Colour to Clipboard",
-    copyErrorText: "Copy failed. Clipboard access was blocked. Try again."
+    copyButtonLabel: "Copy colour to clipboard",
+    copyErrorText: "Copy failed. Clipboard access was blocked. Try again.",
+    copySuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Colour ${value} copied to clipboard.`
+    ),
+    selectionSuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Colour ${value} selected.`
+    ),
+    maxSwatchesMessage: (
+      /* istanbul ignore next */
+      (total, limit) => `${total} of ${limit} colours saved.`
+    )
   }
 };
 

package/locales/en-GB.js

@@ -209,6 +209,10 @@ const enGB = {
     clearButtonLabel: "Clear selection",
     noOptionsMessage: "No options",
     noMatchesMessage: "No options found",
+    selectAllLabel: "Select All",
+    deselectAllLabel: "Deselect All",
+    selectedAllMessage: "All options selected",
+    deselectedAllMessage: "All options deselected",
     loadingOptionsMessage: "Loading...",
     removeTagButtonLabel: (
       /* istanbul ignore next */
@@ -308,12 +312,25 @@ const enGB = {
   },
   colorPicker: {
     popupLabel: "Colour Picker",
-    swatchesLabel: "Saved colours:",
-    pickerButtonLabel: "Open Colour Picker",
+    swatchesLabel: "Saved colours",
+    pickerButtonLabel: "Colour Picker",
+    hexInputLabel: "HEX color code",
     saveButtonLabel: "Save current colour",
     closeButtonLabel: "Close Colour Picker",
-    copyButtonLabel: "Copy Colour to Clipboard",
-    copyErrorText: "Copy failed. Clipboard access was blocked. Try again."
+    copyButtonLabel: "Copy colour to clipboard",
+    copyErrorText: "Copy failed. Clipboard access was blocked. Try again.",
+    copySuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Colour ${value} copied to clipboard.`
+    ),
+    selectionSuccessMessage: (
+      /* istanbul ignore next */
+      (value) => `Colour ${value} selected.`
+    ),
+    maxSwatchesMessage: (
+      /* istanbul ignore next */
+      (total, limit) => `${total} of ${limit} colours saved.`
+    )
   }
 };