@pingux/astro 2.91.0 → 2.92.0-alpha.1

package/lib/styles/themeOverrides/nextGenDarkMode/colors.js

@@ -0,0 +1,88 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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 chroma from 'chroma-js';
+import { nextGenColors } from '../../themes/next-gen/tokens/colorTokens';
+export var overrides = {
+  neutral: {
+    90: '#455469'
+  },
+  disabled: '#30373f'
+};
+var hoverDark = chroma.mix('#23282e', 'white', 0.04, 'rgb').hex();
+var border = {
+  base: chroma.mix('#23282e', 'white', 0.15, 'rgb').hex(),
+  dark: chroma.mix('#23282e', 'white', 0.25, 'rgb').hex(),
+  input: nextGenColors['gray-500'],
+  separator: chroma.mix('#23282e', 'white', 0.15, 'rgb').hex()
+};
+var iconWrapper = {
+  wrapper: {
+    orange: nextGenColors['orange-500'],
+    cyan: nextGenColors['cyan-500'],
+    green: nextGenColors['green-500'],
+    purple: nextGenColors['purple-500'],
+    pink: nextGenColors['pink-500'],
+    red: nextGenColors['red-500'],
+    yellow: nextGenColors['yellow-500'],
+    teal: nextGenColors['teal-500']
+  },
+  icon: {
+    orange: 'black',
+    cyan: 'black',
+    green: 'black',
+    purple: 'black',
+    pink: 'black',
+    red: 'black',
+    yellow: 'black',
+    teal: 'black'
+  }
+};
+export var colors = _objectSpread(_objectSpread({
+  border: border,
+  iconWrapper: iconWrapper
+}, overrides), {}, {
+  light: nextGenColors['gray-900'],
+  secondary: nextGenColors['gray-400'],
+  dark: nextGenColors['gray-400'],
+  lightblue: nextGenColors['blue-600'],
+  lightindigo: nextGenColors['indigo-700'],
+  lightpurple: nextGenColors['purple-500'],
+  lightpink: nextGenColors['pink-600'],
+  lightred: nextGenColors['red-700'],
+  lightorange: nextGenColors['orange-700'],
+  lightyellow: nextGenColors['yellow-800'],
+  lightgreen: nextGenColors['green-800'],
+  lightteal: nextGenColors['teal-700'],
+  lightcyan: nextGenColors['cyan-800'],
+  darkblue: nextGenColors['blue-100'],
+  darkindigo: nextGenColors['indigo-100'],
+  darkpurple: nextGenColors['purple-100'],
+  darkpink: nextGenColors['pink-100'],
+  darkred: nextGenColors['red-100'],
+  darkorange: nextGenColors['orange-100'],
+  darkyellow: nextGenColors['yellow-100'],
+  darkgreen: nextGenColors['green-100'],
+  darkteal: nextGenColors['teal-100'],
+  darkcyan: nextGenColors['cyan-100'],
+  text: {
+    primary: nextGenColors['gray-400'],
+    secondary: nextGenColors['gray-100'],
+    message: 'white',
+    fieldHelper: nextGenColors['gray-400']
+  },
+  background: {
+    base: nextGenColors['gray-900'],
+    secondary: '#1a1e22',
+    card: '#1a1e22',
+    hover: hoverDark
+  }
+});

package/lib/styles/themeOverrides/nextGenDarkMode/customProperties/icons.js

@@ -0,0 +1,16 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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 { pingLogoHorizontalSmallWhite } from '../../../../utils/devUtils/constants/logos';
+import icons from '../../../themes/next-gen/customProperties/icons';
+export default _objectSpread(_objectSpread({}, icons), {}, {
+  pingLogoHorizontalSmall: pingLogoHorizontalSmallWhite
+});

package/lib/styles/themeOverrides/nextGenDarkMode/customProperties/index.js

@@ -0,0 +1,16 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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 { nextGenThemeValues } from '../../../themes/next-gen/customProperties';
+import icons from './icons';
+export var nextGenDarkThemeValues = _objectSpread(_objectSpread({}, nextGenThemeValues), {}, {
+  icons: icons
+});

package/lib/styles/themeOverrides/nextGenDarkMode/index.js

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

package/lib/styles/themeOverrides/nextGenDarkMode/nextGenDarkModeOverride.js

@@ -0,0 +1,22 @@
+import { merge } from 'theme-ui';
+import { themes } from '../../../utils/devUtils/constants/themes';
+import NextGenTheme from '../../themes/next-gen';
+import badges from './variants/badges';
+import buttons from './variants/buttons';
+import cards from './variants/cards';
+import forms from './variants/forms';
+import links from './variants/links';
+import variants from './variants/variants';
+import { colors } from './colors';
+var override = {
+  forms: forms,
+  colors: colors,
+  variants: variants,
+  buttons: buttons,
+  badges: badges,
+  links: links,
+  cards: cards,
+  name: themes.NEXT_GEN_DARK
+};
+var NextGenDarkTheme = merge(NextGenTheme, override);
+export default NextGenDarkTheme;

package/lib/styles/themeOverrides/nextGenDarkMode/stories/NextGenDarkDataTable.chomatic.stories.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { AstroProvider, NextGenDarkTheme } from '../../../..';
+import { DataTableNextGenComponent } from '../../../themes/next-gen/stories/DataTableNextGenComponent';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export default {
+  title: 'Chromatic Only NextGen Dark DataTable'
+};
+export var Default = function Default() {
+  return ___EmotionJSX(AstroProvider, {
+    themeOverrides: [NextGenDarkTheme]
+  }, ___EmotionJSX(DataTableNextGenComponent, null));
+};

package/lib/styles/themeOverrides/nextGenDarkMode/stories/NextGenDarkListView.chromatic.stories.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { AstroProvider, NextGenDarkTheme } from '../../../..';
+import { ListViewNextGen } from '../../../themes/next-gen/stories/ListViewNextGenComponent';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export default {
+  title: 'Chromatic Only NextGen Dark ListView'
+};
+export var Default = function Default() {
+  return ___EmotionJSX(AstroProvider, {
+    themeOverrides: [NextGenDarkTheme]
+  }, ___EmotionJSX(ListViewNextGen, null));
+};

package/lib/styles/themeOverrides/nextGenDarkMode/stories/NextGenDarkNavStory.chomatic.stories.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { AstroProvider, NextGenDarkTheme } from '../../../..';
+import { NavBarNextGenComponent } from '../../../themes/next-gen/stories/NavBarNextGenComponent';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export default {
+  title: 'Chromatic Only NextGen Dark NavBar'
+};
+export var Default = function Default() {
+  return ___EmotionJSX(AstroProvider, {
+    themeOverrides: [NextGenDarkTheme]
+  }, ___EmotionJSX(NavBarNextGenComponent, null));
+};

package/lib/styles/themeOverrides/nextGenDarkMode/stories/NextGenDarkStickerSheet.chromatic.stories.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { AstroProvider, NextGenDarkTheme } from '../../../..';
+import StickerSheetComponent from '../../../themes/next-gen/stories/StickerSheetComponent';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export default {
+  title: 'Chromatic Only NextGen Dark Sticker Sheet'
+};
+export var Default = function Default() {
+  return ___EmotionJSX(AstroProvider, {
+    themeOverrides: [NextGenDarkTheme]
+  }, ___EmotionJSX(StickerSheetComponent, null));
+};

package/lib/styles/themeOverrides/nextGenDarkMode/variants/avatar.js

@@ -0,0 +1,43 @@
+export var avatar = {
+  backgroundColor: 'cyan',
+  color: 'black',
+  cursor: 'pointer',
+  '&.is-orange': {
+    backgroundColor: 'orange',
+    color: 'black'
+  },
+  '&.is-green': {
+    backgroundColor: 'green',
+    color: 'black'
+  },
+  '&.is-purple': {
+    backgroundColor: 'purple',
+    color: 'black'
+  },
+  '&.is-pink': {
+    backgroundColor: 'pink',
+    color: 'black'
+  },
+  '&.is-red': {
+    backgroundColor: 'red',
+    color: 'black'
+  },
+  '&.is-yellow': {
+    backgroundColor: 'yellow',
+    color: 'black'
+  },
+  '&.is-cyan': {
+    backgroundColor: 'cyan',
+    color: 'black'
+  },
+  '&.is-teal': {
+    backgroundColor: 'teal',
+    color: 'black'
+  },
+  display: 'flex',
+  borderRadius: '50%',
+  textAlign: 'center',
+  alignItems: 'center',
+  justifyContent: 'center',
+  fontFamily: 'standard'
+};

package/lib/styles/themeOverrides/nextGenDarkMode/variants/badges.js

@@ -0,0 +1,88 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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; }
+var badgeFont = {
+  fontSize: '11.25px',
+  fontWeight: 2
+};
+var baseBadge = {
+  alignItems: 'center',
+  justifyContent: 'center',
+  py: '.25em',
+  px: '.4em',
+  borderRadius: '4px',
+  fontSize: '11.25px',
+  alignSelf: 'flex-start',
+  display: 'inline-flex !important',
+  width: 'fit-content',
+  '& span': _objectSpread({}, badgeFont)
+};
+var badges = {
+  primary: {
+    backgroundColor: '#1a73e8 !important',
+    '& span': {
+      color: 'black'
+    }
+  },
+  secondary: _objectSpread(_objectSpread({}, baseBadge), {}, {
+    backgroundColor: '#324054 !important',
+    '& span': _objectSpread(_objectSpread({}, badgeFont), {}, {
+      color: 'gray-400'
+    })
+  }),
+  baseBadge: {
+    backgroundColor: '#324054 !important',
+    '& span': {
+      color: 'dark'
+    }
+  },
+  success: {
+    backgroundColor: '#2ed47a !important',
+    '& span': {
+      color: 'black'
+    }
+  },
+  danger: {
+    backgroundColor: '#f7685b !important',
+    '& span': {
+      color: 'black'
+    }
+  },
+  warning: {
+    backgroundColor: '#984c0c !important',
+    '& span': {
+      color: 'black'
+    }
+  },
+  info: _objectSpread(_objectSpread({}, baseBadge), {}, {
+    backgroundColor: '#324054 !important',
+    '& span': _objectSpread({
+      color: 'dark'
+    }, badgeFont)
+  }),
+  dark: {
+    backgroundColor: '#c0c9d5 !important',
+    '& span': {
+      color: 'gray-900'
+    }
+  },
+  selectedItemBadge: _objectSpread(_objectSpread({}, baseBadge), {}, {
+    backgroundColor: '#1a73e8 !important',
+    paddingRight: '0px !important',
+    pl: '10px',
+    '& span': _objectSpread(_objectSpread({}, badgeFont), {}, {
+      fontSize: '14px',
+      color: 'gray-400',
+      fontWeight: 400
+    })
+  })
+};
+export default badges;

package/lib/styles/themeOverrides/nextGenDarkMode/variants/buttons.js

@@ -0,0 +1,97 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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 chroma from 'chroma-js';
+import { nextGenColors } from '../../../themes/next-gen/tokens/colorTokens';
+var baseIconButton = {
+  path: {
+    fill: 'dark'
+  },
+  '&.is-focused': {
+    outline: '2px solid',
+    outlineColor: 'primary',
+    outlineOffset: '3px'
+  },
+  '&.is-hovered': {
+    path: {
+      fill: chroma.mix(nextGenColors['gray-400'], 'black', 0.15, 'rgb').hex()
+    },
+    backgroundColor: 'transparent'
+  },
+  '&.is-pressed': {
+    backgroundColor: 'gray-800',
+    borderColor: 'gray-900',
+    path: {
+      fill: chroma.mix(nextGenColors['gray-400'], 'black', 0.15, 'rgb').hex()
+    }
+  }
+};
+var iconButtons = {
+  base: _objectSpread({}, baseIconButton),
+  nextGen: {
+    '&.is-hovered': {
+      path: {
+        fill: 'black'
+      }
+    },
+    '&.is-pressed': {
+      path: {
+        fill: 'black'
+      }
+    }
+  }
+};
+var buttons = {
+  primary: {
+    color: 'black',
+    '&.is-hovered': {
+      color: 'black'
+    },
+    '&.is-pressed': {
+      color: 'black'
+    }
+  },
+  neutral: {
+    color: 'gray-400'
+  },
+  critical: {
+    color: 'black',
+    '&.is-hovered': {
+      color: 'black'
+    },
+    '&.is-pressed': {
+      color: 'black'
+    }
+  },
+  "default": {
+    '&.is-pressed': {
+      color: 'black'
+    },
+    '&.is-hovered': {
+      color: 'black'
+    }
+  },
+  link: {
+    color: 'blue-400',
+    '&.is-pressed': {
+      textDecoration: 'underline',
+      outline: 'none',
+      color: chroma.mix(nextGenColors['blue-500'], 'white', 0.45, 'rgb').hex()
+    },
+    '&.is-focused': {
+      textDecoration: 'underline',
+      color: chroma.mix(nextGenColors['blue-500'], 'white', 0.30, 'rgb').hex(),
+      outline: 'none'
+    }
+  },
+  iconButtons: iconButtons
+};
+export default buttons;

package/lib/styles/themeOverrides/nextGenDarkMode/variants/cards.js

@@ -0,0 +1,15 @@
+var cards = {
+  dark: {
+    border: '1px solid',
+    borderColor: 'border.base',
+    boxShadow: '0 1px 3px 0px rgba(0,0,0, 0.13)',
+    bg: 'transparent'
+  },
+  light: {
+    border: '1px solid',
+    borderColor: 'border.base',
+    boxShadow: '0 1px 3px 0px rgba(0,0,0, 0.13)',
+    bg: 'transparent'
+  }
+};
+export default cards;

package/lib/styles/themeOverrides/nextGenDarkMode/variants/forms.js

@@ -0,0 +1,60 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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 { input } from './input';
+export var select = {
+  backgroundColor: 'background.base',
+  borderRadius: '4px',
+  border: '.5px solid',
+  borderColor: '#69788B !important',
+  color: 'text.primary',
+  height: '50px',
+  '&.is-disabled': {
+    opacity: 1,
+    borderColor: 'border.input',
+    backgroundColor: 'disabled'
+  },
+  currentValue: {
+    color: 'text.primary'
+  }
+};
+export var radio = {
+  base: {
+    color: 'text.primary'
+  }
+};
+export var checkbox = {
+  color: 'text.primary'
+};
+var selectOption = {
+  backgroundColor: 'background.base',
+  color: 'magenta !important',
+  px: 'md',
+  py: 'sm',
+  alignItems: 'center',
+  outline: 'none',
+  cursor: 'pointer',
+  '&.is-selected': {
+    pl: 0
+  },
+  '&.is-focused': {
+    color: 'white',
+    bg: 'active'
+  }
+};
+export default {
+  input: input,
+  checkbox: checkbox,
+  radio: radio,
+  select: _objectSpread(_objectSpread({}, select), {}, {
+    option: _objectSpread({}, selectOption)
+  })
+};

package/lib/styles/themeOverrides/nextGenDarkMode/variants/iconBadge.js

@@ -0,0 +1,67 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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; }
+var iconBadgeBase = {
+  borderRadius: 'sm'
+};
+var iconBadge = {
+  cyan: {
+    backgroundColor: 'cyan',
+    fill: 'black',
+    color: 'black'
+  },
+  pink: {
+    backgroundColor: 'pink',
+    fill: 'black',
+    color: 'black'
+  },
+  green: {
+    backgroundColor: 'green',
+    fill: 'black',
+    color: 'black'
+  },
+  orange: {
+    backgroundColor: 'orange',
+    fill: 'black',
+    color: 'black'
+  },
+  blue: {
+    backgroundColor: 'blue',
+    fill: 'black',
+    color: 'black'
+  },
+  red: {
+    backgroundColor: 'red',
+    fill: 'black',
+    color: 'black'
+  },
+  teal: {
+    backgroundColor: 'teal',
+    fill: 'black',
+    color: 'black'
+  },
+  yellow: {
+    backgroundColor: 'yellow',
+    fill: 'black',
+    color: 'black'
+  },
+  indigo: {
+    backgroundColor: 'indigo',
+    fill: 'black',
+    color: 'black'
+  },
+  purple: {
+    backgroundColor: 'purple',
+    fill: 'black',
+    color: 'black'
+  }
+};
+export default _objectSpread({}, iconBadge);

package/lib/styles/themeOverrides/nextGenDarkMode/variants/input.js

@@ -0,0 +1,26 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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; }
+export var input = {
+  backgroundColor: 'background.base',
+  borderColor: 'border.input'
+};
+export var fieldControlWrapper = {
+  '> textarea': {
+    borderColor: 'border.input',
+    backgroundColor: 'background.base'
+  }
+};
+input.fieldControlWrapper = _objectSpread({}, fieldControlWrapper);
+input.multivaluesWrapper = {
+  backgroundColor: 'background.base'
+};
+input.search = _objectSpread({}, input);

package/lib/styles/themeOverrides/nextGenDarkMode/variants/links.js

@@ -0,0 +1,39 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+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 _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; }
+var nextGen = {
+  color: 'text.primary',
+  '&.is-hovered': {
+    color: '#72a9f1'
+  },
+  '&.is-pressed': {
+    color: '#72a9f1'
+  }
+};
+var sideNav = {
+  color: 'text.primary',
+  '&.is-hovered': {
+    color: '#72a9f1'
+  },
+  '&.is-pressed': {
+    color: '#72a9f1'
+  }
+};
+var footerLinks = _objectSpread({}, sideNav);
+var footerHeader = _objectSpread(_objectSpread({}, footerLinks), {}, {
+  fontWeight: '2'
+});
+export default {
+  nextGen: nextGen,
+  sideNav: sideNav,
+  footerLinks: footerLinks,
+  footerHeader: footerHeader
+};