@fangzsx/component-library 0.0.38 → 0.0.39

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.
@@ -0,0 +1,23 @@
1
+ const c = "#1D252D", n = "#404A58", r = "#566376", s = "#8996A9", o = "#C4CBD4", t = "#E6EAED", E = "#F4F7F9", F = "#053E72", e = "#0B6B9F", y = "#27A4E8", a = "#C8EDFE", g = "#E6F6FF", i = "#055C56", p = "#E6FEEE", m = "#8E3007", C = "#FFF9F0", D = "#800711", d = "#FFECEB", A = {
2
+ grey800: c,
3
+ grey700: n,
4
+ grey600: r,
5
+ grey400: s,
6
+ grey200: o,
7
+ grey100: t,
8
+ grey50: E,
9
+ primary800: F,
10
+ primary700: e,
11
+ primary500: y,
12
+ primary100: a,
13
+ primary50: g,
14
+ secondary800: i,
15
+ secondary50: p,
16
+ warning800: m,
17
+ warning50: C,
18
+ destructive800: D,
19
+ destructive50: d
20
+ };
21
+ export {
22
+ A as c
23
+ };
@@ -3,7 +3,7 @@ import { c as E } from "../../createSvgIcon-C0YrvByi.js";
3
3
  import { Stack as w, Popper as $, ClickAwayListener as D, Paper as U } from "@mui/material";
4
4
  import * as C from "react";
5
5
  import { useState as Z } from "react";
6
- import { C as G, B as b } from "../../index-Dnsx2wLn.js";
6
+ import { C as G, B as b } from "../../index-CdcRS0lC.js";
7
7
  import { g as V, a as A, c as l, P as r } from "../../generateUtilityClasses-BCID9NF1.js";
8
8
  import { u as H, s as B, c as T, a as h, m as v } from "../../DefaultPropsProvider-DVX_ssOt.js";
9
9
  import { c as I, a as F } from "../../useTimeout-UzNJH-cm.js";
@@ -1,7 +1,7 @@
1
1
  import { jsx as o, jsxs as i } from "react/jsx-runtime";
2
2
  import { ErrorOutline as d, CheckCircle as a, InfoOutlined as m, WarningAmber as h } from "@mui/icons-material";
3
3
  import { Card as g, Box as c, Typography as e } from "@mui/material";
4
- import { c as n } from "../../colors-DvNGPCDl.js";
4
+ import { c as n } from "../../colors-CyChpKWu.js";
5
5
  const y = {
6
6
  warning: { icon: h, color: "#f59e0b" },
7
7
  info: { icon: m, color: n.primary500 },
@@ -1,6 +1,6 @@
1
1
  import "react/jsx-runtime";
2
- import "../../colors-DvNGPCDl.js";
3
- import { B as p } from "../../index-Dnsx2wLn.js";
2
+ import "../../colors-CyChpKWu.js";
3
+ import { B as p } from "../../index-CdcRS0lC.js";
4
4
  export {
5
5
  p as Button
6
6
  };
@@ -2,7 +2,7 @@ import { jsxs as d, jsx as r, Fragment as y } from "react/jsx-runtime";
2
2
  import { ExpandMoreOutlined as C } from "@mui/icons-material";
3
3
  import { Box as I, IconButton as v, Menu as M, MenuItem as k, ListItemIcon as w, ListItemText as j } from "@mui/material";
4
4
  import { useState as B } from "react";
5
- import { c as t } from "../../colors-DvNGPCDl.js";
5
+ import { c as t } from "../../colors-CyChpKWu.js";
6
6
  function L({
7
7
  items: h,
8
8
  activeItemId: e,
@@ -1,7 +1,7 @@
1
1
  import { jsx as n, jsxs as i } from "react/jsx-runtime";
2
2
  import { ErrorOutline as C, CheckCircle as f, InfoOutlineRounded as g, WarningAmberRounded as x } from "@mui/icons-material";
3
3
  import { Card as m, Box as e, Typography as t } from "@mui/material";
4
- import { c as o } from "../../colors-DvNGPCDl.js";
4
+ import { c as o } from "../../colors-CyChpKWu.js";
5
5
  const b = {
6
6
  warning: { titleColor: o.warning800, bgColor: o.warning50, icon: x, iconColor: "#f59e0b" },
7
7
  info: { titleColor: o.primary800, bgColor: o.primary50, icon: g, iconColor: "#f59e0b" },
@@ -1,126 +1,127 @@
1
- import { jsx as e, jsxs as n } from "react/jsx-runtime";
2
- import { C as H } from "../../Close-pjIlDyCW.js";
3
- import { c as M } from "../../createSvgIcon-C0YrvByi.js";
4
- import { FormControl as P, FormLabel as T, Box as i, Stack as U, Typography as l, IconButton as V, FormHelperText as E } from "@mui/material";
5
- import { useState as g, useRef as q, useCallback as G } from "react";
6
- const J = M(/* @__PURE__ */ e("path", {
1
+ import { jsx as o, jsxs as t } from "react/jsx-runtime";
2
+ import { C as M } from "../../Close-pjIlDyCW.js";
3
+ import { c as P } from "../../createSvgIcon-C0YrvByi.js";
4
+ import { FormControl as T, FormLabel as U, Box as l, Stack as V, Typography as a, IconButton as E, FormHelperText as q } from "@mui/material";
5
+ import { useState as y, useRef as G, useCallback as J } from "react";
6
+ import { c as e } from "../../colors-CyChpKWu.js";
7
+ const K = P(/* @__PURE__ */ o("path", {
7
8
  d: "M19 5v14H5V5zm0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m-4.86 8.86-3 3.87L9 13.14 6 17h12z"
8
9
  }), "ImageOutlined");
9
- function K(t) {
10
- const a = t.lastIndexOf(".");
11
- return a <= 0 ? { baseName: t, extension: "" } : {
12
- baseName: t.slice(0, a),
13
- extension: t.slice(a)
10
+ function Q(i) {
11
+ const c = i.lastIndexOf(".");
12
+ return c <= 0 ? { baseName: i, extension: "" } : {
13
+ baseName: i.slice(0, c),
14
+ extension: i.slice(c)
14
15
  };
15
16
  }
16
- function rr({
17
- label: t = "Logo",
18
- required: a = !0,
19
- maxSizeMB: u = 2,
20
- acceptedFormats: c = ["png", "jpg", "jpeg"],
21
- error: x = "",
22
- forceError: y = !1,
17
+ function or({
18
+ label: i = "Logo",
19
+ required: c = !0,
20
+ maxSizeMB: m = 2,
21
+ acceptedFormats: s = ["png", "jpg", "jpeg"],
22
+ error: v = "",
23
+ forceError: x = !1,
23
24
  helperText: b,
24
- disabled: o = !1,
25
- onChange: s
25
+ disabled: n = !1,
26
+ onChange: p
26
27
  }) {
27
- const [v, f] = g(!1), [p, k] = g(null), [O, D] = g(""), d = q(null), w = u * 1024 * 1024, R = c.map((r) => `.${r}`).join(","), C = c.map(
28
+ const [k, h] = y(!1), [u, D] = y(null), [R, w] = y(""), d = G(null), C = m * 1024 * 1024, S = s.map((r) => `.${r}`).join(","), j = s.map(
28
29
  (r) => `image/${r === "jpg" ? "jpeg" : r}`
29
- ), j = G(
30
+ ), I = J(
30
31
  function(r) {
31
32
  if (!r) return;
32
- if (!C.some((h) => r.type === h)) {
33
- s?.(null, `Only ${c.join(", ")} files are supported`);
33
+ if (!j.some((g) => r.type === g)) {
34
+ p?.(null, `Only ${s.join(", ")} files are supported`);
34
35
  return;
35
36
  }
36
- if (r.size > w) {
37
- s?.(null, `File size must be less than ${u}MB`);
37
+ if (r.size > C) {
38
+ p?.(null, `File size must be less than ${m}MB`);
38
39
  return;
39
40
  }
40
- const I = new FileReader();
41
- I.onload = function(h) {
42
- k(h.target?.result), D(r.name), s?.(r, "");
43
- }, I.readAsDataURL(r);
41
+ const O = new FileReader();
42
+ O.onload = function(g) {
43
+ D(g.target?.result), w(r.name), p?.(r, "");
44
+ }, O.readAsDataURL(r);
44
45
  },
45
- [C, w, u, c, s]
46
+ [j, C, m, s, p]
46
47
  );
47
- function S(r) {
48
- r.preventDefault(), !o && (f(!1), j(r.dataTransfer.files?.[0] ?? null));
48
+ function W(r) {
49
+ r.preventDefault(), !n && (h(!1), I(r.dataTransfer.files?.[0] ?? null));
49
50
  }
50
51
  function F(r) {
51
- r.preventDefault(), o || f(!0);
52
+ r.preventDefault(), n || h(!0);
52
53
  }
53
54
  function L() {
54
- f(!1);
55
+ h(!1);
55
56
  }
56
- function W() {
57
- o || d.current?.click();
58
- }
59
- function z(r) {
60
- j(r.target.files?.[0] ?? null);
57
+ function z() {
58
+ n || d.current?.click();
61
59
  }
62
60
  function N(r) {
63
- r.stopPropagation(), k(null), D(""), s?.(null, ""), d.current && (d.current.value = "");
61
+ I(r.target.files?.[0] ?? null);
62
+ }
63
+ function B(r) {
64
+ r.stopPropagation(), D(null), w(""), p?.(null, ""), d.current && (d.current.value = "");
64
65
  }
65
- const m = !!x || y && !p, B = x || (y && !p ? `${t} can't be empty` : ""), { baseName: $, extension: A } = K(O);
66
- return /* @__PURE__ */ n(P, { fullWidth: !0, error: m, disabled: o, children: [
67
- t && /* @__PURE__ */ e(
68
- T,
66
+ const f = !!v || x && !u, $ = v || (x && !u ? `${i} can't be empty` : ""), { baseName: A, extension: H } = Q(R);
67
+ return /* @__PURE__ */ t(T, { fullWidth: !0, error: f, disabled: n, children: [
68
+ i && /* @__PURE__ */ o(
69
+ U,
69
70
  {
70
- required: a,
71
+ required: c,
71
72
  sx: {
72
73
  mb: 0.75,
73
74
  fontSize: 14,
74
- fontWeight: 500,
75
+ fontWeight: 700,
75
76
  color: "text.primary",
76
77
  "& .MuiFormLabel-asterisk": { color: "error.main" },
77
78
  "&.Mui-focused": { color: "text.primary" },
78
79
  "&.Mui-error": { color: "text.primary" }
79
80
  },
80
- children: t
81
+ children: i
81
82
  }
82
83
  ),
83
- /* @__PURE__ */ n(
84
- i,
84
+ /* @__PURE__ */ t(
85
+ l,
85
86
  {
86
- onClick: W,
87
- onDrop: S,
87
+ onClick: z,
88
+ onDrop: W,
88
89
  onDragOver: F,
89
90
  onDragLeave: L,
90
91
  sx: {
91
92
  border: 2,
92
93
  borderStyle: "dashed",
93
- borderColor: m ? "error.main" : v ? "primary.main" : "grey.300",
94
+ borderColor: f ? "error.main" : k ? e.primary500 : e.grey200,
94
95
  borderRadius: 2,
95
- p: p ? 1.5 : 4,
96
+ p: u ? 1.5 : 4,
96
97
  textAlign: "center",
97
- cursor: o ? "default" : "pointer",
98
- bgcolor: o ? "action.disabledBackground" : v ? "primary.50" : "grey.50",
98
+ cursor: n ? "default" : "pointer",
99
+ bgcolor: n ? "action.disabledBackground" : k ? e.primary500 : e.grey50,
99
100
  transition: "all 0.2s ease",
100
- opacity: o ? 0.6 : 1,
101
- "&:hover": o ? {} : {
102
- borderColor: m ? "error.main" : "primary.main",
103
- bgcolor: "primary.50"
101
+ opacity: n ? 0.6 : 1,
102
+ "&:hover": n ? {} : {
103
+ borderColor: f ? "error.main" : e.primary500,
104
+ bgcolor: e.primary50
104
105
  }
105
106
  },
106
107
  children: [
107
- /* @__PURE__ */ e(
108
+ /* @__PURE__ */ o(
108
109
  "input",
109
110
  {
110
111
  ref: d,
111
112
  type: "file",
112
- accept: R,
113
- onChange: z,
113
+ accept: S,
114
+ onChange: N,
114
115
  hidden: !0,
115
- disabled: o
116
+ disabled: n
116
117
  }
117
118
  ),
118
- p ? /* @__PURE__ */ n(U, { direction: "row", alignItems: "center", spacing: 2, children: [
119
- /* @__PURE__ */ e(
120
- i,
119
+ u ? /* @__PURE__ */ t(V, { direction: "row", alignItems: "center", spacing: 2, children: [
120
+ /* @__PURE__ */ o(
121
+ l,
121
122
  {
122
123
  component: "img",
123
- src: p,
124
+ src: u,
124
125
  alt: "Preview",
125
126
  sx: {
126
127
  width: 80,
@@ -128,13 +129,13 @@ function rr({
128
129
  objectFit: "contain",
129
130
  borderRadius: 1.5,
130
131
  border: 1,
131
- borderColor: "grey.200"
132
+ borderColor: e.grey200
132
133
  }
133
134
  }
134
135
  ),
135
- /* @__PURE__ */ n(i, { sx: { flex: 1, minWidth: 0, textAlign: "left" }, children: [
136
- /* @__PURE__ */ n(
137
- l,
136
+ /* @__PURE__ */ t(l, { sx: { flex: 1, minWidth: 0, textAlign: "left" }, children: [
137
+ /* @__PURE__ */ t(
138
+ a,
138
139
  {
139
140
  variant: "body2",
140
141
  fontWeight: 500,
@@ -143,8 +144,8 @@ function rr({
143
144
  minWidth: 0
144
145
  },
145
146
  children: [
146
- /* @__PURE__ */ e(
147
- i,
147
+ /* @__PURE__ */ o(
148
+ l,
148
149
  {
149
150
  component: "span",
150
151
  sx: {
@@ -153,77 +154,76 @@ function rr({
153
154
  whiteSpace: "nowrap",
154
155
  minWidth: 0
155
156
  },
156
- children: $
157
+ children: A
157
158
  }
158
159
  ),
159
- /* @__PURE__ */ e(
160
- i,
160
+ /* @__PURE__ */ o(
161
+ l,
161
162
  {
162
163
  component: "span",
163
164
  sx: {
164
165
  flexShrink: 0
165
166
  },
166
- children: A
167
+ children: H
167
168
  }
168
169
  )
169
170
  ]
170
171
  }
171
172
  ),
172
- /* @__PURE__ */ e(l, { variant: "caption", color: "text.secondary", children: "Click to replace" })
173
+ /* @__PURE__ */ o(a, { variant: "caption", color: e.grey400, children: "Click to replace" })
173
174
  ] }),
174
- /* @__PURE__ */ e(
175
- V,
175
+ /* @__PURE__ */ o(
176
+ E,
176
177
  {
177
- onClick: N,
178
+ onClick: B,
178
179
  size: "small",
179
180
  color: "error",
180
181
  sx: {
181
182
  border: 1,
182
- borderColor: "grey.200",
183
+ borderColor: e.grey200,
183
184
  borderRadius: 1.5,
184
185
  "&:hover": { bgcolor: "error.50", borderColor: "error.200" }
185
186
  },
186
- children: /* @__PURE__ */ e(H, { fontSize: "small" })
187
+ children: /* @__PURE__ */ o(M, { fontSize: "small" })
187
188
  }
188
189
  )
189
- ] }) : /* @__PURE__ */ n(i, { children: [
190
- /* @__PURE__ */ e(
191
- J,
190
+ ] }) : /* @__PURE__ */ t(l, { children: [
191
+ /* @__PURE__ */ o(
192
+ K,
192
193
  {
193
- sx: { fontSize: 40, color: "primary.main", mb: 1.5 }
194
+ sx: { fontSize: 40, color: e.primary700 }
194
195
  }
195
196
  ),
196
- /* @__PURE__ */ n(l, { variant: "body2", color: "text.secondary", gutterBottom: !0, children: [
197
+ /* @__PURE__ */ t(a, { variant: "body2", color: e.grey700, fontWeight: 700, gutterBottom: !0, children: [
197
198
  "Drop image here or",
198
199
  " ",
199
- /* @__PURE__ */ e(
200
- l,
200
+ /* @__PURE__ */ o(
201
+ a,
201
202
  {
202
203
  component: "span",
203
204
  variant: "body2",
204
- color: "primary",
205
+ color: e.primary500,
205
206
  fontWeight: 600,
206
- sx: { textDecoration: "underline" },
207
207
  children: "click to browse"
208
208
  }
209
209
  )
210
210
  ] }),
211
- /* @__PURE__ */ n(l, { variant: "caption", color: "text.disabled", display: "block", children: [
211
+ /* @__PURE__ */ t(a, { variant: "caption", color: e.grey400, display: "block", children: [
212
212
  "File size should be less than ",
213
- u,
213
+ m,
214
214
  "MB"
215
215
  ] }),
216
- /* @__PURE__ */ n(l, { variant: "caption", color: "text.disabled", display: "block", children: [
216
+ /* @__PURE__ */ t(a, { variant: "caption", color: e.grey400, display: "block", children: [
217
217
  "Supports ",
218
- c.join(", ")
218
+ s.join(", ")
219
219
  ] })
220
220
  ] })
221
221
  ]
222
222
  }
223
223
  ),
224
- (m || b) && /* @__PURE__ */ e(E, { sx: { mt: 0.75, mx: 0 }, children: B || b })
224
+ (f || b) && /* @__PURE__ */ o(q, { sx: { mt: 0.75, mx: 0 }, children: $ || b })
225
225
  ] });
226
226
  }
227
227
  export {
228
- rr as ImageUpload
228
+ or as ImageUpload
229
229
  };
@@ -1,5 +1,5 @@
1
1
  import { jsx as d, jsxs as x } from "react/jsx-runtime";
2
- import { B as A } from "../../index-Dnsx2wLn.js";
2
+ import { B as A } from "../../index-CdcRS0lC.js";
3
3
  import * as u from "react";
4
4
  import { g as m, a as f, P as e } from "../../generateUtilityClasses-BCID9NF1.js";
5
5
  import { u as C, s as g, c as y, a as b } from "../../DefaultPropsProvider-DVX_ssOt.js";
@@ -2,7 +2,7 @@ import { jsxs as B, jsx as o } from "react/jsx-runtime";
2
2
  import { Close as D, LocalOffer as I } from "@mui/icons-material";
3
3
  import { Box as c, Chip as S, IconButton as A, Typography as h, TextField as R, InputAdornment as T, CircularProgress as W, Button as k } from "@mui/material";
4
4
  import { useState as w, useRef as O, useEffect as P, useCallback as n } from "react";
5
- import { c as r } from "../../colors-DvNGPCDl.js";
5
+ import { c as r } from "../../colors-CyChpKWu.js";
6
6
  function K({
7
7
  value: e,
8
8
  onChange: d,
@@ -1,5 +1,5 @@
1
1
  import { jsx as c, jsxs as U } from "react/jsx-runtime";
2
- import { c as P } from "./colors-DvNGPCDl.js";
2
+ import { c as P } from "./colors-CyChpKWu.js";
3
3
  import * as k from "react";
4
4
  import { g as G, a as _, c as i, P as t } from "./generateUtilityClasses-BCID9NF1.js";
5
5
  import { u as A, s as f, c as R, a as H, m as O, b as so, r as lo } from "./DefaultPropsProvider-DVX_ssOt.js";
package/dist/main.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { AppBarPublic as e } from "./components/AppBarPublic/index.js";
2
2
  import { Banner as p } from "./components/Banner/index.js";
3
- import { B as m } from "./index-Dnsx2wLn.js";
3
+ import { B as m } from "./index-CdcRS0lC.js";
4
4
  import { CheckBox as a } from "./components/Checkbox/index.js";
5
5
  import { ScrollableDialog as d } from "./components/Dialog/index.js";
6
6
  import { CheckboxGroup as l } from "./components/CheckboxGroup/index.js";
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@fangzsx/component-library",
3
3
  "author": "Jay Gilbert Garzon",
4
4
  "private": false,
5
- "version": "0.0.38",
5
+ "version": "0.0.39",
6
6
  "type": "module",
7
7
  "main": "dist/main.js",
8
8
  "types": "dist/main.d.ts",
@@ -1,19 +0,0 @@
1
- const c = "#1D252D", n = "#566376", s = "#E6EAED", o = "#F4F7F9", r = "#053E72", t = "#27A4E8", E = "#C8EDFE", F = "#E6F6FF", e = "#055C56", y = "#E6FEEE", a = "#8E3007", i = "#FFF9F0", g = "#800711", p = "#FFECEB", d = {
2
- grey800: c,
3
- grey600: n,
4
- grey100: s,
5
- grey50: o,
6
- primary800: r,
7
- primary500: t,
8
- primary100: E,
9
- primary50: F,
10
- secondary800: e,
11
- secondary50: y,
12
- warning800: a,
13
- warning50: i,
14
- destructive800: g,
15
- destructive50: p
16
- };
17
- export {
18
- d as c
19
- };