/* Basic styles for stepper inner textbox */
.stepper input[type="text"] {
@include box-defaults;
@include valo-textfield-style;
&:focus {
@include valo-textfield-focus-style;
}
}
<span class="hljs-comment">/* Placing stepper component into the unwrapped hbox container */</span>
box.addComponent(stepper);
<span class="hljs-comment">/* Defining stepper size to fit 100% of the parent hbox component width */</span>
stepper.setWidth(<span class="hljs-string">"100%"</span>);
<span class="hljs-comment">/* Adding listener to show notification when stepper value is changed */</span>
stepper.addValueChangeListener(event -&gt;
showNotification(<span class="hljs-string">"Value has been changed to "</span> + stepper.getValue(), NotificationType.<em>HUMANIZED</em>)
);