add support for frontmatter scripts
This commit is contained in:
parent
5492a2dc4e
commit
195b131f43
22 changed files with 82 additions and 46 deletions
|
@ -1,6 +1,6 @@
|
||||||
<script astro>
|
---
|
||||||
export let props: { version: string };
|
export let props: { version: string };
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@use '../../public/css/var' as *;
|
@use '../../public/css/var' as *;
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<script>
|
---
|
||||||
//let name = 'world';
|
//let name = 'world';
|
||||||
// TODO make this dynamic?
|
// TODO make this dynamic?
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<h3>Assets</h3>
|
<h3>Assets</h3>
|
||||||
|
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
<script astro>
|
---
|
||||||
export let props: {
|
export let props: {
|
||||||
title: string,
|
title: string,
|
||||||
inputPath: string,
|
inputPath: string,
|
||||||
headers: { text: string, slug: string }[]
|
headers: { text: string, slug: string }[]
|
||||||
};
|
};
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@use "../../public/css/var" as *;
|
@use "../../public/css/var" as *;
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<script astro>
|
---
|
||||||
import Banner from '../components/Banner.hmx';
|
import Banner from '../components/Banner.hmx';
|
||||||
import Nav from '../components/Nav.hmx';
|
import Nav from '../components/Nav.hmx';
|
||||||
export function setup({ context }) {
|
export function setup({ context }) {
|
||||||
|
@ -10,7 +10,7 @@
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<astro:head>
|
<astro:head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<script astro>
|
---
|
||||||
import Menu from '../components/Menu.hmx';
|
import Menu from '../components/Menu.hmx';
|
||||||
import Subnav from '../components/Subnav.hmx';
|
import Subnav from '../components/Subnav.hmx';
|
||||||
|
|
||||||
|
@ -6,7 +6,7 @@
|
||||||
export function setup({ context }) {
|
export function setup({ context }) {
|
||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<script astro>
|
---
|
||||||
import Subnav from '../components/Subnav.hmx';
|
import Subnav from '../components/Subnav.hmx';
|
||||||
import Menu from '../components/Menu.hmx';
|
import Menu from '../components/Menu.hmx';
|
||||||
|
|
||||||
|
@ -9,7 +9,7 @@
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<section class="snow-view__docs has-subnav">
|
<section class="snow-view__docs has-subnav">
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
<script astro>
|
---
|
||||||
import Menu from '../components/Menu.hmx';
|
import Menu from '../components/Menu.hmx';
|
||||||
export const layout = 'layouts/base.hmx';
|
export const layout = 'layouts/base.hmx';
|
||||||
export function setup({ context }) {
|
export function setup({ context }) {
|
||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<section class="snow-view__docs is-full">
|
<section class="snow-view__docs is-full">
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
<script astro>
|
---
|
||||||
import { format as formatDate, parseISO } from 'date-fns';
|
import { format as formatDate, parseISO } from 'date-fns';
|
||||||
export const layout = 'layouts/base.hmx';
|
export const layout = 'layouts/base.hmx';
|
||||||
export function setup({ context }) {
|
export function setup({ context }) {
|
||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<astro:head>
|
<astro:head>
|
||||||
<link rel="stylesheet" href="/css/legacy-post.css" />
|
<link rel="stylesheet" href="/css/legacy-post.css" />
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<script astro>
|
---
|
||||||
export const layout = 'layouts/main.hmx';
|
export const layout = 'layouts/main.hmx';
|
||||||
|
|
||||||
export function setup({ context }) {
|
export function setup({ context }) {
|
||||||
|
@ -8,7 +8,7 @@
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<h2 class="content-title">
|
<h2 class="content-title">
|
||||||
{context.title}
|
{context.title}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<script astro>
|
---
|
||||||
import Card from '../components/Card.jsx';
|
import Card from '../components/Card.jsx';
|
||||||
|
|
||||||
export const layout = 'layouts/main.hmx';
|
export const layout = 'layouts/main.hmx';
|
||||||
|
@ -40,7 +40,7 @@
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<h2 class="content-title">
|
<h2 class="content-title">
|
||||||
{context.title}
|
{context.title}
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
<script astro>
|
---
|
||||||
import Menu from '../components/Menu.hmx';
|
import MenuA from '../components/Menu.hmx';
|
||||||
import Hero from '../components/Hero.hmx';
|
import HeroB from '../components/Hero.hmx';
|
||||||
|
|
||||||
export const layout = 'layouts/base.hmx';
|
export const layout = 'layouts/base.hmx';
|
||||||
export function setup({ context }) {
|
export function setup({ context }) {
|
||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<astro:head>
|
<astro:head>
|
||||||
<meta charset="AAA" />
|
<meta charset="AAA" />
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<script astro>
|
---
|
||||||
import Card from '../components/Card.jsx';
|
import Card from '../components/Card.jsx';
|
||||||
import CompanyLogo from '../components/CompanyLogo.jsx';
|
import CompanyLogo from '../components/CompanyLogo.jsx';
|
||||||
import NewsAssets from '../components/NewsAssets.svelte';
|
import NewsAssets from '../components/NewsAssets.svelte';
|
||||||
|
@ -23,7 +23,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<NewsTitle title={context.title} />
|
<NewsTitle title={context.title} />
|
||||||
|
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script astro>
|
---
|
||||||
import news from '../data/news.json';
|
import news from '../data/news.json';
|
||||||
import users from '../data/users.json';
|
import users from '../data/users.json';
|
||||||
import PluginSearchPage from '../components/PluginSearchPage.jsx';
|
import PluginSearchPage from '../components/PluginSearchPage.jsx';
|
||||||
|
@ -54,7 +54,7 @@
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<h2 class="content-title">{ context.title }</h2>
|
<h2 class="content-title">{ context.title }</h2>
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<script astro>
|
---
|
||||||
import Subnav from '../components/Subnav.hmx';
|
import Subnav from '../components/Subnav.hmx';
|
||||||
import { content as Menu } from '../components/Menu.hmx';
|
import { content as Menu } from '../components/Menu.hmx';
|
||||||
// import contentful from 'skypack:contentful';
|
// import contentful from 'skypack:contentful';
|
||||||
|
@ -7,7 +7,7 @@
|
||||||
const entry = await contentful.getEntry(params.slug);
|
const entry = await contentful.getEntry(params.slug);
|
||||||
return { title: entry.fields.title, description: entry.fields.description, layout: 'layouts/base.hmx', props: { entry } };
|
return { title: entry.fields.title, description: entry.fields.description, layout: 'layouts/base.hmx', props: { entry } };
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<section class="snow-view__docs has-subnav">
|
<section class="snow-view__docs has-subnav">
|
||||||
|
|
|
@ -226,7 +226,7 @@ export default function parse(template: string, options: ParserOptions = {}): As
|
||||||
parser.error(
|
parser.error(
|
||||||
{
|
{
|
||||||
code: 'duplicate-style',
|
code: 'duplicate-style',
|
||||||
message: 'You can only have one top-level <style> tag per component',
|
message: 'You can only have one <style> tag per HMX file',
|
||||||
},
|
},
|
||||||
parser.css[1].start
|
parser.css[1].start
|
||||||
);
|
);
|
||||||
|
@ -240,7 +240,7 @@ export default function parse(template: string, options: ParserOptions = {}): As
|
||||||
parser.error(
|
parser.error(
|
||||||
{
|
{
|
||||||
code: 'invalid-script',
|
code: 'invalid-script',
|
||||||
message: 'A component can only have one <script astro> element',
|
message: 'A component can only have one frontmatter (---) script',
|
||||||
},
|
},
|
||||||
hmx_scripts[1].start
|
hmx_scripts[1].start
|
||||||
);
|
);
|
||||||
|
|
|
@ -1,9 +1,14 @@
|
||||||
import tag from './tag.js';
|
import tag from './tag.js';
|
||||||
|
import setup from './setup.js';
|
||||||
import mustache from './mustache.js';
|
import mustache from './mustache.js';
|
||||||
import text from './text.js';
|
import text from './text.js';
|
||||||
import { Parser } from '../index.js';
|
import { Parser } from '../index.js';
|
||||||
|
|
||||||
export default function fragment(parser: Parser) {
|
export default function fragment(parser: Parser) {
|
||||||
|
if (parser.match('---')) {
|
||||||
|
return setup;
|
||||||
|
}
|
||||||
|
|
||||||
if (parser.match('<')) {
|
if (parser.match('<')) {
|
||||||
return tag;
|
return tag;
|
||||||
}
|
}
|
||||||
|
|
30
src/compiler/parse/state/setup.ts
Normal file
30
src/compiler/parse/state/setup.ts
Normal file
|
@ -0,0 +1,30 @@
|
||||||
|
// @ts-nocheck
|
||||||
|
|
||||||
|
import { Parser } from '../index.js';
|
||||||
|
|
||||||
|
export default function setup(parser: Parser): void {
|
||||||
|
const start = parser.index;
|
||||||
|
parser.index += 3;
|
||||||
|
const content_start = parser.index;
|
||||||
|
const setupScriptContent = parser.read_until(/^---/m);
|
||||||
|
const content_end = parser.index;
|
||||||
|
console.log(setupScriptContent);
|
||||||
|
parser.eat('---', true);
|
||||||
|
const end = parser.index;
|
||||||
|
|
||||||
|
console.log('XXX', parser.template.slice(end));
|
||||||
|
parser.js.push({
|
||||||
|
type: 'Script',
|
||||||
|
context: 'setup',
|
||||||
|
start,
|
||||||
|
end,
|
||||||
|
content: setupScriptContent,
|
||||||
|
// attributes,
|
||||||
|
// content: {
|
||||||
|
// start: content_start,
|
||||||
|
// end: content_end,
|
||||||
|
// styles,
|
||||||
|
// },
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
|
@ -24,13 +24,14 @@ const meta_tags = new Map([
|
||||||
const valid_meta_tags = Array.from(meta_tags.keys()); //.concat('astro:self', 'astro:component', 'astro:fragment');
|
const valid_meta_tags = Array.from(meta_tags.keys()); //.concat('astro:self', 'astro:component', 'astro:fragment');
|
||||||
|
|
||||||
const specials = new Map([
|
const specials = new Map([
|
||||||
[
|
// Now handled as "setup" in setup.ts
|
||||||
'script',
|
// [
|
||||||
{
|
// 'script',
|
||||||
read: read_script,
|
// {
|
||||||
property: 'js',
|
// read: read_script,
|
||||||
},
|
// property: 'js',
|
||||||
],
|
// },
|
||||||
|
// ],
|
||||||
[
|
[
|
||||||
'style',
|
'style',
|
||||||
{
|
{
|
||||||
|
|
|
@ -8,7 +8,7 @@ export default function text(parser: Parser) {
|
||||||
|
|
||||||
let data = '';
|
let data = '';
|
||||||
|
|
||||||
while (parser.index < parser.template.length && !parser.match('<') && !parser.match('{')) {
|
while (parser.index < parser.template.length && !parser.match('---') && !parser.match('<') && !parser.match('{')) {
|
||||||
data += parser.template[parser.index++];
|
data += parser.template[parser.index++];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
<script astro>
|
---
|
||||||
export function setup() {
|
export function setup() {
|
||||||
return {
|
return {
|
||||||
props: {}
|
props: {}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<astro:head>
|
<astro:head>
|
||||||
<!-- Head Stuff -->
|
<!-- Head Stuff -->
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
<script astro>
|
---
|
||||||
export function setup() {
|
export function setup() {
|
||||||
return {
|
return {
|
||||||
props: {}
|
props: {}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<astro:head>
|
<astro:head>
|
||||||
<!-- Head Stuff -->
|
<!-- Head Stuff -->
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script astro>
|
---
|
||||||
import Hello from '../components/Hello.jsx';
|
import Hello from '../components/Hello.jsx';
|
||||||
</script>
|
---
|
||||||
|
|
||||||
<astro:head>
|
<astro:head>
|
||||||
<!-- Head Stuff -->
|
<!-- Head Stuff -->
|
||||||
|
|
Loading…
Add table
Reference in a new issue