@lblod/ember-rdfa-editor-lblod-plugins 2.1.2 → 4.0.1

package/addon/components/article-structure-plugin/structure-card.ts

@@ -1,6 +1,6 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
-import { ProseController } from '@lblod/ember-rdfa-editor';
+import { SayController } from '@lblod/ember-rdfa-editor';
 import {
   moveSelectedStructure,
   removeStructure,
@@ -13,10 +13,8 @@ import { inject as service } from '@ember/service';
 import IntlService from 'ember-intl/services/intl';
 
 type Args = {
-  controller: ProseController;
-  widgetArgs: {
-    options: ArticleStructurePluginOptions;
-  };
+  controller: SayController;
+  options: ArticleStructurePluginOptions;
 };
 
 export default class EditorPluginsStructureCardComponent extends Component<Args> {
@@ -30,7 +28,8 @@ export default class EditorPluginsStructureCardComponent extends Component<Args>
   @action
   moveStructure(direction: 'up' | 'down') {
     this.controller.doCommand(
-      moveSelectedStructure(this.structureTypes, direction, this.intl)
+      moveSelectedStructure(this.structureTypes, direction, this.intl),
+      { view: this.controller.mainEditorView }
     );
     this.controller.focus();
   }
@@ -38,9 +37,10 @@ export default class EditorPluginsStructureCardComponent extends Component<Args>
   @action
   removeStructure() {
     if (this.structure && this.currentStructureType) {
-      if (this.removeStructureContent) {
+      if (this.removeStructureContent || this.currentStructureType.noUnwrap) {
         this.controller.doCommand(
-          removeStructure(this.structure, this.structureTypes)
+          removeStructure(this.structure, this.structureTypes),
+          { view: this.controller.mainEditorView }
         );
       } else {
         this.controller.doCommand(
@@ -50,7 +50,8 @@ export default class EditorPluginsStructureCardComponent extends Component<Args>
               type: this.currentStructureType,
             },
             this.structureTypes
-          )
+          ),
+          { view: this.controller.mainEditorView }
         );
       }
     }
@@ -63,7 +64,7 @@ export default class EditorPluginsStructureCardComponent extends Component<Args>
   }
 
   get structureTypes() {
-    return this.args.widgetArgs.options;
+    return this.args.options;
   }
 
   get structureNodeSpecs() {
@@ -73,7 +74,7 @@ export default class EditorPluginsStructureCardComponent extends Component<Args>
   }
 
   get structure() {
-    const currentSelection = this.controller.state.selection;
+    const currentSelection = this.controller.mainEditorState.selection;
     return findAncestorOfType(currentSelection, ...this.structureNodeSpecs);
   }
 
@@ -93,19 +94,21 @@ export default class EditorPluginsStructureCardComponent extends Component<Args>
 
   get canMoveDown() {
     return this.controller.checkCommand(
-      moveSelectedStructure(this.structureTypes, 'down', this.intl)
+      moveSelectedStructure(this.structureTypes, 'down', this.intl),
+      { view: this.controller.mainEditorView }
     );
   }
 
   get canMoveUp() {
     return this.controller.checkCommand(
-      moveSelectedStructure(this.structureTypes, 'up', this.intl)
+      moveSelectedStructure(this.structureTypes, 'up', this.intl),
+      { view: this.controller.mainEditorView }
     );
   }
 
   get canRemoveStructure() {
     if (this.structure && this.currentStructureType) {
-      if (this.removeStructureContent) {
+      if (this.removeStructureContent || this.currentStructureType.noUnwrap) {
         return true;
       } else {
         return this.controller.checkCommand(
@@ -115,7 +118,8 @@ export default class EditorPluginsStructureCardComponent extends Component<Args>
               type: this.currentStructureType,
             },
             this.structureTypes
-          )
+          ),
+          { view: this.controller.mainEditorView }
         );
       }
     }

package/addon/components/besluit-plugin/besluit-plugin-card.ts

@@ -1,12 +1,12 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
 import { insertTitle } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/besluit-plugin/commands';
-import { ProseController } from '@lblod/ember-rdfa-editor';
+import { SayController } from '@lblod/ember-rdfa-editor';
 import { inject as service } from '@ember/service';
 import IntlService from 'ember-intl/services/intl';
 
 type Args = {
-  controller: ProseController;
+  controller: SayController;
 };
 
 export default class BesluitPluginCardComponent extends Component<Args> {
@@ -21,11 +21,15 @@ export default class BesluitPluginCardComponent extends Component<Args> {
 
   @action
   insertTitle() {
-    this.controller.doCommand(insertTitle(this.intl));
+    this.controller.doCommand(insertTitle(this.intl), {
+      view: this.controller.mainEditorView,
+    });
     this.focus();
   }
 
   get canInsertTitle() {
-    return this.controller.checkCommand(insertTitle(this.intl));
+    return this.controller.checkCommand(insertTitle(this.intl), {
+      view: this.controller.mainEditorView,
+    });
   }
 }

package/addon/components/besluit-type-plugin/toolbar-dropdown.hbs

@@ -1,4 +1,4 @@
-<div {{did-update this.updateBesluitTypes @controller.state}} 
+<div {{did-update this.updateBesluitTypes @controller.mainEditorState}} 
      {{did-update this.updateBesluitTypes this.types.value}}>
 {{#if this.showCard}}
   {{#if this.types.isError}}
@@ -6,7 +6,7 @@
       @skin="error"
       @icon="circle-x"
       @iconAlignment="left"
-      class="au-c-pill--link"
+      class="au-c-pill--link besluit-toolbar-pill"
       {{on "click" this.toggleCard}}>
       {{t "besluit-type-plugin.error-short"}}
     </AuPill>

package/addon/components/besluit-type-plugin/toolbar-dropdown.ts

@@ -7,16 +7,16 @@ import {
   addType,
   removeType,
 } from '@lblod/ember-rdfa-editor/commands/type-commands';
-import { ProseController } from '@lblod/ember-rdfa-editor/core/prosemirror';
+import { SayController } from '@lblod/ember-rdfa-editor';
 import CurrentSessionService from '@lblod/frontend-gelinkt-notuleren/services/current-session';
 import { ResolvedPNode } from '@lblod/ember-rdfa-editor/plugins/datastore';
-import { unwrap } from '@lblod/ember-rdfa-editor/utils/option';
 import { getRdfaAttribute } from '@lblod/ember-rdfa-editor/utils/rdfa-utils';
 import fetchBesluitTypes, {
   BesluitType,
 } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/besluit-type-plugin/utils/fetchBesluitTypes';
 import { findAncestorOfType } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/article-structure-plugin/utils/structure';
 import { trackedFunction } from 'ember-resources/util/function';
+import { unwrap } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
 
 declare module 'ember__owner' {
   export default interface Owner {
@@ -25,7 +25,7 @@ declare module 'ember__owner' {
 }
 
 type Args = {
-  controller: ProseController;
+  controller: SayController;
 };
 
 export default class EditorPluginsToolbarDropdownComponent extends Component<Args> {
@@ -56,7 +56,7 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
   }
 
   get doc() {
-    return this.controller.state.doc;
+    return this.controller.mainEditorState.doc;
   }
 
   types = trackedFunction(this, async () => {
@@ -71,7 +71,7 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
   });
 
   get currentBesluitRange(): ResolvedPNode | undefined {
-    const selection = this.controller.state.selection;
+    const selection = this.controller.mainEditorState.selection;
     const besluit = findAncestorOfType(
       selection,
       this.controller.schema.nodes['besluit']
@@ -104,7 +104,7 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
       return;
     }
     const besluit = findAncestorOfType(
-      this.controller.state.selection,
+      this.controller.mainEditorState.selection,
       this.controller.schema.nodes['besluit']
     );
     const besluitTypeof = besluit?.node.attrs.typeof as string;
@@ -206,12 +206,14 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
     if (this.besluitType && this.currentBesluitRange) {
       this.cardExpanded = false;
       if (this.previousBesluitType) {
-        this.controller.checkAndDoCommand(
-          removeType(this.currentBesluitRange.from, this.previousBesluitType)
+        this.controller.doCommand(
+          removeType(this.currentBesluitRange.from, this.previousBesluitType),
+          { view: this.controller.mainEditorView }
         );
       }
-      this.controller.checkAndDoCommand(
-        addType(this.currentBesluitRange.from, this.besluitType.uri)
+      this.controller.doCommand(
+        addType(this.currentBesluitRange.from, this.besluitType.uri),
+        { view: this.controller.mainEditorView }
       );
     }
   }

package/addon/components/citation-plugin/citation-card.hbs

@@ -11,6 +11,10 @@
       this.documentText
       this.documentLegislationType
     }}
+    {{did-update
+      this.update
+      this.activeDecoration
+    }}
     as |c|
   >
     <c.header>

package/addon/components/citation-plugin/citation-card.ts

@@ -19,7 +19,7 @@ import {
   CitationDecoration,
   CitationPlugin,
 } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin';
-import { ProseController, Transaction } from '@lblod/ember-rdfa-editor';
+import { SayController, Transaction } from '@lblod/ember-rdfa-editor';
 import { citedText } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin/utils/cited-text';
 import {
   LEGISLATION_TYPES,
@@ -27,10 +27,8 @@ import {
 } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin/utils/legislation-types';
 
 interface Args {
-  controller: ProseController;
-  widgetArgs: {
-    plugin: CitationPlugin;
-  };
+  controller: SayController;
+  plugin: CitationPlugin;
 }
 
 export default class CitationCardComponent extends Component<Args> {
@@ -44,8 +42,23 @@ export default class CitationCardComponent extends Component<Args> {
   @tracked decision: Decision | null = null;
   @tracked cardText: string | null = null;
   @tracked cardLegislationType: string | null = null;
+  @tracked documentLegislationType: Option<string>;
+  @tracked documentText: Option<string>;
 
-  get controller(): ProseController {
+  @action
+  update() {
+    if (this.activeDecoration) {
+      const { legislationTypeUri, searchText } = this.activeDecoration?.spec;
+      if (legislationTypeUri !== this.documentLegislationType) {
+        this.documentLegislationType = legislationTypeUri;
+      }
+      if (searchText !== this.documentText) {
+        this.documentText = searchText;
+      }
+    }
+  }
+
+  get controller(): SayController {
     return this.args.controller;
   }
 
@@ -54,26 +67,18 @@ export default class CitationCardComponent extends Component<Args> {
   }
 
   get plugin() {
-    return this.args.widgetArgs.plugin;
+    return this.args.plugin;
   }
 
   get decorations() {
-    return this.plugin.getState(this.controller.state)?.highlights;
+    return this.plugin.getState(this.controller.mainEditorState)?.highlights;
   }
 
   get activeDecoration(): Option<CitationDecoration> {
-    const { from, to } = this.controller.state.selection;
+    const { from, to } = this.controller.mainEditorState.selection;
     return this.decorations?.find(from, to)[0];
   }
 
-  get documentLegislationType(): Option<string> {
-    return this.activeDecoration?.spec.legislationTypeUri;
-  }
-
-  get documentText(): Option<string> {
-    return this.activeDecoration?.spec.searchText;
-  }
-
   get searchText(): string {
     return (this.cardText ?? this.documentText) || '';
   }
@@ -186,14 +191,16 @@ export default class CitationCardComponent extends Component<Args> {
     const uri = decision.uri;
     const title = decision.title ?? '';
     const { from, to } = unwrap(this.activeDecoration);
-    this.controller.withTransaction((tr: Transaction) =>
-      tr
-        .replaceRangeWith(
-          from,
-          to,
-          citedText(this.controller.schema, title, uri)
-        )
-        .scrollIntoView()
+    this.controller.withTransaction(
+      (tr: Transaction) =>
+        tr
+          .replaceRangeWith(
+            from,
+            to,
+            citedText(this.controller.schema, title, uri)
+          )
+          .scrollIntoView(),
+      { view: this.controller.mainEditorView }
     );
   }
 
@@ -205,14 +212,16 @@ export default class CitationCardComponent extends Component<Args> {
       title = `${decision.title}, ${article.number || ''}`;
     }
     const { from, to } = unwrap(this.activeDecoration);
-    this.controller.withTransaction((tr: Transaction) =>
-      tr
-        .replaceRangeWith(
-          from,
-          to,
-          citedText(this.controller.schema, title, uri)
-        )
-        .scrollIntoView()
+    this.controller.withTransaction(
+      (tr: Transaction) =>
+        tr
+          .replaceRangeWith(
+            from,
+            to,
+            citedText(this.controller.schema, title, uri)
+          )
+          .scrollIntoView(),
+      { view: this.controller.mainEditorView }
     );
   }
 

package/addon/components/citation-plugin/citation-insert.ts

@@ -3,7 +3,7 @@ import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
 import {
   Fragment,
-  ProseController,
+  SayController,
   Slice,
   Transaction,
 } from '@lblod/ember-rdfa-editor';
@@ -12,10 +12,7 @@ import {
   Decision,
 } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin/utils/vlaamse-codex';
 import { citedText } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin/utils/cited-text';
-import {
-  CitationPlugin,
-  CitationPluginConfig,
-} from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin';
+import { CitationPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin';
 import {
   LEGISLATION_TYPE_CONCEPTS,
   LEGISLATION_TYPES,
@@ -24,8 +21,8 @@ import { unwrap } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
 import { findParentNodeOfType } from '@curvenote/prosemirror-utils';
 
 interface Args {
-  controller: ProseController;
-  widgetArgs: { plugin: CitationPlugin; config: CitationPluginConfig };
+  controller: SayController;
+  config: CitationPluginConfig;
 }
 
 export default class EditorPluginsCitationInsertComponent extends Component<Args> {
@@ -35,7 +32,7 @@ export default class EditorPluginsCitationInsertComponent extends Component<Args
   @tracked legislationType: string | null = null;
 
   get config() {
-    return this.args.widgetArgs.config;
+    return this.args.config;
   }
 
   get selectedLegislationTypeUri(): string {
@@ -63,9 +60,11 @@ export default class EditorPluginsCitationInsertComponent extends Component<Args
     if (this.controller.inEmbeddedView) {
       return true;
     }
-    const { selection } = this.controller.state;
+    const { selection } = this.controller.mainEditorState;
     if (this.config.type === 'ranges') {
-      const ranges = this.config.activeInRanges(this.controller.state);
+      const ranges = this.config.activeInRanges(
+        this.controller.mainEditorState
+      );
       for (const range of ranges) {
         if (selection.from > range[0] && selection.from < range[1]) {
           return false;
@@ -75,20 +74,12 @@ export default class EditorPluginsCitationInsertComponent extends Component<Args
     } else {
       const nodeTypes = this.config.activeInNodeTypes(
         this.controller.schema,
-        this.controller.state
+        this.controller.mainEditorState
       );
       return !findParentNodeOfType([...nodeTypes])(selection);
     }
   }
 
-  get plugin() {
-    return this.args.widgetArgs.plugin;
-  }
-
-  get activeRanges() {
-    return this.plugin.getState(this.controller.state)?.activeRanges;
-  }
-
   get controller() {
     return this.args.controller;
   }
@@ -113,19 +104,21 @@ export default class EditorPluginsCitationInsertComponent extends Component<Args
     const type = decision.legislationType?.label || '';
     const uri = decision.uri;
     const title = decision.title ?? '';
-    this.controller.withTransaction((tr: Transaction) =>
-      tr
-        .replaceSelection(
-          new Slice(
-            Fragment.fromArray([
-              this.controller.schema.text(`${type} `),
-              citedText(this.controller.schema, title, uri),
-            ]),
-            0,
-            0
+    this.controller.withTransaction(
+      (tr: Transaction) =>
+        tr
+          .replaceSelection(
+            new Slice(
+              Fragment.fromArray([
+                this.controller.schema.text(`${type} `),
+                citedText(this.controller.schema, title, uri),
+              ]),
+              0,
+              0
+            )
           )
-        )
-        .scrollIntoView()
+          .scrollIntoView(),
+      { view: this.controller.mainEditorView }
     );
   }
 
@@ -137,12 +130,14 @@ export default class EditorPluginsCitationInsertComponent extends Component<Args
     if (decision.title) {
       title = `${decision.title}, ${article.number ?? ''}`;
     }
-    const { from, to } = this.args.controller.state.selection;
-    this.controller.withTransaction((tr: Transaction) =>
-      tr.replaceWith(from, to, [
-        this.controller.schema.text(`${type} `),
-        citedText(this.controller.schema, title, uri),
-      ])
+    const { from, to } = this.controller.mainEditorState.selection;
+    this.controller.withTransaction(
+      (tr: Transaction) =>
+        tr.replaceWith(from, to, [
+          this.controller.schema.text(`${type} `),
+          citedText(this.controller.schema, title, uri),
+        ]),
+      { view: this.controller.mainEditorView }
     );
   }
 }

package/addon/components/import-snippet-plugin/card.ts

@@ -2,13 +2,13 @@ import Component from '@glimmer/component';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
 import { ProseParser } from '@lblod/ember-rdfa-editor';
-import { ProseController } from '@lblod/ember-rdfa-editor/core/prosemirror';
+import { SayController } from '@lblod/ember-rdfa-editor';
 import ImportRdfaSnippet from '@lblod/ember-rdfa-editor-lblod-plugins/services/import-rdfa-snippet';
 import { RdfaSnippet } from '@lblod/ember-rdfa-editor-lblod-plugins/services/import-rdfa-snippet';
 import { findParentNodeOfType } from '@curvenote/prosemirror-utils';
 
 type Args = {
-  controller: ProseController;
+  controller: SayController;
 };
 export default class ImportSnippetPluginCard extends Component<Args> {
   @service declare importRdfaSnippet: ImportRdfaSnippet;
@@ -22,7 +22,7 @@ export default class ImportSnippetPluginCard extends Component<Args> {
   }
 
   get insertRange() {
-    const { selection } = this.controller.state;
+    const { selection } = this.controller.mainEditorState;
     const besluit = findParentNodeOfType(this.controller.schema.nodes.besluit)(
       selection
     );
@@ -41,9 +41,12 @@ export default class ImportSnippetPluginCard extends Component<Args> {
     const insertRange = this.insertRange;
     if (insertRange) {
       const node = this.generateSnippetHtml(snippet, type);
-      this.controller.withTransaction((tr) => {
-        return tr.replaceRangeWith(insertRange.from, insertRange.to, node);
-      });
+      this.controller.withTransaction(
+        (tr) => {
+          return tr.replaceRangeWith(insertRange.from, insertRange.to, node);
+        },
+        { view: this.controller.mainEditorView }
+      );
       this.importRdfaSnippet.removeSnippet(snippet);
     } else {
       console.warn('Could not find a range to insert, so we skipped inserting');

package/addon/components/rdfa-date-plugin/card.ts

@@ -1,9 +1,12 @@
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
-import { ProseController } from '@lblod/ember-rdfa-editor/core/prosemirror';
+import { SayController } from '@lblod/ember-rdfa-editor';
 import { NodeSelection, PNode } from '@lblod/ember-rdfa-editor';
-import { DateFormat } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/rdfa-date-plugin';
+import {
+  DateFormat,
+  DateOptions,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/rdfa-date-plugin';
 import {
   formatContainsTime,
   validateDateFormat,
@@ -21,13 +24,8 @@ import {
 } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
 
 type Args = {
-  controller: ProseController;
-  widgetArgs: {
-    options: {
-      formats: [DateFormat];
-      allowCustomFormat: boolean;
-    };
-  };
+  controller: SayController;
+  options: DateOptions;
 };
 const SECONDS_REGEX = new RegExp('[sStT]|p{2,}');
 export default class RdfaDatePluginCardComponent extends Component<Args> {
@@ -39,7 +37,7 @@ export default class RdfaDatePluginCardComponent extends Component<Args> {
   tooltipOpen = false;
 
   get formats(): DateFormat[] {
-    return this.args.widgetArgs.options.formats;
+    return this.args.options.formats;
   }
 
   get controller() {
@@ -47,13 +45,13 @@ export default class RdfaDatePluginCardComponent extends Component<Args> {
   }
 
   get selection() {
-    return this.controller.getState(true).selection;
+    return this.controller.activeEditorState.selection;
   }
 
   get selectedDateNode(): Option<PNode> {
     if (
       this.selection instanceof NodeSelection &&
-      this.selection.node.type === this.args.controller.schema.nodes['date']
+      this.selection.node.type === this.controller.schema.nodes['date']
     ) {
       return this.selection.node;
     } else {
@@ -159,8 +157,8 @@ export default class RdfaDatePluginCardComponent extends Component<Args> {
     return null;
   }
 
-  get pickerDate(): Date {
-    return this.documentDate ?? new Date();
+  get pickerDate(): Option<Date> {
+    return this.documentDate;
   }
 
   @action
@@ -178,15 +176,13 @@ export default class RdfaDatePluginCardComponent extends Component<Args> {
     if (pos) {
       this.controller.withTransaction((tr) => {
         return tr.setNodeAttribute(pos, 'value', date.toISOString());
-      }, true);
+      });
     }
   }
 
   @action
   changeIncludeTime(includeTime: boolean) {
-    console.log('Include time', includeTime);
     if (this.isCustom) {
-      console.log("but it's custom");
       return;
     }
     const dateFormatType = this.documentDateFormatType;
@@ -209,7 +205,7 @@ export default class RdfaDatePluginCardComponent extends Component<Args> {
         .setNodeAttribute(pos, 'format', dateFormat)
         .setNodeAttribute(pos, 'custom', custom)
         .setNodeAttribute(pos, 'onlyDate', !formatContainsTime(dateFormat));
-    }, true);
+    });
   }
 
   @action
@@ -221,7 +217,7 @@ export default class RdfaDatePluginCardComponent extends Component<Args> {
     if (formatKey === 'custom') {
       this.controller.withTransaction((tr) => {
         return tr.setNodeAttribute(pos, 'custom', true);
-      }, true);
+      });
     } else {
       const format = this.formats.find((format) => format.key === formatKey);
       if (format) {
@@ -243,7 +239,7 @@ export default class RdfaDatePluginCardComponent extends Component<Args> {
         return tr
           .setNodeAttribute(pos, 'format', format)
           .setNodeAttribute(pos, 'onlyDate', !formatContainsTime(format));
-      }, true);
+      });
     }
   }
 

package/addon/components/rdfa-date-plugin/insert.hbs

@@ -7,12 +7,3 @@
     {{t "date-plugin.insert.date"}}
   </AuButton>
 </AuList::Item>
-<AuList::Item>
-  <AuButton
-    @icon="add"
-    @iconAlignment="left"
-    @skin="link"
-    {{on 'click' (fn this.insertDate false)}}>
-    {{t "date-plugin.insert.datetime"}}
-  </AuButton>
-</AuList::Item>