@wordpress/block-library 9.38.1-next.v.0 → 9.39.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.
Files changed (273) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/build/button/index.cjs +3 -0
  3. package/build/button/index.cjs.map +2 -2
  4. package/build/comments-title/block.json +1 -3
  5. package/build/comments-title/deprecated.cjs +148 -24
  6. package/build/comments-title/deprecated.cjs.map +3 -3
  7. package/build/comments-title/edit.cjs +17 -31
  8. package/build/comments-title/edit.cjs.map +3 -3
  9. package/build/cover/edit/block-controls.cjs +10 -2
  10. package/build/cover/edit/block-controls.cjs.map +2 -2
  11. package/build/cover/edit/embed-video-url-input.cjs +6 -2
  12. package/build/cover/edit/embed-video-url-input.cjs.map +2 -2
  13. package/build/details/index.cjs +3 -0
  14. package/build/details/index.cjs.map +2 -2
  15. package/build/heading/index.cjs +3 -0
  16. package/build/heading/index.cjs.map +2 -2
  17. package/build/image/index.cjs +1 -1
  18. package/build/image/index.cjs.map +2 -2
  19. package/build/index.cjs +6 -0
  20. package/build/index.cjs.map +2 -2
  21. package/build/list-item/index.cjs +3 -0
  22. package/build/list-item/index.cjs.map +2 -2
  23. package/build/more/index.cjs +1 -1
  24. package/build/more/index.cjs.map +2 -2
  25. package/build/navigation/edit/index.cjs +23 -2
  26. package/build/navigation/edit/index.cjs.map +2 -2
  27. package/build/navigation-submenu/index.cjs +2 -2
  28. package/build/navigation-submenu/index.cjs.map +2 -2
  29. package/build/paragraph/index.cjs +1 -1
  30. package/build/paragraph/index.cjs.map +2 -2
  31. package/build/post-excerpt/edit.cjs +1 -1
  32. package/build/post-excerpt/edit.cjs.map +2 -2
  33. package/build/tab/add-tab-toolbar-control.cjs +31 -9
  34. package/build/tab/add-tab-toolbar-control.cjs.map +2 -2
  35. package/build/tab/block.json +18 -4
  36. package/build/tab/controls.cjs +4 -8
  37. package/build/tab/controls.cjs.map +3 -3
  38. package/build/tab/edit.cjs +46 -118
  39. package/build/tab/edit.cjs.map +3 -3
  40. package/build/tab/remove-tab-toolbar-control.cjs +91 -0
  41. package/build/tab/remove-tab-toolbar-control.cjs.map +7 -0
  42. package/build/tab/save.cjs +2 -2
  43. package/build/tab/save.cjs.map +2 -2
  44. package/build/tab-panels/block.json +70 -0
  45. package/build/tab-panels/edit.cjs +63 -0
  46. package/build/tab-panels/edit.cjs.map +7 -0
  47. package/build/tab-panels/icon.cjs +29 -0
  48. package/build/tab-panels/icon.cjs.map +7 -0
  49. package/build/tab-panels/index.cjs +58 -0
  50. package/build/tab-panels/index.cjs.map +7 -0
  51. package/build/tab-panels/save.cjs +33 -0
  52. package/build/tab-panels/save.cjs.map +7 -0
  53. package/build/tabs/block.json +61 -90
  54. package/build/tabs/controls.cjs +19 -221
  55. package/build/tabs/controls.cjs.map +3 -3
  56. package/build/tabs/deprecated.cjs +179 -0
  57. package/build/tabs/deprecated.cjs.map +7 -0
  58. package/build/tabs/edit.cjs +84 -62
  59. package/build/tabs/edit.cjs.map +3 -3
  60. package/build/tabs/index.cjs +3 -1
  61. package/build/tabs/index.cjs.map +3 -3
  62. package/build/tabs/save.cjs +6 -9
  63. package/build/tabs/save.cjs.map +2 -2
  64. package/build/tabs-menu/block.json +77 -0
  65. package/build/tabs-menu/edit.cjs +204 -0
  66. package/build/tabs-menu/edit.cjs.map +7 -0
  67. package/build/tabs-menu/icon.cjs +29 -0
  68. package/build/tabs-menu/icon.cjs.map +7 -0
  69. package/build/tabs-menu/index.cjs +58 -0
  70. package/build/tabs-menu/index.cjs.map +7 -0
  71. package/build/tabs-menu/save.cjs +35 -0
  72. package/build/tabs-menu/save.cjs.map +7 -0
  73. package/build/tabs-menu-item/block.json +98 -0
  74. package/build/tabs-menu-item/controls.cjs +247 -0
  75. package/build/tabs-menu-item/controls.cjs.map +7 -0
  76. package/build/tabs-menu-item/edit.cjs +272 -0
  77. package/build/tabs-menu-item/edit.cjs.map +7 -0
  78. package/build/tabs-menu-item/icon.cjs +29 -0
  79. package/build/tabs-menu-item/icon.cjs.map +7 -0
  80. package/build/tabs-menu-item/index.cjs +58 -0
  81. package/build/tabs-menu-item/index.cjs.map +7 -0
  82. package/build/tabs-menu-item/save.cjs +50 -0
  83. package/build/tabs-menu-item/save.cjs.map +7 -0
  84. package/build/template-part/edit/index.cjs +1 -1
  85. package/build/template-part/edit/index.cjs.map +2 -2
  86. package/build/utils/caption.cjs +4 -6
  87. package/build/utils/caption.cjs.map +3 -3
  88. package/build/video/edit.cjs +4 -2
  89. package/build/video/edit.cjs.map +2 -2
  90. package/build-module/button/index.mjs +3 -0
  91. package/build-module/button/index.mjs.map +2 -2
  92. package/build-module/comments-title/block.json +1 -3
  93. package/build-module/comments-title/deprecated.mjs +148 -24
  94. package/build-module/comments-title/deprecated.mjs.map +2 -2
  95. package/build-module/comments-title/edit.mjs +17 -32
  96. package/build-module/comments-title/edit.mjs.map +2 -2
  97. package/build-module/cover/edit/block-controls.mjs +11 -3
  98. package/build-module/cover/edit/block-controls.mjs.map +2 -2
  99. package/build-module/cover/edit/embed-video-url-input.mjs +6 -2
  100. package/build-module/cover/edit/embed-video-url-input.mjs.map +2 -2
  101. package/build-module/details/index.mjs +3 -0
  102. package/build-module/details/index.mjs.map +2 -2
  103. package/build-module/heading/index.mjs +3 -0
  104. package/build-module/heading/index.mjs.map +2 -2
  105. package/build-module/image/index.mjs +1 -1
  106. package/build-module/image/index.mjs.map +2 -2
  107. package/build-module/index.mjs +6 -0
  108. package/build-module/index.mjs.map +2 -2
  109. package/build-module/list-item/index.mjs +3 -0
  110. package/build-module/list-item/index.mjs.map +2 -2
  111. package/build-module/more/index.mjs +1 -1
  112. package/build-module/more/index.mjs.map +2 -2
  113. package/build-module/navigation/edit/index.mjs +23 -2
  114. package/build-module/navigation/edit/index.mjs.map +2 -2
  115. package/build-module/navigation-submenu/index.mjs +2 -2
  116. package/build-module/navigation-submenu/index.mjs.map +2 -2
  117. package/build-module/paragraph/index.mjs +1 -1
  118. package/build-module/paragraph/index.mjs.map +2 -2
  119. package/build-module/post-excerpt/edit.mjs +1 -1
  120. package/build-module/post-excerpt/edit.mjs.map +2 -2
  121. package/build-module/tab/add-tab-toolbar-control.mjs +32 -10
  122. package/build-module/tab/add-tab-toolbar-control.mjs.map +2 -2
  123. package/build-module/tab/block.json +18 -4
  124. package/build-module/tab/controls.mjs +4 -8
  125. package/build-module/tab/controls.mjs.map +2 -2
  126. package/build-module/tab/edit.mjs +48 -128
  127. package/build-module/tab/edit.mjs.map +2 -2
  128. package/build-module/tab/remove-tab-toolbar-control.mjs +73 -0
  129. package/build-module/tab/remove-tab-toolbar-control.mjs.map +7 -0
  130. package/build-module/tab/save.mjs +2 -2
  131. package/build-module/tab/save.mjs.map +2 -2
  132. package/build-module/tab-panels/block.json +70 -0
  133. package/build-module/tab-panels/edit.mjs +36 -0
  134. package/build-module/tab-panels/edit.mjs.map +7 -0
  135. package/build-module/tab-panels/icon.mjs +8 -0
  136. package/build-module/tab-panels/icon.mjs.map +7 -0
  137. package/build-module/tab-panels/index.mjs +20 -0
  138. package/build-module/tab-panels/index.mjs.map +7 -0
  139. package/build-module/tab-panels/save.mjs +12 -0
  140. package/build-module/tab-panels/save.mjs.map +7 -0
  141. package/build-module/tabs/block.json +61 -90
  142. package/build-module/tabs/controls.mjs +21 -228
  143. package/build-module/tabs/controls.mjs.map +2 -2
  144. package/build-module/tabs/deprecated.mjs +158 -0
  145. package/build-module/tabs/deprecated.mjs.map +7 -0
  146. package/build-module/tabs/edit.mjs +87 -64
  147. package/build-module/tabs/edit.mjs.map +2 -2
  148. package/build-module/tabs/index.mjs +3 -1
  149. package/build-module/tabs/index.mjs.map +2 -2
  150. package/build-module/tabs/save.mjs +7 -10
  151. package/build-module/tabs/save.mjs.map +2 -2
  152. package/build-module/tabs-menu/block.json +77 -0
  153. package/build-module/tabs-menu/edit.mjs +186 -0
  154. package/build-module/tabs-menu/edit.mjs.map +7 -0
  155. package/build-module/tabs-menu/icon.mjs +8 -0
  156. package/build-module/tabs-menu/icon.mjs.map +7 -0
  157. package/build-module/tabs-menu/index.mjs +20 -0
  158. package/build-module/tabs-menu/index.mjs.map +7 -0
  159. package/build-module/tabs-menu/save.mjs +14 -0
  160. package/build-module/tabs-menu/save.mjs.map +7 -0
  161. package/build-module/tabs-menu-item/block.json +98 -0
  162. package/build-module/tabs-menu-item/controls.mjs +227 -0
  163. package/build-module/tabs-menu-item/controls.mjs.map +7 -0
  164. package/build-module/tabs-menu-item/edit.mjs +253 -0
  165. package/build-module/tabs-menu-item/edit.mjs.map +7 -0
  166. package/build-module/tabs-menu-item/icon.mjs +8 -0
  167. package/build-module/tabs-menu-item/icon.mjs.map +7 -0
  168. package/build-module/tabs-menu-item/index.mjs +20 -0
  169. package/build-module/tabs-menu-item/index.mjs.map +7 -0
  170. package/build-module/tabs-menu-item/save.mjs +29 -0
  171. package/build-module/tabs-menu-item/save.mjs.map +7 -0
  172. package/build-module/template-part/edit/index.mjs +1 -1
  173. package/build-module/template-part/edit/index.mjs.map +2 -2
  174. package/build-module/utils/caption.mjs +1 -3
  175. package/build-module/utils/caption.mjs.map +2 -2
  176. package/build-module/video/edit.mjs +4 -2
  177. package/build-module/video/edit.mjs.map +2 -2
  178. package/build-style/editor-rtl.css +16 -21
  179. package/build-style/editor.css +16 -21
  180. package/build-style/gallery/style-rtl.css +1 -1
  181. package/build-style/gallery/style.css +1 -1
  182. package/build-style/style-rtl.css +42 -153
  183. package/build-style/style.css +42 -153
  184. package/build-style/tab/style-rtl.css +7 -1
  185. package/build-style/tab/style.css +7 -1
  186. package/build-style/tab-panels/style-rtl.css +4 -0
  187. package/build-style/tab-panels/style.css +4 -0
  188. package/build-style/tabs/style-rtl.css +1 -167
  189. package/build-style/tabs/style.css +1 -167
  190. package/build-style/tabs-menu/editor-rtl.css +4 -0
  191. package/build-style/tabs-menu/editor.css +4 -0
  192. package/build-style/tabs-menu/style-rtl.css +8 -0
  193. package/build-style/tabs-menu/style.css +8 -0
  194. package/build-style/tabs-menu-item/editor-rtl.css +16 -0
  195. package/build-style/tabs-menu-item/editor.css +16 -0
  196. package/build-style/tabs-menu-item/style-rtl.css +34 -0
  197. package/build-style/tabs-menu-item/style.css +34 -0
  198. package/package.json +37 -37
  199. package/src/button/index.js +4 -0
  200. package/src/comments-title/block.json +1 -3
  201. package/src/comments-title/deprecated.js +153 -23
  202. package/src/comments-title/edit.js +9 -25
  203. package/src/cover/edit/block-controls.js +14 -3
  204. package/src/cover/edit/embed-video-url-input.js +6 -2
  205. package/src/details/index.js +4 -0
  206. package/src/editor.scss +2 -1
  207. package/src/gallery/style.scss +1 -1
  208. package/src/heading/index.js +4 -0
  209. package/src/image/index.js +4 -1
  210. package/src/index.js +6 -0
  211. package/src/list-item/index.js +4 -0
  212. package/src/more/index.js +4 -1
  213. package/src/navigation/edit/index.js +28 -4
  214. package/src/navigation-submenu/index.js +6 -3
  215. package/src/paragraph/index.js +4 -1
  216. package/src/post-excerpt/edit.js +1 -1
  217. package/src/post-excerpt/index.php +39 -16
  218. package/src/style.scss +3 -0
  219. package/src/tab/add-tab-toolbar-control.js +36 -11
  220. package/src/tab/block.json +18 -4
  221. package/src/tab/controls.js +4 -5
  222. package/src/tab/edit.js +75 -150
  223. package/src/tab/index.php +5 -63
  224. package/src/tab/remove-tab-toolbar-control.js +103 -0
  225. package/src/tab/save.js +1 -3
  226. package/src/tab/style.scss +8 -1
  227. package/src/tab-panels/block.json +70 -0
  228. package/src/tab-panels/edit.js +44 -0
  229. package/src/tab-panels/icon.js +10 -0
  230. package/src/tab-panels/index.js +21 -0
  231. package/src/tab-panels/save.js +11 -0
  232. package/src/tab-panels/style.scss +4 -0
  233. package/src/tabs/block.json +61 -90
  234. package/src/tabs/controls.js +7 -221
  235. package/src/tabs/deprecated.js +214 -0
  236. package/src/tabs/edit.js +108 -68
  237. package/src/tabs/index.js +2 -0
  238. package/src/tabs/index.php +86 -191
  239. package/src/tabs/save.js +6 -13
  240. package/src/tabs/style.scss +1 -187
  241. package/src/tabs-menu/block.json +77 -0
  242. package/src/tabs-menu/edit.js +251 -0
  243. package/src/tabs-menu/editor.scss +6 -0
  244. package/src/tabs-menu/icon.js +10 -0
  245. package/src/tabs-menu/index.js +21 -0
  246. package/src/tabs-menu/index.php +74 -0
  247. package/src/tabs-menu/save.js +18 -0
  248. package/src/tabs-menu/style.scss +8 -0
  249. package/src/tabs-menu-item/block.json +98 -0
  250. package/src/tabs-menu-item/controls.js +262 -0
  251. package/src/tabs-menu-item/edit.js +322 -0
  252. package/src/tabs-menu-item/editor.scss +20 -0
  253. package/src/tabs-menu-item/icon.js +10 -0
  254. package/src/tabs-menu-item/index.js +21 -0
  255. package/src/tabs-menu-item/index.php +82 -0
  256. package/src/tabs-menu-item/save.js +44 -0
  257. package/src/tabs-menu-item/style.scss +42 -0
  258. package/src/template-part/edit/index.js +1 -3
  259. package/src/utils/caption.js +1 -7
  260. package/src/video/edit.js +4 -2
  261. package/build/tab/tabs-list.cjs +0 -132
  262. package/build/tab/tabs-list.cjs.map +0 -7
  263. package/build/tabs/style-engine.cjs +0 -119
  264. package/build/tabs/style-engine.cjs.map +0 -7
  265. package/build-module/tab/tabs-list.mjs +0 -101
  266. package/build-module/tab/tabs-list.mjs.map +0 -7
  267. package/build-module/tabs/style-engine.mjs +0 -101
  268. package/build-module/tabs/style-engine.mjs.map +0 -7
  269. package/build-style/tabs/editor-rtl.css +0 -26
  270. package/build-style/tabs/editor.css +0 -26
  271. package/src/tab/tabs-list.js +0 -122
  272. package/src/tabs/editor.scss +0 -30
  273. package/src/tabs/style-engine.js +0 -164
@@ -0,0 +1,227 @@
1
+ // packages/block-library/src/tabs-menu-item/controls.js
2
+ import clsx from "clsx";
3
+ import { __, isRTL } from "@wordpress/i18n";
4
+ import {
5
+ BlockControls,
6
+ InspectorControls,
7
+ store as blockEditorStore,
8
+ __experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,
9
+ __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients
10
+ } from "@wordpress/block-editor";
11
+ import { ToolbarGroup, ToolbarItem, Button } from "@wordpress/components";
12
+ import {
13
+ chevronLeft,
14
+ chevronRight,
15
+ chevronUp,
16
+ chevronDown
17
+ } from "@wordpress/icons";
18
+ import { useDispatch, useSelect } from "@wordpress/data";
19
+ import AddTabToolbarControl from "../tab/add-tab-toolbar-control.mjs";
20
+ import RemoveTabToolbarControl from "../tab/remove-tab-toolbar-control.mjs";
21
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
22
+ function TabBlockMover({
23
+ tabClientId,
24
+ tabIndex,
25
+ tabsCount,
26
+ tabsMenuClientId,
27
+ tabsClientId
28
+ }) {
29
+ const {
30
+ moveBlocksUp,
31
+ moveBlocksDown,
32
+ updateBlockAttributes,
33
+ __unstableMarkNextChangeAsNotPersistent
34
+ } = useDispatch(blockEditorStore);
35
+ const { tabPanelsClientId, orientation } = useSelect(
36
+ (select) => {
37
+ const { getBlockRootClientId, getBlockAttributes } = select(blockEditorStore);
38
+ const tabsMenuAttributes = tabsMenuClientId ? getBlockAttributes(tabsMenuClientId) : null;
39
+ return {
40
+ tabPanelsClientId: getBlockRootClientId(tabClientId),
41
+ orientation: tabsMenuAttributes?.layout?.orientation || "horizontal"
42
+ };
43
+ },
44
+ [tabClientId, tabsMenuClientId]
45
+ );
46
+ const isFirst = tabIndex === 0;
47
+ const isLast = tabIndex === tabsCount - 1;
48
+ const isHorizontal = orientation === "horizontal";
49
+ let upIcon, downIcon, upLabel, downLabel;
50
+ if (isHorizontal) {
51
+ if (isRTL()) {
52
+ upIcon = chevronRight;
53
+ downIcon = chevronLeft;
54
+ upLabel = __("Move tab right");
55
+ downLabel = __("Move tab left");
56
+ } else {
57
+ upIcon = chevronLeft;
58
+ downIcon = chevronRight;
59
+ upLabel = __("Move tab left");
60
+ downLabel = __("Move tab right");
61
+ }
62
+ } else {
63
+ upIcon = chevronUp;
64
+ downIcon = chevronDown;
65
+ upLabel = __("Move tab up");
66
+ downLabel = __("Move tab down");
67
+ }
68
+ const handleMoveUp = () => {
69
+ moveBlocksUp([tabClientId], tabPanelsClientId);
70
+ if (tabsClientId) {
71
+ __unstableMarkNextChangeAsNotPersistent();
72
+ updateBlockAttributes(tabsClientId, {
73
+ editorActiveTabIndex: tabIndex - 1
74
+ });
75
+ }
76
+ };
77
+ const handleMoveDown = () => {
78
+ moveBlocksDown([tabClientId], tabPanelsClientId);
79
+ if (tabsClientId) {
80
+ __unstableMarkNextChangeAsNotPersistent();
81
+ updateBlockAttributes(tabsClientId, {
82
+ editorActiveTabIndex: tabIndex + 1
83
+ });
84
+ }
85
+ };
86
+ if (tabsCount <= 1) {
87
+ return null;
88
+ }
89
+ return /* @__PURE__ */ jsx(BlockControls, { group: "parent", children: /* @__PURE__ */ jsx(
90
+ ToolbarGroup,
91
+ {
92
+ className: clsx("block-editor-block-mover", {
93
+ "is-horizontal": isHorizontal
94
+ }),
95
+ children: /* @__PURE__ */ jsxs("div", { className: "block-editor-block-mover__move-button-container", children: [
96
+ /* @__PURE__ */ jsx(ToolbarItem, { children: (itemProps) => /* @__PURE__ */ jsx(
97
+ Button,
98
+ {
99
+ className: clsx(
100
+ "block-editor-block-mover-button",
101
+ "is-up-button"
102
+ ),
103
+ icon: upIcon,
104
+ label: upLabel,
105
+ disabled: isFirst,
106
+ accessibleWhenDisabled: true,
107
+ onClick: handleMoveUp,
108
+ __next40pxDefaultSize: true,
109
+ ...itemProps
110
+ }
111
+ ) }),
112
+ /* @__PURE__ */ jsx(ToolbarItem, { children: (itemProps) => /* @__PURE__ */ jsx(
113
+ Button,
114
+ {
115
+ className: clsx(
116
+ "block-editor-block-mover-button",
117
+ "is-down-button"
118
+ ),
119
+ icon: downIcon,
120
+ label: downLabel,
121
+ disabled: isLast,
122
+ accessibleWhenDisabled: true,
123
+ onClick: handleMoveDown,
124
+ __next40pxDefaultSize: true,
125
+ ...itemProps
126
+ }
127
+ ) })
128
+ ] })
129
+ }
130
+ ) });
131
+ }
132
+ function Controls({
133
+ attributes,
134
+ setAttributes,
135
+ clientId,
136
+ tabsClientId,
137
+ tabClientId,
138
+ tabIndex,
139
+ tabsCount,
140
+ tabsMenuClientId,
141
+ activeBackgroundColor,
142
+ setActiveBackgroundColor,
143
+ activeTextColor,
144
+ setActiveTextColor,
145
+ hoverBackgroundColor,
146
+ setHoverBackgroundColor,
147
+ hoverTextColor,
148
+ setHoverTextColor
149
+ }) {
150
+ const {
151
+ customActiveBackgroundColor,
152
+ customActiveTextColor,
153
+ customHoverBackgroundColor,
154
+ customHoverTextColor
155
+ } = attributes;
156
+ const colorSettings = useMultipleOriginColorsAndGradients();
157
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
158
+ /* @__PURE__ */ jsx(
159
+ TabBlockMover,
160
+ {
161
+ tabClientId,
162
+ tabIndex,
163
+ tabsCount,
164
+ tabsMenuClientId,
165
+ tabsClientId
166
+ }
167
+ ),
168
+ /* @__PURE__ */ jsx(AddTabToolbarControl, { tabsClientId }),
169
+ /* @__PURE__ */ jsx(RemoveTabToolbarControl, { tabsClientId }),
170
+ /* @__PURE__ */ jsx(InspectorControls, { group: "color", children: /* @__PURE__ */ jsx(
171
+ ColorGradientSettingsDropdown,
172
+ {
173
+ settings: [
174
+ {
175
+ label: __("Active Background"),
176
+ colorValue: activeBackgroundColor?.color ?? customActiveBackgroundColor,
177
+ onColorChange: (value) => {
178
+ setActiveBackgroundColor(value);
179
+ setAttributes({
180
+ customActiveBackgroundColor: value
181
+ });
182
+ }
183
+ },
184
+ {
185
+ label: __("Active Text"),
186
+ colorValue: activeTextColor?.color ?? customActiveTextColor,
187
+ onColorChange: (value) => {
188
+ setActiveTextColor(value);
189
+ setAttributes({
190
+ customActiveTextColor: value
191
+ });
192
+ }
193
+ },
194
+ {
195
+ label: __("Hover Background"),
196
+ colorValue: hoverBackgroundColor?.color ?? customHoverBackgroundColor,
197
+ onColorChange: (value) => {
198
+ setHoverBackgroundColor(value);
199
+ setAttributes({
200
+ customHoverBackgroundColor: value
201
+ });
202
+ }
203
+ },
204
+ {
205
+ label: __("Hover Text"),
206
+ colorValue: hoverTextColor?.color ?? customHoverTextColor,
207
+ onColorChange: (value) => {
208
+ setHoverTextColor(value);
209
+ setAttributes({
210
+ customHoverTextColor: value
211
+ });
212
+ }
213
+ }
214
+ ],
215
+ panelId: clientId,
216
+ disableCustomColors: false,
217
+ __experimentalIsRenderedInSidebar: true,
218
+ __next40pxDefaultSize: true,
219
+ ...colorSettings
220
+ }
221
+ ) })
222
+ ] });
223
+ }
224
+ export {
225
+ Controls as default
226
+ };
227
+ //# sourceMappingURL=controls.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs-menu-item/controls.js"],
4
+ "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tBlockControls,\n\tInspectorControls,\n\tstore as blockEditorStore,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n} from '@wordpress/block-editor';\nimport { ToolbarGroup, ToolbarItem, Button } from '@wordpress/components';\nimport {\n\tchevronLeft,\n\tchevronRight,\n\tchevronUp,\n\tchevronDown,\n} from '@wordpress/icons';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport AddTabToolbarControl from '../tab/add-tab-toolbar-control';\nimport RemoveTabToolbarControl from '../tab/remove-tab-toolbar-control';\n\nfunction TabBlockMover( {\n\ttabClientId,\n\ttabIndex,\n\ttabsCount,\n\ttabsMenuClientId,\n\ttabsClientId,\n} ) {\n\tconst {\n\t\tmoveBlocksUp,\n\t\tmoveBlocksDown,\n\t\tupdateBlockAttributes,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst { tabPanelsClientId, orientation } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockRootClientId, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\t// Get orientation directly from the tabs-menu block's layout attribute.\n\t\t\t// This is more reliable than getBlockListSettings which is set asynchronously.\n\t\t\tconst tabsMenuAttributes = tabsMenuClientId\n\t\t\t\t? getBlockAttributes( tabsMenuClientId )\n\t\t\t\t: null;\n\t\t\treturn {\n\t\t\t\ttabPanelsClientId: getBlockRootClientId( tabClientId ),\n\t\t\t\torientation:\n\t\t\t\t\ttabsMenuAttributes?.layout?.orientation || 'horizontal',\n\t\t\t};\n\t\t},\n\t\t[ tabClientId, tabsMenuClientId ]\n\t);\n\n\tconst isFirst = tabIndex === 0;\n\tconst isLast = tabIndex === tabsCount - 1;\n\tconst isHorizontal = orientation === 'horizontal';\n\n\t// Icons and labels based on orientation (respects RTL for horizontal)\n\tlet upIcon, downIcon, upLabel, downLabel;\n\tif ( isHorizontal ) {\n\t\tif ( isRTL() ) {\n\t\t\tupIcon = chevronRight;\n\t\t\tdownIcon = chevronLeft;\n\t\t\tupLabel = __( 'Move tab right' );\n\t\t\tdownLabel = __( 'Move tab left' );\n\t\t} else {\n\t\t\tupIcon = chevronLeft;\n\t\t\tdownIcon = chevronRight;\n\t\t\tupLabel = __( 'Move tab left' );\n\t\t\tdownLabel = __( 'Move tab right' );\n\t\t}\n\t} else {\n\t\tupIcon = chevronUp;\n\t\tdownIcon = chevronDown;\n\t\tupLabel = __( 'Move tab up' );\n\t\tdownLabel = __( 'Move tab down' );\n\t}\n\n\t// Handle moving tab and updating active index to follow the moved tab\n\tconst handleMoveUp = () => {\n\t\tmoveBlocksUp( [ tabClientId ], tabPanelsClientId );\n\t\t// Update editorActiveTabIndex to follow the moved tab\n\t\tif ( tabsClientId ) {\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\teditorActiveTabIndex: tabIndex - 1,\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst handleMoveDown = () => {\n\t\tmoveBlocksDown( [ tabClientId ], tabPanelsClientId );\n\t\t// Update editorActiveTabIndex to follow the moved tab\n\t\tif ( tabsClientId ) {\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\teditorActiveTabIndex: tabIndex + 1,\n\t\t\t} );\n\t\t}\n\t};\n\n\t// Don't render if only one tab\n\tif ( tabsCount <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockControls group=\"parent\">\n\t\t\t<ToolbarGroup\n\t\t\t\tclassName={ clsx( 'block-editor-block-mover', {\n\t\t\t\t\t'is-horizontal': isHorizontal,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<div className=\"block-editor-block-mover__move-button-container\">\n\t\t\t\t\t<ToolbarItem>\n\t\t\t\t\t\t{ ( itemProps ) => (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t\t\t\t'is-up-button'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\ticon={ upIcon }\n\t\t\t\t\t\t\t\tlabel={ upLabel }\n\t\t\t\t\t\t\t\tdisabled={ isFirst }\n\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\tonClick={ handleMoveUp }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolbarItem>\n\t\t\t\t\t<ToolbarItem>\n\t\t\t\t\t\t{ ( itemProps ) => (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t\t\t\t'is-down-button'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\ticon={ downIcon }\n\t\t\t\t\t\t\t\tlabel={ downLabel }\n\t\t\t\t\t\t\t\tdisabled={ isLast }\n\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\tonClick={ handleMoveDown }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolbarItem>\n\t\t\t\t</div>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n}\n\nexport default function Controls( {\n\tattributes,\n\tsetAttributes,\n\tclientId,\n\ttabsClientId,\n\ttabClientId,\n\ttabIndex,\n\ttabsCount,\n\ttabsMenuClientId,\n\tactiveBackgroundColor,\n\tsetActiveBackgroundColor,\n\tactiveTextColor,\n\tsetActiveTextColor,\n\thoverBackgroundColor,\n\tsetHoverBackgroundColor,\n\thoverTextColor,\n\tsetHoverTextColor,\n} ) {\n\tconst {\n\t\tcustomActiveBackgroundColor,\n\t\tcustomActiveTextColor,\n\t\tcustomHoverBackgroundColor,\n\t\tcustomHoverTextColor,\n\t} = attributes;\n\n\tconst colorSettings = useMultipleOriginColorsAndGradients();\n\n\treturn (\n\t\t<>\n\t\t\t<TabBlockMover\n\t\t\t\ttabClientId={ tabClientId }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\ttabsCount={ tabsCount }\n\t\t\t\ttabsMenuClientId={ tabsMenuClientId }\n\t\t\t\ttabsClientId={ tabsClientId }\n\t\t\t/>\n\t\t\t<AddTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<RemoveTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<InspectorControls group=\"color\">\n\t\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\t\tsettings={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Active Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\tactiveBackgroundColor?.color ??\n\t\t\t\t\t\t\t\tcustomActiveBackgroundColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetActiveBackgroundColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomActiveBackgroundColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Active Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\tactiveTextColor?.color ?? customActiveTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetActiveTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomActiveTextColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Hover Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\thoverBackgroundColor?.color ??\n\t\t\t\t\t\t\t\tcustomHoverBackgroundColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetHoverBackgroundColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomHoverBackgroundColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Hover Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\thoverTextColor?.color ?? customHoverTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetHoverTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomHoverTextColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\tdisableCustomColors={ false }\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t{ ...colorSettings }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
@@ -0,0 +1,253 @@
1
+ // packages/block-library/src/tabs-menu-item/edit.js
2
+ import clsx from "clsx";
3
+ import { __, sprintf } from "@wordpress/i18n";
4
+ import {
5
+ useBlockProps,
6
+ withColors,
7
+ store as blockEditorStore,
8
+ RichText
9
+ } from "@wordpress/block-editor";
10
+ import { useSelect, useDispatch } from "@wordpress/data";
11
+ import { decodeEntities } from "@wordpress/html-entities";
12
+ import {
13
+ RawHTML,
14
+ useRef,
15
+ useCallback,
16
+ useState,
17
+ useEffect,
18
+ useMemo
19
+ } from "@wordpress/element";
20
+ import slugFromLabel from "../tab/slug-from-label.mjs";
21
+ import Controls from "./controls.mjs";
22
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
23
+ var { requestAnimationFrame, cancelAnimationFrame } = window;
24
+ function StaticLabel({ label, index }) {
25
+ if (label) {
26
+ return /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(RawHTML, { children: decodeEntities(label) }) });
27
+ }
28
+ return /* @__PURE__ */ jsx("span", { children: sprintf(
29
+ /* translators: %d is the tab index + 1 */
30
+ __("Tab %d"),
31
+ index + 1
32
+ ) });
33
+ }
34
+ function Edit({
35
+ attributes,
36
+ setAttributes,
37
+ context,
38
+ clientId,
39
+ activeBackgroundColor,
40
+ setActiveBackgroundColor,
41
+ activeTextColor,
42
+ setActiveTextColor,
43
+ hoverBackgroundColor,
44
+ setHoverBackgroundColor,
45
+ hoverTextColor,
46
+ setHoverTextColor,
47
+ __unstableLayoutClassNames: layoutClassNames
48
+ }) {
49
+ const tabIndex = context["core/tabs-menu-item-index"] ?? 0;
50
+ const tabId = context["core/tabs-menu-item-id"] ?? "";
51
+ const tabLabel = context["core/tabs-menu-item-label"] ?? "";
52
+ const tabClientId = context["core/tabs-menu-item-clientId"] ?? "";
53
+ const contextTabsList = context["core/tabs-list"];
54
+ const tabsList = useMemo(
55
+ () => contextTabsList || [],
56
+ [contextTabsList]
57
+ );
58
+ const activeTabIndex = context["core/tabs-activeTabIndex"] ?? 0;
59
+ const editorActiveTabIndex = context["core/tabs-editorActiveTabIndex"];
60
+ const effectiveActiveIndex = useMemo(() => {
61
+ return editorActiveTabIndex ?? activeTabIndex;
62
+ }, [editorActiveTabIndex, activeTabIndex]);
63
+ const isActiveTab = tabIndex === effectiveActiveIndex;
64
+ const { __unstableMarkNextChangeAsNotPersistent } = useDispatch(blockEditorStore);
65
+ const focusRef = useRef();
66
+ const labelElementRef = useRef(null);
67
+ const [isEditing, setIsEditing] = useState(false);
68
+ const [editingLabel, setEditingLabel] = useState("");
69
+ const { tabsClientId, tabsMenuClientId, selectedTabClientId } = useSelect(
70
+ (select) => {
71
+ const {
72
+ getBlockRootClientId,
73
+ getSelectedBlockClientIds,
74
+ hasSelectedInnerBlock
75
+ } = select(blockEditorStore);
76
+ const _tabsMenuClientId = getBlockRootClientId(clientId);
77
+ const _tabsClientId = _tabsMenuClientId ? getBlockRootClientId(_tabsMenuClientId) : null;
78
+ const selectedIds = getSelectedBlockClientIds();
79
+ let selectedTab = null;
80
+ for (const tab of tabsList) {
81
+ if (selectedIds.includes(tab.clientId) || hasSelectedInnerBlock(tab.clientId, true)) {
82
+ selectedTab = tab.clientId;
83
+ break;
84
+ }
85
+ }
86
+ return {
87
+ tabsClientId: _tabsClientId,
88
+ tabsMenuClientId: _tabsMenuClientId,
89
+ selectedTabClientId: selectedTab
90
+ };
91
+ },
92
+ [clientId, tabsList]
93
+ );
94
+ const isSelectedTab = tabClientId === selectedTabClientId;
95
+ const { updateBlockAttributes } = useDispatch(blockEditorStore);
96
+ const handleLabelChange = useCallback(
97
+ (newLabel) => {
98
+ if (tabClientId) {
99
+ updateBlockAttributes(tabClientId, {
100
+ label: newLabel,
101
+ anchor: slugFromLabel(newLabel, tabIndex)
102
+ });
103
+ }
104
+ },
105
+ [updateBlockAttributes, tabClientId, tabIndex]
106
+ );
107
+ const handleTabClick = useCallback(
108
+ (event) => {
109
+ event.preventDefault();
110
+ if (tabsClientId && tabIndex !== effectiveActiveIndex) {
111
+ __unstableMarkNextChangeAsNotPersistent();
112
+ updateBlockAttributes(tabsClientId, {
113
+ editorActiveTabIndex: tabIndex
114
+ });
115
+ }
116
+ if (isEditing) {
117
+ }
118
+ },
119
+ [
120
+ isEditing,
121
+ tabsClientId,
122
+ tabIndex,
123
+ effectiveActiveIndex,
124
+ updateBlockAttributes,
125
+ __unstableMarkNextChangeAsNotPersistent
126
+ ]
127
+ );
128
+ const labelRef = useCallback(
129
+ (node) => {
130
+ labelElementRef.current = node;
131
+ if (node && isEditing) {
132
+ const animationId = requestAnimationFrame(() => {
133
+ if (node) {
134
+ node.focus();
135
+ }
136
+ });
137
+ focusRef.current = animationId;
138
+ }
139
+ },
140
+ [isEditing]
141
+ );
142
+ useEffect(() => {
143
+ return () => {
144
+ if (focusRef.current) {
145
+ cancelAnimationFrame(focusRef.current);
146
+ }
147
+ };
148
+ }, []);
149
+ const customColorStyles = useMemo(() => {
150
+ const styles = {};
151
+ const activeBg = activeBackgroundColor?.color || attributes.customActiveBackgroundColor;
152
+ const activeText = activeTextColor?.color || attributes.customActiveTextColor;
153
+ const hoverBg = hoverBackgroundColor?.color || attributes.customHoverBackgroundColor;
154
+ const hoverText = hoverTextColor?.color || attributes.customHoverTextColor;
155
+ if (activeBg) {
156
+ styles["--custom-tab-active-color"] = activeBg;
157
+ }
158
+ if (activeText) {
159
+ styles["--custom-tab-active-text-color"] = activeText;
160
+ }
161
+ if (hoverBg) {
162
+ styles["--custom-tab-hover-color"] = hoverBg;
163
+ }
164
+ if (hoverText) {
165
+ styles["--custom-tab-hover-text-color"] = hoverText;
166
+ }
167
+ return styles;
168
+ }, [
169
+ activeBackgroundColor?.color,
170
+ attributes.customActiveBackgroundColor,
171
+ activeTextColor?.color,
172
+ attributes.customActiveTextColor,
173
+ hoverBackgroundColor?.color,
174
+ attributes.customHoverBackgroundColor,
175
+ hoverTextColor?.color,
176
+ attributes.customHoverTextColor
177
+ ]);
178
+ const tabPanelId = tabId || `tab-${tabIndex}`;
179
+ const tabLabelId = `${tabPanelId}--tab`;
180
+ const blockProps = useBlockProps({
181
+ className: clsx(layoutClassNames, {
182
+ "is-active": isActiveTab,
183
+ "is-selected": isSelectedTab
184
+ }),
185
+ style: customColorStyles,
186
+ "aria-controls": tabPanelId,
187
+ "aria-selected": isActiveTab,
188
+ id: tabLabelId,
189
+ role: "tab",
190
+ tabIndex: isActiveTab ? 0 : -1,
191
+ onClick: handleTabClick,
192
+ onDoubleClick: () => {
193
+ setIsEditing(true);
194
+ setEditingLabel(tabLabel || "");
195
+ }
196
+ });
197
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
198
+ /* @__PURE__ */ jsx(
199
+ Controls,
200
+ {
201
+ ...{
202
+ attributes,
203
+ setAttributes,
204
+ clientId,
205
+ tabsClientId,
206
+ tabClientId,
207
+ tabIndex,
208
+ tabsCount: tabsList.length,
209
+ tabsMenuClientId,
210
+ activeBackgroundColor,
211
+ setActiveBackgroundColor,
212
+ activeTextColor,
213
+ setActiveTextColor,
214
+ hoverBackgroundColor,
215
+ setHoverBackgroundColor,
216
+ hoverTextColor,
217
+ setHoverTextColor
218
+ }
219
+ }
220
+ ),
221
+ /* @__PURE__ */ jsx("div", { ...blockProps, children: isEditing ? /* @__PURE__ */ jsx(
222
+ RichText,
223
+ {
224
+ ref: labelRef,
225
+ tagName: "span",
226
+ withoutInteractiveFormatting: true,
227
+ placeholder: sprintf(
228
+ /* translators: %d is the tab index + 1 */
229
+ __("Tab %d\u2026"),
230
+ tabIndex + 1
231
+ ),
232
+ value: decodeEntities(editingLabel),
233
+ onChange: (value) => {
234
+ setEditingLabel(value);
235
+ handleLabelChange(value);
236
+ },
237
+ onBlur: () => {
238
+ setIsEditing(false);
239
+ }
240
+ }
241
+ ) : /* @__PURE__ */ jsx(StaticLabel, { label: tabLabel, index: tabIndex }) })
242
+ ] });
243
+ }
244
+ var edit_default = withColors(
245
+ "activeBackgroundColor",
246
+ "activeTextColor",
247
+ "hoverBackgroundColor",
248
+ "hoverTextColor"
249
+ )(Edit);
250
+ export {
251
+ edit_default as default
252
+ };
253
+ //# sourceMappingURL=edit.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs-menu-item/edit.js"],
4
+ "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tuseBlockProps,\n\twithColors,\n\tstore as blockEditorStore,\n\tRichText,\n} from '@wordpress/block-editor';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport {\n\tRawHTML,\n\tuseRef,\n\tuseCallback,\n\tuseState,\n\tuseEffect,\n\tuseMemo,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport slugFromLabel from '../tab/slug-from-label';\nimport Controls from './controls';\n\nconst { requestAnimationFrame, cancelAnimationFrame } = window;\n\nfunction StaticLabel( { label, index } ) {\n\tif ( label ) {\n\t\treturn (\n\t\t\t<span>\n\t\t\t\t<RawHTML>{ decodeEntities( label ) }</RawHTML>\n\t\t\t</span>\n\t\t);\n\t}\n\treturn (\n\t\t<span>\n\t\t\t{ sprintf(\n\t\t\t\t/* translators: %d is the tab index + 1 */\n\t\t\t\t__( 'Tab %d' ),\n\t\t\t\tindex + 1\n\t\t\t) }\n\t\t</span>\n\t);\n}\n\nfunction Edit( {\n\tattributes,\n\tsetAttributes,\n\tcontext,\n\tclientId,\n\tactiveBackgroundColor,\n\tsetActiveBackgroundColor,\n\tactiveTextColor,\n\tsetActiveTextColor,\n\thoverBackgroundColor,\n\tsetHoverBackgroundColor,\n\thoverTextColor,\n\tsetHoverTextColor,\n\t__unstableLayoutClassNames: layoutClassNames,\n} ) {\n\t// Context from tabs-menu (per-item context via BlockContextProvider)\n\tconst tabIndex = context[ 'core/tabs-menu-item-index' ] ?? 0;\n\tconst tabId = context[ 'core/tabs-menu-item-id' ] ?? '';\n\tconst tabLabel = context[ 'core/tabs-menu-item-label' ] ?? '';\n\tconst tabClientId = context[ 'core/tabs-menu-item-clientId' ] ?? '';\n\n\t// Context from parent tabs block, memoized to prevent unnecessary re-renders.\n\tconst contextTabsList = context[ 'core/tabs-list' ];\n\tconst tabsList = useMemo(\n\t\t() => contextTabsList || [],\n\t\t[ contextTabsList ]\n\t);\n\tconst activeTabIndex = context[ 'core/tabs-activeTabIndex' ] ?? 0;\n\tconst editorActiveTabIndex = context[ 'core/tabs-editorActiveTabIndex' ];\n\n\t// Memoize effectiveActiveIndex to ensure it updates when context changes\n\tconst effectiveActiveIndex = useMemo( () => {\n\t\treturn editorActiveTabIndex ?? activeTabIndex;\n\t}, [ editorActiveTabIndex, activeTabIndex ] );\n\n\tconst isActiveTab = tabIndex === effectiveActiveIndex;\n\n\tconst { __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\tconst focusRef = useRef();\n\tconst labelElementRef = useRef( null );\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ editingLabel, setEditingLabel ] = useState( '' );\n\n\t// Get parent tabs clientId for updating editorActiveTabIndex\n\tconst { tabsClientId, tabsMenuClientId, selectedTabClientId } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetSelectedBlockClientIds,\n\t\t\t\thasSelectedInnerBlock,\n\t\t\t} = select( blockEditorStore );\n\t\t\t// tabs-menu-item -> tabs-menu -> tabs\n\t\t\tconst _tabsMenuClientId = getBlockRootClientId( clientId );\n\t\t\tconst _tabsClientId = _tabsMenuClientId\n\t\t\t\t? getBlockRootClientId( _tabsMenuClientId )\n\t\t\t\t: null;\n\n\t\t\tconst selectedIds = getSelectedBlockClientIds();\n\n\t\t\t// Find if any tab is selected\n\t\t\tlet selectedTab = null;\n\t\t\tfor ( const tab of tabsList ) {\n\t\t\t\tif (\n\t\t\t\t\tselectedIds.includes( tab.clientId ) ||\n\t\t\t\t\thasSelectedInnerBlock( tab.clientId, true )\n\t\t\t\t) {\n\t\t\t\t\tselectedTab = tab.clientId;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\ttabsClientId: _tabsClientId,\n\t\t\t\ttabsMenuClientId: _tabsMenuClientId,\n\t\t\t\tselectedTabClientId: selectedTab,\n\t\t\t};\n\t\t},\n\t\t[ clientId, tabsList ]\n\t);\n\n\tconst isSelectedTab = tabClientId === selectedTabClientId;\n\n\t// Update tab label in the tab block\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst handleLabelChange = useCallback(\n\t\t( newLabel ) => {\n\t\t\tif ( tabClientId ) {\n\t\t\t\tupdateBlockAttributes( tabClientId, {\n\t\t\t\t\tlabel: newLabel,\n\t\t\t\t\tanchor: slugFromLabel( newLabel, tabIndex ),\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t[ updateBlockAttributes, tabClientId, tabIndex ]\n\t);\n\n\t// Update editor active tab index on parent tabs block when tab is clicked\n\tconst handleTabClick = useCallback(\n\t\t( event ) => {\n\t\t\tevent.preventDefault();\n\n\t\t\t// Update the parent tabs block's editorActiveTabIndex (ephemeral, not persisted)\n\t\t\tif ( tabsClientId && tabIndex !== effectiveActiveIndex ) {\n\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\t\teditorActiveTabIndex: tabIndex,\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\t// Don't select block if we're editing this tab's label\n\t\t\tif ( isEditing ) {\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tisEditing,\n\t\t\ttabsClientId,\n\t\t\ttabIndex,\n\t\t\teffectiveActiveIndex,\n\t\t\tupdateBlockAttributes,\n\t\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\t]\n\t);\n\n\t// Callback ref for label RichText\n\tconst labelRef = useCallback(\n\t\t( node ) => {\n\t\t\tlabelElementRef.current = node;\n\t\t\tif ( node && isEditing ) {\n\t\t\t\tconst animationId = requestAnimationFrame( () => {\n\t\t\t\t\tif ( node ) {\n\t\t\t\t\t\tnode.focus();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\tfocusRef.current = animationId;\n\t\t\t}\n\t\t},\n\t\t[ isEditing ]\n\t);\n\n\t// Cleanup animation frames\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( focusRef.current ) {\n\t\t\t\tcancelAnimationFrame( focusRef.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\t// Build CSS custom properties for active/hover color states\n\tconst customColorStyles = useMemo( () => {\n\t\tconst styles = {};\n\n\t\t// Active/hover colors from custom attributes\n\t\tconst activeBg =\n\t\t\tactiveBackgroundColor?.color ||\n\t\t\tattributes.customActiveBackgroundColor;\n\t\tconst activeText =\n\t\t\tactiveTextColor?.color || attributes.customActiveTextColor;\n\t\tconst hoverBg =\n\t\t\thoverBackgroundColor?.color ||\n\t\t\tattributes.customHoverBackgroundColor;\n\t\tconst hoverText =\n\t\t\thoverTextColor?.color || attributes.customHoverTextColor;\n\n\t\tif ( activeBg ) {\n\t\t\tstyles[ '--custom-tab-active-color' ] = activeBg;\n\t\t}\n\t\tif ( activeText ) {\n\t\t\tstyles[ '--custom-tab-active-text-color' ] = activeText;\n\t\t}\n\t\tif ( hoverBg ) {\n\t\t\tstyles[ '--custom-tab-hover-color' ] = hoverBg;\n\t\t}\n\t\tif ( hoverText ) {\n\t\t\tstyles[ '--custom-tab-hover-text-color' ] = hoverText;\n\t\t}\n\n\t\treturn styles;\n\t}, [\n\t\tactiveBackgroundColor?.color,\n\t\tattributes.customActiveBackgroundColor,\n\t\tactiveTextColor?.color,\n\t\tattributes.customActiveTextColor,\n\t\thoverBackgroundColor?.color,\n\t\tattributes.customHoverBackgroundColor,\n\t\thoverTextColor?.color,\n\t\tattributes.customHoverTextColor,\n\t] );\n\n\tconst tabPanelId = tabId || `tab-${ tabIndex }`;\n\tconst tabLabelId = `${ tabPanelId }--tab`;\n\n\t// Use blockProps for core style engine support\n\tconst blockProps = useBlockProps( {\n\t\tclassName: clsx( layoutClassNames, {\n\t\t\t'is-active': isActiveTab,\n\t\t\t'is-selected': isSelectedTab,\n\t\t} ),\n\t\tstyle: customColorStyles,\n\t\t'aria-controls': tabPanelId,\n\t\t'aria-selected': isActiveTab,\n\t\tid: tabLabelId,\n\t\trole: 'tab',\n\t\ttabIndex: isActiveTab ? 0 : -1,\n\t\tonClick: handleTabClick,\n\t\tonDoubleClick: () => {\n\t\t\tsetIsEditing( true );\n\t\t\tsetEditingLabel( tabLabel || '' );\n\t\t},\n\t} );\n\n\treturn (\n\t\t<>\n\t\t\t<Controls\n\t\t\t\t{ ...{\n\t\t\t\t\tattributes,\n\t\t\t\t\tsetAttributes,\n\t\t\t\t\tclientId,\n\t\t\t\t\ttabsClientId,\n\t\t\t\t\ttabClientId,\n\t\t\t\t\ttabIndex,\n\t\t\t\t\ttabsCount: tabsList.length,\n\t\t\t\t\ttabsMenuClientId,\n\t\t\t\t\tactiveBackgroundColor,\n\t\t\t\t\tsetActiveBackgroundColor,\n\t\t\t\t\tactiveTextColor,\n\t\t\t\t\tsetActiveTextColor,\n\t\t\t\t\thoverBackgroundColor,\n\t\t\t\t\tsetHoverBackgroundColor,\n\t\t\t\t\thoverTextColor,\n\t\t\t\t\tsetHoverTextColor,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ isEditing ? (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\tref={ labelRef }\n\t\t\t\t\t\ttagName=\"span\"\n\t\t\t\t\t\twithoutInteractiveFormatting\n\t\t\t\t\t\tplaceholder={ sprintf(\n\t\t\t\t\t\t\t/* translators: %d is the tab index + 1 */\n\t\t\t\t\t\t\t__( 'Tab %d\u2026' ),\n\t\t\t\t\t\t\ttabIndex + 1\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tvalue={ decodeEntities( editingLabel ) }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tsetEditingLabel( value );\n\t\t\t\t\t\t\thandleLabelChange( value );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonBlur={ () => {\n\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<StaticLabel label={ tabLabel } index={ tabIndex } />\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default withColors(\n\t'activeBackgroundColor',\n\t'activeTextColor',\n\t'hoverBackgroundColor',\n\t'hoverTextColor'\n)( Edit );\n"],
5
+ "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,IAAI,eAAe;AAC5B;AAAA,EACC;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,OACM;AACP,SAAS,WAAW,mBAAmB;AACvC,SAAS,sBAAsB;AAC/B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAKP,OAAO,mBAAmB;AAC1B,OAAO,cAAc;AAQjB,SAqOF,UArOE,KAqOF,YArOE;AANJ,IAAM,EAAE,uBAAuB,qBAAqB,IAAI;AAExD,SAAS,YAAa,EAAE,OAAO,MAAM,GAAI;AACxC,MAAK,OAAQ;AACZ,WACC,oBAAC,UACA,8BAAC,WAAU,yBAAgB,KAAM,GAAG,GACrC;AAAA,EAEF;AACA,SACC,oBAAC,UACE;AAAA;AAAA,IAED,GAAI,QAAS;AAAA,IACb,QAAQ;AAAA,EACT,GACD;AAEF;AAEA,SAAS,KAAM;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,4BAA4B;AAC7B,GAAI;AAEH,QAAM,WAAW,QAAS,2BAA4B,KAAK;AAC3D,QAAM,QAAQ,QAAS,wBAAyB,KAAK;AACrD,QAAM,WAAW,QAAS,2BAA4B,KAAK;AAC3D,QAAM,cAAc,QAAS,8BAA+B,KAAK;AAGjE,QAAM,kBAAkB,QAAS,gBAAiB;AAClD,QAAM,WAAW;AAAA,IAChB,MAAM,mBAAmB,CAAC;AAAA,IAC1B,CAAE,eAAgB;AAAA,EACnB;AACA,QAAM,iBAAiB,QAAS,0BAA2B,KAAK;AAChE,QAAM,uBAAuB,QAAS,gCAAiC;AAGvE,QAAM,uBAAuB,QAAS,MAAM;AAC3C,WAAO,wBAAwB;AAAA,EAChC,GAAG,CAAE,sBAAsB,cAAe,CAAE;AAE5C,QAAM,cAAc,aAAa;AAEjC,QAAM,EAAE,wCAAwC,IAC/C,YAAa,gBAAiB;AAC/B,QAAM,WAAW,OAAO;AACxB,QAAM,kBAAkB,OAAQ,IAAK;AACrC,QAAM,CAAE,WAAW,YAAa,IAAI,SAAU,KAAM;AACpD,QAAM,CAAE,cAAc,eAAgB,IAAI,SAAU,EAAG;AAGvD,QAAM,EAAE,cAAc,kBAAkB,oBAAoB,IAAI;AAAA,IAC/D,CAAE,WAAY;AACb,YAAM;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,MACD,IAAI,OAAQ,gBAAiB;AAE7B,YAAM,oBAAoB,qBAAsB,QAAS;AACzD,YAAM,gBAAgB,oBACnB,qBAAsB,iBAAkB,IACxC;AAEH,YAAM,cAAc,0BAA0B;AAG9C,UAAI,cAAc;AAClB,iBAAY,OAAO,UAAW;AAC7B,YACC,YAAY,SAAU,IAAI,QAAS,KACnC,sBAAuB,IAAI,UAAU,IAAK,GACzC;AACD,wBAAc,IAAI;AAClB;AAAA,QACD;AAAA,MACD;AAEA,aAAO;AAAA,QACN,cAAc;AAAA,QACd,kBAAkB;AAAA,QAClB,qBAAqB;AAAA,MACtB;AAAA,IACD;AAAA,IACA,CAAE,UAAU,QAAS;AAAA,EACtB;AAEA,QAAM,gBAAgB,gBAAgB;AAGtC,QAAM,EAAE,sBAAsB,IAAI,YAAa,gBAAiB;AAEhE,QAAM,oBAAoB;AAAA,IACzB,CAAE,aAAc;AACf,UAAK,aAAc;AAClB,8BAAuB,aAAa;AAAA,UACnC,OAAO;AAAA,UACP,QAAQ,cAAe,UAAU,QAAS;AAAA,QAC3C,CAAE;AAAA,MACH;AAAA,IACD;AAAA,IACA,CAAE,uBAAuB,aAAa,QAAS;AAAA,EAChD;AAGA,QAAM,iBAAiB;AAAA,IACtB,CAAE,UAAW;AACZ,YAAM,eAAe;AAGrB,UAAK,gBAAgB,aAAa,sBAAuB;AACxD,gDAAwC;AACxC,8BAAuB,cAAc;AAAA,UACpC,sBAAsB;AAAA,QACvB,CAAE;AAAA,MACH;AAGA,UAAK,WAAY;AAAA,MACjB;AAAA,IACD;AAAA,IACA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AAGA,QAAM,WAAW;AAAA,IAChB,CAAE,SAAU;AACX,sBAAgB,UAAU;AAC1B,UAAK,QAAQ,WAAY;AACxB,cAAM,cAAc,sBAAuB,MAAM;AAChD,cAAK,MAAO;AACX,iBAAK,MAAM;AAAA,UACZ;AAAA,QACD,CAAE;AACF,iBAAS,UAAU;AAAA,MACpB;AAAA,IACD;AAAA,IACA,CAAE,SAAU;AAAA,EACb;AAGA,YAAW,MAAM;AAChB,WAAO,MAAM;AACZ,UAAK,SAAS,SAAU;AACvB,6BAAsB,SAAS,OAAQ;AAAA,MACxC;AAAA,IACD;AAAA,EACD,GAAG,CAAC,CAAE;AAGN,QAAM,oBAAoB,QAAS,MAAM;AACxC,UAAM,SAAS,CAAC;AAGhB,UAAM,WACL,uBAAuB,SACvB,WAAW;AACZ,UAAM,aACL,iBAAiB,SAAS,WAAW;AACtC,UAAM,UACL,sBAAsB,SACtB,WAAW;AACZ,UAAM,YACL,gBAAgB,SAAS,WAAW;AAErC,QAAK,UAAW;AACf,aAAQ,2BAA4B,IAAI;AAAA,IACzC;AACA,QAAK,YAAa;AACjB,aAAQ,gCAAiC,IAAI;AAAA,IAC9C;AACA,QAAK,SAAU;AACd,aAAQ,0BAA2B,IAAI;AAAA,IACxC;AACA,QAAK,WAAY;AAChB,aAAQ,+BAAgC,IAAI;AAAA,IAC7C;AAEA,WAAO;AAAA,EACR,GAAG;AAAA,IACF,uBAAuB;AAAA,IACvB,WAAW;AAAA,IACX,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,sBAAsB;AAAA,IACtB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACZ,CAAE;AAEF,QAAM,aAAa,SAAS,OAAQ,QAAS;AAC7C,QAAM,aAAa,GAAI,UAAW;AAGlC,QAAM,aAAa,cAAe;AAAA,IACjC,WAAW,KAAM,kBAAkB;AAAA,MAClC,aAAa;AAAA,MACb,eAAe;AAAA,IAChB,CAAE;AAAA,IACF,OAAO;AAAA,IACP,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,UAAU,cAAc,IAAI;AAAA,IAC5B,SAAS;AAAA,IACT,eAAe,MAAM;AACpB,mBAAc,IAAK;AACnB,sBAAiB,YAAY,EAAG;AAAA,IACjC;AAAA,EACD,CAAE;AAEF,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,WAAW,SAAS;AAAA,UACpB;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACD;AAAA;AAAA,IACD;AAAA,IACA,oBAAC,SAAM,GAAG,YACP,sBACD;AAAA,MAAC;AAAA;AAAA,QACA,KAAM;AAAA,QACN,SAAQ;AAAA,QACR,8BAA4B;AAAA,QAC5B,aAAc;AAAA;AAAA,UAEb,GAAI,cAAU;AAAA,UACd,WAAW;AAAA,QACZ;AAAA,QACA,OAAQ,eAAgB,YAAa;AAAA,QACrC,UAAW,CAAE,UAAW;AACvB,0BAAiB,KAAM;AACvB,4BAAmB,KAAM;AAAA,QAC1B;AAAA,QACA,QAAS,MAAM;AACd,uBAAc,KAAM;AAAA,QACrB;AAAA;AAAA,IACD,IAEA,oBAAC,eAAY,OAAQ,UAAW,OAAQ,UAAW,GAErD;AAAA,KACD;AAEF;AAEA,IAAO,eAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,EAAG,IAAK;",
6
+ "names": []
7
+ }
@@ -0,0 +1,8 @@
1
+ // packages/block-library/src/tabs-menu-item/icon.js
2
+ import { Path, SVG } from "@wordpress/primitives";
3
+ import { jsx } from "react/jsx-runtime";
4
+ var icon_default = /* @__PURE__ */ jsx(SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx(Path, { d: "M4 6h5v2H4V6zm0 4h5v2H4v-2zm0 4h5v2H4v-2zm10-8h6v2h-6V6zm0 4h6v2h-6v-2zm0 4h6v2h-6v-2z" }) });
5
+ export {
6
+ icon_default as default
7
+ };
8
+ //# sourceMappingURL=icon.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs-menu-item/icon.js"],
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Path, SVG } from '@wordpress/primitives';\n\nexport default (\n\t<SVG xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n\t\t<Path d=\"M4 6h5v2H4V6zm0 4h5v2H4v-2zm0 4h5v2H4v-2zm10-8h6v2h-6V6zm0 4h6v2h-6v-2zm0 4h6v2h-6v-2z\" />\n\t</SVG>\n);\n"],
5
+ "mappings": ";AAGA,SAAS,MAAM,WAAW;AAIxB;AAFF,IAAO,eACN,oBAAC,OAAI,OAAM,8BAA6B,SAAQ,aAC/C,8BAAC,QAAK,GAAE,0FAAyF,GAClG;",
6
+ "names": []
7
+ }
@@ -0,0 +1,20 @@
1
+ // packages/block-library/src/tabs-menu-item/index.js
2
+ import initBlock from "../utils/init-block.mjs";
3
+ import edit from "./edit.mjs";
4
+ import save from "./save.mjs";
5
+ import icon from "./icon.mjs";
6
+ import metadata from "./block.json";
7
+ var { name } = metadata;
8
+ var settings = {
9
+ icon,
10
+ edit,
11
+ save
12
+ };
13
+ var init = () => initBlock({ name, metadata, settings });
14
+ export {
15
+ init,
16
+ metadata,
17
+ name,
18
+ settings
19
+ };
20
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs-menu-item/index.js"],
4
+ "sourcesContent": ["/**\n * Internal dependencies\n */\nimport initBlock from '../utils/init-block';\nimport edit from './edit';\nimport save from './save';\nimport icon from './icon';\n\nimport metadata from './block.json';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"],
5
+ "mappings": ";AAGA,OAAO,eAAe;AACtB,OAAO,UAAU;AACjB,OAAO,UAAU;AACjB,OAAO,UAAU;AAEjB,OAAO,cAAc;AAErB,IAAM,EAAE,KAAK,IAAI;AAIV,IAAM,WAAW;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACD;AAEO,IAAM,OAAO,MAAM,UAAW,EAAE,MAAM,UAAU,SAAS,CAAE;",
6
+ "names": []
7
+ }
@@ -0,0 +1,29 @@
1
+ // packages/block-library/src/tabs-menu-item/save.js
2
+ import { __ } from "@wordpress/i18n";
3
+ import { useBlockProps } from "@wordpress/block-editor";
4
+ import { jsx } from "react/jsx-runtime";
5
+ function save({ attributes }) {
6
+ const customColorStyles = {};
7
+ if (attributes.customActiveBackgroundColor) {
8
+ customColorStyles["--custom-tab-active-color"] = attributes.customActiveBackgroundColor;
9
+ }
10
+ if (attributes.customActiveTextColor) {
11
+ customColorStyles["--custom-tab-active-text-color"] = attributes.customActiveTextColor;
12
+ }
13
+ if (attributes.customHoverBackgroundColor) {
14
+ customColorStyles["--custom-tab-hover-color"] = attributes.customHoverBackgroundColor;
15
+ }
16
+ if (attributes.customHoverTextColor) {
17
+ customColorStyles["--custom-tab-hover-text-color"] = attributes.customHoverTextColor;
18
+ }
19
+ const blockProps = useBlockProps.save({
20
+ className: "wp-block-tabs-menu-item__template",
21
+ style: customColorStyles,
22
+ hidden: true
23
+ });
24
+ return /* @__PURE__ */ jsx("a", { ...blockProps, children: /* @__PURE__ */ jsx("span", { className: "screen-reader-text", children: __("Tab menu item") }) });
25
+ }
26
+ export {
27
+ save as default
28
+ };
29
+ //# sourceMappingURL=save.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs-menu-item/save.js"],
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useBlockProps } from '@wordpress/block-editor';\n\nexport default function save( { attributes } ) {\n\t// Build CSS custom properties for active/hover colors\n\tconst customColorStyles = {};\n\n\t// Active/hover colors from custom attributes\n\tif ( attributes.customActiveBackgroundColor ) {\n\t\tcustomColorStyles[ '--custom-tab-active-color' ] =\n\t\t\tattributes.customActiveBackgroundColor;\n\t}\n\tif ( attributes.customActiveTextColor ) {\n\t\tcustomColorStyles[ '--custom-tab-active-text-color' ] =\n\t\t\tattributes.customActiveTextColor;\n\t}\n\tif ( attributes.customHoverBackgroundColor ) {\n\t\tcustomColorStyles[ '--custom-tab-hover-color' ] =\n\t\t\tattributes.customHoverBackgroundColor;\n\t}\n\tif ( attributes.customHoverTextColor ) {\n\t\tcustomColorStyles[ '--custom-tab-hover-text-color' ] =\n\t\t\tattributes.customHoverTextColor;\n\t}\n\n\t// useBlockProps.save includes all core style engine classes and styles\n\t// We add our custom classes and the hidden attribute for PHP template extraction\n\tconst blockProps = useBlockProps.save( {\n\t\tclassName: 'wp-block-tabs-menu-item__template',\n\t\tstyle: customColorStyles,\n\t\thidden: true,\n\t} );\n\n\treturn (\n\t\t<a { ...blockProps }>\n\t\t\t<span className=\"screen-reader-text\">\n\t\t\t\t{ __( 'Tab menu item' ) }\n\t\t\t</span>\n\t\t</a>\n\t);\n}\n"],
5
+ "mappings": ";AAGA,SAAS,UAAU;AACnB,SAAS,qBAAqB;AAkC3B;AAhCY,SAAR,KAAuB,EAAE,WAAW,GAAI;AAE9C,QAAM,oBAAoB,CAAC;AAG3B,MAAK,WAAW,6BAA8B;AAC7C,sBAAmB,2BAA4B,IAC9C,WAAW;AAAA,EACb;AACA,MAAK,WAAW,uBAAwB;AACvC,sBAAmB,gCAAiC,IACnD,WAAW;AAAA,EACb;AACA,MAAK,WAAW,4BAA6B;AAC5C,sBAAmB,0BAA2B,IAC7C,WAAW;AAAA,EACb;AACA,MAAK,WAAW,sBAAuB;AACtC,sBAAmB,+BAAgC,IAClD,WAAW;AAAA,EACb;AAIA,QAAM,aAAa,cAAc,KAAM;AAAA,IACtC,WAAW;AAAA,IACX,OAAO;AAAA,IACP,QAAQ;AAAA,EACT,CAAE;AAEF,SACC,oBAAC,OAAI,GAAG,YACP,8BAAC,UAAK,WAAU,sBACb,aAAI,eAAgB,GACvB,GACD;AAEF;",
6
+ "names": []
7
+ }
@@ -189,7 +189,7 @@ function TemplatePartEdit({
189
189
  postType: "wp_template_part"
190
190
  });
191
191
  },
192
- children: window?.__experimentalContentOnlyPatternInsertion ? __("Edit section") : __("Edit")
192
+ children: __("Edit section")
193
193
  }
194
194
  ) }),
195
195
  canUserEdit && /* @__PURE__ */ jsx(InspectorControls, { group: "advanced", children: /* @__PURE__ */ jsx(