@lblod/ember-rdfa-editor-lblod-plugins 18.0.0 → 18.1.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @lblod/ember-rdfa-editor-lblod-plugins
 
+## 18.1.0
+
+### Minor Changes
+
+- [#419](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/419) [`05c46c06c426141b73420c240834cdaf7e52a095`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/05c46c06c426141b73420c240834cdaf7e52a095) Thanks [@piemonkey](https://github.com/piemonkey)! - Add Snippet Placeholder component to signal the intended location for snippets to be inserted
+
+### Patch Changes
+
+- [`e2cdeff70e8364b643d10355fa9de55c5a078ede`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/e2cdeff70e8364b643d10355fa9de55c5a078ede) Thanks [@abeforgit](https://github.com/abeforgit)! - Fix template node lookup
+
+  The template card could not determine it was already in a decision node, due to the attribute comparison function being passed the node instead of the node's attrs
+
 ## 18.0.0
 
 ### Major Changes

package/addon/components/common/search/loading.hbs

@@ -1,4 +1,3 @@
-<AuLoader @padding='large' />
-<span class='au-u-hidden-visually'>
+<AuLoader @hideMessage={{true}}>
   {{t 'common.search.loading'}}
-</span>
+</AuLoader>

package/addon/components/snippet-plugin/nodes/placeholder.gts

@@ -0,0 +1,28 @@
+import Component from '@glimmer/component';
+import { on } from '@ember/modifier';
+import t from 'ember-intl/helpers/t';
+import AuAlert from '@appuniversum/ember-appuniversum/components/au-alert';
+import { PlusTextIcon } from '@appuniversum/ember-appuniversum/components/icons/plus-text';
+import { type EmberNodeArgs } from '@lblod/ember-rdfa-editor/utils/_private/ember-node';
+
+interface Signature {
+  Args: EmberNodeArgs;
+}
+
+// We don't have a way to type template only components without ember-source 5, so create an empty
+// class to allow for type checking
+// eslint-disable-next-line ember/no-empty-glimmer-component-classes
+export default class SnippetPluginPlaceholder extends Component<Signature> {
+  <template>
+    <AuAlert
+      @title={{t 'snippet-plugin.placeholder.title'}}
+      @skin='warning'
+      @icon={{PlusTextIcon}}
+      @size='small'
+      class='say-snippet-placeholder'
+      {{on 'click' @selectNode}}
+    >
+      {{t 'snippet-plugin.placeholder.text'}}
+    </AuAlert>
+  </template>
+}

package/addon/components/snippet-plugin/snippet-insert-placeholder.gts

@@ -0,0 +1,69 @@
+import { on } from '@ember/modifier';
+import { action } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import t from 'ember-intl/helpers/t';
+import not from 'ember-truth-helpers/helpers/not';
+import AuButton from '@appuniversum/ember-appuniversum/components/au-button';
+import { AddIcon } from '@appuniversum/ember-appuniversum/components/icons/add';
+import { type NodeType, type SayController } from '@lblod/ember-rdfa-editor';
+import { type SnippetPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin';
+import { createSnippetPlaceholder } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin/nodes/snippet-placeholder';
+import SnippetListModal from '@lblod/ember-rdfa-editor-lblod-plugins/components/snippet-plugin/snippet-list/snippet-list-modal';
+
+interface Signature {
+  Args: {
+    controller: SayController;
+    config: SnippetPluginConfig;
+  };
+}
+const empty: string[] = [];
+export default class SnippetPluginSnippetInsertPlaceholder extends Component<Signature> {
+  @tracked isModalOpen = false;
+
+  get placeholderNode() {
+    return this.args.controller.schema.nodes['snippet_placeholder'] as
+      | NodeType
+      | undefined;
+  }
+
+  @action openModal() {
+    this.isModalOpen = true;
+  }
+  @action closeModal() {
+    this.isModalOpen = false;
+  }
+
+  @action
+  insertPlaceholder(listIds: string[]) {
+    const node = createSnippetPlaceholder(listIds, this.args.controller.schema);
+
+    this.args.controller.withTransaction(
+      (tr) => {
+        return tr.replaceSelectionWith(node);
+      },
+      { view: this.args.controller.mainEditorView },
+    );
+  }
+
+  <template>
+    <li class='au-c-list__item'>
+      <AuButton
+        @icon={{AddIcon}}
+        @iconAlignment='left'
+        @skin='link'
+        @disabled={{(not this.placeholderNode)}}
+        {{on 'click' this.openModal}}
+      >
+        {{t 'snippet-plugin.insert.placeholder'}}
+      </AuButton>
+    </li>
+    <SnippetListModal
+      @config={{@config}}
+      @assignedSnippetListsIds={{empty}}
+      @onSaveSnippetListIds={{this.insertPlaceholder}}
+      @open={{this.isModalOpen}}
+      @closeModal={{this.closeModal}}
+    />
+  </template>
+}

package/addon/components/snippet-plugin/snippet-list/snippet-list-modal.ts

@@ -1,6 +1,6 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
-import { restartableTask, Task, timeout } from 'ember-concurrency';
+import { restartableTask, timeout } from 'ember-concurrency';
 import { task as trackedTask } from 'ember-resources/util/ember-concurrency';
 
 import { tracked } from '@glimmer/tracking';
@@ -16,14 +16,17 @@ import {
 } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin';
 import { trackedReset } from 'tracked-toolbox';
 
-interface Args {
-  config: SnippetPluginConfig;
-  onSaveSnippetListIds: Task<Promise<void>, [snippetIds: string[]]>;
-  assignedSnippetListsIds: string[];
-  closeModal: () => void;
+interface Signature {
+  Args: {
+    config: SnippetPluginConfig;
+    onSaveSnippetListIds: (listIds: string[]) => void;
+    assignedSnippetListsIds: string[];
+    closeModal: () => void;
+    open: boolean;
+  };
 }
 
-export default class SnippetListModalComponent extends Component<Args> {
+export default class SnippetListModalComponent extends Component<Signature> {
   // Filtering
   @tracked nameFilterText: string | null = null;
 
@@ -46,11 +49,11 @@ export default class SnippetListModalComponent extends Component<Args> {
   }
 
   @action
-  async saveAndClose() {
-    await this.snippetListResource.cancel();
-
-    await this.args.onSaveSnippetListIds.perform(this.assignedSnippetListsIds);
+  saveAndClose() {
+    this.args.onSaveSnippetListIds(this.assignedSnippetListsIds);
     this.args.closeModal();
+    // Clear selection for next time
+    this.assignedSnippetListsIds = [];
   }
 
   snippetListSearch = restartableTask(async () => {

package/addon/components/snippet-plugin/snippet-list-select-rdfa.ts

@@ -1,5 +1,4 @@
 import Component from '@glimmer/component';
-import { task } from 'ember-concurrency';
 
 import { isResourceNode } from '@lblod/ember-rdfa-editor/utils/node-utils';
 
@@ -50,7 +49,7 @@ export default class SnippetListSelectRdfaComponent extends Component<Args> {
     );
   }
 
-  saveChanges = task(async (snippetIds: string[]) => {
+  saveChanges = (snippetIds: string[]) => {
     if (this.currentResource) {
       this.args.controller?.doCommand(
         updateSnippetIds({
@@ -63,7 +62,5 @@ export default class SnippetListSelectRdfaComponent extends Component<Args> {
         },
       );
     }
-
-    await new Promise((resolve) => setTimeout(resolve, 0));
-  });
+  };
 }

package/addon/components/snippet-plugin/snippet-list-select.ts

@@ -1,18 +1,19 @@
 import { action } from '@ember/object';
-import { Task } from 'ember-concurrency';
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { UnorderedListIcon } from '@appuniversum/ember-appuniversum/components/icons/unordered-list';
 
 import { SnippetPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin';
 
-interface Args {
-  config: SnippetPluginConfig;
-  assignedSnippetListsIds: string[];
-  onSaveSnippetListIds: Task<Promise<void>, [snippetIds: string[]]>;
+interface Signature {
+  Args: {
+    config: SnippetPluginConfig;
+    assignedSnippetListsIds: string[];
+    onSaveSnippetListIds: (listIds: string[]) => void;
+  };
 }
 
-export default class SnippetListSelectComponent extends Component<Args> {
+export default class SnippetListSelectComponent extends Component<Signature> {
   UnorderedListIcon = UnorderedListIcon;
   @tracked showModal = false;
 

package/addon/components/standard-template-plugin/template-provider.ts

@@ -70,7 +70,11 @@ export default class TemplateProviderComponent extends Component<Args> {
         }) ||
       findAncestors($from, (node) => {
         return template.contexts.some((type) =>
-          hasOutgoingNamedNodeTriple(node, RDF('type'), HACKY_LOOKUP[type]),
+          hasOutgoingNamedNodeTriple(
+            node.attrs,
+            RDF('type'),
+            HACKY_LOOKUP[type],
+          ),
         );
       }).length;
     const containsDisabledTypes =
@@ -81,7 +85,11 @@ export default class TemplateProviderComponent extends Component<Args> {
         }) ||
       findAncestors($from, (node) => {
         return template.disabledInContexts.some((type) =>
-          hasOutgoingNamedNodeTriple(node, RDF('type'), HACKY_LOOKUP[type]),
+          hasOutgoingNamedNodeTriple(
+            node.attrs,
+            RDF('type'),
+            HACKY_LOOKUP[type],
+          ),
         );
       }).length;
 

package/addon/components/variable-plugin/address/nodeview.hbs

@@ -3,7 +3,7 @@
   @icon={{this.PencilIcon}}
   @iconAlignment='right'
   class='variable atomic'
-  {{on 'click' this.selectThisNode}}
+  {{on 'click' @selectNode}}
 >
   {{#if this.address}}
     {{this.address.formatted}}

package/addon/components/variable-plugin/address/nodeview.ts

@@ -1,10 +1,9 @@
 import Component from '@glimmer/component';
-import { action } from '@ember/object';
 import { service } from '@ember/service';
 import IntlService from 'ember-intl/services/intl';
 import { PencilIcon } from '@appuniversum/ember-appuniversum/components/icons/pencil';
 
-import { NodeSelection, PNode, SayController } from '@lblod/ember-rdfa-editor';
+import { PNode, SayController } from '@lblod/ember-rdfa-editor';
 import { Address } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/variable-plugin/variables/address';
 import { getOutgoingTriple } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
 import { EXT } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
@@ -47,16 +46,4 @@ export default class AddressNodeviewComponent extends Component<Args> {
   get label() {
     return getOutgoingTriple(this.node.attrs, EXT('label'))?.object.value;
   }
-
-  @action
-  selectThisNode() {
-    const tr = this.args.controller.activeEditorState.tr;
-    tr.setSelection(
-      NodeSelection.create(
-        this.args.controller.activeEditorState.doc,
-        this.args.getPos() as number,
-      ),
-    );
-    this.args.controller.activeEditorView.dispatch(tr);
-  }
 }

package/addon/components/variable-plugin/date/nodeview.hbs

@@ -1,6 +1,10 @@
 {{! @glint-nocheck: not typesafe yet }}
-<AuPill @icon={{this.PencilIcon}} @iconAlignment="right" class="variable atomic" {{on 'click' this.onClick}}>
-
+<AuPill
+  @icon={{this.PencilIcon}}
+  @iconAlignment="right"
+  class="variable atomic"
+  {{on 'click' @selectNode}}
+>
   {{this.humanReadableDate}}
   {{#if this.label}}
     <span class="label">

package/addon/components/variable-plugin/date/nodeview.ts

@@ -1,12 +1,10 @@
 import Component from '@glimmer/component';
 import {
   DecorationSource,
-  NodeSelection,
   PNode,
   SayController,
   SayView,
 } from '@lblod/ember-rdfa-editor';
-import { action } from '@ember/object';
 import IntlService from 'ember-intl/services/intl';
 import { service } from '@ember/service';
 import {
@@ -40,18 +38,6 @@ export default class DateNodeviewComponent extends Component<Args> {
     return this.controller.documentLanguage;
   }
 
-  @action
-  onClick() {
-    const tr = this.args.controller.activeEditorState.tr;
-    tr.setSelection(
-      NodeSelection.create(
-        this.args.controller.activeEditorState.doc,
-        this.args.getPos() as number,
-      ),
-    );
-    this.args.controller.activeEditorView.dispatch(tr);
-  }
-
   get humanReadableDate() {
     const value = getOutgoingTriple(this.args.node.attrs, EXT('content'))
       ?.object.value;

package/addon/plugins/snippet-plugin/nodes/snippet-placeholder.ts

@@ -0,0 +1,93 @@
+import { v4 as uuidv4 } from 'uuid';
+import {
+  getRdfaAttrs,
+  rdfaAttrSpec,
+  type Schema,
+} from '@lblod/ember-rdfa-editor';
+import { renderRdfaAware } from '@lblod/ember-rdfa-editor/core/schema';
+import { sayDataFactory } from '@lblod/ember-rdfa-editor/core/say-data-factory';
+import {
+  createEmberNodeSpec,
+  createEmberNodeView,
+  type EmberNodeConfig,
+} from '@lblod/ember-rdfa-editor/utils/ember-node';
+import SnippetPlaceholderComponent from '@lblod/ember-rdfa-editor-lblod-plugins/components/snippet-plugin/nodes/placeholder';
+import {
+  EXT,
+  RDF,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
+import { hasOutgoingNamedNodeTriple } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
+import { getTranslationFunction } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/translation';
+import { getSnippetUriFromId } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin';
+import { SNIPPET_LIST_RDFA_PREDICATE } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin/utils/rdfa-predicate';
+
+export function createSnippetPlaceholder(listIds: string[], schema: Schema) {
+  const mappingResource = `http://example.net/lblod-snippet-placeholder/${uuidv4()}`;
+
+  return schema.nodes.snippet_placeholder.create({
+    rdfaNodeType: 'resource',
+    subject: mappingResource,
+    properties: [
+      {
+        predicate: RDF('type').full,
+        object: sayDataFactory.namedNode(EXT('SnippetPlaceholder').full),
+      },
+      ...listIds.map((listId) => ({
+        predicate: SNIPPET_LIST_RDFA_PREDICATE.full,
+        object: sayDataFactory.namedNode(getSnippetUriFromId(listId)),
+      })),
+    ],
+  });
+}
+
+const emberNodeConfig: EmberNodeConfig = {
+  name: 'snippet_placeholder',
+  inline: false,
+  group: 'block',
+  atom: true,
+  selectable: true,
+  editable: true,
+  attrs: {
+    ...rdfaAttrSpec({ rdfaAware: true }),
+    typeof: { default: EXT('SnippetPlaceholder') },
+  },
+  component: SnippetPlaceholderComponent,
+  serialize(node, editorState) {
+    const t = getTranslationFunction(editorState);
+    return renderRdfaAware({
+      renderable: node,
+      tag: 'div',
+      attrs: node.attrs,
+      content: [
+        'div',
+        {},
+        t(
+          'snippet-plugin.insert.placeholder',
+          'Plaatshouder voor fragment invoegen',
+        ),
+      ],
+    });
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(node) {
+        if (typeof node === 'string') return false;
+        const rdfaAttrs = getRdfaAttrs(node, { rdfaAware: true });
+        if (
+          hasOutgoingNamedNodeTriple(
+            rdfaAttrs,
+            RDF('type'),
+            EXT('SnippetPlaceholder'),
+          )
+        ) {
+          return rdfaAttrs;
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const snippetPlaceholder = createEmberNodeSpec(emberNodeConfig);
+export const snippetPlaceholderView = createEmberNodeView(emberNodeConfig);

package/app/components/snippet-plugin/nodes/placeholder.js

@@ -0,0 +1 @@
+export { default } from '@lblod/ember-rdfa-editor-lblod-plugins/components/snippet-plugin/nodes/placeholder';

package/app/components/snippet-plugin/snippet-insert-placeholder.js

@@ -0,0 +1 @@
+export { default } from '@lblod/ember-rdfa-editor-lblod-plugins/components/snippet-plugin/snippet-insert-placeholder';

package/app/styles/snippet-plugin.scss

@@ -92,3 +92,7 @@
     }
   }
 }
+
+.ProseMirror-selectednode > .say-snippet-placeholder  {
+  background-color: var(--au-blue-200);
+}

package/declarations/addon/components/snippet-plugin/nodes/placeholder.d.ts

@@ -0,0 +1,8 @@
+import Component from '@glimmer/component';
+import { type EmberNodeArgs } from '@lblod/ember-rdfa-editor/utils/_private/ember-node';
+interface Signature {
+    Args: EmberNodeArgs;
+}
+export default class SnippetPluginPlaceholder extends Component<Signature> {
+}
+export {};

package/declarations/addon/components/snippet-plugin/snippet-insert-placeholder.d.ts

@@ -0,0 +1,17 @@
+import Component from '@glimmer/component';
+import { type NodeType, type SayController } from '@lblod/ember-rdfa-editor';
+import { type SnippetPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin';
+interface Signature {
+    Args: {
+        controller: SayController;
+        config: SnippetPluginConfig;
+    };
+}
+export default class SnippetPluginSnippetInsertPlaceholder extends Component<Signature> {
+    isModalOpen: boolean;
+    get placeholderNode(): NodeType | undefined;
+    openModal(): void;
+    closeModal(): void;
+    insertPlaceholder(listIds: string[]): void;
+}
+export {};

package/declarations/addon/components/snippet-plugin/snippet-list/snippet-list-modal.d.ts

@@ -1,21 +1,23 @@
 import Component from '@glimmer/component';
-import { Task } from 'ember-concurrency';
 import { OrderBy } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin/utils/fetch-data';
 import { SnippetPluginConfig, SnippetList } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin';
-interface Args {
-    config: SnippetPluginConfig;
-    onSaveSnippetListIds: Task<Promise<void>, [snippetIds: string[]]>;
-    assignedSnippetListsIds: string[];
-    closeModal: () => void;
+interface Signature {
+    Args: {
+        config: SnippetPluginConfig;
+        onSaveSnippetListIds: (listIds: string[]) => void;
+        assignedSnippetListsIds: string[];
+        closeModal: () => void;
+        open: boolean;
+    };
 }
-export default class SnippetListModalComponent extends Component<Args> {
+export default class SnippetListModalComponent extends Component<Signature> {
     nameFilterText: string | null;
     sort: OrderBy;
     error: unknown;
     assignedSnippetListsIds: string[];
     get config(): SnippetPluginConfig;
     closeModal(): void;
-    saveAndClose(): Promise<void>;
+    saveAndClose(): void;
     snippetListSearch: import("ember-concurrency").TaskForAsyncTaskFunction<unknown, () => Promise<SnippetList[]>>;
     snippetListResource: import("ember-resources/util/ember-concurrency").TaskInstance<SnippetList[]>;
     onChange(assignedSnippetListsIds: string[]): void;

package/declarations/addon/components/snippet-plugin/snippet-list-select-rdfa.d.ts

@@ -16,6 +16,6 @@ export default class SnippetListSelectRdfaComponent extends Component<Args> {
     get isResourceNode(): boolean;
     get snippetListIdsProperties(): OutgoingTriple[];
     get assignedSnippetListsIds(): string[];
-    saveChanges: import("ember-concurrency").TaskForAsyncTaskFunction<unknown, (snippetIds: string[]) => Promise<void>>;
+    saveChanges: (snippetIds: string[]) => void;
 }
 export {};

package/declarations/addon/components/snippet-plugin/snippet-list-select.d.ts

@@ -1,12 +1,13 @@
-import { Task } from 'ember-concurrency';
 import Component from '@glimmer/component';
 import { SnippetPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/snippet-plugin';
-interface Args {
-    config: SnippetPluginConfig;
-    assignedSnippetListsIds: string[];
-    onSaveSnippetListIds: Task<Promise<void>, [snippetIds: string[]]>;
+interface Signature {
+    Args: {
+        config: SnippetPluginConfig;
+        assignedSnippetListsIds: string[];
+        onSaveSnippetListIds: (listIds: string[]) => void;
+    };
 }
-export default class SnippetListSelectComponent extends Component<Args> {
+export default class SnippetListSelectComponent extends Component<Signature> {
     UnorderedListIcon: TOC<import("@appuniversum/ember-appuniversum/components/icons/unordered-list").UnorderedListIconSignature>;
     showModal: boolean;
     openModal(): void;

package/declarations/addon/components/variable-plugin/address/nodeview.d.ts

@@ -18,6 +18,5 @@ export default class AddressNodeviewComponent extends Component<Args> {
     get node(): PNode;
     get address(): Address | null;
     get label(): string | undefined;
-    selectThisNode(): void;
 }
 export {};

package/declarations/addon/components/variable-plugin/date/nodeview.d.ts

@@ -15,7 +15,6 @@ export default class DateNodeviewComponent extends Component<Args> {
     intl: IntlService;
     get controller(): SayController;
     get documentLanguage(): string;
-    onClick(): void;
     get humanReadableDate(): string;
     get label(): string | undefined;
 }

package/declarations/addon/plugins/snippet-plugin/nodes/snippet-placeholder.d.ts

@@ -0,0 +1,4 @@
+import { type Schema } from '@lblod/ember-rdfa-editor';
+export declare function createSnippetPlaceholder(listIds: string[], schema: Schema): import("prosemirror-model").Node;
+export declare const snippetPlaceholder: import("@lblod/ember-rdfa-editor/core/say-node-spec").default;
+export declare const snippetPlaceholderView: (controller: import("@lblod/ember-rdfa-editor").SayController) => import("@lblod/ember-rdfa-editor/utils/ember-node").SayNodeViewConstructor;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lblod/ember-rdfa-editor-lblod-plugins",
-  "version": "18.0.0",
+  "version": "18.1.0",
   "description": "Ember addon providing lblod specific plugins for the ember-rdfa-editor",
   "keywords": [
     "ember-addon",
@@ -31,17 +31,17 @@
   },
   "scripts": {
     "build": "ember build --environment=production",
-    "lint": "npm-run-all --print-name --aggregate-output --continue-on-error --parallel \"lint:!(fix)\"",
-    "lint:fix": "npm-run-all --print-name --aggregate-output --continue-on-error --parallel \"lint:*:fix\"",
+    "lint": "concurrently --group \"pnpm:lint:*(!fix)\"",
+    "lint:fix": "concurrently --group \"pnpm:lint:*:fix\"",
     "lint:hbs": "ember-template-lint .",
     "lint:hbs:fix": "ember-template-lint . --fix",
     "lint:js": "eslint . --cache",
     "lint:js:fix": "eslint . --fix",
     "lint:types": "glint",
-    "start": "concurrently -c \"auto\" -P \"npm:serve -- {@}\" \"npm:typecheck\" --",
+    "start": "concurrently -c \"auto\" -P \"pnpm:serve {@}\" \"pnpm:typecheck\" --",
     "typecheck": "glint --watch --preserveWatchOutput",
     "serve": "ember serve",
-    "test": "npm-run-all --print-name \"lint\" \"test:*\"",
+    "test": "concurrently --group pnpm:lint pnpm:test:*",
     "test:ember": "ember test",
     "test:ember-compatibility": "ember try:each",
     "release": "release-it",
@@ -70,6 +70,7 @@
     "ember-mu-transform-helpers": "^2.0.0",
     "ember-resources": "^6.1.1",
     "ember-template-imports": "^3.4.2",
+    "ember-truth-helpers": "^3.0.0",
     "ember-velcro": "^2.1.0",
     "fetch-sparql-endpoint": "^3.0.0",
     "n2words": "^1.18.0",
@@ -97,7 +98,7 @@
     "@glint/template": "^1.4.0",
     "@graphy/content.ttl.write": "^4.3.7",
     "@graphy/memory.dataset.fast": "4.3.3",
-    "@lblod/ember-rdfa-editor": "^9.7.0",
+    "@lblod/ember-rdfa-editor": "9.7.1-dev.67f7224891c720868d2e8ef0e92ce46d76959257",
     "@rdfjs/types": "^1.1.0",
     "@release-it/keep-a-changelog": "^3.1.0",
     "@tsconfig/ember": "^3.0.0",
@@ -163,7 +164,6 @@
     "eslint-plugin-prettier": "^5.0.0",
     "eslint-plugin-qunit": "^8.0.1",
     "loader.js": "^4.7.0",
-    "npm-run-all": "^4.1.5",
     "prettier": "^3.2.0",
     "prettier-plugin-ember-template-tag": "^2.0.1",
     "prosemirror-dev-tools": "^4.1.0",
@@ -180,7 +180,7 @@
     "@appuniversum/ember-appuniversum": "^3.4.1",
     "@ember/string": "3.x",
     "@glint/template": "^1.1.0",
-    "@lblod/ember-rdfa-editor": "^9.7.0",
+    "@lblod/ember-rdfa-editor": "^9.7.0 || 9.7.0-dev.321de5f78663980e776632137c59d03fd231148b",
     "ember-concurrency": "^2.3.7 || ^3.1.0",
     "ember-intl": "^5.7.2 || ^6.1.0",
     "ember-modifier": "^3.2.7",

package/pnpm-lock.yaml

@@ -58,16 +58,19 @@ dependencies:
     version: 6.3.0
   ember-concurrency:
     specifier: ^2.3.7 || ^3.1.0
-    version: 2.3.7(@babel/core@7.23.9)
+    version: 3.1.1(@babel/core@7.23.9)(ember-source@4.12.0)
   ember-mu-transform-helpers:
     specifier: ^2.0.0
     version: 2.1.2
   ember-resources:
     specifier: ^6.1.1
-    version: 6.5.1(@glimmer/component@1.1.2)(@glimmer/tracking@1.1.2)(@glint/template@1.4.0)(ember-concurrency@2.3.7)(ember-source@4.12.0)
+    version: 6.5.1(@glimmer/component@1.1.2)(@glimmer/tracking@1.1.2)(@glint/template@1.4.0)(ember-concurrency@3.1.1)(ember-source@4.12.0)
   ember-template-imports:
     specifier: ^3.4.2
     version: 3.4.2
+  ember-truth-helpers:
+    specifier: ^3.0.0
+    version: 3.1.1
   ember-velcro:
     specifier: ^2.1.0
     version: 2.1.3(ember-modifier@3.2.7)(ember-source@4.12.0)
@@ -146,8 +149,8 @@ devDependencies:
     specifier: 4.3.3
     version: 4.3.3
   '@lblod/ember-rdfa-editor':
-    specifier: ^9.7.0
-    version: 9.7.0(@appuniversum/ember-appuniversum@3.4.1)(@glint/template@1.4.0)(@lezer/common@1.2.1)(ember-changeset@4.1.2)(ember-cli-sass@11.0.1)(ember-intl@5.7.2)(ember-modifier@3.2.7)(ember-source@4.12.0)(webpack@5.90.3)
+    specifier: 9.7.1-dev.67f7224891c720868d2e8ef0e92ce46d76959257
+    version: 9.7.1-dev.67f7224891c720868d2e8ef0e92ce46d76959257(@appuniversum/ember-appuniversum@3.4.1)(@glint/template@1.4.0)(@lezer/common@1.2.1)(ember-changeset@4.1.2)(ember-cli-sass@11.0.1)(ember-intl@5.7.2)(ember-modifier@3.2.7)(ember-source@4.12.0)(webpack@5.90.3)
   '@rdfjs/types':
     specifier: ^1.1.0
     version: 1.1.0
@@ -343,9 +346,6 @@ devDependencies:
   loader.js:
     specifier: ^4.7.0
     version: 4.7.0
-  npm-run-all:
-    specifier: ^4.1.5
-    version: 4.1.5
   prettier:
     specifier: ^3.2.0
     version: 3.2.5
@@ -2792,8 +2792,8 @@ packages:
       '@jridgewell/resolve-uri': 3.1.2
       '@jridgewell/sourcemap-codec': 1.4.15
 
-  /@lblod/ember-rdfa-editor@9.7.0(@appuniversum/ember-appuniversum@3.4.1)(@glint/template@1.4.0)(@lezer/common@1.2.1)(ember-changeset@4.1.2)(ember-cli-sass@11.0.1)(ember-intl@5.7.2)(ember-modifier@3.2.7)(ember-source@4.12.0)(webpack@5.90.3):
-    resolution: {integrity: sha512-bMmC0sL5NuIg5R7V2fCGJQDioggIpudNE26gow1uJ02AjtFWSREDmPByLMUhAndPswudwR+2wbA+Nejt6teypg==}
+  /@lblod/ember-rdfa-editor@9.7.1-dev.67f7224891c720868d2e8ef0e92ce46d76959257(@appuniversum/ember-appuniversum@3.4.1)(@glint/template@1.4.0)(@lezer/common@1.2.1)(ember-changeset@4.1.2)(ember-cli-sass@11.0.1)(ember-intl@5.7.2)(ember-modifier@3.2.7)(ember-source@4.12.0)(webpack@5.90.3):
+    resolution: {integrity: sha512-PRKSju6sgYr0iWVmQTpH9XbkJ8Jx365s6KcrZubtSAKkchSdCX2L4qXWR7qzDFXN34wdGpdwISoHN9VR0N54Yg==}
     engines: {node: 16.* || 18.* || >= 20}
     peerDependencies:
       '@appuniversum/ember-appuniversum': ^2.15.0 || ^3.0.0
@@ -2832,7 +2832,7 @@ packages:
       ember-cli-babel: 8.2.0(@babel/core@7.23.9)
       ember-cli-htmlbars: 6.3.0
       ember-cli-sass: 11.0.1
-      ember-focus-trap: 1.0.2
+      ember-focus-trap: 1.1.0(ember-source@4.12.0)
       ember-intl: 5.7.2(typescript@5.3.3)
       ember-modifier: 3.2.7(@babel/core@7.23.9)
       ember-source: 4.12.0(@babel/core@7.23.9)(@glimmer/component@1.1.2)(@glint/template@1.4.0)(webpack@5.90.3)
@@ -8286,6 +8286,7 @@ packages:
     transitivePeerDependencies:
       - '@babel/core'
       - supports-color
+    dev: true
 
   /ember-concurrency@3.1.1(@babel/core@7.23.9)(ember-source@4.12.0):
     resolution: {integrity: sha512-doXFYYfy1C7jez+jDDlfahTp03QdjXeSY/W3Zbnx/q3UNJ9g10Shf2d7M/HvWo/TC22eU+6dPLIpqd/6q4pR+Q==}
@@ -8304,7 +8305,6 @@ packages:
     transitivePeerDependencies:
       - '@babel/core'
       - supports-color
-    dev: true
 
   /ember-data-table@2.1.0:
     resolution: {integrity: sha512-h/rI5K9woEafshFAjTfMVhfXK91aEjsXJO1zsYsY6aXZBfiNXWbCfrrnMk8W5Q3c8uPeNPyZ12W0//i/wQmGTg==}
@@ -8333,6 +8333,7 @@ packages:
     transitivePeerDependencies:
       - '@babel/core'
       - supports-color
+    dev: true
 
   /ember-disable-prototype-extensions@1.1.3:
     resolution: {integrity: sha512-SB9NcZ27OtoUk+gfalsc3QU17+54OoqR668qHcuvHByk4KAhGxCKlkm9EBlKJcGr7yceOOAJqohTcCEBqfRw9g==}
@@ -8408,16 +8409,6 @@ packages:
       - webpack
     dev: true
 
-  /ember-focus-trap@1.0.2:
-    resolution: {integrity: sha512-/8Cx9KI7uqoMaNN4Iyxc24P2JIvAcCL3cI1tYdZRHTwTd1sG6esEZWOnpxZOSE7m4xHww8HVUSiXzgyqD8YIhA==}
-    engines: {node: 12.* || >= 14}
-    dependencies:
-      '@embroider/addon-shim': 1.8.7
-      focus-trap: 6.9.4
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /ember-focus-trap@1.1.0(ember-source@4.12.0):
     resolution: {integrity: sha512-KxbCKpAJaBVZm+bW4tHPoBJAZThmxa6pI+WQusL+bj0RtAnGUNkWsVy6UBMZ5QqTQzf4EvGHkCVACVp5lbAWMQ==}
     engines: {node: 12.* || >= 14}
@@ -8657,7 +8648,7 @@ packages:
       - supports-color
     dev: true
 
-  /ember-resources@6.5.1(@glimmer/component@1.1.2)(@glimmer/tracking@1.1.2)(@glint/template@1.4.0)(ember-concurrency@2.3.7)(ember-source@4.12.0):
+  /ember-resources@6.5.1(@glimmer/component@1.1.2)(@glimmer/tracking@1.1.2)(@glint/template@1.4.0)(ember-concurrency@3.1.1)(ember-source@4.12.0):
     resolution: {integrity: sha512-8eEdbSE0sioqjpB2CWw/dKF4Ftfe9tbebuSUfMDBmP3xxTIvxTDbvDnbd8A0IbQ0z/iQt6Va+/5cadzvkbMZtg==}
     peerDependencies:
       '@ember/test-waiters': ^3.0.0
@@ -8681,7 +8672,7 @@ packages:
       '@glimmer/tracking': 1.1.2
       '@glint/template': 1.4.0
       ember-async-data: 1.0.3(ember-source@4.12.0)
-      ember-concurrency: 2.3.7(@babel/core@7.23.9)
+      ember-concurrency: 3.1.1(@babel/core@7.23.9)(ember-source@4.12.0)
       ember-source: 4.12.0(@babel/core@7.23.9)(@glimmer/component@1.1.2)(@glint/template@1.4.0)(webpack@5.90.3)
     transitivePeerDependencies:
       - supports-color
@@ -8860,7 +8851,6 @@ packages:
       ember-cli-babel: 7.26.11
     transitivePeerDependencies:
       - supports-color
-    dev: true
 
   /ember-try-config@4.0.0:
     resolution: {integrity: sha512-jAv7fqYJK7QYYekPc/8Nr7KOqDpv/asqM6F8xcRnbmf9UrD35BkSffY63qUuiD9e0aR5qiMNBIQzH8f65rGDqw==}
@@ -12031,16 +12021,6 @@ packages:
     resolution: {integrity: sha512-5MP0uUeVCec89ZbNOT/i97Mc+q3SxXmiUGhRFOTmhrGPn//uWVQdCvcLJDy64MSBR5MidFdOR7B9viumoavy6g==}
     dev: true
 
-  /load-json-file@4.0.0:
-    resolution: {integrity: sha512-Kx8hMakjX03tiGTLAIdJ+lL0htKnXjEZN6hk/tozf/WOuYGdZBJrZ+rCJRbVCugsjB3jMLn9746NsQIf5VjBMw==}
-    engines: {node: '>=4'}
-    dependencies:
-      graceful-fs: 4.2.11
-      parse-json: 4.0.0
-      pify: 3.0.0
-      strip-bom: 3.0.0
-    dev: true
-
   /load-yaml-file@0.2.0:
     resolution: {integrity: sha512-OfCBkGEw4nN6JLtgRidPX6QxjBQGQf72q3si2uvqyFEMbycSFFHwAZeXx6cJgFM9wmLrf9zBwCP3Ivqa+LLZPw==}
     engines: {node: '>=6'}
@@ -12579,11 +12559,6 @@ packages:
     dependencies:
       readable-stream: 1.0.34
 
-  /memorystream@0.3.1:
-    resolution: {integrity: sha512-S3UwM3yj5mtUSEfP41UZmt/0SCoVYUcU1rkXv+BQ5Ig8ndL4sPoJNBUJERafdPb5jjHJGuMgytgKvKIf58XNBw==}
-    engines: {node: '>= 0.10.0'}
-    dev: true
-
   /meow@6.1.1:
     resolution: {integrity: sha512-3YffViIt2QWgTy6Pale5QpopX/IvU3LPL03jOTqp6pGj3VjesdO/U8CuHMKpnQr4shCNCM5fd5XFFvIIl6JBHg==}
     engines: {node: '>=8'}
@@ -13328,22 +13303,6 @@ packages:
       validate-npm-package-name: 5.0.0
     dev: true
 
-  /npm-run-all@4.1.5:
-    resolution: {integrity: sha512-Oo82gJDAVcaMdi3nuoKFavkIHBRVqQ1qvMb+9LHk/cF4P6B2m8aP04hGf7oL6wZ9BuGwX1onlLhpuoofSyoQDQ==}
-    engines: {node: '>= 4'}
-    hasBin: true
-    dependencies:
-      ansi-styles: 3.2.1
-      chalk: 2.4.2
-      cross-spawn: 6.0.5
-      memorystream: 0.3.1
-      minimatch: 3.1.2
-      pidtree: 0.3.1
-      read-pkg: 3.0.0
-      shell-quote: 1.8.1
-      string.prototype.padend: 3.1.5
-    dev: true
-
   /npm-run-path@2.0.2:
     resolution: {integrity: sha512-lJxZYlT4DW/bRUtFh1MQIWqmLwQfAxnqWG4HhEdjMlkrJYnJn0Jrr2u3mgxqaWsdiBc76TYkTG/mhrnYTuzfHw==}
     engines: {node: '>=4'}
@@ -13868,14 +13827,6 @@ packages:
       pbkdf2: 3.1.2
       safe-buffer: 5.2.1
 
-  /parse-json@4.0.0:
-    resolution: {integrity: sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw==}
-    engines: {node: '>=4'}
-    dependencies:
-      error-ex: 1.3.2
-      json-parse-better-errors: 1.0.2
-    dev: true
-
   /parse-json@5.2.0:
     resolution: {integrity: sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==}
     engines: {node: '>=8'}
@@ -13990,13 +13941,6 @@ packages:
     resolution: {integrity: sha512-JLyh7xT1kizaEvcaXOQwOc2/Yhw6KZOvPf1S8401UyLk86CU79LN3vl7ztXGm/pZ+YjoyAJ4rxmHwbkBXJX+yw==}
     dev: true
 
-  /path-type@3.0.0:
-    resolution: {integrity: sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==}
-    engines: {node: '>=4'}
-    dependencies:
-      pify: 3.0.0
-    dev: true
-
   /path-type@4.0.0:
     resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
     engines: {node: '>=8'}
@@ -14020,17 +13964,6 @@ packages:
     engines: {node: '>=8.6'}
     dev: true
 
-  /pidtree@0.3.1:
-    resolution: {integrity: sha512-qQbW94hLHEqCg7nhby4yRC7G2+jYHY4Rguc2bjw7Uug4GIJuu1tvf2uHaZv5Q8zdt+WKJ6qK1FOI6amaWUo5FA==}
-    engines: {node: '>=0.10'}
-    hasBin: true
-    dev: true
-
-  /pify@3.0.0:
-    resolution: {integrity: sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==}
-    engines: {node: '>=4'}
-    dev: true
-
   /pify@4.0.1:
     resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
     engines: {node: '>=6'}
@@ -14771,15 +14704,6 @@ packages:
       type-fest: 0.8.1
     dev: true
 
-  /read-pkg@3.0.0:
-    resolution: {integrity: sha512-BLq/cCO9two+lBgiTYNqD6GdtK8s4NpaWrl6/rCO9w0TUS8oJl7cmToOZfRYllKTISY6nt1U7jQ53brmKqY6BA==}
-    engines: {node: '>=4'}
-    dependencies:
-      load-json-file: 4.0.0
-      normalize-package-data: 2.5.0
-      path-type: 3.0.0
-    dev: true
-
   /read-pkg@5.2.0:
     resolution: {integrity: sha512-Ug69mNOpfvKDAc2Q8DRpMjjzdtrnv9HcSMX+4VsZxD1aZ6ZzrIE7rlzXBtWTyhULSMKg076AW6WR5iZpD0JiOg==}
     engines: {node: '>=8'}
@@ -15463,7 +15387,7 @@ packages:
     resolution: {integrity: sha512-0Ju4+6A8iOnpL/Thra7dZsSlOHYAHIeMxfhWQRI1/VLcT3WDBZKKtQt/QkBOsiIN9ZpuvHE6cGZ0x4glCMmfiA==}
     engines: {node: '>=12'}
     dependencies:
-      semver: 7.5.1
+      semver: 7.6.0
     dev: true
 
   /semver@5.7.2:
@@ -16104,15 +16028,6 @@ packages:
       set-function-name: 2.0.2
       side-channel: 1.0.5
 
-  /string.prototype.padend@3.1.5:
-    resolution: {integrity: sha512-DOB27b/2UTTD+4myKUFh+/fXWcu/UDyASIXfg+7VzoCNNGOfWvoyU/x5pvVHr++ztyt/oSYI1BcWBBG/hmlNjA==}
-    engines: {node: '>= 0.4'}
-    dependencies:
-      call-bind: 1.0.7
-      define-properties: 1.2.1
-      es-abstract: 1.22.4
-    dev: true
-
   /string.prototype.trim@1.2.8:
     resolution: {integrity: sha512-lfjY4HcixfQXOfaqCvcBuOIapyaroTXhbkfJN3gcB1OtyupngWK4sEET9Knd0cXd28kTUqu/kHoV4HKSJdnjiQ==}
     engines: {node: '>= 0.4'}

package/translations/en-US.yaml

@@ -262,6 +262,10 @@ generic-rdfa-variable:
 snippet-plugin:
   insert:
     title: Insert snippet
+    placeholder: Insert snippet placeholder
+  placeholder:
+    title: Insert snippet here
+    text: Select this then insert the desired snippet
   modal:
     title: Choose a snippet
     select: Select

package/translations/nl-BE.yaml

@@ -266,6 +266,10 @@ generic-rdfa-variable:
 snippet-plugin:
   insert:
     title: Fragment invoegen
+    placeholder: Plaatshouder voor fragment invoegen
+  placeholder:
+    title: Fragment hier invoegen
+    text: Selecteer dit en voeg het gewenste fragment in
   modal:
     title: Kies een fragment
     select: Selecteer

package/types/ember-truth-helpers/helpers/and.d.ts

@@ -0,0 +1,80 @@
+// Temporary type since we still support ember-truth-helpers v3. v4 has its own types, so we can remove this when we drop v3 support.
+import type Helper from '@ember/component/helper';
+
+type TruthConvert<T> = T extends {
+  isTruthy: true;
+}
+  ? true
+  : T extends {
+        isTruthy: false;
+      }
+    ? false
+    : T extends {
+          isTruthy: boolean;
+        }
+      ? boolean
+      : T extends undefined | null
+        ? false
+        : T extends boolean
+          ? T
+          : T extends number
+            ? T extends 0 | -0
+              ? false
+              : number extends T
+                ? boolean
+                : true
+            : T extends bigint
+              ? T extends 0n
+                ? false
+                : bigint extends T
+                  ? boolean
+                  : true
+              : T extends string
+                ? T extends ''
+                  ? false
+                  : string extends T
+                    ? boolean
+                    : true
+                : T extends never[]
+                  ? false
+                  : T extends ArrayLike<unknown>
+                    ? boolean
+                    : T extends object
+                      ? true
+                      : boolean;
+
+type MaybeTruthy =
+  | {
+      isTruthy: boolean;
+    }
+  | undefined
+  | null
+  | boolean
+  | number
+  | bigint
+  | string
+  | unknown[]
+  | object;
+
+type FirstFalsy<T> = T extends [infer Item]
+  ? Item
+  : T extends [infer Head, ...infer Tail]
+    ? TruthConvert<Head> extends false
+      ? Head
+      : TruthConvert<Head> extends true
+        ? FirstFalsy<Tail>
+        : Head | FirstFalsy<Tail>
+    : undefined;
+
+interface AndSignature<T extends MaybeTruthy[]> {
+  Args: {
+    Positional: T;
+  };
+  Return: FirstFalsy<T>;
+}
+
+export default class AndHelper<const T extends MaybeTruthy[]> extends Helper<
+  AndSignature<T>
+> {
+  compute(params: T): FirstFalsy<T>;
+}

package/types/ember-truth-helpers/helpers/eq.d.ts

@@ -0,0 +1,2 @@
+// Temporary type since we still support ember-truth-helpers v3. v4 has its own types, so we can remove this when we drop v3 support.
+export default function eq(left: unknown, right: unknown): boolean;

package/types/ember-truth-helpers/helpers/not.d.ts

@@ -0,0 +1,15 @@
+// Temporary type since we still support ember-truth-helpers v3. v4 has its own types, so we can remove this when we drop v3 support.
+type MaybeTruthy =
+  | {
+      isTruthy: boolean;
+    }
+  | undefined
+  | null
+  | boolean
+  | number
+  | bigint
+  | string
+  | unknown[]
+  | object;
+
+export default function not(...params: MaybeTruthy[]): boolean;