@sealcode/sealgen 0.18.10 → 0.19.0

package/src/add-crud.ts

@@ -1,19 +1,16 @@
 import _locreq from "locreq";
-import prompts from "prompts";
-
 import { escape_url_params } from "./utils/escape-url-params.js";
+import prompts from "prompts";
 import { toKebabCase, toPascalCase } from "js-convert-case";
 import { listCollections } from "./utils/list-collections.js";
-import {
-	makeDefaultDisplayFields,
-	makeDefaultFilterFields,
-} from "./templates/shared/collection-list.js";
+import { collectionListTemplate } from "./templates/shared/collection-list.js";
 import { writeFile } from "./utils/write-file.js";
-import { extractCollectionClassname } from "./generate-collections.js";
-import extract_fields_from_collection from "./utils/extract-fields-from-collection.js";
-import { getFieldHandler } from "./templates/shared/shared-crud-form-fields.js";
+import { curryImportPath, importPath } from "./utils/import-path.js";
+import { sharedCrudFormFields } from "./templates/shared/shared-crud-form-fields.js";
 import { generateRoutes } from "./generate-routes.js";
-import { formatWithPrettier } from "./utils/prettier.js";
+import { createItemFormTemplate } from "./templates/shared/collection-create-form.js";
+import { editItemFormTemplate } from "./templates/shared/collection-edit-form.js";
+import { itemDeleteTemplate } from "./templates/shared/item-delete.js";
 
 export async function addCRUD(
 	params: Partial<{ [key in "collection" | "url"]: string }>,
@@ -38,7 +35,7 @@ export async function addCRUD(
 			type: "text",
 			name: "url",
 			message:
-				"Enter a full absolute path for the new route (for example: /admin/users/): ",
+				"Enter a full absolute path for the new route (for example: /admin/users/:id/edit): ",
 			validate: (s: string) =>
 				s.trim()[0] == "/" ? true : "Should start with a '/'",
 			initial: function (_, { collection }: { collection: string }) {
@@ -46,103 +43,95 @@ export async function addCRUD(
 			},
 		},
 	]);
-
 	const collection_name = response.collection as string;
 	const url = response.url as string;
+	const list_action_name = toPascalCase(collection_name) + "CRUDList";
+	const create_action_name = toPascalCase(collection_name) + "CRUDCreate";
+	const edit_action_name = toPascalCase(collection_name) + "CRUDEdit";
+	const delete_action_name = toPascalCase(collection_name) + "CRUDDelete";
 
 	/* create the list endpoint */
 	const list_path = target_locreq.resolve(
-		`src/back/routes/${escape_url_params(url)}/index.page.ts`
+		`src/back/routes/${escape_url_params(url)}/index.list.tsx`
 	);
-	const [uppercase_collection, collection_fields] = await Promise.all([
-		extractCollectionClassname(
-			target_locreq.resolve(
-				"src/back/collections/" + collection_name + ".ts"
-			)
-		),
-		extract_fields_from_collection(collection_name),
-	]);
-
-	const field_handler_results = await Promise.all(
-		collection_fields.map(async (field) => {
-			return getFieldHandler(
-				collection_name,
-				field,
-				(p) => p,
-				"edit_fields"
-			);
-		})
+	const list_content = await collectionListTemplate(
+		collection_name,
+		list_action_name,
+		list_path,
+		{
+			post_import_js: `import { ${create_action_name}URL, ${edit_action_name}URL, ${delete_action_name}URL } from "${importPath(
+				list_path,
+				"src/back/routes/urls.ts"
+			)}";`,
+			post_header_html: `<a href={${create_action_name}URL}> Create </a>`,
+			render_item: (
+				collection_name: string
+			) => `	async renderItem(ctx: Context, item: CollectionItem<typeof ${toPascalCase(
+				collection_name
+			)}>) {
+					   return <tr>
+						   {displayFields.map(({ field, format }) => {
+							   // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/consistent-type-assertions, @typescript-eslint/no-explicit-any
+							   const value = item.get(field as any);
+							   return <td>{format ? format(value, item) : value}</td>;
+						   })}
+                           <td><div class="sealious-list__actions">
+                               <a href={${edit_action_name}URL(item.id)}>Edit</a>
+                               <a data-turbo-method="POST" data-turbo-confirm="Delete item?" href={${delete_action_name}URL(item.id)}>Delete</a>
+                               </div>
+                           </td>
+					   </tr>;
+				   }`,
+		}
 	);
+	await writeFile(list_path, list_content);
 
-	const list_content = `import { CRUD } from "@sealcode/crud-ui";
-import type { CollectionItem } from "sealious";
-import type { ListFilterRender } from "@sealcode/sealgen";
-import { Controls, DefaultListFilters, Fields } from "@sealcode/sealgen";
-import { ${toPascalCase(
-		collection_name
-	)} } from "src/back/collections/collections.js";
-import html from "src/back/html.js";
-
-export const actionName = "${toPascalCase(collection_name)}CRUD";
-
-const edit_fields = <const>
-{
-	${field_handler_results
-		.filter(({ hide_field }) => !hide_field)
-		.map(({ field }) => field)
-		.filter((e) => e != "")
-		.join(",\n")}
-};
-
-
-const edit_controls = [
-	${field_handler_results
-		.filter(({ hide_control }) => !hide_control)
-		.map(({ controls }) => controls)
-		.filter((e) => e != "")
-		.join(",\n")}
-]
+	/* create the shared fields file */
+	const fields_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/shared.ts`
+	);
+	const fields_content = await sharedCrudFormFields(
+		collection_name,
+		fields_path
+	);
+	await writeFile(fields_path, fields_content);
 
-// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-const fields_for_display = [
-${makeDefaultDisplayFields(collection_fields)}
-] as {
-	field: keyof (typeof ${toPascalCase(collection_name)})["fields"];
-	label: string;
-	format?: (value: unknown, item: CollectionItem<typeof ${toPascalCase(
-		collection_name
-	)}>) => string | Promise<string>;
-}[];
+	/* create the create endpoint */
+	const create_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/create.form.ts`
+	);
+	const create_content = await createItemFormTemplate(
+		create_action_name,
+		create_path,
+		collection_name,
+		list_action_name
+	);
+	await writeFile(create_path, create_content);
 
-// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-const fields_for_filters = [
-     ${makeDefaultFilterFields(collection_fields)}
-] as {
-	field: keyof (typeof ${uppercase_collection})["fields"];
-	render?: ListFilterRender;
-	prepareValue?: (filter_value: unknown)=>unknown; // set this function to change what filter value is passed to Sealious
-}[];
+	/* create the edit endpoint */
+	const edit_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/[id]/edit.form.ts`
+	);
+	const edit_content = await editItemFormTemplate(
+		edit_action_name,
+		edit_path,
+		collection_name,
+		list_action_name
+	);
+	await writeFile(edit_path, edit_content);
 
-export default new CRUD({
-	collection: ${toPascalCase(collection_name)},
-	nice_collection_name: "${toPascalCase(collection_name)}",
-	fields_for_display,
-	fields_for_filters,
-	html,
-	list_title: "${toPascalCase(collection_name)} list",
-	edit_title: "Edit",
-	edit_button_text: "Edit",
-	delete_button_text: "Delete",
-	back_to_list_button_text: "← Back to ${toPascalCase(collection_name)} list",
-	edit_fields,
-	edit_controls,
-	form_value_to_sealious_value: {},
-	sealious_value_to_form_value: {},
-	post_edit: async () => {},
-	post_create: async () => {},
-});
-`;
-	await writeFile(list_path, await formatWithPrettier(list_content));
+	/* create the actual delete endpoint */
+	const delete_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/[id]/delete.page.tsx`
+	);
+	const base_import_path = curryImportPath(delete_path);
+	const delete_content = await itemDeleteTemplate(
+		delete_action_name,
+		collection_name,
+		list_action_name,
+		base_import_path
+	);
+	await writeFile(delete_path, delete_content);
 
 	await generateRoutes();
 }

package/src/add-list-route.test.ts

@@ -4,7 +4,7 @@ import { RealAppTest } from "./test_utils/test-on-real-app.js";
 import { collectionTemplate } from "./templates/collection.js";
 import assert from "node:assert";
 
-describe("single-reference.test", () => {
+describe("single-reference", () => {
 	let page: Page;
 	before(async () => {
 		const browser = await getBrowser();

package/src/add-route.ts

@@ -2,7 +2,6 @@ import { existsSync, promises as fs } from "fs";
 import _locreq from "locreq";
 import { resolve } from "path";
 import { generateRoutes } from "./generate-routes.js";
-import { testTemplate } from "./templates/route-test.js";
 import { escape_url_params } from "./utils/escape-url-params.js";
 import prompts from "prompts";
 import { Templates } from "./templates/templates.js";
@@ -81,12 +80,6 @@ export async function addRoute(
 	}
 	await fs.mkdir(resolve(file_path, "../"), { recursive: true });
 	await fs.writeFile(file_path, await template(action, file_path));
-	if (mode !== "lpr" && mode !== "jdd-editor") {
-		await fs.writeFile(
-			test_file_path,
-			await testTemplate(action, file_path)
-		);
-	}
 	// eslint-disable-next-line no-console
 	console.log(`${file_path} created`);
 	// eslint-disable-next-line no-console

package/src/build.ts

@@ -94,7 +94,9 @@ async function build(watch: boolean): Promise<void> {
 	];
 	await Promise.all(builders.map((b) => b.build()));
 	if (watch) {
-		const watcher = chokidar.watch("src", { ignoreInitial: true });
+		const watcher = chokidar.watch(["src", ...controller_dirs], {
+			ignoreInitial: true,
+		});
 		const port = await get_notifier_port();
 		const notifier = make_notifier(port, 8080); // TODO: parse the app config to get the actual port
 		await write_notifier_config(watch, port);

package/src/cli.ts

@@ -1,17 +1,16 @@
 #!/usr/bin/env node
 import yargs from "yargs/yargs";
 import { addCollection } from "./add-collection.js";
-import { addCRUD } from "./add-crud.js";
 import { addJDDComponent } from "./add-jdd-component.js";
 import { addRoute } from "./add-route.js";
-import { addVerboseCRUD } from "./add-verbose-crud.js";
+import { addCRUD } from "./add-crud.js";
 import { buildProject } from "./build.js";
 import { generateCollections } from "./generate-collections.js";
 import { generateComponents } from "./generate-components.js";
 import { generateRoutes } from "./generate-routes.js";
 import { getFonts } from "./get-fonts.js";
 import { makeEnv } from "./make-env.js";
-import { crudFieldSnippets } from "./crud-field-snippets.js";
+
 import {
 	registerExternalControllers,
 	registerExternalStyles,
@@ -23,7 +22,6 @@ const actions: Record<
 > = {
 	"add-collection": addCollection,
 	"add-route": addRoute,
-	"add-verbose-crud": addVerboseCRUD,
 	"add-crud": addCRUD,
 	"generate-collections": generateCollections,
 	"generate-components": generateComponents,
@@ -40,7 +38,7 @@ const actions: Record<
 	"make-env": makeEnv,
 	"add-component": addJDDComponent,
 	"get-fonts": getFonts,
-	"crud-field-snippets": crudFieldSnippets,
+	// "crud-field-snippets": crudFieldSnippets,
 	"register-external-controllers": registerExternalControllers,
 	"register-external-styles": registerExternalStyles,
 };

package/src/controllers/table-add-button.stimulus.ts

@@ -0,0 +1,35 @@
+/// <reference lib="dom" />
+import { Controller } from "stimulus";
+
+export default class extends Controller {
+	static targets = ["textarea"];
+	defaultRowsNumber = 20;
+
+	addRow() {
+		const template = this.element
+			.closest("turbo-frame")
+			?.querySelector("template");
+		if (!template) {
+			throw new Error("Couldn't find template");
+		}
+		const tbody = this.element
+			.closest("turbo-frame")
+			?.querySelector("tbody");
+		if (!tbody) {
+			throw new Error("tbody not found");
+		}
+
+		const orig_template = template.innerHTML;
+		const placeholder = this.element.getAttribute("data-table-placeholder");
+		if (!placeholder) {
+			throw new Error("Could find placeholder attribute");
+		}
+		template.innerHTML = orig_template.replaceAll(
+			placeholder,
+			String(tbody.querySelectorAll("tr").length)
+		);
+		// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+		tbody.appendChild((template.cloneNode(true) as any).content);
+		template.innerHTML = orig_template;
+	}
+}

package/src/forms/controls/array.ts

@@ -6,8 +6,8 @@ import qs from "qs";
 import { Field, FieldsetOutput } from "sealious";
 import { tempstream } from "tempstream";
 import { FormField } from "../fields/field.js";
-import { SimpleFormField } from "../fields/simple-form-field.js";
-import { StructuredArrayField } from "../fields/structured-array.js";
+import { TextBasedSimpleField } from "../fields/simple-form-field.js";
+import { StructuredArray as StructuredArrayField } from "../fields/structured-array.js";
 import { FormDataValue } from "../form-types.js";
 import { Derived } from "./derived.js";
 import { FormControl, FormControlContext } from "./form-control.js";
@@ -58,7 +58,7 @@ export class StructuredArray<
 	}
 
 	makeSubfield(_field_name: string): FormField {
-		return new SimpleFormField(false);
+		return new TextBasedSimpleField(false);
 	}
 
 	async renderItemControl(
@@ -70,12 +70,12 @@ export class StructuredArray<
 	) {
 		const fctx = {
 			ctx,
-			data: {},
+			data: { raw_values: {}, messages: [], field_messages: {} },
 			messages: [],
 			field_name_prefix: "",
 			form_id,
 			validate: false,
-		};
+		} as FormControlContext;
 		if (Array.isArray(control)) {
 			// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
 			const [constructor, field_name, params] = control;
@@ -86,9 +86,7 @@ export class StructuredArray<
 				);
 				return "";
 			}
-			await field.init(
-				`${this.field.name}[data][${index}][${field_name}]`
-			);
+			field.setName(`${this.field.name}[data][${index}][${field_name}]`);
 			const hidden_shadow = new Derived(
 				[field],
 				async (
@@ -107,10 +105,22 @@ export class StructuredArray<
 			);
 			return tempstream`${new constructor(field, params).render({
 				...fctx,
-				data: { [field.name]: item[field_name] as FormDataValue },
+				data: {
+					raw_values: {
+						[field.name]: item[field_name] as FormDataValue,
+					},
+					messages: [],
+					field_messages: {},
+				},
 			})}${hidden_shadow.render({
 				...fctx,
-				data: { [field.name]: item[field_name] as FormDataValue },
+				data: {
+					raw_values: {
+						[field.name]: item[field_name] as FormDataValue,
+					},
+					messages: [],
+					field_messages: {},
+				},
 				form_id: this.getInnerFormID(),
 			})}`;
 		} else {
@@ -140,9 +150,8 @@ export class StructuredArray<
 	}
 
 	async getItems(ctx: Context, raw_values: Record<string, FormDataValue>) {
-		return (await this.field.getValue(ctx, raw_values)).parsed as Promise<
-			FieldsetOutput<Subfields>[]
-		>;
+		return (await this.field.getParsedValue(ctx, raw_values))
+			.parsed as FieldsetOutput<Subfields>[];
 	}
 
 	async _render(
@@ -170,7 +179,7 @@ export class StructuredArray<
 	}
 
 	render(fctx: FormControlContext) {
-		return this._render(fctx.ctx, fctx.form_id, fctx.data);
+		return this._render(fctx.ctx, fctx.form_id, fctx.data.raw_values);
 	}
 
 	async getTargetItemID(ctx: Context): Promise<string> {
@@ -179,7 +188,6 @@ export class StructuredArray<
 	}
 
 	mount(router: Router) {
-		console.log("mounting!", this.getActionURL());
 		router.post(this.getActionURL(), async (ctx) => {
 			const form_id = ctx.query.form_id;
 			if (typeof form_id != "string") {
@@ -198,7 +206,6 @@ export class StructuredArray<
 			const field_data = (ctx.$body as Record<string, unknown>)[
 				this.field.name
 			] || { data: [] };
-			console.log({ action: field_data });
 			if (
 				!hasShape(
 					{
@@ -215,10 +222,6 @@ export class StructuredArray<
 				...ctx.$body.action,
 				data: field_data.data || [],
 			});
-			console.log("ACTION", {
-				...ctx.$body.action,
-				data: field_data.data || [],
-			});
 			await item.save(ctx.$context);
 			console.log(await item.getDecodedBody(ctx.$context, {}));
 			ctx.body = this._render(

package/src/forms/controls/autocomplete.ts

@@ -4,7 +4,7 @@ import { PickFromListField } from "../fields/pick-from-list.js";
 import { FormControlContext } from "./form-control.js";
 import { SimpleInput } from "./simple-input.js";
 
-export class Autocomplete extends SimpleInput<string | null> {
+export class Autocomplete extends SimpleInput {
 	constructor(
 		public field: PickFromListField<boolean>,
 		public options: { id?: string; label?: string; placeholder?: string }

package/src/forms/controls/big-radio-group.ts

@@ -19,9 +19,9 @@ export class BigRadioGroup extends FormFieldControl {
 	}
 
 	async render(fctx: FormControlContext): Promise<FlatTemplatable> {
-		const { raw: current_value } = await this.field.getValue(
+		const { raw: current_value } = await this.field.getParsedValue(
 			fctx.ctx,
-			fctx.data
+			fctx.data.raw_values
 		);
 		return tempstream/* HTML */ `<div class="bigradios">
 			${Object.entries(this.options).map(([key, { description }]) => {

package/src/forms/controls/checkbox-group.ts

@@ -1,10 +1,10 @@
 import { FlatTemplatable } from "tempstream";
-import { EnumMultipleField } from "../fields/enum-multiple.js";
 import { ProxyFormField } from "../fields/proxy-field.js";
 import { CheckboxWithValue } from "./checkbox.js";
 import { FieldGroup } from "./field-group.js";
 import { FormControlContext } from "./form-control.js";
 import { FormFieldControl } from "./form-field-control.js";
+import { CheckboxedListField } from "../fields/checkboxed-list.js";
 
 export type DefaultCheckboxOptions = {
 	id?: string;
@@ -20,7 +20,7 @@ export class CheckboxGroup<
 	Options extends DefaultCheckboxOptions = DefaultCheckboxOptions
 > extends FormFieldControl {
 	constructor(
-		public field: EnumMultipleField<readonly string[], boolean>,
+		public field: CheckboxedListField<boolean, string>,
 		public options: Options = {} as Options
 	) {
 		super([field]);
@@ -40,28 +40,28 @@ export class CheckboxGroup<
 	}
 
 	async render(fctx: FormControlContext): Promise<FlatTemplatable> {
-		const { parsed: values } = await this.field.getValue(
+		const { parsed: values } = await this.field.getParsedValue(
 			fctx.ctx,
-			fctx.data
+			fctx.data.raw_values
 		);
-		const checkboxes = this.field.options.map(
+		const checkboxes = (await this.field.generateOptions(fctx.ctx)).map(
 			(option) =>
 				new CheckboxWithValue(
 					new ProxyFormField(
 						false,
 						this.field.name,
 						false,
-						(values || []).includes(option)
+						Object.keys(values || {}).includes(option.value)
 					),
 					{
-						id: this.field.name + "__" + option,
+						id: this.field.name + "__" + option.value,
 						label: (
 							this.options.checkboxNameToLabel ||
 							((s: string) => s)
-						)(option),
+						)(option.value),
 						default_value: false,
 					},
-					option
+					option.value
 				)
 		);
 		return this.wrapGroup(fctx, checkboxes);

package/src/forms/controls/checkboxed-list-input.ts

@@ -7,9 +7,11 @@ import {
 import { FormControlContext } from "./form-control.js";
 import { FormFieldControl } from "./form-field-control.js";
 
-export class CheckboxedListInput extends FormFieldControl {
+export class CheckboxedListInput<
+	Values extends string
+> extends FormFieldControl {
 	constructor(
-		public field: CheckboxedListField<boolean>,
+		public field: CheckboxedListField<boolean, Values>,
 		public options: { label: string } = { label: field.name }
 	) {
 		super([field]);
@@ -30,7 +32,11 @@ export class CheckboxedListInput extends FormFieldControl {
 			valid,
 			message,
 			parsed: currentValue,
-		} = await this.field.getValue(fctx.ctx, fctx.data, true);
+		} = await this.field.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values,
+			true
+		);
 		const pickedValues = Object.entries(currentValue || {})
 			.filter(([, is_on]) => is_on)
 			.map(([key]) => key);
@@ -48,6 +54,7 @@ export class CheckboxedListInput extends FormFieldControl {
 				if (!groups[option.group]) {
 					groups[option.group] = [];
 				}
+				// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
 				groups[option.group]!.push(option);
 			}
 		}
@@ -73,18 +80,22 @@ export class CheckboxedListInput extends FormFieldControl {
 									tempstream/* HTML */ ` <h3>
 											${group_label}
 										</h3>
-										${options!.map(({ value, label }) =>
-											this.renderOption({
-												name,
-												value,
-												label,
-												form_id: fctx.form_id,
-												checked:
-													pickedValues.includes(
-														value
-													),
-											})
-										)}`
+
+										${
+											// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+											options!.map(({ value, label }) =>
+												this.renderOption({
+													name,
+													value,
+													label,
+													form_id: fctx.form_id,
+													checked:
+														pickedValues.includes(
+															value
+														),
+												})
+											)
+										}`
 						  )
 						: ""}
 					${isVisible
@@ -126,6 +137,7 @@ export class CheckboxedListInput extends FormFieldControl {
 						name="${name}.${value}"
 						${checked ? "checked" : ""}
 						form=${form_id}
+						autocomplete="off"
 					/>
 					<label for="${name}.${value}">${label || value}</label>
 				`

package/src/forms/controls/controls.ts

@@ -23,10 +23,10 @@ export * from "./collapsible-field-group.js";
 export * from "./collapsible-checkbox-group.js";
 export * from "./autocomplete.js";
 export * from "./file.js";
-export * from "./photo.js";
+export * from "./image.js";
 export * from "./multiple-files.js";
 export * from "./number.js";
-export * from "./multiple-photos.js";
+export * from "./multiple-images.js";
 // export * from "./reverse-single-reference";
 export * from "./array.js";
 export * from "./table.js";

package/src/forms/controls/derived-frame.ts

@@ -76,7 +76,11 @@ export class DerivedFrame extends Derived<{
 				await this.generateFrameContent(
 					new FormControlContext(
 						ctx,
-						ctx.query,
+						{
+							messages: [],
+							field_messages: {},
+							raw_values: ctx.query,
+						},
 						[],
 						query.field_name_prefix,
 						query.form_id,

package/src/forms/controls/derived.ts

@@ -27,7 +27,7 @@ export class Derived<
 	): Promise<Record<string, FormDataValue>> {
 		const fieldnames = this.fields.map((f) => f.name);
 		const result = Object.fromEntries(
-			Object.entries(fctx.data).filter(([key]) =>
+			Object.entries(fctx.data.raw_values).filter(([key]) =>
 				fieldnames.includes(key)
 			)
 		);

package/src/forms/controls/dropdown.ts

@@ -15,7 +15,7 @@ export type DropdownOptions = {
 
 export type DropdownOption = { value: string; label: string };
 
-export class FreeformDropdown extends SimpleInput<string | null> {
+export class FreeformDropdown extends SimpleInput {
 	constructor(
 		public field: FormField<boolean, string | null>,
 		public _generateOptions: (ctx: Context) => Promise<DropdownOption[]>,
@@ -57,7 +57,10 @@ export class FreeformDropdown extends SimpleInput<string | null> {
 		attributes_str: string,
 		data: Record<string, FormDataValue>
 	): Promise<FlatTemplatable> {
-		const { parsed: picked_value } = await this.field.getValue(ctx, data);
+		const { parsed: picked_value } = await this.field.getParsedValue(
+			ctx,
+			data
+		);
 		return /* HTML */ tempstream`<select ${attributes_str}>
 			${
 				// eslint-disable-next-line @typescript-eslint/restrict-template-expressions