strapi-plugin-country-select
Version:
A strapi custom field for selecting any country based on the ISO 3166-1 country code standard.
63 lines (62 loc) • 2.49 kB
JavaScript
"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const designSystem = require("@strapi/design-system");
const reactIntl = require("react-intl");
const index = require("./index-DqR2Hh7F.js");
const admin = require("@strapi/strapi/admin");
const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
const React__default = /* @__PURE__ */ _interopDefault(React);
const CountrySelect = React__default.default.forwardRef(({
value,
onChange,
name,
label,
labelAction,
required,
hint,
placeholder,
disabled,
error,
attribute
}, forwardedRef) => {
const field = admin.useField(name);
const { formatMessage, messages } = reactIntl.useIntl();
const countries = messages[index.getTranslation("countries")] || "{}";
attribute?.options?.default;
const parsedOptions = JSON.parse(countries);
const isValidValue = !value || parsedOptions.hasOwnProperty(value);
console.log(value, isValidValue);
return /* @__PURE__ */ jsxRuntime.jsx(
designSystem.Field.Root,
{
name,
id: name,
error: !isValidValue ? formatMessage({ id: index.getTranslation("country-select.unsupported-country-code") }, { countryCode: value }) : error,
required,
hint,
children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
/* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { action: labelAction, children: label }),
/* @__PURE__ */ jsxRuntime.jsx(
designSystem.Combobox,
{
ref: forwardedRef,
placeholder,
"aria-label": label,
"aria-disabled": disabled,
disabled,
value: isValidValue ? value : null,
onChange: (countryCode) => onChange(name, countryCode),
onClear: () => field.onChange(name, null),
children: Object.entries(parsedOptions).sort(([, n1], [, n2]) => n1.localeCompare(n2)).map(([countryCode, countryName]) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.ComboboxOption, { value: countryCode, children: countryName }, countryCode))
}
),
/* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Hint, {}),
/* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Error, {})
] })
}
);
});
exports.default = CountrySelect;
//# sourceMappingURL=index-fILvy0Q2.js.map