mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-11-23 15:26:47 +00:00
Remove Storybook and jsdoc and its dependencies
Bug: T321102 Depends-On: Ia21c14f72631e607e0d626408557eacb83529a03 Change-Id: I3535398826e67825965c024805fd5e921fe5298c
This commit is contained in:
parent
4994a6df8e
commit
070349dd2e
|
@ -1,4 +1,3 @@
|
|||
/.storybook/
|
||||
/docs/
|
||||
/a11y/
|
||||
/i18n/
|
||||
|
|
|
@ -15,11 +15,6 @@
|
|||
"sourceType": "module"
|
||||
},
|
||||
"settings": {
|
||||
"jsdoc": {
|
||||
"preferredTypes": {
|
||||
"VectorHeaderObserver": "VectorHeaderObserver"
|
||||
}
|
||||
}
|
||||
},
|
||||
"rules": {
|
||||
"compat/compat": "off",
|
||||
|
|
5
.gitignore
vendored
5
.gitignore
vendored
|
@ -42,10 +42,5 @@ Thumbs.db
|
|||
/.htaccess
|
||||
/.htpasswd
|
||||
.eslintcache
|
||||
|
||||
# storybook
|
||||
/.storybook/resolve-less-imports/
|
||||
/.storybook/resolve-imports/
|
||||
/.storybook/integration.less
|
||||
.vscode
|
||||
/.phpunit.result.cache
|
||||
|
|
|
@ -1,28 +0,0 @@
|
|||
@import '../resources/common/variables.less';
|
||||
@import './integration.less';
|
||||
@import './icons.less';
|
||||
|
||||
body {
|
||||
font-family: @font-family-sans;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#mw-panel {
|
||||
background-color: @background-color-secondary;
|
||||
}
|
||||
|
||||
.printfooter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.vector-storybook-example-table tr {
|
||||
vertical-align: top;
|
||||
}
|
|
@ -1,5 +0,0 @@
|
|||
import { configure } from '@storybook/html';
|
||||
import './common.less';
|
||||
|
||||
// automatically import all files ending in *.stories.js
|
||||
configure(require.context('../stories', true, /\.stories\.js$/), module);
|
|
@ -1,100 +0,0 @@
|
|||
.vector-menu-dropdown .vector-menu-heading:after {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23202122' d='m11.05 3.996-.965-1.053-4.035 3.86-3.947-3.86L1.05 3.996l5 5 5-5'/%3E%3C/svg%3E%0A") !important;
|
||||
}
|
||||
|
||||
.mw-wiki-logo {
|
||||
background-image: url(https://en.wikipedia.org/static/images/project-logos/enwiki-2x.png);
|
||||
background-size: 135px auto;
|
||||
}
|
||||
|
||||
.oo-ui-icon-bell {
|
||||
opacity: 0.51;
|
||||
background-image: linear-gradient(transparent,transparent),
|
||||
url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 0 0-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 0 0 4 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 0 0 3-3H7a3 3 0 0 0 3 3z%22/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.oo-ui-icon-tray {
|
||||
background-image: linear-gradient(transparent,transparent),
|
||||
url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-add:before {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elanguage%3C/title%3E%3Cg fill='%2354595d'%3E%3Cpath d='M11 9V4H9v5H4v2h5v5h2v-5h5V9z'/%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-add-invert:before {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elanguage%3C/title%3E%3Cg fill='white'%3E%3Cpath d='M11 9V4H9v5H4v2h5v5h2v-5h5V9z'/%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-add-progressive:before {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elanguage%3C/title%3E%3Cg fill='%23447ff5'%3E%3Cpath d='M11 9V4H9v5H4v2h5v5h2v-5h5V9z'/%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-add-destructive:before {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elanguage%3C/title%3E%3Cg fill='%23ff4242'%3E%3Cpath d='M11 9V4H9v5H4v2h5v5h2v-5h5V9z'/%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.uls-trigger {
|
||||
background-image: linear-gradient(transparent,transparent),
|
||||
url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E %3Ctitle%3E language %3C/title%3E %3Cpath d=%22M20 18h-1.44a.61.61 0 0 1-.4-.12.81.81 0 0 1-.23-.31L17 15h-5l-1 2.54a.77.77 0 0 1-.22.3.59.59 0 0 1-.4.14H9l4.55-11.47h1.89zm-3.53-4.31L14.89 9.5a11.62 11.62 0 0 1-.39-1.24q-.09.37-.19.69l-.19.56-1.58 4.19zm-6.3-1.58a13.43 13.43 0 0 1-2.91-1.41 11.46 11.46 0 0 0 2.81-5.37H12V4H7.31a4 4 0 0 0-.2-.56C6.87 2.79 6.6 2 6.6 2l-1.47.5s.4.89.6 1.5H0v1.33h2.15A11.23 11.23 0 0 0 5 10.7a17.19 17.19 0 0 1-5 2.1q.56.82.87 1.38a23.28 23.28 0 0 0 5.22-2.51 15.64 15.64 0 0 0 3.56 1.77zM3.63 5.33h4.91a8.11 8.11 0 0 1-2.45 4.45 9.11 9.11 0 0 1-2.46-4.45z%22/%3E %3C/svg%3E") !important;
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-language:before {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elanguage%3C/title%3E%3Cg fill='%2354595d'%3E%3Cpath d='M20 18h-1.44a.61.61 0 01-.4-.12.81.81 0 01-.23-.31L17 15h-5l-1 2.54a.77.77 0 01-.22.3.59.59 0 01-.4.14H9l4.55-11.47h1.89zm-3.53-4.31L14.89 9.5a11.62 11.62 0 01-.39-1.24q-.09.37-.19.69l-.19.56-1.58 4.19zm-6.3-1.58a13.43 13.43 0 01-2.91-1.41 11.46 11.46 0 002.81-5.37H12V4H7.31a4 4 0 00-.2-.56C6.87 2.79 6.6 2 6.6 2l-1.47.5s.4.89.6 1.5H0v1.33h2.15A11.23 11.23 0 005 10.7a17.19 17.19 0 01-5 2.1q.56.82.87 1.38a23.28 23.28 0 005.22-2.51 15.64 15.64 0 003.56 1.77zM3.63 5.33h4.91a8.11 8.11 0 01-2.45 4.45 9.11 9.11 0 01-2.46-4.45z'/%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-userTalk:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Euser talk%3C/title%3E%3Cpath d='M18 0H2a2 2 0 00-2 2v18l4-4h14a2 2 0 002-2V2a2 2 0 00-2-2zm-4 4a1.5 1.5 0 11-1.5 1.5A1.5 1.5 0 0114 4zM6 4a1.5 1.5 0 11-1.5 1.5A1.5 1.5 0 016 4zm4 8c-2.61 0-4.83-.67-5.65-3h11.3c-.82 2.33-3.04 3-5.65 3z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-sandbox:before {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Esandbox%3C/title%3E%3Cpath d='M8 12V9l6-6 3 3-6 6H8zm10-7l-3-3 2-2 3 3-2 2zM8 2h2v2H8zM4 2h2v2H4zM0 3a1 1 0 011-1h1v2H0V3zm0 3h2v2H0zm0 4h2v2H0zm0 4h2v2H0zm0 4h2v2H1a1 1 0 01-1-1v-1zm4 0h2v2H4zm4 0h2v2H8zm4 0h2v1a1 1 0 01-1 1h-1v-2zm0-4h2v2h-2z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-settings:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Esettings%3C/title%3E%3Cg transform='translate(10 10)'%3E%3Cpath id='a' d='M1.5-10h-3l-1 6.5h5m0 7h-5l1 6.5h3'/%3E%3Cuse transform='rotate(45)' xlink:href='%23a'/%3E%3Cuse transform='rotate(90)' xlink:href='%23a'/%3E%3Cuse transform='rotate(135)' xlink:href='%23a'/%3E%3C/g%3E%3Cpath d='M10 2.5a7.5 7.5 0 000 15 7.5 7.5 0 000-15v4a3.5 3.5 0 010 7 3.5 3.5 0 010-7'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-unStar:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Eun-star%3C/title%3E%3Cpath d='M20 7h-7L10 .5 7 7H0l5.46 5.47-1.64 7 6.18-3.7 6.18 3.73-1.63-7z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-userContributions:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Euser contributions%3C/title%3E%3Ccircle cx='2' cy='4' r='2'/%3E%3Ccircle cx='2' cy='10' r='2'/%3E%3Ccircle cx='2' cy='16' r='2'/%3E%3Ccircle cx='15.5' cy='10.5' r='2.5'/%3E%3Cpath d='M6 15h3v2H6zm0-6h5v2H6zm0-6h11v2H6zm9.5 10.556c-3.33 0-4.5 1.666-4.5 2.777V18h9v-1.667c0-1.11-1.17-2.777-4.5-2.777z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-logIn:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elog in%3C/title%3E%3Cpath d='M1 11v6c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2H3c-1.1 0-2 .9-2 2v6h8V5l4.75 5L9 15v-4H1z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-logOut:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elog out%3C/title%3E%3Cpath d='M3 3h8V1H3a2 2 0 00-2 2v14a2 2 0 002 2h8v-2H3z'/%3E%3Cpath d='M13 5v4H5v2h8v4l6-5z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-ellipsis:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Eellipsis%3C/title%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Ccircle cx='3' cy='10' r='2'/%3E%3Ccircle cx='17' cy='10' r='2'/%3E%3C/svg%3E%0A");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-search:before {
|
||||
background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%3E%3Ctitle%3Esearch%3C%2Ftitle%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M12.2%2013.6a7%207%200%20111.4-1.4l5.4%205.4-1.4%201.4-5.4-5.4zM13%208A5%205%200%20113%208a5%205%200%200110%200z%22%2F%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-userAvatar:before {
|
||||
background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8'?%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Euser avatar%3C/title%3E%3Cpath d='M10 11c-5.92 0-8 3-8 5v3h16v-3c0-2-2.08-5-8-5z'/%3E%3Ccircle cx='10' cy='5.5' r='4.5'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-watchlist:before {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E watchlist %3C/title%3E%3Cpath d='M1 3h16v2H1V3Zm0 6h6v2H1V9Zm0 6h8v2H1v-2Zm8-4.24h3.85L14.5 7l1.65 3.76H20l-3 3.17.9 4.05-3.4-2.14L11.1 18l.9-4.05-3-3.19Z'/%3E%3C/svg%3E")
|
||||
}
|
||||
|
||||
.vector-user-menu-legacy #pt-anonuserpage,
|
||||
.vector-user-menu-legacy #pt-userpage a {
|
||||
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAx0lEQVQ4jdXSzQmEQAwFYEuYUixhSwgkA8mQgKXYgS3YgXZgCZagHWgHuxf14t8osssGcv145CVJvjk+hBRFK2TrkK1D0cqHkN7CUBRI7L21KAqXMIDModiwD9oAkLlH0i3L+ooGiTWPAPPfJQTIHLGOB9h46YZnKS+3PI8PISW2GkV7FO2Jrb79h4+ODyElsYJYm437NSRWRCWdylgj++U0u+UAZI5E22hsWW03UWQtr2NT66zlCjz8uzNQbFiDN7F5/xB8aj57Ynp2FKI0bAAAAABJRU5ErkJggg==") !important;
|
||||
}
|
||||
|
||||
.mw-ui-icon-wikimedia-speechBubbles:before {
|
||||
background-image: linear-gradient(transparent, transparent), url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Espeech bubbles%3C/title%3E%3Cg fill=%22%23000%22%3E%3Cpath d=%22M17 4v7a2 2 0 01-2 2H4v1a2 2 0 002 2h10l4 4V6a2 2 0 00-2-2zM6 10H0v6z%22/%3E%3Crect width=%2216%22 height=%2212%22 rx=%222%22/%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
||||
.mw-ui-icon-wikimedia-history:before {
|
||||
background-image: linear-gradient(transparent, transparent), url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Ehistory%3C/title%3E%3Cg fill=%22%23000%22%3E%3Cpath d=%22M9 6v5h.06l2.48 2.47 1.41-1.41L11 10.11V6z%22/%3E%3Cpath d=%22M10 1a9 9 0 00-7.85 13.35L.5 16H6v-5.5l-2.38 2.38A7 7 0 1110 17v2a9 9 0 000-18z%22/%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
|
@ -1,84 +0,0 @@
|
|||
const path = require( 'path' );
|
||||
|
||||
module.exports = {
|
||||
resolve: {
|
||||
alias: {
|
||||
// FIXME: These imports should be updated in the story files instead of here.
|
||||
'../resources/skins.vector.styles/Footer.less': '../resources/common/components/Footer.less',
|
||||
'../resources/skins.vector.styles/LanguageButton.less': '../resources/skins.vector.styles/components/LanguageButton.less',
|
||||
'../resources/skins.vector.styles/skin-legacy.less': '../resources/skins.vector.styles.legacy/skin-legacy.less',
|
||||
'../resources/skins.vector.styles/Logo.less': '../resources/skins.vector.styles/components/Logo.less',
|
||||
'../resources/skins.vector.styles/Menu.less': '../resources/common/components/Menu.less',
|
||||
'../.storybook/common.less': '../resources/common/common.less',
|
||||
'../resources/skins.vector.styles/MenuDropdown.less': '../resources/common/components/MenuDropdown.less',
|
||||
'../resources/skins.vector.styles/MenuPortal.less': '../resources/skins.vector.styles/components/MenuPortal.less',
|
||||
'../resources/skins.vector.styles/MenuTabs.less': '../resources/common/components/MenuTabs.less',
|
||||
'../resources/skins.vector.styles/TabWatchstarLink.less': '../resources/common/components/TabWatchstarLink.less',
|
||||
'../resources/skins.vector.styles/SearchBox.less': '../resources/common/components/SearchBox.less',
|
||||
'../resources/skins.vector.styles/MainMenu.less': '../resources/skins.vector.styles/components/MainMenu.less',
|
||||
'../resources/skins.vector.styles/SidebarLogo.less': '../resources/common/components/SidebarLogo.less',
|
||||
'../resources/skins.vector.styles/MenuPortal.less': '../resources/skins.vector.styles/components/MenuPortal.less'
|
||||
}
|
||||
},
|
||||
module: {
|
||||
rules: [ {
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
use: {
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
// Beware of https://github.com/babel/babel-loader/issues/690. Changes to browsers require
|
||||
// manual invalidation.
|
||||
cacheDirectory: true
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.mjs$/,
|
||||
include: /node_modules/,
|
||||
type: "javascript/auto"
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: [ {
|
||||
loader: 'style-loader'
|
||||
}, {
|
||||
loader: 'css-loader'
|
||||
} ]
|
||||
},
|
||||
{
|
||||
test: /\.(gif|png|jpe?g|svg)$/i,
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
paths: [
|
||||
path.resolve( __dirname, './resolve-imports' )
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
// in core some LESS imports don't specify filename
|
||||
test: /\.less$/,
|
||||
use: [ {
|
||||
loader: 'style-loader'
|
||||
}, {
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
// FIXME: Disable resolving of CSS urls until Storybook is upgraded
|
||||
// to use Webpack 5 and array values for aliases
|
||||
// (which would cleanly resolve urls in LESS partial starting with `url(images/...)` )
|
||||
url: false
|
||||
}
|
||||
}, {
|
||||
loader: 'less-loader',
|
||||
options: {
|
||||
relativeUrls: true,
|
||||
strictUnits: true,
|
||||
paths: [
|
||||
path.resolve( __dirname, 'resolve-imports' )
|
||||
]
|
||||
}
|
||||
} ]
|
||||
},
|
||||
]
|
||||
}
|
||||
};
|
|
@ -1,4 +1,3 @@
|
|||
/.storybook/
|
||||
/docs/
|
||||
/node_modules/
|
||||
/skinStyles/jquery.ui/
|
||||
|
|
|
@ -1,24 +0,0 @@
|
|||
#!/usr/bin/env bash
|
||||
set -euo pipefail
|
||||
IFS=$'\n\t'
|
||||
|
||||
mkdir -p .storybook/resolve-imports/mediawiki.ui
|
||||
mkdir -p .storybook/resolve-imports/assets
|
||||
|
||||
rm -f .storybook/resolve-imports/mediawiki.skin.variables.less
|
||||
cp resources/mediawiki.less/mediawiki.skin.variables.less .storybook/resolve-imports/
|
||||
|
||||
# Fetch resources via curl, `-sSL` silently, Show only errors, Location header and also with a 3XX response code.
|
||||
curl -sS "https://www.mediawiki.org/w/load.php?only=styles&skin=vector&debug=true&modules=ext.echo.styles.badge|ext.uls.pt|wikibase.client.init|mediawiki.skinning.interface|mediawiki.ui.icon|mediawiki.ui.button" -o .storybook/integration.less
|
||||
curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.skin.defaults.less?format=TEXT" | base64 --decode > .storybook/resolve-imports/mediawiki.skin.defaults.less
|
||||
curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.less?format=TEXT" | base64 --decode > .storybook/resolve-imports/mediawiki.mixins.less
|
||||
curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.ui/variables.less?format=TEXT" | base64 --decode > .storybook/resolve-imports/mediawiki.ui/variables.less
|
||||
curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.rotation.less?format=TEXT" | base64 --decode > .storybook/resolve-imports/mediawiki.mixins.rotation.less
|
||||
curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.animation.less?format=TEXT" | base64 --decode > .storybook/resolve-imports/mediawiki.mixins.animation.less
|
||||
curl -sS "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia-wordmark-en.svg" -o ".storybook/resolve-imports/assets/wordmark.svg"
|
||||
curl -sS "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia.png" -o ".storybook/resolve-imports/assets/icon.png"
|
||||
curl -sS "https://en.wikipedia.org/static/images/mobile/copyright/wikipedia-tagline-en.svg" -o ".storybook/resolve-imports/assets/tagline.svg"
|
||||
|
||||
# Add less variable support
|
||||
echo "@msg-parentheses-start: '(';" >> .storybook/resolve-imports/mediawiki.skin.defaults.less
|
||||
echo "@msg-parentheses-end: ')';" >> .storybook/resolve-imports/mediawiki.skin.defaults.less
|
50
jsdoc.json
50
jsdoc.json
|
@ -1,50 +0,0 @@
|
|||
{
|
||||
"opts": {
|
||||
"destination": "docs/js",
|
||||
"package": "package.json",
|
||||
"pedantic": true,
|
||||
"readme": "README.md",
|
||||
"recurse": true,
|
||||
"template": "node_modules/jsdoc-wmf-theme"
|
||||
},
|
||||
"source": {
|
||||
"include": [ "resources" ]
|
||||
},
|
||||
"templates": {
|
||||
"cleverLinks": true,
|
||||
"default": {
|
||||
"useLongnameInNav": true
|
||||
},
|
||||
"wmf": {
|
||||
"linkMap": {
|
||||
"\"addEventListener\"": "https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener",
|
||||
"jQuery": "https://api.jquery.com",
|
||||
"AbortSignal": "https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal",
|
||||
"Document": "https://developer.mozilla.org/docs/Web/API/Document",
|
||||
"Element": "https://developer.mozilla.org/docs/Web/API/Element",
|
||||
"Event": "https://developer.mozilla.org/docs/Web/API/Event",
|
||||
"EventTarget": "https://developer.mozilla.org/docs/Web/API/EventTarget",
|
||||
"HTMLElement": "https://developer.mozilla.org/docs/Web/API/HTMLElement",
|
||||
"IntersectionObserver": "https://developer.mozilla.org/docs/Web/API/IntersectionObserver",
|
||||
"IntersectionObserverEntry": "https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserverEntry",
|
||||
"MediaQueryList": "https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList",
|
||||
"MediaQueryListEvent": "https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryListEvent",
|
||||
"Node": "https://developer.mozilla.org/docs/Web/API/Node",
|
||||
"NodeList": "https://developer.mozilla.org/docs/Web/API/NodeList",
|
||||
"HTMLInputElement": "https://developer.mozilla.org/docs/Web/API/HTMLInputElement",
|
||||
"\"removeEventListener\"": "https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener",
|
||||
"Window": "https://developer.mozilla.org/docs/Web/API/Window",
|
||||
"CheckboxHack": "https://doc.wikimedia.org/mediawiki-core/master/js",
|
||||
"MediaWikiPageReadyModule": "https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/mw.plugin.page.ready",
|
||||
"MW": "https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/mw",
|
||||
"MwMap": "https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/mw.Map",
|
||||
"RequestInit": "https://developer.mozilla.org/en-US/docs/Web/API/Request/Request",
|
||||
"JQueryStatic": "https://api.jquery.com",
|
||||
"JQuery.Promise": "https://api.jquery.com/promise/",
|
||||
"VectorResourceLoaderVirtualConfig": "#",
|
||||
"void": "#",
|
||||
"Vue.VNode": "https://vuejs.org/v2/api/#VNode-Interface"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
21258
package-lock.json
generated
21258
package-lock.json
generated
File diff suppressed because it is too large
Load diff
16
package.json
16
package.json
|
@ -2,8 +2,7 @@
|
|||
"name": "Vector",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"start": "bash dev-scripts/setup-storybook.sh && start-storybook --quiet -p 6006 -s resources/skins.vector.styles",
|
||||
"test": "npm -s run lint && tsc && npm run test:unit && npm -s run doc",
|
||||
"test": "npm -s run lint && tsc && npm run test:unit",
|
||||
"test:unit": "jest --silent",
|
||||
"test:unit:updateSnapshot": "jest --updateSnapshot",
|
||||
"test:a11y": "wmf-a11y --config 'tests/a11y/a11y.config.js'",
|
||||
|
@ -14,18 +13,12 @@
|
|||
"lint:js": "eslint --cache .",
|
||||
"lint:styles": "stylelint \"**/*.{less,css}\"",
|
||||
"lint:i18n": "banana-checker --requireLowerCase=0 i18n/",
|
||||
"doc": "jsdoc -c jsdoc.json",
|
||||
"build-storybook": "bash dev-scripts/setup-storybook.sh && build-storybook --quiet --loglevel warn -o docs/ui",
|
||||
"doc": "echo 'N/A'",
|
||||
"minify-svg": "svgo --config=.svgo.config.js --quiet --recursive --folder resources/",
|
||||
"pre-commit": "[ \"${PRE_COMMIT:-1}\" -eq 0 ] || npm -s t"
|
||||
},
|
||||
"pre-commit": "pre-commit",
|
||||
"peerDependencies": {
|
||||
"babel-core": "6.26.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.8.0",
|
||||
"@storybook/html": "5.2.8",
|
||||
"@types/jest": "27.0.0",
|
||||
"@types/jquery": "3.3.33",
|
||||
"@types/mustache": "4.0.1",
|
||||
|
@ -37,15 +30,10 @@
|
|||
"@wikimedia/codex-search": "0.8.0",
|
||||
"@wikimedia/mw-node-qunit": "7.0.0",
|
||||
"@wikimedia/types-wikimedia": "0.3.3",
|
||||
"babel-loader": "8.0.6",
|
||||
"eslint-config-wikimedia": "0.24.0",
|
||||
"grunt-banana-checker": "0.10.0",
|
||||
"jest": "27.4.7",
|
||||
"jest-fetch-mock": "3.0.3",
|
||||
"jsdoc": "3.6.10",
|
||||
"jsdoc-wmf-theme": "0.0.5",
|
||||
"less": "3.8.1",
|
||||
"less-loader": "4.1.0",
|
||||
"mustache": "3.0.1",
|
||||
"mustache-jest": "1.1.1",
|
||||
"node-fetch": "2.6.7",
|
||||
|
|
|
@ -1,28 +0,0 @@
|
|||
{
|
||||
"root": true,
|
||||
"extends": [
|
||||
"wikimedia",
|
||||
"wikimedia/language/es6"
|
||||
],
|
||||
"env": {
|
||||
"browser": true
|
||||
},
|
||||
"rules": {
|
||||
"quotes": "off"
|
||||
},
|
||||
"parserOptions": {
|
||||
"sourceType": "module"
|
||||
},
|
||||
"settings": {
|
||||
"jsdoc": {
|
||||
"preferredTypes": {
|
||||
"Indicator": "Indicator",
|
||||
"LogoOptions": "LogoOptions",
|
||||
"LogoTemplateData": "LogoTemplateData",
|
||||
"MenuDefinition": "MenuDefinition",
|
||||
"SearchData": "SearchData",
|
||||
"UserLinksDefinition": "UserLinksDefinition"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,195 +0,0 @@
|
|||
import { CdxIcon, CdxButton } from '@wikimedia/codex';
|
||||
import '../node_modules/@wikimedia/codex/dist/codex.style.css';
|
||||
import { h, createApp } from 'vue';
|
||||
import buttonTemplate from '!!raw-loader!../includes/templates/Button.mustache';
|
||||
import mustache from 'mustache';
|
||||
import { cdxIconAdd } from '@wikimedia/codex-icons';
|
||||
|
||||
export default {
|
||||
title: 'Icon and Buttons'
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* @typedef {Object} ButtonProps
|
||||
* @property {string} weight
|
||||
* @property {string} action
|
||||
*/
|
||||
/**
|
||||
* @param {ButtonProps} props
|
||||
* @param {string} label
|
||||
* @return {string}
|
||||
*/
|
||||
function makeButtonLegacy( props, label ) {
|
||||
let typeClass = '';
|
||||
let iconClass = 'mw-ui-icon-add';
|
||||
switch ( props.action ) {
|
||||
case 'progressive':
|
||||
typeClass += ' mw-ui-progressive';
|
||||
iconClass += '-progressive';
|
||||
break;
|
||||
case 'destructive':
|
||||
typeClass += ' mw-ui-destructive';
|
||||
iconClass += '-destructive';
|
||||
break;
|
||||
}
|
||||
if ( props.weight === 'primary' ) {
|
||||
iconClass = 'mw-ui-icon-add-invert';
|
||||
}
|
||||
return mustache.render( buttonTemplate, {
|
||||
label,
|
||||
class: typeClass,
|
||||
'is-quiet': props.weight === 'quiet',
|
||||
'html-vector-button-icon': `<span class="mw-ui-icon ${iconClass}"></span>`
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {ButtonProps} props
|
||||
* @param {string} text
|
||||
* @param {string} icon
|
||||
* @return {string}
|
||||
*/
|
||||
function makeButton( props, text, icon ) {
|
||||
const el = document.createElement( 'div' );
|
||||
const vm = createApp( {
|
||||
render: function () {
|
||||
// @ts-ignore
|
||||
return h( CdxButton, props, [
|
||||
h( CdxIcon, { icon } ),
|
||||
text
|
||||
] );
|
||||
}
|
||||
} );
|
||||
vm.mount( el );
|
||||
return `
|
||||
<tr>
|
||||
<td>${makeButtonLegacy( props, text )}</td>
|
||||
<td>${el.outerHTML}</td>
|
||||
</tr>`;
|
||||
}
|
||||
|
||||
/**
|
||||
* @return {string}
|
||||
*/
|
||||
function makeIcon() {
|
||||
const el = document.createElement( 'div' );
|
||||
const vm = createApp( {
|
||||
render: function () {
|
||||
// @ts-ignore
|
||||
return h( CdxButton, {
|
||||
'aria-label': 'add'
|
||||
}, [
|
||||
h( CdxIcon, { icon: cdxIconAdd } )
|
||||
] );
|
||||
}
|
||||
} );
|
||||
vm.mount( el );
|
||||
const elQuiet = document.createElement( 'div' );
|
||||
const vmQuiet = createApp( {
|
||||
render: function () {
|
||||
// @ts-ignore
|
||||
return h( CdxButton, {
|
||||
weight: 'quiet',
|
||||
'aria-label': 'add'
|
||||
}, [
|
||||
h( CdxIcon, { icon: cdxIconAdd } )
|
||||
] );
|
||||
}
|
||||
} );
|
||||
vmQuiet.mount( elQuiet );
|
||||
return `
|
||||
<tr>
|
||||
<td>
|
||||
<h6>Regular icon</h6>
|
||||
${
|
||||
mustache.render( buttonTemplate, {
|
||||
label: 'Normal Icon button',
|
||||
icon: 'add'
|
||||
} )
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<h6>Regular icon</h6>
|
||||
${el.outerHTML}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h6>Small icon button</h6>
|
||||
${
|
||||
mustache.render( buttonTemplate, {
|
||||
label: 'Small icon button',
|
||||
class: 'mw-ui-icon-small',
|
||||
icon: 'add'
|
||||
} )
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<h6>Small icon button</h6>
|
||||
${el.outerHTML}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h6>Quiet icon button</h6>
|
||||
${
|
||||
mustache.render( buttonTemplate, {
|
||||
label: 'Quiet Icon',
|
||||
'is-quiet': true,
|
||||
icon: 'add'
|
||||
} )
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<h6>Quiet icon button</h6>
|
||||
${elQuiet.outerHTML}</td>
|
||||
</tr>`;
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {string[]} btns
|
||||
* @return {string}
|
||||
*/
|
||||
function makeButtons( btns ) {
|
||||
return `<table class="vector-storybook-example-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>Legacy</th>
|
||||
<th>Codex</th>
|
||||
</tr>
|
||||
${btns.join( '\n' )}
|
||||
</tbody>
|
||||
</table>`;
|
||||
}
|
||||
|
||||
/**
|
||||
* @return {string}
|
||||
*/
|
||||
export const Button = () => makeButtons( [
|
||||
makeButton( {
|
||||
action: 'default',
|
||||
weight: 'quiet'
|
||||
}, 'Quiet button', cdxIconAdd ),
|
||||
makeButton( {
|
||||
action: 'progressive',
|
||||
weight: 'quiet'
|
||||
}, 'Quiet progressive', cdxIconAdd ),
|
||||
makeButton( {
|
||||
action: 'destructive',
|
||||
weight: 'quiet'
|
||||
}, 'Quiet destructive', cdxIconAdd ),
|
||||
makeButton( {
|
||||
action: 'default',
|
||||
weight: 'normal'
|
||||
}, 'Normal', cdxIconAdd ),
|
||||
makeButton( {
|
||||
weight: 'primary',
|
||||
action: 'progressive'
|
||||
}, 'Progressive primary', cdxIconAdd ),
|
||||
makeButton( {
|
||||
weight: 'primary',
|
||||
action: 'destructive'
|
||||
}, 'Destructive primary', cdxIconAdd ),
|
||||
makeIcon()
|
||||
] );
|
|
@ -1,84 +0,0 @@
|
|||
import { htmlUserLanguageAttributes } from './utils';
|
||||
import footerTemplate from '!!raw-loader!../includes/templates/Footer.mustache';
|
||||
import footerRowTemplate from '!!raw-loader!../includes/templates/Footer__row.mustache';
|
||||
|
||||
export const FOOTER_TEMPLATE_PARTIALS = {
|
||||
// eslint-disable-next-line camelcase
|
||||
Footer__row: footerRowTemplate
|
||||
};
|
||||
|
||||
const
|
||||
FOOTER_INFO = {
|
||||
id: 'footer-info',
|
||||
'array-items': [
|
||||
{
|
||||
id: 'footer-info-lastmod',
|
||||
html: 'This page was last modified on 10 January 2020, at 21:24.'
|
||||
},
|
||||
{
|
||||
id: 'footer-info-copyright',
|
||||
html: `This text is available under the <a href="https://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-ShareAlike Licence</a>;
|
||||
additional terms may apply. See <a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Terms_of_Use">Terms of Use</a> for details.`
|
||||
|
||||
}
|
||||
]
|
||||
},
|
||||
FOOTER_PLACES = {
|
||||
id: 'footer-places',
|
||||
'array-items': [
|
||||
{
|
||||
id: 'footer-places-privacy',
|
||||
html: `<a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Privacy_policy" class="extiw" title="wmf:Privacy policy">Privacy policy</a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-places-about',
|
||||
html: `<a href="/wiki/Wikipedia:About" title="Wikipedia:About">About Wikipedia</a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-places-disclaimer',
|
||||
html: `<a href="/wiki/Wikipedia:General_disclaimer" title="Wikipedia:General disclaimer">Disclaimers</a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-places-contact',
|
||||
html: `<a href="//en.wikipedia.org/wiki/Wikipedia:Contact_us">Contact Wikipedia</a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-places-developers',
|
||||
html: `<a href="https://www.mediawiki.org/wiki/Special:MyLanguage/How_to_contribute">Developers</a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-places-statslink',
|
||||
html: `<a href="https://stats.wikimedia.org/v2/#/en.wikipedia.org">Statistics</a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-places-cookiestatement',
|
||||
html: `<a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Cookie_statement">Cookie statement</a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-places-mobileview',
|
||||
html: `<a href="//en.m.wikipedia.org/w/index.php?title=Paris&useskin=vector&mobileaction=toggle_view_mobile" class="noprint stopMobileRedirectToggle">Mobile view</a>`
|
||||
}
|
||||
]
|
||||
},
|
||||
FOOTER_ICONS = {
|
||||
id: 'footer-icons',
|
||||
'array-items': [
|
||||
{
|
||||
id: 'footer-copyrightico',
|
||||
html: `<a href="https://wikimediafoundation.org/"><img src="https://wikipedia.org/static/images/wikimedia-button.png" srcset="https://wikipedia.org/static/images/wikimedia-button-1.5x.png 1.5x, https://wikipedia.org/static/images/wikimedia-button-2x.png 2x" width="88" height="31" alt="Wikimedia Foundation"/></a>`
|
||||
},
|
||||
{
|
||||
id: 'footer-poweredbyico',
|
||||
html: `<a href="https://www.mediawiki.org/"><img src="https://wikipedia.org/static/images/poweredby_mediawiki_88x31.png" alt="Powered by MediaWiki" srcset="https://wikipedia.org/static/images/poweredby_mediawiki_132x47.png 1.5x, https://wikipedia.org/static/images/poweredby_mediawiki_176x62.png 2x" width="88" height="31"/></a>`
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export { footerTemplate };
|
||||
|
||||
export const FOOTER_TEMPLATE_DATA = {
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'data-info': FOOTER_INFO,
|
||||
'data-places': FOOTER_PLACES,
|
||||
'data-icons': FOOTER_ICONS
|
||||
};
|
|
@ -1,14 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { FOOTER_TEMPLATE_DATA, FOOTER_TEMPLATE_PARTIALS,
|
||||
footerTemplate } from './Footer.stories.data';
|
||||
import '../resources/skins.vector.styles/Footer.less';
|
||||
|
||||
export default {
|
||||
title: 'Footer'
|
||||
};
|
||||
|
||||
export const footer = () => mustache.render(
|
||||
footerTemplate,
|
||||
FOOTER_TEMPLATE_DATA,
|
||||
FOOTER_TEMPLATE_PARTIALS
|
||||
);
|
|
@ -1,23 +0,0 @@
|
|||
import headerTemplate from '!!raw-loader!../includes/templates/Header.mustache';
|
||||
import { logoTemplate as Logo, LOGO_TEMPLATE_DATA } from './Logo.stories.data';
|
||||
import { searchBoxTemplate as SearchBox,
|
||||
searchBoxDataWithCollapsing,
|
||||
SEARCH_TEMPLATE_PARTIALS } from './SearchBox.stories.data';
|
||||
import { userLinksTemplate as UserLinks,
|
||||
USER_LINKS_LOGGED_OUT_TEMPLATE_DATA,
|
||||
USER_LINK_PARTIALS } from './UserLinks.stories.data';
|
||||
|
||||
export const HEADER_TEMPLATE_PARTIALS = Object.assign( {
|
||||
SearchBox,
|
||||
Logo,
|
||||
UserLinks
|
||||
}, SEARCH_TEMPLATE_PARTIALS, USER_LINK_PARTIALS );
|
||||
|
||||
export { headerTemplate };
|
||||
|
||||
export const HEADER_TEMPLATE_DATA = Object.assign( {
|
||||
'msg-vector-main-menu-tooltip': 'Tooltip',
|
||||
'msg-vector-action-toggle-sidebar': 'Toggle',
|
||||
'data-search-box': searchBoxDataWithCollapsing,
|
||||
'data-vector-user-links': USER_LINKS_LOGGED_OUT_TEMPLATE_DATA
|
||||
}, LOGO_TEMPLATE_DATA.wordmarkTaglineIcon );
|
|
@ -1,14 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { HEADER_TEMPLATE_DATA, HEADER_TEMPLATE_PARTIALS,
|
||||
headerTemplate } from './Header.stories.data';
|
||||
import '../resources/skins.vector.styles/components/Header.less';
|
||||
|
||||
export default {
|
||||
title: 'Header'
|
||||
};
|
||||
|
||||
export const header = () => mustache.render(
|
||||
headerTemplate,
|
||||
HEADER_TEMPLATE_DATA,
|
||||
HEADER_TEMPLATE_PARTIALS
|
||||
);
|
|
@ -1,30 +0,0 @@
|
|||
import { placeholder, htmlUserLanguageAttributes,
|
||||
makeIcon, portletAfter } from './utils';
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
export const languageData = {
|
||||
id: 'p-lang-btn',
|
||||
'is-dropdown': true,
|
||||
// both classes needed for this to render correctly
|
||||
class: 'mw-portlet-lang vector-menu-dropdown',
|
||||
// mw-interlanguage-selector must be present to operate in ULS mode.
|
||||
// icon classes and button classes
|
||||
'checkbox-class': 'mw-interlanguage-selector',
|
||||
'html-vector-heading-icon': makeIcon( 'wikimedia-language' ),
|
||||
'heading-class': 'mw-ui-button mw-ui-quiet',
|
||||
'html-tooltip': 'A message tooltip-p-lang must exist for this to appear',
|
||||
label: '10 languages',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `
|
||||
<li class="interlanguage-link interwiki-ace">
|
||||
<a href="https://ace.wikipedia.org/wiki/Seupanyo"
|
||||
title="Seupanyo – Achinese" lang="ace" hreflang="ace" class="interlanguage-link-target">Acèh</a>
|
||||
</li><li class="interlanguage-link interwiki-kbd"><a href="https://kbd.wikipedia.org/wiki/%D0%AD%D1%81%D0%BF%D0%B0%D0%BD%D0%B8%D1%8D" title="Эспаниэ – Kabardian" lang="kbd" hreflang="kbd" class="interlanguage-link-target">Адыгэбзэ</a></li><li class="interlanguage-link interwiki-ady"><a href="https://ady.wikipedia.org/wiki/%D0%98%D1%81%D0%BF%D0%B0%D0%BD%D0%B8%D0%B5" title="Испание – Adyghe" lang="ady" hreflang="ady" class="interlanguage-link-target">Адыгабзэ</a></li><li class="interlanguage-link interwiki-af"><a href="https://af.wikipedia.org/wiki/Spanje" title="Spanje – Afrikaans" lang="af" hreflang="af" class="interlanguage-link-target">Afrikaans</a></li><li class="interlanguage-link interwiki-ak"><a href="https://ak.wikipedia.org/wiki/Spain" title="Spain – Akan" lang="ak" hreflang="ak" class="interlanguage-link-target">Akan</a></li><li class="interlanguage-link interwiki-als"><a href="https://als.wikipedia.org/wiki/Spanien" title="Spanien – Alemannisch" lang="gsw" hreflang="gsw" class="interlanguage-link-target">Alemannisch</a></li><li class="interlanguage-link interwiki-am"><a href="https://am.wikipedia.org/wiki/%E1%8A%A5%E1%88%B5%E1%8D%93%E1%8A%95%E1%8B%AB" title="እስፓንያ – Amharic" lang="am" hreflang="am" class="interlanguage-link-target">አማርኛ</a></li><li class="interlanguage-link interwiki-ang"><a href="https://ang.wikipedia.org/wiki/Sp%C4%93onland" title="Spēonland – Old English" lang="ang" hreflang="ang" class="interlanguage-link-target">Ænglisc</a></li><li class="interlanguage-link interwiki-ab"><a href="https://ab.wikipedia.org/wiki/%D0%98%D1%81%D0%BF%D0%B0%D0%BD%D0%B8%D0%B0" title="Испаниа – Abkhazian" lang="ab" hreflang="ab" class="interlanguage-link-target">Аԥсшәа</a></li><li class="interlanguage-link interwiki-ar badge-Q17437798 badge-goodarticle" title="good article"><a href="https://ar.wikipedia.org/wiki/%D8%A5%D8%B3%D8%A8%D8%A7%D9%86%D9%8A%D8%A7" title="إسبانيا – Arabic" lang="ar" hreflang="ar" class="interlanguage-link-target">العربية</a></li>
|
||||
`,
|
||||
'html-after-portal': portletAfter(
|
||||
`<span class="wb-langlinks-edit wb-langlinks-link"><a href="https://www.wikidata.org/wiki/Special:EntityPage/Q29#sitelinks-wikipedia" title="Edit interlanguage links (provided by WikiBase extension)" class="wbc-editpage">Edit links</a></span></div>
|
||||
${placeholder( `<p>Further hook output possible (lang)</p>`, 60 )}`
|
||||
)
|
||||
};
|
|
@ -1,10 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import '../resources/skins.vector.styles/LanguageButton.less';
|
||||
import { vectorMenuTemplate } from './MenuDropdown.stories.data';
|
||||
import { languageData } from './LanguageButton.stories.data';
|
||||
|
||||
export default {
|
||||
title: 'LanguageButton'
|
||||
};
|
||||
|
||||
export const languageButton = () => mustache.render( vectorMenuTemplate, languageData );
|
|
@ -1,81 +0,0 @@
|
|||
import logoTemplate from '!!raw-loader!../includes/templates/Logo.mustache';
|
||||
import wordmarkSrc from '../.storybook/resolve-imports/assets/wordmark.svg';
|
||||
import tagelineScr from '../.storybook/resolve-imports/assets/tagline.svg';
|
||||
import iconSrc from '../.storybook/resolve-imports/assets/icon.png';
|
||||
|
||||
/**
|
||||
* @type {LogoOptions}
|
||||
*/
|
||||
const wordmark = {
|
||||
src: wordmarkSrc,
|
||||
width: 116,
|
||||
height: 18
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {LogoOptions}
|
||||
*/
|
||||
const tagline = {
|
||||
src: tagelineScr,
|
||||
width: 117,
|
||||
height: 13
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {string}
|
||||
*/
|
||||
const icon = iconSrc;
|
||||
|
||||
/**
|
||||
* @type {LogoTemplateData}
|
||||
*/
|
||||
const wordmarkTaglineIcon = {
|
||||
'data-logos': {
|
||||
wordmark, tagline, icon
|
||||
},
|
||||
'msg-sitetitle': 'Wikipedia',
|
||||
'msg-sitesubtitle': 'the free encyclopedia'
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {LogoTemplateData}
|
||||
*/
|
||||
const wordmarkIcon = {
|
||||
'data-logos': {
|
||||
wordmark, icon
|
||||
},
|
||||
'msg-sitetitle': 'Wikipedia',
|
||||
'msg-sitesubtitle': 'the free encyclopedia'
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {LogoTemplateData}
|
||||
*/
|
||||
const wordmarkOnly = {
|
||||
'data-logos': {
|
||||
wordmark
|
||||
},
|
||||
'msg-sitetitle': 'Wikipedia',
|
||||
'msg-sitesubtitle': 'the free encyclopedia'
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {LogoTemplateData}
|
||||
*/
|
||||
const noLogo = {
|
||||
'data-logos': {},
|
||||
'msg-sitetitle': 'Wikipedia',
|
||||
'msg-sitesubtitle': 'the free encyclopedia'
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {Object.<string, LogoTemplateData>}
|
||||
*/
|
||||
const LOGO_TEMPLATE_DATA = {
|
||||
wordmarkTaglineIcon,
|
||||
wordmarkIcon,
|
||||
wordmarkOnly,
|
||||
noLogo
|
||||
};
|
||||
|
||||
export { LOGO_TEMPLATE_DATA, logoTemplate };
|
|
@ -1,27 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { logoTemplate, LOGO_TEMPLATE_DATA } from './Logo.stories.data';
|
||||
import '../resources/skins.vector.styles/Logo.less';
|
||||
|
||||
export default {
|
||||
title: 'Logo'
|
||||
};
|
||||
|
||||
export const logo = () => mustache.render(
|
||||
logoTemplate,
|
||||
LOGO_TEMPLATE_DATA.wordmarkTaglineIcon[ 'data-logos' ]
|
||||
);
|
||||
|
||||
export const logoWordmarkIcon = () => mustache.render(
|
||||
logoTemplate,
|
||||
LOGO_TEMPLATE_DATA.wordmarkIcon[ 'data-logos' ]
|
||||
);
|
||||
|
||||
export const logoWordmark = () => mustache.render(
|
||||
logoTemplate,
|
||||
LOGO_TEMPLATE_DATA.wordmarkOnly[ 'data-logos' ]
|
||||
);
|
||||
|
||||
export const noLogo = () => mustache.render(
|
||||
logoTemplate,
|
||||
LOGO_TEMPLATE_DATA.noLogo
|
||||
);
|
|
@ -1,15 +0,0 @@
|
|||
import menuTemplate from '!!raw-loader!../includes/templates/Menu.mustache';
|
||||
import legacyMenuTemplate from '!!raw-loader!../includes/templates/LegacyMenu.mustache';
|
||||
import { helperMakeMenuData } from './utils';
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
const defaultMenu = helperMakeMenuData(
|
||||
'generic',
|
||||
`<li><a href='#'>Item 1</a></li>
|
||||
<li><a href='#'>Item 2</a></li>
|
||||
<li><a href='#'>Item 3</a></li>`
|
||||
);
|
||||
|
||||
export { menuTemplate, legacyMenuTemplate, defaultMenu };
|
|
@ -1,12 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { menuTemplate, defaultMenu } from './Menu.stories.data';
|
||||
import '../resources/skins.vector.styles/Menu.less';
|
||||
|
||||
export default {
|
||||
title: 'Menu'
|
||||
};
|
||||
|
||||
export const menu = () => mustache.render(
|
||||
menuTemplate,
|
||||
defaultMenu
|
||||
);
|
|
@ -1,69 +0,0 @@
|
|||
import vectorMenuTemplate from '!!raw-loader!../includes/templates/Menu.mustache';
|
||||
import { htmlUserLanguageAttributes } from './utils';
|
||||
|
||||
export { vectorMenuTemplate };
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
export const moreData = {
|
||||
'is-dropdown': true,
|
||||
class: 'vector-menu-dropdown',
|
||||
label: 'More',
|
||||
id: 'p-cactions',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `<li id="ca-delete">
|
||||
<a href="/w/index.php?title=Main_Page&action=delete"
|
||||
title="Delete this page [⌃⌥d]" accesskey="d">Delete</a>
|
||||
</li>
|
||||
<li id="ca-move">
|
||||
<a href="/w/index.php/Special:MovePage/Main_Page"
|
||||
title="Move this page [⌃⌥m]" accesskey="m">Move</a>
|
||||
</li>
|
||||
<li id="ca-protect">
|
||||
<a href="/w/index.php?title=Main_Page&action=protect"
|
||||
title="Protect this page [⌃⌥=]" accesskey="=">Protect</a>
|
||||
</li>`
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
export const variantsData = {
|
||||
'is-dropdown': true,
|
||||
class: 'vector-menu-dropdown',
|
||||
label: '新加坡简体',
|
||||
id: 'p-variants',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `<li id="ca-varlang-0">
|
||||
<a href="/zh/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh" lang="zh">不转换</a></li>
|
||||
<li id="ca-varlang-1">
|
||||
<a href="/zh-hans/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh-Hans" lang="zh-Hans">简体</a>
|
||||
</li>
|
||||
<li id="ca-varlang-2">
|
||||
<a href="/zh-hant/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh-Hant" lang="zh-Hant">繁體</a>
|
||||
</li>
|
||||
<li id="ca-varlang-3">
|
||||
<a href="/zh-cn/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh-Hans-CN" lang="zh-Hans-CN">大陆简体</a>
|
||||
</li>
|
||||
<li id="ca-varlang-4">
|
||||
<a href="/zh-hk/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh-Hant-HK" lang="zh-Hant-HK">香港繁體</a>
|
||||
</li>
|
||||
<li id="ca-varlang-5">
|
||||
<a href="/zh-mo/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh-Hant-MO" lang="zh-Hant-MO">澳門繁體</a>
|
||||
</li>
|
||||
<li id="ca-varlang-7" class="selected">
|
||||
<a href="/zh-sg/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh-Hans-SG" lang="zh-Hans-SG">新加坡简体</a>
|
||||
</li>
|
||||
<li id="ca-varlang-8">
|
||||
<a href="/zh-tw/%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD"
|
||||
hreflang="zh-Hant-TW" lang="zh-Hant-TW">臺灣正體</a>
|
||||
</li>`
|
||||
};
|
|
@ -1,10 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { vectorMenuTemplate, moreData, variantsData } from './MenuDropdown.stories.data';
|
||||
|
||||
export default {
|
||||
title: 'MenuDropdown'
|
||||
};
|
||||
|
||||
export const more = () => mustache.render( vectorMenuTemplate, moreData );
|
||||
|
||||
export const variants = () => mustache.render( vectorMenuTemplate, variantsData );
|
|
@ -1,86 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { vectorMenuTemplate as portalTemplate } from './MenuDropdown.stories.data';
|
||||
import { placeholder, htmlUserLanguageAttributes, portletAfter } 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;
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {Object.<string, MenuDefinition>}
|
||||
*/
|
||||
export const PORTALS = {
|
||||
example: {
|
||||
id: 'p-example',
|
||||
class: 'vector-menu-portal portal',
|
||||
'html-tooltip': 'Message tooltip-p-example acts as tooltip',
|
||||
label: 'Portal title',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `
|
||||
<li><a href='#'>A list of links</a></li>
|
||||
<li><a href='#'>with ids</a></li>
|
||||
<li><a href='#'>on each list item</a></li>
|
||||
`,
|
||||
'html-after-portal': portletAfter(
|
||||
placeholder( `<p>Beware: The <a href="https://codesearch.wmcloud.org/search/?q=SkinAfterPortlet&i=nope&files=&repos=">SkinAfterPortlet hook</a>
|
||||
can be used to inject arbitary HTML here for any portlet.</p>`, 60 )
|
||||
)
|
||||
},
|
||||
navigation: {
|
||||
id: 'p-navigation',
|
||||
class: 'vector-menu-portal portal',
|
||||
'html-tooltip': 'A message tooltip-p-navigation must exist for this to appear',
|
||||
label: 'Navigation',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `
|
||||
<li id="n-mainpage-description"><a href="/wiki/Main_Page" title="Visit the main page [⌃⌥z]" accesskey="z">Main page</a></li><li id="n-contents"><a href="/wiki/Wikipedia:Contents" title="Guides to browsing Wikipedia">Contents</a></li><li id="n-featuredcontent"><a href="/wiki/Wikipedia:Featured_content" title="Featured content – the best of Wikipedia">Featured content</a></li><li id="n-currentevents"><a href="/wiki/Portal:Current_events" title="Find background information on current events">Current events</a></li><li id="n-randompage"><a href="/wiki/Special:Random" title="Load a random page [⌃⌥x]" accesskey="x">Random page</a></li><li id="n-sitesupport"><a href="https://donate.wikimedia.org/wiki/Special:FundraiserRedirector?utm_source=donate&utm_medium=sidebar&utm_campaign=C13_en.wikipedia.org&uselang=en" title="Support us">Donate</a></li><li id="n-shoplink"><a href="//shop.wikimedia.org" title="Visit the Wikipedia store">Wikipedia store</a></li>
|
||||
`,
|
||||
'html-after-portal': portletAfter( placeholder( 'Possible hook output (navigation)', 50 ) )
|
||||
},
|
||||
toolbox: {
|
||||
id: 'p-tb',
|
||||
class: 'vector-menu-portal portal',
|
||||
'html-tooltip': 'A message tooltip-p-tb must exist for this to appear',
|
||||
label: 'Tools',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `
|
||||
<li id="t-whatlinkshere"><a href="/wiki/Special:WhatLinksHere/Spain" title="A list of all wiki pages that link here [⌃⌥j]" accesskey="j">What links here</a></li><li id="t-recentchangeslinked"><a href="/wiki/Special:RecentChangesLinked/Spain" rel="nofollow" title="Recent changes in pages linked from this page [⌃⌥k]" accesskey="k">Related changes</a></li><li id="t-upload"><a href="/wiki/Wikipedia:File_Upload_Wizard" title="Upload files [⌃⌥u]" accesskey="u">Upload file</a></li><li id="t-specialpages"><a href="/wiki/Special:SpecialPages" title="A list of all special pages [⌃⌥q]" accesskey="q">Special pages</a></li><li id="t-permalink"><a href="/w/index.php?title=Spain&oldid=935087243" title="Permanent link to this revision of the page">Permanent link</a></li><li id="t-info"><a href="/w/index.php?title=Spain&action=info" title="More information about this page">Page information</a></li><li id="t-wikibase"><a href="https://www.wikidata.org/wiki/Special:EntityPage/Q29" title="Link to connected data repository item [⌃⌥g]" accesskey="g">Wikidata item</a></li><li id="t-cite"><a href="/w/index.php?title=Special:CiteThisPage&page=Spain&id=935087243" title="Information on how to cite this page">Cite this page</a></li>
|
||||
`,
|
||||
'html-after-portal': portletAfter( placeholder( 'Possible hook output (tb)', 50 ) )
|
||||
},
|
||||
langlinks: {
|
||||
id: 'p-lang',
|
||||
class: 'vector-menu-portal portal',
|
||||
'html-tooltip': 'A message tooltip-p-lang must exist for this to appear',
|
||||
label: 'In other languages',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `
|
||||
<li class="interlanguage-link interwiki-ace">
|
||||
<a href="https://ace.wikipedia.org/wiki/Seupanyo"
|
||||
title="Seupanyo – Achinese" lang="ace" hreflang="ace" class="interlanguage-link-target">Acèh</a>
|
||||
</li><li class="interlanguage-link interwiki-kbd"><a href="https://kbd.wikipedia.org/wiki/%D0%AD%D1%81%D0%BF%D0%B0%D0%BD%D0%B8%D1%8D" title="Эспаниэ – Kabardian" lang="kbd" hreflang="kbd" class="interlanguage-link-target">Адыгэбзэ</a></li><li class="interlanguage-link interwiki-ady"><a href="https://ady.wikipedia.org/wiki/%D0%98%D1%81%D0%BF%D0%B0%D0%BD%D0%B8%D0%B5" title="Испание – Adyghe" lang="ady" hreflang="ady" class="interlanguage-link-target">Адыгабзэ</a></li><li class="interlanguage-link interwiki-af"><a href="https://af.wikipedia.org/wiki/Spanje" title="Spanje – Afrikaans" lang="af" hreflang="af" class="interlanguage-link-target">Afrikaans</a></li><li class="interlanguage-link interwiki-ak"><a href="https://ak.wikipedia.org/wiki/Spain" title="Spain – Akan" lang="ak" hreflang="ak" class="interlanguage-link-target">Akan</a></li><li class="interlanguage-link interwiki-als"><a href="https://als.wikipedia.org/wiki/Spanien" title="Spanien – Alemannisch" lang="gsw" hreflang="gsw" class="interlanguage-link-target">Alemannisch</a></li><li class="interlanguage-link interwiki-am"><a href="https://am.wikipedia.org/wiki/%E1%8A%A5%E1%88%B5%E1%8D%93%E1%8A%95%E1%8B%AB" title="እስፓንያ – Amharic" lang="am" hreflang="am" class="interlanguage-link-target">አማርኛ</a></li><li class="interlanguage-link interwiki-ang"><a href="https://ang.wikipedia.org/wiki/Sp%C4%93onland" title="Spēonland – Old English" lang="ang" hreflang="ang" class="interlanguage-link-target">Ænglisc</a></li><li class="interlanguage-link interwiki-ab"><a href="https://ab.wikipedia.org/wiki/%D0%98%D1%81%D0%BF%D0%B0%D0%BD%D0%B8%D0%B0" title="Испаниа – Abkhazian" lang="ab" hreflang="ab" class="interlanguage-link-target">Аԥсшәа</a></li><li class="interlanguage-link interwiki-ar badge-Q17437798 badge-goodarticle" title="good article"><a href="https://ar.wikipedia.org/wiki/%D8%A5%D8%B3%D8%A8%D8%A7%D9%86%D9%8A%D8%A7" title="إسبانيا – Arabic" lang="ar" hreflang="ar" class="interlanguage-link-target">العربية</a></li><li class="interlanguage-link interwiki-an">
|
||||
`,
|
||||
'html-after-portal': portletAfter(
|
||||
`<span class="wb-langlinks-edit wb-langlinks-link"><a href="https://www.wikidata.org/wiki/Special:EntityPage/Q29#sitelinks-wikipedia" title="Edit interlanguage links (provided by WikiBase extension)" class="wbc-editpage">Edit links</a></span></div>
|
||||
${placeholder( `<p>Further hook output possible (lang)</p>`, 60 )}`
|
||||
)
|
||||
},
|
||||
otherProjects: {
|
||||
id: 'p-wikibase-otherprojects',
|
||||
class: 'vector-menu-portal portal',
|
||||
'html-tooltip': 'A message tooltip-p-wikibase-otherprojects must exist for this to appear',
|
||||
label: 'In other projects',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
|
||||
'html-items': `
|
||||
<li class="wb-otherproject-link wb-otherproject-commons"><a href="https://commons.wikimedia.org/wiki/Category:Spain" hreflang="en">Wikimedia Commons</a></li><li class="wb-otherproject-link wb-otherproject-wikinews"><a href="https://en.wikinews.org/wiki/Category:Spain" hreflang="en">Wikinews</a></li><li class="wb-otherproject-link wb-otherproject-wikiquote"><a href="https://en.wikiquote.org/wiki/Spain" hreflang="en">Wikiquote</a></li><li class="wb-otherproject-link wb-otherproject-wikivoyage"><a href="https://en.wikivoyage.org/wiki/Spain" hreflang="en">Wikivoyage</a></li>`,
|
||||
'html-after-portal': ''
|
||||
}
|
||||
};
|
|
@ -1,11 +0,0 @@
|
|||
import { PORTALS, wrapPortlet } from './MenuPortal.stories.data';
|
||||
|
||||
export default {
|
||||
title: 'MenuPortal'
|
||||
};
|
||||
|
||||
export const portal = () => wrapPortlet( PORTALS.example );
|
||||
export const navigationPortal = () => wrapPortlet( PORTALS.navigation );
|
||||
export const toolbox = () => wrapPortlet( PORTALS.toolbox );
|
||||
export const langlinks = () => wrapPortlet( PORTALS.langlinks );
|
||||
export const otherProjects = () => wrapPortlet( PORTALS.otherProjects );
|
|
@ -1,34 +0,0 @@
|
|||
import { htmlUserLanguageAttributes } from './utils';
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
export const pageActionsData = {
|
||||
id: 'p-views',
|
||||
class: 'vector-menu-tabs',
|
||||
label: 'Views',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `<li id="ca-view" class="collapsible selected">
|
||||
<a href="/wiki/Main_Page">Read</a>
|
||||
</li>
|
||||
<li id="ca-viewsource" class="collapsible">
|
||||
<a href="/w/index.php?title=Main_Page&action=edit" title="This page is protected.
|
||||
You can view its source [⌃⌥e]" accesskey="e">View source</a></li>
|
||||
<li id="ca-history" class="collapsible">
|
||||
<a href="/w/index.php?title=Main_Page&action=history" title="Past revisions of this page [⌃⌥h]" accesskey="h">View history</a>
|
||||
</li>
|
||||
<li id="ca-unwatch" class="collapsible icon mw-watchlink"><a href="/w/index.php?title=Main_Page&action=unwatch" data-mw="interface" title="Remove this page from your watchlist [⌃⌥w]" accesskey="w">Unwatch</a></li>
|
||||
`
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
export const namespaceTabsData = {
|
||||
id: 'p-namespaces',
|
||||
class: 'vector-menu-tabs',
|
||||
label: 'Namespaces',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': `<li id="ca-nstab-main" class="selected"><a href="/wiki/Main_Page" title="View the content page [⌃⌥c]" accesskey="c">Main page</a></li>
|
||||
<li id="ca-talk"><a href="/wiki/Talk:Main_Page" rel="discussion" title="Discussion about the content page [⌃⌥t]" accesskey="t">Talk (3)</a></li>`
|
||||
};
|
|
@ -1,13 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { menuTemplate as vectorTabsTemplate } from './Menu.stories.data';
|
||||
import { namespaceTabsData, pageActionsData } from './MenuTabs.stories.data';
|
||||
import '../resources/skins.vector.styles/components/MenuTabs.less';
|
||||
import '../resources/skins.vector.styles/components/TabWatchstarLink.less';
|
||||
|
||||
export default {
|
||||
title: 'MenuTabs'
|
||||
};
|
||||
|
||||
export const pageActionTabs = () => mustache.render( vectorTabsTemplate, pageActionsData );
|
||||
|
||||
export const namespaceTabs = () => mustache.render( vectorTabsTemplate, namespaceTabsData );
|
|
@ -1,28 +0,0 @@
|
|||
import pageToolbarTemplate from '!!raw-loader!../includes/templates/PageToolbar.mustache';
|
||||
import { namespaceTabsData, pageActionsData } from './MenuTabs.stories.data';
|
||||
import { menuTemplate } from './Menu.stories.data';
|
||||
|
||||
const PAGE_TOOLBAR_TEMPLATE_DATA = {
|
||||
'data-portlets': {
|
||||
'data-views': pageActionsData,
|
||||
'data-namespaces': namespaceTabsData
|
||||
}
|
||||
};
|
||||
|
||||
const PAGE_TOOLBAR_TEMPLATE_DATA_LEGACY = {
|
||||
'data-portlets': {
|
||||
'data-views': Object.assign( {}, pageActionsData, {
|
||||
class: 'vector-menu-tabs-legacy'
|
||||
} ),
|
||||
'data-namespaces': Object.assign( {}, namespaceTabsData, {
|
||||
class: 'vector-menu-tabs-legacy'
|
||||
} )
|
||||
}
|
||||
};
|
||||
|
||||
const PAGE_TOOLBAR_PARTIALS = {
|
||||
Menu: menuTemplate
|
||||
};
|
||||
|
||||
export { pageToolbarTemplate, PAGE_TOOLBAR_TEMPLATE_DATA,
|
||||
PAGE_TOOLBAR_TEMPLATE_DATA_LEGACY, PAGE_TOOLBAR_PARTIALS };
|
|
@ -1,15 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { pageToolbarTemplate,
|
||||
PAGE_TOOLBAR_TEMPLATE_DATA,
|
||||
PAGE_TOOLBAR_PARTIALS } from './PageToolbar.stories.data';
|
||||
import '../resources/skins.vector.styles/components/PageToolbar.less';
|
||||
|
||||
export default {
|
||||
title: 'PageToolbar'
|
||||
};
|
||||
|
||||
export const defaultState = () => mustache.render(
|
||||
pageToolbarTemplate,
|
||||
PAGE_TOOLBAR_TEMPLATE_DATA,
|
||||
PAGE_TOOLBAR_PARTIALS
|
||||
);
|
|
@ -1,54 +0,0 @@
|
|||
import searchBoxTemplate from '!!raw-loader!../includes/templates/SearchBox.mustache';
|
||||
import Button from '!!raw-loader!../includes/templates/Button.mustache';
|
||||
import { htmlUserLanguageAttributes } from './utils';
|
||||
|
||||
const INPUT_ATTRIBUTES = 'type="search" name="search" placeholder="Search Wikipedia" title="Search Wikipedia [⌃⌥f]" accesskey="f" id="searchInput" autocomplete="off"';
|
||||
const FULL_TEXT_ATTRIBUTES = 'name="fulltext" title="Search pages for this text" id="mw-searchButton" class="searchButton mw-fallbackSearchButton"';
|
||||
const GO_ATTRIBUTES = 'name="go" title="Go to a page with this exact name if it exists" id="searchButton" class="searchButton"';
|
||||
|
||||
/**
|
||||
* @type {SearchData}
|
||||
*/
|
||||
const searchBoxData = {
|
||||
'form-action': '/w/index.php',
|
||||
'form-id': 'searchform',
|
||||
'is-primary': false,
|
||||
class: 'vector-search-show-thumbnail',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'msg-search': 'Search',
|
||||
'html-input': `<input ${INPUT_ATTRIBUTES}>`,
|
||||
'page-title': 'Special:Search',
|
||||
'html-input-attributes': INPUT_ATTRIBUTES,
|
||||
'html-button-fulltext-attributes': FULL_TEXT_ATTRIBUTES,
|
||||
'msg-searchbutton': 'Search',
|
||||
'msg-searcharticle': 'Go',
|
||||
'html-button-go-attributes': GO_ATTRIBUTES,
|
||||
'html-button-search-fallback': `<input type="submit" ${FULL_TEXT_ATTRIBUTES} value="Search" />`,
|
||||
'html-button-search': `<input type="submit" ${GO_ATTRIBUTES} value="Go">`
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {SearchData}
|
||||
*/
|
||||
const searchBoxDataWithCollapsing = Object.assign( {}, searchBoxData, {
|
||||
class: `${searchBoxData.class} vector-search-box-collapses`,
|
||||
'is-collapsible': true,
|
||||
'data-collapse-icon': {
|
||||
icon: 'wikimedia-search',
|
||||
'is-quiet': true,
|
||||
class: 'search-toggle',
|
||||
href: '/wiki/Special:Search',
|
||||
label: 'Search'
|
||||
}
|
||||
} );
|
||||
|
||||
const SEARCH_TEMPLATE_PARTIALS = {
|
||||
Button
|
||||
};
|
||||
|
||||
export {
|
||||
SEARCH_TEMPLATE_PARTIALS,
|
||||
searchBoxTemplate,
|
||||
searchBoxDataWithCollapsing,
|
||||
searchBoxData
|
||||
};
|
|
@ -1,18 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import '../resources/skins.vector.styles/SearchBox.less';
|
||||
|
||||
import { searchBoxData, searchBoxDataWithCollapsing, searchBoxTemplate,
|
||||
SEARCH_TEMPLATE_PARTIALS
|
||||
} from './SearchBox.stories.data';
|
||||
|
||||
export default {
|
||||
title: 'SearchBox'
|
||||
};
|
||||
|
||||
export const searchBoxWithoutCollapsing = () => `
|
||||
${mustache.render( searchBoxTemplate, searchBoxData, SEARCH_TEMPLATE_PARTIALS )}
|
||||
`;
|
||||
|
||||
export const searchBoxWithCollapsing = () => `
|
||||
${mustache.render( searchBoxTemplate, searchBoxDataWithCollapsing, SEARCH_TEMPLATE_PARTIALS )}
|
||||
`;
|
|
@ -1,52 +0,0 @@
|
|||
import sidebarTemplate from '!!raw-loader!../includes/templates/MainMenu.mustache';
|
||||
import sidebarLegacyTemplate from '!!raw-loader!../includes/templates/LegacySidebar.mustache';
|
||||
import { vectorMenuTemplate } from './MenuDropdown.stories.data';
|
||||
import { PORTALS } from './MenuPortal.stories.data';
|
||||
|
||||
const SIDEBAR_BEFORE_OUTPUT_HOOKINFO = `Beware: Portals can be added, removed or reordered using
|
||||
SidebarBeforeOutput hook as in this example.`;
|
||||
|
||||
export { sidebarTemplate, sidebarLegacyTemplate };
|
||||
|
||||
export const SIDEBAR_TEMPLATE_PARTIALS = {
|
||||
Menu: vectorMenuTemplate
|
||||
};
|
||||
|
||||
export const OPT_OUT_DATA = {
|
||||
'data-main-menu-action': {
|
||||
href: '#',
|
||||
'msg-vector-opt-out': 'Switch to old look',
|
||||
'msg-vector-opt-out-tooltip': 'Change your settings to go back to the old look of the skin (legacy Vector)'
|
||||
}
|
||||
};
|
||||
|
||||
export const SIDEBAR_DATA = {
|
||||
withNoPortals: {
|
||||
'array-portlets-rest': []
|
||||
},
|
||||
withPortals: {
|
||||
'data-portlets-first': PORTALS.navigation,
|
||||
'array-portlets-rest': [
|
||||
PORTALS.toolbox,
|
||||
PORTALS.otherProjects
|
||||
],
|
||||
'data-portals-languages': PORTALS.langlinks
|
||||
},
|
||||
withoutLogo: {
|
||||
'data-portals-languages': PORTALS.langlinks,
|
||||
'array-portals-first': PORTALS.navigation,
|
||||
'array-portlets-rest': [
|
||||
PORTALS.toolbox,
|
||||
PORTALS.otherProjects
|
||||
]
|
||||
},
|
||||
thirdParty: {
|
||||
'array-portlets-rest': [
|
||||
PORTALS.toolbox,
|
||||
PORTALS.navigation,
|
||||
{
|
||||
'html-portal-content': SIDEBAR_BEFORE_OUTPUT_HOOKINFO
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
|
@ -1,30 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import '../resources/skins.vector.styles/MainMenu.less';
|
||||
import '../resources/skins.vector.styles/SidebarLogo.less';
|
||||
|
||||
import { sidebarTemplate,
|
||||
sidebarLegacyTemplate, SIDEBAR_DATA, SIDEBAR_TEMPLATE_PARTIALS } from './Sidebar.stories.data';
|
||||
|
||||
export default {
|
||||
title: 'Sidebar'
|
||||
};
|
||||
|
||||
export const sidebarLegacyWithNoPortals = () => mustache.render(
|
||||
sidebarLegacyTemplate, SIDEBAR_DATA.withNoPortals, SIDEBAR_TEMPLATE_PARTIALS
|
||||
);
|
||||
|
||||
export const sidebarLegacyWithPortals = () => mustache.render(
|
||||
sidebarLegacyTemplate, SIDEBAR_DATA.withPortals, SIDEBAR_TEMPLATE_PARTIALS
|
||||
);
|
||||
|
||||
export const sidebarModernWithoutLogo = () => mustache.render(
|
||||
sidebarTemplate, SIDEBAR_DATA.withoutLogo, SIDEBAR_TEMPLATE_PARTIALS
|
||||
);
|
||||
|
||||
export const sidebarModernWithPortals = () => mustache.render(
|
||||
sidebarTemplate, SIDEBAR_DATA.withPortals, SIDEBAR_TEMPLATE_PARTIALS
|
||||
);
|
||||
|
||||
export const sidebarModernThirdParty = () => mustache.render(
|
||||
sidebarTemplate, SIDEBAR_DATA.thirdParty, SIDEBAR_TEMPLATE_PARTIALS
|
||||
);
|
|
@ -1,50 +0,0 @@
|
|||
import template from '!!raw-loader!../includes/templates/StickyHeader.mustache';
|
||||
import Button from '!!raw-loader!../includes/templates/Button.mustache';
|
||||
import { searchBoxData } from './SearchBox.stories.data';
|
||||
|
||||
const NO_ICON = {
|
||||
icon: 'none',
|
||||
'is-quiet': true,
|
||||
class: 'sticky-header-icon'
|
||||
};
|
||||
|
||||
const TALK_ICON = {
|
||||
icon: 'none',
|
||||
'is-quiet': true,
|
||||
class: 'sticky-header-icon mw-ui-icon-wikimedia-speechBubbles'
|
||||
};
|
||||
|
||||
const HISTORY_ICON = {
|
||||
icon: 'none',
|
||||
'is-quiet': true,
|
||||
class: 'sticky-header-icon mw-ui-icon-wikimedia-history'
|
||||
};
|
||||
|
||||
const data = {
|
||||
title: 'Audre Lorde',
|
||||
heading: 'Introduction',
|
||||
'data-buttons': [ {
|
||||
id: 'p-lang-btn-sticky-header',
|
||||
class: 'mw-interlanguage-selector',
|
||||
'is-quiet': true,
|
||||
label: '196 languages',
|
||||
'html-vector-button-icon': `<span class="mw-ui-icon mw-ui-icon-wikimedia-language"></span>`
|
||||
} ],
|
||||
'data-search': searchBoxData,
|
||||
'data-button-start': {
|
||||
icon: 'wikimedia-search',
|
||||
class: 'vector-sticky-header-search-toggle',
|
||||
'is-quiet': true,
|
||||
label: 'Search'
|
||||
},
|
||||
'data-button-end': NO_ICON,
|
||||
'data-icons': [
|
||||
TALK_ICON, HISTORY_ICON, NO_ICON, NO_ICON
|
||||
]
|
||||
};
|
||||
|
||||
export const STICKY_HEADER_TEMPLATE_PARTIALS = {
|
||||
Button
|
||||
};
|
||||
|
||||
export { template, data };
|
|
@ -1,13 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import '../resources/skins.vector.styles/components/StickyHeader.less';
|
||||
|
||||
import { template, data,
|
||||
STICKY_HEADER_TEMPLATE_PARTIALS } from './StickyHeader.stories.data';
|
||||
|
||||
export default {
|
||||
title: 'StickyHeader'
|
||||
};
|
||||
|
||||
export const stickyHeader = () => mustache.render(
|
||||
template, data, STICKY_HEADER_TEMPLATE_PARTIALS
|
||||
);
|
|
@ -1,146 +0,0 @@
|
|||
import msgs from '../i18n/en.json';
|
||||
import mustache from 'mustache';
|
||||
import { menuTemplate, legacyMenuTemplate } from './Menu.stories.data';
|
||||
import userLinksTemplateLegacy from '!!raw-loader!../includes/templates/LegacyUserLinks.mustache';
|
||||
import userLinksTemplate from '!!raw-loader!../includes/templates/UserLinks.mustache';
|
||||
import userLinksLogoutTemplate from '!!raw-loader!../includes/templates/UserLinks__logout.mustache';
|
||||
import userLinksLoginTemplate from '!!raw-loader!../includes/templates/UserLinks__login.mustache';
|
||||
import { helperClassName, helperMakeMenuData } from './utils';
|
||||
|
||||
/**
|
||||
* Legacy User Links
|
||||
*/
|
||||
|
||||
const ECHO_ITEMS = `<li id="pt-notifications-alert"><a href="/wiki/Special:Notifications" class="mw-echo-notifications-badge mw-echo-notification-badge-nojs oo-ui-icon-bell mw-echo-notifications-badge-all-read" data-counter-num="0" data-counter-text="0" title="Your alerts">Alerts (0)</a></li><li id="pt-notifications-notice"><a href="/wiki/Special:Notifications" class="mw-echo-notifications-badge mw-echo-notification-badge-nojs oo-ui-icon-tray" data-counter-num="3" data-counter-text="3" title="Your notices">Notices (3)</a></li>`;
|
||||
const USERNAME_ITEM = `<li id="pt-userpage"><a href="/wiki/User:WikiUser" dir="auto" title="Your user page [⌃⌥.]" accesskey=".">WikiUser</a></li>`;
|
||||
const REST_ITEMS = `<li id="pt-mytalk"><a href="/wiki/User_talk:WikiUser" title="Your talk page [⌃⌥n]" accesskey="n">Talk</a></li><li id="pt-sandbox"><a href="/wiki/User:WikiUser/sandbox" title="Your sandbox">Sandbox</a></li><li id="pt-preferences"><a href="/wiki/Special:Preferences" title="Your preferences">Preferences</a></li><li id="pt-betafeatures"><a href="/wiki/Special:Preferences#mw-prefsection-betafeatures" title="Beta features">Beta</a></li><li id="pt-watchlist"><a href="/wiki/Special:Watchlist" title="A list of pages you are monitoring for changes [⌃⌥l]" accesskey="l">Watchlist</a></li><li id="pt-mycontris"><a href="/wiki/Special:Contributions/WikiUser" title="A list of your contributions [⌃⌥y]" accesskey="y">Contributions</a></li>`;
|
||||
const LOGOUT_ITEM = `<li id="pt-logout"><a href="/w/index.php?title=Special:UserLogout&returnto=Main+Page&returntoquery=useskin%3Dvector" title="Log out">Log out</a></li>`;
|
||||
const ULS_LANGUAGE_SELECTOR = '<li class="uls-trigger active"><a href="#">English</a></li>';
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
const loggedOut = helperMakeMenuData(
|
||||
'personal',
|
||||
`<li id="pt-anonuserpage">Not logged in</li><li id="pt-anontalk"><a href="/wiki/Special:MyTalk" title="Discussion about edits from this IP address [⌃⌥n]" accesskey="n">Talk</a></li><li id="pt-anoncontribs"><a href="/wiki/Special:MyContributions" title="A list of edits made from this IP address [⌃⌥y]" accesskey="y">Contributions</a></li><li id="pt-createaccount"><a href="/w/index.php?title=Special:CreateAccount&returnto=Main+Page" title="You are encouraged to create an account and log in; however, it is not mandatory">Create account</a></li><li id="pt-login"><a href="/w/index.php?title=Special:UserLogin&returnto=Main+Page" title="You're encouraged to log in; however, it's not mandatory. [⌃⌥o]" accesskey="o">Log in</a></li>`,
|
||||
helperClassName( 'vector-user-menu-legacy' )
|
||||
);
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
const loggedInWithEcho = helperMakeMenuData(
|
||||
'personal',
|
||||
`${USERNAME_ITEM}${ECHO_ITEMS}${REST_ITEMS}${LOGOUT_ITEM}`,
|
||||
helperClassName( 'vector-user-menu-legacy' )
|
||||
);
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
const loggedInWithULS = helperMakeMenuData(
|
||||
'personal',
|
||||
`${ULS_LANGUAGE_SELECTOR}${USERNAME_ITEM}${ECHO_ITEMS}${REST_ITEMS}${LOGOUT_ITEM}`,
|
||||
helperClassName( 'vector-user-menu-legacy' )
|
||||
);
|
||||
|
||||
/**
|
||||
* @type {Object.<string, MenuDefinition>}
|
||||
*/
|
||||
const PERSONAL_MENU_TEMPLATE_DATA = {
|
||||
loggedOut,
|
||||
loggedInWithEcho,
|
||||
loggedInWithULS
|
||||
};
|
||||
|
||||
/**
|
||||
* Modern User Links
|
||||
*/
|
||||
|
||||
const LOGGED_IN_ITEMS = `
|
||||
<li id="pt-userpage" class="user-links-collapsible-item mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-userAvatar mw-ui-icon-wikimedia-userAvatar" href="/wiki/User:Admin" title="Your user page [⌃⌥.]" accesskey="."><span>Admin</span></a></li>
|
||||
<li id="pt-mytalk" class="mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-userTalk mw-ui-icon-wikimedia-userTalk" href="/wiki/User_talk:Admin" title="Your talk page [⌃⌥n]" accesskey="n"><span>Talk</span></a></li>
|
||||
<li id="pt-sandbox" class="new mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-sandbox mw-ui-icon-wikimedia-sandbox" href="/w/index.php?title=User:Admin/sandbox&action=edit&redlink=1" title="Your sandbox (page does not exist)"><span>Sandbox</span></a></li>
|
||||
<li id="pt-preferences" class="mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-settings mw-ui-icon-wikimedia-settings" href="/wiki/Special:Preferences" title="Your preferences"><span>Preferences</span></a></li>
|
||||
<li id="pt-betafeatures" class="mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-labFlask mw-ui-icon-wikimedia-labFlask" href="/wiki/Special:Preferences#mw-prefsection-betafeatures" title="Beta features"><span>Beta</span></a></li>
|
||||
<li id="pt-watchlist" class="user-links-collapsible-item mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-watchlist mw-ui-icon-wikimedia-watchlist" href="/wiki/Special:Watchlist" title="A list of pages you are monitoring for changes [⌃⌥l]" accesskey="l"><span>Watchlist</span></a></li>
|
||||
<li id="pt-uploads" class="mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-imageGallery mw-ui-icon-wikimedia-imageGallery" href="/w/index.php?title=Special:ListFiles/Admin&ilshowall=1" title="List of files you have uploaded"><span>Uploads</span></a></li>
|
||||
<li id="pt-mycontris" class="mw-list-item"><a class="mw-ui-icon mw-ui-icon-before mw-ui-icon-userContributions mw-ui-icon-wikimedia-userContributions" href="/wiki/Special:Contributions/Admin" title="A list of your contributions [⌃⌥y]" accesskey="y"><span>Contributions</span></a></li>
|
||||
`;
|
||||
|
||||
const LOGGED_OUT_ITEMS = `
|
||||
<li id="pt-anontalk" class="mw-list-item"><a href="/wiki/Special:MyTalk" title="Discussion about edits from this IP address [⌃⌥n]" accesskey="n"><span>Talk</span></a></li>
|
||||
<li id="pt-anoncontribs" class="mw-list-item"><a href="/wiki/Special:MyContributions" title="A list of edits made from this IP address [⌃⌥y]" accesskey="y"><span>Contributions</span></a></li>
|
||||
`;
|
||||
|
||||
const LOGGED_IN_OVERFLOW_ITEMS = `
|
||||
<li id="pt-userpage-2" class="user-links-collapsible-item mw-list-item"><a href="/wiki/User:Admin" class="mw-ui-button mw-ui-quiet" title="Your user page [⌃⌥.]" accesskey="."><span>Admin</span></a></li>
|
||||
<li id="pt-notifications-alert" class="mw-list-item"><a href="/wiki/Special:Notifications" class="mw-echo-notifications-badge mw-echo-notification-badge-nojs oo-ui-icon-bell mw-echo-notifications-badge-all-read" data-counter-num="0" data-counter-text="0" title="Your alerts"><span>Alerts (0)</span></a></li>
|
||||
<li id="pt-notifications-notice" class="mw-list-item"><a href="/wiki/Special:Notifications" class="mw-echo-notifications-badge mw-echo-notification-badge-nojs oo-ui-icon-tray mw-echo-notifications-badge-all-read" data-counter-num="0" data-counter-text="0" title="Your notices"><span>Notices (0)</span></a></li>
|
||||
<li id="pt-watchlist-2" class="user-links-collapsible-item mw-list-item"><a href="/wiki/Special:Watchlist" class="mw-ui-button mw-ui-quiet mw-ui-icon mw-ui-icon-element mw-ui-icon-watchlist mw-ui-icon-wikimedia-watchlist" title="A list of pages you are monitoring for changes [⌃⌥l]" accesskey="l"><span>Watchlist</span></a></li>
|
||||
`;
|
||||
|
||||
const LOGGED_OUT_OVERFLOW_ITEMS = `
|
||||
<li id="pt-createaccount-2" class="user-links-collapsible-item mw-list-item"><a href="/w/index.php?title=Special:CreateAccount&returnto=Main+Page" class="mw-ui-button mw-ui-quiet" title="You are encouraged to create an account and log in; however, it is not mandatory"><span>Create account</span></a></li>
|
||||
`;
|
||||
|
||||
const loggedInData = {
|
||||
class: 'vector-user-menu vector-menu-dropdown vector-user-menu-logged-in',
|
||||
'heading-class': 'mw-ui-button mw-ui-quiet mw-ui-icon mw-ui-icon-element mw-ui-icon-wikimedia-userAvatar',
|
||||
'html-after-portal': mustache.render( userLinksLogoutTemplate, {
|
||||
htmlLogout: `<a class="vector-menu-content-item vector-menu-content-item-logout mw-ui-icon mw-ui-icon-before mw-ui-icon-wikimedia-logOut" data-mw="interface" href="/w/index.php?title=Special:UserLogout&returnto=Main+Page"><span>Log out</span></a>`
|
||||
} ),
|
||||
'is-anon': false,
|
||||
'is-dropdown': true,
|
||||
'has-label': true
|
||||
};
|
||||
|
||||
const loggedOutData = {
|
||||
class: 'vector-user-menu vector-menu-dropdown vector-user-menu-logged-out',
|
||||
'heading-class': 'mw-ui-button mw-ui-quiet mw-ui-icon mw-ui-icon-element mw-ui-icon-wikimedia-ellipsis',
|
||||
'html-before-portal': mustache.render( userLinksLoginTemplate, {
|
||||
htmlCreateAccount: `<a href="/w/index.php?title=Special:CreateAccount&returnto=Special%3AUserLogout" icon="userAvatar" class="user-links-collapsible-item vector-menu-content-item mw-ui-icon mw-ui-icon-before mw-ui-icon-wikimedia-userAvatar" title="You are encouraged to create an account and log in; however, it is not mandatory"><span>Create account</span></a>`,
|
||||
htmlLogin: `<a class="vector-menu-content-item vector-menu-content-item-login mw-ui-icon mw-ui-icon-before mw-ui-icon-wikimedia-logIn" href="/w/index.php?title=Special:UserLogin&returnto=Main+Page" title="You are encouraged to log in; however, it is not mandatory [ctrl-option-o]" accesskey="o"><span>Log in</span></a>`,
|
||||
msgLearnMore: msgs[ 'vector-anon-user-menu-pages' ],
|
||||
htmlLearnMoreLink: `<a href="/wiki/Help:Introduction"><span>${msgs[ 'vector-anon-user-menu-pages-learn' ]}</span></a>:`
|
||||
} ),
|
||||
'is-anon': false,
|
||||
'is-dropdown': true,
|
||||
'has-label': true
|
||||
};
|
||||
|
||||
const overflowData = {
|
||||
class: 'vector-menu vector-user-menu-overflow',
|
||||
'heading-class': '',
|
||||
'is-dropdown': false
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {UserLinksDefinition}
|
||||
*/
|
||||
const USER_LINKS_LOGGED_IN_TEMPLATE_DATA = {
|
||||
'data-user-menu-overflow': helperMakeMenuData( 'vector-user-menu-overflow', LOGGED_IN_OVERFLOW_ITEMS, overflowData ),
|
||||
'data-user-menu': helperMakeMenuData( 'personal-more', LOGGED_IN_ITEMS, loggedInData )
|
||||
};
|
||||
|
||||
/**
|
||||
* @type {UserLinksDefinition}
|
||||
*/
|
||||
const USER_LINKS_LOGGED_OUT_TEMPLATE_DATA = {
|
||||
'data-user-menu-overflow': helperMakeMenuData( 'vector-user-menu-overflow', LOGGED_OUT_OVERFLOW_ITEMS, overflowData ),
|
||||
'data-user-menu': helperMakeMenuData( 'personal-more', LOGGED_OUT_ITEMS, loggedOutData )
|
||||
};
|
||||
|
||||
const USER_LINK_PARTIALS = {
|
||||
Menu: menuTemplate,
|
||||
LegacyMenu: legacyMenuTemplate
|
||||
};
|
||||
|
||||
export {
|
||||
PERSONAL_MENU_TEMPLATE_DATA,
|
||||
USER_LINKS_LOGGED_IN_TEMPLATE_DATA,
|
||||
USER_LINKS_LOGGED_OUT_TEMPLATE_DATA,
|
||||
USER_LINK_PARTIALS,
|
||||
userLinksTemplateLegacy,
|
||||
userLinksTemplate
|
||||
};
|
|
@ -1,46 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import { PERSONAL_MENU_TEMPLATE_DATA, USER_LINKS_LOGGED_IN_TEMPLATE_DATA, USER_LINKS_LOGGED_OUT_TEMPLATE_DATA } from './UserLinks.stories.data';
|
||||
import { userLinksTemplateLegacy, userLinksTemplate,
|
||||
USER_LINK_PARTIALS } from './UserLinks.stories.data';
|
||||
import '../resources/skins.vector.styles.legacy/components/UserLinks.less';
|
||||
import '../resources/skins.vector.styles/components/UserLinks.less';
|
||||
|
||||
export default {
|
||||
title: 'UserLinks'
|
||||
};
|
||||
|
||||
export const legacyLoggedOut = () => mustache.render(
|
||||
userLinksTemplateLegacy,
|
||||
{
|
||||
'data-personal': PERSONAL_MENU_TEMPLATE_DATA.loggedOut
|
||||
},
|
||||
USER_LINK_PARTIALS
|
||||
);
|
||||
|
||||
export const legacyLoggedInWithEcho = () => mustache.render(
|
||||
userLinksTemplateLegacy,
|
||||
{
|
||||
'data-personal': PERSONAL_MENU_TEMPLATE_DATA.loggedInWithEcho
|
||||
},
|
||||
USER_LINK_PARTIALS
|
||||
);
|
||||
|
||||
export const legacyLoggedInWithULS = () => mustache.render(
|
||||
userLinksTemplateLegacy,
|
||||
{
|
||||
'data-personal': PERSONAL_MENU_TEMPLATE_DATA.loggedInWithULS
|
||||
},
|
||||
USER_LINK_PARTIALS
|
||||
);
|
||||
|
||||
export const loggedInUserLinks = () => mustache.render(
|
||||
userLinksTemplate,
|
||||
USER_LINKS_LOGGED_IN_TEMPLATE_DATA,
|
||||
USER_LINK_PARTIALS
|
||||
);
|
||||
|
||||
export const loggedOutUserLinks = () => mustache.render(
|
||||
userLinksTemplate,
|
||||
USER_LINKS_LOGGED_OUT_TEMPLATE_DATA,
|
||||
USER_LINK_PARTIALS
|
||||
);
|
14
stories/rawLoader.d.ts
vendored
14
stories/rawLoader.d.ts
vendored
|
@ -1,14 +0,0 @@
|
|||
declare module "!!raw-loader!*" {
|
||||
const src: string;
|
||||
export default src;
|
||||
}
|
||||
|
||||
declare module "*.svg" {
|
||||
const src: string;
|
||||
export default src;
|
||||
}
|
||||
|
||||
declare module "*.png" {
|
||||
const src: string;
|
||||
export default src;
|
||||
}
|
|
@ -1,4 +0,0 @@
|
|||
.skin-vector-legacy {
|
||||
@import '../resources/skins.vector.styles.legacy/layouts/screen.less';
|
||||
@import '../resources/skins.vector.styles.legacy/components/MenuTabs.less';
|
||||
}
|
|
@ -1,130 +0,0 @@
|
|||
import { htmlUserLanguageAttributes } from './utils';
|
||||
import { placeholder } from './utils';
|
||||
|
||||
import { pageToolbarTemplate, PAGE_TOOLBAR_TEMPLATE_DATA_LEGACY } from './PageToolbar.stories.data';
|
||||
import { userLinksTemplateLegacy } from './UserLinks.stories.data';
|
||||
import { menuTemplate, legacyMenuTemplate } from './Menu.stories.data';
|
||||
import { PERSONAL_MENU_TEMPLATE_DATA } from './UserLinks.stories.data';
|
||||
import { vectorMenuTemplate, moreData, variantsData } from './MenuDropdown.stories.data';
|
||||
import { searchBoxData, searchBoxTemplate, SEARCH_TEMPLATE_PARTIALS } from './SearchBox.stories.data';
|
||||
import { SIDEBAR_DATA, SIDEBAR_TEMPLATE_PARTIALS, OPT_OUT_DATA,
|
||||
sidebarLegacyTemplate, sidebarTemplate } from './Sidebar.stories.data';
|
||||
import { FOOTER_TEMPLATE_DATA, FOOTER_TEMPLATE_PARTIALS,
|
||||
footerTemplate } from './Footer.stories.data';
|
||||
import { logoTemplate } from './Logo.stories.data';
|
||||
|
||||
export const NAVIGATION_TEMPLATE_DATA = {
|
||||
loggedInWithVariantsAndOptOut: Object.assign( {}, {
|
||||
'data-portlets': Object.assign( {}, PAGE_TOOLBAR_TEMPLATE_DATA_LEGACY[ 'data-portlets' ], {
|
||||
'data-personal': PERSONAL_MENU_TEMPLATE_DATA.loggedInWithEcho,
|
||||
'data-variants': variantsData
|
||||
} ),
|
||||
'data-search-box': searchBoxData,
|
||||
'data-portlets-main-menu': SIDEBAR_DATA.withPortals,
|
||||
'msg-navigation-heading': 'Navigation menu',
|
||||
'html-logo-attributes': `class="mw-wiki-logo" href="/wiki/Main_Page" title="Visit the main page"`
|
||||
}, OPT_OUT_DATA ),
|
||||
loggedOutWithVariants: {
|
||||
'data-portlets': Object.assign( {}, PAGE_TOOLBAR_TEMPLATE_DATA_LEGACY[ 'data-portlets' ], {
|
||||
'data-personal': PERSONAL_MENU_TEMPLATE_DATA.loggedOut,
|
||||
'data-variants': variantsData
|
||||
} ),
|
||||
'data-search-box': searchBoxData,
|
||||
'data-portlets-main-menu': SIDEBAR_DATA.withPortals,
|
||||
'msg-navigation-heading': 'Navigation menu',
|
||||
'html-logo-attributes': `class="mw-wiki-logo" href="/wiki/Main_Page" title="Visit the main page"`
|
||||
},
|
||||
loggedInWithMoreActions: {
|
||||
'data-portlets': Object.assign( {}, PAGE_TOOLBAR_TEMPLATE_DATA_LEGACY[ 'data-portlets' ], {
|
||||
'data-personal': PERSONAL_MENU_TEMPLATE_DATA.loggedInWithEcho,
|
||||
'data-actions': moreData
|
||||
} ),
|
||||
'data-search-box': searchBoxData,
|
||||
'data-portlets-main-menu': SIDEBAR_DATA.withPortals,
|
||||
'msg-navigation-heading': 'Navigation menu',
|
||||
'html-logo-attributes': `class="mw-wiki-logo" href="/wiki/Main_Page" title="Visit the main page"`
|
||||
}
|
||||
};
|
||||
|
||||
export const TEMPLATE_PARTIALS = Object.assign( {}, SIDEBAR_TEMPLATE_PARTIALS, {
|
||||
Logo: logoTemplate,
|
||||
ArticleToolbar: pageToolbarTemplate,
|
||||
SearchBox: searchBoxTemplate,
|
||||
LegacySidebar: sidebarLegacyTemplate,
|
||||
Sidebar: sidebarTemplate,
|
||||
LegacyMenu: legacyMenuTemplate,
|
||||
VectorMenu: vectorMenuTemplate,
|
||||
Menu: menuTemplate,
|
||||
LegacyUserLinks: userLinksTemplateLegacy,
|
||||
Footer: footerTemplate
|
||||
}, FOOTER_TEMPLATE_PARTIALS, SEARCH_TEMPLATE_PARTIALS );
|
||||
|
||||
/**
|
||||
* @type {Indicator[]}
|
||||
*/
|
||||
const DATA_INDICATORS = [ {
|
||||
id: 'mw-indicator-good-star',
|
||||
class: 'mw-indicator',
|
||||
html: `<a href="/wiki/Wikipedia:Good_articles"
|
||||
title="This is a good article. Follow the link for more information.">
|
||||
<img alt="This is a good article. Follow the link for more information."
|
||||
src="//upload.wikimedia.org/wikipedia/en/thumb/9/94/Symbol_support_vote.svg/19px-Symbol_support_vote.svg.png" decoding="async" width="19" height="20"
|
||||
srcset="//upload.wikimedia.org/wikipedia/en/thumb/9/94/Symbol_support_vote.svg/29px-Symbol_support_vote.svg.png 1.5x, //upload.wikimedia.org/wikipedia/en/thumb/9/94/Symbol_support_vote.svg/39px-Symbol_support_vote.svg.png 2x" data-file-width="180" data-file-height="185" />
|
||||
</a>`
|
||||
},
|
||||
{
|
||||
id: 'mw-indicator-pp-autoreview',
|
||||
class: 'mw-indicator',
|
||||
html: `<a href="/wiki/Wikipedia:Protection_policy#pending"
|
||||
title="All edits by unregistered and new users are subject to review prior to becoming visible to unregistered users">
|
||||
<img alt="Page protected with pending changes" src="//upload.wikimedia.org/wikipedia/en/thumb/b/b7/Pending-protection-shackle.svg/20px-Pending-protection-shackle.svg.png"
|
||||
decoding="async" width="20" height="20" srcset="//upload.wikimedia.org/wikipedia/en/thumb/b/b7/Pending-protection-shackle.svg/30px-Pending-protection-shackle.svg.png 1.5x, //upload.wikimedia.org/wikipedia/en/thumb/b/b7/Pending-protection-shackle.svg/40px-Pending-protection-shackle.svg.png 2x" data-file-width="512" data-file-height="512" />
|
||||
</a>`
|
||||
} ];
|
||||
|
||||
export const LEGACY_TEMPLATE_DATA = {
|
||||
'html-title': 'Vector 2019',
|
||||
'html-title-heading': '<h1 id="firstHeading" class="firstHeading">Vector 2019</h1>',
|
||||
'is-article': true,
|
||||
'msg-tagline': 'From Wikipedia, the free encyclopedia',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'msg-vector-jumptonavigation': 'Jump to navigation',
|
||||
'msg-vector-jumptosearch': 'Jump to search',
|
||||
|
||||
// site specific
|
||||
'data-footer': FOOTER_TEMPLATE_DATA,
|
||||
'html-site-notice': placeholder( 'a site notice or central notice banner may go here', 70 ),
|
||||
|
||||
// article dependent
|
||||
'html-body-content': `${placeholder( 'Article content goes here' )}
|
||||
<div class="printfooter">
|
||||
Retrieved from ‘<a dir="ltr" href="#">https://en.wikipedia.org/w/index.php?title=this&oldid=blah</a>’
|
||||
</div>`,
|
||||
'html-categories': placeholder( 'Category links component from mediawiki core', 50 ),
|
||||
|
||||
// extension dependent..
|
||||
'html-after-content': placeholder( 'Extensions can add here e.g. Related Articles.', 100 ),
|
||||
'array-indicators': DATA_INDICATORS,
|
||||
'html-subtitle': placeholder( 'Extensions can configure subtitle', 20 )
|
||||
};
|
||||
|
||||
export const MODERN_TEMPLATE_DATA = {
|
||||
'html-title': 'Vector 2020',
|
||||
'page-isarticle': true,
|
||||
'msg-tagline': 'From Wikipedia, the free encyclopedia',
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'msg-vector-jumptonavigation': 'Jump to navigation',
|
||||
'msg-vector-jumptosearch': 'Jump to search',
|
||||
|
||||
// site specific
|
||||
'data-footer': FOOTER_TEMPLATE_DATA,
|
||||
'html-site-notice': placeholder( 'a site notice or central notice banner may go here', 70 ),
|
||||
|
||||
// article dependent
|
||||
'array-indicators': DATA_INDICATORS,
|
||||
'html-body-content': `${placeholder( 'Article content goes here' )}
|
||||
<div class="printfooter">
|
||||
Retrieved from ‘<a dir="ltr" href="#">https://en.wikipedia.org/w/index.php?title=this&oldid=blah</a>’
|
||||
</div>`,
|
||||
'html-categories': placeholder( 'Category links component from mediawiki core', 50 )
|
||||
};
|
|
@ -1,39 +0,0 @@
|
|||
import mustache from 'mustache';
|
||||
import '../resources/common/common.less';
|
||||
import './skin.less';
|
||||
import legacySkinTemplate from '!!raw-loader!../includes/templates/skin-legacy.mustache';
|
||||
import {
|
||||
LEGACY_TEMPLATE_DATA,
|
||||
NAVIGATION_TEMPLATE_DATA,
|
||||
TEMPLATE_PARTIALS
|
||||
} from './skin.stories.data';
|
||||
|
||||
export default {
|
||||
title: 'Skin'
|
||||
};
|
||||
|
||||
const vectorLegacyLoggedOutBody = () => mustache.render(
|
||||
legacySkinTemplate,
|
||||
Object.assign(
|
||||
{},
|
||||
LEGACY_TEMPLATE_DATA,
|
||||
NAVIGATION_TEMPLATE_DATA.loggedOutWithVariants
|
||||
),
|
||||
TEMPLATE_PARTIALS
|
||||
);
|
||||
|
||||
const vectorLegacyLoggedInBody = () => mustache.render(
|
||||
legacySkinTemplate,
|
||||
Object.assign(
|
||||
{},
|
||||
LEGACY_TEMPLATE_DATA,
|
||||
NAVIGATION_TEMPLATE_DATA.loggedInWithMoreActions
|
||||
),
|
||||
TEMPLATE_PARTIALS
|
||||
);
|
||||
|
||||
export const vectorLegacyLoggedOut = () =>
|
||||
`<div class="skin-vector-legacy">${vectorLegacyLoggedOutBody()}</div>`;
|
||||
|
||||
export const vectorLegacyLoggedIn = () =>
|
||||
`<div class="skin-vector-legacy">${vectorLegacyLoggedInBody()}</div>`;
|
|
@ -1,86 +0,0 @@
|
|||
/**
|
||||
* @typedef {Object} Indicator
|
||||
* @property {string} html of the indicator link.
|
||||
* @property {string} id of the indicator.
|
||||
* @property {string} class of the indicator
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object} LogoOptions
|
||||
* @property {string} src of logo. Can be relative, absolute or data uri.
|
||||
* @property {string} [alt] text of logo.
|
||||
* @property {number} width of asset
|
||||
* @property {number} height of asset
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object} ResourceLoaderSkinModuleLogos
|
||||
* @property {string} [icon] e.g. Wikipedia globe
|
||||
* @property {LogoOptions} [wordmark] e.g. Legacy Vector logo
|
||||
* @property {LogoOptions} [tagline] e.g. Legacy Vector logo
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object} LogoTemplateData
|
||||
* @property {ResourceLoaderSkinModuleLogos} data-logos as configured,
|
||||
* the return value of ResourceLoaderSkinModule::getAvailableLogos.
|
||||
* @property {string} msg-sitetitle alternate text for wordmark
|
||||
* href the url to navigate to on click.
|
||||
* @property {string} msg-sitesubtitle alternate text for tagline.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object} SidebarData
|
||||
* @property {MenuDefinition} data-portals-languages
|
||||
* @property {MenuDefinition} data-portlets-first
|
||||
* @property {MenuDefinition[]} array-portlets-rest
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object} SearchData
|
||||
* @property {string|null} msg-search
|
||||
* @property {string|null} msg-searchbutton
|
||||
* @property {string|null} msg-searcharticle
|
||||
* @property {string} [html-user-language-attributes]
|
||||
* @property {boolean} is-primary is this the primary method of search?
|
||||
* @property {string} form-action URL
|
||||
* @property {string} form-id
|
||||
* @property {string|null} html-input
|
||||
* @property {string|null} [class] of the menu
|
||||
* @property {string|null} page-title the title of the search page
|
||||
* @property {string} html-input-attributes
|
||||
* @property {string} html-button-fulltext-attributes
|
||||
* @property {string} html-button-go-attributes
|
||||
* @property {string|null} html-button-search-fallback
|
||||
* @property {string|null} html-button-search
|
||||
* @property {string} [input-location] An identifier corresponding the position of the search
|
||||
* widget on the page, e.g. "header-navigation"
|
||||
* @property {boolean} [is-collapsible]
|
||||
* @property {string} [href-search]
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object} MenuDefinition
|
||||
* @property {string} id
|
||||
* @property {string} label
|
||||
* @property {string} html-items
|
||||
* @property {string} [checkbox-class]
|
||||
* @property {string} [html-vector-heading-icon]
|
||||
* @property {string} [heading-class]
|
||||
* @property {string} [html-tooltip]
|
||||
* @property {string} [class] of menu
|
||||
* @property {string} [html-user-language-attributes]
|
||||
* @property {boolean} [is-dropdown]
|
||||
* @property {string} [html-before-portal] Additional HTML specific to portal menus.
|
||||
* @property {string} [html-after-portal] Additional HTML specific to portal menus.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object.<string, MenuDefinition>} MenuDefinitions
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef {Object} UserLinksDefinition
|
||||
* @property {MenuDefinition} data-user-menu-overflow
|
||||
* @property {MenuDefinition} data-user-menu
|
||||
*/
|
|
@ -1,77 +0,0 @@
|
|||
/**
|
||||
* @param {string} name
|
||||
* @return {string}
|
||||
*/
|
||||
function makeIcon( name ) {
|
||||
return `<span class="mw-ui-icon mw-ui-icon-${name}"></span>`;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} msg
|
||||
* @param {number} [height=200]
|
||||
* @return {string}
|
||||
*/
|
||||
const placeholder = ( msg, height ) => {
|
||||
return `<div style="width: 100%; height: ${height || 200}px; margin-bottom: 2px;
|
||||
font-size: 12px; padding: 8px; box-sizing: border-box;
|
||||
display: flex; background: #eee; align-items: center;justify-content: center;">${msg}</div>`;
|
||||
};
|
||||
|
||||
/**
|
||||
* @param {string} html
|
||||
* @return {string}
|
||||
*/
|
||||
const portletAfter = ( html ) => {
|
||||
return `<div class="after-portlet after-portlet-tb">${html}</div>`;
|
||||
};
|
||||
|
||||
const htmlUserLanguageAttributes = `dir="ltr" lang="en-GB"`;
|
||||
|
||||
/**
|
||||
* @param {string} [additionalClassString] to add to the menu class
|
||||
* @return {Object}
|
||||
*/
|
||||
function helperClassName( additionalClassString = '' ) {
|
||||
return { class: additionalClassString };
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} name of the menu
|
||||
* @param {string} htmlItems
|
||||
* @param {Object} [additionalData] to add to the menu template data
|
||||
* @param {string} [additionalData.class]
|
||||
* @return {MenuDefinition}
|
||||
*/
|
||||
function helperMakeMenuData( name, htmlItems, additionalData = {} ) {
|
||||
let label;
|
||||
switch ( name ) {
|
||||
case 'personal':
|
||||
label = 'Personal tools';
|
||||
break;
|
||||
default:
|
||||
label = 'Menu label';
|
||||
break;
|
||||
}
|
||||
|
||||
// Handle "class" property separately to ensure it is appended to existing classes
|
||||
const additionalClassString = additionalData.class;
|
||||
const additionalDataWithoutClass = Object.assign( {}, additionalData );
|
||||
delete additionalDataWithoutClass.class;
|
||||
|
||||
return Object.assign( {
|
||||
id: `p-${name}`,
|
||||
class: `mw-portlet mw-portlet-${name} ${additionalClassString}`,
|
||||
label,
|
||||
'html-user-language-attributes': htmlUserLanguageAttributes,
|
||||
'html-items': htmlItems
|
||||
}, additionalDataWithoutClass );
|
||||
}
|
||||
|
||||
export {
|
||||
makeIcon,
|
||||
placeholder,
|
||||
htmlUserLanguageAttributes,
|
||||
portletAfter,
|
||||
helperClassName,
|
||||
helperMakeMenuData
|
||||
};
|
|
@ -11,7 +11,6 @@ const MW_EXPERIMENT_PARAM = {
|
|||
}
|
||||
};
|
||||
|
||||
// eslint-disable-next-line jsdoc/require-returns
|
||||
/**
|
||||
* @param {Object} props
|
||||
*/
|
||||
|
|
Loading…
Reference in a new issue