@docusaurus/theme-classic 3.10.2 → 4.0.0-canary-6809

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/lib/nprogress.css +2 -1
  2. package/lib/theme/Admonition/index.js +1 -0
  3. package/lib/theme/AnnouncementBar/Content/index.js +0 -1
  4. package/lib/theme/AnnouncementBar/styles.module.css +1 -1
  5. package/lib/theme/BlogPostItem/Header/Title/styles.module.css +1 -1
  6. package/lib/theme/BlogSidebar/Desktop/styles.module.css +1 -1
  7. package/lib/theme/BlogTagsPostsPage/index.js +2 -6
  8. package/lib/theme/CodeBlock/Content/index.js +3 -4
  9. package/lib/theme/ContentVisibility/Unlisted/index.js +8 -1
  10. package/lib/theme/DocCard/index.js +1 -1
  11. package/lib/theme/DocCategoryGeneratedIndexPage/styles.module.css +1 -1
  12. package/lib/theme/DocItem/Layout/styles.module.css +1 -1
  13. package/lib/theme/DocItem/TOC/Mobile/styles.module.css +1 -1
  14. package/lib/theme/DocRoot/Layout/Main/styles.module.css +1 -1
  15. package/lib/theme/DocRoot/Layout/Sidebar/ExpandButton/styles.module.css +1 -1
  16. package/lib/theme/DocRoot/Layout/Sidebar/styles.module.css +1 -1
  17. package/lib/theme/DocSidebar/Desktop/CollapseButton/styles.module.css +1 -1
  18. package/lib/theme/DocSidebar/Desktop/Content/styles.module.css +2 -1
  19. package/lib/theme/DocSidebar/Desktop/styles.module.css +1 -1
  20. package/lib/theme/DocSidebarItem/Category/index.js +3 -1
  21. package/lib/theme/DocSidebarItem/Html/index.js +0 -1
  22. package/lib/theme/DocSidebarItem/Html/styles.module.css +1 -1
  23. package/lib/theme/DocTagDocListPage/index.js +3 -6
  24. package/lib/theme/EditMetaRow/styles.module.css +1 -1
  25. package/lib/theme/ErrorPageContent.js +7 -17
  26. package/lib/theme/Footer/Copyright/index.js +0 -1
  27. package/lib/theme/Footer/Links/MultiColumn/index.js +0 -1
  28. package/lib/theme/Footer/Links/Simple/index.js +0 -1
  29. package/lib/theme/Mermaid.js +1 -1
  30. package/lib/theme/Navbar/Content/styles.module.css +1 -1
  31. package/lib/theme/Navbar/MobileSidebar/Layout/index.js +2 -13
  32. package/lib/theme/Navbar/Search/styles.module.css +2 -2
  33. package/lib/theme/SearchBar.js +1 -1
  34. package/lib/theme/TOC/styles.module.css +1 -1
  35. package/lib/theme/prism-include-languages.js +22 -24
  36. package/package.json +33 -34
  37. package/src/nprogress.css +2 -1
  38. package/src/options.ts +2 -2
  39. package/src/theme/Admonition/index.tsx +1 -0
  40. package/src/theme/AnnouncementBar/Content/index.tsx +0 -1
  41. package/src/theme/AnnouncementBar/styles.module.css +1 -1
  42. package/src/theme/BlogPostItem/Header/Title/styles.module.css +1 -1
  43. package/src/theme/BlogSidebar/Desktop/styles.module.css +1 -1
  44. package/src/theme/BlogTagsPostsPage/index.tsx +2 -6
  45. package/src/theme/CodeBlock/Content/index.tsx +11 -14
  46. package/src/theme/ContentVisibility/Unlisted/index.tsx +9 -1
  47. package/src/theme/DocCard/index.tsx +1 -1
  48. package/src/theme/DocCategoryGeneratedIndexPage/styles.module.css +1 -1
  49. package/src/theme/DocItem/Layout/styles.module.css +1 -1
  50. package/src/theme/DocItem/TOC/Mobile/styles.module.css +1 -1
  51. package/src/theme/DocRoot/Layout/Main/styles.module.css +1 -1
  52. package/src/theme/DocRoot/Layout/Sidebar/ExpandButton/styles.module.css +1 -1
  53. package/src/theme/DocRoot/Layout/Sidebar/styles.module.css +1 -1
  54. package/src/theme/DocSidebar/Desktop/CollapseButton/styles.module.css +1 -1
  55. package/src/theme/DocSidebar/Desktop/Content/styles.module.css +2 -1
  56. package/src/theme/DocSidebar/Desktop/styles.module.css +1 -1
  57. package/src/theme/DocSidebarItem/Category/index.tsx +3 -1
  58. package/src/theme/DocSidebarItem/Html/index.tsx +0 -1
  59. package/src/theme/DocSidebarItem/Html/styles.module.css +1 -1
  60. package/src/theme/DocTagDocListPage/index.tsx +3 -6
  61. package/src/theme/EditMetaRow/styles.module.css +1 -1
  62. package/src/theme/Footer/Copyright/index.tsx +0 -1
  63. package/src/theme/Footer/Links/MultiColumn/index.tsx +0 -1
  64. package/src/theme/Footer/Links/Simple/index.tsx +0 -1
  65. package/src/theme/Navbar/Content/styles.module.css +1 -1
  66. package/src/theme/Navbar/MobileSidebar/Layout/index.tsx +2 -14
  67. package/src/theme/Navbar/Search/styles.module.css +2 -2
  68. package/src/theme/TOC/styles.module.css +1 -1
  69. package/src/theme/prism-include-languages.ts +2 -2
  70. package/src/theme-classic.d.ts +1 -8
  71. package/lib/theme/ThemedImage/styles.module.css +0 -18
  72. package/src/theme/ThemedImage/styles.module.css +0 -18
package/lib/nprogress.css CHANGED
@@ -34,7 +34,8 @@
34
34
  right: 0;
35
35
  width: 100px;
36
36
  height: 100%;
37
- box-shadow: 0 0 10px var(--docusaurus-progress-bar-color),
37
+ box-shadow:
38
+ 0 0 10px var(--docusaurus-progress-bar-color),
38
39
  0 0 5px var(--docusaurus-progress-bar-color);
39
40
  opacity: 1;
40
41
  transform: rotate(3deg) translate(0, -4px);
@@ -20,5 +20,6 @@ function getAdmonitionTypeComponent(type) {
20
20
  export default function Admonition(unprocessedProps) {
21
21
  const props = processAdmonitionProps(unprocessedProps);
22
22
  const AdmonitionTypeComponent = getAdmonitionTypeComponent(props.type);
23
+ // eslint-disable-next-line react-hooks/static-components
23
24
  return <AdmonitionTypeComponent {...props} />;
24
25
  }
@@ -16,7 +16,6 @@ export default function AnnouncementBarContent(props) {
16
16
  {...props}
17
17
  className={clsx(styles.content, props.className)}
18
18
  // Developer provided the HTML, so assume it's safe.
19
- // eslint-disable-next-line react/no-danger
20
19
  dangerouslySetInnerHTML={{__html: content}}
21
20
  />
22
21
  );
@@ -50,7 +50,7 @@ html[data-announcement-bar-initially-dismissed='true'] .announcementBar {
50
50
  }
51
51
  }
52
52
 
53
- @media (min-width: 997px) {
53
+ @media (width >= 997px) {
54
54
  :root {
55
55
  --docusaurus-announcement-bar-height: 30px;
56
56
  }
@@ -12,7 +12,7 @@
12
12
  /**
13
13
  Blog post title should be smaller on smaller devices
14
14
  **/
15
- @media (max-width: 576px) {
15
+ @media (width <= 576px) {
16
16
  .title {
17
17
  font-size: 2rem;
18
18
  }
@@ -38,7 +38,7 @@
38
38
  color: var(--ifm-color-primary) !important;
39
39
  }
40
40
 
41
- @media (max-width: 996px) {
41
+ @media (width <= 996px) {
42
42
  .sidebar {
43
43
  display: none;
44
44
  }
@@ -6,10 +6,10 @@
6
6
  */
7
7
  import React from 'react';
8
8
  import clsx from 'clsx';
9
- import Translate from '@docusaurus/Translate';
10
9
  import {
11
10
  PageMetadata,
12
11
  HtmlClassNameProvider,
12
+ TagsPageLinkLabel,
13
13
  ThemeClassNames,
14
14
  } from '@docusaurus/theme-common';
15
15
  import {useBlogTagsPostsPageTitle} from '@docusaurus/theme-common/internal';
@@ -38,11 +38,7 @@ function BlogTagsPostsPageContent({tag, items, sidebar, listMetadata}) {
38
38
  <Heading as="h1">{title}</Heading>
39
39
  {tag.description && <p>{tag.description}</p>}
40
40
  <Link href={tag.allTagsPath}>
41
- <Translate
42
- id="theme.tags.tagsPageLink"
43
- description="The label of the link targeting the tag list page">
44
- View All Tags
45
- </Translate>
41
+ <TagsPageLinkLabel />
46
42
  </Link>
47
43
  </header>
48
44
  <BlogPostItems items={items} />
@@ -11,18 +11,17 @@ import {usePrismTheme} from '@docusaurus/theme-common';
11
11
  import {Highlight} from 'prism-react-renderer';
12
12
  import Line from '@theme/CodeBlock/Line';
13
13
  import styles from './styles.module.css';
14
- // TODO Docusaurus v4: remove useless forwardRef
15
- const Pre = React.forwardRef((props, ref) => {
14
+ function Pre({className, ref, ...props}) {
16
15
  return (
17
16
  <pre
18
17
  ref={ref}
19
18
  /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
20
19
  tabIndex={0}
21
20
  {...props}
22
- className={clsx(props.className, styles.codeBlock, 'thin-scrollbar')}
21
+ className={clsx(className, styles.codeBlock, 'thin-scrollbar')}
23
22
  />
24
23
  );
25
- });
24
+ }
26
25
  function Code(props) {
27
26
  const {metadata} = useCodeBlockContext();
28
27
  return (
@@ -6,13 +6,20 @@
6
6
  */
7
7
  import React from 'react';
8
8
  import clsx from 'clsx';
9
+ import Head from '@docusaurus/Head';
9
10
  import {
10
11
  ThemeClassNames,
11
12
  UnlistedBannerTitle,
12
13
  UnlistedBannerMessage,
13
- UnlistedMetadata,
14
14
  } from '@docusaurus/theme-common';
15
15
  import Admonition from '@theme/Admonition';
16
+ function UnlistedMetadata() {
17
+ return (
18
+ <Head>
19
+ <meta name="robots" content="noindex, nofollow" />
20
+ </Head>
21
+ );
22
+ }
16
23
  function UnlistedBanner({className}) {
17
24
  return (
18
25
  <Admonition
@@ -17,7 +17,7 @@ import isInternalUrl from '@docusaurus/isInternalUrl';
17
17
  import Layout from '@theme/DocCard/Layout';
18
18
  function getFallbackEmojiIcon(item) {
19
19
  if (item.type === 'category') {
20
- return '🗃';
20
+ return '🗃️';
21
21
  }
22
22
  return isInternalUrl(item.href) ? '📄️' : '🔗';
23
23
  }
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .generatedIndexPage {
10
10
  max-width: 75% !important;
11
11
  }
@@ -10,7 +10,7 @@
10
10
  margin-top: 0;
11
11
  }
12
12
 
13
- @media (min-width: 997px) {
13
+ @media (width >= 997px) {
14
14
  .docItemCol {
15
15
  max-width: 75% !important;
16
16
  }
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  /* Prevent hydration FOUC, as the mobile TOC needs to be server-rendered */
10
10
  .tocMobile {
11
11
  display: none;
@@ -10,7 +10,7 @@
10
10
  width: 100%;
11
11
  }
12
12
 
13
- @media (min-width: 997px) {
13
+ @media (width >= 997px) {
14
14
  .docMainContainer {
15
15
  flex-grow: 1;
16
16
  max-width: calc(100% - var(--doc-sidebar-width));
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .expandButton {
10
10
  position: absolute;
11
11
  top: 0;
@@ -14,7 +14,7 @@
14
14
  display: none;
15
15
  }
16
16
 
17
- @media (min-width: 997px) {
17
+ @media (width >= 997px) {
18
18
  .docSidebarContainer {
19
19
  display: block;
20
20
  width: var(--doc-sidebar-width);
@@ -15,7 +15,7 @@
15
15
  --docusaurus-collapse-button-bg-hover: rgb(255 255 255 / 10%);
16
16
  }
17
17
 
18
- @media (min-width: 997px) {
18
+ @media (width >= 997px) {
19
19
  .collapseSidebarButton {
20
20
  display: block !important;
21
21
  background-color: var(--docusaurus-collapse-button-bg);
@@ -5,11 +5,12 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .menu {
10
10
  flex-grow: 1;
11
11
  padding: 0.5rem;
12
12
  }
13
+
13
14
  @supports (scrollbar-gutter: stable) {
14
15
  .menu {
15
16
  padding: 0.5rem 0 0.5rem 0.5rem;
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .sidebar {
10
10
  display: flex;
11
11
  flex-direction: column;
@@ -238,7 +238,9 @@ function DocSidebarItemCategoryCollapsible({
238
238
  aria-current={isCurrentPage ? 'page' : undefined}
239
239
  role={collapsible && !href ? 'button' : undefined}
240
240
  aria-expanded={collapsible && !href ? !collapsed : undefined}
241
- href={collapsible ? hrefWithSSRFallback ?? '#' : hrefWithSSRFallback}
241
+ href={
242
+ collapsible ? (hrefWithSSRFallback ?? '#') : hrefWithSSRFallback
243
+ }
242
244
  {...props}>
243
245
  <CategoryLinkLabel label={label} />
244
246
  </Link>
@@ -19,7 +19,6 @@ export default function DocSidebarItemHtml({item, level, index}) {
19
19
  className,
20
20
  )}
21
21
  key={index}
22
- // eslint-disable-next-line react/no-danger
23
22
  dangerouslySetInnerHTML={{__html: value}}
24
23
  />
25
24
  );
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .menuHtmlItem {
10
10
  padding: var(--ifm-menu-link-padding-vertical)
11
11
  var(--ifm-menu-link-padding-horizontal);
@@ -11,9 +11,10 @@ import {
11
11
  PageMetadata,
12
12
  HtmlClassNameProvider,
13
13
  ThemeClassNames,
14
+ TagsPageLinkLabel,
14
15
  usePluralForm,
15
16
  } from '@docusaurus/theme-common';
16
- import Translate, {translate} from '@docusaurus/Translate';
17
+ import {translate} from '@docusaurus/Translate';
17
18
  import SearchMetadata from '@theme/SearchMetadata';
18
19
  import Unlisted from '@theme/ContentVisibility/Unlisted';
19
20
  import Heading from '@theme/Heading';
@@ -75,11 +76,7 @@ function DocTagDocListPageContent({tag, title}) {
75
76
  <Heading as="h1">{title}</Heading>
76
77
  {tag.description && <p>{tag.description}</p>}
77
78
  <Link href={tag.allTagsPath}>
78
- <Translate
79
- id="theme.tags.tagsPageLink"
80
- description="The label of the link targeting the tag list page">
81
- View all tags
82
- </Translate>
79
+ <TagsPageLinkLabel />
83
80
  </Link>
84
81
  </header>
85
82
  <section className="margin-vert--lg">
@@ -11,7 +11,7 @@
11
11
  margin-top: 0.2rem;
12
12
  }
13
13
 
14
- @media (min-width: 997px) {
14
+ @media (width >= 997px) {
15
15
  .lastUpdated {
16
16
  text-align: right;
17
17
  }
@@ -6,35 +6,25 @@
6
6
  */
7
7
  import React from 'react';
8
8
  import Translate from '@docusaurus/Translate';
9
- import {
10
- ErrorBoundaryError,
11
- ErrorBoundaryTryAgainButton,
12
- } from '@docusaurus/theme-common';
9
+ import { ErrorBoundaryError, ErrorBoundaryTryAgainButton, } from '@docusaurus/theme-common';
13
10
  import Heading from '@theme/Heading';
14
- export default function ErrorPageContent({error, tryAgain}) {
15
- return (
16
- <main className="container margin-vert--xl">
11
+ export default function ErrorPageContent({ error, tryAgain }) {
12
+ return (<main className="container margin-vert--xl">
17
13
  <div className="row">
18
14
  <div className="col col--6 col--offset-3">
19
15
  <Heading as="h1" className="hero__title">
20
- <Translate
21
- id="theme.ErrorPageContent.title"
22
- description="The title of the fallback page when the page crashed">
16
+ <Translate id="theme.ErrorPageContent.title" description="The title of the fallback page when the page crashed">
23
17
  This page crashed.
24
18
  </Translate>
25
19
  </Heading>
26
20
  <div className="margin-vert--lg">
27
- <ErrorBoundaryTryAgainButton
28
- onClick={tryAgain}
29
- className="button button--primary shadow--lw"
30
- />
21
+ <ErrorBoundaryTryAgainButton onClick={tryAgain} className="button button--primary shadow--lw"/>
31
22
  </div>
32
23
  <hr />
33
24
  <div className="margin-vert--md">
34
- <ErrorBoundaryError error={error} />
25
+ <ErrorBoundaryError error={error}/>
35
26
  </div>
36
27
  </div>
37
28
  </div>
38
- </main>
39
- );
29
+ </main>);
40
30
  }
@@ -10,7 +10,6 @@ export default function FooterCopyright({copyright}) {
10
10
  <div
11
11
  className="footer__copyright"
12
12
  // Developer provided the HTML, so assume it's safe.
13
- // eslint-disable-next-line react/no-danger
14
13
  dangerouslySetInnerHTML={{__html: copyright}}
15
14
  />
16
15
  );
@@ -13,7 +13,6 @@ function ColumnLinkItem({item}) {
13
13
  <li
14
14
  className={clsx('footer__item', item.className)}
15
15
  // Developer provided the HTML, so assume it's safe.
16
- // eslint-disable-next-line react/no-danger
17
16
  dangerouslySetInnerHTML={{__html: item.html}}
18
17
  />
19
18
  ) : (
@@ -15,7 +15,6 @@ function SimpleLinkItem({item}) {
15
15
  <span
16
16
  className={clsx('footer__link-item', item.className)}
17
17
  // Developer provided the HTML, so assume it's safe.
18
- // eslint-disable-next-line react/no-danger
19
18
  dangerouslySetInnerHTML={{__html: item.html}}
20
19
  />
21
20
  ) : (
@@ -10,4 +10,4 @@
10
10
  // Yet we declare it there so that we can register it in MDX
11
11
  // TODO later the mermaid theme should be able to register its MDX component
12
12
  // see https://github.com/facebook/docusaurus/pull/7490#issuecomment-1279117288
13
- export {default} from '@docusaurus/Noop';
13
+ export { default } from '@docusaurus/Noop';
@@ -8,7 +8,7 @@
8
8
  /*
9
9
  Hide color mode toggle in small viewports
10
10
  */
11
- @media (max-width: 996px) {
11
+ @media (width <= 996px) {
12
12
  .colorModeToggle {
13
13
  display: none;
14
14
  }
@@ -4,21 +4,10 @@
4
4
  * This source code is licensed under the MIT license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- import React, {version} from 'react';
7
+ import React from 'react';
8
8
  import clsx from 'clsx';
9
9
  import {useNavbarSecondaryMenu} from '@docusaurus/theme-common/internal';
10
10
  import {ThemeClassNames} from '@docusaurus/theme-common';
11
- // TODO Docusaurus v4: remove temporary inert workaround
12
- // See https://github.com/facebook/react/issues/17157
13
- // See https://github.com/radix-ui/themes/pull/509
14
- function inertProps(inert) {
15
- const isBeforeReact19 = parseInt(version.split('.')[0], 10) < 19;
16
- if (isBeforeReact19) {
17
- // TODO Docusaurus v4: remove temporary inert workaround
18
- return {inert: inert ? '' : undefined};
19
- }
20
- return {inert};
21
- }
22
11
  function NavbarMobileSidebarPanel({children, inert}) {
23
12
  return (
24
13
  <div
@@ -26,7 +15,7 @@ function NavbarMobileSidebarPanel({children, inert}) {
26
15
  ThemeClassNames.layout.navbar.mobileSidebar.panel,
27
16
  'navbar-sidebar__item menu',
28
17
  )}
29
- {...inertProps(inert)}>
18
+ inert={inert}>
30
19
  {children}
31
20
  </div>
32
21
  );
@@ -13,14 +13,14 @@ See https://github.com/facebook/docusaurus/pull/9385
13
13
  display: none;
14
14
  }
15
15
 
16
- @media (max-width: 996px) {
16
+ @media (width <= 996px) {
17
17
  .navbarSearchContainer {
18
18
  position: absolute;
19
19
  right: var(--ifm-navbar-padding-horizontal);
20
20
  }
21
21
  }
22
22
 
23
- @media (min-width: 997px) {
23
+ @media (width >= 997px) {
24
24
  .navbarSearchContainer {
25
25
  padding: 0 var(--ifm-navbar-item-padding-horizontal);
26
26
  }
@@ -8,4 +8,4 @@
8
8
  // If you swizzled this, it is your responsibility to provide an implementation
9
9
  // Tip: swizzle the SearchBar from the Algolia theme for inspiration:
10
10
  // npm run swizzle @docusaurus/theme-search-algolia SearchBar
11
- export {default} from '@docusaurus/Noop';
11
+ export { default } from '@docusaurus/Noop';
@@ -12,7 +12,7 @@
12
12
  top: calc(var(--ifm-navbar-height) + 1rem);
13
13
  }
14
14
 
15
- @media (max-width: 996px) {
15
+ @media (width <= 996px) {
16
16
  .tableOfContents {
17
17
  display: none;
18
18
  }
@@ -6,29 +6,27 @@
6
6
  */
7
7
  import siteConfig from '@generated/docusaurus.config';
8
8
  export default function prismIncludeLanguages(PrismObject) {
9
- const {
10
- themeConfig: {prism},
11
- } = siteConfig;
12
- const {additionalLanguages} = prism;
13
- // Prism components work on the Prism instance on the window, while prism-
14
- // react-renderer uses its own Prism instance. We temporarily mount the
15
- // instance onto window, import components to enhance it, then remove it to
16
- // avoid polluting global namespace.
17
- // You can mutate PrismObject: registering plugins, deleting languages... As
18
- // long as you don't re-assign it
19
- const PrismBefore = globalThis.Prism;
20
- globalThis.Prism = PrismObject;
21
- additionalLanguages.forEach((lang) => {
22
- if (lang === 'php') {
23
- // eslint-disable-next-line global-require
24
- require('prismjs/components/prism-markup-templating.js');
25
- }
26
- // eslint-disable-next-line global-require, import/no-dynamic-require
27
- require(`prismjs/components/prism-${lang}`);
28
- });
29
- // Clean up and eventually restore former globalThis.Prism object (if any)
30
- delete globalThis.Prism;
31
- if (typeof PrismBefore !== 'undefined') {
9
+ const { themeConfig: { prism }, } = siteConfig;
10
+ const { additionalLanguages } = prism;
11
+ // Prism components work on the Prism instance on the window, while prism-
12
+ // react-renderer uses its own Prism instance. We temporarily mount the
13
+ // instance onto window, import components to enhance it, then remove it to
14
+ // avoid polluting global namespace.
15
+ // You can mutate PrismObject: registering plugins, deleting languages... As
16
+ // long as you don't re-assign it
17
+ const PrismBefore = globalThis.Prism;
32
18
  globalThis.Prism = PrismObject;
33
- }
19
+ additionalLanguages.forEach((lang) => {
20
+ if (lang === 'php') {
21
+ // eslint-disable-next-line @typescript-eslint/no-require-imports
22
+ require('prismjs/components/prism-markup-templating.js');
23
+ }
24
+ // eslint-disable-next-line @typescript-eslint/no-require-imports
25
+ require(`prismjs/components/prism-${lang}`);
26
+ });
27
+ // Clean up and eventually restore former globalThis.Prism object (if any)
28
+ delete globalThis.Prism;
29
+ if (typeof PrismBefore !== 'undefined') {
30
+ globalThis.Prism = PrismObject;
31
+ }
34
32
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@docusaurus/theme-classic",
3
- "version": "3.10.2",
3
+ "version": "4.0.0-canary-6809",
4
4
  "description": "Classic theme for Docusaurus",
5
5
  "main": "lib/index.js",
6
6
  "types": "src/theme-classic.d.ts",
@@ -14,52 +14,51 @@
14
14
  },
15
15
  "license": "MIT",
16
16
  "scripts": {
17
- "build": "tsc --build && node ../../admin/scripts/copyUntypedFiles.js && prettier --config ../../.prettierrc --write \"lib/theme/**/*.js\"",
17
+ "build": "tsc --build && node ../../admin/scripts/copyUntypedFiles.js && oxfmt \"lib/theme/**/*.js\"",
18
18
  "watch": "run-p -c copy:watch build:watch",
19
19
  "build:watch": "tsc --build --watch",
20
20
  "copy:watch": "node ../../admin/scripts/copyUntypedFiles.js --watch"
21
21
  },
22
22
  "dependencies": {
23
- "@docusaurus/core": "3.10.2",
24
- "@docusaurus/logger": "3.10.2",
25
- "@docusaurus/mdx-loader": "3.10.2",
26
- "@docusaurus/module-type-aliases": "3.10.2",
27
- "@docusaurus/plugin-content-blog": "3.10.2",
28
- "@docusaurus/plugin-content-docs": "3.10.2",
29
- "@docusaurus/plugin-content-pages": "3.10.2",
30
- "@docusaurus/theme-common": "3.10.2",
31
- "@docusaurus/theme-translations": "3.10.2",
32
- "@docusaurus/types": "3.10.2",
33
- "@docusaurus/utils": "3.10.2",
34
- "@docusaurus/utils-common": "3.10.2",
35
- "@docusaurus/utils-validation": "3.10.2",
36
- "@mdx-js/react": "^3.0.0",
37
- "clsx": "^2.0.0",
38
- "copy-text-to-clipboard": "^3.2.0",
23
+ "@docusaurus/core": "4.0.0-canary-6809",
24
+ "@docusaurus/logger": "4.0.0-canary-6809",
25
+ "@docusaurus/mdx-loader": "4.0.0-canary-6809",
26
+ "@docusaurus/module-type-aliases": "4.0.0-canary-6809",
27
+ "@docusaurus/plugin-content-blog": "4.0.0-canary-6809",
28
+ "@docusaurus/plugin-content-docs": "4.0.0-canary-6809",
29
+ "@docusaurus/plugin-content-pages": "4.0.0-canary-6809",
30
+ "@docusaurus/theme-common": "4.0.0-canary-6809",
31
+ "@docusaurus/theme-translations": "4.0.0-canary-6809",
32
+ "@docusaurus/types": "4.0.0-canary-6809",
33
+ "@docusaurus/utils": "4.0.0-canary-6809",
34
+ "@docusaurus/utils-common": "4.0.0-canary-6809",
35
+ "@docusaurus/utils-validation": "4.0.0-canary-6809",
36
+ "@mdx-js/react": "^3.1.1",
37
+ "clsx": "^2.1.1",
38
+ "copy-text-to-clipboard": "^3.2.2",
39
39
  "infima": "0.2.0-alpha.45",
40
- "lodash": "^4.17.21",
40
+ "lodash": "^4.18.1",
41
41
  "nprogress": "^0.2.0",
42
- "postcss": "^8.5.4",
43
- "prism-react-renderer": "^2.3.0",
44
- "prismjs": "^1.29.0",
42
+ "postcss": "^8.5.28",
43
+ "prism-react-renderer": "^2.4.1",
44
+ "prismjs": "^1.30.0",
45
45
  "react-router-dom": "^5.3.4",
46
- "rtlcss": "^4.1.0",
47
- "tslib": "^2.6.0",
48
- "utility-types": "^3.10.0"
46
+ "rtlcss": "^4.3.0",
47
+ "tslib": "^2.8.1",
48
+ "utility-types": "^3.11.0"
49
49
  },
50
50
  "devDependencies": {
51
- "@types/nprogress": "^0.2.0",
52
- "@types/prismjs": "^1.26.0",
53
- "@types/rtlcss": "^3.5.1",
54
- "fs-extra": "^11.1.1",
55
- "utility-types": "^3.10.0"
51
+ "@types/nprogress": "^0.2.3",
52
+ "@types/prismjs": "^1.26.6",
53
+ "@types/rtlcss": "^3.5.4",
54
+ "fs-extra": "^11.4.0"
56
55
  },
57
56
  "peerDependencies": {
58
- "react": "^18.0.0 || ^19.0.0",
59
- "react-dom": "^18.0.0 || ^19.0.0"
57
+ "react": "^19.3.0",
58
+ "react-dom": "^19.3.0"
60
59
  },
61
60
  "engines": {
62
- "node": ">=20.0"
61
+ "node": ">=24.14"
63
62
  },
64
- "gitHead": "f37f9035584917a97a260b91fc2842cba4f8b94f"
63
+ "gitHead": "db942b07f3529b5359bcae27ab3796cb07dec10e"
65
64
  }
package/src/nprogress.css CHANGED
@@ -34,7 +34,8 @@
34
34
  right: 0;
35
35
  width: 100px;
36
36
  height: 100%;
37
- box-shadow: 0 0 10px var(--docusaurus-progress-bar-color),
37
+ box-shadow:
38
+ 0 0 10px var(--docusaurus-progress-bar-color),
38
39
  0 0 5px var(--docusaurus-progress-bar-color);
39
40
  opacity: 1;
40
41
  transform: rotate(3deg) translate(0, -4px);
package/src/options.ts CHANGED
@@ -150,8 +150,8 @@ const itemWithType = (type: string | RegExp | undefined) => {
150
150
  type instanceof RegExp
151
151
  ? Joi.string().required().regex(type)
152
152
  : type
153
- ? Joi.string().required().equal(type)
154
- : Joi.string().forbidden();
153
+ ? Joi.string().required().equal(type)
154
+ : Joi.string().forbidden();
155
155
  return Joi.object({
156
156
  type: typeSchema,
157
157
  })
@@ -24,5 +24,6 @@ function getAdmonitionTypeComponent(type: string): ComponentType<Props> {
24
24
  export default function Admonition(unprocessedProps: Props): ReactNode {
25
25
  const props = processAdmonitionProps(unprocessedProps);
26
26
  const AdmonitionTypeComponent = getAdmonitionTypeComponent(props.type);
27
+ // eslint-disable-next-line react-hooks/static-components
27
28
  return <AdmonitionTypeComponent {...props} />;
28
29
  }
@@ -19,7 +19,6 @@ export default function AnnouncementBarContent(props: Props): ReactNode {
19
19
  {...props}
20
20
  className={clsx(styles.content, props.className)}
21
21
  // Developer provided the HTML, so assume it's safe.
22
- // eslint-disable-next-line react/no-danger
23
22
  dangerouslySetInnerHTML={{__html: content}}
24
23
  />
25
24
  );
@@ -50,7 +50,7 @@ html[data-announcement-bar-initially-dismissed='true'] .announcementBar {
50
50
  }
51
51
  }
52
52
 
53
- @media (min-width: 997px) {
53
+ @media (width >= 997px) {
54
54
  :root {
55
55
  --docusaurus-announcement-bar-height: 30px;
56
56
  }
@@ -12,7 +12,7 @@
12
12
  /**
13
13
  Blog post title should be smaller on smaller devices
14
14
  **/
15
- @media (max-width: 576px) {
15
+ @media (width <= 576px) {
16
16
  .title {
17
17
  font-size: 2rem;
18
18
  }
@@ -38,7 +38,7 @@
38
38
  color: var(--ifm-color-primary) !important;
39
39
  }
40
40
 
41
- @media (max-width: 996px) {
41
+ @media (width <= 996px) {
42
42
  .sidebar {
43
43
  display: none;
44
44
  }
@@ -7,10 +7,10 @@
7
7
 
8
8
  import React, {type ReactNode} from 'react';
9
9
  import clsx from 'clsx';
10
- import Translate from '@docusaurus/Translate';
11
10
  import {
12
11
  PageMetadata,
13
12
  HtmlClassNameProvider,
13
+ TagsPageLinkLabel,
14
14
  ThemeClassNames,
15
15
  } from '@docusaurus/theme-common';
16
16
  import {useBlogTagsPostsPageTitle} from '@docusaurus/theme-common/internal';
@@ -47,11 +47,7 @@ function BlogTagsPostsPageContent({
47
47
  <Heading as="h1">{title}</Heading>
48
48
  {tag.description && <p>{tag.description}</p>}
49
49
  <Link href={tag.allTagsPath}>
50
- <Translate
51
- id="theme.tags.tagsPageLink"
52
- description="The label of the link targeting the tag list page">
53
- View All Tags
54
- </Translate>
50
+ <TagsPageLinkLabel />
55
51
  </Link>
56
52
  </header>
57
53
  <BlogPostItems items={items} />
@@ -15,20 +15,17 @@ import Line from '@theme/CodeBlock/Line';
15
15
 
16
16
  import styles from './styles.module.css';
17
17
 
18
- // TODO Docusaurus v4: remove useless forwardRef
19
- const Pre = React.forwardRef<HTMLPreElement, ComponentProps<'pre'>>(
20
- (props, ref) => {
21
- return (
22
- <pre
23
- ref={ref}
24
- /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
25
- tabIndex={0}
26
- {...props}
27
- className={clsx(props.className, styles.codeBlock, 'thin-scrollbar')}
28
- />
29
- );
30
- },
31
- );
18
+ function Pre({className, ref, ...props}: ComponentProps<'pre'>) {
19
+ return (
20
+ <pre
21
+ ref={ref}
22
+ /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
23
+ tabIndex={0}
24
+ {...props}
25
+ className={clsx(className, styles.codeBlock, 'thin-scrollbar')}
26
+ />
27
+ );
28
+ }
32
29
 
33
30
  function Code(props: ComponentProps<'code'>) {
34
31
  const {metadata} = useCodeBlockContext();
@@ -7,15 +7,23 @@
7
7
 
8
8
  import React, {type ReactNode} from 'react';
9
9
  import clsx from 'clsx';
10
+ import Head from '@docusaurus/Head';
10
11
  import {
11
12
  ThemeClassNames,
12
13
  UnlistedBannerTitle,
13
14
  UnlistedBannerMessage,
14
- UnlistedMetadata,
15
15
  } from '@docusaurus/theme-common';
16
16
  import Admonition from '@theme/Admonition';
17
17
  import type {Props} from '@theme/ContentVisibility/Unlisted';
18
18
 
19
+ function UnlistedMetadata(): ReactNode {
20
+ return (
21
+ <Head>
22
+ <meta name="robots" content="noindex, nofollow" />
23
+ </Head>
24
+ );
25
+ }
26
+
19
27
  function UnlistedBanner({className}: Props) {
20
28
  return (
21
29
  <Admonition
@@ -27,7 +27,7 @@ function getFallbackEmojiIcon(
27
27
  item: PropSidebarItemLink | PropSidebarItemCategory,
28
28
  ): string {
29
29
  if (item.type === 'category') {
30
- return '🗃';
30
+ return '🗃️';
31
31
  }
32
32
  return isInternalUrl(item.href) ? '📄️' : '🔗';
33
33
  }
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .generatedIndexPage {
10
10
  max-width: 75% !important;
11
11
  }
@@ -10,7 +10,7 @@
10
10
  margin-top: 0;
11
11
  }
12
12
 
13
- @media (min-width: 997px) {
13
+ @media (width >= 997px) {
14
14
  .docItemCol {
15
15
  max-width: 75% !important;
16
16
  }
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  /* Prevent hydration FOUC, as the mobile TOC needs to be server-rendered */
10
10
  .tocMobile {
11
11
  display: none;
@@ -10,7 +10,7 @@
10
10
  width: 100%;
11
11
  }
12
12
 
13
- @media (min-width: 997px) {
13
+ @media (width >= 997px) {
14
14
  .docMainContainer {
15
15
  flex-grow: 1;
16
16
  max-width: calc(100% - var(--doc-sidebar-width));
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .expandButton {
10
10
  position: absolute;
11
11
  top: 0;
@@ -14,7 +14,7 @@
14
14
  display: none;
15
15
  }
16
16
 
17
- @media (min-width: 997px) {
17
+ @media (width >= 997px) {
18
18
  .docSidebarContainer {
19
19
  display: block;
20
20
  width: var(--doc-sidebar-width);
@@ -15,7 +15,7 @@
15
15
  --docusaurus-collapse-button-bg-hover: rgb(255 255 255 / 10%);
16
16
  }
17
17
 
18
- @media (min-width: 997px) {
18
+ @media (width >= 997px) {
19
19
  .collapseSidebarButton {
20
20
  display: block !important;
21
21
  background-color: var(--docusaurus-collapse-button-bg);
@@ -5,11 +5,12 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .menu {
10
10
  flex-grow: 1;
11
11
  padding: 0.5rem;
12
12
  }
13
+
13
14
  @supports (scrollbar-gutter: stable) {
14
15
  .menu {
15
16
  padding: 0.5rem 0 0.5rem 0.5rem;
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .sidebar {
10
10
  display: flex;
11
11
  flex-direction: column;
@@ -280,7 +280,9 @@ function DocSidebarItemCategoryCollapsible({
280
280
  aria-current={isCurrentPage ? 'page' : undefined}
281
281
  role={collapsible && !href ? 'button' : undefined}
282
282
  aria-expanded={collapsible && !href ? !collapsed : undefined}
283
- href={collapsible ? hrefWithSSRFallback ?? '#' : hrefWithSSRFallback}
283
+ href={
284
+ collapsible ? (hrefWithSSRFallback ?? '#') : hrefWithSSRFallback
285
+ }
284
286
  {...props}>
285
287
  <CategoryLinkLabel label={label} />
286
288
  </Link>
@@ -27,7 +27,6 @@ export default function DocSidebarItemHtml({
27
27
  className,
28
28
  )}
29
29
  key={index}
30
- // eslint-disable-next-line react/no-danger
31
30
  dangerouslySetInnerHTML={{__html: value}}
32
31
  />
33
32
  );
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- @media (min-width: 997px) {
8
+ @media (width >= 997px) {
9
9
  .menuHtmlItem {
10
10
  padding: var(--ifm-menu-link-padding-vertical)
11
11
  var(--ifm-menu-link-padding-horizontal);
@@ -12,9 +12,10 @@ import {
12
12
  PageMetadata,
13
13
  HtmlClassNameProvider,
14
14
  ThemeClassNames,
15
+ TagsPageLinkLabel,
15
16
  usePluralForm,
16
17
  } from '@docusaurus/theme-common';
17
- import Translate, {translate} from '@docusaurus/Translate';
18
+ import {translate} from '@docusaurus/Translate';
18
19
  import SearchMetadata from '@theme/SearchMetadata';
19
20
  import type {Props} from '@theme/DocTagDocListPage';
20
21
  import Unlisted from '@theme/ContentVisibility/Unlisted';
@@ -88,11 +89,7 @@ function DocTagDocListPageContent({
88
89
  <Heading as="h1">{title}</Heading>
89
90
  {tag.description && <p>{tag.description}</p>}
90
91
  <Link href={tag.allTagsPath}>
91
- <Translate
92
- id="theme.tags.tagsPageLink"
93
- description="The label of the link targeting the tag list page">
94
- View all tags
95
- </Translate>
92
+ <TagsPageLinkLabel />
96
93
  </Link>
97
94
  </header>
98
95
  <section className="margin-vert--lg">
@@ -11,7 +11,7 @@
11
11
  margin-top: 0.2rem;
12
12
  }
13
13
 
14
- @media (min-width: 997px) {
14
+ @media (width >= 997px) {
15
15
  .lastUpdated {
16
16
  text-align: right;
17
17
  }
@@ -13,7 +13,6 @@ export default function FooterCopyright({copyright}: Props): ReactNode {
13
13
  <div
14
14
  className="footer__copyright"
15
15
  // Developer provided the HTML, so assume it's safe.
16
- // eslint-disable-next-line react/no-danger
17
16
  dangerouslySetInnerHTML={{__html: copyright}}
18
17
  />
19
18
  );
@@ -19,7 +19,6 @@ function ColumnLinkItem({item}: {item: ColumnItemType}) {
19
19
  <li
20
20
  className={clsx('footer__item', item.className)}
21
21
  // Developer provided the HTML, so assume it's safe.
22
- // eslint-disable-next-line react/no-danger
23
22
  dangerouslySetInnerHTML={{__html: item.html}}
24
23
  />
25
24
  ) : (
@@ -19,7 +19,6 @@ function SimpleLinkItem({item}: {item: Props['links'][number]}) {
19
19
  <span
20
20
  className={clsx('footer__link-item', item.className)}
21
21
  // Developer provided the HTML, so assume it's safe.
22
- // eslint-disable-next-line react/no-danger
23
22
  dangerouslySetInnerHTML={{__html: item.html}}
24
23
  />
25
24
  ) : (
@@ -8,7 +8,7 @@
8
8
  /*
9
9
  Hide color mode toggle in small viewports
10
10
  */
11
- @media (max-width: 996px) {
11
+ @media (width <= 996px) {
12
12
  .colorModeToggle {
13
13
  display: none;
14
14
  }
@@ -5,24 +5,12 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- import React, {version, type ReactNode} from 'react';
8
+ import React, {type ReactNode} from 'react';
9
9
  import clsx from 'clsx';
10
10
  import {useNavbarSecondaryMenu} from '@docusaurus/theme-common/internal';
11
11
  import {ThemeClassNames} from '@docusaurus/theme-common';
12
12
  import type {Props} from '@theme/Navbar/MobileSidebar/Layout';
13
13
 
14
- // TODO Docusaurus v4: remove temporary inert workaround
15
- // See https://github.com/facebook/react/issues/17157
16
- // See https://github.com/radix-ui/themes/pull/509
17
- function inertProps(inert: boolean) {
18
- const isBeforeReact19 = parseInt(version!.split('.')[0]!, 10) < 19;
19
- if (isBeforeReact19) {
20
- // TODO Docusaurus v4: remove temporary inert workaround
21
- return {inert: inert ? '' : undefined} as unknown as {inert: boolean};
22
- }
23
- return {inert};
24
- }
25
-
26
14
  function NavbarMobileSidebarPanel({
27
15
  children,
28
16
  inert,
@@ -36,7 +24,7 @@ function NavbarMobileSidebarPanel({
36
24
  ThemeClassNames.layout.navbar.mobileSidebar.panel,
37
25
  'navbar-sidebar__item menu',
38
26
  )}
39
- {...inertProps(inert)}>
27
+ inert={inert}>
40
28
  {children}
41
29
  </div>
42
30
  );
@@ -13,14 +13,14 @@ See https://github.com/facebook/docusaurus/pull/9385
13
13
  display: none;
14
14
  }
15
15
 
16
- @media (max-width: 996px) {
16
+ @media (width <= 996px) {
17
17
  .navbarSearchContainer {
18
18
  position: absolute;
19
19
  right: var(--ifm-navbar-padding-horizontal);
20
20
  }
21
21
  }
22
22
 
23
- @media (min-width: 997px) {
23
+ @media (width >= 997px) {
24
24
  .navbarSearchContainer {
25
25
  padding: 0 var(--ifm-navbar-item-padding-horizontal);
26
26
  }
@@ -12,7 +12,7 @@
12
12
  top: calc(var(--ifm-navbar-height) + 1rem);
13
13
  }
14
14
 
15
- @media (max-width: 996px) {
15
+ @media (width <= 996px) {
16
16
  .tableOfContents {
17
17
  display: none;
18
18
  }
@@ -29,10 +29,10 @@ export default function prismIncludeLanguages(
29
29
 
30
30
  additionalLanguages.forEach((lang) => {
31
31
  if (lang === 'php') {
32
- // eslint-disable-next-line global-require
32
+ // eslint-disable-next-line @typescript-eslint/no-require-imports
33
33
  require('prismjs/components/prism-markup-templating.js');
34
34
  }
35
- // eslint-disable-next-line global-require, import/no-dynamic-require
35
+ // eslint-disable-next-line @typescript-eslint/no-require-imports
36
36
  require(`prismjs/components/prism-${lang}`);
37
37
  });
38
38
 
@@ -499,8 +499,7 @@ declare module '@theme/CodeBlock/Buttons/WordWrapButton' {
499
499
  }
500
500
 
501
501
  declare module '@theme/CodeBlock/Container' {
502
- import type {ReactNode} from 'react';
503
- import type {ComponentProps} from 'react';
502
+ import type {ReactNode, ComponentProps} from 'react';
504
503
 
505
504
  export default function CodeBlockContainer<T extends 'div' | 'pre'>({
506
505
  as: As,
@@ -1325,9 +1324,6 @@ declare module '@theme/NavbarItem/DefaultNavbarItem' {
1325
1324
  readonly position?: 'left' | 'right';
1326
1325
  };
1327
1326
 
1328
- // TODO Docusaurus v4, remove old type name
1329
- export type DesktopOrMobileNavBarItemProps = DefaultNavbarItemProps;
1330
-
1331
1327
  export interface Props extends DefaultNavbarItemProps {
1332
1328
  readonly mobile?: boolean;
1333
1329
  }
@@ -1381,9 +1377,6 @@ declare module '@theme/NavbarItem/DropdownNavbarItem' {
1381
1377
  readonly className?: string;
1382
1378
  };
1383
1379
 
1384
- // TODO Docusaurus v4, remove old type name
1385
- export type DesktopOrMobileNavBarItemProps = DropdownNavbarItemProps;
1386
-
1387
1380
  export interface Props extends DropdownNavbarItemProps {
1388
1381
  readonly mobile?: boolean;
1389
1382
  }
@@ -1,18 +0,0 @@
1
- /**
2
- * Copyright (c) Facebook, Inc. and its affiliates.
3
- *
4
- * This source code is licensed under the MIT license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- .themedImage {
9
- display: none;
10
- }
11
-
12
- [data-theme='light'] .themedImage--light {
13
- display: initial;
14
- }
15
-
16
- [data-theme='dark'] .themedImage--dark {
17
- display: initial;
18
- }
@@ -1,18 +0,0 @@
1
- /**
2
- * Copyright (c) Facebook, Inc. and its affiliates.
3
- *
4
- * This source code is licensed under the MIT license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- .themedImage {
9
- display: none;
10
- }
11
-
12
- [data-theme='light'] .themedImage--light {
13
- display: initial;
14
- }
15
-
16
- [data-theme='dark'] .themedImage--dark {
17
- display: initial;
18
- }