@rpg-engine/long-bow 0.3.43 → 0.3.44

package/src/components/itemSelector/ItemSelector.tsx

@@ -1,136 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import styled from 'styled-components';
-import { Button, ButtonTypes } from '../Button';
-import { DraggableContainer } from '../DraggableContainer';
-import { RPGUIContainerTypes } from '../RPGUIContainer';
-import { SpriteFromAtlas } from '../shared/SpriteFromAtlas';
-
-export interface IOptionsItemSelectorProps {
-  name: string;
-  description?: string;
-  imageKey: string;
-}
-
-export interface IItemSelectorProps {
-  atlasJSON: any;
-  atlasIMG: any;
-  options: IOptionsItemSelectorProps[];
-  onClose: () => void;
-  onSelect: (value: string) => void;
-}
-
-export const ItemSelector: React.FC<IItemSelectorProps> = ({
-  atlasIMG,
-  atlasJSON,
-  options,
-  onClose,
-  onSelect,
-}) => {
-  const [selectedValue, setSelectedValue] = useState<string>();
-
-  const handleClick = () => {
-    let element = document.querySelector(
-      `input[name='test']:checked`
-    ) as HTMLInputElement;
-    const elementValue = element.value;
-    setSelectedValue(elementValue);
-  };
-
-  useEffect(() => {
-    if (selectedValue) {
-      onSelect(selectedValue);
-    }
-  }, [selectedValue]);
-  return (
-    <DraggableContainer
-      type={RPGUIContainerTypes.Framed}
-      width="500px"
-      cancelDrag=".equipment-container-body .arrow-selector"
-      onCloseButton={() => {
-        if (onClose) {
-          onClose();
-        }
-      }}
-    >
-      <div style={{ width: '100%' }}>
-        <Title>{'Harvesting instruments'}</Title>
-        <Subtitle>{'Use the tool, you need it'}</Subtitle>
-        <hr className="golden" />
-      </div>
-
-      <RadioInputScroller>
-        {options?.map((option, index) => (
-          <RadioOptionsWrapper key={index}>
-            <SpriteAtlasWrapper>
-              <SpriteFromAtlas
-                atlasIMG={atlasIMG}
-                atlasJSON={atlasJSON}
-                spriteKey={option.imageKey}
-                imgScale={3}
-              />
-            </SpriteAtlasWrapper>
-            <div>
-              <input
-                className="rpgui-radio"
-                type="radio"
-                value={option.name}
-                name="test"
-              />
-              <label
-                onClick={handleClick}
-                style={{ display: 'flex', alignItems: 'center' }}
-              >
-                {option.name} <br />
-                {option.description}
-              </label>
-            </div>
-          </RadioOptionsWrapper>
-        ))}
-      </RadioInputScroller>
-      <ButtonWrapper>
-        <Button buttonType={ButtonTypes.RPGUIButton} onClick={onClose}>
-          Cancel
-        </Button>
-        <Button buttonType={ButtonTypes.RPGUIButton}>Select</Button>
-      </ButtonWrapper>
-    </DraggableContainer>
-  );
-};
-
-const Title = styled.h1`
-  font-size: 0.6rem;
-  color: yellow !important;
-`;
-const Subtitle = styled.h1`
-  font-size: 0.4rem;
-  color: yellow !important;
-`;
-
-const RadioInputScroller = styled.div`
-  padding-left: 15px;
-  padding-top: 10px;
-  width: 100%;
-  margin-top: 1rem;
-  align-items: center;
-  margin-left: 20px;
-  align-items: flex-start;
-  overflow-y: scroll;
-  height: 360px;
-`;
-
-const SpriteAtlasWrapper = styled.div`
-  margin-right: 40px;
-`;
-
-const RadioOptionsWrapper = styled.div`
-  display: flex;
-  align-items: stretch;
-  margin-bottom: 40px;
-`;
-
-const ButtonWrapper = styled.div`
-  display: flex;
-  justify-content: space-around;
-  padding-top: 20px;
-  width: 100%;
-`;

package/src/constants/uiDevices.ts

@@ -1,5 +0,0 @@
-import isMobile from 'is-mobile';
-
-export const IS_MOBILE_OR_TABLET = isMobile({
-  tablet: true,
-});

package/src/stories/CaracterStatus.stories.tsx

@@ -1,29 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import {
-  CharacterStatus,
-  ICharacterStatusProps,
-} from '../components/CaracterStatus/CaracterStatus';
-import { RPGUIRoot } from '../components/RPGUIRoot';
-
-const meta: Meta = {
-  title: 'Caracter Status',
-  component: CharacterStatus,
-};
-
-export default meta;
-
-const Template: Story<ICharacterStatusProps> = args => (
-  <RPGUIRoot>
-    <CharacterStatus {...args} />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-Default.args = {
-  healthValue: 30,
-  healthMaxValue: 100,
-  manaValue: 30,
-  manaMaxValue: 100,
-  charName: 'Char Name',
-};

package/src/stories/ChatDeprecated.stories.tsx

@@ -1,170 +0,0 @@
-import { ChatMessageType, IChatMessage } from '@rpg-engine/shared';
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { ChatDeprecated } from '../components/Chatdeprecated/ChatDeprecated';
-import { RPGUIRoot } from '../components/RPGUIRoot';
-
-const meta: Meta = {
-  title: 'ChatDeprecated',
-  component: ChatDeprecated,
-};
-
-export default meta;
-
-const chatMessagesMock = [
-  {
-    _id: 'test-id-1',
-    message: 'test message',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-1',
-    message: 'test message',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-2',
-    message: 'Good morning!',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-3',
-    message: 'How are you doing?',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-4',
-    message: 'Hey hey hey!!!',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-5',
-    message: 'BITCONNEEEEEEEEECT!',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-6',
-    message: 'BITCONNEEEEEEEEECT!',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-7',
-    message: 'BITCONNEEEEEEEEECT!',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-8',
-    message: 'BITCONNEEEEEEEEECT!',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-  {
-    _id: 'test-id-9',
-    message: 'BITCONNEEEEEEEEECT!',
-    emitter: {
-      _id: 'someid',
-      name: 'Guilherme',
-    },
-    type: ChatMessageType.Global,
-    x: 128,
-    y: 128,
-    scene: 'MainScene',
-    createdAt: '2020-08-20T16:00:00.000Z',
-    updatedAt: '2020-08-20T16:00:00.000Z',
-  },
-];
-
-const Template: Story<IChatMessage> = args => (
-  <RPGUIRoot>
-    <ChatDeprecated
-      onSendChatMessage={msg => console.log(msg)}
-      chatMessages={chatMessagesMock}
-      opacity={0.5}
-      height={'200px'}
-      onCloseButton={() => console.log('closing chat...')}
-      {...args}
-    />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});

package/src/stories/CircullarController.stories.tsx

@@ -1,33 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '..';
-import {
-  CircularController,
-  CircularControllerProps,
-} from '../components/CircularController/CircularController';
-import { SPELL_SHORTCUTS_STORAGE_KEY } from '../components/Spellbook/constants';
-
-const meta: Meta = {
-  title: 'Circular Controller',
-  component: CircularController,
-};
-
-export default meta;
-
-const Template: Story<CircularControllerProps> = args => (
-  <RPGUIRoot>
-    <CircularController {...args} />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-
-Default.args = {
-  spells: JSON.parse(
-    localStorage.getItem(SPELL_SHORTCUTS_STORAGE_KEY) as string
-  ),
-  onSpellClick: key => console.log(key),
-  onActionClick: () => console.log('action'),
-  onCancelClick: () => console.log('cancel attack'),
-  mana: 100,
-};

package/src/stories/CraftBook.stories.tsx

@@ -1,40 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '..';
-import { CraftBook } from '../components/CraftBook/CraftBook';
-import { craftableItems } from '../components/CraftBook/MockItems';
-import atlasJSON from '../mocks/atlas/items/items.json';
-import atlasIMG from '../mocks/atlas/items/items.png';
-
-const meta: Meta = {
-  title: 'Craft Book',
-  component: CraftBook,
-};
-
-export default meta;
-
-const Template: Story = args => (
-  <RPGUIRoot>
-    <CraftBook
-      atlasIMG={atlasIMG}
-      atlasJSON={atlasJSON}
-      onSelect={onSelect}
-      onClose={() => console.log('closing Equipment Set Container')}
-      craftablesItems={craftableItems}
-      onCraftItem={onCraftItem}
-      {...args}
-    />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-
-const onCraftItem = (value: string | undefined) => {
-  console.log('Craft', value);
-};
-
-const onSelect = (value: string) => {
-  console.log('Story package', value);
-};
-
-Default.args = {};

package/src/stories/DropdownSelectorContainer.stories.tsx

@@ -1,41 +0,0 @@
-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/ItemQuantitySelector.stories.tsx

@@ -1,26 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '..';
-import {
-  IItemQuantitySelectorProps,
-  ItemQuantitySelector,
-} from '../components/Item/Inventory/ItemQuantitySelector';
-
-const meta: Meta = {
-  title: 'Item Quantity Selector',
-  component: ItemQuantitySelector,
-};
-
-export default meta;
-
-const Template: Story<IItemQuantitySelectorProps> = args => (
-  <RPGUIRoot>
-    <ItemQuantitySelector {...args} />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-
-Default.args = {
-  quantity: 10,
-};

package/src/stories/ItemSelector.stories.tsx

@@ -1,77 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '..';
-import {
-  IOptionsItemSelectorProps,
-  ItemSelector,
-} from '../components/itemSelector/ItemSelector';
-import atlasJSON from '../mocks/atlas/items/items.json';
-import atlasIMG from '../mocks/atlas/items/items.png';
-
-const meta: Meta = {
-  title: 'Item Selector',
-  component: ItemSelector,
-};
-
-export default meta;
-
-const Template: Story = args => (
-  <RPGUIRoot>
-    <ItemSelector
-      atlasIMG={atlasIMG}
-      atlasJSON={atlasJSON}
-      options={options}
-      onSelect={onSelect}
-      onClose={() => console.log('closing Equipment Set Container')}
-      {...args}
-    />
-  </RPGUIRoot>
-);
-
-export const Default = Template.bind({});
-
-const onSelect = (value: string): void => {
-  console.log('Story package', value);
-};
-
-const options: IOptionsItemSelectorProps[] = [
-  {
-    name: 'Human',
-    description: 'Human',
-    imageKey: 'axes/frost-double-axe.png',
-  },
-  {
-    name: 'Human',
-    description: 'Human',
-    imageKey: 'maces/spiked-club.png',
-  },
-  {
-    name: 'Human2',
-    description: 'Human2',
-    imageKey: 'axes/frost-double-axe.png',
-  },
-  {
-    name: 'Human3',
-    description: 'Human3',
-    imageKey: 'maces/spiked-club.png',
-  },
-  {
-    name: 'Human4',
-    description: 'Human4',
-    imageKey: 'axes/frost-double-axe.png',
-  },
-  {
-    name: 'Human5',
-    description: 'Human5',
-    imageKey: 'maces/spiked-club.png',
-  },
-  {
-    name: 'Human6',
-    description: 'Human6',
-    imageKey: 'axes/frost-double-axe.png',
-  },
-];
-
-Default.args = {
-  options,
-};

package/src/stories/QuickSpells.stories.tsx

@@ -1,38 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import React from 'react';
-import { RPGUIRoot } from '../components/RPGUIRoot';
-import { SPELL_SHORTCUTS_STORAGE_KEY } from '../components/Spellbook/constants';
-import {
-  QuickSpells,
-  QuickSpellsProps,
-} from '../components/Spellbook/QuickSpells';
-
-const meta: Meta = {
-  title: 'QuickSpells',
-  component: QuickSpells,
-};
-
-export default meta;
-
-const Template: Story<QuickSpellsProps> = args => {
-  return (
-    <RPGUIRoot>
-      <div
-        style={{
-          width: '100%',
-        }}
-      >
-        <QuickSpells {...args} />
-      </div>
-    </RPGUIRoot>
-  );
-};
-
-export const Default = Template.bind({});
-Default.args = {
-  onSpellCast: spellKey => console.log(spellKey),
-  quickSpells: JSON.parse(
-    localStorage.getItem(SPELL_SHORTCUTS_STORAGE_KEY) as string
-  ),
-  mana: 100,
-};

package/src/stories/RadioInput.stories.tsx

@@ -1,35 +0,0 @@
-import React from 'react';
-import { Meta, Story } from '@storybook/react';
-import { RadioInput ,IRadioInput} from '../components/RadioInput/RadioInput';
-import { RPGUIRoot } from '../components/RPGUIRoot';
-import { Itools } from '../components/RadioInput/instruments';
-
-const meta: Meta = {    
-    component: RadioInput,
-  };
-
-export default meta;
-const Template: Story<IRadioInput> = args => (
-    <RPGUIRoot>
-      <RadioInput {...args} />
-    </RPGUIRoot>
-  );
-  
-  export const RadioInputElement = Template.bind({});
-
-  const onSelectIt = (value:string):void => {
-    console.log('Story package', value);
-  };
-  
-  const onClose = () => {
-    console.log('close');
-  };
-
-  RadioInputElement.args={
-    title:"Harvesting instruments",
-    subtitle:'Use the tool, you need it',
-    onSelect:onSelectIt,
-    onCancel:onClose,
-    items:Itools
-
-  }