[DevTools] Migrate checkbox label to a proper web component

third_party/WebKit/Source/devtools/front_end/elements/ClassesPaneWidget.js

 // Copyright (c) 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /**
  * @unrestricted
  */
 Elements.ClassesPaneWidget = class extends UI.Widget {
   constructor() {
     super();
     this.element.className = 'styles-element-classes-pane';
@@ skipping 82 matching lines @@
     this._input.disabled = !node;
 
     if (!node)
       return;
 
     var classes = this._nodeClasses(node);
     var keys = classes.keysArray();
     keys.sort(String.caseInsensetiveComparator);
     for (var i = 0; i < keys.length; ++i) {
       var className = keys[i];
-      var label = UI.createCheckboxLabel(className, classes.get(className));
+      var label = UI.CheckboxLabel.create(className, classes.get(className));
       label.visualizeFocus = true;
       label.classList.add('monospace');
       label.checkboxElement.addEventListener('click', this._onClick.bind(this, className), false);
       this._classesContainer.appendChild(label);
     }
   }
 
   /**
    * @param {string} className
    * @param {!Event} event
@@ skipping 145 matching lines @@
     if (!this._classNamesPromise || this._selectedFrameId !== selectedNode.frameId())
       this._classNamesPromise = this._getClassNames(selectedNode);
 
     return this._classNamesPromise.then(completions => {
       if (prefix[0] === '.')
         completions = completions.map(value => '.' + value);
       return completions.filter(value => value.startsWith(prefix)).map(completion => ({text: completion}));
     });
   }
 };