cronofy-elements 1.48.2 → 1.49.2

package/src/js/helpers/init.DateTimePicker.js

@@ -1,219 +0,0 @@
-import moment from "moment-timezone";
-
-import {
-    parseConnectionDomains,
-    parseQuery,
-    parseTarget,
-    parseTimezone,
-    parseToken,
-    parseTranslations,
-    validateLocaleModifiers,
-} from "./init";
-import { logConstructor } from "./logging";
-import { queryForDateTimePicker, sequencedQueryForDateTimePicker } from "./mocks";
-
-import {
-    getMonthsFromQuery,
-    parseQuery as parseWithOverlappingSlots,
-} from "../components/DateTimePicker/utils/slots";
-
-export const parseDateTimePickerOptions = (options = {}) => {
-    const config = typeof options.config === "undefined" ? {} : options.config;
-    const logs = typeof config.logs === "undefined" ? "warn" : config.logs;
-    const log = logConstructor(logs, "Date Time Picker", options.callback);
-
-    const startDay =
-        typeof config.week_start_day === "undefined" ? "sunday" : config.week_start_day;
-
-    const validDays = [
-        "sunday",
-        "monday",
-        "tuesday",
-        "wednesday",
-        "thursday",
-        "friday",
-        "saturday",
-    ];
-    const validStartDay = validDays.includes(startDay);
-
-    if (!validStartDay) {
-        log.error(
-            `Please provide a valid \`config.week_start_day\`. \`${startDay}\` is not a supported value.`,
-            {
-                docsSlug: "availability-viewer/#config.week_start_day",
-            }
-        );
-        return false;
-    }
-
-    const mode = typeof config.mode === "undefined" ? "confirm" : config.mode;
-    const validModes = ["confirm", "no_confirm"];
-    const validMode = validModes.includes(mode);
-    if (!validMode) {
-        log.error(`Please provide a valid \`config.mode\`. \`${mode}\` is not a supported value.`, {
-            docsSlug: "date-time-picker/#config.mode",
-        });
-        return false;
-    }
-
-    const demoMode = typeof options.demo === "undefined" ? false : options.demo;
-    if (demoMode) {
-        log.warn("You are running in demo mode. No API requests will be made");
-    }
-
-    const token = parseToken(options, "date-time-picker", log);
-    if (!token && !demoMode) {
-        log.error(
-            "You need to include an `element_token`. If you're just testing (and don't want to use real API data) you can set the `demo` option to `true` to bypass the API connection and view dummy content."
-        );
-        return false;
-    }
-
-    const target = parseTarget(options, "date-time-picker", log);
-
-    const isBookableEventsQuery = options.availability_query.bookable_events ? true : false;
-    const isSequencedAvailabilityQuery = options.availability_query.sequence ? true : false;
-
-    let query;
-    if (options.demo && !isSequencedAvailabilityQuery) {
-        query = queryForDateTimePicker;
-    } else if (options.demo && isSequencedAvailabilityQuery) {
-        query = sequencedQueryForDateTimePicker;
-    } else if (isBookableEventsQuery) {
-        query = options.availability_query;
-        query = parseWithOverlappingSlots(query);
-    } else if (isSequencedAvailabilityQuery) {
-        query = options.availability_query;
-        query = parseWithOverlappingSlots(query);
-    } else {
-        query = parseQuery({ options, elementSlug: "date-time-picker", log });
-        query = parseWithOverlappingSlots(query);
-    }
-
-    if (isSequencedAvailabilityQuery) {
-        const isOneTitlePresent = query.sequence.some(obj =>
-            Object.keys(obj).includes("sequence_title")
-        );
-
-        if (isOneTitlePresent) {
-            const isEveryTitlePresent = query.sequence.every(obj =>
-                Object.keys(obj).includes("sequence_title")
-            );
-
-            if (!isEveryTitlePresent) {
-                log.error("There is a missing `sequence_title` from at least one sequence event.");
-                return false;
-            }
-        }
-    }
-
-    if (typeof config.slot_button_mode !== "undefined" && !isSequencedAvailabilityQuery) {
-        log.warn(
-            `\`config.slot_button_mode\`. can only be used with a sequenced availability query. Setting this option on a regular availability query will have no effect.`
-        );
-    }
-
-    const slotButtonMode =
-        typeof config.slot_button_mode === "undefined" ? "summary" : config.slot_button_mode;
-
-    const validSlotButtonModes = ["summary", "detailed"];
-    const validSlotButtonMode = validSlotButtonModes.includes(slotButtonMode);
-
-    if (isSequencedAvailabilityQuery && !validSlotButtonMode) {
-        log.error(
-            `Please provide a valid \`config.slot_button_mode\`. \`${slotButtonMode}\` is not a supported value.`,
-            {
-                docsSlug: "date-time-picker/#config.slot_button_mode",
-            }
-        );
-        return false;
-    }
-
-    const tzid = parseTimezone(options.tzid, "date-time-picker", log);
-
-    const tzList = typeof config.tz_list === "undefined" ? false : config.tz_list;
-
-    const domains = parseConnectionDomains(
-        options.data_center,
-        options.api_domain,
-        options.app_domain
-    );
-
-    const translations = parseTranslations(options.translations, "availability_rules");
-
-    const modifier =
-        typeof options.locale_modifiers !== "undefined" ? options.locale_modifiers : null;
-    const isValidLocaleModifiers = modifier ? validateLocaleModifiers(modifier) : true;
-    if (!isValidLocaleModifiers) {
-        log.warn("`locale_modifiers is invalid. Modifiers will fallback to the default.`", {
-            docsSlug: "#locale-modifiers",
-        });
-    }
-
-    let selectedDate = config.selected_date;
-    if (typeof selectedDate !== "undefined") {
-        const validDate = moment(selectedDate, "YYYY-MM-DD", true).isValid();
-
-        if (!validDate) {
-            log.warn(
-                `The provided date ${selectedDate} is not valid. Please ensure it's formatted like "YYYY-MM-DD". Picking the first available date as starting date.`,
-                {
-                    docsSlug: "#config.start_date",
-                }
-            );
-
-            selectedDate = undefined;
-        }
-    }
-
-    const months = getMonthsFromQuery(query?.query_periods, tzid.tzid);
-    const selectedDateMoment = selectedDate && moment(selectedDate, "YYYY-MM-DD");
-
-    let startDateMoment = months.length
-        ? moment(months[0], "YYYY-MM").startOf("month")
-        : moment().startOf("month");
-
-    if (selectedDateMoment?.isBefore(startDate)) {
-        startDateMoment = selectedDateMoment;
-    }
-
-    let endDateMoment = months.length
-        ? moment(months[months.length - 1], "YYYY-MM").endOf("month")
-        : moment().endOf("month");
-
-    if (selectedDateMoment?.isAfter(endDateMoment)) {
-        endDateMoment = selectedDateMoment;
-    }
-
-    const startDate = startDateMoment.format("YYYY-MM-DD");
-    const endDate = endDateMoment.format("YYYY-MM-DD");
-
-    delete options.availability_query;
-    delete options.element_token;
-    delete options.target_id;
-    delete options.translations;
-    delete config.week_start_day;
-    delete config.tz_list;
-
-    return {
-        ...options,
-        ...tzid,
-        target,
-        token,
-        domains,
-        query,
-        config: {
-            ...config,
-            mode,
-            logs,
-            startDay,
-            selectedDate,
-            startDate,
-            endDate,
-            tzList,
-            slotButtonMode,
-        },
-        translations,
-        log,
-    };
-};

package/src/js/helpers/init.SlotPicker.js

@@ -1,89 +0,0 @@
-import {
-    parseConnectionDomains,
-    parseQuery,
-    parseTarget,
-    parseTimezone,
-    parseToken,
-    parseTranslations,
-    validateLocaleModifiers,
-} from "./init";
-import { logConstructor } from "./logging";
-
-export const parseSlotPickerOptions = (options = {}) => {
-    const config = typeof options.config === "undefined" ? {} : options.config;
-    const logs = typeof config.logs === "undefined" ? "warn" : config.logs;
-    const log = logConstructor(logs, "Slot Picker", options.callback);
-
-    const mode = typeof config.mode === "undefined" ? "confirm" : config.mode;
-    const validModes = ["confirm", "no_confirm"];
-    const validMode = validModes.includes(mode);
-    if (!validMode) {
-        log.error(`Please provide a valid \`config.mode\`. \`${mode}\` is not a supported value.`, {
-            docsSlug: "slot-picker/#config.mode",
-        });
-        return false;
-    }
-
-    const demoMode = typeof options.demo === "undefined" ? false : options.demo;
-    if (demoMode) {
-        log.warn("You are running in demo mode. No API requests will be made");
-    }
-
-    const token = parseToken(options, "slot-picker", log);
-    if (!token && !demoMode) {
-        log.error(
-            "You need to include an `element_token`. If you're just testing (and don't want to use real API data) you can set the `demo` option to `true` to bypass the API connection and view dummy content."
-        );
-        return false;
-    }
-
-    const target = parseTarget(options, "slot-picker", log);
-
-    const isBookableEventsQuery = options.availability_query.bookable_events ? true : false;
-
-    let query;
-    if (isBookableEventsQuery) {
-        query = options.availability_query;
-    } else {
-        query = parseQuery({ options, elementSlug: "slot-picker", log });
-    }
-
-    const tzid = parseTimezone(options.tzid, "slot-picker", log);
-
-    const domains = parseConnectionDomains(
-        options.data_center,
-        options.api_domain,
-        options.app_domain
-    );
-
-    const translations = parseTranslations(options.translations, "availability_rules");
-
-    const modifier =
-        typeof options.locale_modifiers !== "undefined" ? options.locale_modifiers : null;
-
-    const isValidLocaleModifiers = modifier ? validateLocaleModifiers(modifier) : true;
-    if (!isValidLocaleModifiers) {
-        log.warn(
-            "`locale_modifiers has an invalid value. Invalid modifiers will fallback to the default.`",
-            {
-                docsSlug: "#locale-modifiers",
-            }
-        );
-    }
-
-    delete options.availability_query;
-    delete options.element_token;
-    delete options.target_id;
-    delete options.translations;
-
-    return {
-        ...options,
-        ...tzid,
-        target,
-        token,
-        domains,
-        query,
-        config: { ...config, mode, logs },
-        translations,
-    };
-};

package/src/js/helpers/init.js

@@ -1,308 +0,0 @@
-import merge from "deepmerge";
-import { translations } from "./translations";
-import moment from "moment-timezone";
-import { modifierDateFormats } from "./i18n";
-import { nestedValue } from "./utils";
-
-export const parseConnectionDomains = (
-    dataCenter = false,
-    customApiDomain = false,
-    customAppDomain = false
-) => {
-    let dataCenterSuffix = dataCenter && dataCenter !== "us" ? `-${dataCenter}` : "";
-    let apiDomain;
-
-    if (customApiDomain) {
-        // If the "domain" starts with a protocol, we can assume it is
-        // a full path. Otherwise assume it is *actually* a domain, so add our
-        // protocol (everyone should be using HTTPS)
-        apiDomain = customApiDomain.startsWith("http")
-            ? customApiDomain
-            : `https://${customApiDomain}`;
-    } else {
-        apiDomain = `https://api${dataCenterSuffix}.cronofy.com`;
-    }
-
-    let appDomain = customAppDomain || `https://app${dataCenterSuffix}.cronofy.com`;
-    return {
-        apiDomain,
-        appDomain,
-    };
-};
-
-export const parseToken = (options, elementSlug = false, log) => {
-    const docsHash = elementSlug ? `#${elementSlug}` : "";
-    let token = false;
-    if (typeof options.token !== "undefined") {
-        log.warn(
-            "`token` option has been deprecated in v1.0.0. Please use `element_token` option instead.",
-            { docsSlug: `upgrade-v0-to-v1/${docsHash}` }
-        );
-        token = options.token;
-    }
-    if (typeof options.element_token !== "undefined") {
-        token = options.element_token;
-    }
-    return token;
-};
-
-export const parseTarget = (options, elementSlug, log) => {
-    const docsHash = elementSlug ? `#${elementSlug}` : "";
-    let target = false;
-
-    if (typeof options.target !== "undefined") {
-        log.warn(
-            "`target` option has been deprecated in v1.0.0. Please use `target_id` option instead.",
-            { docsSlug: `upgrade-v0-to-v1/${docsHash}` }
-        );
-        target = options.target;
-    }
-    if (typeof options.target_id !== "undefined") {
-        target = options.target_id;
-    }
-
-    if (!target) {
-        log.warn(
-            `Using the default ID \`cronofy-element-${elementSlug}\` for mounting markup. You should specify a custom ID for your mounting point.`
-        );
-        target = `cronofy-element-${elementSlug}`;
-    }
-
-    return target;
-};
-
-export const parseQuery = ({ options, elementSlug, log, allowEmpty = false }) => {
-    const docsHash = elementSlug ? `#${elementSlug}` : "";
-    let query = false;
-
-    if (typeof options.query !== "undefined") {
-        log.warn(
-            "`query` option has been deprecated in v1.0.0. Please use `availability_query` option instead.",
-            { docsSlug: `upgrade-v0-to-v1/${docsHash}` }
-        );
-        query = options.query;
-    }
-
-    if (typeof options.availability_query !== "undefined") {
-        query = options.availability_query;
-
-        if (
-            typeof query.available_periods !== "undefined" &&
-            typeof query.query_periods !== "undefined"
-        ) {
-            log.error(
-                "You have provided an `availability_query.query_periods` option alongside an `availability_query.available_periods` option. Please only provide `availability_query.query_periods`",
-                { docsSlug: "availability-viewer/#availability_query" }
-            );
-            return false;
-        }
-
-        if (typeof query.available_periods !== "undefined") {
-            query.query_periods = query.available_periods;
-            delete query.available_periods;
-        }
-
-        if (typeof query.query_periods === "undefined") {
-            log.error("You need to provide an `availability_query.query_periods` option.", {
-                docsSlug: "availability-viewer/#availability_query",
-            });
-            return false;
-        }
-
-        if (!validateQueryPeriods(query.query_periods, log, allowEmpty)) return false;
-
-        if (typeof query.required_duration === "undefined") {
-            log.error("You need to provide an `availability_query.required_duration` option.", {
-                docsSlug: "availability-viewer/#availability_query",
-            });
-            return false;
-        }
-    }
-
-    if (!query) {
-        log.error("You need to provide an `availability_query` option.", {
-            docsSlug: "availability-viewer/#availability_query",
-        });
-    }
-
-    return query;
-};
-
-const validateQueryPeriods = (query_periods, log, allowEmpty = false) => {
-    if (!Array.isArray(query_periods)) {
-        log.error(
-            "The provided `availability_query.query_periods` option is not an array. No results will be shown",
-            { docsSlug: "availability-viewer/#availability_query" }
-        );
-        return;
-    }
-
-    if (allowEmpty && query_periods.length < 1) {
-        log.warn(
-            "The provided `availability_query.query_periods` option is empty. No results will be shown",
-            { docsSlug: "availability-viewer/#availability_query" }
-        );
-        return true;
-    }
-
-    if (query_periods.length < 1) {
-        log.error(
-            "The provided `availability_query.query_periods` option is empty. No results will be shown",
-            { docsSlug: "availability-viewer/#availability_query" }
-        );
-        return;
-    }
-
-    let errors = {};
-    query_periods.forEach((qp, index) => {
-        if (qp === null || typeof qp !== "object" || !("end" in qp) || !("start" in qp)) {
-            errors[`query_period[${index}]`] = [
-                "query period must be an object with start and end properties",
-            ];
-            return;
-        }
-
-        let out = [];
-
-        if (!moment(qp.start).isValid()) {
-            out.push("start must be a valid date string");
-        }
-
-        if (!moment(qp.end).isValid()) {
-            out.push("end must be a valid date string");
-        }
-
-        if (qp.start >= qp.end) {
-            out.push("end must be after start");
-        }
-
-        if (out.length > 0) errors[`query_period[${index}]`] = out;
-    });
-
-    if (Object.keys(errors).length > 0) {
-        log.error(
-            "Some of the provided `availability_query.query_periods` option have errors. No results will be shown",
-            {
-                docsSlug: "availability-viewer/#availability_query",
-                errorObject: errors,
-            }
-        );
-        return false;
-    }
-    return true;
-};
-
-export const parseTranslations = customTranslations => {
-    if (typeof customTranslations !== "undefined") {
-        return merge(translations, customTranslations);
-    }
-    return translations;
-};
-
-export const parseInterval = (option = false) => {
-    // Make sure we have an interval to start with...
-    let interval = option ? option : 15;
-    // Round it to the nearest 15 mins
-    interval = Math.ceil(interval / 15) * 15;
-    // If it's 45, bump it up to 60 [^1]
-    interval = interval === 45 ? 60 : interval;
-    // If it's over 60, round down [^1]
-    interval = interval > 60 ? 60 : interval;
-    // [:1] We currently only support the following intervals: 15 | 30 | 60
-    return interval;
-};
-
-export const parseTimezone = (option, elementSlug = false, log) => {
-    const docsHash = elementSlug ? `${elementSlug}/#param-tzid` : "";
-    const isValidTzid = moment.tz.zone(option);
-
-    const sniffedTimezone = !isValidTzid ? moment.tz.guess() : "";
-
-    if (typeof option !== "undefined" && !isValidTzid) {
-        log.warn(
-            `The provided TZID of ${option} is not valid. Using ${sniffedTimezone} instead. Full details of valid TZIDs can be found on the Cronofy Elements documention page: https://docs.cronofy.com/developers/ui-elements/${docsHash}`
-        );
-    }
-
-    return {
-        tzid: !isValidTzid ? sniffedTimezone : option,
-        customtzid: typeof option !== "undefined",
-    };
-};
-
-export const parseGridTime = (time, fallback = "09:00", roundUp = false) => {
-    // If there's no time set, fallback silently.
-    if (typeof time === "undefined") return { message: false, time: fallback, offset: 0 };
-
-    // If there is a time, is it in a valid format?
-    const validTime = moment(time, "HH:mm", true).isValid();
-    if (!validTime) {
-        return {
-            message: `using default value of ${fallback}`,
-            time: fallback,
-            offset: 0,
-        };
-    }
-
-    const parts = time.split(":");
-    const rawMinutes = parseInt(parts[1], 10);
-
-    // If the time falls on an approved interval, it's valid!
-    if (rawMinutes % 15 === 0) {
-        return {
-            message: false,
-            time: time,
-            offset: rawMinutes,
-        };
-    }
-
-    const roundedMinutes = roundUp
-        ? (Math.ceil(rawMinutes / 15) * 15) % 60
-        : (Math.floor(rawMinutes / 15) * 15) % 60;
-
-    const paddedMinutes = roundedMinutes.toString().padStart(2, "0");
-
-    return {
-        message: `rounded from ${time} to ${parts[0]}:${paddedMinutes}`,
-        time: `${parts[0]}:${paddedMinutes}`,
-        offset: roundedMinutes,
-    };
-};
-
-export const adjustInterval = (rawInterval, offset, log) => {
-    if (offset > 0 && rawInterval > offset) {
-        // Positive offsets will only ever be 15, 30 or 45.
-        const adjustedInterval = offset === 45 ? 15 : offset;
-        log.warn(
-            `config.interval of ${rawInterval} minutes has been shortened to ${adjustedInterval} minutes for optimal tessellation of results in the grid.`,
-            {
-                docsSlug: "availability-viewer/#config.interval",
-            }
-        );
-        return adjustedInterval;
-    }
-    return rawInterval;
-};
-
-export const validateLocaleModifiers = modifiers => {
-    const defaultLocales = Object.keys(modifierDateFormats);
-    const locales = Object.keys(modifiers);
-
-    for (const locale of locales) {
-        const test = defaultLocales.includes(locale);
-        if (!test) {
-            return false;
-        }
-    }
-
-    for (const locale of locales) {
-        const value = nestedValue([locale, "dates"], modifiers);
-        if (value) {
-            const valueA = nestedValue([locale, "dates"], modifiers);
-            const valueB = nestedValue([locale, "dates"], modifierDateFormats);
-            return valueB[valueA] ? true : false;
-        } else {
-            return false;
-        }
-    }
-};

package/src/js/helpers/logging.js

@@ -1,78 +0,0 @@
-export const errorWrap = (elementName, message, docsSlug = "") => {
-    return `UI Elements: ${elementName}\n${message}\nhttps://docs.cronofy.com/developers/ui-elements/${docsSlug}\n`;
-};
-
-export const buildLogNotification = (type, elementName, message, url = "", errorObject = false) => {
-    const notification = {
-        notification: {
-            type: type,
-            element: elementName,
-            message,
-            url: `https://docs.cronofy.com/developers/ui-elements/${url}`,
-            errors: errorObject ? errorObject : {},
-        },
-    };
-    return notification;
-};
-
-// `logs` options: "error" | "warn" | "info" | "none"
-export const logConstructor = (mode = "warn", elementName = "General", callback = false) => {
-    const _log = (type = "log", ...message) => {
-        // Sometimes we just want to use a single string as a message,
-        // but occasionally we'll want to include an error object too.
-        // The "rest" (`...`) catches the string *and* any included objects.
-
-        // This is where we filter out undefined error objects (just in case)
-        const messages = message.filter(m => typeof m !== "undefined");
-
-        if (mode === "none") return;
-        if (mode === "error" && type !== "error") return;
-        if (mode === "warn" && type !== "error" && type !== "warn") return;
-
-        // Now we'll "spread" (`...` again) to log either just the message
-        // or the message and any included objects.
-        console[type](...messages);
-    };
-
-    const buildLog = type => (
-        message = "There was a problem with the UI Elements",
-        extras = {}
-    ) => {
-        const messageString = errorWrap(elementName, message, extras.docsSlug);
-        if (callback) {
-            callback(
-                buildLogNotification(
-                    type,
-                    elementName,
-                    message,
-                    extras.docsSlug,
-                    extras.errorObject
-                )
-            );
-        }
-        return _log(type, messageString, extras.errorObject);
-    };
-
-    return {
-        log: buildLog("log"),
-        info: buildLog("info"),
-        warn: buildLog("warn"),
-        error: buildLog("error"),
-    };
-};
-
-export const errorMessages = {
-    401: {
-        message: "There was a problem fetching data: check your element_token is valid.",
-        docsSlug: "authentication/#generating-a-token",
-    },
-    403: {
-        message:
-            "Incorrect permissions: check the `permissions` array when creating your element_token",
-        docsSlug: "authentication/#permissions",
-    },
-    422: {
-        message: "There was a problem with your availability query.",
-        docsSlug: "availability-viewer/#availability_query",
-    },
-};