diff --git a/src-docs/src/views/expression/expression_example.js b/src-docs/src/views/expression/expression_example.js index 2692e707834..97f04ed79a9 100644 --- a/src-docs/src/views/expression/expression_example.js +++ b/src-docs/src/views/expression/expression_example.js @@ -8,6 +8,8 @@ import { EuiCode } from '../../../../src/components'; import { EuiExpression } from '../../../../src/components/expression'; +import { expressionConfig } from './playground'; + import Expression from './expression'; const expressionSource = require('!!raw-loader!./expression'); const expressionHtml = renderToHtml(Expression); @@ -226,4 +228,5 @@ export const ExpressionExample = { demo: , }, ], + playground: expressionConfig, }; diff --git a/src-docs/src/views/expression/playground.js b/src-docs/src/views/expression/playground.js new file mode 100644 index 00000000000..fe65c09e932 --- /dev/null +++ b/src-docs/src/views/expression/playground.js @@ -0,0 +1,59 @@ +import { PropTypes } from 'react-view'; +import { EuiExpression } from '../../../../src/components/'; +import { + propUtilityForPlayground, + dummyFunction, +} from '../../services/playground'; + +export const expressionConfig = () => { + const docgenInfo = Array.isArray(EuiExpression.__docgenInfo) + ? EuiExpression.__docgenInfo[0] + : EuiExpression.__docgenInfo; + const propsToUse = propUtilityForPlayground(docgenInfo.props); + + propsToUse.value = { + ...propsToUse.value, + type: PropTypes.String, + value: '100', + }; + + propsToUse.onClick = { + ...propsToUse.onClick, + type: PropTypes.Custom, + value: undefined, + custom: { + ...propsToUse.onClick.custom, + use: 'switch', + label: 'Simulate', + }, + }; + + propsToUse.description = { + ...propsToUse.description, + type: PropTypes.String, + value: 'Is above', + }; + + propsToUse.descriptionWidth = { + ...propsToUse.descriptionWidth, + type: PropTypes.Number, + }; + + return { + config: { + componentName: 'EuiExpression', + props: propsToUse, + scope: { + EuiExpression, + }, + imports: { + '@elastic/eui': { + named: ['EuiExpression'], + }, + }, + customProps: { + onClick: dummyFunction, + }, + }, + }; +};