@secondstaxorg/sscomp 1.4.4 → 1.4.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@secondstaxorg/sscomp",
-  "version": "1.4.4",
+  "version": "1.4.6",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
@@ -78,6 +78,8 @@
     "heroicons": "^2.0.12",
     "postcss": "^8.4.21",
     "react-chartjs-2": "^4.3.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-fast-marquee": "^1.3.5",
     "react-is": "^18.2.0",
     "rollup-plugin-copy": "^3.4.0",

package/types/components/CookieConsent/CookieConsent.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { CookieConsentProps } from "./type";
+/**
+ * Cookie consent dialogue at the bottom of the page across SSX applications
+ */
 declare const CookieConsent: (props: CookieConsentProps) => JSX.Element;
 export default CookieConsent;

package/types/components/CookieConsent/type.d.ts

@@ -1,5 +1,14 @@
 export interface CookieConsentProps {
+    /**
+     * Function that should be run when the accept button is clicked
+     */
     acceptFxn: () => void;
+    /**
+     * Function that should be run when the decline button is clicked
+     */
     declineFxn: () => void;
+    /**
+     * Function that should be run to close the dialogue
+     */
     closeFxn?: () => void;
 }

package/types/components/CountrySelector/CountrySelector.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { SelectorProps } from "./type";
+/**
+ * Dropdown selector for selecting countries and currencies
+ */
 declare const CountrySelector: (props: SelectorProps) => JSX.Element;
 export default CountrySelector;

package/types/components/CountrySelector/type.d.ts

@@ -1,15 +1,39 @@
 export interface SelectorProps {
+    /**
+     * Array of countries containing objects of country name, country short name, country flag and subname to be used in the case of selecting currencies
+     */
     options: {
         optionName: string;
         optionShortName: string;
         optionFlag?: string;
         subName?: string;
     }[];
+    /**
+     * Function to receive the object of the selected item from the dropdown
+     */
     selectedOption: (a: any) => void;
+    /**
+     * Initial text to be displayed in the field. Suitable to for when there is the need to display the current value of when updating a form
+     */
     initialText?: string;
+    /**
+     * Initial flag to be displayed in the field along with the initial text. Suitable to for when there is the need to display the current value of when updating a form
+     */
     initialFlag?: string;
+    /**
+     * Label for the field
+     */
     label?: string;
+    /**
+     * Placeholder text for the field
+     */
     placeholder?: string;
+    /**
+     * Boolean to specify whether the dropdown is searchable
+     */
     searchable?: boolean;
+    /**
+     * Division in the list to segment different groups of options
+     */
     sectionTitle?: string;
 }

package/types/components/CurrencyPairs/CurrencyPairsTable.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { CurrencyPairsProps } from "./type";
+/**
+ * Table with a list of all currency pairs in the LP platform
+ */
 declare const CurrencyPairsTable: (props: CurrencyPairsProps) => JSX.Element;
 export default CurrencyPairsTable;

package/types/components/CurrencyPairs/type.d.ts

@@ -1,4 +1,7 @@
 export interface CurrencyPairsProps {
+    /**
+     * Array containing objects with the keys for the pairs object
+     */
     pairs: {
         pairCode: string;
         baseCurrency: string;
@@ -7,6 +10,9 @@ export interface CurrencyPairsProps {
         exchangeFlag: string;
         pairName: string;
     }[];
+    /**
+     * Function that receives the selected row of currency pair when clicked
+     */
     callback: (a: {
         pairCode: string;
         baseCurrency: string;

package/types/components/DatePicker/DatePicker.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { DatePickerProps } from "./type";
+/**
+ * Component for picking date
+ */
 declare const DatePicker: (props: DatePickerProps) => JSX.Element;
 export default DatePicker;

package/types/components/DatePicker/type.d.ts

@@ -1,8 +1,26 @@
 export interface DatePickerProps {
+    /**
+     * Function that receives the date that is selected from the component
+     */
     onChange: (date: Date) => void;
+    /**
+     * Label for the datepicker field
+     */
     label?: string;
+    /**
+     * Subtext below the label
+     */
     subtext?: string;
+    /**
+     * Boolean to specify whether user can pick past dates
+     */
     disablePastDays?: boolean;
+    /**
+     * Boolean to specify whether user can pick future dates
+     */
     disableFutureDays?: boolean;
+    /**
+     * Placeholder text for the datepicker field
+     */
     placeholder?: string;
 }

package/types/components/DateRangePicker/DateRangePicker.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
 import { DateRangePickerProps } from "./type";
+/**
+ * Component for picking date ranges
+ */
 declare const DateRangePicker: React.FC<DateRangePickerProps>;
 export default DateRangePicker;

package/types/components/DateRangePicker/type.d.ts

@@ -1,9 +1,25 @@
 export interface DateRangePickerProps {
+    /**
+     * Function to receive the selected dates
+     */
     selectedDateRange: (a: {
         startDate: Date | null;
         endDate: Date | null;
     }) => void;
+    /**
+     * Label for the date range picker field
+     */
     label?: string;
+    /**
+     * Subtext to go with the label
+     */
     subtext?: string;
+    /**
+     * Placeholder text for the date range picker field
+     */
     placeholder?: string;
+    /**
+     * Placeholder text for the date range picker field
+     */
+    showActionButtons?: boolean;
 }

package/types/components/DropdownList/DropdownList.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { DropdownProps } from "./type";
+/**
+ * Dropdown component for selecting from a list of options
+ */
 declare const DropdownList: (props: DropdownProps) => JSX.Element;
 export default DropdownList;

package/types/components/DropdownList/type.d.ts

@@ -1,15 +1,36 @@
 export interface DropdownProps {
+    /**
+     * Array with object containing the label and value for each item to be displayed in the list
+     */
     options: {
         label: string;
         value: string;
     }[];
+    /**
+     * Initial text to be displayed in the field. Ideal for when using an update form to display the current value of the field
+     */
     initialText?: string;
+    /**
+     * Placeholder text to be displayed in the field
+     */
     placeholder?: string;
+    /**
+     * Function to receive the object of the selected item
+     */
     returnedSelection: (a: {
         label: string;
         value: string;
     }) => void;
+    /**
+     * Boolean to specify whether the field is active or disabled
+     */
     disabled?: boolean;
+    /**
+     * Label of the field
+     */
     label?: string;
+    /**
+     * Boolean to specify whether the list is searchable
+     */
     searchable?: boolean;
 }

package/types/components/ExchangeRates/ExchangeRates.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
 import { ExchangeRatesProps } from "./type";
+/**
+ * Cards to display exchange rates between currencies
+ *
+ */
 declare const ExchangeRates: (props: ExchangeRatesProps) => JSX.Element;
 export default ExchangeRates;

package/types/components/ExchangeRates/type.d.ts

@@ -1,8 +1,23 @@
 export interface ExchangeRatesProps {
+    /**
+     * The base currency from which the conversion is done
+     */
     baseCurr: string;
+    /**
+     * Short name of the base currency
+     */
     baseCurrShortName: string;
+    /**
+     * The source of the rates data
+     */
     source: string;
+    /**
+     * Date when the rate was last updated
+     */
     lastUpdated: string;
+    /**
+     * Array of other currencies to which the conversion is being done along with their rates comparing to the base currency
+     */
     exchangeCurrs: {
         currName: string;
         rate: number;

package/types/components/Indices/Indices.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { IndicesType } from "./type";
+/**
+ * Component for displaying a widget of indices for different commodities
+ */
 declare const Indices: (props: IndicesType) => JSX.Element;
 export default Indices;

package/types/components/Indices/type.d.ts

@@ -1,9 +1,18 @@
 export interface IndicesType {
+    /**
+     * Array containing the commodities and their values
+     */
     indices: {
         itemName: string;
         value: number;
         changePercent: number;
     }[];
+    /**
+     * The source where the data is being taken from
+     */
     source?: string;
+    /**
+     * Date when the data was last updated
+     */
     lastUpdated: string;
 }

package/types/components/LPRequestTable/LPRequestTable.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { RequestsProps } from "./type";
+/**
+ * Table for displaying a history of LP requests in the LP app
+ */
 declare const LPRequestTable: (props: RequestsProps) => JSX.Element;
 export default LPRequestTable;

package/types/components/LPRequestTable/type.d.ts

@@ -1,4 +1,7 @@
 export interface RequestsProps {
+    /**
+     * Array of transactions and their associated information
+     */
     transactions: {
         providerLogo?: string;
         providerName: string;
@@ -14,6 +17,9 @@ export interface RequestsProps {
         broker: string;
         clientId: string;
     }[];
+    /**
+     * Callback function to receive the object of the selected item
+     */
     callback: (a: {
         providerLogo?: string;
         providerName: string;
@@ -29,7 +35,16 @@ export interface RequestsProps {
         broker: string;
         clientId: string;
     }) => void;
+    /**
+     * Function to trigger a new transaction
+     */
     newTransactionFxn: () => void;
+    /**
+     * Boolean to display a details arrow for when there are details to show
+     */
     showDetailsArrow: boolean;
+    /**
+     * Boolean to display a column in the table for the broker
+     */
     showBroker?: boolean;
 }

package/types/components/LPSideNav/LPSideNav.d.ts

@@ -2,8 +2,7 @@
 import './icons.css';
 import { SideNavProps } from "./type";
 /**
- * NOTE<br>
- * currentPage (optional) -- passed to the component to match pageName from mainNavLinks to highlight the current page in the menu
+ * Component for displaying a side navigation menu
  * */
 declare const LPSideNav: (props: SideNavProps) => JSX.Element;
 export default LPSideNav;

package/types/components/LPSideNav/type.d.ts

@@ -1,6 +1,12 @@
 import React, { ReactNode } from "react";
 export interface SideNavProps {
+    /**
+     * passed to the component to match pageName from mainNavLinks to highlight the current page in the menu
+     * */
     currentPage?: string;
+    /**
+     * Array of links to be displayed in the side nav with their associated keys in each object
+     */
     mainNavLinks: {
         label: string;
         iconClass: string;
@@ -8,6 +14,9 @@ export interface SideNavProps {
         pageName: string;
         LinkComponent?: renderLink;
     }[];
+    /**
+     * Specify whether to display the code maintenance menu or not
+     */
     codeMaintenanceLinks: boolean;
 }
 interface LinkProps {

package/types/components/LPTopBar/LPTopBar.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { TopBarProps } from "./type";
+/**
+ *
+ */
 declare const LPTopBar: (props: TopBarProps) => JSX.Element;
 export default LPTopBar;

package/types/components/LPTopBar/type.d.ts

@@ -1,6 +1,15 @@
 export interface TopBarProps {
+    /**
+     * Username of the logged-in user
+     */
     userName: string;
+    /**
+     * URL to the lp request page
+     */
     requestLpUrl: string;
+    /**
+     * Array of notifications to be displayed in the notifications panel
+     */
     notifications: {
         notifTitle: string;
         notifTime: string;
@@ -14,6 +23,12 @@ export interface TopBarProps {
         transactionNumber: string;
         notifRead: boolean;
     }[];
+    /**
+     * Logged-in user's profile image url
+     */
     myProfileUrl: string;
+    /**
+     * URL endpoint to perform a logout
+     */
     signOutApiUrl: string;
 }

package/types/components/LoadingShimmer/LoadingShimmer.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { LoaderType } from "./type";
+/**
+ * Displaying skeleton loader in anticipation of data that is being loaded
+ */
 declare const LoadingShimmer: (props: LoaderType) => JSX.Element;
 export default LoadingShimmer;

package/types/components/LoadingShimmer/type.d.ts

@@ -1,5 +1,14 @@
 export interface LoaderType {
+    /**
+     * Shape of skeleton loader
+     */
     shape: 'circular' | 'rectangular';
+    /**
+     * Width of the skeleton loader. If not specified, it assumes the full width of the space available to it.
+     */
     width?: number;
+    /**
+     * Height of the skeleton loader. Unlike the width, this is required.
+     */
     height: number;
 }

package/types/components/LoadingSpinner/LoadingSpinner.d.ts

@@ -1,7 +1,13 @@
 /// <reference types="react" />
 import './style.css';
 export interface LoaderProps {
+    /**
+     * Variant of the loader whether
+     */
     variant: 'primary' | 'error';
 }
+/**
+ * Component for displaying a loading spinner for when data is being loaded
+ */
 declare const Loader: (props: LoaderProps) => JSX.Element;
 export default Loader;

package/types/components/MarketData/MarketData.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { MarketDataProps } from "./type";
+/**
+ * Component to display cards of market data widget
+ */
 declare const MarketData: (props: MarketDataProps) => JSX.Element;
 export default MarketData;

package/types/components/MarketData/type.d.ts

@@ -1,4 +1,7 @@
 export interface MarketDataProps {
+    /**
+     * Array of data to be displayed in the cards
+     */
     marketData: {
         market: string;
         marketCountryFlag: string;

package/types/components/MarketMovers/MarketMovers.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { MarketMoversProps } from "./type";
+/**
+ * Component to display a widget for market movers
+ */
 declare const MarketMovers: (props: MarketMoversProps) => JSX.Element;
 export default MarketMovers;

package/types/components/MarketMovers/type.d.ts

@@ -1,4 +1,7 @@
 export interface MarketMoversProps {
+    /**
+     * Array of data to be displayed in the cards
+     */
     movers: {
         entityName: string;
         entityShortName: string;
@@ -8,5 +11,8 @@ export interface MarketMoversProps {
         type: 'top' | 'worst';
         marketFlag: string;
     }[];
+    /**
+     * Date when the data was last updated
+     */
     lastUpdated: string;
 }

package/types/components/MenuBar/MenuBar.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { MenuBarProps } from "./type";
+/**
+ * Menu bar displaying a menu at the top of the news app
+ */
 declare const MenuBar: (props: MenuBarProps) => JSX.Element;
 export default MenuBar;

package/types/components/MenuBar/type.d.ts

@@ -1,8 +1,14 @@
 export interface MenuBarProps {
+    /**
+     * Array containing menu items to be displayed in the menu list
+     */
     menuItems: {
         label: string;
         url: string;
         pageName?: string;
     }[];
+    /**
+     * Name of the current page. Should match the <code>pageName</code> from the <code>menuItems</code> array for highlighting the current page
+     */
     currentPageName?: string;
 }

package/types/components/NewsCard/NewsCard.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { NewsProps } from "./type";
+/**
+ * Card to display news items in the News application
+ */
 declare const NewsCard: (props: NewsProps) => JSX.Element;
 export default NewsCard;

package/types/components/NewsCard/type.d.ts

@@ -1,10 +1,34 @@
 export interface NewsProps {
+    /**
+     * ID of the news item
+     */
     id: string;
+    /**
+     * Title of the news item
+     */
     title: string;
+    /**
+     * Excerpt of the news item
+     */
     excerpt: string;
+    /**
+     * Source of the news item
+     */
     source: string;
+    /**
+     * Country flag of the source
+     */
     sourceCountryFlag: string;
+    /**
+     * Date of the news item
+     */
     date: string;
+    /**
+     * Featured image of the news item
+     */
     featuredImg: string;
+    /**
+     * URL of the news item
+     */
     storyUrl: string;
 }

package/types/components/NewsFilterBar/NewsFilterBar.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { NewsFilterProps } from "./type";
+/**
+ * Filter bar for news items on the news application
+ */
 declare const NewsFilterBar: (props: NewsFilterProps) => JSX.Element;
 export default NewsFilterBar;

package/types/components/NewsFilterBar/type.d.ts

@@ -1,13 +1,25 @@
 import React from "react";
 export interface NewsFilterProps extends React.HTMLAttributes<any> {
+    /**
+     * Array of source countries
+     */
     countries: {
         label: string;
         value: string;
     }[];
+    /**
+     * Array of source outlets
+     */
     outlets: {
         label: string;
         value: string;
     }[];
+    /**
+     * Callback function to receive the selected outlet
+     */
     selectedOutletFxn?: Function;
+    /**
+     * Callback function to receive the selected source country
+     */
     selectedCountryFxn?: Function;
 }

package/types/components/NewsSourceTag/NewsSourceTag.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { TagProps } from "./type";
+/**
+ * Card tag to display the source and date of a news item
+ */
 declare const NewsSourceTag: (props: TagProps) => JSX.Element;
 export default NewsSourceTag;

package/types/components/NewsSourceTag/type.d.ts

@@ -1,5 +1,14 @@
 export interface TagProps {
+    /**
+     * URL to the flag of the source country
+     */
     flag: string;
+    /**
+     * Name of the source where the news item is coming from
+     */
     source: string;
+    /**
+     * Date when the news item was published
+     */
     date: string;
 }

package/types/components/NewsTitleBar/NewsTitleBar.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { NewsBarProps } from "./type";
+/**
+ * Component to display a section title on the news application where news items are displayed
+ */
 declare const NewsTitleBar: (props: NewsBarProps) => JSX.Element;
 export default NewsTitleBar;

package/types/components/NewsTitleBar/type.d.ts

@@ -1,4 +1,7 @@
 import React from "react";
 export interface NewsBarProps extends React.HTMLAttributes<any> {
+    /**
+     * Title of the section
+     */
     title: string;
 }