import "./pictograms-new.scss";
import {createIconGrid, extractGlyphClassNames} from "../icon-grid/IconGridComponent";
import pictogramsScss from "../../_global/styles/pictograms.scss?raw";

// pictonew liefert keine eigene Namens-Zuordnung, nur die Font-Dateien.
// Codepoints sind identisch zu pictograms.scss, bis auf pictogram-ihk-gebaeude (fehlt in pictonew).
const MISSING_IN_PICTONEW = ['pictogram-ihk-gebaeude'];

const pictogramNames = extractGlyphClassNames(pictogramsScss, 'pictogram')
  .filter((name) => !MISSING_IN_PICTONEW.includes(name));

export default {
  title: 'Styleguide/Pictograms (pictonew)',
  parameters: {
    docs: {
      description: {
        component: `Vorschau der Piktogramm-Schrift aus \`stories/assets/fonts/pictonew\` (${pictogramNames.length} Stück). Die Namen sind aus \`pictograms.scss\` übernommen, da pictonew selbst keine Zuordnung mitliefert.`,
      },
    },
  },
};

export const AllePiktogrammeNeu = () => createIconGrid({classNames: pictogramNames, variant: 'pictograms-new'});