@rimelight/ui 0.0.36 → 0.0.38

package/src/docs/components/ApiProps.astro

@@ -1,47 +0,0 @@
----
-import type { ComponentMetaMap, PropMeta } from "../types"
-import { filterProps } from "../utils"
-import meta from "virtual:rimelight-ui-docs-meta"
-
-interface Props {
-  component: string
-  hide?: string[]
-  show?: string[]
-}
-
-const { component, hide = ["class"], show } = Astro.props
-
-const allMeta = meta as unknown as ComponentMetaMap
-const compMeta = allMeta[component]
-
-const filterOpts: { hide?: string[]; show?: string[] } = { hide }
-if (show !== undefined) filterOpts.show = show
-const props = filterProps(compMeta?.props ?? [], filterOpts)
----
-
-{props.length > 0 ? (
-  <table>
-    <thead>
-      <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th>Required</th>
-        <th>Default</th>
-        <th>Description</th>
-      </tr>
-    </thead>
-    <tbody>
-      {props.map((prop: PropMeta) => (
-        <tr>
-          <td><span class="font-mono text-sm">{prop.name}</span></td>
-          <td><span class="font-mono text-xs text-gray-600 dark:text-gray-400">{prop.type}</span></td>
-          <td>{prop.required ? "Yes" : "No"}</td>
-          <td>{prop.default !== undefined ? <span class="font-mono text-xs text-gray-600 dark:text-gray-400">{prop.default}</span> : "—"}</td>
-          <td>{prop.description || "—"}</td>
-        </tr>
-      ))}
-    </tbody>
-  </table>
-) : (
-  <p class="text-sm italic text-gray-500">No props to display.</p>
-)}

package/src/docs/components/ApiSlots.astro

@@ -1,50 +0,0 @@
----
-import type { ComponentMetaMap, SlotMeta } from "../types"
-import meta from "virtual:rimelight-ui-docs-meta"
-
-interface Props {
-  component: string
-}
-
-const { component } = Astro.props
-
-const allMeta = meta as unknown as ComponentMetaMap
-const compMeta = allMeta[component]
-
-const slots = compMeta?.slots ?? []
----
-
-{slots.length === 0 ? (
-  <p class="text-sm italic text-gray-500">No slots to display.</p>
-) : (
-  <div class="overflow-x-auto">
-    <table class="w-full text-sm border-collapse">
-      <thead>
-        <tr class="border-b border-gray-200 dark:border-gray-700">
-          <th class="text-left py-2 px-3 font-semibold">Slot</th>
-          <th class="text-left py-2 px-3 font-semibold">Type</th>
-        </tr>
-      </thead>
-      <tbody>
-        {slots.map((slot: SlotMeta) => (
-          <tr class="border-b border-gray-100 dark:border-gray-800">
-            <td class="py-2 px-3">
-              <span class="font-mono text-sm">
-                {slot.name}
-              </span>
-            </td>
-            <td class="py-2 px-3">
-              {Object.keys(slot.bindings).length > 0 ? (
-                <span class="font-mono text-xs text-gray-600 dark:text-gray-400">
-                  {Object.values(slot.bindings)[0]}
-                </span>
-              ) : (
-                <span class="text-gray-400">-</span>
-              )}
-            </td>
-          </tr>
-        ))}
-      </tbody>
-    </table>
-  </div>
-)}

package/src/docs/components/ApiTheme.astro

@@ -1,100 +0,0 @@
----
-import type { ComponentMetaMap } from "../types"
-import { generateThemeCode } from "../utils"
-import meta from "virtual:rimelight-ui-docs-meta"
-
-interface Props {
-  component: string
-}
-
-const { component } = Astro.props
-
-const allMeta = meta as unknown as ComponentMetaMap
-const compMeta = allMeta[component]
-
-const theme = compMeta?.theme ?? null
-const themeCode = theme ? generateThemeCode(component, theme) : null
----
-
-{themeCode ? (
-  <div class="api-theme-container relative border border-gray-800 rounded-lg overflow-hidden group mb-6" data-component={component}>
-    <div class="api-theme-collapse overflow-hidden max-h-[240px] relative transition-[max-height] duration-300 ease-in-out">
-      <div class="expressive-code m-0 border-0 rounded-none">
-        <figure class="frame m-0 border-0">
-          <pre class="language-ts overflow-x-auto m-0 border-0 rounded-none bg-gray-900"><code class="language-ts m-0">{themeCode}</code></pre>
-        </figure>
-      </div>
-      
-      {/* Gradient Fade Overlay */}
-      <div class="api-theme-fade absolute bottom-0 left-0 right-0 h-20 bg-gradient-to-t from-gray-950 to-transparent pointer-events-none transition-opacity duration-300"></div>
-    </div>
-    
-    {/* Toggle Button Container */}
-    <div class="api-theme-trigger-bar absolute bottom-0 left-0 right-0 flex justify-center pb-3 bg-gradient-to-t from-gray-950/90 via-gray-950/70 to-transparent pt-12">
-      <button class="api-theme-btn px-4 py-1.5 text-xs font-semibold text-white bg-gray-800 hover:bg-gray-700 border border-gray-700 hover:border-gray-650 rounded-md shadow-md transition-all duration-200 cursor-pointer">
-        Show theme config
-      </button>
-    </div>
-  </div>
-) : (
-  <p class="text-sm italic text-gray-500">No theme data available.</p>
-)}
-
-<script>
-  function setupThemeCollapser() {
-    if (typeof document === 'undefined') return;
-    const containers = document.querySelectorAll('.api-theme-container');
-    containers.forEach(container => {
-      if (container.getAttribute('data-collapser-ready') === 'true') return;
-      container.setAttribute('data-collapser-ready', 'true');
-
-      const collapseWrapper = container.querySelector('.api-theme-collapse') as HTMLElement;
-      const fadeOverlay = container.querySelector('.api-theme-fade') as HTMLElement;
-      const btn = container.querySelector('.api-theme-btn') as HTMLButtonElement;
-      const triggerBar = container.querySelector('.api-theme-trigger-bar') as HTMLElement;
-
-      if (!collapseWrapper || !btn || !triggerBar || !fadeOverlay) return;
-
-      // Let code blocks load and measure scrollHeight
-      const checkAndSetup = () => {
-        const scrollHeight = collapseWrapper.scrollHeight;
-        if (scrollHeight <= 240) {
-          collapseWrapper.style.maxHeight = 'none';
-          fadeOverlay.style.display = 'none';
-          triggerBar.style.display = 'none';
-          return;
-        }
-
-        let isExpanded = false;
-
-        btn.addEventListener('click', () => {
-          isExpanded = !isExpanded;
-          if (isExpanded) {
-            collapseWrapper.style.maxHeight = `${collapseWrapper.scrollHeight}px`;
-            btn.textContent = 'Hide theme config';
-            fadeOverlay.style.opacity = '0';
-            triggerBar.classList.remove('absolute', 'bottom-0');
-            triggerBar.classList.add('relative', 'bg-gray-950', 'py-3', 'border-t', 'border-gray-800');
-            triggerBar.style.paddingTop = '12px';
-          } else {
-            collapseWrapper.style.maxHeight = '240px';
-            btn.textContent = 'Show theme config';
-            fadeOverlay.style.opacity = '1';
-            triggerBar.classList.add('absolute', 'bottom-0');
-            triggerBar.classList.remove('relative', 'bg-gray-950', 'py-3', 'border-t', 'border-gray-800');
-            triggerBar.style.paddingTop = '48px';
-            container.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-          }
-        });
-      };
-
-      // Delay slightly to ensure fonts/expressive code are rendered
-      setTimeout(checkAndSetup, 150);
-    });
-  }
-
-  if (typeof document !== 'undefined') {
-    setupThemeCollapser();
-    document.addEventListener('astro:after-swap', setupThemeCollapser);
-  }
-</script>

package/src/docs/extractAll.ts

@@ -1,94 +0,0 @@
-import { existsSync, readdirSync } from "node:fs"
-import path from "node:path"
-import { fileURLToPath } from "node:url"
-import type { ComponentMeta, PropMeta, SlotMeta, EmitMeta } from "./types"
-import { extractAstroMeta } from "./extractors/extractAstro"
-import { extractVueMeta } from "./extractors/extractVue"
-import { extractThemeMeta } from "./extractors/extractTheme"
-
-const pathDirname = path.dirname(fileURLToPath(import.meta.url))
-const uiRoot = path.resolve(pathDirname, "..", "..")
-
-function pascalToKebab(name: string): string {
-  return name.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase()
-}
-
-function getComponentNameFromFilename(filename: string): string {
-  return filename.replace(/^(RLA|RLV)/, "").replace(/\.(astro|vue)$/, "")
-}
-
-export async function extractAllMeta(): Promise<Record<string, ComponentMeta>> {
-  const componentsDir = path.join(uiRoot, "src", "components")
-  const themesDir = path.join(uiRoot, "src", "themes")
-
-  const vueDir = path.join(componentsDir, "vue")
-  const astroDir = path.join(componentsDir, "astro")
-
-  const vueFiles = existsSync(vueDir)
-    ? readdirSync(vueDir).filter((f: string) => f.endsWith(".vue"))
-    : []
-  const astroFiles = existsSync(astroDir)
-    ? readdirSync(astroDir).filter((f: string) => f.endsWith(".astro") && f !== "Head.astro")
-    : []
-
-  const vueComponents = new Map<string, string>()
-  const astroComponents = new Map<string, string>()
-
-  for (const f of vueFiles) vueComponents.set(getComponentNameFromFilename(f), f)
-  for (const f of astroFiles) astroComponents.set(getComponentNameFromFilename(f), f)
-
-  const allNames = new Set([...vueComponents.keys(), ...astroComponents.keys()])
-  const result: Record<string, ComponentMeta> = {}
-
-  await Promise.all(
-    [...allNames].toSorted().map(async (name) => {
-      const vueFile = vueComponents.get(name)
-      const astroFile = astroComponents.get(name)
-
-      let props: PropMeta[] = []
-      let slots: SlotMeta[] = []
-      let emits: EmitMeta[] = []
-      const frameworks: ("astro" | "vue")[] = []
-
-      if (vueFile) {
-        frameworks.push("vue")
-        try {
-          const vueMeta = extractVueMeta(path.join(vueDir, vueFile))
-          props = vueMeta.props
-          slots = vueMeta.slots
-          emits = vueMeta.emits
-        } catch (err) {
-          console.warn(`[docs] Failed to extract Vue meta for ${vueFile}:`, err)
-        }
-      }
-
-      if (astroFile) {
-        frameworks.push("astro")
-        if (!vueFile) {
-          try {
-            const astroMeta = extractAstroMeta(path.join(astroDir, astroFile))
-            props = astroMeta.props
-            slots = astroMeta.slots
-          } catch (err) {
-            console.warn(`[docs] Failed to extract Astro meta for ${astroFile}:`, err)
-          }
-        }
-      }
-
-      const theme = await extractThemeMeta(name, themesDir)
-
-      result[pascalToKebab(name)] = {
-        name,
-        astroComponent: astroFile ?? null,
-        vueComponent: vueFile ?? null,
-        frameworks,
-        props,
-        slots,
-        emits,
-        theme
-      }
-    })
-  )
-
-  return result
-}

package/src/docs/extractors/extractAstro.ts

@@ -1,69 +0,0 @@
-import { readFileSync } from "node:fs"
-import ts from "typescript"
-import type { PropMeta, SlotMeta } from "../types"
-
-function extractAstroPropsFromInterface(sourceFile: ts.SourceFile): PropMeta[] {
-  const props: PropMeta[] = []
-
-  function visit(node: ts.Node) {
-    if (
-      (ts.isInterfaceDeclaration(node) || ts.isTypeAliasDeclaration(node)) &&
-      node.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword)
-    ) {
-      const name = node.name.text
-      if (name.endsWith("Props") || name === "Props") {
-        if (ts.isInterfaceDeclaration(node)) {
-          for (const member of node.members) {
-            if (ts.isPropertySignature(member) && member.name && ts.isIdentifier(member.name)) {
-              const propName = member.name.text
-              if (propName === "class" || propName.startsWith("data-")) continue
-              const type = member.type ? member.type.getText().replace(/^[^:]+:\s*/, "") : "unknown"
-              const isOptional = member.questionToken !== undefined
-              props.push({ name: propName, type, required: !isOptional, description: "" })
-            }
-          }
-        } else if (ts.isTypeAliasDeclaration(node) && ts.isTypeLiteralNode(node.type)) {
-          for (const member of node.type.members) {
-            if (ts.isPropertySignature(member) && member.name && ts.isIdentifier(member.name)) {
-              const propName = member.name.text
-              if (propName === "class" || propName.startsWith("data-")) continue
-              const type = member.type ? member.type.getText().replace(/^[^:]+:\s*/, "") : "unknown"
-              const isOptional = member.questionToken !== undefined
-              props.push({ name: propName, type, required: !isOptional, description: "" })
-            }
-          }
-        }
-      }
-    }
-    ts.forEachChild(node, visit)
-  }
-
-  visit(sourceFile)
-  return props
-}
-
-export function extractAstroMeta(filePath: string): { props: PropMeta[]; slots: SlotMeta[] } {
-  const content = readFileSync(filePath, "utf-8")
-  const frontmatterMatch = content.match(/^---\n([\s\S]*?)\n---/)
-  if (!frontmatterMatch) return { props: [], slots: [] }
-
-  const frontmatter = frontmatterMatch[1]
-  const sourceFile = ts.createSourceFile(
-    "component.ts",
-    frontmatter ?? "",
-    ts.ScriptTarget.Latest,
-    true,
-    ts.ScriptKind.TS
-  )
-
-  const props = extractAstroPropsFromInterface(sourceFile)
-
-  const slots: SlotMeta[] = []
-  const slotMatches = content.matchAll(/<slot(?:\s+name=["']([^"']+)["'])?/g)
-  for (const match of slotMatches) {
-    slots.push({ name: match[1] ?? "default", bindings: {}, description: "" })
-  }
-  if (!slots.length) slots.push({ name: "default", bindings: {}, description: "" })
-
-  return { props, slots }
-}

package/src/docs/extractors/extractTheme.ts

@@ -1,56 +0,0 @@
-import { existsSync, readdirSync } from "node:fs"
-import path from "node:path"
-import { execSync } from "node:child_process"
-import type { ThemeMeta } from "../types"
-
-export async function extractThemeMeta(
-  componentName: string,
-  themesDir: string
-): Promise<ThemeMeta | null> {
-  if (!existsSync(themesDir)) return null
-
-  const themeFiles = readdirSync(themesDir).filter((f) => f.endsWith(".theme.ts"))
-  let themePath: string | null = null
-  for (const file of themeFiles) {
-    const baseName = file.replace(".theme.ts", "")
-    if (baseName === componentName.toLowerCase()) {
-      themePath = path.join(themesDir, file)
-      break
-    }
-  }
-
-  if (!themePath || !existsSync(themePath)) return null
-
-  try {
-    const fileUrl = "file:///" + themePath.replace(/\\/g, "/")
-    // Run evaluation in a separate Node process with the tsx loader.
-    // This bypasses Vite's ModuleRunner restrictions inside Astro config setups.
-    // We pass the loader script via stdin to avoid any command line escaping issues.
-    const input = `import('${fileUrl}').then(m => console.log(JSON.stringify(m.default))).catch(err => { console.error(err); process.exit(1); })`
-    const output = execSync(`"${process.execPath}" --import tsx -`, {
-      input,
-      encoding: "utf-8",
-      stdio: ["pipe", "pipe", "ignore"]
-    })
-
-    const themeObj = JSON.parse(output.trim())
-    if (!themeObj) return null
-
-    return {
-      slots: Array.isArray(themeObj.slots) ? themeObj.slots : [],
-      base: typeof themeObj.base === "object" && themeObj.base !== null ? themeObj.base : {},
-      variants:
-        typeof themeObj.variants === "object" && themeObj.variants !== null
-          ? themeObj.variants
-          : {},
-      compoundVariants: Array.isArray(themeObj.compoundVariants) ? themeObj.compoundVariants : [],
-      defaultVariants:
-        typeof themeObj.defaultVariants === "object" && themeObj.defaultVariants !== null
-          ? themeObj.defaultVariants
-          : {}
-    }
-  } catch (err) {
-    console.warn(`[docs] Failed to extract theme via child process for ${componentName}:`, err)
-    return null
-  }
-}