From 039aec08bb1d31f3c175365b65cb5deee841aae2 Mon Sep 17 00:00:00 2001 From: Blake Netzeband Date: Thu, 5 Sep 2024 15:20:49 -0600 Subject: [PATCH 1/4] created script to add annotions to component file --- scripts/utils/generate-annotation.ts | 61 ++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 scripts/utils/generate-annotation.ts diff --git a/scripts/utils/generate-annotation.ts b/scripts/utils/generate-annotation.ts new file mode 100644 index 00000000000..5f91d1ad307 --- /dev/null +++ b/scripts/utils/generate-annotation.ts @@ -0,0 +1,61 @@ +import os from 'node:os'; +import path from 'node:path'; +import fs from 'fs-extra'; +import { hideBin } from 'yargs/helpers'; +import yargs from 'yargs/yargs'; +import { getPath } from './get-path'; +import { createLogger } from './signale'; + +const { argv } = yargs(hideBin(process.argv)) as any; +const logger = createLogger('build-package'); + +export function camelToKebabCase(value: string) { + return ( + value.substring(0, 1).toLowerCase() + + value.substring(1).replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`) + ); +} + +(async () => { + const [componentName] = argv._; + + if (!componentName) { + logger.error('No component specified'); + process.exit(1); + } + + const componentPath = path.join( + getPath('packages'), + // Only support core components right now + '@mantine/core/src/components', + componentName, + `${componentName}.tsx` + ); + + const exists = await fs.pathExists(componentPath); + if (!exists) { + logger.error(`${componentPath} does not exist`); + process.exit(1); + } + + const url = `https://mantine.dev/core/${camelToKebabCase(componentName)}`; + const annotation = `/** +* [Documentation](${url}) +* +* [Props](${url}?t=props) +* +* [Styles API](${url}?t=styles-api) +*/`; + + const fileContent = fs.readFileSync(componentPath, 'utf-8'); + const lines = fileContent.split(os.EOL); + + const re = new RegExp(`export const ${componentName}|export function ${componentName}`); + const insertIndex = lines.findIndex((v) => v.match(re)); + + lines.splice(insertIndex, 0, annotation); + + fs.writeFileSync(componentPath, lines.join(os.EOL)); + + logger.success(`Successfully added annotations to ${componentName}`); +})(); From 51732c38bbc844a70a06db767c26fbc52b86be2c Mon Sep 17 00:00:00 2001 From: Blake Netzeband Date: Thu, 5 Sep 2024 15:21:05 -0600 Subject: [PATCH 2/4] ran generate-annotion script on Alert and Accordion --- .../@mantine/core/src/components/Accordion/Accordion.tsx | 7 +++++++ packages/@mantine/core/src/components/Alert/Alert.tsx | 7 +++++++ 2 files changed, 14 insertions(+) diff --git a/packages/@mantine/core/src/components/Accordion/Accordion.tsx b/packages/@mantine/core/src/components/Accordion/Accordion.tsx index c33675b6671..7c6ca7d3aef 100644 --- a/packages/@mantine/core/src/components/Accordion/Accordion.tsx +++ b/packages/@mantine/core/src/components/Accordion/Accordion.tsx @@ -108,6 +108,13 @@ const varsResolver = createVarsResolver( }) ); +/** + * [Documentation](https://mantine.dev/core/accordion) + * + * [Props](https://mantine.dev/core/accordion?t=props) + * + * [Styles API](https://mantine.dev/core/accordion?t=styles-api) + */ export function Accordion(_props: AccordionProps) { const props = useProps('Accordion', defaultProps as AccordionProps, _props); const { diff --git a/packages/@mantine/core/src/components/Alert/Alert.tsx b/packages/@mantine/core/src/components/Alert/Alert.tsx index d2e19fa49c7..8c92fc40372 100644 --- a/packages/@mantine/core/src/components/Alert/Alert.tsx +++ b/packages/@mantine/core/src/components/Alert/Alert.tsx @@ -89,6 +89,13 @@ const varsResolver = createVarsResolver( } ); +/** +* [Documentation](https://mantine.dev/core/alert) +* +* [Props](https://mantine.dev/core/alert?t=props) +* +* [Styles API](https://mantine.dev/core/alert?t=styles-api) +*/ export const Alert = factory((_props, ref) => { const props = useProps('Alert', defaultProps, _props); const { From 462248dcf2f757db78717f4a0d454d5b30fb152b Mon Sep 17 00:00:00 2001 From: Blake Netzeband Date: Thu, 5 Sep 2024 15:43:07 -0600 Subject: [PATCH 3/4] added description and re-ran script --- .../src/components/Accordion/Accordion.tsx | 2 ++ .../core/src/components/Alert/Alert.tsx | 14 ++++++++------ scripts/utils/generate-annotation.ts | 19 ++++++++++++------- 3 files changed, 22 insertions(+), 13 deletions(-) diff --git a/packages/@mantine/core/src/components/Accordion/Accordion.tsx b/packages/@mantine/core/src/components/Accordion/Accordion.tsx index 7c6ca7d3aef..c071cfba472 100644 --- a/packages/@mantine/core/src/components/Accordion/Accordion.tsx +++ b/packages/@mantine/core/src/components/Accordion/Accordion.tsx @@ -109,6 +109,8 @@ const varsResolver = createVarsResolver( ); /** + * Divide content into collapsible sections + * * [Documentation](https://mantine.dev/core/accordion) * * [Props](https://mantine.dev/core/accordion?t=props) diff --git a/packages/@mantine/core/src/components/Alert/Alert.tsx b/packages/@mantine/core/src/components/Alert/Alert.tsx index 8c92fc40372..7247f6e6332 100644 --- a/packages/@mantine/core/src/components/Alert/Alert.tsx +++ b/packages/@mantine/core/src/components/Alert/Alert.tsx @@ -90,12 +90,14 @@ const varsResolver = createVarsResolver( ); /** -* [Documentation](https://mantine.dev/core/alert) -* -* [Props](https://mantine.dev/core/alert?t=props) -* -* [Styles API](https://mantine.dev/core/alert?t=styles-api) -*/ + * Attract user attention with important static message + * + * [Documentation](https://mantine.dev/core/alert) + * + * [Props](https://mantine.dev/core/alert?t=props) + * + * [Styles API](https://mantine.dev/core/alert?t=styles-api) + */ export const Alert = factory((_props, ref) => { const props = useProps('Alert', defaultProps, _props); const { diff --git a/scripts/utils/generate-annotation.ts b/scripts/utils/generate-annotation.ts index 5f91d1ad307..3a4f9f60b8b 100644 --- a/scripts/utils/generate-annotation.ts +++ b/scripts/utils/generate-annotation.ts @@ -3,6 +3,7 @@ import path from 'node:path'; import fs from 'fs-extra'; import { hideBin } from 'yargs/helpers'; import yargs from 'yargs/yargs'; +import { MDX_DATA } from '../../apps/mantine.dev/src/mdx'; import { getPath } from './get-path'; import { createLogger } from './signale'; @@ -39,13 +40,17 @@ export function camelToKebabCase(value: string) { } const url = `https://mantine.dev/core/${camelToKebabCase(componentName)}`; - const annotation = `/** -* [Documentation](${url}) -* -* [Props](${url}?t=props) -* -* [Styles API](${url}?t=styles-api) -*/`; + const { description } = MDX_DATA[componentName]; + + const annotationContent = [ + description, + `[Documentation](${url})`, + `[Props](${url}?t=props)`, + `[Styles API](${url}?t=styles-api)`, + ] + .map((v) => `\n * ${v}`) + .join('\n *'); // Add spacing between each line + const annotation = `/**${annotationContent}\n */`; const fileContent = fs.readFileSync(componentPath, 'utf-8'); const lines = fileContent.split(os.EOL); From 0ddcad21ff1f3f0376ad8fad14ade10417926e7b Mon Sep 17 00:00:00 2001 From: Blake Netzeband Date: Mon, 30 Sep 2024 10:06:36 -0600 Subject: [PATCH 4/4] simplified jsdoc. reran generate-annotation script for Alert and Accordion --- .../@mantine/core/src/components/Accordion/Accordion.tsx | 6 +----- packages/@mantine/core/src/components/Alert/Alert.tsx | 6 +----- scripts/utils/generate-annotation.ts | 9 ++++----- 3 files changed, 6 insertions(+), 15 deletions(-) diff --git a/packages/@mantine/core/src/components/Accordion/Accordion.tsx b/packages/@mantine/core/src/components/Accordion/Accordion.tsx index c071cfba472..7157c00fbc6 100644 --- a/packages/@mantine/core/src/components/Accordion/Accordion.tsx +++ b/packages/@mantine/core/src/components/Accordion/Accordion.tsx @@ -111,11 +111,7 @@ const varsResolver = createVarsResolver( /** * Divide content into collapsible sections * - * [Documentation](https://mantine.dev/core/accordion) - * - * [Props](https://mantine.dev/core/accordion?t=props) - * - * [Styles API](https://mantine.dev/core/accordion?t=styles-api) + * [Documentation](https://mantine.dev/core/accordion) | [Props](https://mantine.dev/core/accordion?t=props) | [Styles API](https://mantine.dev/core/accordion?t=styles-api) */ export function Accordion(_props: AccordionProps) { const props = useProps('Accordion', defaultProps as AccordionProps, _props); diff --git a/packages/@mantine/core/src/components/Alert/Alert.tsx b/packages/@mantine/core/src/components/Alert/Alert.tsx index 7247f6e6332..7e00fcf2254 100644 --- a/packages/@mantine/core/src/components/Alert/Alert.tsx +++ b/packages/@mantine/core/src/components/Alert/Alert.tsx @@ -92,11 +92,7 @@ const varsResolver = createVarsResolver( /** * Attract user attention with important static message * - * [Documentation](https://mantine.dev/core/alert) - * - * [Props](https://mantine.dev/core/alert?t=props) - * - * [Styles API](https://mantine.dev/core/alert?t=styles-api) + * [Documentation](https://mantine.dev/core/alert) | [Props](https://mantine.dev/core/alert?t=props) | [Styles API](https://mantine.dev/core/alert?t=styles-api) */ export const Alert = factory((_props, ref) => { const props = useProps('Alert', defaultProps, _props); diff --git a/scripts/utils/generate-annotation.ts b/scripts/utils/generate-annotation.ts index 3a4f9f60b8b..2735253a1f3 100644 --- a/scripts/utils/generate-annotation.ts +++ b/scripts/utils/generate-annotation.ts @@ -42,14 +42,13 @@ export function camelToKebabCase(value: string) { const url = `https://mantine.dev/core/${camelToKebabCase(componentName)}`; const { description } = MDX_DATA[componentName]; - const annotationContent = [ - description, + const links = [ `[Documentation](${url})`, `[Props](${url}?t=props)`, `[Styles API](${url}?t=styles-api)`, - ] - .map((v) => `\n * ${v}`) - .join('\n *'); // Add spacing between each line + ].join(' | '); + + const annotationContent = [description, links].map((v) => `\n * ${v}`).join('\n *'); // Add spacing between each line const annotation = `/**${annotationContent}\n */`; const fileContent = fs.readFileSync(componentPath, 'utf-8');