Function SelectTrigger

apps/webapp/app/components/primitives/Select.tsx:234–337

({
  icon,
  variant = "tertiary/small",
  text,
  shortcut,
  tooltipTitle,
  disabled,
  placeholder,
  dropdownIcon = false,
  children,
  className,
  ...props
}: SelectTriggerProps)

}

export function SelectTrigger({
  icon,
  variant = "tertiary/small",
  text,
  shortcut,
  tooltipTitle,
  disabled,
  placeholder,
  dropdownIcon = false,
  children,
  className,
  ...props
}: SelectTriggerProps) {
  const ref = React.useRef<HTMLButtonElement>(null);
  useShortcutKeys({
    shortcut: shortcut,
    action: (e) => {
      e.preventDefault();
      e.stopPropagation();
      if (ref.current) {
        ref.current.click();
      }
    },
    disabled,
  });

  const showTooltip = tooltipTitle || shortcut;
  const variantClasses = variants[variant];

  let content: React.ReactNode = "";
  if (children) {
    content = children;
  } else if (text !== undefined) {
    if (typeof text === "function") {
      content = <SelectValue>{(value) => <>{text(value) ?? placeholder}</>}</SelectValue>;
    } else {
      content = text;
    }
  } else {
    content = (
      <SelectValue>
        {(value) => (
          <>
            {typeof value === "string"
              ? value ?? placeholder
              : value.length === 0
              ? placeholder
              : value.join(", ")}
          </>
        )}
      </SelectValue>
    );
  }

  return (
    <Ariakit.TooltipProvider timeout={200}>
      <Ariakit.TooltipAnchor
        className="button"