@pingux/astro 2.32.0-alpha.12 → 2.32.0-alpha.14

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.
Files changed (45) hide show
  1. package/lib/cjs/components/ImageUploadField/ImageUploadField.test.js +47 -14
  2. package/lib/cjs/components/TreeView/TreeView.js +99 -11
  3. package/lib/cjs/components/TreeView/TreeView.stories.js +23 -10
  4. package/lib/cjs/components/TreeView/TreeView.styles.js +22 -2
  5. package/lib/cjs/components/TreeView/TreeView.test.js +91 -11
  6. package/lib/cjs/components/TreeView/TreeViewItem.js +112 -14
  7. package/lib/cjs/components/TreeView/TreeViewKeyboardDelegate.js +200 -0
  8. package/lib/cjs/components/TreeView/TreeViewKeyboardDelegate.test.js +511 -0
  9. package/lib/cjs/components/TreeView/TreeViewRow.js +20 -5
  10. package/lib/cjs/components/TreeView/TreeViewSection.js +164 -16
  11. package/lib/cjs/components/TreeView/TreeViewWrapper.js +40 -0
  12. package/lib/cjs/hooks/useImageUploadState/index.d.ts +1 -0
  13. package/lib/cjs/hooks/useImageUploadState/useImageUploadState.d.ts +28 -0
  14. package/lib/cjs/hooks/useImageUploadState/useImageUploadState.js +9 -6
  15. package/lib/cjs/hooks/useModalState/index.d.ts +1 -0
  16. package/lib/cjs/hooks/useModalState/useModalState.d.ts +21 -0
  17. package/lib/cjs/hooks/useModalState/useModalState.js +0 -9
  18. package/lib/cjs/hooks/useModalState/useModalState.test.d.ts +1 -0
  19. package/lib/cjs/hooks/useMountTransition/index.d.ts +1 -0
  20. package/lib/cjs/hooks/useMountTransition/useMountTransition.d.ts +14 -0
  21. package/lib/cjs/hooks/useMountTransition/useMountTransition.js +0 -9
  22. package/lib/cjs/hooks/useMountTransition/useMountTransition.test.d.ts +1 -0
  23. package/lib/cjs/hooks/useMountTransition/useMountTransition.test.js +2 -2
  24. package/lib/cjs/utils/testUtils/setupTests.d.ts +4 -0
  25. package/lib/cjs/utils/testUtils/testAxe.d.ts +2 -0
  26. package/lib/cjs/utils/testUtils/testTheme.d.ts +21 -0
  27. package/lib/cjs/utils/testUtils/testWrapper.d.ts +5 -0
  28. package/lib/cjs/utils/testUtils/testWrapper.js +3 -2
  29. package/lib/components/ImageUploadField/ImageUploadField.test.js +47 -14
  30. package/lib/components/TreeView/TreeView.js +100 -12
  31. package/lib/components/TreeView/TreeView.stories.js +23 -10
  32. package/lib/components/TreeView/TreeView.styles.js +22 -2
  33. package/lib/components/TreeView/TreeView.test.js +92 -12
  34. package/lib/components/TreeView/TreeViewItem.js +111 -14
  35. package/lib/components/TreeView/TreeViewKeyboardDelegate.js +176 -0
  36. package/lib/components/TreeView/TreeViewKeyboardDelegate.test.js +496 -0
  37. package/lib/components/TreeView/TreeViewRow.js +20 -5
  38. package/lib/components/TreeView/TreeViewSection.js +161 -16
  39. package/lib/components/TreeView/TreeViewWrapper.js +31 -0
  40. package/lib/hooks/useImageUploadState/useImageUploadState.js +9 -6
  41. package/lib/hooks/useModalState/useModalState.js +0 -10
  42. package/lib/hooks/useMountTransition/useMountTransition.js +0 -10
  43. package/lib/hooks/useMountTransition/useMountTransition.test.js +2 -2
  44. package/lib/utils/testUtils/testWrapper.js +3 -2
  45. package/package.json +1 -1
@@ -1,7 +1,7 @@
1
1
  import _typeof from "@babel/runtime-corejs3/helpers/esm/typeof";
2
2
  import _asyncToGenerator from "@babel/runtime-corejs3/helpers/esm/asyncToGenerator";
3
3
  import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
4
- 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; }
4
+ 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 _context9; _forEachInstanceProperty(_context9 = ["next", "throw", "return"]).call(_context9, 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 _context10; 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(_context10 = this.tryEntries).call(_context10, 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; }
5
5
  import _URL from "@babel/runtime-corejs3/core-js-stable/url";
6
6
  import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
7
7
  import _Symbol from "@babel/runtime-corejs3/core-js-stable/symbol";
@@ -336,10 +336,43 @@ test('loader size can be changed via the prop', function () {
336
336
  'font-size': "".concat(testLoaderSize, "px")
337
337
  });
338
338
  });
339
- test('should show the menu if label clicked when preview image exists with custom uploads', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
340
- var customUploadProp, customRemoveProp, imagePreview;
339
+ test('should show the menu if label clicked when preview image exists', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
340
+ var imageUploadButton, imagePreview, imageUploadLabel;
341
341
  return _regeneratorRuntime().wrap(function _callee6$(_context6) {
342
342
  while (1) switch (_context6.prev = _context6.next) {
343
+ case 0:
344
+ getComponent();
345
+ imageUploadButton = screen.getByTestId(testButtonId);
346
+ userEvent.click(imageUploadButton);
347
+ fireEvent.change(screen.getByTestId('image-upload-input'), {
348
+ target: {
349
+ files: [file]
350
+ }
351
+ });
352
+ _context6.next = 6;
353
+ return screen.findByTestId(imageUploadImagePreview);
354
+ case 6:
355
+ imagePreview = _context6.sent;
356
+ expect(imagePreview).toBeInTheDocument();
357
+ expect(imagePreview).toHaveAttribute('src');
358
+
359
+ // Click on the image preview button
360
+ imageUploadLabel = screen.getByText(testLabel);
361
+ fireEvent.click(imageUploadLabel);
362
+ expect(screen.getAllByRole('button')[0]).toHaveAttribute('aria-expanded', 'true');
363
+ expect(screen.getByRole('menu')).toBeInTheDocument();
364
+ expect(screen.getByText('Upload New Image')).toBeInTheDocument();
365
+ expect(screen.getByText('Remove Image')).toBeInTheDocument();
366
+ case 15:
367
+ case "end":
368
+ return _context6.stop();
369
+ }
370
+ }, _callee6);
371
+ })));
372
+ test('should show the menu if label clicked when preview image exists with custom uploads', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7() {
373
+ var customUploadProp, customRemoveProp, imagePreview;
374
+ return _regeneratorRuntime().wrap(function _callee7$(_context7) {
375
+ while (1) switch (_context7.prev = _context7.next) {
343
376
  case 0:
344
377
  customUploadProp = 'Custom Upload';
345
378
  customRemoveProp = 'Custom Remove';
@@ -352,10 +385,10 @@ test('should show the menu if label clicked when preview image exists with custo
352
385
  files: [file]
353
386
  }
354
387
  });
355
- _context6.next = 6;
388
+ _context7.next = 6;
356
389
  return screen.findByTestId(imageUploadImagePreview);
357
390
  case 6:
358
- imagePreview = _context6.sent;
391
+ imagePreview = _context7.sent;
359
392
  expect(imagePreview).toBeInTheDocument();
360
393
  expect(imagePreview).toHaveAttribute('src');
361
394
 
@@ -365,9 +398,9 @@ test('should show the menu if label clicked when preview image exists with custo
365
398
  expect(screen.getByText(customRemoveProp)).toBeInTheDocument();
366
399
  case 12:
367
400
  case "end":
368
- return _context6.stop();
401
+ return _context7.stop();
369
402
  }
370
- }, _callee6);
403
+ }, _callee7);
371
404
  })));
372
405
  test('should render node element if passed as default image', function () {
373
406
  getComponent({
@@ -379,10 +412,10 @@ test('should render node element if passed as default image', function () {
379
412
  expect(img).toBeInstanceOf(HTMLImageElement);
380
413
  expect(img).toBeInTheDocument();
381
414
  });
382
- test('should implement popover menu props', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7() {
415
+ test('should implement popover menu props', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
383
416
  var imagePreview;
384
- return _regeneratorRuntime().wrap(function _callee7$(_context7) {
385
- while (1) switch (_context7.prev = _context7.next) {
417
+ return _regeneratorRuntime().wrap(function _callee8$(_context8) {
418
+ while (1) switch (_context8.prev = _context8.next) {
386
419
  case 0:
387
420
  getComponent({
388
421
  popoverMenuProps: {
@@ -394,10 +427,10 @@ test('should implement popover menu props', /*#__PURE__*/_asyncToGenerator( /*#_
394
427
  files: [file]
395
428
  }
396
429
  });
397
- _context7.next = 4;
430
+ _context8.next = 4;
398
431
  return screen.findByTestId(imageUploadImagePreview);
399
432
  case 4:
400
- imagePreview = _context7.sent;
433
+ imagePreview = _context8.sent;
401
434
  expect(imagePreview).toBeInTheDocument();
402
435
  expect(imagePreview).toHaveAttribute('src');
403
436
 
@@ -408,7 +441,7 @@ test('should implement popover menu props', /*#__PURE__*/_asyncToGenerator( /*#_
408
441
  expect(screen.getByRole('presentation')).toHaveAttribute('data-popover-placement', 'right');
409
442
  case 11:
410
443
  case "end":
411
- return _context7.stop();
444
+ return _context8.stop();
412
445
  }
413
- }, _callee7);
446
+ }, _callee8);
414
447
  })));
@@ -8,13 +8,14 @@ import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/obje
8
8
  import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
9
9
  import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
10
10
  import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
11
+ import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
11
12
  import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
12
- var _excluded = ["tree", "disabledKeys", "onExpandedChange"];
13
+ var _excluded = ["tree", "disabledKeys", "onExpandedChange", "onKeyDown", "pageLength"];
13
14
  import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
14
15
  import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
15
16
  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; }
16
17
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
17
- import React, { forwardRef, useImperativeHandle, useMemo, useRef } from 'react';
18
+ import React, { forwardRef, useImperativeHandle, useMemo, useRef, useState } from 'react';
18
19
  import { useTreeState } from 'react-stately';
19
20
  import { useCollator } from '@react-aria/i18n';
20
21
  import { useListBox } from '@react-aria/listbox';
@@ -23,6 +24,7 @@ import PropTypes from 'prop-types';
23
24
  import { TreeViewContext } from '../../context/TreeViewContext';
24
25
  import { Box, TreeViewItem, TreeViewSection } from '../../index';
25
26
  import { isIterableProp } from '../../utils/devUtils/props/isIterable';
27
+ import TreeViewWrapper from './TreeViewWrapper';
26
28
 
27
29
  // split out and exported for ease of use across components
28
30
  // and to facilitate easier testing (eliminates redundant conditional renders)
@@ -46,11 +48,23 @@ export function useTreeViewLayout(state) {
46
48
  return layout;
47
49
  }
48
50
  var TreeView = /*#__PURE__*/forwardRef(function (props, ref) {
49
- var _context;
51
+ var _tree$items$, _context;
50
52
  var tree = props.tree,
51
53
  disabledKeys = props.disabledKeys,
52
54
  onExpandedChange = props.onExpandedChange,
55
+ onKeyDown = props.onKeyDown,
56
+ _props$pageLength = props.pageLength,
57
+ pageLength = _props$pageLength === void 0 ? 5 : _props$pageLength,
53
58
  others = _objectWithoutProperties(props, _excluded);
59
+
60
+ // we are tracking the last focused item.
61
+ // this enables us to have focus jump back to the item, after focus
62
+ // leaves the tree, and then returns.
63
+ var _useState = useState(tree === null || tree === void 0 || (_tree$items$ = tree.items[0]) === null || _tree$items$ === void 0 ? void 0 : _tree$items$.key),
64
+ _useState2 = _slicedToArray(_useState, 2),
65
+ lastFocusedItem = _useState2[0],
66
+ setLastFocusedItem = _useState2[1];
67
+ var level = 0;
54
68
  var treeViewRef = useRef();
55
69
  var selectedKeys = tree.selectedKeys;
56
70
 
@@ -65,7 +79,66 @@ var TreeView = /*#__PURE__*/forwardRef(function (props, ref) {
65
79
  selectionMode: 'single',
66
80
  disallowEmptySelection: true
67
81
  }, others));
68
- var level = 0;
82
+ var flattenNestedData = function flattenNestedData(_data) {
83
+ var returnArray = [];
84
+ var checkItemNesting = function checkItemNesting(item) {
85
+ var _item$value, _item$items;
86
+ if (((_item$value = item.value) === null || _item$value === void 0 || (_item$value = _item$value.items) === null || _item$value === void 0 ? void 0 : _item$value.length) > 0) {
87
+ return {
88
+ isTopLevel: true,
89
+ hasChildren: true
90
+ };
91
+ }
92
+ if (((_item$items = item.items) === null || _item$items === void 0 ? void 0 : _item$items.length) > 0) {
93
+ return {
94
+ isTopLevel: false,
95
+ hasChildren: true
96
+ };
97
+ }
98
+ return {
99
+ isTopLevel: false,
100
+ hasChildren: false
101
+ };
102
+ };
103
+ var checkSection = function checkSection(isRendered, hasItems) {
104
+ return isRendered && hasItems;
105
+ };
106
+ var loop = function loop(data) {
107
+ for (var i = 0; i < data.length; i += 1) {
108
+ var obj = {
109
+ key: data[i].key
110
+ };
111
+ returnArray.push(obj);
112
+ var _checkItemNesting = checkItemNesting(data[i]),
113
+ hasChildren = _checkItemNesting.hasChildren,
114
+ isTopLevel = _checkItemNesting.isTopLevel;
115
+ if (checkSection(state.expandedKeys.has(data[i].key), hasChildren) === true) {
116
+ if (isTopLevel) {
117
+ var _data$i$value;
118
+ loop((_data$i$value = data[i].value) === null || _data$i$value === void 0 ? void 0 : _data$i$value.items);
119
+ } else {
120
+ loop(data[i].items);
121
+ }
122
+ }
123
+ }
124
+ };
125
+ loop(_data);
126
+ return returnArray;
127
+ };
128
+
129
+ // list of value pairs of keys and refs
130
+ // does not need to be in order, because they are values pairs
131
+ var _useState3 = useState([]),
132
+ _useState4 = _slicedToArray(_useState3, 2),
133
+ refArray = _useState4[0],
134
+ setRefs = _useState4[1];
135
+
136
+ // creates a flattened list of keys for up/down keyboard use
137
+ // this DOES need to be in the same order as the HTML appears in the DOM.
138
+ // we are essentially turning all rendered items into a flat list, for up/down
139
+ var flatKeyArray = useMemo(function () {
140
+ return flattenNestedData(props.items);
141
+ }, [state.expandedKeys]);
69
142
  var ariaLabel = props['aria-label'];
70
143
  var listBoxOptions = {
71
144
  disabledKeys: disabledKeys,
@@ -79,7 +152,13 @@ var TreeView = /*#__PURE__*/forwardRef(function (props, ref) {
79
152
  return ___EmotionJSX(TreeViewContext.Provider, {
80
153
  value: {
81
154
  state: state,
82
- tree: tree
155
+ tree: tree,
156
+ refArray: refArray,
157
+ setRefs: setRefs,
158
+ flatKeyArray: flatKeyArray,
159
+ pageLength: pageLength,
160
+ setLastFocusedItem: setLastFocusedItem,
161
+ lastFocusedItem: lastFocusedItem
83
162
  }
84
163
  }, ___EmotionJSX(Box, _extends({
85
164
  as: "ul"
@@ -88,14 +167,17 @@ var TreeView = /*#__PURE__*/forwardRef(function (props, ref) {
88
167
  "aria-label": ariaLabel,
89
168
  role: "treegrid",
90
169
  sx: {
91
- overflow: 'hidden'
170
+ overflow: 'hidden',
171
+ p: '5px',
172
+ border: 'none !important'
92
173
  }
93
- }, others), _mapInstanceProperty(_context = _Array$from(state.collection)).call(_context, function (item, index) {
174
+ }, others), ___EmotionJSX(TreeViewWrapper, null, _mapInstanceProperty(_context = _Array$from(state.collection)).call(_context, function (item, index) {
94
175
  return SectionOrItemRender(item.props.items.length > 0, ___EmotionJSX(TreeViewSection, {
95
176
  item: item,
96
177
  items: item.props.items,
97
178
  title: item.props.title,
98
179
  key: item.props.title,
180
+ onKeyDown: onKeyDown,
99
181
  level: level + 1,
100
182
  setSize: state.collection.size,
101
183
  position: index
@@ -103,17 +185,19 @@ var TreeView = /*#__PURE__*/forwardRef(function (props, ref) {
103
185
  item: item,
104
186
  title: item.value.value.title,
105
187
  key: item.value.value.title,
188
+ onKeyDown: onKeyDown,
106
189
  level: level + 1,
107
- position: index,
108
- setSize: state.collection.size
190
+ setSize: state.collection.size,
191
+ position: index
109
192
  }));
110
- })));
193
+ }))));
111
194
  });
112
195
  TreeView.propTypes = {
113
196
  /** data object prop that is required to make the tree function
114
197
  this is returned from the useTreeData hook in React-Aria */
115
198
  tree: PropTypes.shape({
116
- selectedKeys: isIterableProp
199
+ selectedKeys: isIterableProp,
200
+ items: isIterableProp
117
201
  }).isRequired,
118
202
  /** The currently disabled keys in the collection. */
119
203
  disabledKeys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.object])),
@@ -122,6 +206,10 @@ TreeView.propTypes = {
122
206
  /** The list of TreeView items. */
123
207
  items: isIterableProp,
124
208
  /** String that describes the treeview when using a screen reader. */
125
- 'aria-label': PropTypes.string
209
+ 'aria-label': PropTypes.string,
210
+ /** Handler that is called when a key is pressed. */
211
+ onKeyDown: PropTypes.func,
212
+ /** Number of items to move the focus when page up or page down is pressed */
213
+ pageLength: PropTypes.number
126
214
  };
127
215
  export default TreeView;
@@ -20,36 +20,50 @@ export default {
20
20
  };
21
21
  var data = [{
22
22
  title: 'Policies',
23
+ key: 'Policies',
23
24
  items: [{
24
25
  title: 'Registration',
26
+ key: 'Registration',
25
27
  items: [{
26
- title: 'Registration A'
28
+ title: 'Registration A',
29
+ key: 'Registration A'
27
30
  }, {
28
31
  title: 'Registration B',
32
+ key: 'Registration B',
29
33
  items: [{
30
- title: 'Registration B1'
34
+ title: 'Registration B1',
35
+ key: 'Registration B1'
31
36
  }, {
32
- title: 'Registration B2'
37
+ title: 'Registration B2',
38
+ key: 'Registration B2'
33
39
  }]
34
40
  }, {
35
- title: 'Registration C'
41
+ title: 'Registration C',
42
+ key: 'Registration C'
36
43
  }, {
37
- title: 'Registration D'
44
+ title: 'Registration D',
45
+ key: 'Registration D'
38
46
  }]
39
47
  }, {
40
48
  title: 'Authentication',
49
+ key: 'Authentication',
41
50
  items: [{
42
- title: 'Authentication A'
51
+ title: 'Authentication A',
52
+ key: 'Authentication A'
43
53
  }, {
44
- title: 'Authentication B'
54
+ title: 'Authentication B',
55
+ key: 'Authentication B'
45
56
  }]
46
57
  }]
47
58
  }, {
48
59
  title: 'Other',
60
+ key: 'Other',
49
61
  items: [{
50
- title: 'Other A'
62
+ title: 'Other A',
63
+ key: 'Other A'
51
64
  }]
52
65
  }, {
66
+ key: 'Single Item',
53
67
  title: 'Single Item'
54
68
  }];
55
69
  export var Default = function Default(args) {
@@ -65,8 +79,7 @@ export var Default = function Default(args) {
65
79
  return ___EmotionJSX(TreeView, _extends({}, args, {
66
80
  items: tree.items,
67
81
  tree: tree,
68
- "aria-label": "Example Tree",
69
- disabledKeys: ['Single Item']
82
+ "aria-label": "Example Tree"
70
83
  }), function (section) {
71
84
  var _section$value;
72
85
  return ___EmotionJSX(Item, {
@@ -3,7 +3,7 @@ var treeRow = {
3
3
  cursor: 'pointer',
4
4
  height: '31px',
5
5
  outline: 'none',
6
- '&.is-selected, &.is-hovered, &.is-focused': {
6
+ '&.is-selected, &.is-hovered': {
7
7
  backgroundColor: 'active',
8
8
  '& span': {
9
9
  color: 'white'
@@ -17,8 +17,28 @@ var treeRow = {
17
17
  },
18
18
  '&.is-expanded': {
19
19
  marginBottom: 'xs'
20
+ },
21
+ '& :focus': {
22
+ border: 'none'
20
23
  }
21
24
  };
25
+ var wrapper = {
26
+ '&.is-focused': {
27
+ boxSizing: 'unset',
28
+ outline: '1px solid',
29
+ outlineColor: 'focus',
30
+ outlineOffset: '2px'
31
+ },
32
+ width: '100%',
33
+ ':not(:last-child)': {
34
+ mb: 'sm'
35
+ },
36
+ ':focus': {
37
+ border: 'none'
38
+ },
39
+ outline: 'none'
40
+ };
22
41
  export default {
23
- treeRow: treeRow
42
+ treeRow: treeRow,
43
+ wrapper: wrapper
24
44
  };
@@ -1,9 +1,13 @@
1
1
  import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
2
2
  import React from 'react';
3
3
  import { useTreeData } from 'react-stately';
4
+ import userEvent from '@testing-library/user-event';
5
+ import PropTypes from 'prop-types';
4
6
  import { Item } from '../../index';
5
- import { fireEvent, render, screen } from '../../utils/testUtils/testWrapper';
7
+ import { render, screen } from '../../utils/testUtils/testWrapper';
6
8
  import { SectionOrItemRender } from './TreeView';
9
+ import { refArray } from './TreeViewKeyboardDelegate.test';
10
+ import { addRefToArrayHelper, removeRefFromArrayHelper } from './TreeViewSection';
7
11
  import TreeView from '.';
8
12
  import { jsx as ___EmotionJSX } from "@emotion/react";
9
13
  var testId = 'test-TreeView';
@@ -40,9 +44,12 @@ var data = [{
40
44
  }, {
41
45
  title: 'Single Item'
42
46
  }];
47
+ var singleData = [{
48
+ title: 'Single Item'
49
+ }];
43
50
  var TreeViewComponent = function TreeViewComponent(props) {
44
51
  var tree = useTreeData({
45
- initialItems: data,
52
+ initialItems: props.data,
46
53
  getKey: function getKey(item) {
47
54
  return item.title;
48
55
  },
@@ -62,6 +69,9 @@ var TreeViewComponent = function TreeViewComponent(props) {
62
69
  });
63
70
  });
64
71
  };
72
+ TreeViewComponent.propTypes = {
73
+ data: PropTypes.arrayOf(PropTypes.shape({}))
74
+ };
65
75
  var offsetWidth;
66
76
  var offsetHeight;
67
77
  var scrollHeight;
@@ -95,16 +105,20 @@ test('TreeView component does load', function () {
95
105
  expect(element).toBeInTheDocument();
96
106
  });
97
107
  test('Can select an Item using the mouse', function () {
98
- render(___EmotionJSX(TreeViewComponent, null));
108
+ render(___EmotionJSX(TreeViewComponent, {
109
+ data: data
110
+ }));
99
111
  var element = screen.queryByRole('treegrid');
100
112
  expect(element).toBeInTheDocument();
101
113
  var peopleElement = screen.queryByText('Single Item');
102
114
  expect(peopleElement).not.toHaveClass('is-selected');
103
- fireEvent.click(peopleElement);
115
+ userEvent.click(peopleElement);
104
116
  expect(peopleElement).toHaveClass('is-selected');
105
117
  });
106
118
  test('Renders both Sections and Items', function () {
107
- render(___EmotionJSX(TreeViewComponent, null));
119
+ render(___EmotionJSX(TreeViewComponent, {
120
+ data: data
121
+ }));
108
122
  var peopleElement = screen.getByText('Single Item');
109
123
  expect(peopleElement).toBeInTheDocument();
110
124
  var plantElement = screen.getByText('Other');
@@ -113,7 +127,9 @@ test('Renders both Sections and Items', function () {
113
127
  expect(allListItems).toHaveLength(3);
114
128
  });
115
129
  test('Can expand an Item using the mouse', function () {
116
- render(___EmotionJSX(TreeViewComponent, null));
130
+ render(___EmotionJSX(TreeViewComponent, {
131
+ data: data
132
+ }));
117
133
 
118
134
  // The children of collapsed sections will not
119
135
  // be rendered by default.
@@ -122,47 +138,91 @@ test('Can expand an Item using the mouse', function () {
122
138
  // Clicking the dropdown icon, renders the children
123
139
  // of the collapsed section.
124
140
  var buttons = screen.queryAllByRole('button');
125
- fireEvent.click(buttons[0]);
141
+ userEvent.click(buttons[0]);
126
142
  expect(screen.queryByText(data[0].items[0].title)).toBeInTheDocument();
127
143
  });
128
144
  test('onExpandedChange change prop calls when used', function () {
129
145
  var onPress = jest.fn();
130
146
  render(___EmotionJSX(TreeViewComponent, {
147
+ data: data,
131
148
  onExpandedChange: onPress
132
149
  }));
133
150
  expect(onPress).not.toHaveBeenCalled();
134
151
  var buttons = screen.queryAllByRole('button');
135
- fireEvent.click(buttons[0]);
152
+ userEvent.click(buttons[0]);
136
153
  expect(onPress).toHaveBeenCalled();
137
154
  });
138
155
  test('disabledKeys prop disables items in the tree -- rendering them unclickable', function () {
139
156
  render(___EmotionJSX(TreeViewComponent, {
157
+ data: data,
140
158
  disabledKeys: ['Single Item']
141
159
  }));
142
160
  var listItems = screen.queryAllByRole('treeitem');
143
161
  var thisItem = listItems[2];
144
162
  expect(thisItem).not.toHaveClass('is-selected');
145
163
  expect(thisItem).toHaveAttribute('aria-disabled', 'true');
146
- fireEvent.mouseDown(thisItem);
147
- fireEvent.mouseUp(thisItem);
164
+ userEvent.click(thisItem);
148
165
  expect(thisItem).not.toHaveClass('is-selected');
149
166
  expect(thisItem).toHaveAttribute('aria-selected', 'false');
150
167
  });
151
168
  test('displays correct aria attributes', function () {
152
- render(___EmotionJSX(TreeViewComponent, null));
169
+ render(___EmotionJSX(TreeViewComponent, {
170
+ data: data
171
+ }));
153
172
  var listItems = screen.getAllByRole('treeitem');
154
173
  var lastTreeItem = listItems[2];
155
174
  expect(lastTreeItem).toHaveAttribute('aria-level', '1');
156
175
  expect(lastTreeItem).toHaveAttribute('aria-posinset', '3');
157
176
  expect(lastTreeItem).toHaveAttribute('aria-setsize', '3');
158
177
  var buttons = screen.queryAllByRole('button');
159
- fireEvent.click(buttons[1]);
178
+ userEvent.click(buttons[1]);
160
179
  var expandedItems = screen.getAllByRole('treeitem');
161
180
  var nestedItem = expandedItems[2];
162
181
  expect(nestedItem).toHaveAttribute('aria-level', '2');
163
182
  expect(nestedItem).toHaveAttribute('aria-posinset', '1');
164
183
  expect(nestedItem).toHaveAttribute('aria-setsize', '1');
165
184
  });
185
+ test('onKeyDown calls passed in prop call back function', function () {
186
+ var callback = jest.fn();
187
+ render(___EmotionJSX(TreeViewComponent, {
188
+ data: data,
189
+ onKeyDown: callback
190
+ }));
191
+ var listItems = screen.queryAllByRole('treeitem');
192
+ var thisItem = listItems[0];
193
+ userEvent.type(thisItem, '{arrowleft}');
194
+ expect(callback).toHaveBeenCalled();
195
+ });
196
+ test('onKeyDown calls passed in prop call back function', function () {
197
+ var callback = jest.fn();
198
+ render(___EmotionJSX(TreeViewComponent, {
199
+ data: data,
200
+ onKeyDown: callback
201
+ }));
202
+ var listItems = screen.queryAllByRole('treeitem');
203
+ var thisItem = listItems[2];
204
+ userEvent.type(thisItem, '{arrowleft}');
205
+ expect(callback).toHaveBeenCalled();
206
+ });
207
+ test('onKeyDown does not call passed in prop call back function', function () {
208
+ var callback = jest.fn();
209
+ render(___EmotionJSX(TreeViewComponent, {
210
+ data: data
211
+ }));
212
+ var listItems = screen.queryAllByRole('treeitem');
213
+ var thisItem = listItems[2];
214
+ userEvent.type(thisItem, '{arrowleft}');
215
+ expect(callback).not.toHaveBeenCalled();
216
+ });
217
+ test('items still render if there is only one provided', function () {
218
+ var callback = jest.fn();
219
+ render(___EmotionJSX(TreeViewComponent, {
220
+ data: singleData,
221
+ onKeyDown: callback
222
+ }));
223
+ var listItem = screen.queryByText('Single Item');
224
+ expect(listItem).toBeInTheDocument();
225
+ });
166
226
  var firstJSX = ___EmotionJSX("p", null, "first");
167
227
  var secondJSX = ___EmotionJSX("p", null, "second");
168
228
  test('Section or Item Render renders first item if condition is true', function () {
@@ -176,4 +236,24 @@ test('Section or Item Render renders second item if condition is false', functio
176
236
  var thisItem = screen.getByText('second');
177
237
  expect(thisItem).toBeInTheDocument();
178
238
  expect(screen.queryByText('first')).not.toBeInTheDocument();
239
+ });
240
+ test('Handler function removes ref from array', function () {
241
+ var newArray = removeRefFromArrayHelper(refArray, 'test');
242
+ expect(newArray).toHaveLength(2);
243
+ });
244
+ test('Handler function does not remove ref from array', function () {
245
+ var newArray = removeRefFromArrayHelper(refArray, 'anothertest');
246
+ expect(newArray).toHaveLength(3);
247
+ });
248
+ test('Handler function does add ref to array', function () {
249
+ var newArray = addRefToArrayHelper(refArray, 'yetanothertest', {
250
+ current: 'currentlystilltesting'
251
+ });
252
+ expect(newArray).toHaveLength(4);
253
+ });
254
+ test('Handler function does not add ref to array', function () {
255
+ var newArray = addRefToArrayHelper(refArray, 'test', {
256
+ current: 'currentlystilltesting'
257
+ });
258
+ expect(newArray).toHaveLength(3);
179
259
  });