(function (wp) {
	var el = wp.element.createElement;
	var Notice = wp.components.Notice; //WP標準の警告や通知などの背景スタイルを使いたい場合
	var ExternalLink = wp.components.ExternalLink; //外部ページへのリンクを使いたい場合は追加
	var registerPlugin = wp.plugins.registerPlugin;
	var PluginDocumentSettingPanel = wp.editor.PluginDocumentSettingPanel || wp.editPost.PluginDocumentSettingPanel;
	var useSelect = wp.data.useSelect; // 投稿タイプ取得

	//PHPからの値受け取り
	var T = HaupLocalizeTextGroupClickCount;

	var HaupMetaPanel = function () {

		//指定した投稿タイプで出力
			//現在の投稿タイプを取得
			var postType = useSelect(function (select) {
				return select('core/editor').getCurrentPostType();
			}, []);

			// 表示を許可する投稿タイプのリスト（配列）
			//var allowedPostTypes = ['post','page']; // 投稿タイプを配列指定
			// PHPで指定した配列をwp_localize_scriptで渡す
			var allowedPostTypes = T.post_types; // 投稿タイプを配列指定

				// リストに含まれていない場合は表示しない
				if (!allowedPostTypes.includes(postType)) {
					return null;
				}

		return el(
			PluginDocumentSettingPanel,
			{
				name: 'haup-editor-panel-group-click-count',
				title: T.title,
				icon: 'analytics', // インフォメーションアイコン
			},
			// パネルの内部コンテンツ
			el('div', { style: { padding: '10px 0' } },
				el('p', { style: {} },
					T.info
				),
				//統計結果を流し込む
				el('div', { 
					style: { },
					dangerouslySetInnerHTML: { __html: T.click_result } 
					}),
   
			), //全体のdivタグの閉じ子
		); //パネルの閉じ子
	}; //HaupMetaPanel関数の終了

	registerPlugin('haup-editor-panel-group-click-count-plugin', { render: HaupMetaPanel });

})(window.wp);