@opengeoweb/theme 10.0.0 → 10.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/README.md +1 -2
  2. package/index.esm.js +52 -8
  3. package/package.json +1 -1
  4. package/src/lib/components/Storybook/index.d.ts +1 -0
  5. package/src/lib/stories/Accordion.stories.d.ts +5 -11
  6. package/src/lib/stories/Avatar.stories.d.ts +5 -23
  7. package/src/lib/stories/Backdrop.stories.d.ts +5 -10
  8. package/src/lib/stories/Breakpoints.stories.d.ts +4 -10
  9. package/src/lib/stories/Button.stories.d.ts +5 -23
  10. package/src/lib/stories/Card.stories.d.ts +5 -23
  11. package/src/lib/stories/Colors.stories.d.ts +5 -25
  12. package/src/lib/stories/Elevation.stories.d.ts +5 -26
  13. package/src/lib/stories/FormElements.stories.d.ts +5 -23
  14. package/src/lib/stories/IconButton.stories.d.ts +5 -23
  15. package/src/lib/stories/Icons.stories.d.ts +5 -10
  16. package/src/lib/stories/List.stories.d.ts +5 -23
  17. package/src/lib/stories/MenuItem.stories.d.ts +5 -23
  18. package/src/lib/stories/Select.stories.d.ts +5 -23
  19. package/src/lib/stories/Slider.stories.d.ts +5 -23
  20. package/src/lib/stories/Snackbar.stories.d.ts +5 -23
  21. package/src/lib/stories/Switch.stories.d.ts +5 -23
  22. package/src/lib/stories/Table.stories.d.ts +5 -25
  23. package/src/lib/stories/Tabs.stories.d.ts +5 -23
  24. package/src/lib/stories/TextField.stories.d.ts +5 -23
  25. package/src/lib/stories/ToggleButton.stories.d.ts +5 -23
  26. package/src/lib/stories/Tooltip.stories.d.ts +5 -23
  27. package/src/lib/stories/Typography.stories.d.ts +5 -23
  28. package/src/lib/types.d.ts +6 -0
  29. package/src/lib/stories/StoryWrapper.d.ts +0 -7
  30. /package/src/lib/{stories → components/Storybook}/StoryHeader.d.ts +0 -0
package/README.md CHANGED
@@ -226,7 +226,6 @@ export const TableDark = (): React.ReactElement => (
226
226
  // lib/components/Theme/ThemeContext.tsx
227
227
 
228
228
  // lib/stories
229
- // lib/stories/StoryWrapper.tsx
230
229
  // lib/stories/story.stories.tsx
231
230
  ```
232
231
 
@@ -319,7 +318,7 @@ If there are mistakes in naming, colors are missing in the Design, contact [Didi
319
318
 
320
319
  ## Theme Stories `(lib/stories)`
321
320
 
322
- Contains demo stories with MUI components. Every story is build with the `StoryWrapper` component and can be toggled from light to dark theme. It does not export anything, it only shows the MUI components in light or dark theme.
321
+ Contains demo stories with MUI components. Every story is wrapped with a decorator defined in `libs/theme/.storybook/preview.js` component and can be toggled from light to dark theme. It does not export anything, it only shows the MUI components in light or dark theme.
323
322
 
324
323
  - The **Color** story shows all the colors, styles and other properties of the defined theme. Could be handy for reviewing styling values. On the right the `geowebColor` object is shown, and these values are accessible throughout all components with the ThemeProvider wrapper. Not that more values are shown than given, this is because of the parsers that adds in some cases extra properties as for example `rgba`
325
324
  - The **Elevation** shows all elevations we currently have. These can be used for defining `box-shadow` for elements. If you want to use the elevation in code:
package/index.esm.js CHANGED
@@ -2398,10 +2398,10 @@ var colors$2 = {
2398
2398
  cards: {
2399
2399
  cardContainer: '#FFFFFF',
2400
2400
  cardContainerBorder: '#EEEEEE',
2401
- cardContainerMouseOver: '#D8E4F9',
2401
+ cardContainerMouseOver: '#EFF5FF',
2402
2402
  cardContainerDisabled: '#EBEBEB',
2403
2403
  cardContainerDisabledBorder: '#E3E2E2',
2404
- cardContainerDisabledMouseOver: '#D8E4F9'
2404
+ cardContainerDisabledMouseOver: '#EFF5FF'
2405
2405
  },
2406
2406
  backdrops: {
2407
2407
  black: {
@@ -2695,6 +2695,28 @@ var colors$2 = {
2695
2695
  fill: '#7BACFF',
2696
2696
  opacity: 0.2
2697
2697
  }
2698
+ },
2699
+ chip: {
2700
+ highlightDefault: {
2701
+ fill: '#FFA800',
2702
+ opacity: 0.15,
2703
+ borderColor: '#374061'
2704
+ },
2705
+ highlightDefaultMouseOver: {
2706
+ fill: '#DEDBD4',
2707
+ opacity: 1,
2708
+ borderColor: '#374061'
2709
+ },
2710
+ highlightActiveDefault: {
2711
+ fill: '#566F94',
2712
+ opacity: 1,
2713
+ borderColor: 'transparent'
2714
+ },
2715
+ highlightActiveMouseOver: {
2716
+ fill: '#345596',
2717
+ opacity: 1,
2718
+ borderColor: 'transparent'
2719
+ }
2698
2720
  }
2699
2721
  };
2700
2722
  // https://app.zeplin.io/project/5ecf84a3c6ae1047a368f393/screen/609bb6a5287bd1abe0de39a7
@@ -3707,10 +3729,10 @@ var colors$1 = {
3707
3729
  cards: {
3708
3730
  cardContainer: '#313131',
3709
3731
  cardContainerBorder: '#404040',
3710
- cardContainerMouseOver: '#45556F',
3732
+ cardContainerMouseOver: '#414751',
3711
3733
  cardContainerDisabled: '#252525',
3712
3734
  cardContainerDisabledBorder: '#363636',
3713
- cardContainerDisabledMouseOver: '#45556F'
3735
+ cardContainerDisabledMouseOver: '#414751'
3714
3736
  },
3715
3737
  backdrops: {
3716
3738
  black: {
@@ -4005,6 +4027,28 @@ var colors$1 = {
4005
4027
  fill: '#7BACFF',
4006
4028
  opacity: 0.2
4007
4029
  }
4030
+ },
4031
+ chip: {
4032
+ highlightDefault: {
4033
+ fill: '#FFA800',
4034
+ opacity: 0.15,
4035
+ borderColor: '#F8F9F9'
4036
+ },
4037
+ highlightDefaultMouseOver: {
4038
+ fill: '#DEDBD4',
4039
+ opacity: 1,
4040
+ borderColor: '#F8F9F9'
4041
+ },
4042
+ highlightActiveDefault: {
4043
+ fill: '#566F94',
4044
+ opacity: 1,
4045
+ borderColor: 'transparent'
4046
+ },
4047
+ highlightActiveMouseOver: {
4048
+ fill: '#345596',
4049
+ opacity: 1,
4050
+ borderColor: 'transparent'
4051
+ }
4008
4052
  }
4009
4053
  };
4010
4054
  // https://app.zeplin.io/project/5ecf84a3c6ae1047a368f393/screen/6093e694124ecf3886de76d4
@@ -4042,7 +4086,7 @@ var focusButtonStyle = {
4042
4086
  outline: 'solid 2px #FFFFFF'
4043
4087
  };
4044
4088
  // https://app.zeplin.io/project/5ecf84a3c6ae1047a368f393/screen/6093e5dc12278e35d433aa2d
4045
- var colors = {
4089
+ var colors = Object.assign({}, colors$2, {
4046
4090
  background: {
4047
4091
  surface: '#9e1f1e',
4048
4092
  surfaceApp: '#740c16',
@@ -4386,10 +4430,10 @@ var colors = {
4386
4430
  cards: {
4387
4431
  cardContainer: '#311c1c',
4388
4432
  cardContainerBorder: '#404040',
4389
- cardContainerMouseOver: '#033E1A',
4433
+ cardContainerMouseOver: '#045725',
4390
4434
  cardContainerDisabled: '#252525',
4391
4435
  cardContainerDisabledBorder: '#363636',
4392
- cardContainerDisabledMouseOver: '#45556F'
4436
+ cardContainerDisabledMouseOver: '#045725'
4393
4437
  },
4394
4438
  backdrops: {
4395
4439
  black: {
@@ -4712,7 +4756,7 @@ var colors = {
4712
4756
  backgroundColor: 'rgba(0, 35, 65, 0.95)',
4713
4757
  backgroundRepeat: 'no-repeat'
4714
4758
  }
4715
- };
4759
+ });
4716
4760
  // https://app.zeplin.io/project/5ecf84a3c6ae1047a368f393/screen/6093e694124ecf3886de76d4
4717
4761
  var elevations = {
4718
4762
  elevation_01: '0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14)',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opengeoweb/theme",
3
- "version": "10.0.0",
3
+ "version": "10.2.0",
4
4
  "description": "GeoWeb Theme library for the opengeoweb project",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
@@ -0,0 +1 @@
1
+ export * from './StoryHeader';
@@ -1,15 +1,9 @@
1
- import * as React from 'react';
1
+ import { Accordion as MuiAccordion } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiAccordion>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const AccordionLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- };
11
- export declare const AccordionDark: {
12
- (): React.ReactElement;
13
- storyName: string;
14
- tags: string[];
15
- };
8
+ export declare const AccordionLight: Story;
9
+ export declare const AccordionDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Avatar as MuiAvatar } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiAvatar>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const AvatarLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const AvatarDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const AvatarLight: Story;
9
+ export declare const AvatarDark: Story;
@@ -1,16 +1,11 @@
1
1
  import * as React from 'react';
2
+ import { Backdrop as MuiBackdrop } from '@mui/material';
3
+ import type { StoryObj } from '@storybook/react';
4
+ type Story = StoryObj<typeof MuiBackdrop>;
2
5
  declare const _default: {
3
6
  title: string;
4
7
  };
5
8
  export default _default;
6
9
  export declare const BackDropDemo: () => React.ReactElement;
7
- export declare const BackDropLight: {
8
- (): React.ReactElement;
9
- storyName: string;
10
- tags: string[];
11
- };
12
- export declare const BackDropDark: {
13
- (): React.ReactElement;
14
- storyName: string;
15
- tags: string[];
16
- };
10
+ export declare const BackDropLight: Story;
11
+ export declare const BackDropDark: Story;
@@ -1,14 +1,8 @@
1
- import * as React from 'react';
1
+ import type { StoryObj } from '@storybook/react';
2
+ import { breakpoints } from '../utils/createTheme';
3
+ type Story = StoryObj<typeof breakpoints>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const Breakpoints: {
7
- (): React.ReactElement;
8
- parameters: {
9
- zeplinLink: {
10
- name: string;
11
- link: string;
12
- }[];
13
- };
14
- };
8
+ export declare const Breakpoints: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Button } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof Button>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const ButtonLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const ButtonDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const ButtonLight: Story;
9
+ export declare const ButtonDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Card } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof Card>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const CardsLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const CardsDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const CardsLight: Story;
9
+ export declare const CardsDark: Story;
@@ -1,29 +1,9 @@
1
- import * as React from 'react';
1
+ import { Typography } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof Typography>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const ColorsLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- layout: string;
16
- };
17
- };
18
- export declare const ColorsDark: {
19
- (): React.ReactElement;
20
- storyName: string;
21
- tags: string[];
22
- parameters: {
23
- zeplinkLink: {
24
- name: string;
25
- link: string;
26
- }[];
27
- layout: string;
28
- };
29
- };
8
+ export declare const ColorsLight: Story;
9
+ export declare const ColorsDark: Story;
@@ -1,30 +1,9 @@
1
- import * as React from 'react';
1
+ import { Typography } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof Typography>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const ElevationDemo: React.FC;
7
- export declare const ElevationLight: {
8
- (): React.ReactElement;
9
- parameters: {
10
- zeplinLink: {
11
- name: string;
12
- link: string;
13
- }[];
14
- layout: string;
15
- };
16
- storyName: string;
17
- tags: string[];
18
- };
19
- export declare const ElevationDark: {
20
- (): React.ReactElement;
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- layout: string;
27
- };
28
- storyName: string;
29
- tags: string[];
30
- };
8
+ export declare const ElevationLight: Story;
9
+ export declare const ElevationDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Box } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof Box>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const FormElementsLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const FormElementsDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const FormElementsLight: Story;
9
+ export declare const FormElementsDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { IconButton } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof IconButton>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const IconButtonLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const IconButtonDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const IconButtonLight: Story;
9
+ export declare const IconButtonDark: Story;
@@ -1,4 +1,7 @@
1
1
  import React from 'react';
2
+ import type { StoryObj } from '@storybook/react';
3
+ import * as IconList from '../components/Icons';
4
+ type Story = StoryObj<typeof IconList>;
2
5
  declare const _default: {
3
6
  title: string;
4
7
  };
@@ -7,13 +10,5 @@ export interface IconGridItemProps {
7
10
  name: string;
8
11
  icon: React.ReactNode;
9
12
  }
10
- export declare const IconsLight: {
11
- (): React.ReactElement;
12
- storyName: string;
13
- tags: string[];
14
- };
15
- export declare const IconsDark: {
16
- (): React.ReactElement;
17
- storyName: string;
18
- tags: string[];
19
- };
13
+ export declare const IconsLight: Story;
14
+ export declare const IconsDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { List as MuiList } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiList>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const ListLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const ListDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const ListLight: Story;
9
+ export declare const ListDark: Story;
@@ -1,28 +1,10 @@
1
- import * as React from 'react';
1
+ import { MenuItem as MuiMenuItem } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiMenuItem>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  tags: string[];
5
7
  };
6
8
  export default _default;
7
- export declare const MenuItemLight: {
8
- (): React.ReactElement;
9
- storyName: string;
10
- tags: string[];
11
- parameters: {
12
- zeplinLink: {
13
- name: string;
14
- link: string;
15
- }[];
16
- };
17
- };
18
- export declare const MenuItemDark: {
19
- (): React.ReactElement;
20
- storyName: string;
21
- tags: string[];
22
- parameters: {
23
- zeplinLink: {
24
- name: string;
25
- link: string;
26
- }[];
27
- };
28
- };
9
+ export declare const MenuItemLight: Story;
10
+ export declare const MenuItemDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Select as MuiSelect } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiSelect>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const SelectLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const SelectDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const SelectLight: Story;
9
+ export declare const SelectDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Slider as MuiSlider } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiSlider>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const SliderLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const SliderDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const SliderLight: Story;
9
+ export declare const SliderDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Snackbar as MuiSnackbar } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiSnackbar>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const SnackbarLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const SnackbarDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const SnackbarLight: Story;
9
+ export declare const SnackbarDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Switch as MuiSwitch } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiSwitch>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const SwitchLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const SwitchDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const SwitchLight: Story;
9
+ export declare const SwitchDark: Story;
@@ -1,4 +1,6 @@
1
- import * as React from 'react';
1
+ import { Table as MuiTable } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiTable>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
@@ -10,27 +12,5 @@ export interface ExampleRow {
10
12
  carbs: number;
11
13
  protein: number;
12
14
  }
13
- export declare const TableLight: {
14
- (): React.ReactElement;
15
- storyName: string;
16
- tags: string[];
17
- parameters: {
18
- zeplinLink: {
19
- name: string;
20
- link: string;
21
- }[];
22
- layout: string;
23
- };
24
- };
25
- export declare const TableDark: {
26
- (): React.ReactElement;
27
- storyName: string;
28
- tags: string[];
29
- parameters: {
30
- zeplinLink: {
31
- name: string;
32
- link: string;
33
- }[];
34
- layout: string;
35
- };
36
- };
15
+ export declare const TableLight: Story;
16
+ export declare const TableDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Tabs as MuiTabs } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiTabs>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const TabsLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const TabsDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const TabsLight: Story;
9
+ export declare const TabsDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { TextField as MuiTextField } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiTextField>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const TextFieldLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const TextFieldDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const TextFieldLight: Story;
9
+ export declare const TextFieldDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { ToggleButton } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof ToggleButton>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const ToggleButtonsLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const ToggleButtonsDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const ToggleButtonsLight: Story;
9
+ export declare const ToggleButtonsDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Tooltip } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof Tooltip>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const TooltipLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const TooltipDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const TooltipLight: Story;
9
+ export declare const TooltipDark: Story;
@@ -1,27 +1,9 @@
1
- import * as React from 'react';
1
+ import { Typography as MuiTypography } from '@mui/material';
2
+ import type { StoryObj } from '@storybook/react';
3
+ type Story = StoryObj<typeof MuiTypography>;
2
4
  declare const _default: {
3
5
  title: string;
4
6
  };
5
7
  export default _default;
6
- export declare const TypographyLight: {
7
- (): React.ReactElement;
8
- storyName: string;
9
- tags: string[];
10
- parameters: {
11
- zeplinLink: {
12
- name: string;
13
- link: string;
14
- }[];
15
- };
16
- };
17
- export declare const TypographyDark: {
18
- (): React.ReactElement;
19
- storyName: string;
20
- tags: string[];
21
- parameters: {
22
- zeplinLink: {
23
- name: string;
24
- link: string;
25
- }[];
26
- };
27
- };
8
+ export declare const TypographyLight: Story;
9
+ export declare const TypographyDark: Story;
@@ -211,6 +211,12 @@ export interface GeowebColorPalette {
211
211
  festoonOverlay?: CSSProperties;
212
212
  festoonContainer?: CSSProperties;
213
213
  festoonBackdrop?: CSSProperties;
214
+ chip: {
215
+ highlightDefault: CSSProperties;
216
+ highlightDefaultMouseOver: CSSProperties;
217
+ highlightActiveDefault: CSSProperties;
218
+ highlightActiveMouseOver: CSSProperties;
219
+ };
214
220
  }
215
221
  export type Elevations = Record<string, string>;
216
222
  declare module '@mui/material/styles' {
@@ -1,7 +0,0 @@
1
- import * as React from 'react';
2
- interface StoryLayoutProps {
3
- children: React.ReactNode;
4
- isDarkTheme?: boolean;
5
- }
6
- export declare const StoryWrapper: React.FC<StoryLayoutProps>;
7
- export {};