@pingux/astro 2.91.0-alpha.1 → 2.92.0-alpha.0

package/lib/cjs/styles/themes/next-gen/variants/menu.d.ts

@@ -0,0 +1,28 @@
+export declare const menu: {
+    p: string;
+    border: string;
+    borderColor: string;
+};
+export declare const menuItem: {
+    item: {
+        bg: string;
+        padding: string;
+        outline: string;
+        color: string;
+        cursor: string;
+        '&.is-focused, &.is-selected, &.is-pressed': {
+            bg: string;
+            color: string;
+            '> *': {
+                color: string;
+            };
+        };
+        '&.is-pressed': {
+            color: string;
+            bg: string;
+        };
+    };
+    separator: {
+        my: string;
+    };
+};

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

@@ -0,0 +1,37 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.menuItem = exports.menu = void 0;
+var menu = {
+  p: 'sm',
+  border: '1px solid',
+  borderColor: 'border.base'
+};
+exports.menu = menu;
+var menuItem = {
+  item: {
+    bg: 'transparent',
+    padding: '10px 10px',
+    outline: 'none',
+    color: 'text.primary',
+    cursor: 'pointer',
+    '&.is-focused, &.is-selected, &.is-pressed': {
+      bg: 'gray-100',
+      color: 'text.primary',
+      '> *': {
+        color: 'text.primary'
+      }
+    },
+    '&.is-pressed': {
+      color: 'text.primary',
+      bg: 'lightblue'
+    }
+  },
+  separator: {
+    my: 'sm'
+  }
+};
+exports.menuItem = menuItem;

package/lib/cjs/styles/themes/next-gen/variants/messages.d.ts

@@ -0,0 +1,40 @@
+export declare const message: {
+    item: {
+        maxWidth: number;
+        pointerEvents: string;
+        mb: string;
+        p: string;
+        wordBreak: string;
+        alignItems: string;
+        backgroundColor: string;
+        borderLeftWidth: string;
+        borderLeftStyle: string;
+        borderLeftColor: string;
+        color: string;
+        fontSize: string;
+        borderRadius: number;
+        '&.is-success': {
+            bg: string;
+            borderLeftColor: string;
+            color: string;
+        };
+        '&.is-warning': {
+            bg: string;
+            borderLeftColor: string;
+            color: string;
+        };
+        '&.is-error, > .is-error': {
+            bg: string;
+            color: string;
+        };
+        '&.is-error, > button > svg': {
+            color: string;
+            path: {
+                fill: string;
+            };
+        };
+        '&.is-error': {
+            borderLeftColor: string;
+        };
+    };
+};

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

@@ -0,0 +1,48 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.message = void 0;
+var message = {
+  item: {
+    maxWidth: 400,
+    pointerEvents: 'all',
+    mb: 'md',
+    p: '1.25rem',
+    wordBreak: 'break-word',
+    alignItems: 'center',
+    backgroundColor: 'blue-100',
+    borderLeftWidth: '5px',
+    borderLeftStyle: 'solid',
+    borderLeftColor: 'teal-500',
+    color: 'text.message',
+    fontSize: '15px !important',
+    borderRadius: 4,
+    '&.is-success': {
+      bg: 'green-100',
+      borderLeftColor: 'green-500',
+      color: 'text.message'
+    },
+    '&.is-warning': {
+      bg: 'warning.light',
+      borderLeftColor: 'yellow-500',
+      color: 'text.message'
+    },
+    '&.is-error, > .is-error': {
+      bg: 'red-100',
+      color: 'text.message'
+    },
+    '&.is-error, > button > svg': {
+      color: 'text.message !important',
+      path: {
+        fill: 'text.message'
+      }
+    },
+    '&.is-error': {
+      borderLeftColor: 'red-500'
+    }
+  }
+};
+exports.message = message;

package/lib/cjs/styles/themes/next-gen/variants/navbar.d.ts

@@ -0,0 +1,126 @@
+export declare const navBarSelected: {
+    backgroundColor: string;
+    boxShadow: string;
+};
+export declare const navBarFocus: {
+    outline: string;
+    outlineColor: string;
+    outlineOffset: string;
+};
+export declare const navBar: {
+    container: {
+        width: string;
+        p: string;
+        backgroundColor: string;
+        boxShadow: string;
+    };
+    sectionButton: {
+        borderRadius: string;
+        '&.is-hovered': {
+            backgroundColor: string;
+        };
+        '&.is-pressed': {
+            backgroundColor: string;
+        };
+        '&.is-focused': {
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+        };
+    };
+    itemButton: {
+        py: string;
+        paddingLeft: string;
+        color: string;
+        borderRadius: string;
+        '&.is-focused': {
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+        };
+        '&.is-hovered': {
+            backgroundColor: string;
+        };
+        '&.is-pressed': {
+            backgroundColor: string;
+            color: string;
+        };
+        '&.is-selected': {
+            bg: string;
+            boxShadow: string;
+            color: string;
+        };
+    };
+    subtitle: {
+        color: string;
+    };
+    headerText: {
+        color: string;
+        ml: string;
+        '.is-selected &': {
+            color: string;
+        };
+    };
+    headerNav: {
+        borderRadius: string;
+        color: string;
+        '&.is-hovered': {
+            backgroundColor: string;
+        };
+        '&.is-focused': {
+            boxShadow: string;
+            WebkitBoxShadow: string;
+            MozBoxShadow: string;
+        };
+    };
+    item: {
+        px: string;
+        py: string;
+        color: string;
+        borderRadius: string;
+        '&.is-hovered': {
+            backgroundColor: string;
+        };
+        '> div > svg': {
+            fill: string;
+        };
+        '&.is-pressed': {
+            backgroundColor: string;
+        };
+        '&.is-selected': {
+            '> div > svg': {
+                fill: string;
+            };
+            backgroundColor: string;
+            boxShadow: string;
+        };
+        '&.is-focused': {
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+            boxShadow: string;
+            WebkitBoxShadow: string;
+            MozBoxShadow: string;
+        };
+    };
+    itemHeaderContainer: {
+        boxShadow: string;
+        maxWidth: string;
+        px: string;
+        py: string;
+        '&.is-selected': {
+            backgroundColor: string;
+            boxShadow: string;
+        };
+        backgroundColor: string;
+        '> svg': {
+            fill: string;
+        };
+        '> div > svg': {
+            fill: string;
+        };
+    };
+    navBarItemBody: {
+        mb: string;
+    };
+};

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

@@ -0,0 +1,134 @@
+"use strict";
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.navBarSelected = exports.navBarFocus = exports.navBar = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/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) { (0, _defineProperty2["default"])(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 navBarSelected = {
+  backgroundColor: 'lightblue',
+  boxShadow: 'none'
+};
+exports.navBarSelected = navBarSelected;
+var navBarFocus = {
+  outline: '2px solid',
+  outlineColor: 'active',
+  outlineOffset: '-2px'
+};
+exports.navBarFocus = navBarFocus;
+var navBar = {
+  container: {
+    width: '252px',
+    p: 'sm',
+    backgroundColor: 'background.base',
+    boxShadow: '0 .5rem 1rem rgba(0, 0, 0, .15)'
+  },
+  sectionButton: {
+    borderRadius: '4px',
+    '&.is-hovered': {
+      backgroundColor: 'light'
+    },
+    '&.is-pressed': {
+      backgroundColor: 'gray-200'
+    },
+    '&.is-focused': _objectSpread({}, navBarFocus)
+  },
+  itemButton: {
+    py: '.75rem',
+    paddingLeft: '53px',
+    color: 'text.primary',
+    borderRadius: '4px',
+    '&.is-focused': _objectSpread({}, navBarFocus),
+    '&.is-hovered': {
+      backgroundColor: 'light'
+    },
+    '&.is-pressed': {
+      backgroundColor: 'gray-200',
+      color: 'text.primary'
+    },
+    '&.is-selected': {
+      bg: 'lightblue',
+      boxShadow: 'none',
+      color: 'darkblue'
+    }
+  },
+  subtitle: {
+    color: 'text.primary'
+  },
+  headerText: {
+    color: 'text.primary',
+    ml: 'sm',
+    '.is-selected &': {
+      color: 'darkblue'
+    }
+  },
+  headerNav: {
+    borderRadius: '4px',
+    color: 'text.primary',
+    '&.is-hovered': {
+      backgroundColor: 'light'
+    },
+    '&.is-focused': {
+      boxShadow: 'none',
+      WebkitBoxShadow: 'none',
+      MozBoxShadow: 'none'
+    }
+  },
+  item: {
+    px: '1rem',
+    py: '.75rem',
+    color: 'text.primary',
+    borderRadius: '4px',
+    '&.is-hovered': {
+      backgroundColor: 'light'
+    },
+    '> div > svg': {
+      fill: 'text.primary'
+    },
+    '&.is-pressed': {
+      backgroundColor: 'gray-200'
+    },
+    '&.is-selected': _objectSpread(_objectSpread({}, navBarSelected), {}, {
+      '> div > svg': {
+        fill: 'darkblue'
+      }
+    }),
+    '&.is-focused': {
+      outline: '2px solid',
+      outlineColor: 'active',
+      outlineOffset: '-2px',
+      boxShadow: 'none',
+      WebkitBoxShadow: 'none',
+      MozBoxShadow: 'none'
+    }
+  },
+  itemHeaderContainer: {
+    boxShadow: 'none',
+    maxWidth: '236px',
+    px: '1rem',
+    py: '.75rem',
+    '&.is-selected': _objectSpread({}, navBarSelected),
+    backgroundColor: 'transparent',
+    '> svg': {
+      fill: 'text.primary'
+    },
+    '> div > svg': {
+      fill: 'text.primary'
+    }
+  },
+  navBarItemBody: {
+    mb: '0px !important'
+  }
+};
+exports.navBar = navBar;

package/lib/cjs/styles/themes/next-gen/variants/navigationHeader.d.ts

@@ -64,7 +64,7 @@ declare const navigationHeader: {
         fontFamily: string;
         borderBottom: string;
         borderColor: string;
-        bg: string;
+        backgroundColor: string;
         height: string;
         justifyContent: string;
     };
@@ -73,8 +73,10 @@ declare const navigationHeader: {
         maxWidth: string;
         mx: string;
         width: string;
+        backgroundColor: string;
     };
     dropdownMenu: {
+        backgroundColor: string;
         maxWidth: string;
         p: string;
         '& > li': {

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

@@ -49,7 +49,7 @@ var logoBand = _objectSpread(_objectSpread({}, link), {}, {
 var headerPlaceholder = {
   fontSize: 'lg',
   ml: 'md',
-  color: 'text.primary',
+  color: 'text.secondary',
   lineHeight: 'body',
   fontWeight: '1',
   '&.is-hovered': {
@@ -63,8 +63,8 @@ var navigationHeader = {
   container: {
     fontFamily: 'standard',
     borderBottom: '1px solid',
-    borderColor: 'gray-300',
-    bg: '#fff',
+    borderColor: 'border.base',
+    backgroundColor: 'background.base',
     height: '4.5rem',
     justifyContent: 'center'
   },
@@ -72,9 +72,11 @@ var navigationHeader = {
     px: ['1.5rem', '1.5rem', '1.5rem', '3rem', '3rem', '3rem'],
     maxWidth: '1540px',
     mx: 'auto',
-    width: '100%'
+    width: '100%',
+    backgroundColor: 'background.base'
   },
   dropdownMenu: {
+    backgroundColor: 'background.base',
     maxWidth: 'unset',
     p: 'sm',
     '& > li': {

package/lib/cjs/styles/themes/next-gen/variants/tabs.d.ts

@@ -0,0 +1,28 @@
+export declare const tabs: {
+    gap: string;
+};
+export declare const menuTab: {
+    ml: string;
+};
+export declare const tab: {
+    borderRadius: string;
+    pt: string;
+    '& > span': {
+        px: string;
+        fontSize: string;
+    };
+    '&.is-focused': {
+        boxShadow: string;
+        outline: string;
+        outlineColor: string;
+        outlineOffset: string;
+        '& > span': {
+            outline: string;
+        };
+    };
+    '& > div': {
+        borderBottom: string;
+        borderBottomColor: string;
+        ml: string;
+    };
+};

package/lib/cjs/styles/themes/next-gen/variants/tabs.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.tabs = exports.tab = exports.menuTab = void 0;
+var tabs = {
+  gap: '0px'
+};
+exports.tabs = tabs;
+var menuTab = {
+  ml: '0px !important'
+};
+exports.menuTab = menuTab;
+var tab = {
+  borderRadius: '2px',
+  pt: '.5rem',
+  '& > span': {
+    px: '1rem',
+    fontSize: '.9375rem'
+  },
+  '&.is-focused': {
+    boxShadow: 'none',
+    outline: '3px solid',
+    outlineColor: 'active',
+    outlineOffset: '1px',
+    '& > span': {
+      outline: 'none'
+    }
+  },
+  '& > div': {
+    borderBottom: '3px solid',
+    borderBottomColor: 'primary',
+    ml: '0px'
+  }
+};
+exports.tab = tab;

package/lib/cjs/styles/themes/next-gen/variants/text.d.ts

@@ -36,9 +36,19 @@ export declare const text: {
         fontWeight: number;
         fontSize: string;
     };
+    sideNavHeader: {
+        py: string;
+        lineHeight: string;
+        textDecoration: string;
+        color: string;
+        px: string;
+        fontWeight: string;
+        letterSpacing: string;
+    };
     modalTitle: {
         fontSize: string;
         fontWeight: string;
+        color: string;
         fontFamily: string;
     };
     tabLabel: {
@@ -52,6 +62,7 @@ export declare const text: {
         lineHeight: string;
     };
     listViewItemText: {
+        color: string;
         fontWeight: number;
     };
     small: {

package/lib/cjs/styles/themes/next-gen/variants/text.js

@@ -20,45 +20,55 @@ var hTags = {
   h1: {
     fontSize: 'xxx',
     fontWeight: 2,
-    color: 'text.primary',
+    color: 'text.secondary',
     fontFamily: 'standard'
   },
   h2: {
     fontSize: 'xx',
     fontWeight: 2,
-    color: 'text.primary',
+    color: 'text.secondary',
     fontFamily: 'standard'
   },
   h3: {
     fontSize: 'xl',
     fontWeight: 2,
-    color: 'text.primary',
+    color: 'text.secondary',
     fontFamily: 'standard'
   },
   h4: {
     fontSize: 'lg',
     fontWeight: 2,
-    color: 'text.primary',
+    color: 'text.secondary',
     fontFamily: 'standard'
   },
   h5: {
     fontSize: 'md',
     fontWeight: 2,
-    color: 'text.primary',
+    color: 'text.secondary',
     fontFamily: 'standard'
   },
   h6: {
     textTransform: 'uppercase',
-    color: 'text.primary',
+    color: 'text.secondary',
     fontFamily: 'standard',
     fontWeight: 1,
     fontSize: 'xs'
   }
 };
 var text = _objectSpread({
+  sideNavHeader: {
+    py: 'sm',
+    lineHeight: 'body',
+    textDecoration: 'none',
+    color: 'text.secondary',
+    px: '0',
+    fontWeight: '1',
+    letterSpacing: '1px'
+  },
   modalTitle: {
     fontSize: '20px',
     fontWeight: '2',
+    color: 'text.secondary',
     fontFamily: 'standard'
   },
   tabLabel: {
@@ -72,11 +82,12 @@ var text = _objectSpread({
     lineHeight: 'body'
   },
   listViewItemText: {
+    color: 'text.secondary',
     fontWeight: 2
   },
   small: {
     fontSize: 'sm',
-    color: 'gray-500',
+    color: 'text.primary',
     fontFamily: 'standard',
     lineHeight: 'md'
   }