[ci] format
This commit is contained in:
parent
fc52321a88
commit
f1f207839a
7 changed files with 92 additions and 98 deletions
|
@ -772,9 +772,7 @@ export interface MarkdownInstance<T extends Record<string, any>> {
|
||||||
}>;
|
}>;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type GetHydrateCallback = () => Promise<
|
export type GetHydrateCallback = () => Promise<() => void | Promise<void>>;
|
||||||
() => void | Promise<void>
|
|
||||||
>;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* getStaticPaths() options
|
* getStaticPaths() options
|
||||||
|
|
|
@ -8,43 +8,42 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
const propTypes: PropTypeSelector = {
|
const propTypes: PropTypeSelector = {
|
||||||
0: value => value,
|
0: (value) => value,
|
||||||
1: value => JSON.parse(value, reviver),
|
1: (value) => JSON.parse(value, reviver),
|
||||||
2: value => new RegExp(value),
|
2: (value) => new RegExp(value),
|
||||||
3: value => new Date(value),
|
3: (value) => new Date(value),
|
||||||
4: value => new Map(JSON.parse(value, reviver)),
|
4: (value) => new Map(JSON.parse(value, reviver)),
|
||||||
5: value => new Set(JSON.parse(value, reviver)),
|
5: (value) => new Set(JSON.parse(value, reviver)),
|
||||||
6: value => BigInt(value),
|
6: (value) => BigInt(value),
|
||||||
7: value => new URL(value),
|
7: (value) => new URL(value),
|
||||||
};
|
};
|
||||||
|
|
||||||
const reviver = (propKey: string, raw: string): any => {
|
const reviver = (propKey: string, raw: string): any => {
|
||||||
if (propKey === '' || !Array.isArray(raw)) return raw;
|
if (propKey === '' || !Array.isArray(raw)) return raw;
|
||||||
const [type, value] = raw;
|
const [type, value] = raw;
|
||||||
return (type in propTypes) ? propTypes[type](value) : undefined;
|
return type in propTypes ? propTypes[type](value) : undefined;
|
||||||
};
|
};
|
||||||
|
|
||||||
if (!customElements.get('astro-island')) {
|
if (!customElements.get('astro-island')) {
|
||||||
customElements.define('astro-island', class extends HTMLElement {
|
customElements.define(
|
||||||
|
'astro-island',
|
||||||
|
class extends HTMLElement {
|
||||||
public Component: any;
|
public Component: any;
|
||||||
public hydrator: any;
|
public hydrator: any;
|
||||||
static observedAttributes = ['props'];
|
static observedAttributes = ['props'];
|
||||||
async connectedCallback() {
|
async connectedCallback() {
|
||||||
const [{ default: setup }] = await Promise.all([
|
const [{ default: setup }] = await Promise.all([
|
||||||
import(this.getAttribute('directive-url')!),
|
import(this.getAttribute('directive-url')!),
|
||||||
import(this.getAttribute('before-hydration-url')!)
|
import(this.getAttribute('before-hydration-url')!),
|
||||||
]);
|
]);
|
||||||
window.addEventListener('astro:hydrate', this.hydrate);
|
window.addEventListener('astro:hydrate', this.hydrate);
|
||||||
|
|
||||||
const opts = JSON.parse(this.getAttribute('opts')!);
|
const opts = JSON.parse(this.getAttribute('opts')!);
|
||||||
setup(this, opts, async () => {
|
setup(this, opts, async () => {
|
||||||
const rendererUrl = this.getAttribute('renderer-url');
|
const rendererUrl = this.getAttribute('renderer-url');
|
||||||
const [
|
const [componentModule, { default: hydrator }] = await Promise.all([
|
||||||
componentModule,
|
|
||||||
{ default: hydrator }
|
|
||||||
] = await Promise.all([
|
|
||||||
import(this.getAttribute('component-url')!),
|
import(this.getAttribute('component-url')!),
|
||||||
rendererUrl ? import(rendererUrl) : () => () => {}
|
rendererUrl ? import(rendererUrl) : () => () => {},
|
||||||
]);
|
]);
|
||||||
this.Component = componentModule[this.getAttribute('component-export') || 'default'];
|
this.Component = componentModule[this.getAttribute('component-export') || 'default'];
|
||||||
this.hydrator = hydrator;
|
this.hydrator = hydrator;
|
||||||
|
@ -68,17 +67,20 @@
|
||||||
} else if (fragment) {
|
} else if (fragment) {
|
||||||
innerHTML = fragment.innerHTML;
|
innerHTML = fragment.innerHTML;
|
||||||
}
|
}
|
||||||
const props = this.hasAttribute('props') ? JSON.parse(this.getAttribute('props')!, reviver) : {};
|
const props = this.hasAttribute('props')
|
||||||
|
? JSON.parse(this.getAttribute('props')!, reviver)
|
||||||
|
: {};
|
||||||
this.hydrator(this)(this.Component, props, innerHTML, {
|
this.hydrator(this)(this.Component, props, innerHTML, {
|
||||||
client: this.getAttribute('client')
|
client: this.getAttribute('client'),
|
||||||
});
|
});
|
||||||
this.removeAttribute('ssr');
|
this.removeAttribute('ssr');
|
||||||
window.removeEventListener('astro:hydrate', this.hydrate);
|
window.removeEventListener('astro:hydrate', this.hydrate);
|
||||||
window.dispatchEvent(new CustomEvent('astro:hydrate'));
|
window.dispatchEvent(new CustomEvent('astro:hydrate'));
|
||||||
}
|
};
|
||||||
attributeChangedCallback() {
|
attributeChangedCallback() {
|
||||||
if (this.hydrator) this.hydrate();
|
if (this.hydrator) this.hydrate();
|
||||||
}
|
}
|
||||||
});
|
}
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,8 +5,8 @@ import type {
|
||||||
SSRResult,
|
SSRResult,
|
||||||
} from '../../@types/astro';
|
} from '../../@types/astro';
|
||||||
import { escapeHTML } from './escape.js';
|
import { escapeHTML } from './escape.js';
|
||||||
import { hydrationSpecifier, serializeListValue } from './util.js';
|
|
||||||
import { serializeProps } from './serialize.js';
|
import { serializeProps } from './serialize.js';
|
||||||
|
import { hydrationSpecifier, serializeListValue } from './util.js';
|
||||||
|
|
||||||
const HydrationDirectives = ['load', 'idle', 'media', 'visible', 'only'];
|
const HydrationDirectives = ['load', 'idle', 'media', 'visible', 'only'];
|
||||||
|
|
||||||
|
@ -95,11 +95,6 @@ interface HydrateScriptOptions {
|
||||||
props: Record<string | number, any>;
|
props: Record<string | number, any>;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/** For hydrated components, generate a <script type="module"> to load the component */
|
/** For hydrated components, generate a <script type="module"> to load the component */
|
||||||
export async function generateHydrateScript(
|
export async function generateHydrateScript(
|
||||||
scriptOptions: HydrateScriptOptions,
|
scriptOptions: HydrateScriptOptions,
|
||||||
|
@ -118,8 +113,8 @@ export async function generateHydrateScript(
|
||||||
children: '',
|
children: '',
|
||||||
props: {
|
props: {
|
||||||
// This is for HMR, probably can avoid it in prod
|
// This is for HMR, probably can avoid it in prod
|
||||||
uid: astroId
|
uid: astroId,
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
// Add component url
|
// Add component url
|
||||||
|
@ -136,10 +131,12 @@ export async function generateHydrateScript(
|
||||||
island.props['client'] = hydrate;
|
island.props['client'] = hydrate;
|
||||||
island.props['directive-url'] = await result.resolve(hydrationSpecifier(hydrate));
|
island.props['directive-url'] = await result.resolve(hydrationSpecifier(hydrate));
|
||||||
island.props['before-hydration-url'] = await result.resolve('astro:scripts/before-hydration.js');
|
island.props['before-hydration-url'] = await result.resolve('astro:scripts/before-hydration.js');
|
||||||
island.props['opts'] = escapeHTML(JSON.stringify({
|
island.props['opts'] = escapeHTML(
|
||||||
|
JSON.stringify({
|
||||||
name: metadata.displayName,
|
name: metadata.displayName,
|
||||||
value: metadata.hydrateArgs || ''
|
value: metadata.hydrateArgs || '',
|
||||||
}))
|
})
|
||||||
|
);
|
||||||
|
|
||||||
return island;
|
return island;
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,12 +8,12 @@ import type {
|
||||||
SSRLoadedRenderer,
|
SSRLoadedRenderer,
|
||||||
SSRResult,
|
SSRResult,
|
||||||
} from '../../@types/astro';
|
} from '../../@types/astro';
|
||||||
|
import islandScript from './astro-island.prebuilt.js';
|
||||||
import { escapeHTML, HTMLString, markHTMLString } from './escape.js';
|
import { escapeHTML, HTMLString, markHTMLString } from './escape.js';
|
||||||
import { extractDirectives, generateHydrateScript } from './hydration.js';
|
import { extractDirectives, generateHydrateScript } from './hydration.js';
|
||||||
|
import { serializeProps } from './serialize.js';
|
||||||
import { shorthash } from './shorthash.js';
|
import { shorthash } from './shorthash.js';
|
||||||
import { serializeListValue } from './util.js';
|
import { serializeListValue } from './util.js';
|
||||||
import islandScript from './astro-island.prebuilt.js';
|
|
||||||
import { serializeProps } from './serialize.js';
|
|
||||||
|
|
||||||
export { markHTMLString, markHTMLString as unescapeHTML } from './escape.js';
|
export { markHTMLString, markHTMLString as unescapeHTML } from './escape.js';
|
||||||
export type { Metadata } from './metadata';
|
export type { Metadata } from './metadata';
|
||||||
|
@ -346,9 +346,7 @@ If you're still stuck, please open an issue on GitHub or join us at https://astr
|
||||||
island.props.tmpl = '';
|
island.props.tmpl = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
island.children = `${
|
island.children = `${html ?? ''}${template}`;
|
||||||
html ?? ''
|
|
||||||
}${template}`;
|
|
||||||
|
|
||||||
// Add the astro-island definition only once. Since the SSRResult object
|
// Add the astro-island definition only once. Since the SSRResult object
|
||||||
// is scoped to a page renderer we can use it as a key to know if the script
|
// is scoped to a page renderer we can use it as a key to know if the script
|
||||||
|
@ -362,10 +360,7 @@ If you're still stuck, please open an issue on GitHub or join us at https://astr
|
||||||
script = `<script>${islandScript}</script>`;
|
script = `<script>${islandScript}</script>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
return markHTMLString(
|
return markHTMLString(script + renderElement('astro-island', island, false));
|
||||||
script +
|
|
||||||
renderElement('astro-island', island, false)
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Create the Astro.fetchContent() runtime function. */
|
/** Create the Astro.fetchContent() runtime function. */
|
||||||
|
|
|
@ -16,9 +16,11 @@ function serializeArray(value: any[]): any[] {
|
||||||
}
|
}
|
||||||
|
|
||||||
function serializeObject(value: Record<any, any>): Record<any, any> {
|
function serializeObject(value: Record<any, any>): Record<any, any> {
|
||||||
return Object.fromEntries(Object.entries(value).map(([k, v]) => {
|
return Object.fromEntries(
|
||||||
|
Object.entries(value).map(([k, v]) => {
|
||||||
return [k, convertToSerializedForm(v)];
|
return [k, convertToSerializedForm(v)];
|
||||||
}));
|
})
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function convertToSerializedForm(value: any): [ValueOf<typeof PROP_TYPE>, any] {
|
function convertToSerializedForm(value: any): [ValueOf<typeof PROP_TYPE>, any] {
|
||||||
|
|
|
@ -33,10 +33,10 @@ export default async function prebuild(...args) {
|
||||||
const tscode = await fs.promises.readFile(filepath, 'utf-8');
|
const tscode = await fs.promises.readFile(filepath, 'utf-8');
|
||||||
const esbuildresult = await esbuild.transform(tscode, {
|
const esbuildresult = await esbuild.transform(tscode, {
|
||||||
loader: 'ts',
|
loader: 'ts',
|
||||||
minify: true
|
minify: true,
|
||||||
});
|
});
|
||||||
const rootURL = new URL('../../', import.meta.url);
|
const rootURL = new URL('../../', import.meta.url);
|
||||||
const rel = path.relative(fileURLToPath(rootURL), filepath)
|
const rel = path.relative(fileURLToPath(rootURL), filepath);
|
||||||
const mod = `/**
|
const mod = `/**
|
||||||
* This file is prebuilt from ${rel}
|
* This file is prebuilt from ${rel}
|
||||||
* Do not edit this directly, but instead edit that file and rerun the prebuild
|
* Do not edit this directly, but instead edit that file and rerun the prebuild
|
||||||
|
|
Loading…
Add table
Reference in a new issue