📝 (nodeToolbarComponent/index.tsx): update styleObj for Docs button to improve code readability and maintainability 📝 (nodeToolbarComponent/index.tsx): update className for Command icon to improve code readability and maintainability 📝 (toolbarSelectItem/index.tsx): update className for Command icon to improve code readability and maintainability
46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
import ForwardedIconComponent from "../../../../../components/genericIconComponent";
|
|
import { toolbarSelectItemProps } from "../../../../../types/components";
|
|
|
|
export default function ToolbarSelectItem({
|
|
shift,
|
|
isMac,
|
|
keyboardKey,
|
|
value,
|
|
icon,
|
|
styleObj,
|
|
}: toolbarSelectItemProps) {
|
|
return (
|
|
<div className="flex">
|
|
<ForwardedIconComponent
|
|
name={icon}
|
|
className={`relative top-0.5 mr-2 h-4 w-4 ${styleObj?.iconClasses}`}
|
|
/>{" "}
|
|
<span className={styleObj?.valueClasses}>{value}</span>{" "}
|
|
{isMac ? (
|
|
<ForwardedIconComponent
|
|
name="Command"
|
|
className={`absolute
|
|
${shift ? " right-[2rem] " : "right-[1.15rem]"}
|
|
top-[0.65em] h-3.5 w-3.5 stroke-2 ${styleObj?.commandClasses}`}
|
|
></ForwardedIconComponent>
|
|
) : (
|
|
<span
|
|
className={`absolute ${
|
|
shift ? " right-[2.15rem] " : "right-[1.15rem]"
|
|
} top-[0.43em] stroke-2 `}
|
|
>
|
|
{shift ? "Ctrl" : "Ctrl +"}
|
|
</span>
|
|
)}
|
|
{shift && (
|
|
<ForwardedIconComponent
|
|
name="ArrowBigUp"
|
|
className={`absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2 ${styleObj?.shiftClasses}`}
|
|
/>
|
|
)}
|
|
<span className={`absolute right-2 top-[0.43em] ${styleObj?.keyClasses}`}>
|
|
{keyboardKey}
|
|
</span>
|
|
</div>
|
|
);
|
|
}
|