251.mjs

/**
* @file development/issues/open/251.mjs
* @url https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/251
* @description investigate the reloading of select
* @issue 251
*/

import "../../../source/components/style/property.pcss";
import "../../../source/components/style/link.pcss";
import "../../../source/components/style/color.pcss";
import "../../../source/components/style/theme.pcss";
import "../../../source/components/style/normalize.pcss";
import "../../../source/components/style/typography.pcss";
import "../../../source/components/form/select.mjs";

const select = document.createElement('monster-select');

select.setOption('type', 'checkbox');
select.setOption('mapping.labelTemplate', '${name} (${alpha-2})')
select.setOption('mapping.valueTemplate', '${country-code}')
select.setOption('filter.mode', 'options');
select.setOption('filter.position', 'popper');


select.importOptions([
    {
        "name": "United Kingdom",
        "alpha-2": "GB",
        "country-code": "826",
    },
    {
        "name": "Sweden",
        "alpha-2": "SE",
        "country-code": "752",

    },
    {
        "name": "Germany",
        "alpha-2": "DE",
        "country-code": "276",
    }
]);

document.getElementById('uGhach43').appendChild(select);