@wordpress/components 29.4.0 → 29.5.1

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 (124) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/build/border-control/border-control-dropdown/component.js +19 -21
  3. package/build/border-control/border-control-dropdown/component.js.map +1 -1
  4. package/build/border-control/border-control-dropdown/hook.js +3 -3
  5. package/build/border-control/border-control-dropdown/hook.js.map +1 -1
  6. package/build/border-control/styles.js +24 -19
  7. package/build/border-control/styles.js.map +1 -1
  8. package/build/circular-option-picker/circular-option-picker.js +1 -0
  9. package/build/circular-option-picker/circular-option-picker.js.map +1 -1
  10. package/build/circular-option-picker/index.js +7 -0
  11. package/build/circular-option-picker/index.js.map +1 -1
  12. package/build/circular-option-picker/types.js.map +1 -1
  13. package/build/circular-option-picker/utils.js +31 -0
  14. package/build/circular-option-picker/utils.js.map +1 -0
  15. package/build/color-palette/index.js +9 -29
  16. package/build/color-palette/index.js.map +1 -1
  17. package/build/duotone-picker/duotone-picker.js +8 -28
  18. package/build/duotone-picker/duotone-picker.js.map +1 -1
  19. package/build/font-size-picker/types.js.map +1 -1
  20. package/build/gradient-picker/index.js +8 -28
  21. package/build/gradient-picker/index.js.map +1 -1
  22. package/build/input-control/styles/input-control-styles.js +22 -22
  23. package/build/input-control/styles/input-control-styles.js.map +1 -1
  24. package/build/mobile/bottom-sheet/switch-cell.native.js +1 -1
  25. package/build/mobile/bottom-sheet/switch-cell.native.js.map +1 -1
  26. package/build/number-control/index.js +2 -2
  27. package/build/number-control/index.js.map +1 -1
  28. package/build/query-controls/index.js +18 -16
  29. package/build/query-controls/index.js.map +1 -1
  30. package/build/query-controls/index.native.js +3 -2
  31. package/build/query-controls/index.native.js.map +1 -1
  32. package/build/query-controls/types.js.map +1 -1
  33. package/build/textarea-control/styles/textarea-control-styles.js +3 -3
  34. package/build/textarea-control/styles/textarea-control-styles.js.map +1 -1
  35. package/build-module/border-control/border-control-dropdown/component.js +19 -21
  36. package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
  37. package/build-module/border-control/border-control-dropdown/hook.js +3 -3
  38. package/build-module/border-control/border-control-dropdown/hook.js.map +1 -1
  39. package/build-module/border-control/styles.js +22 -13
  40. package/build-module/border-control/styles.js.map +1 -1
  41. package/build-module/circular-option-picker/circular-option-picker.js +1 -0
  42. package/build-module/circular-option-picker/circular-option-picker.js.map +1 -1
  43. package/build-module/circular-option-picker/index.js +1 -0
  44. package/build-module/circular-option-picker/index.js.map +1 -1
  45. package/build-module/circular-option-picker/types.js.map +1 -1
  46. package/build-module/circular-option-picker/utils.js +25 -0
  47. package/build-module/circular-option-picker/utils.js.map +1 -0
  48. package/build-module/color-palette/index.js +7 -29
  49. package/build-module/color-palette/index.js.map +1 -1
  50. package/build-module/duotone-picker/duotone-picker.js +6 -28
  51. package/build-module/duotone-picker/duotone-picker.js.map +1 -1
  52. package/build-module/font-size-picker/types.js.map +1 -1
  53. package/build-module/gradient-picker/index.js +6 -28
  54. package/build-module/gradient-picker/index.js.map +1 -1
  55. package/build-module/input-control/styles/input-control-styles.js +22 -22
  56. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  57. package/build-module/mobile/bottom-sheet/switch-cell.native.js +1 -1
  58. package/build-module/mobile/bottom-sheet/switch-cell.native.js.map +1 -1
  59. package/build-module/number-control/index.js +2 -2
  60. package/build-module/number-control/index.js.map +1 -1
  61. package/build-module/query-controls/index.js +18 -16
  62. package/build-module/query-controls/index.js.map +1 -1
  63. package/build-module/query-controls/index.native.js +3 -2
  64. package/build-module/query-controls/index.native.js.map +1 -1
  65. package/build-module/query-controls/types.js.map +1 -1
  66. package/build-module/textarea-control/styles/textarea-control-styles.js +3 -3
  67. package/build-module/textarea-control/styles/textarea-control-styles.js.map +1 -1
  68. package/build-style/style-rtl.css +6 -6
  69. package/build-style/style.css +7 -6
  70. package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
  71. package/build-types/border-control/border-control-dropdown/hook.d.ts +1 -1
  72. package/build-types/border-control/styles.d.ts +1 -1
  73. package/build-types/border-control/styles.d.ts.map +1 -1
  74. package/build-types/circular-option-picker/index.d.ts +1 -0
  75. package/build-types/circular-option-picker/index.d.ts.map +1 -1
  76. package/build-types/circular-option-picker/types.d.ts +11 -7
  77. package/build-types/circular-option-picker/types.d.ts.map +1 -1
  78. package/build-types/circular-option-picker/utils.d.ts +17 -0
  79. package/build-types/circular-option-picker/utils.d.ts.map +1 -0
  80. package/build-types/color-palette/index.d.ts.map +1 -1
  81. package/build-types/duotone-picker/duotone-picker.d.ts.map +1 -1
  82. package/build-types/font-size-picker/stories/index.story.d.ts.map +1 -1
  83. package/build-types/font-size-picker/types.d.ts +4 -0
  84. package/build-types/font-size-picker/types.d.ts.map +1 -1
  85. package/build-types/gradient-picker/index.d.ts.map +1 -1
  86. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  87. package/build-types/query-controls/index.d.ts +2 -2
  88. package/build-types/query-controls/index.d.ts.map +1 -1
  89. package/build-types/query-controls/types.d.ts +15 -1
  90. package/build-types/query-controls/types.d.ts.map +1 -1
  91. package/build-types/textarea-control/styles/textarea-control-styles.d.ts.map +1 -1
  92. package/package.json +19 -19
  93. package/src/border-box-control/test/index.tsx +1 -1
  94. package/src/border-control/border-control-dropdown/component.tsx +8 -12
  95. package/src/border-control/border-control-dropdown/hook.ts +3 -3
  96. package/src/border-control/styles.ts +4 -10
  97. package/src/border-control/test/index.js +1 -1
  98. package/src/circular-option-picker/README.md +13 -0
  99. package/src/circular-option-picker/circular-option-picker.tsx +1 -1
  100. package/src/circular-option-picker/index.tsx +1 -0
  101. package/src/circular-option-picker/stories/index.story.tsx +1 -1
  102. package/src/circular-option-picker/test/index.tsx +1 -0
  103. package/src/circular-option-picker/types.ts +11 -10
  104. package/src/circular-option-picker/utils.tsx +27 -0
  105. package/src/color-palette/index.tsx +11 -29
  106. package/src/color-palette/test/index.tsx +1 -1
  107. package/src/duotone-picker/duotone-picker.tsx +10 -28
  108. package/src/font-size-picker/README.md +2 -0
  109. package/src/font-size-picker/stories/index.story.tsx +4 -0
  110. package/src/font-size-picker/types.ts +4 -0
  111. package/src/gradient-picker/index.tsx +10 -28
  112. package/src/input-control/styles/input-control-styles.tsx +9 -1
  113. package/src/mobile/bottom-sheet/switch-cell.native.js +1 -1
  114. package/src/notice/README.md +1 -1
  115. package/src/notice/style.scss +1 -0
  116. package/src/number-control/README.md +1 -1
  117. package/src/number-control/index.tsx +2 -2
  118. package/src/query-controls/README.md +10 -3
  119. package/src/query-controls/index.native.js +3 -2
  120. package/src/query-controls/index.tsx +25 -21
  121. package/src/query-controls/types.ts +16 -1
  122. package/src/text-control/style.scss +6 -0
  123. package/src/textarea-control/styles/textarea-control-styles.ts +0 -2
  124. package/tsconfig.tsbuildinfo +1 -1
@@ -620,7 +620,6 @@ p + .components-button.is-tertiary {
620
620
  color: rgba(30, 30, 30, 0.62);
621
621
  }
622
622
  .components-checkbox-control__input[type=checkbox]::-moz-placeholder {
623
- opacity: 1;
624
623
  color: rgba(30, 30, 30, 0.62);
625
624
  }
626
625
  .components-checkbox-control__input[type=checkbox]:-ms-input-placeholder {
@@ -945,7 +944,6 @@ input.components-combobox-control__input[type=text]:focus {
945
944
  color: rgba(30, 30, 30, 0.62);
946
945
  }
947
946
  .components-combobox-control__suggestions-container::-moz-placeholder {
948
- opacity: 1;
949
947
  color: rgba(30, 30, 30, 0.62);
950
948
  }
951
949
  .components-combobox-control__suggestions-container:-ms-input-placeholder {
@@ -1467,7 +1465,6 @@ body.is-dragging-components-draggable {
1467
1465
  color: rgba(30, 30, 30, 0.62);
1468
1466
  }
1469
1467
  .components-form-token-field__input-container::-moz-placeholder {
1470
- opacity: 1;
1471
1468
  color: rgba(30, 30, 30, 0.62);
1472
1469
  }
1473
1470
  .components-form-token-field__input-container:-ms-input-placeholder {
@@ -2091,6 +2088,7 @@ body.is-dragging-components-draggable {
2091
2088
  border-left: 4px solid var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
2092
2089
  padding: 8px 12px;
2093
2090
  align-items: center;
2091
+ color: #1e1e1e;
2094
2092
  }
2095
2093
  .components-notice.is-dismissible {
2096
2094
  position: relative;
@@ -2418,7 +2416,6 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
2418
2416
  color: rgba(30, 30, 30, 0.62);
2419
2417
  }
2420
2418
  .components-placeholder__input[type=url]::-moz-placeholder {
2421
- opacity: 1;
2422
2419
  color: rgba(30, 30, 30, 0.62);
2423
2420
  }
2424
2421
  .components-placeholder__input[type=url]:-ms-input-placeholder {
@@ -2716,7 +2713,6 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
2716
2713
  color: rgba(30, 30, 30, 0.62);
2717
2714
  }
2718
2715
  .components-radio-control__input[type=radio]::-moz-placeholder {
2719
- opacity: 1;
2720
2716
  color: rgba(30, 30, 30, 0.62);
2721
2717
  }
2722
2718
  .components-radio-control__input[type=radio]:-ms-input-placeholder {
@@ -3254,7 +3250,6 @@ body.lockscroll {
3254
3250
  .components-text-control__input[type=email]::-moz-placeholder,
3255
3251
  .components-text-control__input[type=month]::-moz-placeholder,
3256
3252
  .components-text-control__input[type=number]::-moz-placeholder {
3257
- opacity: 1;
3258
3253
  color: rgba(30, 30, 30, 0.62);
3259
3254
  }
3260
3255
  .components-text-control__input:-ms-input-placeholder,
@@ -3292,6 +3287,12 @@ body.lockscroll {
3292
3287
  padding-right: 12px;
3293
3288
  }
3294
3289
 
3290
+ .components-text-control__input[type=email],
3291
+ .components-text-control__input[type=url] {
3292
+ /* rtl:ignore */
3293
+ direction: ltr;
3294
+ }
3295
+
3295
3296
  .components-tip {
3296
3297
  display: flex;
3297
3298
  color: #757575;
@@ -1 +1 @@
1
- {"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../src/border-control/border-control-dropdown/component.tsx"],"names":[],"mappings":"AAkQA,QAAA,MAAM,8BAA8B;;;;;;;wBAtH9B,CAAA;;;6CAyHL,CAAC;AAEF,eAAe,8BAA8B,CAAC"}
1
+ {"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../src/border-control/border-control-dropdown/component.tsx"],"names":[],"mappings":"AA8PA,QAAA,MAAM,8BAA8B;;;;;;;wBAlH9B,CAAA;;;6CAqHL,CAAC;AAEF,eAAe,8BAA8B,CAAC"}
@@ -13,7 +13,7 @@ export declare function useBorderControlDropdown(props: WordPressComponentProps<
13
13
  onReset: () => void;
14
14
  popoverContentClassName: string;
15
15
  popoverControlsClassName: string;
16
- resetButtonClassName: string;
16
+ resetButtonWrapperClassName: string;
17
17
  size: "default" | "__unstable-large";
18
18
  __experimentalIsRenderedInSidebar: boolean;
19
19
  disableCustomColors?: boolean;
@@ -9,6 +9,6 @@ export declare const colorIndicatorWrapper: (border?: Border, size?: "default" |
9
9
  export declare const borderControlPopoverControls: import("@emotion/utils").SerializedStyles;
10
10
  export declare const borderControlPopoverContent: import("@emotion/utils").SerializedStyles;
11
11
  export declare const borderColorIndicator: import("@emotion/utils").SerializedStyles;
12
- export declare const resetButton: import("@emotion/utils").SerializedStyles;
12
+ export declare const resetButtonWrapper: import("@emotion/utils").SerializedStyles;
13
13
  export declare const borderSlider: () => import("@emotion/utils").SerializedStyles;
14
14
  //# sourceMappingURL=styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/border-control/styles.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAMtC,eAAO,MAAM,aAAa,2CAKzB,CAAC;AAEF,eAAO,MAAM,YAAY,iDAQxB,CAAC;AAOF,eAAO,MAAM,YAAY,2CAKxB,CAAC;AAEF,eAAO,MAAM,aAAa,UAAY,SAAS,GAAG,kBAAkB,8CAInE,CAAC;AAEF,eAAO,MAAM,qBAAqB,2CAuBjC,CAAC;AAEF,eAAO,MAAM,oBAAoB,YAAc,MAAM,8CAUpD,CAAC;AAEF,eAAO,MAAM,qBAAqB,YACxB,MAAM,SACR,SAAS,GAAG,kBAAkB,8CA8BrC,CAAC;AAOF,eAAO,MAAM,4BAA4B,2CAWxC,CAAC;AAEF,eAAO,MAAM,2BAA2B,2CAAQ,CAAC;AACjD,eAAO,MAAM,oBAAoB,2CAAQ,CAAC;AAE1C,eAAO,MAAM,WAAW,2CAUvB,CAAC;AAEF,eAAO,MAAM,YAAY,iDAGxB,CAAC"}
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/border-control/styles.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAMtC,eAAO,MAAM,aAAa,2CAKzB,CAAC;AAEF,eAAO,MAAM,YAAY,iDAQxB,CAAC;AAOF,eAAO,MAAM,YAAY,2CAKxB,CAAC;AAEF,eAAO,MAAM,aAAa,UAAY,SAAS,GAAG,kBAAkB,8CAInE,CAAC;AAEF,eAAO,MAAM,qBAAqB,2CAuBjC,CAAC;AAEF,eAAO,MAAM,oBAAoB,YAAc,MAAM,8CAUpD,CAAC;AAEF,eAAO,MAAM,qBAAqB,YACxB,MAAM,SACR,SAAS,GAAG,kBAAkB,8CA8BrC,CAAC;AAOF,eAAO,MAAM,4BAA4B,2CAWxC,CAAC;AAEF,eAAO,MAAM,2BAA2B,2CAAQ,CAAC;AACjD,eAAO,MAAM,oBAAoB,2CAAQ,CAAC;AAE1C,eAAO,MAAM,kBAAkB,2CAI9B,CAAC;AAEF,eAAO,MAAM,YAAY,iDAGxB,CAAC"}
@@ -5,5 +5,6 @@ import CircularOptionPicker from './circular-option-picker';
5
5
  export { Option } from './circular-option-picker-option';
6
6
  export { OptionGroup } from './circular-option-picker-option-group';
7
7
  export { ButtonAction, DropdownLinkAction, } from './circular-option-picker-actions';
8
+ export { getComputeCircularOptionPickerCommonProps } from './utils';
8
9
  export default CircularOptionPicker;
9
10
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,oBAAoB,MAAM,0BAA0B,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EACN,YAAY,EACZ,kBAAkB,GAClB,MAAM,kCAAkC,CAAC;AAE1C,eAAe,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,oBAAoB,MAAM,0BAA0B,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EACN,YAAY,EACZ,kBAAkB,GAClB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,yCAAyC,EAAE,MAAM,SAAS,CAAC;AAEpE,eAAe,oBAAoB,CAAC"}
@@ -37,6 +37,16 @@ type CommonCircularOptionPickerProps = {
37
37
  * The child elements.
38
38
  */
39
39
  children?: ReactNode;
40
+ /**
41
+ * The ID reference list of one or more elements that label the wrapper
42
+ * element.
43
+ */
44
+ 'aria-labelledby'?: string;
45
+ /**
46
+ * The label for the wrapper element. Defaults to 'Custom color picker'. Not
47
+ * used if an 'aria-labelledby' is provided.
48
+ */
49
+ 'aria-label'?: string;
40
50
  };
41
51
  type WithBaseId = {
42
52
  baseId: string;
@@ -54,13 +64,7 @@ type FullListboxCircularOptionPickerProps = CommonCircularOptionPickerProps & {
54
64
  * @default true
55
65
  */
56
66
  loop?: boolean;
57
- } & ({
58
- 'aria-label': string;
59
- 'aria-labelledby'?: never;
60
- } | {
61
- 'aria-label'?: never;
62
- 'aria-labelledby': string;
63
- });
67
+ };
64
68
  export type ListboxCircularOptionPickerProps = WithBaseId & Omit<FullListboxCircularOptionPickerProps, 'asButtons'>;
65
69
  type FullButtonsCircularOptionPickerProps = CommonCircularOptionPickerProps & {
66
70
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C;;GAEG;AACH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAE1D,KAAK,+BAA+B,GAAG;IACtC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,KAAK,UAAU,GAAG;IACjB,MAAM,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,oCAAoC,GAAG,+BAA+B,GAAG;IAC7E;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CACf,GAAG,CACA;IACA,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CACzB,GACD;IACA,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,iBAAiB,EAAE,MAAM,CAAC;CACzB,CACH,CAAC;AAEH,MAAM,MAAM,gCAAgC,GAAG,UAAU,GACxD,IAAI,CAAE,oCAAoC,EAAE,WAAW,CAAE,CAAC;AAE3D,KAAK,oCAAoC,GAAG,+BAA+B,GAAG;IAC7E;;;;;OAKG;IACH,SAAS,EAAE,IAAI,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG,UAAU,GACxD,IAAI,CAAE,oCAAoC,EAAE,WAAW,CAAE,CAAC;AAE3D,MAAM,MAAM,yBAAyB,GAClC,oCAAoC,GACpC,oCAAoC,CAAC;AAExC,MAAM,MAAM,uBAAuB,GAAG;IACrC,WAAW,CAAC,EAAE,IAAI,CACjB,uBAAuB,CAAE,mBAAmB,EAAE,QAAQ,EAAE,KAAK,CAAE,EAC/D,UAAU,CACV,CAAC;IACF,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,IAAI,CAAE,aAAa,EAAE,WAAW,GAAG,cAAc,CAAE,CAAC;IACnE,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,IAAI,CAC7B,uBAAuB,CAAE,mBAAmB,EAAE,QAAQ,EAAE,KAAK,CAAE,EAC/D,WAAW,GAAG,WAAW,CACzB,GAAG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IAKrB,iBAAiB,CAAC,EAAE,IAAI,CACvB,KAAK,CAAC,cAAc,CAAE,OAAO,IAAI,CAAE,EACnC,MAAM,GAAG,MAAM,CACf,CAAC;CACF,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACrC,WAAW,CAAC,EAAE,CAAE,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,KAAM,IAAI,CAAC;CAC3D,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C;;GAEG;AACH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAE1D,KAAK,+BAA+B,GAAG;IACtC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,KAAK,UAAU,GAAG;IACjB,MAAM,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,oCAAoC,GAAG,+BAA+B,GAAG;IAC7E;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG,UAAU,GACxD,IAAI,CAAE,oCAAoC,EAAE,WAAW,CAAE,CAAC;AAE3D,KAAK,oCAAoC,GAAG,+BAA+B,GAAG;IAC7E;;;;;OAKG;IACH,SAAS,EAAE,IAAI,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG,UAAU,GACxD,IAAI,CAAE,oCAAoC,EAAE,WAAW,CAAE,CAAC;AAE3D,MAAM,MAAM,yBAAyB,GAClC,oCAAoC,GACpC,oCAAoC,CAAC;AAExC,MAAM,MAAM,uBAAuB,GAAG;IACrC,WAAW,CAAC,EAAE,IAAI,CACjB,uBAAuB,CAAE,mBAAmB,EAAE,QAAQ,EAAE,KAAK,CAAE,EAC/D,UAAU,CACV,CAAC;IACF,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,IAAI,CAAE,aAAa,EAAE,WAAW,GAAG,cAAc,CAAE,CAAC;IACnE,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,IAAI,CAC7B,uBAAuB,CAAE,mBAAmB,EAAE,QAAQ,EAAE,KAAK,CAAE,EAC/D,WAAW,GAAG,WAAW,CACzB,GAAG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IAKrB,iBAAiB,CAAC,EAAE,IAAI,CACvB,KAAK,CAAC,cAAc,CAAE,OAAO,IAAI,CAAE,EACnC,MAAM,GAAG,MAAM,CACf,CAAC;CACF,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACrC,WAAW,CAAC,EAAE,CAAE,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,KAAM,IAAI,CAAC;CAC3D,CAAC"}
@@ -0,0 +1,17 @@
1
+ /**
2
+ * Computes the common props for the CircularOptionPicker.
3
+ */
4
+ export declare function getComputeCircularOptionPickerCommonProps(asButtons?: boolean, loop?: boolean, ariaLabel?: string, ariaLabelledby?: string): {
5
+ metaProps: {
6
+ asButtons: boolean;
7
+ loop?: undefined;
8
+ } | {
9
+ asButtons: boolean;
10
+ loop: boolean | undefined;
11
+ };
12
+ labelProps: {
13
+ 'aria-labelledby': string | undefined;
14
+ 'aria-label': string | undefined;
15
+ };
16
+ };
17
+ //# sourceMappingURL=utils.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/utils.tsx"],"names":[],"mappings":"AAKA;;GAEG;AACH,wBAAgB,yCAAyC,CACxD,SAAS,CAAC,EAAE,OAAO,EACnB,IAAI,CAAC,EAAE,OAAO,EACd,SAAS,CAAC,EAAE,MAAM,EAClB,cAAc,CAAC,EAAE,MAAM;;;;;;;;;;;;EAcvB"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color-palette/index.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EAEX,iBAAiB,EACjB,8BAA8B,EAI9B,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAoG1D,wBAAgB,yBAAyB,CAAE,EAC1C,mBAAmB,EACnB,YAAY,EAAE,oBAAoB,EAClC,GAAG,KAAK,EACR,EAAE,8BAA8B,+BAgChC;AA8LD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,YAAY,mIAAwC,CAAC;AAElE,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color-palette/index.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAEX,iBAAiB,EACjB,8BAA8B,EAI9B,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAoG1D,wBAAgB,yBAAyB,CAAE,EAC1C,mBAAmB,EACnB,YAAY,EAAE,oBAAoB,EAClC,GAAG,KAAK,EACR,EAAE,8BAA8B,+BAgChC;AA0KD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,YAAY,mIAAwC,CAAC;AAElE,eAAe,YAAY,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"duotone-picker.d.ts","sourceRoot":"","sources":["../../src/duotone-picker/duotone-picker.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,iBAAS,aAAa,CAAE,EACvB,SAAS,EACT,IAAI,EACJ,SAAgB,EAChB,SAAgB,EAChB,YAAY,EACZ,cAAc,EACd,mBAAmB,EACnB,oBAAoB,EACpB,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,GAAG,UAAU,EACb,EAAE,kBAAkB,+BAiJpB;AAED,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"duotone-picker.d.ts","sourceRoot":"","sources":["../../src/duotone-picker/duotone-picker.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,iBAAS,aAAa,CAAE,EACvB,SAAS,EACT,IAAI,EACJ,SAAgB,EAChB,SAAgB,EAChB,YAAY,EACZ,cAAc,EACd,mBAAmB,EACnB,oBAAoB,EACpB,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,GAAG,UAAU,EACb,EAAE,kBAAkB,+BA6HpB;AAED,eAAe,aAAa,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/font-size-picker/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAOtD;;GAEG;AACH,OAAO,cAAc,MAAM,KAAK,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,cAAc,CAWtC,CAAC;AACF,eAAe,IAAI,CAAC;AAsCpB,eAAO,MAAM,OAAO,EAAE,OAAO,CAAE,OAAO,cAAc,CACjB,CAAC;AAyBpC,eAAO,MAAM,UAAU,EAAE,OAAO,CAAE,OAAO,cAAc,CACpB,CAAC;AAQpC;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,OAAO,CAAE,OAAO,cAAc,CACjC,CAAC;AAMpC;;GAEG;AACH,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAE,OAAO,cAAc,CAC3B,CAAC;AAsCpC;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,OAAO,CAAE,OAAO,cAAc,CACf,CAAC;AAUxC;;;GAGG;AACH,eAAO,MAAM,oBAAoB,EAAE,OAAO,CAAE,OAAO,cAAc,CAC1B,CAAC"}
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/font-size-picker/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAOtD;;GAEG;AACH,OAAO,cAAc,MAAM,KAAK,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,cAAc,CAetC,CAAC;AACF,eAAe,IAAI,CAAC;AAsCpB,eAAO,MAAM,OAAO,EAAE,OAAO,CAAE,OAAO,cAAc,CACjB,CAAC;AAyBpC,eAAO,MAAM,UAAU,EAAE,OAAO,CAAE,OAAO,cAAc,CACpB,CAAC;AAQpC;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,OAAO,CAAE,OAAO,cAAc,CACjC,CAAC;AAMpC;;GAEG;AACH,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAE,OAAO,cAAc,CAC3B,CAAC;AAsCpC;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,OAAO,CAAE,OAAO,cAAc,CACf,CAAC;AAUxC;;;GAGG;AACH,eAAO,MAAM,oBAAoB,EAAE,OAAO,CAAE,OAAO,cAAc,CAC1B,CAAC"}
@@ -31,6 +31,10 @@ export type FontSizePickerProps = {
31
31
  units?: string[];
32
32
  /**
33
33
  * The current font size value.
34
+ *
35
+ * Note: For the `units` property to work, the current font size value must be specified
36
+ * as strings with units (e.g., '12px' instead of 12). When the font size is provided
37
+ * as a number, the component operates in "unitless mode" where the `units` property has no effect.
34
38
  */
35
39
  value?: number | string;
36
40
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG;IACjC;;;;;OAKG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CACV,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAClC,YAAY,CAAC,EAAE,QAAQ,KACnB,IAAI,CAAC;IACV;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;;OAQG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACtB;;;;OAIG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC3C,mBAAmB,EACnB,OAAO,GAAG,MAAM,CAChB,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,sBAAsB,EAAE,WAAW,CAClC,mBAAmB,CAAE,wBAAwB,CAAE,CAC/C,CAAC;IACF,QAAQ,EAAE,WAAW,CAAE,mBAAmB,CAAE,UAAU,CAAE,CAAE,CAAC;IAC3D,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,qBAAqB,EAAE,OAAO,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACxC,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,QAAQ,CAAE,MAAM,CAAE,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,IAAI,CAChD,mBAAmB,EACnB,OAAO,GAAG,MAAM,GAAG,uBAAuB,CAC1C,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,QAAQ,EAAE,WAAW,CAAE,mBAAmB,CAAE,UAAU,CAAE,CAAE,CAAC;CAC3D,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG;IACjC;;;;;OAKG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CACV,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAClC,YAAY,CAAC,EAAE,QAAQ,KACnB,IAAI,CAAC;IACV;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;;OAQG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACtB;;;;OAIG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC3C,mBAAmB,EACnB,OAAO,GAAG,MAAM,CAChB,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,sBAAsB,EAAE,WAAW,CAClC,mBAAmB,CAAE,wBAAwB,CAAE,CAC/C,CAAC;IACF,QAAQ,EAAE,WAAW,CAAE,mBAAmB,CAAE,UAAU,CAAE,CAAE,CAAC;IAC3D,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,qBAAqB,EAAE,OAAO,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACxC,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,QAAQ,CAAE,MAAM,CAAE,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,IAAI,CAChD,mBAAmB,EACnB,OAAO,GAAG,MAAM,GAAG,uBAAuB,CAC1C,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,QAAQ,EAAE,WAAW,CAAE,mBAAmB,CAAE,UAAU,CAAE,CAAE,CAAC;CAC3D,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/gradient-picker/index.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EACX,4BAA4B,EAI5B,MAAM,SAAS,CAAC;AAoJjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,wBAAgB,cAAc,CAAE,EAC/B,SAAS,EACT,SAAc,EACd,QAAQ,EACR,KAAK,EACL,SAAgB,EAChB,WAAkB,EAClB,sBAA8B,EAC9B,iCAAiC,EACjC,YAAgB,EAChB,GAAG,eAAe,EAClB,EAAE,4BAA4B,+BA2C9B;AAED,eAAe,cAAc,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/gradient-picker/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EACX,4BAA4B,EAI5B,MAAM,SAAS,CAAC;AAgIjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,wBAAgB,cAAc,CAAE,EAC/B,SAAS,EACT,SAAc,EACd,QAAQ,EACR,KAAK,EACL,SAAgB,EAChB,WAAkB,EAClB,sBAA8B,EAC9B,iCAAiC,EACjC,YAAgB,EAChB,GAAG,eAAe,EAClB,EAAE,4BAA4B,+BA2C9B;AAED,eAAe,cAAc,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"input-control-styles.d.ts","sourceRoot":"","sources":["../../../src/input-control/styles/input-control-styles.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD;;GAEG;AACH,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAI7D,OAAO,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,wBAAwB,EAAE,MAAM,UAAU,CAAC;AAE9E,KAAK,cAAc,GAAG;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB,CAAC,EAAE,aAAa,CAAE,OAAO,CAAE,CAAC;IAChD,aAAa,CAAC,EAAE,aAAa,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,MAAM;;SATuC,MAAO,WAAW;2GAY3E,CAAC;AAEF,eAAO,MAAM,MAAM;;SAduC,MAAO,WAAW;2GAmB3E,CAAC;AAEF,KAAK,aAAa,GAAG;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAiBF,eAAO,MAAM,UAAU;;SAzCmC,MAAO,WAAW;yHA2D3E,CAAC;AAEF,eAAO,MAAM,IAAI;;;;UAgBhB,CAAC;AA+BF,eAAO,MAAM,SAAS;;SA5GoC,MAAO,WAAW;0HAsH3E,CAAC;AAEF,KAAK,UAAU,GAAG;IACjB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,aAAa,CAAE,QAAQ,CAAE,CAAC;IACvC,kBAAkB,CAAC,EAAE,aAAa,CAAE,oBAAoB,CAAE,CAAC;IAC3D,gBAAgB,CAAC,EAAE,aAAa,CAAE,kBAAkB,CAAE,CAAC;CACvD,CAAC;AAYF,eAAO,MAAM,cAAc,wBAA0B,UAAU,0BAsB9D,CAAC;AAEF,eAAO,MAAM,aAAa,gDAGvB,UAAU;;;;;;;;;;;;;;;;;;;;;;;;CAsCZ,CAAC;AA+CF,eAAO,MAAM,KAAK;;SA5PwC,MAAO,WAAW;+HAyR3E,CAAC;AAmBF,eAAO,MAAM,KAAK,UACV,uBAAuB,CAC7B;IAAE,aAAa,CAAC,EAAE,aAAa,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,EACtD,OAAO,EACP,KAAK,CACL,gCACwC,CAAC;AAE3C,eAAO,MAAM,YAAY;;;;UAExB,CAAC;AA8BF,eAAO,MAAM,mBAAmB;;SApV0B,MAAO,WAAW;;eA6TjC,OAAO;yGAyBjD,CAAC"}
1
+ {"version":3,"file":"input-control-styles.d.ts","sourceRoot":"","sources":["../../../src/input-control/styles/input-control-styles.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD;;GAEG;AACH,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAI7D,OAAO,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,wBAAwB,EAAE,MAAM,UAAU,CAAC;AAE9E,KAAK,cAAc,GAAG;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB,CAAC,EAAE,aAAa,CAAE,OAAO,CAAE,CAAC;IAChD,aAAa,CAAC,EAAE,aAAa,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,MAAM;;SATuC,MAAO,WAAW;2GAY3E,CAAC;AAEF,eAAO,MAAM,MAAM;;SAduC,MAAO,WAAW;2GAmB3E,CAAC;AAEF,KAAK,aAAa,GAAG;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAiBF,eAAO,MAAM,UAAU;;SAzCmC,MAAO,WAAW;yHA2D3E,CAAC;AAEF,eAAO,MAAM,IAAI;;;;UAgBhB,CAAC;AA+BF,eAAO,MAAM,SAAS;;SA5GoC,MAAO,WAAW;0HAsH3E,CAAC;AAEF,KAAK,UAAU,GAAG;IACjB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,aAAa,CAAE,QAAQ,CAAE,CAAC;IACvC,kBAAkB,CAAC,EAAE,aAAa,CAAE,oBAAoB,CAAE,CAAC;IAC3D,gBAAgB,CAAC,EAAE,aAAa,CAAE,kBAAkB,CAAE,CAAC;CACvD,CAAC;AAYF,eAAO,MAAM,cAAc,wBAA0B,UAAU,0BAsB9D,CAAC;AAEF,eAAO,MAAM,aAAa,gDAGvB,UAAU;;;;;;;;;;;;;;;;;;;;;;;;CAsCZ,CAAC;AA+CF,eAAO,MAAM,KAAK;;SA5PwC,MAAO,WAAW;+HAiS3E,CAAC;AAmBF,eAAO,MAAM,KAAK,UACV,uBAAuB,CAC7B;IAAE,aAAa,CAAC,EAAE,aAAa,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,EACtD,OAAO,EACP,KAAK,CACL,gCACwC,CAAC;AAE3C,eAAO,MAAM,YAAY;;;;UAExB,CAAC;AA8BF,eAAO,MAAM,mBAAmB;;SA5V0B,MAAO,WAAW;;eAqUjC,OAAO;yGAyBjD,CAAC"}
@@ -5,7 +5,7 @@ import type { QueryControlsProps } from './types';
5
5
  * ```jsx
6
6
  * const MyQueryControls = () => (
7
7
  * <QueryControls
8
- * { ...{ maxItems, minItems, numberOfItems, order, orderBy } }
8
+ * { ...{ maxItems, minItems, numberOfItems, order, orderBy, orderByOptions } }
9
9
  * onOrderByChange={ ( newOrderBy ) => {
10
10
  * updateQuery( { orderBy: newOrderBy } )
11
11
  * }
@@ -24,6 +24,6 @@ import type { QueryControlsProps } from './types';
24
24
  * );
25
25
  * ```
26
26
  */
27
- export declare function QueryControls({ authorList, selectedAuthorId, numberOfItems, order, orderBy, maxItems, minItems, onAuthorChange, onNumberOfItemsChange, onOrderChange, onOrderByChange, ...props }: QueryControlsProps): import("react").JSX.Element;
27
+ export declare function QueryControls({ authorList, selectedAuthorId, numberOfItems, order, orderBy, orderByOptions, maxItems, minItems, onAuthorChange, onNumberOfItemsChange, onOrderChange, onOrderByChange, ...props }: QueryControlsProps): import("react").JSX.Element;
28
28
  export default QueryControls;
29
29
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/query-controls/index.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EACX,kBAAkB,EAGlB,MAAM,SAAS,CAAC;AAkBjB;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,aAAa,CAAE,EAC9B,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,OAAO,EACP,QAA4B,EAC5B,QAA4B,EAC5B,cAAc,EACd,qBAAqB,EACrB,aAAa,EACb,eAAe,EAGf,GAAG,KAAK,EACR,EAAE,kBAAkB,+BA4HpB;AAED,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/query-controls/index.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EACX,kBAAkB,EAIlB,MAAM,SAAS,CAAC;AAuCjB;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,aAAa,CAAE,EAC9B,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,OAAO,EACP,cAAsC,EACtC,QAA4B,EAC5B,QAA4B,EAC5B,cAAc,EACd,qBAAqB,EACrB,aAAa,EACb,eAAe,EAGf,GAAG,KAAK,EACR,EAAE,kBAAkB,+BAyGpB;AAED,eAAe,aAAa,CAAC"}
@@ -32,7 +32,17 @@ export type AuthorSelectProps = Pick<TreeSelectProps, 'label' | 'noOptionLabel'>
32
32
  __next40pxDefaultSize: boolean;
33
33
  };
34
34
  type Order = 'asc' | 'desc';
35
- type OrderBy = 'date' | 'title';
35
+ type OrderBy = 'date' | 'title' | 'menu_order';
36
+ export type OrderByOption = {
37
+ /**
38
+ * The label to be shown to the user.
39
+ */
40
+ label: string;
41
+ /**
42
+ * Option value passed to `onChange` when the option is selected.
43
+ */
44
+ value: `${OrderBy}/${Order}`;
45
+ };
36
46
  type BaseQueryControlsProps = {
37
47
  /**
38
48
  * An array of the authors to select from.
@@ -85,6 +95,10 @@ type BaseQueryControlsProps = {
85
95
  * The meta key by which to order posts.
86
96
  */
87
97
  orderBy?: OrderBy;
98
+ /**
99
+ * List of available ordering options.
100
+ */
101
+ orderByOptions?: OrderByOption[];
88
102
  /**
89
103
  * The selected author ID.
90
104
  */
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/query-controls/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/query-controls/types.ts"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"textarea-control-styles.d.ts","sourceRoot":"","sources":["../../../src/textarea-control/styles/textarea-control-styles.ts"],"names":[],"mappings":"AAkCA,eAAO,MAAM,cAAc;;SAfI,MAAQ,WAC/B;2HAkEP,CAAC"}
1
+ {"version":3,"file":"textarea-control-styles.d.ts","sourceRoot":"","sources":["../../../src/textarea-control/styles/textarea-control-styles.ts"],"names":[],"mappings":"AAkCA,eAAO,MAAM,cAAc;;SAfI,MAAQ,WAC/B;2HAgEP,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/components",
3
- "version": "29.4.0",
3
+ "version": "29.5.1",
4
4
  "description": "UI components for WordPress.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -44,23 +44,23 @@
44
44
  "@types/gradient-parser": "0.1.3",
45
45
  "@types/highlight-words-core": "1.2.1",
46
46
  "@use-gesture/react": "^10.3.1",
47
- "@wordpress/a11y": "^4.18.0",
48
- "@wordpress/compose": "^7.18.0",
49
- "@wordpress/date": "^5.18.0",
50
- "@wordpress/deprecated": "^4.18.0",
51
- "@wordpress/dom": "^4.18.0",
52
- "@wordpress/element": "^6.18.0",
53
- "@wordpress/escape-html": "^3.18.0",
54
- "@wordpress/hooks": "^4.18.0",
55
- "@wordpress/html-entities": "^4.18.0",
56
- "@wordpress/i18n": "^5.18.0",
57
- "@wordpress/icons": "^10.18.0",
58
- "@wordpress/is-shallow-equal": "^5.18.0",
59
- "@wordpress/keycodes": "^4.18.0",
60
- "@wordpress/primitives": "^4.18.0",
61
- "@wordpress/private-apis": "^1.18.0",
62
- "@wordpress/rich-text": "^7.18.0",
63
- "@wordpress/warning": "^3.18.0",
47
+ "@wordpress/a11y": "^4.19.1",
48
+ "@wordpress/compose": "^7.19.1",
49
+ "@wordpress/date": "^5.19.1",
50
+ "@wordpress/deprecated": "^4.19.1",
51
+ "@wordpress/dom": "^4.19.1",
52
+ "@wordpress/element": "^6.19.1",
53
+ "@wordpress/escape-html": "^3.19.1",
54
+ "@wordpress/hooks": "^4.19.1",
55
+ "@wordpress/html-entities": "^4.19.1",
56
+ "@wordpress/i18n": "^5.19.1",
57
+ "@wordpress/icons": "^10.19.1",
58
+ "@wordpress/is-shallow-equal": "^5.19.1",
59
+ "@wordpress/keycodes": "^4.19.1",
60
+ "@wordpress/primitives": "^4.19.1",
61
+ "@wordpress/private-apis": "^1.19.1",
62
+ "@wordpress/rich-text": "^7.19.1",
63
+ "@wordpress/warning": "^3.19.1",
64
64
  "change-case": "^4.1.2",
65
65
  "clsx": "^2.1.1",
66
66
  "colord": "^2.7.0",
@@ -85,5 +85,5 @@
85
85
  "publishConfig": {
86
86
  "access": "public"
87
87
  },
88
- "gitHead": "afe4fb333177642180ac020f1030c5685eab7183"
88
+ "gitHead": "6f49fee89f840761f7fedf662713cbd4a71723e9"
89
89
  }
@@ -202,7 +202,7 @@ describe( 'BorderBoxControl', () => {
202
202
  await waitFor( () =>
203
203
  expect(
204
204
  screen.getByRole( 'button', {
205
- name: 'Custom color picker.',
205
+ name: 'Custom color picker',
206
206
  } )
207
207
  ).toBeVisible()
208
208
  );
@@ -157,7 +157,7 @@ const BorderControlDropdown = (
157
157
  onStyleChange,
158
158
  popoverContentClassName,
159
159
  popoverControlsClassName,
160
- resetButtonClassName,
160
+ resetButtonWrapperClassName,
161
161
  size,
162
162
  __unstablePopoverProps,
163
163
  ...otherProps
@@ -173,7 +173,7 @@ const BorderControlDropdown = (
173
173
  enableStyle
174
174
  );
175
175
 
176
- const showResetButton = color || ( style && style !== 'none' );
176
+ const enableResetButton = color || ( style && style !== 'none' );
177
177
  const dropdownPosition = __experimentalIsRenderedInSidebar
178
178
  ? 'bottom left'
179
179
  : undefined;
@@ -199,9 +199,7 @@ const BorderControlDropdown = (
199
199
  </Button>
200
200
  );
201
201
 
202
- const renderContent: DropdownComponentProps[ 'renderContent' ] = ( {
203
- onClose,
204
- } ) => (
202
+ const renderContent: DropdownComponentProps[ 'renderContent' ] = () => (
205
203
  <>
206
204
  <DropdownContentWrapper paddingSize="medium">
207
205
  <VStack className={ popoverControlsClassName } spacing={ 6 }>
@@ -224,22 +222,20 @@ const BorderControlDropdown = (
224
222
  />
225
223
  ) }
226
224
  </VStack>
227
- </DropdownContentWrapper>
228
- { showResetButton && (
229
- <DropdownContentWrapper paddingSize="none">
225
+ <div className={ resetButtonWrapperClassName }>
230
226
  <Button
231
- className={ resetButtonClassName }
232
227
  variant="tertiary"
233
228
  onClick={ () => {
234
229
  onReset();
235
- onClose();
236
230
  } }
231
+ disabled={ ! enableResetButton }
232
+ accessibleWhenDisabled
237
233
  __next40pxDefaultSize
238
234
  >
239
235
  { __( 'Reset' ) }
240
236
  </Button>
241
- </DropdownContentWrapper>
242
- ) }
237
+ </div>
238
+ </DropdownContentWrapper>
243
239
  </>
244
240
  );
245
241
 
@@ -76,8 +76,8 @@ export function useBorderControlDropdown(
76
76
  return cx( styles.borderControlPopoverContent );
77
77
  }, [ cx ] );
78
78
 
79
- const resetButtonClassName = useMemo( () => {
80
- return cx( styles.resetButton );
79
+ const resetButtonWrapperClassName = useMemo( () => {
80
+ return cx( styles.resetButtonWrapper );
81
81
  }, [ cx ] );
82
82
 
83
83
  return {
@@ -94,7 +94,7 @@ export function useBorderControlDropdown(
94
94
  onReset,
95
95
  popoverContentClassName,
96
96
  popoverControlsClassName,
97
- resetButtonClassName,
97
+ resetButtonWrapperClassName,
98
98
  size,
99
99
  __experimentalIsRenderedInSidebar,
100
100
  };
@@ -147,16 +147,10 @@ export const borderControlPopoverControls = css`
147
147
  export const borderControlPopoverContent = css``;
148
148
  export const borderColorIndicator = css``;
149
149
 
150
- export const resetButton = css`
151
- justify-content: center;
152
- width: 100%;
153
-
154
- /* Override button component styling */
155
- && {
156
- border-top: ${ CONFIG.borderWidth } solid ${ COLORS.gray[ 400 ] };
157
- border-top-left-radius: 0;
158
- border-top-right-radius: 0;
159
- }
150
+ export const resetButtonWrapper = css`
151
+ display: flex;
152
+ justify-content: flex-end;
153
+ margin-top: 12px;
160
154
  `;
161
155
 
162
156
  export const borderSlider = () => css`
@@ -138,7 +138,7 @@ describe( 'BorderControl', () => {
138
138
 
139
139
  const customColorPicker = getButton( /Custom color picker/ );
140
140
  const circularOptionPicker = screen.getByRole( 'listbox', {
141
- name: 'Custom color picker.',
141
+ name: 'Custom color picker',
142
142
  } );
143
143
  const colorSwatchButtons =
144
144
  within( circularOptionPicker ).getAllByRole( 'option' );
@@ -93,6 +93,19 @@ Prevents keyboard interaction from wrapping around. Only used when `asButtons` i
93
93
  - Required: No
94
94
  - Default: `true`
95
95
 
96
+ ### `aria-labelledby`: `string`
97
+
98
+ The ID reference list of one or more elements that label the wrapper element.
99
+
100
+ - Required: No
101
+
102
+ ### `aria-label`: `string`
103
+
104
+ The label for the wrapper element. Not used if an 'aria-labelledby' is provided.
105
+
106
+ - Required: No
107
+ - Default: `Custom color picker`
108
+
96
109
  ## Subcomponents
97
110
 
98
111
  ### `CircularOptionPicker.ButtonAction`
@@ -132,7 +132,7 @@ function ButtonsCircularOptionPicker(
132
132
  );
133
133
 
134
134
  return (
135
- <div { ...additionalProps } id={ baseId }>
135
+ <div { ...additionalProps } role="group" id={ baseId }>
136
136
  <CircularOptionPickerContext.Provider value={ contextValue }>
137
137
  { options }
138
138
  { children }
@@ -9,5 +9,6 @@ export {
9
9
  ButtonAction,
10
10
  DropdownLinkAction,
11
11
  } from './circular-option-picker-actions';
12
+ export { getComputeCircularOptionPickerCommonProps } from './utils';
12
13
 
13
14
  export default CircularOptionPicker;
@@ -131,7 +131,7 @@ WithLoopingDisabled.parameters = {
131
131
  docs: {
132
132
  source: {
133
133
  code: `<CircularOptionPicker
134
- aria-label="${ WithLoopingDisabled.args[ 'aria-label' ] }"
134
+ 'aria-label': 'Circular Option Picker',
135
135
  loop={false}
136
136
  options={<DefaultOptions />}
137
137
  />`,
@@ -57,6 +57,7 @@ describe( 'CircularOptionPicker', () => {
57
57
 
58
58
  expect( screen.queryByRole( 'listbox' ) ).not.toBeInTheDocument();
59
59
  expect( screen.queryByRole( 'option' ) ).not.toBeInTheDocument();
60
+ expect( screen.getByRole( 'group' ) ).toBeInTheDocument();
60
61
  expect( screen.getByRole( 'button' ) ).toBeInTheDocument();
61
62
  } );
62
63
  } );
@@ -40,6 +40,16 @@ type CommonCircularOptionPickerProps = {
40
40
  * The child elements.
41
41
  */
42
42
  children?: ReactNode;
43
+ /**
44
+ * The ID reference list of one or more elements that label the wrapper
45
+ * element.
46
+ */
47
+ 'aria-labelledby'?: string;
48
+ /**
49
+ * The label for the wrapper element. Defaults to 'Custom color picker'. Not
50
+ * used if an 'aria-labelledby' is provided.
51
+ */
52
+ 'aria-label'?: string;
43
53
  };
44
54
 
45
55
  type WithBaseId = {
@@ -59,16 +69,7 @@ type FullListboxCircularOptionPickerProps = CommonCircularOptionPickerProps & {
59
69
  * @default true
60
70
  */
61
71
  loop?: boolean;
62
- } & (
63
- | {
64
- 'aria-label': string;
65
- 'aria-labelledby'?: never;
66
- }
67
- | {
68
- 'aria-label'?: never;
69
- 'aria-labelledby': string;
70
- }
71
- );
72
+ };
72
73
 
73
74
  export type ListboxCircularOptionPickerProps = WithBaseId &
74
75
  Omit< FullListboxCircularOptionPickerProps, 'asButtons' >;
@@ -0,0 +1,27 @@
1
+ /**
2
+ * WordPress dependencies
3
+ */
4
+ import { __ } from '@wordpress/i18n';
5
+
6
+ /**
7
+ * Computes the common props for the CircularOptionPicker.
8
+ */
9
+ export function getComputeCircularOptionPickerCommonProps(
10
+ asButtons?: boolean,
11
+ loop?: boolean,
12
+ ariaLabel?: string,
13
+ ariaLabelledby?: string
14
+ ) {
15
+ const metaProps = asButtons
16
+ ? { asButtons: true }
17
+ : { asButtons: false, loop };
18
+
19
+ const labelProps = {
20
+ 'aria-labelledby': ariaLabelledby,
21
+ 'aria-label': ariaLabelledby
22
+ ? undefined
23
+ : ariaLabel || __( 'Custom color picker' ),
24
+ };
25
+
26
+ return { metaProps, labelProps };
27
+ }