@primer/components 0.0.0-202110320949 → 0.0.0-202110321848
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -2
- package/dist/browser.esm.js +3 -1
- package/dist/browser.esm.js.map +1 -1
- package/dist/browser.umd.js +3 -1
- package/dist/browser.umd.js.map +1 -1
- package/lib/Dropdown.d.ts +5 -4
- package/lib/Dropdown.js +3 -3
- package/lib/Pagehead.d.ts +1 -2
- package/lib/Pagehead.js +1 -1
- package/lib-esm/Dropdown.d.ts +5 -4
- package/lib-esm/Dropdown.js +4 -4
- package/lib-esm/Pagehead.d.ts +1 -2
- package/lib-esm/Pagehead.js +2 -2
- package/package.json +1 -1
package/lib/Dropdown.d.ts
CHANGED
@@ -1,14 +1,15 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { ButtonProps } from './Button';
|
3
|
+
import { SystemCommonProps } from './constants';
|
3
4
|
import { DetailsProps } from './Details';
|
4
5
|
import { SxProp } from './sx';
|
5
6
|
import { ComponentProps } from './utils/types';
|
6
7
|
export declare type DropdownProps = DetailsProps;
|
7
8
|
export declare type DropdownButtonProps = ButtonProps;
|
8
|
-
declare const DropdownCaret: import("styled-components").StyledComponent<"div", any, SxProp, never>;
|
9
|
+
declare const DropdownCaret: import("styled-components").StyledComponent<"div", any, SystemCommonProps & SxProp, never>;
|
9
10
|
declare const DropdownMenu: import("styled-components").StyledComponent<"ul", any, {
|
10
11
|
direction?: "s" | "ne" | "e" | "se" | "sw" | "w" | undefined;
|
11
|
-
} & SxProp, never>;
|
12
|
+
} & SystemCommonProps & SxProp, never>;
|
12
13
|
declare const DropdownItem: import("styled-components").StyledComponent<"li", any, SxProp, never>;
|
13
14
|
export declare type DropdownCaretProps = ComponentProps<typeof DropdownCaret>;
|
14
15
|
export declare type DropdownMenuProps = ComponentProps<typeof DropdownMenu>;
|
@@ -609,10 +610,10 @@ declare const _default: {
|
|
609
610
|
theme?: any;
|
610
611
|
}> | undefined;
|
611
612
|
} & {
|
612
|
-
Caret: import("styled-components").StyledComponent<"div", any, SxProp, never>;
|
613
|
+
Caret: import("styled-components").StyledComponent<"div", any, SystemCommonProps & SxProp, never>;
|
613
614
|
Menu: import("styled-components").StyledComponent<"ul", any, {
|
614
615
|
direction?: "s" | "ne" | "e" | "se" | "sw" | "w" | undefined;
|
615
|
-
} & SxProp, never>;
|
616
|
+
} & SystemCommonProps & SxProp, never>;
|
616
617
|
Item: import("styled-components").StyledComponent<"li", any, SxProp, never>;
|
617
618
|
Button: {
|
618
619
|
({ children, ...rest }: {
|
package/lib/Dropdown.js
CHANGED
@@ -62,17 +62,17 @@ DropdownButton.displayName = "DropdownButton";
|
|
62
62
|
const DropdownCaret = _styledComponents.default.div.withConfig({
|
63
63
|
displayName: "Dropdown__DropdownCaret",
|
64
64
|
componentId: "sc-16yoecj-1"
|
65
|
-
})(["border:4px solid transparent;margin-left:12px;border-top-color:currentcolor;border-bottom-width:0;content:'';display:inline-block;height:0;vertical-align:middle;width:0;", ";"], _sx.default);
|
65
|
+
})(["border:4px solid transparent;margin-left:12px;border-top-color:currentcolor;border-bottom-width:0;content:'';display:inline-block;height:0;vertical-align:middle;width:0;", ";", ";"], _constants.COMMON, _sx.default);
|
66
66
|
|
67
67
|
const DropdownMenu = _styledComponents.default.ul.withConfig({
|
68
68
|
displayName: "Dropdown__DropdownMenu",
|
69
69
|
componentId: "sc-16yoecj-2"
|
70
|
-
})(["background-clip:padding-box;background-color:", ";border:1px solid ", ";border-radius:", ";box-shadow:", ";left:0;list-style:none;margin-top:2px;padding:5px 0 5px 0 !important;position:absolute;top:100%;width:160px;z-index:100;&::before{position:absolute;display:inline-block;content:'';}&::after{position:absolute;display:inline-block;content:'';}&::before{border:8px solid transparent;border-bottom-color:", ";}&::after{border:7px solid transparent;border-bottom-color:", ";}> ul{list-style:none;}", ";", ";"], (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('colors.border.default'), (0, _constants.get)('radii.2'), (0, _constants.get)('shadows.shadow.large'), (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('colors.canvas.overlay'), props => props.direction ? (0, _DropdownStyles.default)(props.theme, props.direction) : '', _sx.default);
|
70
|
+
})(["background-clip:padding-box;background-color:", ";border:1px solid ", ";border-radius:", ";box-shadow:", ";left:0;list-style:none;margin-top:2px;padding:5px 0 5px 0 !important;position:absolute;top:100%;width:160px;z-index:100;&::before{position:absolute;display:inline-block;content:'';}&::after{position:absolute;display:inline-block;content:'';}&::before{border:8px solid transparent;border-bottom-color:", ";}&::after{border:7px solid transparent;border-bottom-color:", ";}> ul{list-style:none;}", ";", ";", ";"], (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('colors.border.default'), (0, _constants.get)('radii.2'), (0, _constants.get)('shadows.shadow.large'), (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('colors.canvas.overlay'), props => props.direction ? (0, _DropdownStyles.default)(props.theme, props.direction) : '', _constants.COMMON, _sx.default);
|
71
71
|
|
72
72
|
const DropdownItem = _styledComponents.default.li.withConfig({
|
73
73
|
displayName: "Dropdown__DropdownItem",
|
74
74
|
componentId: "sc-16yoecj-3"
|
75
|
-
})(["display:block;padding:", " 10px ", " 15px;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;a{color:", ";text-decoration:none;display:block;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;}&:focus,a:focus{color:", ";text-decoration:none;background-color:", ";}&:hover,&:hover a{color:", ";text-decoration:none;background-color:", ";outline:none;}", ";"], (0, _constants.get)('space.1'), (0, _constants.get)('space.1'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.onEmphasis'), (0, _constants.get)('colors.accent.emphasis'), (0, _constants.get)('colors.fg.onEmphasis'), (0, _constants.get)('colors.accent.emphasis'), _sx.default);
|
75
|
+
})(["display:block;padding:", " 10px ", " 15px;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;a{color:", ";text-decoration:none;display:block;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;}&:focus,a:focus{color:", ";text-decoration:none;background-color:", ";}&:hover,&:hover a{color:", ";text-decoration:none;background-color:", ";outline:none;}", ";", ";"], (0, _constants.get)('space.1'), (0, _constants.get)('space.1'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.onEmphasis'), (0, _constants.get)('colors.accent.emphasis'), (0, _constants.get)('colors.fg.onEmphasis'), (0, _constants.get)('colors.accent.emphasis'), _constants.COMMON, _sx.default);
|
76
76
|
|
77
77
|
DropdownMenu.defaultProps = {
|
78
78
|
direction: 'sw'
|
package/lib/Pagehead.d.ts
CHANGED
@@ -1,6 +1,5 @@
|
|
1
|
-
import { SystemCommonProps } from './constants';
|
2
1
|
import { SxProp } from './sx';
|
3
2
|
import { ComponentProps } from './utils/types';
|
4
|
-
declare const Pagehead: import("styled-components").StyledComponent<"div", any,
|
3
|
+
declare const Pagehead: import("styled-components").StyledComponent<"div", any, SxProp, never>;
|
5
4
|
export declare type PageheadProps = ComponentProps<typeof Pagehead>;
|
6
5
|
export default Pagehead;
|
package/lib/Pagehead.js
CHANGED
@@ -16,7 +16,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
16
16
|
const Pagehead = _styledComponents.default.div.withConfig({
|
17
17
|
displayName: "Pagehead",
|
18
18
|
componentId: "sc-1ntn78e-0"
|
19
|
-
})(["position:relative;padding-top:", ";padding-bottom:", ";margin-bottom:", ";border-bottom:1px solid ", ";", ";"
|
19
|
+
})(["position:relative;padding-top:", ";padding-bottom:", ";margin-bottom:", ";border-bottom:1px solid ", ";", ";"], (0, _constants.get)('space.4'), (0, _constants.get)('space.4'), (0, _constants.get)('space.4'), (0, _constants.get)('colors.border.default'), _sx.default);
|
20
20
|
|
21
21
|
var _default = Pagehead;
|
22
22
|
exports.default = _default;
|
package/lib-esm/Dropdown.d.ts
CHANGED
@@ -1,14 +1,15 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { ButtonProps } from './Button';
|
3
|
+
import { SystemCommonProps } from './constants';
|
3
4
|
import { DetailsProps } from './Details';
|
4
5
|
import { SxProp } from './sx';
|
5
6
|
import { ComponentProps } from './utils/types';
|
6
7
|
export declare type DropdownProps = DetailsProps;
|
7
8
|
export declare type DropdownButtonProps = ButtonProps;
|
8
|
-
declare const DropdownCaret: import("styled-components").StyledComponent<"div", any, SxProp, never>;
|
9
|
+
declare const DropdownCaret: import("styled-components").StyledComponent<"div", any, SystemCommonProps & SxProp, never>;
|
9
10
|
declare const DropdownMenu: import("styled-components").StyledComponent<"ul", any, {
|
10
11
|
direction?: "s" | "ne" | "e" | "se" | "sw" | "w" | undefined;
|
11
|
-
} & SxProp, never>;
|
12
|
+
} & SystemCommonProps & SxProp, never>;
|
12
13
|
declare const DropdownItem: import("styled-components").StyledComponent<"li", any, SxProp, never>;
|
13
14
|
export declare type DropdownCaretProps = ComponentProps<typeof DropdownCaret>;
|
14
15
|
export declare type DropdownMenuProps = ComponentProps<typeof DropdownMenu>;
|
@@ -609,10 +610,10 @@ declare const _default: {
|
|
609
610
|
theme?: any;
|
610
611
|
}> | undefined;
|
611
612
|
} & {
|
612
|
-
Caret: import("styled-components").StyledComponent<"div", any, SxProp, never>;
|
613
|
+
Caret: import("styled-components").StyledComponent<"div", any, SystemCommonProps & SxProp, never>;
|
613
614
|
Menu: import("styled-components").StyledComponent<"ul", any, {
|
614
615
|
direction?: "s" | "ne" | "e" | "se" | "sw" | "w" | undefined;
|
615
|
-
} & SxProp, never>;
|
616
|
+
} & SystemCommonProps & SxProp, never>;
|
616
617
|
Item: import("styled-components").StyledComponent<"li", any, SxProp, never>;
|
617
618
|
Button: {
|
618
619
|
({ children, ...rest }: {
|
package/lib-esm/Dropdown.js
CHANGED
@@ -3,7 +3,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
3
3
|
import React from 'react';
|
4
4
|
import styled from 'styled-components';
|
5
5
|
import Button from './Button';
|
6
|
-
import { get } from './constants';
|
6
|
+
import { COMMON, get } from './constants';
|
7
7
|
import Details from './Details';
|
8
8
|
import getDirectionStyles from './DropdownStyles';
|
9
9
|
import useDetails from './hooks/useDetails';
|
@@ -44,15 +44,15 @@ DropdownButton.displayName = "DropdownButton";
|
|
44
44
|
const DropdownCaret = styled.div.withConfig({
|
45
45
|
displayName: "Dropdown__DropdownCaret",
|
46
46
|
componentId: "sc-16yoecj-1"
|
47
|
-
})(["border:4px solid transparent;margin-left:12px;border-top-color:currentcolor;border-bottom-width:0;content:'';display:inline-block;height:0;vertical-align:middle;width:0;", ";"], sx);
|
47
|
+
})(["border:4px solid transparent;margin-left:12px;border-top-color:currentcolor;border-bottom-width:0;content:'';display:inline-block;height:0;vertical-align:middle;width:0;", ";", ";"], COMMON, sx);
|
48
48
|
const DropdownMenu = styled.ul.withConfig({
|
49
49
|
displayName: "Dropdown__DropdownMenu",
|
50
50
|
componentId: "sc-16yoecj-2"
|
51
|
-
})(["background-clip:padding-box;background-color:", ";border:1px solid ", ";border-radius:", ";box-shadow:", ";left:0;list-style:none;margin-top:2px;padding:5px 0 5px 0 !important;position:absolute;top:100%;width:160px;z-index:100;&::before{position:absolute;display:inline-block;content:'';}&::after{position:absolute;display:inline-block;content:'';}&::before{border:8px solid transparent;border-bottom-color:", ";}&::after{border:7px solid transparent;border-bottom-color:", ";}> ul{list-style:none;}", ";", ";"], get('colors.canvas.overlay'), get('colors.border.default'), get('radii.2'), get('shadows.shadow.large'), get('colors.canvas.overlay'), get('colors.canvas.overlay'), props => props.direction ? getDirectionStyles(props.theme, props.direction) : '', sx);
|
51
|
+
})(["background-clip:padding-box;background-color:", ";border:1px solid ", ";border-radius:", ";box-shadow:", ";left:0;list-style:none;margin-top:2px;padding:5px 0 5px 0 !important;position:absolute;top:100%;width:160px;z-index:100;&::before{position:absolute;display:inline-block;content:'';}&::after{position:absolute;display:inline-block;content:'';}&::before{border:8px solid transparent;border-bottom-color:", ";}&::after{border:7px solid transparent;border-bottom-color:", ";}> ul{list-style:none;}", ";", ";", ";"], get('colors.canvas.overlay'), get('colors.border.default'), get('radii.2'), get('shadows.shadow.large'), get('colors.canvas.overlay'), get('colors.canvas.overlay'), props => props.direction ? getDirectionStyles(props.theme, props.direction) : '', COMMON, sx);
|
52
52
|
const DropdownItem = styled.li.withConfig({
|
53
53
|
displayName: "Dropdown__DropdownItem",
|
54
54
|
componentId: "sc-16yoecj-3"
|
55
|
-
})(["display:block;padding:", " 10px ", " 15px;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;a{color:", ";text-decoration:none;display:block;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;}&:focus,a:focus{color:", ";text-decoration:none;background-color:", ";}&:hover,&:hover a{color:", ";text-decoration:none;background-color:", ";outline:none;}", ";"], get('space.1'), get('space.1'), get('colors.fg.default'), get('colors.fg.default'), get('colors.fg.default'), get('colors.fg.onEmphasis'), get('colors.accent.emphasis'), get('colors.fg.onEmphasis'), get('colors.accent.emphasis'), sx);
|
55
|
+
})(["display:block;padding:", " 10px ", " 15px;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;a{color:", ";text-decoration:none;display:block;overflow:hidden;color:", ";text-overflow:ellipsis;white-space:nowrap;}&:focus,a:focus{color:", ";text-decoration:none;background-color:", ";}&:hover,&:hover a{color:", ";text-decoration:none;background-color:", ";outline:none;}", ";", ";"], get('space.1'), get('space.1'), get('colors.fg.default'), get('colors.fg.default'), get('colors.fg.default'), get('colors.fg.onEmphasis'), get('colors.accent.emphasis'), get('colors.fg.onEmphasis'), get('colors.accent.emphasis'), COMMON, sx);
|
56
56
|
DropdownMenu.defaultProps = {
|
57
57
|
direction: 'sw'
|
58
58
|
};
|
package/lib-esm/Pagehead.d.ts
CHANGED
@@ -1,6 +1,5 @@
|
|
1
|
-
import { SystemCommonProps } from './constants';
|
2
1
|
import { SxProp } from './sx';
|
3
2
|
import { ComponentProps } from './utils/types';
|
4
|
-
declare const Pagehead: import("styled-components").StyledComponent<"div", any,
|
3
|
+
declare const Pagehead: import("styled-components").StyledComponent<"div", any, SxProp, never>;
|
5
4
|
export declare type PageheadProps = ComponentProps<typeof Pagehead>;
|
6
5
|
export default Pagehead;
|
package/lib-esm/Pagehead.js
CHANGED
@@ -1,8 +1,8 @@
|
|
1
1
|
import styled from 'styled-components';
|
2
|
-
import {
|
2
|
+
import { get } from './constants';
|
3
3
|
import sx from './sx';
|
4
4
|
const Pagehead = styled.div.withConfig({
|
5
5
|
displayName: "Pagehead",
|
6
6
|
componentId: "sc-1ntn78e-0"
|
7
|
-
})(["position:relative;padding-top:", ";padding-bottom:", ";margin-bottom:", ";border-bottom:1px solid ", ";", ";"
|
7
|
+
})(["position:relative;padding-top:", ";padding-bottom:", ";margin-bottom:", ";border-bottom:1px solid ", ";", ";"], get('space.4'), get('space.4'), get('space.4'), get('colors.border.default'), sx);
|
8
8
|
export default Pagehead;
|