@rpg-engine/long-bow 0.3.97 → 0.3.99

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 (173) hide show
  1. package/LICENSE +20 -20
  2. package/README.md +181 -181
  3. package/dist/components/Spellbook/Spell.d.ts +4 -4
  4. package/dist/components/Spellbook/Spellbook.d.ts +2 -2
  5. package/dist/components/Spellbook/cards/MobileSpellTooltip.d.ts +15 -0
  6. package/dist/components/Spellbook/cards/SpellInfo.d.ts +7 -0
  7. package/dist/components/Spellbook/cards/SpellInfoDisplay.d.ts +7 -0
  8. package/dist/components/Spellbook/cards/SpellInfoWrapper.d.ts +9 -0
  9. package/dist/components/Spellbook/cards/SpellTooltip.d.ts +6 -0
  10. package/dist/components/Spellbook/mockSpells.d.ts +2 -2
  11. package/dist/libs/CastingTypeHelper.d.ts +1 -0
  12. package/dist/long-bow.cjs.development.js +1424 -1210
  13. package/dist/long-bow.cjs.development.js.map +1 -1
  14. package/dist/long-bow.cjs.production.min.js +1 -1
  15. package/dist/long-bow.cjs.production.min.js.map +1 -1
  16. package/dist/long-bow.esm.js +1447 -1233
  17. package/dist/long-bow.esm.js.map +1 -1
  18. package/dist/stories/SpellInfoDisplay.stories.d.ts +8 -0
  19. package/package.json +100 -100
  20. package/src/components/Abstractions/ModalPortal.tsx +22 -22
  21. package/src/components/Abstractions/SlotsContainer.tsx +62 -62
  22. package/src/components/Arrow/SelectArrow.tsx +69 -69
  23. package/src/components/Arrow/img/arrow01-left-clicked.png +0 -0
  24. package/src/components/Arrow/img/arrow01-left.png +0 -0
  25. package/src/components/Arrow/img/arrow01-right-clicked.png +0 -0
  26. package/src/components/Arrow/img/arrow01-right.png +0 -0
  27. package/src/components/Arrow/img/arrow02-left-clicked.png +0 -0
  28. package/src/components/Arrow/img/arrow02-left.png +0 -0
  29. package/src/components/Arrow/img/arrow02-right-clicked.png +0 -0
  30. package/src/components/Arrow/img/arrow02-right.png +0 -0
  31. package/src/components/Button.tsx +40 -40
  32. package/src/components/Character/CharacterSelection.tsx +98 -98
  33. package/src/components/CharacterStatus/CharacterStatus.tsx +120 -120
  34. package/src/components/Chat/Chat.tsx +196 -196
  35. package/src/components/Chatdeprecated/ChatDeprecated.tsx +198 -198
  36. package/src/components/CheckButton.tsx +65 -65
  37. package/src/components/CircularController/CircularController.tsx +282 -282
  38. package/src/components/CraftBook/CraftBook.tsx +286 -286
  39. package/src/components/CraftBook/CraftingRecipe.tsx +161 -161
  40. package/src/components/CraftBook/MockItems.ts +101 -101
  41. package/src/components/DraggableContainer.tsx +180 -180
  42. package/src/components/DropdownSelectorContainer.tsx +42 -42
  43. package/src/components/Equipment/EquipmentSet.tsx +199 -199
  44. package/src/components/HistoryDialog.tsx +104 -104
  45. package/src/components/Input.tsx +15 -15
  46. package/src/components/InputRadio.tsx +41 -41
  47. package/src/components/Item/Cards/ItemInfo.tsx +298 -298
  48. package/src/components/Item/Cards/ItemInfoDisplay.tsx +135 -135
  49. package/src/components/Item/Cards/ItemInfoWrapper.tsx +62 -62
  50. package/src/components/Item/Cards/ItemTooltip.tsx +83 -83
  51. package/src/components/Item/Cards/MobileItemTooltip.tsx +149 -149
  52. package/src/components/Item/Inventory/ErrorBoundary.tsx +42 -42
  53. package/src/components/Item/Inventory/ItemContainer.tsx +231 -231
  54. package/src/components/Item/Inventory/ItemContainerTypes.ts +6 -6
  55. package/src/components/Item/Inventory/ItemQuantitySelector.tsx +138 -138
  56. package/src/components/Item/Inventory/ItemSlot.tsx +580 -580
  57. package/src/components/Item/Inventory/itemContainerHelper.ts +175 -175
  58. package/src/components/ListMenu.tsx +63 -63
  59. package/src/components/Marketplace/Marketplace.tsx +132 -132
  60. package/src/components/Marketplace/MarketplaceRows.tsx +171 -171
  61. package/src/components/Marketplace/__mocks__/index.tsx +65 -65
  62. package/src/components/Multitab/Tab.tsx +66 -66
  63. package/src/components/Multitab/TabBody.tsx +13 -13
  64. package/src/components/Multitab/TabsContainer.tsx +97 -97
  65. package/src/components/NPCDialog/NPCDialog.tsx +121 -121
  66. package/src/components/NPCDialog/NPCDialogText.tsx +113 -113
  67. package/src/components/NPCDialog/NPCMultiDialog.tsx +159 -159
  68. package/src/components/NPCDialog/QuestionDialog/QuestionDialog.tsx +237 -237
  69. package/src/components/ProgressBar.tsx +95 -92
  70. package/src/components/PropertySelect/PropertySelect.tsx +106 -106
  71. package/src/components/QuestInfo/QuestInfo.tsx +233 -233
  72. package/src/components/QuestList.tsx +135 -135
  73. package/src/components/RPGUIContainer.tsx +47 -47
  74. package/src/components/RPGUIForceRenderStart.tsx +45 -45
  75. package/src/components/RPGUIRoot.tsx +14 -14
  76. package/src/components/RadioButton.tsx +53 -53
  77. package/src/components/RadioInput/RadioButton.tsx +96 -96
  78. package/src/components/RadioInput/RadioInput.tsx +102 -102
  79. package/src/components/RadioInput/instruments.ts +15 -15
  80. package/src/components/RangeSlider.tsx +78 -78
  81. package/src/components/RelativeListMenu.tsx +90 -90
  82. package/src/components/ScrollList.tsx +79 -79
  83. package/src/components/Shortcuts/Shortcuts.tsx +193 -192
  84. package/src/components/Shortcuts/ShortcutsSetter.tsx +139 -139
  85. package/src/components/Shortcuts/SingleShortcut.ts +82 -82
  86. package/src/components/Shortcuts/useShortcutCooldown.ts +23 -23
  87. package/src/components/SimpleProgressBar.tsx +62 -62
  88. package/src/components/SkillProgressBar.tsx +133 -133
  89. package/src/components/SkillsContainer.tsx +220 -206
  90. package/src/components/Spellbook/Spell.tsx +236 -226
  91. package/src/components/Spellbook/Spellbook.tsx +161 -158
  92. package/src/components/Spellbook/cards/MobileSpellTooltip.tsx +137 -0
  93. package/src/components/Spellbook/cards/SpellInfo.tsx +134 -0
  94. package/src/components/Spellbook/cards/SpellInfoDisplay.tsx +31 -0
  95. package/src/components/Spellbook/cards/SpellInfoWrapper.tsx +48 -0
  96. package/src/components/Spellbook/cards/SpellTooltip.tsx +70 -0
  97. package/src/components/Spellbook/constants.ts +8 -8
  98. package/src/components/Spellbook/mockSpells.ts +85 -60
  99. package/src/components/StaticBook/StaticBook.tsx +103 -103
  100. package/src/components/TextArea.tsx +11 -11
  101. package/src/components/TimeWidget/DayNightPeriod/DayNightPeriod.tsx +35 -35
  102. package/src/components/TimeWidget/TimeWidget.tsx +65 -65
  103. package/src/components/TradingMenu/TradingItemRow.tsx +199 -199
  104. package/src/components/TradingMenu/TradingMenu.tsx +219 -219
  105. package/src/components/TradingMenu/items.mock.ts +48 -48
  106. package/src/components/Truncate.tsx +25 -25
  107. package/src/components/itemSelector/ItemSelector.tsx +136 -136
  108. package/src/components/shared/Column.tsx +16 -16
  109. package/src/components/shared/Ellipsis.tsx +68 -68
  110. package/src/components/shared/SpriteFromAtlas.tsx +104 -104
  111. package/src/components/typography/DynamicText.tsx +49 -49
  112. package/src/constants/uiColors.ts +20 -20
  113. package/src/constants/uiDevices.ts +3 -3
  114. package/src/constants/uiFonts.ts +12 -12
  115. package/src/hooks/useEventListener.ts +21 -21
  116. package/src/hooks/useOutsideAlerter.ts +25 -25
  117. package/src/index.tsx +42 -42
  118. package/src/libs/CastingTypeHelper.ts +8 -0
  119. package/src/libs/StringHelpers.ts +3 -3
  120. package/src/libs/itemCounter.ts +21 -21
  121. package/src/mocks/atlas/entities/entities.json +20215 -20215
  122. package/src/mocks/atlas/icons/icons.json +735 -735
  123. package/src/mocks/atlas/items/items.json +12086 -12086
  124. package/src/mocks/equipmentSet.mocks.ts +391 -391
  125. package/src/mocks/itemContainer.mocks.ts +605 -605
  126. package/src/mocks/skills.mocks.ts +128 -128
  127. package/src/stories/Arrow.stories.tsx +26 -26
  128. package/src/stories/Button.stories.tsx +36 -36
  129. package/src/stories/CharacterSelection.stories.tsx +44 -44
  130. package/src/stories/CharacterStatus.stories.tsx +29 -29
  131. package/src/stories/Chat.stories.tsx +187 -187
  132. package/src/stories/ChatDeprecated.stories.tsx +170 -170
  133. package/src/stories/CheckButton.stories.tsx +48 -48
  134. package/src/stories/CircullarController.stories.tsx +37 -37
  135. package/src/stories/CraftBook.stories.tsx +42 -42
  136. package/src/stories/DayNightPeriod.stories.tsx +27 -27
  137. package/src/stories/DraggableContainer.stories.tsx +28 -28
  138. package/src/stories/Dropdown.stories.tsx +46 -46
  139. package/src/stories/DropdownSelectorContainer.stories.tsx +41 -41
  140. package/src/stories/EquipmentSet.stories.tsx +65 -65
  141. package/src/stories/HistoryDialog.stories.tsx +61 -61
  142. package/src/stories/ItemContainer.stories.tsx +201 -201
  143. package/src/stories/ItemInfoDisplay.stories.tsx +33 -33
  144. package/src/stories/ItemQuantitySelector.stories.tsx +26 -26
  145. package/src/stories/ItemSelector.stories.tsx +77 -77
  146. package/src/stories/ItemTradingComponent.stories.tsx +35 -35
  147. package/src/stories/ListMenu.stories.tsx +56 -56
  148. package/src/stories/Marketplace.stories.tsx +42 -42
  149. package/src/stories/MarketplaceRows.stories.tsx +28 -28
  150. package/src/stories/Multitab.stories.tsx +51 -51
  151. package/src/stories/NPCDialog.stories.tsx +130 -130
  152. package/src/stories/NPCMultiDialog.stories.tsx +71 -71
  153. package/src/stories/ProgressBar.stories.tsx +23 -23
  154. package/src/stories/PropertySelect.stories.tsx +40 -40
  155. package/src/stories/QuestInfo.stories.tsx +107 -107
  156. package/src/stories/QuestList.stories.tsx +82 -82
  157. package/src/stories/RPGUIContainers.stories.tsx +42 -42
  158. package/src/stories/RadioButton.stories.tsx +49 -49
  159. package/src/stories/RadioInput.stories.tsx +34 -34
  160. package/src/stories/RangeSlider.stories.tsx +64 -64
  161. package/src/stories/ScrollList.stories.tsx +85 -85
  162. package/src/stories/Shortcuts.stories.tsx +39 -39
  163. package/src/stories/SimpleProgressBar.stories.tsx +22 -22
  164. package/src/stories/SkillProgressBar.stories.tsx +34 -34
  165. package/src/stories/SkillsContainer.stories.tsx +35 -35
  166. package/src/stories/SpellInfoDisplay.stories.tsx +27 -0
  167. package/src/stories/Spellbook.stories.tsx +104 -104
  168. package/src/stories/StaticBook.stories.tsx +32 -32
  169. package/src/stories/Text.stories.tsx +42 -42
  170. package/src/stories/TimeWidget.stories.tsx +27 -27
  171. package/src/stories/TradingMenu.stories.tsx +47 -47
  172. package/src/types/eventTypes.ts +4 -4
  173. package/src/types/index.d.ts +2 -2
@@ -1,130 +1,130 @@
1
- import { Meta, Story } from '@storybook/react';
2
- import React from 'react';
3
- import {
4
- INPCDialogProps,
5
- NPCDialog,
6
- NPCDialogType,
7
- } from '../../src/components/NPCDialog/NPCDialog';
8
- import {
9
- IQuestionDialog,
10
- IQuestionDialogAnswer,
11
- } from '../../src/components/NPCDialog/QuestionDialog/QuestionDialog';
12
- import { RPGUIRoot } from '../../src/components/RPGUIRoot';
13
-
14
- const meta: Meta = {
15
- title: 'NPC Dialog',
16
- component: NPCDialog,
17
- argTypes: {
18
- text: {
19
- control: {
20
- type: 'text',
21
- },
22
- },
23
-
24
- type: {
25
- control: {
26
- type: 'select',
27
- labels: {
28
- [NPCDialogType.TextOnly]: 'Text Only',
29
- [NPCDialogType.TextAndThumbnail]: 'Text and Thumbnail',
30
- },
31
- },
32
- },
33
- },
34
- parameters: {
35
- controls: { expanded: true },
36
- },
37
- };
38
-
39
- export default meta;
40
-
41
- const Template: Story<INPCDialogProps> = args => (
42
- <RPGUIRoot>
43
- <NPCDialog {...args} />
44
- </RPGUIRoot>
45
- );
46
-
47
- // By passing using the Args format for exported stories, you can control the props for a component for reuse in a test
48
- // https://storybook.js.org/docs/react/workflows/unit-testing
49
- export const TextAndThumbnail = Template.bind({});
50
-
51
- TextAndThumbnail.args = {
52
- text: `This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player.`,
53
- type: NPCDialogType.TextAndThumbnail,
54
- };
55
-
56
- export const TextOnly = Template.bind({});
57
-
58
- TextOnly.args = {
59
- text: `This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player.`,
60
- type: NPCDialogType.TextOnly,
61
- };
62
-
63
- export const Question = Template.bind({});
64
-
65
- const answers: IQuestionDialogAnswer[] = [
66
- {
67
- id: 1,
68
- text: 'I have lived here all my life',
69
- nextQuestionId: 2,
70
- },
71
- {
72
- id: 2,
73
- text: 'I came here from Newton',
74
- nextQuestionId: 3,
75
- },
76
- {
77
- id: 3,
78
- text: 'Oops! I mean, SpringVille!',
79
- nextQuestionId: 2,
80
- },
81
- {
82
- id: 4,
83
- text: 'I havent heard about any trouble',
84
- nextQuestionId: 4,
85
- },
86
- {
87
- id: 5,
88
- text: 'Who came here to die',
89
- nextQuestionId: 4,
90
- },
91
- {
92
- id: 6,
93
- text: 'Who came here to live',
94
- nextQuestionId: 4,
95
- },
96
- ];
97
-
98
- const questions: IQuestionDialog[] = [
99
- {
100
- id: 1,
101
- text: `You dont Look Like from around here. Aren't you?`,
102
- answerIds: [1, 2],
103
- },
104
- {
105
- id: 2,
106
- text: 'Oh really!! then You must know my Bowler!',
107
- answerIds: [5, 6],
108
- },
109
- {
110
- id: 3,
111
- text: 'Newton!! I heard there is trouble brewing down here!!',
112
- answerIds: [3, 4],
113
- },
114
- {
115
- id: 4,
116
- text:
117
- 'Dont you worry about it, say thats you have something to eat. Im starving',
118
- },
119
- {
120
- id: 5,
121
- text: 'You are a liar! there aint mr Browler! I made it',
122
- },
123
- ];
124
-
125
- Question.args = {
126
- type: NPCDialogType.TextAndThumbnail,
127
- questions,
128
- answers,
129
- isQuestionDialog: true,
130
- };
1
+ import { Meta, Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import {
4
+ INPCDialogProps,
5
+ NPCDialog,
6
+ NPCDialogType,
7
+ } from '../../src/components/NPCDialog/NPCDialog';
8
+ import {
9
+ IQuestionDialog,
10
+ IQuestionDialogAnswer,
11
+ } from '../../src/components/NPCDialog/QuestionDialog/QuestionDialog';
12
+ import { RPGUIRoot } from '../../src/components/RPGUIRoot';
13
+
14
+ const meta: Meta = {
15
+ title: 'NPC Dialog',
16
+ component: NPCDialog,
17
+ argTypes: {
18
+ text: {
19
+ control: {
20
+ type: 'text',
21
+ },
22
+ },
23
+
24
+ type: {
25
+ control: {
26
+ type: 'select',
27
+ labels: {
28
+ [NPCDialogType.TextOnly]: 'Text Only',
29
+ [NPCDialogType.TextAndThumbnail]: 'Text and Thumbnail',
30
+ },
31
+ },
32
+ },
33
+ },
34
+ parameters: {
35
+ controls: { expanded: true },
36
+ },
37
+ };
38
+
39
+ export default meta;
40
+
41
+ const Template: Story<INPCDialogProps> = args => (
42
+ <RPGUIRoot>
43
+ <NPCDialog {...args} />
44
+ </RPGUIRoot>
45
+ );
46
+
47
+ // By passing using the Args format for exported stories, you can control the props for a component for reuse in a test
48
+ // https://storybook.js.org/docs/react/workflows/unit-testing
49
+ export const TextAndThumbnail = Template.bind({});
50
+
51
+ TextAndThumbnail.args = {
52
+ text: `This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player.`,
53
+ type: NPCDialogType.TextAndThumbnail,
54
+ };
55
+
56
+ export const TextOnly = Template.bind({});
57
+
58
+ TextOnly.args = {
59
+ text: `This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player. This is a NPC dialog example. You can use it to show a dialog to the player.`,
60
+ type: NPCDialogType.TextOnly,
61
+ };
62
+
63
+ export const Question = Template.bind({});
64
+
65
+ const answers: IQuestionDialogAnswer[] = [
66
+ {
67
+ id: 1,
68
+ text: 'I have lived here all my life',
69
+ nextQuestionId: 2,
70
+ },
71
+ {
72
+ id: 2,
73
+ text: 'I came here from Newton',
74
+ nextQuestionId: 3,
75
+ },
76
+ {
77
+ id: 3,
78
+ text: 'Oops! I mean, SpringVille!',
79
+ nextQuestionId: 2,
80
+ },
81
+ {
82
+ id: 4,
83
+ text: 'I havent heard about any trouble',
84
+ nextQuestionId: 4,
85
+ },
86
+ {
87
+ id: 5,
88
+ text: 'Who came here to die',
89
+ nextQuestionId: 4,
90
+ },
91
+ {
92
+ id: 6,
93
+ text: 'Who came here to live',
94
+ nextQuestionId: 4,
95
+ },
96
+ ];
97
+
98
+ const questions: IQuestionDialog[] = [
99
+ {
100
+ id: 1,
101
+ text: `You dont Look Like from around here. Aren't you?`,
102
+ answerIds: [1, 2],
103
+ },
104
+ {
105
+ id: 2,
106
+ text: 'Oh really!! then You must know my Bowler!',
107
+ answerIds: [5, 6],
108
+ },
109
+ {
110
+ id: 3,
111
+ text: 'Newton!! I heard there is trouble brewing down here!!',
112
+ answerIds: [3, 4],
113
+ },
114
+ {
115
+ id: 4,
116
+ text:
117
+ 'Dont you worry about it, say thats you have something to eat. Im starving',
118
+ },
119
+ {
120
+ id: 5,
121
+ text: 'You are a liar! there aint mr Browler! I made it',
122
+ },
123
+ ];
124
+
125
+ Question.args = {
126
+ type: NPCDialogType.TextAndThumbnail,
127
+ questions,
128
+ answers,
129
+ isQuestionDialog: true,
130
+ };
@@ -1,71 +1,71 @@
1
- import { Meta, Story } from '@storybook/react';
2
- import React from 'react';
3
- import { RPGUIRoot } from '../../src/components/RPGUIRoot';
4
- import aliceDefaultThumbnail from '../components/NPCDialog/img/npcDialog/npcThumbnails/alice.png';
5
- import {
6
- ImgSide,
7
- INPCMultiDialogProps,
8
- NPCMultiDialog,
9
- NPCMultiDialogType,
10
- } from '../components/NPCDialog/NPCMultiDialog';
11
-
12
- const meta: Meta = {
13
- title: 'NPC MultiDialog',
14
- component: NPCMultiDialog,
15
- argTypes: {
16
- text: {
17
- control: {
18
- type: 'text',
19
- },
20
- },
21
- // ImgSide: {
22
- // control: {
23
- // type: 'select',
24
- // label: {
25
- // [ImgSide.right]: 'right',
26
- // [ImgSide.left]: 'left',
27
- // },
28
- // },
29
- // },
30
- imagePath: {
31
- control: {
32
- type: 'text',
33
- },
34
- },
35
- },
36
- };
37
-
38
- export default meta;
39
-
40
- const Template: Story<INPCMultiDialogProps> = args => (
41
- <RPGUIRoot>
42
- <NPCMultiDialog {...args} />
43
- </RPGUIRoot>
44
- );
45
-
46
- export const NPCMultiDialogStore = Template.bind({});
47
-
48
- // By passing using the Args format for exported stories, you can control the props for a component for reuse in a test
49
- // https://storybook.js.org/docs/react/workflows/unit-testing
50
-
51
- const textAndTypeArray: NPCMultiDialogType[] = [
52
- {
53
- text: 'I have lived here all my life',
54
- imagePath: aliceDefaultThumbnail,
55
- imageSide: ImgSide.right,
56
- },
57
- {
58
- text: 'I have lived here all my life',
59
- imagePath: aliceDefaultThumbnail,
60
- imageSide: ImgSide.left,
61
- },
62
- {
63
- text: 'I have lived here all my life',
64
- imagePath: aliceDefaultThumbnail,
65
- imageSide: ImgSide.right,
66
- },
67
- ];
68
-
69
- NPCMultiDialogStore.args = {
70
- textAndTypeArray,
71
- };
1
+ import { Meta, Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import { RPGUIRoot } from '../../src/components/RPGUIRoot';
4
+ import aliceDefaultThumbnail from '../components/NPCDialog/img/npcDialog/npcThumbnails/alice.png';
5
+ import {
6
+ ImgSide,
7
+ INPCMultiDialogProps,
8
+ NPCMultiDialog,
9
+ NPCMultiDialogType,
10
+ } from '../components/NPCDialog/NPCMultiDialog';
11
+
12
+ const meta: Meta = {
13
+ title: 'NPC MultiDialog',
14
+ component: NPCMultiDialog,
15
+ argTypes: {
16
+ text: {
17
+ control: {
18
+ type: 'text',
19
+ },
20
+ },
21
+ // ImgSide: {
22
+ // control: {
23
+ // type: 'select',
24
+ // label: {
25
+ // [ImgSide.right]: 'right',
26
+ // [ImgSide.left]: 'left',
27
+ // },
28
+ // },
29
+ // },
30
+ imagePath: {
31
+ control: {
32
+ type: 'text',
33
+ },
34
+ },
35
+ },
36
+ };
37
+
38
+ export default meta;
39
+
40
+ const Template: Story<INPCMultiDialogProps> = args => (
41
+ <RPGUIRoot>
42
+ <NPCMultiDialog {...args} />
43
+ </RPGUIRoot>
44
+ );
45
+
46
+ export const NPCMultiDialogStore = Template.bind({});
47
+
48
+ // By passing using the Args format for exported stories, you can control the props for a component for reuse in a test
49
+ // https://storybook.js.org/docs/react/workflows/unit-testing
50
+
51
+ const textAndTypeArray: NPCMultiDialogType[] = [
52
+ {
53
+ text: 'I have lived here all my life',
54
+ imagePath: aliceDefaultThumbnail,
55
+ imageSide: ImgSide.right,
56
+ },
57
+ {
58
+ text: 'I have lived here all my life',
59
+ imagePath: aliceDefaultThumbnail,
60
+ imageSide: ImgSide.left,
61
+ },
62
+ {
63
+ text: 'I have lived here all my life',
64
+ imagePath: aliceDefaultThumbnail,
65
+ imageSide: ImgSide.right,
66
+ },
67
+ ];
68
+
69
+ NPCMultiDialogStore.args = {
70
+ textAndTypeArray,
71
+ };
@@ -1,23 +1,23 @@
1
- import { Story } from '@storybook/react';
2
- import React from 'react';
3
- import { IBarProps, ProgressBar } from '../../src/components/ProgressBar';
4
- import { RPGUIRoot } from '../../src/components/RPGUIRoot';
5
-
6
- export default {
7
- title: 'Progress Bar',
8
- component: ProgressBar,
9
- };
10
-
11
- const Template: Story<IBarProps> = args => (
12
- <RPGUIRoot>
13
- <ProgressBar {...args} />
14
- </RPGUIRoot>
15
- );
16
-
17
- export const Default = Template.bind({});
18
-
19
- Default.args = {
20
- max: 100,
21
- value: 30,
22
- color: 'blue',
23
- };
1
+ import { Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import { IBarProps, ProgressBar } from '../../src/components/ProgressBar';
4
+ import { RPGUIRoot } from '../../src/components/RPGUIRoot';
5
+
6
+ export default {
7
+ title: 'Progress Bar',
8
+ component: ProgressBar,
9
+ };
10
+
11
+ const Template: Story<IBarProps> = args => (
12
+ <RPGUIRoot>
13
+ <ProgressBar {...args} />
14
+ </RPGUIRoot>
15
+ );
16
+
17
+ export const Default = Template.bind({});
18
+
19
+ Default.args = {
20
+ max: 100,
21
+ value: 30,
22
+ color: 'blue',
23
+ };
@@ -1,40 +1,40 @@
1
- import { Meta, Story } from '@storybook/react';
2
- import React from 'react';
3
- import { RPGUIRoot } from '..';
4
- import PropertySelect, {
5
- IPropertySelectProps,
6
- } from '../components/PropertySelect/PropertySelect';
7
-
8
- const meta: Meta = {
9
- title: 'Property Select',
10
- component: PropertySelect,
11
- };
12
-
13
- export default meta;
14
-
15
- const Template: Story<IPropertySelectProps> = args => (
16
- <RPGUIRoot>
17
- <PropertySelect {...args} />
18
- </RPGUIRoot>
19
- );
20
-
21
- export const Default = Template.bind({});
22
-
23
- const propertiesMock = [
24
- {
25
- id: '2b716274-b19c-451d-9561-16bca8c6a12d',
26
- name: 'Vegetables',
27
- },
28
- {
29
- id: '536789bd-38fb-48f9-8903-dad86f276d47',
30
- name: 'Counseling',
31
- },
32
- {
33
- id: '80f07029-b907-4fae-872e-4f2b569f81c9',
34
- name: 'Through',
35
- },
36
- ];
37
-
38
- Default.args = {
39
- availableProperties: propertiesMock,
40
- };
1
+ import { Meta, Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import { RPGUIRoot } from '..';
4
+ import PropertySelect, {
5
+ IPropertySelectProps,
6
+ } from '../components/PropertySelect/PropertySelect';
7
+
8
+ const meta: Meta = {
9
+ title: 'Property Select',
10
+ component: PropertySelect,
11
+ };
12
+
13
+ export default meta;
14
+
15
+ const Template: Story<IPropertySelectProps> = args => (
16
+ <RPGUIRoot>
17
+ <PropertySelect {...args} />
18
+ </RPGUIRoot>
19
+ );
20
+
21
+ export const Default = Template.bind({});
22
+
23
+ const propertiesMock = [
24
+ {
25
+ id: '2b716274-b19c-451d-9561-16bca8c6a12d',
26
+ name: 'Vegetables',
27
+ },
28
+ {
29
+ id: '536789bd-38fb-48f9-8903-dad86f276d47',
30
+ name: 'Counseling',
31
+ },
32
+ {
33
+ id: '80f07029-b907-4fae-872e-4f2b569f81c9',
34
+ name: 'Through',
35
+ },
36
+ ];
37
+
38
+ Default.args = {
39
+ availableProperties: propertiesMock,
40
+ };