@api-client/ui 0.5.58 → 0.6.0

package/build/src/elements/setup/internals/InvitationScreen.js

@@ -0,0 +1,466 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { html, LitElement, nothing } from 'lit';
+import { property } from 'lit/decorators.js';
+import { consume } from '@lit/context';
+import { classMap } from 'lit/directives/class-map.js';
+import { github, google, linkedin } from './icons.js';
+import { organizationContext } from '../../../providers/organization.js';
+export var State;
+(function (State) {
+    /**
+     * The initial state (default).
+     *
+     * Next possible states:
+     * - `Initialized`
+     * - `Error`
+     */
+    State["Initializing"] = "initializing";
+    /**
+     * The state when an error occurred.
+     * In this state, set the `errors` property to show error details.
+     * There are no next possible states from here, the parent app has to reset the flow.
+     */
+    State["Error"] = "error";
+    /**
+     * State after the app initialization is complete.
+     * It means that the app has read all necessary config but has not yet fetched invitation data.
+     *
+     * Next possible states:
+     * - `ReadingStatus`
+     */
+    State["Initialized"] = "initialized";
+    /**
+     * The state when the application is fetching invitation data.
+     * The component renders the loading indicator in this state.
+     *
+     * Next possible states:
+     * - `Login`
+     * - `Error`
+     */
+    State["ReadingStatus"] = "reading-status";
+    /**
+     * The main interaction state where the user can choose to log in (accept) or decline.
+     *
+     * Next possible states:
+     * - `Rejecting`
+     * - `InvitationAccepted`
+     * - `InvitationDeclined`
+     * - `Error`
+     */
+    State["Login"] = "login";
+    /**
+     * The state when the rejection request is being processed.
+     *
+     * Next possible states:
+     * - `Rejected`
+     * - `Error`
+     */
+    State["Rejecting"] = "rejecting";
+    /**
+     * The state when the invitation has been rejected by the user in the current session.
+     *
+     * There are no next possible states from here, the parent app has to reset the flow.
+     */
+    State["Rejected"] = "rejected";
+    /**
+     * The state when the invitation has been successfully accepted.
+     * This state can be set after reading the invitation status that was already accepted previously.
+     *
+     * There are no next possible states from here, the parent app has to reset the flow.
+     */
+    State["InvitationAccepted"] = "invitation-accepted";
+    /**
+     * The state when the invitation is found to be deleted or invalid.
+     *
+     * There are no next possible states from here, the parent app has to reset the flow.
+     */
+    State["InvitationDeleted"] = "invitation-deleted";
+    /**
+     * The state when the invitation was already declined previously.
+     *
+     * There are no next possible states from here, the parent app has to reset the flow.
+     */
+    State["InvitationDeclined"] = "invitation-declined";
+    /**
+     * The state when the invitation has expired.
+     *
+     * There are no next possible states from here, the parent app has to reset the flow.
+     */
+    State["InvitationExpired"] = "invitation-expired";
+})(State || (State = {}));
+let InvitationScreen = (() => {
+    let _classSuper = LitElement;
+    let _state_decorators;
+    let _state_initializers = [];
+    let _state_extraInitializers = [];
+    let _google_decorators;
+    let _google_initializers = [];
+    let _google_extraInitializers = [];
+    let _linkedin_decorators;
+    let _linkedin_initializers = [];
+    let _linkedin_extraInitializers = [];
+    let _github_decorators;
+    let _github_initializers = [];
+    let _github_extraInitializers = [];
+    let _errors_decorators;
+    let _errors_initializers = [];
+    let _errors_extraInitializers = [];
+    let _invitation_decorators;
+    let _invitation_initializers = [];
+    let _invitation_extraInitializers = [];
+    let _organization_decorators;
+    let _organization_initializers = [];
+    let _organization_extraInitializers = [];
+    return class InvitationScreen extends _classSuper {
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _state_decorators = [property({ type: String })];
+            _google_decorators = [property({ type: Boolean })];
+            _linkedin_decorators = [property({ type: Boolean })];
+            _github_decorators = [property({ type: Boolean })];
+            _errors_decorators = [property({ type: Array })];
+            _invitation_decorators = [property({ type: Object })];
+            _organization_decorators = [property({ type: Object, attribute: false }), consume({ context: organizationContext })];
+            __esDecorate(this, null, _state_decorators, { kind: "accessor", name: "state", static: false, private: false, access: { has: obj => "state" in obj, get: obj => obj.state, set: (obj, value) => { obj.state = value; } }, metadata: _metadata }, _state_initializers, _state_extraInitializers);
+            __esDecorate(this, null, _google_decorators, { kind: "accessor", name: "google", static: false, private: false, access: { has: obj => "google" in obj, get: obj => obj.google, set: (obj, value) => { obj.google = value; } }, metadata: _metadata }, _google_initializers, _google_extraInitializers);
+            __esDecorate(this, null, _linkedin_decorators, { kind: "accessor", name: "linkedin", static: false, private: false, access: { has: obj => "linkedin" in obj, get: obj => obj.linkedin, set: (obj, value) => { obj.linkedin = value; } }, metadata: _metadata }, _linkedin_initializers, _linkedin_extraInitializers);
+            __esDecorate(this, null, _github_decorators, { kind: "accessor", name: "github", static: false, private: false, access: { has: obj => "github" in obj, get: obj => obj.github, set: (obj, value) => { obj.github = value; } }, metadata: _metadata }, _github_initializers, _github_extraInitializers);
+            __esDecorate(this, null, _errors_decorators, { kind: "accessor", name: "errors", static: false, private: false, access: { has: obj => "errors" in obj, get: obj => obj.errors, set: (obj, value) => { obj.errors = value; } }, metadata: _metadata }, _errors_initializers, _errors_extraInitializers);
+            __esDecorate(this, null, _invitation_decorators, { kind: "accessor", name: "invitation", static: false, private: false, access: { has: obj => "invitation" in obj, get: obj => obj.invitation, set: (obj, value) => { obj.invitation = value; } }, metadata: _metadata }, _invitation_initializers, _invitation_extraInitializers);
+            __esDecorate(this, null, _organization_decorators, { kind: "accessor", name: "organization", static: false, private: false, access: { has: obj => "organization" in obj, get: obj => obj.organization, set: (obj, value) => { obj.organization = value; } }, metadata: _metadata }, _organization_initializers, _organization_extraInitializers);
+            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        #state_accessor_storage = __runInitializers(this, _state_initializers, State.Initializing
+        /**
+         * When set it renders the Google login button. Disabled by default.
+         * @attribute
+         */
+        );
+        /**
+         * This is the main state definition that controls what is rendered on the screen.
+         * It can be one of the `State` enum values.
+         *
+         * @attribute
+         */
+        get state() { return this.#state_accessor_storage; }
+        set state(value) { this.#state_accessor_storage = value; }
+        #google_accessor_storage = (__runInitializers(this, _state_extraInitializers), __runInitializers(this, _google_initializers, false
+        /**
+         * When set it renders the LinkedIn login button. Disabled by default.
+         * @attribute
+         */
+        ));
+        /**
+         * When set it renders the Google login button. Disabled by default.
+         * @attribute
+         */
+        get google() { return this.#google_accessor_storage; }
+        set google(value) { this.#google_accessor_storage = value; }
+        #linkedin_accessor_storage = (__runInitializers(this, _google_extraInitializers), __runInitializers(this, _linkedin_initializers, false
+        /**
+         * When set it renders the GitHub login button. Disabled by default.
+         * @attribute
+         */
+        ));
+        /**
+         * When set it renders the LinkedIn login button. Disabled by default.
+         * @attribute
+         */
+        get linkedin() { return this.#linkedin_accessor_storage; }
+        set linkedin(value) { this.#linkedin_accessor_storage = value; }
+        #github_accessor_storage = (__runInitializers(this, _linkedin_extraInitializers), __runInitializers(this, _github_initializers, false
+        /**
+         * The list of errors to display.
+         */
+        ));
+        /**
+         * When set it renders the GitHub login button. Disabled by default.
+         * @attribute
+         */
+        get github() { return this.#github_accessor_storage; }
+        set github(value) { this.#github_accessor_storage = value; }
+        #errors_accessor_storage = (__runInitializers(this, _github_extraInitializers), __runInitializers(this, _errors_initializers, void 0));
+        /**
+         * The list of errors to display.
+         */
+        get errors() { return this.#errors_accessor_storage; }
+        set errors(value) { this.#errors_accessor_storage = value; }
+        #invitation_accessor_storage = (__runInitializers(this, _errors_extraInitializers), __runInitializers(this, _invitation_initializers, void 0));
+        /**
+         * The invitation details retreived from the backend.
+         * This property must be set for the component to function correctly.
+         */
+        get invitation() { return this.#invitation_accessor_storage; }
+        set invitation(value) { this.#invitation_accessor_storage = value; }
+        #organization_accessor_storage = (__runInitializers(this, _invitation_extraInitializers), __runInitializers(this, _organization_initializers, void 0));
+        /**
+         * The fetched organization details for which the invitation is valid.
+         *
+         * This property consumes the `organizationContext`.
+         */
+        get organization() { return this.#organization_accessor_storage; }
+        set organization(value) { this.#organization_accessor_storage = value; }
+        /**
+         * Dispatches the authentication event for the selected provider.
+         *
+         * @param provider The authentication provider to use.
+         */
+        dispatchAuth(provider) {
+            this.dispatchEvent(new CustomEvent('authenticate', {
+                detail: { provider },
+                bubbles: false,
+                composed: false,
+            }));
+        }
+        authenticateGoogle() {
+            this.dispatchAuth('google');
+        }
+        authenticateGithub() {
+            this.dispatchAuth('github');
+        }
+        authenticateLinkedin() {
+            this.dispatchAuth('linkedin');
+        }
+        /**
+         * Handles the click on the "Open organization" button after accepting the invitation.
+         */
+        handleAcceptedOpen() {
+            this.dispatchEvent(new CustomEvent('open', {
+                bubbles: false,
+                composed: false,
+            }));
+        }
+        /**
+         * Handles the click on the "Decline" button to reject the invitation.
+         */
+        handleReject() {
+            this.dispatchEvent(new CustomEvent('reject', {
+                bubbles: false,
+                composed: false,
+            }));
+        }
+        render() {
+            const classes = {
+                'slide': true,
+                'login-slide': true,
+                'error': [
+                    State.Error,
+                    State.InvitationDeclined,
+                    State.InvitationDeleted,
+                    State.InvitationDeclined,
+                    State.InvitationExpired,
+                ].includes(this.state),
+            };
+            return html `
+      <div class="content">
+        <div class="${classMap(classes)}">${this.renderPage()}</div>
+      </div>
+    `;
+        }
+        renderPage() {
+            switch (this.state) {
+                case State.Initializing:
+                    return this.renderCheckingUser();
+                case State.Error:
+                    return this.renderError();
+                case State.Initialized:
+                    // This is only an intermediate state before fetching data
+                    return this.renderCheckingUser();
+                case State.ReadingStatus:
+                    return this.renderCheckingUser();
+                case State.Login:
+                    return html `${this.renderInto()} ${this.renderLoginForm()}`;
+                case State.Rejecting:
+                    return this.renderRejecting();
+                case State.Rejected:
+                    return this.renderRejected();
+                case State.InvitationAccepted:
+                    return this.renderInvitationAccepted();
+                case State.InvitationDeclined:
+                    return this.renderInvitationDeclined();
+                case State.InvitationDeleted:
+                    return this.renderInvitationDeleted();
+                case State.InvitationExpired:
+                    return this.renderInvitationExpired();
+                default:
+                    return html `<p>Unknown state.</p>`;
+            }
+        }
+        renderCheckingUser() {
+            return html `<div class="login">
+      <p class="body-large">Loading...</p>
+      <ui-progress indeterminate class="login-progress"></ui-progress>
+    </div>`;
+        }
+        renderInto() {
+            const { invitation } = this;
+            const name = invitation?.name;
+            return html ` <div class="intro">
+      <h1 class="display-small">${name ? html `Hi ${name}` : 'Welcome to API Now!'}</h1>
+      <p class="body-large">You've been invited to join an organization.</p>
+    </div>`;
+        }
+        renderLoginForm() {
+            return html `
+      <div class="login">
+        <p class="body-large">To respond to the invitation, please log in.</p>
+        <div class="login-option">${this.renderGoogleButton()}</div>
+        <div class="login-option">${this.renderGithubButton()}</div>
+        <div class="login-option">${this.renderLinkedinButton()}</div>
+        <div class="login-option">
+          <ui-button class="decline" color="text" @click="${this.handleReject}">Decline invitation</ui-button>
+        </div>
+      </div>
+    `;
+        }
+        renderRejecting() {
+            return html `<div class="login">
+      <h1 class="display-medium">Thank you for responding</h1>
+      <p class="body-large">We will let them know you were not the intended recipient.</p>
+      <ui-progress indeterminate class="login-progress"></ui-progress>
+    </div>`;
+        }
+        renderRejected() {
+            return html `<div class="login">
+      <h1 class="display-medium">Thank you for responding</h1>
+      <p class="body-large">We've let them know you were not the intended recipient.</p>
+    </div>`;
+        }
+        renderError() {
+            const { errors = [] } = this;
+            return html `<div class="login">
+      <h1 class="display-medium">Responding error</h1>
+      <p class="body-large">An error occurred while processing your request.</p>
+      <ul>
+        ${errors.map((error) => html `<li>${error}</li>`)}
+      </ul>
+    </div>`;
+        }
+        renderInvitationAccepted() {
+            return html `<div class="login">
+      <h1 class="display-medium">Invitation accepted</h1>
+      <p class="body-large">You have successfully accepted the invitation.</p>
+      <ui-button class="open" color="filled" @click="${this.handleAcceptedOpen}">Open organization</ui-button>
+    </div>`;
+        }
+        renderInvitationDeclined() {
+            const { invitation } = this;
+            const time = invitation?.respondedAt;
+            let info;
+            if (time) {
+                const d = new Date(time);
+                info = html `<p class="body-large">
+        You declined the invitation <relative-time datetime="${d.toISOString()}">${d.toLocaleString()}</relative-time>.
+      </p>`;
+            }
+            else {
+                info = html `<p class="body-large">You have declined the invitation.</p>`;
+            }
+            return html `<div class="login">
+      <h1 class="display-medium">Invitation declined</h1>
+      ${info}
+      <p class="body-large">You can safely close this page.</p>
+    </div>`;
+        }
+        renderInvitationDeleted() {
+            const { invitation } = this;
+            const time = invitation?.deletedInfo?.time;
+            let info;
+            if (time) {
+                const d = new Date(time);
+                info = html `<p class="body-large">
+        The invitation has been deleted
+        <relative-time datetime="${d.toISOString()}">${d.toLocaleString()}</relative-time>.
+      </p>`;
+            }
+            else {
+                info = html `<p class="body-large">The invitation has been deleted.</p>`;
+            }
+            return html `<div class="login">
+      <h1 class="display-medium">Invitation deleted</h1>
+      ${info}
+      <p class="body-large">You can safely close this page.</p>
+    </div>`;
+        }
+        renderInvitationExpired() {
+            const { invitation } = this;
+            const time = invitation?.expiresAt;
+            let info;
+            if (time) {
+                const d = new Date(time);
+                info = html `<p class="body-large">
+        The invitation expired <relative-time datetime="${d.toISOString()}">${d.toLocaleString()}</relative-time>.
+      </p>`;
+            }
+            else {
+                info = html `<p class="body-large">The invitation has expired.</p>`;
+            }
+            return html `<div class="login">
+      <h1 class="display-medium">Invitation expired</h1>
+      ${info}
+      <p class="body-large">You can safely close this page.</p>
+    </div>`;
+        }
+        renderGoogleButton() {
+            if (!this.google) {
+                return nothing;
+            }
+            return html `<ui-button class="auth-button" color="outlined" @click="${this.authenticateGoogle}"
+      >${google} Google</ui-button
+    >`;
+        }
+        renderGithubButton() {
+            if (!this.github) {
+                return nothing;
+            }
+            return html `<ui-button class="auth-button" color="outlined" @click="${this.authenticateGithub}"
+      >${github} Github</ui-button
+    >`;
+        }
+        renderLinkedinButton() {
+            if (!this.linkedin) {
+                return nothing;
+            }
+            return html `<ui-button class="auth-button" color="outlined" @click="${this.authenticateLinkedin}"
+      >${linkedin} LinkedIn</ui-button
+    >`;
+        }
+        constructor() {
+            super(...arguments);
+            __runInitializers(this, _organization_extraInitializers);
+        }
+    };
+})();
+/**
+ * An App screen (HTML Element) allowing the user to accept an invitation to join an organization.
+ *
+ * This component handles the UI for invitation acceptance flow.
+ * It does not implement the actual invitation logic but dispatches events. However, the state can be set
+ * via the `state` property to reflect the current status.
+ *
+ * The parent app has to handle the invitation acceptance logic and update the state accordingly.
+ *
+ * When it comes to the user flow, the user can either accept or decline the invitation. To accept the
+ * initivation the user has to log in through one of the supported providers (Google, GitHub, LinkedIn).
+ * After successful login, the invitation is accepted. If the user declines the invitation, the invitation
+ * is rejected immediately.
+ *
+ * @fires authenticate - Dispatched when the user clicks on one of the authentication buttons.
+ *                       The detail object `CustomEvent<{ provider: AuthProviders }>` contains the selected provider.
+ * @fires reject - Dispatched when the user clicks the "Decline" button.
+ * @fires open - Dispatched when the user clicks the "Open organization" button
+ *               after a successful acceptance (state `InvitationAccepted`).
+ *
+ * @example
+ * ```html
+ * <invitation-screen
+ *   .state="${this.invitationState}"
+ *   .invitation="${this.invitationData}"
+ *   ?google="${true}"
+ *   @authenticate="${this.handleAuth}"
+ *   @reject="${this.handleReject}"
+ * ></invitation-screen>
+ * ```
+ */
+export default InvitationScreen;
+//# sourceMappingURL=InvitationScreen.js.map

package/build/src/elements/setup/internals/InvitationScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvitationScreen.js","sourceRoot":"","sources":["../../../../../src/elements/setup/internals/InvitationScreen.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, TemplateResult, LitElement, nothing } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { consume } from '@lit/context'\nimport { type ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport type { AuthProviders } from '@api-client/core/sdk/AuthSdk.js'\nimport type { InvitationSchema } from '@api-client/core/models/store/Invitation.js'\nimport { github, google, linkedin } from './icons.js'\nimport { type IOrganization, organizationContext } from '../../../providers/organization.js'\n\nexport enum State {\n  /**\n   * The initial state (default).\n   *\n   * Next possible states:\n   * - `Initialized`\n   * - `Error`\n   */\n  Initializing = 'initializing',\n  /**\n   * The state when an error occurred.\n   * In this state, set the `errors` property to show error details.\n   * There are no next possible states from here, the parent app has to reset the flow.\n   */\n  Error = 'error',\n  /**\n   * State after the app initialization is complete.\n   * It means that the app has read all necessary config but has not yet fetched invitation data.\n   *\n   * Next possible states:\n   * - `ReadingStatus`\n   */\n  Initialized = 'initialized',\n  /**\n   * The state when the application is fetching invitation data.\n   * The component renders the loading indicator in this state.\n   *\n   * Next possible states:\n   * - `Login`\n   * - `Error`\n   */\n  ReadingStatus = 'reading-status',\n  /**\n   * The main interaction state where the user can choose to log in (accept) or decline.\n   *\n   * Next possible states:\n   * - `Rejecting`\n   * - `InvitationAccepted`\n   * - `InvitationDeclined`\n   * - `Error`\n   */\n  Login = 'login',\n  /**\n   * The state when the rejection request is being processed.\n   *\n   * Next possible states:\n   * - `Rejected`\n   * - `Error`\n   */\n  Rejecting = 'rejecting',\n  /**\n   * The state when the invitation has been rejected by the user in the current session.\n   *\n   * There are no next possible states from here, the parent app has to reset the flow.\n   */\n  Rejected = 'rejected',\n  /**\n   * The state when the invitation has been successfully accepted.\n   * This state can be set after reading the invitation status that was already accepted previously.\n   *\n   * There are no next possible states from here, the parent app has to reset the flow.\n   */\n  InvitationAccepted = 'invitation-accepted',\n  /**\n   * The state when the invitation is found to be deleted or invalid.\n   *\n   * There are no next possible states from here, the parent app has to reset the flow.\n   */\n  InvitationDeleted = 'invitation-deleted',\n  /**\n   * The state when the invitation was already declined previously.\n   *\n   * There are no next possible states from here, the parent app has to reset the flow.\n   */\n  InvitationDeclined = 'invitation-declined',\n  /**\n   * The state when the invitation has expired.\n   *\n   * There are no next possible states from here, the parent app has to reset the flow.\n   */\n  InvitationExpired = 'invitation-expired',\n}\n\n/**\n * An App screen (HTML Element) allowing the user to accept an invitation to join an organization.\n *\n * This component handles the UI for invitation acceptance flow.\n * It does not implement the actual invitation logic but dispatches events. However, the state can be set\n * via the `state` property to reflect the current status.\n *\n * The parent app has to handle the invitation acceptance logic and update the state accordingly.\n *\n * When it comes to the user flow, the user can either accept or decline the invitation. To accept the\n * initivation the user has to log in through one of the supported providers (Google, GitHub, LinkedIn).\n * After successful login, the invitation is accepted. If the user declines the invitation, the invitation\n * is rejected immediately.\n *\n * @fires authenticate - Dispatched when the user clicks on one of the authentication buttons.\n *                       The detail object `CustomEvent<{ provider: AuthProviders }>` contains the selected provider.\n * @fires reject - Dispatched when the user clicks the \"Decline\" button.\n * @fires open - Dispatched when the user clicks the \"Open organization\" button\n *               after a successful acceptance (state `InvitationAccepted`).\n *\n * @example\n * ```html\n * <invitation-screen\n *   .state=\"${this.invitationState}\"\n *   .invitation=\"${this.invitationData}\"\n *   ?google=\"${true}\"\n *   @authenticate=\"${this.handleAuth}\"\n *   @reject=\"${this.handleReject}\"\n * ></invitation-screen>\n * ```\n */\nexport default class InvitationScreen extends LitElement {\n  /**\n   * This is the main state definition that controls what is rendered on the screen.\n   * It can be one of the `State` enum values.\n   *\n   * @attribute\n   */\n  @property({ type: String }) accessor state = State.Initializing\n  /**\n   * When set it renders the Google login button. Disabled by default.\n   * @attribute\n   */\n  @property({ type: Boolean }) accessor google = false\n\n  /**\n   * When set it renders the LinkedIn login button. Disabled by default.\n   * @attribute\n   */\n  @property({ type: Boolean }) accessor linkedin = false\n\n  /**\n   * When set it renders the GitHub login button. Disabled by default.\n   * @attribute\n   */\n  @property({ type: Boolean }) accessor github = false\n\n  /**\n   * The list of errors to display.\n   */\n  @property({ type: Array }) accessor errors: string[] | undefined\n  /**\n   * The invitation details retreived from the backend.\n   * This property must be set for the component to function correctly.\n   */\n  @property({ type: Object }) accessor invitation: InvitationSchema | undefined\n\n  /**\n   * The fetched organization details for which the invitation is valid.\n   *\n   * This property consumes the `organizationContext`.\n   */\n  @property({ type: Object, attribute: false })\n  @consume({ context: organizationContext })\n  accessor organization: IOrganization | undefined\n\n  /**\n   * Dispatches the authentication event for the selected provider.\n   *\n   * @param provider The authentication provider to use.\n   */\n  protected dispatchAuth(provider: AuthProviders): void {\n    this.dispatchEvent(\n      new CustomEvent('authenticate', {\n        detail: { provider },\n        bubbles: false,\n        composed: false,\n      })\n    )\n  }\n\n  protected authenticateGoogle(): void {\n    this.dispatchAuth('google')\n  }\n\n  protected authenticateGithub(): void {\n    this.dispatchAuth('github')\n  }\n\n  protected authenticateLinkedin(): void {\n    this.dispatchAuth('linkedin')\n  }\n\n  /**\n   * Handles the click on the \"Open organization\" button after accepting the invitation.\n   */\n  protected handleAcceptedOpen(): void {\n    this.dispatchEvent(\n      new CustomEvent('open', {\n        bubbles: false,\n        composed: false,\n      })\n    )\n  }\n\n  /**\n   * Handles the click on the \"Decline\" button to reject the invitation.\n   */\n  protected handleReject(): void {\n    this.dispatchEvent(\n      new CustomEvent('reject', {\n        bubbles: false,\n        composed: false,\n      })\n    )\n  }\n\n  protected override render(): unknown {\n    const classes: ClassInfo = {\n      'slide': true,\n      'login-slide': true,\n      'error': [\n        State.Error,\n        State.InvitationDeclined,\n        State.InvitationDeleted,\n        State.InvitationDeclined,\n        State.InvitationExpired,\n      ].includes(this.state),\n    }\n    return html`\n      <div class=\"content\">\n        <div class=\"${classMap(classes)}\">${this.renderPage()}</div>\n      </div>\n    `\n  }\n\n  renderPage(): TemplateResult {\n    switch (this.state) {\n      case State.Initializing:\n        return this.renderCheckingUser()\n      case State.Error:\n        return this.renderError()\n      case State.Initialized:\n        // This is only an intermediate state before fetching data\n        return this.renderCheckingUser()\n      case State.ReadingStatus:\n        return this.renderCheckingUser()\n      case State.Login:\n        return html`${this.renderInto()} ${this.renderLoginForm()}`\n      case State.Rejecting:\n        return this.renderRejecting()\n      case State.Rejected:\n        return this.renderRejected()\n      case State.InvitationAccepted:\n        return this.renderInvitationAccepted()\n      case State.InvitationDeclined:\n        return this.renderInvitationDeclined()\n      case State.InvitationDeleted:\n        return this.renderInvitationDeleted()\n      case State.InvitationExpired:\n        return this.renderInvitationExpired()\n      default:\n        return html`<p>Unknown state.</p>`\n    }\n  }\n\n  protected renderCheckingUser(): TemplateResult {\n    return html`<div class=\"login\">\n      <p class=\"body-large\">Loading...</p>\n      <ui-progress indeterminate class=\"login-progress\"></ui-progress>\n    </div>`\n  }\n\n  protected renderInto(): TemplateResult {\n    const { invitation } = this\n    const name = invitation?.name\n    return html` <div class=\"intro\">\n      <h1 class=\"display-small\">${name ? html`Hi ${name}` : 'Welcome to API Now!'}</h1>\n      <p class=\"body-large\">You've been invited to join an organization.</p>\n    </div>`\n  }\n\n  protected renderLoginForm(): TemplateResult {\n    return html`\n      <div class=\"login\">\n        <p class=\"body-large\">To respond to the invitation, please log in.</p>\n        <div class=\"login-option\">${this.renderGoogleButton()}</div>\n        <div class=\"login-option\">${this.renderGithubButton()}</div>\n        <div class=\"login-option\">${this.renderLinkedinButton()}</div>\n        <div class=\"login-option\">\n          <ui-button class=\"decline\" color=\"text\" @click=\"${this.handleReject}\">Decline invitation</ui-button>\n        </div>\n      </div>\n    `\n  }\n\n  protected renderRejecting(): TemplateResult {\n    return html`<div class=\"login\">\n      <h1 class=\"display-medium\">Thank you for responding</h1>\n      <p class=\"body-large\">We will let them know you were not the intended recipient.</p>\n      <ui-progress indeterminate class=\"login-progress\"></ui-progress>\n    </div>`\n  }\n\n  protected renderRejected(): TemplateResult {\n    return html`<div class=\"login\">\n      <h1 class=\"display-medium\">Thank you for responding</h1>\n      <p class=\"body-large\">We've let them know you were not the intended recipient.</p>\n    </div>`\n  }\n\n  protected renderError(): TemplateResult {\n    const { errors = [] } = this\n    return html`<div class=\"login\">\n      <h1 class=\"display-medium\">Responding error</h1>\n      <p class=\"body-large\">An error occurred while processing your request.</p>\n      <ul>\n        ${errors.map((error) => html`<li>${error}</li>`)}\n      </ul>\n    </div>`\n  }\n\n  protected renderInvitationAccepted(): TemplateResult {\n    return html`<div class=\"login\">\n      <h1 class=\"display-medium\">Invitation accepted</h1>\n      <p class=\"body-large\">You have successfully accepted the invitation.</p>\n      <ui-button class=\"open\" color=\"filled\" @click=\"${this.handleAcceptedOpen}\">Open organization</ui-button>\n    </div>`\n  }\n\n  protected renderInvitationDeclined(): TemplateResult {\n    const { invitation } = this\n    const time = invitation?.respondedAt\n    let info: TemplateResult\n    if (time) {\n      const d = new Date(time)\n      info = html`<p class=\"body-large\">\n        You declined the invitation <relative-time datetime=\"${d.toISOString()}\">${d.toLocaleString()}</relative-time>.\n      </p>`\n    } else {\n      info = html`<p class=\"body-large\">You have declined the invitation.</p>`\n    }\n    return html`<div class=\"login\">\n      <h1 class=\"display-medium\">Invitation declined</h1>\n      ${info}\n      <p class=\"body-large\">You can safely close this page.</p>\n    </div>`\n  }\n\n  protected renderInvitationDeleted(): TemplateResult {\n    const { invitation } = this\n    const time = invitation?.deletedInfo?.time\n    let info: TemplateResult\n    if (time) {\n      const d = new Date(time)\n      info = html`<p class=\"body-large\">\n        The invitation has been deleted\n        <relative-time datetime=\"${d.toISOString()}\">${d.toLocaleString()}</relative-time>.\n      </p>`\n    } else {\n      info = html`<p class=\"body-large\">The invitation has been deleted.</p>`\n    }\n    return html`<div class=\"login\">\n      <h1 class=\"display-medium\">Invitation deleted</h1>\n      ${info}\n      <p class=\"body-large\">You can safely close this page.</p>\n    </div>`\n  }\n\n  protected renderInvitationExpired(): TemplateResult {\n    const { invitation } = this\n    const time = invitation?.expiresAt\n    let info: TemplateResult\n    if (time) {\n      const d = new Date(time)\n      info = html`<p class=\"body-large\">\n        The invitation expired <relative-time datetime=\"${d.toISOString()}\">${d.toLocaleString()}</relative-time>.\n      </p>`\n    } else {\n      info = html`<p class=\"body-large\">The invitation has expired.</p>`\n    }\n\n    return html`<div class=\"login\">\n      <h1 class=\"display-medium\">Invitation expired</h1>\n      ${info}\n      <p class=\"body-large\">You can safely close this page.</p>\n    </div>`\n  }\n\n  protected renderGoogleButton(): TemplateResult | typeof nothing {\n    if (!this.google) {\n      return nothing\n    }\n    return html`<ui-button class=\"auth-button\" color=\"outlined\" @click=\"${this.authenticateGoogle}\"\n      >${google} Google</ui-button\n    >`\n  }\n\n  protected renderGithubButton(): TemplateResult | typeof nothing {\n    if (!this.github) {\n      return nothing\n    }\n    return html`<ui-button class=\"auth-button\" color=\"outlined\" @click=\"${this.authenticateGithub}\"\n      >${github} Github</ui-button\n    >`\n  }\n\n  protected renderLinkedinButton(): TemplateResult | typeof nothing {\n    if (!this.linkedin) {\n      return nothing\n    }\n    return html`<ui-button class=\"auth-button\" color=\"outlined\" @click=\"${this.authenticateLinkedin}\"\n      >${linkedin} LinkedIn</ui-button\n    >`\n  }\n}\n"]}

package/build/src/elements/setup/internals/InvitationScreen.styles.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("lit").CSSResult;
+export default _default;
+//# sourceMappingURL=InvitationScreen.styles.d.ts.map

package/build/src/elements/setup/internals/InvitationScreen.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvitationScreen.styles.d.ts","sourceRoot":"","sources":["../../../../../src/elements/setup/internals/InvitationScreen.styles.ts"],"names":[],"mappings":";AAEA,wBAAoB"}

package/build/src/elements/setup/internals/InvitationScreen.styles.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export default css ``;
+//# sourceMappingURL=InvitationScreen.styles.js.map

package/build/src/elements/setup/internals/InvitationScreen.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvitationScreen.styles.js","sourceRoot":"","sources":["../../../../../src/elements/setup/internals/InvitationScreen.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA,EAAE,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css``\n"]}

package/build/src/elements/setup/internals/LoginScreen.d.ts

@@ -0,0 +1,61 @@
+import { TemplateResult, LitElement, nothing } from 'lit';
+import type { AuthProviders } from '@api-client/core/sdk/AuthSdk.js';
+/**
+ * An App screen (HTML Element) allowing the user to log in via supported providers (Google, GitHub, LinkedIn).
+ *
+ * This component handles the UI for authentication options and the loading state.
+ * It does not implement actual authentication logic but delegates it via events.
+ *
+ * @fires authenticate - Dispatched when the user clicks on one of the authentication buttons.
+ *                       The detail object `CustomEvent<{ provider: AuthProviders }>` contains the selected provider.
+ *
+ * @example
+ * ```html
+ * <login-screen
+ *   .loading="${this.isLoggingIn}"
+ *   google
+ *   linkedin
+ *   github
+ *   @authenticate="${this.handleLogin}"
+ * ></login-screen>
+ * ```
+ */
+export default class LoginScreen extends LitElement {
+    /**
+     * When true, shows a loading indicator instead of the login buttons.
+     * Set this while the authentication request is in progress.
+     */
+    accessor loading: boolean;
+    /**
+     * When set it renders the Google login button. Disabled by default.
+     * @attribute
+     */
+    accessor google: boolean;
+    /**
+     * When set it renders the LinkedIn login button. Disabled by default.
+     * @attribute
+     */
+    accessor linkedin: boolean;
+    /**
+     * When set it renders the GitHub login button. Disabled by default.
+     * @attribute
+     */
+    accessor github: boolean;
+    /**
+     * Dispatches the authentication event for the selected provider.
+     *
+     * @param provider The authentication provider to use.
+     */
+    protected dispatchAuth(provider: AuthProviders): void;
+    protected authenticateGoogle(): void;
+    protected authenticateGithub(): void;
+    protected authenticateLinkedin(): void;
+    protected render(): unknown;
+    protected renderInto(): TemplateResult;
+    protected renderLoginForm(): TemplateResult;
+    protected renderCheckingUser(): TemplateResult;
+    protected renderGoogleButton(): TemplateResult | typeof nothing;
+    protected renderGithubButton(): TemplateResult | typeof nothing;
+    protected renderLinkedinButton(): TemplateResult | typeof nothing;
+}
+//# sourceMappingURL=LoginScreen.d.ts.map

package/build/src/elements/setup/internals/LoginScreen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoginScreen.d.ts","sourceRoot":"","sources":["../../../../../src/elements/setup/internals/LoginScreen.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AAE/D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;AAGpE;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,UAAU;IACjD;;;OAGG;IAC0B,QAAQ,CAAC,OAAO,UAAQ;IAErD;;;OAGG;IAC0B,QAAQ,CAAC,MAAM,UAAQ;IAEpD;;;OAGG;IAC0B,QAAQ,CAAC,QAAQ,UAAQ;IAEtD;;;OAGG;IAC0B,QAAQ,CAAC,MAAM,UAAQ;IAEpD;;;;OAIG;IACH,SAAS,CAAC,YAAY,CAAC,QAAQ,EAAE,aAAa,GAAG,IAAI;IAUrD,SAAS,CAAC,kBAAkB,IAAI,IAAI;IAIpC,SAAS,CAAC,kBAAkB,IAAI,IAAI;IAIpC,SAAS,CAAC,oBAAoB,IAAI,IAAI;cAInB,MAAM,IAAI,OAAO;IAMpC,SAAS,CAAC,UAAU,IAAI,cAAc;IAOtC,SAAS,CAAC,eAAe,IAAI,cAAc;IAY3C,SAAS,CAAC,kBAAkB,IAAI,cAAc;IAO9C,SAAS,CAAC,kBAAkB,IAAI,cAAc,GAAG,OAAO,OAAO;IAS/D,SAAS,CAAC,kBAAkB,IAAI,cAAc,GAAG,OAAO,OAAO;IAS/D,SAAS,CAAC,oBAAoB,IAAI,cAAc,GAAG,OAAO,OAAO;CAQlE"}