@elementor/wp-media 0.4.1 → 0.5.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # Change Log
2
2
 
3
+ ## 0.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - f6a4d4f: add API client and hooks for enabling unfiltered files upload
8
+
9
+ ## 0.4.2
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies [571ff75]
14
+ - @elementor/utils@0.4.0
15
+
3
16
  ## 0.4.1
4
17
 
5
18
  ### Patch Changes
package/dist/index.d.mts CHANGED
@@ -25,16 +25,12 @@ type Attachment = {
25
25
  }>;
26
26
  };
27
27
 
28
- type ImageExtension = 'avif' | 'bmp' | 'gif' | 'ico' | 'jpe' | 'jpeg' | 'jpg' | 'png' | 'svg' | 'webp';
29
-
30
- declare function useWpMediaAttachment(id: number | null): _tanstack_react_query.UseQueryResult<Attachment | null, Error>;
31
-
32
28
  type OpenOptions = {
33
29
  mode?: 'upload' | 'browse';
34
30
  };
31
+ type MediaType = 'image' | 'svg';
35
32
  type Options = {
36
- types: Array<'image' | 'image/svg+xml'>;
37
- allowedExtensions?: ImageExtension[];
33
+ mediaTypes: MediaType[];
38
34
  title?: string;
39
35
  } & ({
40
36
  multiple: true;
@@ -49,8 +45,10 @@ declare function useWpMediaFrame(options: Options): {
49
45
  open: (openOptions?: OpenOptions) => void;
50
46
  };
51
47
 
48
+ declare function useWpMediaAttachment(id: number | null): _tanstack_react_query.UseQueryResult<Attachment | null, Error>;
49
+
52
50
  declare function getMediaAttachment({ id }: {
53
51
  id: number | null;
54
52
  }): Promise<Attachment | null>;
55
53
 
56
- export { type Attachment, type ImageExtension, getMediaAttachment, useWpMediaAttachment, useWpMediaFrame };
54
+ export { type Attachment, type MediaType, type OpenOptions, getMediaAttachment, useWpMediaAttachment, useWpMediaFrame };
package/dist/index.d.ts CHANGED
@@ -25,16 +25,12 @@ type Attachment = {
25
25
  }>;
26
26
  };
27
27
 
28
- type ImageExtension = 'avif' | 'bmp' | 'gif' | 'ico' | 'jpe' | 'jpeg' | 'jpg' | 'png' | 'svg' | 'webp';
29
-
30
- declare function useWpMediaAttachment(id: number | null): _tanstack_react_query.UseQueryResult<Attachment | null, Error>;
31
-
32
28
  type OpenOptions = {
33
29
  mode?: 'upload' | 'browse';
34
30
  };
31
+ type MediaType = 'image' | 'svg';
35
32
  type Options = {
36
- types: Array<'image' | 'image/svg+xml'>;
37
- allowedExtensions?: ImageExtension[];
33
+ mediaTypes: MediaType[];
38
34
  title?: string;
39
35
  } & ({
40
36
  multiple: true;
@@ -49,8 +45,10 @@ declare function useWpMediaFrame(options: Options): {
49
45
  open: (openOptions?: OpenOptions) => void;
50
46
  };
51
47
 
48
+ declare function useWpMediaAttachment(id: number | null): _tanstack_react_query.UseQueryResult<Attachment | null, Error>;
49
+
52
50
  declare function getMediaAttachment({ id }: {
53
51
  id: number | null;
54
52
  }): Promise<Attachment | null>;
55
53
 
56
- export { type Attachment, type ImageExtension, getMediaAttachment, useWpMediaAttachment, useWpMediaFrame };
54
+ export { type Attachment, type MediaType, type OpenOptions, getMediaAttachment, useWpMediaAttachment, useWpMediaFrame };
package/dist/index.js CHANGED
@@ -105,7 +105,6 @@ var wp_plupload_settings_default = () => {
105
105
  };
106
106
 
107
107
  // src/hooks/use-wp-media-frame.ts
108
- var defaultImageExtensions = ["avif", "bmp", "gif", "ico", "jpe", "jpeg", "jpg", "png", "webp"];
109
108
  function useWpMediaFrame(options) {
110
109
  const frame = (0, import_react.useRef)();
111
110
  const open = (openOptions = {}) => {
@@ -122,27 +121,19 @@ function useWpMediaFrame(options) {
122
121
  open
123
122
  };
124
123
  }
125
- function createFrame({
126
- onSelect,
127
- multiple,
128
- types,
129
- selected,
130
- title,
131
- mode = "browse",
132
- allowedExtensions
133
- }) {
124
+ function createFrame({ onSelect, multiple, mediaTypes, selected, title, mode = "browse" }) {
134
125
  const frame = media_default()({
135
126
  title,
136
127
  multiple,
137
128
  library: {
138
- type: types
129
+ type: getMimeTypes(mediaTypes)
139
130
  }
140
131
  }).on("open", () => {
141
132
  setTypeCaller(frame);
142
133
  applyMode(frame, mode);
143
134
  applySelection(frame, selected);
144
135
  }).on("close", () => cleanupFrame(frame)).on("insert select", () => select(frame, multiple, onSelect));
145
- handleAllowedExtensions(frame, allowedExtensions);
136
+ handleExtensions(frame, mediaTypes);
146
137
  return frame;
147
138
  }
148
139
  function cleanupFrame(frame) {
@@ -164,29 +155,34 @@ function select(frame, multiple, onSelect) {
164
155
  function setTypeCaller(frame) {
165
156
  frame.uploader.uploader.param("uploadTypeCaller", "elementor-wp-media-upload");
166
157
  }
167
- function handleAllowedExtensions(frame, allowedExtensions) {
158
+ function handleExtensions(frame, mediaTypes) {
168
159
  const defaultExtensions = wp_plupload_settings_default().defaults.filters.mime_types?.[0]?.extensions;
169
160
  frame.on("ready", () => {
170
- wp_plupload_settings_default().defaults.filters.mime_types = [
171
- { extensions: getAllowedExtensions(allowedExtensions) }
172
- ];
161
+ wp_plupload_settings_default().defaults.filters.mime_types = [{ extensions: getExtensions(mediaTypes) }];
173
162
  });
174
163
  frame.on("close", () => {
175
164
  wp_plupload_settings_default().defaults.filters.mime_types = defaultExtensions ? [{ extensions: defaultExtensions }] : [];
176
165
  });
177
166
  }
178
- function getAllowedExtensions(allowedExtensions) {
179
- let extensions = [...defaultImageExtensions];
180
- if (allowedExtensions) {
181
- extensions = allowedExtensions;
182
- } else if (isUnfilteredFilesUploadEnabled()) {
183
- extensions.push("svg");
184
- }
185
- return extensions.join(",");
167
+ var imageExtensions = ["avif", "bmp", "gif", "ico", "jpe", "jpeg", "jpg", "png", "webp"];
168
+ function getMimeTypes(mediaTypes) {
169
+ const mimeTypesPerType = {
170
+ image: imageExtensions.map((extension) => `image/${extension}`),
171
+ svg: ["image/svg+xml"]
172
+ };
173
+ return mediaTypes.reduce((prev, currentType) => {
174
+ return prev.concat(mimeTypesPerType[currentType]);
175
+ }, []);
186
176
  }
187
- function isUnfilteredFilesUploadEnabled() {
188
- const extendedWindow = window;
189
- return Boolean(extendedWindow.elementorCommon.config.filesUpload.unfilteredFiles);
177
+ function getExtensions(mediaTypes) {
178
+ const extensionsPerType = {
179
+ image: imageExtensions,
180
+ svg: ["svg"]
181
+ };
182
+ const extensions = mediaTypes.reduce((prev, currentType) => {
183
+ return prev.concat(extensionsPerType[currentType]);
184
+ }, []);
185
+ return extensions.join(",");
190
186
  }
191
187
  // Annotate the CommonJS export names for ESM import in node:
192
188
  0 && (module.exports = {
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/hooks/use-wp-media-attachment.ts","../src/errors.ts","../src/media.ts","../src/normalize.ts","../src/get-media-attachment.ts","../src/hooks/use-wp-media-frame.ts","../src/wp-plupload-settings.ts"],"sourcesContent":["export type { Attachment } from './types/attachment';\nexport type { ImageExtension } from './types/image';\n\nexport { default as useWpMediaAttachment } from './hooks/use-wp-media-attachment';\nexport { default as useWpMediaFrame } from './hooks/use-wp-media-frame';\n\nexport { getMediaAttachment } from './get-media-attachment';\n","import { useQuery } from '@elementor/query';\n\nimport { getMediaAttachment } from '../get-media-attachment';\n\nexport default function useWpMediaAttachment( id: number | null ) {\n\treturn useQuery( {\n\t\tqueryKey: [ 'wp-attachment', id ],\n\t\tqueryFn: () => getMediaAttachment( { id } ),\n\t\tenabled: !! id,\n\t} );\n}\n","import { createError } from '@elementor/utils';\n\nexport const WpMediaNotAvailableError = createError( {\n\tcode: 'wp_media_not_available',\n\tmessage: '`wp.media` is not available, make sure the `media-models` handle is set in the dependencies array',\n} );\n\nexport const WpPluploadSettingsNotAvailableError = createError( {\n\tcode: 'wp_plupload_settings_not_available',\n\tmessage: '`_wpPluploadSettings` is not available, make sure a wp media uploader is open',\n} );\n","import { WpMediaNotAvailableError } from './errors';\nimport { type WpMediaWindow } from './types/wp-media';\n\nconst wpMediaWindow = window as unknown as WpMediaWindow;\n\nexport default () => {\n\tif ( ! wpMediaWindow.wp?.media ) {\n\t\tthrow new WpMediaNotAvailableError();\n\t}\n\n\treturn wpMediaWindow.wp.media;\n};\n","import { type Attachment } from './types/attachment';\nimport { type WpAttachmentJSON } from './types/wp-media';\n\nexport default function normalize( attachment: WpAttachmentJSON ): Attachment {\n\tconst { filesizeInBytes, filesizeHumanReadable, author, authorName, ...rest } = attachment;\n\n\treturn {\n\t\t...rest,\n\t\tfilesize: {\n\t\t\tinBytes: filesizeInBytes,\n\t\t\thumanReadable: filesizeHumanReadable,\n\t\t},\n\t\tauthor: {\n\t\t\tid: parseInt( author ),\n\t\t\tname: authorName,\n\t\t},\n\t};\n}\n","import media from './media';\nimport normalize from './normalize';\n\nexport async function getMediaAttachment( { id }: { id: number | null } ) {\n\tif ( ! id ) {\n\t\treturn null;\n\t}\n\n\tconst model = media().attachment( id );\n\tconst wpAttachment = model.toJSON();\n\n\tconst isFetched = 'url' in wpAttachment;\n\n\tif ( isFetched ) {\n\t\treturn normalize( wpAttachment );\n\t}\n\n\ttry {\n\t\treturn normalize( await model.fetch() );\n\t} catch {\n\t\treturn null;\n\t}\n}\n","import { useEffect, useRef } from 'react';\n\nimport media from '../media';\nimport normalize from '../normalize';\nimport { type Attachment } from '../types/attachment';\nimport { type ElementorCommonWindow } from '../types/elementor-common';\nimport { type ImageExtension } from '../types/image';\nimport { type MediaFrame } from '../types/wp-media';\nimport wpPluploadSettings from '../wp-plupload-settings';\n\ntype OpenOptions = {\n\tmode?: 'upload' | 'browse';\n};\n\ntype Options = {\n\ttypes: Array< 'image' | 'image/svg+xml' >;\n\tallowedExtensions?: ImageExtension[];\n\ttitle?: string;\n} & (\n\t| {\n\t\t\tmultiple: true;\n\t\t\tselected: Array< number | null >;\n\t\t\tonSelect: ( val: Attachment[] ) => void;\n\t }\n\t| {\n\t\t\tmultiple: false;\n\t\t\tselected: number | null;\n\t\t\tonSelect: ( val: Attachment ) => void;\n\t }\n);\n\nconst defaultImageExtensions: ImageExtension[] = [ 'avif', 'bmp', 'gif', 'ico', 'jpe', 'jpeg', 'jpg', 'png', 'webp' ];\n\nexport default function useWpMediaFrame( options: Options ) {\n\tconst frame = useRef< MediaFrame >();\n\n\tconst open = ( openOptions: OpenOptions = {} ) => {\n\t\tcleanupFrame( frame.current );\n\n\t\tframe.current = createFrame( { ...options, ...openOptions } );\n\n\t\tframe.current?.open();\n\t};\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanupFrame( frame.current );\n\t\t};\n\t}, [] );\n\n\treturn {\n\t\topen,\n\t};\n}\n\nfunction createFrame( {\n\tonSelect,\n\tmultiple,\n\ttypes,\n\tselected,\n\ttitle,\n\tmode = 'browse',\n\tallowedExtensions,\n}: Options & OpenOptions ) {\n\tconst frame: MediaFrame = media()( {\n\t\ttitle,\n\t\tmultiple,\n\t\tlibrary: {\n\t\t\ttype: types,\n\t\t},\n\t} )\n\t\t.on( 'open', () => {\n\t\t\tsetTypeCaller( frame );\n\t\t\tapplyMode( frame, mode );\n\t\t\tapplySelection( frame, selected );\n\t\t} )\n\t\t.on( 'close', () => cleanupFrame( frame ) )\n\t\t.on( 'insert select', () => select( frame, multiple, onSelect ) );\n\n\thandleAllowedExtensions( frame, allowedExtensions );\n\n\treturn frame;\n}\n\nfunction cleanupFrame( frame?: MediaFrame ) {\n\tframe?.detach();\n\tframe?.remove();\n}\n\nfunction applyMode( frame: MediaFrame, mode: OpenOptions[ 'mode' ] = 'browse' ) {\n\tframe.content.mode( mode );\n}\n\nfunction applySelection( frame: MediaFrame, selected: number | null | Array< number | null > ) {\n\tconst selectedAttachments = ( typeof selected === 'number' ? [ selected ] : selected )\n\t\t?.filter( ( id ) => !! id )\n\t\t.map( ( id ) => media().attachment( id as number ) );\n\n\tframe\n\t\t.state()\n\t\t.get( 'selection' )\n\t\t.set( selectedAttachments || [] );\n}\n\nfunction select( frame: MediaFrame, multiple: boolean, onSelect: Options[ 'onSelect' ] ) {\n\tconst attachments = frame.state().get( 'selection' ).toJSON().map( normalize );\n\n\tconst onSelectFn = onSelect as ( val: Attachment | Attachment[] ) => void;\n\n\tonSelectFn( multiple ? attachments : attachments[ 0 ] );\n}\n\nfunction setTypeCaller( frame: MediaFrame ) {\n\tframe.uploader.uploader.param( 'uploadTypeCaller', 'elementor-wp-media-upload' );\n}\n\nfunction handleAllowedExtensions( frame: MediaFrame, allowedExtensions?: ImageExtension[] ) {\n\tconst defaultExtensions = wpPluploadSettings().defaults.filters.mime_types?.[ 0 ]?.extensions;\n\n\t// Set the allowed extensions\n\tframe.on( 'ready', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = [\n\t\t\t{ extensions: getAllowedExtensions( allowedExtensions ) },\n\t\t];\n\t} );\n\n\t// Restore default upload extensions\n\tframe.on( 'close', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = defaultExtensions\n\t\t\t? [ { extensions: defaultExtensions } ]\n\t\t\t: [];\n\t} );\n}\n\nfunction getAllowedExtensions( allowedExtensions?: ImageExtension[] ) {\n\tlet extensions: ImageExtension[] = [ ...defaultImageExtensions ];\n\n\tif ( allowedExtensions ) {\n\t\textensions = allowedExtensions;\n\t} else if ( isUnfilteredFilesUploadEnabled() ) {\n\t\textensions.push( 'svg' );\n\t}\n\n\treturn extensions.join( ',' );\n}\n\nfunction isUnfilteredFilesUploadEnabled(): boolean {\n\tconst extendedWindow = window as unknown as ElementorCommonWindow;\n\n\treturn Boolean( extendedWindow.elementorCommon.config.filesUpload.unfilteredFiles );\n}\n","import { WpPluploadSettingsNotAvailableError } from './errors';\nimport { type WpPluploadSettingsWindow } from './types/plupload';\n\nconst wpPluploadSettingsWindow = window as unknown as WpPluploadSettingsWindow;\n\nexport default () => {\n\tif ( ! wpPluploadSettingsWindow._wpPluploadSettings ) {\n\t\tthrow new WpPluploadSettingsNotAvailableError();\n\t}\n\n\treturn wpPluploadSettingsWindow._wpPluploadSettings;\n};\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../src/hooks/use-wp-media-attachment.ts","../src/errors.ts","../src/media.ts","../src/normalize.ts","../src/get-media-attachment.ts","../src/hooks/use-wp-media-frame.ts","../src/wp-plupload-settings.ts"],"sourcesContent":["export type { Attachment } from './types/attachment';\nexport type { OpenOptions, MediaType } from './hooks/use-wp-media-frame';\n\nexport { default as useWpMediaAttachment } from './hooks/use-wp-media-attachment';\nexport { default as useWpMediaFrame } from './hooks/use-wp-media-frame';\n\nexport { getMediaAttachment } from './get-media-attachment';\n","import { useQuery } from '@elementor/query';\n\nimport { getMediaAttachment } from '../get-media-attachment';\n\nexport default function useWpMediaAttachment( id: number | null ) {\n\treturn useQuery( {\n\t\tqueryKey: [ 'wp-attachment', id ],\n\t\tqueryFn: () => getMediaAttachment( { id } ),\n\t\tenabled: !! id,\n\t} );\n}\n","import { createError } from '@elementor/utils';\n\nexport const WpMediaNotAvailableError = createError( {\n\tcode: 'wp_media_not_available',\n\tmessage: '`wp.media` is not available, make sure the `media-models` handle is set in the dependencies array',\n} );\n\nexport const WpPluploadSettingsNotAvailableError = createError( {\n\tcode: 'wp_plupload_settings_not_available',\n\tmessage: '`_wpPluploadSettings` is not available, make sure a wp media uploader is open',\n} );\n","import { WpMediaNotAvailableError } from './errors';\nimport { type WpMediaWindow } from './types/wp-media';\n\nconst wpMediaWindow = window as unknown as WpMediaWindow;\n\nexport default () => {\n\tif ( ! wpMediaWindow.wp?.media ) {\n\t\tthrow new WpMediaNotAvailableError();\n\t}\n\n\treturn wpMediaWindow.wp.media;\n};\n","import { type Attachment } from './types/attachment';\nimport { type WpAttachmentJSON } from './types/wp-media';\n\nexport default function normalize( attachment: WpAttachmentJSON ): Attachment {\n\tconst { filesizeInBytes, filesizeHumanReadable, author, authorName, ...rest } = attachment;\n\n\treturn {\n\t\t...rest,\n\t\tfilesize: {\n\t\t\tinBytes: filesizeInBytes,\n\t\t\thumanReadable: filesizeHumanReadable,\n\t\t},\n\t\tauthor: {\n\t\t\tid: parseInt( author ),\n\t\t\tname: authorName,\n\t\t},\n\t};\n}\n","import media from './media';\nimport normalize from './normalize';\n\nexport async function getMediaAttachment( { id }: { id: number | null } ) {\n\tif ( ! id ) {\n\t\treturn null;\n\t}\n\n\tconst model = media().attachment( id );\n\tconst wpAttachment = model.toJSON();\n\n\tconst isFetched = 'url' in wpAttachment;\n\n\tif ( isFetched ) {\n\t\treturn normalize( wpAttachment );\n\t}\n\n\ttry {\n\t\treturn normalize( await model.fetch() );\n\t} catch {\n\t\treturn null;\n\t}\n}\n","import { useEffect, useRef } from 'react';\n\nimport media from '../media';\nimport normalize from '../normalize';\nimport { type Attachment } from '../types/attachment';\nimport { type MediaFrame } from '../types/wp-media';\nimport wpPluploadSettings from '../wp-plupload-settings';\n\nexport type OpenOptions = {\n\tmode?: 'upload' | 'browse';\n};\n\nexport type MediaType = 'image' | 'svg';\n\ntype Options = {\n\tmediaTypes: MediaType[];\n\ttitle?: string;\n} & (\n\t| {\n\t\t\tmultiple: true;\n\t\t\tselected: Array< number | null >;\n\t\t\tonSelect: ( val: Attachment[] ) => void;\n\t }\n\t| {\n\t\t\tmultiple: false;\n\t\t\tselected: number | null;\n\t\t\tonSelect: ( val: Attachment ) => void;\n\t }\n);\n\nexport default function useWpMediaFrame( options: Options ) {\n\tconst frame = useRef< MediaFrame >();\n\n\tconst open = ( openOptions: OpenOptions = {} ) => {\n\t\tcleanupFrame( frame.current );\n\n\t\tframe.current = createFrame( { ...options, ...openOptions } );\n\n\t\tframe.current?.open();\n\t};\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanupFrame( frame.current );\n\t\t};\n\t}, [] );\n\n\treturn {\n\t\topen,\n\t};\n}\n\nfunction createFrame( { onSelect, multiple, mediaTypes, selected, title, mode = 'browse' }: Options & OpenOptions ) {\n\tconst frame: MediaFrame = media()( {\n\t\ttitle,\n\t\tmultiple,\n\t\tlibrary: {\n\t\t\ttype: getMimeTypes( mediaTypes ),\n\t\t},\n\t} )\n\t\t.on( 'open', () => {\n\t\t\tsetTypeCaller( frame );\n\t\t\tapplyMode( frame, mode );\n\t\t\tapplySelection( frame, selected );\n\t\t} )\n\t\t.on( 'close', () => cleanupFrame( frame ) )\n\t\t.on( 'insert select', () => select( frame, multiple, onSelect ) );\n\n\thandleExtensions( frame, mediaTypes );\n\n\treturn frame;\n}\n\nfunction cleanupFrame( frame?: MediaFrame ) {\n\tframe?.detach();\n\tframe?.remove();\n}\n\nfunction applyMode( frame: MediaFrame, mode: OpenOptions[ 'mode' ] = 'browse' ) {\n\tframe.content.mode( mode );\n}\n\nfunction applySelection( frame: MediaFrame, selected: number | null | Array< number | null > ) {\n\tconst selectedAttachments = ( typeof selected === 'number' ? [ selected ] : selected )\n\t\t?.filter( ( id ) => !! id )\n\t\t.map( ( id ) => media().attachment( id as number ) );\n\n\tframe\n\t\t.state()\n\t\t.get( 'selection' )\n\t\t.set( selectedAttachments || [] );\n}\n\nfunction select( frame: MediaFrame, multiple: boolean, onSelect: Options[ 'onSelect' ] ) {\n\tconst attachments = frame.state().get( 'selection' ).toJSON().map( normalize );\n\n\tconst onSelectFn = onSelect as ( val: Attachment | Attachment[] ) => void;\n\n\tonSelectFn( multiple ? attachments : attachments[ 0 ] );\n}\n\nfunction setTypeCaller( frame: MediaFrame ) {\n\tframe.uploader.uploader.param( 'uploadTypeCaller', 'elementor-wp-media-upload' );\n}\n\nfunction handleExtensions( frame: MediaFrame, mediaTypes: MediaType[] ) {\n\tconst defaultExtensions = wpPluploadSettings().defaults.filters.mime_types?.[ 0 ]?.extensions;\n\n\t// Set extensions by media types\n\tframe.on( 'ready', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = [ { extensions: getExtensions( mediaTypes ) } ];\n\t} );\n\n\t// Restore default upload extensions\n\tframe.on( 'close', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = defaultExtensions\n\t\t\t? [ { extensions: defaultExtensions } ]\n\t\t\t: [];\n\t} );\n}\n\nconst imageExtensions = [ 'avif', 'bmp', 'gif', 'ico', 'jpe', 'jpeg', 'jpg', 'png', 'webp' ];\n\nfunction getMimeTypes( mediaTypes: MediaType[] ) {\n\tconst mimeTypesPerType: Record< MediaType, string[] > = {\n\t\timage: imageExtensions.map( ( extension ) => `image/${ extension }` ),\n\t\tsvg: [ 'image/svg+xml' ],\n\t};\n\n\treturn mediaTypes.reduce( ( prev, currentType ) => {\n\t\treturn prev.concat( mimeTypesPerType[ currentType ] );\n\t}, [] as string[] );\n}\n\nfunction getExtensions( mediaTypes: MediaType[] ) {\n\tconst extensionsPerType: Record< MediaType, string[] > = {\n\t\timage: imageExtensions,\n\t\tsvg: [ 'svg' ],\n\t};\n\n\tconst extensions = mediaTypes.reduce( ( prev, currentType ) => {\n\t\treturn prev.concat( extensionsPerType[ currentType ] );\n\t}, [] as string[] );\n\n\treturn extensions.join( ',' );\n}\n","import { WpPluploadSettingsNotAvailableError } from './errors';\nimport { type WpPluploadSettingsWindow } from './types/plupload';\n\nconst wpPluploadSettingsWindow = window as unknown as WpPluploadSettingsWindow;\n\nexport default () => {\n\tif ( ! wpPluploadSettingsWindow._wpPluploadSettings ) {\n\t\tthrow new WpPluploadSettingsNotAvailableError();\n\t}\n\n\treturn wpPluploadSettingsWindow._wpPluploadSettings;\n};\n"],"mappings":"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","names":[]}
package/dist/index.mjs CHANGED
@@ -77,7 +77,6 @@ var wp_plupload_settings_default = () => {
77
77
  };
78
78
 
79
79
  // src/hooks/use-wp-media-frame.ts
80
- var defaultImageExtensions = ["avif", "bmp", "gif", "ico", "jpe", "jpeg", "jpg", "png", "webp"];
81
80
  function useWpMediaFrame(options) {
82
81
  const frame = useRef();
83
82
  const open = (openOptions = {}) => {
@@ -94,27 +93,19 @@ function useWpMediaFrame(options) {
94
93
  open
95
94
  };
96
95
  }
97
- function createFrame({
98
- onSelect,
99
- multiple,
100
- types,
101
- selected,
102
- title,
103
- mode = "browse",
104
- allowedExtensions
105
- }) {
96
+ function createFrame({ onSelect, multiple, mediaTypes, selected, title, mode = "browse" }) {
106
97
  const frame = media_default()({
107
98
  title,
108
99
  multiple,
109
100
  library: {
110
- type: types
101
+ type: getMimeTypes(mediaTypes)
111
102
  }
112
103
  }).on("open", () => {
113
104
  setTypeCaller(frame);
114
105
  applyMode(frame, mode);
115
106
  applySelection(frame, selected);
116
107
  }).on("close", () => cleanupFrame(frame)).on("insert select", () => select(frame, multiple, onSelect));
117
- handleAllowedExtensions(frame, allowedExtensions);
108
+ handleExtensions(frame, mediaTypes);
118
109
  return frame;
119
110
  }
120
111
  function cleanupFrame(frame) {
@@ -136,29 +127,34 @@ function select(frame, multiple, onSelect) {
136
127
  function setTypeCaller(frame) {
137
128
  frame.uploader.uploader.param("uploadTypeCaller", "elementor-wp-media-upload");
138
129
  }
139
- function handleAllowedExtensions(frame, allowedExtensions) {
130
+ function handleExtensions(frame, mediaTypes) {
140
131
  const defaultExtensions = wp_plupload_settings_default().defaults.filters.mime_types?.[0]?.extensions;
141
132
  frame.on("ready", () => {
142
- wp_plupload_settings_default().defaults.filters.mime_types = [
143
- { extensions: getAllowedExtensions(allowedExtensions) }
144
- ];
133
+ wp_plupload_settings_default().defaults.filters.mime_types = [{ extensions: getExtensions(mediaTypes) }];
145
134
  });
146
135
  frame.on("close", () => {
147
136
  wp_plupload_settings_default().defaults.filters.mime_types = defaultExtensions ? [{ extensions: defaultExtensions }] : [];
148
137
  });
149
138
  }
150
- function getAllowedExtensions(allowedExtensions) {
151
- let extensions = [...defaultImageExtensions];
152
- if (allowedExtensions) {
153
- extensions = allowedExtensions;
154
- } else if (isUnfilteredFilesUploadEnabled()) {
155
- extensions.push("svg");
156
- }
157
- return extensions.join(",");
139
+ var imageExtensions = ["avif", "bmp", "gif", "ico", "jpe", "jpeg", "jpg", "png", "webp"];
140
+ function getMimeTypes(mediaTypes) {
141
+ const mimeTypesPerType = {
142
+ image: imageExtensions.map((extension) => `image/${extension}`),
143
+ svg: ["image/svg+xml"]
144
+ };
145
+ return mediaTypes.reduce((prev, currentType) => {
146
+ return prev.concat(mimeTypesPerType[currentType]);
147
+ }, []);
158
148
  }
159
- function isUnfilteredFilesUploadEnabled() {
160
- const extendedWindow = window;
161
- return Boolean(extendedWindow.elementorCommon.config.filesUpload.unfilteredFiles);
149
+ function getExtensions(mediaTypes) {
150
+ const extensionsPerType = {
151
+ image: imageExtensions,
152
+ svg: ["svg"]
153
+ };
154
+ const extensions = mediaTypes.reduce((prev, currentType) => {
155
+ return prev.concat(extensionsPerType[currentType]);
156
+ }, []);
157
+ return extensions.join(",");
162
158
  }
163
159
  export {
164
160
  getMediaAttachment,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/hooks/use-wp-media-attachment.ts","../src/errors.ts","../src/media.ts","../src/normalize.ts","../src/get-media-attachment.ts","../src/hooks/use-wp-media-frame.ts","../src/wp-plupload-settings.ts"],"sourcesContent":["import { useQuery } from '@elementor/query';\n\nimport { getMediaAttachment } from '../get-media-attachment';\n\nexport default function useWpMediaAttachment( id: number | null ) {\n\treturn useQuery( {\n\t\tqueryKey: [ 'wp-attachment', id ],\n\t\tqueryFn: () => getMediaAttachment( { id } ),\n\t\tenabled: !! id,\n\t} );\n}\n","import { createError } from '@elementor/utils';\n\nexport const WpMediaNotAvailableError = createError( {\n\tcode: 'wp_media_not_available',\n\tmessage: '`wp.media` is not available, make sure the `media-models` handle is set in the dependencies array',\n} );\n\nexport const WpPluploadSettingsNotAvailableError = createError( {\n\tcode: 'wp_plupload_settings_not_available',\n\tmessage: '`_wpPluploadSettings` is not available, make sure a wp media uploader is open',\n} );\n","import { WpMediaNotAvailableError } from './errors';\nimport { type WpMediaWindow } from './types/wp-media';\n\nconst wpMediaWindow = window as unknown as WpMediaWindow;\n\nexport default () => {\n\tif ( ! wpMediaWindow.wp?.media ) {\n\t\tthrow new WpMediaNotAvailableError();\n\t}\n\n\treturn wpMediaWindow.wp.media;\n};\n","import { type Attachment } from './types/attachment';\nimport { type WpAttachmentJSON } from './types/wp-media';\n\nexport default function normalize( attachment: WpAttachmentJSON ): Attachment {\n\tconst { filesizeInBytes, filesizeHumanReadable, author, authorName, ...rest } = attachment;\n\n\treturn {\n\t\t...rest,\n\t\tfilesize: {\n\t\t\tinBytes: filesizeInBytes,\n\t\t\thumanReadable: filesizeHumanReadable,\n\t\t},\n\t\tauthor: {\n\t\t\tid: parseInt( author ),\n\t\t\tname: authorName,\n\t\t},\n\t};\n}\n","import media from './media';\nimport normalize from './normalize';\n\nexport async function getMediaAttachment( { id }: { id: number | null } ) {\n\tif ( ! id ) {\n\t\treturn null;\n\t}\n\n\tconst model = media().attachment( id );\n\tconst wpAttachment = model.toJSON();\n\n\tconst isFetched = 'url' in wpAttachment;\n\n\tif ( isFetched ) {\n\t\treturn normalize( wpAttachment );\n\t}\n\n\ttry {\n\t\treturn normalize( await model.fetch() );\n\t} catch {\n\t\treturn null;\n\t}\n}\n","import { useEffect, useRef } from 'react';\n\nimport media from '../media';\nimport normalize from '../normalize';\nimport { type Attachment } from '../types/attachment';\nimport { type ElementorCommonWindow } from '../types/elementor-common';\nimport { type ImageExtension } from '../types/image';\nimport { type MediaFrame } from '../types/wp-media';\nimport wpPluploadSettings from '../wp-plupload-settings';\n\ntype OpenOptions = {\n\tmode?: 'upload' | 'browse';\n};\n\ntype Options = {\n\ttypes: Array< 'image' | 'image/svg+xml' >;\n\tallowedExtensions?: ImageExtension[];\n\ttitle?: string;\n} & (\n\t| {\n\t\t\tmultiple: true;\n\t\t\tselected: Array< number | null >;\n\t\t\tonSelect: ( val: Attachment[] ) => void;\n\t }\n\t| {\n\t\t\tmultiple: false;\n\t\t\tselected: number | null;\n\t\t\tonSelect: ( val: Attachment ) => void;\n\t }\n);\n\nconst defaultImageExtensions: ImageExtension[] = [ 'avif', 'bmp', 'gif', 'ico', 'jpe', 'jpeg', 'jpg', 'png', 'webp' ];\n\nexport default function useWpMediaFrame( options: Options ) {\n\tconst frame = useRef< MediaFrame >();\n\n\tconst open = ( openOptions: OpenOptions = {} ) => {\n\t\tcleanupFrame( frame.current );\n\n\t\tframe.current = createFrame( { ...options, ...openOptions } );\n\n\t\tframe.current?.open();\n\t};\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanupFrame( frame.current );\n\t\t};\n\t}, [] );\n\n\treturn {\n\t\topen,\n\t};\n}\n\nfunction createFrame( {\n\tonSelect,\n\tmultiple,\n\ttypes,\n\tselected,\n\ttitle,\n\tmode = 'browse',\n\tallowedExtensions,\n}: Options & OpenOptions ) {\n\tconst frame: MediaFrame = media()( {\n\t\ttitle,\n\t\tmultiple,\n\t\tlibrary: {\n\t\t\ttype: types,\n\t\t},\n\t} )\n\t\t.on( 'open', () => {\n\t\t\tsetTypeCaller( frame );\n\t\t\tapplyMode( frame, mode );\n\t\t\tapplySelection( frame, selected );\n\t\t} )\n\t\t.on( 'close', () => cleanupFrame( frame ) )\n\t\t.on( 'insert select', () => select( frame, multiple, onSelect ) );\n\n\thandleAllowedExtensions( frame, allowedExtensions );\n\n\treturn frame;\n}\n\nfunction cleanupFrame( frame?: MediaFrame ) {\n\tframe?.detach();\n\tframe?.remove();\n}\n\nfunction applyMode( frame: MediaFrame, mode: OpenOptions[ 'mode' ] = 'browse' ) {\n\tframe.content.mode( mode );\n}\n\nfunction applySelection( frame: MediaFrame, selected: number | null | Array< number | null > ) {\n\tconst selectedAttachments = ( typeof selected === 'number' ? [ selected ] : selected )\n\t\t?.filter( ( id ) => !! id )\n\t\t.map( ( id ) => media().attachment( id as number ) );\n\n\tframe\n\t\t.state()\n\t\t.get( 'selection' )\n\t\t.set( selectedAttachments || [] );\n}\n\nfunction select( frame: MediaFrame, multiple: boolean, onSelect: Options[ 'onSelect' ] ) {\n\tconst attachments = frame.state().get( 'selection' ).toJSON().map( normalize );\n\n\tconst onSelectFn = onSelect as ( val: Attachment | Attachment[] ) => void;\n\n\tonSelectFn( multiple ? attachments : attachments[ 0 ] );\n}\n\nfunction setTypeCaller( frame: MediaFrame ) {\n\tframe.uploader.uploader.param( 'uploadTypeCaller', 'elementor-wp-media-upload' );\n}\n\nfunction handleAllowedExtensions( frame: MediaFrame, allowedExtensions?: ImageExtension[] ) {\n\tconst defaultExtensions = wpPluploadSettings().defaults.filters.mime_types?.[ 0 ]?.extensions;\n\n\t// Set the allowed extensions\n\tframe.on( 'ready', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = [\n\t\t\t{ extensions: getAllowedExtensions( allowedExtensions ) },\n\t\t];\n\t} );\n\n\t// Restore default upload extensions\n\tframe.on( 'close', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = defaultExtensions\n\t\t\t? [ { extensions: defaultExtensions } ]\n\t\t\t: [];\n\t} );\n}\n\nfunction getAllowedExtensions( allowedExtensions?: ImageExtension[] ) {\n\tlet extensions: ImageExtension[] = [ ...defaultImageExtensions ];\n\n\tif ( allowedExtensions ) {\n\t\textensions = allowedExtensions;\n\t} else if ( isUnfilteredFilesUploadEnabled() ) {\n\t\textensions.push( 'svg' );\n\t}\n\n\treturn extensions.join( ',' );\n}\n\nfunction isUnfilteredFilesUploadEnabled(): boolean {\n\tconst extendedWindow = window as unknown as ElementorCommonWindow;\n\n\treturn Boolean( extendedWindow.elementorCommon.config.filesUpload.unfilteredFiles );\n}\n","import { WpPluploadSettingsNotAvailableError } from './errors';\nimport { type WpPluploadSettingsWindow } from './types/plupload';\n\nconst wpPluploadSettingsWindow = window as unknown as WpPluploadSettingsWindow;\n\nexport default () => {\n\tif ( ! wpPluploadSettingsWindow._wpPluploadSettings ) {\n\t\tthrow new WpPluploadSettingsNotAvailableError();\n\t}\n\n\treturn wpPluploadSettingsWindow._wpPluploadSettings;\n};\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/hooks/use-wp-media-attachment.ts","../src/errors.ts","../src/media.ts","../src/normalize.ts","../src/get-media-attachment.ts","../src/hooks/use-wp-media-frame.ts","../src/wp-plupload-settings.ts"],"sourcesContent":["import { useQuery } from '@elementor/query';\n\nimport { getMediaAttachment } from '../get-media-attachment';\n\nexport default function useWpMediaAttachment( id: number | null ) {\n\treturn useQuery( {\n\t\tqueryKey: [ 'wp-attachment', id ],\n\t\tqueryFn: () => getMediaAttachment( { id } ),\n\t\tenabled: !! id,\n\t} );\n}\n","import { createError } from '@elementor/utils';\n\nexport const WpMediaNotAvailableError = createError( {\n\tcode: 'wp_media_not_available',\n\tmessage: '`wp.media` is not available, make sure the `media-models` handle is set in the dependencies array',\n} );\n\nexport const WpPluploadSettingsNotAvailableError = createError( {\n\tcode: 'wp_plupload_settings_not_available',\n\tmessage: '`_wpPluploadSettings` is not available, make sure a wp media uploader is open',\n} );\n","import { WpMediaNotAvailableError } from './errors';\nimport { type WpMediaWindow } from './types/wp-media';\n\nconst wpMediaWindow = window as unknown as WpMediaWindow;\n\nexport default () => {\n\tif ( ! wpMediaWindow.wp?.media ) {\n\t\tthrow new WpMediaNotAvailableError();\n\t}\n\n\treturn wpMediaWindow.wp.media;\n};\n","import { type Attachment } from './types/attachment';\nimport { type WpAttachmentJSON } from './types/wp-media';\n\nexport default function normalize( attachment: WpAttachmentJSON ): Attachment {\n\tconst { filesizeInBytes, filesizeHumanReadable, author, authorName, ...rest } = attachment;\n\n\treturn {\n\t\t...rest,\n\t\tfilesize: {\n\t\t\tinBytes: filesizeInBytes,\n\t\t\thumanReadable: filesizeHumanReadable,\n\t\t},\n\t\tauthor: {\n\t\t\tid: parseInt( author ),\n\t\t\tname: authorName,\n\t\t},\n\t};\n}\n","import media from './media';\nimport normalize from './normalize';\n\nexport async function getMediaAttachment( { id }: { id: number | null } ) {\n\tif ( ! id ) {\n\t\treturn null;\n\t}\n\n\tconst model = media().attachment( id );\n\tconst wpAttachment = model.toJSON();\n\n\tconst isFetched = 'url' in wpAttachment;\n\n\tif ( isFetched ) {\n\t\treturn normalize( wpAttachment );\n\t}\n\n\ttry {\n\t\treturn normalize( await model.fetch() );\n\t} catch {\n\t\treturn null;\n\t}\n}\n","import { useEffect, useRef } from 'react';\n\nimport media from '../media';\nimport normalize from '../normalize';\nimport { type Attachment } from '../types/attachment';\nimport { type MediaFrame } from '../types/wp-media';\nimport wpPluploadSettings from '../wp-plupload-settings';\n\nexport type OpenOptions = {\n\tmode?: 'upload' | 'browse';\n};\n\nexport type MediaType = 'image' | 'svg';\n\ntype Options = {\n\tmediaTypes: MediaType[];\n\ttitle?: string;\n} & (\n\t| {\n\t\t\tmultiple: true;\n\t\t\tselected: Array< number | null >;\n\t\t\tonSelect: ( val: Attachment[] ) => void;\n\t }\n\t| {\n\t\t\tmultiple: false;\n\t\t\tselected: number | null;\n\t\t\tonSelect: ( val: Attachment ) => void;\n\t }\n);\n\nexport default function useWpMediaFrame( options: Options ) {\n\tconst frame = useRef< MediaFrame >();\n\n\tconst open = ( openOptions: OpenOptions = {} ) => {\n\t\tcleanupFrame( frame.current );\n\n\t\tframe.current = createFrame( { ...options, ...openOptions } );\n\n\t\tframe.current?.open();\n\t};\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanupFrame( frame.current );\n\t\t};\n\t}, [] );\n\n\treturn {\n\t\topen,\n\t};\n}\n\nfunction createFrame( { onSelect, multiple, mediaTypes, selected, title, mode = 'browse' }: Options & OpenOptions ) {\n\tconst frame: MediaFrame = media()( {\n\t\ttitle,\n\t\tmultiple,\n\t\tlibrary: {\n\t\t\ttype: getMimeTypes( mediaTypes ),\n\t\t},\n\t} )\n\t\t.on( 'open', () => {\n\t\t\tsetTypeCaller( frame );\n\t\t\tapplyMode( frame, mode );\n\t\t\tapplySelection( frame, selected );\n\t\t} )\n\t\t.on( 'close', () => cleanupFrame( frame ) )\n\t\t.on( 'insert select', () => select( frame, multiple, onSelect ) );\n\n\thandleExtensions( frame, mediaTypes );\n\n\treturn frame;\n}\n\nfunction cleanupFrame( frame?: MediaFrame ) {\n\tframe?.detach();\n\tframe?.remove();\n}\n\nfunction applyMode( frame: MediaFrame, mode: OpenOptions[ 'mode' ] = 'browse' ) {\n\tframe.content.mode( mode );\n}\n\nfunction applySelection( frame: MediaFrame, selected: number | null | Array< number | null > ) {\n\tconst selectedAttachments = ( typeof selected === 'number' ? [ selected ] : selected )\n\t\t?.filter( ( id ) => !! id )\n\t\t.map( ( id ) => media().attachment( id as number ) );\n\n\tframe\n\t\t.state()\n\t\t.get( 'selection' )\n\t\t.set( selectedAttachments || [] );\n}\n\nfunction select( frame: MediaFrame, multiple: boolean, onSelect: Options[ 'onSelect' ] ) {\n\tconst attachments = frame.state().get( 'selection' ).toJSON().map( normalize );\n\n\tconst onSelectFn = onSelect as ( val: Attachment | Attachment[] ) => void;\n\n\tonSelectFn( multiple ? attachments : attachments[ 0 ] );\n}\n\nfunction setTypeCaller( frame: MediaFrame ) {\n\tframe.uploader.uploader.param( 'uploadTypeCaller', 'elementor-wp-media-upload' );\n}\n\nfunction handleExtensions( frame: MediaFrame, mediaTypes: MediaType[] ) {\n\tconst defaultExtensions = wpPluploadSettings().defaults.filters.mime_types?.[ 0 ]?.extensions;\n\n\t// Set extensions by media types\n\tframe.on( 'ready', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = [ { extensions: getExtensions( mediaTypes ) } ];\n\t} );\n\n\t// Restore default upload extensions\n\tframe.on( 'close', () => {\n\t\twpPluploadSettings().defaults.filters.mime_types = defaultExtensions\n\t\t\t? [ { extensions: defaultExtensions } ]\n\t\t\t: [];\n\t} );\n}\n\nconst imageExtensions = [ 'avif', 'bmp', 'gif', 'ico', 'jpe', 'jpeg', 'jpg', 'png', 'webp' ];\n\nfunction getMimeTypes( mediaTypes: MediaType[] ) {\n\tconst mimeTypesPerType: Record< MediaType, string[] > = {\n\t\timage: imageExtensions.map( ( extension ) => `image/${ extension }` ),\n\t\tsvg: [ 'image/svg+xml' ],\n\t};\n\n\treturn mediaTypes.reduce( ( prev, currentType ) => {\n\t\treturn prev.concat( mimeTypesPerType[ currentType ] );\n\t}, [] as string[] );\n}\n\nfunction getExtensions( mediaTypes: MediaType[] ) {\n\tconst extensionsPerType: Record< MediaType, string[] > = {\n\t\timage: imageExtensions,\n\t\tsvg: [ 'svg' ],\n\t};\n\n\tconst extensions = mediaTypes.reduce( ( prev, currentType ) => {\n\t\treturn prev.concat( extensionsPerType[ currentType ] );\n\t}, [] as string[] );\n\n\treturn extensions.join( ',' );\n}\n","import { WpPluploadSettingsNotAvailableError } from './errors';\nimport { type WpPluploadSettingsWindow } from './types/plupload';\n\nconst wpPluploadSettingsWindow = window as unknown as WpPluploadSettingsWindow;\n\nexport default () => {\n\tif ( ! wpPluploadSettingsWindow._wpPluploadSettings ) {\n\t\tthrow new WpPluploadSettingsNotAvailableError();\n\t}\n\n\treturn wpPluploadSettingsWindow._wpPluploadSettings;\n};\n"],"mappings":"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","names":[]}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@elementor/wp-media",
3
3
  "description": "An adapter for WordPress' media utils",
4
- "version": "0.4.1",
4
+ "version": "0.5.0",
5
5
  "private": false,
6
6
  "author": "Elementor Team",
7
7
  "homepage": "https://elementor.com/",
@@ -41,7 +41,7 @@
41
41
  },
42
42
  "dependencies": {
43
43
  "@elementor/query": "0.2.4",
44
- "@elementor/utils": "0.3.1"
44
+ "@elementor/utils": "0.4.0"
45
45
  },
46
46
  "peerDependencies": {
47
47
  "react": "^18.3.1"
@@ -3,18 +3,17 @@ import { useEffect, useRef } from 'react';
3
3
  import media from '../media';
4
4
  import normalize from '../normalize';
5
5
  import { type Attachment } from '../types/attachment';
6
- import { type ElementorCommonWindow } from '../types/elementor-common';
7
- import { type ImageExtension } from '../types/image';
8
6
  import { type MediaFrame } from '../types/wp-media';
9
7
  import wpPluploadSettings from '../wp-plupload-settings';
10
8
 
11
- type OpenOptions = {
9
+ export type OpenOptions = {
12
10
  mode?: 'upload' | 'browse';
13
11
  };
14
12
 
13
+ export type MediaType = 'image' | 'svg';
14
+
15
15
  type Options = {
16
- types: Array< 'image' | 'image/svg+xml' >;
17
- allowedExtensions?: ImageExtension[];
16
+ mediaTypes: MediaType[];
18
17
  title?: string;
19
18
  } & (
20
19
  | {
@@ -29,8 +28,6 @@ type Options = {
29
28
  }
30
29
  );
31
30
 
32
- const defaultImageExtensions: ImageExtension[] = [ 'avif', 'bmp', 'gif', 'ico', 'jpe', 'jpeg', 'jpg', 'png', 'webp' ];
33
-
34
31
  export default function useWpMediaFrame( options: Options ) {
35
32
  const frame = useRef< MediaFrame >();
36
33
 
@@ -53,20 +50,12 @@ export default function useWpMediaFrame( options: Options ) {
53
50
  };
54
51
  }
55
52
 
56
- function createFrame( {
57
- onSelect,
58
- multiple,
59
- types,
60
- selected,
61
- title,
62
- mode = 'browse',
63
- allowedExtensions,
64
- }: Options & OpenOptions ) {
53
+ function createFrame( { onSelect, multiple, mediaTypes, selected, title, mode = 'browse' }: Options & OpenOptions ) {
65
54
  const frame: MediaFrame = media()( {
66
55
  title,
67
56
  multiple,
68
57
  library: {
69
- type: types,
58
+ type: getMimeTypes( mediaTypes ),
70
59
  },
71
60
  } )
72
61
  .on( 'open', () => {
@@ -77,7 +66,7 @@ function createFrame( {
77
66
  .on( 'close', () => cleanupFrame( frame ) )
78
67
  .on( 'insert select', () => select( frame, multiple, onSelect ) );
79
68
 
80
- handleAllowedExtensions( frame, allowedExtensions );
69
+ handleExtensions( frame, mediaTypes );
81
70
 
82
71
  return frame;
83
72
  }
@@ -114,14 +103,12 @@ function setTypeCaller( frame: MediaFrame ) {
114
103
  frame.uploader.uploader.param( 'uploadTypeCaller', 'elementor-wp-media-upload' );
115
104
  }
116
105
 
117
- function handleAllowedExtensions( frame: MediaFrame, allowedExtensions?: ImageExtension[] ) {
106
+ function handleExtensions( frame: MediaFrame, mediaTypes: MediaType[] ) {
118
107
  const defaultExtensions = wpPluploadSettings().defaults.filters.mime_types?.[ 0 ]?.extensions;
119
108
 
120
- // Set the allowed extensions
109
+ // Set extensions by media types
121
110
  frame.on( 'ready', () => {
122
- wpPluploadSettings().defaults.filters.mime_types = [
123
- { extensions: getAllowedExtensions( allowedExtensions ) },
124
- ];
111
+ wpPluploadSettings().defaults.filters.mime_types = [ { extensions: getExtensions( mediaTypes ) } ];
125
112
  } );
126
113
 
127
114
  // Restore default upload extensions
@@ -132,20 +119,28 @@ function handleAllowedExtensions( frame: MediaFrame, allowedExtensions?: ImageEx
132
119
  } );
133
120
  }
134
121
 
135
- function getAllowedExtensions( allowedExtensions?: ImageExtension[] ) {
136
- let extensions: ImageExtension[] = [ ...defaultImageExtensions ];
122
+ const imageExtensions = [ 'avif', 'bmp', 'gif', 'ico', 'jpe', 'jpeg', 'jpg', 'png', 'webp' ];
137
123
 
138
- if ( allowedExtensions ) {
139
- extensions = allowedExtensions;
140
- } else if ( isUnfilteredFilesUploadEnabled() ) {
141
- extensions.push( 'svg' );
142
- }
124
+ function getMimeTypes( mediaTypes: MediaType[] ) {
125
+ const mimeTypesPerType: Record< MediaType, string[] > = {
126
+ image: imageExtensions.map( ( extension ) => `image/${ extension }` ),
127
+ svg: [ 'image/svg+xml' ],
128
+ };
143
129
 
144
- return extensions.join( ',' );
130
+ return mediaTypes.reduce( ( prev, currentType ) => {
131
+ return prev.concat( mimeTypesPerType[ currentType ] );
132
+ }, [] as string[] );
145
133
  }
146
134
 
147
- function isUnfilteredFilesUploadEnabled(): boolean {
148
- const extendedWindow = window as unknown as ElementorCommonWindow;
135
+ function getExtensions( mediaTypes: MediaType[] ) {
136
+ const extensionsPerType: Record< MediaType, string[] > = {
137
+ image: imageExtensions,
138
+ svg: [ 'svg' ],
139
+ };
140
+
141
+ const extensions = mediaTypes.reduce( ( prev, currentType ) => {
142
+ return prev.concat( extensionsPerType[ currentType ] );
143
+ }, [] as string[] );
149
144
 
150
- return Boolean( extendedWindow.elementorCommon.config.filesUpload.unfilteredFiles );
145
+ return extensions.join( ',' );
151
146
  }
package/src/index.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  export type { Attachment } from './types/attachment';
2
- export type { ImageExtension } from './types/image';
2
+ export type { OpenOptions, MediaType } from './hooks/use-wp-media-frame';
3
3
 
4
4
  export { default as useWpMediaAttachment } from './hooks/use-wp-media-attachment';
5
5
  export { default as useWpMediaFrame } from './hooks/use-wp-media-frame';
@@ -1,9 +0,0 @@
1
- export type ElementorCommonWindow = Window & {
2
- elementorCommon: {
3
- config: {
4
- filesUpload: {
5
- unfilteredFiles?: boolean;
6
- };
7
- };
8
- };
9
- };
@@ -1 +0,0 @@
1
- export type ImageExtension = 'avif' | 'bmp' | 'gif' | 'ico' | 'jpe' | 'jpeg' | 'jpg' | 'png' | 'svg' | 'webp';