Creating the new Personalization Option for Colored and Non-Colored personalization for Liquid Pixel products

<div class="pdp-order-wizard-promocodeform pdp-toggle-options personalizeType"
      id="pdp-order-wizard-promocodeform-personalize">
      <div class="pdp-order-wizard-promocodeform-expander-head" id="pdp-order-wizard-promocodeform-personalize-main"
        data-section="personalizeType">
        <a class="pdp-order-wizard-promocodeform-expander-head-toggle collapsed" data-toggle="collapse"
          data-target="#{{#if quickview}}in-modal-{{/if}}pdp-order-wizard-promocode-personalize" aria-expanded="false"
          aria-controls="pdp-order-wizard-promocode-personalize">
          {{translate '1. Personalization Information'}}
          <i class="pdp-order-wizard-promocodeform-expander-toggle-icon"></i>
        </a>
      </div>
      <div class="pdp-order-wizard-promocodeform-expander-body collapse" id="pdp-order-wizard-promocode-personalize"
        data-type="pdp-promo-code-container" data-action="show-promo-code-container" aria-expanded="false"
        data-target="#{{#if quickview}}in-modal-{{/if}}pdp-order-wizard-promocode-personalize">
        <div class="pdp-order-wizard-promocodeform-expander-container">
          <div>
            {{#each PersonalizationInfoList}}
            <div class="{{cartOptionId}}-controls-group" data-validation="control-group"
              data-container="personalizeType">
              <div class="pdp-controls personalization-label" id="pdp-controls-first" data-validation="control">
                <label for="{{cartOptionId}}">{{configuratorLabels}} : </label>
                <select class="product-views-option-text-input PersonaliseOutlineClass" {{#if showUploadLogo}}
                  name="showUploadLogo-block" {{/if}} data-action="field-trigger" data-id="{{cartOptionId}}"
                  type="{{type}}" id="{{cartOptionId}}-inputid">
                  <option value="" selected disabled>Choose an option</option>
                  {{#each values}}
                  {{#if internalid}}
                  <option value="{{internalid}}" data-available="{{isAvailable}}" {{#if selected}}selected{{/if}} {{#if
                    hide}} hidden {{/if}}> {{label}}</option>
                  {{/if}}
                  {{/each}}
                </select>
              </div>
            </div>
            {{/each}}


            <div class="pdp-controls" data-validation="control">
              <div class="pdp-first-continue">
                <div data-view="continue-warning-personalizeType"></div>
                <label class="continue-button open-next-tab"
                  data-current="pdp-order-wizard-promocodeform-personalizeType-main"
                  data-nextPointer="pdp-order-wizard-promocodeform-bank" data-section="personalizeType"
                  data-sectionNext="bankInfo"> Continue</label>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

selectedOption: {
                "sections": ["personalizeType", "bankInfo", "companyInfo", "logoInfo", "additionalInfo"],
                "mandatory": {},
                "default": { "custcol_ag_havepersonalization": "" },
                "visited": [],
                "data": {
                    "personalizeType": {
                        "custcol_ag_personalizationtype": { "displayOption": false, value: "", refValue: "", oldvalue: "", temp: "1" }
                    },
                  }
                }

if (currentitemid == "custcol_ag_personalizationtype") {
        self.selectedOptions.data["personalizeType"].custcol_ag_personalizationtype.temp = value;
}