feat(component): new component to edit icon and name (#12921)

https://github.com/user-attachments/assets/994f7f58-bcbe-4f26-9142-282ffa5025f9



<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Introduced an icon and name editor component, allowing users to select
emoji icons and edit names within a menu popover.
- Added an emoji picker for icon selection, supporting theme adaptation.
- **Style**
- Applied new styles for the icon and name editor, including emoji
picker appearance.
- **Documentation**
- Added Storybook stories to showcase and demonstrate the new icon and
name editor component.
- **Chores**
- Added emoji-related dependencies to support emoji selection features.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

yarn.lock

@@ -314,6 +314,8 @@ __metadata:
     "@blocksuite/affine": "workspace:*"
     "@blocksuite/icons": "npm:^2.2.12"
     "@chromatic-com/storybook": "npm:^4.0.0"
+    "@emoji-mart/data": "npm:^1.2.1"
+    "@emoji-mart/react": "npm:^1.1.1"
     "@emotion/react": "npm:^11.14.0"
     "@emotion/styled": "npm:^11.14.0"
     "@radix-ui/react-avatar": "npm:^1.1.2"
@@ -344,6 +346,7 @@ __metadata:
     check-password-strength: "npm:^3.0.0"
     clsx: "npm:^2.1.1"
     dayjs: "npm:^1.11.13"
+    emoji-mart: "npm:^5.6.0"
     foxact: "npm:^0.2.45"
     jotai: "npm:^2.10.3"
     lit: "npm:^3.2.1"
@@ -5438,6 +5441,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@emoji-mart/react@npm:^1.1.1":
+  version: 1.1.1
+  resolution: "@emoji-mart/react@npm:1.1.1"
+  peerDependencies:
+    emoji-mart: ^5.2
+    react: ^16.8 || ^17 || ^18
+  checksum: 10/def4dddaa01ce88c396510d84d1878b881fe0f9c484a836a50e3db784a91ab98edf94816cff503b4d1cab7b00400a01c87e32d19dee2d950f64ef9243f79101e
+  languageName: node
+  linkType: hard
+
 "@emotion/babel-plugin@npm:^11.13.5":
   version: 11.13.5
   resolution: "@emotion/babel-plugin@npm:11.13.5"