@rlse/widget 0.1.4 → 0.2.0

package/dist/types.d.ts

@@ -1,54 +1,2 @@
-export interface WidgetConfig {
-    /** Organization slug (required) */
-    orgSlug: string;
-    /** Optional app slug to filter changes */
-    appSlug?: string;
-    /** Trigger behavior: 'auto', 'manual', or 'both' */
-    trigger?: 'auto' | 'manual' | 'both';
-    /** Days since last visit to auto-show (for 'auto' or 'both') */
-    autoShowAfter?: number;
-    /** Maximum changes to display */
-    limit?: number;
-    /** Show status badges */
-    showStatus?: boolean;
-    /** Show creation dates */
-    showDates?: boolean;
-    /** Button position for manual trigger */
-    position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
-    /** Theme: 'light', 'dark', or 'auto' */
-    theme?: 'light' | 'dark' | 'auto';
-    /** Primary accent color (hex) */
-    primaryColor?: string;
-    /** Button text */
-    triggerLabel?: string;
-    /** Modal title */
-    modalTitle?: string;
-    /** Base URL for the server (optional, defaults to https://rlse.dev) */
-    baseUrl?: string;
-}
-export interface Change {
-    _id: string;
-    _creationTime: number;
-    changeName: string;
-    changeSummary: string;
-    changeDescription: string;
-    currentStatus: string;
-    appName?: string;
-    appSlug?: string;
-}
-export interface WidgetChangesResponse {
-    org: {
-        orgName: string;
-        orgSlug: string;
-    };
-    app?: {
-        appName: string;
-        appSlug: string;
-    };
-    changes: Change[];
-    meta: {
-        total: number;
-        limit: number;
-    };
-}
-export declare const DEFAULT_CONFIG: Partial<WidgetConfig>;
+export type { WidgetConfig, Change, WidgetChangesResponse, } from '@rlse/widget-core';
+export { DEFAULT_CONFIG } from '@rlse/widget-core';

package/dist/types.js

@@ -1,12 +1 @@
-export const DEFAULT_CONFIG = {
-    trigger: 'manual',
-    limit: 10,
-    showStatus: true,
-    showDates: true,
-    position: 'bottom-right',
-    theme: 'auto',
-    triggerLabel: "What's New",
-    modalTitle: 'Release Notes',
-    baseUrl: 'https://rlse.dev',
-    autoShowAfter: 7,
-};
+export { DEFAULT_CONFIG } from '@rlse/widget-core';

package/dist/useWidgetData.js

@@ -1,10 +1,11 @@
 import { useState, useEffect, useCallback, useRef } from 'react';
+import { fetchChanges } from '@rlse/widget-core';
 export function useWidgetData(orgSlug, appSlug, limit, baseUrl) {
     const [changes, setChanges] = useState([]);
     const [isLoading, setIsLoading] = useState(true);
     const [error, setError] = useState(null);
     const abortControllerRef = useRef(null);
-    const fetchChanges = useCallback(async () => {
+    const doFetch = useCallback(async () => {
         // Cancel any in-flight request
         if (abortControllerRef.current) {
             abortControllerRef.current.abort();
@@ -12,52 +13,30 @@ export function useWidgetData(orgSlug, appSlug, limit, baseUrl) {
         abortControllerRef.current = new AbortController();
         setIsLoading(true);
         setError(null);
-        try {
-            // Validate baseUrl
-            if (!baseUrl || typeof baseUrl !== 'string') {
-                throw new Error(`Invalid baseUrl: ${baseUrl}`);
-            }
-            let url;
-            try {
-                url = new URL(`${baseUrl}/api/widget/changes`);
-            }
-            catch {
-                throw new Error(`Invalid baseUrl for widget API: ${baseUrl}`);
-            }
-            url.searchParams.set('orgSlug', orgSlug);
-            if (appSlug) {
-                url.searchParams.set('appSlug', appSlug);
-            }
-            url.searchParams.set('limit', limit.toString());
-            const response = await fetch(url.toString(), {
-                signal: abortControllerRef.current.signal,
-            });
-            if (!response.ok) {
-                throw new Error(`Failed to fetch changes: ${response.status}`);
-            }
-            const data = await response.json();
-            setChanges(data.changes);
-        }
-        catch (err) {
-            // Don't update state if request was aborted
-            if (err instanceof Error && err.name === 'AbortError') {
-                return;
-            }
-            setError(err instanceof Error ? err : new Error('Unknown error'));
+        const result = await fetchChanges({
+            orgSlug,
+            appSlug,
+            limit,
+            baseUrl,
+            signal: abortControllerRef.current.signal,
+        });
+        if (result.error && result.error.name !== 'AbortError') {
+            setError(result.error);
             setChanges([]);
         }
-        finally {
-            setIsLoading(false);
+        else {
+            setChanges(result.changes);
         }
+        setIsLoading(false);
     }, [orgSlug, appSlug, limit, baseUrl]);
     useEffect(() => {
-        fetchChanges();
+        doFetch();
         return () => {
             // Cleanup: abort in-flight request on unmount
             if (abortControllerRef.current) {
                 abortControllerRef.current.abort();
             }
         };
-    }, [fetchChanges]);
-    return { changes, isLoading, error, refetch: fetchChanges };
+    }, [doFetch]);
+    return { changes, isLoading, error, refetch: doFetch };
 }

package/dist/vue/components/index.d.ts

@@ -0,0 +1,3 @@
+export { default as RlseWidget } from './RlseWidget.vue';
+export { default as RlseWidgetEmbed } from './RlseWidgetEmbed.vue';
+export { default as RlseWidgetMenu } from './RlseWidgetMenu.vue';

package/dist/vue/components/index.js

@@ -0,0 +1,5 @@
+// Vue Single File Components
+// Note: Components are .vue files and should be imported directly
+export { default as RlseWidget } from './RlseWidget.vue';
+export { default as RlseWidgetEmbed } from './RlseWidgetEmbed.vue';
+export { default as RlseWidgetMenu } from './RlseWidgetMenu.vue';

package/dist/vue/composables/index.d.ts

@@ -0,0 +1,2 @@
+export { useWidgetData } from './useWidgetData';
+export { useStorage } from './useStorage';

package/dist/vue/composables/index.js

@@ -0,0 +1,2 @@
+export { useWidgetData } from './useWidgetData';
+export { useStorage } from './useStorage';

package/dist/vue/composables/useStorage.d.ts

@@ -0,0 +1,13 @@
+import { type ComputedRef } from 'vue';
+import type { Change } from '@rlse/widget-core';
+export interface UseStorageOptions {
+    orgSlug: string;
+}
+export interface UseStorageReturn {
+    lastVisit: ComputedRef<number | null>;
+    unreadCount: (changes: Change[]) => number;
+    shouldAutoShow: (autoShowAfter: number) => boolean;
+    markAllAsSeen: (changeIds: string[]) => void;
+    updateLastVisit: () => void;
+}
+export declare function useStorage(options: UseStorageOptions): UseStorageReturn;

package/dist/vue/composables/useStorage.js

@@ -0,0 +1,12 @@
+import { computed } from 'vue';
+import { getLastVisit, setLastVisit, markAllChangesAsSeen, getUnreadCount, shouldAutoShow, } from '@rlse/widget-core';
+export function useStorage(options) {
+    const lastVisit = computed(() => getLastVisit(options.orgSlug));
+    return {
+        lastVisit,
+        unreadCount: (changes) => getUnreadCount(options.orgSlug, changes),
+        shouldAutoShow: (autoShowAfter) => shouldAutoShow(options.orgSlug, autoShowAfter),
+        markAllAsSeen: (changeIds) => markAllChangesAsSeen(options.orgSlug, changeIds),
+        updateLastVisit: () => setLastVisit(options.orgSlug),
+    };
+}

package/dist/vue/composables/useWidgetData.d.ts

@@ -0,0 +1,16 @@
+import { type Ref } from 'vue';
+import type { Change } from '@rlse/widget-core';
+export interface UseWidgetDataOptions {
+    orgSlug: string;
+    appSlug?: string;
+    limit: number;
+    baseUrl: string;
+}
+export interface UseWidgetDataReturn {
+    changes: Ref<Change[]>;
+    isLoading: Ref<boolean>;
+    error: Ref<Error | null>;
+    unreadCount: Ref<number>;
+    refetch: () => Promise<void>;
+}
+export declare function useWidgetData(options: UseWidgetDataOptions): UseWidgetDataReturn;

package/dist/vue/composables/useWidgetData.js

@@ -0,0 +1,42 @@
+import { ref, computed, onMounted, onUnmounted } from 'vue';
+import { fetchChanges, WidgetDataFetcher } from '@rlse/widget-core';
+export function useWidgetData(options) {
+    const changes = ref([]);
+    const isLoading = ref(true);
+    const error = ref(null);
+    const fetcher = new WidgetDataFetcher();
+    const fetchData = async () => {
+        isLoading.value = true;
+        error.value = null;
+        const result = await fetchChanges({
+            orgSlug: options.orgSlug,
+            appSlug: options.appSlug,
+            limit: options.limit,
+            baseUrl: options.baseUrl,
+        });
+        if (result.error && result.error.name !== 'AbortError') {
+            error.value = result.error;
+            changes.value = [];
+        }
+        else {
+            changes.value = result.changes;
+        }
+        isLoading.value = false;
+    };
+    onMounted(() => {
+        fetchData();
+    });
+    onUnmounted(() => {
+        fetcher.destroy();
+    });
+    const refetch = async () => {
+        await fetchData();
+    };
+    return {
+        changes,
+        isLoading,
+        error,
+        unreadCount: computed(() => changes.value.length),
+        refetch,
+    };
+}

package/dist/vue/index.d.ts

@@ -0,0 +1,6 @@
+export { useWidgetData, useStorage } from './composables';
+export { default as RlseWidget } from './components/RlseWidget.vue';
+export { default as RlseWidgetEmbed } from './components/RlseWidgetEmbed.vue';
+export { default as RlseWidgetMenu } from './components/RlseWidgetMenu.vue';
+export type { WidgetConfig, Change, WidgetChangesResponse, } from '@rlse/widget-core';
+export { DEFAULT_CONFIG } from '@rlse/widget-core';

package/dist/vue/index.js

@@ -0,0 +1,8 @@
+// Vue 3 Composables
+export { useWidgetData, useStorage } from './composables';
+// Vue 3 Components (SFC)
+// Import .vue files directly in your Vue projects
+export { default as RlseWidget } from './components/RlseWidget.vue';
+export { default as RlseWidgetEmbed } from './components/RlseWidgetEmbed.vue';
+export { default as RlseWidgetMenu } from './components/RlseWidgetMenu.vue';
+export { DEFAULT_CONFIG } from '@rlse/widget-core';

package/package.json

@@ -1,13 +1,33 @@
 {
   "name": "@rlse/widget",
-  "version": "0.1.4",
-  "description": "React release notes widget for rlse.dev",
+  "version": "0.2.0",
+  "description": "Multi-framework release notes widget for rlse.dev - React, Vue, Angular, Svelte",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
+    },
+    "./react": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./vue": {
+      "types": "./dist/vue/index.d.ts",
+      "default": "./dist/vue/index.js"
+    },
+    "./angular": {
+      "types": "./dist/angular/index.d.ts",
+      "default": "./dist/angular/index.js"
+    },
+    "./svelte": {
+      "types": "./dist/svelte/index.d.ts",
+      "default": "./dist/svelte/index.js"
+    },
+    "./vanilla": {
+      "types": "./dist/vanilla/index.d.ts",
+      "default": "./dist/vanilla/index.js"
     }
   },
   "files": [
@@ -25,11 +45,34 @@
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
-    "react-dom": "^18.0.0 || ^19.0.0"
+    "react-dom": "^18.0.0 || ^19.0.0",
+    "vue": "^3.0.0",
+    "@angular/core": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0",
+    "svelte": "^4.0.0 || ^5.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    },
+    "vue": {
+      "optional": true
+    },
+    "@angular/core": {
+      "optional": true
+    },
+    "svelte": {
+      "optional": true
+    }
   },
   "devDependencies": {
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
+    "@angular/core": "^18.0.0",
+    "rxjs": "^7.8.0",
+    "vue": "^3.4.0",
     "bun-types": "latest",
     "typescript": "^5.0.0"
   },
@@ -38,7 +81,13 @@
     "changelog",
     "widget",
     "react",
+    "vue",
+    "angular",
+    "svelte",
     "embed"
   ],
-  "license": "MIT"
+  "license": "MIT",
+  "dependencies": {
+    "@rlse/widget-core": "../widget-core"
+  }
 }