71 lines
1.8 KiB
JavaScript
71 lines
1.8 KiB
JavaScript
/*
|
|
* Copyright (c) 2020 The ZMK Contributors
|
|
*
|
|
* SPDX-License-Identifier: CC-BY-NC-SA-4.0
|
|
*/
|
|
|
|
import React from "react";
|
|
import PropTypes from "prop-types";
|
|
import Name from "./Name";
|
|
import Description from "./Description";
|
|
import Context from "./Context";
|
|
import LinkIcon from "./LinkIcon";
|
|
import OsSupport from "./OsSupport";
|
|
import operatingSystems from "@site/src/data/operating-systems";
|
|
|
|
export default function TableRow({
|
|
names,
|
|
description,
|
|
context = "",
|
|
clarify = false,
|
|
documentation,
|
|
os,
|
|
footnotes,
|
|
tableFootnotes,
|
|
}) {
|
|
return (
|
|
<tr>
|
|
<td className="names">
|
|
{names.map((name) => (
|
|
<Name key={name} name={name}>
|
|
{name}
|
|
</Name>
|
|
))}
|
|
</td>
|
|
<td className="description">
|
|
<Description description={description} />
|
|
{clarify && context ? <Context>{context}</Context> : undefined}
|
|
</td>
|
|
<td className="documentation" title="Documentation">
|
|
<a href={documentation} target="_blank" rel="noreferrer">
|
|
<LinkIcon />
|
|
</a>
|
|
</td>
|
|
{operatingSystems.map(({ key, className, title }) => (
|
|
<td key={key} className={`os ${className}`} title={title}>
|
|
<OsSupport
|
|
value={os[key]}
|
|
footnotes={tableFootnotes.filter(
|
|
({ id }) =>
|
|
(Array.isArray(footnotes[key]) &&
|
|
footnotes[key].includes(id)) ||
|
|
footnotes[key] == id
|
|
)}
|
|
/>
|
|
</td>
|
|
))}
|
|
</tr>
|
|
);
|
|
}
|
|
|
|
TableRow.propTypes = {
|
|
names: PropTypes.array.isRequired,
|
|
description: PropTypes.string.isRequired,
|
|
context: PropTypes.string.isRequired,
|
|
clarify: PropTypes.bool,
|
|
documentation: PropTypes.string.isRequired,
|
|
os: PropTypes.object.isRequired,
|
|
footnotes: PropTypes.object.isRequired,
|
|
tableFootnotes: PropTypes.array.isRequired,
|
|
};
|