Skip to content

Commit

Permalink
fix(*): edit storybook and docs tooltip
Browse files Browse the repository at this point in the history
  • Loading branch information
@iljs
iljs committed Dec 10, 2024
1 parent 765c0b7 commit 2ac8a82
Show file tree
Hide file tree
Showing 15 changed files with 342 additions and 268 deletions.
54 changes: 22 additions & 32 deletions packages/plasma-b2c/src/components/Tooltip/Tooltip.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,22 @@ const placements: Array<PopoverPlacement> = [
'auto',
];

const disabledProps = [
'target',
'children',
'text',
'opened',
'isOpen',
'isVisible',
'offset',
'frame',
'view',
'zIndex',
'minWidth',
'maxWidth',
'contentLeft',
'onDismiss',
];
const meta: Meta<TooltipProps> = {
title: 'Overlay/Tooltip',
decorators: [InSpacingDecorator],
Expand Down Expand Up @@ -80,28 +96,15 @@ export const Default: StoryObj<TooltipProps> = {
type: 'select',
},
},
...disableProps([
'target',
'children',
'text',
'opened',
'isOpen',
'isVisible',
'placement',
'offset',
'frame',
'view',
'zIndex',
'minWidth',
'maxWidth',
'contentLeft',
'onDismiss',
]),
...disableProps([...disabledProps, 'placement']),
},
args: {
size: 'm',
maxWidth: 10,
minWidth: 3,
hasArrow: true,
usePortal: false,
animated: true,
size: 'm',
},
render: (args) => <StoryDefault {...args} />,
};
Expand Down Expand Up @@ -155,20 +158,7 @@ export const Live: StoryObj<TooltipProps> = {
type: 'select',
},
},
...disableProps([
'target',
'children',
'text',
'opened',
'isOpen',
'isVisible',
'offset',
'frame',
'view',
'zIndex',
'contentLeft',
'onDismiss',
]),
...disableProps(disabledProps),
},
args: {
placement: 'bottom',
Expand Down
45 changes: 36 additions & 9 deletions packages/plasma-new-hope/src/examples/plasma_b2c/components/Tooltip/Tooltip.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React, { useState } from 'react';
import { styled } from '@linaria/react';
import type { StoryObj, Meta } from '@storybook/react';
import { disableProps } from '@salutejs/plasma-sb-utils';

import { WithTheme } from '../../../_helpers';
import { Button } from '../Button/Button';
Expand Down Expand Up @@ -30,6 +31,23 @@ const placements: Array<PopoverPlacement> = [
'auto',
];

const disabledProps = [
'target',
'children',
'text',
'opened',
'isOpen',
'isVisible',
'offset',
'frame',
'view',
'zIndex',
'minWidth',
'maxWidth',
'contentLeft',
'onDismiss',
];

const meta: Meta<TooltipProps> = {
title: 'b2c/Overlay/Tooltip',
decorators: [WithTheme],
Expand All @@ -48,23 +66,23 @@ const StyledGrid = styled.div`
padding: 3.5rem;
`;

const StoryDefault = ({ size }: TooltipProps) => {
const StoryDefault = (args: TooltipProps) => {
return (
<StyledGrid>
<Tooltip
target={
<Tooltip
target={<Button>Btn</Button>}
placement="left"
size={size}
{...args}
opened
hasArrow
text="left"
frame="theme-root"
/>
}
placement="top-start"
size={size}
{...args}
opened
hasArrow
text="top-start"
Expand All @@ -73,7 +91,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="top"
size={size}
{...args}
opened
hasArrow
text="top"
Expand All @@ -84,15 +102,15 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="right"
size={size}
{...args}
opened
hasArrow
text="right"
frame="theme-root"
/>
}
placement="top-end"
size={size}
{...args}
opened
hasArrow
text="top-end"
Expand All @@ -101,7 +119,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="bottom-start"
size={size}
{...args}
opened
hasArrow
text="bottom-start"
Expand All @@ -110,7 +128,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="bottom"
size={size}
{...args}
opened
hasArrow
text="bottom"
Expand All @@ -119,7 +137,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="bottom-end"
size={size}
{...args}
opened
hasArrow
text="bottom-end"
Expand All @@ -137,8 +155,14 @@ export const Default: StoryObj<TooltipProps> = {
type: 'select',
},
},
...disableProps([...disabledProps, 'placement']),
},
args: {
maxWidth: 10,
minWidth: 3,
hasArrow: true,
usePortal: false,
animated: true,
size: 'm',
},
render: (args) => <StoryDefault {...args} />,
Expand Down Expand Up @@ -193,12 +217,15 @@ export const Live: StoryObj<TooltipProps> = {
type: 'select',
},
},
...disableProps(disabledProps),
},
args: {
placement: 'bottom',
maxWidth: 10,
minWidth: 3,
hasArrow: true,
usePortal: false,
animated: true,
size: 'm',
},
render: (args) => <StoryLive {...args} />,
Expand Down
45 changes: 36 additions & 9 deletions packages/plasma-new-hope/src/examples/plasma_web/components/Tooltip/Tooltip.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React, { useState } from 'react';
import { styled } from '@linaria/react';
import type { StoryObj, Meta } from '@storybook/react';
import { disableProps } from '@salutejs/plasma-sb-utils';

import { WithTheme } from '../../../_helpers';
import { Button } from '../Button/Button';
Expand Down Expand Up @@ -30,6 +31,23 @@ const placements: Array<PopoverPlacement> = [
'auto',
];

const disabledProps = [
'target',
'children',
'text',
'opened',
'isOpen',
'isVisible',
'offset',
'frame',
'view',
'zIndex',
'minWidth',
'maxWidth',
'contentLeft',
'onDismiss',
];

const meta: Meta<TooltipProps> = {
title: 'web/Overlay/Tooltip',
decorators: [WithTheme],
Expand All @@ -48,23 +66,23 @@ const StyledGrid = styled.div`
padding: 3.5rem;
`;

const StoryDefault = ({ size }: TooltipProps) => {
const StoryDefault = (args: TooltipProps) => {
return (
<StyledGrid>
<Tooltip
target={
<Tooltip
target={<Button>Btn</Button>}
placement="left"
size={size}
{...args}
opened
hasArrow
text="left"
frame="theme-root"
/>
}
placement="top-start"
size={size}
{...args}
opened
hasArrow
text="top-start"
Expand All @@ -73,7 +91,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="top"
size={size}
{...args}
opened
hasArrow
text="top"
Expand All @@ -84,15 +102,15 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="right"
size={size}
{...args}
opened
hasArrow
text="right"
frame="theme-root"
/>
}
placement="top-end"
size={size}
{...args}
opened
hasArrow
text="top-end"
Expand All @@ -101,7 +119,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="bottom-start"
size={size}
{...args}
opened
hasArrow
text="bottom-start"
Expand All @@ -110,7 +128,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="bottom"
size={size}
{...args}
opened
hasArrow
text="bottom"
Expand All @@ -119,7 +137,7 @@ const StoryDefault = ({ size }: TooltipProps) => {
<Tooltip
target={<Button>Btn</Button>}
placement="bottom-end"
size={size}
{...args}
opened
hasArrow
text="bottom-end"
Expand All @@ -137,8 +155,14 @@ export const Default: StoryObj<TooltipProps> = {
type: 'select',
},
},
...disableProps([...disabledProps, 'placement']),
},
args: {
maxWidth: 10,
minWidth: 3,
hasArrow: true,
usePortal: false,
animated: true,
size: 'm',
},
render: (args) => <StoryDefault {...args} />,
Expand Down Expand Up @@ -193,12 +217,15 @@ export const Live: StoryObj<TooltipProps> = {
type: 'select',
},
},
...disableProps(disabledProps),
},
args: {
placement: 'bottom',
maxWidth: 10,
minWidth: 3,
hasArrow: true,
usePortal: false,
animated: true,
size: 'm',
},
render: (args) => <StoryLive {...args} />,
Expand Down
Loading

0 comments on commit 2ac8a82

Please sign in to comment.