@rpg-engine/long-bow 0.3.71 → 0.3.73

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 (158) hide show
  1. package/LICENSE +20 -20
  2. package/README.md +181 -181
  3. package/dist/components/CraftBook/CraftBook.d.ts +1 -2
  4. package/dist/components/Item/Cards/ItemTooltip.d.ts +4 -7
  5. package/dist/components/Item/Inventory/ItemContainer.d.ts +1 -2
  6. package/dist/components/Item/Inventory/ItemSlot.d.ts +1 -4
  7. package/dist/components/TradingMenu/TradingItemRow.d.ts +1 -2
  8. package/dist/components/TradingMenu/TradingMenu.d.ts +3 -4
  9. package/dist/components/shared/SpriteFromAtlas.d.ts +0 -1
  10. package/dist/long-bow.cjs.development.js +958 -1225
  11. package/dist/long-bow.cjs.development.js.map +1 -1
  12. package/dist/long-bow.cjs.production.min.js +1 -1
  13. package/dist/long-bow.cjs.production.min.js.map +1 -1
  14. package/dist/long-bow.esm.js +961 -1226
  15. package/dist/long-bow.esm.js.map +1 -1
  16. package/dist/stories/TradingMenu.stories.d.ts +2 -2
  17. package/package.json +100 -100
  18. package/src/components/Abstractions/SlotsContainer.tsx +45 -45
  19. package/src/components/Arrow/SelectArrow.tsx +69 -69
  20. package/src/components/Arrow/img/arrow01-left-clicked.png +0 -0
  21. package/src/components/Arrow/img/arrow01-left.png +0 -0
  22. package/src/components/Arrow/img/arrow01-right-clicked.png +0 -0
  23. package/src/components/Arrow/img/arrow01-right.png +0 -0
  24. package/src/components/Arrow/img/arrow02-left-clicked.png +0 -0
  25. package/src/components/Arrow/img/arrow02-left.png +0 -0
  26. package/src/components/Arrow/img/arrow02-right-clicked.png +0 -0
  27. package/src/components/Arrow/img/arrow02-right.png +0 -0
  28. package/src/components/Button.tsx +40 -40
  29. package/src/components/Character/CharacterSelection.tsx +96 -96
  30. package/src/components/CharacterStatus/CharacterStatus.tsx +120 -120
  31. package/src/components/Chat/Chat.tsx +195 -195
  32. package/src/components/Chatdeprecated/ChatDeprecated.tsx +198 -198
  33. package/src/components/CheckButton.tsx +65 -65
  34. package/src/components/CircularController/CircularController.tsx +248 -248
  35. package/src/components/CraftBook/CraftBook.tsx +227 -237
  36. package/src/components/CraftBook/MockItems.ts +251 -41
  37. package/src/components/DraggableContainer.tsx +153 -153
  38. package/src/components/Dropdown.tsx +90 -90
  39. package/src/components/DropdownSelectorContainer.tsx +42 -42
  40. package/src/components/Equipment/EquipmentSet.tsx +190 -190
  41. package/src/components/HistoryDialog.tsx +104 -104
  42. package/src/components/Input.tsx +15 -15
  43. package/src/components/Item/Cards/ItemTooltip.tsx +33 -85
  44. package/src/components/Item/Inventory/ErrorBoundary.tsx +42 -42
  45. package/src/components/Item/Inventory/ItemContainer.tsx +210 -214
  46. package/src/components/Item/Inventory/ItemContainerTypes.ts +6 -6
  47. package/src/components/Item/Inventory/ItemQuantitySelector.tsx +138 -138
  48. package/src/components/Item/Inventory/ItemSlot.tsx +501 -512
  49. package/src/components/Item/Inventory/itemContainerHelper.ts +156 -156
  50. package/src/components/ListMenu.tsx +63 -63
  51. package/src/components/Multitab/Tab.tsx +66 -66
  52. package/src/components/Multitab/TabBody.tsx +13 -13
  53. package/src/components/Multitab/TabsContainer.tsx +97 -97
  54. package/src/components/NPCDialog/NPCDialog.tsx +121 -121
  55. package/src/components/NPCDialog/NPCDialogText.tsx +113 -113
  56. package/src/components/NPCDialog/NPCMultiDialog.tsx +159 -159
  57. package/src/components/NPCDialog/QuestionDialog/QuestionDialog.tsx +237 -237
  58. package/src/components/ProgressBar.tsx +92 -92
  59. package/src/components/PropertySelect/PropertySelect.tsx +106 -106
  60. package/src/components/QuestInfo/QuestInfo.tsx +230 -230
  61. package/src/components/QuestList.tsx +129 -129
  62. package/src/components/RPGUIContainer.tsx +47 -47
  63. package/src/components/RPGUIForceRenderStart.tsx +45 -45
  64. package/src/components/RPGUIRoot.tsx +14 -14
  65. package/src/components/RadioButton.tsx +53 -53
  66. package/src/components/RadioInput/RadioButton.tsx +96 -96
  67. package/src/components/RadioInput/RadioInput.tsx +102 -102
  68. package/src/components/RadioInput/instruments.ts +15 -15
  69. package/src/components/RangeSlider.tsx +78 -78
  70. package/src/components/RelativeListMenu.tsx +83 -83
  71. package/src/components/ScrollList.tsx +79 -79
  72. package/src/components/Shortcuts/Shortcuts.tsx +151 -151
  73. package/src/components/Shortcuts/ShortcutsSetter.tsx +132 -132
  74. package/src/components/Shortcuts/SingleShortcut.ts +62 -62
  75. package/src/components/SimpleProgressBar.tsx +62 -62
  76. package/src/components/SkillProgressBar.tsx +133 -133
  77. package/src/components/SkillsContainer.tsx +200 -198
  78. package/src/components/Spellbook/Spell.tsx +201 -201
  79. package/src/components/Spellbook/Spellbook.tsx +150 -150
  80. package/src/components/Spellbook/constants.ts +8 -8
  81. package/src/components/Spellbook/mockSpells.ts +60 -60
  82. package/src/components/StaticBook/StaticBook.tsx +103 -103
  83. package/src/components/TextArea.tsx +11 -11
  84. package/src/components/TimeWidget/DayNightPeriod/DayNightPeriod.tsx +35 -35
  85. package/src/components/TimeWidget/TimeWidget.tsx +63 -63
  86. package/src/components/TradingMenu/TradingItemRow.tsx +181 -195
  87. package/src/components/TradingMenu/TradingMenu.tsx +203 -211
  88. package/src/components/TradingMenu/items.mock.ts +96 -48
  89. package/src/components/Truncate.tsx +25 -25
  90. package/src/components/itemSelector/ItemSelector.tsx +136 -136
  91. package/src/components/shared/Column.tsx +16 -16
  92. package/src/components/shared/Ellipsis.tsx +65 -65
  93. package/src/components/shared/SpriteFromAtlas.tsx +102 -104
  94. package/src/components/typography/DynamicText.tsx +49 -49
  95. package/src/constants/uiColors.ts +20 -20
  96. package/src/constants/uiDevices.ts +3 -3
  97. package/src/constants/uiFonts.ts +12 -12
  98. package/src/hooks/useEventListener.ts +21 -21
  99. package/src/hooks/useOutsideAlerter.ts +25 -25
  100. package/src/index.tsx +40 -40
  101. package/src/libs/StringHelpers.ts +3 -3
  102. package/src/mocks/atlas/entities/entities.json +20215 -20215
  103. package/src/mocks/atlas/icons/icons.json +735 -735
  104. package/src/mocks/atlas/items/items.json +12086 -12086
  105. package/src/mocks/equipmentSet.mocks.ts +393 -391
  106. package/src/mocks/itemContainer.mocks.ts +562 -563
  107. package/src/mocks/skills.mocks.ts +128 -128
  108. package/src/stories/Arrow.stories.tsx +26 -26
  109. package/src/stories/Button.stories.tsx +36 -36
  110. package/src/stories/CharacterSelection.stories.tsx +45 -45
  111. package/src/stories/CharacterStatus.stories.tsx +29 -29
  112. package/src/stories/Chat.stories.tsx +187 -187
  113. package/src/stories/ChatDeprecated.stories.tsx +170 -170
  114. package/src/stories/CheckButton.stories.tsx +48 -48
  115. package/src/stories/CircullarController.stories.tsx +37 -37
  116. package/src/stories/CraftBook.stories.tsx +40 -42
  117. package/src/stories/DayNightPeriod.stories.tsx +27 -27
  118. package/src/stories/DraggableContainer.stories.tsx +28 -28
  119. package/src/stories/Dropdown.stories.tsx +46 -46
  120. package/src/stories/DropdownSelectorContainer.stories.tsx +41 -41
  121. package/src/stories/EquipmentSet.stories.tsx +65 -65
  122. package/src/stories/HistoryDialog.stories.tsx +61 -61
  123. package/src/stories/ItemContainer.stories.tsx +198 -200
  124. package/src/stories/ItemQuantitySelector.stories.tsx +26 -26
  125. package/src/stories/ItemSelector.stories.tsx +77 -77
  126. package/src/stories/ItemTradingComponent.stories.tsx +35 -35
  127. package/src/stories/ListMenu.stories.tsx +56 -56
  128. package/src/stories/Multitab.stories.tsx +51 -51
  129. package/src/stories/NPCDialog.stories.tsx +130 -130
  130. package/src/stories/NPCMultiDialog.stories.tsx +71 -71
  131. package/src/stories/ProgressBar.stories.tsx +23 -23
  132. package/src/stories/PropertySelect.stories.tsx +40 -40
  133. package/src/stories/QuestInfo.stories.tsx +107 -107
  134. package/src/stories/QuestList.stories.tsx +82 -82
  135. package/src/stories/RPGUIContainers.stories.tsx +42 -42
  136. package/src/stories/RadioButton.stories.tsx +49 -49
  137. package/src/stories/RadioInput.stories.tsx +34 -34
  138. package/src/stories/RangeSlider.stories.tsx +64 -64
  139. package/src/stories/ScrollList.stories.tsx +85 -85
  140. package/src/stories/Shortcuts.stories.tsx +39 -39
  141. package/src/stories/SimpleProgressBar.stories.tsx +22 -22
  142. package/src/stories/SkillProgressBar.stories.tsx +34 -34
  143. package/src/stories/SkillsContainer.stories.tsx +35 -35
  144. package/src/stories/Spellbook.stories.tsx +104 -104
  145. package/src/stories/StaticBook.stories.tsx +32 -32
  146. package/src/stories/Text.stories.tsx +42 -42
  147. package/src/stories/TimeWidget.stories.tsx +27 -27
  148. package/src/stories/TradingMenu.stories.tsx +45 -47
  149. package/src/types/eventTypes.ts +4 -4
  150. package/src/types/index.d.ts +2 -2
  151. package/dist/components/Item/Cards/ItemInfo.d.ts +0 -10
  152. package/dist/components/Item/Cards/ItemInfoDisplay.d.ts +0 -9
  153. package/dist/components/Item/Cards/ItemInfoWrapper.d.ts +0 -11
  154. package/dist/stories/ItemInfoDisplay.stories.d.ts +0 -8
  155. package/src/components/Item/Cards/ItemInfo.tsx +0 -248
  156. package/src/components/Item/Cards/ItemInfoDisplay.tsx +0 -120
  157. package/src/components/Item/Cards/ItemInfoWrapper.tsx +0 -39
  158. package/src/stories/ItemInfoDisplay.stories.tsx +0 -33
@@ -1,28 +1,28 @@
1
- import { Meta, Story } from '@storybook/react';
2
- import React from 'react';
3
- import {
4
- DraggableContainer,
5
- IDraggableContainerProps,
6
- } from '../../src/components/DraggableContainer';
7
- import { RPGUIRoot } from '../../src/components/RPGUIRoot';
8
-
9
- const meta: Meta = {
10
- title: 'Draggable Container',
11
- component: DraggableContainer,
12
- };
13
-
14
- export default meta;
15
-
16
- const Template: Story<IDraggableContainerProps> = args => (
17
- <RPGUIRoot>
18
- <DraggableContainer {...args} />
19
- </RPGUIRoot>
20
- );
21
-
22
- export const Default = Template.bind({});
23
-
24
- Default.args = {
25
- title: 'Example',
26
- onCloseButton: () => console.log('closing'),
27
- children: <p>This is a draggable container!</p>,
28
- };
1
+ import { Meta, Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import {
4
+ DraggableContainer,
5
+ IDraggableContainerProps,
6
+ } from '../../src/components/DraggableContainer';
7
+ import { RPGUIRoot } from '../../src/components/RPGUIRoot';
8
+
9
+ const meta: Meta = {
10
+ title: 'Draggable Container',
11
+ component: DraggableContainer,
12
+ };
13
+
14
+ export default meta;
15
+
16
+ const Template: Story<IDraggableContainerProps> = args => (
17
+ <RPGUIRoot>
18
+ <DraggableContainer {...args} />
19
+ </RPGUIRoot>
20
+ );
21
+
22
+ export const Default = Template.bind({});
23
+
24
+ Default.args = {
25
+ title: 'Example',
26
+ onCloseButton: () => console.log('closing'),
27
+ children: <p>This is a draggable container!</p>,
28
+ };
@@ -1,46 +1,46 @@
1
- import { Meta, Story } from '@storybook/react';
2
- import React from 'react';
3
- import { RPGUIRoot } from '../../src';
4
- import {
5
- Dropdown,
6
- IDropdownProps,
7
- IOptionsProps,
8
- } from '../../src/components/Dropdown';
9
-
10
- const meta: Meta = {
11
- title: 'Dropdown',
12
- component: Dropdown,
13
- };
14
-
15
- export default meta;
16
-
17
- const Template: Story<IDropdownProps> = args => (
18
- <RPGUIRoot>
19
- <Dropdown {...args} />
20
- </RPGUIRoot>
21
- );
22
-
23
- export const Default = Template.bind({});
24
-
25
- const options: IOptionsProps[] = [
26
- {
27
- id: 1,
28
- value: 'Human',
29
- option: 'Human',
30
- },
31
- {
32
- id: 2,
33
- value: 'Elfo',
34
- option: 'Elfo',
35
- },
36
- {
37
- id: 3,
38
- value: 'Dragão',
39
- option: 'Dragão',
40
- },
41
- ];
42
-
43
- Default.args = {
44
- options,
45
- width: '100%',
46
- };
1
+ import { Meta, Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import { RPGUIRoot } from '../../src';
4
+ import {
5
+ Dropdown,
6
+ IDropdownProps,
7
+ IOptionsProps,
8
+ } from '../../src/components/Dropdown';
9
+
10
+ const meta: Meta = {
11
+ title: 'Dropdown',
12
+ component: Dropdown,
13
+ };
14
+
15
+ export default meta;
16
+
17
+ const Template: Story<IDropdownProps> = args => (
18
+ <RPGUIRoot>
19
+ <Dropdown {...args} />
20
+ </RPGUIRoot>
21
+ );
22
+
23
+ export const Default = Template.bind({});
24
+
25
+ const options: IOptionsProps[] = [
26
+ {
27
+ id: 1,
28
+ value: 'Human',
29
+ option: 'Human',
30
+ },
31
+ {
32
+ id: 2,
33
+ value: 'Elfo',
34
+ option: 'Elfo',
35
+ },
36
+ {
37
+ id: 3,
38
+ value: 'Dragão',
39
+ option: 'Dragão',
40
+ },
41
+ ];
42
+
43
+ Default.args = {
44
+ options,
45
+ width: '100%',
46
+ };
@@ -1,41 +1,41 @@
1
- import { Meta, Story } from '@storybook/react';
2
- import React from 'react';
3
- import { RPGUIRoot } from '..';
4
- import {
5
- DropdownSelectorContainer,
6
- IDropdownSelectorContainer,
7
- } from '../components/DropdownSelectorContainer';
8
-
9
- const meta: Meta = {
10
- title: 'DropdownSelectorContainer',
11
- component: DropdownSelectorContainer,
12
- };
13
-
14
- export default meta;
15
-
16
- const Template: Story<IDropdownSelectorContainer> = args => (
17
- <RPGUIRoot>
18
- <DropdownSelectorContainer {...args} details="There are server details" />
19
- </RPGUIRoot>
20
- );
21
-
22
- export const Default = Template.bind({});
23
-
24
- Default.args = {
25
- title: 'Choose a server',
26
- onChange: () => {},
27
- options: [
28
- {
29
- id: 'europe-germany',
30
- name: 'Europe (Germany)',
31
- },
32
- {
33
- id: 'europe-uk',
34
- name: 'Europe (UK)',
35
- },
36
- {
37
- id: 'america-us',
38
- name: 'America',
39
- },
40
- ],
41
- };
1
+ import { Meta, Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import { RPGUIRoot } from '..';
4
+ import {
5
+ DropdownSelectorContainer,
6
+ IDropdownSelectorContainer,
7
+ } from '../components/DropdownSelectorContainer';
8
+
9
+ const meta: Meta = {
10
+ title: 'DropdownSelectorContainer',
11
+ component: DropdownSelectorContainer,
12
+ };
13
+
14
+ export default meta;
15
+
16
+ const Template: Story<IDropdownSelectorContainer> = args => (
17
+ <RPGUIRoot>
18
+ <DropdownSelectorContainer {...args} details="There are server details" />
19
+ </RPGUIRoot>
20
+ );
21
+
22
+ export const Default = Template.bind({});
23
+
24
+ Default.args = {
25
+ title: 'Choose a server',
26
+ onChange: () => {},
27
+ options: [
28
+ {
29
+ id: 'europe-germany',
30
+ name: 'Europe (Germany)',
31
+ },
32
+ {
33
+ id: 'europe-uk',
34
+ name: 'Europe (UK)',
35
+ },
36
+ {
37
+ id: 'america-us',
38
+ name: 'America',
39
+ },
40
+ ],
41
+ };
@@ -1,65 +1,65 @@
1
- import { IItem, ItemContainerType, ItemType } from '@rpg-engine/shared';
2
- import { Meta, Story } from '@storybook/react';
3
- import React from 'react';
4
- import {
5
- EquipmentSet,
6
- IEquipmentSetProps,
7
- } from '../../src/components/Equipment/EquipmentSet';
8
- import { RPGUIRoot } from '../../src/components/RPGUIRoot';
9
- import { equipmentSetMock } from '../../src/mocks/equipmentSet.mocks';
10
- import atlasJSON from '../mocks/atlas/items/items.json';
11
- import atlasIMG from '../mocks/atlas/items/items.png';
12
- import { IPosition } from '../types/eventTypes';
13
-
14
- const meta: Meta = {
15
- title: 'Equipment Set',
16
- component: EquipmentSet,
17
- };
18
-
19
- export default meta;
20
-
21
- const onMouseOver = (event: any, slotIndex: number, item: IItem | null) => {
22
- if (!item) {
23
- console.log(`Free at ${slotIndex},${event}`);
24
- return;
25
- }
26
- };
27
-
28
- const onItemClick = (
29
- ItemType: ItemType,
30
- item: IItem,
31
- itemContainerType: ItemContainerType | null
32
- ) => {
33
- console.log(item, ItemType, itemContainerType, 'was clicked!');
34
- };
35
-
36
- const onSelected = (payload: string) => {
37
- console.log('dispatch', payload);
38
- };
39
-
40
- const onItemOutsideDrop = (item: IItem, position: IPosition) => {
41
- console.log('dropped outside', item, position);
42
- };
43
-
44
- const Template: Story<IEquipmentSetProps> = args => (
45
- <RPGUIRoot>
46
- <EquipmentSet
47
- {...args}
48
- equipmentSet={equipmentSetMock}
49
- onClose={() => console.log('closing Equipment Set Container')}
50
- onMouseOver={onMouseOver}
51
- onSelected={onSelected}
52
- onItemClick={onItemClick}
53
- onItemDragEnd={_quantity => {}}
54
- onItemDragStart={item => console.log('drag start: ', item._id)}
55
- onItemPlaceDrop={item => console.log('dropped to: ', item?._id)}
56
- checkIfItemCanBeMoved={() => false}
57
- type={ItemContainerType.Equipment}
58
- atlasIMG={atlasIMG}
59
- atlasJSON={atlasJSON}
60
- onItemOutsideDrop={onItemOutsideDrop}
61
- />
62
- </RPGUIRoot>
63
- );
64
-
65
- export const Default = Template.bind({});
1
+ import { IItem, ItemContainerType, ItemType } from '@rpg-engine/shared';
2
+ import { Meta, Story } from '@storybook/react';
3
+ import React from 'react';
4
+ import {
5
+ EquipmentSet,
6
+ IEquipmentSetProps,
7
+ } from '../../src/components/Equipment/EquipmentSet';
8
+ import { RPGUIRoot } from '../../src/components/RPGUIRoot';
9
+ import { equipmentSetMock } from '../../src/mocks/equipmentSet.mocks';
10
+ import atlasJSON from '../mocks/atlas/items/items.json';
11
+ import atlasIMG from '../mocks/atlas/items/items.png';
12
+ import { IPosition } from '../types/eventTypes';
13
+
14
+ const meta: Meta = {
15
+ title: 'Equipment Set',
16
+ component: EquipmentSet,
17
+ };
18
+
19
+ export default meta;
20
+
21
+ const onMouseOver = (event: any, slotIndex: number, item: IItem | null) => {
22
+ if (!item) {
23
+ console.log(`Free at ${slotIndex},${event}`);
24
+ return;
25
+ }
26
+ };
27
+
28
+ const onItemClick = (
29
+ ItemType: ItemType,
30
+ item: IItem,
31
+ itemContainerType: ItemContainerType | null
32
+ ) => {
33
+ console.log(item, ItemType, itemContainerType, 'was clicked!');
34
+ };
35
+
36
+ const onSelected = (payload: string) => {
37
+ console.log('dispatch', payload);
38
+ };
39
+
40
+ const onItemOutsideDrop = (item: IItem, position: IPosition) => {
41
+ console.log('dropped outside', item, position);
42
+ };
43
+
44
+ const Template: Story<IEquipmentSetProps> = args => (
45
+ <RPGUIRoot>
46
+ <EquipmentSet
47
+ {...args}
48
+ equipmentSet={equipmentSetMock}
49
+ onClose={() => console.log('closing Equipment Set Container')}
50
+ onMouseOver={onMouseOver}
51
+ onSelected={onSelected}
52
+ onItemClick={onItemClick}
53
+ onItemDragEnd={_quantity => {}}
54
+ onItemDragStart={item => console.log('drag start: ', item._id)}
55
+ onItemPlaceDrop={item => console.log('dropped to: ', item?._id)}
56
+ checkIfItemCanBeMoved={() => false}
57
+ type={ItemContainerType.Equipment}
58
+ atlasIMG={atlasIMG}
59
+ atlasJSON={atlasJSON}
60
+ onItemOutsideDrop={onItemOutsideDrop}
61
+ />
62
+ </RPGUIRoot>
63
+ );
64
+
65
+ export const Default = Template.bind({});
@@ -1,61 +1,61 @@
1
- import { Meta, Story } from '@storybook/react';
2
- import React from 'react';
3
- import { RPGUIRoot } from '../components/RPGUIRoot';
4
- import aliceDefaultThumbnail from '../components/NPCDialog/img/npcDialog/npcThumbnails/alice.png';
5
- import ImgBackground01 from '../components/NPCDialog/img/background01.png';
6
- import ImgBackground02 from '../components/NPCDialog/img/background02.png';
7
- import ImgBackground03 from '../components/NPCDialog/img/background03.png';
8
- import {
9
- HistoryDialog,
10
- IHistoryDialogProps,
11
- } from '../components/HistoryDialog';
12
- import {
13
- ImgSide,
14
- NPCMultiDialogType,
15
- } from '../components/NPCDialog/NPCMultiDialog';
16
-
17
- const meta: Meta = {
18
- title: 'NPC History Dialog',
19
- component: HistoryDialog,
20
- argTypes: {
21
- text: {
22
- control: {
23
- type: 'text',
24
- },
25
- },
26
- },
27
- };
28
-
29
- export default meta;
30
-
31
- const Template: Story<IHistoryDialogProps> = args => (
32
- <RPGUIRoot>
33
- <HistoryDialog {...args} />
34
- </RPGUIRoot>
35
- );
36
-
37
- export const HistoryDialogStore = Template.bind({});
38
-
39
- const textAndTypeArray: NPCMultiDialogType[] = [
40
- {
41
- text: 'I have lived here all my life',
42
- imagePath: aliceDefaultThumbnail,
43
- imageSide: ImgSide.right,
44
- },
45
- {
46
- text: 'I have lived here all my life',
47
- imagePath: aliceDefaultThumbnail,
48
- imageSide: ImgSide.left,
49
- },
50
- {
51
- text: 'I have lived here all my life',
52
- imagePath: aliceDefaultThumbnail,
53
- imageSide: ImgSide.right,
54
- },
55
- ];
56
-
57
- HistoryDialogStore.args = {
58
- textAndTypeArray,
59
- fullCoverBackground: true,
60
- backgroundImgPath: [ImgBackground01, ImgBackground02, ImgBackground03],
61
- };
1
+ import { Meta, Story } from '@storybook/react';
2
+ import React from 'react';
3
+ import { RPGUIRoot } from '../components/RPGUIRoot';
4
+ import aliceDefaultThumbnail from '../components/NPCDialog/img/npcDialog/npcThumbnails/alice.png';
5
+ import ImgBackground01 from '../components/NPCDialog/img/background01.png';
6
+ import ImgBackground02 from '../components/NPCDialog/img/background02.png';
7
+ import ImgBackground03 from '../components/NPCDialog/img/background03.png';
8
+ import {
9
+ HistoryDialog,
10
+ IHistoryDialogProps,
11
+ } from '../components/HistoryDialog';
12
+ import {
13
+ ImgSide,
14
+ NPCMultiDialogType,
15
+ } from '../components/NPCDialog/NPCMultiDialog';
16
+
17
+ const meta: Meta = {
18
+ title: 'NPC History Dialog',
19
+ component: HistoryDialog,
20
+ argTypes: {
21
+ text: {
22
+ control: {
23
+ type: 'text',
24
+ },
25
+ },
26
+ },
27
+ };
28
+
29
+ export default meta;
30
+
31
+ const Template: Story<IHistoryDialogProps> = args => (
32
+ <RPGUIRoot>
33
+ <HistoryDialog {...args} />
34
+ </RPGUIRoot>
35
+ );
36
+
37
+ export const HistoryDialogStore = Template.bind({});
38
+
39
+ const textAndTypeArray: NPCMultiDialogType[] = [
40
+ {
41
+ text: 'I have lived here all my life',
42
+ imagePath: aliceDefaultThumbnail,
43
+ imageSide: ImgSide.right,
44
+ },
45
+ {
46
+ text: 'I have lived here all my life',
47
+ imagePath: aliceDefaultThumbnail,
48
+ imageSide: ImgSide.left,
49
+ },
50
+ {
51
+ text: 'I have lived here all my life',
52
+ imagePath: aliceDefaultThumbnail,
53
+ imageSide: ImgSide.right,
54
+ },
55
+ ];
56
+
57
+ HistoryDialogStore.args = {
58
+ textAndTypeArray,
59
+ fullCoverBackground: true,
60
+ backgroundImgPath: [ImgBackground01, ImgBackground02, ImgBackground03],
61
+ };