The main change here is using Dialog instead of dropdown. The dialog uses a fixed position, so when the underlying document dimensions change based on a font change, the dialog will still be positioned properly.
25 lines
816 B
TypeScript
25 lines
816 B
TypeScript
import { ComponentStory, ComponentMeta } from '@storybook/react'
|
|
import { Box } from '../components/elements/LayoutPrimitives'
|
|
import { ReaderSettingsControl } from '../components/templates/article/ReaderSettingsControl'
|
|
|
|
export default {
|
|
title: 'Components/ReaderSettingsControl',
|
|
component: ReaderSettingsControl,
|
|
argTypes: {
|
|
position: {
|
|
description: 'The ReaderSettingsControl component',
|
|
control: { type: 'select' },
|
|
},
|
|
},
|
|
} as ComponentMeta<typeof ReaderSettingsControl>
|
|
|
|
export const ReaderSettingsStory: ComponentStory<typeof ReaderSettingsControl> = (args: any) => {
|
|
return (
|
|
<div style={{ width: '245px', border: '2px solid black' }}>
|
|
<ReaderSettingsControl articleActionHandler={(action) => {
|
|
console.log('articleActionHandler')
|
|
}} />
|
|
</div>
|
|
)
|
|
}
|