@pingux/astro 1.27.0-alpha.25 → 1.27.0-alpha.26

package/lib/components/TextField/TextField.test.js

@@ -0,0 +1,137 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import TextField from '.';
+import axeTest from '../../utils/testUtils/testAxe';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+var testId = 'test-text-field';
+var testLabel = 'Test Label';
+var defaultProps = {
+  'data-testid': testId,
+  label: testLabel
+};
+
+var getComponent = function getComponent() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return render(___EmotionJSX(TextField, _extends({}, defaultProps, props)));
+}; // Need to be added to each test file to test accessibility using axe.
+
+
+axeTest(getComponent);
+test('default text field', function () {
+  getComponent();
+  var field = screen.getByTestId(testId);
+  var label = screen.getByText(testLabel);
+  var control = screen.getByLabelText(testLabel);
+  expect(field).toBeInstanceOf(HTMLDivElement);
+  expect(label).toBeInstanceOf(HTMLLabelElement);
+  expect(control).toBeInstanceOf(HTMLInputElement);
+  expect(field).toBeInTheDocument();
+  expect(label).toBeInTheDocument();
+  expect(control).toBeInTheDocument();
+});
+test('text field with left label', function () {
+  getComponent({
+    labelMode: 'left'
+  });
+  var label = screen.getByText(testLabel);
+  expect(label).toHaveClass('is-left-label');
+});
+test('text field with helper text', function () {
+  var helperText = 'helper text';
+  getComponent({
+    helperText: helperText
+  });
+  var helper = screen.getByText(helperText);
+  expect(helper).toBeInTheDocument();
+});
+test('label will receive gridRow attribute if it will be higher than input', function () {
+  var originalOffsetHeight = _Object$getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetHeight');
+
+  _Object$defineProperties(window.HTMLElement.prototype, {
+    offsetHeight: {
+      get: function get() {
+        return this.tagName === 'LABEL' ? 500 : 100;
+      }
+    }
+  });
+
+  getComponent();
+  expect(screen.getByText(defaultProps.label)).toHaveStyle('grid-row: 1/5');
+
+  _Object$defineProperty(HTMLElement.prototype, 'offsetHeight', originalOffsetHeight);
+});
+test('form wrapper will have default max label column width when no custom width set', function () {
+  var labelMode = 'left';
+  getComponent({
+    labelMode: labelMode
+  });
+  var textAreaContainer = screen.getByTestId(testId);
+  expect(textAreaContainer).toHaveStyle('grid-template-columns: 40% auto');
+});
+test('form wrapper will have a max label column width when custom width set', function () {
+  var labelMode = 'left';
+  var containerProps = {
+    sx: {
+      gridTemplateColumns: '120px auto'
+    }
+  };
+  getComponent({
+    labelMode: labelMode,
+    containerProps: containerProps
+  });
+  var textAreaContainer = screen.getByTestId(testId);
+  expect(textAreaContainer).toHaveStyle('grid-template-columns: 120px auto');
+});
+test('text aria container have class name when value is provided', function () {
+  var labelMode = 'float';
+  getComponent({
+    labelMode: labelMode,
+    value: 'text'
+  });
+  var textAreaContainer = screen.getByTestId(testId);
+  expect(textAreaContainer.className).toMatch('has-value');
+});
+test('text aria container have class name when default value is provided', function () {
+  var labelMode = 'float';
+  getComponent({
+    labelMode: labelMode,
+    defaultValue: 'text'
+  });
+  var textAreaContainer = screen.getByTestId(testId);
+  expect(textAreaContainer.className).toMatch('has-value');
+});
+test('text aria container have class name when placeholder is provided', function () {
+  var labelMode = 'float';
+  getComponent({
+    labelMode: labelMode,
+    placeholder: 'text'
+  });
+  var textAreaContainer = screen.getByTestId(testId);
+  expect(textAreaContainer.className).toMatch('has-value');
+});
+test('text aria container have class name when placeholder is provided and value was entered and then removed', function () {
+  var labelMode = 'float';
+  getComponent({
+    labelMode: labelMode,
+    placeholder: 'text'
+  });
+  var textAreaContainer = screen.getByTestId(testId);
+  var inputControl = screen.getByLabelText(testLabel);
+  expect(textAreaContainer).toHaveClass('has-value');
+  userEvent.type(inputControl, 'test text{enter}');
+  expect(textAreaContainer).toHaveClass('has-value');
+  userEvent.clear(inputControl);
+  expect(textAreaContainer).toHaveClass('has-value');
+});
+test('text field container and input have is-read-only class name when isReadOnly prop provided', function () {
+  getComponent({
+    isReadOnly: true
+  });
+  var control = screen.getByLabelText(testLabel);
+  expect(control).toHaveClass('is-read-only');
+});

package/lib/components/TextField/index.js

@@ -0,0 +1 @@
+export { default } from './TextField';

package/lib/components/TimeZonePicker/TimeZonePicker.js

@@ -0,0 +1,254 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
+import _sortInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/sort";
+import _parseFloat from "@babel/runtime-corejs3/core-js-stable/parse-float";
+import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$entries from "@babel/runtime-corejs3/core-js-stable/object/entries";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
+var _excluded = ["additionalTimeZones", "emptySearchText", "locales", "localeOptions"];
+
+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; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context8, _context9; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context8 = ownKeys(Object(source), !0)).call(_context8, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context9 = ownKeys(Object(source))).call(_context9, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import PropTypes from 'prop-types';
+import defaultTimezones, { usCities } from './timezones.js';
+import { Box, ComboBoxField, Item, Text } from '../../index';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var createSearchTags = function createSearchTags(_ref) {
+  var _context, _context2, _context3, _context4;
+
+  var gmt = _ref.gmt,
+      gmtLabel = _ref.gmtLabel,
+      timeZone = _ref.timeZone;
+  var additionalTags = '';
+  var americaTimeZone = _includesInstanceProperty(timeZone).call(timeZone, 'America') && timeZone.substring(8);
+
+  if (_includesInstanceProperty(usCities).call(usCities, americaTimeZone)) {
+    additionalTags = "US ".concat(americaTimeZone);
+  }
+
+  return _concatInstanceProperty(_context = _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = _concatInstanceProperty(_context4 = "".concat(gmt, " ")).call(_context4, gmtLabel, " ")).call(_context3, timeZone, " ")).call(_context2, timeZone === null || timeZone === void 0 ? void 0 : timeZone.replace(/_/g, ' '), " ")).call(_context, additionalTags);
+};
+
+var getLocaleTime = function getLocaleTime(_ref2) {
+  var timeZone = _ref2.timeZone,
+      locales = _ref2.locales,
+      localeOptions = _ref2.localeOptions;
+  var date = new Date();
+  return date.toLocaleTimeString(locales, _objectSpread({
+    timeZone: timeZone
+  }, localeOptions));
+};
+
+var getTimezoneOffset = function getTimezoneOffset(timeZone) {
+  var now = new Date();
+  var tzString = now.toLocaleString('en-US', {
+    timeZone: timeZone
+  });
+  var localString = now.toLocaleString('en-US');
+  var diff = (Date.parse(localString) - Date.parse(tzString)) / 3600000;
+  var offset = -(diff + now.getTimezoneOffset() / 60);
+  var formattedString = "".concat(offset, ":00");
+  return offset > 0 ? "+".concat(formattedString) : formattedString;
+};
+/**
+ *  Component allows users to choose a timezone from the list.
+ *  You can checkout the default timezones list [here](https://github.com/yury-dymov/react-bootstrap-timezone-picker/blob/master/src/timezones.json).
+ *
+ *  Utilizes ComboBoxField component. You can use the same props as with
+ *  the ComboBoxField - they will be spread into it.
+ */
+
+
+var TimeZonePicker = /*#__PURE__*/forwardRef(function (props, ref) {
+  var additionalTimeZones = props.additionalTimeZones,
+      emptySearchText = props.emptySearchText,
+      locales = props.locales,
+      localeOptions = props.localeOptions,
+      otherProps = _objectWithoutProperties(props, _excluded);
+
+  var _useState = useState(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      search = _useState2[0],
+      setSearch = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      timeUpdate = _useState4[0],
+      setTimeUpdate = _useState4[1];
+
+  var _useState5 = useState([]),
+      _useState6 = _slicedToArray(_useState5, 2),
+      timeZones = _useState6[0],
+      setTimeZones = _useState6[1];
+
+  var extendedTimeZonesList = additionalTimeZones ? _objectSpread(_objectSpread({}, defaultTimezones), additionalTimeZones) : defaultTimezones;
+  var timeZonePickerRef = useRef();
+  /* istanbul ignore next */
+
+  useImperativeHandle(ref, function () {
+    return timeZonePickerRef.current;
+  });
+  useEffect(function () {
+    if (timeUpdate) {
+      var createTimeZoneTimes = function createTimeZoneTimes() {
+        var _context5;
+
+        return _mapInstanceProperty(_context5 = _Object$entries(extendedTimeZonesList)).call(_context5, function (item) {
+          var _item$;
+
+          var gmt = "GMT".concat(getTimezoneOffset(item[1]));
+          var gmtLabel = item[0].substring(12);
+          var timeZone = (_item$ = item[1]) === null || _item$ === void 0 ? void 0 : _item$.replace(/_/g, ' ');
+          var time = getLocaleTime({
+            timeZone: item[1],
+            locales: locales,
+            localeOptions: localeOptions
+          });
+          var searchTags = createSearchTags({
+            gmt: gmt,
+            gmtLabel: gmtLabel,
+            timeZone: timeZone
+          });
+          return {
+            gmt: gmt,
+            timeZone: timeZone,
+            time: time,
+            searchTags: searchTags
+          };
+        });
+      };
+
+      setTimeZones(createTimeZoneTimes());
+      setTimeUpdate(false);
+    }
+  }, [extendedTimeZonesList, locales, localeOptions, timeUpdate]);
+  var filterTimezones = useCallback(function (timeZonesList) {
+    return _filterInstanceProperty(timeZonesList).call(timeZonesList, function (_ref3) {
+      var _context6;
+
+      var searchTags = _ref3.searchTags;
+      return _indexOfInstanceProperty(_context6 = searchTags.toUpperCase()).call(_context6, search.toUpperCase()) > -1;
+    });
+  }, [search]);
+  var filteredTimezones = useMemo(function () {
+    return filterTimezones(timeZones);
+  }, [filterTimezones, timeZones]);
+
+  var sortByGMT = function sortByGMT(a, b) {
+    var aNum = _parseFloat(a.gmt.split('GMT')[1].split(':')[0]);
+
+    var bNum = _parseFloat(b.gmt.split('GMT')[1].split(')')[0]);
+
+    return aNum - bNum;
+  };
+
+  var checkIsSelectedItem = function checkIsSelectedItem() {
+    return _filterInstanceProperty(timeZones).call(timeZones, function (tz) {
+      return tz.timeZone === search;
+    }).length > 0;
+  };
+
+  var renderTimeZones = function renderTimeZones(timeZonesToRender) {
+    var _context7;
+
+    return _mapInstanceProperty(_context7 = _sortInstanceProperty(timeZonesToRender).call(timeZonesToRender, sortByGMT)).call(_context7, function (_ref4) {
+      var gmt = _ref4.gmt,
+          time = _ref4.time,
+          timeZone = _ref4.timeZone;
+      return ___EmotionJSX(Item, {
+        key: timeZone,
+        "data-id": timeZone,
+        textValue: timeZone
+      }, ___EmotionJSX(Box, {
+        flexDirection: "row",
+        justifyContent: "space-between",
+        width: "100%"
+      }, ___EmotionJSX(Box, {
+        flexDirection: "row"
+      }, ___EmotionJSX(Text, {
+        variant: "timeZone.title"
+      }, timeZone), ___EmotionJSX(Text, {
+        variant: "timeZone.subTitle"
+      }, gmt)), ___EmotionJSX(Box, null, ___EmotionJSX(Text, {
+        variant: "timeZone.time"
+      }, time))));
+    });
+  };
+
+  var items = useMemo(function () {
+    if (filteredTimezones.length === 0) {
+      return ___EmotionJSX(Item, {
+        key: emptySearchText
+      }, emptySearchText);
+    }
+
+    return renderTimeZones(checkIsSelectedItem() ? timeZones : filteredTimezones);
+  }, [emptySearchText, filteredTimezones, search, timeZones]);
+  var comboBoxFieldProps = useMemo(function () {
+    return _objectSpread({
+      controlProps: {
+        sx: {
+          width: 400,
+          fontSize: 'md'
+        }
+      },
+      onInputChange: setSearch,
+      items: filteredTimezones,
+      ref: timeZonePickerRef,
+      onOpenChange: function onOpenChange(isOpen) {
+        return setTimeUpdate(isOpen);
+      },
+      disabledKeys: [{
+        emptySearchText: emptySearchText
+      }]
+    }, otherProps);
+  }, [emptySearchText, filteredTimezones, otherProps]);
+  return ___EmotionJSX(ComboBoxField, _extends({}, comboBoxFieldProps, {
+    disabledKeys: [emptySearchText],
+    menuTrigger: "focus"
+  }), items);
+});
+TimeZonePicker.propTypes = {
+  /**
+   * An object representing additional time zones to merge with the [default list](https://github.com/yury-dymov/react-bootstrap-timezone-picker/blob/master/src/timezones.json).
+   * The key may be customized, but the value should be a timezone string from the list in the [Time Zone Database](https://www.iana.org/time-zones).
+   *
+   * e.g. `{'(GMT+02:00) Africa/Juba': 'Africa/Juba'}`
+   */
+  additionalTimeZones: PropTypes.shape({}),
+
+  /** Text that will be shown if no search results are found. */
+  emptySearchText: PropTypes.string,
+
+  /** Locale(s) to use when generating the time format. See [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString#using_locales) for more info. */
+  locales: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
+
+  /** Custom options to use when generating the time format. See [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString#using_options) for more info. */
+  localeOptions: PropTypes.shape({})
+};
+TimeZonePicker.defaultProps = {
+  emptySearchText: 'No Search Result',
+  locales: [],
+  localeOptions: {
+    hour12: true,
+    hour: '2-digit',
+    minute: '2-digit'
+  }
+};
+export default TimeZonePicker;

package/lib/components/TimeZonePicker/TimeZonePicker.stories.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import TimeZonePicker from './TimeZonePicker';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export default {
+  title: 'Form/TimeZonePicker',
+  component: TimeZonePicker
+};
+export var Default = function Default() {
+  return ___EmotionJSX(TimeZonePicker, {
+    label: "Default Example"
+  });
+};
+export var WithCustomTimeZone = function WithCustomTimeZone() {
+  var customTimeZone = {
+    '(GMT+02:00) Africa/Juba': 'Africa/Juba'
+  };
+  return ___EmotionJSX(TimeZonePicker, {
+    additionalTimeZones: customTimeZone,
+    label: "With Custom Time Zone (Africa/Juba)"
+  });
+};

package/lib/components/TimeZonePicker/TimeZonePicker.test.js

@@ -0,0 +1,80 @@
+import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
+import React from 'react';
+import userEvent from '@testing-library/user-event';
+import { render, screen } from '../../utils/testUtils/testWrapper';
+import { TimeZonePicker, OverlayProvider } from '../../index';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+var testTimeZoneJuba = 'Africa/Juba';
+var testTimeZoneApia = 'Pacific/Apia';
+var defaultProps = {
+  label: 'Test Label'
+};
+
+var getComponent = function getComponent() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+      _ref$renderFn = _ref.renderFn,
+      renderFn = _ref$renderFn === void 0 ? render : _ref$renderFn;
+
+  return renderFn(___EmotionJSX(OverlayProvider, null, ___EmotionJSX(TimeZonePicker, _extends({}, defaultProps, props))));
+};
+
+beforeAll(function () {
+  jest.spyOn(window.HTMLElement.prototype, 'clientWidth', 'get').mockImplementation(function () {
+    return 1000;
+  });
+  jest.spyOn(window.HTMLElement.prototype, 'clientHeight', 'get').mockImplementation(function () {
+    return 1000;
+  });
+  window.HTMLElement.prototype.scrollIntoView = jest.fn();
+  jest.spyOn(window.screen, 'width', 'get').mockImplementation(function () {
+    return 1024;
+  });
+  jest.spyOn(window, 'requestAnimationFrame').mockImplementation(function (cb) {
+    return cb();
+  });
+  jest.useFakeTimers();
+});
+afterEach(function () {
+  jest.clearAllMocks();
+});
+afterAll(function () {
+  jest.restoreAllMocks();
+});
+test('renders ComboBoxField component', function () {
+  getComponent();
+  var input = screen.queryByRole('combobox');
+  var label = screen.getByText(defaultProps.label);
+  var button = screen.queryByRole('button');
+  expect(input).toBeInTheDocument();
+  expect(screen.queryAllByLabelText(defaultProps.label)).toEqual([input, button]);
+  expect(label).toBeInTheDocument();
+  expect(label).toHaveTextContent(defaultProps.label);
+  expect(button).toBeInTheDocument();
+});
+test('search is working correctly', function () {
+  getComponent();
+  var input = screen.queryByRole('combobox');
+  userEvent.type(input, testTimeZoneApia);
+  expect(screen.getByText(testTimeZoneApia)).toBeInTheDocument();
+});
+test('custom timezone can be added', function () {
+  getComponent({
+    additionalTimeZones: {
+      '(GMT+02:00) Africa/Juba': testTimeZoneJuba
+    }
+  });
+  var input = screen.queryByRole('combobox');
+  userEvent.type(input, testTimeZoneJuba);
+  expect(screen.getByText(testTimeZoneJuba)).toBeInTheDocument();
+});
+test('shows custom empty search state text when no items are found', function () {
+  var testEmptyText = 'test empty text';
+  getComponent({
+    emptySearchText: testEmptyText
+  });
+  var input = screen.queryByRole('combobox');
+  userEvent.type(input, 'awdasrf213');
+  expect(screen.getByText(testEmptyText)).toBeInTheDocument();
+});

package/lib/components/TimeZonePicker/index.js

@@ -0,0 +1 @@
+export { default } from './TimeZonePicker';

package/lib/components/TimeZonePicker/timezones.js

@@ -0,0 +1,112 @@
+export default {
+  '(GMT-11:00) Pago Pago': 'Pacific/Pago_Pago',
+  '(GMT-10:00) Hawaii Time': 'Pacific/Honolulu',
+  '(GMT-08:00) Pacific Time': 'America/Los_Angeles',
+  '(GMT-08:00) Pacific Time - Tijuana': 'America/Tijuana',
+  '(GMT-07:00) Mountain Time': 'America/Denver',
+  '(GMT-07:00) Mountain Time - Arizona': 'America/Phoenix',
+  '(GMT-07:00) Mountain Time - Chihuahua, Mazatlan': 'America/Mazatlan',
+  '(GMT-06:00) Central Time': 'America/Chicago',
+  '(GMT-06:00) Central Time - Mexico City': 'America/Mexico_City',
+  '(GMT-06:00) Central Time - Regina': 'America/Regina',
+  '(GMT-06:00) Guatemala': 'America/Guatemala',
+  '(GMT-05:00) Bogota': 'America/Bogota',
+  '(GMT-05:00) Eastern Time': 'America/New_York',
+  '(GMT-05:00) Lima': 'America/Lima',
+  '(GMT-04:30) Caracas': 'America/Caracas',
+  '(GMT-04:00) Atlantic Time - Halifax': 'America/Halifax',
+  '(GMT-04:00) Guyana': 'America/Guyana',
+  '(GMT-04:00) La Paz': 'America/La_Paz',
+  '(GMT-03:00) Buenos Aires': 'America/Argentina/Buenos_Aires',
+  '(GMT-03:00) Godthab': 'America/Godthab',
+  '(GMT-03:00) Montevideo': 'America/Montevideo',
+  '(GMT-03:30) Newfoundland Time - St. Johns': 'America/St_Johns',
+  '(GMT-03:00) Santiago': 'America/Santiago',
+  '(GMT-02:00) Sao Paulo': 'America/Sao_Paulo',
+  '(GMT-02:00) South Georgia': 'Atlantic/South_Georgia',
+  '(GMT-01:00) Azores': 'Atlantic/Azores',
+  '(GMT-01:00) Cape Verde': 'Atlantic/Cape_Verde',
+  '(GMT+00:00) Casablanca': 'Africa/Casablanca',
+  '(GMT+00:00) Dublin': 'Europe/Dublin',
+  '(GMT+00:00) Lisbon': 'Europe/Lisbon',
+  '(GMT+00:00) London': 'Europe/London',
+  '(GMT+00:00) Monrovia': 'Africa/Monrovia',
+  '(GMT+01:00) Algiers': 'Africa/Algiers',
+  '(GMT+01:00) Amsterdam': 'Europe/Amsterdam',
+  '(GMT+01:00) Berlin': 'Europe/Berlin',
+  '(GMT+01:00) Brussels': 'Europe/Brussels',
+  '(GMT+01:00) Budapest': 'Europe/Budapest',
+  '(GMT+01:00) Central European Time - Belgrade': 'Europe/Belgrade',
+  '(GMT+01:00) Central European Time - Prague': 'Europe/Prague',
+  '(GMT+01:00) Copenhagen': 'Europe/Copenhagen',
+  '(GMT+01:00) Madrid': 'Europe/Madrid',
+  '(GMT+01:00) Paris': 'Europe/Paris',
+  '(GMT+01:00) Rome': 'Europe/Rome',
+  '(GMT+01:00) Stockholm': 'Europe/Stockholm',
+  '(GMT+01:00) Vienna': 'Europe/Vienna',
+  '(GMT+01:00) Warsaw': 'Europe/Warsaw',
+  '(GMT+02:00) Athens': 'Europe/Athens',
+  '(GMT+02:00) Bucharest': 'Europe/Bucharest',
+  '(GMT+02:00) Cairo': 'Africa/Cairo',
+  '(GMT+02:00) Jerusalem': 'Asia/Jerusalem',
+  '(GMT+02:00) Johannesburg': 'Africa/Johannesburg',
+  '(GMT+02:00) Helsinki': 'Europe/Helsinki',
+  '(GMT+02:00) Kiev': 'Europe/Kiev',
+  '(GMT+02:00) Moscow-01 - Kaliningrad': 'Europe/Kaliningrad',
+  '(GMT+02:00) Riga': 'Europe/Riga',
+  '(GMT+02:00) Sofia': 'Europe/Sofia',
+  '(GMT+02:00) Tallinn': 'Europe/Tallinn',
+  '(GMT+02:00) Vilnius': 'Europe/Vilnius',
+  '(GMT+03:00) Istanbul': 'Europe/Istanbul',
+  '(GMT+03:00) Baghdad': 'Asia/Baghdad',
+  '(GMT+03:00) Nairobi': 'Africa/Nairobi',
+  '(GMT+03:00) Minsk': 'Europe/Minsk',
+  '(GMT+03:00) Riyadh': 'Asia/Riyadh',
+  '(GMT+03:00) Moscow+00 - Moscow': 'Europe/Moscow',
+  '(GMT+03:30) Tehran': 'Asia/Tehran',
+  '(GMT+04:00) Baku': 'Asia/Baku',
+  '(GMT+04:00) Moscow+01 - Samara': 'Europe/Samara',
+  '(GMT+04:00) Tbilisi': 'Asia/Tbilisi',
+  '(GMT+04:00) Yerevan': 'Asia/Yerevan',
+  '(GMT+04:30) Kabul': 'Asia/Kabul',
+  '(GMT+05:00) Karachi': 'Asia/Karachi',
+  '(GMT+05:00) Moscow+02 - Yekaterinburg': 'Asia/Yekaterinburg',
+  '(GMT+05:00) Tashkent': 'Asia/Tashkent',
+  '(GMT+05:30) Colombo': 'Asia/Colombo',
+  '(GMT+06:00) Almaty': 'Asia/Almaty',
+  '(GMT+06:00) Dhaka': 'Asia/Dhaka',
+  '(GMT+06:30) Rangoon': 'Asia/Rangoon',
+  '(GMT+07:00) Bangkok': 'Asia/Bangkok',
+  '(GMT+07:00) Jakarta': 'Asia/Jakarta',
+  '(GMT+07:00) Moscow+04 - Krasnoyarsk': 'Asia/Krasnoyarsk',
+  '(GMT+08:00) China Time - Beijing': 'Asia/Shanghai',
+  '(GMT+08:00) Hong Kong': 'Asia/Hong_Kong',
+  '(GMT+08:00) Kuala Lumpur': 'Asia/Kuala_Lumpur',
+  '(GMT+08:00) Moscow+05 - Irkutsk': 'Asia/Irkutsk',
+  '(GMT+08:00) Singapore': 'Asia/Singapore',
+  '(GMT+08:00) Taipei': 'Asia/Taipei',
+  '(GMT+08:00) Ulaanbaatar': 'Asia/Ulaanbaatar',
+  '(GMT+08:00) Western Time - Perth': 'Australia/Perth',
+  '(GMT+09:00) Moscow+06 - Yakutsk': 'Asia/Yakutsk',
+  '(GMT+09:00) Seoul': 'Asia/Seoul',
+  '(GMT+09:00) Tokyo': 'Asia/Tokyo',
+  '(GMT+09:30) Central Time - Darwin': 'Australia/Darwin',
+  '(GMT+10:00) Eastern Time - Brisbane': 'Australia/Brisbane',
+  '(GMT+10:00) Guam': 'Pacific/Guam',
+  '(GMT+10:00) Moscow+07 - Magadan': 'Asia/Magadan',
+  '(GMT+10:00) Moscow+07 - Yuzhno-Sakhalinsk': 'Asia/Vladivostok',
+  '(GMT+10:00) Port Moresby': 'Pacific/Port_Moresby',
+  '(GMT+10:30) Central Time - Adelaide': 'Australia/Adelaide',
+  '(GMT+11:00) Eastern Time - Hobart': 'Australia/Hobart',
+  '(GMT+11:00) Eastern Time - Melbourne, Sydney': 'Australia/Sydney',
+  '(GMT+11:00) Guadalcanal': 'Pacific/Guadalcanal',
+  '(GMT+11:00) Noumea': 'Pacific/Noumea',
+  '(GMT+12:00) Majuro': 'Pacific/Majuro',
+  '(GMT+12:00) Moscow+09 - Petropavlovsk-Kamchatskiy': 'Asia/Kamchatka',
+  '(GMT+13:00) Auckland': 'Pacific/Auckland',
+  '(GMT+13:00) Fakaofo': 'Pacific/Fakaofo',
+  '(GMT+13:00) Fiji': 'Pacific/Fiji',
+  '(GMT+13:00) Tongatapu': 'Pacific/Tongatapu',
+  '(GMT+14:00) Apia': 'Pacific/Apia'
+};
+export var usCities = ['Los Angeles', 'Denver', 'Phoenix', 'Chicago', 'New York'];

package/lib/components/TooltipTrigger/Tooltip.js

@@ -0,0 +1,33 @@
+import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
+var _excluded = ["children"];
+import React, { forwardRef, useContext, useImperativeHandle, useRef } from 'react';
+import { useTooltip } from '@react-aria/tooltip';
+import { TooltipContext } from '../../context/TooltipContext/index';
+import Box from '../Box';
+import Text from '../Text';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+var Tooltip = /*#__PURE__*/forwardRef(function (props, ref) {
+  var children = props.children,
+      others = _objectWithoutProperties(props, _excluded);
+
+  var _useContext = useContext(TooltipContext),
+      state = _useContext.state;
+
+  var _useTooltip = useTooltip(props, state),
+      tooltipProps = _useTooltip.tooltipProps;
+
+  var tooltipRef = useRef();
+  /* istanbul ignore next */
+
+  useImperativeHandle(ref, function () {
+    return tooltipRef.current;
+  });
+  return ___EmotionJSX(Box, _extends({
+    ref: tooltipRef,
+    variant: "tooltip.tooltipContainer"
+  }, tooltipProps, others), ___EmotionJSX(Text, {
+    variant: "tooltipContent"
+  }, children));
+});
+export default Tooltip;