gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-03-21 15:53:37 +01:00
Code Issues Actions 16 Packages Projects Releases Wiki Activity

Textarea Label Support (#9077)

Browse Source
This commit is contained in:
Elian Doran 2026-03-19 20:02:11 +02:00 committed by GitHub
commit 27f4ac1d03
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 37 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/client/src/services/promoted_attribute_definition_parser.ts
View File

@ -1,4 +1,4 @@
export type LabelType = "text" | "number" | "boolean" | "date" | "datetime" | "time" | "url" | "color";
export type LabelType = "text" | "textarea" | "number" | "boolean" | "date" | "datetime" | "time" | "url" | "color";
type Multiplicity = "single" | "multi";
export interface DefinitionObject {
@ -17,7 +17,7 @@ function parse(value: string) {
for (const token of tokens) {
if (token === "promoted") {
defObj.isPromoted = true;
} else if (["text", "number", "boolean", "date", "datetime", "time", "url", "color"].includes(token)) {
} else if (["text", "textarea", "number", "boolean", "date", "datetime", "time", "url", "color"].includes(token)) {
defObj.labelType = token as LabelType;
} else if (["single", "multi"].includes(token)) {
defObj.multiplicity = token as Multiplicity;

1
apps/client/src/translations/en/translation.json
View File

@ -343,6 +343,7 @@
"label_type_title": "Type of the label will help Trilium to choose suitable interface to enter the label value.",
"label_type": "Type",
"text": "Text",
"textarea": "Multi-line Text",
"number": "Number",
"boolean": "Boolean",
"date": "Date",

36
apps/client/src/widgets/PromotedAttributes.tsx
View File

@ -2,7 +2,7 @@ import "./PromotedAttributes.css";
import { UpdateAttributeResponse } from "@triliumnext/commons";
import clsx from "clsx";
import { ComponentChild, HTMLInputTypeAttribute, InputHTMLAttributes, MouseEventHandler, TargetedEvent, TargetedInputEvent } from "preact";
import { ComponentChild, createElement, HTMLInputTypeAttribute, InputHTMLAttributes, MouseEventHandler, TargetedEvent, TargetedInputEvent } from "preact";
import { Dispatch, StateUpdater, useCallback, useEffect, useRef, useState } from "preact/hooks";
import NoteContext from "../components/note_context";
@ -36,7 +36,7 @@ interface CellProps {
setCellToFocus(cell: Cell): void;
}
type OnChangeEventData = TargetedEvent<HTMLInputElement, Event> | InputEvent | JQuery.TriggeredEvent<HTMLInputElement, undefined, HTMLInputElement, HTMLInputElement>;
type OnChangeEventData = TargetedEvent<HTMLInputElement | HTMLTextAreaElement, Event> | InputEvent | JQuery.TriggeredEvent<HTMLInputElement, undefined, HTMLInputElement, HTMLInputElement>;
type OnChangeListener = (e: OnChangeEventData) => void | Promise<void>;
export default function PromotedAttributes() {
@ -171,8 +171,9 @@ function PromotedAttributeCell(props: CellProps) {
);
}
const LABEL_MAPPINGS: Record<LabelType, HTMLInputTypeAttribute> = {
const LABEL_MAPPINGS: Record<LabelType, HTMLInputTypeAttribute | undefined> = {
text: "text",
textarea: undefined,
number: "number",
boolean: "checkbox",
date: "date",
@ -226,20 +227,21 @@ function LabelInput(props: CellProps & { inputId: string }) {
}
}
const inputNode = <input
className="form-control promoted-attribute-input"
tabIndex={200 + definitionAttr.position}
id={inputId}
type={LABEL_MAPPINGS[definition.labelType ?? "text"]}
value={valueDraft}
checked={definition.labelType === "boolean" ? valueAttr.value === "true" : undefined}
placeholder={t("promoted_attributes.unset-field-placeholder")}
data-attribute-id={valueAttr.attributeId}
data-attribute-type={valueAttr.type}
data-attribute-name={valueAttr.name}
onBlur={onChangeListener}
{...extraInputProps}
/>;
const inputNode = createElement(definition.labelType === "textarea" ? "textarea" : "input", {
className: "form-control promoted-attribute-input",
tabIndex: 200 + definitionAttr.position,
id: inputId,
type: LABEL_MAPPINGS[definition.labelType ?? "text"],
value: valueDraft,
checked: definition.labelType === "boolean" ? valueAttr.value === "true" : undefined,
placeholder: t("promoted_attributes.unset-field-placeholder"),
"data-attribute-id": valueAttr.attributeId,
"data-attribute-type": valueAttr.type,
"data-attribute-name": valueAttr.name,
onBlur: onChangeListener,
...extraInputProps
});
if (definition.labelType === "boolean") {
return <>

1
apps/client/src/widgets/attribute_widgets/attribute_detail.ts
View File

@ -137,6 +137,7 @@ const TPL = /*html*/`
<td>
<select class="attr-input-label-type form-control">
<option value="text">${t("attribute_detail.text")}</option>
<option value="textarea">${t("attribute_detail.textarea")}</option>
<option value="number">${t("attribute_detail.number")}</option>
<option value="boolean">${t("attribute_detail.boolean")}</option>
<option value="date">${t("attribute_detail.date")}</option>

7
apps/client/src/widgets/collections/table/columns.tsx
View File

@ -19,6 +19,13 @@ const labelTypeMappings: Record<ColumnType, Partial<ColumnDefinition>> = {
text: {
editor: "input"
},
textarea: {
editor: "textarea",
formatter: "textarea",
editorParams: {
shiftEnterSubmit: true
}
},
boolean: {
formatter: "tickCross",
editor: "tickCross"

6
apps/client/src/widgets/collections/table/index.css
View File

@ -75,3 +75,9 @@
font-size: 1.5em;
transform: translateY(-50%);
}
.tabulator .tabulator-editable {
textarea {
padding: 7px !important;
}
}

2
apps/server/src/services/promoted_attribute_definition_parser.ts
View File

@ -7,7 +7,7 @@ function parse(value: string): DefinitionObject {
for (const token of tokens) {
if (token === "promoted") {
defObj.isPromoted = true;
} else if (["text", "number", "boolean", "date", "datetime", "time", "url"].includes(token)) {
} else if (["text", "textarea", "number", "boolean", "date", "datetime", "time", "url"].includes(token)) {
defObj.labelType = token;
} else if (["single", "multi"].includes(token)) {
defObj.multiplicity = token;