@getmicdrop/svelte-components 5.4.1 → 5.4.2

package/dist/stores/auth.js

@@ -1,36 +1,36 @@
-import { writable } from "svelte/store";
-
-// Store to manage authentication state
-export const auth = writable({
-  isAuthenticated: false,
-  token: null,
-  userDetails: null, // To store email and first name
-});
-
-// Function to set authentication state
-export const setAuthState = (state) => {
-  auth.set(state);
-};
-
-// Function to clear the authentication state
-export const clearAuthState = () => {
-  auth.set({ isAuthenticated: false, token: null, userDetails: null });
-};
-
-// Initialize the store from cookies
-export const initializeAuthState = () => {
-  const cookies = Object.fromEntries(
-    document.cookie
-      .split("; ")
-      .map((c) => c.split("="))
-      .map(([k, v]) => [k, decodeURIComponent(v)])
-  );
-
-  if (cookies.performer_token) {
-    setAuthState({
-      isAuthenticated: true,
-      token: cookies.performer_token,
-      userDetails: cookies.userDetails ? JSON.parse(cookies.userDetails) : null,
-    });
-  }
-};
+import { writable } from "svelte/store";
+
+// Store to manage authentication state
+export const auth = writable({
+  isAuthenticated: false,
+  token: null,
+  userDetails: null, // To store email and first name
+});
+
+// Function to set authentication state
+export const setAuthState = (state) => {
+  auth.set(state);
+};
+
+// Function to clear the authentication state
+export const clearAuthState = () => {
+  auth.set({ isAuthenticated: false, token: null, userDetails: null });
+};
+
+// Initialize the store from cookies
+export const initializeAuthState = () => {
+  const cookies = Object.fromEntries(
+    document.cookie
+      .split("; ")
+      .map((c) => c.split("="))
+      .map(([k, v]) => [k, decodeURIComponent(v)])
+  );
+
+  if (cookies.performer_token) {
+    setAuthState({
+      isAuthenticated: true,
+      token: cookies.performer_token,
+      userDetails: cookies.userDetails ? JSON.parse(cookies.userDetails) : null,
+    });
+  }
+};

package/dist/stores/auth.spec.js

@@ -1,139 +1,139 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { get } from 'svelte/store';
-import { auth, setAuthState, clearAuthState, initializeAuthState } from './auth';
-
-describe('auth store', () => {
-  beforeEach(() => {
-    // Reset auth state before each test
-    clearAuthState();
-    // Clear cookies
-    Object.defineProperty(document, 'cookie', {
-      writable: true,
-      value: '',
-    });
-  });
-
-  describe('initial state', () => {
-    it('starts with isAuthenticated as false', () => {
-      expect(get(auth).isAuthenticated).toBe(false);
-    });
-
-    it('starts with token as null', () => {
-      expect(get(auth).token).toBe(null);
-    });
-
-    it('starts with userDetails as null', () => {
-      expect(get(auth).userDetails).toBe(null);
-    });
-  });
-
-  describe('setAuthState', () => {
-    it('sets authentication state', () => {
-      setAuthState({
-        isAuthenticated: true,
-        token: 'test-token',
-        userDetails: { email: 'test@test.com' },
-      });
-
-      const state = get(auth);
-      expect(state.isAuthenticated).toBe(true);
-      expect(state.token).toBe('test-token');
-      expect(state.userDetails).toEqual({ email: 'test@test.com' });
-    });
-
-    it('can update partial state', () => {
-      setAuthState({ isAuthenticated: true, token: 'token1', userDetails: null });
-      setAuthState({ isAuthenticated: true, token: 'token2', userDetails: { name: 'User' } });
-
-      const state = get(auth);
-      expect(state.token).toBe('token2');
-      expect(state.userDetails).toEqual({ name: 'User' });
-    });
-  });
-
-  describe('clearAuthState', () => {
-    it('clears authentication state', () => {
-      setAuthState({
-        isAuthenticated: true,
-        token: 'test-token',
-        userDetails: { email: 'test@test.com' },
-      });
-
-      clearAuthState();
-
-      const state = get(auth);
-      expect(state.isAuthenticated).toBe(false);
-      expect(state.token).toBe(null);
-      expect(state.userDetails).toBe(null);
-    });
-  });
-
-  describe('initializeAuthState', () => {
-    it('does nothing when no performer_token cookie exists', () => {
-      Object.defineProperty(document, 'cookie', {
-        writable: true,
-        value: '',
-      });
-
-      initializeAuthState();
-
-      const state = get(auth);
-      expect(state.isAuthenticated).toBe(false);
-    });
-
-    it('sets auth state from performer_token cookie', () => {
-      Object.defineProperty(document, 'cookie', {
-        writable: true,
-        value: 'performer_token=my-token',
-      });
-
-      initializeAuthState();
-
-      const state = get(auth);
-      expect(state.isAuthenticated).toBe(true);
-      expect(state.token).toBe('my-token');
-    });
-
-    it('parses userDetails cookie when present', () => {
-      const userDetails = JSON.stringify({ email: 'test@test.com', firstName: 'Test' });
-      Object.defineProperty(document, 'cookie', {
-        writable: true,
-        value: `performer_token=my-token; userDetails=${encodeURIComponent(userDetails)}`,
-      });
-
-      initializeAuthState();
-
-      const state = get(auth);
-      expect(state.userDetails).toEqual({ email: 'test@test.com', firstName: 'Test' });
-    });
-
-    it('handles missing userDetails cookie', () => {
-      Object.defineProperty(document, 'cookie', {
-        writable: true,
-        value: 'performer_token=my-token',
-      });
-
-      initializeAuthState();
-
-      const state = get(auth);
-      expect(state.isAuthenticated).toBe(true);
-      expect(state.userDetails).toBe(null);
-    });
-  });
-
-  describe('store subscription', () => {
-    it('can subscribe to auth changes', () => {
-      const values = [];
-      const unsubscribe = auth.subscribe((value) => {
-        values.push(value.isAuthenticated);
-      });
-
-      setAuthState({ isAuthenticated: true, token: 'token', userDetails: null });
-      clearAuthState();
-
-      unsubscribe();
-
-      expect(values).toEqual([false, true, false]);
-    });
-  });
-});
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { get } from 'svelte/store';
+import { auth, setAuthState, clearAuthState, initializeAuthState } from './auth';
+
+describe('auth store', () => {
+  beforeEach(() => {
+    // Reset auth state before each test
+    clearAuthState();
+    // Clear cookies
+    Object.defineProperty(document, 'cookie', {
+      writable: true,
+      value: '',
+    });
+  });
+
+  describe('initial state', () => {
+    it('starts with isAuthenticated as false', () => {
+      expect(get(auth).isAuthenticated).toBe(false);
+    });
+
+    it('starts with token as null', () => {
+      expect(get(auth).token).toBe(null);
+    });
+
+    it('starts with userDetails as null', () => {
+      expect(get(auth).userDetails).toBe(null);
+    });
+  });
+
+  describe('setAuthState', () => {
+    it('sets authentication state', () => {
+      setAuthState({
+        isAuthenticated: true,
+        token: 'test-token',
+        userDetails: { email: 'test@test.com' },
+      });
+
+      const state = get(auth);
+      expect(state.isAuthenticated).toBe(true);
+      expect(state.token).toBe('test-token');
+      expect(state.userDetails).toEqual({ email: 'test@test.com' });
+    });
+
+    it('can update partial state', () => {
+      setAuthState({ isAuthenticated: true, token: 'token1', userDetails: null });
+      setAuthState({ isAuthenticated: true, token: 'token2', userDetails: { name: 'User' } });
+
+      const state = get(auth);
+      expect(state.token).toBe('token2');
+      expect(state.userDetails).toEqual({ name: 'User' });
+    });
+  });
+
+  describe('clearAuthState', () => {
+    it('clears authentication state', () => {
+      setAuthState({
+        isAuthenticated: true,
+        token: 'test-token',
+        userDetails: { email: 'test@test.com' },
+      });
+
+      clearAuthState();
+
+      const state = get(auth);
+      expect(state.isAuthenticated).toBe(false);
+      expect(state.token).toBe(null);
+      expect(state.userDetails).toBe(null);
+    });
+  });
+
+  describe('initializeAuthState', () => {
+    it('does nothing when no performer_token cookie exists', () => {
+      Object.defineProperty(document, 'cookie', {
+        writable: true,
+        value: '',
+      });
+
+      initializeAuthState();
+
+      const state = get(auth);
+      expect(state.isAuthenticated).toBe(false);
+    });
+
+    it('sets auth state from performer_token cookie', () => {
+      Object.defineProperty(document, 'cookie', {
+        writable: true,
+        value: 'performer_token=my-token',
+      });
+
+      initializeAuthState();
+
+      const state = get(auth);
+      expect(state.isAuthenticated).toBe(true);
+      expect(state.token).toBe('my-token');
+    });
+
+    it('parses userDetails cookie when present', () => {
+      const userDetails = JSON.stringify({ email: 'test@test.com', firstName: 'Test' });
+      Object.defineProperty(document, 'cookie', {
+        writable: true,
+        value: `performer_token=my-token; userDetails=${encodeURIComponent(userDetails)}`,
+      });
+
+      initializeAuthState();
+
+      const state = get(auth);
+      expect(state.userDetails).toEqual({ email: 'test@test.com', firstName: 'Test' });
+    });
+
+    it('handles missing userDetails cookie', () => {
+      Object.defineProperty(document, 'cookie', {
+        writable: true,
+        value: 'performer_token=my-token',
+      });
+
+      initializeAuthState();
+
+      const state = get(auth);
+      expect(state.isAuthenticated).toBe(true);
+      expect(state.userDetails).toBe(null);
+    });
+  });
+
+  describe('store subscription', () => {
+    it('can subscribe to auth changes', () => {
+      const values = [];
+      const unsubscribe = auth.subscribe((value) => {
+        values.push(value.isAuthenticated);
+      });
+
+      setAuthState({ isAuthenticated: true, token: 'token', userDetails: null });
+      clearAuthState();
+
+      unsubscribe();
+
+      expect(values).toEqual([false, true, false]);
+    });
+  });
+});

package/dist/stores/toaster.js

@@ -1,13 +1,13 @@
-import { toast } from "svelte-sonner";
-
-export { toast };
-
-export const showToast = (message, type = "success") => {
-  if (type === "success") {
-    toast.success(message);
-  } else if (type === "error") {
-    toast.error(message);
-  } else {
-    toast.message(message);
-  }
-};
+import { toast } from "svelte-sonner";
+
+export { toast };
+
+export const showToast = (message, type = "success") => {
+  if (type === "success") {
+    toast.success(message);
+  } else if (type === "error") {
+    toast.error(message);
+  } else {
+    toast.message(message);
+  }
+};

package/dist/stories/ButtonAuditDashboard.svelte

@@ -292,16 +292,21 @@
                           📂 Open
                         </a>
                       </div>
-                      <div class="flex items-center gap-2 flex-shrink-0 ml-2">
-                        {#if isPreviewable(route.file)}
-                          <button
-                            onclick={(e) => { e.stopPropagation(); openPreview(route.route, route.file); }}
-                            class="px-2 py-0.5 text-xs rounded bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900 dark:text-green-300 dark:hover:bg-green-800"
-                            title="Preview this page"
-                          >
-                            👁️ Preview
-                          </button>
-                        {/if}
+                      <div class="flex items-center gap-2 flex-shrink-0 ml-2">
+                        {#if isPreviewable(route.file)}
+                          <!-- svelte-ignore a11y_click_events_have_key_events -->
+                          <!-- svelte-ignore a11y_no_static_element_interactions -->
+                          <span
+                            role="button"
+                            tabindex="0"
+                            onclick={(e) => { e.stopPropagation(); openPreview(route.route, route.file); }}
+                            onkeydown={(e) => { if (e.key === 'Enter' || e.key === ' ') { e.stopPropagation(); openPreview(route.route, route.file); }}}
+                            class="px-2 py-0.5 text-xs rounded bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900 dark:text-green-300 dark:hover:bg-green-800 cursor-pointer"
+                            title="Preview this page"
+                          >
+                            👁️ Preview
+                          </span>
+                        {/if}
                         <span class="text-xs text-gray-500 dark:text-gray-400">
                           {routeVisibleButtons.length} buttons
                         </span>
@@ -425,14 +430,14 @@
           </div>
         </div>
 
-        <!-- Iframe Content -->
-        <div class="flex-1 relative">
-          <iframe
-            src={previewModal.url}
-            class="absolute inset-0 w-full h-full border-0"
-            title="Page preview"
-          />
-        </div>
+        <!-- Iframe Content -->
+        <div class="flex-1 relative">
+          <iframe
+            src={previewModal.url}
+            class="absolute inset-0 w-full h-full border-0"
+            title="Page preview"
+          ></iframe>
+        </div>
 
         <!-- Modal Footer -->
         <div class="px-4 py-2 bg-gray-50 dark:bg-gray-700/50 border-t border-gray-200 dark:border-gray-600 text-xs text-gray-500 dark:text-gray-400">

package/dist/stories/ButtonAuditDashboard.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonAuditDashboard.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/stories/ButtonAuditDashboard.svelte.js"],"names":[],"mappings":";;;;;AAwYA,8FAAmE"}
+{"version":3,"file":"ButtonAuditDashboard.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/stories/ButtonAuditDashboard.svelte.js"],"names":[],"mappings":";;;;;AA0YA,8FAAmE"}

package/dist/stories/ButtonAuditReview.stories.svelte

@@ -1,14 +1,14 @@
-<script module>
-  import { defineMeta } from "@storybook/addon-svelte-csf";
-  import ButtonAuditReview from "./ButtonAuditReview.svelte";
-
-  const { Story } = defineMeta({
-    title: "Design System/Button Audit Review",
-    component: ButtonAuditReview,
-    parameters: {
-      layout: 'fullscreen',
-    }
-  });
-</script>
-
-<Story name="All Issues" />
+<script module>
+  import { defineMeta } from "@storybook/addon-svelte-csf";
+  import ButtonAuditReview from "./ButtonAuditReview.svelte";
+
+  const { Story } = defineMeta({
+    title: "Design System/Button Audit Review",
+    component: ButtonAuditReview,
+    parameters: {
+      layout: 'fullscreen',
+    }
+  });
+</script>
+
+<Story name="All Issues" />