@primer/components 0.0.0-2021827203237 → 0.0.0-202182720420
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 +1 -1
- package/dist/browser.esm.js +0 -1
- package/dist/browser.esm.js.map +1 -1
- package/dist/browser.umd.js +0 -1
- package/dist/browser.umd.js.map +1 -1
- package/lib/AvatarStack.js +1 -1
- package/lib-esm/AvatarStack.js +2 -2
- package/package.json +1 -1
package/lib/AvatarStack.js
CHANGED
|
@@ -22,7 +22,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
22
22
|
const AvatarStackWrapper = _styledComponents.default.span.withConfig({
|
|
23
23
|
displayName: "AvatarStack__AvatarStackWrapper",
|
|
24
24
|
componentId: "sc-1qgzd2v-0"
|
|
25
|
-
})(["display:flex;position:relative;height:20px;min-width:", ";.pc-AvatarItem{flex-shrink:0;height:20px;width:20px;box-shadow:0 0 0 1px ", ";margin-left:-11px;position:relative;overflow:hidden;transition:margin 0.2s ease-in-out,opacity 0.2s ease-in-out,visibility 0.2s ease-in-out,box-shadow 0.1s ease-in-out;&:first-child{margin-left:0;}&:nth-child(n + 4){display:none;}}&.pc-AvatarStack--two{min-width:30px;.pc-AvatarItem{&:nth-child(n + 3){display:none;}}}&.pc-AvatarStack--three-plus{min-width:38px;.pc-AvatarItem{&:nth-child(3){opacity:", "%;margin-left:-17px;}&:nth-child(4){opacity:", "%;margin-left:-17px;}&:nth-child(5){opacity:", "%;margin-left:-17px;}&:nth-child(n + 4){display:block;}&:nth-child(n + 6){opacity:0;visibility:hidden;}}}&.pc-AvatarStack--right{justify-content:flex-end;.pc-AvatarItem{margin-left:0 !important;margin-right:-11px;&:first-child{margin-right:0;}}.pc-AvatarStackBody{flex-direction:row-reverse;&:hover{.pc-AvatarItem{margin-right:", "!important;margin-left:0 !important;&:first-child{margin-right:0 !important;}}}}}&.pc-AvatarStack--three-plus.pc-AvatarStack--right{.pc-AvatarItem{&:nth-child(3){margin-right:-17px;}&:nth-child(4){margin-right:-17px;}&:nth-child(5){margin-right:-17px;}}}.pc-AvatarStackBody:hover{width:auto;.pc-AvatarItem{margin-left:", ";opacity:100%;visibility:visible;box-shadow:0 0 0 4px ", ";&:first-child{margin-left:0;}}}", "
|
|
25
|
+
})(["display:flex;position:relative;height:20px;min-width:", ";.pc-AvatarItem{flex-shrink:0;height:20px;width:20px;box-shadow:0 0 0 1px ", ";margin-left:-11px;position:relative;overflow:hidden;transition:margin 0.2s ease-in-out,opacity 0.2s ease-in-out,visibility 0.2s ease-in-out,box-shadow 0.1s ease-in-out;&:first-child{margin-left:0;}&:nth-child(n + 4){display:none;}}&.pc-AvatarStack--two{min-width:30px;.pc-AvatarItem{&:nth-child(n + 3){display:none;}}}&.pc-AvatarStack--three-plus{min-width:38px;.pc-AvatarItem{&:nth-child(3){opacity:", "%;margin-left:-17px;}&:nth-child(4){opacity:", "%;margin-left:-17px;}&:nth-child(5){opacity:", "%;margin-left:-17px;}&:nth-child(n + 4){display:block;}&:nth-child(n + 6){opacity:0;visibility:hidden;}}}&.pc-AvatarStack--right{justify-content:flex-end;.pc-AvatarItem{margin-left:0 !important;margin-right:-11px;&:first-child{margin-right:0;}}.pc-AvatarStackBody{flex-direction:row-reverse;&:hover{.pc-AvatarItem{margin-right:", "!important;margin-left:0 !important;&:first-child{margin-right:0 !important;}}}}}&.pc-AvatarStack--three-plus.pc-AvatarStack--right{.pc-AvatarItem{&:nth-child(3){margin-right:-17px;}&:nth-child(4){margin-right:-17px;}&:nth-child(5){margin-right:-17px;}}}.pc-AvatarStackBody:hover{width:auto;.pc-AvatarItem{margin-left:", ";opacity:100%;visibility:visible;box-shadow:0 0 0 4px ", ";&:first-child{margin-left:0;}}}", ";"], props => props.count === 1 ? '20px' : props.count === 2 ? '30px' : '38px', (0, _constants.get)('colors.canvas.default'), 100 - 3 * 15, 100 - 4 * 15, 100 - 5 * 15, (0, _constants.get)('space.1'), (0, _constants.get)('space.1'), (0, _constants.get)('colors.canvas.default'), _sx.default);
|
|
26
26
|
|
|
27
27
|
const transformChildren = children => {
|
|
28
28
|
return _react.default.Children.map(children, (child, index) => {
|
package/lib-esm/AvatarStack.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import classnames from 'classnames';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import styled from 'styled-components';
|
|
4
|
-
import {
|
|
4
|
+
import { get } from './constants';
|
|
5
5
|
import { Box } from '.';
|
|
6
6
|
import sx from './sx';
|
|
7
7
|
const AvatarStackWrapper = styled.span.withConfig({
|
|
8
8
|
displayName: "AvatarStack__AvatarStackWrapper",
|
|
9
9
|
componentId: "sc-1qgzd2v-0"
|
|
10
|
-
})(["display:flex;position:relative;height:20px;min-width:", ";.pc-AvatarItem{flex-shrink:0;height:20px;width:20px;box-shadow:0 0 0 1px ", ";margin-left:-11px;position:relative;overflow:hidden;transition:margin 0.2s ease-in-out,opacity 0.2s ease-in-out,visibility 0.2s ease-in-out,box-shadow 0.1s ease-in-out;&:first-child{margin-left:0;}&:nth-child(n + 4){display:none;}}&.pc-AvatarStack--two{min-width:30px;.pc-AvatarItem{&:nth-child(n + 3){display:none;}}}&.pc-AvatarStack--three-plus{min-width:38px;.pc-AvatarItem{&:nth-child(3){opacity:", "%;margin-left:-17px;}&:nth-child(4){opacity:", "%;margin-left:-17px;}&:nth-child(5){opacity:", "%;margin-left:-17px;}&:nth-child(n + 4){display:block;}&:nth-child(n + 6){opacity:0;visibility:hidden;}}}&.pc-AvatarStack--right{justify-content:flex-end;.pc-AvatarItem{margin-left:0 !important;margin-right:-11px;&:first-child{margin-right:0;}}.pc-AvatarStackBody{flex-direction:row-reverse;&:hover{.pc-AvatarItem{margin-right:", "!important;margin-left:0 !important;&:first-child{margin-right:0 !important;}}}}}&.pc-AvatarStack--three-plus.pc-AvatarStack--right{.pc-AvatarItem{&:nth-child(3){margin-right:-17px;}&:nth-child(4){margin-right:-17px;}&:nth-child(5){margin-right:-17px;}}}.pc-AvatarStackBody:hover{width:auto;.pc-AvatarItem{margin-left:", ";opacity:100%;visibility:visible;box-shadow:0 0 0 4px ", ";&:first-child{margin-left:0;}}}", "
|
|
10
|
+
})(["display:flex;position:relative;height:20px;min-width:", ";.pc-AvatarItem{flex-shrink:0;height:20px;width:20px;box-shadow:0 0 0 1px ", ";margin-left:-11px;position:relative;overflow:hidden;transition:margin 0.2s ease-in-out,opacity 0.2s ease-in-out,visibility 0.2s ease-in-out,box-shadow 0.1s ease-in-out;&:first-child{margin-left:0;}&:nth-child(n + 4){display:none;}}&.pc-AvatarStack--two{min-width:30px;.pc-AvatarItem{&:nth-child(n + 3){display:none;}}}&.pc-AvatarStack--three-plus{min-width:38px;.pc-AvatarItem{&:nth-child(3){opacity:", "%;margin-left:-17px;}&:nth-child(4){opacity:", "%;margin-left:-17px;}&:nth-child(5){opacity:", "%;margin-left:-17px;}&:nth-child(n + 4){display:block;}&:nth-child(n + 6){opacity:0;visibility:hidden;}}}&.pc-AvatarStack--right{justify-content:flex-end;.pc-AvatarItem{margin-left:0 !important;margin-right:-11px;&:first-child{margin-right:0;}}.pc-AvatarStackBody{flex-direction:row-reverse;&:hover{.pc-AvatarItem{margin-right:", "!important;margin-left:0 !important;&:first-child{margin-right:0 !important;}}}}}&.pc-AvatarStack--three-plus.pc-AvatarStack--right{.pc-AvatarItem{&:nth-child(3){margin-right:-17px;}&:nth-child(4){margin-right:-17px;}&:nth-child(5){margin-right:-17px;}}}.pc-AvatarStackBody:hover{width:auto;.pc-AvatarItem{margin-left:", ";opacity:100%;visibility:visible;box-shadow:0 0 0 4px ", ";&:first-child{margin-left:0;}}}", ";"], props => props.count === 1 ? '20px' : props.count === 2 ? '30px' : '38px', get('colors.canvas.default'), 100 - 3 * 15, 100 - 4 * 15, 100 - 5 * 15, get('space.1'), get('space.1'), get('colors.canvas.default'), sx);
|
|
11
11
|
|
|
12
12
|
const transformChildren = children => {
|
|
13
13
|
return React.Children.map(children, (child, index) => {
|