@solostylist/ui-kit 1.0.180 → 1.0.181

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 (6) hide show
  1. package/dist/theme/components/icon-button.d.ts +45 -0
  2. package/dist/theme/components/icon-button.js +60 -21
  3. package/dist/theme/components/svg-icon.d.ts +22 -0
  4. package/dist/theme/components/svg-icon.js +26 -3
  5. package/dist/theme/customizations/inputs.js +99 -100
  6. package/package.json +1 -1
package/dist/theme/components/icon-button.d.ts CHANGED
@@ -12,8 +12,42 @@ export declare const MuiIconButton: {
12
12
  }) => {
13
13
  transition: "all 0.2s ease-in-out";
14
14
  variants: ({
15
+ props: {
16
+ size: "small";
17
+ color?: undefined;
18
+ };
19
+ style: {
20
+ fontSize: string;
21
+ '& svg': {
22
+ fontSize: string;
23
+ };
24
+ };
25
+ } | {
26
+ props: {
27
+ size: "medium";
28
+ color?: undefined;
29
+ };
30
+ style: {
31
+ fontSize: string;
32
+ '& svg': {
33
+ fontSize: string;
34
+ };
35
+ };
36
+ } | {
37
+ props: {
38
+ size: "large";
39
+ color?: undefined;
40
+ };
41
+ style: {
42
+ fontSize: string;
43
+ '& svg': {
44
+ fontSize: string;
45
+ };
46
+ };
47
+ } | {
15
48
  props: {
16
49
  color: "primary";
50
+ size?: undefined;
17
51
  };
18
52
  style: {
19
53
  accentColor?: import("csstype").Property.AccentColor | readonly string[] | readonly import("csstype").Property.AccentColor[] | undefined;
@@ -1039,10 +1073,12 @@ export declare const MuiIconButton: {
1039
1073
  color: string;
1040
1074
  opacity: number;
1041
1075
  };
1076
+ '& svg'?: undefined;
1042
1077
  };
1043
1078
  } | {
1044
1079
  props: {
1045
1080
  color: "secondary";
1081
+ size?: undefined;
1046
1082
  };
1047
1083
  style: {
1048
1084
  accentColor?: import("csstype").Property.AccentColor | readonly string[] | readonly import("csstype").Property.AccentColor[] | undefined;
@@ -2068,10 +2104,12 @@ export declare const MuiIconButton: {
2068
2104
  color: string;
2069
2105
  opacity: number;
2070
2106
  };
2107
+ '& svg'?: undefined;
2071
2108
  };
2072
2109
  } | {
2073
2110
  props: {
2074
2111
  color: "success";
2112
+ size?: undefined;
2075
2113
  };
2076
2114
  style: {
2077
2115
  accentColor?: import("csstype").Property.AccentColor | readonly string[] | readonly import("csstype").Property.AccentColor[] | undefined;
@@ -3097,10 +3135,12 @@ export declare const MuiIconButton: {
3097
3135
  color: string;
3098
3136
  opacity: number;
3099
3137
  };
3138
+ '& svg'?: undefined;
3100
3139
  };
3101
3140
  } | {
3102
3141
  props: {
3103
3142
  color: "error";
3143
+ size?: undefined;
3104
3144
  };
3105
3145
  style: {
3106
3146
  accentColor?: import("csstype").Property.AccentColor | readonly string[] | readonly import("csstype").Property.AccentColor[] | undefined;
@@ -4126,10 +4166,12 @@ export declare const MuiIconButton: {
4126
4166
  color: string;
4127
4167
  opacity: number;
4128
4168
  };
4169
+ '& svg'?: undefined;
4129
4170
  };
4130
4171
  } | {
4131
4172
  props: {
4132
4173
  color: "info";
4174
+ size?: undefined;
4133
4175
  };
4134
4176
  style: {
4135
4177
  accentColor?: import("csstype").Property.AccentColor | readonly string[] | readonly import("csstype").Property.AccentColor[] | undefined;
@@ -5155,10 +5197,12 @@ export declare const MuiIconButton: {
5155
5197
  color: string;
5156
5198
  opacity: number;
5157
5199
  };
5200
+ '& svg'?: undefined;
5158
5201
  };
5159
5202
  } | {
5160
5203
  props: {
5161
5204
  color: "warning";
5205
+ size?: undefined;
5162
5206
  };
5163
5207
  style: {
5164
5208
  accentColor?: import("csstype").Property.AccentColor | readonly string[] | readonly import("csstype").Property.AccentColor[] | undefined;
@@ -6184,6 +6228,7 @@ export declare const MuiIconButton: {
6184
6228
  color: string;
6185
6229
  opacity: number;
6186
6230
  };
6231
+ '& svg'?: undefined;
6187
6232
  };
6188
6233
  })[];
6189
6234
  };
package/dist/theme/components/icon-button.js CHANGED
@@ -1,44 +1,83 @@
1
- import { alpha as c } from "@mui/material";
2
- import { brand as s, lightBrand as a, purple as t, lightPurple as n, green as p, lightGreen as i, red as u, lightRed as y, blue as d, lightBlue as g, orange as b, lightOrange as v } from "../theme-primitives.js";
3
- const r = (o, l, e) => ({
4
- color: l[500],
1
+ import { alpha as l } from "@mui/material";
2
+ import { brand as t, lightBrand as i, purple as n, lightPurple as p, green as a, lightGreen as c, red as y, lightRed as u, blue as g, lightBlue as d, orange as f, lightOrange as m } from "../theme-primitives.js";
3
+ const r = (o, e, s) => ({
4
+ color: e[500],
5
5
  "&:hover": {
6
- backgroundColor: c(l[500], 0.12),
7
- color: l[600]
6
+ backgroundColor: l(e[500], 0.12),
7
+ color: e[600]
8
8
  },
9
9
  "&:active": {
10
- backgroundColor: c(l[500], 0.2)
10
+ backgroundColor: l(e[500], 0.2)
11
11
  },
12
12
  "&.Mui-disabled": {
13
- color: l[300],
13
+ color: e[300],
14
14
  opacity: 0.5
15
15
  },
16
16
  ...o.applyStyles("dark", {
17
- color: e[400],
17
+ color: s[400],
18
18
  "&:hover": {
19
- backgroundColor: c(e[400], 0.12),
20
- color: e[300]
19
+ backgroundColor: l(s[400], 0.12),
20
+ color: s[300]
21
21
  },
22
22
  "&:active": {
23
- backgroundColor: c(e[400], 0.2)
23
+ backgroundColor: l(s[400], 0.2)
24
24
  },
25
25
  "&.Mui-disabled": {
26
- color: e[700],
26
+ color: s[700],
27
27
  opacity: 0.5
28
28
  }
29
29
  })
30
- }), M = {
30
+ }), b = {
31
31
  styleOverrides: {
32
32
  root: ({ theme: o }) => ({
33
33
  // borderRadius: (theme.vars || theme).shape.borderRadius,
34
34
  transition: "all 0.2s ease-in-out",
35
35
  variants: [
36
+ {
37
+ props: {
38
+ size: "small"
39
+ },
40
+ style: {
41
+ fontSize: "1rem",
42
+ // 16px - icon size
43
+ "& svg": {
44
+ fontSize: "1rem"
45
+ // 16px
46
+ }
47
+ }
48
+ },
49
+ {
50
+ props: {
51
+ size: "medium"
52
+ },
53
+ style: {
54
+ fontSize: "1.25rem",
55
+ // 20px - icon size
56
+ "& svg": {
57
+ fontSize: "1.25rem"
58
+ // 20px
59
+ }
60
+ }
61
+ },
62
+ {
63
+ props: {
64
+ size: "large"
65
+ },
66
+ style: {
67
+ fontSize: "1.5rem",
68
+ // 24px - icon size
69
+ "& svg": {
70
+ fontSize: "1.5rem"
71
+ // 24px
72
+ }
73
+ }
74
+ },
36
75
  {
37
76
  props: {
38
77
  color: "primary"
39
78
  },
40
79
  style: {
41
- ...r(o, a, s)
80
+ ...r(o, i, t)
42
81
  }
43
82
  },
44
83
  {
@@ -46,7 +85,7 @@ const r = (o, l, e) => ({
46
85
  color: "secondary"
47
86
  },
48
87
  style: {
49
- ...r(o, n, t)
88
+ ...r(o, p, n)
50
89
  }
51
90
  },
52
91
  {
@@ -54,7 +93,7 @@ const r = (o, l, e) => ({
54
93
  color: "success"
55
94
  },
56
95
  style: {
57
- ...r(o, i, p)
96
+ ...r(o, c, a)
58
97
  }
59
98
  },
60
99
  {
@@ -62,7 +101,7 @@ const r = (o, l, e) => ({
62
101
  color: "error"
63
102
  },
64
103
  style: {
65
- ...r(o, y, u)
104
+ ...r(o, u, y)
66
105
  }
67
106
  },
68
107
  {
@@ -70,7 +109,7 @@ const r = (o, l, e) => ({
70
109
  color: "info"
71
110
  },
72
111
  style: {
73
- ...r(o, g, d)
112
+ ...r(o, d, g)
74
113
  }
75
114
  },
76
115
  {
@@ -78,7 +117,7 @@ const r = (o, l, e) => ({
78
117
  color: "warning"
79
118
  },
80
119
  style: {
81
- ...r(o, v, b)
120
+ ...r(o, m, f)
82
121
  }
83
122
  }
84
123
  ]
@@ -86,5 +125,5 @@ const r = (o, l, e) => ({
86
125
  }
87
126
  };
88
127
  export {
89
- M as MuiIconButton
128
+ b as MuiIconButton
90
129
  };
package/dist/theme/components/svg-icon.d.ts CHANGED
@@ -4,6 +4,28 @@ export declare const MuiSvgIcon: {
4
4
  '& .secondary': {
5
5
  opacity: number;
6
6
  };
7
+ variants: ({
8
+ props: {
9
+ fontSize: "small";
10
+ };
11
+ style: {
12
+ fontSize: string;
13
+ };
14
+ } | {
15
+ props: {
16
+ fontSize: "medium";
17
+ };
18
+ style: {
19
+ fontSize: string;
20
+ };
21
+ } | {
22
+ props: {
23
+ fontSize: "large";
24
+ };
25
+ style: {
26
+ fontSize: string;
27
+ };
28
+ })[];
7
29
  };
8
30
  };
9
31
  };
package/dist/theme/components/svg-icon.js CHANGED
@@ -1,14 +1,37 @@
1
- const o = {
1
+ const e = {
2
2
  styleOverrides: {
3
3
  // root: ({ theme }) => ({
4
4
  // color: (theme.vars || theme).palette.text.primary,
5
5
  // '& .secondary': { opacity: 0.4 },
6
6
  // }),
7
7
  root: {
8
- "& .secondary": { opacity: 0.4 }
8
+ "& .secondary": { opacity: 0.4 },
9
+ variants: [
10
+ {
11
+ props: { fontSize: "small" },
12
+ style: {
13
+ fontSize: "1rem"
14
+ // 16px - match IconButton small
15
+ }
16
+ },
17
+ {
18
+ props: { fontSize: "medium" },
19
+ style: {
20
+ fontSize: "1.25rem"
21
+ // 20px - match IconButton medium
22
+ }
23
+ },
24
+ {
25
+ props: { fontSize: "large" },
26
+ style: {
27
+ fontSize: "1.5rem"
28
+ // 24px - match IconButton large
29
+ }
30
+ }
31
+ ]
9
32
  }
10
33
  }
11
34
  };
12
35
  export {
13
- o as MuiSvgIcon
36
+ e as MuiSvgIcon
14
37
  };
package/dist/theme/customizations/inputs.js CHANGED
@@ -1,17 +1,16 @@
1
1
  import { j as i } from "../../jsx-runtime-tc70JA_2.js";
2
- import { c as l } from "../../createSvgIcon-BKymXuBG.js";
3
- import { brand as r, gray as e } from "../theme-primitives.js";
4
- import { o as p } from "../../outlinedInputClasses-DM19xjo3.js";
5
- import { g as n } from "../../generateUtilityClasses-BtVDwGrk.js";
6
- import { s } from "../../svgIconClasses-CBCi8U9g.js";
7
- import { a as t } from "../../colorManipulator-ep5lERxB.js";
8
- const u = l(/* @__PURE__ */ i.jsx("path", {
2
+ import { c as d } from "../../createSvgIcon-BKymXuBG.js";
3
+ import { brand as e, gray as t } from "../theme-primitives.js";
4
+ import { o as n } from "../../outlinedInputClasses-DM19xjo3.js";
5
+ import { g as l } from "../../generateUtilityClasses-BtVDwGrk.js";
6
+ import { a as r } from "../../colorManipulator-ep5lERxB.js";
7
+ const p = d(/* @__PURE__ */ i.jsx("path", {
9
8
  d: "M18 19H6c-.55 0-1-.45-1-1V6c0-.55.45-1 1-1h12c.55 0 1 .45 1 1v12c0 .55-.45 1-1 1m1-16H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2"
10
- }), "CheckBoxOutlineBlankRounded"), c = l(/* @__PURE__ */ i.jsx("path", {
9
+ }), "CheckBoxOutlineBlankRounded"), u = d(/* @__PURE__ */ i.jsx("path", {
11
10
  d: "M9 16.17 5.53 12.7a.996.996 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.18 4.18c.39.39 1.02.39 1.41 0L20.29 7.71c.39-.39.39-1.02 0-1.41a.996.996 0 0 0-1.41 0z"
12
- }), "CheckRounded"), b = l(/* @__PURE__ */ i.jsx("path", {
11
+ }), "CheckRounded"), c = d(/* @__PURE__ */ i.jsx("path", {
13
12
  d: "M18 13H6c-.55 0-1-.45-1-1s.45-1 1-1h12c.55 0 1 .45 1 1s-.45 1-1 1"
14
- }), "RemoveRounded"), g = n("MuiToggleButton", ["root", "disabled", "selected", "standard", "primary", "secondary", "sizeSmall", "sizeMedium", "sizeLarge", "fullWidth"]), d = n("MuiToggleButtonGroup", ["root", "selected", "horizontal", "vertical", "disabled", "grouped", "groupedHorizontal", "groupedVertical", "fullWidth", "firstButton", "lastButton", "middleButton"]), C = {
13
+ }), "RemoveRounded"), b = l("MuiToggleButton", ["root", "disabled", "selected", "standard", "primary", "secondary", "sizeSmall", "sizeMedium", "sizeLarge", "fullWidth"]), s = l("MuiToggleButtonGroup", ["root", "selected", "horizontal", "vertical", "disabled", "grouped", "groupedHorizontal", "groupedVertical", "fullWidth", "firstButton", "lastButton", "middleButton"]), f = {
15
14
  MuiButtonBase: {
16
15
  defaultProps: {
17
16
  disableTouchRipple: !0,
@@ -24,80 +23,80 @@ const u = l(/* @__PURE__ */ i.jsx("path", {
24
23
  }
25
24
  }
26
25
  },
27
- MuiIconButton: {
28
- styleOverrides: {
29
- root: ({ theme: o }) => ({
30
- color: "inherit",
31
- boxShadow: "none",
32
- textTransform: "none",
33
- fontWeight: o.typography.fontWeightMedium,
34
- letterSpacing: 0,
35
- borderColor: e[200],
36
- "&:hover": {
37
- backgroundColor: (o.vars || o).palette.action.hover,
38
- borderColor: e[300]
39
- },
40
- "&:active": {
41
- backgroundColor: (o.vars || o).palette.action.selected
42
- },
43
- ...o.applyStyles("dark", {
44
- borderColor: e[700],
45
- "&:hover": {
46
- backgroundColor: (o.vars || o).palette.action.hover,
47
- borderColor: e[600]
48
- },
49
- "&:active": {
50
- backgroundColor: (o.vars || o).palette.action.selected
51
- }
52
- }),
53
- variants: [
54
- {
55
- props: {
56
- size: "small"
57
- },
58
- style: {
59
- width: "2.25rem",
60
- height: "2.25rem",
61
- [`& .${s.root}`]: { fontSize: "0.75rem" }
62
- }
63
- },
64
- {
65
- props: {
66
- size: "medium"
67
- },
68
- style: {
69
- width: "2.5rem",
70
- height: "2.5rem",
71
- [`& .${s.root}`]: { fontSize: "1rem" }
72
- }
73
- },
74
- {
75
- props: {
76
- size: "large"
77
- },
78
- style: {
79
- width: "2.75rem",
80
- height: "2.75rem",
81
- [`& .${s.root}`]: { fontSize: "1.25rem" }
82
- }
83
- }
84
- ]
85
- })
86
- }
87
- },
26
+ // MuiIconButton: {
27
+ // styleOverrides: {
28
+ // root: ({ theme }) => ({
29
+ // color: 'inherit',
30
+ // boxShadow: 'none',
31
+ // textTransform: 'none',
32
+ // fontWeight: theme.typography.fontWeightMedium,
33
+ // letterSpacing: 0,
34
+ // borderColor: gray[200],
35
+ // '&:hover': {
36
+ // backgroundColor: (theme.vars || theme).palette.action.hover,
37
+ // borderColor: gray[300],
38
+ // },
39
+ // '&:active': {
40
+ // backgroundColor: (theme.vars || theme).palette.action.selected,
41
+ // },
42
+ // ...theme.applyStyles('dark', {
43
+ // borderColor: gray[700],
44
+ // '&:hover': {
45
+ // backgroundColor: (theme.vars || theme).palette.action.hover,
46
+ // borderColor: gray[600],
47
+ // },
48
+ // '&:active': {
49
+ // backgroundColor: (theme.vars || theme).palette.action.selected,
50
+ // },
51
+ // }),
52
+ // variants: [
53
+ // {
54
+ // props: {
55
+ // size: 'small',
56
+ // },
57
+ // style: {
58
+ // width: '2.25rem',
59
+ // height: '2.25rem',
60
+ // [`& .${svgIconClasses.root}`]: { fontSize: '0.75rem' },
61
+ // },
62
+ // },
63
+ // {
64
+ // props: {
65
+ // size: 'medium',
66
+ // },
67
+ // style: {
68
+ // width: '2.5rem',
69
+ // height: '2.5rem',
70
+ // [`& .${svgIconClasses.root}`]: { fontSize: '1rem' },
71
+ // },
72
+ // },
73
+ // {
74
+ // props: {
75
+ // size: 'large',
76
+ // },
77
+ // style: {
78
+ // width: '2.75rem',
79
+ // height: '2.75rem',
80
+ // [`& .${svgIconClasses.root}`]: { fontSize: '1.25rem' },
81
+ // },
82
+ // },
83
+ // ],
84
+ // }),
85
+ // },
86
+ // },
88
87
  MuiToggleButtonGroup: {
89
88
  styleOverrides: {
90
89
  root: ({ theme: o }) => ({
91
90
  borderRadius: "10px",
92
- boxShadow: `0 4px 16px ${t(e[400], 0.2)}`,
93
- [`& .${d.selected}`]: {
94
- color: r[500]
91
+ boxShadow: `0 4px 16px ${r(t[400], 0.2)}`,
92
+ [`& .${s.selected}`]: {
93
+ color: e[500]
95
94
  },
96
95
  ...o.applyStyles("dark", {
97
- [`& .${d.selected}`]: {
96
+ [`& .${s.selected}`]: {
98
97
  color: "#fff"
99
98
  },
100
- boxShadow: `0 4px 16px ${t(r[700], 0.5)}`
99
+ boxShadow: `0 4px 16px ${r(e[700], 0.5)}`
101
100
  })
102
101
  })
103
102
  }
@@ -110,9 +109,9 @@ const u = l(/* @__PURE__ */ i.jsx("path", {
110
109
  borderRadius: "10px",
111
110
  fontWeight: 500,
112
111
  ...o.applyStyles("dark", {
113
- color: e[400],
114
- [`&.${g.selected}`]: {
115
- color: r[300]
112
+ color: t[400],
113
+ [`&.${b.selected}`]: {
114
+ color: e[300]
116
115
  }
117
116
  })
118
117
  })
@@ -121,9 +120,9 @@ const u = l(/* @__PURE__ */ i.jsx("path", {
121
120
  MuiCheckbox: {
122
121
  defaultProps: {
123
122
  disableRipple: !0,
124
- icon: /* @__PURE__ */ i.jsx(u, { sx: { color: "hsla(210, 0%, 0%, 0.0)" } }),
125
- checkedIcon: /* @__PURE__ */ i.jsx(c, { sx: { height: 14, width: 14 } }),
126
- indeterminateIcon: /* @__PURE__ */ i.jsx(b, { sx: { height: 14, width: 14 } })
123
+ icon: /* @__PURE__ */ i.jsx(p, { sx: { color: "hsla(210, 0%, 0%, 0.0)" } }),
124
+ checkedIcon: /* @__PURE__ */ i.jsx(u, { sx: { height: 14, width: 14 } }),
125
+ indeterminateIcon: /* @__PURE__ */ i.jsx(c, { sx: { height: 14, width: 14 } })
127
126
  },
128
127
  styleOverrides: {
129
128
  root: ({ theme: o }) => ({
@@ -133,37 +132,37 @@ const u = l(/* @__PURE__ */ i.jsx("path", {
133
132
  width: 16,
134
133
  borderRadius: 5,
135
134
  border: "1px solid",
136
- borderColor: t(e[300], 0.8),
135
+ borderColor: r(t[300], 0.8),
137
136
  boxShadow: "0 0 0 1.5px hsla(210, 0%, 0%, 0.04) inset",
138
- backgroundColor: t(e[100], 0.4),
137
+ backgroundColor: r(t[100], 0.4),
139
138
  transition: "border-color, background-color, 120ms ease-in",
140
139
  "&:hover": {
141
- borderColor: r[300]
140
+ borderColor: e[300]
142
141
  },
143
142
  "&.Mui-focusVisible": {
144
- outline: `3px solid ${t(r[500], 0.5)}`,
143
+ outline: `3px solid ${r(e[500], 0.5)}`,
145
144
  outlineOffset: "2px",
146
- borderColor: r[400]
145
+ borderColor: e[400]
147
146
  },
148
147
  "&.Mui-checked": {
149
148
  color: "white",
150
- backgroundColor: r[500],
151
- borderColor: r[500],
149
+ backgroundColor: e[500],
150
+ borderColor: e[500],
152
151
  boxShadow: "none",
153
152
  "&:hover": {
154
- backgroundColor: r[600]
153
+ backgroundColor: e[600]
155
154
  }
156
155
  },
157
156
  ...o.applyStyles("dark", {
158
- borderColor: t(e[700], 0.8),
157
+ borderColor: r(t[700], 0.8),
159
158
  boxShadow: "0 0 0 1.5px hsl(210, 0%, 0%) inset",
160
- backgroundColor: t(e[900], 0.8),
159
+ backgroundColor: r(t[900], 0.8),
161
160
  "&:hover": {
162
- borderColor: r[300]
161
+ borderColor: e[300]
163
162
  },
164
163
  "&.Mui-focusVisible": {
165
- borderColor: r[400],
166
- outline: `3px solid ${t(r[500], 0.5)}`,
164
+ borderColor: e[400],
165
+ outline: `3px solid ${r(e[500], 0.5)}`,
167
166
  outlineOffset: "2px"
168
167
  }
169
168
  })
@@ -238,11 +237,11 @@ const u = l(/* @__PURE__ */ i.jsx("path", {
238
237
  backgroundColor: (o.vars || o).palette.background.default,
239
238
  transition: "border 120ms ease-in",
240
239
  "&:hover": {
241
- borderColor: e[500]
240
+ borderColor: t[500]
242
241
  },
243
- [`&.${p.focused}`]: {
244
- outline: `3px solid ${t(r[500], 0.5)}`,
245
- borderColor: r[400]
242
+ [`&.${n.focused}`]: {
243
+ outline: `3px solid ${r(e[500], 0.5)}`,
244
+ borderColor: e[400]
246
245
  },
247
246
  variants: [
248
247
  {
@@ -288,5 +287,5 @@ const u = l(/* @__PURE__ */ i.jsx("path", {
288
287
  }
289
288
  };
290
289
  export {
291
- C as inputsCustomizations
290
+ f as inputsCustomizations
292
291
  };
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "registry": "https://registry.npmjs.org"
5
5
  },
6
- "version": "1.0.180",
6
+ "version": "1.0.181",
7
7
  "description": "advanced ui kit for solostylist",
8
8
  "type": "module",
9
9
  "main": "dist/main.js",