@dappworks/kit 0.4.119 → 0.4.121

package/dist/form.mjs

@@ -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,