svelte-firekit 0.0.15 → 0.0.16

package/dist/components/auth/user-button/profile-section/phone-user.svelte

@@ -1,122 +0,0 @@
-<script lang="ts">
-  import Button from "../../../ui/button/button.svelte";
-  import { firekitAuthManager } from "../../../../firebase/auth/auth-manager.svelte.js";
-
-  import Input from "../../../ui/input/input.svelte";
-  import { toast } from "svelte-sonner";
-  import intlTelInput from "intl-tel-input";
-  import { onMount } from "svelte";
-
-  let phoneNumber = ""; // Inicializa como una cadena vacía
-  let haserror = false;
-  let it: any = null;
-  let _phone: any = { valid: false, value: "", error: "" };
-
-  onMount(() => {
-    const input: HTMLInputElement | null =
-      document.querySelector("#phonenumberuser");
-    if (input) {
-      it = intlTelInput(input, {
-        utilsScript:
-          "https://cdn.jsdelivr.net/npm/intl-tel-input@24.7.0/build/js/utils.js",
-        separateDialCode: true,
-      });
-
-      // Si ya existe un número de teléfono, configúralo visualmente en el input
-      if (firekitAuthManager.data?.phoneNumber) {
-        it.setNumber(firekitAuthManager.data.phoneNumber);
-        phoneNumber = firekitAuthManager.data.phoneNumber;
-      }
-    }
-  });
-
-  $effect(() => {
-    if (firekitAuthManager.data?.phoneNumber) {
-      _phone.value = firekitAuthManager.data.phoneNumber;
-      phoneNumber = firekitAuthManager.data.phoneNumber;
-
-      // Si intlTelInput está inicializado, actualiza el input con el valor
-      if (it) {
-        it.setNumber(firekitAuthManager.data.phoneNumber);
-      }
-    }
-  });
-
-  async function handleChangePhoneNumber() {
-    if (it) {
-      _phone.value = it.getNumber();
-      _phone.error = it.getValidationError();
-      _phone.valid = it.isValidNumber();
-    }
-
-    if (!_phone.valid) {
-      toast.error("Phone number invalid.");
-      haserror = true;
-      return;
-    }
-
-    if (_phone.value === firekitAuthManager.data?.phoneNumber) {
-      toast.error("The phone number is the same as your current phone number.");
-      haserror = true;
-      return;
-    }
-
-    await firekitAuthManager.updateUserData({ phoneNumber: _phone.value });
-    await firekitAuthManager.updateProfileInfo({});
-    toast.success("Phone number updated successfully.");
-    haserror = false;
-  }
-</script>
-
-<section class="space-y-5 border-t-slate-200 border-t-[2px] pt-4">
-  <div class="grid sm:grid-cols-12 gap-y-1.5 sm:gap-y-0 sm:gap-x-5">
-    <div class="sm:col-span-4 xl:col-span-3">
-      <p
-        class="sm:mt-2.5 inline-block text-sm {haserror
-          ? 'text-red-500'
-          : 'text-foreground-500'}"
-      >
-        Phone number
-      </p>
-    </div>
-
-    <div class="sm:col-span-8 lg:col-span-6">
-      <div class="flex flex-wrap j items-center gap-3 sm:gap-5">
-        <div class="flex gap-2 items-center w-full">
-          <div class="flex flex-col gap-2 text-sm leading-tight">
-            <div id="contentphone" class=" space-y-1 my-2">
-              <!-- <Label class={haserror ? "text-red-500" : ""}>Phone number:</Label
-              > -->
-              <!-- oninput={changePhone} -->
-              <Input
-                id={"phonenumberuser"}
-                bind:value={phoneNumber}
-                name="phone"
-                type="tel"
-                class="input input-bordered w-full rounded  bg-transparent px-3  text-md border-[#DBDEE2]"
-                onbeforeinput={(e:any) => {
-                  if (
-                    !/^\d*$/.test(e.data) &&
-                    e.inputType !== "deleteContentBackward" &&
-                    e.inputType !== "deleteContentForward"
-                  ) {
-                    e.preventDefault();
-                  }
-                }}
-                placeholder="Phone number"
-              />
-            </div>
-            <Button
-              onclick={handleChangePhoneNumber}
-              variant="default"
-              class="bg-blue-500 hover:bg-blue-600 text-white block ml-auto"
-            >
-              Save
-            </Button>
-          </div>
-        </div>
-        <div></div>
-      </div>
-    </div>
-  </div>
-</section>

package/dist/components/auth/user-button/profile-section/phone-user.svelte.d.ts

@@ -1,2 +0,0 @@
-declare const PhoneUser: import("svelte").Component<Record<string, never>, {}, "">;
-export default PhoneUser;

package/dist/components/auth/user-button/profile-section/profile-section.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-  import { firekitAuthManager } from "../../../../firebase/auth/auth-manager.svelte.js";
-
-  import AvatarUser from "./avatar-user.svelte";
-  import ConnectUser from "./connect-user.svelte";
-  import EmailUser from "./email-user.svelte";
-  import PhoneUser from "./phone-user.svelte";
-</script>
-
-<h2 class=" pb-3 text-lg font-semibold">Profile Details</h2>
-
-<AvatarUser></AvatarUser>
-{#if firekitAuthManager.user?.providerData[0]?.providerId !== "google.com"}
-  <EmailUser></EmailUser>
-{/if}
-<PhoneUser></PhoneUser>
-<ConnectUser></ConnectUser>

package/dist/components/auth/user-button/profile-section/profile-section.svelte.d.ts

@@ -1,18 +0,0 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const ProfileSection: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type ProfileSection = InstanceType<typeof ProfileSection>;
-export default ProfileSection;

package/dist/components/auth/user-button/settings-dialog.svelte

@@ -1,88 +0,0 @@
-<script lang="ts">
-  import * as Breadcrumb from "../../ui/breadcrumb/index.js";
-  import { Button } from "../../ui/button/index.js";
-  import * as Dialog from "../../ui/dialog/index.js";
-  import * as Sidebar from "../../ui/sidebar/index.js";
-
-  import Lock from "lucide-svelte/icons/lock";
-  import { User2 } from "lucide-svelte";
-  import ProfileSection from "./profile-section/profile-section.svelte";
-
-  const data = {
-    nav: [
-      { name: "Profile", icon: User2 },
-      { name: "Security", icon: Lock },
-    ],
-  };
-
-  let open = $state(false);
-  let section = $state("Profile");
-</script>
-
-<Dialog.Root bind:open>
-  <Dialog.Trigger>
-    {#snippet child({ props })}
-      <Button size="sm" {...props}>Profile</Button>
-    {/snippet}
-  </Dialog.Trigger>
-  <Dialog.Content
-    class="overflow-y-auto md:overflow-hidden p-0 max-h-[80dvh] md:max-h-[500px] md:max-w-[700px] lg:max-w-[800px]"
-  >
-    <Dialog.Title class="sr-only">Settings</Dialog.Title>
-    <Dialog.Description class="sr-only"
-      >Customize your settings here.</Dialog.Description
-    >
-    <Sidebar.Provider class="items-start">
-      <Sidebar.Root collapsible="none" class="hidden md:flex">
-        <Sidebar.Content>
-          <Sidebar.Group>
-            <Sidebar.GroupContent>
-              <Sidebar.Menu>
-                {#each data.nav as item (item.name)}
-                  <Sidebar.MenuItem>
-                    <Sidebar.MenuButton
-                      isActive={item.name === section}
-                      onclick={() => (section = item.name)}
-                    >
-                      {#snippet child({ props })}
-                        <a href="##" {...props}>
-                          <item.icon />
-                          <span>{item.name}</span>
-                        </a>
-                      {/snippet}
-                    </Sidebar.MenuButton>
-                  </Sidebar.MenuItem>
-                {/each}
-              </Sidebar.Menu>
-            </Sidebar.GroupContent>
-          </Sidebar.Group>
-        </Sidebar.Content>
-      </Sidebar.Root>
-      <main class="flex sm:h-auto md:h-[480px]  flex-1 flex-col overflow-hidden">
-        <header
-          class="flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12"
-        >
-          <div class="flex items-center gap-2 px-4">
-            <Breadcrumb.Root>
-              <Breadcrumb.List>
-                <Breadcrumb.Item class="hidden md:block">
-                  <Breadcrumb.Link href="#">Settings</Breadcrumb.Link>
-                </Breadcrumb.Item>
-                <Breadcrumb.Separator class="hidden md:block" />
-                <Breadcrumb.Item>
-                  <Breadcrumb.Page>{section}</Breadcrumb.Page>
-                </Breadcrumb.Item>
-              </Breadcrumb.List>
-            </Breadcrumb.Root>
-          </div>
-        </header>
-        <div class="flex flex-1 flex-col gap-4 overflow-y-auto  p-4 pt-0 ">
-          {#if section === "Profile"}
-            <ProfileSection></ProfileSection>
-          {/if}
-          
-        </div>
-      </main>
-    </Sidebar.Provider>
-  </Dialog.Content>
-</Dialog.Root>

package/dist/components/auth/user-button/settings-dialog.svelte.d.ts

@@ -1,2 +0,0 @@
-declare const SettingsDialog: import("svelte").Component<Record<string, never>, {}, "">;
-export default SettingsDialog;

package/dist/components/auth/user-button/type-account.svelte

@@ -1,35 +0,0 @@
-<script lang="ts">
-  const { account }: { account: string } = $props();
-  import { Mail } from "lucide-svelte";
-
-</script>
-
-{#if account === "google.com"}
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    x="0px"
-    y="0px"
-    width="18"
-    height="18"
-    viewBox="0 0 48 48"
-  >
-    <path
-      fill="#4caf50"
-      d="M45,16.2l-5,2.75l-5,4.75L35,40h7c1.657,0,3-1.343,3-3V16.2z"
-    ></path><path
-      fill="#1e88e5"
-      d="M3,16.2l3.614,1.71L13,23.7V40H6c-1.657,0-3-1.343-3-3V16.2z"
-    ></path><polygon
-      fill="#e53935"
-      points="35,11.2 24,19.45 13,11.2 12,17 13,23.7 24,31.95 35,23.7 36,17"
-    ></polygon><path
-      fill="#c62828"
-      d="M3,12.298V16.2l10,7.5V11.2L9.876,8.859C9.132,8.301,8.228,8,7.298,8h0C4.924,8,3,9.924,3,12.298z"
-    ></path><path
-      fill="#fbc02d"
-      d="M45,12.298V16.2l-10,7.5V11.2l3.124-2.341C38.868,8.301,39.772,8,40.702,8h0 C43.076,8,45,9.924,45,12.298z"
-    ></path>
-  </svg>
-{:else}
-  <Mail class="size-4" />
-{/if}

package/dist/components/auth/user-button/type-account.svelte.d.ts

@@ -1,4 +0,0 @@
-declare const TypeAccount: import("svelte").Component<{
-    account: string;
-}, {}, "">;
-export default TypeAccount;

package/dist/components/auth/user-button/user-button.svelte

@@ -1,131 +0,0 @@
-<script lang="ts">
-  import SettingsDialog from "./settings-dialog.svelte";
-  import * as DropdownMenu from "../../ui/dropdown-menu/index.js";
-  import * as Avatar from "../../ui/avatar/index.js";
-  import { getInitials } from "../../../utils.js";
-  import type { NavItem } from "../../../types/nav.js";
-  import * as AlertDialog from "../../ui/alert-dialog/index.js";
-  import Button from "../../ui/button/button.svelte";
-  import { firekitAuth } from "../../../firebase/auth/auth.js";
-  import { LogOut } from "lucide-svelte";
-  import { firekitAuthManager } from "../../../firebase/auth/auth-manager.svelte.js";
-  import { Skeleton } from "../../ui/skeleton/index.js";
-
-  let isOpen = $state(false);
-
-  let { nav, redirectTo="/sign-in" }: { nav?: NavItem[], redirectTo:string } = $props();
-  async function handleLogout() {
-    await firekitAuth.logOut(redirectTo);
-  }
-</script>
-
-{#if !firekitAuthManager.initialized}
-  <div class="flex gap-2 items-center mx-4">
-    <Skeleton class="size-12 rounded-full" />
-    <div class="space-y-2">
-      <Skeleton class="h-3 w-[100px]" />
-      <Skeleton class="h-3 w-[150px]" />
-    </div>
-  </div>
-{:else if firekitAuthManager.data}
-  <DropdownMenu.Root>
-    <DropdownMenu.Trigger>
-      <Avatar.Root>
-        <Avatar.Image src={firekitAuthManager.data?.photoURL} alt="Avatar" />
-        <Avatar.Fallback>
-          {getInitials(firekitAuthManager.data?.displayName)}
-        </Avatar.Fallback>
-      </Avatar.Root>
-    </DropdownMenu.Trigger>
-    <DropdownMenu.Content>
-      <DropdownMenu.Group>
-        <DropdownMenu.GroupHeading>
-          <div class="flex items-center gap-3">
-            <Avatar.Root>
-              <Avatar.Image
-                src={firekitAuthManager.data?.photoURL}
-                alt="Avatar"
-              />
-              <Avatar.Fallback>
-                {getInitials(firekitAuthManager.data?.displayName)}
-              </Avatar.Fallback>
-            </Avatar.Root>
-            <div class="grow">
-              <span
-                class="block font-medium text-sm text-gray-800 dark:text-neutral-200"
-              >
-                {firekitAuthManager.data?.displayName}
-              </span>
-              <p class="text-xs text-foreground-500">
-                {firekitAuthManager.data?.email}
-              </p>
-            </div>
-          </div>
-        </DropdownMenu.GroupHeading>
-        <DropdownMenu.Separator />
-        <DropdownMenu.Item onclick={() => (isOpen = true)}>
-          {#snippet child({ props })}
-            <SettingsDialog child({ props }) />
-          {/snippet}
-        </DropdownMenu.Item>
-        {#if nav}
-          {#each nav as { href, label }}
-            <DropdownMenu.Item>
-              <a {href}>
-                {label}
-              </a>
-            </DropdownMenu.Item>
-          {/each}
-        {/if}
-
-        <DropdownMenu.Separator />
-        <DropdownMenu.Item onclick={handleLogout}>
-          <LogOut /> Logout
-        </DropdownMenu.Item>
-      </DropdownMenu.Group>
-    </DropdownMenu.Content>
-  </DropdownMenu.Root>
-  <AlertDialog.Root bind:open={isOpen}>
-    <AlertDialog.Content>
-      <AlertDialog.Header>
-        <AlertDialog.Title>
-          <div class="flex justify-between items-center">
-            <div class="flex items-center gap-3">
-              <Avatar.Root>
-                <Avatar.Image
-                  src={firekitAuthManager.data?.photoURL}
-                  alt="Avatar"
-                />
-                <Avatar.Fallback>
-                  {getInitials(firekitAuthManager.data?.displayName)}
-                </Avatar.Fallback>
-              </Avatar.Root>
-              <div class="grow">
-                <span
-                  class="block font-medium text-sm text-gray-800 dark:text-neutral-200"
-                >
-                  {firekitAuthManager.data?.displayName}
-                </span>
-                <p class="text-xs text-foreground-500">
-                  {firekitAuthManager.data?.email}
-                </p>
-              </div>
-            </div>
-            <Button onclick={handleLogout} variant="link">
-              <LogOut />Logout
-            </Button>
-          </div>
-        </AlertDialog.Title>
-        <AlertDialog.Description>
-          Manage your name, password and account settings.
-        </AlertDialog.Description>
-      </AlertDialog.Header>
-      <AlertDialog.Footer>
-        <AlertDialog.Cancel>Cancel</AlertDialog.Cancel>
-        <AlertDialog.Action>Continue</AlertDialog.Action>
-      </AlertDialog.Footer>
-    </AlertDialog.Content>
-  </AlertDialog.Root>
-{:else}
-  <Button href="/login">Login</Button>
-{/if}

package/dist/components/auth/user-button/user-button.svelte.d.ts

@@ -1,6 +0,0 @@
-import type { NavItem } from "../../../types/nav.js";
-declare const UserButton: import("svelte").Component<{
-    nav?: NavItem[];
-    redirectTo: string;
-}, {}, "">;
-export default UserButton;

package/dist/components/firestore/collection.svelte

@@ -1,45 +0,0 @@
-<script lang="ts" generics="Data extends DocumentData">
-    import { firekitCollection } from "../../firebase/firestore/collection.svelte.js";
-    import type {
-        CollectionReference,
-        DocumentData,
-        QueryConstraint,
-    } from "firebase/firestore";
-    import type { Snippet } from "svelte";
-
-    let {
-        path,
-        queryConstraints,
-        children,
-        loading,
-        error,
-    }: {
-        path: string;
-        queryConstraints?: QueryConstraint[];
-        children?: Snippet<[data: Data[], ref: CollectionReference]>;
-        loading?: Snippet;
-        error?: Snippet<[error: Error]>;
-    } = $props();
-
-    let collection = queryConstraints
-        ? firekitCollection<Data>(path, ...queryConstraints)
-        : firekitCollection<Data>(path);
-</script>
-
-{#if collection.loading}
-    {#if loading}
-        {@render loading()}
-    {:else}
-        <div>Loading...</div>
-    {/if}
-{:else if collection.error}
-    {#if error}
-        {@render error(collection.error)}
-    {:else}
-        <div>Error: {collection.error.message}</div>
-    {/if}
-{:else if collection.data}
-    {#if children}
-        {@render children(collection.data, collection.ref)}
-    {/if}
-{/if}

package/dist/components/firestore/collection.svelte.d.ts

@@ -1,25 +0,0 @@
-import type { CollectionReference, DocumentData, QueryConstraint } from "firebase/firestore";
-import type { Snippet } from "svelte";
-declare class __sveltets_Render<Data extends DocumentData> {
-    props(): {
-        path: string;
-        queryConstraints?: QueryConstraint[];
-        children?: Snippet<[data: Data[], ref: CollectionReference<DocumentData, DocumentData>]> | undefined;
-        loading?: Snippet;
-        error?: Snippet<[error: Error]>;
-    };
-    events(): {};
-    slots(): {};
-    bindings(): "";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <Data extends DocumentData>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Data>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Data>['props']>, ReturnType<__sveltets_Render<Data>['events']>, ReturnType<__sveltets_Render<Data>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<Data>['bindings']>;
-    } & ReturnType<__sveltets_Render<Data>['exports']>;
-    <Data extends DocumentData>(internal: unknown, props: ReturnType<__sveltets_Render<Data>['props']> & {}): ReturnType<__sveltets_Render<Data>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const Collection: $$IsomorphicComponent;
-type Collection<Data extends DocumentData> = InstanceType<typeof Collection<Data>>;
-export default Collection;

package/dist/components/firestore/doc.svelte

@@ -1,39 +0,0 @@
-<script lang="ts" generics="Data extends DocumentData">
-    import { firekitDoc } from "../../firebase/firestore/doc.svelte.js";
-    import type { DocumentData, DocumentReference } from "firebase/firestore";
-    import type { Snippet } from "svelte";
-
-    let {
-        ref,
-        startWith,
-        children,
-        loading,
-        error,
-    }: {
-        ref: string | DocumentReference<Data>;
-        startWith?: Data | undefined;
-        children?: Snippet<[data: Data, ref: DocumentReference<Data>]>;
-        loading?: Snippet;
-        error?: Snippet<[error: Error]>;
-    } = $props();
-
-    let doc = firekitDoc<Data>(ref, startWith);
-</script>
-
-{#if doc.loading}
-    {#if loading}
-        {@render loading()}
-    {:else}
-        <div>Loading...</div>
-    {/if}
-{:else if doc.error}
-    {#if error}
-        {@render error(doc.error)}
-    {:else}
-        <div>Error: {doc.error.message}</div>
-    {/if}
-{:else if doc.data}
-    {#if children}
-        {@render children(doc.data, doc.ref)}
-    {/if}
-{/if}

package/dist/components/firestore/doc.svelte.d.ts

@@ -1,25 +0,0 @@
-import type { DocumentData, DocumentReference } from "firebase/firestore";
-import type { Snippet } from "svelte";
-declare class __sveltets_Render<Data extends DocumentData> {
-    props(): {
-        ref: string | DocumentReference<Data, DocumentData>;
-        startWith?: Data | undefined;
-        children?: Snippet<[data: Data, ref: DocumentReference<Data, DocumentData>]> | undefined;
-        loading?: Snippet;
-        error?: Snippet<[error: Error]>;
-    };
-    events(): {};
-    slots(): {};
-    bindings(): "";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <Data extends DocumentData>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Data>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Data>['props']>, ReturnType<__sveltets_Render<Data>['events']>, ReturnType<__sveltets_Render<Data>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<Data>['bindings']>;
-    } & ReturnType<__sveltets_Render<Data>['exports']>;
-    <Data extends DocumentData>(internal: unknown, props: ReturnType<__sveltets_Render<Data>['props']> & {}): ReturnType<__sveltets_Render<Data>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const Doc: $$IsomorphicComponent;
-type Doc<Data extends DocumentData> = InstanceType<typeof Doc<Data>>;
-export default Doc;

package/dist/components/nav/app-sidebar.svelte

@@ -1,46 +0,0 @@
-<script lang="ts">
-	import SearchForm from "./search-form.svelte";
-	import VersionSwitcher from "./version-switcher.svelte";
-	import * as Sidebar from "../ui/sidebar/index.js";
-	import type { ComponentProps } from "svelte";
-	import { nav } from "./nav.js";
-
-	let {
-		ref = $bindable(null),
-		...restProps
-	}: ComponentProps<typeof Sidebar.Root> = $props();
-</script>
-
-<Sidebar.Root {...restProps} bind:ref>
-	<Sidebar.Header>
-		<VersionSwitcher
-			versions={nav.versions}
-			defaultVersion={nav.versions[0]}
-		/>
-		<SearchForm />
-	</Sidebar.Header>
-	<Sidebar.Content>
-		<!-- We create a Sidebar.Group for each parent. -->
-		{#each nav.navMain as group (group.title)}
-			<Sidebar.Group>
-				<Sidebar.GroupLabel>{group.title}</Sidebar.GroupLabel>
-				<Sidebar.GroupContent>
-					<Sidebar.Menu>
-						{#each group.items as item (item.title)}
-							<Sidebar.MenuItem>
-								<Sidebar.MenuButton isActive={item.isActive}>
-									{#snippet child({ props })}
-										<a href={item.url} {...props}
-											>{item.title}</a
-										>
-									{/snippet}
-								</Sidebar.MenuButton>
-							</Sidebar.MenuItem>
-						{/each}
-					</Sidebar.Menu>
-				</Sidebar.GroupContent>
-			</Sidebar.Group>
-		{/each}
-	</Sidebar.Content>
-	<Sidebar.Rail />
-</Sidebar.Root>

package/dist/components/nav/app-sidebar.svelte.d.ts

@@ -1,8 +0,0 @@
-declare const AppSidebar: import("svelte").Component<import("svelte/elements").HTMLAttributes<HTMLDivElement> & {
-    ref?: HTMLElement | null | undefined;
-} & {
-    side?: "left" | "right";
-    variant?: "sidebar" | "floating" | "inset";
-    collapsible?: "offcanvas" | "icon" | "none";
-}, {}, "ref">;
-export default AppSidebar;