0xD34F

Вместо назначения индивидуальных обработчиков каждому элементу сделать один делегированный:

document.addEventListener('click', ({ target: t }) => {
  if (t.classList.contains('box')) {
    for (const n of document.querySelectorAll('.box')) {
      n.style.background = n === t ? 'red' : 'black';
    }
  }
});

Меняет только value в input без изменения модели

v-model слушает событие input, так что добавьте event.target.dispatchEvent(new Event('input'))

\d+(?![A-Za-z])

this.slider.current.slick.slideCount

Вешаете обработчик mousedown, в котором запоминаете target. При обработке клика проверяете, что текущий target совпадает с запомненным - если да, тогда можно закрывать окно.

function getDatesGroupedByWeekday(year, month) {
  const d = new Date(`${month} 1, ${year}`);
  const iMonth = d.getMonth();
  const result = {};

  while (d.getMonth() === iMonth) {
    const date = d.getDate();
    const weekday = d.toLocaleString('en-US', { weekday: 'long' });
    (result[weekday] = result[weekday] ?? []).push(date);
    d.setDate(date + 1);
  }

  return result;
}

optional chaining:

if (response?.data?.users?.length) {

пишет что state is equal

basketItems: state.basketItems.sort((a, b) => a.price - b.price),

Ну как бы да - что было, то и осталось. Метод sort не создаёт новый массив. Копируйте массив, и сортируйте копию.

array_sum(array_column($basket, 'quantity'))

options: {
  legend: {
    onClick: null,
  },
},

пробел после запятой уберите

options: {
  scales: {
    yAxes: [
      {
        ticks: {
          stepSize: 1,
        },
      },
    ],
  },
},

После кого и во что надо оборачивать:

const block = document.querySelector('.block');
const wrapper = document.createElement('div');
wrapper.classList.add('another__block');

Вариант раз - вычисляем индекс блока внутри родителя, вырезаем из родителя подмассив вложенных узлов, начиная с индекс плюс один, вставляем в обёртку:

const parent = block.parentNode;
const childNodes = [...parent.childNodes];
wrapper.append(...childNodes.slice(childNodes.indexOf(block) + 1));
parent.append(wrapper);

Вариант два - пока у блока есть следующий узел, добавляем его в обёртку:

for (; block.nextSibling; wrapper.appendChild(block.nextSibling)) ;
block.after(wrapper);

fetch('https://jsonplaceholder.typicode.com/albums')
  .then(r => r.json())
  .then(r => {
    const keys = [ 'userId', 'id', 'title' ];

    // собираем разметку
    document.body.insertAdjacentHTML('beforeend', `
      <div class="wrapper">${r.map(n => `
        <div class="item">${keys.map(k => `
          <div>${k}: ${n[k]}</div>`).join('')}
        </div>`).join('')}
      </div>
    `);

    // или, создаём элементы напрямую
    function createElement(tag, className, children) {
      const el = document.createElement(tag);
      el.className = className;
      el.append(...children);
      return el;
    }

    document.body.append(
      createElement('div', 'wrapper', r.map(n =>
        createElement('div', 'item', keys.map(k =>
          createElement('div', '', [ `${k}: ${n[k]}` ])
        ))
      ))
    );
  });

.wrapper {
  border: 3px solid black;
  padding: 10px;
  margin: 10px;
}

.item {
  border: 1px solid silver;
  padding: 5px;
  margin: 5px;
}

Вместо .text((d, i) => { ... пусть будет

.each((d, i, a) => {
  const el = d3.select(a[i]);
  const max = this.lineData[i];
  let value = 0;

  const intervalId = setInterval(() => {
    if (++value == max) {
      clearInterval(intervalId);
    }

    el.text(value);
  }, 500 / max);
});

Пусть Search хранит значение, которое вводит пользователь, и принимает обработчик клика по кнопке, которому при вызове будет передаваться значение:

const Search = props => {
  const [ value, setValue ] = React.useState('');

  return (
    <div>
      <input type="text" value={value} onChange={e => setValue(e.target.value)} />
      <button onClick={() => props.onSearch(value)}>Search</button>
    </div>
  );
};

А в родительском компоненте, соответственно, в Search передаёте функцию, которая обновит что там вам надо:

<Search onSearch={search => setValue({ ...value, inputValue: search })} />

https://jsfiddle.net/fp0dvhrg/

Класс лучше переключайте не у .img-block, а у их самых дальних не общих предков, т.е., у .documents_block. В этом случае не придётся переписывать js-код, если вдруг потребуется стилизовать ещё-что то, кроме .img-block, или если решите изменить внутреннюю структуру .documents_block. Вместо .класс дополнительные стили надо будет прописывать у .класс .img-block.

const itemSelector = '.documents_block';
const buttonSelector = `${itemSelector} .open-doc-list`;
const contentSelector = '.documents-content';
const activeClass = 'active';
const toggleEffect = 'slideToggle'; // или fadeToggle, или toggle
const onClick = e => $(e.currentTarget)
  .closest(itemSelector)
  .toggleClass(activeClass)
  .find(contentSelector)
  [toggleEffect]();


// обработчик клика подключаем к кнопкам
$(buttonSelector).click(onClick);

// или, если предполагается добавление новых блоков уже после подключения
// обработчика, то лучше будет повесить его на документ, тогда всё будет
// работать как надо без каких-либо дополнительных действий
$(document).on('click', buttonSelector, onClick);

const fourValues = four.map(Object.values);

const result = three.map(n => {
  const values = Object.values(n);
  const intersections = fourValues.filter(m => values.every(v => m.includes(v)));
  return `${values} - ${intersections.length
    ? `входит в / ${intersections.map(m => `${m}`).join(' / ')} /`
    : 'нет вхождений'}`;
});

$('.bakeries-slider').each(function() {
  $('.bakeries-slider__span', this).text(i => `${i + 1}.`);
});

или

for (const n of document.querySelectorAll('.bakeries-slider')) {
  n.querySelectorAll('span').forEach((m, i) => m.innerText = ++i + '.');
}

или

[].forEach.call(document.getElementsByClassName('bakeries-slider'), n => {
  const slides = n.getElementsByTagName('span');
  for (let i = 0; i < slides.length; i++) {
    slides[i].textContent = ''.concat(-~i, '.');
  }
});