@saasbase-io/core-elements 1.0.0

package/dist/components/widgets/sb-user-profile/profile/location-info.d.ts

@@ -0,0 +1,25 @@
+import { LitElement, TemplateResult } from '../../../../../node_modules/lit';
+import { ICustomizations, IProfileWidgetCustomization, USER_PROFILE_WIDGETS_LAYOUT } from '../../../../types';
+export interface LocationInfo {
+    location: string;
+    zoneInfo: string;
+}
+export declare class SbLocationInfo extends LitElement {
+    locationInfo: LocationInfo;
+    customizations: ICustomizations | null;
+    showIcons: boolean;
+    layout: USER_PROFILE_WIDGETS_LAYOUT;
+    content: IProfileWidgetCustomization | null;
+    private isEditing;
+    private handleEdit;
+    private handleCancel;
+    private handleSave;
+    createRenderRoot(): this;
+    private getButtonStyles;
+    private getInputStyles;
+    private getLabelStyles;
+    private getContainerStyles;
+    private renderInput;
+    private renderFooter;
+    render(): TemplateResult<1>;
+}

package/dist/components/widgets/sb-user-profile/profile/personal-info.d.ts

@@ -0,0 +1,30 @@
+import { LitElement, TemplateResult } from '../../../../../node_modules/lit';
+import { ICustomizations, IProfileWidgetCustomization, USER_PROFILE_WIDGETS_LAYOUT } from '../../../../types';
+export interface PersonalInfo {
+    username: string;
+    first: string;
+    middle: string;
+    last: string;
+    nickname: string;
+    gender: string;
+    bio: string;
+}
+export declare class SbPersonalInfo extends LitElement {
+    personal: PersonalInfo;
+    customizations: ICustomizations | null;
+    showIcons: boolean;
+    layout: USER_PROFILE_WIDGETS_LAYOUT;
+    content: IProfileWidgetCustomization | null;
+    private isEditing;
+    private handleEdit;
+    private handleCancel;
+    private handleSave;
+    createRenderRoot(): this;
+    private getButtonStyles;
+    private getInputStyles;
+    private getLabelStyles;
+    private getContainerStyles;
+    private renderInput;
+    private renderFooter;
+    render(): TemplateResult<1>;
+}

package/dist/components/widgets/sb-user-profile/profile/profile.d.ts

@@ -0,0 +1,26 @@
+import { LitElement, TemplateResult } from '../../../../../node_modules/lit';
+import { Account } from './account-info';
+import { PersonalInfo } from './personal-info';
+import { LocationInfo } from './location-info';
+import { URLsInfo } from './urls-info';
+import { USER_PROFILE_WIDGETS_LAYOUT, USER_PROFILE_MODE, USER_PROFILE_ORIENTATION, USER_PROFILE_SIDEBAR_DISPLAY_TYPE, IProfileContentCustomizations, ICustomizations } from '../../../../types';
+export declare class Profile extends LitElement {
+    account: Account;
+    personal: PersonalInfo;
+    location: LocationInfo;
+    urls: URLsInfo;
+    showAvatarMenu: boolean;
+    customizations: ICustomizations | null;
+    showIcons: boolean;
+    modalIcon?: TemplateResult;
+    orientation: USER_PROFILE_ORIENTATION;
+    sidebarDisplayType: USER_PROFILE_SIDEBAR_DISPLAY_TYPE;
+    mode: USER_PROFILE_MODE;
+    widgetsLayout: USER_PROFILE_WIDGETS_LAYOUT;
+    toggleAvatarMenu: (e: Event) => void;
+    onAvatarChange: () => void;
+    onAvatarRemove: () => void;
+    content: IProfileContentCustomizations | null;
+    createRenderRoot(): this;
+    render(): TemplateResult<1>;
+}

package/dist/components/widgets/sb-user-profile/profile/urls-info.d.ts

@@ -0,0 +1,24 @@
+import { LitElement, TemplateResult } from '../../../../../node_modules/lit';
+import { ICustomizations, IProfileWidgetCustomization, USER_PROFILE_WIDGETS_LAYOUT } from '../../../../types';
+export interface URLsInfo {
+    website: string;
+}
+export declare class SbUrlsInfo extends LitElement {
+    URLsInfo: URLsInfo;
+    showIcons: boolean;
+    customizations: ICustomizations | null;
+    layout: USER_PROFILE_WIDGETS_LAYOUT;
+    content: IProfileWidgetCustomization | null;
+    private isEditing;
+    private handleEdit;
+    private handleCancel;
+    private handleSave;
+    createRenderRoot(): this;
+    private getButtonStyles;
+    private getInputStyles;
+    private getLabelStyles;
+    private getContainerStyles;
+    private renderInput;
+    private renderFooter;
+    render(): TemplateResult<1>;
+}

package/dist/components/widgets/sb-user-profile/sb-user-profile.d.ts

@@ -0,0 +1,39 @@
+import { LitElement, nothing } from '../../../../node_modules/lit';
+import { USER_PROFILE_MODE, USER_PROFILE_ORIENTATION, USER_PROFILE_SIDEBAR_DISPLAY_TYPE, USER_PROFILE_WIDGETS_LAYOUT, ICustomizations, IProfileContentCustomizations } from '../../../types';
+export declare class SbUserProfile extends LitElement {
+    showAvatarMenu: boolean;
+    orientation: USER_PROFILE_ORIENTATION;
+    mobileDisplay: USER_PROFILE_SIDEBAR_DISPLAY_TYPE;
+    mode: USER_PROFILE_MODE;
+    widgetsLayout: USER_PROFILE_WIDGETS_LAYOUT;
+    content: IProfileContentCustomizations | null;
+    customizations: ICustomizations | null;
+    providedCustomizations: ICustomizations | null;
+    private isOpen;
+    private currentBreakpoint;
+    private account;
+    private personal;
+    private location;
+    private urls;
+    private defaultTab;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected firstUpdated(): void;
+    private _handleResize;
+    private _updateBreakpoint;
+    private _handleClose;
+    private _toggleAvatarMenu;
+    private _handleAvatarChange;
+    private _handleAvatarRemove;
+    private _handleClickOutside;
+    private get effectiveCustomizations();
+    private get isModal();
+    private get sidebarDisplayType();
+    private get containerClasses();
+    private get contentClasses();
+    private renderCloseButton;
+    private renderWatermark;
+    private renderProfileContent;
+    render(): import('../../../../node_modules/lit-html').TemplateResult<1> | typeof nothing;
+    createRenderRoot(): this;
+}

package/dist/components/widgets/sb-user-profile/sidebar/classes.d.ts

@@ -0,0 +1,9 @@
+export declare const BASE_CLASSES = "!sb-bg-background";
+export declare const SIDEBAR_CONTAINER_CLASSES: {
+    vertical: string;
+    horizontal: string;
+};
+export declare const BURGER_BUTTON_CLASSES = "sb-p-2 sb-mb-4 sb-rounded-lg sb-border-muted sb-bg-background";
+export declare const BURGER_LABEL_CLASSES = "sb-font-medium sb-ml-2 -sb-mt-4 sb-text-[18px] sb-text-foreground";
+export declare const MOBILE_DRAWER_CLASSES = "mobile-sidebar-drawer sb-fixed sb-top-0 sb-left-0 sb-h-full sb-max-w-xs sb-bg-background sb-shadow-lg sb-z-[9999] sb-transform sb-transition-all sb-duration-300 sb-ease-in-out";
+export declare const MOBILE_OVERLAY_CLASSES = "mobile-sidebar-overlay sb-fixed sb-inset-0 sb-bg-black/50 sb-z-[9998] sb-transition-opacity sb-duration-300 sb-ease-in-out";

package/dist/components/widgets/sb-user-profile/sidebar/sidebar.d.ts

@@ -0,0 +1,22 @@
+import { LitElement, TemplateResult } from '../../../../../node_modules/lit';
+import { ICustomizations, USER_PROFILE_MODE, USER_PROFILE_ORIENTATION, USER_PROFILE_SIDEBAR_DISPLAY_TYPE } from '../../../../types';
+export interface SidebarConfig {
+    showIcons: boolean;
+    modalIcon?: TemplateResult;
+}
+export declare class SbProfileSidebar extends LitElement {
+    orientation: USER_PROFILE_ORIENTATION;
+    displayType: USER_PROFILE_SIDEBAR_DISPLAY_TYPE;
+    mode: USER_PROFILE_MODE;
+    config: SidebarConfig;
+    customizations: ICustomizations | null;
+    private isMenuOpen;
+    createRenderRoot(): this;
+    private toggleMenu;
+    private handleCloseProfile;
+    private renderTabs;
+    private renderWatermark;
+    private renderBurger;
+    private renderMobileDrawer;
+    render(): TemplateResult<1>;
+}

package/dist/components/wrappers/base-element/base-element.d.ts

@@ -0,0 +1,11 @@
+import { LitElement } from '../../../../node_modules/lit';
+export declare abstract class BaseElement extends LitElement {
+    shadow: boolean;
+    constructor();
+    protected getAttributesToExclude(): string[];
+    protected getFilteredAttributes(): Record<string, string>;
+    protected isCustomPropertySet(property: string): boolean;
+    protected applyCustomClass(variables: string[], selector: string, className?: string): void;
+    protected removeDuplicateContent(): void;
+    protected moveLightDomChildrenInto(target: HTMLElement, specificNodes?: Node[]): void;
+}

package/dist/components/wrappers/index.d.ts

@@ -0,0 +1,6 @@
+export * from './base-element/base-element';
+export * from './layout/layout';
+export * from './sb-provider/sb-provider';
+export * from './sb-signed-out/sb-signed-out';
+export * from './sb-signed-in/sb-signed-in';
+export * from './sb-authenticated/sb-authenticated';

package/dist/components/wrappers/layout/layout.d.ts

@@ -0,0 +1,56 @@
+import { LitElement } from '../../../../node_modules/lit';
+import { RenderSpec, UIElement, ICustomizations, Button, Style, Html, OTP } from '../../../types';
+export declare class SaasBaseLayout extends LitElement {
+    renderSpec: RenderSpec | null;
+    customizations: ICustomizations | null;
+    formData: Record<string, unknown>;
+    errors: Record<string, string[]>;
+    private _prevErrors;
+    loadingButtons: Record<string, boolean>;
+    eventEmitting: boolean;
+    theme: "light" | "dark";
+    private prevHeight;
+    private resizeRAF;
+    private isAnimating;
+    protected createRenderRoot(): HTMLElement | DocumentFragment;
+    private getTheme;
+    updated(changedProperties: Map<string, unknown>): void;
+    /**
+     * Identify which button has submit=true
+     */
+    private _findSubmitButton;
+    /**
+     * Wraps children of container such that the submit button receives type="submit"
+     */
+    private _wrapSubmitButtons;
+    render(): import('../../../../node_modules/lit-html').TemplateResult<1>;
+    private _onSubmit;
+    private _findButtonById;
+    private animateHeight;
+    private collectDataKeys;
+    handleInputChange(key: string, value: unknown): void;
+    handleBlur(key: string): void;
+    handleFocus(key: string, id?: string): void;
+    handleEvent(event: string, element: {
+        element_type: "button";
+        id: string;
+        properties: Button;
+        style: Style;
+        class: string;
+    } | {
+        element_type: "html";
+        id: string;
+        properties: Html;
+        style: Style;
+        class: string;
+    } | {
+        element_type: "otp";
+        id: string;
+        properties: OTP;
+        style: Style;
+        class: string;
+    }): Promise<void>;
+    findElementByKey(key: string): UIElement | null;
+    isFieldValid(key: string): boolean;
+    private validateRule;
+}

package/dist/components/wrappers/layout/validation.d.ts

@@ -0,0 +1,15 @@
+import { UIElement } from '../../../types';
+import { SaasBaseLayout } from './layout';
+export declare function collectDataKeys(element: UIElement): Record<string, unknown>;
+export declare function validateField(component: SaasBaseLayout, key: string, eventType: "change" | "blur" | "submit"): void;
+export declare function validateAll(component: SaasBaseLayout, eventType?: "change" | "blur" | "submit"): void;
+export declare function validateRequired(value: unknown, element?: UIElement): boolean;
+export declare function validateMinLength(value: unknown, length?: number): boolean;
+export declare function validateMaxLength(value: unknown, length?: number): boolean;
+export declare function validateMinValue(value: unknown, min?: number | string): boolean;
+export declare function validateMaxValue(value: unknown, max?: number | string): boolean;
+export declare function validateRegex(value: unknown, regex?: string): boolean;
+export declare function validateFieldMatch(value: unknown, fieldValue?: unknown): boolean;
+export declare function validateEmail(value: unknown): boolean;
+export declare function validatePhone(value: unknown): boolean;
+export declare function validateDate(value: unknown): boolean;

package/dist/components/wrappers/sb-authenticated/sb-authenticated.d.ts

@@ -0,0 +1,16 @@
+import { LitElement, nothing } from '../../../../node_modules/lit';
+import { AuthState } from '../../../context';
+import { EnvConfig } from '../../../types';
+export declare class SbAuthenticated extends LitElement {
+    private _cachedChildren;
+    createRenderRoot(): this;
+    connectedCallback(): void;
+    /**
+     * The URL to redirect to if the user is not authenticated.
+     * Defaults to environment variable, can be overridden via property.
+     */
+    redirectUrl: string;
+    env?: EnvConfig;
+    auth?: AuthState;
+    render(): import('../../../../node_modules/lit-html').TemplateResult<1> | typeof nothing;
+}

package/dist/components/wrappers/sb-provider/sb-provider.d.ts

@@ -0,0 +1,28 @@
+import { LitElement, PropertyValues } from '../../../../node_modules/lit';
+import { AuthState } from '../../../context';
+import { EnvConfig, ICustomizations, RenderSpec } from '../../../types';
+export declare class SbProvider extends LitElement {
+    createRenderRoot(): this;
+    /**
+     * Customizations
+     */
+    customizations: ICustomizations | null;
+    providedCustomizations: ICustomizations | null;
+    /**
+     * ENV now comes from a property instead of getEnvConfig()
+     */
+    env: EnvConfig | null;
+    /**
+     * Auth state
+     */
+    auth: AuthState;
+    renderSpec: RenderSpec | null;
+    /**
+     * Enable/disable automatic redirect for authenticated users on auth pages.
+     */
+    autoRedirect: boolean;
+    connectedCallback(): void;
+    updated(changedProperties: PropertyValues): void;
+    private handleAuthStateChange;
+    private refreshAuthState;
+}

package/dist/components/wrappers/sb-signed-in/sb-signed-in.d.ts

@@ -0,0 +1,9 @@
+import { LitElement, nothing } from '../../../../node_modules/lit';
+import { AuthState } from '../../../context';
+export declare class SignedIn extends LitElement {
+    private _cachedChildren;
+    createRenderRoot(): this;
+    connectedCallback(): void;
+    auth?: AuthState;
+    render(): import('../../../../node_modules/lit-html').TemplateResult<1> | typeof nothing;
+}

package/dist/components/wrappers/sb-signed-out/sb-signed-out.d.ts

@@ -0,0 +1,9 @@
+import { LitElement, nothing } from '../../../../node_modules/lit';
+import { AuthState } from '../../../context';
+export declare class SignedOut extends LitElement {
+    private _cachedChildren;
+    createRenderRoot(): this;
+    auth?: AuthState;
+    connectedCallback(): void;
+    render(): import('../../../../node_modules/lit-html').TemplateResult<1> | typeof nothing;
+}

package/dist/constants/classes.d.ts

@@ -0,0 +1,22 @@
+export declare const inputContainerDefaultClass = "sb-mb-4";
+export declare const checkboxRowDefaultClass = "sb-flex sb-items-center";
+export declare const errorDefaultClass = "sb-text-destructive sb-text-sm sb-mt-1 sb-error-anim";
+export declare const labelInputClass = "sb-font-medium sb-text-sm";
+export declare const labelCheckBoxClass = "sb-font-medium sb-text-sm sb-ml-2 sb-flex";
+export declare const hintDefaultClass = "sb-text-sm sb-text-gray-500 sb-mt-1";
+export declare const dividerDefaultClass = "sb-my-6";
+export declare const dividerLineDefaultClass = "sb-flex-grow sb-border-t";
+export declare const dividerTextDefaultClass = "sb-mx-4";
+export declare const watermarkDefaultClass = "";
+export declare const linearLoaderClass = "sb-relative sb-overflow-hidden sb-w-1/3 sb-h-2 sb-linear-bar";
+export declare const dashboardWidthClass = "sb-min-w-[375px] sb-max-w-[609px] sb-w-[calc(100%-30px)] sm:sb-max-w-[735px] md:sb-w-[calc(100%-32px)] md:sb-max-w-[800px] lg:sb-min-w-[800px]";
+export declare const modalWidthClass = "sb-h-[100%] sb-min-w-[375px] sb-max-w-[609px] sb-w-[calc(100vw-30px)] sm:sb-max-w-[735px] md:sb-w-[calc(100vw-32px)] md:sb-max-w-[800px] lg:sb-min-w-[800px]";
+export declare const modalContainerClass = "sb-fixed sb-inset-0 sb-z-[9999] sb-flex sb-items-center sb-justify-center sb-p-4 sb-overflow-auto";
+export declare const modalLayoutClass = "sb-w-fit sb-flex sb-max-h-[calc(100vh-60px)] sb-bg-background sb-shadow-2xl sb-ring-1 sb-ring-border sb-rounded-xl sb-overflow-hidden";
+export declare const dashboardClass = "sb-justify-self-center sb-rotate-0";
+export declare const pageClasses = "sb-border-0 sb-bg-background !sb-m-0";
+export declare const modalClasses = "sb-border sb-rounded-2xl sb-relative sb-py-6";
+export declare const tabTriggerClass = "!sb-text-left sb-text-foreground sb-font-normal hover:!sb-bg-muted !sb-text-sm sb-rounded-md !sb-shadow-none data-[state=active]:!sb-bg-muted";
+export declare const horizontalTabClass = "!sb-flex !sb-justify-start !sb-flex-nowrap !sb-w-full !rtg-grid-cols-2 !sb-gap-2 sb-mx-6";
+export declare const verticalTabClass = "!sb-w-[160px] sb-gap-4 ";
+export declare const tailwindSafeClasses = "sb-w-screen sm:sb-w-[375px] sb-p-[40px_24px] sm:sb-shadow-[0_4px_4px_rgba(0,0,0,0.25)] sb-bg-background sm:sb-border sm:sb-border-border sm:sb-rounded-[8px] font-geist";

package/dist/constants/enums.d.ts

@@ -0,0 +1,16 @@
+export declare enum ELEMENT_IDS {
+    USER_PROFILE_CARD_HEADER_CONTAINER = "sb-user-profile-card-header-container",
+    USER_PROFILE_CONTAINER = "sb-user-profile",
+    USER_PROFILE_SIDEBAR = "sb-user-profile-sidebar-tabs",
+    USER_PROFILE_SIDEBAR_TABS = "sb-user-profile-sidebar-tabs",
+    USER_PROFILE_SIDEBAR_BURGER_MENU = "sb-user-profile-sidebar-burger-menu",
+    USER_PROFILE_INPUT_LABEL = "sb-user-profile-input-label",
+    USER_PROFILE_INPUT_FIELD = "sb-user-profile-input-field",
+    USER_PROFILE_EDIT_FORM = "sb-user-profile-edit-form",
+    USER_PROFILE_CARD_CONTAINER = "sb-user-profile-card-container",
+    USER_PROFILE_EDITABLE_INPUT_FIELD = "sb-user-profile-editable-input-field",
+    USER_PROFILE_DEFAULT_BUTTON = "sb-user-profile-default-button",
+    USER_PROFILE_OUTLINE_BUTTON = "sb-user-profile-outline-button",
+    USER_PROFILE_OTP = "sb-user-profile-otp",
+    USER_PROFILE_EDIT_BUTTON = "sb-user-profile-edit-button"
+}

package/dist/constants/index.d.ts

@@ -0,0 +1,4 @@
+export * from './classes';
+export * from './enums';
+export * from './styles';
+export * from './regex';

package/dist/constants/regex.d.ts

@@ -0,0 +1,4 @@
+export declare const PHONE_REGEX: RegExp;
+export declare const EMAIL_REGEX: RegExp;
+export declare const DATE_REGEX: RegExp;
+export declare const DATETIME_REGEX: RegExp;

package/dist/constants/styles.d.ts

@@ -0,0 +1,2 @@
+import { Breakpoints } from '../types';
+export declare const BREAKPOINTS: Record<Breakpoints, string>;

package/dist/context/auth-context.d.ts

@@ -0,0 +1,6 @@
+export interface AuthState {
+    isAuthenticated: boolean;
+}
+export declare const authContext: {
+    __context__: AuthState;
+};

package/dist/context/customization-context.d.ts

@@ -0,0 +1,4 @@
+import { ICustomizations } from '../types';
+export declare const customizationsContext: {
+    __context__: ICustomizations | null;
+};

package/dist/context/env-context.d.ts

@@ -0,0 +1,4 @@
+import { EnvConfig } from '../types';
+export declare const envContext: {
+    __context__: EnvConfig | null;
+};

package/dist/context/index.d.ts

@@ -0,0 +1,4 @@
+export * from './env-context';
+export * from './auth-context';
+export * from './customization-context';
+export * from './render-spec';

package/dist/context/render-spec.d.ts

@@ -0,0 +1,4 @@
+import { RenderSpec } from '../types';
+export declare const renderSpecContext: {
+    __context__: RenderSpec | null;
+};

package/dist/funcs/env.d.ts

@@ -0,0 +1,3 @@
+import { EnvConfig } from '../types';
+export declare function initSdk(config: EnvConfig): void;
+export declare function getEnvConfig(): EnvConfig;

package/dist/funcs/index.d.ts

@@ -0,0 +1 @@
+export * from './env';

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export * from './components/wrappers';
+export * from './components/widgets';
+export * from './components/ui';
+export * from './components/renderers';
+export declare function useAuthProvider(): import('@saasbase-io/loginflow-websdk').AuthService;