@covalent/core 10.4.0-beta.3 → 11.0.0-beta.1

package/search/index.d.ts

@@ -1,5 +1,183 @@
+import * as i0 from '@angular/core';
+import { ChangeDetectorRef, OnInit, OnDestroy, ElementRef, EventEmitter, NgZone } from '@angular/core';
+import { Dir } from '@angular/cdk/bidi';
+import { MatInput } from '@angular/material/input';
+import { MatFormFieldAppearance } from '@angular/material/form-field';
+import { IControlValueAccessor } from '@covalent/core/common';
+import { ControlValueAccessor } from '@angular/forms';
+
+declare class TdSearchInputBase {
+    _changeDetectorRef: ChangeDetectorRef;
+    constructor(_changeDetectorRef: ChangeDetectorRef);
+}
+declare const _TdSearchInputMixinBase: (new (...args: any[]) => IControlValueAccessor) & typeof TdSearchInputBase;
+declare class TdSearchInputComponent extends _TdSearchInputMixinBase implements IControlValueAccessor, OnInit, OnDestroy {
+    private _dir;
+    _changeDetectorRef: ChangeDetectorRef;
+    private _ngZone;
+    _input?: MatInput;
+    _searchElement: ElementRef<HTMLInputElement>;
+    /**
+     * appearance?: MatFormFieldAppearance
+     * Appearance style for the underlying input component.
+     */
+    appearance: MatFormFieldAppearance;
+    /**
+     * showUnderline?: boolean
+     * Sets if the input underline should be visible. Defaults to 'false'.
+     */
+    showUnderline: boolean;
+    /**
+     * debounce?: number
+     * Debounce timeout between keypresses. Defaults to 400.
+     */
+    debounce: number;
+    /**
+     * placeholder?: string
+     * Placeholder for the underlying input component.
+     */
+    placeholder: string;
+    /**
+     * clearIcon?: string
+     * The icon used to clear the search input.
+     * Defaults to 'cancel' icon.
+     */
+    clearIcon: string;
+    value: unknown;
+    /**
+     * searchDebounce: function($event)
+     * Event emitted after the [debounce] timeout.
+     */
+    searchDebounce: EventEmitter<string>;
+    /**
+     * search: function($event)
+     * Event emitted after the key enter has been pressed.
+     */
+    search: EventEmitter<string>;
+    /**
+     * clear: function()
+     * Event emitted after the clear icon has been clicked.
+     */
+    clear: EventEmitter<void>;
+    /**
+     * blur: function()
+     * Event emitted after the blur event has been called in underlying input.
+     */
+    blurSearch: EventEmitter<void>;
+    get isRTL(): boolean;
+    private _destroy$;
+    constructor(_dir: Dir, _changeDetectorRef: ChangeDetectorRef, _ngZone: NgZone);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * Method to focus to underlying input.
+     */
+    focus(): void;
+    handleBlur(): void;
+    handleSearch(event: Event): void;
+    /**
+     * Method to clear the underlying input.
+     */
+    clearSearch(): void;
+    private _searchTermChanged;
+    private _stopPropagation;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdSearchInputComponent, [{ optional: true; }, null, null]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TdSearchInputComponent, "td-search-input", never, { "appearance": { "alias": "appearance"; "required": false; }; "showUnderline": { "alias": "showUnderline"; "required": false; }; "debounce": { "alias": "debounce"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "clearIcon": { "alias": "clearIcon"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "searchDebounce": "searchDebounce"; "search": "search"; "clear": "clear"; "blurSearch": "blurSearch"; }, never, never, true, never>;
+}
+
+declare class TdSearchBoxBase {
+    _changeDetectorRef: ChangeDetectorRef;
+    constructor(_changeDetectorRef: ChangeDetectorRef);
+}
+declare class TdSearchBoxComponent implements ControlValueAccessor {
+    private _changeDetectorRef;
+    private _searchVisible;
+    _searchInput?: TdSearchInputComponent;
+    get searchVisible(): boolean;
+    /**
+     * backIcon?: string
+     * The icon used to close the search toggle, only shown when [alwaysVisible] is false.
+     * Defaults to 'search' icon.
+     */
+    backIcon: string;
+    /**
+     * searchIcon?: string
+     * The icon used to open/focus the search toggle.
+     * Defaults to 'search' icon.
+     */
+    searchIcon: string;
+    /**
+     * clearIcon?: string
+     * The icon used to clear the search input.
+     * Defaults to 'cancel' icon.
+     */
+    clearIcon: string;
+    /**
+     * showUnderline?: boolean
+     * Sets if the input underline should be visible. Defaults to 'false'.
+     */
+    showUnderline: boolean;
+    /**
+     * debounce?: number
+     * Debounce timeout between keypresses. Defaults to 400.
+     */
+    debounce: number;
+    /**
+     * alwaysVisible?: boolean
+     * Sets if the input should always be visible. Defaults to 'false'.
+     */
+    alwaysVisible: boolean;
+    /**
+     * placeholder?: string
+     * Placeholder for the underlying input component.
+     */
+    placeholder: string;
+    value: unknown;
+    /**
+     * searchDebounce: function($event)
+     * Event emitted after the [debounce] timeout.
+     */
+    searchDebounce: EventEmitter<string>;
+    /**
+     * search: function($event)
+     * Event emitted after the key enter has been pressed.
+     */
+    search: EventEmitter<string>;
+    /**
+     * clear: function()
+     * Event emitted after the clear icon has been clicked.
+     */
+    clear: EventEmitter<void>;
+    /**
+     * blur: function()
+     * Event emitted after the blur event has been called in underlying input.
+     */
+    blurSearch: EventEmitter<void>;
+    constructor(_changeDetectorRef: ChangeDetectorRef);
+    writeValue(value: unknown): void;
+    registerOnChange(): void;
+    registerOnTouched(): void;
+    /**
+     * Method executed when the search icon is clicked.
+     */
+    searchClicked(): void;
+    toggleVisibility(): void;
+    handleSearchDebounce(value: string): void;
+    handleSearch(value: string): void;
+    handleClear(): void;
+    handleBlur(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdSearchBoxComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TdSearchBoxComponent, "td-search-box", never, { "backIcon": { "alias": "backIcon"; "required": false; }; "searchIcon": { "alias": "searchIcon"; "required": false; }; "clearIcon": { "alias": "clearIcon"; "required": false; }; "showUnderline": { "alias": "showUnderline"; "required": false; }; "debounce": { "alias": "debounce"; "required": false; }; "alwaysVisible": { "alias": "alwaysVisible"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "searchDebounce": "searchDebounce"; "search": "search"; "clear": "clear"; "blurSearch": "blurSearch"; }, never, never, true, never>;
+}
+
 /**
- * Generated bundle index. Do not edit.
+ * @deprecated This module is deprecated and will be removed in future versions.
+ * Please migrate to using standalone components as soon as possible.
  */
-/// <amd-module name="@covalent/core/search" />
-export * from './public_api';
+declare class CovalentSearchModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSearchModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CovalentSearchModule, never, [typeof TdSearchInputComponent, typeof TdSearchBoxComponent], [typeof TdSearchInputComponent, typeof TdSearchBoxComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CovalentSearchModule>;
+}
+
+export { CovalentSearchModule, TdSearchBoxBase, TdSearchBoxComponent, TdSearchInputBase, TdSearchInputComponent, _TdSearchInputMixinBase };

package/side-sheet/index.d.ts

@@ -1,5 +1,266 @@
+import * as i0 from '@angular/core';
+import { ElementRef, ChangeDetectorRef, EventEmitter, ComponentRef, EmbeddedViewRef, OnDestroy, Injector, Type, InjectionToken, TemplateRef, OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import * as _angular_material_dialog_d_hlN3f_Hk from '@angular/material/dialog.d-hlN3f-Hk';
+import { AnimationEvent } from '@angular/animations';
+import { ConfigurableFocusTrapFactory, FocusOrigin, FocusMonitor } from '@angular/cdk/a11y';
+import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, TemplatePortal, DomPortal, ComponentType } from '@angular/cdk/portal';
+import { MatDialogConfig, MatDialogRef, MatDialogContainer } from '@angular/material/dialog';
+import { OverlayRef, Overlay } from '@angular/cdk/overlay';
+
+declare enum SubPageMode {
+    pushed = "pushed",
+    shifted = "shifted",
+    none = "none"
+}
+declare class CovalentSideSheetConfig<D = any> extends MatDialogConfig<D> {
+    subPageMode?: string;
+}
+
 /**
- * Generated bundle index. Do not edit.
+ * Base class for the `CovalentSideSheetContainer`. The base class does not implement
+ * animations as these are left to implementers of the side-sheet container.
  */
-/// <amd-module name="@covalent/core/side-sheet" />
-export * from './public_api';
+declare abstract class _CovalentSideSheetContainerBase extends BasePortalOutlet {
+    protected _elementRef: ElementRef;
+    protected _focusTrapFactory: ConfigurableFocusTrapFactory;
+    protected _changeDetectorRef: ChangeDetectorRef;
+    /** The side-sheet configuration. */
+    _config: CovalentSideSheetConfig;
+    private _focusMonitor?;
+    protected _document: Document;
+    /** The portal outlet inside of this container into which the side-sheet content will be loaded. */
+    _portalOutlet: CdkPortalOutlet;
+    /** The class that traps and manages focus within the side-sheet. */
+    private _focusTrap;
+    /** Emits when an animation state changes. */
+    _animationStateChanged: EventEmitter<{
+        state: "opened" | "opening" | "closing" | "closed";
+        totalTime: number;
+    }>;
+    /** Element that was focused before the side-sheet was opened. Save this to restore upon close. */
+    private _elementFocusedBeforeSideSheetWasOpened;
+    /**
+     * Type of interaction that led to the side-sheet being closed. This is used to determine
+     * whether the focus style will be applied when returning focus to its original location
+     * after the side-sheet is closed.
+     */
+    _closeInteractionType: FocusOrigin | null;
+    /** ID of the element that should be considered as the side-sheet's label. */
+    _ariaLabelledBy: string | null;
+    /** ID for the container DOM element. */
+    _id: string;
+    constructor(_elementRef: ElementRef, _focusTrapFactory: ConfigurableFocusTrapFactory, _changeDetectorRef: ChangeDetectorRef, _document: any, 
+    /** The side-sheet configuration. */
+    _config: CovalentSideSheetConfig, _focusMonitor?: FocusMonitor | undefined);
+    /** Starts the side-sheet exit animation. */
+    abstract _startExitAnimation(): void;
+    /** Initializes the side-sheet container with the attached content. */
+    _initializeWithAttachedContent(): void;
+    /**
+     * Attach a ComponentPortal as content to this side-sheet container.
+     * @param portal Portal to be attached as the side-sheet content.
+     */
+    attachComponentPortal<T>(portal: ComponentPortal<T>): ComponentRef<T>;
+    /**
+     * Attach a TemplatePortal as content to this side-sheet container.
+     * @param portal Portal to be attached as the side-sheet content.
+     */
+    attachTemplatePortal<C>(portal: TemplatePortal<C>): EmbeddedViewRef<C>;
+    /**
+     * Attaches a DOM portal to the side-sheet container.
+     * @param portal Portal to be attached.
+     * @deprecated To be turned into a method.
+     */
+    attachDomPortal: (portal: DomPortal) => void;
+    /** Moves focus back into the side-sheet if it was moved out. */
+    _recaptureFocus(): void;
+    /**
+     * Moves the focus inside the focus trap. When autoFocus is not set to 'side-sheet', if focus
+     * cannot be moved then focus will go to the side-sheet container.
+     */
+    protected _trapFocus(): void;
+    /** Restores focus to the element that was focused before the side-sheet opened. */
+    protected _restoreFocus(): void;
+    /** Sets up the focus trap. */
+    private _setupFocusTrap;
+    /** Captures the element that was focused before the side-sheet was opened. */
+    private _capturePreviouslyFocusedElement;
+    /** Focuses the side-sheet container. */
+    private _focusSideSheetContainer;
+    /** Returns whether focus is inside the side-sheet. */
+    private _containsFocus;
+    static ɵfac: i0.ɵɵFactoryDeclaration<_CovalentSideSheetContainerBase, [null, null, null, { optional: true; }, null, null]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_CovalentSideSheetContainerBase, never, never, {}, {}, never, never, true, never>;
+}
+/**
+ * Internal component that wraps the generated side-sheet content.
+ * This animation below is the only reason for duplicating most of the Material dialog code
+ */
+declare class CovalentSideSheetContainerComponent extends _CovalentSideSheetContainerBase {
+    /** State of the side-sheet animation. */
+    _state: 'void' | 'enter' | 'exit';
+    tdSideSheetContainerClass: boolean;
+    tabIndex: number;
+    arialModal: boolean;
+    idAttr: string;
+    roleAttr: _angular_material_dialog_d_hlN3f_Hk.D | undefined;
+    arialLabelByAttr: string | null;
+    arialDescribeByAttr: string | null;
+    arialLabelAttr: string | null | undefined;
+    get sideSheetAnimationState(): "enter" | "void" | "exit";
+    onAnimateStart($event: AnimationEvent): void;
+    onAnimateDone($event: AnimationEvent): void;
+    /** Callback, invoked whenever an animation on the host completes. */
+    _onAnimationDone({ toState, totalTime }: AnimationEvent): void;
+    /** Callback, invoked when an animation on the host starts. */
+    _onAnimationStart({ toState, totalTime }: AnimationEvent): void;
+    /** Starts the side-sheet exit animation. */
+    _startExitAnimation(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheetContainerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CovalentSideSheetContainerComponent, "td-side-sheet-container", never, {}, {}, never, never, true, never>;
+}
+
+declare class CovalentSideSheetRef<T, R = any> extends MatDialogRef<T, R> {
+    overlayRef: OverlayRef;
+    config: CovalentSideSheetConfig;
+    _containerInstance: MatDialogContainer;
+    readonly id: string;
+    constructor(overlayRef: OverlayRef, config: CovalentSideSheetConfig, _containerInstance: MatDialogContainer, id?: string);
+}
+declare function _closeSideSheetVia<R>(ref: CovalentSideSheetRef<R>, interactionType: FocusOrigin, result?: R): void;
+
+declare class _CovalentSideSheetBase<C extends _CovalentSideSheetContainerBase> implements OnDestroy {
+    private _overlay;
+    private _injector;
+    private _defaultOptions;
+    private _parentSideSheet;
+    private _sideSheetRefConstructor;
+    private _sideSheetContainerType;
+    private _sideSheetDataToken;
+    private _openSideSheetsAtThisLevel;
+    private readonly _afterAllClosedAtThisLevel;
+    private readonly _afterOpenedAtThisLevel;
+    private _animationStateSubscriptions;
+    private defaultSidebarConfig;
+    constructor(_overlay: Overlay, _injector: Injector, _defaultOptions: CovalentSideSheetConfig | undefined, _parentSideSheet: _CovalentSideSheetBase<C> | undefined, _sideSheetRefConstructor: Type<CovalentSideSheetRef<any>>, _sideSheetContainerType: Type<C>, _sideSheetDataToken: InjectionToken<unknown>);
+    /** Keeps track of the currently-open side-sheets. */
+    get openSideSheets(): CovalentSideSheetRef<unknown>[];
+    open<T, D = unknown, R = unknown>(componentOrTemplateRef: ComponentType<T> | TemplateRef<T>, config?: CovalentSideSheetConfig<D>): CovalentSideSheetRef<T, R>;
+    ngOnDestroy(): void;
+    /**
+     * Closes all of the currently-open side-sheets.
+     */
+    closeAll(): void;
+    private _createOverlay;
+    /**
+     * Attaches a container to a side-sheets's already-created overlay.
+     * @param overlay Reference to the side-sheet's underlying overlay.
+     * @param config The side-sheet configuration.
+     * @returns A promise resolving to a ComponentRef for the attached container.
+     */
+    private _attachSideSheetContainer;
+    /**
+     * Attaches the user-provided component to the already-created side sheet container.
+     * @param componentOrTemplateRef The type of component being loaded into the side-sheet,
+     *     or a TemplateRef to instantiate as the content.
+     * @param dialogContainer Reference to the wrapping side-sheet container.
+     * @param overlayRef Reference to the overlay in which the side-sheet resides.
+     * @param config The side-sheet configuration.
+     * @returns A promise resolving to the CovalentSideSheetRef that should be returned to the user.
+     */
+    private _attachSideSheetContent;
+    private _createInjector;
+    /**
+     * Removes a side sheet from the array of open side sheets.
+     * @param sideSheetRef Side Sheet to be removed.
+     */
+    private _removeOpenSideSheet;
+    /** Closes all of the side-sheet in an array. */
+    private _closeSideSheets;
+    static ɵfac: i0.ɵɵFactoryDeclaration<_CovalentSideSheetBase<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_CovalentSideSheetBase<any>, never, never, {}, {}, never, never, true, never>;
+}
+/**
+ * Service to open Covalent Design side-sheet.
+ */
+declare class CovalentSideSheet extends _CovalentSideSheetBase<CovalentSideSheetContainerComponent> {
+    constructor(overlay: Overlay, injector: Injector, defaultOptions: CovalentSideSheetConfig, parentSideSheet: CovalentSideSheet);
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheet, [null, null, { optional: true; }, { optional: true; skipSelf: true; }]>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CovalentSideSheet>;
+}
+
+/**
+ * Button that will close the current dialog.
+ */
+declare class CovalentSideSheetCloseDirective implements OnInit, OnChanges {
+    dialogRef: CovalentSideSheetRef<any>;
+    private _elementRef;
+    private _dialog;
+    /** Screenreader label for the button. */
+    ariaLabel?: string;
+    /** Default to "button" to prevents accidental form submits. */
+    type: 'submit' | 'button' | 'reset';
+    /** Dialog close input. */
+    dialogResult: any;
+    _CovalentSideSheetClose: any;
+    onClick($event: MouseEvent): void;
+    constructor(dialogRef: CovalentSideSheetRef<any>, _elementRef: ElementRef<HTMLElement>, _dialog: CovalentSideSheet);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    _onButtonClick(event: MouseEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheetCloseDirective, [{ optional: true; }, null, null]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CovalentSideSheetCloseDirective, "[td-side-sheet-close], [CovalentSideSheetClose]", ["CovalentSideSheetClose"], { "ariaLabel": { "alias": "aria-label"; "required": false; }; "type": { "alias": "type"; "required": false; }; "dialogResult": { "alias": "td-side-sheet-close"; "required": false; }; "_CovalentSideSheetClose": { "alias": "CovalentSideSheetClose"; "required": false; }; }, {}, never, never, true, never>;
+}
+/**
+ * Title of a side sheet element. Stays fixed to the top of the side sheet when scrolling.
+ */
+declare class CovalentSideSheetTitleDirective implements OnInit {
+    private _dialogRef;
+    private _elementRef;
+    private _dialog;
+    /** Unique id for the dialog title. If none is supplied, it will be auto-generated. */
+    id: string;
+    tdSideSheetTitle: boolean;
+    idAttr: string;
+    constructor(_dialogRef: CovalentSideSheetRef<any>, _elementRef: ElementRef<HTMLElement>, _dialog: CovalentSideSheet);
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheetTitleDirective, [{ optional: true; }, null, null]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CovalentSideSheetTitleDirective, "[td-side-sheet-title], [CovalentSideSheetTitle]", ["CovalentSideSheetTitle"], { "id": { "alias": "id"; "required": false; }; }, {}, never, never, true, never>;
+}
+/**
+ * Scrollable content container of a dialog.
+ */
+declare class CovalentSideSheetContentDirective {
+    tdSideSheetContent: boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheetContentDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CovalentSideSheetContentDirective, "[td-side-sheet-content], td-side-sheet-content, [CovalentSideSheetContent]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Container for the bottom action buttons in a dialog.
+ * Stays fixed to the bottom when scrolling.
+ */
+declare class CovalentSideSheetActionsDirective {
+    tdSideSheetActions: boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheetActionsDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CovalentSideSheetActionsDirective, "[td-side-sheet-actions], td-side-sheet-actions, [CovalentSideSheetActions]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Container for the wrapper part of the dialog
+ */
+declare class CovalentSideSheetWrapperDirective {
+    tdSideSheetWrapper: boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheetWrapperDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CovalentSideSheetWrapperDirective, "[td-side-sheet-wrapper], td-side-sheet-wrapper, [CovalentSideSheetWrapper]", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * @deprecated This module is deprecated and will be removed in future versions.
+ * Please migrate to using standalone components as soon as possible.
+ */
+declare class CovalentSideSheetModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CovalentSideSheetModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CovalentSideSheetModule, never, [typeof CovalentSideSheetContainerComponent, typeof CovalentSideSheetActionsDirective, typeof CovalentSideSheetCloseDirective, typeof CovalentSideSheetContentDirective, typeof CovalentSideSheetTitleDirective, typeof CovalentSideSheetWrapperDirective], [typeof CovalentSideSheetActionsDirective, typeof CovalentSideSheetCloseDirective, typeof CovalentSideSheetContentDirective, typeof CovalentSideSheetTitleDirective, typeof CovalentSideSheetWrapperDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CovalentSideSheetModule>;
+}
+
+export { CovalentSideSheet, CovalentSideSheetActionsDirective, CovalentSideSheetCloseDirective, CovalentSideSheetConfig, CovalentSideSheetContentDirective, CovalentSideSheetModule, CovalentSideSheetRef, CovalentSideSheetTitleDirective, CovalentSideSheetWrapperDirective, SubPageMode, _CovalentSideSheetBase, _closeSideSheetVia };

package/theming/_all-theme.scss

@@ -26,9 +26,18 @@
 
   $foreground: map-get(map-get($theme, color), foreground);
   $inverse-on-surface: map-get($foreground, inverse-on-surface);
+  $outline-variant: map-get($foreground, dividers);
+
+  .mat-divider {
+    --mat-divider-color: #{$outline-variant};
+  }
+
+  .mat-drawer-side {
+    --mat-sidenav-container-divider-color: #{$outline-variant};
+  }
 
   .mdc-tooltip__surface {
     // Tooltip fix to override the correct fill color in MDC styles
-    --mdc-plain-tooltip-supporting-text-color: #{$inverse-on-surface};
+    --mat-tooltip-supporting-text-color: #{$inverse-on-surface};
   }
 }

package/theming/_teradata-theme.scss

@@ -244,8 +244,8 @@ $td-light-theme-background: (
 // todo: need to re-catalog used variables
 $td-light-theme-foreground: (
   base: $light-on-background,
-  divider: $light-divider,
-  dividers: $light-divider,
+  divider: $theme-light-colors-outline,
+  dividers: $theme-light-colors-outline-variant,
   disabled: $theme-light-colors-on-surface-38,
   disabled-button: $theme-light-colors-on-surface-38,
   disabled-text: $theme-light-colors-on-surface-38,
@@ -318,8 +318,8 @@ $td-dark-theme-background: (
 // todo: need to re-catalog used variables
 $td-dark-theme-foreground: (
   base: $dark-on-background,
-  divider: $dark-divider,
-  dividers: $dark-divider,
+  divider: $theme-dark-colors-outline,
+  dividers: $theme-dark-colors-outline-variant,
   disabled: $theme-dark-colors-on-surface-38,
   disabled-button: $theme-dark-colors-on-surface-38,
   disabled-text: $theme-dark-colors-on-surface-38,
@@ -331,9 +331,9 @@ $td-dark-theme-foreground: (
   icons: $dark-text-icon-on-background,
   inverse-on-surface: $theme-dark-colors-inverse-on-surface,
   text: $dark-on-surface,
-  slider-min: $dark-on-surface,
-  slider-off: $theme-dark-colors-on-surface-8,
-  slider-off-active: $theme-dark-colors-on-surface-16,
+  slider-min: red,
+  slider-off: red,
+  slider-off-active: red,
   accent: $theme-dark-colors-on-primary,
   emphasis: $theme-dark-colors-on-emphasis,
   caution: $theme-dark-colors-on-caution,