@pingux/astro 2.196.0-alpha.0 → 2.197.0-alpha.0

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 (7) hide show
  1. package/lib/cjs/components/LinkSelectField/LinkSelectField.js +9 -6
  2. package/lib/cjs/components/LinkSelectField/LinkSelectField.test.js +18 -0
  3. package/lib/cjs/styles/themeOverrides/onyxDarkUiLibraryOverride.js +3 -1
  4. package/lib/components/LinkSelectField/LinkSelectField.js +9 -6
  5. package/lib/components/LinkSelectField/LinkSelectField.test.js +18 -0
  6. package/lib/styles/themeOverrides/onyxDarkUiLibraryOverride.js +3 -1
  7. package/package.json +1 -1
package/lib/cjs/components/LinkSelectField/LinkSelectField.js CHANGED
@@ -41,8 +41,10 @@ var LinkSelectField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
41
41
  isDisabled = props.isDisabled,
42
42
  status = props.status,
43
43
  helperText = props.helperText,
44
+ iconProps = props.iconProps,
44
45
  hasInlineLoader = props.hasInlineLoader,
45
- popoverWidth = props.popoverWidth;
46
+ popoverWidth = props.popoverWidth,
47
+ triggerProps = props.triggerProps;
46
48
  var _getAriaAttributeProp = (0, _ariaAttributes.getAriaAttributeProps)(props),
47
49
  ariaProps = _getAriaAttributeProp.ariaProps;
48
50
  var _useGetTheme = (0, _hooks.useGetTheme)(),
@@ -63,14 +65,14 @@ var LinkSelectField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
63
65
  var fieldControlInputProps = selectFieldProps.fieldControlInputProps,
64
66
  isLoadingInitial = selectFieldProps.isLoadingInitial,
65
67
  state = selectFieldProps.state,
66
- triggerProps = selectFieldProps.triggerProps,
68
+ raTriggerProps = selectFieldProps.triggerProps,
67
69
  triggerRef = selectFieldProps.triggerRef;
68
70
  var trigger = (0, _react2.jsx)(_.Button, (0, _extends2["default"])({
69
71
  className: fieldControlInputProps.className,
70
72
  ref: triggerRef,
71
73
  variant: "link",
72
74
  tabIndex: isDisabled ? -1 : 0
73
- }, (0, _pendoID.getPendoID)(displayName), triggerProps, ariaProps, {
75
+ }, (0, _pendoID.getPendoID)(displayName), triggerProps, raTriggerProps, ariaProps, {
74
76
  "aria-describedby": helperText && helperTextId
75
77
  }), (0, _react2.jsx)(_.Text, {
76
78
  variant: "label",
@@ -83,15 +85,16 @@ var LinkSelectField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
83
85
  as: "span",
84
86
  "aria-hidden": "true",
85
87
  variant: "forms.select.arrow"
86
- }, (0, _react2.jsx)(_.Icon, {
88
+ }, (0, _react2.jsx)(_.Icon, (0, _extends2["default"])({
87
89
  icon: _MenuDownIcon["default"],
88
90
  title: {
89
91
  name: 'Menu Down Icon'
90
- },
92
+ }
93
+ }, iconProps, {
91
94
  sx: state.isOpen ? {
92
95
  transform: 'rotate(180deg)'
93
96
  } : null
94
- }))), (0, _react2.jsx)(_reactAria.VisuallyHidden, {
97
+ })))), (0, _react2.jsx)(_reactAria.VisuallyHidden, {
95
98
  "aria-live": "polite",
96
99
  id: helperTextId
97
100
  }, helperText));
package/lib/cjs/components/LinkSelectField/LinkSelectField.test.js CHANGED
@@ -231,6 +231,24 @@ test('passing helper text should display it and correct aria attributes on input
231
231
  var helperTextID = helper.getAttribute('id');
232
232
  expect(_testWrapper.screen.getByRole('button')).toHaveAttribute('aria-describedby', helperTextID);
233
233
  });
234
+ test('iconProps are spread to the icon element', function () {
235
+ var iconTestId = 'custom-icon';
236
+ getComponent({
237
+ iconProps: {
238
+ 'data-testid': iconTestId
239
+ }
240
+ });
241
+ expect(_testWrapper.screen.getByTestId(iconTestId)).toBeInTheDocument();
242
+ });
243
+ test('triggerProps are spread to the trigger button', function () {
244
+ getComponent({
245
+ triggerProps: {
246
+ 'data-custom': 'custom-trigger'
247
+ }
248
+ });
249
+ var button = _testWrapper.screen.getByRole('button');
250
+ expect(button).toHaveAttribute('data-custom', 'custom-trigger');
251
+ });
234
252
 
235
253
  // Needs to be added to each components test file
236
254
  (0, _universalComponentTest.universalComponentTests)({
package/lib/cjs/styles/themeOverrides/onyxDarkUiLibraryOverride.js CHANGED
@@ -94,11 +94,13 @@ var forms = {
94
94
  borderColor: '#caced3 !important'
95
95
  },
96
96
  '&[type=password]:focus': {
97
+ outline: '1px solid',
98
+ outlineColor: 'accent.60',
99
+ outlineOffset: '0px',
97
100
  borderColor: "".concat(_onyxTokens.astroTokens.color.blue[500], " !important")
98
101
  },
99
102
  numberField: _objectSpread(_objectSpread(_objectSpread({}, _nextGenDarkMode["default"].input), _nextGenDarkMode["default"].numberFieldStyles), {}, {
100
103
  '&[type=text]': _objectSpread(_objectSpread({}, _nextGenDarkMode["default"].text.inputValue), {}, {
101
- backgroundColor: 'white',
102
104
  borderColor: _onyxTokens.astroTokensDark.color.gray[500]
103
105
  }),
104
106
  '&[type=text]:focus': {
package/lib/components/LinkSelectField/LinkSelectField.js CHANGED
@@ -31,8 +31,10 @@ var LinkSelectField = /*#__PURE__*/forwardRef(function (props, ref) {
31
31
  isDisabled = props.isDisabled,
32
32
  status = props.status,
33
33
  helperText = props.helperText,
34
+ iconProps = props.iconProps,
34
35
  hasInlineLoader = props.hasInlineLoader,
35
- popoverWidth = props.popoverWidth;
36
+ popoverWidth = props.popoverWidth,
37
+ triggerProps = props.triggerProps;
36
38
  var _getAriaAttributeProp = getAriaAttributeProps(props),
37
39
  ariaProps = _getAriaAttributeProp.ariaProps;
38
40
  var _useGetTheme = useGetTheme(),
@@ -53,14 +55,14 @@ var LinkSelectField = /*#__PURE__*/forwardRef(function (props, ref) {
53
55
  var fieldControlInputProps = selectFieldProps.fieldControlInputProps,
54
56
  isLoadingInitial = selectFieldProps.isLoadingInitial,
55
57
  state = selectFieldProps.state,
56
- triggerProps = selectFieldProps.triggerProps,
58
+ raTriggerProps = selectFieldProps.triggerProps,
57
59
  triggerRef = selectFieldProps.triggerRef;
58
60
  var trigger = ___EmotionJSX(Button, _extends({
59
61
  className: fieldControlInputProps.className,
60
62
  ref: triggerRef,
61
63
  variant: "link",
62
64
  tabIndex: isDisabled ? -1 : 0
63
- }, getPendoID(displayName), triggerProps, ariaProps, {
65
+ }, getPendoID(displayName), triggerProps, raTriggerProps, ariaProps, {
64
66
  "aria-describedby": helperText && helperTextId
65
67
  }), ___EmotionJSX(Text, {
66
68
  variant: "label",
@@ -73,15 +75,16 @@ var LinkSelectField = /*#__PURE__*/forwardRef(function (props, ref) {
73
75
  as: "span",
74
76
  "aria-hidden": "true",
75
77
  variant: "forms.select.arrow"
76
- }, ___EmotionJSX(Icon, {
78
+ }, ___EmotionJSX(Icon, _extends({
77
79
  icon: MenuDown,
78
80
  title: {
79
81
  name: 'Menu Down Icon'
80
- },
82
+ }
83
+ }, iconProps, {
81
84
  sx: state.isOpen ? {
82
85
  transform: 'rotate(180deg)'
83
86
  } : null
84
- }))), ___EmotionJSX(VisuallyHidden, {
87
+ })))), ___EmotionJSX(VisuallyHidden, {
85
88
  "aria-live": "polite",
86
89
  id: helperTextId
87
90
  }, helperText));
package/lib/components/LinkSelectField/LinkSelectField.test.js CHANGED
@@ -228,6 +228,24 @@ test('passing helper text should display it and correct aria attributes on input
228
228
  var helperTextID = helper.getAttribute('id');
229
229
  expect(screen.getByRole('button')).toHaveAttribute('aria-describedby', helperTextID);
230
230
  });
231
+ test('iconProps are spread to the icon element', function () {
232
+ var iconTestId = 'custom-icon';
233
+ getComponent({
234
+ iconProps: {
235
+ 'data-testid': iconTestId
236
+ }
237
+ });
238
+ expect(screen.getByTestId(iconTestId)).toBeInTheDocument();
239
+ });
240
+ test('triggerProps are spread to the trigger button', function () {
241
+ getComponent({
242
+ triggerProps: {
243
+ 'data-custom': 'custom-trigger'
244
+ }
245
+ });
246
+ var button = screen.getByRole('button');
247
+ expect(button).toHaveAttribute('data-custom', 'custom-trigger');
248
+ });
231
249
 
232
250
  // Needs to be added to each components test file
233
251
  universalComponentTests({
package/lib/styles/themeOverrides/onyxDarkUiLibraryOverride.js CHANGED
@@ -87,11 +87,13 @@ var forms = {
87
87
  borderColor: '#caced3 !important'
88
88
  },
89
89
  '&[type=password]:focus': {
90
+ outline: '1px solid',
91
+ outlineColor: 'accent.60',
92
+ outlineOffset: '0px',
90
93
  borderColor: "".concat(astroTokens.color.blue[500], " !important")
91
94
  },
92
95
  numberField: _objectSpread(_objectSpread(_objectSpread({}, theme.input), theme.numberFieldStyles), {}, {
93
96
  '&[type=text]': _objectSpread(_objectSpread({}, theme.text.inputValue), {}, {
94
- backgroundColor: 'white',
95
97
  borderColor: astroTokensDark.color.gray[500]
96
98
  }),
97
99
  '&[type=text]:focus': {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pingux/astro",
3
- "version": "2.196.0-alpha.0",
3
+ "version": "2.197.0-alpha.0",
4
4
  "description": "React component library for Ping Identity's design system",
5
5
  "repository": {
6
6
  "type": "git",