@codebit-programando-solucoes/codebit-web-antd 1.1.38 → 1.1.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/PhoneInput.d.ts +49 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/index.cjs +476 -108
- package/package.json +1 -1
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { JSX } from 'react';
|
|
2
|
+
|
|
3
|
+
/** Props for the PhoneInput component */
|
|
4
|
+
export interface PhoneInputProps {
|
|
5
|
+
/**
|
|
6
|
+
* Full phone number as raw digits including the dial code prefix.
|
|
7
|
+
*
|
|
8
|
+
* @example "5516991234567" // Brazilian number
|
|
9
|
+
* @example "15551234567" // US number
|
|
10
|
+
*/
|
|
11
|
+
value?: string;
|
|
12
|
+
|
|
13
|
+
/** Called with raw digits (dial code + local) whenever the value changes */
|
|
14
|
+
onChange?: (value: string) => void;
|
|
15
|
+
|
|
16
|
+
/** Whether the input is disabled */
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
|
|
19
|
+
/** Size variant, forwarded to the underlying Ant Design components */
|
|
20
|
+
size?: 'large' | 'middle' | 'small';
|
|
21
|
+
|
|
22
|
+
/** Placeholder text shown inside the phone number input */
|
|
23
|
+
placeholder?: string;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* International phone input with a country selector.
|
|
28
|
+
*
|
|
29
|
+
* Integrates with antd Form: `value` and `onChange` deal in raw digits that include the
|
|
30
|
+
* dial code prefix — e.g. `"5516991234567"` for a Brazilian number or `"15551234567"` for
|
|
31
|
+
* a US number. The visible input applies a per-country mask for readability; `onChange`
|
|
32
|
+
* always fires with clean digits.
|
|
33
|
+
*/
|
|
34
|
+
export function PhoneInput(props: PhoneInputProps): JSX.Element;
|
|
35
|
+
|
|
36
|
+
export namespace PhoneInput {
|
|
37
|
+
/**
|
|
38
|
+
* Formats a raw international phone number (digits only, with dial code prefix) into a
|
|
39
|
+
* human-readable string that includes the country flag, dial code, and local mask.
|
|
40
|
+
*
|
|
41
|
+
* Returns an empty string when `fullDigits` is falsy.
|
|
42
|
+
*
|
|
43
|
+
* @example
|
|
44
|
+
* PhoneInput.format("5516991234567") // "🇧🇷 +55 (16) 99123-4567"
|
|
45
|
+
* PhoneInput.format("15551234567") // "🇺🇸 +1 (555) 123-4567"
|
|
46
|
+
* PhoneInput.format("351912345678") // "🇵🇹 +351 (91) 234-567"
|
|
47
|
+
*/
|
|
48
|
+
function format(fullDigits?: string): string;
|
|
49
|
+
}
|
package/dist/index.cjs
CHANGED
|
@@ -316,113 +316,10 @@ var __webpack_exports__ = {};
|
|
|
316
316
|
CodebitConfigProvider: ()=>CodebitConfigProvider,
|
|
317
317
|
ElectronicBrainOutlinedIcon: ()=>ElectronicBrainOutlinedIcon,
|
|
318
318
|
OllamaOutlinedIcon: ()=>OllamaOutlinedIcon,
|
|
319
|
+
PhoneInput: ()=>PhoneInput,
|
|
319
320
|
ThemeToggle: ()=>ThemeToggle
|
|
320
321
|
});
|
|
321
|
-
|
|
322
|
-
const icons_namespaceObject = require("@ant-design/icons");
|
|
323
|
-
var icons_default = /*#__PURE__*/ __webpack_require__.n(icons_namespaceObject);
|
|
324
|
-
const external_antd_namespaceObject = require("antd");
|
|
325
|
-
const external_prop_types_namespaceObject = require("prop-types");
|
|
326
|
-
var external_prop_types_default = /*#__PURE__*/ __webpack_require__.n(external_prop_types_namespaceObject);
|
|
327
|
-
var external_react_ = __webpack_require__("react");
|
|
328
|
-
const external_react_router_namespaceObject = require("react-router");
|
|
329
|
-
const react_namespaceObject = require("@sentry/react");
|
|
330
|
-
const codebit_web_namespaceObject = require("@codebit-programando-solucoes/codebit-web");
|
|
331
|
-
const logger = new codebit_web_namespaceObject.Logger('CodebitConfigContext');
|
|
332
|
-
const CodebitConfigContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
|
|
333
|
-
function CodebitConfigProvider({ children, menuItems, version = '1.0', showVersion = ()=>true, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, doLogout, checkLogin, onMenuClick }) {
|
|
334
|
-
const [isLogged, setIsLogged] = (0, external_react_.useState)(null);
|
|
335
|
-
const [user, setUser] = (0, external_react_.useState)(null);
|
|
336
|
-
const logout = async ()=>{
|
|
337
|
-
await doLogout();
|
|
338
|
-
setIsLogged(false);
|
|
339
|
-
setUser(null);
|
|
340
|
-
react_namespaceObject.setUser(null);
|
|
341
|
-
};
|
|
342
|
-
(0, external_react_.useEffect)(()=>{
|
|
343
|
-
if (null === isLogged) checkLogin().then((loggedUser)=>{
|
|
344
|
-
if (loggedUser) {
|
|
345
|
-
logger.trace('User data.', loggedUser);
|
|
346
|
-
setIsLogged(true);
|
|
347
|
-
setUser(loggedUser);
|
|
348
|
-
react_namespaceObject.setUser({
|
|
349
|
-
id: loggedUser.id,
|
|
350
|
-
email: loggedUser.email,
|
|
351
|
-
name: loggedUser.name
|
|
352
|
-
});
|
|
353
|
-
} else {
|
|
354
|
-
logger.trace('User not logged in.');
|
|
355
|
-
setIsLogged(false);
|
|
356
|
-
setUser(null);
|
|
357
|
-
react_namespaceObject.setUser(null);
|
|
358
|
-
}
|
|
359
|
-
}).catch((e)=>{
|
|
360
|
-
logger.error('Error fetching session state.', e);
|
|
361
|
-
setIsLogged(false);
|
|
362
|
-
setUser(null);
|
|
363
|
-
});
|
|
364
|
-
}, [
|
|
365
|
-
isLogged
|
|
366
|
-
]);
|
|
367
|
-
const contextValue = (0, external_react_.useMemo)(()=>({
|
|
368
|
-
menuItems,
|
|
369
|
-
isLogged,
|
|
370
|
-
setIsLogged,
|
|
371
|
-
user,
|
|
372
|
-
logout,
|
|
373
|
-
version,
|
|
374
|
-
showVersion,
|
|
375
|
-
secondarySidebar,
|
|
376
|
-
secondarySidebarWidth,
|
|
377
|
-
bottomMenuItems,
|
|
378
|
-
onMenuClick
|
|
379
|
-
}), [
|
|
380
|
-
menuItems,
|
|
381
|
-
isLogged,
|
|
382
|
-
user,
|
|
383
|
-
version,
|
|
384
|
-
showVersion,
|
|
385
|
-
secondarySidebar,
|
|
386
|
-
secondarySidebarWidth,
|
|
387
|
-
bottomMenuItems,
|
|
388
|
-
onMenuClick
|
|
389
|
-
]);
|
|
390
|
-
return /*#__PURE__*/ (0, jsx_runtime.jsx)(CodebitConfigContext.Provider, {
|
|
391
|
-
value: contextValue,
|
|
392
|
-
children: children
|
|
393
|
-
});
|
|
394
|
-
}
|
|
395
|
-
CodebitConfigProvider.propTypes = {
|
|
396
|
-
children: external_prop_types_default().node.isRequired,
|
|
397
|
-
menuItems: external_prop_types_default().func.isRequired,
|
|
398
|
-
version: external_prop_types_default().string,
|
|
399
|
-
showVersion: external_prop_types_default().func,
|
|
400
|
-
secondarySidebar: external_prop_types_default().func,
|
|
401
|
-
secondarySidebarWidth: external_prop_types_default().number,
|
|
402
|
-
bottomMenuItems: external_prop_types_default().func,
|
|
403
|
-
doLogout: external_prop_types_default().func.isRequired,
|
|
404
|
-
checkLogin: external_prop_types_default().func.isRequired,
|
|
405
|
-
onMenuClick: external_prop_types_default().func
|
|
406
|
-
};
|
|
407
|
-
const ThemeToggle = ()=>{
|
|
408
|
-
const config = (0, external_react_.useContext)(CodebitThemeContext);
|
|
409
|
-
if (!config) throw new Error('ThemeToggle must be used within CodebitThemeContext');
|
|
410
|
-
(0, external_react_.useEffect)(()=>{
|
|
411
|
-
document.documentElement.style.colorScheme = config.isDarkMode ? 'dark' : 'light';
|
|
412
|
-
}, [
|
|
413
|
-
config.isDarkMode
|
|
414
|
-
]);
|
|
415
|
-
return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Switch, {
|
|
416
|
-
theme: config.isDarkMode ? 'dark' : 'light',
|
|
417
|
-
checked: config.isDarkMode,
|
|
418
|
-
onChange: (value)=>config.setIsDarkMode(value),
|
|
419
|
-
checkedChildren: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MoonOutlined, {}),
|
|
420
|
-
unCheckedChildren: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.SunOutlined, {})
|
|
421
|
-
});
|
|
422
|
-
};
|
|
423
|
-
const external_react_i18next_namespaceObject = require("react-i18next");
|
|
424
|
-
const external_i18next_namespaceObject = require("i18next");
|
|
425
|
-
const pt = {
|
|
322
|
+
const locales_pt = {
|
|
426
323
|
codebitWebAntd: {
|
|
427
324
|
LoggedMainContainer: {
|
|
428
325
|
theme: 'Tema',
|
|
@@ -525,6 +422,35 @@ var __webpack_exports__ = {};
|
|
|
525
422
|
muteAudio: 'Ativar som',
|
|
526
423
|
unmuteAudio: 'Desativar som'
|
|
527
424
|
},
|
|
425
|
+
PhoneInput: {
|
|
426
|
+
countries: {
|
|
427
|
+
BR: 'Brasil',
|
|
428
|
+
US: 'EUA',
|
|
429
|
+
CA: 'Canadá',
|
|
430
|
+
MX: 'México',
|
|
431
|
+
AR: 'Argentina',
|
|
432
|
+
CL: 'Chile',
|
|
433
|
+
CO: 'Colômbia',
|
|
434
|
+
PE: 'Peru',
|
|
435
|
+
VE: 'Venezuela',
|
|
436
|
+
UY: 'Uruguai',
|
|
437
|
+
PY: 'Paraguai',
|
|
438
|
+
BO: 'Bolívia',
|
|
439
|
+
PT: 'Portugal',
|
|
440
|
+
ES: 'Espanha',
|
|
441
|
+
IT: 'Itália',
|
|
442
|
+
FR: 'França',
|
|
443
|
+
DE: 'Alemanha',
|
|
444
|
+
GB: 'Reino Unido',
|
|
445
|
+
AO: 'Angola',
|
|
446
|
+
MZ: 'Moçambique',
|
|
447
|
+
ZA: 'África do Sul',
|
|
448
|
+
CN: 'China',
|
|
449
|
+
JP: 'Japão',
|
|
450
|
+
IN: 'Índia',
|
|
451
|
+
AU: 'Austrália'
|
|
452
|
+
}
|
|
453
|
+
},
|
|
528
454
|
Common: {
|
|
529
455
|
ok: 'Ok',
|
|
530
456
|
close: 'Fechar',
|
|
@@ -534,7 +460,7 @@ var __webpack_exports__ = {};
|
|
|
534
460
|
}
|
|
535
461
|
}
|
|
536
462
|
};
|
|
537
|
-
const
|
|
463
|
+
const locales_en = {
|
|
538
464
|
codebitWebAntd: {
|
|
539
465
|
LoggedMainContainer: {
|
|
540
466
|
theme: 'Theme',
|
|
@@ -637,6 +563,35 @@ var __webpack_exports__ = {};
|
|
|
637
563
|
muteAudio: 'Mute audio',
|
|
638
564
|
unmuteAudio: 'Unmute audio'
|
|
639
565
|
},
|
|
566
|
+
PhoneInput: {
|
|
567
|
+
countries: {
|
|
568
|
+
BR: 'Brazil',
|
|
569
|
+
US: 'USA',
|
|
570
|
+
CA: 'Canada',
|
|
571
|
+
MX: 'Mexico',
|
|
572
|
+
AR: 'Argentina',
|
|
573
|
+
CL: 'Chile',
|
|
574
|
+
CO: 'Colombia',
|
|
575
|
+
PE: 'Peru',
|
|
576
|
+
VE: 'Venezuela',
|
|
577
|
+
UY: 'Uruguay',
|
|
578
|
+
PY: 'Paraguay',
|
|
579
|
+
BO: 'Bolivia',
|
|
580
|
+
PT: 'Portugal',
|
|
581
|
+
ES: 'Spain',
|
|
582
|
+
IT: 'Italy',
|
|
583
|
+
FR: 'France',
|
|
584
|
+
DE: 'Germany',
|
|
585
|
+
GB: 'United Kingdom',
|
|
586
|
+
AO: 'Angola',
|
|
587
|
+
MZ: 'Mozambique',
|
|
588
|
+
ZA: 'South Africa',
|
|
589
|
+
CN: 'China',
|
|
590
|
+
JP: 'Japan',
|
|
591
|
+
IN: 'India',
|
|
592
|
+
AU: 'Australia'
|
|
593
|
+
}
|
|
594
|
+
},
|
|
640
595
|
Common: {
|
|
641
596
|
ok: 'Ok',
|
|
642
597
|
close: 'Close',
|
|
@@ -646,11 +601,115 @@ var __webpack_exports__ = {};
|
|
|
646
601
|
}
|
|
647
602
|
}
|
|
648
603
|
};
|
|
604
|
+
var jsx_runtime = __webpack_require__("../../node_modules/.pnpm/react@19.2.3/node_modules/react/jsx-runtime.js");
|
|
605
|
+
const icons_namespaceObject = require("@ant-design/icons");
|
|
606
|
+
var icons_default = /*#__PURE__*/ __webpack_require__.n(icons_namespaceObject);
|
|
607
|
+
const external_antd_namespaceObject = require("antd");
|
|
608
|
+
const external_prop_types_namespaceObject = require("prop-types");
|
|
609
|
+
var external_prop_types_default = /*#__PURE__*/ __webpack_require__.n(external_prop_types_namespaceObject);
|
|
610
|
+
var external_react_ = __webpack_require__("react");
|
|
611
|
+
const external_react_router_namespaceObject = require("react-router");
|
|
612
|
+
const react_namespaceObject = require("@sentry/react");
|
|
613
|
+
const codebit_web_namespaceObject = require("@codebit-programando-solucoes/codebit-web");
|
|
614
|
+
const logger = new codebit_web_namespaceObject.Logger('CodebitConfigContext');
|
|
615
|
+
const CodebitConfigContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
|
|
616
|
+
function CodebitConfigProvider({ children, menuItems, version = '1.0', showVersion = ()=>true, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, doLogout, checkLogin, onMenuClick }) {
|
|
617
|
+
const [isLogged, setIsLogged] = (0, external_react_.useState)(null);
|
|
618
|
+
const [user, setUser] = (0, external_react_.useState)(null);
|
|
619
|
+
const logout = async ()=>{
|
|
620
|
+
await doLogout();
|
|
621
|
+
setIsLogged(false);
|
|
622
|
+
setUser(null);
|
|
623
|
+
react_namespaceObject.setUser(null);
|
|
624
|
+
};
|
|
625
|
+
(0, external_react_.useEffect)(()=>{
|
|
626
|
+
if (null === isLogged) checkLogin().then((loggedUser)=>{
|
|
627
|
+
if (loggedUser) {
|
|
628
|
+
logger.trace('User data.', loggedUser);
|
|
629
|
+
setIsLogged(true);
|
|
630
|
+
setUser(loggedUser);
|
|
631
|
+
react_namespaceObject.setUser({
|
|
632
|
+
id: loggedUser.id,
|
|
633
|
+
email: loggedUser.email,
|
|
634
|
+
name: loggedUser.name
|
|
635
|
+
});
|
|
636
|
+
} else {
|
|
637
|
+
logger.trace('User not logged in.');
|
|
638
|
+
setIsLogged(false);
|
|
639
|
+
setUser(null);
|
|
640
|
+
react_namespaceObject.setUser(null);
|
|
641
|
+
}
|
|
642
|
+
}).catch((e)=>{
|
|
643
|
+
logger.error('Error fetching session state.', e);
|
|
644
|
+
setIsLogged(false);
|
|
645
|
+
setUser(null);
|
|
646
|
+
});
|
|
647
|
+
}, [
|
|
648
|
+
isLogged
|
|
649
|
+
]);
|
|
650
|
+
const contextValue = (0, external_react_.useMemo)(()=>({
|
|
651
|
+
menuItems,
|
|
652
|
+
isLogged,
|
|
653
|
+
setIsLogged,
|
|
654
|
+
user,
|
|
655
|
+
logout,
|
|
656
|
+
version,
|
|
657
|
+
showVersion,
|
|
658
|
+
secondarySidebar,
|
|
659
|
+
secondarySidebarWidth,
|
|
660
|
+
bottomMenuItems,
|
|
661
|
+
onMenuClick
|
|
662
|
+
}), [
|
|
663
|
+
menuItems,
|
|
664
|
+
isLogged,
|
|
665
|
+
user,
|
|
666
|
+
version,
|
|
667
|
+
showVersion,
|
|
668
|
+
secondarySidebar,
|
|
669
|
+
secondarySidebarWidth,
|
|
670
|
+
bottomMenuItems,
|
|
671
|
+
onMenuClick
|
|
672
|
+
]);
|
|
673
|
+
return /*#__PURE__*/ (0, jsx_runtime.jsx)(CodebitConfigContext.Provider, {
|
|
674
|
+
value: contextValue,
|
|
675
|
+
children: children
|
|
676
|
+
});
|
|
677
|
+
}
|
|
678
|
+
CodebitConfigProvider.propTypes = {
|
|
679
|
+
children: external_prop_types_default().node.isRequired,
|
|
680
|
+
menuItems: external_prop_types_default().func.isRequired,
|
|
681
|
+
version: external_prop_types_default().string,
|
|
682
|
+
showVersion: external_prop_types_default().func,
|
|
683
|
+
secondarySidebar: external_prop_types_default().func,
|
|
684
|
+
secondarySidebarWidth: external_prop_types_default().number,
|
|
685
|
+
bottomMenuItems: external_prop_types_default().func,
|
|
686
|
+
doLogout: external_prop_types_default().func.isRequired,
|
|
687
|
+
checkLogin: external_prop_types_default().func.isRequired,
|
|
688
|
+
onMenuClick: external_prop_types_default().func
|
|
689
|
+
};
|
|
690
|
+
const ThemeToggle = ()=>{
|
|
691
|
+
const config = (0, external_react_.useContext)(CodebitThemeContext);
|
|
692
|
+
if (!config) throw new Error('ThemeToggle must be used within CodebitThemeContext');
|
|
693
|
+
(0, external_react_.useEffect)(()=>{
|
|
694
|
+
document.documentElement.style.colorScheme = config.isDarkMode ? 'dark' : 'light';
|
|
695
|
+
}, [
|
|
696
|
+
config.isDarkMode
|
|
697
|
+
]);
|
|
698
|
+
return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Switch, {
|
|
699
|
+
theme: config.isDarkMode ? 'dark' : 'light',
|
|
700
|
+
checked: config.isDarkMode,
|
|
701
|
+
onChange: (value)=>config.setIsDarkMode(value),
|
|
702
|
+
checkedChildren: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MoonOutlined, {}),
|
|
703
|
+
unCheckedChildren: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.SunOutlined, {})
|
|
704
|
+
});
|
|
705
|
+
};
|
|
706
|
+
const external_react_i18next_namespaceObject = require("react-i18next");
|
|
707
|
+
const external_i18next_namespaceObject = require("i18next");
|
|
649
708
|
const i18nLib = external_i18next_namespaceObject.createInstance();
|
|
650
709
|
i18nLib.use(external_react_i18next_namespaceObject.initReactI18next).init({
|
|
651
710
|
resources: {
|
|
652
|
-
pt:
|
|
653
|
-
en:
|
|
711
|
+
pt: locales_pt,
|
|
712
|
+
en: locales_en
|
|
654
713
|
},
|
|
655
714
|
lng: 'pt',
|
|
656
715
|
fallbackLng: 'pt',
|
|
@@ -1147,6 +1206,313 @@ var __webpack_exports__ = {};
|
|
|
1147
1206
|
AudioPlayer.propTypes = {
|
|
1148
1207
|
audioUrl: external_prop_types_default().string.isRequired
|
|
1149
1208
|
};
|
|
1209
|
+
const COUNTRIES = [
|
|
1210
|
+
{
|
|
1211
|
+
code: 'BR',
|
|
1212
|
+
dialCode: '55',
|
|
1213
|
+
flag: '🇧🇷',
|
|
1214
|
+
maxLocalDigits: 11
|
|
1215
|
+
},
|
|
1216
|
+
{
|
|
1217
|
+
code: 'US',
|
|
1218
|
+
dialCode: '1',
|
|
1219
|
+
flag: '🇺🇸',
|
|
1220
|
+
maxLocalDigits: 10
|
|
1221
|
+
},
|
|
1222
|
+
{
|
|
1223
|
+
code: 'CA',
|
|
1224
|
+
dialCode: '1',
|
|
1225
|
+
flag: '🇨🇦',
|
|
1226
|
+
maxLocalDigits: 10
|
|
1227
|
+
},
|
|
1228
|
+
{
|
|
1229
|
+
code: 'MX',
|
|
1230
|
+
dialCode: '52',
|
|
1231
|
+
flag: '🇲🇽',
|
|
1232
|
+
maxLocalDigits: 10
|
|
1233
|
+
},
|
|
1234
|
+
{
|
|
1235
|
+
code: 'AR',
|
|
1236
|
+
dialCode: '54',
|
|
1237
|
+
flag: '🇦🇷',
|
|
1238
|
+
maxLocalDigits: 10
|
|
1239
|
+
},
|
|
1240
|
+
{
|
|
1241
|
+
code: 'CL',
|
|
1242
|
+
dialCode: '56',
|
|
1243
|
+
flag: '🇨🇱',
|
|
1244
|
+
maxLocalDigits: 9
|
|
1245
|
+
},
|
|
1246
|
+
{
|
|
1247
|
+
code: 'CO',
|
|
1248
|
+
dialCode: '57',
|
|
1249
|
+
flag: '🇨🇴',
|
|
1250
|
+
maxLocalDigits: 10
|
|
1251
|
+
},
|
|
1252
|
+
{
|
|
1253
|
+
code: 'PE',
|
|
1254
|
+
dialCode: '51',
|
|
1255
|
+
flag: '🇵🇪',
|
|
1256
|
+
maxLocalDigits: 9
|
|
1257
|
+
},
|
|
1258
|
+
{
|
|
1259
|
+
code: 'VE',
|
|
1260
|
+
dialCode: '58',
|
|
1261
|
+
flag: '🇻🇪',
|
|
1262
|
+
maxLocalDigits: 10
|
|
1263
|
+
},
|
|
1264
|
+
{
|
|
1265
|
+
code: 'UY',
|
|
1266
|
+
dialCode: '598',
|
|
1267
|
+
flag: '🇺🇾',
|
|
1268
|
+
maxLocalDigits: 8
|
|
1269
|
+
},
|
|
1270
|
+
{
|
|
1271
|
+
code: 'PY',
|
|
1272
|
+
dialCode: '595',
|
|
1273
|
+
flag: '🇵🇾',
|
|
1274
|
+
maxLocalDigits: 9
|
|
1275
|
+
},
|
|
1276
|
+
{
|
|
1277
|
+
code: 'BO',
|
|
1278
|
+
dialCode: '591',
|
|
1279
|
+
flag: '🇧🇴',
|
|
1280
|
+
maxLocalDigits: 8
|
|
1281
|
+
},
|
|
1282
|
+
{
|
|
1283
|
+
code: 'PT',
|
|
1284
|
+
dialCode: '351',
|
|
1285
|
+
flag: '🇵🇹',
|
|
1286
|
+
maxLocalDigits: 9
|
|
1287
|
+
},
|
|
1288
|
+
{
|
|
1289
|
+
code: 'ES',
|
|
1290
|
+
dialCode: '34',
|
|
1291
|
+
flag: '🇪🇸',
|
|
1292
|
+
maxLocalDigits: 9
|
|
1293
|
+
},
|
|
1294
|
+
{
|
|
1295
|
+
code: 'IT',
|
|
1296
|
+
dialCode: '39',
|
|
1297
|
+
flag: '🇮🇹',
|
|
1298
|
+
maxLocalDigits: 10
|
|
1299
|
+
},
|
|
1300
|
+
{
|
|
1301
|
+
code: 'FR',
|
|
1302
|
+
dialCode: '33',
|
|
1303
|
+
flag: '🇫🇷',
|
|
1304
|
+
maxLocalDigits: 9
|
|
1305
|
+
},
|
|
1306
|
+
{
|
|
1307
|
+
code: 'DE',
|
|
1308
|
+
dialCode: '49',
|
|
1309
|
+
flag: '🇩🇪',
|
|
1310
|
+
maxLocalDigits: 11
|
|
1311
|
+
},
|
|
1312
|
+
{
|
|
1313
|
+
code: 'GB',
|
|
1314
|
+
dialCode: '44',
|
|
1315
|
+
flag: '🇬🇧',
|
|
1316
|
+
maxLocalDigits: 10
|
|
1317
|
+
},
|
|
1318
|
+
{
|
|
1319
|
+
code: 'AO',
|
|
1320
|
+
dialCode: '244',
|
|
1321
|
+
flag: '🇦🇴',
|
|
1322
|
+
maxLocalDigits: 9
|
|
1323
|
+
},
|
|
1324
|
+
{
|
|
1325
|
+
code: 'MZ',
|
|
1326
|
+
dialCode: '258',
|
|
1327
|
+
flag: '🇲🇿',
|
|
1328
|
+
maxLocalDigits: 9
|
|
1329
|
+
},
|
|
1330
|
+
{
|
|
1331
|
+
code: 'ZA',
|
|
1332
|
+
dialCode: '27',
|
|
1333
|
+
flag: '🇿🇦',
|
|
1334
|
+
maxLocalDigits: 9
|
|
1335
|
+
},
|
|
1336
|
+
{
|
|
1337
|
+
code: 'CN',
|
|
1338
|
+
dialCode: '86',
|
|
1339
|
+
flag: '🇨🇳',
|
|
1340
|
+
maxLocalDigits: 11
|
|
1341
|
+
},
|
|
1342
|
+
{
|
|
1343
|
+
code: 'JP',
|
|
1344
|
+
dialCode: '81',
|
|
1345
|
+
flag: '🇯🇵',
|
|
1346
|
+
maxLocalDigits: 10
|
|
1347
|
+
},
|
|
1348
|
+
{
|
|
1349
|
+
code: 'IN',
|
|
1350
|
+
dialCode: '91',
|
|
1351
|
+
flag: '🇮🇳',
|
|
1352
|
+
maxLocalDigits: 10
|
|
1353
|
+
},
|
|
1354
|
+
{
|
|
1355
|
+
code: 'AU',
|
|
1356
|
+
dialCode: '61',
|
|
1357
|
+
flag: '🇦🇺',
|
|
1358
|
+
maxLocalDigits: 9
|
|
1359
|
+
}
|
|
1360
|
+
];
|
|
1361
|
+
function applyBrMask(digits) {
|
|
1362
|
+
if (digits.length <= 2) return `(${digits}`;
|
|
1363
|
+
if (digits.length <= 7) return `(${digits.slice(0, 2)}) ${digits.slice(2)}`;
|
|
1364
|
+
if (digits.length <= 10) return `(${digits.slice(0, 2)}) ${digits.slice(2, 6)}-${digits.slice(6)}`;
|
|
1365
|
+
return `(${digits.slice(0, 2)}) ${digits.slice(2, 7)}-${digits.slice(7, 11)}`;
|
|
1366
|
+
}
|
|
1367
|
+
function applyUsMask(digits) {
|
|
1368
|
+
if (digits.length <= 3) return `(${digits}`;
|
|
1369
|
+
if (digits.length <= 6) return `(${digits.slice(0, 3)}) ${digits.slice(3)}`;
|
|
1370
|
+
return `(${digits.slice(0, 3)}) ${digits.slice(3, 6)}-${digits.slice(6, 10)}`;
|
|
1371
|
+
}
|
|
1372
|
+
function applyArMask(digits) {
|
|
1373
|
+
if (digits.length <= 2) return `(${digits}`;
|
|
1374
|
+
if (digits.length <= 6) return `(${digits.slice(0, 2)}) ${digits.slice(2)}`;
|
|
1375
|
+
return `(${digits.slice(0, 2)}) ${digits.slice(2, 6)}-${digits.slice(6, 10)}`;
|
|
1376
|
+
}
|
|
1377
|
+
function applyGenericMask(digits, areaLen, totalLen) {
|
|
1378
|
+
if (digits.length <= areaLen) return `(${digits}`;
|
|
1379
|
+
const area = digits.slice(0, areaLen);
|
|
1380
|
+
const rest = digits.slice(areaLen, totalLen);
|
|
1381
|
+
const mid = Math.floor(rest.length / 2 + rest.length % 2);
|
|
1382
|
+
if (rest.length <= mid) return `(${area}) ${rest}`;
|
|
1383
|
+
return `(${area}) ${rest.slice(0, mid)}-${rest.slice(mid)}`;
|
|
1384
|
+
}
|
|
1385
|
+
function applyMask(digits, countryCode) {
|
|
1386
|
+
switch(countryCode){
|
|
1387
|
+
case 'BR':
|
|
1388
|
+
return applyBrMask(digits);
|
|
1389
|
+
case 'US':
|
|
1390
|
+
case 'CA':
|
|
1391
|
+
return applyUsMask(digits);
|
|
1392
|
+
case 'MX':
|
|
1393
|
+
case 'CO':
|
|
1394
|
+
case 'VE':
|
|
1395
|
+
return applyGenericMask(digits, 2, 10);
|
|
1396
|
+
case 'AR':
|
|
1397
|
+
return applyArMask(digits);
|
|
1398
|
+
case 'CL':
|
|
1399
|
+
case 'PE':
|
|
1400
|
+
case 'PT':
|
|
1401
|
+
case 'ES':
|
|
1402
|
+
case 'AU':
|
|
1403
|
+
case 'ZA':
|
|
1404
|
+
case 'AO':
|
|
1405
|
+
case 'MZ':
|
|
1406
|
+
return applyGenericMask(digits, 2, 9);
|
|
1407
|
+
case 'UY':
|
|
1408
|
+
case 'BO':
|
|
1409
|
+
return applyGenericMask(digits, 1, 8);
|
|
1410
|
+
case 'PY':
|
|
1411
|
+
return applyGenericMask(digits, 3, 9);
|
|
1412
|
+
case 'FR':
|
|
1413
|
+
return applyGenericMask(digits, 2, 9);
|
|
1414
|
+
case 'IT':
|
|
1415
|
+
return applyGenericMask(digits, 3, 10);
|
|
1416
|
+
case 'DE':
|
|
1417
|
+
return applyGenericMask(digits, 3, 11);
|
|
1418
|
+
case 'GB':
|
|
1419
|
+
return applyGenericMask(digits, 4, 10);
|
|
1420
|
+
case 'CN':
|
|
1421
|
+
return applyGenericMask(digits, 3, 11);
|
|
1422
|
+
case 'JP':
|
|
1423
|
+
return applyGenericMask(digits, 3, 10);
|
|
1424
|
+
case 'IN':
|
|
1425
|
+
return applyGenericMask(digits, 5, 10);
|
|
1426
|
+
default:
|
|
1427
|
+
return digits;
|
|
1428
|
+
}
|
|
1429
|
+
}
|
|
1430
|
+
function detectCountry(fullDigits) {
|
|
1431
|
+
if (!fullDigits) return COUNTRIES[0];
|
|
1432
|
+
const sorted = [
|
|
1433
|
+
...COUNTRIES
|
|
1434
|
+
].sort((a, b)=>b.dialCode.length - a.dialCode.length);
|
|
1435
|
+
for (const c of sorted)if (fullDigits.startsWith(c.dialCode)) return c;
|
|
1436
|
+
return COUNTRIES[0];
|
|
1437
|
+
}
|
|
1438
|
+
const PhoneInput = ({ value, onChange, disabled, size, placeholder })=>{
|
|
1439
|
+
const { t } = useCodebitWebAntdTranslation();
|
|
1440
|
+
const countrySearchLabel = (c)=>{
|
|
1441
|
+
const name = t(`PhoneInput.countries.${c.code}`);
|
|
1442
|
+
return `${c.flag} ${name} +${c.dialCode}`;
|
|
1443
|
+
};
|
|
1444
|
+
const [selectedCountry, setSelectedCountry] = (0, external_react_.useState)(()=>detectCountry(value));
|
|
1445
|
+
const [displayValue, setDisplayValue] = (0, external_react_.useState)(()=>{
|
|
1446
|
+
if (!value) return '';
|
|
1447
|
+
const country = detectCountry(value);
|
|
1448
|
+
const localDigits = value.slice(country.dialCode.length);
|
|
1449
|
+
return applyMask(localDigits, country.code);
|
|
1450
|
+
});
|
|
1451
|
+
(0, external_react_.useEffect)(()=>{
|
|
1452
|
+
if (!value) return void setDisplayValue('');
|
|
1453
|
+
const country = detectCountry(value);
|
|
1454
|
+
setSelectedCountry(country);
|
|
1455
|
+
const localDigits = value.slice(country.dialCode.length);
|
|
1456
|
+
setDisplayValue(applyMask(localDigits, country.code));
|
|
1457
|
+
}, [
|
|
1458
|
+
value
|
|
1459
|
+
]);
|
|
1460
|
+
const handleCountryChange = (countryCode)=>{
|
|
1461
|
+
const country = COUNTRIES.find((c)=>c.code === countryCode) ?? COUNTRIES[0];
|
|
1462
|
+
setSelectedCountry(country);
|
|
1463
|
+
setDisplayValue('');
|
|
1464
|
+
onChange?.('');
|
|
1465
|
+
};
|
|
1466
|
+
const handleInputChange = (e)=>{
|
|
1467
|
+
const rawDigits = e.target.value.replaceAll(/\D/g, '').slice(0, selectedCountry.maxLocalDigits);
|
|
1468
|
+
setDisplayValue(applyMask(rawDigits, selectedCountry.code));
|
|
1469
|
+
onChange?.(selectedCountry.dialCode + rawDigits);
|
|
1470
|
+
};
|
|
1471
|
+
const countrySelector = /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Select, {
|
|
1472
|
+
value: selectedCountry.code,
|
|
1473
|
+
onChange: handleCountryChange,
|
|
1474
|
+
disabled: disabled,
|
|
1475
|
+
size: size,
|
|
1476
|
+
style: {
|
|
1477
|
+
width: 110
|
|
1478
|
+
},
|
|
1479
|
+
popupMatchSelectWidth: false,
|
|
1480
|
+
showSearch: true,
|
|
1481
|
+
filterOption: (input, option)=>option?.searchLabel?.toLowerCase().includes(input.toLowerCase()) ?? false,
|
|
1482
|
+
options: COUNTRIES.map((c)=>({
|
|
1483
|
+
value: c.code,
|
|
1484
|
+
label: `${c.flag} +${c.dialCode}`,
|
|
1485
|
+
searchLabel: countrySearchLabel(c)
|
|
1486
|
+
})),
|
|
1487
|
+
optionRender: (option)=>option.data.searchLabel
|
|
1488
|
+
});
|
|
1489
|
+
return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Input, {
|
|
1490
|
+
addonBefore: countrySelector,
|
|
1491
|
+
value: displayValue,
|
|
1492
|
+
onChange: handleInputChange,
|
|
1493
|
+
disabled: disabled,
|
|
1494
|
+
size: size,
|
|
1495
|
+
placeholder: placeholder
|
|
1496
|
+
});
|
|
1497
|
+
};
|
|
1498
|
+
PhoneInput.propTypes = {
|
|
1499
|
+
value: external_prop_types_default().string,
|
|
1500
|
+
onChange: external_prop_types_default().func,
|
|
1501
|
+
disabled: external_prop_types_default().bool,
|
|
1502
|
+
size: external_prop_types_default().oneOf([
|
|
1503
|
+
'large',
|
|
1504
|
+
'middle',
|
|
1505
|
+
'small'
|
|
1506
|
+
]),
|
|
1507
|
+
placeholder: external_prop_types_default().string
|
|
1508
|
+
};
|
|
1509
|
+
PhoneInput.format = (fullDigits)=>{
|
|
1510
|
+
if (!fullDigits) return '';
|
|
1511
|
+
const country = detectCountry(fullDigits);
|
|
1512
|
+
const localDigits = fullDigits.slice(country.dialCode.length);
|
|
1513
|
+
const masked = applyMask(localDigits, country.code);
|
|
1514
|
+
return `${country.flag} +${country.dialCode} ${masked}`;
|
|
1515
|
+
};
|
|
1150
1516
|
const CodebitThemeContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
|
|
1151
1517
|
const CodebitThemeProvider = ({ children, storeThemeInLocalStorage = true, containerId = 'root', forcedTheme = null, ...props })=>{
|
|
1152
1518
|
const hasLoaded = (0, external_react_.useRef)(false);
|
|
@@ -2319,6 +2685,7 @@ exports.LoggedMainContainer = __webpack_exports__.LoggedMainContainer;
|
|
|
2319
2685
|
exports.Login = __webpack_exports__.Login;
|
|
2320
2686
|
exports.LoginContainer = __webpack_exports__.LoginContainer;
|
|
2321
2687
|
exports.OllamaOutlinedIcon = __webpack_exports__.OllamaOutlinedIcon;
|
|
2688
|
+
exports.PhoneInput = __webpack_exports__.PhoneInput;
|
|
2322
2689
|
exports.TableContainer = __webpack_exports__.TableContainer;
|
|
2323
2690
|
exports.ThemeToggle = __webpack_exports__.ThemeToggle;
|
|
2324
2691
|
exports.useErrorMessage = __webpack_exports__.useErrorMessage;
|
|
@@ -2345,6 +2712,7 @@ for(var __rspack_i in __webpack_exports__)if (-1 === [
|
|
|
2345
2712
|
"Login",
|
|
2346
2713
|
"LoginContainer",
|
|
2347
2714
|
"OllamaOutlinedIcon",
|
|
2715
|
+
"PhoneInput",
|
|
2348
2716
|
"TableContainer",
|
|
2349
2717
|
"ThemeToggle",
|
|
2350
2718
|
"useErrorMessage",
|