@rimelight/ui 0.0.33 → 0.0.35

package/src/types/index.ts

@@ -1,3 +1,153 @@
-export * from "./components"
 export * from "./componentVariant"
 export * from "./theme"
+export * from "./docs"
+
+export type { ThreeDHoverProps } from "./components/3d-hover"
+export type { AccordionProps } from "./components/accordion"
+export type { CalloutProps } from "./components/callout"
+export type { AppProps } from "./components/app"
+export type { AspectRatioProps } from "./components/aspect-ratio"
+export type { AudioProps } from "./components/audio"
+export type { AvatarGroupProps } from "./components/avatar-group"
+export type { AvatarProps } from "./components/avatar"
+export type { BadgeProps } from "./components/badge"
+export type { BannerProps } from "./components/banner"
+export type { BreadcrumbProps } from "./components/breadcrumb"
+export type { BrowserMockupProps } from "./components/browser-mockup"
+export type { ButtonProps } from "./components/button"
+export type { CalendarProps } from "./components/calendar"
+export type { CardProps } from "./components/card"
+export type { CarouselProps } from "./components/carousel"
+export type { ChangelogProps } from "./components/changelog"
+export type { ChartProps, ChartDataPoint } from "./components/chart"
+export type { ChatMessageProps } from "./components/chat-message"
+export type { ChatMessagesProps } from "./components/chat-messages"
+export type { ChatPaletteProps } from "./components/chat-palette"
+export type { ChatPromptProps } from "./components/chat-prompt"
+export type { ChatPromptSubmitProps } from "./components/chat-prompt-submit"
+export type { ChatReasoningProps } from "./components/chat-reasoning"
+export type { ChatShimmerProps } from "./components/chat-shimmer"
+export type { ChatToolProps } from "./components/chat-tool"
+export type { ChatProps } from "./components/chat"
+export type { CheckboxProps } from "./components/checkbox"
+export type { ChipProps } from "./components/chip"
+export type { CollapsibleProps } from "./components/collapsible"
+export type { ColorPickerProps } from "./components/color-picker"
+export type { CommandPaletteProps } from "./components/command-palette"
+export type { CompareProps } from "./components/compare"
+export type { ConfirmProps } from "./components/confirm"
+export type { ContainerProps } from "./components/container"
+export type { ContextMenuProps } from "./components/context-menu"
+export type { DashboardGroupProps } from "./components/dashboard-group"
+export type { DashboardNavbarProps } from "./components/dashboard-navbar"
+export type { DashboardPanelProps } from "./components/dashboard-panel"
+export type { DashboardResizeHandleProps } from "./components/dashboard-resize-handle"
+export type { DashboardSearchButtonProps } from "./components/dashboard-search-button"
+export type { DashboardSearchProps } from "./components/dashboard-search"
+export type { SearchProps } from "./components/search"
+export type { DashboardSidebarCollapseProps } from "./components/dashboard-sidebar-collapse"
+export type { DashboardSidebarToggleProps } from "./components/dashboard-sidebar-toggle"
+export type { DashboardSidebarProps } from "./components/dashboard-sidebar"
+export type { DashboardToolbarProps } from "./components/dashboard-toolbar"
+export type { DockProps } from "./components/dock"
+export type { DrawerProps } from "./components/drawer"
+export type { DropdownMenuProps } from "./components/dropdown-menu"
+export type { EditorProps } from "./components/editor"
+export type { EmptyProps } from "./components/empty"
+export type { ErrorProps } from "./components/error"
+export type { FieldGroupProps } from "./components/field-group"
+export type { FieldsetProps } from "./components/fieldset"
+export type { FileUploadProps } from "./components/file-upload"
+export type { FloatingActionProps } from "./components/floating-action"
+export type { FooterProps } from "./components/footer"
+export type { FormFieldProps } from "./components/form-field"
+export type { FormProps } from "./components/form"
+export type { GalleryProps } from "./components/gallery"
+export type { GridProps } from "./components/grid"
+export type { LayoutGridProps } from "./components/layout-grid"
+export type { HeaderProps } from "./components/header"
+export type { HoverCardProps } from "./components/hover-card"
+export type { IconProps } from "./components/icon"
+export type { ImageProps } from "./components/image"
+export type { InputDateProps } from "./components/input-date"
+export type { InputMenuProps } from "./components/input-menu"
+export type { InputNumberProps } from "./components/input-number"
+export type { InputProps } from "./components/input"
+export type { InputTagsProps } from "./components/input-tags"
+export type { InputTimeProps } from "./components/input-time"
+export type { KbdProps } from "./components/kbd"
+export type { KnobProps } from "./components/knob"
+export type { LabelProps } from "./components/label"
+export type { LinkGroupProps } from "./components/link-group"
+export type { LinkProps } from "./components/link"
+export type { ListboxProps } from "./components/listbox"
+export type { LocaleSelectorProps } from "./components/locale-selector"
+export type { LogoProps } from "./components/logo"
+export type { MainProps } from "./components/main"
+export type { MarqueeProps } from "./components/marquee"
+export type { MeterProps } from "./components/meter"
+export type { ModalProps } from "./components/modal"
+export type { NavigationMenuItem, NavigationMenuProps } from "./components/navigation-menu"
+export type { PageAsideProps } from "./components/page-aside"
+export type { PageBodyProps } from "./components/page-body"
+export type { PageHeaderProps } from "./components/page-header"
+export type { PageSectionProps } from "./components/page-section"
+export type { PageProps } from "./components/page"
+export type { PaginationProps } from "./components/pagination"
+export type { PasswordProps } from "./components/password"
+export type { PhoneMockupProps } from "./components/phone-mockup"
+export type { PinInputProps } from "./components/pin-input"
+export type { PlaceholderProps } from "./components/placeholder"
+export type { PopoverProps } from "./components/popover"
+export type { PostProps } from "./components/post"
+export type { PricingPlanProps } from "./components/pricing-plan"
+export type { PricingTableProps } from "./components/pricing-table"
+export type { ProgressProps } from "./components/progress"
+export type { ProseProps } from "./components/prose"
+export type { QrCodeProps } from "./components/qr-code"
+export type { RadioGroupProps } from "./components/radio-group"
+export type { RatingProps } from "./components/rating"
+export type { ScrollAreaProps } from "./components/scroll-area"
+export type { ScrollToTopProps } from "./components/scroll-to-top"
+export type { SelectProps } from "./components/select"
+export type { SeparatorProps } from "./components/separator"
+export type {
+  SidebarProps,
+  DocsConfig,
+  BadgeConfig,
+  SidebarItem,
+  SidebarScope
+} from "./components/sidebar"
+export type { SkeletonProps } from "./components/skeleton"
+export type { SlideoverProps } from "./components/slideover"
+export type { SliderProps } from "./components/slider"
+export type { SpeedDialProps } from "./components/speed-dial"
+export type { SpinnerProps } from "./components/spinner"
+export type { SplitterProps } from "./components/splitter"
+export type { SpoilerProps } from "./components/spoiler"
+export type { StepperProps } from "./components/stepper"
+export type { StepsProps } from "./components/steps"
+export type { StickySurfaceProps } from "./components/sticky-surface"
+export type { SwitchProps } from "./components/switch"
+export type {
+  TableOfContentsProps,
+  TableOfContentsHeading,
+  TableOfContentsConfig
+} from "./components/table-of-contents"
+export type { TableProps } from "./components/table"
+export type { TabsProps } from "./components/tabs"
+export type { TextareaProps } from "./components/textarea"
+export type { ThemeSelectorProps } from "./components/theme-selector"
+export type { TimelineProps } from "./components/timeline"
+export type { ToastProps } from "./components/toast"
+export type { TooltipProps } from "./components/tooltip"
+export type { TourProps } from "./components/tour"
+export type { TreeProps } from "./components/tree"
+export type { UserProps } from "./components/user"
+export type { VideoProps } from "./components/video"
+export type { WatermarkProps } from "./components/watermark"
+export type { WindowMockupProps } from "./components/window-mockup"
+
+export type { ColorAreaProps } from "./components/color-area"
+export type { ColorFieldProps } from "./components/color-field"
+export type { ColorSliderProps } from "./components/color-slider"

package/src/types/theme.ts

@@ -1 +1,11 @@
-export type Theme = "flat" | "light" | "dark"
+import type { defaultColors } from "../presets/defaults"
+
+export type Theme = "light" | "dark"
+
+export interface CustomColors {}
+
+type AddCustomColors<T> = [keyof T] extends [never]
+  ? (typeof defaultColors)[number]
+  : (typeof defaultColors)[number] | keyof T
+
+export type ThemeColor = AddCustomColors<CustomColors> | "neutral"

package/src/utils/color.ts

@@ -0,0 +1,165 @@
+export function hexToRgb(hex: string): [number, number, number] {
+  const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i
+  const fullHex = hex.replace(shorthandRegex, (_, r, g, b) => r + r + g + g + b + b)
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(fullHex)
+  return result
+    ? [parseInt(result[1]!, 16), parseInt(result[2]!, 16), parseInt(result[3]!, 16)]
+    : [0, 0, 0]
+}
+
+function toHex(c: number): string {
+  const hex = Math.max(0, Math.min(255, c)).toString(16)
+  return hex.length === 1 ? "0" + hex : hex
+}
+
+export function rgbToHex(r: number, g: number, b: number): string {
+  return "#" + toHex(r) + toHex(g) + toHex(b)
+}
+
+export function rgbToHsl(r: number, g: number, b: number): [number, number, number] {
+  r /= 255
+  g /= 255
+  b /= 255
+  const max = Math.max(r, g, b),
+    min = Math.min(r, g, b)
+  let h = 0,
+    s = 0,
+    l = (max + min) / 2
+  if (max !== min) {
+    const d = max - min
+    s = l > 0.5 ? d / (2 - max - min) : d / (max + min)
+    switch (max) {
+      case r:
+        h = (g - b) / d + (g < b ? 6 : 0)
+        break
+      case g:
+        h = (b - r) / d + 2
+        break
+      case b:
+        h = (r - g) / d + 4
+        break
+    }
+    h /= 6
+  }
+  return [Math.round(h * 360), Math.round(s * 100), Math.round(l * 100)]
+}
+
+function hue2rgb(p: number, q: number, t: number): number {
+  if (t < 0) t += 1
+  if (t > 1) t -= 1
+  if (t < 1 / 6) return p + (q - p) * 6 * t
+  if (t < 1 / 2) return q
+  if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6
+  return p
+}
+
+export function hslToRgb(h: number, s: number, l: number): [number, number, number] {
+  h /= 360
+  s /= 100
+  l /= 100
+  let r = l,
+    g = l,
+    b = l
+  if (s !== 0) {
+    const q = l < 0.5 ? l * (1 + s) : l + s - l * s
+    const p = 2 * l - q
+    r = hue2rgb(p, q, h + 1 / 3)
+    g = hue2rgb(p, q, h)
+    b = hue2rgb(p, q, h - 1 / 3)
+  }
+  return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)]
+}
+
+export function rgbToHsb(r: number, g: number, b: number): [number, number, number] {
+  r /= 255
+  g /= 255
+  b /= 255
+  const max = Math.max(r, g, b),
+    min = Math.min(r, g, b)
+  let h = 0,
+    s = 0,
+    v = max
+  const d = max - min
+  s = max === 0 ? 0 : d / max
+  if (max !== min) {
+    switch (max) {
+      case r:
+        h = (g - b) / d + (g < b ? 6 : 0)
+        break
+      case g:
+        h = (b - r) / d + 2
+        break
+      case b:
+        h = (r - g) / d + 4
+        break
+    }
+    h /= 6
+  }
+  return [Math.round(h * 360), Math.round(s * 100), Math.round(v * 100)]
+}
+
+export function hsbToRgb(h: number, s: number, b: number): [number, number, number] {
+  h /= 360
+  s /= 100
+  b /= 100
+  let r = 0,
+    g = 0,
+    bl = 0
+  const i = Math.floor(h * 6)
+  const f = h * 6 - i
+  const p = b * (1 - s)
+  const q = b * (1 - f * s)
+  const t = b * (1 - (1 - f) * s)
+  switch (i % 6) {
+    case 0:
+      r = b
+      g = t
+      bl = p
+      break
+    case 1:
+      r = q
+      g = b
+      bl = p
+      break
+    case 2:
+      r = p
+      g = b
+      bl = t
+      break
+    case 3:
+      r = p
+      g = q
+      bl = b
+      break
+    case 4:
+      r = t
+      g = p
+      bl = b
+      break
+    case 5:
+      r = b
+      g = p
+      bl = q
+      break
+  }
+  return [Math.round(r * 255), Math.round(g * 255), Math.round(bl * 255)]
+}
+
+export function getChannelRange(channel: string): { min: number; max: number } {
+  switch (channel) {
+    case "hue":
+      return { min: 0, max: 360 }
+    case "alpha":
+      return { min: 0, max: 100 }
+    case "red":
+    case "green":
+    case "blue":
+      return { min: 0, max: 255 }
+    default:
+      return { min: 0, max: 100 }
+  }
+}
+
+export function clamp(val: number, min: number, max: number): number {
+  return Math.max(min, Math.min(max, val))
+}