@edvisor/product-language 0.10.2 → 0.10.3

package/src/lib/components/select/storybook/components.tsx

@@ -1,999 +0,0 @@
-/* eslint-disable no-restricted-syntax */
-import { Borders, Icons, Padding, shadowMd, Surface } from '@foundations'
-import { Flag } from 'components/flag'
-import { CountryCodes } from 'components/flag/flag.list'
-import { Body, Label } from 'components/typography'
-import { useState } from 'react'
-import { Playground } from 'storybook-addon-jarle-monaco'
-import styled from 'styled-components'
-import { Margin } from '@foundations'
-import { Select } from '../select'
-import { IOption } from '../types'
-import { isNil, safeArray, maybeRender, isDefined, is } from '@helpers'
-import { IconMinor } from 'components/icon'
-import { RadioButtonGroup } from './radio-group'
-import { Checkbox } from 'components/checkbox'
-import { InputText } from 'components/input-field'
-import { MenuList } from '../components/menu-list'
-
-interface IValue {
-  id: string
-  value: string
-}
-
-type ICountryList = {
-  [key in CountryCodes]: string
-}
-
-const FlexWrapper = styled.div`
-  height: 250px;
-  display: flex;
-  flex-direction: revert;
-  align-items: flex-start;
-  margin: 12px;
-  gap: 12px;
-  & > div {
-    width: 100%;
-  }
-`
-
-const CustomListFrame = styled.div`
-  border: 1px solid ${Borders.Default.Subdued};
-  background-color: ${Surface.Default.Default};
-  position: absolute;
-  width: 100%;
-  max-height: 180px;
-  overflow-y: auto;
-  overflow-x: hidden;
-  ::-webkit-scrollbar {
-    width: 6px;
-    height: 8px;
-  }
-
-  ::-webkit-scrollbar-thumb {
-    border-radius: 4px;
-    background: ${Surface.Neutral.Default};
-    min-height: 50px;
-  }
-  ${shadowMd};
-`
-
-const CustomRow = styled.div<{active?: boolean}>`
-  border: none;
-  text-align: left;
-  border: 1px solid ${Borders.Default.Subdued};
-  margin: ${Margin.xxxs};
-  border-radius: 6px;
-  background-color: ${(props) =>
-    (is(props.active)
-    ? Surface.Selected.Default
-    : Surface.Default.Default)};
-
-  &:hover {
-    background-color: ${Surface.Default.Hover};
-  }
-
-  &:hover {
-    background-color: ${(props) => (is(props.active) ?Surface.Selected.Hover : Surface.Default.Hover)}
-  }
-
-  &:active {
-    background-color: ${(props) => (is(props.active) ? Surface.Selected.Pressed : Surface.Default.Pressed)};
-  }
-`
-
-const CustomLabel = styled(Label)`
-  cursor: pointer;
-  padding: ${Padding.xxs} ${Padding.xs};
-  margin-left: ${Margin.l};
-`
-
-const SupportText = styled(CustomLabel)`
-  padding-top: ${Padding.none};
-`
-
-const IconWraper = styled.div`
-  position: relative;
-  top: 4px;
-  left: 6px;
-  & i {
-    position: absolute;
-  }
-`
-
-const StarSolid = styled(IconMinor.StarSolid)`
-  svg {
-    path {
-      fill: ${Icons.Critical};
-    }
-  }
-`
-const MugTea = styled(IconMinor.MugTea)`
-  svg {
-    path {
-      fill: ${Icons.Success};
-    }
-  }
-`
-
-const CheckBoxWraper = styled.div`
-  display: flex;
-  gap: 6px;
-  padding: ${Padding.xs};
-  align-self: flex-start;
-  flex-direction: row-reverse;
-  float: left;
-  div:last-of-type {
-    min-width: 110px;
-  }
-`
-
-const PersonPraying = styled(IconMinor.PersonPraying)`
-  svg {
-    path {
-      fill: ${Icons.Warning};
-    }
-  }
-`
-
-const FireBurner = styled(IconMinor.FireBurner)`
-  svg {
-    path {
-      fill: ${Icons.Highlight};
-    }
-  }
-`
-
-export const SelectOptions = () => (
-  <Playground
-    code={`
-    /* Edit this code sample! */
-    type ISelectedValue = string | string[];
-
-    const [value, setValue] = useState<ISelectedValue>();
-    const [isMulti, setIsMulti] = useState<boolean>(false);
-    const [labelPosition, setLabelPosition] = useState<string>('top');
-    const [label, setLabel] = useState<string>('My Label');
-    const [clearable, setClearable] = useState<boolean>(false);
-    const [searchable, setSearchable] = useState<boolean>(false);
-    const [disabled, setDisabled] = useState<boolean>(false);
-    const [invalid, setInvalid] = useState<boolean>(false);
-    const [placeholder, setPlaceholder] = useState<string>('');
-    const [menuPosition, setMenuPosition] = useState<string>('bottom');
-    const [alignSelf, setAlignSelf] = useState<string>('start');
-
-
-    const labelPositionValues = [
-      {
-        label: 'Top',
-        value: 'top',
-        name: 'labelTypes'
-      },
-      {
-        label: 'Side',
-        value: 'side',
-        name: 'labelTypes'
-      }
-    ];
-
-    const multiValues = [
-      {
-        label: 'Single',
-        value: 'single',
-        name: 'multi'
-      },
-      {
-        label: 'Multi',
-        value: 'multi',
-        name: 'multi'
-      },
-    ];
-
-    const menuPositionValues = [
-      {
-        label: 'Bottom',
-        value: 'bottom',
-        name: 'menuPositionTypes'
-      },
-      {
-        label: 'Top',
-        value: 'top',
-        name: 'menuPositionTypes'
-      }
-    ];
-
-    const handleValueChange = (selectedValue: ISelectedValue) => {
-      setValue(selectedValue)
-    };
-
-    const handleTypeChange = (selectedValue: string) => {
-      const isMultiSelect = (selectedValue ===  'multi')
-      setValue(isMultiSelect ? [] : undefined)
-      setIsMulti(isMultiSelect)
-    };
-
-    const handleLabelChange = (selectedValue: string) => {
-      setLabelPosition(selectedValue)
-    };
-
-    const handlemenuPositionChange = (selectedValue: string) => {
-      setMenuPosition(selectedValue)
-      const newAlign = (alignSelf === 'start' ? 'end' : 'start' )
-      setAlignSelf(newAlign)
-    };
-
-    <FlexWrapper style={{height: 'unset'}}>
-      <div style={{display: 'flex', flexDirection: 'column'}}>
-        <div style={{width: '260px'}}>
-          <InputText label='Change the Select Label' value={label} onChange={setLabel}/>
-        </div>
-        <div style={{width: '260px'}}>
-          <InputText label='Select Placeholder' value={placeholder} onChange={setPlaceholder}/>
-        </div>
-        <RadioButtonGroup
-          label="Select Type:"
-          options={multiValues}
-          onChange={handleTypeChange}
-        />
-        <RadioButtonGroup
-          label="Label Position:"
-          options={labelPositionValues}
-          onChange={handleLabelChange}
-        />
-        <RadioButtonGroup
-          label="Menu Position:"
-          options={menuPositionValues}
-          onChange={handlemenuPositionChange}
-        />
-        <CheckBoxWraper>
-          <Checkbox checked={clearable} onChange={() => setClearable(!clearable)}/>
-          <Label>Clearable : </Label>
-        </CheckBoxWraper>
-        <CheckBoxWraper>
-          <Checkbox checked={searchable} onChange={() => setSearchable(!searchable)}/>
-          <Label>Searchable :</Label>
-        </CheckBoxWraper>
-        <CheckBoxWraper>
-          <Checkbox checked={disabled} onChange={() => setDisabled(!disabled)}/>
-          <Label>Disabled :</Label>
-        </CheckBoxWraper>
-        <CheckBoxWraper>
-          <Checkbox checked={invalid} onChange={() => setInvalid(!invalid)}/>
-          <Label>Invalid :</Label>
-        </CheckBoxWraper>
-      </div>
-      <div style={{alignSelf: alignSelf, margin: '100px 0px'}}>
-        <Select
-          menuPosition={menuPosition}
-          multi={isMulti}
-          value={value}
-          clearable={clearable}
-          searchable={searchable}
-          onChange={handleValueChange}
-          options={options1}
-          placeholder={placeholder}
-          labelPosition={labelPosition}
-          label={label}
-          invalid={invalid}
-          disabled={disabled}
-        />
-      </div>
-    </FlexWrapper>
-    `}
-    providerProps={{
-      renderAsComponent: true,
-      scope: {
-        Select,
-        useState,
-        options1,
-        Label,
-        RadioButtonGroup,
-        Checkbox,
-        InputText,
-        CheckBoxWraper,
-        FlexWrapper,
-      },
-    }}
-  />
-)
-
-export const CustomLabelComponent = () => (
-  <Playground
-    code={`
-    /* Edit this code sample! */
-    /*
-    IValue is the type you pass to the IOption interface
-
-    interface IValue {
-      id: string
-      value: string
-    }
-    */
-    const [value, setValue] = useState<IValue>();
-
-    const onChange = (selectedValue: IValue) => {
-      setValue(selectedValue)
-    };
-
-    const labelComponent = (props: IOption<IValue>) => (
-      <div style={{display: 'flex', gap: '6px'}}>
-          <Flag medium code={props['code']} style={{right: '0'}}/>
-          <Body default style={{padding: '0'}}>{props['children']}</Body>
-      </div>
-    );
-
-    <FlexWrapper>
-      <div>
-        <Select
-          placeholder="Please select..."
-          options={options2}
-          onChange={onChange}
-          labelComponent={labelComponent}
-          value={value}
-          labelPosition='top'
-          searchable
-          label='Select a Country'
-        />
-      </div>
-        <span>{
-          isDefined(value)
-          ? <Label>You Selected: {JSON.stringify(value)}</Label>
-          : <Label>Select Something...</Label>
-        }</span>
-      <div>
-      </div>
-    </FlexWrapper>
-    `}
-    providerProps={{
-      renderAsComponent: true,
-      scope: {
-        Select,
-        isDefined,
-        useState,
-        options2,
-        Label,
-        Flag,
-        Body,
-        FlexWrapper,
-      },
-    }}
-  />
-)
-
-export const HugeListWithCustomLabelComponent = () => (
-  <Playground
-    // eslint-disable-next-line no-restricted-syntax
-    code={`
-    /* Edit this code sample! */
-    /*
-    IValue is the type you pass to the IOption interface
-
-    interface IValue {
-      id: string
-      value: string
-    }
-    */
-    const [value, setValue] = useState<ICountryValue[]>([]);
-
-    const countryList: IOption<ICountryValue>[] = (Object.keys(CountryList) as (CountryCodes)[])
-      .map(code => ({
-        label: CountryList[code],
-        value: {
-          code: code,
-          value: CountryList[code]
-        }
-    }));
-
-    const onChange = (selectedValue: ICountryValue[]) => {
-      setValue(selectedValue)
-    };
-
-    const labelComponent = (props: IOption<ICountryValue>) => (
-      <div style={{display: 'flex', gap: '6px', pointerEvents: 'none'}}>
-        <Flag medium code={props['value']['code']}/>
-        <Body default>{props['children']}</Body>
-      </div>
-    );
-
-    <FlexWrapper>
-      <div>
-        <Select
-          placeholder="Please select..."
-          options={countryList}
-          onChange={onChange}
-          labelComponent={labelComponent}
-          value={value}
-          labelPosition='top'
-          searchable
-          clearable
-          label='Select a Country'
-        />
-      </div>
-      <div>
-        <div>{isNil(value?.code) ? <Label>Select Something...</Label> : <Label>You Selected: {JSON.stringify(value)}</Label> }</div>
-          {
-            maybeRender(value?.code, <div style={{margin: '${Margin.l} ${Margin.none}', textAlign: 'center', display: 'flex'}}>
-            <Label style={{margin: '${Margin.xxs}'}}>Flag: </Label><IconWraper><Flag large code={value?.code}/></IconWraper>
-            </div>)
-          }
-      </div>
-    </FlexWrapper>
-    `}
-    providerProps={{
-      renderAsComponent: true,
-      scope: {
-        Select,
-        useState,
-        options2,
-        Label,
-        Flag,
-        Body,
-        Margin,
-        isNil,
-        maybeRender,
-        IconWraper,
-        CountryList,
-        FlexWrapper,
-      },
-    }}
-  />
-)
-
-export const CustomValidation = () => (
-  <Playground
-    // eslint-disable-next-line no-restricted-syntax
-    code={`
-    /* Edit this code sample! */
-    const [value, setValue] = useState<string>()
-    const [errorsList, setErrorsList] = useState<{message: string}[]>([])
-    const isMounted = useRef(false);
-
-    useEffect(() => {
-      if (!isMounted.current) {
-        isMounted.current = true
-        return
-      }
-      checkForErros()
-    }, [value]);
-
-    /*
-      Use onChange and onClose
-    */
-    const onChange = (selectedValue: string) => {
-      setValue(selectedValue)
-    };
-
-    const onClose = () => {
-      checkForErros()
-    };
-
-    const checkForErros = () => {
-      const errors = []
-      if (isNil(value)) {
-        errors.push({ message: 'This field is required' })
-      }
-      setErrorsList(errors)
-    };
-
-    <FlexWrapper>
-      <div>
-        <Select
-          value={value}
-          onChange={onChange}
-          onClose={onClose}
-          options={options1}
-          clearable
-          invalid={errorsList.length > 0}
-          errors={errorsList}
-        />
-      </div>
-    </FlexWrapper>
-
-    `}
-    providerProps={{
-      renderAsComponent: true,
-      scope: {
-        Select,
-        options1,
-        Margin,
-        isNil,
-        FlexWrapper,
-      },
-    }}
-  />
-)
-
-export const CustomMenu = () => (
-  <Playground
-    // eslint-disable-next-line no-restricted-syntax
-    code={`
-    /* Edit this code sample! */
-    const [value, setValue] = useState<string>();
-    const [errors, setErrors] = useState<{message: string}[]>([]);
-
-    const handleClick = (props: IMenuComponentProps, option: IOption) => {
-      alert(\`You choose \${option.label}\`)
-      props.onSelect(option.value)
-    };
-
-    const handleChange = (selected: string) => {
-      const newErros = []
-      setValue(selected)
-      if (selected !== 'Brasil') {
-        newErros.push({message:'Wrong one =('})
-      }
-      setErrors(newErros)
-    };
-
-    const menuComponent = (props: IMenuComponentProps) => (
-      // eslint-disable-next-line no-restricted-syntax
-      <CustomListFrame>
-        {(safeArray(props.options)).map((option, i) => (
-          <CustomRow active={props.selectedIndex === i} key={i} onClick={() => handleClick(props, option)}>
-            <IconWraper>
-              {option['icon']}
-            </IconWraper>
-            <CustomLabel>
-              {option.label}
-            </CustomLabel>
-            <SupportText subdued>
-              {option['helperText']}
-            </SupportText>
-          </CustomRow>
-        ))}
-      </CustomListFrame>
-    );
-
-    <FlexWrapper style={{marginTop: '25px', width: '300px'}}>
-
-    <div>
-    <Label>The Southernmost Country?</Label>
-      <Select
-        invalid={errors.length > 0}
-        errors={errors}
-        value={value}
-        onChange={handleChange}
-        options={options3}
-        menuComponent={menuComponent}
-        label='Curiosities'
-        labelPosition='top'
-      />
-      </div>
-    </FlexWrapper>
-
-    `}
-    providerProps={{
-      renderAsComponent: true,
-      scope: {
-        Select,
-        safeArray,
-        useState,
-        options3,
-        Label,
-        FlexWrapper,
-        CustomListFrame,
-        CustomRow,
-        CustomLabel,
-        SupportText,
-        IconWraper,
-      },
-    }}
-  />
-)
-
-export const FancyMenu = () => (
-  <Playground
-    code={`
-    /* Edit this code sample! */
-
-    const [value, setValue] = useState<string>(undefined);
-
-    const [withIcon, setWithIcon] = useState<boolean>(true);
-    const [withSupport, setWithSupport] = useState<boolean>(true);
-    const [withMenuTitle, setWithMenuTitle] = useState<boolean>(true);
-    const [selectOptions, setSelectOptions] = useState([]);
-    const [menuTitle, setMenuTitle] = useState(undefined);
-
-    useEffect(() => {
-      setMenuTitle(withMenuTitle ? 'Menu Title' : undefined)
-    }, [withMenuTitle])
-
-    useEffect(() => {
-      setSelectOptions(options1.map((opt) => ({
-        ...opt,
-        ...(withIcon && {icon: <IconMinor.Clone />}),
-        ...(withSupport && {helperText: 'Lorem ipsum dolor sit amet'})
-      })));
-
-    }, [withIcon, withSupport]);
-
-    <FlexWrapper style={{}}>
-      <div style={{display: 'flex', flexDirection: 'column'}}>
-        <CheckBoxWraper style={{width: '160px', justifyContent: 'space-between'}}>
-          <Checkbox checked={withIcon} onChange={() => setWithIcon(!withIcon)}/>
-          <Label>With Icon : </Label>
-        </CheckBoxWraper>
-        <CheckBoxWraper style={{width: '160px', justifyContent: 'space-between'}}>
-          <Checkbox checked={withSupport} onChange={() => setWithSupport(!withSupport)}/>
-          <Label>With Support Text :</Label>
-        </CheckBoxWraper>
-        <CheckBoxWraper style={{width: '160px', justifyContent: 'space-between'}}>
-          <Checkbox checked={withMenuTitle} onChange={() => setWithMenuTitle(!withMenuTitle)}/>
-          <Label>With Menu Title :</Label>
-        </CheckBoxWraper>
-      </div>
-      <div>
-        <Select
-          value={value}
-          onChange={setValue}
-          options={selectOptions}
-          labelPosition="top"
-          placeholder="Select Something"
-          menuComponent={MenuList}
-          label="Cool Label"
-          menuTitle={menuTitle}
-        />
-      </div>
-    </FlexWrapper>
-    `}
-    providerProps={{
-      renderAsComponent: true,
-      scope: {
-        Select,
-        options1,
-        Label,
-        IconMinor,
-        Checkbox,
-        CheckBoxWraper,
-        FlexWrapper,
-        MenuList,
-      },
-    }}
-  />
-)
-
-const options1: IOption[] = [
-  {
-    label: 'Yu Yu Hakusho',
-    value: '01' ,
-  },
-  {
-    label: 'Neon Genesis Evangelion',
-    value: '02',
-  },
-  {
-    label: 'Dragon Ball Z',
-    value: '03',
-  },
-  {
-    label: 'Legend of Heavenly Sphere Shurato',
-    value: '04',
-  },
-  {
-    label: 'Ronin Warriors',
-    value: '05',
-  },
-  {
-    label: 'Knights of the Zodiac',
-    value: '06',
-  },
-  {
-    label: 'Rurouni Kenshin',
-    value: '07',
-  },
-  {
-    label: 'Avatar the Last Airbender',
-    value: '08',
-  }
-]
-
-const options2: IOption<IValue>[] = [
-  {
-    value: {id: 'BR', value: 'Brasil'},
-    label: 'Brasil',
-    code: 'BR',
-  },
-  {
-    value: {id: 'CA', value: 'Canada'},
-    label: 'Canada',
-    code: 'CA',
-  },
-  {
-    value: {id: 'MX', value: 'Mexico'},
-    label: 'Mexico',
-    code: 'MX',
-  },
-  {
-    value: {id: 'US', value: 'United States'},
-    label: 'United States',
-    code: 'US',
-  }
-]
-
-const options3: IOption[] = [
-  {
-    value: 'Brasil',
-    label: 'Brasil',
-    icon: <MugTea/>,
-    helperText: 'Larges in the South America',
-  },
-  {
-    value: 'Canada',
-    label: 'Canada',
-    icon: <FireBurner />,
-    helperText: 'Very very cold',
-  },
-  {
-    value: 'Mexico',
-    label: 'Mexico',
-    icon: <PersonPraying />,
-    helperText: 'Really hot food!',
-  },
-  {
-    value: 'United States',
-    label: 'United States',
-    icon: <StarSolid/>,
-    helperText: 'Land of the Free',
-  }
-]
-
-const CountryList: ICountryList = {
-  'AD': 'Andorra',
-  'AE': 'United Arab Emirates',
-  'AF': 'Afghanistan',
-  'AG': 'Antigua and Barbuda',
-  'AI': 'Anguilla',
-  'AL': 'Albania',
-  'AM': 'Armenia',
-  'AO': 'Angola',
-  'AQ': 'Antarctica',
-  'AR': 'Argentina',
-  'AS': 'American Samoa',
-  'AT': 'Austria',
-  'AU': 'Australia',
-  'AW': 'Aruba',
-  'AX': 'Aland Islands',
-  'AZ': 'Azerbaijan',
-  'BA': 'Bosnia and Herzegovina',
-  'BB': 'Barbados',
-  'BD': 'Bangladesh',
-  'BE': 'Belgium',
-  'BF': 'Burkina Faso',
-  'BG': 'Bulgaria',
-  'BH': 'Bahrain',
-  'BI': 'Burundi',
-  'BJ': 'Benin',
-  'BL': 'Saint Barthélemy',
-  'BM': 'Bermuda',
-  'BN': 'Brunei Darussalam',
-  'BO': 'Bolivia',
-  'BQ-BO': 'Bonaire',
-  'BQ-SA': 'Saba',
-  'BQ-SE': 'Sint Eustatius',
-  'BR': 'Brazil',
-  'BS': 'Bahamas',
-  'BT': 'Bhutan',
-  'BV': 'Bouvet Island',
-  'BW': 'Botswana',
-  'BY': 'Belarus',
-  'BZ': 'Belize',
-  'CA': 'Canada',
-  'CC': 'Cocos (Keeling) Islands',
-  'CD': 'Democratic Republic of the Congo',
-  'CF': 'Central African Republic',
-  'CG': 'Republic of the Congo',
-  'CH': 'Switzerland',
-  'CI': 'Côte d\'Ivoire (Ivory Coast)',
-  'CK': 'Cook Islands',
-  'CL': 'Chile',
-  'CM': 'Cameroon',
-  'CN': 'China',
-  'CO': 'Colombia',
-  'CR': 'Costa Rica',
-  'CU': 'Cuba',
-  'CV': 'Cabo Verde',
-  'CW': 'Curaçao',
-  'CX': 'Christmas Island',
-  'CY': 'Cyprus',
-  'CZ': 'Czech Republic',
-  'DE': 'Germany',
-  'DJ': 'Djibouti',
-  'DK': 'Denmark',
-  'DM': 'Dominica',
-  'DO': 'Dominican Republic',
-  'DZ': 'Algeria',
-  'EC': 'Ecuador',
-  'EE': 'Estonia',
-  'EG': 'Egypt',
-  'EH': 'Western Sahara',
-  'ER': 'Eritrea',
-  'ES': 'Spain',
-  'ET': 'Ethiopia',
-  'FI': 'Finland',
-  'FJ': 'Fiji',
-  'FK': 'Falkland Islands',
-  'FM': 'Federated States of Micronesia',
-  'FO': 'Faroe Islands',
-  'FR': 'France',
-  'GA': 'Gabon',
-  'GB': 'England',
-  'GB-NIR': 'Northern Ireland',
-  'GB-SCT': 'Scotland',
-  'GB-UKM': 'United Kingdom',
-  'GB-WLS': 'Wales',
-  'GD': 'Grenada',
-  'GE': 'Georgia',
-  'GF': 'French Guiana',
-  'GG': 'Guernsey',
-  'GH': 'Ghana',
-  'GI': 'Gibraltar',
-  'GL': 'Greenland',
-  'GM': 'Gambia',
-  'GN': 'Guinea',
-  'GP': 'Guadeloupe',
-  'GP-FR': 'Guadeloupe',
-  'GQ': 'Equatorial Guinea',
-  'GR': 'Greece',
-  'GS': ' S. Georgia and S. Sandwich Islands',
-  'GT': 'Guatemala',
-  'GU': 'Guam',
-  'GW': 'Guinea-Bissau',
-  'GY': 'Guyana',
-  'HK': 'Hong Kong',
-  'HM': 'Heard and McDonald Islands',
-  'HN': 'Honduras',
-  'HR': 'Croatia (Hrvatska)',
-  'HT': 'Haiti',
-  'HU': 'Hungary',
-  'ID': 'Indonesia',
-  'IE': 'Ireland',
-  'IL': 'Isreal',
-  'IM': 'Isle of Man',
-  'IN': 'India',
-  'IO': 'British Indian Ocean Territory',
-  'IQ': 'Iraq',
-  'IR': 'Iran',
-  'IS': 'Iceland',
-  'IT': 'Italy',
-  'JE': 'Jersey',
-  'JM': 'Jamaica',
-  'JO': 'Jordan',
-  'JP': 'Japan',
-  'KE': 'Kenya',
-  'KG': 'Kyrgyzstan',
-  'KH': 'Cambodia',
-  'KI': ' Kiribati',
-  'KM': 'Comors',
-  'KN': 'Saint Kitts and Nevis',
-  'KP': 'Korea (North)',
-  'KR': 'Korea (South)',
-  'KW': 'Kuwait',
-  'KY': 'Cayman Islands',
-  'KZ': 'Kazakhstan',
-  'LA': 'Laos',
-  'LB': 'Lebanon',
-  'LC': 'Saint Lucia',
-  'LI': 'Liechtenstein',
-  'LK': 'Sri Lanka',
-  'LR': 'Liberia',
-  'LS': 'Lesotho',
-  'LT': 'Lithuania',
-  'LU': 'Luxembourg',
-  'LV': 'Latvia',
-  'LY': 'Libya',
-  'MA': 'Morocco',
-  'MC': 'Monaco',
-  'MD': 'Moldova',
-  'ME': 'Montenegro',
-  'MF': 'Saint Martin',
-  'MG': 'Madagascar',
-  'MH': 'Marshall Islands',
-  'MK': 'North Macedonia',
-  'ML': 'Mali',
-  'MM': 'Myanmar',
-  'MN': 'Mongolia',
-  'MO': 'Macao',
-  'MP': 'Northern Mariana Islands',
-  'MQ': 'Martinique',
-  'MQ-FR': 'Martinique',
-  'MR': 'Mauritania',
-  'MS': 'Montserrat',
-  'MT': 'Malta',
-  'MU': 'Mauritius',
-  'MV': 'Maldives',
-  'MW': 'Malawi',
-  'MX': 'Mexico',
-  'MY': 'Malaysia',
-  'MZ': 'Mozambique',
-  'NA': 'Namibia',
-  'NC': 'New Caledonia',
-  'NE': 'Niger',
-  'NF': 'Norfolk Island',
-  'NG': 'Nigeria',
-  'NI': 'Nicaragua',
-  'NL': 'Netherlands',
-  'NO': 'Norway',
-  'NP': 'Nepal',
-  'NR': 'Nauru',
-  'NU': 'Niue',
-  'NZ': 'New Zealand (Aotearoa)',
-  'OM': 'Oman',
-  'PA': 'Panama',
-  'PE': 'Peru',
-  'PF': 'French Polynesia',
-  'PG': 'Papua New Guinea',
-  'PH': 'Philippines',
-  'PK': 'Pakistan',
-  'PL': 'Poland',
-  'PM': 'St. Pierre & z',
-  'PM-FR': 'Saint Pierre and Miquelon',
-  'PN': 'Pitcairn Islands',
-  'PR': 'Puerto Rico',
-  'PS': 'Palestinian Territory',
-  'PT': 'Portugal',
-  'PW': 'Palau',
-  'PY': 'Paraguay',
-  'QA': 'Qatar',
-  'RE': 'Reunion',
-  'RO': 'Romania',
-  'RS': 'Serbia',
-  'RU': 'Russian Federation',
-  'RW': 'Rwanda',
-  'SA': 'Saudi Arabia',
-  'SB': 'Solomon Islands',
-  'SC': 'Seychelles',
-  'SD': 'Sudan',
-  'SE': 'Sweden',
-  'SG': 'Singapore',
-  'SH': 'Saint Helena',
-  'SI': 'Slovenia',
-  'SJ': 'Svalbard and Jan Mayen',
-  'SK': 'Slovakia',
-  'SL': 'Sierra Leone',
-  'SM': 'San Marino',
-  'SN': 'Senegal',
-  'SO': 'Somalia',
-  'SR': 'Suriname',
-  'SS': 'South Sudan',
-  'ST': 'Sao Tome and Principe',
-  'SV': 'El Salvador',
-  'SX': 'Sint Maarten',
-  'SY': 'Syria',
-  'SZ': 'Swaziland',
-  'TC': 'Turks and Caicos Islands',
-  'TD': 'Chad',
-  'TF': 'French Southern and Antarctic Lands',
-  'TG': 'Togo',
-  'TH': 'Thailand',
-  'TJ': 'Tajikistan',
-  'TK': 'Tokelau',
-  'TL': 'Timor-Leste',
-  'TM': 'Turkmenistan',
-  'TN': 'Tunisia',
-  'TO': 'Tonga',
-  'TR': 'Turkey',
-  'TT': 'Trinidad and Tobago',
-  'TV': 'Tuvalu',
-  'TW': 'Taiwan',
-  'TZ': 'Tanzania',
-  'UA': 'Ukraine',
-  'UG': 'Uganda',
-  'UM': 'United States Minor Outlying Islands',
-  'US': 'United States',
-  'UY': 'Uruguay',
-  'UZ': 'Uzbekistan',
-  'VA': 'Vatican City State',
-  'VC': 'Saint Vincent and the Grenadines',
-  'VE': 'Venezuela',
-  'VG': 'Virgin Islands (British)',
-  'VI': 'Virgin Islands (U.S.)',
-  'VN': 'Vietnam',
-  'VU': 'Vanuatu',
-  'WF': 'Wallis and Futuna',
-  'WS': 'Samoa',
-  'YE': 'Yemen',
-  'YT-UNF': 'Mayotte',
-  'ZA': 'South Africa',
-  'ZM': 'Zambia',
-  'ZW': 'Zimbabwe',
-}