@primer/components 0.0.0-2021103224924 → 0.0.0-2021103231153
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 +5 -3
- package/dist/browser.esm.js.map +1 -1
- package/dist/browser.umd.js +5 -3
- package/dist/browser.umd.js.map +1 -1
- package/lib/Label.d.ts +1 -2
- package/lib/Label.js +2 -3
- package/lib/UnderlineNav.d.ts +3 -2
- package/lib/UnderlineNav.js +2 -2
- package/lib-esm/Label.d.ts +1 -2
- package/lib-esm/Label.js +3 -4
- package/lib-esm/UnderlineNav.d.ts +3 -2
- package/lib-esm/UnderlineNav.js +3 -3
- package/package.json +1 -1
package/lib/Label.d.ts
CHANGED
@@ -1,11 +1,10 @@
|
|
1
1
|
import { BorderColorProps } from 'styled-system';
|
2
|
-
import { SystemCommonProps } from './constants';
|
3
2
|
import { SxProp } from './sx';
|
4
3
|
import { ComponentProps } from './utils/types';
|
5
4
|
declare const Label: import("styled-components").StyledComponent<"span", any, {
|
6
5
|
variant?: "small" | "medium" | "large" | "xl" | undefined;
|
7
6
|
dropshadow?: boolean | undefined;
|
8
7
|
outline?: boolean | undefined;
|
9
|
-
} & BorderColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> &
|
8
|
+
} & BorderColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & SxProp, never>;
|
10
9
|
export declare type LabelProps = ComponentProps<typeof Label>;
|
11
10
|
export default Label;
|
package/lib/Label.js
CHANGED
@@ -19,7 +19,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
19
19
|
|
20
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
21
21
|
|
22
|
-
const outlineStyles = (0, _styledComponents.css)(["margin-top:-1px;margin-bottom:-1px;color:", ";border:", " solid ", ";box-shadow:none;", ";
|
22
|
+
const outlineStyles = (0, _styledComponents.css)(["margin-top:-1px;margin-bottom:-1px;color:", ";border:", " solid ", ";box-shadow:none;", ";background-color:transparent;"], (0, _constants.get)('colors.fg.muted'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.default'), _styledSystem.borderColor);
|
23
23
|
const sizeVariant = (0, _styledSystem.variant)({
|
24
24
|
variants: {
|
25
25
|
small: {
|
@@ -49,10 +49,9 @@ const sizeVariant = (0, _styledSystem.variant)({
|
|
49
49
|
const Label = _styledComponents.default.span.withConfig({
|
50
50
|
displayName: "Label",
|
51
51
|
componentId: "sc-1t3ykp0-0"
|
52
|
-
})(["display:inline-block;font-weight:", ";color:", ";border-radius:", ";&:hover{text-decoration:none;}", " ", " ", "
|
52
|
+
})(["display:inline-block;font-weight:", ";color:", ";border-radius:", ";background-color:", ";&:hover{text-decoration:none;}", " ", " ", " ", ""], (0, _constants.get)('fontWeights.semibold'), (0, _constants.get)('colors.fg.onEmphasis'), (0, _constants.get)('radii.3'), (0, _constants.get)('colors.neutral.emphasis'), sizeVariant, props => props.dropshadow ? 'box-shadow: inset 0 -1px 0 rgba(27, 31, 35, 0.12)' : '', props => props.outline ? outlineStyles : '', _sx.default);
|
53
53
|
|
54
54
|
Label.defaultProps = {
|
55
|
-
bg: 'neutral.emphasis',
|
56
55
|
variant: 'medium'
|
57
56
|
};
|
58
57
|
var _default = Label;
|
package/lib/UnderlineNav.d.ts
CHANGED
@@ -1,5 +1,6 @@
|
|
1
1
|
import * as History from 'history';
|
2
2
|
import React from 'react';
|
3
|
+
import { SystemCommonProps } from './constants';
|
3
4
|
import { SxProp } from './sx';
|
4
5
|
import { ComponentProps } from './utils/types';
|
5
6
|
declare const UnderlineNavBase: import("styled-components").StyledComponent<"nav", any, SxProp, never>;
|
@@ -13,12 +14,12 @@ declare function UnderlineNav({ actions, className, align, children, full, label
|
|
13
14
|
declare const UnderlineNavLink: import("styled-components").StyledComponent<"a", any, {
|
14
15
|
to?: History.LocationDescriptor<unknown> | undefined;
|
15
16
|
selected?: boolean | undefined;
|
16
|
-
} & SxProp, never>;
|
17
|
+
} & SystemCommonProps & SxProp, never>;
|
17
18
|
export declare type UnderlineNavLinkProps = ComponentProps<typeof UnderlineNavLink>;
|
18
19
|
declare const _default: typeof UnderlineNav & {
|
19
20
|
Link: import("styled-components").StyledComponent<"a", any, {
|
20
21
|
to?: History.LocationDescriptor<unknown> | undefined;
|
21
22
|
selected?: boolean | undefined;
|
22
|
-
} & SxProp, never>;
|
23
|
+
} & SystemCommonProps & SxProp, never>;
|
23
24
|
};
|
24
25
|
export default _default;
|
package/lib/UnderlineNav.js
CHANGED
@@ -25,7 +25,7 @@ const SELECTED_CLASS = 'selected';
|
|
25
25
|
const UnderlineNavBase = _styledComponents.default.nav.withConfig({
|
26
26
|
displayName: "UnderlineNav__UnderlineNavBase",
|
27
27
|
componentId: "zrnxqt-0"
|
28
|
-
})(["display:flex;justify-content:space-between;border-bottom:1px solid ", ";&.UnderlineNav--right{justify-content:flex-end;.UnderlineNav-item{margin-right:0;margin-left:", ";}.UnderlineNav-actions{flex:1 1 auto;}}&.UnderlineNav--full{display:block;}.UnderlineNav-body{display:flex;margin-bottom:-1px;}.UnderlineNav-actions{align-self:center;}", ";"], (0, _constants.get)('colors.border.muted'), (0, _constants.get)('space.3'), _sx.default);
|
28
|
+
})(["display:flex;justify-content:space-between;border-bottom:1px solid ", ";&.UnderlineNav--right{justify-content:flex-end;.UnderlineNav-item{margin-right:0;margin-left:", ";}.UnderlineNav-actions{flex:1 1 auto;}}&.UnderlineNav--full{display:block;}.UnderlineNav-body{display:flex;margin-bottom:-1px;}.UnderlineNav-actions{align-self:center;}", ";", ";"], (0, _constants.get)('colors.border.muted'), (0, _constants.get)('space.3'), _constants.COMMON, _sx.default);
|
29
29
|
|
30
30
|
function UnderlineNav({
|
31
31
|
actions,
|
@@ -57,7 +57,7 @@ const UnderlineNavLink = _styledComponents.default.a.attrs(props => ({
|
|
57
57
|
})).withConfig({
|
58
58
|
displayName: "UnderlineNav__UnderlineNavLink",
|
59
59
|
componentId: "zrnxqt-1"
|
60
|
-
})(["padding:", " ", ";margin-right:", ";font-size:", ";line-height:", ";color:", ";text-align:center;border-bottom:2px solid transparent;text-decoration:none;&:hover,&:focus{color:", ";text-decoration:none;border-bottom-color:", ";transition:0.2s ease;.UnderlineNav-octicon{color:", ";}}&.selected{color:", ";border-bottom-color:", ";.UnderlineNav-octicon{color:", ";}}", ";"], (0, _constants.get)('space.3'), (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.1'), (0, _constants.get)('lineHeights.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.neutral.muted'), (0, _constants.get)('colors.fg.muted'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.primer.border.active'), (0, _constants.get)('colors.fg.default'), _sx.default);
|
60
|
+
})(["padding:", " ", ";margin-right:", ";font-size:", ";line-height:", ";color:", ";text-align:center;border-bottom:2px solid transparent;text-decoration:none;&:hover,&:focus{color:", ";text-decoration:none;border-bottom-color:", ";transition:0.2s ease;.UnderlineNav-octicon{color:", ";}}&.selected{color:", ";border-bottom-color:", ";.UnderlineNav-octicon{color:", ";}}", ";", ";"], (0, _constants.get)('space.3'), (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.1'), (0, _constants.get)('lineHeights.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.neutral.muted'), (0, _constants.get)('colors.fg.muted'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.primer.border.active'), (0, _constants.get)('colors.fg.default'), _constants.COMMON, _sx.default);
|
61
61
|
|
62
62
|
UnderlineNavLink.displayName = 'UnderlineNav.Link';
|
63
63
|
|
package/lib-esm/Label.d.ts
CHANGED
@@ -1,11 +1,10 @@
|
|
1
1
|
import { BorderColorProps } from 'styled-system';
|
2
|
-
import { SystemCommonProps } from './constants';
|
3
2
|
import { SxProp } from './sx';
|
4
3
|
import { ComponentProps } from './utils/types';
|
5
4
|
declare const Label: import("styled-components").StyledComponent<"span", any, {
|
6
5
|
variant?: "small" | "medium" | "large" | "xl" | undefined;
|
7
6
|
dropshadow?: boolean | undefined;
|
8
7
|
outline?: boolean | undefined;
|
9
|
-
} & BorderColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> &
|
8
|
+
} & BorderColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & SxProp, never>;
|
10
9
|
export declare type LabelProps = ComponentProps<typeof Label>;
|
11
10
|
export default Label;
|
package/lib-esm/Label.js
CHANGED
@@ -1,8 +1,8 @@
|
|
1
1
|
import styled, { css } from 'styled-components';
|
2
2
|
import { borderColor, variant } from 'styled-system';
|
3
|
-
import {
|
3
|
+
import { get } from './constants';
|
4
4
|
import sx from './sx';
|
5
|
-
const outlineStyles = css(["margin-top:-1px;margin-bottom:-1px;color:", ";border:", " solid ", ";box-shadow:none;", ";
|
5
|
+
const outlineStyles = css(["margin-top:-1px;margin-bottom:-1px;color:", ";border:", " solid ", ";box-shadow:none;", ";background-color:transparent;"], get('colors.fg.muted'), get('borderWidths.1'), get('colors.border.default'), borderColor);
|
6
6
|
const sizeVariant = variant({
|
7
7
|
variants: {
|
8
8
|
small: {
|
@@ -31,9 +31,8 @@ const sizeVariant = variant({
|
|
31
31
|
const Label = styled.span.withConfig({
|
32
32
|
displayName: "Label",
|
33
33
|
componentId: "sc-1t3ykp0-0"
|
34
|
-
})(["display:inline-block;font-weight:", ";color:", ";border-radius:", ";&:hover{text-decoration:none;}", " ", " ", "
|
34
|
+
})(["display:inline-block;font-weight:", ";color:", ";border-radius:", ";background-color:", ";&:hover{text-decoration:none;}", " ", " ", " ", ""], get('fontWeights.semibold'), get('colors.fg.onEmphasis'), get('radii.3'), get('colors.neutral.emphasis'), sizeVariant, props => props.dropshadow ? 'box-shadow: inset 0 -1px 0 rgba(27, 31, 35, 0.12)' : '', props => props.outline ? outlineStyles : '', sx);
|
35
35
|
Label.defaultProps = {
|
36
|
-
bg: 'neutral.emphasis',
|
37
36
|
variant: 'medium'
|
38
37
|
};
|
39
38
|
export default Label;
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import * as History from 'history';
|
2
2
|
import React from 'react';
|
3
|
+
import { SystemCommonProps } from './constants';
|
3
4
|
import { SxProp } from './sx';
|
4
5
|
import { ComponentProps } from './utils/types';
|
5
6
|
declare const UnderlineNavBase: import("styled-components").StyledComponent<"nav", any, SxProp, never>;
|
@@ -13,12 +14,12 @@ declare function UnderlineNav({ actions, className, align, children, full, label
|
|
13
14
|
declare const UnderlineNavLink: import("styled-components").StyledComponent<"a", any, {
|
14
15
|
to?: History.LocationDescriptor<unknown> | undefined;
|
15
16
|
selected?: boolean | undefined;
|
16
|
-
} & SxProp, never>;
|
17
|
+
} & SystemCommonProps & SxProp, never>;
|
17
18
|
export declare type UnderlineNavLinkProps = ComponentProps<typeof UnderlineNavLink>;
|
18
19
|
declare const _default: typeof UnderlineNav & {
|
19
20
|
Link: import("styled-components").StyledComponent<"a", any, {
|
20
21
|
to?: History.LocationDescriptor<unknown> | undefined;
|
21
22
|
selected?: boolean | undefined;
|
22
|
-
} & SxProp, never>;
|
23
|
+
} & SystemCommonProps & SxProp, never>;
|
23
24
|
};
|
24
25
|
export default _default;
|
package/lib-esm/UnderlineNav.js
CHANGED
@@ -4,14 +4,14 @@ import classnames from 'classnames'; // eslint-disable-next-line import/no-names
|
|
4
4
|
|
5
5
|
import React from 'react';
|
6
6
|
import styled from 'styled-components';
|
7
|
-
import { get } from './constants';
|
7
|
+
import { COMMON, get } from './constants';
|
8
8
|
import sx from './sx';
|
9
9
|
const ITEM_CLASS = 'UnderlineNav-item';
|
10
10
|
const SELECTED_CLASS = 'selected';
|
11
11
|
const UnderlineNavBase = styled.nav.withConfig({
|
12
12
|
displayName: "UnderlineNav__UnderlineNavBase",
|
13
13
|
componentId: "zrnxqt-0"
|
14
|
-
})(["display:flex;justify-content:space-between;border-bottom:1px solid ", ";&.UnderlineNav--right{justify-content:flex-end;.UnderlineNav-item{margin-right:0;margin-left:", ";}.UnderlineNav-actions{flex:1 1 auto;}}&.UnderlineNav--full{display:block;}.UnderlineNav-body{display:flex;margin-bottom:-1px;}.UnderlineNav-actions{align-self:center;}", ";"], get('colors.border.muted'), get('space.3'), sx);
|
14
|
+
})(["display:flex;justify-content:space-between;border-bottom:1px solid ", ";&.UnderlineNav--right{justify-content:flex-end;.UnderlineNav-item{margin-right:0;margin-left:", ";}.UnderlineNav-actions{flex:1 1 auto;}}&.UnderlineNav--full{display:block;}.UnderlineNav-body{display:flex;margin-bottom:-1px;}.UnderlineNav-actions{align-self:center;}", ";", ";"], get('colors.border.muted'), get('space.3'), COMMON, sx);
|
15
15
|
|
16
16
|
function UnderlineNav({
|
17
17
|
actions,
|
@@ -42,7 +42,7 @@ const UnderlineNavLink = styled.a.attrs(props => ({
|
|
42
42
|
})).withConfig({
|
43
43
|
displayName: "UnderlineNav__UnderlineNavLink",
|
44
44
|
componentId: "zrnxqt-1"
|
45
|
-
})(["padding:", " ", ";margin-right:", ";font-size:", ";line-height:", ";color:", ";text-align:center;border-bottom:2px solid transparent;text-decoration:none;&:hover,&:focus{color:", ";text-decoration:none;border-bottom-color:", ";transition:0.2s ease;.UnderlineNav-octicon{color:", ";}}&.selected{color:", ";border-bottom-color:", ";.UnderlineNav-octicon{color:", ";}}", ";"], get('space.3'), get('space.2'), get('space.3'), get('fontSizes.1'), get('lineHeights.default'), get('colors.fg.default'), get('colors.fg.default'), get('colors.neutral.muted'), get('colors.fg.muted'), get('colors.fg.default'), get('colors.primer.border.active'), get('colors.fg.default'), sx);
|
45
|
+
})(["padding:", " ", ";margin-right:", ";font-size:", ";line-height:", ";color:", ";text-align:center;border-bottom:2px solid transparent;text-decoration:none;&:hover,&:focus{color:", ";text-decoration:none;border-bottom-color:", ";transition:0.2s ease;.UnderlineNav-octicon{color:", ";}}&.selected{color:", ";border-bottom-color:", ";.UnderlineNav-octicon{color:", ";}}", ";", ";"], get('space.3'), get('space.2'), get('space.3'), get('fontSizes.1'), get('lineHeights.default'), get('colors.fg.default'), get('colors.fg.default'), get('colors.neutral.muted'), get('colors.fg.muted'), get('colors.fg.default'), get('colors.primer.border.active'), get('colors.fg.default'), COMMON, sx);
|
46
46
|
UnderlineNavLink.displayName = 'UnderlineNav.Link';
|
47
47
|
export default Object.assign(UnderlineNav, {
|
48
48
|
Link: UnderlineNavLink
|