@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.
- package/lib/cjs/components/ImageUploadField/ImageUploadField.test.js +47 -14
- package/lib/cjs/components/TreeView/TreeView.js +99 -11
- package/lib/cjs/components/TreeView/TreeView.stories.js +23 -10
- package/lib/cjs/components/TreeView/TreeView.styles.js +22 -2
- package/lib/cjs/components/TreeView/TreeView.test.js +91 -11
- package/lib/cjs/components/TreeView/TreeViewItem.js +112 -14
- package/lib/cjs/components/TreeView/TreeViewKeyboardDelegate.js +200 -0
- package/lib/cjs/components/TreeView/TreeViewKeyboardDelegate.test.js +511 -0
- package/lib/cjs/components/TreeView/TreeViewRow.js +20 -5
- package/lib/cjs/components/TreeView/TreeViewSection.js +164 -16
- package/lib/cjs/components/TreeView/TreeViewWrapper.js +40 -0
- package/lib/cjs/hooks/useImageUploadState/index.d.ts +1 -0
- package/lib/cjs/hooks/useImageUploadState/useImageUploadState.d.ts +28 -0
- package/lib/cjs/hooks/useImageUploadState/useImageUploadState.js +9 -6
- package/lib/cjs/hooks/useModalState/index.d.ts +1 -0
- package/lib/cjs/hooks/useModalState/useModalState.d.ts +21 -0
- package/lib/cjs/hooks/useModalState/useModalState.js +0 -9
- package/lib/cjs/hooks/useModalState/useModalState.test.d.ts +1 -0
- package/lib/cjs/hooks/useMountTransition/index.d.ts +1 -0
- package/lib/cjs/hooks/useMountTransition/useMountTransition.d.ts +14 -0
- package/lib/cjs/hooks/useMountTransition/useMountTransition.js +0 -9
- package/lib/cjs/hooks/useMountTransition/useMountTransition.test.d.ts +1 -0
- package/lib/cjs/hooks/useMountTransition/useMountTransition.test.js +2 -2
- package/lib/cjs/utils/testUtils/setupTests.d.ts +4 -0
- package/lib/cjs/utils/testUtils/testAxe.d.ts +2 -0
- package/lib/cjs/utils/testUtils/testTheme.d.ts +21 -0
- package/lib/cjs/utils/testUtils/testWrapper.d.ts +5 -0
- package/lib/cjs/utils/testUtils/testWrapper.js +3 -2
- package/lib/components/ImageUploadField/ImageUploadField.test.js +47 -14
- package/lib/components/TreeView/TreeView.js +100 -12
- package/lib/components/TreeView/TreeView.stories.js +23 -10
- package/lib/components/TreeView/TreeView.styles.js +22 -2
- package/lib/components/TreeView/TreeView.test.js +92 -12
- package/lib/components/TreeView/TreeViewItem.js +111 -14
- package/lib/components/TreeView/TreeViewKeyboardDelegate.js +176 -0
- package/lib/components/TreeView/TreeViewKeyboardDelegate.test.js +496 -0
- package/lib/components/TreeView/TreeViewRow.js +20 -5
- package/lib/components/TreeView/TreeViewSection.js +161 -16
- package/lib/components/TreeView/TreeViewWrapper.js +31 -0
- package/lib/hooks/useImageUploadState/useImageUploadState.js +9 -6
- package/lib/hooks/useModalState/useModalState.js +0 -10
- package/lib/hooks/useMountTransition/useMountTransition.js +0 -10
- package/lib/hooks/useMountTransition/useMountTransition.test.js +2 -2
- package/lib/utils/testUtils/testWrapper.js +3 -2
- 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
|
340
|
-
var
|
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
|
-
|
388
|
+
_context7.next = 6;
|
356
389
|
return screen.findByTestId(imageUploadImagePreview);
|
357
390
|
case 6:
|
358
|
-
imagePreview =
|
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
|
401
|
+
return _context7.stop();
|
369
402
|
}
|
370
|
-
},
|
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
|
415
|
+
test('should implement popover menu props', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
|
383
416
|
var imagePreview;
|
384
|
-
return _regeneratorRuntime().wrap(function
|
385
|
-
while (1) switch (
|
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
|
-
|
430
|
+
_context8.next = 4;
|
398
431
|
return screen.findByTestId(imageUploadImagePreview);
|
399
432
|
case 4:
|
400
|
-
imagePreview =
|
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
|
444
|
+
return _context8.stop();
|
412
445
|
}
|
413
|
-
},
|
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
|
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
|
-
|
108
|
-
|
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
|
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 {
|
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,
|
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
|
-
|
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,
|
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,
|
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
|
-
|
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
|
-
|
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
|
-
|
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,
|
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
|
-
|
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
|
});
|