@enonic/react-components
Version:
Library of React components for handling Enonic XP data and page components
221 lines (214 loc) • 7.95 kB
text/typescript
import { ComponentDescriptor, TextComponent, LiteralUnion, RequestMode } from '@enonic-types/core';
import { Element } from 'html-react-parser';
import { JSX, CSSProperties, ReactNode } from 'react';
interface ComponentDefinitionParams<PROPS = {}> {
View: React.FunctionComponent<PROPS>;
}
interface ComponentDefinition<PROPS = {}> {
View: React.FunctionComponent<PROPS>;
}
interface ComponentRegistry {
addContentType<PROPS = {}>(name: string, obj: ComponentDefinitionParams<PROPS>): void;
addMacro<PROPS = {}>(name: string, obj: ComponentDefinitionParams<PROPS>): void;
addLayout<PROPS = {}>(name: string, obj: ComponentDefinitionParams<PROPS>): void;
addPage<PROPS = {}>(name: string, obj: ComponentDefinitionParams<PROPS>): void;
addPart<PROPS = {}>(name: string, obj: ComponentDefinitionParams<PROPS>): void;
getContentType<PROPS = {}>(name: string): ComponentDefinition<PROPS> | undefined;
getMacro<PROPS = {}>(name: string): ComponentDefinition<PROPS> | undefined;
getLayout<PROPS = {}>(name: string): ComponentDefinition<PROPS> | undefined;
getPage<PROPS = {}>(name: string): ComponentDefinition<PROPS> | undefined;
getPart<PROPS = {}>(name: string): ComponentDefinition<PROPS> | undefined;
hasContentType(name: string): boolean;
hasMacro(name: string): boolean;
hasLayout(name: string): boolean;
hasPage(name: string): boolean;
hasPart(name: string): boolean;
}
type XpRunMode = 'development' | 'production';
interface ContentTypeData {
contentType: string;
type: 'contentType';
}
interface ErrorData {
html: string;
path: string;
type: 'error';
}
interface RegionData {
name: string;
components: ComponentDataAndProps[];
}
type RegionsData = Record<string, RegionData>;
interface LayoutData {
descriptor: ComponentDescriptor;
path?: string;
regions: RegionsData;
type: 'layout';
}
interface PageData {
descriptor: ComponentDescriptor;
path: '/';
regions: RegionsData;
type: 'page';
}
interface PartData {
descriptor: ComponentDescriptor;
path?: string;
type: 'part';
}
interface FragmentData {
key?: string;
path?: string;
type: 'fragment';
}
interface MacroComponentData {
descriptor: string;
name: string;
ref?: string;
type: 'macro';
}
type TextData = TextComponent;
type MetaData = {
type: string;
id: string;
path: string;
mode: LiteralUnion<RequestMode>;
componentRegistry: ComponentRegistry;
};
type ComponentDataAndProps<T extends ComponentData = ComponentData> = {
data?: Record<string, unknown>;
component: T;
};
type ComponentData = ContentTypeData | LayoutData | PageData | PartData | TextData | FragmentData | MacroComponentData | ErrorData;
interface RichTextData extends Record<string, unknown> {
processedHtml: string;
links?: LinkData[];
macros?: MacroData[];
images?: ImageData[];
}
interface ExtendedRichTextData extends RichTextData {
macroComponents?: ComponentDataAndProps<MacroComponentData>[];
}
interface LinkData {
ref: string;
content?: Partial<RichtextContent> | null;
media?: LinkDataMedia | null;
uri: string;
}
interface LinkDataMedia {
content: Partial<RichtextContent> & {
mediaUrl?: string;
};
intent: 'inline' | 'download';
}
type MacroConfig = Record<string, unknown>;
interface MacroData {
ref: string;
name: string;
descriptor: string;
config: Record<string, MacroConfig>;
}
type ImageContent = Partial<RichtextContent> & {
imageUrl?: string;
};
interface ImageData {
ref: string;
image: ImageContent;
style?: ImageStyle | null;
}
interface ImageStyle {
name: string;
aspectRatio: string;
filter: string;
}
type RichTextComponentProps = Omit<ComponentProps, 'data' | 'meta'> & {
data: ExtendedRichTextData;
meta: RichTextMetaData;
};
type RichTextMetaData = Omit<MetaData, 'componentRegistry'> & {
componentRegistry?: ComponentRegistry;
};
type ReplacerResult = JSX.Element | object | void | undefined | null | false;
type ImageComponent<RestProps = Record<string, unknown>> = (params: ImageComponentParams<RestProps>) => JSX.Element | null;
type ImageComponentParams<RestProps = Record<string, unknown>> = {
alt?: string;
image: ImageContent;
imageStyle?: ImageStyle | null;
sizes?: string;
src: string;
srcSet?: string;
style?: CSSProperties;
} & RestProps;
type ReplacerParams<RestProps = Record<string, unknown>> = RichTextComponentProps & {
el: Element;
} & RestProps;
type Replacer<RestProps = Record<string, unknown>> = (params: ReplacerParams<RestProps>) => ReplacerResult;
type LinkComponent<RestProps = Record<string, unknown>> = (params: LinkComponentParams<RestProps>) => JSX.Element | null;
type LinkComponentParams<RestProps = Record<string, unknown>> = {
children: ReactNode;
content?: Partial<RichtextContent> | null;
href: string;
media?: LinkDataMedia | null;
target?: string;
title?: string;
uri: string;
} & RestProps;
type MacroComponent<RestProps = Record<string, unknown>> = (params: MacroComponentParams<RestProps>) => JSX.Element | null;
type MacroComponentParams<RestProps = Record<string, unknown>> = ComponentProps<MacroComponentData> & {
children: string | JSX.Element | JSX.Element[];
} & RestProps;
type RichtextContent<Extensions extends Record<string, unknown> = Record<string, unknown>> = {
_id: string;
_name: string;
_path: string;
_references: RichtextContent[];
_score?: number;
children: RichtextContent[];
components: RichtextContent[];
createdTime: string;
displayName: string;
language: string;
modifiedTime?: string;
pageTemplate: RichtextContent;
pageUrl: string;
parent: RichtextContent;
type: string;
valid: boolean;
imageUrl?: string;
mediaUrl?: string;
[key: string]: any;
} & Extensions;
type RichTextParams<RestProps = Record<string, unknown>> = RichTextComponentProps & {
tag?: string;
className?: string;
Image?: ImageComponent<RestProps>;
Macro?: MacroComponent<RestProps>;
Link?: LinkComponent<RestProps>;
replacer?: Replacer<RestProps>;
} & RestProps;
type ContentUri = `content://${string}`;
type MediaUri = `media://${string}`;
interface ComponentProps<T extends ComponentData = ComponentData> {
meta: MetaData;
component: T;
data?: Record<string, unknown>;
common?: Record<string, unknown>;
}
declare enum COMPONENT_DATA_TYPE {
CONTENT_TYPE = "contentType",
ERROR = "error",
FRAGMENT = "fragment",
LAYOUT = "layout",
PAGE = "page",
PART = "part",
TEXT = "text",
MACRO = "macro"
}
declare enum XP_REQUEST_MODE {
ADMIN = "admin",
EDIT = "edit",
INLINE = "inline",
LIVE = "live",
PREVIEW = "preview"
}
export { type Replacer as A, type ReplacerResult as B, type ComponentProps as C, type RichTextComponentProps as D, type ErrorData as E, type FragmentData as F, type RichTextData as G, type RichTextMetaData as H, type ImageComponentParams as I, type RichtextContent as J, type XpRunMode as K, type LayoutData as L, type MacroComponentParams as M, type PageData as P, type RichTextParams as R, type TextData as T, XP_REQUEST_MODE as X, type ContentTypeData as a, type PartData as b, type ComponentRegistry as c, type ComponentDefinitionParams as d, type ComponentDefinition as e, type ComponentDataAndProps as f, type MetaData as g, type LinkComponentParams as h, COMPONENT_DATA_TYPE as i, type ComponentData as j, type ContentUri as k, type ExtendedRichTextData as l, type ImageComponent as m, type ImageContent as n, type ImageData as o, type ImageStyle as p, type LinkComponent as q, type LinkData as r, type LinkDataMedia as s, type MacroComponent as t, type MacroComponentData as u, type MacroConfig as v, type MacroData as w, type MediaUri as x, type RegionData as y, type RegionsData as z };