@usecapsule/core-components 2.0.10 → 3.0.1-dev.1

package/dist/types/components.d.ts

@@ -24,9 +24,9 @@ export namespace Components {
          */
         "icon"?: IconType;
         /**
-          * The type of alert. Options are: `"error"` Default is: `"error"`.
+          * The variant of alert. Options are: `"error"` | `"warning"` | `"success"` | `"custom"` Default is: `"error"`.
          */
-        "type"?: 'error';
+        "variant"?: 'error' | 'warning' | 'success' | 'custom';
     }
     interface CpslAnimation {
         /**
@@ -38,15 +38,77 @@ export namespace Components {
          */
         "src": string;
     }
+    interface CpslAppBar {
+        /**
+          * Height of the app bar.
+         */
+        "height": number;
+        /**
+          * The position of the drawer. Default is `fixed`.
+         */
+        "position"?: 'fixed' | 'static';
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslAvatar {
+        /**
+          * The alternate text for the avatar image.
+         */
+        "alt"?: string;
+        /**
+          * The source of the avatar image.
+         */
+        "src": string;
+        /**
+          * The variant of the avatar. Options are: `"round"`, `"square". Default is: `"square"`.
+         */
+        "variant"?: 'round' | 'square';
+    }
     interface CpslButton {
+        /**
+          * The tag for the button. Options are: `"button"`, `"a". Default is: `"button"`.
+         */
+        "as"?: 'button' | 'a';
         /**
           * If the button is disabled. Default is: false.
          */
         "disabled"?: boolean;
         /**
-          * The variant of button. Options are: `"primary"`, `"secondary", `"icon". Default is: `"primary"`.
+          * Whether the button takes the full width of it's container. Default is: false.
+         */
+        "fullWidth"?: boolean;
+        /**
+          * href to use when using a link.
+         */
+        "href"?: string;
+        /**
+          * The size of the button. Options are: `"small"`, `"medium". Default is: `"medium"`.
+         */
+        "size"?: 'small' | 'medium';
+        /**
+          * target to use when using a link.
+         */
+        "target"?: string;
+        /**
+          * The variant of the button. Options are: `"primary"`, `"secondary", `"icon", `"text"`. Default is: `"primary"`.
+         */
+        "variant"?: 'primary' | 'secondary' | 'ghost' | 'destructive';
+    }
+    interface CpslButtonGroup {
+        /**
+          * The id of the selected button.
+         */
+        "selectedId"?: string;
+    }
+    interface CpslCard {
+    }
+    interface CpslCheckbox {
+        /**
+          * Whether or not the checkbox is checked.
          */
-        "variant"?: 'primary' | 'secondary' | 'icon';
+        "checked": boolean;
     }
     interface CpslCodeInput {
         /**
@@ -170,6 +232,44 @@ export namespace Components {
     }
     interface CpslDivider {
     }
+    interface CpslDrawer {
+        /**
+          * Side from which the drawer will enter from.
+         */
+        "anchor": 'top' | 'bottom' | 'left' | 'right';
+        /**
+          * Starting anchor position.
+         */
+        "anchorPosition"?: number;
+        /**
+          * Hides the overlay for temporary drawers.
+         */
+        "noOverlay"?: boolean;
+        /**
+          * Whether the drawer is open or not.
+         */
+        "open": boolean;
+        /**
+          * Size (height or width) of the drawer.
+         */
+        "size": number | 'auto';
+        /**
+          * Duration in seconds of the open/close animation. Default is 0.15.
+         */
+        "transitionDuration"?: number;
+        /**
+          * Transition timing function to use. Default is ease-in-out.
+         */
+        "transitionFunction"?: string;
+        /**
+          * The variant of the drawer. `temporary` drawers will cover content and contain a backdrop. `permanent` drawers will sit beside content, i.e. desktop navigation. Default is `temporary`.
+         */
+        "variant"?: 'temporary' | 'permanent';
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
     interface CpslDropdown {
         /**
           * Whether or not to include search capability
@@ -188,6 +288,44 @@ export namespace Components {
          */
         "width": string;
     }
+    interface CpslFileUpload {
+        /**
+          * Error text to show below the input. If this is provided the input will enter an error state.
+         */
+        "errorText"?: string;
+        /**
+          * Filename for the external source of the selected file.
+         */
+        "externalFilename"?: string;
+        /**
+          * External source for the selected file.
+         */
+        "externalSrc"?: string;
+        /**
+          * Valid file types.
+         */
+        "fileTypes"?: string[];
+        /**
+          * Helper text to show below the input. If `"errorText"` is provided that will take precedence.
+         */
+        "helperText"?: string;
+        /**
+          * The label for the input.
+         */
+        "label"?: string;
+        /**
+          * If `true`, the user must fill in a value before submitting a form.
+         */
+        "required": boolean;
+        /**
+          * If `true`, the label will display an "optional" tag.
+         */
+        "showOptionalLabel": boolean;
+        /**
+          * Function to trigger file upload to server. Returns: boolean indicating success or failure.
+         */
+        "uploadFile"?: (file: File) => Promise<boolean>;
+    }
     interface CpslGrid {
         /**
           * If `true`, the grid will have a fixed width based on the screen size.
@@ -291,6 +429,10 @@ export namespace Components {
           * If `true`, the user must fill in a value before submitting a form.
          */
         "required": boolean;
+        /**
+          * If `true`, the label will display an "optional" tag.
+         */
+        "showOptionalLabel": boolean;
         /**
           * If `true`, the element will have its spelling and grammar checked.
          */
@@ -341,6 +483,42 @@ export namespace Components {
           * Whether or not to show the modal.
          */
         "open": boolean;
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslModalV2 {
+        /**
+          * Whether or not to show the modal with a box shadow.
+         */
+        "elevated": boolean;
+        /**
+          * Duration in seconds of the modal entering. Default is .15.
+         */
+        "enterTransitionDuration"?: number;
+        /**
+          * Duration in seconds of the modal exiting. Default is .15.
+         */
+        "exitTransitionDuration"?: number;
+        /**
+          * Whether or not to show the overlay.
+         */
+        "noOverlay": boolean;
+        /**
+          * Whether or not to show the modal.
+         */
+        "open": boolean;
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslNavButtonGroup {
+        /**
+          * The id of the selected button.
+         */
+        "selectedId"?: string;
     }
     interface CpslOverlay {
         /**
@@ -355,6 +533,24 @@ export namespace Components {
           * Whether or not to show the overlay.
          */
         "open": boolean;
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslPagination {
+        /**
+          * The initial page to select. Default is 0.
+         */
+        "initialPage"?: number;
+        /**
+          * The total number of pages.
+         */
+        "totalPages": number;
+        /**
+          * The number of pages visible to select. Default is 5. Min is 5.
+         */
+        "visiblePages"?: number;
     }
     interface CpslPill {
         /**
@@ -362,6 +558,48 @@ export namespace Components {
          */
         "text": string;
     }
+    interface CpslPopover {
+        /**
+          * Vertical anchor origin. Options are: `"left"`, `"center"`, `"right"`. Default is: `"left"`.
+         */
+        "anchorOriginHorizontal"?: 'left' | 'center' | 'right';
+        /**
+          * Vertical anchor origin. Options are: `"top"`, `"center"`, `"bottom"`. Default is: `"bottom"`.
+         */
+        "anchorOriginVertical"?: 'top' | 'center' | 'bottom';
+        /**
+          * If `true` the container will use the width of the content, else it will be set to the width of the trigger. Default is `true`
+         */
+        "autoWidth"?: boolean;
+        /**
+          * Call to close the popover manually.
+         */
+        "closePopover": () => Promise<void>;
+        /**
+          * Used internally to prevent select from blurring unintentionally.
+         */
+        "preventBlur": boolean;
+        /**
+          * Vertical transformation origin. Options are: `"left"`, `"center"`, `"right"`. Default is: `"left"`.
+         */
+        "transformOriginHorizontal"?: 'left' | 'center' | 'right';
+        /**
+          * Vertical transformation origin. Options are: `"top"`, `"center"`, `"bottom"`. Default is: `"bottom"`.
+         */
+        "transformOriginVertical"?: 'top' | 'center' | 'bottom';
+        /**
+          * ID for the element that triggers the popover to open.
+         */
+        "trigger": string;
+        /**
+          * Which trigger causes the popover to open. Options are: `"click"`, `"hover"`. Default is: `"click"`.
+         */
+        "triggerAction": 'click' | 'hover';
+        /**
+          * Padding from edge of window for the popover container.
+         */
+        "windowPadding"?: number;
+    }
     interface CpslProgressIndicator {
         /**
           * Current zero based step.
@@ -386,8 +624,74 @@ export namespace Components {
          */
         "url": string;
     }
+    interface CpslRadio {
+        /**
+          * Whether or not the radio is checked.
+         */
+        "checked": boolean;
+    }
     interface CpslRow {
     }
+    interface CpslSelect {
+        /**
+          * If `true`, the user cannot interact with the input.
+         */
+        "disabled": boolean;
+        /**
+          * Set the max height of the dropdown.
+         */
+        "dropdownMaxHeight"?: number;
+        /**
+          * Error text to show below the input. If this is provided the input will enter an error state.
+         */
+        "errorText"?: string;
+        /**
+          * Format value for display when selected.
+         */
+        "formatValue"?: (value: string) => string;
+        /**
+          * Helper text to show below the input. If `"errorText"` is provided that will take precedence.
+         */
+        "helperText"?: string;
+        /**
+          * ID of the element, must be unique for the popover trigger.
+         */
+        "id": string;
+        /**
+          * The label for the input.
+         */
+        "label"?: string;
+        /**
+          * Placeholder to display if `selectedValue` is empty.
+         */
+        "placeholder"?: string;
+        /**
+          * If `true`, the user must fill in a value before submitting a form.
+         */
+        "required": boolean;
+        /**
+          * Value of the selected item.
+         */
+        "selectedValue"?: string;
+        /**
+          * Will show the formatted selected item (passed in the `selected-item` slot) in the select rather than the item value.
+         */
+        "showFormattedSelectedItem"?: boolean;
+        /**
+          * If `true`, the label will display an "optional" tag.
+         */
+        "showOptionalLabel": boolean;
+    }
+    interface CpslSelectItem {
+        /**
+          * Whether the item is selected or not.
+         */
+        "selected"?: boolean;
+        /**
+          * Value of the item.
+         */
+        "value": string;
+    }
     interface CpslSlideButton {
         /**
           * Whether or not the component is disabled. If true, the component will display the `startText`.
@@ -420,6 +724,12 @@ export namespace Components {
          */
         "speed"?: number;
     }
+    interface CpslSwitch {
+        /**
+          * Whether or not the switch is checked.
+         */
+        "checked": boolean;
+    }
     interface CpslTab {
         /**
           * The selected tab component
@@ -430,6 +740,8 @@ export namespace Components {
          */
         "tab": string;
     }
+    interface CpslTable {
+    }
     interface CpslTabs {
         /**
           * Whether or not the tabs take the full width of their container.
@@ -442,9 +754,9 @@ export namespace Components {
     }
     interface CpslText {
         /**
-          * The color of text. Options are: `"primary"`, `"secondary", `"subtle", `"inverted", `"error". Default is: `"primary"`.
+          * The color of text. Options are: `"primary"`, `"secondary", `"tertiary", `"subtle", `"inverted", `"error". Default is: `"primary"`.
          */
-        "color"?: 'primary' | 'secondary' | 'subtle' | 'inverted' | 'error';
+        "color"?: 'primary' | 'secondary' | 'tertiary' | 'subtle' | 'inverted' | 'error';
         /**
           * The variant of text. Options are: `"body2XS"`, `"bodyXS", `"bodyS", `"bodyM", `"bodyL", `"bodyXL", `"headingXS", `"headingS", `"headingM", `"headingL", `"headingXL", `"heading2XL". Default is: `"bodyM"`.
          */
@@ -465,6 +777,10 @@ export namespace Components {
         "src"?: string;
     }
 }
+export interface CpslCheckboxCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslCheckboxElement;
+}
 export interface CpslCodeInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCpslCodeInputElement;
@@ -473,6 +789,10 @@ export interface CpslDropdownCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCpslDropdownElement;
 }
+export interface CpslFileUploadCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslFileUploadElement;
+}
 export interface CpslInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCpslInputElement;
@@ -481,10 +801,38 @@ export interface CpslModalCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCpslModalElement;
 }
+export interface CpslModalV2CustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslModalV2Element;
+}
+export interface CpslPaginationCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslPaginationElement;
+}
+export interface CpslPopoverCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslPopoverElement;
+}
+export interface CpslRadioCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslRadioElement;
+}
+export interface CpslSelectCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslSelectElement;
+}
+export interface CpslSelectItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslSelectItemElement;
+}
 export interface CpslSlideButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCpslSlideButtonElement;
 }
+export interface CpslSwitchCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCpslSwitchElement;
+}
 export interface CpslTabCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCpslTabElement;
@@ -506,12 +854,53 @@ declare global {
         prototype: HTMLCpslAnimationElement;
         new (): HTMLCpslAnimationElement;
     };
+    interface HTMLCpslAppBarElement extends Components.CpslAppBar, HTMLStencilElement {
+    }
+    var HTMLCpslAppBarElement: {
+        prototype: HTMLCpslAppBarElement;
+        new (): HTMLCpslAppBarElement;
+    };
+    interface HTMLCpslAvatarElement extends Components.CpslAvatar, HTMLStencilElement {
+    }
+    var HTMLCpslAvatarElement: {
+        prototype: HTMLCpslAvatarElement;
+        new (): HTMLCpslAvatarElement;
+    };
     interface HTMLCpslButtonElement extends Components.CpslButton, HTMLStencilElement {
     }
     var HTMLCpslButtonElement: {
         prototype: HTMLCpslButtonElement;
         new (): HTMLCpslButtonElement;
     };
+    interface HTMLCpslButtonGroupElement extends Components.CpslButtonGroup, HTMLStencilElement {
+    }
+    var HTMLCpslButtonGroupElement: {
+        prototype: HTMLCpslButtonGroupElement;
+        new (): HTMLCpslButtonGroupElement;
+    };
+    interface HTMLCpslCardElement extends Components.CpslCard, HTMLStencilElement {
+    }
+    var HTMLCpslCardElement: {
+        prototype: HTMLCpslCardElement;
+        new (): HTMLCpslCardElement;
+    };
+    interface HTMLCpslCheckboxElementEventMap {
+        "cpslCheckboxChanged": boolean;
+    }
+    interface HTMLCpslCheckboxElement extends Components.CpslCheckbox, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslCheckboxElementEventMap>(type: K, listener: (this: HTMLCpslCheckboxElement, ev: CpslCheckboxCustomEvent<HTMLCpslCheckboxElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslCheckboxElementEventMap>(type: K, listener: (this: HTMLCpslCheckboxElement, ev: CpslCheckboxCustomEvent<HTMLCpslCheckboxElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslCheckboxElement: {
+        prototype: HTMLCpslCheckboxElement;
+        new (): HTMLCpslCheckboxElement;
+    };
     interface HTMLCpslCodeInputElementEventMap {
         "cpslInput": CodeChangeEventDetail;
     }
@@ -541,6 +930,12 @@ declare global {
         prototype: HTMLCpslDividerElement;
         new (): HTMLCpslDividerElement;
     };
+    interface HTMLCpslDrawerElement extends Components.CpslDrawer, HTMLStencilElement {
+    }
+    var HTMLCpslDrawerElement: {
+        prototype: HTMLCpslDrawerElement;
+        new (): HTMLCpslDrawerElement;
+    };
     interface HTMLCpslDropdownElementEventMap {
         "selectedItemChange": DropdownInputEventDetail;
     }
@@ -558,6 +953,27 @@ declare global {
         prototype: HTMLCpslDropdownElement;
         new (): HTMLCpslDropdownElement;
     };
+    interface HTMLCpslFileUploadElementEventMap {
+        "cpslOnDrop": DragEvent;
+        "cpslOnDragEnter": DragEvent;
+        "cpslOnDragLeave": DragEvent;
+        "cpslFileChange": File;
+        "cpslFileRemoved": void;
+    }
+    interface HTMLCpslFileUploadElement extends Components.CpslFileUpload, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslFileUploadElementEventMap>(type: K, listener: (this: HTMLCpslFileUploadElement, ev: CpslFileUploadCustomEvent<HTMLCpslFileUploadElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslFileUploadElementEventMap>(type: K, listener: (this: HTMLCpslFileUploadElement, ev: CpslFileUploadCustomEvent<HTMLCpslFileUploadElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslFileUploadElement: {
+        prototype: HTMLCpslFileUploadElement;
+        new (): HTMLCpslFileUploadElement;
+    };
     interface HTMLCpslGridElement extends Components.CpslGrid, HTMLStencilElement {
     }
     var HTMLCpslGridElement: {
@@ -618,18 +1034,79 @@ declare global {
         prototype: HTMLCpslModalElement;
         new (): HTMLCpslModalElement;
     };
+    interface HTMLCpslModalV2ElementEventMap {
+        "cpslModalEntering": null;
+        "cpslModalEntered": null;
+        "cpslModalExiting": null;
+        "cpslModalExited": null;
+    }
+    interface HTMLCpslModalV2Element extends Components.CpslModalV2, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslModalV2ElementEventMap>(type: K, listener: (this: HTMLCpslModalV2Element, ev: CpslModalV2CustomEvent<HTMLCpslModalV2ElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslModalV2ElementEventMap>(type: K, listener: (this: HTMLCpslModalV2Element, ev: CpslModalV2CustomEvent<HTMLCpslModalV2ElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslModalV2Element: {
+        prototype: HTMLCpslModalV2Element;
+        new (): HTMLCpslModalV2Element;
+    };
+    interface HTMLCpslNavButtonGroupElement extends Components.CpslNavButtonGroup, HTMLStencilElement {
+    }
+    var HTMLCpslNavButtonGroupElement: {
+        prototype: HTMLCpslNavButtonGroupElement;
+        new (): HTMLCpslNavButtonGroupElement;
+    };
     interface HTMLCpslOverlayElement extends Components.CpslOverlay, HTMLStencilElement {
     }
     var HTMLCpslOverlayElement: {
         prototype: HTMLCpslOverlayElement;
         new (): HTMLCpslOverlayElement;
     };
+    interface HTMLCpslPaginationElementEventMap {
+        "cpslPaginationChanged": number;
+    }
+    interface HTMLCpslPaginationElement extends Components.CpslPagination, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslPaginationElementEventMap>(type: K, listener: (this: HTMLCpslPaginationElement, ev: CpslPaginationCustomEvent<HTMLCpslPaginationElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslPaginationElementEventMap>(type: K, listener: (this: HTMLCpslPaginationElement, ev: CpslPaginationCustomEvent<HTMLCpslPaginationElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslPaginationElement: {
+        prototype: HTMLCpslPaginationElement;
+        new (): HTMLCpslPaginationElement;
+    };
     interface HTMLCpslPillElement extends Components.CpslPill, HTMLStencilElement {
     }
     var HTMLCpslPillElement: {
         prototype: HTMLCpslPillElement;
         new (): HTMLCpslPillElement;
     };
+    interface HTMLCpslPopoverElementEventMap {
+        "cpslOpen": void;
+        "cpslClose": void;
+    }
+    interface HTMLCpslPopoverElement extends Components.CpslPopover, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslPopoverElementEventMap>(type: K, listener: (this: HTMLCpslPopoverElement, ev: CpslPopoverCustomEvent<HTMLCpslPopoverElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslPopoverElementEventMap>(type: K, listener: (this: HTMLCpslPopoverElement, ev: CpslPopoverCustomEvent<HTMLCpslPopoverElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslPopoverElement: {
+        prototype: HTMLCpslPopoverElement;
+        new (): HTMLCpslPopoverElement;
+    };
     interface HTMLCpslProgressIndicatorElement extends Components.CpslProgressIndicator, HTMLStencilElement {
     }
     var HTMLCpslProgressIndicatorElement: {
@@ -642,12 +1119,65 @@ declare global {
         prototype: HTMLCpslQrCodeElement;
         new (): HTMLCpslQrCodeElement;
     };
+    interface HTMLCpslRadioElementEventMap {
+        "cpslRadioChanged": boolean;
+    }
+    interface HTMLCpslRadioElement extends Components.CpslRadio, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslRadioElementEventMap>(type: K, listener: (this: HTMLCpslRadioElement, ev: CpslRadioCustomEvent<HTMLCpslRadioElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslRadioElementEventMap>(type: K, listener: (this: HTMLCpslRadioElement, ev: CpslRadioCustomEvent<HTMLCpslRadioElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslRadioElement: {
+        prototype: HTMLCpslRadioElement;
+        new (): HTMLCpslRadioElement;
+    };
     interface HTMLCpslRowElement extends Components.CpslRow, HTMLStencilElement {
     }
     var HTMLCpslRowElement: {
         prototype: HTMLCpslRowElement;
         new (): HTMLCpslRowElement;
     };
+    interface HTMLCpslSelectElementEventMap {
+        "cpslBlur": FocusEvent;
+        "cpslFocus": FocusEvent;
+        "cpslSelectValueChange": string;
+    }
+    interface HTMLCpslSelectElement extends Components.CpslSelect, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslSelectElementEventMap>(type: K, listener: (this: HTMLCpslSelectElement, ev: CpslSelectCustomEvent<HTMLCpslSelectElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslSelectElementEventMap>(type: K, listener: (this: HTMLCpslSelectElement, ev: CpslSelectCustomEvent<HTMLCpslSelectElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslSelectElement: {
+        prototype: HTMLCpslSelectElement;
+        new (): HTMLCpslSelectElement;
+    };
+    interface HTMLCpslSelectItemElementEventMap {
+        "cpslSelectItemClick": string;
+    }
+    interface HTMLCpslSelectItemElement extends Components.CpslSelectItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslSelectItemElementEventMap>(type: K, listener: (this: HTMLCpslSelectItemElement, ev: CpslSelectItemCustomEvent<HTMLCpslSelectItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslSelectItemElementEventMap>(type: K, listener: (this: HTMLCpslSelectItemElement, ev: CpslSelectItemCustomEvent<HTMLCpslSelectItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslSelectItemElement: {
+        prototype: HTMLCpslSelectItemElement;
+        new (): HTMLCpslSelectItemElement;
+    };
     interface HTMLCpslSlideButtonElementEventMap {
         "cpslComplete": boolean;
     }
@@ -671,6 +1201,23 @@ declare global {
         prototype: HTMLCpslSpinnerElement;
         new (): HTMLCpslSpinnerElement;
     };
+    interface HTMLCpslSwitchElementEventMap {
+        "cpslSwitchChanged": boolean;
+    }
+    interface HTMLCpslSwitchElement extends Components.CpslSwitch, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCpslSwitchElementEventMap>(type: K, listener: (this: HTMLCpslSwitchElement, ev: CpslSwitchCustomEvent<HTMLCpslSwitchElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCpslSwitchElementEventMap>(type: K, listener: (this: HTMLCpslSwitchElement, ev: CpslSwitchCustomEvent<HTMLCpslSwitchElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCpslSwitchElement: {
+        prototype: HTMLCpslSwitchElement;
+        new (): HTMLCpslSwitchElement;
+    };
     interface HTMLCpslTabElementEventMap {
         "cpslTabButtonClick": TabClickEventDetail;
     }
@@ -688,6 +1235,12 @@ declare global {
         prototype: HTMLCpslTabElement;
         new (): HTMLCpslTabElement;
     };
+    interface HTMLCpslTableElement extends Components.CpslTable, HTMLStencilElement {
+    }
+    var HTMLCpslTableElement: {
+        prototype: HTMLCpslTableElement;
+        new (): HTMLCpslTableElement;
+    };
     interface HTMLCpslTabsElementEventMap {
         "cpslTabsChanged": TabsChangedEventDetail;
         "cpslTabsInit": TabsChangedEventDetail;
@@ -721,24 +1274,40 @@ declare global {
     interface HTMLElementTagNameMap {
         "cpsl-alert": HTMLCpslAlertElement;
         "cpsl-animation": HTMLCpslAnimationElement;
+        "cpsl-app-bar": HTMLCpslAppBarElement;
+        "cpsl-avatar": HTMLCpslAvatarElement;
         "cpsl-button": HTMLCpslButtonElement;
+        "cpsl-button-group": HTMLCpslButtonGroupElement;
+        "cpsl-card": HTMLCpslCardElement;
+        "cpsl-checkbox": HTMLCpslCheckboxElement;
         "cpsl-code-input": HTMLCpslCodeInputElement;
         "cpsl-col": HTMLCpslColElement;
         "cpsl-divider": HTMLCpslDividerElement;
+        "cpsl-drawer": HTMLCpslDrawerElement;
         "cpsl-dropdown": HTMLCpslDropdownElement;
+        "cpsl-file-upload": HTMLCpslFileUploadElement;
         "cpsl-grid": HTMLCpslGridElement;
         "cpsl-icon": HTMLCpslIconElement;
         "cpsl-info-box": HTMLCpslInfoBoxElement;
         "cpsl-input": HTMLCpslInputElement;
         "cpsl-modal": HTMLCpslModalElement;
+        "cpsl-modal-v2": HTMLCpslModalV2Element;
+        "cpsl-nav-button-group": HTMLCpslNavButtonGroupElement;
         "cpsl-overlay": HTMLCpslOverlayElement;
+        "cpsl-pagination": HTMLCpslPaginationElement;
         "cpsl-pill": HTMLCpslPillElement;
+        "cpsl-popover": HTMLCpslPopoverElement;
         "cpsl-progress-indicator": HTMLCpslProgressIndicatorElement;
         "cpsl-qr-code": HTMLCpslQrCodeElement;
+        "cpsl-radio": HTMLCpslRadioElement;
         "cpsl-row": HTMLCpslRowElement;
+        "cpsl-select": HTMLCpslSelectElement;
+        "cpsl-select-item": HTMLCpslSelectItemElement;
         "cpsl-slide-button": HTMLCpslSlideButtonElement;
         "cpsl-spinner": HTMLCpslSpinnerElement;
+        "cpsl-switch": HTMLCpslSwitchElement;
         "cpsl-tab": HTMLCpslTabElement;
+        "cpsl-table": HTMLCpslTableElement;
         "cpsl-tabs": HTMLCpslTabsElement;
         "cpsl-text": HTMLCpslTextElement;
         "cpsl-tile-button": HTMLCpslTileButtonElement;
@@ -751,9 +1320,9 @@ declare namespace LocalJSX {
          */
         "icon"?: IconType;
         /**
-          * The type of alert. Options are: `"error"` Default is: `"error"`.
+          * The variant of alert. Options are: `"error"` | `"warning"` | `"success"` | `"custom"` Default is: `"error"`.
          */
-        "type"?: 'error';
+        "variant"?: 'error' | 'warning' | 'success' | 'custom';
     }
     interface CpslAnimation {
         /**
@@ -761,15 +1330,81 @@ declare namespace LocalJSX {
          */
         "src"?: string;
     }
+    interface CpslAppBar {
+        /**
+          * Height of the app bar.
+         */
+        "height"?: number;
+        /**
+          * The position of the drawer. Default is `fixed`.
+         */
+        "position"?: 'fixed' | 'static';
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslAvatar {
+        /**
+          * The alternate text for the avatar image.
+         */
+        "alt"?: string;
+        /**
+          * The source of the avatar image.
+         */
+        "src"?: string;
+        /**
+          * The variant of the avatar. Options are: `"round"`, `"square". Default is: `"square"`.
+         */
+        "variant"?: 'round' | 'square';
+    }
     interface CpslButton {
+        /**
+          * The tag for the button. Options are: `"button"`, `"a". Default is: `"button"`.
+         */
+        "as"?: 'button' | 'a';
         /**
           * If the button is disabled. Default is: false.
          */
         "disabled"?: boolean;
         /**
-          * The variant of button. Options are: `"primary"`, `"secondary", `"icon". Default is: `"primary"`.
+          * Whether the button takes the full width of it's container. Default is: false.
+         */
+        "fullWidth"?: boolean;
+        /**
+          * href to use when using a link.
+         */
+        "href"?: string;
+        /**
+          * The size of the button. Options are: `"small"`, `"medium". Default is: `"medium"`.
+         */
+        "size"?: 'small' | 'medium';
+        /**
+          * target to use when using a link.
+         */
+        "target"?: string;
+        /**
+          * The variant of the button. Options are: `"primary"`, `"secondary", `"icon", `"text"`. Default is: `"primary"`.
+         */
+        "variant"?: 'primary' | 'secondary' | 'ghost' | 'destructive';
+    }
+    interface CpslButtonGroup {
+        /**
+          * The id of the selected button.
+         */
+        "selectedId"?: string;
+    }
+    interface CpslCard {
+    }
+    interface CpslCheckbox {
+        /**
+          * Whether or not the checkbox is checked.
+         */
+        "checked"?: boolean;
+        /**
+          * Emitted when the checkbox state changes.
          */
-        "variant"?: 'primary' | 'secondary' | 'icon';
+        "onCpslCheckboxChanged"?: (event: CpslCheckboxCustomEvent<boolean>) => void;
     }
     interface CpslCodeInput {
         /**
@@ -897,6 +1532,44 @@ declare namespace LocalJSX {
     }
     interface CpslDivider {
     }
+    interface CpslDrawer {
+        /**
+          * Side from which the drawer will enter from.
+         */
+        "anchor"?: 'top' | 'bottom' | 'left' | 'right';
+        /**
+          * Starting anchor position.
+         */
+        "anchorPosition"?: number;
+        /**
+          * Hides the overlay for temporary drawers.
+         */
+        "noOverlay"?: boolean;
+        /**
+          * Whether the drawer is open or not.
+         */
+        "open"?: boolean;
+        /**
+          * Size (height or width) of the drawer.
+         */
+        "size"?: number | 'auto';
+        /**
+          * Duration in seconds of the open/close animation. Default is 0.15.
+         */
+        "transitionDuration"?: number;
+        /**
+          * Transition timing function to use. Default is ease-in-out.
+         */
+        "transitionFunction"?: string;
+        /**
+          * The variant of the drawer. `temporary` drawers will cover content and contain a backdrop. `permanent` drawers will sit beside content, i.e. desktop navigation. Default is `temporary`.
+         */
+        "variant"?: 'temporary' | 'permanent';
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
     interface CpslDropdown {
         /**
           * Whether or not to include search capability
@@ -919,6 +1592,64 @@ declare namespace LocalJSX {
          */
         "width"?: string;
     }
+    interface CpslFileUpload {
+        /**
+          * Error text to show below the input. If this is provided the input will enter an error state.
+         */
+        "errorText"?: string;
+        /**
+          * Filename for the external source of the selected file.
+         */
+        "externalFilename"?: string;
+        /**
+          * External source for the selected file.
+         */
+        "externalSrc"?: string;
+        /**
+          * Valid file types.
+         */
+        "fileTypes"?: string[];
+        /**
+          * Helper text to show below the input. If `"errorText"` is provided that will take precedence.
+         */
+        "helperText"?: string;
+        /**
+          * The label for the input.
+         */
+        "label"?: string;
+        /**
+          * Emitted when the file changes.
+         */
+        "onCpslFileChange"?: (event: CpslFileUploadCustomEvent<File>) => void;
+        /**
+          * Emitted when the file is removed.
+         */
+        "onCpslFileRemoved"?: (event: CpslFileUploadCustomEvent<void>) => void;
+        /**
+          * Emitted when the file drag enters the input.
+         */
+        "onCpslOnDragEnter"?: (event: CpslFileUploadCustomEvent<DragEvent>) => void;
+        /**
+          * Emitted when the file drag leaves the input.
+         */
+        "onCpslOnDragLeave"?: (event: CpslFileUploadCustomEvent<DragEvent>) => void;
+        /**
+          * Emitted when the file is dropped in the input.
+         */
+        "onCpslOnDrop"?: (event: CpslFileUploadCustomEvent<DragEvent>) => void;
+        /**
+          * If `true`, the user must fill in a value before submitting a form.
+         */
+        "required"?: boolean;
+        /**
+          * If `true`, the label will display an "optional" tag.
+         */
+        "showOptionalLabel"?: boolean;
+        /**
+          * Function to trigger file upload to server. Returns: boolean indicating success or failure.
+         */
+        "uploadFile"?: (file: File) => Promise<boolean>;
+    }
     interface CpslGrid {
         /**
           * If `true`, the grid will have a fixed width based on the screen size.
@@ -1042,6 +1773,10 @@ declare namespace LocalJSX {
           * If `true`, the user must fill in a value before submitting a form.
          */
         "required"?: boolean;
+        /**
+          * If `true`, the label will display an "optional" tag.
+         */
+        "showOptionalLabel"?: boolean;
         /**
           * If `true`, the element will have its spelling and grammar checked.
          */
@@ -1112,6 +1847,58 @@ declare namespace LocalJSX {
           * Whether or not to show the modal.
          */
         "open"?: boolean;
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslModalV2 {
+        /**
+          * Whether or not to show the modal with a box shadow.
+         */
+        "elevated"?: boolean;
+        /**
+          * Duration in seconds of the modal entering. Default is .15.
+         */
+        "enterTransitionDuration"?: number;
+        /**
+          * Duration in seconds of the modal exiting. Default is .15.
+         */
+        "exitTransitionDuration"?: number;
+        /**
+          * Whether or not to show the overlay.
+         */
+        "noOverlay"?: boolean;
+        /**
+          * Emitted when enter animation finishes.
+         */
+        "onCpslModalEntered"?: (event: CpslModalV2CustomEvent<null>) => void;
+        /**
+          * Emitted when enter animation starts.
+         */
+        "onCpslModalEntering"?: (event: CpslModalV2CustomEvent<null>) => void;
+        /**
+          * Emitted when exit animation finishes.
+         */
+        "onCpslModalExited"?: (event: CpslModalV2CustomEvent<null>) => void;
+        /**
+          * Emitted when exit animation starts.
+         */
+        "onCpslModalExiting"?: (event: CpslModalV2CustomEvent<null>) => void;
+        /**
+          * Whether or not to show the modal.
+         */
+        "open"?: boolean;
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslNavButtonGroup {
+        /**
+          * The id of the selected button.
+         */
+        "selectedId"?: string;
     }
     interface CpslOverlay {
         /**
@@ -1126,6 +1913,28 @@ declare namespace LocalJSX {
           * Whether or not to show the overlay.
          */
         "open"?: boolean;
+        /**
+          * Override z-index.
+         */
+        "zIndexOverride"?: number;
+    }
+    interface CpslPagination {
+        /**
+          * The initial page to select. Default is 0.
+         */
+        "initialPage"?: number;
+        /**
+          * Emitted when exit animation finishes.
+         */
+        "onCpslPaginationChanged"?: (event: CpslPaginationCustomEvent<number>) => void;
+        /**
+          * The total number of pages.
+         */
+        "totalPages"?: number;
+        /**
+          * The number of pages visible to select. Default is 5. Min is 5.
+         */
+        "visiblePages"?: number;
     }
     interface CpslPill {
         /**
@@ -1133,6 +1942,52 @@ declare namespace LocalJSX {
          */
         "text"?: string;
     }
+    interface CpslPopover {
+        /**
+          * Vertical anchor origin. Options are: `"left"`, `"center"`, `"right"`. Default is: `"left"`.
+         */
+        "anchorOriginHorizontal"?: 'left' | 'center' | 'right';
+        /**
+          * Vertical anchor origin. Options are: `"top"`, `"center"`, `"bottom"`. Default is: `"bottom"`.
+         */
+        "anchorOriginVertical"?: 'top' | 'center' | 'bottom';
+        /**
+          * If `true` the container will use the width of the content, else it will be set to the width of the trigger. Default is `true`
+         */
+        "autoWidth"?: boolean;
+        /**
+          * Emitted when the popover closes.
+         */
+        "onCpslClose"?: (event: CpslPopoverCustomEvent<void>) => void;
+        /**
+          * Emitted when the popover opens.
+         */
+        "onCpslOpen"?: (event: CpslPopoverCustomEvent<void>) => void;
+        /**
+          * Used internally to prevent select from blurring unintentionally.
+         */
+        "preventBlur"?: boolean;
+        /**
+          * Vertical transformation origin. Options are: `"left"`, `"center"`, `"right"`. Default is: `"left"`.
+         */
+        "transformOriginHorizontal"?: 'left' | 'center' | 'right';
+        /**
+          * Vertical transformation origin. Options are: `"top"`, `"center"`, `"bottom"`. Default is: `"bottom"`.
+         */
+        "transformOriginVertical"?: 'top' | 'center' | 'bottom';
+        /**
+          * ID for the element that triggers the popover to open.
+         */
+        "trigger"?: string;
+        /**
+          * Which trigger causes the popover to open. Options are: `"click"`, `"hover"`. Default is: `"click"`.
+         */
+        "triggerAction"?: 'click' | 'hover';
+        /**
+          * Padding from edge of window for the popover container.
+         */
+        "windowPadding"?: number;
+    }
     interface CpslProgressIndicator {
         /**
           * Current zero based step.
@@ -1157,8 +2012,90 @@ declare namespace LocalJSX {
          */
         "url"?: string;
     }
+    interface CpslRadio {
+        /**
+          * Whether or not the radio is checked.
+         */
+        "checked"?: boolean;
+        /**
+          * Emitted when the radio state changes.
+         */
+        "onCpslRadioChanged"?: (event: CpslRadioCustomEvent<boolean>) => void;
+    }
     interface CpslRow {
     }
+    interface CpslSelect {
+        /**
+          * If `true`, the user cannot interact with the input.
+         */
+        "disabled"?: boolean;
+        /**
+          * Set the max height of the dropdown.
+         */
+        "dropdownMaxHeight"?: number;
+        /**
+          * Error text to show below the input. If this is provided the input will enter an error state.
+         */
+        "errorText"?: string;
+        /**
+          * Format value for display when selected.
+         */
+        "formatValue"?: (value: string) => string;
+        /**
+          * Helper text to show below the input. If `"errorText"` is provided that will take precedence.
+         */
+        "helperText"?: string;
+        /**
+          * ID of the element, must be unique for the popover trigger.
+         */
+        "id"?: string;
+        /**
+          * The label for the input.
+         */
+        "label"?: string;
+        /**
+          * Emitted when the input loses focus.
+         */
+        "onCpslBlur"?: (event: CpslSelectCustomEvent<FocusEvent>) => void;
+        /**
+          * Emitted when the input has focus.
+         */
+        "onCpslFocus"?: (event: CpslSelectCustomEvent<FocusEvent>) => void;
+        /**
+          * Emitted when the value changes.
+         */
+        "onCpslSelectValueChange"?: (event: CpslSelectCustomEvent<string>) => void;
+        /**
+          * Placeholder to display if `selectedValue` is empty.
+         */
+        "placeholder"?: string;
+        /**
+          * If `true`, the user must fill in a value before submitting a form.
+         */
+        "required"?: boolean;
+        /**
+          * Value of the selected item.
+         */
+        "selectedValue"?: string;
+        /**
+          * Will show the formatted selected item (passed in the `selected-item` slot) in the select rather than the item value.
+         */
+        "showFormattedSelectedItem"?: boolean;
+        /**
+          * If `true`, the label will display an "optional" tag.
+         */
+        "showOptionalLabel"?: boolean;
+    }
+    interface CpslSelectItem {
+        /**
+          * Whether the item is selected or not.
+         */
+        "selected"?: boolean;
+        /**
+          * Value of the item.
+         */
+        "value"?: string;
+    }
     interface CpslSlideButton {
         /**
           * Whether or not the component is disabled. If true, the component will display the `startText`.
@@ -1195,6 +2132,16 @@ declare namespace LocalJSX {
          */
         "speed"?: number;
     }
+    interface CpslSwitch {
+        /**
+          * Whether or not the switch is checked.
+         */
+        "checked"?: boolean;
+        /**
+          * Emitted when the switch state changes.
+         */
+        "onCpslSwitchChanged"?: (event: CpslSwitchCustomEvent<boolean>) => void;
+    }
     interface CpslTab {
         /**
           * The selected tab component
@@ -1205,6 +2152,8 @@ declare namespace LocalJSX {
          */
         "tab"?: string;
     }
+    interface CpslTable {
+    }
     interface CpslTabs {
         /**
           * Whether or not the tabs take the full width of their container.
@@ -1221,9 +2170,9 @@ declare namespace LocalJSX {
     }
     interface CpslText {
         /**
-          * The color of text. Options are: `"primary"`, `"secondary", `"subtle", `"inverted", `"error". Default is: `"primary"`.
+          * The color of text. Options are: `"primary"`, `"secondary", `"tertiary", `"subtle", `"inverted", `"error". Default is: `"primary"`.
          */
-        "color"?: 'primary' | 'secondary' | 'subtle' | 'inverted' | 'error';
+        "color"?: 'primary' | 'secondary' | 'tertiary' | 'subtle' | 'inverted' | 'error';
         /**
           * The variant of text. Options are: `"body2XS"`, `"bodyXS", `"bodyS", `"bodyM", `"bodyL", `"bodyXL", `"headingXS", `"headingS", `"headingM", `"headingL", `"headingXL", `"heading2XL". Default is: `"bodyM"`.
          */
@@ -1246,24 +2195,40 @@ declare namespace LocalJSX {
     interface IntrinsicElements {
         "cpsl-alert": CpslAlert;
         "cpsl-animation": CpslAnimation;
+        "cpsl-app-bar": CpslAppBar;
+        "cpsl-avatar": CpslAvatar;
         "cpsl-button": CpslButton;
+        "cpsl-button-group": CpslButtonGroup;
+        "cpsl-card": CpslCard;
+        "cpsl-checkbox": CpslCheckbox;
         "cpsl-code-input": CpslCodeInput;
         "cpsl-col": CpslCol;
         "cpsl-divider": CpslDivider;
+        "cpsl-drawer": CpslDrawer;
         "cpsl-dropdown": CpslDropdown;
+        "cpsl-file-upload": CpslFileUpload;
         "cpsl-grid": CpslGrid;
         "cpsl-icon": CpslIcon;
         "cpsl-info-box": CpslInfoBox;
         "cpsl-input": CpslInput;
         "cpsl-modal": CpslModal;
+        "cpsl-modal-v2": CpslModalV2;
+        "cpsl-nav-button-group": CpslNavButtonGroup;
         "cpsl-overlay": CpslOverlay;
+        "cpsl-pagination": CpslPagination;
         "cpsl-pill": CpslPill;
+        "cpsl-popover": CpslPopover;
         "cpsl-progress-indicator": CpslProgressIndicator;
         "cpsl-qr-code": CpslQrCode;
+        "cpsl-radio": CpslRadio;
         "cpsl-row": CpslRow;
+        "cpsl-select": CpslSelect;
+        "cpsl-select-item": CpslSelectItem;
         "cpsl-slide-button": CpslSlideButton;
         "cpsl-spinner": CpslSpinner;
+        "cpsl-switch": CpslSwitch;
         "cpsl-tab": CpslTab;
+        "cpsl-table": CpslTable;
         "cpsl-tabs": CpslTabs;
         "cpsl-text": CpslText;
         "cpsl-tile-button": CpslTileButton;
@@ -1275,24 +2240,40 @@ declare module "@stencil/core" {
         interface IntrinsicElements {
             "cpsl-alert": LocalJSX.CpslAlert & JSXBase.HTMLAttributes<HTMLCpslAlertElement>;
             "cpsl-animation": LocalJSX.CpslAnimation & JSXBase.HTMLAttributes<HTMLCpslAnimationElement>;
+            "cpsl-app-bar": LocalJSX.CpslAppBar & JSXBase.HTMLAttributes<HTMLCpslAppBarElement>;
+            "cpsl-avatar": LocalJSX.CpslAvatar & JSXBase.HTMLAttributes<HTMLCpslAvatarElement>;
             "cpsl-button": LocalJSX.CpslButton & JSXBase.HTMLAttributes<HTMLCpslButtonElement>;
+            "cpsl-button-group": LocalJSX.CpslButtonGroup & JSXBase.HTMLAttributes<HTMLCpslButtonGroupElement>;
+            "cpsl-card": LocalJSX.CpslCard & JSXBase.HTMLAttributes<HTMLCpslCardElement>;
+            "cpsl-checkbox": LocalJSX.CpslCheckbox & JSXBase.HTMLAttributes<HTMLCpslCheckboxElement>;
             "cpsl-code-input": LocalJSX.CpslCodeInput & JSXBase.HTMLAttributes<HTMLCpslCodeInputElement>;
             "cpsl-col": LocalJSX.CpslCol & JSXBase.HTMLAttributes<HTMLCpslColElement>;
             "cpsl-divider": LocalJSX.CpslDivider & JSXBase.HTMLAttributes<HTMLCpslDividerElement>;
+            "cpsl-drawer": LocalJSX.CpslDrawer & JSXBase.HTMLAttributes<HTMLCpslDrawerElement>;
             "cpsl-dropdown": LocalJSX.CpslDropdown & JSXBase.HTMLAttributes<HTMLCpslDropdownElement>;
+            "cpsl-file-upload": LocalJSX.CpslFileUpload & JSXBase.HTMLAttributes<HTMLCpslFileUploadElement>;
             "cpsl-grid": LocalJSX.CpslGrid & JSXBase.HTMLAttributes<HTMLCpslGridElement>;
             "cpsl-icon": LocalJSX.CpslIcon & JSXBase.HTMLAttributes<HTMLCpslIconElement>;
             "cpsl-info-box": LocalJSX.CpslInfoBox & JSXBase.HTMLAttributes<HTMLCpslInfoBoxElement>;
             "cpsl-input": LocalJSX.CpslInput & JSXBase.HTMLAttributes<HTMLCpslInputElement>;
             "cpsl-modal": LocalJSX.CpslModal & JSXBase.HTMLAttributes<HTMLCpslModalElement>;
+            "cpsl-modal-v2": LocalJSX.CpslModalV2 & JSXBase.HTMLAttributes<HTMLCpslModalV2Element>;
+            "cpsl-nav-button-group": LocalJSX.CpslNavButtonGroup & JSXBase.HTMLAttributes<HTMLCpslNavButtonGroupElement>;
             "cpsl-overlay": LocalJSX.CpslOverlay & JSXBase.HTMLAttributes<HTMLCpslOverlayElement>;
+            "cpsl-pagination": LocalJSX.CpslPagination & JSXBase.HTMLAttributes<HTMLCpslPaginationElement>;
             "cpsl-pill": LocalJSX.CpslPill & JSXBase.HTMLAttributes<HTMLCpslPillElement>;
+            "cpsl-popover": LocalJSX.CpslPopover & JSXBase.HTMLAttributes<HTMLCpslPopoverElement>;
             "cpsl-progress-indicator": LocalJSX.CpslProgressIndicator & JSXBase.HTMLAttributes<HTMLCpslProgressIndicatorElement>;
             "cpsl-qr-code": LocalJSX.CpslQrCode & JSXBase.HTMLAttributes<HTMLCpslQrCodeElement>;
+            "cpsl-radio": LocalJSX.CpslRadio & JSXBase.HTMLAttributes<HTMLCpslRadioElement>;
             "cpsl-row": LocalJSX.CpslRow & JSXBase.HTMLAttributes<HTMLCpslRowElement>;
+            "cpsl-select": LocalJSX.CpslSelect & JSXBase.HTMLAttributes<HTMLCpslSelectElement>;
+            "cpsl-select-item": LocalJSX.CpslSelectItem & JSXBase.HTMLAttributes<HTMLCpslSelectItemElement>;
             "cpsl-slide-button": LocalJSX.CpslSlideButton & JSXBase.HTMLAttributes<HTMLCpslSlideButtonElement>;
             "cpsl-spinner": LocalJSX.CpslSpinner & JSXBase.HTMLAttributes<HTMLCpslSpinnerElement>;
+            "cpsl-switch": LocalJSX.CpslSwitch & JSXBase.HTMLAttributes<HTMLCpslSwitchElement>;
             "cpsl-tab": LocalJSX.CpslTab & JSXBase.HTMLAttributes<HTMLCpslTabElement>;
+            "cpsl-table": LocalJSX.CpslTable & JSXBase.HTMLAttributes<HTMLCpslTableElement>;
             "cpsl-tabs": LocalJSX.CpslTabs & JSXBase.HTMLAttributes<HTMLCpslTabsElement>;
             "cpsl-text": LocalJSX.CpslText & JSXBase.HTMLAttributes<HTMLCpslTextElement>;
             "cpsl-tile-button": LocalJSX.CpslTileButton & JSXBase.HTMLAttributes<HTMLCpslTileButtonElement>;