@pingux/astro 2.88.0-alpha.3 → 2.89.0-alpha.0

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

@@ -818,6 +818,11 @@ declare const _default: {
                     outlineOffset: string;
                 };
             };
+            copyButton: {
+                path: {
+                    fill: string;
+                };
+            };
         };
         modalCloseButton: {
             position: string;
@@ -1259,6 +1264,145 @@ declare const _default: {
             };
         };
     };
+    navigationHeader: {
+        headerPlaceholder: {
+            fontSize: string;
+            ml: string;
+            color: string;
+            lineHeight: string;
+            fontWeight: string;
+            '&.is-hovered': {
+                color: string;
+            };
+        };
+        link: {
+            fontSize: string;
+            fontFamily: string;
+            py: string;
+            px: string;
+            fontWeight: string;
+            color: string;
+            textDecoration: string;
+            borderRadius: string;
+            '&.is-hovered': {
+                textDecoration: string;
+                color: string;
+            };
+            '&.is-focused': {
+                textDecoration: string;
+                outline: string;
+                outlineColor: string;
+            };
+            '&.is-pressed': {
+                textDecoration: string;
+            };
+            '&.is-visited': {
+                textDecoration: string;
+            };
+        };
+        logoBand: {
+            p: number;
+            fontSize: string;
+            fontFamily: string;
+            py: string;
+            px: string;
+            fontWeight: string;
+            color: string;
+            textDecoration: string;
+            borderRadius: string;
+            '&.is-hovered': {
+                textDecoration: string;
+                color: string;
+            };
+            '&.is-focused': {
+                textDecoration: string;
+                outline: string;
+                outlineColor: string;
+            };
+            '&.is-pressed': {
+                textDecoration: string;
+            };
+            '&.is-visited': {
+                textDecoration: string;
+            };
+        };
+        container: {
+            fontFamily: string;
+            borderBottom: string;
+            borderColor: string;
+            bg: string;
+            height: string;
+            justifyContent: string;
+        };
+        wrapper: {
+            px: string[];
+            maxWidth: string;
+            mx: string;
+            width: string;
+        };
+        dropdownMenu: {
+            maxWidth: string;
+            p: string;
+            '& > li': {
+                p: string;
+            };
+        };
+        dropdownMenuItem: {
+            padding: string;
+            pr: string;
+            '&.is-hovered': {
+                textDecoration: string;
+            };
+            '&.is-pressed': {
+                textDecoration: string;
+            };
+            '&.is-focused': {
+                textDecoration: string;
+            };
+            '&.is-visited': {
+                textDecoration: string;
+            };
+            fontSize: string;
+            fontFamily: string;
+            py: string;
+            px: string;
+            fontWeight: string;
+            color: string;
+            textDecoration: string;
+            borderRadius: string;
+        };
+        accountButton: {
+            display: string;
+            width: string;
+            height: string;
+            cursor: string;
+            p: string;
+            px: string;
+            py: string;
+            border: string;
+            borderRadius: string;
+            bg: string;
+            '&.is-hovered': {
+                bg: string;
+                border: string;
+                boxShadow: string;
+            };
+            '&.is-pressed': {
+                bg: string;
+                border: string;
+                boxShadow: string;
+            };
+            '&.is-focused': {
+                bg: string;
+                outline: string;
+                outlineColor: string;
+            };
+            '&.is-visited': {
+                bg: string;
+            };
+            minWidth: string;
+        };
+    };
     space: {
         xs: string;
         sm: string;
@@ -1572,6 +1716,9 @@ declare const _default: {
         separator: {
             base: {
                 bg: string;
+                '&.is-vertical': {
+                    m: string;
+                };
             };
         };
         menuItem: {
@@ -1749,19 +1896,117 @@ declare const _default: {
             };
         };
         codeView: {
+            theme: {
+                plain: {
+                    color: string;
+                    backgroundColor: string;
+                };
+                styles: ({
+                    types: string[];
+                    style: {
+                        color: string;
+                        background?: undefined;
+                        fontWeight?: undefined;
+                        cursor?: undefined;
+                    };
+                } | {
+                    types: string[];
+                    style: {
+                        color: string;
+                        background: string;
+                        fontWeight?: undefined;
+                        cursor?: undefined;
+                    };
+                } | {
+                    types: string[];
+                    style: {
+                        fontWeight: string;
+                        color?: undefined;
+                        background?: undefined;
+                        cursor?: undefined;
+                    };
+                } | {
+                    types: string[];
+                    style: {
+                        cursor: string;
+                        color?: undefined;
+                        background?: undefined;
+                        fontWeight?: undefined;
+                    };
+                })[];
+            };
             wrapper: {
                 backgroundColor: string;
+                border: string;
+                borderColor: string;
                 borderRadius: string;
-                '> button >svg': {
-                    color: string;
-                    path: {
-                        fill: string;
+                width: number;
+                height: number;
+                my: string;
+                overflow: string;
+                alignItems: string;
+                '&.is-focused, &:focus': {
+                    boxShadow: string;
+                    outline: string;
+                };
+                pre: {
+                    backgroundColor: string;
+                    padding: string;
+                    height: string;
+                    width: string;
+                    overflowX: string;
+                    overflowY: string;
+                    fontSize: string;
+                    '& .token-line': {
+                        display: string;
+                        alignItems: string;
+                        '& .token': {
+                            whiteSpace: string;
+                            wordBreak: string;
+                        };
+                    };
+                    fontFamily: string;
+                    lineHeight: string;
+                };
+                '&.has-no-copy-button': {
+                    pre: {
+                        p: string;
                     };
                 };
-                '> pre': {
-                    p: string;
+                '&.has-line-numbers': {
+                    pre: {
+                        p: string;
+                        overflow: string;
+                        '& .token-line:first-of-type *': {
+                            pt: string;
+                        };
+                        '& .token-line': {
+                            display: string;
+                            '& .token': {
+                                whiteSpace: string;
+                            };
+                        };
+                    };
                 };
             };
+            lineNo: {
+                display: string;
+                userSelect: string;
+                px: string;
+                m: string;
+                bg: string;
+                minWidth: number;
+                color: string;
+                lineHeight: string;
+            };
+            header: {
+                color: string;
+                px: string;
+                width: string;
+                border: string;
+                borderColor: string;
+                lineHeight: string;
+            };
         };
         tabs: {
             gap: string;
@@ -1817,9 +2062,10 @@ declare const _default: {
                 })[];
             };
             wrapper: {
-                bg: string;
+                backgroundColor: string;
                 border: string;
                 borderColor: string;
+                borderRadius: string;
                 width: number;
                 height: number;
                 my: string;
@@ -1879,6 +2125,14 @@ declare const _default: {
                 color: string;
                 lineHeight: string;
             };
+            header: {
+                color: string;
+                px: string;
+                width: string;
+                border: string;
+                borderColor: string;
+                lineHeight: string;
+            };
         };
     };
 };

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

@@ -24,6 +24,7 @@ var _button = _interopRequireDefault(require("./variants/button"));
 var _cards = _interopRequireDefault(require("./variants/cards"));
 var _images = _interopRequireDefault(require("./variants/images"));
 var _links = _interopRequireDefault(require("./variants/links"));
+var _navigationHeader = _interopRequireDefault(require("./variants/navigationHeader"));
 var _text = require("./variants/text");
 var _variants = _interopRequireWildcard(require("./variants/variants"));
 var _forms = _interopRequireDefault(require("./forms"));
@@ -58,6 +59,7 @@ var nextGenTheme = {
   },
   sizes: _sizes["default"],
   badges: _variants.badges,
+  navigationHeader: _navigationHeader["default"],
   space: _spacing["default"],
   links: _links["default"],
   cards: _cards["default"],

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

@@ -622,6 +622,11 @@ declare const buttons: {
                 outlineOffset: string;
             };
         };
+        copyButton: {
+            path: {
+                fill: string;
+            };
+        };
     };
     modalCloseButton: {
         position: string;

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

@@ -15,6 +15,7 @@ _Object$defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _chromaJs = _interopRequireDefault(require("chroma-js"));
+var _codeView = require("../codeView/codeView");
 var _colors = _interopRequireDefault(require("../colors/colors"));
 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; }
@@ -243,22 +244,23 @@ var iconButtons = {
   headerNav: _objectSpread(_objectSpread({}, baseIconButton), {}, {
     borderRadius: '4px',
     path: {
-      fill: 'gray-800'
+      fill: 'text.primary'
     },
     px: 'md',
     py: 'sm',
     width: '56px',
     '&.is-hovered': {
       path: {
-        fill: 'gray-500'
+        fill: 'text.secondary'
       }
     },
     '&.is-pressed': {
       path: {
-        fill: 'gray-500'
+        fill: 'text.secondary'
       }
     }
-  })
+  }),
+  copyButton: _codeView.copyButton
 };
 var buttons = {
   neutral: neutral,

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

@@ -0,0 +1,140 @@
+declare const navigationHeader: {
+    headerPlaceholder: {
+        fontSize: string;
+        ml: string;
+        color: string;
+        lineHeight: string;
+        fontWeight: string;
+        '&.is-hovered': {
+            color: string;
+        };
+    };
+    link: {
+        fontSize: string;
+        fontFamily: string;
+        py: string;
+        px: string;
+        fontWeight: string;
+        color: string;
+        textDecoration: string;
+        borderRadius: string;
+        '&.is-hovered': {
+            textDecoration: string;
+            color: string;
+        };
+        '&.is-focused': {
+            textDecoration: string;
+            outline: string;
+            outlineColor: string;
+        };
+        '&.is-pressed': {
+            textDecoration: string;
+        };
+        '&.is-visited': {
+            textDecoration: string;
+        };
+    };
+    logoBand: {
+        p: number;
+        fontSize: string;
+        fontFamily: string;
+        py: string;
+        px: string;
+        fontWeight: string;
+        color: string;
+        textDecoration: string;
+        borderRadius: string;
+        '&.is-hovered': {
+            textDecoration: string;
+            color: string;
+        };
+        '&.is-focused': {
+            textDecoration: string;
+            outline: string;
+            outlineColor: string;
+        };
+        '&.is-pressed': {
+            textDecoration: string;
+        };
+        '&.is-visited': {
+            textDecoration: string;
+        };
+    };
+    container: {
+        fontFamily: string;
+        borderBottom: string;
+        borderColor: string;
+        bg: string;
+        height: string;
+        justifyContent: string;
+    };
+    wrapper: {
+        px: string[];
+        maxWidth: string;
+        mx: string;
+        width: string;
+    };
+    dropdownMenu: {
+        maxWidth: string;
+        p: string;
+        '& > li': {
+            p: string;
+        };
+    };
+    dropdownMenuItem: {
+        padding: string;
+        pr: string;
+        '&.is-hovered': {
+            textDecoration: string;
+        };
+        '&.is-pressed': {
+            textDecoration: string;
+        };
+        '&.is-focused': {
+            textDecoration: string;
+        };
+        '&.is-visited': {
+            textDecoration: string;
+        };
+        fontSize: string;
+        fontFamily: string;
+        py: string;
+        px: string;
+        fontWeight: string;
+        color: string;
+        textDecoration: string;
+        borderRadius: string;
+    };
+    accountButton: {
+        display: string;
+        width: string;
+        height: string;
+        cursor: string;
+        p: string;
+        px: string;
+        py: string;
+        border: string;
+        borderRadius: string;
+        bg: string;
+        '&.is-hovered': {
+            bg: string;
+            border: string;
+            boxShadow: string;
+        };
+        '&.is-pressed': {
+            bg: string;
+            border: string;
+            boxShadow: string;
+        };
+        '&.is-focused': {
+            bg: string;
+            outline: string;
+            outlineColor: string;
+        };
+        '&.is-visited': {
+            bg: string;
+        };
+        minWidth: string;
+    };
+};
+export default navigationHeader;

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

@@ -0,0 +1,131 @@
+"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["default"] = 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 defaultFocus = {
+  outline: '2px solid',
+  outlineColor: 'active'
+};
+var link = {
+  fontSize: 'md',
+  fontFamily: 'standard',
+  py: 'sm',
+  px: 'md',
+  fontWeight: '1',
+  color: 'text.primary',
+  textDecoration: 'none',
+  borderRadius: '3px',
+  '&.is-hovered': {
+    textDecoration: 'none',
+    color: 'text.secondary'
+  },
+  '&.is-focused': _objectSpread(_objectSpread({}, defaultFocus), {}, {
+    textDecoration: 'none'
+  }),
+  '&.is-pressed': {
+    textDecoration: 'none'
+  },
+  '&.is-visited': {
+    textDecoration: 'none'
+  }
+};
+var logoBand = _objectSpread(_objectSpread({}, link), {}, {
+  p: 0
+});
+var headerPlaceholder = {
+  fontSize: 'lg',
+  ml: 'md',
+  color: 'text.primary',
+  lineHeight: 'body',
+  fontWeight: '1',
+  '&.is-hovered': {
+    color: 'text.secondary'
+  }
+};
+var navigationHeader = {
+  headerPlaceholder: headerPlaceholder,
+  link: link,
+  logoBand: logoBand,
+  container: {
+    fontFamily: 'standard',
+    borderBottom: '1px solid',
+    borderColor: 'gray-300',
+    bg: '#fff',
+    height: '4.5rem',
+    justifyContent: 'center'
+  },
+  wrapper: {
+    px: ['1.5rem', '1.5rem', '1.5rem', '3rem', '3rem', '3rem'],
+    maxWidth: '1540px',
+    mx: 'auto',
+    width: '100%'
+  },
+  dropdownMenu: {
+    maxWidth: 'unset',
+    p: 'sm',
+    '& > li': {
+      p: '0'
+    }
+  },
+  dropdownMenuItem: _objectSpread(_objectSpread({}, link), {}, {
+    padding: '.675rem 1rem',
+    pr: '2.25rem',
+    '&.is-hovered': {
+      textDecoration: 'none'
+    },
+    '&.is-pressed': {
+      textDecoration: 'none'
+    },
+    '&.is-focused': {
+      textDecoration: 'none'
+    },
+    '&.is-visited': {
+      textDecoration: 'none'
+    }
+  }),
+  accountButton: {
+    display: 'flex',
+    width: 'auto',
+    height: 'auto',
+    cursor: 'pointer',
+    p: '0',
+    px: 'sm',
+    py: '1px',
+    border: 'none',
+    borderRadius: '3px',
+    bg: 'transparent',
+    '&.is-hovered': {
+      bg: 'transparent',
+      border: 'none',
+      boxShadow: 'none'
+    },
+    '&.is-pressed': {
+      bg: 'transparent',
+      border: 'none',
+      boxShadow: 'none'
+    },
+    '&.is-focused': _objectSpread(_objectSpread({}, defaultFocus), {}, {
+      bg: 'transparent'
+    }),
+    '&.is-visited': {
+      bg: 'transparent'
+    },
+    minWidth: '50px'
+  }
+};
+var _default = navigationHeader;
+exports["default"] = _default;