@openedx/paragon 23.0.0-alpha.4 → 23.0.0-alpha.5
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.
- package/dist/Card/index.scss +2 -0
- package/dist/Container/index.d.ts +16 -0
- package/dist/Container/index.js +15 -13
- package/dist/Container/index.js.map +1 -1
- package/dist/IconButton/index.js +1 -1
- package/dist/IconButton/index.js.map +1 -1
- package/dist/Menu/SelectMenu.js +9 -4
- package/dist/Menu/SelectMenu.js.map +1 -1
- package/dist/Modal/ModalContext.d.ts +15 -0
- package/dist/Modal/ModalContext.js +7 -14
- package/dist/Modal/ModalContext.js.map +1 -1
- package/dist/Modal/ModalDialog.d.ts +110 -0
- package/dist/Modal/ModalDialog.js +23 -21
- package/dist/Modal/ModalDialog.js.map +1 -1
- package/dist/Modal/ModalDialogHeader.d.ts +10 -0
- package/dist/Modal/ModalDialogHeader.js +6 -7
- package/dist/Modal/ModalDialogHeader.js.map +1 -1
- package/dist/Modal/ModalLayer.d.ts +53 -0
- package/dist/Modal/ModalLayer.js +5 -14
- package/dist/Modal/ModalLayer.js.map +1 -1
- package/dist/Modal/Portal.d.ts +11 -0
- package/dist/Modal/Portal.js +5 -6
- package/dist/Modal/Portal.js.map +1 -1
- package/dist/core.css +2 -0
- package/dist/core.css.map +1 -1
- package/dist/core.min.css +1 -1
- package/dist/hooks/useArrowKeyNavigation.js +2 -3
- package/dist/hooks/useArrowKeyNavigation.js.map +1 -1
- package/dist/index.d.ts +19 -5
- package/dist/index.js +5 -5
- package/icons/es5/Newsstand.js +15 -0
- package/icons/es5/index.js +1 -0
- package/icons/es5/index.ts +1 -0
- package/icons/jsx/Newsstand.jsx +17 -0
- package/icons/jsx/index.jsx +1 -0
- package/icons/svg/newsstand.svg +1 -0
- package/package.json +2 -2
- package/src/Card/index.scss +2 -0
- package/src/Container/{Container.test.jsx → Container.test.tsx} +14 -8
- package/src/Container/README.md +4 -0
- package/src/Container/index.tsx +64 -0
- package/src/DataTable/selection/tests/ControlledSelectHeader.test.jsx +7 -7
- package/src/IconButton/index.tsx +1 -1
- package/src/Menu/SelectMenu.jsx +5 -0
- package/src/Menu/SelectMenu.test.jsx +6 -0
- package/src/Menu/select-menu.md +8 -0
- package/src/Modal/{ModalContext.jsx → ModalContext.tsx} +19 -16
- package/src/Modal/{ModalDialog.jsx → ModalDialog.tsx} +50 -23
- package/src/Modal/{ModalDialogHeader.jsx → ModalDialogHeader.tsx} +17 -11
- package/src/Modal/{ModalLayer.jsx → ModalLayer.tsx} +17 -17
- package/src/Modal/{Portal.jsx → Portal.tsx} +10 -7
- package/src/Modal/tests/{ModalDialog.test.jsx → ModalDialog.test.tsx} +16 -10
- package/src/Modal/tests/{ModalLayer.test.jsx → ModalLayer.test.tsx} +5 -5
- package/src/Modal/tests/{Portal.test.jsx → Portal.test.tsx} +3 -3
- package/src/hooks/useArrowKeyNavigation.jsx +1 -2
- package/src/index.d.ts +19 -5
- package/src/index.js +5 -5
- package/src/Container/index.jsx +0 -49
- /package/src/Truncate/{Truncate.test.js → utils.test.js} +0 -0
package/dist/Card/index.scss
CHANGED
|
@@ -352,6 +352,8 @@ a.pgn__card {
|
|
|
352
352
|
bottom: calc(-1 * var(--pgn-spacing-card-logo-bottom-offset-base));
|
|
353
353
|
width: var(--pgn-size-card-logo-width);
|
|
354
354
|
height: var(--pgn-size-card-logo-height);
|
|
355
|
+
object-fit: scale-down;
|
|
356
|
+
object-position: center center;
|
|
355
357
|
border-radius: var(--pgn-size-card-border-radius-logo);
|
|
356
358
|
box-shadow: var(--pgn-elevation-box-shadow-level-1);
|
|
357
359
|
padding: map_get($spacers, 2);
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { type ContainerProps as RBContainerProps } from 'react-bootstrap/Container';
|
|
2
|
+
import type { ComponentWithAsProp } from '../utils/types/bootstrap';
|
|
3
|
+
declare enum ContainerSizeClass {
|
|
4
|
+
xs = "container-mw-xs",
|
|
5
|
+
sm = "container-mw-sm",
|
|
6
|
+
md = "container-mw-md",
|
|
7
|
+
lg = "container-mw-lg",
|
|
8
|
+
xl = "container-mw-xl"
|
|
9
|
+
}
|
|
10
|
+
export type ContainerSize = keyof typeof ContainerSizeClass;
|
|
11
|
+
interface ContainerProps extends RBContainerProps {
|
|
12
|
+
size?: ContainerSize;
|
|
13
|
+
}
|
|
14
|
+
type ContainerType = ComponentWithAsProp<'div', ContainerProps>;
|
|
15
|
+
declare const Container: ContainerType;
|
|
16
|
+
export default Container;
|
package/dist/Container/index.js
CHANGED
|
@@ -8,24 +8,26 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
|
|
|
8
8
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
9
9
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
10
10
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
11
|
-
|
|
11
|
+
/* eslint-disable react/require-default-props */
|
|
12
|
+
import React from 'react';
|
|
12
13
|
import classNames from 'classnames';
|
|
13
|
-
import RBContainer from 'react-bootstrap/Container';
|
|
14
14
|
import PropTypes from 'prop-types';
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
15
|
+
import RBContainer from 'react-bootstrap/Container';
|
|
16
|
+
var ContainerSizeClass = /*#__PURE__*/function (ContainerSizeClass) {
|
|
17
|
+
ContainerSizeClass["xs"] = "container-mw-xs";
|
|
18
|
+
ContainerSizeClass["sm"] = "container-mw-sm";
|
|
19
|
+
ContainerSizeClass["md"] = "container-mw-md";
|
|
20
|
+
ContainerSizeClass["lg"] = "container-mw-lg";
|
|
21
|
+
ContainerSizeClass["xl"] = "container-mw-xl";
|
|
22
|
+
return ContainerSizeClass;
|
|
23
|
+
}(ContainerSizeClass || {});
|
|
24
|
+
var Container = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
23
25
|
var size = _ref.size,
|
|
24
26
|
children = _ref.children,
|
|
25
27
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
26
28
|
return /*#__PURE__*/React.createElement(RBContainer, _extends({}, props, {
|
|
27
29
|
ref: ref,
|
|
28
|
-
className: classNames(props.className,
|
|
30
|
+
className: classNames(props.className, size && ContainerSizeClass[size])
|
|
29
31
|
}), children);
|
|
30
32
|
});
|
|
31
33
|
Container.propTypes = _objectSpread(_objectSpread({}, RBContainer.propTypes), {}, {
|
|
@@ -35,8 +37,8 @@ Container.propTypes = _objectSpread(_objectSpread({}, RBContainer.propTypes), {}
|
|
|
35
37
|
children: PropTypes.node,
|
|
36
38
|
/** Fill all available space at any breakpoint */
|
|
37
39
|
fluid: PropTypes.bool,
|
|
38
|
-
/** Set the maximum width for the container */
|
|
39
|
-
size: PropTypes.oneOf(
|
|
40
|
+
/** Set the maximum width for the container. Omiting the prop will remove the max-width */
|
|
41
|
+
size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
|
|
40
42
|
/** Overrides underlying component base CSS class name */
|
|
41
43
|
bsPrefix: PropTypes.string
|
|
42
44
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","classNames","PropTypes","RBContainer","ContainerSizeClass","Container","forwardRef","_ref","ref","size","children","props","_objectWithoutProperties","_excluded","createElement","_extends","className","propTypes","_objectSpread","as","elementType","node","fluid","bool","oneOf","bsPrefix","string","defaultProps","undefined"],"sources":["../../src/Container/index.tsx"],"sourcesContent":["/* eslint-disable react/require-default-props */\nimport React from 'react';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport RBContainer, { type ContainerProps as RBContainerProps } from 'react-bootstrap/Container';\n\nimport type { ComponentWithAsProp } from '../utils/types/bootstrap';\n\nenum ContainerSizeClass {\n xs = 'container-mw-xs',\n sm = 'container-mw-sm',\n md = 'container-mw-md',\n lg = 'container-mw-lg',\n xl = 'container-mw-xl',\n}\n\nexport type ContainerSize = keyof typeof ContainerSizeClass;\n\ninterface ContainerProps extends RBContainerProps {\n size?: ContainerSize;\n}\n\ntype ContainerType = ComponentWithAsProp<'div', ContainerProps>;\n\nconst Container: ContainerType = React.forwardRef<Element, ContainerProps>(({\n size,\n children,\n ...props\n}, ref) => (\n <RBContainer\n {...props}\n ref={ref}\n className={classNames(\n props.className,\n size && ContainerSizeClass[size],\n )}\n >\n {children}\n </RBContainer>\n));\n\nContainer.propTypes = {\n ...RBContainer.propTypes,\n /** Override the base element */\n as: PropTypes.elementType,\n /** Specifies the contents of the container */\n children: PropTypes.node,\n /** Fill all available space at any breakpoint */\n fluid: PropTypes.bool,\n /** Set the maximum width for the container. Omiting the prop will remove the max-width */\n size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),\n /** Overrides underlying component base CSS class name */\n bsPrefix: PropTypes.string,\n};\n\nContainer.defaultProps = {\n as: 'div',\n children: undefined,\n fluid: true,\n size: undefined,\n bsPrefix: 'container',\n};\n\nexport default Container;\n"],"mappings":";;;;;;;;;;AAAA;AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,WAAW,MAAmD,2BAA2B;AAAC,IAI5FC,kBAAkB,0BAAlBA,kBAAkB;EAAlBA,kBAAkB;EAAlBA,kBAAkB;EAAlBA,kBAAkB;EAAlBA,kBAAkB;EAAlBA,kBAAkB;EAAA,OAAlBA,kBAAkB;AAAA,EAAlBA,kBAAkB;AAgBvB,IAAMC,SAAwB,gBAAGL,KAAK,CAACM,UAAU,CAA0B,UAAAC,IAAA,EAIxEC,GAAG;EAAA,IAHJC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACLC,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAAA,oBAERb,KAAA,CAAAc,aAAA,CAACX,WAAW,EAAAY,QAAA,KACNJ,KAAK;IACTH,GAAG,EAAEA,GAAI;IACTQ,SAAS,EAAEf,UAAU,CACnBU,KAAK,CAACK,SAAS,EACfP,IAAI,IAAIL,kBAAkB,CAACK,IAAI,CACjC;EAAE,IAEDC,QACU,CAAC;AAAA,CACf,CAAC;AAEFL,SAAS,CAACY,SAAS,GAAAC,aAAA,CAAAA,aAAA,KACdf,WAAW,CAACc,SAAS;EACxB;EACAE,EAAE,EAAEjB,SAAS,CAACkB,WAAW;EACzB;EACAV,QAAQ,EAAER,SAAS,CAACmB,IAAI;EACxB;EACAC,KAAK,EAAEpB,SAAS,CAACqB,IAAI;EACrB;EACAd,IAAI,EAAEP,SAAS,CAACsB,KAAK,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;EACrD;EACAC,QAAQ,EAAEvB,SAAS,CAACwB;AAAM,EAC3B;AAEDrB,SAAS,CAACsB,YAAY,GAAG;EACvBR,EAAE,EAAE,KAAK;EACTT,QAAQ,EAAEkB,SAAS;EACnBN,KAAK,EAAE,IAAI;EACXb,IAAI,EAAEmB,SAAS;EACfH,QAAQ,EAAE;AACZ,CAAC;AAED,eAAepB,SAAS","ignoreList":[]}
|
package/dist/IconButton/index.js
CHANGED
|
@@ -12,9 +12,9 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
|
12
12
|
import React from 'react';
|
|
13
13
|
import PropTypes from 'prop-types';
|
|
14
14
|
import classNames from 'classnames';
|
|
15
|
-
import Icon from '../Icon';
|
|
16
15
|
import { OverlayTrigger } from '../Overlay';
|
|
17
16
|
import Tooltip from '../Tooltip';
|
|
17
|
+
import Icon from '../Icon';
|
|
18
18
|
var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
19
19
|
var className = _ref.className,
|
|
20
20
|
alt = _ref.alt,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classNames","Icon","OverlayTrigger","Tooltip","IconButton","forwardRef","_ref","ref","className","alt","invertColors","icon","src","iconClassNames","onClick","size","variant","iconAs","isActive","children","attrs","_objectWithoutProperties","_excluded","invert","activeStyle","concat","IconComponent","createElement","_extends","_defineProperty","type","defaultProps","undefined","propTypes","string","elementType","isRequired","bool","shape","prefix","iconName","array","func","oneOf","IconButtonWithTooltip","_ref2","tooltipPlacement","tooltipContent","props","_excluded2","placement","overlay","id","_objectSpread","node"],"sources":["../../src/IconButton/index.tsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { type Placement } from 'react-bootstrap/Overlay';\nimport Icon from '../Icon';\nimport { OverlayTrigger } from '../Overlay';\nimport Tooltip from '../Tooltip';\n\ninterface Props extends React.HTMLAttributes<HTMLButtonElement> {\n iconAs?: React.ComponentType<any>,\n /** Additional CSS class[es] to apply to this button */\n className?: string;\n /** Alt text for your icon. For best practice, avoid using alt text to describe\n * the image in the `IconButton`. Instead, we recommend describing the function\n * of the button. */\n alt: string;\n /** Changes icon styles for dark background */\n invertColors?: boolean;\n /** An icon component to render. Example import of a Paragon icon component:\n * `import { Check } from '@openedx/paragon/icons';`\n * */\n // Note: React.ComponentType is what we want here. React.ElementType would allow some element type strings like \"div\",\n // but we only want to allow components like 'Add' (a specific icon component function/class)\n src?: React.ComponentType;\n /** Extra class names that will be added to the icon */\n iconClassNames?: string;\n /** Click handler for the button */\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n /** whether to show the `IconButton` in an active state, whose styling is distinct from default state */\n isActive?: boolean;\n /** @deprecated Using FontAwesome icons is deprecated. Instead, pass iconAs={Icon} src={...} */\n icon?: { prefix?: string; iconName?: string, icon?: any[] },\n /** Type of button (uses Bootstrap options) */\n variant?: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'light' | 'dark' | 'black' | 'brand';\n /** size of button to render */\n size?: 'sm' | 'md' | 'inline';\n /** no children */\n children?: never;\n}\n\nconst IconButton = React.forwardRef<HTMLButtonElement, Props>(({\n className,\n alt,\n invertColors,\n icon,\n src,\n iconClassNames,\n onClick,\n size,\n variant,\n iconAs,\n isActive,\n children, // unused, just here because we don't want it to be part of 'attrs'\n ...attrs\n}, ref) => {\n const invert = invertColors ? 'inverse-' : '';\n const activeStyle = isActive ? `${variant}-` : '';\n const IconComponent = iconAs;\n\n return (\n <button\n aria-label={alt}\n className={classNames(\n 'btn-icon',\n `btn-icon-${invert}${variant}`,\n `btn-icon-${size}`,\n {\n [`btn-icon-${invert}${activeStyle}active`]: isActive,\n },\n className,\n )}\n onClick={onClick}\n type=\"button\"\n ref={ref}\n {...attrs}\n >\n <span className=\"btn-icon__icon-container\">\n {IconComponent && (\n <IconComponent\n className={classNames('btn-icon__icon', iconClassNames)}\n icon={icon as any}\n src={src}\n />\n )}\n </span>\n </button>\n );\n});\n\nIconButton.defaultProps = {\n iconAs: Icon,\n src: undefined,\n icon: undefined,\n iconClassNames: undefined,\n className: undefined,\n invertColors: false,\n variant: 'primary',\n size: 'md',\n onClick: () => {},\n isActive: false,\n children: undefined,\n};\n\nIconButton.propTypes = {\n /** A custom class name. */\n className: PropTypes.string,\n /** Component that renders the icon, currently defaults to `Icon` */\n iconAs: PropTypes.elementType as any,\n /** An icon component to render. Example import of a Paragon icon component:\n * `import { Check } from '@openedx/paragon/icons';`\n * */\n src: PropTypes.elementType as any,\n /** Alt text for your icon. For best practice, avoid using alt text to describe\n * the image in the `IconButton`. Instead, we recommend describing the function\n * of the button. */\n alt: PropTypes.string.isRequired,\n /** Changes icon styles for dark background */\n invertColors: PropTypes.bool,\n /** Accepts a [Paragon icon](https://paragon-openedx.netlify.app/foundations/icons) */\n icon: PropTypes.shape({\n prefix: PropTypes.string,\n iconName: PropTypes.string,\n // eslint-disable-next-line react/forbid-prop-types\n icon: PropTypes.array,\n }) as any,\n /** Extra class names that will be added to the icon */\n iconClassNames: PropTypes.string,\n /** Click handler for the button */\n onClick: PropTypes.func,\n /** Type of button (uses Bootstrap options) */\n variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'warning', 'danger', 'light', 'dark', 'black', 'brand']),\n /** size of button to render */\n size: PropTypes.oneOf(['sm', 'md', 'inline']),\n /** whether to show the `IconButton` in an active state, whose styling is distinct from default state */\n isActive: PropTypes.bool,\n};\n\ninterface PropsWithTooltip extends Props {\n /** choose from https://popper.js.org/docs/v2/constructors/#options */\n tooltipPlacement: Placement,\n /** any content to pass to tooltip content area */\n tooltipContent: React.ReactNode,\n}\n\n/**\n * An icon button wrapped in overlaytrigger to display a tooltip.\n */\nfunction IconButtonWithTooltip({\n tooltipPlacement, tooltipContent, ...props\n}: PropsWithTooltip) {\n const invert = props.invertColors ? 'inverse-' : '';\n return (\n <OverlayTrigger\n placement={tooltipPlacement}\n overlay={(\n <Tooltip\n id={`iconbutton-tooltip-${tooltipPlacement}`}\n variant={invert ? 'light' : undefined}\n >\n {tooltipContent}\n </Tooltip>\n )}\n >\n <IconButton {...props} />\n </OverlayTrigger>\n );\n}\n\nIconButtonWithTooltip.defaultProps = {\n ...IconButton.defaultProps,\n tooltipPlacement: 'top',\n};\n\nIconButtonWithTooltip.propTypes = {\n /** tooltip placement can be top, left, right etc, per https://popper.js.org/docs/v2/constructors/#options */\n tooltipPlacement: PropTypes.string,\n /** any valid JSX or text to be rendered as tooltip contents */\n tooltipContent: PropTypes.node.isRequired,\n /** Type of button (uses Bootstrap options) */\n variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'warning', 'danger', 'light', 'dark', 'black', 'brand']),\n /** Changes icon styles for dark background */\n invertColors: PropTypes.bool,\n};\n\n(IconButton as any).IconButtonWithTooltip = IconButtonWithTooltip;\n\nexport default IconButton as typeof IconButton & {\n IconButtonWithTooltip: typeof IconButtonWithTooltip,\n};\nexport { IconButtonWithTooltip };\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classNames","OverlayTrigger","Tooltip","Icon","IconButton","forwardRef","_ref","ref","className","alt","invertColors","icon","src","iconClassNames","onClick","size","variant","iconAs","isActive","children","attrs","_objectWithoutProperties","_excluded","invert","activeStyle","concat","IconComponent","createElement","_extends","_defineProperty","type","defaultProps","undefined","propTypes","string","elementType","isRequired","bool","shape","prefix","iconName","array","func","oneOf","IconButtonWithTooltip","_ref2","tooltipPlacement","tooltipContent","props","_excluded2","placement","overlay","id","_objectSpread","node"],"sources":["../../src/IconButton/index.tsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { type Placement } from 'react-bootstrap/Overlay';\nimport { OverlayTrigger } from '../Overlay';\nimport Tooltip from '../Tooltip';\nimport Icon from '../Icon';\n\ninterface Props extends React.HTMLAttributes<HTMLButtonElement> {\n iconAs?: React.ComponentType<any>,\n /** Additional CSS class[es] to apply to this button */\n className?: string;\n /** Alt text for your icon. For best practice, avoid using alt text to describe\n * the image in the `IconButton`. Instead, we recommend describing the function\n * of the button. */\n alt: string;\n /** Changes icon styles for dark background */\n invertColors?: boolean;\n /** An icon component to render. Example import of a Paragon icon component:\n * `import { Check } from '@openedx/paragon/icons';`\n * */\n // Note: React.ComponentType is what we want here. React.ElementType would allow some element type strings like \"div\",\n // but we only want to allow components like 'Add' (a specific icon component function/class)\n src?: React.ComponentType;\n /** Extra class names that will be added to the icon */\n iconClassNames?: string;\n /** Click handler for the button */\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n /** whether to show the `IconButton` in an active state, whose styling is distinct from default state */\n isActive?: boolean;\n /** @deprecated Using FontAwesome icons is deprecated. Instead, pass iconAs={Icon} src={...} */\n icon?: { prefix?: string; iconName?: string, icon?: any[] },\n /** Type of button (uses Bootstrap options) */\n variant?: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'light' | 'dark' | 'black' | 'brand';\n /** size of button to render */\n size?: 'sm' | 'md' | 'inline';\n /** no children */\n children?: never;\n}\n\nconst IconButton = React.forwardRef<HTMLButtonElement, Props>(({\n className,\n alt,\n invertColors,\n icon,\n src,\n iconClassNames,\n onClick,\n size,\n variant,\n iconAs,\n isActive,\n children, // unused, just here because we don't want it to be part of 'attrs'\n ...attrs\n}, ref) => {\n const invert = invertColors ? 'inverse-' : '';\n const activeStyle = isActive ? `${variant}-` : '';\n const IconComponent = iconAs;\n\n return (\n <button\n aria-label={alt}\n className={classNames(\n 'btn-icon',\n `btn-icon-${invert}${variant}`,\n `btn-icon-${size}`,\n {\n [`btn-icon-${invert}${activeStyle}active`]: isActive,\n },\n className,\n )}\n onClick={onClick}\n type=\"button\"\n ref={ref}\n {...attrs}\n >\n <span className=\"btn-icon__icon-container\">\n {IconComponent && (\n <IconComponent\n className={classNames('btn-icon__icon', iconClassNames)}\n icon={icon as any}\n src={src}\n />\n )}\n </span>\n </button>\n );\n});\n\nIconButton.defaultProps = {\n iconAs: Icon,\n src: undefined,\n icon: undefined,\n iconClassNames: undefined,\n className: undefined,\n invertColors: false,\n variant: 'primary',\n size: 'md',\n onClick: () => {},\n isActive: false,\n children: undefined,\n};\n\nIconButton.propTypes = {\n /** A custom class name. */\n className: PropTypes.string,\n /** Component that renders the icon, currently defaults to `Icon` */\n iconAs: PropTypes.elementType as any,\n /** An icon component to render. Example import of a Paragon icon component:\n * `import { Check } from '@openedx/paragon/icons';`\n * */\n src: PropTypes.elementType as any,\n /** Alt text for your icon. For best practice, avoid using alt text to describe\n * the image in the `IconButton`. Instead, we recommend describing the function\n * of the button. */\n alt: PropTypes.string.isRequired,\n /** Changes icon styles for dark background */\n invertColors: PropTypes.bool,\n /** Accepts a [Paragon icon](https://paragon-openedx.netlify.app/foundations/icons) */\n icon: PropTypes.shape({\n prefix: PropTypes.string,\n iconName: PropTypes.string,\n // eslint-disable-next-line react/forbid-prop-types\n icon: PropTypes.array,\n }) as any,\n /** Extra class names that will be added to the icon */\n iconClassNames: PropTypes.string,\n /** Click handler for the button */\n onClick: PropTypes.func,\n /** Type of button (uses Bootstrap options) */\n variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'warning', 'danger', 'light', 'dark', 'black', 'brand']),\n /** size of button to render */\n size: PropTypes.oneOf(['sm', 'md', 'inline']),\n /** whether to show the `IconButton` in an active state, whose styling is distinct from default state */\n isActive: PropTypes.bool,\n};\n\ninterface PropsWithTooltip extends Props {\n /** choose from https://popper.js.org/docs/v2/constructors/#options */\n tooltipPlacement: Placement,\n /** any content to pass to tooltip content area */\n tooltipContent: React.ReactNode,\n}\n\n/**\n * An icon button wrapped in overlaytrigger to display a tooltip.\n */\nfunction IconButtonWithTooltip({\n tooltipPlacement, tooltipContent, ...props\n}: PropsWithTooltip) {\n const invert = props.invertColors ? 'inverse-' : '';\n return (\n <OverlayTrigger\n placement={tooltipPlacement}\n overlay={(\n <Tooltip\n id={`iconbutton-tooltip-${tooltipPlacement}`}\n variant={invert ? 'light' : undefined}\n >\n {tooltipContent}\n </Tooltip>\n )}\n >\n <IconButton {...props} />\n </OverlayTrigger>\n );\n}\n\nIconButtonWithTooltip.defaultProps = {\n ...IconButton.defaultProps,\n tooltipPlacement: 'top',\n};\n\nIconButtonWithTooltip.propTypes = {\n /** tooltip placement can be top, left, right etc, per https://popper.js.org/docs/v2/constructors/#options */\n tooltipPlacement: PropTypes.string,\n /** any valid JSX or text to be rendered as tooltip contents */\n tooltipContent: PropTypes.node.isRequired,\n /** Type of button (uses Bootstrap options) */\n variant: PropTypes.oneOf(['primary', 'secondary', 'success', 'warning', 'danger', 'light', 'dark', 'black', 'brand']),\n /** Changes icon styles for dark background */\n invertColors: PropTypes.bool,\n};\n\n(IconButton as any).IconButtonWithTooltip = IconButtonWithTooltip;\n\nexport default IconButton as typeof IconButton & {\n IconButtonWithTooltip: typeof IconButtonWithTooltip,\n};\nexport { IconButtonWithTooltip };\n"],"mappings":"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","ignoreList":[]}
|
package/dist/Menu/SelectMenu.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var _excluded = ["defaultMessage", "children", "className", "variant"];
|
|
1
|
+
var _excluded = ["defaultMessage", "children", "className", "variant", "disabled"];
|
|
2
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
3
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
4
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
@@ -23,6 +23,7 @@ function SelectMenu(_ref) {
|
|
|
23
23
|
children = _ref.children,
|
|
24
24
|
className = _ref.className,
|
|
25
25
|
variant = _ref.variant,
|
|
26
|
+
disabled = _ref.disabled,
|
|
26
27
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
27
28
|
var _useState = useState(null),
|
|
28
29
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -106,7 +107,8 @@ function SelectMenu(_ref) {
|
|
|
106
107
|
ref: setTriggerTarget,
|
|
107
108
|
variant: variant,
|
|
108
109
|
iconAfter: ExpandMore,
|
|
109
|
-
onClick: open
|
|
110
|
+
onClick: open,
|
|
111
|
+
disabled: disabled
|
|
110
112
|
}, selected !== undefined && children[selected] ? children[selected].props.children : defaultMessage), /*#__PURE__*/React.createElement("div", {
|
|
111
113
|
className: "pgn__menu-select-popup"
|
|
112
114
|
}, /*#__PURE__*/React.createElement(ModalPopup, {
|
|
@@ -140,12 +142,15 @@ SelectMenu.propTypes = {
|
|
|
140
142
|
/** Specifies class name to append to the base element */
|
|
141
143
|
className: PropTypes.string,
|
|
142
144
|
/** Specifies variant to use. */
|
|
143
|
-
variant: PropTypes.string
|
|
145
|
+
variant: PropTypes.string,
|
|
146
|
+
/** Specifies if the `SelectMenu` is disabled. */
|
|
147
|
+
disabled: PropTypes.bool
|
|
144
148
|
};
|
|
145
149
|
SelectMenu.defaultProps = {
|
|
146
150
|
defaultMessage: SELECT_MENU_DEFAULT_MESSAGE,
|
|
147
151
|
className: undefined,
|
|
148
|
-
variant: 'outline-primary'
|
|
152
|
+
variant: 'outline-primary',
|
|
153
|
+
disabled: false
|
|
149
154
|
};
|
|
150
155
|
var SelectMenuWithDeprecatedProp = withDeprecatedProps(SelectMenu, 'SelectMenu', {
|
|
151
156
|
isLink: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectMenu.js","names":["React","useState","useEffect","useCallback","PropTypes","classNames","ExpandMore","Button","ModalPopup","useToggle","Menu","withDeprecatedProps","DeprTypes","SELECT_MENU_DEFAULT_MESSAGE","SelectMenu","_ref","defaultMessage","children","className","variant","props","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","triggerTarget","setTriggerTarget","focusMenuRef","useRef","itemsCollection","useMemo","Array","from","length","map","createRef","defaultIndex","i","defaultSelected","undefined","_useState3","_useState4","selected","setSelected","_useToggle","_useToggle2","isOpen","open","close","createMenuItems","Children","child","index","newProps","onClick","e","current","id","concat","toString","role","cloneElement","prevOpenRef","numItems","scrollIntoView","block","focus","preventScroll","createElement","_extends","ref","iconAfter","placement","positionRef","onClose","modifiers","name","options","padding","top","bottom","key","propTypes","string","node","isRequired","defaultProps","SelectMenuWithDeprecatedProp","isLink","deprType","MOVED_AND_FORMAT","message","newName","transform"],"sources":["../../src/Menu/SelectMenu.jsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { ExpandMore } from '../../icons';\nimport Button from '../Button';\nimport ModalPopup from '../Modal/ModalPopup';\nimport useToggle from '../hooks/useToggle';\nimport Menu from '.';\nimport withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';\n\nexport const SELECT_MENU_DEFAULT_MESSAGE = 'Select...';\n\nfunction SelectMenu({\n defaultMessage,\n children,\n className,\n variant,\n ...props\n}) {\n const [triggerTarget, setTriggerTarget] = useState(null);\n // this ref is used to focus the menu open button after any menu option is clicked.\n // triggerTarget.current.focus() inside the onCLick() function didn't guarantee element focus.\n const focusMenuRef = React.useRef(false);\n const itemsCollection = React.useMemo(\n () => Array.from({ length: children.length }).map(() => React.createRef()),\n [children.length],\n );\n\n const defaultIndex = useCallback(() => {\n for (let i = 0; i < children.length; i++) {\n if (children[i].props && children[i].props.defaultSelected) {\n return i;\n }\n }\n return undefined;\n }, [children]);\n\n const [selected, setSelected] = useState(defaultIndex());\n const [isOpen, open, close] = useToggle(false);\n\n const createMenuItems = () => React.Children.map(children, (child, index) => {\n const newProps = {\n onClick(e) {\n if (child.props.onClick) {\n child.props.onClick(e);\n }\n setSelected(index);\n close();\n focusMenuRef.current = true;\n },\n id: `${index.toString()}_pgn__menu-item`,\n role: 'link',\n };\n if (selected === index) {\n newProps['aria-current'] = 'page';\n }\n return React.cloneElement(child, newProps);\n });\n\n const prevOpenRef = React.useRef();\n\n useEffect(() => {\n if (isOpen && selected) {\n const numItems = children.length;\n if (numItems > 6 && selected > 1 && numItems - selected > 2) {\n // on \"middle elements\", set offset to center of block and scroll to center\n itemsCollection[selected].current.children[0].scrollIntoView({\n block: 'center',\n });\n }\n }\n // set focus on open\n if (isOpen && !prevOpenRef.current && selected) {\n itemsCollection[selected].current.children[0].focus({ preventScroll: (defaultIndex() === selected) });\n }\n if (focusMenuRef.current) {\n triggerTarget.focus();\n focusMenuRef.current = false;\n }\n prevOpenRef.current = isOpen;\n }, [isOpen, children.length, defaultIndex, itemsCollection, selected, triggerTarget]);\n\n return (\n <div className={classNames('pgn__menu-select', className)} {...props}>\n <Button\n aria-haspopup=\"true\"\n aria-expanded={isOpen}\n ref={setTriggerTarget}\n variant={variant}\n iconAfter={ExpandMore}\n onClick={open}\n >\n {selected !== undefined && children[selected] ? children[selected].props.children : defaultMessage}\n </Button>\n <div className=\"pgn__menu-select-popup\">\n <ModalPopup\n placement=\"bottom-start\"\n positionRef={triggerTarget}\n isOpen={isOpen}\n onClose={close}\n modifiers={\n [\n {\n name: 'flip',\n options: {\n padding: { top: 150, bottom: 150 },\n },\n },\n ]\n }\n >\n <Menu aria-label=\"Select Menu\">\n {createMenuItems().map((child, index) => (\n <div key={child.props.id} ref={itemsCollection[index]}>\n {child}\n </div>\n ))}\n </Menu>\n </ModalPopup>\n </div>\n </div>\n );\n}\n\nSelectMenu.propTypes = {\n /** String that is displayed for default value of the ``SelectMenu`` */\n defaultMessage: PropTypes.string,\n /** Specifies the content of the ``SelectMenu`` */\n children: PropTypes.node.isRequired,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /** Specifies variant to use. */\n variant: PropTypes.string,\n};\n\nSelectMenu.defaultProps = {\n defaultMessage: SELECT_MENU_DEFAULT_MESSAGE,\n className: undefined,\n variant: 'outline-primary',\n};\n\nconst SelectMenuWithDeprecatedProp = withDeprecatedProps(SelectMenu, 'SelectMenu', {\n isLink: {\n deprType: DeprTypes.MOVED_AND_FORMAT,\n message: 'Use \"variant\" prop instead, i.e. variant=\"link\"',\n newName: 'variant',\n transform: () => 'link',\n },\n});\n\nexport default SelectMenuWithDeprecatedProp;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"SelectMenu.js","names":["React","useState","useEffect","useCallback","PropTypes","classNames","ExpandMore","Button","ModalPopup","useToggle","Menu","withDeprecatedProps","DeprTypes","SELECT_MENU_DEFAULT_MESSAGE","SelectMenu","_ref","defaultMessage","children","className","variant","disabled","props","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","triggerTarget","setTriggerTarget","focusMenuRef","useRef","itemsCollection","useMemo","Array","from","length","map","createRef","defaultIndex","i","defaultSelected","undefined","_useState3","_useState4","selected","setSelected","_useToggle","_useToggle2","isOpen","open","close","createMenuItems","Children","child","index","newProps","onClick","e","current","id","concat","toString","role","cloneElement","prevOpenRef","numItems","scrollIntoView","block","focus","preventScroll","createElement","_extends","ref","iconAfter","placement","positionRef","onClose","modifiers","name","options","padding","top","bottom","key","propTypes","string","node","isRequired","bool","defaultProps","SelectMenuWithDeprecatedProp","isLink","deprType","MOVED_AND_FORMAT","message","newName","transform"],"sources":["../../src/Menu/SelectMenu.jsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { ExpandMore } from '../../icons';\nimport Button from '../Button';\nimport ModalPopup from '../Modal/ModalPopup';\nimport useToggle from '../hooks/useToggle';\nimport Menu from '.';\nimport withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';\n\nexport const SELECT_MENU_DEFAULT_MESSAGE = 'Select...';\n\nfunction SelectMenu({\n defaultMessage,\n children,\n className,\n variant,\n disabled,\n ...props\n}) {\n const [triggerTarget, setTriggerTarget] = useState(null);\n // this ref is used to focus the menu open button after any menu option is clicked.\n // triggerTarget.current.focus() inside the onCLick() function didn't guarantee element focus.\n const focusMenuRef = React.useRef(false);\n const itemsCollection = React.useMemo(\n () => Array.from({ length: children.length }).map(() => React.createRef()),\n [children.length],\n );\n\n const defaultIndex = useCallback(() => {\n for (let i = 0; i < children.length; i++) {\n if (children[i].props && children[i].props.defaultSelected) {\n return i;\n }\n }\n return undefined;\n }, [children]);\n\n const [selected, setSelected] = useState(defaultIndex());\n const [isOpen, open, close] = useToggle(false);\n\n const createMenuItems = () => React.Children.map(children, (child, index) => {\n const newProps = {\n onClick(e) {\n if (child.props.onClick) {\n child.props.onClick(e);\n }\n setSelected(index);\n close();\n focusMenuRef.current = true;\n },\n id: `${index.toString()}_pgn__menu-item`,\n role: 'link',\n };\n if (selected === index) {\n newProps['aria-current'] = 'page';\n }\n return React.cloneElement(child, newProps);\n });\n\n const prevOpenRef = React.useRef();\n\n useEffect(() => {\n if (isOpen && selected) {\n const numItems = children.length;\n if (numItems > 6 && selected > 1 && numItems - selected > 2) {\n // on \"middle elements\", set offset to center of block and scroll to center\n itemsCollection[selected].current.children[0].scrollIntoView({\n block: 'center',\n });\n }\n }\n // set focus on open\n if (isOpen && !prevOpenRef.current && selected) {\n itemsCollection[selected].current.children[0].focus({ preventScroll: (defaultIndex() === selected) });\n }\n if (focusMenuRef.current) {\n triggerTarget.focus();\n focusMenuRef.current = false;\n }\n prevOpenRef.current = isOpen;\n }, [isOpen, children.length, defaultIndex, itemsCollection, selected, triggerTarget]);\n\n return (\n <div className={classNames('pgn__menu-select', className)} {...props}>\n <Button\n aria-haspopup=\"true\"\n aria-expanded={isOpen}\n ref={setTriggerTarget}\n variant={variant}\n iconAfter={ExpandMore}\n onClick={open}\n disabled={disabled}\n >\n {selected !== undefined && children[selected] ? children[selected].props.children : defaultMessage}\n </Button>\n <div className=\"pgn__menu-select-popup\">\n <ModalPopup\n placement=\"bottom-start\"\n positionRef={triggerTarget}\n isOpen={isOpen}\n onClose={close}\n modifiers={\n [\n {\n name: 'flip',\n options: {\n padding: { top: 150, bottom: 150 },\n },\n },\n ]\n }\n >\n <Menu aria-label=\"Select Menu\">\n {createMenuItems().map((child, index) => (\n <div key={child.props.id} ref={itemsCollection[index]}>\n {child}\n </div>\n ))}\n </Menu>\n </ModalPopup>\n </div>\n </div>\n );\n}\n\nSelectMenu.propTypes = {\n /** String that is displayed for default value of the ``SelectMenu`` */\n defaultMessage: PropTypes.string,\n /** Specifies the content of the ``SelectMenu`` */\n children: PropTypes.node.isRequired,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /** Specifies variant to use. */\n variant: PropTypes.string,\n /** Specifies if the `SelectMenu` is disabled. */\n disabled: PropTypes.bool,\n};\n\nSelectMenu.defaultProps = {\n defaultMessage: SELECT_MENU_DEFAULT_MESSAGE,\n className: undefined,\n variant: 'outline-primary',\n disabled: false,\n};\n\nconst SelectMenuWithDeprecatedProp = withDeprecatedProps(SelectMenu, 'SelectMenu', {\n isLink: {\n deprType: DeprTypes.MOVED_AND_FORMAT,\n message: 'Use \"variant\" prop instead, i.e. variant=\"link\"',\n newName: 'variant',\n transform: () => 'link',\n },\n});\n\nexport default SelectMenuWithDeprecatedProp;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface ContextData {
|
|
3
|
+
onClose: () => void;
|
|
4
|
+
isOpen: boolean;
|
|
5
|
+
isBlocking: boolean;
|
|
6
|
+
}
|
|
7
|
+
declare const ModalContext: React.Context<ContextData>;
|
|
8
|
+
declare function ModalContextProvider({ onClose, isOpen, isBlocking, children, }: {
|
|
9
|
+
onClose: () => void;
|
|
10
|
+
isOpen: boolean;
|
|
11
|
+
isBlocking?: boolean;
|
|
12
|
+
children?: React.ReactNode;
|
|
13
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export { ModalContextProvider };
|
|
15
|
+
export default ModalContext;
|
|
@@ -1,13 +1,16 @@
|
|
|
1
1
|
import React, { useMemo } from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
2
|
var ModalContext = /*#__PURE__*/React.createContext({
|
|
4
|
-
onClose: function onClose() {}
|
|
3
|
+
onClose: function onClose() {},
|
|
4
|
+
isOpen: false,
|
|
5
|
+
isBlocking: false
|
|
5
6
|
});
|
|
6
7
|
function ModalContextProvider(_ref) {
|
|
7
8
|
var onClose = _ref.onClose,
|
|
8
9
|
isOpen = _ref.isOpen,
|
|
9
|
-
isBlocking = _ref.isBlocking,
|
|
10
|
-
|
|
10
|
+
_ref$isBlocking = _ref.isBlocking,
|
|
11
|
+
isBlocking = _ref$isBlocking === void 0 ? false : _ref$isBlocking,
|
|
12
|
+
_ref$children = _ref.children,
|
|
13
|
+
children = _ref$children === void 0 ? null : _ref$children;
|
|
11
14
|
var modalContextValue = useMemo(function () {
|
|
12
15
|
return {
|
|
13
16
|
onClose: onClose,
|
|
@@ -19,16 +22,6 @@ function ModalContextProvider(_ref) {
|
|
|
19
22
|
value: modalContextValue
|
|
20
23
|
}, children);
|
|
21
24
|
}
|
|
22
|
-
ModalContextProvider.propTypes = {
|
|
23
|
-
children: PropTypes.node,
|
|
24
|
-
onClose: PropTypes.func.isRequired,
|
|
25
|
-
isBlocking: PropTypes.bool,
|
|
26
|
-
isOpen: PropTypes.bool.isRequired
|
|
27
|
-
};
|
|
28
|
-
ModalContextProvider.defaultProps = {
|
|
29
|
-
children: null,
|
|
30
|
-
isBlocking: false
|
|
31
|
-
};
|
|
32
25
|
export { ModalContextProvider };
|
|
33
26
|
export default ModalContext;
|
|
34
27
|
//# sourceMappingURL=ModalContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalContext.js","names":["React","useMemo","
|
|
1
|
+
{"version":3,"file":"ModalContext.js","names":["React","useMemo","ModalContext","createContext","onClose","isOpen","isBlocking","ModalContextProvider","_ref","_ref$isBlocking","_ref$children","children","modalContextValue","createElement","Provider","value"],"sources":["../../src/Modal/ModalContext.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\ninterface ContextData {\n onClose: () => void;\n isOpen: boolean;\n isBlocking: boolean;\n}\n\nconst ModalContext = React.createContext<ContextData>({\n onClose: () => {},\n isOpen: false,\n isBlocking: false,\n});\n\nfunction ModalContextProvider({\n onClose,\n isOpen,\n isBlocking = false,\n children = null,\n}: {\n onClose: () => void;\n isOpen: boolean;\n isBlocking?: boolean;\n children?: React.ReactNode;\n}) {\n const modalContextValue = useMemo<ContextData>(\n () => ({ onClose, isOpen, isBlocking }),\n [onClose, isOpen, isBlocking],\n );\n\n return (\n <ModalContext.Provider value={modalContextValue}>\n {children}\n </ModalContext.Provider>\n );\n}\n\nexport { ModalContextProvider };\nexport default ModalContext;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AAQtC,IAAMC,YAAY,gBAAGF,KAAK,CAACG,aAAa,CAAc;EACpDC,OAAO,EAAE,SAAAA,QAAA,EAAM,CAAC,CAAC;EACjBC,MAAM,EAAE,KAAK;EACbC,UAAU,EAAE;AACd,CAAC,CAAC;AAEF,SAASC,oBAAoBA,CAAAC,IAAA,EAU1B;EAAA,IATDJ,OAAO,GAAAI,IAAA,CAAPJ,OAAO;IACPC,MAAM,GAAAG,IAAA,CAANH,MAAM;IAAAI,eAAA,GAAAD,IAAA,CACNF,UAAU;IAAVA,UAAU,GAAAG,eAAA,cAAG,KAAK,GAAAA,eAAA;IAAAC,aAAA,GAAAF,IAAA,CAClBG,QAAQ;IAARA,QAAQ,GAAAD,aAAA,cAAG,IAAI,GAAAA,aAAA;EAOf,IAAME,iBAAiB,GAAGX,OAAO,CAC/B;IAAA,OAAO;MAAEG,OAAO,EAAPA,OAAO;MAAEC,MAAM,EAANA,MAAM;MAAEC,UAAU,EAAVA;IAAW,CAAC;EAAA,CAAC,EACvC,CAACF,OAAO,EAAEC,MAAM,EAAEC,UAAU,CAC9B,CAAC;EAED,oBACEN,KAAA,CAAAa,aAAA,CAACX,YAAY,CAACY,QAAQ;IAACC,KAAK,EAAEH;EAAkB,GAC7CD,QACoB,CAAC;AAE5B;AAEA,SAASJ,oBAAoB;AAC7B,eAAeL,YAAY","ignoreList":[]}
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
export declare const MODAL_DIALOG_CLOSE_LABEL = "Close";
|
|
4
|
+
interface Props {
|
|
5
|
+
/** Specifies the content of the dialog */
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
/** The aria-label of the dialog */
|
|
8
|
+
title: string;
|
|
9
|
+
/** A callback to close the modal dialog, e.g. when Escape is pressed */
|
|
10
|
+
onClose: () => void;
|
|
11
|
+
/** Is the modal dialog open or closed? */
|
|
12
|
+
isOpen?: boolean;
|
|
13
|
+
/** The close 'x' icon button in the top right of the dialog box */
|
|
14
|
+
hasCloseButton?: boolean;
|
|
15
|
+
/** Size determines the maximum width of the dialog box */
|
|
16
|
+
size?: 'sm' | 'md' | 'lg' | 'xl' | 'fullscreen';
|
|
17
|
+
/** The visual style of the dialog box */
|
|
18
|
+
variant?: 'default' | 'warning' | 'danger' | 'success' | 'dark';
|
|
19
|
+
/** The label supplied to the close icon button if one is rendered */
|
|
20
|
+
closeLabel?: string;
|
|
21
|
+
/** Specifies class name to append to the base element */
|
|
22
|
+
className?: string;
|
|
23
|
+
/**
|
|
24
|
+
* Determines where a scrollbar should appear if a modal is too large for the
|
|
25
|
+
* viewport. When false, the ``ModalDialog``. Body receives a scrollbar, when true
|
|
26
|
+
* the browser window itself receives the scrollbar.
|
|
27
|
+
*/
|
|
28
|
+
isFullscreenScroll?: boolean;
|
|
29
|
+
/** To show full screen view on mobile screens */
|
|
30
|
+
isFullscreenOnMobile?: boolean;
|
|
31
|
+
/** Prevent clicking on the backdrop or pressing Esc to close the modal */
|
|
32
|
+
isBlocking?: boolean;
|
|
33
|
+
/** Specifies the z-index of the modal */
|
|
34
|
+
zIndex?: number;
|
|
35
|
+
/** Specifies whether overflow is visible in the modal */
|
|
36
|
+
isOverflowVisible?: boolean;
|
|
37
|
+
}
|
|
38
|
+
declare function ModalDialog({ children, title, isOpen, onClose, size, variant, hasCloseButton, closeLabel, isFullscreenScroll, className, isFullscreenOnMobile, isBlocking, zIndex, isOverflowVisible, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
39
|
+
declare namespace ModalDialog {
|
|
40
|
+
var propTypes: {
|
|
41
|
+
/**
|
|
42
|
+
* Specifies the content of the dialog
|
|
43
|
+
*/
|
|
44
|
+
children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
|
|
45
|
+
/**
|
|
46
|
+
* The aria-label of the dialog
|
|
47
|
+
*/
|
|
48
|
+
title: PropTypes.Validator<string>;
|
|
49
|
+
/**
|
|
50
|
+
* A callback to close the modal dialog
|
|
51
|
+
*/
|
|
52
|
+
onClose: PropTypes.Validator<(...args: any[]) => any>;
|
|
53
|
+
/**
|
|
54
|
+
* Is the modal dialog open or closed
|
|
55
|
+
*/
|
|
56
|
+
isOpen: PropTypes.Requireable<boolean>;
|
|
57
|
+
/**
|
|
58
|
+
* The close 'x' icon button in the top right of the dialog box
|
|
59
|
+
*/
|
|
60
|
+
hasCloseButton: PropTypes.Requireable<boolean>;
|
|
61
|
+
/**
|
|
62
|
+
* Sizes determine the maximum width of the dialog box
|
|
63
|
+
*/
|
|
64
|
+
size: PropTypes.Requireable<string>;
|
|
65
|
+
/**
|
|
66
|
+
* The visual style of the dialog box
|
|
67
|
+
*/
|
|
68
|
+
variant: PropTypes.Requireable<string>;
|
|
69
|
+
/**
|
|
70
|
+
* The label supplied to the close icon button if one is rendered
|
|
71
|
+
*/
|
|
72
|
+
closeLabel: PropTypes.Requireable<string>;
|
|
73
|
+
/**
|
|
74
|
+
* Specifies class name to append to the base element
|
|
75
|
+
*/
|
|
76
|
+
className: PropTypes.Requireable<string>;
|
|
77
|
+
/**
|
|
78
|
+
* Determines where a scrollbar should appear if a modal is too large for the
|
|
79
|
+
* viewport. When false, the ``ModalDialog``. Body receives a scrollbar, when true
|
|
80
|
+
* the browser window itself receives the scrollbar.
|
|
81
|
+
*/
|
|
82
|
+
isFullscreenScroll: PropTypes.Requireable<boolean>;
|
|
83
|
+
/**
|
|
84
|
+
* To show full screen view on mobile screens
|
|
85
|
+
*/
|
|
86
|
+
isFullscreenOnMobile: PropTypes.Requireable<boolean>;
|
|
87
|
+
/**
|
|
88
|
+
* Prevent clicking on the backdrop or pressing Esc to close the modal
|
|
89
|
+
*/
|
|
90
|
+
isBlocking: PropTypes.Requireable<boolean>;
|
|
91
|
+
/**
|
|
92
|
+
* Specifies the z-index of the modal
|
|
93
|
+
*/
|
|
94
|
+
zIndex: PropTypes.Requireable<number>;
|
|
95
|
+
/**
|
|
96
|
+
* Specifies whether overflow content inside the modal should be visible.
|
|
97
|
+
* - `true` - content that exceeds the modal boundaries will remain visible outside the modal's main viewport,
|
|
98
|
+
* rather than being clipped or hidden.
|
|
99
|
+
* - `false` - any overflow content will be clipped to fit within the modal's dimensions.
|
|
100
|
+
*/
|
|
101
|
+
isOverflowVisible: PropTypes.Validator<boolean>;
|
|
102
|
+
};
|
|
103
|
+
var Header: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"div", import("./ModalDialogHeader").Props>;
|
|
104
|
+
var Title: any;
|
|
105
|
+
var Footer: any;
|
|
106
|
+
var CloseButton: any;
|
|
107
|
+
var Body: any;
|
|
108
|
+
var Hero: any;
|
|
109
|
+
}
|
|
110
|
+
export default ModalDialog;
|
|
@@ -7,11 +7,16 @@ import PropTypes from 'prop-types';
|
|
|
7
7
|
import classNames from 'classnames';
|
|
8
8
|
import { useMediaQuery } from 'react-responsive';
|
|
9
9
|
import ModalLayer from './ModalLayer';
|
|
10
|
+
// @ts-ignore for now - this needs to be converted to TypeScript
|
|
10
11
|
import ModalCloseButton from './ModalCloseButton';
|
|
11
12
|
import ModalDialogHeader from './ModalDialogHeader';
|
|
13
|
+
// @ts-ignore for now - this needs to be converted to TypeScript
|
|
12
14
|
import ModalDialogTitle from './ModalDialogTitle';
|
|
15
|
+
// @ts-ignore for now - this needs to be converted to TypeScript
|
|
13
16
|
import ModalDialogFooter from './ModalDialogFooter';
|
|
17
|
+
// @ts-ignore for now - this needs to be converted to TypeScript
|
|
14
18
|
import ModalDialogBody from './ModalDialogBody';
|
|
19
|
+
// @ts-ignore for now - this needs to be converted to TypeScript
|
|
15
20
|
import ModalDialogHero from './ModalDialogHero';
|
|
16
21
|
import Icon from '../Icon';
|
|
17
22
|
import IconButton from '../IconButton';
|
|
@@ -21,18 +26,27 @@ function ModalDialog(_ref) {
|
|
|
21
26
|
var _classNames;
|
|
22
27
|
var children = _ref.children,
|
|
23
28
|
title = _ref.title,
|
|
24
|
-
isOpen = _ref.isOpen,
|
|
29
|
+
_ref$isOpen = _ref.isOpen,
|
|
30
|
+
isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
|
|
25
31
|
onClose = _ref.onClose,
|
|
26
|
-
size = _ref.size,
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
32
|
+
_ref$size = _ref.size,
|
|
33
|
+
size = _ref$size === void 0 ? 'md' : _ref$size,
|
|
34
|
+
_ref$variant = _ref.variant,
|
|
35
|
+
variant = _ref$variant === void 0 ? 'default' : _ref$variant,
|
|
36
|
+
_ref$hasCloseButton = _ref.hasCloseButton,
|
|
37
|
+
hasCloseButton = _ref$hasCloseButton === void 0 ? true : _ref$hasCloseButton,
|
|
38
|
+
_ref$closeLabel = _ref.closeLabel,
|
|
39
|
+
closeLabel = _ref$closeLabel === void 0 ? MODAL_DIALOG_CLOSE_LABEL : _ref$closeLabel,
|
|
40
|
+
_ref$isFullscreenScro = _ref.isFullscreenScroll,
|
|
41
|
+
isFullscreenScroll = _ref$isFullscreenScro === void 0 ? false : _ref$isFullscreenScro,
|
|
31
42
|
className = _ref.className,
|
|
32
|
-
|
|
33
|
-
|
|
43
|
+
_ref$isFullscreenOnMo = _ref.isFullscreenOnMobile,
|
|
44
|
+
isFullscreenOnMobile = _ref$isFullscreenOnMo === void 0 ? false : _ref$isFullscreenOnMo,
|
|
45
|
+
_ref$isBlocking = _ref.isBlocking,
|
|
46
|
+
isBlocking = _ref$isBlocking === void 0 ? false : _ref$isBlocking,
|
|
34
47
|
zIndex = _ref.zIndex,
|
|
35
|
-
|
|
48
|
+
_ref$isOverflowVisibl = _ref.isOverflowVisible,
|
|
49
|
+
isOverflowVisible = _ref$isOverflowVisibl === void 0 ? true : _ref$isOverflowVisibl;
|
|
36
50
|
var isMobile = useMediaQuery({
|
|
37
51
|
query: '(max-width: 767.98px)'
|
|
38
52
|
});
|
|
@@ -119,18 +133,6 @@ ModalDialog.propTypes = {
|
|
|
119
133
|
*/
|
|
120
134
|
isOverflowVisible: PropTypes.bool.isRequired
|
|
121
135
|
};
|
|
122
|
-
ModalDialog.defaultProps = {
|
|
123
|
-
isOpen: false,
|
|
124
|
-
hasCloseButton: true,
|
|
125
|
-
size: 'md',
|
|
126
|
-
variant: 'default',
|
|
127
|
-
closeLabel: MODAL_DIALOG_CLOSE_LABEL,
|
|
128
|
-
className: undefined,
|
|
129
|
-
isFullscreenScroll: false,
|
|
130
|
-
isFullscreenOnMobile: false,
|
|
131
|
-
isBlocking: false,
|
|
132
|
-
zIndex: undefined
|
|
133
|
-
};
|
|
134
136
|
ModalDialog.Header = ModalDialogHeader;
|
|
135
137
|
ModalDialog.Title = ModalDialogTitle;
|
|
136
138
|
ModalDialog.Footer = ModalDialogFooter;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalDialog.js","names":["React","PropTypes","classNames","useMediaQuery","ModalLayer","ModalCloseButton","ModalDialogHeader","ModalDialogTitle","ModalDialogFooter","ModalDialogBody","ModalDialogHero","Icon","IconButton","Close","MODAL_DIALOG_CLOSE_LABEL","ModalDialog","_ref","_classNames","children","title","isOpen","onClose","size","variant","hasCloseButton","closeLabel","isFullscreenScroll","className","isFullscreenOnMobile","isBlocking","zIndex","isOverflowVisible","isMobile","query","showFullScreen","createElement","role","_defineProperty","concat","as","iconAs","invertColors","src","alt","propTypes","node","isRequired","string","func","bool","oneOf","number","defaultProps","undefined","Header","Title","Footer","CloseButton","Body","Hero"],"sources":["../../src/Modal/ModalDialog.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { useMediaQuery } from 'react-responsive';\nimport ModalLayer from './ModalLayer';\nimport ModalCloseButton from './ModalCloseButton';\nimport ModalDialogHeader from './ModalDialogHeader';\nimport ModalDialogTitle from './ModalDialogTitle';\nimport ModalDialogFooter from './ModalDialogFooter';\nimport ModalDialogBody from './ModalDialogBody';\nimport ModalDialogHero from './ModalDialogHero';\n\nimport Icon from '../Icon';\nimport IconButton from '../IconButton';\nimport { Close } from '../../icons';\n\nexport const MODAL_DIALOG_CLOSE_LABEL = 'Close';\n\nfunction ModalDialog({\n children,\n title,\n isOpen,\n onClose,\n size,\n variant,\n hasCloseButton,\n closeLabel,\n isFullscreenScroll,\n className,\n isFullscreenOnMobile,\n isBlocking,\n zIndex,\n isOverflowVisible,\n}) {\n const isMobile = useMediaQuery({ query: '(max-width: 767.98px)' });\n const showFullScreen = (isFullscreenOnMobile && isMobile);\n return (\n <ModalLayer isOpen={isOpen} onClose={onClose} isBlocking={isBlocking} zIndex={zIndex}>\n <div\n role=\"dialog\"\n aria-label={title}\n className={classNames(\n 'pgn__modal',\n {\n [`pgn__modal-${showFullScreen ? 'fullscreen' : size}`]: size,\n [`pgn__modal-${variant}`]: variant,\n 'pgn__modal-scroll-fullscreen': isFullscreenScroll,\n 'pgn__modal-visible-overflow': isOverflowVisible,\n },\n className,\n )}\n >\n {hasCloseButton && (\n <div className=\"pgn__modal-close-container\">\n <ModalCloseButton\n as={IconButton}\n iconAs={Icon}\n invertColors={variant === 'dark'}\n src={Close}\n alt={closeLabel}\n />\n </div>\n )}\n {children}\n </div>\n </ModalLayer>\n );\n}\n\nModalDialog.propTypes = {\n /**\n * Specifies the content of the dialog\n */\n children: PropTypes.node.isRequired,\n /**\n * The aria-label of the dialog\n */\n title: PropTypes.string.isRequired,\n /**\n * A callback to close the modal dialog\n */\n onClose: PropTypes.func.isRequired,\n /**\n * Is the modal dialog open or closed\n */\n isOpen: PropTypes.bool,\n /**\n * The close 'x' icon button in the top right of the dialog box\n */\n hasCloseButton: PropTypes.bool,\n /**\n * Sizes determine the maximum width of the dialog box\n */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /**\n * The visual style of the dialog box\n */\n variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success', 'dark']),\n /**\n * The label supplied to the close icon button if one is rendered\n */\n closeLabel: PropTypes.string,\n /**\n * Specifies class name to append to the base element\n */\n className: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ``ModalDialog``. Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /**\n * To show full screen view on mobile screens\n */\n isFullscreenOnMobile: PropTypes.bool,\n /**\n * Prevent clicking on the backdrop or pressing Esc to close the modal\n */\n isBlocking: PropTypes.bool,\n /**\n * Specifies the z-index of the modal\n */\n zIndex: PropTypes.number,\n /**\n * Specifies whether overflow content inside the modal should be visible.\n * - `true` - content that exceeds the modal boundaries will remain visible outside the modal's main viewport,\n * rather than being clipped or hidden.\n * - `false` - any overflow content will be clipped to fit within the modal's dimensions.\n */\n isOverflowVisible: PropTypes.bool.isRequired,\n};\n\nModalDialog.defaultProps = {\n isOpen: false,\n hasCloseButton: true,\n size: 'md',\n variant: 'default',\n closeLabel: MODAL_DIALOG_CLOSE_LABEL,\n className: undefined,\n isFullscreenScroll: false,\n isFullscreenOnMobile: false,\n isBlocking: false,\n zIndex: undefined,\n};\n\nModalDialog.Header = ModalDialogHeader;\nModalDialog.Title = ModalDialogTitle;\nModalDialog.Footer = ModalDialogFooter;\nModalDialog.CloseButton = ModalCloseButton;\nModalDialog.Body = ModalDialogBody;\nModalDialog.Hero = ModalDialogHero;\n\nexport default ModalDialog;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ModalDialog.js","names":["React","PropTypes","classNames","useMediaQuery","ModalLayer","ModalCloseButton","ModalDialogHeader","ModalDialogTitle","ModalDialogFooter","ModalDialogBody","ModalDialogHero","Icon","IconButton","Close","MODAL_DIALOG_CLOSE_LABEL","ModalDialog","_ref","_classNames","children","title","_ref$isOpen","isOpen","onClose","_ref$size","size","_ref$variant","variant","_ref$hasCloseButton","hasCloseButton","_ref$closeLabel","closeLabel","_ref$isFullscreenScro","isFullscreenScroll","className","_ref$isFullscreenOnMo","isFullscreenOnMobile","_ref$isBlocking","isBlocking","zIndex","_ref$isOverflowVisibl","isOverflowVisible","isMobile","query","showFullScreen","createElement","role","_defineProperty","concat","as","iconAs","invertColors","src","alt","propTypes","node","isRequired","string","func","bool","oneOf","number","Header","Title","Footer","CloseButton","Body","Hero"],"sources":["../../src/Modal/ModalDialog.tsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { useMediaQuery } from 'react-responsive';\nimport ModalLayer from './ModalLayer';\n// @ts-ignore for now - this needs to be converted to TypeScript\nimport ModalCloseButton from './ModalCloseButton';\nimport ModalDialogHeader from './ModalDialogHeader';\n// @ts-ignore for now - this needs to be converted to TypeScript\nimport ModalDialogTitle from './ModalDialogTitle';\n// @ts-ignore for now - this needs to be converted to TypeScript\nimport ModalDialogFooter from './ModalDialogFooter';\n// @ts-ignore for now - this needs to be converted to TypeScript\nimport ModalDialogBody from './ModalDialogBody';\n// @ts-ignore for now - this needs to be converted to TypeScript\nimport ModalDialogHero from './ModalDialogHero';\n\nimport Icon from '../Icon';\nimport IconButton from '../IconButton';\nimport { Close } from '../../icons';\n\nexport const MODAL_DIALOG_CLOSE_LABEL = 'Close';\n\ninterface Props {\n /** Specifies the content of the dialog */\n children: React.ReactNode;\n /** The aria-label of the dialog */\n title: string;\n /** A callback to close the modal dialog, e.g. when Escape is pressed */\n onClose: () => void;\n /** Is the modal dialog open or closed? */\n isOpen?: boolean;\n /** The close 'x' icon button in the top right of the dialog box */\n hasCloseButton?: boolean;\n /** Size determines the maximum width of the dialog box */\n size?: 'sm' | 'md' | 'lg' | 'xl' | 'fullscreen';\n /** The visual style of the dialog box */\n variant?: 'default' | 'warning' | 'danger' | 'success' | 'dark';\n /** The label supplied to the close icon button if one is rendered */\n closeLabel?: string;\n /** Specifies class name to append to the base element */\n className?: string;\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ``ModalDialog``. Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll?: boolean;\n /** To show full screen view on mobile screens */\n isFullscreenOnMobile?: boolean;\n /** Prevent clicking on the backdrop or pressing Esc to close the modal */\n isBlocking?: boolean;\n /** Specifies the z-index of the modal */\n zIndex?: number;\n /** Specifies whether overflow is visible in the modal */\n isOverflowVisible?: boolean;\n}\n\nfunction ModalDialog({\n children,\n title,\n isOpen = false,\n onClose,\n size = 'md',\n variant = 'default',\n hasCloseButton = true,\n closeLabel = MODAL_DIALOG_CLOSE_LABEL,\n isFullscreenScroll = false,\n className,\n isFullscreenOnMobile = false,\n isBlocking = false,\n zIndex,\n isOverflowVisible = true,\n}: Props) {\n const isMobile = useMediaQuery({ query: '(max-width: 767.98px)' });\n const showFullScreen = (isFullscreenOnMobile && isMobile);\n return (\n <ModalLayer isOpen={isOpen} onClose={onClose} isBlocking={isBlocking} zIndex={zIndex}>\n <div\n role=\"dialog\"\n aria-label={title}\n className={classNames(\n 'pgn__modal',\n {\n [`pgn__modal-${showFullScreen ? 'fullscreen' : size}`]: size,\n [`pgn__modal-${variant}`]: variant,\n 'pgn__modal-scroll-fullscreen': isFullscreenScroll,\n 'pgn__modal-visible-overflow': isOverflowVisible,\n },\n className,\n )}\n >\n {hasCloseButton && (\n <div className=\"pgn__modal-close-container\">\n <ModalCloseButton\n as={IconButton}\n iconAs={Icon}\n invertColors={variant === 'dark'}\n src={Close}\n alt={closeLabel}\n />\n </div>\n )}\n {children}\n </div>\n </ModalLayer>\n );\n}\n\nModalDialog.propTypes = {\n /**\n * Specifies the content of the dialog\n */\n children: PropTypes.node.isRequired,\n /**\n * The aria-label of the dialog\n */\n title: PropTypes.string.isRequired,\n /**\n * A callback to close the modal dialog\n */\n onClose: PropTypes.func.isRequired,\n /**\n * Is the modal dialog open or closed\n */\n isOpen: PropTypes.bool,\n /**\n * The close 'x' icon button in the top right of the dialog box\n */\n hasCloseButton: PropTypes.bool,\n /**\n * Sizes determine the maximum width of the dialog box\n */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /**\n * The visual style of the dialog box\n */\n variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success', 'dark']),\n /**\n * The label supplied to the close icon button if one is rendered\n */\n closeLabel: PropTypes.string,\n /**\n * Specifies class name to append to the base element\n */\n className: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ``ModalDialog``. Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /**\n * To show full screen view on mobile screens\n */\n isFullscreenOnMobile: PropTypes.bool,\n /**\n * Prevent clicking on the backdrop or pressing Esc to close the modal\n */\n isBlocking: PropTypes.bool,\n /**\n * Specifies the z-index of the modal\n */\n zIndex: PropTypes.number,\n /**\n * Specifies whether overflow content inside the modal should be visible.\n * - `true` - content that exceeds the modal boundaries will remain visible outside the modal's main viewport,\n * rather than being clipped or hidden.\n * - `false` - any overflow content will be clipped to fit within the modal's dimensions.\n */\n isOverflowVisible: PropTypes.bool.isRequired,\n};\n\nModalDialog.Header = ModalDialogHeader;\nModalDialog.Title = ModalDialogTitle;\nModalDialog.Footer = ModalDialogFooter;\nModalDialog.CloseButton = ModalCloseButton;\nModalDialog.Body = ModalDialogBody;\nModalDialog.Hero = ModalDialogHero;\n\nexport default ModalDialog;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ComponentWithAsProp } from '../utils/types/bootstrap';
|
|
3
|
+
export interface Props {
|
|
4
|
+
as?: string;
|
|
5
|
+
children: React.ReactNode;
|
|
6
|
+
className?: string;
|
|
7
|
+
}
|
|
8
|
+
type HeaderType = ComponentWithAsProp<'div', Props>;
|
|
9
|
+
declare const ModalDialogHeader: HeaderType;
|
|
10
|
+
export default ModalDialogHeader;
|