oddsgate-ds 1.0.207 → 1.0.208

package/dist/esm/types/components/organisms/Glossary/Glossary.component.d.ts

@@ -8,6 +8,7 @@ type GlossaryProps = {
     displayedCategories: string[];
     placeholder?: string;
     noResults?: boolean;
+    backToTopButton?: boolean;
 };
 export declare const Glossary: React.FC<GlossaryProps>;
 export default Glossary;

package/dist/esm/types/components/organisms/Glossary/Glossary.themes.d.ts

@@ -5,3 +5,4 @@ export declare const StyledGlossaryCategories: import("styled-components/dist/ty
 export declare const StyledNoResultsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledNoResultsTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
 export declare const StyledNoResultsSubtitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
+export declare const StyledBackButtonContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/types.d.ts

@@ -729,6 +729,7 @@ type GlossaryProps = {
     displayedCategories: string[];
     placeholder?: string;
     noResults?: boolean;
+    backToTopButton?: boolean;
 };
 declare const Glossary: React__default.FC<GlossaryProps>;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oddsgate-ds",
-  "version": "1.0.207",
+  "version": "1.0.208",
   "description": "Miew theme component library",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/components/molecules/CategoryIndex/CategoryIndex.component.tsx

@@ -16,10 +16,9 @@ const CategoryIndex: React.FC<CategoryIndexProps> = ({
     <StyledGlossaryCategoryIndex>
       {allCategories.map(category => (
         <StyledGlossaryCategoryIndexItem
-          onClick={() => onChange(category === '#' ? null : category)}
+          onClick={() => onChange(category)}
           isSelected={
-            selectedCategory === category ||
-            (selectedCategory === null && category === '#')
+            selectedCategory === category
           }
           key={`category-${category}`}
         >

package/src/components/organisms/Glossary/Glossary.component.tsx

@@ -1,9 +1,18 @@
 import React from 'react'
-import { StyledGlossary, StyledGlossaryCategories, StyledNoResultsContainer, StyledNoResultsSubtitle, StyledNoResultsTitle } from './Glossary.themes'
+import {
+  StyledBackButtonContainer,
+  StyledGlossary,
+  StyledGlossaryCategories,
+  StyledNoResultsContainer,
+  StyledNoResultsSubtitle,
+  StyledNoResultsTitle
+} from './Glossary.themes'
 
 import SearchBar from '@/components/molecules/SearchBar/SearchBar.component'
 import GlossaryCategoryIndex from '@/components/molecules/CategoryIndex/CategoryIndex.component'
 import CategoriesWrapper from '@/components/molecules/CategoriesWrapper/CategoriesWrapper.component'
+import Button from '@/components/atoms/Button'
+import Icon from '@/components/atoms/Icon'
 
 type GlossaryProps = {
   searchTerm: string
@@ -14,6 +23,7 @@ type GlossaryProps = {
   displayedCategories: string[]
   placeholder?: string
   noResults?: boolean
+  backToTopButton?: boolean
 }
 
 export const Glossary: React.FC<GlossaryProps> = ({
@@ -24,7 +34,8 @@ export const Glossary: React.FC<GlossaryProps> = ({
   categoryData,
   displayedCategories,
   placeholder,
-  noResults
+  noResults,
+  backToTopButton
 }) => {
   const categoryNames = Object.keys(categoryData)
 
@@ -59,6 +70,17 @@ export const Glossary: React.FC<GlossaryProps> = ({
           ))}
         </StyledGlossaryCategories>
       )}
+      <StyledBackButtonContainer>
+        <Button
+          variant="text"
+          onClick={() => {
+            window.scrollTo({ top: 0, behavior: 'smooth' })
+          }}
+          rightIcon={<Icon icon="icon-arrowDown" className='ml-12' style={{width: '14px' }}/>}
+        >
+          {backToTopButton}
+        </Button>
+      </StyledBackButtonContainer>
     </StyledGlossary>
   )
 }

package/src/components/organisms/Glossary/Glossary.stories.tsx

@@ -11,24 +11,126 @@ interface GlossaryCategory {
 }
 
 const categories: GlossaryCategory[] = [
-        {
-                name: 'A',
-                items: [
-                        { slug: 'afk', name: 'AFK' },
-                        { slug: 'aimbot', name: 'AIMBOT' },
-                        { slug: 'aggro', name: 'Aggro' },
-                        { slug: 'aoe', name: 'AOE' },
-                        { slug: 'avatar', name: 'Avatar' }
-                ]
-        },
-        {
-                name: 'B',
-                items: [
-                        { slug: 'buff', name: 'Buff' },
-                        { slug: 'boss', name: 'Boss' },
-                        { slug: 'build', name: 'Build' }
-                ]
-        }
+    {
+        name: 'A',
+        items: [
+            { slug: 'afk', name: 'AFK' },
+            { slug: 'aimbot', name: 'AIMBOT' },
+            { slug: 'aggro', name: 'Aggro' },
+            { slug: 'aoe', name: 'AOE' },
+            { slug: 'avatar', name: 'Avatar' },
+            { slug: 'accuracy', name: 'Accuracy' },
+            { slug: 'action-bar', name: 'Action Bar' },
+            { slug: 'add-on', name: 'Add-on' },
+            { slug: 'arena', name: 'Arena' },
+            { slug: 'artifact', name: 'Artifact' }
+        ]
+    },
+    {
+        name: 'B',
+        items: [
+            { slug: 'buff', name: 'Buff' },
+            { slug: 'boss', name: 'Boss' },
+            { slug: 'build', name: 'Build' },
+            { slug: 'ban', name: 'Ban' },
+            { slug: 'beta', name: 'Beta' },
+            { slug: 'blind', name: 'Blind' },
+            { slug: 'block', name: 'Block' },
+            { slug: 'bot', name: 'Bot' },
+            { slug: 'bracket', name: 'Bracket' },
+            { slug: 'burst', name: 'Burst' }
+        ]
+    },
+    {
+        name: 'C',
+        items: [
+            { slug: 'camp', name: 'Camp' },
+            { slug: 'carry', name: 'Carry' },
+            { slug: 'cc', name: 'Crowd Control' },
+            { slug: 'cd', name: 'Cooldown' },
+            { slug: 'cheese', name: 'Cheese' },
+            { slug: 'clan', name: 'Clan' },
+            { slug: 'combo', name: 'Combo' },
+            { slug: 'crit', name: 'Critical Hit' },
+            { slug: 'crafting', name: 'Crafting' },
+            { slug: 'creep', name: 'Creep' }
+        ]
+    },
+    {
+        name: 'D',
+        items: [
+            { slug: 'debuff', name: 'Debuff' },
+            { slug: 'dps', name: 'DPS' },
+            { slug: 'drop', name: 'Drop' },
+            { slug: 'duo', name: 'Duo' },
+            { slug: 'dungeon', name: 'Dungeon' },
+            { slug: 'draft', name: 'Draft' },
+            { slug: 'dot', name: 'Damage Over Time' },
+            { slug: 'disconnect', name: 'Disconnect' },
+            { slug: 'drain', name: 'Drain' },
+            { slug: 'drop-rate', name: 'Drop Rate' }
+        ]
+    },
+    {
+        name: 'E',
+        items: [
+            { slug: 'emote', name: 'Emote' },
+            { slug: 'endgame', name: 'Endgame' },
+            { slug: 'enemy', name: 'Enemy' },
+            { slug: 'equip', name: 'Equip' },
+            { slug: 'event', name: 'Event' },
+            { slug: 'exploit', name: 'Exploit' },
+            { slug: 'experience', name: 'Experience' },
+            { slug: 'ez', name: 'EZ' },
+            { slug: 'elite', name: 'Elite' },
+            { slug: 'escape', name: 'Escape' }
+        ]
+    },
+    {
+        name: 'F',
+        items: [
+            { slug: 'farm', name: 'Farm' },
+            { slug: 'feed', name: 'Feed' },
+            { slug: 'flank', name: 'Flank' },
+            { slug: 'frag', name: 'Frag' },
+            { slug: 'fps', name: 'FPS' },
+            { slug: 'friendly-fire', name: 'Friendly Fire' },
+            { slug: 'faction', name: 'Faction' },
+            { slug: 'fov', name: 'Field of View' },
+            { slug: 'freeze', name: 'Freeze' },
+            { slug: 'full-party', name: 'Full Party' }
+        ]
+    },
+    {
+        name: 'G',
+        items: [
+            { slug: 'gg', name: 'GG' },
+            { slug: 'gank', name: 'Gank' },
+            { slug: 'gear', name: 'Gear' },
+            { slug: 'grind', name: 'Grind' },
+            { slug: 'guild', name: 'Guild' },
+            { slug: 'glitch', name: 'Glitch' },
+            { slug: 'gold', name: 'Gold' },
+            { slug: 'group', name: 'Group' },
+            { slug: 'grenade', name: 'Grenade' },
+            { slug: 'global', name: 'Global' }
+        ]
+    },
+    {
+        name: 'H',
+        items: [
+            { slug: 'heal', name: 'Heal' },
+            { slug: 'headshot', name: 'Headshot' },
+            { slug: 'hp', name: 'HP' },
+            { slug: 'hud', name: 'HUD' },
+            { slug: 'hardcore', name: 'Hardcore' },
+            { slug: 'hero', name: 'Hero' },
+            { slug: 'hitbox', name: 'Hitbox' },
+            { slug: 'host', name: 'Host' },
+            { slug: 'hotkey', name: 'Hotkey' },
+            { slug: 'hunter', name: 'Hunter' }
+        ]
+    }
 ]
 
 // Helper to build categoryData from categories and items

package/src/components/organisms/Glossary/Glossary.themes.ts

@@ -21,6 +21,7 @@ export const StyledNoResultsContainer = styled.div`
   align-items: center;
   justify-content: center;
   margin-top: 6rem;
+  margin-bottom: 6rem;
 `
 export const StyledNoResultsTitle = styled.h1`
   color: ${colors.primary50};
@@ -39,3 +40,19 @@ export const StyledNoResultsSubtitle = styled.h4`
     font-size: 1.5rem;
   }
 `
+export const StyledBackButtonContainer = styled.div`
+  width: 100%;
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 4rem;
+
+  & > button {
+    text-transform: none;
+    font-size: 1.5rem;
+    height: 34px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-weight: 700;
+  }
+`;