mirror of
https://github.com/modernweb-dev/rocket.git
synced 2026-03-21 08:51:18 +00:00
Compare commits
14 Commits
@rocket/cl
...
@rocket/el
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
d44a23af0c | ||
|
|
18a79589c2 | ||
|
|
b7727b0e10 | ||
|
|
5edc40fed5 | ||
|
|
be0d0b3ca1 | ||
|
|
ef8ebb0098 | ||
|
|
2fa61e1377 | ||
|
|
b23e37f38e | ||
|
|
cf45e32702 | ||
|
|
b5965c6c37 | ||
|
|
e39cc45d23 | ||
|
|
f0434cb12c | ||
|
|
c87caaed2d | ||
|
|
04af7ecf53 |
@@ -43,7 +43,7 @@
|
||||
|
||||
## The Goal for Rocket
|
||||
|
||||
> Our goal is to provide developers with a meta framework for static websites with a spricle of JavaScript.
|
||||
> Our goal is to provide developers with a meta framework for static websites with a sprinkle of JavaScript.
|
||||
|
||||
Get a site up and running in no time and focus on the content.
|
||||
You can still tweak every detail of every underlying tool that gets used.
|
||||
@@ -54,7 +54,7 @@ Rocket is part of the [Modern Web Family](https://twitter.com/modern_web_dev).
|
||||
|
||||
We are always looking for contributors of all skill levels! If you're looking to ease your way into the project, try out a [good first issue](https://github.com/modernweb-dev/rocket/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22).
|
||||
|
||||
If you are interested in helping contribute to Modern Web, please take a look at our [Contributing Guide](https://github.com/modernweb-dev/rocket/blob/main/CONTRIBUTING.md). Also, feel free to drop into [slack](https://rocket.modern-web.dev/discover/slack/) and say hi. 👋
|
||||
If you are interested in helping contribute to Modern Web, please take a look at our [Contributing Guide](https://github.com/modernweb-dev/rocket/blob/main/CONTRIBUTING.md). Also, feel free to drop into [slack](https://rocket.modern-web.dev/about/slack/) and say hi. 👋
|
||||
|
||||
### Financial Contributors
|
||||
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
# @rocket/building-rollup
|
||||
|
||||
## 0.1.3
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
|
||||
## 0.1.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@rocket/building-rollup",
|
||||
"version": "0.1.2",
|
||||
"version": "0.1.3",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -14,6 +14,7 @@
|
||||
"author": "Modern Web <hello@modern-web.dev> (https://modern-web.dev/)",
|
||||
"homepage": "https://rocket.modern-web.dev/docs/tools/building-rollup/",
|
||||
"type": "module",
|
||||
"main": "./index.js",
|
||||
"exports": {
|
||||
".": "./index.js"
|
||||
},
|
||||
|
||||
@@ -53,7 +53,7 @@ export function createSpaMetaConfig(userConfig = { output: {} }) {
|
||||
// directory to match patterns against to be precached
|
||||
globDirectory: path.join(config.output.dir),
|
||||
// cache any html js and css by default
|
||||
globPatterns: ['**/*.{html,js,css,webmanifest}'],
|
||||
globPatterns: ['**/*.{html,js,css,webmanifest}', '**/*-search-index.json'],
|
||||
skipWaiting: true,
|
||||
clientsClaim: true,
|
||||
runtimeCaching: [
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
# check-html-links
|
||||
|
||||
## 0.2.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
|
||||
## 0.2.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "check-html-links",
|
||||
"version": "0.2.0",
|
||||
"version": "0.2.1",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -17,6 +17,7 @@
|
||||
"check-html-links": "src/cli.js"
|
||||
},
|
||||
"type": "module",
|
||||
"main": "./index.js",
|
||||
"exports": {
|
||||
".": "./index.js"
|
||||
},
|
||||
|
||||
@@ -1,5 +1,27 @@
|
||||
# @rocket/cli
|
||||
|
||||
## 0.6.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- 5edc40f: Make sure each rocket instance has it's own eleventy config'
|
||||
- ef8ebb0: To support dynamically created content to be part of the anchor navigation of the page we now analyze the final html output instead of `entry.templateContent`.
|
||||
|
||||
BREAKING CHANGE:
|
||||
|
||||
- only add anchors for the currently active pages (before it added anchor for every page)
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
- Updated dependencies [be0d0b3]
|
||||
- Updated dependencies [ef8ebb0]
|
||||
- @rocket/building-rollup@0.1.3
|
||||
- check-html-links@0.2.1
|
||||
- @rocket/core@0.1.2
|
||||
- plugins-manager@0.2.1
|
||||
- @rocket/eleventy-rocket-nav@0.3.0
|
||||
|
||||
## 0.5.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@rocket/cli",
|
||||
"version": "0.5.2",
|
||||
"version": "0.6.0",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -17,6 +17,7 @@
|
||||
"rocket": "src/cli.js"
|
||||
},
|
||||
"type": "module",
|
||||
"main": "./index.cjs",
|
||||
"exports": {
|
||||
".": {
|
||||
"require": "./index.cjs",
|
||||
@@ -56,22 +57,22 @@
|
||||
"dependencies": {
|
||||
"@11ty/eleventy": "^0.11.1",
|
||||
"@11ty/eleventy-img": "^0.7.4",
|
||||
"@rocket/building-rollup": "^0.1.2",
|
||||
"@rocket/core": "^0.1.1",
|
||||
"@rocket/building-rollup": "^0.1.3",
|
||||
"@rocket/core": "^0.1.2",
|
||||
"@rocket/eleventy-plugin-mdjs-unified": "^0.3.1",
|
||||
"@rocket/eleventy-rocket-nav": "^0.2.1",
|
||||
"@rocket/eleventy-rocket-nav": "^0.3.0",
|
||||
"@rollup/plugin-babel": "^5.2.2",
|
||||
"@rollup/plugin-node-resolve": "^11.0.1",
|
||||
"@web/config-loader": "^0.1.3",
|
||||
"@web/dev-server": "^0.1.4",
|
||||
"@web/dev-server-rollup": "^0.3.2",
|
||||
"@web/rollup-plugin-copy": "^0.2.0",
|
||||
"check-html-links": "^0.2.0",
|
||||
"check-html-links": "^0.2.1",
|
||||
"command-line-args": "^5.1.1",
|
||||
"command-line-usage": "^6.1.1",
|
||||
"fs-extra": "^9.0.1",
|
||||
"micromatch": "^4.0.2",
|
||||
"plugins-manager": "^0.2.0",
|
||||
"plugins-manager": "^0.2.1",
|
||||
"utf8": "^3.0.0"
|
||||
},
|
||||
"types": "dist-types/index.d.ts"
|
||||
|
||||
@@ -10,6 +10,7 @@ import computedConfigPkg from './public/computedConfig.cjs';
|
||||
|
||||
import path from 'path';
|
||||
import Eleventy from '@11ty/eleventy';
|
||||
import TemplateConfig from '@11ty/eleventy/src/TemplateConfig.js';
|
||||
import { fileURLToPath } from 'url';
|
||||
import fs from 'fs-extra';
|
||||
|
||||
@@ -99,11 +100,16 @@ export class RocketCli {
|
||||
await this.mergePresets();
|
||||
|
||||
const elev = new RocketEleventy(_inputDirCwdRelative, outputDevDir, this);
|
||||
elev.isVerbose = false;
|
||||
// 11ty always wants a relative path to cwd - why?
|
||||
const rel = path.relative(process.cwd(), path.join(__dirname));
|
||||
const relCwdPathToConfig = path.join(rel, 'shared', '.eleventy.cjs');
|
||||
|
||||
const config = new TemplateConfig(null, relCwdPathToConfig);
|
||||
elev.config = config.getConfig();
|
||||
elev.resetConfig();
|
||||
elev.setConfigPathOverride(relCwdPathToConfig);
|
||||
|
||||
elev.isVerbose = false;
|
||||
await elev.init();
|
||||
|
||||
this.eleventy = elev;
|
||||
|
||||
@@ -35,8 +35,7 @@ describe('RocketCli e2e', () => {
|
||||
});
|
||||
|
||||
describe('eleventy in config', () => {
|
||||
// TODO: find out while this has a side effect and breaks other tests
|
||||
it.skip('can modify eleventy via an elventy function in the config', async () => {
|
||||
it('can modify eleventy via an elventy function in the config', async () => {
|
||||
cli = await executeStart('e2e-fixtures/content/eleventy.rocket.config.js');
|
||||
const indexHtml = await readStartOutput(cli, 'index.html');
|
||||
expect(indexHtml).to.equal(
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
# @rocket/core
|
||||
|
||||
## 0.1.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
|
||||
## 0.1.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@rocket/core",
|
||||
"version": "0.1.1",
|
||||
"version": "0.1.2",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -14,6 +14,7 @@
|
||||
"author": "Modern Web <hello@modern-web.dev> (https://modern-web.dev/)",
|
||||
"homepage": "https://rocket.modern-web.dev/",
|
||||
"type": "module",
|
||||
"main": "./dist/title.cjs",
|
||||
"exports": {
|
||||
"./title": {
|
||||
"require": "./dist/title.cjs",
|
||||
|
||||
@@ -18,6 +18,7 @@ export class RocketDrawer extends OverlayMixin(LitElement) {
|
||||
return {
|
||||
useOverlay: { type: Boolean, reflect: true },
|
||||
useOverlayMediaQuery: { type: String },
|
||||
mediaMatcher: { type: Object },
|
||||
};
|
||||
}
|
||||
|
||||
@@ -89,6 +90,20 @@ export class RocketDrawer extends OverlayMixin(LitElement) {
|
||||
}
|
||||
}
|
||||
}
|
||||
if (changedProperties.has('useOverlayMediaQuery')) {
|
||||
this.mediaMatcher.removeEventListener('change', this.onMatchMedia);
|
||||
|
||||
this.mediaMatcher = window.matchMedia(this.useOverlayMediaQuery);
|
||||
this.mediaMatcher.addEventListener('change', this.onMatchMedia);
|
||||
this.useOverlay = !!this.mediaMatcher.matches;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param { MediaQueryListEvent } query
|
||||
*/
|
||||
onMatchMedia(query) {
|
||||
this.useOverlay = !!query.matches;
|
||||
}
|
||||
|
||||
_setupOpenCloseListeners() {
|
||||
@@ -118,11 +133,15 @@ export class RocketDrawer extends OverlayMixin(LitElement) {
|
||||
|
||||
this.__toggle = this.__toggle.bind(this);
|
||||
|
||||
this.onMatchMedia = this.onMatchMedia.bind(this);
|
||||
this.onGestureStart = this.onGestureStart.bind(this);
|
||||
this.onGestureMove = this.onGestureMove.bind(this);
|
||||
this.onGestureEnd = this.onGestureEnd.bind(this);
|
||||
this.updateFromTouch = this.updateFromTouch.bind(this);
|
||||
|
||||
this.mediaMatcher = window.matchMedia(this.useOverlayMediaQuery);
|
||||
this.mediaMatcher.addEventListener('change', this.onMatchMedia);
|
||||
|
||||
this._startX = 0;
|
||||
this._currentX = 0;
|
||||
this._velocity = 0;
|
||||
@@ -133,10 +152,7 @@ export class RocketDrawer extends OverlayMixin(LitElement) {
|
||||
|
||||
connectedCallback() {
|
||||
super.connectedCallback();
|
||||
this.useOverlay = !!window.matchMedia(this.useOverlayMediaQuery).matches;
|
||||
window.matchMedia(this.useOverlayMediaQuery).addListener(query => {
|
||||
this.useOverlay = !!query.matches;
|
||||
});
|
||||
this.useOverlay = !!this.mediaMatcher.matches;
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
const RocketNav = require('./eleventy-rocket-nav');
|
||||
const { addPageAnchors } = require('./src/addPageAnchors.js');
|
||||
|
||||
// export the configuration function for plugin
|
||||
module.exports = function (eleventyConfig) {
|
||||
@@ -8,6 +9,10 @@ module.exports = function (eleventyConfig) {
|
||||
eleventyConfig.addNunjucksFilter('rocketNavToHtml', function (pages, options) {
|
||||
return RocketNav.toHtml.call(eleventyConfig, pages, options);
|
||||
});
|
||||
eleventyConfig.addTransform('rocket-nav-add-page-anchors', async function (content) {
|
||||
const newContent = await addPageAnchors(content);
|
||||
return newContent;
|
||||
});
|
||||
};
|
||||
|
||||
module.exports.navigation = {
|
||||
|
||||
@@ -1,5 +1,15 @@
|
||||
# @rocket/eleventy-rocket-nav
|
||||
|
||||
## 0.3.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- ef8ebb0: To support dynamically created content to be part of the anchor navigation of the page we now analyze the final html output instead of `entry.templateContent`.
|
||||
|
||||
BREAKING CHANGE:
|
||||
|
||||
- only add anchors for the currently active pages (before it added anchor for every page)
|
||||
|
||||
## 0.2.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -94,21 +94,8 @@ function findNavigationEntries(nodes = [], key = '') {
|
||||
entry.title = entry.key;
|
||||
}
|
||||
if (entry.key) {
|
||||
if (!headingsCache.has(entry.templateContent)) {
|
||||
headingsCache.set(entry.templateContent, getHeadingsOfHtml(entry.templateContent));
|
||||
}
|
||||
const headings = /** @type {Heading[]} */ (headingsCache.get(entry.templateContent));
|
||||
const anchors = headings.map(heading => ({
|
||||
key: heading.text + Math.random(),
|
||||
parent: entry.key,
|
||||
url: `${entry.url}#${heading.id}`,
|
||||
pluginType: 'eleventy-navigation',
|
||||
parentKey: entry.key,
|
||||
title: heading.text,
|
||||
anchor: true,
|
||||
}));
|
||||
// @ts-ignore
|
||||
entry.children = [...anchors, ...findNavigationEntries(nodes, entry.key)];
|
||||
entry.children = findNavigationEntries(nodes, entry.key);
|
||||
}
|
||||
return entry;
|
||||
});
|
||||
@@ -227,43 +214,36 @@ function navigationToHtml(pages, _options = {}) {
|
||||
}>${pages
|
||||
.map(entry => {
|
||||
const liClass = [];
|
||||
const aClass = [];
|
||||
if (options.listItemClass) {
|
||||
liClass.push(options.listItemClass);
|
||||
}
|
||||
if (options.anchorClass) {
|
||||
aClass.push(options.anchorClass);
|
||||
}
|
||||
if (options.activeKey === entry.key) {
|
||||
if (options.activeListItemClass) {
|
||||
liClass.push(options.activeListItemClass);
|
||||
}
|
||||
if (options.activeAnchorClass) {
|
||||
aClass.push(options.activeAnchorClass);
|
||||
}
|
||||
if (options.activeKey === entry.key && options.activeListItemClass) {
|
||||
liClass.push(options.activeListItemClass);
|
||||
}
|
||||
if (options.activeTreeListClass && activePages && activePages.includes(entry.key)) {
|
||||
liClass.push(options.activeTreeListClass);
|
||||
}
|
||||
if (options.activeAnchorListClass && activePages && activePages.includes(entry.key)) {
|
||||
aClass.push(options.activeAnchorListClass);
|
||||
}
|
||||
if (options.listItemHasChildrenClass && entry.children && entry.children.length) {
|
||||
liClass.push(options.listItemHasChildrenClass);
|
||||
}
|
||||
|
||||
if (entry.anchor) {
|
||||
liClass.push('anchor');
|
||||
aClass.push('anchor');
|
||||
const output = [];
|
||||
output.push(
|
||||
`<${options.listItemElement}${liClass.length ? ` class="${liClass.join(' ')}"` : ''}>`,
|
||||
);
|
||||
output.push(`<a href="${urlFilter(entry.url)}">${entry.title}</a>`);
|
||||
if (options.showExcerpt && entry.excerpt) {
|
||||
output.push(`: ${entry.excerpt}`);
|
||||
}
|
||||
if (options.activeKey === entry.key && options.activeListItemClass) {
|
||||
output.push('<!-- ADD PAGE ANCHORS -->');
|
||||
}
|
||||
if (entry.children) {
|
||||
output.push(navigationToHtml(entry.children, options));
|
||||
}
|
||||
output.push(`</${options.listItemElement}>`);
|
||||
|
||||
return `<${options.listItemElement}${
|
||||
liClass.length ? ` class="${liClass.join(' ')}"` : ''
|
||||
}><a href="${urlFilter(entry.url)}"${
|
||||
aClass.length ? ` class="${aClass.join(' ')}"` : ''
|
||||
}>${entry.title}</a>${options.showExcerpt && entry.excerpt ? `: ${entry.excerpt}` : ''}${
|
||||
entry.children ? navigationToHtml(entry.children, options) : ''
|
||||
}</${options.listItemElement}>`;
|
||||
return output.join('\n');
|
||||
})
|
||||
.join('\n')}</${options.listElement}>`
|
||||
: '';
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@rocket/eleventy-rocket-nav",
|
||||
"version": "0.2.1",
|
||||
"version": "0.3.0",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -13,7 +13,7 @@
|
||||
},
|
||||
"main": ".eleventy.js",
|
||||
"scripts": {
|
||||
"test": "mocha test-node/**/*.test.js test-node/*.test.js",
|
||||
"test": "mocha test-node/**/*.test.js test-node/*.test.js --timeout 5000",
|
||||
"test:watch": "mocha test-node/**/*.test.js test-node/*.test.js --watch"
|
||||
},
|
||||
"files": [
|
||||
|
||||
136
packages/eleventy-rocket-nav/src/addPageAnchors.js
Normal file
136
packages/eleventy-rocket-nav/src/addPageAnchors.js
Normal file
@@ -0,0 +1,136 @@
|
||||
/* eslint-disable @typescript-eslint/ban-ts-comment */
|
||||
const fs = require('fs');
|
||||
const { SaxEventType, SAXParser } = require('sax-wasm');
|
||||
|
||||
const saxPath = require.resolve('sax-wasm/lib/sax-wasm.wasm');
|
||||
const saxWasmBuffer = fs.readFileSync(saxPath);
|
||||
|
||||
/** @typedef {import('../types').Heading} Heading */
|
||||
|
||||
/** @typedef {import('sax-wasm').Text} Text */
|
||||
/** @typedef {import('sax-wasm').Tag} Tag */
|
||||
/** @typedef {import('sax-wasm').Position} Position */
|
||||
|
||||
// Instantiate
|
||||
const parser = new SAXParser(
|
||||
SaxEventType.CloseTag | SaxEventType.Comment,
|
||||
{ highWaterMark: 256 * 1024 }, // 256k chunks
|
||||
);
|
||||
|
||||
/**
|
||||
* @param {object} options
|
||||
* @param {string} options.content
|
||||
* @param {Position} options.start
|
||||
* @param {Position} options.end
|
||||
* @param {string} options.insert
|
||||
*/
|
||||
function removeBetween({ content, start, end, insert = '' }) {
|
||||
const lines = content.split('\n');
|
||||
const i = start.line;
|
||||
const line = lines[i];
|
||||
const upToChange = line.slice(0, start.character - 1);
|
||||
const afterChange = line.slice(end.character + 2);
|
||||
|
||||
lines[i] = `${upToChange}${insert}${afterChange}`;
|
||||
return lines.join('\n');
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Tag} data
|
||||
* @param {string} name
|
||||
*/
|
||||
function getAttribute(data, name) {
|
||||
if (data.attributes) {
|
||||
const { attributes } = data;
|
||||
const foundIndex = attributes.findIndex(entry => entry.name.value === name);
|
||||
if (foundIndex !== -1) {
|
||||
return attributes[foundIndex].value.value;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Tag} data
|
||||
*/
|
||||
function getText(data) {
|
||||
if (data.textNodes) {
|
||||
return data.textNodes.map(textNode => textNode.value).join('');
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} html
|
||||
*/
|
||||
function getHeadingsOfHtml(html) {
|
||||
/** @type {Heading[]} */
|
||||
const headings = [];
|
||||
/** @type {Text} */
|
||||
let insertPoint;
|
||||
parser.eventHandler = (ev, _data) => {
|
||||
if (ev === SaxEventType.Comment) {
|
||||
const data = /** @type {Text} */ (/** @type {any} */ (_data));
|
||||
// NOTE: we NEED to access data internal value so sax-wasm does not reuse it's value
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const tmp = data.start.line + data.end.line;
|
||||
if (data.value.trim() === 'ADD PAGE ANCHORS' || data.value.trim() === '-->ADD PAGE ANCHORS') {
|
||||
insertPoint = data;
|
||||
}
|
||||
}
|
||||
|
||||
if (ev === SaxEventType.CloseTag) {
|
||||
const data = /** @type {Tag} */ (/** @type {any} */ (_data));
|
||||
if (data.name === 'h2') {
|
||||
const id = getAttribute(data, 'id');
|
||||
const text = getText(data);
|
||||
if (id && text) {
|
||||
headings.push({ text, id });
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
parser.write(Buffer.from(html, 'utf8'));
|
||||
parser.end();
|
||||
|
||||
// @ts-ignore
|
||||
return { headings, insertPoint };
|
||||
}
|
||||
|
||||
let isSetup = false;
|
||||
|
||||
/**
|
||||
* @param {string} content
|
||||
*/
|
||||
async function addPageAnchors(content) {
|
||||
if (!isSetup) {
|
||||
await parser.prepareWasm(saxWasmBuffer);
|
||||
isSetup = true;
|
||||
}
|
||||
|
||||
const { headings, insertPoint } = getHeadingsOfHtml(content);
|
||||
const pageAnchorsHtml = [];
|
||||
if (headings.length > 0) {
|
||||
pageAnchorsHtml.push('<ul>');
|
||||
for (const heading of headings) {
|
||||
pageAnchorsHtml.push(' <li class="menu-item anchor">');
|
||||
pageAnchorsHtml.push(` <a href="#${heading.id}" class="anchor">${heading.text}</a>`);
|
||||
pageAnchorsHtml.push(' </li>');
|
||||
}
|
||||
pageAnchorsHtml.push('</ul>');
|
||||
}
|
||||
|
||||
if (insertPoint) {
|
||||
return removeBetween({
|
||||
content,
|
||||
start: insertPoint.start,
|
||||
end: insertPoint.end,
|
||||
insert: pageAnchorsHtml.join('\n'),
|
||||
});
|
||||
}
|
||||
return content;
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
addPageAnchors,
|
||||
};
|
||||
@@ -0,0 +1,32 @@
|
||||
const { expect } = require('chai');
|
||||
const prettier = require('prettier');
|
||||
const { addPageAnchors } = require('../src/addPageAnchors.js');
|
||||
|
||||
const format = code => prettier.format(code, { parser: 'html' }).trim();
|
||||
|
||||
describe('addPageAnchors', () => {
|
||||
it('finds and adds anchors for each h2 as an unordered list', async () => {
|
||||
const input = [
|
||||
'<body>',
|
||||
' <!-- ADD PAGE ANCHORS -->',
|
||||
' <div id="content">',
|
||||
' <h2 id="first">👉 First Headline</h2>',
|
||||
' </div>',
|
||||
'</body>',
|
||||
].join('\n');
|
||||
const expected = [
|
||||
'<body>',
|
||||
' <ul>',
|
||||
' <li class="menu-item anchor">',
|
||||
' <a href="#first" class="anchor">👉 First Headline</a>',
|
||||
' </li>',
|
||||
' </ul>',
|
||||
' <div id="content">',
|
||||
' <h2 id="first">👉 First Headline</h2>',
|
||||
' </div>',
|
||||
'</body>',
|
||||
].join('\n');
|
||||
const result = await addPageAnchors(input);
|
||||
expect(format(result)).to.deep.equal(expected);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,5 @@
|
||||
const eleventyNavigationPlugin = require('@rocket/eleventy-rocket-nav');
|
||||
|
||||
module.exports = function (eleventyConfig) {
|
||||
eleventyConfig.addPlugin(eleventyNavigationPlugin);
|
||||
};
|
||||
@@ -0,0 +1 @@
|
||||
module.exports = 'layout.njk';
|
||||
@@ -0,0 +1,9 @@
|
||||
<body>
|
||||
{{ collections.all | rocketNav | rocketNavToHtml({
|
||||
listItemClass: "menu-item",
|
||||
activeListItemClass: "current",
|
||||
activeKey: eleventyNavigation.key
|
||||
}) | safe }}
|
||||
|
||||
{{ content | safe }}
|
||||
</body>
|
||||
@@ -0,0 +1,9 @@
|
||||
---
|
||||
title: Bats
|
||||
eleventyNavigation:
|
||||
key: Bats
|
||||
parent: Mammals
|
||||
order: 2
|
||||
---
|
||||
|
||||
🦇 can fly.
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
title: Humans
|
||||
eleventyNavigation:
|
||||
key: Humans
|
||||
parent: Mammals
|
||||
order: 1
|
||||
---
|
||||
|
||||
<h2 id="anatomy">Anatomy</h2>
|
||||
<p>Has arms.</p>
|
||||
<h2 id="age">📖 Age</h2>
|
||||
<p>Up to 130 years.</p>
|
||||
@@ -0,0 +1,7 @@
|
||||
---
|
||||
title: Mammals
|
||||
eleventyNavigation:
|
||||
key: Mammals
|
||||
---
|
||||
|
||||
Mammals need air.
|
||||
96
packages/eleventy-rocket-nav/test-node/integration.test.js
Normal file
96
packages/eleventy-rocket-nav/test-node/integration.test.js
Normal file
@@ -0,0 +1,96 @@
|
||||
const path = require('path');
|
||||
const fs = require('fs-extra');
|
||||
const { expect } = require('chai');
|
||||
const Eleventy = require('@11ty/eleventy');
|
||||
const TemplateConfig = require('@11ty/eleventy/src/TemplateConfig');
|
||||
const prettier = require('prettier');
|
||||
|
||||
async function execute(fixtureDir) {
|
||||
const relPath = path.relative(process.cwd(), __dirname);
|
||||
const relativeInputPath = path.join(relPath, fixtureDir.split('/').join(path.sep));
|
||||
const relativeOutputPath = path.join(relPath, 'fixtures', '__output');
|
||||
const relativeConfigPath = path.join(relativeInputPath, '.eleventy.js');
|
||||
|
||||
await fs.emptyDir(relativeOutputPath);
|
||||
|
||||
const elev = new Eleventy(relativeInputPath, relativeOutputPath);
|
||||
const config = new TemplateConfig(null, relativeConfigPath);
|
||||
elev.config = config.getConfig();
|
||||
elev.setConfigPathOverride(relativeConfigPath);
|
||||
elev.resetConfig();
|
||||
|
||||
await elev.init();
|
||||
await elev.write();
|
||||
return {
|
||||
readOutput: async readPath => {
|
||||
const relativeReadPath = path.join(relativeOutputPath, readPath);
|
||||
let text = await fs.promises.readFile(relativeReadPath);
|
||||
text = text.toString();
|
||||
text = prettier.format(text, { parser: 'html', printWidth: 100 });
|
||||
return text.trim();
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
describe('eleventy-rocket-nav', () => {
|
||||
it('renders a menu with anchors for h2 content', async () => {
|
||||
const { readOutput } = await execute('fixtures/three-pages');
|
||||
|
||||
const bats = await readOutput('bats/index.html');
|
||||
expect(bats).to.deep.equal(
|
||||
[
|
||||
'<body>',
|
||||
' <ul>',
|
||||
' <li class="menu-item active">',
|
||||
' <a href="/mammals/">Mammals</a>',
|
||||
' <ul>',
|
||||
' <li class="menu-item">',
|
||||
' <a href="/humans/">Humans</a>',
|
||||
' </li>',
|
||||
' <li class="menu-item current">',
|
||||
' <a href="/bats/">Bats</a>',
|
||||
' </li>',
|
||||
' </ul>',
|
||||
' </li>',
|
||||
' </ul>',
|
||||
'',
|
||||
' <p>🦇 can fly.</p>',
|
||||
'</body>',
|
||||
].join('\n'),
|
||||
);
|
||||
|
||||
const humans = await readOutput('humans/index.html');
|
||||
expect(humans).to.deep.equal(
|
||||
[
|
||||
'<body>',
|
||||
' <ul>',
|
||||
' <li class="menu-item active">',
|
||||
' <a href="/mammals/">Mammals</a>',
|
||||
' <ul>',
|
||||
' <li class="menu-item current">',
|
||||
' <a href="/humans/">Humans</a>',
|
||||
' <ul>',
|
||||
' <li class="menu-item anchor">',
|
||||
' <a href="#anatomy" class="anchor">Anatomy</a>',
|
||||
' </li>',
|
||||
' <li class="menu-item anchor">',
|
||||
' <a href="#age" class="anchor">📖 Age</a>',
|
||||
' </li>',
|
||||
' </ul>',
|
||||
' </li>',
|
||||
' <li class="menu-item">',
|
||||
' <a href="/bats/">Bats</a>',
|
||||
' </li>',
|
||||
' </ul>',
|
||||
' </li>',
|
||||
' </ul>',
|
||||
'',
|
||||
' <h2 id="anatomy">Anatomy</h2>',
|
||||
' <p>Has arms.</p>',
|
||||
' <h2 id="age">📖 Age</h2>',
|
||||
' <p>Up to 130 years.</p>',
|
||||
'</body>',
|
||||
].join('\n'),
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -43,8 +43,8 @@
|
||||
"remark"
|
||||
],
|
||||
"dependencies": {
|
||||
"@mdjs/mdjs-preview": "^0.3.0",
|
||||
"@mdjs/mdjs-story": "^0.1.0",
|
||||
"@mdjs/mdjs-preview": "^0.3.1",
|
||||
"@mdjs/mdjs-story": "^0.1.1",
|
||||
"@types/unist": "^2.0.3",
|
||||
"es-module-lexer": "^0.3.26",
|
||||
"github-markdown-css": "^4.0.0",
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
# @mdjs/mdjs-preview
|
||||
|
||||
## 0.3.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
|
||||
## 0.3.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@mdjs/mdjs-preview",
|
||||
"version": "0.3.1",
|
||||
"version": "0.3.2",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -13,6 +13,7 @@
|
||||
},
|
||||
"author": "Modern Web <hello@modern-web.dev> (https://modern-web.dev/)",
|
||||
"homepage": "https://rocket.modern-web.dev/docs/markdown-javascript/preview/",
|
||||
"main": "./index.js",
|
||||
"type": "module",
|
||||
"exports": {
|
||||
".": "./index.js",
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
# @mdjs/mdjs-story
|
||||
|
||||
## 0.1.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
|
||||
## 0.1.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@mdjs/mdjs-story",
|
||||
"version": "0.1.1",
|
||||
"version": "0.1.2",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -13,6 +13,7 @@
|
||||
},
|
||||
"author": "Modern Web <hello@modern-web.dev> (https://modern-web.dev/)",
|
||||
"homepage": "https://rocket.modern-web.dev/docs/markdown-javascript/story/",
|
||||
"main": "./index.js",
|
||||
"type": "module",
|
||||
"exports": {
|
||||
".": "./index.js",
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
# plugins-manager
|
||||
|
||||
## 0.2.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
|
||||
## 0.2.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "plugins-manager",
|
||||
"version": "0.2.0",
|
||||
"version": "0.2.1",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -14,6 +14,7 @@
|
||||
"author": "Modern Web <hello@modern-web.dev> (https://modern-web.dev/)",
|
||||
"homepage": "https://rocket.modern-web.dev/docs/tools/plugins-manager/",
|
||||
"type": "module",
|
||||
"main": "./dist/index.cjs",
|
||||
"exports": {
|
||||
".": {
|
||||
"require": "./dist/index.cjs",
|
||||
|
||||
@@ -1,5 +1,13 @@
|
||||
# @rocket/search
|
||||
|
||||
## 0.3.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- be0d0b3: fix: add missing main entry to the packages
|
||||
- Updated dependencies [be0d0b3]
|
||||
- plugins-manager@0.2.1
|
||||
|
||||
## 0.3.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@rocket/search",
|
||||
"version": "0.3.0",
|
||||
"version": "0.3.1",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
@@ -14,6 +14,7 @@
|
||||
"author": "Modern Web <hello@modern-web.dev> (https://modern-web.dev/)",
|
||||
"homepage": "https://rocket.modern-web.dev/docs/presets/search/",
|
||||
"type": "module",
|
||||
"main": "./node.js",
|
||||
"exports": {
|
||||
".": "./node.js",
|
||||
"./node": "./node.js",
|
||||
@@ -44,7 +45,7 @@
|
||||
"@open-wc/scoped-elements": "^1.3.2",
|
||||
"chalk": "^4.0.0",
|
||||
"minisearch": "^3.0.2",
|
||||
"plugins-manager": "^0.2.0",
|
||||
"plugins-manager": "^0.2.1",
|
||||
"sax-wasm": "^2.0.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -29,7 +29,7 @@ function getTitle({ result, search }) {
|
||||
function getText({ result, search }) {
|
||||
const { terms, body } = result;
|
||||
|
||||
return highlightSearchTerms({ text: body, search, terms });
|
||||
return highlightSearchTerms({ text: body, search, terms, addEllipsis: true });
|
||||
}
|
||||
|
||||
// @ts-expect-error https://github.com/microsoft/TypeScript/issues/40110
|
||||
@@ -40,6 +40,7 @@ export class RocketSearch extends ScopedElementsMixin(LitElement) {
|
||||
search: { type: String },
|
||||
results: { type: Array },
|
||||
maxResults: { type: Number, attribute: 'max-results' },
|
||||
noResultsText: { type: String },
|
||||
};
|
||||
}
|
||||
|
||||
@@ -55,6 +56,7 @@ export class RocketSearch extends ScopedElementsMixin(LitElement) {
|
||||
this.jsonUrl = '';
|
||||
this.search = '';
|
||||
this.maxResults = 10;
|
||||
this.noResultsText = 'No results found';
|
||||
/**
|
||||
* @type {RocketSearchResult[]}
|
||||
*/
|
||||
@@ -132,6 +134,9 @@ export class RocketSearch extends ScopedElementsMixin(LitElement) {
|
||||
></rocket-search-option>
|
||||
`,
|
||||
)}
|
||||
${this.results.length <= 0 && this.search.length > 0
|
||||
? html` <rocket-search-option .title=${this.noResultsText}></rocket-search-option> `
|
||||
: ''}
|
||||
</rocket-search-combobox>
|
||||
`;
|
||||
}
|
||||
|
||||
@@ -43,6 +43,8 @@ export class RocketSearchCombobox extends LionCombobox {
|
||||
font: inherit;
|
||||
cursor: pointer;
|
||||
fill: var(--rocket-search-fill-color, #000);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
::slotted([slot='prefix'][close-btn]) {
|
||||
|
||||
@@ -65,7 +65,7 @@ export class RocketSearchOption extends LinkMixin(LionOption) {
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
cursor: default;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
padding: 12px 10px;
|
||||
display: flex;
|
||||
|
||||
@@ -26,6 +26,7 @@ function defaultHighlight(term) {
|
||||
* @param {number} [options.before]
|
||||
* @param {number} [options.length]
|
||||
* @param {function} [options.highlight]
|
||||
* @param {boolean} [options.addEllipsis]
|
||||
*/
|
||||
export function highlightSearchTerms({
|
||||
search,
|
||||
@@ -34,6 +35,7 @@ export function highlightSearchTerms({
|
||||
before = 15,
|
||||
length = 100,
|
||||
highlight = defaultHighlight,
|
||||
addEllipsis = false,
|
||||
}) {
|
||||
if (!search || !text) {
|
||||
return '';
|
||||
@@ -70,5 +72,9 @@ export function highlightSearchTerms({
|
||||
} while (startIndex !== -1);
|
||||
}
|
||||
|
||||
return newText.substr(truncateStart, length + extraLength);
|
||||
let textResult = newText.substr(truncateStart, length + extraLength);
|
||||
if (addEllipsis && truncateStart > 0) {
|
||||
textResult = `...${textResult}`;
|
||||
}
|
||||
return textResult;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user