From 27d5c358a66ddd082f4452c7b5ed4aa972c33e23 Mon Sep 17 00:00:00 2001 From: Lars Rickert Date: Thu, 28 Mar 2024 09:16:49 +0100 Subject: [PATCH 1/3] fix(vue): disable controls for events, slots and expose --- .../extractArgTypes.test.ts.snap | 120 +++--------------- .../vue3/src/docs/extractArgTypes.ts | 9 +- 2 files changed, 20 insertions(+), 109 deletions(-) diff --git a/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap b/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap index cbdcb9f51226..edb1e5751dc1 100644 --- a/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap +++ b/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap @@ -4,7 +4,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract events for Vue compon { "bar": { "control": { - "disabled": true, + "disable": true, }, "description": "", "name": "bar", @@ -21,7 +21,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract events for Vue compon }, "baz": { "control": { - "disabled": true, + "disable": true, }, "description": "", "name": "baz", @@ -38,7 +38,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract events for Vue compon }, "foo": { "control": { - "disabled": true, + "disable": true, }, "description": "", "name": "foo", @@ -60,7 +60,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract events for component { "bar": { "control": { - "disabled": true, + "disable": true, }, "description": "Test description bar", "name": "bar", @@ -80,7 +80,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract events for component }, "baz": { "control": { - "disabled": true, + "disable": true, }, "description": "Test description baz", "name": "baz", @@ -103,7 +103,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract expose for component { "count": { "control": { - "disabled": true, + "disable": true, }, "description": "a count number", "name": "count", @@ -120,7 +120,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract expose for component }, "label": { "control": { - "disabled": true, + "disable": true, }, "description": "a label string", "name": "label", @@ -141,9 +141,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract expose for component exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1`] = ` { "array": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description required array object", "name": "array", @@ -170,9 +167,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "arrayOptional": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description optional array object", "name": "arrayOptional", @@ -199,9 +193,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "bar": { - "control": { - "disabled": false, - }, "defaultValue": { "summary": "1", }, @@ -222,9 +213,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "baz": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description baz is required boolean", "name": "baz", @@ -241,9 +229,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "enumValue": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description enum value", "name": "enumValue", @@ -265,9 +250,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "foo": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "@default: "rounded"
@since: v1.0.0
@see: https://vuejs.org/
@deprecated: v1.1.0

string foo", "name": "foo", @@ -284,9 +266,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "inlined": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "", "name": "inlined", @@ -309,9 +288,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "literalFromContext": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description literal type alias that require context", "name": "literalFromContext", @@ -336,9 +312,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "nested": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description nested is required nested object", "name": "nested", @@ -361,9 +334,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "nestedIntersection": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description required nested object with intersection", "name": "nestedIntersection", @@ -390,9 +360,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "nestedOptional": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description optional nested object", "name": "nestedOptional", @@ -431,9 +398,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "recursive": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "", "name": "recursive", @@ -457,9 +421,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "stringArray": { - "control": { - "disabled": false, - }, "defaultValue": { "summary": "["foo", "bar"]", }, @@ -484,9 +445,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "union": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description union is required union type", "name": "union", @@ -513,9 +471,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 }, }, "unionOptional": { - "control": { - "disabled": false, - }, "defaultValue": undefined, "description": "description unionOptional is optional union type", "name": "unionOptional", @@ -551,9 +506,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 1 exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2`] = ` { "array": { - "control": { - "disabled": false, - }, "description": "description required array object", "name": "array", "table": { @@ -571,9 +523,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "arrayOptional": { - "control": { - "disabled": false, - }, "description": "description optional array object", "name": "arrayOptional", "table": { @@ -591,9 +540,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "bar": { - "control": { - "disabled": false, - }, "description": "description bar is optional number", "name": "bar", "table": { @@ -612,9 +558,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "baz": { - "control": { - "disabled": false, - }, "description": "description baz is required boolean", "name": "baz", "table": { @@ -631,9 +574,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "enumValue": { - "control": { - "disabled": false, - }, "description": "description enum value", "name": "enumValue", "table": { @@ -651,9 +591,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "foo": { - "control": { - "disabled": false, - }, "description": "string foo", "name": "foo", "table": { @@ -670,9 +607,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "inlined": { - "control": { - "disabled": false, - }, "description": undefined, "name": "inlined", "table": { @@ -690,9 +624,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "literalFromContext": { - "control": { - "disabled": false, - }, "description": "description literal type alias that require context", "name": "literalFromContext", "table": { @@ -710,9 +641,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "nested": { - "control": { - "disabled": false, - }, "description": "description nested is required nested object", "name": "nested", "table": { @@ -730,9 +658,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "nestedIntersection": { - "control": { - "disabled": false, - }, "description": "description required nested object with intersection", "name": "nestedIntersection", "table": { @@ -755,9 +680,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "nestedOptional": { - "control": { - "disabled": false, - }, "description": "description optional nested object", "name": "nestedOptional", "table": { @@ -784,9 +706,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "recursive": { - "control": { - "disabled": false, - }, "description": undefined, "name": "recursive", "table": { @@ -804,9 +723,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "stringArray": { - "control": { - "disabled": false, - }, "description": "description stringArray is string array", "name": "stringArray", "table": { @@ -826,9 +742,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "union": { - "control": { - "disabled": false, - }, "description": "description union is required union type", "name": "union", "table": { @@ -853,9 +766,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 }, }, "unionOptional": { - "control": { - "disabled": false, - }, "description": "description unionOptional is optional union type", "name": "unionOptional", "table": { @@ -889,7 +799,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 { "default": { "control": { - "disabled": false, + "disable": true, }, "description": undefined, "name": "default", @@ -909,7 +819,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 }, "named": { "control": { - "disabled": false, + "disable": true, }, "description": undefined, "name": "named", @@ -929,7 +839,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 }, "no-bind": { "control": { - "disabled": false, + "disable": true, }, "description": undefined, "name": "no-bind", @@ -947,7 +857,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 }, "vbind": { "control": { - "disabled": false, + "disable": true, }, "description": undefined, "name": "vbind", @@ -972,7 +882,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue co { "default": { "control": { - "disabled": false, + "disable": true, }, "description": "", "name": "default", @@ -989,7 +899,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue co }, "named": { "control": { - "disabled": false, + "disable": true, }, "description": "", "name": "named", @@ -1006,7 +916,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue co }, "no-bind": { "control": { - "disabled": false, + "disable": true, }, "description": "", "name": "no-bind", @@ -1023,7 +933,7 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue co }, "vbind": { "control": { - "disabled": false, + "disable": true, }, "description": "", "name": "vbind", diff --git a/code/renderers/vue3/src/docs/extractArgTypes.ts b/code/renderers/vue3/src/docs/extractArgTypes.ts index 151476491c95..4bc29dcbc0df 100644 --- a/code/renderers/vue3/src/docs/extractArgTypes.ts +++ b/code/renderers/vue3/src/docs/extractArgTypes.ts @@ -44,10 +44,11 @@ export const extractArgTypes: ArgTypesExtractor = (component) => { // skip duplicate and global props if (!argType || argTypes[argType.name]) return; - argTypes[argType.name] = { - ...argType, - control: { disabled: !['props', 'slots'].includes(section) }, - }; + if (section !== 'props') { + argType.control = { disable: true }; + } + + argTypes[argType.name] = argType; }); }); From 185b7612e0969bab64f335862fc876a7fbc2520d Mon Sep 17 00:00:00 2001 From: Lars Rickert Date: Fri, 29 Mar 2024 21:25:31 +0100 Subject: [PATCH 2/3] only disable events and exposed --- code/renderers/vue3/src/docs/extractArgTypes.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/code/renderers/vue3/src/docs/extractArgTypes.ts b/code/renderers/vue3/src/docs/extractArgTypes.ts index 4bc29dcbc0df..d466cea2e1cd 100644 --- a/code/renderers/vue3/src/docs/extractArgTypes.ts +++ b/code/renderers/vue3/src/docs/extractArgTypes.ts @@ -44,7 +44,9 @@ export const extractArgTypes: ArgTypesExtractor = (component) => { // skip duplicate and global props if (!argType || argTypes[argType.name]) return; - if (section !== 'props') { + // disable controls for events and exposed since they can not be controlled + const sectionsToDisableControls: (typeof section)[] = ['events', 'expose', 'exposed']; + if (sectionsToDisableControls.includes(section)) { argType.control = { disable: true }; } From cbd8cb30a94569ac474c7ee54cad60e198360d5b Mon Sep 17 00:00:00 2001 From: Lars Rickert Date: Fri, 29 Mar 2024 21:27:37 +0100 Subject: [PATCH 3/3] update vitest snapshots --- .../extractArgTypes.test.ts.snap | 24 ------------------- 1 file changed, 24 deletions(-) diff --git a/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap b/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap index edb1e5751dc1..164f338725e3 100644 --- a/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap +++ b/code/renderers/vue3/src/docs/__snapshots__/extractArgTypes.test.ts.snap @@ -798,9 +798,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract props for component 2 exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1`] = ` { "default": { - "control": { - "disable": true, - }, "description": undefined, "name": "default", "table": { @@ -818,9 +815,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 }, }, "named": { - "control": { - "disable": true, - }, "description": undefined, "name": "named", "table": { @@ -838,9 +832,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 }, }, "no-bind": { - "control": { - "disable": true, - }, "description": undefined, "name": "no-bind", "table": { @@ -856,9 +847,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 }, }, "vbind": { - "control": { - "disable": true, - }, "description": undefined, "name": "vbind", "table": { @@ -881,9 +869,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots for component 1 exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue component 1`] = ` { "default": { - "control": { - "disable": true, - }, "description": "", "name": "default", "table": { @@ -898,9 +883,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue co }, }, "named": { - "control": { - "disable": true, - }, "description": "", "name": "named", "table": { @@ -915,9 +897,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue co }, }, "no-bind": { - "control": { - "disable": true, - }, "description": "", "name": "no-bind", "table": { @@ -932,9 +911,6 @@ exports[`extractArgTypes (vue-docgen-api) > should extract slots type for Vue co }, }, "vbind": { - "control": { - "disable": true, - }, "description": "", "name": "vbind", "table": {