@dappworks/kit 0.4.118 → 0.4.120

package/dist/form.d.mts

@@ -1,10 +1,10 @@
 import React, { LegacyRef, Ref, Dispatch, SetStateAction, ReactNode } from 'react';
-import { ButtonProps, TabsProps, CheckboxProps, SlotsToClasses, InputSlots, InputProps, SelectSlots, ListboxProps, SelectProps, SelectedItems, DatePickerSlots, DateInputProps, DatePickerProps, ModalSlots } from '@nextui-org/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 { EditorProps } from '@monaco-editor/react';
-import { S as Store, R as RootStore } from './root-C3lZnoCI.js';
+import { S as Store, R as RootStore } from './root-766ae985.js';
 import EventEmitter from 'events';
 import 'typed-emitter';
 
@@ -133,6 +133,7 @@ declare const JSONForm: <T extends FormDataType>(props: JSONFormProps<T>) => Rea
 
 type Options$6 = {
     className?: string;
+    nextuiClassNames?: CheckboxProps["classNames"];
     size: CheckboxProps["size"];
     color: CheckboxProps["color"];
     description?: string;
@@ -159,8 +160,10 @@ type Options$5 = {
     onRun?: (v: string) => void;
     onMount?: EditorProps['onMount'];
     jsonStrSpace?: number;
+    labelClassName?: string;
     description?: string;
     descriptionClassName?: string;
+    editorBoxClassName?: string;
     errMsgClassName?: string;
 };
 interface EditorWidgetProps extends WidgetProps {
@@ -198,7 +201,7 @@ declare function InputWidget(props: InputWidgetProps): React.JSX.Element;
 type Options$3 = {
     className?: string;
     nextuiClassNames?: SlotsToClasses<SelectSlots>;
-    listboxProps?: Partial<ListboxProps>;
+    listboxProps?: SelectProps['listboxProps'];
     labelPlacement?: SelectProps["labelPlacement"];
     placeholder?: string;
     size: SelectProps["size"];
@@ -218,7 +221,9 @@ declare function SelectWidget(props: SelectWidgetProps): React.JSX.Element;
 
 type Options$2 = {
     className?: string;
+    nextuiClassNames?: SelectProps['classNames'];
     labelPlacement?: SelectProps['labelPlacement'];
+    listboxProps?: SelectProps['listboxProps'];
     size: SelectProps['size'];
     color?: SelectProps['color'];
     placeholder?: string;
@@ -263,7 +268,8 @@ declare function TextareaWidget(props: TextareaWidgetProps): React.JSX.Element;
 
 type Options = {
     className?: string;
-    nextuiClassNames?: SlotsToClasses<DatePickerSlots> & DateInputProps<any>["classNames"];
+    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"];
@@ -300,7 +306,7 @@ declare class ComplexFormModalStore<T extends FormDataType> implements Store {
     modalSize: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full' | 'xs' | '3xl' | '4xl' | '5xl';
     scrollBehavior?: 'normal' | 'inside' | 'outside';
     isDismissable: boolean;
-    event: EventEmitter<[never]>;
+    event: EventEmitter;
     onBatchSubmit?: (data: T, setLoading?: Dispatch<SetStateAction<boolean>>) => void;
     onSet?: (v: FormDataOfKey<T>, form: JSONSchemaFormState<FormDataOfKey<T>, UiSchema>) => FormDataOfKey<T>;
     onChange?: (data: Partial<T>) => void;
@@ -329,7 +335,7 @@ declare class FormModalStore<T = {
     modalSize: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full' | 'xs' | '3xl' | '4xl' | '5xl';
     scrollBehavior?: 'normal' | 'inside' | 'outside';
     closeOnOverlayClick: boolean;
-    event: EventEmitter<[never]>;
+    event: EventEmitter;
     onAfterSubmit?: (data: T) => void;
     constructor(args?: Partial<FormModalStore>);
     setData(v: Partial<FormModalStore>): void;
@@ -401,4 +407,4 @@ declare class JSONViewPlugin implements Store {
     static JSONView: (props: JSONViewType) => React.JSX.Element;
 }
 
-export { CheckboxWidget, type CheckboxWidgetProps, type CheckboxWidgetUIOptions, ComplexFormModalStore, DatePickerWidget, type DatePickerWidgetProps, type DatePickerWidgetUIOptions, EditorWidget, type EditorWidgetProps, type EditorWidgetUIOptions, type FieldLayoutType, type FormConfigType, type FormDataOfKey, type FormDataType, type FormKey, type FormLayoutType, FormModalStore, InputWidget, type InputWidgetProps, type InputWidgetUIOptions, type JSONDataType, JSONForm, type JSONFormProps, JSONSchemaForm, JSONViewPlugin, type JSONViewType, type LayoutConfigType, type LayoutType, MultipleSelectWidget, type MultipleSelectWidgetProps, type MultipleSelectWidgetUIOptions, SelectWidget, type SelectWidgetProps, type SelectWidgetUIOptions, TextareaWidget, type TextareaWidgetProps, type TextareaWidgetUIOptions, getComplexFormData, getFormData, getFormState, getSimpleFormData };
+export { CheckboxWidget, CheckboxWidgetProps, CheckboxWidgetUIOptions, ComplexFormModalStore, DatePickerWidget, DatePickerWidgetProps, DatePickerWidgetUIOptions, EditorWidget, EditorWidgetProps, EditorWidgetUIOptions, FieldLayoutType, FormConfigType, FormDataOfKey, FormDataType, FormKey, FormLayoutType, FormModalStore, InputWidget, InputWidgetProps, InputWidgetUIOptions, JSONDataType, JSONForm, JSONFormProps, JSONSchemaForm, JSONViewPlugin, JSONViewType, LayoutConfigType, LayoutType, MultipleSelectWidget, MultipleSelectWidgetProps, MultipleSelectWidgetUIOptions, SelectWidget, SelectWidgetProps, SelectWidgetUIOptions, TextareaWidget, TextareaWidgetProps, TextareaWidgetUIOptions, getComplexFormData, getFormData, getFormState, getSimpleFormData };

package/dist/form.mjs

@@ -1,9 +1,9 @@
-import { useStore } from './chunk-WS43BV7Y.mjs';
-import { RootStore } from './chunk-XJMRAPHI.mjs';
-import { helper } from './chunk-46XF5IRX.mjs';
+import { useStore } from './chunk-DZMNL4BZ.mjs';
+import { RootStore } from './chunk-HRWHDF2F.mjs';
+import { helper } from './chunk-Q3AD5RHQ.mjs';
 import { _ } from './chunk-MGU3KYGC.mjs';
-import { cn } from './chunk-AIZ7XDNV.mjs';
-import { __objRest, __spreadValues, __spreadProps } from './chunk-R4SQKVDQ.mjs';
+import { cn } from './chunk-WYGQ3Y4R.mjs';
+import { __objRest, __spreadValues, __spreadProps } from './chunk-6F7H4PAA.mjs';
 import React7, { useEffect, useMemo, useState, useCallback, useRef, 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';
@@ -25,7 +25,7 @@ function CheckboxWidget({
   disabled,
   uiSchema
 }) {
-  const { className, size = "sm", color = "primary", description, descriptionClassName } = options;
+  const { className, nextuiClassNames = {}, size = "sm", color = "primary", description, descriptionClassName } = options;
   const { validate } = uiSchema;
   const [errMsg, setErrMsg] = useState("");
   const isInvalid = !!errMsg;
@@ -33,9 +33,9 @@ function CheckboxWidget({
     Checkbox,
     {
       className: cn("w-full", className),
-      classNames: {
-        base: cn("m-0 flex items-center justify-start w-full", "cursor-pointer rounded-lg gap-2 p-[13px] bg-content2 border-1 border-transparent", value ? `border-${color}` : "")
-      },
+      classNames: __spreadProps(__spreadValues({}, nextuiClassNames), {
+        base: cn("m-0 flex items-center justify-start w-full", "cursor-pointer rounded-lg gap-2 p-[13px] bg-content2 border-1 border-transparent", nextuiClassNames.base, value ? `border-${color}` : "")
+      }),
       defaultSelected: value,
       isDisabled: disabled,
       icon: /* @__PURE__ */ React7.createElement(Check, { className: "bg-white dark:bg-black" }),
@@ -175,7 +175,7 @@ function MultipleSelectWidget(props) {
   var _a;
   const { onChange, options, label, value, required, uiSchema = {} } = props;
   const { selectOptions = [], requiredErrMsg, validate } = uiSchema;
-  const { className, labelPlacement = "inside", size = "sm", color, description, renderValue = DefaultRenderValue } = options;
+  const { className, nextuiClassNames = {}, labelPlacement = "inside", listboxProps = {}, size = "sm", color, description, renderValue = DefaultRenderValue } = options;
   const placeholder = ((_a = uiSchema["ui:options"]) == null ? void 0 : _a.placeholder) || "Select an option";
   const selectedKeys = useMemo(() => {
     return value ? value.split(",") : [];
@@ -215,12 +215,12 @@ function MultipleSelectWidget(props) {
         checkValue(_v);
       },
       items: selectOptions,
-      classNames: {
+      classNames: __spreadValues({
         base: "w-full",
         trigger: "min-h-12 py-1",
         popoverContent: "rounded-lg shadow-md border dark:border-[#3e3e3e]"
-      },
-      listboxProps: {
+      }, nextuiClassNames),
+      listboxProps: __spreadValues({
         itemClasses: {
           base: [
             "rounded-lg",
@@ -234,7 +234,7 @@ function MultipleSelectWidget(props) {
             "data-[focus-visible=true]:ring-default-500"
           ]
         }
-      },
+      }, listboxProps),
       description,
       renderValue
     },
@@ -245,7 +245,7 @@ function DefaultRenderValue(items) {
   return /* @__PURE__ */ React7.createElement("div", { className: "flex flex-wrap gap-2" }, items.map((item) => /* @__PURE__ */ React7.createElement(Chip, { color: "secondary", size: "sm", key: item.key }, item.textValue)));
 }
 var EditorWidget = ({ label, options = {}, value, required, uiSchema, disabled, onChange }) => {
-  const { editorHeight = "200px", readOnly = false, language = "json", jsonStrSpace, languageSelectorOptions = [], description, descriptionClassName, errMsgClassName, onChangeLanguage, onRun, onMount } = options;
+  const { editorHeight = "200px", readOnly = false, language = "json", jsonStrSpace, languageSelectorOptions = [], labelClassName, description, descriptionClassName, editorBoxClassName, errMsgClassName, onChangeLanguage, onRun, onMount } = options;
   const { requiredErrMsg, validate } = uiSchema;
   const [selectedLanguage, setSelectedLanguage] = useState("");
   const [runLoading, setRunLoading] = useState(false);
@@ -266,7 +266,9 @@ var EditorWidget = ({ label, options = {}, value, required, uiSchema, disabled,
       setErrMsg("");
     }, 1e3)
   ).current;
-  return /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col relative" }, /* @__PURE__ */ React7.createElement("div", { className: cn("flex justify-between items-center", { "mb-[10px]": label.trim() || showLanguageSelector }) }, label && /* @__PURE__ */ React7.createElement(
+  const labelText = label.trim();
+  const showLabel = labelText || showLanguageSelector;
+  return /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col relative" }, showLabel && /* @__PURE__ */ React7.createElement("div", { className: cn("flex justify-between items-center mb-2", labelClassName) }, label && /* @__PURE__ */ React7.createElement(
     "label",
     {
       className: "mr-2 flex items-center text-sm"
@@ -287,7 +289,7 @@ var EditorWidget = ({ label, options = {}, value, required, uiSchema, disabled,
     languageSelectorOptions.map((item) => {
       return /* @__PURE__ */ React7.createElement("option", { key: item.value, value: item.value }, item.label);
     })
-  )), description && /* @__PURE__ */ React7.createElement("div", { className: cn("mb-2 text-xs text-[#A1A1A9] dark:text-[#717179]", descriptionClassName) }, description), /* @__PURE__ */ React7.createElement("div", { className: "rounded-lg overflow-hidden relative" }, /* @__PURE__ */ React7.createElement(
+  )), description && /* @__PURE__ */ React7.createElement("div", { className: cn("mb-2 text-xs text-[#A1A1A9] dark:text-[#717179]", descriptionClassName) }, description), /* @__PURE__ */ React7.createElement("div", { className: cn("rounded-lg overflow-hidden relative", editorBoxClassName) }, /* @__PURE__ */ React7.createElement(
     MonacoEditor,
     {
       options: { readOnly: readOnly || disabled, minimap: { enabled: false } },
@@ -1042,7 +1044,7 @@ function TextareaWidget(props) {
   );
 }
 function DatePickerWidget({ label, options, value, required, disabled, uiSchema, onChange }) {
-  const { className, nextuiClassNames = { calendarContent: "min-w-fit" }, labelPlacement = "inside", size = "sm", granularity = "day", color = "default", description } = options;
+  const { className, nextuiClassNames = { calendarContent: "min-w-fit" }, dateInputClassNames, labelPlacement = "inside", size = "sm", granularity = "day", color = "default", description } = options;
   const [date, setDate] = useState();
   const { requiredErrMsg, validate } = uiSchema;
   useEffect(() => {
@@ -1062,6 +1064,7 @@ function DatePickerWidget({ label, options, value, required, disabled, uiSchema,
       showMonthAndYearPickers: true,
       className: cn("w-full", className),
       classNames: nextuiClassNames,
+      dateInputClassNames,
       label,
       size,
       labelPlacement,