jcicl 1.0.7 → 1.0.11

package/Button/Button.js

@@ -1,39 +1,42 @@
-import { jsxs as _, jsx as i } from "react/jsx-runtime";
-import * as S from "react";
-import { g as A, a as q, s, r as J, c as p, m as K, u as Q, b as R, P as t, d as X, e as $ } from "../.chunks/DefaultPropsProvider.js";
-import { m as Y } from "../.chunks/memoTheme.js";
-import { c as Z } from "../.chunks/createSimplePaletteValueFilter.js";
-import { B as m } from "../.chunks/ButtonBase.js";
-import { i as oo } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as g } from "../.chunks/emotion-react.browser.esm.js";
-import r from "../theme.js";
-function ro(o) {
-  return A("MuiButton", o);
+import { jsxs as I, jsx as i } from "react/jsx-runtime";
+import * as w from "react";
+import { useState as q } from "react";
+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";
+import { m as oo } from "../.chunks/memoTheme.js";
+import { c as to } from "../.chunks/createSimplePaletteValueFilter.js";
+import { B as O } from "../.chunks/ButtonBase.js";
+import { i as ro } from "../.chunks/emotion-styled.browser.esm.js";
+import { c as v } from "../.chunks/emotion-react.browser.esm.js";
+import t from "../theme.js";
+import { Tooltip as ao } from "../Tooltip/Tooltip.js";
+import { C as eo } from "../.chunks/check.js";
+function no(o) {
+  return J("MuiButton", o);
 }
-const v = 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({});
-process.env.NODE_ENV !== "production" && (E.displayName = "ButtonGroupContext");
-const T = /* @__PURE__ */ S.createContext(void 0);
-process.env.NODE_ENV !== "production" && (T.displayName = "ButtonGroupButtonContext");
-const to = (o) => {
+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({});
+process.env.NODE_ENV !== "production" && (W.displayName = "ButtonGroupContext");
+const j = /* @__PURE__ */ w.createContext(void 0);
+process.env.NODE_ENV !== "production" && (j.displayName = "ButtonGroupButtonContext");
+const io = (o) => {
   const {
     color: a,
-    disableElevation: n,
-    fullWidth: e,
+    disableElevation: e,
+    fullWidth: n,
     size: d,
     variant: u,
     classes: b
   } = o, x = {
-    root: ["root", u, `${u}${p(a)}`, `size${p(d)}`, `${u}Size${p(d)}`, `color${p(a)}`, n && "disableElevation", e && "fullWidth"],
+    root: ["root", u, `${u}${p(a)}`, `size${p(d)}`, `${u}Size${p(d)}`, `color${p(a)}`, e && "disableElevation", n && "fullWidth"],
     label: ["label"],
     startIcon: ["icon", "startIcon", `iconSize${p(d)}`],
     endIcon: ["icon", "endIcon", `iconSize${p(d)}`]
-  }, f = X(x, ro, b);
+  }, f = Z(x, no, b);
   return {
     ...b,
     // forward the focused, disabled, etc. classes to the ButtonBase
     ...f
   };
-}, P = [{
+}, V = [{
   props: {
     size: "small"
   },
@@ -60,20 +63,20 @@ const to = (o) => {
       fontSize: 22
     }
   }
-}], ao = s(m, {
-  shouldForwardProp: (o) => J(o) || o === "classes",
+}], so = s(O, {
+  shouldForwardProp: (o) => Q(o) || o === "classes",
   name: "MuiButton",
   slot: "Root",
   overridesResolver: (o, a) => {
     const {
-      ownerState: n
+      ownerState: e
     } = o;
-    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];
+    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];
   }
-})(Y(({
+})(oo(({
   theme: o
 }) => {
-  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];
+  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];
   return {
     ...o.typography.button,
     minWidth: 64,
@@ -86,7 +89,7 @@ const to = (o) => {
     "&:hover": {
       textDecoration: "none"
     },
-    [`&.${v.disabled}`]: {
+    [`&.${g.disabled}`]: {
       color: (o.vars || o).palette.action.disabled
     },
     variants: [{
@@ -107,10 +110,10 @@ const to = (o) => {
         "&:active": {
           boxShadow: (o.vars || o).shadows[8]
         },
-        [`&.${v.focusVisible}`]: {
+        [`&.${g.focusVisible}`]: {
           boxShadow: (o.vars || o).shadows[6]
         },
-        [`&.${v.disabled}`]: {
+        [`&.${g.disabled}`]: {
           color: (o.vars || o).palette.action.disabled,
           boxShadow: (o.vars || o).shadows[0],
           backgroundColor: (o.vars || o).palette.action.disabledBackground
@@ -126,7 +129,7 @@ const to = (o) => {
         borderColor: "var(--variant-outlinedBorder, currentColor)",
         backgroundColor: "var(--variant-outlinedBg)",
         color: "var(--variant-outlinedColor)",
-        [`&.${v.disabled}`]: {
+        [`&.${g.disabled}`]: {
           border: `1px solid ${(o.vars || o).palette.action.disabledBackground}`
         }
       }
@@ -139,22 +142,22 @@ const to = (o) => {
         color: "var(--variant-textColor)",
         backgroundColor: "var(--variant-textBg)"
       }
-    }, ...Object.entries(o.palette).filter(Z()).map(([e]) => ({
+    }, ...Object.entries(o.palette).filter(to()).map(([n]) => ({
       props: {
-        color: e
+        color: n
       },
       style: {
-        "--variant-textColor": (o.vars || o).palette[e].main,
-        "--variant-outlinedColor": (o.vars || o).palette[e].main,
-        "--variant-outlinedBorder": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / 0.5)` : $(o.palette[e].main, 0.5),
-        "--variant-containedColor": (o.vars || o).palette[e].contrastText,
-        "--variant-containedBg": (o.vars || o).palette[e].main,
+        "--variant-textColor": (o.vars || o).palette[n].main,
+        "--variant-outlinedColor": (o.vars || o).palette[n].main,
+        "--variant-outlinedBorder": o.vars ? `rgba(${o.vars.palette[n].mainChannel} / 0.5)` : $(o.palette[n].main, 0.5),
+        "--variant-containedColor": (o.vars || o).palette[n].contrastText,
+        "--variant-containedBg": (o.vars || o).palette[n].main,
         "@media (hover: hover)": {
           "&:hover": {
-            "--variant-containedBg": (o.vars || o).palette[e].dark,
-            "--variant-textBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[e].main, o.palette.action.hoverOpacity),
-            "--variant-outlinedBorder": (o.vars || o).palette[e].main,
-            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[e].main, o.palette.action.hoverOpacity)
+            "--variant-containedBg": (o.vars || o).palette[n].dark,
+            "--variant-textBg": o.vars ? `rgba(${o.vars.palette[n].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[n].main, o.palette.action.hoverOpacity),
+            "--variant-outlinedBorder": (o.vars || o).palette[n].main,
+            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette[n].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette[n].main, o.palette.action.hoverOpacity)
           }
         }
       }
@@ -168,7 +171,7 @@ const to = (o) => {
         "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedBg : a,
         "@media (hover: hover)": {
           "&:hover": {
-            "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedHoverBg : n,
+            "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedHoverBg : e,
             "--variant-textBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette.text.primary, o.palette.action.hoverOpacity),
             "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : $(o.palette.text.primary, o.palette.action.hoverOpacity)
           }
@@ -237,13 +240,13 @@ const to = (o) => {
         "&:hover": {
           boxShadow: "none"
         },
-        [`&.${v.focusVisible}`]: {
+        [`&.${g.focusVisible}`]: {
           boxShadow: "none"
         },
         "&:active": {
           boxShadow: "none"
         },
-        [`&.${v.disabled}`]: {
+        [`&.${g.disabled}`]: {
           boxShadow: "none"
         }
       }
@@ -256,14 +259,14 @@ const to = (o) => {
       }
     }]
   };
-})), no = s("span", {
+})), lo = s("span", {
   name: "MuiButton",
   slot: "StartIcon",
   overridesResolver: (o, a) => {
     const {
-      ownerState: n
+      ownerState: e
     } = o;
-    return [a.startIcon, a[`iconSize${p(n.size)}`]];
+    return [a.startIcon, a[`iconSize${p(e.size)}`]];
   }
 })({
   display: "inherit",
@@ -276,15 +279,15 @@ const to = (o) => {
     style: {
       marginLeft: -2
     }
-  }, ...P]
-}), eo = s("span", {
+  }, ...V]
+}), co = s("span", {
   name: "MuiButton",
   slot: "EndIcon",
   overridesResolver: (o, a) => {
     const {
-      ownerState: n
+      ownerState: e
     } = o;
-    return [a.endIcon, a[`iconSize${p(n.size)}`]];
+    return [a.endIcon, a[`iconSize${p(e.size)}`]];
   }
 })({
   display: "inherit",
@@ -297,62 +300,62 @@ const to = (o) => {
     style: {
       marginRight: -2
     }
-  }, ...P]
-}), W = /* @__PURE__ */ S.forwardRef(function(a, n) {
-  const e = S.useContext(E), d = S.useContext(T), u = K(e, a), b = Q({
+  }, ...V]
+}), F = /* @__PURE__ */ w.forwardRef(function(a, e) {
+  const n = w.useContext(W), d = w.useContext(j), u = X(n, a), b = Y({
     props: u,
     name: "MuiButton"
   }), {
     children: x,
     color: f = "primary",
     component: l = "button",
-    className: h,
-    disabled: c = !1,
-    disableElevation: C = !1,
-    disableFocusRipple: k = !1,
-    endIcon: I,
-    focusVisibleClassName: V,
-    fullWidth: M = !1,
-    size: F = "medium",
-    startIcon: O,
-    type: N,
-    variant: G = "text",
-    ...L
-  } = b, w = {
+    className: z,
+    disabled: B = !1,
+    disableElevation: c = !1,
+    disableFocusRipple: y = !1,
+    endIcon: m,
+    focusVisibleClassName: R,
+    fullWidth: k = !1,
+    size: L = "medium",
+    startIcon: T,
+    type: E,
+    variant: H = "text",
+    ...D
+  } = b, C = {
     ...b,
     color: f,
     component: l,
-    disabled: c,
-    disableElevation: C,
-    disableFocusRipple: k,
-    fullWidth: M,
-    size: F,
-    type: N,
-    variant: G
-  }, y = to(w), H = O && /* @__PURE__ */ i(no, {
-    className: y.startIcon,
-    ownerState: w,
-    children: O
-  }), D = I && /* @__PURE__ */ i(eo, {
-    className: y.endIcon,
-    ownerState: w,
-    children: I
-  }), U = d || "";
-  return /* @__PURE__ */ _(ao, {
-    ownerState: w,
-    className: R(e.className, y.root, h, U),
+    disabled: B,
+    disableElevation: c,
+    disableFocusRipple: y,
+    fullWidth: k,
+    size: L,
+    type: E,
+    variant: H
+  }, h = io(C), U = T && /* @__PURE__ */ i(lo, {
+    className: h.startIcon,
+    ownerState: C,
+    children: T
+  }), _ = m && /* @__PURE__ */ i(co, {
+    className: h.endIcon,
+    ownerState: C,
+    children: m
+  }), A = d || "";
+  return /* @__PURE__ */ I(so, {
+    ownerState: C,
+    className: P(n.className, h.root, z, A),
     component: l,
-    disabled: c,
-    focusRipple: !k,
-    focusVisibleClassName: R(y.focusVisible, V),
-    ref: n,
-    type: N,
-    ...L,
-    classes: y,
-    children: [H, x, D]
+    disabled: B,
+    focusRipple: !y,
+    focusVisibleClassName: P(h.focusVisible, R),
+    ref: e,
+    type: E,
+    ...D,
+    classes: h,
+    children: [U, x, _]
   });
 });
-process.env.NODE_ENV !== "production" && (W.propTypes = {
+process.env.NODE_ENV !== "production" && (F.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -360,42 +363,42 @@ process.env.NODE_ENV !== "production" && (W.propTypes = {
   /**
    * The content of the component.
    */
-  children: t.node,
+  children: r.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: t.object,
+  classes: r.object,
   /**
    * @ignore
    */
-  className: t.string,
+  className: r.string,
   /**
    * The color of the component.
    * It supports both default and custom theme colors, which can be added as shown in the
    * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
    * @default 'primary'
    */
-  color: t.oneOfType([t.oneOf(["inherit", "primary", "secondary", "success", "error", "info", "warning"]), t.string]),
+  color: r.oneOfType([r.oneOf(["inherit", "primary", "secondary", "success", "error", "info", "warning"]), r.string]),
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: t.elementType,
+  component: r.elementType,
   /**
    * If `true`, the component is disabled.
    * @default false
    */
-  disabled: t.bool,
+  disabled: r.bool,
   /**
    * If `true`, no elevation is used.
    * @default false
    */
-  disableElevation: t.bool,
+  disableElevation: r.bool,
   /**
    * If `true`, the  keyboard focus ripple is disabled.
    * @default false
    */
-  disableFocusRipple: t.bool,
+  disableFocusRipple: r.bool,
   /**
    * If `true`, the ripple effect is disabled.
    *
@@ -403,106 +406,110 @@ process.env.NODE_ENV !== "production" && (W.propTypes = {
    * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
    * @default false
    */
-  disableRipple: t.bool,
+  disableRipple: r.bool,
   /**
    * Element placed after the children.
    */
-  endIcon: t.node,
+  endIcon: r.node,
   /**
    * @ignore
    */
-  focusVisibleClassName: t.string,
+  focusVisibleClassName: r.string,
   /**
    * If `true`, the button will take up the full width of its container.
    * @default false
    */
-  fullWidth: t.bool,
+  fullWidth: r.bool,
   /**
    * The URL to link to when the button is clicked.
    * If defined, an `a` element will be used as the root node.
    */
-  href: t.string,
+  href: r.string,
   /**
    * The size of the component.
    * `small` is equivalent to the dense button styling.
    * @default 'medium'
    */
-  size: t.oneOfType([t.oneOf(["small", "medium", "large"]), t.string]),
+  size: r.oneOfType([r.oneOf(["small", "medium", "large"]), r.string]),
   /**
    * Element placed before the children.
    */
-  startIcon: t.node,
+  startIcon: r.node,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
+  sx: r.oneOfType([r.arrayOf(r.oneOfType([r.func, r.object, r.bool])), r.func, r.object]),
   /**
    * @ignore
    */
-  type: t.oneOfType([t.oneOf(["button", "reset", "submit"]), t.string]),
+  type: r.oneOfType([r.oneOf(["button", "reset", "submit"]), r.string]),
   /**
    * The variant to use.
    * @default 'text'
    */
-  variant: t.oneOfType([t.oneOf(["contained", "outlined", "text"]), t.string])
+  variant: r.oneOfType([r.oneOf(["contained", "outlined", "text"]), r.string])
 });
-const j = [
+const M = [
   "active",
   "customBackgroundColor",
   "customHoverColor",
   "customTextColor",
   "customShadow1",
   "customShadow2"
-], B = s(W, { shouldForwardProp: (o) => !j.includes(o) })`
+], S = s(F, { shouldForwardProp: (o) => !M.includes(o) })`
   text-transform: none;
   &:disabled {
     opacity: 0.5;
-    color: ${r.colors.black};
+    color: ${t.colors.black};
     display: flex;
     justify-content: center;
     align-items: center;
   }
-`, io = s(B)`
-  background-color: ${r.colors.green};
+
+  span {
+    align-items: center !important;
+  }
+`, po = s(S)`
+  background-color: ${t.colors.green};
   height: 2.5rem;
   border: 2px solid transparent;
-  color: ${r.colors.white};
+  color: ${t.colors.white};
   transition: 313ms all ease-in;
   border-radius: 32px;
   font-weight: 400;
   padding: 0.75rem 2rem;
   font-size: 1rem;
-  box-shadow: ${r.boxShadows.gray63};
+  box-shadow: ${t.boxShadows.gray63};
   &:hover,
   :focus-visible {
-    background-color: ${r.colors.darkGreen};
-    box-shadow: ${r.boxShadows.black63};
+    background-color: ${t.colors.darkGreen};
+    box-shadow: ${t.boxShadows.black63};
   }
   &:disabled {
-    background-color: ${r.colors.darkGreen};
+    background-color: ${t.colors.darkGreen};
   }
-`, so = s(B, {
-  shouldForwardProp: (o) => !j.includes(o)
+`, uo = s(S, {
+  shouldForwardProp: (o) => !M.includes(o)
 })(
   ({
-    customBackgroundColor: o = r.colors.green,
-    customHoverColor: a = r.colors.darkGreen,
-    customTextColor: n = r.colors.white,
-    customShadow1: e = r.boxShadows.gray63,
-    customShadow2: d = r.boxShadows.black63
+    customBackgroundColor: o = t.colors.green,
+    customHoverColor: a = t.colors.darkGreen,
+    customTextColor: e = t.colors.white,
+    customShadow1: n = t.boxShadows.gray63,
+    customShadow2: d = t.boxShadows.black63
   }) => ({
-    ...g`
+    ...v`
       background-color: ${o};
       border-radius: 0;
       height: 2.5rem;
       border: 2px solid transparent;
-      color: ${n};
+      color: ${e};
       transition: 313ms all ease-in;
       border-radius: 32px;
       font-weight: 400;
       padding: 0.75rem 2rem;
       font-size: 1rem;
-      box-shadow: ${e};
+      box-shadow: ${n};
       &:hover,
       :focus-visible {
         background-color: ${a};
@@ -513,71 +520,90 @@ const j = [
       }
     `
   })
-), lo = s(B)`
-  background-color: ${r.colors.gold};
+), bo = s(S)`
+  background-color: ${t.colors.gold};
   height: 2.5rem;
   border: 2px solid transparent;
-  color: ${r.colors.midnight};
+  color: ${t.colors.midnight};
   transition: 313ms all ease-in;
   border-radius: 32px;
   font-weight: 400;
   padding: 0.75rem 2rem;
   font-size: 1rem;
-  box-shadow: ${r.boxShadows.gray63};
+  box-shadow: ${t.boxShadows.gray63};
   &:hover,
   :focus-visible {
-    background-color: ${r.colors.goldHover};
-    box-shadow: ${r.boxShadows.gray63};
+    background-color: ${t.colors.goldHover};
+    box-shadow: ${t.boxShadows.gray63};
   }
   &:disabled {
-    background-color: ${r.colors.goldHover};
+    background-color: ${t.colors.goldHover};
   }
-`, z = s(B)(({ width: o = "114px" }) => ({
-  ...g`
+`, N = s(S)(({ width: o = "114px" }) => ({
+  ...v`
     box-sizing: border-box;
-    background-color: ${r.colors.bibiBlue};
+    background-color: ${t.colors.bibiBlue};
     border-radius: 0;
     height: 47px;
     width: ${o};
     border: 2px solid transparent;
-    color: ${r.colors.white};
+    color: ${t.colors.white};
     transition: 108ms all ease-in;
     font-weight: 500;
     padding: 0;
     font-size: 19px;
     &:hover,
     :focus-visible {
-      background-color: ${r.colors.bibiBlueHover};
+      background-color: ${t.colors.bibiBlueHover};
     }
   `
-})), co = s(z)(({ active: o }) => ({
-  ...g`
-    background-color: ${o && r.colors.white};
-    color: ${o && r.colors.bibiBlue};
+})), go = s(N)(({ active: o }) => ({
+  ...v`
+    background-color: ${o && t.colors.white};
+    color: ${o && t.colors.bibiBlue};
     &:hover,
     :focus-visible {
-      background-color: ${r.colors.white};
-      color: ${r.colors.bibiBlue};
+      background-color: ${t.colors.white};
+      color: ${t.colors.bibiBlue};
     }
   `
-})), po = s(z)(() => ({
-  ...g`
-    background-color: ${r.colors.white};
-    color: ${r.colors.bibiBlue};
+})), vo = s(N)(() => ({
+  ...v`
+    background-color: ${t.colors.white};
+    color: ${t.colors.bibiBlue};
     &:hover,
     :focus-visible {
-      background-color: ${r.colors.bibiBlue};
-      border: 2px solid ${r.colors.white};
-      color: ${r.colors.white};
+      background-color: ${t.colors.bibiBlue};
+      border: 2px solid ${t.colors.white};
+      color: ${t.colors.white};
     }
   `
-})), uo = s(m)`
+})), G = s(O)`
   display: block;
-`, bo = s(m, {
-  shouldForwardProp: (o) => typeof o == "string" && oo(o)
+`, xo = s(G)`
+  font-family: inherit;
+  font-size: inherit;
+  font-weight: inherit;
+`, fo = s("div")`
+  display: flex;
+  .isCopied {
+    color: ${t.colors.gray};
+    display: inline;
+    margin-left: 8px;
+    font-size: smaller;
+    align-content: center;
+  }
+  .isCopied > svg {
+    vertical-align: middle;
+    height: 14px !important;
+    width: 14px !important;
+    margin: 0;
+  }
+`, yo = s(O, {
+  shouldForwardProp: (o) => typeof o == "string" && ro(o)
 })(
-  ({ size: o, color: a, highlightColor: n, hoverColor: e }) => ({
-    ...g`
+  ({ size: o, color: a, highlightColor: e, hoverColor: n }) => ({
+    ...v`
       display: flex;
       align-items: center;
       justify-content: center;
@@ -587,9 +613,9 @@ const j = [
       &:hover,
       :focus-visible {
         svg {
-          filter: drop-shadow(0 0 6px ${n}) drop-shadow(0 0 6px ${n})
-            drop-shadow(0 0 6px ${n}) drop-shadow(0 0 6px ${n});
-          fill: ${e || a};
+          filter: drop-shadow(0 0 6px ${e}) drop-shadow(0 0 6px ${e})
+            drop-shadow(0 0 6px ${e}) drop-shadow(0 0 6px ${e});
+          fill: ${n || a};
         }
       }
 
@@ -601,52 +627,81 @@ const j = [
       }
     `
   })
-), vo = s(B)(({ active: o }) => ({
-  ...g`
+), mo = s(S)(({ active: o }) => ({
+  ...v`
     box-sizing: border-box;
-    background-color: ${o ? r.colors.black : r.colors.white};
+    background-color: ${o ? t.colors.black : t.colors.white};
     height: 28px;
     border-radius: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
-    border: 2px solid ${o ? "transparent" : r.colors.black};
-    color: ${o ? r.colors.white : r.colors.black};
+    border: 2px solid ${o ? "transparent" : t.colors.black};
+    color: ${o ? t.colors.white : t.colors.black};
     transition: 108ms all ease-in;
     font-weight: 500;
 
     &:hover,
     :focus-visible {
-      background-color: ${o ? r.colors.charcoal : r.colors.gray2};
+      background-color: ${o ? t.colors.charcoal : t.colors.gray2};
     }
   `
-})), ho = ({
+})), Ro = ({
   variant: o = 1,
   size: a = 50,
-  color: n = r.colors.darkGreen,
-  highlightColor: e = r.colors.dandelion,
-  hoverColor: d = r.colors.green,
-  backgroundColor: u = r.colors.darkGreen,
-  textColor: b = r.colors.white,
-  customShadow1: x = r.boxShadows.gray63,
-  customShadow2: f = r.boxShadows.black63,
+  color: e = t.colors.darkGreen,
+  highlightColor: n = t.colors.dandelion,
+  hoverColor: d = t.colors.green,
+  backgroundColor: u = t.colors.darkGreen,
+  textColor: b = t.colors.white,
+  customShadow1: x = t.boxShadows.gray63,
+  customShadow2: f = t.boxShadows.black63,
   children: l,
-  active: h,
+  textToCopy: z,
+  active: B,
   ...c
-}) => o === "custom" ? /* @__PURE__ */ i(
-  so,
-  {
-    customBackgroundColor: u,
-    customHoverColor: d,
-    customTextColor: b,
-    customShadow1: x,
-    customShadow2: f,
-    className: "jcCustomButton",
-    ...c,
-    children: l
+}) => {
+  if (o === "custom")
+    return /* @__PURE__ */ i(
+      uo,
+      {
+        customBackgroundColor: u,
+        customHoverColor: d,
+        customTextColor: b,
+        customShadow1: x,
+        customShadow2: f,
+        className: "jcCustomButton",
+        ...c,
+        children: l
+      }
+    );
+  if (o === "bibi")
+    return /* @__PURE__ */ i(N, { ...c, children: l });
+  if (o === "bibiOutlined")
+    return /* @__PURE__ */ i(go, { ...c, children: l });
+  if (o === "bibiInverse")
+    return /* @__PURE__ */ i(vo, { ...c, children: l });
+  if (o === "unstyled")
+    return /* @__PURE__ */ i(G, { ...c, children: l });
+  if (o === "copy") {
+    const [y, m] = q(!1);
+    return /* @__PURE__ */ I(fo, { onClick: async () => {
+      try {
+        await navigator.clipboard.writeText(z || String(l)), m(!0), setTimeout(() => m(!1), 1100);
+      } catch (k) {
+        console.error("Failed to copy text: ", k);
+      }
+    }, children: [
+      /* @__PURE__ */ i(ao, { title: "Copy to clipboard", children: /* @__PURE__ */ i(xo, { ...c, children: l }) }),
+      y && /* @__PURE__ */ I("span", { className: "isCopied", children: [
+        /* @__PURE__ */ i(eo, { size: 12 }),
+        " Copied"
+      ] })
+    ] });
   }
-) : 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(vo, { className: "jcFilterButton", active: h, ...c, children: l }) : /* @__PURE__ */ i(io, { ...c, children: /* @__PURE__ */ i("span", { children: l }) });
+  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 }) });
+};
 export {
-  ho as Button,
-  ho as default
+  Ro as Button,
+  Ro as default
 };