@openedx/paragon 23.10.1 → 23.12.0

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","Alert","ALERT_CLOSE_LABEL_TEXT","Bubble","Button","ButtonGroup","ButtonToolbar","Chip","CHIP_PGN_CLASS","ChipCarousel","Container","Form","RadioControl","CheckboxControl","SwitchControl","FormSwitchSet","FormControl","FormControlDecoratorGroup","FormControlFeedback","FormCheck","FormFile","FormRadio","FormRadioSet","FormRadioSetContext","FormGroup","FormLabel","useCheckboxSetValues","FormText","FormAutosuggest","FormAutosuggestOption","InputGroup","Hyperlink","Icon","IconButton","IconButtonWithTooltip","ModalContext","ModalDialog","ModalLayer","Overlay","OverlayTrigger","Portal","Toast","TOAST_CLOSE_LABEL_TEXT","TOAST_DELAY","Tooltip","useWindowSize","useToggle","useArrowKeyNavigation","useIndexOfLastVisibleChild","useIsVisible","breakpoints","asInput","ActionRow","Annotation","Avatar","AvatarButton","Badge","Breadcrumb","Card","CardColumns","CardDeck","CardImg","CardGroup","CardGrid","CardCarousel","CARD_VARIANTS","Carousel","CarouselItem","CAROUSEL_NEXT_LABEL_TEXT","CAROUSEL_PREV_LABEL_TEXT","CloseButton","Layout","Col","Row","Collapse","Collapsible","Scrollable","Dropdown","DropdownToggle","DropdownButton","SplitButton","Fade","IconButtonToggle","Image","Figure","MailtoLink","MAIL_TO_LINK_EXTERNAL_LINK_ALTERNATIVE_TEXT","MAIL_TO_LINK_EXTERNAL_LINK_TITLE","Media","Menu","MenuItem","SelectMenu","SELECT_MENU_DEFAULT_MESSAGE","ModalCloseButton","FullscreenModal","FULLSCREEN_MODAL_CLOSE_LABEL","MarketingModal","StandardModal","STANDARD_MODAL_CLOSE_LABEL","AlertModal","ModalPopup","PopperElement","Nav","NavDropdown","NavItem","NavLink","Navbar","NavbarBrand","NAVBAR_LABEL","PageBanner","PAGE_BANNER_DISMISS_ALT_TEXT","Pagination","PAGINATION_BUTTON_LABEL_PREV","PAGINATION_BUTTON_ICON_BUTTON_NEXT_ALT","PAGINATION_BUTTON_ICON_BUTTON_PREV_ALT","PAGINATION_BUTTON_LABEL_PAGE_OF_COUNT","PAGINATION_BUTTON_LABEL_CURRENT_PAGE","PAGINATION_BUTTON_LABEL_NEXT","PAGINATION_BUTTON_LABEL_PAGE","Popover","PopoverTitle","PopoverContent","ProgressBar","ProductTour","ResponsiveEmbed","SearchField","SEARCH_FIELD_SCREEN_READER_TEXT_LABEL","SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON","SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON","SEARCH_FIELD_BUTTON_TEXT","Sheet","Spinner","Stepper","StatefulButton","Tabs","Tab","TabContainer","TabContent","TabPane","TransitionReplace","ValidationMessage","DataTable","TextFilter","CheckboxFilter","DropdownFilter","MultiSelectDropdownFilter","TableHeaderCell","TableCell","TableFilters","TABLE_FILTERS_BUTTON_TEXT","TableHeader","TableRow","TablePagination","TablePaginationMinimal","DataTableContext","BulkActions","TableControlBar","TableFooter","CardView","Skeleton","SkeletonTheme","Stack","ToggleButton","ToggleButtonGroup","Sticky","SelectableBox","Variant","OverflowScrollContext","OverflowScroll","useOverflowScroll","useOverflowScrollItems","Dropzone","messages","Truncate","ColorPicker","MediaQuery","useMediaQuery","Context","ResponsiveContext","useTable","useFilters","useGlobalFilter","useSortBy","useGroupBy","useExpanded","usePagination","useRowSelect","useRowState","useColumnOrder","useResizeColumns","useBlockLayout","useAbsoluteLayout","useFlexLayout"],"sources":["../src/index.ts"],"sourcesContent":["// // // // // // // // // // // // // // // // // // // // // // // // // // //\n// Things that have types\n// // // // // // // // // // // // // // // // // // // // // // // // // // //\nexport { default as Alert, ALERT_CLOSE_LABEL_TEXT } from './Alert';\nexport { default as Bubble } from './Bubble';\nexport { default as Button, ButtonGroup, ButtonToolbar } from './Button';\nexport { default as Chip, CHIP_PGN_CLASS } from './Chip';\nexport { default as ChipCarousel } from './ChipCarousel';\nexport { default as Container, type ContainerSize } from './Container';\nexport {\n  default as Form,\n  RadioControl,\n  CheckboxControl,\n  SwitchControl,\n  FormSwitchSet,\n  FormControl,\n  FormControlDecoratorGroup,\n  FormControlFeedback,\n  FormCheck,\n  FormFile,\n  FormRadio,\n  FormRadioSet,\n  FormRadioSetContext,\n  FormGroup,\n  FormLabel,\n  useCheckboxSetValues,\n  FormText,\n  FormAutosuggest,\n  FormAutosuggestOption,\n  InputGroup,\n} from './Form';\nexport { default as Hyperlink } from './Hyperlink';\nexport { default as Icon } from './Icon';\nexport { default as IconButton, IconButtonWithTooltip } from './IconButton';\nexport { default as ModalContext } from './Modal/ModalContext';\nexport { default as ModalDialog } from './Modal/ModalDialog';\nexport { default as ModalLayer } from './Modal/ModalLayer';\nexport { default as Overlay, OverlayTrigger } from './Overlay';\nexport { default as Portal } from './Modal/Portal';\nexport { default as Toast, TOAST_CLOSE_LABEL_TEXT, TOAST_DELAY } from './Toast';\nexport { default as Tooltip } from './Tooltip';\nexport { default as useWindowSize, type WindowSizeData } from './hooks/useWindowSizeHook';\nexport { default as useToggle, type Toggler, type ToggleHandlers } from './hooks/useToggleHook';\nexport { default as useArrowKeyNavigation, type ArrowKeyNavProps } from './hooks/useArrowKeyNavigationHook';\nexport { default as useIndexOfLastVisibleChild } from './hooks/useIndexOfLastVisibleChildHook';\nexport { default as useIsVisible } from './hooks/useIsVisibleHook';\nexport { default as breakpoints } from './utils/breakpoints';\n\n// // // // // // // // // // // // // // // // // // // // // // // // // // //\n// Things that don't have types\n// // // // // // // // // // // // // // // // // // // // // // // // // // //\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as asInput } from './asInput';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ActionRow } from './ActionRow';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Annotation } from './Annotation';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Avatar } from './Avatar';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as AvatarButton } from './AvatarButton';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Badge } from './Badge';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Breadcrumb } from './Breadcrumb';\n\nexport {\n  default as Card,\n  CardColumns,\n  CardDeck,\n  CardImg,\n  CardGroup,\n  CardGrid,\n  CardCarousel,\n  CARD_VARIANTS,\n  // @ts-ignore: has yet to be converted to TypeScript\n} from './Card';\nexport {\n  default as Carousel, CarouselItem, CAROUSEL_NEXT_LABEL_TEXT, CAROUSEL_PREV_LABEL_TEXT,\n  // @ts-ignore: has yet to be converted to TypeScript\n} from './Carousel';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as CloseButton } from './CloseButton';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Layout, Col, Row } from './Layout';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Collapse } from './Collapse';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Collapsible } from './Collapsible';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Scrollable } from './Scrollable';\nexport {\n  default as Dropdown,\n  DropdownToggle,\n  DropdownButton,\n  SplitButton,\n  // @ts-ignore: has yet to be converted to TypeScript\n} from './Dropdown';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Fade } from './Fade';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as IconButtonToggle } from './IconButtonToggle';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Image, Figure } from './Image';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as MailtoLink, MAIL_TO_LINK_EXTERNAL_LINK_ALTERNATIVE_TEXT, MAIL_TO_LINK_EXTERNAL_LINK_TITLE } from './MailtoLink';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Media } from './Media';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Menu } from './Menu';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as MenuItem } from './Menu/MenuItem';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as SelectMenu, SELECT_MENU_DEFAULT_MESSAGE } from './Menu/SelectMenu';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ModalCloseButton } from './Modal/ModalCloseButton';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as FullscreenModal, FULLSCREEN_MODAL_CLOSE_LABEL } from './Modal/FullscreenModal';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as MarketingModal } from './Modal/MarketingModal';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as StandardModal, STANDARD_MODAL_CLOSE_LABEL } from './Modal/StandardModal';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as AlertModal } from './Modal/AlertModal';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ModalPopup } from './Modal/ModalPopup';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as PopperElement } from './Modal/PopperElement';\n\nexport {\n  default as Nav,\n  NavDropdown,\n  NavItem,\n  NavLink,\n  // @ts-ignore: has yet to be converted to TypeScript\n} from './Nav';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Navbar, NavbarBrand, NAVBAR_LABEL } from './Navbar';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as PageBanner, PAGE_BANNER_DISMISS_ALT_TEXT } from './PageBanner';\nexport {\n  default as Pagination,\n  PAGINATION_BUTTON_LABEL_PREV,\n  PAGINATION_BUTTON_ICON_BUTTON_NEXT_ALT,\n  PAGINATION_BUTTON_ICON_BUTTON_PREV_ALT,\n  PAGINATION_BUTTON_LABEL_PAGE_OF_COUNT,\n  PAGINATION_BUTTON_LABEL_CURRENT_PAGE,\n  PAGINATION_BUTTON_LABEL_NEXT,\n  PAGINATION_BUTTON_LABEL_PAGE,\n  // @ts-ignore: has yet to be converted to TypeScript\n} from './Pagination';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Popover, PopoverTitle, PopoverContent } from './Popover';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ProgressBar } from './ProgressBar';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ProductTour } from './ProductTour';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ResponsiveEmbed } from './ResponsiveEmbed';\nexport {\n  default as SearchField,\n  SEARCH_FIELD_SCREEN_READER_TEXT_LABEL,\n  SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON,\n  SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON,\n  SEARCH_FIELD_BUTTON_TEXT,\n  // @ts-ignore: has yet to be converted to TypeScript\n} from './SearchField';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Sheet } from './Sheet';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Spinner } from './Spinner';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Stepper } from './Stepper';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as StatefulButton } from './StatefulButton';\nexport {\n  default as Tabs,\n  Tab,\n  TabContainer,\n  TabContent,\n  TabPane,\n// @ts-ignore: has yet to be converted to TypeScript\n} from './Tabs';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TransitionReplace } from './TransitionReplace';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ValidationMessage } from './ValidationMessage';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as DataTable } from './DataTable';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TextFilter } from './DataTable/filters/TextFilter';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as CheckboxFilter } from './DataTable/filters/CheckboxFilter';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as DropdownFilter } from './DataTable/filters/DropdownFilter';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as MultiSelectDropdownFilter } from './DataTable/filters/MultiSelectDropdownFilter';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TableHeaderCell } from './DataTable/TableHeaderCell';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TableCell } from './DataTable/TableCell';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TableFilters, TABLE_FILTERS_BUTTON_TEXT } from './DataTable/TableFilters';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TableHeader } from './DataTable/TableHeaderRow';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TableRow } from './DataTable/TableRow';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TablePagination } from './DataTable/TablePagination';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TablePaginationMinimal } from './DataTable/TablePaginationMinimal';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as DataTableContext } from './DataTable/DataTableContext';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as BulkActions } from './DataTable/BulkActions';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TableControlBar } from './DataTable/TableControlBar';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as TableFooter } from './DataTable/TableFooter';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as CardView } from './DataTable/CardView';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Skeleton, SkeletonTheme } from './Skeleton/index';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Stack } from './Stack';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ToggleButton, ToggleButtonGroup } from './ToggleButton';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Sticky } from './Sticky';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as SelectableBox } from './SelectableBox';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Variant } from './utils/constants';\nexport {\n  OverflowScrollContext,\n  OverflowScroll,\n  useOverflowScroll,\n  useOverflowScrollItems,\n  // @ts-ignore: has yet to be converted to TypeScript\n} from './OverflowScroll';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Dropzone } from './Dropzone';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as messages } from './i18n';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as Truncate } from './Truncate';\n// @ts-ignore: has yet to be converted to TypeScript\nexport { default as ColorPicker } from './ColorPicker';\n\n// // // // // // // // // // // // // // // // // // // // // // // // // // //\n// Pass through any needed whole third-party library functionality\n// useTable for example is needed to use the DataTable component seamlessly\n// rather than setting a peer dependency in this project, we opt to tightly\n// couple these dependencies by passing through needed functionality.\n// // // // // // // // // // // // // // // // // // // // // // // // // // //\nexport {\n  default as MediaQuery,\n  useMediaQuery,\n  Context as ResponsiveContext,\n} from 'react-responsive';\nexport {\n  useTable,\n  useFilters,\n  useGlobalFilter,\n  useSortBy,\n  useGroupBy,\n  useExpanded,\n  usePagination,\n  useRowSelect,\n  useRowState,\n  useColumnOrder,\n  useResizeColumns,\n  useBlockLayout,\n  useAbsoluteLayout,\n  useFlexLayout,\n} from 'react-table';\n"],"mappings":"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","ignoreList":[]}

package/dist/utils/breakpoints.d.ts

@@ -0,0 +1,26 @@
+interface BreakpointRange {
+  minWidth?: number;
+  maxWidth?: number;
+}
+
+interface Breakpoints {
+  extraSmall: BreakpointRange;
+  small: BreakpointRange;
+  medium: BreakpointRange;
+  large: BreakpointRange;
+  extraLarge: BreakpointRange;
+  extraExtraLarge: BreakpointRange;
+}
+
+export const Size: {
+  readonly xs: 'extraSmall';
+  readonly sm: 'small';
+  readonly md: 'medium';
+  readonly lg: 'large';
+  readonly xl: 'extraLarge';
+  readonly xxl: 'extraExtraLarge';
+};
+
+declare const breakpoints: Breakpoints;
+
+export default breakpoints;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openedx/paragon",
-  "version": "23.10.1",
+  "version": "23.12.0",
   "description": "Accessible, responsive UI component library based on Bootstrap.",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -31,8 +31,8 @@
     "commit": "commit",
     "debug-test": "node --inspect-brk node_modules/.bin/jest --runInBand --coverage",
     "stylelint": "stylelint \"src/**/*.scss\" \"scss/**/*.scss\" \"www/src/**/*.scss\" --config .stylelintrc.json",
-    "lint": "npm run stylelint && eslint --ext .js --ext .jsx --ext .ts --ext .tsx . && npm run lint --workspaces --if-present",
-    "lint:fix": "npm run stylelint && eslint --fix --ext .js --ext .jsx --ext .ts --ext .tsx . && npm run lint --workspaces --if-present",
+    "lint": "npm run stylelint && eslint --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json . && npm run lint --workspaces --if-present",
+    "lint:fix": "npm run stylelint && eslint --fix --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json . && npm run lint --workspaces --if-present",
     "prepublishOnly": "npm run build",
     "semantic-release": "semantic-release",
     "snapshot": "jest --updateSnapshot",
@@ -141,6 +141,10 @@
     "babel-loader": "^8.2.4",
     "commander": "^9.3.0",
     "eslint": "8.18.0",
+    "eslint-config-airbnb": "19.0.4",
+    "eslint-config-airbnb-typescript": "^17.0.0",
+    "eslint-plugin-import": "2.27.5",
+    "eslint-plugin-jsonc": "^2.18.1",
     "eslint-plugin-jsx-a11y": "6.7.1",
     "husky": "^9.0.11",
     "identity-obj-proxy": "^3.0.0",
@@ -198,7 +202,7 @@
     "extends @edx/browserslist-config"
   ],
   "lint-staged": {
-    "*.{js,jsx,ts,tsx}": [
+    "*.{js,jsx,ts,tsx,json}": [
       "npx eslint"
     ],
     "*.scss": [

package/src/Alert/{Alert.test.jsx → Alert.test.tsx}

@@ -7,10 +7,13 @@ import { Context as ResponsiveContext } from 'react-responsive';
 import { Info } from '../../icons';
 import breakpoints from '../utils/breakpoints';
 import Button from '../Button';
-import Alert from '.';
+import Alert, { AlertProps } from '.';
 
-// eslint-disable-next-line react/prop-types
-function AlertWrapper({ children, ...props }) {
+/** A compile time check. Whatever React elements this wraps won't run at runtime. */
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function CompileCheck(_props: { children: React.ReactNode }) { return null; }
+
+function AlertWrapper({ children, ...props }: AlertProps & { children: React.ReactNode }) {
   return (
     <IntlProvider locale="en" messages={{}}>
       <Alert {...props}>
@@ -20,6 +23,33 @@ function AlertWrapper({ children, ...props }) {
   );
 }
 
+describe('Alert component type checking', () => {
+  it('has correct typing', () => {
+    <CompileCheck>
+      <Alert>Basic alert</Alert>
+      <Alert variant="primary">Primary alert</Alert>
+      <Alert icon={Info}>Alert with icon</Alert>
+      <Alert dismissible onClose={() => {}}>Dismissible alert</Alert>
+      <Alert actions={[<Button key="action">Action</Button>]}>Alert with action</Alert>
+      <Alert stacked>Stacked alert</Alert>
+      <Alert closeLabel="Close">Custom close label</Alert>
+      <Alert.Heading>Alert heading</Alert.Heading>
+      <Alert.Link href="#">Alert link</Alert.Link>
+
+      {/* @ts-expect-error Invalid variant */}
+      <Alert variant="invalid" />
+      {/* @ts-expect-error Invalid icon type */}
+      <Alert icon="string" />
+      {/* @ts-expect-error Invalid closeLabel type */}
+      <Alert closeLabel={{}} />
+      {/* @ts-expect-error Invalid Heading props */}
+      <Alert.Heading href="#" />
+      {/* @ts-expect-error Invalid Link props */}
+      <Alert.Link variant="primary" />
+    </CompileCheck>;
+  });
+});
+
 describe('<Alert />', () => {
   it('renders without any props', () => {
     const tree = renderer.create((

package/src/Alert/{index.jsx → index.tsx}

@@ -1,18 +1,70 @@
-import React, { useCallback, useEffect, useState } from 'react';
+/* eslint-disable react/require-default-props */
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+  ReactNode,
+  ElementType,
+  forwardRef,
+  FC,
+  ForwardRefExoticComponent,
+  RefAttributes,
+  cloneElement,
+} from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import BaseAlert from 'react-bootstrap/Alert';
+import {
+  Alert as BaseAlert,
+  AlertProps as BaseAlertProps,
+} from 'react-bootstrap';
 import divWithClassName from 'react-bootstrap/divWithClassName';
 import { FormattedMessage } from 'react-intl';
 import { useMediaQuery } from 'react-responsive';
-import Icon from '../Icon';
+import Icon, { IconProps } from '../Icon';
 import breakpoints from '../utils/breakpoints';
 import Button from '../Button';
+// @ts-ignore for now - this needs to be converted to TypeScript
 import ActionRow from '../ActionRow';
 
 export const ALERT_CLOSE_LABEL_TEXT = 'Dismiss';
 
-const Alert = React.forwardRef(({
+export type AlertVariant = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light';
+
+export type BaseProps = Omit<BaseAlertProps, 'children' | 'variant' | 'closeLabel'>;
+
+export interface AlertProps extends BaseProps {
+  className?: string;
+  bsPrefix?: string;
+  variant?: AlertVariant;
+  children?: ReactNode;
+  icon?: React.ComponentType<IconProps>;
+  show?: boolean;
+  dismissible?: boolean;
+  onClose?: () => void;
+  actions?: React.ReactElement[];
+  stacked?: boolean;
+  closeLabel?: string | ReactNode;
+}
+
+export interface AlertHeadingProps {
+  as?: ElementType;
+  bsPrefix?: string;
+  children?: ReactNode;
+}
+
+export interface AlertLinkProps {
+  as?: ElementType;
+  bsPrefix?: string;
+  children?: ReactNode;
+  href?: string;
+}
+
+export interface AlertComponent extends ForwardRefExoticComponent<AlertProps & RefAttributes<HTMLDivElement>> {
+  Heading: FC<AlertHeadingProps>;
+  Link: FC<AlertLinkProps>;
+}
+
+const Alert = forwardRef<HTMLDivElement, AlertProps>(({
   children,
   icon,
   actions,
@@ -35,9 +87,9 @@ const Alert = React.forwardRef(({
   }, [isExtraSmall, stacked]);
 
   const cloneActionElement = useCallback(
-    (Action) => {
+    (Action: React.ReactElement) => {
       const addtlActionProps = { size: actionButtonSize, key: Action.props.children };
-      return React.cloneElement(Action, addtlActionProps);
+      return cloneElement(Action, addtlActionProps);
     },
     [],
   );
@@ -58,7 +110,7 @@ const Alert = React.forwardRef(({
         <div className="alert-message-content">
           {children}
         </div>
-        {(dismissible || actions?.length > 0) && (
+        {(dismissible || (actions && actions.length > 0)) && (
           <ActionRow className="pgn__alert-actions">
             <ActionRow.Spacer />
             {dismissible && (
@@ -82,7 +134,7 @@ const Alert = React.forwardRef(({
       </div>
     </BaseAlert>
   );
-});
+}) as AlertComponent;
 
 // This is needed to display a default prop for Alert.Heading element
 // Copied from react-bootstrap since BaseAlert.Heading component doesn't have defaultProps,
@@ -90,25 +142,30 @@ const Alert = React.forwardRef(({
 const DivStyledAsH4 = divWithClassName('h4');
 DivStyledAsH4.displayName = 'DivStyledAsH4';
 
-function AlertHeading(props) {
+function AlertHeading(props: AlertHeadingProps): JSX.Element {
   return <BaseAlert.Heading {...props} />;
 }
-function AlertLink(props) {
+
+function AlertLink(props: AlertLinkProps): JSX.Element {
   return <BaseAlert.Link {...props} />;
 }
 
-const commonPropTypes = {
+AlertLink.propTypes = {
   /** Specifies the base element */
-  as: PropTypes.elementType,
+  as: PropTypes.elementType as PropTypes.Validator<ElementType>,
   /** Overrides underlying component base CSS class name */
   bsPrefix: PropTypes.string,
 };
 
-AlertLink.propTypes = commonPropTypes;
-AlertHeading.propTypes = commonPropTypes;
+AlertHeading.propTypes = {
+  /** Specifies the base element */
+  as: PropTypes.elementType as PropTypes.Validator<ElementType>,
+  /** Overrides underlying component base CSS class name */
+  bsPrefix: PropTypes.string,
+};
 
 AlertLink.defaultProps = {
-  as: 'a',
+  as: 'a' as ElementType,
   bsPrefix: 'alert-link',
 };
 
@@ -124,24 +181,27 @@ Alert.propTypes = {
   /** Overrides underlying component base CSS class name */
   bsPrefix: PropTypes.string,
   /** Specifies variant to use. */
-  variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'dark', 'light']),
+  variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'dark', 'light'] as AlertVariant[]),
   /**
    * Animate the entering and exiting of the Alert. `true` will use the `<Fade>` transition,
    * more detailed customization is also provided.
    */
-  transition: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
-    in: PropTypes.bool,
-    appear: PropTypes.bool,
-    children: PropTypes.node,
-    onEnter: PropTypes.func,
-    onEntered: PropTypes.func,
-    onEntering: PropTypes.func,
-    onExit: PropTypes.func,
-    onExited: PropTypes.func,
-    onExiting: PropTypes.func,
-  })]),
+  transition: PropTypes.oneOfType([
+    PropTypes.bool,
+    PropTypes.shape({
+      in: PropTypes.bool,
+      appear: PropTypes.bool,
+      children: PropTypes.node,
+      onEnter: PropTypes.func,
+      onEntered: PropTypes.func,
+      onEntering: PropTypes.func,
+      onExit: PropTypes.func,
+      onExited: PropTypes.func,
+      onExiting: PropTypes.func,
+    }),
+  ]) as PropTypes.Validator<BaseAlertProps['transition']>,
   /** Docstring for the children prop */
-  children: PropTypes.node,
+  children: PropTypes.node as PropTypes.Validator<ReactNode>,
   /** Docstring for the icon prop... Icon that will be shown in the alert */
   icon: PropTypes.func,
   /** Whether the alert is shown. */
@@ -151,7 +211,7 @@ Alert.propTypes = {
   /** Optional callback function for when the alert it dismissed. */
   onClose: PropTypes.func,
   /** Optional list of action elements. May include, at most, 2 actions, or 1 if dismissible is true. */
-  actions: PropTypes.arrayOf(PropTypes.element),
+  actions: PropTypes.arrayOf(PropTypes.element) as PropTypes.Validator<React.ReactElement[]>,
   /** Position of the dismiss and call-to-action buttons. Defaults to ``false``. */
   stacked: PropTypes.bool,
   /** Sets the text for alert close button, defaults to 'Dismiss'. */
@@ -168,6 +228,9 @@ Alert.defaultProps = {
   closeLabel: undefined,
   show: true,
   stacked: false,
+  className: undefined,
+  bsPrefix: undefined,
+  variant: undefined,
 };
 
 Alert.Heading = AlertHeading;

package/src/Dropdown/README.md

@@ -112,6 +112,7 @@ You can use `Dropdown.Toggle` with [IconButton](/components/iconbutton) componen
     src={MoreVert}
     iconAs={Icon}
     variant="primary"
+    aria-label="More actions"
   />
   <Dropdown.Menu>
     <Dropdown.Item href="#/action-1">Action</Dropdown.Item>

package/src/Modal/ModalDialog.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { useMediaQuery } from 'react-responsive';
+import { useIntl } from 'react-intl';
 import ModalLayer from './ModalLayer';
 // @ts-ignore for now - this needs to be converted to TypeScript
 import ModalCloseButton from './ModalCloseButton';
@@ -18,8 +19,7 @@ import ModalDialogHero from './ModalDialogHero';
 import Icon from '../Icon';
 import IconButton from '../IconButton';
 import { Close } from '../../icons';
-
-export const MODAL_DIALOG_CLOSE_LABEL = 'Close';
+import messages from './messages';
 
 interface Props {
   /** Specifies the content of the dialog */
@@ -64,7 +64,7 @@ function ModalDialog({
   size = 'md',
   variant = 'default',
   hasCloseButton = true,
-  closeLabel = MODAL_DIALOG_CLOSE_LABEL,
+  closeLabel,
   isFullscreenScroll = false,
   className,
   isFullscreenOnMobile = false,
@@ -72,6 +72,8 @@ function ModalDialog({
   zIndex,
   isOverflowVisible,
 }: Props) {
+  const intl = useIntl();
+  const closeButtonText = closeLabel || intl.formatMessage(messages.closeButtonText);
   const isMobile = useMediaQuery({ query: '(max-width: 767.98px)' });
   const showFullScreen = (isFullscreenOnMobile && isMobile);
   return (
@@ -97,7 +99,7 @@ function ModalDialog({
               iconAs={Icon}
               invertColors={variant === 'dark'}
               src={Close}
-              alt={closeLabel}
+              alt={closeButtonText}
             />
           </div>
         )}

package/src/Modal/messages.ts

@@ -0,0 +1,11 @@
+import { defineMessages } from 'react-intl';
+
+const messages = defineMessages({
+  closeButtonText: {
+    id: 'pgn.Modal.closeButon',
+    defaultMessage: 'Close',
+    description: 'Accessible name for the close button in the modal dialog',
+  },
+});
+
+export default messages;

package/src/Modal/tests/AlertModal.test.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 
+import { IntlProvider } from 'react-intl';
 import AlertModal from '../AlertModal';
 import { Info } from '../../../icons';
 
@@ -37,15 +38,17 @@ describe('<AlertModal />', () => {
 
   it('renders the body when isOpen', () => {
     render(
-      <AlertModal
-        title="some title"
-        isOpen={isOpen}
-        onClose={closeFn}
-        footerNode={<p>footer</p>}
-        isOverflowVisible={false}
-      >
-        <Body />
-      </AlertModal>,
+      <IntlProvider locale="en" messages={{}}>
+        <AlertModal
+          title="some title"
+          isOpen={isOpen}
+          onClose={closeFn}
+          footerNode={<p>footer</p>}
+          isOverflowVisible={false}
+        >
+          <Body />
+        </AlertModal>
+      </IntlProvider>,
     );
 
     const body = screen.getByText('The body of alert.');
@@ -55,16 +58,18 @@ describe('<AlertModal />', () => {
   describe('with variant prop', () => {
     it('renders warning variant', () => {
       render(
-        <AlertModal
-          title="warning"
-          isOpen={isOpen}
-          onClose={closeFn}
-          icon={Info}
-          footerNode={<p>footer</p>}
-          isOverflowVisible={false}
-        >
-          <Body />
-        </AlertModal>,
+        <IntlProvider locale="en" messages={{}}>
+          <AlertModal
+            title="warning"
+            isOpen={isOpen}
+            onClose={closeFn}
+            icon={Info}
+            footerNode={<p>footer</p>}
+            isOverflowVisible={false}
+          >
+            <Body />
+          </AlertModal>
+        </IntlProvider>,
       );
 
       const modalTitle = screen.getByTestId('title-icon');
@@ -73,16 +78,18 @@ describe('<AlertModal />', () => {
 
     it('renders success variant', () => {
       render(
-        <AlertModal
-          title="success"
-          isOpen={isOpen}
-          onClose={closeFn}
-          icon={Info}
-          footerNode={<p>footer</p>}
-          isOverflowVisible={false}
-        >
-          <Body />
-        </AlertModal>,
+        <IntlProvider locale="en" messages={{}}>
+          <AlertModal
+            title="success"
+            isOpen={isOpen}
+            onClose={closeFn}
+            icon={Info}
+            footerNode={<p>footer</p>}
+            isOverflowVisible={false}
+          >
+            <Body />
+          </AlertModal>
+        </IntlProvider>,
       );
 
       const modalTitle = screen.getByTestId('title-icon');
@@ -91,16 +98,18 @@ describe('<AlertModal />', () => {
 
     it('renders danger variant', () => {
       render(
-        <AlertModal
-          title="danger"
-          isOpen={isOpen}
-          onClose={closeFn}
-          icon={Info}
-          footerNode={<p>footer</p>}
-          isOverflowVisible={false}
-        >
-          <Body />
-        </AlertModal>,
+        <IntlProvider locale="en" messages={{}}>
+          <AlertModal
+            title="danger"
+            isOpen={isOpen}
+            onClose={closeFn}
+            icon={Info}
+            footerNode={<p>footer</p>}
+            isOverflowVisible={false}
+          >
+            <Body />
+          </AlertModal>
+        </IntlProvider>,
       );
 
       const modalTitle = screen.getByTestId('title-icon');