@ptsecurity/mosaic 14.0.0 → 14.1.1

package/checkbox/checkbox.d.ts

@@ -45,18 +45,9 @@ export declare const McCheckboxMixinBase: HasTabIndexCtor & CanColorCtor & CanDi
  * have the checkbox be accessible, you may supply an [aria-label] input.
  */
 export declare class McCheckbox extends McCheckboxMixinBase implements ControlValueAccessor, AfterViewInit, OnDestroy, CanColor, CanDisable, HasTabIndex {
-    private _changeDetectorRef;
-    private _focusMonitor;
-    private _clickAction;
-    /**
-     * Attached to the aria-label attribute of the host element. In most cases, arial-labelledby will
-     * take precedence so this may be omitted.
-     */
-    ariaLabel: string;
-    /**
-     * Users can specify the `aria-labelledby` attribute which will be forwarded to the input element
-     */
-    ariaLabelledby: string | null;
+    private changeDetectorRef;
+    private focusMonitor;
+    private clickAction;
     /** A unique id for the checkbox input. If none is supplied, it will be auto-generated. */
     id: string;
     /** Whether the label should appear after or before the checkbox. Defaults to 'after' */
@@ -102,7 +93,7 @@ export declare class McCheckbox extends McCheckboxMixinBase implements ControlVa
     private uniqueId;
     private currentAnimationClass;
     private currentCheckState;
-    constructor(elementRef: ElementRef, _changeDetectorRef: ChangeDetectorRef, _focusMonitor: FocusMonitor, _clickAction: McCheckboxClickAction);
+    constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef, focusMonitor: FocusMonitor, clickAction: McCheckboxClickAction);
     /**
      * Called when the checkbox is blurred. Needed to properly implement ControlValueAccessor.
      * @docs-private
@@ -136,5 +127,5 @@ export declare class McCheckbox extends McCheckboxMixinBase implements ControlVa
     /** Function is called whenever the focus changes for the input element. */
     private onInputFocusChange;
     static ɵfac: i0.ɵɵFactoryDeclaration<McCheckbox, [null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<McCheckbox, "mc-checkbox", ["mcCheckbox"], { "color": "color"; "tabIndex": "tabIndex"; "ariaLabel": "aria-label"; "ariaLabelledby": "aria-labelledby"; "id": "id"; "labelPosition": "labelPosition"; "name": "name"; "value": "value"; "required": "required"; "checked": "checked"; "disabled": "disabled"; "indeterminate": "indeterminate"; }, { "change": "change"; "indeterminateChange": "indeterminateChange"; }, never, ["*"], false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McCheckbox, "mc-checkbox", ["mcCheckbox"], { "color": "color"; "tabIndex": "tabIndex"; "id": "id"; "labelPosition": "labelPosition"; "name": "name"; "value": "value"; "required": "required"; "checked": "checked"; "disabled": "disabled"; "indeterminate": "indeterminate"; }, { "change": "change"; "indeterminateChange": "indeterminateChange"; }, never, ["*", "mc-hint"], false>;
 }

package/core/formatters/date/formatter.pipe.d.ts

@@ -0,0 +1,95 @@
+import { PipeTransform } from '@angular/core';
+import { DateTime } from 'luxon';
+import { DateFormatter, DateTimeOptions } from './formatter';
+import * as i0 from "@angular/core";
+export declare class AbsoluteDateFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any, currYear?: boolean): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AbsoluteDateFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<AbsoluteDateFormatterPipe, "absoluteLongDate", false>;
+}
+export declare class AbsoluteDateTimeFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any, options?: DateTimeOptions): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AbsoluteDateTimeFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<AbsoluteDateTimeFormatterPipe, "absoluteLongDateTime", false>;
+}
+export declare class AbsoluteDateShortFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any, currYear?: boolean): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AbsoluteDateShortFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<AbsoluteDateShortFormatterPipe, "absoluteShortDate", false>;
+}
+export declare class AbsoluteShortDateTimeFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any, options?: DateTimeOptions): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AbsoluteShortDateTimeFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<AbsoluteShortDateTimeFormatterPipe, "absoluteShortDateTime", false>;
+}
+export declare class RelativeDateFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RelativeDateFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RelativeDateFormatterPipe, "relativeLongDate", false>;
+}
+export declare class RelativeDateTimeFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any, options?: DateTimeOptions): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RelativeDateTimeFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RelativeDateTimeFormatterPipe, "relativeLongDateTime", false>;
+}
+export declare class RelativeShortDateFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RelativeShortDateFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RelativeShortDateFormatterPipe, "relativeShortDate", false>;
+}
+export declare class RelativeShortDateTimeFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform(value: any, options?: DateTimeOptions): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RelativeShortDateTimeFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RelativeShortDateTimeFormatterPipe, "relativeShortDateTime", false>;
+}
+export declare class RangeDateFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform([value1, value2]: any): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RangeDateFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RangeDateFormatterPipe, "rangeLongDate", false>;
+}
+export declare class RangeShortDateFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform([value1, value2]: any): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RangeShortDateFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RangeShortDateFormatterPipe, "rangeShortDate", false>;
+}
+export declare class RangeDateTimeFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform([value1, value2]: any, options?: DateTimeOptions): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RangeDateTimeFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RangeDateTimeFormatterPipe, "rangeLongDateTime", false>;
+}
+export declare class RangeMiddleDateTimeFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform([value1, value2]: any, options?: DateTimeOptions): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RangeMiddleDateTimeFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RangeMiddleDateTimeFormatterPipe, "rangeMiddleDateTime", false>;
+}
+export declare class RangeShortDateTimeFormatterPipe implements PipeTransform {
+    private formatter;
+    constructor(formatter: DateFormatter<DateTime>);
+    transform([value1, value2]: any, options?: DateTimeOptions): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RangeShortDateTimeFormatterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<RangeShortDateTimeFormatterPipe, "rangeShortDateTime", false>;
+}

package/core/formatters/index.d.ts

@@ -1,9 +1,11 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./number/formatter";
+import * as i2 from "./date/formatter.pipe";
 export declare class McFormattersModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<McFormattersModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<McFormattersModule, [typeof i1.McDecimalPipe], never, [typeof i1.McDecimalPipe]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<McFormattersModule, [typeof i1.McDecimalPipe, typeof i2.AbsoluteDateFormatterPipe, typeof i2.AbsoluteDateTimeFormatterPipe, typeof i2.AbsoluteDateShortFormatterPipe, typeof i2.AbsoluteShortDateTimeFormatterPipe, typeof i2.RelativeDateFormatterPipe, typeof i2.RelativeDateTimeFormatterPipe, typeof i2.RelativeShortDateFormatterPipe, typeof i2.RelativeShortDateTimeFormatterPipe, typeof i2.RangeDateFormatterPipe, typeof i2.RangeShortDateFormatterPipe, typeof i2.RangeDateTimeFormatterPipe, typeof i2.RangeShortDateTimeFormatterPipe, typeof i2.RangeMiddleDateTimeFormatterPipe], never, [typeof i1.McDecimalPipe, typeof i2.AbsoluteDateFormatterPipe, typeof i2.AbsoluteDateTimeFormatterPipe, typeof i2.AbsoluteDateShortFormatterPipe, typeof i2.AbsoluteShortDateTimeFormatterPipe, typeof i2.RelativeDateFormatterPipe, typeof i2.RelativeDateTimeFormatterPipe, typeof i2.RelativeShortDateFormatterPipe, typeof i2.RelativeShortDateTimeFormatterPipe, typeof i2.RangeDateFormatterPipe, typeof i2.RangeShortDateFormatterPipe, typeof i2.RangeDateTimeFormatterPipe, typeof i2.RangeShortDateTimeFormatterPipe, typeof i2.RangeMiddleDateTimeFormatterPipe]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<McFormattersModule>;
 }
 export * from './number/formatter';
 export * from './date/formatter';
+export * from './date/formatter.pipe';

package/core/pop-up/pop-up-trigger.d.ts

@@ -2,7 +2,7 @@ import { Directionality } from '@angular/cdk/bidi';
 import { ConnectedOverlayPositionChange, ConnectionPositionPair, Overlay, OverlayRef, ScrollDispatcher, OverlayConfig } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
 import { ElementRef, EventEmitter, NgZone, TemplateRef, Type, ViewContainerRef } from '@angular/core';
-import { Observable, Subject } from 'rxjs';
+import { Observable, Subject, Subscription } from 'rxjs';
 import { PopUpPlacements } from './constants';
 import * as i0 from "@angular/core";
 export declare abstract class McPopUpTrigger<T> {
@@ -34,6 +34,7 @@ export declare abstract class McPopUpTrigger<T> {
     protected portal: ComponentPortal<T>;
     protected instance: any | null;
     protected listeners: Map<string, EventListenerOrEventListenerObject>;
+    protected closingActionsSubscription: Subscription;
     protected readonly availablePositions: {
         [key: string]: ConnectionPositionPair;
     };
@@ -64,6 +65,7 @@ export declare abstract class McPopUpTrigger<T> {
     protected clearListeners(): void;
     private addEventListener;
     private removeEventListener;
+    private subscribeOnClosingActions;
     static ɵfac: i0.ɵɵFactoryDeclaration<McPopUpTrigger<any>, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<McPopUpTrigger<any>, never, never, {}, {}, never, never, false>;
 }

package/core/validation/validation.d.ts

@@ -1,18 +1,7 @@
-import { ChangeDetectorRef, InjectionToken } from '@angular/core';
-import { AbstractControl, NgControl, NgForm, Validator, ValidatorFn } from '@angular/forms';
+import { InjectionToken } from '@angular/core';
 export declare const validationTooltipShowDelay = 10;
 export declare const validationTooltipHideDelay = 3000;
 export interface McValidationOptions {
     useValidation: boolean;
 }
 export declare const MC_VALIDATION: InjectionToken<McValidationOptions>;
-export declare function setValidState(control: AbstractControl, validator: ValidatorFn): void;
-/** This function do next:
- * - run validation on submitting parent form
- * - prevent validation in required validator if form doesn't submitted
- * - if control has focus validation will be prevented
- */
-export declare function setMosaicValidation(component: any, cdr?: ChangeDetectorRef): void;
-export declare function setMosaicValidationForModelControl(component: any, validators: Validator[], parentForm: NgForm): void;
-export declare function setMosaicValidationForFormControl(component: any, parentForm: NgForm, ngControl: NgControl, cdr?: ChangeDetectorRef): void;
-export declare function setMosaicValidationForCustomFormControl(component: any, cdr?: ChangeDetectorRef): void;

package/datepicker/datepicker-input.directive.d.ts

@@ -1,7 +1,6 @@
-import { ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, Renderer2 } from '@angular/core';
-import { AbstractControl, ControlValueAccessor, FormGroupDirective, NgForm, ValidationErrors, Validator } from '@angular/forms';
+import { ElementRef, EventEmitter, OnDestroy, Renderer2 } from '@angular/core';
+import { AbstractControl, ControlValueAccessor, ValidationErrors, Validator } from '@angular/forms';
 import { DateAdapter, McDateFormats } from '@ptsecurity/cdk/datetime';
-import { McValidationOptions } from '@ptsecurity/mosaic/core';
 import { McFormFieldControl } from '@ptsecurity/mosaic/form-field';
 import { McWarningTooltipTrigger } from '@ptsecurity/mosaic/tooltip';
 import { Subject } from 'rxjs';
@@ -33,11 +32,7 @@ export declare class McDatepickerInputEvent<D> {
 /** Directive used to connect an input to a McDatepicker. */
 export declare class McDatepickerInput<D> implements McFormFieldControl<D>, ControlValueAccessor, Validator, OnDestroy {
     elementRef: ElementRef<HTMLInputElement>;
-    private changeDetectorRef;
     private readonly renderer;
-    private mcValidation;
-    parentForm: NgForm;
-    parentFormGroup: FormGroupDirective;
     readonly dateAdapter: DateAdapter<D>;
     private readonly dateFormats;
     readonly stateChanges: Subject<void>;
@@ -104,7 +99,7 @@ export declare class McDatepickerInput<D> implements McFormFieldControl<D>, Cont
     private secondDigit;
     private thirdDigit;
     private separatorPositions;
-    constructor(elementRef: ElementRef<HTMLInputElement>, changeDetectorRef: ChangeDetectorRef, renderer: Renderer2, mcValidation: McValidationOptions, parentForm: NgForm, parentFormGroup: FormGroupDirective, dateAdapter: DateAdapter<D>, dateFormats: McDateFormats);
+    constructor(elementRef: ElementRef<HTMLInputElement>, renderer: Renderer2, dateAdapter: DateAdapter<D>, dateFormats: McDateFormats);
     onContainerClick(): void;
     focus(): void;
     focusChanged(isFocused: boolean): void;
@@ -173,6 +168,6 @@ export declare class McDatepickerInput<D> implements McFormFieldControl<D>, Cont
     private getDigitPositions;
     private createDate;
     private correctCursorPosition;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McDatepickerInput<any>, [null, null, null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McDatepickerInput<any>, [null, null, { optional: true; }, { optional: true; }]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<McDatepickerInput<any>, "input[mcDatepicker]", ["mcDatepickerInput"], { "placeholder": "placeholder"; "required": "required"; "mcDatepicker": "mcDatepicker"; "mcDatepickerFilter": "mcDatepickerFilter"; "value": "value"; "min": "min"; "max": "max"; "disabled": "disabled"; "id": "id"; "mcValidationTooltip": "mcValidationTooltip"; }, { "incorrectInput": "incorrectInput"; "dateChange": "dateChange"; "dateInput": "dateInput"; }, never, never, false>;
 }

package/design-tokens/legacy-2017/tokens/components/badge.json5

@@ -4,42 +4,42 @@
             solid: {
                 primary: {
                     background: { value: '{light-color-scheme.primary.palette.value.500}' },
-                    color: { value: 'white' },
                     border: { value: '{light-color-scheme.primary.palette.value.500}' },
+                    color: { value: 'white' }
                 },
                 info: {
-                    border: { value: '{light-color-scheme.primary.palette.value.500}' },
                     background: { value: '{light-color-scheme.primary.palette.value.500}' },
+                    border: { value: '{light-color-scheme.primary.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 success: {
-                    border: { value: '{light-color-scheme.success.palette.value.500}' },
                     background: { value: '{light-color-scheme.success.palette.value.500}' },
+                    border: { value: '{light-color-scheme.success.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 warning: {
-                    border: { value: '{light-color-scheme.warning.palette.value.500}' },
                     background: { value: '{light-color-scheme.warning.palette.value.500}' },
+                    border: { value: '{light-color-scheme.warning.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 error: {
-                    border: { value: '{light-color-scheme.error.palette.value.500}' },
                     background: { value: '{light-color-scheme.error.palette.value.500}' },
+                    border: { value: '{light-color-scheme.error.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 transparent: {
+                    background: { value: 'transparent' },
                     border: { value: '{light-color-scheme.second.palette.value.200}' },
-                    color: { value: '{light-color-scheme.primary.palette.value.contrast.300}' },
-                    background: { value: 'transparent' }
+                    color: { value: '{light-color-scheme.primary.palette.value.contrast.300}' }
                 },
                 light: {
-                    border: { value: '{light-color-scheme.second.palette.value.100}' },
                     background: { value: '{light-color-scheme.second.palette.value.100}' },
+                    border: { value: '{light-color-scheme.second.palette.value.100}' },
                     color: { value: '{light-color-scheme.primary.palette.value.contrast.300}' }
                 },
                 second: {
-                    border: { value: '{light-color-scheme.second.palette.value.600}' },
                     background: { value: '{light-color-scheme.second.palette.value.600}' },
+                    border: { value: '{light-color-scheme.second.palette.value.600}' },
                     color: { value: 'white' }
                 }
             },
@@ -72,74 +72,74 @@
             }
         },
         'dark-color-scheme': {
-            pastel: {
-                primary: {
-                    background: { value: '{light-color-scheme.primary.palette.value.A100}' },
-                    color: { value: '{light-color-scheme.primary.palette.value.100}' },
-                    border: { value: '{light-color-scheme.primary.palette.value.700}' },
-                },
-                info: {
-                    background: { value: '{light-color-scheme.primary.palette.value.100}' },
-                    color: { value: '{light-color-scheme.primary.palette.value.100}' },
-                    border: { value: '{light-color-scheme.primary.palette.value.A100}' }
-                },
-                success: {
-                    border: { value: '{light-color-scheme.success.palette.value.700}' },
-                    background: { value: '{light-color-scheme.success.palette.value.A100}' },
-                    color: { value: '{light-color-scheme.success.palette.value.100}' }
-                },
-                warning: {
-                    border: { value: '{light-color-scheme.warning.palette.value.700}' },
-                    background: { value: '{light-color-scheme.warning.palette.value.A100}' },
-                    color: { value: '{light-color-scheme.warning.palette.value.100}' }
-                },
-                error: {
-                    border: { value: '{light-color-scheme.error.palette.value.700}' },
-                    background: { value: '{light-color-scheme.error.palette.value.A100}' },
-                    color: { value: '{light-color-scheme.error.palette.value.100}' }
-                }
-            },
             solid: {
                 primary: {
                     background: { value: '{light-color-scheme.primary.palette.value.700}' },
-                    color: { value: 'white' },
-                    border: { value: '{light-color-scheme.primary.palette.value.700}' },
+                    border: { value: '{light-color-scheme.primary.palette.value.500}' },
+                    color: { value: 'white' }
                 },
                 info: {
-                    border: { value: '{light-color-scheme.primary.palette.value.800}' },
-                    background: { value: '{light-color-scheme.primary.palette.value.800}' },
+                    background: { value: '{light-color-scheme.primary.palette.value.700}' },
+                    border: { value: '{light-color-scheme.primary.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 success: {
-                    border: { value: '{light-color-scheme.success.palette.value.700}' },
                     background: { value: '{light-color-scheme.success.palette.value.700}' },
+                    border: { value: '{light-color-scheme.success.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 warning: {
-                    border: { value: '{light-color-scheme.warning.palette.value.700}' },
                     background: { value: '{light-color-scheme.warning.palette.value.700}' },
+                    border: { value: '{light-color-scheme.warning.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 error: {
-                    border: { value: '{light-color-scheme.error.palette.value.700}' },
                     background: { value: '{light-color-scheme.error.palette.value.700}' },
+                    border: { value: '{light-color-scheme.error.palette.value.500}' },
                     color: { value: 'white' }
                 },
                 transparent: {
+                    background: { value: 'transparent' },
                     border: { value: '{light-color-scheme.second.palette.value.500}' },
                     color: { value: '{light-color-scheme.second.palette.value.40}' },
-                    background: { value: 'transparent' }
                 },
                 light: {
-                    border: { value: '{light-color-scheme.second.palette.value.400}' },
                     background: { value: '{light-color-scheme.second.palette.value.400}' },
+                    border: { value: '{light-color-scheme.second.palette.value.400}' },
                     color: { value: 'white' }
                 },
                 second: {
-                    border: { value: '{light-color-scheme.second.palette.value.700}' },
                     background: { value: '{light-color-scheme.second.palette.value.700}' },
+                    border: { value: '{light-color-scheme.second.palette.value.600}' },
                     color: { value: 'white' }
                 }
+            },
+            pastel: {
+                primary: {
+                    background: { value: '{light-color-scheme.primary.palette.value.A100}' },
+                    border: { value: '{light-color-scheme.primary.palette.value.700}' },
+                    color: { value: '{light-color-scheme.primary.palette.value.100}' }
+                },
+                info: {
+                    background: { value: '{light-color-scheme.primary.palette.value.A100}' },
+                    border: { value: '{light-color-scheme.primary.palette.value.700}' },
+                    color: { value: '{light-color-scheme.primary.palette.value.100}' }
+                },
+                success: {
+                    background: { value: '{light-color-scheme.success.palette.value.A100}' },
+                    border: { value: '{light-color-scheme.success.palette.value.700}' },
+                    color: { value: '{light-color-scheme.success.palette.value.100}' }
+                },
+                warning: {
+                    background: { value: '{light-color-scheme.warning.palette.value.A100}' },
+                    border: { value: '{light-color-scheme.warning.palette.value.700}' },
+                    color: { value: '{light-color-scheme.warning.palette.value.100}' }
+                },
+                error: {
+                    background: { value: '{light-color-scheme.error.palette.value.A100}' },
+                    border: { value: '{light-color-scheme.error.palette.value.700}' },
+                    color: { value: '{light-color-scheme.error.palette.value.100}' }
+                }
             }
         },
         size: {

package/design-tokens/legacy-2017/tokens/components/button-toggle.json5

@@ -3,7 +3,8 @@
         size: {
             border: {
                 size: { value: '{size.border-width}' },
-                radius: { value: '{size.border-radius}' }
+                radius: { value: '{size.border-radius}' },
+                'siblings-radius': { value: '0' }
             }
         }
     }

package/design-tokens/legacy-2017/tokens/components/checkbox.json5

@@ -4,6 +4,7 @@
             default: {
                 border: { value: '{light-color-scheme.foreground.border}' },
                 color: { value: 'white' },
+                background: { value: 'transparent' },
 
                 states: {
                     checked: {
@@ -25,6 +26,7 @@
             error: {
                 border: { value: '{light-color-scheme.error.palette.value.400}' },
                 color: { value: 'white' },
+                background: { value: 'transparent' },
 
                 states: {
                     checked: {
@@ -48,6 +50,7 @@
             default: {
                 border: { value: '{dark-color-scheme.foreground.border}' },
                 color: { value: 'white' },
+                background: { value: 'transparent' },
 
                 states: {
                     checked: {
@@ -69,6 +72,7 @@
             error: {
                 border: { value: '{dark-color-scheme.error.palette.value.400}' },
                 color: { value: 'white' },
+                background: { value: 'transparent' },
 
                 states: {
                     checked: {

package/design-tokens/legacy-2017/tokens/components/progress-spinner.json5

@@ -1,7 +1,16 @@
 {
     'progress-spinner': {
         size: {
-            size: { value: '{size.l}' }
+            default: {
+                size: { value: '{size.l}' },
+                'svg-circle-radius': { value: '42.5%' },
+                'svg-stroke-width': { value: '13%' }
+            },
+            large: {
+                size: { value: '{size.5xl}' },
+                'svg-circle-radius': { value: '47%' },
+                'svg-stroke-width': { value: '6%' }
+            }
         }
     }
 }

package/design-tokens/legacy-2017/tokens/components/timezone.json5

@@ -16,6 +16,7 @@
         },
         font: {
             text: { value: 'body' },
+            'offset-text': { value: 'body-tabular' },
             caption: { value: 'caption' }
         }
     }

package/design-tokens/legacy-2017/tokens.d.ts

@@ -7119,28 +7119,28 @@ export declare const AutocompleteSizePanelPadding = "4px 0";
 export declare const AutocompleteSizePanelMaxHeight = "256px";
 export declare const AutocompleteSizePanelBorderRadius = "4px";
 export declare const BadgeLightColorSchemeSolidPrimaryBackground = "#338FCC";
-export declare const BadgeLightColorSchemeSolidPrimaryColor = "white";
 export declare const BadgeLightColorSchemeSolidPrimaryBorder = "#338FCC";
-export declare const BadgeLightColorSchemeSolidInfoBorder = "#338FCC";
+export declare const BadgeLightColorSchemeSolidPrimaryColor = "white";
 export declare const BadgeLightColorSchemeSolidInfoBackground = "#338FCC";
+export declare const BadgeLightColorSchemeSolidInfoBorder = "#338FCC";
 export declare const BadgeLightColorSchemeSolidInfoColor = "white";
-export declare const BadgeLightColorSchemeSolidSuccessBorder = "#52A832";
 export declare const BadgeLightColorSchemeSolidSuccessBackground = "#52A832";
+export declare const BadgeLightColorSchemeSolidSuccessBorder = "#52A832";
 export declare const BadgeLightColorSchemeSolidSuccessColor = "white";
-export declare const BadgeLightColorSchemeSolidWarningBorder = "#D6930D";
 export declare const BadgeLightColorSchemeSolidWarningBackground = "#D6930D";
+export declare const BadgeLightColorSchemeSolidWarningBorder = "#D6930D";
 export declare const BadgeLightColorSchemeSolidWarningColor = "white";
-export declare const BadgeLightColorSchemeSolidErrorBorder = "#E04D36";
 export declare const BadgeLightColorSchemeSolidErrorBackground = "#E04D36";
+export declare const BadgeLightColorSchemeSolidErrorBorder = "#E04D36";
 export declare const BadgeLightColorSchemeSolidErrorColor = "white";
+export declare const BadgeLightColorSchemeSolidTransparentBackground = "transparent";
 export declare const BadgeLightColorSchemeSolidTransparentBorder = "#CCCCCC";
 export declare const BadgeLightColorSchemeSolidTransparentColor = "#4D4D4D";
-export declare const BadgeLightColorSchemeSolidTransparentBackground = "transparent";
-export declare const BadgeLightColorSchemeSolidLightBorder = "#E6E6E6";
 export declare const BadgeLightColorSchemeSolidLightBackground = "#E6E6E6";
+export declare const BadgeLightColorSchemeSolidLightBorder = "#E6E6E6";
 export declare const BadgeLightColorSchemeSolidLightColor = "#4D4D4D";
-export declare const BadgeLightColorSchemeSolidSecondBorder = "#666666";
 export declare const BadgeLightColorSchemeSolidSecondBackground = "#666666";
+export declare const BadgeLightColorSchemeSolidSecondBorder = "#666666";
 export declare const BadgeLightColorSchemeSolidSecondColor = "white";
 export declare const BadgeLightColorSchemePastelPrimaryBackground = "#F5FAFD";
 export declare const BadgeLightColorSchemePastelPrimaryBorder = "#AAD1EC";
@@ -7157,45 +7157,45 @@ export declare const BadgeLightColorSchemePastelWarningColor = "#BB800A";
 export declare const BadgeLightColorSchemePastelErrorBackground = "#FEF7F6";
 export declare const BadgeLightColorSchemePastelErrorBorder = "#F4B7AE";
 export declare const BadgeLightColorSchemePastelErrorColor = "#E04D36";
-export declare const BadgeDarkColorSchemePastelPrimaryBackground = "rgba(0, 153, 255, 0.15)";
-export declare const BadgeDarkColorSchemePastelPrimaryColor = "#D8EAF7";
-export declare const BadgeDarkColorSchemePastelPrimaryBorder = "#114E77";
-export declare const BadgeDarkColorSchemePastelInfoBackground = "#D8EAF7";
-export declare const BadgeDarkColorSchemePastelInfoColor = "#D8EAF7";
-export declare const BadgeDarkColorSchemePastelInfoBorder = "rgba(0, 153, 255, 0.15)";
-export declare const BadgeDarkColorSchemePastelSuccessBorder = "#276211";
-export declare const BadgeDarkColorSchemePastelSuccessBackground = "rgba(68, 255, 0, 0.15)";
-export declare const BadgeDarkColorSchemePastelSuccessColor = "#DCF1D4";
-export declare const BadgeDarkColorSchemePastelWarningBorder = "#7D5504";
-export declare const BadgeDarkColorSchemePastelWarningBackground = "rgba(255, 170, 0, 0.15)";
-export declare const BadgeDarkColorSchemePastelWarningColor = "#F8EBD1";
-export declare const BadgeDarkColorSchemePastelErrorBorder = "#832112";
-export declare const BadgeDarkColorSchemePastelErrorBackground = "rgba(224, 79, 56, 0.15)";
-export declare const BadgeDarkColorSchemePastelErrorColor = "#FADEDA";
 export declare const BadgeDarkColorSchemeSolidPrimaryBackground = "#114E77";
+export declare const BadgeDarkColorSchemeSolidPrimaryBorder = "#338FCC";
 export declare const BadgeDarkColorSchemeSolidPrimaryColor = "white";
-export declare const BadgeDarkColorSchemeSolidPrimaryBorder = "#114E77";
-export declare const BadgeDarkColorSchemeSolidInfoBorder = "#07314D";
-export declare const BadgeDarkColorSchemeSolidInfoBackground = "#07314D";
+export declare const BadgeDarkColorSchemeSolidInfoBackground = "#114E77";
+export declare const BadgeDarkColorSchemeSolidInfoBorder = "#338FCC";
 export declare const BadgeDarkColorSchemeSolidInfoColor = "white";
-export declare const BadgeDarkColorSchemeSolidSuccessBorder = "#276211";
 export declare const BadgeDarkColorSchemeSolidSuccessBackground = "#276211";
+export declare const BadgeDarkColorSchemeSolidSuccessBorder = "#52A832";
 export declare const BadgeDarkColorSchemeSolidSuccessColor = "white";
-export declare const BadgeDarkColorSchemeSolidWarningBorder = "#7D5504";
 export declare const BadgeDarkColorSchemeSolidWarningBackground = "#7D5504";
+export declare const BadgeDarkColorSchemeSolidWarningBorder = "#D6930D";
 export declare const BadgeDarkColorSchemeSolidWarningColor = "white";
-export declare const BadgeDarkColorSchemeSolidErrorBorder = "#832112";
 export declare const BadgeDarkColorSchemeSolidErrorBackground = "#832112";
+export declare const BadgeDarkColorSchemeSolidErrorBorder = "#E04D36";
 export declare const BadgeDarkColorSchemeSolidErrorColor = "white";
+export declare const BadgeDarkColorSchemeSolidTransparentBackground = "transparent";
 export declare const BadgeDarkColorSchemeSolidTransparentBorder = "#808080";
 export declare const BadgeDarkColorSchemeSolidTransparentColor = "#F5F5F5";
-export declare const BadgeDarkColorSchemeSolidTransparentBackground = "transparent";
-export declare const BadgeDarkColorSchemeSolidLightBorder = "#999999";
 export declare const BadgeDarkColorSchemeSolidLightBackground = "#999999";
+export declare const BadgeDarkColorSchemeSolidLightBorder = "#999999";
 export declare const BadgeDarkColorSchemeSolidLightColor = "white";
-export declare const BadgeDarkColorSchemeSolidSecondBorder = "#4D4D4D";
 export declare const BadgeDarkColorSchemeSolidSecondBackground = "#4D4D4D";
+export declare const BadgeDarkColorSchemeSolidSecondBorder = "#666666";
 export declare const BadgeDarkColorSchemeSolidSecondColor = "white";
+export declare const BadgeDarkColorSchemePastelPrimaryBackground = "rgba(0, 153, 255, 0.15)";
+export declare const BadgeDarkColorSchemePastelPrimaryBorder = "#114E77";
+export declare const BadgeDarkColorSchemePastelPrimaryColor = "#D8EAF7";
+export declare const BadgeDarkColorSchemePastelInfoBackground = "rgba(0, 153, 255, 0.15)";
+export declare const BadgeDarkColorSchemePastelInfoBorder = "#114E77";
+export declare const BadgeDarkColorSchemePastelInfoColor = "#D8EAF7";
+export declare const BadgeDarkColorSchemePastelSuccessBackground = "rgba(68, 255, 0, 0.15)";
+export declare const BadgeDarkColorSchemePastelSuccessBorder = "#276211";
+export declare const BadgeDarkColorSchemePastelSuccessColor = "#DCF1D4";
+export declare const BadgeDarkColorSchemePastelWarningBackground = "rgba(255, 170, 0, 0.15)";
+export declare const BadgeDarkColorSchemePastelWarningBorder = "#7D5504";
+export declare const BadgeDarkColorSchemePastelWarningColor = "#F8EBD1";
+export declare const BadgeDarkColorSchemePastelErrorBackground = "rgba(224, 79, 56, 0.15)";
+export declare const BadgeDarkColorSchemePastelErrorBorder = "#832112";
+export declare const BadgeDarkColorSchemePastelErrorColor = "#FADEDA";
 export declare const BadgeSizeDefaultHeight = "24px";
 export declare const BadgeSizeDefaultMinWidth = "10px";
 export declare const BadgeSizeDefaultPadding = "0 8px";
@@ -7214,6 +7214,7 @@ export declare const BadgeFontMiniCaps = "extra-small-text-caps";
 export declare const BadgeFontMiniMono = "extra-small-text-mono";
 export declare const ButtonToggleSizeBorderSize = "1px";
 export declare const ButtonToggleSizeBorderRadius = "4px";
+export declare const ButtonToggleSizeBorderSiblingsRadius = "0";
 export declare const ButtonLightColorSchemeActiveShadow = "inset 0 1px 2px 0 rgba(black, 0.2)";
 export declare const ButtonLightColorSchemePrimaryColor = "white";
 export declare const ButtonLightColorSchemePrimaryBorder = "#277BB3";
@@ -7300,6 +7301,7 @@ export declare const CardDarkColorSchemeInfoShadow = "#4D4D4D";
 export declare const CardSizeVerticalLine = "4px";
 export declare const CheckboxLightColorSchemeDefaultBorder = "#B3B3B3";
 export declare const CheckboxLightColorSchemeDefaultColor = "white";
+export declare const CheckboxLightColorSchemeDefaultBackground = "transparent";
 export declare const CheckboxLightColorSchemeDefaultStatesCheckedBorder = "#206EA2";
 export declare const CheckboxLightColorSchemeDefaultStatesCheckedBackground = "#338FCC";
 export declare const CheckboxLightColorSchemeDefaultStatesFocusedBorder = "#338FCC";
@@ -7310,6 +7312,7 @@ export declare const CheckboxLightColorSchemeDefaultStatesCheckedFocusedShadow =
 export declare const CheckboxLightColorSchemeDefaultStatesCheckedFocusedOutline = "1px solid white";
 export declare const CheckboxLightColorSchemeErrorBorder = "#E76E5C";
 export declare const CheckboxLightColorSchemeErrorColor = "white";
+export declare const CheckboxLightColorSchemeErrorBackground = "transparent";
 export declare const CheckboxLightColorSchemeErrorStatesCheckedBorder = "#B23522";
 export declare const CheckboxLightColorSchemeErrorStatesCheckedBackground = "#E04D36";
 export declare const CheckboxLightColorSchemeErrorStatesFocusedBorder = "#E76E5C";
@@ -7320,6 +7323,7 @@ export declare const CheckboxLightColorSchemeErrorStatesCheckedFocusedShadow = "
 export declare const CheckboxLightColorSchemeErrorStatesCheckedFocusedOutline = "1px solid white";
 export declare const CheckboxDarkColorSchemeDefaultBorder = "#808080";
 export declare const CheckboxDarkColorSchemeDefaultColor = "white";
+export declare const CheckboxDarkColorSchemeDefaultBackground = "transparent";
 export declare const CheckboxDarkColorSchemeDefaultStatesCheckedBorder = "#57A4D7";
 export declare const CheckboxDarkColorSchemeDefaultStatesCheckedBackground = "#206EA2";
 export declare const CheckboxDarkColorSchemeDefaultStatesFocusedBorder = "#57A4D7";
@@ -7330,6 +7334,7 @@ export declare const CheckboxDarkColorSchemeDefaultStatesCheckedFocusedShadow =
 export declare const CheckboxDarkColorSchemeDefaultStatesCheckedFocusedOutline = "1px solid #333333";
 export declare const CheckboxDarkColorSchemeErrorBorder = "#E76E5C";
 export declare const CheckboxDarkColorSchemeErrorColor = "white";
+export declare const CheckboxDarkColorSchemeErrorBackground = "transparent";
 export declare const CheckboxDarkColorSchemeErrorStatesCheckedBorder = "#E76E5C";
 export declare const CheckboxDarkColorSchemeErrorStatesCheckedBackground = "#B23522";
 export declare const CheckboxDarkColorSchemeErrorStatesFocusedBorder = "#E76E5C";
@@ -7651,7 +7656,12 @@ export declare const PopupDarkColorSchemeFooterBackground = "transparent";
 export declare const ProgressBarLightColorSchemeBackground = "#F0F0F0";
 export declare const ProgressBarDarkColorSchemeBackground = "#666666";
 export declare const ProgressBarSizeHeight = "4px";
-export declare const ProgressSpinnerSizeSize = "16px";
+export declare const ProgressSpinnerSizeDefaultSize = "16px";
+export declare const ProgressSpinnerSizeDefaultSvgCircleRadius = "42.5%";
+export declare const ProgressSpinnerSizeDefaultSvgStrokeWidth = "13%";
+export declare const ProgressSpinnerSizeLargeSize = "48px";
+export declare const ProgressSpinnerSizeLargeSvgCircleRadius = "47%";
+export declare const ProgressSpinnerSizeLargeSvgStrokeWidth = "6%";
 export declare const RadioLightColorSchemeOuterCircleBorder = "#808080";
 export declare const RadioLightColorSchemeInnerCircleBorder = "transparent";
 export declare const RadioLightColorSchemeCapColor = "white";
@@ -7817,6 +7827,7 @@ export declare const TimezoneOptionSizeColumnGap = "16px";
 export declare const TimezoneOptionSizeHeight = "auto";
 export declare const TimezoneOptionSizeMaxHeight = "4em";
 export declare const TimezoneOptionFontText = "body";
+export declare const TimezoneOptionFontOffsetText = "body-tabular";
 export declare const TimezoneOptionFontCaption = "caption";
 export declare const ToastLightColorSchemeBackground = "white";
 export declare const ToastLightColorSchemeBorder = "#B3B3B3";