@dtdot/lego 0.18.6 → 0.18.9

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 (89) hide show
  1. package/build/components/Button/Button.component.d.ts +1 -1
  2. package/build/components/Button/Button.component.js +1 -1
  3. package/build/index.d.ts +2 -0
  4. package/build/index.js +2 -0
  5. package/build/theme/providers/DarkTheme.provider.d.ts +6 -0
  6. package/build/theme/providers/DarkTheme.provider.js +8 -0
  7. package/build/theme/providers/DefaultTheme.provider.d.ts +6 -0
  8. package/build/theme/providers/DefaultTheme.provider.js +8 -0
  9. package/package.json +1 -1
  10. package/build/components/ActionMenu/ActionMenu.stories.d.ts +0 -6
  11. package/build/components/ActionMenu/ActionMenu.stories.js +0 -48
  12. package/build/components/ActionMessage/ActionMessage.stories.d.ts +0 -6
  13. package/build/components/ActionMessage/ActionMessage.stories.js +0 -19
  14. package/build/components/Alert/Alert.stories.d.ts +0 -8
  15. package/build/components/Alert/Alert.stories.js +0 -21
  16. package/build/components/Badge/Badge.stories.d.ts +0 -5
  17. package/build/components/Badge/Badge.stories.js +0 -18
  18. package/build/components/BadgeSelector/BadgeSelector.stories.d.ts +0 -6
  19. package/build/components/BadgeSelector/BadgeSelector.stories.js +0 -94
  20. package/build/components/Button/Button.stories.d.ts +0 -7
  21. package/build/components/Button/Button.stories.js +0 -27
  22. package/build/components/ButtonGroup/ButtonGroup.stories.d.ts +0 -8
  23. package/build/components/ButtonGroup/ButtonGroup.stories.js +0 -20
  24. package/build/components/Card/Card.stories.d.ts +0 -9
  25. package/build/components/Card/Card.stories.js +0 -84
  26. package/build/components/Checklist/Checklist.stories.d.ts +0 -5
  27. package/build/components/Checklist/Checklist.stories.js +0 -42
  28. package/build/components/ControlGroup/ControlGroup.stories.d.ts +0 -7
  29. package/build/components/ControlGroup/ControlGroup.stories.js +0 -24
  30. package/build/components/FancyCheckbox/FancyCheckbox.stories.d.ts +0 -5
  31. package/build/components/FancyCheckbox/FancyCheckbox.stories.js +0 -29
  32. package/build/components/Form/Form.stories.d.ts +0 -5
  33. package/build/components/Form/Form.stories.js +0 -21
  34. package/build/components/Heading/Heading.stories.d.ts +0 -7
  35. package/build/components/Heading/Heading.stories.js +0 -9
  36. package/build/components/ImageUpload/ImageUpload.stories.d.ts +0 -8
  37. package/build/components/ImageUpload/ImageUpload.stories.js +0 -49
  38. package/build/components/InlineCard/InlineCard.stories.d.ts +0 -7
  39. package/build/components/InlineCard/InlineCard.stories.js +0 -52
  40. package/build/components/Input/Input.stories.d.ts +0 -7
  41. package/build/components/Input/Input.stories.js +0 -28
  42. package/build/components/LiveInput/LiveInput.stories.d.ts +0 -6
  43. package/build/components/LiveInput/LiveInput.stories.js +0 -12
  44. package/build/components/LiveList/LiveList.stories.d.ts +0 -8
  45. package/build/components/LiveList/LiveList.stories.js +0 -57
  46. package/build/components/Loader/Loader.stories.d.ts +0 -5
  47. package/build/components/Loader/Loader.stories.js +0 -9
  48. package/build/components/Menu/Menu.stories.d.ts +0 -7
  49. package/build/components/Menu/Menu.stories.js +0 -95
  50. package/build/components/MinimalMenu/MinimalMenu.stories.d.ts +0 -5
  51. package/build/components/MinimalMenu/MinimalMenu.stories.js +0 -46
  52. package/build/components/Modal/Modal.stories.d.ts +0 -6
  53. package/build/components/Modal/Modal.stories.js +0 -55
  54. package/build/components/Notification/Notification.stories.d.ts +0 -8
  55. package/build/components/Notification/Notification.stories.js +0 -28
  56. package/build/components/Notifications/Notifications.stories.d.ts +0 -7
  57. package/build/components/Notifications/Notifications.stories.js +0 -96
  58. package/build/components/PageHeader/PageHeader.stories.d.ts +0 -6
  59. package/build/components/PageHeader/PageHeader.stories.js +0 -13
  60. package/build/components/ProfileImage/ProfileImage.stories.d.ts +0 -6
  61. package/build/components/ProfileImage/ProfileImage.stories.js +0 -8
  62. package/build/components/QrCode/QrCode.stories.d.ts +0 -5
  63. package/build/components/QrCode/QrCode.stories.js +0 -8
  64. package/build/components/SquareButton/SquareButton.stories.d.ts +0 -5
  65. package/build/components/SquareButton/SquareButton.stories.js +0 -14
  66. package/build/components/Swimlane/Swimlane.stories.d.ts +0 -6
  67. package/build/components/Swimlane/Swimlane.stories.js +0 -102
  68. package/build/components/Table/Table.stories.d.ts +0 -8
  69. package/build/components/Table/Table.stories.js +0 -75
  70. package/build/components/Text/Text.stories.d.ts +0 -6
  71. package/build/components/Text/Text.stories.js +0 -11
  72. package/build/examples/Form.stories.d.ts +0 -5
  73. package/build/examples/Form.stories.js +0 -19
  74. package/build/examples/Modal.stories.d.ts +0 -5
  75. package/build/examples/Modal.stories.js +0 -37
  76. package/build/layouts/Action/Action.stories.d.ts +0 -6
  77. package/build/layouts/Action/Action.stories.js +0 -17
  78. package/build/layouts/Centered/Centered.stories.d.ts +0 -5
  79. package/build/layouts/Centered/Centered.stories.js +0 -11
  80. package/build/layouts/Column/Column.stories.d.ts +0 -5
  81. package/build/layouts/Column/Column.stories.js +0 -11
  82. package/build/layouts/Content/Content.stories.d.ts +0 -9
  83. package/build/layouts/Content/Content.stories.js +0 -40
  84. package/build/layouts/Focus/Focus.stories.d.ts +0 -5
  85. package/build/layouts/Focus/Focus.stories.js +0 -19
  86. package/build/layouts/Padded/Padded.stories.d.ts +0 -6
  87. package/build/layouts/Padded/Padded.stories.js +0 -13
  88. package/build/layouts/WidthLimit/WidthLimit.stories.d.ts +0 -8
  89. package/build/layouts/WidthLimit/WidthLimit.stories.js +0 -43
@@ -1,96 +0,0 @@
1
- import React, { useState } from 'react';
2
- import { Button, FocusLayout, Menu, Modal, Notifications, PaddedLayout, Text } from '../..';
3
- /* eslint-disable no-alert, no-console */
4
- export const Standard = () => {
5
- const notifications = [
6
- {
7
- id: '123',
8
- message: 'User saved!',
9
- variant: 'success',
10
- },
11
- {
12
- id: '456',
13
- message: 'Error validating form',
14
- variant: 'danger',
15
- },
16
- ];
17
- return (React.createElement(React.Fragment, null,
18
- React.createElement(Notifications, { notifications: notifications }),
19
- React.createElement(Menu, { heading: 'Something Tasty' }),
20
- React.createElement(Menu.Page, null,
21
- React.createElement(FocusLayout, null,
22
- React.createElement(Text, null, "Content...")))));
23
- };
24
- export const Interactive = () => {
25
- const [notifications, setNotifications] = useState([]);
26
- const successNotification = {
27
- id: '123',
28
- message: 'User saved!',
29
- variant: 'success',
30
- count: 1,
31
- };
32
- const errorNotification = {
33
- id: '456',
34
- message: 'Error validating form',
35
- variant: 'danger',
36
- count: 1,
37
- };
38
- const addNotification = (notification) => {
39
- const exists = notifications.find((n) => n.id === notification.id);
40
- if (exists) {
41
- const newNotifications = notifications.map((n) => n.id === notification.id
42
- ? {
43
- ...n,
44
- count: (n.count || 1) + 1,
45
- }
46
- : n);
47
- setNotifications(newNotifications);
48
- return;
49
- }
50
- setNotifications([...notifications, notification]);
51
- };
52
- return (React.createElement(React.Fragment, null,
53
- React.createElement(Notifications, { notifications: notifications }),
54
- React.createElement(Menu, { heading: 'Something Tasty' }),
55
- React.createElement(Menu.Page, null,
56
- React.createElement(FocusLayout, null,
57
- React.createElement(Button, { onClick: () => addNotification(successNotification) }, "Save user"),
58
- React.createElement("br", null),
59
- React.createElement("br", null),
60
- React.createElement(Button, { onClick: () => addNotification(errorNotification) }, "Validate Form"),
61
- React.createElement("br", null),
62
- React.createElement("br", null),
63
- React.createElement(Button, { variant: 'secondary', onClick: () => setNotifications(notifications.slice(1)) }, "Clear")))));
64
- };
65
- export const OverModal = () => {
66
- const notifications = [
67
- {
68
- id: '123',
69
- message: 'User saved!',
70
- variant: 'success',
71
- },
72
- {
73
- id: '456',
74
- message: 'Error validating form',
75
- variant: 'danger',
76
- },
77
- ];
78
- return (React.createElement(React.Fragment, null,
79
- React.createElement(Notifications, { notifications: notifications }),
80
- React.createElement(Menu, { heading: 'Something Tasty' }),
81
- React.createElement(Menu.Page, null,
82
- React.createElement(Modal, { onClose: () => {
83
- console.log('close..');
84
- } },
85
- React.createElement(Modal.Header, { header: 'A test modal' }),
86
- React.createElement(Modal.Body, null,
87
- React.createElement(PaddedLayout, null,
88
- React.createElement(Text, null, "Some text...")))))));
89
- };
90
- export default {
91
- title: 'Components/Notifications',
92
- component: Notifications,
93
- parameters: {
94
- layout: 'fullscreen',
95
- },
96
- };
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- export declare const WithActions: () => JSX.Element;
5
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
6
- export default _default;
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- import { Button, ButtonGroup, PageHeader } from '../../';
3
- export const Standard = () => {
4
- return React.createElement(PageHeader, { heading: 'Frank the Drummer' });
5
- };
6
- export const WithActions = () => {
7
- return (React.createElement(PageHeader, { heading: 'Frank the Drummer', actions: React.createElement(ButtonGroup, null,
8
- React.createElement(Button, { variant: 'tertiary' }, "Add")) }));
9
- };
10
- export default {
11
- title: 'Components/PageHeader',
12
- component: PageHeader,
13
- };
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- export declare const Generated: () => JSX.Element;
5
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
6
- export default _default;
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { ProfileImage } from '../..';
3
- export const Standard = () => (React.createElement(ProfileImage, { name: 'Hungry Bear', image: 'https://i.guim.co.uk/img/media/86c3481516dce247943ac2978b4f48d16a3ac265/0_170_5120_3074/master/5120.jpg?width=1200&height=1200&quality=85&auto=format&fit=crop&s=637dc5731d52754675ef36344a6af3c8' }));
4
- export const Generated = () => React.createElement(ProfileImage, { name: 'Hungry Bear' });
5
- export default {
6
- title: 'Components/ProfileImage',
7
- component: ProfileImage,
8
- };
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
5
- export default _default;
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { QrCode } from '../..';
3
- export const Standard = () => (React.createElement(React.Fragment, null,
4
- React.createElement(QrCode, { value: 'http://www.google.com' })));
5
- export default {
6
- title: 'Components/QrCode',
7
- component: QrCode,
8
- };
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
5
- export default _default;
@@ -1,14 +0,0 @@
1
- import React from 'react';
2
- import { SquareButton } from '../..';
3
- export const Standard = () => (React.createElement(React.Fragment, null,
4
- React.createElement(SquareButton, null, "Primary"),
5
- React.createElement("br", null),
6
- React.createElement("br", null),
7
- React.createElement(SquareButton, { variant: 'secondary' }, "A Secondary Button"),
8
- React.createElement("br", null),
9
- React.createElement("br", null),
10
- React.createElement(SquareButton, { variant: 'tertiary' }, "A Tertiary Square Button")));
11
- export default {
12
- title: 'Components/SquareButton',
13
- component: SquareButton,
14
- };
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- export declare const LotsOfCards: () => JSX.Element;
5
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
6
- export default _default;
@@ -1,102 +0,0 @@
1
- import React from 'react';
2
- import { InlineCard, Badge, Swimlane, CenteredLayout } from '../../';
3
- import InlineCardGroup from '../InlineCard/InlineCardGroup.component';
4
- export const Standard = () => {
5
- return (React.createElement(React.Fragment, null,
6
- React.createElement(Swimlane, { label: 'Jobs' },
7
- React.createElement(InlineCardGroup, { wrap: true },
8
- React.createElement(InlineCard, { size: 'xs' },
9
- React.createElement(InlineCard.Content, { center: true },
10
- React.createElement(CenteredLayout, null,
11
- "Jim",
12
- `'`,
13
- "s Mowing")),
14
- React.createElement(InlineCard.Meta, null,
15
- React.createElement(Badge, { variant: 'success' }, "Full Time"))))),
16
- React.createElement(Swimlane, { label: 'Properties' },
17
- React.createElement(InlineCardGroup, { wrap: true },
18
- React.createElement(InlineCard, { size: 'xs' },
19
- React.createElement(InlineCard.Content, { center: true },
20
- React.createElement(CenteredLayout, null, "33 Oak Street")),
21
- React.createElement(InlineCard.Meta, null,
22
- React.createElement(Badge, { variant: 'success' }, "Primary"))),
23
- React.createElement(InlineCard, { size: 'xs' },
24
- React.createElement(InlineCard.Content, { center: true },
25
- React.createElement(CenteredLayout, null, "402 Main Street")),
26
- React.createElement(InlineCard.Meta, null,
27
- React.createElement(Badge, { variant: 'info' }, "Investment"))),
28
- React.createElement(InlineCard, { size: 'xs' },
29
- React.createElement(InlineCard.Content, { center: true },
30
- React.createElement(CenteredLayout, null, "12 Heart Avenue")),
31
- React.createElement(InlineCard.Meta, null,
32
- React.createElement(Badge, { variant: 'info' }, "Investment"))))),
33
- React.createElement(Swimlane, { label: 'Investments' },
34
- React.createElement(InlineCardGroup, { wrap: true },
35
- React.createElement(InlineCard, { size: 'xs' },
36
- React.createElement(InlineCard.Content, { center: true },
37
- React.createElement(CenteredLayout, null, "ASX 200")),
38
- React.createElement(InlineCard.Meta, null,
39
- React.createElement(Badge, { variant: 'info' }, "Index Fund"))),
40
- React.createElement(InlineCard, { size: 'xs' },
41
- React.createElement(InlineCard.Content, { center: true },
42
- React.createElement(CenteredLayout, null, "AMP Super")),
43
- React.createElement(InlineCard.Meta, null,
44
- React.createElement(Badge, { variant: 'info' }, "Super Fund")))))));
45
- };
46
- export const LotsOfCards = () => {
47
- return (React.createElement(React.Fragment, null,
48
- React.createElement(Swimlane, { label: 'An Example' },
49
- React.createElement(InlineCardGroup, { wrap: true },
50
- React.createElement(InlineCard, { size: 'xs' },
51
- React.createElement(InlineCard.Content, { center: true },
52
- React.createElement(CenteredLayout, null, "Card")),
53
- React.createElement(InlineCard.Meta, null,
54
- React.createElement(Badge, { variant: 'success' }, "#1"))),
55
- React.createElement(InlineCard, { size: 'xs' },
56
- React.createElement(InlineCard.Content, { center: true },
57
- React.createElement(CenteredLayout, null, "Card")),
58
- React.createElement(InlineCard.Meta, null,
59
- React.createElement(Badge, { variant: 'success' }, "#2"))),
60
- React.createElement(InlineCard, { size: 'xs' },
61
- React.createElement(InlineCard.Content, { center: true },
62
- React.createElement(CenteredLayout, null, "Card")),
63
- React.createElement(InlineCard.Meta, null,
64
- React.createElement(Badge, { variant: 'success' }, "#3"))),
65
- React.createElement(InlineCard, { size: 'xs' },
66
- React.createElement(InlineCard.Content, { center: true },
67
- React.createElement(CenteredLayout, null, "Card")),
68
- React.createElement(InlineCard.Meta, null,
69
- React.createElement(Badge, { variant: 'success' }, "#4"))),
70
- React.createElement(InlineCard, { size: 'xs' },
71
- React.createElement(InlineCard.Content, { center: true },
72
- React.createElement(CenteredLayout, null, "Card")),
73
- React.createElement(InlineCard.Meta, null,
74
- React.createElement(Badge, { variant: 'success' }, "#5"))),
75
- React.createElement(InlineCard, { size: 'xs' },
76
- React.createElement(InlineCard.Content, { center: true },
77
- React.createElement(CenteredLayout, null, "Card")),
78
- React.createElement(InlineCard.Meta, null,
79
- React.createElement(Badge, { variant: 'success' }, "#6"))),
80
- React.createElement(InlineCard, { size: 'xs' },
81
- React.createElement(InlineCard.Content, { center: true },
82
- React.createElement(CenteredLayout, null, "Card")),
83
- React.createElement(InlineCard.Meta, null,
84
- React.createElement(Badge, { variant: 'success' }, "#7"))),
85
- React.createElement(InlineCard, { size: 'xs' },
86
- React.createElement(InlineCard.Content, { center: true },
87
- React.createElement(CenteredLayout, null, "Card")),
88
- React.createElement(InlineCard.Meta, null,
89
- React.createElement(Badge, { variant: 'success' }, "#8"))),
90
- React.createElement(InlineCard, { size: 'xs' },
91
- React.createElement(InlineCard.Content, { center: true },
92
- React.createElement(CenteredLayout, null, "Card")),
93
- React.createElement(InlineCard.Meta, null,
94
- React.createElement(Badge, { variant: 'success' }, "#9"))),
95
- React.createElement(InlineCard, { size: 'xs', onClick: () => console.log('add') },
96
- React.createElement(InlineCard.Content, { center: true },
97
- React.createElement(CenteredLayout, null, "Add")))))));
98
- };
99
- export default {
100
- title: 'Components/Swimlane',
101
- component: Swimlane,
102
- };
@@ -1,8 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- export declare const WithActions: () => JSX.Element;
5
- export declare const InCard: () => JSX.Element;
6
- export declare const InContentCard: () => JSX.Element;
7
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
8
- export default _default;
@@ -1,75 +0,0 @@
1
- import React from 'react';
2
- import { Card, ProfileImage, Table } from '../..';
3
- /* eslint-disable @typescript-eslint/no-empty-function */
4
- const fakeData = [
5
- {
6
- count: 57,
7
- name: 'Hungry Caterpillar',
8
- },
9
- {
10
- count: 32,
11
- name: 'Fainting Lama',
12
- },
13
- {
14
- count: 53,
15
- name: 'Hungry Bear',
16
- },
17
- {
18
- count: 24,
19
- name: 'Panicking Squirrel',
20
- },
21
- {
22
- count: 12,
23
- name: 'High Hedgehog',
24
- },
25
- {
26
- count: 76,
27
- name: 'Lazy Tiger',
28
- },
29
- {
30
- count: 34,
31
- name: 'Wild Antelope',
32
- },
33
- ];
34
- export const Standard = () => (React.createElement(Table, null,
35
- React.createElement(Table.Row, null,
36
- React.createElement(Table.Cell, { variant: 'tight' },
37
- React.createElement(ProfileImage, { name: 'Hungry Caterpillar' })),
38
- React.createElement(Table.Cell, { width: '100%' }, "Hungry Caterpillar"),
39
- React.createElement(Table.Cell, null, "Ready")),
40
- React.createElement(Table.Row, null,
41
- React.createElement(Table.Cell, { variant: 'tight' },
42
- React.createElement(ProfileImage, { name: 'Fainting Lama' })),
43
- React.createElement(Table.Cell, { width: '100%' }, "Fainting Lama"),
44
- React.createElement(Table.Cell, null, "Pending"))));
45
- export const WithActions = () => (React.createElement(Table, null, fakeData.map((data) => (React.createElement(Table.Row, { key: data.name },
46
- React.createElement(Table.Cell, null, data.count),
47
- React.createElement(Table.Cell, null, data.name),
48
- React.createElement(Table.Cell, null,
49
- React.createElement(Table.Action, { onClick: () => { }, text: 'filter' })))))));
50
- export const InCard = () => (React.createElement(Card, { padded: true, size: 'sm' },
51
- React.createElement(Table, null,
52
- React.createElement(Table.Row, null,
53
- React.createElement(Table.Cell, { variant: 'tight' },
54
- React.createElement(ProfileImage, { name: 'Hungry Caterpillar' })),
55
- React.createElement(Table.Cell, null, "Hungry Caterpillar"),
56
- React.createElement(Table.Cell, null, "Ready")),
57
- React.createElement(Table.Row, null,
58
- React.createElement(Table.Cell, { variant: 'tight' },
59
- React.createElement(ProfileImage, { name: 'Fainting Lama' })),
60
- React.createElement(Table.Cell, null, "Fainting Lama"),
61
- React.createElement(Table.Cell, null, "Pending")))));
62
- export const InContentCard = () => (React.createElement(Card, { size: 'sm' },
63
- React.createElement(Card.Header, { heading: 'Sed do eiusmod', subHeading: 'Labore et dolore magna' }),
64
- React.createElement(Card.Content, null,
65
- React.createElement(Table, { variant: 'soft' },
66
- React.createElement(Table.Row, null,
67
- React.createElement(Table.Cell, null, "Hungry Caterpillar"),
68
- React.createElement(Table.Cell, null, "Ready")),
69
- React.createElement(Table.Row, null,
70
- React.createElement(Table.Cell, null, "Fainting Lama"),
71
- React.createElement(Table.Cell, null, "Pending"))))));
72
- export default {
73
- title: 'Components/Table',
74
- component: Table,
75
- };
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- export declare const Secondary: () => JSX.Element;
5
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
6
- export default _default;
@@ -1,11 +0,0 @@
1
- import React from 'react';
2
- import { Text } from '../..';
3
- export const Standard = () => React.createElement(Text, null, "test 1");
4
- export const Secondary = () => (React.createElement(React.Fragment, null,
5
- React.createElement(Text, null, "This is not a drill"),
6
- " ",
7
- React.createElement(Text, { variant: 'secondary' }, "(no really!)")));
8
- export default {
9
- title: 'Components/Text',
10
- component: Text,
11
- };
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
5
- export default _default;
@@ -1,19 +0,0 @@
1
- import React, { useState } from 'react';
2
- import { ControlGroup, FocusLayout, Form, Heading, Input, ImageUpload } from '../';
3
- /* eslint-disable @typescript-eslint/no-empty-function */
4
- export const Standard = () => {
5
- const [value, setValue] = useState({ dragon: '' });
6
- return (React.createElement(FocusLayout, null,
7
- React.createElement(Form, { value: value, onChange: setValue },
8
- React.createElement(ControlGroup, { variation: 'comfortable' },
9
- React.createElement(ImageUpload, { name: 'image' }),
10
- React.createElement(Input, { name: 'name', placeholder: 'Something tasty..' }),
11
- React.createElement(Heading.FormHeading, null, "Components"),
12
- React.createElement(Input, { name: 'one', placeholder: 'Ingredient #1' }),
13
- React.createElement(Input, { name: 'two', placeholder: 'Ingredient #2' }),
14
- React.createElement(Input, { name: 'three', placeholder: 'Ingredient #3' })))));
15
- };
16
- export default {
17
- title: 'Examples/Forms',
18
- component: Form,
19
- };
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
5
- export default _default;
@@ -1,37 +0,0 @@
1
- import React, { useState } from 'react';
2
- import { Button, FancyCheckbox, Form, Input, Modal } from '../';
3
- import ControlGroup from '../components/ControlGroup/ControlGroup.component';
4
- /* eslint-disable @typescript-eslint/no-empty-function */
5
- const options = [
6
- {
7
- value: 'fireball',
8
- label: 'Chinese Fireball',
9
- },
10
- {
11
- value: 'longhorn',
12
- label: 'Romanian Longhorn',
13
- },
14
- {
15
- value: 'ridgeback',
16
- label: 'Norwegian Ridgeback',
17
- },
18
- {
19
- value: 'horntail',
20
- label: 'Hungarian Horntail',
21
- },
22
- ];
23
- export const Standard = () => {
24
- const [value, setValue] = useState({ dragon: '' });
25
- return (React.createElement(Modal, { onClose: () => { } },
26
- React.createElement(Modal.Header, { header: 'Add Dragon' }),
27
- React.createElement(Modal.Body, null,
28
- React.createElement(Form, { value: value, onChange: setValue },
29
- React.createElement(ControlGroup, { variation: 'comfortable' },
30
- React.createElement(Input, { name: 'name', label: 'Name' }),
31
- React.createElement(FancyCheckbox, { name: 'dragon', label: 'Type', options: options }),
32
- React.createElement(Button, null, "Submit"))))));
33
- };
34
- export default {
35
- title: 'Examples/Modals',
36
- component: FancyCheckbox,
37
- };
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- export declare const LeftAligned: () => JSX.Element;
5
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
6
- export default _default;
@@ -1,17 +0,0 @@
1
- import React from 'react';
2
- import { ActionLayout, Button } from '../..';
3
- export const Standard = () => (React.createElement(ActionLayout, null,
4
- React.createElement(ActionLayout.Text, null, "Lets find something to eat..."),
5
- React.createElement(ActionLayout.Content, null,
6
- React.createElement(Button, { variant: 'secondary' }, "Get Started"))));
7
- export const LeftAligned = () => (React.createElement(ActionLayout, null,
8
- React.createElement(ActionLayout.Text, null, "Lets find something to eat..."),
9
- React.createElement(ActionLayout.Content, { left: true },
10
- React.createElement(Button, { variant: 'secondary' }, "Get Started"))));
11
- export default {
12
- title: 'Layouts/Action',
13
- component: ActionLayout,
14
- parameters: {
15
- layout: 'fullscreen',
16
- },
17
- };
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
5
- export default _default;
@@ -1,11 +0,0 @@
1
- import React from 'react';
2
- import { CenteredLayout } from '../..';
3
- export const Standard = () => (React.createElement("div", { style: { backgroundColor: 'white' } },
4
- React.createElement(CenteredLayout, null, "some content....")));
5
- export default {
6
- title: 'Layouts/Centered',
7
- component: CenteredLayout,
8
- parameters: {
9
- layout: 'fullscreen',
10
- },
11
- };
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
5
- export default _default;
@@ -1,11 +0,0 @@
1
- import React from 'react';
2
- import { ColumnLayout } from '../..';
3
- export const Standard = () => (React.createElement("div", { style: { backgroundColor: 'white' } },
4
- React.createElement(ColumnLayout, null, "some content....")));
5
- export default {
6
- title: 'Layouts/Column',
7
- component: ColumnLayout,
8
- parameters: {
9
- layout: 'fullscreen',
10
- },
11
- };
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- export declare const Small: () => JSX.Element;
5
- export declare const Medium: () => JSX.Element;
6
- export declare const Large: () => JSX.Element;
7
- export declare const Full: () => JSX.Element;
8
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
9
- export default _default;
@@ -1,40 +0,0 @@
1
- import React from 'react';
2
- import { ContentLayout, Card, CardGroup, Heading, Button, Text } from '../..';
3
- export const Standard = () => (React.createElement(ContentLayout, null,
4
- React.createElement(ContentLayout.Header, { actions: React.createElement(Button, null, "Add") },
5
- React.createElement(Heading, null, "Some content...")),
6
- React.createElement(ContentLayout.Content, null,
7
- React.createElement(CardGroup, null,
8
- React.createElement(Card, null,
9
- React.createElement(Card.Content, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.")),
10
- React.createElement(Card, null,
11
- React.createElement(Card.Content, null, "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")),
12
- React.createElement(Card, null,
13
- React.createElement(Card.Content, null, "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo."))))));
14
- export const Small = () => (React.createElement(ContentLayout, null,
15
- React.createElement(ContentLayout.Header, null,
16
- React.createElement(Heading, null, "A small content section")),
17
- React.createElement(ContentLayout.Content, { size: 'sm' },
18
- React.createElement(Text, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eget odio vitae elit sodales cursus. Phasellus a consequat leo. Ut elit metus, bibendum et consequat quis, facilisis nec ex. Curabitur ex magna, tempor a pretium eu, hendrerit ut erat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce id lectus varius, lacinia metus et, egestas magna. Pellentesque egestas massa nec hendrerit tempus. Aliquam laoreet elit aliquet orci semper, eget finibus neque volutpat. Ut dignissim in neque quis lobortis. Vivamus bibendum mauris eu est aliquam efficitur. Vestibulum finibus condimentum lacus, vitae congue metus faucibus at. Aliquam et lacus eu turpis blandit commodo sit amet nec ligula. Proin tristique porttitor iaculis. Nunc efficitur justo et justo rutrum gravida. Cras accumsan ipsum vitae cursus consequat. Sed at nunc at risus dictum hendrerit. Pellentesque vel felis convallis, pellentesque enim in, suscipit urna. Aenean eu tristique lectus. Sed convallis at velit eget maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed eget erat eget ligula lacinia ultricies a non ex. In efficitur purus non cursus tincidunt. Quisque lobortis feugiat ipsum, non mollis sapien aliquam in. Sed dictum libero id neque dictum pellentesque. In sed molestie nibh, volutpat fringilla leo. Phasellus at scelerisque enim. Donec nulla enim, dapibus quis tempor at, cursus eget mi. Vivamus ac consectetur tortor, ut egestas felis. Quisque ultricies, ligula sit amet vestibulum vulputate, erat lacus volutpat urna, nec tempor lacus nisl vitae lectus. Sed rhoncus lorem id tempus posuere. Vestibulum quis tellus dui. Suspendisse finibus placerat vestibulum. Suspendisse potenti. Nam sollicitudin nec velit non efficitur. In hac habitasse platea dictumst. Ut ut placerat nibh. Vestibulum felis enim, volutpat eget urna a, dapibus fringilla est. Vivamus rhoncus quis leo vel porta. In sit amet neque accumsan ligula varius aliquet eu ut nisi. Nunc bibendum elementum urna a blandit. Maecenas ultrices eros ac lacus eleifend, sit amet posuere erat iaculis. Nam hendrerit ipsum sed leo mattis ultrices. Aliquam tincidunt dui eget tincidunt pharetra. Aenean efficitur magna nunc, vitae luctus turpis placerat id. Aliquam quis rutrum purus. Proin tortor mauris, fermentum et pharetra vel, vulputate id dui. Nam pharetra risus odio. Etiam quis erat a mauris semper dignissim. Praesent a sollicitudin nunc. Integer scelerisque eget leo in pellentesque. Vivamus felis augue, condimentum nec auctor tincidunt, maximus nec nunc. Etiam vel imperdiet nisl, vel iaculis felis. Etiam tempor dolor ac ultrices luctus. Ut id nulla vestibulum, convallis sapien at, ultrices est. Mauris finibus est vitae fringilla placerat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vestibulum tincidunt sem, eu dignissim purus viverra in. Curabitur libero felis, eleifend sit amet bibendum at, ornare in lacus. Curabitur ac mattis ligula. Nulla dignissim pharetra urna at eleifend. Ut vitae auctor nibh. Nulla facilisi. Maecenas bibendum nibh nec dui posuere, eu vulputate arcu mollis. Sed auctor, diam sit amet scelerisque fringilla, nunc risus tristique libero, et ornare lorem augue eu mauris. Donec hendrerit, sapien ac semper vehicula, nunc ex bibendum lacus, vel ultricies sapien purus eget libero."))));
19
- export const Medium = () => (React.createElement(ContentLayout, null,
20
- React.createElement(ContentLayout.Header, null,
21
- React.createElement(Heading, null, "A medium content section")),
22
- React.createElement(ContentLayout.Content, { size: 'md' },
23
- React.createElement(Text, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eget odio vitae elit sodales cursus. Phasellus a consequat leo. Ut elit metus, bibendum et consequat quis, facilisis nec ex. Curabitur ex magna, tempor a pretium eu, hendrerit ut erat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce id lectus varius, lacinia metus et, egestas magna. Pellentesque egestas massa nec hendrerit tempus. Aliquam laoreet elit aliquet orci semper, eget finibus neque volutpat. Ut dignissim in neque quis lobortis. Vivamus bibendum mauris eu est aliquam efficitur. Vestibulum finibus condimentum lacus, vitae congue metus faucibus at. Aliquam et lacus eu turpis blandit commodo sit amet nec ligula. Proin tristique porttitor iaculis. Nunc efficitur justo et justo rutrum gravida. Cras accumsan ipsum vitae cursus consequat. Sed at nunc at risus dictum hendrerit. Pellentesque vel felis convallis, pellentesque enim in, suscipit urna. Aenean eu tristique lectus. Sed convallis at velit eget maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed eget erat eget ligula lacinia ultricies a non ex. In efficitur purus non cursus tincidunt. Quisque lobortis feugiat ipsum, non mollis sapien aliquam in. Sed dictum libero id neque dictum pellentesque. In sed molestie nibh, volutpat fringilla leo. Phasellus at scelerisque enim. Donec nulla enim, dapibus quis tempor at, cursus eget mi. Vivamus ac consectetur tortor, ut egestas felis. Quisque ultricies, ligula sit amet vestibulum vulputate, erat lacus volutpat urna, nec tempor lacus nisl vitae lectus. Sed rhoncus lorem id tempus posuere. Vestibulum quis tellus dui. Suspendisse finibus placerat vestibulum. Suspendisse potenti. Nam sollicitudin nec velit non efficitur. In hac habitasse platea dictumst. Ut ut placerat nibh. Vestibulum felis enim, volutpat eget urna a, dapibus fringilla est. Vivamus rhoncus quis leo vel porta. In sit amet neque accumsan ligula varius aliquet eu ut nisi. Nunc bibendum elementum urna a blandit. Maecenas ultrices eros ac lacus eleifend, sit amet posuere erat iaculis. Nam hendrerit ipsum sed leo mattis ultrices. Aliquam tincidunt dui eget tincidunt pharetra. Aenean efficitur magna nunc, vitae luctus turpis placerat id. Aliquam quis rutrum purus. Proin tortor mauris, fermentum et pharetra vel, vulputate id dui. Nam pharetra risus odio. Etiam quis erat a mauris semper dignissim. Praesent a sollicitudin nunc. Integer scelerisque eget leo in pellentesque. Vivamus felis augue, condimentum nec auctor tincidunt, maximus nec nunc. Etiam vel imperdiet nisl, vel iaculis felis. Etiam tempor dolor ac ultrices luctus. Ut id nulla vestibulum, convallis sapien at, ultrices est. Mauris finibus est vitae fringilla placerat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vestibulum tincidunt sem, eu dignissim purus viverra in. Curabitur libero felis, eleifend sit amet bibendum at, ornare in lacus. Curabitur ac mattis ligula. Nulla dignissim pharetra urna at eleifend. Ut vitae auctor nibh. Nulla facilisi. Maecenas bibendum nibh nec dui posuere, eu vulputate arcu mollis. Sed auctor, diam sit amet scelerisque fringilla, nunc risus tristique libero, et ornare lorem augue eu mauris. Donec hendrerit, sapien ac semper vehicula, nunc ex bibendum lacus, vel ultricies sapien purus eget libero."))));
24
- export const Large = () => (React.createElement(ContentLayout, null,
25
- React.createElement(ContentLayout.Header, null,
26
- React.createElement(Heading, null, "A large content section")),
27
- React.createElement(ContentLayout.Content, { size: 'lg' },
28
- React.createElement(Text, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eget odio vitae elit sodales cursus. Phasellus a consequat leo. Ut elit metus, bibendum et consequat quis, facilisis nec ex. Curabitur ex magna, tempor a pretium eu, hendrerit ut erat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce id lectus varius, lacinia metus et, egestas magna. Pellentesque egestas massa nec hendrerit tempus. Aliquam laoreet elit aliquet orci semper, eget finibus neque volutpat. Ut dignissim in neque quis lobortis. Vivamus bibendum mauris eu est aliquam efficitur. Vestibulum finibus condimentum lacus, vitae congue metus faucibus at. Aliquam et lacus eu turpis blandit commodo sit amet nec ligula. Proin tristique porttitor iaculis. Nunc efficitur justo et justo rutrum gravida. Cras accumsan ipsum vitae cursus consequat. Sed at nunc at risus dictum hendrerit. Pellentesque vel felis convallis, pellentesque enim in, suscipit urna. Aenean eu tristique lectus. Sed convallis at velit eget maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed eget erat eget ligula lacinia ultricies a non ex. In efficitur purus non cursus tincidunt. Quisque lobortis feugiat ipsum, non mollis sapien aliquam in. Sed dictum libero id neque dictum pellentesque. In sed molestie nibh, volutpat fringilla leo. Phasellus at scelerisque enim. Donec nulla enim, dapibus quis tempor at, cursus eget mi. Vivamus ac consectetur tortor, ut egestas felis. Quisque ultricies, ligula sit amet vestibulum vulputate, erat lacus volutpat urna, nec tempor lacus nisl vitae lectus. Sed rhoncus lorem id tempus posuere. Vestibulum quis tellus dui. Suspendisse finibus placerat vestibulum. Suspendisse potenti. Nam sollicitudin nec velit non efficitur. In hac habitasse platea dictumst. Ut ut placerat nibh. Vestibulum felis enim, volutpat eget urna a, dapibus fringilla est. Vivamus rhoncus quis leo vel porta. In sit amet neque accumsan ligula varius aliquet eu ut nisi. Nunc bibendum elementum urna a blandit. Maecenas ultrices eros ac lacus eleifend, sit amet posuere erat iaculis. Nam hendrerit ipsum sed leo mattis ultrices. Aliquam tincidunt dui eget tincidunt pharetra. Aenean efficitur magna nunc, vitae luctus turpis placerat id. Aliquam quis rutrum purus. Proin tortor mauris, fermentum et pharetra vel, vulputate id dui. Nam pharetra risus odio. Etiam quis erat a mauris semper dignissim. Praesent a sollicitudin nunc. Integer scelerisque eget leo in pellentesque. Vivamus felis augue, condimentum nec auctor tincidunt, maximus nec nunc. Etiam vel imperdiet nisl, vel iaculis felis. Etiam tempor dolor ac ultrices luctus. Ut id nulla vestibulum, convallis sapien at, ultrices est. Mauris finibus est vitae fringilla placerat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vestibulum tincidunt sem, eu dignissim purus viverra in. Curabitur libero felis, eleifend sit amet bibendum at, ornare in lacus. Curabitur ac mattis ligula. Nulla dignissim pharetra urna at eleifend. Ut vitae auctor nibh. Nulla facilisi. Maecenas bibendum nibh nec dui posuere, eu vulputate arcu mollis. Sed auctor, diam sit amet scelerisque fringilla, nunc risus tristique libero, et ornare lorem augue eu mauris. Donec hendrerit, sapien ac semper vehicula, nunc ex bibendum lacus, vel ultricies sapien purus eget libero."))));
29
- export const Full = () => (React.createElement(ContentLayout, null,
30
- React.createElement(ContentLayout.Header, null,
31
- React.createElement(Heading, null, "A full content section")),
32
- React.createElement(ContentLayout.Content, { size: 'full' },
33
- React.createElement(Text, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eget odio vitae elit sodales cursus. Phasellus a consequat leo. Ut elit metus, bibendum et consequat quis, facilisis nec ex. Curabitur ex magna, tempor a pretium eu, hendrerit ut erat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce id lectus varius, lacinia metus et, egestas magna. Pellentesque egestas massa nec hendrerit tempus. Aliquam laoreet elit aliquet orci semper, eget finibus neque volutpat. Ut dignissim in neque quis lobortis. Vivamus bibendum mauris eu est aliquam efficitur. Vestibulum finibus condimentum lacus, vitae congue metus faucibus at. Aliquam et lacus eu turpis blandit commodo sit amet nec ligula. Proin tristique porttitor iaculis. Nunc efficitur justo et justo rutrum gravida. Cras accumsan ipsum vitae cursus consequat. Sed at nunc at risus dictum hendrerit. Pellentesque vel felis convallis, pellentesque enim in, suscipit urna. Aenean eu tristique lectus. Sed convallis at velit eget maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed eget erat eget ligula lacinia ultricies a non ex. In efficitur purus non cursus tincidunt. Quisque lobortis feugiat ipsum, non mollis sapien aliquam in. Sed dictum libero id neque dictum pellentesque. In sed molestie nibh, volutpat fringilla leo. Phasellus at scelerisque enim. Donec nulla enim, dapibus quis tempor at, cursus eget mi. Vivamus ac consectetur tortor, ut egestas felis. Quisque ultricies, ligula sit amet vestibulum vulputate, erat lacus volutpat urna, nec tempor lacus nisl vitae lectus. Sed rhoncus lorem id tempus posuere. Vestibulum quis tellus dui. Suspendisse finibus placerat vestibulum. Suspendisse potenti. Nam sollicitudin nec velit non efficitur. In hac habitasse platea dictumst. Ut ut placerat nibh. Vestibulum felis enim, volutpat eget urna a, dapibus fringilla est. Vivamus rhoncus quis leo vel porta. In sit amet neque accumsan ligula varius aliquet eu ut nisi. Nunc bibendum elementum urna a blandit. Maecenas ultrices eros ac lacus eleifend, sit amet posuere erat iaculis. Nam hendrerit ipsum sed leo mattis ultrices. Aliquam tincidunt dui eget tincidunt pharetra. Aenean efficitur magna nunc, vitae luctus turpis placerat id. Aliquam quis rutrum purus. Proin tortor mauris, fermentum et pharetra vel, vulputate id dui. Nam pharetra risus odio. Etiam quis erat a mauris semper dignissim. Praesent a sollicitudin nunc. Integer scelerisque eget leo in pellentesque. Vivamus felis augue, condimentum nec auctor tincidunt, maximus nec nunc. Etiam vel imperdiet nisl, vel iaculis felis. Etiam tempor dolor ac ultrices luctus. Ut id nulla vestibulum, convallis sapien at, ultrices est. Mauris finibus est vitae fringilla placerat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vestibulum tincidunt sem, eu dignissim purus viverra in. Curabitur libero felis, eleifend sit amet bibendum at, ornare in lacus. Curabitur ac mattis ligula. Nulla dignissim pharetra urna at eleifend. Ut vitae auctor nibh. Nulla facilisi. Maecenas bibendum nibh nec dui posuere, eu vulputate arcu mollis. Sed auctor, diam sit amet scelerisque fringilla, nunc risus tristique libero, et ornare lorem augue eu mauris. Donec hendrerit, sapien ac semper vehicula, nunc ex bibendum lacus, vel ultricies sapien purus eget libero."))));
34
- export default {
35
- title: 'Layouts/Content',
36
- component: ContentLayout,
37
- parameters: {
38
- layout: 'fullscreen',
39
- },
40
- };
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { Meta } from '@storybook/react/types-6-0';
3
- export declare const Standard: () => JSX.Element;
4
- declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
5
- export default _default;