@rpg-engine/long-bow 0.8.186 → 0.8.188

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 (12) hide show
  1. package/dist/long-bow.cjs.development.js +40 -29
  2. package/dist/long-bow.cjs.development.js.map +1 -1
  3. package/dist/long-bow.cjs.production.min.js +1 -1
  4. package/dist/long-bow.cjs.production.min.js.map +1 -1
  5. package/dist/long-bow.esm.js +40 -29
  6. package/dist/long-bow.esm.js.map +1 -1
  7. package/package.json +1 -1
  8. package/src/components/Marketplace/CharacterDetailModal.tsx +32 -24
  9. package/src/components/Marketplace/CharacterListingModal.tsx +1 -0
  10. package/src/components/Marketplace/CharacterMarketplacePanel.tsx +2 -0
  11. package/src/components/Marketplace/MyCharacterListingsPanel.tsx +2 -0
  12. package/src/stories/Features/marketplace/CharacterDetailModal.stories.tsx +8 -7
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rpg-engine/long-bow",
3
- "version": "0.8.186",
3
+ "version": "0.8.188",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.js",
6
6
  "typings": "dist/index.d.ts",
package/src/components/Marketplace/CharacterDetailModal.tsx CHANGED
@@ -117,6 +117,7 @@ export const CharacterDetailModal: React.FC<ICharacterDetailModalProps> = ({
117
117
  imgScale={4}
118
118
  height={96}
119
119
  width={96}
120
+ centered
120
121
  />
121
122
  </SpriteContainer>
122
123
  <HeroInfo>
@@ -135,23 +136,22 @@ export const CharacterDetailModal: React.FC<ICharacterDetailModalProps> = ({
135
136
 
136
137
  <Divider />
137
138
 
138
- {topSkills.length > 0 && (
139
- <Section>
140
- <SectionTitle>Skills</SectionTitle>
141
- <SkillsGrid>
142
- {topSkills.map(([name, value]) => (
143
- <SkillRow key={name}>
144
- <SkillName>{name}</SkillName>
145
- <SkillValue>{value}</SkillValue>
146
- </SkillRow>
147
- ))}
148
- </SkillsGrid>
149
- </Section>
150
- )}
151
-
152
- {snap.equipment?.length > 0 && (
153
- <>
154
- <Divider />
139
+ <MetaColumns>
140
+ {topSkills.length > 0 && (
141
+ <Section>
142
+ <SectionTitle>Skills</SectionTitle>
143
+ <SkillsList>
144
+ {topSkills.map(([name, value]) => (
145
+ <SkillRow key={name}>
146
+ <SkillName>{name}</SkillName>
147
+ <SkillValue>{value}</SkillValue>
148
+ </SkillRow>
149
+ ))}
150
+ </SkillsList>
151
+ </Section>
152
+ )}
153
+
154
+ {snap.equipment?.length > 0 && (
155
155
  <Section>
156
156
  <SectionTitle>Equipment</SectionTitle>
157
157
  <EquipmentList>
@@ -164,8 +164,8 @@ export const CharacterDetailModal: React.FC<ICharacterDetailModalProps> = ({
164
164
  ))}
165
165
  </EquipmentList>
166
166
  </Section>
167
- </>
168
- )}
167
+ )}
168
+ </MetaColumns>
169
169
 
170
170
  <Divider />
171
171
 
@@ -179,6 +179,7 @@ export const CharacterDetailModal: React.FC<ICharacterDetailModalProps> = ({
179
179
  atlasJSON={atlasJSON}
180
180
  spriteKey="others/definya-coin.png"
181
181
  imgScale={1}
182
+ centered
182
183
  />
183
184
  </DCCoinWrapper>
184
185
  <PriceAmount>{formatDCAmount(listing.price)} DC</PriceAmount>
@@ -227,8 +228,8 @@ const ModalContent = styled.div`
227
228
  border: 2px solid #f59e0b;
228
229
  border-radius: 8px;
229
230
  padding: 20px 24px;
230
- width: 480px;
231
- max-width: 94%;
231
+ width: 580px;
232
+ max-width: 96%;
232
233
  max-height: 85dvh;
233
234
  display: flex;
234
235
  flex-direction: column;
@@ -348,10 +349,17 @@ const SectionTitle = styled.span`
348
349
  letter-spacing: 1px;
349
350
  `;
350
351
 
351
- const SkillsGrid = styled.div`
352
+ const MetaColumns = styled.div`
352
353
  display: grid;
353
- grid-template-columns: repeat(2, 1fr);
354
- gap: 4px 12px;
354
+ grid-template-columns: 1fr 1fr;
355
+ gap: 16px;
356
+ align-items: start;
357
+ `;
358
+
359
+ const SkillsList = styled.div`
360
+ display: flex;
361
+ flex-direction: column;
362
+ gap: 4px;
355
363
  `;
356
364
 
357
365
  const SkillRow = styled.div`
package/src/components/Marketplace/CharacterListingModal.tsx CHANGED
@@ -173,6 +173,7 @@ export const CharacterListingModal: React.FC<ICharacterListingModalProps> = ({
173
173
  atlasJSON={atlasJSON}
174
174
  spriteKey="others/definya-coin.png"
175
175
  imgScale={1}
176
+ centered
176
177
  />
177
178
  </DCCoinWrapper>
178
179
  <PricePreviewAmount>{Number(price).toLocaleString()} DC</PricePreviewAmount>
package/src/components/Marketplace/CharacterMarketplacePanel.tsx CHANGED
@@ -81,6 +81,7 @@ export const CharacterMarketplacePanel: React.FC<ICharacterMarketplacePanelProps
81
81
  imgScale={3}
82
82
  height={64}
83
83
  width={64}
84
+ centered
84
85
  />
85
86
  );
86
87
  };
@@ -147,6 +148,7 @@ export const CharacterMarketplacePanel: React.FC<ICharacterMarketplacePanelProps
147
148
  atlasJSON={atlasJSON}
148
149
  spriteKey="others/definya-coin.png"
149
150
  imgScale={1}
151
+ centered
150
152
  />
151
153
  </DCCoinWrapper>
152
154
  {formatDCAmount(listing.price)} DC
package/src/components/Marketplace/MyCharacterListingsPanel.tsx CHANGED
@@ -93,6 +93,7 @@ export const MyCharacterListingsPanel: React.FC<IMyCharacterListingsPanelProps>
93
93
  imgScale={3}
94
94
  height={64}
95
95
  width={64}
96
+ centered
96
97
  />
97
98
  </CharacterSprite>
98
99
  <CharacterInfo>
@@ -105,6 +106,7 @@ export const MyCharacterListingsPanel: React.FC<IMyCharacterListingsPanelProps>
105
106
  atlasJSON={atlasJSON}
106
107
  spriteKey="others/definya-coin.png"
107
108
  imgScale={1}
109
+ centered
108
110
  />
109
111
  </DCCoinWrapper>
110
112
  {formatDCAmount(listing.price)} DC
package/src/stories/Features/marketplace/CharacterDetailModal.stories.tsx CHANGED
@@ -31,11 +31,11 @@ const warriorListing: ICharacterListing = {
31
31
  race: 'Human',
32
32
  faction: 'Alliance',
33
33
  mode: 'Standard',
34
- skills: { sword: 10, shield: 8, constitution: 15, strength: 18, agility: 7 },
34
+ skills: { level: 25, sword: 10, shielding: 8, strength: 18, dexterity: 7, resistance: 15 },
35
35
  equipment: [
36
- { slot: 'weapon', itemName: 'Broad Sword', itemKey: 'items/broad-sword', rarity: 'Common' },
37
- { slot: 'armor', itemName: 'Steel Armor', itemKey: 'items/steel-armor', rarity: 'Rare' },
38
- { slot: 'helmet', itemName: 'Iron Helm', itemKey: 'items/iron-helm', rarity: 'Uncommon' },
36
+ { slot: 'rightHand', itemName: 'Broad Sword', itemKey: 'broad-sword', rarity: 'Common' },
37
+ { slot: 'armor', itemName: 'Steel Armor', itemKey: 'steel-armor', rarity: 'Rare' },
38
+ { slot: 'head', itemName: 'Iron Helm', itemKey: 'iron-helm', rarity: 'Uncommon' },
39
39
  ],
40
40
  textureKey: 'black-knight',
41
41
  },
@@ -57,10 +57,11 @@ const hardcoreListing: ICharacterListing = {
57
57
  race: 'Elf',
58
58
  faction: 'Horde',
59
59
  mode: 'Hardcore',
60
- skills: { fireball: 20, frostbolt: 18, intelligence: 30, arcane: 15, staff: 12 },
60
+ skills: { level: 40, magic: 20, magicResistance: 18, dexterity: 12, stamina: 15 },
61
61
  equipment: [
62
- { slot: 'weapon', itemName: 'Staff of Flames', itemKey: 'items/fire-staff', rarity: 'Epic' },
63
- { slot: 'robe', itemName: 'Arcane Robe', itemKey: 'items/arcane-robe', rarity: 'Legendary' },
62
+ { slot: 'rightHand', itemName: 'Staff of Flames', itemKey: 'fire-staff', rarity: 'Epic' },
63
+ { slot: 'armor', itemName: 'Arcane Robe', itemKey: 'arcane-robe', rarity: 'Legendary' },
64
+ { slot: 'neck', itemName: 'Mana Amulet', itemKey: 'mana-amulet', rarity: 'Rare' },
64
65
  ],
65
66
  textureKey: 'pink-mage-1',
66
67
  },