/**
* [[include:modules/widget/file-selector/README.md]]
* @packageDocumentation
* @module modules/widget/file-selector
*/
// Jodit
import type { IJodit } from 'jodit/types';
import type { ImageSelectorCallbacks } from 'jodit/modules/widget';
import { MediaLists } from 'jodit/modules/widget/search-selector/MediaLists';
// Style
import './search-selector.less';
// Variable Section
type imageFileType = 'image' | 'gif';
// Main section
export const SearchSelectorWidget = (
editor: IJodit,
callbacks: ImageSelectorCallbacks,
fileType: imageFileType,
close: () => void
): HTMLFormElement => {
const fileTypeLowercase = fileType.toLowerCase();
const form: HTMLFormElement = editor.c.fromHTML(
`'
) as HTMLFormElement;
const searchInput: HTMLSpanElement = form.querySelector(
`.jodit-search-${fileTypeLowercase}__search > input`
) as HTMLDivElement;
const resultContainer: HTMLDivElement = form.querySelector(
`.jodit-search-${fileTypeLowercase}__search-result`
) as HTMLDivElement;
const mediaLists = new MediaLists(editor, callbacks, fileType, close);
if (mediaLists.mediaList?.element) {
resultContainer.appendChild(mediaLists.mediaList?.element);
}
if (searchInput) {
searchInput.addEventListener(
'input',
editor.async.debounce(event => {
// @ts-ignore
mediaLists.search(event?.target?.value);
}, editor.o.searchTimeout)
);
}
/**
* Unsplash API Guidelines: https://unsplash.com/api-terms
* Unsplash API Guidelines: https://support.giphy.com/hc/en-us/articles/360028134111-GIPHY-API-Terms-of-Service-
*/
// let license;
// let licenseLink;
// switch (fileType) {
// case 'image':
// license = 'Unsplash';
// licenseLink = 'https://unsplash.com/api-terms';
// break;
// case 'gif':
// license = 'Giphy';
// licenseLink =
// 'https://support.giphy.com/hc/en-us/articles/360028134111-GIPHY-API-Terms-of-Service-';
// break;
// }
// if (license) {
// form.appendChild(
// editor.c.fromHTML(
// ``
// )
// );
// }
return form;
};