1import { APIDataType } from '~/components/plugins/api/APIDataType';
2import { ConstantDefinitionData } from '~/components/plugins/api/APIDataTypes';
3import { APISectionDeprecationNote } from '~/components/plugins/api/APISectionDeprecationNote';
4import { APISectionPlatformTags } from '~/components/plugins/api/APISectionPlatformTags';
5import {
6  CommentTextBlock,
7  getTagNamesList,
8  STYLE_APIBOX_NO_SPACING,
9  STYLES_APIBOX,
10  H3Code,
11} from '~/components/plugins/api/APISectionUtils';
12import { H2, BOLD, P, MONOSPACE } from '~/ui/components/Text';
13
14export type APISectionConstantsProps = {
15  data: ConstantDefinitionData[];
16  apiName?: string;
17};
18
19const renderConstant = (
20  { name, comment, type }: ConstantDefinitionData,
21  apiName?: string
22): JSX.Element => (
23  <div key={`constant-definition-${name}`} css={STYLES_APIBOX}>
24    <APISectionDeprecationNote comment={comment} />
25    <APISectionPlatformTags comment={comment} prefix="Only for:" />
26    <H3Code tags={getTagNamesList(comment)}>
27      <MONOSPACE weight="medium">
28        {apiName ? `${apiName}.` : ''}
29        {name}
30      </MONOSPACE>
31    </H3Code>
32    {type && (
33      <P>
34        <BOLD>Type:</BOLD> <APIDataType typeDefinition={type} />
35      </P>
36    )}
37    {comment && (
38      <div css={STYLE_APIBOX_NO_SPACING}>
39        <CommentTextBlock comment={comment} includePlatforms={false} beforeContent={<br />} />
40      </div>
41    )}
42  </div>
43);
44
45const APISectionConstants = ({ data, apiName }: APISectionConstantsProps) =>
46  data?.length ? (
47    <>
48      <H2 key="constants-header">Constants</H2>
49      {data.map(constant => renderConstant(constant, apiName))}
50    </>
51  ) : null;
52
53export default APISectionConstants;
54