@pingux/astro 2.238.0-alpha.0 → 2.239.0-alpha.0

package/lib/styles/themes/next-gen/variants/links.js

@@ -1,29 +1,19 @@
-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(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { astroTokens } from '@pingux/onyx-tokens';
 import buttons, { defaultFocus } from './button';
-var navBarFocus = {
+const navBarFocus = {
   outline: '2px solid',
   outlineColor: 'active'
 };
-var app = {
+const app = {
   lineHeight: '160%',
   '&.is-hovered': {
     color: astroTokens.color.blue[600],
     textDecorationColor: astroTokens.color.blue[600]
   },
-  '&.is-focused': _objectSpread(_objectSpread({}, navBarFocus), {}, {
+  '&.is-focused': {
+    ...navBarFocus,
     borderRadius: '2px'
-  }),
+  },
   '&.is-pressed': {
     color: astroTokens.color.blue[600],
     textDecorationColor: astroTokens.color.blue[600]
@@ -33,7 +23,7 @@ var app = {
     textDecoration: 'underline'
   }
 };
-var nextGen = {
+const nextGen = {
   color: 'gray-800',
   fontSize: 'md',
   py: 'sm',
@@ -51,8 +41,11 @@ var nextGen = {
     color: astroTokens.color.blue[600]
   }
 };
-var onyx = _objectSpread({}, nextGen);
-var sideNav = _objectSpread(_objectSpread({}, nextGen), {}, {
+const onyx = {
+  ...nextGen
+};
+const sideNav = {
+  ...nextGen,
   px: '0',
   display: 'block',
   position: 'relative',
@@ -74,58 +67,72 @@ var sideNav = _objectSpread(_objectSpread({}, nextGen), {}, {
       backgroundColor: 'active_light'
     }
   }
-});
-var footerLinks = _objectSpread({}, sideNav);
-var footerHeader = _objectSpread(_objectSpread({}, footerLinks), {}, {
+};
+const footerLinks = {
+  ...sideNav
+};
+const footerHeader = {
+  ...footerLinks,
   fontWeight: '2'
-});
-var button = _objectSpread(_objectSpread({}, buttons["default"]), {}, {
+};
+const button = {
+  ...buttons.default,
   textDecoration: 'none'
-});
-var primaryButton = _objectSpread(_objectSpread({}, buttons.primary), {}, {
+};
+const primaryButton = {
+  ...buttons.primary,
   textDecoration: 'none'
-});
-var navBarLogoLink = {
+};
+const navBarLogoLink = {
   borderRadius: '4px',
   px: 'md',
   py: 'sm',
-  '&.is-focused': _objectSpread({}, navBarFocus)
+  '&.is-focused': {
+    ...navBarFocus
+  }
 };
-var copyRightLink = {
-  '&.is-focused': _objectSpread({}, defaultFocus)
+const copyRightLink = {
+  '&.is-focused': {
+    ...defaultFocus
+  }
 };
-var footerLink = {
-  '&.is-focused': _objectSpread({}, defaultFocus)
+const footerLink = {
+  '&.is-focused': {
+    ...defaultFocus
+  }
 };
-var footerEALink = {
-  '&.is-focused': _objectSpread({}, defaultFocus)
+const footerEALink = {
+  '&.is-focused': {
+    ...defaultFocus
+  }
 };
-var skip = {
+const skip = {
   py: 'sm',
   px: 'md',
   height: '40px',
   lineHeight: '24px'
 };
-var navItem = {
+const navItem = {
   boxShadow: 'none !important',
-  '&.is-focused': _objectSpread(_objectSpread({}, navBarFocus), {}, {
+  '&.is-focused': {
+    ...navBarFocus,
     borderRadius: '4px',
     outlineOffset: '-2px'
-  })
+  }
 };
 export default {
-  app: app,
-  skip: skip,
-  nextGen: nextGen,
-  navItem: navItem,
-  onyx: onyx,
-  sideNav: sideNav,
-  footerLinks: footerLinks,
-  footerHeader: footerHeader,
-  button: button,
-  primaryButton: primaryButton,
-  navBarLogoLink: navBarLogoLink,
-  copyRightLink: copyRightLink,
-  footerEALink: footerEALink,
-  footerLink: footerLink
+  app,
+  skip,
+  nextGen,
+  navItem,
+  onyx,
+  sideNav,
+  footerLinks,
+  footerHeader,
+  button,
+  primaryButton,
+  navBarLogoLink,
+  copyRightLink,
+  footerEALink,
+  footerLink
 };

package/lib/styles/themes/next-gen/variants/listview.js

@@ -1,8 +1,8 @@
 import { astroTokens } from '@pingux/onyx-tokens';
 import sizes from '../sizes';
-export var focusBoxShadow = '0 0 0 2px inset #1a73e8';
-export var borderRadius = '16px';
-export var listViewItem = {
+export const focusBoxShadow = '0 0 0 2px inset #1a73e8';
+export const borderRadius = '16px';
+export const listViewItem = {
   rightOfData: {
     whiteSpace: 'nowrap'
   },
@@ -143,14 +143,14 @@ export var listViewItem = {
     pb: 'md'
   }
 };
-export var listView = {
+export const listView = {
   container: {
-    borderRadius: borderRadius,
+    borderRadius,
     border: '1px solid',
     borderColor: 'border.hairline'
   }
 };
-export var lisViewItemChart = {
+export const lisViewItemChart = {
   title: {
     color: astroTokens.color.gray[600],
     fontSize: 'tiny'

package/lib/styles/themes/next-gen/variants/menu.js

@@ -1,8 +1,8 @@
 import { astroTokens } from '@pingux/onyx-tokens';
-export var menu = {
+export const menu = {
   p: 'sm'
 };
-export var menuSection = {
+export const menuSection = {
   sectionTitle: {
     fontWeight: '1',
     fontSize: 'tiny',
@@ -16,7 +16,7 @@ export var menuSection = {
     ml: 0
   }
 };
-export var menuItem = {
+export const menuItem = {
   item: {
     bg: 'transparent',
     padding: '12px 12px',

package/lib/styles/themes/next-gen/variants/messages.js

@@ -1,5 +1,5 @@
 import { astroTokens } from '@pingux/onyx-tokens';
-export var message = {
+export const message = {
   wrapper: {
     gap: 'md'
   },
@@ -44,7 +44,7 @@ export var message = {
       bg: 'red-100'
     },
     '&.is-error, > button > svg': {
-      color: "".concat(astroTokens.color.gray[700], " !important"),
+      color: `${astroTokens.color.gray[700]} !important`,
       path: {
         fill: astroTokens.color.gray[700]
       }

package/lib/styles/themes/next-gen/variants/navbar.js

@@ -1,26 +1,15 @@
-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(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { astroTokens } from '@pingux/onyx-tokens';
-var fontSizes = astroTokens["default"]['font-size'];
-export var navBarSelected = {
+const fontSizes = astroTokens.default['font-size'];
+export const navBarSelected = {
   backgroundColor: astroTokens.color['nav-bar-item'].selected.bg,
   boxShadow: 'none'
 };
-export var navBarFocus = {
+export const navBarFocus = {
   outline: '2px solid',
   outlineColor: 'active',
   outlineOffset: '-2px'
 };
-export var navBar = {
+export const navBar = {
   itemIcon: {
     color: 'blue',
     fill: 'blue'
@@ -47,7 +36,9 @@ export var navBar = {
     '&.is-pressed': {
       backgroundColor: astroTokens.color.gray[200]
     },
-    '&.is-focused': _objectSpread({}, navBarFocus)
+    '&.is-focused': {
+      ...navBarFocus
+    }
   },
   itemButton: {
     py: '.75rem',
@@ -57,7 +48,9 @@ export var navBar = {
     fontWeight: 0,
     fontSize: fontSizes['nav-bar-item'],
     lineHeight: '160%',
-    '&.is-focused': _objectSpread({}, navBarFocus),
+    '&.is-focused': {
+      ...navBarFocus
+    },
     '&.is-hovered': {
       backgroundColor: 'light'
     },
@@ -113,7 +106,8 @@ export var navBar = {
     '&.is-pressed': {
       backgroundColor: astroTokens.color.gray[200]
     },
-    '&.is-selected': _objectSpread(_objectSpread({}, navBarSelected), {}, {
+    '&.is-selected': {
+      ...navBarSelected,
       '> div > svg': {
         fill: 'darkblue'
       },
@@ -123,7 +117,7 @@ export var navBar = {
       '&.is-hovered': {
         backgroundColor: 'light'
       }
-    }),
+    },
     '&.is-focused': {
       outline: '2px solid',
       outlineColor: 'active',
@@ -138,7 +132,8 @@ export var navBar = {
     maxWidth: '236px',
     px: '1rem',
     py: '.75rem',
-    '&.is-selected': _objectSpread(_objectSpread({}, navBarSelected), {}, {
+    '&.is-selected': {
+      ...navBarSelected,
       '> svg': {
         fill: 'darkblue'
       },
@@ -148,7 +143,7 @@ export var navBar = {
       '> div > span': {
         color: 'darkblue'
       }
-    }),
+    },
     '&.is-hovered': {
       backgroundColor: 'light'
     },

package/lib/styles/themes/next-gen/variants/navigationHeader.js

@@ -1,20 +1,9 @@
-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(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
-var defaultFocus = {
+const defaultFocus = {
   outline: '2px solid',
   outlineColor: 'active',
   outlineOffset: '1px'
 };
-var link = {
+const link = {
   display: 'inline-block',
   height: '40px',
   fontSize: 'md',
@@ -30,9 +19,10 @@ var link = {
     textDecoration: 'none',
     color: 'text.secondary'
   },
-  '&.is-focused, &:focus-visible ': _objectSpread(_objectSpread({}, defaultFocus), {}, {
+  '&.is-focused, &:focus-visible ': {
+    ...defaultFocus,
     textDecoration: 'none'
-  }),
+  },
   '&.is-pressed': {
     textDecoration: 'none'
   },
@@ -40,7 +30,7 @@ var link = {
     textDecoration: 'none'
   }
 };
-var headerPlaceholder = {
+const headerPlaceholder = {
   fontSize: 'lg',
   ml: 'md',
   color: 'text.primary',
@@ -50,9 +40,9 @@ var headerPlaceholder = {
     color: 'text.secondary'
   }
 };
-var navigationHeader = {
-  headerPlaceholder: headerPlaceholder,
-  link: link,
+const navigationHeader = {
+  headerPlaceholder,
+  link,
   container: {
     fontFamily: 'standard',
     borderBottom: '1px solid',
@@ -72,12 +62,15 @@ var navigationHeader = {
     backgroundColor: 'backgroundBase',
     maxWidth: 'unset',
     p: 'sm',
-    '&:focus': _objectSpread({}, defaultFocus),
+    '&:focus': {
+      ...defaultFocus
+    },
     '& > li': {
       p: '0'
     }
   },
-  dropdownMenuItem: _objectSpread(_objectSpread({}, link), {}, {
+  dropdownMenuItem: {
+    ...link,
     height: 'max-content',
     padding: '.675rem 1rem',
     pr: '2.25rem',
@@ -93,7 +86,7 @@ var navigationHeader = {
     '&.is-visited': {
       textDecoration: 'none'
     }
-  }),
+  },
   accountButton: {
     display: 'flex',
     width: 'auto',
@@ -115,9 +108,10 @@ var navigationHeader = {
       border: 'none',
       boxShadow: 'none'
     },
-    '&.is-focused': _objectSpread(_objectSpread({}, defaultFocus), {}, {
+    '&.is-focused': {
+      ...defaultFocus,
       bg: 'transparent'
-    }),
+    },
     '&.is-visited': {
       bg: 'transparent'
     },

package/lib/styles/themes/next-gen/variants/panelHeader.js

@@ -1,16 +1,16 @@
-var container = {
+const container = {
   bg: 'backgroundBase',
   border: 'none',
   pt: 'lg',
   px: 'lg',
   pb: 'md'
 };
-var controls = {
+const controls = {
   gap: '12px',
   alignSelf: 'start',
   mr: '0'
 };
 export default {
-  container: container,
-  controls: controls
+  container,
+  controls
 };

package/lib/styles/themes/next-gen/variants/popoverMenu.js

@@ -1,5 +1,5 @@
 import { astroTokens } from '@pingux/onyx-tokens';
-var container = {
+const container = {
   minWidth: '150px',
   maxWidth: '260px',
   boxShadow: '0px 8px 16px 0px rgba(0, 0, 0, 0.18)',
@@ -31,7 +31,7 @@ var container = {
     }
   }
 };
-var arrow = {
+const arrow = {
   color: 'white',
   fontSize: 'sm',
   '&:before': {
@@ -42,6 +42,6 @@ var arrow = {
   }
 };
 export default {
-  container: container,
-  arrow: arrow
+  container,
+  arrow
 };

package/lib/styles/themes/next-gen/variants/prompt.js

@@ -1,4 +1,4 @@
-var container = {
+const container = {
   backgroundColor: 'light',
   maxWidth: '100%',
   width: 'fit-content',
@@ -7,5 +7,5 @@ var container = {
   marginLeft: 'auto'
 };
 export default {
-  container: container
+  container
 };

package/lib/styles/themes/next-gen/variants/rangeCalendar.js

@@ -1,5 +1,5 @@
 import { astroTokens } from '@pingux/onyx-tokens';
-var calendarBody = {
+const calendarBody = {
   py: 'sm',
   borderTop: '1px solid',
   borderTopColor: 'border.separator',
@@ -8,7 +8,7 @@ var calendarBody = {
     backgroundColor: 'backgroundBase'
   }
 };
-var calendarButton = {
+const calendarButton = {
   height: '31px',
   width: '31px',
   fontWeight: '2',
@@ -63,23 +63,23 @@ var calendarButton = {
     }
   }
 };
-var calendarCell = {
+const calendarCell = {
   height: '36px'
 };
-var calendarHeaderContainer = {
+const calendarHeaderContainer = {
   mt: 0,
   height: '26px',
   mb: 'md',
   width: '100%'
 };
-var columnHeader = {
+const columnHeader = {
   color: 'text.primary',
   fontWeight: 0,
   '&.is-disabled': {
     opacity: 0.65
   }
 };
-var calendarContainer = {
+const calendarContainer = {
   width: '611px',
   textAlign: 'center',
   color: 'backgroundBase',
@@ -89,15 +89,15 @@ var calendarContainer = {
   borderRadius: '16px',
   p: 'md'
 };
-var calendarRow = {
+const calendarRow = {
   bg: 'backgroundBase'
 };
 export default {
-  calendarBody: calendarBody,
-  calendarButton: calendarButton,
-  calendarCell: calendarCell,
-  calendarContainer: calendarContainer,
-  calendarHeaderContainer: calendarHeaderContainer,
-  columnHeader: columnHeader,
-  calendarRow: calendarRow
+  calendarBody,
+  calendarButton,
+  calendarCell,
+  calendarContainer,
+  calendarHeaderContainer,
+  columnHeader,
+  calendarRow
 };

package/lib/styles/themes/next-gen/variants/response.js

@@ -1,4 +1,4 @@
-var iconWrapper = {
+const iconWrapper = {
   border: '1px solid',
   p: 'xs',
   borderColor: 'border.base',
@@ -11,7 +11,7 @@ var iconWrapper = {
   minWidth: '32px',
   minHeight: '32px'
 };
-var attachmentWrapper = {
+const attachmentWrapper = {
   alignItems: 'center',
   height: '60px',
   border: '1px solid',
@@ -23,19 +23,19 @@ var attachmentWrapper = {
     display: 'none'
   }
 };
-var markupComplexContainer = {
+const markupComplexContainer = {
   display: 'flex',
   flexDirection: 'column',
   '&.is-not-loaded': {
     display: 'none'
   }
 };
-var toolbar = {
+const toolbar = {
   '&.is-not-loaded': {
     display: 'none'
   }
 };
-var list = {
+const list = {
   pl: 'md',
   listStyleType: 'disc',
   listStylePosition: 'inside',
@@ -48,7 +48,7 @@ var list = {
     }
   }
 };
-var textWrapper = {
+const textWrapper = {
   height: 'fit-content',
   '&.has-bullet': {
     display: 'list-item !important',
@@ -68,10 +68,10 @@ var textWrapper = {
   flexDirection: 'row'
 };
 export default {
-  iconWrapper: iconWrapper,
-  list: list,
-  attachmentWrapper: attachmentWrapper,
-  toolbar: toolbar,
-  markupComplexContainer: markupComplexContainer,
-  textWrapper: textWrapper
+  iconWrapper,
+  list,
+  attachmentWrapper,
+  toolbar,
+  markupComplexContainer,
+  textWrapper
 };

package/lib/styles/themes/next-gen/variants/searchNav.js

@@ -1,6 +1,6 @@
-var tab = {
+const tab = {
   marginBottom: '-1.5px'
 };
 export default {
-  tab: tab
+  tab
 };