rimecms 0.26.4 → 0.26.6

package/dist/core/collections/versions/operations.d.ts

@@ -82,7 +82,7 @@ type Args = {
  *   config: documentConfig
  * });
  *
- * // Use with helper functions for clearer code
+ * // Use with helper functions for cleaner code
  * if (VersionOperations.isNewVersionCreation(versionOperation)) {
  *   // Handle new version creation logic
  * }

package/dist/core/collections/versions/operations.js

@@ -90,7 +90,7 @@ export const VersionOperations = {
  *   config: documentConfig
  * });
  *
- * // Use with helper functions for clearer code
+ * // Use with helper functions for cleaner code
  * if (VersionOperations.isNewVersionCreation(versionOperation)) {
  *   // Handle new version creation logic
  * }

package/dist/core/config/server/build-config.server.js

@@ -11,8 +11,6 @@ import { augmentPluginsServer } from './augment-plugins.server.js';
 import { augmentStaffServer } from './augment-staff.server.js';
 export const buildConfig = (config) => {
     const augmented = augmentConfig(config);
-    // Versions collection aliases
-    // create {slug}_versions collections
     const output = makeVersionsCollectionsAliases(augmented);
     return createRime(output);
 };

package/dist/core/dev/generate/routes/common.js

@@ -42,8 +42,9 @@ const rootLayout = () => `
 	type Props = { children: Snippet; data: { translations: Dictionaries } };
 
 	const { children, data }: Props = $props();
+	
+	// svelte-ignore state_referenced_locally
 	i18n.init(data.translations);
-
 </script>
 
 <div class="rz-root">
@@ -131,16 +132,18 @@ export const load = authLoads.resetPassword;
 const panelLayout = () => `
 <script>
 	import { Panel } from '${PACKAGE_NAME}/panel/client';
-
 	import config from '${DOLLAR_LIB}/${OUTPUT_DIR}/rime.config.js';
+	
 	const { children, data } = $props();
-
-	const user = data.user;
-	if (!user) throw new Error('unauthorized');
+	
+	const user = $derived.by(() => {
+		if (!data.user) throw new Error('unauthorized');
+		return data.user;
+	});
 </script>
 
 <Panel {config} {user} routes={data.routes} locale={data.locale}>
-    {@render children()}
+	{@render children()}
 </Panel>`;
 /**
  * Panel layout server template

package/dist/core/fields/builders/select.js

@@ -44,10 +44,6 @@ class PickFieldBuilder extends FormFieldBuilder {
         if (!this.field.options || !this.field.options.length) {
             throw new Error(`${this.field.name} should at least have one option`);
         }
-        if (!this.field.defaultValue) {
-            const defaultOption = this.field.options[0].value;
-            this.field.defaultValue = this.field.many ? [defaultOption] : defaultOption;
-        }
         if (!this.field.isEmpty) {
             if (this.field.many) {
                 this.field.isEmpty = (value) => Array.isArray(value) && value.length === 0;

package/dist/core/operations/blocks/extract.server.js

@@ -1,3 +1,4 @@
+import { normalizeFieldPath } from '../../../util/doc.js';
 import { getValueAtPath } from '../../../util/object.js';
 export function extractBlocks({ data, configMap }) {
     const blocks = [];
@@ -10,7 +11,7 @@ export function extractBlocks({ data, configMap }) {
                     if (block.type) {
                         const cleanBlock = {
                             ...block,
-                            path: block.path || path,
+                            path: normalizeFieldPath(block.path || path),
                             position: block.position ?? index
                         };
                         // Remove children blocks

package/dist/fields/blocks/component/Block.svelte

@@ -6,7 +6,6 @@
 	import { useOnce } from '../../../panel/util/once.svelte.js';
 	import { capitalize } from '../../../util/string.js';
 	import { GripVertical, ToyBrick } from '@lucide/svelte';
-	import { watch } from 'runed';
 	import BlockActions from './BlockActions.svelte';
 
 	type Props = {
@@ -20,9 +19,8 @@
 
 	const { config, path, deleteBlock, duplicateBlock, form, sorting = false }: Props = $props();
 
-	let currentPath = $state.raw(path);
 	let isOpen = $state(true);
-	const position = $derived(parseInt(currentPath.split('.').pop() || '0'));
+	const position = $derived(parseInt(path.split('.').pop() || '0'));
 	const blockValue = $derived(form.getValue<GenericBlock>(path));
 
 	const { once } = useOnce();
@@ -58,23 +56,12 @@
 	};
 
 	$effect(() => {
-		if (currentPath !== path) {
-			let pathArr = path.split('.');
-			form.setValue(`${path}.path`, pathArr.toSpliced(pathArr.length - 1, 1).join('.'));
-			currentPath = path;
+		if (blockValue) {
+			localStorage.setItem(`${blockValue.id}:open`, isOpen.toString());
 		}
 	});
 
-	watch(
-		() => isOpen,
-		() => {
-			if (blockValue) {
-				localStorage.setItem(`${blockValue.id}:open`, isOpen.toString());
-			}
-		}
-	);
-
-	const BlockIcon = config.icon || ToyBrick;
+	const BlockIcon = $derived(config.icon || ToyBrick);
 </script>
 
 <div data-sorting={sorting} class="rz-block">
@@ -104,28 +91,33 @@
 	</div>
 </div>
 
-<style>
-	.rz-block {
+<style>/**************************************/
+
+/* Font */
+
+/**************************************/
+
+.rz-block {
 		--rz-fields-padding: var(--rz-size-5);
 		position: relative;
 		border: var(--rz-border);
 		border-radius: var(--rz-radius-sm);
 	}
 
-	.rz-block__grip {
+.rz-block__grip {
 		cursor: grab;
 	}
 
-	.rz-block:hover > :global(.rz-block__content > .rz-block__header > .rz-block-actions) {
+.rz-block:hover > :global(.rz-block__content > .rz-block__header > .rz-block-actions) {
 		opacity: 1;
 		pointer-events: all;
 	}
 
-	.rz-block__content {
+.rz-block__content {
 		background-color: var(--rz-collapse-fields-content-bg);
 	}
 
-	.rz-block__header {
+.rz-block__header {
 		display: flex;
 		position: relative;
 		align-items: center;
@@ -137,14 +129,14 @@
 		background-color: hsl(var(--rz-row-bg));
 	}
 
-	.rz-block__title-button {
+.rz-block__title-button {
 		flex: 1;
 		justify-content: flex-start;
 		flex-direction: row;
 		padding: var(--rz-size-3);
 	}
 
-	.rz-block__content--closed {
+.rz-block__content--closed {
 		border-radius: var(--rz-radius-md);
 		.rz-block__header {
 			border-color: transparent;
@@ -165,7 +157,7 @@
 		}
 	}
 
-	.rz-block__title {
+.rz-block__title {
 		display: flex;
 		height: var(--rz-size-6);
 		align-items: center;
@@ -175,25 +167,25 @@
 		font-size: var(--rz-text-xs);
 	}
 
-	.rz-block__heading {
+.rz-block__heading {
 		font-variation-settings: 'wght' 500;
 		font-weight: 500;
 	}
 
-	.rz-block__fields {
+.rz-block__fields {
 		flex: 1;
 		padding: var(--rz-size-6) 0;
 	}
 
-	.rz-block__fields--hidden {
+.rz-block__fields--hidden {
 		display: none;
 	}
 
-	.rz-block[data-sorting='true'] .rz-block__grip {
+.rz-block[data-sorting='true'] .rz-block__grip {
 		display: none;
 	}
 
-	:global(.rz-block-actions) {
+:global(.rz-block-actions) {
 		position: absolute;
 		opacity: 0;
 		pointer-events: none;

package/dist/fields/blocks/component/Blocks.svelte

@@ -29,6 +29,7 @@
 
 	const locale = getLocaleContext();
 
+	// svelte-ignore state_referenced_locally
 	const sortableOptions: Sortable.Options = {
 		handle: '.rz-block__grip',
 		group: path,
@@ -130,25 +131,30 @@
 	</div>
 </fieldset>
 
-<style>
-	.rz-blocks__title {
+<style>/**************************************/
+
+/* Font */
+
+/**************************************/
+
+.rz-blocks__title {
 		font-variation-settings: 'wght' 500;
 		font-weight: 500;
 	}
 
-	sup {
+sup {
 		font-size: var(--rz-text-2xs);
 		text-transform: uppercase;
 	}
 
-	.rz-blocks__actions {
+.rz-blocks__actions {
 		/* translate: 0 calc(-1 * var(--rz-size-2)); */
 		display: flex;
 		align-items: end;
 		gap: var(--rz-size-2);
 	}
 
-	.rz-blocks__list {
+.rz-blocks__list {
 		display: grid;
 		gap: var(--rz-size-4);
 
@@ -157,12 +163,13 @@
 		}
 	}
 
-	.rz-blocks__header {
+.rz-blocks__header {
 		display: flex;
 		justify-content: space-between;
 		margin-bottom: var(--rz-size-4);
 	}
-	.rz-blocks__actions-bottom {
+
+.rz-blocks__actions-bottom {
 		display: flex;
 		gap: var(--rz-size-3);
 		padding-right: var(--rz-size-3);

package/dist/fields/checkbox/component/Checkbox.svelte

@@ -14,7 +14,7 @@
 	};
 
 	const checkboxErrorClass = $derived(field.error ? 'rz-checkbox--error' : '');
-	const inputId = `${form.key}-${slugify(path)}`;
+	const inputId = $derived(`${form.key}-${slugify(path)}`);
 </script>
 
 <fieldset class="rz-checkbox-field {config.className || ''}" use:root={field}>

package/dist/fields/combobox/component/ComboBox.svelte

@@ -13,7 +13,7 @@
 	const { path, config, form }: ComboBoxProps = $props();
 
 	const field = $derived(form.useField(path, config));
-	const options = config.options;
+	const options = $derived(config.options);
 
 	let search = $state('');
 	let open = $state(false);

package/dist/fields/group/component/Group.svelte

@@ -20,11 +20,13 @@
 	const { config, path, form }: Props = $props();
 
 	let groupOpen = $state(true);
-	const key = `group-${config.fields
-		.map((f) => f.raw)
-		.filter(isFormField)
-		.map((f) => f.name)
-		.join('-')}`;
+	const key = $derived(
+		`group-${config.fields
+			.map((f) => f.raw)
+			.filter(isFormField)
+			.map((f) => f.name)
+			.join('-')}`
+	);
 
 	const field = $derived(form.useField(path));
 
@@ -88,14 +90,19 @@
 	{/if}
 </div>
 
-<style>
-	:root {
+<style>/**************************************/
+
+/* Font */
+
+/**************************************/
+
+:root {
 		--rz-group-trigger-bg: hsl(var(--rz-row-bg));
 		--rz-group-preview-bg: light-dark(hsl(var(--rz-gray-16)), hsl(var(--rz-gray-3)));
 		--rz-group-content-bg: var(--rz-collapse-fields-content-bg);
 	}
 
-	.rz-group-field__wrapper {
+.rz-group-field__wrapper {
 		border: var(--rz-border);
 		border-radius: var(--rz-radius-md);
 		background-color: var(--rz-group-trigger-bg);
@@ -106,18 +113,18 @@
 		}
 	}
 
-	.rz-group-field__wrapper--hidden {
+.rz-group-field__wrapper--hidden {
 		display: none;
 	}
 
-	.rz-group-field__content {
+.rz-group-field__content {
 		--rz-fields-padding: var(--rz-size-5);
 		padding-top: var(--rz-fields-padding);
 		padding-bottom: var(--rz-fields-padding);
 		background-color: var(--rz-group-content-bg);
 	}
 
-	.rz-group-field__trigger {
+.rz-group-field__trigger {
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
@@ -141,7 +148,8 @@
 			rotate: -180deg;
 		}
 	}
-	.rz-group-field__trigger--live {
+
+.rz-group-field__trigger--live {
 		font-size: var(--rz-text-md);
 	}
 </style>

package/dist/fields/link/component/Link.svelte

@@ -32,22 +32,22 @@
 
 	const primitiveTypes = ['url', 'email', 'tel', 'anchor'];
 	const field = $derived(form.useField<Link>(path, config));
-	const linkTypes = config.types || ['url', 'email', 'tel', 'anchor'];
-	const initial = path ? form.getRawValue<Link>(path) : null;
+	const linkTypes = $derived(config.types || ['url', 'email', 'tel', 'anchor']);
+	const initial = $derived(path ? form.getRawValue<Link>(path) : null);
 
-	let initialLinkType = initial?.type || linkTypes[0];
-	let initialLinkValue = initial?.value || '';
-	let initialTargetBlank = (initial?.target && initial.target === '_blank') || false;
+	let initialLinkType = $derived(initial?.type || linkTypes[0]);
+	let initialLinkValue = $derived(initial?.value || '');
+	let initialTargetBlank = $derived((initial?.target && initial.target === '_blank') || false);
 
-	let inputValue = $state(initialLinkValue);
-	let linkType = $state(initialLinkType);
-	let linkValue = $state(initialLinkValue);
-	let targetBlank = $state(initialTargetBlank);
+	let inputValue = $derived(initialLinkValue);
+	let linkType = $derived(initialLinkType);
+	let linkValue = $derived(initialLinkValue);
+	let targetBlank = $derived(initialTargetBlank);
 
 	let isPrimitiveType = $derived(primitiveTypes.includes(linkType));
 	let Icon = $derived(icons[linkType] || Newspaper);
 	let placeholder = $derived(placeholders[linkType] || '');
-	let ressourceId = $state(!primitiveTypes.includes(initialLinkType) ? initialLinkValue : '');
+	let ressourceId = $derived(!primitiveTypes.includes(initialLinkType) ? initialLinkValue : '');
 	const hasTarget = $derived(!['anchor', 'email', 'tel'].includes(linkType));
 
 	let isLinkValueError = $state(false);
@@ -68,6 +68,7 @@
 		}
 	};
 
+	// For ressource links, whenever the ressourceId change, update the field value
 	$effect(() => {
 		if (!isPrimitiveType) {
 			if ((field.value && ressourceId !== field.value.value) || (!field.value && ressourceId)) {
@@ -163,12 +164,13 @@
 			<!-- Target -->
 			{#if hasTarget}
 				<div class="rz-link__target">
-					<Switch checked={targetBlank} onCheckedChange={onTargetChange} id="target" />
-					<Label for="target">{t__('fields.new_tab')}</Label>
+					<Switch checked={targetBlank} onCheckedChange={onTargetChange} id="{path}.target" />
+					<Label for="{path}.target">{t__('fields.new_tab')}</Label>
 				</div>
 			{/if}
 		</div>
 	</div>
+
 	<Field.Hint {config} />
 	<Field.Error error={field.error} />
 </fieldset>

package/dist/fields/link/index.d.ts

@@ -11,7 +11,7 @@ export declare class LinkFieldBuilder extends FormFieldBuilder<LinkField> {
     layout(str: 'compact' | 'default'): this;
     defaultValue(value: Link | DefaultValueFn<Link>): this;
     types(...values: LinkType[]): this;
-    static readonly sanitize: (link: unknown) => unknown;
+    static readonly sanitize: (link: unknown) => Link | undefined;
     compile(): {
         type: "link";
         live?: boolean | undefined;

package/dist/fields/link/index.js

@@ -44,17 +44,17 @@ export class LinkFieldBuilder extends FormFieldBuilder {
     }
     static sanitize = (link) => {
         if (!link)
-            return link;
+            return undefined;
+        // Sanitize only the value and url properties of the link, other properties are left as is
         const isLinkValue = (v) => typeof link === 'object' && !Array.isArray(link) && 'value' in link;
-        if (typeof link === 'string')
-            return sanitize(link);
-        if (isLinkValue(link) && link.value) {
+        if (isLinkValue(link)) {
             return {
                 ...link,
                 url: link.url ? sanitize(link.url) : undefined,
-                value: sanitize(link.value)
+                value: link.value ? sanitize(link.value) : null
             };
         }
+        return undefined;
     };
     compile() {
         if (!this.field.defaultValue) {

package/dist/fields/radio/index.d.ts

@@ -5,6 +5,7 @@ export declare class RadioFieldBuilder extends PickOneFieldBuilder<RadioField> {
     constructor(name: string);
     get component(): import("svelte").Component<import("./component/props.js").RadioFieldProps, {}, "">;
     layout(value: 'default' | 'row'): this;
+    compile(): RadioField;
 }
 export declare const radio: (name: string) => RadioFieldBuilder;
 /****************************************************/

package/dist/fields/radio/index.js

@@ -15,5 +15,13 @@ export class RadioFieldBuilder extends PickOneFieldBuilder {
         this.field.layout = value;
         return this;
     }
+    compile() {
+        super.compile();
+        if (!this.field.defaultValue) {
+            const defaultOption = this.field.options[0].value;
+            this.field.defaultValue = defaultOption;
+        }
+        return this.field;
+    }
 }
 export const radio = (name) => new RadioFieldBuilder(name);

package/dist/fields/relation/component/Relation.svelte

@@ -26,6 +26,7 @@
 	const locale = getLocaleContext();
 	const APIProxy = getAPIProxyContext(API_PROXY.DOCUMENT);
 	const field = $derived(form.useField(path, config));
+	// svelte-ignore state_referenced_locally
 	const relationConfig = getCollection(config.relationTo);
 	const relationCollectionCtx = getCollectionContext(relationConfig.slug);
 
@@ -33,7 +34,7 @@
 	// the fetched items
 	let initialItems: RelationFieldItem[] = $state([]);
 	// value from the form
-	let initialValue = form.getRawValue<Relation[]>(path) || [];
+	let initialValue = $derived(form.getRawValue<Relation[]>(path) || []);
 	// timestamp to force re-render
 	let stamp = $state(new Date().getTime().toString());
 

package/dist/fields/rich-text/component/Cell.svelte

@@ -3,7 +3,7 @@
 
 	let { value }: { value: string } = $props();
 
-	let textValue: string = richTextJSONToText(value);
+	let textValue: string = $derived(richTextJSONToText(value));
 </script>
 
 {#if textValue && textValue.length > 10}

package/dist/fields/rich-text/component/RichText.svelte

@@ -16,13 +16,15 @@
 	const { path, config, form, standAlone, class: className }: RichTextFieldProps = $props();
 
 	let element: HTMLElement;
-	const key = `richtext-${path}`;
+	const key = $derived(`richtext-${path}`);
 
 	let editor = $state<Editor>();
 	let features = $state<RichTextFeature[]>([]);
 	const field = $derived(form.useField<JSONContent>(path, config));
 
-	setRichTextContext(path);
+	$effect(() => {
+		setRichTextContext(path);
+	});
 
 	const withSuggestion = $derived(hasSuggestion(config.features || []));
 
@@ -63,7 +65,11 @@
 	<Field.Error error={field.error} />
 
 	<div class="rz-rich-text__editor-wrapper">
-		<div bind:this={element} data-error={field.error ? 'true' : null} class="rz-rich-text__editor {className}"></div>
+		<div
+			bind:this={element}
+			data-error={field.error ? 'true' : null}
+			class="rz-rich-text__editor {className}"
+		></div>
 
 		{#if editor && editor.isEditable}
 			<DragHandler {editor} />

package/dist/fields/rich-text/component/bubble-menu/bubble-menu.svelte

@@ -60,7 +60,7 @@
 
 	const pluginKey = $derived(path);
 	const updateDelay = 250;
-	const richTextContext = getRichTextContext(path);
+	const richTextContext = $derived(getRichTextContext(path));
 
 	const shouldShow = ({ editor }: { editor: Editor }) => {
 		return (

package/dist/fields/rich-text/core/features/fields/fields.svelte

@@ -23,6 +23,7 @@
 	let isSheetOpen = $state(false);
 
 	setLocaleContext(page.data.locale || 'en');
+	// svelte-ignore state_referenced_locally
 	const form = setFormContext(node.attrs.json || {}, 'fields');
 
 	onMount(() => {

package/dist/fields/rich-text/core/features/link/component/link-selector.svelte

@@ -29,11 +29,13 @@
 	type LinkResource = { title: string; url: string };
 	let { options, editor, context, active }: Props = $props();
 
-	let value = $state((editor && editor.getAttributes('link').href) || '');
+	let value = $derived((editor && editor.getAttributes('link').href) || '');
 	let error = $state(false);
 	let open = $state(false);
 	let resourceDialogOpen = $state(false);
-	let isTargetBlank = $state((editor && editor.getAttributes('link').target === '_blank') || false);
+	let isTargetBlank = $derived(
+		(editor && editor.getAttributes('link').target === '_blank') || false
+	);
 
 	/**
 	 * Logic to get internal resources e.g., collections, areas

package/dist/fields/rich-text/core/features/resource/resource.svelte

@@ -41,9 +41,12 @@
 	// available from inside tiptap rendered components
 	// TODO try to pass it as a prop somehow
 	const APIProxy = setAPIProxyContext(API_PROXY.TIPTAP);
+
+	// svelte-ignore state_referenced_locally
 	const url = extension.options.query
 		? apiUrl(extension.options.slug, extension.options.query)
 		: apiUrl(extension.options.slug);
+
 	const ressource = APIProxy.getRessource<{ docs: GenericDoc[] }>(url);
 	let docs = $state<GenericDoc[]>([]);
 
@@ -129,8 +132,13 @@
 	</Command.List>
 </Command.Dialog>
 
-<style>
-	:global(.ProseMirror-focused .ProseMirror-selectednode .rz-richtext-resource) {
+<style>/**************************************/
+
+/* Font */
+
+/**************************************/
+
+:global(.ProseMirror-focused .ProseMirror-selectednode .rz-richtext-resource) {
 		:global(.rz-card-resource),
 		:global(button.rz-richtext-resource__add) {
 			box-shadow:
@@ -138,7 +146,8 @@
 		0 0 0 calc(var(--rz-ring-offset, 0px) + 1px) hsl(var(--rz-color-spot) / var(--rz-ring-opacity, 1));
 		}
 	}
-	.rz-richtext-resource {
+
+.rz-richtext-resource {
 		position: relative;
 		--rz-border-radius: var(--rz-radius-xl);
 		--rz-ressource-card-thumbnail-bg: light-dark(hsl(var(--rz-gray-15)), hsl(var(--rz-gray-3)));