Magento 2 : Is there a way to customize the labels of an admin form toggle?

Question

For admin form UI checkbox components that use the 'toggle' (like Catalog > Product > [product record] > Enabled) - I can see a few references to the UI component configuration using:

<field name="my_field">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
             <item name="sortOrder" xsi:type="number">15</item>
             <item name="dataType" xsi:type="string">boolean</item>
             <item name="formElement" xsi:type="string">checkbox</item>
             <item name="prefer" xsi:type="string">toggle</item>
             <item name="label" xsi:type="string" translate="true">Enabled</item>
             <item name="valueMap" xsi:type="array">
                  <item name="true" xsi:type="string">1</item>
                  <item name="false" xsi:type="string">0</item>
             </item>
             <item name="default" xsi:type="string">1</item>
        </argument>
     </field>

That'll give me the little toggle with the 'Yes / No' labels - is it possible to change the 'Yes / No' to something else? (Active / Inactive)

Answer 1

The labels cannot be changed within the uiComponent options but if you want to override the core functionality , you will have to override

It can be done, check edit.

vendor/magento/module-ui/view/base/web/js/form/element/single-checkbox.js

The yes/no value is returned by following block of code @line 57 of above file

if (this.prefer === 'toggle' && _.isEmpty(this.toggleLabels)) {
                this.toggleLabels = {
                    'on': $t('Yes'),
                    'off': $t('No')
                };
            }

EDIT :

So, I was not able to find example for toggleLabels in core but managed to figure it out by code above .

Just add this node to your component ;

<item name="toggleLabels" xsi:type="array">
           <item name="on" xsi:type="string">Active</item>
           <item name="off" xsi:type="string">Inactive</item>
</item>

You can replace Active and Inactive to whatever desired string .

Resultant xml will be ;

<field name="my_field">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
             <item name="sortOrder" xsi:type="number">15</item>
             <item name="dataType" xsi:type="string">boolean</item>
             <item name="formElement" xsi:type="string">checkbox</item>
             <item name="prefer" xsi:type="string">toggle</item>
             <item name="toggleLabels" xsi:type="array">
               <item name="on" xsi:type="string">Active</item>
               <item name="off" xsi:type="string">Inactive</item>
             </item>
             <item name="label" xsi:type="string" translate="true">Enabled</item>
             <item name="valueMap" xsi:type="array">
                  <item name="true" xsi:type="string">1</item>
                  <item name="false" xsi:type="string">0</item>
             </item>
             <item name="default" xsi:type="string">1</item>
        </argument>
     </field>