rimecms 0.33.0 → 1.0.0

package/dist/core/prototype/shared/url/format.server.js

@@ -0,0 +1,38 @@
+import { RimeError } from '../../../errors/index.js';
+import { slugify } from '../../../../util/string.js';
+/**
+ * A page's url: `$url` with its path, slug, locale and document, made absolute against
+ * `PUBLIC_RIME_URL`.
+ *
+ * ```ts
+ * formatUrl({ config, doc, path: 'services/web', locale: 'en' }) // 'https://site.test/en/services/web'
+ * formatUrl({ config, doc, path: '', locale: '' })                // an area: no path, no slug
+ * ```
+ */
+export const formatUrl = (args) => {
+    const { config, doc, path, locale } = args;
+    const segments = path ? path.split('/') : [];
+    const url = config.$url({ path: segments, slug: segments.at(-1) ?? '', locale, doc });
+    if (typeof url !== 'string') {
+        throw new RimeError(RimeError.CONFIG_ERROR, `$url of ${config.slug} must answer a string`);
+    }
+    const origin = process.env.PUBLIC_RIME_URL;
+    return origin ? new URL(url, origin).href : url;
+};
+/** A slug made from any text: `'Web design!'` -> `'web-design'`. Empty when nothing is left. */
+export const toSlug = (text) => slugify(String(text ?? '')).replace(/^-+|-+$/g, '');
+/**
+ * `wanted`, or the first of `wanted-2`, `wanted-3`… that no sibling holds.
+ *
+ * ```ts
+ * freeSlug('web', ['web', 'web-2']) // 'web-3'
+ * ```
+ */
+export const freeSlug = (wanted, taken) => {
+    if (!taken.includes(wanted))
+        return wanted;
+    let n = 2;
+    while (taken.includes(`${wanted}-${n}`))
+        n++;
+    return `${wanted}-${n}`;
+};

package/dist/core/prototype/shared/url/hooks/create-paths.server.d.ts

@@ -0,0 +1,2 @@
+/** A new page gets its address in every locale: a slug from its title, under its parent, a url. */
+export declare const createPaths: import("../../../../pipeline/types.js").Hook<"generic", "create", "after">;

package/dist/core/prototype/shared/url/hooks/create-paths.server.js

@@ -0,0 +1,9 @@
+import { Hooks } from '../../../../pipeline/define-hook.js';
+import { addAddresses, withAddress } from '../addresses.server.js';
+/** A new page gets its address in every locale: a slug from its title, under its parent, a url. */
+export const createPaths = Hooks.afterCreate(async function createPaths(args) {
+    const { event, doc } = args;
+    const config = args.config;
+    await addAddresses({ event, config, ids: [doc.id] });
+    return { ...args, doc: await withAddress({ event, config, doc }) };
+});

package/dist/core/prototype/shared/url/hooks/detach-paths.server.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Before a delete, the page's children go to the top level with their subtrees, as `_parent`
+ * does, and get their new urls. The page's own rows go with it by cascade.
+ */
+export declare const detachPaths: import("../../../../pipeline/types.js").Hook<"generic", "delete", "before">;

package/dist/core/prototype/shared/url/hooks/detach-paths.server.js

@@ -0,0 +1,18 @@
+import { Hooks } from '../../../../pipeline/define-hook.js';
+import { refreshUrls } from '../refresh.server.js';
+/**
+ * Before a delete, the page's children go to the top level with their subtrees, as `_parent`
+ * does, and get their new urls. The page's own rows go with it by cascade.
+ */
+export const detachPaths = Hooks.beforeDelete(async function detachPaths(args) {
+    const { event, doc } = args;
+    const config = args.config;
+    const detached = await event.locals.rime.adapter.paths.detachChildren({
+        slug: config.slug,
+        ownerId: doc.id
+    });
+    for (const row of detached) {
+        await refreshUrls({ event, config, locale: row.locale, path: row.path });
+    }
+    return args;
+});

package/dist/core/prototype/shared/url/hooks/index.server.d.ts

@@ -6,4 +6,8 @@
  * It exists because a prototype's `hooks.server.ts` writes the run order and would otherwise carry
  * one import line per hook.
  */
-export { populateURL } from './populate-url.server.js';
+export { createPaths } from './create-paths.server.js';
+export { detachPaths } from './detach-paths.server.js';
+export { setAreaUrl } from './set-area-url.server.js';
+export { setLiveUrl } from './set-live-url.server.js';
+export { syncPaths } from './sync-paths.server.js';

package/dist/core/prototype/shared/url/hooks/index.server.js

@@ -6,4 +6,8 @@
  * It exists because a prototype's `hooks.server.ts` writes the run order and would otherwise carry
  * one import line per hook.
  */
-export { populateURL } from './populate-url.server.js';
+export { createPaths } from './create-paths.server.js';
+export { detachPaths } from './detach-paths.server.js';
+export { setAreaUrl } from './set-area-url.server.js';
+export { setLiveUrl } from './set-live-url.server.js';
+export { syncPaths } from './sync-paths.server.js';

package/dist/core/prototype/shared/url/hooks/set-area-url.server.d.ts

@@ -0,0 +1,2 @@
+/** An area's url, built on read: one document, no parent, nothing stored. */
+export declare const setAreaUrl: import("../../../../pipeline/types.js").Hook<"generic", "read", "before">;

package/dist/core/prototype/shared/url/hooks/set-area-url.server.js

@@ -0,0 +1,8 @@
+import { Hooks } from '../../../../pipeline/define-hook.js';
+import { formatUrl } from '../format.server.js';
+/** An area's url, built on read: one document, no parent, nothing stored. */
+export const setAreaUrl = Hooks.beforeRead(async function setAreaUrl(args) {
+    const { config, context } = args;
+    const url = formatUrl({ config, doc: args.doc, path: '', locale: context.params.locale ?? '' });
+    return { ...args, doc: { ...args.doc, url } };
+});

package/dist/core/prototype/shared/url/hooks/set-live-url.server.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The live edit link, for staff, from the document's url: the panel opens the page there and
+ * sends it the edited version's content. No query.
+ */
+export declare const setLiveUrl: import("../../../../pipeline/types").Hook<"generic", "read", "before">;

package/dist/core/prototype/shared/url/hooks/set-live-url.server.js

@@ -0,0 +1,19 @@
+import { env } from '$env/dynamic/private';
+import { PARAMS } from '../../../../constants.js';
+import { Hooks } from '../../../../pipeline/define-hook.js';
+/**
+ * The live edit link, for staff, from the document's url: the panel opens the page there and
+ * sends it the edited version's content. No query.
+ */
+export const setLiveUrl = Hooks.beforeRead(async function setLiveUrl(args) {
+    const { config, event, context } = args;
+    const doc = args.doc;
+    if (!config.live || !event.locals.user?.isStaff || !doc.url)
+        return args;
+    let live = `${process.env.PUBLIC_RIME_URL}/${env.RIME_PANEL_ROUTE || 'panel'}/live-edit?src=${doc.url}&slug=${config.slug}&id=${doc.id}`;
+    if (doc.contentId)
+        live += `&${PARAMS.VERSION_ID}=${doc.contentId}`;
+    if (context.params.locale)
+        live += `&${PARAMS.LOCALE}=${context.params.locale}`;
+    return { ...args, doc: { ...doc, _live: live } };
+});

package/dist/core/prototype/shared/url/hooks/sync-paths.server.d.ts

@@ -0,0 +1,7 @@
+/**
+ * After a save. A move carries the page and its subtree under the new parent, in every locale at
+ * once. Any other save formats the page's own urls again, since `$url` may read any of its fields.
+ *
+ * An auto-save moves nothing and changes no url: it is skipped.
+ */
+export declare const syncPaths: import("../../../../pipeline/types.js").Hook<"generic", "update", "after">;

package/dist/core/prototype/shared/url/hooks/sync-paths.server.js

@@ -0,0 +1,37 @@
+import { Hooks } from '../../../../pipeline/define-hook.js';
+import { isNested } from '../../../collection/nested/enabled.js';
+import { addAddresses, withAddress } from '../addresses.server.js';
+import { refreshUrls } from '../refresh.server.js';
+/**
+ * After a save. A move carries the page and its subtree under the new parent, in every locale at
+ * once. Any other save formats the page's own urls again, since `$url` may read any of its fields.
+ *
+ * An auto-save moves nothing and changes no url: it is skipped.
+ */
+export const syncPaths = Hooks.afterUpdate(async function syncPaths(args) {
+    const { event, doc, context } = args;
+    const config = args.config;
+    const { paths } = event.locals.rime.adapter;
+    if (context.params.autoSave)
+        return args;
+    const parentId = doc._parent ?? null;
+    const wasUnder = context.originalDoc?._parent ?? null;
+    const moved = isNested(config) && parentId !== wasUnder;
+    const rows = moved
+        ? await paths.moveUnder({ slug: config.slug, ownerId: doc.id, parentId })
+        : await paths.get({ slug: config.slug, ownerId: doc.id });
+    // A page saved before it had an address gets one.
+    if (!rows.length) {
+        await addAddresses({ event, config, ids: [doc.id] });
+    }
+    for (const row of rows) {
+        await refreshUrls({
+            event,
+            config,
+            locale: row.locale,
+            path: row.path,
+            withDescendants: moved
+        });
+    }
+    return { ...args, doc: await withAddress({ event, config, doc }) };
+});

package/dist/core/prototype/shared/url/refresh.server.d.ts

@@ -0,0 +1,36 @@
+import type { PathRow } from '../../../adapter.js';
+import type { BuiltCollection } from '../../../config/types.js';
+import type { GenericDoc } from '../../types.js';
+import type { RequestEvent } from '@sveltejs/kit';
+/**
+ * The documents of these pages in `locale`: the published ones, and the newest version of those
+ * never published. A url is built from them.
+ */
+export declare const readForUrls: (args: {
+    event: RequestEvent;
+    config: BuiltCollection;
+    locale: string;
+    ids: string[];
+}) => Promise<Map<string, GenericDoc>>;
+/**
+ * Formats the urls of these rows, one locale, and writes those that changed in one go. `docs` are
+ * the pages' documents when the caller has them already.
+ */
+export declare const formatRows: (args: {
+    event: RequestEvent;
+    config: BuiltCollection;
+    locale: string;
+    rows: PathRow[];
+    docs?: Map<string, GenericDoc>;
+}) => Promise<void>;
+/**
+ * The urls of the page at `path` and, unless told otherwise, of every page under it, in one
+ * locale: their documents in one `find`, the changed urls in one write.
+ */
+export declare const refreshUrls: (args: {
+    event: RequestEvent;
+    config: BuiltCollection;
+    locale: string;
+    path: string;
+    withDescendants?: boolean;
+}) => Promise<void>;

package/dist/core/prototype/shared/url/refresh.server.js

@@ -0,0 +1,58 @@
+import { formatUrl } from './format.server.js';
+/**
+ * The documents of these pages in `locale`: the published ones, and the newest version of those
+ * never published. A url is built from them.
+ */
+export const readForUrls = async (args) => {
+    const { event, config, locale, ids } = args;
+    const collection = event.locals.rime.collection(config.slug).system();
+    const query = (list) => ({ where: { id: { in_array: list } } });
+    const docs = new Map();
+    for (const doc of await collection.find({ query: query(ids), locale: locale || undefined })) {
+        docs.set(doc.id, doc);
+    }
+    const missing = ids.filter((id) => !docs.has(id));
+    if (missing.length && config.versions?.draft) {
+        const newest = await collection.find({
+            query: query(missing),
+            locale: locale || undefined,
+            latest: true
+        });
+        for (const doc of newest)
+            docs.set(doc.id, doc);
+    }
+    return docs;
+};
+/**
+ * Formats the urls of these rows, one locale, and writes those that changed in one go. `docs` are
+ * the pages' documents when the caller has them already.
+ */
+export const formatRows = async (args) => {
+    const { event, config, locale, rows } = args;
+    if (!rows.length)
+        return;
+    const docs = args.docs ??
+        (await readForUrls({ event, config, locale, ids: rows.map((row) => row.ownerId) }));
+    const changed = rows.flatMap((row) => {
+        const doc = docs.get(row.ownerId);
+        if (!doc)
+            return [];
+        const url = formatUrl({ config, doc, path: row.path, locale });
+        return url === row.url ? [] : [{ ownerId: row.ownerId, locale, url }];
+    });
+    await event.locals.rime.adapter.paths.setUrls({ slug: config.slug, rows: changed });
+};
+/**
+ * The urls of the page at `path` and, unless told otherwise, of every page under it, in one
+ * locale: their documents in one `find`, the changed urls in one write.
+ */
+export const refreshUrls = async (args) => {
+    const { event, config, locale, path, withDescendants } = args;
+    const rows = await event.locals.rime.adapter.paths.under({
+        slug: config.slug,
+        locale,
+        path,
+        withDescendants
+    });
+    await formatRows({ event, config, locale, rows });
+};

package/dist/core/prototype/shared/versions/configure.server.js

@@ -1,4 +1,5 @@
 import { withVersionsSuffix } from './naming.js';
+import { blank } from '../../blank.js';
 import { prototypeKebab } from '../../naming.js';
 import { isStaff } from '../../../auth/access.js';
 /**
@@ -29,6 +30,7 @@ export function configureVersions(config) {
                 slug: withVersionsSuffix(collection.slug),
                 kebab: prototypeKebab(withVersionsSuffix(collection.slug)),
                 versions: undefined,
+                blank,
                 access: versionsAccess(collection.access),
                 $hooks: collection.$hooks,
                 fields: contentFields(collection),
@@ -56,6 +58,7 @@ export function configureVersions(config) {
                 kebab: prototypeKebab(withVersionsSuffix(area.slug)),
                 icon: area.icon,
                 versions: undefined,
+                blank,
                 access: versionsAccess(area.access),
                 asTitle: area.asTitle,
                 asThumbnail: null,

package/dist/core/routes/context.server.d.ts

@@ -1,3 +1,4 @@
+import type { ResolvedPathname } from '$app/types';
 import type { RequestEvent } from '@sveltejs/kit';
 import * as routes from './util.js';
 /**
@@ -11,7 +12,7 @@ export declare function createRoutesContext(event: RequestEvent): {
     readonly isPublicAuthRoute: boolean;
     readonly isPanel: boolean;
     readonly panel: string;
-    panelUrl(...args: string[]): string;
+    panelUrl(...args: string[]): ResolvedPathname;
     apiUrl: typeof routes.apiUrl;
     absolute: typeof routes.absolute;
 };

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

@@ -1,13 +1,11 @@
 <script lang="ts">
-  import { env } from '$env/dynamic/public';
-  import { emptyValuesFromFieldConfig, isFormField } from '../../../core/fields/util.js';
+  import { emptyValuesFromFieldConfig } from '../../../core/fields/util.js';
   import { t__ } from '../../../core/i18n/index.js';
   import type { GenericBlock } from '../../../core/prototype/types.js';
   import Button from '../../../panel/components/ui/button/button.svelte';
-  import * as Command from '../../../panel/components/ui/command/index.js';
-  import { capitalize } from '../../../util/string.js';
-  import { CirclePlus, ToyBrick } from '@lucide/svelte';
+  import { Plus } from '@lucide/svelte';
   import type { BlocksBuilder, BlocksFieldBlock } from '../index.js';
+  import BlockPicker from './picker/BlockPicker.svelte';
 
   type AddBlock = (options: Omit<GenericBlock, 'id' | 'path'>) => void;
   type Props = {
@@ -17,154 +15,67 @@
   const { config, addBlock }: Props = $props();
 
   let open = $state(false);
-  let ariaSelected = $state('');
+
+  /** The one type of a list that has one: the button adds it without a menu. */
+  const single = $derived(config.get.blocks.length === 1 ? config.get.blocks[0].block : null);
 
   const add = (block: BlocksFieldBlock) => {
     open = false;
     const empty = {
-      ...emptyValuesFromFieldConfig(block.fields.filter(isFormField)),
+      ...emptyValuesFromFieldConfig(block.fields),
       type: block.name
     };
     addBlock(empty);
   };
 </script>
 
-{#if config.get.blocks.length === 1}
-  <Button
-    onclick={() => add(config.get.blocks[0].block)}
-    variant="ghost"
-    icon={CirclePlus}
-    size="icon"
-  />
-{:else}
-  <Button onclick={() => (open = true)} variant="ghost" icon={CirclePlus} size="icon" />
-
-  <Command.Dialog
-    onStateChange={(state) => {
-      ariaSelected = state.value;
-    }}
-    bind:open
-  >
-    <Command.Input class="rz-add-block-button__search" placeholder={t__('common.search')} />
-
-    <div class="rz-add-block-button__command-content">
-      <Command.List class="rz-add-block-button__list">
-        <Command.Empty>No results found.</Command.Empty>
-        <Command.Group heading="Component">
-          {#each config.get.blocks as blockBuilder, index (index)}
-            {@const blockConfig = blockBuilder.block}
-            {@const BlockIcon = blockConfig.icon || ToyBrick}
-            <Command.Item
-              class="rz-add-block-button__item"
-              value={blockConfig.name}
-              onSelect={() => {
-                add(blockConfig);
-                open = false;
-              }}
-            >
-              <div class="rz-add-block-button__icon-wrapper">
-                <BlockIcon size={17} />
-              </div>
-
-              <div class="rz-add-block-button__info">
-                <p class="rz-add-block-button__title">
-                  {blockConfig.label || capitalize(blockConfig.name)}
-                </p>
-                {#if blockConfig.description}
-                  <p class="rz-add-block-button__description">
-                    {blockConfig.description}
-                  </p>
-                {/if}
-              </div>
-            </Command.Item>
-          {/each}
-        </Command.Group>
-      </Command.List>
-
-      <div class="rz-add-block-button__preview-wrap">
-        {#each config.get.blocks as blockFieldBuilder, index (index)}
-          <div
-            class:rz-add-block-button__preview--active={ariaSelected === blockFieldBuilder.name}
-            class="rz-add-block-button__preview"
-          >
-            {#if blockFieldBuilder.block.image}
-              <img src="{env.PUBLIC_RIME_URL}{blockFieldBuilder.block.image}" alt="preview" />
-            {:else}
-              no preview
-            {/if}
-          </div>
-        {/each}
-      </div>
-    </div>
-  </Command.Dialog>
+<!-- A ghost "+ Add a block" under the list: one type adds it, several open the picker. -->
+<Button
+  class="rz-add-block"
+  variant="ghost"
+  icon={Plus}
+  onclick={() => (single ? add(single) : (open = true))}
+>
+  {t__('fields.add_a_block')}
+</Button>
+
+{#if !single}
+  <BlockPicker bind:open types={config.get.blocks} onpick={add} />
 {/if}
 
-<style>
-  :global {
-    .rz-add-block-button {
-      gap: var(--rz-size-2);
-    }
-
-    .rz-command-dialog-content {
-      width: 60vw;
-    }
-
-    .rz-add-block-button__command-content {
-      display: grid;
-      position: relative;
-      grid-template-columns: 3fr 2fr;
-    }
-    .rz-add-block-button__search {
-      border-radius: var(--rz-radius-xl);
-    }
-
-    .rz-add-block-button__list {
-      padding: var(--rz-size-2);
-      max-height: var(--rz-size-72);
-      border-right: var(--rz-border);
-    }
-
-    .rz-add-block-button__item {
-      display: flex;
-      gap: var(--rz-size-3);
-      border-radius: var(--rz-radius-md);
-    }
-
-    .rz-add-block-button__preview-wrap {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      img {
-        width: 200px;
-        height: auto;
-      }
-    }
-    .rz-add-block-button__preview.rz-add-block-button__preview--active {
-      display: block;
-    }
-    .rz-add-block-button__preview {
-      display: none;
-    }
-  }
+<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+
+/* A well: an input, a track, a dropzone. Its edge shows on hover. */
+
+/* The hover tint, laid over the element's own fill. */
+
+/* The picked item of a segmented control. */
+
+/* The primary button's face: black on light, white on dark. */
+
+/* Keyboard focus on a button, a tab, a link. */
+
+/* A focused input: an accent edge and a soft halo. */
 
-  .rz-add-block-button__icon-wrapper {
-    display: flex;
-    width: var(--rz-size-12);
-    height: var(--rz-size-12);
-    align-items: center;
-    justify-content: center;
-    border-radius: var(--rz-radius-xl);
+/* An input with an error. */
+/* Muted text and a plus, lit on hover. */
+  :global(.rz-button.rz-add-block) {
+    gap: var(--rz-size-1-5);
+    height: var(--rz-size-7);
+    padding: 0 var(--rz-size-2) 0 var(--rz-size-1-5);
+    border-radius: var(--rz-radius-lg);
+    color: var(--rz-fg-muted);
+    font-size: var(--rz-text-md);
   }
 
-  .rz-add-block-button__title {
-    font-size: var(--rz-text-lg);
-    font-variation-settings: 'wght' 500;
-    font-weight: 500;
+  :global(.rz-button.rz-add-block .rz-button__icon) {
+    width: auto;
+    height: auto;
+    color: var(--rz-fg-subtle);
   }
 
-  .rz-add-block-button__description {
-    color: hsl(var(--rz-color-fg) / 0.5);
-    margin-top: var(--rz-size-1);
-    font-size: var(--rz-text-sm);
+  :global(.rz-button.rz-add-block:hover:not(:disabled)),
+  :global(.rz-button.rz-add-block:hover:not(:disabled) .rz-button__icon) {
+    color: var(--rz-fg);
   }
 </style>