ihk24/storybook/stories/components/page-details/PageDetailsComponent.js

import './page-details.scss';
import {createElement} from "../../_global/scripts/helpers";

export const createPageDetails = ({
  breadcrumb = ['Start', 'Beratung und Service', 'Finanzierung und Förderung digitaler Projekte'],
  docNumber = 4073226,
  isIntranet = false,
}) => {
  const section = createElement('section', isIntranet ? ['page-details', 'intranet'] : ['page-details']);
  const nav = createElement('nav', ['page-details-list-wrapper'], null, section);
  createElement('p', ['visually-hidden'], 'Sie befinden sich hier', nav);

  const breadcrumbList = createElement('ol', ['breadcrumb'], null, nav);

  breadcrumb.map((item, i) => {
    const li = createElement('li', ['page-details-item'], null, breadcrumbList);
    const a = createElement('a', [], item, li);
    a.href = '#';
    a.id = 'page-details-item' + i;
  })

  const docNr = createElement('div', ['document-number', 'desktop-only'], 'Nr. ' + docNumber, section);
  docNr.id = 'gfi-document-id';

  return section;
}