@wordpress/components 19.9.0 → 19.10.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 (185) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/CONTRIBUTING.md +80 -7
  3. package/build/angle-picker-control/angle-circle.js +5 -7
  4. package/build/angle-picker-control/angle-circle.js.map +1 -1
  5. package/build/box-control/index.js +0 -21
  6. package/build/box-control/index.js.map +1 -1
  7. package/build/box-control/utils.js +1 -8
  8. package/build/box-control/utils.js.map +1 -1
  9. package/build/button/index.js +3 -5
  10. package/build/button/index.js.map +1 -1
  11. package/build/circular-option-picker/index.js +1 -2
  12. package/build/circular-option-picker/index.js.map +1 -1
  13. package/build/disabled/index.js +4 -76
  14. package/build/disabled/index.js.map +1 -1
  15. package/build/input-control/index.js +3 -2
  16. package/build/input-control/index.js.map +1 -1
  17. package/build/input-control/styles/input-control-styles.js +42 -30
  18. package/build/input-control/styles/input-control-styles.js.map +1 -1
  19. package/build/mobile/bottom-sheet-select-control/index.native.js +1 -0
  20. package/build/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  21. package/build/popover/index.js +6 -52
  22. package/build/popover/index.js.map +1 -1
  23. package/build/select-control/index.js +31 -4
  24. package/build/select-control/index.js.map +1 -1
  25. package/build/select-control/styles/select-control-styles.js +8 -8
  26. package/build/select-control/styles/select-control-styles.js.map +1 -1
  27. package/build/text-control/index.js +35 -28
  28. package/build/text-control/index.js.map +1 -1
  29. package/build/text-control/types.js +6 -0
  30. package/build/text-control/types.js.map +1 -0
  31. package/build/toggle-group-control/toggle-group-control-option-icon/component.js +6 -4
  32. package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  33. package/build/tools-panel/tools-panel-header/component.js +52 -36
  34. package/build/tools-panel/tools-panel-header/component.js.map +1 -1
  35. package/build/unit-control/index.js +3 -3
  36. package/build/unit-control/index.js.map +1 -1
  37. package/build/unit-control/styles/unit-control-styles.js +11 -20
  38. package/build/unit-control/styles/unit-control-styles.js.map +1 -1
  39. package/build/unit-control/utils.js.map +1 -1
  40. package/build-module/angle-picker-control/angle-circle.js +5 -7
  41. package/build-module/angle-picker-control/angle-circle.js.map +1 -1
  42. package/build-module/box-control/index.js +1 -20
  43. package/build-module/box-control/index.js.map +1 -1
  44. package/build-module/box-control/utils.js +0 -6
  45. package/build-module/box-control/utils.js.map +1 -1
  46. package/build-module/button/index.js +3 -4
  47. package/build-module/button/index.js.map +1 -1
  48. package/build-module/circular-option-picker/index.js +1 -2
  49. package/build-module/circular-option-picker/index.js.map +1 -1
  50. package/build-module/disabled/index.js +5 -76
  51. package/build-module/disabled/index.js.map +1 -1
  52. package/build-module/input-control/index.js +3 -2
  53. package/build-module/input-control/index.js.map +1 -1
  54. package/build-module/input-control/styles/input-control-styles.js +42 -30
  55. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  56. package/build-module/mobile/bottom-sheet-select-control/index.native.js +1 -0
  57. package/build-module/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  58. package/build-module/popover/index.js +6 -52
  59. package/build-module/popover/index.js.map +1 -1
  60. package/build-module/select-control/index.js +29 -3
  61. package/build-module/select-control/index.js.map +1 -1
  62. package/build-module/select-control/styles/select-control-styles.js +8 -8
  63. package/build-module/select-control/styles/select-control-styles.js.map +1 -1
  64. package/build-module/text-control/index.js +35 -27
  65. package/build-module/text-control/index.js.map +1 -1
  66. package/build-module/text-control/types.js +2 -0
  67. package/build-module/text-control/types.js.map +1 -0
  68. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +1 -5
  69. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  70. package/build-module/tools-panel/tools-panel-header/component.js +51 -36
  71. package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
  72. package/build-module/unit-control/index.js +3 -3
  73. package/build-module/unit-control/index.js.map +1 -1
  74. package/build-module/unit-control/styles/unit-control-styles.js +11 -20
  75. package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
  76. package/build-module/unit-control/utils.js.map +1 -1
  77. package/build-style/style-rtl.css +7 -0
  78. package/build-style/style.css +7 -0
  79. package/build-types/button/index.d.ts.map +1 -1
  80. package/build-types/circular-option-picker/index.d.ts.map +1 -1
  81. package/build-types/color-picker/styles.d.ts +3 -3
  82. package/build-types/disabled/index.d.ts.map +1 -1
  83. package/build-types/input-control/index.d.ts +4 -3
  84. package/build-types/input-control/index.d.ts.map +1 -1
  85. package/build-types/input-control/stories/index.d.ts +5 -5
  86. package/build-types/input-control/stories/index.d.ts.map +1 -1
  87. package/build-types/input-control/styles/input-control-styles.d.ts +1 -0
  88. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  89. package/build-types/input-control/types.d.ts +6 -0
  90. package/build-types/input-control/types.d.ts.map +1 -1
  91. package/build-types/number-control/styles/number-control-styles.d.ts +1 -1
  92. package/build-types/popover/index.d.ts +0 -1
  93. package/build-types/popover/index.d.ts.map +1 -1
  94. package/build-types/select-control/index.d.ts +30 -26
  95. package/build-types/select-control/index.d.ts.map +1 -1
  96. package/build-types/select-control/stories/index.d.ts +23 -0
  97. package/build-types/select-control/stories/index.d.ts.map +1 -0
  98. package/build-types/select-control/styles/select-control-styles.d.ts +3 -4
  99. package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
  100. package/build-types/select-control/test/select-control.d.ts +2 -0
  101. package/build-types/select-control/test/select-control.d.ts.map +1 -0
  102. package/build-types/select-control/types.d.ts +52 -1
  103. package/build-types/select-control/types.d.ts.map +1 -1
  104. package/build-types/text-control/index.d.ts +32 -0
  105. package/build-types/text-control/index.d.ts.map +1 -0
  106. package/build-types/text-control/stories/index.d.ts +13 -0
  107. package/build-types/text-control/stories/index.d.ts.map +1 -0
  108. package/build-types/text-control/types.d.ts +25 -0
  109. package/build-types/text-control/types.d.ts.map +1 -0
  110. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -1
  111. package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
  112. package/build-types/tools-panel/types.d.ts +0 -1
  113. package/build-types/tools-panel/types.d.ts.map +1 -1
  114. package/build-types/unit-control/index.d.ts +2 -2
  115. package/build-types/unit-control/index.d.ts.map +1 -1
  116. package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
  117. package/build-types/unit-control/test/index.d.ts +2 -0
  118. package/build-types/unit-control/test/index.d.ts.map +1 -0
  119. package/build-types/unit-control/test/utils.d.ts +2 -0
  120. package/build-types/unit-control/test/utils.d.ts.map +1 -0
  121. package/build-types/unit-control/types.d.ts +1 -1
  122. package/build-types/unit-control/types.d.ts.map +1 -1
  123. package/build-types/unit-control/utils.d.ts +3 -3
  124. package/build-types/unit-control/utils.d.ts.map +1 -1
  125. package/package.json +17 -17
  126. package/src/angle-picker-control/angle-circle.js +3 -3
  127. package/src/box-control/README.md +0 -74
  128. package/src/box-control/index.js +0 -15
  129. package/src/box-control/stories/index.js +0 -29
  130. package/src/box-control/utils.js +0 -7
  131. package/src/button/index.js +2 -4
  132. package/src/button/test/index.js +16 -1
  133. package/src/circular-option-picker/index.js +1 -2
  134. package/src/color-palette/README.md +0 -1
  135. package/src/color-palette/test/__snapshots__/index.js.snap +2 -3
  136. package/src/confirm-dialog/stories/index.js +87 -99
  137. package/src/date-time/stories/index.js +19 -0
  138. package/src/date-time/test/date.js +107 -78
  139. package/src/dimension-control/test/__snapshots__/index.test.js.snap +4 -4
  140. package/src/disabled/index.js +5 -90
  141. package/src/form-file-upload/test/index.js +15 -12
  142. package/src/input-control/README.md +1 -1
  143. package/src/input-control/index.tsx +3 -2
  144. package/src/input-control/stories/index.tsx +1 -1
  145. package/src/input-control/styles/input-control-styles.tsx +19 -5
  146. package/src/input-control/types.ts +6 -0
  147. package/src/menu-item/style.scss +10 -0
  148. package/src/mobile/bottom-sheet/bottom-sheet-navigation/test/navigation-container.native.js +8 -1
  149. package/src/mobile/bottom-sheet-select-control/index.native.js +1 -0
  150. package/src/mobile/html-text-input/style.android.scss +1 -0
  151. package/src/mobile/html-text-input/style.ios.scss +1 -0
  152. package/src/mobile/link-settings/test/link-settings-navigation.native.js +9 -1
  153. package/src/popover/index.js +5 -51
  154. package/src/select-control/README.md +2 -2
  155. package/src/select-control/index.tsx +30 -29
  156. package/src/select-control/stories/index.tsx +90 -0
  157. package/src/select-control/styles/select-control-styles.ts +9 -8
  158. package/src/select-control/test/{select-control.js → select-control.tsx} +2 -2
  159. package/src/select-control/types.ts +66 -1
  160. package/src/text-control/index.tsx +84 -0
  161. package/src/text-control/stories/index.tsx +66 -0
  162. package/src/text-control/types.ts +29 -0
  163. package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +1 -5
  164. package/src/tools-panel/test/__snapshots__/index.js.snap +1 -1
  165. package/src/tools-panel/test/index.js +71 -18
  166. package/src/tools-panel/tools-panel-header/component.tsx +75 -33
  167. package/src/tools-panel/types.ts +0 -1
  168. package/src/tooltip/test/index.js +6 -0
  169. package/src/unit-control/index.tsx +2 -5
  170. package/src/unit-control/styles/unit-control-styles.ts +3 -13
  171. package/src/unit-control/test/__snapshots__/index.tsx.snap +33 -0
  172. package/src/unit-control/test/{index.js → index.tsx} +214 -165
  173. package/src/unit-control/test/{utils.js → utils.ts} +38 -19
  174. package/src/unit-control/types.ts +4 -1
  175. package/src/unit-control/utils.ts +5 -3
  176. package/tsconfig.json +2 -1
  177. package/tsconfig.tsbuildinfo +1 -1
  178. package/build/box-control/visualizer.js +0 -165
  179. package/build/box-control/visualizer.js.map +0 -1
  180. package/build-module/box-control/visualizer.js +0 -154
  181. package/build-module/box-control/visualizer.js.map +0 -1
  182. package/src/box-control/visualizer.js +0 -116
  183. package/src/select-control/stories/index.js +0 -104
  184. package/src/text-control/index.js +0 -72
  185. package/src/text-control/stories/index.js +0 -46
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/disabled/index.js"],"names":["Context","Consumer","Provider","DISABLED_ELIGIBLE_NODE_NAMES","Disabled","className","children","isDisabled","props","node","disable","current","focus","focusable","find","forEach","nodeName","setAttribute","tabIndex","getAttribute","removeAttribute","hasAttribute","debouncedDisable","undefined","leading","observer","window","MutationObserver","observe","childList","attributes","subtree","disconnect","cancel"],"mappings":";;;;;;;;;AASA;;;;AANA;;AACA;;AAWA;;AAKA;;AApBA;AACA;AACA;;AAIA;AACA;AACA;;AASA;AACA;AACA;AAGA,MAAMA,OAAO,GAAG,4BAAe,KAAf,CAAhB;AACA,MAAM;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,IAAyBF,OAA/B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMG,4BAA4B,GAAG,CACpC,QADoC,EAEpC,UAFoC,EAGpC,OAHoC,EAIpC,UAJoC,EAKpC,QALoC,EAMpC,QANoC,EAOpC,UAPoC,CAArC;AAUA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AACA,SAASC,QAAT,OAA0E;AAAA,MAAvD;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,QAAb;AAAuBC,IAAAA,UAAU,GAAG,IAApC;AAA0C,OAAGC;AAA7C,GAAuD;;AACzE;AACA,QAAMC,IAAI,GAAG,qBAAQ,IAAR,CAAb;;AAEA,QAAMC,OAAO,GAAG,MAAM;AACrB,QAAK,CAAED,IAAI,CAACE,OAAZ,EAAsB;AACrB;AACA;;AAEDC,eAAMC,SAAN,CAAgBC,IAAhB,CAAsBL,IAAI,CAACE,OAA3B,EAAqCI,OAArC,CAAgDF,SAAF,IAAiB;AAC9D,UACC,sBAAUV,4BAAV,EAAwCU,SAAS,CAACG,QAAlD,CADD,EAEE;AACDH,QAAAA,SAAS,CAACI,YAAV,CAAwB,UAAxB,EAAoC,EAApC;AACA;;AAED,UAAKJ,SAAS,CAACG,QAAV,KAAuB,GAA5B,EAAkC;AACjCH,QAAAA,SAAS,CAACI,YAAV,CAAwB,UAAxB,EAAoC,IAApC;AACA;;AAED,YAAMC,QAAQ,GAAGL,SAAS,CAACM,YAAV,CAAwB,UAAxB,CAAjB;;AACA,UAAKD,QAAQ,KAAK,IAAb,IAAqBA,QAAQ,KAAK,IAAvC,EAA8C;AAC7CL,QAAAA,SAAS,CAACO,eAAV,CAA2B,UAA3B;AACA;;AAED,UAAKP,SAAS,CAACQ,YAAV,CAAwB,iBAAxB,CAAL,EAAmD;AAClDR,QAAAA,SAAS,CAACI,YAAV,CAAwB,iBAAxB,EAA2C,OAA3C;AACA;AACD,KAnBD;AAoBA,GAzBD,CAJyE,CA+BzE;AACA;;;AACA,QAAMK,gBAAgB,GAAG,0BACxB,sBAAUZ,OAAV,EAAmBa,SAAnB,EAA8B;AAAEC,IAAAA,OAAO,EAAE;AAAX,GAA9B,CADwB,EAExB,EAFwB,CAAzB;AAKA,gCAAiB,MAAM;AACtB,QAAK,CAAEjB,UAAP,EAAoB;AACnB;AACA;;AAEDG,IAAAA,OAAO;AAEP;;AACA,QAAIe,QAAJ;;AACA,QAAKhB,IAAI,CAACE,OAAV,EAAoB;AACnBc,MAAAA,QAAQ,GAAG,IAAIC,MAAM,CAACC,gBAAX,CAA6BL,gBAA7B,CAAX;AACAG,MAAAA,QAAQ,CAACG,OAAT,CAAkBnB,IAAI,CAACE,OAAvB,EAAgC;AAC/BkB,QAAAA,SAAS,EAAE,IADoB;AAE/BC,QAAAA,UAAU,EAAE,IAFmB;AAG/BC,QAAAA,OAAO,EAAE;AAHsB,OAAhC;AAKA;;AAED,WAAO,MAAM;AACZ,UAAKN,QAAL,EAAgB;AACfA,QAAAA,QAAQ,CAACO,UAAT;AACA;;AACDV,MAAAA,gBAAgB,CAACW,MAAjB;AACA,KALD;AAMA,GAxBD,EAwBG,EAxBH;;AA0BA,MAAK,CAAE1B,UAAP,EAAoB;AACnB,WAAO,4BAAC,QAAD;AAAU,MAAA,KAAK,EAAG;AAAlB,OAA4BD,QAA5B,CAAP;AACA;;AAED,SACC,4BAAC,QAAD;AAAU,IAAA,KAAK,EAAG;AAAlB,KACC,4BAAC,6BAAD;AACC,IAAA,GAAG,EAAGG,IADP;AAEC,IAAA,SAAS,EAAG,yBAAYJ,SAAZ,EAAuB,qBAAvB;AAFb,KAGMG,KAHN,GAKGF,QALH,CADD,CADD;AAWA;;AAEDF,QAAQ,CAACJ,OAAT,GAAmBA,OAAnB;AACAI,QAAQ,CAACH,QAAT,GAAoBA,QAApB;eAEeG,Q","sourcesContent":["/**\n * External dependencies\n */\nimport { includes, debounce } from 'lodash';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreateContext,\n\tuseCallback,\n\tuseLayoutEffect,\n\tuseRef,\n} from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport { StyledWrapper } from './styles/disabled-styles';\n\nconst Context = createContext( false );\nconst { Consumer, Provider } = Context;\n\n/**\n * Names of control nodes which qualify for disabled behavior.\n *\n * See WHATWG HTML Standard: 4.10.18.5: \"Enabling and disabling form controls: the disabled attribute\".\n *\n * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#enabling-and-disabling-form-controls:-the-disabled-attribute\n *\n * @type {string[]}\n */\nconst DISABLED_ELIGIBLE_NODE_NAMES = [\n\t'BUTTON',\n\t'FIELDSET',\n\t'INPUT',\n\t'OPTGROUP',\n\t'OPTION',\n\t'SELECT',\n\t'TEXTAREA',\n];\n\n/**\n * @typedef OwnProps\n * @property {string} [className] Classname for the disabled element.\n * @property {import('react').ReactNode} children Children to disable.\n * @property {boolean} [isDisabled=true] Whether to disable the children.\n */\n\n/**\n * @param {OwnProps & import('react').HTMLAttributes<HTMLDivElement>} props\n * @return {JSX.Element} Element wrapping the children to disable them when isDisabled is true.\n */\nfunction Disabled( { className, children, isDisabled = true, ...props } ) {\n\t/** @type {import('react').RefObject<HTMLDivElement>} */\n\tconst node = useRef( null );\n\n\tconst disable = () => {\n\t\tif ( ! node.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfocus.focusable.find( node.current ).forEach( ( focusable ) => {\n\t\t\tif (\n\t\t\t\tincludes( DISABLED_ELIGIBLE_NODE_NAMES, focusable.nodeName )\n\t\t\t) {\n\t\t\t\tfocusable.setAttribute( 'disabled', '' );\n\t\t\t}\n\n\t\t\tif ( focusable.nodeName === 'A' ) {\n\t\t\t\tfocusable.setAttribute( 'tabindex', '-1' );\n\t\t\t}\n\n\t\t\tconst tabIndex = focusable.getAttribute( 'tabindex' );\n\t\t\tif ( tabIndex !== null && tabIndex !== '-1' ) {\n\t\t\t\tfocusable.removeAttribute( 'tabindex' );\n\t\t\t}\n\n\t\t\tif ( focusable.hasAttribute( 'contenteditable' ) ) {\n\t\t\t\tfocusable.setAttribute( 'contenteditable', 'false' );\n\t\t\t}\n\t\t} );\n\t};\n\n\t// Debounce re-disable since disabling process itself will incur\n\t// additional mutations which should be ignored.\n\tconst debouncedDisable = useCallback(\n\t\tdebounce( disable, undefined, { leading: true } ),\n\t\t[]\n\t);\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tdisable();\n\n\t\t/** @type {MutationObserver | undefined} */\n\t\tlet observer;\n\t\tif ( node.current ) {\n\t\t\tobserver = new window.MutationObserver( debouncedDisable );\n\t\t\tobserver.observe( node.current, {\n\t\t\t\tchildList: true,\n\t\t\t\tattributes: true,\n\t\t\t\tsubtree: true,\n\t\t\t} );\n\t\t}\n\n\t\treturn () => {\n\t\t\tif ( observer ) {\n\t\t\t\tobserver.disconnect();\n\t\t\t}\n\t\t\tdebouncedDisable.cancel();\n\t\t};\n\t}, [] );\n\n\tif ( ! isDisabled ) {\n\t\treturn <Provider value={ false }>{ children }</Provider>;\n\t}\n\n\treturn (\n\t\t<Provider value={ true }>\n\t\t\t<StyledWrapper\n\t\t\t\tref={ node }\n\t\t\t\tclassName={ classnames( className, 'components-disabled' ) }\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</StyledWrapper>\n\t\t</Provider>\n\t);\n}\n\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\n\nexport default Disabled;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/disabled/index.js"],"names":["Context","Consumer","Provider","Disabled","className","children","isDisabled","props","ref"],"mappings":";;;;;;;;;AASA;;;;AANA;;AAKA;;AAMA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAGA,MAAMA,OAAO,GAAG,4BAAe,KAAf,CAAhB;AACA,MAAM;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,IAAyBF,OAA/B;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AACA,SAASG,QAAT,OAA0E;AAAA,MAAvD;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,QAAb;AAAuBC,IAAAA,UAAU,GAAG,IAApC;AAA0C,OAAGC;AAA7C,GAAuD;;AACzE;AACA,QAAMC,GAAG,GAAG,yCAAZ;;AAEA,MAAK,CAAEF,UAAP,EAAoB;AACnB,WAAO,4BAAC,QAAD;AAAU,MAAA,KAAK,EAAG;AAAlB,OAA4BD,QAA5B,CAAP;AACA;;AAED,SACC,4BAAC,QAAD;AAAU,IAAA,KAAK,EAAG;AAAlB,KACC,4BAAC,6BAAD;AACC,IAAA,GAAG,EAAGG,GADP;AAEC,IAAA,SAAS,EAAG,yBAAYJ,SAAZ,EAAuB,qBAAvB;AAFb,KAGMG,KAHN,GAKGF,QALH,CADD,CADD;AAWA;;AAEDF,QAAQ,CAACH,OAAT,GAAmBA,OAAnB;AACAG,QAAQ,CAACF,QAAT,GAAoBA,QAApB;eAEeE,Q","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __experimentalUseDisabled as useDisabled } from '@wordpress/compose';\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { StyledWrapper } from './styles/disabled-styles';\n\nconst Context = createContext( false );\nconst { Consumer, Provider } = Context;\n\n/**\n * @typedef OwnProps\n * @property {string} [className] Classname for the disabled element.\n * @property {import('react').ReactNode} children Children to disable.\n * @property {boolean} [isDisabled=true] Whether to disable the children.\n */\n\n/**\n * @param {OwnProps & import('react').HTMLAttributes<HTMLDivElement>} props\n * @return {JSX.Element} Element wrapping the children to disable them when isDisabled is true.\n */\nfunction Disabled( { className, children, isDisabled = true, ...props } ) {\n\t/** @type {import('react').RefCallback<HTMLDivElement>} */\n\tconst ref = useDisabled();\n\n\tif ( ! isDisabled ) {\n\t\treturn <Provider value={ false }>{ children }</Provider>;\n\t}\n\n\treturn (\n\t\t<Provider value={ true }>\n\t\t\t<StyledWrapper\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ classnames( className, 'components-disabled' ) }\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</StyledWrapper>\n\t\t</Provider>\n\t);\n}\n\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\n\nexport default Disabled;\n"]}
@@ -97,7 +97,7 @@ function UnforwardedInputControl(_ref, ref) {
97
97
  * InputControl components let users enter and edit text. This is an experimental component
98
98
  * intended to (in time) merge with or replace `TextControl`.
99
99
  *
100
- * @example
100
+ * ```jsx
101
101
  * import { __experimentalInputControl as InputControl } from '@wordpress/components';
102
102
  * import { useState } from '@wordpress/compose';
103
103
  *
@@ -107,10 +107,11 @@ function UnforwardedInputControl(_ref, ref) {
107
107
  * return (
108
108
  * <InputControl
109
109
  * value={ value }
110
- * onChange={ ( nextValue ) => setValue( nextValue ) }
110
+ * onChange={ ( nextValue ) => setValue( nextValue ?? '' ) }
111
111
  * />
112
112
  * );
113
113
  * };
114
+ * ```
114
115
  */
115
116
 
116
117
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/input-control/index.tsx"],"names":["useUniqueId","idProp","instanceId","InputControl","id","UnforwardedInputControl","ref","__unstableStateReducer","stateReducer","state","__unstableInputWidth","className","disabled","hideLabelFromVision","isPressEnterToChange","label","labelPosition","onChange","noop","onValidate","onKeyDown","prefix","size","suffix","value","props","isFocused","setIsFocused","classes"],"mappings":";;;;;;;;;;;AAWA;;;;AARA;;AACA;;AAMA;;AAMA;;AACA;;AAjBA;AACA;AACA;;AAKA;AACA;AACA;;AAIA;AACA;AACA;AAKA,SAASA,WAAT,CAAsBC,MAAtB,EAAwC;AACvC,QAAMC,UAAU,GAAG,4BAAeC,YAAf,CAAnB;AACA,QAAMC,EAAE,GAAI,2BAA2BF,UAAY,EAAnD;AAEA,SAAOD,MAAM,IAAIG,EAAjB;AACA;;AAEM,SAASC,uBAAT,OAoBNC,GApBM,EAqBL;AAAA,MApBD;AACCC,IAAAA,sBAAsB,EAAEC,YAAY,GAAKC,KAAF,IAAaA,KADrD;AAECC,IAAAA,oBAFD;AAGCC,IAAAA,SAHD;AAICC,IAAAA,QAAQ,GAAG,KAJZ;AAKCC,IAAAA,mBAAmB,GAAG,KALvB;AAMCT,IAAAA,EAAE,EAAEH,MANL;AAOCa,IAAAA,oBAAoB,GAAG,KAPxB;AAQCC,IAAAA,KARD;AASCC,IAAAA,aAAa,GAAG,KATjB;AAUCC,IAAAA,QAAQ,GAAGC,YAVZ;AAWCC,IAAAA,UAAU,GAAGD,YAXd;AAYCE,IAAAA,SAAS,GAAGF,YAZb;AAaCG,IAAAA,MAbD;AAcCC,IAAAA,IAAI,GAAG,SAdR;AAeCC,IAAAA,MAfD;AAgBCC,IAAAA,KAhBD;AAiBC,OAAGC;AAjBJ,GAoBC;AACD,QAAM,CAAEC,SAAF,EAAaC,YAAb,IAA8B,uBAAU,KAAV,CAApC;AAEA,QAAMvB,EAAE,GAAGJ,WAAW,CAAEC,MAAF,CAAtB;AACA,QAAM2B,OAAO,GAAG,yBAAY,0BAAZ,EAAwCjB,SAAxC,CAAhB;AAEA,SACC,4BAAC,kBAAD;AACC,IAAA,oBAAoB,EAAGD,oBADxB;AAEC,IAAA,SAAS,EAAGkB,OAFb;AAGC,IAAA,QAAQ,EAAGhB,QAHZ;AAIC,IAAA,GAAG,EAAG,CAJP;AAKC,IAAA,mBAAmB,EAAGC,mBALvB;AAMC,IAAA,EAAE,EAAGT,EANN;AAOC,IAAA,SAAS,EAAGsB,SAPb;AAQC,IAAA,OAAO,EAAC,MART;AASC,IAAA,KAAK,EAAGX,KATT;AAUC,IAAA,aAAa,EAAGC,aAVjB;AAWC,IAAA,MAAM,EAAGK,MAXV;AAYC,IAAA,IAAI,EAAGC,IAZR;AAaC,IAAA,MAAM,EAAGC;AAbV,KAeC,4BAAC,mBAAD,6BACME,KADN;AAEC,IAAA,SAAS,EAAC,iCAFX;AAGC,IAAA,QAAQ,EAAGb,QAHZ;AAIC,IAAA,EAAE,EAAGR,EAJN;AAKC,IAAA,SAAS,EAAGsB,SALb;AAMC,IAAA,oBAAoB,EAAGZ,oBANxB;AAOC,IAAA,QAAQ,EAAGG,QAPZ;AAQC,IAAA,SAAS,EAAGG,SARb;AASC,IAAA,UAAU,EAAGD,UATd;AAUC,IAAA,GAAG,EAAGb,GAVP;AAWC,IAAA,YAAY,EAAGqB,YAXhB;AAYC,IAAA,IAAI,EAAGL,IAZR;AAaC,IAAA,YAAY,EAAGd,YAbhB;AAcC,IAAA,KAAK,EAAGgB;AAdT,KAfD,CADD;AAkCA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMrB,YAAY,GAAG,yBAAYE,uBAAZ,CAArB;;eAEQF,Y","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\nimport classNames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport InputBase from './input-base';\nimport InputField from './input-field';\nimport type { InputControlProps } from './types';\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( InputControl );\n\tconst id = `inspector-input-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nexport function UnforwardedInputControl(\n\t{\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\t__unstableInputWidth,\n\t\tclassName,\n\t\tdisabled = false,\n\t\thideLabelFromVision = false,\n\t\tid: idProp,\n\t\tisPressEnterToChange = false,\n\t\tlabel,\n\t\tlabelPosition = 'top',\n\t\tonChange = noop,\n\t\tonValidate = noop,\n\t\tonKeyDown = noop,\n\t\tprefix,\n\t\tsize = 'default',\n\t\tsuffix,\n\t\tvalue,\n\t\t...props\n\t}: InputControlProps,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\n\tconst id = useUniqueId( idProp );\n\tconst classes = classNames( 'components-input-control', className );\n\n\treturn (\n\t\t<InputBase\n\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\tclassName={ classes }\n\t\t\tdisabled={ disabled }\n\t\t\tgap={ 3 }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\tisFocused={ isFocused }\n\t\t\tjustify=\"left\"\n\t\t\tlabel={ label }\n\t\t\tlabelPosition={ labelPosition }\n\t\t\tprefix={ prefix }\n\t\t\tsize={ size }\n\t\t\tsuffix={ suffix }\n\t\t>\n\t\t\t<InputField\n\t\t\t\t{ ...props }\n\t\t\t\tclassName=\"components-input-control__input\"\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tid={ id }\n\t\t\t\tisFocused={ isFocused }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\tonValidate={ onValidate }\n\t\t\t\tref={ ref }\n\t\t\t\tsetIsFocused={ setIsFocused }\n\t\t\t\tsize={ size }\n\t\t\t\tstateReducer={ stateReducer }\n\t\t\t\tvalue={ value }\n\t\t\t/>\n\t\t</InputBase>\n\t);\n}\n\n/**\n * InputControl components let users enter and edit text. This is an experimental component\n * intended to (in time) merge with or replace `TextControl`.\n *\n * @example\n * import { __experimentalInputControl as InputControl } from '@wordpress/components';\n * import { useState } from '@wordpress/compose';\n *\n * const Example = () => {\n * const [ value, setValue ] = useState( '' );\n *\n * return (\n * \t<InputControl\n * \t\tvalue={ value }\n * \t\tonChange={ ( nextValue ) => setValue( nextValue ) }\n * \t/>\n * );\n * };\n */\nexport const InputControl = forwardRef( UnforwardedInputControl );\n\nexport default InputControl;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/input-control/index.tsx"],"names":["useUniqueId","idProp","instanceId","InputControl","id","UnforwardedInputControl","ref","__unstableStateReducer","stateReducer","state","__unstableInputWidth","className","disabled","hideLabelFromVision","isPressEnterToChange","label","labelPosition","onChange","noop","onValidate","onKeyDown","prefix","size","suffix","value","props","isFocused","setIsFocused","classes"],"mappings":";;;;;;;;;;;AAWA;;;;AARA;;AACA;;AAMA;;AAMA;;AACA;;AAjBA;AACA;AACA;;AAKA;AACA;AACA;;AAIA;AACA;AACA;AAKA,SAASA,WAAT,CAAsBC,MAAtB,EAAwC;AACvC,QAAMC,UAAU,GAAG,4BAAeC,YAAf,CAAnB;AACA,QAAMC,EAAE,GAAI,2BAA2BF,UAAY,EAAnD;AAEA,SAAOD,MAAM,IAAIG,EAAjB;AACA;;AAEM,SAASC,uBAAT,OAoBNC,GApBM,EAqBL;AAAA,MApBD;AACCC,IAAAA,sBAAsB,EAAEC,YAAY,GAAKC,KAAF,IAAaA,KADrD;AAECC,IAAAA,oBAFD;AAGCC,IAAAA,SAHD;AAICC,IAAAA,QAAQ,GAAG,KAJZ;AAKCC,IAAAA,mBAAmB,GAAG,KALvB;AAMCT,IAAAA,EAAE,EAAEH,MANL;AAOCa,IAAAA,oBAAoB,GAAG,KAPxB;AAQCC,IAAAA,KARD;AASCC,IAAAA,aAAa,GAAG,KATjB;AAUCC,IAAAA,QAAQ,GAAGC,YAVZ;AAWCC,IAAAA,UAAU,GAAGD,YAXd;AAYCE,IAAAA,SAAS,GAAGF,YAZb;AAaCG,IAAAA,MAbD;AAcCC,IAAAA,IAAI,GAAG,SAdR;AAeCC,IAAAA,MAfD;AAgBCC,IAAAA,KAhBD;AAiBC,OAAGC;AAjBJ,GAoBC;AACD,QAAM,CAAEC,SAAF,EAAaC,YAAb,IAA8B,uBAAU,KAAV,CAApC;AAEA,QAAMvB,EAAE,GAAGJ,WAAW,CAAEC,MAAF,CAAtB;AACA,QAAM2B,OAAO,GAAG,yBAAY,0BAAZ,EAAwCjB,SAAxC,CAAhB;AAEA,SACC,4BAAC,kBAAD;AACC,IAAA,oBAAoB,EAAGD,oBADxB;AAEC,IAAA,SAAS,EAAGkB,OAFb;AAGC,IAAA,QAAQ,EAAGhB,QAHZ;AAIC,IAAA,GAAG,EAAG,CAJP;AAKC,IAAA,mBAAmB,EAAGC,mBALvB;AAMC,IAAA,EAAE,EAAGT,EANN;AAOC,IAAA,SAAS,EAAGsB,SAPb;AAQC,IAAA,OAAO,EAAC,MART;AASC,IAAA,KAAK,EAAGX,KATT;AAUC,IAAA,aAAa,EAAGC,aAVjB;AAWC,IAAA,MAAM,EAAGK,MAXV;AAYC,IAAA,IAAI,EAAGC,IAZR;AAaC,IAAA,MAAM,EAAGC;AAbV,KAeC,4BAAC,mBAAD,6BACME,KADN;AAEC,IAAA,SAAS,EAAC,iCAFX;AAGC,IAAA,QAAQ,EAAGb,QAHZ;AAIC,IAAA,EAAE,EAAGR,EAJN;AAKC,IAAA,SAAS,EAAGsB,SALb;AAMC,IAAA,oBAAoB,EAAGZ,oBANxB;AAOC,IAAA,QAAQ,EAAGG,QAPZ;AAQC,IAAA,SAAS,EAAGG,SARb;AASC,IAAA,UAAU,EAAGD,UATd;AAUC,IAAA,GAAG,EAAGb,GAVP;AAWC,IAAA,YAAY,EAAGqB,YAXhB;AAYC,IAAA,IAAI,EAAGL,IAZR;AAaC,IAAA,YAAY,EAAGd,YAbhB;AAcC,IAAA,KAAK,EAAGgB;AAdT,KAfD,CADD;AAkCA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMrB,YAAY,GAAG,yBAAYE,uBAAZ,CAArB;;eAEQF,Y","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\nimport classNames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport InputBase from './input-base';\nimport InputField from './input-field';\nimport type { InputControlProps } from './types';\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( InputControl );\n\tconst id = `inspector-input-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nexport function UnforwardedInputControl(\n\t{\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\t__unstableInputWidth,\n\t\tclassName,\n\t\tdisabled = false,\n\t\thideLabelFromVision = false,\n\t\tid: idProp,\n\t\tisPressEnterToChange = false,\n\t\tlabel,\n\t\tlabelPosition = 'top',\n\t\tonChange = noop,\n\t\tonValidate = noop,\n\t\tonKeyDown = noop,\n\t\tprefix,\n\t\tsize = 'default',\n\t\tsuffix,\n\t\tvalue,\n\t\t...props\n\t}: InputControlProps,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\n\tconst id = useUniqueId( idProp );\n\tconst classes = classNames( 'components-input-control', className );\n\n\treturn (\n\t\t<InputBase\n\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\tclassName={ classes }\n\t\t\tdisabled={ disabled }\n\t\t\tgap={ 3 }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\tisFocused={ isFocused }\n\t\t\tjustify=\"left\"\n\t\t\tlabel={ label }\n\t\t\tlabelPosition={ labelPosition }\n\t\t\tprefix={ prefix }\n\t\t\tsize={ size }\n\t\t\tsuffix={ suffix }\n\t\t>\n\t\t\t<InputField\n\t\t\t\t{ ...props }\n\t\t\t\tclassName=\"components-input-control__input\"\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tid={ id }\n\t\t\t\tisFocused={ isFocused }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\tonValidate={ onValidate }\n\t\t\t\tref={ ref }\n\t\t\t\tsetIsFocused={ setIsFocused }\n\t\t\t\tsize={ size }\n\t\t\t\tstateReducer={ stateReducer }\n\t\t\t\tvalue={ value }\n\t\t\t/>\n\t\t</InputBase>\n\t);\n}\n\n/**\n * InputControl components let users enter and edit text. This is an experimental component\n * intended to (in time) merge with or replace `TextControl`.\n *\n * ```jsx\n * import { __experimentalInputControl as InputControl } from '@wordpress/components';\n * import { useState } from '@wordpress/compose';\n *\n * const Example = () => {\n * const [ value, setValue ] = useState( '' );\n *\n * return (\n * \t<InputControl\n * \t\tvalue={ value }\n * \t\tonChange={ ( nextValue ) => setValue( nextValue ?? '' ) }\n * \t/>\n * );\n * };\n * ```\n */\nexport const InputControl = forwardRef( UnforwardedInputControl );\n\nexport default InputControl;\n"]}