@rimelight/ui 0.0.31 → 0.0.32

package/src/components/astro/RLANativeSelect.astro

@@ -1,51 +0,0 @@
----
-import { scv } from "css-variants"
-import { useUi, resolveClasses } from "../../utils"
-import type { NativeSelectProps } from "../../types"
-import nativeSelectThemeDefault, { createNativeSelectTheme } from "../../themes/nativeSelect.theme"
-
-const nativeSelectTheme = nativeSelectThemeDefault
-const nativeSelect = scv(nativeSelectTheme)
-
-const {
-  items = [],
-  value = "",
-  disabled = false,
-  name,
-  label,
-  size = "md",
-  color = "primary",
-  ui: uiProp,
-  class: className,
-  ...rest
-} = Astro.props as NativeSelectProps
-
-const classes = resolveClasses(nativeSelect, {
-  size
-}, useUi("nativeSelect", uiProp), className);
-
-const normalizedItems = items.map(item => {
-  if (typeof item === "string") {
-    return { label: item, value: item }
-  }
-  return item
-})
----
-<div class={classes.root} data-slot="root">
-  {label && <label class={classes.label} data-slot="label">{label}</label>}
-  <div class="relative w-full">
-    <select
-      class={classes.select}
-      disabled={disabled}
-      name={name}
-      {...rest}
-    >
-      {normalizedItems.map(item => (
-        <option value={item.value} selected={item.value === value}>
-          {item.label}
-        </option>
-      ))}
-    </select>
-    <span class={classes.icon + " i-lucide-chevron-down"} />
-  </div>
-</div>

package/src/components/astro/RLAToggle.astro

@@ -1,38 +0,0 @@
----
-import { scv } from "css-variants"
-import { useUi, resolveClasses } from "../../utils"
-import type { ToggleProps } from "../../types"
-import toggleThemeDefault, { createToggleTheme } from "../../themes/toggle.theme"
-import { getUIConfig } from "virtual:rimelight-ui"
-
-const uiConfig = getUIConfig()
-const toggleTheme = uiConfig.colors ? createToggleTheme(uiConfig.colors) : toggleThemeDefault
-
-const toggle = scv(toggleTheme)
-
-const {
-  active = false,
-  disabled = false,
-  color = "primary",
-  size = "md",
-  ui: uiProp,
-  class: className,
-  ...rest
-} = Astro.props as ToggleProps
-
-const classes = resolveClasses(toggle, {
-  color,
-  size,
-  active
-}, useUi("toggle", uiProp), className);
----
-<button
-  type="button"
-  class={classes.root}
-  data-slot="root"
-  data-state={active ? "on" : "off"}
-  disabled={disabled}
-  {...rest}
->
-  <slot />
-</button>

package/src/components/astro/RLAToggleGroup.astro

@@ -1,30 +0,0 @@
----
-import { scv } from "css-variants"
-import { useUi, resolveClasses } from "../../utils"
-import type { ToggleGroupProps } from "../../types"
-import toggleGroupThemeDefault, { createToggleGroupTheme } from "../../themes/toggleGroup.theme"
-
-const toggleGroupTheme = toggleGroupThemeDefault
-const toggleGroup = scv(toggleGroupTheme)
-
-const {
-  value = [],
-  type = "single",
-  size = "md",
-  ui: uiProp,
-  class: className,
-  ...rest
-} = Astro.props as ToggleGroupProps
-
-const classes = resolveClasses(toggleGroup, {
-  size
-}, useUi("toggleGroup", uiProp), className);
----
-<div
-  class={classes.root}
-  data-slot="root"
-  data-type={type}
-  {...rest}
->
-  <slot />
-</div>

package/src/preset.ts

@@ -1,393 +0,0 @@
-import {
-  definePreset,
-  presetTypography,
-  presetWind4,
-  transformerDirectives,
-  transformerVariantGroup
-} from "unocss"
-
-export default definePreset(() => {
-  return {
-    name: "rimelight-ui",
-    presets: [
-      presetWind4(),
-      presetTypography({
-        cssExtend: {
-          "h1,h2,h3,h4,h5,h6": {
-            "font-family": "var(--font-sans), system-ui, sans-serif"
-          },
-          "p,li,blockquote,code": {
-            "font-family": "var(--font-sans), system-ui, sans-serif"
-          },
-          "pre,code": {
-            "font-family": "var(--font-mono), monospace"
-          }
-        }
-      })
-    ],
-    transformers: [transformerDirectives(), transformerVariantGroup()],
-
-    // Enable CSS Cascade Layers for better specificity control
-    outputToCssLayers: true,
-    layers: {
-      theme: 1,
-      preflights: 2,
-      shortcuts: 3,
-      default: 4
-    },
-
-    // Tighten content scanning for better performance
-    content: {
-      pipeline: {
-        include: [
-          /\.(vue|svelte|[jt]sx|mdx?|astro|elm|php|phtml|html)($|\?)/,
-          "src/**/*.{js,ts,jsx,tsx,vue,svelte,astro}",
-          "../ui/src/**/*.{js,ts,jsx,tsx,vue,svelte,astro}"
-        ]
-      },
-      filesystem: ["../ui/src/**/*", "src/components/**/*", "src/pages/**/*"]
-    },
-
-    shortcuts: {
-      // Layout & Components
-      "container": "mx-auto w-full max-w-90rem px-md",
-      "sr-only":
-        "absolute w-px h-px p-0 m-0 overflow-hidden clip-rect-1-1-1-1 whitespace-nowrap border-0"
-    },
-    rules: [
-      [
-        /^clip-rect-(\d+)-(\d+)-(\d+)-(\d+)$/,
-        ([, t, r, b, l]) => ({ clip: `rect(${t}px, ${r}px, ${b}px, ${l}px)` })
-      ],
-      [
-        /^([hw])-(6xs|5xs|4xs|3xs|2xs|xs|sm|md|lg|xl|2xl|3xl|4xl|5xl|6xl)$/,
-        ([, prop, s]) => {
-          if (!s) return false
-          const spacing: Record<string, string> = {
-            "6xs": "0.125rem",
-            "5xs": "0.25rem",
-            "4xs": "0.375rem",
-            "3xs": "0.5rem",
-            "2xs": "0.625rem",
-            "xs": "0.75rem",
-            "sm": "0.875rem",
-            "md": "1rem",
-            "lg": "1.25rem",
-            "xl": "1.5rem",
-            "2xl": "2rem",
-            "3xl": "3rem",
-            "4xl": "4rem",
-            "5xl": "6rem",
-            "6xl": "8rem"
-          }
-          const val = spacing[s]
-          if (!val) return false
-          return prop === "h" ? { height: val } : { width: val }
-        }
-      ]
-    ],
-
-    theme: {
-      colors: {
-        "background": "var(--background)",
-        "foreground": "var(--foreground)",
-        "card": {
-          DEFAULT: "var(--card)",
-          foreground: "var(--card-foreground)"
-        },
-        "popover": {
-          DEFAULT: "var(--popover)",
-          foreground: "var(--popover-foreground)"
-        },
-        "primary": {
-          DEFAULT: "var(--primary)",
-          foreground: "var(--primary-foreground)",
-          accent: "var(--primary-accent)"
-        },
-        "secondary": {
-          DEFAULT: "var(--secondary)",
-          foreground: "var(--secondary-foreground)",
-          accent: "var(--secondary-accent)"
-        },
-        "muted": {
-          DEFAULT: "var(--muted)",
-          foreground: "var(--muted-foreground)"
-        },
-        "accent": {
-          DEFAULT: "var(--accent)",
-          foreground: "var(--accent-foreground)"
-        },
-        "info": {
-          DEFAULT: "var(--info)",
-          foreground: "var(--info-foreground)"
-        },
-        "success": {
-          DEFAULT: "var(--success)",
-          foreground: "var(--success-foreground)"
-        },
-        "warning": {
-          DEFAULT: "var(--warning)",
-          foreground: "var(--warning-foreground)"
-        },
-        "error": {
-          DEFAULT: "var(--error)",
-          foreground: "var(--error-foreground)"
-        },
-        "commentary": {
-          DEFAULT: "var(--commentary)",
-          foreground: "var(--commentary-foreground)"
-        },
-        "ideation": {
-          DEFAULT: "var(--ideation)",
-          foreground: "var(--ideation-foreground)"
-        },
-        "source": {
-          DEFAULT: "var(--source)",
-          foreground: "var(--source-foreground)"
-        },
-        "border": "var(--border)",
-        "input": "var(--input)",
-        "outline": "var(--outline)",
-        "ring": "var(--ring)",
-        "destructive": {
-          DEFAULT: "var(--destructive)",
-          subtle: "var(--color-destructive-subtle)"
-        },
-        "sidebar": {
-          DEFAULT: "var(--sidebar)",
-          foreground: "var(--sidebar-foreground)",
-          primary: {
-            DEFAULT: "var(--sidebar-primary)",
-            foreground: "var(--sidebar-primary-foreground)"
-          },
-          accent: {
-            DEFAULT: "var(--sidebar-accent)",
-            foreground: "var(--sidebar-accent-foreground)"
-          },
-          border: "var(--sidebar-border)",
-          ring: "var(--sidebar-ring)"
-        },
-        "chart": {
-          "1": "var(--chart-1)",
-          "2": "var(--chart-2)",
-          "3": "var(--chart-3)",
-          "4": "var(--chart-4)",
-          "5": "var(--chart-5)"
-        },
-        "hover": "var(--color-hover)",
-        "surface": "var(--color-surface)",
-        "muted-strong": "var(--color-muted-strong)",
-        "foreground-secondary": "var(--color-foreground-secondary)",
-        "foreground-tertiary": "var(--color-foreground-tertiary)",
-        "placeholder": "var(--color-placeholder)",
-        "input-border": "var(--color-input-border)",
-        "accent-subtle": "var(--color-accent-subtle)"
-      },
-      radius: {
-        "xs": "calc(var(--radius) - 0.375rem)",
-        "sm": "calc(var(--radius) - 0.25rem)",
-        "md": "calc(var(--radius) - 0.125rem)",
-        "lg": "var(--radius)",
-        "xl": "calc(var(--radius) + 0.25rem)",
-        "2xl": "calc(var(--radius) + 0.5rem)",
-        "3xl": "calc(var(--radius) + 1rem)"
-      },
-      animation: {
-        keyframes: {
-          "accordion-down":
-            "{ from { height: 0; } to { height: var(--starwind-accordion-content-height); } }",
-          "accordion-up":
-            "{ from { height: var(--starwind-accordion-content-height); } to { height: 0; } }",
-          "marquee": "{ from { transform: translateX(0); } to { transform: translateX(-100%); } }"
-        },
-        durations: {
-          "accordion-down": "0.2s",
-          "accordion-up": "0.2s",
-          "marquee": "30s"
-        },
-        timingFns: {
-          "accordion-down": "ease-out",
-          "accordion-up": "ease-out",
-          "marquee": "linear"
-        },
-        counts: { marquee: "infinite" }
-      }
-    },
-
-    preflights: [
-      {
-        getCSS: () => `
-          :root {
-            --background: #ffffff;
-            --foreground: #030712;
-            --card: #ffffff;
-            --card-foreground: #030712;
-            --popover: #ffffff;
-            --popover-foreground: #030712;
-            --primary: #f97316;
-            --primary-foreground: #f9fafb;
-            --primary-accent: #ea580c;
-            --secondary: #8b5cf6;
-            --secondary-foreground: #f9fafb;
-            --secondary-accent: #7c3aed;
-            --muted: #f3f4f6;
-            --muted-foreground: #4b5563;
-            --accent: #f3f4f6;
-            --accent-foreground: #111827;
-            --info: #3b82f6;
-            --info-foreground: #ffffff;
-            --success: #22c55e;
-            --success-foreground: #ffffff;
-            --warning: #f59e0b;
-            --warning-foreground: #000000;
-            --error: #ef4444;
-            --error-foreground: #f9fafb;
-            --commentary: #ec4899;
-            --commentary-foreground: #f9fafb;
-            --ideation: #8b5cf6;
-            --ideation-foreground: #f9fafb;
-            --source: #38bdf8;
-            --source-foreground: #0f172a;
-            --border: #e5e7eb;
-            --input: #e5e7eb;
-            --outline: #9ca3af;
-            --ring: #9ca3af;
-            --radius: 0.625rem;
-            --sidebar: #f9fafb;
-            --sidebar-foreground: #030712;
-            --sidebar-primary: #1d4ed8;
-            --sidebar-primary-foreground: #f9fafb;
-            --sidebar-accent: #f3f4f6;
-            --sidebar-accent-foreground: #111827;
-            --sidebar-border: #e5e7eb;
-            --sidebar-ring: #9ca3af;
-            --chart-1: #3b82f6;
-            --chart-2: #6366f1;
-            --chart-3: #8b5cf6;
-            --chart-4: #a855f7;
-            --chart-5: #ec4899;
-            --destructive: #ef4444;
-            --color-surface: #ffffff;
-            --color-muted-strong: #e5e7eb;
-            --color-foreground-secondary: #4b5563;
-            --color-foreground-tertiary: #6b7280;
-            --color-placeholder: #9ca3af;
-            --color-input-border: #d1d5db;
-            --color-hover: #f3f4f6;
-            --color-destructive-subtle: #fef2f2;
-            --color-accent-subtle: #eff6ff;
-            --font-sans: "Noto Sans", sans-serif;
-            --font-serif: "Noto Serif", serif;
-            --font-mono: "Noto Sans Mono", monospace;
-          }
-
-          .dark {
-            --background: #030712;
-            --foreground: #f9fafb;
-            --card: #111827;
-            --card-foreground: #f9fafb;
-            --popover: #1f2937;
-            --popover-foreground: #f9fafb;
-            --primary: #f97316;
-            --primary-foreground: #f9fafb;
-            --primary-accent: #fb923c;
-            --secondary: #8b5cf6;
-            --secondary-foreground: #f9fafb;
-            --secondary-accent: #a78bfa;
-            --muted: #1f2937;
-            --muted-foreground: #9ca3af;
-            --accent: #374151;
-            --accent-foreground: #f3f4f6;
-            --info: #3b82f6;
-            --info-foreground: #ffffff;
-            --success: #22c55e;
-            --success-foreground: #ffffff;
-            --warning: #f59e0b;
-            --warning-foreground: #000000;
-            --error: #ef4444;
-            --error-foreground: #f9fafb;
-            --commentary: #f472b6;
-            --commentary-foreground: #0f172a;
-            --ideation: #a78bfa;
-            --ideation-foreground: #0f172a;
-            --source: #7dd3fc;
-            --source-foreground: #0f172a;
-            --border: rgba(249, 250, 251, 0.1);
-            --input: rgba(249, 250, 251, 0.15);
-            --outline: #6b7280;
-            --ring: #6b7280;
-            --sidebar: #111827;
-            --sidebar-foreground: #f9fafb;
-            --sidebar-primary: #1d4ed8;
-            --sidebar-primary-foreground: #f9fafb;
-            --sidebar-accent: #1f2937;
-            --sidebar-accent-foreground: #f3f4f6;
-            --sidebar-border: #1f2937;
-            --sidebar-ring: #6b7280;
-            --chart-1: #60a5fa;
-            --chart-2: #818cf8;
-            --chart-3: #a78bfa;
-            --chart-4: #c084fc;
-            --chart-5: #f472b6;
-            --destructive: #f87171;
-            --color-surface: #1f2937;
-            --color-muted-strong: #374151;
-            --color-foreground-secondary: #d1d5db;
-            --color-foreground-tertiary: #9ca3af;
-            --color-placeholder: #6b7280;
-            --color-input-border: #4b5563;
-            --color-hover: #374151;
-            --color-destructive-subtle: #451a1a;
-            --color-accent-subtle: #1e293b;
-          }
-
-          * {
-            border-color: var(--border);
-            outline-color: rgba(156, 163, 175, 0.5);
-          }
-
-          body {
-            background-color: var(--background);
-            color: var(--foreground);
-            font-family: var(--font-sans);
-          }
-
-          button {
-            cursor: pointer;
-          }
-
-          ::selection {
-            background-color: var(--primary);
-            color: var(--primary-foreground);
-          }
-
-          @view-transition {
-            navigation: auto;
-          }
-        `
-      }
-    ],
-
-    async configResolved(config) {
-      // Only log in dev mode and only once per process
-      if (process.env.NODE_ENV === "development" && !process.env.UNO_CONFIG_LOGGED) {
-        process.env.UNO_CONFIG_LOGGED = "true"
-
-        console.log(
-          `[UnoCSS] Config resolved. Presets: ${config.presets.map((p) => p.name).join(", ")}`
-        )
-        console.log(`[UnoCSS] Total rules: ${config.rules.length}`)
-        console.log(`[UnoCSS] Total shortcuts: ${Object.keys(config.shortcuts).length}`)
-
-        // Collision Detection: Identify potential conflicting regex rules
-        const ruleNames = config.rules.map((r) => (Array.isArray(r) ? r[0].toString() : "dynamic"))
-        const duplicates = ruleNames.filter((item, index) => ruleNames.indexOf(item) !== index)
-        const filteredDuplicates = duplicates.filter((d) => d !== "/^(.+?)-(\\$.+)$/")
-
-        if (filteredDuplicates.length > 0) {
-          console.warn(`[UnoCSS] Potential Rule Collisions: ${filteredDuplicates.join(", ")}`)
-        }
-      }
-    }
-  }
-})

package/src/themes/nativeSelect.theme.ts

@@ -1,24 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createNativeSelectTheme = () =>
-  defineTheme({
-    slots: ["root", "label", "select", "icon"],
-    base: {
-      root: "relative w-full flex flex-col gap-1.5",
-      label: "text-sm font-medium text-foreground",
-      select: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-sm shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 appearance-none pr-10",
-      icon: "pointer-events-none absolute right-3 top-[calc(50%+4px)] size-4 text-muted-foreground transform -translate-y-1/2"
-    },
-    variants: {
-      size: {
-        sm: { select: "h-8 text-xs px-2 pr-8" },
-        md: { select: "h-9 text-sm px-3 pr-10" },
-        lg: { select: "h-10 text-base px-4 pr-12" }
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  })
-
-export default createNativeSelectTheme()

package/src/themes/toggle.theme.ts

@@ -1,42 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-const defaultColors = ["primary", "secondary", "info", "success", "warning", "error"]
-
-export const createToggleTheme = (colors: string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: [
-        "inline-flex items-center justify-center rounded-md text-sm font-medium transition-all duration-150 border border-transparent bg-transparent hover:bg-muted text-foreground cursor-pointer select-none",
-        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
-      ]
-    },
-    variants: {
-      size: {
-        sm: { root: "h-8 px-2 text-xs" },
-        md: { root: "h-9 px-3 text-sm" },
-        lg: { root: "h-10 px-4 text-base" }
-      },
-      color: Object.fromEntries(colors.map((color) => [color, { root: "" }])),
-      active: {
-        true: { root: "bg-muted text-foreground border-border" },
-        false: { root: "" }
-      }
-    },
-    compoundVariants: [
-      ...colors.map((color) => ({
-        active: true as const,
-        color,
-        classNames: {
-          root: `bg-${color}-500/10 text-${color}-600 border-${color}-500/20 hover:bg-${color}-500/20`
-        }
-      }))
-    ],
-    defaultVariants: {
-      size: "md",
-      color: "primary",
-      active: false
-    }
-  })
-
-export default createToggleTheme()

package/src/themes/toggleGroup.theme.ts

@@ -1,21 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createToggleGroupTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: "inline-flex items-center justify-center gap-1 rounded-md border border-border bg-muted p-1"
-    },
-    variants: {
-      size: {
-        sm: { root: "h-8 gap-0.5" },
-        md: { root: "h-9 gap-1" },
-        lg: { root: "h-10 gap-1.5" }
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  })
-
-export default createToggleGroupTheme()

package/src/types/components/native-select.ts

@@ -1,39 +0,0 @@
-export interface NativeSelectProps {
-  /**
-   * List of options.
-   */
-  items?: Array<{ label: string; value: string; [key: string]: any } | string>
-  /**
-   * Selected value.
-   */
-  value?: string
-  /**
-   * Disabled state.
-   */
-  disabled?: boolean
-  /**
-   * Form control name.
-   */
-  name?: string
-  /**
-   * Form label.
-   */
-  label?: string
-  /**
-   * Size scale.
-   */
-  size?: "sm" | "md" | "lg"
-  /**
-   * Color theme.
-   */
-  color?: "primary" | "secondary" | "success" | "warning" | "error" | "info"
-  /**
-   * UI class override map.
-   */
-  ui?: any
-  /**
-   * Root CSS class override.
-   */
-  class?: any
-  [key: string]: unknown
-}

package/src/types/components/navigation.ts

@@ -1,34 +0,0 @@
-import type { LinkProps } from "./link"
-
-export interface NavigationMenuItem extends Omit<LinkProps, "class"> {
-  label?: string
-  icon?: string
-  badge?: string | number | any
-  avatar?: any
-  chip?: boolean | any
-  tooltip?: boolean | any
-  popover?: boolean | any
-  trailingIcon?: string
-  type?: "label" | "trigger" | "link"
-  slot?: string
-  value?: string
-  children?: NavigationMenuChildItem[]
-  defaultOpen?: boolean
-  open?: boolean
-  onSelect?: (e: Event) => void
-  click?: (event: MouseEvent) => void
-  /**
-   * Slot-specific CSS class overrides.
-   */
-  ui?: any
-  /**
-   * Additional CSS classes to apply to the root component.
-   */
-  class?: any
-  [key: string]: unknown
-}
-
-export interface NavigationMenuChildItem extends Omit<NavigationMenuItem, "type" | "ui"> {
-  description?: string
-  [key: string]: any
-}