|
1 | | -import * as UI from "../../src/index"; |
| 1 | +import * as UI from '../../src/index' |
2 | 2 |
|
3 | | -import { action } from "@storybook/addon-actions"; |
| 3 | +import { action } from '@storybook/addon-actions' |
4 | 4 |
|
5 | 5 | export default { |
6 | | - title: "Buttons", |
7 | | -}; |
| 6 | + title: 'Buttons', |
| 7 | +} |
8 | 8 |
|
9 | 9 | export const Primary = { |
10 | 10 | render: () => |
11 | | - UI.widgets.button(document, undefined, "Primary", action("clicked")), |
12 | | - name: "Primary", |
13 | | -}; |
| 11 | + UI.widgets.button(document, undefined, 'Primary', action('clicked')), |
| 12 | + name: 'Primary', |
| 13 | +} |
14 | 14 |
|
15 | 15 | export const Secondary = { |
16 | 16 | render: () => |
17 | | - UI.widgets.button(document, undefined, "Secondary", action("clicked"), { |
18 | | - buttonColor: "Secondary", |
| 17 | + UI.widgets.button(document, undefined, 'Secondary', action('clicked'), { |
| 18 | + buttonColor: 'Secondary', |
19 | 19 | }), |
20 | 20 |
|
21 | | - name: "Secondary", |
22 | | -}; |
| 21 | + name: 'Secondary', |
| 22 | +} |
23 | 23 |
|
24 | 24 | export const PrimaryNeedsBorder = { |
25 | 25 | render: () => |
26 | | - UI.widgets.button(document, undefined, "Secondary", action("clicked"), { |
| 26 | + UI.widgets.button(document, undefined, 'Secondary', action('clicked'), { |
27 | 27 | needsBorder: true, |
28 | 28 | }), |
29 | 29 |
|
30 | | - name: "Primary (needs border)", |
31 | | -}; |
| 30 | + name: 'Primary (needs border)', |
| 31 | +} |
32 | 32 |
|
33 | 33 | export const SecondaryNeedsBorder = { |
34 | 34 | render: () => |
35 | | - UI.widgets.button(document, undefined, "Secondary", action("clicked"), { |
36 | | - buttonColor: "Secondary", |
| 35 | + UI.widgets.button(document, undefined, 'Secondary', action('clicked'), { |
| 36 | + buttonColor: 'Secondary', |
37 | 37 | needsBorder: true, |
38 | 38 | }), |
39 | 39 |
|
40 | | - name: "Secondary (needs border)", |
41 | | -}; |
| 40 | + name: 'Secondary (needs border)', |
| 41 | +} |
42 | 42 |
|
43 | 43 | export const ContinueButton = { |
44 | | - render: () => UI.widgets.continueButton(document, action("clicked")), |
45 | | - name: "Continue button", |
46 | | -}; |
| 44 | + render: () => UI.widgets.continueButton(document, action('clicked')), |
| 45 | + name: 'Continue button', |
| 46 | +} |
47 | 47 |
|
48 | 48 | export const CancelButton = { |
49 | | - render: () => UI.widgets.cancelButton(document, action("clicked")), |
50 | | - name: "Cancel button", |
51 | | -}; |
| 49 | + render: () => UI.widgets.cancelButton(document, action('clicked')), |
| 50 | + name: 'Cancel button', |
| 51 | +} |
52 | 52 |
|
53 | 53 | export const DeleteButton = { |
54 | 54 | render: () => { |
55 | | - const div = document.createElement("div"); |
| 55 | + const div = document.createElement('div') |
56 | 56 | const result = UI.widgets.deleteButtonWithCheck( |
57 | 57 | document, |
58 | 58 | div, |
59 | | - "something", |
60 | | - action("deleted"), |
61 | | - ); |
62 | | - return div; |
| 59 | + 'something', |
| 60 | + action('deleted') |
| 61 | + ) |
| 62 | + return div |
63 | 63 | }, |
64 | 64 |
|
65 | | - name: "Delete button", |
66 | | -}; |
| 65 | + name: 'Delete button', |
| 66 | +} |
67 | 67 |
|
68 | 68 | export const ButtonWithIcon = { |
69 | 69 | render: () => |
70 | 70 | UI.widgets.button( |
71 | 71 | document, |
72 | | - "https://solidproject.org/assets/img/solid-emblem.svg", |
73 | | - "test", |
74 | | - action("clicked!"), |
| 72 | + 'https://solidproject.org/assets/img/solid-emblem.svg', |
| 73 | + 'test', |
| 74 | + action('clicked!') |
75 | 75 | ), |
76 | 76 |
|
77 | | - name: "Button with icon", |
78 | | -}; |
| 77 | + name: 'Button with icon', |
| 78 | +} |
79 | 79 |
|
80 | 80 | export const FileUploadButton = { |
81 | | - render: () => UI.widgets.fileUploadButtonDiv(document, action("uploaded")), |
82 | | - name: "File upload button", |
83 | | -}; |
| 81 | + render: () => UI.widgets.fileUploadButtonDiv(document, action('uploaded')), |
| 82 | + name: 'File upload button', |
| 83 | +} |
84 | 84 |
|
85 | 85 | export const LinkButton = { |
86 | 86 | render: () => { |
87 | 87 | document.outlineManager = { |
88 | | - GotoSubject: action("go to subject"), |
89 | | - }; |
| 88 | + GotoSubject: action('go to subject'), |
| 89 | + } |
90 | 90 |
|
91 | 91 | return UI.widgets.linkButton( |
92 | 92 | document, |
93 | | - $rdf.namedNode("http://example.com/"), |
94 | | - ); |
| 93 | + $rdf.namedNode('http://example.com/') |
| 94 | + ) |
95 | 95 | }, |
96 | 96 |
|
97 | | - name: "Link button", |
98 | | -}; |
| 97 | + name: 'Link button', |
| 98 | +} |
99 | 99 |
|
100 | 100 | export const LinkIcon = { |
101 | 101 | render: () => |
102 | | - UI.widgets.linkIcon(document, $rdf.namedNode("https://solidproject.org/")), |
103 | | - name: "Link icon", |
104 | | -}; |
| 102 | + UI.widgets.linkIcon(document, $rdf.namedNode('https://solidproject.org/')), |
| 103 | + name: 'Link icon', |
| 104 | +} |
105 | 105 |
|
106 | 106 | export const LinkCustomIcon = { |
107 | 107 | render: () => |
108 | 108 | UI.widgets.linkIcon( |
109 | 109 | document, |
110 | | - $rdf.namedNode("https://solidproject.org/"), |
111 | | - "https://solidproject.org/favicon.ico", |
| 110 | + $rdf.namedNode('https://solidproject.org/'), |
| 111 | + 'https://solidproject.org/favicon.ico' |
112 | 112 | ), |
113 | 113 |
|
114 | | - name: "Link custom icon", |
115 | | -}; |
| 114 | + name: 'Link custom icon', |
| 115 | +} |
116 | 116 |
|
117 | 117 | export const RemoveButton = { |
118 | 118 | render: () => { |
119 | | - const div = document.createElement("div"); |
120 | | - const p = document.createElement("p"); |
121 | | - p.appendChild(document.createTextNode("click x to remove me")); |
122 | | - const button = UI.widgets.removeButton(document, p); |
123 | | - div.appendChild(p); |
124 | | - div.appendChild(button); |
125 | | - return div; |
| 119 | + const div = document.createElement('div') |
| 120 | + const p = document.createElement('p') |
| 121 | + p.appendChild(document.createTextNode('click x to remove me')) |
| 122 | + const button = UI.widgets.removeButton(document, p) |
| 123 | + div.appendChild(p) |
| 124 | + div.appendChild(button) |
| 125 | + return div |
126 | 126 | }, |
127 | 127 |
|
128 | | - name: "Remove button", |
129 | | -}; |
| 128 | + name: 'Remove button', |
| 129 | +} |
0 commit comments