@contember/echo 0.0.27 → 0.0.28

package/dist/components/Echo.d.ts

@@ -0,0 +1,3 @@
+import { type Component } from 'solid-js';
+import type { FullEchoConfig } from '~/types';
+export declare const Echo: Component<FullEchoConfig>;

package/dist/components/atoms/Button.d.ts

@@ -0,0 +1,7 @@
+import type { Component, JSX } from 'solid-js';
+type ButtonProps = JSX.ButtonHTMLAttributes<HTMLButtonElement> & {
+    variant?: 'primary' | 'secondary';
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+};
+export declare const Button: Component<ButtonProps>;
+export {};

package/dist/components/atoms/Shape.d.ts

@@ -0,0 +1,8 @@
+import { Component } from 'solid-js';
+import type { Shape as ShapeType } from '~/types';
+type ShapeProps = ShapeType & {
+    selectedShapeId: string | null;
+    onShapeClick?: (id: string) => void;
+};
+export declare const Shape: Component<ShapeProps>;
+export {};

package/dist/components/atoms/index.d.ts

@@ -0,0 +1 @@
+export * from './Button';

package/dist/components/icons/CheckCircleIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const CheckCircleIcon: Component<IconProps>;

package/dist/components/icons/ChevronRightIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const ChevronRightIcon: Component<IconProps>;

package/dist/components/icons/ContemberIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const ContemberIcon: Component<IconProps>;

package/dist/components/icons/ExternalLinkIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const ExternalLinkIcon: Component<IconProps>;

package/dist/components/icons/HighlightIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const HighlightIcon: Component<IconProps>;

package/dist/components/icons/PenIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const PenIcon: Component<IconProps>;

package/dist/components/icons/TrashIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const TrashIcon: Component<IconProps>;

package/dist/components/icons/XCircleIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const XCircleIcon: Component<IconProps>;

package/dist/components/icons/XIcon.d.ts

@@ -0,0 +1,3 @@
+import type { Component } from 'solid-js';
+import type { IconProps } from '~/types';
+export declare const XIcon: Component<IconProps>;

package/dist/components/icons/index.d.ts

@@ -0,0 +1,8 @@
+export * from './ChevronRightIcon';
+export * from './ContemberIcon';
+export * from './HighlightIcon';
+export * from './PenIcon';
+export * from './TrashIcon';
+export * from './CheckCircleIcon';
+export * from './XCircleIcon';
+export * from './XIcon';

package/dist/components/molecules/ColorSelector.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'solid-js';
+export declare const ColorSelector: Component;

package/dist/components/molecules/DrawingToolbar.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'solid-js';
+export declare const DrawingToolbar: Component;

package/dist/components/molecules/DrawingTooltip.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'solid-js';
+export declare const DrawingTooltip: Component;

package/dist/components/molecules/LauncherButton.d.ts

@@ -0,0 +1,2 @@
+import type { Component } from 'solid-js';
+export declare const LauncherButton: Component;

package/dist/components/molecules/Notification.d.ts

@@ -0,0 +1,2 @@
+import type { Component } from 'solid-js';
+export declare const Notification: Component;

package/dist/components/molecules/ShapeActions.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'solid-js';
+export declare const ShapeActions: Component;

package/dist/components/molecules/StoredFeedback.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'solid-js';
+export declare const StoredFeedback: Component;

package/dist/components/molecules/WelcomeMessage.d.ts

@@ -0,0 +1,2 @@
+import type { Component } from 'solid-js';
+export declare const WelcomeMessage: Component;

package/dist/components/organisms/DrawingLayer.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'solid-js';
+export declare const DrawingLayer: Component;

package/dist/components/organisms/FeedbackForm.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'solid-js';
+export declare const FeedbackForm: Component;

package/dist/config/defaultText.d.ts

@@ -0,0 +1,2 @@
+import type { TextConfig } from '~/types';
+export declare const defaultText: TextConfig;

package/dist/config/drawingConfig.d.ts

@@ -0,0 +1,13 @@
+import type { DrawingTool } from '~/types';
+type ToolConfig = {
+    id: DrawingTool;
+    label: string;
+    getCursor: (color: string) => string;
+    strokeWidth: number;
+    opacity: {
+        selected: number;
+        default: number;
+    };
+};
+export declare const toolConfig: Record<DrawingTool, ToolConfig>;
+export {};

package/dist/contexts/EchoContext.d.ts

@@ -0,0 +1,9 @@
+import { type Component, JSXElement } from 'solid-js';
+import { type EchoStore } from '~/stores';
+import type { FullEchoConfig } from '~/types';
+type EchoProviderProps = FullEchoConfig & {
+    children: JSXElement;
+};
+export declare const EchoProvider: Component<EchoProviderProps>;
+export declare const useEchoStore: () => EchoStore;
+export {};

package/dist/contexts/index.d.ts

@@ -0,0 +1 @@
+export * from './EchoContext';

package/dist/echo.es.js

@@ -2050,4 +2050,3 @@ function Xn(e) {
 export {
   Xn as initEcho
 };
-//# sourceMappingURL=echo.es.js.map

package/dist/echo.umd.js

@@ -6,4 +6,3 @@ Location: ${n}:${r}:${a}`,timestamp:new Date().toISOString()})}))},ct=()=>{k&&(c
 					--primary-text-color: ${it(e.primaryColor)};
 				}
 			`;n(r)}),(()=>{var r=wn();return m(r,xt,null),m(r,t,null),r})()},Sn=()=>{const e=p();return[(()=>{var t=bn();return m(t,l.createComponent(Jt,{}),null),m(t,l.createComponent(rn,{}),null),m(t,l.createComponent(tn,{}),null),l.createRenderEffect(()=>u(t,"data-hidden",e.widget.state.isOpen)),t})(),(()=>{var t=pn();return m(t,l.createComponent(vn,{}),null),m(t,l.createComponent(Wt,{}),null),m(t,l.createComponent(gn,{}),null),l.createRenderEffect(()=>u(t,"data-hidden",!e.widget.state.isOpen)),t})()]},Cn=e=>{let t;const n=p(),r=()=>{requestAnimationFrame(()=>{t&&(t.style.height="0px",t.style.height=`${document.documentElement.scrollHeight}px`,n.widget.setState({dimensions:{width:document.documentElement.clientWidth,height:document.documentElement.scrollHeight}}))})};return D({event:"resize",callback:r,onMount:r}),Ze("Escape",()=>{n.widget.setState({isOpen:!1})}),Z({target:document.documentElement,options:{childList:!0,subtree:!0,attributes:!0},callback:()=>{r()}}),(()=>{var a=yn(),o=t;return typeof o=="function"?R(o,a):t=a,m(a,()=>e.children),l.createRenderEffect(i=>{var c=n.drawing.state.isDrawing,s=`${n.widget.state.dimensions.height}px`,d=`${n.widget.state.dimensions.width}px`;return c!==i.e&&u(a,"data-drawing",i.e=c),s!==i.t&&((i.t=s)!=null?a.style.setProperty("height",s):a.style.removeProperty("height")),d!==i.a&&((i.a=d)!=null?a.style.setProperty("width",d):a.style.removeProperty("width")),i},{e:void 0,t:void 0,a:void 0}),a})()},En={welcomeMessage:{text:"Click here to leave feedback",closeAriaLabel:"Close welcome message"},feedbackForm:{title:"Send Feedback",placeholder:"What's on your mind? We'd love to hear your feedback...",screenshotAlt:"Screenshot Preview",submitButton:"Send Feedback",minimizeTitle:"Minimize",expandTitle:"Expand",closeTitle:"Close",showFormTitle:"Show Feedback Form"},notification:{successTitle:"Thank you for your feedback!",errorTitle:"Something went wrong.",errorMessage:"Failed to send feedback. Please try again.",hideTitle:"Hide notification"},drawingTooltip:{text:"Click & drag to draw"}};let q=null;function Pn(e){q&&(console.warn("Echo widget is already initialized. Cleaning up previous instance..."),q());try{mt(e),st();const{position:t="bottom-right",primaryColor:n="#6227dc",onSubmit:r,textConfig:a={}}=e,o=ye(En,a),i=document.createElement("div");i.id="echo-container",document.body.appendChild(i);const c=Be(()=>l.createComponent(xn,{position:t,primaryColor:n,textConfig:o,onSubmit:async d=>await r({...d,console:xe()})}),i),s=()=>{c(),i.remove(),ct(),q=null};return window.addEventListener("unload",s,{once:!0}),q=s,s}catch(t){throw console.error("Echo initialization failed:",t),t}}E.initEcho=Pn,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
-//# sourceMappingURL=echo.umd.js.map

package/dist/stores/drawingStore.d.ts

@@ -0,0 +1,39 @@
+import type { DrawingTool, FullEchoConfig, Point, Shape } from '~/types';
+export type DrawingState = {
+    isDrawing: boolean;
+    selectedShapeId: string | null;
+    selectedTool: DrawingTool;
+    selectedColor: string;
+    shapes: Shape[];
+    currentPoints: Point[];
+    showTooltip: boolean;
+    mousePosition: Point;
+    hasDrawn: boolean;
+    isDragging: boolean;
+    dragStartPos: Point | null;
+    initialClickPos: Point | null;
+    dragOffset: Point | null;
+    cursor: string;
+};
+export type DrawingStore = {
+    state: DrawingState;
+    setState: (state: Partial<DrawingState>, isClearing?: boolean) => void;
+    methods: {
+        startDrawing: (initialPoint: Point) => void;
+        updateDrawing: (point: Point) => void;
+        finishDrawing: () => void;
+        handleShapeClick: (shapeId: string) => void;
+        handleStart: (e: MouseEvent | TouchEvent) => void;
+        handleMove: (e: MouseEvent | TouchEvent) => void;
+        handleEnd: (e: MouseEvent | TouchEvent) => void;
+        handleEnter: (e: MouseEvent | TouchEvent) => void;
+        handleLeave: (e: MouseEvent | TouchEvent) => void;
+        startDrag: (point: Point) => void;
+        stopDrag: () => void;
+        setInitialClick: (point: Point | null) => void;
+        updateDragOffset: (shape: {
+            points: Point[];
+        }, point: Point) => void;
+    };
+};
+export declare const createDrawingStore: (config: FullEchoConfig, currentPageKey: string, onStateChange?: (state: Partial<DrawingState>, isClearing?: boolean) => void) => DrawingStore;

package/dist/stores/echoStore.d.ts

@@ -0,0 +1,14 @@
+import type { EchoConfig, FullEchoConfig } from '~/types';
+import { type DrawingStore } from './drawingStore';
+import { type FeedbackStore } from './feedbackStore';
+import { type WidgetStore } from './widgetStore';
+export type EchoStore = {
+    feedback: FeedbackStore;
+    drawing: DrawingStore;
+    widget: WidgetStore;
+    methods: {
+        reset: () => void;
+        submit: EchoConfig['onSubmit'];
+    };
+};
+export declare const createEchoStore: (config: FullEchoConfig) => EchoStore;

package/dist/stores/feedbackStore.d.ts

@@ -0,0 +1,12 @@
+import type { FullEchoConfig, Screenshot } from '~/types';
+export type FeedbackState = {
+    comment: string;
+    screenshot?: Screenshot;
+    isCapturing: boolean;
+    isMinimized: boolean;
+};
+export type FeedbackStore = {
+    state: FeedbackState;
+    setState: (state: Partial<FeedbackState>, isClearing?: boolean) => void;
+};
+export declare const createFeedbackStore: (config: FullEchoConfig, currentPageKey: string, onStateChange?: (state: Partial<FeedbackState>, isClearing?: boolean) => void) => FeedbackStore;

package/dist/stores/index.d.ts

@@ -0,0 +1,4 @@
+export * from './echoStore';
+export * from './drawingStore';
+export * from './feedbackStore';
+export * from './widgetStore';

package/dist/stores/widgetStore.d.ts

@@ -0,0 +1,19 @@
+import type { FullEchoConfig, Notification, TextConfig } from '~/types';
+export type WidgetState = {
+    text: TextConfig;
+    isOpen: boolean;
+    primaryColor: string;
+    notification: Notification;
+    dimensions: {
+        width: number;
+        height: number;
+    };
+    isStoredFeedbackOpen: boolean;
+    pagesCount: number;
+    welcomeMessageIsClosing: boolean;
+};
+export type WidgetStore = {
+    state: WidgetState;
+    setState: (state: Partial<WidgetState>) => void;
+};
+export declare const createWidgetStore: (config: FullEchoConfig, currentPageKey: string) => WidgetStore;

package/dist/types.d.ts

@@ -0,0 +1,87 @@
+export type Screenshot = `data:image/png;base64,${string}`;
+export type BrowserInfo = {
+    width: number;
+    height: number;
+    screenWidth: number;
+    screenHeight: number;
+};
+export type Metadata = {
+    url: string;
+    userAgent: string;
+    timestamp: string;
+    browserInfo: BrowserInfo;
+};
+export type ConsoleEntry = {
+    type: 'log' | 'warn' | 'error';
+    message: string;
+    timestamp: string;
+};
+export type FeedbackPayload = {
+    comment: string;
+    screenshot?: Screenshot;
+    metadata: Metadata;
+    console: ConsoleEntry[];
+};
+export type Position = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+export type TextConfig = {
+    welcomeMessage: {
+        text: string;
+        closeAriaLabel: string;
+    };
+    feedbackForm: {
+        title: string;
+        placeholder: string;
+        screenshotAlt: string;
+        submitButton: string;
+        minimizeTitle: string;
+        expandTitle: string;
+        closeTitle: string;
+        showFormTitle: string;
+    };
+    notification: {
+        successTitle: string;
+        errorTitle: string;
+        errorMessage: string;
+        hideTitle: string;
+    };
+    drawingTooltip: {
+        text: string;
+    };
+};
+export type EchoConfig = {
+    onSubmit: (data: FeedbackPayload) => Promise<Response | void>;
+    position?: Position;
+    primaryColor?: `#${string}`;
+    textConfig?: Partial<TextConfig>;
+};
+export type FullEchoConfig = Required<EchoConfig> & {
+    textConfig: TextConfig;
+};
+export declare const POSITIONS: Record<Position, {
+    [key: string]: string;
+}>;
+export type Point = {
+    x: number;
+    y: number;
+};
+export type ShapeType = 'rectangle' | 'path';
+export type DrawingTool = 'rectangle' | 'path';
+export type Shape = {
+    id: string;
+    type: ShapeType;
+    color: string;
+    points: Point[];
+};
+export type IconProps = {
+    size?: number;
+    stroke?: string;
+    strokeWidth?: number;
+    class?: string;
+    style?: any;
+    fill?: string;
+};
+export type Notification = {
+    show: boolean;
+    type: 'success' | 'error' | null;
+    message: string | null;
+};

package/dist/utils/color.d.ts

@@ -0,0 +1,2 @@
+export declare const calculateLuminance: (hexColor: string) => number;
+export declare const getContrastColor: (hexColor: string) => string;

package/dist/utils/common.d.ts

@@ -0,0 +1 @@
+export declare const deepMerge: (target: any, source: any) => any;

package/dist/utils/console.d.ts

@@ -0,0 +1,4 @@
+import type { ConsoleEntry } from '~/types';
+export declare const setupConsole: () => void;
+export declare const cleanupConsole: () => void;
+export declare const getConsoleBuffer: () => ConsoleEntry[];

package/dist/utils/debounce.d.ts

@@ -0,0 +1 @@
+export declare const debounce: <T extends (...args: any[]) => void>(func: T, wait: number) => (...args: Parameters<T>) => void;

package/dist/utils/device.d.ts

@@ -0,0 +1 @@
+export declare const isMobileDevice: () => boolean;

package/dist/utils/events.d.ts

@@ -0,0 +1,5 @@
+import type { Point } from '~/types';
+export declare const getPointFromEvent: (e: MouseEvent | TouchEvent, { useClientCoords }?: {
+    useClientCoords?: boolean;
+}) => Point;
+export declare const getDistance: (p1: Point, p2: Point) => number;

package/dist/utils/format.d.ts

@@ -0,0 +1 @@
+export declare const formatPath: (path: string) => string;

package/dist/utils/geometry.d.ts

@@ -0,0 +1,8 @@
+import type { Point } from '~/types';
+export declare const getRectFromPoints: (points: Point[]) => {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+} | null;
+export declare const getPathFromPoints: (points: Point[]) => string | null;

package/dist/utils/index.d.ts

@@ -0,0 +1,13 @@
+export * from './color';
+export * from './common';
+export * from './console';
+export * from './debounce';
+export * from './device';
+export * from './events';
+export * from './format';
+export * from './geometry';
+export * from './listeners';
+export * from './screenshot';
+export * from './storage';
+export * from './svg';
+export * from './validators';

package/dist/utils/listeners.d.ts

@@ -0,0 +1,22 @@
+export declare const registerKeyListener: (key: string, callback: (e: KeyboardEvent) => void) => void;
+export declare const registerWindowEventListener: {
+    <K extends keyof WindowEventMap>(props: {
+        event: K;
+        callback: (e: WindowEventMap[K]) => void;
+        onMount?: () => void;
+        onCleanup?: () => void;
+    }): void;
+    (props: {
+        event: string;
+        callback: (e: Event) => void;
+        onMount?: () => void;
+        onCleanup?: () => void;
+    }): void;
+};
+export declare const registerMutationObserver: (props: {
+    target: Node;
+    options?: MutationObserverInit;
+    callback: (mutations: MutationRecord[]) => void;
+    onMount?: () => void;
+    onCleanup?: () => void;
+}) => void;

package/dist/utils/screenshot.d.ts

@@ -0,0 +1,2 @@
+import type { Screenshot } from '~/types';
+export declare const captureScreenshot: () => Promise<Screenshot | undefined>;

package/dist/utils/storage.d.ts

@@ -0,0 +1,28 @@
+import { DrawingState, FeedbackState } from '~/stores';
+import type { Shape } from '~/types';
+type StoredPageState = {
+    feedback: {
+        comment: string;
+    };
+    drawing: {
+        shapes: Shape[];
+    };
+    latestQuery?: string;
+};
+export declare const dispatchStorageChange: () => void;
+export declare const getStorageKey: (key: string) => string;
+export declare const getFromStorage: <T>(key: string, defaultValue: T) => T;
+export declare const setToStorage: <T>(key: string, value: T) => void;
+export declare const getPageKey: () => string;
+export declare const savePageState: (pageKey: string, state: {
+    feedback: FeedbackState;
+    drawing: DrawingState;
+}) => void;
+export declare const loadPageState: (pageKey: string) => StoredPageState | null;
+export declare const clearPageState: (pageKey: string) => void;
+export declare const getStoredPagesCount: () => number;
+export declare const getStoredPages: () => {
+    path: string;
+    state: StoredPageState;
+}[];
+export {};

package/dist/utils/svg.d.ts

@@ -0,0 +1,13 @@
+export declare const generateCutoutPath: (dimensions: {
+    width: number;
+    height: number;
+}, currentPoints: {
+    x: number;
+    y: number;
+}[], shapes: {
+    type: string;
+    points: {
+        x: number;
+        y: number;
+    }[];
+}[]) => string;

package/dist/utils/validators.d.ts

@@ -0,0 +1,2 @@
+import type { EchoConfig } from '~/types';
+export declare const validateOptions: (options: EchoConfig) => void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@contember/echo",
   "license": "Apache-2.0",
-  "version": "0.0.27",
+  "version": "0.0.28",
   "type": "module",
   "author": "neumie@neumie.dev",
   "keywords": [