@gouvfr/dsfr-roller/src/node/directive/doc/guidance/anatomy-container-directive.js

Le module `dsfr-roller` permet de publier le site de documentation du Système de Design de l’État - DSFR

import { Node } from '../../../node.js'
import { log } from '@gouvfr/dsfr-forge';

class AnatomyContainerDirective extends Node {
  structure (data) {
    const image = Node.getImageChild(data);
    const imageWidth = data.properties?.imageWidth;

    if (!image) {
      log.warn('GuidelineContainerDirective: missing image');
      return data;
    }

    const contentChildren = data.children.filter(child => !Node.getImageChild(child));

    return super.structure({
      type: 'htmlContainer',
      tagName: 'div',
      classes: ['dsfr-doc-anatomy'],
      children: [
        {
          type: 'htmlContainer',
          tagName: 'div',
          classes: ['dsfr-doc-anatomy__image'],
          children: [
            {
              ...image,
              classes: ['fr-responsive-img'],
              attributes: {
                style: `max-width: ${imageWidth ? imageWidth + 'px' : '100%'};`
              }
            }
          ]
        },
        {
          type: 'htmlContainer',
          tagName: 'ol',
          classes: ['dsfr-doc-anatomy__content'],
          children: contentChildren
        }
      ]
    });
  }

}

AnatomyContainerDirective.NAME = 'dsfr-doc-anatomy';

export { AnatomyContainerDirective };