@openedx/paragon 23.10.0 → 23.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1 @@
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":[]}
@@ -0,0 +1,26 @@
1
+ interface BreakpointRange {
2
+ minWidth?: number;
3
+ maxWidth?: number;
4
+ }
5
+
6
+ interface Breakpoints {
7
+ extraSmall: BreakpointRange;
8
+ small: BreakpointRange;
9
+ medium: BreakpointRange;
10
+ large: BreakpointRange;
11
+ extraLarge: BreakpointRange;
12
+ extraExtraLarge: BreakpointRange;
13
+ }
14
+
15
+ export const Size: {
16
+ readonly xs: 'extraSmall';
17
+ readonly sm: 'small';
18
+ readonly md: 'medium';
19
+ readonly lg: 'large';
20
+ readonly xl: 'extraLarge';
21
+ readonly xxl: 'extraExtraLarge';
22
+ };
23
+
24
+ declare const breakpoints: Breakpoints;
25
+
26
+ export default breakpoints;
@@ -144,10 +144,6 @@ async function buildTokensCommand(commandArgs) {
144
144
  {
145
145
  format: 'css/component-button-variant-overrides',
146
146
  destination: `themes/${themeVariant}/overrides/component-button-variants.css`,
147
- filter: transformSourceTokensOnly ? 'isSource' : undefined,
148
- options: {
149
- outputReferences,
150
- },
151
147
  },
152
148
  ],
153
149
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@openedx/paragon",
3
- "version": "23.10.0",
3
+ "version": "23.11.0",
4
4
  "description": "Accessible, responsive UI component library based on Bootstrap.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -31,8 +31,8 @@
31
31
  "commit": "commit",
32
32
  "debug-test": "node --inspect-brk node_modules/.bin/jest --runInBand --coverage",
33
33
  "stylelint": "stylelint \"src/**/*.scss\" \"scss/**/*.scss\" \"www/src/**/*.scss\" --config .stylelintrc.json",
34
- "lint": "npm run stylelint && eslint --ext .js --ext .jsx --ext .ts --ext .tsx . && npm run lint --workspaces --if-present",
35
- "lint:fix": "npm run stylelint && eslint --fix --ext .js --ext .jsx --ext .ts --ext .tsx . && npm run lint --workspaces --if-present",
34
+ "lint": "npm run stylelint && eslint --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json . && npm run lint --workspaces --if-present",
35
+ "lint:fix": "npm run stylelint && eslint --fix --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json . && npm run lint --workspaces --if-present",
36
36
  "prepublishOnly": "npm run build",
37
37
  "semantic-release": "semantic-release",
38
38
  "snapshot": "jest --updateSnapshot",
@@ -141,6 +141,10 @@
141
141
  "babel-loader": "^8.2.4",
142
142
  "commander": "^9.3.0",
143
143
  "eslint": "8.18.0",
144
+ "eslint-config-airbnb": "19.0.4",
145
+ "eslint-config-airbnb-typescript": "^17.0.0",
146
+ "eslint-plugin-import": "2.27.5",
147
+ "eslint-plugin-jsonc": "^2.18.1",
144
148
  "eslint-plugin-jsx-a11y": "6.7.1",
145
149
  "husky": "^9.0.11",
146
150
  "identity-obj-proxy": "^3.0.0",
@@ -198,7 +202,7 @@
198
202
  "extends @edx/browserslist-config"
199
203
  ],
200
204
  "lint-staged": {
201
- "*.{js,jsx,ts,tsx}": [
205
+ "*.{js,jsx,ts,tsx,json}": [
202
206
  "npx eslint"
203
207
  ],
204
208
  "*.scss": [
@@ -7,10 +7,13 @@ import { Context as ResponsiveContext } from 'react-responsive';
7
7
  import { Info } from '../../icons';
8
8
  import breakpoints from '../utils/breakpoints';
9
9
  import Button from '../Button';
10
- import Alert from '.';
10
+ import Alert, { AlertProps } from '.';
11
11
 
12
- // eslint-disable-next-line react/prop-types
13
- function AlertWrapper({ children, ...props }) {
12
+ /** A compile time check. Whatever React elements this wraps won't run at runtime. */
13
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
14
+ function CompileCheck(_props: { children: React.ReactNode }) { return null; }
15
+
16
+ function AlertWrapper({ children, ...props }: AlertProps & { children: React.ReactNode }) {
14
17
  return (
15
18
  <IntlProvider locale="en" messages={{}}>
16
19
  <Alert {...props}>
@@ -20,6 +23,33 @@ function AlertWrapper({ children, ...props }) {
20
23
  );
21
24
  }
22
25
 
26
+ describe('Alert component type checking', () => {
27
+ it('has correct typing', () => {
28
+ <CompileCheck>
29
+ <Alert>Basic alert</Alert>
30
+ <Alert variant="primary">Primary alert</Alert>
31
+ <Alert icon={Info}>Alert with icon</Alert>
32
+ <Alert dismissible onClose={() => {}}>Dismissible alert</Alert>
33
+ <Alert actions={[<Button key="action">Action</Button>]}>Alert with action</Alert>
34
+ <Alert stacked>Stacked alert</Alert>
35
+ <Alert closeLabel="Close">Custom close label</Alert>
36
+ <Alert.Heading>Alert heading</Alert.Heading>
37
+ <Alert.Link href="#">Alert link</Alert.Link>
38
+
39
+ {/* @ts-expect-error Invalid variant */}
40
+ <Alert variant="invalid" />
41
+ {/* @ts-expect-error Invalid icon type */}
42
+ <Alert icon="string" />
43
+ {/* @ts-expect-error Invalid closeLabel type */}
44
+ <Alert closeLabel={{}} />
45
+ {/* @ts-expect-error Invalid Heading props */}
46
+ <Alert.Heading href="#" />
47
+ {/* @ts-expect-error Invalid Link props */}
48
+ <Alert.Link variant="primary" />
49
+ </CompileCheck>;
50
+ });
51
+ });
52
+
23
53
  describe('<Alert />', () => {
24
54
  it('renders without any props', () => {
25
55
  const tree = renderer.create((
@@ -1,18 +1,70 @@
1
- import React, { useCallback, useEffect, useState } from 'react';
1
+ /* eslint-disable react/require-default-props */
2
+ import React, {
3
+ useCallback,
4
+ useEffect,
5
+ useState,
6
+ ReactNode,
7
+ ElementType,
8
+ forwardRef,
9
+ FC,
10
+ ForwardRefExoticComponent,
11
+ RefAttributes,
12
+ cloneElement,
13
+ } from 'react';
2
14
  import PropTypes from 'prop-types';
3
15
  import classNames from 'classnames';
4
- import BaseAlert from 'react-bootstrap/Alert';
16
+ import {
17
+ Alert as BaseAlert,
18
+ AlertProps as BaseAlertProps,
19
+ } from 'react-bootstrap';
5
20
  import divWithClassName from 'react-bootstrap/divWithClassName';
6
21
  import { FormattedMessage } from 'react-intl';
7
22
  import { useMediaQuery } from 'react-responsive';
8
- import Icon from '../Icon';
23
+ import Icon, { IconProps } from '../Icon';
9
24
  import breakpoints from '../utils/breakpoints';
10
25
  import Button from '../Button';
26
+ // @ts-ignore for now - this needs to be converted to TypeScript
11
27
  import ActionRow from '../ActionRow';
12
28
 
13
29
  export const ALERT_CLOSE_LABEL_TEXT = 'Dismiss';
14
30
 
15
- const Alert = React.forwardRef(({
31
+ export type AlertVariant = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light';
32
+
33
+ export type BaseProps = Omit<BaseAlertProps, 'children' | 'variant' | 'closeLabel'>;
34
+
35
+ export interface AlertProps extends BaseProps {
36
+ className?: string;
37
+ bsPrefix?: string;
38
+ variant?: AlertVariant;
39
+ children?: ReactNode;
40
+ icon?: React.ComponentType<IconProps>;
41
+ show?: boolean;
42
+ dismissible?: boolean;
43
+ onClose?: () => void;
44
+ actions?: React.ReactElement[];
45
+ stacked?: boolean;
46
+ closeLabel?: string | ReactNode;
47
+ }
48
+
49
+ export interface AlertHeadingProps {
50
+ as?: ElementType;
51
+ bsPrefix?: string;
52
+ children?: ReactNode;
53
+ }
54
+
55
+ export interface AlertLinkProps {
56
+ as?: ElementType;
57
+ bsPrefix?: string;
58
+ children?: ReactNode;
59
+ href?: string;
60
+ }
61
+
62
+ export interface AlertComponent extends ForwardRefExoticComponent<AlertProps & RefAttributes<HTMLDivElement>> {
63
+ Heading: FC<AlertHeadingProps>;
64
+ Link: FC<AlertLinkProps>;
65
+ }
66
+
67
+ const Alert = forwardRef<HTMLDivElement, AlertProps>(({
16
68
  children,
17
69
  icon,
18
70
  actions,
@@ -35,9 +87,9 @@ const Alert = React.forwardRef(({
35
87
  }, [isExtraSmall, stacked]);
36
88
 
37
89
  const cloneActionElement = useCallback(
38
- (Action) => {
90
+ (Action: React.ReactElement) => {
39
91
  const addtlActionProps = { size: actionButtonSize, key: Action.props.children };
40
- return React.cloneElement(Action, addtlActionProps);
92
+ return cloneElement(Action, addtlActionProps);
41
93
  },
42
94
  [],
43
95
  );
@@ -58,7 +110,7 @@ const Alert = React.forwardRef(({
58
110
  <div className="alert-message-content">
59
111
  {children}
60
112
  </div>
61
- {(dismissible || actions?.length > 0) && (
113
+ {(dismissible || (actions && actions.length > 0)) && (
62
114
  <ActionRow className="pgn__alert-actions">
63
115
  <ActionRow.Spacer />
64
116
  {dismissible && (
@@ -82,7 +134,7 @@ const Alert = React.forwardRef(({
82
134
  </div>
83
135
  </BaseAlert>
84
136
  );
85
- });
137
+ }) as AlertComponent;
86
138
 
87
139
  // This is needed to display a default prop for Alert.Heading element
88
140
  // Copied from react-bootstrap since BaseAlert.Heading component doesn't have defaultProps,
@@ -90,25 +142,30 @@ const Alert = React.forwardRef(({
90
142
  const DivStyledAsH4 = divWithClassName('h4');
91
143
  DivStyledAsH4.displayName = 'DivStyledAsH4';
92
144
 
93
- function AlertHeading(props) {
145
+ function AlertHeading(props: AlertHeadingProps): JSX.Element {
94
146
  return <BaseAlert.Heading {...props} />;
95
147
  }
96
- function AlertLink(props) {
148
+
149
+ function AlertLink(props: AlertLinkProps): JSX.Element {
97
150
  return <BaseAlert.Link {...props} />;
98
151
  }
99
152
 
100
- const commonPropTypes = {
153
+ AlertLink.propTypes = {
101
154
  /** Specifies the base element */
102
- as: PropTypes.elementType,
155
+ as: PropTypes.elementType as PropTypes.Validator<ElementType>,
103
156
  /** Overrides underlying component base CSS class name */
104
157
  bsPrefix: PropTypes.string,
105
158
  };
106
159
 
107
- AlertLink.propTypes = commonPropTypes;
108
- AlertHeading.propTypes = commonPropTypes;
160
+ AlertHeading.propTypes = {
161
+ /** Specifies the base element */
162
+ as: PropTypes.elementType as PropTypes.Validator<ElementType>,
163
+ /** Overrides underlying component base CSS class name */
164
+ bsPrefix: PropTypes.string,
165
+ };
109
166
 
110
167
  AlertLink.defaultProps = {
111
- as: 'a',
168
+ as: 'a' as ElementType,
112
169
  bsPrefix: 'alert-link',
113
170
  };
114
171
 
@@ -124,24 +181,27 @@ Alert.propTypes = {
124
181
  /** Overrides underlying component base CSS class name */
125
182
  bsPrefix: PropTypes.string,
126
183
  /** Specifies variant to use. */
127
- variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'dark', 'light']),
184
+ variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'dark', 'light'] as AlertVariant[]),
128
185
  /**
129
186
  * Animate the entering and exiting of the Alert. `true` will use the `<Fade>` transition,
130
187
  * more detailed customization is also provided.
131
188
  */
132
- transition: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
133
- in: PropTypes.bool,
134
- appear: PropTypes.bool,
135
- children: PropTypes.node,
136
- onEnter: PropTypes.func,
137
- onEntered: PropTypes.func,
138
- onEntering: PropTypes.func,
139
- onExit: PropTypes.func,
140
- onExited: PropTypes.func,
141
- onExiting: PropTypes.func,
142
- })]),
189
+ transition: PropTypes.oneOfType([
190
+ PropTypes.bool,
191
+ PropTypes.shape({
192
+ in: PropTypes.bool,
193
+ appear: PropTypes.bool,
194
+ children: PropTypes.node,
195
+ onEnter: PropTypes.func,
196
+ onEntered: PropTypes.func,
197
+ onEntering: PropTypes.func,
198
+ onExit: PropTypes.func,
199
+ onExited: PropTypes.func,
200
+ onExiting: PropTypes.func,
201
+ }),
202
+ ]) as PropTypes.Validator<BaseAlertProps['transition']>,
143
203
  /** Docstring for the children prop */
144
- children: PropTypes.node,
204
+ children: PropTypes.node as PropTypes.Validator<ReactNode>,
145
205
  /** Docstring for the icon prop... Icon that will be shown in the alert */
146
206
  icon: PropTypes.func,
147
207
  /** Whether the alert is shown. */
@@ -151,7 +211,7 @@ Alert.propTypes = {
151
211
  /** Optional callback function for when the alert it dismissed. */
152
212
  onClose: PropTypes.func,
153
213
  /** Optional list of action elements. May include, at most, 2 actions, or 1 if dismissible is true. */
154
- actions: PropTypes.arrayOf(PropTypes.element),
214
+ actions: PropTypes.arrayOf(PropTypes.element) as PropTypes.Validator<React.ReactElement[]>,
155
215
  /** Position of the dismiss and call-to-action buttons. Defaults to ``false``. */
156
216
  stacked: PropTypes.bool,
157
217
  /** Sets the text for alert close button, defaults to 'Dismiss'. */
@@ -168,6 +228,9 @@ Alert.defaultProps = {
168
228
  closeLabel: undefined,
169
229
  show: true,
170
230
  stacked: false,
231
+ className: undefined,
232
+ bsPrefix: undefined,
233
+ variant: undefined,
171
234
  };
172
235
 
173
236
  Alert.Heading = AlertHeading;
@@ -112,6 +112,7 @@ You can use `Dropdown.Toggle` with [IconButton](/components/iconbutton) componen
112
112
  src={MoreVert}
113
113
  iconAs={Icon}
114
114
  variant="primary"
115
+ aria-label="More actions"
115
116
  />
116
117
  <Dropdown.Menu>
117
118
  <Dropdown.Item href="#/action-1">Action</Dropdown.Item>
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import PropTypes from 'prop-types';
3
3
  import classNames from 'classnames';
4
4
  import { useMediaQuery } from 'react-responsive';
5
+ import { useIntl } from 'react-intl';
5
6
  import ModalLayer from './ModalLayer';
6
7
  // @ts-ignore for now - this needs to be converted to TypeScript
7
8
  import ModalCloseButton from './ModalCloseButton';
@@ -18,8 +19,7 @@ import ModalDialogHero from './ModalDialogHero';
18
19
  import Icon from '../Icon';
19
20
  import IconButton from '../IconButton';
20
21
  import { Close } from '../../icons';
21
-
22
- export const MODAL_DIALOG_CLOSE_LABEL = 'Close';
22
+ import messages from './messages';
23
23
 
24
24
  interface Props {
25
25
  /** Specifies the content of the dialog */
@@ -64,7 +64,7 @@ function ModalDialog({
64
64
  size = 'md',
65
65
  variant = 'default',
66
66
  hasCloseButton = true,
67
- closeLabel = MODAL_DIALOG_CLOSE_LABEL,
67
+ closeLabel,
68
68
  isFullscreenScroll = false,
69
69
  className,
70
70
  isFullscreenOnMobile = false,
@@ -72,6 +72,8 @@ function ModalDialog({
72
72
  zIndex,
73
73
  isOverflowVisible,
74
74
  }: Props) {
75
+ const intl = useIntl();
76
+ const closeButtonText = closeLabel || intl.formatMessage(messages.closeButtonText);
75
77
  const isMobile = useMediaQuery({ query: '(max-width: 767.98px)' });
76
78
  const showFullScreen = (isFullscreenOnMobile && isMobile);
77
79
  return (
@@ -97,7 +99,7 @@ function ModalDialog({
97
99
  iconAs={Icon}
98
100
  invertColors={variant === 'dark'}
99
101
  src={Close}
100
- alt={closeLabel}
102
+ alt={closeButtonText}
101
103
  />
102
104
  </div>
103
105
  )}
@@ -0,0 +1,11 @@
1
+ import { defineMessages } from 'react-intl';
2
+
3
+ const messages = defineMessages({
4
+ closeButtonText: {
5
+ id: 'pgn.Modal.closeButon',
6
+ defaultMessage: 'Close',
7
+ description: 'Accessible name for the close button in the modal dialog',
8
+ },
9
+ });
10
+
11
+ export default messages;
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { render, screen } from '@testing-library/react';
3
3
 
4
+ import { IntlProvider } from 'react-intl';
4
5
  import AlertModal from '../AlertModal';
5
6
  import { Info } from '../../../icons';
6
7
 
@@ -37,15 +38,17 @@ describe('<AlertModal />', () => {
37
38
 
38
39
  it('renders the body when isOpen', () => {
39
40
  render(
40
- <AlertModal
41
- title="some title"
42
- isOpen={isOpen}
43
- onClose={closeFn}
44
- footerNode={<p>footer</p>}
45
- isOverflowVisible={false}
46
- >
47
- <Body />
48
- </AlertModal>,
41
+ <IntlProvider locale="en" messages={{}}>
42
+ <AlertModal
43
+ title="some title"
44
+ isOpen={isOpen}
45
+ onClose={closeFn}
46
+ footerNode={<p>footer</p>}
47
+ isOverflowVisible={false}
48
+ >
49
+ <Body />
50
+ </AlertModal>
51
+ </IntlProvider>,
49
52
  );
50
53
 
51
54
  const body = screen.getByText('The body of alert.');
@@ -55,16 +58,18 @@ describe('<AlertModal />', () => {
55
58
  describe('with variant prop', () => {
56
59
  it('renders warning variant', () => {
57
60
  render(
58
- <AlertModal
59
- title="warning"
60
- isOpen={isOpen}
61
- onClose={closeFn}
62
- icon={Info}
63
- footerNode={<p>footer</p>}
64
- isOverflowVisible={false}
65
- >
66
- <Body />
67
- </AlertModal>,
61
+ <IntlProvider locale="en" messages={{}}>
62
+ <AlertModal
63
+ title="warning"
64
+ isOpen={isOpen}
65
+ onClose={closeFn}
66
+ icon={Info}
67
+ footerNode={<p>footer</p>}
68
+ isOverflowVisible={false}
69
+ >
70
+ <Body />
71
+ </AlertModal>
72
+ </IntlProvider>,
68
73
  );
69
74
 
70
75
  const modalTitle = screen.getByTestId('title-icon');
@@ -73,16 +78,18 @@ describe('<AlertModal />', () => {
73
78
 
74
79
  it('renders success variant', () => {
75
80
  render(
76
- <AlertModal
77
- title="success"
78
- isOpen={isOpen}
79
- onClose={closeFn}
80
- icon={Info}
81
- footerNode={<p>footer</p>}
82
- isOverflowVisible={false}
83
- >
84
- <Body />
85
- </AlertModal>,
81
+ <IntlProvider locale="en" messages={{}}>
82
+ <AlertModal
83
+ title="success"
84
+ isOpen={isOpen}
85
+ onClose={closeFn}
86
+ icon={Info}
87
+ footerNode={<p>footer</p>}
88
+ isOverflowVisible={false}
89
+ >
90
+ <Body />
91
+ </AlertModal>
92
+ </IntlProvider>,
86
93
  );
87
94
 
88
95
  const modalTitle = screen.getByTestId('title-icon');
@@ -91,16 +98,18 @@ describe('<AlertModal />', () => {
91
98
 
92
99
  it('renders danger variant', () => {
93
100
  render(
94
- <AlertModal
95
- title="danger"
96
- isOpen={isOpen}
97
- onClose={closeFn}
98
- icon={Info}
99
- footerNode={<p>footer</p>}
100
- isOverflowVisible={false}
101
- >
102
- <Body />
103
- </AlertModal>,
101
+ <IntlProvider locale="en" messages={{}}>
102
+ <AlertModal
103
+ title="danger"
104
+ isOpen={isOpen}
105
+ onClose={closeFn}
106
+ icon={Info}
107
+ footerNode={<p>footer</p>}
108
+ isOverflowVisible={false}
109
+ >
110
+ <Body />
111
+ </AlertModal>
112
+ </IntlProvider>,
104
113
  );
105
114
 
106
115
  const modalTitle = screen.getByTestId('title-icon');