merge newui branch

2026-04-18 16:29:34 +03:00
parent 58f605e90c
commit 4c44044c0c
804 changed files with 58660 additions and 56663 deletions
@@ -0,0 +1,78 @@
+// {
+//     collection: undefined,
+//     originalRecord: undefined,
+//     record: undefined,
+//     field: undefined,
+// }
+export function input(props) {
+    const uniqueId = "text_" + app.utils.randomString();
+
+    const data = store({
+        get hasAutogenerate() {
+            return !app.utils.isEmpty(props.field.autogeneratePattern) && app.utils.isEmpty(props.originalRecord?.id);
+        },
+        get isDisabled() {
+            return !app.utils.isEmpty(props.originalRecord?.id) && props.field.primaryKey;
+        },
+        get isRequired() {
+            return props.field.required && !data.hasAutogenerate && !data.isDisabled;
+        },
+    });
+
+    return t.div(
+        { className: "record-field-input field-type-text" },
+        t.div(
+            { className: "fields" },
+            t.div(
+                { className: "field" },
+                t.label(
+                    { htmlFor: uniqueId },
+                    t.i({
+                        className: () => (props.field.primaryKey ? "ri-key-line" : app.fieldTypes.text.icon),
+                    }),
+                    t.span({ className: "txt" }, () => props.field.name),
+                ),
+                t.textarea({
+                    id: uniqueId,
+                    className: "autoexpand",
+                    rows: 1,
+                    name: () => props.field.name,
+                    required: () => data.isRequired,
+                    disabled: () => data.isDisabled,
+                    placeholder: () => (data.hasAutogenerate ? "Leave empty to autogenerate..." : ""),
+                    value: () => props.record[props.field.name] || "",
+                    oninput: (e) => (props.record[props.field.name] = e.target.value || ""),
+                }),
+            ),
+            // list the autodate field values in a tooltip next to the primary key
+            () => {
+                if (!props.field.primaryKey || !props.originalRecord?.id) {
+                    return;
+                }
+
+                const autodateFields = props.collection?.fields?.filter((f) => f.type == "autodate") || [];
+                if (!autodateFields.length) {
+                    return;
+                }
+
+                const autodateValues = [];
+                for (let f of autodateFields) {
+                    autodateValues.push(`${f.name}: ${app.utils.stringifyValue(props.record[f.name])}`);
+                }
+
+                return t.div(
+                    { className: "field addon" },
+                    t.i({
+                        className: "ri-information-line txt-hint link-faded",
+                        ariaDescription: app.attrs.tooltip(autodateValues.join("\n"), "left"),
+                    }),
+                );
+            },
+        ),
+        () => {
+            if (props.field.help) {
+                return t.div({ className: "field-help" }, props.field.help);
+            }
+        },
+    );
+}