This is an automated email from the ASF dual-hosted git repository.
rusackas pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 7182a1b chore: Removes common storybook (#14418)
7182a1b is described below
commit 7182a1b390759f1ce7cea30a7dbac46d1538e0a6
Author: Michael S. Molina <[email protected]>
AuthorDate: Wed May 5 13:53:14 2021 -0300
chore: Removes common storybook (#14418)
---
.../src/common/components/common.stories.tsx | 134 ---------------------
.../components/CronPicker/CronPicker.stories.tsx | 88 ++++++++++++++
.../components/InfoTooltip/InfoTooltip.stories.tsx | 79 ++++++++++++
.../src/components/InfoTooltip/index.tsx | 2 +-
.../src/components/Modal/Modal.stories.tsx | 50 ++++++++
superset-frontend/src/components/Modal/Modal.tsx | 2 +-
6 files changed, 219 insertions(+), 136 deletions(-)
diff --git a/superset-frontend/src/common/components/common.stories.tsx
b/superset-frontend/src/common/components/common.stories.tsx
deleted file mode 100644
index 333d0e9..0000000
--- a/superset-frontend/src/common/components/common.stories.tsx
+++ /dev/null
@@ -1,134 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import React, { useState, useRef, useCallback } from 'react';
-import { action } from '@storybook/addon-actions';
-import { withKnobs } from '@storybook/addon-knobs';
-import { CronPicker, CronError } from 'src/components/CronPicker';
-import Modal from 'src/components/Modal';
-import InfoTooltip from 'src/components/InfoTooltip';
-import { Input, Divider } from '.';
-
-export default {
- title: 'Common components',
- decorators: [withKnobs],
-};
-
-export const StyledModal = () => (
- <Modal
- disablePrimaryButton={false}
- onHandledPrimaryAction={action('Primary action')}
- primaryButtonName="Danger"
- primaryButtonType="danger"
- show
- onHide={action('hidden')}
- title="I'm a modal!"
- >
- <div>hi!</div>
- </Modal>
-);
-
-export const StyledInfoTooltip = (args: any) => {
- const styles = {
- padding: '100px 0 0 200px',
- };
-
- return (
- <div style={styles}>
- <InfoTooltip tooltip="This is the text that will display!" {...args} />
- </div>
- );
-};
-
-StyledInfoTooltip.args = {
- placement: 'right',
- trigger: 'hover',
-};
-
-StyledInfoTooltip.argTypes = {
- placement: {
- name: 'Placement',
- control: {
- type: 'select',
- options: [
- 'bottom',
- 'left',
- 'right',
- 'top',
- 'topLeft',
- 'topRight',
- 'bottomLeft',
- 'bottomRight',
- 'leftTop',
- 'leftBottom',
- 'rightTop',
- 'rightBottom',
- ],
- },
- },
-
- trigger: {
- name: 'Trigger',
- control: {
- type: 'select',
- options: ['hover', 'click'],
- },
- },
-};
-
-export function StyledCronPicker() {
- // @ts-ignore
- const inputRef = useRef<Input>(null);
- const defaultValue = '30 5 * * 1,6';
- const [value, setValue] = useState(defaultValue);
- const customSetValue = useCallback(
- (newValue: string) => {
- setValue(newValue);
- inputRef.current?.setValue(newValue);
- },
- [inputRef],
- );
- const [error, onError] = useState<CronError>();
-
- return (
- <div>
- <Input
- ref={inputRef}
- onBlur={event => {
- setValue(event.target.value);
- }}
- onPressEnter={() => {
- setValue(inputRef.current?.input.value || '');
- }}
- />
-
- <Divider />
-
- <CronPicker
- clearButton={false}
- value={value}
- setValue={customSetValue}
- onError={onError}
- />
-
- <p style={{ marginTop: 20 }}>
- Error: {error ? error.description : 'undefined'}
- </p>
- </div>
- );
-}
diff --git a/superset-frontend/src/components/CronPicker/CronPicker.stories.tsx
b/superset-frontend/src/components/CronPicker/CronPicker.stories.tsx
new file mode 100644
index 0000000..7f89936
--- /dev/null
+++ b/superset-frontend/src/components/CronPicker/CronPicker.stories.tsx
@@ -0,0 +1,88 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React, { useState, useRef, useCallback } from 'react';
+import { Input, Divider } from 'src/common/components';
+import { CronPicker, CronError, CronProps } from '.';
+
+export default {
+ title: 'CronPicker',
+ component: CronPicker,
+};
+
+export const InteractiveCronPicker = (props: CronProps) => {
+ // @ts-ignore
+ const inputRef = useRef<Input>(null);
+ const [value, setValue] = useState(props.value);
+ const customSetValue = useCallback(
+ (newValue: string) => {
+ setValue(newValue);
+ inputRef.current?.setValue(newValue);
+ },
+ [inputRef],
+ );
+ const [error, onError] = useState<CronError>();
+
+ return (
+ <div>
+ <Input
+ ref={inputRef}
+ onBlur={event => {
+ setValue(event.target.value);
+ }}
+ onChange={e => setValue(e.target.value || '')}
+ />
+ <Divider />
+ <CronPicker
+ {...props}
+ value={value}
+ setValue={customSetValue}
+ onError={onError}
+ />
+ {error && <p style={{ marginTop: 20 }}>Error: {error.description}</p>}
+ </div>
+ );
+};
+
+InteractiveCronPicker.args = {
+ clearButton: false,
+ disabled: false,
+ readOnly: false,
+};
+
+InteractiveCronPicker.argTypes = {
+ value: {
+ defaultValue: '30 5 * * *',
+ table: {
+ disable: true,
+ },
+ },
+ theme: {
+ table: {
+ disable: true,
+ },
+ },
+};
+
+InteractiveCronPicker.story = {
+ parameters: {
+ knobs: {
+ disable: true,
+ },
+ },
+};
diff --git
a/superset-frontend/src/components/InfoTooltip/InfoTooltip.stories.tsx
b/superset-frontend/src/components/InfoTooltip/InfoTooltip.stories.tsx
new file mode 100644
index 0000000..d7c8196
--- /dev/null
+++ b/superset-frontend/src/components/InfoTooltip/InfoTooltip.stories.tsx
@@ -0,0 +1,79 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from 'react';
+import InfoTooltip, { InfoTooltipProps } from 'src/components/InfoTooltip';
+
+export default {
+ title: 'InfoTooltip',
+ component: InfoTooltip,
+};
+
+export const InteractiveInfoTooltip = (props: InfoTooltipProps) => {
+ const styles = {
+ padding: '100px 0 0 200px',
+ };
+
+ return (
+ <div style={styles}>
+ <InfoTooltip {...props} />
+ </div>
+ );
+};
+
+InteractiveInfoTooltip.args = {
+ tooltip: 'This is the text that will display!',
+};
+
+InteractiveInfoTooltip.argTypes = {
+ placement: {
+ defaultValue: 'top',
+ control: {
+ type: 'select',
+ options: [
+ 'bottom',
+ 'left',
+ 'right',
+ 'top',
+ 'topLeft',
+ 'topRight',
+ 'bottomLeft',
+ 'bottomRight',
+ 'leftTop',
+ 'leftBottom',
+ 'rightTop',
+ 'rightBottom',
+ ],
+ },
+ },
+ trigger: {
+ defaultValue: 'hover',
+ control: {
+ type: 'select',
+ options: ['hover', 'click'],
+ },
+ },
+};
+
+InteractiveInfoTooltip.story = {
+ parameters: {
+ knobs: {
+ disable: true,
+ },
+ },
+};
diff --git a/superset-frontend/src/components/InfoTooltip/index.tsx
b/superset-frontend/src/components/InfoTooltip/index.tsx
index 7091cd9..b355859 100644
--- a/superset-frontend/src/components/InfoTooltip/index.tsx
+++ b/superset-frontend/src/components/InfoTooltip/index.tsx
@@ -22,7 +22,7 @@ import { styled } from '@superset-ui/core';
import { Tooltip } from 'src/components/Tooltip';
import Icon from 'src/components/Icon';
-interface InfoTooltipProps {
+export interface InfoTooltipProps {
className?: string;
tooltip: string;
placement?:
diff --git a/superset-frontend/src/components/Modal/Modal.stories.tsx
b/superset-frontend/src/components/Modal/Modal.stories.tsx
new file mode 100644
index 0000000..4a7b06e
--- /dev/null
+++ b/superset-frontend/src/components/Modal/Modal.stories.tsx
@@ -0,0 +1,50 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from 'react';
+import Modal, { ModalProps } from '.';
+
+export default {
+ title: 'Modal',
+ component: Modal,
+};
+
+export const InteractiveModal = (props: ModalProps) => (
+ <Modal {...props}>Hi</Modal>
+);
+
+InteractiveModal.args = {
+ disablePrimaryButton: false,
+ primaryButtonName: 'Danger',
+ primaryButtonType: 'danger',
+ show: true,
+ title: "I'm a modal!",
+};
+
+InteractiveModal.argTypes = {
+ onHandledPrimaryAction: { action: 'onHandledPrimaryAction' },
+ onHide: { action: 'onHide' },
+};
+
+InteractiveModal.story = {
+ parameters: {
+ knobs: {
+ disable: true,
+ },
+ },
+};
diff --git a/superset-frontend/src/components/Modal/Modal.tsx
b/superset-frontend/src/components/Modal/Modal.tsx
index 5421f0a..661d216 100644
--- a/superset-frontend/src/components/Modal/Modal.tsx
+++ b/superset-frontend/src/components/Modal/Modal.tsx
@@ -23,7 +23,7 @@ import { css } from '@emotion/react';
import { Modal as BaseModal } from 'src/common/components';
import Button from 'src/components/Button';
-interface ModalProps {
+export interface ModalProps {
className?: string;
children: React.ReactNode;
disablePrimaryButton?: boolean;
