<?php
/**
 * Copyright 2014 Adobe
 * All Rights Reserved.
 */

/** @var $block \Magento\ConfigurableProduct\Block\Product\Configurable\AttributeSelector */
/** @var \Magento\Framework\View\Helper\SecureHtmlRenderer $secureRenderer */
?>

<?php
/** @var \Magento\Framework\Json\Helper\Data $jsonHelper */
$jsonHelper = $block->getData('jsonHelper');
$suggestWidgetOptions = /* @noEscape */ $jsonHelper->jsonEncode($block->getSuggestWidgetOptions());
$scriptString = <<<script
require(["jquery","mage/mage","mage/backend/suggest"], function($){
    var options = {$suggestWidgetOptions};
    $('#configurable-attribute-selector')
        .mage('suggest', options)
        .on('suggestselect', function (event, ui) {
            if (ui.item.id) {
                $('#configurable-attributes-container').trigger('add', ui.item);
            }
            $(this).val('');
            return false;
        })
        .on('suggestresponse', function(e, data, renderer) {
            var items = [];
            $.each(data, function(index, item) {
                if (!$('#configurable_attribute_' + item.id ).length) {
                    items.push(item);
                }
            });
            renderer(items);
            return false;
        })
});
script;
?>
<?= /* @noEscape */ $secureRenderer->renderTag('script', [], $scriptString, false) ?>