fansunited-widget-either-or 1.0.0

package/README.md

@@ -0,0 +1,310 @@
+# Either/Or Management Widget
+
+Welcome to Fans United Either/Or Management Widget. The widget allows staff members with sufficient permissions to create, update and delete Either/Or mini-games. You can use this widget as it is and embed it in your platform, or you can use the Management Panel. Either/Or is a mini-game where users receives two options and he needs to answer which is one more or less for a specified time. With successful installation, you can create, edit and delete a Either/Or mini-game.
+
+## Installation and usage
+
+The easiest way to use fansunited-widget-either-or-management is to install it from npm as follows:
+
+```javascript
+npm  install  fansunited-widget-either-or
+```
+
+or:
+
+```javascript
+yarn  add  fansunited-widget-either-or
+```
+
+Here is an example how you can **integrate** Fans United Either/Or Management Widget:
+
+```javascript
+import  'fansunited-widget-either-or/style.css';
+import { EitherOrManager } from  'fansunited-widget-either-or';
+
+const  App = () => {
+return (
+<EitherOrManager
+	fansUnitedApiKey={'your-api-key'}
+	fansUnitedClientId={'your-client-id'} />
+);
+}
+```
+
+## Notes
+
+- The widget is bundled as a React component and its usage is as simple as the **above example**
+
+- Don't worry about your project's CSS. The widget's styling is done with [Tailwind CSS](https://tailwindcss.com/) and all classes are prefixed to avoid collisions with your existing CSS. This means that the widget's CSS will **NOT** affect yours. **One important thing is that you need to import `style.css` file from package folder:**
+
+```
+import 'fansunited-widget-either-or/style.css';
+```
+
+**N.B: If you are using an entry point for importing all your stylings, you need to `import fansunited-widget-either-or/style.css` there as well**
+
+-  **Easy translation in every language.** For more information [check our Translation heading](#translation).
+
+## Props
+
+```javascript
+type  EitherOrManagerProps = {
+	fansUnitedApiKey: string;
+	fansUnitedClientId: string;
+	fansUnitedLanguage?: string;
+	fansUnitedEnvironment?: string;
+	sportal365Project?: string;
+	sportal365Infrastructure?: 'shared' | 'betway';
+	labels?: LabelsModel;
+};
+```
+
+Fans United Either/Or Management Widget depends on [Fans United JS SDK](https://docs.fansunitedmedia.com/sdks/js) and [Fans United Client API](https://docs.fansunitedmedia.com/apis/client.api). Thats why `fansUnitedApiKey` and `fansUnitedClientId` are **required**. They will be provided to you from Fans United team. For other optional props here is some information:
+
+-  `fansUnitedLanguage` - for our sports APIs FansUnited platform supports different languages. For now they are **Bulgarian** (bg), **English** (en), **Romanian** (ro), **Greek** (el), **Slovak** (sk), **Serbian** (sr) and **Hungarian** (hu). If no value given it will be set to **English** (en).
+
+-  `fansUnitedEnvironment` - You can run the widget in the following environments: **staging**, **production** and **watg**. If no value given it will be set to **production** (prod).
+
+-  `labels` - you can easily translate all labels, UI messages, descriptions, placeholders and etc. with this prop. By default, Fans United Match Quiz Management Widget is available in **English** so if no value is given, the widget will be translated in English.
+
+-  `sportal365Project` - The Sportal365 project. Used as a request header when communicating with Sportal365 APIs.
+
+-  `sportal365Infrastructure` - The Sportal365 infrastructure. Used to determine what authorization should be used when communicating with Sportal365 APIs. If no value given (when sportal365Project props is provided) it will be set to **shared** .
+
+## Translation
+
+You can easily translate Fans United Either/Or Management Widget in your language! You just need to pass an object to `labels`  **prop** with concrete keys and values and that's it! Here's an example how you can do it:
+
+```javascript
+import  'fansunited-widget-either-or/style.css';
+import { EitherOrManager } from  'fansunited-widget-either-or';
+
+const  labels = {
+	userNotFound:  'User not found. Please try again',
+	noGamesFound: "No Either/Or games were found. You can create one by clicking the button 'Create'",
+	signOut:  'Sign out',
+	timeFormat:  'DD.MM.YYYY, HH:mm',
+	getEitherOrsErrorMessage: 'There was a problem with fetching list of Either/Or games',
+	title:  'Title',
+	status:  'Status',
+	creationDate:  'Created at',
+	actions:  'Actions',
+	create: 'Create',
+	edit: 'Edit',
+	save: 'Save',
+	preview: 'Preview',
+	close: 'Close',
+	titlePlaceholder: 'Provide a title for your Either/Or',
+	description: 'Description',
+	descriptionPlaceholder: 'Describe your Either/Or',
+	images: 'Images',
+	rules: 'Rules',
+	rulesPlaceholder: 'Describe your rules for participating in Either/Or',
+	adContent: 'Ad content',
+	adContentPlaceholder: 'Place your ad content in Either/Or',
+	optionImages: 'Option images',
+	main: 'Main',
+	cover: 'Cover',
+	mobile: 'Mobile',
+	imagePlaceholder: 'Paste your image as valid URL or as relative path',
+	active: 'Active',
+	inactive: 'Inactive',
+	statusDescription: "When Either/Or is Inactive, then users are not allowed to participate",
+	winningCondition: 'Winning condition',
+	winningConditionDescription: "Winning condition determines the correct choice out of a pair of options presented to the user. When is set to 'More,' the user must select the option that has a greater value to win. Conversely, if is set to 'Less,' the winning choice is the one with the lesser value",
+	more: 'More',
+	less: 'Less',
+	time: 'Time',
+	timePlaceholder: 'Enter the time limit for answering questions by users. Time is in seconds',
+	lives: 'Lives',
+	livesPlaceholder: 'Enter how many lives the user will have during a game',
+	points: 'Points',
+	pointsDescription: 'Set the threshold of consecutive correct answers after which points are awarded and define the amount of points received from this step onwards.Valid value for correct steps is between 0-50 and for score 1-100',
+	pointNumber: 'Point number',
+	pointsCorrectSteps: 'Correct steps',
+	pointsCorrectStepsPlaceholder: 'Set the number of correct steps needed in a row to earn points',
+	pointsScore: 'Score',
+	pointsScorePlaceholder: 'Set the points awarded per correct answer within the streak',
+	optionsDescription: 'Describe the options that users will select from during the game. Ensure to provide a minimum of 5 and a maximum of 100 options',
+	optionsValue: 'Value',
+	optionsValuePlaceholder: 'Type the value of the option',
+	repeatedValueMessage: 'You have entered a repeated value. Please enter a different one',
+	flags: 'Flags',
+	flagsPlaceholder: 'Type your flag and hit enter',
+	labels: 'Labels',
+	customFields: 'Custom fields',
+	dynamicFieldsDescription: 'You can create your custom attributes for easier way to connect or describe your Either/Or',
+	keyDynamicFields: 'Key',
+	valueDynamicFields: 'Value',
+	options: 'Options',
+	optionNumber: 'Option number',
+	context: 'Context',
+	content: 'Content',
+	tags: 'Tags',
+	entity: 'Entity',
+	campaign: 'Campaign',
+	tagNumber: 'Tag number',
+	id: 'ID',
+	idContentPlaceholder: 'Type the ID of your content',
+	idCampaignPlaceholder: 'Type the ID of your campaign',
+	label: 'Label',
+	labelContentPlaceholder: "Type the content's label",
+	labelCampaignPlaceholder: "Type the campaign's label",
+	type: 'Type',
+	typeDescription: 'Select the Either/Or type. You can set the types in our Management Portal by going to Features, then clicking on the Either/Or page',
+	noType: "No type",
+	deleteLabel: 'Delete',
+	cancelLabel: 'Cancel',
+	confirmationQuestionLabel: 'Are you sure you want to delete',
+	typeContentPlaceholder: "Type the content's type",
+	previewEitherOr: 'Preview Either/Or',
+	getFootballEntitiesErrorMessage: "There was a problem with fetching football's data",
+	createEitherOrMessage: 'You have successfully created Either/Or',
+	createEitherOrErrorMessage: 'There was a problem creating Either/Or. Please try again',
+	titleRequiredFieldValidationMessage: 'Title field is required!',
+	livesFieldValidationMessage: "The value for 'lives' field is invalid. The valid one is withing the range of 1-20",
+	timeFieldValidationMessage: "The value for 'time' field is invalid. The valid one is withing the range of 1-20",
+	pointsFieldValidationMessage: "Points contain value where score or correct steps is an invalid one",
+	optionsFieldValidationMessage: "Options must not contain any repeated IDs",
+	tagsInvalidFieldValidationMessage: 'Tag entity is required!',
+	getEitherOrErrorMessage: 'There was a problem with fetching Either/Or data. Please try again',
+	deleteEitherOrMessage: 'You have successfully deleted Either/Or',
+	deleteEitherOrErrorMessage: 'There was a problem with deleting Either/Or. Please try again',
+	updateEitherOrMessage: 'You have successfully updated Either/Or',
+	updateEitherOrErrorMessage: 'There was a problem updating Either/Or. Please try again',
+	uploadingImageMessage: 'You have successfully uploaded image',
+	generateSignedInUrlErrorMessage: 'There was a problem generating signed in URL to store the image in bucket. Please try again',
+	uploadingImageErrorMessage: 'There was a problem with uploading image to bucket. Please try again',
+	encryptingImageErrorMessage: 'There was a problem with encrypting image before uploading it to bucket. Please try again',
+	clear: 'Clear'
+	searchSportal365ImagesErrorMessage: 'There was a problem with searching images from Sportal 365 API. Please try again'
+	searchImage: 'Search image',
+	clearFromToFilterSportal365ImagesMessage: 'You have cleared from/to filter for Sportal365 search images',
+	hideFilters: 'Hide filters',
+	showFilters: 'Show filters',
+	dateFromTo: 'Date from/to',
+	dateFromToPlaceholder: 'Select Date...'
+
+};
+
+const  App = () => {
+return (
+<EitherOrManager
+	fansUnitedApiKey={'your-api-key'}
+	fansUnitedClientId={'your-client-id'}
+	labels={labels}/>
+);
+}
+```
+
+Here is all information about **`LabelsModel`**:
+
+| Key         | Description               | Default Value |
+| :-------------: |:-------------:| :-----:|
+| `userNotFound` | On login screen when client gives invalid information about email or password. | User not found. Please try again |
+| `noGamesFound` | When there are no created games for specific client, this message will appear on screen. | No Either/Or games were found. You can create one by clicking the button 'Create' |
+| `signOut` | Used as label on sign out button. | Sign out |
+| `getEitherOrsErrorMessage` | [react-toastify](https://github.com/fkhadra/react-toastify) error message when request fails for fetching list of Either/Or. | There was a problem with fetching list of Either/Or games |
+| `title` | Label for title | Title
+| `status` | Status of a Either/Or | Status |
+| `creationDate` | Date of created Either/Or in same format as given for **`timeFormat` prop** | Created at |
+| `actions` | Two icon buttons with different actions | Actions |
+| `create` | Label for management header | Create |
+| `edit` | Label for management header | Edit |
+| `save` | Label for save button | Save |
+| `preview` | Label for preview button | Preview |
+| `close` | Label for close button | Close |
+| `titlePlaceholder` | Placeholder/desciption about title input field name on management screen. | Provide a title for your Either/Or |
+| `timeFormat` | Timeformat for displaying dates. Widgets uses [dayjs](https://www.npmjs.com/package/dayjs) as a date dependency. | DD.MM.YYYY, HH:mm |
+| `previous` | Label for pagination button. | Previous |
+| `next` | Label for pagination button. | Next |
+| `id` | Label for ID read only input field. | ID |
+| `description` | Label for desciption input field on management screen. | Description |
+| `descriptionPlaceholder` | Placeholder/desciption about input field for game description when creating/editing a game. | Describe your Either/Or |
+| `images` | Label for images container. | Images |
+| `rules` | Label for rules rich text. | Rules |
+| `rulesPlaceholder` | Placeholder for rules rich text. | Describe your rules for participating in Either/Or |
+| `adContent` | Label for AD content rich text. | Ad content |
+| `adContentPlaceholder` | Placeholder for AD content rich text. | Place your ad content in Either/Or |
+| `optionImages` | Label for option images container. | Option images |
+| `main` | Label for main image. | Main |
+| `cover` | Label for cover image. | Cover |
+| `mobile` | Label for mobile image. | Mobile |
+| `imagePlaceholder` | Placeholder for image inputs. | Paste your image as valid URL or as relative path |
+| `active` | Label for status. | Active |
+| `inactive` | Label for status. | Inactive |
+| `statusDescription` | Description for status select. | When Either/Or is Inactive, then users are not allowed to participate |
+| `winningCondition` | Label for winning condition select. | Winning condition |
+| `winningConditionDescription` | Description for winning condition select. | Winning condition determines the correct choice out of a pair of options presented to the user. When is set to 'More,' the user must select the option that has a greater value to win. Conversely, if is set to 'Less,' the winning choice is the one with the lesser value |
+| `more` | Label for more option. | More |
+| `less` | Label for less option. | Less |
+| `time` | Label for time input. | Time |
+| `timePlaceholder` | Placeholder for time input. | Enter the time limit for answering questions by users. Time is in seconds |
+| `lives` | Label for lives input. | Lives |
+| `livesPlaceholder` | Placeholder for lives input. | Enter how many lives the user will have during a game |
+| `points` | Label for points. | Points |
+| `pointsDescription` | Description for points. | Set the threshold of consecutive correct answers after which points are awarded and define the amount of points received from this step onwards.Valid value for correct steps is between 0-50 and for score 1-100 |
+| `pointNumber` | Label for point container. | Point number |
+| `pointsCorrectSteps` | Label for points correct steps input. | Correct steps |
+| `pointsCorrectStepsPlaceholder` | Placeholder for point correct steps input. | Set the number of correct steps needed in a row to earn points |
+| `pointsScore` | Label for points score input. | Score |
+| `pointsScorePlaceholder` | Placeholder for points score input. | Set the points awarded per correct answer within the streak |
+| `optionsDescription` | Description for options. | Describe the options that users will select from during the game. Ensure to provide a minimum of 5 and a maximum of 100 options |
+| `optionsValue` | Label for options value. | Value |
+| `optionsValuePlaceholder` | Placeholder for options value. | Type the value of the option |
+| `flags` | Label for choosing flags. | Flags |
+| `flagsPlaceholder` | Placeholder on input field for flags | Type your flag and hit enter |
+| `labels` | Label for labels container | Labels |
+| `customFields` | Label for custom fields container | Custom fields |
+| `dynamicFieldsDescription` | Description paragraph for labels and custom fields containers | You can create your custom attributes for easier way to connect or describe your Either/Or |
+| `keyDynamicFields` | Label for key input | Key |
+| `valueDynamicFields` | Label for value input | Value |
+| `repeatedValueMessage` | [react-toastify](https://github.com/fkhadra/react-toastify) warning message when client submits same flag. | You have entered a repeated value. Please enter a different one |
+| `options` | Label for options. | Options |
+| `optionNumber` | Label for option container's header. | Option number |
+| `correct` | Label for correct radio button. | Correct |
+| `context` | Label for context container. | Context |
+| `content` | Label for context content container. | Content |
+| `tags` | Label for context tags container. | Tags |
+| `entity` | Label for entity search in tag. | Entity |
+| `campaign` | Label for context campaign container. | Campaign |
+| `tagNumber` | Label for context tag container's header. | Tag number |
+| `id` | Label for ID. | ID |
+| `idContentPlaceholder` | Placeholder for ID content in context. | Type the ID of your content |
+| `idCampaignPlaceholder` | Placeholder for ID content in campaign. | Type the ID of your campaign |
+| `label` | Label for context content/campaign label input. | Label |
+| `labelContentPlaceholder` | Placeholder for label content in context. | Type the content's label |
+| `labelCampaignPlaceholder` | Placeholder for label content in campaign. | Type the campaign's label |
+| `type` | Label for context content type input. | Type |
+| `typeDescription` | Description paragraph for type select. | Select the Either/Or type. You can set the types in our Management Portal by going to Features, then clicking on the Either/Or page |
+| `noType` | The default select option for Either/Or type. | No type |
+| `deleteLabel` | Label for delete button in confirmation modal. | Delete |
+| `cancelLabel` | Label for cancel button in confirmation modal. | Cancel |
+| `confirmationQuestionLabel` | Paragraph in confirmation modal. | Are you sure you want to delete |
+| `typeContentPlaceholder` | Placeholder for type content in context. | Type the content's type |
+| `previewEitherOr` | Title in preview modal. | Preview Either/Or |
+| `clear` | Label tippy clear button | Clear |
+| `searchImage` | Label for search image input | Search image |
+| `hideFilters` | Label for hyperlink to hide filters for image search | Hide filters |
+| `showFilters` | Label for hyperlink to show filters for image search | Show filters |
+| `dateFromTo` | Label for date from/to filter for image search | Date from/to |
+| `dateFromToPlaceholder` | Placeholder for input date from/to filter for image search | Select Date... |
+| `getFootballEntitiesErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when typing the name of the entity in tags and request fails. | There was a problem with fetching football's data |
+| `createEitherOrMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) successful message when creating Either/Or | You have successfully created Either/Or |
+| `createEitherOrErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when creating Either/Or | There was a problem creating Either/Or. Please try again |
+| `titleRequiredFieldValidationMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when validating title for Either/Or | Title field is required! |
+| `livesFieldValidationMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when validating lives for Either/Or | The value for 'lives' field is invalid. The valid one is withing the range of 1-20 |
+| `timeFieldValidationMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when validating time for Either/Or | The value for 'time' field is invalid. The valid one is withing the range of 1-20 |
+| `pointsFieldValidationMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when validating points for Either/Or | Points contain value where score or correct steps is an invalid one |
+| `optionsFieldValidationMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when validating options for Either/Or | Options must not contain any repeated IDs |
+| `tagsInvalidFieldValidationMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when validating tags for Either/Or | Tag entity is required! |
+| `updateEitherOrMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) successful message when updating Either/Or | You have successfully updated Either/Or |
+| `updateEitherOrErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when updating Either/Or | There was a problem updating Either/Or. Please try again |
+| `deleteEitherOrMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) successful message when deleting Either/Or | You have successfully deleted Either/Or |
+| `deleteEitherOrErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when deleting Either/Or | There was a problem with deleting Either/Or. Please try again |
+| `uploadingImageMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) success message when uploading image to bucket | You have successfully uploaded image |
+| `generateSignedInUrlErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when trying to receive a signed in URL. | There was a problem generating signed in URL to store the image in bucket. Please try again |
+| `uploadingImageErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when uploading image to bucket | There was a problem with uploading image to bucket. Please try again |
+| `encryptingImageErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when encrypting image before uploading it to bucket | There was a problem with encrypting image before uploading it to bucket. Please try again |
+| `clearFromToFilterSportal365ImagesMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) info message when clearing date from/to filter | You have cleared from/to filter for Sportal365 search images |
+| `searchSportal365ImagesErrorMessage` | [react-toastify](https://www.npmjs.com/package/react-toastify) error message when searching images from Sportal 365 API | There was a problem with searching images from Sportal 365 API. Please try again |

package/components/Buttons/ActionsButtons.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare const actionButtonStyle = "eow-rounded eow-p-1 eow-flex eow-items-center eow-mr-1";
+type ActionsButtonsProps = {
+    quizStatus: string;
+    onClickEdit: () => void;
+    onClickDelete: (event: React.MouseEvent<HTMLButtonElement>) => void;
+};
+declare const ActionsButtons: React.FC<ActionsButtonsProps>;
+export default ActionsButtons;

package/components/Buttons/AddButton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type AddButtonProps = {
+    isDisabled: boolean;
+    onClick: () => void;
+};
+declare const AddButton: React.FC<AddButtonProps>;
+export default AddButton;

package/components/Buttons/ClearButton.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type ClearButtonProps = {
+    onClick: () => void;
+};
+declare const ClearButton: React.FC<ClearButtonProps>;
+export default ClearButton;

package/components/Buttons/EitherOrsCard.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const EitherOrsCard: React.FC;
+export default EitherOrsCard;

package/components/Buttons/HomeButtons.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type HomeButtonsProps = {
+    toggleScreen: () => void;
+    fansUnitedEnvironment: string;
+};
+declare const HomeButtons: React.FC<HomeButtonsProps>;
+export default HomeButtons;

package/components/Buttons/ManageButtons.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type ManageButtonsProps = {
+    isLoading: boolean;
+    manageEitherOr: () => void;
+    handleModal: () => void;
+};
+declare const ManageButtons: React.FC<ManageButtonsProps>;
+export default ManageButtons;

package/components/Buttons/RemoveButton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type RemoveButtonProps = {
+    isDisabled: boolean;
+    onClick: () => void;
+};
+declare const RemoveButton: React.FC<RemoveButtonProps>;
+export default RemoveButton;

package/components/Buttons/SignOutButton.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type SignOutProps = {
+    fansUnitedEnvironment: string;
+};
+declare const SignOutButton: React.FC<SignOutProps>;
+export default SignOutButton;

package/components/Buttons/Sportal365/Sportal365Button.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type Sportal365ButtonProps = {
+    toggleShowImagesContainer: () => void;
+    isQuestionsAndOptions?: boolean;
+};
+declare const Sportal365Button: React.FC<Sportal365ButtonProps>;
+export default Sportal365Button;

package/components/Buttons/Sportal365/Sportal365QuestionAndOptionButton.d.ts

@@ -0,0 +1,11 @@
+import React, { Dispatch, SetStateAction } from 'react';
+type Sportal365ButtonProps = {
+    setShowImagesContainer: Dispatch<SetStateAction<{
+        mainImage: boolean;
+        mobileImage: boolean;
+    }>>;
+    isQuestionsAndOptions?: boolean;
+    imageNode: string;
+};
+declare const Sportal365QuestionAndOptionButton: React.FC<Sportal365ButtonProps>;
+export default Sportal365QuestionAndOptionButton;

package/components/Cards/ImagesCard.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type ImagesCardProps = {
+    images: string;
+};
+declare const ImagesCard: React.FC<ImagesCardProps>;
+export default ImagesCard;

package/components/Cards/WidgetCard.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const WidgetCard: React.FC;
+export default WidgetCard;

package/components/EitherOrs/EitherOrs.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type EitherOrsProps = {
+    fansUnitedEnvironment: string;
+};
+declare const EitherOrs: React.FC<EitherOrsProps>;
+export default EitherOrs;

package/components/Login/Login.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type LoginProps = {
+    fansUnitedEnvironment: string;
+};
+declare const Login: React.FC<LoginProps>;
+export default Login;

package/components/Main.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import LabelsModel from '../models/Labels/LabelsModel';
+type MainProps = {
+    fansUnitedApiKey: string;
+    fansUnitedClientId: string;
+    fansUnitedLanguage?: string;
+    fansUnitedEnvironment?: string;
+    sportal365Project?: string;
+    sportal365Infrastructure?: 'shared' | 'betway';
+    labels?: LabelsModel;
+};
+declare const Main: React.FC<MainProps>;
+export default Main;

package/components/MainLayout.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type MainLayoutProps = {
+    fansUnitedEnvironment: string;
+};
+declare const MainLayout: React.FC<MainLayoutProps>;
+export default MainLayout;

package/components/Management/Context/Context.d.ts

@@ -0,0 +1,9 @@
+import ContextModel from 'fansunited-sdk-esm/Core/Namespaces/Activity/Models/RequestBody/Context/ContextModel';
+import React, { Dispatch, SetStateAction } from 'react';
+import RequestBody from '../../../models/RequestBody/RequestBody';
+type ContextProps = {
+    defaultValue: ContextModel;
+    setRequestBody: Dispatch<SetStateAction<RequestBody>>;
+};
+declare const Context: React.FC<ContextProps>;
+export default Context;

package/components/Management/Context/FootballEntitySelect/FootballEntitySelect.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { Entity } from '../../../../types/types';
+import TagsModel from 'fansunited-sdk-esm/Core/Namespaces/Activity/Models/RequestBody/Context/TagsModel';
+type FootballEntitySelectProps = {
+    entity: Entity;
+    tag: TagsModel;
+    onChangeTagId: (entityId: string) => void;
+};
+declare const FootballEntitySelect: React.FC<FootballEntitySelectProps>;
+export default FootballEntitySelect;

package/components/Management/Context/SelectTagType/SelectTagType.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+type SelectTagTypeProps = {
+    defaultValue: string;
+    tagsTypes: string[];
+    onChangeTagType: (value: string) => void;
+};
+export declare const selectStyles: {
+    container: (provided: any) => any;
+    control: (provided: any) => any;
+    input: (provided: any) => any;
+    option: (provided: any, state: any) => any;
+};
+declare const SelectTagType: React.FC<SelectTagTypeProps>;
+export default SelectTagType;

package/components/Management/DynamicFields/DynamicFields.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type DynamicFieldsProps = {
+    property: 'labels' | 'custom_fields';
+    field: Object;
+    onChange: (field: Object) => void;
+};
+declare const DynamicFields: React.FC<DynamicFieldsProps>;
+export default DynamicFields;

package/components/Management/EitherOrSelect/EitherOrSelect.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type EitherOrSelectProps = {
+    type: 'status' | 'winning_condition';
+    defaultValue: string;
+    onChange: (arg: React.ChangeEvent<HTMLSelectElement>) => void;
+};
+declare const EitherOrSelect: React.FC<EitherOrSelectProps>;
+export default EitherOrSelect;

package/components/Management/Flags/Flags.d.ts

@@ -0,0 +1,8 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import RequestBody from '../../../models/RequestBody/RequestBody';
+type FlagsProps = {
+    defaultValue: string[];
+    setRequestBody: Dispatch<SetStateAction<RequestBody>>;
+};
+declare const Flags: React.FC<FlagsProps>;
+export default Flags;

package/components/Management/IDInput/IDInput.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type IDInputProps = {
+    value: string | null;
+};
+declare const IDInput: React.FC<IDInputProps>;
+export default IDInput;

package/components/Management/Images/FileUploader.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type FileUploaderProps = {
+    type: 'game' | 'option';
+    id: number;
+    imageNode: string;
+    onChangeImages: (value: string, imageNode: string) => void;
+};
+declare const FileUploader: React.FC<FileUploaderProps>;
+export default FileUploader;

package/components/Management/Images/Images.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import ImagesModel from 'fansunited-sdk-esm/Core/Global/Models/Images/ImagesModel';
+import MiniGameImages from 'fansunited-sdk-esm/Core/Namespaces/MiniGames/Models/MiniGameImages';
+type ImagesProps = {
+    onChange: (value: string, imageCases: string) => void;
+    loadedImages?: ImagesModel | MiniGameImages;
+};
+declare const Images: React.FC<ImagesProps>;
+export default Images;

package/components/Management/Images/Sportal365/Filters/Sportal365ImagesFromToFilter.d.ts

@@ -0,0 +1,7 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import Sportal365SearchImagesFilters from '../../../../../models/Sportal365/Sportal365SearchImagesFilters';
+type Sportal365ImagesFromToFilterProps = {
+    setFilters: Dispatch<SetStateAction<Sportal365SearchImagesFilters>>;
+};
+declare const Sportal365ImagesFromToFilter: React.FC<Sportal365ImagesFromToFilterProps>;
+export default Sportal365ImagesFromToFilter;

package/components/Management/Images/Sportal365/Sportal365Images.d.ts

@@ -0,0 +1,13 @@
+import React, { Dispatch, SetStateAction } from 'react';
+type Sportal365ImagesProps = {
+    onChangeImages: (url: string) => void;
+    type?: 'option';
+    imageNode?: string;
+    toggleShowImagesContainer?: () => void;
+    setShowImagesContainer?: Dispatch<SetStateAction<{
+        mainImage: boolean;
+        mobileImage: boolean;
+    }>>;
+};
+declare const Sportal365Images: React.FC<Sportal365ImagesProps>;
+export default Sportal365Images;

package/components/Management/Images/Sportal365/Sportal365ImagesPagination.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import Sportal365SearchImage from '../../../../models/Sportal365/Sportal365SearchImages';
+type PaginationProps = {
+    pageCount: number;
+    images: Sportal365SearchImage | null;
+    getPreviousPage: () => void;
+    getNextPage: () => void;
+};
+declare const Sportal365ImagesPagination: React.FC<PaginationProps>;
+export default Sportal365ImagesPagination;

package/components/Management/Images/Sportal365/Sportal365ImagesSearch.d.ts

@@ -0,0 +1,8 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import Sportal365SearchImagesFilters from '../../../../models/Sportal365/Sportal365SearchImagesFilters';
+type Sportal365ImagesSearchProps = {
+    setQuery: Dispatch<SetStateAction<string>>;
+    setFilters: Dispatch<SetStateAction<Sportal365SearchImagesFilters>>;
+};
+declare const Sportal365ImagesSearch: React.FC<Sportal365ImagesSearchProps>;
+export default Sportal365ImagesSearch;

package/components/Management/InformationInput/InformationInput.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+type InformationInputProps = {
+    title: string;
+    placeholder: string;
+    defaultValue: string;
+    imageNode?: string;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onChangeImages?: (value: string, imageNode: string) => void;
+};
+declare const InformationInput: React.FC<InformationInputProps>;
+export default InformationInput;

package/components/Management/ManageEitherOr.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import EitherOrById from '../../models/EitherOr/EitherOrById';
+type ManageEitherOrProps = {
+    refetchEitherOrs: {
+        current: boolean;
+    };
+    eitherOrById: EitherOrById | null;
+    toggleScreen: () => void;
+    clearEitherOrById: () => void;
+};
+declare const ManageEitherOr: React.FC<ManageEitherOrProps>;
+export default ManageEitherOr;

package/components/Management/ManagementScreenHeader.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type ManagementScreenHeaderProps = {
+    managementScreen: 'create' | 'edit';
+    toggleScreen: () => void;
+    clearQuizById: () => void;
+};
+declare const ManagementScreenHeader: React.FC<ManagementScreenHeaderProps>;
+export default ManagementScreenHeader;