@bikdotai/bik-component-library 0.0.829-beta.0 → 0.0.829

package/dist/esm/components/button/themes.js

@@ -1,8 +1,6 @@
 import { COLORS as r } from "../../constants/Theme.js";
-import { ButtonRegularAI as d, ButtonLargeAI as g, BodySecondary as l, BodyCaption as f, ButtonRegular as b, ButtonLarge as p } from "../TypographyStyle.js";
-const m = (t, n, e, a, o) => {
-  if (t === "special") return r.background.brandVeryLight;
-  if (t === "secondaryGray") return "transparent";
+import { ButtonRegularAI as d, ButtonLargeAI as g, BodySecondary as p, BodyCaption as l, ButtonRegular as f, ButtonLarge as b } from "../TypographyStyle.js";
+const k = (t, n, e, a, o) => {
   if (n === "chip")
     return t === "text" ? "transparent" : a ? r.surface.hovered : r.surface.subdued;
   switch (t) {
@@ -16,8 +14,6 @@ const m = (t, n, e, a, o) => {
       return "transparent";
   }
 }, $ = (t, n, e, a) => {
-  if (t === "special") return r.background.inverseLight;
-  if (t === "secondaryGray") return r.content.secondary;
   if (n === "chip")
     return t === "text" ? e ? r.content.inactive : r.content.brand : a ? r.content.primary : r.content.secondary;
   switch (t) {
@@ -39,8 +35,6 @@ const m = (t, n, e, a, o) => {
 }, y = (t) => t ? "rgba(255, 255, 255, 0.5)" : r.content.inactive, v = (t, n) => {
   if (t === "text")
     return "0px";
-  if (n === "xs")
-    return t === "secondary" || t === "special" || t === "secondaryGray" ? "3px 6px" : "4px 6px";
   if (n === "chip")
     return "4px 8px";
   if (n === "small")
@@ -70,7 +64,7 @@ const m = (t, n, e, a, o) => {
       default:
         return "14px 12px";
     }
-}, B = (t, n, e) => !e && n === "ai" ? t === "small" ? d : g : n === "dashRegular" ? l : t === "chip" || t === "xs" ? f : t === "small" ? b : p, s = (t, n, e) => e ? r.stroke.negative.vibrant : n ? r.surface.standard : t == "secondary" ? r.stroke.brand : r.content.placeholder, L = (t, n, e, a, o) => n == "text" ? "border: none;" : n === "special" ? `border: 1px solid ${r.stroke.brandLightAlt};` : n === "secondaryGray" ? `border: 1px solid ${r.stroke.primary};` : e === "chip" ? `border: ${t === "2.0" ? 0.5 : 1}px solid ${r.stroke.primary};` : a ? n === "secondary" ? `border: ${t === "2.0" ? 0.5 : 1}px solid ${s(
+}, B = (t, n, e) => !e && n === "ai" ? t === "small" ? d : g : n === "dashRegular" ? p : t === "chip" ? l : t === "small" ? f : b, s = (t, n, e) => e ? r.stroke.negative.vibrant : n ? r.surface.standard : t == "secondary" ? r.stroke.brand : r.content.placeholder, L = (t, n, e, a, o) => n == "text" ? "border: none;" : e === "chip" ? `border: ${t === "2.0" ? 0.5 : 1}px solid ${r.stroke.primary};` : a ? n === "secondary" ? `border: ${t === "2.0" ? 0.5 : 1}px solid ${s(
   n,
   a,
   o
@@ -82,15 +76,15 @@ const m = (t, n, e, a, o) => {
 		transparent 5px,
 		transparent 10px` : `6px,
 		transparent 6px,
-		transparent 12px`, G = (t, n) => {
+		transparent 12px`, w = (t, n) => {
   const e = parseInt(t.replace("#", ""), 16), a = Math.round(2.55 * n), o = (e >> 16) - a, i = (e >> 8 & 255) - a, u = (e & 255) - a;
   return `#${(16777216 + (Math.max(o, 0) << 16) + (Math.max(i, 0) << 8) + Math.max(u, 0)).toString(16).slice(1)}`;
 }, x = (t, n) => {
   const e = parseInt(t.replace("#", ""), 16), a = Math.round(2.55 * n), o = (e >> 16) + a, i = (e >> 8 & 255) + a, u = (e & 255) + a;
   return `#${(16777216 + (Math.min(o, 255) << 16) + (Math.min(i, 255) << 8) + Math.min(u, 255)).toString(16).slice(1)}`;
-}, w = (t, n) => t === "ai" ? `background: ${r.surface.aiLight};` : t === "text" ? "background-color:transparent;" : t === "special" || t === "secondaryGray" ? "" : !n && t !== "primary" ? `background-color: #000000;
-				opacity: 0.03;` : "", I = (t, n) => n ? "" : `text-decoration-line: underline;
-			text-decoration-color: ${r.content.brand};`, M = (t, n) => n ? "" : t === "primary" ? `background-color: ${r.stroke.warning.lightAlt};` : "background-color: rgba(255, 255, 255, 0.1)", A = (t, n, e) => t === "special" ? `background-color: ${r.background.base}; border: 1px solid ${r.stroke.primary};` : t === "secondaryGray" ? `border: 1px solid ${r.stroke.primary};` : n === "chip" ? "background-color: transparent;" : t === "primary" || t === "destructive" ? e ? "background-color: rgba(255,255,255,0.3);" : `background-color: ${r.background.inactive};` : t === "secondary" ? e ? "border: 1px solid rgba(255, 255, 255, 0.5);" : `border: 1px solid ${r.stroke.primary};` : "", S = (t, n, e = s(t, !1)) => `
+}, I = (t, n) => t === "ai" ? `background: ${r.surface.aiLight};` : t === "text" ? "background-color:transparent;" : !n && t !== "primary" ? `background-color: #000000;
+				opacity: 0.03;` : "", G = (t, n) => n ? "" : `text-decoration-line: underline;
+			text-decoration-color: ${r.content.brand};`, M = (t, n) => n ? "" : t === "primary" ? `background-color: ${r.stroke.warning.lightAlt};` : "background-color: rgba(255, 255, 255, 0.1)", S = (t, n, e) => n === "chip" ? "background-color: transparent;" : t === "primary" || t === "destructive" ? e ? "background-color: rgba(255,255,255,0.3);" : `background-color: ${r.background.inactive};` : t === "secondary" ? e ? "border: 1px solid rgba(255, 255, 255, 0.5);" : `border: 1px solid ${r.stroke.primary};` : "", R = (t, n, e = s(t, !1)) => `
 	.line-top {
 		position: absolute;
 		left: 0;
@@ -143,15 +137,11 @@ const m = (t, n, e, a, o) => {
 				${c(n)}
 		);
 	}
-	`, R = (t, n, e) => {
+	`, A = (t, n, e) => {
   if (t === "text")
     return `background-color: ${r.background.brandLight};
 			text-decoration-line: underline;
 			text-decoration-color: ${r.content.brand};`;
-  if (t === "special")
-    return `background-color: ${r.background.brandLight}; border: 1px solid ${r.stroke.brandLightAlt};`;
-  if (t === "secondaryGray")
-    return `background-color: ${r.surface.hovered}; border: 1px solid ${r.stroke.primary};`;
   if (n === "chip")
     return `border: 1px solid ${r.stroke.brandLightAlt};
 		background-color: ${r.background.brandLight};`;
@@ -161,18 +151,14 @@ const m = (t, n, e, a, o) => {
 			` : "box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);";
   if (t === "secondary" || t === "tertiary" || t === "tertiaryGray" || t.startsWith("dash"))
     return e ? `background-color: ${r.background.inverseLight}  !important;` : `background-color: ${r.background.brandLight};`;
-}, D = (t, n, e, a) => t === "special" ? `background-color: ${r.background.brandVeryLight};` : t === "secondaryGray" ? `background-color: ${r.surface.subdued};` : n === "chip" ? `background-color: ${r.background.base};` : t === "primary" ? a ? `background-color: ${x(
+}, D = (t, n, e, a) => n === "chip" ? `background-color: ${r.background.base};` : t === "primary" ? a ? `background-color: ${x(
   a,
   50
-)};` : `background-color: ${e ? r.background.warning.vibrant : r.background.brandLight};` : t === "destructive" ? `background-color: ${r.background.negative.light};` : "background-color: transparent;", H = (t, n, e) => t === "special" ? `border: 1px solid ${r.stroke.brandLightAlt};` : t === "secondaryGray" ? `border: 1px solid ${r.stroke.primary};` : n === "chip" ? "border: none;" : t === "secondary" ? e ? `border: 1px solid ${r.content.secondary};` : `border: 1px solid ${r.stroke.brandLightAlt};` : "", C = (t, n) => t === "secondaryGray" ? r.content.secondary : n ? t === "primary" ? r.content.primary : r.content.primaryInverse : t === "destructive" ? r.content.negative : r.content.brand, T = (t, n, e, a, o, i) => {
+)};` : `background-color: ${e ? r.background.warning.vibrant : r.background.brandLight};` : t === "destructive" ? `background-color: ${r.background.negative.light};` : "background-color: transparent;", H = (t, n, e) => n === "chip" ? "border: none;" : t === "secondary" ? e ? `border: 1px solid ${r.content.secondary};` : `border: 1px solid ${r.stroke.brandLightAlt};` : "", C = (t, n) => n ? t === "primary" ? r.content.primary : r.content.primaryInverse : t === "destructive" ? r.content.negative : r.content.brand, T = (t, n, e, a, o, i) => {
   if (t === "chip")
     return a ? r.content.inactive : i ? r.content.primary : r.content.secondary;
   if (o)
     return "transparent";
-  if (n === "special")
-    return a ? r.content.inactive : r.background.inverseLight;
-  if (n === "secondaryGray")
-    return a ? r.content.inactive : r.content.secondary;
   if (n === "primary" || n === "destructive")
     return e ? a ? "rgba(255, 255, 255, 0.5)" : r.content.primary : a ? r.content.inactive : r.content.primaryInverse;
   if (n === "secondary")
@@ -185,19 +171,19 @@ const m = (t, n, e, a, o) => {
 export {
   B as GetButtonTextComponent,
   C as SpinnerColorMap,
-  A as generateDisabledStyling,
+  S as generateDisabledStyling,
   M as generateInverseHoverBackground,
-  m as getBackgroundColor,
+  k as getBackgroundColor,
   L as getBorder,
   s as getBorderColor,
   T as getButtonIconColor,
-  R as getClickEffect,
+  A as getClickEffect,
   $ as getColor,
-  S as getDashedBorderStyling,
+  R as getDashedBorderStyling,
   y as getDisabledTextColor,
-  w as getHoverButtonBackground,
-  G as getHoverButtonBackgroundCustom,
-  I as getHoverButtonTextDecorationStyle,
+  I as getHoverButtonBackground,
+  w as getHoverButtonBackgroundCustom,
+  G as getHoverButtonTextDecorationStyle,
   c as getLinearGradientValue,
   D as getLoadingBackground,
   H as getLoadingBorder,

package/dist/esm/components/button/themes.js.map

@@ -1 +1 @@
-{"version":3,"file":"themes.js","sources":["../../../../src/components/button/themes.tsx"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tButtonLarge,\n\tButtonLargeAI,\n\tButtonRegular,\n\tButtonRegularAI,\n} from '../TypographyStyle';\nimport { Size, Type } from './model';\n\nexport const getBackgroundColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n\tbuttonColor?: string,\n): string => {\n\tif (type === 'special') return COLORS.background.brandVeryLight;\n\tif (type === 'secondaryGray') return 'transparent';\n\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn 'transparent';\n\t\t}\n\t\treturn darkMode ? COLORS.surface.hovered : COLORS.surface.subdued;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn buttonColor\n\t\t\t\t? buttonColor\n\t\t\t\t: inverse\n\t\t\t\t? COLORS.background.warning.vibrant\n\t\t\t\t: COLORS.background.inverseLight;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.background.negative.vibrant;\n\t\tcase 'tertiary':\n\t\t\treturn 'transparent';\n\t\tdefault:\n\t\t\treturn 'transparent';\n\t}\n};\n\nexport const getColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n): string => {\n\tif (type === 'special') return COLORS.background.inverseLight;\n\tif (type === 'secondaryGray') return COLORS.content.secondary;\n\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn inverse ? COLORS.content.inactive : COLORS.content.brand;\n\t\t}\n\t\treturn darkMode ? COLORS.content.primary : COLORS.content.secondary;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn inverse ? COLORS.content.primary : COLORS.content.primaryInverse;\n\t\tcase 'tertiaryGray':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.content.primaryInverse;\n\t\tcase 'dashBold':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'dashRegular':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'ai':\n\t\t\treturn COLORS.content.ai;\n\t\tdefault:\n\t\t\treturn inverse ? COLORS.content.primaryInverse : COLORS.stroke.brand;\n\t}\n};\n\nexport const getDisabledTextColor = (inverse?: boolean) => {\n\tif (inverse) {\n\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t}\n\treturn COLORS.content.inactive;\n};\n\nexport const getPadding = (type: Type, size: Size) => {\n\tif (type === 'text') {\n\t\treturn '0px';\n\t} else if (size === 'xs') {\n\t\tconst hasBorder =\n\t\t\ttype === 'secondary' || type === 'special' || type === 'secondaryGray';\n\t\treturn hasBorder ? '3px 6px' : '4px 6px';\n\t} else if (size === 'chip') {\n\t\treturn '4px 8px';\n\t} else if (size === 'small') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '6px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '6px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '6px 12px';\n\t\t}\n\t} else if (size === 'medium') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '10px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '10px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '10px 12px';\n\t\t}\n\t} else if (size === 'large') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '14px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '14px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '14px 12px';\n\t\t}\n\t}\n};\nexport const GetButtonTextComponent = (\n\tsize: Size,\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (!disabled && type === 'ai') {\n\t\tif (size === 'small') {\n\t\t\treturn ButtonRegularAI;\n\t\t} else {\n\t\t\treturn ButtonLargeAI;\n\t\t}\n\t}\n\n\tif (type === 'dashRegular') {\n\t\treturn BodySecondary;\n\t}\n\tif (size === 'chip' || size === 'xs') {\n\t\treturn BodyCaption;\n\t} else if (size === 'small') {\n\t\treturn ButtonRegular;\n\t}\n\treturn ButtonLarge;\n};\n\nexport const getBorderColor = (\n\ttype: Type,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (error) {\n\t\treturn COLORS.stroke.negative.vibrant;\n\t}\n\n\tif (inverse) {\n\t\treturn COLORS.surface.standard;\n\t}\n\tif (type == 'secondary') {\n\t\treturn COLORS.stroke.brand;\n\t}\n\treturn COLORS.content.placeholder;\n};\n\nexport const getBorder = (\n\tversion: '1.0' | '2.0' | '3.0',\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (type == 'text') {\n\t\treturn 'border: none;';\n\t}\n\tif (type === 'special') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${\n\t\t\tCOLORS.stroke.primary\n\t\t};`;\n\t}\n\tif (inverse) {\n\t\tif (type === 'secondary') {\n\t\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\t\ttype,\n\t\t\t\tinverse,\n\t\t\t\terror,\n\t\t\t)};`;\n\t\t}\n\t\treturn 'border: none;';\n\t}\n\n\tif (type === 'secondary') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\ttype,\n\t\t\tfalse,\n\t\t\terror,\n\t\t)};`;\n\t}\n\treturn 'border: none;';\n};\n\nexport const getLinearGradientValue = (size: Size): string => {\n\tif (size === 'medium') {\n\t\treturn `5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px`;\n\t}\n\treturn `6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px`;\n};\n\n/**\n * Adjusts the brightness of a given hex color by a specified percentage.\n * Below function is used to generate a hover effect for button backgrounds.\n *\n * @param {string} color - The hex color code to be adjusted (e.g., \"#ff0000\").\n * @param {number} percent - The percentage by which to darken the color. Positive values darken the color.\n * @returns {string} - The adjusted hex color code.\n *\n * @example\n * // Darken the color #ff0000 (red) by 10%\n * const darkerRed = getHoverButtonBackgroundCustom(\"#ff0000\", 10);\n * console.log(darkerRed); // Output might be \"#e60000\"\n */\n\nexport const getHoverButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) - amt,\n\t\tG = ((num >> 8) & 0x00ff) - amt,\n\t\tB = (num & 0x0000ff) - amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.max(R, 0) << 16) +\n\t\t(Math.max(G, 0) << 8) +\n\t\tMath.max(B, 0)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\n/**\n * Generates a new color by adjusting the brightness of the given color by a specified percentage.\n *\n * @param color - The original color in hexadecimal format (e.g., \"#RRGGBB\").\n * @param percent - The percentage to adjust the brightness. Positive values will lighten the color, while negative values will darken it.\n * @returns The new color in hexadecimal format after adjusting the brightness.\n *\n * @example\n * // Lighten the color by 20%\n * const newColor = getLoadingButtonBackgroundCustom(\"#ff0000\", 20); // \"#ff3333\"\n *\n * @example\n * // Darken the color by 10%\n * const newColor = getLoadingButtonBackgroundCustom(\"#00ff00\", -10); // \"#00e600\"\n */\nexport const getLoadingButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) + amt,\n\t\tG = ((num >> 8) & 0x00ff) + amt,\n\t\tB = (num & 0x0000ff) + amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.min(R, 255) << 16) +\n\t\t(Math.min(G, 255) << 8) +\n\t\tMath.min(B, 255)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\nexport const getHoverButtonBackground = (type: Type, inverse?: boolean) => {\n\tif (type === 'ai') {\n\t\treturn `background: ${COLORS.surface.aiLight};`;\n\t}\n\n\tif (type === 'text') {\n\t\treturn `background-color:transparent;`;\n\t}\n\tif (type === 'special' || type === 'secondaryGray') {\n\t\treturn '';\n\t}\n\tif (!inverse && type !== 'primary') {\n\t\treturn `background-color: #000000;\n\t\t\t\topacity: 0.03;`;\n\t}\n\n\treturn ``;\n};\n\nexport const getHoverButtonTextDecorationStyle = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\treturn `text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n};\n\nexport const generateInverseHoverBackground = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\tif (type === 'primary') {\n\t\treturn `background-color: ${COLORS.stroke.warning.lightAlt};`;\n\t}\n\treturn `background-color: rgba(255, 255, 255, 0.1)`;\n};\n\nexport const generateDisabledStyling = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n) => {\n\tif (type === 'special') {\n\t\treturn `background-color: ${COLORS.background.base}; border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `background-color: transparent;`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\treturn inverse\n\t\t\t? 'background-color: rgba(255,255,255,0.3);'\n\t\t\t: `background-color: ${COLORS.background.inactive};`;\n\t} else if (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid rgba(255, 255, 255, 0.5);`\n\t\t\t: `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\treturn '';\n};\n\nexport const getDashedBorderStyling = (\n\ttype: Type,\n\tsize: Size,\n\tborderColor: string = getBorderColor(type, false),\n) => {\n\treturn `\n\t.line-top {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-right {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-bottom {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tbottom: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-left {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t`;\n};\n\nexport const getClickEffect = (type: Type, size: Size, inverse?: boolean) => {\n\tif (type === 'text') {\n\t\treturn `background-color: ${COLORS.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n\t}\n\tif (type === 'special') {\n\t\treturn `background-color: ${COLORS.background.brandLight}; border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `background-color: ${COLORS.surface.hovered}; border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};\n\t\tbackground-color: ${COLORS.background.brandLight};`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\treturn `background-color: ${COLORS.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`;\n\t\t}\n\t\treturn 'box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);';\n\t} else if (\n\t\ttype === 'secondary' ||\n\t\ttype === 'tertiary' ||\n\t\ttype === 'tertiaryGray' ||\n\t\ttype.startsWith('dash')\n\t) {\n\t\treturn inverse\n\t\t\t? `background-color: ${COLORS.background.inverseLight}  !important;`\n\t\t\t: `background-color: ${COLORS.background.brandLight};`;\n\t}\n};\nexport const getLoadingBackground = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tbuttonColor?: string,\n) => {\n\tif (type === 'special') {\n\t\treturn `background-color: ${COLORS.background.brandVeryLight};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `background-color: ${COLORS.surface.subdued};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `background-color: ${COLORS.background.base};`;\n\t}\n\tif (type === 'primary') {\n\t\tif (buttonColor) {\n\t\t\treturn `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\tbuttonColor,\n\t\t\t\t50,\n\t\t\t)};`;\n\t\t}\n\t\treturn `background-color: ${\n\t\t\tinverse ? COLORS.background.warning.vibrant : COLORS.background.brandLight\n\t\t};`;\n\t}\n\tif (type === 'destructive') {\n\t\treturn `background-color: ${COLORS.background.negative.light};`;\n\t}\n\treturn 'background-color: transparent;';\n};\n\nexport const getLoadingBorder = (type: Type, size: Size, inverse?: boolean) => {\n\tif (type === 'special') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: none;`;\n\t}\n\tif (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid ${COLORS.content.secondary};`\n\t\t\t: `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\treturn '';\n};\n\nexport const SpinnerColorMap = (type: Type, inverse?: boolean) => {\n\tif (type === 'secondaryGray') return COLORS.content.secondary;\n\tif (inverse) {\n\t\tif (type === 'primary') {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t}\n\tif (type === 'destructive') {\n\t\treturn COLORS.content.negative;\n\t}\n\treturn COLORS.content.brand;\n};\n\nexport const getButtonIconColor = (\n\tsize: Size,\n\ttype: Type,\n\tinverse?: boolean,\n\tdisabled?: boolean,\n\tisLoading?: boolean,\n\tdarkMode?: boolean,\n) => {\n\tif (size === 'chip') {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t} else if (darkMode) {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n\tif (isLoading) {\n\t\treturn 'transparent';\n\t}\n\tif (type === 'special') {\n\t\treturn disabled ? COLORS.content.inactive : COLORS.background.inverseLight;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn disabled ? COLORS.content.inactive : COLORS.content.secondary;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t} else if (type === 'secondary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiaryGray' || type.startsWith('dash')) {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n};\n"],"names":["getBackgroundColor","type","size","inverse","darkMode","buttonColor","COLORS","getColor","getDisabledTextColor","getPadding","GetButtonTextComponent","disabled","ButtonRegularAI","ButtonLargeAI","BodySecondary","BodyCaption","ButtonRegular","ButtonLarge","getBorderColor","error","getBorder","version","getLinearGradientValue","getHoverButtonBackgroundCustom","color","percent","num","amt","R","G","B","getLoadingButtonBackgroundCustom","getHoverButtonBackground","getHoverButtonTextDecorationStyle","generateInverseHoverBackground","generateDisabledStyling","getDashedBorderStyling","borderColor","getClickEffect","getLoadingBackground","getLoadingBorder","SpinnerColorMap","getButtonIconColor","isLoading"],"mappings":"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"}
+{"version":3,"file":"themes.js","sources":["../../../../src/components/button/themes.tsx"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tButtonLarge,\n\tButtonLargeAI,\n\tButtonRegular,\n\tButtonRegularAI,\n} from '../TypographyStyle';\nimport { Size, Type } from './model';\n\nexport const getBackgroundColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n\tbuttonColor?: string,\n): string => {\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn 'transparent';\n\t\t}\n\t\treturn darkMode ? COLORS.surface.hovered : COLORS.surface.subdued;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn buttonColor\n\t\t\t\t? buttonColor\n\t\t\t\t: inverse\n\t\t\t\t? COLORS.background.warning.vibrant\n\t\t\t\t: COLORS.background.inverseLight;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.background.negative.vibrant;\n\t\tcase 'tertiary':\n\t\t\treturn 'transparent';\n\t\tdefault:\n\t\t\treturn 'transparent';\n\t}\n};\n\nexport const getColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n): string => {\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn inverse ? COLORS.content.inactive : COLORS.content.brand;\n\t\t}\n\t\treturn darkMode ? COLORS.content.primary : COLORS.content.secondary;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn inverse ? COLORS.content.primary : COLORS.content.primaryInverse;\n\t\tcase 'tertiaryGray':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.content.primaryInverse;\n\t\tcase 'dashBold':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'dashRegular':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'ai':\n\t\t\treturn COLORS.content.ai;\n\t\tdefault:\n\t\t\treturn inverse ? COLORS.content.primaryInverse : COLORS.stroke.brand;\n\t}\n};\n\nexport const getDisabledTextColor = (inverse?: boolean) => {\n\tif (inverse) {\n\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t}\n\treturn COLORS.content.inactive;\n};\n\nexport const getPadding = (type: Type, size: Size) => {\n\tif (type === 'text') {\n\t\treturn '0px';\n\t} else if (size === 'chip') {\n\t\treturn '4px 8px';\n\t} else if (size === 'small') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '6px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '6px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '6px 12px';\n\t\t}\n\t} else if (size === 'medium') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '10px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '10px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '10px 12px';\n\t\t}\n\t} else if (size === 'large') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '14px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '14px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '14px 12px';\n\t\t}\n\t}\n};\nexport const GetButtonTextComponent = (\n\tsize: Size,\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (!disabled && type === 'ai') {\n\t\tif (size === 'small') {\n\t\t\treturn ButtonRegularAI;\n\t\t} else {\n\t\t\treturn ButtonLargeAI;\n\t\t}\n\t}\n\n\tif (type === 'dashRegular') {\n\t\treturn BodySecondary;\n\t}\n\tif (size === 'chip') {\n\t\treturn BodyCaption;\n\t} else if (size === 'small') {\n\t\treturn ButtonRegular;\n\t}\n\treturn ButtonLarge;\n};\n\nexport const getBorderColor = (\n\ttype: Type,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (error) {\n\t\treturn COLORS.stroke.negative.vibrant;\n\t}\n\n\tif (inverse) {\n\t\treturn COLORS.surface.standard;\n\t}\n\tif (type == 'secondary') {\n\t\treturn COLORS.stroke.brand;\n\t}\n\treturn COLORS.content.placeholder;\n};\n\nexport const getBorder = (\n\tversion: '1.0' | '2.0',\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (type == 'text') {\n\t\treturn 'border: none;';\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${\n\t\t\tCOLORS.stroke.primary\n\t\t};`;\n\t}\n\tif (inverse) {\n\t\tif (type === 'secondary') {\n\t\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\t\ttype,\n\t\t\t\tinverse,\n\t\t\t\terror,\n\t\t\t)};`;\n\t\t}\n\t\treturn 'border: none;';\n\t}\n\n\tif (type === 'secondary') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\ttype,\n\t\t\tfalse,\n\t\t\terror,\n\t\t)};`;\n\t}\n\treturn 'border: none;';\n};\n\nexport const getLinearGradientValue = (size: Size): string => {\n\tif (size === 'medium') {\n\t\treturn `5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px`;\n\t}\n\treturn `6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px`;\n};\n\n/**\n * Adjusts the brightness of a given hex color by a specified percentage.\n * Below function is used to generate a hover effect for button backgrounds.\n *\n * @param {string} color - The hex color code to be adjusted (e.g., \"#ff0000\").\n * @param {number} percent - The percentage by which to darken the color. Positive values darken the color.\n * @returns {string} - The adjusted hex color code.\n *\n * @example\n * // Darken the color #ff0000 (red) by 10%\n * const darkerRed = getHoverButtonBackgroundCustom(\"#ff0000\", 10);\n * console.log(darkerRed); // Output might be \"#e60000\"\n */\n\nexport const getHoverButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) - amt,\n\t\tG = ((num >> 8) & 0x00ff) - amt,\n\t\tB = (num & 0x0000ff) - amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.max(R, 0) << 16) +\n\t\t(Math.max(G, 0) << 8) +\n\t\tMath.max(B, 0)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\n/**\n * Generates a new color by adjusting the brightness of the given color by a specified percentage.\n *\n * @param color - The original color in hexadecimal format (e.g., \"#RRGGBB\").\n * @param percent - The percentage to adjust the brightness. Positive values will lighten the color, while negative values will darken it.\n * @returns The new color in hexadecimal format after adjusting the brightness.\n *\n * @example\n * // Lighten the color by 20%\n * const newColor = getLoadingButtonBackgroundCustom(\"#ff0000\", 20); // \"#ff3333\"\n *\n * @example\n * // Darken the color by 10%\n * const newColor = getLoadingButtonBackgroundCustom(\"#00ff00\", -10); // \"#00e600\"\n */\nexport const getLoadingButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) + amt,\n\t\tG = ((num >> 8) & 0x00ff) + amt,\n\t\tB = (num & 0x0000ff) + amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.min(R, 255) << 16) +\n\t\t(Math.min(G, 255) << 8) +\n\t\tMath.min(B, 255)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\nexport const getHoverButtonBackground = (type: Type, inverse?: boolean) => {\n\tif (type === 'ai') {\n\t\treturn `background: ${COLORS.surface.aiLight};`;\n\t}\n\n\tif (type === 'text') {\n\t\treturn `background-color:transparent;`;\n\t}\n\tif (!inverse && type !== 'primary') {\n\t\treturn `background-color: #000000;\n\t\t\t\topacity: 0.03;`;\n\t}\n\n\treturn ``;\n};\n\nexport const getHoverButtonTextDecorationStyle = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\treturn `text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n};\n\nexport const generateInverseHoverBackground = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\tif (type === 'primary') {\n\t\treturn `background-color: ${COLORS.stroke.warning.lightAlt};`;\n\t}\n\treturn `background-color: rgba(255, 255, 255, 0.1)`;\n};\n\nexport const generateDisabledStyling = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n) => {\n\tif (size === 'chip') {\n\t\treturn `background-color: transparent;`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\treturn inverse\n\t\t\t? 'background-color: rgba(255,255,255,0.3);'\n\t\t\t: `background-color: ${COLORS.background.inactive};`;\n\t} else if (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid rgba(255, 255, 255, 0.5);`\n\t\t\t: `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\treturn '';\n};\n\nexport const getDashedBorderStyling = (\n\ttype: Type,\n\tsize: Size,\n\tborderColor: string = getBorderColor(type, false),\n) => {\n\treturn `\n\t.line-top {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-right {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-bottom {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tbottom: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-left {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t`;\n};\n\nexport const getClickEffect = (type: Type, size: Size, inverse?: boolean) => {\n\tif (type === 'text') {\n\t\treturn `background-color: ${COLORS.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};\n\t\tbackground-color: ${COLORS.background.brandLight};`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\treturn `background-color: ${COLORS.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`;\n\t\t}\n\t\treturn 'box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);';\n\t} else if (\n\t\ttype === 'secondary' ||\n\t\ttype === 'tertiary' ||\n\t\ttype === 'tertiaryGray' ||\n\t\ttype.startsWith('dash')\n\t) {\n\t\treturn inverse\n\t\t\t? `background-color: ${COLORS.background.inverseLight}  !important;`\n\t\t\t: `background-color: ${COLORS.background.brandLight};`;\n\t}\n};\nexport const getLoadingBackground = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tbuttonColor?: string,\n) => {\n\tif (size === 'chip') {\n\t\treturn `background-color: ${COLORS.background.base};`;\n\t}\n\tif (type === 'primary') {\n\t\tif (buttonColor) {\n\t\t\treturn `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\tbuttonColor,\n\t\t\t\t50,\n\t\t\t)};`;\n\t\t}\n\t\treturn `background-color: ${\n\t\t\tinverse ? COLORS.background.warning.vibrant : COLORS.background.brandLight\n\t\t};`;\n\t}\n\tif (type === 'destructive') {\n\t\treturn `background-color: ${COLORS.background.negative.light};`;\n\t}\n\treturn 'background-color: transparent;';\n};\n\nexport const getLoadingBorder = (type: Type, size: Size, inverse?: boolean) => {\n\tif (size === 'chip') {\n\t\treturn `border: none;`;\n\t}\n\tif (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid ${COLORS.content.secondary};`\n\t\t\t: `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\treturn '';\n};\n\nexport const SpinnerColorMap = (type: Type, inverse?: boolean) => {\n\tif (inverse) {\n\t\tif (type === 'primary') {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t}\n\tif (type === 'destructive') {\n\t\treturn COLORS.content.negative;\n\t}\n\treturn COLORS.content.brand;\n};\n\nexport const getButtonIconColor = (\n\tsize: Size,\n\ttype: Type,\n\tinverse?: boolean,\n\tdisabled?: boolean,\n\tisLoading?: boolean,\n\tdarkMode?: boolean,\n) => {\n\tif (size === 'chip') {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t} else if (darkMode) {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n\tif (isLoading) {\n\t\treturn 'transparent';\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t} else if (type === 'secondary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiaryGray' || type.startsWith('dash')) {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n};\n"],"names":["getBackgroundColor","type","size","inverse","darkMode","buttonColor","COLORS","getColor","getDisabledTextColor","getPadding","GetButtonTextComponent","disabled","ButtonRegularAI","ButtonLargeAI","BodySecondary","BodyCaption","ButtonRegular","ButtonLarge","getBorderColor","error","getBorder","version","getLinearGradientValue","getHoverButtonBackgroundCustom","color","percent","num","amt","R","G","B","getLoadingButtonBackgroundCustom","getHoverButtonBackground","getHoverButtonTextDecorationStyle","generateInverseHoverBackground","generateDisabledStyling","getDashedBorderStyling","borderColor","getClickEffect","getLoadingBackground","getLoadingBorder","SpinnerColorMap","getButtonIconColor","isLoading"],"mappings":"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"}

package/dist/esm/components/checkBox/CheckBox.d.ts

@@ -6,7 +6,7 @@ export type CheckBoxProps = {
     value?: string;
     onValueChange: (checked: boolean, value?: string, event?: React.MouseEvent) => void;
     label?: string;
-    size?: 'DEFAULT' | 'SMALL' | 'XS';
+    size?: 'DEFAULT' | 'SMALL';
     skipHoverState?: boolean;
     labelSize?: 'DEFAULT' | 'SMALL';
     rightComponent?: JSX.Element;
@@ -16,6 +16,5 @@ export type CheckBoxProps = {
     style?: React.CSSProperties;
     enableHover?: boolean;
     activeColor?: string;
-    labelTypography?: 'bodyCaption' | 'bodySecondary' | 'bodyPrimary' | 'titleSmall';
 };
 export declare const CheckBox: React.FC<CheckBoxProps>;

package/dist/esm/components/checkBox/CheckBox.js

@@ -1,56 +1,44 @@
-import { jsxs as m, jsx as t, Fragment as L } from "react/jsx-runtime";
-import { useState as c, useEffect as o, useMemo as S } from "react";
-import { CheckboxContainer as z, CheckboxIcon as M } from "./CheckBox.styled.js";
-import { TitleSmall as C, BodyPrimary as f, BodySecondary as s, BodyCaption as k, TitleRegular as P } from "../TypographyStyle.js";
-import { COLORS as i } from "../../constants/Theme.js";
-const B = (e) => {
-  const a = S(
-    () => e.activeColor || i.background.positive.vibrant,
+import { jsxs as f, jsx as i, Fragment as y } from "react/jsx-runtime";
+import { useState as a, useEffect as n, useMemo as w } from "react";
+import { CheckboxContainer as g, CheckboxIcon as D } from "./CheckBox.styled.js";
+import { TitleRegular as L, TitleSmall as M, BodySecondary as C, BodyPrimary as P } from "../TypographyStyle.js";
+import { COLORS as l } from "../../constants/Theme.js";
+const z = (e) => {
+  const t = w(
+    () => e.activeColor || l.background.positive.vibrant,
     [e.activeColor]
-  ), l = e.size === "XS" ? {
-    box: 12,
-    check: { w: 6, h: 5, x: 3, y: 3.5 },
-    partial: { x: 3, y: 5, w: 6 }
-  } : e.size === "SMALL" ? {
-    box: 16,
-    check: { w: 8, h: 7, x: 4, y: 4 },
-    partial: { x: 5, y: 7, w: 6 }
-  } : {
-    box: 18,
-    check: { w: 10, h: 9, x: 4, y: 4 },
-    partial: { x: 5, y: 8, w: 8 }
-  };
-  return /* @__PURE__ */ m(
+  );
+  return /* @__PURE__ */ f(
     "svg",
     {
-      width: l.box,
-      height: l.box,
-      viewBox: `0 0 ${l.box} ${l.box}`,
+      width: e.isSmall ? "16" : "18",
+      height: e.isSmall ? "16" : "18",
+      viewBox: e.isSmall ? "0 0 16 16" : "0 0 18 18",
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ i(
           "rect",
           {
             x: "0",
             y: "0",
-            width: l.box,
-            height: l.box,
+            width: e.isSmall ? "16" : "18",
+            height: e.isSmall ? "16" : "18",
             rx: "4",
-            fill: e.isDisabled ? i.content.inactive : a
+            fill: e.isDisabled ? l.content.inactive : t
           }
         ),
-        !e.isPartial && /* @__PURE__ */ t(
+        !e.isPartial && /* @__PURE__ */ i(
           "svg",
           {
-            width: l.check.w,
-            height: l.check.h,
-            x: l.check.x,
-            y: l.check.y,
+            width: e.isSmall ? "8" : "10",
+            height: e.isSmall ? "7" : "9",
+            x: "4",
+            y: "4",
             viewBox: "0 0 10 9",
             fill: "none",
             xmlns: "http://www.w3.org/2000/svg",
-            children: /* @__PURE__ */ t(
+            children: /* @__PURE__ */ i(
               "path",
               {
                 fillRule: "evenodd",
@@ -61,125 +49,100 @@ const B = (e) => {
             )
           }
         ),
-        e.isPartial && /* @__PURE__ */ t(
+        e.isPartial && /* @__PURE__ */ i(
           "rect",
           {
-            x: l.partial.x,
-            y: l.partial.y,
-            width: l.partial.w,
+            x: "5",
+            y: e.isSmall ? "7" : "8",
+            width: e.isSmall ? "6" : "8",
             height: "2",
             rx: "1",
-            fill: i.surface.standard
+            fill: l.surface.standard
           }
         )
       ]
     }
   );
 }, E = (e) => {
-  const [a, l] = c(e.isChecked || !1), [d, h] = c(
+  const [t, s] = a(e.isChecked || !1), [d, r] = a(
     e.isPartiallyChecked || !1
-  ), [n, w] = c(e.isDisabled || !1), [u, b] = c(!1), [v, x] = c(!1), g = (r) => {
+  ), [c, m] = a(e.isDisabled || !1), [k, h] = a(!1), [x, o] = a(!1), v = (S) => {
     if (!e.isDisabled) {
-      const y = !a;
-      d ? h(!d) : l(y), e.onValueChange?.(y, e.value, r);
+      const b = !t;
+      d ? r(!d) : s(b), e.onValueChange?.(b, e.value, S);
     }
   };
-  o(() => {
-    l(e.isChecked);
-  }, [e.isChecked]), o(() => {
-    w(e.isDisabled || !1);
-  }, [e.isDisabled]), o(() => {
-    h(e.isPartiallyChecked || !1);
+  n(() => {
+    s(e.isChecked);
+  }, [e.isChecked]), n(() => {
+    m(e.isDisabled || !1);
+  }, [e.isDisabled]), n(() => {
+    r(e.isPartiallyChecked || !1);
   }, [e.isPartiallyChecked]);
-  const D = () => {
-    if (!e.label)
-      return /* @__PURE__ */ t(L, {});
-    if (e.labelTypography) {
-      const r = {
-        bodyCaption: k,
-        bodySecondary: s,
-        bodyPrimary: f,
-        titleSmall: C
-      }[e.labelTypography];
-      return /* @__PURE__ */ t(
-        r,
-        {
-          color: e.isDisabled ? i.text.disabled : i.text.primary,
-          children: e.label
-        }
-      );
+  const u = () => e.label ? e.boldOnChecked && t || e.bold ? e.labelSize === "DEFAULT" ? /* @__PURE__ */ i(
+    L,
+    {
+      color: e.isDisabled ? l.text.disabled : l.text.primary,
+      children: e.label
     }
-    return e.size === "XS" ? /* @__PURE__ */ t(
-      k,
-      {
-        color: e.isDisabled ? i.text.disabled : i.text.primary,
-        children: e.label
-      }
-    ) : e.boldOnChecked && a || e.bold ? e.labelSize === "DEFAULT" ? /* @__PURE__ */ t(
-      P,
-      {
-        color: e.isDisabled ? i.text.disabled : i.text.primary,
-        children: e.label
-      }
-    ) : /* @__PURE__ */ t(
-      C,
-      {
-        color: e.isDisabled ? i.text.disabled : i.text.primary,
-        children: e.label
-      }
-    ) : e.size === "SMALL" ? /* @__PURE__ */ t(
-      s,
-      {
-        color: e.isDisabled ? i.text.disabled : i.text.primary,
-        children: e.label
-      }
-    ) : e.labelSize === "SMALL" ? /* @__PURE__ */ t(
-      s,
-      {
-        color: e.isDisabled ? i.text.disabled : i.text.primary,
-        children: e.label
-      }
-    ) : /* @__PURE__ */ t(
-      f,
-      {
-        color: e.isDisabled ? i.text.disabled : i.text.primary,
-        children: e.label
-      }
-    );
-  };
-  return /* @__PURE__ */ m(
-    z,
+  ) : /* @__PURE__ */ i(
+    M,
+    {
+      color: e.isDisabled ? l.text.disabled : l.text.primary,
+      children: e.label
+    }
+  ) : e.size === "SMALL" ? /* @__PURE__ */ i(
+    C,
+    {
+      color: e.isDisabled ? l.text.disabled : l.text.primary,
+      children: e.label
+    }
+  ) : e.labelSize === "SMALL" ? /* @__PURE__ */ i(
+    C,
+    {
+      color: e.isDisabled ? l.text.disabled : l.text.primary,
+      children: e.label
+    }
+  ) : /* @__PURE__ */ i(
+    P,
+    {
+      color: e.isDisabled ? l.text.disabled : l.text.primary,
+      children: e.label
+    }
+  ) : /* @__PURE__ */ i(y, {});
+  return /* @__PURE__ */ f(
+    g,
     {
-      onClick: g,
-      onMouseEnter: () => b(!e.skipHoverState),
-      onMouseLeave: () => b(!1),
-      onMouseDown: () => x(!e.skipHoverState),
-      onMouseUp: () => x(!1),
-      isDisabled: n,
+      onClick: v,
+      onMouseEnter: () => h(!e.skipHoverState),
+      onMouseLeave: () => h(!1),
+      onMouseDown: () => o(!e.skipHoverState),
+      onMouseUp: () => o(!1),
+      isDisabled: c,
       enableHover: e.enableHover,
       style: e.style ?? {},
       children: [
-        /* @__PURE__ */ t(
-          M,
+        /* @__PURE__ */ i(
+          D,
           {
-            checked: a,
-            hovered: u,
-            clicked: v,
-            isDisabled: n,
+            checked: t,
+            hovered: k,
+            clicked: x,
+            isDisabled: c,
             size: e.size,
             borderColor: e.checkboxBorderColor,
-            children: a && /* @__PURE__ */ t(
-              B,
+            children: t && /* @__PURE__ */ i(
+              z,
               {
                 isPartial: d || !1,
-                isDisabled: n,
-                size: e.size,
+                isDisabled: c,
+                isSmall: e.size === "SMALL",
                 activeColor: e?.activeColor
               }
             )
           }
         ),
-        D(),
+        u(),
         e.rightComponent
       ]
     }

package/dist/esm/components/checkBox/CheckBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckBox.js","sources":["../../../../src/components/checkBox/CheckBox.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport {\n\tCheckboxContainer,\n\tCheckboxIcon,\n} from '@src/components/checkBox/CheckBox.styled';\nimport {\n\tBodyCaption,\n\tBodyPrimary,\n\tBodySecondary,\n\tTitleRegular,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport type CheckBoxProps = {\n\tisChecked: boolean;\n\tisPartiallyChecked?: boolean;\n\tisDisabled?: boolean;\n\tvalue?: string;\n\tonValueChange: (\n\t\tchecked: boolean,\n\t\tvalue?: string,\n\t\tevent?: React.MouseEvent,\n\t) => void;\n\tlabel?: string;\n\tsize?: 'DEFAULT' | 'SMALL' | 'XS';\n\tskipHoverState?: boolean;\n\tlabelSize?: 'DEFAULT' | 'SMALL';\n\trightComponent?: JSX.Element;\n\tcheckboxBorderColor?: string;\n\tboldOnChecked?: boolean;\n\tbold?: boolean;\n\tstyle?: React.CSSProperties;\n\tenableHover?: boolean;\n\tactiveColor?: string;\n\tlabelTypography?:\n\t\t| 'bodyCaption'\n\t\t| 'bodySecondary'\n\t\t| 'bodyPrimary'\n\t\t| 'titleSmall';\n};\n\nconst CheckMark: React.FC<{\n\tisPartial: boolean;\n\tisDisabled: boolean;\n\tsize?: 'DEFAULT' | 'SMALL' | 'XS';\n\tactiveColor?: string;\n}> = (props) => {\n\tconst fillColor = useMemo(\n\t\t() => props.activeColor || COLORS.background.positive.vibrant,\n\t\t[props.activeColor],\n\t);\n\n\t// Box (and inner check) dimensions per size — XS renders a 12x12 mark.\n\tconst dims =\n\t\tprops.size === 'XS'\n\t\t\t? {\n\t\t\t\t\tbox: 12,\n\t\t\t\t\tcheck: { w: 6, h: 5, x: 3, y: 3.5 },\n\t\t\t\t\tpartial: { x: 3, y: 5, w: 6 },\n\t\t\t  }\n\t\t\t: props.size === 'SMALL'\n\t\t\t? {\n\t\t\t\t\tbox: 16,\n\t\t\t\t\tcheck: { w: 8, h: 7, x: 4, y: 4 },\n\t\t\t\t\tpartial: { x: 5, y: 7, w: 6 },\n\t\t\t  }\n\t\t\t: {\n\t\t\t\t\tbox: 18,\n\t\t\t\t\tcheck: { w: 10, h: 9, x: 4, y: 4 },\n\t\t\t\t\tpartial: { x: 5, y: 8, w: 8 },\n\t\t\t  };\n\n\treturn (\n\t\t<svg\n\t\t\twidth={dims.box}\n\t\t\theight={dims.box}\n\t\t\tviewBox={`0 0 ${dims.box} ${dims.box}`}\n\t\t\tfill=\"none\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t>\n\t\t\t<rect\n\t\t\t\tx=\"0\"\n\t\t\t\ty=\"0\"\n\t\t\t\twidth={dims.box}\n\t\t\t\theight={dims.box}\n\t\t\t\trx=\"4\"\n\t\t\t\tfill={props.isDisabled ? COLORS.content.inactive : fillColor}\n\t\t\t/>\n\t\t\t{!props.isPartial && (\n\t\t\t\t<svg\n\t\t\t\t\twidth={dims.check.w}\n\t\t\t\t\theight={dims.check.h}\n\t\t\t\t\tx={dims.check.x}\n\t\t\t\t\ty={dims.check.y}\n\t\t\t\t\tviewBox=\"0 0 10 9\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\t\t\td=\"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z\"\n\t\t\t\t\t\tfill=\"white\"\n\t\t\t\t\t/>\n\t\t\t\t</svg>\n\t\t\t)}\n\t\t\t{props.isPartial && (\n\t\t\t\t<rect\n\t\t\t\t\tx={dims.partial.x}\n\t\t\t\t\ty={dims.partial.y}\n\t\t\t\t\twidth={dims.partial.w}\n\t\t\t\t\theight=\"2\"\n\t\t\t\t\trx=\"1\"\n\t\t\t\t\tfill={COLORS.surface.standard}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</svg>\n\t);\n};\n\nexport const CheckBox: React.FC<CheckBoxProps> = (props) => {\n\tconst [isChecked, setIsChecked] = useState(props.isChecked || false);\n\tconst [isPartiallyChecked, setIsPartiallyChecked] = useState(\n\t\tprops.isPartiallyChecked || false,\n\t);\n\tconst [isDisabled, setIsDisabled] = useState(props.isDisabled || false);\n\tconst [isHovered, setIsHovered] = useState(false);\n\tconst [isClicked, setIsClicked] = useState(false);\n\n\tconst handleCheck = (event: React.MouseEvent) => {\n\t\tif (!props.isDisabled) {\n\t\t\tconst newVal = !isChecked;\n\t\t\tif (isPartiallyChecked) {\n\t\t\t\tsetIsPartiallyChecked(!isPartiallyChecked);\n\t\t\t} else {\n\t\t\t\tsetIsChecked(newVal);\n\t\t\t}\n\t\t\tprops.onValueChange?.(newVal, props.value, event);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tsetIsChecked(props.isChecked);\n\t}, [props.isChecked]);\n\n\tuseEffect(() => {\n\t\tsetIsDisabled(props.isDisabled || false);\n\t}, [props.isDisabled]);\n\n\tuseEffect(() => {\n\t\tsetIsPartiallyChecked(props.isPartiallyChecked || false);\n\t}, [props.isPartiallyChecked]);\n\n\tconst renderLabel = () => {\n\t\tif (!props.label) {\n\t\t\treturn <></>;\n\t\t}\n\n\t\tif (props.labelTypography) {\n\t\t\tconst LabelTypography = {\n\t\t\t\tbodyCaption: BodyCaption,\n\t\t\t\tbodySecondary: BodySecondary,\n\t\t\t\tbodyPrimary: BodyPrimary,\n\t\t\t\ttitleSmall: TitleSmall,\n\t\t\t}[props.labelTypography];\n\t\t\treturn (\n\t\t\t\t<LabelTypography\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</LabelTypography>\n\t\t\t);\n\t\t}\n\n\t\tif (props.size === 'XS') {\n\t\t\treturn (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodyCaption>\n\t\t\t);\n\t\t}\n\n\t\tif ((props.boldOnChecked && isChecked) || props.bold) {\n\t\t\tif (props.labelSize === 'DEFAULT') {\n\t\t\t\treturn (\n\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\tprops.isDisabled ? COLORS.text.disabled : COLORS.text.primary\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.label}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TitleSmall\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</TitleSmall>\n\t\t\t);\n\t\t}\n\n\t\tif (props.size === 'SMALL') {\n\t\t\treturn (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodySecondary>\n\t\t\t);\n\t\t}\n\n\t\tif (props.labelSize === 'SMALL') {\n\t\t\treturn (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodySecondary>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<BodyPrimary\n\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t>\n\t\t\t\t{props.label}\n\t\t\t</BodyPrimary>\n\t\t);\n\t};\n\n\treturn (\n\t\t<CheckboxContainer\n\t\t\tonClick={handleCheck}\n\t\t\tonMouseEnter={() => setIsHovered(!props.skipHoverState)}\n\t\t\tonMouseLeave={() => setIsHovered(false)}\n\t\t\tonMouseDown={() => setIsClicked(!props.skipHoverState)}\n\t\t\tonMouseUp={() => setIsClicked(false)}\n\t\t\tisDisabled={isDisabled}\n\t\t\tenableHover={props.enableHover}\n\t\t\tstyle={props.style ?? {}}\n\t\t>\n\t\t\t<CheckboxIcon\n\t\t\t\tchecked={isChecked}\n\t\t\t\thovered={isHovered}\n\t\t\t\tclicked={isClicked}\n\t\t\t\tisDisabled={isDisabled}\n\t\t\t\tsize={props.size}\n\t\t\t\tborderColor={props.checkboxBorderColor}\n\t\t\t>\n\t\t\t\t{isChecked && (\n\t\t\t\t\t<CheckMark\n\t\t\t\t\t\tisPartial={isPartiallyChecked || false}\n\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\tsize={props.size}\n\t\t\t\t\t\tactiveColor={props?.activeColor}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</CheckboxIcon>\n\t\t\t{renderLabel()}\n\t\t\t{props.rightComponent}\n\t\t</CheckboxContainer>\n\t);\n};\n"],"names":["CheckMark","props","fillColor","useMemo","COLORS","dims","jsxs","jsx","CheckBox","isChecked","setIsChecked","useState","isPartiallyChecked","setIsPartiallyChecked","isDisabled","setIsDisabled","isHovered","setIsHovered","isClicked","setIsClicked","handleCheck","event","newVal","useEffect","renderLabel","Fragment","LabelTypography","BodyCaption","BodySecondary","BodyPrimary","TitleSmall","TitleRegular","CheckboxContainer","CheckboxIcon"],"mappings":"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"}
+{"version":3,"file":"CheckBox.js","sources":["../../../../src/components/checkBox/CheckBox.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport {\n\tCheckboxContainer,\n\tCheckboxIcon,\n} from '@src/components/checkBox/CheckBox.styled';\nimport {\n\tBodyPrimary,\n\tBodySecondary,\n\tTitleRegular,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport type CheckBoxProps = {\n\tisChecked: boolean;\n\tisPartiallyChecked?: boolean;\n\tisDisabled?: boolean;\n\tvalue?: string;\n\tonValueChange: (\n\t\tchecked: boolean,\n\t\tvalue?: string,\n\t\tevent?: React.MouseEvent,\n\t) => void;\n\tlabel?: string;\n\tsize?: 'DEFAULT' | 'SMALL';\n\tskipHoverState?: boolean;\n\tlabelSize?: 'DEFAULT' | 'SMALL';\n\trightComponent?: JSX.Element;\n\tcheckboxBorderColor?: string;\n\tboldOnChecked?: boolean;\n\tbold?: boolean;\n\tstyle?: React.CSSProperties;\n\tenableHover?: boolean;\n\tactiveColor?: string;\n};\n\nconst CheckMark: React.FC<{\n\tisPartial: boolean;\n\tisDisabled: boolean;\n\tisSmall: boolean;\n\tactiveColor?: string;\n}> = (props) => {\n\tconst fillColor = useMemo(\n\t\t() => props.activeColor || COLORS.background.positive.vibrant,\n\t\t[props.activeColor],\n\t);\n\n\treturn (\n\t\t<svg\n\t\t\twidth={props.isSmall ? '16' : '18'}\n\t\t\theight={props.isSmall ? '16' : '18'}\n\t\t\tviewBox={props.isSmall ? '0 0 16 16' : '0 0 18 18'}\n\t\t\tfill=\"none\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t>\n\t\t\t<rect\n\t\t\t\tx=\"0\"\n\t\t\t\ty=\"0\"\n\t\t\t\twidth={props.isSmall ? '16' : '18'}\n\t\t\t\theight={props.isSmall ? '16' : '18'}\n\t\t\t\trx=\"4\"\n\t\t\t\tfill={props.isDisabled ? COLORS.content.inactive : fillColor}\n\t\t\t/>\n\t\t\t{!props.isPartial && (\n\t\t\t\t<svg\n\t\t\t\t\twidth={props.isSmall ? '8' : '10'}\n\t\t\t\t\theight={props.isSmall ? '7' : '9'}\n\t\t\t\t\tx=\"4\"\n\t\t\t\t\ty=\"4\"\n\t\t\t\t\tviewBox=\"0 0 10 9\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\t\t\td=\"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z\"\n\t\t\t\t\t\tfill=\"white\"\n\t\t\t\t\t/>\n\t\t\t\t</svg>\n\t\t\t)}\n\t\t\t{props.isPartial && (\n\t\t\t\t<rect\n\t\t\t\t\tx=\"5\"\n\t\t\t\t\ty={props.isSmall ? '7' : '8'}\n\t\t\t\t\twidth={props.isSmall ? '6' : '8'}\n\t\t\t\t\theight=\"2\"\n\t\t\t\t\trx=\"1\"\n\t\t\t\t\tfill={COLORS.surface.standard}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</svg>\n\t);\n};\n\nexport const CheckBox: React.FC<CheckBoxProps> = (props) => {\n\tconst [isChecked, setIsChecked] = useState(props.isChecked || false);\n\tconst [isPartiallyChecked, setIsPartiallyChecked] = useState(\n\t\tprops.isPartiallyChecked || false,\n\t);\n\tconst [isDisabled, setIsDisabled] = useState(props.isDisabled || false);\n\tconst [isHovered, setIsHovered] = useState(false);\n\tconst [isClicked, setIsClicked] = useState(false);\n\n\tconst handleCheck = (event: React.MouseEvent) => {\n\t\tif (!props.isDisabled) {\n\t\t\tconst newVal = !isChecked;\n\t\t\tif (isPartiallyChecked) {\n\t\t\t\tsetIsPartiallyChecked(!isPartiallyChecked);\n\t\t\t} else {\n\t\t\t\tsetIsChecked(newVal);\n\t\t\t}\n\t\t\tprops.onValueChange?.(newVal, props.value, event);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tsetIsChecked(props.isChecked);\n\t}, [props.isChecked]);\n\n\tuseEffect(() => {\n\t\tsetIsDisabled(props.isDisabled || false);\n\t}, [props.isDisabled]);\n\n\tuseEffect(() => {\n\t\tsetIsPartiallyChecked(props.isPartiallyChecked || false);\n\t}, [props.isPartiallyChecked]);\n\n\tconst renderLabel = () => {\n\t\tif (!props.label) {\n\t\t\treturn <></>;\n\t\t}\n\n\t\tif ((props.boldOnChecked && isChecked) || props.bold) {\n\t\t\tif (props.labelSize === 'DEFAULT') {\n\t\t\t\treturn (\n\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\tprops.isDisabled ? COLORS.text.disabled : COLORS.text.primary\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.label}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TitleSmall\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</TitleSmall>\n\t\t\t);\n\t\t}\n\n\t\tif (props.size === 'SMALL') {\n\t\t\treturn (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodySecondary>\n\t\t\t);\n\t\t}\n\n\t\tif (props.labelSize === 'SMALL') {\n\t\t\treturn (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodySecondary>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<BodyPrimary\n\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t>\n\t\t\t\t{props.label}\n\t\t\t</BodyPrimary>\n\t\t);\n\t};\n\n\treturn (\n\t\t<CheckboxContainer\n\t\t\tonClick={handleCheck}\n\t\t\tonMouseEnter={() => setIsHovered(!props.skipHoverState)}\n\t\t\tonMouseLeave={() => setIsHovered(false)}\n\t\t\tonMouseDown={() => setIsClicked(!props.skipHoverState)}\n\t\t\tonMouseUp={() => setIsClicked(false)}\n\t\t\tisDisabled={isDisabled}\n\t\t\tenableHover={props.enableHover}\n\t\t\tstyle={props.style ?? {}}\n\t\t>\n\t\t\t<CheckboxIcon\n\t\t\t\tchecked={isChecked}\n\t\t\t\thovered={isHovered}\n\t\t\t\tclicked={isClicked}\n\t\t\t\tisDisabled={isDisabled}\n\t\t\t\tsize={props.size}\n\t\t\t\tborderColor={props.checkboxBorderColor}\n\t\t\t>\n\t\t\t\t{isChecked && (\n\t\t\t\t\t<CheckMark\n\t\t\t\t\t\tisPartial={isPartiallyChecked || false}\n\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\tisSmall={props.size === 'SMALL'}\n\t\t\t\t\t\tactiveColor={props?.activeColor}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</CheckboxIcon>\n\t\t\t{renderLabel()}\n\t\t\t{props.rightComponent}\n\t\t</CheckboxContainer>\n\t);\n};\n"],"names":["CheckMark","props","fillColor","useMemo","COLORS","jsxs","jsx","CheckBox","isChecked","setIsChecked","useState","isPartiallyChecked","setIsPartiallyChecked","isDisabled","setIsDisabled","isHovered","setIsHovered","isClicked","setIsClicked","handleCheck","event","newVal","useEffect","renderLabel","TitleRegular","TitleSmall","BodySecondary","BodyPrimary","Fragment","CheckboxContainer","CheckboxIcon"],"mappings":"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"}

package/dist/esm/components/checkBox/CheckBox.styled.d.ts

@@ -7,6 +7,6 @@ export declare const CheckboxIcon: import('styled-components').StyledComponent<"
     hovered: boolean;
     clicked: boolean;
     isDisabled: boolean;
-    size?: "SMALL" | "DEFAULT" | "XS" | undefined;
+    size?: "SMALL" | "DEFAULT" | undefined;
     borderColor?: string | undefined;
 }, never>;

package/dist/esm/components/checkBox/CheckBox.styled.js

@@ -10,27 +10,26 @@ const s = t.div`
 				background: ${o.surface.subdued};
 			}
 		`}
-`, n = t.div`
-	width: ${(e) => e.size === "DEFAULT" ? 14 : 12}px;
-	height: ${(e) => e.size === "DEFAULT" ? 14 : 12}px;
+`, l = t.div`
+	width: ${(e) => e.size === "SMALL" ? 12 : 14}px;
+	height: ${(e) => e.size === "SMALL" ? 12 : 14}px;
 	border-radius: 4px;
 	border: 2px solid black;
 	display: flex;
 	justify-content: center;
 	align-items: center;
-	/* XS is a true 12x12 box (border drawn inside); other sizes keep content-box. */
-	box-sizing: ${(e) => e.size === "XS" ? "border-box" : "content-box"};
+	box-sizing: content-box;
 	${(e) => e.isDisabled ? i`
-					border: ${e.size === "DEFAULT" ? 2 : 1.5}px solid
+					border: ${e.size === "SMALL" ? 1.5 : 2}px solid
 						${o.content.inactive};
 			  ` : i`
-					border: ${e.size === "DEFAULT" ? 2 : 1.5}px solid
+					border: ${e.size === "SMALL" ? 1.5 : 2}px solid
 						${e.borderColor ?? "black"};
 			  `}
 	${(e) => e.checked && i`
 			border: 0px;
-			width: ${e.size === "XS" ? 12 : 18}px;
-			height: ${e.size === "XS" ? 12 : 18}px;
+			width: 18px;
+			height: 18px;
 		`}
 	${(e) => e.hovered && i`
 			outline: 3px solid ${o.surface.hovered};
@@ -43,6 +42,6 @@ const s = t.div`
 `;
 export {
   s as CheckboxContainer,
-  n as CheckboxIcon
+  l as CheckboxIcon
 };
 //# sourceMappingURL=CheckBox.styled.js.map