@docubook/flame 1.0.0-beta.80 → 1.0.1
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.
- package/.docu/components/Anchor.tsx +1 -1
- package/.docu/components/Breadcrumb.tsx +6 -1
- package/.docu/components/Context.tsx +2 -1
- package/.docu/components/Navbar.tsx +2 -2
- package/.docu/components/Pagination.tsx +15 -2
- package/.docu/components/Search.tsx +4 -10
- package/.docu/components/Sidebar.tsx +19 -4
- package/.docu/components/Sublink.tsx +6 -2
- package/.docu/components/Theme.tsx +1 -1
- package/.docu/components/registry.ts +21 -87
- package/.docu/node/build.ts +6 -2
- package/.docu/node/client.ts +1 -8
- package/.docu/node/html.ts +12 -0
- package/.docu/node/parse-tocs.ts +10 -0
- package/.docu/node/search-indexer.ts +17 -3
- package/.docu/node/server.ts +1 -13
- package/.docu/node/utils.ts +6 -4
- package/.docu/pages/docs/[[...slug]].tsx +6 -1
- package/.docu/styles/globals.css +8 -0
- package/README.md +2 -2
- package/package.json +8 -4
- package/template/docs/index.mdx +122 -16
- package/.docu/components/base/breadcrumbs.tsx +0 -64
- package/.docu/components/base/collapse.tsx +0 -186
- package/.docu/components/base/drawer.tsx +0 -164
- package/.docu/components/base/dropdown.tsx +0 -94
- package/.docu/components/base/input.tsx +0 -53
- package/.docu/components/base/kbd.tsx +0 -51
- package/.docu/components/base/modal.tsx +0 -56
- package/.docu/components/base/navbar.tsx +0 -132
- package/.docu/components/base/pagination/index.ts +0 -21
- package/.docu/components/base/pagination/pagination-docs.tsx +0 -39
- package/.docu/components/base/pagination/pagination-numbers.tsx +0 -379
- package/.docu/components/base/pagination/types.ts +0 -129
- package/.docu/components/base/theme-controller.tsx +0 -358
- package/.docu/components/base/toggle.tsx +0 -172
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import { forwardRef } from "react";
|
|
2
|
-
import { cn } from "../../node/utils";
|
|
3
|
-
|
|
4
|
-
type InputColor =
|
|
5
|
-
| "neutral"
|
|
6
|
-
| "primary"
|
|
7
|
-
| "secondary"
|
|
8
|
-
| "accent"
|
|
9
|
-
| "info"
|
|
10
|
-
| "success"
|
|
11
|
-
| "warning"
|
|
12
|
-
| "error";
|
|
13
|
-
type InputSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
14
|
-
|
|
15
|
-
interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
16
|
-
color?: InputColor;
|
|
17
|
-
inputSize?: InputSize;
|
|
18
|
-
ghost?: boolean;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export const Input = forwardRef<HTMLInputElement, InputProps>(
|
|
22
|
-
({ className, color, inputSize, ghost, ...props }, ref) => {
|
|
23
|
-
return (
|
|
24
|
-
<input
|
|
25
|
-
ref={ref}
|
|
26
|
-
className={cn(
|
|
27
|
-
"input",
|
|
28
|
-
ghost && "input-ghost",
|
|
29
|
-
color && `input-${color}`,
|
|
30
|
-
inputSize && `input-${inputSize}`,
|
|
31
|
-
className
|
|
32
|
-
)}
|
|
33
|
-
{...props}
|
|
34
|
-
/>
|
|
35
|
-
);
|
|
36
|
-
}
|
|
37
|
-
);
|
|
38
|
-
Input.displayName = "Input";
|
|
39
|
-
|
|
40
|
-
interface InputGroupProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
|
|
41
|
-
children: React.ReactNode;
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
export const InputGroup = forwardRef<HTMLLabelElement, InputGroupProps>(
|
|
45
|
-
({ children, className, ...props }, ref) => {
|
|
46
|
-
return (
|
|
47
|
-
<label ref={ref} className={cn("input", className)} {...props}>
|
|
48
|
-
{children}
|
|
49
|
-
</label>
|
|
50
|
-
);
|
|
51
|
-
}
|
|
52
|
-
);
|
|
53
|
-
InputGroup.displayName = "InputGroup";
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import { forwardRef } from "react";
|
|
2
|
-
import {
|
|
3
|
-
ArrowUp,
|
|
4
|
-
ArrowDown,
|
|
5
|
-
ArrowLeft,
|
|
6
|
-
ArrowRight,
|
|
7
|
-
Command,
|
|
8
|
-
Option,
|
|
9
|
-
ChevronUp,
|
|
10
|
-
ArrowBigUp,
|
|
11
|
-
CircleArrowOutUpLeft,
|
|
12
|
-
Space,
|
|
13
|
-
Delete,
|
|
14
|
-
ArrowRightToLine,
|
|
15
|
-
} from "lucide-react";
|
|
16
|
-
import { cn } from "../../node/utils";
|
|
17
|
-
|
|
18
|
-
type KbdSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
19
|
-
|
|
20
|
-
interface KbdProps extends React.HTMLAttributes<HTMLElement> {
|
|
21
|
-
children: React.ReactNode;
|
|
22
|
-
size?: KbdSize;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
export const Kbd = forwardRef<HTMLElement, KbdProps>(
|
|
26
|
-
({ children, className, size, ...props }, ref) => {
|
|
27
|
-
return (
|
|
28
|
-
<kbd ref={ref} className={cn("kbd", size && `kbd-${size}`, className)} {...props}>
|
|
29
|
-
{children}
|
|
30
|
-
</kbd>
|
|
31
|
-
);
|
|
32
|
-
}
|
|
33
|
-
);
|
|
34
|
-
Kbd.displayName = "Kbd";
|
|
35
|
-
|
|
36
|
-
const iconSize = 12;
|
|
37
|
-
|
|
38
|
-
export const FnKey = {
|
|
39
|
-
Cmd: () => <Command size={iconSize} />,
|
|
40
|
-
Option: () => <Option size={iconSize} />,
|
|
41
|
-
Ctrl: () => <ChevronUp size={iconSize} />,
|
|
42
|
-
Shift: () => <ArrowBigUp size={iconSize} />,
|
|
43
|
-
Esc: () => <CircleArrowOutUpLeft size={iconSize} />,
|
|
44
|
-
Space: () => <Space size={iconSize} />,
|
|
45
|
-
Delete: () => <Delete size={iconSize} />,
|
|
46
|
-
Tab: () => <ArrowRightToLine size={iconSize} />,
|
|
47
|
-
Up: () => <ArrowUp size={iconSize} />,
|
|
48
|
-
Down: () => <ArrowDown size={iconSize} />,
|
|
49
|
-
Left: () => <ArrowLeft size={iconSize} />,
|
|
50
|
-
Right: () => <ArrowRight size={iconSize} />,
|
|
51
|
-
};
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import { forwardRef, useRef, useCallback } from "react";
|
|
4
|
-
import { cn } from "../../node/utils";
|
|
5
|
-
|
|
6
|
-
interface ModalProps extends React.DialogHTMLAttributes<HTMLDialogElement> {
|
|
7
|
-
children: React.ReactNode;
|
|
8
|
-
closeOnBackdrop?: boolean;
|
|
9
|
-
placement?: "top" | "middle" | "bottom";
|
|
10
|
-
boxClassName?: string;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
export const Modal = forwardRef<HTMLDialogElement, ModalProps>(
|
|
14
|
-
({ children, className, closeOnBackdrop = true, placement, boxClassName, ...props }, ref) => {
|
|
15
|
-
const placementClass = placement ? `modal-${placement}` : "";
|
|
16
|
-
|
|
17
|
-
return (
|
|
18
|
-
<dialog ref={ref} className={cn("modal", placementClass, className)} {...props}>
|
|
19
|
-
<div className={cn("modal-box", boxClassName)}>{children}</div>
|
|
20
|
-
{closeOnBackdrop && (
|
|
21
|
-
<form method="dialog" className="modal-backdrop">
|
|
22
|
-
<button>esc</button>
|
|
23
|
-
</form>
|
|
24
|
-
)}
|
|
25
|
-
</dialog>
|
|
26
|
-
);
|
|
27
|
-
}
|
|
28
|
-
);
|
|
29
|
-
Modal.displayName = "Modal";
|
|
30
|
-
|
|
31
|
-
export function ModalAction({
|
|
32
|
-
children,
|
|
33
|
-
className,
|
|
34
|
-
}: {
|
|
35
|
-
children: React.ReactNode;
|
|
36
|
-
className?: string;
|
|
37
|
-
}) {
|
|
38
|
-
return (
|
|
39
|
-
<div className={cn("modal-action", className)}>
|
|
40
|
-
<form method="dialog">{children}</form>
|
|
41
|
-
</div>
|
|
42
|
-
);
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
export function useModal() {
|
|
46
|
-
const ref = useRef<HTMLDialogElement>(null);
|
|
47
|
-
const open = useCallback(() => {
|
|
48
|
-
ref.current?.showModal();
|
|
49
|
-
setTimeout(() => {
|
|
50
|
-
const input = ref.current?.querySelector<HTMLElement>("input, [autofocus]");
|
|
51
|
-
input?.focus();
|
|
52
|
-
}, 0);
|
|
53
|
-
}, []);
|
|
54
|
-
const close = useCallback(() => ref.current?.close(), []);
|
|
55
|
-
return { ref, open, close };
|
|
56
|
-
}
|
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
import type { ReactNode, CSSProperties } from "react";
|
|
2
|
-
|
|
3
|
-
export interface NavbarProps {
|
|
4
|
-
id?: string;
|
|
5
|
-
children?: ReactNode;
|
|
6
|
-
className?: string;
|
|
7
|
-
style?: CSSProperties;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export interface LogoProps {
|
|
11
|
-
src?: string;
|
|
12
|
-
alt?: string;
|
|
13
|
-
text?: string;
|
|
14
|
-
href?: string;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
export interface NavMenuItem {
|
|
18
|
-
title: string;
|
|
19
|
-
href: string;
|
|
20
|
-
isExternal?: boolean;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
export interface NavMenuProps {
|
|
24
|
-
items: NavMenuItem[];
|
|
25
|
-
onItemClick?: () => void;
|
|
26
|
-
activePath?: string;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
export function Navbar({ id, children, className, style }: NavbarProps) {
|
|
30
|
-
return (
|
|
31
|
-
<nav id={id} className={className} style={style}>
|
|
32
|
-
{children}
|
|
33
|
-
</nav>
|
|
34
|
-
);
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
export function NavbarContainer({
|
|
38
|
-
start,
|
|
39
|
-
center,
|
|
40
|
-
end,
|
|
41
|
-
className,
|
|
42
|
-
}: {
|
|
43
|
-
start?: ReactNode;
|
|
44
|
-
center?: ReactNode;
|
|
45
|
-
end?: ReactNode;
|
|
46
|
-
className?: string;
|
|
47
|
-
}) {
|
|
48
|
-
return (
|
|
49
|
-
<div className={className}>
|
|
50
|
-
{start && <div className="flex-start">{start}</div>}
|
|
51
|
-
{center && <div className="flex-center">{center}</div>}
|
|
52
|
-
{end && <div className="flex-none">{end}</div>}
|
|
53
|
-
</div>
|
|
54
|
-
);
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
export function Logo({ src, alt, text, href = "/" }: LogoProps) {
|
|
58
|
-
return (
|
|
59
|
-
<a href={href} className="logo-link">
|
|
60
|
-
{src ? (
|
|
61
|
-
<img src={src} alt={alt || text || "Logo"} className="logo-image" />
|
|
62
|
-
) : (
|
|
63
|
-
<span className="logo-text">{text}</span>
|
|
64
|
-
)}
|
|
65
|
-
</a>
|
|
66
|
-
);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
export function NavMenu({ items, activePath }: NavMenuProps) {
|
|
70
|
-
return (
|
|
71
|
-
<ul className="nav-menu">
|
|
72
|
-
{items.map((item) => {
|
|
73
|
-
const isActive = activePath
|
|
74
|
-
? item.href === "/"
|
|
75
|
-
? activePath === "/"
|
|
76
|
-
: activePath === item.href || activePath.startsWith(item.href + "/")
|
|
77
|
-
: false;
|
|
78
|
-
return (
|
|
79
|
-
<li key={item.title + item.href}>
|
|
80
|
-
<a
|
|
81
|
-
href={item.href}
|
|
82
|
-
className={`nav-menu-item ${isActive ? "active" : ""}`}
|
|
83
|
-
target={item.isExternal ? "_blank" : undefined}
|
|
84
|
-
rel={item.isExternal ? "noopener noreferrer" : undefined}
|
|
85
|
-
>
|
|
86
|
-
{item.title}
|
|
87
|
-
</a>
|
|
88
|
-
</li>
|
|
89
|
-
);
|
|
90
|
-
})}
|
|
91
|
-
</ul>
|
|
92
|
-
);
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
export function NavMenuLink({ item, isActive }: { item: NavMenuItem; isActive?: boolean }) {
|
|
96
|
-
return (
|
|
97
|
-
<a
|
|
98
|
-
href={item.href}
|
|
99
|
-
className={`nav-menu-item ${isActive ? "active" : ""}`}
|
|
100
|
-
target={item.isExternal ? "_blank" : undefined}
|
|
101
|
-
rel={item.isExternal ? "noopener noreferrer" : undefined}
|
|
102
|
-
>
|
|
103
|
-
{item.title}
|
|
104
|
-
</a>
|
|
105
|
-
);
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
export function NavToggle({
|
|
109
|
-
isOpen,
|
|
110
|
-
onClick,
|
|
111
|
-
label = "Toggle navigation",
|
|
112
|
-
}: {
|
|
113
|
-
isOpen: boolean;
|
|
114
|
-
onClick: () => void;
|
|
115
|
-
label?: string;
|
|
116
|
-
}) {
|
|
117
|
-
return (
|
|
118
|
-
<button
|
|
119
|
-
type="button"
|
|
120
|
-
onClick={onClick}
|
|
121
|
-
aria-label={label}
|
|
122
|
-
aria-expanded={isOpen}
|
|
123
|
-
className="nav-toggle"
|
|
124
|
-
>
|
|
125
|
-
<span className={`toggle-icon ${isOpen ? "open" : ""}`}>{isOpen ? "✕" : "☰"}</span>
|
|
126
|
-
</button>
|
|
127
|
-
);
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
export function NavbarVersion({ version }: { version: string }) {
|
|
131
|
-
return <span className="navbar-version">v{version}</span>;
|
|
132
|
-
}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
export { PaginationDocs } from "./pagination-docs";
|
|
2
|
-
export {
|
|
3
|
-
Pagination,
|
|
4
|
-
PaginationItem,
|
|
5
|
-
PaginationButtons,
|
|
6
|
-
PaginationRange,
|
|
7
|
-
PaginationInfo,
|
|
8
|
-
PaginationFull,
|
|
9
|
-
} from "./pagination-numbers";
|
|
10
|
-
export { getPaginationRange } from "./types";
|
|
11
|
-
export type {
|
|
12
|
-
PaginationRootProps as PaginationProps,
|
|
13
|
-
PaginationItemProps,
|
|
14
|
-
PaginationRangeProps,
|
|
15
|
-
PaginationButtonsProps,
|
|
16
|
-
PaginationInfoProps,
|
|
17
|
-
PaginationFullProps,
|
|
18
|
-
PaginationDocsProps,
|
|
19
|
-
PaginationSize,
|
|
20
|
-
PaginationVariant,
|
|
21
|
-
} from "./types";
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { cn } from "../../../node/utils";
|
|
2
|
-
import { ChevronLeft, ChevronRight } from "lucide-react";
|
|
3
|
-
import type { PaginationDocsProps } from "./types";
|
|
4
|
-
|
|
5
|
-
export function PaginationDocs({ prev, next, className }: PaginationDocsProps) {
|
|
6
|
-
return (
|
|
7
|
-
<div className={cn("grid grow grid-cols-1 gap-4 py-8 sm:grid-cols-2", className)}>
|
|
8
|
-
<div>
|
|
9
|
-
{prev && (
|
|
10
|
-
<a
|
|
11
|
-
href={prev.href}
|
|
12
|
-
className="btn btn-outline border-base-300 items-start! py-2! h-auto w-full flex-col pl-4 no-underline"
|
|
13
|
-
>
|
|
14
|
-
<span className="text-muted-foreground flex items-center text-xs">
|
|
15
|
-
<ChevronLeft className="mr-1 h-4 w-4" />
|
|
16
|
-
Previous
|
|
17
|
-
</span>
|
|
18
|
-
<span className="text-base-content mt-1 text-sm font-medium">{prev.title}</span>
|
|
19
|
-
</a>
|
|
20
|
-
)}
|
|
21
|
-
</div>
|
|
22
|
-
|
|
23
|
-
<div>
|
|
24
|
-
{next && (
|
|
25
|
-
<a
|
|
26
|
-
href={next.href}
|
|
27
|
-
className="btn btn-outline border-base-300 items-end! py-2! h-auto w-full flex-col pr-4 no-underline"
|
|
28
|
-
>
|
|
29
|
-
<span className="text-muted-foreground flex items-center text-xs">
|
|
30
|
-
Next
|
|
31
|
-
<ChevronRight className="ml-1 h-4 w-4" />
|
|
32
|
-
</span>
|
|
33
|
-
<span className="text-base-content mt-1 text-sm font-medium">{next.title}</span>
|
|
34
|
-
</a>
|
|
35
|
-
)}
|
|
36
|
-
</div>
|
|
37
|
-
</div>
|
|
38
|
-
);
|
|
39
|
-
}
|