@activecollab/components
Version:
ActiveCollab Components
51 lines • 2.01 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["children", "type", "size", "invalid", "open", "endAdornment", "typographyProps", "mode"];
import React, { forwardRef, useMemo } from "react";
import { StyledCaretIcon, StyledSelectTrigger } from "./Styles";
import { Typography } from "../Typography/Typography";
export const SelectTrigger = /*#__PURE__*/forwardRef((_ref, ref) => {
let children = _ref.children,
_ref$type = _ref.type,
type = _ref$type === void 0 ? "button" : _ref$type,
_ref$size = _ref.size,
size = _ref$size === void 0 ? "regular" : _ref$size,
_ref$invalid = _ref.invalid,
invalid = _ref$invalid === void 0 ? false : _ref$invalid,
_ref$open = _ref.open,
open = _ref$open === void 0 ? false : _ref$open,
endAdornment = _ref.endAdornment,
typographyProps = _ref.typographyProps,
_ref$mode = _ref.mode,
mode = _ref$mode === void 0 ? "outlined" : _ref$mode,
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
const variant = useMemo(() => {
if (size === "big") {
return "Body 1";
}
if (size === "biggest") {
return "Header 2";
}
return "Body 2";
}, [size]);
return /*#__PURE__*/React.createElement(StyledSelectTrigger, _extends({
ref: ref,
role: "button",
type: type,
$size: size,
$invalid: invalid,
"aria-invalid": invalid,
$mode: mode
}, rest), /*#__PURE__*/React.createElement(Typography, _extends({
as: "div",
overflow: "truncate",
whitespace: "no-wrap",
variant: variant,
weight: size === "biggest" ? "bold" : "regular",
color: mode === "flat" && invalid ? "alert" : undefined
}, typographyProps), children), endAdornment ? endAdornment : /*#__PURE__*/React.createElement(StyledCaretIcon, {
$open: open
}));
});
SelectTrigger.displayName = "SelectTrigger";
//# sourceMappingURL=SelectTrigger.js.map