react-textgame-components / Exports
- GBlock
- GBlurText
- GButton
- GIcon
- GImage
- GInput
- GLink
- GMap
- GMapHotspot
- GNotificationContainer
- GP
- GProvider
- GSay
- GVideo
- useNotification
Ƭ ButtonVariants: "dark" | "light" | "success" | "warning" | "danger" | "info"
src/components/GButton/types.ts:16
Ƭ Effect: "rightSpring" | "leftSpring" | "bottomSpring" | "opacity"
src/components/GBlock/types.ts:5
Ƭ LinkVariants: "default" | "light" | "textLike"
src/components/GLink/types.ts:4
Ƭ SaySideVariants: "left" | "right"
src/components/GSay/types.ts:7
Ƭ SayVariants: "common" | "bigName" | "messenger"
src/components/GSay/types.ts:5
• Const GContext: Context<IGContext>
src/components/GContext/GContext.tsx:5
▸ GBlock(props): Element
GBlock component is a container for content that can be shown on button click or other event
| Name | Type | Description |
|---|---|---|
props |
GBlockProps |
GBlockProps |
Element
GBlock component
Example
<GBlock loadOn="button" buttonName="Show more">
<div>Content</div>
</GBlock>See
- GBlockProps
- GButton
- useIsShown
- GContext
src/components/GBlock/GBlock.tsx:25
▸ GBlurText(«destructured»): Element
| Name | Type |
|---|---|
«destructured» |
GBlurTextProps |
Element
src/components/GBlurText/GBlurText.tsx:5
▸ GButton(props): Element
| Name | Type |
|---|---|
props |
GButtonProps |
Element
src/components/GButton/GButton.tsx:5
▸ GIcon(props): Element
| Name | Type |
|---|---|
props |
IconInterface |
Element
src/components/GIcon/GIcon.tsx:6
▸ GImage(«destructured»): Element
| Name | Type |
|---|---|
«destructured» |
GameImageProps |
Element
src/components/GImage/GImage.tsx:9
▸ GInput(props): Element
| Name | Type |
|---|---|
props |
GInputProps |
Element
src/components/GInput/GInput.tsx:11
▸ GLink(props): Element
| Name | Type |
|---|---|
props |
LinkProps |
Element
src/components/GLink/GLink.tsx:23
▸ GMap(«destructured»): Element
| Name | Type |
|---|---|
«destructured» |
GMapProps |
Element
src/components/GMap/GMap.tsx:13
▸ GMapHotspot<T>(props): GMapHotspotType
| Name | Type |
|---|---|
T |
extends HotspotType
|
| Name | Type |
|---|---|
props |
GMapHotspotProps<T> |
GMapHotspotType
src/components/GMap/GMapHotspot.tsx:6
▸ GNotificationContainer(props): Element
GNotificationContainer component is a container for notifications
DON'T FORGET TO IMPORT CSS FILE IN YOUR APP (react-textgame-components/dist/styles.css)
| Name | Type | Description |
|---|---|---|
props |
ToastContainerProps |
ToastContainerProps |
Element
GNotificationContainer component
Example
<GNotificationContainer
position="top-right"
hideProgressBar={true}
theme="dark"
autoClose={5000}
/>See
- ToastContainerProps
- GContext
- useNotification
- ToastContainer
- https://fkhadra.github.io/react-toastify/introduction/
- https://fkhadra.github.io/react-toastify/api/toastcontainer
src/components/GNotification/GNotificationContainer.tsx:29
▸ GP(props, context?): ReactNode
game
tag
| Name | Type |
|---|---|
props |
MUIStyledCommonProps<Theme> & ClassAttributes<HTMLParagraphElement> & HTMLAttributes<HTMLParagraphElement> |
context? |
any |
ReactNode
▸ GProvider(«destructured»): Element
| Name | Type |
|---|---|
«destructured» |
GProviderProps |
Element
src/components/GContext/GProvider.tsx:11
▸ GSay(props): Element
| Name | Type |
|---|---|
props |
GSayProps |
Element
src/components/GSay/GSay.tsx:34
▸ GVideo(props): Element
| Name | Type |
|---|---|
props |
GVideoProps |
Element
src/components/GVideo/GVideo.tsx:6
▸ useNotification(options?): Object
Hook for showing notifications
DON'T FORGET TO IMPORT CSS FILE IN YOUR APP (react-textgame-components/dist/styles.css)
| Name | Type | Description |
|---|---|---|
options? |
ToastOptions<unknown> |
options for the notification |
Object
notify - function to show a notification
| Name | Type |
|---|---|
notify |
(content: ReactNode) => void
|
Example
const { notify } = useNotification();
notify(<div>Hello, world!</div>);Example
const { notify } = useNotification({ autoClose: 10000 });
notify('Hello, world!');See