@pocketping/widget 1.7.0 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -1,3 +1,11 @@
1
+ /**
2
+ * Theme-aware color value
3
+ * Allows setting different colors for light and dark themes
4
+ */
5
+ interface ThemeColor {
6
+ light: string;
7
+ dark: string;
8
+ }
1
9
  interface PocketPingConfig {
2
10
  /** Your backend endpoint for self-hosted (e.g., "https://yoursite.com/pocketping") */
3
11
  endpoint?: string;
@@ -23,6 +31,33 @@ interface PocketPingConfig {
23
31
  primaryColor?: string;
24
32
  /** Text color on primary background (defaults to white) */
25
33
  primaryTextColor?: string;
34
+ /**
35
+ * Header background color
36
+ * Can be a string (same for both themes) or object with light/dark values
37
+ * @example "#008069" or { light: "#008069", dark: "#202c33" }
38
+ */
39
+ headerColor?: string | ThemeColor;
40
+ /**
41
+ * Footer/input area background color
42
+ * Can be a string (same for both themes) or object with light/dark values
43
+ * @example "#f0f2f5" or { light: "#f0f2f5", dark: "#202c33" }
44
+ */
45
+ footerColor?: string | ThemeColor;
46
+ /**
47
+ * Chat background style:
48
+ * - 'whatsapp' (default) - WhatsApp-style pattern
49
+ * - 'dots' - Subtle dot pattern
50
+ * - 'plain' - Solid color only
51
+ * - URL string - Custom image URL
52
+ * Can also be theme-aware with { light: '...', dark: '...' }
53
+ */
54
+ chatBackground?: 'whatsapp' | 'dots' | 'plain' | string | ThemeColor;
55
+ /**
56
+ * Toggle button background color
57
+ * Can be a string (same for both themes) or object with light/dark values
58
+ * @example "#25d366" or { light: "#25d366", dark: "#00a884" }
59
+ */
60
+ toggleColor?: string | ThemeColor;
26
61
  /** Widget position */
27
62
  position?: 'bottom-right' | 'bottom-left';
28
63
  /** Distance from edge in pixels (default: 20) */
@@ -65,6 +100,8 @@ interface PocketPingConfig {
65
100
  onError?: (error: Error) => void;
66
101
  /** Called when a version mismatch is detected */
67
102
  onVersionWarning?: (warning: VersionWarning) => void;
103
+ /** Called when a custom event is received from the backend */
104
+ onEvent?: (event: CustomEvent) => void;
68
105
  }
69
106
  type MessageStatus = 'sending' | 'sent' | 'delivered' | 'read';
70
107
  type AttachmentStatus = 'pending' | 'uploading' | 'ready' | 'failed';
package/dist/index.d.ts CHANGED
@@ -1,3 +1,11 @@
1
+ /**
2
+ * Theme-aware color value
3
+ * Allows setting different colors for light and dark themes
4
+ */
5
+ interface ThemeColor {
6
+ light: string;
7
+ dark: string;
8
+ }
1
9
  interface PocketPingConfig {
2
10
  /** Your backend endpoint for self-hosted (e.g., "https://yoursite.com/pocketping") */
3
11
  endpoint?: string;
@@ -23,6 +31,33 @@ interface PocketPingConfig {
23
31
  primaryColor?: string;
24
32
  /** Text color on primary background (defaults to white) */
25
33
  primaryTextColor?: string;
34
+ /**
35
+ * Header background color
36
+ * Can be a string (same for both themes) or object with light/dark values
37
+ * @example "#008069" or { light: "#008069", dark: "#202c33" }
38
+ */
39
+ headerColor?: string | ThemeColor;
40
+ /**
41
+ * Footer/input area background color
42
+ * Can be a string (same for both themes) or object with light/dark values
43
+ * @example "#f0f2f5" or { light: "#f0f2f5", dark: "#202c33" }
44
+ */
45
+ footerColor?: string | ThemeColor;
46
+ /**
47
+ * Chat background style:
48
+ * - 'whatsapp' (default) - WhatsApp-style pattern
49
+ * - 'dots' - Subtle dot pattern
50
+ * - 'plain' - Solid color only
51
+ * - URL string - Custom image URL
52
+ * Can also be theme-aware with { light: '...', dark: '...' }
53
+ */
54
+ chatBackground?: 'whatsapp' | 'dots' | 'plain' | string | ThemeColor;
55
+ /**
56
+ * Toggle button background color
57
+ * Can be a string (same for both themes) or object with light/dark values
58
+ * @example "#25d366" or { light: "#25d366", dark: "#00a884" }
59
+ */
60
+ toggleColor?: string | ThemeColor;
26
61
  /** Widget position */
27
62
  position?: 'bottom-right' | 'bottom-left';
28
63
  /** Distance from edge in pixels (default: 20) */
@@ -65,6 +100,8 @@ interface PocketPingConfig {
65
100
  onError?: (error: Error) => void;
66
101
  /** Called when a version mismatch is detected */
67
102
  onVersionWarning?: (warning: VersionWarning) => void;
103
+ /** Called when a custom event is received from the backend */
104
+ onEvent?: (event: CustomEvent) => void;
68
105
  }
69
106
  type MessageStatus = 'sending' | 'sent' | 'delivered' | 'read';
70
107
  type AttachmentStatus = 'pending' | 'uploading' | 'ready' | 'failed';