Improve tooltip references for dropdown options

[willeastcott]

Fixes #1049

Summary

Improves tooltip reference text for dropdown fields across Components, Scene Settings, and Assets by formatting options as HTML lists with clear descriptions.

• Add HTML list formatting for dropdown option descriptions in tooltips
• Match UI labels to their corresponding API constants where applicable
• Clarify descriptions to explain what each option does

Changes

Material Asset

• Blend Type: None, Alpha, Additive, Additive Alpha, Subtractive, Multiply, etc. (with pc.BLEND_* constants)
• Cull Mode: None, Back Faces, Front Faces (with pc.CULLFACE_* constants)
• Projection (Environment): Normal, Box (with pc.CUBEPROJ_* constants)

Components

• Camera: Tonemapping, Gamma Correction, Projection
• Button: Transition Mode (with pc.BUTTON_TRANSITION_MODE_* constants)
• Collision: Type (Box, Sphere, Capsule, Cylinder, Cone, Mesh, Compound)
• Element: Type (with pc.ELEMENTTYPE_* constants)
• LayoutGroup: Orientation, Width Fitting, Height Fitting (with pc.ORIENTATION_*, pc.FITTING_* constants)
• Light: Type, Falloff Mode (with pc.LIGHTFALLOFF_* constants)
• Model: Type (Asset, Box, Capsule, Sphere, Cylinder, Cone, Plane)
• ParticleSystem: Sort, Blend Type, Emitter Shape, Orientation (with pc.PARTICLESORT_*, pc.EMITTERSHAPE_*, pc.PARTICLEORIENTATION_* constants)
• Render: Type (Asset, Box, Capsule, Sphere, Cylinder, Cone, Plane)
• RigidBody: Type (with pc.BODYTYPE_* constants)
• Screen: Scale Mode (None, Blend)
• Scrollbar: Orientation (with pc.ORIENTATION_* constants)
• ScrollView: Scroll Mode, Horizontal/Vertical Scrollbar Visibility (with pc.SCROLL_MODE_*, pc.SCROLLBAR_VISIBILITY_* constants)
• Sound: Distance Mode (Linear, Exponential, Inverse)
• Sprite: Type (with pc.SPRITETYPE_* constants)

Scene Settings

• Gizmo Preset: Default, Classic
• Camera Tonemapping: Linear, Filmic, Hejl, ACES, ACES2, Neutral
• Camera Gamma: 1.0, 2.2
• Sky Type: Infinite, Box, Dome
• Shadow Type: PCF 1x1, PCF 3x3, PCF 5x5
• Fog: None, Linear, Exponential, Exponential Squared (with pc.FOG_* constants)
• Resolution Mode: Auto, Fixed
• Fill Mode: None, Keep aspect ratio, Fill window
• Power Preference: Default, Low Power, High Performance
• Lightmapping Mode: Color Only, Color and Direction (with pc.BAKE_* constants)
• Mesh Compression: Disabled, Draco
• Animation Naming Strategy: Use Take Name, Use FBX Filename

Texture Assets

• Filtering: Point, Linear (with pc.FILTER_* constants)

• Address U/V: Repeat, Clamp, Mirror Repeat (with pc.ADDRESS_* constants)

• Compression Mode: ETC, ASTC

• Compression Quality: Lowest, Low, Default, High, Highest

• I confirm I have read the contributing guidelines

[Copilot]

Pull request overview

This pull request improves tooltip reference text for dropdown fields across the PlayCanvas Editor by adding HTML list formatting for dropdown options. The changes provide clearer descriptions for each option along with their corresponding PlayCanvas Engine API constants.

Changes:

• Added HTML list rendering support in tooltips with proper sanitization and styling
• Enhanced dropdown field descriptions across Components, Scene Settings, and Assets with formatted option lists and API constant references
• Added CSS styling for list elements and inline code blocks in tooltips

Reviewed changes

Copilot reviewed 21 out of 21 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
src/editor/attributes/reference/reference.ts	Added HTML tag processing for <ul>, <li>, and <code> tags with line break cleanup logic
src/common/tooltips.ts	Enabled unsafe HTML rendering for tooltip descriptions to allow formatted content
sass/editor/_editor-main.scss	Added CSS styling for list elements and code blocks in tooltips
src/editor/attributes/reference/settings.ts	Enhanced tooltips for scene settings dropdowns including tone mapping, gamma correction, fog types, fill mode, and more
src/editor/attributes/reference/components/camera.ts	Improved camera component tooltips for projection, tone mapping, and gamma correction
src/editor/attributes/reference/components/button.ts	Enhanced button transition mode tooltip with formatted options
src/editor/attributes/reference/components/collision.ts	Added formatted list for collision primitive types
src/editor/attributes/reference/components/element.ts	Enhanced element type tooltip with API constants
src/editor/attributes/reference/components/layoutgroup.ts	Improved layout group tooltips for orientation and fitting modes
src/editor/attributes/reference/components/light.ts	Enhanced light component tooltips for type and falloff mode
src/editor/attributes/reference/components/model.ts	Added formatted list for model types
src/editor/attributes/reference/components/particlesystem.ts	Improved particle system tooltips for sort, blend, emitter shape, and orientation
src/editor/attributes/reference/components/render.ts	Enhanced render component type tooltip
src/editor/attributes/reference/components/rigidbody.ts	Updated rigid body type tooltip with descriptions
src/editor/attributes/reference/components/screen.ts	Improved screen scale mode tooltip
src/editor/attributes/reference/components/scrollbar.ts	Enhanced scrollbar orientation tooltip
src/editor/attributes/reference/components/scroll-view.ts	Improved scroll view tooltips for scroll mode and scrollbar visibility
src/editor/attributes/reference/components/sound.ts	Enhanced sound distance model tooltip
src/editor/attributes/reference/components/sprite.ts	Updated sprite type tooltip with API constants
src/editor/attributes/reference/assets/material.ts	Improved material asset tooltips for blend type, cull mode, and cubemap projection
src/editor/attributes/reference/assets/texture.ts	Enhanced texture asset tooltips for filtering, addressing, and compression options

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Maksims]

Great addition.
May I suggest to use 8px padding-left instead of 20px? Bullet points already make it clear to read, and that wasted limited empty space on the left of a list could be used for information, as some tooltips can grow pretty long.

[willeastcott]

Great addition. May I suggest to use 8px padding-left instead of 20px? Bullet points already make it clear to read, and that wasted limited empty space on the left of a list could be used for information, as some tooltips can grow pretty long.

How's this?

[Maksims]

How's this?

Perfect!