@patternfly/react-core 4.250.7 → 4.251.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 (15) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/esm/components/Slider/Slider.js +2 -2
  3. package/dist/esm/components/Slider/Slider.js.map +1 -1
  4. package/dist/js/components/Slider/Slider.js +2 -2
  5. package/dist/js/components/Slider/Slider.js.map +1 -1
  6. package/dist/umd/react-core.min.css +919 -919
  7. package/dist/umd/react-core.min.js +1 -1
  8. package/package.json +2 -2
  9. package/src/components/Label/examples/LabelEditable.tsx +2 -2
  10. package/src/components/LabelGroup/examples/LabelGroupEditableAdd.tsx +8 -3
  11. package/src/components/LabelGroup/examples/LabelGroupEditableAddDropdown.tsx +7 -2
  12. package/src/components/LabelGroup/examples/LabelGroupEditableAddModal.tsx +8 -3
  13. package/src/components/LabelGroup/examples/LabelGroupEditableLabels.tsx +3 -3
  14. package/src/components/Slider/Slider.tsx +3 -3
  15. package/src/components/Slider/_tests_/__snapshots__/Slider.test.tsx.snap +11 -11
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-core",
3
- "version": "4.250.7",
3
+ "version": "4.251.0",
4
4
  "description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
5
5
  "main": "dist/js/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -70,5 +70,5 @@
70
70
  "react": "^16.8 || ^17 || ^18",
71
71
  "react-dom": "^16.8 || ^17 || ^18"
72
72
  },
73
- "gitHead": "9d771b71b4633c76781c56b212d79f8ef62e2b0b"
73
+ "gitHead": "84a0a3112aec6734d5749a143a2a5265f1f3d576"
74
74
  }
package/src/components/Label/examples/LabelEditable.tsx CHANGED
@@ -31,7 +31,7 @@ export const LabelEditable: React.FunctionComponent = () => {
31
31
  onEditComplete={onEditComplete}
32
32
  isEditable
33
33
  editableProps={{
34
- 'aria-label': 'Editable text',
34
+ 'aria-label': `Editable label with text ${labelText}`,
35
35
  id: 'editable-label'
36
36
  }}
37
37
  >
@@ -46,7 +46,7 @@ export const LabelEditable: React.FunctionComponent = () => {
46
46
  onEditComplete={onCompactEditComplete}
47
47
  isEditable
48
48
  editableProps={{
49
- 'aria-label': 'Compact editable text',
49
+ 'aria-label': `Editable compact label with text ${compactLabelText}`,
50
50
  id: 'compact-editable-label'
51
51
  }}
52
52
  >
package/src/components/LabelGroup/examples/LabelGroupEditableAdd.tsx CHANGED
@@ -11,7 +11,7 @@ export const LabelGroupEditableAdd: React.FunctionComponent = () => {
11
11
  props: {
12
12
  isEditable: true,
13
13
  editableProps: {
14
- 'aria-label': 'label editable text'
14
+ 'aria-label': 'Editable label with text Label 3'
15
15
  }
16
16
  },
17
17
  id: 2
@@ -24,7 +24,12 @@ export const LabelGroupEditableAdd: React.FunctionComponent = () => {
24
24
 
25
25
  const onEdit = (nextText: string, index: number) => {
26
26
  const copy = [...labels];
27
- copy[index] = { name: nextText, props: labels[index].props, id: labels[index].id };
27
+ const updatedProps = {
28
+ ...labels[index].props,
29
+ editableProps: { 'aria-label': `Editable label with text ${nextText}` }
30
+ };
31
+
32
+ copy[index] = { name: nextText, props: updatedProps, id: labels[index].id };
28
33
  setLabels(copy);
29
34
  };
30
35
 
@@ -35,7 +40,7 @@ export const LabelGroupEditableAdd: React.FunctionComponent = () => {
35
40
  props: {
36
41
  isEditable: true,
37
42
  editableProps: {
38
- 'aria-label': 'label editable text'
43
+ 'aria-label': `Editable label with text New Label`
39
44
  }
40
45
  },
41
46
  id: idIndex
package/src/components/LabelGroup/examples/LabelGroupEditableAddDropdown.tsx CHANGED
@@ -16,7 +16,7 @@ export const LabelGroupEditableAddDropdown: React.FunctionComponent = () => {
16
16
  props: {
17
17
  isEditable: true,
18
18
  editableProps: {
19
- 'aria-label': 'label editable text'
19
+ 'aria-label': 'Editable label with text Label 3'
20
20
  }
21
21
  },
22
22
  id: 2
@@ -29,7 +29,12 @@ export const LabelGroupEditableAddDropdown: React.FunctionComponent = () => {
29
29
 
30
30
  const onEdit = (nextText: string, index: number) => {
31
31
  const copy = [...labels];
32
- copy[index] = { name: nextText, props: labels[index].props, id: labels[index].id };
32
+ const updatedProps = {
33
+ ...labels[index].props,
34
+ editableProps: { 'aria-label': `Editable label with text ${nextText}` }
35
+ };
36
+
37
+ copy[index] = { name: nextText, props: updatedProps, id: labels[index].id };
33
38
  setLabels(copy);
34
39
  };
35
40
 
package/src/components/LabelGroup/examples/LabelGroupEditableAddModal.tsx CHANGED
@@ -47,7 +47,7 @@ export const LabelGroupEditableAddModal: React.FunctionComponent = () => {
47
47
  props: {
48
48
  isEditable: true,
49
49
  editableProps: {
50
- 'aria-label': 'label editable text'
50
+ 'aria-label': 'Editable label with text Label 3'
51
51
  }
52
52
  },
53
53
  id: 6
@@ -60,7 +60,12 @@ export const LabelGroupEditableAddModal: React.FunctionComponent = () => {
60
60
 
61
61
  const onEdit = (nextText: string, index: number) => {
62
62
  const copy = [...labels];
63
- copy[index] = { name: nextText, props: labels[index].props, id: labels[index].id };
63
+ const updatedProps = {
64
+ ...labels[index].props,
65
+ editableProps: { 'aria-label': `Editable label with text ${nextText}` }
66
+ };
67
+
68
+ copy[index] = { name: nextText, props: updatedProps, id: labels[index].id };
64
69
  setLabels(copy);
65
70
  };
66
71
 
@@ -81,7 +86,7 @@ export const LabelGroupEditableAddModal: React.FunctionComponent = () => {
81
86
  isEditable: isEditable !== undefined ? isEditable : true,
82
87
  ...(isEditable && {
83
88
  editableProps: {
84
- 'aria-label': 'label editable text'
89
+ 'aria-label': `Editable label with text ${labelText || 'New Label'}`
85
90
  }
86
91
  })
87
92
  },
package/src/components/LabelGroup/examples/LabelGroupEditableLabels.tsx CHANGED
@@ -15,7 +15,7 @@ export const LabelGroupEditableLabels: React.FunctionComponent = () => {
15
15
  onEditComplete={newText => setLabel1(newText)}
16
16
  isEditable
17
17
  editableProps={{
18
- 'aria-label': 'Editable text',
18
+ 'aria-label': `Editable label with text ${label1}`,
19
19
  id: 'editable-label-1'
20
20
  }}
21
21
  >
@@ -29,7 +29,7 @@ export const LabelGroupEditableLabels: React.FunctionComponent = () => {
29
29
  onEditComplete={newText => setLabel2(newText)}
30
30
  isEditable
31
31
  editableProps={{
32
- 'aria-label': 'Editable text 2',
32
+ 'aria-label': `Editable label with text ${label2}`,
33
33
  id: 'editable-label-2'
34
34
  }}
35
35
  >
@@ -42,7 +42,7 @@ export const LabelGroupEditableLabels: React.FunctionComponent = () => {
42
42
  onEditComplete={newText => setLabel3(newText)}
43
43
  isEditable
44
44
  editableProps={{
45
- 'aria-label': 'Editable text 3',
45
+ 'aria-label': `Editable label with text ${label3}`,
46
46
  id: 'editable-label-3'
47
47
  }}
48
48
  >
package/src/components/Slider/Slider.tsx CHANGED
@@ -416,6 +416,9 @@ export const Slider: React.FunctionComponent<SliderProps> = ({
416
416
  {buildSteps()}
417
417
  </div>
418
418
  )}
419
+ {isInputVisible && inputPosition === 'aboveThumb' && (
420
+ <div className={css(styles.sliderValue, styles.modifiers.floating)}>{displayInput()}</div>
421
+ )}
419
422
  {hasTooltipOverThumb ? (
420
423
  <Tooltip entryDelay={0} content={findAriaTextValue()}>
421
424
  {thumbComponent}
@@ -423,9 +426,6 @@ export const Slider: React.FunctionComponent<SliderProps> = ({
423
426
  ) : (
424
427
  thumbComponent
425
428
  )}
426
- {isInputVisible && inputPosition === 'aboveThumb' && (
427
- <div className={css(styles.sliderValue, styles.modifiers.floating)}>{displayInput()}</div>
428
- )}
429
429
  </div>
430
430
  {isInputVisible && inputPosition === 'right' && <div className={css(styles.sliderValue)}>{displayInput()}</div>}
431
431
  {rightActions && <div className={css(styles.sliderActions)}>{rightActions}</div>}
package/src/components/Slider/_tests_/__snapshots__/Slider.test.tsx.snap CHANGED
@@ -475,17 +475,6 @@ exports[`slider renders slider with input above thumb 1`] = `
475
475
  </div>
476
476
  </div>
477
477
  </div>
478
- <div
479
- aria-disabled="false"
480
- aria-label="Value"
481
- aria-valuemax="100"
482
- aria-valuemin="0"
483
- aria-valuenow="50"
484
- aria-valuetext="50"
485
- class="pf-c-slider__thumb"
486
- role="slider"
487
- tabindex="0"
488
- />
489
478
  <div
490
479
  class="pf-c-slider__value pf-m-floating"
491
480
  >
@@ -509,6 +498,17 @@ exports[`slider renders slider with input above thumb 1`] = `
509
498
  </span>
510
499
  </div>
511
500
  </div>
501
+ <div
502
+ aria-disabled="false"
503
+ aria-label="Value"
504
+ aria-valuemax="100"
505
+ aria-valuemin="0"
506
+ aria-valuenow="50"
507
+ aria-valuetext="50"
508
+ class="pf-c-slider__thumb"
509
+ role="slider"
510
+ tabindex="0"
511
+ />
512
512
  </div>
513
513
  </div>
514
514
  </DocumentFragment>