tembro 1.0.0

package/packages/cli/vendor/src/components/ui/input/index.tsx

@@ -0,0 +1,355 @@
+import * as React from "react"
+
+import { InputPrimitive, type InputPrimitiveProps } from "./primitive"
+import {
+  InputGroup,
+  InputGroupAddon,
+  InputGroupButton,
+  InputGroupInput,
+  InputGroupText,
+  InputGroupTextarea,
+} from "./group"
+import { InputDecorator } from "@/components/inputs/input-decorator"
+import { ClearableInput, type ClearableInputProps } from "@/components/inputs/clearable-input"
+import { DateInput, type DateInputProps } from "@/components/inputs/date-input"
+import { DateRangeInput, type DateRangeInputProps } from "@/components/inputs/date-range-input"
+import { MoneyInput, type MoneyInputProps } from "@/components/inputs/money-input"
+import { MaskedInput, type MaskedInputProps } from "@/components/inputs/masked-input"
+import { NumberInput, type NumberInputProps } from "@/components/inputs/number-input"
+import { PasswordInput, type PasswordInputProps } from "@/components/inputs/password-input"
+import { PhoneInput, type PhoneInputProps } from "@/components/inputs/phone-input"
+import { QuantityInput, type QuantityInputProps } from "@/components/inputs/quantity-input"
+import { SearchInput, type SearchInputProps } from "@/components/inputs/search-input"
+import { cn } from "@/lib/utils"
+
+export type InputKind =
+  | "text"
+  | "clearable"
+  | "search"
+  | "password"
+  | "number"
+  | "phone"
+  | "money"
+  | "quantity"
+  | "masked"
+  | "date"
+  | "date-range"
+
+export type InputTextProps = Omit<InputPrimitiveProps, "value"> & {
+  kind?: "text"
+  value?: string | number | readonly string[] | null
+  onValueChange?: (value: string) => void
+  leading?: React.ReactNode
+  trailing?: React.ReactNode
+  trailingAction?: React.ReactNode
+  clearable?: boolean
+  onClear?: () => void
+  clearLabel?: string
+  clearOnEscape?: boolean
+  focusAfterClear?: boolean
+  replaceTrailingWhenClear?: boolean
+  helperText?: React.ReactNode
+  errorText?: React.ReactNode
+  showCharacterCount?: boolean
+  countFormatter?: (currentLength: number, maxLength?: number) => React.ReactNode
+  wrapperClassName?: string
+  inputClassName?: string
+  helperClassName?: string
+  leadingPointerEvents?: boolean
+  trailingPointerEvents?: boolean
+}
+
+export type InputClearableProps = Omit<ClearableInputProps, "kind"> & {
+  kind: "clearable"
+}
+
+export type InputSearchProps = Omit<SearchInputProps, "kind"> & {
+  kind: "search"
+}
+
+export type InputPasswordProps = Omit<PasswordInputProps, "kind"> & {
+  kind: "password"
+}
+
+export type InputNumberProps = Omit<NumberInputProps, "kind"> & {
+  kind: "number"
+}
+
+export type InputPhoneProps = Omit<PhoneInputProps, "kind"> & {
+  kind: "phone"
+}
+
+export type InputMoneyProps = Omit<MoneyInputProps, "kind"> & {
+  kind: "money"
+}
+
+export type InputQuantityProps = Omit<QuantityInputProps, "kind"> & {
+  kind: "quantity"
+}
+
+export type InputMaskedProps = Omit<MaskedInputProps, "kind"> & {
+  kind: "masked"
+}
+
+export type InputDateProps = Omit<DateInputProps, "kind"> & {
+  kind: "date"
+}
+
+export type InputDateRangeProps = Omit<DateRangeInputProps, "onChange" | "onValueChange" | "value"> & {
+  kind: "date-range"
+  onValueChange?: (value: { from?: string; to?: string }) => void
+  value?: DateRangeInputProps["value"]
+}
+
+export type InputProps =
+  | InputTextProps
+  | InputClearableProps
+  | InputSearchProps
+  | InputPasswordProps
+  | InputNumberProps
+  | InputPhoneProps
+  | InputMoneyProps
+  | InputQuantityProps
+  | InputMaskedProps
+  | InputDateProps
+  | InputDateRangeProps
+
+function getInputTextLength(value: InputTextProps["value"] | InputTextProps["defaultValue"]) {
+  if (typeof value === "string") return value.length
+  if (typeof value === "number") return String(value).length
+  if (Array.isArray(value)) return value.join("").length
+  return 0
+}
+
+const Input = React.forwardRef<HTMLInputElement | HTMLDivElement, InputProps>((props, ref) => {
+  const kind = props.kind ?? "text"
+
+  if (kind === "search") {
+    return (
+      <SearchInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<SearchInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "password") {
+    return (
+      <PasswordInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<PasswordInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "number") {
+    return (
+      <NumberInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<NumberInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "phone") {
+    return (
+      <PhoneInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<PhoneInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "money") {
+    return (
+      <MoneyInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<MoneyInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "quantity") {
+    return (
+      <QuantityInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<QuantityInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "masked") {
+    return (
+      <MaskedInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<MaskedInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "date") {
+    return (
+      <DateInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<DateInputProps, "kind">)}
+      />
+    )
+  }
+
+  if (kind === "date-range") {
+    return <DateRangeInput {...(props as Omit<InputDateRangeProps, "kind">)} />
+  }
+
+  if (kind === "clearable") {
+    return (
+      <ClearableInput
+        ref={ref as React.ForwardedRef<HTMLInputElement>}
+        {...(props as Omit<ClearableInputProps, "kind">)}
+      />
+    )
+  }
+
+  const inputProps = props as Omit<InputTextProps, "kind">
+  const {
+    value,
+    defaultValue,
+    leading,
+    trailing,
+    trailingAction,
+    clearable = false,
+    onValueChange,
+    onClear,
+    clearLabel,
+    clearOnEscape,
+    focusAfterClear,
+    replaceTrailingWhenClear,
+    helperText,
+    errorText,
+    showCharacterCount = false,
+    countFormatter,
+    wrapperClassName,
+    inputClassName,
+    helperClassName,
+    leadingPointerEvents = false,
+    trailingPointerEvents = true,
+    onChange,
+    maxLength,
+    className,
+    ...restInputProps
+  } = inputProps
+  const isControlled = value !== undefined
+  const [uncontrolledLength, setUncontrolledLength] = React.useState(() => getInputTextLength(defaultValue))
+  const currentLength = isControlled ? getInputTextLength(value) : uncontrolledLength
+  const helperMessage = errorText ?? helperText
+  const helperTone = errorText ? "text-destructive" : "text-muted-foreground"
+
+  const handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {
+    if (!isControlled) {
+      setUncontrolledLength(event.target.value.length)
+    }
+    onChange?.(event)
+  }
+
+  const handleTextValueChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {
+    handleChange(event)
+    onValueChange?.(event.target.value)
+  }
+
+  const textInput = clearable ? (
+    <ClearableInput
+      ref={ref as React.ForwardedRef<HTMLInputElement>}
+      value={value as string | number | null | undefined}
+      defaultValue={value === undefined ? (defaultValue as string | number | undefined) : undefined}
+      type={restInputProps.type ?? "text"}
+      leadingIcon={leading}
+      trailing={trailing}
+      trailingAction={trailingAction}
+      clearable={clearable}
+      onChange={handleChange}
+      onValueChange={onValueChange}
+      onClear={onClear}
+      clearLabel={clearLabel}
+      clearOnEscape={clearOnEscape}
+      focusAfterClear={focusAfterClear}
+      replaceTrailingWhenClear={replaceTrailingWhenClear}
+      wrapperClassName={wrapperClassName}
+      inputClassName={inputClassName}
+      className={className}
+      maxLength={maxLength}
+      {...(restInputProps as Omit<ClearableInputProps, "value" | "defaultValue" | "type" | "onChange" | "onValueChange">)}
+    />
+  ) : leading || trailing || trailingAction ? (
+    <InputDecorator
+      ref={ref as React.ForwardedRef<HTMLInputElement>}
+      value={value ?? undefined}
+      defaultValue={value === undefined ? defaultValue : undefined}
+      type={restInputProps.type ?? "text"}
+      leading={leading}
+      trailing={trailing}
+      trailingAction={trailingAction}
+      leadingPointerEvents={leadingPointerEvents}
+      trailingPointerEvents={trailingPointerEvents}
+      wrapperClassName={wrapperClassName}
+      inputClassName={inputClassName}
+      className={className}
+      onChange={handleTextValueChange}
+      maxLength={maxLength}
+      {...(restInputProps as React.ComponentProps<typeof InputDecorator>)}
+    />
+  ) : (
+    <InputPrimitive
+      ref={ref as React.ForwardedRef<HTMLInputElement>}
+      value={value ?? undefined}
+      defaultValue={value === undefined ? defaultValue : undefined}
+      type={restInputProps.type ?? "text"}
+      className={cn(inputClassName, className)}
+      onChange={handleTextValueChange}
+      maxLength={maxLength}
+      {...(restInputProps as React.ComponentProps<typeof InputPrimitive>)}
+    />
+  )
+
+  if (!helperMessage && !showCharacterCount) {
+    return textInput
+  }
+
+  return (
+    <div data-slot="input-field" className="grid gap-1.5">
+      {textInput}
+      <div
+        data-slot="input-meta"
+        className="flex items-start justify-between gap-3 px-1"
+      >
+        <div
+          data-slot="input-helper"
+          className={cn("min-w-0 text-xs leading-5", helperTone, helperClassName)}
+        >
+          {helperMessage}
+        </div>
+        {showCharacterCount ? (
+          <div
+            data-slot="input-count"
+            className={cn(
+              "shrink-0 text-[11px] font-medium tabular-nums",
+              errorText ? "text-destructive" : "text-muted-foreground"
+            )}
+          >
+            {countFormatter?.(currentLength, maxLength) ??
+              (typeof maxLength === "number" ? `${currentLength}/${maxLength}` : currentLength)}
+          </div>
+        ) : null}
+      </div>
+    </div>
+  )
+})
+Input.displayName = "Input"
+
+export {
+  Input,
+  InputGroup,
+  InputGroupAddon,
+  InputGroupButton,
+  InputGroupInput,
+  InputGroupText,
+  InputGroupTextarea,
+}

package/packages/cli/vendor/src/components/ui/input/primitive.tsx

@@ -0,0 +1,24 @@
+import * as React from "react"
+import { Input as BaseInputPrimitive } from "@base-ui/react/input"
+
+import { cn } from "@/lib/utils"
+
+export type InputPrimitiveProps = React.ComponentProps<"input"> & {
+  type?: string
+}
+
+function InputPrimitive({ className, type, ...props }: InputPrimitiveProps) {
+  return (
+    <BaseInputPrimitive
+      type={type}
+      data-slot="input"
+      className={cn(
+        "h-11 w-full min-w-0 rounded-[var(--aui-control-radius,var(--radius-lg))] border border-[color:color-mix(in_oklch,var(--aui-control-border-strong,var(--input)),var(--foreground)_6%)] bg-[color:var(--aui-control-surface,var(--background))] px-4 py-2.5 text-sm font-medium text-foreground shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04))] transition-[background-color,border-color,box-shadow,color] outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground/72 hover:border-[color:color-mix(in_oklch,var(--aui-control-hover-border,var(--ring)),var(--foreground)_10%)] hover:bg-[color:var(--aui-control-surface-hover,var(--background))] focus-visible:border-[color:var(--ring)] focus-visible:ring-0 focus-visible:shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04)),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:pointer-events-none disabled:cursor-not-allowed disabled:border-[color:color-mix(in_oklch,var(--border),transparent_18%)] disabled:bg-[color:var(--aui-control-surface-disabled,var(--muted))] disabled:text-muted-foreground disabled:shadow-none disabled:opacity-100 read-only:bg-[color:var(--aui-control-surface-readonly,var(--muted))]",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export { InputPrimitive }

package/packages/cli/vendor/src/components/ui/input-group/index.tsx

@@ -0,0 +1,8 @@
+export {
+  InputGroup,
+  InputGroupAddon,
+  InputGroupButton,
+  InputGroupInput,
+  InputGroupText,
+  InputGroupTextarea,
+} from "@/components/ui/input/group"

package/packages/cli/vendor/src/components/ui/input-primitive/index.tsx

@@ -0,0 +1,2 @@
+export { InputPrimitive } from "@/components/ui/input/primitive"
+export type { InputPrimitiveProps } from "@/components/ui/input/primitive"

package/packages/cli/vendor/src/components/ui/kbd/index.tsx

@@ -0,0 +1,33 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+export type KbdProps = React.ComponentProps<"kbd"> & {
+  size?: "sm" | "default" | "lg"
+  variant?: "default" | "outline" | "ghost"
+}
+
+const sizeClassName = {
+  sm: "h-5 px-1.5 text-[10px]",
+  default: "h-6 px-2 text-xs",
+  lg: "h-7 px-2.5 text-sm",
+}
+
+const variantClassName = {
+  default: "border-border/80 bg-muted text-muted-foreground shadow-[inset_0_-1px_0_rgba(0,0,0,0.08)]",
+  outline: "border-border bg-background text-foreground shadow-sm",
+  ghost: "border-transparent bg-transparent text-muted-foreground shadow-none",
+}
+
+function Kbd({ className, size = "default", variant = "default", ...props }: KbdProps) {
+  return (
+    <kbd
+      data-slot="kbd"
+      data-size={size}
+      className={cn("inline-flex shrink-0 items-center justify-center rounded-md border font-mono font-medium leading-none", sizeClassName[size], variantClassName[variant], className)}
+      {...props}
+    />
+  )
+}
+
+export { Kbd }

package/packages/cli/vendor/src/components/ui/popover/index.tsx

@@ -0,0 +1,97 @@
+"use client"
+
+import * as React from "react"
+import { Popover as PopoverPrimitive } from "@base-ui/react/popover"
+
+import { cn } from "@/lib/utils"
+
+export type PopoverRootProps = PopoverPrimitive.Root.Props
+export type PopoverTriggerProps = PopoverPrimitive.Trigger.Props
+export type PopoverContentProps = PopoverPrimitive.Popup.Props &
+  Pick<
+    PopoverPrimitive.Positioner.Props,
+    "align" | "alignOffset" | "side" | "sideOffset"
+  >
+export type PopoverHeaderProps = React.ComponentProps<"div">
+export type PopoverTitleProps = PopoverPrimitive.Title.Props
+export type PopoverDescriptionProps = PopoverPrimitive.Description.Props
+
+function Popover({ ...props }: PopoverPrimitive.Root.Props) {
+  return <PopoverPrimitive.Root data-slot="popover" {...props} />
+}
+
+function PopoverTrigger({ ...props }: PopoverTriggerProps) {
+  return <PopoverPrimitive.Trigger data-slot="popover-trigger" {...props} />
+}
+
+function PopoverContent({
+  className,
+  align = "center",
+  alignOffset = 0,
+  side = "bottom",
+  sideOffset = 4,
+  ...props
+}: PopoverContentProps) {
+  return (
+    <PopoverPrimitive.Portal>
+      <PopoverPrimitive.Positioner
+        align={align}
+        alignOffset={alignOffset}
+        side={side}
+        sideOffset={sideOffset}
+        className="isolate z-50"
+      >
+        <PopoverPrimitive.Popup
+          data-slot="popover-content"
+          className={cn(
+            "z-50 flex w-80 origin-(--transform-origin) flex-col gap-3 rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:var(--aui-card-border,var(--border))] bg-[color:var(--aui-overlay-surface,var(--popover))] p-4 text-sm text-popover-foreground shadow-[var(--aui-popover-shadow,0_18px_42px_rgba(15,23,42,0.16))] outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+            className
+          )}
+          {...props}
+        />
+      </PopoverPrimitive.Positioner>
+    </PopoverPrimitive.Portal>
+  )
+}
+
+function PopoverHeader({ className, ...props }: PopoverHeaderProps) {
+  return (
+    <div
+      data-slot="popover-header"
+      className={cn("flex flex-col gap-1 text-sm", className)}
+      {...props}
+    />
+  )
+}
+
+function PopoverTitle({ className, ...props }: PopoverTitleProps) {
+  return (
+    <PopoverPrimitive.Title
+      data-slot="popover-title"
+      className={cn("text-base font-semibold tracking-tight", className)}
+      {...props}
+    />
+  )
+}
+
+function PopoverDescription({
+  className,
+  ...props
+}: PopoverDescriptionProps) {
+  return (
+    <PopoverPrimitive.Description
+      data-slot="popover-description"
+      className={cn("leading-6 text-muted-foreground", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Popover,
+  PopoverContent,
+  PopoverDescription,
+  PopoverHeader,
+  PopoverTitle,
+  PopoverTrigger,
+}

package/packages/cli/vendor/src/components/ui/radio-group/index.tsx

@@ -0,0 +1,102 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+export type RadioGroupOption = {
+  label: React.ReactNode
+  value: string
+  description?: React.ReactNode
+  disabled?: boolean
+}
+
+export type RadioGroupProps = Omit<React.ComponentProps<"div">, "onChange"> & {
+  name?: string
+  value?: string
+  defaultValue?: string
+  onValueChange?: (value: string) => void
+  options: RadioGroupOption[]
+  orientation?: "vertical" | "horizontal"
+  size?: "sm" | "default" | "lg"
+  itemClassName?: string
+}
+
+const sizeClassName = {
+  sm: "size-3.5",
+  default: "size-4",
+  lg: "size-5",
+}
+
+function RadioGroup({
+  name,
+  value,
+  defaultValue,
+  onValueChange,
+  options,
+  orientation = "vertical",
+  size = "default",
+  className,
+  itemClassName,
+  ...props
+}: RadioGroupProps) {
+  const generatedName = React.useId()
+  const resolvedName = name ?? generatedName
+  const [internalValue, setInternalValue] = React.useState(defaultValue ?? "")
+  const isControlled = value !== undefined
+  const currentValue = isControlled ? value : internalValue
+
+  const setValue = (nextValue: string) => {
+    if (!isControlled) setInternalValue(nextValue)
+    onValueChange?.(nextValue)
+  }
+
+  return (
+    <div
+      role="radiogroup"
+      data-slot="radio-group"
+      data-orientation={orientation}
+      className={cn("grid gap-2", orientation === "horizontal" && "sm:flex sm:flex-wrap sm:items-center", className)}
+      {...props}
+    >
+      {options.map((option) => {
+        const checked = option.value === currentValue
+        return (
+          <label
+            key={option.value}
+            data-slot="radio-group-item"
+            data-checked={checked || undefined}
+            data-disabled={option.disabled || undefined}
+            className={cn(
+              "group flex cursor-pointer items-start gap-3 rounded-[min(var(--radius-xl),16px)] border border-border/80 bg-background/88 px-3 py-2.5 text-sm transition hover:border-ring/35 hover:bg-accent/60 data-[checked=true]:border-primary/35 data-[checked=true]:bg-primary/8 data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-55",
+              itemClassName
+            )}
+          >
+            <input
+              type="radio"
+              name={resolvedName}
+              value={option.value}
+              checked={checked}
+              disabled={option.disabled}
+              className="sr-only"
+              onChange={() => setValue(option.value)}
+            />
+            <span
+              aria-hidden="true"
+              className={cn(
+                "mt-0.5 inline-flex shrink-0 items-center justify-center rounded-full border border-input bg-background shadow-sm transition group-data-[checked=true]:border-primary group-data-[checked=true]:bg-primary",
+                sizeClassName[size]
+              )}
+            >
+              <span className="size-1.5 rounded-full bg-primary-foreground opacity-0 transition group-data-[checked=true]:opacity-100" />
+            </span>
+            <span className="min-w-0">
+              <span className="block font-medium text-foreground">{option.label}</span>
+              {option.description ? <span className="mt-1 block text-sm leading-6 text-muted-foreground">{option.description}</span> : null}
+            </span>
+          </label>
+        )
+      })}
+    </div>
+  )
+}
+
+export { RadioGroup }

package/packages/cli/vendor/src/components/ui/right-click-menu/index.tsx

@@ -0,0 +1,60 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+export type RightClickMenuItem = {
+  label: React.ReactNode
+  onSelect?: () => void
+  disabled?: boolean
+}
+
+export type RightClickMenuProps = React.ComponentProps<"div"> & {
+  items: RightClickMenuItem[]
+}
+
+function RightClickMenu({ items, children, className, ...props }: RightClickMenuProps) {
+  const [open, setOpen] = React.useState(false)
+  const [point, setPoint] = React.useState({ x: 0, y: 0 })
+
+  React.useEffect(() => {
+    if (!open) return
+    const close = () => setOpen(false)
+    window.addEventListener("click", close)
+    return () => window.removeEventListener("click", close)
+  }, [open])
+
+  return (
+    <div
+      data-slot="right-click-menu"
+      className={cn("contents", className)}
+      onContextMenu={(event) => {
+        event.preventDefault()
+        setPoint({ x: event.clientX, y: event.clientY })
+        setOpen(true)
+      }}
+      {...props}
+    >
+      {children}
+      {open ? (
+        <div className="fixed z-50 min-w-40 rounded-xl border border-border bg-popover p-1.5 text-sm text-popover-foreground shadow-xl" style={{ left: point.x, top: point.y }}>
+          {items.map((item, index) => (
+            <button
+              key={index}
+              type="button"
+              disabled={item.disabled}
+              className="block w-full rounded-lg px-3 py-2 text-left hover:bg-accent disabled:pointer-events-none disabled:opacity-50"
+              onClick={() => {
+                item.onSelect?.()
+                setOpen(false)
+              }}
+            >
+              {item.label}
+            </button>
+          ))}
+        </div>
+      ) : null}
+    </div>
+  )
+}
+
+export { RightClickMenu }