feat: custom head

importantimport · Dec 14, 2023 · b44eb1b · b44eb1b
1 parent 20067a4
commit b44eb1b
Show file tree

Hide file tree

Showing 2 changed files with 78 additions and 1 deletion.
diff --git a/plugins/lts/head.ts b/plugins/lts/head.ts
@@ -0,0 +1,75 @@
+export interface DocumentMeta {
+  content?: string
+  httpEquiv?: string
+  name?: string
+  property?: string
+  itemprop?: string
+  media?: string
+}
+
+export interface DocumentLink {
+  as?: string
+  crossorigin?: string
+  disabled?: boolean
+  href?: string
+  hreflang?: string
+  id?: string
+  imagesizes?: string
+  imagesrcset?: string
+  integrity?: string
+  media?: string
+  prefetch?: string
+  referrerpolicy?: string
+  rel?: string
+  sizes?: string
+  title?: string
+  type?: string
+}
+
+// export interface DocumentStyle {
+//   // TODO
+// }
+
+// export interface DocumentScript {
+//   // TODO
+// }
+
+export type DocumentHead = {
+  metas?: DocumentMeta[]
+  links?: DocumentLink[]
+  // styles?: DocumentStyle[]
+  // scripts?: DocumentScript[]
+}
+
+// export default () => (site: Lume.Site) => {
+//   site.process(
+//     ['.html'],
+//     (pages) =>
+//       pages.forEach((page) => {
+//         if (page.data.head) {
+//           const head = page.data.head as DocumentHead
+
+//           head.metas?.forEach((meta) => {
+//             const el = page.document!.createElement('meta')
+//             Object.entries(meta).forEach(([k, v]) => el.setAttribute(k, v))
+//             page.document!.appendChild(el)
+//           })
+
+//           head.links?.forEach((link) => {
+//             const el = page.document!.createElement('link')
+//             Object.entries(link).forEach(([k, v]) => el.setAttribute(k, v))
+//             page.document!.appendChild(el)
+//           })
+//         }
+//       }),
+//   )
+// }
+
+/** Extends Data interface */
+declare global {
+  namespace Lume {
+    export interface Data {
+      head?: DocumentHead
+    }
+  }
+}
diff --git a/src/_includes/layouts/body.tsx b/src/_includes/layouts/body.tsx
@@ -1,14 +1,16 @@
-export default ({ title, children, metas }: Lume.Data, { html, url }: Lume.Helpers) => (
+export default ({ title, children, head, metas }: Lume.Data, { html, url }: Lume.Helpers) => (
   <html lang={metas?.lang ?? 'en'} prefix="og: https://ogp.me/ns#">
     <head>
       <meta charset="utf-8" />
       <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
       <meta name="view-transition" content="same-origin" />
       <meta name="supported-color-schemes" content="light dark" />
+      {head?.metas?.map((meta, key) => (<meta key={key} {...meta} />))}
       <title>{title}</title>
       <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text x=%22-.1em%22 y=%22.9em%22 font-size=%2290%22>❄️</text></svg>" />
       <link rel="stylesheet" href={url('/uno.css')} />
       <link rel="stylesheet" href={url('/styles.css')} />
+      {head?.links?.map((link, key) => (<meta key={key} {...link} />))}
       {/* {html`<script async type="module">
         import { listen } from 'https://esm.run/quicklink'
         listen()