<commit_before><!DOCTYPE html>
<html dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta content="width=device-width" name="viewport">
    <title>Color Picker</title>
    <link href="color-picker.min.css" rel="stylesheet">
    <style>

    .color-box {
      display: inline-block;
      width: 30px;
      height: 30px;
      border: 1px solid;
      cursor: pointer;
    }

    .color-picker {
      margin-top: -1px;
    }

    </style>
  </head>
  <body>
    <p>Replace text input with hidden input.</p>
    <p><input type="text"></p>
    <script src="color-picker.min.js"></script>
    <script>

    var input = document.querySelector('input'),
        box = document.createElement('div');

    box.className = 'color-box';
    box.style.backgroundColor = input.value;
    box.setAttribute('data-color', input.value);
    input.parentNode.insertBefore(box, input);
    input.type = 'hidden';

    var picker = new CP(box);

    picker.on('change', function(r, g, b, a) {
        input.value = this.color(r, g, b, a);
        this.source.style.backgroundColor = this.color(r, g, b, a);
    });

    </script>
  </body>
</html><commit_msg>Preserve Color Value on Next Pick<commit_after><!DOCTYPE html>
<html dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta content="width=device-width" name="viewport">
    <title>Color Picker</title>
    <link href="color-picker.min.css" rel="stylesheet">
    <style>

    .color-box {
      display: inline-block;
      width: 30px;
      height: 30px;
      border: 1px solid;
      cursor: pointer;
    }

    .color-picker {
      margin-top: -1px;
    }

    </style>
  </head>
  <body>
    <p>Replace text input with hidden input.</p>
    <p><input type="text"></p>
    <script src="color-picker.min.js"></script>
    <script>

    var input = document.querySelector('input'),
        box = document.createElement('div');

    box.className = 'color-box';
    box.style.backgroundColor = input.value;
    box.setAttribute('data-color', input.value);
    input.parentNode.insertBefore(box, input);
    input.type = 'hidden';

    var picker = new CP(box);

    picker.on('change', function(r, g, b, a) {
        var color = this.color(r, g, b, a);
        input.value = color;
        this.source.style.backgroundColor = color;
        this.source.setAttribute('data-color', color);
    });

    </script>
  </body>
</html>
{'fraction_non_alphanumeric': 0.16939890710382513, 'fraction_numerical': 0.0058848255569567045, 'mean_word_length': 2.6559139784946235, 'pattern_counts': {'":': 0, '<': 49, '<?xml version=': 0, '>': 49, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5292202', 'n_tokens_mistral': 817, 'n_tokens_neox': 789, 'n_words': 170}