rimecms 0.26.7 → 0.26.8

package/dist/fields/relation/component/upload/Upload.svelte

@@ -1,140 +1,140 @@
 <script lang="ts">
-	import type { GenericDoc } from '../../../../core/types/doc.js';
-	import Doc from '../../../../panel/components/sections/document/Document.svelte';
-	import Button from '../../../../panel/components/ui/button/button.svelte';
-	import CardResource from '../../../../panel/components/ui/card-resource/card-resource.svelte';
-	import * as Sheet from '../../../../panel/components/ui/sheet/index.js';
-	import { getUserContext } from '../../../../panel/context/user.svelte.js';
-	import { createBlankDocument } from '../../../../util/doc.js';
-	import { Plus } from '@lucide/svelte';
-	import Sortable from 'sortablejs';
-	import { onDestroy } from 'svelte';
-	import type { RelationComponentProps, RelationFieldItem } from '../types.js';
-	import Browse from './Browse.svelte';
-	import './upload.css';
+  import type { GenericDoc } from '../../../../core/types/doc.js';
+  import Doc from '../../../../panel/components/sections/document/Document.svelte';
+  import Button from '../../../../panel/components/ui/button/button.svelte';
+  import CardResource from '../../../../panel/components/ui/card-resource/card-resource.svelte';
+  import * as Sheet from '../../../../panel/components/ui/sheet/index.js';
+  import { getUserContext } from '../../../../panel/context/user.svelte.js';
+  import { createBlankDocument } from '../../../../util/doc.js';
+  import { Plus } from '@lucide/svelte';
+  import Sortable from 'sortablejs';
+  import { onDestroy } from 'svelte';
+  import type { RelationComponentProps, RelationFieldItem } from '../types.js';
+  import Browse from './Browse.svelte';
+  import './upload.css';
 
-	const {
-		isFull,
-		hasError,
-		addValue,
-		many,
-		selectedItems,
-		removeValue,
-		availableItems,
-		relationConfig,
-		onOrderChange,
-		formNestedLevel,
-		onRelationCreation,
-		onRelationCreationCanceled,
-		onRelationCreated,
-		stamp
-	}: Omit<RelationComponentProps, 'readOnly'> = $props();
+  const {
+    isFull,
+    hasError,
+    addValue,
+    many,
+    selectedItems,
+    removeValue,
+    availableItems,
+    relationConfig,
+    onOrderChange,
+    formNestedLevel,
+    onRelationCreation,
+    onRelationCreationCanceled,
+    onRelationCreated,
+    stamp
+  }: Omit<RelationComponentProps, 'readOnly'> = $props();
 
-	const user = getUserContext();
+  const user = getUserContext();
 
-	let open = $state(false);
-	let create = $state(false);
-	let instance: ReturnType<typeof Sortable.create>;
+  let open = $state(false);
+  let create = $state(false);
+  let instance: ReturnType<typeof Sortable.create>;
 
-	const sortableOptions: Sortable.Options = {
-		animation: 150,
+  const sortableOptions: Sortable.Options = {
+    animation: 150,
 
-		// group: new Date().getTime().toString(),
-		onEnd: function (evt) {
-			const { oldIndex, newIndex } = evt;
-			if (oldIndex !== undefined && newIndex !== undefined) {
-				onOrderChange(oldIndex, newIndex);
-			}
-		}
-	};
+    // group: new Date().getTime().toString(),
+    onEnd: function (evt) {
+      const { oldIndex, newIndex } = evt;
+      if (oldIndex !== undefined && newIndex !== undefined) {
+        onOrderChange(oldIndex, newIndex);
+      }
+    }
+  };
 
-	const onNestedDocumentCreated = (doc: GenericDoc) => {
-		create = false;
-		onRelationCreated(doc);
-	};
+  const onNestedDocumentCreated = (doc: GenericDoc) => {
+    create = false;
+    onRelationCreated(doc);
+  };
 
-	$effect(() => {
-		if (many) {
-			const list = document.querySelector(
-				`.rz-relation-upload__list[data-list="${stamp}"]`
-			) as HTMLDivElement;
-			instance = Sortable.create(list, sortableOptions);
-		}
-	});
+  $effect(() => {
+    if (many) {
+      const list = document.querySelector(
+        `.rz-relation-upload__list[data-list="${stamp}"]`
+      ) as HTMLDivElement;
+      instance = Sortable.create(list, sortableOptions);
+    }
+  });
 
-	$effect(() => {
-		if (isFull) {
-			open = false;
-		}
-	});
+  $effect(() => {
+    if (isFull) {
+      open = false;
+    }
+  });
 
-	onDestroy(() => {
-		if (instance) instance.destroy();
-	});
+  onDestroy(() => {
+    if (instance) instance.destroy();
+  });
 </script>
 
 {#snippet card(item: RelationFieldItem)}
-	{@const resource = { ...item, id: item.documentId }}
-	<CardResource {resource} onCloseClick={() => removeValue(item.documentId)} />
+  {@const resource = { ...item, id: item.documentId }}
+  <CardResource {resource} onCloseClick={() => removeValue(item.documentId)} />
 {/snippet}
 
 {#key stamp}
-	<div
-		class="rz-relation-upload__list"
-		data-many={many ? '' : null}
-		data-list={stamp}
-		data-error={hasError ? '' : null}
-	>
-		{#each selectedItems as item (item.documentId)}
-			{@render card(item)}
-		{/each}
-	</div>
+  <div
+    class="rz-relation-upload__list"
+    data-many={many ? '' : null}
+    data-list={stamp}
+    data-error={hasError ? '' : null}
+  >
+    {#each selectedItems as item (item.documentId)}
+      {@render card(item)}
+    {/each}
+  </div>
 {/key}
 
 <div
-	class="rz-relation-upload__actions"
-	class:rz-relation-upload__actions--list-empty={selectedItems.length === 0}
+  class="rz-relation-upload__actions"
+  class:rz-relation-upload__actions--list-empty={selectedItems.length === 0}
 >
-	<Button
-		disabled={isFull || availableItems.length === 0}
-		onclick={() => (open = true)}
-		variant="outline"
-	>
-		Select a {relationConfig.label.singular || relationConfig.slug}
-	</Button>
+  <Button
+    disabled={isFull || availableItems.length === 0}
+    onclick={() => (open = true)}
+    variant="outline"
+  >
+    Select a {relationConfig.label.singular || relationConfig.slug}
+  </Button>
 
-	<Button
-		disabled={isFull ||
-			!(relationConfig.access.create && relationConfig.access.create(user.attributes, {}))}
-		onclick={() => {
-			create = true;
-			onRelationCreation();
-		}}
-		variant="outline"
-	>
-		<Plus size="14" />
-	</Button>
+  <Button
+    disabled={isFull ||
+      !(relationConfig.access.create && relationConfig.access.create(user.attributes, {}))}
+    onclick={() => {
+      create = true;
+      onRelationCreation();
+    }}
+    variant="outline"
+  >
+    <Plus size="14" />
+  </Button>
 </div>
 
 <Browse bind:open {addValue} config={relationConfig} />
 
 <Sheet.Root
-	bind:open={create}
-	onOpenChange={(bool) => {
-		create = bool;
-		if (bool === false) {
-			onRelationCreationCanceled();
-		}
-	}}
+  bind:open={create}
+  onOpenChange={(bool) => {
+    create = bool;
+    if (bool === false) {
+      onRelationCreationCanceled();
+    }
+  }}
 >
-	<Sheet.Content style="--rz-page-gutter:var(--rz-size-6)" showCloseButton={false} side="right">
-		<Doc
-			doc={createBlankDocument(relationConfig)}
-			readOnly={false}
-			onClose={() => (create = false)}
-			operation="create"
-			{onNestedDocumentCreated}
-			nestedLevel={formNestedLevel + 1}
-		/>
-	</Sheet.Content>
+  <Sheet.Content style="--rz-page-gutter:var(--rz-size-6)" showCloseButton={false} side="right">
+    <Doc
+      doc={createBlankDocument(relationConfig)}
+      readOnly={false}
+      onClose={() => (create = false)}
+      operation="create"
+      {onNestedDocumentCreated}
+      nestedLevel={formNestedLevel + 1}
+    />
+  </Sheet.Content>
 </Sheet.Root>

package/dist/fields/relation/component/upload/upload.css

@@ -1,109 +1,109 @@
 .rz-relation-upload__list {
-	container: relation-upload-list / inline-size;
+  container: relation-upload-list / inline-size;
 
-	.rz-card-resource {
-		--rz-thumbnail-size: var(--rz-size-20);
-		--rz-card-padding: var(--rz-size-1);
-		width: calc(var(--rz-thumbnail-size) + 2.5 * var(--rz-card-padding));
+  .rz-card-resource {
+    --rz-thumbnail-size: var(--rz-size-20);
+    --rz-card-padding: var(--rz-size-1);
+    width: calc(var(--rz-thumbnail-size) + 2.5 * var(--rz-card-padding));
 
-		@container relation-upload-list (min-width: 425px) {
-			--rz-thumbnail-size: var(--rz-size-28);
-		}
+    @container relation-upload-list (min-width: 425px) {
+      --rz-thumbnail-size: var(--rz-size-28);
+    }
 
-		.rz-card-resource__info {
-			display: none;
-		}
-		.rz-card-resource__filesize,
-		.rz-card-resource__mimetype {
-			display: none;
-		}
-	}
+    .rz-card-resource__info {
+      display: none;
+    }
+    .rz-card-resource__filesize,
+    .rz-card-resource__mimetype {
+      display: none;
+    }
+  }
 }
 .rz-relation-upload__list[data-many] {
-	display: flex;
-	flex-wrap: wrap;
-	gap: var(--rz-size-4);
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--rz-size-4);
 }
 
 .rz-relation-upload__list:not(.rz-relation-upload__list[data-many]) {
-	@container relation-upload-list (min-width: 285px) {
-		.rz-card-resource {
-			width: min(400px, 100%);
-			.rz-card-resource__info {
-				display: block;
-			}
-		}
-	}
-	@container relation-upload-list (min-width: 425px) {
-		.rz-card-resource__filesize,
-		.rz-card-resource__mimetype {
-			display: block;
-		}
-	}
+  @container relation-upload-list (min-width: 285px) {
+    .rz-card-resource {
+      width: min(400px, 100%);
+      .rz-card-resource__info {
+        display: block;
+      }
+    }
+  }
+  @container relation-upload-list (min-width: 425px) {
+    .rz-card-resource__filesize,
+    .rz-card-resource__mimetype {
+      display: block;
+    }
+  }
 }
 
 .rz-relation-upload__actions {
-	display: flex;
-	margin-top: var(--rz-size-3);
-	:first-child {
-		--rz-button-tr-radius: 0;
-		--rz-button-br-radius: 0;
-		--rz-button-outline-border-right-width: 0;
-	}
-	:last-child {
-		--rz-button-tl-radius: 0;
-		--rz-button-bl-radius: 0;
-	}
+  display: flex;
+  margin-top: var(--rz-size-3);
+  :first-child {
+    --rz-button-tr-radius: 0;
+    --rz-button-br-radius: 0;
+    --rz-button-outline-border-right-width: 0;
+  }
+  :last-child {
+    --rz-button-tl-radius: 0;
+    --rz-button-bl-radius: 0;
+  }
 }
 .rz-relation-upload__actions.rz-relation-upload__actions--list-empty {
-	margin-top: 0;
+  margin-top: 0;
 }
 
 .rz-relation-upload__search {
-	height: var(--rz-size-10);
-	align-items: center;
-	border-top-left-radius: var(--rz-radius-xl);
-	border-top-right-radius: var(--rz-radius-xl);
-	border-bottom-left-radius: 0;
-	border-bottom-right-radius: 0;
+  height: var(--rz-size-10);
+  align-items: center;
+  border-top-left-radius: var(--rz-radius-xl);
+  border-top-right-radius: var(--rz-radius-xl);
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
 }
 
 .rz-relation-upload__command-list {
-	padding: var(--rz-size-2);
+  padding: var(--rz-size-2);
 }
 
 .rz-relation-upload__command-item[aria-selected='true'] {
-	/* background-color: hsl(var(--rz-gray-5)); */
-	background-color: var(--rz-popover-high-light-bg);
+  /* background-color: hsl(var(--rz-gray-5)); */
+  background-color: var(--rz-popover-high-light-bg);
 }
 
 .rz-relation-upload__grid-item {
-	display: flex;
-	gap: var(--rz-size-4);
-	padding-left: var(--rz-size-1);
-	padding-right: var(--rz-size-1);
+  display: flex;
+  gap: var(--rz-size-4);
+  padding-left: var(--rz-size-1);
+  padding-right: var(--rz-size-1);
 }
 
 .rz-relation-upload__grid-thumbnail {
-	width: var(--rz-size-16);
-	height: var(--rz-size-16);
-	overflow: hidden;
-	border-radius: var(--rz-radius-lg);
+  width: var(--rz-size-16);
+  height: var(--rz-size-16);
+  overflow: hidden;
+  border-radius: var(--rz-radius-lg);
 }
 
 .rz-relation-upload__grid-filename {
-	margin-top: var(--rz-size-2);
-	display: -webkit-box;
-	-webkit-line-clamp: 1;
-	-webkit-box-orient: vertical;
-	overflow: hidden;
-	word-break: break-all;
-	text-align: left;
-	font-variation-settings: 'wght' 600;
-	font-weight: 600;
+  margin-top: var(--rz-size-2);
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  word-break: break-all;
+  text-align: left;
+  font-variation-settings: 'wght' 600;
+  font-weight: 600;
 }
 
 .rz-relation-upload__grid-filesize,
 .rz-relation-upload__grid-mimetype {
-	text-align: left;
+  text-align: left;
 }

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

@@ -1,13 +1,13 @@
 <script lang="ts">
-	import { richTextJSONToText } from '../index.js';
+  import { richTextJSONToText } from '../index.js';
 
-	let { value }: { value: string } = $props();
+  let { value }: { value: string } = $props();
 
-	let textValue: string = $derived(richTextJSONToText(value));
+  let textValue: string = $derived(richTextJSONToText(value));
 </script>
 
 {#if textValue && textValue.length > 10}
-	{textValue.substring(0, 20)}...
+  {textValue.substring(0, 20)}...
 {:else if textValue}
-	{textValue}
+  {textValue}
 {/if}

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

@@ -1,110 +1,110 @@
 <script lang="ts">
-	import { Field } from '../../../panel/components/fields/index.js';
-	import { root } from '../../../panel/components/fields/root.svelte.js';
-	import { Editor, type JSONContent } from '@tiptap/core';
-	import { onMount } from 'svelte';
-	import { buildEditorConfig } from '../core/config-builders.js';
-	import type { RichTextFeature } from '../core/types';
-	import { hasSuggestion } from '../util.js';
-	import EditorBubbleMenu from './bubble-menu/bubble-menu.svelte';
-	import { setRichTextContext } from './context.svelte.js';
-	import DragHandler from './drag-handle/drag-handle.svelte';
-	import type { RichTextFieldProps } from './props.js';
-	import './styles/rich-text.css';
-	import Suggestion from './suggestion/suggestion.svelte';
-
-	const { path, config, form, standAlone, class: className }: RichTextFieldProps = $props();
-
-	let element: HTMLElement;
-	const key = $derived(`richtext-${path}`);
-
-	let editor = $state<Editor>();
-	let features = $state<RichTextFeature[]>([]);
-	const field = $derived(form.useField<JSONContent>(path, config));
-
-	$effect(() => {
-		setRichTextContext(path);
-	});
-
-	const withSuggestion = $derived(hasSuggestion(config.features || []));
-
-	onMount(() => {
-		// Build editor configuration
-		const richTextEditorConfig = buildEditorConfig({ features: config.features });
-
-		features = richTextEditorConfig.features;
-		editor = new Editor({
-			...richTextEditorConfig.tiptap,
-			element,
-			editable: field.editable
-		});
-
-		if (field.value?.content) {
-			try {
-				editor.commands.setContent(field.value.content);
-			} catch (err) {
-				editor.commands.setContent('');
-				console.log(err);
-			}
-		}
-
-		// Update field value when editor content changes
-		editor.on('update', ({ editor }) => {
-			field.value = editor.getJSON();
-		});
-	});
+  import { Field } from '../../../panel/components/fields/index.js';
+  import { root } from '../../../panel/components/fields/root.svelte.js';
+  import { Editor, type JSONContent } from '@tiptap/core';
+  import { onMount } from 'svelte';
+  import { buildEditorConfig } from '../core/config-builders.js';
+  import type { RichTextFeature } from '../core/types';
+  import { hasSuggestion } from '../util.js';
+  import EditorBubbleMenu from './bubble-menu/bubble-menu.svelte';
+  import { setRichTextContext } from './context.svelte.js';
+  import DragHandler from './drag-handle/drag-handle.svelte';
+  import type { RichTextFieldProps } from './props.js';
+  import './styles/rich-text.css';
+  import Suggestion from './suggestion/suggestion.svelte';
+
+  const { path, config, form, standAlone, class: className }: RichTextFieldProps = $props();
+
+  let element: HTMLElement;
+  const key = $derived(`richtext-${path}`);
+
+  let editor = $state<Editor>();
+  let features = $state<RichTextFeature[]>([]);
+  const field = $derived(form.useField<JSONContent>(path, config));
+
+  $effect(() => {
+    setRichTextContext(path);
+  });
+
+  const withSuggestion = $derived(hasSuggestion(config.features || []));
+
+  onMount(() => {
+    // Build editor configuration
+    const richTextEditorConfig = buildEditorConfig({ features: config.features });
+
+    features = richTextEditorConfig.features;
+    editor = new Editor({
+      ...richTextEditorConfig.tiptap,
+      element,
+      editable: field.editable
+    });
+
+    if (field.value?.content) {
+      try {
+        editor.commands.setContent(field.value.content);
+      } catch (err) {
+        editor.commands.setContent('');
+        console.log(err);
+      }
+    }
+
+    // Update field value when editor content changes
+    editor.on('update', ({ editor }) => {
+      field.value = editor.getJSON();
+    });
+  });
 </script>
 
 <fieldset
-	class:rz-field-rich-text--standalone={standAlone}
-	class="rz-field-rich-text {config.className || ''}"
-	use:root={field}
+  class:rz-field-rich-text--standalone={standAlone}
+  class="rz-field-rich-text {config.className || ''}"
+  use:root={field}
 >
-	<Field.Label {config} for={path || config.name} />
+  <Field.Label {config} for={path || config.name} />
 
-	<Field.Error error={field.error} />
+  <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 class="rz-rich-text__editor-wrapper">
+    <div
+      bind:this={element}
+      data-error={field.error ? 'true' : null}
+      class="rz-rich-text__editor {className}"
+    ></div>
 
-		{#if editor && editor.isEditable}
-			<DragHandler {editor} />
+    {#if editor && editor.isEditable}
+      <DragHandler {editor} />
 
-			{#if withSuggestion}
-				<Suggestion {editor} {features} />
-			{/if}
+      {#if withSuggestion}
+        <Suggestion {editor} {features} />
+      {/if}
 
-			{#key key}
-				<EditorBubbleMenu {features} {editor} {path} />
-			{/key}
-		{/if}
-	</div>
+      {#key key}
+        <EditorBubbleMenu {features} {editor} {path} />
+      {/key}
+    {/if}
+  </div>
 
-	{#if !standAlone}
-		<Field.Hint {config} />
-	{/if}
+  {#if !standAlone}
+    <Field.Hint {config} />
+  {/if}
 </fieldset>
 
 <style>
-	.rz-rich-text__editor-wrapper {
-		position: relative;
-	}
-
-	.rz-field-rich-text {
-		:global {
-			.ProseMirror-gapcursor:after {
-				border-top: 1px solid hsl(var(--rz-color-fg));
-			}
-		}
-	}
-
-	.rz-field-rich-text__label-box {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-	}
+  .rz-rich-text__editor-wrapper {
+    position: relative;
+  }
+
+  .rz-field-rich-text {
+    :global {
+      .ProseMirror-gapcursor:after {
+        border-top: 1px solid hsl(var(--rz-color-fg));
+      }
+    }
+  }
+
+  .rz-field-rich-text__label-box {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
 </style>