{"version":3,"file":"phoneNumberBox.obs.js","sources":["../../../Framework/Controls/phoneNumberBox.obs"],"sourcesContent":["<!-- Copyright by the Spark Development Network; Licensed under the Rock Community License -->\r\n<template>\r\n    <RockFormField v-model=\"internalValue\"\r\n                   v-bind=\"formFieldProps\"\r\n                   @change=\"onChange\"\r\n                   formGroupClasses=\"rock-phonenumber-box\"\r\n                   :rules=\"rules\"\r\n                   name=\"phonenumberbox\">\r\n        <template #default=\"{ uniqueId, field }\">\r\n            <div class=\"control-wrapper\">\r\n                <div class=\"input-group phone-number-box\" :class=\"inputGroupClasses\">\r\n                    <span v-if=\"availableCountryCodeOptions.length < 2\" class=\"input-group-addon\">\r\n                        <i class=\"fa fa-phone-square\"></i>\r\n                    </span>\r\n                    <InputGroupDropDown v-else :items=\"availableCountryCodeOptions\" v-model=\"countryCode\" inputGroupClasses=\"input-group-addon\" />\r\n                    <input v-model=\"internalValue\" :id=\"uniqueId\" type=\"text\" class=\"form-control\" v-bind=\"field\" />\r\n                </div>\r\n            </div>\r\n        </template>\r\n    </RockFormField>\r\n</template>\r\n\r\n<script lang=\"ts\" setup>\r\n    import { computed, PropType, ref, watch } from \"vue\";\r\n    import RockFormField from \"./rockFormField\";\r\n    import { PhoneNumberBoxGetConfigurationResultsBag } from \"@Obsidian/ViewModels/Rest/Controls/phoneNumberBoxGetConfigurationResultsBag\";\r\n    import { PhoneNumberCountryCodeRulesConfigurationBag } from \"@Obsidian/ViewModels/Rest/Controls/phoneNumberCountryCodeRulesConfigurationBag\";\r\n    import { standardRockFormFieldProps, useStandardRockFormFieldProps, useVModelPassthrough } from \"@Obsidian/Utility/component\";\r\n    import { normalizeRules } from \"@Obsidian/ValidationRules\";\r\n    import { getPhoneNumberConfiguration, formatPhoneNumber, stripPhoneNumber } from \"@Obsidian/Utility/phone\";\r\n    import { ListItemBag } from \"@Obsidian/ViewModels/Utility/listItemBag\";\r\n    import InputGroupDropDown from \"./inputGroupDropDown.obs\";\r\n\r\n    const props = defineProps({\r\n        /** v-model of Phone Number */\r\n        modelValue: {\r\n            type: String as PropType<string>,\r\n            default: \"\"\r\n        },\r\n\r\n        /** v-model of Country Code */\r\n        countryCode: {\r\n            type: String as PropType<string>,\r\n            default: \"\"\r\n        },\r\n\r\n        inputGroupClasses: {\r\n            type: String as PropType<string>,\r\n            default: \"\"\r\n        },\r\n\r\n        ...standardRockFormFieldProps\r\n    });\r\n\r\n    const emit = defineEmits<{\r\n        (e: \"update:modelValue\", value: string): void\r\n        (e: \"update:countryCode\", value: string): void\r\n    }>();\r\n\r\n\r\n    // #region Values\r\n\r\n    const internalValue = useVModelPassthrough(props, \"modelValue\", emit);\r\n    const countryCode = useVModelPassthrough(props, \"countryCode\", emit);\r\n    const formFieldProps = useStandardRockFormFieldProps(props);\r\n    const configuration = ref<PhoneNumberBoxGetConfigurationResultsBag | null>(null);\r\n\r\n    // #endregion\r\n\r\n    // #region Computed Values\r\n\r\n    const strippedValue = computed((): string => {\r\n        return stripPhoneNumber(internalValue.value);\r\n    });\r\n\r\n    const formattedValue = computed((): string => {\r\n        return formatPhoneNumber(strippedValue.value, getConfiguredRules());\r\n    });\r\n\r\n    const rules = computed(() => {\r\n        const rules = normalizeRules(props.rules);\r\n        rules.push(validatePhoneNumber);\r\n        return rules;\r\n    });\r\n\r\n    const availableCountryCodes = computed<string[]>(() => {\r\n        return Object.keys(configuration.value?.rules ?? {});\r\n    });\r\n\r\n    const availableCountryCodeOptions = computed<ListItemBag[]>(() => {\r\n        if (availableCountryCodes.value.length == 0) {\r\n            return [{ value: \"1\", text: \"1\" }];\r\n        }\r\n\r\n        return availableCountryCodes.value.map((val) => ({ value: val, text: val }));\r\n    });\r\n\r\n    // #endregion\r\n\r\n    // #region Functions\r\n\r\n    /** Uses the configuration we received from the server to determine whether the entered number is valid */\r\n    function validatePhoneNumber(value: unknown): string | boolean {\r\n        const rules = getConfiguredRules();\r\n\r\n        if (!value) {\r\n            return true;\r\n        }\r\n\r\n        if (rules.length == 0) {\r\n            return true;\r\n        }\r\n\r\n        for (let rule of rules) {\r\n            const regex = new RegExp(rule.match ?? \"\");\r\n\r\n            if (regex.test(strippedValue.value)) {\r\n                return true;\r\n            }\r\n        }\r\n\r\n        return `The phone number '${value}' is not a valid phone number.`;\r\n    }\r\n\r\n    /** Retrieve the country code data, validation data, and formatting data from the server */\r\n    async function loadConfiguration(): Promise<void> {\r\n        try {\r\n            const result = await getPhoneNumberConfiguration();\r\n\r\n            if (result) {\r\n                configuration.value = result;\r\n            }\r\n            else {\r\n                console.error(\"Unknown error while loading phone number configuration.\");\r\n            }\r\n        }\r\n        catch (e) {\r\n            console.error(e ?? \"Unknown error while loading phone number configuration.\");\r\n        }\r\n    }\r\n\r\n    /** Get the rules for the selected countryCode */\r\n    function getConfiguredRules(): PhoneNumberCountryCodeRulesConfigurationBag[] {\r\n        return configuration.value?.rules?.[countryCode.value] ?? [];\r\n    }\r\n\r\n    // #endregion\r\n\r\n    // #region Event Handlers\r\n\r\n    function onChange(): void {\r\n        internalValue.value = formattedValue.value;\r\n    }\r\n\r\n    // #endregion\r\n\r\n    // #region Watchers\r\n\r\n    watch(formattedValue, (): void => {\r\n        // The value that should be stored for phone number attribute values is the formatted version.\r\n        // This seems backwards, but actually keeps parity with the web forms functionality.\r\n        emit(\"update:modelValue\", formattedValue.value);\r\n    }, { immediate: true });\r\n\r\n    watch(() => props.modelValue, (): void => {\r\n        internalValue.value = formattedValue.value;\r\n    }, {\r\n        immediate: true\r\n    });\r\n\r\n    watch([configuration, availableCountryCodes], (): void => {\r\n        // If we don't have any country codes from the server, ignore\r\n        if (configuration.value == null || availableCountryCodes.value.length == 0) return;\r\n\r\n        // If no country code set or the set country code isn't in the list of available codes, then change it to the default\r\n        if (countryCode.value == null || !availableCountryCodes.value.includes(countryCode.value)) {\r\n            countryCode.value = availableCountryCodes.value[0];\r\n        }\r\n    });\r\n\r\n    // #endregion\r\n\r\n    loadConfiguration();\r\n\r\n</script>"],"names":["internalValue","useVModelPassthrough","props","emit","countryCode","formFieldProps","useStandardRockFormFieldProps","configuration","ref","strippedValue","computed","stripPhoneNumber","value","formattedValue","formatPhoneNumber","getConfiguredRules","rules","normalizeRules","push","validatePhoneNumber","availableCountryCodes","_configuration$value$","_configuration$value","Object","keys","availableCountryCodeOptions","length","text","map","val","_i","_rules","_rule$match","rule","regex","RegExp","match","test","concat","loadConfiguration","_loadConfiguration","apply","arguments","_asyncToGenerator","result","getPhoneNumberConfiguration","console","error","e","_configuration$value$2","_configuration$value2","_configuration$value3","onChange","watch","immediate","modelValue","includes"],"mappings":"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"}