@longline/aqua-ui 1.0.337 → 1.0.339

package/formatters/PhoneFormatter/PhoneFormatter.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+interface IPhoneFormatterProps {
+    /**
+     * Phone number in E.164 format, e.g. `"+351910306792"`.
+     */
+    value: string;
+}
+/**
+ * Displays a phone number alongside the flag of the country its international
+ * dialing prefix belongs to. The country is derived from the number itself
+ * (the shared `+1` North American range is disambiguated by area code), so
+ * only the number is needed — there is nothing else to store.
+ *
+ * ## Usage
+ *
+ * ```tsx
+ * <PhoneFormatter value="+351910306792"/>
+ * ```
+ */
+declare const PhoneFormatter: {
+    ({ value }: IPhoneFormatterProps): React.JSX.Element;
+    displayName: string;
+};
+export { PhoneFormatter };
+export type { IPhoneFormatterProps };

package/formatters/PhoneFormatter/PhoneFormatter.js

@@ -0,0 +1,34 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import * as React from 'react';
+import styled from 'styled-components';
+import { CountryFormatter } from '../CountryFormatter';
+import { parseE164 } from '../../helper/phoneNumber';
+/**
+ * Displays a phone number alongside the flag of the country its international
+ * dialing prefix belongs to. The country is derived from the number itself
+ * (the shared `+1` North American range is disambiguated by area code), so
+ * only the number is needed — there is nothing else to store.
+ *
+ * ## Usage
+ *
+ * ```tsx
+ * <PhoneFormatter value="+351910306792"/>
+ * ```
+ */
+var PhoneFormatter = function (_a) {
+    var value = _a.value;
+    if (!value)
+        return null;
+    var iso = parseE164(value).iso;
+    return (React.createElement(Wrapper, null,
+        iso && React.createElement(CountryFormatter, { type: "flag", value: iso }),
+        React.createElement(Number, null, value)));
+};
+PhoneFormatter.displayName = 'PhoneFormatter';
+var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 6px;\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 6px;\n"])));
+var Number = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  text-overflow: ellipsis;\n  overflow: hidden;\n"], ["\n  text-overflow: ellipsis;\n  overflow: hidden;\n"])));
+export { PhoneFormatter };
+var templateObject_1, templateObject_2;

package/formatters/PhoneFormatter/index.d.ts

@@ -0,0 +1 @@
+export * from './PhoneFormatter';

package/formatters/PhoneFormatter/index.js

@@ -0,0 +1 @@
+export * from './PhoneFormatter';

package/helper/phoneNumber.d.ts

@@ -0,0 +1,31 @@
+/**
+ * ISO 3166-1 alpha-2 country code → ITU country calling code (digits, no '+').
+ *
+ * Country calling codes are a prefix-free set by ITU design (no code is a
+ * prefix of another), so an E.164 number can be split into (code, national)
+ * deterministically by longest-prefix match — see parseE164().
+ */
+export declare const DIAL_BY_ISO: Record<string, string>;
+/** Calling code (digits) → representative ISO country code. */
+export declare const ISO_BY_DIAL: Record<string, string>;
+export declare const digitsOnly: (s: string | null | undefined) => string;
+export interface IParsedPhone {
+    /** Representative ISO country for the matched calling code, or null. */
+    iso: string | null;
+    /** Calling code digits (e.g. "351"), or null if none matched. */
+    code: string | null;
+    /** The national part (digits after the calling code). */
+    national: string;
+}
+/**
+ * Split an E.164 string ("+351123456789") into its calling code and national
+ * part. Relies on calling codes being prefix-free, so the first prefix (of
+ * length 1–3) that is a known code is the unique correct one.
+ */
+export declare const parseE164: (value: string | null | undefined) => IParsedPhone;
+/**
+ * Build an E.164 string from a selected country and a national part. Returns
+ * '' when there is no national number, so the field stays empty/optional
+ * rather than persisting a bare "+44".
+ */
+export declare const assembleE164: (iso: string, national: string) => string;

package/helper/phoneNumber.js

@@ -0,0 +1,142 @@
+/**
+ * ISO 3166-1 alpha-2 country code → ITU country calling code (digits, no '+').
+ *
+ * Country calling codes are a prefix-free set by ITU design (no code is a
+ * prefix of another), so an E.164 number can be split into (code, national)
+ * deterministically by longest-prefix match — see parseE164().
+ */
+export var DIAL_BY_ISO = {
+    AC: '247', AD: '376', AE: '971', AF: '93', AG: '1', AI: '1', AL: '355',
+    AM: '374', AO: '244', AR: '54', AS: '1', AT: '43', AU: '61', AW: '297',
+    AX: '358', AZ: '994',
+    BA: '387', BB: '1', BD: '880', BE: '32', BF: '226', BG: '359', BH: '973',
+    BI: '257', BJ: '229', BL: '590', BM: '1', BN: '673', BO: '591', BQ: '599',
+    BR: '55', BS: '1', BT: '975', BW: '267', BY: '375', BZ: '501',
+    CA: '1', CC: '61', CD: '243', CF: '236', CG: '242', CH: '41', CI: '225',
+    CK: '682', CL: '56', CM: '237', CN: '86', CO: '57', CR: '506', CU: '53',
+    CV: '238', CW: '599', CX: '61', CY: '357', CZ: '420',
+    DE: '49', DJ: '253', DK: '45', DM: '1', DO: '1', DZ: '213',
+    EC: '593', EE: '372', EG: '20', EH: '212', ER: '291', ES: '34', ET: '251',
+    FI: '358', FJ: '679', FK: '500', FM: '691', FO: '298', FR: '33',
+    GA: '241', GB: '44', GD: '1', GE: '995', GF: '594', GG: '44', GH: '233',
+    GI: '350', GL: '299', GM: '220', GN: '224', GP: '590', GQ: '240', GR: '30',
+    GT: '502', GU: '1', GW: '245', GY: '592',
+    HK: '852', HN: '504', HR: '385', HT: '509', HU: '36',
+    ID: '62', IE: '353', IL: '972', IM: '44', IN: '91', IO: '246', IQ: '964',
+    IR: '98', IS: '354', IT: '39',
+    JE: '44', JM: '1', JO: '962', JP: '81',
+    KE: '254', KG: '996', KH: '855', KI: '686', KM: '269', KN: '1', KP: '850',
+    KR: '82', KW: '965', KY: '1', KZ: '7',
+    LA: '856', LB: '961', LC: '1', LI: '423', LK: '94', LR: '231', LS: '266',
+    LT: '370', LU: '352', LV: '371', LY: '218',
+    MA: '212', MC: '377', MD: '373', ME: '382', MF: '590', MG: '261', MH: '692',
+    MK: '389', ML: '223', MM: '95', MN: '976', MO: '853', MP: '1', MQ: '596',
+    MR: '222', MS: '1', MT: '356', MU: '230', MV: '960', MW: '265', MX: '52',
+    MY: '60', MZ: '258',
+    NA: '264', NC: '687', NE: '227', NF: '672', NG: '234', NI: '505', NL: '31',
+    NO: '47', NP: '977', NR: '674', NU: '683', NZ: '64',
+    OM: '968',
+    PA: '507', PE: '51', PF: '689', PG: '675', PH: '63', PK: '92', PL: '48',
+    PM: '508', PN: '64', PR: '1', PS: '970', PT: '351', PW: '680', PY: '595',
+    QA: '974',
+    RE: '262', RO: '40', RS: '381', RU: '7', RW: '250',
+    SA: '966', SB: '677', SC: '248', SD: '249', SE: '46', SG: '65', SH: '290',
+    SI: '386', SJ: '47', SK: '421', SL: '232', SM: '378', SN: '221', SO: '252',
+    SR: '597', SS: '211', ST: '239', SV: '503', SX: '1', SY: '963', SZ: '268',
+    TC: '1', TD: '235', TG: '228', TH: '66', TJ: '992', TK: '690', TL: '670',
+    TM: '993', TN: '216', TO: '676', TR: '90', TT: '1', TV: '688', TW: '886',
+    TZ: '255',
+    UA: '380', UG: '256', US: '1', UY: '598', UZ: '998',
+    VA: '379', VC: '1', VE: '58', VG: '1', VI: '1', VN: '84', VU: '678',
+    WF: '681', WS: '685',
+    XK: '383',
+    YE: '967', YT: '262',
+    ZA: '27', ZM: '260', ZW: '263',
+};
+/**
+ * Canonical country shown for a calling code when several countries share it
+ * (e.g. +1 → US, +44 → GB). We only store the full number, so this affects
+ * the displayed flag/name on parse, not what is persisted.
+ */
+var PRIMARY_BY_DIAL = {
+    '1': 'US', '7': 'RU', '39': 'IT', '44': 'GB', '47': 'NO', '61': 'AU',
+    '64': 'NZ', '212': 'MA', '262': 'RE', '290': 'SH', '358': 'FI',
+    '500': 'FK', '590': 'GP', '599': 'CW',
+};
+/** Calling code (digits) → representative ISO country code. */
+export var ISO_BY_DIAL = (function () {
+    var map = {};
+    for (var _i = 0, _a = Object.entries(DIAL_BY_ISO); _i < _a.length; _i++) {
+        var _b = _a[_i], iso = _b[0], code = _b[1];
+        if (!(code in map))
+            map[code] = iso; // first-wins for unique codes
+    }
+    Object.assign(map, PRIMARY_BY_DIAL); // explicit winners for shared codes
+    return map;
+})();
+/**
+ * North American Numbering Plan: +1 is shared by ~25 countries, but each
+ * 3-digit area code (NPA) belongs to exactly one. Maps the non-US NPAs to their
+ * country; any NPA not listed (and short/partial numbers) falls back to the +1
+ * representative (US). This lets a stored +1 number resolve back to, e.g.,
+ * Canada rather than always showing the US.
+ */
+var NANP_BY_NPA = (function () {
+    var map = {
+        '242': 'BS', '246': 'BB', '264': 'AI', '268': 'AG', '284': 'VG',
+        '340': 'VI', '345': 'KY', '441': 'BM', '473': 'GD', '649': 'TC',
+        '658': 'JM', '664': 'MS', '670': 'MP', '671': 'GU', '684': 'AS',
+        '721': 'SX', '758': 'LC', '767': 'DM', '784': 'VC', '787': 'PR',
+        '809': 'DO', '829': 'DO', '849': 'DO', '868': 'TT', '869': 'KN',
+        '876': 'JM', '939': 'PR',
+    };
+    var caNpas = [
+        '204', '226', '236', '249', '250', '263', '289', '306', '343', '354',
+        '365', '367', '368', '382', '403', '416', '418', '428', '431', '437',
+        '438', '450', '468', '474', '506', '514', '519', '548', '579', '581',
+        '584', '587', '604', '613', '639', '647', '672', '683', '705', '709',
+        '742', '753', '778', '780', '782', '807', '819', '825', '867', '873',
+        '879', '902', '905',
+    ];
+    for (var _i = 0, caNpas_1 = caNpas; _i < caNpas_1.length; _i++) {
+        var npa = caNpas_1[_i];
+        map[npa] = 'CA';
+    }
+    return map;
+})();
+export var digitsOnly = function (s) { return (s || '').replace(/\D/g, ''); };
+/**
+ * Split an E.164 string ("+351123456789") into its calling code and national
+ * part. Relies on calling codes being prefix-free, so the first prefix (of
+ * length 1–3) that is a known code is the unique correct one.
+ */
+export var parseE164 = function (value) {
+    var _a;
+    var cleaned = (value || '').replace(/[^\d+]/g, '');
+    if (!cleaned.startsWith('+'))
+        return { iso: null, code: null, national: '' };
+    var rest = cleaned.slice(1);
+    for (var len = 1; len <= 3; len++) {
+        var code = rest.slice(0, len);
+        if (ISO_BY_DIAL[code]) {
+            var iso = ISO_BY_DIAL[code];
+            // +1 is shared across the NANP; resolve the specific country from the
+            // area code (the 3 digits after the country code).
+            if (code === '1') {
+                iso = (_a = NANP_BY_NPA[rest.slice(len, len + 3)]) !== null && _a !== void 0 ? _a : iso;
+            }
+            return { iso: iso, code: code, national: rest.slice(len) };
+        }
+    }
+    return { iso: null, code: null, national: rest };
+};
+/**
+ * Build an E.164 string from a selected country and a national part. Returns
+ * '' when there is no national number, so the field stays empty/optional
+ * rather than persisting a bare "+44".
+ */
+export var assembleE164 = function (iso, national) {
+    var code = DIAL_BY_ISO[iso];
+    var digits = digitsOnly(national);
+    return code && digits ? "+".concat(code).concat(digits) : '';
+};

package/inputs/Editor/Editor.js

@@ -78,10 +78,16 @@ var EditorBase = function (props) {
     var wrapperRef = React.useRef(null);
     // Ref to actual editor div (with contentEditable).
     var contentEditableRef = React.useRef(null);
+    // Last HTML the editor itself emitted via onUpdate. Used to detect
+    // round-trips so we don't re-sanitize the editor's own output (which would
+    // strip the empty <li> created by pressing Enter on a list item).
+    var lastEmittedRef = React.useRef(null);
     var _a = React.useState(false), fullscreen = _a[0], setFullscreen = _a[1];
     var handleUpdate = function (p) {
+        var html = p.editor.getHTML();
+        lastEmittedRef.current = html;
         if (props.onChange)
-            props.onChange(p.editor.getHTML());
+            props.onChange(html);
     };
     var handleFullscreenChange = function () {
         setFullscreen(document.fullscreenElement != null);
@@ -105,10 +111,13 @@ var EditorBase = function (props) {
         onUpdate: handleUpdate
     });
     React.useEffect(function () {
+        // If props.value is exactly what the editor just emitted, this is a
+        // round-trip from our own onChange — skip sanitizing and re-setting
+        // content. Sanitizing here would, e.g., strip the empty <li> created by
+        // pressing Enter inside a list, undoing the user's keystroke.
+        if (props.value === lastEmittedRef.current)
+            return;
         var safeValue = sanitizeEditorHTML(props.value);
-        // Only replace content if it actually differs from what's in the editor.
-        // This avoids resetting the cursor when the editor's own changes round-trip
-        // back through props.
         if (editor.getHTML() !== safeValue) {
             editor.commands.setContent(safeValue, true, { preserveWhitespace: "full" });
         }

package/inputs/PhoneInput/PhoneInput.d.ts

@@ -0,0 +1,92 @@
+import * as React from 'react';
+import { ITestable } from '../../Types';
+interface IPhoneInputProps extends ITestable {
+    /** @ignore */
+    className?: string;
+    /**
+     * Field name, for use in forms.
+     */
+    name?: string;
+    /**
+     * Current value in E.164 format, e.g. `"+351123456789"`.
+     */
+    value?: string;
+    /**
+     * Notified with the assembled E.164 string whenever the country or number
+     * changes. Receives `''` when the field is cleared.
+     */
+    onChange?: (value: string) => void;
+    /**
+     * Country selected for new/empty values, and the country restored when the
+     * field is cleared (ISO 3166-1 alpha-2, e.g. `"GB"`). A country is always
+     * selected, which is why there is no country placeholder.
+     * @default US
+     */
+    defaultCountry?: string;
+    /**
+     * Placeholder shown in the phone-number field when it is empty. The country
+     * field needs no placeholder, as a country is always selected.
+     */
+    placeholder?: string;
+    /**
+     * If set, the phone-number field shows a clear button that empties the
+     * number and resets the country to the default.
+     * @default false
+     */
+    clearable?: boolean;
+    /**
+     * Marks the control as disabled. Disabled controls cannot be interacted with.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Shows the control in an error state.
+     * @default false
+     */
+    error?: boolean;
+    /**
+     * A fluid control takes up all horizontal space available to it.
+     * @default false
+     */
+    fluid?: boolean;
+    /**
+     * Removes borders and makes the background transparent. Useful when placing
+     * the control inside a `Field`.
+     * @default false
+     */
+    transparent?: boolean;
+    /**
+     * Shows the control in a ghost state, where content is being loaded.
+     * @default false
+     */
+    ghost?: boolean;
+    /**
+     * Locale code for country-name display and sorting (e.g. `"pt"`, `"es"`).
+     * @default en
+     */
+    locale?: string;
+}
+/**
+ * A phone-number input: a searchable country dropdown that supplies the
+ * international dialing prefix, beside a free-text field for the rest of the
+ * number. The value is a single E.164 string (`"+351123456789"`) — the prefix
+ * is never stored separately.
+ *
+ * A country is always selected (default US, configurable via `defaultCountry`),
+ * so there is no country placeholder to translate; the `placeholder` prop
+ * applies to the number field. It satisfies the `Form.Field` control contract (`value` +
+ * `onChange(value)`), so a surrounding `Form.Field` validates the assembled
+ * E.164 string.
+ *
+ * ## Usage
+ *
+ * ```tsx
+ * <PhoneInput value="+351123456789" onChange={setPhone} clearable/>
+ * ```
+ */
+declare const PhoneInput: {
+    (props: IPhoneInputProps): React.JSX.Element;
+    displayName: string;
+};
+export { PhoneInput };
+export type { IPhoneInputProps };

package/inputs/PhoneInput/PhoneInput.js

@@ -0,0 +1,113 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import * as React from 'react';
+import styled from 'styled-components';
+import { Dropdown } from '../Dropdown';
+import { Input } from '../Input';
+import { CountryFormatter } from '../../formatters/CountryFormatter';
+import { Countries } from '../../formatters/CountryFormatter/Countries';
+import { DIAL_BY_ISO, parseE164, assembleE164, digitsOnly } from '../../helper/phoneNumber';
+var ALL_ISO = Object.keys(DIAL_BY_ISO);
+var nameOf = function (iso) { var _a; return (_a = Countries[iso]) !== null && _a !== void 0 ? _a : iso; };
+var strip = function (s) { return s.normalize('NFD').replace(/[̀-ͯ]/g, '').toLowerCase(); };
+/**
+ * A phone-number input: a searchable country dropdown that supplies the
+ * international dialing prefix, beside a free-text field for the rest of the
+ * number. The value is a single E.164 string (`"+351123456789"`) — the prefix
+ * is never stored separately.
+ *
+ * A country is always selected (default US, configurable via `defaultCountry`),
+ * so there is no country placeholder to translate; the `placeholder` prop
+ * applies to the number field. It satisfies the `Form.Field` control contract (`value` +
+ * `onChange(value)`), so a surrounding `Form.Field` validates the assembled
+ * E.164 string.
+ *
+ * ## Usage
+ *
+ * ```tsx
+ * <PhoneInput value="+351123456789" onChange={setPhone} clearable/>
+ * ```
+ */
+var PhoneInput = function (props) {
+    var value = props.value, onChange = props.onChange, _a = props.defaultCountry, defaultCountry = _a === void 0 ? 'US' : _a, clearable = props.clearable, locale = props.locale, placeholder = props.placeholder, disabled = props.disabled, error = props.error, fluid = props.fluid, transparent = props.transparent, ghost = props.ghost, className = props.className, name = props.name;
+    var _b = React.useState(function () { var _a; return (_a = parseE164(value).iso) !== null && _a !== void 0 ? _a : defaultCountry; }), iso = _b[0], setIso = _b[1];
+    var _c = React.useState(function () { return parseE164(value).national; }), national = _c[0], setNational = _c[1];
+    var _d = React.useState(''), query = _d[0], setQuery = _d[1];
+    // Re-sync from an externally-set value (initial load, form reset). During
+    // normal typing the parent value matches our assembled output, so this no-ops
+    // and won't fight the user.
+    React.useEffect(function () {
+        if ((value !== null && value !== void 0 ? value : '') !== assembleE164(iso, national)) {
+            var parsed = parseE164(value);
+            if (parsed.iso)
+                setIso(parsed.iso);
+            setNational(parsed.national);
+        }
+    }, [value]);
+    var sortedIso = React.useMemo(function () { return __spreadArray([], ALL_ISO, true).sort(function (a, b) { return nameOf(a).localeCompare(nameOf(b)); }); }, []);
+    var data = React.useMemo(function () {
+        var q = strip(query);
+        if (!q)
+            return sortedIso;
+        var qDigits = digitsOnly(query);
+        return sortedIso.filter(function (c) { return strip(nameOf(c)).includes(q) || (qDigits !== '' && DIAL_BY_ISO[c].startsWith(qDigits)); });
+    }, [query, sortedIso]);
+    var handleCountry = function (next) {
+        var nextIso = next !== null && next !== void 0 ? next : defaultCountry;
+        setIso(nextIso);
+        onChange === null || onChange === void 0 ? void 0 : onChange(assembleE164(nextIso, national));
+    };
+    var handleNational = function (next) {
+        // The Input's clear button emits null (typing only ever emits a string).
+        // Treat it as "clear the whole control": empty the number and reset the
+        // country to the default.
+        if (next === null) {
+            setIso(defaultCountry);
+            setNational('');
+            onChange === null || onChange === void 0 ? void 0 : onChange('');
+            return;
+        }
+        var digits = digitsOnly(next);
+        setNational(digits);
+        onChange === null || onChange === void 0 ? void 0 : onChange(assembleE164(iso, digits));
+    };
+    return (
+    // Stop clicks bubbling to the Form.Field box wrapper. That wrapper routes
+    // any click to the first child with tabIndex=0 (the Dropdown), which would
+    // otherwise hijack clicks on the number field and force the dropdown open.
+    React.createElement(Wrapper, { "$fluid": fluid, className: className, "data-testid": props['data-testid'], onClick: function (e) { return e.stopPropagation(); } },
+        React.createElement(Prefix, null,
+            React.createElement(Dropdown, { data: data, value: iso, onChange: handleCountry, onSearch: setQuery, disabled: disabled, error: error, ghost: ghost, transparent: transparent, fluid: true, maxItems: 8, label: function (c) { return (React.createElement(Selected, null,
+                    React.createElement(SelectedCountry, null,
+                        React.createElement(CountryFormatter, { type: "both", value: c, locale: locale })),
+                    React.createElement(Code, null,
+                        "+",
+                        DIAL_BY_ISO[c]))); } },
+                React.createElement(Dropdown.Column, null, function (c) { return (React.createElement(CountryFormatter, { type: "both", value: c, locale: locale })); }),
+                React.createElement(Dropdown.Column, { width: "40px", align: "right" }, function (c) { return (React.createElement(Code, null,
+                    "+",
+                    DIAL_BY_ISO[c])); }))),
+        React.createElement(Number, null,
+            React.createElement(Input, { name: name, value: national, onChange: handleNational, disabled: disabled, error: error, ghost: ghost, transparent: transparent, fluid: true, clearable: clearable, type: "text", autocomplete: "off", placeholder: placeholder }))));
+};
+PhoneInput.displayName = 'PhoneInput';
+var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 8px;\n  width: ", ";\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 8px;\n  width: ", ";\n"])), function (p) { return (p.$fluid ? '100%' : 'auto'); });
+var Prefix = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  flex: 0 0 auto;\n  width: 220px;\n"], ["\n  flex: 0 0 auto;\n  width: 220px;\n"])));
+var Number = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  flex: 1 1 auto;\n  min-width: 0;\n"], ["\n  flex: 1 1 auto;\n  min-width: 0;\n"])));
+var Selected = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 6px;\n  min-width: 0;\n  white-space: nowrap;\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 6px;\n  min-width: 0;\n  white-space: nowrap;\n"])));
+/* Lets the country name ellipsize so the dialing code stays visible. */
+var SelectedCountry = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  min-width: 0;\n  overflow: hidden;\n"], ["\n  min-width: 0;\n  overflow: hidden;\n"])));
+var Code = styled.span(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  flex: 0 0 auto;\n  opacity: 0.7;\n"], ["\n  flex: 0 0 auto;\n  opacity: 0.7;\n"])));
+export { PhoneInput };
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/inputs/PhoneInput/index.d.ts

@@ -0,0 +1,2 @@
+export { PhoneInput } from './PhoneInput';
+export type { IPhoneInputProps } from './PhoneInput';

package/inputs/PhoneInput/index.js

@@ -0,0 +1 @@
+export { PhoneInput } from './PhoneInput';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@longline/aqua-ui",
-  "version": "1.0.337",
+  "version": "1.0.339",
   "description": "AquaUI",
   "author": "Alexander van Oostenrijk / Longline Environment",
   "license": "Commercial",