How can I create a Country and Province select box using Advanced Select with Preline ?

[faruksaldir]

Hello everyone,
How can I create a Country and Province select box using Advanced Select with Preline? I didn't see a clear function among the Advanced Select functions. How can I update the province select box when the country changes?
`

document.addEventListener('DOMContentLoaded', function () {
HSStaticMethods.autoInit(['select']);

const countrySelect = document.querySelector('#country-select');
const provinceSelect = document.querySelector('#province-select');
const provinceWrapper = document.getElementById('province-wrapper');

const countryInstance = HSSelect.getInstance(countrySelect);
const provinceInstance = HSSelect.getInstance(provinceSelect);



// Country select change event
countryInstance.on('change', function (val) {
  const selectedOption = countrySelect.options[countrySelect.selectedIndex];
  const provinces = JSON.parse(selectedOption.getAttribute('data-provinces') || '[]');


  const currentOptions = provinceInstance.selectOptions;
  currentOptions.forEach(function(option) {
    provinceInstance.destroyOption(option.val);
  });

  if (provinces.length > 0) {

    provinceWrapper.classList.remove('hidden');


    provinces.forEach(function (province) {
      provinceInstance.addOption({
        title: province[0],  
        val: province[1]     
      });
    });
  } else {
    provinceWrapper.classList.add('hidden');
  }
});

});
`