@dndbuilder.com/react
Version:
Drag and drop builder for React
46 lines (45 loc) • 1.6 kB
JavaScript
"use client";
import { jsxs as l, jsx as t } from "react/jsx-runtime";
import { Label as p } from "../shared/label.js";
import { useSettings as h } from "../../hooks/use-settings.js";
import x from "../../../../../node_modules/.pnpm/@monaco-editor_react@4.7.0_monaco-editor@0.52.2_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@monaco-editor/react/dist/index.js";
import { l as g } from "../../../../../_virtual/lodash.js";
import { useState as C } from "react";
const v = ({ type: a, label: o, fieldName: n }) => {
const [m, i] = h(n, a), [d, c] = C([]);
let r = !1;
const u = g.debounce((e) => {
r || i(e);
}, 2e3);
return /* @__PURE__ */ l("div", { children: [
o && /* @__PURE__ */ t(p, { className: "mb-1.5", children: o }),
/* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
x,
{
defaultValue: m ?? `selector {
/* Your custom CSS here */
}`,
onValidate: (e) => {
const s = e.filter((f) => f.code !== "emptyRules");
r = !!s.length, c(s);
},
onChange: u,
defaultLanguage: "css",
height: "150px",
options: {
minimap: { enabled: !1 }
},
className: "rounded border"
}
) }),
/* @__PURE__ */ t("ol", { className: "flex list-decimal flex-col gap-1 px-4 pt-4", children: d.map((e, s) => /* @__PURE__ */ l("li", { className: "text-sm text-red-500", children: [
e.message,
" : End Line Number ",
e.endLineNumber
] }, s)) })
] });
};
export {
v as CustomCSSControl
};
//# sourceMappingURL=custom-css.control.js.map