@solostylist/ui-kit 1.0.48 → 1.0.50

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 (8) hide show
  1. package/dist/s-smart-text-field/s-smart-text-field.js +1 -1
  2. package/dist/s-tip/s-tip.js +1 -1
  3. package/dist/theme/customizations/data-display.js +25 -30
  4. package/dist/theme/customizations/feedback.js +4 -1
  5. package/dist/theme/customizations/inputs.js +38 -33
  6. package/dist/theme/theme-primitives.d.ts +1 -170
  7. package/dist/theme/theme-primitives.js +35 -219
  8. package/package.json +4 -3
package/dist/s-smart-text-field/s-smart-text-field.js CHANGED
@@ -27087,7 +27087,7 @@ const $N = Vv(RN)(({ theme: e }) => ({
27087
27087
  border: `1px solid ${(e.vars || e).palette.divider}`,
27088
27088
  backgroundColor: (e.vars || e).palette.background.default,
27089
27089
  transition: "border 120ms ease-in",
27090
- fontFamily: "Inter, sans-serif",
27090
+ fontFamily: "Outfit, sans-serif",
27091
27091
  outline: "none",
27092
27092
  "&:focus": {
27093
27093
  outline: `3px solid ${Rl(Hi[500], 0.5)}`,
package/dist/s-tip/s-tip.js CHANGED
@@ -10,7 +10,7 @@ const c = ({ message: t }) => /* @__PURE__ */ r.jsxs(
10
10
  sx: {
11
11
  display: "flex",
12
12
  alignItems: "center",
13
- bgcolor: "var(--s-palette-background-paper)",
13
+ bgcolor: "var(--s-palette-background-default)",
14
14
  borderRadius: 1,
15
15
  p: 1,
16
16
  color: "var(--s-palette-text-secondary)"
package/dist/theme/customizations/data-display.js CHANGED
@@ -1,13 +1,13 @@
1
1
  import { j as n } from "../../jsx-runtime-C5mzlN2N.js";
2
2
  import { IconCircleX as s } from "@tabler/icons-react";
3
- import { gray as l, green as e, red as a } from "../theme-primitives.js";
4
- import { i as c } from "../../iconButtonClasses-CpCspPuI.js";
5
- import { g as d } from "../../generateUtilityClasses-CvAVhM6T.js";
3
+ import { gray as e, green as l, red as a } from "../theme-primitives.js";
4
+ import { i as d } from "../../iconButtonClasses-CpCspPuI.js";
5
+ import { g as c } from "../../generateUtilityClasses-CvAVhM6T.js";
6
6
  import { s as i } from "../../svgIconClasses-SRBiyaM8.js";
7
7
  import { b as p } from "../../buttonBaseClasses-CTVeu_V8.js";
8
8
  import { t as y } from "../../typographyClasses-DVLfmcGt.js";
9
9
  import { a as t } from "../../createTheme-CyFSna1a.js";
10
- const r = d("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colorError", "colorInfo", "colorPrimary", "colorSecondary", "colorSuccess", "colorWarning", "disabled", "clickable", "clickableColorPrimary", "clickableColorSecondary", "deletable", "deletableColorPrimary", "deletableColorSecondary", "outlined", "filled", "outlinedPrimary", "outlinedSecondary", "filledPrimary", "filledSecondary", "avatar", "avatarSmall", "avatarMedium", "avatarColorPrimary", "avatarColorSecondary", "icon", "iconSmall", "iconMedium", "iconColorPrimary", "iconColorSecondary", "label", "labelSmall", "labelMedium", "deleteIcon", "deleteIconSmall", "deleteIconMedium", "deleteIconColorPrimary", "deleteIconColorSecondary", "deleteIconOutlinedColorPrimary", "deleteIconOutlinedColorSecondary", "deleteIconFilledColorPrimary", "deleteIconFilledColorSecondary", "focusVisible"]), $ = {
10
+ const r = c("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colorError", "colorInfo", "colorPrimary", "colorSecondary", "colorSuccess", "colorWarning", "disabled", "clickable", "clickableColorPrimary", "clickableColorSecondary", "deletable", "deletableColorPrimary", "deletableColorSecondary", "outlined", "filled", "outlinedPrimary", "outlinedSecondary", "filledPrimary", "filledSecondary", "avatar", "avatarSmall", "avatarMedium", "avatarColorPrimary", "avatarColorSecondary", "icon", "iconSmall", "iconMedium", "iconColorPrimary", "iconColorSecondary", "label", "labelSmall", "labelMedium", "deleteIcon", "deleteIconSmall", "deleteIconMedium", "deleteIconColorPrimary", "deleteIconColorSecondary", "deleteIconOutlinedColorPrimary", "deleteIconOutlinedColorSecondary", "deleteIconFilledColorPrimary", "deleteIconFilledColorSecondary", "focusVisible"]), h = {
11
11
  MuiList: {
12
12
  styleOverrides: {
13
13
  root: {
@@ -104,22 +104,22 @@ const r = d("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colo
104
104
  color: "default"
105
105
  },
106
106
  style: {
107
- borderColor: l[200],
108
- backgroundColor: l[100],
107
+ borderColor: e[200],
108
+ backgroundColor: e[100],
109
109
  [`& .${r.label}`]: {
110
- color: l[500]
110
+ color: e[500]
111
111
  },
112
112
  [`& .${r.icon}`]: {
113
- color: l[500]
113
+ color: e[500]
114
114
  },
115
115
  ...o.applyStyles("dark", {
116
- borderColor: l[700],
117
- backgroundColor: l[800],
116
+ borderColor: e[700],
117
+ backgroundColor: e[800],
118
118
  [`& .${r.label}`]: {
119
- color: l[300]
119
+ color: e[300]
120
120
  },
121
121
  [`& .${r.icon}`]: {
122
- color: l[300]
122
+ color: e[300]
123
123
  }
124
124
  })
125
125
  }
@@ -129,22 +129,22 @@ const r = d("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colo
129
129
  color: "success"
130
130
  },
131
131
  style: {
132
- borderColor: e[200],
133
- backgroundColor: e[50],
132
+ borderColor: l[200],
133
+ backgroundColor: l[50],
134
134
  [`& .${r.label}`]: {
135
- color: e[500]
135
+ color: l[500]
136
136
  },
137
137
  [`& .${r.icon}`]: {
138
- color: e[500]
138
+ color: l[500]
139
139
  },
140
140
  ...o.applyStyles("dark", {
141
- borderColor: e[800],
142
- backgroundColor: e[900],
141
+ borderColor: l[800],
142
+ backgroundColor: l[900],
143
143
  [`& .${r.label}`]: {
144
- color: e[300]
144
+ color: l[300]
145
145
  },
146
146
  [`& .${r.icon}`]: {
147
- color: e[300]
147
+ color: l[300]
148
148
  }
149
149
  })
150
150
  }
@@ -198,22 +198,17 @@ const r = d("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colo
198
198
  props: { color: "premium" },
199
199
  style: {
200
200
  background: "linear-gradient(90deg, #18181b 0%, #27272a 100%)",
201
- color: "#fff",
202
- border: "1px solid #64748b",
203
- boxShadow: "0 4px 16px 0 rgba(100,116,139,0.18)",
201
+ border: "1px solid",
202
+ borderColor: o.palette.divider,
204
203
  [`& .${r.label}`]: {
205
- color: "#fff",
206
204
  fontWeight: 600
207
- },
208
- [`& .${r.icon}`]: {
209
- color: "#fff"
210
205
  }
211
206
  }
212
207
  }
213
208
  ]
214
209
  }),
215
210
  labelSmall: { paddingInline: 12 },
216
- colorSecondary: { color: l[500], backgroundColor: l[100] }
211
+ colorSecondary: { color: e[500], backgroundColor: e[100] }
217
212
  }
218
213
  },
219
214
  MuiTablePagination: {
@@ -222,7 +217,7 @@ const r = d("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colo
222
217
  display: "flex",
223
218
  gap: 8,
224
219
  marginRight: 6,
225
- [`& .${c.root}`]: {
220
+ [`& .${d.root}`]: {
226
221
  minWidth: 0,
227
222
  width: 36,
228
223
  height: 36
@@ -251,5 +246,5 @@ const r = d("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colo
251
246
  }
252
247
  };
253
248
  export {
254
- $ as dataDisplayCustomizations
249
+ h as dataDisplayCustomizations
255
250
  };
package/dist/theme/customizations/feedback.js CHANGED
@@ -24,7 +24,10 @@ const l = {
24
24
  "& .MuiDialog-paper": {
25
25
  borderRadius: "10px",
26
26
  border: "1px solid",
27
- borderColor: (r.vars || r).palette.divider
27
+ borderColor: (r.vars || r).palette.divider,
28
+ backgroundColor: (r.vars || r).palette.background.paper,
29
+ backgroundImage: "none",
30
+ boxShadow: "none"
28
31
  }
29
32
  })
30
33
  }
package/dist/theme/customizations/inputs.js CHANGED
@@ -1,17 +1,17 @@
1
- import { j as a } from "../../jsx-runtime-C5mzlN2N.js";
2
- import { c as l } from "../../createSvgIcon-FIMSBrG5.js";
1
+ import { j as t } from "../../jsx-runtime-C5mzlN2N.js";
2
+ import { c as n } from "../../createSvgIcon-FIMSBrG5.js";
3
3
  import { brand as e, gray as r } from "../theme-primitives.js";
4
4
  import { o as i } from "../../outlinedInputClasses-Y-zQ9ZHZ.js";
5
5
  import { g as d } from "../../generateUtilityClasses-CvAVhM6T.js";
6
6
  import { s } from "../../svgIconClasses-SRBiyaM8.js";
7
- import { a as t } from "../../createTheme-CyFSna1a.js";
8
- const c = l(/* @__PURE__ */ a.jsx("path", {
7
+ import { a } from "../../createTheme-CyFSna1a.js";
8
+ const c = n(/* @__PURE__ */ t.jsx("path", {
9
9
  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"), p = l(/* @__PURE__ */ a.jsx("path", {
10
+ }), "CheckBoxOutlineBlankRounded"), p = n(/* @__PURE__ */ t.jsx("path", {
11
11
  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"), u = l(/* @__PURE__ */ a.jsx("path", {
12
+ }), "CheckRounded"), u = n(/* @__PURE__ */ t.jsx("path", {
13
13
  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"), b = d("MuiToggleButton", ["root", "disabled", "selected", "standard", "primary", "secondary", "sizeSmall", "sizeMedium", "sizeLarge", "fullWidth"]), n = d("MuiToggleButtonGroup", ["root", "selected", "horizontal", "vertical", "disabled", "grouped", "groupedHorizontal", "groupedVertical", "fullWidth", "firstButton", "lastButton", "middleButton"]), m = {
14
+ }), "RemoveRounded"), b = d("MuiToggleButton", ["root", "disabled", "selected", "standard", "primary", "secondary", "sizeSmall", "sizeMedium", "sizeLarge", "fullWidth"]), l = d("MuiToggleButtonGroup", ["root", "selected", "horizontal", "vertical", "disabled", "grouped", "groupedHorizontal", "groupedVertical", "fullWidth", "firstButton", "lastButton", "middleButton"]), m = {
15
15
  MuiButtonBase: {
16
16
  defaultProps: {
17
17
  disableTouchRipple: !0,
@@ -99,6 +99,11 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
99
99
  "& .MuiButton-loadingIndicator": {
100
100
  color: "black"
101
101
  }
102
+ },
103
+ "&.Mui-disabled": {
104
+ color: r[400],
105
+ backgroundColor: r[300],
106
+ backgroundImage: "none"
102
107
  }
103
108
  })
104
109
  }
@@ -111,8 +116,8 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
111
116
  style: {
112
117
  color: "white",
113
118
  backgroundColor: e[300],
114
- backgroundImage: `linear-gradient(to bottom, ${t(e[400], 0.8)}, ${e[500]})`,
115
- boxShadow: `inset 0 2px 0 ${t(e[200], 0.2)}, inset 0 -2px 0 ${t(e[700], 0.4)}`,
119
+ backgroundImage: `linear-gradient(to bottom, ${a(e[400], 0.8)}, ${e[500]})`,
120
+ boxShadow: `inset 0 2px 0 ${a(e[200], 0.2)}, inset 0 -2px 0 ${a(e[700], 0.4)}`,
116
121
  border: `1px solid ${e[500]}`,
117
122
  "&:hover": {
118
123
  backgroundColor: e[700],
@@ -137,7 +142,7 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
137
142
  color: (o.vars || o).palette.text.primary,
138
143
  border: "1px solid",
139
144
  borderColor: r[200],
140
- backgroundColor: t(r[50], 0.3),
145
+ backgroundColor: a(r[50], 0.3),
141
146
  "&:hover": {
142
147
  backgroundColor: r[100],
143
148
  borderColor: r[300]
@@ -178,19 +183,19 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
178
183
  borderColor: e[400]
179
184
  },
180
185
  "&:active": {
181
- backgroundColor: t(e[200], 0.7)
186
+ backgroundColor: a(e[200], 0.7)
182
187
  },
183
188
  ...o.applyStyles("dark", {
184
189
  color: e[50],
185
190
  border: "1px solid",
186
191
  borderColor: e[900],
187
- backgroundColor: t(e[900], 0.3),
192
+ backgroundColor: a(e[900], 0.3),
188
193
  "&:hover": {
189
194
  borderColor: e[700],
190
- backgroundColor: t(e[900], 0.6)
195
+ backgroundColor: a(e[900], 0.6)
191
196
  },
192
197
  "&:active": {
193
- backgroundColor: t(e[900], 0.5)
198
+ backgroundColor: a(e[900], 0.5)
194
199
  }
195
200
  })
196
201
  }
@@ -213,7 +218,7 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
213
218
  backgroundColor: r[700]
214
219
  },
215
220
  "&:active": {
216
- backgroundColor: t(r[700], 0.7)
221
+ backgroundColor: a(r[700], 0.7)
217
222
  }
218
223
  })
219
224
  }
@@ -226,18 +231,18 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
226
231
  style: {
227
232
  color: e[700],
228
233
  "&:hover": {
229
- backgroundColor: t(e[100], 0.5)
234
+ backgroundColor: a(e[100], 0.5)
230
235
  },
231
236
  "&:active": {
232
- backgroundColor: t(e[200], 0.7)
237
+ backgroundColor: a(e[200], 0.7)
233
238
  },
234
239
  ...o.applyStyles("dark", {
235
240
  color: e[100],
236
241
  "&:hover": {
237
- backgroundColor: t(e[900], 0.5)
242
+ backgroundColor: a(e[900], 0.5)
238
243
  },
239
244
  "&:active": {
240
- backgroundColor: t(e[900], 0.3)
245
+ backgroundColor: a(e[900], 0.3)
241
246
  }
242
247
  })
243
248
  }
@@ -305,15 +310,15 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
305
310
  styleOverrides: {
306
311
  root: ({ theme: o }) => ({
307
312
  borderRadius: "10px",
308
- boxShadow: `0 4px 16px ${t(r[400], 0.2)}`,
309
- [`& .${n.selected}`]: {
313
+ boxShadow: `0 4px 16px ${a(r[400], 0.2)}`,
314
+ [`& .${l.selected}`]: {
310
315
  color: e[500]
311
316
  },
312
317
  ...o.applyStyles("dark", {
313
- [`& .${n.selected}`]: {
318
+ [`& .${l.selected}`]: {
314
319
  color: "#fff"
315
320
  },
316
- boxShadow: `0 4px 16px ${t(e[700], 0.5)}`
321
+ boxShadow: `0 4px 16px ${a(e[700], 0.5)}`
317
322
  })
318
323
  })
319
324
  }
@@ -338,9 +343,9 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
338
343
  MuiCheckbox: {
339
344
  defaultProps: {
340
345
  disableRipple: !0,
341
- icon: /* @__PURE__ */ a.jsx(c, { sx: { color: "hsla(210, 0%, 0%, 0.0)" } }),
342
- checkedIcon: /* @__PURE__ */ a.jsx(p, { sx: { height: 14, width: 14 } }),
343
- indeterminateIcon: /* @__PURE__ */ a.jsx(u, { sx: { height: 14, width: 14 } })
346
+ icon: /* @__PURE__ */ t.jsx(c, { sx: { color: "hsla(210, 0%, 0%, 0.0)" } }),
347
+ checkedIcon: /* @__PURE__ */ t.jsx(p, { sx: { height: 14, width: 14 } }),
348
+ indeterminateIcon: /* @__PURE__ */ t.jsx(u, { sx: { height: 14, width: 14 } })
344
349
  },
345
350
  styleOverrides: {
346
351
  root: ({ theme: o }) => ({
@@ -349,15 +354,15 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
349
354
  width: 16,
350
355
  borderRadius: 5,
351
356
  border: "1px solid ",
352
- borderColor: t(r[300], 0.8),
357
+ borderColor: a(r[300], 0.8),
353
358
  boxShadow: "0 0 0 1.5px hsla(210, 0%, 0%, 0.04) inset",
354
- backgroundColor: t(r[100], 0.4),
359
+ backgroundColor: a(r[100], 0.4),
355
360
  transition: "border-color, background-color, 120ms ease-in",
356
361
  "&:hover": {
357
362
  borderColor: e[300]
358
363
  },
359
364
  "&.Mui-focusVisible": {
360
- outline: `3px solid ${t(e[500], 0.5)}`,
365
+ outline: `3px solid ${a(e[500], 0.5)}`,
361
366
  outlineOffset: "2px",
362
367
  borderColor: e[400]
363
368
  },
@@ -371,15 +376,15 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
371
376
  }
372
377
  },
373
378
  ...o.applyStyles("dark", {
374
- borderColor: t(r[700], 0.8),
379
+ borderColor: a(r[700], 0.8),
375
380
  boxShadow: "0 0 0 1.5px hsl(210, 0%, 0%) inset",
376
- backgroundColor: t(r[900], 0.8),
381
+ backgroundColor: a(r[900], 0.8),
377
382
  "&:hover": {
378
383
  borderColor: e[300]
379
384
  },
380
385
  "&.Mui-focusVisible": {
381
386
  borderColor: e[400],
382
- outline: `3px solid ${t(e[500], 0.5)}`,
387
+ outline: `3px solid ${a(e[500], 0.5)}`,
383
388
  outlineOffset: "2px"
384
389
  }
385
390
  })
@@ -449,7 +454,7 @@ const c = l(/* @__PURE__ */ a.jsx("path", {
449
454
  borderColor: r[400]
450
455
  },
451
456
  [`&.${i.focused}`]: {
452
- outline: `3px solid ${t(e[500], 0.5)}`,
457
+ outline: `3px solid ${a(e[500], 0.5)}`,
453
458
  borderColor: e[400]
454
459
  },
455
460
  ...o.applyStyles("dark", {
package/dist/theme/theme-primitives.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { PaletteMode, Shadows } from '@mui/material/styles';
1
+ import { Shadows } from '@mui/material/styles';
2
2
  declare module '@mui/material/Paper' {
3
3
  interface PaperPropsVariantOverrides {
4
4
  highlighted: true;
@@ -83,176 +83,7 @@ export declare const red: {
83
83
  800: string;
84
84
  900: string;
85
85
  };
86
- export declare const getDesignTokens: (mode: PaletteMode) => {
87
- palette: {
88
- mode: PaletteMode;
89
- primary: {
90
- contrastText: string;
91
- light: string;
92
- main: string;
93
- dark: string;
94
- };
95
- info: {
96
- contrastText: string;
97
- light: string;
98
- main: string;
99
- dark: string;
100
- };
101
- warning: {
102
- light: string;
103
- main: string;
104
- dark: string;
105
- };
106
- error: {
107
- light: string;
108
- main: string;
109
- dark: string;
110
- };
111
- success: {
112
- light: string;
113
- main: string;
114
- dark: string;
115
- };
116
- grey: {
117
- 50: string;
118
- 100: string;
119
- 200: string;
120
- 300: string;
121
- 400: string;
122
- 500: string;
123
- 600: string;
124
- 700: string;
125
- 800: string;
126
- 900: string;
127
- };
128
- divider: string;
129
- background: {
130
- default: string;
131
- paper: string;
132
- };
133
- text: {
134
- primary: string;
135
- secondary: string;
136
- warning: string;
137
- };
138
- action: {
139
- hover: string;
140
- selected: string;
141
- };
142
- };
143
- typography: {
144
- fontFamily: string;
145
- h1: {
146
- fontSize: string;
147
- fontWeight: number;
148
- lineHeight: number;
149
- letterSpacing: number;
150
- };
151
- h2: {
152
- fontSize: string;
153
- fontWeight: number;
154
- lineHeight: number;
155
- };
156
- h3: {
157
- fontSize: string;
158
- lineHeight: number;
159
- };
160
- h4: {
161
- fontSize: string;
162
- fontWeight: number;
163
- lineHeight: number;
164
- };
165
- h5: {
166
- fontSize: string;
167
- fontWeight: number;
168
- };
169
- h6: {
170
- fontSize: string;
171
- fontWeight: number;
172
- };
173
- subtitle1: {
174
- fontSize: string;
175
- };
176
- subtitle2: {
177
- fontSize: string;
178
- fontWeight: number;
179
- };
180
- body1: {
181
- fontSize: string;
182
- };
183
- body2: {
184
- fontSize: string;
185
- fontWeight: number;
186
- };
187
- caption: {
188
- fontSize: string;
189
- fontWeight: number;
190
- };
191
- };
192
- shape: {
193
- borderRadius: number;
194
- };
195
- shadows: Shadows;
196
- };
197
86
  export declare const colorSchemes: {
198
- light: {
199
- palette: {
200
- primary: {
201
- light: string;
202
- main: string;
203
- dark: string;
204
- contrastText: string;
205
- };
206
- info: {
207
- light: string;
208
- main: string;
209
- dark: string;
210
- contrastText: string;
211
- };
212
- warning: {
213
- light: string;
214
- main: string;
215
- dark: string;
216
- };
217
- error: {
218
- light: string;
219
- main: string;
220
- dark: string;
221
- };
222
- success: {
223
- light: string;
224
- main: string;
225
- dark: string;
226
- };
227
- grey: {
228
- 50: string;
229
- 100: string;
230
- 200: string;
231
- 300: string;
232
- 400: string;
233
- 500: string;
234
- 600: string;
235
- 700: string;
236
- 800: string;
237
- 900: string;
238
- };
239
- divider: string;
240
- background: {
241
- default: string;
242
- paper: string;
243
- };
244
- text: {
245
- primary: string;
246
- secondary: string;
247
- warning: string;
248
- };
249
- action: {
250
- hover: string;
251
- selected: string;
252
- };
253
- baseShadow: string;
254
- };
255
- };
256
87
  dark: {
257
88
  palette: {
258
89
  primary: {
package/dist/theme/theme-primitives.js CHANGED
@@ -1,5 +1,5 @@
1
- import { b as s, a as r } from "../createTheme-CyFSna1a.js";
2
- const a = s(), n = [...a.shadows], t = {
1
+ import { b as r, a as s } from "../createTheme-CyFSna1a.js";
2
+ const h = r(), t = {
3
3
  50: "hsl(210, 100%, 95%)",
4
4
  100: "hsl(210, 100%, 92%)",
5
5
  200: "hsl(210, 100%, 80%)",
@@ -42,7 +42,7 @@ const a = s(), n = [...a.shadows], t = {
42
42
  700: "hsl(120, 75%, 16%)",
43
43
  800: "hsl(120, 84%, 10%)",
44
44
  900: "hsl(120, 87%, 6%)"
45
- }, h = {
45
+ }, l = {
46
46
  50: "hsl(45, 100%, 97%)",
47
47
  100: "hsl(45, 92%, 90%)",
48
48
  200: "hsl(45, 94%, 80%)",
@@ -53,7 +53,7 @@ const a = s(), n = [...a.shadows], t = {
53
53
  700: "hsl(45, 94%, 20%)",
54
54
  800: "hsl(45, 95%, 16%)",
55
55
  900: "hsl(45, 93%, 12%)"
56
- }, i = {
56
+ }, a = {
57
57
  50: "hsl(0, 100%, 97%)",
58
58
  100: "hsl(0, 92%, 90%)",
59
59
  200: "hsl(0, 94%, 80%)",
@@ -64,190 +64,7 @@ const a = s(), n = [...a.shadows], t = {
64
64
  700: "hsl(0, 94%, 18%)",
65
65
  800: "hsl(0, 95%, 12%)",
66
66
  900: "hsl(0, 93%, 6%)"
67
- }, y = (p) => (n[1] = p === "dark" ? "hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px" : "hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px", {
68
- palette: {
69
- mode: p,
70
- primary: {
71
- light: t[200],
72
- main: t[400],
73
- dark: t[700],
74
- contrastText: t[50],
75
- ...p === "dark" && {
76
- contrastText: t[50],
77
- light: t[300],
78
- main: t[400],
79
- dark: t[700]
80
- }
81
- },
82
- info: {
83
- light: t[100],
84
- main: t[300],
85
- dark: t[600],
86
- contrastText: e[50],
87
- ...p === "dark" && {
88
- contrastText: t[300],
89
- light: t[500],
90
- main: t[700],
91
- dark: t[900]
92
- }
93
- },
94
- warning: {
95
- light: h[300],
96
- main: h[400],
97
- dark: h[800],
98
- ...p === "dark" && {
99
- light: h[400],
100
- main: h[500],
101
- dark: h[700]
102
- }
103
- },
104
- error: {
105
- light: i[300],
106
- main: i[400],
107
- dark: i[800],
108
- ...p === "dark" && {
109
- light: i[400],
110
- main: i[500],
111
- dark: i[700]
112
- }
113
- },
114
- success: {
115
- light: o[300],
116
- main: o[400],
117
- dark: o[800],
118
- ...p === "dark" && {
119
- light: o[400],
120
- main: o[500],
121
- dark: o[700]
122
- }
123
- },
124
- grey: {
125
- ...e
126
- },
127
- divider: p === "dark" ? r(e[700], 0.6) : r(e[300], 0.4),
128
- background: {
129
- default: "hsl(0, 0%, 99%)",
130
- paper: "hsl(220, 35%, 97%)",
131
- ...p === "dark" && { default: e[900], paper: "hsl(220, 30%, 7%)" }
132
- },
133
- text: {
134
- primary: e[800],
135
- secondary: e[600],
136
- warning: h[400],
137
- ...p === "dark" && { primary: "rgb(255, 255, 255)", secondary: e[400] }
138
- },
139
- action: {
140
- hover: r(e[200], 0.2),
141
- selected: `${r(e[200], 0.3)}`,
142
- ...p === "dark" && {
143
- hover: r(e[600], 0.2),
144
- selected: r(e[600], 0.3)
145
- }
146
- }
147
- },
148
- typography: {
149
- fontFamily: "Inter, sans-serif",
150
- h1: {
151
- fontSize: a.typography.pxToRem(48),
152
- fontWeight: 600,
153
- lineHeight: 1.2,
154
- letterSpacing: -0.5
155
- },
156
- h2: {
157
- fontSize: a.typography.pxToRem(36),
158
- fontWeight: 600,
159
- lineHeight: 1.2
160
- },
161
- h3: {
162
- fontSize: a.typography.pxToRem(30),
163
- lineHeight: 1.2
164
- },
165
- h4: {
166
- fontSize: a.typography.pxToRem(24),
167
- fontWeight: 600,
168
- lineHeight: 1.5
169
- },
170
- h5: {
171
- fontSize: a.typography.pxToRem(20),
172
- fontWeight: 600
173
- },
174
- h6: {
175
- fontSize: a.typography.pxToRem(18),
176
- fontWeight: 600
177
- },
178
- subtitle1: {
179
- fontSize: a.typography.pxToRem(18)
180
- },
181
- subtitle2: {
182
- fontSize: a.typography.pxToRem(14),
183
- fontWeight: 500
184
- },
185
- body1: {
186
- fontSize: a.typography.pxToRem(14)
187
- },
188
- body2: {
189
- fontSize: a.typography.pxToRem(14),
190
- fontWeight: 400
191
- },
192
- caption: {
193
- fontSize: a.typography.pxToRem(12),
194
- fontWeight: 400
195
- }
196
- },
197
- shape: {
198
- borderRadius: 8
199
- },
200
- shadows: n
201
- }), x = {
202
- light: {
203
- palette: {
204
- primary: {
205
- light: t[200],
206
- main: t[400],
207
- dark: t[700],
208
- contrastText: t[50]
209
- },
210
- info: {
211
- light: t[100],
212
- main: t[300],
213
- dark: t[600],
214
- contrastText: e[50]
215
- },
216
- warning: {
217
- light: h[300],
218
- main: h[400],
219
- dark: h[800]
220
- },
221
- error: {
222
- light: i[300],
223
- main: i[400],
224
- dark: i[800]
225
- },
226
- success: {
227
- light: o[300],
228
- main: o[400],
229
- dark: o[800]
230
- },
231
- grey: {
232
- ...e
233
- },
234
- divider: r(e[300], 0.4),
235
- background: {
236
- default: "hsl(0, 0%, 99%)",
237
- paper: "hsl(220, 35%, 97%)"
238
- },
239
- text: {
240
- primary: e[800],
241
- secondary: e[600],
242
- warning: h[400]
243
- },
244
- action: {
245
- hover: r(e[200], 0.2),
246
- selected: `${r(e[200], 0.3)}`
247
- },
248
- baseShadow: "hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px"
249
- }
250
- },
67
+ }, i = {
251
68
  dark: {
252
69
  palette: {
253
70
  primary: {
@@ -263,14 +80,14 @@ const a = s(), n = [...a.shadows], t = {
263
80
  dark: t[900]
264
81
  },
265
82
  warning: {
266
- light: h[400],
267
- main: h[500],
268
- dark: h[700]
83
+ light: l[400],
84
+ main: l[500],
85
+ dark: l[700]
269
86
  },
270
87
  error: {
271
- light: i[400],
272
- main: i[500],
273
- dark: i[700]
88
+ light: a[400],
89
+ main: a[500],
90
+ dark: a[700]
274
91
  },
275
92
  success: {
276
93
  light: o[400],
@@ -280,7 +97,7 @@ const a = s(), n = [...a.shadows], t = {
280
97
  grey: {
281
98
  ...e
282
99
  },
283
- divider: r(e[700], 0.6),
100
+ divider: s(e[700], 0.6),
284
101
  background: {
285
102
  default: e[900],
286
103
  paper: "hsl(220, 30%, 7%)"
@@ -290,72 +107,71 @@ const a = s(), n = [...a.shadows], t = {
290
107
  secondary: e[400]
291
108
  },
292
109
  action: {
293
- hover: r(e[600], 0.2),
294
- selected: r(e[600], 0.3)
110
+ hover: s(e[600], 0.2),
111
+ selected: s(e[600], 0.3)
295
112
  },
296
113
  baseShadow: "hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px"
297
114
  }
298
115
  }
299
- }, d = {
300
- fontFamily: "Inter, sans-serif",
116
+ }, g = {
117
+ fontFamily: "Outfit, sans-serif",
301
118
  h1: {
302
- fontSize: a.typography.pxToRem(48),
119
+ fontSize: h.typography.pxToRem(48),
303
120
  fontWeight: 600,
304
121
  lineHeight: 1.2,
305
122
  letterSpacing: -0.5
306
123
  },
307
124
  h2: {
308
- fontSize: a.typography.pxToRem(36),
125
+ fontSize: h.typography.pxToRem(36),
309
126
  fontWeight: 600,
310
127
  lineHeight: 1.2
311
128
  },
312
129
  h3: {
313
- fontSize: a.typography.pxToRem(30),
130
+ fontSize: h.typography.pxToRem(30),
314
131
  lineHeight: 1.2
315
132
  },
316
133
  h4: {
317
- fontSize: a.typography.pxToRem(24),
134
+ fontSize: h.typography.pxToRem(24),
318
135
  fontWeight: 600,
319
136
  lineHeight: 1.5
320
137
  },
321
138
  h5: {
322
- fontSize: a.typography.pxToRem(20),
139
+ fontSize: h.typography.pxToRem(20),
323
140
  fontWeight: 600
324
141
  },
325
142
  h6: {
326
- fontSize: a.typography.pxToRem(18),
143
+ fontSize: h.typography.pxToRem(18),
327
144
  fontWeight: 600
328
145
  },
329
146
  subtitle1: {
330
- fontSize: a.typography.pxToRem(18)
147
+ fontSize: h.typography.pxToRem(18)
331
148
  },
332
149
  subtitle2: {
333
- fontSize: a.typography.pxToRem(14),
150
+ fontSize: h.typography.pxToRem(14),
334
151
  fontWeight: 500
335
152
  },
336
153
  body1: {
337
- fontSize: a.typography.pxToRem(14)
154
+ fontSize: h.typography.pxToRem(14)
338
155
  },
339
156
  body2: {
340
- fontSize: a.typography.pxToRem(14),
157
+ fontSize: h.typography.pxToRem(14),
341
158
  fontWeight: 400
342
159
  },
343
160
  caption: {
344
- fontSize: a.typography.pxToRem(12),
161
+ fontSize: h.typography.pxToRem(12),
345
162
  fontWeight: 400
346
163
  }
347
- }, f = {
164
+ }, y = {
348
165
  borderRadius: 8
349
- }, l = ["none", "var(--s-palette-baseShadow)", ...a.shadows.slice(2)], c = l;
166
+ }, n = ["none", "var(--s-palette-baseShadow)", ...h.shadows.slice(2)], f = n;
350
167
  export {
351
168
  t as brand,
352
- x as colorSchemes,
353
- y as getDesignTokens,
169
+ i as colorSchemes,
354
170
  e as gray,
355
171
  o as green,
356
- h as orange,
357
- i as red,
358
- c as shadows,
359
- f as shape,
360
- d as typography
172
+ l as orange,
173
+ a as red,
174
+ f as shadows,
175
+ y as shape,
176
+ g as typography
361
177
  };
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "registry": "https://registry.npmjs.org"
5
5
  },
6
- "version": "1.0.48",
6
+ "version": "1.0.50",
7
7
  "description": "advanced ui kit for solostylist",
8
8
  "private": false,
9
9
  "type": "module",
@@ -34,6 +34,8 @@
34
34
  "@mui/lab": "7.0.0-beta.13",
35
35
  "@mui/material": "^7.0.2",
36
36
  "@mui/utils": "^7.0.2",
37
+ "@stripe/react-stripe-js": "^3.7.0",
38
+ "@stripe/stripe-js": "^7.3.1",
37
39
  "@tabler/icons-react": "^3.34.0",
38
40
  "@tiptap/extension-link": "^2.11.9",
39
41
  "@tiptap/extension-placeholder": "^2.11.9",
@@ -48,8 +50,7 @@
48
50
  "react-i18next": "^15.5.1",
49
51
  "react-image-gallery": "^1.4.0",
50
52
  "uuid": "^11.1.0",
51
- "@stripe/react-stripe-js": "^3.7.0",
52
- "@stripe/stripe-js": "^7.3.1"
53
+ "@fontsource/outfit": "^5.2.6"
53
54
  },
54
55
  "devDependencies": {
55
56
  "@ianvs/prettier-plugin-sort-imports": "^4.4.2",