@getmicdrop/svelte-components 3.1.0 → 4.1.0

package/dist/components/pages/performers/ShowItemCard.svelte.d.ts

@@ -1,55 +0,0 @@
-export default ShowItemCard;
-type ShowItemCard = SvelteComponent<{
-    title: any;
-    status: any;
-    details: any;
-    image: any;
-    id: any;
-    location: any;
-    startDateTime: any;
-    doorsOpenTime: any;
-    venueName: any;
-    role: any;
-    venueId: any;
-    spotDuration: any;
-    lastUpdated: any;
-    invitationAccepted?: boolean | undefined;
-    hasAvailability?: boolean | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const ShowItemCard: $$__sveltets_2_IsomorphicComponent<{
-    title: any;
-    status: any;
-    details: any;
-    image: any;
-    id: any;
-    location: any;
-    startDateTime: any;
-    doorsOpenTime: any;
-    venueName: any;
-    role: any;
-    venueId: any;
-    spotDuration: any;
-    lastUpdated: any;
-    invitationAccepted?: boolean | undefined;
-    hasAvailability?: boolean | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-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: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-//# sourceMappingURL=ShowItemCard.svelte.d.ts.map

package/dist/components/pages/performers/ShowItemCard.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ShowItemCard.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/pages/performers/ShowItemCard.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAgpBA;;;;;;;;;;;;;;;;;;mBAAkK;6CATrH,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/pages/performers/SwitchOption.spec.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=SwitchOption.spec.d.ts.map

package/dist/components/pages/performers/SwitchOption.spec.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SwitchOption.spec.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/pages/performers/SwitchOption.spec.js"],"names":[],"mappings":""}

package/dist/components/pages/performers/SwitchOption.spec.js

@@ -1,127 +0,0 @@
-import { render, screen, fireEvent } from "@testing-library/svelte";
-import userEvent from "@testing-library/user-event";
-import { expect, describe, test, vi } from "vitest";
-import SwitchOption from "./SwitchOption.svelte";
-
-function setupTest(args = {}) {
-  const user = userEvent.setup();
-  const onToggle = vi.fn();
-  const { component, container } = render(SwitchOption, {
-    props: {
-      label: "Test Switch",
-      checked: false,
-      onToggle,
-      ...args,
-    },
-  });
-  return { user, component, container, onToggle };
-}
-
-describe("SwitchOption Component Tests", () => {
-  test("Renders switch with label", () => {
-    setupTest({ label: "Enable Feature" });
-    expect(screen.getByText("Enable Feature")).toBeInTheDocument();
-  });
-
-  test("Renders checkbox input", () => {
-    setupTest();
-    const checkbox = screen.getByRole("checkbox");
-    expect(checkbox).toBeInTheDocument();
-  });
-
-  test("Checkbox is hidden for accessibility (sr-only)", () => {
-    setupTest();
-    const checkbox = screen.getByRole("checkbox");
-    expect(checkbox).toHaveClass("sr-only");
-  });
-
-  test("Checkbox is unchecked by default", () => {
-    setupTest({ checked: false });
-    const checkbox = screen.getByRole("checkbox");
-    expect(checkbox).not.toBeChecked();
-  });
-
-  test("Checkbox is checked when checked prop is true", () => {
-    setupTest({ checked: true });
-    const checkbox = screen.getByRole("checkbox");
-    expect(checkbox).toBeChecked();
-  });
-
-  test("Calls onToggle when clicked", async () => {
-    const { user, onToggle } = setupTest();
-    const checkbox = screen.getByRole("checkbox");
-
-    await user.click(checkbox);
-
-    expect(onToggle).toHaveBeenCalledTimes(1);
-  });
-
-  test("Passes checked state to onToggle", async () => {
-    const { user, onToggle } = setupTest({ checked: false });
-    const checkbox = screen.getByRole("checkbox");
-
-    await user.click(checkbox);
-
-    // After clicking, checkbox becomes checked (true)
-    expect(onToggle).toHaveBeenCalledWith(true);
-  });
-
-  test("Has full width container", () => {
-    const { container } = setupTest();
-    const wrapper = container.firstChild;
-    expect(wrapper).toHaveClass("w-full");
-  });
-
-  test("Uses flexbox layout", () => {
-    const { container } = setupTest();
-    const wrapper = container.firstChild;
-    expect(wrapper).toHaveClass("flex");
-    expect(wrapper).toHaveClass("items-center");
-    expect(wrapper).toHaveClass("justify-between");
-  });
-
-  test("Label has correct styling", () => {
-    setupTest({ label: "My Label" });
-    const label = screen.getByText("My Label");
-    expect(label).toHaveClass("text-sm");
-    expect(label).toHaveClass("font-medium");
-    expect(label).toHaveClass("text-gray-700");
-  });
-
-  test("Has pointer cursor on label", () => {
-    const { container } = setupTest();
-    const labelElement = container.querySelector("label");
-    expect(labelElement).toHaveClass("cursor-pointer");
-  });
-
-  test("Toggle track has correct base classes", () => {
-    const { container } = setupTest();
-    const track = container.querySelector(".bg-gray-200");
-    expect(track).toBeInTheDocument();
-    expect(track).toHaveClass("rounded-full");
-    expect(track).toHaveClass("w-11");
-    expect(track).toHaveClass("h-6");
-  });
-
-  test("Toggle knob has correct base classes", () => {
-    const { container } = setupTest();
-    const knob = container.querySelector(".bg-white");
-    expect(knob).toBeInTheDocument();
-    expect(knob).toHaveClass("rounded-full");
-    expect(knob).toHaveClass("w-5");
-    expect(knob).toHaveClass("h-5");
-  });
-
-  test("Updates visual state on toggle", async () => {
-    const { user, container, component } = setupTest({ checked: false });
-    const checkbox = screen.getByRole("checkbox");
-
-    // Initially unchecked
-    expect(checkbox).not.toBeChecked();
-
-    await user.click(checkbox);
-
-    // The component's checked state should update
-    expect(checkbox).toBeChecked();
-  });
-});

package/dist/components/pages/performers/SwitchOption.stories.svelte

@@ -1,208 +0,0 @@
-<script module>
-  import { defineMeta } from "@storybook/addon-svelte-csf";
-
-    import SwitchOption from "./SwitchOption.svelte";
-
-  const { Story } = defineMeta({
-    title: "Pages/Performers/SwitchOption",
-    component: SwitchOption,
-    argTypes: {
-      label: { control: "text" },
-      checked: { control: "boolean" },
-    },
-  });
-
-  const handleToggle = (value) => {
-    console.log("Toggle changed:", value);
-  };
-
-</script>
-
-
-<Story
-  name="Email Notifications"
-  args={{
-    label: "Email Notifications",
-    checked: true,
-    onToggle: handleToggle,
-  }}
-/>
-
-<Story
-  name="SMS Alerts"
-  args={{
-    label: "SMS Alerts",
-    checked: false,
-    onToggle: handleToggle,
-  }}
-/>
-
-<Story
-  name="Available for Bookings"
-  args={{
-    label: "Available for Bookings",
-    checked: true,
-    onToggle: handleToggle,
-  }}
-/>
-
-<Story
-  name="Show Calendar on Profile"
-  args={{
-    label: "Show Calendar on Profile",
-    checked: false,
-    onToggle: handleToggle,
-  }}
-/>
-
-<Story name="Settings Panel">
-  <div class="max-w-2xl p-6 bg-white border border-gray-200 rounded-lg">
-    <h3 class="text-lg font-semibold mb-4">Notification Preferences</h3>
-    <div class="space-y-1 divide-y">
-      <SwitchOption
-        label="New show invitations"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Booking confirmations"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Availability reminders"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Payment notifications"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Venue messages"
-        checked={false}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Marketing emails"
-        checked={false}
-        onToggle={handleToggle}
-      />
-    </div>
-  </div>
-</Story>
-
-<Story name="Privacy Settings">
-  <div class="max-w-2xl p-6 bg-white border border-gray-200 rounded-lg">
-    <h3 class="text-lg font-semibold mb-2">Privacy Settings</h3>
-    <p class="text-sm text-gray-600 mb-4">Control what information is visible to venues</p>
-    <div class="space-y-1 divide-y">
-      <SwitchOption
-        label="Show profile picture publicly"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Display contact information"
-        checked={false}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Share performance history"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Allow venue reviews"
-        checked={true}
-        onToggle={handleToggle}
-      />
-    </div>
-  </div>
-</Story>
-
-<Story name="Availability Controls">
-  <div class="max-w-2xl p-6 bg-white border border-gray-200 rounded-lg">
-    <h3 class="text-lg font-semibold mb-2">Availability Controls</h3>
-    <p class="text-sm text-gray-600 mb-4">Manage your booking preferences</p>
-    <div class="space-y-1 divide-y">
-      <SwitchOption
-        label="Accept weekend bookings"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Accept weekday bookings"
-        checked={true}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Auto-accept from trusted venues"
-        checked={false}
-        onToggle={handleToggle}
-      />
-      <SwitchOption
-        label="Allow last-minute bookings"
-        checked={false}
-        onToggle={handleToggle}
-      />
-    </div>
-  </div>
-</Story>
-
-<Story name="Single Option Focus">
-  <div class="max-w-md p-6 bg-white border border-gray-200 rounded-lg">
-    <div class="mb-4">
-      <h4 class="text-base font-semibold mb-1">Push Notifications</h4>
-      <p class="text-sm text-gray-600">
-        Receive instant alerts about new bookings and messages
-      </p>
-    </div>
-    <SwitchOption
-      label="Enable push notifications"
-      checked={true}
-      onToggle={handleToggle}
-    />
-  </div>
-</Story>
-
-<Story name="Compact List">
-  <div class="max-w-md">
-    <SwitchOption
-      label="Monday"
-      checked={true}
-      onToggle={handleToggle}
-    />
-    <SwitchOption
-      label="Tuesday"
-      checked={true}
-      onToggle={handleToggle}
-    />
-    <SwitchOption
-      label="Wednesday"
-      checked={false}
-      onToggle={handleToggle}
-    />
-    <SwitchOption
-      label="Thursday"
-      checked={true}
-      onToggle={handleToggle}
-    />
-    <SwitchOption
-      label="Friday"
-      checked={true}
-      onToggle={handleToggle}
-    />
-    <SwitchOption
-      label="Saturday"
-      checked={false}
-      onToggle={handleToggle}
-    />
-    <SwitchOption
-      label="Sunday"
-      checked={false}
-      onToggle={handleToggle}
-    />
-  </div>
-</Story>

package/dist/components/pages/performers/SwitchOption.stories.svelte.d.ts

@@ -1,28 +0,0 @@
-export default SwitchOption;
-type SwitchOption = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const SwitchOption: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-import SwitchOption from "./SwitchOption.svelte";
-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;
-}
-//# sourceMappingURL=SwitchOption.stories.svelte.d.ts.map

package/dist/components/pages/performers/SwitchOption.stories.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SwitchOption.stories.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/pages/performers/SwitchOption.stories.svelte.js"],"names":[],"mappings":";;;;;;;;AA0HA;;;;mBAAwH;yBArH3F,uBAAuB;6CA4GP,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,eAAe,QAAQ,CAAC"}

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

@@ -1,24 +0,0 @@
-<script>
-    export let label = "";
-    export let checked = false;
-    export let onToggle;
-</script>
-
-<div class="w-full flex items-center justify-between gap-4 py-2">
-    <span class="text-sm font-medium text-gray-600 dark:text-gray-400">{label}</span>
-    <label class="inline-flex relative items-center cursor-pointer">
-        <input
-            type="checkbox"
-            class="sr-only peer"
-            bind:checked
-            on:change={() => onToggle(checked)}
-        />
-        <div
-            class="w-11 h-6 bg-gray-200 dark:bg-gray-700 rounded-full peer peer-checked:bg-blue-600 peer-focus:ring-2 peer-focus:ring-blue-300 dark:peer-focus:ring-blue-800"
-        />
-        <div
-            class="w-5 h-5 bg-white dark:bg-gray-300 rounded-full peer-checked:translate-x-5 absolute left-0.5 top-0.5 transform transition-transform shadow"
-        />
-    </label>
-</div>
-  

package/dist/components/pages/performers/SwitchOption.svelte.d.ts

@@ -1,31 +0,0 @@
-export default SwitchOption;
-type SwitchOption = SvelteComponent<{
-    onToggle: any;
-    checked?: boolean | undefined;
-    label?: string | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const SwitchOption: $$__sveltets_2_IsomorphicComponent<{
-    onToggle: any;
-    checked?: boolean | undefined;
-    label?: string | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-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: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-//# sourceMappingURL=SwitchOption.svelte.d.ts.map

package/dist/components/pages/performers/SwitchOption.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SwitchOption.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/pages/performers/SwitchOption.svelte.js"],"names":[],"mappings":";;;;;;;;;;AA6BA;;;;;;mBAA6I;6CAThG,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/pages/performers/VenueInfo.spec.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=VenueInfo.spec.d.ts.map

package/dist/components/pages/performers/VenueInfo.spec.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"VenueInfo.spec.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/pages/performers/VenueInfo.spec.js"],"names":[],"mappings":""}

package/dist/components/pages/performers/VenueInfo.spec.js

@@ -1,167 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render } from '@testing-library/svelte';
-import VenueInfo from './VenueInfo.svelte';
-
-// Mock the utils
-vi.mock('@/utils/utils', () => ({
-  microphonePlaceholder: '/placeholder-mic.png',
-  parseLocation: vi.fn((location) => {
-    if (!location) return { street: '', cityStateZip: '' };
-    const parts = location.split(',').map((s) => s.trim());
-    if (parts.length >= 2) {
-      return {
-        street: parts[0],
-        cityStateZip: parts.slice(1).join(', '),
-      };
-    }
-    return { street: location, cityStateZip: '' };
-  }),
-}));
-
-describe('VenueInfo Component', () => {
-  const defaultProps = {
-    name: 'Comedy Club',
-    image: '/venue-image.jpg',
-    location: '123 Main St, Los Angeles, CA 90001',
-  };
-
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it('renders the component', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    expect(container.querySelector('.venue-info')).toBeDefined();
-  });
-
-  it('renders the venue name', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    expect(container.querySelector('.venue-name').textContent).toBe('Comedy Club');
-  });
-
-  it('renders venue image with CDN URL for relative paths', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    const img = container.querySelector('.venue-image img');
-    expect(img.src).toBe('https://moxy.sfo3.digitaloceanspaces.com/venue-image.jpg');
-  });
-
-  it('renders venue image directly for http URLs', () => {
-    const props = { ...defaultProps, image: 'https://example.com/image.jpg' };
-    const { container } = render(VenueInfo, { props });
-    const img = container.querySelector('.venue-image img');
-    expect(img.src).toBe('https://example.com/image.jpg');
-  });
-
-  it('uses placeholder when image is empty', () => {
-    const props = { ...defaultProps, image: '' };
-    const { container } = render(VenueInfo, { props });
-    const img = container.querySelector('.venue-image img');
-    expect(img.src).toContain('placeholder-mic.png');
-  });
-
-  it('uses placeholder when image is whitespace only', () => {
-    const props = { ...defaultProps, image: '   ' };
-    const { container } = render(VenueInfo, { props });
-    const img = container.querySelector('.venue-image img');
-    expect(img.src).toContain('placeholder-mic.png');
-  });
-
-  it('renders street address', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    const locations = container.querySelectorAll('.venue-location');
-    expect(locations.length).toBeGreaterThan(0);
-    expect(locations[0].textContent).toBe('123 Main St');
-  });
-
-  it('renders city state zip', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    const locations = container.querySelectorAll('.venue-location');
-    expect(locations.length).toBe(2);
-    expect(locations[1].textContent).toBe('Los Angeles, CA 90001');
-  });
-
-  it('handles empty location', () => {
-    const props = { ...defaultProps, location: '' };
-    const { container } = render(VenueInfo, { props });
-    const locations = container.querySelectorAll('.venue-location');
-    expect(locations.length).toBe(0);
-  });
-
-  it('handles null location', () => {
-    const props = { ...defaultProps, location: null };
-    const { container } = render(VenueInfo, { props });
-    expect(container.querySelector('.venue-info')).toBeDefined();
-  });
-
-  it('handles undefined location', () => {
-    const props = { ...defaultProps, location: undefined };
-    const { container } = render(VenueInfo, { props });
-    expect(container.querySelector('.venue-info')).toBeDefined();
-  });
-
-  it('sets image alt text to venue name', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    const img = container.querySelector('.venue-image img');
-    expect(img.alt).toBe('Comedy Club');
-  });
-
-  it('renders with default size', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    expect(container.querySelector('.venue-info--small')).toBeNull();
-  });
-
-  it('renders with small size', () => {
-    const props = { ...defaultProps, size: 'small' };
-    const { container } = render(VenueInfo, { props });
-    expect(container.querySelector('.venue-info--small')).toBeDefined();
-  });
-
-  it('renders venue-image container', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    expect(container.querySelector('.venue-image')).toBeDefined();
-  });
-
-  it('renders venue-details container', () => {
-    const { container } = render(VenueInfo, { props: defaultProps });
-    expect(container.querySelector('.venue-details')).toBeDefined();
-  });
-
-  it('handles empty name', () => {
-    const props = { ...defaultProps, name: '' };
-    const { container } = render(VenueInfo, { props });
-    expect(container.querySelector('.venue-name').textContent).toBe('');
-  });
-
-  it('handles location with single part', () => {
-    const props = { ...defaultProps, location: 'Los Angeles' };
-    const { container } = render(VenueInfo, { props });
-    const locations = container.querySelectorAll('.venue-location');
-    expect(locations.length).toBeGreaterThan(0);
-  });
-
-  it('handles https image URLs', () => {
-    const props = { ...defaultProps, image: 'https://secure.example.com/image.jpg' };
-    const { container } = render(VenueInfo, { props });
-    const img = container.querySelector('.venue-image img');
-    expect(img.src).toBe('https://secure.example.com/image.jpg');
-  });
-
-  it('handles http image URLs', () => {
-    const props = { ...defaultProps, image: 'http://example.com/image.jpg' };
-    const { container } = render(VenueInfo, { props });
-    const img = container.querySelector('.venue-image img');
-    expect(img.src).toBe('http://example.com/image.jpg');
-  });
-
-  it('renders with very long name', () => {
-    const props = { ...defaultProps, name: 'A Very Long Venue Name That Might Need To Be Truncated In The UI' };
-    const { container } = render(VenueInfo, { props });
-    expect(container.querySelector('.venue-name').textContent).toBe('A Very Long Venue Name That Might Need To Be Truncated In The UI');
-  });
-
-  it('renders with special characters in name', () => {
-    const props = { ...defaultProps, name: "Joe's Comedy & Bar" };
-    const { container } = render(VenueInfo, { props });
-    expect(container.querySelector('.venue-name').textContent).toBe("Joe's Comedy & Bar");
-  });
-});