diff --git a/.pnp.cjs b/.pnp.cjs index 09217bb..9b5dfc5 100755 --- a/.pnp.cjs +++ b/.pnp.cjs @@ -50,6 +50,7 @@ const RAW_RUNTIME_STATE = ["astro-breadcrumbs", "virtual:a9b1222052dffa20c83605ac26b64fd717aa2982dc89da74b78301a8333c50a120c12db3f68c240302341b52215e986347cefceb71633b5918936083bd9430ce#npm:3.3.1"],\ ["astro-icon", "npm:1.1.5"],\ ["hast-util-from-html", "npm:2.0.3"],\ + ["hastscript", "npm:9.0.1"],\ ["jsonc-parser", "npm:3.3.1"],\ ["pagefind", "npm:1.4.0"],\ ["quickshell-docs", "workspace:."],\ @@ -6380,6 +6381,7 @@ const RAW_RUNTIME_STATE = ["astro-breadcrumbs", "virtual:a9b1222052dffa20c83605ac26b64fd717aa2982dc89da74b78301a8333c50a120c12db3f68c240302341b52215e986347cefceb71633b5918936083bd9430ce#npm:3.3.1"],\ ["astro-icon", "npm:1.1.5"],\ ["hast-util-from-html", "npm:2.0.3"],\ + ["hastscript", "npm:9.0.1"],\ ["jsonc-parser", "npm:3.3.1"],\ ["pagefind", "npm:1.4.0"],\ ["quickshell-docs", "workspace:."],\ diff --git a/package.json b/package.json index c8d4fed..f142f2d 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ "astro-breadcrumbs": "^3.3.1", "astro-icon": "^1.1.5", "hast-util-from-html": "^2.0.3", + "hastscript": "^9.0.1", "rehype": "^13.0.2", "remark-github-blockquote-alert": "^2.0.0", "solid-js": "^1.9.10", diff --git a/public/assets/showcase/end4.mp4 b/public/assets/showcase/end4.mp4 index 8800239..d3bcd77 100644 Binary files a/public/assets/showcase/end4.mp4 and b/public/assets/showcase/end4.mp4 differ diff --git a/public/assets/showcase/flicko.mp4 b/public/assets/showcase/flicko.mp4 index dc9383f..a4d8028 100644 Binary files a/public/assets/showcase/flicko.mp4 and b/public/assets/showcase/flicko.mp4 differ diff --git a/public/assets/showcase/outfoxxed.mp4 b/public/assets/showcase/outfoxxed.mp4 index b10cbcf..c2b7d61 100644 Binary files a/public/assets/showcase/outfoxxed.mp4 and b/public/assets/showcase/outfoxxed.mp4 differ diff --git a/public/assets/showcase/pfaj-bdeblase.mp4 b/public/assets/showcase/pfaj-bdeblase.mp4 index 01fd915..9f27a7d 100644 Binary files a/public/assets/showcase/pfaj-bdeblase.mp4 and b/public/assets/showcase/pfaj-bdeblase.mp4 differ diff --git a/public/assets/showcase/soramane.mp4 b/public/assets/showcase/soramane.mp4 index 79812e1..c14ff50 100644 Binary files a/public/assets/showcase/soramane.mp4 and b/public/assets/showcase/soramane.mp4 differ diff --git a/public/assets/showcase/vaxry.mp4 b/public/assets/showcase/vaxry.mp4 index 621a88b..f1b4bf4 100644 Binary files a/public/assets/showcase/vaxry.mp4 and b/public/assets/showcase/vaxry.mp4 differ diff --git a/public/assets/simple-shell-livereload.mp4 b/public/assets/simple-shell-livereload.mp4 index acd1dd5..f9aacc9 100644 Binary files a/public/assets/simple-shell-livereload.mp4 and b/public/assets/simple-shell-livereload.mp4 differ diff --git a/src/components/hooks/CreateCopyButtons.astro b/src/components/hooks/CreateCopyButtons.astro index 944d1cd..6237a0e 100644 --- a/src/components/hooks/CreateCopyButtons.astro +++ b/src/components/hooks/CreateCopyButtons.astro @@ -3,51 +3,34 @@ --- diff --git a/src/components/marquee/Marquee.astro b/src/components/marquee/Marquee.astro index 4cbb5a3..f56f54f 100644 --- a/src/components/marquee/Marquee.astro +++ b/src/components/marquee/Marquee.astro @@ -2,38 +2,38 @@ import { Icon } from "astro-icon/components"; const videos = [ - { - author: 'soramane', - source: "https://github.com/caelestia-dots/shell", - path: "/assets/showcase/soramane.mp4", - installable: true, - }, - { - author: 'end_4', - source: "https://github.com/end-4/dots-hyprland", - path: "/assets/showcase/end4.mp4", - installable: true, - }, - { - author: 'outfoxxed', - source: - "https://git.outfoxxed.me/outfoxxed/nixnew/src/branch/master/modules/user/modules/quickshell", - path: "/assets/showcase/outfoxxed.mp4", - }, - { - author: - 'pfaj and bdebiase', - path: "/assets/showcase/pfaj-bdeblase.mp4", - }, - { - author: 'flicko', - source: "https://github.com/flickowoa/zephyr", - path: "/assets/showcase/flicko.mp4", - }, - { - author: 'vaxry', - path: "/assets/showcase/vaxry.mp4", - }, + { + author: 'soramane', + source: "https://github.com/caelestia-dots/shell", + path: "/assets/showcase/soramane.mp4", + installable: true, + }, + { + author: 'end_4', + source: "https://github.com/end-4/dots-hyprland", + path: "/assets/showcase/end4.mp4", + installable: true, + }, + { + author: 'outfoxxed', + source: + "https://git.outfoxxed.me/outfoxxed/nixnew/src/branch/master/modules/user/modules/quickshell", + path: "/assets/showcase/outfoxxed.mp4", + }, + { + author: + 'pfaj and bdebiase', + path: "/assets/showcase/pfaj-bdeblase.mp4", + }, + { + author: 'flicko', + source: "https://github.com/flickowoa/zephyr", + path: "/assets/showcase/flicko.mp4", + }, + { + author: 'vaxry', + path: "/assets/showcase/vaxry.mp4", + }, ]; ---
diff --git a/src/config/_types/codeblock.ts b/src/config/_types/codeblock.ts new file mode 100644 index 0000000..65f0d8a --- /dev/null +++ b/src/config/_types/codeblock.ts @@ -0,0 +1,9 @@ +interface CopyButtonOptions { + duration?: number; + copyIcon?: string; + successIcon?: string; + display?: "hover" | "ready"; + cssVariables?: string; +} + +export type { CopyButtonOptions }; diff --git a/src/config/_types/index.ts b/src/config/_types/index.ts index e498ef6..ba1ecf5 100644 --- a/src/config/_types/index.ts +++ b/src/config/_types/index.ts @@ -13,6 +13,7 @@ import type { VersionsData, } from "./module"; import type { SearchLists } from "./search"; +import type { CopyButtonOptions } from "./codeblock"; export type { QMLTypeLinkObject, @@ -28,4 +29,5 @@ export type { VersionData, VersionsData, SearchLists, + CopyButtonOptions, }; diff --git a/src/config/io/markdown.ts b/src/config/io/markdown.ts index d037a87..978f313 100644 --- a/src/config/io/markdown.ts +++ b/src/config/io/markdown.ts @@ -14,12 +14,14 @@ import { remarkAlert } from "remark-github-blockquote-alert"; import rehypeShiki from "@shikijs/rehype"; import sectionize from "@hbsnow/rehype-sectionize"; import type { ShikiTransformer } from "shiki"; +import { h } from "hastscript"; import { getQMLTypeLinkObject, getQMLTypeLink, getIconForLink, } from "./helpers.ts"; +import type { CopyButtonOptions } from "@_types"; let currentVersion = "NOVERSION"; @@ -155,7 +157,54 @@ const shikiRewriteTypelinks: ShikiTransformer = { }, }; -export const markdownConfig: AstroMarkdownOptions = { +const shikiCopyButton: ShikiTransformer = { + name: "copy-button", + pre(node) { + const options: CopyButtonOptions = { + duration: 3000, + }; + const button = h( + "button", + { + class: "copy-button", + role: "button", + "aria-label": "Copy to clipboard", + "alia-live": "polite", + // "data-code": removeCodeAnnotations(this.source), + onclick: ` + navigator.clipboard.writeText(this.dataset.code); + this.classList.add('copied'); + this.setAttribute('aria-pressed', 'true'); + setTimeout(() => { this.classList.remove('copied'); this.setAttribute('aria-pressed', 'false');}, ${options.duration}) + `, + }, + [ + h("span", { class: "ready" }), + h("span", { class: "success" }), + h( + "svg", + { + class: "copy-icon", + role: "icon", + xmlns: "http://www.w3.org/2000/svg", + width: "1em", + height: "1em", + viewBox: "0 0 256 256", + }, + [ + h("path", { + fill: "currentColor", + d: "M200 32h-36.26a47.92 47.92 0 0 0-71.48 0H56a16 16 0 0 0-16 16v168a16 16 0 0 0 16 16h144a16 16 0 0 0 16-16V48a16 16 0 0 0-16-16m-72 0a32 32 0 0 1 32 32H96a32 32 0 0 1 32-32m72 184H56V48h26.75A47.9 47.9 0 0 0 80 64v8a8 8 0 0 0 8 8h80a8 8 0 0 0 8-8v-8a47.9 47.9 0 0 0-2.75-16H200Z", + }), + ] + ), + ] + ); + node.children.splice(0, 0, button); + }, +}; + +const markdownConfig: AstroMarkdownOptions = { syntaxHighlight: false, remarkPlugins: [ remarkParseAtTypes, @@ -182,7 +231,7 @@ export const markdownConfig: AstroMarkdownOptions = { }, defaultColor: false, wrap: true, - transformers: [shikiRewriteTypelinks], + transformers: [shikiRewriteTypelinks, shikiCopyButton], }, ], // FIXME: incompatible types between unified/Plugin and Astro/RehypePlugin @@ -206,7 +255,7 @@ async function getMarkdownProcessor(): Promise { return globalMarkdownProcessor; } -export async function processMarkdown( +async function processMarkdown( version: string, markdown: string ): Promise { @@ -217,3 +266,5 @@ export async function processMarkdown( currentVersion = "NOVERSION"; return r; } + +export { markdownConfig, processMarkdown }; diff --git a/src/config/io/types.d.ts b/src/config/io/types.d.ts deleted file mode 100644 index 6b9d76a..0000000 --- a/src/config/io/types.d.ts +++ /dev/null @@ -1,120 +0,0 @@ -//# FIXME: fuseConfig.ts -// -- - -// generateSearchLists.ts -interface SearchLists { - slug: string; - link: string; - summary: string; -} -// -- - -// generateTypeData.ts -interface QuickshellBase { - type: string; - module: string; - name: string; -} - -interface QuickshellInstance { - name?: string; - type: { - gadget?: QuickshellGadget; - type: string; - module: string; - name: string; - of?: QuickshellBase; - }; - details?: string; - flags?: string[]; -} - -interface QuickshellGadget { - [key: string]: QuickshellInstance; -} - -interface QuickshellProps { - [key: string]: QuickshellInstance; -} - -interface QuickshellFunction { - ret: QuickshellInstance; - name: string; - id: string; - details: string; - params: QuickshellInstance[]; -} - -interface QuickshellSignal { - [key: string]: { - name: string; - details: string; - params: QuickshellInstance[]; - }; -} - -interface QuickshellVariant { - [key: string]: { - name?: string; - details: string; - params?: QuickshellInstance[]; - }; -} - -interface TypeData { - name: string; - description: string; - details: string; - flags?: string[]; - contains?: string[]; - super?: QuickshellBase; - properties?: QuickshellProps; - functions?: QuickshellFunction[]; - signals?: QuickshellSignal; - variants?: QuickshellVariant; - subtypes?: QuickshellData[]; -} - -interface ModuleData { - name: string; - description: string; - details: string; - types: TypeData[]; -} - -interface VersionData { - name: string; - changelog?: string; - modules: ModuleData[]; -} - -interface VersionsData { - default: string; - versions: VersionData[]; -} -// -- - -// helpers.ts -interface QMLTypeLinkObject { - type: string; - module?: string; - name?: string; - mtype?: string; - mname?: string; -} -// -- - -export type { - QuickshellBase, - QuickshellInstance, - QuickshellGadget, - QuickshellProps, - QuickshellFunction, - QuickshellSignal, - QuickshellVariant, - TypeData, - ModuleData, - VersionData, - VersionsData, - QMLTypeLinkObject, -}; diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index d8610fa..a4adb35 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -21,3 +21,4 @@ const { title, description } = Astro.props; + diff --git a/src/layouts/DocsLayout.astro b/src/layouts/DocsLayout.astro index 86a0a21..d5381a4 100644 --- a/src/layouts/DocsLayout.astro +++ b/src/layouts/DocsLayout.astro @@ -15,16 +15,18 @@ interface Props { title: string; description: string; headings?: ConfigHeading[]; - type?: TypeData + type?: TypeData; } const { title, description, headings, type } = Astro.props; let url = Astro.url.pathname.split("/").filter(s => s !== ""); -const breadcrumbs = [{ - text: "custom", - href: "/", -}]; +const breadcrumbs = [ + { + text: "custom", + href: "/", + }, +]; let linkPath = ""; if (url[0] === "docs") { @@ -90,4 +92,33 @@ for (const segment of url) {