From 97067993d043c87ccdfb987fa578cf0f2f025a21 Mon Sep 17 00:00:00 2001 From: Anish Aggarwal Date: Wed, 12 Aug 2020 01:39:13 +0530 Subject: [PATCH] [Playground] EuiAccordion (#3886) * [Playground] EuiAccordion * created dummyFunction utility * replaced all instances with dummyFunction --- .../src/services/playground/dummyFunction.js | 9 +++ src-docs/src/services/playground/index.js | 1 + .../src/views/accordion/accordion_example.js | 3 + src-docs/src/views/accordion/playground.js | 61 +++++++++++++++++++ src-docs/src/views/badge/playground.js | 14 +---- src-docs/src/views/card/playground.js | 18 ++---- src-docs/src/views/toast/playground.js | 14 +---- src-docs/src/views/tool_tip/playground.js | 18 ++---- 8 files changed, 88 insertions(+), 50 deletions(-) create mode 100644 src-docs/src/services/playground/dummyFunction.js create mode 100644 src-docs/src/views/accordion/playground.js diff --git a/src-docs/src/services/playground/dummyFunction.js b/src-docs/src/services/playground/dummyFunction.js new file mode 100644 index 000000000000..af9c023e5d3c --- /dev/null +++ b/src-docs/src/services/playground/dummyFunction.js @@ -0,0 +1,9 @@ +import * as t from '@babel/types'; + +export const dummyFunction = { + generate: val => { + if (!val) return null; + const obj = t.arrowFunctionExpression([], t.blockStatement([]), false); + return obj; + }, +}; diff --git a/src-docs/src/services/playground/index.js b/src-docs/src/services/playground/index.js index 9eb55733ddea..aec882db37cf 100644 --- a/src-docs/src/services/playground/index.js +++ b/src-docs/src/services/playground/index.js @@ -4,3 +4,4 @@ export { default as propUtilityForPlayground } from './props'; export { mapOptions } from './mapOptions'; export { iconValidator } from './iconValidator'; export { createOptionalEnum } from './createOptionalEnum'; +export { dummyFunction } from './dummyFunction'; diff --git a/src-docs/src/views/accordion/accordion_example.js b/src-docs/src/views/accordion/accordion_example.js index 2a3ea4b4a9e0..22d86caad1df 100644 --- a/src-docs/src/views/accordion/accordion_example.js +++ b/src-docs/src/views/accordion/accordion_example.js @@ -12,6 +12,8 @@ import { EuiSpacer, } from '../../../../src/components'; +import { accordionConfig } from './playground'; + import Accordion from './accordion'; const accordionSource = require('!!raw-loader!./accordion'); const accordionHtml = renderToHtml(Accordion); @@ -354,4 +356,5 @@ export const AccordionExample = { demo: , }, ], + playground: accordionConfig, }; diff --git a/src-docs/src/views/accordion/playground.js b/src-docs/src/views/accordion/playground.js new file mode 100644 index 000000000000..11367301cc80 --- /dev/null +++ b/src-docs/src/views/accordion/playground.js @@ -0,0 +1,61 @@ +import { PropTypes } from 'react-view'; +import { EuiAccordion, EuiText } from '../../../../src/components/'; +import { + propUtilityForPlayground, + createOptionalEnum, + dummyFunction, +} from '../../services/playground'; + +export const accordionConfig = () => { + const docgenInfo = Array.isArray(EuiAccordion.__docgenInfo) + ? EuiAccordion.__docgenInfo[0] + : EuiAccordion.__docgenInfo; + const propsToUse = propUtilityForPlayground(docgenInfo.props); + + propsToUse.buttonContent = { + ...propsToUse.buttonContent, + value: 'Click me to toggle', + type: PropTypes.String, + }; + + propsToUse.children = { + value: ` +

+ Any content inside of EuiAccordion will appear here. +

+ `, + type: PropTypes.ReactNode, + hidden: false, + }; + + propsToUse.onToggle = { + ...propsToUse.onToggle, + type: PropTypes.Custom, + value: undefined, + custom: { + use: 'switch', + label: 'Simulate', + }, + }; + + propsToUse.forceState = createOptionalEnum(propsToUse.forceState); + + return { + config: { + componentName: 'EuiAccordion', + props: propsToUse, + scope: { + EuiAccordion, + EuiText, + }, + imports: { + '@elastic/eui': { + named: ['EuiAccordion', 'EuiText'], + }, + }, + customProps: { + onToggle: dummyFunction, + }, + }, + }; +}; diff --git a/src-docs/src/views/badge/playground.js b/src-docs/src/views/badge/playground.js index 91bbd4d1479e..a4c60df5a371 100644 --- a/src-docs/src/views/badge/playground.js +++ b/src-docs/src/views/badge/playground.js @@ -7,8 +7,8 @@ import { import { propUtilityForPlayground, iconValidator, + dummyFunction, } from '../../services/playground'; -import * as t from '@babel/types'; export const badgeConfig = () => { const docgenInfo = Array.isArray(EuiBadge.__docgenInfo) @@ -88,17 +88,7 @@ export const badgeConfig = () => { }, }, customProps: { - onClick: { - generate: val => { - if (!val) return null; - const obj = t.arrowFunctionExpression( - [], - t.blockStatement([]), - false - ); - return obj; - }, - }, + onClick: dummyFunction, }, }, }; diff --git a/src-docs/src/views/card/playground.js b/src-docs/src/views/card/playground.js index c6d68570141a..981df8aee043 100644 --- a/src-docs/src/views/card/playground.js +++ b/src-docs/src/views/card/playground.js @@ -1,7 +1,9 @@ import { PropTypes } from 'react-view'; import { EuiCard } from '../../../../src/components/'; -import { propUtilityForPlayground } from '../../services/playground'; -import * as t from '@babel/types'; +import { + propUtilityForPlayground, + dummyFunction, +} from '../../services/playground'; export default () => { const docgenInfo = Array.isArray(EuiCard.__docgenInfo) @@ -50,17 +52,7 @@ export default () => { }, }, customProps: { - onClick: { - generate: val => { - if (!val) return null; - const obj = t.arrowFunctionExpression( - [], - t.blockStatement([]), - false - ); - return obj; - }, - }, + onClick: dummyFunction, }, }, }; diff --git a/src-docs/src/views/toast/playground.js b/src-docs/src/views/toast/playground.js index 4478ddf57f18..4aab1209fb21 100644 --- a/src-docs/src/views/toast/playground.js +++ b/src-docs/src/views/toast/playground.js @@ -4,8 +4,8 @@ import { propUtilityForPlayground, iconValidator, createOptionalEnum, + dummyFunction, } from '../../services/playground'; -import * as t from '@babel/types'; export default () => { const docgenInfo = Array.isArray(EuiToast.__docgenInfo) @@ -47,17 +47,7 @@ export default () => { }, }, customProps: { - onClose: { - generate: val => { - if (!val) return null; - const obj = t.arrowFunctionExpression( - [], - t.blockStatement([]), - false - ); - return obj; - }, - }, + onClose: dummyFunction, }, }, }; diff --git a/src-docs/src/views/tool_tip/playground.js b/src-docs/src/views/tool_tip/playground.js index 2bf1dc98c508..71168bb4c060 100644 --- a/src-docs/src/views/tool_tip/playground.js +++ b/src-docs/src/views/tool_tip/playground.js @@ -1,7 +1,9 @@ import { PropTypes } from 'react-view'; import { EuiToolTip } from '../../../../src/components/'; -import { propUtilityForPlayground } from '../../services/playground'; -import * as t from '@babel/types'; +import { + propUtilityForPlayground, + dummyFunction, +} from '../../services/playground'; export default () => { const docgenInfo = Array.isArray(EuiToolTip.__docgenInfo) @@ -52,17 +54,7 @@ export default () => { }, }, customProps: { - onMouseOut: { - generate: val => { - if (!val) return null; - const obj = t.arrowFunctionExpression( - [], - t.blockStatement([]), - false - ); - return obj; - }, - }, + onMouseOut: dummyFunction, }, }, };