@tecsinapse/cortex-react 2.1.0-beta.5 → 2.1.1-beta.2

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.
Files changed (31) hide show
  1. package/dist/cjs/index.js +0 -2
  2. package/dist/cjs/provider/ManagerContext.js +0 -4
  3. package/dist/cjs/service/SnackbarSonner.js +31 -0
  4. package/dist/esm/index.js +0 -1
  5. package/dist/esm/provider/ManagerContext.js +0 -4
  6. package/dist/esm/service/SnackbarSonner.js +31 -0
  7. package/dist/types/components/index.d.ts +0 -1
  8. package/dist/types/service/SnackbarSonner.d.ts +19 -0
  9. package/package.json +3 -4
  10. package/dist/cjs/components/PhoneInput/Option.js +0 -29
  11. package/dist/cjs/components/PhoneInput/Options.js +0 -117
  12. package/dist/cjs/components/PhoneInput/Popover.js +0 -23
  13. package/dist/cjs/components/PhoneInput/Root.js +0 -61
  14. package/dist/cjs/components/PhoneInput/Trigger.js +0 -117
  15. package/dist/cjs/components/PhoneInput/context.js +0 -19
  16. package/dist/cjs/components/PhoneInput/index.js +0 -17
  17. package/dist/esm/components/PhoneInput/Option.js +0 -27
  18. package/dist/esm/components/PhoneInput/Options.js +0 -115
  19. package/dist/esm/components/PhoneInput/Popover.js +0 -21
  20. package/dist/esm/components/PhoneInput/Root.js +0 -59
  21. package/dist/esm/components/PhoneInput/Trigger.js +0 -115
  22. package/dist/esm/components/PhoneInput/context.js +0 -16
  23. package/dist/esm/components/PhoneInput/index.js +0 -15
  24. package/dist/types/components/PhoneInput/Option.d.ts +0 -6
  25. package/dist/types/components/PhoneInput/Options.d.ts +0 -3
  26. package/dist/types/components/PhoneInput/Popover.d.ts +0 -4
  27. package/dist/types/components/PhoneInput/Root.d.ts +0 -2
  28. package/dist/types/components/PhoneInput/Trigger.d.ts +0 -2
  29. package/dist/types/components/PhoneInput/context.d.ts +0 -15
  30. package/dist/types/components/PhoneInput/index.d.ts +0 -16
  31. package/dist/types/components/PhoneInput/types.d.ts +0 -13
package/dist/cjs/index.js CHANGED
@@ -44,7 +44,6 @@ var TimeFieldInput = require('./components/TimePicker/TimeFieldInput.js');
44
44
  var Toggle = require('./components/Toggle.js');
45
45
  var Tooltip = require('./components/Tooltip.js');
46
46
  var index$7 = require('./components/Uploader/index.js');
47
- var index$8 = require('./components/PhoneInput/index.js');
48
47
  var useCalendar = require('./hooks/useCalendar.js');
49
48
  var useCalendarCell = require('./hooks/useCalendarCell.js');
50
49
  var useCalendarGrid = require('./hooks/useCalendarGrid.js');
@@ -128,7 +127,6 @@ exports.TimeFieldInput = TimeFieldInput.TimeFieldInput;
128
127
  exports.Toggle = Toggle.Toggle;
129
128
  exports.Tooltip = Tooltip.Tooltip;
130
129
  exports.Uploader = index$7.Uploader;
131
- exports.PhoneInput = index$8.PhoneInput;
132
130
  exports.useCalendar = useCalendar.useCalendar;
133
131
  exports.useCalendarCell = useCalendarCell.useCalendarCell;
134
132
  exports.useCalendarGrid = useCalendarGrid.useCalendarGrid;
@@ -66,10 +66,6 @@ require('../components/Tooltip.js');
66
66
  require('react-icons/hi2');
67
67
  require('react-icons/fa6');
68
68
  require('react-dom');
69
- require('../components/PhoneInput/Options.js');
70
- require('../components/PhoneInput/context.js');
71
- require('react-international-phone');
72
- require('react-icons/io5');
73
69
 
74
70
  const ManagerContext = React.createContext(null);
75
71
  const ManagerProvider = ({ children }) => {
@@ -35,6 +35,37 @@ class SnackbarSonner {
35
35
  { ...this._options, ...options }
36
36
  );
37
37
  }
38
+ promise(promise, config) {
39
+ const { loading, success, error } = config;
40
+ const id = this.show(loading.type ?? "info", loading.message, {
41
+ ...loading.options,
42
+ duration: loading.options?.duration ?? Infinity
43
+ });
44
+ promise().then((result) => {
45
+ if (!success) {
46
+ sonner.toast.dismiss(id);
47
+ return;
48
+ }
49
+ const msg = typeof success.message === "function" ? success.message(result) : success.message ?? "Opera\xE7\xE3o conclu\xEDda com sucesso.";
50
+ this.show(success.type ?? "success", msg, {
51
+ ...success.options,
52
+ id,
53
+ duration: success.options?.duration ?? this._options?.duration ?? 5e3
54
+ });
55
+ }).catch((err) => {
56
+ if (!error) {
57
+ sonner.toast.dismiss(id);
58
+ return;
59
+ }
60
+ const msg = typeof error.message === "function" ? error.message(err) : error.message ?? "Ocorreu um erro inesperado.";
61
+ this.show(error.type ?? "error", msg, {
62
+ ...error.options,
63
+ id,
64
+ duration: error.options?.duration ?? this._options?.duration ?? 5e3
65
+ });
66
+ });
67
+ return promise();
68
+ }
38
69
  }
39
70
 
40
71
  exports.SnackbarSonner = SnackbarSonner;
package/dist/esm/index.js CHANGED
@@ -42,7 +42,6 @@ export { TimeFieldInput } from './components/TimePicker/TimeFieldInput.js';
42
42
  export { Toggle } from './components/Toggle.js';
43
43
  export { Tooltip } from './components/Tooltip.js';
44
44
  export { Uploader } from './components/Uploader/index.js';
45
- export { PhoneInput } from './components/PhoneInput/index.js';
46
45
  export { useCalendar } from './hooks/useCalendar.js';
47
46
  export { useCalendarCell } from './hooks/useCalendarCell.js';
48
47
  export { useCalendarGrid } from './hooks/useCalendarGrid.js';
@@ -64,10 +64,6 @@ import '../components/Tooltip.js';
64
64
  import 'react-icons/hi2';
65
65
  import 'react-icons/fa6';
66
66
  import 'react-dom';
67
- import '../components/PhoneInput/Options.js';
68
- import '../components/PhoneInput/context.js';
69
- import 'react-international-phone';
70
- import 'react-icons/io5';
71
67
 
72
68
  const ManagerContext = createContext(null);
73
69
  const ManagerProvider = ({ children }) => {
@@ -33,6 +33,37 @@ class SnackbarSonner {
33
33
  { ...this._options, ...options }
34
34
  );
35
35
  }
36
+ promise(promise, config) {
37
+ const { loading, success, error } = config;
38
+ const id = this.show(loading.type ?? "info", loading.message, {
39
+ ...loading.options,
40
+ duration: loading.options?.duration ?? Infinity
41
+ });
42
+ promise().then((result) => {
43
+ if (!success) {
44
+ toast.dismiss(id);
45
+ return;
46
+ }
47
+ const msg = typeof success.message === "function" ? success.message(result) : success.message ?? "Opera\xE7\xE3o conclu\xEDda com sucesso.";
48
+ this.show(success.type ?? "success", msg, {
49
+ ...success.options,
50
+ id,
51
+ duration: success.options?.duration ?? this._options?.duration ?? 5e3
52
+ });
53
+ }).catch((err) => {
54
+ if (!error) {
55
+ toast.dismiss(id);
56
+ return;
57
+ }
58
+ const msg = typeof error.message === "function" ? error.message(err) : error.message ?? "Ocorreu um erro inesperado.";
59
+ this.show(error.type ?? "error", msg, {
60
+ ...error.options,
61
+ id,
62
+ duration: error.options?.duration ?? this._options?.duration ?? 5e3
63
+ });
64
+ });
65
+ return promise();
66
+ }
36
67
  }
37
68
 
38
69
  export { SnackbarSonner };
@@ -32,4 +32,3 @@ export * from './TimePicker';
32
32
  export * from './Toggle';
33
33
  export * from './Tooltip';
34
34
  export * from './Uploader';
35
- export * from './PhoneInput';
@@ -2,9 +2,28 @@ import React from 'react';
2
2
  import { ExternalToast } from 'sonner';
3
3
  import { ISnackbar, TypeSnack } from './ISnackbar';
4
4
  import { IExternalToast } from './IExternalToast';
5
+ interface PromiseSnackConfig<T = unknown> {
6
+ loading: {
7
+ message: string;
8
+ type?: TypeSnack;
9
+ options?: Omit<IExternalToast, 'className' | 'style'>;
10
+ };
11
+ success?: {
12
+ message?: string | ((data: T) => string);
13
+ type?: TypeSnack;
14
+ options?: Omit<IExternalToast, 'className' | 'style'>;
15
+ };
16
+ error?: {
17
+ message?: string | ((error: unknown) => string);
18
+ type?: TypeSnack;
19
+ options?: Omit<IExternalToast, 'className' | 'style'>;
20
+ };
21
+ }
5
22
  export declare class SnackbarSonner implements ISnackbar<IExternalToast> {
6
23
  _options?: IExternalToast;
7
24
  constructor(options?: IExternalToast);
8
25
  custom(Component: React.ReactElement, options?: ExternalToast): string | number;
9
26
  show(type: TypeSnack, message: string, options?: Omit<IExternalToast, 'className' | 'style'>): string | number;
27
+ promise<T>(promise: () => Promise<T>, config: PromiseSnackConfig<T>): Promise<T>;
10
28
  }
29
+ export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tecsinapse/cortex-react",
3
- "version": "2.1.0-beta.5",
3
+ "version": "2.1.1-beta.2",
4
4
  "description": "React components based in @tecsinapse/cortex-core",
5
5
  "license": "MIT",
6
6
  "main": "dist/esm/index.js",
@@ -28,7 +28,6 @@
28
28
  "react-aria": "3.38.1",
29
29
  "react-dropzone": "14.3.8",
30
30
  "react-imask": "7.6.1",
31
- "react-international-phone": "^4.6.1",
32
31
  "react-spring": "9.7.5",
33
32
  "react-stately": "3.36.1",
34
33
  "sonner": "1.7.3",
@@ -49,5 +48,5 @@
49
48
  "react-icons": ">=5.2.0",
50
49
  "tailwindcss": "^4.1.16"
51
50
  },
52
- "gitHead": "56ae580d1fcdbfec243b25fa743438398b1883d9"
53
- }
51
+ "gitHead": "f0d76cecde2e121d1d1a92664d110804ecce52f5"
52
+ }
@@ -1,29 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
-
5
- const PhoneInputOption = ({
6
- country,
7
- handleSelectCountry,
8
- disableClick = false
9
- }) => {
10
- return /* @__PURE__ */ jsxRuntime.jsxs(
11
- "button",
12
- {
13
- className: "flex w-full h-[2rem] items-center justify-between p-centi cursor-pointer hover:bg-gray-100",
14
- onClick: () => {
15
- handleSelectCountry(country);
16
- },
17
- disabled: disableClick,
18
- children: [
19
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: country?.name }),
20
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-gray-400 text-sm", children: [
21
- "+",
22
- country?.dialCode
23
- ] })
24
- ]
25
- }
26
- );
27
- };
28
-
29
- exports.PhoneInputOption = PhoneInputOption;
@@ -1,117 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var React = require('react');
5
- var Divider = require('../Divider.js');
6
- var context = require('./context.js');
7
- var Option = require('./Option.js');
8
- require('clsx');
9
- require('../Accordion/context.js');
10
- require('react-icons/lia');
11
- require('@internationalized/date');
12
- require('../Badge.js');
13
- require('react-icons/md');
14
- require('@tecsinapse/cortex-core');
15
- require('react-aria');
16
- require('react-stately');
17
- require('../../provider/MenubarContext.js');
18
- require('../../provider/SnackbarProvider.js');
19
- require('../../provider/CalendarProvider.js');
20
- require('../../provider/ManagerContext.js');
21
- require('../Popover/Context.js');
22
- require('react-dropzone');
23
- require('uuid');
24
- require('@floating-ui/react');
25
- require('currency.js');
26
- require('../Calendar/CalendarCell.js');
27
- require('react-icons/fa');
28
- require('react-icons/io');
29
- require('embla-carousel-react');
30
- require('embla-carousel-autoplay');
31
- require('../ColorPicker.js');
32
- require('../DatePicker/DateSegment.js');
33
- require('../DatePicker/DatePickerInputBase.js');
34
- require('../GroupButton.js');
35
- var index = require('../Input/index.js');
36
- require('../Menubar/Left.js');
37
- require('../../styles/menubar.js');
38
- require('../Menubar/Right.js');
39
- require('../Menubar/Dropdown.js');
40
- require('../Menubar/MostUsed.js');
41
- require('../Menubar/MostUsedItem.js');
42
- require('../Menubar/Header.js');
43
- require('../Menubar/Item.js');
44
- require('../../provider/CategoriesContext.js');
45
- require('../Menubar/SubItem.js');
46
- require('../ProgressBar/Progress.js');
47
- require('../RadioButton.js');
48
- require('../Select/GroupedOptions.js');
49
- require('../Select/context.js');
50
- require('../Select/MultiGroupedOptions.js');
51
- require('../Select/MultiOptions.js');
52
- require('../Select/Options.js');
53
- require('../Select/Trigger.js');
54
- require('../../styles/stepNodeVariants.js');
55
- require('../TextArea/Box.js');
56
- require('../TextArea/Face.js');
57
- require('../TextArea/Left.js');
58
- require('../TextArea/Right.js');
59
- require('../TextArea/Root.js');
60
- require('../TimePicker/TimeFieldInput.js');
61
- require('../Tooltip.js');
62
- require('react-icons/hi2');
63
- require('react-icons/fa6');
64
- require('react-dom');
65
- require('react-icons/io5');
66
- var reactInternationalPhone = require('react-international-phone');
67
-
68
- const countries = reactInternationalPhone.defaultCountries.map((c) => {
69
- return reactInternationalPhone.parseCountry(c);
70
- });
71
- const PhoneInputOptions = ({
72
- hasSearch = true
73
- }) => {
74
- const { country, setCountry, setIsOpen } = context.usePhoneContext();
75
- const [searchText, setSearchText] = React.useState("");
76
- const filteredCountries = React.useMemo(() => {
77
- return countries.filter(
78
- (c) => c.iso2 !== country?.iso2 && (c.name.toLowerCase().includes(searchText.toLowerCase()) || c.dialCode.includes(searchText))
79
- );
80
- }, [country, searchText]);
81
- const handleSelect = (country2) => {
82
- setCountry?.(country2.iso2);
83
- setIsOpen?.(false);
84
- };
85
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full h-full flex flex-col overflow-y-auto", children: [
86
- hasSearch ? /* @__PURE__ */ jsxRuntime.jsx(
87
- index.Input.Search,
88
- {
89
- onChange: (e) => setSearchText(e.target.value),
90
- variants: { className: "mx-deca my-centi outline-none" }
91
- }
92
- ) : null,
93
- country ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
94
- /* @__PURE__ */ jsxRuntime.jsx(
95
- Option.PhoneInputOption,
96
- {
97
- country,
98
- handleSelectCountry: handleSelect,
99
- disableClick: true
100
- }
101
- ),
102
- /* @__PURE__ */ jsxRuntime.jsx(Divider.Divider, {})
103
- ] }) : null,
104
- filteredCountries.map((country2) => {
105
- return /* @__PURE__ */ jsxRuntime.jsx(
106
- Option.PhoneInputOption,
107
- {
108
- country: country2,
109
- handleSelectCountry: handleSelect
110
- },
111
- `${country2.dialCode} ${country2.iso2}`
112
- );
113
- })
114
- ] });
115
- };
116
-
117
- exports.PhoneInputOptions = PhoneInputOptions;
@@ -1,23 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var react = require('@floating-ui/react');
5
- var index = require('../Popover/index.js');
6
- var context = require('./context.js');
7
-
8
- const PhoneInputPopover = ({ children }) => {
9
- const { triggerWidth } = context.usePhoneContext();
10
- return /* @__PURE__ */ jsxRuntime.jsx(react.FloatingPortal, { children: /* @__PURE__ */ jsxRuntime.jsx(
11
- index.Popover.Content,
12
- {
13
- className: "bg-white shadow-md rounded-md overflow-hidden h-full max-h-[30vh] outline-none",
14
- style: {
15
- zIndex: 9999,
16
- width: triggerWidth ? `${triggerWidth}px` : "auto"
17
- },
18
- children
19
- }
20
- ) });
21
- };
22
-
23
- exports.PhoneInputPopover = PhoneInputPopover;
@@ -1,61 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var React = require('react');
5
- var index = require('../Popover/index.js');
6
- var clsx = require('clsx');
7
- var reactInternationalPhone = require('react-international-phone');
8
- var context = require('./context.js');
9
-
10
- const PhoneInputRoot = ({
11
- children,
12
- className,
13
- onChange,
14
- ...rest
15
- }) => {
16
- const [triggerWidth, setTriggerWidth] = React.useState();
17
- const [isOpen, setIsOpen] = React.useState(false);
18
- const {
19
- country,
20
- handlePhoneValueChange,
21
- inputRef,
22
- inputValue,
23
- phone,
24
- setCountry
25
- } = reactInternationalPhone.usePhoneInput({
26
- countries: reactInternationalPhone.defaultCountries,
27
- onChange: ({ phone: phone2, ...rest2 }) => {
28
- onChange?.(phone2, { ...rest2 });
29
- },
30
- ...rest
31
- });
32
- return /* @__PURE__ */ jsxRuntime.jsx(
33
- index.Popover.Root,
34
- {
35
- placement: "bottom-start",
36
- controlled: true,
37
- isOpen,
38
- setIsOpen,
39
- children: /* @__PURE__ */ jsxRuntime.jsx(
40
- context.PhoneInputContext.Provider,
41
- {
42
- value: {
43
- triggerWidth,
44
- setTriggerWidth,
45
- isOpen,
46
- setIsOpen,
47
- country,
48
- setCountry,
49
- handlePhoneValueChange,
50
- inputValue,
51
- phone,
52
- inputRef
53
- },
54
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx("relative w-full h-full", className), children })
55
- }
56
- )
57
- }
58
- );
59
- };
60
-
61
- exports.PhoneInputRoot = PhoneInputRoot;
@@ -1,117 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var io5 = require('react-icons/io5');
5
- require('clsx');
6
- var React = require('react');
7
- require('../Accordion/context.js');
8
- require('react-icons/lia');
9
- require('@internationalized/date');
10
- require('../Badge.js');
11
- require('react-icons/md');
12
- require('@tecsinapse/cortex-core');
13
- require('react-aria');
14
- require('react-stately');
15
- require('../../provider/MenubarContext.js');
16
- require('../../provider/SnackbarProvider.js');
17
- require('../../provider/CalendarProvider.js');
18
- require('../../provider/ManagerContext.js');
19
- require('../Popover/Context.js');
20
- require('react-dropzone');
21
- require('uuid');
22
- require('@floating-ui/react');
23
- require('currency.js');
24
- require('../Calendar/CalendarCell.js');
25
- require('react-icons/fa');
26
- require('react-icons/io');
27
- require('embla-carousel-react');
28
- require('embla-carousel-autoplay');
29
- require('../ColorPicker.js');
30
- require('../DatePicker/DateSegment.js');
31
- var index = require('../Popover/index.js');
32
- require('../DatePicker/DatePickerInputBase.js');
33
- require('../GroupButton.js');
34
- var index$1 = require('../Input/index.js');
35
- require('../Menubar/Left.js');
36
- require('../../styles/menubar.js');
37
- require('../Menubar/Right.js');
38
- require('../Menubar/Dropdown.js');
39
- require('../Menubar/MostUsed.js');
40
- require('../Menubar/MostUsedItem.js');
41
- require('../Menubar/Header.js');
42
- require('../Menubar/Item.js');
43
- require('../../provider/CategoriesContext.js');
44
- require('../Menubar/SubItem.js');
45
- require('../ProgressBar/Progress.js');
46
- require('../RadioButton.js');
47
- require('../Select/GroupedOptions.js');
48
- require('../Select/context.js');
49
- require('../Select/MultiGroupedOptions.js');
50
- require('../Select/MultiOptions.js');
51
- require('../Select/Options.js');
52
- require('../Select/Trigger.js');
53
- require('../../styles/stepNodeVariants.js');
54
- require('../TextArea/Box.js');
55
- require('../TextArea/Face.js');
56
- require('../TextArea/Left.js');
57
- require('../TextArea/Right.js');
58
- require('../TextArea/Root.js');
59
- require('../TimePicker/TimeFieldInput.js');
60
- require('../Tooltip.js');
61
- require('react-icons/hi2');
62
- require('react-icons/fa6');
63
- require('react-dom');
64
- require('./Options.js');
65
- var context = require('./context.js');
66
- require('react-international-phone');
67
-
68
- const PhoneInputTrigger = ({
69
- disabled = false,
70
- label,
71
- ...rest
72
- }) => {
73
- const {
74
- setIsOpen,
75
- setTriggerWidth,
76
- country,
77
- handlePhoneValueChange,
78
- inputValue
79
- } = context.usePhoneContext();
80
- const triggerRef = React.useRef(null);
81
- React.useEffect(() => {
82
- if (triggerRef.current && setTriggerWidth) {
83
- const width = triggerRef.current.getBoundingClientRect().width;
84
- setTriggerWidth(width);
85
- }
86
- }, [triggerRef.current, setTriggerWidth]);
87
- return /* @__PURE__ */ jsxRuntime.jsx(index.Popover.Trigger, { disabled, children: /* @__PURE__ */ jsxRuntime.jsxs(index$1.Input.Face, { ref: triggerRef, children: [
88
- /* @__PURE__ */ jsxRuntime.jsx(
89
- index$1.Input.Box,
90
- {
91
- value: inputValue,
92
- onChange: handlePhoneValueChange,
93
- label: label ?? "Insert a phone number",
94
- ...rest
95
- }
96
- ),
97
- /* @__PURE__ */ jsxRuntime.jsx(index$1.Input.Right, { children: /* @__PURE__ */ jsxRuntime.jsxs(
98
- "div",
99
- {
100
- className: "flex items-center gap-1 cursor-pointer w-full",
101
- onClick: () => setIsOpen?.(true),
102
- children: [
103
- country ? /* @__PURE__ */ jsxRuntime.jsx(
104
- "img",
105
- {
106
- src: `https://purecatamphetamine.github.io/country-flag-icons/3x2/${country?.iso2.toUpperCase()}.svg`,
107
- className: "w-[25px]"
108
- }
109
- ) : null,
110
- /* @__PURE__ */ jsxRuntime.jsx(io5.IoChevronDown, { className: "h-full text-md" })
111
- ]
112
- }
113
- ) })
114
- ] }) });
115
- };
116
-
117
- exports.PhoneInputTrigger = PhoneInputTrigger;
@@ -1,19 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
-
5
- const PhoneInputContext = React.createContext(
6
- null
7
- );
8
- const usePhoneContext = () => {
9
- const context = React.useContext(PhoneInputContext);
10
- if (!context) {
11
- throw new Error(
12
- "usePhoneInputContext must be used within a usePhoneInputProvider"
13
- );
14
- }
15
- return context;
16
- };
17
-
18
- exports.PhoneInputContext = PhoneInputContext;
19
- exports.usePhoneContext = usePhoneContext;
@@ -1,17 +0,0 @@
1
- 'use strict';
2
-
3
- var Option = require('./Option.js');
4
- var Options = require('./Options.js');
5
- var Popover = require('./Popover.js');
6
- var Root = require('./Root.js');
7
- var Trigger = require('./Trigger.js');
8
-
9
- const PhoneInput = {
10
- Root: Root.PhoneInputRoot,
11
- Popover: Popover.PhoneInputPopover,
12
- Trigger: Trigger.PhoneInputTrigger,
13
- Option: Option.PhoneInputOption,
14
- Options: Options.PhoneInputOptions
15
- };
16
-
17
- exports.PhoneInput = PhoneInput;
@@ -1,27 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
-
3
- const PhoneInputOption = ({
4
- country,
5
- handleSelectCountry,
6
- disableClick = false
7
- }) => {
8
- return /* @__PURE__ */ jsxs(
9
- "button",
10
- {
11
- className: "flex w-full h-[2rem] items-center justify-between p-centi cursor-pointer hover:bg-gray-100",
12
- onClick: () => {
13
- handleSelectCountry(country);
14
- },
15
- disabled: disableClick,
16
- children: [
17
- /* @__PURE__ */ jsx("span", { children: country?.name }),
18
- /* @__PURE__ */ jsxs("span", { className: "text-gray-400 text-sm", children: [
19
- "+",
20
- country?.dialCode
21
- ] })
22
- ]
23
- }
24
- );
25
- };
26
-
27
- export { PhoneInputOption };
@@ -1,115 +0,0 @@
1
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
- import { useState, useMemo } from 'react';
3
- import { Divider } from '../Divider.js';
4
- import { usePhoneContext } from './context.js';
5
- import { PhoneInputOption } from './Option.js';
6
- import 'clsx';
7
- import '../Accordion/context.js';
8
- import 'react-icons/lia';
9
- import '@internationalized/date';
10
- import '../Badge.js';
11
- import 'react-icons/md';
12
- import '@tecsinapse/cortex-core';
13
- import 'react-aria';
14
- import 'react-stately';
15
- import '../../provider/MenubarContext.js';
16
- import '../../provider/SnackbarProvider.js';
17
- import '../../provider/CalendarProvider.js';
18
- import '../../provider/ManagerContext.js';
19
- import '../Popover/Context.js';
20
- import 'react-dropzone';
21
- import 'uuid';
22
- import '@floating-ui/react';
23
- import 'currency.js';
24
- import '../Calendar/CalendarCell.js';
25
- import 'react-icons/fa';
26
- import 'react-icons/io';
27
- import 'embla-carousel-react';
28
- import 'embla-carousel-autoplay';
29
- import '../ColorPicker.js';
30
- import '../DatePicker/DateSegment.js';
31
- import '../DatePicker/DatePickerInputBase.js';
32
- import '../GroupButton.js';
33
- import { Input } from '../Input/index.js';
34
- import '../Menubar/Left.js';
35
- import '../../styles/menubar.js';
36
- import '../Menubar/Right.js';
37
- import '../Menubar/Dropdown.js';
38
- import '../Menubar/MostUsed.js';
39
- import '../Menubar/MostUsedItem.js';
40
- import '../Menubar/Header.js';
41
- import '../Menubar/Item.js';
42
- import '../../provider/CategoriesContext.js';
43
- import '../Menubar/SubItem.js';
44
- import '../ProgressBar/Progress.js';
45
- import '../RadioButton.js';
46
- import '../Select/GroupedOptions.js';
47
- import '../Select/context.js';
48
- import '../Select/MultiGroupedOptions.js';
49
- import '../Select/MultiOptions.js';
50
- import '../Select/Options.js';
51
- import '../Select/Trigger.js';
52
- import '../../styles/stepNodeVariants.js';
53
- import '../TextArea/Box.js';
54
- import '../TextArea/Face.js';
55
- import '../TextArea/Left.js';
56
- import '../TextArea/Right.js';
57
- import '../TextArea/Root.js';
58
- import '../TimePicker/TimeFieldInput.js';
59
- import '../Tooltip.js';
60
- import 'react-icons/hi2';
61
- import 'react-icons/fa6';
62
- import 'react-dom';
63
- import 'react-icons/io5';
64
- import { defaultCountries, parseCountry } from 'react-international-phone';
65
-
66
- const countries = defaultCountries.map((c) => {
67
- return parseCountry(c);
68
- });
69
- const PhoneInputOptions = ({
70
- hasSearch = true
71
- }) => {
72
- const { country, setCountry, setIsOpen } = usePhoneContext();
73
- const [searchText, setSearchText] = useState("");
74
- const filteredCountries = useMemo(() => {
75
- return countries.filter(
76
- (c) => c.iso2 !== country?.iso2 && (c.name.toLowerCase().includes(searchText.toLowerCase()) || c.dialCode.includes(searchText))
77
- );
78
- }, [country, searchText]);
79
- const handleSelect = (country2) => {
80
- setCountry?.(country2.iso2);
81
- setIsOpen?.(false);
82
- };
83
- return /* @__PURE__ */ jsxs("div", { className: "w-full h-full flex flex-col overflow-y-auto", children: [
84
- hasSearch ? /* @__PURE__ */ jsx(
85
- Input.Search,
86
- {
87
- onChange: (e) => setSearchText(e.target.value),
88
- variants: { className: "mx-deca my-centi outline-none" }
89
- }
90
- ) : null,
91
- country ? /* @__PURE__ */ jsxs(Fragment, { children: [
92
- /* @__PURE__ */ jsx(
93
- PhoneInputOption,
94
- {
95
- country,
96
- handleSelectCountry: handleSelect,
97
- disableClick: true
98
- }
99
- ),
100
- /* @__PURE__ */ jsx(Divider, {})
101
- ] }) : null,
102
- filteredCountries.map((country2) => {
103
- return /* @__PURE__ */ jsx(
104
- PhoneInputOption,
105
- {
106
- country: country2,
107
- handleSelectCountry: handleSelect
108
- },
109
- `${country2.dialCode} ${country2.iso2}`
110
- );
111
- })
112
- ] });
113
- };
114
-
115
- export { PhoneInputOptions };
@@ -1,21 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import { FloatingPortal } from '@floating-ui/react';
3
- import { Popover } from '../Popover/index.js';
4
- import { usePhoneContext } from './context.js';
5
-
6
- const PhoneInputPopover = ({ children }) => {
7
- const { triggerWidth } = usePhoneContext();
8
- return /* @__PURE__ */ jsx(FloatingPortal, { children: /* @__PURE__ */ jsx(
9
- Popover.Content,
10
- {
11
- className: "bg-white shadow-md rounded-md overflow-hidden h-full max-h-[30vh] outline-none",
12
- style: {
13
- zIndex: 9999,
14
- width: triggerWidth ? `${triggerWidth}px` : "auto"
15
- },
16
- children
17
- }
18
- ) });
19
- };
20
-
21
- export { PhoneInputPopover };
@@ -1,59 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import { useState } from 'react';
3
- import { Popover } from '../Popover/index.js';
4
- import clsx from 'clsx';
5
- import { usePhoneInput, defaultCountries } from 'react-international-phone';
6
- import { PhoneInputContext } from './context.js';
7
-
8
- const PhoneInputRoot = ({
9
- children,
10
- className,
11
- onChange,
12
- ...rest
13
- }) => {
14
- const [triggerWidth, setTriggerWidth] = useState();
15
- const [isOpen, setIsOpen] = useState(false);
16
- const {
17
- country,
18
- handlePhoneValueChange,
19
- inputRef,
20
- inputValue,
21
- phone,
22
- setCountry
23
- } = usePhoneInput({
24
- countries: defaultCountries,
25
- onChange: ({ phone: phone2, ...rest2 }) => {
26
- onChange?.(phone2, { ...rest2 });
27
- },
28
- ...rest
29
- });
30
- return /* @__PURE__ */ jsx(
31
- Popover.Root,
32
- {
33
- placement: "bottom-start",
34
- controlled: true,
35
- isOpen,
36
- setIsOpen,
37
- children: /* @__PURE__ */ jsx(
38
- PhoneInputContext.Provider,
39
- {
40
- value: {
41
- triggerWidth,
42
- setTriggerWidth,
43
- isOpen,
44
- setIsOpen,
45
- country,
46
- setCountry,
47
- handlePhoneValueChange,
48
- inputValue,
49
- phone,
50
- inputRef
51
- },
52
- children: /* @__PURE__ */ jsx("div", { className: clsx("relative w-full h-full", className), children })
53
- }
54
- )
55
- }
56
- );
57
- };
58
-
59
- export { PhoneInputRoot };
@@ -1,115 +0,0 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
2
- import { IoChevronDown } from 'react-icons/io5';
3
- import 'clsx';
4
- import { useRef, useEffect } from 'react';
5
- import '../Accordion/context.js';
6
- import 'react-icons/lia';
7
- import '@internationalized/date';
8
- import '../Badge.js';
9
- import 'react-icons/md';
10
- import '@tecsinapse/cortex-core';
11
- import 'react-aria';
12
- import 'react-stately';
13
- import '../../provider/MenubarContext.js';
14
- import '../../provider/SnackbarProvider.js';
15
- import '../../provider/CalendarProvider.js';
16
- import '../../provider/ManagerContext.js';
17
- import '../Popover/Context.js';
18
- import 'react-dropzone';
19
- import 'uuid';
20
- import '@floating-ui/react';
21
- import 'currency.js';
22
- import '../Calendar/CalendarCell.js';
23
- import 'react-icons/fa';
24
- import 'react-icons/io';
25
- import 'embla-carousel-react';
26
- import 'embla-carousel-autoplay';
27
- import '../ColorPicker.js';
28
- import '../DatePicker/DateSegment.js';
29
- import { Popover } from '../Popover/index.js';
30
- import '../DatePicker/DatePickerInputBase.js';
31
- import '../GroupButton.js';
32
- import { Input } from '../Input/index.js';
33
- import '../Menubar/Left.js';
34
- import '../../styles/menubar.js';
35
- import '../Menubar/Right.js';
36
- import '../Menubar/Dropdown.js';
37
- import '../Menubar/MostUsed.js';
38
- import '../Menubar/MostUsedItem.js';
39
- import '../Menubar/Header.js';
40
- import '../Menubar/Item.js';
41
- import '../../provider/CategoriesContext.js';
42
- import '../Menubar/SubItem.js';
43
- import '../ProgressBar/Progress.js';
44
- import '../RadioButton.js';
45
- import '../Select/GroupedOptions.js';
46
- import '../Select/context.js';
47
- import '../Select/MultiGroupedOptions.js';
48
- import '../Select/MultiOptions.js';
49
- import '../Select/Options.js';
50
- import '../Select/Trigger.js';
51
- import '../../styles/stepNodeVariants.js';
52
- import '../TextArea/Box.js';
53
- import '../TextArea/Face.js';
54
- import '../TextArea/Left.js';
55
- import '../TextArea/Right.js';
56
- import '../TextArea/Root.js';
57
- import '../TimePicker/TimeFieldInput.js';
58
- import '../Tooltip.js';
59
- import 'react-icons/hi2';
60
- import 'react-icons/fa6';
61
- import 'react-dom';
62
- import './Options.js';
63
- import { usePhoneContext } from './context.js';
64
- import 'react-international-phone';
65
-
66
- const PhoneInputTrigger = ({
67
- disabled = false,
68
- label,
69
- ...rest
70
- }) => {
71
- const {
72
- setIsOpen,
73
- setTriggerWidth,
74
- country,
75
- handlePhoneValueChange,
76
- inputValue
77
- } = usePhoneContext();
78
- const triggerRef = useRef(null);
79
- useEffect(() => {
80
- if (triggerRef.current && setTriggerWidth) {
81
- const width = triggerRef.current.getBoundingClientRect().width;
82
- setTriggerWidth(width);
83
- }
84
- }, [triggerRef.current, setTriggerWidth]);
85
- return /* @__PURE__ */ jsx(Popover.Trigger, { disabled, children: /* @__PURE__ */ jsxs(Input.Face, { ref: triggerRef, children: [
86
- /* @__PURE__ */ jsx(
87
- Input.Box,
88
- {
89
- value: inputValue,
90
- onChange: handlePhoneValueChange,
91
- label: label ?? "Insert a phone number",
92
- ...rest
93
- }
94
- ),
95
- /* @__PURE__ */ jsx(Input.Right, { children: /* @__PURE__ */ jsxs(
96
- "div",
97
- {
98
- className: "flex items-center gap-1 cursor-pointer w-full",
99
- onClick: () => setIsOpen?.(true),
100
- children: [
101
- country ? /* @__PURE__ */ jsx(
102
- "img",
103
- {
104
- src: `https://purecatamphetamine.github.io/country-flag-icons/3x2/${country?.iso2.toUpperCase()}.svg`,
105
- className: "w-[25px]"
106
- }
107
- ) : null,
108
- /* @__PURE__ */ jsx(IoChevronDown, { className: "h-full text-md" })
109
- ]
110
- }
111
- ) })
112
- ] }) });
113
- };
114
-
115
- export { PhoneInputTrigger };
@@ -1,16 +0,0 @@
1
- import { createContext, useContext } from 'react';
2
-
3
- const PhoneInputContext = createContext(
4
- null
5
- );
6
- const usePhoneContext = () => {
7
- const context = useContext(PhoneInputContext);
8
- if (!context) {
9
- throw new Error(
10
- "usePhoneInputContext must be used within a usePhoneInputProvider"
11
- );
12
- }
13
- return context;
14
- };
15
-
16
- export { PhoneInputContext, usePhoneContext };
@@ -1,15 +0,0 @@
1
- import { PhoneInputOption } from './Option.js';
2
- import { PhoneInputOptions } from './Options.js';
3
- import { PhoneInputPopover } from './Popover.js';
4
- import { PhoneInputRoot } from './Root.js';
5
- import { PhoneInputTrigger } from './Trigger.js';
6
-
7
- const PhoneInput = {
8
- Root: PhoneInputRoot,
9
- Popover: PhoneInputPopover,
10
- Trigger: PhoneInputTrigger,
11
- Option: PhoneInputOption,
12
- Options: PhoneInputOptions
13
- };
14
-
15
- export { PhoneInput };
@@ -1,6 +0,0 @@
1
- import { ParsedCountry } from 'react-international-phone';
2
- export declare const PhoneInputOption: ({ country, handleSelectCountry, disableClick, }: {
3
- country: ParsedCountry;
4
- handleSelectCountry: (country: ParsedCountry) => void;
5
- disableClick?: boolean;
6
- }) => import("react/jsx-runtime").JSX.Element;
@@ -1,3 +0,0 @@
1
- export declare const PhoneInputOptions: ({ hasSearch, }: {
2
- hasSearch?: boolean;
3
- }) => import("react/jsx-runtime").JSX.Element;
@@ -1,4 +0,0 @@
1
- import { ReactNode } from 'react';
2
- export declare const PhoneInputPopover: ({ children }: {
3
- children: ReactNode;
4
- }) => import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { PhoneInputRootProps } from './types';
2
- export declare const PhoneInputRoot: ({ children, className, onChange, ...rest }: PhoneInputRootProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { PhoneInputTriggerProps } from './types';
2
- export declare const PhoneInputTrigger: ({ disabled, label, ...rest }: PhoneInputTriggerProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,15 +0,0 @@
1
- import { usePhoneInput } from 'react-international-phone';
2
- export interface Country {
3
- country: string;
4
- iso: string;
5
- code: string;
6
- }
7
- interface PhoneInputContextProps extends ReturnType<typeof usePhoneInput> {
8
- isOpen: boolean;
9
- setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
10
- triggerWidth?: number;
11
- setTriggerWidth?: React.Dispatch<React.SetStateAction<number | undefined>>;
12
- }
13
- export declare const PhoneInputContext: import("react").Context<PhoneInputContextProps | null>;
14
- export declare const usePhoneContext: () => PhoneInputContextProps;
15
- export {};
@@ -1,16 +0,0 @@
1
- export declare const PhoneInput: {
2
- Root: ({ children, className, onChange, ...rest }: import("./types").PhoneInputRootProps) => import("react/jsx-runtime").JSX.Element;
3
- Popover: ({ children }: {
4
- children: import("react").ReactNode;
5
- }) => import("react/jsx-runtime").JSX.Element;
6
- Trigger: ({ disabled, label, ...rest }: import("./types").PhoneInputTriggerProps) => import("react/jsx-runtime").JSX.Element;
7
- Option: ({ country, handleSelectCountry, disableClick, }: {
8
- country: import("react-international-phone").ParsedCountry;
9
- handleSelectCountry: (country: import("react-international-phone").ParsedCountry) => void;
10
- disableClick?: boolean;
11
- }) => import("react/jsx-runtime").JSX.Element;
12
- Options: ({ hasSearch, }: {
13
- hasSearch?: boolean;
14
- }) => import("react/jsx-runtime").JSX.Element;
15
- };
16
- export * from './types';
@@ -1,13 +0,0 @@
1
- import { ParsedCountry, UsePhoneInputConfig } from 'react-international-phone';
2
- import { InputPropsBase } from '../Input';
3
- import { ReactNode } from 'react';
4
- export interface PhoneInputTriggerProps extends React.InputHTMLAttributes<HTMLInputElement>, InputPropsBase {
5
- }
6
- export interface PhoneInputRootProps extends Omit<UsePhoneInputConfig, 'onChange'> {
7
- children: ReactNode;
8
- className?: string;
9
- onChange?: (value: string, rest: {
10
- inputValue: string;
11
- country: ParsedCountry;
12
- }) => void;
13
- }