From d5c42350bcea646d377f193f5c9c216d3846bbcd Mon Sep 17 00:00:00 2001 From: Anish Aggarwal Date: Tue, 4 Aug 2020 23:34:51 +0530 Subject: [PATCH 1/4] [Playground] EuiLink --- src-docs/src/views/link/link_example.js | 3 ++ src-docs/src/views/link/playground.js | 65 +++++++++++++++++++++++++ 2 files changed, 68 insertions(+) create mode 100644 src-docs/src/views/link/playground.js diff --git a/src-docs/src/views/link/link_example.js b/src-docs/src/views/link/link_example.js index fd2d1daa761..62ca51cf845 100644 --- a/src-docs/src/views/link/link_example.js +++ b/src-docs/src/views/link/link_example.js @@ -6,6 +6,8 @@ import { GuideSectionTypes } from '../../components'; import { EuiCode, EuiLink } from '../../../../src/components'; +import linkConfig from './playground'; + import Link from './link'; import { LinkDisable } from './link_disable'; @@ -76,4 +78,5 @@ export const LinkExample = { demo: , }, ], + playground: linkConfig, }; diff --git a/src-docs/src/views/link/playground.js b/src-docs/src/views/link/playground.js new file mode 100644 index 00000000000..17ded47d3b9 --- /dev/null +++ b/src-docs/src/views/link/playground.js @@ -0,0 +1,65 @@ +import { PropTypes } from 'react-view'; +import { EuiLink } from '../../../../src/components/'; +import { propUtilityForPlayground } from '../../services/playground'; +import * as t from '@babel/types'; + +export default () => { + const docgenInfo = Array.isArray(EuiLink.__docgenInfo) + ? EuiLink.__docgenInfo[0] + : EuiLink.__docgenInfo; + const propsToUse = propUtilityForPlayground(docgenInfo.props); + + propsToUse.href = { + type: PropTypes.String, + value: 'http://www.elastic.co', + }; + propsToUse.target = { + type: PropTypes.String, + value: '_blank', + }; + + propsToUse.children = { + value: 'Link', + type: PropTypes.String, + description: 'Link text.', + hidden: false, + }; + + propsToUse.onClick = { + ...propsToUse.onClick, + type: PropTypes.Custom, + value: undefined, + custom: { + ...propsToUse.onClick.custom, + use: 'switch', + label: 'Simulate', + }, + }; + return { + config: { + componentName: 'EuiLink', + props: propsToUse, + scope: { + EuiLink, + }, + imports: { + '@elastic/eui': { + named: ['EuiLink'], + }, + }, + customProps: { + onClick: { + generate: val => { + if (!val) return null; + const obj = t.arrowFunctionExpression( + [], + t.blockStatement([]), + false + ); + return obj; + }, + }, + }, + }, + }; +}; From 551dbf4aec1bb03482916107f3fdd5fb47d6d81c Mon Sep 17 00:00:00 2001 From: Anish Aggarwal Date: Wed, 5 Aug 2020 02:37:30 +0530 Subject: [PATCH 2/4] Update src-docs/src/views/link/playground.js Co-authored-by: Caroline Horn <549577+cchaos@users.noreply.github.com> --- src-docs/src/views/link/playground.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src-docs/src/views/link/playground.js b/src-docs/src/views/link/playground.js index 17ded47d3b9..d7110ec62ee 100644 --- a/src-docs/src/views/link/playground.js +++ b/src-docs/src/views/link/playground.js @@ -19,7 +19,7 @@ export default () => { }; propsToUse.children = { - value: 'Link', + value: 'Link to our website', type: PropTypes.String, description: 'Link text.', hidden: false, From 91326c36398279c1f2de941d67cd9f7d71080019 Mon Sep 17 00:00:00 2001 From: Anish Aggarwal Date: Wed, 5 Aug 2020 02:44:13 +0530 Subject: [PATCH 3/4] Update src-docs/src/views/link/playground.js Co-authored-by: Caroline Horn <549577+cchaos@users.noreply.github.com> --- src-docs/src/views/link/playground.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src-docs/src/views/link/playground.js b/src-docs/src/views/link/playground.js index d7110ec62ee..9f0715ce6b6 100644 --- a/src-docs/src/views/link/playground.js +++ b/src-docs/src/views/link/playground.js @@ -21,7 +21,6 @@ export default () => { propsToUse.children = { value: 'Link to our website', type: PropTypes.String, - description: 'Link text.', hidden: false, }; From 53126d14d1f9d3d183d6cd6e0789e66985d0a428 Mon Sep 17 00:00:00 2001 From: Anish Aggarwal Date: Wed, 5 Aug 2020 02:52:23 +0530 Subject: [PATCH 4/4] Dark background for ghost colour --- src-docs/src/views/link/playground.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src-docs/src/views/link/playground.js b/src-docs/src/views/link/playground.js index 9f0715ce6b6..8aa286ecd55 100644 --- a/src-docs/src/views/link/playground.js +++ b/src-docs/src/views/link/playground.js @@ -34,7 +34,13 @@ export default () => { label: 'Simulate', }, }; + + const setGhostBackground = { + color: 'ghost', + }; + return { + setGhostBackground, config: { componentName: 'EuiLink', props: propsToUse,