feat(editor): bring back line width panel of brush in edgelss toolbar (#12514)

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

- **New Features**
  - Added the ability to select line width for pen tools, allowing users to customize brush and highlighter thickness in the toolbar menu.

- **Bug Fixes**
  - Restored and verified the functionality for adding brush elements with different sizes, ensuring accurate rendering of brush strokes based on selected size.

- **Improvements**
  - Enhanced slider component interaction by refining pointer event handling and updated slider styles for better touch interaction support.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

tests/blocksuite/e2e/edgeless/brush.spec.ts

@@ -120,8 +120,7 @@ test('keep same color when mouse mode switched back to brush', async ({
   await assertEdgelessColorSameWithHexColor(page, color, pickedColor);
 });
 
-// TODO(@fundon): should add it back?
-test.skip('add brush element with different size', async ({ page }) => {
+test('add brush element with different size', async ({ page }) => {
   await enterPlaygroundRoom(page);
   await initEmptyEdgelessState(page);
   await switchEditorMode(page);