@rimelight/ui 0.0.37 → 0.0.39

package/src/themes/callout.theme.ts

@@ -1,104 +0,0 @@
-import { defaultColors } from "../presets/defaults"
-import { defineTheme } from "../utils/defineTheme"
-
-export const createCalloutTheme = (colors: readonly string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root", "body", "icon", "title", "content", "avatar", "avatarSize", "actions", "close"],
-    base: {
-      root: "relative overflow-hidden w-full rounded-lg p-4 flex gap-2.5 items-start",
-      body: "flex flex-col gap-2.5 flex-1 min-w-0",
-      icon: "shrink-0 size-6 inline-flex items-center justify-center",
-      title: "text-sm font-bold",
-      content: "text-sm opacity-90 leading-relaxed [&>:first-child]:mt-0 [&>:last-child]:mb-0",
-      avatar: "shrink-0",
-      avatarSize: "2xl",
-      actions: "flex flex-wrap gap-1.5",
-      close: "p-0 ml-auto"
-    },
-    variants: {
-      variant: {
-        solid: { root: "" },
-        outline: { root: "" },
-        soft: { root: "" },
-        subtle: { root: "" }
-      },
-      color: {
-        ...Object.fromEntries(colors.map((color) => [color, { root: "" }])),
-        neutral: { root: "" }
-      } as Record<string, { root: string }>,
-      theme: {
-        light: { root: "rl-light" },
-        dark: { root: "rl-dark" }
-      }
-    },
-    compoundVariants: [
-      ...colors.map((color) => ({
-        variant: "solid" as const,
-        color,
-        classNames: {
-          root: "rl-color-" + color + " bg-[var(--rl-bg)] text-white"
-        }
-      })),
-      ...colors.map((color) => ({
-        variant: "outline" as const,
-        color,
-        classNames: {
-          root:
-            "rl-color-" +
-            color +
-            " text-[var(--rl-text)] ring ring-inset ring-[var(--rl-border)]/25"
-        }
-      })),
-      ...colors.map((color) => ({
-        variant: "soft" as const,
-        color,
-        classNames: {
-          root: "rl-color-" + color + " bg-[var(--rl-bg)]/10 text-[var(--rl-text)]"
-        }
-      })),
-      ...colors.map((color) => ({
-        variant: "subtle" as const,
-        color,
-        classNames: {
-          root:
-            "rl-color-" +
-            color +
-            " bg-[var(--rl-bg)]/10 text-[var(--rl-text)] ring ring-inset ring-[var(--rl-border)]/25"
-        }
-      })),
-      {
-        color: "neutral",
-        variant: "solid",
-        classNames: {
-          root: "text-inverted bg-inverted"
-        }
-      },
-      {
-        color: "neutral",
-        variant: "outline",
-        classNames: {
-          root: "text-highlighted bg-default ring ring-inset ring-default"
-        }
-      },
-      {
-        color: "neutral",
-        variant: "soft",
-        classNames: {
-          root: "text-highlighted bg-elevated/50"
-        }
-      },
-      {
-        color: "neutral",
-        variant: "subtle",
-        classNames: {
-          root: "text-highlighted bg-elevated/50 ring ring-inset ring-accented"
-        }
-      }
-    ],
-    defaultVariants: {
-      color: "primary",
-      variant: "solid"
-    }
-  })
-
-export default createCalloutTheme()

package/src/themes/card.theme.ts

@@ -1,50 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createCardTheme = () =>
-  defineTheme({
-    slots: ["root", "header", "title", "description", "body", "footer", "overlay", "media"],
-    base: {
-      root: "rounded-lg overflow-hidden",
-      header: "p-4 sm:px-6 border-default",
-      title: "text-highlighted font-semibold",
-      description: "mt-1 text-muted-foreground text-sm",
-      body: "p-4 sm:p-6 border-default",
-      footer: "p-4 sm:px-6 border-default",
-      overlay:
-        "absolute inset-0 z-10 flex flex-col justify-end p-4 bg-gradient-to-t from-black/80 to-transparent text-white",
-      media: "relative border-default"
-    },
-    variants: {
-      variant: {
-        solid: {
-          root: "bg-inverted text-inverted",
-          title: "text-inverted",
-          description: "text-dimmed"
-        },
-        outline: {
-          root: "bg-default border border-default divide-y divide-default"
-        },
-        soft: {
-          root: "bg-elevated/50 divide-y divide-default"
-        },
-        subtle: {
-          root: "bg-elevated/50 border border-default divide-y divide-default"
-        }
-      },
-      interactive: {
-        true: { root: "hover:shadow-md cursor-pointer" },
-        false: { root: "" }
-      },
-      overlay: {
-        true: { root: "relative" },
-        false: {}
-      }
-    },
-    defaultVariants: {
-      variant: "outline",
-      interactive: false,
-      overlay: false
-    }
-  })
-
-export default createCardTheme()

package/src/themes/carousel.theme.ts

@@ -1,34 +0,0 @@
-import { defaultColors } from "../presets/defaults"
-import { defineTheme } from "../utils/defineTheme"
-
-export const createCarouselTheme = (_colors: readonly string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root", "viewport", "container", "slide", "buttonPrev", "buttonNext", "dots", "dot"],
-    base: {
-      root: "relative w-full overflow-hidden select-none group/carousel",
-      viewport: "w-full overflow-hidden cursor-grab active:cursor-grabbing",
-      container: "flex backface-hidden",
-      slide: "min-w-0 shrink-0 grow-0 basis-full pl-4 relative",
-      buttonPrev: [
-        "absolute left-4 top-1/2 -translate-y-1/2 z-10 flex size-9 items-center justify-center rounded-full border border-border bg-background/80 backdrop-blur-sm text-foreground shadow transition-all hover:bg-background cursor-pointer",
-        "opacity-0 scale-90 group-hover/carousel:opacity-100 group-hover/carousel:scale-100"
-      ],
-      buttonNext: [
-        "absolute right-4 top-1/2 -translate-y-1/2 z-10 flex size-9 items-center justify-center rounded-full border border-border bg-background/80 backdrop-blur-sm text-foreground shadow transition-all hover:bg-background cursor-pointer",
-        "opacity-0 scale-90 group-hover/carousel:opacity-100 group-hover/carousel:scale-100"
-      ],
-      dots: "absolute bottom-4 left-1/2 -translate-x-1/2 z-10 flex gap-1.5 items-center",
-      dot: "block size-2 rounded-full bg-foreground/20 cursor-pointer transition-all duration-350 hover:bg-foreground/45"
-    },
-    variants: {
-      active: {
-        true: { dot: "bg-foreground size-2.5" },
-        false: { dot: "" }
-      }
-    },
-    defaultVariants: {
-      active: false
-    }
-  })
-
-export default createCarouselTheme()

package/src/themes/chart.theme.ts

@@ -1,22 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChartTheme = () =>
-  defineTheme({
-    slots: ["root", "title", "container", "svg", "axis", "bar", "line", "tooltip", "legend"],
-    base: {
-      root: "flex flex-col gap-3 p-4 rounded-xl border border-border bg-card text-card-foreground shadow-sm",
-      title: "text-sm font-semibold tracking-tight text-foreground",
-      container: "relative w-full aspect-video flex items-end justify-between",
-      svg: "w-full h-full",
-      axis: "text-[10px] text-muted-foreground",
-      bar: "rounded-t transition-all hover:opacity-85",
-      line: "stroke-2 fill-none",
-      tooltip:
-        "absolute z-50 bg-background text-foreground border border-border rounded shadow p-2 text-xs",
-      legend: "flex items-center justify-center gap-4 text-xs text-muted-foreground"
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChartTheme()

package/src/themes/chat-message.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatMessageTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatMessageTheme()

package/src/themes/chat-messages.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatMessagesTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatMessagesTheme()

package/src/themes/chat-palette.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatPaletteTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatPaletteTheme()

package/src/themes/chat-prompt-submit.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatPromptSubmitTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatPromptSubmitTheme()

package/src/themes/chat-prompt.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatPromptTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatPromptTheme()

package/src/themes/chat-reasoning.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatReasoningTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatReasoningTheme()

package/src/themes/chat-shimmer.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatShimmerTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatShimmerTheme()

package/src/themes/chat-tool.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatToolTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatToolTheme()

package/src/themes/chat.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChatTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createChatTheme()

package/src/themes/checkbox.theme.ts

@@ -1,49 +0,0 @@
-import { defaultColors } from "../presets/defaults"
-import { defineTheme } from "../utils/defineTheme"
-
-export const createCheckboxTheme = (colors: readonly string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root", "input", "box", "indicator", "label"],
-    base: {
-      root: "inline-flex items-center gap-2 cursor-pointer select-none",
-      input: "absolute opacity-0 size-0 pointer-events-none peer",
-      box: [
-        "size-4 shrink-0 rounded border border-border bg-background transition-all focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
-        "peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
-      ],
-      indicator:
-        "flex items-center justify-center text-white scale-0 transition-transform duration-150",
-      label: "text-sm text-foreground leading-none"
-    },
-    variants: {
-      color: Object.fromEntries(
-        colors.map((color) => [
-          color,
-          {
-            root: "rl-color-" + color,
-            box: `peer-checked:bg-[var(--rl-bg)] peer-checked:border-[var(--rl-border)] focus-within:ring-[var(--rl-ring)]/50`
-          }
-        ])
-      ),
-      size: {
-        sm: { box: "size-3.5", label: "text-xs" },
-        md: { box: "size-4", label: "text-sm" },
-        lg: { box: "size-4.5", label: "text-base" }
-      },
-      checked: {
-        true: { indicator: "scale-100" },
-        false: { indicator: "scale-0" }
-      },
-      theme: {
-        light: { root: "rl-light" },
-        dark: { root: "rl-dark" }
-      }
-    },
-    defaultVariants: {
-      color: "primary",
-      size: "md",
-      checked: false
-    }
-  })
-
-export default createCheckboxTheme()

package/src/themes/chip.theme.ts

@@ -1,73 +0,0 @@
-import { defaultColors } from "../presets/defaults"
-import { defineTheme } from "../utils/defineTheme"
-
-export const createChipTheme = (colors: readonly string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root", "base"],
-    base: {
-      root: "relative inline-flex items-center justify-center shrink-0",
-      base: "rounded-full ring ring-bg flex items-center justify-center text-inverted font-medium whitespace-nowrap"
-    },
-    variants: {
-      color: {
-        ...Object.fromEntries(colors.map((color) => [color, { base: `bg-${color}` }])),
-        neutral: { base: "bg-inverted" }
-      } as Record<string, { base: string }>,
-      size: {
-        "3xs": { base: "h-[4px] min-w-[4px] text-[4px]" },
-        "2xs": { base: "h-[5px] min-w-[5px] text-[5px]" },
-        "xs": { base: "h-[6px] min-w-[6px] text-[6px]" },
-        "sm": { base: "h-[7px] min-w-[7px] text-[7px]" },
-        "md": { base: "h-[8px] min-w-[8px] text-[8px]" },
-        "lg": { base: "h-[9px] min-w-[9px] text-[9px]" },
-        "xl": { base: "h-[10px] min-w-[10px] text-[10px]" },
-        "2xl": { base: "h-[11px] min-w-[11px] text-[11px]" },
-        "3xl": { base: "h-[12px] min-w-[12px] text-[12px]" }
-      },
-      position: {
-        "top-right": { base: "top-0 right-0" },
-        "bottom-right": { base: "bottom-0 right-0" },
-        "top-left": { base: "top-0 left-0" },
-        "bottom-left": { base: "bottom-0 left-0" }
-      },
-      inset: {
-        false: { base: "" }
-      },
-      standalone: {
-        false: { base: "absolute" }
-      },
-      theme: {
-        light: { root: "rl-light" },
-        dark: { root: "rl-dark" }
-      }
-    },
-    compoundVariants: [
-      {
-        position: "top-right",
-        inset: false,
-        classNames: { base: "-translate-y-1/2 translate-x-1/2 transform" }
-      },
-      {
-        position: "bottom-right",
-        inset: false,
-        classNames: { base: "translate-y-1/2 translate-x-1/2 transform" }
-      },
-      {
-        position: "top-left",
-        inset: false,
-        classNames: { base: "-translate-y-1/2 -translate-x-1/2 transform" }
-      },
-      {
-        position: "bottom-left",
-        inset: false,
-        classNames: { base: "translate-y-1/2 -translate-x-1/2 transform" }
-      }
-    ],
-    defaultVariants: {
-      size: "md",
-      color: "primary",
-      position: "top-right"
-    }
-  })
-
-export default createChipTheme()

package/src/themes/collapsible.theme.ts

@@ -1,22 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createCollapsibleTheme = () =>
-  defineTheme({
-    slots: ["root", "trigger", "content"],
-    base: {
-      root: "w-full",
-      trigger: "flex items-center justify-between w-full font-medium transition-all",
-      content: "overflow-hidden transition-all duration-300"
-    },
-    variants: {
-      open: {
-        true: { trigger: "", content: "h-auto" },
-        false: { trigger: "", content: "h-0 invisible" }
-      }
-    },
-    defaultVariants: {
-      open: false
-    }
-  })
-
-export default createCollapsibleTheme()

package/src/themes/color-area.theme.ts

@@ -1,33 +0,0 @@
-import { defaultColors } from "../presets/defaults"
-import { defineTheme } from "../utils/defineTheme"
-
-export const createColorAreaTheme = (colors: readonly string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root", "area", "thumb"],
-    base: {
-      root: "relative block touch-none select-none rounded-lg w-full aspect-square outline-none",
-      area: "relative w-full h-full rounded-lg cursor-crosshair bg-muted outline-none",
-      thumb:
-        "absolute block size-4 rounded-full border-2 border-white shadow-md -translate-x-1/2 -translate-y-1/2 cursor-grab active:cursor-grabbing focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-    },
-    variants: {
-      color: Object.fromEntries(
-        colors.map((color) => [
-          color,
-          {
-            root: "rl-color-" + color,
-            thumb: `focus-visible:ring-[var(--rl-ring)]/50`
-          }
-        ])
-      ),
-      theme: {
-        light: { root: "rl-light" },
-        dark: { root: "rl-dark" }
-      }
-    },
-    defaultVariants: {
-      color: "primary"
-    }
-  })
-
-export default createColorAreaTheme()

package/src/themes/color-field.theme.ts

@@ -1,32 +0,0 @@
-import { defaultColors } from "../presets/defaults"
-import { defineTheme } from "../utils/defineTheme"
-
-export const createColorFieldTheme = (colors: readonly string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root", "input"],
-    base: {
-      root: "relative flex items-center border border-border rounded-lg bg-background shadow-sm px-3 py-1.5 focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
-      input:
-        "w-full bg-transparent border-0 p-0 text-sm focus:outline-none focus:ring-0 text-foreground placeholder-muted-foreground"
-    },
-    variants: {
-      color: Object.fromEntries(
-        colors.map((color) => [
-          color,
-          {
-            root: "rl-color-" + color,
-            input: `focus:ring-0`
-          }
-        ])
-      ),
-      theme: {
-        light: { root: "rl-light" },
-        dark: { root: "rl-dark" }
-      }
-    },
-    defaultVariants: {
-      color: "primary"
-    }
-  })
-
-export default createColorFieldTheme()

package/src/themes/color-picker.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createColorPickerTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createColorPickerTheme()

package/src/themes/color-slider.theme.ts

@@ -1,34 +0,0 @@
-import { defaultColors } from "../presets/defaults"
-import { defineTheme } from "../utils/defineTheme"
-
-export const createColorSliderTheme = (colors: readonly string[] = defaultColors) =>
-  defineTheme({
-    slots: ["root", "track", "thumb"],
-    base: {
-      root: "relative flex w-full touch-none select-none items-center outline-none",
-      track:
-        "relative h-3 w-full grow rounded-full border border-border bg-muted cursor-pointer outline-none",
-      thumb:
-        "absolute block size-5 rounded-full border-2 border-white shadow-md cursor-grab active:cursor-grabbing focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-    },
-    variants: {
-      color: Object.fromEntries(
-        colors.map((color) => [
-          color,
-          {
-            root: "rl-color-" + color,
-            thumb: `focus-visible:ring-[var(--rl-ring)]/50`
-          }
-        ])
-      ),
-      theme: {
-        light: { root: "rl-light" },
-        dark: { root: "rl-dark" }
-      }
-    },
-    defaultVariants: {
-      color: "primary"
-    }
-  })
-
-export default createColorSliderTheme()

package/src/themes/command-palette.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createCommandPaletteTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createCommandPaletteTheme()

package/src/themes/compare.theme.ts

@@ -1,13 +0,0 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createCompareTheme = () =>
-  defineTheme({
-    slots: ["root"],
-    base: {
-      root: ""
-    },
-    variants: {},
-    defaultVariants: {}
-  })
-
-export default createCompareTheme()