dynamic-modal 1.0.1 → 1.0.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 (69) hide show
  1. package/README-ES.md +45 -3
  2. package/README.md +45 -3
  3. package/dist/components/input-upload/input-upload.d.ts +4 -0
  4. package/dist/components/input-upload/input-upload.js +84 -0
  5. package/dist/components/make-autocomplete/make-autocomplete.d.ts +4 -0
  6. package/dist/components/make-autocomplete/make-autocomplete.js +63 -0
  7. package/dist/components/make-button/make-button.d.ts +4 -0
  8. package/dist/components/make-button/make-button.js +22 -0
  9. package/dist/components/make-input/make-input.d.ts +4 -0
  10. package/dist/components/make-input/make-input.js +63 -0
  11. package/dist/components/make-multi-select/make-multi-select.d.ts +4 -0
  12. package/dist/components/make-multi-select/make-multi-select.js +63 -0
  13. package/dist/components/make-select/make-select.d.ts +4 -0
  14. package/dist/components/make-select/make-select.js +63 -0
  15. package/dist/components/make-text/make-text.d.ts +4 -0
  16. package/dist/components/make-text/make-text.js +11 -0
  17. package/dist/components/make-textarea/make-textarea.d.ts +4 -0
  18. package/dist/components/make-textarea/make-textarea.js +63 -0
  19. package/dist/components/make-title/make-title.d.ts +4 -0
  20. package/dist/components/make-title/make-title.js +10 -0
  21. package/dist/components/make-toggle/make-toggle.d.ts +4 -0
  22. package/dist/components/make-toggle/make-toggle.js +51 -0
  23. package/dist/components/make-upload/make-upload.d.ts +4 -0
  24. package/dist/components/make-upload/make-upload.js +26 -0
  25. package/dist/components/portal/portal.d.ts +3 -0
  26. package/dist/components/portal/portal.js +55 -0
  27. package/dist/hooks/field-render.d.ts +19 -0
  28. package/dist/hooks/field-render.js +83 -0
  29. package/dist/hooks/modal-handler.d.ts +7 -0
  30. package/dist/hooks/modal-handler.js +28 -0
  31. package/dist/interfaces/field.d.ts +27 -0
  32. package/dist/interfaces/field.js +2 -0
  33. package/dist/interfaces/input-upload.d.ts +32 -0
  34. package/dist/interfaces/input-upload.js +2 -0
  35. package/dist/interfaces/make-autocomplete.d.ts +13 -0
  36. package/dist/interfaces/make-autocomplete.js +2 -0
  37. package/dist/interfaces/make-button.d.ts +18 -0
  38. package/dist/interfaces/make-button.js +2 -0
  39. package/dist/interfaces/make-field-group.d.ts +11 -0
  40. package/dist/interfaces/make-field-group.js +2 -0
  41. package/dist/interfaces/make-field.d.ts +12 -0
  42. package/dist/interfaces/make-field.js +2 -0
  43. package/dist/interfaces/make-multi-select.d.ts +12 -0
  44. package/dist/interfaces/make-multi-select.js +2 -0
  45. package/dist/interfaces/make-select.d.ts +12 -0
  46. package/dist/interfaces/make-select.js +2 -0
  47. package/dist/interfaces/make-text.d.ts +10 -0
  48. package/dist/interfaces/make-text.js +2 -0
  49. package/dist/interfaces/make-textarea.d.ts +9 -0
  50. package/dist/interfaces/make-textarea.js +2 -0
  51. package/dist/interfaces/make-title.d.ts +3 -0
  52. package/dist/interfaces/make-title.js +2 -0
  53. package/dist/interfaces/make-toggle.d.ts +7 -0
  54. package/dist/interfaces/make-toggle.js +2 -0
  55. package/dist/interfaces/make-upload.d.ts +11 -0
  56. package/dist/interfaces/make-upload.js +2 -0
  57. package/dist/interfaces/modal.d.ts +43 -0
  58. package/dist/interfaces/modal.js +2 -0
  59. package/dist/interfaces/option.d.ts +4 -0
  60. package/dist/interfaces/option.js +2 -0
  61. package/dist/interfaces/portal.d.ts +7 -0
  62. package/dist/interfaces/portal.js +2 -0
  63. package/dist/modal.d.ts +4 -0
  64. package/dist/modal.js +150 -0
  65. package/dist/tools/general.d.ts +1 -0
  66. package/dist/tools/general.js +10 -0
  67. package/index.ts +1 -1
  68. package/package.json +2 -2
  69. package/src/components/make-autocomplete/make-autocomplete.tsx +2 -2
package/README-ES.md CHANGED
@@ -22,12 +22,12 @@ npm install dynamic-modal
22
22
  ```
23
23
 
24
24
  ## Configuración para Next.js 14
25
- En el layout principal de tu aplicación Next.js, debes envolver tu aplicación con el componente `NextUIProvider` para que `dynamic-modal` funcione adecuadamente. Aquí un ejemplo:
25
+ En el provider principal de tu aplicación Next.js, debes envolver tu aplicación con el componente `NextUIProvider` para que `dynamic-modal` funcione adecuadamente. Aquí un ejemplo:
26
26
 
27
27
  ```jsx
28
28
  import { NextUIProvider } from '@nextui-org/react';
29
29
 
30
- function MyApp({ Component, pageProps }) {
30
+ function Provider({ children }: Readonly<{ children: ReactNode }>) {
31
31
  return (
32
32
  <NextUIProvider>
33
33
  <Component {...pageProps} />
@@ -35,8 +35,50 @@ function MyApp({ Component, pageProps }) {
35
35
  );
36
36
  }
37
37
 
38
- export default MyApp;
38
+ export default Provider;
39
39
 
40
+ ```
41
+ En el layout principal crea el `portal` para el modal (este componente utiliza react portal)
42
+
43
+ ```jsx
44
+ //imports...
45
+
46
+ export default function RootLayout ({
47
+ children
48
+ }: Readonly<{
49
+ children: ReactNode;
50
+ }>) {
51
+ return (
52
+ <html lang="en">
53
+ <body className={inter.className}>
54
+ <Provider>
55
+ {children}
56
+ </Provider>
57
+ <div id='modal-portal'/>
58
+ </body>
59
+ </html>
60
+ )
61
+ }
62
+ ```
63
+
64
+ ## Setup for Next.js 13
65
+ Edita el archivo llamado `_document.tsx` y crea el `portal` para el modal (este componente utiliza react portal)
66
+
67
+ ```jsx
68
+ import { Html, Head, Main, NextScript } from 'next/document'
69
+
70
+ export default function Document () {
71
+ return (
72
+ <Html>
73
+ <Head />
74
+ <body>
75
+ <Main />
76
+ <div id='modal-portal'/>
77
+ <NextScript />
78
+ </body>
79
+ </Html>
80
+ )
81
+ }
40
82
  ```
41
83
 
42
84
  ## Uso
package/README.md CHANGED
@@ -22,12 +22,12 @@ npm install dynamic-modal
22
22
  ```
23
23
 
24
24
  ## Setup for Next.js 14
25
- In the main layout of your Next.js application, wrap your app with the `NextUIProvider` component to ensure `dynamic-modal` functions properly. Here’s an example:
25
+ In the main provider of your Next.js application, wrap your app with the `NextUIProvider` component to ensure `dynamic-modal` functions properly. Here’s an example:
26
26
 
27
27
  ```jsx
28
28
  import { NextUIProvider } from '@nextui-org/react';
29
29
 
30
- function MyApp({ Component, pageProps }) {
30
+ function Provider({ children }: Readonly<{ children: ReactNode }>) {
31
31
  return (
32
32
  <NextUIProvider>
33
33
  <Component {...pageProps} />
@@ -35,8 +35,50 @@ function MyApp({ Component, pageProps }) {
35
35
  );
36
36
  }
37
37
 
38
- export default MyApp;
38
+ export default Provider;
39
39
 
40
+ ```
41
+ In the root layout define `portal` for modal (this component use react portal)
42
+
43
+ ```jsx
44
+ //imports...
45
+
46
+ export default function RootLayout ({
47
+ children
48
+ }: Readonly<{
49
+ children: ReactNode;
50
+ }>) {
51
+ return (
52
+ <html lang="en">
53
+ <body className={inter.className}>
54
+ <Provider>
55
+ {children}
56
+ </Provider>
57
+ <div id='modal-portal'/>
58
+ </body>
59
+ </html>
60
+ )
61
+ }
62
+ ```
63
+
64
+ ## Setup for Next.js 13
65
+ Edit file named `_document.tsx` and define `portal` for modal (this component use react portal)
66
+
67
+ ```jsx
68
+ import { Html, Head, Main, NextScript } from 'next/document'
69
+
70
+ export default function Document () {
71
+ return (
72
+ <Html>
73
+ <Head />
74
+ <body>
75
+ <Main />
76
+ <div id='modal-portal'/>
77
+ <NextScript />
78
+ </body>
79
+ </Html>
80
+ )
81
+ }
40
82
  ```
41
83
 
42
84
  ## Usage
package/dist/components/input-upload/input-upload.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IInputUpload } from '../../interfaces/input-upload';
3
+ declare const InputUpload: FC<IInputUpload>;
4
+ export default InputUpload;
package/dist/components/input-upload/input-upload.js ADDED
@@ -0,0 +1,84 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __rest = (this && this.__rest) || function (s, e) {
26
+ var t = {};
27
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
28
+ t[p] = s[p];
29
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
30
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
31
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
32
+ t[p[i]] = s[p[i]];
33
+ }
34
+ return t;
35
+ };
36
+ Object.defineProperty(exports, "__esModule", { value: true });
37
+ const react_1 = __importStar(require("react"));
38
+ const general_1 = require("../../tools/general");
39
+ const InputUpload = (_a) => {
40
+ var _b;
41
+ var { onChange } = _a, props = __rest(_a, ["onChange"]);
42
+ const onChangeHandler = (event) => {
43
+ if (props.read && event.target.files) {
44
+ readFileBlob(event.target.files[0], false)
45
+ .then((result) => onChange(result))
46
+ .catch((err) => {
47
+ console.error('file read error', err);
48
+ onChange({ name: '', size: 0, data: '' });
49
+ });
50
+ }
51
+ else {
52
+ onChange(event.target.files);
53
+ }
54
+ };
55
+ const readFileBlob = (blob, image) => {
56
+ return new Promise((resolve, reject) => {
57
+ const fileReader = new FileReader();
58
+ if (image)
59
+ fileReader.readAsDataURL(blob);
60
+ else
61
+ fileReader.readAsText(blob);
62
+ fileReader.onload = () => {
63
+ const fileResult = {
64
+ name: blob.name,
65
+ size: blob.size,
66
+ data: fileReader.result
67
+ };
68
+ resolve(fileResult);
69
+ };
70
+ fileReader.onerror = (error) => {
71
+ reject(error);
72
+ };
73
+ });
74
+ };
75
+ const elementId = (0, react_1.useMemo)(() => {
76
+ var _a;
77
+ return (_a = props.id) !== null && _a !== void 0 ? _a : (0, general_1.generateId)();
78
+ }, [props.id]);
79
+ return (react_1.default.createElement("div", { className: 'flex flex-col w-full gap-1 text-center' },
80
+ props.label && react_1.default.createElement("label", { className: "block mb-2 text-sm font-medium text-gray-900 dark:text-white", htmlFor: `file-input-${elementId}` }, props.label),
81
+ react_1.default.createElement("input", Object.assign({ className: "file:transition-all file:delay-150 block w-full text-sm text-slate-500\r\n file:mr-4 file:py-2 file:px-4 file:rounded-md\r\n file:border-0 file:text-sm file:font-semibold\r\n file:bg-gray-100 file:text-blue-600\r\n hover:file:bg-blue-700 hover:file:text-white cursor-pointer disabled:cursor-not-allowed", "aria-describedby": `file-input-${elementId}-help`, id: `file-input-${elementId}`, type: "file", onChange: onChangeHandler }, props)),
82
+ react_1.default.createElement("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-300 text-start", id: `file-input-${elementId}-help` }, (_b = props.helpText) === null || _b === void 0 ? void 0 : _b.toUpperCase())));
83
+ };
84
+ exports.default = InputUpload;
package/dist/components/make-autocomplete/make-autocomplete.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeAutoCompleteProps } from '../../interfaces/make-autocomplete';
3
+ declare const MakeAutocomplete: FC<IMakeAutoCompleteProps>;
4
+ export default MakeAutocomplete;
package/dist/components/make-autocomplete/make-autocomplete.js ADDED
@@ -0,0 +1,63 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __rest = (this && this.__rest) || function (s, e) {
26
+ var t = {};
27
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
28
+ t[p] = s[p];
29
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
30
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
31
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
32
+ t[p[i]] = s[p[i]];
33
+ }
34
+ return t;
35
+ };
36
+ Object.defineProperty(exports, "__esModule", { value: true });
37
+ const react_1 = __importStar(require("react"));
38
+ const react_hook_form_1 = require("react-hook-form");
39
+ const field_render_1 = require("../../hooks/field-render");
40
+ const general_1 = require("../../tools/general");
41
+ const react_2 = require("@nextui-org/react");
42
+ const MakeAutocomplete = (_a) => {
43
+ var _b, _c;
44
+ var { element } = _a, props = __rest(_a, ["element"]);
45
+ const { render, enable, checkField, liveData, liveSearching } = (0, field_render_1.useFieldRender)(Object.assign({ element }, props));
46
+ (0, react_1.useEffect)(() => {
47
+ const subscription = props.watch((value, { name, type }) => checkField(value, { name, type }));
48
+ return () => subscription.unsubscribe();
49
+ }, [checkField, props, props.watch]);
50
+ return (render
51
+ ? react_1.default.createElement(react_hook_form_1.Controller, { control: props.control, name: element.name, rules: {
52
+ required: element.validation.required,
53
+ pattern: {
54
+ value: (_b = element.validation.regex) !== null && _b !== void 0 ? _b : /(.*)/,
55
+ message: (_c = element.validation.message) !== null && _c !== void 0 ? _c : ''
56
+ }
57
+ }, render: ({ field: { onChange, value }, fieldState: { invalid } }) => {
58
+ var _a, _b, _c, _d;
59
+ return (react_1.default.createElement(react_2.Autocomplete, Object.assign({ size: 'sm' }, element, { isDisabled: (_a = element.disabled) !== null && _a !== void 0 ? _a : !enable, id: (_b = element.id) !== null && _b !== void 0 ? _b : (0, general_1.generateId)(), onSelectionChange: onChange, label: liveSearching ? 'Loading...' : element.label, selectedKey: value, errorMessage: invalid ? ((_c = element.validation.message) !== null && _c !== void 0 ? _c : '') : undefined }), (liveData || ((_d = element.options) !== null && _d !== void 0 ? _d : [])).map((opt) => (react_1.default.createElement(react_2.AutocompleteItem, { key: opt.id, value: opt.id }, opt.name)))));
60
+ } })
61
+ : react_1.default.createElement(react_1.default.Fragment, null));
62
+ };
63
+ exports.default = MakeAutocomplete;
package/dist/components/make-button/make-button.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeButtonProps } from '../../interfaces/make-button';
3
+ declare const MakeButton: FC<IMakeButtonProps>;
4
+ export default MakeButton;
package/dist/components/make-button/make-button.js ADDED
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+ var __rest = (this && this.__rest) || function (s, e) {
3
+ var t = {};
4
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
+ t[p] = s[p];
6
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
+ t[p[i]] = s[p[i]];
10
+ }
11
+ return t;
12
+ };
13
+ var __importDefault = (this && this.__importDefault) || function (mod) {
14
+ return (mod && mod.__esModule) ? mod : { "default": mod };
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ const react_1 = __importDefault(require("react"));
18
+ const MakeButton = (_a) => {
19
+ var _b = _a.element, { text } = _b, element = __rest(_b, ["text"]);
20
+ return (react_1.default.createElement("button", Object.assign({ className: 'transition-all delay-100 hover:translate-y-1 bg-blue-500 text-white hover:bg-blue-700 rounded w-11/12 h-[40px] p-2' }, element), text));
21
+ };
22
+ exports.default = MakeButton;
package/dist/components/make-input/make-input.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeInputProps } from '../../interfaces/make-field';
3
+ declare const MakeInput: FC<IMakeInputProps>;
4
+ export default MakeInput;
package/dist/components/make-input/make-input.js ADDED
@@ -0,0 +1,63 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __rest = (this && this.__rest) || function (s, e) {
26
+ var t = {};
27
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
28
+ t[p] = s[p];
29
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
30
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
31
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
32
+ t[p[i]] = s[p[i]];
33
+ }
34
+ return t;
35
+ };
36
+ Object.defineProperty(exports, "__esModule", { value: true });
37
+ const react_1 = __importStar(require("react"));
38
+ const react_hook_form_1 = require("react-hook-form");
39
+ const field_render_1 = require("../../hooks/field-render");
40
+ const react_2 = require("@nextui-org/react");
41
+ const general_1 = require("../../tools/general");
42
+ const MakeInput = (_a) => {
43
+ var _b, _c;
44
+ var { element } = _a, props = __rest(_a, ["element"]);
45
+ const { render, enable, checkField } = (0, field_render_1.useFieldRender)(Object.assign({ element }, props));
46
+ (0, react_1.useEffect)(() => {
47
+ const subscription = props.watch((value, { name, type }) => checkField(value, { name, type }));
48
+ return () => subscription.unsubscribe();
49
+ }, [checkField, props]);
50
+ return (render
51
+ ? react_1.default.createElement(react_hook_form_1.Controller, { control: props.control, name: element.name, rules: {
52
+ required: element.validation.required,
53
+ pattern: {
54
+ value: (_b = element.validation.regex) !== null && _b !== void 0 ? _b : /(.*)/,
55
+ message: (_c = element.validation.message) !== null && _c !== void 0 ? _c : ''
56
+ }
57
+ }, render: ({ field: { onChange, value }, fieldState: { invalid } }) => {
58
+ var _a, _b, _c;
59
+ return (react_1.default.createElement(react_2.Input, Object.assign({ size: 'sm' }, element, { id: (_a = element.id) !== null && _a !== void 0 ? _a : (0, general_1.generateId)(), onChange: onChange, value: value !== null && value !== void 0 ? value : '', errorMessage: invalid ? ((_b = element.validation.message) !== null && _b !== void 0 ? _b : '') : undefined, disabled: (_c = element.disabled) !== null && _c !== void 0 ? _c : !enable })));
60
+ } })
61
+ : null);
62
+ };
63
+ exports.default = MakeInput;
package/dist/components/make-multi-select/make-multi-select.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeMultiSelectProps } from '../../interfaces/make-multi-select';
3
+ declare const MakeMultiSelect: FC<IMakeMultiSelectProps>;
4
+ export default MakeMultiSelect;
package/dist/components/make-multi-select/make-multi-select.js ADDED
@@ -0,0 +1,63 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __rest = (this && this.__rest) || function (s, e) {
26
+ var t = {};
27
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
28
+ t[p] = s[p];
29
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
30
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
31
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
32
+ t[p[i]] = s[p[i]];
33
+ }
34
+ return t;
35
+ };
36
+ Object.defineProperty(exports, "__esModule", { value: true });
37
+ const react_1 = __importStar(require("react"));
38
+ const react_hook_form_1 = require("react-hook-form");
39
+ const field_render_1 = require("../../hooks/field-render");
40
+ const general_1 = require("../../tools/general");
41
+ const react_2 = require("@nextui-org/react");
42
+ const MakeMultiSelect = (_a) => {
43
+ var _b, _c;
44
+ var { element } = _a, props = __rest(_a, ["element"]);
45
+ const { render, enable, checkField, liveData, liveSearching } = (0, field_render_1.useFieldRender)(Object.assign({ element }, props));
46
+ (0, react_1.useEffect)(() => {
47
+ const subscription = props.watch((value, { name, type }) => checkField(value, { name, type }));
48
+ return () => subscription.unsubscribe();
49
+ }, [checkField, props, props.watch]);
50
+ return (render
51
+ ? react_1.default.createElement(react_hook_form_1.Controller, { control: props.control, name: element.name, rules: {
52
+ required: element.validation.required,
53
+ pattern: {
54
+ value: (_b = element.validation.regex) !== null && _b !== void 0 ? _b : /(.*)/,
55
+ message: (_c = element.validation.message) !== null && _c !== void 0 ? _c : ''
56
+ }
57
+ }, render: ({ field: { onChange, value }, fieldState: { invalid } }) => {
58
+ var _a, _b, _c, _d;
59
+ return (react_1.default.createElement(react_2.Select, Object.assign({ size: 'sm' }, element, { id: (_a = element.id) !== null && _a !== void 0 ? _a : (0, general_1.generateId)(), onSelectionChange: onChange, label: liveSearching ? 'Loading...' : element.label, selectionMode: "multiple", selectedKeys: value, errorMessage: invalid ? ((_b = element.validation.message) !== null && _b !== void 0 ? _b : '') : undefined, disabled: (_c = element.disabled) !== null && _c !== void 0 ? _c : !enable, className: 'max-w-lg' }), (liveData || ((_d = element.options) !== null && _d !== void 0 ? _d : [])).map((opt) => (react_1.default.createElement(react_2.SelectItem, { key: opt.id, value: opt.id }, opt.name)))));
60
+ } })
61
+ : null);
62
+ };
63
+ exports.default = MakeMultiSelect;
package/dist/components/make-select/make-select.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeSelectProps } from '../../interfaces/make-select';
3
+ declare const MakeSelect: FC<IMakeSelectProps>;
4
+ export default MakeSelect;
package/dist/components/make-select/make-select.js ADDED
@@ -0,0 +1,63 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __rest = (this && this.__rest) || function (s, e) {
26
+ var t = {};
27
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
28
+ t[p] = s[p];
29
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
30
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
31
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
32
+ t[p[i]] = s[p[i]];
33
+ }
34
+ return t;
35
+ };
36
+ Object.defineProperty(exports, "__esModule", { value: true });
37
+ const react_1 = __importStar(require("react"));
38
+ const react_hook_form_1 = require("react-hook-form");
39
+ const field_render_1 = require("../../hooks/field-render");
40
+ const general_1 = require("../../tools/general");
41
+ const react_2 = require("@nextui-org/react");
42
+ const MakeSelect = (_a) => {
43
+ var _b, _c;
44
+ var { element } = _a, props = __rest(_a, ["element"]);
45
+ const { render, enable, checkField, liveData, liveSearching } = (0, field_render_1.useFieldRender)(Object.assign({ element }, props));
46
+ (0, react_1.useEffect)(() => {
47
+ const subscription = props.watch((value, { name, type }) => checkField(value, { name, type }));
48
+ return () => subscription.unsubscribe();
49
+ }, [checkField, props, props.watch]);
50
+ return (render
51
+ ? react_1.default.createElement(react_hook_form_1.Controller, { control: props.control, name: element.name, rules: {
52
+ required: element.validation.required,
53
+ pattern: {
54
+ value: (_b = element.validation.regex) !== null && _b !== void 0 ? _b : /(.*)/,
55
+ message: (_c = element.validation.message) !== null && _c !== void 0 ? _c : ''
56
+ }
57
+ }, render: ({ field: { onChange, value }, fieldState: { invalid } }) => {
58
+ var _a, _b, _c, _d;
59
+ return (react_1.default.createElement(react_2.Select, Object.assign({ size: 'sm' }, element, { id: (_a = element.id) !== null && _a !== void 0 ? _a : (0, general_1.generateId)(), onChange: onChange, label: liveSearching ? 'Loading...' : element.label, selectedKeys: [value], errorMessage: invalid ? ((_b = element.validation.message) !== null && _b !== void 0 ? _b : '') : undefined, disabled: (_c = element.disabled) !== null && _c !== void 0 ? _c : !enable }), (liveData || ((_d = element.options) !== null && _d !== void 0 ? _d : [])).map((opt) => (react_1.default.createElement(react_2.SelectItem, { key: opt.id, value: opt.id }, opt.name)))));
60
+ } })
61
+ : react_1.default.createElement(react_1.default.Fragment, null));
62
+ };
63
+ exports.default = MakeSelect;
package/dist/components/make-text/make-text.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeTextProps } from '../../interfaces/make-text';
3
+ declare const MakeText: FC<IMakeTextProps>;
4
+ export default MakeText;
package/dist/components/make-text/make-text.js ADDED
@@ -0,0 +1,11 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const react_1 = __importDefault(require("react"));
7
+ const MakeText = ({ element }) => {
8
+ return (react_1.default.createElement("div", { className: 'text-xs text-center' },
9
+ react_1.default.createElement("p", { style: element.styles }, element.text)));
10
+ };
11
+ exports.default = MakeText;
package/dist/components/make-textarea/make-textarea.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeTextareaProps } from '../../interfaces/make-textarea';
3
+ declare const MakeTextarea: FC<IMakeTextareaProps>;
4
+ export default MakeTextarea;
package/dist/components/make-textarea/make-textarea.js ADDED
@@ -0,0 +1,63 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __rest = (this && this.__rest) || function (s, e) {
26
+ var t = {};
27
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
28
+ t[p] = s[p];
29
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
30
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
31
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
32
+ t[p[i]] = s[p[i]];
33
+ }
34
+ return t;
35
+ };
36
+ Object.defineProperty(exports, "__esModule", { value: true });
37
+ const react_1 = __importStar(require("react"));
38
+ const react_hook_form_1 = require("react-hook-form");
39
+ const field_render_1 = require("../../hooks/field-render");
40
+ const general_1 = require("../../tools/general");
41
+ const react_2 = require("@nextui-org/react");
42
+ const MakeTextarea = (_a) => {
43
+ var _b, _c;
44
+ var { element } = _a, props = __rest(_a, ["element"]);
45
+ const { render, enable, checkField } = (0, field_render_1.useFieldRender)(Object.assign(Object.assign({}, props), { element }));
46
+ (0, react_1.useEffect)(() => {
47
+ const subscription = props.watch((value, { name, type }) => checkField(value, { name, type }));
48
+ return () => subscription.unsubscribe();
49
+ }, [checkField, props, props.watch]);
50
+ return (render
51
+ ? react_1.default.createElement(react_hook_form_1.Controller, { name: element.name, control: props.control, rules: {
52
+ required: element.validation.required,
53
+ pattern: {
54
+ value: (_b = element.validation.regex) !== null && _b !== void 0 ? _b : /(.*)/,
55
+ message: (_c = element.validation.message) !== null && _c !== void 0 ? _c : ''
56
+ }
57
+ }, render: ({ field: { onChange, value }, fieldState: { invalid } }) => {
58
+ var _a, _b, _c;
59
+ return (react_1.default.createElement(react_2.Textarea, Object.assign({}, element, { disableAutosize: true, id: (_a = element.id) !== null && _a !== void 0 ? _a : (0, general_1.generateId)(), onChange: onChange, label: element.label, value: value !== null && value !== void 0 ? value : '', errorMessage: invalid ? ((_b = element.validation.message) !== null && _b !== void 0 ? _b : '') : undefined, disabled: (_c = element.disabled) !== null && _c !== void 0 ? _c : !enable })));
60
+ } })
61
+ : null);
62
+ };
63
+ exports.default = MakeTextarea;
package/dist/components/make-title/make-title.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeTitle } from '../../interfaces/make-title';
3
+ declare const MakeTitle: FC<IMakeTitle>;
4
+ export default MakeTitle;
package/dist/components/make-title/make-title.js ADDED
@@ -0,0 +1,10 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const react_1 = __importDefault(require("react"));
7
+ const MakeTitle = ({ title }) => {
8
+ return (react_1.default.createElement("div", { className: 'flex text-center items-center justify-center text-xl' }, title));
9
+ };
10
+ exports.default = MakeTitle;
package/dist/components/make-toggle/make-toggle.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { IMakeToggleProps } from '../../interfaces/make-toggle';
3
+ declare const MakeToggle: FC<IMakeToggleProps>;
4
+ export default MakeToggle;