Doc Components

It mainly shows which components are supported by the document.

Headings

headings will be parsed into a file title tree and displayed in the right anchor navigation bar. Currently H1-H6 is supported, where H1-H4 represent normal levels, that is, the heading size is larger than the text, H5, H6 represent abnormal levels, and H1 is usually the document Title, H2 is the section title (the top margin of H2 will be larger than the others), which are expressed as different levels of titles in turn.

list

Ul

  • element 1

  • element 2

  • element 3

Ol

  1. element 1

  2. element 2

  3. element 3

Code

Inline

this is an inner code

Block

model User {
id Int @id @default(autoincrement())
name String?
email String @unique
profileViews Int @default(0)
role Role @default(USER)
coinflips Boolean[]
posts Post[]
city ​​String
country String
profile ExtendedProfile?
pets Json
}
model ExtendedProfile {
id Int @id @default(autoincrement())
userId Int? @unique
bio String?
User User? @relation(fields: [userId], references: [id])
}
model Post {
id Int @id @default(autoincrement())
title String
published Boolean @default(true)
author User @relation(fields: [authorId], references: [id])
authorId Int
comments Json
views Int @default(0)
likes Int @default(0)
}
enum Role {
USER
ADMIN
}

Blockquote

Here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation.

Table

FieldTypeLength/ParameterDefault ValueDescription
idIDTable ID
channel_idbigIntegerCustomer Source
namestring80customer name
companystring200company name
genderinteger0gender 0, unknown, 1 male, 2, female
birthdaydatebirthday
desctextCV
statusenum["enabled"], ["disabled"],enabledstatus

Details

Collapse Content12312

Custom Components

Details

This component is an enhanced component of the details function. The purpose is to support embedding code inside details and highlight it. Note: a blank line is required, otherwise an error will be reported.

Collapse code block

Card

Cards are often used to illustrate content, or to optimize document structure.

Note: Do not indent the inner text, otherwise it will be converted to code, and the last line ends with a separate paragraph, otherwise there will be style problems.

There are mountains in the Great Wilderness, called stars, from the sun and the moon.

There is a country of white people. Emperor Jun gave birth to Emperor Hong, Emperor Hong gave birth to Baimin, Baimin sold his surname, and he used millet to make four birds: leopard, tiger, bear, and scorpion.

There is the country of green hills, there are foxes, and there are nine tails. There are soft servants and people, and it is a country that protects the land. A country with black teeth. Emperor Jun was born with black teeth, surnamed Jiang, ate food, and made four birds.

There is the country of Xiazhou. A country with more than one cover. There is a man of gods, with eight human faces and a tiger's body and ten tails. His name is Tianwu.

In the Great Wilderness, there is a mountain named Juling Yutian, Dongji, Liyang, where the sun and the moon come out. The name is Zhedan, the east is called Zhe, and the wind is called Jun. At the eastern pole to get in and out of the wind.

Notice

Notice is often used to explain, prompt or warn the text.

You are viewing documentation for v2.x and earlier. Documentation for v3.x is here. Here's a hint.
This API will be deprecated in the next version, please use it with caution. This is a warning.
The meaning of this code is to doze in class by punching the card, check the card, punch in the class, start punching in, start punching in, start punching in class, start punching in class, start punching in class, start punching in class, start punching in class, start punching in class, start punching in class and start punching in class. Here is an explanation.

Badge

Badge is usually used as a marker to remind readers of critical information or dangerous operations.

Custom Theme
v3.0.0

Autoplay
Deprecated

version 1.5.0
tested

Icon

/** Icon component, supports the following two icon libraries:
* feather icon https://feathericons.com/
* material design icon https://fonts.google.com/icons
*/
import clsx from 'clsx'
import { useMemo } from 'react'
interface IProps {
/** Chart style class */
className?: string
/** Icon name, starts with `icon` for feather icon and ends with `outline/filled` for material design icon */
name: string
/** Icon size in px */
size?: number
/** Icon color, applicable to all font colors */
color?: string
/** Click event */
onClick?: () => void
}

icon-github

icon-github size={36}

icon-github size={48} color='blue'

Button

Same as Ant Design Button.

General usage

Use with Icon

Tabs

Columns are displayed for content that is out of order and has the same purpose.

Content of Tab Pane 1

Doc Components

It mainly shows which components are supported by the document.

Headings

headings will be parsed into a file title tree and displayed in the right anchor navigation bar. Currently H1-H6 is supported, where H1-H4 represent normal levels, that is, the heading size is larger than the text, H5, H6 represent abnormal levels, and H1 is usually the document Title, H2 is the section title (the top margin of H2 will be larger than the others), which are expressed as different levels of titles in turn.

list

Ul

  • element 1

  • element 2

  • element 3

Ol

  1. element 1

  2. element 2

  3. element 3

Code

Inline

this is an inner code

Block

model User {
id Int @id @default(autoincrement())
name String?
email String @unique
profileViews Int @default(0)
role Role @default(USER)
coinflips Boolean[]
posts Post[]
city ​​String
country String
profile ExtendedProfile?
pets Json
}
model ExtendedProfile {
id Int @id @default(autoincrement())
userId Int? @unique
bio String?
User User? @relation(fields: [userId], references: [id])
}
model Post {
id Int @id @default(autoincrement())
title String
published Boolean @default(true)
author User @relation(fields: [authorId], references: [id])
authorId Int
comments Json
views Int @default(0)
likes Int @default(0)
}
enum Role {
USER
ADMIN
}

Blockquote

Here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation.

Table

FieldTypeLength/ParameterDefault ValueDescription
idIDTable ID
channel_idbigIntegerCustomer Source
namestring80customer name
companystring200company name
genderinteger0gender 0, unknown, 1 male, 2, female
birthdaydatebirthday
desctextCV
statusenum["enabled"], ["disabled"],enabledstatus

Details

Collapse Content12312

Custom Components

Details

This component is an enhanced component of the details function. The purpose is to support embedding code inside details and highlight it. Note: a blank line is required, otherwise an error will be reported.

Collapse code block

Card

Cards are often used to illustrate content, or to optimize document structure.

Note: Do not indent the inner text, otherwise it will be converted to code, and the last line ends with a separate paragraph, otherwise there will be style problems.

There are mountains in the Great Wilderness, called stars, from the sun and the moon.

There is a country of white people. Emperor Jun gave birth to Emperor Hong, Emperor Hong gave birth to Baimin, Baimin sold his surname, and he used millet to make four birds: leopard, tiger, bear, and scorpion.

There is the country of green hills, there are foxes, and there are nine tails. There are soft servants and people, and it is a country that protects the land. A country with black teeth. Emperor Jun was born with black teeth, surnamed Jiang, ate food, and made four birds.

There is the country of Xiazhou. A country with more than one cover. There is a man of gods, with eight human faces and a tiger's body and ten tails. His name is Tianwu.

In the Great Wilderness, there is a mountain named Juling Yutian, Dongji, Liyang, where the sun and the moon come out. The name is Zhedan, the east is called Zhe, and the wind is called Jun. At the eastern pole to get in and out of the wind.

Notice

Notice is often used to explain, prompt or warn the text.

You are viewing documentation for v2.x and earlier. Documentation for v3.x is here. Here's a hint.
This API will be deprecated in the next version, please use it with caution. This is a warning.
The meaning of this code is to doze in class by punching the card, check the card, punch in the class, start punching in, start punching in, start punching in class, start punching in class, start punching in class, start punching in class, start punching in class, start punching in class, start punching in class and start punching in class. Here is an explanation.

Badge

Badge is usually used as a marker to remind readers of critical information or dangerous operations.

Custom Theme
v3.0.0

Autoplay
Deprecated

version 1.5.0
tested

Icon

/** Icon component, supports the following two icon libraries:
* feather icon https://feathericons.com/
* material design icon https://fonts.google.com/icons
*/
import clsx from 'clsx'
import { useMemo } from 'react'
interface IProps {
/** Chart style class */
className?: string
/** Icon name, starts with `icon` for feather icon and ends with `outline/filled` for material design icon */
name: string
/** Icon size in px */
size?: number
/** Icon color, applicable to all font colors */
color?: string
/** Click event */
onClick?: () => void
}

icon-github

icon-github size={36}

icon-github size={48} color='blue'

Button

Same as Ant Design Button.

General usage

Use with Icon

Tabs

Columns are displayed for content that is out of order and has the same purpose.

Content of Tab Pane 1