Clarify how prop names and enum props converts into computed props in the code editor

Created on 15 May 2025, 1 day ago

Overview

If you create a prop name with an underscore (snake_case), in a code component, the computed prop name will be in camelCase. Maybe the developer expected the computed variable to be available as snake_case, but not as camelCase
(eg. my_prop_name will be computed to myPropName).

Even if we have documented in the default template with:

// under "Component data".
// The camelCased prop/slot name must match the argument name here
// (eg. "Card variant" → "cardVariant").

is not clear for snake_case props can be computed to camelCase and it can lead to a misunderstood.

This can also affect to enum props.

Proposed resolution

  • Improve the document in the default component template, indicating that snake_case prop names are converted in camelCased prop names.
  • Validate the prop name and forbid snake_case variables
  • Maybe include, underneath the prop name, the computed prop name (like the image attached)
    • User interface changes

      TBD

📌 Task
Status

Active

Version

0.0

Component

Code

Created by

🇪🇸Spain isholgueras

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024