@pingux/astro 2.88.0 → 2.89.0-alpha.1

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;

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

@@ -435,6 +435,9 @@ declare const _default: {
     separator: {
         base: {
             bg: string;
+            '&.is-vertical': {
+                m: string;
+            };
         };
     };
     menuItem: {
@@ -612,19 +615,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;

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

@@ -14,6 +14,7 @@ _Object$defineProperty(exports, "__esModule", {
 });
 exports["default"] = exports.badges = exports.badgeDeleteButton = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+var _codeView = _interopRequireDefault(require("../codeView/codeView"));
 var _button = _interopRequireDefault(require("./button"));
 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; }
@@ -252,7 +253,10 @@ var menuItem = {
 };
 var separator = {
   base: {
-    bg: 'gray-300'
+    bg: 'gray-300',
+    '&.is-vertical': {
+      m: '0'
+    }
   }
 };
 var avatar = {
@@ -501,21 +505,23 @@ var dataTable = {
     fontSize: 'md'
   }
 };
-var codeView = {
+
+/* const codeView = {
   wrapper: {
     backgroundColor: 'gray-900',
     borderRadius: '4px',
     '> button >svg': {
       color: 'gray-300',
       path: {
-        fill: 'gray-300'
-      }
+        fill: 'gray-300',
+      },
     },
     '> pre': {
-      p: 'md'
-    }
-  }
-};
+      p: 'md',
+    },
+  },
+}; */
+
 var tabs = {
   gap: '0px'
 };
@@ -539,7 +545,7 @@ var _default = {
   progressBar: progressBar,
   listView: listView,
   dataTable: dataTable,
-  codeView: codeView,
+  codeView: _codeView["default"],
   tabs: tabs,
   menu: menu
 };

package/lib/cjs/types/codeView.d.ts

@@ -2,10 +2,10 @@ import type { PrismTheme } from 'prism-react-renderer';
 import { Language, Prism as PrismRR } from 'prism-react-renderer';
 import Prism from 'prismjs';
 import { ThemeUICSSObject } from 'theme-ui';
-import { HoverProps } from './shared';
+import { HoverProps, StyleProps } from './shared';
 export type PrismProps = typeof PrismRR & typeof Prism;
 export type PrismThemeProps = PrismTheme;
-export interface CodeViewProps extends HoverProps {
+export interface CodeViewProps extends HoverProps, StyleProps {
     children?: string;
     className?: string;
     hasLineNumbers?: boolean;
@@ -14,4 +14,5 @@ export interface CodeViewProps extends HoverProps {
     Prism?: PrismProps;
     sx?: ThemeUICSSObject;
     stylesProp?: ThemeUICSSObject;
+    isNextGen?: boolean;
 }

package/lib/cjs/types/copyText.d.ts

@@ -15,7 +15,7 @@ export interface TooltipWrapperProps {
 }
 export interface CopyTextProps extends HoverProps, TestingAttributes {
     children?: React.ReactNode;
-    mode?: 'text' | 'link' | 'nonClickableContent';
+    mode?: 'text' | 'link' | 'nonClickableContent' | 'rightText';
     textToCopy?: string;
     tooltipText?: string;
     tooltipProps?: TooltipTriggerProps;

package/lib/cjs/types/index.d.ts

@@ -1,4 +1,5 @@
 export * from './arrayField';
+export * from './avatar';
 export * from './badge';
 export * from './box';
 export * from './bracket';