Merge pull request #2283 from vektor-inc/develop

[ Change version ] 1.89.0.0

languages/vk-blocks-pro-js.pot

@@ -3669,7 +3669,7 @@ msgid ""
 "from border panel that, specification from here is deprecated."
 msgstr ""
 
-#: src/extensions/core/group/style.js:191
+#: src/extensions/core/group/style.js:192
 msgid "Group link"
 msgstr ""
 

languages/vk-blocks-pro.pot

@@ -2,14 +2,14 @@
 # This file is distributed under the same license as the VK Blocks Pro plugin.
 msgid ""
 msgstr ""
-"Project-Id-Version: VK Blocks Pro 1.87.0.0\n"
+"Project-Id-Version: VK Blocks Pro 1.88.0.0\n"
 "Report-Msgid-Bugs-To: https://wordpress.org/support/plugin/vk-blocks-pro\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <[email protected]>\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"POT-Creation-Date: 2024-10-21T14:55:12+00:00\n"
+"POT-Creation-Date: 2024-10-24T08:37:11+00:00\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "X-Generator: WP-CLI 2.10.0\n"
 "X-Domain: vk-blocks-pro\n"
@@ -3647,7 +3647,7 @@ msgstr ""
 msgid "Because of the theme that enabled theme.json become can specify the color from border panel that, specification from here is deprecated."
 msgstr ""
 
-#: src/extensions/core/group/style.js:191
+#: src/extensions/core/group/style.js:192
 msgid "Group link"
 msgstr ""
 

readme.txt

@@ -4,7 +4,7 @@ Donate link:
 Tags: Gutenberg,FAQ,alert
 Requires at least: 6.3
 Tested up to: 6.6
-Stable tag: 1.87.0.1
+Stable tag: 1.88.0.2
 Requires PHP: 7.4
 License: GPLv2 or later
 License URI: https://www.gnu.org/licenses/gpl-2.0.html
@@ -106,6 +106,12 @@ e.g.
 
 == Changelog ==
 
+= 1.89.0 =
+[ Add function ][ Outer (Pro) ] Added support for core text color settings.
+[ Add function ][ Accordion (Pro) ] Added the ability to toggle the Accordion block open and close in the editing screen.
+[ Bug Fix ][ Grid Column Card (Pro) ] Fixed slider overflow in Grid Column Card Item Body.
+[ Bug fix ][ core/roup ] Fixed an issue where unwanted classes were assigned when links were present in the group block.
+
 = 1.88.0 =
 [ Specification change ][ Grid Column Card (Pro) ] Changed the default settings of headerDisplay and footerDisplay from "Delete" to "Display".
 [ Specification change ] Add filter vk_post_taxonomies_html ( Update VK Components 1.6.1 )
@@ -1799,4 +1805,4 @@ First release
 
 == Upgrade Notice ==
 
-Nothing.
+Nothing.

src/blocks/_pro/accordion-trigger/edit.js

@@ -1,9 +1,65 @@
 import { InnerBlocks, useBlockProps } from '@wordpress/block-editor';
+import { useEffect, useRef } from 'react';
 
 export default function AccordionTriggerEdit() {
 	const blockProps = useBlockProps({
 		className: `vk_accordion-trigger`,
 	});
+
+	const accordionToggleRef = useRef(null);
+
+	useEffect(() => {
+		// 初期状態の設定を取得
+		const vkAccordion = accordionToggleRef.current.closest(
+			'.vk_accordion-container, .vk_accordion'
+		);
+		const initialState = vkAccordion.getAttribute('data-initial-state');
+
+		const vkAccordionToggle = accordionToggleRef.current;
+		const vkAccordionTarget = vkAccordion.querySelector(
+			'.vk_accordion-target'
+		);
+
+		// 初期状態に基づいてクラスとaria属性を設定
+		if (initialState !== 'close') {
+			// 'close'でない場合、'open'にする
+			vkAccordionToggle.classList.add('vk_accordion-toggle-open');
+			vkAccordionTarget.classList.add('vk_accordion-target-open');
+			vkAccordionToggle.setAttribute('aria-expanded', 'true');
+		} else {
+			vkAccordionToggle.classList.add('vk_accordion-toggle-close');
+			vkAccordionTarget.classList.add('vk_accordion-target-close');
+			vkAccordionToggle.setAttribute('aria-expanded', 'false');
+		}
+	}, []);
+
+	const OnClickToggle = (e) => {
+		// vk_accordion-container または vk_accordion を持つ最も近い要素を探す
+		const vkAccordion = e.target.closest(
+			'.vk_accordion-container, .vk_accordion'
+		);
+		const vkAccordionToggle = vkAccordion.querySelector(
+			'.vk_accordion-toggle'
+		);
+		const vkAccordionTarget = vkAccordion.querySelector(
+			'.vk_accordion-target'
+		);
+
+		if (vkAccordionToggle.classList.contains('vk_accordion-toggle-close')) {
+			vkAccordionToggle.classList.remove('vk_accordion-toggle-close');
+			vkAccordionToggle.classList.add('vk_accordion-toggle-open');
+			vkAccordionTarget.classList.remove('vk_accordion-target-close');
+			vkAccordionTarget.classList.add('vk_accordion-target-open');
+			vkAccordionToggle.setAttribute('aria-expanded', 'true');
+		} else {
+			vkAccordionToggle.classList.remove('vk_accordion-toggle-open');
+			vkAccordionToggle.classList.add('vk_accordion-toggle-close');
+			vkAccordionTarget.classList.remove('vk_accordion-target-open');
+			vkAccordionTarget.classList.add('vk_accordion-target-close');
+			vkAccordionToggle.setAttribute('aria-expanded', 'false');
+		}
+	};
+
 	return (
 		<>
 			<div {...blockProps}>
@@ -12,7 +68,20 @@ export default function AccordionTriggerEdit() {
 					template={[['core/paragraph']]}
 				/>
 				<span
-					className={`vk_accordion-toggle vk_accordion-toggle-close`}
+					ref={accordionToggleRef}
+					className="vk_accordion-toggle" // 初期状態のクラスはJSで設定
+					onClick={(e) => {
+						OnClickToggle(e);
+					}}
+					role="button"
+					tabIndex={0}
+					onKeyPress={(e) => {
+						if (e.key === 'Enter' || e.key === ' ') {
+							OnClickToggle(e);
+						}
+					}}
+					aria-controls="accordion-content"
+					aria-label="Toggle"
 				></span>
 			</div>
 		</>

src/blocks/_pro/accordion/style.scss

@@ -211,6 +211,9 @@
 		.vk_accordion-trigger {
 			//フロント画面では.vk_accordion-toggle-openが付くクラスに対してborder-bottomが付いているので、編集画面では追加で記述
 			border-bottom: 1px dotted var(--vk-color-border);
+			.block-list-appender {
+				right: -24px;
+			}
 		}
 	}
 	//ブロックを配置した時にisDefaultに設置したclassが付かない（スタイルをクリックしたときにclassが付く）ので、共通のclass名にcssを追加して、
@@ -220,15 +223,17 @@
 	}
 	.vk_accordion-trigger {
 
-		cursor:unset; //編集画面では展開しないのでカーソルをunset
+		padding-right: calc( 1rem * 4 );
+		.block-editor-inner-blocks {
+			position: inherit;
+			cursor: initial;
+			z-index: 1;
+		}
 		.block-editor-block-list__block {
 			// 余白が大きく空くので追加
 			margin-top: 0;
 			margin-bottom: 0;
 		}
-		.vk_accordion-toggle {//absoluteだとテキスト編集できないので
-			position: unset;
-		}
 	}
 
 }

src/blocks/_pro/gridcolcard/style.scss

@@ -52,6 +52,10 @@
 			&-valign-bottom{
 				align-content: end;
 			}
+			> .swiper{ //スライダーがはみ出すため打消し用
+				margin-left: unset;
+				margin-right: unset
+			}
 		}
 		&_footer{
 			display: grid;
@@ -74,4 +78,4 @@
 			}
 		}
 	}
-}
+}

src/blocks/_pro/outer/block.json

@@ -159,6 +159,10 @@
 	"supports": {
 		"html": false,
 		"className": true,
-		"anchor": true
+		"anchor": true,
+		"color": {
+			"text": true,
+			"background": false
+		}
 	}
 }

src/extensions/core/group/style.js

@@ -183,6 +183,7 @@ const save = (props) => {
 
 	return (
 		<CustomTag {...blockProps}>
+			<InnerBlocks.Content />
 			{linkUrl && (
 				<a
 					href={linkUrl}
@@ -192,7 +193,6 @@ const save = (props) => {
 					className={`${prefix}-vk-link`}
 				></a>
 			)}
-			<InnerBlocks.Content />
 		</CustomTag>
 	);
 };

vk-blocks.php

@@ -3,8 +3,8 @@
  * Plugin Name: VK Blocks Pro
  * Plugin URI: https://github.com/vektor-inc/vk-blocks
  * Description: This is a plugin that extends Block Editor.
- * Version: 1.88.0.1
- * Stable tag: 1.87.0.1
+ * Version: 1.89.0.0
+ * Stable tag: 1.88.0.2
  * Requires at least: 6.3
  * Author: Vektor,Inc.
  * Author URI: https://vektor-inc.co.jp