feat(ui): add repeat icon and improve block actions menu transform option

- add RepeatIcon component to shared icons index
- import and display RepeatIcon in the transform menu item of BlockActionsMenu
- remove maxHeight constraint and overflow-y-auto from actions menu panel
This commit is contained in:
2026-04-25 20:55:45 -04:00
parent e1ccd6ded9
commit a1f71860fe
2 changed files with 11 additions and 4 deletions
@@ -1,7 +1,7 @@
'use client';
import React, { useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState, forwardRef } from 'react';
import { Add01Icon, ArrowRight01Icon, Copy01Icon, Delete02Icon, DragDropVerticalIcon } from '@zen/core/shared/icons';
import { Add01Icon, ArrowRight01Icon, Copy01Icon, Delete02Icon, DragDropVerticalIcon, RepeatIcon } from '@zen/core/shared/icons';
// Style « boîte » pour l'icône d'un type de bloc, repris du SlashMenu.
const TYPE_ICON_BOX_CLASS = 'w-8 h-8 flex items-center justify-center rounded-md border border-neutral-200 dark:border-neutral-700 text-xs font-medium text-neutral-700 dark:text-neutral-300 flex-shrink-0';
@@ -156,7 +156,7 @@ function BlockActionsMenu({
}) {
const containerRef = useRef(null);
const triggerRef = useRef(null);
const { side, maxHeight } = useDropdownPlacement(open, triggerRef);
const { side } = useDropdownPlacement(open, triggerRef);
const [submenuOpen, setSubmenuOpen] = useState(false);
const submenuTimerRef = useRef(null);
@@ -232,9 +232,8 @@ function BlockActionsMenu({
{open && (
<div
className={`absolute left-0 ${panelPositionClass} w-56 rounded-xl border border-black/8 dark:border-white/8 bg-white dark:bg-[#0B0B0B] shadow-lg z-50 flex flex-col`}
style={{ maxHeight }}
>
<div className="p-1.5 flex flex-col gap-0.5 overflow-y-auto">
<div className="p-1.5 flex flex-col gap-0.5">
{transformOptions.length > 0 && (
<div
className="relative"
@@ -245,6 +244,7 @@ function BlockActionsMenu({
role="button"
className={`cursor-pointer w-full flex items-center gap-2 px-[7px] py-[10px] rounded-lg text-[13px] leading-none text-neutral-500 dark:text-neutral-400 transition-colors duration-[120ms] ease-out ${submenuOpen ? 'bg-neutral-100 dark:bg-white/5 text-neutral-900 dark:text-white' : ''}`}
>
<RepeatIcon className="w-4 h-4 shrink-0" />
<span className="flex-1">Transformer</span>
<ArrowRight01Icon className="w-3.5 h-3.5 shrink-0" />
</div>