@primer/components 0.0.0-202182921545 → 0.0.0-2021829233555

package/lib-esm/Dialog/ConfirmationDialog.js

@@ -97,13 +97,13 @@ export const ConfirmationDialog = props => {
   }, [onClose]);
   const cancelButton = {
     content: cancelButtonContent,
-    onClick: onCancelButtonClick
+    onClick: onCancelButtonClick,
+    autoFocus: true
   };
   const confirmButton = {
     content: confirmButtonContent,
     buttonType: confirmButtonType,
-    onClick: onConfirmButtonClick,
-    autoFocus: true
+    onClick: onConfirmButtonClick
   };
   const footerButtons = [cancelButton, confirmButton];
   return /*#__PURE__*/React.createElement(Dialog, {

package/lib-esm/Dialog/Dialog.d.ts

@@ -19,11 +19,6 @@ export declare type DialogButtonProps = ButtonProps & {
      * focus this button automatically when the dialog appears.
      */
     autoFocus?: boolean;
-    /**
-     * A reference to the rendered Button’s DOM node, used together with
-     * `autoFocus` for `focusTrap`’s `initialFocus`.
-     */
-    ref?: React.RefObject<HTMLButtonElement>;
 };
 /**
  * Props to customize the rendering of the Dialog.

package/lib-esm/Dialog/Dialog.js

@@ -5,7 +5,7 @@ import styled from 'styled-components';
 import Button, { ButtonPrimary, ButtonDanger } from '../Button';
 import Box from '../Box';
 import { get, COMMON, POSITION } from '../constants';
-import { useOnEscapePress, useProvidedRefOrCreate } from '../hooks';
+import { useOnEscapePress } from '../hooks';
 import { useFocusTrap } from '../hooks/useFocusTrap';
 import sx from '../sx';
 import StyledOcticon from '../StyledOcticon';
@@ -112,19 +112,10 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
     onClose,
     role = 'dialog',
     width = 'xlarge',
-    height = 'auto',
-    footerButtons = []
+    height = 'auto'
   } = props;
   const dialogLabelId = useSSRSafeId();
   const dialogDescriptionId = useSSRSafeId();
-  const autoFocusedFooterButtonRef = useRef(null);
-
-  for (const footerButton of footerButtons) {
-    if (footerButton.autoFocus) {
-      footerButton.ref = autoFocusedFooterButtonRef;
-    }
-  }
-
   const defaultedProps = { ...props,
     title,
     subtitle,
@@ -137,8 +128,7 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
   const backdropRef = useRef(null);
   useFocusTrap({
     containerRef: dialogRef,
-    restoreFocusOnCleanUp: true,
-    initialFocusRef: autoFocusedFooterButtonRef
+    restoreFocusOnCleanUp: true
   });
   useOnEscapePress(event => {
     onClose('escape');
@@ -193,9 +183,7 @@ const buttonTypes = {
 const Buttons = ({
   buttons
 }) => {
-  var _buttons$find;
-
-  const autoFocusRef = useProvidedRefOrCreate((_buttons$find = buttons.find(button => button.autoFocus)) === null || _buttons$find === void 0 ? void 0 : _buttons$find.ref);
+  const autoFocusRef = useRef(null);
   let autoFocusCount = 0;
   const [hasRendered, setHasRendered] = useState(0);
   useEffect(() => {
@@ -207,7 +195,7 @@ const Buttons = ({
     } else {
       setHasRendered(hasRendered + 1);
     }
-  }, [autoFocusRef, hasRendered]);
+  }, [hasRendered]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, buttons.map((dialogButtonProps, index) => {
     const {
       content,

package/lib-esm/theme-preval.d.ts

@@ -9,24 +9,7 @@ export namespace theme {
     export { radii };
     export { sizes };
     export { space };
-    export namespace colorSchemes {
-        namespace light {
-            export { lightColors as colors };
-            export { lightShadows as shadows };
-        }
-        namespace dark {
-            export { darkColors as colors };
-            export { darkShadows as shadows };
-        }
-        namespace dark_dimmed {
-            export { darkDimmedColors as colors };
-            export { darkDimmedShadows as shadows };
-        }
-        namespace dark_high_contrast {
-            export { darkHighContrastColors as colors };
-            export { darkHighContrastShadows as shadows };
-        }
-    }
+    export { colorSchemes };
 }
 declare namespace animation {
     const easeOutCubic: string;
@@ -39,8 +22,7 @@ declare namespace fonts {
 }
 declare const fontSizes: string[];
 declare namespace fontWeights {
-    const light_1: number;
-    export { light_1 as light };
+    export const light: number;
     const normal_1: number;
     export { normal_1 as normal };
     export const semibold: number;
@@ -60,44 +42,8 @@ declare namespace sizes {
 }
 declare const space: string[];
 /**
- * @type Partial<typeof primitives.colors.light>
+ * @type Record<keyof typeof primitives.colors, Record<'colors' | 'shadows', Partial<typeof primitives.colors.light>>
  */
-declare const lightColors: Partial<typeof primitives.colors.light>;
-/**
- * @type Partial<typeof primitives.colors.light>
- */
-declare const lightShadows: Partial<typeof primitives.colors.light>;
-/**
- * @type Partial<typeof primitives.colors.dark>
- */
-declare const darkColors: Partial<typeof primitives.colors.dark>;
-/**
- * @type Partial<typeof primitives.colors.dark>
- */
-declare const darkShadows: Partial<typeof primitives.colors.dark>;
-/**
- * @type Partial<typeof primitives.colors.dark_dimmed>
- */
-declare const darkDimmedColors: Partial<typeof primitives.colors.dark_dimmed>;
-/**
- * @type Partial<typeof primitives.colors.dark_dimmed>
- */
-declare const darkDimmedShadows: Partial<typeof primitives.colors.dark_dimmed>;
-/**
- * @type Partial<typeof primitives.colors.dark_dimmed>
- */
-declare const darkHighContrastColors: Partial<typeof primitives.colors.dark_dimmed>;
-/**
- * @type Partial<typeof primitives.colors.dark_high_contrast>
- */
-declare const darkHighContrastShadows: Partial<typeof primitives.colors.dark_high_contrast>;
+declare const colorSchemes: Record<keyof typeof primitives.colors, Record<'colors' | 'shadows', Partial<typeof primitives.colors.light>>>;
 import { default as primitives } from "@primer/primitives";
-declare const light_2: {
-    colors: {};
-    shadows: {};
-};
-declare const dark_1: {
-    colors: {};
-    shadows: {};
-};
 export {};