@lblod/ember-rdfa-editor-lblod-plugins 1.0.0-alpha.3 → 1.0.0-beta.2

package/addon/plugins/roadsign-regulation-plugin/nodes.ts

@@ -0,0 +1,107 @@
+import { getRdfaAttrs, NodeSpec, rdfaAttrs } from '@lblod/ember-rdfa-editor';
+import {
+  DCT,
+  EXT,
+  MOBILITEIT,
+  PROV,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
+import { hasRDFaAttribute } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
+
+const CONTENT_SELECTOR = `div[property~='${
+  DCT('description').full
+}'],div[property~='${DCT('description').prefixed}']`;
+export const roadsign_regulation: NodeSpec = {
+  content: 'block+',
+  group: 'block',
+  attrs: {
+    ...rdfaAttrs,
+    resourceUri: {},
+    measureUri: {},
+    zonality: {},
+    temporal: {
+      default: false,
+    },
+  },
+  toDOM(node) {
+    const { resourceUri, measureUri, zonality, temporal } = node.attrs;
+    return [
+      'div',
+      {
+        property: MOBILITEIT('heeftVerkeersmaatregel'),
+        typeof: MOBILITEIT('Mobiliteitsmaatregel'),
+        resource: resourceUri as string,
+      },
+      [
+        'span',
+        {
+          style: 'display:none;',
+          property: PROV('wasDerivedFrom'),
+          resource: measureUri as string,
+        },
+      ],
+      [
+        'span',
+        {
+          style: 'display:none;',
+          property: EXT('zonality'),
+          resource: zonality as string,
+        },
+      ],
+      [
+        'span',
+        {
+          property: EXT('temporal'),
+          resource: (temporal as string) ?? false,
+        },
+      ],
+      ['div', { property: DCT('description') }, 0],
+    ];
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(node: HTMLElement) {
+        if (
+          hasRDFaAttribute(
+            node,
+            'typeof',
+            MOBILITEIT('Mobiliteitsmaatregel')
+          ) &&
+          node.querySelector(CONTENT_SELECTOR)
+        ) {
+          const resourceUri = node.getAttribute('resource');
+          const measureUri = node
+            .querySelector(
+              `span[property~='${PROV('wasDerivedFrom').prefixed}'],
+             span[property~='${PROV('wasDerivedFrom').full}']`
+            )
+            ?.getAttribute('resource');
+          const zonality = node
+            .querySelector(
+              `span[property~='${EXT('zonality').prefixed}'],
+           span[property~='${EXT('zonality').full}']`
+            )
+            ?.getAttribute('resource');
+          if (!resourceUri || !measureUri || !zonality) {
+            return false;
+          }
+          const temporal = node
+            .querySelector(
+              `span[property~='${EXT('temporal').prefixed}'],
+           span[property~='${EXT('temporal').full}']`
+            )
+            ?.getAttribute('value');
+          return {
+            resourceUri,
+            measureUri,
+            zonality,
+            temporal,
+            ...getRdfaAttrs(node),
+          };
+        }
+        return false;
+      },
+      contentElement: CONTENT_SELECTOR,
+    },
+  ],
+};

package/addon/plugins/standard-template-plugin/index.ts

@@ -1,6 +1,32 @@
 import { WidgetSpec } from '@lblod/ember-rdfa-editor';
+import {
+  besluit,
+  title,
+  description,
+  motivering,
+  article_container,
+  besluit_article,
+  besluit_article_content,
+  besluit_article_header,
+  language_node,
+  besluitArticleStructure,
+} from './utils/nodes';
 
 export const standardTemplateWidget: WidgetSpec = {
   desiredLocation: 'insertSidebar',
   componentName: 'standard-template-plugin/card',
 };
+
+export const besluitNodes = {
+  besluit,
+  title,
+  description,
+  motivering,
+  article_container,
+  besluit_article,
+  besluit_article_content,
+  besluit_article_header,
+  language_node,
+};
+
+export const structureSpecs = [besluitArticleStructure];

package/addon/plugins/standard-template-plugin/utils/nodes.ts

@@ -0,0 +1,366 @@
+import {
+  getRdfaAttrs,
+  NodeSpec,
+  rdfaAttrs,
+  Transaction,
+} from '@lblod/ember-rdfa-editor';
+import {
+  BESLUIT,
+  ELI,
+  PROV,
+  SKOS,
+  XSD,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
+import { hasRDFaAttribute } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
+import { StructureSpec } from '../../article-structure-plugin';
+import { v4 as uuid } from 'uuid';
+import { unwrap } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
+
+export const title: NodeSpec = {
+  content: 'paragraph+',
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    property: {
+      default: 'eli:title',
+    },
+    datatype: {
+      default: 'xsd:string',
+    },
+  },
+  toDOM(node) {
+    return ['h4', node.attrs, 0];
+  },
+  parseDOM: [
+    {
+      tag: 'h4',
+      getAttrs(element: HTMLElement) {
+        if (hasRDFaAttribute(element, 'property', ELI('title'))) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const description: NodeSpec = {
+  group: 'block',
+  content: 'block+',
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    property: {
+      default: 'eli:description',
+    },
+    datatype: {
+      default: 'xsd:string',
+    },
+  },
+  toDOM(node) {
+    return ['p', node.attrs, 0];
+  },
+  parseDOM: [
+    {
+      tag: 'p',
+      getAttrs(element: HTMLElement) {
+        if (hasRDFaAttribute(element, 'property', ELI('description'))) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const motivering: NodeSpec = {
+  group: 'block',
+  content: 'block+',
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    property: {
+      default: 'besluit:motivering',
+    },
+    lang: {
+      default: 'nl',
+    },
+  },
+  toDOM(node) {
+    return ['p', node.attrs, 0];
+  },
+  parseDOM: [
+    {
+      tag: 'div,p',
+      getAttrs(element: HTMLElement) {
+        if (hasRDFaAttribute(element, 'property', BESLUIT('motivering'))) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const article_container: NodeSpec = {
+  group: 'block',
+  content: '(block|besluit_article)+',
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    property: {
+      default: 'prov:value',
+    },
+    datatype: {
+      default: 'xsd:string',
+    },
+  },
+  toDOM(node) {
+    return ['div', node.attrs, 0];
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(element: HTMLElement) {
+        if (
+          hasRDFaAttribute(element, 'property', PROV('value')) &&
+          hasRDFaAttribute(element, 'typeof', BESLUIT('Besluit'))
+        ) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const besluit_article: NodeSpec = {
+  content:
+    'besluit_article_header{1}(language_node*)besluit_article_content{1}',
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    property: {
+      default: 'eli:has_part',
+    },
+    typeof: {
+      default: 'besluit:Artikel',
+    },
+    resource: {},
+  },
+  toDOM(node) {
+    return ['div', node.attrs, 0];
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(element: HTMLElement) {
+        if (
+          hasRDFaAttribute(element, 'property', ELI('has_part')) &&
+          hasRDFaAttribute(element, 'typeof', BESLUIT('Artikel'))
+        ) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const besluitArticleStructure: StructureSpec = {
+  name: 'besluit_article',
+  translations: {
+    insert: 'article-structure-plugin.insert.article',
+    move: {
+      up: 'article-structure-plugin.moveUp.article',
+      down: 'article-structure-plugin.moveDown.article',
+    },
+    remove: 'article-structure-plugin.remove.article',
+  },
+  constructor: ({ schema, number, content, intl }) => {
+    const numberConverted = number?.toString() ?? '1';
+    const node = schema.node(
+      `besluit_article`,
+      { resource: `http://data.lblod.info/articles/${uuid()}` },
+      [
+        schema.node('besluit_article_header', { number: numberConverted }),
+        schema.node(
+          `besluit_article_content`,
+          {},
+          content ??
+            schema.node(
+              'paragraph',
+              {},
+              schema.node('placeholder', {
+                placeholderText: intl?.t(
+                  'article-structure-plugin.placeholder.article.body'
+                ),
+              })
+            )
+        ),
+      ]
+    );
+    const selectionConfig: {
+      relativePos: number;
+      type: 'text' | 'node';
+    } = content
+      ? { relativePos: 3, type: 'text' }
+      : { relativePos: 4, type: 'node' };
+    return {
+      node,
+      selectionConfig,
+    };
+  },
+  updateNumber: function ({ number, pos, transaction }): Transaction {
+    transaction.setNodeAttribute(pos + 1, 'number', number.toString());
+    return transaction;
+  },
+  content: ({ pos, state }) => {
+    const node = unwrap(state.doc.nodeAt(pos));
+    return unwrap(node.lastChild).content;
+  },
+  continuous: false,
+};
+
+export const besluit_article_header: NodeSpec = {
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    number: {
+      default: '1',
+    },
+  },
+  toDOM(node) {
+    const toplevelAttrs = { ...node.attrs };
+    delete toplevelAttrs.number;
+    delete toplevelAttrs.datatype;
+    return [
+      'p',
+      toplevelAttrs,
+      'Artikel ',
+      [
+        'span',
+        { property: ELI('number').prefixed, datatype: XSD('string').prefixed },
+        node.attrs.number,
+      ],
+    ];
+  },
+  parseDOM: [
+    {
+      tag: 'p',
+      getAttrs(element: HTMLElement) {
+        const numberNode = element.querySelector(
+          `span[property~='${ELI('number').prefixed}'],
+           span[property~='${ELI('number').full}']`
+        );
+        if (numberNode) {
+          return {
+            ...getRdfaAttrs(element),
+            number: numberNode.textContent,
+          };
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const besluit_article_content: NodeSpec = {
+  content: 'block+',
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    property: {
+      default: 'prov:value',
+    },
+    datatype: {
+      default: 'xsd:string',
+    },
+  },
+  toDOM(node) {
+    return ['div', node.attrs, 0];
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(element: HTMLElement) {
+        if (hasRDFaAttribute(element, 'property', PROV('value'))) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const besluit: NodeSpec = {
+  group: 'block',
+  content: 'block*title{1}block*description?block*motivering?block*',
+  inline: false,
+  attrs: {
+    ...rdfaAttrs,
+    property: {
+      default: 'prov:generated',
+    },
+    typeof: {
+      default: 'besluit:Besluit ext:BesluitNieuweStijl',
+    },
+    resource: {},
+  },
+  toDOM(node) {
+    return ['div', node.attrs, 0];
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(element: HTMLElement) {
+        if (
+          hasRDFaAttribute(element, 'property', PROV('generated')) &&
+          hasRDFaAttribute(element, 'typeof', BESLUIT('Besluit'))
+        ) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const language_node: NodeSpec = {
+  group: 'block',
+  content: '',
+  inline: false,
+  atom: true,
+  attrs: {
+    ...rdfaAttrs,
+    style: {
+      default: 'style="display:none;"',
+    },
+    property: {
+      default: 'eli:language',
+    },
+    typeof: {
+      default: 'skos:Concept',
+    },
+    resource: {
+      default: 'http://publications.europa.eu/resource/authority/language/NLD',
+    },
+  },
+  toDOM(node) {
+    return ['span', node.attrs];
+  },
+  parseDOM: [
+    {
+      tag: 'span',
+      getAttrs(element: HTMLElement) {
+        if (
+          hasRDFaAttribute(element, 'property', ELI('language')) &&
+          hasRDFaAttribute(element, 'typeof', SKOS('Concept'))
+        ) {
+          return getRdfaAttrs(element);
+        }
+        return false;
+      },
+    },
+  ],
+};

package/addon/plugins/table-of-contents-plugin/index.ts

@@ -1,14 +1,10 @@
 import { WidgetSpec } from '@lblod/ember-rdfa-editor';
-import { TableOfContentsConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/table-of-contents-plugin/utils/constants';
 
-export function tableOfContentsWidget(
-  config?: TableOfContentsConfig
-): WidgetSpec {
-  return {
-    componentName: 'table-of-contents-plugin/card',
-    desiredLocation: 'sidebar',
-    widgetArgs: {
-      config,
-    },
-  };
-}
+export type TableOfContentsConfig = {
+  nodeHierarchy: string[];
+}[];
+
+export const tableOfContentsWidget: WidgetSpec = {
+  componentName: 'table-of-contents-plugin/toolbar-button',
+  desiredLocation: 'toolbarRight',
+};

package/addon/plugins/table-of-contents-plugin/nodes/table-of-contents.ts

@@ -1,53 +1,46 @@
-import { optionMapOr } from '@lblod/ember-rdfa-editor/utils/option';
 import {
   createEmberNodeSpec,
   createEmberNodeView,
   EmberNodeConfig,
 } from '@lblod/ember-rdfa-editor/utils/ember-node';
-import {
-  TableOfContentsConfig,
-  TABLE_OF_CONTENTS_DEFAULT_CONFIG,
-} from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/table-of-contents-plugin/utils/constants';
+import { TableOfContentsConfig } from '..';
 
-export const emberNodeConfig: EmberNodeConfig = {
-  name: 'table-of-contents',
-  componentPath: 'table-of-contents-plugin/ember-nodes/table-of-contents',
-  inline: false,
-  group: 'table_of_contents',
-  atom: true,
-  attrs: {
-    config: {
-      default: TABLE_OF_CONTENTS_DEFAULT_CONFIG,
-      serialize: (node) => {
-        return JSON.stringify(node.attrs['config']);
+export const emberNodeConfig: (
+  config: TableOfContentsConfig
+) => EmberNodeConfig = (config) => {
+  return {
+    name: 'table-of-contents',
+    componentPath: 'table-of-contents-plugin/ember-nodes/table-of-contents',
+    inline: false,
+    group: 'table_of_contents',
+    atom: true,
+    attrs: {
+      config: {
+        default: config,
       },
     },
-  },
-  parseDOM: [
-    {
-      tag: 'div',
-      getAttrs(element: HTMLElement) {
-        if (
-          element.dataset['emberNode'] === 'table-of-contents' ||
-          // Ensure backwards compatibility
-          element.dataset['inlineComponent'] ===
-            'inline-components/table-of-contents' ||
-          (element.classList.contains('inline-component') &&
-            element.classList.contains('inline-components/table-of-contents'))
-        ) {
-          return {
-            config: optionMapOr(
-              TABLE_OF_CONTENTS_DEFAULT_CONFIG,
-              JSON.parse,
-              element.getAttribute('config')
-            ) as TableOfContentsConfig,
-          };
-        }
-        return false;
+    parseDOM: [
+      {
+        tag: 'div',
+        getAttrs(element: HTMLElement) {
+          if (
+            element.dataset['emberNode'] === 'table-of-contents' ||
+            // Ensure backwards compatibility
+            element.dataset['inlineComponent'] ===
+              'inline-components/table-of-contents' ||
+            (element.classList.contains('inline-component') &&
+              element.classList.contains('inline-components/table-of-contents'))
+          ) {
+            return {};
+          }
+          return false;
+        },
       },
-    },
-  ],
+    ],
+  };
 };
 
-export const table_of_contents = createEmberNodeSpec(emberNodeConfig);
-export const tableOfContentsView = createEmberNodeView(emberNodeConfig);
+export const table_of_contents = (config: TableOfContentsConfig) =>
+  createEmberNodeSpec(emberNodeConfig(config));
+export const tableOfContentsView = (config: TableOfContentsConfig) =>
+  createEmberNodeView(emberNodeConfig(config));

package/addon/plugins/{insert-variable-plugin → variable-plugin}/index.ts

@@ -2,10 +2,15 @@ import { WidgetSpec } from '@lblod/ember-rdfa-editor';
 
 export function insertVariableWidget(options?: unknown): WidgetSpec {
   return {
-    componentName: 'insert-variable-plugin/insert-variable-card',
+    componentName: 'variable-plugin/insert-variable-card',
     desiredLocation: 'sidebar',
     widgetArgs: {
       options,
     },
   };
 }
+
+export const templateVariableWidget: WidgetSpec = {
+  componentName: 'variable-plugin/template-variable-card',
+  desiredLocation: 'sidebar',
+};