@rpg-engine/long-bow 0.3.97 → 0.3.98

package/src/stories/DraggableContainer.stories.tsx

@@ -1,28 +1,28 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import {
-  DraggableContainer,
-  IDraggableContainerProps,
-} from '../../src/components/DraggableContainer';
-import { RPGUIRoot } from '../../src/components/RPGUIRoot';
-
-const meta: Meta = {
-  title: 'Draggable Container',
-  component: DraggableContainer,
-};
-
-export default meta;
-
-const Template: Story<IDraggableContainerProps> = args => (
-  <RPGUIRoot>
-    <DraggableContainer {...args} />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-
-Default.args = {
-  title: 'Example',
-  onCloseButton: () => console.log('closing'),
-  children: <p>This is a draggable container!</p>,
-};
+import { Meta, Story } from '@storybook/react';
+import React from 'react';
+import {
+  DraggableContainer,
+  IDraggableContainerProps,
+} from '../../src/components/DraggableContainer';
+import { RPGUIRoot } from '../../src/components/RPGUIRoot';
+
+const meta: Meta = {
+  title: 'Draggable Container',
+  component: DraggableContainer,
+};
+
+export default meta;
+
+const Template: Story<IDraggableContainerProps> = args => (
+  <RPGUIRoot>
+    <DraggableContainer {...args} />
+  </RPGUIRoot>
+);
+
+export const Default = Template.bind({});
+
+Default.args = {
+  title: 'Example',
+  onCloseButton: () => console.log('closing'),
+  children: <p>This is a draggable container!</p>,
+};

package/src/stories/Dropdown.stories.tsx

@@ -1,46 +1,46 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '../../src';
-import {
-  Dropdown,
-  IDropdownProps,
-  IOptionsProps,
-} from '../../src/components/Dropdown';
-
-const meta: Meta = {
-  title: 'Dropdown',
-  component: Dropdown,
-};
-
-export default meta;
-
-const Template: Story<IDropdownProps> = (args) => (
-  <RPGUIRoot>
-    <Dropdown {...args} />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-
-const options: IOptionsProps[] = [
-  {
-    id: 1,
-    value: 'Human',
-    option: 'Human',
-  },
-  {
-    id: 2,
-    value: 'Elfo',
-    option: 'Elfo',
-  },
-  {
-    id: 3,
-    value: 'Dragão',
-    option: 'Dragão',
-  },
-];
-
-Default.args = {
-  options,
-  width: '100%',
-};
+import { Meta, Story } from '@storybook/react';
+import React from 'react';
+import { RPGUIRoot } from '../../src';
+import {
+  Dropdown,
+  IDropdownProps,
+  IOptionsProps,
+} from '../../src/components/Dropdown';
+
+const meta: Meta = {
+  title: 'Dropdown',
+  component: Dropdown,
+};
+
+export default meta;
+
+const Template: Story<IDropdownProps> = (args) => (
+  <RPGUIRoot>
+    <Dropdown {...args} />
+  </RPGUIRoot>
+);
+
+export const Default = Template.bind({});
+
+const options: IOptionsProps[] = [
+  {
+    id: 1,
+    value: 'Human',
+    option: 'Human',
+  },
+  {
+    id: 2,
+    value: 'Elfo',
+    option: 'Elfo',
+  },
+  {
+    id: 3,
+    value: 'Dragão',
+    option: 'Dragão',
+  },
+];
+
+Default.args = {
+  options,
+  width: '100%',
+};

package/src/stories/DropdownSelectorContainer.stories.tsx

@@ -1,41 +1,41 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '..';
-import {
-  DropdownSelectorContainer,
-  IDropdownSelectorContainer,
-} from '../components/DropdownSelectorContainer';
-
-const meta: Meta = {
-  title: 'DropdownSelectorContainer',
-  component: DropdownSelectorContainer,
-};
-
-export default meta;
-
-const Template: Story<IDropdownSelectorContainer> = args => (
-  <RPGUIRoot>
-    <DropdownSelectorContainer {...args} details="There are server details" />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-
-Default.args = {
-  title: 'Choose a server',
-  onChange: () => {},
-  options: [
-    {
-      id: 'europe-germany',
-      name: 'Europe (Germany)',
-    },
-    {
-      id: 'europe-uk',
-      name: 'Europe (UK)',
-    },
-    {
-      id: 'america-us',
-      name: 'America',
-    },
-  ],
-};
+import { Meta, Story } from '@storybook/react';
+import React from 'react';
+import { RPGUIRoot } from '..';
+import {
+  DropdownSelectorContainer,
+  IDropdownSelectorContainer,
+} from '../components/DropdownSelectorContainer';
+
+const meta: Meta = {
+  title: 'DropdownSelectorContainer',
+  component: DropdownSelectorContainer,
+};
+
+export default meta;
+
+const Template: Story<IDropdownSelectorContainer> = args => (
+  <RPGUIRoot>
+    <DropdownSelectorContainer {...args} details="There are server details" />
+  </RPGUIRoot>
+);
+
+export const Default = Template.bind({});
+
+Default.args = {
+  title: 'Choose a server',
+  onChange: () => {},
+  options: [
+    {
+      id: 'europe-germany',
+      name: 'Europe (Germany)',
+    },
+    {
+      id: 'europe-uk',
+      name: 'Europe (UK)',
+    },
+    {
+      id: 'america-us',
+      name: 'America',
+    },
+  ],
+};

package/src/stories/EquipmentSet.stories.tsx

@@ -1,65 +1,65 @@
-import { IItem, ItemContainerType, ItemType } from '@rpg-engine/shared';
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import {
-  EquipmentSet,
-  IEquipmentSetProps,
-} from '../../src/components/Equipment/EquipmentSet';
-import { RPGUIRoot } from '../../src/components/RPGUIRoot';
-import { equipmentSetMock } from '../../src/mocks/equipmentSet.mocks';
-import atlasJSON from '../mocks/atlas/items/items.json';
-import atlasIMG from '../mocks/atlas/items/items.png';
-import { IPosition } from '../types/eventTypes';
-
-const meta: Meta = {
-  title: 'Equipment Set',
-  component: EquipmentSet,
-};
-
-export default meta;
-
-const onMouseOver = (event: any, slotIndex: number, item: IItem | null) => {
-  if (!item) {
-    console.log(`Free at ${slotIndex},${event}`);
-    return;
-  }
-};
-
-const onItemClick = (
-  ItemType: ItemType,
-  item: IItem,
-  itemContainerType: ItemContainerType | null
-) => {
-  console.log(item, ItemType, itemContainerType, 'was clicked!');
-};
-
-const onSelected = (payload: string) => {
-  console.log('dispatch', payload);
-};
-
-const onItemOutsideDrop = (item: IItem, position: IPosition) => {
-  console.log('dropped outside', item, position);
-};
-
-const Template: Story<IEquipmentSetProps> = args => (
-  <RPGUIRoot>
-    <EquipmentSet
-      {...args}
-      equipmentSet={equipmentSetMock}
-      onClose={() => console.log('closing Equipment Set Container')}
-      onMouseOver={onMouseOver}
-      onSelected={onSelected}
-      onItemClick={onItemClick}
-      onItemDragEnd={_quantity => {}}
-      onItemDragStart={item => console.log('drag start: ', item._id)}
-      onItemPlaceDrop={item => console.log('dropped to: ', item?._id)}
-      checkIfItemCanBeMoved={() => false}
-      type={ItemContainerType.Equipment}
-      atlasIMG={atlasIMG}
-      atlasJSON={atlasJSON}
-      onItemOutsideDrop={onItemOutsideDrop}
-    />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
+import { IItem, ItemContainerType, ItemType } from '@rpg-engine/shared';
+import { Meta, Story } from '@storybook/react';
+import React from 'react';
+import {
+  EquipmentSet,
+  IEquipmentSetProps,
+} from '../../src/components/Equipment/EquipmentSet';
+import { RPGUIRoot } from '../../src/components/RPGUIRoot';
+import { equipmentSetMock } from '../../src/mocks/equipmentSet.mocks';
+import atlasJSON from '../mocks/atlas/items/items.json';
+import atlasIMG from '../mocks/atlas/items/items.png';
+import { IPosition } from '../types/eventTypes';
+
+const meta: Meta = {
+  title: 'Equipment Set',
+  component: EquipmentSet,
+};
+
+export default meta;
+
+const onMouseOver = (event: any, slotIndex: number, item: IItem | null) => {
+  if (!item) {
+    console.log(`Free at ${slotIndex},${event}`);
+    return;
+  }
+};
+
+const onItemClick = (
+  ItemType: ItemType,
+  item: IItem,
+  itemContainerType: ItemContainerType | null
+) => {
+  console.log(item, ItemType, itemContainerType, 'was clicked!');
+};
+
+const onSelected = (payload: string) => {
+  console.log('dispatch', payload);
+};
+
+const onItemOutsideDrop = (item: IItem, position: IPosition) => {
+  console.log('dropped outside', item, position);
+};
+
+const Template: Story<IEquipmentSetProps> = args => (
+  <RPGUIRoot>
+    <EquipmentSet
+      {...args}
+      equipmentSet={equipmentSetMock}
+      onClose={() => console.log('closing Equipment Set Container')}
+      onMouseOver={onMouseOver}
+      onSelected={onSelected}
+      onItemClick={onItemClick}
+      onItemDragEnd={_quantity => {}}
+      onItemDragStart={item => console.log('drag start: ', item._id)}
+      onItemPlaceDrop={item => console.log('dropped to: ', item?._id)}
+      checkIfItemCanBeMoved={() => false}
+      type={ItemContainerType.Equipment}
+      atlasIMG={atlasIMG}
+      atlasJSON={atlasJSON}
+      onItemOutsideDrop={onItemOutsideDrop}
+    />
+  </RPGUIRoot>
+);
+
+export const Default = Template.bind({});

package/src/stories/HistoryDialog.stories.tsx

@@ -1,61 +1,61 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '../components/RPGUIRoot';
-import aliceDefaultThumbnail from '../components/NPCDialog/img/npcDialog/npcThumbnails/alice.png';
-import ImgBackground01 from '../components/NPCDialog/img/background01.png';
-import ImgBackground02 from '../components/NPCDialog/img/background02.png';
-import ImgBackground03 from '../components/NPCDialog/img/background03.png';
-import {
-  HistoryDialog,
-  IHistoryDialogProps,
-} from '../components/HistoryDialog';
-import {
-  ImgSide,
-  NPCMultiDialogType,
-} from '../components/NPCDialog/NPCMultiDialog';
-
-const meta: Meta = {
-  title: 'NPC History Dialog',
-  component: HistoryDialog,
-  argTypes: {
-    text: {
-      control: {
-        type: 'text',
-      },
-    },
-  },
-};
-
-export default meta;
-
-const Template: Story<IHistoryDialogProps> = args => (
-  <RPGUIRoot>
-    <HistoryDialog {...args} />
-  </RPGUIRoot>
-);
-
-export const HistoryDialogStore = Template.bind({});
-
-const textAndTypeArray: NPCMultiDialogType[] = [
-  {
-    text: 'I have lived here all my life',
-    imagePath: aliceDefaultThumbnail,
-    imageSide: ImgSide.right,
-  },
-  {
-    text: 'I have lived here all my life',
-    imagePath: aliceDefaultThumbnail,
-    imageSide: ImgSide.left,
-  },
-  {
-    text: 'I have lived here all my life',
-    imagePath: aliceDefaultThumbnail,
-    imageSide: ImgSide.right,
-  },
-];
-
-HistoryDialogStore.args = {
-  textAndTypeArray,
-  fullCoverBackground: true,
-  backgroundImgPath: [ImgBackground01, ImgBackground02, ImgBackground03],
-};
+import { Meta, Story } from '@storybook/react';
+import React from 'react';
+import { RPGUIRoot } from '../components/RPGUIRoot';
+import aliceDefaultThumbnail from '../components/NPCDialog/img/npcDialog/npcThumbnails/alice.png';
+import ImgBackground01 from '../components/NPCDialog/img/background01.png';
+import ImgBackground02 from '../components/NPCDialog/img/background02.png';
+import ImgBackground03 from '../components/NPCDialog/img/background03.png';
+import {
+  HistoryDialog,
+  IHistoryDialogProps,
+} from '../components/HistoryDialog';
+import {
+  ImgSide,
+  NPCMultiDialogType,
+} from '../components/NPCDialog/NPCMultiDialog';
+
+const meta: Meta = {
+  title: 'NPC History Dialog',
+  component: HistoryDialog,
+  argTypes: {
+    text: {
+      control: {
+        type: 'text',
+      },
+    },
+  },
+};
+
+export default meta;
+
+const Template: Story<IHistoryDialogProps> = args => (
+  <RPGUIRoot>
+    <HistoryDialog {...args} />
+  </RPGUIRoot>
+);
+
+export const HistoryDialogStore = Template.bind({});
+
+const textAndTypeArray: NPCMultiDialogType[] = [
+  {
+    text: 'I have lived here all my life',
+    imagePath: aliceDefaultThumbnail,
+    imageSide: ImgSide.right,
+  },
+  {
+    text: 'I have lived here all my life',
+    imagePath: aliceDefaultThumbnail,
+    imageSide: ImgSide.left,
+  },
+  {
+    text: 'I have lived here all my life',
+    imagePath: aliceDefaultThumbnail,
+    imageSide: ImgSide.right,
+  },
+];
+
+HistoryDialogStore.args = {
+  textAndTypeArray,
+  fullCoverBackground: true,
+  backgroundImgPath: [ImgBackground01, ImgBackground02, ImgBackground03],
+};