@pingux/astro 2.35.0-alpha.1 → 2.35.0-alpha.3
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/lib/cjs/components/Calendar/Calendar.stories.js +48 -19
- package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.test.js +16 -10
- package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentalBreadcrumbUniversal.test.js +10 -0
- package/lib/cjs/hooks/useOverlappingMenuHoverState/index.d.ts +1 -0
- package/lib/cjs/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.d.ts +14 -0
- package/lib/cjs/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.js +14 -6
- package/lib/cjs/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.test.d.ts +1 -0
- package/lib/cjs/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.test.js +2 -2
- package/lib/cjs/utils/designUtils/figmaLinks.js +7 -1
- package/lib/components/Calendar/Calendar.stories.js +45 -15
- package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.test.js +13 -7
- package/lib/components/EnvironmentBreadcrumb/EnvironmentalBreadcrumbUniversal.test.js +8 -0
- package/lib/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.js +14 -7
- package/lib/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.test.js +1 -1
- package/lib/utils/designUtils/figmaLinks.js +7 -1
- package/package.json +1 -1
- package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumbAxe.test.js +0 -7
- package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumbAxe.test.js +0 -4
@@ -14,7 +14,7 @@ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequ
|
|
14
14
|
_Object$defineProperty(exports, "__esModule", {
|
15
15
|
value: true
|
16
16
|
});
|
17
|
-
exports["default"] = exports.UnavailableDates = exports.
|
17
|
+
exports["default"] = exports.UnavailableDates = exports.MinimumDate = exports.MaximumDate = exports.Disabled = exports.DefaultValue = exports.Default = exports.Controlled = exports.Autofocus = void 0;
|
18
18
|
var _some = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/some"));
|
19
19
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
|
20
20
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
@@ -142,18 +142,12 @@ var DefaultValue = function DefaultValue(args) {
|
|
142
142
|
}));
|
143
143
|
};
|
144
144
|
exports.DefaultValue = DefaultValue;
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
return (0, _react2.jsx)(_Calendar["default"], (0, _extends2["default"])({}, args, {
|
151
|
-
"aria-label": "calendar-component-controlled",
|
152
|
-
value: date,
|
153
|
-
onChange: setDate
|
154
|
-
}));
|
145
|
+
DefaultValue.parameters = {
|
146
|
+
design: {
|
147
|
+
type: 'figma',
|
148
|
+
url: _figmaLinks.FIGMA_LINKS.calendar.defaultValue
|
149
|
+
}
|
155
150
|
};
|
156
|
-
exports.Controlled = Controlled;
|
157
151
|
var Disabled = function Disabled(args) {
|
158
152
|
return (0, _react2.jsx)(_Calendar["default"], (0, _extends2["default"])({}, args, {
|
159
153
|
"aria-label": "calendar-component-disabled",
|
@@ -161,13 +155,12 @@ var Disabled = function Disabled(args) {
|
|
161
155
|
}));
|
162
156
|
};
|
163
157
|
exports.Disabled = Disabled;
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
}
|
158
|
+
Disabled.parameters = {
|
159
|
+
design: {
|
160
|
+
type: 'figma',
|
161
|
+
url: _figmaLinks.FIGMA_LINKS.calendar.disabled
|
162
|
+
}
|
169
163
|
};
|
170
|
-
exports.ReadOnly = ReadOnly;
|
171
164
|
var UnavailableDates = function UnavailableDates(args) {
|
172
165
|
var unavailableRanges = [['2022-07-29', '2022-08-05'], ['2022-08-15', '2022-08-20'], ['2022-08-25', '2022-08-26']];
|
173
166
|
// This function is run against each date in the calendar
|
@@ -183,6 +176,12 @@ var UnavailableDates = function UnavailableDates(args) {
|
|
183
176
|
}));
|
184
177
|
};
|
185
178
|
exports.UnavailableDates = UnavailableDates;
|
179
|
+
UnavailableDates.parameters = {
|
180
|
+
design: {
|
181
|
+
type: 'figma',
|
182
|
+
url: _figmaLinks.FIGMA_LINKS.calendar.unavailableDates
|
183
|
+
}
|
184
|
+
};
|
186
185
|
var MinimumDate = function MinimumDate(args) {
|
187
186
|
return (0, _react2.jsx)(_Calendar["default"], (0, _extends2["default"])({}, args, {
|
188
187
|
"aria-label": "calendar-component-min-date",
|
@@ -191,6 +190,12 @@ var MinimumDate = function MinimumDate(args) {
|
|
191
190
|
}));
|
192
191
|
};
|
193
192
|
exports.MinimumDate = MinimumDate;
|
193
|
+
MinimumDate.parameters = {
|
194
|
+
design: {
|
195
|
+
type: 'figma',
|
196
|
+
url: _figmaLinks.FIGMA_LINKS.calendar.minimumDate
|
197
|
+
}
|
198
|
+
};
|
194
199
|
var MaximumDate = function MaximumDate(args) {
|
195
200
|
return (0, _react2.jsx)(_Calendar["default"], (0, _extends2["default"])({}, args, {
|
196
201
|
"aria-label": "calendar-component-max-date",
|
@@ -199,10 +204,34 @@ var MaximumDate = function MaximumDate(args) {
|
|
199
204
|
}));
|
200
205
|
};
|
201
206
|
exports.MaximumDate = MaximumDate;
|
207
|
+
MaximumDate.parameters = {
|
208
|
+
design: {
|
209
|
+
type: 'figma',
|
210
|
+
url: _figmaLinks.FIGMA_LINKS.calendar.maximumDate
|
211
|
+
}
|
212
|
+
};
|
202
213
|
var Autofocus = function Autofocus(args) {
|
203
214
|
return (0, _react2.jsx)(_Calendar["default"], (0, _extends2["default"])({}, args, {
|
204
215
|
"aria-label": "calendar-component",
|
205
216
|
hasAutoFocus: true
|
206
217
|
}));
|
207
218
|
};
|
208
|
-
exports.Autofocus = Autofocus;
|
219
|
+
exports.Autofocus = Autofocus;
|
220
|
+
Autofocus.parameters = {
|
221
|
+
design: {
|
222
|
+
type: 'figma',
|
223
|
+
url: _figmaLinks.FIGMA_LINKS.calendar.autofocus
|
224
|
+
}
|
225
|
+
};
|
226
|
+
var Controlled = function Controlled(args) {
|
227
|
+
var _useState = (0, _react.useState)(null),
|
228
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
229
|
+
date = _useState2[0],
|
230
|
+
setDate = _useState2[1];
|
231
|
+
return (0, _react2.jsx)(_Calendar["default"], (0, _extends2["default"])({}, args, {
|
232
|
+
"aria-label": "calendar-component-controlled",
|
233
|
+
value: date,
|
234
|
+
onChange: setDate
|
235
|
+
}));
|
236
|
+
};
|
237
|
+
exports.Controlled = Controlled;
|
@@ -20,7 +20,7 @@ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequ
|
|
20
20
|
_Object$defineProperty(exports, "__esModule", {
|
21
21
|
value: true
|
22
22
|
});
|
23
|
-
exports.
|
23
|
+
exports.renderSectionsComponent = exports.renderComponent = void 0;
|
24
24
|
var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
|
25
25
|
var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
|
26
26
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/asyncToGenerator"));
|
@@ -91,18 +91,17 @@ var defaultWithSectionsProps = {
|
|
91
91
|
items: itemsWithSections
|
92
92
|
};
|
93
93
|
var onSelectionChange = jest.fn();
|
94
|
-
var
|
95
|
-
return (0,
|
94
|
+
var renderComponent = function renderComponent(props) {
|
95
|
+
return (0, _react2.jsx)(_.OverlayProvider, null, (0, _react2.jsx)(_.EnvironmentBreadcrumb, (0, _extends2["default"])({}, defaultProps, props), function (item) {
|
96
96
|
return (0, _react2.jsx)(_.Item, {
|
97
97
|
key: item.name,
|
98
98
|
"data-testid": item.name
|
99
99
|
}, item.name);
|
100
|
-
}))
|
100
|
+
}));
|
101
101
|
};
|
102
|
-
exports.
|
103
|
-
var
|
104
|
-
|
105
|
-
return (0, _testWrapper.render)((0, _react2.jsx)(_.OverlayProvider, null, (0, _react2.jsx)(_.EnvironmentBreadcrumb, (0, _extends2["default"])({}, defaultWithSectionsProps, props), function (section) {
|
102
|
+
exports.renderComponent = renderComponent;
|
103
|
+
var renderSectionsComponent = function renderSectionsComponent(props) {
|
104
|
+
return (0, _react2.jsx)(_.OverlayProvider, null, (0, _react2.jsx)(_.EnvironmentBreadcrumb, (0, _extends2["default"])({}, defaultWithSectionsProps, props), function (section) {
|
106
105
|
return (
|
107
106
|
// eslint-disable-next-line testing-library/no-node-access
|
108
107
|
(0, _react2.jsx)(_reactStately.Section, {
|
@@ -118,9 +117,16 @@ var getSectionsComponent = function getSectionsComponent() {
|
|
118
117
|
}, item.name);
|
119
118
|
})
|
120
119
|
);
|
121
|
-
}))
|
120
|
+
}));
|
121
|
+
};
|
122
|
+
exports.renderSectionsComponent = renderSectionsComponent;
|
123
|
+
var getComponent = function getComponent(props) {
|
124
|
+
return (0, _testWrapper.render)(renderComponent(props));
|
125
|
+
};
|
126
|
+
var getSectionsComponent = function getSectionsComponent() {
|
127
|
+
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
128
|
+
return (0, _testWrapper.render)(renderSectionsComponent(props));
|
122
129
|
};
|
123
|
-
exports.getSectionsComponent = getSectionsComponent;
|
124
130
|
beforeAll(function () {
|
125
131
|
jest.spyOn(window.HTMLElement.prototype, 'clientWidth', 'get').mockImplementation(function () {
|
126
132
|
return 1000;
|
@@ -0,0 +1,10 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _universalComponentTest = require("../../utils/testUtils/universalComponentTest");
|
4
|
+
var _EnvironmentBreadcrumb = require("./EnvironmentBreadcrumb.test");
|
5
|
+
(0, _universalComponentTest.universalComponentTests)({
|
6
|
+
renderComponent: _EnvironmentBreadcrumb.renderComponent
|
7
|
+
});
|
8
|
+
(0, _universalComponentTest.universalComponentTests)({
|
9
|
+
renderComponent: _EnvironmentBreadcrumb.renderSectionsComponent
|
10
|
+
});
|
@@ -0,0 +1 @@
|
|
1
|
+
export { default } from './useOverlappingMenuHoverState';
|
@@ -0,0 +1,14 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
interface UseOverlappingMenuHoverState {
|
3
|
+
({ listItemRef }: {
|
4
|
+
listItemRef: React.MutableRefObject<HTMLDivElement | undefined>;
|
5
|
+
}): {
|
6
|
+
handleHoverEnd: () => void;
|
7
|
+
handleHoverStart: () => void;
|
8
|
+
handleMenuHoverEnd: () => void;
|
9
|
+
handleMouseMove: (e: MouseEvent) => void;
|
10
|
+
isHovered: boolean;
|
11
|
+
};
|
12
|
+
}
|
13
|
+
declare const useOverlappingMenuHoverState: UseOverlappingMenuHoverState;
|
14
|
+
export default useOverlappingMenuHoverState;
|
@@ -15,18 +15,26 @@ var useOverlappingMenuHoverState = function useOverlappingMenuHoverState(_ref) {
|
|
15
15
|
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
16
16
|
isHovered = _useState2[0],
|
17
17
|
setIsHovered = _useState2[1];
|
18
|
-
var _useState3 = (0, _react.useState)({
|
18
|
+
var _useState3 = (0, _react.useState)({
|
19
|
+
currentPositionX: 0,
|
20
|
+
currentPositionY: 0
|
21
|
+
}),
|
19
22
|
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
|
20
23
|
mousePosition = _useState4[0],
|
21
24
|
setMousePosition = _useState4[1];
|
22
25
|
var handleMenuHoverEnd = function handleMenuHoverEnd() {
|
23
26
|
var currentPositionX = mousePosition.currentPositionX,
|
24
27
|
currentPositionY = mousePosition.currentPositionY;
|
25
|
-
var
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
28
|
+
var _ref2 = listItemRef.current !== undefined ? listItemRef.current.getBoundingClientRect() : {
|
29
|
+
height: 0,
|
30
|
+
right: 0,
|
31
|
+
top: 0,
|
32
|
+
width: 0
|
33
|
+
},
|
34
|
+
height = _ref2.height,
|
35
|
+
right = _ref2.right,
|
36
|
+
top = _ref2.top,
|
37
|
+
width = _ref2.width;
|
30
38
|
|
31
39
|
// Uses the position of the mouse and list item dimensions from listItemRef
|
32
40
|
// to determine if mouse has moved back to ListItem
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -18,7 +18,7 @@ var _react = _interopRequireWildcard(require("react"));
|
|
18
18
|
var _react2 = require("@testing-library/react");
|
19
19
|
var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
|
20
20
|
var _index = require("../../index");
|
21
|
-
var
|
21
|
+
var _index2 = _interopRequireDefault(require("./index"));
|
22
22
|
var _react3 = require("@emotion/react");
|
23
23
|
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
24
24
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
@@ -26,7 +26,7 @@ function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyri
|
|
26
26
|
var IS_HOVERED = 'isHovered';
|
27
27
|
var TestComponent = function TestComponent() {
|
28
28
|
var listItemRef = (0, _react.useRef)();
|
29
|
-
var _useOverlappingMenuHo = (0,
|
29
|
+
var _useOverlappingMenuHo = (0, _index2["default"])({
|
30
30
|
listItemRef: listItemRef
|
31
31
|
}),
|
32
32
|
handleHoverEnd = _useOverlappingMenuHo.handleHoverEnd,
|
@@ -43,7 +43,13 @@ var FIGMA_LINKS = {
|
|
43
43
|
secondaryRightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A788&mode=dev'
|
44
44
|
},
|
45
45
|
calendar: {
|
46
|
-
"default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=
|
46
|
+
"default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=47640-5789&mode=design&t=SZGzEV7PufQjYBN5-4',
|
47
|
+
defaultValue: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-14593&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
48
|
+
disabled: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-15106&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
49
|
+
unavailableDates: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-15681&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
50
|
+
minimumDate: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-16197&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
51
|
+
maximumDate: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-16454&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
52
|
+
autofocus: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-16768&mode=design&t=PX1Q47IuuVvOafDQ-4'
|
47
53
|
},
|
48
54
|
callout: {
|
49
55
|
"default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=14289-33201&t=VgqEexa1CXAXfPpp-0'
|
@@ -128,16 +128,11 @@ export var DefaultValue = function DefaultValue(args) {
|
|
128
128
|
defaultValue: "2022-08-10"
|
129
129
|
}));
|
130
130
|
};
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
return ___EmotionJSX(Calendar, _extends({}, args, {
|
137
|
-
"aria-label": "calendar-component-controlled",
|
138
|
-
value: date,
|
139
|
-
onChange: setDate
|
140
|
-
}));
|
131
|
+
DefaultValue.parameters = {
|
132
|
+
design: {
|
133
|
+
type: 'figma',
|
134
|
+
url: FIGMA_LINKS.calendar.defaultValue
|
135
|
+
}
|
141
136
|
};
|
142
137
|
export var Disabled = function Disabled(args) {
|
143
138
|
return ___EmotionJSX(Calendar, _extends({}, args, {
|
@@ -145,11 +140,11 @@ export var Disabled = function Disabled(args) {
|
|
145
140
|
isDisabled: true
|
146
141
|
}));
|
147
142
|
};
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
}
|
143
|
+
Disabled.parameters = {
|
144
|
+
design: {
|
145
|
+
type: 'figma',
|
146
|
+
url: FIGMA_LINKS.calendar.disabled
|
147
|
+
}
|
153
148
|
};
|
154
149
|
export var UnavailableDates = function UnavailableDates(args) {
|
155
150
|
var unavailableRanges = [['2022-07-29', '2022-08-05'], ['2022-08-15', '2022-08-20'], ['2022-08-25', '2022-08-26']];
|
@@ -165,6 +160,12 @@ export var UnavailableDates = function UnavailableDates(args) {
|
|
165
160
|
isDateUnavailable: isDateUnavailable
|
166
161
|
}));
|
167
162
|
};
|
163
|
+
UnavailableDates.parameters = {
|
164
|
+
design: {
|
165
|
+
type: 'figma',
|
166
|
+
url: FIGMA_LINKS.calendar.unavailableDates
|
167
|
+
}
|
168
|
+
};
|
168
169
|
export var MinimumDate = function MinimumDate(args) {
|
169
170
|
return ___EmotionJSX(Calendar, _extends({}, args, {
|
170
171
|
"aria-label": "calendar-component-min-date",
|
@@ -172,6 +173,12 @@ export var MinimumDate = function MinimumDate(args) {
|
|
172
173
|
defaultDate: "2022-09-14"
|
173
174
|
}));
|
174
175
|
};
|
176
|
+
MinimumDate.parameters = {
|
177
|
+
design: {
|
178
|
+
type: 'figma',
|
179
|
+
url: FIGMA_LINKS.calendar.minimumDate
|
180
|
+
}
|
181
|
+
};
|
175
182
|
export var MaximumDate = function MaximumDate(args) {
|
176
183
|
return ___EmotionJSX(Calendar, _extends({}, args, {
|
177
184
|
"aria-label": "calendar-component-max-date",
|
@@ -179,9 +186,32 @@ export var MaximumDate = function MaximumDate(args) {
|
|
179
186
|
defaultValue: "2022-10-05"
|
180
187
|
}));
|
181
188
|
};
|
189
|
+
MaximumDate.parameters = {
|
190
|
+
design: {
|
191
|
+
type: 'figma',
|
192
|
+
url: FIGMA_LINKS.calendar.maximumDate
|
193
|
+
}
|
194
|
+
};
|
182
195
|
export var Autofocus = function Autofocus(args) {
|
183
196
|
return ___EmotionJSX(Calendar, _extends({}, args, {
|
184
197
|
"aria-label": "calendar-component",
|
185
198
|
hasAutoFocus: true
|
186
199
|
}));
|
200
|
+
};
|
201
|
+
Autofocus.parameters = {
|
202
|
+
design: {
|
203
|
+
type: 'figma',
|
204
|
+
url: FIGMA_LINKS.calendar.autofocus
|
205
|
+
}
|
206
|
+
};
|
207
|
+
export var Controlled = function Controlled(args) {
|
208
|
+
var _useState = useState(null),
|
209
|
+
_useState2 = _slicedToArray(_useState, 2),
|
210
|
+
date = _useState2[0],
|
211
|
+
setDate = _useState2[1];
|
212
|
+
return ___EmotionJSX(Calendar, _extends({}, args, {
|
213
|
+
"aria-label": "calendar-component-controlled",
|
214
|
+
value: date,
|
215
|
+
onChange: setDate
|
216
|
+
}));
|
187
217
|
};
|
@@ -83,17 +83,16 @@ var defaultWithSectionsProps = {
|
|
83
83
|
items: itemsWithSections
|
84
84
|
};
|
85
85
|
var onSelectionChange = jest.fn();
|
86
|
-
export var
|
87
|
-
return
|
86
|
+
export var renderComponent = function renderComponent(props) {
|
87
|
+
return ___EmotionJSX(OverlayProvider, null, ___EmotionJSX(EnvironmentBreadcrumb, _extends({}, defaultProps, props), function (item) {
|
88
88
|
return ___EmotionJSX(Item, {
|
89
89
|
key: item.name,
|
90
90
|
"data-testid": item.name
|
91
91
|
}, item.name);
|
92
|
-
}))
|
92
|
+
}));
|
93
93
|
};
|
94
|
-
export var
|
95
|
-
|
96
|
-
return render(___EmotionJSX(OverlayProvider, null, ___EmotionJSX(EnvironmentBreadcrumb, _extends({}, defaultWithSectionsProps, props), function (section) {
|
94
|
+
export var renderSectionsComponent = function renderSectionsComponent(props) {
|
95
|
+
return ___EmotionJSX(OverlayProvider, null, ___EmotionJSX(EnvironmentBreadcrumb, _extends({}, defaultWithSectionsProps, props), function (section) {
|
97
96
|
return (
|
98
97
|
// eslint-disable-next-line testing-library/no-node-access
|
99
98
|
___EmotionJSX(Section, {
|
@@ -109,7 +108,14 @@ export var getSectionsComponent = function getSectionsComponent() {
|
|
109
108
|
}, item.name);
|
110
109
|
})
|
111
110
|
);
|
112
|
-
}))
|
111
|
+
}));
|
112
|
+
};
|
113
|
+
var getComponent = function getComponent(props) {
|
114
|
+
return render(renderComponent(props));
|
115
|
+
};
|
116
|
+
var getSectionsComponent = function getSectionsComponent() {
|
117
|
+
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
118
|
+
return render(renderSectionsComponent(props));
|
113
119
|
};
|
114
120
|
beforeAll(function () {
|
115
121
|
jest.spyOn(window.HTMLElement.prototype, 'clientWidth', 'get').mockImplementation(function () {
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
|
2
|
+
import { renderComponent, renderSectionsComponent } from './EnvironmentBreadcrumb.test';
|
3
|
+
universalComponentTests({
|
4
|
+
renderComponent: renderComponent
|
5
|
+
});
|
6
|
+
universalComponentTests({
|
7
|
+
renderComponent: renderSectionsComponent
|
8
|
+
});
|
@@ -1,6 +1,5 @@
|
|
1
1
|
import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
|
2
2
|
import { useState } from 'react';
|
3
|
-
|
4
3
|
// Manages the hover state of a ListItem and an overlapping PopoverMenu together
|
5
4
|
var useOverlappingMenuHoverState = function useOverlappingMenuHoverState(_ref) {
|
6
5
|
var listItemRef = _ref.listItemRef;
|
@@ -8,18 +7,26 @@ var useOverlappingMenuHoverState = function useOverlappingMenuHoverState(_ref) {
|
|
8
7
|
_useState2 = _slicedToArray(_useState, 2),
|
9
8
|
isHovered = _useState2[0],
|
10
9
|
setIsHovered = _useState2[1];
|
11
|
-
var _useState3 = useState({
|
10
|
+
var _useState3 = useState({
|
11
|
+
currentPositionX: 0,
|
12
|
+
currentPositionY: 0
|
13
|
+
}),
|
12
14
|
_useState4 = _slicedToArray(_useState3, 2),
|
13
15
|
mousePosition = _useState4[0],
|
14
16
|
setMousePosition = _useState4[1];
|
15
17
|
var handleMenuHoverEnd = function handleMenuHoverEnd() {
|
16
18
|
var currentPositionX = mousePosition.currentPositionX,
|
17
19
|
currentPositionY = mousePosition.currentPositionY;
|
18
|
-
var
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
20
|
+
var _ref2 = listItemRef.current !== undefined ? listItemRef.current.getBoundingClientRect() : {
|
21
|
+
height: 0,
|
22
|
+
right: 0,
|
23
|
+
top: 0,
|
24
|
+
width: 0
|
25
|
+
},
|
26
|
+
height = _ref2.height,
|
27
|
+
right = _ref2.right,
|
28
|
+
top = _ref2.top,
|
29
|
+
width = _ref2.width;
|
23
30
|
|
24
31
|
// Uses the position of the mouse and list item dimensions from listItemRef
|
25
32
|
// to determine if mouse has moved back to ListItem
|
@@ -14,7 +14,7 @@ import React, { useRef } from 'react';
|
|
14
14
|
import { render, screen } from '@testing-library/react';
|
15
15
|
import userEvent from '@testing-library/user-event';
|
16
16
|
import { IconButton, ListItem, Menu, PopoverMenu } from '../../index';
|
17
|
-
import useOverlappingMenuHoverState from './
|
17
|
+
import useOverlappingMenuHoverState from './index';
|
18
18
|
import { jsx as ___EmotionJSX } from "@emotion/react";
|
19
19
|
var IS_HOVERED = 'isHovered';
|
20
20
|
var TestComponent = function TestComponent() {
|
@@ -36,7 +36,13 @@ export var FIGMA_LINKS = {
|
|
36
36
|
secondaryRightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A788&mode=dev'
|
37
37
|
},
|
38
38
|
calendar: {
|
39
|
-
"default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=
|
39
|
+
"default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=47640-5789&mode=design&t=SZGzEV7PufQjYBN5-4',
|
40
|
+
defaultValue: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-14593&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
41
|
+
disabled: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-15106&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
42
|
+
unavailableDates: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-15681&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
43
|
+
minimumDate: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-16197&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
44
|
+
maximumDate: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-16454&mode=design&t=PX1Q47IuuVvOafDQ-4',
|
45
|
+
autofocus: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=46454-16768&mode=design&t=PX1Q47IuuVvOafDQ-4'
|
40
46
|
},
|
41
47
|
callout: {
|
42
48
|
"default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=14289-33201&t=VgqEexa1CXAXfPpp-0'
|
package/package.json
CHANGED
@@ -1,7 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
|
3
|
-
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
4
|
-
var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
|
5
|
-
var _EnvironmentBreadcrumb = require("./EnvironmentBreadcrumb.test");
|
6
|
-
(0, _testAxe["default"])(_EnvironmentBreadcrumb.getComponent);
|
7
|
-
(0, _testAxe["default"])(_EnvironmentBreadcrumb.getSectionsComponent);
|