@saasbase-io/core-elements 1.4.0 → 1.5.0

package/dist/components/renderers/_updated/index.d.ts

@@ -1,4 +1,5 @@
 export * from './form';
+export * from './passkey-button';
 export * from './provider';
 export * from './sb-error';
 export * from './sb-gap';

package/dist/components/renderers/_updated/passkey-button/_passkey-button.d.ts

@@ -0,0 +1,112 @@
+import { LitElement } from '../../../../../node_modules/lit';
+import { PasskeyButtonProps, PasskeyButtonSize, PasskeyButtonSpinnerAlign, PasskeyButtonVariant } from './passkey-button.types';
+/**
+ * A button for passkey authentication.
+ * @element sb-passkey-button
+ *
+ * @part passkey-button (rtg-button)
+ * @part passkey-button-spinner (rtg-spinner): loading indicator
+ *
+ * @fires sb-passkey-button:click { id, event }
+ */
+export declare class SbPasskeyButton extends LitElement implements PasskeyButtonProps {
+    private static readonly _ROOT;
+    private static readonly _SPINNER;
+    /**
+     * The stable CSS part names exposed for external targeting.
+     */
+    static get parts(): {
+        root: string;
+        spinner: string;
+    };
+    /**
+     * The name of the custom event fired on click.
+     */
+    static get clickEventName(): string;
+    /**
+     * A unique value used as a substring in the generated part/child IDs, when
+     * the `child-id` prop is not provided.
+     */
+    seed: string;
+    /**
+     * The `id` value given to the root child/part and used as the base of other
+     * child/part IDs.
+     */
+    childId?: string;
+    /**
+     * The visual variant of the button.
+     */
+    variant: PasskeyButtonVariant;
+    /**
+     * The size of the button.
+     */
+    size: PasskeyButtonSize;
+    /**
+     * The text used as the button label.
+     */
+    label: string;
+    /**
+     * Whether the loading spinner should be rendered before or after the label.
+     */
+    spinnerAlign: PasskeyButtonSpinnerAlign;
+    /**
+     * When provided, the button reflects a disabled state.
+     */
+    disabled?: boolean;
+    /**
+     * When provided, a loading state is applied.
+     */
+    loading?: boolean;
+    /**
+     * The event identifier/name as defined in auth service.
+     */
+    event?: string;
+    /**
+     * Whether the button is in a loading state.
+     */
+    private _loading;
+    /**
+     * Overrides default behavior to render into light DOM.
+     */
+    protected createRenderRoot(): this;
+    /**
+     * The `id` of the root element. Equal to `childId` when provided, otherwise
+     * derived from the component's part name and `seed`.
+     */
+    get rootId(): string;
+    /**
+     * The `id` of the spinner element, derived from `rootId` with the spinner
+     * part name appended.
+     */
+    get spinnerId(): string;
+    /**
+     * The loading state, derived from the private `_loading` and `loading` prop.
+     */
+    get isLoading(): boolean | undefined;
+    /**
+     * Adds the click event listener.
+     */
+    connectedCallback(): void;
+    /**
+     * Removes the click event listener.
+     */
+    disconnectedCallback(): void;
+    /**
+     * Defines and dispatches the click event.
+     */
+    private _dispatchClick;
+    /**
+     * Emits the provided `event` to the auth service to process.
+     */
+    private _emitClickEvent;
+    /**
+     * Handles the click event, preventing execution when disabled/loading, firing
+     * the click event, and emitting to auth service.
+     */
+    private _handleClick;
+    /**
+     * Returns the loading spinner template.
+     */
+    private _renderSpinner;
+    render(): import('../../../../../node_modules/lit-html').TemplateResult<1>;
+}

package/dist/components/renderers/_updated/passkey-button/index.d.ts

@@ -0,0 +1,7 @@
+import { SbPasskeyButton } from './_passkey-button';
+export { SbPasskeyButton };
+declare global {
+    interface HTMLElementTagNameMap {
+        "sb-passkey-button": SbPasskeyButton;
+    }
+}

package/dist/components/renderers/_updated/passkey-button/passkey-button.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, StoryObj } from '@storybook/web-components-vite';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Basic: Story;
+export declare const Variant: Story;
+export declare const Size: Story;
+export declare const Label: Story;
+export declare const Disabled: Story;
+export declare const Loading: Story;
+export declare const SpinnerAlign: Story;

package/dist/components/renderers/_updated/passkey-button/passkey-button.types.d.ts

@@ -0,0 +1,15 @@
+import { IconAlign, RtgButtonBasicSize, RtgButtonBasicVariant } from '../../../../types';
+export type PasskeyButtonVariant = RtgButtonBasicVariant;
+export type PasskeyButtonSize = RtgButtonBasicSize;
+export type PasskeyButtonSpinnerAlign = IconAlign;
+export type PasskeyButtonProps = {
+    seed: string;
+    childId?: string;
+    variant: PasskeyButtonVariant;
+    size: PasskeyButtonSize;
+    label: string;
+    spinnerAlign: PasskeyButtonSpinnerAlign;
+    disabled?: boolean;
+    loading?: boolean;
+    event?: string;
+};