@pingux/astro 2.50.0 → 2.51.0-alpha.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/lib/cjs/components/ListView/ListView.js +26 -10
- package/lib/cjs/components/ListView/ListView.stories.js +179 -13
- package/lib/cjs/components/ListView/ListView.test.js +300 -35
- package/lib/cjs/components/ListView/ListViewExpandableItem.js +100 -0
- package/lib/cjs/components/ListView/ListViewFocusWrapper.js +117 -0
- package/lib/cjs/components/ListView/ListViewItem.js +24 -16
- package/lib/cjs/components/ListViewItem/ListViewItem.styles.js +34 -1
- package/lib/cjs/hooks/useExpandableListViewItem/index.d.ts +1 -0
- package/lib/cjs/hooks/useExpandableListViewItem/index.js +14 -0
- package/lib/cjs/hooks/useExpandableListViewItem/useExpandableListViewItem.d.ts +51 -0
- package/lib/cjs/hooks/useExpandableListViewItem/useExpandableListViewItem.js +237 -0
- package/lib/components/ListView/ListView.js +26 -10
- package/lib/components/ListView/ListView.stories.js +177 -14
- package/lib/components/ListView/ListView.test.js +300 -35
- package/lib/components/ListView/ListViewExpandableItem.js +86 -0
- package/lib/components/ListView/ListViewFocusWrapper.js +102 -0
- package/lib/components/ListView/ListViewItem.js +25 -17
- package/lib/components/ListViewItem/ListViewItem.styles.js +34 -1
- package/lib/hooks/useExpandableListViewItem/index.js +1 -0
- package/lib/hooks/useExpandableListViewItem/useExpandableListViewItem.js +229 -0
- package/package.json +6 -2
@@ -10,8 +10,15 @@ var _Object$setPrototypeOf = require("@babel/runtime-corejs3/core-js-stable/obje
|
|
10
10
|
var _Promise = require("@babel/runtime-corejs3/core-js-stable/promise");
|
11
11
|
var _reverseInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/reverse");
|
12
12
|
var _sliceInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/slice");
|
13
|
+
var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
|
14
|
+
var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
|
15
|
+
var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
|
16
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
17
|
+
var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
|
18
|
+
var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
|
13
19
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
14
20
|
var _set = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set"));
|
21
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
15
22
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/asyncToGenerator"));
|
16
23
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
17
24
|
var _react = _interopRequireDefault(require("react"));
|
@@ -22,10 +29,14 @@ var _lodash = _interopRequireDefault(require("lodash"));
|
|
22
29
|
var _loadingStates = _interopRequireDefault(require("../../utils/devUtils/constants/loadingStates"));
|
23
30
|
var _testWrapper = require("../../utils/testUtils/testWrapper");
|
24
31
|
var _universalComponentTest = require("../../utils/testUtils/universalComponentTest");
|
32
|
+
var _Button = _interopRequireDefault(require("../Button"));
|
25
33
|
var _CheckboxField = _interopRequireDefault(require("../CheckboxField"));
|
26
34
|
var _ListView = _interopRequireDefault(require("./ListView"));
|
35
|
+
var _ListViewFocusWrapper = require("./ListViewFocusWrapper");
|
27
36
|
var _react2 = require("@emotion/react");
|
28
|
-
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = _Object$defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof _Symbol ? _Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return _Object$defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = _Object$create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = _Object$getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(IteratorPrototype); function defineIteratorMethods(prototype) { var _context8; _forEachInstanceProperty(_context8 = ["next", "throw", "return"]).call(_context8, function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], _forEachInstanceProperty(tryLocsList).call(tryLocsList, pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = _Object$create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = _Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) keys.push(key); return _reverseInstanceProperty(keys).call(keys), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { var _context9; if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, _forEachInstanceProperty(_context9 = this.tryEntries).call(_context9, resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+_sliceInstanceProperty(name).call(name, 1)) && (this[name] = undefined); }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, "catch": function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
37
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
38
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context15, _context16; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context15 = ownKeys(Object(source), !0)).call(_context15, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context16 = ownKeys(Object(source))).call(_context16, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
|
39
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = _Object$defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof _Symbol ? _Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return _Object$defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = _Object$create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = _Object$getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(IteratorPrototype); function defineIteratorMethods(prototype) { var _context13; _forEachInstanceProperty(_context13 = ["next", "throw", "return"]).call(_context13, function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], _forEachInstanceProperty(tryLocsList).call(tryLocsList, pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = _Object$create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = _Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) keys.push(key); return _reverseInstanceProperty(keys).call(keys), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { var _context14; if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, _forEachInstanceProperty(_context14 = this.tryEntries).call(_context14, resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+_sliceInstanceProperty(name).call(name, 1)) && (this[name] = undefined); }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, "catch": function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
29
40
|
var items = [{
|
30
41
|
key: 'Aardvark',
|
31
42
|
name: 'Aardvark',
|
@@ -44,6 +55,19 @@ var defaultProps = {
|
|
44
55
|
label: 'Test Label',
|
45
56
|
'data-testid': testId
|
46
57
|
};
|
58
|
+
var stopPropagation = jest.fn();
|
59
|
+
var preventDefault = jest.fn();
|
60
|
+
var focusNext = jest.fn();
|
61
|
+
var focusPrevious = jest.fn();
|
62
|
+
var setIsFocusEscaped = jest.fn();
|
63
|
+
var testEvent = {
|
64
|
+
stopPropagation: stopPropagation,
|
65
|
+
preventDefault: preventDefault
|
66
|
+
};
|
67
|
+
var focusManager = {
|
68
|
+
focusNext: focusNext,
|
69
|
+
focusPrevious: focusPrevious
|
70
|
+
};
|
47
71
|
beforeAll(function () {
|
48
72
|
jest.spyOn(window.HTMLElement.prototype, 'clientWidth', 'get').mockImplementation(function () {
|
49
73
|
return 1000;
|
@@ -86,20 +110,34 @@ var getComponent = function getComponent() {
|
|
86
110
|
}, item.name));
|
87
111
|
})));
|
88
112
|
};
|
89
|
-
var
|
113
|
+
var getComponentExpandable = function getComponentExpandable() {
|
90
114
|
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
91
115
|
var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
92
116
|
_ref2$renderFn = _ref2.renderFn,
|
93
117
|
renderFn = _ref2$renderFn === void 0 ? _testWrapper.render : _ref2$renderFn;
|
118
|
+
return renderFn((0, _react2.jsx)(_ListView["default"], (0, _extends2["default"])({}, defaultProps, props, {
|
119
|
+
items: items
|
120
|
+
}), function (item) {
|
121
|
+
return (0, _react2.jsx)(_reactStately.Item, {
|
122
|
+
key: item.name,
|
123
|
+
textValue: item.name
|
124
|
+
}, (0, _react2.jsx)("h1", null, item.name), (0, _react2.jsx)(_Button["default"], null, "I am a button"));
|
125
|
+
}));
|
126
|
+
};
|
127
|
+
var getComponentEmpty = function getComponentEmpty() {
|
128
|
+
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
129
|
+
var _ref3 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
130
|
+
_ref3$renderFn = _ref3.renderFn,
|
131
|
+
renderFn = _ref3$renderFn === void 0 ? _testWrapper.render : _ref3$renderFn;
|
94
132
|
return renderFn((0, _react2.jsx)(_reactAria.FocusScope, {
|
95
133
|
restoreFocus: true
|
96
134
|
}, (0, _react2.jsx)(_ListView["default"], (0, _extends2["default"])({}, defaultProps, props))));
|
97
135
|
};
|
98
136
|
var getComponentWithCheckbox = function getComponentWithCheckbox() {
|
99
137
|
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
100
|
-
var
|
101
|
-
|
102
|
-
renderFn =
|
138
|
+
var _ref4 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
139
|
+
_ref4$renderFn = _ref4.renderFn,
|
140
|
+
renderFn = _ref4$renderFn === void 0 ? _testWrapper.render : _ref4$renderFn;
|
103
141
|
return renderFn((0, _react2.jsx)(_reactAria.FocusScope, {
|
104
142
|
restoreFocus: true
|
105
143
|
}, (0, _react2.jsx)(_ListView["default"], (0, _extends2["default"])({}, defaultProps, props, {
|
@@ -190,29 +228,52 @@ test('navigating to a disabled key will not apply the isFocused class', /*#__PUR
|
|
190
228
|
}
|
191
229
|
}, _callee2);
|
192
230
|
})));
|
193
|
-
test('
|
194
|
-
var
|
231
|
+
test('navigating to a disabled key will not apply the isFocused class', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
|
232
|
+
var listView, options;
|
195
233
|
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
|
196
234
|
while (1) switch (_context3.prev = _context3.next) {
|
235
|
+
case 0:
|
236
|
+
getComponent({
|
237
|
+
selectionMode: 'expansion',
|
238
|
+
disabledKeys: ['Kangaroo']
|
239
|
+
});
|
240
|
+
listView = _testWrapper.screen.getByTestId(testId); // Open the list arrow down to the second option,
|
241
|
+
// and ensure that it is focused, and then selected after enter is pressed
|
242
|
+
_userEvent["default"].tab();
|
243
|
+
_userEvent["default"].type(listView, '{arrowdown}', {
|
244
|
+
skipClick: true
|
245
|
+
});
|
246
|
+
options = _testWrapper.screen.getAllByRole('gridcell');
|
247
|
+
expect(options[1]).not.toHaveClass('is-focused');
|
248
|
+
case 6:
|
249
|
+
case "end":
|
250
|
+
return _context3.stop();
|
251
|
+
}
|
252
|
+
}, _callee3);
|
253
|
+
})));
|
254
|
+
test('clicking an item on the list selects the item', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
|
255
|
+
var options, updatedOption;
|
256
|
+
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
|
257
|
+
while (1) switch (_context4.prev = _context4.next) {
|
197
258
|
case 0:
|
198
259
|
getComponent();
|
199
260
|
options = _testWrapper.screen.getByTestId(items[1].name);
|
200
261
|
_userEvent["default"].click(options);
|
201
|
-
|
262
|
+
_context4.next = 5;
|
202
263
|
return _testWrapper.screen.findAllByRole('gridcell');
|
203
264
|
case 5:
|
204
|
-
updatedOption =
|
265
|
+
updatedOption = _context4.sent;
|
205
266
|
expect(updatedOption[1]).toHaveClass('is-selected');
|
206
267
|
case 7:
|
207
268
|
case "end":
|
208
|
-
return
|
269
|
+
return _context4.stop();
|
209
270
|
}
|
210
|
-
},
|
271
|
+
}, _callee4);
|
211
272
|
})));
|
212
|
-
test('clicking an item fires "onSelectionChange" handler and returns Set with keys of items', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function
|
273
|
+
test('clicking an item fires "onSelectionChange" handler and returns Set with keys of items', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
|
213
274
|
var expectedResult, onSelectionChange, option1, selectedItems;
|
214
|
-
return _regeneratorRuntime().wrap(function
|
215
|
-
while (1) switch (
|
275
|
+
return _regeneratorRuntime().wrap(function _callee5$(_context5) {
|
276
|
+
while (1) switch (_context5.prev = _context5.next) {
|
216
277
|
case 0:
|
217
278
|
expectedResult = new _set["default"]();
|
218
279
|
expectedResult.add(items[1].key);
|
@@ -227,9 +288,9 @@ test('clicking an item fires "onSelectionChange" handler and returns Set with ke
|
|
227
288
|
expect(_lodash["default"].isEqual(expectedResult, selectedItems)).toBeTruthy();
|
228
289
|
case 9:
|
229
290
|
case "end":
|
230
|
-
return
|
291
|
+
return _context5.stop();
|
231
292
|
}
|
232
|
-
},
|
293
|
+
}, _callee5);
|
233
294
|
})));
|
234
295
|
test('renders loader, if a loader component is passed in, and state is loading', function () {
|
235
296
|
getComponent({
|
@@ -238,6 +299,18 @@ test('renders loader, if a loader component is passed in, and state is loading',
|
|
238
299
|
var loader = _testWrapper.screen.getByRole('alert');
|
239
300
|
expect(loader).toBeInTheDocument();
|
240
301
|
});
|
302
|
+
test('renders loader, if a loader component is passed in, and state is loading', function () {
|
303
|
+
getComponent({
|
304
|
+
loadingState: _loadingStates["default"].LOADING
|
305
|
+
});
|
306
|
+
var listView = _testWrapper.screen.getByTestId(testId);
|
307
|
+
_userEvent["default"].tab();
|
308
|
+
_userEvent["default"].type(listView, '{arrowdown}', {
|
309
|
+
skipClick: true
|
310
|
+
});
|
311
|
+
var loaders = _testWrapper.screen.getAllByRole('alert');
|
312
|
+
expect(loaders).toHaveLength(2);
|
313
|
+
});
|
241
314
|
test('renders loader, if a loader component is passed in, and state is loadingMore', function () {
|
242
315
|
getComponent({
|
243
316
|
loadingState: _loadingStates["default"].LOADING_MORE
|
@@ -262,31 +335,31 @@ test('Item accepts a data-id and the data-id can be found in the DOM', function
|
|
262
335
|
expect(options).toHaveLength(items.length);
|
263
336
|
expect(options[0]).toHaveAttribute('data-id', items[0].name);
|
264
337
|
});
|
265
|
-
test('selectionMode "none" disallows to select item', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function
|
338
|
+
test('selectionMode "none" disallows to select item', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
|
266
339
|
var option1, updatedOption;
|
267
|
-
return _regeneratorRuntime().wrap(function
|
268
|
-
while (1) switch (
|
340
|
+
return _regeneratorRuntime().wrap(function _callee6$(_context6) {
|
341
|
+
while (1) switch (_context6.prev = _context6.next) {
|
269
342
|
case 0:
|
270
343
|
getComponent({
|
271
344
|
selectionMode: 'none'
|
272
345
|
});
|
273
346
|
option1 = _testWrapper.screen.getByTestId(items[1].name);
|
274
347
|
_userEvent["default"].click(option1);
|
275
|
-
|
348
|
+
_context6.next = 5;
|
276
349
|
return _testWrapper.screen.findAllByRole('gridcell');
|
277
350
|
case 5:
|
278
|
-
updatedOption =
|
351
|
+
updatedOption = _context6.sent;
|
279
352
|
expect(updatedOption[1]).not.toHaveClass('is-selected');
|
280
353
|
case 7:
|
281
354
|
case "end":
|
282
|
-
return
|
355
|
+
return _context6.stop();
|
283
356
|
}
|
284
|
-
},
|
357
|
+
}, _callee6);
|
285
358
|
})));
|
286
|
-
test('selectionMode "multiple" allows to select more than one item', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function
|
359
|
+
test('selectionMode "multiple" allows to select more than one item', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7() {
|
287
360
|
var option1, option2, updatedOption;
|
288
|
-
return _regeneratorRuntime().wrap(function
|
289
|
-
while (1) switch (
|
361
|
+
return _regeneratorRuntime().wrap(function _callee7$(_context7) {
|
362
|
+
while (1) switch (_context7.prev = _context7.next) {
|
290
363
|
case 0:
|
291
364
|
getComponent({
|
292
365
|
selectionMode: 'multiple'
|
@@ -295,22 +368,22 @@ test('selectionMode "multiple" allows to select more than one item', /*#__PURE__
|
|
295
368
|
_userEvent["default"].click(option1);
|
296
369
|
option2 = _testWrapper.screen.getByTestId(items[2].name);
|
297
370
|
_userEvent["default"].click(option2);
|
298
|
-
|
371
|
+
_context7.next = 7;
|
299
372
|
return _testWrapper.screen.findAllByRole('gridcell');
|
300
373
|
case 7:
|
301
|
-
updatedOption =
|
374
|
+
updatedOption = _context7.sent;
|
302
375
|
expect(updatedOption[1]).toHaveClass('is-selected');
|
303
376
|
expect(updatedOption[2]).toHaveClass('is-selected');
|
304
377
|
case 10:
|
305
378
|
case "end":
|
306
|
-
return
|
379
|
+
return _context7.stop();
|
307
380
|
}
|
308
|
-
},
|
381
|
+
}, _callee7);
|
309
382
|
})));
|
310
|
-
test('when user navigates with tab and arrows keys, onFocus is called and the is-focused class is applied', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function
|
383
|
+
test('when user navigates with tab and arrows keys, onFocus is called and the is-focused class is applied', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
|
311
384
|
var onFocus, listView, options;
|
312
|
-
return _regeneratorRuntime().wrap(function
|
313
|
-
while (1) switch (
|
385
|
+
return _regeneratorRuntime().wrap(function _callee8$(_context8) {
|
386
|
+
while (1) switch (_context8.prev = _context8.next) {
|
314
387
|
case 0:
|
315
388
|
onFocus = jest.fn();
|
316
389
|
getComponent({
|
@@ -327,9 +400,9 @@ test('when user navigates with tab and arrows keys, onFocus is called and the is
|
|
327
400
|
expect(onFocus).toHaveBeenCalled();
|
328
401
|
case 9:
|
329
402
|
case "end":
|
330
|
-
return
|
403
|
+
return _context8.stop();
|
331
404
|
}
|
332
|
-
},
|
405
|
+
}, _callee8);
|
333
406
|
})));
|
334
407
|
test('list view not receive focus when click on checkbox', function () {
|
335
408
|
getComponentWithCheckbox();
|
@@ -352,7 +425,30 @@ test('list view reset hover on item when scroll', function () {
|
|
352
425
|
}
|
353
426
|
});
|
354
427
|
expect(listItem[0]).not.toHaveClass('is-hovered');
|
428
|
+
_userEvent["default"].hover(listItem[1]);
|
429
|
+
expect(listItem[0]).not.toHaveClass('is-hovered');
|
355
430
|
});
|
431
|
+
test('list view expandable reset hover on item when scroll', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee9() {
|
432
|
+
var listItem, listRow;
|
433
|
+
return _regeneratorRuntime().wrap(function _callee9$(_context9) {
|
434
|
+
while (1) switch (_context9.prev = _context9.next) {
|
435
|
+
case 0:
|
436
|
+
getComponentExpandable({
|
437
|
+
selectionMode: 'expansion'
|
438
|
+
});
|
439
|
+
// const listView = screen.getAllByRole('grid');
|
440
|
+
listItem = _testWrapper.screen.getAllByRole('gridcell');
|
441
|
+
listRow = _testWrapper.screen.getAllByRole('row');
|
442
|
+
expect(listItem[0]).not.toHaveClass('is-hovered');
|
443
|
+
_userEvent["default"].hover(listRow[0]);
|
444
|
+
_userEvent["default"].hover(listRow[1]);
|
445
|
+
expect(listItem[0]).not.toHaveClass('is-hovered');
|
446
|
+
case 7:
|
447
|
+
case "end":
|
448
|
+
return _context9.stop();
|
449
|
+
}
|
450
|
+
}, _callee9);
|
451
|
+
})));
|
356
452
|
test('list view item should not receive focus when selectionMode is "none"', function () {
|
357
453
|
var onFocus = jest.fn();
|
358
454
|
getComponent({
|
@@ -373,4 +469,173 @@ test('list view item should receive focus when selectionMode is default or a val
|
|
373
469
|
_userEvent["default"].tab();
|
374
470
|
expect(onFocus).toHaveBeenCalled();
|
375
471
|
expect(options[0]).toHaveClass('is-focused');
|
472
|
+
});
|
473
|
+
test('selectionMode "expanded" cells render expandable list items, and can be expanded, and collapsed', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee10() {
|
474
|
+
var options, updatedOptions, updatedOptions1;
|
475
|
+
return _regeneratorRuntime().wrap(function _callee10$(_context10) {
|
476
|
+
while (1) switch (_context10.prev = _context10.next) {
|
477
|
+
case 0:
|
478
|
+
getComponent({
|
479
|
+
selectionMode: 'expansion'
|
480
|
+
});
|
481
|
+
options = _testWrapper.screen.getAllByRole('gridcell');
|
482
|
+
expect(options[0]).toHaveAttribute('aria-expanded', 'false');
|
483
|
+
_userEvent["default"].click(options[0]);
|
484
|
+
_context10.next = 6;
|
485
|
+
return _testWrapper.screen.findAllByRole('gridcell');
|
486
|
+
case 6:
|
487
|
+
updatedOptions = _context10.sent;
|
488
|
+
expect(updatedOptions[0]).toHaveAttribute('aria-expanded', 'true');
|
489
|
+
_userEvent["default"].click(options[0]);
|
490
|
+
_context10.next = 11;
|
491
|
+
return _testWrapper.screen.findAllByRole('gridcell');
|
492
|
+
case 11:
|
493
|
+
updatedOptions1 = _context10.sent;
|
494
|
+
expect(updatedOptions1[0]).toHaveAttribute('aria-expanded', 'false');
|
495
|
+
case 13:
|
496
|
+
case "end":
|
497
|
+
return _context10.stop();
|
498
|
+
}
|
499
|
+
}, _callee10);
|
500
|
+
})));
|
501
|
+
test('should navigate to expandable listitems with keyboard ', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee11() {
|
502
|
+
var option, row, focusContainer, button;
|
503
|
+
return _regeneratorRuntime().wrap(function _callee11$(_context11) {
|
504
|
+
while (1) switch (_context11.prev = _context11.next) {
|
505
|
+
case 0:
|
506
|
+
getComponentExpandable({
|
507
|
+
selectionMode: 'expansion'
|
508
|
+
});
|
509
|
+
option = _testWrapper.screen.getAllByRole('gridcell')[0];
|
510
|
+
row = _testWrapper.screen.getAllByRole('row')[0];
|
511
|
+
_userEvent["default"].tab();
|
512
|
+
_userEvent["default"].type(option, '{enter}', {
|
513
|
+
skipClick: true
|
514
|
+
});
|
515
|
+
_userEvent["default"].type(option, '{arrowright}', {
|
516
|
+
skipClick: true
|
517
|
+
});
|
518
|
+
focusContainer = _testWrapper.screen.getAllByTestId('focuscontainer')[0];
|
519
|
+
expect(focusContainer).toHaveClass('is-focused');
|
520
|
+
_userEvent["default"].type(row, '{arrowright}', {
|
521
|
+
skipClick: true
|
522
|
+
});
|
523
|
+
_userEvent["default"].type(row, '{arrowright}', {
|
524
|
+
skipClick: true
|
525
|
+
});
|
526
|
+
_userEvent["default"].type(option, '{arrowleft}', {
|
527
|
+
skipClick: true
|
528
|
+
});
|
529
|
+
_userEvent["default"].type(option, '{arrowleft}', {
|
530
|
+
skipClick: true
|
531
|
+
});
|
532
|
+
_userEvent["default"].type(focusContainer, '{enter}', {
|
533
|
+
skipClick: true
|
534
|
+
});
|
535
|
+
_context11.next = 15;
|
536
|
+
return _testWrapper.screen.findByRole('button');
|
537
|
+
case 15:
|
538
|
+
button = _context11.sent;
|
539
|
+
expect(button).toHaveClass('is-focused');
|
540
|
+
case 17:
|
541
|
+
case "end":
|
542
|
+
return _context11.stop();
|
543
|
+
}
|
544
|
+
}, _callee11);
|
545
|
+
})));
|
546
|
+
test('should navigate to expandable container ', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee12() {
|
547
|
+
var option;
|
548
|
+
return _regeneratorRuntime().wrap(function _callee12$(_context12) {
|
549
|
+
while (1) switch (_context12.prev = _context12.next) {
|
550
|
+
case 0:
|
551
|
+
getComponentExpandable({
|
552
|
+
selectionMode: 'expansion'
|
553
|
+
});
|
554
|
+
option = _testWrapper.screen.getAllByRole('gridcell')[0];
|
555
|
+
_userEvent["default"].tab();
|
556
|
+
_userEvent["default"].type(option, '{enter}', {
|
557
|
+
skipClick: true
|
558
|
+
});
|
559
|
+
_userEvent["default"].type(option, '{arrowright}', {
|
560
|
+
skipClick: true
|
561
|
+
});
|
562
|
+
_userEvent["default"].type(option, '{arrowleft}', {
|
563
|
+
skipClick: true
|
564
|
+
});
|
565
|
+
expect(option).toHaveClass('is-focused');
|
566
|
+
_userEvent["default"].type(option, '{arrowright}', {
|
567
|
+
skipClick: true
|
568
|
+
});
|
569
|
+
_userEvent["default"].type(option, '{arrowright}', {
|
570
|
+
skipClick: true
|
571
|
+
});
|
572
|
+
expect(option).toHaveClass('is-focused');
|
573
|
+
_userEvent["default"].type(option, '{arrowleft}', {
|
574
|
+
skipClick: true
|
575
|
+
});
|
576
|
+
_userEvent["default"].type(option, '{arrowleft}', {
|
577
|
+
skipClick: true
|
578
|
+
});
|
579
|
+
expect(option).toHaveClass('is-focused');
|
580
|
+
_testWrapper.fireEvent.keyDown(option, {
|
581
|
+
key: 'ArrowLeft'
|
582
|
+
});
|
583
|
+
_testWrapper.fireEvent.keyUp(option, {
|
584
|
+
key: 'ArrowLeft'
|
585
|
+
});
|
586
|
+
_testWrapper.fireEvent.keyDown(option, {
|
587
|
+
key: 'ArrowLeft'
|
588
|
+
});
|
589
|
+
_testWrapper.fireEvent.keyUp(option, {
|
590
|
+
key: 'ArrowLeft'
|
591
|
+
});
|
592
|
+
case 17:
|
593
|
+
case "end":
|
594
|
+
return _context12.stop();
|
595
|
+
}
|
596
|
+
}, _callee12);
|
597
|
+
})));
|
598
|
+
test('escape focus delegate turns on if enter is pressed', function () {
|
599
|
+
(0, _ListViewFocusWrapper.escapeFocusDelegate)(_objectSpread(_objectSpread({}, testEvent), {}, {
|
600
|
+
keyCode: 13
|
601
|
+
}), setIsFocusEscaped, focusManager, false);
|
602
|
+
expect(setIsFocusEscaped).toHaveBeenCalled();
|
603
|
+
expect(focusNext).toHaveBeenCalled();
|
604
|
+
});
|
605
|
+
test('escape focus delegate calls correct functions if left is pressed', function () {
|
606
|
+
(0, _ListViewFocusWrapper.escapeFocusDelegate)(_objectSpread(_objectSpread({}, testEvent), {}, {
|
607
|
+
keyCode: 37
|
608
|
+
}), setIsFocusEscaped, focusManager, true);
|
609
|
+
expect(setIsFocusEscaped).not.toHaveBeenCalled();
|
610
|
+
expect(focusNext).not.toHaveBeenCalled();
|
611
|
+
expect(stopPropagation).toHaveBeenCalled();
|
612
|
+
});
|
613
|
+
test('escape focus delegate calls correct functions if left is pressed', function () {
|
614
|
+
(0, _ListViewFocusWrapper.escapeFocusDelegate)(_objectSpread(_objectSpread({}, testEvent), {}, {
|
615
|
+
keyCode: 39
|
616
|
+
}), setIsFocusEscaped, focusManager, true);
|
617
|
+
expect(setIsFocusEscaped).not.toHaveBeenCalled();
|
618
|
+
expect(focusNext).not.toHaveBeenCalled();
|
619
|
+
expect(stopPropagation).toHaveBeenCalled();
|
620
|
+
});
|
621
|
+
test('escape focus delegate calls correct functions if left is pressed', function () {
|
622
|
+
(0, _ListViewFocusWrapper.escapeFocusDelegate)(_objectSpread(_objectSpread({}, testEvent), {}, {
|
623
|
+
keyCode: 38
|
624
|
+
}), setIsFocusEscaped, focusManager, true);
|
625
|
+
expect(focusNext).not.toHaveBeenCalled();
|
626
|
+
expect(focusPrevious).toHaveBeenCalled();
|
627
|
+
});
|
628
|
+
test('escape focus delegate calls correct functions if left is pressed', function () {
|
629
|
+
(0, _ListViewFocusWrapper.escapeFocusDelegate)(_objectSpread(_objectSpread({}, testEvent), {}, {
|
630
|
+
keyCode: 40
|
631
|
+
}), setIsFocusEscaped, focusManager, true);
|
632
|
+
expect(focusNext).toHaveBeenCalled();
|
633
|
+
expect(focusPrevious).not.toHaveBeenCalled();
|
634
|
+
});
|
635
|
+
test('escape focus delegate calls correct functions if anything else is pressed', function () {
|
636
|
+
(0, _ListViewFocusWrapper.escapeFocusDelegate)(_objectSpread(_objectSpread({}, testEvent), {}, {
|
637
|
+
keyCode: 4
|
638
|
+
}), setIsFocusEscaped, focusManager, true);
|
639
|
+
expect(focusNext).not.toHaveBeenCalled();
|
640
|
+
expect(focusPrevious).not.toHaveBeenCalled();
|
376
641
|
});
|
@@ -0,0 +1,100 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
|
4
|
+
var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
|
5
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
6
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
7
|
+
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
8
|
+
_Object$defineProperty(exports, "__esModule", {
|
9
|
+
value: true
|
10
|
+
});
|
11
|
+
exports["default"] = void 0;
|
12
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
13
|
+
var _react = _interopRequireWildcard(require("react"));
|
14
|
+
var _MenuDownIcon = _interopRequireDefault(require("@pingux/mdi-react/MenuDownIcon"));
|
15
|
+
var _MenuUpIcon = _interopRequireDefault(require("@pingux/mdi-react/MenuUpIcon"));
|
16
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
17
|
+
var _useExpandableListViewItem = _interopRequireDefault(require("../../hooks/useExpandableListViewItem/useExpandableListViewItem"));
|
18
|
+
var _index = require("../../index");
|
19
|
+
var _ListViewContext = require("./ListViewContext");
|
20
|
+
var _ListViewFocusWrapper = _interopRequireDefault(require("./ListViewFocusWrapper"));
|
21
|
+
var _react2 = require("@emotion/react");
|
22
|
+
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); }
|
23
|
+
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; }
|
24
|
+
var ListViewExpandableItem = function ListViewExpandableItem(props) {
|
25
|
+
var item = props.item,
|
26
|
+
_props$item$props = props.item.props,
|
27
|
+
listItemProps = _props$item$props.listItemProps,
|
28
|
+
rowProps = _props$item$props.rowProps,
|
29
|
+
_props$item$props$has = _props$item$props.hasSeparator,
|
30
|
+
hasSeparator = _props$item$props$has === void 0 ? true : _props$item$props$has,
|
31
|
+
hasInsetSeparator = _props$item$props.hasInsetSeparator,
|
32
|
+
isHoverable = props.isHoverable,
|
33
|
+
isFocusable = props.isFocusable,
|
34
|
+
className = props.className;
|
35
|
+
var key = item.key;
|
36
|
+
var _useContext = (0, _react.useContext)(_ListViewContext.ListViewContext),
|
37
|
+
state = _useContext.state;
|
38
|
+
var expandableItemRowRef = (0, _react.useRef)();
|
39
|
+
var expandableChildrenRef = (0, _react.useRef)();
|
40
|
+
var hookProps = {
|
41
|
+
item: item,
|
42
|
+
listItemProps: listItemProps,
|
43
|
+
rowProps: rowProps,
|
44
|
+
hasSeparator: hasSeparator,
|
45
|
+
hasInsetSeparator: hasInsetSeparator,
|
46
|
+
isHoverable: isHoverable,
|
47
|
+
isFocusable: isFocusable,
|
48
|
+
className: className,
|
49
|
+
expandableItemRowRef: expandableItemRowRef,
|
50
|
+
expandableChildrenRef: expandableChildrenRef,
|
51
|
+
state: state
|
52
|
+
};
|
53
|
+
var _useExpandableListVie = (0, _useExpandableListViewItem["default"])(hookProps),
|
54
|
+
expandableRowProps = _useExpandableListVie.expandableRowProps,
|
55
|
+
cellProps = _useExpandableListVie.cellProps,
|
56
|
+
expandableContainerProps = _useExpandableListVie.expandableContainerProps,
|
57
|
+
expandableItemState = _useExpandableListVie.expandableItemState;
|
58
|
+
var isExpanded = expandableItemState.isExpanded,
|
59
|
+
toggleExpanded = expandableItemState.toggleExpanded,
|
60
|
+
isFocusEscaped = expandableItemState.isFocusEscaped;
|
61
|
+
return (0, _react2.jsx)(_index.Box, expandableRowProps, (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({}, cellProps, {
|
62
|
+
onMouseDown: toggleExpanded,
|
63
|
+
isRow: true,
|
64
|
+
justifyContent: "start"
|
65
|
+
}), (0, _react2.jsx)(_index.Box, {
|
66
|
+
isRow: true,
|
67
|
+
sx: {
|
68
|
+
alignItems: 'center',
|
69
|
+
width: '100%'
|
70
|
+
}
|
71
|
+
}, item.rendered[0], (0, _react2.jsx)(_index.Icon, {
|
72
|
+
sx: {
|
73
|
+
ml: 'auto'
|
74
|
+
},
|
75
|
+
icon: isExpanded ? _MenuUpIcon["default"] : _MenuDownIcon["default"],
|
76
|
+
title: {
|
77
|
+
name: "".concat(key, " expand icon button")
|
78
|
+
}
|
79
|
+
}))), (0, _react2.jsx)(_index.Box, expandableItemState.gridCellProps, isExpanded && (0, _react2.jsx)(_ListViewFocusWrapper["default"], {
|
80
|
+
isFocusEscaped: isFocusEscaped,
|
81
|
+
containerProps: expandableContainerProps
|
82
|
+
}, item.rendered[1])));
|
83
|
+
};
|
84
|
+
ListViewExpandableItem.propTypes = {
|
85
|
+
item: _propTypes["default"].shape({
|
86
|
+
key: _propTypes["default"].string,
|
87
|
+
rendered: _propTypes["default"].node,
|
88
|
+
props: _propTypes["default"].shape({
|
89
|
+
'data-id': _propTypes["default"].string,
|
90
|
+
listItemProps: _propTypes["default"].shape({}),
|
91
|
+
rowProps: _propTypes["default"].shape({}),
|
92
|
+
hasSeparator: _propTypes["default"].bool,
|
93
|
+
hasInsetSeparator: _propTypes["default"].bool
|
94
|
+
})
|
95
|
+
}),
|
96
|
+
isHoverable: _propTypes["default"].bool,
|
97
|
+
isFocusable: _propTypes["default"].bool
|
98
|
+
};
|
99
|
+
var _default = ListViewExpandableItem;
|
100
|
+
exports["default"] = _default;
|