@getmicdrop/svelte-components 2.0.4 → 2.0.6

package/dist/components/pages/performers/VenueItemCard.svelte

@@ -2,10 +2,10 @@
   import Input from "../../Input/Input.svelte";
   import Modal from "../../Modal/Modal.svelte";
   import VenueInfo from "./VenueInfo.svelte";
-  import { showToast } from "../../../../stores/toaster";
-  import { getPerformerToken } from "../../../utils/utils";
-  import { timeAgo } from "../../../utils/utils/utils";
-  import { buildApiUrl, API_ENDPOINTS } from "../../../utils/apiConfig";
+  import { showToast } from "../../stores/toaster";
+  import { getPerformerToken } from "../../utils/utils";
+  import { timeAgo } from "../../utils/utils/utils";
+  import { buildApiUrl, API_ENDPOINTS } from "../../utils/apiConfig";
   import { Dropdown, DropdownItem } from "flowbite-svelte";
   import { DotsHorizontalOutline } from "flowbite-svelte-icons";
   import Button from "../../Button/Button.svelte";

package/dist/components/pages/profile/profile-form.spec.js

@@ -1,9 +1,9 @@
-import { describe, it, expect, vi } from 'vitest';
-
-// Skip profile-form tests - complex component with many dependencies
-// This component is better tested via E2E tests
-describe.skip('ProfileForm', () => {
-  it('placeholder', () => {
-    expect(true).toBe(true);
-  });
-});
+import { describe, it, expect, vi } from 'vitest';
+
+// Skip profile-form tests - complex component with many dependencies
+// This component is better tested via E2E tests
+describe.skip('ProfileForm', () => {
+  it('placeholder', () => {
+    expect(true).toBe(true);
+  });
+});

package/dist/components/pages/settings/tabs/CustomImageDropzone.svelte

@@ -4,10 +4,10 @@
   export let readonly = false;
   export let shape = "default";
   export let label = "";
-  import CancelIcon from "../../../../../assets/svg/cancel.svg";
+  import CancelIcon from "../../../assets/svg/cancel.svg";
 
-  import AddMain from "../../../../../assets/svg/add-main-01.svg";
-  import CloudUpload from "../../../../../assets/svg/cloud-upload.svg";
+  import AddMain from "../../../assets/svg/add-main-01.svg";
+  import CloudUpload from "../../../assets/svg/cloud-upload.svg";
 
   let images = [];
   let error = "";

package/dist/components/pages/shows/ShowList.spec.js

@@ -1,33 +1,33 @@
-import { describe, it, expect } from 'vitest';
-import { render } from '@testing-library/svelte';
-import ShowList from './ShowList.svelte';
-
-describe('ShowList Component', () => {
-  it('renders empty list when no shows provided', () => {
-    const { container } = render(ShowList, { props: { shows: [], status: '' } });
-    const grid = container.querySelector('.grid');
-    expect(grid).toBeTruthy();
-    expect(grid.children.length).toBe(0);
-  });
-
-  it('has grid layout classes', () => {
-    const { container } = render(ShowList, { props: { shows: [], status: '' } });
-    const grid = container.querySelector('.grid');
-    expect(grid.classList.contains('grid-cols-1')).toBe(true);
-    expect(grid.classList.contains('lg:grid-cols-2')).toBe(true);
-    expect(grid.classList.contains('gap-4')).toBe(true);
-  });
-
-  it('has responsive margin-top classes', () => {
-    const { container } = render(ShowList, { props: { shows: [], status: '' } });
-    const grid = container.querySelector('.grid');
-    expect(grid.classList.contains('mt-0')).toBe(true);
-    expect(grid.classList.contains('sm:mt-2')).toBe(true);
-  });
-
-  it('has items-start alignment', () => {
-    const { container } = render(ShowList, { props: { shows: [], status: '' } });
-    const grid = container.querySelector('.grid');
-    expect(grid.classList.contains('items-start')).toBe(true);
-  });
-});
+import { describe, it, expect } from 'vitest';
+import { render } from '@testing-library/svelte';
+import ShowList from './ShowList.svelte';
+
+describe('ShowList Component', () => {
+  it('renders empty list when no shows provided', () => {
+    const { container } = render(ShowList, { props: { shows: [], status: '' } });
+    const grid = container.querySelector('.grid');
+    expect(grid).toBeTruthy();
+    expect(grid.children.length).toBe(0);
+  });
+
+  it('has grid layout classes', () => {
+    const { container } = render(ShowList, { props: { shows: [], status: '' } });
+    const grid = container.querySelector('.grid');
+    expect(grid.classList.contains('grid-cols-1')).toBe(true);
+    expect(grid.classList.contains('lg:grid-cols-2')).toBe(true);
+    expect(grid.classList.contains('gap-4')).toBe(true);
+  });
+
+  it('has responsive margin-top classes', () => {
+    const { container } = render(ShowList, { props: { shows: [], status: '' } });
+    const grid = container.querySelector('.grid');
+    expect(grid.classList.contains('mt-0')).toBe(true);
+    expect(grid.classList.contains('sm:mt-2')).toBe(true);
+  });
+
+  it('has items-start alignment', () => {
+    const { container } = render(ShowList, { props: { shows: [], status: '' } });
+    const grid = container.querySelector('.grid');
+    expect(grid.classList.contains('items-start')).toBe(true);
+  });
+});

package/dist/components/pages/shows/TabContent.spec.js

@@ -1,90 +1,90 @@
-import { describe, it, expect, vi } from 'vitest';
-
-// TabContent has complex child component dependencies (SectionHeader, ShowList)
-// that don't mock properly with testing-library/svelte.
-// The component logic is tested through its child components and E2E tests.
-
-describe('TabContent Component Logic', () => {
-  describe('content configuration', () => {
-    // Testing the content object structure
-    const content = {
-      upcoming: {
-        title: "Upcoming shows",
-        description:
-          "Currently, there are no upcoming shows. Once a venue schedules a new show, it will appear here.",
-      },
-      invitations: {
-        title: "Booking invites",
-        description:
-          "You currently have no show invites. Once you receive an invite, it will appear here.",
-      },
-      declined: {
-        title: "Declined invites",
-        description:
-          "You haven't declined any shows yet. Once you decline an invitation, it will appear here.",
-        notice: "Events on this page will be automatically removed after 30 days.",
-      },
-      past: {
-        title: "Past shows",
-        description:
-          "You currently have no past shows. Once you complete a show, it will be listed here.",
-        notice: "Events on this page will be automatically removed after 30 days.",
-      },
-    };
-
-    it('has upcoming content with title and description', () => {
-      expect(content.upcoming.title).toBe('Upcoming shows');
-      expect(content.upcoming.description).toBeDefined();
-    });
-
-    it('has invitations content with title and description', () => {
-      expect(content.invitations.title).toBe('Booking invites');
-      expect(content.invitations.description).toBeDefined();
-    });
-
-    it('has declined content with title, description, and notice', () => {
-      expect(content.declined.title).toBe('Declined invites');
-      expect(content.declined.description).toBeDefined();
-      expect(content.declined.notice).toContain('30 days');
-    });
-
-    it('has past content with title, description, and notice', () => {
-      expect(content.past.title).toBe('Past shows');
-      expect(content.past.description).toBeDefined();
-      expect(content.past.notice).toContain('30 days');
-    });
-
-    it('upcoming and invitations do not have notice', () => {
-      expect(content.upcoming.notice).toBeUndefined();
-      expect(content.invitations.notice).toBeUndefined();
-    });
-  });
-
-  describe('loadedItems structure', () => {
-    const createLoadedItems = () => ({
-      upcoming: { data: [], isMoreLoading: false },
-      invitations: { data: [], isMoreLoading: false },
-      declined: { data: [], isMoreLoading: false },
-      past: { data: [], isMoreLoading: false },
-    });
-
-    it('creates correct structure with data array', () => {
-      const items = createLoadedItems();
-      expect(Array.isArray(items.upcoming.data)).toBe(true);
-      expect(Array.isArray(items.invitations.data)).toBe(true);
-    });
-
-    it('creates correct structure with isMoreLoading flag', () => {
-      const items = createLoadedItems();
-      expect(typeof items.upcoming.isMoreLoading).toBe('boolean');
-      expect(typeof items.past.isMoreLoading).toBe('boolean');
-    });
-  });
-
-  describe('IntersectionObserver threshold', () => {
-    it('uses 0.1 threshold for infinite scroll', () => {
-      const threshold = 0.1;
-      expect(threshold).toBe(0.1);
-    });
-  });
-});
+import { describe, it, expect, vi } from 'vitest';
+
+// TabContent has complex child component dependencies (SectionHeader, ShowList)
+// that don't mock properly with testing-library/svelte.
+// The component logic is tested through its child components and E2E tests.
+
+describe('TabContent Component Logic', () => {
+  describe('content configuration', () => {
+    // Testing the content object structure
+    const content = {
+      upcoming: {
+        title: "Upcoming shows",
+        description:
+          "Currently, there are no upcoming shows. Once a venue schedules a new show, it will appear here.",
+      },
+      invitations: {
+        title: "Booking invites",
+        description:
+          "You currently have no show invites. Once you receive an invite, it will appear here.",
+      },
+      declined: {
+        title: "Declined invites",
+        description:
+          "You haven't declined any shows yet. Once you decline an invitation, it will appear here.",
+        notice: "Events on this page will be automatically removed after 30 days.",
+      },
+      past: {
+        title: "Past shows",
+        description:
+          "You currently have no past shows. Once you complete a show, it will be listed here.",
+        notice: "Events on this page will be automatically removed after 30 days.",
+      },
+    };
+
+    it('has upcoming content with title and description', () => {
+      expect(content.upcoming.title).toBe('Upcoming shows');
+      expect(content.upcoming.description).toBeDefined();
+    });
+
+    it('has invitations content with title and description', () => {
+      expect(content.invitations.title).toBe('Booking invites');
+      expect(content.invitations.description).toBeDefined();
+    });
+
+    it('has declined content with title, description, and notice', () => {
+      expect(content.declined.title).toBe('Declined invites');
+      expect(content.declined.description).toBeDefined();
+      expect(content.declined.notice).toContain('30 days');
+    });
+
+    it('has past content with title, description, and notice', () => {
+      expect(content.past.title).toBe('Past shows');
+      expect(content.past.description).toBeDefined();
+      expect(content.past.notice).toContain('30 days');
+    });
+
+    it('upcoming and invitations do not have notice', () => {
+      expect(content.upcoming.notice).toBeUndefined();
+      expect(content.invitations.notice).toBeUndefined();
+    });
+  });
+
+  describe('loadedItems structure', () => {
+    const createLoadedItems = () => ({
+      upcoming: { data: [], isMoreLoading: false },
+      invitations: { data: [], isMoreLoading: false },
+      declined: { data: [], isMoreLoading: false },
+      past: { data: [], isMoreLoading: false },
+    });
+
+    it('creates correct structure with data array', () => {
+      const items = createLoadedItems();
+      expect(Array.isArray(items.upcoming.data)).toBe(true);
+      expect(Array.isArray(items.invitations.data)).toBe(true);
+    });
+
+    it('creates correct structure with isMoreLoading flag', () => {
+      const items = createLoadedItems();
+      expect(typeof items.upcoming.isMoreLoading).toBe('boolean');
+      expect(typeof items.past.isMoreLoading).toBe('boolean');
+    });
+  });
+
+  describe('IntersectionObserver threshold', () => {
+    it('uses 0.1 threshold for infinite scroll', () => {
+      const threshold = 0.1;
+      expect(threshold).toBe(0.1);
+    });
+  });
+});

package/dist/components/pages/shows/TabNavigation.spec.js

@@ -1,143 +1,143 @@
-import { render, screen, fireEvent } from "@testing-library/svelte";
-import userEvent from "@testing-library/user-event";
-import { expect, describe, test, vi } from "vitest";
-import TabNavigation from "./TabNavigation.svelte";
-
-const sampleTabs = [
-  { key: "upcoming", label: "Upcoming" },
-  { key: "invitations", label: "Invitations", badge: () => 3 },
-  { key: "declined", label: "Declined" },
-  { key: "past", label: "Past" },
-];
-
-function setupTest(args = {}) {
-  const user = userEvent.setup();
-  const { component, container } = render(TabNavigation, {
-    props: {
-      tabs: sampleTabs,
-      activeTab: "upcoming",
-      ...args,
-    },
-  });
-  return { user, component, container };
-}
-
-describe("TabNavigation Component Tests", () => {
-  test("Renders all tabs", () => {
-    setupTest();
-    expect(screen.getByText("Upcoming")).toBeInTheDocument();
-    expect(screen.getByText("Invitations")).toBeInTheDocument();
-    expect(screen.getByText("Declined")).toBeInTheDocument();
-    expect(screen.getByText("Past")).toBeInTheDocument();
-  });
-
-  test("Tabs have tab role", () => {
-    setupTest();
-    const tabs = screen.getAllByRole("tab");
-    expect(tabs.length).toBe(4);
-  });
-
-  test("Active tab has active class", () => {
-    setupTest({ activeTab: "upcoming" });
-    const upcomingTab = screen.getByText("Upcoming").closest('[role="tab"]');
-    expect(upcomingTab).toHaveClass("active");
-  });
-
-  test("Non-active tabs do not have active class", () => {
-    setupTest({ activeTab: "upcoming" });
-    const declinedTab = screen.getByText("Declined").closest('[role="tab"]');
-    expect(declinedTab).not.toHaveClass("active");
-  });
-
-  test("Dispatches tabChange event on click", async () => {
-    const { user, component } = setupTest({ activeTab: "upcoming" });
-    const changeSpy = vi.fn();
-    component.$on("tabChange", changeSpy);
-
-    await user.click(screen.getByText("Declined"));
-
-    expect(changeSpy).toHaveBeenCalled();
-    expect(changeSpy.mock.calls[0][0].detail).toBe("declined");
-  });
-
-  test("Dispatches tabChange event on Enter key", async () => {
-    const { user, component } = setupTest({ activeTab: "upcoming" });
-    const changeSpy = vi.fn();
-    component.$on("tabChange", changeSpy);
-
-    const declinedTab = screen.getByText("Declined").closest('[role="tab"]');
-    declinedTab.focus();
-    await user.keyboard("{Enter}");
-
-    expect(changeSpy).toHaveBeenCalled();
-    expect(changeSpy.mock.calls[0][0].detail).toBe("declined");
-  });
-
-  test("Tabs are focusable", () => {
-    setupTest();
-    const tabs = screen.getAllByRole("tab");
-    tabs.forEach((tab) => {
-      expect(tab).toHaveAttribute("tabindex", "0");
-    });
-  });
-
-  test("Shows badge indicator for invitations when badge returns truthy", () => {
-    const { container } = setupTest({ activeTab: "upcoming" });
-    // Look for the red dot badge
-    const badge = container.querySelector(".bg-red-500.rounded-full");
-    expect(badge).toBeInTheDocument();
-  });
-
-  test("Does not show badge for tabs without badge function", () => {
-    const tabsWithoutBadge = [
-      { key: "upcoming", label: "Upcoming" },
-      { key: "past", label: "Past" },
-    ];
-    const { container } = render(TabNavigation, {
-      props: { tabs: tabsWithoutBadge, activeTab: "upcoming" },
-    });
-    const badges = container.querySelectorAll(".bg-red-500.rounded-full");
-    expect(badges.length).toBe(0);
-  });
-
-  test("Has flex layout", () => {
-    const { container } = setupTest();
-    const wrapper = container.firstChild;
-    expect(wrapper).toHaveClass("flex");
-    expect(wrapper).toHaveClass("flex-row");
-  });
-
-  test("Switching active tab updates appearance", async () => {
-    const { user, component } = setupTest({ activeTab: "upcoming" });
-
-    // Initially upcoming is active
-    let upcomingTab = screen.getByText("Upcoming").closest('[role="tab"]');
-    expect(upcomingTab).toHaveClass("active");
-
-    // Update the active tab prop
-    await component.$set({ activeTab: "past" });
-
-    // Now past should be active
-    const pastTab = screen.getByText("Past").closest('[role="tab"]');
-    expect(pastTab).toHaveClass("active");
-
-    // And upcoming should no longer be active
-    upcomingTab = screen.getByText("Upcoming").closest('[role="tab"]');
-    expect(upcomingTab).not.toHaveClass("active");
-  });
-
-  test("Works with empty tabs array", () => {
-    const { container } = render(TabNavigation, {
-      props: { tabs: [], activeTab: "" },
-    });
-    const tabs = screen.queryAllByRole("tab");
-    expect(tabs.length).toBe(0);
-  });
-
-  test("Works with single tab", () => {
-    render(TabNavigation, {
-      props: { tabs: [{ key: "only", label: "Only Tab" }], activeTab: "only" },
-    });
-    expect(screen.getByText("Only Tab")).toBeInTheDocument();
-  });
-});
+import { render, screen, fireEvent } from "@testing-library/svelte";
+import userEvent from "@testing-library/user-event";
+import { expect, describe, test, vi } from "vitest";
+import TabNavigation from "./TabNavigation.svelte";
+
+const sampleTabs = [
+  { key: "upcoming", label: "Upcoming" },
+  { key: "invitations", label: "Invitations", badge: () => 3 },
+  { key: "declined", label: "Declined" },
+  { key: "past", label: "Past" },
+];
+
+function setupTest(args = {}) {
+  const user = userEvent.setup();
+  const { component, container } = render(TabNavigation, {
+    props: {
+      tabs: sampleTabs,
+      activeTab: "upcoming",
+      ...args,
+    },
+  });
+  return { user, component, container };
+}
+
+describe("TabNavigation Component Tests", () => {
+  test("Renders all tabs", () => {
+    setupTest();
+    expect(screen.getByText("Upcoming")).toBeInTheDocument();
+    expect(screen.getByText("Invitations")).toBeInTheDocument();
+    expect(screen.getByText("Declined")).toBeInTheDocument();
+    expect(screen.getByText("Past")).toBeInTheDocument();
+  });
+
+  test("Tabs have tab role", () => {
+    setupTest();
+    const tabs = screen.getAllByRole("tab");
+    expect(tabs.length).toBe(4);
+  });
+
+  test("Active tab has active class", () => {
+    setupTest({ activeTab: "upcoming" });
+    const upcomingTab = screen.getByText("Upcoming").closest('[role="tab"]');
+    expect(upcomingTab).toHaveClass("active");
+  });
+
+  test("Non-active tabs do not have active class", () => {
+    setupTest({ activeTab: "upcoming" });
+    const declinedTab = screen.getByText("Declined").closest('[role="tab"]');
+    expect(declinedTab).not.toHaveClass("active");
+  });
+
+  test("Dispatches tabChange event on click", async () => {
+    const { user, component } = setupTest({ activeTab: "upcoming" });
+    const changeSpy = vi.fn();
+    component.$on("tabChange", changeSpy);
+
+    await user.click(screen.getByText("Declined"));
+
+    expect(changeSpy).toHaveBeenCalled();
+    expect(changeSpy.mock.calls[0][0].detail).toBe("declined");
+  });
+
+  test("Dispatches tabChange event on Enter key", async () => {
+    const { user, component } = setupTest({ activeTab: "upcoming" });
+    const changeSpy = vi.fn();
+    component.$on("tabChange", changeSpy);
+
+    const declinedTab = screen.getByText("Declined").closest('[role="tab"]');
+    declinedTab.focus();
+    await user.keyboard("{Enter}");
+
+    expect(changeSpy).toHaveBeenCalled();
+    expect(changeSpy.mock.calls[0][0].detail).toBe("declined");
+  });
+
+  test("Tabs are focusable", () => {
+    setupTest();
+    const tabs = screen.getAllByRole("tab");
+    tabs.forEach((tab) => {
+      expect(tab).toHaveAttribute("tabindex", "0");
+    });
+  });
+
+  test("Shows badge indicator for invitations when badge returns truthy", () => {
+    const { container } = setupTest({ activeTab: "upcoming" });
+    // Look for the red dot badge
+    const badge = container.querySelector(".bg-red-500.rounded-full");
+    expect(badge).toBeInTheDocument();
+  });
+
+  test("Does not show badge for tabs without badge function", () => {
+    const tabsWithoutBadge = [
+      { key: "upcoming", label: "Upcoming" },
+      { key: "past", label: "Past" },
+    ];
+    const { container } = render(TabNavigation, {
+      props: { tabs: tabsWithoutBadge, activeTab: "upcoming" },
+    });
+    const badges = container.querySelectorAll(".bg-red-500.rounded-full");
+    expect(badges.length).toBe(0);
+  });
+
+  test("Has flex layout", () => {
+    const { container } = setupTest();
+    const wrapper = container.firstChild;
+    expect(wrapper).toHaveClass("flex");
+    expect(wrapper).toHaveClass("flex-row");
+  });
+
+  test("Switching active tab updates appearance", async () => {
+    const { user, component } = setupTest({ activeTab: "upcoming" });
+
+    // Initially upcoming is active
+    let upcomingTab = screen.getByText("Upcoming").closest('[role="tab"]');
+    expect(upcomingTab).toHaveClass("active");
+
+    // Update the active tab prop
+    await component.$set({ activeTab: "past" });
+
+    // Now past should be active
+    const pastTab = screen.getByText("Past").closest('[role="tab"]');
+    expect(pastTab).toHaveClass("active");
+
+    // And upcoming should no longer be active
+    upcomingTab = screen.getByText("Upcoming").closest('[role="tab"]');
+    expect(upcomingTab).not.toHaveClass("active");
+  });
+
+  test("Works with empty tabs array", () => {
+    const { container } = render(TabNavigation, {
+      props: { tabs: [], activeTab: "" },
+    });
+    const tabs = screen.queryAllByRole("tab");
+    expect(tabs.length).toBe(0);
+  });
+
+  test("Works with single tab", () => {
+    render(TabNavigation, {
+      props: { tabs: [{ key: "only", label: "Only Tab" }], activeTab: "only" },
+    });
+    expect(screen.getByText("Only Tab")).toBeInTheDocument();
+  });
+});

package/dist/config.js

@@ -1,6 +1,6 @@
-export const API_BASE_URL =
-  import.meta.env.VITE_API_BASE_URL || 'https://get-micdrop.com';
-
-export const PUBLIC_GOOGLE_MAPS_API_KEY =
-  import.meta.env.VITE_PUBLIC_GOOGLE_MAPS_API_KEY ||
+export const API_BASE_URL =
+  import.meta.env.VITE_API_BASE_URL || 'https://get-micdrop.com';
+
+export const PUBLIC_GOOGLE_MAPS_API_KEY =
+  import.meta.env.VITE_PUBLIC_GOOGLE_MAPS_API_KEY ||
   'AIzaSyCFB0-9qay7P0jZZDw93SsTnyLtZDlch7Q';