Fix country sorting for antd area select. (#67)

* Fix country sorting for antd area select.

* Remove filterSort from AreaSelect lite.

src/area-select.lite.tsx

@@ -2,7 +2,7 @@ import Select, { SelectProps } from 'rc-select';
 import { OptionProps } from 'rc-select/es/Option';
 import React, { useContext } from 'react';
 import { configContext } from './config';
-import { filterOption, filterSort } from './shared';
+import { filterOption } from './shared';
 
 export interface AreaSelectProps extends SelectProps<any> {
   optionProps?: OptionProps;
@@ -21,7 +21,6 @@ export const AreaSelect = ({
       dropdownMatchSelectWidth={false}
       optionLabelProp="label"
       filterOption={filterOption}
-      filterSort={filterSort}
       {...selectProps}
     >
       {areas.map((item) => {

src/area-select.tsx

@@ -2,7 +2,7 @@ import { Select } from 'antd';
 import { OptionProps, SelectProps } from 'antd/es/select';
 import React, { useContext } from 'react';
 import { configContext } from './config';
-import { filterOption, filterSort } from './shared';
+import { filterOption } from './shared';
 
 export interface AreaSelectProps extends SelectProps<any> {
   optionProps?: OptionProps;
@@ -28,7 +28,6 @@ export const AreaSelect = ({
         dropdownMatchSelectWidth={false}
         optionLabelProp="label"
         filterOption={filterOption}
-        filterSort={filterSort}
         {...selectProps}
       >
         {areas.map((item) => {

src/config.tsx

@@ -47,13 +47,27 @@ export type AreaMapper = (value: Area, index: number, array: Area[]) => Area;
 export type AreaSorter = (a: Area, b: Area) => number;
 const defaultAreaFilter: AreaFilter = () => true;
 const defaultAreaMapper: AreaMapper = (area) => area;
+const defaultAreaSorter: AreaSorter = (a, b) => {
+  if (a.name && b.name) {
+    const nameA = a.name.toUpperCase();
+    const nameB = b.name.toUpperCase();
+    if (nameA < nameB) {
+      return -1;
+    }
+    if (nameA > nameB) {
+      return 1;
+    }
+    return 0;
+  }
+  return 0;
+};
 
 export const ConfigProvider = ({
   children,
   locale = {},
   areaFilter = defaultAreaFilter,
   areaMapper = defaultAreaMapper,
-  areaSorter,
+  areaSorter = defaultAreaSorter,
 }: {
   children: ReactNode;
   locale?: any;

src/shared.tsx

@@ -15,12 +15,6 @@ export const filterOption: SelectProps['filterOption'] = (input, option) => {
   return keyHasAllChars;
 };
 
-export const filterSort: SelectProps['filterSort'] = (a, b) => {
-  const keyA = a.key as string;
-  const keyB = b.key as string;
-  return keyA.length - keyB.length;
-};
-
 export const usePhoneInput = ({
   isControlled,
   defaultValue,