ロングノーツ中点・終点にwidthオプション追加

[mtsgi]

This pull request adds support for specifying and visualizing the width of type 1/89 notes, updates the UI to allow editing this new property, and ensures that the rendering logic and tests handle variable note widths correctly. It also refines the layout and user experience for note editing forms.

Support for variable note widths:

• Added a width (Float) option to type 1/89 notes, documented in CHART_TYPES.md, and updated the description and option list accordingly.
• Updated the note option logic and tests to handle the new width property, including validation and default value trimming in getValidatedOptions and noteOptions. [1] [2]

UI changes for editing note width:

• Modified EndForm.vue and LongNote.vue to add a field for editing the width property of note ends, and adjusted the responsive layout of note editing forms. [1] [2] [3] [4] [5] [6] [7]

Rendering and visualization updates:

• Updated rendering logic in LongNote.vue and NoteShadow.vue to use the width property when calculating note positions and widths, ensuring correct visual representation of variable-width notes. [1] [2] [3] [4] [5] [6]

SVG path generation and related tests:

• Modified the SVG path generation for hold notes to support different start and end widths, and updated related unit tests to verify this behavior. [1] [2] [3]

Miscellaneous improvements:

• Refactored and improved the clarity of note editing and tooltip logic, and made minor UI/UX enhancements such as button labeling and error handling. [1] [2] [3] [4] [5]

These changes collectively enable users to specify, edit, and visualize the width of certain note types, improving the flexibility and expressiveness of the chart editor.

[Copilot]

Pull request overview

This PR extends the chart editor’s note model and rendering to support variable widths for type 1/89 nodes (normal / long-note midpoint & endpoint), adds UI controls to edit that width, and updates SVG hold-path generation to support different start/end widths.

Changes:

• Added a new width option to type 1/89 option definitions and documented it in CHART_TYPES.md.
• Updated option validation (getValidatedOptions) and unit tests to include and trim the new width option appropriately.
• Updated Long Note / shadow rendering to compute node/segment geometry using per-node widths, and updated editing forms/layout to expose the width field.

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
src/composables/useNoteTypes.ts	Adds width option metadata and updates hold SVG path generation to support different start/end widths.
src/composables/useNoteCheck.ts	Extends option normalization for type 1/89 to include the new width option.
src/composables/tests/useNoteTypes.test.ts	Updates expectations for new option list and verifies SVG path generation with differing widths.
src/composables/tests/useNoteCheck.test.ts	Adds test coverage for width retention and trimming behavior in validated options.
src/components/NoteShadow.vue	Updates shadow rendering geometry and hold segment generation to reflect variable widths.
src/components/LongNote.vue	Updates long note rendering + editing UI to handle width-aware layout and improved form UX.
src/components/EndForm.vue	Adds UI + reactive wiring for editing end-node width option.
CHART_TYPES.md	Documents the new width option for type 1/89.

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.