@wordpress/components 30.6.1-next.ff1cebbba.0 → 30.7.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 (147) hide show
  1. package/CHANGELOG.md +26 -1
  2. package/build/color-palette/styles.js +2 -12
  3. package/build/color-palette/styles.js.map +2 -2
  4. package/build/combobox-control/index.js +1 -2
  5. package/build/combobox-control/index.js.map +2 -2
  6. package/build/custom-select-control-v2/custom-select.js +2 -2
  7. package/build/custom-select-control-v2/custom-select.js.map +2 -2
  8. package/build/date-time/date/styles.js +9 -9
  9. package/build/date-time/date/styles.js.map +2 -2
  10. package/build/focal-point-picker/index.js +21 -10
  11. package/build/focal-point-picker/index.js.map +3 -3
  12. package/build/focal-point-picker/styles/focal-point-picker-style.js +20 -11
  13. package/build/focal-point-picker/styles/focal-point-picker-style.js.map +2 -2
  14. package/build/font-size-picker/font-size-picker-select.js +20 -19
  15. package/build/font-size-picker/font-size-picker-select.js.map +3 -3
  16. package/build/font-size-picker/font-size-picker-toggle-group.js +27 -3
  17. package/build/font-size-picker/font-size-picker-toggle-group.js.map +2 -2
  18. package/build/font-size-picker/index.js +23 -11
  19. package/build/font-size-picker/index.js.map +2 -2
  20. package/build/font-size-picker/styles.js +30 -13
  21. package/build/font-size-picker/styles.js.map +3 -3
  22. package/build/font-size-picker/utils.js +11 -0
  23. package/build/font-size-picker/utils.js.map +2 -2
  24. package/build/palette-edit/styles.js +9 -9
  25. package/build/palette-edit/styles.js.map +2 -2
  26. package/build/popover/index.js +13 -2
  27. package/build/popover/index.js.map +2 -2
  28. package/build/tabs/styles.js +5 -5
  29. package/build/tabs/styles.js.map +1 -1
  30. package/build/tools-panel/styles.js +14 -22
  31. package/build/tools-panel/styles.js.map +2 -2
  32. package/build/utils/base-label.js +12 -12
  33. package/build/utils/base-label.js.map +3 -3
  34. package/build/utils/config-values.js +2 -0
  35. package/build/utils/config-values.js.map +2 -2
  36. package/build-module/color-palette/styles.js +2 -12
  37. package/build-module/color-palette/styles.js.map +2 -2
  38. package/build-module/combobox-control/index.js +1 -2
  39. package/build-module/combobox-control/index.js.map +2 -2
  40. package/build-module/custom-select-control-v2/custom-select.js +1 -1
  41. package/build-module/custom-select-control-v2/custom-select.js.map +1 -1
  42. package/build-module/date-time/date/styles.js +9 -9
  43. package/build-module/date-time/date/styles.js.map +2 -2
  44. package/build-module/focal-point-picker/index.js +23 -12
  45. package/build-module/focal-point-picker/index.js.map +2 -2
  46. package/build-module/focal-point-picker/styles/focal-point-picker-style.js +20 -12
  47. package/build-module/focal-point-picker/styles/focal-point-picker-style.js.map +2 -2
  48. package/build-module/font-size-picker/font-size-picker-select.js +21 -10
  49. package/build-module/font-size-picker/font-size-picker-select.js.map +2 -2
  50. package/build-module/font-size-picker/font-size-picker-toggle-group.js +27 -3
  51. package/build-module/font-size-picker/font-size-picker-toggle-group.js.map +2 -2
  52. package/build-module/font-size-picker/index.js +23 -11
  53. package/build-module/font-size-picker/index.js.map +2 -2
  54. package/build-module/font-size-picker/styles.js +28 -12
  55. package/build-module/font-size-picker/styles.js.map +2 -2
  56. package/build-module/font-size-picker/utils.js +10 -0
  57. package/build-module/font-size-picker/utils.js.map +2 -2
  58. package/build-module/palette-edit/styles.js +9 -9
  59. package/build-module/palette-edit/styles.js.map +2 -2
  60. package/build-module/popover/index.js +13 -2
  61. package/build-module/popover/index.js.map +2 -2
  62. package/build-module/tabs/styles.js +5 -5
  63. package/build-module/tabs/styles.js.map +1 -1
  64. package/build-module/tools-panel/styles.js +14 -22
  65. package/build-module/tools-panel/styles.js.map +2 -2
  66. package/build-module/utils/base-label.js +2 -12
  67. package/build-module/utils/base-label.js.map +2 -2
  68. package/build-module/utils/config-values.js +2 -0
  69. package/build-module/utils/config-values.js.map +2 -2
  70. package/build-style/style-rtl.css +11 -5
  71. package/build-style/style.css +11 -5
  72. package/build-types/card/card-body/component.d.ts.map +1 -1
  73. package/build-types/card/card-body/hook.d.ts.map +1 -1
  74. package/build-types/card/card-footer/component.d.ts +1 -3
  75. package/build-types/card/card-footer/component.d.ts.map +1 -1
  76. package/build-types/card/card-footer/hook.d.ts +6 -0
  77. package/build-types/card/card-footer/hook.d.ts.map +1 -1
  78. package/build-types/card/card-header/component.d.ts +1 -1
  79. package/build-types/card/card-header/component.d.ts.map +1 -1
  80. package/build-types/card/card-header/hook.d.ts +7 -0
  81. package/build-types/card/card-header/hook.d.ts.map +1 -1
  82. package/build-types/card/card-media/hook.d.ts.map +1 -1
  83. package/build-types/card/types.d.ts +3 -8
  84. package/build-types/card/types.d.ts.map +1 -1
  85. package/build-types/color-palette/styles.d.ts.map +1 -1
  86. package/build-types/combobox-control/index.d.ts.map +1 -1
  87. package/build-types/combobox-control/stories/index.story.d.ts.map +1 -1
  88. package/build-types/date-time/date/styles.d.ts.map +1 -1
  89. package/build-types/focal-point-picker/index.d.ts +1 -1
  90. package/build-types/focal-point-picker/index.d.ts.map +1 -1
  91. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +253 -0
  92. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts.map +1 -1
  93. package/build-types/font-size-picker/font-size-picker-select.d.ts +3 -0
  94. package/build-types/font-size-picker/font-size-picker-select.d.ts.map +1 -1
  95. package/build-types/font-size-picker/font-size-picker-toggle-group.d.ts.map +1 -1
  96. package/build-types/font-size-picker/index.d.ts.map +1 -1
  97. package/build-types/font-size-picker/styles.d.ts +3 -0
  98. package/build-types/font-size-picker/styles.d.ts.map +1 -1
  99. package/build-types/font-size-picker/test/font-size-picker-select.d.ts +2 -0
  100. package/build-types/font-size-picker/test/font-size-picker-select.d.ts.map +1 -0
  101. package/build-types/font-size-picker/test/font-size-picker-toggle-group.d.ts +2 -0
  102. package/build-types/font-size-picker/test/font-size-picker-toggle-group.d.ts.map +1 -0
  103. package/build-types/font-size-picker/types.d.ts +18 -4
  104. package/build-types/font-size-picker/types.d.ts.map +1 -1
  105. package/build-types/font-size-picker/utils.d.ts +10 -1
  106. package/build-types/font-size-picker/utils.d.ts.map +1 -1
  107. package/build-types/popover/index.d.ts.map +1 -1
  108. package/build-types/utils/base-label.d.ts.map +1 -1
  109. package/build-types/utils/config-values.d.ts +1 -0
  110. package/package.json +20 -20
  111. package/src/badge/styles.scss +1 -0
  112. package/src/button/style.scss +4 -1
  113. package/src/card/types.ts +3 -9
  114. package/src/color-palette/styles.ts +2 -1
  115. package/src/combobox-control/index.tsx +1 -4
  116. package/src/combobox-control/stories/index.story.tsx +0 -1
  117. package/src/combobox-control/test/index.tsx +20 -7
  118. package/src/custom-select-control-v2/custom-select.tsx +1 -1
  119. package/src/date-time/date/styles.ts +1 -0
  120. package/src/dimension-control/test/__snapshots__/index.test.js.snap +4 -4
  121. package/src/dropdown-menu/style.scss +1 -0
  122. package/src/focal-point-picker/index.tsx +26 -16
  123. package/src/focal-point-picker/styles/focal-point-picker-style.ts +11 -1
  124. package/src/font-size-picker/README.md +10 -0
  125. package/src/font-size-picker/font-size-picker-select.tsx +44 -11
  126. package/src/font-size-picker/font-size-picker-toggle-group.tsx +58 -4
  127. package/src/font-size-picker/index.tsx +44 -19
  128. package/src/font-size-picker/styles.ts +9 -0
  129. package/src/font-size-picker/test/font-size-picker-select.tsx +221 -0
  130. package/src/font-size-picker/test/font-size-picker-toggle-group.tsx +275 -0
  131. package/src/font-size-picker/test/index.tsx +460 -2
  132. package/src/font-size-picker/types.ts +24 -4
  133. package/src/font-size-picker/utils.ts +23 -1
  134. package/src/menu-group/style.scss +1 -1
  135. package/src/menu-item/style.scss +1 -0
  136. package/src/modal/style.scss +1 -1
  137. package/src/palette-edit/styles.ts +1 -1
  138. package/src/panel/style.scss +1 -1
  139. package/src/popover/index.tsx +23 -2
  140. package/src/tab-panel/style.scss +1 -1
  141. package/src/tabs/styles.ts +1 -1
  142. package/src/toggle-group-control/test/__snapshots__/index.tsx.snap +4 -4
  143. package/src/tools-panel/styles.ts +2 -2
  144. package/src/utils/base-label.ts +6 -1
  145. package/src/utils/config-values.js +1 -0
  146. package/src/validated-form-controls/style.scss +1 -1
  147. package/tsconfig.tsbuildinfo +1 -1
package/src/toggle-group-control/test/__snapshots__/index.tsx.snap CHANGED
@@ -26,7 +26,7 @@ exports[`ToggleGroupControl controlled should render correctly with icons 1`] =
26
26
 
27
27
  .emotion-6 {
28
28
  font-size: 11px;
29
- font-weight: 500;
29
+ font-weight: 499;
30
30
  line-height: 1.4;
31
31
  text-transform: uppercase;
32
32
  display: block;
@@ -391,7 +391,7 @@ exports[`ToggleGroupControl controlled should render correctly with text options
391
391
 
392
392
  .emotion-6 {
393
393
  font-size: 11px;
394
- font-weight: 500;
394
+ font-weight: 499;
395
395
  line-height: 1.4;
396
396
  text-transform: uppercase;
397
397
  display: block;
@@ -660,7 +660,7 @@ exports[`ToggleGroupControl uncontrolled should render correctly with icons 1`]
660
660
 
661
661
  .emotion-6 {
662
662
  font-size: 11px;
663
- font-weight: 500;
663
+ font-weight: 499;
664
664
  line-height: 1.4;
665
665
  text-transform: uppercase;
666
666
  display: block;
@@ -1019,7 +1019,7 @@ exports[`ToggleGroupControl uncontrolled should render correctly with text optio
1019
1019
 
1020
1020
  .emotion-6 {
1021
1021
  font-size: 11px;
1022
- font-weight: 500;
1022
+ font-weight: 499;
1023
1023
  line-height: 1.4;
1024
1024
  text-transform: uppercase;
1025
1025
  display: block;
package/src/tools-panel/styles.ts CHANGED
@@ -86,7 +86,7 @@ export const ToolsPanelHeader = css`
86
86
 
87
87
  export const ToolsPanelHeading = css`
88
88
  font-size: inherit;
89
- font-weight: 500;
89
+ font-weight: ${ CONFIG.fontWeightMedium };
90
90
  line-height: normal;
91
91
 
92
92
  /* Required to meet specificity requirements to ensure zero margin */
@@ -150,7 +150,7 @@ export const DropdownMenu = css`
150
150
  export const ResetLabel = styled.span`
151
151
  color: ${ COLORS.theme.accentDarker10 };
152
152
  font-size: 11px;
153
- font-weight: 500;
153
+ font-weight: ${ CONFIG.fontWeightMedium };
154
154
  line-height: 1.4;
155
155
  ${ rtl( { marginLeft: space( 3 ) } ) }
156
156
  text-transform: uppercase;
package/src/utils/base-label.ts CHANGED
@@ -3,11 +3,16 @@
3
3
  */
4
4
  import { css } from '@emotion/react';
5
5
 
6
+ /**
7
+ * Internal dependencies
8
+ */
9
+ import CONFIG from './config-values.js';
10
+
6
11
  // This is a very low-level mixin which you shouldn't have to use directly.
7
12
  // Try to use BaseControl's StyledLabel or BaseControl.VisualLabel if you can.
8
13
  export const baseLabelTypography = css`
9
14
  font-size: 11px;
10
- font-weight: 500;
15
+ font-weight: ${ CONFIG.fontWeightMedium };
11
16
  line-height: 1.4;
12
17
  text-transform: uppercase;
13
18
  `;
package/src/utils/config-values.js CHANGED
@@ -51,6 +51,7 @@ export default Object.assign( {}, CONTROL_PROPS, {
51
51
  fontSizeXSmall: 'calc(0.75 * 13px)',
52
52
  fontLineHeightBase: '1.4',
53
53
  fontWeight: 'normal',
54
+ fontWeightMedium: '499', // ensures fallback to 400 (instead of 600)
54
55
  fontWeightHeading: '600',
55
56
  gridBase: '4px',
56
57
  cardPaddingXSmall: `${ space( 2 ) }`,
package/src/validated-form-controls/style.scss CHANGED
@@ -61,7 +61,7 @@
61
61
  gap: 4px;
62
62
  margin: 8px 0 0;
63
63
  font-family: $font-family-body;
64
- font-size: 0.75rem;
64
+ font-size: $font-size-small;
65
65
  line-height: 16px; // matches the icon size
66
66
  color: $components-color-gray-700;
67
67
  animation: