jcicl 1.0.9 → 1.0.11

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.
package/Button/Button.js CHANGED
@@ -1,39 +1,42 @@
1
- import { jsxs as _, jsx as i } from "react/jsx-runtime";
2
- import * as S from "react";
3
- import { g as A, a as q, s, r as J, c as p, j as K, u as Q, b as R, P as t, d as X, e as $ } from "../.chunks/DefaultPropsProvider.js";
4
- import { m as Y } from "../.chunks/memoTheme.js";
5
- import { c as Z } from "../.chunks/createSimplePaletteValueFilter.js";
6
- import { B as h } from "../.chunks/ButtonBase.js";
7
- import { i as oo } from "../.chunks/emotion-styled.browser.esm.js";
1
+ import { jsxs as I, jsx as i } from "react/jsx-runtime";
2
+ import * as w from "react";
3
+ import { useState as q } from "react";
4
+ import { g as J, a as K, s, r as Q, c as p, h as X, u as Y, b as P, P as r, d as Z, e as $ } from "../.chunks/DefaultPropsProvider.js";
5
+ import { m as oo } from "../.chunks/memoTheme.js";
6
+ import { c as to } from "../.chunks/createSimplePaletteValueFilter.js";
7
+ import { B as O } from "../.chunks/ButtonBase.js";
8
+ import { i as ro } from "../.chunks/emotion-styled.browser.esm.js";
8
9
  import { c as v } from "../.chunks/emotion-react.browser.esm.js";
9
- import r from "../theme.js";
10
- function ro(o) {
11
- return A("MuiButton", o);
10
+ import t from "../theme.js";
11
+ import { Tooltip as ao } from "../Tooltip/Tooltip.js";
12
+ import { C as eo } from "../.chunks/check.js";
13
+ function no(o) {
14
+ return J("MuiButton", o);
12
15
  }
13
- const g = q("MuiButton", ["root", "text", "textInherit", "textPrimary", "textSecondary", "textSuccess", "textError", "textInfo", "textWarning", "outlined", "outlinedInherit", "outlinedPrimary", "outlinedSecondary", "outlinedSuccess", "outlinedError", "outlinedInfo", "outlinedWarning", "contained", "containedInherit", "containedPrimary", "containedSecondary", "containedSuccess", "containedError", "containedInfo", "containedWarning", "disableElevation", "focusVisible", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorSuccess", "colorError", "colorInfo", "colorWarning", "textSizeSmall", "textSizeMedium", "textSizeLarge", "outlinedSizeSmall", "outlinedSizeMedium", "outlinedSizeLarge", "containedSizeSmall", "containedSizeMedium", "containedSizeLarge", "sizeMedium", "sizeSmall", "sizeLarge", "fullWidth", "startIcon", "endIcon", "icon", "iconSizeSmall", "iconSizeMedium", "iconSizeLarge"]), E = /* @__PURE__ */ S.createContext({});
14
- process.env.NODE_ENV !== "production" && (E.displayName = "ButtonGroupContext");
15
- const T = /* @__PURE__ */ S.createContext(void 0);
16
- process.env.NODE_ENV !== "production" && (T.displayName = "ButtonGroupButtonContext");
17
- const to = (o) => {
16
+ const g = K("MuiButton", ["root", "text", "textInherit", "textPrimary", "textSecondary", "textSuccess", "textError", "textInfo", "textWarning", "outlined", "outlinedInherit", "outlinedPrimary", "outlinedSecondary", "outlinedSuccess", "outlinedError", "outlinedInfo", "outlinedWarning", "contained", "containedInherit", "containedPrimary", "containedSecondary", "containedSuccess", "containedError", "containedInfo", "containedWarning", "disableElevation", "focusVisible", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorSuccess", "colorError", "colorInfo", "colorWarning", "textSizeSmall", "textSizeMedium", "textSizeLarge", "outlinedSizeSmall", "outlinedSizeMedium", "outlinedSizeLarge", "containedSizeSmall", "containedSizeMedium", "containedSizeLarge", "sizeMedium", "sizeSmall", "sizeLarge", "fullWidth", "startIcon", "endIcon", "icon", "iconSizeSmall", "iconSizeMedium", "iconSizeLarge"]), W = /* @__PURE__ */ w.createContext({});
17
+ process.env.NODE_ENV !== "production" && (W.displayName = "ButtonGroupContext");
18
+ const j = /* @__PURE__ */ w.createContext(void 0);
19
+ process.env.NODE_ENV !== "production" && (j.displayName = "ButtonGroupButtonContext");
20
+ const io = (o) => {
18
21
  const {
19
22
  color: a,
20
- disableElevation: n,
21
- fullWidth: e,
23
+ disableElevation: e,
24
+ fullWidth: n,
22
25
  size: d,
23
26
  variant: u,
24
27
  classes: b
25
28
  } = o, x = {
26
- root: ["root", u, `${u}${p(a)}`, `size${p(d)}`, `${u}Size${p(d)}`, `color${p(a)}`, n && "disableElevation", e && "fullWidth"],
29
+ root: ["root", u, `${u}${p(a)}`, `size${p(d)}`, `${u}Size${p(d)}`, `color${p(a)}`, e && "disableElevation", n && "fullWidth"],
27
30
  label: ["label"],
28
31
  startIcon: ["icon", "startIcon", `iconSize${p(d)}`],
29
32
  endIcon: ["icon", "endIcon", `iconSize${p(d)}`]
30
- }, f = X(x, ro, b);
33
+ }, f = Z(x, no, b);
31
34
  return {
32
35
  ...b,
33
36
  // forward the focused, disabled, etc. classes to the ButtonBase
34
37
  ...f
35
38
  };
36
- }, P = [{
39
+ }, V = [{
37
40
  props: {
38
41
  size: "small"
39
42
  },
@@ -60,20 +63,20 @@ const to = (o) => {
60
63
  fontSize: 22
61
64
  }
62
65
  }
63
- }], ao = s(h, {
64
- shouldForwardProp: (o) => J(o) || o === "classes",
66
+ }], so = s(O, {
67
+ shouldForwardProp: (o) => Q(o) || o === "classes",
65
68
  name: "MuiButton",
66
69
  slot: "Root",
67
70
  overridesResolver: (o, a) => {
68
71
  const {
69
- ownerState: n
72
+ ownerState: e
70
73
  } = o;
71
- return [a.root, a[n.variant], a[`${n.variant}${p(n.color)}`], a[`size${p(n.size)}`], a[`${n.variant}Size${p(n.size)}`], n.color === "inherit" && a.colorInherit, n.disableElevation && a.disableElevation, n.fullWidth && a.fullWidth];
74
+ return [a.root, a[e.variant], a[`${e.variant}${p(e.color)}`], a[`size${p(e.size)}`], a[`${e.variant}Size${p(e.size)}`], e.color === "inherit" && a.colorInherit, e.disableElevation && a.disableElevation, e.fullWidth && a.fullWidth];
72
75
  }
73
- })(Y(({
76
+ })(oo(({
74
77
  theme: o
75
78
  }) => {
76
- const a = o.palette.mode === "light" ? o.palette.grey[300] : o.palette.grey[800], n = o.palette.mode === "light" ? o.palette.grey.A100 : o.palette.grey[700];
79
+ const a = o.palette.mode === "light" ? o.palette.grey[300] : o.palette.grey[800], e = o.palette.mode === "light" ? o.palette.grey.A100 : o.palette.grey[700];
77
80
  return {
78
81
  ...o.typography.button,
79
82
  minWidth: 64,
@@ -139,22 +142,22 @@ const to = (o) => {
139
142
  color: "var(--variant-textColor)",
140
143
  backgroundColor: "var(--variant-textBg)"
141
144
  }
142
- }, ...Object.entries(o.palette).filter(Z()).map(([e]) => ({
145
+ }, ...Object.entries(o.palette).filter(to()).map(([n]) => ({
143
146
  props: {
144
- color: e
147
+ color: n
145
148
  },
146
149
  style: {
147
- "--variant-textColor": (o.vars || o).palette[e].main,
148
- "--variant-outlinedColor": (o.vars || o).palette[e].main,
149
- "--variant-outlinedBorder": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / 0.5)` : $(o.palette[e].main, 0.5),
150
- "--variant-containedColor": (o.vars || o).palette[e].contrastText,
151
- "--variant-containedBg": (o.vars || o).palette[e].main,
150
+ "--variant-textColor": (o.vars || o).palette[n].main,
151
+ "--variant-outlinedColor": (o.vars || o).palette[n].main,
152
+ "--variant-outlinedBorder": o.vars ? `rgba(${o.vars.palette[n].mainChannel} / 0.5)` : $(o.palette[n].main, 0.5),
153
+ "--variant-containedColor": (o.vars || o).palette[n].contrastText,
154
+ "--variant-containedBg": (o.vars || o).palette[n].main,
152
155
  "@media (hover: hover)": {
153
156
  "&:hover": {
154
- "--variant-containedBg": (o.vars || o).palette[e].dark,
155
- "--variant-textBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[e].main, o.palette.action.hoverOpacity),
156
- "--variant-outlinedBorder": (o.vars || o).palette[e].main,
157
- "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[e].main, o.palette.action.hoverOpacity)
157
+ "--variant-containedBg": (o.vars || o).palette[n].dark,
158
+ "--variant-textBg": o.vars ? `rgba(${o.vars.palette[n].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[n].main, o.palette.action.hoverOpacity),
159
+ "--variant-outlinedBorder": (o.vars || o).palette[n].main,
160
+ "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette[n].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[n].main, o.palette.action.hoverOpacity)
158
161
  }
159
162
  }
160
163
  }
@@ -168,7 +171,7 @@ const to = (o) => {
168
171
  "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedBg : a,
169
172
  "@media (hover: hover)": {
170
173
  "&:hover": {
171
- "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedHoverBg : n,
174
+ "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedHoverBg : e,
172
175
  "--variant-textBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette.text.primary, o.palette.action.hoverOpacity),
173
176
  "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette.text.primary, o.palette.action.hoverOpacity)
174
177
  }
@@ -256,14 +259,14 @@ const to = (o) => {
256
259
  }
257
260
  }]
258
261
  };
259
- })), no = s("span", {
262
+ })), lo = s("span", {
260
263
  name: "MuiButton",
261
264
  slot: "StartIcon",
262
265
  overridesResolver: (o, a) => {
263
266
  const {
264
- ownerState: n
267
+ ownerState: e
265
268
  } = o;
266
- return [a.startIcon, a[`iconSize${p(n.size)}`]];
269
+ return [a.startIcon, a[`iconSize${p(e.size)}`]];
267
270
  }
268
271
  })({
269
272
  display: "inherit",
@@ -276,15 +279,15 @@ const to = (o) => {
276
279
  style: {
277
280
  marginLeft: -2
278
281
  }
279
- }, ...P]
280
- }), eo = s("span", {
282
+ }, ...V]
283
+ }), co = s("span", {
281
284
  name: "MuiButton",
282
285
  slot: "EndIcon",
283
286
  overridesResolver: (o, a) => {
284
287
  const {
285
- ownerState: n
288
+ ownerState: e
286
289
  } = o;
287
- return [a.endIcon, a[`iconSize${p(n.size)}`]];
290
+ return [a.endIcon, a[`iconSize${p(e.size)}`]];
288
291
  }
289
292
  })({
290
293
  display: "inherit",
@@ -297,62 +300,62 @@ const to = (o) => {
297
300
  style: {
298
301
  marginRight: -2
299
302
  }
300
- }, ...P]
301
- }), j = /* @__PURE__ */ S.forwardRef(function(a, n) {
302
- const e = S.useContext(E), d = S.useContext(T), u = K(e, a), b = Q({
303
+ }, ...V]
304
+ }), F = /* @__PURE__ */ w.forwardRef(function(a, e) {
305
+ const n = w.useContext(W), d = w.useContext(j), u = X(n, a), b = Y({
303
306
  props: u,
304
307
  name: "MuiButton"
305
308
  }), {
306
309
  children: x,
307
310
  color: f = "primary",
308
311
  component: l = "button",
309
- className: m,
310
- disabled: c = !1,
311
- disableElevation: C = !1,
312
- disableFocusRipple: k = !1,
313
- endIcon: I,
314
- focusVisibleClassName: V,
315
- fullWidth: M = !1,
316
- size: F = "medium",
317
- startIcon: O,
318
- type: N,
319
- variant: G = "text",
320
- ...L
321
- } = b, w = {
312
+ className: z,
313
+ disabled: B = !1,
314
+ disableElevation: c = !1,
315
+ disableFocusRipple: y = !1,
316
+ endIcon: m,
317
+ focusVisibleClassName: R,
318
+ fullWidth: k = !1,
319
+ size: L = "medium",
320
+ startIcon: T,
321
+ type: E,
322
+ variant: H = "text",
323
+ ...D
324
+ } = b, C = {
322
325
  ...b,
323
326
  color: f,
324
327
  component: l,
325
- disabled: c,
326
- disableElevation: C,
327
- disableFocusRipple: k,
328
- fullWidth: M,
329
- size: F,
330
- type: N,
331
- variant: G
332
- }, y = to(w), H = O && /* @__PURE__ */ i(no, {
333
- className: y.startIcon,
334
- ownerState: w,
335
- children: O
336
- }), D = I && /* @__PURE__ */ i(eo, {
337
- className: y.endIcon,
338
- ownerState: w,
339
- children: I
340
- }), U = d || "";
341
- return /* @__PURE__ */ _(ao, {
342
- ownerState: w,
343
- className: R(e.className, y.root, m, U),
328
+ disabled: B,
329
+ disableElevation: c,
330
+ disableFocusRipple: y,
331
+ fullWidth: k,
332
+ size: L,
333
+ type: E,
334
+ variant: H
335
+ }, h = io(C), U = T && /* @__PURE__ */ i(lo, {
336
+ className: h.startIcon,
337
+ ownerState: C,
338
+ children: T
339
+ }), _ = m && /* @__PURE__ */ i(co, {
340
+ className: h.endIcon,
341
+ ownerState: C,
342
+ children: m
343
+ }), A = d || "";
344
+ return /* @__PURE__ */ I(so, {
345
+ ownerState: C,
346
+ className: P(n.className, h.root, z, A),
344
347
  component: l,
345
- disabled: c,
346
- focusRipple: !k,
347
- focusVisibleClassName: R(y.focusVisible, V),
348
- ref: n,
349
- type: N,
350
- ...L,
351
- classes: y,
352
- children: [H, x, D]
348
+ disabled: B,
349
+ focusRipple: !y,
350
+ focusVisibleClassName: P(h.focusVisible, R),
351
+ ref: e,
352
+ type: E,
353
+ ...D,
354
+ classes: h,
355
+ children: [U, x, _]
353
356
  });
354
357
  });
355
- process.env.NODE_ENV !== "production" && (j.propTypes = {
358
+ process.env.NODE_ENV !== "production" && (F.propTypes = {
356
359
  // ┌────────────────────────────── Warning ──────────────────────────────┐
357
360
  // │ These PropTypes are generated from the TypeScript type definitions. │
358
361
  // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
@@ -360,42 +363,42 @@ process.env.NODE_ENV !== "production" && (j.propTypes = {
360
363
  /**
361
364
  * The content of the component.
362
365
  */
363
- children: t.node,
366
+ children: r.node,
364
367
  /**
365
368
  * Override or extend the styles applied to the component.
366
369
  */
367
- classes: t.object,
370
+ classes: r.object,
368
371
  /**
369
372
  * @ignore
370
373
  */
371
- className: t.string,
374
+ className: r.string,
372
375
  /**
373
376
  * The color of the component.
374
377
  * It supports both default and custom theme colors, which can be added as shown in the
375
378
  * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
376
379
  * @default 'primary'
377
380
  */
378
- color: t.oneOfType([t.oneOf(["inherit", "primary", "secondary", "success", "error", "info", "warning"]), t.string]),
381
+ color: r.oneOfType([r.oneOf(["inherit", "primary", "secondary", "success", "error", "info", "warning"]), r.string]),
379
382
  /**
380
383
  * The component used for the root node.
381
384
  * Either a string to use a HTML element or a component.
382
385
  */
383
- component: t.elementType,
386
+ component: r.elementType,
384
387
  /**
385
388
  * If `true`, the component is disabled.
386
389
  * @default false
387
390
  */
388
- disabled: t.bool,
391
+ disabled: r.bool,
389
392
  /**
390
393
  * If `true`, no elevation is used.
391
394
  * @default false
392
395
  */
393
- disableElevation: t.bool,
396
+ disableElevation: r.bool,
394
397
  /**
395
398
  * If `true`, the keyboard focus ripple is disabled.
396
399
  * @default false
397
400
  */
398
- disableFocusRipple: t.bool,
401
+ disableFocusRipple: r.bool,
399
402
  /**
400
403
  * If `true`, the ripple effect is disabled.
401
404
  *
@@ -403,61 +406,61 @@ process.env.NODE_ENV !== "production" && (j.propTypes = {
403
406
  * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
404
407
  * @default false
405
408
  */
406
- disableRipple: t.bool,
409
+ disableRipple: r.bool,
407
410
  /**
408
411
  * Element placed after the children.
409
412
  */
410
- endIcon: t.node,
413
+ endIcon: r.node,
411
414
  /**
412
415
  * @ignore
413
416
  */
414
- focusVisibleClassName: t.string,
417
+ focusVisibleClassName: r.string,
415
418
  /**
416
419
  * If `true`, the button will take up the full width of its container.
417
420
  * @default false
418
421
  */
419
- fullWidth: t.bool,
422
+ fullWidth: r.bool,
420
423
  /**
421
424
  * The URL to link to when the button is clicked.
422
425
  * If defined, an `a` element will be used as the root node.
423
426
  */
424
- href: t.string,
427
+ href: r.string,
425
428
  /**
426
429
  * The size of the component.
427
430
  * `small` is equivalent to the dense button styling.
428
431
  * @default 'medium'
429
432
  */
430
- size: t.oneOfType([t.oneOf(["small", "medium", "large"]), t.string]),
433
+ size: r.oneOfType([r.oneOf(["small", "medium", "large"]), r.string]),
431
434
  /**
432
435
  * Element placed before the children.
433
436
  */
434
- startIcon: t.node,
437
+ startIcon: r.node,
435
438
  /**
436
439
  * The system prop that allows defining system overrides as well as additional CSS styles.
437
440
  */
438
- sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
441
+ sx: r.oneOfType([r.arrayOf(r.oneOfType([r.func, r.object, r.bool])), r.func, r.object]),
439
442
  /**
440
443
  * @ignore
441
444
  */
442
- type: t.oneOfType([t.oneOf(["button", "reset", "submit"]), t.string]),
445
+ type: r.oneOfType([r.oneOf(["button", "reset", "submit"]), r.string]),
443
446
  /**
444
447
  * The variant to use.
445
448
  * @default 'text'
446
449
  */
447
- variant: t.oneOfType([t.oneOf(["contained", "outlined", "text"]), t.string])
450
+ variant: r.oneOfType([r.oneOf(["contained", "outlined", "text"]), r.string])
448
451
  });
449
- const W = [
452
+ const M = [
450
453
  "active",
451
454
  "customBackgroundColor",
452
455
  "customHoverColor",
453
456
  "customTextColor",
454
457
  "customShadow1",
455
458
  "customShadow2"
456
- ], B = s(j, { shouldForwardProp: (o) => !W.includes(o) })`
459
+ ], S = s(F, { shouldForwardProp: (o) => !M.includes(o) })`
457
460
  text-transform: none;
458
461
  &:disabled {
459
462
  opacity: 0.5;
460
- color: ${r.colors.black};
463
+ color: ${t.colors.black};
461
464
  display: flex;
462
465
  justify-content: center;
463
466
  align-items: center;
@@ -466,47 +469,47 @@ const W = [
466
469
  span {
467
470
  align-items: center !important;
468
471
  }
469
- `, io = s(B)`
470
- background-color: ${r.colors.green};
472
+ `, po = s(S)`
473
+ background-color: ${t.colors.green};
471
474
  height: 2.5rem;
472
475
  border: 2px solid transparent;
473
- color: ${r.colors.white};
476
+ color: ${t.colors.white};
474
477
  transition: 313ms all ease-in;
475
478
  border-radius: 32px;
476
479
  font-weight: 400;
477
480
  padding: 0.75rem 2rem;
478
481
  font-size: 1rem;
479
- box-shadow: ${r.boxShadows.gray63};
482
+ box-shadow: ${t.boxShadows.gray63};
480
483
  &:hover,
481
484
  :focus-visible {
482
- background-color: ${r.colors.darkGreen};
483
- box-shadow: ${r.boxShadows.black63};
485
+ background-color: ${t.colors.darkGreen};
486
+ box-shadow: ${t.boxShadows.black63};
484
487
  }
485
488
  &:disabled {
486
- background-color: ${r.colors.darkGreen};
489
+ background-color: ${t.colors.darkGreen};
487
490
  }
488
- `, so = s(B, {
489
- shouldForwardProp: (o) => !W.includes(o)
491
+ `, uo = s(S, {
492
+ shouldForwardProp: (o) => !M.includes(o)
490
493
  })(
491
494
  ({
492
- customBackgroundColor: o = r.colors.green,
493
- customHoverColor: a = r.colors.darkGreen,
494
- customTextColor: n = r.colors.white,
495
- customShadow1: e = r.boxShadows.gray63,
496
- customShadow2: d = r.boxShadows.black63
495
+ customBackgroundColor: o = t.colors.green,
496
+ customHoverColor: a = t.colors.darkGreen,
497
+ customTextColor: e = t.colors.white,
498
+ customShadow1: n = t.boxShadows.gray63,
499
+ customShadow2: d = t.boxShadows.black63
497
500
  }) => ({
498
501
  ...v`
499
502
  background-color: ${o};
500
503
  border-radius: 0;
501
504
  height: 2.5rem;
502
505
  border: 2px solid transparent;
503
- color: ${n};
506
+ color: ${e};
504
507
  transition: 313ms all ease-in;
505
508
  border-radius: 32px;
506
509
  font-weight: 400;
507
510
  padding: 0.75rem 2rem;
508
511
  font-size: 1rem;
509
- box-shadow: ${e};
512
+ box-shadow: ${n};
510
513
  &:hover,
511
514
  :focus-visible {
512
515
  background-color: ${a};
@@ -517,70 +520,89 @@ const W = [
517
520
  }
518
521
  `
519
522
  })
520
- ), lo = s(B)`
521
- background-color: ${r.colors.gold};
523
+ ), bo = s(S)`
524
+ background-color: ${t.colors.gold};
522
525
  height: 2.5rem;
523
526
  border: 2px solid transparent;
524
- color: ${r.colors.midnight};
527
+ color: ${t.colors.midnight};
525
528
  transition: 313ms all ease-in;
526
529
  border-radius: 32px;
527
530
  font-weight: 400;
528
531
  padding: 0.75rem 2rem;
529
532
  font-size: 1rem;
530
- box-shadow: ${r.boxShadows.gray63};
533
+ box-shadow: ${t.boxShadows.gray63};
531
534
  &:hover,
532
535
  :focus-visible {
533
- background-color: ${r.colors.goldHover};
534
- box-shadow: ${r.boxShadows.gray63};
536
+ background-color: ${t.colors.goldHover};
537
+ box-shadow: ${t.boxShadows.gray63};
535
538
  }
536
539
  &:disabled {
537
- background-color: ${r.colors.goldHover};
540
+ background-color: ${t.colors.goldHover};
538
541
  }
539
- `, z = s(B)(({ width: o = "114px" }) => ({
542
+ `, N = s(S)(({ width: o = "114px" }) => ({
540
543
  ...v`
541
544
  box-sizing: border-box;
542
- background-color: ${r.colors.bibiBlue};
545
+ background-color: ${t.colors.bibiBlue};
543
546
  border-radius: 0;
544
547
  height: 47px;
545
548
  width: ${o};
546
549
  border: 2px solid transparent;
547
- color: ${r.colors.white};
550
+ color: ${t.colors.white};
548
551
  transition: 108ms all ease-in;
549
552
  font-weight: 500;
550
553
  padding: 0;
551
554
  font-size: 19px;
552
555
  &:hover,
553
556
  :focus-visible {
554
- background-color: ${r.colors.bibiBlueHover};
557
+ background-color: ${t.colors.bibiBlueHover};
555
558
  }
556
559
  `
557
- })), co = s(z)(({ active: o }) => ({
560
+ })), go = s(N)(({ active: o }) => ({
558
561
  ...v`
559
- background-color: ${o && r.colors.white};
560
- color: ${o && r.colors.bibiBlue};
562
+ background-color: ${o && t.colors.white};
563
+ color: ${o && t.colors.bibiBlue};
561
564
  &:hover,
562
565
  :focus-visible {
563
- background-color: ${r.colors.white};
564
- color: ${r.colors.bibiBlue};
566
+ background-color: ${t.colors.white};
567
+ color: ${t.colors.bibiBlue};
565
568
  }
566
569
  `
567
- })), po = s(z)(() => ({
570
+ })), vo = s(N)(() => ({
568
571
  ...v`
569
- background-color: ${r.colors.white};
570
- color: ${r.colors.bibiBlue};
572
+ background-color: ${t.colors.white};
573
+ color: ${t.colors.bibiBlue};
571
574
  &:hover,
572
575
  :focus-visible {
573
- background-color: ${r.colors.bibiBlue};
574
- border: 2px solid ${r.colors.white};
575
- color: ${r.colors.white};
576
+ background-color: ${t.colors.bibiBlue};
577
+ border: 2px solid ${t.colors.white};
578
+ color: ${t.colors.white};
576
579
  }
577
580
  `
578
- })), uo = s(h)`
581
+ })), G = s(O)`
579
582
  display: block;
580
- `, bo = s(h, {
581
- shouldForwardProp: (o) => typeof o == "string" && oo(o)
583
+ `, xo = s(G)`
584
+ font-family: inherit;
585
+ font-size: inherit;
586
+ font-weight: inherit;
587
+ `, fo = s("div")`
588
+ display: flex;
589
+ .isCopied {
590
+ color: ${t.colors.gray};
591
+ display: inline;
592
+ margin-left: 8px;
593
+ font-size: smaller;
594
+ align-content: center;
595
+ }
596
+ .isCopied > svg {
597
+ vertical-align: middle;
598
+ height: 14px !important;
599
+ width: 14px !important;
600
+ margin: 0;
601
+ }
602
+ `, yo = s(O, {
603
+ shouldForwardProp: (o) => typeof o == "string" && ro(o)
582
604
  })(
583
- ({ size: o, color: a, highlightColor: n, hoverColor: e }) => ({
605
+ ({ size: o, color: a, highlightColor: e, hoverColor: n }) => ({
584
606
  ...v`
585
607
  display: flex;
586
608
  align-items: center;
@@ -591,9 +613,9 @@ const W = [
591
613
  &:hover,
592
614
  :focus-visible {
593
615
  svg {
594
- filter: drop-shadow(0 0 6px ${n}) drop-shadow(0 0 6px ${n})
595
- drop-shadow(0 0 6px ${n}) drop-shadow(0 0 6px ${n});
596
- fill: ${e || a};
616
+ filter: drop-shadow(0 0 6px ${e}) drop-shadow(0 0 6px ${e})
617
+ drop-shadow(0 0 6px ${e}) drop-shadow(0 0 6px ${e});
618
+ fill: ${n || a};
597
619
  }
598
620
  }
599
621
 
@@ -605,52 +627,81 @@ const W = [
605
627
  }
606
628
  `
607
629
  })
608
- ), go = s(B)(({ active: o }) => ({
630
+ ), mo = s(S)(({ active: o }) => ({
609
631
  ...v`
610
632
  box-sizing: border-box;
611
- background-color: ${o ? r.colors.black : r.colors.white};
633
+ background-color: ${o ? t.colors.black : t.colors.white};
612
634
  height: 28px;
613
635
  border-radius: 18px;
614
636
  display: flex;
615
637
  align-items: center;
616
638
  justify-content: center;
617
- border: 2px solid ${o ? "transparent" : r.colors.black};
618
- color: ${o ? r.colors.white : r.colors.black};
639
+ border: 2px solid ${o ? "transparent" : t.colors.black};
640
+ color: ${o ? t.colors.white : t.colors.black};
619
641
  transition: 108ms all ease-in;
620
642
  font-weight: 500;
621
643
 
622
644
  &:hover,
623
645
  :focus-visible {
624
- background-color: ${o ? r.colors.charcoal : r.colors.gray2};
646
+ background-color: ${o ? t.colors.charcoal : t.colors.gray2};
625
647
  }
626
648
  `
627
- })), mo = ({
649
+ })), Ro = ({
628
650
  variant: o = 1,
629
651
  size: a = 50,
630
- color: n = r.colors.darkGreen,
631
- highlightColor: e = r.colors.dandelion,
632
- hoverColor: d = r.colors.green,
633
- backgroundColor: u = r.colors.darkGreen,
634
- textColor: b = r.colors.white,
635
- customShadow1: x = r.boxShadows.gray63,
636
- customShadow2: f = r.boxShadows.black63,
652
+ color: e = t.colors.darkGreen,
653
+ highlightColor: n = t.colors.dandelion,
654
+ hoverColor: d = t.colors.green,
655
+ backgroundColor: u = t.colors.darkGreen,
656
+ textColor: b = t.colors.white,
657
+ customShadow1: x = t.boxShadows.gray63,
658
+ customShadow2: f = t.boxShadows.black63,
637
659
  children: l,
638
- active: m,
660
+ textToCopy: z,
661
+ active: B,
639
662
  ...c
640
- }) => o === "custom" ? /* @__PURE__ */ i(
641
- so,
642
- {
643
- customBackgroundColor: u,
644
- customHoverColor: d,
645
- customTextColor: b,
646
- customShadow1: x,
647
- customShadow2: f,
648
- className: "jcCustomButton",
649
- ...c,
650
- children: l
663
+ }) => {
664
+ if (o === "custom")
665
+ return /* @__PURE__ */ i(
666
+ uo,
667
+ {
668
+ customBackgroundColor: u,
669
+ customHoverColor: d,
670
+ customTextColor: b,
671
+ customShadow1: x,
672
+ customShadow2: f,
673
+ className: "jcCustomButton",
674
+ ...c,
675
+ children: l
676
+ }
677
+ );
678
+ if (o === "bibi")
679
+ return /* @__PURE__ */ i(N, { ...c, children: l });
680
+ if (o === "bibiOutlined")
681
+ return /* @__PURE__ */ i(go, { ...c, children: l });
682
+ if (o === "bibiInverse")
683
+ return /* @__PURE__ */ i(vo, { ...c, children: l });
684
+ if (o === "unstyled")
685
+ return /* @__PURE__ */ i(G, { ...c, children: l });
686
+ if (o === "copy") {
687
+ const [y, m] = q(!1);
688
+ return /* @__PURE__ */ I(fo, { onClick: async () => {
689
+ try {
690
+ await navigator.clipboard.writeText(z || String(l)), m(!0), setTimeout(() => m(!1), 1100);
691
+ } catch (k) {
692
+ console.error("Failed to copy text: ", k);
693
+ }
694
+ }, children: [
695
+ /* @__PURE__ */ i(ao, { title: "Copy to clipboard", children: /* @__PURE__ */ i(xo, { ...c, children: l }) }),
696
+ y && /* @__PURE__ */ I("span", { className: "isCopied", children: [
697
+ /* @__PURE__ */ i(eo, { size: 12 }),
698
+ " Copied"
699
+ ] })
700
+ ] });
651
701
  }
652
- ) : o === "bibi" ? /* @__PURE__ */ i(z, { ...c, children: l }) : o === "bibiOutlined" ? /* @__PURE__ */ i(co, { ...c, children: l }) : o === "bibiInverse" ? /* @__PURE__ */ i(po, { ...c, children: l }) : o === "unstyled" ? /* @__PURE__ */ i(uo, { ...c, children: l }) : o === 2 ? /* @__PURE__ */ i(lo, { ...c, children: /* @__PURE__ */ i("span", { children: l }) }) : o === "icon" ? /* @__PURE__ */ i(bo, { className: "jcIconButton", ...{ size: a, color: n, highlightColor: e, hoverColor: d }, ...c, children: l }) : o === "filter" ? /* @__PURE__ */ i(go, { className: "jcFilterButton", active: m, ...c, children: l }) : /* @__PURE__ */ i(io, { ...c, children: /* @__PURE__ */ i("span", { children: l }) });
702
+ return o === 2 ? /* @__PURE__ */ i(bo, { ...c, children: /* @__PURE__ */ i("span", { children: l }) }) : o === "icon" ? /* @__PURE__ */ i(yo, { className: "jcIconButton", ...{ size: a, color: e, highlightColor: n, hoverColor: d }, ...c, children: l }) : o === "filter" ? /* @__PURE__ */ i(mo, { className: "jcFilterButton", active: B, ...c, children: l }) : /* @__PURE__ */ i(po, { ...c, children: /* @__PURE__ */ i("span", { children: l }) });
703
+ };
653
704
  export {
654
- mo as Button,
655
- mo as default
705
+ Ro as Button,
706
+ Ro as default
656
707
  };