alepha
Version:
Alepha is a convention-driven TypeScript framework for building robust, end-to-end type-safe applications, from serverless APIs to full-stack React apps.
120 lines (119 loc) • 3.85 kB
TypeScript
import * as _alepha_core1 from "alepha";
import { Descriptor, KIND } from "alepha";
import { PageConfigSchema, PageRoute, ReactRouterState, TPropsDefault, TPropsParentDefault } from "alepha/react";
import { ServerTimingProvider } from "alepha/server";
//#region src/interfaces/Head.d.ts
interface Head extends SimpleHead {
description?: string;
keywords?: string[];
author?: string;
robots?: string;
themeColor?: string;
viewport?: string | {
width?: string;
height?: string;
initialScale?: string;
maximumScale?: string;
userScalable?: "no" | "yes" | "0" | "1";
interactiveWidget?: "resizes-visual" | "resizes-content" | "overlays-content";
};
og?: {
title?: string;
description?: string;
image?: string;
url?: string;
type?: string;
};
twitter?: {
card?: string;
title?: string;
description?: string;
image?: string;
site?: string;
};
}
interface SimpleHead {
title?: string;
titleSeparator?: string;
htmlAttributes?: Record<string, string>;
bodyAttributes?: Record<string, string>;
meta?: Array<{
name: string;
content: string;
}>;
}
//#endregion
//#region src/providers/HeadProvider.d.ts
declare class HeadProvider {
global?: Head | (() => Head);
protected getGlobalHead(): Head | undefined;
fillHead(state: ReactRouterState): void;
protected fillHeadByPage(page: PageRoute, state: ReactRouterState, props: Record<string, any>): void;
}
//#endregion
//#region src/descriptors/$head.d.ts
/**
* Set global `<head>` options for the application.
*/
declare const $head: {
(options: HeadDescriptorOptions): HeadDescriptor;
[KIND]: typeof HeadDescriptor;
};
type HeadDescriptorOptions = Head | (() => Head);
declare class HeadDescriptor extends Descriptor<HeadDescriptorOptions> {
protected readonly provider: HeadProvider;
protected onInit(): void;
}
//#endregion
//#region src/hooks/useHead.d.ts
/**
* ```tsx
* const App = () => {
* const [head, setHead] = useHead({
* // will set the document title on the first render
* title: "My App",
* });
*
* return (
* // This will update the document title when the button is clicked
* <button onClick={() => setHead({ title: "Change Title" })}>
* Change Title {head.title}
* </button>
* );
* }
* ```
*/
declare const useHead: (options?: UseHeadOptions) => UseHeadReturn;
type UseHeadOptions = Head | ((previous?: Head) => Head);
type UseHeadReturn = [Head, (head?: Head | ((previous?: Head) => Head)) => void];
//#endregion
//#region src/providers/ServerHeadProvider.d.ts
declare class ServerHeadProvider {
protected readonly headProvider: HeadProvider;
protected readonly serverTimingProvider: ServerTimingProvider;
protected readonly onServerRenderEnd: _alepha_core1.HookDescriptor<"react:server:render:end">;
renderHead(template: string, head: SimpleHead): string;
protected mergeAttributes(existing: string, attrs: Record<string, string>): string;
protected parseAttributes(attrStr: string): Record<string, string>;
protected escapeHtml(str: string): string;
}
//#endregion
//#region src/index.d.ts
declare module "alepha/react" {
interface PageDescriptorOptions<TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = TPropsDefault, TPropsParent extends object = TPropsParentDefault> {
head?: Head | ((props: TProps, previous?: Head) => Head);
}
interface ReactRouterState {
head: Head;
}
}
/**
* Fill `<head>` server & client side.
*
* @see {@link ServerHeadProvider}
* @module alepha.react.head
*/
declare const AlephaReactHead: _alepha_core1.Service<_alepha_core1.Module>;
//#endregion
export { $head, AlephaReactHead, Head, HeadDescriptor, HeadDescriptorOptions, ServerHeadProvider, SimpleHead, UseHeadOptions, UseHeadReturn, useHead };
//# sourceMappingURL=index.d.ts.map