@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 +13 -0
- package/dist/index.d.mts +5 -7
- package/dist/index.d.ts +5 -7
- package/dist/index.js +23 -27
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +23 -27
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
- package/src/hooks/use-wp-media-frame.ts +29 -34
- package/src/index.ts +1 -1
- package/src/types/elementor-common.ts +0 -9
- package/src/types/image.ts +0 -1
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
|
-
|
|
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
|
|
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
|
-
|
|
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
|
|
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:
|
|
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
|
-
|
|
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
|
|
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
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
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
|
|
188
|
-
const
|
|
189
|
-
|
|
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:
|
|
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
|
-
|
|
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
|
|
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
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
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
|
|
160
|
-
const
|
|
161
|
-
|
|
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,
|
package/dist/index.mjs.map
CHANGED
|
@@ -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":";AAAA,SAAS,gBAAgB;;;ACAzB,SAAS,mBAAmB;AAErB,IAAM,2BAA2B,YAAa;AAAA,EACpD,MAAM;AAAA,EACN,SAAS;AACV,CAAE;AAEK,IAAM,sCAAsC,YAAa;AAAA,EAC/D,MAAM;AAAA,EACN,SAAS;AACV,CAAE;;;ACPF,IAAM,gBAAgB;AAEtB,IAAO,gBAAQ,MAAM;AACpB,MAAK,CAAE,cAAc,IAAI,OAAQ;AAChC,UAAM,IAAI,yBAAyB;AAAA,EACpC;AAEA,SAAO,cAAc,GAAG;AACzB;;;ACRe,SAAR,UAA4B,YAA2C;AAC7E,QAAM,EAAE,iBAAiB,uBAAuB,QAAQ,YAAY,GAAG,KAAK,IAAI;AAEhF,SAAO;AAAA,IACN,GAAG;AAAA,IACH,UAAU;AAAA,MACT,SAAS;AAAA,MACT,eAAe;AAAA,IAChB;AAAA,IACA,QAAQ;AAAA,MACP,IAAI,SAAU,MAAO;AAAA,MACrB,MAAM;AAAA,IACP;AAAA,EACD;AACD;;;ACdA,eAAsB,mBAAoB,EAAE,GAAG,GAA2B;AACzE,MAAK,CAAE,IAAK;AACX,WAAO;AAAA,EACR;AAEA,QAAM,QAAQ,cAAM,EAAE,WAAY,EAAG;AACrC,QAAM,eAAe,MAAM,OAAO;AAElC,QAAM,YAAY,SAAS;AAE3B,MAAK,WAAY;AAChB,WAAO,UAAW,YAAa;AAAA,EAChC;AAEA,MAAI;AACH,WAAO,UAAW,MAAM,MAAM,MAAM,CAAE;AAAA,EACvC,QAAQ;AACP,WAAO;AAAA,EACR;AACD;;;AJlBe,SAAR,qBAAuC,IAAoB;AACjE,SAAO,SAAU;AAAA,IAChB,UAAU,CAAE,iBAAiB,EAAG;AAAA,IAChC,SAAS,MAAM,mBAAoB,EAAE,GAAG,CAAE;AAAA,IAC1C,SAAS,CAAC,CAAE;AAAA,EACb,CAAE;AACH;;;AKVA,SAAS,WAAW,cAAc;;;ACGlC,IAAM,2BAA2B;AAEjC,IAAO,+BAAQ,MAAM;AACpB,MAAK,CAAE,yBAAyB,qBAAsB;AACrD,UAAM,IAAI,oCAAoC;AAAA,EAC/C;AAEA,SAAO,yBAAyB;AACjC;;;ADmBe,SAAR,gBAAkC,SAAmB;AAC3D,QAAM,QAAQ,OAAqB;AAEnC,QAAM,OAAO,CAAE,cAA2B,CAAC,MAAO;AACjD,iBAAc,MAAM,OAAQ;AAE5B,UAAM,UAAU,YAAa,EAAE,GAAG,SAAS,GAAG,YAAY,CAAE;AAE5D,UAAM,SAAS,KAAK;AAAA,EACrB;AAEA,YAAW,MAAM;AAChB,WAAO,MAAM;AACZ,mBAAc,MAAM,OAAQ;AAAA,IAC7B;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,SAAO;AAAA,IACN;AAAA,EACD;AACD;AAEA,SAAS,YAAa,EAAE,UAAU,UAAU,YAAY,UAAU,OAAO,OAAO,SAAS,GAA2B;AACnH,QAAM,QAAoB,cAAM,EAAG;AAAA,IAClC;AAAA,IACA;AAAA,IACA,SAAS;AAAA,MACR,MAAM,aAAc,UAAW;AAAA,IAChC;AAAA,EACD,CAAE,EACA,GAAI,QAAQ,MAAM;AAClB,kBAAe,KAAM;AACrB,cAAW,OAAO,IAAK;AACvB,mBAAgB,OAAO,QAAS;AAAA,EACjC,CAAE,EACD,GAAI,SAAS,MAAM,aAAc,KAAM,CAAE,EACzC,GAAI,iBAAiB,MAAM,OAAQ,OAAO,UAAU,QAAS,CAAE;AAEjE,mBAAkB,OAAO,UAAW;AAEpC,SAAO;AACR;AAEA,SAAS,aAAc,OAAqB;AAC3C,SAAO,OAAO;AACd,SAAO,OAAO;AACf;AAEA,SAAS,UAAW,OAAmB,OAA8B,UAAW;AAC/E,QAAM,QAAQ,KAAM,IAAK;AAC1B;AAEA,SAAS,eAAgB,OAAmB,UAAmD;AAC9F,QAAM,uBAAwB,OAAO,aAAa,WAAW,CAAE,QAAS,IAAI,WACzE,OAAQ,CAAE,OAAQ,CAAC,CAAE,EAAG,EACzB,IAAK,CAAE,OAAQ,cAAM,EAAE,WAAY,EAAa,CAAE;AAEpD,QACE,MAAM,EACN,IAAK,WAAY,EACjB,IAAK,uBAAuB,CAAC,CAAE;AAClC;AAEA,SAAS,OAAQ,OAAmB,UAAmB,UAAkC;AACxF,QAAM,cAAc,MAAM,MAAM,EAAE,IAAK,WAAY,EAAE,OAAO,EAAE,IAAK,SAAU;AAE7E,QAAM,aAAa;AAEnB,aAAY,WAAW,cAAc,YAAa,CAAE,CAAE;AACvD;AAEA,SAAS,cAAe,OAAoB;AAC3C,QAAM,SAAS,SAAS,MAAO,oBAAoB,2BAA4B;AAChF;AAEA,SAAS,iBAAkB,OAAmB,YAA0B;AACvE,QAAM,oBAAoB,6BAAmB,EAAE,SAAS,QAAQ,aAAc,CAAE,GAAG;AAGnF,QAAM,GAAI,SAAS,MAAM;AACxB,iCAAmB,EAAE,SAAS,QAAQ,aAAa,CAAE,EAAE,YAAY,cAAe,UAAW,EAAE,CAAE;AAAA,EAClG,CAAE;AAGF,QAAM,GAAI,SAAS,MAAM;AACxB,iCAAmB,EAAE,SAAS,QAAQ,aAAa,oBAChD,CAAE,EAAE,YAAY,kBAAkB,CAAE,IACpC,CAAC;AAAA,EACL,CAAE;AACH;AAEA,IAAM,kBAAkB,CAAE,QAAQ,OAAO,OAAO,OAAO,OAAO,QAAQ,OAAO,OAAO,MAAO;AAE3F,SAAS,aAAc,YAA0B;AAChD,QAAM,mBAAkD;AAAA,IACvD,OAAO,gBAAgB,IAAK,CAAE,cAAe,SAAU,SAAU,EAAG;AAAA,IACpE,KAAK,CAAE,eAAgB;AAAA,EACxB;AAEA,SAAO,WAAW,OAAQ,CAAE,MAAM,gBAAiB;AAClD,WAAO,KAAK,OAAQ,iBAAkB,WAAY,CAAE;AAAA,EACrD,GAAG,CAAC,CAAc;AACnB;AAEA,SAAS,cAAe,YAA0B;AACjD,QAAM,oBAAmD;AAAA,IACxD,OAAO;AAAA,IACP,KAAK,CAAE,KAAM;AAAA,EACd;AAEA,QAAM,aAAa,WAAW,OAAQ,CAAE,MAAM,gBAAiB;AAC9D,WAAO,KAAK,OAAQ,kBAAmB,WAAY,CAAE;AAAA,EACtD,GAAG,CAAC,CAAc;AAElB,SAAO,WAAW,KAAM,GAAI;AAC7B;","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
|
+
"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.
|
|
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
|
-
|
|
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:
|
|
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
|
-
|
|
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
|
|
106
|
+
function handleExtensions( frame: MediaFrame, mediaTypes: MediaType[] ) {
|
|
118
107
|
const defaultExtensions = wpPluploadSettings().defaults.filters.mime_types?.[ 0 ]?.extensions;
|
|
119
108
|
|
|
120
|
-
// Set
|
|
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
|
-
|
|
136
|
-
let extensions: ImageExtension[] = [ ...defaultImageExtensions ];
|
|
122
|
+
const imageExtensions = [ 'avif', 'bmp', 'gif', 'ico', 'jpe', 'jpeg', 'jpg', 'png', 'webp' ];
|
|
137
123
|
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
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
|
|
130
|
+
return mediaTypes.reduce( ( prev, currentType ) => {
|
|
131
|
+
return prev.concat( mimeTypesPerType[ currentType ] );
|
|
132
|
+
}, [] as string[] );
|
|
145
133
|
}
|
|
146
134
|
|
|
147
|
-
function
|
|
148
|
-
const
|
|
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
|
|
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 {
|
|
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';
|
package/src/types/image.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export type ImageExtension = 'avif' | 'bmp' | 'gif' | 'ico' | 'jpe' | 'jpeg' | 'jpg' | 'png' | 'svg' | 'webp';
|