@wordpress/components 28.8.9 → 28.8.10

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.
@@ -53,6 +53,10 @@ function FormFileUpload({
53
53
  ...props,
54
54
  children: children
55
55
  });
56
+ // @todo: Temporary fix a bug that prevents Chromium browsers from selecting ".heic" files
57
+ // from the file upload. See https://core.trac.wordpress.org/ticket/62268#comment:4.
58
+ // This can be removed once the Chromium fix is in the stable channel.
59
+ const compatAccept = !!accept?.includes('image/*') ? `${accept}, image/heic, image/heif` : accept;
56
60
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
57
61
  className: "components-form-file-upload",
58
62
  children: [ui, /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
@@ -62,7 +66,7 @@ function FormFileUpload({
62
66
  style: {
63
67
  display: 'none'
64
68
  },
65
- accept: accept,
69
+ accept: compatAccept,
66
70
  onChange: onChange,
67
71
  onClick: onClick,
68
72
  "data-testid": "form-file-upload-input"
@@ -1 +1 @@
1
- {"version":3,"names":["_element","require","_button","_interopRequireDefault","_jsxRuntime","FormFileUpload","accept","children","multiple","onChange","onClick","render","props","ref","useRef","openFileDialog","current","click","ui","jsx","default","jsxs","className","type","style","display","_default","exports"],"sources":["@wordpress/components/src/form-file-upload/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { WordPressComponentProps } from '../context';\nimport type { FormFileUploadProps } from './types';\n\n/**\n * FormFileUpload is a component that allows users to select files from their local device.\n *\n * ```jsx\n * import { FormFileUpload } from '@wordpress/components';\n *\n * const MyFormFileUpload = () => (\n * <FormFileUpload\n * accept=\"image/*\"\n * onChange={ ( event ) => console.log( event.currentTarget.files ) }\n * >\n * Upload\n * </FormFileUpload>\n * );\n * ```\n */\nexport function FormFileUpload( {\n\taccept,\n\tchildren,\n\tmultiple = false,\n\tonChange,\n\tonClick,\n\trender,\n\t...props\n}: WordPressComponentProps< FormFileUploadProps, 'button', false > ) {\n\tconst ref = useRef< HTMLInputElement >( null );\n\tconst openFileDialog = () => {\n\t\tref.current?.click();\n\t};\n\n\tconst ui = render ? (\n\t\trender( { openFileDialog } )\n\t) : (\n\t\t<Button onClick={ openFileDialog } { ...props }>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n\n\treturn (\n\t\t<div className=\"components-form-file-upload\">\n\t\t\t{ ui }\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\tref={ ref }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\taccept={ accept }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tdata-testid=\"form-file-upload-input\"\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default FormFileUpload;\n"],"mappings":";;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,OAAA,GAAAC,sBAAA,CAAAF,OAAA;AAA+B,IAAAG,WAAA,GAAAH,OAAA;AAR/B;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASI,cAAcA,CAAE;EAC/BC,MAAM;EACNC,QAAQ;EACRC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,OAAO;EACPC,MAAM;EACN,GAAGC;AAC6D,CAAC,EAAG;EACpE,MAAMC,GAAG,GAAG,IAAAC,eAAM,EAAsB,IAAK,CAAC;EAC9C,MAAMC,cAAc,GAAGA,CAAA,KAAM;IAC5BF,GAAG,CAACG,OAAO,EAAEC,KAAK,CAAC,CAAC;EACrB,CAAC;EAED,MAAMC,EAAE,GAAGP,MAAM,GAChBA,MAAM,CAAE;IAAEI;EAAe,CAAE,CAAC,gBAE5B,IAAAX,WAAA,CAAAe,GAAA,EAACjB,OAAA,CAAAkB,OAAM;IAACV,OAAO,EAAGK,cAAgB;IAAA,GAAMH,KAAK;IAAAL,QAAA,EAC1CA;EAAQ,CACH,CACR;EAED,oBACC,IAAAH,WAAA,CAAAiB,IAAA;IAAKC,SAAS,EAAC,6BAA6B;IAAAf,QAAA,GACzCW,EAAE,eACJ,IAAAd,WAAA,CAAAe,GAAA;MACCI,IAAI,EAAC,MAAM;MACXV,GAAG,EAAGA,GAAK;MACXL,QAAQ,EAAGA,QAAU;MACrBgB,KAAK,EAAG;QAAEC,OAAO,EAAE;MAAO,CAAG;MAC7BnB,MAAM,EAAGA,MAAQ;MACjBG,QAAQ,EAAGA,QAAU;MACrBC,OAAO,EAAGA,OAAS;MACnB,eAAY;IAAwB,CACpC,CAAC;EAAA,CACE,CAAC;AAER;AAAC,IAAAgB,QAAA,GAAAC,OAAA,CAAAP,OAAA,GAEcf,cAAc","ignoreList":[]}
1
+ {"version":3,"names":["_element","require","_button","_interopRequireDefault","_jsxRuntime","FormFileUpload","accept","children","multiple","onChange","onClick","render","props","ref","useRef","openFileDialog","current","click","ui","jsx","default","compatAccept","includes","jsxs","className","type","style","display","_default","exports"],"sources":["@wordpress/components/src/form-file-upload/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { WordPressComponentProps } from '../context';\nimport type { FormFileUploadProps } from './types';\n\n/**\n * FormFileUpload is a component that allows users to select files from their local device.\n *\n * ```jsx\n * import { FormFileUpload } from '@wordpress/components';\n *\n * const MyFormFileUpload = () => (\n * <FormFileUpload\n * accept=\"image/*\"\n * onChange={ ( event ) => console.log( event.currentTarget.files ) }\n * >\n * Upload\n * </FormFileUpload>\n * );\n * ```\n */\nexport function FormFileUpload( {\n\taccept,\n\tchildren,\n\tmultiple = false,\n\tonChange,\n\tonClick,\n\trender,\n\t...props\n}: WordPressComponentProps< FormFileUploadProps, 'button', false > ) {\n\tconst ref = useRef< HTMLInputElement >( null );\n\tconst openFileDialog = () => {\n\t\tref.current?.click();\n\t};\n\n\tconst ui = render ? (\n\t\trender( { openFileDialog } )\n\t) : (\n\t\t<Button onClick={ openFileDialog } { ...props }>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n\t// @todo: Temporary fix a bug that prevents Chromium browsers from selecting \".heic\" files\n\t// from the file upload. See https://core.trac.wordpress.org/ticket/62268#comment:4.\n\t// This can be removed once the Chromium fix is in the stable channel.\n\tconst compatAccept = !! accept?.includes( 'image/*' )\n\t\t? `${ accept }, image/heic, image/heif`\n\t\t: accept;\n\n\treturn (\n\t\t<div className=\"components-form-file-upload\">\n\t\t\t{ ui }\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\tref={ ref }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\taccept={ compatAccept }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tdata-testid=\"form-file-upload-input\"\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default FormFileUpload;\n"],"mappings":";;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,OAAA,GAAAC,sBAAA,CAAAF,OAAA;AAA+B,IAAAG,WAAA,GAAAH,OAAA;AAR/B;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASI,cAAcA,CAAE;EAC/BC,MAAM;EACNC,QAAQ;EACRC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,OAAO;EACPC,MAAM;EACN,GAAGC;AAC6D,CAAC,EAAG;EACpE,MAAMC,GAAG,GAAG,IAAAC,eAAM,EAAsB,IAAK,CAAC;EAC9C,MAAMC,cAAc,GAAGA,CAAA,KAAM;IAC5BF,GAAG,CAACG,OAAO,EAAEC,KAAK,CAAC,CAAC;EACrB,CAAC;EAED,MAAMC,EAAE,GAAGP,MAAM,GAChBA,MAAM,CAAE;IAAEI;EAAe,CAAE,CAAC,gBAE5B,IAAAX,WAAA,CAAAe,GAAA,EAACjB,OAAA,CAAAkB,OAAM;IAACV,OAAO,EAAGK,cAAgB;IAAA,GAAMH,KAAK;IAAAL,QAAA,EAC1CA;EAAQ,CACH,CACR;EACD;EACA;EACA;EACA,MAAMc,YAAY,GAAG,CAAC,CAAEf,MAAM,EAAEgB,QAAQ,CAAE,SAAU,CAAC,GACjD,GAAGhB,MAAQ,0BAAyB,GACrCA,MAAM;EAET,oBACC,IAAAF,WAAA,CAAAmB,IAAA;IAAKC,SAAS,EAAC,6BAA6B;IAAAjB,QAAA,GACzCW,EAAE,eACJ,IAAAd,WAAA,CAAAe,GAAA;MACCM,IAAI,EAAC,MAAM;MACXZ,GAAG,EAAGA,GAAK;MACXL,QAAQ,EAAGA,QAAU;MACrBkB,KAAK,EAAG;QAAEC,OAAO,EAAE;MAAO,CAAG;MAC7BrB,MAAM,EAAGe,YAAc;MACvBZ,QAAQ,EAAGA,QAAU;MACrBC,OAAO,EAAGA,OAAS;MACnB,eAAY;IAAwB,CACpC,CAAC;EAAA,CACE,CAAC;AAER;AAAC,IAAAkB,QAAA,GAAAC,OAAA,CAAAT,OAAA,GAEcf,cAAc","ignoreList":[]}
@@ -45,6 +45,10 @@ export function FormFileUpload({
45
45
  ...props,
46
46
  children: children
47
47
  });
48
+ // @todo: Temporary fix a bug that prevents Chromium browsers from selecting ".heic" files
49
+ // from the file upload. See https://core.trac.wordpress.org/ticket/62268#comment:4.
50
+ // This can be removed once the Chromium fix is in the stable channel.
51
+ const compatAccept = !!accept?.includes('image/*') ? `${accept}, image/heic, image/heif` : accept;
48
52
  return /*#__PURE__*/_jsxs("div", {
49
53
  className: "components-form-file-upload",
50
54
  children: [ui, /*#__PURE__*/_jsx("input", {
@@ -54,7 +58,7 @@ export function FormFileUpload({
54
58
  style: {
55
59
  display: 'none'
56
60
  },
57
- accept: accept,
61
+ accept: compatAccept,
58
62
  onChange: onChange,
59
63
  onClick: onClick,
60
64
  "data-testid": "form-file-upload-input"
@@ -1 +1 @@
1
- {"version":3,"names":["useRef","Button","jsx","_jsx","jsxs","_jsxs","FormFileUpload","accept","children","multiple","onChange","onClick","render","props","ref","openFileDialog","current","click","ui","className","type","style","display"],"sources":["@wordpress/components/src/form-file-upload/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { WordPressComponentProps } from '../context';\nimport type { FormFileUploadProps } from './types';\n\n/**\n * FormFileUpload is a component that allows users to select files from their local device.\n *\n * ```jsx\n * import { FormFileUpload } from '@wordpress/components';\n *\n * const MyFormFileUpload = () => (\n * <FormFileUpload\n * accept=\"image/*\"\n * onChange={ ( event ) => console.log( event.currentTarget.files ) }\n * >\n * Upload\n * </FormFileUpload>\n * );\n * ```\n */\nexport function FormFileUpload( {\n\taccept,\n\tchildren,\n\tmultiple = false,\n\tonChange,\n\tonClick,\n\trender,\n\t...props\n}: WordPressComponentProps< FormFileUploadProps, 'button', false > ) {\n\tconst ref = useRef< HTMLInputElement >( null );\n\tconst openFileDialog = () => {\n\t\tref.current?.click();\n\t};\n\n\tconst ui = render ? (\n\t\trender( { openFileDialog } )\n\t) : (\n\t\t<Button onClick={ openFileDialog } { ...props }>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n\n\treturn (\n\t\t<div className=\"components-form-file-upload\">\n\t\t\t{ ui }\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\tref={ ref }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\taccept={ accept }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tdata-testid=\"form-file-upload-input\"\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default FormFileUpload;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,OAAOC,MAAM,MAAM,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAI/B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAAE;EAC/BC,MAAM;EACNC,QAAQ;EACRC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,OAAO;EACPC,MAAM;EACN,GAAGC;AAC6D,CAAC,EAAG;EACpE,MAAMC,GAAG,GAAGd,MAAM,CAAsB,IAAK,CAAC;EAC9C,MAAMe,cAAc,GAAGA,CAAA,KAAM;IAC5BD,GAAG,CAACE,OAAO,EAAEC,KAAK,CAAC,CAAC;EACrB,CAAC;EAED,MAAMC,EAAE,GAAGN,MAAM,GAChBA,MAAM,CAAE;IAAEG;EAAe,CAAE,CAAC,gBAE5BZ,IAAA,CAACF,MAAM;IAACU,OAAO,EAAGI,cAAgB;IAAA,GAAMF,KAAK;IAAAL,QAAA,EAC1CA;EAAQ,CACH,CACR;EAED,oBACCH,KAAA;IAAKc,SAAS,EAAC,6BAA6B;IAAAX,QAAA,GACzCU,EAAE,eACJf,IAAA;MACCiB,IAAI,EAAC,MAAM;MACXN,GAAG,EAAGA,GAAK;MACXL,QAAQ,EAAGA,QAAU;MACrBY,KAAK,EAAG;QAAEC,OAAO,EAAE;MAAO,CAAG;MAC7Bf,MAAM,EAAGA,MAAQ;MACjBG,QAAQ,EAAGA,QAAU;MACrBC,OAAO,EAAGA,OAAS;MACnB,eAAY;IAAwB,CACpC,CAAC;EAAA,CACE,CAAC;AAER;AAEA,eAAeL,cAAc","ignoreList":[]}
1
+ {"version":3,"names":["useRef","Button","jsx","_jsx","jsxs","_jsxs","FormFileUpload","accept","children","multiple","onChange","onClick","render","props","ref","openFileDialog","current","click","ui","compatAccept","includes","className","type","style","display"],"sources":["@wordpress/components/src/form-file-upload/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { WordPressComponentProps } from '../context';\nimport type { FormFileUploadProps } from './types';\n\n/**\n * FormFileUpload is a component that allows users to select files from their local device.\n *\n * ```jsx\n * import { FormFileUpload } from '@wordpress/components';\n *\n * const MyFormFileUpload = () => (\n * <FormFileUpload\n * accept=\"image/*\"\n * onChange={ ( event ) => console.log( event.currentTarget.files ) }\n * >\n * Upload\n * </FormFileUpload>\n * );\n * ```\n */\nexport function FormFileUpload( {\n\taccept,\n\tchildren,\n\tmultiple = false,\n\tonChange,\n\tonClick,\n\trender,\n\t...props\n}: WordPressComponentProps< FormFileUploadProps, 'button', false > ) {\n\tconst ref = useRef< HTMLInputElement >( null );\n\tconst openFileDialog = () => {\n\t\tref.current?.click();\n\t};\n\n\tconst ui = render ? (\n\t\trender( { openFileDialog } )\n\t) : (\n\t\t<Button onClick={ openFileDialog } { ...props }>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n\t// @todo: Temporary fix a bug that prevents Chromium browsers from selecting \".heic\" files\n\t// from the file upload. See https://core.trac.wordpress.org/ticket/62268#comment:4.\n\t// This can be removed once the Chromium fix is in the stable channel.\n\tconst compatAccept = !! accept?.includes( 'image/*' )\n\t\t? `${ accept }, image/heic, image/heif`\n\t\t: accept;\n\n\treturn (\n\t\t<div className=\"components-form-file-upload\">\n\t\t\t{ ui }\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\tref={ ref }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\taccept={ compatAccept }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tdata-testid=\"form-file-upload-input\"\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default FormFileUpload;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,OAAOC,MAAM,MAAM,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAI/B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAAE;EAC/BC,MAAM;EACNC,QAAQ;EACRC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,OAAO;EACPC,MAAM;EACN,GAAGC;AAC6D,CAAC,EAAG;EACpE,MAAMC,GAAG,GAAGd,MAAM,CAAsB,IAAK,CAAC;EAC9C,MAAMe,cAAc,GAAGA,CAAA,KAAM;IAC5BD,GAAG,CAACE,OAAO,EAAEC,KAAK,CAAC,CAAC;EACrB,CAAC;EAED,MAAMC,EAAE,GAAGN,MAAM,GAChBA,MAAM,CAAE;IAAEG;EAAe,CAAE,CAAC,gBAE5BZ,IAAA,CAACF,MAAM;IAACU,OAAO,EAAGI,cAAgB;IAAA,GAAMF,KAAK;IAAAL,QAAA,EAC1CA;EAAQ,CACH,CACR;EACD;EACA;EACA;EACA,MAAMW,YAAY,GAAG,CAAC,CAAEZ,MAAM,EAAEa,QAAQ,CAAE,SAAU,CAAC,GACjD,GAAGb,MAAQ,0BAAyB,GACrCA,MAAM;EAET,oBACCF,KAAA;IAAKgB,SAAS,EAAC,6BAA6B;IAAAb,QAAA,GACzCU,EAAE,eACJf,IAAA;MACCmB,IAAI,EAAC,MAAM;MACXR,GAAG,EAAGA,GAAK;MACXL,QAAQ,EAAGA,QAAU;MACrBc,KAAK,EAAG;QAAEC,OAAO,EAAE;MAAO,CAAG;MAC7BjB,MAAM,EAAGY,YAAc;MACvBT,QAAQ,EAAGA,QAAU;MACrBC,OAAO,EAAGA,OAAS;MACnB,eAAY;IAAwB,CACpC,CAAC;EAAA,CACE,CAAC;AAER;AAEA,eAAeL,cAAc","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/form-file-upload/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,cAAc,CAAE,EAC/B,MAAM,EACN,QAAQ,EACR,QAAgB,EAChB,QAAQ,EACR,OAAO,EACP,MAAM,EACN,GAAG,KAAK,EACR,EAAE,uBAAuB,CAAE,mBAAmB,EAAE,QAAQ,EAAE,KAAK,CAAE,+BA6BjE;AAED,eAAe,cAAc,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/form-file-upload/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,cAAc,CAAE,EAC/B,MAAM,EACN,QAAQ,EACR,QAAgB,EAChB,QAAQ,EACR,OAAO,EACP,MAAM,EACN,GAAG,KAAK,EACR,EAAE,uBAAuB,CAAE,mBAAmB,EAAE,QAAQ,EAAE,KAAK,CAAE,+BAmCjE;AAED,eAAe,cAAc,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/components",
3
- "version": "28.8.9",
3
+ "version": "28.8.10",
4
4
  "description": "UI components for WordPress.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -84,5 +84,5 @@
84
84
  "publishConfig": {
85
85
  "access": "public"
86
86
  },
87
- "gitHead": "e392a1ef96df24a1e3be3b94e91670e0793b8cfe"
87
+ "gitHead": "c4e8df94ae35ecd06b2a0c86792432b484a3bbac"
88
88
  }
@@ -47,6 +47,12 @@ export function FormFileUpload( {
47
47
  { children }
48
48
  </Button>
49
49
  );
50
+ // @todo: Temporary fix a bug that prevents Chromium browsers from selecting ".heic" files
51
+ // from the file upload. See https://core.trac.wordpress.org/ticket/62268#comment:4.
52
+ // This can be removed once the Chromium fix is in the stable channel.
53
+ const compatAccept = !! accept?.includes( 'image/*' )
54
+ ? `${ accept }, image/heic, image/heif`
55
+ : accept;
50
56
 
51
57
  return (
52
58
  <div className="components-form-file-upload">
@@ -56,7 +62,7 @@ export function FormFileUpload( {
56
62
  ref={ ref }
57
63
  multiple={ multiple }
58
64
  style={ { display: 'none' } }
59
- accept={ accept }
65
+ accept={ compatAccept }
60
66
  onChange={ onChange }
61
67
  onClick={ onClick }
62
68
  data-testid="form-file-upload-input"