Function createTaskCard

src/ui/TaskCard.ts:122–281

(
	task: TaskInfo,
	plugin: TaskNotesPlugin,
	visibleProperties?: string[],
	options: Partial<TaskCardOptions> = {}
)

 * createTaskCard(task, plugin, ["completeInstances", "status"]); // ❌
 */
export function createTaskCard(
	task: TaskInfo,
	plugin: TaskNotesPlugin,
	visibleProperties?: string[],
	options: Partial<TaskCardOptions> = {}
): HTMLElement {
	const opts = { ...DEFAULT_TASK_CARD_OPTIONS, ...options };
	const renderState = buildTaskCardRenderState(task, plugin, opts);
	const { targetDate, effectiveStatus, layout, isCompleted, hasDetails } = renderState;

	// Main container with BEM class structure
	// Use span for inline layout to ensure proper inline flow in CodeMirror
	const card = activeDocument.createElement(layout === "inline" ? "span" : "div");

	// Store task path for circular reference detection
	const taskCardElement = card as TaskCardElement;
	taskCardElement._taskPath = task.path;
	taskCardElement._taskCardOptions = opts;

	card.className = renderState.cardClasses.join(" ");
	card.dataset.taskPath = task.path;
	card.dataset.key = task.path; // For DOMReconciler compatibility
	card.dataset.status = effectiveStatus;
	if (task.priority) {
		card.dataset.priority = task.priority;
	} else {
		delete card.dataset.priority;
	}
	card.dataset.hasDetails = hasDetails ? "true" : "false";

	// Create main row container for horizontal layout
	// Use span for inline layout to maintain inline flow
	const mainRow = card.createEl(layout === "inline" ? "span" : "div", {
		cls: "task-card__main-row",
	});

	applyTaskCardPriorityColor(card, task, plugin);

	createStatusIndicator({
		mainRow,
		card,
		task,
		plugin,
		effectiveStatus,
		visibleProperties,
		hideStatusIndicator: opts.hideStatusIndicator,
		onClick: createStatusCycleHandler({
			task,
			plugin,
			targetDate,
			updateStatusVisuals: (updatedTask, effectiveStatus, isCompleted) => {
				const currentStatusDot = card.querySelector<HTMLElement>(".task-card__status-dot");
				if (currentStatusDot) {
					updateTaskCardStatusIndicatorVisuals({
						card,
						statusDot: currentStatusDot,
						plugin,
						updatedTask,