diff --git a/src/components/ConstantReference.js b/src/components/ConstantReference.js new file mode 100644 index 000000000..981c82fa6 --- /dev/null +++ b/src/components/ConstantReference.js @@ -0,0 +1,30 @@ +import React from 'react'; +import Markdown from 'react-markdown'; +import PropTypes from 'prop-types'; +import styles from './ConstantReference.module.scss'; + +const ConstantReference = ({ constant }) => { + const { name, values, type } = constant; + return ( +
+
{name}
+
{type === 'array' ? '[' : '{'}
+
+ {values.map((value, i) => ( + + ))} +
+
{type === 'array' ? ']' : '}'}
+
+ ); +}; + +ConstantReference.propTypes = { + constant: PropTypes.shape({ + type: PropTypes.string, + name: PropTypes.string, + values: PropTypes.array, + }), +}; + +export default ConstantReference; diff --git a/src/components/ConstantReference.module.scss b/src/components/ConstantReference.module.scss new file mode 100644 index 000000000..d25166206 --- /dev/null +++ b/src/components/ConstantReference.module.scss @@ -0,0 +1,22 @@ +.container { + color: var(--color-neutrals-500); + font-family: var(--code-font); + font-size: 0.875rem; + line-height: 1.5; + margin-top: 2rem; +} + +.name { + font-size: 1rem; + font-family: var(--primary-font-family); + color: var(--color-neutrals-800); + margin-bottom: 0.5rem; +} + +.block { + margin-left: 0.5rem; +} + +.constantContainer { + margin: 0 0 1rem 1.5rem; +} \ No newline at end of file diff --git a/src/hooks/useApiDoc.js b/src/hooks/useApiDoc.js index 008152bb5..0e05d843f 100644 --- a/src/hooks/useApiDoc.js +++ b/src/hooks/useApiDoc.js @@ -60,10 +60,32 @@ const useApiDoc = (name) => { return structuredTypeDefs; }; + const getConstants = (api) => { + return Object.getOwnPropertyNames(api) + .filter( + (member) => + !IGNORED_METHODS.includes(member) && + typeof api[member] !== 'function' + ) + .map((member) => { + return { + name: `${name}.${member}`, + type: api[member] instanceof Array ? 'array' : typeof api[member], + values: + api[member] instanceof Array + ? api[member].map((el) => JSON.stringify(el)) + : Object.getOwnPropertyNames(api[member]).map( + (key) => `${key}: ${JSON.stringify(api[member][key])}` + ), + }; + }); + }; + return { description: apiDocs?.text, usage: `import { ${name} } from 'nr1'`, typeDefs: getTypeDefs(api), + constants: getConstants(api), methods: Object.getOwnPropertyNames(api) .filter( (member) => diff --git a/src/templates/ApiReferenceTemplate.js b/src/templates/ApiReferenceTemplate.js index 4c9df8d46..36f4404e2 100644 --- a/src/templates/ApiReferenceTemplate.js +++ b/src/templates/ApiReferenceTemplate.js @@ -8,6 +8,7 @@ import Container from '../components/Container'; import Layout from '../components/Layout'; import MethodReference from '../components/MethodReference'; import TypeDefReference from '../components/TypeDefReference'; +import ConstantReference from '../components/ConstantReference'; import Sidebar from '../components/Sidebar'; import SEO from '../components/Seo'; import pages from '../data/sidenav.json'; @@ -24,6 +25,7 @@ const ApiReferenceTemplate = ({ data }) => { methods = [], usage = '', typeDefs = [], + constants = [], } = useApiDoc(api) ?? {}; return ( @@ -67,6 +69,15 @@ const ApiReferenceTemplate = ({ data }) => { ))} )} + + {constants.length > 0 && ( +
+

Constants

+ {constants.map((constant, i) => ( + + ))} +
+ )}