@studiocms/html

v0.1.0-beta.23 GitHub npm Changelog

Dieser Inhalt ist noch nicht in deiner Sprache verfügbar.

Introduction

This plugin enables HTML Support within StudioCMS.

Installation

Install the package using the following command:
- npm
- pnpm
- yarn
Terminal-Fenster
npm run studiocms add @studiocms/html
Terminal-Fenster
pnpm run studiocms add @studiocms/html
Terminal-Fenster
yarn run studiocms add @studiocms/html

Your StudioCMS config should now include @studiocms/html:

import { 
function defineStudioCMSConfig(config: StudioCMSOptions): {
    plugins?: StudioCMSPlugin[] | undefined;
    logLevel?: "All" | "Fatal" | "Error" | "Warning" | "Info" | "Debug" | "Trace" | "None" | undefined;
    dbStartPage?: boolean | undefined;
    verbose?: boolean | undefined;
    componentRegistry?: Record<string, string> | undefined;
    locale?: {
        dateLocale?: string | undefined;
        dateTimeFormat?: Intl.DateTimeFormatOptions | undefined;
    } | undefined;
    features?: {
        sdk?: boolean | {
            cacheConfig?: boolean | {
                lifetime?: string | undefined;
            } | undefined;
        } | undefined;
        robotsTXT?: boolean | RobotsConfig | undefined;
        injectQuickActionsMenu?: boolean | undefined;
        dashboardConfig?: {
            dashboardEnabled?: boolean | undefined;
            inject404Route?: boolean | undefined;
            faviconURL?: string | undefined;
            dashboardRouteOverride?: string | undefined;
            versionCheck?: boolean | undefined;
        } | undefined;
        authConfig?: {
            providers?: {
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string;
                username: string;
            } | undefined;
        } | undefined;
        preferredImageService?: string ...
A utility function to define the StudioCMS config object.
This function is used to define the optional StudioCMS
config object in the Astro project root. The expected file
name is studiocms.config.mjs. And it should be adjacent
to the Astro project's astro.config.mjs file.
StudioCMS will attempt to import this file and use the default
export as the StudioCMS config object automatically if it exists.
Using this function is optional, but it can be useful for IDEs
to provide better intellisense and type checking.
@example 
// studiocms.config.mjs
import { defineStudioCMSConfig } from 'studiocms';

export default defineStudioCMSConfig({
 dbStartPage: true,
 contentRenderer: 'marked',
 verbose: true,
 dateLocale: 'en-us',
 // ...Other Options
})
defineStudioCMSConfig } from 'studiocms/config';
import 
function html(options?: HTMLSchemaOptions): StudioCMSPlugin
Creates the StudioCMS HTML plugin.
This plugin integrates HTML page type support into StudioCMS, providing editor and renderer components.
It resolves configuration options, sets up Astro integrations, and registers the HTML page type for rendering.
@param ― options - Optional configuration for the HTML schema.
@returns ― The StudioCMS plugin configuration object.
html from '@studiocms/html';

 export default 
function defineStudioCMSConfig(config: StudioCMSOptions): {
    plugins?: StudioCMSPlugin[] | undefined;
    logLevel?: "All" | "Fatal" | "Error" | "Warning" | "Info" | "Debug" | "Trace" | "None" | undefined;
    dbStartPage?: boolean | undefined;
    verbose?: boolean | undefined;
    componentRegistry?: Record<string, string> | undefined;
    locale?: {
        dateLocale?: string | undefined;
        dateTimeFormat?: Intl.DateTimeFormatOptions | undefined;
    } | undefined;
    features?: {
        sdk?: boolean | {
            cacheConfig?: boolean | {
                lifetime?: string | undefined;
            } | undefined;
        } | undefined;
        robotsTXT?: boolean | RobotsConfig | undefined;
        injectQuickActionsMenu?: boolean | undefined;
        dashboardConfig?: {
            dashboardEnabled?: boolean | undefined;
            inject404Route?: boolean | undefined;
            faviconURL?: string | undefined;
            dashboardRouteOverride?: string | undefined;
            versionCheck?: boolean | undefined;
        } | undefined;
        authConfig?: {
            providers?: {
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string;
                username: string;
            } | undefined;
        } | undefined;
        preferredImageService?: string ...
A utility function to define the StudioCMS config object.
This function is used to define the optional StudioCMS
config object in the Astro project root. The expected file
name is studiocms.config.mjs. And it should be adjacent
to the Astro project's astro.config.mjs file.
StudioCMS will attempt to import this file and use the default
export as the StudioCMS config object automatically if it exists.
Using this function is optional, but it can be useful for IDEs
to provide better intellisense and type checking.
@example 
// studiocms.config.mjs
import { defineStudioCMSConfig } from 'studiocms';

export default defineStudioCMSConfig({
 dbStartPage: true,
 contentRenderer: 'marked',
 verbose: true,
 dateLocale: 'en-us',
 // ...Other Options
})
defineStudioCMSConfig({
   
plugins?: StudioCMSPlugin[] | undefined
plugins: [
     
function html(options?: HTMLSchemaOptions): StudioCMSPlugin
Creates the StudioCMS HTML plugin.
This plugin integrates HTML page type support into StudioCMS, providing editor and renderer components.
It resolves configuration options, sets up Astro integrations, and registers the HTML page type for rendering.
@param ― options - Optional configuration for the HTML schema.
@returns ― The StudioCMS plugin configuration object.
html(),
   ],
 });

Options

type 
type htmlOptions = {
    sanitize: {
        allowAttributes: Record<string, string[]>;
        allowComments: boolean;
        allowComponents: boolean;
        allowCustomElements: boolean;
        allowElements: string[];
        blockElements: string[];
        dropAttributes: Record<string, string[]>;
        dropElements: string[];
    };
}
htmlOptions = {
  
sanitize: {
    allowAttributes: Record<string, string[]>;
    allowComments: boolean;
    allowComponents: boolean;
    allowCustomElements: boolean;
    allowElements: string[];
    blockElements: string[];
    dropAttributes: Record<string, string[]>;
    dropElements: string[];
}
sanitize: {
    
allowAttributes: Record<string, string[]>
allowAttributes: 
type Record<K extends keyof any, T> = { [P in K]: T; }
Construct a type with a set of properties K of type T
Record<string, string[]>;
    
allowComments: boolean
allowComments: boolean;
    
allowComponents: boolean
allowComponents: boolean;
    
allowCustomElements: boolean
allowCustomElements: boolean;
    
allowElements: string[]
allowElements: string[];
    
blockElements: string[]
blockElements: string[];
    
dropAttributes: Record<string, string[]>
dropAttributes: 
type Record<K extends keyof any, T> = { [P in K]: T; }
Construct a type with a set of properties K of type T
Record<string, string[]>;
    
dropElements: string[]
dropElements: string[];
  };
};