@openedx/paragon 22.7.0 → 22.8.1
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/index.d.ts +1 -1
- package/dist/paragon.css +1 -1
- package/package.json +1 -1
- 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/index.d.ts +1 -1
- package/src/Container/index.jsx +0 -49
package/dist/Card/index.scss
CHANGED
|
@@ -353,6 +353,8 @@ a.pgn__card {
|
|
|
353
353
|
bottom: #{-$card-logo-bottom-offset};
|
|
354
354
|
width: $card-logo-width;
|
|
355
355
|
height: $card-logo-height;
|
|
356
|
+
object-fit: scale-down;
|
|
357
|
+
object-position: center center;
|
|
356
358
|
border-radius: $card-logo-border-radius;
|
|
357
359
|
box-shadow: $level-1-box-shadow;
|
|
358
360
|
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/index.d.ts
CHANGED
|
@@ -8,6 +8,7 @@ export { default as Bubble } from './Bubble';
|
|
|
8
8
|
export { default as Button, ButtonGroup, ButtonToolbar } from './Button';
|
|
9
9
|
export { default as Chip, CHIP_PGN_CLASS } from './Chip';
|
|
10
10
|
export { default as ChipCarousel } from './ChipCarousel';
|
|
11
|
+
export { default as Container, ContainerSize } from './Container';
|
|
11
12
|
export { default as Hyperlink, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT, HYPER_LINK_EXTERNAL_LINK_TITLE } from './Hyperlink';
|
|
12
13
|
export { default as Icon } from './Icon';
|
|
13
14
|
export { default as IconButton, IconButtonWithTooltip } from './IconButton';
|
|
@@ -41,7 +42,6 @@ export const
|
|
|
41
42
|
export const CheckBox: any; // from './CheckBox';
|
|
42
43
|
export const CheckBoxGroup: any; // from './CheckBoxGroup';
|
|
43
44
|
export const CloseButton: any; // from './CloseButton';
|
|
44
|
-
export const Container: any; // from './Container';
|
|
45
45
|
export const Layout: any, Col: any, Row: any; // from './Layout';
|
|
46
46
|
export const Collapse: any; // from './Collapse';
|
|
47
47
|
export const Collapsible: any; // from './Collapsible';
|