rimecms 0.26.7 → 0.26.8

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

@@ -1,107 +1,111 @@
 <script module lang="ts">
-	import type { RichTextFeatureNode } from '../../../core/types.js';
-	export type NodeSelectorItem = RichTextFeatureNode & { name: string; options?: any };
+  import type { RichTextFeatureNode } from '../../../core/types.js';
+  export type NodeSelectorItem = RichTextFeatureNode & { name: string; options?: any };
 </script>
 
 <script lang="ts">
-	import Button from '../../../../../panel/components/ui/button/button.svelte';
-	import * as Popover from '../../../../../panel/components/ui/popover/index.js';
-	import { Asterisk, Check, ChevronDown } from '@lucide/svelte';
-	import type { Editor } from '@tiptap/core';
-	import { onDestroy, onMount } from 'svelte';
-	import './node-selector.css';
+  import Button from '../../../../../panel/components/ui/button/button.svelte';
+  import * as Popover from '../../../../../panel/components/ui/popover/index.js';
+  import { Asterisk, Check, ChevronDown } from '@lucide/svelte';
+  import type { Editor } from '@tiptap/core';
+  import { onDestroy, onMount } from 'svelte';
+  import './node-selector.css';
 
-	type Props = { editor: Editor; isMenuOpen: boolean; items: NodeSelectorItem[] };
-	let { editor, items, isMenuOpen }: Props = $props();
+  type Props = { editor: Editor; isMenuOpen: boolean; items: NodeSelectorItem[] };
+  let { editor, items, isMenuOpen }: Props = $props();
 
-	let open = $state(false);
+  let open = $state(false);
 
-	let activeItems = $state<Record<string, boolean>>({});
-	const activeItem = $derived.by(getActiveItem);
+  let activeItems = $state<Record<string, boolean>>({});
+  const activeItem = $derived.by(getActiveItem);
 
-	function getActiveItem() {
-		// Count active items
-		const activeCount = Object.values(activeItems).filter(Boolean).length;
-		if (activeCount === 1) {
-			// Find the active item name
-			const activeItemName = Object.keys(activeItems).find((name) => activeItems[name]);
-			// Return the matching item or default to paragraph
-			return (
-				items.find((item) => item.name === activeItemName) || { name: 'paragraph', label: 'Paragraph', icon: Asterisk }
-			);
-		} else if (activeCount > 1) {
-			return { name: 'multiple', label: 'Multiple', icon: Asterisk };
-		} else {
-			// Default to paragraph when nothing is active
-			return { name: 'paragraph', label: 'Paragraph', icon: Asterisk };
-		}
-	}
+  function getActiveItem() {
+    // Count active items
+    const activeCount = Object.values(activeItems).filter(Boolean).length;
+    if (activeCount === 1) {
+      // Find the active item name
+      const activeItemName = Object.keys(activeItems).find((name) => activeItems[name]);
+      // Return the matching item or default to paragraph
+      return (
+        items.find((item) => item.name === activeItemName) || {
+          name: 'paragraph',
+          label: 'Paragraph',
+          icon: Asterisk
+        }
+      );
+    } else if (activeCount > 1) {
+      return { name: 'multiple', label: 'Multiple', icon: Asterisk };
+    } else {
+      // Default to paragraph when nothing is active
+      return { name: 'paragraph', label: 'Paragraph', icon: Asterisk };
+    }
+  }
 
-	function setActiveItems() {
-		// Update active states for all items
-		activeItems = items.reduce(
-			(acc, item) => {
-				acc[item.name] = item.isActive?.({ editor }) || false;
-				return acc;
-			},
-			{} as Record<string, boolean>
-		);
-	}
+  function setActiveItems() {
+    // Update active states for all items
+    activeItems = items.reduce(
+      (acc, item) => {
+        acc[item.name] = item.isActive?.({ editor }) || false;
+        return acc;
+      },
+      {} as Record<string, boolean>
+    );
+  }
 
-	onMount(() => {
-		editor.on('update', setActiveItems);
-		editor.on('selectionUpdate', setActiveItems);
-		setActiveItems();
-	});
+  onMount(() => {
+    editor.on('update', setActiveItems);
+    editor.on('selectionUpdate', setActiveItems);
+    setActiveItems();
+  });
 
-	onDestroy(() => {
-		editor.off('update', setActiveItems);
-		editor.off('selectionUpdate', setActiveItems);
-	});
+  onDestroy(() => {
+    editor.off('update', setActiveItems);
+    editor.off('selectionUpdate', setActiveItems);
+  });
 
-	$effect(() => {
-		if (!isMenuOpen) {
-			open = false;
-		}
-	});
+  $effect(() => {
+    if (!isMenuOpen) {
+      open = false;
+    }
+  });
 </script>
 
 <Popover.Root bind:open>
-	<Popover.Trigger class="rz-node-selector__trigger" type="button">
-		{#snippet child({ props })}
-			<Button size="sm" variant="ghost" {...props}>
-				{activeItem.label || activeItem.name}
-				<ChevronDown size={16} />
-			</Button>
-		{/snippet}
-	</Popover.Trigger>
+  <Popover.Trigger class="rz-node-selector__trigger" type="button">
+    {#snippet child({ props })}
+      <Button size="sm" variant="ghost" {...props}>
+        {activeItem.label || activeItem.name}
+        <ChevronDown size={16} />
+      </Button>
+    {/snippet}
+  </Popover.Trigger>
 
-	<Popover.Portal>
-		<Popover.Content align="start" class="rz-node-selector__content">
-			{#each items as item, index (index)}
-				{@const ItemIcon = item.icon}
-				<button
-					onclick={() => {
-						if (item.nodeSelector && item.nodeSelector.command) {
-							item.nodeSelector.command({ editor });
-						}
-						open = false;
-					}}
-					class="rz-node-selector__node"
-					type="button"
-				>
-					<div class="rz-node-selector__node-content">
-						<div class="rz-node-selector__node-icon">
-							<ItemIcon size={15} />
-						</div>
-						<span>{item.label || item.name}</span>
-					</div>
+  <Popover.Portal>
+    <Popover.Content align="start" class="rz-node-selector__content">
+      {#each items as item, index (index)}
+        {@const ItemIcon = item.icon}
+        <button
+          onclick={() => {
+            if (item.nodeSelector && item.nodeSelector.command) {
+              item.nodeSelector.command({ editor });
+            }
+            open = false;
+          }}
+          class="rz-node-selector__node"
+          type="button"
+        >
+          <div class="rz-node-selector__node-content">
+            <div class="rz-node-selector__node-icon">
+              <ItemIcon size={15} />
+            </div>
+            <span>{item.label || item.name}</span>
+          </div>
 
-					{#if activeItems[item.name]}
-						<Check size={16} />
-					{/if}
-				</button>
-			{/each}
-		</Popover.Content>
-	</Popover.Portal>
+          {#if activeItems[item.name]}
+            <Check size={16} />
+          {/if}
+        </button>
+      {/each}
+    </Popover.Content>
+  </Popover.Portal>
 </Popover.Root>

package/dist/fields/rich-text/component/drag-handle/drag-handle.css

@@ -1,18 +1,18 @@
 .rz-rich-text-drag-handle {
-	position: absolute;
-	left: -1000px;
-	display: none;
-	align-items: center;
-	border-radius: 0.25rem;
-	margin-top: 0.8rem;
-	cursor: grab;
-	display: flex;
-	height: 1.5rem;
-	justify-content: center;
-	width: 1.5rem;
+  position: absolute;
+  left: -1000px;
+  display: none;
+  align-items: center;
+  border-radius: 0.25rem;
+  margin-top: 0.8rem;
+  cursor: grab;
+  display: flex;
+  height: 1.5rem;
+  justify-content: center;
+  width: 1.5rem;
 }
 
 /** Show drag handle only when more than 1 node */
 .ProseMirror:not(:has(> *:nth-child(2))) + div > .rz-rich-text-drag-handle {
-	display: none !important;
+  display: none !important;
 }

package/dist/fields/rich-text/component/drag-handle/drag-handle.svelte

@@ -1,36 +1,36 @@
 <script lang="ts">
-	import { GripVertical } from '@lucide/svelte';
-	import type { Editor } from '@tiptap/core';
-	import {
-		DragHandlePlugin,
-		defaultComputePositionConfig,
-		type DragHandlePluginProps
-	} from '../../core/extensions/drag-handle/index.js';
-	import './drag-handle.css';
+  import { GripVertical } from '@lucide/svelte';
+  import type { Editor } from '@tiptap/core';
+  import {
+    DragHandlePlugin,
+    defaultComputePositionConfig,
+    type DragHandlePluginProps
+  } from '../../core/extensions/drag-handle/index.js';
+  import './drag-handle.css';
 
-	type Props = {
-		editor: Editor;
-		element?: HTMLElement;
-		computePositionConfig?: DragHandlePluginProps['computePositionConfig'];
-	};
+  type Props = {
+    editor: Editor;
+    element?: HTMLElement;
+    computePositionConfig?: DragHandlePluginProps['computePositionConfig'];
+  };
 
-	let { editor, computePositionConfig, element = $bindable() }: Props = $props();
+  let { editor, computePositionConfig, element = $bindable() }: Props = $props();
 
-	const pluginKey = new Date().getTime().toString();
+  const pluginKey = new Date().getTime().toString();
 
-	$effect(() => {
-		if (!element || !editor) return;
-		const { plugin } = DragHandlePlugin({
-			editor,
-			pluginKey,
-			element,
-			computePositionConfig: { ...defaultComputePositionConfig, ...computePositionConfig }
-		});
-		editor.registerPlugin(plugin);
-		return () => editor.unregisterPlugin(pluginKey);
-	});
+  $effect(() => {
+    if (!element || !editor) return;
+    const { plugin } = DragHandlePlugin({
+      editor,
+      pluginKey,
+      element,
+      computePositionConfig: { ...defaultComputePositionConfig, ...computePositionConfig }
+    });
+    editor.registerPlugin(plugin);
+    return () => editor.unregisterPlugin(pluginKey);
+  });
 </script>
 
 <div bind:this={element} class="rz-rich-text-drag-handle">
-	<GripVertical size="14" />
+  <GripVertical size="14" />
 </div>

package/dist/fields/rich-text/component/styles/rich-text.css

@@ -1,183 +1,183 @@
 /** Base style */
 .rz-rich-text__editor {
-	--left-spacing: var(--rz-size-12);
-	min-height: var(--rz-size-11);
-	width: calc(100% + var(--left-spacing));
-	position: relative;
-	line-height: 1.5;
-	margin-left: calc(-1 * var(--left-spacing));
+  --left-spacing: var(--rz-size-12);
+  min-height: var(--rz-size-11);
+  width: calc(100% + var(--left-spacing));
+  position: relative;
+  line-height: 1.5;
+  margin-left: calc(-1 * var(--left-spacing));
 
-	.ProseMirror {
-		height: 100%;
-		@container rz-document (min-width:620px) {
-			font-size: var(--rz-text-lg);
-		}
-		@container rz-document (min-width:960px) {
-			font-size: var(--rz-text-xl);
-		}
-	}
+  .ProseMirror {
+    height: 100%;
+    @container rz-document (min-width:620px) {
+      font-size: var(--rz-text-lg);
+    }
+    @container rz-document (min-width:960px) {
+      font-size: var(--rz-text-xl);
+    }
+  }
 
-	.ProseMirror-trailingBreak {
-		content: ' ';
-		display: inline-block;
-	}
+  .ProseMirror-trailingBreak {
+    content: ' ';
+    display: inline-block;
+  }
 }
 
 /** Disabled style */
 .rz-rich-text__editor > [contenteditable='false'] {
-	color: hsl(var(--rz-color-fg) / 0.5);
-	cursor: no-drop;
-	& * {
-		pointer-events: none;
-		opacity: 0.9;
-	}
+  color: hsl(var(--rz-color-fg) / 0.5);
+  cursor: no-drop;
+  & * {
+    pointer-events: none;
+    opacity: 0.9;
+  }
 }
 
 /** All editor > node */
 .ProseMirror > *:not(.ProseMirror-gapcursor) {
-	background-color: hsl(var(--rz-input-bg));
-	padding: var(--rz-size-4) var(--rz-size-3) var(--rz-size-4);
-	margin-left: var(--left-spacing);
-	width: calc(100% - var(--left-spacing));
-	min-height: var(--rz-size-11);
-	border-top: 1px solid hsl(from var(--rz-input-border-color) h s l / 0.3);
-	border-left: 1px solid var(--rz-input-border-color);
-	border-right: 1px solid var(--rz-input-border-color);
-	&:first-child {
-		border-top: 1px solid var(--rz-input-border-color);
-		border-top-left-radius: var(--rz-radius-md);
-		border-top-right-radius: var(--rz-radius-md);
-		/*border-top: none;*/
-	}
-	&:last-child {
-		border-bottom-left-radius: var(--rz-radius-md);
-		border-bottom-right-radius: var(--rz-radius-md);
-		border-bottom: 1px solid var(--rz-input-border-color);
-	}
+  background-color: hsl(var(--rz-input-bg));
+  padding: var(--rz-size-4) var(--rz-size-3) var(--rz-size-4);
+  margin-left: var(--left-spacing);
+  width: calc(100% - var(--left-spacing));
+  min-height: var(--rz-size-11);
+  border-top: 1px solid hsl(from var(--rz-input-border-color) h s l / 0.3);
+  border-left: 1px solid var(--rz-input-border-color);
+  border-right: 1px solid var(--rz-input-border-color);
+  &:first-child {
+    border-top: 1px solid var(--rz-input-border-color);
+    border-top-left-radius: var(--rz-radius-md);
+    border-top-right-radius: var(--rz-radius-md);
+    /*border-top: none;*/
+  }
+  &:last-child {
+    border-bottom-left-radius: var(--rz-radius-md);
+    border-bottom-right-radius: var(--rz-radius-md);
+    border-bottom: 1px solid var(--rz-input-border-color);
+  }
 }
 
 /** Disable focus-style on the whole editor */
 .ProseMirror-focused {
-	outline: none;
+  outline: none;
 }
 
 .rz-rich-text__editor[data-error]:has(.ProseMirror-focused) {
-	border-color: hsl(var(--rz-color-alert));
+  border-color: hsl(var(--rz-color-alert));
 }
 
 .rz-rich-text__editor .ProseMirror .is-empty:not(table)::before {
-	content: attr(data-placeholder);
-	color: hsl(var(--rz-color-fg) / 0.3);
-	float: left;
-	pointer-events: none;
-	height: 0;
+  content: attr(data-placeholder);
+  color: hsl(var(--rz-color-fg) / 0.3);
+  float: left;
+  pointer-events: none;
+  height: 0;
 }
 .rz-rich-text__editor .ProseMirror ul.is-empty::before,
 .rz-rich-text__editor .ProseMirror ol.is-empty::before,
 .rz-rich-text__editor .ProseMirror blockquote.is-empty::before {
-	margin-left: var(--rz-size-6);
+  margin-left: var(--rz-size-6);
 }
 
 /** Text styles */
 .rz-rich-text__editor .ProseMirror {
-	h1 {
-		display: block;
+  h1 {
+    display: block;
 
-		font-family: var(--rz-font-serif);
-		font-size: var(--rz-text-5xl);
-		line-height: 1.15;
-		font-variation-settings: 'wght' 600;
-		font-weight: 600;
-	}
-	h2 {
-		display: block;
+    font-family: var(--rz-font-serif);
+    font-size: var(--rz-text-5xl);
+    line-height: 1.15;
+    font-variation-settings: 'wght' 600;
+    font-weight: 600;
+  }
+  h2 {
+    display: block;
 
-		font-family: var(--rz-font-sans);
-		font-size: var(--rz-text-4xl);
-		line-height: 1.15;
-		font-variation-settings: 'wght' 600;
-		font-weight: 600;
-	}
-	h3 {
-		display: block;
+    font-family: var(--rz-font-sans);
+    font-size: var(--rz-text-4xl);
+    line-height: 1.15;
+    font-variation-settings: 'wght' 600;
+    font-weight: 600;
+  }
+  h3 {
+    display: block;
 
-		font-family: var(--rz-font-sans);
-		font-size: var(--rz-text-3xl);
-		line-height: 1.15;
-		font-variation-settings: 'wght' 600;
-		font-weight: 600;
-	}
-	h4 {
-		display: block;
+    font-family: var(--rz-font-sans);
+    font-size: var(--rz-text-3xl);
+    line-height: 1.15;
+    font-variation-settings: 'wght' 600;
+    font-weight: 600;
+  }
+  h4 {
+    display: block;
 
-		font-family: var(--rz-font-sans);
-		font-size: var(--rz-text-2xl);
-		line-height: 1.15;
-		font-variation-settings: 'wght' 600;
-		font-weight: 600;
-	}
-	h4 {
-		display: block;
-		font-family: var(--rz-font-sans);
-		font-size: var(--rz-text-xl);
-		line-height: 1.15;
-		font-variation-settings: 'wght' 600;
-		font-weight: 600;
-	}
-	h5 {
-		display: block;
-		/*margin-bottom: var(--rz-size-2);*/
-		font-size: var(--rz-text-lg);
-		font-family: var(--rz-font-sans);
-		line-height: 1.15;
-		font-variation-settings: 'wght' 600;
-		font-weight: 600;
-	}
-	h6 {
-		display: block;
-		/*margin-bottom: var(--rz-size-1);*/
-		font-family: var(--rz-font-serif);
-		line-height: 1.15;
-		font-variation-settings: 'wght' 600;
-		font-weight: 600;
-	}
-	ol {
-		display: block;
+    font-family: var(--rz-font-sans);
+    font-size: var(--rz-text-2xl);
+    line-height: 1.15;
+    font-variation-settings: 'wght' 600;
+    font-weight: 600;
+  }
+  h4 {
+    display: block;
+    font-family: var(--rz-font-sans);
+    font-size: var(--rz-text-xl);
+    line-height: 1.15;
+    font-variation-settings: 'wght' 600;
+    font-weight: 600;
+  }
+  h5 {
+    display: block;
+    /*margin-bottom: var(--rz-size-2);*/
+    font-size: var(--rz-text-lg);
+    font-family: var(--rz-font-sans);
+    line-height: 1.15;
+    font-variation-settings: 'wght' 600;
+    font-weight: 600;
+  }
+  h6 {
+    display: block;
+    /*margin-bottom: var(--rz-size-1);*/
+    font-family: var(--rz-font-serif);
+    line-height: 1.15;
+    font-variation-settings: 'wght' 600;
+    font-weight: 600;
+  }
+  ol {
+    display: block;
 
-		li {
-			& > p {
-				display: inline;
-				margin: 0;
-			}
-			margin-left: var(--rz-size-5);
-			list-style-type: decimal;
-		}
-	}
-	ul {
-		display: block;
+    li {
+      & > p {
+        display: inline;
+        margin: 0;
+      }
+      margin-left: var(--rz-size-5);
+      list-style-type: decimal;
+    }
+  }
+  ul {
+    display: block;
 
-		li {
-			& > p,
-			&::marker {
-				display: inline;
-				margin: 0;
-			}
-			margin-left: var(--rz-size-5);
-			list-style-type: disc;
-		}
-	}
-	blockquote p {
-		border-left: 3px solid hsl(var(--rz-color-border) / 1);
-		padding-top: 0;
-		padding-bottom: 0;
-		padding-left: var(--rz-size-4);
-		font-family: var(--rz-font-sans);
-		font-variation-settings: 'wght' 500;
-		font-weight: 500;
-	}
+    li {
+      & > p,
+      &::marker {
+        display: inline;
+        margin: 0;
+      }
+      margin-left: var(--rz-size-5);
+      list-style-type: disc;
+    }
+  }
+  blockquote p {
+    border-left: 3px solid hsl(var(--rz-color-border) / 1);
+    padding-top: 0;
+    padding-bottom: 0;
+    padding-left: var(--rz-size-4);
+    font-family: var(--rz-font-sans);
+    font-variation-settings: 'wght' 500;
+    font-weight: 500;
+  }
 }
 
 /** Fix gap cursor position */
 .rz-field-rich-text .ProseMirror-gapcursor:after {
-	left: calc(var(--left-spacing) + var(--rz-size-4));
+  left: calc(var(--left-spacing) + var(--rz-size-4));
 }