radiant-docs 0.1.59 → 0.1.60
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/package.json +1 -1
- package/template/astro.config.mjs +24 -2
- package/template/package-lock.json +121 -508
- package/template/package.json +3 -2
- package/template/scripts/generate-og-images.mjs +338 -6
- package/template/scripts/generate-og-metadata.mjs +29 -0
- package/template/src/components/Footer.astro +1 -1
- package/template/src/components/Header.astro +3 -10
- package/template/src/components/OpenApiPage.astro +20 -830
- package/template/src/components/SidebarGroup.astro +1 -1
- package/template/src/components/ThemeSwitcher.astro +5 -15
- package/template/src/components/endpoint/PlaygroundField.astro +1 -1
- package/template/src/components/endpoint/PlaygroundForm.astro +8 -4
- package/template/src/layouts/Layout.astro +6 -12
- package/template/src/lib/ai-artifacts.ts +792 -0
- package/template/src/lib/mdx/remark-resolve-internal-links.ts +22 -8
- package/template/src/lib/oas.ts +5 -1
- package/template/src/lib/openapi/operation-doc.ts +1150 -0
- package/template/src/lib/page-description.ts +20 -0
- package/template/src/lib/routes.ts +73 -18
- package/template/src/pages/[...slug]/index.md.ts +35 -0
- package/template/src/pages/[...spec].json.ts +33 -0
- package/template/src/pages/[...spec].yaml.ts +33 -0
- package/template/src/pages/[...spec].yml.ts +33 -0
- package/template/src/pages/index.md.ts +17 -0
- package/template/src/pages/llms-full.txt.ts +11 -0
- package/template/src/pages/llms.txt.ts +11 -0
- package/template/src/styles/global.css +18 -15
- package/template/src/styles/vaul.css +0 -255
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export function normalizePageDescription(value: unknown): string | undefined {
|
|
2
|
+
if (typeof value !== "string") return undefined;
|
|
3
|
+
|
|
4
|
+
const normalized = value.replace(/\s+/g, " ").trim();
|
|
5
|
+
return normalized || undefined;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
export function resolvePageDescription(args: {
|
|
9
|
+
pageTitle?: string;
|
|
10
|
+
pageDescription?: unknown;
|
|
11
|
+
docsTitle: string;
|
|
12
|
+
}): string {
|
|
13
|
+
const explicitDescription = normalizePageDescription(args.pageDescription);
|
|
14
|
+
if (explicitDescription) return explicitDescription;
|
|
15
|
+
|
|
16
|
+
const pageTitle = args.pageTitle?.trim();
|
|
17
|
+
return pageTitle
|
|
18
|
+
? `Learn about ${pageTitle} in the ${args.docsTitle} documentation.`
|
|
19
|
+
: `${args.docsTitle} documentation.`;
|
|
20
|
+
}
|
|
@@ -5,7 +5,7 @@ import {
|
|
|
5
5
|
type NavOpenApiPage,
|
|
6
6
|
type NavMenuItem,
|
|
7
7
|
type NavOpenApi,
|
|
8
|
-
type
|
|
8
|
+
type DocsConfig,
|
|
9
9
|
loadOpenApiSpec,
|
|
10
10
|
} from "./validation";
|
|
11
11
|
import {
|
|
@@ -50,12 +50,43 @@ export interface OpenApiRoute extends BaseRoute {
|
|
|
50
50
|
// Discriminated union
|
|
51
51
|
export type Route = MdxRoute | OpenApiRoute;
|
|
52
52
|
|
|
53
|
+
type AuxiliaryPageRef = {
|
|
54
|
+
filePath: string;
|
|
55
|
+
href: string;
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
type DocsConfigWithAuxiliaryRefs = DocsConfig & {
|
|
59
|
+
auxiliaryPageRefs?: AuxiliaryPageRef[];
|
|
60
|
+
};
|
|
61
|
+
|
|
53
62
|
function normalizeTitle(value: unknown): string | undefined {
|
|
54
63
|
if (typeof value !== "string") return undefined;
|
|
55
64
|
const trimmed = value.trim();
|
|
56
65
|
return trimmed.length ? trimmed : undefined;
|
|
57
66
|
}
|
|
58
67
|
|
|
68
|
+
function getAuxiliaryPageRefs(
|
|
69
|
+
config: DocsConfigWithAuxiliaryRefs,
|
|
70
|
+
): AuxiliaryPageRef[] {
|
|
71
|
+
return config.auxiliaryPageRefs ?? [];
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
function findCanonicalMdxRoute(
|
|
75
|
+
routes: Route[],
|
|
76
|
+
filePath: string,
|
|
77
|
+
): MdxRoute | undefined {
|
|
78
|
+
return (
|
|
79
|
+
routes.find(
|
|
80
|
+
(route): route is MdxRoute =>
|
|
81
|
+
route.type === "mdx" && route.filePath === filePath && !route.hidden,
|
|
82
|
+
) ??
|
|
83
|
+
routes.find(
|
|
84
|
+
(route): route is MdxRoute =>
|
|
85
|
+
route.type === "mdx" && route.filePath === filePath,
|
|
86
|
+
)
|
|
87
|
+
);
|
|
88
|
+
}
|
|
89
|
+
|
|
59
90
|
export function resolveMdxPageTitle(args: {
|
|
60
91
|
entry: any;
|
|
61
92
|
docsTitle?: unknown;
|
|
@@ -114,33 +145,36 @@ function processPageItem(
|
|
|
114
145
|
};
|
|
115
146
|
}
|
|
116
147
|
|
|
117
|
-
function
|
|
148
|
+
function processAuxiliaryPageRefRoute(
|
|
149
|
+
ref: AuxiliaryPageRef,
|
|
150
|
+
docs: any[],
|
|
151
|
+
): MdxRoute {
|
|
118
152
|
const entry = docs.find((doc: any) => {
|
|
119
153
|
const docPath = doc.id.replace(/\.mdx$/, "");
|
|
120
|
-
return docPath ===
|
|
154
|
+
return docPath === ref.filePath;
|
|
121
155
|
});
|
|
122
156
|
|
|
123
157
|
if (!entry) {
|
|
124
158
|
throw new Error(
|
|
125
|
-
`Could not find content collection entry for path: ${
|
|
159
|
+
`Could not find content collection entry for path: ${ref.filePath}`,
|
|
126
160
|
);
|
|
127
161
|
}
|
|
128
162
|
|
|
129
|
-
const slug =
|
|
163
|
+
const slug = ref.href.replace(/^\/+/, "").replace(/\/+$/, "");
|
|
130
164
|
|
|
131
165
|
return {
|
|
132
166
|
type: "mdx",
|
|
133
167
|
slug,
|
|
134
168
|
preferredSlug: slug,
|
|
135
169
|
fallbackSlug: buildMdxPageFallbackSlug({
|
|
136
|
-
filePath:
|
|
170
|
+
filePath: ref.filePath,
|
|
137
171
|
groupSlug: "",
|
|
138
172
|
}),
|
|
139
|
-
routeIdentity: `mdx:${
|
|
140
|
-
filePath:
|
|
173
|
+
routeIdentity: `mdx:${ref.filePath}`,
|
|
174
|
+
filePath: ref.filePath,
|
|
141
175
|
title: resolveMdxPageTitle({
|
|
142
176
|
entry,
|
|
143
|
-
filePath:
|
|
177
|
+
filePath: ref.filePath,
|
|
144
178
|
}),
|
|
145
179
|
hidden: true,
|
|
146
180
|
};
|
|
@@ -476,8 +510,16 @@ export async function getAllRoutes(): Promise<Route[]> {
|
|
|
476
510
|
allRoutes = allRoutes.concat(openApiRoutes);
|
|
477
511
|
}
|
|
478
512
|
|
|
479
|
-
for (const
|
|
480
|
-
const
|
|
513
|
+
for (const auxiliaryPageRef of getAuxiliaryPageRefs(config)) {
|
|
514
|
+
const existingFileRoute = allRoutes.find(
|
|
515
|
+
(route) =>
|
|
516
|
+
route.type === "mdx" && route.filePath === auxiliaryPageRef.filePath,
|
|
517
|
+
);
|
|
518
|
+
if (existingFileRoute) {
|
|
519
|
+
continue;
|
|
520
|
+
}
|
|
521
|
+
|
|
522
|
+
const hiddenRoute = processAuxiliaryPageRefRoute(auxiliaryPageRef, docs);
|
|
481
523
|
const existingRoute = allRoutes.find(
|
|
482
524
|
(route) => route.slug === hiddenRoute.slug,
|
|
483
525
|
);
|
|
@@ -523,23 +565,36 @@ export async function getMdxRouteHref(args: {
|
|
|
523
565
|
return prependBasePath(`/${route?.slug ?? preferredSlug}`);
|
|
524
566
|
}
|
|
525
567
|
|
|
568
|
+
async function getCanonicalMdxRouteHref(filePath: string): Promise<string> {
|
|
569
|
+
const config = await getConfig();
|
|
570
|
+
if (config.home && filePath === config.home) {
|
|
571
|
+
return prependBasePath("/");
|
|
572
|
+
}
|
|
573
|
+
|
|
574
|
+
const routes = await getAllRoutes();
|
|
575
|
+
const route = findCanonicalMdxRoute(routes, filePath);
|
|
576
|
+
|
|
577
|
+
if (route) {
|
|
578
|
+
return prependBasePath(`/${route.slug}`);
|
|
579
|
+
}
|
|
580
|
+
|
|
581
|
+
return getMdxRouteHref({ filePath });
|
|
582
|
+
}
|
|
583
|
+
|
|
526
584
|
export async function resolveConfiguredHref(
|
|
527
585
|
href: string,
|
|
528
|
-
|
|
586
|
+
config: DocsConfigWithAuxiliaryRefs,
|
|
529
587
|
): Promise<string> {
|
|
530
588
|
const normalizedHref = href.replace(/^\/+/, "").replace(/\/+$/, "");
|
|
531
|
-
const
|
|
589
|
+
const auxiliaryPageRef = getAuxiliaryPageRefs(config).find(
|
|
532
590
|
(route) => route.href.replace(/^\/+/, "").replace(/\/+$/, "") === normalizedHref,
|
|
533
591
|
);
|
|
534
592
|
|
|
535
|
-
if (!
|
|
593
|
+
if (!auxiliaryPageRef) {
|
|
536
594
|
return withBasePath(href);
|
|
537
595
|
}
|
|
538
596
|
|
|
539
|
-
return
|
|
540
|
-
filePath: hiddenPageRoute.filePath,
|
|
541
|
-
preferredSlug: hiddenPageRoute.href,
|
|
542
|
-
});
|
|
597
|
+
return getCanonicalMdxRouteHref(auxiliaryPageRef.filePath);
|
|
543
598
|
}
|
|
544
599
|
|
|
545
600
|
export async function getOpenApiEndpointRouteHref(args: {
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import type { APIRoute } from "astro";
|
|
2
|
+
import {
|
|
3
|
+
getMarkdownRoutePages,
|
|
4
|
+
MARKDOWN_CONTENT_TYPE,
|
|
5
|
+
type AiMarkdownPage,
|
|
6
|
+
} from "../../lib/ai-artifacts";
|
|
7
|
+
|
|
8
|
+
export async function getStaticPaths() {
|
|
9
|
+
const pages = await getMarkdownRoutePages();
|
|
10
|
+
|
|
11
|
+
return pages
|
|
12
|
+
.filter((page) => page.routeSlug)
|
|
13
|
+
.map((page) => ({
|
|
14
|
+
params: {
|
|
15
|
+
slug: page.routeSlug,
|
|
16
|
+
},
|
|
17
|
+
props: {
|
|
18
|
+
page,
|
|
19
|
+
},
|
|
20
|
+
}));
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export const GET: APIRoute = async ({ props }) => {
|
|
24
|
+
const page = props.page as AiMarkdownPage | undefined;
|
|
25
|
+
|
|
26
|
+
if (!page) {
|
|
27
|
+
return new Response("Markdown page not found.", { status: 404 });
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
return new Response(page.source, {
|
|
31
|
+
headers: {
|
|
32
|
+
"Content-Type": MARKDOWN_CONTENT_TYPE,
|
|
33
|
+
},
|
|
34
|
+
});
|
|
35
|
+
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import type { APIRoute } from "astro";
|
|
2
|
+
import {
|
|
3
|
+
getOpenApiSpecArtifactsByExtension,
|
|
4
|
+
readOpenApiSpecArtifact,
|
|
5
|
+
type OpenApiSpecArtifact,
|
|
6
|
+
} from "../lib/ai-artifacts";
|
|
7
|
+
|
|
8
|
+
export async function getStaticPaths() {
|
|
9
|
+
const specs = await getOpenApiSpecArtifactsByExtension(".json");
|
|
10
|
+
|
|
11
|
+
return specs.map((spec) => ({
|
|
12
|
+
params: {
|
|
13
|
+
spec: spec.routeParam,
|
|
14
|
+
},
|
|
15
|
+
props: {
|
|
16
|
+
spec,
|
|
17
|
+
},
|
|
18
|
+
}));
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export const GET: APIRoute = async ({ props }) => {
|
|
22
|
+
const spec = props.spec as OpenApiSpecArtifact | undefined;
|
|
23
|
+
|
|
24
|
+
if (!spec) {
|
|
25
|
+
return new Response("OpenAPI spec not found.", { status: 404 });
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
return new Response(await readOpenApiSpecArtifact(spec), {
|
|
29
|
+
headers: {
|
|
30
|
+
"Content-Type": spec.contentType ?? "application/json; charset=utf-8",
|
|
31
|
+
},
|
|
32
|
+
});
|
|
33
|
+
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import type { APIRoute } from "astro";
|
|
2
|
+
import {
|
|
3
|
+
getOpenApiSpecArtifactsByExtension,
|
|
4
|
+
readOpenApiSpecArtifact,
|
|
5
|
+
type OpenApiSpecArtifact,
|
|
6
|
+
} from "../lib/ai-artifacts";
|
|
7
|
+
|
|
8
|
+
export async function getStaticPaths() {
|
|
9
|
+
const specs = await getOpenApiSpecArtifactsByExtension(".yaml");
|
|
10
|
+
|
|
11
|
+
return specs.map((spec) => ({
|
|
12
|
+
params: {
|
|
13
|
+
spec: spec.routeParam,
|
|
14
|
+
},
|
|
15
|
+
props: {
|
|
16
|
+
spec,
|
|
17
|
+
},
|
|
18
|
+
}));
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export const GET: APIRoute = async ({ props }) => {
|
|
22
|
+
const spec = props.spec as OpenApiSpecArtifact | undefined;
|
|
23
|
+
|
|
24
|
+
if (!spec) {
|
|
25
|
+
return new Response("OpenAPI spec not found.", { status: 404 });
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
return new Response(await readOpenApiSpecArtifact(spec), {
|
|
29
|
+
headers: {
|
|
30
|
+
"Content-Type": spec.contentType ?? "application/yaml; charset=utf-8",
|
|
31
|
+
},
|
|
32
|
+
});
|
|
33
|
+
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import type { APIRoute } from "astro";
|
|
2
|
+
import {
|
|
3
|
+
getOpenApiSpecArtifactsByExtension,
|
|
4
|
+
readOpenApiSpecArtifact,
|
|
5
|
+
type OpenApiSpecArtifact,
|
|
6
|
+
} from "../lib/ai-artifacts";
|
|
7
|
+
|
|
8
|
+
export async function getStaticPaths() {
|
|
9
|
+
const specs = await getOpenApiSpecArtifactsByExtension(".yml");
|
|
10
|
+
|
|
11
|
+
return specs.map((spec) => ({
|
|
12
|
+
params: {
|
|
13
|
+
spec: spec.routeParam,
|
|
14
|
+
},
|
|
15
|
+
props: {
|
|
16
|
+
spec,
|
|
17
|
+
},
|
|
18
|
+
}));
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export const GET: APIRoute = async ({ props }) => {
|
|
22
|
+
const spec = props.spec as OpenApiSpecArtifact | undefined;
|
|
23
|
+
|
|
24
|
+
if (!spec) {
|
|
25
|
+
return new Response("OpenAPI spec not found.", { status: 404 });
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
return new Response(await readOpenApiSpecArtifact(spec), {
|
|
29
|
+
headers: {
|
|
30
|
+
"Content-Type": spec.contentType ?? "application/yaml; charset=utf-8",
|
|
31
|
+
},
|
|
32
|
+
});
|
|
33
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { getHomeMarkdownPage, MARKDOWN_CONTENT_TYPE } from "../lib/ai-artifacts";
|
|
2
|
+
|
|
3
|
+
export const prerender = true;
|
|
4
|
+
|
|
5
|
+
export async function GET(): Promise<Response> {
|
|
6
|
+
const page = await getHomeMarkdownPage();
|
|
7
|
+
|
|
8
|
+
if (!page) {
|
|
9
|
+
return new Response("Home page not found.", { status: 404 });
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
return new Response(page.source, {
|
|
13
|
+
headers: {
|
|
14
|
+
"Content-Type": MARKDOWN_CONTENT_TYPE,
|
|
15
|
+
},
|
|
16
|
+
});
|
|
17
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { getLlmsFullTxt, PLAIN_TEXT_CONTENT_TYPE } from "../lib/ai-artifacts";
|
|
2
|
+
|
|
3
|
+
export const prerender = true;
|
|
4
|
+
|
|
5
|
+
export async function GET(): Promise<Response> {
|
|
6
|
+
return new Response(await getLlmsFullTxt(), {
|
|
7
|
+
headers: {
|
|
8
|
+
"Content-Type": PLAIN_TEXT_CONTENT_TYPE,
|
|
9
|
+
},
|
|
10
|
+
});
|
|
11
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { getLlmsTxt, PLAIN_TEXT_CONTENT_TYPE } from "../lib/ai-artifacts";
|
|
2
|
+
|
|
3
|
+
export const prerender = true;
|
|
4
|
+
|
|
5
|
+
export async function GET(): Promise<Response> {
|
|
6
|
+
return new Response(await getLlmsTxt(), {
|
|
7
|
+
headers: {
|
|
8
|
+
"Content-Type": PLAIN_TEXT_CONTENT_TYPE,
|
|
9
|
+
},
|
|
10
|
+
});
|
|
11
|
+
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
@import "tailwindcss";
|
|
2
|
-
@import "./vaul.css";
|
|
3
2
|
@plugin "@tailwindcss/typography";
|
|
4
3
|
|
|
5
4
|
@theme {
|
|
@@ -31,19 +30,18 @@
|
|
|
31
30
|
sans-serif
|
|
32
31
|
);
|
|
33
32
|
--font-heading: var(--rd-font-heading, var(--font-sans));
|
|
34
|
-
--font-mono:
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
);
|
|
33
|
+
--font-mono: var(
|
|
34
|
+
--rd-font-code,
|
|
35
|
+
"Geist Mono Variable",
|
|
36
|
+
ui-monospace,
|
|
37
|
+
SFMono-Regular,
|
|
38
|
+
Menlo,
|
|
39
|
+
Monaco,
|
|
40
|
+
Consolas,
|
|
41
|
+
"Liberation Mono",
|
|
42
|
+
"Courier New",
|
|
43
|
+
monospace
|
|
44
|
+
);
|
|
47
45
|
|
|
48
46
|
--radius-sm: calc(var(--radius) - 4px);
|
|
49
47
|
--radius-md: calc(var(--radius) - 2px);
|
|
@@ -143,7 +141,7 @@
|
|
|
143
141
|
|
|
144
142
|
/* Prose styling */
|
|
145
143
|
.prose-rules {
|
|
146
|
-
@apply prose max-w-none *:my-6 *:first:mt-0 *:last:mb-0 prose-h2:mt-
|
|
144
|
+
@apply prose max-w-none *:my-6 *:first:mt-0 *:last:mb-0 prose-h2:mt-12 prose-h2:mb-2 prose-h2:scroll-mt-24 prose-h3:mt-8 prose-h3:mb-2 prose-h3:scroll-mt-20 prose-headings:font-semibold prose-p:mt-0 prose-p:mb-4 prose-ol:mt-0 prose-ol:mb-5 prose-ul:mt-0 prose-ul:mb-5 prose-a:decoration-(--color-theme) prose-a:decoration-from-font prose-blockquote:border-(--color-theme)/30 dark:prose-blockquote:border-(--color-theme)/30;
|
|
147
145
|
--tw-prose-body: var(--color-neutral-700);
|
|
148
146
|
--tw-prose-headings: var(--color-neutral-900);
|
|
149
147
|
--tw-prose-lead: var(--color-neutral-600);
|
|
@@ -191,6 +189,11 @@
|
|
|
191
189
|
font-family: var(--font-heading);
|
|
192
190
|
}
|
|
193
191
|
|
|
192
|
+
.prose-rules h2 + h3 {
|
|
193
|
+
margin-block-start: 1rem;
|
|
194
|
+
margin-top: 1rem;
|
|
195
|
+
}
|
|
196
|
+
|
|
194
197
|
.dark .prose-rules {
|
|
195
198
|
--tw-prose-body: var(--tw-prose-invert-body);
|
|
196
199
|
--tw-prose-headings: var(--tw-prose-invert-headings);
|
|
@@ -1,255 +0,0 @@
|
|
|
1
|
-
[data-vaul-drawer] {
|
|
2
|
-
touch-action: none;
|
|
3
|
-
will-change: transform;
|
|
4
|
-
transition: transform 0.5s cubic-bezier(0.32, 0.72, 0, 1);
|
|
5
|
-
animation-duration: 0.5s;
|
|
6
|
-
animation-timing-function: cubic-bezier(0.32, 0.72, 0, 1);
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="bottom"][data-state="open"] {
|
|
10
|
-
animation-name: slideFromBottom;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="bottom"][data-state="closed"] {
|
|
14
|
-
animation-name: slideToBottom;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="top"][data-state="open"] {
|
|
18
|
-
animation-name: slideFromTop;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="top"][data-state="closed"] {
|
|
22
|
-
animation-name: slideToTop;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="left"][data-state="open"] {
|
|
26
|
-
animation-name: slideFromLeft;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="left"][data-state="closed"] {
|
|
30
|
-
animation-name: slideToLeft;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="right"][data-state="open"] {
|
|
34
|
-
animation-name: slideFromRight;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
[data-vaul-drawer][data-vaul-snap-points="false"][data-vaul-drawer-direction="right"][data-state="closed"] {
|
|
38
|
-
animation-name: slideToRight;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
[data-vaul-drawer][data-vaul-snap-points="true"][data-vaul-drawer-direction="bottom"] {
|
|
42
|
-
transform: translate3d(0, var(--initial-transform, 100%), 0);
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
[data-vaul-drawer][data-vaul-snap-points="true"][data-vaul-drawer-direction="top"] {
|
|
46
|
-
transform: translate3d(0, calc(var(--initial-transform, 100%) * -1), 0);
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
[data-vaul-drawer][data-vaul-snap-points="true"][data-vaul-drawer-direction="left"] {
|
|
50
|
-
transform: translate3d(calc(var(--initial-transform, 100%) * -1), 0, 0);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
[data-vaul-drawer][data-vaul-snap-points="true"][data-vaul-drawer-direction="right"] {
|
|
54
|
-
transform: translate3d(var(--initial-transform, 100%), 0, 0);
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
[data-vaul-drawer][data-vaul-delayed-snap-points="true"][data-vaul-drawer-direction="top"] {
|
|
58
|
-
transform: translate3d(0, var(--snap-point-height, 0), 0);
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
[data-vaul-drawer][data-vaul-delayed-snap-points="true"][data-vaul-drawer-direction="bottom"] {
|
|
62
|
-
transform: translate3d(0, var(--snap-point-height, 0), 0);
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
[data-vaul-drawer][data-vaul-delayed-snap-points="true"][data-vaul-drawer-direction="left"] {
|
|
66
|
-
transform: translate3d(var(--snap-point-height, 0), 0, 0);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
[data-vaul-drawer][data-vaul-delayed-snap-points="true"][data-vaul-drawer-direction="right"] {
|
|
70
|
-
transform: translate3d(var(--snap-point-height, 0), 0, 0);
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
[data-vaul-overlay][data-vaul-snap-points="false"] {
|
|
74
|
-
animation-duration: 0.5s;
|
|
75
|
-
animation-timing-function: cubic-bezier(0.32, 0.72, 0, 1);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
[data-vaul-overlay][data-vaul-snap-points="false"][data-state="open"] {
|
|
79
|
-
animation-name: fadeIn;
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
[data-vaul-overlay][data-state="closed"] {
|
|
83
|
-
animation-name: fadeOut;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
[data-vaul-animate="false"] {
|
|
87
|
-
animation: none !important;
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
[data-vaul-overlay][data-vaul-snap-points="true"] {
|
|
91
|
-
opacity: 0;
|
|
92
|
-
transition: opacity 0.5s cubic-bezier(0.32, 0.72, 0, 1);
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
[data-vaul-overlay][data-vaul-snap-points="true"] {
|
|
96
|
-
opacity: 1;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
[data-vaul-drawer]:not([data-vaul-custom-container="true"])::after {
|
|
100
|
-
content: "";
|
|
101
|
-
position: absolute;
|
|
102
|
-
background: inherit;
|
|
103
|
-
background-color: inherit;
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
[data-vaul-drawer][data-vaul-drawer-direction="top"]::after {
|
|
107
|
-
top: initial;
|
|
108
|
-
bottom: 100%;
|
|
109
|
-
left: 0;
|
|
110
|
-
right: 0;
|
|
111
|
-
height: 200%;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
[data-vaul-drawer][data-vaul-drawer-direction="bottom"]::after {
|
|
115
|
-
top: 100%;
|
|
116
|
-
bottom: initial;
|
|
117
|
-
left: 0;
|
|
118
|
-
right: 0;
|
|
119
|
-
height: 200%;
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
[data-vaul-drawer][data-vaul-drawer-direction="left"]::after {
|
|
123
|
-
left: initial;
|
|
124
|
-
right: 100%;
|
|
125
|
-
top: 0;
|
|
126
|
-
bottom: 0;
|
|
127
|
-
width: 200%;
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
[data-vaul-drawer][data-vaul-drawer-direction="right"]::after {
|
|
131
|
-
left: 100%;
|
|
132
|
-
right: initial;
|
|
133
|
-
top: 0;
|
|
134
|
-
bottom: 0;
|
|
135
|
-
width: 200%;
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
[data-vaul-overlay][data-vaul-snap-points="true"]:not([data-vaul-snap-points-overlay="true"]):not(
|
|
139
|
-
[data-state="closed"]
|
|
140
|
-
) {
|
|
141
|
-
opacity: 0;
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
[data-vaul-overlay][data-vaul-snap-points-overlay="true"] {
|
|
145
|
-
opacity: 1;
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
[data-vaul-handle] {
|
|
149
|
-
display: block;
|
|
150
|
-
position: relative;
|
|
151
|
-
opacity: 0.7;
|
|
152
|
-
background: #e2e2e4;
|
|
153
|
-
margin-left: auto;
|
|
154
|
-
margin-right: auto;
|
|
155
|
-
height: 5px;
|
|
156
|
-
width: 32px;
|
|
157
|
-
border-radius: 1rem;
|
|
158
|
-
touch-action: pan-y;
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
[data-vaul-handle]:hover,
|
|
162
|
-
[data-vaul-handle]:active {
|
|
163
|
-
opacity: 1;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
[data-vaul-handle-hitarea] {
|
|
167
|
-
position: absolute;
|
|
168
|
-
left: 50%;
|
|
169
|
-
top: 50%;
|
|
170
|
-
transform: translate(-50%, -50%);
|
|
171
|
-
width: max(100%, 2.75rem);
|
|
172
|
-
height: max(100%, 2.75rem);
|
|
173
|
-
touch-action: inherit;
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
@media (hover: hover) and (pointer: fine) {
|
|
177
|
-
[data-vaul-drawer] {
|
|
178
|
-
user-select: none;
|
|
179
|
-
}
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
@keyframes fadeIn {
|
|
183
|
-
from {
|
|
184
|
-
opacity: 0;
|
|
185
|
-
}
|
|
186
|
-
to {
|
|
187
|
-
opacity: 1;
|
|
188
|
-
}
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
@keyframes fadeOut {
|
|
192
|
-
to {
|
|
193
|
-
opacity: 0;
|
|
194
|
-
}
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
@keyframes slideFromBottom {
|
|
198
|
-
from {
|
|
199
|
-
transform: translate3d(0, var(--initial-transform, 100%), 0);
|
|
200
|
-
}
|
|
201
|
-
to {
|
|
202
|
-
transform: translate3d(0, 0, 0);
|
|
203
|
-
}
|
|
204
|
-
}
|
|
205
|
-
|
|
206
|
-
@keyframes slideToBottom {
|
|
207
|
-
to {
|
|
208
|
-
transform: translate3d(0, var(--initial-transform, 100%), 0);
|
|
209
|
-
}
|
|
210
|
-
}
|
|
211
|
-
|
|
212
|
-
@keyframes slideFromTop {
|
|
213
|
-
from {
|
|
214
|
-
transform: translate3d(0, calc(var(--initial-transform, 100%) * -1), 0);
|
|
215
|
-
}
|
|
216
|
-
to {
|
|
217
|
-
transform: translate3d(0, 0, 0);
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
@keyframes slideToTop {
|
|
222
|
-
to {
|
|
223
|
-
transform: translate3d(0, calc(var(--initial-transform, 100%) * -1), 0);
|
|
224
|
-
}
|
|
225
|
-
}
|
|
226
|
-
|
|
227
|
-
@keyframes slideFromLeft {
|
|
228
|
-
from {
|
|
229
|
-
transform: translate3d(calc(var(--initial-transform, 100%) * -1), 0, 0);
|
|
230
|
-
}
|
|
231
|
-
to {
|
|
232
|
-
transform: translate3d(0, 0, 0);
|
|
233
|
-
}
|
|
234
|
-
}
|
|
235
|
-
|
|
236
|
-
@keyframes slideToLeft {
|
|
237
|
-
to {
|
|
238
|
-
transform: translate3d(calc(var(--initial-transform, 100%) * -1), 0, 0);
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
|
|
242
|
-
@keyframes slideFromRight {
|
|
243
|
-
from {
|
|
244
|
-
transform: translate3d(var(--initial-transform, 100%), 0, 0);
|
|
245
|
-
}
|
|
246
|
-
to {
|
|
247
|
-
transform: translate3d(0, 0, 0);
|
|
248
|
-
}
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
@keyframes slideToRight {
|
|
252
|
-
to {
|
|
253
|
-
transform: translate3d(var(--initial-transform, 100%), 0, 0);
|
|
254
|
-
}
|
|
255
|
-
}
|