@usecapsule/core-components 3.3.0-dev.0 → 3.3.0-dev.2

package/dist/types/assets/icons/index.d.ts

@@ -4,11 +4,9 @@ export declare const Icons: {
     angelList: string;
     appleBrand: string;
     apple: string;
-    arrowCircleBrokenDownLeft: string;
     arrowNarrow: string;
     arrow: string;
     backupKit: string;
-    bank: string;
     brush: string;
     capsuleLogo: string;
     capsuleRingsDark: string;
@@ -22,15 +20,12 @@ export declare const Icons: {
     clubhouseBrand: string;
     clubhouse: string;
     copy: string;
-    creditCard: string;
     cube: string;
     decentBrand: string;
     decent: string;
     discordBrand: string;
     discord: string;
-    dot: string;
     downloadCloud: string;
-    download: string;
     dribbbleBrand: string;
     dribbble: string;
     earth: string;
@@ -45,15 +40,10 @@ export declare const Icons: {
     file: string;
     githubBrand: string;
     github: string;
-    globe: string;
     googleBrand: string;
     google: string;
     helpCircle: string;
-    heroAlertCircle: string;
-    heroCheckmarkCapsule: string;
-    heroCheckmark: string;
     heroEmail: string;
-    heroExternalConnection: string;
     heroLock: string;
     heroPasskey: string;
     heroPhone: string;
@@ -66,36 +56,26 @@ export declare const Icons: {
     key: string;
     lightning01: string;
     lightning: string;
-    linkExternal: string;
     linkedinBrand: string;
     linkedin: string;
-    logOut: string;
     mail: string;
     menu: string;
-    moonpayBrand: string;
     moreLoginOptions: string;
     phone: string;
     pintrestBrand: string;
     pintrest: string;
     plusCircle: string;
-    puzzlePiece: string;
-    qrCode02: string;
-    qrCode: string;
     rampNetworkBrand: string;
     rampNetwork: string;
     redditBrand: string;
     reddit: string;
     refresh: string;
-    search: string;
-    send: string;
     settings: string;
-    shield: string;
     signalBrand: string;
     signal: string;
     snapchatBrand: string;
     snapchat: string;
     stars: string;
-    stripeBrand: string;
     telegramBrand: string;
     telegram: string;
     tikTokBrand: string;

package/dist/types/components/cpsl-button/cpsl-button.d.ts

@@ -31,9 +31,9 @@ export declare class CpslButton {
     target?: string;
     /**
      * The variant of the button.
-     * Options are: `"primary"`, `"secondary", `"tertiary", `"ghost"`, `"destructive"`.
+     * Options are: `"primary"`, `"secondary", `"icon", `"text"`.
      * Default is: `"primary"`.
      */
-    variant?: 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'destructive';
+    variant?: 'primary' | 'secondary' | 'ghost' | 'destructive';
     render(): any;
 }

package/dist/types/components/cpsl-hero/cpsl-hero.d.ts

@@ -1,26 +1,11 @@
 export declare class CpslHero {
-    /**
-     * The height of the container.
-     * Default is: 180.
-     */
-    height?: number;
-    /**
-     * Hides the fade out components
-     * Default is: `false`.
-     */
-    hideFadeOut?: boolean;
     /**
      * The variant of the button.
-     * Options are: `"customContent"`, `"connection"`, `"externalWalletConnection"`, `"pending", `"approved", `"failed".
-     * Default is: `"connection"`.
+     * Options are: `"default"`, `"loading", `"success".
+     * Default is: `"default"`.
      */
-    variant?: 'customContent' | 'connection' | 'externalWalletConnection' | 'pending' | 'approved' | 'failed';
+    variant?: 'connection' | 'pending' | 'approved' | 'failed';
     title: string;
     subtitle?: string;
-    /**
-     * Whether to use the Capsule custom theming or use the provided theme
-     * Default is: `false`.
-     */
-    withDefaultTheme?: boolean;
     render(): any;
 }

package/dist/types/components/cpsl-input/cpsl-input.d.ts

@@ -1,8 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { AutocompleteTypes, IconType, TextFieldTypes } from '../../interface';
 import { InputChangeEventDetail, InputInputEventDetail } from './input-interface';
-import InputMask from 'imask/esm/controls/input';
-import 'imask/esm/masked/pattern';
 export declare class CpslInput {
     private nativeInput?;
     el: HTMLCpslInputElement;
@@ -12,7 +10,6 @@ export declare class CpslInput {
      */
     private focusedValue?;
     hasFocus: boolean;
-    maskedInput?: InputMask;
     /**
      * Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.
      * Available options: `"off"`, `"none"`, `"on"`, `"sentences"`, `"words"`, `"characters"`.
@@ -40,10 +37,6 @@ export declare class CpslInput {
      * If `true`, the user cannot interact with the input.
      */
     disabled: boolean;
-    /**
-     * If `true`, the input primary color will use the contrast value, not the primary text value.
-     */
-    contrastText: boolean;
     /**
      * A hint to the browser for which enter key to display.
      * Possible values: `"enter"`, `"done"`, `"go"`, `"next"`,
@@ -54,10 +47,6 @@ export declare class CpslInput {
      * Error text to show below the input. If this is provided the input will enter an error state.
      */
     errorText?: string;
-    /**
-     * Mask string to apply to the input.
-     */
-    mask?: string;
     /**
      * Helper text to show below the input. If `"errorText"` is provided that will take precedence.
      */
@@ -178,8 +167,9 @@ export declare class CpslInput {
      */
     cpslPaste: EventEmitter<ClipboardEvent>;
     handleDisable(): void;
-    handleSetupMask(): void;
-    handleValueChange(): void;
+    /**
+     * Update the native input element when the value changes
+     */
     componentDidLoad(): void;
     private disableSlots;
     private enableSlots;

package/dist/types/components/{cpsl-auth-modal/cpsl-auth-modal.d.ts → cpsl-modal/cpsl-modal.d.ts}

@@ -1,9 +1,10 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export declare class CpslAuthModal {
+export declare class CpslModal {
+    private draggable;
+    private expandFooterTl;
     private hasAnimatedIn;
-    el: HTMLCpslAuthModalElement;
+    el: HTMLCpslModalElement;
     hasFooter: boolean;
-    isMobile: boolean;
     /**
      * Duration in seconds of the modal entering.
      * Default is .15.
@@ -14,6 +15,15 @@ export declare class CpslAuthModal {
      * Default is .15.
      */
     exitTransitionDuration?: number;
+    /**
+     * Whether or not to show `footerExpandedFooter` and `footerExpandedHeader` slots.
+     */
+    footerExpanded?: boolean;
+    /**
+     * Duration in seconds of the footer expansion animation.
+     * Default is 0.15.
+     */
+    footerTransitionDuration?: number;
     /**
      * Whether or not to show the overlay. This will always show the modal, regardless of the value of `open`.
      */
@@ -46,13 +56,23 @@ export declare class CpslAuthModal {
      * Override z-index.
      */
     zIndexOverride?: number;
+    toggleHeight(): void;
     toggleModal(): void;
     componentDidLoad(): void;
     private handleAnimation;
+    private addExpandAnim;
+    private getDraggableHeight;
+    private initDraggable;
     private get footerEl();
+    private get footerExpandedEl();
+    private get headerExpandedEl();
+    private get innerContainerEl();
+    private get contentEl();
     private get modalWrapperEl();
     private get modalContainerEl();
+    private get overlayEl();
     private get footerSlotEl();
+    private get headerEl();
     private get Modal();
     render(): any;
 }

package/dist/types/components/cpsl-popover/cpsl-popover.d.ts

@@ -65,11 +65,11 @@ export declare class CpslPopover {
     /**
      * Emitted when the popover opens.
      */
-    cpslOpen: EventEmitter<void>;
+    cpslOpen: EventEmitter;
     /**
      * Emitted when the popover closes.
      */
-    cpslClose: EventEmitter<void>;
+    cpslClose: EventEmitter;
     /**
      * Call to close the popover manually.
      */

package/dist/types/components/cpsl-qr-code/cpsl-qr-code.d.ts

@@ -14,6 +14,5 @@ export declare class CpslQrCode {
      */
     size?: number;
     componentDidLoad(): void;
-    private get imgEl();
     render(): any;
 }

package/dist/types/components/cpsl-select/cpsl-select.d.ts

@@ -3,19 +3,10 @@ export declare class CpslSelect {
     el: HTMLCpslSelectElement;
     private popoverEl;
     private inputId;
-    anchorEl: HTMLElement;
+    anchorEl: HTMLDivElement;
     hasFocus: boolean;
     popoverOpen: boolean;
     hasSelectedItem: boolean;
-    /**
-     * ID of element to anchor popover to.
-     */
-    anchorElId?: string;
-    /**
-     * If `true` the popover container will use the width of the content, else it will be set to the width of the trigger.
-     * Default is `false`
-     */
-    autoWidth?: boolean;
     /**
      * If `true`, the user cannot interact with the input.
      */
@@ -64,14 +55,6 @@ export declare class CpslSelect {
      * If `true`, the label will display an "optional" tag.
      */
     showOptionalLabel: boolean;
-    /**
-     * If `true`, the dropdown will contain a search field.
-     */
-    showSearch: boolean;
-    /**
-     * Placeholder for the search field.
-     */
-    searchPlaceholder?: string;
     /**
      * Emitted when the input loses focus.
      */
@@ -84,10 +67,6 @@ export declare class CpslSelect {
      * Emitted when the value changes.
      */
     cpslSelectValueChange: EventEmitter<string>;
-    /**
-     * Emitted when the search value changes.
-     */
-    cpslSearchChange: EventEmitter<string>;
     onValueChange(): void;
     handleValueChange(): void;
     selectItemClickHandler(event: CustomEvent<string>): void;

package/dist/types/components/cpsl-text/cpsl-text.d.ts

@@ -4,7 +4,7 @@ export declare class CpslText {
      * Options are: `"primary"`, `"secondary", `"tertiary", `"subtle", `"inverted", `"error".
      * Default is: `"primary"`.
      */
-    color?: 'primary' | 'secondary' | 'tertiary' | 'subtle' | 'inverted' | 'error' | 'contrast';
+    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".