@rimelight/ui 0.0.4 → 0.0.6

package/src/i18n.generated.d.ts

@@ -1,202 +0,0 @@
-// Auto-generated by scripts/bundle-translations.ts
-// Do not edit manually.
-
-declare global {
-  namespace I18n {
-    export interface Schema {
-      "blog": {
-            "meta_title": string;
-            "hero_title": string;
-            "hero_description": string;
-            "latest_article": string;
-            "latest": string;
-            "read_article": string;
-            "all_posts": string;
-          };
-      "chat": {
-            "title": string;
-            "description": string;
-            "heading": string;
-            "intro": string;
-            "label": string;
-            "placeholder": string;
-            "button": string;
-            "room": {
-              "title": string;
-              "connecting": string;
-              "connected": string;
-              "disconnected": string;
-              "placeholder": string;
-              "send": string;
-              "system": {
-                "joining": string;
-                "error": string;
-                "joined": string;
-                "left": string;
-                "reconnecting": string;
-                "fail_reconnect": string;
-                "no_connect": string;
-                "prompt_user": string;
-                "you": string;
-                "online_users": string;
-              };
-            };
-          };
-      "common": {
-            "seo": {
-              "title": string;
-              "description": string;
-            };
-            "nav": {
-              "home": string;
-              "blog": string;
-              "mobileButton": string;
-            };
-            "footer": {
-              "license": string;
-            };
-            "notFound": {
-              "title": string;
-              "message": string;
-              "backToHome": string;
-            };
-          };
-      "cookie_notice": {
-            "title": string;
-            "description": string;
-            "privacy_policy": string;
-            "reject_all": string;
-            "accept_all": string;
-            "accepted_toast": string;
-            "accepted_description": string;
-            "rejected_toast": string;
-            "rejected_description": string;
-          };
-      "editor": {
-            "title": string;
-            "description": string;
-            "collaborative_editor": string;
-            "status": {
-              "connecting": string;
-              "connected": string;
-              "disconnected": string;
-            };
-            "history": string;
-            "version_history": string;
-            "no_versions": string;
-            "placeholder": string;
-            "word_count": {
-              "word": string;
-              "words": string;
-              "character": string;
-              "characters": string;
-            };
-            "save": {
-              "saved": string;
-            };
-            "restore_confirm": string;
-          };
-      "errors": {
-            "404_title": string;
-            "404_description": string;
-            "500_title": string;
-            "500_description": string;
-          };
-      "home": {
-            "meta_title": string;
-            "meta_description": string;
-            "hero_title": string;
-            "hero_description": string;
-            "hero_view_components": string;
-            "hero_contact_me": string;
-            "stack_title": string;
-            "stack_description": string;
-            "stack_view_services": string;
-            "stack_resume": string;
-            "marquee_title": string;
-            "projects_title": string;
-            "projects_description": string;
-            "projects_view_all": string;
-            "cta_title": string;
-            "cta_description": string;
-            "cta_contact": string;
-            "cta_resume": string;
-          };
-      "messages": {
-            "errors": {
-              "ui": {
-                "MISSING_TRANSLATED_UI": string;
-                "MISSING_TRANSLATED_CONTENT": string;
-              };
-            };
-          };
-      "nav": {
-            "home": string;
-            "projects": string;
-            "blog": string;
-            "about": string;
-            "services": string;
-            "resume": string;
-            "contact": string;
-            "components": string;
-            "privacy_policy": string;
-            "terms_of_service": string;
-            "cookie_policy": string;
-          };
-      "projects": {
-            "meta_title": string;
-            "hero_title": string;
-            "hero_description": string;
-            "latest": string;
-            "latest_badge": string;
-            "view_project": string;
-            "all": string;
-          };
-      "services": {
-            "meta_title": string;
-            "hero_title": string;
-            "hero_description": string;
-            "capabilities_title": string;
-            "capabilities_description": string;
-            "web_dev_title": string;
-            "web_dev_description": string;
-            "ui_ux_title": string;
-            "ui_ux_description": string;
-            "perf_title": string;
-            "perf_description": string;
-            "perf_security_title": string;
-            "perf_security_description": string;
-            "testimonials_title": string;
-            "testimonials_description": string;
-            "faq_title": string;
-            "faq_description": string;
-            "cta_title": string;
-            "cta_description": string;
-            "cta_contact": string;
-            "cta_portfolio": string;
-            "badge_ceo": string;
-            "badge_founder": string;
-            "badge_cto": string;
-            "badge_senior_ui": string;
-            "badge_chef": string;
-            "badge_product_designer": string;
-            "testimonial_1": string;
-            "testimonial_2": string;
-            "testimonial_3": string;
-            "testimonial_4": string;
-            "testimonial_5": string;
-            "testimonial_6": string;
-            "faq_category_general": string;
-            "faq_q1": string;
-            "faq_a1": string;
-            "faq_q2": string;
-            "faq_a2": string;
-            "faq_category_technical": string;
-            "faq_q3": string;
-            "faq_a3": string;
-          };
-    }
-  }
-}
-
-export {}

package/src/lib/component-preview.ts

@@ -1,73 +0,0 @@
-/**
- * Component Preview Renderer
- *
- * A simple registry-based system for rendering component previews with dynamic props. Import this
- * module in your page to register component renderers.
- */
-
-export type RendererFunction = (props: Record<string, any>, container: HTMLElement) => void
-
-const renderers = new Map<string, RendererFunction>()
-
-/**
- * Register a component renderer
- *
- * @param componentName - The component name (e.g., 'hero', 'button')
- * @param renderFn - Function that renders the component with given props
- */
-export function registerRenderer(componentName: string, renderFn: RendererFunction) {
-  renderers.set(componentName, renderFn)
-}
-
-/**
- * Get a registered renderer
- */
-export function getRenderer(componentName: string): RendererFunction | undefined {
-  return renderers.get(componentName)
-}
-
-/**
- * Update a preview container with new props
- */
-export function renderPreview(
-  container: HTMLElement,
-  componentName: string,
-  props: Record<string, any>
-) {
-  const renderer = renderers.get(componentName)
-  if (renderer) {
-    renderer(props, container)
-  }
-}
-
-/**
- * Helper to create a simple attribute-based renderer For components that can update via data
- * attributes and CSS
- */
-export function createAttributeRenderer(
-  attributeMap: Record<string, string>,
-  classUpdater?: (props: Record<string, any>, element: HTMLElement) => void
-): RendererFunction {
-  return (props, container) => {
-    // Update data attributes
-    Object.entries(props).forEach(([key, value]) => {
-      const attrName = attributeMap[key] || key
-      if (value === undefined || value === null) {
-        container.removeAttribute(`data-${attrName}`)
-      } else if (typeof value === "boolean") {
-        if (value) {
-          container.setAttribute(`data-${attrName}`, "true")
-        } else {
-          container.removeAttribute(`data-${attrName}`)
-        }
-      } else {
-        container.setAttribute(`data-${attrName}`, String(value))
-      }
-    })
-
-    // Call custom class updater if provided
-    if (classUpdater) {
-      classUpdater(props, container)
-    }
-  }
-}

package/src/lib/index.ts

@@ -1,6 +0,0 @@
-export * from "./turnstile"
-export * from "./component-preview"
-export * from "./showcase-preview-elements"
-export * from "./showcase-renderer"
-export * from "./showcase-utils"
-export * from "./remark/remark-modified-time.ts"

package/src/lib/remark/remark-modified-time.ts

@@ -1,13 +0,0 @@
-import { execSync } from "child_process"
-
-export function remarkModifiedTime() {
-  return function (_tree: any, file: any) {
-    try {
-      const filepath = file.history[0]
-      const result = execSync(`git log -1 --pretty="format:%cI" "${filepath}"`)
-      file.data.astro.frontmatter.lastModified = result.toString()
-    } catch {
-      file.data.astro.frontmatter.lastModified = new Date().toISOString()
-    }
-  }
-}

package/src/lib/showcase-preview-elements.ts

@@ -1,408 +0,0 @@
-/**
- * Showcase Preview Custom Elements
- *
- * This module defines all the custom elements used in the component showcase. It must be imported
- * client-side before the showcase renderers run.
- */
-
-// Register all custom elements
-export function registerShowcasePreviewElements() {
-  if (typeof HTMLElement === "undefined" || typeof customElements === "undefined") return
-
-  // Hero Preview Custom Element
-  class HeroPreviewElement extends HTMLElement {
-    innerEl: HTMLElement | null = null
-    contentWrapper: HTMLElement | null = null
-    titleEl: HTMLElement | null = null
-    descEl: HTMLElement | null = null
-
-    static get observedAttributes() {
-      return ["data-orientation", "data-alignment", "data-inverted"]
-    }
-
-    connectedCallback() {
-      this.innerEl = this.querySelector<HTMLElement>(".hero-preview-inner")
-      this.contentWrapper = this.querySelector<HTMLElement>(".hero-content-wrapper")
-      this.titleEl = this.querySelector<HTMLElement>("[data-hero-title]")
-      this.descEl = this.querySelector<HTMLElement>("[data-hero-description]")
-      if (!this.innerEl || !this.contentWrapper) return
-      this.updateClasses()
-    }
-
-    attributeChangedCallback(_name: string, _oldValue: string, newValue: string) {
-      if (_oldValue !== newValue) {
-        this.updateClasses()
-      }
-    }
-
-    updateClasses() {
-      if (!this.innerEl || !this.contentWrapper) return
-
-      const orientation = this.dataset.orientation || "vertical"
-      const alignment = this.dataset.alignment || "center"
-      const inverted = this.dataset.inverted === "true"
-
-      const effectiveAlignment = orientation === "horizontal" ? "left" : alignment
-
-      // Reset inner container classes
-      this.innerEl.className = "hero-preview-inner w-full"
-
-      // Apply orientation classes
-      if (orientation === "horizontal") {
-        this.innerEl.classList.add(
-          "flex",
-          "flex-col",
-          "gap-8",
-          "items-center",
-          "lg:grid",
-          "lg:grid-cols-2",
-          "lg:items-center",
-          "lg:gap-16"
-        )
-      } else {
-        this.innerEl.classList.add("flex", "flex-col", "gap-8", "items-center")
-        if (!inverted) {
-          this.innerEl.classList.add("flex-col-reverse")
-        }
-      }
-
-      // Apply alignment classes
-      this.innerEl.classList.remove(
-        "text-start",
-        "text-center",
-        "text-end",
-        "items-start",
-        "items-end"
-      )
-      if (effectiveAlignment === "left") {
-        this.innerEl.classList.add("text-start", "items-start")
-      } else if (effectiveAlignment === "right") {
-        this.innerEl.classList.add("text-end", "items-end")
-      } else {
-        this.innerEl.classList.add("text-center", "items-center")
-      }
-
-      // Update content wrapper
-      this.contentWrapper.classList.remove(
-        "text-center",
-        "items-center",
-        "text-start",
-        "items-start",
-        "text-end",
-        "items-end"
-      )
-      if (effectiveAlignment === "left") {
-        this.contentWrapper.classList.add("text-start", "items-start")
-      } else if (effectiveAlignment === "right") {
-        this.contentWrapper.classList.add("text-end", "items-end")
-      } else {
-        this.contentWrapper.classList.add("text-center", "items-center")
-      }
-    }
-  }
-
-  // Section Preview Custom Element
-  class SectionPreviewElement extends HTMLElement {
-    innerEl: HTMLElement | null = null
-    contentEl: HTMLElement | null = null
-    titleEl: HTMLElement | null = null
-    descEl: HTMLElement | null = null
-
-    static get observedAttributes() {
-      return ["data-orientation", "data-alignment", "data-inverted"]
-    }
-
-    connectedCallback() {
-      this.innerEl = this.querySelector<HTMLElement>(".section-preview-inner")
-      this.contentEl = this.querySelector<HTMLElement>(".section-content")
-      this.titleEl = this.querySelector<HTMLElement>("[data-section-title]")
-      this.descEl = this.querySelector<HTMLElement>("[data-section-description]")
-      if (!this.innerEl || !this.contentEl) return
-      this.updateClasses()
-    }
-
-    attributeChangedCallback(_name: string, _oldValue: string, newValue: string) {
-      if (_oldValue !== newValue) {
-        this.updateClasses()
-      }
-    }
-
-    updateClasses() {
-      if (!this.innerEl || !this.contentEl) return
-
-      const orientation = this.dataset.orientation || "vertical"
-      const alignment = this.dataset.alignment || "center"
-      const inverted = this.dataset.inverted === "true"
-
-      const effectiveAlignment = orientation === "horizontal" ? "left" : alignment
-
-      // Reset inner container classes
-      this.innerEl.className = "section-preview-inner w-full"
-      this.innerEl.classList.add("container", "py-24")
-
-      // Apply orientation classes
-      if (orientation === "horizontal") {
-        this.innerEl.classList.add("lg:grid", "lg:grid-cols-2", "lg:items-center", "lg:gap-16")
-      } else {
-        this.innerEl.classList.add("flex", "flex-col", "gap-12")
-        if (inverted) {
-          this.innerEl.classList.add("flex-col-reverse")
-        }
-      }
-
-      // Apply alignment classes
-      this.innerEl.classList.remove(
-        "text-start",
-        "text-center",
-        "text-end",
-        "items-start",
-        "items-end"
-      )
-      if (effectiveAlignment === "left") {
-        this.innerEl.classList.add("text-start", "items-start")
-      } else if (effectiveAlignment === "right") {
-        this.innerEl.classList.add("text-end", "items-end")
-      } else {
-        this.innerEl.classList.add("text-center", "items-center")
-      }
-
-      // Update content element
-      this.contentEl.classList.remove(
-        "text-center",
-        "items-center",
-        "text-start",
-        "items-start",
-        "text-end",
-        "items-end"
-      )
-      if (effectiveAlignment === "left") {
-        this.contentEl.classList.add("text-start", "items-start")
-      } else if (effectiveAlignment === "right") {
-        this.contentEl.classList.add("text-end", "items-end")
-      } else {
-        this.contentEl.classList.add("text-center", "items-center")
-      }
-    }
-  }
-
-  // Button Preview Custom Element
-  class ButtonPreviewElement extends HTMLElement {
-    button: HTMLElement | null = null
-
-    static get observedAttributes() {
-      return ["data-variant", "data-size", "data-children"]
-    }
-
-    connectedCallback() {
-      this.button = this.querySelector<HTMLElement>("[data-preview-button]")
-      if (!this.button) return
-      this.updateButton()
-    }
-
-    attributeChangedCallback(_name: string, oldValue: string, newValue: string) {
-      if (oldValue !== newValue && this.button) {
-        this.updateButton()
-      }
-    }
-
-    updateButton() {
-      if (!this.button) return
-
-      const variant = this.dataset.variant || "default"
-      const size = this.dataset.size || "md"
-      const children = this.dataset.children || "Button"
-
-      // Remove all variant classes
-      this.button.classList.remove(
-        "bg-input",
-        "hover:bg-input/90",
-        "text-foreground",
-        "bg-primary",
-        "text-primary-foreground",
-        "hover:bg-primary/90",
-        "bg-secondary",
-        "text-secondary-foreground",
-        "hover:bg-secondary/90",
-        "border",
-        "border-input",
-        "bg-background",
-        "hover:bg-accent",
-        "hover:text-accent-foreground",
-        "bg-info",
-        "text-info-foreground",
-        "hover:bg-info/90",
-        "bg-success",
-        "text-success-foreground",
-        "hover:bg-success/90",
-        "bg-warning",
-        "text-warning-foreground",
-        "hover:bg-warning/90",
-        "bg-error",
-        "text-error-foreground",
-        "hover:bg-error/90"
-      )
-
-      // Add new variant classes
-      const variantClasses: Record<string, string[]> = {
-        default: ["bg-input", "hover:bg-input/90", "text-foreground"],
-        primary: ["bg-primary", "text-primary-foreground", "hover:bg-primary/90"],
-        secondary: ["bg-secondary", "text-secondary-foreground", "hover:bg-secondary/90"],
-        outline: [
-          "border",
-          "border-input",
-          "bg-background",
-          "hover:bg-accent",
-          "hover:text-accent-foreground"
-        ],
-        ghost: ["hover:bg-accent", "hover:text-accent-foreground"],
-        info: ["bg-info", "text-info-foreground", "hover:bg-info/90"],
-        success: ["bg-success", "text-success-foreground", "hover:bg-success/90"],
-        warning: ["bg-warning", "text-warning-foreground", "hover:bg-warning/90"],
-        error: ["bg-error", "text-error-foreground", "hover:bg-error/90"]
-      }
-
-      variantClasses[variant]?.forEach((cls: string) => this.button?.classList.add(cls))
-
-      // Remove all size classes
-      this.button.classList.remove(
-        "h-9",
-        "px-3",
-        "text-sm",
-        "h-11",
-        "px-4",
-        "text-base",
-        "h-12",
-        "px-6",
-        "text-lg"
-      )
-
-      // Add new size classes
-      const sizeClasses: Record<string, string[]> = {
-        sm: ["h-9", "px-3", "text-sm"],
-        md: ["h-11", "px-4", "text-base"],
-        lg: ["h-12", "px-6", "text-lg"]
-      }
-
-      sizeClasses[size]?.forEach((cls: string) => this.button?.classList.add(cls))
-
-      // Update text
-      this.button.textContent = children
-    }
-  }
-
-  // Testimonials Preview Custom Element
-  class TestimonialsPreviewElement extends HTMLElement {
-    card: HTMLElement | null = null
-    quoteEl: HTMLElement | null = null
-    personEl: HTMLElement | null = null
-    metaEl: HTMLElement | null = null
-
-    static get observedAttributes() {
-      return ["data-alignment"]
-    }
-
-    connectedCallback() {
-      this.card = this.querySelector<HTMLElement>(".testimonial-card")
-      this.quoteEl = this.querySelector<HTMLElement>("[data-testimonials-quote]")
-      this.personEl = this.querySelector<HTMLElement>(".testimonial-person")
-      this.metaEl = this.querySelector<HTMLElement>(".testimonial-meta")
-      if (!this.card || !this.quoteEl || !this.personEl || !this.metaEl) return
-      this.updateClasses()
-    }
-
-    attributeChangedCallback(_name: string, oldValue: string, newValue: string) {
-      if (oldValue !== newValue) {
-        this.updateClasses()
-      }
-    }
-
-    updateClasses() {
-      if (!this.card || !this.quoteEl || !this.personEl || !this.metaEl) return
-
-      const alignment = this.dataset.alignment || "center"
-
-      // Reset all alignment classes
-      this.quoteEl.classList.remove("text-left", "text-center", "text-right")
-      this.personEl.classList.remove(
-        "flex-row",
-        "flex-row-reverse",
-        "items-center",
-        "justify-start",
-        "justify-end",
-        "flex-col",
-        "text-center"
-      )
-      this.metaEl.classList.remove(
-        "text-left",
-        "text-right",
-        "items-start",
-        "items-end",
-        "items-center"
-      )
-
-      if (alignment === "left") {
-        this.quoteEl.classList.add("text-left")
-        this.personEl.classList.add("flex-row", "items-center", "justify-start")
-        this.metaEl.classList.add("text-left", "items-start")
-      } else if (alignment === "right") {
-        this.quoteEl.classList.add("text-right")
-        this.personEl.classList.add("flex-row-reverse", "items-center", "justify-end")
-        this.metaEl.classList.add("text-right", "items-end")
-      } else {
-        // center
-        this.quoteEl.classList.add("text-center")
-        this.personEl.classList.add("flex-col", "items-center", "justify-center", "text-center")
-        this.metaEl.classList.add("items-center")
-      }
-    }
-  }
-
-  // Language Switcher Preview Custom Element
-  class LanguageSwitcherPreviewElement extends HTMLElement {
-    static get observedAttributes() {
-      return ["data-variant"]
-    }
-
-    connectedCallback() {
-      this.updateVariant()
-    }
-
-    attributeChangedCallback(_name: string, oldValue: string, newValue: string) {
-      if (oldValue !== newValue) {
-        this.updateVariant()
-      }
-    }
-
-    updateVariant() {
-      // Dispatch event for the actual component to handle
-      this.dispatchEvent(
-        new CustomEvent("language-switcher:variant-change", {
-          detail: { variant: this.dataset.variant },
-          bubbles: true
-        })
-      )
-    }
-  }
-
-  // Register all custom elements
-  if (!customElements.get("hero-preview")) {
-    customElements.define("hero-preview", HeroPreviewElement)
-  }
-  if (!customElements.get("section-preview")) {
-    customElements.define("section-preview", SectionPreviewElement)
-  }
-  if (!customElements.get("button-preview")) {
-    customElements.define("button-preview", ButtonPreviewElement)
-  }
-  if (!customElements.get("testimonials-preview")) {
-    customElements.define("testimonials-preview", TestimonialsPreviewElement)
-  }
-  if (!customElements.get("language-switcher-preview")) {
-    customElements.define("language-switcher-preview", LanguageSwitcherPreviewElement)
-  }
-}
-
-// Auto-register when module is imported
-if (typeof window !== "undefined") {
-  registerShowcasePreviewElements()
-}