Skip to content

Feature Request: Conditionally Render Number Inputs Based on Attribute #4

Open
@7evenk

Description

@7evenk

Description:
Currently, the SliderWebcomponent always renders the number inputs alongside the range sliders. For enhanced flexibility and customization, we propose adding an attribute that controls the rendering of these number inputs. When this attribute is set, the number inputs should be created and displayed; otherwise, they should be omitted from the DOM entirely.

Proposed Solution:

Introduce a new attribute (e.g., show-number-inputs) to the SliderWebcomponent.
Modify the component's template rendering logic to conditionally include the number inputs based on the presence and value of this attribute.
Ensure that the component's behavior (such as event handling and attribute synchronization) remains consistent regardless of whether the number inputs are rendered.
Acceptance Criteria:

The number inputs are only rendered when the show-number-inputs attribute is present.
If the attribute is not set, only the range sliders are displayed.
The component functions correctly with or without the number inputs, maintaining all existing features and behaviors.
Example Usage:

<!-- Number inputs are rendered -->
<node-projects-slider value-min="10" value-max="50" min="0" max="100" show-number-inputs></node-projects-slider>

<!-- Number inputs are not rendered -->
<node-projects-slider value-min="10" value-max="50" min="0" max="100"></node-projects-slider>

Additional Notes:

This feature will enhance the usability of the component, allowing developers to choose a more compact slider-only UI when the number inputs are not necessary.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions