mirror of
https://github.com/hanzoai/cd-ui.git
synced 2026-10-30 20:42:45 +00:00
Anton GilgurandGitHub
d1f1d4496b
* chore(storybook): update v1 syntax to use Storybook v6
- while the deps used Storybook v6, the configuration and stories themselves were still on a legacy v5 format
- v6 had backward compat for v5, but v7 does not, so this needs upgrading/migrating
- or well, v7 has some legacy mode for it that can be enabled with some config, but it is entirely gone in v8
- migrate `storiesOf` to CSF per https://storybook.js.org/docs/7/migration-guide#storiesof-to-csf
- then had to do a bunch of manual changes to get back mostly the same previous indentation (with some minor differences where there were mistakes or inconsistencies)
- tried to keep the diff as small as possible
- CSF is still valid through to latest v8
Signed-off-by: Anton Gilgur <[email protected]>
* chore(storybook): convert v1 config to use Storybook v6
- modified version of v2's config
Signed-off-by: Anton Gilgur <[email protected]>
* fixup config a bit -- take more from prev webpack config
- `ts-loader` is necessary to handle the `import type` syntax
- custom `tsconfig.json` doesn't seem necessary though
- use same SASS config
- plain CSS config not needed though bc PostCSS already runs by default
Signed-off-by: Anton Gilgur <[email protected]>
* rename to `.stories.tsx` and remove `index`
- the conventional format
- also had some problems finding stories without this change
Signed-off-by: Anton Gilgur <[email protected]>
* fix deprecation warning re: `storyName`
- per https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#hoisted-csf-annotations
- migrate `.story.name` -> `.storyName`
- not sure why the automigration didn't do this and instead used the deprecated name 😕
Signed-off-by: Anton Gilgur <[email protected]>
* also fix history deprecation warning
Signed-off-by: Anton Gilgur <[email protected]>
* attempt to load CSS properly but still fail
Signed-off-by: Anton Gilgur <[email protected]>
* improve perf with built in loader for TS
- remove `ts-loader` as not necessary
- plus some settings for Storybook's TS loader preset
Signed-off-by: Anton Gilgur <[email protected]>
* diff reduction
Signed-off-by: Anton Gilgur <[email protected]>
* more diff reduction
Signed-off-by: Anton Gilgur <[email protected]>
* more diff reduction
Signed-off-by: Anton Gilgur <[email protected]>
* attempt to reduce diff a bit more hackily
Signed-off-by: Anton Gilgur <[email protected]>
* one more diff reduction with one hackishness
Signed-off-by: Anton Gilgur <[email protected]>
* diff reduction with older wacky syntax
Signed-off-by: Anton Gilgur <[email protected]>
* slightly better syntax than previous while retaining indentation
Signed-off-by: Anton Gilgur <[email protected]>
* last diff reduction/indentation change
Signed-off-by: Anton Gilgur <[email protected]>
* missing trailing comma
Signed-off-by: Anton Gilgur <[email protected]>
---------
Signed-off-by: Anton Gilgur <[email protected]>
34 lines
895 B
TypeScript
34 lines
895 B
TypeScript
import * as React from 'react';
|
|
|
|
import { DropDown } from '../src/components/dropdown/dropdown';
|
|
import { DropDownMenu } from '../src/components/dropdown-menu';
|
|
|
|
export default {
|
|
title: 'Dropdown',
|
|
};
|
|
|
|
export const Default = () => (<DropDown anchor={() => <a>Click me</a>}><p>Dropdown content here</p></DropDown>);
|
|
Default.storyName = 'default';
|
|
|
|
export const Menu = () => {
|
|
return (
|
|
<DropDown isMenu={true} anchor={() => <a>Click me</a>}>
|
|
<ul>
|
|
<li><a>menu item 1</a></li>
|
|
<li><a>menu item 2</a></li>
|
|
</ul>
|
|
</DropDown>
|
|
);
|
|
}
|
|
Menu.storyName = 'menu';
|
|
|
|
export const MenuWrapper = () => {
|
|
return (
|
|
<DropDownMenu anchor={() => <a>Click me</a>} items={[{
|
|
title: 'menu item 1',
|
|
action: () => window.alert('Clicked!'),
|
|
}]} />
|
|
);
|
|
}
|
|
MenuWrapper.storyName = 'menu wrapper';
|