Dynamic Tile Grid - Copy this Angular, Tailwind Component to your project

create a tile grid structure that has fluid layout. The user should be able to change the position of each tile with mouse drag without changing the aspect ratio, the transition should be fast smooth & pleasing to the eyes. As soon as user drops the file, the layout should automatically update. The user should be able to change the width and height of each tile with mouse drag without changing the aspect ratio, the layout should update with each size change. The resize change icon should be clearly visible at the bottom right corner with 5px distance from right & bottom. Each tile should have a title text placeholder, that is editable as we type, text color, font, font size and other attributes should be editable. This is placed at the left top corner of the Each tile should have main text placeholder , that is editable as we type. text color, font, font size and other attributes should be editable. This should be placed in middle of the tile Each tile should have additional text placeholder, that is editable as we type. text color, font, font size and other attributes should be editable. This should be placed at the bottom of the tile Each tile should have 2 buttons, first button should have a gear icon that will open a modal window where the user can change the background color or add background image. The selected color should become the background color of the tile. The uploaded image should be set as background image of the tile. The modal window that opens after clicking gear icon should have the facility to change the font, font size, font color, for title, main text and additional text. Second button should have a cross icon that will delete the tile. There should be a provision to add new tiles to the structure There should be different mouse pointers for size change and position change.