@inploi/plugin-chatbot 2.1.0 → 2.1.1

package/src/ui/send-button.tsx

@@ -1,27 +0,0 @@
-import clsx from 'clsx';
-import { ComponentProps } from 'preact';
-
-export const SendButton = ({ class: className, ...props }: ComponentProps<'button'>) => (
-	<button
-		class={clsx(
-			'p-2 flex-shrink-0 bg-accent-7 active:bg-accent-10 active:text-accent-4 rounded-full text-lowest pointer-coarse:touch-hitbox disabled:opacity-50 disabled:cursor-not-allowed',
-			className,
-		)}
-		{...props}
-	>
-		<svg
-			class="block"
-			width="16"
-			height="16"
-			viewBox="0 0 16 16"
-			fill="transparent"
-			stroke="currentColor"
-			stroke-linecap="round"
-			stroke-width="2"
-		>
-			<title>Send</title>
-			<path d="M3.5 7.5L8 3L12.5 7.5" />
-			<path d="M8 4V13" />
-		</svg>
-	</button>
-);

package/src/ui/transition.tsx

@@ -1 +0,0 @@
-export type TransitionState = 'entering' | 'entered' | 'exiting' | 'exited';

package/src/ui/typing-indicator.tsx

@@ -1,12 +0,0 @@
-import clsx from 'clsx';
-import { ComponentProps } from 'react';
-
-export const TypingIndicator = ({ className, ...props }: ComponentProps<'div'>) => {
-	return (
-		<div class={clsx('flex gap-1 p-4', className)} {...props}>
-			{Array.from({ length: 3 }, (_, i) => (
-				<div class="h-1.5 w-1.5 rounded-full bg-accent-7 animate-bounce" style={{ animationDelay: `${-i * 200}ms` }} />
-			))}
-		</div>
-	);
-};

package/src/ui/useChatService.ts

@@ -1,67 +0,0 @@
-import { useMemo, useRef, useState } from 'preact/hooks';
-import { match } from 'ts-pattern';
-import { application } from '~/chatbot.state';
-import { AbortedError } from '~/chatbot.utils';
-import { ChatService } from '~/interpreter/interpreter';
-
-import { SubmitSuccessFn } from './chat-input/chat-input';
-
-const TYPING_SPEED_MS_PER_CHARACTER = 25;
-
-export const useChatService = () => {
-	const chatRef = useRef<HTMLDivElement>(null);
-	const [isBotTyping, setIsBotTyping] = useState(false);
-	const [onSubmitSuccessFn, setOnSubmitSuccessFn] = useState<SubmitSuccessFn>(() => () => {});
-	const scrollToEnd = useMemo(
-		() => (options?: Omit<ScrollToOptions, 'top'>) =>
-			chatRef.current?.scrollTo({ top: chatRef.current.scrollHeight, ...options }),
-		[chatRef],
-	);
-
-	const chatService = useMemo(() => {
-		const chatService: ChatService = {
-			send: async ({ message, signal, groupId }) => {
-				await match(message)
-					/** Delay sending and add typing indicator if bot is sending a message */
-					.with({ author: 'bot', type: 'text' }, async message => {
-						if (signal?.aborted) throw new AbortedError();
-						setIsBotTyping(true);
-						const typingTime = Math.max(20, message.text.length) * TYPING_SPEED_MS_PER_CHARACTER;
-						await new Promise(resolve => {
-							return setTimeout(resolve, typingTime, { signal });
-						});
-						setIsBotTyping(false);
-					})
-					.otherwise(async () => void 0);
-
-				/** The signal could have been aborted while typing */
-				if (signal?.aborted) throw new AbortedError();
-				application.addMessage(message, groupId);
-			},
-			input: async ({ input, signal }) => {
-				if (signal?.aborted) throw new AbortedError();
-				application.setInput(input);
-
-				return await new Promise(resolve => {
-					const submitFunction: SubmitSuccessFn = submission => {
-						if (signal?.aborted) throw new AbortedError();
-						application.setInput(undefined);
-						application.setSubmission(input.key, submission);
-						resolve(submission as any);
-					};
-					setOnSubmitSuccessFn(() => submitFunction);
-				});
-			},
-		};
-
-		return chatService;
-	}, []);
-
-	return {
-		chatRef,
-		chatService,
-		isBotTyping,
-		onSubmitSuccessFn,
-		scrollToEnd,
-	};
-};

package/src/ui/useFocus.ts

@@ -1,10 +0,0 @@
-import { useEffect, useRef } from 'preact/hooks';
-
-export const useFocusOnMount = () => {
-	const focusRef = useRef<any>(null);
-	useEffect(() => {
-		focusRef.current?.focus();
-	}, []);
-
-	return focusRef;
-};

package/src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />

package/tailwind.config.ts

@@ -1,119 +0,0 @@
-// @ts-expect-error - there aren't any typings for this
-import touchPlugin from 'tailwindcss-touch';
-import plugin from 'tailwindcss/plugin';
-import { Config } from 'tailwindcss/types/config';
-
-const config: Config = {
-	content: ['./**/*.{tsx,ts}'],
-	theme: {
-		colors: {
-			transparent: 'transparent',
-			lowest: 'hsl(var(--i-lowest) / <alpha-value>)',
-			neutral: {
-				1: 'hsl(var(--i-n-1) / <alpha-value>)',
-				2: 'hsl(var(--i-n-2) / <alpha-value>)',
-				3: 'hsl(var(--i-n-3) / <alpha-value>)',
-				4: 'hsl(var(--i-n-4) / <alpha-value>)',
-				5: 'hsl(var(--i-n-5) / <alpha-value>)',
-				6: 'hsl(var(--i-n-6) / <alpha-value>)',
-				7: 'hsl(var(--i-n-7) / <alpha-value>)',
-				8: 'hsl(var(--i-n-8) / <alpha-value>)',
-				9: 'hsl(var(--i-n-9) / <alpha-value>)',
-				10: 'hsl(var(--i-n-10) / <alpha-value>)',
-				11: 'hsl(var(--i-n-11) / <alpha-value>)',
-				12: 'hsl(var(--i-n-12) / <alpha-value>)',
-			},
-
-			accent: {
-				1: 'hsl(var(--i-a-1) / <alpha-value>)',
-				2: 'hsl(var(--i-a-2) / <alpha-value>)',
-				3: 'hsl(var(--i-a-3) / <alpha-value>)',
-				4: 'hsl(var(--i-a-4) / <alpha-value>)',
-				5: 'hsl(var(--i-a-5) / <alpha-value>)',
-				6: 'hsl(var(--i-a-6) / <alpha-value>)',
-				7: 'hsl(var(--i-a-7) / <alpha-value>)',
-				8: 'hsl(var(--i-a-8) / <alpha-value>)',
-				9: 'hsl(var(--i-a-9) / <alpha-value>)',
-				10: 'hsl(var(--i-a-10) / <alpha-value>)',
-				11: 'hsl(var(--i-a-11) / <alpha-value>)',
-				12: 'hsl(var(--i-a-12) / <alpha-value>)',
-			},
-
-			error: {
-				1: 'hsl(var(--i-e-1) / <alpha-value>)',
-				2: 'hsl(var(--i-e-2) / <alpha-value>)',
-				3: 'hsl(var(--i-e-3) / <alpha-value>)',
-				4: 'hsl(var(--i-e-4) / <alpha-value>)',
-				5: 'hsl(var(--i-e-5) / <alpha-value>)',
-				6: 'hsl(var(--i-e-6) / <alpha-value>)',
-				7: 'hsl(var(--i-e-7) / <alpha-value>)',
-				8: 'hsl(var(--i-e-8) / <alpha-value>)',
-				9: 'hsl(var(--i-e-9) / <alpha-value>)',
-				10: 'hsl(var(--i-e-10) / <alpha-value>)',
-				11: 'hsl(var(--i-e-11) / <alpha-value>)',
-				12: 'hsl(var(--i-e-12) / <alpha-value>)',
-			},
-		},
-
-		extend: {
-			boxShadow: {
-				'surface-sm': '0px 3px 3px 0px hsl(var(--i-a-12) / 0.03), 0px 4px 4px 0px hsl(var(--i-a-12) / 0.02)',
-				'surface-md':
-					'0px 3px 3px 0px hsl(var(--i-a-12) / 0.03), 0px 6px 4px 0px hsl(var(--i-a-12) / 0.02), 0px 6px 4px 0px hsl(var(--i-a-12) / 0.01)',
-				'surface-lg':
-					'0px 3px 3px 0px hsl(var(--i-a-12) / 0.03), 0px 6px 4px 0px hsl(var(--i-a-12) / 0.02), 0px 11px 4px 0px hsl(var(--i-a-12) / 0.01), 0px 32px 24px -12px hsl(var(--i-a-12) / 0.06)',
-			},
-
-			keyframes: {
-				overlayShow: {
-					from: { opacity: '0' },
-					to: { opacity: '1' },
-				},
-			},
-			transitionTimingFunction: {
-				'expo-out': 'cubic-bezier(0.16, 1, 0.3, 1)',
-			},
-			animation: {
-				overlayShow: 'overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1)',
-			},
-		},
-	},
-	corePlugins: {
-		preflight: false,
-	},
-
-	plugins: [
-		touchPlugin(),
-		plugin(({ addUtilities }) => {
-			addUtilities({
-				'.gutter-stable': {
-					'scrollbar-gutter': 'stable',
-				},
-				'.hide-scrollbars': {
-					'&::-webkit-scrollbar': {
-						display: 'none',
-					},
-					scrollbarWidth: 'none',
-					'-ms-overflow-style': 'none',
-				},
-				'.touch-hitbox': {
-					'&::before': {
-						content: "''",
-						position: 'absolute',
-						display: 'block',
-						top: '50%',
-						left: '50%',
-						transform: 'translate(-50%, -50%)',
-						width: '100%',
-						height: '100%',
-						minHeight: '44px',
-						minWidth: '44px',
-						zIndex: '9999',
-					},
-				},
-			});
-		}),
-	],
-};
-
-export default config;

package/tests/integration.spec.ts

@@ -1,19 +0,0 @@
-import { flowHandler } from '~/mocks/handlers';
-
-import { expect, test } from './test';
-
-test('when backend responds with correct data, can start application', async ({ page, worker }) => {
-	await worker.use(flowHandler.success);
-	await page.goto('/', { waitUntil: 'domcontentloaded' });
-
-	await page.getByRole('button', { name: 'Apply for job Test flow' }).click();
-	await expect(page.getByText('Text node')).toBeVisible();
-});
-
-test('when backend responds with malformed data, user sees error message', async ({ page, worker }) => {
-	await worker.use(flowHandler.invalid_payload);
-	await page.goto('/', { waitUntil: 'domcontentloaded' });
-
-	await page.getByRole('button', { name: 'Apply for job Test flow' }).click();
-	await expect(page.getByText('Text node')).toBeVisible();
-});

package/tests/test.ts

@@ -1,22 +0,0 @@
-import { test as base, expect } from '@playwright/test';
-import { http } from 'msw';
-import type { Config, MockServiceWorker } from 'playwright-msw';
-import { createWorkerFixture } from 'playwright-msw';
-
-const testFactory = (config?: Config) =>
-	base.extend<{
-		worker: MockServiceWorker;
-		http: typeof http;
-	}>({
-		worker: createWorkerFixture(
-			[
-				// default handlers go here
-			],
-			config,
-		),
-		http,
-	});
-
-const test = testFactory();
-
-export { test, expect };

package/tsconfig.json

@@ -1,33 +0,0 @@
-{
-	"compilerOptions": {
-		"target": "ES2020",
-		"useDefineForClassFields": true,
-		"module": "ESNext",
-		"lib": ["ES2020", "DOM", "DOM.Iterable"],
-		"skipLibCheck": true,
-
-		/* Bundler mode */
-		"moduleResolution": "bundler",
-		"allowImportingTsExtensions": true,
-		"resolveJsonModule": true,
-		"isolatedModules": true,
-		"noEmit": true,
-		"jsx": "react-jsx",
-		"jsxImportSource": "preact",
-
-		/* Linting */
-		"strict": true,
-		"noFallthroughCasesInSwitch": true,
-		"noUncheckedIndexedAccess": true,
-		"types": ["bun-types"],
-
-		"baseUrl": ".",
-		"paths": {
-			"react": ["./node_modules/preact/compat/"],
-			"react-dom": ["./node_modules/preact/compat/"],
-			"~/*": ["./src/*"]
-		}
-	},
-	"include": ["src", "tests", "playwright.config.ts", ".eslintrc.cjs", "tailwind.config.ts", "vite.config.ts"],
-	"references": [{ "path": "./tsconfig.node.json" }]
-}

package/tsconfig.node.json

@@ -1,10 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true
-  },
-  "include": ["vite.config.ts"]
-}

package/types.d.ts

@@ -1,2 +0,0 @@
-/// <reference lib="dom" />
-/// <reference lib="dom.iterable" />

package/vite.config.ts

@@ -1,18 +0,0 @@
-import preact from '@preact/preset-vite';
-import { resolve } from 'path';
-import { visualizer } from 'rollup-plugin-visualizer';
-import { defineConfig } from 'vite';
-import tsconfigPaths from 'vite-tsconfig-paths';
-
-// https://vitejs.dev/config/
-export default defineConfig({
-	build: {
-		lib: {
-			formats: ['es'],
-			entry: resolve(__dirname, 'src/index.cdn.ts'),
-			name: 'inploi.chatbotPlugin',
-		},
-		rollupOptions: {},
-	},
-	plugins: [preact(), visualizer(), tsconfigPaths()],
-});