-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
VL-161_Add-label-slot-to-ULabel-component_Vitalii-Dudnik #326
VL-161_Add-label-slot-to-ULabel-component_Vitalii-Dudnik #326
Conversation
src/ui.form-label/ULabel.vue
Outdated
v-bind="labelAttrs" | ||
:data-test="`${dataTest}-label`" | ||
v-text="label" | ||
/> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
no, need to add slot inside of the label tag to keep label functionality and allow to place inside some custom component if needs.
<label
v-if="label"
:for="props.for"
v-bind="labelAttrs"
:data-test="`${dataTest}-label`"
>
<!-- @slot Use it to add something instead of label. + !!!define label slot prop-->
<slot name="label" :label="label">
{{ label }}
</slot>
</label>
src/ui.form-label/ULabel.vue
Outdated
:for="props.for" | ||
v-bind="labelAttrs" | ||
:data-test="`${dataTest}-label`" | ||
v-text="label" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
same
SlotLabel.args = { | ||
slotTemplate: ` | ||
<template #label> | ||
<ULink label="Link component label" color="green" /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
better to place inside UBadge for example and set to it label from ULabel component
src/ui.button-toggle/UToggle.vue
Outdated
@@ -86,6 +86,11 @@ const { toggleLabelAttrs, itemsAttrs, itemAttrs } = useUI<Config>(defaultConfig) | |||
v-bind="toggleLabelAttrs" | |||
:data-test="dataTest" | |||
> | |||
<template #label> | |||
<!-- @slot Use it to add something instead of label. --> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use this to add custom content instead of the label. - change for all translations.
and label slot props should be documented.
Add new "label" slot to ULabel component, add new story
https://ilevel.atlassian.net/jira/software/c/projects/VL/boards/11?selectedIssue=VL-161