diff --git a/apps/client/src/services/promoted_attribute_definition_parser.ts b/apps/client/src/services/promoted_attribute_definition_parser.ts index 0d93aae3c5..b589d45986 100644 --- a/apps/client/src/services/promoted_attribute_definition_parser.ts +++ b/apps/client/src/services/promoted_attribute_definition_parser.ts @@ -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; diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json index 81c81bea96..27891a02ab 100644 --- a/apps/client/src/translations/en/translation.json +++ b/apps/client/src/translations/en/translation.json @@ -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", diff --git a/apps/client/src/widgets/PromotedAttributes.tsx b/apps/client/src/widgets/PromotedAttributes.tsx index 1e0bdeb474..6a1a8640f2 100644 --- a/apps/client/src/widgets/PromotedAttributes.tsx +++ b/apps/client/src/widgets/PromotedAttributes.tsx @@ -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 | InputEvent | JQuery.TriggeredEvent; +type OnChangeEventData = TargetedEvent | InputEvent | JQuery.TriggeredEvent; type OnChangeListener = (e: OnChangeEventData) => void | Promise; export default function PromotedAttributes() { @@ -171,8 +171,9 @@ function PromotedAttributeCell(props: CellProps) { ); } -const LABEL_MAPPINGS: Record = { +const LABEL_MAPPINGS: Record = { text: "text", + textarea: undefined, number: "number", boolean: "checkbox", date: "date", @@ -226,20 +227,21 @@ function LabelInput(props: CellProps & { inputId: string }) { } } - const inputNode = ; + + 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 <> diff --git a/apps/client/src/widgets/attribute_widgets/attribute_detail.ts b/apps/client/src/widgets/attribute_widgets/attribute_detail.ts index 607af49952..452c6aecc3 100644 --- a/apps/client/src/widgets/attribute_widgets/attribute_detail.ts +++ b/apps/client/src/widgets/attribute_widgets/attribute_detail.ts @@ -137,6 +137,7 @@ const TPL = /*html*/`