/** * @external MenuDefinition */ /* eslint-disable quotes */ import mustache from 'mustache'; import { vectorMenuTemplate as portalTemplate } from './MenuDropdown.stories.data'; import '../resources/skins.vector.styles/MenuPortal.less'; import '../.storybook/common.less'; import { placeholder, htmlUserLanguageAttributes } from './utils'; /** * @param {MenuDefinition} data * @return {HTMLElement} */ export const wrapPortlet = ( data ) => { const node = document.createElement( 'div' ); node.setAttribute( 'id', 'mw-panel' ); node.innerHTML = mustache.render( portalTemplate, data ); return node; }; /** * @param {string} html * @return {string} */ const portletAfter = ( html ) => { return `
${html}
`; }; /** * @type {Object.} */ export const PORTALS = { example: { id: 'p-example', class: 'vector-menu-portal portal', 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'Message tooltip-p-example acts as tooltip', label: 'Portal title', 'label-id': 'p-example-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • A list of links
  • with ids
  • on each list item
    • `, 'html-after-portal': portletAfter( placeholder( `

    Beware: The BaseTemplateAfterPortlet hook can be used to inject arbitary HTML here for any portlet.

    `, 60 ) ) }, navigation: { id: 'p-navigation', class: 'portal portal-first', 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-navigation must exist for this to appear', label: 'Navigation', 'label-id': 'p-navigation-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Main page
  • Contents
  • Featured content
  • Current events
  • Random page
  • Donate
    • `, 'html-after-portal': portletAfter( placeholder( 'Possible hook output (navigation)', 50 ) ) }, toolbox: { id: 'p-tb', class: 'vector-menu-portal portal', 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-tb must exist for this to appear', label: 'Tools', 'label-id': 'p-tb-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • What links here
  • Related changes
  • Upload file
  • Special pages
  • Page information
  • Wikidata item
  • Cite this page
    • `, 'html-after-portal': portletAfter( placeholder( 'Possible hook output (tb)', 50 ) ) }, langlinks: { id: 'p-lang', class: 'vector-menu-portal portal', 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-lang must exist for this to appear', label: 'In other languages', 'label-id': 'p-lang-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Acèh
  • Адыгэбзэ
  • Адыгабзэ
  • Afrikaans
  • Akan
  • Alemannisch
  • አማርኛ
  • Ænglisc
  • Аҧсшәа
  • العربية
  • `, 'html-after-portal': portletAfter( `Edit links ${placeholder( `

    Further hook output possible (lang)

    `, 60 )}` ) }, otherProjects: { id: 'p-wikibase-otherprojects', class: 'vector-menu-portal portal', 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-wikibase-otherprojects must exist for this to appear', label: 'In other projects', 'label-id': 'p-wikibase-otherprojects-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Wikimedia Commons
  • Wikinews
  • Wikiquote
  • Wikivoyage
    • `, 'html-after-portal': '' } };