@momentum-ui/web-components 2.16.3 → 2.16.4

package/dist/types/components/checkbox/Checkbox.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Copyright (c) Cisco Systems, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { LitElement, PropertyValues } from "lit-element";
+export declare namespace Checkbox {
+    const ELEMENT_base: typeof LitElement & import("../../mixins/FocusMixin").AnyConstructor<import("../../mixins/FocusMixin").FocusClass>;
+    export class ELEMENT extends ELEMENT_base {
+        autofocus: boolean;
+        private _checked;
+        get checked(): boolean;
+        set checked(value: boolean);
+        private _indeterminate;
+        get indeterminate(): boolean;
+        set indeterminate(value: boolean);
+        private _disabled;
+        get disabled(): boolean;
+        set disabled(value: boolean);
+        label: string;
+        tabIndex: number;
+        input: HTMLInputElement;
+        static get styles(): import("lit-element").CSSResult[];
+        private toggleCheckbox;
+        private isCheckboxActive;
+        handleClick(event: MouseEvent): void;
+        handleKeyDown(event: KeyboardEvent): void;
+        handleChange(event: Event): void;
+        protected firstUpdated(changedProperties: PropertyValues): void;
+        connectedCallback(): void;
+        disconnectedCallback(): void;
+        protected update(changedProperties: PropertyValues): void;
+        protected updated(changedProperties: PropertyValues): void;
+        render(): import("lit-element").TemplateResult;
+    }
+    export {};
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "md-checkbox": Checkbox.ELEMENT;
+    }
+}

package/dist/types/components/checkbox/CheckboxGroup.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) Cisco Systems, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { LitElement } from "lit-element";
+export declare namespace CheckboxGroup {
+    const ELEMENT_base: typeof LitElement & import("../../mixins/RovingTabIndexMixin").AnyConstructor<import("../../mixins/RovingTabIndexMixin").RovingTabIndexInterface & import("../../mixins/SlottedMixin").SlotableInterface & import("../../mixins/SlottedMixin").SlotableClass & import("../../mixins/RovingTabIndexMixin").RovingTabIndexClass>;
+    export class ELEMENT extends ELEMENT_base {
+        label: string;
+        alignment: "horizontal" | "vertical";
+        checkboxSlot?: HTMLSlotElement;
+        static get styles(): import("lit-element").CSSResult[];
+        connectedCallback(): void;
+        disconnectedCallback(): void;
+        private switchCheckboxOnArrowPress;
+        handleKeyDown(event: KeyboardEvent): void;
+        get slotElement(): HTMLSlotElement | undefined;
+        render(): import("lit-element").TemplateResult;
+    }
+    export {};
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "md-checkboxgroup": CheckboxGroup.ELEMENT;
+    }
+}

package/dist/types/components/chip/Chip.d.ts

@@ -0,0 +1,67 @@
+/**
+ * Copyright (c) Cisco Systems, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import "@/components/icon/Icon";
+import { Icon } from "@/components/icon/Icon";
+import { PlacementType } from "@/components/popover/Popover.types";
+import "@/components/progress-bar/ProgressBar";
+import "@/components/tooltip/Tooltip";
+import { LitElement, PropertyValues } from "lit-element";
+export declare namespace Chip {
+    type Role = "group" | "option" | "button";
+    type Placement = PlacementType;
+    class ELEMENT extends LitElement {
+        color: string;
+        bgColor: string;
+        textColor: string;
+        height: string;
+        icon: string;
+        iconColor: string;
+        iconSize: string | undefined;
+        role: Chip.Role;
+        id: string;
+        small: boolean;
+        readonly: boolean;
+        selected: boolean;
+        disabled: boolean;
+        determinateProgress: number;
+        indeterminateProgress: boolean;
+        tooltipText: string;
+        tooltipPlacement: Chip.Placement;
+        iconSet: Icon.IconSet | undefined;
+        value: string;
+        private textOverflow;
+        private renderedText;
+        connectedCallback(): void;
+        updated(changedProperties: PropertyValues): void;
+        MAX_LENGTH: number;
+        PRE_TRUNC_CHARS: number;
+        POST_TRUNC_CHARS: number;
+        DOT_COUNT: number;
+        truncStringPortion(str: string, firstCharCount?: number, endCharCount?: number, dotCount?: number): void;
+        protected selectionChange: (newState: boolean) => void;
+        handleClear: (chipId: string) => void;
+        handleSelect: () => void;
+        handleDeSelect: () => void;
+        handleClick(): void;
+        protected handleKeydown(event: KeyboardEvent): void;
+        protected renderBgColor: () => {};
+        protected renderTextColor: () => {};
+        protected renderHeight: () => {};
+        protected getStyles: () => {};
+        static get styles(): import("lit-element").CSSResult[];
+        protected loadingTemplate(): {};
+        protected iconTemplate(): {};
+        getToolTipContent(): string;
+        render(): import("lit-element").TemplateResult;
+    }
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "md-chip": Chip.ELEMENT;
+    }
+}

package/dist/types/components/coachmark/Coachmark.d.ts

@@ -0,0 +1,46 @@
+/**
+ * Copyright (c) Cisco Systems, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import "@/components/button/Button";
+import { LitElement, PropertyValues } from "lit-element";
+export declare const coachmarkPlacement: string[];
+export declare namespace Coachmark {
+    export type Place = (typeof coachmarkPlacement)[number];
+    const ELEMENT_base: typeof LitElement & import("../../mixins/FocusTrapMixin").AnyConstructor<import("../../mixins/FocusTrapMixin").FocusTrapClass & import("../../mixins/FocusTrapMixin").FocusTrapInterface & import("../../mixins/FocusMixin").FocusClass>;
+    export class ELEMENT extends ELEMENT_base {
+        message: string;
+        actionname: string;
+        hidebutton: boolean;
+        placement: Place;
+        show: boolean;
+        color: string;
+        popper: HTMLDivElement;
+        reference: HTMLDivElement;
+        private slotContent;
+        connectedCallback(): void;
+        notifyCoachCreate(): void;
+        coachAction(): void;
+        handleSlotChange(event: Event): void;
+        protected update(changedProperties: PropertyValues): void;
+        get coachWrapClassMap(): {
+            "md-coachmark--active": boolean;
+        };
+        get coachClassMap(): {
+            [x: string]: boolean;
+        };
+        static get styles(): import("lit-element").CSSResult[];
+        coachmarkContentTemplate(): import("lit-element").TemplateResult;
+        wrappedCoachmarkContentTemplate(): import("lit-element").TemplateResult;
+        render(): import("lit-element").TemplateResult;
+    }
+    export {};
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "md-coachmark": Coachmark.ELEMENT;
+    }
+}

package/dist/types/components/coachmark-popover/CoachmarkPopover.d.ts

@@ -0,0 +1,211 @@
+/**
+ * Copyright (c) Cisco Systems, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import "@/components/button/Button";
+import "@/components/icon/Icon";
+import "@/components/popover/Popover";
+import { PlacementType } from "@/components/popover/Popover.types";
+import { LitElement, PropertyValues } from "lit-element";
+export declare namespace CoachmarkPopover {
+    /**
+     * @fires coach-create - Fired when the coachmark is created.
+     * @fires primary-button-action - Fired when the primary button is clicked.
+     * @fires secondary-button-action - Fired when the secondary button is clicked.
+     * @fires link-action - Fired when the link is clicked.
+     * @fires coachmark-close - Fired when the coachmark is closed.
+     */
+    class ELEMENT extends LitElement {
+        /**
+         * The placement of the coachmark popover.
+         * This property determines where the popover will be positioned relative to the reference element.
+         * Possible values include "auto", "top", "right", "bottom", "left", etc.
+         *
+         * @type {PlacementType}
+         */
+        placement: PlacementType;
+        /**
+         * The name of the icon to be displayed before the title in the header.
+         * If set, the specified icon will be rendered before the title.
+         * If not set, no icon will be rendered.
+         *
+         * @type {string | undefined}
+         */
+        headerIconName?: string;
+        /**
+         * The title to be displayed in the header
+         * If both neither header nor headerIconName is set, no header will be rendered.
+         *
+         * * @type {string | undefined}
+         */
+        header?: string;
+        /**
+         * The message to be displayed in the body of the coachmark.
+         * This property is used to set the content of the coachmark.
+         * If this is not defined the coachmark content slot will be used for the body
+         *
+         * @type {string | undefined}
+         */
+        message?: string;
+        /**
+         * Indicates whether the coachmark is visible.
+         * If true, the coachmark will be shown. If false, it will be hidden.
+         *
+         * @type {boolean}
+         */
+        show: boolean;
+        /**
+         * Indicates whether the close button should be hidden.
+         * If true, the close button will not be rendered. If false, it will be rendered.
+         *
+         * @type {boolean}
+         */
+        hideCloseButton: boolean;
+        /**
+         * The label for the primary button.
+         * If set, the primary button will be rendered with the specified label.
+         * If not set, no primary button will be rendered.
+         *
+         * @type {string | undefined}
+         */
+        primaryButton?: string;
+        /**
+         * The label for the secondary button.
+         * If set, the secondary button will be rendered with the specified label.
+         * If not set, no secondary button will be rendered.
+         *
+         * @type {string | undefined}
+         */
+        secondaryButton?: string;
+        /**
+         * The text for the link.
+         * If set, the link will be rendered with the specified text.
+         * If not set, no link will be rendered.
+         *
+         * @type {string | undefined}
+         */
+        linkText?: string;
+        /**
+         * The URL for the link.
+         * This property is used to set the href attribute of the link.
+         *
+         * @type {string}
+         */
+        href: string;
+        triggerComponent: HTMLSlotElement;
+        popper: HTMLDivElement;
+        /**
+         * The content of the slot.
+         * This property is used to store the assigned elements of the slot.
+         * This is used for the body if message is not set
+         *
+         * @type {Element[] | null}
+         */
+        private slotContent;
+        /**
+         * Returns the styles for the component.
+         * This method is used to define the CSS styles for the component.
+         *
+         * @returns {CSSResult[]} The styles for the component.
+         */
+        static get styles(): import("lit-element").CSSResult[];
+        connectedCallback(): void;
+        /**
+         * Dispatches a custom event with the specified event name.
+         * The event includes the placement, reference, and popper elements in its detail.
+         * The event bubbles up through the DOM and is composed, meaning it can cross shadow DOM boundaries.
+         *
+         * @param {string} eventName - The name of the custom event to dispatch.
+         */
+        private notifyCustomEvent;
+        /**
+         * Dispatches a custom event to notify that the coachmark has been created.
+         * The event is named "coach-create" and includes the placement, reference, and popper elements in its detail.
+         * The event bubbles up through the DOM and is composed, meaning it can cross shadow DOM boundaries.
+         */
+        notifyCoachCreate(): void;
+        /**
+         * Dispatches a custom event to notify that the primary button has been clicked.
+         * The event is named "primary-button-action" and includes the placement, reference, and popper elements in its detail.
+         * The event bubbles up through the DOM and is composed, meaning it can cross shadow DOM boundaries.
+         */
+        notifyPrimaryButtonAction(): void;
+        /**
+         * Dispatches a custom event to notify that the secondary button has been clicked.
+         * The event is named "secondary-button-action" and includes the placement, reference, and popper elements in its detail.
+         * The event bubbles up through the DOM and is composed, meaning it can cross shadow DOM boundaries.
+         */
+        notifySecondaryButtonAction(): void;
+        /**
+         * Dispatches a custom event to notify that the link has been clicked.
+         * The event is named "link-action" and includes the placement, reference, and popper elements in its detail.
+         * The event bubbles up through the DOM and is composed, meaning it can cross shadow DOM boundaries.
+         */
+        notifyLinkAction(): void;
+        /**
+         * Dispatches a custom event to notify that the coachmark has been closed.
+         * The event is named "coachmark-close" and includes the placement, reference, and popper elements in its detail.
+         * The event bubbles up through the DOM and is composed, meaning it can cross shadow DOM boundaries.
+         */
+        notifyCoachClose(): void;
+        /**
+         * Handles the slot change event.
+         * This method is triggered when the content of a slot changes.
+         * It updates the `slotContent` property with the assigned elements of the slot.
+         *
+         * @param {Event} event - The slot change event.
+         */
+        private handleSlotChange;
+        /**
+         * Called when the element's properties are updated.
+         * This method is triggered whenever one or more properties change.
+         * if the `show` property hss changed it calls `notifyCoachCreate` if `show` property is true, otherwise it calls `notifyCoachClose`.
+         *
+         * @param {PropertyValues} changedProperties - The properties that changed.
+         */
+        protected updated(changedProperties: PropertyValues): void;
+        /**
+         * Returns the template for the coachmark content.
+         * This method is used to define the HTML structure for the coachmark content.
+         *
+         * @returns {TemplateResult} The template for the coachmark content.
+         */
+        private coachmarkContentTemplate;
+        /**
+         * Returns the template for the header.
+         * This method is used to define the HTML structure for the header.
+         *
+         * @returns {TemplateResult} The template for the header.
+         */
+        private renderHeader;
+        /**
+         * Returns the template for the body.
+         * This method is used to define the HTML structure for the body.
+         *
+         * @returns {TemplateResult} The template for the body.
+         */
+        private renderBody;
+        /**
+         * Returns the template for the footer.
+         * This method is used to define the HTML structure for the footer.
+         *
+         * @returns {TemplateResult} The template for the footer.
+         */
+        private renderFooter;
+        /**
+         * Renders the HTML template for the component.
+         * This method defines the structure and content of the component's shadow DOM.
+         *
+         * @returns {TemplateResult} The HTML template for the component.
+         */
+        render(): import("lit-element").TemplateResult;
+    }
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "md-coachmark-popover": CoachmarkPopover.ELEMENT;
+    }
+}

package/dist/types/components/code-editor/CodeEditor.d.ts

@@ -0,0 +1,40 @@
+import "@/components/badge/Badge";
+import "@/components/button/Button";
+import { LitElement, PropertyValues } from "lit-element";
+export type Method = "get" | "post";
+export declare namespace CodeEditor {
+    class ELEMENT extends LitElement {
+        copyLocalization: string;
+        copiedLocalization: string;
+        method: Method;
+        acceptLanguage: string;
+        url: string;
+        input: HTMLInputElement;
+        codeBlock: HTMLPreElement;
+        codeUrl: HTMLSpanElement;
+        private disableCopyButton;
+        private acceptTypes;
+        private copied;
+        slotNodes: Node[];
+        slotUrl: Node[];
+        static get styles(): import("lit-element").CSSResult[];
+        handleSlotChange(): void;
+        handleUrlSlotChange(): void;
+        private highlightBlock;
+        private copyUrl;
+        copyClipboard(): void;
+        private copyText;
+        private select;
+        private selectTarget;
+        private importLanguage;
+        private getAllAcceptTypes;
+        private setAcceptTypes;
+        protected updated(changedProperties: PropertyValues): void;
+        render(): import("lit-element").TemplateResult;
+    }
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "md-code-editor": CodeEditor.ELEMENT;
+    }
+}

package/dist/types/components/combobox/ComboBox.d.ts

@@ -0,0 +1,227 @@
+/**
+ * Copyright (c) Cisco Systems, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import "@/components/help-text/HelpText";
+import "@/components/icon/Icon";
+import { LitElement, PropertyValues } from "lit-element";
+import { TemplateResult } from "lit-html";
+export declare namespace ComboBox {
+    type OptionMember = {
+        [key: string]: string;
+    };
+    export type MessageType = "error" | "success" | "warning";
+    export type Message = {
+        type: MessageType;
+        message: string;
+        id?: string;
+        ariaLive?: "off" | "assertive" | "polite";
+    };
+    export class MessageController {
+        determineMessageType(array: ComboBox.Message[]): MessageType;
+        filterMessagesByType(array: ComboBox.Message[], value: string): string[];
+    }
+    const ELEMENT_base: typeof LitElement & import("../../mixins/FocusMixin").AnyConstructor<import("../../mixins/FocusMixin").FocusClass>;
+    export class ELEMENT extends ELEMENT_base {
+        private _focusedIndex;
+        private _focusedGroupIndex;
+        label: string;
+        options: (string | OptionMember)[];
+        customOptions: never[];
+        placeholder: string;
+        isMulti: boolean;
+        useVirtualScroll: boolean;
+        disabled: boolean;
+        ordered: boolean;
+        expanded: boolean;
+        groupExpandedList: any;
+        searchItem: boolean;
+        compact: boolean;
+        noClearIcon: boolean;
+        selectWhenInFocus: boolean;
+        selectedOptions: (string | OptionMember)[];
+        visibleOptions: number;
+        optionId: string;
+        optionValue: string;
+        isCustomContent: boolean;
+        searchable: boolean;
+        shape: string;
+        value: (string | OptionMember)[];
+        inputValue: string;
+        allowCustomValue: boolean;
+        autofocus: boolean;
+        resultsTextLocalization: string;
+        optionsTextLocalization: string;
+        trimSpace: boolean;
+        invalid: boolean;
+        invalidText: string;
+        ariaLabel: string;
+        searchResultAriaLabel: string;
+        private ariaLabelForComboBox;
+        clearAriaLabel: string;
+        arrowAriaLabel: string;
+        clearIconHeight: string;
+        allTextLocalization: string;
+        selectAllTextLocalization: string;
+        selectedTextLocalization: string;
+        allowSelectAll: boolean;
+        showCustomError: boolean;
+        showLoader: boolean;
+        showSelectedCount: boolean;
+        popupChevronAriaHidden: string;
+        newMomentum: boolean;
+        showFilterIcon: boolean;
+        preventFilter: boolean;
+        /**
+         * When using the new momentum style sets whether to use the new combobox style arrow
+         * or the arrow not in a div what a border to the right. This will be used for filter dropdowns
+         * that were implemented using a combobox
+         */
+        isDropdownArrow: boolean;
+        comboboxId: string;
+        helpText: string;
+        messageArr: ComboBox.Message[];
+        htmlId: string;
+        readOnly: boolean;
+        private readonly messageController;
+        private isOptGroup;
+        private isSelectAllChecked;
+        get focusedIndex(): number;
+        set focusedIndex(index: number);
+        updateFocusedIndex(index: number): void;
+        get focusedGroupIndex(): number;
+        set focusedGroupIndex(index: number);
+        get messageType(): ComboBox.MessageType | null;
+        get messages(): string[] | null;
+        private multiSelectedIndex;
+        private multiSelected;
+        private customContent;
+        private notifySearchResultCount;
+        group?: HTMLDivElement;
+        input?: HTMLInputElement;
+        button?: HTMLButtonElement;
+        listBox?: HTMLDivElement;
+        virtualizer?: any;
+        lists?: HTMLDivElement[];
+        labels?: HTMLDivElement[];
+        selected?: HTMLDivElement[];
+        protected firstUpdated(changedProperties: PropertyValues): void;
+        protected updated(changedProperties: PropertyValues): void;
+        protected handleFocusIn(event: Event): void;
+        protected handleFocusOut(event: Event): void;
+        private findFilteredOption;
+        private setInitialValue;
+        private isOptionObject;
+        private setOptionCustomContent;
+        private getOptionValue;
+        private getOptionGroupName;
+        private getOptionId;
+        private getFocusedItem;
+        private setupEvents;
+        private teardownEvents;
+        private setVisualListbox;
+        private setGroupList;
+        private findSelectedOption;
+        private findOptionIndex;
+        private checkSelectedOptions;
+        private unCheckAllOptions;
+        private setSelectedOption;
+        private notifySelectedChange;
+        private handleGroupFilter;
+        private filterOptions;
+        private getListBoxVerticalPadding;
+        private resizeListbox;
+        private setInputValue;
+        private updateOnNextFrame;
+        private unCheckedAllOptions;
+        private unCheckedOption;
+        private checkAllOptions;
+        private checkOption;
+        private isSelectAllSelected;
+        private setFocusOnHost;
+        private isOptionFocused;
+        private getAriaState;
+        private scrollToOption;
+        private getCustomContentName;
+        private setInputSelectionRange;
+        private isOptionChecked;
+        private getInputSelection;
+        private canMultiSelect;
+        private removeMultiTag;
+        private unselectedAllMultiTag;
+        private findLastMultiSelected;
+        private toggleMultiSelectedTag;
+        private selectMultiTag;
+        handleListClick(event: MouseEvent): Promise<void>;
+        handleSelectAll(): Promise<void>;
+        handleInputKeyUp(event: KeyboardEvent): void;
+        private notifyInputValueChanged;
+        handleInput(event: Event): void;
+        private removeAllSelected;
+        private removeSelected;
+        private selectedChange;
+        private setSelectedAttribute;
+        private shouldChangeButton;
+        private setCustomValue;
+        handleGroupFocus(): void;
+        handleInputKeyDown(event: KeyboardEvent): void;
+        handleGroupLabelKeyDown(event: KeyboardEvent, option: OptionMember): void;
+        toggleVisualListBox(e: any): void;
+        toggleGroupListBox(e: Event, data: string): void;
+        handleRemoveAll(event: MouseEvent): void;
+        handleOutsideClick: (event: MouseEvent) => void;
+        connectedCallback(): void;
+        disconnectedCallback(): void;
+        static get styles(): import("lit-element").CSSResult[];
+        get listItemOptionMap(): {
+            "md-combobox-multiselect": boolean;
+            compact: boolean;
+            "md-combobox-dropdown-arrow": boolean;
+        };
+        get filteredOptions(): (string | OptionMember)[];
+        get filteredGroupOptions(): (string | OptionMember)[];
+        get comboBoxTemplateClassMap(): {
+            [x: string]: boolean;
+            "md-combobox-searchable": boolean;
+            "md-combobox-has-leading-icon": boolean;
+            "md-new-combobox": boolean;
+            "md-combobox-readonly": boolean;
+            "md-combobox-compact": boolean;
+            "md-combobox-dropdown-arrow": boolean;
+        };
+        searchIconTemplate(): TemplateResult;
+        filterIconTemplate(): TemplateResult;
+        leadingIconTemplate(iconName: string, iconClass: string): TemplateResult;
+        selectedOptionTemplate(selectedOption: string | OptionMember): TemplateResult;
+        clearButtonTemplate(): TemplateResult;
+        arrowButtonTemplate(): TemplateResult;
+        groupArrowButtonTemplate(data: string): TemplateResult;
+        getSelectAllOption(): TemplateResult;
+        getSelctedCount(): {};
+        checkForVirtualScroll(): boolean;
+        rangeChanged(): void;
+        getCustomErrorContent(): DocumentFragment;
+        getCustomContent(option: string | OptionMember): DocumentFragment | TemplateResult;
+        renderGroupLabelHeader(option: OptionMember, optionIndex: number): TemplateResult;
+        renderWithoutVirtualScroll(): import("lit-html").DirectiveFn;
+        highlightingSearchedText(option: OptionMember | string): TemplateResult[];
+        addStyle(): (part: import("lit-html").Part) => void;
+        renderItem(option: OptionMember | string, index: number): TemplateResult;
+        inputTitle(): string;
+        helpTextTemplate(): {};
+        messagesTemplate(): {};
+        get newArrowButtonTemplate(): TemplateResult;
+        get renderNewMomentumArrow(): TemplateResult;
+        get renderTrailingInputControls(): TemplateResult;
+        render(): TemplateResult;
+    }
+    export {};
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "md-combobox": ComboBox.ELEMENT;
+    }
+}