@pingux/astro 2.9.2 → 2.13.0-alpha.10

package/lib/components/Table/Table.mdx

@@ -0,0 +1,30 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/Table/Table" />
+
+# Table
+
+Data tables display information in a grid-like format of rows and columns. 
+They organize information in a way that’s easy to scan so that users can look for patterns and develop insights from data. 
+
+Column header names describe the type of content displayed in each column. 
+Each row contains data related to a single entity.
+
+Tables should:
+- Have consistently aligned content.
+- Use multiple heading rows for higher-level grouping of the columns.
+- Use column dividers sparingly.
+
+Tables shouldn’t use different indicators to represent empty fields.
+
+This basic component is rendered as an HTML `<table>`, which accepts the `<TableBody>` component and the `<TableHead>` as children.
+
+### Required Components
+
+This component requires these additional components: 
+
+- TableCaption
+- TableHead
+- TableRow
+- TableCell
+- TableBody

package/lib/components/TableCell/TableCell.js

@@ -2,7 +2,6 @@ import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 var _excluded = ["children", "isHeading"];
 import React from 'react';
-import PropTypes from 'prop-types';
 import Box from '../Box';
 
 /**
@@ -23,8 +22,4 @@ var TableCell = function TableCell(props) {
     as: isHeading ? 'th' : 'td'
   }, others), children);
 };
-TableCell.propTypes = {
-  /** Determines whether or not the html rendered is a th or td element. */
-  isHeading: PropTypes.bool
-};
 export default TableCell;

package/lib/components/Tabs/Tabs.mdx

@@ -0,0 +1,40 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/Tabs/Tabs" />
+
+# Tabs
+
+The Tabs component is used to divide content and navigate to other views within the same page. 
+
+Tabs should:
+- Have only one active tab at a time.
+- Group similar content under each tab.
+
+Tabs shouldn’t be used as the primary method of navigation or for sequential content.
+
+### Required Components
+
+This component requires the Tab component.
+
+### Accessibility
+
+This component should adhere to the [WAI-ARIA Tabs](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/) accessibility guidelines. 
+
+#### Keyboard Navigation
+
+These keys provide additional functionality to the component. 
+
+| Keys | Function |
+| ---- | ---- |
+| Tab | The field is focusable using the Tab key and follows the page tab sequence. |
+| Arrow keys | When a tab is focused, tabs can be navigated using the left and right arrow keys. |
+| Shift + Tab | Moves focus to the previous focusable component.  |
+| Home(Fn + Right Arrow Key) Or Control/Command + Home| Shifts the focus to the first tab. |
+| End(Fn + Left Arrow Key) Or Control/Command + End | Shifts the focus to the last tab. |
+
+#### Screen Readers
+
+This component uses the following attributes to assist screen readers:
+- The **`aria-orientation`** attribute indicates whether the orientation is horizontal, vertical, unknown, or ambiguous. 
+- Each tab uses the **`aria-selected`** attribute to indicate the selection status, and the **`aria-control`** attribute is supplied with the associated panel ID that displays the content.
+- Each tab uses the **`aria-labelledby`** with the label ID to reference it.

package/lib/components/Tabs/Tabs.test.js

@@ -4,13 +4,13 @@ import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 var _excluded = ["name", "children"];
-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, $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 generator._invoke = function (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); } }; }(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 _context3; _forEachInstanceProperty(_context3 = ["next", "throw", "return"]).call(_context3, 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; this._invoke = function (method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); }; } function maybeInvokeDelegate(delegate, context) { var method = delegate.iterator[context.method]; if (undefined === method) { if (context.delegate = null, "throw" === context.method) { if (delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method)) return ContinueSentinel; context.method = "throw", context.arg = new TypeError("The iterator does not provide a 'throw' method"); } return 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, define(Gp, "constructor", GeneratorFunctionPrototype), define(GeneratorFunctionPrototype, "constructor", GeneratorFunction), 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 (object) { var 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 _context4; 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(_context4 = this.tryEntries).call(_context4, 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; }
+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 _context3; _forEachInstanceProperty(_context3 = ["next", "throw", "return"]).call(_context3, 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 _context4; 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(_context4 = this.tryEntries).call(_context4, 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; }
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
 import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
 import _setTimeout from "@babel/runtime-corejs3/core-js-stable/set-timeout";
-import _Symbol from "@babel/runtime-corejs3/core-js-stable/symbol";
 import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Symbol from "@babel/runtime-corejs3/core-js-stable/symbol";
 import _Object$create from "@babel/runtime-corejs3/core-js-stable/object/create";
 import _Object$getPrototypeOf from "@babel/runtime-corejs3/core-js-stable/object/get-prototype-of";
 import _Object$setPrototypeOf from "@babel/runtime-corejs3/core-js-stable/object/set-prototype-of";

package/lib/components/Text/Text.js

@@ -1,17 +1,16 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _styled from "@emotion/styled/base";
 import React from 'react';
-import PropTypes from 'prop-types';
 import { flexbox, layout, typography } from 'styled-system';
 import { Text as ThemeUIText } from 'theme-ui';
 import { textVariants } from '../../utils/devUtils/constants/variants';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var ExtendedText = /*#__PURE__*/_styled(ThemeUIText, process.env.NODE_ENV === "production" ? {
-  target: "eifd86o0"
+  target: "etvnvar0"
 } : {
-  target: "eifd86o0",
+  target: "etvnvar0",
   label: "ExtendedText"
-})(layout, flexbox, typography, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1RleHQvVGV4dC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRcUIiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvVGV4dC9UZXh0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgeyBmbGV4Ym94LCBsYXlvdXQsIHR5cG9ncmFwaHkgfSBmcm9tICdzdHlsZWQtc3lzdGVtJztcbmltcG9ydCB7IFRleHQgYXMgVGhlbWVVSVRleHQgfSBmcm9tICd0aGVtZS11aSc7XG5cbmltcG9ydCB7IHRleHRWYXJpYW50cyB9IGZyb20gJy4uLy4uL3V0aWxzL2RldlV0aWxzL2NvbnN0YW50cy92YXJpYW50cyc7XG5cbmNvbnN0IEV4dGVuZGVkVGV4dCA9IHN0eWxlZChUaGVtZVVJVGV4dCkobGF5b3V0LCBmbGV4Ym94LCB0eXBvZ3JhcGh5KTtcblxuY29uc3QgVGV4dCA9IFJlYWN0LmZvcndhcmRSZWYoKHByb3BzLCByZWYpID0+IChcbiAgPEV4dGVuZGVkVGV4dCB2YXJpYW50PVwiYmFzZVwiIHsuLi5wcm9wc30gcmVmPXtyZWZ9IC8+XG4pKTtcblxuVGV4dC5wcm9wVHlwZXMgPSB7XG4gIHZhcmlhbnQ6IFByb3BUeXBlcy5zdHJpbmcsXG59O1xuXG5cblRleHQuZGVmYXVsdFByb3BzID0ge1xuICB2YXJpYW50OiB0ZXh0VmFyaWFudHMuQkFTRSxcbn07XG5cblRleHQuZGlzcGxheU5hbWUgPSAnVGV4dCc7XG5cbmV4cG9ydCBkZWZhdWx0IFRleHQ7XG4iXX0= */");
+})(layout, flexbox, typography, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1RleHQvVGV4dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUXFCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1RleHQvVGV4dC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgZmxleGJveCwgbGF5b3V0LCB0eXBvZ3JhcGh5IH0gZnJvbSAnc3R5bGVkLXN5c3RlbSc7XG5pbXBvcnQgeyBUZXh0IGFzIFRoZW1lVUlUZXh0IH0gZnJvbSAndGhlbWUtdWknO1xuXG5pbXBvcnQgeyBUZXh0UHJvcHMgfSBmcm9tICcuLi8uLi90eXBlcyc7XG5pbXBvcnQgeyB0ZXh0VmFyaWFudHMgfSBmcm9tICcuLi8uLi91dGlscy9kZXZVdGlscy9jb25zdGFudHMvdmFyaWFudHMnO1xuXG5jb25zdCBFeHRlbmRlZFRleHQgPSBzdHlsZWQoVGhlbWVVSVRleHQpKFxuICBsYXlvdXQsXG4gIGZsZXhib3gsXG4gIHR5cG9ncmFwaHksXG4pO1xuXG5jb25zdCBUZXh0ID0gUmVhY3QuZm9yd2FyZFJlZigocHJvcHM6IFRleHRQcm9wcywgcmVmOiBSZWFjdC5SZWY8SFRNTERpdkVsZW1lbnQ+KSA9PiAoXG4gIDxFeHRlbmRlZFRleHQgdmFyaWFudD1cImJhc2VcIiB7Li4ucHJvcHN9IHJlZj17cmVmfSAvPlxuKSk7XG5cblRleHQuZGVmYXVsdFByb3BzID0ge1xuICB2YXJpYW50OiB0ZXh0VmFyaWFudHMuQkFTRSxcbn07XG5cblRleHQuZGlzcGxheU5hbWUgPSAnVGV4dCc7XG5cbmV4cG9ydCBkZWZhdWx0IFRleHQ7XG4iXX0= */");
 var Text = /*#__PURE__*/React.forwardRef(function (props, ref) {
   return ___EmotionJSX(ExtendedText, _extends({
     variant: "base"
@@ -19,9 +18,6 @@ var Text = /*#__PURE__*/React.forwardRef(function (props, ref) {
     ref: ref
   }));
 });
-Text.propTypes = {
-  variant: PropTypes.string
-};
 Text.defaultProps = {
   variant: textVariants.BASE
 };

package/lib/components/Text/Text.mdx

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/Text/Text" />
+
+# Text
+
+The Text component is used to display text and supports [Typography Props from Styled System](https://styled-system.com/table/#typography) from Styled System.
+
+Text should be adjusted in terms of font weight, size and formatting to emphasize hierarchy, and shouldn’t: rely only on color to convey importance.
+
+### Required Components
+
+This component can be used independently and does not require additional components.

package/lib/components/TextAreaField/TextAreaField.mdx

@@ -0,0 +1,34 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/TextAreaField/TextAreaField" />
+
+# TextAreaField
+
+The TextAreaField component combines a text area, label, and helper text for a resizable field, which is suitable for long plain-text input. 
+
+This field should:
+- Be used to accommodate varying amounts of text that can span multiple lines, such as a description, message, comments, or feedback.
+- Use the maxLength prop for character limitations.
+
+This field shouldn’t:
+- Be used when the character count fits in a single line. Use the [TextField](./?path=/docs/form-textfield--default) component instead.
+- Use quiet styles, such as a blended background with only a bottom border, for fixed height. Since it is taller and wider than most components, it might be harder to interact with it without visual cues.
+
+### Required components
+
+This component can be used independently and does not require additional components. 
+
+### Accessibility
+
+#### Keyboard Navigation
+
+These keys provide additional functionality to the component. 
+
+| Keys | Functions |
+| ---- | --------- |
+| Tab | The field is focusable using the Tab key and follows the page tab sequence. |
+| Shift + Tab | Moves focus to the previous focusable component. |
+
+#### Screen readers
+
+This component uses the **`aria-labelledby`** attribute pointing to the label, and the **`aria-invalid`** attribute to detect incorrect values or status errors, which is set to “False” by default.

package/lib/components/TextField/TextField.js

@@ -62,7 +62,7 @@ var TextField = /*#__PURE__*/forwardRef(function (props, ref) {
     ref: inputRef
   }, fieldControlInputProps, {
     "aria-invalid": status === 'error' && true,
-    "aria-describedby": helperText && helperTextId
+    "aria-describedby": [helperText && helperTextId, fieldControlInputProps['aria-describedby']].join(fieldControlInputProps['aria-describedby'] ? ' ' : '')
   })), slots === null || slots === void 0 ? void 0 : slots.inContainer), helperText && ___EmotionJSX(FieldHelperText, {
     status: status,
     id: helperTextId

package/lib/components/TextField/TextField.mdx

@@ -0,0 +1,34 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/TextField/TextField" />
+
+# TextField
+
+The component combines a text input, label, and helper text to enter, read or edit data.
+
+TextField should be used:
+- To enter no more than a single line of text.
+- To input unique information known only to the user and is difficult to predict with preset options.
+- When the data can be entered easily in a free format rather than using complex controls.
+- WithSlots props to insert extra UI elements.
+
+TextField shouldn’t be used to collect text longer than a single line. Use the [TextAreaField](./?path=/docs/form-textareafield--default) component instead.
+
+### Required components
+
+This component can be used independently and does not require additional components. 
+
+### Accessibility
+
+#### Keyboard Navigation
+
+These keys provide additional functionality to the component. 
+
+| Keys | Functions |
+| ---- | --------- |
+| Tab | The field is focusable using the Tab key and follows the page tab sequence. |
+| Shift + Tab | Moves focus to the previous focusable component. |
+
+#### Screen readers
+
+This component uses the **`aria-labelledby`** attribute pointing to the label, and the **`aria-invalid`** attribute to detect incorrect values or status errors, which is set to “False” by default.

package/lib/components/TimeZonePicker/TimeZonePicker.mdx

@@ -0,0 +1,18 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/TimeZonePicker/TimeZonePicker" />
+
+# TimeZonePicker
+
+This component allows users to choose a timezone from a [list of timezones](https://github.com/yury-dymov/react-bootstrap-timezone-picker/blob/master/src/timezones.json). 
+It uses the [ComboBoxField](./?path=/docs/form-comboboxfield--default) component and its props. 
+
+The TimeZonePicker should be used for searching and filtering through the available timezones. Use the additonalTimeZones prop to add a new timezone.
+
+### Required components
+
+This component can be used independently and does not require additional components. 
+
+### Accessibility
+
+The component follows the same accessibility patterns as [ComboBoxField](./?path=/docs/form-comboboxfield--default).

package/lib/components/TooltipTrigger/Tooltip.styles.js

@@ -11,7 +11,7 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { baseBadge } from '../Badge/Badge.styles';
 import { text } from '../Button/Buttons.styles';
-var container = {
+export var container = {
   maxWidth: '11.3em',
   maxHeight: '15em',
   overflow: 'hidden',

package/lib/components/TooltipTrigger/TooltipTrigger.js

@@ -87,6 +87,8 @@ TooltipTrigger.propTypes = {
   /** The additional offset applied along the cross axis
    * between the element and its anchor element. */
   crossOffset: PropTypes.number,
+  /** Amount of time before the tooltip disappears */
+  closeDelay: PropTypes.number,
   /** Amount of time before the tooltip shows */
   delay: PropTypes.number,
   /** Where the popover menu opens relative to its trigger. */

package/lib/components/TooltipTrigger/TooltipTrigger.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/TooltipTrigger/TooltipTrigger" />
+
+# TooltipTrigger
+
+The TooltipTrigger is a composed component that displays additional information on hover, click or focus. 
+This component is typically used as a design fallback for contextual information that may be hard to convey otherwise. It can also be disabled without disabling button-press events.
+
+This component should provide useful, supplementary information or clarification regarding the element it points to. 
+It shouldn’t contain essential content, error or feedback messages, or action items.
+
+Tooltips cannot contain interactive content (links, buttons) according to the [ARIA Authoring Practices Guide](https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/).
+
+### Required Components
+
+This component requires the [Button](./?path=/docs/components-button--default) and Tooltip components.
+
+### Accessibility
+
+#### Screen Readers
+
+The trigger button uses the **`aria-describedby`** attribute with the tooltip container ID to announce the screen reader content when it becomes visible.

package/lib/components/TooltipTrigger/TooltipTrigger.test.js

@@ -1,9 +1,21 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Symbol from "@babel/runtime-corejs3/core-js-stable/symbol";
+import _Object$create from "@babel/runtime-corejs3/core-js-stable/object/create";
+import _Object$getPrototypeOf from "@babel/runtime-corejs3/core-js-stable/object/get-prototype-of";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$setPrototypeOf from "@babel/runtime-corejs3/core-js-stable/object/set-prototype-of";
+import _Promise from "@babel/runtime-corejs3/core-js-stable/promise";
+import _reverseInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/reverse";
+import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
+import _typeof from "@babel/runtime-corejs3/helpers/esm/typeof";
+import _asyncToGenerator from "@babel/runtime-corejs3/helpers/esm/asyncToGenerator";
+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 _context2; _forEachInstanceProperty(_context2 = ["next", "throw", "return"]).call(_context2, 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 _context3; 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(_context3 = this.tryEntries).call(_context3, 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; }
 import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { Button, Tooltip, TooltipTrigger } from '../../index';
 import theme from '../../styles/theme';
 import axeTest from '../../utils/testUtils/testAxe';
-import { fireEvent, render, screen } from '../../utils/testUtils/testWrapper';
+import { fireEvent, render, screen, waitFor } from '../../utils/testUtils/testWrapper';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -78,4 +90,38 @@ test('passing in width applies the correct width to the container', function ()
   });
   var arrow = screen.getByTestId('popover-container');
   expect(arrow).toHaveStyle('width: 100px');
-});
+});
+test('tooltip closes after closeDelay when mouse leaves trigger', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+  var closeDelay, button;
+  return _regeneratorRuntime().wrap(function _callee$(_context) {
+    while (1) {
+      switch (_context.prev = _context.next) {
+        case 0:
+          closeDelay = 5000;
+          getComponent({
+            closeDelay: closeDelay
+          });
+          button = screen.getByRole('button');
+          fireEvent.mouseEnter(button);
+          expect(screen.queryByRole('tooltip')).toBeInTheDocument();
+          fireEvent.mouseLeave(button);
+          _context.next = 8;
+          return waitFor(function () {
+            expect(screen.queryByRole('tooltip')).toBeInTheDocument();
+          }, {
+            timeout: closeDelay / 2 + 100
+          });
+        case 8:
+          _context.next = 10;
+          return waitFor(function () {
+            expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
+          }, {
+            timeout: closeDelay + 100
+          });
+        case 10:
+        case "end":
+          return _context.stop();
+      }
+    }
+  }, _callee);
+})));

package/lib/docs/Props.stories.mdx

@@ -0,0 +1,35 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Docs/Props" />
+
+## Understanding Astro Props
+
+Most of the Astro components can be customized through props which are documented in there respective component examples. If you want to pass your own custom props to an Astro component many components have wrapperProps, containerProps, and controlProps designed just for this.
+
+- **containerProps:** an object that gets spread to the outermost container commonly used for passing styles
+- **wrapperProps:** an object that gets spread to the container directly wrapping and input field
+- **controlProps:** an object that gets spread to an input field
+
+```
+const ExampleComponent = ({
+ containerProps,
+ controlProps,
+ wrapperProps,
+}) => (
+   <ContainerBox {...containerProps}>
+     <Box {...wrapperProps}>
+       <input type="text" {...controlProps} />
+     </Box>
+   </ContainerBox>
+ );
+};
+```
+
+Most of the Field/Input components have the following props, see the individual component for more details: 
+- `isDisabled`
+- `isOpen`
+- `isReadOnly`
+- `isRequired`
+- `onChange`
+- `onFocus`
+- `onFocusChange`

package/lib/docs/Welcome.stories.mdx

@@ -0,0 +1,149 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Docs/Welcome" />
+
+# Welcome to Astro
+
+<br />
+
+## Introduction
+
+Astro is a lightweight, composable, and themeable React component library. Astro was created to help developers and designers create consistent, user-friendly, and accessible UIs across all Ping products.
+
+<br />
+
+## Getting Started
+
+<br />
+
+### Installing
+
+To consume Astro within your own project, install it via NPM or Yarn.
+
+NPM: 
+`npm install @pingux/astro`
+
+Yarn: 
+`yarn add @pingux/astro`
+
+### Requirements
+
+- Node: 18+
+- React: 16.8+
+
+### Usage
+
+All apps should be wrapped in an `<AstroWrapper>` for full functionality and styling.
+
+```
+import { AstroWrapper } from ‘@pingux/astro’;
+
+<AstroWrapper>
+  <App />
+</AstroWrapper>
+```
+
+### Running Storybook Locally
+
+Astro uses [Storybook](https://storybook.js.org/) for component documentation. Once Astro has been cloned, run the following commands to start a local Storybook server:
+
+`yarn && yarn start`
+
+The Storybook server defaults to `https://localhost:6006`. This port can be customized by running the command start -p 9009. For example, this will start Storybook on port 9009. More information on customizing Storybook CLI options can be found at the [Storybook docs](https://storybook.js.org/docs/react/api/cli-options). 
+
+Component prop documentation is available under the “documentation” tab per each component story. Most props can be toggled and configured for preview purposes within the prop table.
+For example, to view the disabled button styling, navigate to the Button story’s props table, locate the “isDisabled” prop, and toggle to “true”. This change allows you to preview the disabled button’s styling and functionality.
+
+There are two options to view the source code for stories within Storybook:
+- While on the "Documentation" tab, click the tab below the rendered story labelled "Show Code". This option may not show the entire source code for a story.
+- To view the entire source code of a story:
+    - Click the ellipsis menu next to the version number located at the top of the navigation menu. 
+    - Click "Show Addons" or ensure this option has been previously enabled.
+    - Navigate to a story's "Canvas" tab. Select "Story" from the now displaying add-on panel. More information on this add-on can be found here: [Story Source Add-on](https://storybook.js.org/addons/@storybook/addon-storysource#displaying-full-source)
+
+
+
+
+## Libraries used within Astro
+
+<br />
+
+- [React Aria](https://react-spectrum.adobe.com/react-aria/index.html) / [React Stately](https://react-spectrum.adobe.com/react-stately/index.html) / [React Spectrum](https://react-spectrum.adobe.com/react-spectrum/index.html)
+- [ThemeUI](https://theme-ui.com/)
+- [Styled System](https://styled-system.com/)
+
+<br />
+
+## Components
+
+<br />
+
+Astro is a library of small composable components that can be combined in many ways to create many more complex components. You can read more about the composition model in the [React Docs](https://reactjs.org/docs/composition-vs-inheritance.html). 
+
+Beyond the composable components, Astro also has form components to be used for gathering user input. Form components consist of field components and base components. Field components are composed from base components which are the building blocks used to compose form inputs.
+
+<br />
+
+## Understanding Astro Props
+
+<br />
+
+Most Astro components can be customized through props, find [more details here](./?path=/story/docs-props--page). 
+
+<br />
+
+## Theming
+
+<br />
+
+You can customize the base Astro theme by [creating theme overrides](./?path=/docs/docs-theme-custom-themes--page). 
+You can find the default [Astro theme here](./?path=/docs/docs-theme-astro-theme--page).
+
+<br />
+
+## Styling
+
+<br />
+
+Astro uses [styled-system,](https://styled-system.com/table/) a javascript dependency that facilitates the building of custom UI components by adding constraint-based style props based on scales defined in the theme. This can be used to quickly add custom styling to components.
+
+The Ping UX Dev team follows best practices related to styling as outlined in the [Styling Guidelines](./?path=/story/docs-theme-styling-guideline--page). These best practices encourage the separation of component code from styling code. This practice removes the custom styles that are applied in StoryBook code examples. If you want to see how the Astro team applies custom styles to our recipes you can find the entire story code file in the Story section of the Addons panel. 
+- Select **Show Addons** in the Storybook menu, located in the left navigation panel at the top beside the “@pingux/astro” title (it’s a circle with 3 dots).
+- Inside the **Addon panel** that pops up, select the **Story panel** to see the full code file.
+
+<br />
+
+## Development Notes
+
+<br />
+
+There is currently a [known conflict](https://github.com/adobe/react-spectrum/issues/779) between React.StrictMode and react-spectrum. The current recommended solution is to avoid using StrictMode in your apps. In the latest versions of Create React App the app is wrapped in StrictMode by default, this should be removed if you’re using any of the react-spectrum or pingux libraries. We will monitor this issue and make updates when possible.
+
+<br />
+
+## Help
+
+<br />
+
+For assistance with the Astro library reach out to the Astro team on Slack
+- #ui-astro
+- #ux-forum
+
+<br />
+
+
+## Browser Compatibility
+
+<br />
+
+Astro fully supports the following browsers and versions:
+
+| Browser     | Version     |
+| ----------- | ----------- |
+| Chrome      | 80+         |
+| Firefox     | 76+         |
+| Safari      | 12+         |
+| Edge        | 44+         |
+
+
+Support for IE11 is left up to developers and is not tested by the Astro team. Polyfills are necessary for full functionality.