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 -->

blocksuite/affine/components/src/slider/slider.ts

@@ -92,7 +92,7 @@ export class Slider extends WithDisposable(LitElement) {
 
     const dispose = on(this, 'pointermove', this._onPointerMove);
     this._disposables.add(once(this, 'pointerup', dispose));
-    this._disposables.add(once(this, 'pointerout', dispose));
+    this._disposables.add(once(this, 'pointerleave', dispose));
   };
 
   private readonly _onPointerMove = (e: PointerEvent) => {

blocksuite/affine/components/src/slider/styles.ts

@@ -2,6 +2,11 @@ import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme';
 import { css } from 'lit';
 
 export const styles = css`
+  :host {
+    display: block;
+    touch-action: none;
+  }
+
   :host([disabled]) {
     opacity: 0.5;
     pointer-events: none;