@premieroctet/next-admin
Version:
Next-Admin provides a customizable and turnkey admin dashboard for applications built with Next.js and powered by the Prisma ORM. It aims to simplify the development process by providing a turnkey admin system that can be easily integrated into your proje
139 lines (138 loc) • 5.96 kB
JavaScript
;
var __webpack_require__ = {};
(()=>{
__webpack_require__.n = (module)=>{
var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
__webpack_require__.d(getter, {
a: getter
});
return getter;
};
})();
(()=>{
__webpack_require__.d = (exports1, definition)=>{
for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
enumerable: true,
get: definition[key]
});
};
})();
(()=>{
__webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
})();
(()=>{
__webpack_require__.r = (exports1)=>{
if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
value: 'Module'
});
Object.defineProperty(exports1, '__esModule', {
value: true
});
};
})();
var __webpack_exports__ = {};
__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
default: ()=>ScalarArray_ScalarArrayField
});
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
const core_namespaceObject = require("@dnd-kit/core");
const sortable_namespaceObject = require("@dnd-kit/sortable");
const external_react_namespaceObject = require("react");
const FormStateContext_js_namespaceObject = require("../../../context/FormStateContext.js");
const I18nContext_js_namespaceObject = require("../../../context/I18nContext.js");
const Button_js_namespaceObject = require("../../radix/Button.js");
var Button_js_default = /*#__PURE__*/ __webpack_require__.n(Button_js_namespaceObject);
const external_ScalarArrayFieldItem_js_namespaceObject = require("./ScalarArrayFieldItem.js");
var external_ScalarArrayFieldItem_js_default = /*#__PURE__*/ __webpack_require__.n(external_ScalarArrayFieldItem_js_namespaceObject);
const ScalarArrayField = ({ formData, onChange, name, disabled, schema, customInput })=>{
const { t } = (0, I18nContext_js_namespaceObject.useI18n)();
const { setFieldDirty } = (0, FormStateContext_js_namespaceObject.useFormState)();
const [formDataList, setFormDataList] = (0, external_react_namespaceObject.useState)(()=>formData.map((value)=>({
id: crypto.randomUUID(),
value
})));
const onDragEnd = (event)=>{
const { active, over } = event;
if (active.id !== over?.id) {
const activeIndex = formDataList.findIndex((value)=>value.id === active.id);
const overIndex = formDataList.findIndex((value)=>value.id === over?.id);
const newFormData = [
...formDataList
];
newFormData.splice(overIndex, 0, newFormData.splice(activeIndex, 1)[0]);
setFieldDirty(name);
onChange(newFormData.map((val)=>val.value));
setFormDataList(newFormData);
}
};
const renderList = ()=>formDataList.map((value)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ScalarArrayFieldItem_js_default(), {
value: value.value.toString(),
onRemoveClick: ()=>{
setFormDataList((prev)=>prev.filter((val)=>val.id !== value.id));
setFieldDirty(name);
},
inputValue: value.value.toString(),
disabled: disabled,
onChange: (newValue)=>{
setFormDataList((prev)=>prev.map((val)=>val.id === value.id ? {
...val,
value: newValue
} : val));
setFieldDirty(name);
},
id: value.id,
scalarType: schema.items.type,
customInput: customInput
}, value.id));
const onAddNewItem = ()=>{
setFormDataList((prev)=>{
if (schema.maxItems && prev.length >= schema.maxItems) return prev;
return [
...prev,
{
id: crypto.randomUUID(),
value: ""
}
];
});
setFieldDirty(name);
};
(0, external_react_namespaceObject.useEffect)(()=>{
onChange(formDataList.map((val)=>val.value));
}, [
formDataList
]);
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
className: "relative flex flex-col gap-3",
children: [
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
type: "hidden",
name: name,
value: JSON.stringify(formDataList.map((val)=>val.value))
}),
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(core_namespaceObject.DndContext, {
onDragEnd: onDragEnd,
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(sortable_namespaceObject.SortableContext, {
items: formDataList.map((val)=>val.id) ?? [],
children: renderList()
})
}),
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Button_js_default(), {
type: "button",
className: "w-fit",
disabled: disabled || (schema.maxItems ? formDataList.length >= schema.maxItems : false),
onClick: onAddNewItem,
children: t("form.widgets.scalar_array.add")
})
]
});
};
const ScalarArray_ScalarArrayField = ScalarArrayField;
exports["default"] = __webpack_exports__["default"];
for(var __webpack_i__ in __webpack_exports__)if (-1 === [
"default"
].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
Object.defineProperty(exports, '__esModule', {
value: true
});