feat(ui): introduce FieldType.Boolean - WF

This new field is just an alias for `FieldType.Text` but it will
make `useEvaluator` parse the value and accept `"yes"` or `True`
and return the boolean value.

This unlock the usage of boolean value in the state like:

```py
wf.init_state({
  "string": "yes",
  "true": True,
})
```

This is also the first step to introduce a new field setting UX for
boolean value (like a checkbox or something).

src/ui/src/builder/settings/BuilderSettingsProperties.vue

@@ -50,7 +50,10 @@
 					></BuilderFieldsKeyValue>
 
 					<BuilderFieldsText
-						v-if="fieldValue.type == FieldType.Text"
+						v-if="
+							fieldValue.type == FieldType.Text ||
+							fieldValue.type == FieldType.Boolean
+						"
 						:field-key="fieldKey"
 						:component-id="selectedComponent.id"
 					></BuilderFieldsText>

src/ui/src/components/core/content/CoreAnnotatedText.vue

@@ -16,7 +16,7 @@
 				</span>
 			</span>
 		</span>
-		<template v-if="fields.copyButtons.value === 'yes'">
+		<template v-if="fields.copyButtons.value">
 			<SharedControlBar
 				:copy-raw-content="textToString(safeText)"
 				:copy-structured-content="stringifyData(safeText)"
@@ -27,6 +27,7 @@
 
 <script lang="ts">
 import {
+	baseYesNoField,
 	buttonColor,
 	buttonTextColor,
 	cssClasses,
@@ -61,24 +62,16 @@ export default {
 				category: FieldCategory.Style,
 			},
 			rotateHue: {
+				...baseYesNoField,
 				name: "Rotate hue",
 				desc: "If active, rotates the hue depending on the content of the string. If turned off, the reference colour is always used.",
-				type: FieldType.Text,
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 				default: "yes",
 				category: FieldCategory.Style,
 			},
 			copyButtons: {
+				...baseYesNoField,
 				name: "Copy buttons",
 				desc: "If active, adds a control bar with both copy text and JSON buttons.",
-				type: FieldType.Text,
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 				default: "no",
 				category: FieldCategory.Style,
 			},
@@ -161,7 +154,7 @@ function calculateColorStep(s: string, stepsLength = COLOR_STEPS.length) {
 }
 
 function generateColor(s: string) {
-	if (fields.rotateHue.value == "no") {
+	if (!fields.rotateHue.value) {
 		return fields.referenceColor.value;
 	}
 

src/ui/src/components/core/content/CoreChatbot.vue

@@ -13,7 +13,7 @@ See the stubs for more details.
 					v-for="(message, messageId) in messages"
 					:key="messageId"
 					:message="message"
-					:use-markdown="fields.useMarkdown.value == 'yes'"
+					:use-markdown="fields.useMarkdown.value"
 					:assistant-role-color="fields.assistantRoleColor.value"
 					:initials="
 						message.role === 'assistant'
@@ -99,6 +99,7 @@ See the stubs for more details.
 import { FieldCategory, FieldType } from "@/writerTypes";
 import {
 	accentColor,
+	baseYesNoField,
 	buttonColor,
 	buttonTextColor,
 	containerBackgroundColor,
@@ -210,14 +211,10 @@ export default {
 				type: FieldType.Text,
 			},
 			useMarkdown: {
+				...baseYesNoField,
 				name: "Use Markdown",
 				desc: "If active, the output will be sanitized; unsafe elements will be removed.",
 				default: "no",
-				type: FieldType.Text,
-				options: {
-					yes: "Yes",
-					no: "No",
-				},
 			},
 			enableFileUpload: {
 				name: "Enable file upload",

src/ui/src/components/core/content/CoreDataframe.vue

@@ -10,7 +10,7 @@
 				/>
 			</div>
 			<WdsControl
-				v-if="fields.enableDownload.value === 'yes'"
+				v-if="fields.enableDownload.value"
 				title="Download"
 				class="download"
 				@click="download"
@@ -24,7 +24,7 @@
 				:style="gridStyle"
 				:class="{
 					scrolled: rowOffset > 0,
-					wrapText: fields.wrapText.value === 'yes',
+					wrapText: fields.wrapText.value,
 				}"
 			>
 				<div
@@ -119,6 +119,7 @@ import {
 	secondaryTextColor,
 	accentColor,
 	separatorColor,
+	baseYesNoField,
 } from "@/renderer/sharedStyleFields";
 import { onMounted } from "vue";
 import { watch } from "vue";
@@ -193,51 +194,31 @@ export default {
 				default: DEFAULT_DATA_FRAME,
 			},
 			showIndex: {
+				...baseYesNoField,
 				name: "Show index",
 				desc: "Shows the dataframe's index. If an Arrow table is used, shows the zero-based integer index.",
-				type: FieldType.Text,
 				default: "yes",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			enableSearch: {
+				...baseYesNoField,
 				name: "Enable search",
-				type: FieldType.Text,
 				default: "no",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			enableRecordAdd: {
+				...baseYesNoField,
 				name: "Enable adding a record",
-				type: FieldType.Text,
 				default: "no",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			enableRecordUpdate: {
+				...baseYesNoField,
 				name: "Enable updating a record",
-				type: FieldType.Text,
 				default: "no",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			enableDownload: {
+				...baseYesNoField,
 				name: "Enable download",
 				desc: "Allows the user to download the data as CSV.",
-				type: FieldType.Text,
 				default: "no",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			actions: {
 				name: "Actions",
@@ -246,13 +227,9 @@ export default {
 				default: JSON.stringify({ remove: "Remove", open: "Open" }),
 			},
 			useMarkdown: {
+				...baseYesNoField,
 				name: "Use Markdown",
-				type: FieldType.Text,
 				desc: "If active, the output will be sanitized; unsafe elements will be removed.",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 				default: "no",
 			},
 			displayRowCount: {
@@ -263,14 +240,10 @@ export default {
 				default: "10",
 			},
 			wrapText: {
+				...baseYesNoField,
 				name: "Wrap text",
-				type: FieldType.Text,
 				category: FieldCategory.Style,
 				desc: "Not wrapping text allows for an uniform grid, but may be inconvenient if your data contains longer text fields.",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 				default: "no",
 			},
 			primaryTextColor,
@@ -377,15 +350,15 @@ const displayRowCount = computed(() =>
 const hasActions = computed(
 	() => Object.keys(fields.actions.value || {}).length > 0,
 );
-const useMarkdown = computed(() => fields.useMarkdown.value == "yes");
-const enableRecordUpdate = computed(
-	() => fields.enableRecordUpdate.value == "yes",
+const useMarkdown = computed(() => Boolean(fields.useMarkdown.value));
+const enableRecordUpdate = computed(() =>
+	Boolean(fields.enableRecordUpdate.value),
 );
-const enableRecordAdd = computed(() => fields.enableRecordAdd.value == "yes");
+const enableRecordAdd = computed(() => Boolean(fields.enableRecordAdd.value));
 
 const rowOffset = computed(() => {
 	let maxOffset: number;
-	if (fields.wrapText.value == "yes") {
+	if (fields.wrapText.value) {
 		maxOffset = rowCount.value - 1;
 	} else {
 		maxOffset = rowCount.value - displayRowCount.value;

src/ui/src/components/core/content/CoreDataframeLegacy.vue

@@ -1,7 +1,7 @@
 <template>
 	<div ref="rootEl" class="CoreDataframe">
 		<div ref="toolsEl" class="tools">
-			<div v-if="fields.enableSearch.value === 'yes'">
+			<div v-if="fields.enableSearch.value">
 				<WdsTextInput
 					class="search"
 					placeholder="Search"
@@ -10,7 +10,7 @@
 				/>
 			</div>
 			<WdsControl
-				v-if="fields.enableDownload.value === 'yes'"
+				v-if="fields.enableDownload.value"
 				title="Download"
 				class="download"
 				@click="download"
@@ -24,7 +24,7 @@
 				:style="gridStyle"
 				:class="{
 					scrolled: rowOffset > 0,
-					wrapText: fields.wrapText.value === 'yes',
+					wrapText: fields.wrapText.value,
 				}"
 			>
 				<div
@@ -89,7 +89,7 @@
 						class="cell"
 					>
 						<BaseMarkdown
-							v-if="fields.useMarkdown.value == 'yes'"
+							v-if="fields.useMarkdown.value"
 							:raw-text="row[columnName]"
 						>
 						</BaseMarkdown>
@@ -112,6 +112,7 @@
 import { Ref, computed, inject, ref } from "vue";
 import { FieldCategory, FieldType } from "@/writerTypes";
 import {
+	baseYesNoField,
 	cssClasses,
 	primaryTextColor,
 	secondaryTextColor,
@@ -144,42 +145,26 @@ export default {
 				default: defaultDataframe,
 			},
 			showIndex: {
+				...baseYesNoField,
 				name: "Show index",
 				desc: "Shows the dataframe's index. If an Arrow table is used, shows the zero-based integer index.",
-				type: FieldType.Text,
 				default: "yes",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			enableSearch: {
+				...baseYesNoField,
 				name: "Enable search",
-				type: FieldType.Text,
 				default: "no",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			enableDownload: {
+				...baseYesNoField,
 				name: "Enable download",
 				desc: "Allows the user to download the data as CSV.",
-				type: FieldType.Text,
 				default: "no",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 			},
 			useMarkdown: {
+				...baseYesNoField,
 				name: "Use Markdown",
-				type: FieldType.Text,
 				desc: "If active, the output will be sanitized; unsafe elements will be removed.",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 				default: "no",
 			},
 			displayRowCount: {
@@ -190,14 +175,10 @@ export default {
 				default: "10",
 			},
 			wrapText: {
+				...baseYesNoField,
 				name: "Wrap text",
-				type: FieldType.Text,
 				category: FieldCategory.Style,
 				desc: "Not wrapping text allows for an uniform grid, but may be inconvenient if your data contains longer text fields.",
-				options: {
-					yes: "yes",
-					no: "no",
-				},
 				default: "no",
 			},
 			primaryTextColor,
@@ -252,7 +233,7 @@ const gridContainerEl: Ref<HTMLElement> = ref();
 let baseTable: aq.internal.ColumnTable = null;
 const table: Ref<aq.internal.ColumnTable> = ref(null);
 const tableIndex = ref([]);
-const isIndexShown = computed(() => fields.showIndex.value == "yes");
+const isIndexShown = computed(() => fields.showIndex.value);
 const orderSetting: Ref<OrderSetting> = ref(null);
 const relativePosition: Ref<number> = ref(0);
 const columnWidths: Ref<number[]> = ref([]);
@@ -286,7 +267,7 @@ const displayRowCount = computed(() =>
 );
 const rowOffset = computed(() => {
 	let maxOffset: number;
-	if (fields.wrapText.value == "yes") {
+	if (fields.wrapText.value) {
 		maxOffset = rowCount.value - 1;
 	} else {
 		maxOffset = rowCount.value - displayRowCount.value;