├── .gitignore
├── README.md
├── package.json
├── packages
└── to-markdown
│ ├── README.md
│ ├── dev
│ ├── custom-elements.json
│ ├── custom-elements.md
│ └── index.mjs
│ ├── index.js
│ ├── index.mjs
│ └── package.json
└── yarn.lock
/.gitignore:
--------------------------------------------------------------------------------
1 | ## editors
2 | /.idea
3 | /.vscode
4 |
5 | ## system files
6 | .DS_Store
7 |
8 | ## code coverage folders
9 | coverage/
10 |
11 | ## npm
12 | node_modules/
13 | npm-debug.log
14 | yarn-error.log
15 |
16 | ## temp folders
17 | /.tmp/
18 |
19 | ## build output
20 | dist
21 | tsconfig.tsbuildinfo
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # `@custom-elements-manifest`
2 |
3 | Custom Elements Manifest is a file format that describes custom elements. This format will allow tooling and IDEs to give rich information about the custom elements in a given project. You can find the repository for the specification of the schema [here](https://github.com/webcomponents/custom-elements-manifest).
4 |
5 | > ✨ Try it out in the [online playground](https://custom-elements-manifest.netlify.app/)! ✨
6 | ## Packages
7 |
8 | - [`@custom-elements-manifest/analyzer`](./packages/analyzer)
9 | - [`@custom-elements-manifest/playground`](./packages/playground)
10 | - [`@custom-elements-manifest/to-markdown`](./packages/to-markdown)
11 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@custom-elements-json/root",
3 | "private": true,
4 | "license": "MIT",
5 | "repository": {
6 | "type": "git",
7 | "url": "https://github.com/open-wc/custom-elements-json.git"
8 | },
9 | "scripts": {},
10 | "dependencies": {},
11 | "devDependencies": {},
12 | "workspaces": [
13 | "packages/*"
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/packages/to-markdown/README.md:
--------------------------------------------------------------------------------
1 | # @custom-elements-manifest/to-markdown
2 |
3 | Custom-elements.json is a file format that describes custom elements. This format will allow tooling and IDEs to give rich information about the custom elements in a given project. It is, however, very experimental and things are subject to change. Follow the discussion [here](https://github.com/webcomponents/custom-elements-json).
4 |
5 | This library takes a Custom Elements Manifest and renders it to markdown.
6 |
7 | ## Usage
8 |
9 | Install:
10 | ```bash
11 | npm i -S @custom-elements-manifest/to-markdown
12 | ```
13 |
14 | Import and use in your code:
15 | ```js
16 | import fs from 'fs';
17 | import { customElementsManifestToMarkdown } from '@custom-elements-manifest/to-markdown';
18 |
19 | const manifest = JSON.parse(fs.readFileSync('./custom-elements.json'));
20 | const markdown = customElementsManifestToMarkdown(manifest);
21 |
22 | fs.writeFileSync('./custom-elements.md', markdown);
23 | ```
24 |
25 | ## Demo
26 |
27 |
28 |
29 | Demo
30 |
31 |
32 | # `./fixtures/-TEST/package/my-element.js`:
33 |
34 | ## class: `SuperClass`
35 |
36 | ### Superclass
37 |
38 | | name | module | package |
39 | |------|--------|---------|
40 | |LitElement | |lit-element |
41 |
42 |
43 | ### Methods
44 |
45 | | name | privacy | description | parameters | return | inheritedFrom |
46 | |------|---------|-------------|------------|--------|---------------|
47 | |superClassMethod |public | | | | | |
48 |
49 |
50 | ### Events
51 |
52 | | name | type | description | inheritedFrom |
53 | |------|------|-------------|---------------|
54 | |custom-event |SuperCustomEvent |this is custom | | |
55 |
56 |
57 |
58 |
59 | ## class: `MyElement`, `my-element`
60 |
61 | ### Superclass
62 |
63 | | name | module | package |
64 | |------|--------|---------|
65 | |SuperClass |./fixtures/-TEST/package/my-element.js | |
66 |
67 |
68 | ### Mixins
69 |
70 | | name | module | package |
71 | |------|-----------|---------|
72 | |LocalizeMixin | |lion |
73 | |Mixin |./fixtures/-TEST/package/my-element.js | |
74 |
75 |
76 | ### Fields
77 |
78 | | name | type | privacy | default | description | inheritedFrom |
79 | |------|------|---------|---------|-------------|---------------|
80 | |prop1 | |public | | | | |
81 | |prop2 | |public | | | | |
82 | |prop3 |boolean |public |true | | | |
83 | |foo |string |private |'bar' |description goes here | | |
84 | |mixinProp |number |protected |1 | |Mixin, `./fixtures/-TEST/package/my-element.js` |[object Object] |
85 |
86 |
87 | ### Methods
88 |
89 | | name | privacy | description | parameters | return | inheritedFrom |
90 | |------|---------|-------------|------------|--------|---------------|
91 | |instanceMethod |public |Some description of the method here |e: Event, a: String | | | |
92 | |superClassMethod |public | | | |SuperClass, `./fixtures/-TEST/package/my-element.js` |[object Object] |
93 |
94 |
95 | ### Events
96 |
97 | | name | type | description | inheritedFrom |
98 | |------|------|-------------|---------------|
99 | |my-event |Event | | | |
100 | |custom-event |SuperCustomEvent |this is custom |SuperClass, `./fixtures/-TEST/package/my-element.js` |[object Object] |
101 |
102 |
103 | ### Attributes
104 |
105 | | name | fieldName | inheritedFrom |
106 | |------|-----------|---------------|
107 | |prop-1 |prop1 | | |
108 | |prop2 |prop2 | | |
109 |
110 |
111 | ### CSS Properties
112 |
113 | | name | description |
114 | |------|-----------|
115 | |--background-color |Controls the color of bar |
116 |
117 |
118 | ### Slots
119 |
120 | | name | description |
121 | |------|-----------|
122 | |container |You can put some elements here |
123 |
124 |
125 |
126 |
127 | ## mixin: `MyMixin4`
128 | ### Parameters
129 |
130 | | name | type | default | description |
131 | |------|------|---------|-------------|
132 | |klass |* | |This is the description |
133 | |foo |string | |Description goes here |
134 |
135 |
136 |
137 |
138 | ## mixin: `Mixin`
139 | ### Parameters
140 |
141 | | name | type | default | description |
142 | |------|------|---------|-------------|
143 | |klass |* | |This is the description |
144 |
145 |
146 | ### Fields
147 |
148 | | name | type | privacy | default | description | inheritedFrom |
149 | |------|------|---------|---------|-------------|---------------|
150 | |mixinProp |number |protected |1 | | | |
151 |
152 |
153 |
154 |
155 | ## Variables
156 |
157 | | name | description | type |
158 | |------|-------------|------|
159 | |variableExport |this is a var export |boolean |
160 | |stringVariableExport |this is a string var export |string |
161 |
162 |
163 | ## Functions
164 |
165 | | name | description | parameters | return |
166 | |------|-------------|------------|--------|
167 | |functionExport |This is a function export |a: string, b: boolean |boolean |
168 |
169 |
170 | ## Exports
171 |
172 | | kind | name | declaration | module | package |
173 | |------|-----------|-------------|--------|---------|
174 | |js |SuperClass |SuperClass | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
175 | |custom-element-definition |my-element |MyElement | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
176 | |js |variableExport |variableExport | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
177 | |js |stringVariableExport |stringVariableExport | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
178 | |js |functionExport |functionExport | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
179 |
180 |
181 |
--------------------------------------------------------------------------------
/packages/to-markdown/dev/custom-elements.json:
--------------------------------------------------------------------------------
1 | {
2 | "schemaVersion": "experimental",
3 | "readme": "",
4 | "modules": [
5 | {
6 | "kind": "javascript-module",
7 | "path": "./fixtures/-TEST/package/my-element.js",
8 | "declarations": [
9 | {
10 | "kind": "class",
11 | "name": "SuperClass",
12 | "events": [
13 | {
14 | "name": "custom-event",
15 | "type": {
16 | "text": "SuperCustomEvent"
17 | },
18 | "description": "this is custom"
19 | }
20 | ],
21 | "superclass": {
22 | "name": "LitElement",
23 | "package": "lit-element"
24 | },
25 | "members": [
26 | {
27 | "kind": "method",
28 | "name": "superClassMethod",
29 | "privacy": "public"
30 | }
31 | ]
32 | },
33 | {
34 | "kind": "class",
35 | "name": "MyElement",
36 | "cssProperties": [
37 | {
38 | "name": "--background-color",
39 | "description": "Controls the color of bar"
40 | }
41 | ],
42 | "cssParts": [
43 | {
44 | "name": "bar",
45 | "description": "Styles the color of bar"
46 | }
47 | ],
48 | "slots": [
49 | {
50 | "name": "container",
51 | "description": "You can put some elements here"
52 | }
53 | ],
54 | "events": [
55 | {
56 | "name": "my-event",
57 | "type": {
58 | "text": "Event"
59 | }
60 | },
61 | {
62 | "name": "custom-event",
63 | "type": {
64 | "text": "SuperCustomEvent"
65 | },
66 | "description": "this is custom",
67 | "inheritedFrom": {
68 | "name": "SuperClass",
69 | "module": "./fixtures/-TEST/package/my-element.js"
70 | }
71 | }
72 | ],
73 | "mixins": [
74 | {
75 | "name": "LocalizeMixin",
76 | "package": "lion"
77 | },
78 | {
79 | "name": "Mixin",
80 | "module": "./fixtures/-TEST/package/my-element.js"
81 | }
82 | ],
83 | "superclass": {
84 | "name": "SuperClass",
85 | "module": "./fixtures/-TEST/package/my-element.js"
86 | },
87 | "attributes": [
88 | {
89 | "name": "prop-1",
90 | "fieldName": "prop1"
91 | },
92 | {
93 | "name": "prop2",
94 | "fieldName": "prop2"
95 | }
96 | ],
97 | "members": [
98 | {
99 | "kind": "field",
100 | "name": "prop1",
101 | "privacy": "public"
102 | },
103 | {
104 | "kind": "field",
105 | "name": "prop2",
106 | "privacy": "public"
107 | },
108 | {
109 | "kind": "field",
110 | "name": "prop3",
111 | "privacy": "public",
112 | "type": {
113 | "text": "boolean"
114 | },
115 | "default": "true"
116 | },
117 | {
118 | "kind": "field",
119 | "name": "foo",
120 | "type": {
121 | "text": "string"
122 | },
123 | "privacy": "private",
124 | "description": "description goes here",
125 | "default": "'bar'"
126 | },
127 | {
128 | "kind": "method",
129 | "name": "instanceMethod",
130 | "privacy": "public",
131 | "description": "Some description of the method here",
132 | "return": {
133 | "type": {
134 | "text": ""
135 | }
136 | },
137 | "parameters": [
138 | {
139 | "name": "e",
140 | "type": {
141 | "text": "Event"
142 | }
143 | },
144 | {
145 | "name": "a",
146 | "type": {
147 | "text": "String"
148 | },
149 | "description": "some description"
150 | }
151 | ]
152 | },
153 | {
154 | "kind": "field",
155 | "name": "mixinProp",
156 | "type": {
157 | "text": "number"
158 | },
159 | "privacy": "protected",
160 | "default": "1",
161 | "inheritedFrom": {
162 | "name": "Mixin",
163 | "module": "./fixtures/-TEST/package/my-element.js"
164 | }
165 | },
166 | {
167 | "kind": "method",
168 | "name": "superClassMethod",
169 | "privacy": "public",
170 | "inheritedFrom": {
171 | "name": "SuperClass",
172 | "module": "./fixtures/-TEST/package/my-element.js"
173 | }
174 | }
175 | ],
176 | "tagName": "my-element"
177 | },
178 | {
179 | "kind": "variable",
180 | "name": "variableExport",
181 | "description": "this is a var export",
182 | "type": {
183 | "text": "boolean"
184 | }
185 | },
186 | {
187 | "kind": "variable",
188 | "name": "stringVariableExport",
189 | "description": "this is a string var export",
190 | "type": {
191 | "text": "string"
192 | }
193 | },
194 | {
195 | "kind": "function",
196 | "name": "functionExport",
197 | "description": "This is a function export",
198 | "return": {
199 | "type": {
200 | "text": "boolean"
201 | }
202 | },
203 | "parameters": [
204 | {
205 | "name": "a",
206 | "type": {
207 | "text": "string"
208 | }
209 | },
210 | {
211 | "name": "b",
212 | "type": {
213 | "text": "boolean"
214 | }
215 | }
216 | ]
217 | },
218 | {
219 | "kind": "mixin",
220 | "name": "MyMixin4",
221 | "parameters": [
222 | {
223 | "name": "klass",
224 | "type": {
225 | "text": "*"
226 | },
227 | "description": "This is the description"
228 | },
229 | {
230 | "name": "foo",
231 | "type": {
232 | "text": "string"
233 | },
234 | "description": "Description goes here"
235 | }
236 | ]
237 | },
238 | {
239 | "kind": "mixin",
240 | "name": "Mixin",
241 | "superclass": {
242 | "name": "klass",
243 | "module": "./fixtures/-TEST/package/my-element.js"
244 | },
245 | "parameters": [
246 | {
247 | "name": "klass",
248 | "type": {
249 | "text": "*"
250 | },
251 | "description": "This is the description"
252 | }
253 | ],
254 | "members": [
255 | {
256 | "kind": "field",
257 | "name": "mixinProp",
258 | "type": {
259 | "text": "number"
260 | },
261 | "privacy": "protected",
262 | "default": "1"
263 | }
264 | ]
265 | }
266 | ],
267 | "exports": [
268 | {
269 | "kind": "js",
270 | "name": "SuperClass",
271 | "declaration": {
272 | "name": "SuperClass",
273 | "module": "./fixtures/-TEST/package/my-element.js"
274 | }
275 | },
276 | {
277 | "kind": "custom-element-definition",
278 | "name": "my-element",
279 | "declaration": {
280 | "name": "MyElement",
281 | "module": "./fixtures/-TEST/package/my-element.js"
282 | }
283 | },
284 | {
285 | "kind": "js",
286 | "name": "variableExport",
287 | "declaration": {
288 | "name": "variableExport",
289 | "module": "./fixtures/-TEST/package/my-element.js"
290 | }
291 | },
292 | {
293 | "kind": "js",
294 | "name": "stringVariableExport",
295 | "declaration": {
296 | "name": "stringVariableExport",
297 | "module": "./fixtures/-TEST/package/my-element.js"
298 | }
299 | },
300 | {
301 | "kind": "js",
302 | "name": "functionExport",
303 | "declaration": {
304 | "name": "functionExport",
305 | "module": "./fixtures/-TEST/package/my-element.js"
306 | }
307 | }
308 | ]
309 | }
310 | ]
311 | }
--------------------------------------------------------------------------------
/packages/to-markdown/dev/custom-elements.md:
--------------------------------------------------------------------------------
1 | # `./fixtures/-TEST/package/my-element.js`:
2 |
3 | ## class: `SuperClass`
4 |
5 | ### Superclass
6 |
7 | | name | module | package |
8 | |------|--------|---------|
9 | |LitElement | |lit-element |
10 |
11 |
12 | ### Methods
13 |
14 | | name | privacy | description | parameters | return | inheritedFrom |
15 | |------|---------|-------------|------------|--------|---------------|
16 | |superClassMethod |public | | | | | |
17 |
18 |
19 | ### Events
20 |
21 | | name | type | description | inheritedFrom |
22 | |------|------|-------------|---------------|
23 | |custom-event |SuperCustomEvent |this is custom | | |
24 |
25 |
26 |
27 |
28 | ## class: `MyElement`, `my-element`
29 |
30 | ### Superclass
31 |
32 | | name | module | package |
33 | |------|--------|---------|
34 | |SuperClass |./fixtures/-TEST/package/my-element.js | |
35 |
36 |
37 | ### Mixins
38 |
39 | | name | module | package |
40 | |------|-----------|---------|
41 | |LocalizeMixin | |lion |
42 | |Mixin |./fixtures/-TEST/package/my-element.js | |
43 |
44 |
45 | ### Fields
46 |
47 | | name | type | privacy | default | description | inheritedFrom |
48 | |------|------|---------|---------|-------------|---------------|
49 | |prop1 | |public | | | | |
50 | |prop2 | |public | | | | |
51 | |prop3 |boolean |public |true | | | |
52 | |foo |string |private |'bar' |description goes here | | |
53 | |mixinProp |number |protected |1 | |Mixin |[object Object] |
54 |
55 |
56 | ### Methods
57 |
58 | | name | privacy | description | parameters | return | inheritedFrom |
59 | |------|---------|-------------|------------|--------|---------------|
60 | |instanceMethod |public |Some description of the method here |e Event, a String | | | |
61 | |superClassMethod |public | | | |SuperClass |[object Object] |
62 |
63 |
64 | ### Events
65 |
66 | | name | type | description | inheritedFrom |
67 | |------|------|-------------|---------------|
68 | |my-event |Event | | | |
69 | |custom-event |SuperCustomEvent |this is custom |SuperClass |[object Object] |
70 |
71 |
72 | ### Attributes
73 |
74 | | name | fieldName | inheritedFrom |
75 | |------|-----------|---------------|
76 | |prop-1 |prop1 | | |
77 | |prop2 |prop2 | | |
78 |
79 |
80 | ### CSS Properties
81 |
82 | | name | description |
83 | |------|-----------|
84 | |--background-color |Controls the color of bar |
85 |
86 |
87 | ### Slots
88 |
89 | | name | description |
90 | |------|-----------|
91 | |container |You can put some elements here |
92 |
93 |
94 |
95 |
96 | ## mixin: `MyMixin4`
97 | ### Parameters
98 |
99 | | name | type | default | description |
100 | |------|------|---------|-------------|
101 | |klass |* | |This is the description |
102 | |foo |string | |Description goes here |
103 |
104 |
105 |
106 |
107 | ## mixin: `Mixin`
108 | ### Parameters
109 |
110 | | name | type | default | description |
111 | |------|------|---------|-------------|
112 | |klass |* | |This is the description |
113 |
114 |
115 | ### Fields
116 |
117 | | name | type | privacy | default | description | inheritedFrom |
118 | |------|------|---------|---------|-------------|---------------|
119 | |mixinProp |number |protected |1 | | | |
120 |
121 |
122 |
123 |
124 | ## Variables
125 |
126 | | name | description | type |
127 | |------|-------------|------|
128 | |variableExport |this is a var export |boolean |
129 | |stringVariableExport |this is a string var export |string |
130 |
131 |
132 | ## Functions
133 |
134 | | name | description | parameters | return |
135 | |------|-------------|------------|--------|
136 | |functionExport |This is a function export |a string, b boolean |boolean |
137 |
138 |
139 | ## Exports
140 |
141 | | kind | name | declaration | module | package |
142 | |------|-----------|-------------|--------|---------|
143 | |js |SuperClass |SuperClass | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
144 | |custom-element-definition |my-element |MyElement | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
145 | |js |variableExport |variableExport | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
146 | |js |stringVariableExport |stringVariableExport | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
147 | |js |functionExport |functionExport | ./fixtures/-TEST/package/my-element.js | |[object Object] | | |
148 |
--------------------------------------------------------------------------------
/packages/to-markdown/dev/index.mjs:
--------------------------------------------------------------------------------
1 | import fs from 'fs';
2 | import { customElementsManifestToMarkdown } from '../index.js';
3 |
4 | const cem = JSON.parse(fs.readFileSync('./dev/custom-elements.json'));
5 |
6 |
7 | const md = customElementsManifestToMarkdown(cem);
8 | console.log(md);
9 | fs.writeFileSync('./dev/custom-elements.md', md);
--------------------------------------------------------------------------------
/packages/to-markdown/index.js:
--------------------------------------------------------------------------------
1 | const has = item => Array.isArray(item) && item.length > 0;
2 | const render = (item, properties) => {
3 | let md = '|'
4 | properties.forEach(prop => {
5 | if(prop === 'declaration') {
6 | md += `${item?.declaration?.name || ''} | ${item?.declaration?.module || ''} | ${item?.declaration?.package || ''} |`
7 | }
8 |
9 | if(prop === 'inheritedFrom') {
10 | if(item?.inheritedFrom?.name) {
11 | md += `${item?.inheritedFrom?.name} |`
12 | } else {
13 | md += ` |`
14 | }
15 | }
16 |
17 | if(prop === 'parameters') {
18 | md += `${item?.parameters?.map(param => `${param.name} ${param?.type?.text || ''}`).join(', ') || ''} |`
19 | return `${md}\n`;
20 | }
21 |
22 | if(prop === 'type') {
23 | console.log(item)
24 | md += `${item?.type?.text || ''} |`
25 | return `${md}\n`;
26 | }
27 |
28 | if(prop === 'return') {
29 | md += `${item?.return?.type?.text || ''} |`
30 | return `${md}\n`;
31 | }
32 |
33 | if(prop === 'description') {
34 | md += `${item?.[prop]?.replace(/(\r\n|\n|\r)/gm, '
') || ''} |`
35 | return `${md}\n`;
36 | }
37 |
38 | md += `${item?.[prop] || ''} |`
39 | });
40 | return `${md}\n`;
41 | }
42 |
43 | function customElementsManifestToMarkdown(cem) {
44 | let md = '';
45 | cem?.modules.forEach(mod => {
46 | if(!has(mod?.declarations) && !has(mod?.exports)) {
47 | return;
48 | }
49 |
50 | md += `# \`${mod.path}\`:`;
51 |
52 | const variables = mod?.declarations?.filter(declaration => declaration.kind === 'variable');
53 | const functions = mod?.declarations?.filter(declaration => declaration.kind === 'function');
54 |
55 | mod?.declarations.forEach(declaration => {
56 | const {
57 | superclass,
58 | mixins,
59 | events,
60 | tagName,
61 | members,
62 | attributes,
63 | slots,
64 | cssProperties,
65 | parts,
66 | kind,
67 | name,
68 | parameters
69 | } = declaration;
70 |
71 | if(declaration.kind === 'mixin' || declaration.kind === 'class') {
72 |
73 | md += `\n\n## ${kind}: \`${name}\`${tagName ? `, \`${tagName}\`` : ''} `;
74 |
75 | if(declaration.kind === 'class') {
76 | if(superclass) {
77 | md += `
78 |
79 | ### Superclass
80 |
81 | | name | module | package |
82 | |------|--------|---------|
83 | ${render(superclass, ['name', 'module', 'package'])}`
84 | }
85 | }
86 |
87 | if(has(mixins)) {
88 | md += `
89 |
90 | ### Mixins
91 |
92 | | name | module | package |
93 | |------|-----------|---------|
94 | `
95 | mixins?.forEach((mixin) => {
96 | md += render(mixin, ['name', 'module', 'package'])
97 | });
98 | }
99 |
100 | const fields = members?.filter(({kind}) => kind === 'field');
101 | const methods = members?.filter(({kind}) => kind === 'method');
102 |
103 | if(has(parameters)) {
104 | md += `
105 | ### Parameters
106 |
107 | | name | type | default | description |
108 | |------|------|---------|-------------|
109 | `
110 | parameters?.forEach(param => {
111 | md += render(param, ['name', 'type', 'default', 'description']);
112 | })
113 | }
114 |
115 | if(has(fields)) {
116 | md+= `
117 |
118 | ### Fields
119 |
120 | | name | type | privacy | default | description | inheritedFrom |
121 | |------|------|---------|---------|-------------|---------------|
122 | `
123 | fields?.forEach(member => {
124 | md += render(member, ['name', 'type', 'privacy', 'default', 'description', 'inheritedFrom']);
125 | });
126 | }
127 |
128 | if(has(methods)) {
129 | md += `
130 |
131 | ### Methods
132 |
133 | | name | privacy | description | parameters | return | inheritedFrom |
134 | |------|---------|-------------|------------|--------|---------------|
135 | `
136 | methods?.forEach(member => {
137 | md += render(member, ['name', 'privacy', 'description', 'parameters', 'return', 'inheritedFrom']);
138 | });
139 | }
140 |
141 | // @TODO:
142 | if(has(events)) {
143 | md += `
144 |
145 | ### Events
146 |
147 | | name | type | description | inheritedFrom |
148 | |------|------|-------------|---------------|
149 | `
150 | events?.forEach(event => {
151 | md += render(event, ['name', 'type', 'description', 'inheritedFrom']);
152 | });
153 | }
154 |
155 | if(has(attributes)) {
156 | md += `
157 |
158 | ### Attributes
159 |
160 | | name | fieldName | inheritedFrom |
161 | |------|-----------|---------------|
162 | `
163 | attributes?.forEach(attr => {
164 | md += render(attr, ['name', 'fieldName', 'inheritedFrom']);
165 | });
166 | }
167 |
168 | if(has(cssProperties)) {
169 | md += `
170 |
171 | ### CSS Properties
172 |
173 | | name | description |
174 | |------|-----------|
175 | `
176 | cssProperties?.forEach(cssProp => {
177 | md += render(cssProp, ['name', 'description']);
178 | });
179 | }
180 |
181 | if(has(parts)) {
182 | md += `
183 |
184 | ### CSS Parts
185 |
186 | | name | description |
187 | |------|-----------|
188 | `
189 | parts?.forEach(part => {
190 | md += render(part, ['name', 'description']);
191 | });
192 | }
193 |
194 | if(has(slots)) {
195 | md += `
196 |
197 | ### Slots
198 |
199 | | name | description |
200 | |------|-----------|
201 | `
202 | slots?.forEach(slot => {
203 | md += render(slot, ['name', 'description']);
204 | });
205 | }
206 |
207 | md += `\n\n
`
208 | }
209 | });
210 |
211 | if(has(variables)) {
212 | md += `\n\n## Variables
213 |
214 | | name | description | type |
215 | |------|-------------|------|
216 | `
217 |
218 | variables?.forEach(variable => {
219 | md += render(variable, ['name', 'description', 'type']);
220 | });
221 |
222 | md += `
`
223 | }
224 |
225 | if(has(functions)) {
226 | md += `\n\n## Functions
227 |
228 | | name | description | parameters | return |
229 | |------|-------------|------------|--------|
230 | `
231 |
232 | functions?.forEach(fun => {
233 | md += render(fun, ['name', 'description', 'parameters', 'return']);
234 | });
235 |
236 | md += `
`
237 | }
238 |
239 |
240 | if(has(mod?.exports)) {
241 | md += `
242 |
243 | ## Exports
244 |
245 | | kind | name | declaration | module | package |
246 | |------|-----------|-------------|--------|---------|
247 | `
248 | mod?.exports?.forEach(xport => {
249 | md += render(xport, ['kind', 'name', 'declaration', 'module', 'package']);
250 | });
251 |
252 | }
253 | });
254 |
255 | return md;
256 | }
257 |
258 | module.exports = {
259 | customElementsManifestToMarkdown
260 | };
--------------------------------------------------------------------------------
/packages/to-markdown/index.mjs:
--------------------------------------------------------------------------------
1 | import cjsEntrypoint from './index.js';
2 |
3 | const {
4 | customElementsManifestToMarkdown
5 | } = cjsEntrypoint;
6 |
7 | export {
8 | customElementsManifestToMarkdown
9 | };
10 |
--------------------------------------------------------------------------------
/packages/to-markdown/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@custom-elements-manifest/to-markdown",
3 | "version": "0.0.3",
4 | "description": "",
5 | "license": "MIT",
6 | "repository": {
7 | "type": "git",
8 | "url": "https://github.com/open-wc/custom-elements-manifest.git"
9 | },
10 | "author": "open-wc",
11 | "homepage": "https://github.com/open-wc/custom-elements-manifest",
12 | "bugs": {
13 | "url": "https://github.com/open-wc/custom-elements-manifest"
14 | },
15 | "main": "index.js",
16 | "module": "index.mjs",
17 | "scripts": {
18 | "start": "nodemon ./dev/index.mjs"
19 | },
20 | "files": [
21 | "*.d.ts",
22 | "*.js",
23 | "*.mjs",
24 | "dist",
25 | "src"
26 | ],
27 | "keywords": [
28 | "custom-elements",
29 | "custom-elements-json",
30 | "custom-elements-manifest",
31 | "customelements",
32 | "webcomponents",
33 | "customelementsjson",
34 | "customelementsmanifest",
35 | "markdown",
36 | "md"
37 | ],
38 | "devDependencies": {
39 | "custom-elements-manifest": "^0.1.0",
40 | "nodemon": "^2.0.4"
41 | },
42 | "contributors": [
43 | "Pascal Schilp "
44 | ],
45 | "exports": {
46 | ".": {
47 | "import": "./index.mjs",
48 | "require": "./dist/index.js",
49 | "browser": "./dist/esm/index.js"
50 | }
51 | }
52 | }
53 |
--------------------------------------------------------------------------------