fix(editor): use onBlur for input handling in property menu (#14049)

Eliminate mobile-specific input handling from the property menu to
streamline functionality across devices.


Before


https://github.com/user-attachments/assets/563857c9-6d2f-4c38-9359-7e3e74dfb531


After


https://github.com/user-attachments/assets/0126b966-cdc2-40b7-b416-3a0e8be4aedf


Maybe related to
https://github.com/toeverything/blocksuite/pull/7524/files#diff-25406bbadb23338f3120c8d0c5e1e8485173750a57f1ba3d7a51be1c9f548696
https://github.com/toeverything/blocksuite/pull/8787/files#diff-36fb3de4c5129393febe0286eb10e9ebb791296500dc4229c9d609b9ed5e138c

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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved input field responsiveness by enhancing event handling for
blur interactions.
  
* **Improvements**
* Unified input component behavior across all platforms for more
consistent user experience.

<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
Whitewater
2025-12-05 14:37:15 +08:00
committed by GitHub
parent bcc892c8ec
commit 1196101226
2 changed files with 9 additions and 16 deletions

View File

@@ -1,25 +1,10 @@
import { menu } from '@blocksuite/affine-components/context-menu';
import { IS_MOBILE } from '@blocksuite/global/env';
import { html } from 'lit/static-html.js';
import { renderUniLit } from '../utils/uni-component/index.js';
import type { Property } from '../view-manager/property.js';
export const inputConfig = (property: Property) => {
if (IS_MOBILE) {
return menu.input({
prefix: html`
<div class="affine-database-column-type-menu-icon">
${renderUniLit(property.icon)}
</div>
`,
initialValue: property.name$.value,
placeholder: 'Property name',
onChange: text => {
property.nameSet(text);
},
});
}
return menu.input({
prefix: html`
<div class="affine-database-column-type-menu-icon">
@@ -28,7 +13,7 @@ export const inputConfig = (property: Property) => {
`,
initialValue: property.name$.value,
placeholder: 'Property name',
onComplete: text => {
onBlur: text => {
property.nameSet(text);
},
});