npm - @bikdotai/bik-component-library - Versions diffs - 0.0.807-beta.2 → 0.0.808-beta.0 - Mend

@bikdotai/bik-component-library 0.0.807-beta.2 → 0.0.808-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1549) hide show

package/dist/cjs/components/button/themes.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../constants/Theme.js"),r=require("../TypographyStyle.js");const n=(r,n,e)=>e?t.COLORS.stroke.negative.vibrant:n?t.COLORS.surface.standard:"secondary"==r?t.COLORS.stroke.brand:t.COLORS.content.placeholder,e=t=>"medium"===t?"5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px":"6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px",o=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),o=(n>>16)+e,a=(n>>8&255)+e,i=(255&n)+e;return`#${(16777216+(Math.min(o,255)<<16)+(Math.min(a,255)<<8)+Math.min(i,255)).toString(16).slice(1)}`};exports.GetButtonTextComponent=(t,n,e)=>e||"ai"!==n?"dashRegular"===n?r.BodySecondary:"chip"===t?r.BodyCaption:"small"===t?r.ButtonRegular:r.ButtonLarge:"small"===t?r.ButtonRegularAI:r.ButtonLargeAI,exports.SpinnerColorMap=(r,n)=>n?"primary"===r?t.COLORS.content.primary:t.COLORS.content.primaryInverse:"destructive"===r?t.COLORS.content.negative:t.COLORS.content.brand,exports.generateDisabledStyling=(r,n,e)=>"chip"===n?"background-color: transparent;":"primary"===r||"destructive"===r?e?"background-color: rgba(255,255,255,0.3);":`background-color: ${t.COLORS.background.inactive};`:"secondary"===r?e?"border: 1px solid rgba(255, 255, 255, 0.5);":`border: 1px solid ${t.COLORS.stroke.primary};`:"",exports.generateInverseHoverBackground=(r,n)=>n?"":"primary"===r?`background-color: ${t.COLORS.stroke.warning.lightAlt};`:"background-color: rgba(255, 255, 255, 0.1)",exports.getBackgroundColor=(r,n,e,o,a)=>{if("chip"===n)return"text"===r?"transparent":o?t.COLORS.surface.hovered:t.COLORS.surface.subdued;switch(r){case"primary":return a||(e?t.COLORS.background.warning.vibrant:t.COLORS.background.inverseLight);case"destructive":return t.COLORS.background.negative.vibrant;default:return"transparent"}},exports.getBorder=(r,e,o,a,i)=>"text"==e?"border: none;":"chip"===o?`border: ${"2.0"===r?.5:1}px solid ${t.COLORS.stroke.primary};`:a?"secondary"===e?`border: ${"2.0"===r?.5:1}px solid ${n(e,a,i)};`:"border: none;":"secondary"===e?`border: ${"2.0"===r?.5:1}px solid ${n(e,!1,i)};`:"border: none;",exports.getBorderColor=n,exports.getButtonIconColor=(r,n,e,o,a,i)=>"chip"===r?o?t.COLORS.content.inactive:i?t.COLORS.content.primary:t.COLORS.content.secondary:a?"transparent":"primary"===n||"destructive"===n?e?o?"rgba(255, 255, 255, 0.5)":t.COLORS.content.primary:o?t.COLORS.content.inactive:t.COLORS.content.primaryInverse:"secondary"===n||"tertiary"===n?e?o?"rgba(255, 255, 255, 0.5)":t.COLORS.content.primaryInverse:o?t.COLORS.content.inactive:t.COLORS.content.brand:"tertiaryGray"===n||n.startsWith("dash")?o?t.COLORS.content.inactive:t.COLORS.content.secondary:void 0,exports.getClickEffect=(r,n,e)=>"text"===r?`background-color: ${t.COLORS.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.COLORS.content.brand};`:"chip"===n?`border: 1px solid ${t.COLORS.stroke.brandLightAlt};\n\t\tbackground-color: ${t.COLORS.background.brandLight};`:"primary"===r||"destructive"===r?e?`background-color: ${t.COLORS.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`:"box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);":"secondary"===r||"tertiary"===r||"tertiaryGray"===r||r.startsWith("dash")?e?`background-color: ${t.COLORS.background.inverseLight}  !important;`:`background-color: ${t.COLORS.background.brandLight};`:void 0,exports.getColor=(r,n,e,o)=>{if("chip"===n)return"text"===r?e?t.COLORS.content.inactive:t.COLORS.content.brand:o?t.COLORS.content.primary:t.COLORS.content.secondary;switch(r){case"primary":return e?t.COLORS.content.primary:t.COLORS.content.primaryInverse;case"tertiaryGray":case"dashBold":case"dashRegular":return t.COLORS.content.secondary;case"destructive":return t.COLORS.content.primaryInverse;case"ai":return t.COLORS.content.ai;default:return e?t.COLORS.content.primaryInverse:t.COLORS.stroke.brand}},exports.getDashedBorderStyling=function(t,r){let o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:n(t,!1);return`\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\n\t\t);\n\t}\n\t`},exports.getDisabledTextColor=r=>r?"rgba(255, 255, 255, 0.5)":t.COLORS.content.inactive,exports.getHoverButtonBackground=(r,n)=>"ai"===r?`background: ${t.COLORS.surface.aiLight};`:"text"===r?"background-color:transparent;":n||"primary"===r?"":"background-color: #000000;\n\t\t\t\topacity: 0.03;",exports.getHoverButtonBackgroundCustom=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),o=(n>>16)-e,a=(n>>8&255)-e,i=(255&n)-e;return`#${(16777216+(Math.max(o,0)<<16)+(Math.max(a,0)<<8)+Math.max(i,0)).toString(16).slice(1)}`},exports.getHoverButtonTextDecorationStyle=(r,n)=>n?"":`text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.COLORS.content.brand};`,exports.getLinearGradientValue=e,exports.getLoadingBackground=(r,n,e,a)=>"chip"===n?`background-color: ${t.COLORS.background.base};`:"primary"===r?a?`background-color: ${o(a,50)};`:`background-color: ${e?t.COLORS.background.warning.vibrant:t.COLORS.background.brandLight};`:"destructive"===r?`background-color: ${t.COLORS.background.negative.light};`:"background-color: transparent;",exports.getLoadingBorder=(r,n,e)=>"chip"===n?"border: none;":"secondary"===r?e?`border: 1px solid ${t.COLORS.content.secondary};`:`border: 1px solid ${t.COLORS.stroke.brandLightAlt};`:"",exports.getLoadingButtonBackgroundCustom=o,exports.getPadding=(t,r)=>{if("text"===t)return"0px";if("chip"===r)return"4px 8px";if("small"===r)switch(t){case"tertiary":case"tertiaryGray":return"6px 4px";default:return"6px 12px"}else if("medium"===r)switch(t){case"tertiary":case"tertiaryGray":return"10px 4px";default:return"10px 12px"}else if("large"===r)switch(t){case"tertiary":case"tertiaryGray":return"14px 4px";default:return"14px 12px"}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../constants/Theme.js"),r=require("../TypographyStyle.js");const n=(r,n,e)=>e?t.COLORS.stroke.negative.vibrant:n?t.COLORS.surface.standard:"secondary"==r?t.COLORS.stroke.brand:t.COLORS.content.placeholder,e=t=>"medium"===t?"5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px":"6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px",o=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),o=(n>>16)+e,a=(n>>8&255)+e,i=(255&n)+e;return`#${(16777216+(Math.min(o,255)<<16)+(Math.min(a,255)<<8)+Math.min(i,255)).toString(16).slice(1)}`};exports.GetButtonTextComponent=(t,n,e)=>e||"ai"!==n?"dashRegular"===n?r.BodySecondary:"chip"===t?r.BodyCaption:"small"===t?r.ButtonRegular:r.ButtonLarge:"small"===t?r.ButtonRegularAI:r.ButtonLargeAI,exports.SpinnerColorMap=(r,n)=>n?"primary"===r?t.COLORS.content.primary:t.COLORS.content.primaryInverse:"destructive"===r?t.COLORS.content.negative:t.COLORS.content.brand,exports.generateDisabledStyling=(r,n,e)=>"chip"===n?"background-color: transparent;":"primary"===r||"destructive"===r?e?"background-color: rgba(255,255,255,0.3);":`background-color: ${t.COLORS.background.inactive};`:"secondary"===r?e?"border: 1px solid rgba(255, 255, 255, 0.5);":`border: 1px solid ${t.COLORS.stroke.primary};`:"",exports.generateInverseHoverBackground=(r,n)=>n?"":"primary"===r?`background-color: ${t.COLORS.stroke.warning.lightAlt};`:"background-color: rgba(255, 255, 255, 0.1)",exports.getBackgroundColor=(r,n,e,o,a)=>{if("chip"===n)return"text"===r?"transparent":o?t.COLORS.surface.hovered:t.COLORS.surface.subdued;switch(r){case"primary":return a||(e?t.COLORS.background.warning.vibrant:t.COLORS.background.inverseLight);case"destructive":return t.COLORS.background.negative.vibrant;default:return"transparent"}},exports.getBorder=(r,e,o,a,i)=>"text"==e?"border: none;":"chip"===o?`border: ${"2.0"===r?.5:1}px solid ${t.COLORS.stroke.primary};`:a?"secondary"===e?`border: ${"2.0"===r?.5:1}px solid ${n(e,a,i)};`:"border: none;":"secondary"===e?`border: ${"2.0"===r?.5:1}px solid ${n(e,!1,i)};`:"border: none;",exports.getBorderColor=n,exports.getButtonIconColor=(r,n,e,o,a,i)=>"chip"===r?o?t.COLORS.content.inactive:i?t.COLORS.content.primary:t.COLORS.content.secondary:a?"transparent":"primary"===n||"destructive"===n?e?o?"rgba(255, 255, 255, 0.5)":t.COLORS.content.primary:o?t.COLORS.content.inactive:t.COLORS.content.primaryInverse:"secondary"===n||"tertiary"===n?e?o?"rgba(255, 255, 255, 0.5)":t.COLORS.content.primaryInverse:o?t.COLORS.content.inactive:t.COLORS.content.brand:"tertiaryGray"===n||n.startsWith("dash")?o?t.COLORS.content.inactive:t.COLORS.content.secondary:void 0,exports.getClickEffect=(r,n,e)=>"text"===r?`background-color: ${t.COLORS.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.COLORS.content.brand};`:"chip"===n?`border: 1px solid ${t.COLORS.stroke.brandLightAlt};\n\t\tbackground-color: ${t.COLORS.background.brandLight};`:"primary"===r||"destructive"===r?e?`background-color: ${t.COLORS.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`:"box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);":"secondary"===r||"tertiary"===r||"tertiaryGray"===r||r.startsWith("dash")?e?`background-color: ${t.COLORS.background.inverseLight}  !important;`:`background-color: ${t.COLORS.background.brandLight};`:void 0,exports.getColor=(r,n,e,o)=>{if("chip"===n)return"text"===r?e?t.COLORS.content.inactive:t.COLORS.content.brand:o?t.COLORS.content.primary:t.COLORS.content.secondary;switch(r){case"primary":return e?t.COLORS.content.primary:t.COLORS.content.primaryInverse;case"tertiaryGray":case"dashBold":case"dashRegular":return t.COLORS.content.secondary;case"destructive":return t.COLORS.content.primaryInverse;case"ai":return t.COLORS.content.ai;default:return e?t.COLORS.content.primaryInverse:t.COLORS.stroke.brand}},exports.getDashedBorderStyling=(t,r,o=n(t,!1))=>`\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\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${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\n\t\t);\n\t}\n\t`,exports.getDisabledTextColor=r=>r?"rgba(255, 255, 255, 0.5)":t.COLORS.content.inactive,exports.getHoverButtonBackground=(r,n)=>"ai"===r?`background: ${t.COLORS.surface.aiLight};`:"text"===r?"background-color:transparent;":n||"primary"===r?"":"background-color: #000000;\n\t\t\t\topacity: 0.03;",exports.getHoverButtonBackgroundCustom=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),o=(n>>16)-e,a=(n>>8&255)-e,i=(255&n)-e;return`#${(16777216+(Math.max(o,0)<<16)+(Math.max(a,0)<<8)+Math.max(i,0)).toString(16).slice(1)}`},exports.getHoverButtonTextDecorationStyle=(r,n)=>n?"":`text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.COLORS.content.brand};`,exports.getLinearGradientValue=e,exports.getLoadingBackground=(r,n,e,a)=>"chip"===n?`background-color: ${t.COLORS.background.base};`:"primary"===r?a?`background-color: ${o(a,50)};`:`background-color: ${e?t.COLORS.background.warning.vibrant:t.COLORS.background.brandLight};`:"destructive"===r?`background-color: ${t.COLORS.background.negative.light};`:"background-color: transparent;",exports.getLoadingBorder=(r,n,e)=>"chip"===n?"border: none;":"secondary"===r?e?`border: 1px solid ${t.COLORS.content.secondary};`:`border: 1px solid ${t.COLORS.stroke.brandLightAlt};`:"",exports.getLoadingButtonBackgroundCustom=o,exports.getPadding=(t,r)=>{if("text"===t)return"0px";if("chip"===r)return"4px 8px";if("small"===r)switch(t){case"tertiary":case"tertiaryGray":return"6px 4px";default:return"6px 12px"}else if("medium"===r)switch(t){case"tertiary":case"tertiaryGray":return"10px 4px";default:return"10px 12px"}else if("large"===r)switch(t){case"tertiary":case"tertiaryGray":return"14px 4px";default:return"14px 12px"}};
 //# sourceMappingURL=themes.js.map

package/dist/cjs/components/button/themes.js.map CHANGED Viewed

	@@ -1 +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 (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","getBorderColor","type","inverse","error","COLORS","stroke","negative","vibrant","surface","standard","brand","content","placeholder","getLinearGradientValue","size","getLoadingButtonBackgroundCustom","color","percent","num","parseInt","replace","amt","Math","round","R","G","B","min","toString","slice","GetButtonTextComponent","disabled","BodySecondary","BodyCaption","ButtonRegular","ButtonLarge","ButtonRegularAI","ButtonLargeAI","SpinnerColorMap","primary","primaryInverse","generateDisabledStyling","background","inactive","generateInverseHoverBackground","warning","lightAlt","darkMode","buttonColor","hovered","subdued","inverseLight","getBorder","version","getButtonIconColor","isLoading","secondary","startsWith","getClickEffect","brandLight","brandLightAlt","getColor","ai","borderColor","arguments","length","undefined","getHoverButtonBackground","aiLight","getHoverButtonBackgroundCustom","max","getHoverButtonTextDecorationStyle","getLoadingBackground","base","light","getLoadingBorder","getPadding"],"mappings":"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"}
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 (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","getBorderColor","type","inverse","error","COLORS","stroke","negative","vibrant","surface","standard","brand","content","placeholder","getLinearGradientValue","size","getLoadingButtonBackgroundCustom","color","percent","num","parseInt","replace","amt","Math","round","R","G","B","min","toString","slice","GetButtonTextComponent","disabled","BodySecondary","BodyCaption","ButtonRegular","ButtonLarge","ButtonRegularAI","ButtonLargeAI","SpinnerColorMap","primary","primaryInverse","generateDisabledStyling","background","inactive","generateInverseHoverBackground","warning","lightAlt","darkMode","buttonColor","hovered","subdued","inverseLight","getBorder","version","getButtonIconColor","isLoading","secondary","startsWith","getClickEffect","brandLight","brandLightAlt","getColor","ai","getDashedBorderStyling","borderColor","getHoverButtonBackground","aiLight","getHoverButtonBackgroundCustom","max","getHoverButtonTextDecorationStyle","getLoadingBackground","base","light","getLoadingBorder","getPadding"],"mappings":"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"}

package/dist/cjs/components/carousel-preview/CarouselPreview.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../assets/icons/aiContentIcon.svg.js"),s=require("react"),l=require("react-slick"),t=require("./CarouselPreview.style.js"),o=require("./CarouselPreviewCard.js"),a=require("../template-preview/TemplatePreview.styled.js"),i=require("../template-context-mapper/context/templateModalContext.js"),n=require("../template-preview/helpers/templateMiscHelper.js"),d=require("../template-preview/RCS/RCSPreview.styled.js"),u=require("./CustomCarouselArrows.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=c(s),p=c(l);const w=v.default.forwardRef((s=>{let{channel:l,template:u,isPreview:c,removeBottomBorder:v,borderRadius:p,showArrows:w,hideBorder:m,showSampleValues:h}=s;var x,j;const{sliderRef:f,selectedCarouselIndex:P,cardCount:g,setIsCarouselHovered:b,cardIndex:I,showVariablePicker:R}=i.useTemplateModalContext(),q=-1==I?n.determineCardIndex(l):I,S=null===(j=null===(x=null==u?void 0:u.components)||void 0===x?void 0:x[q])||void 0===j?void 0:j.cards,A=(null==S?void 0:S.length)?e.jsx(C,{cards:S,cardCount:null!=g?g:0,selectedCarouselIndex:null!=P?P:-1,sliderRef:f,isPreview:c,showArrows:w,channel:l,template:u,setIsCarouselHovered:b,showSampleValues:!!h,showVariablePicker:R}):null;return n.isRCSChannel(l)?e.jsx(d.RCSCarousalContainer,Object.assign({borderRadius:p},{children:A})):e.jsxs(t.Container,Object.assign({removeBottomBorder:v,borderRadius:p,hideBorder:m},{children:[(!!(null==u?void 0:u.aiContentConfigId)||!!(null==u?void 0:u.isAiGenerated))&&e.jsx(a.AiContentBadge,{children:e.jsx(r.default,{width:48,height:48})}),e.jsx(o.default,{channel:l,currentTemplate:u,carouselCardIndex:-1,isPreview:c,width:"77%"}),A]}))})),C=r=>{let{cards:s,cardCount:l,selectedCarouselIndex:a,sliderRef:i,isPreview:n,showArrows:d,channel:c,template:v,setIsCarouselHovered:w,showSampleValues:C,showVariablePicker:m}=r;return e.jsx(t.CarouselSlickContainer,Object.assign({cardCount:l,selectedCarouselIndex:a,onMouseEnter:()=>!m&&(null==w?void 0:w(!0)),onMouseLeave:()=>!m&&(null==w?void 0:w(!1))},{children:e.jsx(p.default,Object.assign({ref:i,swipeToSlide:!0,draggable:!0,swipe:!0,infinite:!1,focusOnSelect:!n,centerMode:!0,arrows:d,adaptiveHeight:!0,nextArrow:e.jsx(u.CustomCarouselRightArrow,{isPreview:null!=n&&n}),prevArrow:e.jsx(u.CustomCarouselLeftArrow,{isPreview:null!=n&&n})},{children:null==s?void 0:s.map(((r,s)=>{var l,t;const a={components:r.components,mapping:null===(t=null===(l=null==v?void 0:v.mapping)||void 0===l?void 0:l.cards)||void 0===t?void 0:t[s],content:null==v?void 0:v.content,templateType:null==v?void 0:v.templateType};return e.jsx(o.default,{channel:c,currentTemplate:a,carouselCardIndex:s,isPreview:n,width:"100%",showSampleValues:C},s)}))}))}))};exports.CarouselPreview=w;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../assets/icons/aiContentIcon.svg.js"),s=require("react"),l=require("react-slick"),t=require("./CarouselPreview.style.js"),o=require("./CarouselPreviewCard.js"),a=require("../template-preview/TemplatePreview.styled.js"),i=require("../template-context-mapper/context/templateModalContext.js"),n=require("../template-preview/helpers/templateMiscHelper.js"),d=require("../template-preview/RCS/RCSPreview.styled.js"),u=require("./CustomCarouselArrows.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=c(s),p=c(l);const w=v.default.forwardRef((({channel:s,template:l,isPreview:u,removeBottomBorder:c,borderRadius:v,showArrows:p,hideBorder:w,showSampleValues:m})=>{var h,x;const{sliderRef:j,selectedCarouselIndex:f,cardCount:P,setIsCarouselHovered:g,cardIndex:b,showVariablePicker:I}=i.useTemplateModalContext(),R=-1==b?n.determineCardIndex(s):b,q=null===(x=null===(h=null==l?void 0:l.components)||void 0===h?void 0:h[R])||void 0===x?void 0:x.cards,S=(null==q?void 0:q.length)?e.jsx(C,{cards:q,cardCount:null!=P?P:0,selectedCarouselIndex:null!=f?f:-1,sliderRef:j,isPreview:u,showArrows:p,channel:s,template:l,setIsCarouselHovered:g,showSampleValues:!!m,showVariablePicker:I}):null;return n.isRCSChannel(s)?e.jsx(d.RCSCarousalContainer,Object.assign({borderRadius:v},{children:S})):e.jsxs(t.Container,Object.assign({removeBottomBorder:c,borderRadius:v,hideBorder:w},{children:[(!!(null==l?void 0:l.aiContentConfigId)||!!(null==l?void 0:l.isAiGenerated))&&e.jsx(a.AiContentBadge,{children:e.jsx(r.default,{width:48,height:48})}),e.jsx(o.default,{channel:s,currentTemplate:l,carouselCardIndex:-1,isPreview:u,width:"77%"}),S]}))})),C=({cards:r,cardCount:s,selectedCarouselIndex:l,sliderRef:a,isPreview:i,showArrows:n,channel:d,template:c,setIsCarouselHovered:v,showSampleValues:w,showVariablePicker:C})=>e.jsx(t.CarouselSlickContainer,Object.assign({cardCount:s,selectedCarouselIndex:l,onMouseEnter:()=>!C&&(null==v?void 0:v(!0)),onMouseLeave:()=>!C&&(null==v?void 0:v(!1))},{children:e.jsx(p.default,Object.assign({ref:a,swipeToSlide:!0,draggable:!0,swipe:!0,infinite:!1,focusOnSelect:!i,centerMode:!0,arrows:n,adaptiveHeight:!0,nextArrow:e.jsx(u.CustomCarouselRightArrow,{isPreview:null!=i&&i}),prevArrow:e.jsx(u.CustomCarouselLeftArrow,{isPreview:null!=i&&i})},{children:null==r?void 0:r.map(((r,s)=>{var l,t;const a={components:r.components,mapping:null===(t=null===(l=null==c?void 0:c.mapping)||void 0===l?void 0:l.cards)||void 0===t?void 0:t[s],content:null==c?void 0:c.content,templateType:null==c?void 0:c.templateType};return e.jsx(o.default,{channel:d,currentTemplate:a,carouselCardIndex:s,isPreview:i,width:"100%",showSampleValues:w},s)}))}))}));exports.CarouselPreview=w;
 //# sourceMappingURL=CarouselPreview.js.map

package/dist/cjs/components/carousel-preview/CarouselPreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarouselPreview.js","sources":["../../../../src/components/carousel-preview/CarouselPreview.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport AiContentIcon from '@src/assets/icons/aiContentIcon.svg';\nimport React from 'react';\nimport Slider from 'react-slick';\nimport 'slick-carousel/slick/slick-theme.css';\nimport 'slick-carousel/slick/slick.css';\nimport {\n\tCarouselSlickContainer,\n\tContainer,\n} from '@src/components/carousel-preview/CarouselPreview.style';\nimport CarouselPreviewCard from '@src/components/carousel-preview/CarouselPreviewCard';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateCards,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { AiContentBadge } from '@src/components/template-preview/TemplatePreview.styled';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport {\n\tdetermineCardIndex,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { AllTemplateTypes } from '../template-preview/models/types';\nimport { RCSCarousalContainer } from '../template-preview/RCS/RCSPreview.styled';\nimport {\n\tCustomCarouselLeftArrow,\n\tCustomCarouselRightArrow,\n} from './CustomCarouselArrows';\n\nexport const CarouselPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\ttemplate: AllTemplateTypes;\n\t\tshowSampleValues?: boolean;\n\t\tisPreview?: boolean;\n\t\tremoveBottomBorder?: boolean;\n\t\tborderRadius?: string;\n\t\tshowArrows?: boolean;\n\t\thideBorder?: boolean;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\ttemplate,\n\t\tisPreview,\n\t\tremoveBottomBorder,\n\t\tborderRadius,\n\t\tshowArrows,\n\t\thideBorder,\n\t\tshowSampleValues,\n\t}) => {\n\t\tconst {\n\t\t\tsliderRef,\n\t\t\tselectedCarouselIndex,\n\t\t\tcardCount,\n\t\t\tsetIsCarouselHovered,\n\t\t\tcardIndex: cardsIndex,\n\t\t\tshowVariablePicker,\n\t\t} = useTemplateModalContext();\n\n\t\tconst cardIndex =\n\t\t\tcardsIndex == -1 ? determineCardIndex(channel) : cardsIndex;\n\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\tcardIndex\n\t\t]?.cards;\n\n\t\tconst carouselSlider = cards?.length ? (\n\t\t\t<CarouselSlider\n\t\t\t\tcards={cards}\n\t\t\t\tcardCount={cardCount ?? 0}\n\t\t\t\tselectedCarouselIndex={selectedCarouselIndex ?? -1}\n\t\t\t\tsliderRef={sliderRef}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowArrows={showArrows}\n\t\t\t\tchannel={channel}\n\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\tsetIsCarouselHovered={setIsCarouselHovered}\n\t\t\t\tshowSampleValues={!!showSampleValues}\n\t\t\t\tshowVariablePicker={showVariablePicker}\n\t\t\t/>\n\t\t) : null;\n\n\t\tif (isRCSChannel(channel)) {\n\t\t\treturn (\n\t\t\t\t<RCSCarousalContainer borderRadius={borderRadius}>\n\t\t\t\t\t{carouselSlider}\n\t\t\t\t</RCSCarousalContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tremoveBottomBorder={removeBottomBorder}\n\t\t\t\tborderRadius={borderRadius}\n\t\t\t\thideBorder={hideBorder}\n\t\t\t>\n\t\t\t\t{(!!template?.['aiContentConfigId'] \|\|\n\t\t\t\t\t!!template?.['isAiGenerated']) && (\n\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t</AiContentBadge>\n\t\t\t\t)}\n\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tcurrentTemplate={template}\n\t\t\t\t\tcarouselCardIndex={-1}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twidth=\"77%\"\n\t\t\t\t/>\n\t\t\t\t{carouselSlider}\n\t\t\t</Container>\n\t\t);\n\t},\n);\n\nconst CarouselSlider = ({\n\tcards,\n\tcardCount,\n\tselectedCarouselIndex,\n\tsliderRef,\n\tisPreview,\n\tshowArrows,\n\tchannel,\n\ttemplate,\n\tsetIsCarouselHovered,\n\tshowSampleValues,\n\tshowVariablePicker,\n}: {\n\tcards: WhatsAppCarouselTemplateCards[];\n\tcardCount: number;\n\tselectedCarouselIndex: number;\n\tsliderRef: any;\n\tisPreview?: boolean;\n\tshowArrows?: boolean;\n\tchannel: CHANNEL_TYPE;\n\ttemplate: WhatsAppCarouselTemplate;\n\tsetIsCarouselHovered?: (value: boolean) => void;\n\tshowSampleValues?: boolean;\n\tshowVariablePicker?: boolean;\n}) => (\n\t<CarouselSlickContainer\n\t\tcardCount={cardCount}\n\t\tselectedCarouselIndex={selectedCarouselIndex}\n\t\tonMouseEnter={() => !showVariablePicker && setIsCarouselHovered?.(true)}\n\t\tonMouseLeave={() => !showVariablePicker && setIsCarouselHovered?.(false)}\n\t>\n\t\t<Slider\n\t\t\tref={sliderRef}\n\t\t\tswipeToSlide\n\t\t\tdraggable\n\t\t\tswipe\n\t\t\tinfinite={false}\n\t\t\tfocusOnSelect={!isPreview}\n\t\t\tcenterMode\n\t\t\tarrows={showArrows}\n\t\t\tadaptiveHeight\n\t\t\tnextArrow={<CustomCarouselRightArrow isPreview={isPreview ?? false} />}\n\t\t\tprevArrow={<CustomCarouselLeftArrow isPreview={isPreview ?? false} />}\n\t\t>\n\t\t\t{cards?.map((carousel, index) => {\n\t\t\t\tconst currentCarousel = {\n\t\t\t\t\tcomponents: carousel.components,\n\t\t\t\t\tmapping: template?.mapping?.cards?.[index],\n\t\t\t\t\tcontent: template?.['content'],\n\t\t\t\t\ttemplateType: template?.['templateType'],\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tcurrentTemplate={currentCarousel}\n\t\t\t\t\t\tcarouselCardIndex={index}\n\t\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Slider>\n\t</CarouselSlickContainer>\n);\n"],"names":["CarouselPreview","React","forwardRef","~~_ref","~~channel","template","isPreview","removeBottomBorder","borderRadius","showArrows","hideBorder","showSampleValues","sliderRef","selectedCarouselIndex","cardCount","setIsCarouselHovered","cardIndex","cardsIndex","showVariablePicker","useTemplateModalContext","determineCardIndex","cards","_b","_a","components","carouselSlider","length","_jsx","CarouselSlider","isRCSChannel","RCSCarousalContainer","Object","assign","children","_jsxs","Container","AiContentBadge","jsx","AiContentIcon","width","height","CarouselPreviewCard","currentTemplate","carouselCardIndex","~~_ref2","~~CarouselSlickContainer","onMouseEnter","onMouseLeave","Slider","ref","swipeToSlide","draggable","swipe","infinite","focusOnSelect","centerMode","arrows","adaptiveHeight","nextArrow","CustomCarouselRightArrow","prevArrow","CustomCarouselLeftArrow","map","carousel","index","currentCarousel","mapping","content","templateType"],"mappings":"~~mpBA6BO~~,~~MAAMA,~~EAAkBC,EAAAA,QAAMC,~~YAapCC~~,~~IASK~~,~~IATJC~~,~~QACAA~~,~~EAAOC~~,~~SACPA~~,~~EAAQC~~,~~UACRA~~,~~EAASC~~,~~mBACTA~~,~~EAAkBC,aAClBA,EAAYC,WACZA,EAAUC,WACVA,EAAUC,iBACVA,GACAR,UACA,MAAMS,~~UACLA,EAASC,sBACTA,EAAqBC,UACrBA,EAASC,qBACTA,EACAC,UAAWC,EAAUC,mBACrBA,GACGC,EAAuBA,0BAErBH,GACU,GAAfC,EAAmBG,EAAAA,mBAAmBhB,GAAWa,EAC5CI,EAEL,QAFaC,EACb,QADcC,EAAAlB,aAAQ,EAARA,EAAuCmB,kBACrD,IAAAD,OAAA,EAAAA,EAAAP,UACA,IAAAM,OAAA,EAAAA,EAAED,MAEGI,GAAiBJ,aAAA,EAAAA,EAAOK,QAC7BC,EAAAA,IAACC,GACAP,MAAOA,EACPP,UAAWA,QAAAA,EAAa,EACxBD,sBAAuBA,QAAAA,GAA0B,EACjDD,UAAWA,EACXN,UAAWA,EACXG,WAAYA,EACZL,QAASA,EACTC,SAAUA,EACVU,qBAAsBA,EACtBJ,mBAAoBA,EACpBO,mBAAoBA,IAElB,KAEJ,OAAIW,EAAAA,aAAazB,GAEfuB,MAACG,EAAAA,qBAAqBC,OAAAC,OAAA,CAAAxB,aAAcA,GAClC,CAAAyB,SAAAR,KAMHS,OAACC,EAAAA,UAASJ,OAAAC,OAAA,CACTzB,mBAAoBA,EACpBC,aAAcA,EACdE,WAAYA,GAAU,CAAAuB,SAAA,KAElB5B,aAAQ,EAARA,EAA8B,uBAC/BA,aAAA,EAAAA,EAA0B,iBAC5BsB,EAAAA,IAACS,EAAAA,eAAc,CAAAH,SACdN,EAACU,IAAAC,UAAc,CAAAC,MAAO,GAAIC,OAAQ,OAGpCb,EAACU,IAAAI,UACA,CAAArC,QAASA,EACTsC,gBAAiBrC,EACjBsC,mBAAoB,EACpBrC,UAAWA,EACXiC,MAAM,QAENd,KACU,IAKTG,~~EAAiBgB~~,~~IAAA~~,~~IAACvB~~,~~MACvBA~~,~~EAAKP~~,~~UACLA~~,~~EAASD~~,~~sBACTA~~,~~EAAqBD~~,~~UACrBA~~,~~EAASN~~,~~UACTA~~,~~EAASG~~,~~WACTA~~,~~EAAUL,QACVA,EAAOC,SACPA,EAAQU,qBACRA,EAAoBJ,iBACpBA,EAAgBO,mBAChBA,GAaA0B,EAAA,OACAjB,MAACkB,~~EAAAA,~~uBACAd~~,OAAAC,OAAA,CAAAlB,UAAWA,EACXD,sBAAuBA,~~EACvBiC~~,aAAcA,~~KAAO5B~~,IAAsBH,aAAoB,EAApBA,GAAuB,~~IAClEgC~~,aAAcA,~~KAAO7B~~,IAAsBH,aAAoB,EAApBA,GAAuB,KAElE,CAAAkB,SAAAN,EAAAU,~~IAACW~~,~~UAAMjB~~,OAAAC,OAAA,~~CACNiB~~,~~IAAKrC~~,~~EACLsC~~,cACA,EAAAC,aACAC,OAAK,EACLC,UAAU,EACVC,~~eAAgBhD~~,~~EAChBiD~~,YACA,EAAAC,~~OAAQ/~~C,~~EACRgD,~~gBAAc,EACdC,~~UAAW/B~~,EAAAU,~~IAACsB~~,2BAAwB,~~CAACrD~~,UAAWA,SAAAA,~~IAChDsD~~,~~UAAWjC~~,EAAAU,~~IAACwB~~,0BAAwB,~~CAAAvD~~,UAAWA,SAAAA,KAAsB,CAAA2B,SAEpEZ,aAAA,EAAAA,~~EAAOyC~~,KAAI,CAACC,EAAUC,aACtB,MAAMC,EAAkB,~~CACvBzC~~,~~WAAYuC~~,~~EAASvC~~,~~WACrB0C~~,QAAiC,~~QAAxB5C~~,EAAiB,QAAjBC,EAAAlB,aAAQ,EAARA,~~EAAU6D~~,eAAO,~~IAAA3C~~,OAAA,EAAAA,EAAEF,aAAK,IAAAC,OAAA,EAAAA,~~EAAG0C~~,GACpCG,~~QAAS9D~~,eAAAA,EAAoB,~~QAC7B+D~~,~~aAAc/D~~,eAAAA,EAAyB,cAExC,OACCsB,EAAAA,IAACc,EAAAA,QAAmB,CAEnBrC,QAASA,EACTsC,~~gBAAiBuB~~,~~EACjBtB~~,~~kBAAmBqB~~,~~EACnB1D~~,UAAWA,EACXiC,MAAM,OACN5B,iBAAkBA,~~GANbqD~~,EAOJ~~,SAImB~~"}
1	+ {"version":3,"file":"CarouselPreview.js","sources":["../../../../src/components/carousel-preview/CarouselPreview.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport AiContentIcon from '@src/assets/icons/aiContentIcon.svg';\nimport React from 'react';\nimport Slider from 'react-slick';\nimport 'slick-carousel/slick/slick-theme.css';\nimport 'slick-carousel/slick/slick.css';\nimport {\n\tCarouselSlickContainer,\n\tContainer,\n} from '@src/components/carousel-preview/CarouselPreview.style';\nimport CarouselPreviewCard from '@src/components/carousel-preview/CarouselPreviewCard';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateCards,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { AiContentBadge } from '@src/components/template-preview/TemplatePreview.styled';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport {\n\tdetermineCardIndex,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { AllTemplateTypes } from '../template-preview/models/types';\nimport { RCSCarousalContainer } from '../template-preview/RCS/RCSPreview.styled';\nimport {\n\tCustomCarouselLeftArrow,\n\tCustomCarouselRightArrow,\n} from './CustomCarouselArrows';\n\nexport const CarouselPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\ttemplate: AllTemplateTypes;\n\t\tshowSampleValues?: boolean;\n\t\tisPreview?: boolean;\n\t\tremoveBottomBorder?: boolean;\n\t\tborderRadius?: string;\n\t\tshowArrows?: boolean;\n\t\thideBorder?: boolean;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\ttemplate,\n\t\tisPreview,\n\t\tremoveBottomBorder,\n\t\tborderRadius,\n\t\tshowArrows,\n\t\thideBorder,\n\t\tshowSampleValues,\n\t}) => {\n\t\tconst {\n\t\t\tsliderRef,\n\t\t\tselectedCarouselIndex,\n\t\t\tcardCount,\n\t\t\tsetIsCarouselHovered,\n\t\t\tcardIndex: cardsIndex,\n\t\t\tshowVariablePicker,\n\t\t} = useTemplateModalContext();\n\n\t\tconst cardIndex =\n\t\t\tcardsIndex == -1 ? determineCardIndex(channel) : cardsIndex;\n\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\tcardIndex\n\t\t]?.cards;\n\n\t\tconst carouselSlider = cards?.length ? (\n\t\t\t<CarouselSlider\n\t\t\t\tcards={cards}\n\t\t\t\tcardCount={cardCount ?? 0}\n\t\t\t\tselectedCarouselIndex={selectedCarouselIndex ?? -1}\n\t\t\t\tsliderRef={sliderRef}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowArrows={showArrows}\n\t\t\t\tchannel={channel}\n\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\tsetIsCarouselHovered={setIsCarouselHovered}\n\t\t\t\tshowSampleValues={!!showSampleValues}\n\t\t\t\tshowVariablePicker={showVariablePicker}\n\t\t\t/>\n\t\t) : null;\n\n\t\tif (isRCSChannel(channel)) {\n\t\t\treturn (\n\t\t\t\t<RCSCarousalContainer borderRadius={borderRadius}>\n\t\t\t\t\t{carouselSlider}\n\t\t\t\t</RCSCarousalContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tremoveBottomBorder={removeBottomBorder}\n\t\t\t\tborderRadius={borderRadius}\n\t\t\t\thideBorder={hideBorder}\n\t\t\t>\n\t\t\t\t{(!!template?.['aiContentConfigId'] \|\|\n\t\t\t\t\t!!template?.['isAiGenerated']) && (\n\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t</AiContentBadge>\n\t\t\t\t)}\n\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tcurrentTemplate={template}\n\t\t\t\t\tcarouselCardIndex={-1}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twidth=\"77%\"\n\t\t\t\t/>\n\t\t\t\t{carouselSlider}\n\t\t\t</Container>\n\t\t);\n\t},\n);\n\nconst CarouselSlider = ({\n\tcards,\n\tcardCount,\n\tselectedCarouselIndex,\n\tsliderRef,\n\tisPreview,\n\tshowArrows,\n\tchannel,\n\ttemplate,\n\tsetIsCarouselHovered,\n\tshowSampleValues,\n\tshowVariablePicker,\n}: {\n\tcards: WhatsAppCarouselTemplateCards[];\n\tcardCount: number;\n\tselectedCarouselIndex: number;\n\tsliderRef: any;\n\tisPreview?: boolean;\n\tshowArrows?: boolean;\n\tchannel: CHANNEL_TYPE;\n\ttemplate: WhatsAppCarouselTemplate;\n\tsetIsCarouselHovered?: (value: boolean) => void;\n\tshowSampleValues?: boolean;\n\tshowVariablePicker?: boolean;\n}) => (\n\t<CarouselSlickContainer\n\t\tcardCount={cardCount}\n\t\tselectedCarouselIndex={selectedCarouselIndex}\n\t\tonMouseEnter={() => !showVariablePicker && setIsCarouselHovered?.(true)}\n\t\tonMouseLeave={() => !showVariablePicker && setIsCarouselHovered?.(false)}\n\t>\n\t\t<Slider\n\t\t\tref={sliderRef}\n\t\t\tswipeToSlide\n\t\t\tdraggable\n\t\t\tswipe\n\t\t\tinfinite={false}\n\t\t\tfocusOnSelect={!isPreview}\n\t\t\tcenterMode\n\t\t\tarrows={showArrows}\n\t\t\tadaptiveHeight\n\t\t\tnextArrow={<CustomCarouselRightArrow isPreview={isPreview ?? false} />}\n\t\t\tprevArrow={<CustomCarouselLeftArrow isPreview={isPreview ?? false} />}\n\t\t>\n\t\t\t{cards?.map((carousel, index) => {\n\t\t\t\tconst currentCarousel = {\n\t\t\t\t\tcomponents: carousel.components,\n\t\t\t\t\tmapping: template?.mapping?.cards?.[index],\n\t\t\t\t\tcontent: template?.['content'],\n\t\t\t\t\ttemplateType: template?.['templateType'],\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tcurrentTemplate={currentCarousel}\n\t\t\t\t\t\tcarouselCardIndex={index}\n\t\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Slider>\n\t</CarouselSlickContainer>\n);\n"],"names":["CarouselPreview","React","forwardRef","channel","template","isPreview","removeBottomBorder","borderRadius","showArrows","hideBorder","showSampleValues","sliderRef","selectedCarouselIndex","cardCount","setIsCarouselHovered","cardIndex","cardsIndex","showVariablePicker","useTemplateModalContext","determineCardIndex","cards","_b","_a","components","carouselSlider","length","_jsx","CarouselSlider","isRCSChannel","RCSCarousalContainer","Object","assign","children","_jsxs","Container","AiContentBadge","jsx","AiContentIcon","width","height","CarouselPreviewCard","currentTemplate","carouselCardIndex","CarouselSlickContainer","onMouseEnter","onMouseLeave","Slider","ref","swipeToSlide","draggable","swipe","infinite","focusOnSelect","centerMode","arrows","adaptiveHeight","nextArrow","CustomCarouselRightArrow","prevArrow","CustomCarouselLeftArrow","map","carousel","index","currentCarousel","mapping","content","templateType"],"mappings":"ypBA6BaA,EAAkBC,EAAAA,QAAMC,YAapC,EACCC,UACAC,WACAC,YACAC,qBACAC,eACAC,aACAC,aACAC,+BAEA,MAAMC,UACLA,EAASC,sBACTA,EAAqBC,UACrBA,EAASC,qBACTA,EACAC,UAAWC,EAAUC,mBACrBA,GACGC,EAAuBA,0BAErBH,GACU,GAAfC,EAAmBG,EAAAA,mBAAmBhB,GAAWa,EAC5CI,EAEL,QAFaC,EACb,QADcC,EAAAlB,aAAQ,EAARA,EAAuCmB,kBACrD,IAAAD,OAAA,EAAAA,EAAAP,UACA,IAAAM,OAAA,EAAAA,EAAED,MAEGI,GAAiBJ,aAAA,EAAAA,EAAOK,QAC7BC,EAAAA,IAACC,GACAP,MAAOA,EACPP,UAAWA,QAAAA,EAAa,EACxBD,sBAAuBA,QAAAA,GAA0B,EACjDD,UAAWA,EACXN,UAAWA,EACXG,WAAYA,EACZL,QAASA,EACTC,SAAUA,EACVU,qBAAsBA,EACtBJ,mBAAoBA,EACpBO,mBAAoBA,IAElB,KAEJ,OAAIW,EAAAA,aAAazB,GAEfuB,MAACG,EAAAA,qBAAqBC,OAAAC,OAAA,CAAAxB,aAAcA,GAClC,CAAAyB,SAAAR,KAMHS,OAACC,EAAAA,UAASJ,OAAAC,OAAA,CACTzB,mBAAoBA,EACpBC,aAAcA,EACdE,WAAYA,GAAU,CAAAuB,SAAA,KAElB5B,aAAQ,EAARA,EAA8B,uBAC/BA,aAAA,EAAAA,EAA0B,iBAC5BsB,EAAAA,IAACS,EAAAA,eAAc,CAAAH,SACdN,EAACU,IAAAC,UAAc,CAAAC,MAAO,GAAIC,OAAQ,OAGpCb,EAACU,IAAAI,UACA,CAAArC,QAASA,EACTsC,gBAAiBrC,EACjBsC,mBAAoB,EACpBrC,UAAWA,EACXiC,MAAM,QAENd,KACU,IAKTG,EAAiBA,EACtBP,QACAP,YACAD,wBACAD,YACAN,YACAG,aACAL,UACAC,WACAU,uBACAJ,mBACAO,wBAcAS,MAACiB,EAAAA,uBACAb,OAAAC,OAAA,CAAAlB,UAAWA,EACXD,sBAAuBA,EACvBgC,aAAcA,KAAO3B,IAAsBH,aAAoB,EAApBA,GAAuB,IAClE+B,aAAcA,KAAO5B,IAAsBH,aAAoB,EAApBA,GAAuB,KAElE,CAAAkB,SAAAN,EAAAU,IAACU,UAAMhB,OAAAC,OAAA,CACNgB,IAAKpC,EACLqC,cACA,EAAAC,aACAC,OAAK,EACLC,UAAU,EACVC,eAAgB/C,EAChBgD,YACA,EAAAC,OAAQ9C,EACR+C,gBAAc,EACdC,UAAW9B,EAAAU,IAACqB,2BAAwB,CAACpD,UAAWA,SAAAA,IAChDqD,UAAWhC,EAAAU,IAACuB,0BAAwB,CAAAtD,UAAWA,SAAAA,KAAsB,CAAA2B,SAEpEZ,aAAA,EAAAA,EAAOwC,KAAI,CAACC,EAAUC,aACtB,MAAMC,EAAkB,CACvBxC,WAAYsC,EAAStC,WACrByC,QAAiC,QAAxB3C,EAAiB,QAAjBC,EAAAlB,aAAQ,EAARA,EAAU4D,eAAO,IAAA1C,OAAA,EAAAA,EAAEF,aAAK,IAAAC,OAAA,EAAAA,EAAGyC,GACpCG,QAAS7D,eAAAA,EAAoB,QAC7B8D,aAAc9D,eAAAA,EAAyB,cAExC,OACCsB,EAAAA,IAACc,EAAAA,QAAmB,CAEnBrC,QAASA,EACTsC,gBAAiBsB,EACjBrB,kBAAmBoB,EACnBzD,UAAWA,EACXiC,MAAM,OACN5B,iBAAkBA,GANboD,EAOJ"}

package/dist/cjs/components/carousel-preview/CarouselPreviewCard.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../template-context-mapper/context/templateModalContext.js"),a=require("../template-preview/TemplatePreview.js");require("../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../constants/Theme.js"),require("../curtain/CurtainHelper.js"),require("../variable-picker-v3/model.js"),require("../template-preview/models/TemplateMeta.js"),require("../template-preview/models/WhatsAppTemplate.js"),require("../template-preview/models/Channels.js");var i=require("../template-preview/helpers/templateMiscHelper.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const s=l(t).default.forwardRef((t=>{let{channel:l,currentTemplate:s,showSampleValues:p,carouselCardIndex:n,isPreview:u,width:d}=t;var o,m,c;const{cardWidth:v,template:h,cardIndex:w}=r.useTemplateModalContext(),j=-1==w?i.determineCardIndex(l):w,q=(null!==(c=null===(m=null===(o=null==h?void 0:h.components)||void 0===o?void 0:o[j].cards)||void 0===m?void 0:m.length)&&void 0!==c?c:0)-1===n?12:0;return e.jsx("div",Object.assign({style:{width:d||v,height:(null!=n?n:-1)>-1?"100%":"auto"}},{children:e.jsx(a.TemplatePreview,{showSampleValues:p,template:s,channel:l,size:"small",hideHeader:!0,carouselCardIndex:n,isWhatsappCarousel:!0,isPreview:u,whatsAppSpecificMeta:{templateContainerStyles:{marginRight:q,height:"100%"}}})}))}));exports.default=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../template-context-mapper/context/templateModalContext.js"),a=require("../template-preview/TemplatePreview.js");require("../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../constants/Theme.js"),require("../curtain/CurtainHelper.js"),require("../variable-picker-v3/model.js"),require("../template-preview/models/TemplateMeta.js"),require("../template-preview/models/WhatsAppTemplate.js"),require("../template-preview/models/Channels.js");var i=require("../template-preview/helpers/templateMiscHelper.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const s=l(t).default.forwardRef((({channel:t,currentTemplate:l,showSampleValues:s,carouselCardIndex:p,isPreview:n,width:u})=>{var d,o,m;const{cardWidth:c,template:v,cardIndex:h}=r.useTemplateModalContext(),w=-1==h?i.determineCardIndex(t):h,j=(null!==(m=null===(o=null===(d=null==v?void 0:v.components)||void 0===d?void 0:d[w].cards)||void 0===o?void 0:o.length)&&void 0!==m?m:0)-1===p?12:0;return e.jsx("div",Object.assign({style:{width:u||c,height:(null!=p?p:-1)>-1?"100%":"auto"}},{children:e.jsx(a.TemplatePreview,{showSampleValues:s,template:l,channel:t,size:"small",hideHeader:!0,carouselCardIndex:p,isWhatsappCarousel:!0,isPreview:n,whatsAppSpecificMeta:{templateContainerStyles:{marginRight:j,height:"100%"}}})}))}));exports.default=s;
 //# sourceMappingURL=CarouselPreviewCard.js.map

package/dist/cjs/components/carousel-preview/CarouselPreviewCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarouselPreviewCard.js","sources":["../../../../src/components/carousel-preview/CarouselPreviewCard.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TemplatePreview } from '@src/components/template-preview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { determineCardIndex } from '../template-preview/helpers/templateMiscHelper';\n\nconst CarouselPreviewCard = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\tcurrentTemplate: any;\n\t\tshowSampleValues?: boolean;\n\t\tcarouselCardIndex?: number;\n\t\tisPreview?: boolean;\n\t\twidth?: string;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\tcurrentTemplate,\n\t\tshowSampleValues,\n\t\tcarouselCardIndex,\n\t\tisPreview,\n\t\twidth,\n\t}) => {\n\t\tconst {\n\t\t\tcardWidth,\n\t\t\ttemplate,\n\t\t\tcardIndex: cardInd,\n\t\t} = useTemplateModalContext();\n\t\tconst cardIndex =\n\t\t\tcardInd == -1 ? determineCardIndex(channel) : cardInd;\n\t\tconst marginRight =\n\t\t\t((template as WhatsAppCarouselTemplate)?.components?.[cardIndex].cards\n\t\t\t\t?.length ?? 0) -\n\t\t\t\t1 ===\n\t\t\tcarouselCardIndex\n\t\t\t\t? 12\n\t\t\t\t: 0;\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: width ? width : cardWidth,\n\t\t\t\t\theight: (carouselCardIndex ?? -1) > -1 ? '100%' : 'auto',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<TemplatePreview\n\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\ttemplate={currentTemplate}\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tsize={'small'}\n\t\t\t\t\thideHeader\n\t\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\t\tisWhatsappCarousel={true}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twhatsAppSpecificMeta={{\n\t\t\t\t\t\ttemplateContainerStyles: {\n\t\t\t\t\t\t\tmarginRight: marginRight,\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t},\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t},\n);\n\nexport default CarouselPreviewCard;\n"],"names":["CarouselPreviewCard","React","forwardRef","~~_ref","~~channel","currentTemplate","showSampleValues","carouselCardIndex","isPreview","width","cardWidth","template","cardIndex","cardInd","useTemplateModalContext","determineCardIndex","marginRight","_c","_a","components","cards","_b","length","_jsx","Object","assign","style","height","children","jsx","TemplatePreview","size","hideHeader","isWhatsappCarousel","whatsAppSpecificMeta","templateContainerStyles"],"mappings":"wxBAQA,MAAMA,OAAsBC,QAAMC,~~YAWjCC~~,~~IAOK~~,~~IAPJC~~,~~QACAA~~,~~EAAOC~~,~~gBACPA~~,~~EAAeC~~,~~iBACfA~~,~~EAAgBC~~,~~kBAChBA,EAAiBC,UACjBA,EAASC,MACTA,GACAN,YACA,MAAMO,~~UACLA,EAASC,SACTA,EACAC,UAAWC,GACRC,EAAuBA,0BACrBF,GACO,GAAZC,EAAgBE,EAAAA,mBAAmBX,GAAWS,EACzCG,GAEQ,QADZC,EACE,kBADDC,EAAAP,aAAQ,EAARA,EAAuCQ,iCAAaP,GAAWQ,aAC9D,IAAAC,OAAA,EAAAA,EAAAC,cAAU,IAAAL,EAAAA,EAAA,GACZ,IACDV,EACG,GACA,EACJ,OACCgB,MACC,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNjB,MAAOA,GAAgBC,EACvBiB,QAASpB,QAAAA,GAAsB,IAAM,EAAI,OAAS,SAClD,CAAAqB,SAEDL,EAACM,IAAAC,kBACA,CAAAxB,iBAAkBA,EAClBK,SAAUN,EACVD,QAASA,EACT2B,KAAM,QACNC,YAAU,EACVzB,kBAAmBA,EACnB0B,oBAAoB,EACpBzB,UAAWA,EACX0B,qBAAsB,CACrBC,wBAAyB,CACxBnB,YAAaA,EACbW,OAAQ,aAIN"}
1	+ {"version":3,"file":"CarouselPreviewCard.js","sources":["../../../../src/components/carousel-preview/CarouselPreviewCard.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TemplatePreview } from '@src/components/template-preview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { determineCardIndex } from '../template-preview/helpers/templateMiscHelper';\n\nconst CarouselPreviewCard = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\tcurrentTemplate: any;\n\t\tshowSampleValues?: boolean;\n\t\tcarouselCardIndex?: number;\n\t\tisPreview?: boolean;\n\t\twidth?: string;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\tcurrentTemplate,\n\t\tshowSampleValues,\n\t\tcarouselCardIndex,\n\t\tisPreview,\n\t\twidth,\n\t}) => {\n\t\tconst {\n\t\t\tcardWidth,\n\t\t\ttemplate,\n\t\t\tcardIndex: cardInd,\n\t\t} = useTemplateModalContext();\n\t\tconst cardIndex =\n\t\t\tcardInd == -1 ? determineCardIndex(channel) : cardInd;\n\t\tconst marginRight =\n\t\t\t((template as WhatsAppCarouselTemplate)?.components?.[cardIndex].cards\n\t\t\t\t?.length ?? 0) -\n\t\t\t\t1 ===\n\t\t\tcarouselCardIndex\n\t\t\t\t? 12\n\t\t\t\t: 0;\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: width ? width : cardWidth,\n\t\t\t\t\theight: (carouselCardIndex ?? -1) > -1 ? '100%' : 'auto',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<TemplatePreview\n\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\ttemplate={currentTemplate}\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tsize={'small'}\n\t\t\t\t\thideHeader\n\t\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\t\tisWhatsappCarousel={true}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twhatsAppSpecificMeta={{\n\t\t\t\t\t\ttemplateContainerStyles: {\n\t\t\t\t\t\t\tmarginRight: marginRight,\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t},\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t},\n);\n\nexport default CarouselPreviewCard;\n"],"names":["CarouselPreviewCard","React","forwardRef","channel","currentTemplate","showSampleValues","carouselCardIndex","isPreview","width","cardWidth","template","cardIndex","cardInd","useTemplateModalContext","determineCardIndex","marginRight","_c","_a","components","cards","_b","length","_jsx","Object","assign","style","height","children","jsx","TemplatePreview","size","hideHeader","isWhatsappCarousel","whatsAppSpecificMeta","templateContainerStyles"],"mappings":"wxBAQA,MAAMA,OAAsBC,QAAMC,YAWjC,EACCC,UACAC,kBACAC,mBACAC,oBACAC,YACAC,sBAEA,MAAMC,UACLA,EAASC,SACTA,EACAC,UAAWC,GACRC,EAAuBA,0BACrBF,GACO,GAAZC,EAAgBE,EAAAA,mBAAmBX,GAAWS,EACzCG,GAEQ,QADZC,EACE,kBADDC,EAAAP,aAAQ,EAARA,EAAuCQ,iCAAaP,GAAWQ,aAC9D,IAAAC,OAAA,EAAAA,EAAAC,cAAU,IAAAL,EAAAA,EAAA,GACZ,IACDV,EACG,GACA,EACJ,OACCgB,MACC,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNjB,MAAOA,GAAgBC,EACvBiB,QAASpB,QAAAA,GAAsB,IAAM,EAAI,OAAS,SAClD,CAAAqB,SAEDL,EAACM,IAAAC,kBACA,CAAAxB,iBAAkBA,EAClBK,SAAUN,EACVD,QAASA,EACT2B,KAAM,QACNC,YAAU,EACVzB,kBAAmBA,EACnB0B,oBAAoB,EACpBzB,UAAWA,EACX0B,qBAAsB,CACrBC,wBAAyB,CACxBnB,YAAaA,EACbW,OAAQ,aAIN"}

package/dist/cjs/components/carousel-secondary/CarouselSecondary.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft2.svg.js"),r=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight2.svg.js"),o=require("../../assets/icons/chevronRight.svg.js"),n=require("react"),i=require("../button/Button.js"),a=require("./CarouselSecondary.style.js"),l=require("./model.js");Object.defineProperty(exports,"CarouselVersion",{enumerable:!0,get:function(){return l.CarouselVersion}}),exports.CarouselSecondary=u=>{let{pages:c,onComplete:d,textAlign:g,version:j,onCompleteText:C}=u;const[V,h]=n.useState(0),v=n.useRef(null);return n.useEffect((()=>{v.current&&v.current.scrollTo({left:v.current.offsetWidth*V,behavior:"smooth"})}),[V]),e.jsxs(a.CarouselContainer,Object.assign({version:j||l.CarouselVersion.V1},{children:[e.jsx(a.CarouselBody,Object.assign({ref:v,textAlign:g},{children:c.map(((s,r)=>e.jsx(a.CarouselPage,Object.assign({isActive:r===V},{children:s}),r)))})),e.jsxs(a.CarouselFooter,Object.assign({version:j||l.CarouselVersion.V1},{children:[e.jsx("div",Object.assign({style:{visibility:j===l.CarouselVersion.V2&&0===V?"hidden":"visible"}},{children:e.jsx(i.Button,{buttonText:"Back",buttonType:"tertiaryGray",onClick:()=>{h((e=>0===e?e:e-1))},size:j===l.CarouselVersion.V2?"small":"medium",LeadingIcon:j===l.CarouselVersion.V2?s.default:r.default,disabled:!V})})),e.jsx(a.PageIndicator,{children:c.map(((s,r)=>e.jsx(a.Indicator,{isActive:r===V,version:j||l.CarouselVersion.V1,onClick:()=>{h(r)}},r)))}),e.jsx(i.Button,{buttonText:V===c.length-1?C||"Get started":"Next",buttonType:V===c.length-1||j===l.CarouselVersion.V2?"tertiary":"tertiaryGray",onClick:()=>{h((e=>e===c.length-1?e:e+1)),V===c.length-1&&d()},size:j===l.CarouselVersion.V2?"small":"medium",TrailingIcon:V<c.length-1?j===l.CarouselVersion.V2?t.default:o.default:void 0,style:j===l.CarouselVersion.V2?{}:{background:"transparent"}})]}))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft2.svg.js"),r=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight2.svg.js"),o=require("../../assets/icons/chevronRight.svg.js"),n=require("react"),i=require("../button/Button.js"),a=require("./CarouselSecondary.style.js"),l=require("./model.js");Object.defineProperty(exports,"CarouselVersion",{enumerable:!0,get:function(){return l.CarouselVersion}}),exports.CarouselSecondary=({pages:u,onComplete:c,textAlign:d,version:g,onCompleteText:j})=>{const[C,V]=n.useState(0),h=n.useRef(null);return n.useEffect((()=>{h.current&&h.current.scrollTo({left:h.current.offsetWidth*C,behavior:"smooth"})}),[C]),e.jsxs(a.CarouselContainer,Object.assign({version:g||l.CarouselVersion.V1},{children:[e.jsx(a.CarouselBody,Object.assign({ref:h,textAlign:d},{children:u.map(((s,r)=>e.jsx(a.CarouselPage,Object.assign({isActive:r===C},{children:s}),r)))})),e.jsxs(a.CarouselFooter,Object.assign({version:g||l.CarouselVersion.V1},{children:[e.jsx("div",Object.assign({style:{visibility:g===l.CarouselVersion.V2&&0===C?"hidden":"visible"}},{children:e.jsx(i.Button,{buttonText:"Back",buttonType:"tertiaryGray",onClick:()=>{V((e=>0===e?e:e-1))},size:g===l.CarouselVersion.V2?"small":"medium",LeadingIcon:g===l.CarouselVersion.V2?s.default:r.default,disabled:!C})})),e.jsx(a.PageIndicator,{children:u.map(((s,r)=>e.jsx(a.Indicator,{isActive:r===C,version:g||l.CarouselVersion.V1,onClick:()=>{V(r)}},r)))}),e.jsx(i.Button,{buttonText:C===u.length-1?j||"Get started":"Next",buttonType:C===u.length-1||g===l.CarouselVersion.V2?"tertiary":"tertiaryGray",onClick:()=>{V((e=>e===u.length-1?e:e+1)),C===u.length-1&&c()},size:g===l.CarouselVersion.V2?"small":"medium",TrailingIcon:C<u.length-1?g===l.CarouselVersion.V2?t.default:o.default:void 0,style:g===l.CarouselVersion.V2?{}:{background:"transparent"}})]}))]}))};
 //# sourceMappingURL=CarouselSecondary.js.map

package/dist/cjs/components/carousel-secondary/CarouselSecondary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarouselSecondary.js","sources":["../../../../src/components/carousel-secondary/CarouselSecondary.tsx"],"sourcesContent":["import ChevronLeftIcon2 from '@src/assets/icons/chevronLeft2.svg';\nimport ChevronLeftIcon from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRightIcon2 from '@src/assets/icons/chevronRight2.svg';\nimport ChevronRightIcon from '@src/assets/icons/chevronRight.svg';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Button } from '@src/components/button/Button';\nimport {\n\tCarouselBody,\n\tCarouselContainer,\n\tCarouselFooter,\n\tCarouselPage,\n\tIndicator,\n\tPageIndicator,\n} from './CarouselSecondary.style';\nimport { CarouselVersion } from './model';\n\nexport interface CarouselProps {\n\tpages: Array<React.FunctionComponent<React.SVGAttributes<SVGElement>> \| any>;\n\tonComplete: () => void;\n\ttextAlign?: string;\n\tversion?: CarouselVersion;\n\tonCompleteText?: string;\n}\n\nexport const CarouselSecondary: React.FC<CarouselProps> = ({\n\tpages,\n\tonComplete,\n\ttextAlign,\n\tversion,\n\tonCompleteText,\n}) => {\n\tconst [currentPage, setCurrentPage] = useState(0);\n\tconst carouselRef = useRef<HTMLDivElement>(null);\n\n\tconst handleNextPage = () => {\n\t\tsetCurrentPage((prevPage) =>\n\t\t\tprevPage === pages.length - 1 ? prevPage : prevPage + 1,\n\t\t);\n\t\tif (currentPage === pages.length - 1) onComplete();\n\t};\n\n\tconst handlePrevPage = () => {\n\t\tsetCurrentPage((prevPage) => (prevPage === 0 ? prevPage : prevPage - 1));\n\t};\n\n\tconst handlePageClick = (pageIndex) => {\n\t\tsetCurrentPage(pageIndex);\n\t};\n\n\tuseEffect(() => {\n\t\tif (carouselRef.current) {\n\t\t\tcarouselRef.current.scrollTo({\n\t\t\t\tleft: carouselRef.current.offsetWidth * currentPage,\n\t\t\t\tbehavior: 'smooth',\n\t\t\t});\n\t\t}\n\t}, [currentPage]);\n\n\treturn (\n\t\t<CarouselContainer version={version ? version : CarouselVersion.V1}>\n\t\t\t<CarouselBody ref={carouselRef} textAlign={textAlign}>\n\t\t\t\t{pages.map((page, index) => (\n\t\t\t\t\t<CarouselPage key={index} isActive={index === currentPage}>\n\t\t\t\t\t\t{page}\n\t\t\t\t\t</CarouselPage>\n\t\t\t\t))}\n\t\t\t</CarouselBody>\n\t\t\t<CarouselFooter version={version ? version : CarouselVersion.V1}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tvisibility:\n\t\t\t\t\t\t\tversion === CarouselVersion.V2 && currentPage === 0\n\t\t\t\t\t\t\t\t? 'hidden'\n\t\t\t\t\t\t\t\t: 'visible',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Back'}\n\t\t\t\t\t\tbuttonType={'tertiaryGray'}\n\t\t\t\t\t\tonClick={handlePrevPage}\n\t\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\t\tLeadingIcon={\n\t\t\t\t\t\t\tversion === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronLeftIcon2\n\t\t\t\t\t\t\t\t: ChevronLeftIcon\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdisabled={!currentPage}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<PageIndicator>\n\t\t\t\t\t{pages.map((_, index) => (\n\t\t\t\t\t\t<Indicator\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tisActive={index === currentPage}\n\t\t\t\t\t\t\tversion={version ? version : CarouselVersion.V1}\n\t\t\t\t\t\t\tonClick={() => handlePageClick(index)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</PageIndicator>\n\t\t\t\t<Button\n\t\t\t\t\tbuttonText={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t: 'Get started'\n\t\t\t\t\t\t\t: 'Next'\n\t\t\t\t\t}\n\t\t\t\t\tbuttonType={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: version === CarouselVersion.V2\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: 'tertiaryGray'\n\t\t\t\t\t}\n\t\t\t\t\tonClick={handleNextPage}\n\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\tTrailingIcon={\n\t\t\t\t\t\tcurrentPage < pages.length - 1\n\t\t\t\t\t\t\t? version === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronRightIcon2\n\t\t\t\t\t\t\t\t: ChevronRightIcon\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tversion === CarouselVersion.V2 ? {} : { background: 'transparent' }\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</CarouselFooter>\n\t\t</CarouselContainer>\n\t);\n};\nexport { CarouselVersion };\n"],"names":["~~_ref~~","pages","onComplete","textAlign","version","onCompleteText","currentPage","setCurrentPage","useState","carouselRef","useRef","useEffect","current","scrollTo","left","offsetWidth","behavior","_jsxs","CarouselContainer","Object","assign","CarouselVersion","V1","children","_jsx","jsx","CarouselBody","ref","map","page","index","CarouselPage","isActive","jsxs","CarouselFooter","style","visibility","V2","Button","buttonText","buttonType","onClick","handlePrevPage","prevPage","size","LeadingIcon","ChevronLeftIcon2","ChevronLeftIcon","disabled","PageIndicator","_","Indicator","length","handleNextPage","TrailingIcon","ChevronRightIcon2","ChevronRightIcon","undefined","background"],"mappings":"ijBAwB0DA,~~IAMrD~~,~~IANsDC~~,~~MAC1DA~~,~~EAAKC~~,~~WACLA~~,~~EAAUC~~,~~UACVA~~,~~EAASC,QACTA,EAAOC,eACPA,GACAL,EACA,MAAOM,~~EAAaC,GAAkBC,EAAQA,SAAC,GACzCC,EAAcC,SAAuB,MA0B3C,OATAC,EAAAA,WAAU,KACLF,EAAYG,SACfH,EAAYG,QAAQC,SAAS,CAC5BC,KAAML,EAAYG,QAAQG,YAAcT,EACxCU,SAAU,UAEX,GACC,CAACV,IAGHW,OAACC,EAAAA,kBAAkBC,OAAAC,OAAA,CAAAhB,QAASA,GAAoBiB,EAAAA,gBAAgBC,IAAE,CAAAC,SAAA,CACjEC,EAACC,IAAAC,8BAAaC,IAAKlB,EAAaN,UAAWA,GACzC,CAAAoB,SAAAtB,EAAM2B,KAAI,CAACC,EAAMC,IACjBN,MAACO,EAAAA,aAAyBZ,OAAAC,OAAA,CAAAY,SAAUF,IAAUxB,GAAW,CAAAiB,SACvDM,IADiBC,QAKrBb,EAACgB,KAAAC,gCAAe9B,QAASA,GAAoBiB,EAAAA,gBAAgBC,IAC5D,CAAAC,SAAA,CAAAC,EAAAC,IAAA,MAAAN,OAAAC,OAAA,CACCe,MAAO,CACNC,WACChC,IAAYiB,kBAAgBgB,IAAsB,IAAhB/B,EAC/B,SACA,YACJ,CAAAiB,SAEDC,MAACc,SAAM,CACNC,WAAY,OACZC,WAAY,eACZC,QAtCkBC,KACtBnC,GAAgBoC,GAA2B,IAAbA,EAAiBA,EAAWA,EAAW,GAAG,EAsCpEC,KAAMxC,IAAYiB,EAAAA,gBAAgBgB,GAAK,QAAU,SACjDQ,YACCzC,IAAYiB,EAAAA,gBAAgBgB,GACzBS,EAAgB,QAChBC,EAAe,QAEnBC,UAAW1C,OAGbkB,EAACC,IAAAwB,gBACC,CAAA1B,SAAAtB,EAAM2B,KAAI,CAACsB,EAAGpB,IACdN,EAACC,IAAA0B,YAEA,CAAAnB,SAAUF,IAAUxB,EACpBF,QAASA,GAAoBiB,EAAAA,gBAAgBC,GAC7CmB,QAASA,KAjDdlC,EAiDoCuB,EAH1B,GAAAA,OAORN,MAACc,SAAM,CACNC,WACCjC,IAAgBL,EAAMmD,OAAS,EAC5B/C,GAEC,cACD,OAEJmC,WACClC,IAAgBL,EAAMmD,OAAS,GAE5BhD,IAAYiB,EAAeA,gBAACgB,GAD5B,WAGA,eAEJI,QAhFmBY,KACtB9C,GAAgBoC,GACfA,IAAa1C,EAAMmD,OAAS,EAAIT,EAAWA,EAAW,IAEnDrC,IAAgBL,EAAMmD,OAAS,GAAGlD,GAAY,EA6E/C0C,KAAMxC,IAAYiB,EAAAA,gBAAgBgB,GAAK,QAAU,SACjDiB,aACChD,EAAcL,EAAMmD,OAAS,EAC1BhD,IAAYiB,EAAAA,gBAAgBgB,GAC3BkB,UACAC,EAAAA,aACDC,EAEJtB,MACC/B,IAAYiB,kBAAgBgB,GAAK,CAAA,EAAK,CAAEqB,WAAY,wBAIpC"}
1	+ {"version":3,"file":"CarouselSecondary.js","sources":["../../../../src/components/carousel-secondary/CarouselSecondary.tsx"],"sourcesContent":["import ChevronLeftIcon2 from '@src/assets/icons/chevronLeft2.svg';\nimport ChevronLeftIcon from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRightIcon2 from '@src/assets/icons/chevronRight2.svg';\nimport ChevronRightIcon from '@src/assets/icons/chevronRight.svg';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Button } from '@src/components/button/Button';\nimport {\n\tCarouselBody,\n\tCarouselContainer,\n\tCarouselFooter,\n\tCarouselPage,\n\tIndicator,\n\tPageIndicator,\n} from './CarouselSecondary.style';\nimport { CarouselVersion } from './model';\n\nexport interface CarouselProps {\n\tpages: Array<React.FunctionComponent<React.SVGAttributes<SVGElement>> \| any>;\n\tonComplete: () => void;\n\ttextAlign?: string;\n\tversion?: CarouselVersion;\n\tonCompleteText?: string;\n}\n\nexport const CarouselSecondary: React.FC<CarouselProps> = ({\n\tpages,\n\tonComplete,\n\ttextAlign,\n\tversion,\n\tonCompleteText,\n}) => {\n\tconst [currentPage, setCurrentPage] = useState(0);\n\tconst carouselRef = useRef<HTMLDivElement>(null);\n\n\tconst handleNextPage = () => {\n\t\tsetCurrentPage((prevPage) =>\n\t\t\tprevPage === pages.length - 1 ? prevPage : prevPage + 1,\n\t\t);\n\t\tif (currentPage === pages.length - 1) onComplete();\n\t};\n\n\tconst handlePrevPage = () => {\n\t\tsetCurrentPage((prevPage) => (prevPage === 0 ? prevPage : prevPage - 1));\n\t};\n\n\tconst handlePageClick = (pageIndex) => {\n\t\tsetCurrentPage(pageIndex);\n\t};\n\n\tuseEffect(() => {\n\t\tif (carouselRef.current) {\n\t\t\tcarouselRef.current.scrollTo({\n\t\t\t\tleft: carouselRef.current.offsetWidth * currentPage,\n\t\t\t\tbehavior: 'smooth',\n\t\t\t});\n\t\t}\n\t}, [currentPage]);\n\n\treturn (\n\t\t<CarouselContainer version={version ? version : CarouselVersion.V1}>\n\t\t\t<CarouselBody ref={carouselRef} textAlign={textAlign}>\n\t\t\t\t{pages.map((page, index) => (\n\t\t\t\t\t<CarouselPage key={index} isActive={index === currentPage}>\n\t\t\t\t\t\t{page}\n\t\t\t\t\t</CarouselPage>\n\t\t\t\t))}\n\t\t\t</CarouselBody>\n\t\t\t<CarouselFooter version={version ? version : CarouselVersion.V1}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tvisibility:\n\t\t\t\t\t\t\tversion === CarouselVersion.V2 && currentPage === 0\n\t\t\t\t\t\t\t\t? 'hidden'\n\t\t\t\t\t\t\t\t: 'visible',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Back'}\n\t\t\t\t\t\tbuttonType={'tertiaryGray'}\n\t\t\t\t\t\tonClick={handlePrevPage}\n\t\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\t\tLeadingIcon={\n\t\t\t\t\t\t\tversion === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronLeftIcon2\n\t\t\t\t\t\t\t\t: ChevronLeftIcon\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdisabled={!currentPage}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<PageIndicator>\n\t\t\t\t\t{pages.map((_, index) => (\n\t\t\t\t\t\t<Indicator\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tisActive={index === currentPage}\n\t\t\t\t\t\t\tversion={version ? version : CarouselVersion.V1}\n\t\t\t\t\t\t\tonClick={() => handlePageClick(index)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</PageIndicator>\n\t\t\t\t<Button\n\t\t\t\t\tbuttonText={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t: 'Get started'\n\t\t\t\t\t\t\t: 'Next'\n\t\t\t\t\t}\n\t\t\t\t\tbuttonType={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: version === CarouselVersion.V2\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: 'tertiaryGray'\n\t\t\t\t\t}\n\t\t\t\t\tonClick={handleNextPage}\n\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\tTrailingIcon={\n\t\t\t\t\t\tcurrentPage < pages.length - 1\n\t\t\t\t\t\t\t? version === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronRightIcon2\n\t\t\t\t\t\t\t\t: ChevronRightIcon\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tversion === CarouselVersion.V2 ? {} : { background: 'transparent' }\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</CarouselFooter>\n\t\t</CarouselContainer>\n\t);\n};\nexport { CarouselVersion };\n"],"names":["CarouselSecondary","pages","onComplete","textAlign","version","onCompleteText","currentPage","setCurrentPage","useState","carouselRef","useRef","useEffect","current","scrollTo","left","offsetWidth","behavior","_jsxs","CarouselContainer","Object","assign","CarouselVersion","V1","children","_jsx","jsx","CarouselBody","ref","map","page","index","CarouselPage","isActive","jsxs","CarouselFooter","style","visibility","V2","Button","buttonText","buttonType","onClick","handlePrevPage","prevPage","size","LeadingIcon","ChevronLeftIcon2","ChevronLeftIcon","disabled","PageIndicator","_","Indicator","length","handleNextPage","TrailingIcon","ChevronRightIcon2","ChevronRightIcon","undefined","background"],"mappings":"ijBAwB0DA,EACzDC,QACAC,aACAC,YACAC,UACAC,qBAEA,MAAOC,EAAaC,GAAkBC,EAAQA,SAAC,GACzCC,EAAcC,SAAuB,MA0B3C,OATAC,EAAAA,WAAU,KACLF,EAAYG,SACfH,EAAYG,QAAQC,SAAS,CAC5BC,KAAML,EAAYG,QAAQG,YAAcT,EACxCU,SAAU,UAEX,GACC,CAACV,IAGHW,OAACC,EAAAA,kBAAkBC,OAAAC,OAAA,CAAAhB,QAASA,GAAoBiB,EAAAA,gBAAgBC,IAAE,CAAAC,SAAA,CACjEC,EAACC,IAAAC,8BAAaC,IAAKlB,EAAaN,UAAWA,GACzC,CAAAoB,SAAAtB,EAAM2B,KAAI,CAACC,EAAMC,IACjBN,MAACO,EAAAA,aAAyBZ,OAAAC,OAAA,CAAAY,SAAUF,IAAUxB,GAAW,CAAAiB,SACvDM,IADiBC,QAKrBb,EAACgB,KAAAC,gCAAe9B,QAASA,GAAoBiB,EAAAA,gBAAgBC,IAC5D,CAAAC,SAAA,CAAAC,EAAAC,IAAA,MAAAN,OAAAC,OAAA,CACCe,MAAO,CACNC,WACChC,IAAYiB,kBAAgBgB,IAAsB,IAAhB/B,EAC/B,SACA,YACJ,CAAAiB,SAEDC,MAACc,SAAM,CACNC,WAAY,OACZC,WAAY,eACZC,QAtCkBC,KACtBnC,GAAgBoC,GAA2B,IAAbA,EAAiBA,EAAWA,EAAW,GAAG,EAsCpEC,KAAMxC,IAAYiB,EAAAA,gBAAgBgB,GAAK,QAAU,SACjDQ,YACCzC,IAAYiB,EAAAA,gBAAgBgB,GACzBS,EAAgB,QAChBC,EAAe,QAEnBC,UAAW1C,OAGbkB,EAACC,IAAAwB,gBACC,CAAA1B,SAAAtB,EAAM2B,KAAI,CAACsB,EAAGpB,IACdN,EAACC,IAAA0B,YAEA,CAAAnB,SAAUF,IAAUxB,EACpBF,QAASA,GAAoBiB,EAAAA,gBAAgBC,GAC7CmB,QAASA,KAjDdlC,EAiDoCuB,EAH1B,GAAAA,OAORN,MAACc,SAAM,CACNC,WACCjC,IAAgBL,EAAMmD,OAAS,EAC5B/C,GAEC,cACD,OAEJmC,WACClC,IAAgBL,EAAMmD,OAAS,GAE5BhD,IAAYiB,EAAeA,gBAACgB,GAD5B,WAGA,eAEJI,QAhFmBY,KACtB9C,GAAgBoC,GACfA,IAAa1C,EAAMmD,OAAS,EAAIT,EAAWA,EAAW,IAEnDrC,IAAgBL,EAAMmD,OAAS,GAAGlD,GAAY,EA6E/C0C,KAAMxC,IAAYiB,EAAAA,gBAAgBgB,GAAK,QAAU,SACjDiB,aACChD,EAAcL,EAAMmD,OAAS,EAC1BhD,IAAYiB,EAAAA,gBAAgBgB,GAC3BkB,UACAC,EAAAA,aACDC,EAEJtB,MACC/B,IAAYiB,kBAAgBgB,GAAK,CAAA,EAAK,CAAEqB,WAAY,wBAIpC"}

package/dist/cjs/components/code-block/CodeBlock.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),i=require("../toaster/Toaster.js"),s=require("./CodeBlock.styled.js"),o=require("./CodeBlockHelper.js"),a=require("./types.js");function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var i=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,i.get?i:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}exports.CodeBlock=c=>{let{code:d="",language:l=a.CodeLanguage.JAVASCRIPT,title:u="",hideLineNumbers:h=!1,maxHeight:j="400px",maxWidth:g,theme:m="dark",hideHeader:p=!1,hideCopy:x=!1}=c;const[b,f]=r.useState(!1),[v,C]=r.useState(!1),[y,O]=r.useState("success"),[_,M]=r.useState(d);r.useEffect((()=>{let t=!0;return e.__awaiter(void 0,void 0,void 0,(function*(){try{const r=yield(e=`./languageSpecificFormatting/${l}_file.ts`,Promise.resolve().then((function(){return n(require(e))})));if((null==r?void 0:r.format)&&t)return void M(r.format(d))}catch(e){}var e;t&&M(d)})),()=>{t=!1}}),[d,l]);const T=_.split("\n");return t.jsxs(s.Container,Object.assign({themeMode:m,maxWidth:g},{children:[!p&&t.jsxs(s.Header,Object.assign({themeMode:m},{children:[t.jsxs(s.TitleSection,{children:[!!u&&u&&t.jsx(s.Title,Object.assign({themeMode:m},{children:u})),t.jsx(s.LanguageBadge,Object.assign({bg:(q=l,{javascript:"#FEC02D",python:"#3776ab",java:"#ed8b00",css:"#1572b6",html:"#e34c26",json:"#000000"}[q.toLowerCase()]||("dark"===m?"#6e7681":"#656d76")),color:(e=>{const t={javascript:"#000"};return(null==t?void 0:t[e.toLowerCase()])||"#fff"})(l)},{children:l}))]}),!x&&t.jsx(s.CopyButton,Object.assign({themeMode:m,onClick:()=>e.__awaiter(void 0,void 0,void 0,(function*(){try{yield navigator.clipboard.writeText(d),f(!0),O("success"),C(!0),setTimeout((()=>f(!1)),2e3)}catch(e){O("error"),C(!0)}}))},{children:b?t.jsx(t.Fragment,{children:"✓ Copied"}):t.jsx(t.Fragment,{children:"Copy"})}))]})),t.jsxs(s.CodeContainer,Object.assign({maxHeight:j},{children:[!h&&t.jsx(s.LineNumbers,Object.assign({themeMode:m},{children:T.map(((e,r)=>t.jsx("div",{children:r+1},r)))})),t.jsx(s.Code,Object.assign({themeMode:m},{children:T.map(((e,r)=>t.jsx("div",{style:{minHeight:e.trim()?"20px":"0px"},dangerouslySetInnerHTML:{__html:o.highlightCode(e,l,m)||"&nbsp;"}},r)))}))]})),v&&t.jsx(i.Toaster,{text:"success"===y?"Code copied to clipboard!":"Failed to copy code",autoClose:2e3,type:y,hideProgressBar:!0,onCloseToast:()=>C(!1)})]}));var q};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),i=require("../toaster/Toaster.js"),s=require("./CodeBlock.styled.js"),o=require("./CodeBlockHelper.js"),a=require("./types.js");function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var i=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,i.get?i:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}exports.CodeBlock=({code:c="",language:d=a.CodeLanguage.JAVASCRIPT,title:l="",hideLineNumbers:u=!1,maxHeight:h="400px",maxWidth:j,theme:g="dark",hideHeader:m=!1,hideCopy:p=!1})=>{const[x,b]=r.useState(!1),[f,v]=r.useState(!1),[C,y]=r.useState("success"),[O,_]=r.useState(c);r.useEffect((()=>{let t=!0;return e.__awaiter(void 0,void 0,void 0,(function*(){try{const r=yield(e=`./languageSpecificFormatting/${d}_file.ts`,Promise.resolve().then((function(){return n(require(e))})));if((null==r?void 0:r.format)&&t)return void _(r.format(c))}catch(e){}var e;t&&_(c)})),()=>{t=!1}}),[c,d]);const M=O.split("\n");return t.jsxs(s.Container,Object.assign({themeMode:g,maxWidth:j},{children:[!m&&t.jsxs(s.Header,Object.assign({themeMode:g},{children:[t.jsxs(s.TitleSection,{children:[!!l&&l&&t.jsx(s.Title,Object.assign({themeMode:g},{children:l})),t.jsx(s.LanguageBadge,Object.assign({bg:(T=d,{javascript:"#FEC02D",python:"#3776ab",java:"#ed8b00",css:"#1572b6",html:"#e34c26",json:"#000000"}[T.toLowerCase()]||("dark"===g?"#6e7681":"#656d76")),color:(e=>{const t={javascript:"#000"};return(null==t?void 0:t[e.toLowerCase()])||"#fff"})(d)},{children:d}))]}),!p&&t.jsx(s.CopyButton,Object.assign({themeMode:g,onClick:()=>e.__awaiter(void 0,void 0,void 0,(function*(){try{yield navigator.clipboard.writeText(c),b(!0),y("success"),v(!0),setTimeout((()=>b(!1)),2e3)}catch(e){y("error"),v(!0)}}))},{children:x?t.jsx(t.Fragment,{children:"✓ Copied"}):t.jsx(t.Fragment,{children:"Copy"})}))]})),t.jsxs(s.CodeContainer,Object.assign({maxHeight:h},{children:[!u&&t.jsx(s.LineNumbers,Object.assign({themeMode:g},{children:M.map(((e,r)=>t.jsx("div",{children:r+1},r)))})),t.jsx(s.Code,Object.assign({themeMode:g},{children:M.map(((e,r)=>t.jsx("div",{style:{minHeight:e.trim()?"20px":"0px"},dangerouslySetInnerHTML:{__html:o.highlightCode(e,d,g)||"&nbsp;"}},r)))}))]})),f&&t.jsx(i.Toaster,{text:"success"===C?"Code copied to clipboard!":"Failed to copy code",autoClose:2e3,type:C,hideProgressBar:!0,onCloseToast:()=>v(!1)})]}));var T};
 //# sourceMappingURL=CodeBlock.js.map

package/dist/cjs/components/code-block/CodeBlock.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CodeBlock.js","sources":["../../../../src/components/code-block/CodeBlock.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { Toaster } from '@src/components/toaster/Toaster';\nimport {\n\tCode,\n\tCodeContainer,\n\tContainer,\n\tCopyButton,\n\tHeader,\n\tLanguageBadge,\n\tLineNumbers,\n\tTitle,\n\tTitleSection,\n} from './CodeBlock.styled';\nimport { highlightCode } from './CodeBlockHelper';\nimport { CodeBlockProps, CodeLanguage } from './types';\n\n// optional types extraction\n\nexport const CodeBlock = ({\n\tcode = '',\n\tlanguage = CodeLanguage.JAVASCRIPT,\n\ttitle = '',\n\thideLineNumbers = false,\n\tmaxHeight = '400px',\n\tmaxWidth,\n\ttheme = 'dark',\n\thideHeader = false,\n\thideCopy = false,\n}: CodeBlockProps) => {\n\tconst [copied, setCopied] = useState(false);\n\tconst [showToaster, setShowToaster] = useState(false);\n\tconst [toasterType, setToasterType] = useState<'success' \| 'error'>(\n\t\t'success',\n\t);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(code);\n\t\t\tsetCopied(true);\n\t\t\tsetToasterType('success');\n\t\t\tsetShowToaster(true);\n\t\t\tsetTimeout(() => setCopied(false), 2000);\n\t\t} catch (err) {\n\t\t\tsetToasterType('error');\n\t\t\tsetShowToaster(true);\n\t\t}\n\t};\n\n\t// Apply language-specific formatting\n\tconst [formattedCode, setFormattedCode] = useState(code);\n\n\tuseEffect(() => {\n\t\tlet isMounted = true;\n\t\tconst formatCode = async () => {\n\t\t\ttry {\n\t\t\t\tconst formatterModule = await import(\n\t\t\t\t\t/* webpackChunkName: \"languageSpecificFormatting-[request]\" */\n\t\t\t\t\t`./languageSpecificFormatting/${language}_file.ts`\n\t\t\t\t);\n\t\t\t\tif (formatterModule?.format && isMounted) {\n\t\t\t\t\tsetFormattedCode(formatterModule.format(code));\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t} catch {\n\t\t\t\t// No formatter found — just use original\n\t\t\t}\n\t\t\tif (isMounted) setFormattedCode(code);\n\t\t};\n\n\t\tformatCode();\n\t\treturn () => {\n\t\t\tisMounted = false;\n\t\t};\n\t}, [code, language]);\n\n\tconst lines = formattedCode.split('\\n');\n\n\tconst getLanguageBadgeColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<CodeLanguage, string> = {\n\t\t\tjavascript: '#FEC02D',\n\t\t\tpython: '#3776ab',\n\t\t\tjava: '#ed8b00',\n\t\t\tcss: '#1572b6',\n\t\t\thtml: '#e34c26',\n\t\t\tjson: '#000000',\n\t\t};\n\t\treturn (\n\t\t\tcolors[lang.toLowerCase()] \|\| (theme === 'dark' ? '#6e7681' : '#656d76')\n\t\t);\n\t};\n\n\tconst getBadgeTextColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<string, string> = {\n\t\t\tjavascript: '#000',\n\t\t};\n\t\treturn colors?.[lang.toLowerCase()] \|\| '#fff';\n\t};\n\n\treturn (\n\t\t<Container themeMode={theme} maxWidth={maxWidth}>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header themeMode={theme}>\n\t\t\t\t\t<TitleSection>\n\t\t\t\t\t\t{!!title && title && <Title themeMode={theme}>{title}</Title>}\n\t\t\t\t\t\t<LanguageBadge\n\t\t\t\t\t\t\tbg={getLanguageBadgeColor(language)}\n\t\t\t\t\t\t\tcolor={getBadgeTextColor(language)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{language}\n\t\t\t\t\t\t</LanguageBadge>\n\t\t\t\t\t</TitleSection>\n\t\t\t\t\t{!hideCopy && (\n\t\t\t\t\t\t<CopyButton themeMode={theme} onClick={handleCopy}>\n\t\t\t\t\t\t\t{copied ? <>✓ Copied</> : <>Copy</>}\n\t\t\t\t\t\t</CopyButton>\n\t\t\t\t\t)}\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<CodeContainer maxHeight={maxHeight}>\n\t\t\t\t{!hideLineNumbers && (\n\t\t\t\t\t<LineNumbers themeMode={theme}>\n\t\t\t\t\t\t{lines.map((_, index) => (\n\t\t\t\t\t\t\t<div key={index}>{index + 1}</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</LineNumbers>\n\t\t\t\t)}\n\t\t\t\t<Code themeMode={theme}>\n\t\t\t\t\t{lines.map((line, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tstyle={{ minHeight: line.trim() ? '20px' : '0px' }}\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t\t__html: highlightCode(line, language, theme) \|\| ' ',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</Code>\n\t\t\t</CodeContainer>\n\t\t\t{showToaster && (\n\t\t\t\t<Toaster\n\t\t\t\t\ttext={\n\t\t\t\t\t\ttoasterType === 'success'\n\t\t\t\t\t\t\t? 'Code copied to clipboard!'\n\t\t\t\t\t\t\t: 'Failed to copy code'\n\t\t\t\t\t}\n\t\t\t\t\tautoClose={2000}\n\t\t\t\t\ttype={toasterType}\n\t\t\t\t\thideProgressBar\n\t\t\t\t\tonCloseToast={() => setShowToaster(false)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n"],"names":["~~_ref~~","code","language","CodeLanguage","JAVASCRIPT","title","hideLineNumbers","maxHeight","maxWidth","theme","hideHeader","hideCopy","copied","setCopied","useState","showToaster","setShowToaster","toasterType","setToasterType","formattedCode","setFormattedCode","useEffect","isMounted","__awaiter","formatterModule","t","Promise","resolve","then","_interopNamespace","require","format","_a","lines","split","_jsxs","Container","themeMode","jsxs","Header","Object","assign","TitleSection","_jsx","Title","children","jsx","LanguageBadge","bg","lang","javascript","python","java","css","html","json","toLowerCase","color","colors","getBadgeTextColor","CopyButton","onClick","handleCopy","navigator","clipboard","writeText","setTimeout","err","_Fragment","CodeContainer","LineNumbers","map","_","index","Code","line","style","minHeight","trim","dangerouslySetInnerHTML","__html","highlightCode","Toaster","text","autoClose","type","hideProgressBar","onCloseToast"],"mappings":"ilBAkByBA,~~IAUJ~~,~~IAVKC~~,~~KACzBA~~,~~EAAO~~,~~GAAEC,SACTA,EAAWC,~~EAAYA,aAACC,~~WAAUC~~,~~MAClCA~~,~~EAAQ~~,~~GAAEC~~,~~gBACVA~~,~~GAAkB~~,~~EAAKC~~,~~UACvBA~~,~~EAAY~~,~~QAAOC~~,~~SACnBA~~,~~EAAQC~~,~~MACRA~~,~~EAAQ~~,~~OAAMC~~,~~WACdA,GAAa,EAAKC,SAClBA,GAAW,GACKX,EAChB,MAAOY,~~EAAQC,GAAaC,EAAQA,UAAC,IAC9BC,EAAaC,GAAkBF,EAAQA,UAAC,IACxCG,EAAaC,GAAkBJ,EAAQA,SAC7C,YAiBMK,EAAeC,GAAoBN,EAAQA,SAACb,GAEnDoB,EAAAA,WAAU,KACT,IAAIC,GAAY,EAkBhB,OAjB8BC,iBAAA,OAAA,OAAA,GAAA,YAC7B,IACC,MAAMC,QACLC,~~EACgC~~,~~gCAAAvB~~,YADhCwB,QAAAC,UAAAC,MAAA,WAAA,OAAAC,EAAAC,QAAAL,GAAA,KAGD,IAAID,aAAe,EAAfA,EAAiBO,SAAUT,EAE9B,YADAF,EAAiBI,EAAgBO,OAAO9B,GAGzC,CAAC,MAAM+B,GACP,CAT8B,IAC7BP,EAUEH,GAAWF,EAAiBnB,EACjC,IAGO,KACNqB,GAAY,CAAK,CACjB,GACC,CAACrB,EAAMC,IAEV,MAAM+B,EAAQd,EAAce,MAAM,MAuBlC,OACCC,OAACC,EAAAA,yBAAUC,UAAW5B,EAAOD,SAAUA,eACpCE,GACDyB,EAAAG,KAACC,EAAMA,OAACC,OAAAC,OAAA,CAAAJ,UAAW5B,cAClB0B,EAACG,KAAAI,4BACGrC,GAASA,GAASsC,EAAAA,IAACC,EAAKA,MAACJ,OAAAC,OAAA,CAAAJ,UAAW5B,GAAK,CAAAoC,SAAGxC,KAC/CsC,EAACG,IAAAC,+BACAC,IA5ByBC,EA4BC/C,EA3Bc,CAC5CgD,WAAY,UACZC,OAAQ,UACRC,KAAM,UACNC,IAAK,UACLC,KAAM,UACNC,KAAM,WAGCN,EAAKO,iBAA6B,SAAV/C,EAAmB,UAAY,YAmB1DgD,MAfqBR,KAC1B,MAAMS,EAAiC,CACtCR,WAAY,QAEb,OAAOQ,eAAAA,EAAST,EAAKO,iBAAkB,MAAM,EAWjCG,CAAkBzD,cAExBA,SAGDS,GACDgC,EAAAA,IAACiB,EAAAA,0BAAWvB,UAAW5B,EAAOoD,QA7EhBC,IAAWvC,iBAAA,OAAA,OAAA,GAAA,YAC7B,UACOwC,UAAUC,UAAUC,UAAUhE,GACpCY,GAAU,GACVK,EAAe,WACfF,GAAe,GACfkD,YAAW,IAAMrD,GAAU,IAAQ,IACnC,CAAC,MAAOsD,GACRjD,EAAe,SACfF,GAAe,EACf,CACF,KAkEsD,CAAA6B,SAC/CjC,EAAS+B,EAAaG,IAAAsB,WAAA,CAAAvB,SAAA,aAAGF,EAAAG,IAAAsB,WAAA,CAAAvB,SAAA,gBAM9BV,OAACkC,gBAAa7B,OAAAC,OAAA,CAAClC,UAAWA,GACxB,CAAAsC,SAAA,EAACvC,GACDqC,MAAC2B,EAAWA,YAAA9B,OAAAC,OAAA,CAACJ,UAAW5B,GACtB,CAAAoC,SAAAZ,EAAMsC,KAAI,CAACC,EAAGC,IACd9B,sBAAkB8B,EAAQ,GAAhBA,QAIb9B,EAACG,IAAA4B,sBAAKrC,UAAW5B,GACf,CAAAoC,SAAAZ,EAAMsC,KAAI,CAACI,EAAMF,IACjB9B,EAECG,IAAA,MAAA,CAAA8B,MAAO,CAAEC,UAAWF,EAAKG,OAAS,OAAS,OAC3CC,wBAAyB,CACxBC,OAAQC,EAAAA,cAAcN,EAAMzE,EAAUO,IAAU,WAH5CgE,YASR1D,GACA4B,MAACuC,UAAO,CACPC,KACiB,YAAhBlE,EACG,4BACA,sBAEJmE,UAAW,IACXC,KAAMpE,EACNqE,iBAAe,EACfC,aAAcA,IAAMvE,GAAe,SAxERiC,KA2ElB"}
1	+ {"version":3,"file":"CodeBlock.js","sources":["../../../../src/components/code-block/CodeBlock.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { Toaster } from '@src/components/toaster/Toaster';\nimport {\n\tCode,\n\tCodeContainer,\n\tContainer,\n\tCopyButton,\n\tHeader,\n\tLanguageBadge,\n\tLineNumbers,\n\tTitle,\n\tTitleSection,\n} from './CodeBlock.styled';\nimport { highlightCode } from './CodeBlockHelper';\nimport { CodeBlockProps, CodeLanguage } from './types';\n\n// optional types extraction\n\nexport const CodeBlock = ({\n\tcode = '',\n\tlanguage = CodeLanguage.JAVASCRIPT,\n\ttitle = '',\n\thideLineNumbers = false,\n\tmaxHeight = '400px',\n\tmaxWidth,\n\ttheme = 'dark',\n\thideHeader = false,\n\thideCopy = false,\n}: CodeBlockProps) => {\n\tconst [copied, setCopied] = useState(false);\n\tconst [showToaster, setShowToaster] = useState(false);\n\tconst [toasterType, setToasterType] = useState<'success' \| 'error'>(\n\t\t'success',\n\t);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(code);\n\t\t\tsetCopied(true);\n\t\t\tsetToasterType('success');\n\t\t\tsetShowToaster(true);\n\t\t\tsetTimeout(() => setCopied(false), 2000);\n\t\t} catch (err) {\n\t\t\tsetToasterType('error');\n\t\t\tsetShowToaster(true);\n\t\t}\n\t};\n\n\t// Apply language-specific formatting\n\tconst [formattedCode, setFormattedCode] = useState(code);\n\n\tuseEffect(() => {\n\t\tlet isMounted = true;\n\t\tconst formatCode = async () => {\n\t\t\ttry {\n\t\t\t\tconst formatterModule = await import(\n\t\t\t\t\t/* webpackChunkName: \"languageSpecificFormatting-[request]\" */\n\t\t\t\t\t`./languageSpecificFormatting/${language}_file.ts`\n\t\t\t\t);\n\t\t\t\tif (formatterModule?.format && isMounted) {\n\t\t\t\t\tsetFormattedCode(formatterModule.format(code));\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t} catch {\n\t\t\t\t// No formatter found — just use original\n\t\t\t}\n\t\t\tif (isMounted) setFormattedCode(code);\n\t\t};\n\n\t\tformatCode();\n\t\treturn () => {\n\t\t\tisMounted = false;\n\t\t};\n\t}, [code, language]);\n\n\tconst lines = formattedCode.split('\\n');\n\n\tconst getLanguageBadgeColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<CodeLanguage, string> = {\n\t\t\tjavascript: '#FEC02D',\n\t\t\tpython: '#3776ab',\n\t\t\tjava: '#ed8b00',\n\t\t\tcss: '#1572b6',\n\t\t\thtml: '#e34c26',\n\t\t\tjson: '#000000',\n\t\t};\n\t\treturn (\n\t\t\tcolors[lang.toLowerCase()] \|\| (theme === 'dark' ? '#6e7681' : '#656d76')\n\t\t);\n\t};\n\n\tconst getBadgeTextColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<string, string> = {\n\t\t\tjavascript: '#000',\n\t\t};\n\t\treturn colors?.[lang.toLowerCase()] \|\| '#fff';\n\t};\n\n\treturn (\n\t\t<Container themeMode={theme} maxWidth={maxWidth}>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header themeMode={theme}>\n\t\t\t\t\t<TitleSection>\n\t\t\t\t\t\t{!!title && title && <Title themeMode={theme}>{title}</Title>}\n\t\t\t\t\t\t<LanguageBadge\n\t\t\t\t\t\t\tbg={getLanguageBadgeColor(language)}\n\t\t\t\t\t\t\tcolor={getBadgeTextColor(language)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{language}\n\t\t\t\t\t\t</LanguageBadge>\n\t\t\t\t\t</TitleSection>\n\t\t\t\t\t{!hideCopy && (\n\t\t\t\t\t\t<CopyButton themeMode={theme} onClick={handleCopy}>\n\t\t\t\t\t\t\t{copied ? <>✓ Copied</> : <>Copy</>}\n\t\t\t\t\t\t</CopyButton>\n\t\t\t\t\t)}\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<CodeContainer maxHeight={maxHeight}>\n\t\t\t\t{!hideLineNumbers && (\n\t\t\t\t\t<LineNumbers themeMode={theme}>\n\t\t\t\t\t\t{lines.map((_, index) => (\n\t\t\t\t\t\t\t<div key={index}>{index + 1}</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</LineNumbers>\n\t\t\t\t)}\n\t\t\t\t<Code themeMode={theme}>\n\t\t\t\t\t{lines.map((line, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tstyle={{ minHeight: line.trim() ? '20px' : '0px' }}\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t\t__html: highlightCode(line, language, theme) \|\| ' ',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</Code>\n\t\t\t</CodeContainer>\n\t\t\t{showToaster && (\n\t\t\t\t<Toaster\n\t\t\t\t\ttext={\n\t\t\t\t\t\ttoasterType === 'success'\n\t\t\t\t\t\t\t? 'Code copied to clipboard!'\n\t\t\t\t\t\t\t: 'Failed to copy code'\n\t\t\t\t\t}\n\t\t\t\t\tautoClose={2000}\n\t\t\t\t\ttype={toasterType}\n\t\t\t\t\thideProgressBar\n\t\t\t\t\tonCloseToast={() => setShowToaster(false)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n"],"names":["CodeBlock","code","language","CodeLanguage","JAVASCRIPT","title","hideLineNumbers","maxHeight","maxWidth","theme","hideHeader","hideCopy","copied","setCopied","useState","showToaster","setShowToaster","toasterType","setToasterType","formattedCode","setFormattedCode","useEffect","isMounted","__awaiter","formatterModule","t","Promise","resolve","then","_interopNamespace","require","format","_a","lines","split","_jsxs","Container","themeMode","jsxs","Header","Object","assign","TitleSection","_jsx","Title","children","jsx","LanguageBadge","bg","lang","javascript","python","java","css","html","json","toLowerCase","color","colors","getBadgeTextColor","CopyButton","onClick","handleCopy","navigator","clipboard","writeText","setTimeout","err","_Fragment","CodeContainer","LineNumbers","map","_","index","Code","line","style","minHeight","trim","dangerouslySetInnerHTML","__html","highlightCode","Toaster","text","autoClose","type","hideProgressBar","onCloseToast"],"mappings":"ilBAkByBA,EACxBC,OAAO,GACPC,WAAWC,EAAYA,aAACC,WACxBC,QAAQ,GACRC,mBAAkB,EAClBC,YAAY,QACZC,WACAC,QAAQ,OACRC,cAAa,EACbC,YAAW,MAEX,MAAOC,EAAQC,GAAaC,EAAQA,UAAC,IAC9BC,EAAaC,GAAkBF,EAAQA,UAAC,IACxCG,EAAaC,GAAkBJ,EAAQA,SAC7C,YAiBMK,EAAeC,GAAoBN,EAAQA,SAACb,GAEnDoB,EAAAA,WAAU,KACT,IAAIC,GAAY,EAkBhB,OAjB8BC,iBAAA,OAAA,OAAA,GAAA,YAC7B,IACC,MAAMC,QACLC,EACA,gCAAgCvB,YADhCwB,QAAAC,UAAAC,MAAA,WAAA,OAAAC,EAAAC,QAAAL,GAAA,KAGD,IAAID,aAAe,EAAfA,EAAiBO,SAAUT,EAE9B,YADAF,EAAiBI,EAAgBO,OAAO9B,GAGzC,CAAC,MAAM+B,GACP,CAT8B,IAC7BP,EAUEH,GAAWF,EAAiBnB,EACjC,IAGO,KACNqB,GAAY,CAAK,CACjB,GACC,CAACrB,EAAMC,IAEV,MAAM+B,EAAQd,EAAce,MAAM,MAuBlC,OACCC,OAACC,EAAAA,yBAAUC,UAAW5B,EAAOD,SAAUA,eACpCE,GACDyB,EAAAG,KAACC,EAAMA,OAACC,OAAAC,OAAA,CAAAJ,UAAW5B,cAClB0B,EAACG,KAAAI,4BACGrC,GAASA,GAASsC,EAAAA,IAACC,EAAKA,MAACJ,OAAAC,OAAA,CAAAJ,UAAW5B,GAAK,CAAAoC,SAAGxC,KAC/CsC,EAACG,IAAAC,+BACAC,IA5ByBC,EA4BC/C,EA3Bc,CAC5CgD,WAAY,UACZC,OAAQ,UACRC,KAAM,UACNC,IAAK,UACLC,KAAM,UACNC,KAAM,WAGCN,EAAKO,iBAA6B,SAAV/C,EAAmB,UAAY,YAmB1DgD,MAfqBR,KAC1B,MAAMS,EAAiC,CACtCR,WAAY,QAEb,OAAOQ,eAAAA,EAAST,EAAKO,iBAAkB,MAAM,EAWjCG,CAAkBzD,cAExBA,SAGDS,GACDgC,EAAAA,IAACiB,EAAAA,0BAAWvB,UAAW5B,EAAOoD,QA7EhBC,IAAWvC,iBAAA,OAAA,OAAA,GAAA,YAC7B,UACOwC,UAAUC,UAAUC,UAAUhE,GACpCY,GAAU,GACVK,EAAe,WACfF,GAAe,GACfkD,YAAW,IAAMrD,GAAU,IAAQ,IACnC,CAAC,MAAOsD,GACRjD,EAAe,SACfF,GAAe,EACf,CACF,KAkEsD,CAAA6B,SAC/CjC,EAAS+B,EAAaG,IAAAsB,WAAA,CAAAvB,SAAA,aAAGF,EAAAG,IAAAsB,WAAA,CAAAvB,SAAA,gBAM9BV,OAACkC,gBAAa7B,OAAAC,OAAA,CAAClC,UAAWA,GACxB,CAAAsC,SAAA,EAACvC,GACDqC,MAAC2B,EAAWA,YAAA9B,OAAAC,OAAA,CAACJ,UAAW5B,GACtB,CAAAoC,SAAAZ,EAAMsC,KAAI,CAACC,EAAGC,IACd9B,sBAAkB8B,EAAQ,GAAhBA,QAIb9B,EAACG,IAAA4B,sBAAKrC,UAAW5B,GACf,CAAAoC,SAAAZ,EAAMsC,KAAI,CAACI,EAAMF,IACjB9B,EAECG,IAAA,MAAA,CAAA8B,MAAO,CAAEC,UAAWF,EAAKG,OAAS,OAAS,OAC3CC,wBAAyB,CACxBC,OAAQC,EAAAA,cAAcN,EAAMzE,EAAUO,IAAU,WAH5CgE,YASR1D,GACA4B,MAACuC,UAAO,CACPC,KACiB,YAAhBlE,EACG,4BACA,sBAEJmE,UAAW,IACXC,KAAMpE,EACNqE,iBAAe,EACfC,aAAcA,IAAMvE,GAAe,SAxERiC,KA2ElB"}

package/dist/cjs/components/code-block/CodeBlock.styled.js CHANGED Viewed

@@ -1,56 +1,56 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var r=e(require("styled-components"));const t=r.default.div`
-	background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#0d1117":"#ffffff"}};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var o=e(require("styled-components"));const r=o.default.div`
+	background-color: ${({themeMode:e})=>"dark"===e?"#0d1117":"#ffffff"};
 	border: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#d0d7de"}};
+		${({themeMode:e})=>"dark"===e?"#30363d":"#d0d7de"};
 	border-radius: 6px;
 	overflow: hidden;
 	font-family: ui-monospace, SFMono-Regular, 'SF Mono', Consolas,
 		'Liberation Mono', Menlo, monospace;
 	margin-bottom: 1rem;
-	${e=>{let{maxWidth:r}=e;return r&&`max-width: ${r};`}}
-`,o=r.default.div`
-	background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#161b22":"#f6f8fa"}};
+	${({maxWidth:e})=>e&&`max-width: ${e};`}
+`,t=o.default.div`
+	background-color: ${({themeMode:e})=>"dark"===e?"#161b22":"#f6f8fa"};
 	border-bottom: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#d0d7de"}};
+		${({themeMode:e})=>"dark"===e?"#30363d":"#d0d7de"};
 	padding: 8px 16px;
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
-`;r.default.div`
+`;o.default.div`
 	display: flex;
 	gap: 6px;
 	align-items: center;
-`,r.default.div`
+`,o.default.div`
 	width: 12px;
 	height: 12px;
 	border-radius: 50%;
-	background-color: ${e=>{let{color:r}=e;return r}};
-`;const d=r.default.div`
+	background-color: ${({color:e})=>e};
+`;const d=o.default.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
 	flex: 1;
 	margin-left: 12px;
-`,n=r.default.span`
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
+`,a=o.default.span`
+	color: ${({themeMode:e})=>"dark"===e?"#f0f6fc":"#24292f"};
 	font-size: 14px;
 	font-weight: 500;
-`,a=r.default.div`
-	background-color: ${e=>{let{bg:r}=e;return r}};
-	color: ${e=>{let{color:r}=e;return r||"#ffffff"}};
+`,i=o.default.div`
+	background-color: ${({bg:e})=>e};
+	color: ${({color:e})=>e||"#ffffff"};
 	padding: 2px 6px;
 	border-radius: 4px;
 	font-size: 12px;
 	font-weight: 400;
 	text-transform: Capitalize;
 	font-family: Inter;
-`,l=r.default.button`
+`,n=o.default.button`
 	background-color: transparent;
 	border: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#616161"}};
+		${({themeMode:e})=>"dark"===e?"#30363d":"#616161"};
 	border-radius: 4px;
 	padding: 4px 12px;
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
+	color: ${({themeMode:e})=>"dark"===e?"#f0f6fc":"#24292f"};
 	font-size: 12px;
 	cursor: pointer;
 	display: flex;
@@ -59,31 +59,31 @@
 	transition: background-color 0.2s ease;
 	font-family: Inter;
 	&:hover {
-		background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#21262d":"#f3f4f6"}};
+		background-color: ${({themeMode:e})=>"dark"===e?"#21262d":"#f3f4f6"};
 	}
-`,i=r.default.div`
-	max-height: ${e=>{let{maxHeight:r}=e;return r}};
+`,f=o.default.div`
+	max-height: ${({maxHeight:e})=>e};
 	overflow: auto;
 	display: flex;
 	/* Ensure this is the only scroll container */
 	min-width: 0;
-`,f=r.default.div`
-	background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#0d1117":"#f6f8fa"}};
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#6e7681":"#656d76"}};
+`,l=o.default.div`
+	background-color: ${({themeMode:e})=>"dark"===e?"#0d1117":"#f6f8fa"};
+	color: ${({themeMode:e})=>"dark"===e?"#6e7681":"#656d76"};
 	padding: 16px 12px;
 	font-size: 12px;
 	line-height: 20px;
 	text-align: right;
 	user-select: none;
 	border-right: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#21262d":"#d0d7de"}};
+		${({themeMode:e})=>"dark"===e?"#21262d":"#d0d7de"};
 	min-width: 40px;
-`,p=r.default.pre`
+`,p=o.default.pre`
 	flex: 1;
 	padding: 16px;
 	font-size: 12px;
 	line-height: 20px;
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
+	color: ${({themeMode:e})=>"dark"===e?"#f0f6fc":"#24292f"};
 	background-color: transparent;
 	margin: 0;
 	white-space: pre;
@@ -92,21 +92,21 @@
 	min-width: 0; /* Ensures proper shrinking in flex container */
 	.keyword {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#79c0ff":"#0969da"}};
+		color: ${({themeMode:e})=>"dark"===e?"#79c0ff":"#0969da"};
 		font-weight: 600;
 	}
 	.string {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#a5d6ff":"#0a3069"}};
+		color: ${({themeMode:e})=>"dark"===e?"#a5d6ff":"#0a3069"};
 	}
 	.comment {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#8b949e":"#656d76"}};
+		color: ${({themeMode:e})=>"dark"===e?"#8b949e":"#656d76"};
 		font-style: italic;
 	}
 	.number {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#79c0ff":"#0969da"}};
+		color: ${({themeMode:e})=>"dark"===e?"#79c0ff":"#0969da"};
 	}
-`;exports.Code=p,exports.CodeContainer=i,exports.Container=t,exports.CopyButton=l,exports.Header=o,exports.LanguageBadge=a,exports.LineNumbers=f,exports.Title=n,exports.TitleSection=d;
+`;exports.Code=p,exports.CodeContainer=f,exports.Container=r,exports.CopyButton=n,exports.Header=t,exports.LanguageBadge=i,exports.LineNumbers=l,exports.Title=a,exports.TitleSection=d;
 //# sourceMappingURL=CodeBlock.styled.js.map

package/dist/cjs/components/code-block/CodeBlock.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CodeBlock.styled.js","sources":["../../../../src/components/code-block/CodeBlock.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div<{\n\tthemeMode: 'dark' \| 'light';\n\tmaxWidth?: string;\n}>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#ffffff'};\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tborder-radius: 6px;\n\toverflow: hidden;\n\tfont-family: ui-monospace, SFMono-Regular, 'SF Mono', Consolas,\n\t\t'Liberation Mono', Menlo, monospace;\n\tmargin-bottom: 1rem;\n\t${({ maxWidth }) => maxWidth && `max-width: ${maxWidth};`}\n`;\n\nexport const Header = styled.div<{ themeMode: 'dark' \| 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#161b22' : '#f6f8fa'};\n\tborder-bottom: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tpadding: 8px 16px;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n`;\n\nexport const WindowControls = styled.div`\n\tdisplay: flex;\n\tgap: 6px;\n\talign-items: center;\n`;\n\nexport const Dot = styled.div<{ color: string }>`\n\twidth: 12px;\n\theight: 12px;\n\tborder-radius: 50%;\n\tbackground-color: ${({ color }) => color};\n`;\n\nexport const TitleSection = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex: 1;\n\tmargin-left: 12px;\n`;\n\nexport const Title = styled.span<{ themeMode: 'dark' \| 'light' }>`\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 14px;\n\tfont-weight: 500;\n`;\n\nexport const LanguageBadge = styled.div<{ bg: string; color?: string }>`\n\tbackground-color: ${({ bg }) => bg};\n\tcolor: ${({ color }) => color \|\| '#ffffff'};\n\tpadding: 2px 6px;\n\tborder-radius: 4px;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\ttext-transform: Capitalize;\n\tfont-family: Inter;\n`;\n\nexport const CopyButton = styled.button<{ themeMode: 'dark' \| 'light' }>`\n\tbackground-color: transparent;\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#616161')};\n\tborder-radius: 4px;\n\tpadding: 4px 12px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 12px;\n\tcursor: pointer;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\ttransition: background-color 0.2s ease;\n\tfont-family: Inter;\n\t&:hover {\n\t\tbackground-color: ${({ themeMode }) =>\n\t\t\tthemeMode === 'dark' ? '#21262d' : '#f3f4f6'};\n\t}\n`;\n\nexport const CodeContainer = styled.div<{ maxHeight: string }>`\n\tmax-height: ${({ maxHeight }) => maxHeight};\n\toverflow: auto;\n\tdisplay: flex;\n\t/* Ensure this is the only scroll container /\n\tmin-width: 0;\n`;\n\nexport const LineNumbers = styled.div<{ themeMode: 'dark' \| 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#f6f8fa'};\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#6e7681' : '#656d76')};\n\tpadding: 16px 12px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\ttext-align: right;\n\tuser-select: none;\n\tborder-right: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#21262d' : '#d0d7de')};\n\tmin-width: 40px;\n`;\n\nexport const Code = styled.pre<{ themeMode: 'dark' \| 'light' }>`\n\tflex: 1;\n\tpadding: 16px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tbackground-color: transparent;\n\tmargin: 0;\n\twhite-space: pre;\n\t/ Remove overflow-x from here since parent handles all scrolling /\n\toverflow: visible;\n\tmin-width: 0; / Ensures proper shrinking in flex container */\n\n\t.keyword {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t\tfont-weight: 600;\n\t}\n\n\t.string {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#a5d6ff' : '#0a3069')};\n\t}\n\n\t.comment {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#8b949e' : '#656d76')};\n\t\tfont-style: italic;\n\t}\n\n\t.number {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t}\n`;\n"],"names":["Container","styled","div","~~_ref","~~themeMode","~~_ref2","_ref3","~~maxWidth","Header","~~_ref4","_ref5","_ref6","~~color","TitleSection","Title","span","~~_ref7","~~LanguageBadge","~~_ref8","~~bg","~~_ref9","~~CopyButton","button","~~_ref10","_ref11","_ref12","~~CodeContainer","~~_ref13","~~maxHeight","LineNumbers","~~_ref14","_ref15","_ref16","~~Code","pre"~~,"_ref17","_ref18","_ref19","_ref20","_ref21"~~],"mappings":"kLAEaA,MAAAA,EAAYC,EAAM,QAACC,GAG9B;~~qBACmBC~~,~~IAAA~~,~~IAACC~~,~~UAAEA~~,~~GAAWD,EAAA,MACnB,SAAdC,~~EAAuB,UAAY~~,SAAS~~;;~~IAE1CC~~,~~IAAA~~,~~IAACD~~,~~UAAEA~~,~~GAAWC,EAAA,MAAoB,SAAdD,~~EAAuB,UAAY~~,SAAS~~;;;;;;~~GAMjEE~~,~~IAAA~~,~~IAACC~~,~~SAAEA~~,~~GAAUD,EAAA,OAAKC,GAA0B,cAAAA,IAAW~~;~~EAG7CC~~,~~EAASP~~,EAAM,QAACC,GAAoC;~~qBAC5CO~~,~~IAAA~~,~~IAACL~~,~~UAAEA~~,~~GAAWK,EAAA,MACnB,SAAdL,~~EAAuB,UAAY~~,SAAS~~;;~~IAE1CM~~,~~IAAA~~,~~IAACN~~,~~UAAEA~~,~~GAAWM,EAAA,MAAoB,SAAdN,~~EAAuB,UAAY~~,SAAS~~;;;;;~~EAOtCH~~,EAAM,QAACC,GAAG;;;;EAMrBD,EAAM,QAACC,GAAsB;;;;~~qBAI3BS~~,~~IAAA~~,~~IAACC,MAAEA,GAAOD,EAAA,OAAKC,CAAK~~;~~EAG5BC~~,MAAAA,~~EAAeZ~~,EAAM,QAACC,GAAG;;;;;;~~EAQzBY~~,~~EAAQb~~,EAAM,~~QAACc~~,IAAqC;~~UACvDC~~,~~IAAA~~,~~IAACZ~~,~~UAAEA~~,~~GAAWY,EAAA,MAAoB,SAAdZ,~~EAAuB,UAAY~~,SAAS~~;;;~~EAK7Da~~,~~EAAgBhB~~,EAAM,QAACC,GAAmC;~~qBAClDgB~~,~~IAAA~~,~~IAACC,GAAEA,GAAID,EAAA,OAAKC,CAAE~~;~~UACzBC~~,~~IAAA~~,~~IAACR~~,~~MAAEA,GAAOQ,EAAA,OAAKR,~~GAAS~~,SAAS~~;;;;;;;~~EAS9BS~~,~~EAAapB~~,EAAM,~~QAACqB~~,MAAuC;;;~~IAGpEC~~,~~IAAA~~,~~IAACnB~~,~~UAAEA~~,~~GAAWmB,EAAA,MAAoB,SAAdnB,~~EAAuB,UAAY~~,SAAS~~;;;~~UAG1DoB~~,~~IAAA~~,~~IAACpB~~,~~UAAEA~~,~~GAAWoB,EAAA,MAAoB,SAAdpB,~~EAAuB,UAAY~~,SAAS~~;;;;;;;;;~~sBASpDqB~~,~~IAAA~~,~~IAACrB~~,~~UAAEA~~,~~GAAWqB,EAAA,MACnB,SAAdrB,~~EAAuB,UAAY~~,SAAS~~;;~~EAIlCsB~~,~~EAAgBzB~~,EAAM,QAACC,GAA0B;eAC/~~CyB~~,~~IAAA~~,~~IAACC,UAAEA,GAAWD,EAAA,OAAKC,CAAS~~;;;;;~~EAO9BC~~,~~EAAc5B~~,EAAM,QAACC,GAAoC;~~qBACjD4B~~,~~IAAA~~,~~IAAC1B~~,~~UAAEA~~,~~GAAW0B,EAAA,MACnB,SAAd1B,~~EAAuB,UAAY~~,SAAS~~;~~UACpC2B~~,~~IAAA~~,~~IAAC3B~~,~~UAAEA~~,~~GAAW2B,EAAA,MAAoB,SAAd3B,~~EAAuB,UAAY~~,SAAS~~;;;;;;;~~IAOtE4B~~,~~IAAA~~,~~IAAC5B~~,~~UAAEA~~,~~GAAW4B,EAAA,MAAoB,SAAd5B,~~EAAuB,UAAY~~,SAAS~~;;~~EAIvD6B~~,~~EAAOhC~~,EAAM,~~QAACiC~~,GAAoC;;;;;~~UAKrDC~~,~~IAAA~~,~~IAAC/B,UAAEA,GAAW~~+B,~~EAAA~~,~~MAAoB,SAAd/B,~~EAAuB,UAAY~~,SAAS~~;;;;;;;;;~~WAS/DgC~~,~~IAAA~~,~~IAAChC~~,~~UAAEA~~,~~GAAWgC,EAAA,MAAoB,SAAdhC,~~EAAuB,UAAY~~,SAAS~~;;;;;~~WAKhEiC~~,~~IAAA~~,~~IAACjC~~,~~UAAEA~~,~~GAAWiC,EAAA,MAAoB,SAAdjC,~~EAAuB,UAAY~~,SAAS~~;;;;~~WAIhEkC~~,~~IAAA~~,~~IAAClC~~,~~UAAEA~~,~~GAAWkC,EAAA,MAAoB,SAAdlC,~~EAAuB,UAAY~~,SAAS~~;;;;;~~WAKhEmC~~,~~IAAA~~,~~IAACnC~~,~~UAAEA~~,~~GAAWmC,EAAA,MAAoB,SAAdnC,~~EAAuB,UAAY~~,SAAS~~;;"}
1	+ {"version":3,"file":"CodeBlock.styled.js","sources":["../../../../src/components/code-block/CodeBlock.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div<{\n\tthemeMode: 'dark' \| 'light';\n\tmaxWidth?: string;\n}>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#ffffff'};\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tborder-radius: 6px;\n\toverflow: hidden;\n\tfont-family: ui-monospace, SFMono-Regular, 'SF Mono', Consolas,\n\t\t'Liberation Mono', Menlo, monospace;\n\tmargin-bottom: 1rem;\n\t${({ maxWidth }) => maxWidth && `max-width: ${maxWidth};`}\n`;\n\nexport const Header = styled.div<{ themeMode: 'dark' \| 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#161b22' : '#f6f8fa'};\n\tborder-bottom: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tpadding: 8px 16px;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n`;\n\nexport const WindowControls = styled.div`\n\tdisplay: flex;\n\tgap: 6px;\n\talign-items: center;\n`;\n\nexport const Dot = styled.div<{ color: string }>`\n\twidth: 12px;\n\theight: 12px;\n\tborder-radius: 50%;\n\tbackground-color: ${({ color }) => color};\n`;\n\nexport const TitleSection = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex: 1;\n\tmargin-left: 12px;\n`;\n\nexport const Title = styled.span<{ themeMode: 'dark' \| 'light' }>`\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 14px;\n\tfont-weight: 500;\n`;\n\nexport const LanguageBadge = styled.div<{ bg: string; color?: string }>`\n\tbackground-color: ${({ bg }) => bg};\n\tcolor: ${({ color }) => color \|\| '#ffffff'};\n\tpadding: 2px 6px;\n\tborder-radius: 4px;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\ttext-transform: Capitalize;\n\tfont-family: Inter;\n`;\n\nexport const CopyButton = styled.button<{ themeMode: 'dark' \| 'light' }>`\n\tbackground-color: transparent;\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#616161')};\n\tborder-radius: 4px;\n\tpadding: 4px 12px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 12px;\n\tcursor: pointer;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\ttransition: background-color 0.2s ease;\n\tfont-family: Inter;\n\t&:hover {\n\t\tbackground-color: ${({ themeMode }) =>\n\t\t\tthemeMode === 'dark' ? '#21262d' : '#f3f4f6'};\n\t}\n`;\n\nexport const CodeContainer = styled.div<{ maxHeight: string }>`\n\tmax-height: ${({ maxHeight }) => maxHeight};\n\toverflow: auto;\n\tdisplay: flex;\n\t/* Ensure this is the only scroll container /\n\tmin-width: 0;\n`;\n\nexport const LineNumbers = styled.div<{ themeMode: 'dark' \| 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#f6f8fa'};\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#6e7681' : '#656d76')};\n\tpadding: 16px 12px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\ttext-align: right;\n\tuser-select: none;\n\tborder-right: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#21262d' : '#d0d7de')};\n\tmin-width: 40px;\n`;\n\nexport const Code = styled.pre<{ themeMode: 'dark' \| 'light' }>`\n\tflex: 1;\n\tpadding: 16px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tbackground-color: transparent;\n\tmargin: 0;\n\twhite-space: pre;\n\t/ Remove overflow-x from here since parent handles all scrolling /\n\toverflow: visible;\n\tmin-width: 0; / Ensures proper shrinking in flex container */\n\n\t.keyword {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t\tfont-weight: 600;\n\t}\n\n\t.string {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#a5d6ff' : '#0a3069')};\n\t}\n\n\t.comment {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#8b949e' : '#656d76')};\n\t\tfont-style: italic;\n\t}\n\n\t.number {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t}\n`;\n"],"names":["Container","styled","div","themeMode","maxWidth","Header","color","TitleSection","Title","span","LanguageBadge","bg","CopyButton","button","CodeContainer","maxHeight","LineNumbers","Code","pre"],"mappings":"kLAEaA,MAAAA,EAAYC,EAAM,QAACC,GAG9B;qBACmB,EAAGC,eACR,SAAdA,EAAuB,UAAY;;IAEjC,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;;GAMxD,EAAGC,cAAeA,GAAY,cAAcA;EAGlCC,EAASJ,EAAM,QAACC,GAAoC;qBAC5C,EAAGC,eACR,SAAdA,EAAuB,UAAY;;IAEjC,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;EAO7BF,EAAM,QAACC,GAAG;;;;EAMrBD,EAAM,QAACC,GAAsB;;;;qBAI3B,EAAGI,WAAYA;EAGvBC,MAAAA,EAAeN,EAAM,QAACC,GAAG;;;;;;EAQzBM,EAAQP,EAAM,QAACQ,IAAqC;UACvD,EAAGN,eAA+B,SAAdA,EAAuB,UAAY;;;EAKpDO,EAAgBT,EAAM,QAACC,GAAmC;qBAClD,EAAGS,QAASA;UACvB,EAAGL,WAAYA,GAAS;;;;;;;EASrBM,EAAaX,EAAM,QAACY,MAAuC;;;IAGpE,EAAGV,eAA+B,SAAdA,EAAuB,UAAY;;;UAGjD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;;;;;sBAS3C,EAAGA,eACR,SAAdA,EAAuB,UAAY;;EAIzBW,EAAgBb,EAAM,QAACC,GAA0B;eAC/C,EAAGa,eAAgBA;;;;;EAOrBC,EAAcf,EAAM,QAACC,GAAoC;qBACjD,EAAGC,eACR,SAAdA,EAAuB,UAAY;UAC3B,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;;;IAO7D,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;EAI9Cc,EAAOhB,EAAM,QAACiB,GAAoC;;;;;UAKrD,EAAGf,eAA+B,SAAdA,EAAuB,UAAY;;;;;;;;;WAStD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;WAKvD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;WAIvD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;WAKvD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;"}

package/dist/cjs/components/code-block/CodeBlockHelper.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./keywordMap.js");const o={javascript:require("./languageSpecificFormatting/javascript_file.js")},l=e=>{let o=0;for(let l=0;l<e.length;l++)o=(o<<5)-o+e.charCodeAt(l),o|=0;return Math.abs(o)};exports.highlightCode=function(r,s){let n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"dark";const a=r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");const c=e.keywordsMap[s.toLowerCase()]||[],t=(r=>{let{theme:s,lang:n}=r;var a,c;const t=e.keywordsMap[n.toLowerCase()]||[],g={};let i={},p=[];const d=o[n.toLowerCase()];if(d)try{i=(null===(a=d.colorOverWrite)||void 0===a?void 0:a.call(d,s))||{},p=(null===(c=d.colorMap)||void 0===c?void 0:c.call(d,s))||[],console.log(`Formatter found for ${n} (${s}):`,{overrides:Object.keys(i),colorMapLength:p.length,colorMapColors:p})}catch(e){console.warn(`Failed to load formatting for ${n}:`,e)}else console.log(`No formatter found for ${n}`);const f="dark"===s?{primary:"#79c0ff",secondary:"#a5d6ff",tertiary:"#ff7b72",quaternary:"#d2a8ff"}:{primary:"#0969da",secondary:"#207d57ff",tertiary:"#d1242f",quaternary:"#8250df"},u=Object.values(f);return console.log(`Processing ${t.length} keywords for ${n}`),t.forEach((e=>{if(null==i?void 0:i[e])g[e]=i[e],["function","console","log"].includes(e)&&console.log(`${e}: using override color ${i[e]}`);else if(p&&p.length>0){const o=l(e)%p.length;g[e]=p[o],["function","console","log"].includes(e)&&console.log(`${e}: using colorMap[${o}] = ${p[o]}`)}else{const o=l(e)%u.length;g[e]=u[o],["function","console","log"].includes(e)&&console.log(`${e}: using fallback color ${u[o]}`)}})),g})({theme:n,lang:s});let g=a;g=g.replace(/(["'`])(?:\\.|(?!\1).)*\1/g,'<span class="string">$&</span>'),g=g.replace(/\/\/.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\/\*[\s\S]*?\*\//g,'<span class="comment">$&</span>'),g=g.replace(/#.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\b\d+\.?\d*\b/g,'<span class="number">$&</span>');const i=c.sort(((e,o)=>o.length-e.length));return console.log(`Processing ${s} keywords in order:`,i),i.forEach((e=>{let o;o="css"===s.toLowerCase()?new RegExp(`(^|[\\s:])\\b(${e.replace(/-/g,"\\-")})(?=\\s*:|\\s|$)(?![^<]*>)`,"g"):new RegExp(`\\b(${e})\\b(?![^<]*>)`,"g");const l=g;g="css"===s.toLowerCase()?g.replace(o,`$1<span style="color: ${t[e]}">$2</span>`):g.replace(o,`<span style="color: ${t[e]}">$1</span>`),l!==g&&["background","background-color","color"].includes(e)&&console.log(`${e} -> ${t[e]} (made changes)`)})),g};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./keywordMap.js");const o={javascript:require("./languageSpecificFormatting/javascript_file.js")},r=e=>{let o=0;for(let r=0;r<e.length;r++)o=(o<<5)-o+e.charCodeAt(r),o|=0;return Math.abs(o)};exports.highlightCode=(s,l,a="dark")=>{const n=s.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");const c=e.keywordsMap[l.toLowerCase()]||[],t=(({theme:s,lang:l})=>{var a,n;const c=e.keywordsMap[l.toLowerCase()]||[],t={};let g={},i=[];const p=o[l.toLowerCase()];if(p)try{g=(null===(a=p.colorOverWrite)||void 0===a?void 0:a.call(p,s))||{},i=(null===(n=p.colorMap)||void 0===n?void 0:n.call(p,s))||[],console.log(`Formatter found for ${l} (${s}):`,{overrides:Object.keys(g),colorMapLength:i.length,colorMapColors:i})}catch(e){console.warn(`Failed to load formatting for ${l}:`,e)}else console.log(`No formatter found for ${l}`);const d="dark"===s?{primary:"#79c0ff",secondary:"#a5d6ff",tertiary:"#ff7b72",quaternary:"#d2a8ff"}:{primary:"#0969da",secondary:"#207d57ff",tertiary:"#d1242f",quaternary:"#8250df"},f=Object.values(d);return console.log(`Processing ${c.length} keywords for ${l}`),c.forEach((e=>{if(null==g?void 0:g[e])t[e]=g[e],["function","console","log"].includes(e)&&console.log(`${e}: using override color ${g[e]}`);else if(i&&i.length>0){const o=r(e)%i.length;t[e]=i[o],["function","console","log"].includes(e)&&console.log(`${e}: using colorMap[${o}] = ${i[o]}`)}else{const o=r(e)%f.length;t[e]=f[o],["function","console","log"].includes(e)&&console.log(`${e}: using fallback color ${f[o]}`)}})),t})({theme:a,lang:l});let g=n;g=g.replace(/(["'`])(?:\\.|(?!\1).)*\1/g,'<span class="string">$&</span>'),g=g.replace(/\/\/.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\/\*[\s\S]*?\*\//g,'<span class="comment">$&</span>'),g=g.replace(/#.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\b\d+\.?\d*\b/g,'<span class="number">$&</span>');const i=c.sort(((e,o)=>o.length-e.length));return console.log(`Processing ${l} keywords in order:`,i),i.forEach((e=>{let o;o="css"===l.toLowerCase()?new RegExp(`(^|[\\s:])\\b(${e.replace(/-/g,"\\-")})(?=\\s*:|\\s|$)(?![^<]*>)`,"g"):new RegExp(`\\b(${e})\\b(?![^<]*>)`,"g");const r=g;g="css"===l.toLowerCase()?g.replace(o,`$1<span style="color: ${t[e]}">$2</span>`):g.replace(o,`<span style="color: ${t[e]}">$1</span>`),r!==g&&["background","background-color","color"].includes(e)&&console.log(`${e} -> ${t[e]} (made changes)`)})),g};
 //# sourceMappingURL=CodeBlockHelper.js.map