@drivy/cobalt/components/Flag/index.js

Opinionated design system for Drivy's projects.

import React from 'react';
import cx from 'classnames';
import { countries } from '../../tokens/index.js';
import * as index from '../../icons/countries/index.js';
import eqSet from '../utils/eqSet.js';
import 'lodash.throttle';

if (!eqSet(new Set(Object.keys(index)), new Set(Object.keys(countries.flags))))
    throw new Error("Flag sources and tokens are not consistent. Did you add the source and export it");
const BUNDLED_FLAGS = Object.freeze(Object.keys(countries.flags).reduce((bundledFlags, name) => ({
    ...bundledFlags,
    [name]: index[name],
}), {}));
const Flag = ({ country, size = 24, className }) => {
    const _className = cx("cobalt-Flag", className, {
        "cobalt-Flag--size16": size === 16,
        "cobalt-Flag--size20": size === 20,
        "cobalt-Flag--size32": size === 32,
    });
    const countryFlag = BUNDLED_FLAGS[country];
    if (countryFlag == null)
        throw new Error(`'${country}' Flag can not be found. Did you add the source and export it`);
    return (React.createElement("span", { className: _className, dangerouslySetInnerHTML: { __html: countryFlag } }));
};

export { BUNDLED_FLAGS, Flag };
//# sourceMappingURL=index.js.map