chore: update docs

This commit is contained in:
Hossein Mehrabi 2023-10-30 07:47:43 +03:30
parent fabca3ca9a
commit 7ea4c58f3e
No known key found for this signature in database
GPG Key ID: 45C04964191AFAA1
22 changed files with 3929 additions and 46 deletions

1
CONTRIBUTING.md Normal file
View File

@ -0,0 +1 @@
TODO

143
README.md
View File

@ -1,80 +1,137 @@
- [Description](#description)
- [Installation](#installation)
- [Usage](#usage)
- [Development Guides](#development-guides)
- [Run locally](#run-locally)
- [Versioning](#versioning)
- [Overview](#overview)
- [Quick start](#quick-start)
- [Use a template](#use-a-template)
- [Use with an existing Docusaurus website:](#use-with-an-existing-docusaurus-website)
- [Use the playground](#use-the-playground)
- [Next steps](#next-steps)
- [Working on content](#working-on-content)
- [Configuration](#configuration)
- [Become a contributor](#become-a-contributor)
- [Packages](#packages)
- [TODO](#todo)
- [License](#license)
# Description
## Overview
This monorepo contains a set of [Docusaurus 2](https://docusaurus.io/) plugins and themes developed for Logos documentation websites.
This repository contains a set of Docusaurus 2 plugins and themes, initially crafted for Logos websites but versatile enough for use with any Docusaurus website. The collection includes a headless local search, OG image generation, and Fathom Analytics plugins.
# Installation
## Quick start
Clone this repository and install the dependencies by running the following:
### Use a template
Kickstart your website creation with our ready-to-use templates. Choose a template that fits your needs, whether it's a documentation, a blog, or a complete website.
1. Choose a template:
- [Website Template](https://github.com/acid-info/logos-website-template)
- [Documentation Website Template](https://github.com/acid-info/logos-documentation-website-template)
- [Blog Template](https://github.com/acid-info/logos-blog-template)
2. Clone your selected template:
```bash
$ yarn
# Example: Create a website with a landing page
git clone https://github.com/acid-info/logos-homepage-template.git my-website && cd my-website
# Example: Create a documentation website
git clone https://github.com/acid-info/logos-documentation-website-template.git my-website && cd my-website
# Example: create a blog
git clone https://github.com/acid-info/logos-blog-template.git my-website && cd my-website
```
# Usage
Clone our ready-to-use [Docusaurus template](https://github.com/acid-info/logos-documentation-website-template).
# Development Guides
## Run locally
To make the development easier and to remove the need to locally link an external repository to the packages in this project, we've created a playground Docusaurus website which can be found in `packages/docusaurus-playground`.
[Lerna](https://lerna.js.org/) will handle linking the packages; however, if you want to use them in another project, you should use tools like [yarn link](https://classic.yarnpkg.com/en/docs/cli/link) or [yalc](https://github.com/wclr/yalc); but please be careful not to commit changes made by these tools.
1. Install dependencies and link packages together:
3. Install the dependencies:
```bash
$ yarn && yarn bootstrap
yarn install
```
2. Build packages:
4. Run your new website locally:
```bash
$ yarn build
# or build and watch for changes
$ yarn watch
yarn start
```
2. Start the playground website:
### Use with an existing Docusaurus website:
1. Install the [Logos Docusaurus preset](./packages/logos-docusaurus-preset/):
```bash
$ yarn start
yarn add @acid-info/logos-docusaurus-preset
```
## Versioning
2. Add the preset to your `docusaurus.config.js`:
We use semantic versioning; all you need to do is commit your changes and then run the following command:
```js
presets: [
[
'@acid-info/logos-docusaurus-preset',
/** @type {import('@acid-info/logos-docusaurus-preset').PluginOptions} */
({
businessUnit: 'Logos',
}),
],
],
```
### Use the playground
A playground located in the `packages/docusaurus-playground` of this repository can be used to test the plugins and themes locally.
1. Clone the repository:
```bash
$ yarn lerna version --no-private
git clone https://github.com/acid-info/logos-docusaurus-plugins.git
```
# Packages
2. Install the dependencies:
```bash
yarn install && yarn link
```
3. Run the playground:
```bash
yarn start
```
## Next steps
### Working on content
Our plugins work smoothly with standard Docusaurus features, which you can use to manage and organize content. Learn more on the [Docusaurus website](https://docusaurus.io/docs). For practical guidance on dealing with common use cases, visit our dedicated [Wiki pages](https://github.com/acid-info/logos-docusaurus-plugins/wiki).
### Configuration
While it's possible to install and configure our plugins and themes individually, we highly recommend using the [Logos Docusaurus preset](./packages/logos-docusaurus-preset/) for a simplified installation. This preset establishes a default configuration for the plugins and theme and automatically incorporates essential website metadata, logos, and favicons for the selected business unit. For detailed configuration information, please refer to the README file of each package.
### Become a contributor
We welcome any kind of contribution, such as reporting issues, suggesting features, writing documentation or fixing bugs. Please read our [contributing guidelines](./CONTRIBUTING.md) on how to get started.
## Packages
- **Presets**
- [Logos Preset](./packages/logos-docusaurus-preset) [![Npm Version](https://img.shields.io/npm/v/@acid-info/logos-docusaurus-preset)](https://www.npmjs.com/package/@acid-info/logos-docusaurus-preset)
- [Logos Preset](./packages/logos-docusaurus-preset) - A Docusaurus preset for Logos websites.
[![Npm Version](https://img.shields.io/npm/v/@acid-info/logos-docusaurus-preset)](https://www.npmjs.com/package/@acid-info/logos-docusaurus-preset)
- **Plugins**
- [Logos Search Local](./packages/logos-docusaurus-search-local) [![Npm Version](https://img.shields.io/npm/v/@acid-info/logos-docusaurus-search-local)](https://www.npmjs.com/package/@acid-info/logos-docusaurus-search-local)
- [Logos Search Local](./packages/logos-docusaurus-search-local) - Headless local search engine for Docusaurus.
[![Npm Version](https://img.shields.io/npm/v/@acid-info/logos-docusaurus-search-local)](https://www.npmjs.com/package/@acid-info/logos-docusaurus-search-local)
- [Docusaurus OG](./packages/docusaurus-og) [![Npm Version](https://img.shields.io/npm/v/@acid-info/docusaurus-og)](https://www.npmjs.com/package/@acid-info/docusaurus-og)
- [Docusaurus OG](./packages/docusaurus-og) - OpenGraph image generator for Docusaurus.
[![Npm Version](https://img.shields.io/npm/v/@acid-info/docusaurus-og)](https://www.npmjs.com/package/@acid-info/docusaurus-og)
- [Docusaurus Fathom](./packages/docusaurus-fathom) [![Npm Version](https://img.shields.io/npm/v/@acid-info/docusaurus-fathom)](https://www.npmjs.com/package/@acid-info/docusaurus-fathom)
- [Docusaurus Fathom](./packages/docusaurus-fathom) - Fathom Analytics plugin for Docusaurus.
[![Npm Version](https://img.shields.io/npm/v/@acid-info/docusaurus-fathom)](https://www.npmjs.com/package/@acid-info/docusaurus-fathom)
- **Themes**
- [Logos Theme](./packages/logos-docusaurus-theme) [![Npm Version](https://img.shields.io/npm/v/@acid-info/logos-docusaurus-theme)](https://www.npmjs.com/package/@acid-info/logos-docusaurus-theme)
- [Logos Theme](./packages/logos-docusaurus-theme) - A customized version of Docusaurus classic theme built with [LSD](https://github.com/acid-info/lsd).
[![Npm Version](https://img.shields.io/npm/v/@acid-info/logos-docusaurus-theme)](https://www.npmjs.com/package/@acid-info/logos-docusaurus-theme)
## License
TODO

1558
docs.json Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,48 @@
# Docusaurus Fathom Plugin
The Docusaurus Fathom Plugin seamlessly integrates your Docusaurus website with Fathom Analytics.
## Usage
1. Install the plugin:
```bash
yarn add @acid-info/docusaurus-fathom
# or
npm install @acid-info/docusaurus-fathom
```
2. Add the plugin to your `docusaurus.config.js`:
```javascript
plugins: [
[
'@acid-info/docusaurus-fathom',
{
siteId: 'your-site-id',
scriptUrl: 'https://your-fathom-instance.com/script.js',
hostnames: ['mywebsite.com', 'staging.mywebsite.com'],
},
],
]
```
## Configuration
**`siteId`**
- **Type**: `string` (required)
- **Description**: Your Fathom Analytics site ID.
**`scriptUrl`**
- **Type**: `string` (required)
- **Description**: this URL is used for downloading and injecting the Fathom script into your website.
**`hostnames`**
- **Type**: `string[]` (optional)
- **Default**: `[]`
- **Example**: `['mywebsite.com', 'staging.mywebsite.com']`
- **Description**: A whitelist of hostnames where the Fathom script will be loaded and pageview tracking will occur. If you want the plugin to work on any hostname, you can leave this option empty or omit it from the configuration.

View File

@ -0,0 +1,142 @@
# Docusaurus OG
Docusaurus OG enables you to automate the generation of custom OpenGraph (OG) images for your Docusaurus website, enhancing the visual representation of your content when shared on social media and other platforms.
This plugin leverages [Vercel's Satori](https://github.com/vercel/satori) to convert your HTML and CSS into images. It lets you define image renderers tailored to each Docusaurus content plugin, allowing you to create unique OG images for your website's content.
## Installation
To get started, simply follow these steps:
1. Install the plugin:
```bash
yarn add @acid-info/docusaurus-og
# or
npm install @acid-info/docusaurus-og
```
2. Integrate the plugin into your `docusaurus.config.js`:
```js
plugins: [
[
'@acid-info/docusaurus-og',
{
path: './preview-images', // relative to the build directory
imageRenderers: {},
},
],
]
```
3. Define your image renderers for the content plugins of your choice. Here's an example:
```js
imageRenderers: {
'docusaurus-plugin-content-docs': require('./lib/ImageRenderers').docs,
'docusaurus-plugin-content-pages': require('./lib/ImageRenderers').pages,
'docusaurus-plugin-content-blog': require('./lib/ImageRenderers').blog,
}
```
## Create an Image Renderer
An image renderer is a function that receives a `data` object representing page data and a `context` object representing the Docusaurus context. This function returns HTML or JSX content, which serves as input for Satori, the image generation tool. Satori processes this content to produce the corresponding OpenGraph image.
For example, here's an image renderer for the `@docusaurus/plugin-content-docs` plugin:
```tsx
// src/ImageRenderers.tsx
import type { DocsPageData, ImageRenderer } from '@acid-info/docusaurus-og'
import { readFileSync } from 'fs'
import { join } from 'path'
import React from 'react'
export const docs: ImageRenderer<DocsPageData> = (data, context) => [
<div style={{ display: 'flex', background: 'black', color: 'white' }}>
{data.metadata.title}
</div>,
{
width: 1200,
height: 630,
fonts: [
{
name: 'Inter',
data: readFileSync(
join(__dirname, '../../static/Inter/Inter-Regular.ttf'),
),
weight: 400,
style: 'normal',
},
],
},
]
```
### JSX Support
If you wish to use JSX within your image renderer, you'll need to compile your code to JavaScript. Here's a TypeScript example:
1. Create a `tsconfig.client.json` file in your project root to compile your `src` directory:
```json
// tsconfig.client.json
{
"compilerOptions": {
"noEmit": false,
"composite": true,
"incremental": true,
"esModuleInterop": true,
"tsBuildInfoFile": "./lib/.tsbuildinfo-client",
"rootDir": "src",
"outDir": "lib",
"module": "CommonJS",
"target": "esnext",
"jsx": "react",
"types": ["node"],
"baseUrl": "./",
"lib": ["DOM"]
},
"include": ["src"]
}
```
2. Add `prestart` and `prebuild` scripts to your `package.json`:
```json
// package.json
{
"scripts": {
"prestart": "tsc --project tsconfig.client.json",
"prebuild": "tsc --project tsconfig.client.json"
}
}
```
3. Exclude the `lib` directory from your version control by adding it to your `.gitignore` file:
```bash
echo "lib" >> .gitignore
```
4. Import your image renderer from the `lib` directory:
```js
plugins: [
[
'@acid-info/docusaurus-og',
{
path: './preview-images', // relative to the build directory
imageRenderers: {
'docusaurus-plugin-content-docs': require('./lib/ImageRenderers').docs,
'docusaurus-plugin-content-pages': require('./lib/ImageRenderers')
.pages,
'docusaurus-plugin-content-blog': require('./lib/ImageRenderers').blog,
},
},
],
]
```

View File

@ -0,0 +1,210 @@
- [Overview](#overview)
- [Installation](#installation)
- [Configuration](#configuration)
- [Website Configuration](#website-configuration)
- [Custom Website Settings](#custom-website-settings)
- [Supported Themes](#supported-themes)
- [OpenGraph Image Generator](#opengraph-image-generator)
- [Local Search](#local-search)
- [Docs Plugin](#docs-plugin)
- [Pages Plugin](#pages-plugin)
- [Blog Plugin](#blog-plugin)
## Overview
The Logos Docusaurus preset simplifies the creation of Docusaurus websites with the Logos theme and plugins, tailored to your business unit. This preset offers:
- A stunning and responsive Logos theme that showcases your brand identity and content.
- A local search feature for quick and easy information retrieval.
- An OpenGraph image generator for captivating social media sharing.
- Pre-configured website setup, including metadata, logos, and favicons for your business unit.
## Installation
1. Install the [Logos Docusaurus preset](./packages/logos-docusaurus-preset/):
```bash
yarn add @acid-info/logos-docusaurus-preset
```
2. Add the preset to your `docusaurus.config.js`:
```js
presets: [
[
'@acid-info/logos-docusaurus-preset',
/** @type {import('@acid-info/logos-docusaurus-preset').PluginOptions} */
({
businessUnit: 'Logos',
}),
],
],
```
## Configuration
### Website Configuration
This preset provides a set of predefined website settings and assets for each of Logos business units. You can select your business unit of choice, and the preset will automatically apply the relevant settings and assets to your website.
To use this feature, add the preset to your docusaurus.config.js file as shown below:
```js
// docusaurus.config.js
[
'@acid-info/logos-docusaurus-preset',
/** @type {import('@acid-info/logos-docusaurus-preset').PluginOptions} */
({
businessUnit: 'Logos',
}),
],
```
Possible options for `businessUnit` include:
- `Logos`
- `Codex`
- `Waku`
- `Nimbus`
- `Nomos`
- `VacResearch`
- `Acid.info`
#### Custom Website Settings
The preset overrides certain website settings in your docusaurus.config.js file. These settings include:
`title`
`tagline`
`url`
`favicon`
`onBrokenLinks`
`onBrokenMarkdownLinks`
By default, the preset sets these values to be specific to your chosen business unit. You can find the default values for each business unit in the [site-config](./src/site-config/) directory.
If you wish to retain your own custom settings, you can set the `customSiteConfig` option to `true` in your configuration:
```js
// docusaurus.config.js
title: "Custom Title",
tagline: "Custom Tagline",
url: "https://custom.url",
favicon: "img/favicon.ico",
onBrokenLinks: "throw",
onBrokenMarkdownLinks: "warn",
presets: [
[
'@acid-info/logos-docusaurus-preset',
/** @type {import('@acid-info/logos-docusaurus-preset').PluginOptions} */
({
businessUnit: 'Logos',
customSiteConfig: true
}),
],
],
```
### Supported Themes
You have the flexibility to choose the theme that best suits your website. The Logos Docusaurus preset supports the following themes:
`default` - Logos theme (default and recommended)
`docusaurus-default` - Docusaurus classic theme
Example:
```js
// docusaurus.config.js
presets: [
[
'@acid-info/logos-docusaurus-preset',
/** @type {import('@acid-info/logos-docusaurus-preset').PluginOptions} */
({
businessUnit: 'Logos',
theme: {
name: 'default',
options: {
// theme options
}
}
}),
],
],
```
For theme configuration options:
- **Logos Theme Options**: Please refer to the [Logos theme documentation](../logos-docusaurus-theme/README.md#theme-options)
- **Docusaurus Classic Theme Options**: Please refer to the [Docusaurus documentation](https://docusaurus.io/docs/api/themes/@docusaurus/theme-classic#configuration).
### OpenGraph Image Generator
The Logos Docusaurus preset includes the [Docusaurus OG](../docusaurus-og/) plugin, which enables you to create visually appealing OpenGraph images for your website's pages. These images are essential for making your content stand out when shared on social media platforms.
To activate the OpenGraph image generator, you can include the `og` option in the preset settings in your `docusaurus.config.js`:
```js
// docusaurus.config.js
presets: [
[
'@acid-info/logos-docusaurus-preset',
/** @type {import('@acid-info/logos-docusaurus-preset').PluginOptions} */
({
businessUnit: 'Logos',
og: {
path: '_og' // optional; defaults to '_og' (relative to the .docusaurus directory)
}
}),
],
],
```
> [!WARNING]
> The Logos Docusaurus preset includes the [Docusaurus OG](../docusaurus-og/) plugin, which is designed for compatibility with the Logos theme. If you prefer using the Docusaurus classic theme or a custom theme, you'll need to create your own image renderer. For detailed instructions on how to create an image renderer for Docusaurus, please refer to [this guide](../docusaurus-og/).
> [!NOTE]
> For in-depth insights into the generation of OpenGraph images, utilizing custom images, and disabling the plugin for specific pages, please visit [this page](../logos-docusaurus-theme/README.md#opengraph-image-generator).
### Local Search
The Logos Docusaurus preset also includes the [@acid-info/docusaurus-search-local](../docusaurus-search-local/) plugin, providing an essential feature for your website—local search. With local search, your users can quickly and efficiently find relevant information directly on your website.
You can customize the behavior of the search feature by adding the `localSearch` option to the preset settings in your `docusaurus.config.js`:
```js
presets: [
[
'@acid-info/logos-docusaurus-preset',
/** @type {import('@acid-info/logos-docusaurus-preset').PluginOptions} */
({
businessUnit: 'Logos',
localSearch: {
singleIndex: true, // optional; defaults to false - if true, user can search across all Docusaurus plugin instances
}
}),
],
],
```
To learn more on how the plugin works, please visit the [plugin documentation](../docusaurus-search-local/README.md).
### Docs Plugin
The Docs plugin (Official Docusaurus Docs Plugin) is enabled by default and simplifies the creation and management of documentation on your website. To disable this plugin, set `docs` to `false` in your preset configuration.
For detailed configuration and usage guidance, refer to the [official Docusaurus Docs plugin documentation](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-content-docs).
### Pages Plugin
The Pages plugin (Official Docusaurus Pages Plugin) is enabled by default and offers versatility when creating standalone pages on your website. To disable this plugin, set `pages` to `false` in your preset configuration.
For detailed configuration and usage guidance, refer to the [official Docusaurus Pages plugin documentation](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-content-pages).
### Blog Plugin
The Blog plugin (Official Docusaurus Blog Plugin) is enabled by default, making it easy to add a blog section to your website. To disable this plugin, set `blog` to `false` in your preset configuration.
For configuration and usage instructions, refer to the [official Docusaurus Blog plugin documentation](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-content-blog).

View File

@ -0,0 +1,3 @@
# Docusaurus Local Search
TODO.

View File

@ -0,0 +1,432 @@
### AppCard
A card component for displaying information about an app.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | -------------- | -------- | ------- | ------------------------------------------- |
| logoSrc | string | false | | The source URL for the light logo image |
| logoSrcDark | string | false | | The source URL for the dark logo image |
| name | ReactReactNode | false | | The name of the app |
| description | ReactReactNode | false | | The description of the app |
| link | string | false | | The URL to link to when the card is clicked |
| linkLabel | string | false | | The label for the link to the app |
**Example usage:**
```jsx
import { AppCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<AppCard
name="Status"
link="https://status.im"
linkLabel="Visit Status"
logoSrc="/img/status-mark-white.svg"
description="Waku powers many of the Status super app's features, including its private messaging."
/>
```
**Grid example:**
```jsx
import {
Grid,
AppCard,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Grid xs={{ cols: 1, wrap: true, gap: '0 1rem' }} lg={{ cols: 2 }}>
<Grid.Item xs={1}>
<AppCard
name="Status"
description="Waku powers many of the Status super app's features, including its private messaging."
logoSrc="/img/status-mark-black.svg"
logoSrcDark="/img/status-mark-white.svg"
link="https://status.im"
/>
</Grid.Item>
<Grid.Item xs={1}>
<AppCard
name="Status"
description="Waku powers many of the Status super app's features, including its private messaging."
logoSrc="/img/status-mark-black.svg"
logoSrcDark="/img/status-mark-white.svg"
link="https://status.im"
/>
</Grid.Item>
</Grid>
```
### Box
A box component that can be used to add top and bottom margins with breakpoints.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------- | ---------------------------------- | -------- | ------- | ----------- |
| top | BreakpointsStyle<number> \| number | false | 0 | |
| bottom | BreakpointsStyle<number> \| number | false | 0 | |
| style | undefined | false | {} | undefined |
```tsx
import { Box } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Box top={{ xs: 10, md: 20 }} bottom={30}>
<p>This is some content inside the box.</p>
</Box>
```
### CallToActionButton
A call-to-action button that can be used in MDX pages.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------- | ---------------------- | -------- | -------- | --------------------------------------------- | ---------------------- |
| href | string | false | | The URL to link to when the button is clicked |
| size | 'small' \| 'medium' | 'large' | false | 'large' | The size of the button |
| variant | ButtonProps['variant'] | false | 'filled' | The variant of the button |
```jsx
import { CallToActionButton } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<CallToActionButton
href="https://discord.gg/server"
size="large"
variant="filled"
>
Join our community
</CallToActionButton>
```
### CallToActionSection
A call-to-action section component that can be used in MDX pages.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | ----------------------------------- | -------- | ---------- | --------------------------------------------------------- |
| title | ReactReactNode | false | | The title of the section |
| description | ReactReactNode | false | | The description of the section |
| columns | 1 \| 2 | false | 1 | The number of columns to display the content in |
| href | string | false | | The URL to link to when the button is clicked |
| label | string | false | | The label to display on the button |
| target | ReactAnchorHTMLAttributes['target'] | false | | The target attribute for the link e.g., `_self`, `_blank` |
| variant | ButtonProps['variant'] | false | 'outlined' | The variant of the button |
| list | Array | false | [] | A list of items to display in the section |
```tsx
import { CallToActionSection } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<CallToActionSection
title="Logos Network State"
columns={1}
description="Waku is powering the communication layer of the Logos Network State. Logos is a grassroots movement to provide trust-minimised, corruption-resistant governing services and social institutions to peaceful people worldwide. Learn more about our ambitious vision."
label="Explore Logos"
href="https://logos.co/"
target="_blank"
/>
```
With a list:
```tsx
import { CallToActionSection } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<CallToActionSection
title="Run Nimbus in one of three setups"
description={
<>
Follow the detailed
<br />
step-by-step guide here
</>
}
list={[
{
title: 'Simple setup',
description:
'Run integrated Nimbus Beacon Node and Validator Client together.',
},
{
title: 'Use Nimbus Beacon node',
description:
'Run Nimbus Beacon Node with an alternative validator client.',
},
{
title: 'Use Nimbus Validator client',
description:
'Run Nimbus Validator Client with an alternative Beacon Node',
},
]}
label="Get Nimbus"
target="_blank"
href="https://nimbus.guide/quick-start.html"
/>
```
### FeatureList
A component that displays a list of features with titles and descriptions.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------- | ----------------- | -------- | ---------- | ------------------------------------------------- |
| title | ReactReactNode | false | 'Features' | The title of the feature list. |
| features | Array | false | [] | An array of features to be displayed in the list. |
| alignment | 'bottom' \| 'top' | false | 'bottom' | The vertical alignment of feature description. |
```tsx
import { FeatureList } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<FeatureList
title="Features"
alignment="top"
features={[
{ title: 'Feature 1', description: 'Description of feature 1' },
{ title: 'Feature 2', description: 'Description of feature 2' },
{ title: 'Feature 3', description: 'Description of feature 3' },
]}
>
<CallToActionButton variant="outlined" href="/about/" target="_self">
Read More
</CallToActionButton>
</FeatureList>
```
### Hero
A hero component that displays a large banner at the top of a page.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------- | ------------------- | -------- | ------- | ----------- | --- |
| size | 'large' \| 'medium' | 'small' | false | 'medium' | |
```tsx
import {
Hero,
HeroTitle,
HeroDescription,
HeroVideo,
HeroActions,
HeroAction,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Hero size="large">
<HeroInfo>
<HeroTitle>
{'Light and Performant Clients, for All Ethereum Validators'}
</HeroTitle>
<HeroDescription>
{
'Ethereum validators of all sizes trust Nimbus to run their nodes. From large node operators, to solo stakers on a Raspberry Pi.'
}
</HeroDescription>
<HeroActions>
<HeroAction
variant="outlined"
href="https://nimbus.guide/quick-start.html"
target="_blank"
>
Get Nimbus
</HeroAction>
</HeroActions>
</HeroInfo>
<HeroVideo
placeholderSrc="/hero/halo01-1080x1080-placeholder.png"
desktop={{ scale: '1.514792899' }}
mobile={{ scale: '1.514792899' }}
>
<source
src="/hero/halo01-2048x2048-24fps-1M.mov"
type='video/mp4; codecs="hvc1"'
/>
<source src="/hero/halo01-2048x2048-24fps-1M.webm" type="video/webm" />
</HeroVideo>
</Hero>
```
### PageCard
A card component used in Docusaurus auto-generated category index pages to display page links.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | -------------- | -------- | ------------------------------ | ----------- |
| title | ReactReactNode | false | | |
| description | ReactReactNode | false | | |
| icon | ReactReactNode | false | <FolderIcon color="primary" /> | |
| target | undefined | false | '\_self' | undefined |
```tsx
import { PageCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<PageCard
title="Sample Page"
description="This is a sample page description."
href="/sample-page"
/>
```
### ProfileCard
A component used to display team members' profiles, including their name, avatar, and social links.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------------- | ------ | -------- | ------- | ----------- |
| imgSrc | string | false | | |
| name | string | false | | |
| githubUsername | string | false | | |
| githubLink | string | false | | |
| discordUsername | string | false | | |
| discordLink | string | false | | |
```tsx
import { ProfileCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<ProfileCard
imgSrc="/path/to/profile-image.jpg"
name="John Doe"
githubUsername="johndoe"
githubLink="https://github.com/johndoe"
discordUsername="johndoe#1234"
discordLink="https://discordapp.com/users/johndoe"
/>
```
Example usage of ProfileCard within a grid:
```tsx
import {
Grid,
ProfileCard,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Grid
xs={{ cols: 3, gap: '1rem', wrap: false }}
md={{ cols: 4, gap: '1rem', wrap: true }}
>
<Grid.Item>
<ProfileCard
name="Name"
githubUsername="Github"
githubLink="https://github.com/"
discordUsername="Discord"
discordLink="https://discord.gg/"
/>
</Grid.Item>
Add more ProfileCard items within the grid
</Grid>
```
### SocialCard
A component used for displaying social media or community platform cards with a logo and description.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | -------------- | -------- | ------- | ----------------------------------------------------------------------------------- |
| logoSrc | string | false | | The URL of the logo image for the social media or community platform (light theme). |
| logoSrcDark | string | false | | The URL of the logo image for the social media or community platform (dark theme). |
| description | ReactReactNode | false | | The description or content associated with the social media or community platform. |
```tsx
import { SocialCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<SocialCard
title="Telegram Community"
logoSrc="/path/to/telegram-logo.png"
description="Join our Telegram community to stay updated and chat with fellow members."
href="https://t.me/your-telegram-community"
/>
```
Grid example:
```tsx
import {
Box,
Grid,
SocialCard,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Box top={56} bottom={56}>
<Grid xs={{ cols: 1, gap: '1rem' }} md={{ cols: 2 }}>
<Grid.Item xs={1}>
<SocialCard
href="https://twitter.com/twitter-handle"
logoSrcDark="/icons/x.svg"
description="Follow us on X"
/>
</Grid.Item>
<Grid.Item xs={1}>
<SocialCard
href="https://discord.gg/discord-server"
logoSrcDark="/icons/discord-white.svg"
description="Join the community on Discord"
/>
</Grid.Item>
</Grid>
</Box>
```
### TimelineItem
A component for displaying roadmap items, such as events or milestones, in a timeline layout.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | ------------------- | -------- | ------- | ---------------------------------------------------------------------------------------- | -------------------------------------- |
| index | ReactReactNode | true | | The index or label of the timeline item. |
| alignment | 'top' \| 'bottom' | false | 'top' | The alignment of the timeline item, either 'top' or 'bottom'. (Optional, default: 'top') |
| period | ReactReactNode | true | | The period or time frame associated with the timeline item. e.g., `2023 Q3` |
| description | ReactReactNode | true | | The description or content of the timeline item. |
| borderStyle | 'solid' \| 'dashed' | 'none' | false | | The border style for the timeline item |
Roadmap example:
```tsx
import {
Box,
Grid,
TimelineItem,
SectionHeader,
CallToActionButton,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Box top={{ xs: 144, lg: 216 }}>
<SectionHeader
title="Roadmap"
description="Roadmap description"
bottom={{ xs: '4rem', lg: '7.25rem' }}
/>
<Grid
xs={{ cols: 6, wrap: false, gap: '0 1rem' }}
actions={
<CallToActionButton
style={{ marginTop: 0 }}
size="small"
variant="outlined"
href="/about"
>
Read more
</CallToActionButton>
}
>
<Grid.Item>
<TimelineItem
index={0}
period="2013"
borderStyle="solid"
description="First item"
/>
</Grid.Item>
Add more items here
<Grid.Item>
<TimelineItem
index={10}
period="2024+"
borderStyle="none"
description="Last item"
/>
</Grid.Item>
</Grid>
</Box>
```

View File

@ -0,0 +1,635 @@
- [Logos Docusaurus Theme](#logos-docusaurus-theme)
- [Installation](#installation)
- [Using the Logos Docusaurus Preset (Recommended)](#using-the-logos-docusaurus-preset-recommended)
- [Standalone Installation](#standalone-installation)
- [Theme Options](#theme-options)
- [Customization Guides](#customization-guides)
- [Customizing the Footer Links](#customizing-the-footer-links)
- [OpenGraph Image Generator](#opengraph-image-generator)
- [How the Renderer Works:](#how-the-renderer-works)
- [Using a Custom Image:](#using-a-custom-image)
- [How to Disable the Image Generator for a Specific Page:](#how-to-disable-the-image-generator-for-a-specific-page)
- [MDX Components](#mdx-components)
- [AppCard](#appcard)
- [Box](#box)
- [CallToActionButton](#calltoactionbutton)
- [CallToActionSection](#calltoactionsection)
- [FeatureList](#featurelist)
- [Hero](#hero)
- [PageCard](#pagecard)
- [ProfileCard](#profilecard)
- [SocialCard](#socialcard)
- [TimelineItem](#timelineitem)
# Logos Docusaurus Theme
The Logos theme is a Docusaurus theme tailored for Logos websites built with [LSD](https://github.com/acid-info/lsd), designed to align with Logos branding guidelines.
## Installation
### Using the Logos Docusaurus Preset (Recommended)
The recommended way to install the Logos Docusaurus Theme is by utilizing the Logos Docusaurus Preset. The preset simplifies the installation process by injecting essential assets, data, and configurations to ensure the theme functions seamlessly.
To install the Logos Docusaurus Preset, please refer to the [Logos Docusaurus Preset Installation Instructions](../logos-docusaurus-preset/README.md#installation).
### Standalone Installation
If you prefer to install the Logos Docusaurus Theme on its own without the entire preset, follow these steps:
> [!WARN]
> The theme was primarily designed to work seamlessly with the Logos Docusaurus Preset. Standalone installations may not provide the expected functionality.
1. Install the theme:
```bash
yarn add @acid-info/logos-docusaurus-theme
# or
npm i @acid-info/logos-docusaurus-theme
```
2. Add the Logos theme to your `docusaurus.config.js` file. Here's an example:
```js
// docusaurus.config.js
module.exports = {
// ...
themes: [
[
'@acid-info/logos-docusaurus-theme',
/** @type {import('@acid-info/logos-docusaurus-theme').ThemeOptions} */
(
{
// theme options
}
),
],
],
}
```
## Theme Options
**`customCss`**
- _Type_: `string[] | string`
- _Default_: `[]`
- _Description_: The `customCss` option allows you to specify the path of custom CSS files to be added to your website. For more details, refer to the [Docusaurus documentation](https://docusaurus.io/docs/api/themes/@docusaurus/theme-classic#configuration).
**`typography`**
- _Type_: `Object`
- _Default_: `{ genericFontFamily: 'sans-serif' }`
- _Description_: The `typography` option allows you to define global typography styles applied to your website. Here are the available settings:
- - `genericFontFamily`: Choose from `'sans-serif'`, `'serif'`, or `'monospace'` to set the default typeface of your website.
**`docs`**
- _Type_: `Object`
- _Default_: `{}`
- _Description_: The `docs` option is used to configure how the Logos theme behaves on all documentation pages of a specific `@docusaurus/plugin-content-docs` plugin instance. Each plugin instance has a unique ID, which you can use as the key in a map. The value of each key represents the options for that plugin instance. The following option is available:
- `sidebar.hide`: Set this value to `true` to hide the navigation sidebar on all pages of the specified plugin instance. This can be useful when you want to create root pages like `/terms` and avoid displaying the sidebar for a cleaner and more focused layout on those specific pages.
Here's a full example of how to configure the `default` theme in your `docusaurus.config.js`:
```javascript
// docusaurus.config.js
{
name: 'default',
options: {
customCss: [require.resolve('./src/css/custom.scss')],
typography: {
genericFontFamily: 'monospace' // sets the default typeface of your website to monospace
},
docs: {
// the key is the ID of the plugin instance
default: {
sidebar: {
hide: true // hides the navigation sidebar on all pages of the default plugin instance
}
}
}
}
}
```
## Customization Guides
### Customizing the Footer Links
When customizing the footer links in your Docusaurus website, it's essential to understand the theme's predefined structure for organizing these links. The footer is divided into groups, and each group contains a simple list of items. Each group of links will be displayed as a row of links in the footer. Here's an example of the structure you can use in your `docusaurus.config.js` (`themeConfig` section):
```js
// docusaurus.config.js (themeConfig)
footer: {
links: [
{
items: [
{
href: 'https://twitter.com/handle',
label: 'Twitter',
},
{
href: 'https://discord.gg/server',
label: 'Discord',
},
{
href: '/',
label: 'Docs',
},
{
href: 'https://github.com/org-name',
label: 'Github',
},
],
},
{
items: [
{
href: '/',
label: 'Contact us',
},
{
href: '/jobs',
label: 'Work with us',
},
{
href: '/terms',
label: 'Privacy policy',
},
{
href: '/terms',
label: 'Terms & conditions',
},
],
},
],
}
```
## OpenGraph Image Generator
This theme provides an image renderer for the [Docusaurus OG](../docusaurus-og/) plugin, which enables you to automatically generate visually appealing OpenGraph images for your website's pages. These images are essential for making your content stand out when shared on social media platforms.
### How the Renderer Works:
The OpenGraph image generator in this theme works by automatically creating images based on the content and metadata of your website. It dynamically generates images for all of your website pages including blog posts. This ensures that when someone shares a link to your site, it will have an eye-catching image associated with it.
### Using a Custom Image:
By default, the renderer will embed your custom image within the generated OpenGraph image. This allows you to enhance your custom image with specific branding, logos, or additional information. To use a custom image, add the following frontmatter to the page's Markdown file:
```yaml
image: /path/to/custom-image.png
```
If you prefer to use your own image and disable the renderer, please see the next section.
### How to Disable the Image Generator for a Specific Page:
You can disable the image generator for a specific page by adding the following frontmatter to the page's Markdown file:
```yaml
og:image_generator: false
```
## MDX Components
Elevate your MDX-powered landing pages with our MDX components. Craft stunning Hero sections, showcase a list of features, entice visitors with diverse Call to Action sections, lay out your roadmap, introduce your dedicated team, and gather user endorsements for an engaging user experience.
### AppCard
A card component for displaying information about an app.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | -------------- | -------- | ------- | ------------------------------------------- |
| logoSrc | string | false | | The source URL for the light logo image |
| logoSrcDark | string | false | | The source URL for the dark logo image |
| name | ReactReactNode | false | | The name of the app |
| description | ReactReactNode | false | | The description of the app |
| link | string | false | | The URL to link to when the card is clicked |
| linkLabel | string | false | | The label for the link to the app |
**Example usage:**
```jsx
import { AppCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<AppCard
name="Status"
link="https://status.im"
linkLabel="Visit Status"
logoSrc="/img/status-mark-white.svg"
description="Waku powers many of the Status super app's features, including its private messaging."
/>
```
**Grid example:**
```jsx
import {
Grid,
AppCard,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Grid xs={{ cols: 1, wrap: true, gap: '0 1rem' }} lg={{ cols: 2 }}>
<Grid.Item xs={1}>
<AppCard
name="Status"
description="Waku powers many of the Status super app's features, including its private messaging."
logoSrc="/img/status-mark-black.svg"
logoSrcDark="/img/status-mark-white.svg"
link="https://status.im"
/>
</Grid.Item>
<Grid.Item xs={1}>
<AppCard
name="Status"
description="Waku powers many of the Status super app's features, including its private messaging."
logoSrc="/img/status-mark-black.svg"
logoSrcDark="/img/status-mark-white.svg"
link="https://status.im"
/>
</Grid.Item>
</Grid>
```
### Box
A box component that can be used to add top and bottom margins with breakpoints.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------- | ------------------------ | -------- | ------- | ----------- | --- |
| top | BreakpointsStyle<number> | number | false | 0 | |
| bottom | BreakpointsStyle<number> | number | false | 0 | |
| style | undefined | false | {} | undefined |
```tsx
import { Box } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Box top={{ xs: 10, md: 20 }} bottom={30}>
<p>This is some content inside the box.</p>
</Box>
```
### CallToActionButton
A call-to-action button that can be used in MDX pages.
**Props**
| Prop Name | Type | Required | Default | Description |
| -------------- | ---------------------- | -------- | -------- | --------------------------------------------- | ------- | ---------------------- |
| href | string | false | | The URL to link to when the button is clicked |
| size | 'small' | 'medium' | 'large' | false | 'large' | The size of the button |
| @type {'small' | 'medium' | 'large'} |
| variant | ButtonProps['variant'] | false | 'filled' | The variant of the button |
```jsx
import { CallToActionButton } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<CallToActionButton
href="https://discord.gg/server"
size="large"
variant="filled"
>
Join our community
</CallToActionButton>
```
### CallToActionSection
A call-to-action section component that can be used in MDX pages.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | ----------------------------------- | -------- | ---------- | --------------------------------------------------------- | ----------------------------------------------- |
| title | ReactReactNode | false | | The title of the section |
| description | ReactReactNode | false | | The description of the section |
| columns | 1 | 2 | false | 1 | The number of columns to display the content in |
| href | string | false | | The URL to link to when the button is clicked |
| label | string | false | | The label to display on the button |
| target | ReactAnchorHTMLAttributes['target'] | false | | The target attribute for the link e.g., `_self`, `_blank` |
| variant | ButtonProps['variant'] | false | 'outlined' | The variant of the button |
| list | Array | false | [] | A list of items to display in the section |
```tsx
import { CallToActionSection } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<CallToActionSection
title="Logos Network State"
columns={1}
description="Waku is powering the communication layer of the Logos Network State. Logos is a grassroots movement to provide trust-minimised, corruption-resistant governing services and social institutions to peaceful people worldwide. Learn more about our ambitious vision."
label="Explore Logos"
href="https://logos.co/"
target="_blank"
/>
```
With a list:
```tsx
import { CallToActionSection } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<CallToActionSection
title="Run Nimbus in one of three setups"
description={
<>
Follow the detailed
<br />
step-by-step guide here
</>
}
list={[
{
title: 'Simple setup',
description:
'Run integrated Nimbus Beacon Node and Validator Client together.',
},
{
title: 'Use Nimbus Beacon node',
description:
'Run Nimbus Beacon Node with an alternative validator client.',
},
{
title: 'Use Nimbus Validator client',
description:
'Run Nimbus Validator Client with an alternative Beacon Node',
},
]}
label="Get Nimbus"
target="_blank"
href="https://nimbus.guide/quick-start.html"
/>
```
### FeatureList
A component that displays a list of features with titles and descriptions.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------- | -------------- | -------- | ---------- | ------------------------------------------------- | ---------------------------------------------- |
| title | ReactReactNode | false | 'Features' | The title of the feature list. |
| features | Array | false | [] | An array of features to be displayed in the list. |
| alignment | 'bottom' | 'top' | false | 'bottom' | The vertical alignment of feature description. |
```tsx
import { FeatureList } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<FeatureList
title="Features"
alignment="top"
features={[
{ title: 'Feature 1', description: 'Description of feature 1' },
{ title: 'Feature 2', description: 'Description of feature 2' },
{ title: 'Feature 3', description: 'Description of feature 3' },
]}
>
<CallToActionButton variant="outlined" href="/about/" target="_self">
Read More
</CallToActionButton>
</FeatureList>
```
### Hero
A hero component that displays a large banner at the top of a page.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------- | ------- | -------- | ------- | ----------- | -------- | --- |
| size | 'large' | 'medium' | 'small' | false | 'medium' | |
```tsx
import {
Hero,
HeroTitle,
HeroDescription,
HeroVideo,
HeroActions,
HeroAction,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Hero size="large">
<HeroInfo>
<HeroTitle>
{'Light and Performant Clients, for All Ethereum Validators'}
</HeroTitle>
<HeroDescription>
{
'Ethereum validators of all sizes trust Nimbus to run their nodes. From large node operators, to solo stakers on a Raspberry Pi.'
}
</HeroDescription>
<HeroActions>
<HeroAction
variant="outlined"
href="https://nimbus.guide/quick-start.html"
target="_blank"
>
Get Nimbus
</HeroAction>
</HeroActions>
</HeroInfo>
<HeroVideo
placeholderSrc="/hero/halo01-1080x1080-placeholder.png"
desktop={{ scale: '1.514792899' }}
mobile={{ scale: '1.514792899' }}
>
<source
src="/hero/halo01-2048x2048-24fps-1M.mov"
type='video/mp4; codecs="hvc1"'
/>
<source src="/hero/halo01-2048x2048-24fps-1M.webm" type="video/webm" />
</HeroVideo>
</Hero>
```
### PageCard
A card component used in Docusaurus auto-generated category index pages to display page links.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | -------------- | -------- | ------------------------------ | ----------- |
| title | ReactReactNode | false | | |
| description | ReactReactNode | false | | |
| icon | ReactReactNode | false | <FolderIcon color="primary" /> | |
| target | undefined | false | '\_self' | undefined |
```tsx
import { PageCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<PageCard
title="Sample Page"
description="This is a sample page description."
href="/sample-page"
/>
```
### ProfileCard
A component used to display team members' profiles, including their name, avatar, and social links.
**Props**
| Prop Name | Type | Required | Default | Description |
| --------------- | ------ | -------- | ------- | ----------- |
| imgSrc | string | false | | |
| name | string | false | | |
| githubUsername | string | false | | |
| githubLink | string | false | | |
| discordUsername | string | false | | |
| discordLink | string | false | | |
```tsx
import { ProfileCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<ProfileCard
imgSrc="/path/to/profile-image.jpg"
name="John Doe"
githubUsername="johndoe"
githubLink="https://github.com/johndoe"
discordUsername="johndoe#1234"
discordLink="https://discordapp.com/users/johndoe"
/>
```
Example usage of ProfileCard within a grid:
```tsx
import {
Grid,
ProfileCard,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Grid
xs={{ cols: 3, gap: '1rem', wrap: false }}
md={{ cols: 4, gap: '1rem', wrap: true }}
>
<Grid.Item>
<ProfileCard
name="Name"
githubUsername="Github"
githubLink="https://github.com/"
discordUsername="Discord"
discordLink="https://discord.gg/"
/>
</Grid.Item>
Add more ProfileCard items within the grid
</Grid>
```
### SocialCard
A component used for displaying social media or community platform cards with a logo and description.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | -------------- | -------- | ------- | ----------------------------------------------------------------------------------- |
| logoSrc | string | false | | The URL of the logo image for the social media or community platform (light theme). |
| logoSrcDark | string | false | | The URL of the logo image for the social media or community platform (dark theme). |
| description | ReactReactNode | false | | The description or content associated with the social media or community platform. |
```tsx
import { SocialCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<SocialCard
title="Telegram Community"
logoSrc="/path/to/telegram-logo.png"
description="Join our Telegram community to stay updated and chat with fellow members."
href="https://t.me/your-telegram-community"
/>
```
Grid example:
```tsx
import {
Box,
Grid,
SocialCard,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Box top={56} bottom={56}>
<Grid xs={{ cols: 1, gap: '1rem' }} md={{ cols: 2 }}>
<Grid.Item xs={1}>
<SocialCard
href="https://twitter.com/twitter-handle"
logoSrcDark="/icons/x.svg"
description="Follow us on X"
/>
</Grid.Item>
<Grid.Item xs={1}>
<SocialCard
href="https://discord.gg/discord-server"
logoSrcDark="/icons/discord-white.svg"
description="Join the community on Discord"
/>
</Grid.Item>
</Grid>
</Box>
```
### TimelineItem
A component for displaying roadmap items, such as events or milestones, in a timeline layout.
**Props**
| Prop Name | Type | Required | Default | Description |
| ----------- | -------------- | -------- | ------- | --------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- | -------------------------------------- |
| index | ReactReactNode | true | | The index or label of the timeline item. |
| alignment | 'top' | 'bottom' | false | 'top' | The alignment of the timeline item, either 'top' or 'bottom'. (Optional, default: 'top') |
| period | ReactReactNode | true | | The period or time frame associated with the timeline item. e.g., `2023 Q3` |
| description | ReactReactNode | true | | The description or content of the timeline item. |
| borderStyle | 'solid' | 'dashed' | 'none' | false | | The border style for the timeline item |
Roadmap example:
```tsx
import {
Box,
Grid,
TimelineItem,
SectionHeader,
CallToActionButton,
} from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
;<Box top={{ xs: 144, lg: 216 }}>
<SectionHeader
title="Roadmap"
description="Roadmap description"
bottom={{ xs: '4rem', lg: '7.25rem' }}
/>
<Grid
xs={{ cols: 6, wrap: false, gap: '0 1rem' }}
actions={
<CallToActionButton
style={{ marginTop: 0 }}
size="small"
variant="outlined"
href="/about"
>
Read more
</CallToActionButton>
}
>
<Grid.Item>
<TimelineItem
index={0}
period="2013"
borderStyle="solid"
description="First item"
/>
</Grid.Item>
Add more items here
<Grid.Item>
<TimelineItem
index={10}
period="2024+"
borderStyle="none"
description="Last item"
/>
</Grid.Item>
</Grid>
</Box>
```

View File

@ -66,6 +66,9 @@
"@types/lodash": "^4.14.186",
"@types/mdx-js__react": "^1.5.5",
"@types/three": "^0.152.1",
"glob": "^10.3.10",
"react-docgen": "^7.0.0",
"react-docgen-markdown-renderer": "^2.1.3",
"sass": "^1.55.0",
"tsc-alias": "^1.7.0",
"tsc-watch": "^5.0.3"

View File

@ -0,0 +1,75 @@
import fsp from 'fs/promises'
import { glob } from 'glob'
import path from 'path'
const main = async () => {
const reactDocGen = await import('react-docgen')
const files = await glob(
path.resolve(__dirname, '../src/client/components/mdx/**/*.tsx'),
).then((filenames) =>
filenames.sort((a, b) => path.basename(a).localeCompare(path.basename(b))),
)
let markdown = ''
for (const file of files) {
try {
const raw = await fsp.readFile(file, 'utf-8')
const docs = reactDocGen.parse(raw, {
filename: path.basename(file),
})
for (const doc of docs) {
if (!doc.description) continue
markdown += `### ${doc.displayName}\n\n`
const lines = (doc.description || '').split('\n')
const exampleIndex = lines.findIndex(
(line) => line.match(/^@example.*/)?.[0],
)
const description = (
exampleIndex > -1 ? lines.slice(0, exampleIndex) : lines
).join('\n')
markdown += `${description}\n`
if (doc.props) {
markdown += '**Props**\n\n'
markdown +=
'| Prop Name | Type | Required | Default | Description |\n'
markdown += '| --- | --- | --- | --- | --- |\n'
for (const propName in doc.props) {
const prop = doc.props[propName]
if (!prop) continue
markdown += `| ${propName} | ${
prop.tsType?.name === 'union'
? (prop.tsType.raw || '').replace('|', '\\|')
: prop.tsType?.name
} | ${prop.required} | ${
prop.defaultValue ? prop.defaultValue.value : ''
} | ${prop.description} |\n`
}
markdown += '\n\n'
}
if (exampleIndex > -1) {
markdown += '\n'
markdown += lines.slice(exampleIndex + 1).join('\n')
}
markdown += '\n\n'
}
} catch (error) {
console.log('failed to parse ' + file)
}
}
await fsp.writeFile(path.join(__dirname, '../COMPONENTS.MD'), markdown)
}
main()

View File

@ -5,14 +5,75 @@ import React from 'react'
import './AppCard.scss'
export type AppCardProps = React.HTMLProps<HTMLDivElement> & {
/**
* The source URL for the light logo image
*/
logoSrc?: string
/**
* The source URL for the dark logo image
*/
logoSrcDark?: string
/**
* The name of the app
*/
name?: React.ReactNode
/**
* The description of the app
*/
description?: React.ReactNode
/**
* The URL to link to when the card is clicked
*/
link?: string
/**
* The label for the link to the app
*/
linkLabel?: string
}
/**
* A card component for displaying information about an app.
*
* @example
* **Example usage:**
* ```jsx
* import { AppCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
*
* <AppCard
* name="Status"
* link="https://status.im"
* linkLabel="Visit Status"
* logoSrc="/img/status-mark-white.svg"
* description="Waku powers many of the Status super app's features, including its private messaging."
* />
* ```
*
* **Grid example:**
* ```jsx
* import { Grid, AppCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
*
* <Grid xs={{ cols: 1, wrap: true, gap: "0 1rem" }} lg={{ cols: 2 }}>
* <Grid.Item xs={1}>
* <AppCard
* name="Status"
* description="Waku powers many of the Status super app's features, including its private messaging."
* logoSrc="/img/status-mark-black.svg"
* logoSrcDark="/img/status-mark-white.svg"
* link="https://status.im"
* />
* </Grid.Item>
* <Grid.Item xs={1}>
* <AppCard
* name="Status"
* description="Waku powers many of the Status super app's features, including its private messaging."
* logoSrc="/img/status-mark-black.svg"
* logoSrcDark="/img/status-mark-white.svg"
* link="https://status.im"
* />
* </Grid.Item>
* </Grid>
* ```
*/
export const AppCard: React.FC<AppCardProps> = ({
logoSrc,
logoSrcDark,

View File

@ -42,6 +42,16 @@ export type BoxProps = React.HTMLAttributes<HTMLDivElement> & {
bottom?: BreakpointsStyle<number> | number
}
/**
* A box component that can be used to add top and bottom margins with breakpoints.
* @example
* ```tsx
* import { Box } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
* <Box top={{ xs: 10, md: 20 }} bottom={30}>
* <p>This is some content inside the box.</p>
* </Box>
* ```
*/
export const Box: React.FC<BoxProps> = ({
top = 0,
bottom = 0,

View File

@ -5,11 +5,32 @@ import React from 'react'
import './CallToActionButton.scss'
export type CallToActionButtonProps = Props & {
/**
* The URL to link to when the button is clicked
*/
href?: string
size?: ButtonProps['size']
/**
* The size of the button
*/
size?: 'small' | 'medium' | 'large'
/**
* The variant of the button
*/
variant?: ButtonProps['variant']
}
/**
* A call-to-action button that can be used in MDX pages.
*
* @example
* ```jsx
* import { CallToActionButton } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <CallToActionButton href="https://discord.gg/server" size="large" variant="filled">
* Join our community
* </CallToActionButton>
* ```
*/
export const CallToActionButton: React.FC<CallToActionButtonProps> = ({
className,
variant = 'filled',

View File

@ -4,23 +4,104 @@ import React from 'react'
import { CallToActionButton } from '../index'
import './CallToActionSection.scss'
/**
* Props for the CallToActionSection component
*/
export type CallToActionSectionProps = Omit<
React.HTMLAttributes<HTMLDivElement>,
'title'
> & {
/**
* The title of the section
*/
title?: React.ReactNode
/**
* The description of the section
*/
description?: React.ReactNode
/**
* The number of columns to display the content in
*/
columns?: 1 | 2
/**
* The URL to link to when the button is clicked
*/
href?: string
/**
* The label to display on the button
*/
label?: string
/**
* The target attribute for the link e.g., `_self`, `_blank`
*/
target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target']
/**
* The variant of the button
*/
variant?: ButtonProps['variant']
/**
* A list of items to display in the section
*/
list?: {
/**
* The title of the list item
*/
title: React.ReactNode
/**
* The description of the list item
*/
description: React.ReactNode
}[]
}
/**
* A call-to-action section component that can be used in MDX pages.
*
* @example
* ```tsx
* import { CallToActionSection } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <CallToActionSection
* title="Logos Network State"
* columns={1}
* description="Waku is powering the communication layer of the Logos Network State. Logos is a grassroots movement to provide trust-minimised, corruption-resistant governing services and social institutions to peaceful people worldwide. Learn more about our ambitious vision."
* label="Explore Logos"
* href="https://logos.co/"
* target="_blank"
* />
* ```
*
* With a list:
* ```tsx
* import { CallToActionSection } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <CallToActionSection
* title="Run Nimbus in one of three setups"
* description={
* <>
* Follow the detailed<br/>step-by-step guide here
* </>
* }
* list={[
* {
* title: "Simple setup",
* description: "Run integrated Nimbus Beacon Node and Validator Client together."
* },
* {
* title: "Use Nimbus Beacon node",
* description: "Run Nimbus Beacon Node with an alternative validator client."
* },
* {
* title: "Use Nimbus Validator client",
* description: "Run Nimbus Validator Client with an alternative Beacon Node"
* }
* ]}
* label="Get Nimbus"
* target="_blank"
* href="https://nimbus.guide/quick-start.html"
* />
* ```
*/
export const CallToActionSection: React.FC<CallToActionSectionProps> = ({
label,
href,

View File

@ -12,11 +12,42 @@ export type FeatureListProps = Omit<
React.HTMLAttributes<HTMLDivElement>,
'title'
> & {
/**
* The title of the feature list.
*/
title?: React.ReactNode
/**
* An array of features to be displayed in the list.
*/
features?: Feature[]
/**
* The vertical alignment of feature description.
*/
alignment?: 'bottom' | 'top'
}
/**
* A component that displays a list of features with titles and descriptions.
*
* @example
* ```tsx
* import { FeatureList } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
*
* <FeatureList
* title="Features"
* alignment="top"
* features={[
* { title: 'Feature 1', description: 'Description of feature 1' },
* { title: 'Feature 2', description: 'Description of feature 2' },
* { title: 'Feature 3', description: 'Description of feature 3' },
* ]}
* >
* <CallToActionButton variant="outlined" href="/about/" target="_self">
* Read More
* </CallToActionButton>
* </FeatureList>
* ```
*/
export const FeatureList: React.FC<FeatureListProps> = ({
title = 'Features',
alignment = 'bottom',

View File

@ -7,6 +7,46 @@ export type HeroProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> & {
size?: 'large' | 'medium' | 'small'
}
/**
* A hero component that displays a large banner at the top of a page.
*
* @example
* ```tsx
* import {
* Hero,
* HeroTitle,
* HeroDescription,
* HeroVideo,
* HeroActions,
* HeroAction,
* } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
*
* <Hero size="large">
* <HeroInfo>
* <HeroTitle>
* {'Light and Performant Clients, for All Ethereum Validators'}
* </HeroTitle>
* <HeroDescription>
* {'Ethereum validators of all sizes trust Nimbus to run their nodes. From large node operators, to solo stakers on a Raspberry Pi.'}
* </HeroDescription>
* <HeroActions>
* <HeroAction variant="outlined" href="https://nimbus.guide/quick-start.html" target="_blank">
* Get Nimbus
* </HeroAction>
* </HeroActions>
* </HeroInfo>
*
* <HeroVideo
* placeholderSrc="/hero/halo01-1080x1080-placeholder.png"
* desktop={{ scale: "1.514792899" }}
* mobile={{ scale: "1.514792899" }}
* >
* <source src="/hero/halo01-2048x2048-24fps-1M.mov" type='video/mp4; codecs="hvc1"' />
* <source src="/hero/halo01-2048x2048-24fps-1M.webm" type="video/webm" />
* </HeroVideo>
* </Hero>
* ```
*/
export const Hero: React.FC<HeroProps> = ({
size = 'medium',
className,

View File

@ -10,6 +10,20 @@ export type PageCardProps = Omit<LinkProps, 'title'> & {
icon?: React.ReactNode
}
/**
* A card component used in Docusaurus auto-generated category index pages to display page links.
*
* @example
* ```tsx
* import { PageCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <PageCard
* title="Sample Page"
* description="This is a sample page description."
* href="/sample-page"
* />
* ```
*/
export const PageCard: React.FC<PageCardProps> = ({
title,
description,

View File

@ -14,6 +14,45 @@ export type ProfileCardProps = React.HTMLProps<HTMLDivElement> & {
discordLink?: string
}
/**
* A component used to display team members' profiles, including their name, avatar, and social links.
*
* @example
* ```tsx
* import { ProfileCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <ProfileCard
* imgSrc="/path/to/profile-image.jpg"
* name="John Doe"
* githubUsername="johndoe"
* githubLink="https://github.com/johndoe"
* discordUsername="johndoe#1234"
* discordLink="https://discordapp.com/users/johndoe"
* />
* ```
*
* Example usage of ProfileCard within a grid:
*
* ```tsx
* import { Grid, ProfileCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <Grid
* xs={{ cols: 3, gap: '1rem', wrap: false }}
* md={{ cols: 4, gap: '1rem', wrap: true }}
* >
* <Grid.Item>
* <ProfileCard
* name="Name"
* githubUsername="Github"
* githubLink="https://github.com/"
* discordUsername="Discord"
* discordLink="https://discord.gg/"
* />
* </Grid.Item>
* Add more ProfileCard items within the grid
* </Grid>
* ```
*/
export const ProfileCard: React.FC<ProfileCardProps> = ({
imgSrc,
name,

View File

@ -6,11 +6,59 @@ import { IconExternalLink } from '../../Icon'
import './SocialCard.scss'
export type SocialCardProps = React.HTMLProps<HTMLAnchorElement> & {
/**
* The URL of the logo image for the social media or community platform (light theme).
*/
logoSrc?: string
/**
* The URL of the logo image for the social media or community platform (dark theme).
*/
logoSrcDark?: string
/**
* The description or content associated with the social media or community platform.
*/
description?: React.ReactNode
}
/**
* A component used for displaying social media or community platform cards with a logo and description.
*
* @example
* ```tsx
* import { SocialCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <SocialCard
* title="Telegram Community"
* logoSrc="/path/to/telegram-logo.png"
* description="Join our Telegram community to stay updated and chat with fellow members."
* href="https://t.me/your-telegram-community"
* />
* ```
*
* Grid example:
* ```tsx
* import { Box, Grid, SocialCard } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx';
*
* <Box top={56} bottom={56}>
* <Grid xs={{ cols: 1, gap: '1rem' }} md={{ cols: 2 }}>
* <Grid.Item xs={1}>
* <SocialCard
* href='https://twitter.com/twitter-handle'
* logoSrcDark="/icons/x.svg"
* description='Follow us on X'
* />
* </Grid.Item>
* <Grid.Item xs={1}>
* <SocialCard
* href='https://discord.gg/discord-server'
* logoSrcDark="/icons/discord-white.svg"
* description='Join the community on Discord'
* />
* </Grid.Item>
* </Grid>
*</Box>
* ```
*/
export const SocialCard: React.FC<SocialCardProps> = ({
title,
logoSrc,

View File

@ -7,13 +7,64 @@ export type TimelineItemProps = Omit<
React.HTMLAttributes<HTMLDivElement>,
'title'
> & {
/** The index or label of the timeline item. */
index: React.ReactNode
/** The alignment of the timeline item, either 'top' or 'bottom'. (Optional, default: 'top') */
alignment?: 'top' | 'bottom'
/** The period or time frame associated with the timeline item. e.g., `2023 Q3` */
period: React.ReactNode
/** The description or content of the timeline item. */
description: React.ReactNode
/** The border style for the timeline item */
borderStyle?: 'solid' | 'dashed' | 'none'
}
/**
* A component for displaying roadmap items, such as events or milestones, in a timeline layout.
*
* @example
* Roadmap example:
* ```tsx
* import {
* Box,
* Grid,
* TimelineItem,
* SectionHeader,
* CallToActionButton
* } from '@acid-info/logos-docusaurus-theme/lib/client/components/mdx'
*
* <Box top={{ xs: 144, lg: 216 }}>
* <SectionHeader
* title="Roadmap"
* description="Roadmap description"
* bottom={{ xs: "4rem", lg: "7.25rem" }}
* />
* <Grid xs={{ cols: 6, wrap: false, gap: "0 1rem" }} actions={
* <CallToActionButton style={{ marginTop: 0 }} size="small" variant="outlined" href="/about">
* Read more
* </CallToActionButton>
* }>
* <Grid.Item>
* <TimelineItem
* index={0}
* period="2013"
* borderStyle="solid"
* description="First item"
* />
* </Grid.Item>
* Add more items here
* <Grid.Item>
* <TimelineItem
* index={10}
* period="2024+"
* borderStyle="none"
* description="Last item"
* />
* </Grid.Item>
* </Grid>
* </Box>
* ```
*/
export const TimelineItem: React.FC<TimelineItemProps> = ({
index,
period,

327
yarn.lock
View File

@ -156,11 +156,24 @@
dependencies:
"@babel/highlight" "^7.18.6"
"@babel/code-frame@^7.22.13":
version "7.22.13"
resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.22.13.tgz#e3c1c099402598483b7a8c46a721d1038803755e"
integrity sha512-XktuhWlJ5g+3TJXc5upd9Ks1HutSArik6jf2eAjYFyIOf4ej3RN+184cZbzDvbPnuTJIUhPKKJE3cIsYTiAT3w==
dependencies:
"@babel/highlight" "^7.22.13"
chalk "^2.4.2"
"@babel/compat-data@^7.17.7", "@babel/compat-data@^7.22.0", "@babel/compat-data@^7.22.3":
version "7.22.3"
resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.22.3.tgz#cd502a6a0b6e37d7ad72ce7e71a7160a3ae36f7e"
integrity sha512-aNtko9OPOwVESUFp3MZfD8Uzxl7JzSeJpd7npIoxCasU37PFbAQRpKglkaKwlHOyeJdrREpo8TW8ldrkYWwvIQ==
"@babel/compat-data@^7.22.9":
version "7.23.2"
resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.23.2.tgz#6a12ced93455827037bfb5ed8492820d60fc32cc"
integrity sha512-0S9TQMmDHlqAZ2ITT95irXKfxN9bncq8ZCoJhun3nHL/lLUxd2NKBJYoNGWH7S0hz6fRQwWlAWn/ILM0C70KZQ==
"@babel/core@7.12.9":
version "7.12.9"
resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.12.9.tgz#fd450c4ec10cdbb980e2928b7aa7a28484593fc8"
@ -204,6 +217,27 @@
json5 "^2.2.2"
semver "^6.3.0"
"@babel/core@^7.18.9":
version "7.23.2"
resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.23.2.tgz#ed10df0d580fff67c5f3ee70fd22e2e4c90a9f94"
integrity sha512-n7s51eWdaWZ3vGT2tD4T7J6eJs3QoBXydv7vkUM06Bf1cbVD2Kc2UrkzhiQwobfV7NwOnQXYL7UBJ5VPU+RGoQ==
dependencies:
"@ampproject/remapping" "^2.2.0"
"@babel/code-frame" "^7.22.13"
"@babel/generator" "^7.23.0"
"@babel/helper-compilation-targets" "^7.22.15"
"@babel/helper-module-transforms" "^7.23.0"
"@babel/helpers" "^7.23.2"
"@babel/parser" "^7.23.0"
"@babel/template" "^7.22.15"
"@babel/traverse" "^7.23.2"
"@babel/types" "^7.23.0"
convert-source-map "^2.0.0"
debug "^4.1.0"
gensync "^1.0.0-beta.2"
json5 "^2.2.3"
semver "^6.3.1"
"@babel/generator@^7.12.5", "@babel/generator@^7.18.7", "@babel/generator@^7.22.0", "@babel/generator@^7.22.3":
version "7.22.3"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.22.3.tgz#0ff675d2edb93d7596c5f6728b52615cfc0df01e"
@ -214,6 +248,16 @@
"@jridgewell/trace-mapping" "^0.3.17"
jsesc "^2.5.1"
"@babel/generator@^7.23.0":
version "7.23.0"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.23.0.tgz#df5c386e2218be505b34837acbcb874d7a983420"
integrity sha512-lN85QRR+5IbYrMWM6Y4pE/noaQtg4pNiqeNGX60eqOfo6gtEj6uw/JagelB8vVztSd7R6M5n1+PQkDbHbBRU4g==
dependencies:
"@babel/types" "^7.23.0"
"@jridgewell/gen-mapping" "^0.3.2"
"@jridgewell/trace-mapping" "^0.3.17"
jsesc "^2.5.1"
"@babel/helper-annotate-as-pure@^7.18.6":
version "7.18.6"
resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.18.6.tgz#eaa49f6f80d5a33f9a5dd2276e6d6e451be0a6bb"
@ -239,6 +283,17 @@
lru-cache "^5.1.1"
semver "^6.3.0"
"@babel/helper-compilation-targets@^7.22.15":
version "7.22.15"
resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.15.tgz#0698fc44551a26cf29f18d4662d5bf545a6cfc52"
integrity sha512-y6EEzULok0Qvz8yyLkCvVX+02ic+By2UdOhylwUOvOn9dvYc9mKICJuuU1n1XBI02YWsNsnrY1kc6DVbjcXbtw==
dependencies:
"@babel/compat-data" "^7.22.9"
"@babel/helper-validator-option" "^7.22.15"
browserslist "^4.21.9"
lru-cache "^5.1.1"
semver "^6.3.1"
"@babel/helper-create-class-features-plugin@^7.18.6", "@babel/helper-create-class-features-plugin@^7.21.0", "@babel/helper-create-class-features-plugin@^7.22.1":
version "7.22.1"
resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.22.1.tgz#ae3de70586cc757082ae3eba57240d42f468c41b"
@ -294,6 +349,11 @@
resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.1.tgz#ac3a56dbada59ed969d712cf527bd8271fe3eba8"
integrity sha512-Z2tgopurB/kTbidvzeBrc2To3PUP/9i5MUe+fU6QJCQDyPwSH2oRapkLw3KGECDYSjhQZCNxEvNvZlLw8JjGwA==
"@babel/helper-environment-visitor@^7.22.20":
version "7.22.20"
resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz#96159db61d34a29dba454c959f5ae4a649ba9167"
integrity sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==
"@babel/helper-function-name@^7.18.9", "@babel/helper-function-name@^7.19.0", "@babel/helper-function-name@^7.21.0":
version "7.21.0"
resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.21.0.tgz#d552829b10ea9f120969304023cd0645fa00b1b4"
@ -302,6 +362,14 @@
"@babel/template" "^7.20.7"
"@babel/types" "^7.21.0"
"@babel/helper-function-name@^7.23.0":
version "7.23.0"
resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz#1f9a3cdbd5b2698a670c30d2735f9af95ed52759"
integrity sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==
dependencies:
"@babel/template" "^7.22.15"
"@babel/types" "^7.23.0"
"@babel/helper-hoist-variables@^7.18.6":
version "7.18.6"
resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.18.6.tgz#d4d2c8fb4baeaa5c68b99cc8245c56554f926678"
@ -309,6 +377,13 @@
dependencies:
"@babel/types" "^7.18.6"
"@babel/helper-hoist-variables@^7.22.5":
version "7.22.5"
resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz#c01a007dac05c085914e8fb652b339db50d823bb"
integrity sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==
dependencies:
"@babel/types" "^7.22.5"
"@babel/helper-member-expression-to-functions@^7.22.0":
version "7.22.3"
resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.22.3.tgz#4b77a12c1b4b8e9e28736ed47d8b91f00976911f"
@ -323,6 +398,13 @@
dependencies:
"@babel/types" "^7.21.4"
"@babel/helper-module-imports@^7.22.15":
version "7.22.15"
resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz#16146307acdc40cc00c3b2c647713076464bdbf0"
integrity sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==
dependencies:
"@babel/types" "^7.22.15"
"@babel/helper-module-transforms@^7.12.1", "@babel/helper-module-transforms@^7.18.6", "@babel/helper-module-transforms@^7.20.11", "@babel/helper-module-transforms@^7.21.5", "@babel/helper-module-transforms@^7.22.1":
version "7.22.1"
resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.22.1.tgz#e0cad47fedcf3cae83c11021696376e2d5a50c63"
@ -337,6 +419,17 @@
"@babel/traverse" "^7.22.1"
"@babel/types" "^7.22.0"
"@babel/helper-module-transforms@^7.23.0":
version "7.23.0"
resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.23.0.tgz#3ec246457f6c842c0aee62a01f60739906f7047e"
integrity sha512-WhDWw1tdrlT0gMgUJSlX0IQvoO1eN279zrAUbVB+KpV2c3Tylz8+GnKOLllCS6Z/iZQEyVYxhZVUdPTqs2YYPw==
dependencies:
"@babel/helper-environment-visitor" "^7.22.20"
"@babel/helper-module-imports" "^7.22.15"
"@babel/helper-simple-access" "^7.22.5"
"@babel/helper-split-export-declaration" "^7.22.6"
"@babel/helper-validator-identifier" "^7.22.20"
"@babel/helper-optimise-call-expression@^7.18.6":
version "7.18.6"
resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.18.6.tgz#9369aa943ee7da47edab2cb4e838acf09d290ffe"
@ -383,6 +476,13 @@
dependencies:
"@babel/types" "^7.21.5"
"@babel/helper-simple-access@^7.22.5":
version "7.22.5"
resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz#4938357dc7d782b80ed6dbb03a0fba3d22b1d5de"
integrity sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==
dependencies:
"@babel/types" "^7.22.5"
"@babel/helper-skip-transparent-expression-wrappers@^7.20.0":
version "7.20.0"
resolved "https://registry.yarnpkg.com/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.20.0.tgz#fbe4c52f60518cab8140d77101f0e63a8a230684"
@ -397,21 +497,43 @@
dependencies:
"@babel/types" "^7.18.6"
"@babel/helper-split-export-declaration@^7.22.6":
version "7.22.6"
resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz#322c61b7310c0997fe4c323955667f18fcefb91c"
integrity sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==
dependencies:
"@babel/types" "^7.22.5"
"@babel/helper-string-parser@^7.21.5":
version "7.21.5"
resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.21.5.tgz#2b3eea65443c6bdc31c22d037c65f6d323b6b2bd"
integrity sha512-5pTUx3hAJaZIdW99sJ6ZUUgWq/Y+Hja7TowEnLNMm1VivRgZQL3vpBY3qUACVsvw+yQU6+YgfBVmcbLaZtrA1w==
"@babel/helper-string-parser@^7.22.5":
version "7.22.5"
resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.22.5.tgz#533f36457a25814cf1df6488523ad547d784a99f"
integrity sha512-mM4COjgZox8U+JcXQwPijIZLElkgEpO5rsERVDJTc2qfCDfERyob6k5WegS14SX18IIjv+XD+GrqNumY5JRCDw==
"@babel/helper-validator-identifier@^7.18.6", "@babel/helper-validator-identifier@^7.19.1":
version "7.19.1"
resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.19.1.tgz#7eea834cf32901ffdc1a7ee555e2f9c27e249ca2"
integrity sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==
"@babel/helper-validator-identifier@^7.22.20":
version "7.22.20"
resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz#c4ae002c61d2879e724581d96665583dbc1dc0e0"
integrity sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==
"@babel/helper-validator-option@^7.21.0":
version "7.21.0"
resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.21.0.tgz#8224c7e13ace4bafdc4004da2cf064ef42673180"
integrity sha512-rmL/B8/f0mKS2baE9ZpyTcTavvEuWhTTW8amjzXNvYG4AwBsqTLikfXsEofsJEfKHf+HQVQbFOHy6o+4cnC/fQ==
"@babel/helper-validator-option@^7.22.15":
version "7.22.15"
resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.22.15.tgz#694c30dfa1d09a6534cdfcafbe56789d36aba040"
integrity sha512-bMn7RmyFjY/mdECUbgn9eoSY4vqvacUnS9i9vGAGttgFWesO6B4CYWA7XlpbWgBt71iv/hfbPlynohStqnu5hA==
"@babel/helper-wrap-function@^7.18.9":
version "7.20.5"
resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.20.5.tgz#75e2d84d499a0ab3b31c33bcfe59d6b8a45f62e3"
@ -431,6 +553,15 @@
"@babel/traverse" "^7.22.1"
"@babel/types" "^7.22.3"
"@babel/helpers@^7.23.2":
version "7.23.2"
resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.23.2.tgz#2832549a6e37d484286e15ba36a5330483cac767"
integrity sha512-lzchcp8SjTSVe/fPmLwtWVBFC7+Tbn8LGHDVfDp9JGxpAY5opSaEFgt8UQvrnECWOTdji2mOWMz1rOhkHscmGQ==
dependencies:
"@babel/template" "^7.22.15"
"@babel/traverse" "^7.23.2"
"@babel/types" "^7.23.0"
"@babel/highlight@^7.18.6":
version "7.18.6"
resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.18.6.tgz#81158601e93e2563795adcbfbdf5d64be3f2ecdf"
@ -440,11 +571,25 @@
chalk "^2.0.0"
js-tokens "^4.0.0"
"@babel/highlight@^7.22.13":
version "7.22.20"
resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.22.20.tgz#4ca92b71d80554b01427815e06f2df965b9c1f54"
integrity sha512-dkdMCN3py0+ksCgYmGG8jKeGA/8Tk+gJwSYYlFGxG5lmhfKNoAy004YpLxpS1W2J8m/EK2Ew+yOs9pVRwO89mg==
dependencies:
"@babel/helper-validator-identifier" "^7.22.20"
chalk "^2.4.2"
js-tokens "^4.0.0"
"@babel/parser@^7.1.0", "@babel/parser@^7.11.5", "@babel/parser@^7.12.7", "@babel/parser@^7.14.7", "@babel/parser@^7.18.8", "@babel/parser@^7.20.7", "@babel/parser@^7.21.9", "@babel/parser@^7.22.0", "@babel/parser@^7.22.4", "@babel/parser@^7.7.0":
version "7.22.4"
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.22.4.tgz#a770e98fd785c231af9d93f6459d36770993fb32"
integrity sha512-VLLsx06XkEYqBtE5YGPwfSGwfrjnyPP5oiGty3S8pQLFDFLaS8VwWSIxkTXpcvr5zeYLE6+MBNl2npl/YnfofA==
"@babel/parser@^7.22.15", "@babel/parser@^7.23.0":
version "7.23.0"
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.0.tgz#da950e622420bf96ca0d0f2909cdddac3acd8719"
integrity sha512-vvPKKdMemU85V9WE/l5wZEmImpCtLqbnTvqDS2U1fJ96KrxoW7KrXhNsNCblQlg8Ck4b85yxdTyelsMUgFUXiw==
"@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.18.6":
version "7.18.6"
resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.18.6.tgz#da5b8f9a580acdfbe53494dba45ea389fb09a4d2"
@ -1250,6 +1395,15 @@
"@babel/parser" "^7.21.9"
"@babel/types" "^7.21.5"
"@babel/template@^7.22.15":
version "7.22.15"
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.22.15.tgz#09576efc3830f0430f4548ef971dde1350ef2f38"
integrity sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==
dependencies:
"@babel/code-frame" "^7.22.13"
"@babel/parser" "^7.22.15"
"@babel/types" "^7.22.15"
"@babel/traverse@^7.1.0", "@babel/traverse@^7.11.5", "@babel/traverse@^7.12.9", "@babel/traverse@^7.18.8", "@babel/traverse@^7.20.5", "@babel/traverse@^7.22.1", "@babel/traverse@^7.7.0":
version "7.22.4"
resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.22.4.tgz#c3cf96c5c290bd13b55e29d025274057727664c0"
@ -1266,6 +1420,22 @@
debug "^4.1.0"
globals "^11.1.0"
"@babel/traverse@^7.18.9", "@babel/traverse@^7.23.2":
version "7.23.2"
resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.23.2.tgz#329c7a06735e144a506bdb2cad0268b7f46f4ad8"
integrity sha512-azpe59SQ48qG6nu2CzcMLbxUudtN+dOM9kDbUqGq3HXUJRlo7i8fvPoxQUzYgLZ4cMVmuZgm8vvBpNeRhd6XSw==
dependencies:
"@babel/code-frame" "^7.22.13"
"@babel/generator" "^7.23.0"
"@babel/helper-environment-visitor" "^7.22.20"
"@babel/helper-function-name" "^7.23.0"
"@babel/helper-hoist-variables" "^7.22.5"
"@babel/helper-split-export-declaration" "^7.22.6"
"@babel/parser" "^7.23.0"
"@babel/types" "^7.23.0"
debug "^4.1.0"
globals "^11.1.0"
"@babel/types@^7.0.0", "@babel/types@^7.12.7", "@babel/types@^7.18.6", "@babel/types@^7.18.9", "@babel/types@^7.20.0", "@babel/types@^7.20.5", "@babel/types@^7.20.7", "@babel/types@^7.21.0", "@babel/types@^7.21.4", "@babel/types@^7.21.5", "@babel/types@^7.22.0", "@babel/types@^7.22.3", "@babel/types@^7.22.4", "@babel/types@^7.3.3", "@babel/types@^7.4.4", "@babel/types@^7.7.0":
version "7.22.4"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.22.4.tgz#56a2653ae7e7591365dabf20b76295410684c071"
@ -1275,6 +1445,15 @@
"@babel/helper-validator-identifier" "^7.19.1"
to-fast-properties "^2.0.0"
"@babel/types@^7.22.15", "@babel/types@^7.22.5", "@babel/types@^7.23.0":
version "7.23.0"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.23.0.tgz#8c1f020c9df0e737e4e247c0619f58c68458aaeb"
integrity sha512-0oIyUfKoI3mSqMvsxBdclDwxXKXAUA8v/apZbc+iSyARYou1o8ZGDxbUYyLFoW2arqS2jDGqJuZvv1d/io1axg==
dependencies:
"@babel/helper-string-parser" "^7.22.5"
"@babel/helper-validator-identifier" "^7.22.20"
to-fast-properties "^2.0.0"
"@bcoe/v8-coverage@^0.2.3":
version "0.2.3"
resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
@ -3206,6 +3385,17 @@
"@types/babel__template" "*"
"@types/babel__traverse" "*"
"@types/babel__core@^7.18.0":
version "7.20.3"
resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.20.3.tgz#d5625a50b6f18244425a1359a858c73d70340778"
integrity sha512-54fjTSeSHwfan8AyHWrKbfBWiEUrNTZsUwPTDSNaaP1QDQIZbeNUg3a59E9D+375MzUw/x1vx2/0F5LBz+AeYA==
dependencies:
"@babel/parser" "^7.20.7"
"@babel/types" "^7.20.7"
"@types/babel__generator" "*"
"@types/babel__template" "*"
"@types/babel__traverse" "*"
"@types/babel__generator@*":
version "7.6.4"
resolved "https://registry.yarnpkg.com/@types/babel__generator/-/babel__generator-7.6.4.tgz#1f20ce4c5b1990b37900b63f050182d28c2439b7"
@ -3228,6 +3418,13 @@
dependencies:
"@babel/types" "^7.20.7"
"@types/babel__traverse@^7.18.0":
version "7.20.3"
resolved "https://registry.yarnpkg.com/@types/babel__traverse/-/babel__traverse-7.20.3.tgz#a971aa47441b28ef17884ff945d0551265a2d058"
integrity sha512-Lsh766rGEFbaxMIDH7Qa+Yha8cMVI3qAK6CHt3OR0YfxOIn5Z54iHiyDRycHrBqeIiqGa20Kpsv1cavfBKkRSw==
dependencies:
"@babel/types" "^7.20.7"
"@types/body-parser@*":
version "1.19.2"
resolved "https://registry.yarnpkg.com/@types/body-parser/-/body-parser-1.19.2.tgz#aea2059e28b7658639081347ac4fab3de166e6f0"
@ -3258,6 +3455,11 @@
dependencies:
"@types/node" "*"
"@types/doctrine@^0.0.8":
version "0.0.8"
resolved "https://registry.yarnpkg.com/@types/doctrine/-/doctrine-0.0.8.tgz#e6d6572ddc6f424aef73245cf411724e225dfa11"
integrity sha512-mGinUwtyZsYnU2ana2wyteVHD0PFPukcZMOZWMtSRJBTFMirYy6RlV286CjttvPoNYYgW9jWf0MXKniV7f2oVw==
"@types/draco3d@^1.4.0":
version "1.4.2"
resolved "https://registry.yarnpkg.com/@types/draco3d/-/draco3d-1.4.2.tgz#7faccb809db2a5e19b9efb97c5f2eb9d64d527ea"
@ -3543,6 +3745,11 @@
dependencies:
"@types/node" "*"
"@types/resolve@^1.20.2":
version "1.20.4"
resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.20.4.tgz#d2df996a35695c843dbf180e26bc2c7a0f1a3e12"
integrity sha512-BKGK0T1VgB1zD+PwQR4RRf0ais3NyvH1qjLUrHI5SEiccYaJrhLstLuoXFWJ+2Op9whGizSPUMGPJY/Qtb/A2w==
"@types/retry@0.12.0":
version "0.12.0"
resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.0.tgz#2b35eccfcee7d38cd72ad99232fbd58bffb3c84d"
@ -4933,6 +5140,16 @@ browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.18.1, browserslist@^4
node-releases "^2.0.12"
update-browserslist-db "^1.0.11"
browserslist@^4.21.9:
version "4.22.1"
resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.22.1.tgz#ba91958d1a59b87dab6fed8dfbcb3da5e2e9c619"
integrity sha512-FEVc202+2iuClEhZhrWy6ZiAcRLvNMyYcxZ8raemul1DYVOVdFsbqckWLdsixQZCpJlwe77Z3UTalE7jsjnKfQ==
dependencies:
caniuse-lite "^1.0.30001541"
electron-to-chromium "^1.4.535"
node-releases "^2.0.13"
update-browserslist-db "^1.0.13"
bs-logger@0.x:
version "0.2.6"
resolved "https://registry.yarnpkg.com/bs-logger/-/bs-logger-0.2.6.tgz#eb7d365307a72cf974cc6cda76b68354ad336bd8"
@ -5150,6 +5367,11 @@ caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001464, caniuse-lite@^1.0.30001489:
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001492.tgz#4a06861788a52b4c81fd3344573b68cc87fe062b"
integrity sha512-2efF8SAZwgAX1FJr87KWhvuJxnGJKOnctQa8xLOskAXNXq8oiuqgl6u1kk3fFpsp3GgvzlRjiK1sl63hNtFADw==
caniuse-lite@^1.0.30001541:
version "1.0.30001553"
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001553.tgz#e64e7dc8fd4885cd246bb476471420beb5e474b5"
integrity sha512-N0ttd6TrFfuqKNi+pMgWJTb9qrdJu4JSpgPFLe/lrD19ugC6fZgF0pUewRowDwzdDnb9V41mFcdlYgl/PyKf4A==
capture-exit@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/capture-exit/-/capture-exit-2.0.0.tgz#fb953bfaebeb781f62898239dabb426d08a509a4"
@ -5848,6 +6070,11 @@ convert-source-map@^1.0.0, convert-source-map@^1.4.0, convert-source-map@^1.5.0,
resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.9.0.tgz#7faae62353fb4213366d0ca98358d22e8368b05f"
integrity sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==
convert-source-map@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-2.0.0.tgz#4b560f649fc4e918dd0ab75cf4961e8bc882d82a"
integrity sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==
cookie-signature@1.0.6:
version "1.0.6"
resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c"
@ -7046,6 +7273,11 @@ electron-to-chromium@^1.4.411:
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.417.tgz#a0c7eb992e68287fa50c8da5a5238b01f20b9a82"
integrity sha512-8rY8HdCxuSVY8wku3i/eDac4g1b4cSbruzocenrqBlzqruAZYHjQCHIjC66dLR9DXhEHTojsC4EjhZ8KmzwXqA==
electron-to-chromium@^1.4.535:
version "1.4.565"
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.565.tgz#205f3746a759ec3c43bce98b9eef5445f2721ea9"
integrity sha512-XbMoT6yIvg2xzcbs5hCADi0dXBh4//En3oFXmtPX+jiyyiCTiM9DGFT2SLottjpEs9Z8Mh8SqahbR96MaHfuSg==
elkjs@^0.8.2:
version "0.8.2"
resolved "https://registry.yarnpkg.com/elkjs/-/elkjs-0.8.2.tgz#c37763c5a3e24e042e318455e0147c912a7c248e"
@ -8661,6 +8893,17 @@ glob@^10.2.2:
minipass "^5.0.0 || ^6.0.2"
path-scurry "^1.7.0"
glob@^10.3.10:
version "10.3.10"
resolved "https://registry.yarnpkg.com/glob/-/glob-10.3.10.tgz#0351ebb809fd187fe421ab96af83d3a70715df4b"
integrity sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==
dependencies:
foreground-child "^3.1.0"
jackspeak "^2.3.5"
minimatch "^9.0.1"
minipass "^5.0.0 || ^6.0.2 || ^7.0.0"
path-scurry "^1.10.1"
glob@^7.0.0, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6:
version "7.2.3"
resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.3.tgz#b8df0fb802bbfa8e89bd1d938b4e16578ed44f2b"
@ -10310,6 +10553,15 @@ jackspeak@^2.0.3:
optionalDependencies:
"@pkgjs/parseargs" "^0.11.0"
jackspeak@^2.3.5:
version "2.3.6"
resolved "https://registry.yarnpkg.com/jackspeak/-/jackspeak-2.3.6.tgz#647ecc472238aee4b06ac0e461acc21a8c505ca8"
integrity sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==
dependencies:
"@isaacs/cliui" "^8.0.2"
optionalDependencies:
"@pkgjs/parseargs" "^0.11.0"
jake@^10.8.5:
version "10.8.7"
resolved "https://registry.yarnpkg.com/jake/-/jake-10.8.7.tgz#63a32821177940c33f356e0ba44ff9d34e1c7d8f"
@ -10879,7 +11131,7 @@ json-stringify-safe@^5.0.1, json-stringify-safe@~5.0.1:
resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
integrity sha512-ZClg6AaYvamvYEE82d3Iyd3vSSIjQ+odgjaTzRuO3s7toCdFKczob2i0zCh7JE8kWn17yvAWhUVxvqGwUalsRA==
json5@2.x, json5@^2.1.2, json5@^2.2.2:
json5@2.x, json5@^2.1.2, json5@^2.2.2, json5@^2.2.3:
version "2.2.3"
resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283"
integrity sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==
@ -11459,6 +11711,11 @@ lru-cache@^9.1.1:
resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-9.1.2.tgz#255fdbc14b75589d6d0e73644ca167a8db506835"
integrity sha512-ERJq3FOzJTxBbFjZ7iDs+NiK4VI9Wz+RdrrAB8dio1oV+YvdPzUEE4QNiT2VD51DkIbCYRUUzCRkssXCHqSnKQ==
"lru-cache@^9.1.1 || ^10.0.0":
version "10.0.1"
resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-10.0.1.tgz#0a3be479df549cca0e5d693ac402ff19537a6b7a"
integrity sha512-IJ4uwUTi2qCccrioU6g9g/5rvvVl13bsdczUUcqbciD9iLr095yj8DQKdObriEvuNSx325N1rV1O0sJFszx75g==
lru-queue@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/lru-queue/-/lru-queue-0.1.0.tgz#2738bd9f0d3cf4f84490c5736c48699ac632cda3"
@ -11816,7 +12073,7 @@ mimic-response@^3.1.0:
resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-3.1.0.tgz#2d1d59af9c1b129815accc2c46a022a5ce1fa3c9"
integrity sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==
min-indent@^1.0.0:
min-indent@^1.0.0, min-indent@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
@ -11969,6 +12226,11 @@ minipass@^5.0.0:
resolved "https://registry.yarnpkg.com/minipass/-/minipass-6.0.2.tgz#542844b6c4ce95b202c0995b0a471f1229de4c81"
integrity sha512-MzWSV5nYVT7mVyWCwn2o7JH13w2TBRmmSqSRCKzTw+lmft9X4z+3wjvs06Tzijo5z4W/kahUCDpRXTF+ZrmF/w==
"minipass@^5.0.0 || ^6.0.2 || ^7.0.0":
version "7.0.4"
resolved "https://registry.yarnpkg.com/minipass/-/minipass-7.0.4.tgz#dbce03740f50a4786ba994c1fb908844d27b038c"
integrity sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==
minizlib@^2.1.1, minizlib@^2.1.2:
version "2.1.2"
resolved "https://registry.yarnpkg.com/minizlib/-/minizlib-2.1.2.tgz#e90d3466ba209b932451508a11ce3d3632145931"
@ -12268,6 +12530,11 @@ node-releases@^2.0.12:
resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.12.tgz#35627cc224a23bfb06fb3380f2b3afaaa7eb1039"
integrity sha512-QzsYKWhXTWx8h1kIvqfnC++o0pEmpRQA/aenALsL2F4pqNVr7YzcdMlDij5WBnwftRbJCNJL/O7zdKaxKPHqgQ==
node-releases@^2.0.13:
version "2.0.13"
resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.13.tgz#d5ed1627c23e3461e819b02e57b75e4899b1c81d"
integrity sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==
non-layered-tidy-tree-layout@^2.0.2:
version "2.0.2"
resolved "https://registry.yarnpkg.com/non-layered-tidy-tree-layout/-/non-layered-tidy-tree-layout-2.0.2.tgz#57d35d13c356643fc296a55fb11ac15e74da7804"
@ -13249,6 +13516,14 @@ path-root@^0.1.1:
dependencies:
path-root-regex "^0.1.0"
path-scurry@^1.10.1:
version "1.10.1"
resolved "https://registry.yarnpkg.com/path-scurry/-/path-scurry-1.10.1.tgz#9ba6bf5aa8500fe9fd67df4f0d9483b2b0bfc698"
integrity sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==
dependencies:
lru-cache "^9.1.1 || ^10.0.0"
minipass "^5.0.0 || ^6.0.2 || ^7.0.0"
path-scurry@^1.6.1, path-scurry@^1.7.0:
version "1.9.2"
resolved "https://registry.yarnpkg.com/path-scurry/-/path-scurry-1.9.2.tgz#90f9d296ac5e37e608028e28a447b11d385b3f63"
@ -14109,6 +14384,34 @@ react-dev-utils@^12.0.1:
strip-ansi "^6.0.1"
text-table "^0.2.0"
react-docgen-markdown-renderer@^2.1.3:
version "2.1.3"
resolved "https://registry.yarnpkg.com/react-docgen-markdown-renderer/-/react-docgen-markdown-renderer-2.1.3.tgz#b9278c0a288e46bf682cc53b6a4e5464789600d0"
integrity sha512-583Phg6Pep09XwklAVEf/+v4XrohYfjFMHA5XXmT2Bm+Xao+46ECkJl3pJb+K0GZN5oaxZcGis2cgQpaKqmd2A==
dependencies:
react-docgen-renderer-template "^0.1.0"
react-docgen-renderer-template@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/react-docgen-renderer-template/-/react-docgen-renderer-template-0.1.0.tgz#29340c947ab42b0060aa8e1c64e379a822e2733e"
integrity sha512-3GyuFI9pBf3E2lW6oX6j3DvTQv55Wc9pWNKwDVcUFf8kDfpDyWmTeAYWPxoSEhSZxhEP+LV/1Tr4DLwE4CULQQ==
react-docgen@^7.0.0:
version "7.0.0"
resolved "https://registry.yarnpkg.com/react-docgen/-/react-docgen-7.0.0.tgz#f18e456fad3f8b6243ddfa8cb70fcf968de03524"
integrity sha512-u1Vg0pyk98CE1VCQlXydRX3+deV2HEYGb4t00R2SNSec2X6q8vsd18O/VsJ3K6po2H1c9TlM6Bd2gf26n10pXQ==
dependencies:
"@babel/core" "^7.18.9"
"@babel/traverse" "^7.18.9"
"@babel/types" "^7.18.9"
"@types/babel__core" "^7.18.0"
"@types/babel__traverse" "^7.18.0"
"@types/doctrine" "^0.0.8"
"@types/resolve" "^1.20.2"
doctrine "^3.0.0"
resolve "^1.22.1"
strip-indent "^4.0.0"
react-dom@^17.0.2:
version "17.0.2"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
@ -15239,6 +15542,11 @@ semver@7.3.8:
dependencies:
lru-cache "^6.0.0"
semver@^6.3.1:
version "6.3.1"
resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4"
integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==
semver@^7.0.0, semver@^7.1.1, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5, semver@^7.3.7, semver@^7.3.8, semver@^7.5.0:
version "7.5.1"
resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.1.tgz#c90c4d631cf74720e46b21c1d37ea07edfab91ec"
@ -16076,6 +16384,13 @@ strip-indent@^3.0.0:
dependencies:
min-indent "^1.0.0"
strip-indent@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-4.0.0.tgz#b41379433dd06f5eae805e21d631e07ee670d853"
integrity sha512-mnVSV2l+Zv6BLpSD/8V87CW/y9EmmbYzGCIavsnsI6/nwn26DwffM/yztm30Z/I2DY9wdS3vXVCMnHDgZaVNoA==
dependencies:
min-indent "^1.0.1"
strip-json-comments@^3.0.1, strip-json-comments@^3.1.1:
version "3.1.1"
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
@ -17187,6 +17502,14 @@ update-browserslist-db@^1.0.11:
escalade "^3.1.1"
picocolors "^1.0.0"
update-browserslist-db@^1.0.13:
version "1.0.13"
resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz#3c5e4f5c083661bd38ef64b6328c26ed6c8248c4"
integrity sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==
dependencies:
escalade "^3.1.1"
picocolors "^1.0.0"
update-notifier@^5.1.0:
version "5.1.0"
resolved "https://registry.yarnpkg.com/update-notifier/-/update-notifier-5.1.0.tgz#4ab0d7c7f36a231dd7316cf7729313f0214d9ad9"