@product7/product7-js 0.1.0

package/package.json

@@ -0,0 +1,114 @@
+{
+	"name": "@product7/product7-js",
+	"version": "0.1.0",
+	"description": "JavaScript SDK for integrating Product7 feedback widgets into any website",
+	"main": "dist/product7-js.js",
+	"module": "src/index.js",
+	"browser": "dist/product7-js.min.js",
+	"types": "types/index.d.ts",
+	"files": [
+		"dist/",
+		"src/",
+		"types/",
+		"README.md"
+	],
+	"scripts": {
+		"build": "npm run build:dev && npm run build:prod",
+		"build:dev": "rollup -c rollup.config.js --environment NODE_ENV:development",
+		"build:prod": "rollup -c rollup.config.js --environment NODE_ENV:production",
+		"dev": "rollup -c rollup.config.js --environment NODE_ENV:development --watch",
+		"serve": "http-server . -p 8080 -c-1",
+		"localstack": "npm run build:dev && echo 'Open http://localhost:8080/test.html?env=localstack' && http-server . -p 8080 -c-1",
+		"dev:test": "npm run build:dev && npm run serve",
+		"test": "jest",
+		"test:watch": "jest --watch",
+		"test:coverage": "jest --coverage",
+		"lint": "eslint src/ --ext .js",
+		"lint:fix": "eslint src/ --ext .js --fix",
+		"typecheck": "tsc --noEmit",
+		"docs": "jsdoc -c jsdoc.config.json",
+		"size": "bundlesize",
+		"precommit": "npm run lint && npm run test",
+		"prepublishOnly": "npm run build && npm run test"
+	},
+	"keywords": [
+		"feedback",
+		"widget",
+		"sdk",
+		"javascript",
+		"product7",
+		"customer-feedback",
+		"user-feedback",
+		"embeddable",
+		"modal",
+		"form"
+	],
+	"author": "Product7 Team",
+	"license": "MIT",
+	"homepage": "https://github.com/product7/product7-js#readme",
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/product7/product7-js.git"
+	},
+	"bugs": {
+		"url": "https://github.com/product7/product7-js/issues"
+	},
+	"engines": {
+		"node": ">=14.0.0"
+	},
+	"browserslist": [
+		"> 1%",
+		"last 2 versions",
+		"not dead",
+		"not ie 11"
+	],
+	"type": "module",
+	"devDependencies": {
+		"@babel/core": "^7.28.3",
+		"@babel/preset-env": "^7.28.3",
+		"@rollup/plugin-babel": "^6.0.4",
+		"@rollup/plugin-commonjs": "^28.0.6",
+		"@rollup/plugin-node-resolve": "^16.0.1",
+		"@rollup/plugin-terser": "^0.4.4",
+		"bundlesize": "^0.18.2",
+		"eslint": "^8.57.1",
+		"eslint-config-standard": "^17.1.0",
+		"http-server": "^14.1.1",
+		"jest": "^30.1.1",
+		"jest-environment-jsdom": "^30.1.1",
+		"jsdoc": "^4.0.4",
+		"prettier": "^3.6.2",
+		"prettier-plugin-organize-imports": "^4.2.0",
+		"rollup": "^4.49.0",
+		"rollup-plugin-copy": "^3.5.0",
+		"rollup-plugin-livereload": "^2.0.5",
+		"rollup-plugin-serve": "^3.0.0",
+		"typescript": "^5.9.2"
+	},
+	"bundlesize": [
+		{
+			"path": "./dist/product7-js.min.js",
+			"maxSize": "25kb"
+		}
+	],
+	"jest": {
+		"testEnvironment": "jsdom",
+		"testMatch": [
+			"**/tests/**/*.test.js",
+			"**/src/**/*.test.js"
+		],
+		"collectCoverageFrom": [
+			"src/**/*.js",
+			"!src/**/*.test.js",
+			"!src/index.js"
+		],
+		"coverageThreshold": {
+			"global": {
+				"branches": 80,
+				"functions": 80,
+				"lines": 80,
+				"statements": 80
+			}
+		}
+	}
+}

package/src/api/mock-data/index.js

@@ -0,0 +1,360 @@
+export const MOCK_CHANGELOGS = [
+	{
+		id: 'changelog_1',
+		title:
+			'Feature prioritization, multiple roadmaps, and feature request analytics.',
+		excerpt:
+			'We are super excited to bring you the long-waited feature prioritization together with many quality updates!',
+		description:
+			'We are super excited to bring you the long-waited feature prioritization together with many quality updates!',
+		cover_image:
+			'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAwIiBoZWlnaHQ9IjI1MCIgdmlld0JveD0iMCAwIDQwMCAyNTAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjQwMCIgaGVpZ2h0PSIyNTAiIGZpbGw9IiNEQkVBRkUiLz48cmVjdCB4PSIyMCIgeT0iMjAiIHdpZHRoPSIzNjAiIGhlaWdodD0iMjEwIiByeD0iOCIgZmlsbD0id2hpdGUiIHN0cm9rZT0iIzE1NUVFRiIgc3Ryb2tlLXdpZHRoPSIyIi8+PHJlY3QgeD0iMzAiIHk9IjQwIiB3aWR0aD0iODAiIGhlaWdodD0iOCIgcng9IjQiIGZpbGw9IiNFNUU3RUIiLz48cmVjdCB4PSIzMCIgeT0iNjAiIHdpZHRoPSIxNDAiIGhlaWdodD0iNDAiIHJ4PSI0IiBmaWxsPSIjRjNGNEY2Ii8+PHRleHQgeD0iNDAiIHk9Ijg1IiBmb250LWZhbWlseT0ic3lzdGVtLXVpIiBmb250LXNpemU9IjE2IiBmb250LXdlaWdodD0iNjAwIiBmaWxsPSIjMUYyOTM3Ij4yMDA8L3RleHQ+PHRleHQgeD0iNDAiIHk9Ijk1IiBmb250LWZhbWlseT0ic3lzdGVtLXVpIiBmb250LXNpemU9IjgiIGZpbGw9IiM2QjcyODAiPlBvc3RzPC90ZXh0PjxyZWN0IHg9IjE4MCIgeT0iNjAiIHdpZHRoPSI4MCIgaGVpZ2h0PSI0MCIgcng9IjQiIGZpbGw9IiNGM0Y0RjYiLz48cmVjdCB4PSIyNzAiIHk9IjYwIiB3aWR0aD0iODAiIGhlaWdodD0iNDAiIHJ4PSI0IiBmaWxsPSIjRjNGNEY2Ii8+PHBhdGggZD0iTTMwIDEzMEgzNzBNMzAgMTUwSDM3ME0zMCAxNzBIMzcwTTMwIDE5MEgzNzAiIHN0cm9rZT0iI0U1RTdFQiIgc3Ryb2tlLXdpZHRoPSIxIi8+PHBhdGggZD0iTTUwIDE2MEwxMDAgMTQwTDE1MCAxNTBMMjAwIDEzMEwyNTAgMTM1TDMwMCAxMjBMMzUwIDEyNSIgc3Ryb2tlPSIjMTU1RUVGIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiLz48L3N2Zz4=',
+		slug: 'feature-prioritization-roadmaps-analytics',
+		published_at: '2025-03-15T10:00:00Z',
+		labels: [
+			{ name: 'New Feature', color: '#10B981' },
+			{ name: 'Analytics', color: '#6366F1' },
+		],
+		status: 'published',
+	},
+	{
+		id: 'changelog_2',
+		title: 'Dark mode support and UI improvements',
+		excerpt:
+			'You asked for it, we delivered! Dark mode is now available across all pages.',
+		description:
+			'You asked for it, we delivered! Dark mode is now available across all pages.',
+		cover_image:
+			'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAwIiBoZWlnaHQ9IjI1MCIgdmlld0JveD0iMCAwIDQwMCAyNTAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjQwMCIgaGVpZ2h0PSIyNTAiIGZpbGw9IiMxRjI5MzciLz48cmVjdCB4PSIyMCIgeT0iMjAiIHdpZHRoPSIzNjAiIGhlaWdodD0iMjEwIiByeD0iOCIgZmlsbD0iIzM3NDE1MSIgc3Ryb2tlPSIjNEI1NTYzIiBzdHJva2Utd2lkdGg9IjEiLz48Y2lyY2xlIGN4PSIyMDAiIGN5PSIxMjUiIHI9IjQwIiBmaWxsPSIjRkJCRjI0Ii8+PHBhdGggZD0iTTIyMCAxMjVDMjIwIDEzNiAyMTEgMTQ1IDIwMCAxNDVDMTg5IDE0NSAxODAgMTM2IDE4MCAxMjVDMTgwIDExNCAxODkgMTA1IDIwMCAxMDVDMjExIDEwNSAyMjAgMTE0IDIyMCAxMjVaIiBmaWxsPSIjMUYyOTM3Ii8+PC9zdmc+',
+		slug: 'dark-mode-ui-improvements',
+		published_at: '2025-03-01T10:00:00Z',
+		labels: [{ name: 'Enhancement', color: '#8B5CF6' }],
+		status: 'published',
+	},
+	{
+		id: 'changelog_3',
+		title: 'Performance improvements and bug fixes',
+		excerpt:
+			'This release includes major performance improvements and several bug fixes.',
+		description:
+			'This release includes major performance improvements and several bug fixes.',
+		slug: 'performance-improvements-bug-fixes',
+		published_at: '2025-02-15T10:00:00Z',
+		labels: [
+			{ name: 'Bug Fix', color: '#EF4444' },
+			{ name: 'Performance', color: '#F59E0B' },
+		],
+		status: 'published',
+	},
+];
+
+export const MOCK_CONVERSATIONS = [
+	{
+		id: 'conv_1',
+		subject: 'Question about pricing',
+		status: 'open',
+		last_message_at: new Date(Date.now() - 49 * 60 * 1000).toISOString(),
+		created_at: new Date(Date.now() - 2 * 24 * 60 * 60 * 1000).toISOString(),
+		unread: 1,
+		assigned_user: {
+			id: 'user_1',
+			name: 'Sarah',
+			avatar: null,
+		},
+	},
+	{
+		id: 'conv_2',
+		subject: 'Feature request',
+		status: 'open',
+		last_message_at: new Date(
+			Date.now() - 6 * 24 * 60 * 60 * 1000
+		).toISOString(),
+		created_at: new Date(Date.now() - 10 * 24 * 60 * 60 * 1000).toISOString(),
+		unread: 0,
+		assigned_user: {
+			id: 'user_2',
+			name: 'Tom',
+			avatar: null,
+		},
+	},
+];
+
+export const MOCK_MESSAGES = {
+	conv_1: [
+		{
+			id: 'msg_1',
+			content: "Hi there! 👋 I'm Sarah. How can I help you today?",
+			sender_type: 'agent',
+			sender_name: 'Sarah',
+			sender_avatar: null,
+			created_at: new Date(Date.now() - 50 * 60 * 1000).toISOString(),
+		},
+		{
+			id: 'msg_2',
+			content: 'Hi! I have a question about your enterprise pricing.',
+			sender_type: 'customer',
+			created_at: new Date(Date.now() - 49 * 60 * 1000).toISOString(),
+		},
+	],
+	conv_2: [
+		{
+			id: 'msg_3',
+			content: "Hello! I'm Tom from the product team.",
+			sender_type: 'agent',
+			sender_name: 'Tom',
+			sender_avatar: null,
+			created_at: new Date(Date.now() - 7 * 24 * 60 * 60 * 1000).toISOString(),
+		},
+		{
+			id: 'msg_4',
+			content: 'I would love to see a dark mode feature!',
+			sender_type: 'customer',
+			created_at: new Date(
+				Date.now() - 6 * 24 * 60 * 60 * 1000 - 30 * 60 * 1000
+			).toISOString(),
+		},
+		{
+			id: 'msg_5',
+			content:
+				"Great suggestion! That feature will be available next week. I'll let you know when it's ready.",
+			sender_type: 'agent',
+			sender_name: 'Tom',
+			sender_avatar: null,
+			created_at: new Date(Date.now() - 6 * 24 * 60 * 60 * 1000).toISOString(),
+		},
+	],
+};
+
+export const MOCK_HELP_COLLECTIONS = [
+	{
+		id: 'collection_1',
+		title: 'Product Overview',
+		description: 'See how your AI-first customer service solution works.',
+		articleCount: 24,
+		icon: 'ph-book-open',
+		url: '#',
+	},
+	{
+		id: 'collection_2',
+		title: 'Getting Started',
+		description: 'Everything you need to know to get started with Product7.',
+		articleCount: 30,
+		icon: 'ph-rocket',
+		url: '#',
+	},
+	{
+		id: 'collection_3',
+		title: 'AI Agent',
+		description:
+			'Resolving customer questions instantly and accurately—from live chat to email.',
+		articleCount: 82,
+		icon: 'ph-robot',
+		url: '#',
+	},
+	{
+		id: 'collection_4',
+		title: 'Channels',
+		description:
+			'Enabling the channels you use to communicate with customers, all from the Inbox.',
+		articleCount: 45,
+		icon: 'ph-chat-circle',
+		url: '#',
+	},
+	{
+		id: 'collection_5',
+		title: 'Billing & Payments',
+		description: 'Manage your subscription, invoices, and payment methods.',
+		articleCount: 12,
+		icon: 'ph-credit-card',
+		url: '#',
+	},
+];
+
+export const MOCK_SURVEYS = [
+	{
+		id: 'mock_nps_survey',
+		name: 'NPS Score',
+		slug: 'nps',
+		status: 'active',
+		trigger_type: 'manual',
+		pages: [
+			{
+				id: 'nps-page-1',
+				type: 'rating',
+				title: 'How likely are you to recommend us to a friend?',
+				description: '',
+				placeholder: '',
+				rating_config: {
+					scale: 11,
+					low_label: 'Very unlikely',
+					high_label: 'Very likely',
+					survey_type: 'nps',
+				},
+				multiple_choice_config: null,
+				link_config: null,
+				after_this_page: { default: 'end_survey', conditions: [] },
+				required: true,
+			},
+		],
+	},
+	{
+		id: 'mock_csat_survey',
+		name: 'CSAT Survey',
+		slug: 'csat',
+		status: 'active',
+		trigger_type: 'manual',
+		pages: [
+			{
+				id: 'csat-page-1',
+				type: 'rating',
+				title: 'How satisfied are you with our service?',
+				description: '',
+				placeholder: '',
+				rating_config: {
+					scale: 5,
+					low_label: 'Very dissatisfied',
+					high_label: 'Very satisfied',
+					survey_type: 'emoji',
+				},
+				multiple_choice_config: null,
+				link_config: null,
+				after_this_page: { default: 'end_survey', conditions: [] },
+				required: true,
+			},
+		],
+	},
+	{
+		id: 'mock_ces_survey',
+		name: 'Customer Effort Score',
+		slug: 'ces',
+		status: 'active',
+		trigger_type: 'manual',
+		pages: [
+			{
+				id: 'ces-page-1',
+				type: 'rating',
+				title: 'How easy was it to use our product?',
+				description: '',
+				placeholder: '',
+				rating_config: {
+					scale: 5,
+					low_label: 'Very difficult',
+					high_label: 'Very easy',
+					survey_type: 'ces',
+				},
+				multiple_choice_config: null,
+				link_config: null,
+				after_this_page: { default: 'end_survey', conditions: [] },
+				required: true,
+			},
+		],
+	},
+	{
+		id: 'mock_open_question_survey',
+		name: 'Open Question',
+		slug: 'open-question',
+		status: 'active',
+		trigger_type: 'manual',
+		pages: [
+			{
+				id: 'open-page-1',
+				type: 'text',
+				title: 'What could we do better?',
+				description:
+					'Is there anything we could do to make our product better for you?',
+				placeholder: 'Type your answer here',
+				rating_config: null,
+				multiple_choice_config: null,
+				link_config: null,
+				after_this_page: { default: 'end_survey', conditions: [] },
+				required: true,
+			},
+		],
+	},
+	{
+		id: 'mock_product_idea_poll_survey',
+		name: 'Product Idea Poll',
+		slug: 'product-idea-poll',
+		status: 'active',
+		trigger_type: 'manual',
+		pages: [
+			{
+				id: 'poll-page-1',
+				type: 'multiple_choice',
+				title: 'Which feature should we add next?',
+				description: 'Vote on the feature you would like to see next.',
+				placeholder: '',
+				rating_config: null,
+				multiple_choice_config: {
+					allow_multiple_selection: false,
+					survey_type: 'regular',
+					options: [
+						{ id: 'opt1', label: 'Better reporting' },
+						{ id: 'opt2', label: 'Mobile app' },
+						{ id: 'opt3', label: 'Integrations' },
+						{ id: 'opt4', label: 'AI features' },
+					],
+				},
+				link_config: null,
+				after_this_page: { default: 'end_survey', conditions: [] },
+				required: true,
+			},
+		],
+	},
+	{
+		id: 'mock_pmf_survey',
+		name: 'Product Market Fit (PMF)',
+		slug: 'pmf',
+		status: 'active',
+		trigger_type: 'manual',
+		pages: [
+			{
+				id: 'pmf-page-1',
+				type: 'multiple_choice',
+				title: 'How would you feel if you could no longer use our product?',
+				description: '',
+				placeholder: '',
+				rating_config: null,
+				multiple_choice_config: {
+					allow_multiple_selection: false,
+					survey_type: 'regular',
+					options: [
+						{ id: 'very_disappointed', label: 'Very disappointed' },
+						{ id: 'somewhat_disappointed', label: 'Somewhat disappointed' },
+						{ id: 'not_disappointed', label: 'Not disappointed' },
+					],
+				},
+				link_config: null,
+				after_this_page: { default: 'end_survey', conditions: [] },
+				required: true,
+			},
+		],
+	},
+	{
+		id: 'mock_user_interview_survey',
+		name: 'User Interview Request',
+		slug: 'user-interview',
+		status: 'active',
+		trigger_type: 'manual',
+		pages: [
+			{
+				id: 'interview-page-1',
+				type: 'link',
+				title: 'Would you like to hop on a quick demo?',
+				description:
+					'We would love to hear your thoughts and answer any questions you have.',
+				placeholder: '',
+				rating_config: null,
+				multiple_choice_config: null,
+				link_config: {
+					button_text: 'Book a demo',
+					link_text: '',
+					redirect_url: 'https://example.com',
+					open_in: 'new_tab',
+				},
+				after_this_page: { default: 'end_survey', conditions: [] },
+				required: true,
+			},
+		],
+	},
+];

package/src/api/services/ChangelogService.js

@@ -0,0 +1,28 @@
+import { MOCK_CHANGELOGS } from '../mock-data/index.js';
+import { delay } from '../utils/helpers.js';
+
+export class ChangelogService {
+	constructor(baseAPI) {
+		this.api = baseAPI;
+	}
+
+	async getChangelogs(options = {}) {
+		await this.api._ensureSession();
+
+		if (this.api.mock) {
+			await delay(300);
+			return { success: true, data: MOCK_CHANGELOGS };
+		}
+
+		return this.api._handleAuthRetry(async () => {
+			const endpoint = this.api._getEndpointWithParams(
+				'/widget/changelogs',
+				options
+			);
+			return await this.api._makeRequest(endpoint, {
+				method: 'GET',
+				headers: { Authorization: `Bearer ${this.api.sessionToken}` },
+			});
+		});
+	}
+}

package/src/api/services/FeedbackService.js

@@ -0,0 +1,44 @@
+import { delay } from '../utils/helpers.js';
+
+export class FeedbackService {
+	constructor(baseAPI) {
+		this.api = baseAPI;
+	}
+
+	async submitFeedback(feedbackData) {
+		await this.api._ensureSession();
+
+		if (this.api.mock) {
+			await delay(500);
+			return {
+				success: true,
+				data: {
+					id: 'mock_post_' + Date.now(),
+					title: feedbackData.title,
+					content: feedbackData.content,
+				},
+				message: 'Feedback submitted successfully!',
+			};
+		}
+
+		const payload = {
+			board:
+				feedbackData.board_id || feedbackData.board || feedbackData.boardName,
+			title: feedbackData.title,
+			content: feedbackData.content,
+			attachments: feedbackData.attachments || [],
+		};
+
+		return this.api._handleAuthRetry(async () => {
+			const response = await this.api._makeRequest('/widget/feedback', {
+				method: 'POST',
+				body: JSON.stringify(payload),
+				headers: {
+					'Content-Type': 'application/json',
+					Authorization: `Bearer ${this.api.sessionToken}`,
+				},
+			});
+			return response;
+		});
+	}
+}

package/src/api/services/HelpService.js

@@ -0,0 +1,50 @@
+import { MOCK_HELP_COLLECTIONS } from '../mock-data/index.js';
+import { delay } from '../utils/helpers.js';
+
+export class HelpService {
+	constructor(baseAPI) {
+		this.api = baseAPI;
+	}
+
+	async getHelpCollections(options = {}) {
+		await this.api._ensureSession();
+
+		if (this.api.mock) {
+			await delay(200);
+			return { status: true, data: MOCK_HELP_COLLECTIONS };
+		}
+
+		const endpoint = this.api._getEndpointWithParams(
+			'/widget/help/collections',
+			options
+		);
+		return this.api._makeRequest(endpoint, {
+			method: 'GET',
+			headers: { Authorization: `Bearer ${this.api.sessionToken}` },
+		});
+	}
+
+	async searchHelpArticles(query, options = {}) {
+		await this.api._ensureSession();
+
+		if (this.api.mock) {
+			await delay(200);
+			const filtered = MOCK_HELP_COLLECTIONS.filter(
+				(c) =>
+					c.title.toLowerCase().includes(query.toLowerCase()) ||
+					c.description.toLowerCase().includes(query.toLowerCase())
+			);
+			return { status: true, data: filtered };
+		}
+
+		const params = { q: query, ...options };
+		const endpoint = this.api._getEndpointWithParams(
+			'/widget/help/search',
+			params
+		);
+		return this.api._makeRequest(endpoint, {
+			method: 'GET',
+			headers: { Authorization: `Bearer ${this.api.sessionToken}` },
+		});
+	}
+}