@gustavo-valsechi/client 1.3.19 → 1.3.21

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.
@@ -1,50 +1,27 @@
1
1
  "use client";
2
2
  "use client";
3
- import {
4
- Avatar,
5
- Badge,
6
- Block,
7
- Button,
8
- Chart,
9
- Component,
10
- CreditCard,
11
- Form,
12
- InputDateTime,
13
- InputFile,
14
- InputLabel,
15
- InputSelect,
16
- InputText,
17
- InputTextarea,
18
- LoadingApp,
19
- LoadingBar,
20
- Logo,
21
- Lottie,
22
- Modal,
23
- Paginate,
24
- Table
25
- } from "../chunk-XH4PSRD2.mjs";
26
- import "../chunk-2X7JQNHX.mjs";
3
+ import { jsx } from "react/jsx-runtime";
4
+ import { Fragment } from "react";
5
+ import { Container, RowContainer } from "./styles";
6
+ import _ from "lodash";
7
+ import * as Types from "./types";
8
+ export * from "./types";
9
+ function Component(props) {
10
+ const renderComponent = (config) => {
11
+ const ComponentElement = Types[config.type];
12
+ return /* @__PURE__ */ jsx(ComponentElement, { ...config.props });
13
+ };
14
+ const renderRow = (components) => {
15
+ return /* @__PURE__ */ jsx(RowContainer, { children: _.map(
16
+ components,
17
+ (data, index) => /* @__PURE__ */ jsx(Fragment, { children: renderComponent(data) }, index)
18
+ ) });
19
+ };
20
+ return /* @__PURE__ */ jsx(Container, { className: props.className, children: _.map(
21
+ props.content,
22
+ (data, index) => /* @__PURE__ */ jsx(Fragment, { children: _.isArray(data) ? renderRow(data) : renderComponent(data) }, index)
23
+ ) });
24
+ }
27
25
  export {
28
- Avatar,
29
- Badge,
30
- Block,
31
- Button,
32
- Chart,
33
- Component,
34
- CreditCard,
35
- Form,
36
- InputDateTime,
37
- InputFile,
38
- InputLabel,
39
- InputSelect,
40
- InputText,
41
- InputTextarea,
42
- LoadingApp,
43
- LoadingBar,
44
- Logo,
45
- Lottie,
46
- Modal,
47
- Paginate,
48
- Table
26
+ Component
49
27
  };
50
- //# sourceMappingURL=index.mjs.map
@@ -1,16 +1,10 @@
1
1
  "use client";
2
2
  "use strict";
3
3
  "use client";
4
- var __create = Object.create;
5
4
  var __defProp = Object.defineProperty;
6
5
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
7
6
  var __getOwnPropNames = Object.getOwnPropertyNames;
8
- var __getProtoOf = Object.getPrototypeOf;
9
7
  var __hasOwnProp = Object.prototype.hasOwnProperty;
10
- var __export = (target, all) => {
11
- for (var name in all)
12
- __defProp(target, name, { get: all[name], enumerable: true });
13
- };
14
8
  var __copyProps = (to, from, except, desc) => {
15
9
  if (from && typeof from === "object" || typeof from === "function") {
16
10
  for (let key of __getOwnPropNames(from))
@@ -19,508 +13,18 @@ var __copyProps = (to, from, except, desc) => {
19
13
  }
20
14
  return to;
21
15
  };
22
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
23
- // If the importer is in node compatibility mode or this is not an ESM
24
- // file that has been converted to a CommonJS file using a Babel-
25
- // compatible transform (i.e. "__esModule" has not been set), then set
26
- // "default" to the CommonJS "module.exports" for node compatibility.
27
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
28
- mod
29
- ));
16
+ var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
30
17
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
31
-
32
- // contexts/index.tsx
33
18
  var contexts_exports = {};
34
- __export(contexts_exports, {
35
- IconProvider: () => IconProviderContainer,
36
- ModalProvider: () => ModalProviderContainer,
37
- ThemeProvider: () => ThemeProviderContainer,
38
- TooltipProvider: () => TooltipProviderContainer,
39
- useIcon: () => useIcon,
40
- useModal: () => useModal,
41
- useTheme: () => useTheme,
42
- useTooltip: () => useTooltip
43
- });
44
19
  module.exports = __toCommonJS(contexts_exports);
45
-
46
- // contexts/icon/index.tsx
47
- var import_react2 = require("react");
48
-
49
- // contexts/theme/index.tsx
50
- var import_react = require("react");
51
- var import_styled_components2 = require("styled-components");
52
-
53
- // contexts/theme/styles.tsx
54
- var import_styled_components = __toESM(require("styled-components"));
55
- var Switcher = import_styled_components.default.div`
56
- width: 3rem;
57
- height: 1.5rem;
58
- border-radius: 1rem;
59
- border: 2px solid ${({ theme }) => theme.t05};
60
- overflow: hidden;
61
- display: flex;
62
- align-items: center;
63
- cursor: pointer;
64
- position: relative;
65
-
66
- i {
67
- color: ${({ theme }) => theme.t6};
68
- position: absolute;
69
- transform: translateY(-50%);
70
- font-size: .9rem;
71
- z-index: 0;
72
- transition: ease .8s;
73
-
74
- &:first-child {
75
- left: .2rem;
76
- top: 50%;
77
- opacity: ${(props) => props["data-theme"] === "light" ? 0 : 1};
78
- }
79
-
80
- &:last-child {
81
- right: .2rem;
82
- top: 50%;
83
- opacity: ${(props) => props["data-theme"] === "light" ? 1 : 0};
84
- }
85
- }
86
-
87
- .switcher {
88
- width: 1rem;
89
- height: 1rem;
90
- border-radius: 1rem;
91
- position: relative;
92
- transition: ease .3s;
93
- transform: ${(props) => props["data-theme"] === "light" ? "transform: translateX(.2rem)" : "translateX(1.6rem)"};
94
- z-index: 1;
95
-
96
- div {
97
- width: 100%;
98
- height: 100%;
99
- background: ${({ theme }) => theme.primary};
100
- border-radius: 1rem;
101
- position: relative;
102
- z-index: 2;
103
- }
104
-
105
- &:after {
106
- content: "";
107
- position: absolute;
108
- width: 100%;
109
- height: 100%;
110
- border-radius: 1rem;
111
- transform: scale(1.8);
112
- background: ${({ theme }) => theme.t05};
113
- top: 0;
114
- left: 0;
115
- z-index: 1;
116
- }
117
-
118
- &:before {
119
- content: "";
120
- position: absolute;
121
- width: 100%;
122
- height: 100%;
123
- border-radius: 1rem;
124
- transform: scale(3);
125
- background: ${({ theme }) => theme.t05};
126
- top: 0;
127
- left: 0;
128
- z-index: 0;
129
- }
130
- }
131
- `;
132
-
133
- // contexts/theme/content.tsx
134
- var CommonTheme = {
135
- secondary: "#5869da",
136
- tertiary: "#629dfd33",
137
- positive: "#65c965",
138
- negative: "#FF334E",
139
- mobileMaxWidth: "650px",
140
- mobileMinWidth: "315px"
141
- };
142
- var Themes = {
143
- light: {
144
- primary: "#ffffff",
145
- reverse: "#353535",
146
- tooltip: "#f2f2f2",
147
- t8: "#000000cc",
148
- t7: "#000000b3",
149
- t6: "#00000099",
150
- t5: "#00000080",
151
- t4: "#00000066",
152
- t3: "#0000004d",
153
- t2: "#00000033",
154
- t1: "#0000001a",
155
- t08: "#00000014",
156
- t05: "#0000000d",
157
- t03: "#00000007",
158
- t02: "#00000005",
159
- t01: "#00000002",
160
- lgrad: `linear-gradient(
161
- to right,
162
- #dadef7 0%,
163
- #dee2f8 5%,
164
- #e2e5f9 10%,
165
- #e6e9fa 20%,
166
- #eaedfb 30%,
167
- #eff0fb 60%,
168
- #f3f4fc 80%,
169
- #f7f8fd 90%,
170
- #fbfbfe 100%
171
- )`,
172
- maingrad: "linear-gradient(330deg, #b9c0ff7a 0%, #ffffff 100%)",
173
- ...CommonTheme
174
- },
175
- dark: {
176
- primary: "#333333",
177
- reverse: "#b45252",
178
- tooltip: "#3d3d3d",
179
- t8: "#ffffffcc",
180
- t7: "#ffffffb3",
181
- t6: "#ffffff99",
182
- t5: "#ffffff80",
183
- t4: "#ffffff66",
184
- t3: "#ffffff4d",
185
- t2: "#ffffff33",
186
- t1: "#ffffff1a",
187
- t08: "#ffffff14",
188
- t05: "#ffffff0d",
189
- t03: "#ffffff07",
190
- t02: "#ffffff05",
191
- t01: "#ffffff02",
192
- lgrad: `linear-gradient(
193
- to right,
194
- #3d485c 0%,
195
- #3c4657 5%,
196
- #3b4353 10%,
197
- #3a414e 20%,
198
- #393f4a 30%,
199
- #373c45 60%,
200
- #363a41 80%,
201
- #35383c 90%,
202
- #343538 100%
203
- )`,
204
- maingrad: "linear-gradient(330deg, #1d1e27 0%, #333333 100%)",
205
- ...CommonTheme
206
- }
207
- };
208
-
209
- // contexts/theme/index.tsx
210
- var import_jsx_runtime = require("react/jsx-runtime");
211
- var ThemeContext = (0, import_react.createContext)({});
212
- var ThemeProviderContainer = (props) => {
213
- const [theme, setTheme] = (0, import_react.useState)("light");
214
- const [defaultTheme] = (0, import_react.useState)("light");
215
- const SwitcherComponent = () => {
216
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
217
- Switcher,
218
- {
219
- onClick: () => setTheme(theme === "light" ? "dark" : "light"),
220
- "data-theme": theme || defaultTheme,
221
- children: [
222
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { "aria-hidden": true, className: "fa-solid fa-moon" }),
223
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "switcher", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}) }),
224
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { "aria-hidden": true, className: "fa-solid fa-sun" })
225
- ]
226
- }
227
- );
228
- };
229
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
230
- ThemeContext.Provider,
231
- {
232
- value: {
233
- theme: props.theme || defaultTheme,
234
- setTheme,
235
- content: Themes[props.theme || defaultTheme],
236
- Switcher: SwitcherComponent
237
- },
238
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled_components2.ThemeProvider, { theme: Themes[props.theme || defaultTheme], children: props.children })
239
- }
240
- );
241
- };
242
- var useTheme = () => (0, import_react.useContext)(ThemeContext);
243
-
244
- // contexts/icon/index.tsx
245
- var import_lodash = __toESM(require("lodash"));
246
-
247
- // contexts/icon/assets/brands/index.tsx
248
- var req = require.context("./", false, /\.svg$/);
249
- var brands = {};
250
- req.keys().forEach((key) => {
251
- const name = key.replace("./", "").replace(".svg", "");
252
- brands[name] = req(key).default;
253
- });
254
- var brands_default = brands;
255
-
256
- // contexts/icon/assets/regular/index.tsx
257
- var req2 = require.context("./", false, /\.svg$/);
258
- var regular = {};
259
- req2.keys().forEach((key) => {
260
- const name = key.replace("./", "").replace(".svg", "");
261
- regular[name] = req2(key).default;
262
- });
263
- var regular_default = regular;
264
-
265
- // contexts/icon/assets/solid/index.tsx
266
- var req3 = require.context("./", false, /\.svg$/);
267
- var solid = {};
268
- req3.keys().forEach((key) => {
269
- const name = key.replace("./", "").replace(".svg", "");
270
- solid[name] = req3(key).default;
271
- });
272
- var solid_default = solid;
273
-
274
- // contexts/icon/assets/index.tsx
275
- var assets_default = {
276
- brands: brands_default,
277
- regular: regular_default,
278
- solid: solid_default
279
- };
280
-
281
- // contexts/icon/index.tsx
282
- var import_jsx_runtime2 = require("react/jsx-runtime");
283
- var IconContext = (0, import_react2.createContext)({});
284
- var IconProviderContainer = ({ children }) => {
285
- const { content } = useTheme();
286
- const [isClient, setIsClient] = (0, import_react2.useState)(false);
287
- const [matches, setMatches] = (0, import_react2.useState)(0);
288
- (0, import_react2.useEffect)(() => {
289
- setIsClient(true);
290
- }, []);
291
- (0, import_react2.useEffect)(() => {
292
- const firstMediaQuery = window.matchMedia(`(max-width: ${content.mobileMaxWidth})`);
293
- const secoundMediaQuery = window.matchMedia(`(max-width: ${content.mobileMinWidth})`);
294
- const firstHandler = (event) => setMatches(event.matches ? 1 : 0);
295
- const secoundHandler = (event) => setMatches(event.matches ? 2 : 1);
296
- if (firstMediaQuery.matches) setMatches(1);
297
- if (secoundMediaQuery.matches) setMatches(2);
298
- firstMediaQuery.addEventListener("change", firstHandler);
299
- secoundMediaQuery.addEventListener("change", secoundHandler);
300
- return () => {
301
- firstMediaQuery.removeEventListener("change", firstHandler);
302
- secoundMediaQuery.removeEventListener("change", secoundHandler);
303
- };
304
- }, []);
305
- (0, import_react2.useEffect)(() => {
306
- if (!isClient) return;
307
- const processElement = (element) => {
308
- var _a, _b, _c, _d, _e;
309
- const name = element.getAttribute("class");
310
- if (!name) return;
311
- const icon = import_lodash.default.split(import_lodash.default.replace(name, /fa-/g, ""), " ");
312
- if (!icon.length) return;
313
- let svg = (_d = (_c = (_a = assets_default[icon[0]]) == null ? void 0 : _a[icon[1]]) != null ? _c : (_b = assets_default["solid"]) == null ? void 0 : _b[icon[0]]) != null ? _d : "";
314
- if (!svg) return;
315
- svg = svg.replace(/fill=".*?"/g, 'fill="currentColor"');
316
- const styles = window.getComputedStyle(element);
317
- const size = Number((_e = import_lodash.default.split(styles.fontSize, "px")) == null ? void 0 : _e[0]) + 2;
318
- element.style.width = `${size}px`;
319
- element.style.height = `${size}px`;
320
- element.textContent = "";
321
- element.innerHTML = svg;
322
- };
323
- document.querySelectorAll("i").forEach((el) => processElement(el));
324
- const observer = new MutationObserver((mutations) => {
325
- mutations.forEach((mutation) => {
326
- mutation.addedNodes.forEach((node) => {
327
- if (node.nodeType === 1) {
328
- const el = node;
329
- if (el.tagName.toLowerCase() === "i") processElement(el);
330
- el.querySelectorAll("i").forEach((child) => processElement(child));
331
- }
332
- });
333
- });
334
- });
335
- observer.observe(document.body, {
336
- childList: true,
337
- subtree: true
338
- });
339
- return () => observer.disconnect();
340
- }, [isClient, matches]);
341
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IconContext.Provider, { value: {}, children });
342
- };
343
- var useIcon = () => (0, import_react2.useContext)(IconContext);
344
-
345
- // contexts/tooltip/index.tsx
346
- var import_react3 = require("react");
347
-
348
- // contexts/tooltip/styles.tsx
349
- var import_styled_components3 = __toESM(require("styled-components"));
350
- var Tooltip = import_styled_components3.default.div`
351
- position: fixed;
352
- background: ${({ theme }) => theme.tooltip};
353
- color: ${({ theme }) => theme.t6};
354
- font-size: .8rem;
355
- font-weight: 500;
356
- text-align: center;
357
- padding: .3rem .8rem;
358
- border-radius: 5px;
359
- transform: translateX(-50%);
360
- z-index: 10;
361
- border: 1px solid ${({ theme }) => theme.t05};
362
-
363
- &::before {
364
- content: "";
365
- position: absolute;
366
- bottom: -9px;
367
- left: 50%;
368
- transform: translateX(-50%);
369
- width: 0;
370
- height: 0;
371
- border-left: 8px solid transparent;
372
- border-right: 8px solid transparent;
373
- border-top: 8px solid ${({ theme }) => theme.t05};
374
- }
375
-
376
- &::after {
377
- content: "";
378
- position: absolute;
379
- bottom: -8px;
380
- left: 50%;
381
- transform: translateX(-50%);
382
- width: 0;
383
- height: 0;
384
- border-left: 8px solid transparent;
385
- border-right: 8px solid transparent;
386
- border-top: 8px solid ${({ theme }) => theme.tooltip};
387
- }
388
- `;
389
-
390
- // contexts/tooltip/index.tsx
391
- var import_lodash2 = __toESM(require("lodash"));
392
- var import_jsx_runtime3 = require("react/jsx-runtime");
393
- var TooltipContext = (0, import_react3.createContext)({});
394
- var TooltipProviderContainer = ({ children }) => {
395
- const [tooltips, setTooltips] = (0, import_react3.useState)([]);
396
- const getContent = (target) => {
397
- var _a;
398
- const rect = target.getBoundingClientRect();
399
- return {
400
- top: rect.top + window.scrollY - (target.offsetHeight + 8),
401
- left: rect.left + window.scrollX + target.offsetWidth / 2,
402
- content: ((_a = target.dataset) == null ? void 0 : _a.tooltip) || ""
403
- };
404
- };
405
- (0, import_react3.useEffect)(() => {
406
- const processElement = (element) => {
407
- element.addEventListener("mouseenter", (event) => {
408
- const target = event == null ? void 0 : event.target;
409
- if (!target) return;
410
- setTooltips(import_lodash2.default.concat(tooltips, [getContent(target)]));
411
- });
412
- element.addEventListener("mouseleave", (event) => {
413
- const target = event == null ? void 0 : event.target;
414
- if (!target) return;
415
- setTooltips(import_lodash2.default.filter(tooltips, (data) => JSON.stringify(data) === JSON.stringify(getContent(target))));
416
- });
417
- };
418
- document.querySelectorAll("[data-tooltip]").forEach((el) => processElement(el));
419
- const observer = new MutationObserver((mutations) => {
420
- mutations.forEach((mutation) => {
421
- mutation.addedNodes.forEach((node) => {
422
- if (node.nodeType === 1) {
423
- const el = node;
424
- if (el.getAttribute("data-tooltip")) processElement(el);
425
- el.querySelectorAll("[data-tooltip]").forEach((child) => processElement(child));
426
- }
427
- });
428
- });
429
- });
430
- observer.observe(document.body, {
431
- childList: true,
432
- subtree: true
433
- });
434
- return () => observer.disconnect();
435
- }, []);
436
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(TooltipContext.Provider, { value: {}, children: [
437
- import_lodash2.default.map(
438
- tooltips,
439
- (data, index) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
440
- Tooltip,
441
- {
442
- style: {
443
- top: data.top,
444
- left: data.left
445
- },
446
- children: data.content
447
- },
448
- index
449
- )
450
- ),
451
- children
452
- ] });
453
- };
454
- var useTooltip = () => (0, import_react3.useContext)(TooltipContext);
455
-
456
- // contexts/modal/index.tsx
457
- var import_react4 = require("react");
458
- var import_navigation = require("next/navigation");
459
-
460
- // contexts/modal/styles.tsx
461
- var import_styled_components4 = __toESM(require("styled-components"));
462
- var Container = import_styled_components4.default.div`
463
-
464
- `;
465
-
466
- // contexts/modal/index.tsx
467
- var import_lodash3 = __toESM(require("lodash"));
468
- var import_jsx_runtime4 = require("react/jsx-runtime");
469
- var ModalContext = (0, import_react4.createContext)({});
470
- var memory = [];
471
- var ModalProviderContainer = ({ children }) => {
472
- const pathname = (0, import_navigation.usePathname)();
473
- const [modals, setModals] = (0, import_react4.useState)([]);
474
- (0, import_react4.useEffect)(() => {
475
- setModals(import_lodash3.default.filter(memory, (modal) => modal.type === "fixed"));
476
- }, [pathname]);
477
- const add = (modal) => {
478
- if (import_lodash3.default.some(memory, (data) => data.name === modal.name)) return;
479
- memory.push(modal);
480
- setModals(memory);
481
- };
482
- const remove = (modalName) => {
483
- const index = import_lodash3.default.findIndex(memory, (data) => data.name === modalName);
484
- memory.slice(index, 1);
485
- setModals(memory);
486
- };
487
- const setProps = (modalName, props) => {
488
- const index = import_lodash3.default.findIndex(modals, (modal) => modal.name === modalName);
489
- const content = import_lodash3.default.find(modals, (modal) => modal.name === modalName);
490
- if (!content) return;
491
- let settedModals = [...modals];
492
- settedModals.splice(index, 1, { ...content, props: { ...content.props, ...props } });
493
- setModals(settedModals);
494
- };
495
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
496
- ModalContext.Provider,
497
- {
498
- value: {
499
- value: modals,
500
- add,
501
- remove,
502
- setProps
503
- },
504
- children: [
505
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Container, { children: import_lodash3.default.map(modals, (modal, index) => {
506
- const ModalComponent = modal.component;
507
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ModalComponent, { ...modal.props }, index);
508
- }) }),
509
- children
510
- ]
511
- }
512
- );
513
- };
514
- var useModal = () => (0, import_react4.useContext)(ModalContext);
20
+ __reExport(contexts_exports, require("./icon"), module.exports);
21
+ __reExport(contexts_exports, require("./theme"), module.exports);
22
+ __reExport(contexts_exports, require("./tooltip"), module.exports);
23
+ __reExport(contexts_exports, require("./modal"), module.exports);
515
24
  // Annotate the CommonJS export names for ESM import in node:
516
25
  0 && (module.exports = {
517
- IconProvider,
518
- ModalProvider,
519
- ThemeProvider,
520
- TooltipProvider,
521
- useIcon,
522
- useModal,
523
- useTheme,
524
- useTooltip
26
+ ...require("./icon"),
27
+ ...require("./theme"),
28
+ ...require("./tooltip"),
29
+ ...require("./modal")
525
30
  });
526
- //# sourceMappingURL=index.js.map
@@ -1,23 +1,6 @@
1
1
  "use client";
2
2
  "use client";
3
- import {
4
- IconProviderContainer,
5
- ModalProviderContainer,
6
- ThemeProviderContainer,
7
- TooltipProviderContainer,
8
- useIcon,
9
- useModal,
10
- useTheme,
11
- useTooltip
12
- } from "../chunk-2X7JQNHX.mjs";
13
- export {
14
- IconProviderContainer as IconProvider,
15
- ModalProviderContainer as ModalProvider,
16
- ThemeProviderContainer as ThemeProvider,
17
- TooltipProviderContainer as TooltipProvider,
18
- useIcon,
19
- useModal,
20
- useTheme,
21
- useTooltip
22
- };
23
- //# sourceMappingURL=index.mjs.map
3
+ export * from "./icon";
4
+ export * from "./theme";
5
+ export * from "./tooltip";
6
+ export * from "./modal";