@primer/components 0.0.0-202110322927 → 0.0.0-202110323331

package/lib-esm/FilterList.js

@@ -1,11 +1,11 @@
 import React from 'react';
 import styled from 'styled-components';
-import { COMMON, get } from './constants';
+import { get } from './constants';
 import sx from './sx';
 const FilterListBase = styled.ul.withConfig({
   displayName: "FilterList__FilterListBase",
   componentId: "sc-1l4pxmz-0"
-})(["list-style-type:none;", ";", ";"], COMMON, sx);
+})(["list-style-type:none;margin:0;padding:0;", ";"], sx);
 
 const FilterList = ({
   children,
@@ -21,7 +21,7 @@ FilterList.displayName = "FilterList";
 const FilterListItemBase = styled.a.withConfig({
   displayName: "FilterList__FilterListItemBase",
   componentId: "sc-1l4pxmz-1"
-})(["position:relative;display:block;padding:", ";margin:", ";overflow:hidden;font-size:", ";color:", ";background-color:", "!important;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-radius:", ";&:hover{text-decoration:none;background-color:", ";}&:active{color:", ";background-color:", ";}.count{float:right;font-weight:", ";}", ";", ";"], props => props.small ? `${get('space.1')(props)} 10px` : `${get('space.2')(props)} 11px`, props => props.small ? '0 0 2px' : '0 0 5px 0', get('fontSizes.1'), props => props.selected ? get('colors.fg.onEmphasis') : get('colors.fg.muted'), props => props.selected ? get('colors.accent.emphasis') : '', get('radii.1'), get('colors.canvas.subtle'), get('colors.fg.onEmphasis'), get('colors.accent.emphasis'), get('fontWeights.bold'), COMMON, sx);
+})(["position:relative;display:block;padding:", ";margin:", ";overflow:hidden;font-size:", ";color:", ";background-color:", "!important;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-radius:", ";&:hover{text-decoration:none;background-color:", ";}&:active{color:", ";background-color:", ";}.count{float:right;font-weight:", ";}", ";"], props => props.small ? `${get('space.1')(props)} 10px` : `${get('space.2')(props)} 11px`, props => props.small ? '0 0 2px' : '0 0 5px 0', get('fontSizes.1'), props => props.selected ? get('colors.fg.onEmphasis') : get('colors.fg.muted'), props => props.selected ? get('colors.accent.emphasis') : '', get('radii.1'), get('colors.canvas.subtle'), get('colors.fg.onEmphasis'), get('colors.accent.emphasis'), get('fontWeights.bold'), sx);
 
 function FilterListItem({
   children,
@@ -35,10 +35,6 @@ function FilterListItem({
 }
 
 FilterListItem.displayName = "FilterListItem";
-FilterList.defaultProps = {
-  m: 0,
-  p: 0
-};
 FilterListItem.displayName = 'FilterList.Item';
 export default Object.assign(FilterList, {
   Item: FilterListItem

package/lib-esm/SideNav.d.ts

@@ -1,16 +1,14 @@
 /// <reference types="hoist-non-react-statics" />
+/// <reference types="react" />
 import * as History from 'history';
+import Box from './Box';
 import { ComponentProps } from './utils/types';
-import React from 'react';
-import { SxProp } from './sx';
 declare type SideNavBaseProps = {
     variant?: 'lightweight' | 'normal';
     bordered?: boolean;
-    className?: string;
-    children?: React.ReactNode;
-};
-declare function SideNavBase({ variant, className, bordered, children }: SideNavBaseProps): JSX.Element;
-declare const SideNav: import("styled-components").StyledComponent<typeof SideNavBase, any, SxProp, never>;
+} & ComponentProps<typeof Box>;
+declare function SideNavBase({ variant, className, bordered, children, ...props }: SideNavBaseProps): JSX.Element;
+declare const SideNav: import("styled-components").StyledComponent<typeof SideNavBase, any, {}, never>;
 declare type StyledSideNavLinkProps = {
     to?: History.LocationDescriptor;
     selected?: boolean;
@@ -20,14 +18,14 @@ declare const SideNavLink: import("styled-components").StyledComponent<"a", any,
     hoverColor?: string | undefined;
     muted?: boolean | undefined;
     underline?: boolean | undefined;
-} & import("./constants").SystemCommonProps & SxProp & import("./constants").SystemTypographyProps & StyledSideNavLinkProps, never>;
+} & import("./constants").SystemCommonProps & import("./sx").SxProp & import("./constants").SystemTypographyProps & StyledSideNavLinkProps, never>;
 export declare type SideNavProps = ComponentProps<typeof SideNav>;
 export declare type SideNavLinkProps = ComponentProps<typeof SideNavLink>;
-declare const _default: string & import("styled-components").StyledComponentBase<typeof SideNavBase, any, SxProp, never> & import("hoist-non-react-statics").NonReactStatics<typeof SideNavBase, {}> & {
+declare const _default: string & import("styled-components").StyledComponentBase<typeof SideNavBase, any, {}, never> & import("hoist-non-react-statics").NonReactStatics<typeof SideNavBase, {}> & {
     Link: import("styled-components").StyledComponent<"a", any, {
         hoverColor?: string | undefined;
         muted?: boolean | undefined;
         underline?: boolean | undefined;
-    } & import("./constants").SystemCommonProps & SxProp & import("./constants").SystemTypographyProps & StyledSideNavLinkProps, never>;
+    } & import("./constants").SystemCommonProps & import("./sx").SxProp & import("./constants").SystemTypographyProps & StyledSideNavLinkProps, never>;
 };
 export default _default;

package/lib-esm/SideNav.js

@@ -1,5 +1,7 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 // eslint-disable-next-line import/no-namespace
-import { get } from './constants';
+import { COMMON, get } from './constants';
 import styled, { css } from 'styled-components';
 import Box from './Box';
 import Link from './Link';
@@ -11,25 +13,33 @@ function SideNavBase({
   variant,
   className,
   bordered,
-  children
+  children,
+  ...props
 }) {
   const variantClassName = variant === 'lightweight' ? 'lightweight' : 'normal';
   const newClassName = classnames(className, `variant-${variantClassName}`);
-  return /*#__PURE__*/React.createElement(Box, {
-    borderWidth: bordered ? '1px' : 0,
+
+  if (!bordered) {
+    props = { ...props,
+      borderWidth: 0
+    };
+  }
+
+  return /*#__PURE__*/React.createElement(Box, _extends({
+    borderWidth: "1px",
     borderStyle: "solid",
     borderColor: "border.default",
     borderRadius: 2,
     as: "nav",
     className: newClassName
-  }, children);
+  }, props), children);
 }
 
 SideNavBase.displayName = "SideNavBase";
 const SideNav = styled(SideNavBase).withConfig({
   displayName: "SideNav",
   componentId: "sc-15k667c-0"
-})(["background-color:", ";", " ", ";"], get('colors.canvas.subtle'), props => props.bordered && css(["& > &{border-left:0;border-right:0;border-bottom:0;}"]), sx);
+})(["background-color:", ";", " ", ";", ";"], get('colors.canvas.subtle'), props => props.bordered && css(["& > &{border-left:0;border-right:0;border-bottom:0;}"]), COMMON, sx);
 // used for variant normal hover, focus pseudo selectors
 const CommonAccessibilityVariantNormalStyles = css(["background-color:", ";outline:none;text-decoration:none;"], get('colors.neutral.subtle')); // used for light weight hover, focus pseudo selectors
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/components",
-  "version": "0.0.0-202110322927",
+  "version": "0.0.0-202110323331",
   "description": "Primer react components",
   "main": "lib/index.js",
   "module": "lib-esm/index.js",