@primer/components 0.0.0-20211010162049 → 0.0.0-2021101017825

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.
Files changed (4) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/lib/ActionList2/Item.js +8 -6
  3. package/lib-esm/ActionList2/Item.js +8 -6
  4. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # @primer/components
2
2
 
3
- ## 0.0.0-20211010162049
3
+ ## 0.0.0-2021101017825
4
4
 
5
5
  ### Minor Changes
6
6
 
package/lib/ActionList2/Item.js CHANGED
@@ -102,9 +102,9 @@ const Item = /*#__PURE__*/_react.default.forwardRef(({
102
102
  paddingY: '6px',
103
103
  // custom value off the scale
104
104
  lineHeight: TEXT_ROW_HEIGHT,
105
- marginX: listVariant === 'inset' ? 2 : 0,
106
105
  minHeight: 5,
107
- borderRadius: 2,
106
+ marginX: listVariant === 'inset' ? 2 : 0,
107
+ borderRadius: listVariant === 'inset' ? 2 : 0,
108
108
  transition: 'background 33.333ms linear',
109
109
  color: getVariantStyles(variant, disabled).color,
110
110
  textDecoration: 'none',
@@ -117,14 +117,16 @@ const Item = /*#__PURE__*/_react.default.forwardRef(({
117
117
  backgroundColor: `actionListItem.${variant}.hoverBg`,
118
118
  color: getVariantStyles(variant, disabled).hoverColor
119
119
  },
120
- ':focus:not(:focus-visible):not([aria-disabled])': {
120
+ ':focus:not([data-focus-visible-added])': {
121
121
  backgroundColor: `actionListItem.${variant}.selectedBg`,
122
122
  color: getVariantStyles(variant, disabled).hoverColor,
123
123
  outline: 'none'
124
124
  },
125
- ':focus-visible:not([aria-disabled])': {
126
- outline: '2px solid',
127
- outlineColor: 'accent.emphasis'
125
+ '&[data-focus-visible-added]': {
126
+ // we don't use :focus-visible because not all browsers (safari) have it yet
127
+ outline: 'none',
128
+ border: `2 solid`,
129
+ boxShadow: `0 0 0 2px ${theme === null || theme === void 0 ? void 0 : theme.colors.accent.emphasis}`
128
130
  },
129
131
  ':active:not([aria-disabled])': {
130
132
  backgroundColor: `actionListItem.${variant}.activeBg`,
package/lib-esm/ActionList2/Item.js CHANGED
@@ -73,9 +73,9 @@ export const Item = /*#__PURE__*/React.forwardRef(({
73
73
  paddingY: '6px',
74
74
  // custom value off the scale
75
75
  lineHeight: TEXT_ROW_HEIGHT,
76
- marginX: listVariant === 'inset' ? 2 : 0,
77
76
  minHeight: 5,
78
- borderRadius: 2,
77
+ marginX: listVariant === 'inset' ? 2 : 0,
78
+ borderRadius: listVariant === 'inset' ? 2 : 0,
79
79
  transition: 'background 33.333ms linear',
80
80
  color: getVariantStyles(variant, disabled).color,
81
81
  textDecoration: 'none',
@@ -88,14 +88,16 @@ export const Item = /*#__PURE__*/React.forwardRef(({
88
88
  backgroundColor: `actionListItem.${variant}.hoverBg`,
89
89
  color: getVariantStyles(variant, disabled).hoverColor
90
90
  },
91
- ':focus:not(:focus-visible):not([aria-disabled])': {
91
+ ':focus:not([data-focus-visible-added])': {
92
92
  backgroundColor: `actionListItem.${variant}.selectedBg`,
93
93
  color: getVariantStyles(variant, disabled).hoverColor,
94
94
  outline: 'none'
95
95
  },
96
- ':focus-visible:not([aria-disabled])': {
97
- outline: '2px solid',
98
- outlineColor: 'accent.emphasis'
96
+ '&[data-focus-visible-added]': {
97
+ // we don't use :focus-visible because not all browsers (safari) have it yet
98
+ outline: 'none',
99
+ border: `2 solid`,
100
+ boxShadow: `0 0 0 2px ${theme === null || theme === void 0 ? void 0 : theme.colors.accent.emphasis}`
99
101
  },
100
102
  ':active:not([aria-disabled])': {
101
103
  backgroundColor: `actionListItem.${variant}.activeBg`,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/components",
3
- "version": "0.0.0-20211010162049",
3
+ "version": "0.0.0-2021101017825",
4
4
  "description": "Primer react components",
5
5
  "main": "lib/index.js",
6
6
  "module": "lib-esm/index.js",