@openedx/paragon 22.0.0-alpha.15 → 22.0.0-alpha.17
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/README.md +8 -8
- package/dist/DataTable/ExpandRow.js +3 -8
- package/dist/DataTable/ExpandRow.js.map +1 -1
- package/dist/DataTable/selection/ControlledSelect.js +3 -7
- package/dist/DataTable/selection/ControlledSelect.js.map +1 -1
- package/dist/DataTable/selection/ControlledSelectHeader.js +3 -7
- package/dist/DataTable/selection/ControlledSelectHeader.js.map +1 -1
- package/dist/DataTable/selection/ControlledSelectionStatus.js +5 -14
- package/dist/DataTable/selection/ControlledSelectionStatus.js.map +1 -1
- package/dist/Nav/index.scss +9 -9
- package/dist/Tabs/index.scss +8 -0
- package/dist/core.css +30 -13
- package/dist/core.css.map +1 -1
- package/dist/core.min.css +1 -1
- package/dist/light.css +20 -13
- package/dist/light.css.map +1 -1
- package/dist/light.min.css +1 -1
- package/package.json +1 -1
- package/src/DataTable/ExpandRow.jsx +2 -2
- package/src/DataTable/selection/ControlledSelect.jsx +1 -2
- package/src/DataTable/selection/ControlledSelectHeader.jsx +1 -2
- package/src/DataTable/selection/ControlledSelectionStatus.jsx +1 -2
- package/src/DataTable/tests/ExpandRow.test.jsx +2 -8
- package/src/Nav/index.scss +9 -9
- package/src/Tabs/index.scss +8 -0
- package/styles/css/core/variables.css +6 -6
- package/styles/css/themes/light/variables.css +20 -13
- package/tokens/src/core/components/Card.json +1 -1
- package/tokens/src/core/components/Carousel.json +2 -2
- package/tokens/src/core/components/DataTable.json +1 -1
- package/tokens/src/core/components/Nav.json +1 -1
- package/tokens/src/core/components/ProgressBar.json +0 -5
- package/tokens/src/core/components/Tab.json +2 -1
- package/tokens/src/themes/light/components/Breadcrumb.json +0 -1
- package/tokens/src/themes/light/components/Dropdown.json +6 -1
- package/tokens/src/themes/light/components/Form/color.json +2 -2
- package/tokens/src/themes/light/components/Nav.json +26 -5
- package/tokens/src/themes/light/components/Popover.json +1 -1
- package/tokens/src/themes/light/components/ProductTour.json +2 -2
- package/tokens/src/themes/light/components/Tab.json +8 -1
package/README.md
CHANGED
|
@@ -15,6 +15,14 @@ Documentation lives at https://paragon-openedx.netlify.app/.
|
|
|
15
15
|
|
|
16
16
|
## Getting Started
|
|
17
17
|
|
|
18
|
+
### Getting Help
|
|
19
|
+
|
|
20
|
+
Please reach out to the Paragon Working Group (PWG):
|
|
21
|
+
|
|
22
|
+
* Open edX Slack ([request an invite](https://openedx.org/slack)): [#wg-paragon](https://openedx.slack.com/archives/C02NR285KV4)
|
|
23
|
+
* [Github Issues](https://github.com/openedx/paragon/issues/new?template=blank-issue.md)
|
|
24
|
+
* [Weekly PWG Meeting](https://calendar.google.com/calendar/embed?src=c_v86shrnegshsqgp4fj2k94u7bc%40group.calendar.google.com&ctz=America%2FNew_York)
|
|
25
|
+
|
|
18
26
|
### React Components
|
|
19
27
|
|
|
20
28
|
Paragon components require React 16 or higher. To install Paragon into your project:
|
|
@@ -68,14 +76,6 @@ The Paragon CLI (Command Line Interface) is a tool that provides various utility
|
|
|
68
76
|
|
|
69
77
|
Use `paragon help` to see more information.
|
|
70
78
|
|
|
71
|
-
## Getting Help
|
|
72
|
-
|
|
73
|
-
Please reach out to the Paragon Working Group (PWG):
|
|
74
|
-
|
|
75
|
-
* Open edX Slack ([request an invite](https://openedx.org/slack)): [#wg-paragon](https://openedx.slack.com/archives/C02NR285KV4)
|
|
76
|
-
* [Github Issues](https://github.com/openedx/paragon/issues/new?template=blank-issue.md)
|
|
77
|
-
* [Weekly PWG Meeting](https://calendar.google.com/calendar/embed?src=c_v86shrnegshsqgp4fj2k94u7bc%40group.calendar.google.com&ctz=America%2FNew_York)
|
|
78
|
-
|
|
79
79
|
## Internationalization
|
|
80
80
|
|
|
81
81
|
Paragon supports internationalization for its components out of the box with the support of [react-intl](https://formatjs.io/docs/react-intl/). You may view translated strings for each component on the documentation website by switching languages in the settings.
|
|
@@ -1,7 +1,3 @@
|
|
|
1
|
-
const _excluded = ["row"];
|
|
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
|
-
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; }
|
|
4
|
-
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; }
|
|
5
1
|
import React from 'react';
|
|
6
2
|
import PropTypes from 'prop-types';
|
|
7
3
|
import { ExpandLess, ExpandMore } from '../../icons';
|
|
@@ -10,10 +6,9 @@ import IconButton from '../IconButton';
|
|
|
10
6
|
const EXPAND_COLLAPSE_ICON_SIZE = 'inline';
|
|
11
7
|
function ExpandRow(_ref) {
|
|
12
8
|
let {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
return /*#__PURE__*/React.createElement("span", _extends({}, row.getToggleRowExpandedProps(), rest), row.isExpanded ? /*#__PURE__*/React.createElement(IconButton, {
|
|
9
|
+
row
|
|
10
|
+
} = _ref;
|
|
11
|
+
return /*#__PURE__*/React.createElement("span", row.getToggleRowExpandedProps(), row.isExpanded ? /*#__PURE__*/React.createElement(IconButton, {
|
|
17
12
|
src: ExpandLess,
|
|
18
13
|
iconAs: Icon,
|
|
19
14
|
alt: "Collapse row",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpandRow.js","names":["React","PropTypes","ExpandLess","ExpandMore","Icon","IconButton","EXPAND_COLLAPSE_ICON_SIZE","ExpandRow","_ref","row","
|
|
1
|
+
{"version":3,"file":"ExpandRow.js","names":["React","PropTypes","ExpandLess","ExpandMore","Icon","IconButton","EXPAND_COLLAPSE_ICON_SIZE","ExpandRow","_ref","row","createElement","getToggleRowExpandedProps","isExpanded","src","iconAs","alt","size","propTypes","shape","bool","func","isRequired"],"sources":["../../src/DataTable/ExpandRow.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { ExpandLess, ExpandMore } from '../../icons';\nimport Icon from '../Icon';\nimport IconButton from '../IconButton';\n\nconst EXPAND_COLLAPSE_ICON_SIZE = 'inline';\n\nfunction ExpandRow({ row }) {\n return (\n <span {...row.getToggleRowExpandedProps()}>\n {row.isExpanded\n ? <IconButton src={ExpandLess} iconAs={Icon} alt=\"Collapse row\" size={EXPAND_COLLAPSE_ICON_SIZE} />\n : <IconButton src={ExpandMore} iconAs={Icon} alt=\"Expand row\" size={EXPAND_COLLAPSE_ICON_SIZE} />}\n </span>\n );\n}\n\nExpandRow.propTypes = {\n /** Row data that is received from `react-table` API. */\n row: PropTypes.shape({\n /** Specifies if row is in expanded state. */\n isExpanded: PropTypes.bool,\n /** Function that returns props for the wrapper component to handle expand behaviour. */\n getToggleRowExpandedProps: PropTypes.func.isRequired,\n }).isRequired,\n};\n\nexport default ExpandRow;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,UAAU,EAAEC,UAAU,QAAQ,aAAa;AACpD,OAAOC,IAAI,MAAM,SAAS;AAC1B,OAAOC,UAAU,MAAM,eAAe;AAEtC,MAAMC,yBAAyB,GAAG,QAAQ;AAE1C,SAASC,SAASA,CAAAC,IAAA,EAAU;EAAA,IAAT;IAAEC;EAAI,CAAC,GAAAD,IAAA;EACxB,oBACER,KAAA,CAAAU,aAAA,SAAUD,GAAG,CAACE,yBAAyB,CAAC,CAAC,EACtCF,GAAG,CAACG,UAAU,gBACXZ,KAAA,CAAAU,aAAA,CAACL,UAAU;IAACQ,GAAG,EAAEX,UAAW;IAACY,MAAM,EAAEV,IAAK;IAACW,GAAG,EAAC,cAAc;IAACC,IAAI,EAAEV;EAA0B,CAAE,CAAC,gBACjGN,KAAA,CAAAU,aAAA,CAACL,UAAU;IAACQ,GAAG,EAAEV,UAAW;IAACW,MAAM,EAAEV,IAAK;IAACW,GAAG,EAAC,YAAY;IAACC,IAAI,EAAEV;EAA0B,CAAE,CAC9F,CAAC;AAEX;AAEAC,SAAS,CAACU,SAAS,GAAG;EACpB;EACAR,GAAG,EAAER,SAAS,CAACiB,KAAK,CAAC;IACnB;IACAN,UAAU,EAAEX,SAAS,CAACkB,IAAI;IAC1B;IACAR,yBAAyB,EAAEV,SAAS,CAACmB,IAAI,CAACC;EAC5C,CAAC,CAAC,CAACA;AACL,CAAC;AAED,eAAed,SAAS"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
const _excluded = ["row"];
|
|
2
1
|
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
|
-
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; }
|
|
4
|
-
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; }
|
|
5
2
|
import React, { useContext, useCallback } from 'react';
|
|
6
3
|
import PropTypes from 'prop-types';
|
|
7
4
|
import { CheckboxControl } from '../../Form';
|
|
@@ -10,9 +7,8 @@ import useConvertIndeterminateProp from '../utils/useConvertIndeterminateProp';
|
|
|
10
7
|
import { deleteSelectedRowAction, addSelectedRowAction } from './data/actions';
|
|
11
8
|
function ControlledSelect(_ref) {
|
|
12
9
|
let {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
10
|
+
row
|
|
11
|
+
} = _ref;
|
|
16
12
|
const {
|
|
17
13
|
itemCount,
|
|
18
14
|
controlledTableSelections: [, dispatch]
|
|
@@ -29,7 +25,7 @@ function ControlledSelect(_ref) {
|
|
|
29
25
|
className: "pgn__data-table__controlled-select"
|
|
30
26
|
}, /*#__PURE__*/React.createElement(CheckboxControl, _extends({}, updatedProps, {
|
|
31
27
|
onChange: toggleSelected
|
|
32
|
-
}
|
|
28
|
+
})));
|
|
33
29
|
}
|
|
34
30
|
ControlledSelect.propTypes = {
|
|
35
31
|
row: PropTypes.shape({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ControlledSelect.js","names":["React","useContext","useCallback","PropTypes","CheckboxControl","DataTableContext","useConvertIndeterminateProp","deleteSelectedRowAction","addSelectedRowAction","ControlledSelect","_ref","row","
|
|
1
|
+
{"version":3,"file":"ControlledSelect.js","names":["React","useContext","useCallback","PropTypes","CheckboxControl","DataTableContext","useConvertIndeterminateProp","deleteSelectedRowAction","addSelectedRowAction","ControlledSelect","_ref","row","itemCount","controlledTableSelections","dispatch","toggleSelected","isSelected","id","updatedProps","getToggleRowSelectedProps","createElement","className","_extends","onChange","propTypes","shape","oneOfType","string","number","isRequired","func","bool"],"sources":["../../../src/DataTable/selection/ControlledSelect.jsx"],"sourcesContent":["import React, { useContext, useCallback } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { CheckboxControl } from '../../Form';\nimport DataTableContext from '../DataTableContext';\nimport useConvertIndeterminateProp from '../utils/useConvertIndeterminateProp';\n\nimport {\n deleteSelectedRowAction,\n addSelectedRowAction,\n} from './data/actions';\n\nfunction ControlledSelect({ row }) {\n const {\n itemCount,\n controlledTableSelections: [, dispatch],\n } = useContext(DataTableContext);\n\n const toggleSelected = useCallback(\n () => {\n if (row.isSelected) {\n dispatch(deleteSelectedRowAction(row.id));\n } else {\n dispatch(addSelectedRowAction(row, itemCount));\n }\n },\n [itemCount, row, dispatch],\n );\n\n const updatedProps = useConvertIndeterminateProp(row.getToggleRowSelectedProps());\n\n return (\n <div className=\"pgn__data-table__controlled-select\">\n <CheckboxControl\n {...updatedProps}\n onChange={toggleSelected}\n />\n </div>\n );\n}\n\nControlledSelect.propTypes = {\n row: PropTypes.shape({\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n getToggleRowSelectedProps: PropTypes.func.isRequired,\n isSelected: PropTypes.bool.isRequired,\n }).isRequired,\n};\n\nexport default ControlledSelect;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,WAAW,QAAQ,OAAO;AACtD,OAAOC,SAAS,MAAM,YAAY;AAElC,SAASC,eAAe,QAAQ,YAAY;AAC5C,OAAOC,gBAAgB,MAAM,qBAAqB;AAClD,OAAOC,2BAA2B,MAAM,sCAAsC;AAE9E,SACEC,uBAAuB,EACvBC,oBAAoB,QACf,gBAAgB;AAEvB,SAASC,gBAAgBA,CAAAC,IAAA,EAAU;EAAA,IAAT;IAAEC;EAAI,CAAC,GAAAD,IAAA;EAC/B,MAAM;IACJE,SAAS;IACTC,yBAAyB,EAAE,GAAGC,QAAQ;EACxC,CAAC,GAAGb,UAAU,CAACI,gBAAgB,CAAC;EAEhC,MAAMU,cAAc,GAAGb,WAAW,CAChC,MAAM;IACJ,IAAIS,GAAG,CAACK,UAAU,EAAE;MAClBF,QAAQ,CAACP,uBAAuB,CAACI,GAAG,CAACM,EAAE,CAAC,CAAC;IAC3C,CAAC,MAAM;MACLH,QAAQ,CAACN,oBAAoB,CAACG,GAAG,EAAEC,SAAS,CAAC,CAAC;IAChD;EACF,CAAC,EACD,CAACA,SAAS,EAAED,GAAG,EAAEG,QAAQ,CAC3B,CAAC;EAED,MAAMI,YAAY,GAAGZ,2BAA2B,CAACK,GAAG,CAACQ,yBAAyB,CAAC,CAAC,CAAC;EAEjF,oBACEnB,KAAA,CAAAoB,aAAA;IAAKC,SAAS,EAAC;EAAoC,gBACjDrB,KAAA,CAAAoB,aAAA,CAAChB,eAAe,EAAAkB,QAAA,KACVJ,YAAY;IAChBK,QAAQ,EAAER;EAAe,EAC1B,CACE,CAAC;AAEV;AAEAN,gBAAgB,CAACe,SAAS,GAAG;EAC3Bb,GAAG,EAAER,SAAS,CAACsB,KAAK,CAAC;IACnBR,EAAE,EAAEd,SAAS,CAACuB,SAAS,CAAC,CAACvB,SAAS,CAACwB,MAAM,EAAExB,SAAS,CAACyB,MAAM,CAAC,CAAC,CAACC,UAAU;IACxEV,yBAAyB,EAAEhB,SAAS,CAAC2B,IAAI,CAACD,UAAU;IACpDb,UAAU,EAAEb,SAAS,CAAC4B,IAAI,CAACF;EAC7B,CAAC,CAAC,CAACA;AACL,CAAC;AAED,eAAepB,gBAAgB"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
const _excluded = ["rows"];
|
|
2
1
|
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
|
-
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; }
|
|
4
|
-
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; }
|
|
5
2
|
import React, { useContext, useMemo, useCallback } from 'react';
|
|
6
3
|
import PropTypes from 'prop-types';
|
|
7
4
|
import { CheckboxControl } from '../../Form';
|
|
@@ -9,9 +6,8 @@ import DataTableContext from '../DataTableContext';
|
|
|
9
6
|
import { clearPageSelectionAction, setSelectedRowsAction } from './data/actions';
|
|
10
7
|
function ControlledSelectHeader(_ref) {
|
|
11
8
|
let {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
9
|
+
rows
|
|
10
|
+
} = _ref;
|
|
15
11
|
const {
|
|
16
12
|
itemCount,
|
|
17
13
|
controlledTableSelections: [, dispatch],
|
|
@@ -37,7 +33,7 @@ function ControlledSelectHeader(_ref) {
|
|
|
37
33
|
className: "pgn__data-table__controlled-select"
|
|
38
34
|
}, /*#__PURE__*/React.createElement(CheckboxControl, _extends({}, toggleAllPageRowsSelectedProps, {
|
|
39
35
|
onChange: toggleAllPageRowsSelected
|
|
40
|
-
}
|
|
36
|
+
})));
|
|
41
37
|
}
|
|
42
38
|
ControlledSelectHeader.propTypes = {
|
|
43
39
|
rows: PropTypes.arrayOf(PropTypes.shape({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ControlledSelectHeader.js","names":["React","useContext","useMemo","useCallback","PropTypes","CheckboxControl","DataTableContext","clearPageSelectionAction","setSelectedRowsAction","ControlledSelectHeader","_ref","rows","
|
|
1
|
+
{"version":3,"file":"ControlledSelectHeader.js","names":["React","useContext","useMemo","useCallback","PropTypes","CheckboxControl","DataTableContext","clearPageSelectionAction","setSelectedRowsAction","ControlledSelectHeader","_ref","rows","itemCount","controlledTableSelections","dispatch","getToggleAllPageRowsSelectedProps","state","selectedRowIds","isAllPageRowsSelected","selectedPageRowIds","Object","keys","toggleAllPageRowsSelected","toggleAllPageRowsSelectedProps","isIndeterminate","indeterminate","createElement","className","_extends","onChange","propTypes","arrayOf","shape","id","oneOfType","string","number","isRequired"],"sources":["../../../src/DataTable/selection/ControlledSelectHeader.jsx"],"sourcesContent":["import React, { useContext, useMemo, useCallback } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { CheckboxControl } from '../../Form';\nimport DataTableContext from '../DataTableContext';\n\nimport {\n clearPageSelectionAction,\n setSelectedRowsAction,\n} from './data/actions';\n\nfunction ControlledSelectHeader({ rows }) {\n const {\n itemCount,\n controlledTableSelections: [, dispatch],\n getToggleAllPageRowsSelectedProps,\n state: { selectedRowIds },\n isAllPageRowsSelected,\n } = useContext(DataTableContext);\n\n const selectedPageRowIds = useMemo(\n () => Object.keys(selectedRowIds),\n [selectedRowIds],\n );\n\n const toggleAllPageRowsSelected = useCallback(\n () => {\n if (isAllPageRowsSelected) {\n dispatch(clearPageSelectionAction(selectedPageRowIds));\n } else {\n dispatch(setSelectedRowsAction(rows, itemCount));\n }\n },\n [rows, selectedPageRowIds, isAllPageRowsSelected, dispatch, itemCount],\n );\n\n const toggleAllPageRowsSelectedProps = getToggleAllPageRowsSelectedProps();\n toggleAllPageRowsSelectedProps.isIndeterminate = toggleAllPageRowsSelectedProps.indeterminate;\n // delete unused ``indeterminate`` prop\n delete toggleAllPageRowsSelectedProps.indeterminate;\n\n return (\n <div className=\"pgn__data-table__controlled-select\">\n <CheckboxControl\n {...toggleAllPageRowsSelectedProps}\n onChange={toggleAllPageRowsSelected}\n />\n </div>\n );\n}\n\nControlledSelectHeader.propTypes = {\n rows: PropTypes.arrayOf(PropTypes.shape({\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n })).isRequired,\n};\n\nexport default ControlledSelectHeader;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,EAAEC,WAAW,QAAQ,OAAO;AAC/D,OAAOC,SAAS,MAAM,YAAY;AAElC,SAASC,eAAe,QAAQ,YAAY;AAC5C,OAAOC,gBAAgB,MAAM,qBAAqB;AAElD,SACEC,wBAAwB,EACxBC,qBAAqB,QAChB,gBAAgB;AAEvB,SAASC,sBAAsBA,CAAAC,IAAA,EAAW;EAAA,IAAV;IAAEC;EAAK,CAAC,GAAAD,IAAA;EACtC,MAAM;IACJE,SAAS;IACTC,yBAAyB,EAAE,GAAGC,QAAQ,CAAC;IACvCC,iCAAiC;IACjCC,KAAK,EAAE;MAAEC;IAAe,CAAC;IACzBC;EACF,CAAC,GAAGjB,UAAU,CAACK,gBAAgB,CAAC;EAEhC,MAAMa,kBAAkB,GAAGjB,OAAO,CAChC,MAAMkB,MAAM,CAACC,IAAI,CAACJ,cAAc,CAAC,EACjC,CAACA,cAAc,CACjB,CAAC;EAED,MAAMK,yBAAyB,GAAGnB,WAAW,CAC3C,MAAM;IACJ,IAAIe,qBAAqB,EAAE;MACzBJ,QAAQ,CAACP,wBAAwB,CAACY,kBAAkB,CAAC,CAAC;IACxD,CAAC,MAAM;MACLL,QAAQ,CAACN,qBAAqB,CAACG,IAAI,EAAEC,SAAS,CAAC,CAAC;IAClD;EACF,CAAC,EACD,CAACD,IAAI,EAAEQ,kBAAkB,EAAED,qBAAqB,EAAEJ,QAAQ,EAAEF,SAAS,CACvE,CAAC;EAED,MAAMW,8BAA8B,GAAGR,iCAAiC,CAAC,CAAC;EAC1EQ,8BAA8B,CAACC,eAAe,GAAGD,8BAA8B,CAACE,aAAa;EAC7F;EACA,OAAOF,8BAA8B,CAACE,aAAa;EAEnD,oBACEzB,KAAA,CAAA0B,aAAA;IAAKC,SAAS,EAAC;EAAoC,gBACjD3B,KAAA,CAAA0B,aAAA,CAACrB,eAAe,EAAAuB,QAAA,KACVL,8BAA8B;IAClCM,QAAQ,EAAEP;EAA0B,EACrC,CACE,CAAC;AAEV;AAEAb,sBAAsB,CAACqB,SAAS,GAAG;EACjCnB,IAAI,EAAEP,SAAS,CAAC2B,OAAO,CAAC3B,SAAS,CAAC4B,KAAK,CAAC;IACtCC,EAAE,EAAE7B,SAAS,CAAC8B,SAAS,CAAC,CAAC9B,SAAS,CAAC+B,MAAM,EAAE/B,SAAS,CAACgC,MAAM,CAAC,CAAC,CAACC;EAChE,CAAC,CAAC,CAAC,CAACA;AACN,CAAC;AAED,eAAe5B,sBAAsB"}
|
|
@@ -1,11 +1,3 @@
|
|
|
1
|
-
const _excluded = ["className", "clearSelectionText"];
|
|
2
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
6
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
|
-
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; }
|
|
8
|
-
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; }
|
|
9
1
|
import React, { useContext, useEffect } from 'react';
|
|
10
2
|
import PropTypes from 'prop-types';
|
|
11
3
|
import DataTableContext from '../DataTableContext';
|
|
@@ -14,10 +6,9 @@ import { clearSelectionAction, setSelectAllRowsAllPagesAction, setSelectedRowsAc
|
|
|
14
6
|
import { getUnselectedPageRows, getRowIds } from './data/helpers';
|
|
15
7
|
function ControlledSelectionStatus(_ref) {
|
|
16
8
|
let {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
9
|
+
className,
|
|
10
|
+
clearSelectionText
|
|
11
|
+
} = _ref;
|
|
21
12
|
const {
|
|
22
13
|
itemCount,
|
|
23
14
|
page,
|
|
@@ -37,14 +28,14 @@ function ControlledSelectionStatus(_ref) {
|
|
|
37
28
|
}, [isEntireTableSelected, selectedRows, itemCount, page, dispatch]);
|
|
38
29
|
const numSelectedRows = isEntireTableSelected ? itemCount : selectedRows.length;
|
|
39
30
|
const numSelectedRowsOnPage = (page || []).filter(r => r.isSelected).length;
|
|
40
|
-
const selectionStatusProps =
|
|
31
|
+
const selectionStatusProps = {
|
|
41
32
|
className,
|
|
42
33
|
numSelectedRows,
|
|
43
34
|
numSelectedRowsOnPage,
|
|
44
35
|
clearSelectionText,
|
|
45
36
|
onSelectAll: () => dispatch(setSelectAllRowsAllPagesAction()),
|
|
46
37
|
onClear: () => dispatch(clearSelectionAction())
|
|
47
|
-
}
|
|
38
|
+
};
|
|
48
39
|
return /*#__PURE__*/React.createElement(BaseSelectionStatus, selectionStatusProps);
|
|
49
40
|
}
|
|
50
41
|
ControlledSelectionStatus.defaultProps = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ControlledSelectionStatus.js","names":["React","useContext","useEffect","PropTypes","DataTableContext","BaseSelectionStatus","clearSelectionAction","setSelectAllRowsAllPagesAction","setSelectedRowsAction","getUnselectedPageRows","getRowIds","ControlledSelectionStatus","_ref","className","clearSelectionText","
|
|
1
|
+
{"version":3,"file":"ControlledSelectionStatus.js","names":["React","useContext","useEffect","PropTypes","DataTableContext","BaseSelectionStatus","clearSelectionAction","setSelectAllRowsAllPagesAction","setSelectedRowsAction","getUnselectedPageRows","getRowIds","ControlledSelectionStatus","_ref","className","clearSelectionText","itemCount","page","controlledTableSelections","selectedRows","isEntireTableSelected","dispatch","selectedRowIds","unselectedPageRows","length","numSelectedRows","numSelectedRowsOnPage","filter","r","isSelected","selectionStatusProps","onSelectAll","onClear","createElement","defaultProps","undefined","propTypes","string","oneOfType","element"],"sources":["../../../src/DataTable/selection/ControlledSelectionStatus.jsx"],"sourcesContent":["import React, { useContext, useEffect } from 'react';\nimport PropTypes from 'prop-types';\n\nimport DataTableContext from '../DataTableContext';\nimport BaseSelectionStatus from './BaseSelectionStatus';\n\nimport {\n clearSelectionAction,\n setSelectAllRowsAllPagesAction,\n setSelectedRowsAction,\n} from './data/actions';\nimport {\n getUnselectedPageRows,\n getRowIds,\n} from './data/helpers';\n\nfunction ControlledSelectionStatus({ className, clearSelectionText }) {\n const {\n itemCount,\n page,\n controlledTableSelections: [{ selectedRows, isEntireTableSelected }, dispatch],\n } = useContext(DataTableContext);\n\n useEffect(\n () => {\n if (isEntireTableSelected) {\n const selectedRowIds = getRowIds(selectedRows);\n const unselectedPageRows = getUnselectedPageRows(selectedRowIds, page);\n if (unselectedPageRows.length) {\n dispatch(setSelectedRowsAction(unselectedPageRows, itemCount));\n }\n }\n },\n [isEntireTableSelected, selectedRows, itemCount, page, dispatch],\n );\n\n const numSelectedRows = isEntireTableSelected ? itemCount : selectedRows.length;\n const numSelectedRowsOnPage = (page || []).filter(r => r.isSelected).length;\n\n const selectionStatusProps = {\n className,\n numSelectedRows,\n numSelectedRowsOnPage,\n clearSelectionText,\n onSelectAll: () => dispatch(setSelectAllRowsAllPagesAction()),\n onClear: () => dispatch(clearSelectionAction()),\n };\n return <BaseSelectionStatus {...selectionStatusProps} />;\n}\n\nControlledSelectionStatus.defaultProps = {\n className: undefined,\n clearSelectionText: undefined,\n};\n\nControlledSelectionStatus.propTypes = {\n /** A class name to append to the base element */\n className: PropTypes.string,\n /** A text that appears on the `Clear selection` button, defaults to 'Clear Selection' */\n clearSelectionText: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n};\n\nexport default ControlledSelectionStatus;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,QAAQ,OAAO;AACpD,OAAOC,SAAS,MAAM,YAAY;AAElC,OAAOC,gBAAgB,MAAM,qBAAqB;AAClD,OAAOC,mBAAmB,MAAM,uBAAuB;AAEvD,SACEC,oBAAoB,EACpBC,8BAA8B,EAC9BC,qBAAqB,QAChB,gBAAgB;AACvB,SACEC,qBAAqB,EACrBC,SAAS,QACJ,gBAAgB;AAEvB,SAASC,yBAAyBA,CAAAC,IAAA,EAAoC;EAAA,IAAnC;IAAEC,SAAS;IAAEC;EAAmB,CAAC,GAAAF,IAAA;EAClE,MAAM;IACJG,SAAS;IACTC,IAAI;IACJC,yBAAyB,EAAE,CAAC;MAAEC,YAAY;MAAEC;IAAsB,CAAC,EAAEC,QAAQ;EAC/E,CAAC,GAAGnB,UAAU,CAACG,gBAAgB,CAAC;EAEhCF,SAAS,CACP,MAAM;IACJ,IAAIiB,qBAAqB,EAAE;MACzB,MAAME,cAAc,GAAGX,SAAS,CAACQ,YAAY,CAAC;MAC9C,MAAMI,kBAAkB,GAAGb,qBAAqB,CAACY,cAAc,EAAEL,IAAI,CAAC;MACtE,IAAIM,kBAAkB,CAACC,MAAM,EAAE;QAC7BH,QAAQ,CAACZ,qBAAqB,CAACc,kBAAkB,EAAEP,SAAS,CAAC,CAAC;MAChE;IACF;EACF,CAAC,EACD,CAACI,qBAAqB,EAAED,YAAY,EAAEH,SAAS,EAAEC,IAAI,EAAEI,QAAQ,CACjE,CAAC;EAED,MAAMI,eAAe,GAAGL,qBAAqB,GAAGJ,SAAS,GAAGG,YAAY,CAACK,MAAM;EAC/E,MAAME,qBAAqB,GAAG,CAACT,IAAI,IAAI,EAAE,EAAEU,MAAM,CAACC,CAAC,IAAIA,CAAC,CAACC,UAAU,CAAC,CAACL,MAAM;EAE3E,MAAMM,oBAAoB,GAAG;IAC3BhB,SAAS;IACTW,eAAe;IACfC,qBAAqB;IACrBX,kBAAkB;IAClBgB,WAAW,EAAEA,CAAA,KAAMV,QAAQ,CAACb,8BAA8B,CAAC,CAAC,CAAC;IAC7DwB,OAAO,EAAEA,CAAA,KAAMX,QAAQ,CAACd,oBAAoB,CAAC,CAAC;EAChD,CAAC;EACD,oBAAON,KAAA,CAAAgC,aAAA,CAAC3B,mBAAmB,EAAKwB,oBAAuB,CAAC;AAC1D;AAEAlB,yBAAyB,CAACsB,YAAY,GAAG;EACvCpB,SAAS,EAAEqB,SAAS;EACpBpB,kBAAkB,EAAEoB;AACtB,CAAC;AAEDvB,yBAAyB,CAACwB,SAAS,GAAG;EACpC;EACAtB,SAAS,EAAEV,SAAS,CAACiC,MAAM;EAC3B;EACAtB,kBAAkB,EAAEX,SAAS,CAACkC,SAAS,CAAC,CAAClC,SAAS,CAACiC,MAAM,EAAEjC,SAAS,CAACmC,OAAO,CAAC;AAC/E,CAAC;AAED,eAAe3B,yBAAyB"}
|
package/dist/Nav/index.scss
CHANGED
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
.nav-item.show .nav-link {
|
|
56
56
|
color: var(--pgn-color-nav-pills-base-link-active-text);
|
|
57
57
|
background-color: var(--pgn-color-nav-pills-base-link-active-bg);
|
|
58
|
-
border-color: var(--pgn-color-
|
|
58
|
+
border-color: var(--pgn-color-nav-pills-base-link-active-border);
|
|
59
59
|
|
|
60
60
|
&:focus {
|
|
61
61
|
// stylelint-disable-next-line max-line-length
|
|
@@ -104,9 +104,9 @@
|
|
|
104
104
|
background-color: var(--pgn-color-white);
|
|
105
105
|
|
|
106
106
|
&:hover {
|
|
107
|
-
|
|
107
|
+
background-color: var(--pgn-color-nav-pills-inverse-link-bg-active-focus-hover);
|
|
108
108
|
color: var(--pgn-color-nav-pills-inverse-link-text-active-focus);
|
|
109
|
-
|
|
109
|
+
border-color: var(--pgn-color-nav-pills-inverse-link-border-focus-hover);
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
112
|
}
|
|
@@ -122,7 +122,7 @@
|
|
|
122
122
|
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-inverse-link-border-bottom);
|
|
123
123
|
|
|
124
124
|
.dropdown .dropdown-toggle {
|
|
125
|
-
border-bottom: var(--pgn-size-nav-tabs-border-width) solid
|
|
125
|
+
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-inverse-dropdown-border);
|
|
126
126
|
|
|
127
127
|
&:hover {
|
|
128
128
|
border-bottom: none;
|
|
@@ -156,14 +156,14 @@
|
|
|
156
156
|
}
|
|
157
157
|
|
|
158
158
|
.nav-tabs {
|
|
159
|
-
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-base-border);
|
|
159
|
+
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-base-border-base);
|
|
160
160
|
|
|
161
161
|
button.nav-link {
|
|
162
162
|
border: none;
|
|
163
163
|
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-link-border);
|
|
164
164
|
|
|
165
165
|
&.disabled {
|
|
166
|
-
border-color:
|
|
166
|
+
border-color: var(--pgn-color-nav-tabs-base-link-disabled-border);
|
|
167
167
|
}
|
|
168
168
|
}
|
|
169
169
|
|
|
@@ -181,14 +181,14 @@
|
|
|
181
181
|
}
|
|
182
182
|
|
|
183
183
|
&:focus {
|
|
184
|
-
border-bottom: var(--pgn-size-nav-tabs-border-width) solid
|
|
184
|
+
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-base-border-focus);
|
|
185
185
|
|
|
186
186
|
@include nav-tabs-link-focus(var(--pgn-border-color-nav-tabs-link-border-focus));
|
|
187
187
|
}
|
|
188
188
|
|
|
189
189
|
&.disabled {
|
|
190
190
|
color: var(--pgn-color-nav-link-text-disabled);
|
|
191
|
-
background-color:
|
|
191
|
+
background-color: var(--pgn-color-nav-tabs-base-text-disabled);
|
|
192
192
|
}
|
|
193
193
|
}
|
|
194
194
|
|
|
@@ -238,7 +238,7 @@
|
|
|
238
238
|
|
|
239
239
|
.nav-button-group {
|
|
240
240
|
.nav-link {
|
|
241
|
-
border: solid 1px var(--pgn-color-nav-tabs-base-border);
|
|
241
|
+
border: solid 1px var(--pgn-color-nav-tabs-base-border-base);
|
|
242
242
|
|
|
243
243
|
&:first-child {
|
|
244
244
|
@include border-left-radius(var(--pgn-size-nav-pills-border-radius));
|
package/dist/Tabs/index.scss
CHANGED
|
@@ -79,6 +79,14 @@
|
|
|
79
79
|
color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-text-active-hover);
|
|
80
80
|
background-color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-bg-active-hover);
|
|
81
81
|
}
|
|
82
|
+
|
|
83
|
+
&:focus {
|
|
84
|
+
@include nav-tabs-link-focus(
|
|
85
|
+
var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-border-focus),
|
|
86
|
+
var(--pgn-size-nav-tabs-border-radius),
|
|
87
|
+
var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-distance)
|
|
88
|
+
);
|
|
89
|
+
}
|
|
82
90
|
}
|
|
83
91
|
}
|
|
84
92
|
|
package/dist/core.css
CHANGED
|
@@ -56,7 +56,6 @@
|
|
|
56
56
|
--pgn-elevation-tooltip-zindex: 1070;
|
|
57
57
|
--pgn-elevation-sheet-zindex-main: 1032;
|
|
58
58
|
--pgn-elevation-sheet-zindex-backdrop: 1031;
|
|
59
|
-
--pgn-elevation-progress-bar-box-shadow: none;
|
|
60
59
|
--pgn-elevation-product-tour-checkpoint-zindex: 1060;
|
|
61
60
|
--pgn-elevation-popover-zindex: 1060;
|
|
62
61
|
--pgn-elevation-modal-zindex: 1050;
|
|
@@ -159,6 +158,7 @@
|
|
|
159
158
|
--pgn-spacing-toast-container-gutter-lg: 1.25rem;
|
|
160
159
|
--pgn-spacing-toast-padding-y: .25rem;
|
|
161
160
|
--pgn-spacing-toast-padding-x: .75rem;
|
|
161
|
+
--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-distance: 5px;
|
|
162
162
|
--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-padding-x: .625rem;
|
|
163
163
|
--pgn-spacing-tab-inverse-pills-link-dropdown-toggle-padding-x: .625rem;
|
|
164
164
|
--pgn-spacing-tab-more-link-dropdown-toggle-padding-x: .7rem;
|
|
@@ -187,7 +187,7 @@
|
|
|
187
187
|
--pgn-spacing-navbar-toggler-padding-x: .75rem;
|
|
188
188
|
--pgn-spacing-navbar-toggler-padding-y: .25rem;
|
|
189
189
|
--pgn-spacing-navbar-padding-x-nav-link: .5rem;
|
|
190
|
-
--pgn-spacing-nav-link-distance-to-border:
|
|
190
|
+
--pgn-spacing-nav-link-distance-to-border: 4px;
|
|
191
191
|
--pgn-spacing-nav-link-padding-x: 1rem;
|
|
192
192
|
--pgn-spacing-nav-link-padding-y: .5rem;
|
|
193
193
|
--pgn-spacing-modal-dialog-margin: 1.5rem;
|
|
@@ -238,7 +238,7 @@
|
|
|
238
238
|
--pgn-spacing-dropdown-padding-x-base: 0;
|
|
239
239
|
--pgn-spacing-dropdown-spacer: .125rem;
|
|
240
240
|
--pgn-spacing-data-table-footer-position: center;
|
|
241
|
-
--pgn-spacing-data-table-padding-cell: .75rem;
|
|
241
|
+
--pgn-spacing-data-table-padding-cell: .5rem .75rem;
|
|
242
242
|
--pgn-spacing-data-table-padding-small: .5rem;
|
|
243
243
|
--pgn-spacing-data-table-padding-y: .75rem;
|
|
244
244
|
--pgn-spacing-data-table-padding-x: .75rem;
|
|
@@ -401,14 +401,13 @@
|
|
|
401
401
|
--pgn-size-chip-icon: 1.25rem;
|
|
402
402
|
--pgn-size-chip-border-radius: .25rem;
|
|
403
403
|
--pgn-size-carousel-caption-width: 70%;
|
|
404
|
-
--pgn-size-carousel-indicator-height-area-hit:
|
|
404
|
+
--pgn-size-carousel-indicator-height-area-hit: 10px;
|
|
405
405
|
--pgn-size-carousel-indicator-height-base: 3px;
|
|
406
406
|
--pgn-size-carousel-indicator-width: 30px;
|
|
407
407
|
--pgn-size-carousel-control-width-icon: 20px;
|
|
408
408
|
--pgn-size-carousel-control-width-base: 15%;
|
|
409
409
|
--pgn-size-card-logo-height: 4.125rem;
|
|
410
410
|
--pgn-size-card-logo-width: 7.25rem;
|
|
411
|
-
--pgn-size-card-image-border-radius: .3125rem;
|
|
412
411
|
--pgn-size-card-image-vertical-max-height: 140px;
|
|
413
412
|
--pgn-size-card-image-horizontal-width-max: 240px;
|
|
414
413
|
--pgn-size-card-focus-border-width: 2px;
|
|
@@ -618,6 +617,7 @@
|
|
|
618
617
|
--pgn-size-form-input-height-sm: calc(var(--pgn-typography-form-input-line-height-sm) * 1em + var(--pgn-spacing-input-btn-padding-sm-y) * 2 + var(--pgn-size-form-input-height-border));
|
|
619
618
|
--pgn-size-form-input-height-base: calc(var(--pgn-typography-form-input-line-height-base) * 1em + var(--pgn-spacing-form-input-padding-y-base) * 2 + var(--pgn-size-form-input-height-border));
|
|
620
619
|
--pgn-size-dropdown-border-radius-inner: calc(var(--pgn-size-dropdown-border-radius-base) - var(--pgn-size-dropdown-border-width));
|
|
620
|
+
--pgn-size-card-image-border-radius: var(--pgn-size-card-border-radius-base);
|
|
621
621
|
--pgn-size-btn-focus-border-radius: calc(var(--pgn-size-btn-border-radius-base) + var(--pgn-spacing-btn-focus-border-gap));
|
|
622
622
|
--pgn-size-btn-border-width: var(--pgn-size-input-btn-border-width);
|
|
623
623
|
--pgn-typography-form-control-file-font-weight: var(--pgn-typography-form-input-font-weight);
|
|
@@ -8453,7 +8453,7 @@ p > a.brand-link[href]:not(.btn):hover, a.brand-link.inline-link:hover {
|
|
|
8453
8453
|
/**
|
|
8454
8454
|
* IMPORTANT: This file is the result of assembling design tokens
|
|
8455
8455
|
* Do not edit directly
|
|
8456
|
-
* Generated on
|
|
8456
|
+
* Generated on Thu, 16 Nov 2023 10:44:11 GMT
|
|
8457
8457
|
*/
|
|
8458
8458
|
/**
|
|
8459
8459
|
* IMPORTANT: This file is the result of assembling design tokens
|
|
@@ -13521,7 +13521,7 @@ select.form-control {
|
|
|
13521
13521
|
.pgn__tabs.nav-pills .nav-link .nav-item.show .nav-link {
|
|
13522
13522
|
color: var(--pgn-color-nav-pills-base-link-active-text);
|
|
13523
13523
|
background-color: var(--pgn-color-nav-pills-base-link-active-bg);
|
|
13524
|
-
border-color: var(--pgn-color-
|
|
13524
|
+
border-color: var(--pgn-color-nav-pills-base-link-active-border);
|
|
13525
13525
|
}
|
|
13526
13526
|
.pgn__tabs.nav-pills .nav-link.active:focus,
|
|
13527
13527
|
.pgn__tabs.nav-pills .nav-link .nav-item.show .nav-link:focus {
|
|
@@ -13587,7 +13587,9 @@ select.form-control {
|
|
|
13587
13587
|
}
|
|
13588
13588
|
.pgn__tabs.nav-inverse-pills .nav-link.active:focus:hover,
|
|
13589
13589
|
.pgn__tabs.nav-inverse-pills .nav-item.show .nav-link:focus:hover {
|
|
13590
|
+
background-color: var(--pgn-color-nav-pills-inverse-link-bg-active-focus-hover);
|
|
13590
13591
|
color: var(--pgn-color-nav-pills-inverse-link-text-active-focus);
|
|
13592
|
+
border-color: var(--pgn-color-nav-pills-inverse-link-border-focus-hover);
|
|
13591
13593
|
}
|
|
13592
13594
|
.pgn__tabs.nav-inverse-tabs + .tab-content {
|
|
13593
13595
|
color: var(--pgn-color-nav-tabs-inverse-link-tab-content-color);
|
|
@@ -13597,7 +13599,7 @@ select.form-control {
|
|
|
13597
13599
|
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-inverse-link-border-bottom);
|
|
13598
13600
|
}
|
|
13599
13601
|
.pgn__tabs.nav-inverse-tabs .nav-link .dropdown .dropdown-toggle {
|
|
13600
|
-
border-bottom: var(--pgn-size-nav-tabs-border-width) solid
|
|
13602
|
+
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-inverse-dropdown-border);
|
|
13601
13603
|
}
|
|
13602
13604
|
.pgn__tabs.nav-inverse-tabs .nav-link .dropdown .dropdown-toggle:hover {
|
|
13603
13605
|
border-bottom: none;
|
|
@@ -13633,14 +13635,14 @@ select.form-control {
|
|
|
13633
13635
|
background-color: var(--pgn-color-nav-tabs-inverse-link-bg-active-hover);
|
|
13634
13636
|
}
|
|
13635
13637
|
.nav-tabs {
|
|
13636
|
-
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-base-border);
|
|
13638
|
+
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-base-border-base);
|
|
13637
13639
|
}
|
|
13638
13640
|
.nav-tabs button.nav-link {
|
|
13639
13641
|
border: none;
|
|
13640
13642
|
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-link-border);
|
|
13641
13643
|
}
|
|
13642
13644
|
.nav-tabs button.nav-link.disabled {
|
|
13643
|
-
border-color:
|
|
13645
|
+
border-color: var(--pgn-color-nav-tabs-base-link-disabled-border);
|
|
13644
13646
|
}
|
|
13645
13647
|
.nav-tabs .nav-link {
|
|
13646
13648
|
margin-bottom: calc(var(--pgn-size-nav-tabs-border-width) * -1);
|
|
@@ -13654,7 +13656,7 @@ select.form-control {
|
|
|
13654
13656
|
padding-bottom: 0.125rem;
|
|
13655
13657
|
}
|
|
13656
13658
|
.nav-tabs .nav-link:focus {
|
|
13657
|
-
border-bottom: var(--pgn-size-nav-tabs-border-width) solid
|
|
13659
|
+
border-bottom: var(--pgn-size-nav-tabs-border-width) solid var(--pgn-color-nav-tabs-base-border-focus);
|
|
13658
13660
|
position: relative;
|
|
13659
13661
|
outline: 0;
|
|
13660
13662
|
z-index: 200;
|
|
@@ -13671,7 +13673,7 @@ select.form-control {
|
|
|
13671
13673
|
}
|
|
13672
13674
|
.nav-tabs .nav-link.disabled {
|
|
13673
13675
|
color: var(--pgn-color-nav-link-text-disabled);
|
|
13674
|
-
background-color:
|
|
13676
|
+
background-color: var(--pgn-color-nav-tabs-base-text-disabled);
|
|
13675
13677
|
}
|
|
13676
13678
|
.nav-tabs .nav-link.active,
|
|
13677
13679
|
.nav-tabs .nav-item.show .nav-link {
|
|
@@ -13714,7 +13716,7 @@ select.form-control {
|
|
|
13714
13716
|
background-color: var(--pgn-color-nav-pills-base-link-active-bg);
|
|
13715
13717
|
}
|
|
13716
13718
|
.nav-button-group .nav-link {
|
|
13717
|
-
border: solid 1px var(--pgn-color-nav-tabs-base-border);
|
|
13719
|
+
border: solid 1px var(--pgn-color-nav-tabs-base-border-base);
|
|
13718
13720
|
}
|
|
13719
13721
|
.nav-button-group .nav-link:first-child {
|
|
13720
13722
|
border-top-left-radius: var(--pgn-size-nav-pills-border-radius);
|
|
@@ -16588,6 +16590,21 @@ select.form-control {
|
|
|
16588
16590
|
color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-text-active-hover);
|
|
16589
16591
|
background-color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-bg-active-hover);
|
|
16590
16592
|
}
|
|
16593
|
+
.pgn__tabs.nav-inverse-pills .pgn__tab_more.nav-link.active .dropdown .dropdown-toggle:focus {
|
|
16594
|
+
position: relative;
|
|
16595
|
+
outline: 0;
|
|
16596
|
+
z-index: 200;
|
|
16597
|
+
}
|
|
16598
|
+
.pgn__tabs.nav-inverse-pills .pgn__tab_more.nav-link.active .dropdown .dropdown-toggle:focus::before {
|
|
16599
|
+
content: "";
|
|
16600
|
+
position: absolute;
|
|
16601
|
+
top: calc(var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-distance) * -1);
|
|
16602
|
+
right: calc(var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-distance) * -1);
|
|
16603
|
+
bottom: calc(var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-distance) * -1);
|
|
16604
|
+
left: calc(var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-distance) * -1);
|
|
16605
|
+
border: solid var(--pgn-size-nav-tabs-border-width) var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-border-focus);
|
|
16606
|
+
border-radius: var(--pgn-size-nav-tabs-border-radius);
|
|
16607
|
+
}
|
|
16591
16608
|
.pgn__tabs.nav-tabs .pgn__tab_more.nav-link .dropdown .dropdown-toggle {
|
|
16592
16609
|
padding: 0.563rem var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-y);
|
|
16593
16610
|
}
|