go-xcel-interpret 1.1.0

package/dist/src/components/BodyCssVar.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+declare const BodyCssVar: React.FC<{
+    primary?: string;
+}>;
+export default BodyCssVar;

package/dist/src/components/GoXcelInterpret.d.ts

@@ -0,0 +1,4 @@
+import { ComponentPropsWithRef } from 'react';
+import { default as Interpret } from './interpret/interpret';
+export type GoXcelInterpretProps = ComponentPropsWithRef<typeof Interpret>;
+export default function GoXcelInterpret(props: GoXcelInterpretProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/constants.d.ts

@@ -0,0 +1 @@
+export declare const PRIMARY_COLOR = "#25cc89";

package/dist/src/components/interpret/InterpretForm.d.ts

@@ -0,0 +1,2 @@
+import { InterpretFormTable } from '../../types';
+export default function InterpretForm({ config, itemOptions, ...props }: InterpretFormTable): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/interpret/InterpretTable.d.ts

@@ -0,0 +1,2 @@
+import { InterpretFormTable } from '../../types';
+export default function InterpretTable({ onUpdateItemData, ...props }: InterpretFormTable): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/interpret/TabsInterpret.d.ts

@@ -0,0 +1,24 @@
+import { ComponentPropsWithRef } from 'react';
+import { ActionMode, GoXcelConfig, InterpretFormTable, TemplateSheet } from '../../types';
+declare const TabContentInterpret: ({ tab, mode, onUpdate, config, activeItemOptions, onItemOptions, itemOptions, }: {
+    tab: TemplateSheet;
+    mode: ActionMode;
+    onUpdate: (updatedTab: Partial<TemplateSheet>) => void;
+    config?: GoXcelConfig;
+    activeItemOptions: boolean;
+    onItemOptions: (itemOptions: Required<InterpretFormTable>["itemOptions"]) => void;
+    itemOptions: Required<InterpretFormTable>["itemOptions"];
+}) => import("react/jsx-runtime").JSX.Element;
+interface TabsInterpretFormProps {
+    activeKey?: string;
+    tabs: TemplateSheet[];
+    mode?: ActionMode;
+    setActiveKey?: (key: string) => void;
+    addTab?: () => void;
+    removeTab?: (key: string) => void;
+    updateTab?: (index: number, updatedTab: Partial<TemplateSheet>) => void;
+    config?: GoXcelConfig;
+    activeOptions?: ComponentPropsWithRef<typeof TabContentInterpret>['activeItemOptions'];
+}
+export default function TabsInterpret({ activeKey, tabs, mode, setActiveKey, updateTab, config, activeOptions, }: TabsInterpretFormProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/interpret/interpret.d.ts

@@ -0,0 +1,14 @@
+import { ComponentPropsWithRef } from 'react';
+import { GoXcelConfig } from '../../types';
+import { OptionHostConnect } from '../../utils/websocket';
+import { default as TabsInterpret } from './TabsInterpret';
+type InterpretProps = {
+    token: string;
+    identity: string;
+    waitKeyboard?: number;
+    config?: GoXcelConfig;
+    activeOptions?: ComponentPropsWithRef<typeof TabsInterpret>['activeOptions'];
+    textLoading?: string;
+};
+export default function Interpret({ token, identity, apiBaseUrl, protocol, waitKeyboard, config, activeOptions, textLoading, }: InterpretProps & OptionHostConnect): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/ui/Card.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+interface CardProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const Card: React.FC<CardProps>;
+export default Card;

package/dist/src/components/ui/Form.d.ts

@@ -0,0 +1,23 @@
+import { default as React } from 'react';
+interface FormProps {
+    children: React.ReactNode;
+    layout?: 'horizontal' | 'vertical' | 'inline';
+    initialValues?: Record<string, any>;
+    onValuesChange?: (changedValues: Record<string, any>, allValues: Record<string, any>) => void;
+    size?: 'small' | 'middle' | 'large';
+    className?: string;
+    autoComplete?: string;
+}
+interface FormItemProps {
+    label?: React.ReactNode;
+    labelProps?: React.LabelHTMLAttributes<HTMLLabelElement>;
+    name?: string;
+    children: React.ReactNode;
+    valuePropName?: string;
+    className?: string;
+}
+interface FormType extends React.FC<FormProps> {
+    Item: React.FC<FormItemProps>;
+}
+declare const Form: FormType;
+export default Form;

package/dist/src/components/ui/FormOptions.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+import { GoXcelConfig } from '../../types';
+export type FormSize = 'small' | 'middle' | 'large';
+export type FieldSpan = 8 | 12 | 16 | 24;
+interface FormOptionsProps {
+    config?: Omit<GoXcelConfig, 'formOptions'>;
+    size: FormSize;
+    onSizeChange: (value: FormSize) => void;
+    span: FieldSpan;
+    onSpanChange: (value: FieldSpan) => void;
+    languageConfig?: GoXcelConfig['formOptions'];
+}
+declare const FormOptions: React.FC<FormOptionsProps>;
+export default FormOptions;

package/dist/src/components/ui/Layout.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+interface RowProps {
+    children: React.ReactNode;
+    gutter?: [number, number];
+    className?: string;
+}
+export declare const Row: React.FC<RowProps>;
+interface ColProps {
+    children: React.ReactNode;
+    span?: number;
+    sm?: number;
+    md?: number;
+    lg?: number;
+    xl?: number;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const Col: React.FC<ColProps>;
+export {};

package/dist/src/components/ui/Loading.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { GoXcelTheme } from '../../types';
+interface LoadingProps {
+    text?: string;
+    className?: string;
+    theme?: GoXcelTheme;
+}
+export declare const Loading: React.FC<LoadingProps>;
+export default Loading;

package/dist/src/components/ui/Tabs.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+import { ComponentStyleConfig, GoXcelTheme } from '../../types';
+type TabPropsBase = ComponentStyleConfig['Tabs'] & {
+    theme?: GoXcelTheme;
+};
+export interface TabItem {
+    key: string;
+    label: React.ReactNode;
+    children: React.ReactNode;
+}
+interface TabsProps extends TabPropsBase {
+    items: TabItem[];
+    activeKey?: string;
+    onChange?: (key: string) => void;
+    tabPosition?: 'top' | 'bottom';
+    type?: 'line' | 'card';
+}
+declare const Tabs: React.FC<TabsProps>;
+export default Tabs;

package/dist/src/components/ui/Typography.d.ts

@@ -0,0 +1,25 @@
+import { default as React } from 'react';
+import { GoXcelTheme } from '../../types';
+interface PropBase {
+    theme?: GoXcelTheme;
+}
+interface TitleProps extends PropBase {
+    level?: 1 | 2 | 3 | 4 | 5;
+    children: React.ReactNode;
+    className?: string;
+}
+interface TextProps extends PropBase {
+    children: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+interface ParagraphProps extends PropBase {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const Typography: {
+    Title: React.FC<TitleProps>;
+    Text: React.FC<TextProps>;
+    Paragraph: React.FC<ParagraphProps>;
+};
+export default Typography;

package/dist/src/components/ui/form/Checkbox.d.ts

@@ -0,0 +1,23 @@
+import { default as React } from 'react';
+import { ComponentStyleConfig, GoXcelTheme } from '../../../types';
+type CheckboxPropsBase = ComponentStyleConfig['Checkbox'] & {
+    theme?: GoXcelTheme;
+};
+export interface CheckboxProps {
+    id?: string;
+    checked?: boolean;
+    disabled?: boolean;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    children?: React.ReactNode;
+}
+export declare const Checkbox: React.FC<CheckboxProps & CheckboxPropsBase>;
+interface CheckboxGroupProps {
+    id?: string;
+    value?: string[];
+    disabled?: boolean;
+    onChange?: (checkedValues: string[]) => void;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}
+export declare const CheckboxGroup: React.FC<CheckboxGroupProps>;
+export {};

package/dist/src/components/ui/form/DatePicker.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { default as dayjs } from 'dayjs';
+import { ComponentStyleConfig, GoXcelTheme } from '../../../types';
+type DatePickerPropsBase = ComponentStyleConfig['DataPicker'] & {
+    theme?: GoXcelTheme;
+};
+interface DatePickerProps {
+    value?: string | dayjs.Dayjs;
+    disabled?: boolean;
+    showTime?: boolean;
+    onChange?: (date: dayjs.Dayjs) => void;
+    size?: 'small' | 'middle' | 'large';
+}
+export declare const DatePicker: React.FC<DatePickerProps & DatePickerPropsBase>;
+export {};

package/dist/src/components/ui/form/Input.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+import { ComponentStyleConfig, GoXcelTheme } from '../../../types';
+type InputPropsBase = ComponentStyleConfig['Input'] & {
+    theme?: GoXcelTheme;
+};
+interface InputProps extends InputPropsBase {
+    id?: string;
+    value?: string;
+    readOnly?: boolean;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    size?: InputPropsBase['size'];
+}
+export declare const Input: React.FC<InputProps>;
+interface TextAreaProps extends InputPropsBase {
+    id?: string;
+    value?: string;
+    readOnly?: boolean;
+    onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
+}
+export declare const TextArea: React.FC<TextAreaProps>;
+export {};

package/dist/src/components/ui/form/InputNumber.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+import { ComponentStyleConfig, GoXcelTheme } from '../../../types';
+type InputNumberPropsBase = ComponentStyleConfig['InputNumber'] & {
+    theme?: GoXcelTheme;
+};
+interface InputNumberProps {
+    id?: string;
+    value?: number;
+    defaultValue?: number;
+    min?: number;
+    max?: number;
+    step?: number;
+    disabled?: boolean;
+    size?: InputNumberPropsBase['size'];
+    onChange?: (value: number) => void;
+    className?: string;
+}
+declare const InputNumber: React.FC<InputNumberProps & InputNumberPropsBase>;
+export default InputNumber;

package/dist/src/components/ui/form/Radio.d.ts

@@ -0,0 +1,30 @@
+import { default as React } from 'react';
+import { ComponentStyleConfig, GoXcelTheme } from '../../../types';
+type RadioPropsBase = ComponentStyleConfig['Radio'] & {
+    theme?: GoXcelTheme;
+};
+interface RadioProps {
+    id?: string;
+    value?: string;
+    checked?: boolean;
+    disabled?: boolean;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    children?: React.ReactNode;
+}
+export declare const Radio: React.FC<RadioProps & RadioPropsBase>;
+interface RadioGroupProps {
+    id?: string;
+    value?: string;
+    disabled?: boolean;
+    onChange?: (e: {
+        target: {
+            value: string;
+        };
+    }) => void;
+    options?: {
+        value: string;
+        label: string;
+    }[];
+}
+export declare const RadioGroup: React.FC<RadioGroupProps & RadioPropsBase>;
+export {};

package/dist/src/components/ui/form/Select.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { ComponentStyleConfig, GoXcelTheme } from '../../../types';
+type SelectPropsBase = ComponentStyleConfig['Select'] & {
+    theme?: GoXcelTheme;
+};
+interface SelectProps extends SelectPropsBase {
+    id?: string;
+    value?: string;
+    disabled?: boolean;
+    onChange?: (value: string) => void;
+    options?: {
+        value: string;
+        label: string;
+    }[];
+    size?: SelectPropsBase['size'];
+}
+export declare const Select: React.FC<SelectProps>;
+export {};

package/dist/src/error.d.ts

@@ -0,0 +1,5 @@
+declare class ResponseError extends Error {
+    response: Response;
+    constructor(message: string, response: Response);
+}
+export default ResponseError;

package/dist/src/hook/useBounce.d.ts

@@ -0,0 +1 @@
+export default function useBounce<Args extends unknown[]>(callback: (...args: Args) => void, wait: number): readonly [(...args: Args) => void, () => void];

package/dist/src/hook/useTemplateTabs.d.ts

@@ -0,0 +1,12 @@
+import { TemplateConfig, TemplateItem, TemplateSheet } from '../types';
+export declare const ITEM_DEFAULT: TemplateItem[];
+declare const useTemplateTabs: () => {
+    tabs: TemplateSheet[];
+    activeKey: string;
+    setActiveKey: import('react').Dispatch<import('react').SetStateAction<string>>;
+    addTab: () => void;
+    setTabs: (tabs: TemplateConfig["configuration"]) => void;
+    removeTab: (targetKey: string) => void;
+    updateTab: (index: number, updatedTab: Partial<TemplateSheet>) => TemplateSheet[];
+};
+export default useTemplateTabs;

package/dist/src/index.d.ts

@@ -0,0 +1,2 @@
+export { default as GoXcelInterpret } from './components/GoXcelInterpret';
+export type { GoXcelInterpretProps } from './components/GoXcelInterpret';

package/dist/src/services.d.ts

@@ -0,0 +1,11 @@
+import { Template, TemplateSheet, BackendResponse } from './types';
+export type TemplateResponse = BackendResponse<Template>;
+declare const GoXcelService: {
+    API_GO_XCEL_HOST: string | null;
+    readTemplateIdentity(token: string, identity: string): Promise<Template>;
+    applyAction(token: string, templateAction: {
+        template__uuid: string;
+        actions: TemplateSheet[];
+    }): Promise<TemplateResponse>;
+};
+export default GoXcelService;

package/dist/src/types/config.d.ts

@@ -0,0 +1,62 @@
+export interface GoXcelTheme {
+    primaryColor?: string;
+}
+type Select = {
+    borderRadius?: string;
+    focusShadowColor?: string;
+    size?: 'small' | 'middle' | 'large';
+};
+type Input = {
+    borderRadius?: Select['borderRadius'];
+    focusShadowColor?: Select['focusShadowColor'];
+    size?: Select['size'];
+};
+type DataPicker = {
+    borderRadius?: Select['borderRadius'];
+    focusShadowColor?: Select['focusShadowColor'];
+    size?: Select['size'];
+};
+export interface ComponentStyleConfig {
+    Select?: Select;
+    Typography?: {
+        titleHoverColor?: string;
+    };
+    Tabs?: {
+        tabPosition?: 'top' | 'bottom';
+        size?: Select['size'];
+    };
+    Input?: Input;
+    TextArea?: Input;
+    InputNumber?: Input;
+    DataPicker?: DataPicker;
+    Checkbox?: {
+        size?: Select['size'];
+    };
+    Radio?: {
+        size?: Select['size'];
+    };
+}
+export interface GoXcelConfig {
+    theme?: GoXcelTheme;
+    formOptions?: {
+        language?: string;
+        languageOptions?: Record<string, {
+            small: string;
+            middle: string;
+            large: string;
+            fieldWidthPerRow: string;
+            formSize: string;
+            fullRow: string;
+            halfRow: string;
+            oneThirdRow: string;
+            twoThirdsRow: string;
+        }>;
+    };
+    components?: ComponentStyleConfig;
+}
+declare global {
+    interface Window {
+        GOXCEL_CONFIG?: GoXcelConfig;
+    }
+}
+export {};

package/dist/src/types/index.d.ts

@@ -0,0 +1,3 @@
+export * from './template';
+export * from './services';
+export * from './config';

package/dist/src/types/services.d.ts

@@ -0,0 +1,6 @@
+export interface BackendResponse<T> {
+    count: number;
+    next: null | string;
+    previous: null | string;
+    results: T[];
+}

package/dist/src/types/template.d.ts

@@ -0,0 +1,75 @@
+import { FieldSpan, FormSize } from '../components/ui/FormOptions';
+import { GoXcelConfig } from './config';
+export declare enum TemplateType {
+    form = "form",
+    table = "table"
+}
+export declare enum TemplateItemTypes {
+    input = "input",
+    check = "check",
+    radio = "radio",
+    textarea = "textarea",
+    datetime = "datetime",
+    select = "select",
+    number = "number"
+}
+export type OptionItemData = {
+    alias: string;
+    value?: string;
+    cell?: string;
+};
+export type ValueOptionData = Omit<OptionItemData, 'alias'>;
+export interface ItemData {
+    cell_type?: boolean;
+    alias: string;
+    type: keyof typeof TemplateItemTypes;
+    cell?: string;
+    column?: string;
+    action_type: string[];
+    value?: string | number | boolean | ValueOptionData[];
+    option?: OptionItemData[];
+}
+export interface TemplateSheet {
+    sheet: string;
+    items: TemplateItem[];
+}
+export interface TemplateItem {
+    alias: string;
+    type: 'form' | 'table';
+    row_num?: number;
+    row_start?: number;
+    items: ItemData[];
+}
+export type ItemSheet = TemplateItem;
+export interface Sheet {
+    sheet: string;
+    items: ItemSheet[];
+}
+export interface TemplateConfig {
+    uuid: string;
+    configuration: Sheet[] | null;
+    name: string;
+}
+export interface Template {
+    uuid: string;
+    account: string;
+    identity: string;
+    template_configuration: TemplateConfig;
+    values?: TemplateConfig['configuration'];
+}
+export declare enum ActionMode {
+    ADD = "ADD",
+    READ = "READ",
+    EDIT = "EDIT"
+}
+export interface InterpretFormTable {
+    item: TemplateItem;
+    mode: ActionMode;
+    onUpdate: (updatedTab: Partial<TemplateItem>) => void;
+    onUpdateItemData?: (index: number, itemData: ItemData) => void;
+    config?: GoXcelConfig;
+    itemOptions?: {
+        size: FormSize;
+        span: FieldSpan;
+    };
+}

package/dist/src/utils/base64.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Converts a given string to its Base64 encoded representation.
+ *
+ * @param {string} input - The input string to be converted to Base64.
+ * @return {string} The Base64 encoded string.
+ */
+export declare function toBase64(input: string): string;

package/dist/src/utils/theme.d.ts

@@ -0,0 +1,8 @@
+export declare const hexToRgba: (hex: string, alpha: number) => string;
+export declare const getPrimaryColor: (theme?: {
+    primaryColor?: string;
+}) => string;
+export declare const getFocusShadowColor: (props?: {
+    primaryColor?: string;
+    focusShadowColor?: string;
+}) => string;

package/dist/src/utils/websocket.d.ts

@@ -0,0 +1,9 @@
+export declare const urlWebsocket: (apiBaseUrl: string) => URL;
+export declare enum EnumPathNotification {
+    applyActions = "ws/apply-actions/"
+}
+export type OptionHostConnect = {
+    apiBaseUrl: string;
+    protocol?: 'wss' | 'ws';
+};
+export declare const getHostConnect: (path: EnumPathNotification, options: OptionHostConnect) => string;

package/dist/vite.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vite').UserConfig;
+export default _default;

package/package.json

@@ -0,0 +1,63 @@
+{
+  "name": "go-xcel-interpret",
+  "version": "1.1.0",
+  "description": "",
+  "main": "dist/go-xcel-interpret.cjs",
+  "module": "dist/go-xcel-interpret.esM.mjs",
+  "types": "dist/src/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "release": "tsx scripts/release.ts",
+    "lint": "eslint .",
+    "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,css,md}\""
+  },
+  "dependencies": {
+    "@handsontable/react-wrapper": "^15.3.0",
+    "dayjs": "^1.11.13",
+    "handsontable": "^15.3.0",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "react-use-websocket": "^4.13.0",
+    "styled-components": "^6.1.18"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.28.0",
+    "@octokit/rest": "^22.0.0",
+    "@trivago/prettier-plugin-sort-imports": "^5.2.2",
+    "@types/mime-types": "^3.0.0",
+    "@types/node": "^22.15.29",
+    "@types/react": "^19.1.6",
+    "@types/react-dom": "^19.1.6",
+    "@vitejs/plugin-react": "^4.5.1",
+    "eslint": "^9.28.0",
+    "eslint-config-prettier": "^10.1.5",
+    "eslint-plugin-prettier": "^5.5.1",
+    "eslint-plugin-react": "^7.37.5",
+    "globals": "^16.2.0",
+    "mime-types": "^3.0.1",
+    "prettier": "^3.6.2",
+    "prettier-plugin-organize-imports": "^4.1.0",
+    "simple-git": "^3.27.0",
+    "typescript": "^5.8.3",
+    "typescript-eslint": "^8.33.1",
+    "vite": "^6.3.5",
+    "vite-plugin-dts": "^4.5.4"
+  },
+  "private": false,
+  "unpkg": "dist/go-xcel-interpret.umd.js",
+  "jsdelivr": "dist/go-xcel-interpret.umd.js",
+  "exports": {
+    ".": {
+      "import": "./dist/go-xcel-interpret.esm.mjs",
+      "require": "./dist/go-xcel-interpret.cjs"
+    }
+  }
+}