@uxbertlabs/reportly 1.0.19 → 1.0.20

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.
Files changed (55) hide show
  1. package/README.md +39 -14
  2. package/dist/components/AnnotationToolbar.d.ts +11 -0
  3. package/dist/components/AnnotationToolbar.d.ts.map +1 -0
  4. package/dist/components/FloatingButton.d.ts +7 -0
  5. package/dist/components/FloatingButton.d.ts.map +1 -0
  6. package/dist/components/IssueModal.d.ts +7 -0
  7. package/dist/components/IssueModal.d.ts.map +1 -0
  8. package/dist/components/Logo.d.ts +4 -0
  9. package/dist/components/Logo.d.ts.map +1 -0
  10. package/dist/components/Reportly.d.ts +8 -0
  11. package/dist/components/Reportly.d.ts.map +1 -0
  12. package/dist/components/ReportlyProvider.d.ts +41 -0
  13. package/dist/components/ReportlyProvider.d.ts.map +1 -0
  14. package/dist/features/annotation.d.ts +0 -0
  15. package/dist/features/annotation.d.ts.map +1 -1
  16. package/dist/features/device-info.d.ts +0 -0
  17. package/dist/features/device-info.d.ts.map +0 -0
  18. package/dist/features/export.d.ts +0 -0
  19. package/dist/features/export.d.ts.map +0 -0
  20. package/dist/features/n8n-integration.d.ts +0 -0
  21. package/dist/features/n8n-integration.d.ts.map +0 -0
  22. package/dist/features/screenshot.d.ts +0 -0
  23. package/dist/features/screenshot.d.ts.map +0 -0
  24. package/dist/{reportly.esm.js → index.cjs.js} +5174 -1918
  25. package/dist/index.cjs.js.map +1 -0
  26. package/dist/index.css +1 -0
  27. package/dist/index.d.ts +11 -0
  28. package/dist/index.d.ts.map +1 -0
  29. package/dist/{reportly.cjs.js → index.esm.js} +5165 -1921
  30. package/dist/index.esm.js.map +1 -0
  31. package/dist/index.min.js +32 -0
  32. package/dist/index.min.js.map +1 -0
  33. package/dist/lib/utils.d.ts +3 -0
  34. package/dist/lib/utils.d.ts.map +1 -0
  35. package/dist/types.d.ts +10 -9
  36. package/dist/types.d.ts.map +1 -1
  37. package/package.json +39 -14
  38. package/dist/core/config.d.ts +0 -12
  39. package/dist/core/config.d.ts.map +0 -1
  40. package/dist/core/init.d.ts +0 -43
  41. package/dist/core/init.d.ts.map +0 -1
  42. package/dist/core/state.d.ts +0 -27
  43. package/dist/core/state.d.ts.map +0 -1
  44. package/dist/reportly.cjs.js.map +0 -1
  45. package/dist/reportly.esm.js.map +0 -1
  46. package/dist/reportly.js +0 -10875
  47. package/dist/reportly.js.map +0 -1
  48. package/dist/reportly.min.js +0 -7
  49. package/dist/reportly.min.js.map +0 -1
  50. package/dist/ui/button.d.ts +0 -14
  51. package/dist/ui/button.d.ts.map +0 -1
  52. package/dist/ui/modal.d.ts +0 -21
  53. package/dist/ui/modal.d.ts.map +0 -1
  54. package/dist/ui/toolbar.d.ts +0 -18
  55. package/dist/ui/toolbar.d.ts.map +0 -1
package/README.md CHANGED
@@ -32,16 +32,49 @@ Open `demo.html` in your browser to see it in action!
32
32
 
33
33
  ## Installation
34
34
 
35
- ### Method 1: Script Tag (Recommended)
35
+ ### Method 1: React/TypeScript (Recommended)
36
36
 
37
- ```html
38
- <!-- Via local file -->
39
- <script src="dist/reportly.min.js"></script>
37
+ ```bash
38
+ npm install @uxbertlabs/reportly
39
+ ```
40
40
 
41
- <!-- Or via CDN -->
42
- <script src="https://cdn.jsdelivr.net/npm/@uxbertlabs/reportly@1.0.2/dist/reportly.min.js"></script>
41
+ Then in your React app:
42
+
43
+ ```tsx
44
+ import Reportly from '@uxbertlabs/reportly';
45
+
46
+ function App() {
47
+ return (
48
+ <div>
49
+ {/* Your app content */}
50
+ <Reportly
51
+ config={{
52
+ ui: {
53
+ position: "bottom-right",
54
+ theme: "light",
55
+ },
56
+ }}
57
+ />
58
+ </div>
59
+ );
60
+ }
61
+ ```
62
+
63
+ **Important:** The CSS is automatically imported when you import the component. If you need to import styles separately, use:
64
+
65
+ ```tsx
66
+ import '@uxbertlabs/reportly/styles';
67
+ ```
68
+
69
+ ### Method 2: Script Tag (Vanilla JS)
70
+
71
+ ```html
72
+ <!-- Via CDN -->
73
+ <script src="https://cdn.jsdelivr.net/npm/@uxbertlabs/reportly/dist/reportly.min.js"></script>
74
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@uxbertlabs/reportly/dist/index.css">
43
75
 
44
76
  <script>
77
+ // For vanilla JS, use window.Reportly if available
45
78
  Reportly.init({
46
79
  ui: {
47
80
  position: "bottom-right",
@@ -51,14 +84,6 @@ Open `demo.html` in your browser to see it in action!
51
84
  </script>
52
85
  ```
53
86
 
54
- ### Method 2: ES Module
55
-
56
- ```javascript
57
- import Reportly from "./dist/reportly.js";
58
-
59
- Reportly.init();
60
- ```
61
-
62
87
  ## Configuration
63
88
 
64
89
  ```javascript
@@ -0,0 +1,11 @@
1
+ import React from "react";
2
+ interface AnnotationToolbarProps {
3
+ className?: string;
4
+ onUndo?: () => void;
5
+ onClear?: () => void;
6
+ onDone?: () => void;
7
+ onExit?: () => void;
8
+ }
9
+ export declare function AnnotationToolbar({ className, onUndo, onClear, onDone, onExit }: AnnotationToolbarProps): React.JSX.Element | null;
10
+ export default AnnotationToolbar;
11
+ //# sourceMappingURL=AnnotationToolbar.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AnnotationToolbar.d.ts","sourceRoot":"","sources":["../../src/components/AnnotationToolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,UAAU,sBAAsB;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,SAAc,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,sBAAsB,4BA0J5G;AAED,eAAe,iBAAiB,CAAC"}
@@ -0,0 +1,7 @@
1
+ import React from "react";
2
+ interface FloatingButtonProps {
3
+ className?: string;
4
+ }
5
+ export declare function FloatingButton({ className }: FloatingButtonProps): React.JSX.Element | null;
6
+ export default FloatingButton;
7
+ //# sourceMappingURL=FloatingButton.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FloatingButton.d.ts","sourceRoot":"","sources":["../../src/components/FloatingButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,mBAAmB;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,cAAc,CAAC,EAAE,SAAc,EAAE,EAAE,mBAAmB,4BAmCrE;AAED,eAAe,cAAc,CAAC"}
@@ -0,0 +1,7 @@
1
+ import React from "react";
2
+ interface IssueModalProps {
3
+ className?: string;
4
+ }
5
+ export declare function IssueModal({ className }: IssueModalProps): React.JSX.Element | null;
6
+ export default IssueModal;
7
+ //# sourceMappingURL=IssueModal.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IssueModal.d.ts","sourceRoot":"","sources":["../../src/components/IssueModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAOrD,UAAU,eAAe;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,EAAE,SAAc,EAAE,EAAE,eAAe,4BAkX7D;AAED,eAAe,UAAU,CAAC"}
@@ -0,0 +1,4 @@
1
+ import React from "react";
2
+ declare const Logo: () => React.JSX.Element;
3
+ export default Logo;
4
+ //# sourceMappingURL=Logo.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Logo.d.ts","sourceRoot":"","sources":["../../src/components/Logo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,QAAA,MAAM,IAAI,yBAgBT,CAAC;AAEF,eAAe,IAAI,CAAC"}
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ import type { ReportlyConfig } from '../types';
3
+ interface ReportlyProps {
4
+ config?: Partial<ReportlyConfig>;
5
+ }
6
+ export declare function Reportly({ config }: ReportlyProps): React.JSX.Element;
7
+ export default Reportly;
8
+ //# sourceMappingURL=Reportly.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Reportly.d.ts","sourceRoot":"","sources":["../../src/components/Reportly.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE/C,UAAU,aAAa;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAClC;AAkFD,wBAAgB,QAAQ,CAAC,EAAE,MAAM,EAAE,EAAE,aAAa,qBAMjD;AAED,eAAe,QAAQ,CAAC"}
@@ -0,0 +1,41 @@
1
+ import React, { ReactNode } from 'react';
2
+ import type { ReportlyConfig, IssueData, CompleteIssue, AnnotationTool } from '../types';
3
+ import type { N8nResponse } from '../features/n8n-integration';
4
+ import AnnotationManager from '../features/annotation';
5
+ export interface ReportlyState {
6
+ isOpen: boolean;
7
+ isAnnotating: boolean;
8
+ isCapturing: boolean;
9
+ screenshot: string | null;
10
+ captureMode: 'viewport' | 'fullpage';
11
+ currentTool: string;
12
+ currentColor: string;
13
+ config: ReportlyConfig;
14
+ }
15
+ interface ReportlyContextType {
16
+ state: ReportlyState;
17
+ annotationManager: AnnotationManager | null;
18
+ setAnnotationManager: (manager: AnnotationManager | null) => void;
19
+ openModal: () => void;
20
+ closeModal: () => void;
21
+ startAnnotation: () => void;
22
+ endAnnotation: () => void;
23
+ captureScreenshot: (mode?: 'viewport' | 'fullpage') => Promise<void>;
24
+ retakeScreenshot: () => Promise<void>;
25
+ setTool: (tool: AnnotationTool) => void;
26
+ setColor: (color: string) => void;
27
+ submitIssue: (issueData: IssueData) => void;
28
+ submitToN8n: (issueData: IssueData) => Promise<N8nResponse>;
29
+ exportToJSON: (issue: CompleteIssue) => void;
30
+ updateConfig: (config: Partial<ReportlyConfig>) => void;
31
+ updateScreenshot: (screenshot: string) => void;
32
+ reset: () => void;
33
+ }
34
+ interface ReportlyProviderProps {
35
+ children: ReactNode;
36
+ config?: Partial<ReportlyConfig>;
37
+ }
38
+ export declare function ReportlyProvider({ children, config }: ReportlyProviderProps): React.JSX.Element;
39
+ export declare function useReportly(): ReportlyContextType;
40
+ export {};
41
+ //# sourceMappingURL=ReportlyProvider.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ReportlyProvider.d.ts","sourceRoot":"","sources":["../../src/components/ReportlyProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAyC,SAAS,EAAe,MAAM,OAAO,CAAC;AAC7F,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAI/D,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AAEvD,MAAM,WAAW,aAAa;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,WAAW,EAAE,UAAU,GAAG,UAAU,CAAC;IACrC,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,cAAc,CAAC;CACxB;AAmED,UAAU,mBAAmB;IAC3B,KAAK,EAAE,aAAa,CAAC;IACrB,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,oBAAoB,EAAE,CAAC,OAAO,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;IAClE,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,iBAAiB,EAAE,CAAC,IAAI,CAAC,EAAE,UAAU,GAAG,UAAU,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACrE,gBAAgB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,OAAO,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,WAAW,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IAC5C,WAAW,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,OAAO,CAAC,WAAW,CAAC,CAAC;IAC5D,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACxD,gBAAgB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAID,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAClC;AAED,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,MAAW,EAAE,EAAE,qBAAqB,qBA0KhF;AAED,wBAAgB,WAAW,IAAI,mBAAmB,CAMjD"}
File without changes
@@ -1 +1 @@
1
- {"version":3,"file":"annotation.d.ts","sourceRoot":"","sources":["../../src/features/annotation.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAqB,MAAM,UAAU,CAAC;AAElE,cAAM,iBAAiB;IACrB,OAAO,CAAC,MAAM,CAA2B;IACzC,OAAO,CAAC,GAAG,CAAkC;IAC7C,OAAO,CAAC,SAAS,CAAU;IAC3B,OAAO,CAAC,WAAW,CAAiB;IACpC,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,WAAW,CAAU;IAC7B,OAAO,CAAC,SAAS,CAA0B;IAC3C,OAAO,CAAC,qBAAqB,CAA6E;;IAiB1G,YAAY,IAAI,iBAAiB;IA2BjC,OAAO,CAAC,gBAAgB;IA8BxB,IAAI,CAAC,IAAI,GAAE,UAAU,GAAG,UAAuB,GAAG,IAAI;IAsBtD,IAAI,IAAI,IAAI;IAUZ,OAAO,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI;IAInC,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAI7B,OAAO,CAAC,eAAe;IA4BvB,OAAO,CAAC,eAAe;IAwBvB,OAAO,CAAC,aAAa;IA0CrB,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,cAAc;IAStB,OAAO,CAAC,QAAQ;IAehB,OAAO,CAAC,SAAS;IA8BjB,OAAO,CAAC,aAAa;IAQrB,OAAO,CAAC,eAAe;IA+DvB,OAAO,CAAC,kBAAkB;IAkB1B,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,eAAe;IAkBvB,OAAO,CAAC,mBAAmB;IAwB3B,OAAO,CAAC,QAAQ;IAuBhB,OAAO,CAAC,MAAM;IAmBd,IAAI,IAAI,IAAI;IAOZ,KAAK,IAAI,IAAI;IAKP,yBAAyB,CAAC,cAAc,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IA0BxE,OAAO,IAAI,IAAI;CAOhB;AAED,eAAe,iBAAiB,CAAC"}
1
+ {"version":3,"file":"annotation.d.ts","sourceRoot":"","sources":["../../src/features/annotation.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAqB,MAAM,UAAU,CAAC;AAElE,cAAM,iBAAiB;IACrB,OAAO,CAAC,MAAM,CAA2B;IACzC,OAAO,CAAC,GAAG,CAAkC;IAC7C,OAAO,CAAC,SAAS,CAAU;IAC3B,OAAO,CAAC,WAAW,CAAiB;IACpC,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,WAAW,CAAU;IAC7B,OAAO,CAAC,SAAS,CAA0B;IAC3C,OAAO,CAAC,qBAAqB,CAA6E;;IAiB1G,YAAY,IAAI,iBAAiB;IAkCjC,OAAO,CAAC,gBAAgB;IA8BxB,IAAI,CAAC,IAAI,GAAE,UAAU,GAAG,UAAuB,GAAG,IAAI;IAgCtD,IAAI,IAAI,IAAI;IAUZ,OAAO,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI;IAInC,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAI7B,OAAO,CAAC,eAAe;IA4BvB,OAAO,CAAC,eAAe;IAwBvB,OAAO,CAAC,aAAa;IA0CrB,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,cAAc;IAStB,OAAO,CAAC,QAAQ;IAehB,OAAO,CAAC,SAAS;IA8BjB,OAAO,CAAC,aAAa;IAQrB,OAAO,CAAC,eAAe;IA+DvB,OAAO,CAAC,kBAAkB;IAkB1B,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,eAAe;IAkBvB,OAAO,CAAC,mBAAmB;IAwB3B,OAAO,CAAC,QAAQ;IAuBhB,OAAO,CAAC,MAAM;IAmBd,IAAI,IAAI,IAAI;IAOZ,KAAK,IAAI,IAAI;IAKP,yBAAyB,CAAC,cAAc,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IA0BxE,OAAO,IAAI,IAAI;CAOhB;AAED,eAAe,iBAAiB,CAAC"}
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes