@atlasauth/vue 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Atlas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,162 @@
+# @atlas/vue
+
+The official Atlas SDK for Vue 3 — the framework peer of
+[`@atlas/react`](../react). It reuses the framework-agnostic
+[`@atlas/js`](../js) client for every API call and the shared
+[`@atlas/authz`](../authz) primitive for permission checks, and mirrors the web
+surface as idiomatic Vue Composition API: a plugin, `Ref`/`computed`-based
+composables, and components that render in your host DOM (no iframe, so
+Tailwind/CSS just works).
+
+Like `@atlas/js`'s web binding, the session lives in an **HttpOnly cookie** the
+browser sends automatically; the short-lived JWT is held only in memory for the
+life of the tab. Nothing is written to `localStorage`.
+
+## Install
+
+```sh
+npm install @atlas/vue
+# peer you already have in a Vue 3 app:
+#   vue >= 3.3
+```
+
+## Plugin
+
+Install the plugin once, at app creation. It boots the session, completes any
+OAuth/hosted-page redirect, schedules proactive token refresh, and paints your
+appearance tokens onto the document root as CSS variables.
+
+```ts
+import { createApp } from 'vue';
+import { createAtlas } from '@atlas/vue';
+import App from './App.vue';
+
+createApp(App)
+  .use(
+    createAtlas({
+      publishableKey: 'pk_live_…',
+      // frontendApi: 'https://your-instance.atlas.dev', // optional FAPI origin
+      // appearance: { baseTheme: 'dark', elements: { formButtonPrimary: 'rounded-xl' } },
+      // localization: myCatalog,
+    }),
+  )
+  .mount('#app');
+```
+
+## Composables
+
+Every composable returns `isLoaded` alongside its data so you can tell "still
+booting" from "signed out" and avoid a flash of the sign-in form. Returned
+state is reactive (`Ref` / `computed`).
+
+```vue
+<script setup lang="ts">
+import { useUser, useAuth, useSession, useOrganization } from '@atlas/vue';
+
+const { isLoaded, isSignedIn, user } = useUser();
+const { userId, orgRole, getToken, signOut, has } = useAuth();
+const { session } = useSession();
+const { organization, memberships, setActive } = useOrganization();
+
+async function callApi() {
+  const token = await getToken(); // always fresh; refreshes if near expiry
+  // fetch('/api', { headers: { Authorization: `Bearer ${token}` } })
+}
+
+// A live token at a connected social provider (Google, GitHub, …):
+const { getProviderToken } = useUser();
+async function callGoogle() {
+  const token = await getProviderToken('google'); // null if no linked account
+}
+
+// `has()` mirrors <Protect>, for logic that is not a render decision:
+const canManage = has({ permission: 'org:billing:manage' });
+</script>
+```
+
+| Composable          | React peer        |
+| ------------------- | ----------------- |
+| `useAtlas()`        | `useAtlas()`      |
+| `useUser()`         | `useUser()`       |
+| `useSession()`      | `useSession()`    |
+| `useAuth()`         | `useAuth()`       |
+| `useOrganization()` | `useOrganization()` |
+| `useSignIn()`       | internal `useFlow` |
+| `useSignUp()`       | internal `useFlow` |
+
+## Components
+
+Drop-in components for the common flows. `<SignIn>` and `<SignUp>` are full
+multi-step flows driven entirely by the server-side attempt status — the client
+never decides what step comes next.
+
+```vue
+<script setup lang="ts">
+import {
+  SignedIn,
+  SignedOut,
+  Protect,
+  SignIn,
+  UserButton,
+} from '@atlas/vue';
+</script>
+
+<template>
+  <SignedOut>
+    <SignIn />
+  </SignedOut>
+
+  <SignedIn>
+    <UserButton />
+    <Protect permission="org:billing:manage">
+      <button>Manage billing</button>
+      <template #fallback>
+        <p>You don't have access.</p>
+      </template>
+    </Protect>
+  </SignedIn>
+</template>
+```
+
+| Component               | React peer              |
+| ----------------------- | ----------------------- |
+| `<SignedIn>`            | `<SignedIn>`            |
+| `<SignedOut>`           | `<SignedOut>`           |
+| `<AtlasLoading>`        | `<AtlasLoading>`        |
+| `<AtlasLoaded>`         | `<AtlasLoaded>`         |
+| `<Protect>`             | `<Protect>`             |
+| `<SignIn>`              | `<SignIn>`              |
+| `<SignUp>`              | `<SignUp>`              |
+| `<UserButton>`          | `<UserButton>`          |
+| `<UserProfile>`         | `<UserProfile>`         |
+| `<OrganizationSwitcher>`| `<OrganizationSwitcher>`|
+| `<OrganizationProfile>` | `<OrganizationProfile>` |
+
+`<Protect>` is a **rendering** helper, never an authorization boundary. It
+decides what a user *sees*; the server checking the same permission on the
+request is what actually stops them acting.
+
+## Theming
+
+The `appearance` option mirrors `@atlas/react`: design tokens (`variables`),
+per-element class overrides (`elements`), and prebuilt `baseTheme`s (`default`,
+`dark`, `neobrutalist`). Overrides are **appended** to our base classes, so a
+Tailwind class you add makes a rounder button — not an unstyled one.
+
+## Localization
+
+Every string passes through an i18n catalog. `en-US` ships; pass a partial
+`localization` catalog and it merges over `en-US`, so an untranslated key still
+renders.
+
+## Testing
+
+```sh
+pnpm --filter @atlas/vue test        # vitest + @vue/test-utils (happy-dom)
+pnpm --filter @atlas/vue typecheck   # tsc --noEmit
+pnpm --filter @atlas/vue build       # tsc -> dist
+```
+
+## License
+
+MIT — see [LICENSE](./LICENSE).

package/dist/appearance.d.ts

@@ -0,0 +1,85 @@
+/**
+ * §10.3 theming.
+ *
+ * "appearance prop: design tokens (colors, radius, font, spacing) + per-element
+ * class overrides (elements: { formButtonPrimary: "…" }). No iframe — components
+ * render in the host DOM so Tailwind/CSS just works."
+ *
+ * Rendering in the host DOM is the decision everything else follows from. An
+ * iframe would isolate styles perfectly and be unusable: it cannot be sized to
+ * its content reliably, it breaks password managers, it breaks autofill, and a
+ * Tailwind class the customer writes has no effect inside it. Sharing the DOM
+ * means the customer's CSS reaches our markup, which is exactly what they want
+ * and what makes an override system necessary rather than decorative.
+ *
+ * Element classes are APPENDED to ours, never replacing them. A customer adding
+ * `className="rounded-xl"` wants a rounder button, not an unstyled one — and
+ * replacement is a support burden where every override starts by rebuilding the
+ * component's base styles from scratch.
+ */
+export interface DesignTokens {
+    colorPrimary?: string;
+    colorText?: string;
+    colorBackground?: string;
+    colorDanger?: string;
+    colorBorder?: string;
+    borderRadius?: string;
+    fontFamily?: string;
+    spacingUnit?: string;
+}
+/** Every element a customer may target. Named for what it IS, not where it sits. */
+export type ElementKey = 'root' | 'card' | 'headerTitle' | 'headerSubtitle' | 'formField' | 'formFieldLabel' | 'formFieldInput' | 'formFieldError' | 'formButtonPrimary' | 'formButtonSecondary' | 'socialButton' | 'dividerText' | 'footerAction' | 'avatar' | 'menu' | 'menuItem' | 'badge';
+export interface Appearance {
+    /** A prebuilt theme to start from. */
+    baseTheme?: keyof typeof THEMES;
+    variables?: DesignTokens;
+    elements?: Partial<Record<ElementKey, string>>;
+}
+export declare const DEFAULT_TOKENS: Required<DesignTokens>;
+/**
+ * §10.3: "prebuilt themes shipped (default, dark, neobrutalist as a demo of the
+ * override system)". Neobrutalist exists to prove the token set is expressive
+ * enough for a theme that looks nothing like the default — a theming system
+ * that only produces tasteful variations of itself is not a theming system.
+ */
+export declare const THEMES: {
+    readonly default: Required<DesignTokens>;
+    readonly dark: {
+        readonly colorText: "#e6e9ef";
+        readonly colorBackground: "#14171c";
+        readonly colorBorder: "#242932";
+        readonly colorPrimary: "#6ea8fe";
+        readonly colorDanger: string;
+        readonly borderRadius: string;
+        readonly fontFamily: string;
+        readonly spacingUnit: string;
+    };
+    readonly neobrutalist: {
+        readonly colorPrimary: "#ffe600";
+        readonly colorText: "#000000";
+        readonly colorBackground: "#ffffff";
+        readonly colorBorder: "#000000";
+        readonly borderRadius: "0px";
+        readonly fontFamily: "\"Courier New\", ui-monospace, monospace";
+        readonly colorDanger: string;
+        readonly spacingUnit: string;
+    };
+};
+/**
+ * Resolve tokens: defaults, then the base theme, then explicit variables.
+ *
+ * Later wins, and `undefined` never overwrites. A customer setting one variable
+ * on the dark theme expects the other eleven to stay dark, not silently revert
+ * to the light defaults.
+ */
+export declare function resolveTokens(appearance?: Appearance): Required<DesignTokens>;
+/** Tokens as CSS custom properties, for the host DOM to inherit. */
+export declare function cssVariables(tokens: Required<DesignTokens>): Record<string, string>;
+/**
+ * Combine our base class with the customer's override.
+ *
+ * Appended, never replaced — a customer adding `rounded-xl` wants a rounder
+ * button, not an unstyled one. Theirs comes last so it wins on equal
+ * specificity, which is the behaviour anyone writing Tailwind expects.
+ */
+export declare function classFor(element: ElementKey, appearance: Appearance | undefined, base: string): string;

package/dist/appearance.js

@@ -0,0 +1,98 @@
+"use strict";
+/**
+ * §10.3 theming.
+ *
+ * "appearance prop: design tokens (colors, radius, font, spacing) + per-element
+ * class overrides (elements: { formButtonPrimary: "…" }). No iframe — components
+ * render in the host DOM so Tailwind/CSS just works."
+ *
+ * Rendering in the host DOM is the decision everything else follows from. An
+ * iframe would isolate styles perfectly and be unusable: it cannot be sized to
+ * its content reliably, it breaks password managers, it breaks autofill, and a
+ * Tailwind class the customer writes has no effect inside it. Sharing the DOM
+ * means the customer's CSS reaches our markup, which is exactly what they want
+ * and what makes an override system necessary rather than decorative.
+ *
+ * Element classes are APPENDED to ours, never replacing them. A customer adding
+ * `className="rounded-xl"` wants a rounder button, not an unstyled one — and
+ * replacement is a support burden where every override starts by rebuilding the
+ * component's base styles from scratch.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.THEMES = exports.DEFAULT_TOKENS = void 0;
+exports.resolveTokens = resolveTokens;
+exports.cssVariables = cssVariables;
+exports.classFor = classFor;
+exports.DEFAULT_TOKENS = {
+    colorPrimary: '#5b5bd6',
+    colorText: '#1c1c1f',
+    colorBackground: '#ffffff',
+    colorDanger: '#d64545',
+    colorBorder: '#e4e4e9',
+    borderRadius: '8px',
+    fontFamily: 'ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif',
+    spacingUnit: '4px',
+};
+/**
+ * §10.3: "prebuilt themes shipped (default, dark, neobrutalist as a demo of the
+ * override system)". Neobrutalist exists to prove the token set is expressive
+ * enough for a theme that looks nothing like the default — a theming system
+ * that only produces tasteful variations of itself is not a theming system.
+ */
+exports.THEMES = {
+    default: exports.DEFAULT_TOKENS,
+    dark: {
+        ...exports.DEFAULT_TOKENS,
+        colorText: '#e6e9ef',
+        colorBackground: '#14171c',
+        colorBorder: '#242932',
+        colorPrimary: '#6ea8fe',
+    },
+    neobrutalist: {
+        ...exports.DEFAULT_TOKENS,
+        colorPrimary: '#ffe600',
+        colorText: '#000000',
+        colorBackground: '#ffffff',
+        colorBorder: '#000000',
+        borderRadius: '0px',
+        fontFamily: '"Courier New", ui-monospace, monospace',
+    },
+};
+/**
+ * Resolve tokens: defaults, then the base theme, then explicit variables.
+ *
+ * Later wins, and `undefined` never overwrites. A customer setting one variable
+ * on the dark theme expects the other eleven to stay dark, not silently revert
+ * to the light defaults.
+ */
+function resolveTokens(appearance) {
+    const base = appearance?.baseTheme ? exports.THEMES[appearance.baseTheme] : exports.DEFAULT_TOKENS;
+    const overrides = appearance?.variables ?? {};
+    const resolved = { ...exports.DEFAULT_TOKENS, ...base };
+    for (const [key, value] of Object.entries(overrides)) {
+        if (value !== undefined)
+            resolved[key] = value;
+    }
+    return resolved;
+}
+/** Tokens as CSS custom properties, for the host DOM to inherit. */
+function cssVariables(tokens) {
+    const vars = {};
+    for (const [key, value] of Object.entries(tokens)) {
+        // camelCase → --atlas-kebab-case, which is what a customer writes in CSS.
+        vars[`--atlas-${key.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`)}`] = value;
+    }
+    return vars;
+}
+/**
+ * Combine our base class with the customer's override.
+ *
+ * Appended, never replaced — a customer adding `rounded-xl` wants a rounder
+ * button, not an unstyled one. Theirs comes last so it wins on equal
+ * specificity, which is the behaviour anyone writing Tailwind expects.
+ */
+function classFor(element, appearance, base) {
+    const override = appearance?.elements?.[element];
+    return override ? `${base} ${override}` : base;
+}
+//# sourceMappingURL=appearance.js.map

package/dist/appearance.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"appearance.js","sourceRoot":"","sources":["../src/appearance.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;GAkBG;;;AAoFH,sCASC;AAGD,oCAOC;AASD,4BAOC;AA/EY,QAAA,cAAc,GAA2B;IACpD,YAAY,EAAE,SAAS;IACvB,SAAS,EAAE,SAAS;IACpB,eAAe,EAAE,SAAS;IAC1B,WAAW,EAAE,SAAS;IACtB,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,KAAK;IACnB,UAAU,EAAE,iEAAiE;IAC7E,WAAW,EAAE,KAAK;CACnB,CAAC;AAEF;;;;;GAKG;AACU,QAAA,MAAM,GAAG;IACpB,OAAO,EAAE,sBAAc;IACvB,IAAI,EAAE;QACJ,GAAG,sBAAc;QACjB,SAAS,EAAE,SAAS;QACpB,eAAe,EAAE,SAAS;QAC1B,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;IACD,YAAY,EAAE;QACZ,GAAG,sBAAc;QACjB,YAAY,EAAE,SAAS;QACvB,SAAS,EAAE,SAAS;QACpB,eAAe,EAAE,SAAS;QAC1B,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,KAAK;QACnB,UAAU,EAAE,wCAAwC;KACrD;CACwD,CAAC;AAE5D;;;;;;GAMG;AACH,SAAgB,aAAa,CAAC,UAAuB;IACnD,MAAM,IAAI,GAAG,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,cAAM,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,sBAAc,CAAC;IACnF,MAAM,SAAS,GAAG,UAAU,EAAE,SAAS,IAAI,EAAE,CAAC;IAE9C,MAAM,QAAQ,GAAG,EAAE,GAAG,sBAAc,EAAE,GAAG,IAAI,EAAE,CAAC;IAChD,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC;QACrD,IAAI,KAAK,KAAK,SAAS;YAAE,QAAQ,CAAC,GAAyB,CAAC,GAAG,KAAK,CAAC;IACvE,CAAC;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED,oEAAoE;AACpE,SAAgB,YAAY,CAAC,MAA8B;IACzD,MAAM,IAAI,GAA2B,EAAE,CAAC;IACxC,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;QAClD,0EAA0E;QAC1E,IAAI,CAAC,WAAW,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC;IACjF,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED;;;;;;GAMG;AACH,SAAgB,QAAQ,CACtB,OAAmB,EACnB,UAAkC,EAClC,IAAY;IAEZ,MAAM,QAAQ,GAAG,UAAU,EAAE,QAAQ,EAAE,CAAC,OAAO,CAAC,CAAC;IACjD,OAAO,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,IAAI,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;AACjD,CAAC"}

package/dist/components.d.ts

@@ -0,0 +1,114 @@
+import { type PropType, type VNode } from 'vue';
+export declare const SignedIn: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const SignedOut: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/** §10.2: render children only while the SDK is still loading. */
+export declare const AtlasLoading: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/**
+ * §10.2: render children only once the SDK has finished loading — the symmetric
+ * partner of {@link AtlasLoading}, so a consumer can show a spinner and its
+ * resolved content without hand-rolling the inverse condition.
+ */
+export declare const AtlasLoaded: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/**
+ * §10.2 `<Protect permission="…">`.
+ *
+ * A rendering helper, never an authorization boundary — anyone can flip the
+ * condition in devtools. The server checking the same permission is what
+ * actually stops them, and this component's job is only to avoid showing a
+ * button that would fail. Renders the `#fallback` slot when the condition is not
+ * met, mirroring React's `fallback` prop.
+ */
+export declare const Protect: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    permission: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    role: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    anyPermission: {
+        type: PropType<readonly string[]>;
+        default: undefined;
+    };
+    allPermissions: {
+        type: PropType<readonly string[]>;
+        default: undefined;
+    };
+}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    permission: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    role: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    anyPermission: {
+        type: PropType<readonly string[]>;
+        default: undefined;
+    };
+    allPermissions: {
+        type: PropType<readonly string[]>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    permission: string;
+    role: string;
+    anyPermission: readonly string[];
+    allPermissions: readonly string[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const SignIn: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /** Where to send the user once the flow completes. */
+    afterUrl: {
+        type: StringConstructor;
+        default: undefined;
+    };
+}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /** Where to send the user once the flow completes. */
+    afterUrl: {
+        type: StringConstructor;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    afterUrl: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const SignUp: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    afterUrl: {
+        type: StringConstructor;
+        default: undefined;
+    };
+}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    afterUrl: {
+        type: StringConstructor;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    afterUrl: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const UserButton: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const OrganizationSwitcher: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const UserProfile: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const OrganizationProfile: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;