docusaurus/website/docs/docusaurus-core.md

---
id: docusaurus-core
title: Docusaurus Client API
sidebar_label: Client API
---

Docusaurus provides some APIs on the clients that can be helpful to you when building your site.

## Components {#components}

### `<Head/>` {#head}

This reusable React component will manage all of your changes to the document head. It takes plain HTML tags and outputs plain HTML tags and is beginner-friendly. It is a wrapper around [React Helmet](https://github.com/nfl/react-helmet).

Usage Example:

```jsx {2,5,10}
import React from 'react';
import Head from '@docusaurus/Head';

const MySEO = () => (
  <Head>
    <meta property="og:description" content="My custom description" />
    <meta charSet="utf-8" />
    <title>My Title</title>
    <link rel="canonical" href="http://mysite.com/example" />
  </Head>
);
```

Nested or latter components will override duplicate usages:

```jsx {2,5,8,11}
<Parent>
  <Head>
    <title>My Title</title>
    <meta name="description" content="Helmet application" />
  </Head>
  <Child>
    <Head>
      <title>Nested Title</title>
      <meta name="description" content="Nested component" />
    </Head>
  </Child>
</Parent>
```

Outputs:

```html
<head>
  <title>Nested Title</title>
  <meta name="description" content="Nested component" />
</head>
```

### `<Link/>` {#link}

This component enables linking to internal pages as well as a powerful performance feature called preloading. Preloading is used to prefetch resources so that the resources are fetched by the time the user navigates with this component. We use an `IntersectionObserver` to fetch a low-priority request when the `<Link>` is in the viewport and then use an `onMouseOver` event to trigger a high-priority request when it is likely that a user will navigate to the requested resource.

The component is a wrapper around react-router’s `<Link>` component that adds useful enhancements specific to Docusaurus. All props are passed through to react-router’s `<Link>` component.

External links also work, and automatically have these props: `target="_blank" rel="noopener noreferrer"`.

```jsx {2,7}
import React from 'react';
import Link from '@docusaurus/Link';

const Page = () => (
  <div>
    <p>
      Check out my <Link to="/blog">blog</Link>!
    </p>
    <p>
      Follow me on <Link to="https://twitter.com/docusaurus">Twitter</Link>!
    </p>
  </div>
);
```

#### `to`: string {#to-string}

The target location to navigate to. Example: `/docs/introduction`.

```jsx
<Link to="/courses" />
```

### `<Redirect/>` {#redirect}

Rendering a `<Redirect>` will navigate to a new location. The new location will override the current location in the history stack, like server-side redirects (HTTP 3xx) do. You can refer to [React Router's Redirect documentation](https://reacttraining.com/react-router/web/api/Redirect) for more info on available props.

Example usage:

```jsx {2,5}
import React from 'react';
import {Redirect} from '@docusaurus/router';

const Home = () => {
  return <Redirect to="/docs/test" />;
};
```

:::note

`@docusaurus/router` implements [React Router](https://reacttraining.com/react-router/web/guides/quick-start) and supports its features.

:::

### `<BrowserOnly/>` {#browseronly}

The `<BrowserOnly>` component permits to render React components only in the browser, after the React app has hydrated.

:::tip

Use it for integrating with code that can't run in Node.js, because `window` or `document` objects are being accessed.

:::

#### Props {#browseronly-props}

- `children`: render function prop returning browser-only JSX. Will not be executed in Node.js
- `fallback` (optional): JSX to render on the server (Node.js) and until React hydration completes.

#### Example with code {#browseronly-example-code}

```jsx
// highlight-start
import BrowserOnly from '@docusaurus/BrowserOnly';
// highlight-end

const MyComponent = () => {
  return (
    // highlight-start
    <BrowserOnly>
      {() => {
        <span>page url = {window.location.href}</span>;
      }}
    </BrowserOnly>
    // highlight-end
  );
};
```

#### Example with a library {#browseronly-example-library}

```jsx
// highlight-start
import BrowserOnly from '@docusaurus/BrowserOnly';
// highlight-end

const MyComponent = (props) => {
  return (
    // highlight-start
    <BrowserOnly fallback={<div>Loading...</div>}>
      {() => {
        const LibComponent = require('some-lib').LibComponent;
        return <LibComponent {...props} />;
      }}
    </BrowserOnly>
    // highlight-end
  );
};
```

### `<Interpolate/>` {#interpolate}

A simple interpolation component for text containing dynamic placeholders.

The placeholders will be replaced with the provided dynamic values and JSX elements of your choice (strings, links, styled elements...).

#### Props {#interpolate-props}

- `children`: text containing interpolation placeholders like `{placeholderName}`
- `values`: object containing interpolation placeholder values

```jsx
import React from 'react';
import Link from '@docusaurus/Link';
import Interpolate from '@docusaurus/Interpolate';

export default function VisitMyWebsiteMessage() {
  return (
    // highlight-start
    <Interpolate
      values={{
        firstName: 'Sébastien',
        website: (
          <Link to="https://docusaurus.io" className="my-website-class">
            website
          </Link>
        ),
      }}>
      {'Hello, {firstName}! How are you? Take a look at my {website}'}
    </Interpolate>
    // highlight-end
  );
}
```

### `<Translate/>` {#translate}

When [localizing your site](./i18n/i18n-introduction.md), the `<Translate/>` component will allow providing **translation support to React components**, such as your homepage. The `<Translate>` component supports [interpolation](#interpolate).

The translation strings will be extracted from your code with the [`docusaurus write-translations`](./cli.md#docusaurus-write-translations-sitedir) CLI and create a `code.json` translation file in `website/i18n/<locale>`.

:::note

The `<Translate/>` props **must be hardcoded strings**.

Apart the `values` prop used for interpolation, it is **not possible to use variables**, or the static extraction wouldn't work.

:::

#### Props {#translate-props}

- `children`: untranslated string in the default site locale (can contain [interpolation placeholders](#interpolate))
- `id`: optional value to use as key in JSON translation files
- `description`: optional text to help the translator
- `values`: optional object containing interpolation placeholder values

#### Example {#example}

```jsx title="src/pages/index.js"
import React from 'react';
import Layout from '@theme/Layout';

// highlight-start
import Translate from '@docusaurus/Translate';
// highlight-end

export default function Home() {
  return (
    <Layout>
      <h1>
        {/* highlight-start */}
        <Translate
          id="homepage.title"
          description="The homepage welcome message">
          Welcome to my website
        </Translate>
        {/* highlight-end */}
      </h1>
      <main>
        {/* highlight-start */}
        <Translate values={{firstName: 'Sébastien'}}>
          {'Welcome, {firstName}! How are you?'}
        </Translate>
        {/* highlight-end */}
      </main>
    </Layout>
  );
}
```

## Hooks {#hooks}

### `useDocusaurusContext` {#usedocusauruscontext}

React hook to access Docusaurus Context. Context contains `siteConfig` object from [docusaurus.config.js](api/docusaurus.config.js.md), and some additional site metadata.

```ts
type DocusaurusPluginVersionInformation =
  | {readonly type: 'package'; readonly version?: string}
  | {readonly type: 'project'}
  | {readonly type: 'local'}
  | {readonly type: 'synthetic'};

interface DocusaurusSiteMetadata {
  readonly docusaurusVersion: string;
  readonly siteVersion?: string;
  readonly pluginVersions: Record<string, DocusaurusPluginVersionInformation>;
}

interface I18nLocaleConfig {
  label: string;
  direction: string;
}

interface I18n {
  defaultLocale: string;
  locales: [string, ...string[]];
  currentLocale: string;
  localeConfigs: Record<string, I18nLocaleConfig>;
}

interface DocusaurusContext {
  siteConfig: DocusaurusConfig;
  siteMetadata: DocusaurusSiteMetadata;
  globalData: Record<string, unknown>;
  i18n: I18n;
  codeTranslations: Record<string, string>;
}
```

Usage example:

```jsx {5,8-10}
import React from 'react';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';

const MyComponent = () => {
  const {siteConfig, siteMetadata} = useDocusaurusContext();
  return (
    <div>
      <h1>{siteConfig.title}</h1>
      <div>{siteMetadata.siteVersion}</div>
      <div>{siteMetadata.docusaurusVersion}</div>
    </div>
  );
};
```

### `useIsBrowser` {#useIsBrowser}

Returns `true` when the React app has successfully hydrated in the browser.

:::caution

Use this hook instead of `typeof windows !== 'undefined'` in React rendering logic.

The first client-side render output (in the browser) **must be exactly the same** as the server-side render output (Node.js).

Not following this rule can lead to unexpected hydration behaviors, as described in [The Perils of Rehydration](https://www.joshwcomeau.com/react/the-perils-of-rehydration/).

:::

Usage example:

```jsx
import React from 'react';
import useIsBrowser from '@docusaurus/useIsBrowser';

const MyComponent = () => {
  // highlight-start
  const isBrowser = useIsBrowser();
  // highlight-end
  return <div>{isBrowser ? 'Client' : 'Server'}</div>;
};
```

### `useBaseUrl` {#usebaseurl}

React hook to prepend your site `baseUrl` to a string.

:::caution

**Don't use it for regular links!**

The `/baseUrl/` prefix is automatically added to all **absolute paths** by default:

- Markdown: `[link](/my/path)` will link to `/baseUrl/my/path`
- React: `<Link to="/my/path/">link</Link>` will link to `/baseUrl/my/path`

:::

#### Options {#options}

```ts
type BaseUrlOptions = {
  forcePrependBaseUrl: boolean;
  absolute: boolean;
};
```

#### Example usage: {#example-usage}

```jsx
import React from 'react';
import useBaseUrl from '@docusaurus/useBaseUrl';

const SomeImage = () => {
  // highlight-start
  const imgSrc = useBaseUrl('/img/myImage.png');
  // highlight-end
  return <img src={imgSrc} />;
};
```

:::tip

In most cases, you don't need `useBaseUrl`.

Prefer a `require()` call for [assets](./guides/markdown-features/markdown-features-assets.mdx):

```jsx
<img src={require('@site/static/img/myImage.png').default} />
```

:::

### `useBaseUrlUtils` {#usebaseurlutils}

Sometimes `useBaseUrl` is not good enough. This hook return additional utils related to your site's base url.

- `withBaseUrl`: useful if you need to add base urls to multiple urls at once.

```jsx
import React from 'react';
import {useBaseUrlUtils} from '@docusaurus/useBaseUrl';

const Component = () => {
  const urls = ['/a', '/b'];
  // highlight-start
  const {withBaseUrl} = useBaseUrlUtils();
  const urlsWithBaseUrl = urls.map(withBaseUrl);
  // highlight-end
  return <div>{/* ... */}</div>;
};
```

### `useGlobalData` {#useglobaldata}

React hook to access Docusaurus global data created by all the plugins.

Global data is namespaced by plugin name, and plugin id.

:::info

Plugin id is only useful when a plugin is used multiple times on the same site. Each plugin instance is able to create its own global data.

:::

```ts
type GlobalData = Record<
  PluginName,
  Record<
    PluginId, // "default" by default
    any // plugin-specific data
  >
>;
```

Usage example:

```jsx {2,5-7}
import React from 'react';
import useGlobalData from '@docusaurus/useGlobalData';

const MyComponent = () => {
  const globalData = useGlobalData();
  const myPluginData = globalData['my-plugin']['default'];
  return <div>{myPluginData.someAttribute}</div>;
};
```

:::tip

Inspect your site's global data at `./docusaurus/globalData.json`

:::

### `usePluginData` {#useplugindata}

Access global data created by a specific plugin instance.

This is the most convenient hook to access plugin global data, and should be used most of the time.

`pluginId` is optional if you don't use multi-instance plugins.

```ts
usePluginData(pluginName: string, pluginId?: string)
```

Usage example:

```jsx {2,5-6}
import React from 'react';
import {usePluginData} from '@docusaurus/useGlobalData';

const MyComponent = () => {
  const myPluginData = usePluginData('my-plugin');
  return <div>{myPluginData.someAttribute}</div>;
};
```

### `useAllPluginInstancesData` {#useallplugininstancesdata}

Access global data created by a specific plugin. Given a plugin name, it returns the data of all the plugins instances of that name, by plugin id.

```ts
useAllPluginInstancesData(pluginName: string)
```

Usage example:

```jsx {2,5-7}
import React from 'react';
import {useAllPluginInstancesData} from '@docusaurus/useGlobalData';

const MyComponent = () => {
  const allPluginInstancesData = useAllPluginInstancesData('my-plugin');
  const myPluginData = allPluginInstancesData['default'];
  return <div>{myPluginData.someAttribute}</div>;
};
```

## Functions {#functions}

### `interpolate` {#interpolate-1}

The imperative counterpart of the [`<Interpolate>`](#interpolate) component.

#### Signature {#signature}

```ts
// Simple string interpolation
function interpolate(text: string, values: Record<string, string>): string;

// JSX interpolation
function interpolate(
  text: string,
  values: Record<string, ReactNode>,
): ReactNode;
```

#### Example {#example-1}

```jsx
// highlight-start
import {interpolate} from '@docusaurus/Interpolate';
// highlight-end

const message = interpolate('Welcome {firstName}', {firstName: 'Sébastien'});
```

### `translate` {#translate-1}

The imperative counterpart of the [`<Translate>`](#translate) component. Also supporting [placeholders interpolation](#interpolate).

:::tip

Use the imperative API for the **rare cases** where a **component cannot be used**, such as:

- the page `title` metadata
- the `placeholder` props of form inputs
- the `aria-label` props for accessibility

:::

#### Signature {#signature-1}

```ts
function translate(
  translation: {message: string; id?: string; description?: string},
  values: Record<string, string>,
): string;
```

#### Example {#example-2}

```jsx title="src/pages/index.js"
import React from 'react';
import Layout from '@theme/Layout';

// highlight-start
import {translate} from '@docusaurus/Translate';
// highlight-end

export default function Home() {
  return (
    <Layout
      // highlight-start
      title={translate({message: 'My page meta title'})}
      // highlight-end
    >
      <img
        src={'https://docusaurus.io/logo.png'}
        aria-label={
          // highlight-start
          translate(
            {
              message: 'The logo of site {siteName}',
              // Optional
              id: 'homepage.logo.ariaLabel',
              description: 'The home page logo aria label',
            },
            {siteName: 'Docusaurus'},
          )
          // highlight-end
        }
      />
    </Layout>
  );
}
```

## Modules {#modules}

### `ExecutionEnvironment` {#executionenvironment}

A module which exposes a few boolean variables to check the current rendering environment.

:::caution

For React rendering logic, use [`useIsBrowser()`](#useIsBrowser) or [`<BrowserOnly>`](#browseronly) instead.

:::

Example:

```jsx
import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';

if (ExecutionEnvironment.canUseDOM) {
  require('lib-that-only-works-client-side');
}
```

| Field | Description |
| --- | --- |
| `ExecutionEnvironment.canUseDOM` | `true` if on client/browser, `false` on Node.js/prerendering. |
| `ExecutionEnvironment.canUseEventListeners` | `true` if on client and has `window.addEventListener`. |
| `ExecutionEnvironment.canUseIntersectionObserver` | `true` if on client and has `IntersectionObserver`. |
| `ExecutionEnvironment.canUseViewport` | `true` if on client and has `window.screen`. |

### `constants` {#constants}

A module exposing useful constants to client-side theme code.

```jsx
import {DEFAULT_PLUGIN_ID} from '@docusaurus/constants';
```

| Named export        | Value     |
| ------------------- | --------- |
| `DEFAULT_PLUGIN_ID` | `default` |
-												docs(v2): add docs skeleton and structure (#1412)

* docs(v2): add docs skeleton and structure

* docs(v2): add on

* docs(v2): move motivation into contributing

											
										
										
											2019-04-28 23:20:24 -04:00
+								---
 								id: docusaurus-core
-												docs(v2): Redirect component for easy redirect (#1913)

* docs(v2): Redirect component for easy redirect

* typo

* docs

* Update website/docs/docusaurus-core.md

Co-Authored-By: Alexey Pyltsyn <lex61rus@gmail.com>

* Update docusaurus-core.md

											
										
										
											2019-10-29 23:19:30 -04:00
+								title: Docusaurus Client API
-												docs(v2): more examples on lifecycle apis, cleanup (#2051)

* docs(v2): more examples on lifecycle apis, cleanup

* typo

											
										
										
											2019-11-25 13:31:57 -05:00
+								sidebar_label: Client API
-												docs(v2): add docs skeleton and structure (#1412)

* docs(v2): add docs skeleton and structure

* docs(v2): add on

* docs(v2): move motivation into contributing

											
										
										
											2019-04-28 23:20:24 -04:00
+								---
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
+								Docusaurus provides some APIs on the clients that can be helpful to you when building your site.
-												docs(v2): add docs skeleton and structure (#1412)

* docs(v2): add docs skeleton and structure

* docs(v2): add on

* docs(v2): move motivation into contributing

											
										
										
											2019-04-28 23:20:24 -04:00
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								## Components {#components}
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `<Head/>` {#head}
-												docs(v2): add docs skeleton and structure (#1412)

* docs(v2): add docs skeleton and structure

* docs(v2): add on

* docs(v2): move motivation into contributing

											
										
										
											2019-04-28 23:20:24 -04:00
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								This reusable React component will manage all of your changes to the document head. It takes plain HTML tags and outputs plain HTML tags and is beginner-friendly. It is a wrapper around [React Helmet](https://github.com/nfl/react-helmet).
-												docs(v2): refactor docs for better outline and welcoming PRs (#1641)

* docs(v2): refactor docs for better outline and welcoming PRs

* docs(v2): update docs

											
										
										
											2019-07-08 02:14:49 -04:00
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								Usage Example:
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								```jsx {2,5,10}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								import React from 'react';
 								import Head from '@docusaurus/Head';
 								const MySEO = () => (
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								  <Head>
 								    <meta property="og:description" content="My custom description" />
 								    <meta charSet="utf-8" />
 								    <title>My Title</title>
 								    <link rel="canonical" href="http://mysite.com/example" />
 								  </Head>
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								);
 								```
 								Nested or latter components will override duplicate usages:
-												docs(v2): code block line highlighting (#1904)

* docs(v2): code block line highlighting

* misc: update CHANGELOG

* misc: respond to review

* docs: add line highlighting to the template

											
										
										
											2019-10-29 02:59:24 -04:00
+								```jsx {2,5,8,11}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								<Parent>
 								  <Head>
 								    <title>My Title</title>
 								    <meta name="description" content="Helmet application" />
 								  </Head>
 								  <Child>
 								    <Head>
 								      <title>Nested Title</title>
 								      <meta name="description" content="Nested component" />
 								    </Head>
 								  </Child>
 								</Parent>
 								```
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								Outputs:
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
 								```html
 								<head>
 								  <title>Nested Title</title>
 								  <meta name="description" content="Nested component" />
 								</head>
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `<Link/>` {#link}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
 								This component enables linking to internal pages as well as a powerful performance feature called preloading. Preloading is used to prefetch resources so that the resources are fetched by the time the user navigates with this component. We use an `IntersectionObserver` to fetch a low-priority request when the `<Link>` is in the viewport and then use an `onMouseOver` event to trigger a high-priority request when it is likely that a user will navigate to the requested resource.
-												refactor(v2): use nav link component only where needed (#2585)


											
										
										
											2020-04-12 01:34:50 -04:00
+								The component is a wrapper around react-router’s `<Link>` component that adds useful enhancements specific to Docusaurus. All props are passed through to react-router’s `<Link>` component.
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
-												docs: mention Link can be used for external links (#5212)


											
										
										
											2021-07-23 06:24:03 -04:00
+								External links also work, and automatically have these props: `target="_blank" rel="noopener noreferrer"`.
-												docs(v2): code block line highlighting (#1904)

* docs(v2): code block line highlighting

* misc: update CHANGELOG

* misc: respond to review

* docs: add line highlighting to the template

											
										
										
											2019-10-29 02:59:24 -04:00
+								```jsx {2,7}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								import React from 'react';
 								import Link from '@docusaurus/Link';
 								const Page = () => (
 								  <div>
 								    <p>
 								      Check out my <Link to="/blog">blog</Link>!
 								    </p>
 								    <p>
-												docs: mention Link can be used for external links (#5212)


											
										
										
											2021-07-23 06:24:03 -04:00
+								      Follow me on <Link to="https://twitter.com/docusaurus">Twitter</Link>!
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								    </p>
 								  </div>
 								);
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### `to`: string {#to-string}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
 								The target location to navigate to. Example: `/docs/introduction`.
 								```jsx
 								<Link to="/courses" />
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `<Redirect/>` {#redirect}
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
 								Rendering a `<Redirect>` will navigate to a new location. The new location will override the current location in the history stack, like server-side redirects (HTTP 3xx) do. You can refer to [React Router's Redirect documentation](https://reacttraining.com/react-router/web/api/Redirect) for more info on available props.
 								Example usage:
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
+								```jsx {2,5}
 								import React from 'react';
 								import {Redirect} from '@docusaurus/router';
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								const Home = () => {
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
+								  return <Redirect to="/docs/test" />;
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								};
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
+								```
-												docs(v2): add router implementation note (#2935)


											
										
										
											2020-06-15 06:37:49 -04:00
+								:::note
 								`@docusaurus/router` implements [React Router](https://reacttraining.com/react-router/web/guides/quick-start) and supports its features.
 								:::
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `<BrowserOnly/>` {#browseronly}
-												feat(v2): add a way to exclude components from build-time prerendering (#2323)

* feat(v2): add a way to exclude components from SSR within JSX

* Update docusaurus-core.md

* Update and rename ClientOnly.js to BrowserOnly.js

* improve docs

* Improve naming

* Simplify realization

* Fix code style

* Fix docs

* Update docusaurus-core.md

Co-authored-by: Yangshun Tay <tay.yang.shun@gmail.com>
											
										
										
											2020-03-29 11:43:57 -04:00
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								The `<BrowserOnly>` component permits to render React components only in the browser, after the React app has hydrated.
-												feat(v2): add a way to exclude components from build-time prerendering (#2323)

* feat(v2): add a way to exclude components from SSR within JSX

* Update docusaurus-core.md

* Update and rename ClientOnly.js to BrowserOnly.js

* improve docs

* Improve naming

* Simplify realization

* Fix code style

* Fix docs

* Update docusaurus-core.md

Co-authored-by: Yangshun Tay <tay.yang.shun@gmail.com>
											
										
										
											2020-03-29 11:43:57 -04:00
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								:::tip
 								Use it for integrating with code that can't run in Node.js, because `window` or `document` objects are being accessed.
 								:::
 								#### Props {#browseronly-props}
 								- `children`: render function prop returning browser-only JSX. Will not be executed in Node.js
 								- `fallback` (optional): JSX to render on the server (Node.js) and until React hydration completes.
 								#### Example with code {#browseronly-example-code}
 								```jsx
 								// highlight-start
-												feat(v2): add a way to exclude components from build-time prerendering (#2323)

* feat(v2): add a way to exclude components from SSR within JSX

* Update docusaurus-core.md

* Update and rename ClientOnly.js to BrowserOnly.js

* improve docs

* Improve naming

* Simplify realization

* Fix code style

* Fix docs

* Update docusaurus-core.md

Co-authored-by: Yangshun Tay <tay.yang.shun@gmail.com>
											
										
										
											2020-03-29 11:43:57 -04:00
+								import BrowserOnly from '@docusaurus/BrowserOnly';
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								// highlight-end
-												feat(v2): add a way to exclude components from build-time prerendering (#2323)

* feat(v2): add a way to exclude components from SSR within JSX

* Update docusaurus-core.md

* Update and rename ClientOnly.js to BrowserOnly.js

* improve docs

* Improve naming

* Simplify realization

* Fix code style

* Fix docs

* Update docusaurus-core.md

Co-authored-by: Yangshun Tay <tay.yang.shun@gmail.com>
											
										
										
											2020-03-29 11:43:57 -04:00
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								const MyComponent = () => {
-												docs(v2): fix formatting

											
										
										
											2020-04-02 05:07:50 -04:00
+								  return (
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								    // highlight-start
 								    <BrowserOnly>
 								      {() => {
 								        <span>page url = {window.location.href}</span>;
 								      }}
 								    </BrowserOnly>
 								    // highlight-end
 								  );
 								};
 								```
 								#### Example with a library {#browseronly-example-library}
 								```jsx
 								// highlight-start
 								import BrowserOnly from '@docusaurus/BrowserOnly';
 								// highlight-end
 								const MyComponent = (props) => {
 								  return (
 								    // highlight-start
 								    <BrowserOnly fallback={<div>Loading...</div>}>
-												docs(v2): fix formatting

											
										
										
											2020-04-02 05:07:50 -04:00
+								      {() => {
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								        const LibComponent = require('some-lib').LibComponent;
 								        return <LibComponent {...props} />;
-												docs(v2): fix formatting

											
										
										
											2020-04-02 05:07:50 -04:00
+								      }}
 								    </BrowserOnly>
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								    // highlight-end
-												docs(v2): fix formatting

											
										
										
											2020-04-02 05:07:50 -04:00
+								  );
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								};
-												feat(v2): add a way to exclude components from build-time prerendering (#2323)

* feat(v2): add a way to exclude components from SSR within JSX

* Update docusaurus-core.md

* Update and rename ClientOnly.js to BrowserOnly.js

* improve docs

* Improve naming

* Simplify realization

* Fix code style

* Fix docs

* Update docusaurus-core.md

Co-authored-by: Yangshun Tay <tay.yang.shun@gmail.com>
											
										
										
											2020-03-29 11:43:57 -04:00
+								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `<Interpolate/>` {#interpolate}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
 								A simple interpolation component for text containing dynamic placeholders.
 								The placeholders will be replaced with the provided dynamic values and JSX elements of your choice (strings, links, styled elements...).
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								#### Props {#interpolate-props}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
 								- `children`: text containing interpolation placeholders like `{placeholderName}`
 								- `values`: object containing interpolation placeholder values
 								```jsx
 								import React from 'react';
 								import Link from '@docusaurus/Link';
 								import Interpolate from '@docusaurus/Interpolate';
 								export default function VisitMyWebsiteMessage() {
 								  return (
 								    // highlight-start
 								    <Interpolate
 								      values={{
 								        firstName: 'Sébastien',
 								        website: (
 								          <Link to="https://docusaurus.io" className="my-website-class">
 								            website
 								          </Link>
 								        ),
 								      }}>
 								      {'Hello, {firstName}! How are you? Take a look at my {website}'}
 								    </Interpolate>
 								    // highlight-end
 								  );
 								}
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `<Translate/>` {#translate}
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								When [localizing your site](./i18n/i18n-introduction.md), the `<Translate/>` component will allow providing **translation support to React components**, such as your homepage. The `<Translate>` component supports [interpolation](#interpolate).
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
-												docs(v2): fix incorrect anchor links in website (#5021)

* docs: fix anchor links for docusaurus write-translations

* docs: fix anchor links for docusaurus serve
											
										
										
											2021-06-20 15:16:17 -04:00
+								The translation strings will be extracted from your code with the [`docusaurus write-translations`](./cli.md#docusaurus-write-translations-sitedir) CLI and create a `code.json` translation file in `website/i18n/<locale>`.
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
 								:::note
 								The `<Translate/>` props **must be hardcoded strings**.
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								Apart the `values` prop used for interpolation, it is **not possible to use variables**, or the static extraction wouldn't work.
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
 								:::
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								#### Props {#translate-props}
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								- `children`: untranslated string in the default site locale (can contain [interpolation placeholders](#interpolate))
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
+								- `id`: optional value to use as key in JSON translation files
 								- `description`: optional text to help the translator
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								- `values`: optional object containing interpolation placeholder values
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### Example {#example}
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
-												docs(v2): fixed the directory of index.js (#4559)


											
										
										
											2021-04-05 12:56:14 -04:00
+								```jsx title="src/pages/index.js"
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
+								import React from 'react';
 								import Layout from '@theme/Layout';
 								// highlight-start
 								import Translate from '@docusaurus/Translate';
 								// highlight-end
 								export default function Home() {
 								  return (
 								    <Layout>
 								      <h1>
 								        {/* highlight-start */}
 								        <Translate
 								          id="homepage.title"
 								          description="The homepage welcome message">
 								          Welcome to my website
 								        </Translate>
 								        {/* highlight-end */}
 								      </h1>
 								      <main>
 								        {/* highlight-start */}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								        <Translate values={{firstName: 'Sébastien'}}>
 								          {'Welcome, {firstName}! How are you?'}
 								        </Translate>
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
+								        {/* highlight-end */}
 								      </main>
 								    </Layout>
 								  );
 								}
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								## Hooks {#hooks}
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `useDocusaurusContext` {#usedocusauruscontext}
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
-												feat(v2): warn user when there are conflicting routes (#3083)

* feat(v2): add warning for path override

* feat(v2): check all routes recursively

* docs(v2): add docs for conflicting routes

* style(v2): improve comments in code

* refactor(v2): remove unused lifecycle method from docs plugin

* Revert "refactor(v2): remove unused lifecycle method from docs plugin"

This reverts commit 8b2caaa0917f00b4706c6a135a7311db50991304.

* feat(v2): add option for changing duplicate path behavior

* feat(v2): decouple logging from logic and detect duplicate routes in one pass

* test(v2): fix failing tests

* test(v2): add tests for duplicateRoutes

* test(v2): add test for handleDuplicateRoutes

* style(v2): add else statement

* docs(v2): modify documentation for duplicate routes

* docs(v2): move doc into guides folder

* fix(v2): fix broken links

* docs(v2): move docs for docusaurus config into api folder

* style(v2): add comments

* refactor(v2): extract getFinalRoutes

* refactor(v2): scope getFinalRoutes to docusaurus package

* test(v2): remove obsolete snapshots

* docs(v2): remove some docs

* fix(v2): rerun github actions

* docs(v2): change slug of docs in api folder

* refactor(v2): extract out a reportMessage method

* refactor(v2): extract getAllFinalRoutes

* test(v2): replace snapshots with actual value

* style(v2): remove unnecessary comment and change type

* chore(v2): remove unused dependency

* style(v2): remove unused code

* Update packages/docusaurus/src/server/utils.ts

* Update website/docs/guides/creating-pages.md

Co-authored-by: Sébastien Lorber <slorber@users.noreply.github.com>
											
										
										
											2020-07-31 15:14:49 -04:00
+								React hook to access Docusaurus Context. Context contains `siteConfig` object from [docusaurus.config.js](api/docusaurus.config.js.md), and some additional site metadata.
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
 								```ts
-												feat(v2): useDocusaurusContext().siteMetadata (#3058)


											
										
										
											2020-07-16 06:46:21 -04:00
+								type DocusaurusPluginVersionInformation =
 								  | {readonly type: 'package'; readonly version?: string}
 								  | {readonly type: 'project'}
 								  | {readonly type: 'local'}
 								  | {readonly type: 'synthetic'};
 								interface DocusaurusSiteMetadata {
 								  readonly docusaurusVersion: string;
 								  readonly siteVersion?: string;
 								  readonly pluginVersions: Record<string, DocusaurusPluginVersionInformation>;
 								}
-												refactor: better typing + remove unnecessary eslint-disable (#5335)

* Initial work

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Fix a few errors

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Restore default value

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Update docs

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Use custom route config

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Address a few suggestions

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Revert logo change

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Restore key

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Oops

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Remove use of any

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Remove eslint-disable

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Put type reference back

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Remove

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>
											
										
										
											2021-08-11 10:07:17 -04:00
+								interface I18nLocaleConfig {
 								  label: string;
 								  direction: string;
 								}
 								interface I18n {
 								  defaultLocale: string;
 								  locales: [string, ...string[]];
 								  currentLocale: string;
 								  localeConfigs: Record<string, I18nLocaleConfig>;
 								}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								interface DocusaurusContext {
-												feat(v2): useDocusaurusContext().siteMetadata (#3058)


											
										
										
											2020-07-16 06:46:21 -04:00
+								  siteConfig: DocusaurusConfig;
 								  siteMetadata: DocusaurusSiteMetadata;
-												refactor: better typing + remove unnecessary eslint-disable (#5335)

* Initial work

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Fix a few errors

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Restore default value

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Update docs

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Use custom route config

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Address a few suggestions

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Revert logo change

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Restore key

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Oops

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Remove use of any

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Remove eslint-disable

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Put type reference back

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Remove

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>
											
										
										
											2021-08-11 10:07:17 -04:00
+								  globalData: Record<string, unknown>;
 								  i18n: I18n;
 								  codeTranslations: Record<string, string>;
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								}
 								```
 								Usage example:
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								```jsx {5,8-10}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								import React from 'react';
 								import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-												feat(v2): useDocusaurusContext().siteMetadata (#3058)


											
										
										
											2020-07-16 06:46:21 -04:00
+								const MyComponent = () => {
 								  const {siteConfig, siteMetadata} = useDocusaurusContext();
 								  return (
 								    <div>
 								      <h1>{siteConfig.title}</h1>
 								      <div>{siteMetadata.siteVersion}</div>
 								      <div>{siteMetadata.docusaurusVersion}</div>
 								    </div>
 								  );
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								};
 								```
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								### `useIsBrowser` {#useIsBrowser}
 								Returns `true` when the React app has successfully hydrated in the browser.
 								:::caution
 								Use this hook instead of `typeof windows !== 'undefined'` in React rendering logic.
 								The first client-side render output (in the browser) **must be exactly the same** as the server-side render output (Node.js).
 								Not following this rule can lead to unexpected hydration behaviors, as described in [The Perils of Rehydration](https://www.joshwcomeau.com/react/the-perils-of-rehydration/).
 								:::
 								Usage example:
 								```jsx
 								import React from 'react';
 								import useIsBrowser from '@docusaurus/useIsBrowser';
 								const MyComponent = () => {
 								  // highlight-start
 								  const isBrowser = useIsBrowser();
 								  // highlight-end
 								  return <div>{isBrowser ? 'Client' : 'Server'}</div>;
 								};
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `useBaseUrl` {#usebaseurl}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								React hook to prepend your site `baseUrl` to a string.
 								:::caution
 								**Don't use it for regular links!**
 								The `/baseUrl/` prefix is automatically added to all **absolute paths** by default:
 								- Markdown: `[link](/my/path)` will link to `/baseUrl/my/path`
 								- React: `<Link to="/my/path/">link</Link>` will link to `/baseUrl/my/path`
 								:::
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### Options {#options}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
-												feat(v2): allow specifying meta image for blog posts (#2856)

* feat(v2): allow specifying meta image for blog posts

* Update docs [skip ci]
											
										
										
											2020-06-02 03:48:22 -04:00
+								```ts
 								type BaseUrlOptions = {
 								  forcePrependBaseUrl: boolean;
 								  absolute: boolean;
 								};
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### Example usage: {#example-usage}
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								```jsx
-												feat(v2): add useBaseUrlUtils() hook (#3033)

* add useBaseUrlUtils

* fix code highlighted lines
											
										
										
											2020-07-08 11:51:59 -04:00
+								import React from 'react';
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								import useBaseUrl from '@docusaurus/useBaseUrl';
-												docs(v2): refactor docs for better outline and welcoming PRs (#1641)

* docs(v2): refactor docs for better outline and welcoming PRs

* docs(v2): update docs

											
										
										
											2019-07-08 02:14:49 -04:00
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								const SomeImage = () => {
 								  // highlight-start
 								  const imgSrc = useBaseUrl('/img/myImage.png');
 								  // highlight-end
 								  return <img src={imgSrc} />;
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								};
-												docs(v2): add docs on useful client api (#1890)

* docs(v2): add docs on useful client api

* Update docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

* Update website/docs/docusaurus-core.md

											
										
										
											2019-10-25 12:25:43 -04:00
+								```
-												docs(v2): Redirect component for easy redirect (#1913)

* docs(v2): Redirect component for easy redirect

* typo

* docs

* Update website/docs/docusaurus-core.md

Co-Authored-By: Alexey Pyltsyn <lex61rus@gmail.com>

* Update docusaurus-core.md

											
										
										
											2019-10-29 23:19:30 -04:00
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								:::tip
 								In most cases, you don't need `useBaseUrl`.
 								Prefer a `require()` call for [assets](./guides/markdown-features/markdown-features-assets.mdx):
 								```jsx
 								<img src={require('@site/static/img/myImage.png').default} />
 								```
 								:::
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `useBaseUrlUtils` {#usebaseurlutils}
-												feat(v2): add useBaseUrlUtils() hook (#3033)

* add useBaseUrlUtils

* fix code highlighted lines
											
										
										
											2020-07-08 11:51:59 -04:00
 								Sometimes `useBaseUrl` is not good enough. This hook return additional utils related to your site's base url.
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								- `withBaseUrl`: useful if you need to add base urls to multiple urls at once.
-												feat(v2): add useBaseUrlUtils() hook (#3033)

* add useBaseUrlUtils

* fix code highlighted lines
											
										
										
											2020-07-08 11:51:59 -04:00
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								```jsx
-												feat(v2): add useBaseUrlUtils() hook (#3033)

* add useBaseUrlUtils

* fix code highlighted lines
											
										
										
											2020-07-08 11:51:59 -04:00
+								import React from 'react';
 								import {useBaseUrlUtils} from '@docusaurus/useBaseUrl';
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								const Component = () => {
-												feat(v2): add useBaseUrlUtils() hook (#3033)

* add useBaseUrlUtils

* fix code highlighted lines
											
										
										
											2020-07-08 11:51:59 -04:00
+								  const urls = ['/a', '/b'];
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								  // highlight-start
-												feat(v2): add useBaseUrlUtils() hook (#3033)

* add useBaseUrlUtils

* fix code highlighted lines
											
										
										
											2020-07-08 11:51:59 -04:00
+								  const {withBaseUrl} = useBaseUrlUtils();
 								  const urlsWithBaseUrl = urls.map(withBaseUrl);
-												docs(v2): do not recommend using useBaseUrl() hook in most cases (#4126)

* doc: suggest not using useBaseUrl most of the time

* doc: suggest not using useBaseUrl most of the time
											
										
										
											2021-01-29 13:10:38 -05:00
+								  // highlight-end
 								  return <div>{/* ... */}</div>;
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								};
-												feat(v2): add useBaseUrlUtils() hook (#3033)

* add useBaseUrlUtils

* fix code highlighted lines
											
										
										
											2020-07-08 11:51:59 -04:00
+								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `useGlobalData` {#useglobaldata}
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
 								React hook to access Docusaurus global data created by all the plugins.
 								Global data is namespaced by plugin name, and plugin id.
 								:::info
 								Plugin id is only useful when a plugin is used multiple times on the same site. Each plugin instance is able to create its own global data.
 								:::
 								```ts
 								type GlobalData = Record<
 								  PluginName,
 								  Record<
 								    PluginId, // "default" by default
 								    any // plugin-specific data
 								  >
 								>;
 								```
 								Usage example:
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								```jsx {2,5-7}
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
+								import React from 'react';
 								import useGlobalData from '@docusaurus/useGlobalData';
 								const MyComponent = () => {
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								  const globalData = useGlobalData();
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
+								  const myPluginData = globalData['my-plugin']['default'];
 								  return <div>{myPluginData.someAttribute}</div>;
 								};
 								```
 								:::tip
 								Inspect your site's global data at `./docusaurus/globalData.json`
 								:::
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `usePluginData` {#useplugindata}
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
 								Access global data created by a specific plugin instance.
 								This is the most convenient hook to access plugin global data, and should be used most of the time.
 								`pluginId` is optional if you don't use multi-instance plugins.
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								```ts
 								usePluginData(pluginName: string, pluginId?: string)
 								```
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
+								Usage example:
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								```jsx {2,5-6}
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
+								import React from 'react';
 								import {usePluginData} from '@docusaurus/useGlobalData';
 								const MyComponent = () => {
 								  const myPluginData = usePluginData('my-plugin');
 								  return <div>{myPluginData.someAttribute}</div>;
 								};
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `useAllPluginInstancesData` {#useallplugininstancesdata}
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
-												docs: various fixes and improvements (#3546)


											
										
										
											2020-10-07 06:39:47 -04:00
+								Access global data created by a specific plugin. Given a plugin name, it returns the data of all the plugins instances of that name, by plugin id.
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								```ts
 								useAllPluginInstancesData(pluginName: string)
 								```
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
+								Usage example:
-												docs(v2): update Client API docs page (#3835)

* docs(V2): update Client API docs page

* apply review suggestion, fix useGlobalData example
											
										
										
											2020-11-30 08:39:51 -05:00
+								```jsx {2,5-7}
-												feat(v2): global data + useGlobalData + docs versions dropdown (#2971)

* doc components initial simplification

* doc components initial simplification

* add docContext test

* Add poc of global data system + use it in the theme

* Revert "doc components initial simplification"

This reverts commit f657b4c4

* revert useless changes

* avoid loosing context on docs switch

* fix docs tests

* fix @generated/globalData ts declaration / es import

* typo

* revert bad commit

* refactor navbar in multiple parts + add navbar item types validation + try to fix remaining merge bugs

* add missing watch mode for plugin debug

* fix docs global data integration, move related hooks to docs plugin + convert to TS

* change versions link label

* fix activeClassName react warning

* improve docs global data system + contextual navbar dropdown

* fix bug preventing the deployment

* refactor the global data system to namespace automatically by plugin name + plugin id

* proper NavbarItem comp

* fix tests

* fix snapshot

* extract theme config schema in separate file + rename navbar links to navbar items

* minor typos

* polish docs components/api

* polish useDocs api surface

* fix the docs version suggestions comp + data

* refactors + add docsClientUtils unit tests

* Add documentation

* typo

* Add check for duplicate plugin ids detection

* multi-instance: createData plugin data should be namespaced by plugin instance id

* remove attempt for multi-instance support
											
										
										
											2020-07-21 05:16:08 -04:00
+								import React from 'react';
 								import {useAllPluginInstancesData} from '@docusaurus/useGlobalData';
 								const MyComponent = () => {
 								  const allPluginInstancesData = useAllPluginInstancesData('my-plugin');
 								  const myPluginData = allPluginInstancesData['default'];
 								  return <div>{myPluginData.someAttribute}</div>;
 								};
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								## Functions {#functions}
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `interpolate` {#interpolate-1}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
 								The imperative counterpart of the [`<Interpolate>`](#interpolate) component.
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### Signature {#signature}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
 								```ts
 								// Simple string interpolation
 								function interpolate(text: string, values: Record<string, string>): string;
 								// JSX interpolation
 								function interpolate(
 								  text: string,
 								  values: Record<string, ReactNode>,
 								): ReactNode;
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### Example {#example-1}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
 								```jsx
 								// highlight-start
 								import {interpolate} from '@docusaurus/Interpolate';
 								// highlight-end
 								const message = interpolate('Welcome {firstName}', {firstName: 'Sébastien'});
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `translate` {#translate-1}
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								The imperative counterpart of the [`<Translate>`](#translate) component. Also supporting [placeholders interpolation](#interpolate).
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
 								:::tip
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								Use the imperative API for the **rare cases** where a **component cannot be used**, such as:
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
 								- the page `title` metadata
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								- the `placeholder` props of form inputs
 								- the `aria-label` props for accessibility
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
 								:::
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### Signature {#signature-1}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
 								```ts
 								function translate(
 								  translation: {message: string; id?: string; description?: string},
 								  values: Record<string, string>,
 								): string;
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								#### Example {#example-2}
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
-												docs(v2): fixed the directory of index.js (#4559)


											
										
										
											2021-04-05 12:56:14 -04:00
+								```jsx title="src/pages/index.js"
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
+								import React from 'react';
 								import Layout from '@theme/Layout';
 								// highlight-start
 								import {translate} from '@docusaurus/Translate';
 								// highlight-end
 								export default function Home() {
 								  return (
 								    <Layout
 								      // highlight-start
 								      title={translate({message: 'My page meta title'})}
 								      // highlight-end
 								    >
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								      <img
 								        src={'https://docusaurus.io/logo.png'}
 								        aria-label={
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
+								          // highlight-start
-												feat(v2): Add Interpolate / interpolate APIs + complete theme translations (#4295)

* WIP: refactor team profile cards

* Add Interpolate / interpolate APIs

* Add interpolate snapshot test

* comments

* fix Interpolate TS types

* Interpolate should handle numbers and other JS types

* translate BlogPostItem

* interpolate translate() fn + add translations for blog post tag header

* localize the LastUpdated component

* translate DocVersionSuggestions

* fix test

* add some new translations

* Add node script to easily update the theme default translations

* fix translation extractor bug due to translate() dynamic values

* use ICU placeholder syntax

* refactor month key

* order

* team  page translation improvements

* Add interpolation doc + improve i18n doc
											
										
										
											2021-02-26 07:19:51 -05:00
+								          translate(
 								            {
 								              message: 'The logo of site {siteName}',
 								              // Optional
 								              id: 'homepage.logo.ariaLabel',
 								              description: 'The home page logo aria label',
 								            },
 								            {siteName: 'Docusaurus'},
 								          )
-												docs(v2): i18n doc + polish (#4014)

* add some initial i18n doc

* i18n doc progress

* i18n tutorial progress

* i18n tutorial progress

* polish Crowdin docs

* i18n sidebar in guides

* polish crowdin doc

* update Crowdin doc a bit

* fix annoying relative link to global site resource in template (breaks i18n tutorial)

* template: use simpler export for homepage

* add markdown page example

* rename mdx.md to interactiveDoc.mdx

* update bootstrap/facebook templates too

* sync init template package scripts

* add slug frontmatter doc

* improve i18n doc

* complete i18n doc

* temporarily enable the localeDropdown

* doc typo

* improve the i18n doc

* Add Git i18n doc

* add missing "--" for npm run options (unfortunately they don't get stripped by npm2yarn, and are required foor npm)

* improve a bit the Crowdin doc
											
										
										
											2021-01-19 11:26:31 -05:00
+								          // highlight-end
 								        }
 								      />
 								    </Layout>
 								  );
 								}
 								```
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								## Modules {#modules}
-												docs(v2): Redirect component for easy redirect (#1913)

* docs(v2): Redirect component for easy redirect

* typo

* docs

* Update website/docs/docusaurus-core.md

Co-Authored-By: Alexey Pyltsyn <lex61rus@gmail.com>

* Update docusaurus-core.md

											
										
										
											2019-10-29 23:19:30 -04:00
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `ExecutionEnvironment` {#executionenvironment}
-												docs(v2): Redirect component for easy redirect (#1913)

* docs(v2): Redirect component for easy redirect

* typo

* docs

* Update website/docs/docusaurus-core.md

Co-Authored-By: Alexey Pyltsyn <lex61rus@gmail.com>

* Update docusaurus-core.md

											
										
										
											2019-10-29 23:19:30 -04:00
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								A module which exposes a few boolean variables to check the current rendering environment.
-												docs(v2): Redirect component for easy redirect (#1913)

* docs(v2): Redirect component for easy redirect

* typo

* docs

* Update website/docs/docusaurus-core.md

Co-Authored-By: Alexey Pyltsyn <lex61rus@gmail.com>

* Update docusaurus-core.md

											
										
										
											2019-10-29 23:19:30 -04:00
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								:::caution
 								For React rendering logic, use [`useIsBrowser()`](#useIsBrowser) or [`<BrowserOnly>`](#browseronly) instead.
 								:::
 								Example:
 								```jsx
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
+								import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';
-												docs(v2): Redirect component for easy redirect (#1913)

* docs(v2): Redirect component for easy redirect

* typo

* docs

* Update website/docs/docusaurus-core.md

Co-Authored-By: Alexey Pyltsyn <lex61rus@gmail.com>

* Update docusaurus-core.md

											
										
										
											2019-10-29 23:19:30 -04:00
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								if (ExecutionEnvironment.canUseDOM) {
 								  require('lib-that-only-works-client-side');
 								}
-												docs(v2): Redirect component for easy redirect (#1913)

* docs(v2): Redirect component for easy redirect

* typo

* docs

* Update website/docs/docusaurus-core.md

Co-Authored-By: Alexey Pyltsyn <lex61rus@gmail.com>

* Update docusaurus-core.md

											
										
										
											2019-10-29 23:19:30 -04:00
+								```
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
 								| Field | Description |
 								| --- | --- |
-												refactor(core): replace useDocusaurusContext().isClient by useIsBrowser() (#5349)

* extract separate useIsClient() hook

* for consistency, rename to `useIsBrowser`

* useless return

* improve doc for BrowserOnly

* update snapshot

* polish
											
										
										
											2021-08-12 13:02:29 -04:00
+								| `ExecutionEnvironment.canUseDOM` | `true` if on client/browser, `false` on Node.js/prerendering. |
-												feat(v2): add ExecutionEnvironment API (#2296)

* feat(v2): add ExecutionEnvironment API

* remove redundant code

											
										
										
											2020-02-18 20:22:14 -05:00
+								| `ExecutionEnvironment.canUseEventListeners` | `true` if on client and has `window.addEventListener`. |
 								| `ExecutionEnvironment.canUseIntersectionObserver` | `true` if on client and has `IntersectionObserver`. |
 								| `ExecutionEnvironment.canUseViewport` | `true` if on client and has `window.screen`. |
-												feat(v2): persist docs preferred version (#3543)

* persist docs preferred version

* add proper implementation for useDocsPreferredVersion

* add proper implementation for useDocsPreferredVersion

* useDocsPreferredVersion => make localstorage read only after mount

* why @docusaurus/constants can't work?

* fix weird TS issue when not duplicating constants

* add basic @docusaurus/constants doc

* attempt to fix docs-only mode where we should not call useDocs hooks

* attempt to fix docs-only mode where we should not call useDocs hooks

* fix children

* encapsulate hacky isDocsPluginEnabled in docsUtils

* use same priority order for all navbar items: activeVersion ?? preferredVersion ?? latestVersion
											
										
										
											2020-10-12 12:56:24 -04:00
-												docs(v2): use explicit heading IDs (#4460)


											
										
										
											2021-03-19 06:00:41 -04:00
+								### `constants` {#constants}
-												feat(v2): persist docs preferred version (#3543)

* persist docs preferred version

* add proper implementation for useDocsPreferredVersion

* add proper implementation for useDocsPreferredVersion

* useDocsPreferredVersion => make localstorage read only after mount

* why @docusaurus/constants can't work?

* fix weird TS issue when not duplicating constants

* add basic @docusaurus/constants doc

* attempt to fix docs-only mode where we should not call useDocs hooks

* attempt to fix docs-only mode where we should not call useDocs hooks

* fix children

* encapsulate hacky isDocsPluginEnabled in docsUtils

* use same priority order for all navbar items: activeVersion ?? preferredVersion ?? latestVersion
											
										
										
											2020-10-12 12:56:24 -04:00
 								A module exposing useful constants to client-side theme code.
 								```jsx
 								import {DEFAULT_PLUGIN_ID} from '@docusaurus/constants';
 								```
 								| Named export        | Value     |
 								| ------------------- | --------- |
 								| `DEFAULT_PLUGIN_ID` | `default` |