@papillonarts/components 0.8.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/index.ts +1 -0
- package/build/primer/Alert/Alert.mdx +88 -0
- package/build/primer/Alert/Alert.prop.ts +45 -0
- package/build/primer/Alert/Alert.tsx +101 -0
- package/build/primer/Alert/__tests__/Alert.int.story.tsx +86 -0
- package/build/primer/Alert/__tests__/Alert.int.test.ts +37 -0
- package/build/primer/Alert/index.ts +2 -0
- package/build/primer/Blankslate/Blankslate.mdx +57 -0
- package/build/primer/Blankslate/Blankslate.prop.ts +26 -0
- package/build/primer/Blankslate/Blankslate.tsx +26 -0
- package/build/primer/Blankslate/__tests__/Blankslate.int.story.tsx +43 -0
- package/build/primer/Blankslate/__tests__/Blankslate.int.test.ts +29 -0
- package/build/primer/Blankslate/index.ts +2 -0
- package/build/primer/Breadcrumb/Breadcrumb.mdx +23 -0
- package/build/primer/Breadcrumb/Breadcrumb.prop.ts +28 -0
- package/build/primer/Breadcrumb/Breadcrumb.tsx +57 -0
- package/build/primer/Breadcrumb/__tests__/Breadcrumb.int.story.tsx +40 -0
- package/build/primer/Breadcrumb/__tests__/Breadcrumb.int.test.ts +40 -0
- package/build/primer/Breadcrumb/index.ts +2 -0
- package/build/primer/Button/Button.mdx +239 -0
- package/build/primer/Button/Button.prop.ts +77 -0
- package/build/primer/Button/Button.tsx +91 -0
- package/build/primer/Button/__tests__/Button.int.story.tsx +173 -0
- package/build/primer/Button/__tests__/Button.int.test.ts +191 -0
- package/build/primer/Button/index.ts +2 -0
- package/build/primer/Dropdown/Dropdown.mdx +19 -0
- package/build/primer/Dropdown/Dropdown.prop.ts +33 -0
- package/build/primer/Dropdown/Dropdown.tsx +102 -0
- package/build/primer/Dropdown/__tests__/Dropdown.int.story.tsx +43 -0
- package/build/primer/Dropdown/__tests__/Dropdown.int.test.ts +53 -0
- package/build/primer/Dropdown/index.ts +2 -0
- package/build/primer/ErrorBoundary/ErrorBoundary.prop.ts +5 -0
- package/build/primer/ErrorBoundary/ErrorBoundary.tsx +35 -0
- package/build/primer/ErrorBoundary/__tests__/ErrorBoundary.int.story.tsx +23 -0
- package/build/primer/ErrorBoundary/__tests__/ErrorBoundary.int.test.ts +9 -0
- package/build/primer/ErrorBoundary/index.ts +1 -0
- package/build/primer/Form/Checkbox/Checkbox.prop.ts +34 -0
- package/build/primer/Form/Checkbox/Checkbox.tsx +40 -0
- package/build/primer/Form/Checkbox/__tests__/Checkbox.int.story.tsx +50 -0
- package/build/primer/Form/Checkbox/__tests__/Checkbox.int.test.ts +23 -0
- package/build/primer/Form/Checkbox/index.ts +2 -0
- package/build/primer/Form/Input/Input.prop.ts +43 -0
- package/build/primer/Form/Input/Input.tsx +43 -0
- package/build/primer/Form/Input/__tests__/Input.int.story.tsx +54 -0
- package/build/primer/Form/Input/__tests__/Input.int.test.ts +15 -0
- package/build/primer/Form/Input/index.ts +2 -0
- package/build/primer/Form/Radio/Radio.prop.ts +30 -0
- package/build/primer/Form/Radio/Radio.tsx +38 -0
- package/build/primer/Form/Radio/__tests__/Radio.int.story.tsx +42 -0
- package/build/primer/Form/Radio/__tests__/Radio.int.test.ts +13 -0
- package/build/primer/Form/Radio/index.ts +2 -0
- package/build/primer/Form/index.ts +19 -0
- package/build/primer/Grid/DisplayTable/DisplayTable.prop.ts +21 -0
- package/build/primer/Grid/DisplayTable/DisplayTable.tsx +68 -0
- package/build/primer/Grid/DisplayTable/__tests__/DisplayTable.int.data.ts +289 -0
- package/build/primer/Grid/DisplayTable/__tests__/DisplayTable.int.story.tsx +27 -0
- package/build/primer/Grid/DisplayTable/__tests__/DisplayTable.int.test.ts +9 -0
- package/build/primer/Grid/DisplayTable/index.ts +1 -0
- package/build/primer/Grid/FlexGrid/FlexGrid.prop.ts +59 -0
- package/build/primer/Grid/FlexGrid/FlexGrid.tsx +274 -0
- package/build/primer/Grid/FlexGrid/__tests__/FlexGrid.int.data.ts +289 -0
- package/build/primer/Grid/FlexGrid/__tests__/FlexGrid.int.story.tsx +146 -0
- package/build/primer/Grid/FlexGrid/__tests__/FlexGrid.int.test.ts +46 -0
- package/build/primer/Grid/FlexGrid/index.ts +2 -0
- package/build/primer/Grid/index.ts +9 -0
- package/build/primer/Icon/Icon.part.ts +1289 -0
- package/build/primer/Icon/Icon.prop.ts +1337 -0
- package/build/primer/Icon/Icon.tsx +49 -0
- package/build/primer/Icon/__tests__/Icon.int.story.tsx +58 -0
- package/build/primer/Icon/__tests__/Icon.int.test.ts +13 -0
- package/build/primer/Icon/index.ts +2 -0
- package/build/primer/Label/Label.mdx +13 -0
- package/build/primer/Label/Label.prop.ts +31 -0
- package/build/primer/Label/Label.tsx +27 -0
- package/build/primer/Label/__tests__/Label.int.story.tsx +19 -0
- package/build/primer/Label/__tests__/Label.int.test.ts +9 -0
- package/build/primer/Label/index.ts +1 -0
- package/build/primer/Loader/Loader.mdx +31 -0
- package/build/primer/Loader/Loader.prop.ts +16 -0
- package/build/primer/Loader/Loader.tsx +43 -0
- package/build/primer/Loader/__tests__/Loader.int.story.tsx +34 -0
- package/build/primer/Loader/__tests__/Loader.int.test.ts +21 -0
- package/build/primer/Loader/index.ts +2 -0
- package/build/primer/Navigation/Menu/Menu.prop.ts +26 -0
- package/build/primer/Navigation/Menu/Menu.tsx +42 -0
- package/build/primer/Navigation/Menu/__tests__/Menu.int.story.tsx +55 -0
- package/build/primer/Navigation/Menu/__tests__/Menu.int.test.ts +57 -0
- package/build/primer/Navigation/Menu/index.ts +1 -0
- package/build/primer/Navigation/TabNav/TabNav.prop.ts +39 -0
- package/build/primer/Navigation/TabNav/TabNav.tsx +105 -0
- package/build/primer/Navigation/TabNav/__tests__/TabNav.int.story.tsx +168 -0
- package/build/primer/Navigation/TabNav/__tests__/TabNav.int.test.ts +55 -0
- package/build/primer/Navigation/TabNav/index.ts +2 -0
- package/build/primer/Navigation/UnderlineNav/UnderlineNav.prop.ts +41 -0
- package/build/primer/Navigation/UnderlineNav/UnderlineNav.tsx +106 -0
- package/build/primer/Navigation/UnderlineNav/__tests__/UnderlineNav.int.story.tsx +140 -0
- package/build/primer/Navigation/UnderlineNav/__tests__/UnderlineNav.int.test.ts +81 -0
- package/build/primer/Navigation/UnderlineNav/index.ts +2 -0
- package/build/primer/Navigation/index.ts +12 -0
- package/build/primer/Pagination/PreviousNext/PreviousNext.prop.ts +53 -0
- package/build/primer/Pagination/PreviousNext/PreviousNext.tsx +71 -0
- package/build/primer/Pagination/PreviousNext/__tests__/PreviousNext.int.story.tsx +48 -0
- package/build/primer/Pagination/PreviousNext/__tests__/PreviousNext.int.test.ts +15 -0
- package/build/primer/Pagination/PreviousNext/index.ts +2 -0
- package/build/primer/Pagination/index.ts +6 -0
- package/build/primer/Popover/Popover.mdx +190 -0
- package/build/primer/Popover/Popover.prop.ts +49 -0
- package/build/primer/Popover/Popover.tsx +80 -0
- package/build/primer/Popover/__tests__/Popover.int.story.tsx +216 -0
- package/build/primer/Popover/__tests__/Popover.int.test.ts +71 -0
- package/build/primer/Popover/index.ts +2 -0
- package/build/primer/Progress/Progress.mdx +31 -0
- package/build/primer/Progress/Progress.prop.ts +16 -0
- package/build/primer/Progress/Progress.tsx +19 -0
- package/build/primer/Progress/__tests__/Progress.int.story.tsx +28 -0
- package/build/primer/Progress/__tests__/Progress.int.test.ts +17 -0
- package/build/primer/Progress/index.ts +2 -0
- package/build/primer/Select/Select.mdx +19 -0
- package/build/primer/Select/Select.prop.ts +24 -0
- package/build/primer/Select/Select.tsx +58 -0
- package/build/primer/Select/__tests__/Select.int.story.tsx +38 -0
- package/build/primer/Select/__tests__/Select.int.test.ts +42 -0
- package/build/primer/Select/index.ts +2 -0
- package/build/primer/SelectMenu/SelectMenu.mdx +13 -0
- package/build/primer/SelectMenu/SelectMenu.prop.ts +25 -0
- package/build/primer/SelectMenu/SelectMenu.tsx +68 -0
- package/build/primer/SelectMenu/__tests__/SelectMenu.int.story.tsx +50 -0
- package/build/primer/SelectMenu/__tests__/SelectMenu.int.test.ts +56 -0
- package/build/primer/SelectMenu/index.ts +1 -0
- package/build/primer/Subhead/Subhead.mdx +20 -0
- package/build/primer/Subhead/Subhead.prop.ts +10 -0
- package/build/primer/Subhead/Subhead.tsx +15 -0
- package/build/primer/Subhead/__tests__/Subhead.int.story.tsx +23 -0
- package/build/primer/Subhead/__tests__/Subhead.int.test.ts +13 -0
- package/build/primer/Subhead/index.ts +1 -0
- package/build/primer/Toast/Toast.prop.ts +21 -0
- package/build/primer/Toast/Toast.tsx +38 -0
- package/build/primer/Toast/__tests__/Toast.int.story.tsx +50 -0
- package/build/primer/Toast/__tests__/Toast.int.test.ts +25 -0
- package/build/primer/Toast/index.ts +2 -0
- package/build/primer/index.ts +83 -0
- package/package.json +4 -4
- package/build/index.js +0 -12
- package/build/primer/Alert/Alert.js +0 -121
- package/build/primer/Alert/Alert.prop.js +0 -38
- package/build/primer/Alert/index.js +0 -19
- package/build/primer/Blankslate/Blankslate.js +0 -31
- package/build/primer/Blankslate/Blankslate.prop.js +0 -26
- package/build/primer/Blankslate/index.js +0 -19
- package/build/primer/Breadcrumb/Breadcrumb.js +0 -74
- package/build/primer/Breadcrumb/Breadcrumb.prop.js +0 -29
- package/build/primer/Breadcrumb/index.js +0 -19
- package/build/primer/Button/Button.js +0 -99
- package/build/primer/Button/Button.prop.js +0 -67
- package/build/primer/Button/index.js +0 -49
- package/build/primer/Dropdown/Dropdown.js +0 -104
- package/build/primer/Dropdown/Dropdown.prop.js +0 -34
- package/build/primer/Dropdown/index.js +0 -19
- package/build/primer/ErrorBoundary/ErrorBoundary.js +0 -59
- package/build/primer/ErrorBoundary/ErrorBoundary.prop.js +0 -11
- package/build/primer/ErrorBoundary/index.js +0 -12
- package/build/primer/Form/Checkbox/Checkbox.js +0 -49
- package/build/primer/Form/Checkbox/Checkbox.prop.js +0 -36
- package/build/primer/Form/Checkbox/index.js +0 -19
- package/build/primer/Form/Input/Input.js +0 -56
- package/build/primer/Form/Input/Input.prop.js +0 -43
- package/build/primer/Form/Input/index.js +0 -25
- package/build/primer/Form/Radio/Radio.js +0 -48
- package/build/primer/Form/Radio/Radio.prop.js +0 -34
- package/build/primer/Form/Radio/index.js +0 -19
- package/build/primer/Form/index.js +0 -24
- package/build/primer/Grid/DisplayTable/DisplayTable.js +0 -58
- package/build/primer/Grid/DisplayTable/DisplayTable.prop.js +0 -18
- package/build/primer/Grid/DisplayTable/index.js +0 -12
- package/build/primer/Grid/FlexGrid/FlexGrid.js +0 -244
- package/build/primer/Grid/FlexGrid/FlexGrid.prop.js +0 -49
- package/build/primer/Grid/FlexGrid/index.js +0 -25
- package/build/primer/Grid/index.js +0 -14
- package/build/primer/Icon/Icon.js +0 -70
- package/build/primer/Icon/Icon.part.js +0 -1295
- package/build/primer/Icon/Icon.prop.js +0 -689
- package/build/primer/Icon/index.js +0 -25
- package/build/primer/Label/Label.js +0 -31
- package/build/primer/Label/Label.prop.js +0 -34
- package/build/primer/Label/index.js +0 -12
- package/build/primer/Loader/Loader.js +0 -65
- package/build/primer/Loader/Loader.prop.js +0 -21
- package/build/primer/Loader/index.js +0 -19
- package/build/primer/Navigation/Menu/Menu.js +0 -70
- package/build/primer/Navigation/Menu/Menu.prop.js +0 -28
- package/build/primer/Navigation/Menu/index.js +0 -12
- package/build/primer/Navigation/TabNav/TabNav.js +0 -125
- package/build/primer/Navigation/TabNav/TabNav.prop.js +0 -36
- package/build/primer/Navigation/TabNav/index.js +0 -19
- package/build/primer/Navigation/UnderlineNav/UnderlineNav.js +0 -121
- package/build/primer/Navigation/UnderlineNav/UnderlineNav.prop.js +0 -41
- package/build/primer/Navigation/UnderlineNav/index.js +0 -25
- package/build/primer/Navigation/index.js +0 -17
- package/build/primer/Pagination/PreviousNext/PreviousNext.js +0 -76
- package/build/primer/Pagination/PreviousNext/PreviousNext.prop.js +0 -56
- package/build/primer/Pagination/PreviousNext/index.js +0 -19
- package/build/primer/Pagination/index.js +0 -11
- package/build/primer/Popover/Popover.js +0 -63
- package/build/primer/Popover/Popover.prop.js +0 -41
- package/build/primer/Popover/index.js +0 -25
- package/build/primer/Progress/Progress.js +0 -31
- package/build/primer/Progress/Progress.prop.js +0 -21
- package/build/primer/Progress/index.js +0 -19
- package/build/primer/Select/Select.js +0 -66
- package/build/primer/Select/Select.prop.js +0 -27
- package/build/primer/Select/index.js +0 -19
- package/build/primer/SelectMenu/SelectMenu.js +0 -95
- package/build/primer/SelectMenu/SelectMenu.prop.js +0 -26
- package/build/primer/SelectMenu/index.js +0 -12
- package/build/primer/Subhead/Subhead.js +0 -27
- package/build/primer/Subhead/Subhead.prop.js +0 -16
- package/build/primer/Subhead/index.js +0 -12
- package/build/primer/Toast/Toast.js +0 -55
- package/build/primer/Toast/Toast.prop.js +0 -26
- package/build/primer/Toast/index.js +0 -19
- package/build/primer/index.js +0 -87
- /package/build/primer/Form/Checkbox/{Checkbox.md → Checkbox.mdx} +0 -0
- /package/build/primer/Form/Checkbox/__tests__/__snapshots__/{Checkbox.int.test.js.snap → Checkbox.int.test.ts.snap} +0 -0
- /package/build/primer/Form/Input/{Input.md → Input.mdx} +0 -0
- /package/build/primer/Form/Input/__tests__/__snapshots__/{Input.int.test.js.snap → Input.int.test.ts.snap} +0 -0
- /package/build/primer/Form/Radio/{Radio.md → Radio.mdx} +0 -0
- /package/build/primer/Form/Radio/__tests__/__snapshots__/{Radio.int.test.js.snap → Radio.int.test.ts.snap} +0 -0
- /package/build/primer/Grid/DisplayTable/{DisplayTable.md → DisplayTable.mdx} +0 -0
- /package/build/primer/Grid/DisplayTable/__tests__/__snapshots__/{DisplayTable.int.test.js.snap → DisplayTable.int.test.ts.snap} +0 -0
- /package/build/primer/Grid/FlexGrid/{FlexGrid.md → FlexGrid.mdx} +0 -0
- /package/build/primer/Grid/FlexGrid/__tests__/__snapshots__/{FlexGrid.int.test.js.snap → FlexGrid.int.test.ts.snap} +0 -0
- /package/build/primer/Navigation/Menu/{Menu.md → Menu.mdx} +0 -0
- /package/build/primer/Navigation/Menu/__tests__/__snapshots__/{Menu.int.test.js.snap → Menu.int.test.ts.snap} +0 -0
- /package/build/primer/Navigation/TabNav/{TabNav.md → TabNav.mdx} +0 -0
- /package/build/primer/Navigation/TabNav/__tests__/__snapshots__/{TabNav.int.test.js.snap → TabNav.int.test.ts.snap} +0 -0
- /package/build/primer/Navigation/UnderlineNav/{UnderlineNav.md → UnderlineNav.mdx} +0 -0
- /package/build/primer/Navigation/UnderlineNav/__tests__/__snapshots__/{UnderlineNav.int.test.js.snap → UnderlineNav.int.test.ts.snap} +0 -0
- /package/build/primer/Pagination/PreviousNext/{PreviousNext.md → PreviousNext.mdx} +0 -0
- /package/build/primer/Pagination/PreviousNext/__tests__/__snapshots__/{PreviousNext.int.test.js.snap → PreviousNext.int.test.ts.snap} +0 -0
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "Icon", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function get() {
|
|
9
|
-
return _Icon.Icon;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
Object.defineProperty(exports, "iconName", {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function get() {
|
|
15
|
-
return _Icon2.iconName;
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
Object.defineProperty(exports, "iconSize", {
|
|
19
|
-
enumerable: true,
|
|
20
|
-
get: function get() {
|
|
21
|
-
return _Icon2.iconSize;
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
var _Icon = require("./Icon");
|
|
25
|
-
var _Icon2 = require("./Icon.prop");
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.Label = Label;
|
|
8
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
10
|
-
var _colors = _interopRequireDefault(require("@papillonarts/css/build/primer/utilities/colors.scss"));
|
|
11
|
-
var _Label = require("./Label.prop");
|
|
12
|
-
var _labels = _interopRequireDefault(require("./labels.scss"));
|
|
13
|
-
var _issueLabels = _interopRequireDefault(require("./issue-labels.scss"));
|
|
14
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
function Label(_ref) {
|
|
16
|
-
var _ref$className = _ref.className,
|
|
17
|
-
className = _ref$className === void 0 ? _Label.defaultProps.className : _ref$className,
|
|
18
|
-
text = _ref.text,
|
|
19
|
-
_ref$variant = _ref.variant,
|
|
20
|
-
variant = _ref$variant === void 0 ? _Label.defaultProps.variant : _ref$variant,
|
|
21
|
-
_ref$backgroundColor = _ref.backgroundColor,
|
|
22
|
-
backgroundColor = _ref$backgroundColor === void 0 ? _Label.defaultProps.backgroundColor : _ref$backgroundColor,
|
|
23
|
-
_ref$textColor = _ref.textColor,
|
|
24
|
-
textColor = _ref$textColor === void 0 ? _Label.defaultProps.textColor : _ref$textColor;
|
|
25
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
26
|
-
title: "Label: ".concat(text),
|
|
27
|
-
className: (0, _classnames["default"])(className, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _labels["default"].Label, variant === _Label.labelVariant.regular), _issueLabels["default"].IssueLabel, variant === _Label.labelVariant.issue), _colors["default"]['bg-blue'], backgroundColor === _Label.labelBackgroundColor.blue), _colors["default"]['text-white'], textColor === _Label.labelTextColor.white)),
|
|
28
|
-
children: text
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
Label.propTypes = _Label.propTypes;
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.propTypes = exports.labelVariant = exports.labelTextColor = exports.labelBackgroundColor = exports.defaultProps = void 0;
|
|
7
|
-
var _propTypes = require("prop-types");
|
|
8
|
-
var labelVariant = exports.labelVariant = {
|
|
9
|
-
regular: 'regular',
|
|
10
|
-
state: 'state',
|
|
11
|
-
counter: 'counter',
|
|
12
|
-
issue: 'issue'
|
|
13
|
-
};
|
|
14
|
-
var labelBackgroundColor = exports.labelBackgroundColor = {
|
|
15
|
-
blue: 'blue',
|
|
16
|
-
red: 'red',
|
|
17
|
-
green: 'green'
|
|
18
|
-
};
|
|
19
|
-
var labelTextColor = exports.labelTextColor = {
|
|
20
|
-
white: 'white'
|
|
21
|
-
};
|
|
22
|
-
var propTypes = exports.propTypes = {
|
|
23
|
-
className: _propTypes.string,
|
|
24
|
-
text: _propTypes.string.isRequired,
|
|
25
|
-
variant: (0, _propTypes.oneOf)(Object.keys(labelVariant)),
|
|
26
|
-
backgroundColor: (0, _propTypes.oneOf)(Object.keys(labelBackgroundColor)),
|
|
27
|
-
textColor: (0, _propTypes.oneOf)(Object.keys(labelTextColor))
|
|
28
|
-
};
|
|
29
|
-
var defaultProps = exports.defaultProps = {
|
|
30
|
-
className: null,
|
|
31
|
-
variant: labelVariant.issue,
|
|
32
|
-
backgroundColor: labelBackgroundColor.blue,
|
|
33
|
-
textColor: labelTextColor.white
|
|
34
|
-
};
|
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.Loader = Loader;
|
|
8
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
9
|
-
var _colors = _interopRequireDefault(require("@papillonarts/css/build/primer/utilities/colors.scss"));
|
|
10
|
-
var _margin = _interopRequireDefault(require("@papillonarts/css/build/primer/utilities/margin.scss"));
|
|
11
|
-
var _Loader = require("./Loader.prop");
|
|
12
|
-
var _Loader2 = _interopRequireDefault(require("./Loader.scss"));
|
|
13
|
-
var _branchName = _interopRequireDefault(require("../BranchName/branch-name.scss"));
|
|
14
|
-
var _Button = _interopRequireDefault(require("../Button/Button.scss"));
|
|
15
|
-
var _labels = _interopRequireDefault(require("../Label/labels.scss"));
|
|
16
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
|
-
function Loader(_ref) {
|
|
18
|
-
var _ref$className = _ref.className,
|
|
19
|
-
className = _ref$className === void 0 ? _Loader.defaultProps.className : _ref$className,
|
|
20
|
-
variant = _ref.variant,
|
|
21
|
-
text = _ref.text;
|
|
22
|
-
switch (variant) {
|
|
23
|
-
case _Loader.loaderVariant.heading:
|
|
24
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("h2", {
|
|
25
|
-
className: className,
|
|
26
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
27
|
-
children: text
|
|
28
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
29
|
-
className: _Loader2["default"].AnimatedEllipsis
|
|
30
|
-
})]
|
|
31
|
-
});
|
|
32
|
-
case _Loader.loaderVariant.text:
|
|
33
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
|
|
34
|
-
className: (0, _classnames["default"])(_branchName["default"]['branch-name'], _margin["default"]['mt-2']),
|
|
35
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
36
|
-
children: text
|
|
37
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
38
|
-
className: _Loader2["default"].AnimatedEllipsis
|
|
39
|
-
})]
|
|
40
|
-
});
|
|
41
|
-
case _Loader.loaderVariant.label:
|
|
42
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
|
|
43
|
-
className: (0, _classnames["default"])(_labels["default"].Label, _colors["default"]['bg-blue'], _margin["default"]['mt-3']),
|
|
44
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
45
|
-
children: text
|
|
46
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
47
|
-
className: _Loader2["default"].AnimatedEllipsis
|
|
48
|
-
})]
|
|
49
|
-
});
|
|
50
|
-
case _Loader.loaderVariant.button:
|
|
51
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
|
|
52
|
-
type: "button",
|
|
53
|
-
className: (0, _classnames["default"])(_Button["default"].btn, _margin["default"]['mt-3']),
|
|
54
|
-
"aria-disabled": "true",
|
|
55
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
56
|
-
children: text
|
|
57
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
58
|
-
className: _Loader2["default"].AnimatedEllipsis
|
|
59
|
-
})]
|
|
60
|
-
});
|
|
61
|
-
default:
|
|
62
|
-
return null;
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
Loader.propTypes = _Loader.propTypes;
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.propTypes = exports.loaderVariant = exports.defaultProps = void 0;
|
|
7
|
-
var _propTypes = require("prop-types");
|
|
8
|
-
var loaderVariant = exports.loaderVariant = {
|
|
9
|
-
heading: 'heading',
|
|
10
|
-
text: 'text',
|
|
11
|
-
label: 'label',
|
|
12
|
-
button: 'button'
|
|
13
|
-
};
|
|
14
|
-
var propTypes = exports.propTypes = {
|
|
15
|
-
className: _propTypes.string,
|
|
16
|
-
variant: (0, _propTypes.oneOf)(Object.keys(loaderVariant)).isRequired,
|
|
17
|
-
text: _propTypes.string.isRequired
|
|
18
|
-
};
|
|
19
|
-
var defaultProps = exports.defaultProps = {
|
|
20
|
-
className: null
|
|
21
|
-
};
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "Loader", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function get() {
|
|
9
|
-
return _Loader.Loader;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
Object.defineProperty(exports, "loaderVariant", {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function get() {
|
|
15
|
-
return _Loader2.loaderVariant;
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
var _Loader = require("./Loader");
|
|
19
|
-
var _Loader2 = require("./Loader.prop");
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.Menu = Menu;
|
|
8
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
|
-
var _uuid = require("uuid");
|
|
12
|
-
var _array = require("@papillonarts/library/array");
|
|
13
|
-
var _hooks = require("@papillonarts/library/hooks");
|
|
14
|
-
var _Menu = require("./Menu.prop");
|
|
15
|
-
var _Menu2 = _interopRequireDefault(require("./Menu.scss"));
|
|
16
|
-
var _Icon = require("../../Icon");
|
|
17
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
18
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
19
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
20
|
-
function Menu(_ref) {
|
|
21
|
-
var _ref$className = _ref.className,
|
|
22
|
-
className = _ref$className === void 0 ? _Menu.defaultProps.className : _ref$className,
|
|
23
|
-
_ref$heading = _ref.heading,
|
|
24
|
-
heading = _ref$heading === void 0 ? _Menu.defaultProps.heading : _ref$heading,
|
|
25
|
-
ariaAttr = _ref.ariaAttr,
|
|
26
|
-
items = _ref.items,
|
|
27
|
-
_onClick = _ref.onClick;
|
|
28
|
-
var _useState = (0, _hooks.useState)((0, _array.getIndexItems)(items)),
|
|
29
|
-
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
30
|
-
indexItems = _useState2[0],
|
|
31
|
-
setIndexItems = _useState2[1];
|
|
32
|
-
var label = ariaAttr.label,
|
|
33
|
-
labelledBy = ariaAttr.labelledBy,
|
|
34
|
-
current = ariaAttr.current;
|
|
35
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("nav", {
|
|
36
|
-
className: (0, _classnames["default"])(className, _Menu2["default"].menu),
|
|
37
|
-
"aria-label": label,
|
|
38
|
-
"aria-labelledby": labelledBy,
|
|
39
|
-
children: [heading && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
40
|
-
className: _Menu2["default"]['menu-heading'],
|
|
41
|
-
children: heading
|
|
42
|
-
}), indexItems.map(function (indexItem) {
|
|
43
|
-
var href = indexItem.href,
|
|
44
|
-
icon = indexItem.icon,
|
|
45
|
-
text = indexItem.text,
|
|
46
|
-
html = indexItem.html,
|
|
47
|
-
isSelected = indexItem.isSelected;
|
|
48
|
-
var itemOtherProps = isSelected ? _objectSpread({}, {
|
|
49
|
-
'aria-current': current
|
|
50
|
-
}) : null;
|
|
51
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", _objectSpread(_objectSpread({
|
|
52
|
-
onClick: function onClick(e) {
|
|
53
|
-
e.preventDefault();
|
|
54
|
-
var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
|
|
55
|
-
setIndexItems(newIndexItems);
|
|
56
|
-
_onClick(newIndexItems);
|
|
57
|
-
},
|
|
58
|
-
className: _Menu2["default"]['menu-item'],
|
|
59
|
-
href: href
|
|
60
|
-
}, itemOtherProps), {}, {
|
|
61
|
-
children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
|
|
62
|
-
className: _Menu2["default"].octicon,
|
|
63
|
-
icon: icon,
|
|
64
|
-
size: _Icon.iconSize.small
|
|
65
|
-
}), html || null, text]
|
|
66
|
-
}), (0, _uuid.v1)());
|
|
67
|
-
})]
|
|
68
|
-
});
|
|
69
|
-
}
|
|
70
|
-
Menu.propTypes = _Menu.propTypes;
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.propTypes = exports.defaultProps = void 0;
|
|
7
|
-
var _propTypes = require("prop-types");
|
|
8
|
-
var propTypes = exports.propTypes = {
|
|
9
|
-
className: _propTypes.string,
|
|
10
|
-
heading: _propTypes.string,
|
|
11
|
-
ariaAttr: (0, _propTypes.shape)({
|
|
12
|
-
label: _propTypes.string,
|
|
13
|
-
labelledBy: _propTypes.string,
|
|
14
|
-
current: _propTypes.string
|
|
15
|
-
}).isRequired,
|
|
16
|
-
items: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
|
|
17
|
-
href: _propTypes.string,
|
|
18
|
-
icon: _propTypes.string,
|
|
19
|
-
text: _propTypes.string,
|
|
20
|
-
html: _propTypes.node,
|
|
21
|
-
isSelected: _propTypes.bool
|
|
22
|
-
})).isRequired,
|
|
23
|
-
onClick: _propTypes.func.isRequired
|
|
24
|
-
};
|
|
25
|
-
var defaultProps = exports.defaultProps = {
|
|
26
|
-
className: null,
|
|
27
|
-
heading: null
|
|
28
|
-
};
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.TabNav = TabNav;
|
|
8
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _react = require("react");
|
|
10
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
|
-
var _uuid = require("uuid");
|
|
12
|
-
var _array = require("@papillonarts/library/array");
|
|
13
|
-
var _TabNav = require("./TabNav.prop");
|
|
14
|
-
var _TabNav2 = _interopRequireDefault(require("./TabNav.scss"));
|
|
15
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
16
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
17
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
18
|
-
function TabNav(_ref) {
|
|
19
|
-
var _ref$className = _ref.className,
|
|
20
|
-
className = _ref$className === void 0 ? _TabNav.defaultProps.className : _ref$className,
|
|
21
|
-
ariaAttr = _ref.ariaAttr,
|
|
22
|
-
items = _ref.items,
|
|
23
|
-
_ref$actions = _ref.actions,
|
|
24
|
-
actions = _ref$actions === void 0 ? _TabNav.defaultProps.actions : _ref$actions,
|
|
25
|
-
_onClick = _ref.onClick,
|
|
26
|
-
_ref$children = _ref.children,
|
|
27
|
-
children = _ref$children === void 0 ? _TabNav.defaultProps.children : _ref$children,
|
|
28
|
-
_ref$state = _ref.state,
|
|
29
|
-
state = _ref$state === void 0 ? _TabNav.defaultProps.state : _ref$state;
|
|
30
|
-
if (!items) {
|
|
31
|
-
return null;
|
|
32
|
-
}
|
|
33
|
-
var label = ariaAttr.label,
|
|
34
|
-
current = ariaAttr.current;
|
|
35
|
-
var indexItems = (0, _array.getIndexItems)(items);
|
|
36
|
-
function renderActions() {
|
|
37
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
|
|
38
|
-
children: actions
|
|
39
|
-
}); // eslint-disable-line react/jsx-no-useless-fragment
|
|
40
|
-
}
|
|
41
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
42
|
-
className: (0, _classnames["default"])(className, _TabNav2["default"].tabnav, (0, _defineProperty2["default"])({}, _TabNav2["default"]['tabnav-inactive'], state === _TabNav.tabNavState.inactive)),
|
|
43
|
-
children: [actions && renderActions(), /*#__PURE__*/(0, _jsxRuntime.jsx)("nav", {
|
|
44
|
-
className: _TabNav2["default"]['tabnav-tabs'],
|
|
45
|
-
"aria-label": label,
|
|
46
|
-
children: indexItems.map(function (indexItem) {
|
|
47
|
-
var href = indexItem.href,
|
|
48
|
-
text = indexItem.text,
|
|
49
|
-
link = indexItem.link,
|
|
50
|
-
isSelected = indexItem.isSelected,
|
|
51
|
-
enabled = indexItem.enabled,
|
|
52
|
-
visible = indexItem.visible;
|
|
53
|
-
var itemOtherProps = isSelected ? _objectSpread({}, {
|
|
54
|
-
'aria-current': current
|
|
55
|
-
}) : null;
|
|
56
|
-
if (href && text) {
|
|
57
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("a", _objectSpread(_objectSpread({
|
|
58
|
-
onClick: function onClick() {
|
|
59
|
-
if (!enabled) {
|
|
60
|
-
return;
|
|
61
|
-
}
|
|
62
|
-
var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
|
|
63
|
-
_onClick({
|
|
64
|
-
ariaAttr: ariaAttr,
|
|
65
|
-
items: newIndexItems.map(function (newIndexItem) {
|
|
66
|
-
return function (_ref2) {
|
|
67
|
-
var href = _ref2.href,
|
|
68
|
-
text = _ref2.text,
|
|
69
|
-
isSelected = _ref2.isSelected;
|
|
70
|
-
return {
|
|
71
|
-
href: href,
|
|
72
|
-
text: text,
|
|
73
|
-
isSelected: isSelected,
|
|
74
|
-
enabled: enabled,
|
|
75
|
-
visible: visible
|
|
76
|
-
};
|
|
77
|
-
}(newIndexItem);
|
|
78
|
-
} // eslint-disable-line
|
|
79
|
-
)
|
|
80
|
-
});
|
|
81
|
-
},
|
|
82
|
-
className: _TabNav2["default"]['tabnav-tab'],
|
|
83
|
-
href: href
|
|
84
|
-
}, itemOtherProps), {}, {
|
|
85
|
-
children: text
|
|
86
|
-
}), (0, _uuid.v1)());
|
|
87
|
-
}
|
|
88
|
-
if (link) {
|
|
89
|
-
var Link = link.component;
|
|
90
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Link, _objectSpread(_objectSpread(_objectSpread({
|
|
91
|
-
onClick: function onClick() {
|
|
92
|
-
if (!enabled) {
|
|
93
|
-
return;
|
|
94
|
-
}
|
|
95
|
-
var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
|
|
96
|
-
_onClick({
|
|
97
|
-
ariaAttr: ariaAttr,
|
|
98
|
-
items: newIndexItems.map(function (newIndexItem) {
|
|
99
|
-
return function (_ref3) {
|
|
100
|
-
var link = _ref3.link,
|
|
101
|
-
isSelected = _ref3.isSelected,
|
|
102
|
-
enabled = _ref3.enabled,
|
|
103
|
-
visible = _ref3.visible;
|
|
104
|
-
return {
|
|
105
|
-
link: link,
|
|
106
|
-
isSelected: isSelected,
|
|
107
|
-
enabled: enabled,
|
|
108
|
-
visible: visible
|
|
109
|
-
};
|
|
110
|
-
}(newIndexItem);
|
|
111
|
-
} // eslint-disable-line
|
|
112
|
-
)
|
|
113
|
-
});
|
|
114
|
-
},
|
|
115
|
-
className: (0, _classnames["default"])(className, _TabNav2["default"]['tabnav-tab'], (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _TabNav2["default"]['tabnav-tab-inactive'], enabled === false), _TabNav2["default"]['tabnav-tab-hidden'], visible === false))
|
|
116
|
-
}, itemOtherProps), link.props), {}, {
|
|
117
|
-
children: link.children
|
|
118
|
-
}), (0, _uuid.v1)());
|
|
119
|
-
}
|
|
120
|
-
return null;
|
|
121
|
-
})
|
|
122
|
-
}), children]
|
|
123
|
-
});
|
|
124
|
-
}
|
|
125
|
-
TabNav.propTypes = _TabNav.propTypes;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.tabNavState = exports.propTypes = exports.defaultProps = void 0;
|
|
7
|
-
var _propTypes = require("prop-types");
|
|
8
|
-
var tabNavState = exports.tabNavState = {
|
|
9
|
-
active: 'active',
|
|
10
|
-
inactive: 'inactive'
|
|
11
|
-
};
|
|
12
|
-
var propTypes = exports.propTypes = {
|
|
13
|
-
className: _propTypes.string,
|
|
14
|
-
ariaAttr: (0, _propTypes.shape)({
|
|
15
|
-
label: _propTypes.string,
|
|
16
|
-
current: _propTypes.string
|
|
17
|
-
}).isRequired,
|
|
18
|
-
items: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
|
|
19
|
-
href: _propTypes.string,
|
|
20
|
-
text: _propTypes.string,
|
|
21
|
-
link: _propTypes.shape,
|
|
22
|
-
isSelected: _propTypes.bool,
|
|
23
|
-
enabled: _propTypes.bool,
|
|
24
|
-
visible: _propTypes.bool
|
|
25
|
-
})).isRequired,
|
|
26
|
-
actions: (0, _propTypes.arrayOf)(_propTypes.node),
|
|
27
|
-
onClick: _propTypes.func.isRequired,
|
|
28
|
-
children: _propTypes.node,
|
|
29
|
-
state: (0, _propTypes.oneOf)(Object.keys(tabNavState))
|
|
30
|
-
};
|
|
31
|
-
var defaultProps = exports.defaultProps = {
|
|
32
|
-
className: null,
|
|
33
|
-
actions: null,
|
|
34
|
-
children: null,
|
|
35
|
-
state: tabNavState.active
|
|
36
|
-
};
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "TabNav", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function get() {
|
|
9
|
-
return _TabNav.TabNav;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
Object.defineProperty(exports, "tabNavState", {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function get() {
|
|
15
|
-
return _TabNav2.tabNavState;
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
var _TabNav = require("./TabNav");
|
|
19
|
-
var _TabNav2 = require("./TabNav.prop");
|
|
@@ -1,121 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.UnderlineNav = UnderlineNav;
|
|
8
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
|
-
var _react = require("react");
|
|
11
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
12
|
-
var _uuid = require("uuid");
|
|
13
|
-
var _array = require("@papillonarts/library/array");
|
|
14
|
-
var _hooks = require("@papillonarts/library/hooks");
|
|
15
|
-
var _UnderlineNav = require("./UnderlineNav.prop");
|
|
16
|
-
var _UnderlineNav2 = _interopRequireDefault(require("./UnderlineNav.scss"));
|
|
17
|
-
var _container = _interopRequireDefault(require("../../Layout/container.scss"));
|
|
18
|
-
var _Icon = require("../../Icon");
|
|
19
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
20
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
21
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
22
|
-
function UnderlineNav(_ref) {
|
|
23
|
-
var _ref$className = _ref.className,
|
|
24
|
-
className = _ref$className === void 0 ? _UnderlineNav.defaultProps.className : _ref$className,
|
|
25
|
-
ariaAttr = _ref.ariaAttr,
|
|
26
|
-
items = _ref.items,
|
|
27
|
-
itemType = _ref.itemType,
|
|
28
|
-
_ref$actions = _ref.actions,
|
|
29
|
-
actions = _ref$actions === void 0 ? _UnderlineNav.defaultProps.actions : _ref$actions,
|
|
30
|
-
_ref$align = _ref.align,
|
|
31
|
-
align = _ref$align === void 0 ? _UnderlineNav.defaultProps.align : _ref$align,
|
|
32
|
-
_ref$fullContainer = _ref.fullContainer,
|
|
33
|
-
fullContainer = _ref$fullContainer === void 0 ? _UnderlineNav.defaultProps.fullContainer : _ref$fullContainer,
|
|
34
|
-
_onClick = _ref.onClick;
|
|
35
|
-
var _useState = (0, _hooks.useState)((0, _array.getIndexItems)(items)),
|
|
36
|
-
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
37
|
-
indexItems = _useState2[0],
|
|
38
|
-
setIndexItems = _useState2[1];
|
|
39
|
-
var label = ariaAttr.label,
|
|
40
|
-
selected = ariaAttr.selected,
|
|
41
|
-
current = ariaAttr.current;
|
|
42
|
-
function renderActions() {
|
|
43
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
44
|
-
className: _UnderlineNav2["default"]['UnderlineNav-actions'],
|
|
45
|
-
children: actions
|
|
46
|
-
});
|
|
47
|
-
}
|
|
48
|
-
function renderBody() {
|
|
49
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
|
|
50
|
-
children: [align === _UnderlineNav.underlineNavAlignmentType.right && actions && renderActions(), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
51
|
-
className: _UnderlineNav2["default"]['UnderlineNav-body'],
|
|
52
|
-
role: "tablist",
|
|
53
|
-
children: indexItems.map(function (indexItem) {
|
|
54
|
-
var href = indexItem.href,
|
|
55
|
-
icon = indexItem.icon,
|
|
56
|
-
text = indexItem.text,
|
|
57
|
-
html = indexItem.html,
|
|
58
|
-
isSelected = indexItem.isSelected;
|
|
59
|
-
var anchorOtherProps = isSelected ? _objectSpread({}, {
|
|
60
|
-
'aria-selected': selected
|
|
61
|
-
}) : null;
|
|
62
|
-
var buttonOtherProps = isSelected ? _objectSpread({}, {
|
|
63
|
-
'aria-current': current
|
|
64
|
-
}) : null;
|
|
65
|
-
switch (itemType) {
|
|
66
|
-
case 'button':
|
|
67
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", _objectSpread(_objectSpread({
|
|
68
|
-
onClick: function onClick(e) {
|
|
69
|
-
e.preventDefault();
|
|
70
|
-
var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
|
|
71
|
-
setIndexItems(newIndexItems);
|
|
72
|
-
_onClick(newIndexItems);
|
|
73
|
-
},
|
|
74
|
-
className: _UnderlineNav2["default"]['UnderlineNav-item'],
|
|
75
|
-
role: "tab",
|
|
76
|
-
type: "button",
|
|
77
|
-
href: href
|
|
78
|
-
}, anchorOtherProps), {}, {
|
|
79
|
-
children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
|
|
80
|
-
className: _UnderlineNav2["default"]['UnderlineNav-octicon'],
|
|
81
|
-
icon: icon,
|
|
82
|
-
size: _Icon.iconSize.small
|
|
83
|
-
}), html || null, text]
|
|
84
|
-
}), (0, _uuid.v1)());
|
|
85
|
-
case 'a':
|
|
86
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", _objectSpread(_objectSpread({
|
|
87
|
-
onClick: function onClick(e) {
|
|
88
|
-
e.preventDefault();
|
|
89
|
-
var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
|
|
90
|
-
setIndexItems(newIndexItems);
|
|
91
|
-
_onClick(newIndexItems);
|
|
92
|
-
},
|
|
93
|
-
className: _UnderlineNav2["default"]['UnderlineNav-item'],
|
|
94
|
-
href: href
|
|
95
|
-
}, buttonOtherProps), {}, {
|
|
96
|
-
children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
|
|
97
|
-
className: _UnderlineNav2["default"]['UnderlineNav-octicon'],
|
|
98
|
-
icon: icon,
|
|
99
|
-
size: _Icon.iconSize.small
|
|
100
|
-
}), html || null, text]
|
|
101
|
-
}), (0, _uuid.v1)());
|
|
102
|
-
default:
|
|
103
|
-
return null;
|
|
104
|
-
}
|
|
105
|
-
})
|
|
106
|
-
}), align === _UnderlineNav.underlineNavAlignmentType.left && actions && renderActions()]
|
|
107
|
-
});
|
|
108
|
-
}
|
|
109
|
-
function renderBodyFullContainer() {
|
|
110
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
111
|
-
className: (0, _classnames["default"])(_container["default"]['container-lg'], _UnderlineNav2["default"]['UnderlineNav-container']),
|
|
112
|
-
children: renderBody()
|
|
113
|
-
});
|
|
114
|
-
}
|
|
115
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("nav", {
|
|
116
|
-
className: (0, _classnames["default"])(className, _UnderlineNav2["default"].UnderlineNav, (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _UnderlineNav2["default"]['UnderlineNav--right'], align === _UnderlineNav.underlineNavAlignmentType.right), _UnderlineNav2["default"]['UnderlineNav--full'], fullContainer === true)),
|
|
117
|
-
"aria-label": label,
|
|
118
|
-
children: [fullContainer === false && renderBody(), fullContainer === true && renderBodyFullContainer()]
|
|
119
|
-
});
|
|
120
|
-
}
|
|
121
|
-
UnderlineNav.propTypes = _UnderlineNav.propTypes;
|