This commit is contained in:
2024-03-22 03:47:51 +05:30
parent 8bcf3d211e
commit 89819f6fe2
28440 changed files with 3211033 additions and 2 deletions

View File

@@ -0,0 +1,9 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/// <reference types="react" />
import type { Props } from '@theme/DocSidebarItem/Category';
export default function DocSidebarItemCategory({ item, onItemClick, activePath, level, index, ...props }: Props): JSX.Element;

View File

@@ -0,0 +1,196 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React, {useEffect, useMemo} from 'react';
import clsx from 'clsx';
import {
ThemeClassNames,
useThemeConfig,
usePrevious,
Collapsible,
useCollapsible,
} from '@docusaurus/theme-common';
import {
isActiveSidebarItem,
findFirstSidebarItemLink,
useDocSidebarItemsExpandedState,
isSamePath,
} from '@docusaurus/theme-common/internal';
import Link from '@docusaurus/Link';
import {translate} from '@docusaurus/Translate';
import useIsBrowser from '@docusaurus/useIsBrowser';
import DocSidebarItems from '@theme/DocSidebarItems';
// If we navigate to a category and it becomes active, it should automatically
// expand itself
function useAutoExpandActiveCategory({isActive, collapsed, updateCollapsed}) {
const wasActive = usePrevious(isActive);
useEffect(() => {
const justBecameActive = isActive && !wasActive;
if (justBecameActive && collapsed) {
updateCollapsed(false);
}
}, [isActive, wasActive, collapsed, updateCollapsed]);
}
/**
* When a collapsible category has no link, we still link it to its first child
* during SSR as a temporary fallback. This allows to be able to navigate inside
* the category even when JS fails to load, is delayed or simply disabled
* React hydration becomes an optional progressive enhancement
* see https://github.com/facebookincubator/infima/issues/36#issuecomment-772543188
* see https://github.com/facebook/docusaurus/issues/3030
*/
function useCategoryHrefWithSSRFallback(item) {
const isBrowser = useIsBrowser();
return useMemo(() => {
if (item.href && !item.linkUnlisted) {
return item.href;
}
// In these cases, it's not necessary to render a fallback
// We skip the "findFirstCategoryLink" computation
if (isBrowser || !item.collapsible) {
return undefined;
}
return findFirstSidebarItemLink(item);
}, [item, isBrowser]);
}
function CollapseButton({collapsed, categoryLabel, onClick}) {
return (
<button
aria-label={
collapsed
? translate(
{
id: 'theme.DocSidebarItem.expandCategoryAriaLabel',
message: "Expand sidebar category '{label}'",
description: 'The ARIA label to expand the sidebar category',
},
{label: categoryLabel},
)
: translate(
{
id: 'theme.DocSidebarItem.collapseCategoryAriaLabel',
message: "Collapse sidebar category '{label}'",
description: 'The ARIA label to collapse the sidebar category',
},
{label: categoryLabel},
)
}
type="button"
className="clean-btn menu__caret"
onClick={onClick}
/>
);
}
export default function DocSidebarItemCategory({
item,
onItemClick,
activePath,
level,
index,
...props
}) {
const {items, label, collapsible, className, href} = item;
const {
docs: {
sidebar: {autoCollapseCategories},
},
} = useThemeConfig();
const hrefWithSSRFallback = useCategoryHrefWithSSRFallback(item);
const isActive = isActiveSidebarItem(item, activePath);
const isCurrentPage = isSamePath(href, activePath);
const {collapsed, setCollapsed} = useCollapsible({
// Active categories are always initialized as expanded. The default
// (`item.collapsed`) is only used for non-active categories.
initialState: () => {
if (!collapsible) {
return false;
}
return isActive ? false : item.collapsed;
},
});
const {expandedItem, setExpandedItem} = useDocSidebarItemsExpandedState();
// Use this instead of `setCollapsed`, because it is also reactive
const updateCollapsed = (toCollapsed = !collapsed) => {
setExpandedItem(toCollapsed ? null : index);
setCollapsed(toCollapsed);
};
useAutoExpandActiveCategory({isActive, collapsed, updateCollapsed});
useEffect(() => {
if (
collapsible &&
expandedItem != null &&
expandedItem !== index &&
autoCollapseCategories
) {
setCollapsed(true);
}
}, [collapsible, expandedItem, index, setCollapsed, autoCollapseCategories]);
return (
<li
className={clsx(
ThemeClassNames.docs.docSidebarItemCategory,
ThemeClassNames.docs.docSidebarItemCategoryLevel(level),
'menu__list-item',
{
'menu__list-item--collapsed': collapsed,
},
className,
)}>
<div
className={clsx('menu__list-item-collapsible', {
'menu__list-item-collapsible--active': isCurrentPage,
})}>
<Link
className={clsx('menu__link', {
'menu__link--sublist': collapsible,
'menu__link--sublist-caret': !href && collapsible,
'menu__link--active': isActive,
})}
onClick={
collapsible
? (e) => {
onItemClick?.(item);
if (href) {
updateCollapsed(false);
} else {
e.preventDefault();
updateCollapsed();
}
}
: () => {
onItemClick?.(item);
}
}
aria-current={isCurrentPage ? 'page' : undefined}
aria-expanded={collapsible ? !collapsed : undefined}
href={collapsible ? hrefWithSSRFallback ?? '#' : hrefWithSSRFallback}
{...props}>
{label}
</Link>
{href && collapsible && (
<CollapseButton
collapsed={collapsed}
categoryLabel={label}
onClick={(e) => {
e.preventDefault();
updateCollapsed();
}}
/>
)}
</div>
<Collapsible lazy as="ul" className="menu__list" collapsed={collapsed}>
<DocSidebarItems
items={items}
tabIndex={collapsed ? -1 : 0}
onItemClick={onItemClick}
activePath={activePath}
level={level + 1}
/>
</Collapsible>
</li>
);
}

View File

@@ -0,0 +1,9 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/// <reference types="react" />
import type { Props } from '@theme/DocSidebarItem/Html';
export default function DocSidebarItemHtml({ item, level, index, }: Props): JSX.Element;

View File

@@ -0,0 +1,26 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React from 'react';
import clsx from 'clsx';
import {ThemeClassNames} from '@docusaurus/theme-common';
import styles from './styles.module.css';
export default function DocSidebarItemHtml({item, level, index}) {
const {value, defaultStyle, className} = item;
return (
<li
className={clsx(
ThemeClassNames.docs.docSidebarItemLink,
ThemeClassNames.docs.docSidebarItemLinkLevel(level),
defaultStyle && [styles.menuHtmlItem, 'menu__list-item'],
className,
)}
key={index}
// eslint-disable-next-line react/no-danger
dangerouslySetInnerHTML={{__html: value}}
/>
);
}

View File

@@ -0,0 +1,13 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
@media (min-width: 997px) {
.menuHtmlItem {
padding: var(--ifm-menu-link-padding-vertical)
var(--ifm-menu-link-padding-horizontal);
}
}

View File

@@ -0,0 +1,9 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/// <reference types="react" />
import type { Props } from '@theme/DocSidebarItem/Link';
export default function DocSidebarItemLink({ item, onItemClick, activePath, level, index, ...props }: Props): JSX.Element;

View File

@@ -0,0 +1,55 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React from 'react';
import clsx from 'clsx';
import {ThemeClassNames} from '@docusaurus/theme-common';
import {isActiveSidebarItem} from '@docusaurus/theme-common/internal';
import Link from '@docusaurus/Link';
import isInternalUrl from '@docusaurus/isInternalUrl';
import IconExternalLink from '@theme/Icon/ExternalLink';
import styles from './styles.module.css';
export default function DocSidebarItemLink({
item,
onItemClick,
activePath,
level,
index,
...props
}) {
const {href, label, className, autoAddBaseUrl} = item;
const isActive = isActiveSidebarItem(item, activePath);
const isInternalLink = isInternalUrl(href);
return (
<li
className={clsx(
ThemeClassNames.docs.docSidebarItemLink,
ThemeClassNames.docs.docSidebarItemLinkLevel(level),
'menu__list-item',
className,
)}
key={label}>
<Link
className={clsx(
'menu__link',
!isInternalLink && styles.menuExternalLink,
{
'menu__link--active': isActive,
},
)}
autoAddBaseUrl={autoAddBaseUrl}
aria-current={isActive ? 'page' : undefined}
to={href}
{...(isInternalLink && {
onClick: onItemClick ? () => onItemClick(item) : undefined,
})}
{...props}>
{label}
{!isInternalLink && <IconExternalLink />}
</Link>
</li>
);
}

View File

@@ -0,0 +1,10 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.menuExternalLink {
align-items: center;
}

View File

@@ -0,0 +1,9 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/// <reference types="react" />
import type { Props } from '@theme/DocSidebarItem';
export default function DocSidebarItem({ item, ...props }: Props): JSX.Element | null;

View File

@@ -0,0 +1,21 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React from 'react';
import DocSidebarItemCategory from '@theme/DocSidebarItem/Category';
import DocSidebarItemLink from '@theme/DocSidebarItem/Link';
import DocSidebarItemHtml from '@theme/DocSidebarItem/Html';
export default function DocSidebarItem({item, ...props}) {
switch (item.type) {
case 'category':
return <DocSidebarItemCategory item={item} {...props} />;
case 'html':
return <DocSidebarItemHtml item={item} {...props} />;
case 'link':
default:
return <DocSidebarItemLink item={item} {...props} />;
}
}