@dappworks/kit 0.5.40 → 0.5.42

package/dist/form.d.mts

@@ -0,0 +1,384 @@
+import React$1, { Dispatch, SetStateAction, JSX as JSX$1, ReactNode } from 'react';
+import { ButtonProps, TabsProps, CheckboxProps, SlotsToClasses, InputSlots, InputProps, SelectSlots, SelectProps, SelectedItems, DatePickerProps, ModalSlots } from '@nextui-org/react';
+import { UiSchema, RJSFSchema, WidgetProps, Widget } from '@rjsf/utils';
+import * as _rjsf_validator_ajv8_lib_validator from '@rjsf/validator-ajv8/lib/validator';
+import Form, { IChangeEvent } from '@rjsf/core';
+import { T as ThemeType } from './index-CUKoRIdy.mjs';
+import { EditorProps } from '@monaco-editor/react';
+import { S as Store } from './root-BPMUmS6H.mjs';
+import EventEmitter from 'events';
+import 'typed-emitter';
+
+declare class JSONSchemaFormState<T, U = UiSchema> {
+    value: JSONSchemaValue<T>;
+    schema: RJSFSchema;
+    uiSchema: U;
+    reactive: boolean;
+    readonly: boolean;
+    liveValidate: boolean;
+    validator: _rjsf_validator_ajv8_lib_validator.default<any, RJSFSchema, any>;
+    formRef: React.RefObject<Form>;
+    get formData(): T;
+    set formData(value: T);
+    get dynamicData(): {
+        ready: boolean;
+    };
+    getDymaicData: () => {
+        ready: boolean;
+    };
+    onChange: (e: IChangeEvent<T>, id?: string) => void;
+    onSubmit: (e: IChangeEvent<T>) => void;
+    afterSubmit: (e: IChangeEvent<T>) => void;
+    afterChange: (e: IChangeEvent<T>, id?: string) => void;
+    reset({ force }?: {
+        force?: boolean;
+    }): this;
+    customValidate: (formData: T, errors: any) => any;
+    constructor(args?: Partial<JSONSchemaFormState<T, U>>);
+}
+declare class JSONSchemaValue<T> {
+    value?: T;
+    default?: T;
+    constructor(args?: Partial<JSONSchemaValue<T>>);
+    set(value: Partial<T>): T;
+    onSet(value: Partial<T>): Partial<T>;
+    get(): T;
+    getFormat(value: T): T;
+    reset(): void;
+}
+
+declare const COMPONENTS: {
+    GridLayout: <T extends FormDataType>(props: JSONFormProps<T>) => React$1.JSX.Element;
+    TabLayout: <T_1 extends FormDataType>(props: JSONFormProps<T_1>) => React$1.JSX.Element;
+    ListLayout: <T_2 extends FormDataType>(props: JSONFormProps<T_2>) => React$1.JSX.Element;
+    SimpleLayout: <T_3 extends FormDataType>(props: JSONFormProps<T_3>) => React$1.JSX.Element;
+};
+type FormDataType = {
+    [key: string]: {
+        [key: string]: string | number | boolean | Record<string, string | number | boolean>;
+    };
+};
+type FormConfigType<T extends FormDataType> = {
+    [F in keyof T]?: {
+        [X in keyof T[F]]?: {
+            title?: string;
+            required?: boolean;
+            requiredErrMsg?: string;
+            validate?: (v: any) => string | void;
+            selectOptions?: {
+                label: string;
+                value: string;
+            }[];
+            isMultipleSelect?: boolean;
+        } & UiSchema;
+    };
+};
+type SubmitButtonProps<T extends FormDataType> = ButtonProps & {
+    onAfterSubmit?: (formKey: FormKey<T>, data: FormDataOfKey<T>, setLoading: Dispatch<SetStateAction<boolean>>) => void;
+};
+type CombFormsCustomRender<T extends FormDataType> = (formStates: {
+    [F in keyof T]?: JSONSchemaFormState<FormDataOfKey<T>, UiSchema>;
+}) => React$1.ReactNode;
+type CombFormsCustomRenderMap<T extends FormDataType> = {
+    Top?: CombFormsCustomRender<T>;
+    SubmitButtonBefore?: CombFormsCustomRender<T>;
+    SubmitButtonAfter?: CombFormsCustomRender<T>;
+};
+type SubformCustomRender<T extends FormDataType> = (formKey: FormKey<T>, formState: JSONSchemaFormState<FormDataOfKey<T>, UiSchema>) => React$1.ReactNode;
+type SubformCustomRenderMap<T extends FormDataType> = {
+    Top?: SubformCustomRender<T>;
+    SubmitButtonBefore?: SubformCustomRender<T>;
+    SubmitButtonAfter?: SubformCustomRender<T>;
+};
+type SubformLayoutBaseConfig<T extends FormDataType, F extends keyof T> = {
+    title?: string;
+    titleBoxCss?: string;
+    fieldLayout?: Array<keyof NonNullable<T[F]>> | Array<Array<keyof NonNullable<T[F]>> | keyof NonNullable<T[F]>>;
+    submitButtonProps?: SubmitButtonProps<T>;
+    customRender?: SubformCustomRenderMap<T>;
+};
+interface LayoutConfigMap<T extends FormDataType> {
+    GridLayout: {
+        $type: 'GridLayout';
+        $gridColumn?: number;
+        $combFormsCustomRender?: CombFormsCustomRenderMap<T>;
+    } & {
+        [F in keyof T]?: SubformLayoutBaseConfig<T, F> & {
+            colSpan?: number;
+            cardCss?: string;
+        };
+    };
+    TabLayout: {
+        $type: 'TabLayout';
+        $tabsProps?: TabsProps;
+        $combFormsCustomRender?: CombFormsCustomRenderMap<T>;
+    } & {
+        [F in keyof T]?: SubformLayoutBaseConfig<T, F>;
+    };
+    ListLayout: {
+        $type: 'ListLayout';
+        $combFormsCustomRender?: CombFormsCustomRenderMap<T>;
+    } & {
+        [F in keyof T]?: SubformLayoutBaseConfig<T, F>;
+    };
+    SimpleLayout: {
+        $type: 'SimpleLayout';
+        $combFormsCustomRender?: CombFormsCustomRenderMap<T>;
+    } & {
+        [F in keyof T]?: SubformLayoutBaseConfig<T, F>;
+    };
+}
+type LayoutType = keyof typeof COMPONENTS;
+type LayoutConfigType<T extends FormDataType, L extends LayoutType> = LayoutConfigMap<T>[L];
+type FormKey<T extends FormDataType> = keyof T;
+type FormDataOfKey<T extends FormDataType> = T[FormKey<T>];
+type JSONFormProps<T extends FormDataType> = {
+    className?: string;
+    theme?: ThemeType;
+    formData: T;
+    formConfig?: FormConfigType<T>;
+    layoutConfig?: LayoutConfigType<T, LayoutType>;
+    onBatchSubmit?: (data: T, setLoading: Dispatch<SetStateAction<boolean>>) => void;
+    onSet?: (v: FormDataOfKey<T>, form: JSONSchemaFormState<FormDataOfKey<T>, UiSchema>) => FormDataOfKey<T>;
+    onChange?: (data: Partial<T>) => void;
+    onReady?: (formStates: {
+        [F in keyof T]?: JSONSchemaFormState<FormDataOfKey<T>, UiSchema>;
+    }) => void;
+    batchSubmitButtonProps?: ButtonProps & {
+        onBatchSubmit?: (formData: T, setLoading: Dispatch<SetStateAction<boolean>>) => void;
+    };
+};
+declare const JSONForm: <T extends FormDataType>(props: JSONFormProps<T>) => React$1.JSX.Element;
+
+type Options$6 = {
+    className?: string;
+    nextuiClassNames?: CheckboxProps["classNames"];
+    size: CheckboxProps["size"];
+    color: CheckboxProps["color"];
+    description?: string;
+    descriptionClassName?: string;
+};
+interface CheckboxWidgetProps extends WidgetProps {
+    options: Options$6;
+}
+interface CheckboxWidgetUIOptions {
+    "ui:widget": (props: CheckboxWidgetProps) => JSX$1.Element;
+    "ui:options": Options$6;
+}
+declare function CheckboxWidget({ onChange, options, label, value, disabled, uiSchema }: CheckboxWidgetProps): JSX$1.Element;
+
+type Options$5 = {
+    editorHeight?: string;
+    readOnly?: boolean;
+    language?: string;
+    languageSelectorOptions?: {
+        label: string;
+        value: string;
+    }[];
+    onChangeLanguage?: (v: string) => void;
+    onRun?: (v: string) => void;
+    onMount?: EditorProps['onMount'];
+    jsonStrSpace?: number;
+    labelClassName?: string;
+    description?: string;
+    descriptionClassName?: string;
+    editorBoxClassName?: string;
+    errMsgClassName?: string;
+};
+interface EditorWidgetProps extends WidgetProps {
+    options: Options$5;
+}
+type EditorWidgetUIOptions = {
+    "ui:widget": (props: EditorWidgetProps) => JSX$1.Element;
+    "ui:options": Options$5;
+};
+declare const EditorWidget: ({ label, options, value, required, uiSchema, disabled, onChange }: EditorWidgetProps) => JSX$1.Element;
+
+type Options$4 = {
+    className?: string;
+    nextuiClassNames?: SlotsToClasses<InputSlots>;
+    labelPlacement?: InputProps["labelPlacement"];
+    size: InputProps["size"];
+    placeholder?: string;
+    inputType?: 'text' | 'number' | 'password';
+    color?: InputProps["color"];
+    variant?: InputProps["variant"];
+    radius?: InputProps["radius"];
+    startContent?: ReactNode;
+    endContent?: ReactNode;
+    description?: string;
+    min?: number;
+    max?: number;
+};
+interface InputWidgetProps extends WidgetProps {
+    options: Options$4;
+}
+interface InputWidgetUIOptions {
+    "ui:widget": (props: InputWidgetProps) => JSX.Element;
+    "ui:options": Options$4;
+}
+declare function InputWidget(props: InputWidgetProps): React$1.JSX.Element;
+
+type Options$3 = {
+    className?: string;
+    nextuiClassNames?: SlotsToClasses<SelectSlots>;
+    listboxProps?: SelectProps['listboxProps'];
+    labelPlacement?: SelectProps["labelPlacement"];
+    placeholder?: string;
+    size: SelectProps["size"];
+    color?: SelectProps["color"];
+    variant?: SelectProps["variant"];
+    radius?: SelectProps["radius"];
+    description?: string;
+};
+interface SelectWidgetProps extends WidgetProps {
+    options: Options$3;
+}
+interface SelectWidgetUIOptions {
+    "ui:widget": (props: SelectWidgetProps) => JSX$1.Element;
+    "ui:options": Options$3;
+}
+declare function SelectWidget(props: SelectWidgetProps): JSX$1.Element;
+
+type Options$2 = {
+    className?: string;
+    nextuiClassNames?: SelectProps['classNames'];
+    labelPlacement?: SelectProps['labelPlacement'];
+    listboxProps?: SelectProps['listboxProps'];
+    size: SelectProps['size'];
+    color?: SelectProps['color'];
+    placeholder?: string;
+    description?: string;
+    renderValue?: (items: SelectedItems<{
+        label: string;
+        value: string;
+    }>) => React$1.ReactNode;
+};
+interface MultipleSelectWidgetProps extends WidgetProps {
+    options: Options$2;
+}
+interface MultipleSelectWidgetUIOptions {
+    'ui:widget': (props: MultipleSelectWidgetProps) => JSX$1.Element;
+    'ui:options': Options$2;
+}
+declare function MultipleSelectWidget(props: MultipleSelectWidgetProps): JSX$1.Element;
+
+type Options$1 = {
+    className?: string;
+    nextuiClassNames?: SlotsToClasses<InputSlots>;
+    labelPlacement?: InputProps['labelPlacement'];
+    size: InputProps['size'];
+    minRows?: number;
+    maxRows?: number;
+    placeholder?: string;
+    color?: InputProps["color"];
+    variant?: InputProps["variant"];
+    radius?: InputProps["radius"];
+    startContent?: ReactNode;
+    endContent?: ReactNode;
+    description?: string;
+};
+interface TextareaWidgetProps extends WidgetProps {
+    options: Options$1;
+}
+interface TextareaWidgetUIOptions {
+    'ui:widget': (props: TextareaWidgetProps) => JSX$1.Element;
+    'ui:options': Options$1;
+}
+declare function TextareaWidget(props: TextareaWidgetProps): JSX$1.Element;
+
+type Options = {
+    className?: string;
+    nextuiClassNames?: Record<"base" | "selectorButton" | "selectorIcon" | "popoverContent" | "calendar" | "calendarContent" | "timeInputLabel" | "timeInput", string>;
+    dateInputClassNames?: Record<"base" | "label" | "inputWrapper" | "innerWrapper" | "input" | "helperWrapper" | "description" | "errorMessage", string>;
+    size: DatePickerProps["size"];
+    labelPlacement?: DatePickerProps["labelPlacement"];
+    color: DatePickerProps["color"];
+    granularity?: DatePickerProps["granularity"];
+    variant?: DatePickerProps['variant'];
+    description?: string;
+};
+interface DatePickerWidgetProps extends WidgetProps {
+    options: Options;
+}
+interface DatePickerWidgetUIOptions {
+    'ui:widget': (props: DatePickerWidgetProps) => string | Widget<any, RJSFSchema, any> | undefined;
+    'ui:options': Options;
+}
+declare function DatePickerWidget({ label, options, value, required, disabled, uiSchema, onChange }: DatePickerWidgetProps): React$1.JSX.Element;
+
+interface Props {
+    formState: JSONSchemaFormState<any>;
+    children?: any;
+}
+declare const JSONSchemaForm: (({ children, formState }: Props) => React$1.JSX.Element) & {
+    displayName: string;
+};
+
+declare class ComplexFormModalStore<T extends FormDataType> implements Store {
+    sid: string;
+    provider: () => React$1.JSX.Element;
+    isOpen: boolean;
+    title: string;
+    formData?: T;
+    formConfig?: FormConfigType<T>;
+    layoutConfig?: LayoutConfigType<T, LayoutType>;
+    className: string;
+    classNames?: SlotsToClasses<ModalSlots>;
+    theme: ThemeType;
+    modalSize: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full' | 'xs' | '3xl' | '4xl' | '5xl';
+    scrollBehavior?: 'normal' | 'inside' | 'outside';
+    isDismissable: boolean;
+    event: EventEmitter<[never]>;
+    onBatchSubmit?: (data: T, setLoading?: Dispatch<SetStateAction<boolean>>) => void;
+    onSet?: (v: FormDataOfKey<T>, form: JSONSchemaFormState<FormDataOfKey<T>, UiSchema>) => FormDataOfKey<T>;
+    onChange?: (data: Partial<T>) => void;
+    onReady?: (formStates: {
+        [F in keyof T]?: JSONSchemaFormState<FormDataOfKey<T>, UiSchema>;
+    }) => void;
+    batchSubmitButtonProps?: ButtonProps & {
+        onBatchSubmit?: (formData: T, setLoading: Dispatch<SetStateAction<boolean>>) => void;
+    };
+    constructor(args?: Partial<ComplexFormModalStore<T>>);
+    setData(v: Partial<ComplexFormModalStore<T>>): void;
+    close(): void;
+}
+declare function getComplexFormData<T extends FormDataType>(v: Partial<ComplexFormModalStore<T>>): Promise<T>;
+
+declare class FormModalStore<T = {
+    [key: string]: any;
+}> implements Store {
+    sid: string;
+    provider: () => React$1.JSX.Element;
+    isOpen: boolean;
+    title: string;
+    form: JSONSchemaFormState<T>;
+    className: string;
+    classNames?: SlotsToClasses<ModalSlots>;
+    theme: ThemeType;
+    modalSize: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full' | 'xs' | '3xl' | '4xl' | '5xl';
+    scrollBehavior?: 'normal' | 'inside' | 'outside';
+    closeOnOverlayClick: boolean;
+    event: EventEmitter<[never]>;
+    onAfterSubmit?: (data: T) => void;
+    constructor(args?: Partial<FormModalStore>);
+    setData(v: Partial<FormModalStore>): void;
+    close(): void;
+}
+declare function getFormData<T = {
+    [key: string]: any;
+}>(v: Partial<FormModalStore>): Promise<T>;
+declare function getFormState<T>({ data, metadata, onSet, onSubmit, theme, }: {
+    data: T;
+    metadata?: {
+        [key: string]: any;
+    } & Partial<JSONSchemaFormState<any>>;
+    onSet?: (v: T, form: JSONSchemaFormState<T, UiSchema>) => T;
+    onSubmit?: (data: T) => void;
+    theme: ThemeType;
+}): JSONSchemaFormState<T, UiSchema>;
+declare function getSimpleFormData<T>(data: T, metadata: {
+    [key: string]: any;
+} & Partial<JSONSchemaFormState<any>>, config: Partial<FormModalStore>, onSet?: (v: T, form: JSONSchemaFormState<T, UiSchema>) => T, theme?: ThemeType): Promise<T>;
+
+export { CheckboxWidget, type CheckboxWidgetProps, type CheckboxWidgetUIOptions, ComplexFormModalStore, DatePickerWidget, type DatePickerWidgetProps, type DatePickerWidgetUIOptions, EditorWidget, type EditorWidgetProps, type EditorWidgetUIOptions, type FormConfigType, type FormDataOfKey, type FormDataType, type FormKey, FormModalStore, InputWidget, type InputWidgetProps, type InputWidgetUIOptions, JSONForm, type JSONFormProps, JSONSchemaForm, type LayoutConfigType, type LayoutType, MultipleSelectWidget, type MultipleSelectWidgetProps, type MultipleSelectWidgetUIOptions, SelectWidget, type SelectWidgetProps, type SelectWidgetUIOptions, TextareaWidget, type TextareaWidgetProps, type TextareaWidgetUIOptions, getComplexFormData, getFormData, getFormState, getSimpleFormData };

package/dist/form.mjs

@@ -1,15 +1,15 @@
 import { getStyle } from './chunk-GKAU4P5I.mjs';
 import { useStore, RootStore } from './chunk-XSGTWROT.mjs';
-import { helper } from './chunk-R4N52NI2.mjs';
+import { helper } from './chunk-VDDGCMCB.mjs';
 import { _ } from './chunk-K7LFG5BA.mjs';
-import { cn } from './chunk-2HNXZE3X.mjs';
-import { __objRest, __spreadValues, __spreadProps } from './chunk-R4SQKVDQ.mjs';
-import React7, { useEffect, useMemo, useState, useRef, useCallback, createRef } from 'react';
-import { Modal, ModalContent, ModalHeader, ModalBody, Checkbox, Input, Select, SelectItem, Button, Textarea, DatePicker, Chip, Card, Tabs, Tab } from '@nextui-org/react';
-import { Check, ChevronUp, ChevronDown } from 'lucide-react';
+import { cn } from './chunk-6HA5WR5H.mjs';
+import { __objRest, __spreadValues, __spreadProps } from './chunk-YOSPWY5K.mjs';
+import React7, { useEffect, useMemo, useState, useCallback, useRef, createRef } from 'react';
+import { Modal, ModalContent, ModalHeader, ModalBody, Button, Tabs, Tab, Card, Select, SelectItem, Input, Checkbox, Chip, Textarea, DatePicker } from '@nextui-org/react';
+import { ChevronUp, ChevronDown, Check } from 'lucide-react';
 import MonacoEditor from '@monaco-editor/react';
 import validator from '@rjsf/validator-ajv8';
-import { toJS, makeAutoObservable, makeObservable, computed, observable, action } from 'mobx';
+import { toJS, makeAutoObservable, makeObservable, computed, action, observable } from 'mobx';
 import Form from '@rjsf/core';
 import * as Utils from '@rjsf/utils';
 import { observer, useLocalObservable } from 'mobx-react-lite';
@@ -680,7 +680,8 @@ var renderLayout = (layout, fields, n = 1) => {
     }
   });
 };
-var ObjectFieldTemplate = ({ title, idSchema: { $id }, properties, uiSchema: { layout } }) => {
+var ObjectFieldTemplate = ({ title, idSchema, properties, uiSchema: { layout } }) => {
+  const { $id } = idSchema;
   const [opened, setOpened] = useState(false);
   const fields = Object.fromEntries(properties.map((item) => [item.name, item.content]));
   return /* @__PURE__ */ React7.createElement("div", { className: "w-full space-y-2.5" }, $id === "root" ? layout ? renderLayout(layout, fields) : properties.map((element) => {
@@ -709,8 +710,7 @@ var SubmitButton2 = ({ uiSchema }) => {
 };
 var JSONSchemaForm = observer(({ children, formState }) => {
   var _a;
-  if (!((_a = formState == null ? void 0 : formState.dynamicData) == null ? void 0 : _a.ready))
-    return /* @__PURE__ */ React7.createElement(React7.Fragment, null);
+  if (!((_a = formState == null ? void 0 : formState.dynamicData) == null ? void 0 : _a.ready)) return /* @__PURE__ */ React7.createElement(React7.Fragment, null);
   return /* @__PURE__ */ React7.createElement(
     Form,
     {
@@ -861,10 +861,8 @@ var colSpanLg = {
 var Col = React7.forwardRef((props, ref) => {
   const _a = props, { numColSpan = 1, numColSpanSm, numColSpanMd, numColSpanLg, children, className } = _a, other = __objRest(_a, ["numColSpan", "numColSpanSm", "numColSpanMd", "numColSpanLg", "children", "className"]);
   const getColSpan = (numColSpan2, colSpanMapping) => {
-    if (!numColSpan2)
-      return "";
-    if (!Object.keys(colSpanMapping).includes(String(numColSpan2)))
-      return "";
+    if (!numColSpan2) return "";
+    if (!Object.keys(colSpanMapping).includes(String(numColSpan2))) return "";
     return colSpanMapping[numColSpan2];
   };
   const getColSpanClassNames = () => {
@@ -879,10 +877,8 @@ var Col = React7.forwardRef((props, ref) => {
 Col.displayName = "Col";
 var col_default = Col;
 var getGridCols = (numCols, gridColsMapping) => {
-  if (!numCols)
-    return "";
-  if (!Object.keys(gridColsMapping).includes(String(numCols)))
-    return "";
+  if (!numCols) return "";
+  if (!Object.keys(gridColsMapping).includes(String(numCols))) return "";
   return gridColsMapping[numCols];
 };
 var Grid = React7.forwardRef((props, ref) => {
@@ -1475,5 +1471,5 @@ async function getSimpleFormData(data, metadata = {}, config, onSet = (v, form)
 }
 
 export { CheckboxWidget, ComplexFormModalStore, DatePickerWidget, EditorWidget, FormModalStore, InputWidget, JSONForm, JSONSchemaForm, MultipleSelectWidget, SelectWidget, TextareaWidget, getComplexFormData, getFormData, getFormState2 as getFormState, getSimpleFormData };
-//# sourceMappingURL=out.js.map
+//# sourceMappingURL=form.mjs.map
 //# sourceMappingURL=form.mjs.map