rimelight-components 1.9.0 → 2.0.1

package/README.md

@@ -17,12 +17,13 @@ Find and replace all on all files (CMD+SHIFT+F):
 My new Nuxt module for doing amazing things.
 
 - [✨  Release Notes](/CHANGELOG.md)
-<!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
-<!-- - [📖 &nbsp;Documentation](https://example.com) -->
+  <!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
+  <!-- - [📖 &nbsp;Documentation](https://example.com) -->
 
 ## Features
 
 <!-- Highlight some of the features your module provide here -->
+
 - ⛰ &nbsp;Foo
 - 🚠 &nbsp;Bar
 - 🌲 &nbsp;Baz
@@ -37,7 +38,6 @@ npx nuxi module add my-module
 
 That's it! You can now use My Module in your Nuxt app ✨
 
-
 ## Contribution
 
 <details>
@@ -69,16 +69,13 @@ That's it! You can now use My Module in your Nuxt app ✨
 
 </details>
 
-
 <!-- Badges -->
+
 [npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
 [npm-version-href]: https://npmjs.com/package/my-module
-
 [npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
 [npm-downloads-href]: https://npm.chart.dev/my-module
-
 [license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
 [license-href]: https://npmjs.com/package/my-module
-
 [nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
 [nuxt-href]: https://nuxt.com

package/dist/module.d.mts

@@ -6,6 +6,11 @@ interface CalloutOptions {
     tooltip: string;
 }
 interface ModuleOptions {
+    /**
+     * Prefix for components
+     * @defaultValue `RC`
+     */
+    prefix?: string;
     callouts: {
         info: CalloutOptions;
         success: CalloutOptions;
@@ -19,3 +24,4 @@ interface ModuleOptions {
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
 export { _default as default };
+export type { ModuleOptions };

package/dist/module.json

@@ -1,12 +1,13 @@
 {
   "name": "rimelight-components",
-  "version": "0.0.1",
+  "version": "2.0.1",
+  "docs": "https://rimelight.com/tools/rimelight-components",
   "configKey": "rimelightComponents",
   "compatibility": {
     "nuxt": ">=4.0.0"
   },
   "builder": {
     "@nuxt/module-builder": "1.0.2",
-    "unbuild": "unknown"
+    "unbuild": "3.6.1"
   }
 }

package/dist/module.mjs

@@ -1,6 +1,14 @@
-import { defineNuxtModule, createResolver, addComponentsDir, addImportsDir } from '@nuxt/kit';
+import { addTemplate, defineNuxtModule, createResolver, addComponentsDir, addImportsDir } from '@nuxt/kit';
+import { defu } from 'defu';
+import { readdirSync } from 'node:fs';
+import { basename } from 'node:path';
+
+const name = "rimelight-components";
+const version = "2.0.1";
+const homepage = "https://rimelight.com/tools/rimelight-components";
 
 const defaultOptions = {
+  prefix: "RC",
   callouts: {
     info: {
       icon: "lucide:shield-alert",
@@ -39,10 +47,48 @@ const defaultOptions = {
     }
   }
 };
+
+function addBlockMapTemplates(blockNames, resolver) {
+  const template = addTemplate({
+    filename: "rimelight-blocks-map.mjs",
+    getContents: () => {
+      let content = "export const BLOCK_COMPONENT_MAP = {\n";
+      blockNames.forEach((name) => {
+        const componentPath = `rimelight-components/runtime/components/blocks/${name}.vue`;
+        content += `  '${name}': () => import('${componentPath}'),
+`;
+      });
+      content += "}\n";
+      return content;
+    },
+    write: true
+  });
+  addTemplate({
+    filename: "rimelight-blocks-map.d.ts",
+    getContents: () => {
+      const componentImporterType = '() => Promise<{ default: import("vue").Component }>';
+      let content = `// Generated by rimelight-components Nuxt Module
+`;
+      content += `import { Component } from 'vue'
+`;
+      content += `export declare const BLOCK_COMPONENT_MAP: { [key: string]: ${componentImporterType} | undefined }
+`;
+      blockNames.forEach((name) => {
+        content += `export declare const ${name}: ${componentImporterType}
+`;
+      });
+      return content;
+    },
+    write: true
+  });
+  return template;
+}
+
 const module = defineNuxtModule({
   meta: {
-    name: "rimelight-components",
-    version: "0.0.1",
+    name,
+    version,
+    docs: homepage,
     configKey: "rimelightComponents",
     compatibility: {
       nuxt: ">=4.0.0"
@@ -100,14 +146,26 @@ const module = defineNuxtModule({
   },
   setup(options, nuxt) {
     const resolver = createResolver(import.meta.url);
-    nuxt.options.appConfig.rimelightComponents = options;
+    nuxt.options.appConfig.rimelightComponents = defu(
+      nuxt.options.appConfig.rimelightComponents || {},
+      options
+    );
     addComponentsDir({
       path: resolver.resolve("./runtime/components/"),
       pathPrefix: false,
-      prefix: "RC",
+      prefix: options.prefix,
       global: true
     });
     addImportsDir(resolver.resolve("./runtime/composables"));
+    addImportsDir(resolver.resolve("./runtime/types"));
+    addImportsDir(resolver.resolve("./runtime/utils"));
+    const blocksPath = resolver.resolve("./runtime/components/blocks");
+    const blockFiles = readdirSync(blocksPath).filter(
+      (name2) => name2.endsWith(".vue")
+    );
+    const blockNames = blockFiles.map((file) => basename(file, ".vue"));
+    const template = addBlockMapTemplates(blockNames);
+    nuxt.options.alias["#build/rimelight-blocks-map"] = template.dst;
   },
   onInstall() {
     console.log("Setting up rimelight-components for the first time!");

package/dist/runtime/components/app/Footer.vue

@@ -2,9 +2,9 @@
 
 <template>
   <footer class="py-8 lg:py-12">
-    <UContainer class="gap-xl flex flex-col justify-between lg:flex-row">
+    <UContainer class="flex flex-col justify-between gap-xl lg:flex-row">
       <div
-        class="gap-xl order-last flex flex-col items-center justify-between lg:order-1 lg:items-start"
+        class="order-last flex flex-col items-center justify-between gap-xl lg:order-1 lg:items-start"
       >
         <slot name="left" />
       </div>
@@ -12,7 +12,7 @@
         <slot name="center" />
       </div>
       <div
-        class="gap-xl order-first flex flex-col items-center justify-between lg:order-3 lg:flex-1 lg:items-end"
+        class="order-first flex flex-col items-center justify-between gap-xl lg:order-3 lg:flex-1 lg:items-end"
       >
         <slot name="right" />
       </div>

package/dist/runtime/components/app/NewsletterSignup.vue

@@ -14,11 +14,7 @@ const {
 
 <template>
   <UForm>
-    <UFormField
-        name="email"
-        :label="fieldLabel"
-        :description="description"
-    >
+    <UFormField name="email" :label="fieldLabel" :description="description">
       <UFieldGroup class="pt-2">
         <UInput type="email" :placeholder="placeholder" />
         <UButton type="submit" :label="buttonLabel" />

package/dist/runtime/components/app/ScrollToTop.vue

@@ -55,7 +55,7 @@ const durationInSeconds = computed(() => `${props.duration}s`);
     <div v-if="isVisible">
       <UButton
         variant="ghost"
-        class="fixed bottom-4 right-4 z-50 size-20 lg:size-16"
+        class="fixed right-4 bottom-4 z-50 size-20 lg:size-16"
         @click="scrollToTop"
       >
         <div class="progress-circle-base size-full">

package/dist/runtime/components/blocks/ImageBlock.vue

@@ -9,7 +9,7 @@ const { src, alt, caption } = defineProps({
 <template>
   <figure class="mx-auto">
     <img :src="src" :alt="alt" class="h-auto w-full object-cover" />
-    <figcaption v-if="caption" class="text-muted mt-4 text-center text-sm">
+    <figcaption v-if="caption" class="mt-4 text-center text-sm text-muted">
       {{ caption }}
     </figcaption>
   </figure>

package/dist/runtime/components/blocks/SectionBlock.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { computed } from "vue";
-import { slugify } from "../../utils/slugify";
+import { slugify } from "../../utils";
 const { level, title, description, children } = defineProps({
   level: { type: Number, required: true },
   title: { type: String, required: true },

package/dist/runtime/components/cards/TeamCard.vue

@@ -9,21 +9,21 @@ const {} = defineProps({
 </script>
 
 <template>
-  <UCard>
-    <NuxtImg :src="src" :alt="alt" />
-    <div class="flex flex-col gap-xs">
-      <h3 class="text-xl font-bold">
-        {{ name }}
-      </h3>
-      <span class="text-sm">{{ role }}</span>
-    </div>
-    <p class="text-md">
-      {{ description }}
-    </p>
-    <template #footer>
-      <div class="flex flex-row gap-md">
-        <slot name="links" />
-      </div>
-    </template>
-  </UCard>
+  <UCard>
+    <NuxtImg :src="src" :alt="alt" />
+    <div class="flex flex-col gap-xs">
+      <h3 class="text-xl font-bold">
+        {{ name }}
+      </h3>
+      <span class="text-sm">{{ role }}</span>
+    </div>
+    <p class="text-md">
+      {{ description }}
+    </p>
+    <template #footer>
+      <div class="flex flex-row gap-md">
+        <slot name="links" />
+      </div>
+    </template>
+  </UCard>
 </template>

package/dist/runtime/components/content/Section.vue

@@ -1,5 +1,8 @@
 <script setup>
-import { useClipboard, useToast, useRoute, computed } from "#imports";
+import { useRoute } from "#imports";
+import { computed } from "vue";
+import { useClipboard } from "@vueuse/core";
+import { useToast } from "#imports";
 import { tv } from "tailwind-variants";
 import { slugify } from "../../utils";
 const { copy } = useClipboard();

package/dist/runtime/components/page/PageSurround.vue

@@ -24,21 +24,21 @@ const {
       <ULink v-if="previousTitle" :to="previousTo" class="h-full">
         <UCard
           variant="outline"
-          class="hover:bg-elevated/50 focus-visible:outline-primary group block h-full bg-transparent"
+          class="group block h-full bg-transparent hover:bg-elevated/50 focus-visible:outline-primary"
         >
-          <div class="gap-md flex flex-col">
-            <div class="gap-xs flex flex-col">
+          <div class="flex flex-col gap-md">
+            <div class="flex flex-col gap-xs">
               <UButton
                 variant="outline"
                 icon="lucide:arrow-left"
-                class="group-hover text-primary group-hover:text-highlighted w-fit rounded-full"
+                class="group-hover w-fit rounded-full text-primary group-hover:text-highlighted"
               />
               <span class="text-muted">
                 {{ $t("navigation_previous") }}
                 {{ $t(pageType) }}
               </span>
             </div>
-            <div class="gap-xs flex flex-col">
+            <div class="flex flex-col gap-xs">
               <p class="text-primary group-hover:text-highlighted">
                 {{ previousTitle }}
               </p>
@@ -54,25 +54,25 @@ const {
       <ULink v-if="nextTitle" :to="nextTo" class="h-full">
         <UCard
           variant="outline"
-          class="hover:bg-elevated/50 focus-visible:outline-primary group block h-full bg-transparent"
+          class="group block h-full bg-transparent hover:bg-elevated/50 focus-visible:outline-primary"
         >
-          <div class="gap-md flex flex-col items-end">
-            <div class="gap-xs flex flex-col items-end">
+          <div class="flex flex-col items-end gap-md">
+            <div class="flex flex-col items-end gap-xs">
               <UButton
                 variant="outline"
                 icon="lucide:arrow-right"
-                class="text-primary group-hover:text-highlighted w-fit rounded-full"
+                class="w-fit rounded-full text-primary group-hover:text-highlighted"
               />
               <span class="text-muted">
                 {{ $t("navigation_next") }}
                 {{ $t(pageType) }}</span
               >
             </div>
-            <div class="gap-xs flex flex-col items-end">
-              <p class="text-primary group-hover:text-highlighted text-right">
+            <div class="flex flex-col items-end gap-xs">
+              <p class="text-right text-primary group-hover:text-highlighted">
                 {{ nextTitle }}
               </p>
-              <p class="text-toned text-right">
+              <p class="text-right text-toned">
                 {{ nextDescription }}
               </p>
             </div>

package/dist/runtime/components/renderers/BlockRenderer.vue

@@ -19,7 +19,7 @@ const getComponent = (block) => {
 </script>
 
 <template>
-  <div class="gap-lg flex flex-col">
+  <div class="flex flex-col gap-lg">
     <UEmpty
       v-if="!blocks || blocks.length === 0"
       variant="naked"

package/dist/runtime/components/renderers/TOC.d.vue.ts

@@ -0,0 +1,26 @@
+import type { Block } from "../../types/blocks.js";
+import type { HeadingLevel } from "../../types/blocks.js";
+export interface TOCItem {
+    id: string;
+    title: string;
+    level: HeadingLevel;
+    children?: TOCItem[];
+}
+type __VLS_Props = {
+    pageBlocks: Block[];
+    title?: string;
+    levels?: HeadingLevel[];
+};
+declare var __VLS_6: {};
+type __VLS_Slots = {} & {
+    bottom?: (props: typeof __VLS_6) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/renderers/TOC.vue

@@ -0,0 +1,94 @@
+<script setup>
+import { computed } from "vue";
+import { slugify } from "../../utils";
+const {
+  pageBlocks,
+  title = "table_of_contents",
+  levels = [2, 3, 4]
+} = defineProps({
+  pageBlocks: { type: Array, required: true },
+  title: { type: String, required: false },
+  levels: { type: Array, required: false }
+});
+const extractHeadings = (blocks) => {
+  const headings = [];
+  if (!blocks || blocks.length === 0) {
+    return headings;
+  }
+  for (const block of blocks) {
+    if (block.type === "SectionBlock") {
+      const props = block.props;
+      const title2 = props.title;
+      const level = props.level;
+      if (title2 && level) {
+        headings.push({
+          id: slugify(title2),
+          title: title2,
+          level
+        });
+      }
+      if (props.children && props.children.length > 0) {
+        headings.push(...extractHeadings(props.children));
+      }
+    }
+  }
+  return headings;
+};
+const tocItems = computed(() => {
+  if (!pageBlocks || pageBlocks.length === 0) {
+    return [];
+  }
+  if (levels.length === 0) {
+    return [];
+  }
+  const allHeadings = extractHeadings(pageBlocks);
+  const filteredHeadings = allHeadings.filter(
+    (item) => levels.includes(item.level)
+  );
+  return Array.from(new Set(filteredHeadings.map((h) => h.id))).map(
+    (id) => filteredHeadings.find((h) => h.id === id)
+  );
+});
+</script>
+
+<template>
+  <div class="z-10 flex flex-col gap-md">
+    <nav
+      class="sticky top-(--ui-header-height) z-50 flex flex-col gap-md pt-lg"
+      aria-label="Table of Contents"
+    >
+      <h5 class="text-highlighted">
+        {{ $t(title) }}
+      </h5>
+
+      <ul
+        v-if="tocItems.length > 0"
+        class="flex flex-col gap-0 border-s border-default"
+      >
+        <li
+          v-for="item in tocItems"
+          :key="item.id"
+          class="relative flex min-w-0"
+          :class="{
+  'ms-2': item.level === 2,
+  'ms-4': item.level === 3,
+  'ms-6': item.level === 4,
+  'ms-8': item.level === 5,
+  'ms-10': item.level === 6
+}"
+        >
+          <NuxtLink
+            :href="`#${item.id}`"
+            class="group relative flex size-full items-center px-1.5 py-1.5 text-start text-sm font-medium before:absolute before:inset-x-0 before:inset-y-px before:z-[-1] before:rounded-md focus:outline-none focus-visible:outline-none focus-visible:before:ring-2 focus-visible:before:ring-inset dark:focus-visible:outline-none"
+          >
+            <span class="truncate">
+              {{ item.title }}
+            </span>
+          </NuxtLink>
+        </li>
+      </ul>
+
+      <slot name="bottom" />
+    </nav>
+  </div>
+</template>

package/dist/runtime/components/renderers/TOC.vue.d.ts

@@ -0,0 +1,26 @@
+import type { Block } from "../../types/blocks.js";
+import type { HeadingLevel } from "../../types/blocks.js";
+export interface TOCItem {
+    id: string;
+    title: string;
+    level: HeadingLevel;
+    children?: TOCItem[];
+}
+type __VLS_Props = {
+    pageBlocks: Block[];
+    title?: string;
+    levels?: HeadingLevel[];
+};
+declare var __VLS_6: {};
+type __VLS_Slots = {} & {
+    bottom?: (props: typeof __VLS_6) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/swatches/ColorSwatch.vue

@@ -1,5 +1,7 @@
 <script setup>
-import { useClipboard, useToast, computed } from "#imports";
+import { computed } from "vue";
+import { useClipboard } from "@vueuse/core";
+import { useToast } from "#imports";
 const { copy } = useClipboard();
 const toast = useToast();
 const { name, hex, rgb, hsl, oklch, cmyk } = defineProps({
@@ -44,12 +46,12 @@ const color = computed(() => {
     <template #header v-if="name">
       <h3 class="text-lg font-bold">{{ name }}</h3>
     </template>
-    <div class="gap-sm flex flex-col items-center xl:flex-row xl:items-start">
+    <div class="flex flex-col items-center gap-sm xl:flex-row xl:items-start">
       <div
-        class="p-sm flex aspect-square size-48"
+        class="flex aspect-square size-48 p-sm"
         :style="{ backgroundColor: color }"
       >
-        <div class="gap-xs flex flex-col justify-end text-xs">
+        <div class="flex flex-col justify-end gap-xs text-xs">
           <span v-if="name" class="text-sm">{{ formatColor(name) }}</span>
           <span v-if="hex">HEX {{ formatColor(hex) }}</span>
           <span v-if="rgb">{{ formatColor(rgb) }}</span>
@@ -58,7 +60,7 @@ const color = computed(() => {
           <span v-if="cmyk">{{ formatColor(cmyk) }}</span>
         </div>
       </div>
-      <div class="gap-sm flex w-full flex-col justify-center">
+      <div class="flex w-full flex-col justify-center gap-sm">
         <UButton
           v-if="hex"
           variant="outline"

package/dist/runtime/components/swatches/FontSwatch.vue

@@ -22,7 +22,7 @@ const image = computed(() => {
       <h3 class="text-lg font-bold">{{ name }}</h3>
       <span></span>
     </template>
-    <div class="gap-sm flex flex-col">
+    <div class="flex flex-col gap-sm">
       <h1>H1</h1>
       <p>{{}}</p>
     </div>
@@ -31,8 +31,8 @@ const image = computed(() => {
     <p>a b c d e f g h i j k l m n o p q r s t u v w x y z</p>
     <p>A B C D E F G H I J K L M N O P Q R S T U V W X Y Z</p>
     <p></p>
-    <div class="gap-sm flex flex-col items-center xl:flex-row xl:items-start">
-      <div class="gap-sm flex w-full flex-col justify-center">
+    <div class="flex flex-col items-center gap-sm xl:flex-row xl:items-start">
+      <div class="flex w-full flex-col justify-center gap-sm">
         <UButton
           v-if="jpg"
           variant="outline"

package/dist/runtime/components/swatches/ImageSwatch.vue

@@ -21,9 +21,9 @@ const image = computed(() => {
     <template #header v-if="name">
       <h3 class="text-lg font-bold">{{ name }}</h3>
     </template>
-    <div class="gap-sm flex flex-col items-center xl:flex-row xl:items-start">
+    <div class="flex flex-col items-center gap-sm xl:flex-row xl:items-start">
       <NuxtImg :src="image" class="size-48" />
-      <div class="gap-sm flex w-full flex-col justify-center">
+      <div class="flex w-full flex-col justify-center gap-sm">
         <UButton
           v-if="jpg"
           variant="outline"

package/dist/runtime/components/utilities/Placeholder.vue

@@ -1,30 +1,30 @@
-<script setup lang="ts"></script>
-
-<template>
-  <div
-    class="relative flex items-center justify-center overflow-hidden rounded-sm border border-dashed border-accented px-4 opacity-75"
-  >
-    <svg class="absolute inset-0 h-full w-full stroke-inverted/10">
-      <defs>
-        <pattern
-          id="pattern-5c1e4f0e-62d5-498b-8ff0-cf77bb448c8e"
-          x="0"
-          y="0"
-          width="10"
-          height="10"
-          patternUnits="userSpaceOnUse"
-        >
-          <path d="M-3 13 15-5M-5 5l18-18M-1 21 17 3" />
-        </pattern>
-      </defs>
-      <rect
-        stroke="none"
-        fill="url(#pattern-5c1e4f0e-62d5-498b-8ff0-cf77bb448c8e)"
-        width="100%"
-        height="100%"
-      />
-    </svg>
-
-    <slot />
-  </div>
-</template>
+<script setup lang="ts"></script>
+
+<template>
+  <div
+    class="relative flex items-center justify-center overflow-hidden rounded-sm border border-dashed border-accented px-4 opacity-75"
+  >
+    <svg class="absolute inset-0 h-full w-full stroke-inverted/10">
+      <defs>
+        <pattern
+          id="pattern-5c1e4f0e-62d5-498b-8ff0-cf77bb448c8e"
+          x="0"
+          y="0"
+          width="10"
+          height="10"
+          patternUnits="userSpaceOnUse"
+        >
+          <path d="M-3 13 15-5M-5 5l18-18M-1 21 17 3" />
+        </pattern>
+      </defs>
+      <rect
+        stroke="none"
+        fill="url(#pattern-5c1e4f0e-62d5-498b-8ff0-cf77bb448c8e)"
+        width="100%"
+        height="100%"
+      />
+    </svg>
+
+    <slot />
+  </div>
+</template>

package/dist/runtime/server/tsconfig.json

@@ -1,3 +1,3 @@
 {
-  "extends": "../../../.nuxt/tsconfig.server.json",
+  "extends": "../../../.nuxt/tsconfig.server.json"
 }

package/dist/runtime/types/app.config.d.ts

@@ -0,0 +1,6 @@
+declare module "#build/app.config" {
+  import type { AppConfig } from "@nuxt/schema"
+
+  const _default: AppConfig
+  export default _default
+}

package/dist/runtime/types/blocks.d.ts

@@ -1,3 +1,7 @@
+/**
+ * Defines the allowed heading levels (h2 through h6) for the Table of Contents.
+ */
+export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
 /**
  * All valid block types the application can render.
  * This union type is the single source of truth for component names.
@@ -13,7 +17,7 @@ export interface BaseContentBlock {
     props: Record<string, any>;
 }
 export interface SectionBlockProps {
-    level: 1 | 2 | 3 | 4 | 5 | 6;
+    level: HeadingLevel;
     title: string;
     description?: string;
     children: Block[];

package/dist/runtime/utils/blockMapper.js

@@ -1,16 +1,10 @@
 import { defineAsyncComponent } from "vue";
-const BLOCK_COMPONENTS = import.meta.glob(
-  "../components/blocks/*.vue"
-);
-const typeToRelativePath = (type) => {
-  return `/components/blocks/${type}.vue`;
-};
+import { BLOCK_COMPONENT_MAP } from "#build/rimelight-blocks-map";
 export const getBlockComponent = (type) => {
-  const componentPath = typeToRelativePath(type);
-  const componentImporter = BLOCK_COMPONENTS[componentPath];
+  const componentImporter = BLOCK_COMPONENT_MAP[type];
   if (!componentImporter) {
     console.warn(
-      `[BlockMapper] Block component not found for type: ${type}. Expected path: ${componentPath}`
+      `[BlockMapper] Block component not found for type: ${type}. Please check block name.`
     );
     return void 0;
   }

package/dist/runtime/utils/index.js

@@ -7,5 +7,5 @@ export function slugify(text) {
   if (!text) {
     return "";
   }
-  return text.toString().normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase().trim().replace(/\s+/g, "-").replace(/[^\w\-]+/g, "").replace(/\-\-+/g, "-").replace(/^-+/, "").replace(/-+$/, "");
+  return text.toString().normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase().trim().replace(/\s+/g, "-").replace(/[^\w-]+/g, "").replace(/--+/g, "-").replace(/^-+/, "").replace(/-+$/, "");
 }

package/dist/types.d.mts

@@ -1,7 +1,3 @@
-import type { NuxtModule } from '@nuxt/schema'
-
-import type { default as Module } from './module.mjs'
-
-export type ModuleOptions = typeof Module extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
-
 export { default } from './module.mjs'
+
+export { type ModuleOptions } from './module.mjs'

package/package.json

@@ -1,13 +1,13 @@
 {
+  "type": "module",
   "name": "rimelight-components",
-  "description": "My new Nuxt module",
-  "version": "1.9.0",
+  "description": "A component library by Rimelight Entertainment.",
+  "version": "2.0.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Rimelight-Entertainment/rimelight-components.git"
   },
   "homepage": "https://rimelight.com/tools/rimelight-components",
-  "type": "module",
   "license": "MIT",
   "keywords": [
     "rimelight",
@@ -33,11 +33,30 @@
       "import": "./dist/runtime/utils/*.js"
     }
   },
+  "style": "./dist/runtime/index.css",
   "main": "./dist/module.mjs",
   "typesVersions": {
     "*": {
       ".": [
-        "./dist/types.d.mts"
+        "./dist/module.d.mts"
+      ],
+      "vite": [
+        "./dist/vite.d.mts"
+      ],
+      "./runtime/*": [
+        "./dist/runtime/index.d.ts"
+      ],
+      "components/*": [
+        "./dist/runtime/components/*"
+      ],
+      "composables/*": [
+        "./dist/runtime/composables/*"
+      ],
+      "utils": [
+        "./dist/runtime/utils/index.d.ts"
+      ],
+      "utils/*": [
+        "./dist/runtime/utils/*.d.ts"
       ]
     }
   },
@@ -45,21 +64,21 @@
     "dist"
   ],
   "scripts": {
-    "prepack": "nuxt-module-build build",
-    "dev": "bun run dev:prepare && nuxi dev playground",
-    "dev:build": "nuxi build playground",
+    "build": "nuxt-module-build build",
+    "dev": "bun run dev:prepare && nuxt dev playground",
+    "dev:build": "nuxt build playground",
     "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
-    "release": "bun run lint && bun run test && bun run prepack && changelogen --release && bun publish && git push --follow-tags",
+    "prepack": "bun run build",
     "typecheck": "vue-tsc --noEmit && nuxt typecheck",
     "lint": "oxlint .",
     "lint:fix": "oxlint . --fix",
+    "format": "prettier . --check .",
+    "format:fix": "prettier . --write .",
     "test": "vitest run",
     "test:watch": "vitest watch",
-    "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit"
+    "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit",
+    "release": "bun run lint && bun run test && bun run prepack && changelogen --release && bun publish && git push --follow-tags"
   },
-  "workspaces": [
-    "playground"
-  ],
   "dependencies": {
     "@nuxt/image": "^1.11.0",
     "@nuxt/kit": "^4.2.0",
@@ -68,6 +87,7 @@
     "@vueuse/core": "^14.0.0",
     "@vueuse/nuxt": "^14.0.0",
     "date-fns": "^4.1.0",
+    "defu": "^6.1.4",
     "nuxt": "^4.2.0",
     "tailwind-variants": "^3.1.1",
     "vue": "^3.5.22"
@@ -96,5 +116,8 @@
   "trustedDependencies": [
     "@parcel/watcher",
     "@tailwindcss/oxide"
-  ]
+  ],
+  "resolutions": {
+    "rimelight-components": "workspace:*"
+  }
 }

package/dist/runtime/utils/slugify.d.ts

@@ -1,6 +0,0 @@
-/**
- * Converts a string to a URL-friendly slug.
- * @param str The input string.
- * @returns The slugified string.
- */
-export declare function slugify(str: string): string;

package/dist/runtime/utils/slugify.js

@@ -1,3 +0,0 @@
-export function slugify(str) {
-  return str.toLowerCase().trim().replace(/[^\w\s-]/g, "").replace(/[\s_-]+/g, "-").replace(/^-+|-+$/g, "");
-}