spaps-issue-reporting-react 0.5.0 → 0.6.1

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.
@@ -0,0 +1,174 @@
1
+ import { ReactNode } from 'react';
2
+ import { IssueReportScope, IssueReportStatusResult, IssueReportStatus, IssueReportListResult, IssueReport, CreateIssueReportRequest, UpdateIssueReportRequest, ReplyIssueReportRequest, IssueReportingVoiceTokenResult, IssueReportAttachmentOut, ListIssueReportMessagesResponse, CreateReporterMessageRequest, IssueReportMessage, IssueReportingInputMode, IssueReportingVoiceProvider } from 'spaps-types';
3
+
4
+ interface IssueReportingVoiceMicrophoneConfig {
5
+ deviceId?: string;
6
+ echoCancellation?: boolean;
7
+ noiseSuppression?: boolean;
8
+ autoGainControl?: boolean;
9
+ channelCount?: number;
10
+ }
11
+ interface IssueReportingVoiceConfig {
12
+ provider?: IssueReportingVoiceProvider;
13
+ modelId?: string;
14
+ requireMicrophonePermission?: boolean;
15
+ microphone?: IssueReportingVoiceMicrophoneConfig;
16
+ }
17
+ type IssueReportingScreenshotCaptureTiming = "before_submit";
18
+ type IssueReportingScreenshotCaptureScope = "visible_viewport" | "selected_reportable_target";
19
+ type IssueReportingScreenshotImageType = "image/png" | "image/jpeg" | "image/webp";
20
+ type IssueReportingScreenshotCaptureFailureBehavior = "continue_without_screenshot";
21
+ interface IssueReportingScreenshotCaptureRect {
22
+ top: number;
23
+ left: number;
24
+ width: number;
25
+ height: number;
26
+ }
27
+ interface IssueReportingScreenshotCaptureContext {
28
+ pageUrl: string;
29
+ createMode: IssueReportingCreateMode;
30
+ inputMode: IssueReportingInputMode;
31
+ target: ReportableTargetDescriptor;
32
+ }
33
+ interface IssueReportingScreenshotCaptureConfig {
34
+ enabled: boolean;
35
+ captureOn?: IssueReportingScreenshotCaptureTiming;
36
+ scope?: IssueReportingScreenshotCaptureScope;
37
+ imageType?: IssueReportingScreenshotImageType;
38
+ filename?: string | ((context: IssueReportingScreenshotCaptureContext) => string);
39
+ rootElement?: HTMLElement | (() => HTMLElement | null);
40
+ rect?: IssueReportingScreenshotCaptureRect | (() => IssueReportingScreenshotCaptureRect | null | undefined);
41
+ excludeSelectors?: string[];
42
+ maskSelectors?: string[];
43
+ pixelRatio?: number;
44
+ quality?: number;
45
+ maxBytes?: number;
46
+ failureBehavior?: IssueReportingScreenshotCaptureFailureBehavior;
47
+ onCaptureError?: (error: unknown) => void;
48
+ }
49
+ interface IssueReportingClient {
50
+ issueReporting: {
51
+ getStatus: (params?: {
52
+ scope?: IssueReportScope;
53
+ }) => Promise<IssueReportStatusResult>;
54
+ list: (params?: {
55
+ status?: IssueReportStatus;
56
+ limit?: number;
57
+ offset?: number;
58
+ scope?: IssueReportScope;
59
+ }) => Promise<IssueReportListResult>;
60
+ get: (issueReportId: string) => Promise<IssueReport>;
61
+ create: (payload: CreateIssueReportRequest) => Promise<IssueReport>;
62
+ update: (issueReportId: string, payload: UpdateIssueReportRequest) => Promise<IssueReport>;
63
+ reply: (issueReportId: string, payload: ReplyIssueReportRequest) => Promise<IssueReport>;
64
+ createVoiceToken?: () => Promise<IssueReportingVoiceTokenResult>;
65
+ uploadAttachment?: (file: Blob, options?: {
66
+ filename?: string;
67
+ }) => Promise<IssueReportAttachmentOut>;
68
+ listMessages?: (issueReportId: string) => Promise<ListIssueReportMessagesResponse>;
69
+ submitMessage?: (issueReportId: string, payload: CreateReporterMessageRequest) => Promise<IssueReportMessage>;
70
+ };
71
+ }
72
+ interface ReportableTargetDescriptor {
73
+ componentKey: string;
74
+ componentLabel?: string;
75
+ surfaceRef?: string | null;
76
+ metadata?: Record<string, unknown>;
77
+ }
78
+ type ReportableInput = string | ReportableTargetDescriptor;
79
+ type IssueReportingCreateMode = "general_page" | "surface_required" | "surface_preferred";
80
+ type IssueHistoryFilter = "all" | "unresolved" | "resolved";
81
+ interface IssueReportingCopy {
82
+ entryAriaLabel: string;
83
+ popoverTitle: string;
84
+ reportNewAction: string;
85
+ reportPageAction: string;
86
+ reportSpecificAction: string;
87
+ filtersAll: string;
88
+ filtersUnresolved: string;
89
+ filtersResolved: string;
90
+ historyHelpText: string;
91
+ historyLoading: string;
92
+ historyLoadFailed: string;
93
+ statusLoadFailed: string;
94
+ emptyAll: string;
95
+ emptyUnresolved: string;
96
+ emptyResolved: string;
97
+ scopeLabel: string;
98
+ scopeMine: string;
99
+ scopeTenant: string;
100
+ reportModeTitle: string;
101
+ reportModeDescription: string;
102
+ reportModeCancelAction: string;
103
+ generalPageTargetLabel: string;
104
+ surfaceRequiredDescription: string;
105
+ specificSectionUnavailableDescription: string;
106
+ createTitlePrefix: string;
107
+ editTitlePrefix: string;
108
+ replyTitlePrefix: string;
109
+ createDescriptionPrefix: string;
110
+ editDescription: string;
111
+ replyDescription: string;
112
+ notePlaceholder: string;
113
+ noteMinimumSuffix: string;
114
+ keyboardShortcutHint: string;
115
+ originalIssueLabel: string;
116
+ cancelAction: string;
117
+ submitAction: string;
118
+ submittingAction: string;
119
+ editAction: string;
120
+ replyAction: string;
121
+ hydrateLoading: string;
122
+ hydrateFailed: string;
123
+ retryAction: string;
124
+ originHumanLabel: string;
125
+ originMachineLabel: string;
126
+ machineOriginFallback: string;
127
+ threadTitle: string;
128
+ threadDescription: string;
129
+ threadLoading: string;
130
+ threadLoadFailed: string;
131
+ threadEmpty: string;
132
+ threadNeedsResponseBadge: string;
133
+ threadAuthorOperator: string;
134
+ threadAuthorReporter: string;
135
+ threadKindClarificationRequest: string;
136
+ threadKindReporterResponse: string;
137
+ threadKindFinalResponse: string;
138
+ threadResponsePlaceholder: string;
139
+ threadResponseLabel: string;
140
+ threadResponseSubmitAction: string;
141
+ threadResponseSubmittingAction: string;
142
+ threadResponseConflict: string;
143
+ threadResponseFailed: string;
144
+ }
145
+ interface IssueReportingProviderProps {
146
+ client: IssueReportingClient;
147
+ isEligible: boolean;
148
+ reporterRoleHint?: string;
149
+ principalId?: string | null;
150
+ getPageUrl?: () => string;
151
+ defaultScope?: IssueReportScope;
152
+ allowTenantScope?: boolean;
153
+ defaultCreateMode?: IssueReportingCreateMode;
154
+ inputModes?: IssueReportingInputMode[];
155
+ defaultInputMode?: IssueReportingInputMode;
156
+ voice?: IssueReportingVoiceConfig;
157
+ /**
158
+ * Opt-in, lazy automatic same-origin DOM screenshot capture. html2canvas is
159
+ * loaded only when this config is enabled during create submit, and capture
160
+ * failures continue submission without a screenshot attachment.
161
+ */
162
+ screenshotCapture?: IssueReportingScreenshotCaptureConfig;
163
+ copy?: Partial<IssueReportingCopy>;
164
+ children: ReactNode;
165
+ }
166
+ interface FloatingIssueReportButtonProps {
167
+ className?: string;
168
+ positionClassName?: string;
169
+ }
170
+ interface IssueReportingPageConfigProps {
171
+ createMode: IssueReportingCreateMode;
172
+ }
173
+
174
+ export type { FloatingIssueReportButtonProps as F, IssueReportingPageConfigProps as I, ReportableInput as R, IssueReportingProviderProps as a, IssueReportingCopy as b, IssueHistoryFilter as c, IssueReportingCreateMode as d, IssueReportingVoiceConfig as e, IssueReportingScreenshotCaptureConfig as f, IssueReportingClient as g, IssueReportingScreenshotCaptureContext as h, IssueReportingScreenshotCaptureFailureBehavior as i, IssueReportingScreenshotCaptureRect as j, IssueReportingScreenshotCaptureScope as k, IssueReportingScreenshotCaptureTiming as l, IssueReportingScreenshotImageType as m, ReportableTargetDescriptor as n };
@@ -0,0 +1,174 @@
1
+ import { ReactNode } from 'react';
2
+ import { IssueReportScope, IssueReportStatusResult, IssueReportStatus, IssueReportListResult, IssueReport, CreateIssueReportRequest, UpdateIssueReportRequest, ReplyIssueReportRequest, IssueReportingVoiceTokenResult, IssueReportAttachmentOut, ListIssueReportMessagesResponse, CreateReporterMessageRequest, IssueReportMessage, IssueReportingInputMode, IssueReportingVoiceProvider } from 'spaps-types';
3
+
4
+ interface IssueReportingVoiceMicrophoneConfig {
5
+ deviceId?: string;
6
+ echoCancellation?: boolean;
7
+ noiseSuppression?: boolean;
8
+ autoGainControl?: boolean;
9
+ channelCount?: number;
10
+ }
11
+ interface IssueReportingVoiceConfig {
12
+ provider?: IssueReportingVoiceProvider;
13
+ modelId?: string;
14
+ requireMicrophonePermission?: boolean;
15
+ microphone?: IssueReportingVoiceMicrophoneConfig;
16
+ }
17
+ type IssueReportingScreenshotCaptureTiming = "before_submit";
18
+ type IssueReportingScreenshotCaptureScope = "visible_viewport" | "selected_reportable_target";
19
+ type IssueReportingScreenshotImageType = "image/png" | "image/jpeg" | "image/webp";
20
+ type IssueReportingScreenshotCaptureFailureBehavior = "continue_without_screenshot";
21
+ interface IssueReportingScreenshotCaptureRect {
22
+ top: number;
23
+ left: number;
24
+ width: number;
25
+ height: number;
26
+ }
27
+ interface IssueReportingScreenshotCaptureContext {
28
+ pageUrl: string;
29
+ createMode: IssueReportingCreateMode;
30
+ inputMode: IssueReportingInputMode;
31
+ target: ReportableTargetDescriptor;
32
+ }
33
+ interface IssueReportingScreenshotCaptureConfig {
34
+ enabled: boolean;
35
+ captureOn?: IssueReportingScreenshotCaptureTiming;
36
+ scope?: IssueReportingScreenshotCaptureScope;
37
+ imageType?: IssueReportingScreenshotImageType;
38
+ filename?: string | ((context: IssueReportingScreenshotCaptureContext) => string);
39
+ rootElement?: HTMLElement | (() => HTMLElement | null);
40
+ rect?: IssueReportingScreenshotCaptureRect | (() => IssueReportingScreenshotCaptureRect | null | undefined);
41
+ excludeSelectors?: string[];
42
+ maskSelectors?: string[];
43
+ pixelRatio?: number;
44
+ quality?: number;
45
+ maxBytes?: number;
46
+ failureBehavior?: IssueReportingScreenshotCaptureFailureBehavior;
47
+ onCaptureError?: (error: unknown) => void;
48
+ }
49
+ interface IssueReportingClient {
50
+ issueReporting: {
51
+ getStatus: (params?: {
52
+ scope?: IssueReportScope;
53
+ }) => Promise<IssueReportStatusResult>;
54
+ list: (params?: {
55
+ status?: IssueReportStatus;
56
+ limit?: number;
57
+ offset?: number;
58
+ scope?: IssueReportScope;
59
+ }) => Promise<IssueReportListResult>;
60
+ get: (issueReportId: string) => Promise<IssueReport>;
61
+ create: (payload: CreateIssueReportRequest) => Promise<IssueReport>;
62
+ update: (issueReportId: string, payload: UpdateIssueReportRequest) => Promise<IssueReport>;
63
+ reply: (issueReportId: string, payload: ReplyIssueReportRequest) => Promise<IssueReport>;
64
+ createVoiceToken?: () => Promise<IssueReportingVoiceTokenResult>;
65
+ uploadAttachment?: (file: Blob, options?: {
66
+ filename?: string;
67
+ }) => Promise<IssueReportAttachmentOut>;
68
+ listMessages?: (issueReportId: string) => Promise<ListIssueReportMessagesResponse>;
69
+ submitMessage?: (issueReportId: string, payload: CreateReporterMessageRequest) => Promise<IssueReportMessage>;
70
+ };
71
+ }
72
+ interface ReportableTargetDescriptor {
73
+ componentKey: string;
74
+ componentLabel?: string;
75
+ surfaceRef?: string | null;
76
+ metadata?: Record<string, unknown>;
77
+ }
78
+ type ReportableInput = string | ReportableTargetDescriptor;
79
+ type IssueReportingCreateMode = "general_page" | "surface_required" | "surface_preferred";
80
+ type IssueHistoryFilter = "all" | "unresolved" | "resolved";
81
+ interface IssueReportingCopy {
82
+ entryAriaLabel: string;
83
+ popoverTitle: string;
84
+ reportNewAction: string;
85
+ reportPageAction: string;
86
+ reportSpecificAction: string;
87
+ filtersAll: string;
88
+ filtersUnresolved: string;
89
+ filtersResolved: string;
90
+ historyHelpText: string;
91
+ historyLoading: string;
92
+ historyLoadFailed: string;
93
+ statusLoadFailed: string;
94
+ emptyAll: string;
95
+ emptyUnresolved: string;
96
+ emptyResolved: string;
97
+ scopeLabel: string;
98
+ scopeMine: string;
99
+ scopeTenant: string;
100
+ reportModeTitle: string;
101
+ reportModeDescription: string;
102
+ reportModeCancelAction: string;
103
+ generalPageTargetLabel: string;
104
+ surfaceRequiredDescription: string;
105
+ specificSectionUnavailableDescription: string;
106
+ createTitlePrefix: string;
107
+ editTitlePrefix: string;
108
+ replyTitlePrefix: string;
109
+ createDescriptionPrefix: string;
110
+ editDescription: string;
111
+ replyDescription: string;
112
+ notePlaceholder: string;
113
+ noteMinimumSuffix: string;
114
+ keyboardShortcutHint: string;
115
+ originalIssueLabel: string;
116
+ cancelAction: string;
117
+ submitAction: string;
118
+ submittingAction: string;
119
+ editAction: string;
120
+ replyAction: string;
121
+ hydrateLoading: string;
122
+ hydrateFailed: string;
123
+ retryAction: string;
124
+ originHumanLabel: string;
125
+ originMachineLabel: string;
126
+ machineOriginFallback: string;
127
+ threadTitle: string;
128
+ threadDescription: string;
129
+ threadLoading: string;
130
+ threadLoadFailed: string;
131
+ threadEmpty: string;
132
+ threadNeedsResponseBadge: string;
133
+ threadAuthorOperator: string;
134
+ threadAuthorReporter: string;
135
+ threadKindClarificationRequest: string;
136
+ threadKindReporterResponse: string;
137
+ threadKindFinalResponse: string;
138
+ threadResponsePlaceholder: string;
139
+ threadResponseLabel: string;
140
+ threadResponseSubmitAction: string;
141
+ threadResponseSubmittingAction: string;
142
+ threadResponseConflict: string;
143
+ threadResponseFailed: string;
144
+ }
145
+ interface IssueReportingProviderProps {
146
+ client: IssueReportingClient;
147
+ isEligible: boolean;
148
+ reporterRoleHint?: string;
149
+ principalId?: string | null;
150
+ getPageUrl?: () => string;
151
+ defaultScope?: IssueReportScope;
152
+ allowTenantScope?: boolean;
153
+ defaultCreateMode?: IssueReportingCreateMode;
154
+ inputModes?: IssueReportingInputMode[];
155
+ defaultInputMode?: IssueReportingInputMode;
156
+ voice?: IssueReportingVoiceConfig;
157
+ /**
158
+ * Opt-in, lazy automatic same-origin DOM screenshot capture. html2canvas is
159
+ * loaded only when this config is enabled during create submit, and capture
160
+ * failures continue submission without a screenshot attachment.
161
+ */
162
+ screenshotCapture?: IssueReportingScreenshotCaptureConfig;
163
+ copy?: Partial<IssueReportingCopy>;
164
+ children: ReactNode;
165
+ }
166
+ interface FloatingIssueReportButtonProps {
167
+ className?: string;
168
+ positionClassName?: string;
169
+ }
170
+ interface IssueReportingPageConfigProps {
171
+ createMode: IssueReportingCreateMode;
172
+ }
173
+
174
+ export type { FloatingIssueReportButtonProps as F, IssueReportingPageConfigProps as I, ReportableInput as R, IssueReportingProviderProps as a, IssueReportingCopy as b, IssueHistoryFilter as c, IssueReportingCreateMode as d, IssueReportingVoiceConfig as e, IssueReportingScreenshotCaptureConfig as f, IssueReportingClient as g, IssueReportingScreenshotCaptureContext as h, IssueReportingScreenshotCaptureFailureBehavior as i, IssueReportingScreenshotCaptureRect as j, IssueReportingScreenshotCaptureScope as k, IssueReportingScreenshotCaptureTiming as l, IssueReportingScreenshotImageType as m, ReportableTargetDescriptor as n };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "spaps-issue-reporting-react",
3
- "version": "0.5.0",
3
+ "version": "0.6.1",
4
4
  "description": "Shared React issue-reporting UI for Sweet Potato platform consumers",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -9,11 +9,23 @@
9
9
  "types": "./dist/index.d.ts",
10
10
  "import": "./dist/index.mjs",
11
11
  "require": "./dist/index.js"
12
+ },
13
+ "./screenshot-capture": {
14
+ "types": "./dist/screenshot-capture.d.ts",
15
+ "import": "./dist/screenshot-capture.mjs",
16
+ "require": "./dist/screenshot-capture.js"
17
+ }
18
+ },
19
+ "typesVersions": {
20
+ "*": {
21
+ "screenshot-capture": [
22
+ "dist/screenshot-capture.d.ts"
23
+ ]
12
24
  }
13
25
  },
14
26
  "scripts": {
15
- "build": "tsup --tsconfig tsconfig.json src/index.ts --format cjs,esm --dts --clean",
16
- "dev": "tsup --tsconfig tsconfig.json src/index.ts --format cjs,esm --dts --watch",
27
+ "build": "tsup --tsconfig tsconfig.json src/index.ts src/screenshot-capture.ts --format cjs,esm --dts --clean",
28
+ "dev": "tsup --tsconfig tsconfig.json src/index.ts src/screenshot-capture.ts --format cjs,esm --dts --watch",
17
29
  "test": "vitest run",
18
30
  "test:cov": "vitest run --coverage --coverage.reporter=lcov --coverage.reporter=text",
19
31
  "prepublishOnly": "npm run build && npm run test"
@@ -40,13 +52,19 @@
40
52
  "@radix-ui/react-dialog": "^1.1.15",
41
53
  "@radix-ui/react-popover": "^1.1.15",
42
54
  "date-fns": "^4.1.0",
43
- "spaps-types": "^1.4.2"
55
+ "spaps-types": "^1.5.0"
44
56
  },
45
57
  "peerDependencies": {
46
58
  "@tanstack/react-query": ">=5.0.0",
59
+ "html2canvas": ">=1.4.0",
47
60
  "react": ">=18.0.0",
48
61
  "react-dom": ">=18.0.0"
49
62
  },
63
+ "peerDependenciesMeta": {
64
+ "html2canvas": {
65
+ "optional": true
66
+ }
67
+ },
50
68
  "devDependencies": {
51
69
  "@tanstack/react-query": "^5.90.10",
52
70
  "@testing-library/jest-dom": "^6.4.5",
@@ -56,6 +74,7 @@
56
74
  "@types/react": "^18.3.5",
57
75
  "@types/react-dom": "^18.3.0",
58
76
  "@vitest/coverage-v8": "^4.1.5",
77
+ "html2canvas": "^1.4.1",
59
78
  "jsdom": "^22.1.0",
60
79
  "react": "^18.3.1",
61
80
  "react-dom": "^18.3.1",