@bikdotai/bik-component-library 0.0.749-beta.9 → 0.0.750-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.
- package/dist/cjs/components/code-block/CodeBlock.js +1 -1
- package/dist/cjs/components/code-block/CodeBlock.styled.js +7 -6
- package/dist/cjs/components/code-block/CodeBlockHelper.js +1 -1
- package/dist/cjs/components/code-block/keywordMap.js +1 -1
- package/dist/cjs/components/feature-announcements/MajorUpdatePopup.js +1 -1
- package/dist/cjs/components/feature-announcements/styles/majorPopup.styles.js +1 -1
- package/dist/esm/components/code-block/CodeBlock.js +1 -1
- package/dist/esm/components/code-block/CodeBlock.styled.js +7 -6
- package/dist/esm/components/code-block/CodeBlockHelper.js +1 -1
- package/dist/esm/components/code-block/keywordMap.js +1 -1
- package/dist/esm/components/feature-announcements/MajorUpdatePopup.js +1 -1
- package/dist/esm/components/feature-announcements/styles/majorPopup.styles.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),i=require("react-toastify"),o=require("./CodeBlock.styled.js"),s=require("./CodeBlockHelper.js"),n=require("./types.js");function a(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=n.CodeLanguage.JAVASCRIPT,title:u="",hideLineNumbers:h=!1,maxHeight:j="400px",maxWidth:g,theme:p="dark",hideHeader:m=!1,hideCopy:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),i=require("react-toastify"),o=require("./CodeBlock.styled.js"),s=require("./CodeBlockHelper.js"),n=require("./types.js");function a(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=n.CodeLanguage.JAVASCRIPT,title:u="",hideLineNumbers:h=!1,maxHeight:j="400px",maxWidth:g,theme:p="dark",hideHeader:m=!1,hideCopy:b=!1}=c;const[f,x]=r.useState(!1),[v,C]=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 a(require(e))})));if((null==r?void 0:r.format)&&t)return void C(r.format(d))}catch(e){}var e;t&&C(d)})),()=>{t=!1}}),[d,l]);const y=v.split("\n");return t.jsxs(o.Container,Object.assign({themeMode:p,maxWidth:g},{children:[!m&&t.jsxs(o.Header,Object.assign({themeMode:p},{children:[t.jsxs(o.TitleSection,{children:[!!u&&u&&t.jsx(o.Title,Object.assign({themeMode:p},{children:u})),t.jsx(o.LanguageBadge,Object.assign({bg:(O=l,{javascript:"#FEC02D",python:"#3776ab",java:"#ed8b00",css:"#1572b6",html:"#e34c26",json:"#000000"}[O.toLowerCase()]||("dark"===p?"#6e7681":"#656d76")),color:(e=>{const t={javascript:"#000"};return(null==t?void 0:t[e.toLowerCase()])||"#fff"})(l)},{children:l}))]}),!b&&t.jsx(o.CopyButton,Object.assign({themeMode:p,onClick:()=>e.__awaiter(void 0,void 0,void 0,(function*(){try{yield navigator.clipboard.writeText(d),x(!0),i.toast.success("Code copied to clipboard!",{position:"top-right",autoClose:2e3,hideProgressBar:!0}),setTimeout((()=>x(!1)),2e3)}catch(e){i.toast.error("Failed to copy code",{position:"top-right",autoClose:2e3})}}))},{children:f?t.jsx(t.Fragment,{children:"✓ Copied"}):t.jsx(t.Fragment,{children:"Copy"})}))]})),t.jsxs(o.CodeContainer,Object.assign({maxHeight:j},{children:[!h&&t.jsx(o.LineNumbers,Object.assign({themeMode:p},{children:y.map(((e,r)=>t.jsx("div",{children:r+1},r)))})),t.jsx(o.Code,Object.assign({themeMode:p},{children:y.map(((e,r)=>t.jsx("div",{style:{minHeight:e.trim()?"20px":"0px"},dangerouslySetInnerHTML:{__html:s.highlightCode(e,l,p)||" "}},r)))}))]}))]}));var O};
|
|
@@ -40,15 +40,16 @@
|
|
|
40
40
|
color: ${e=>{let{color:r}=e;return r||"#ffffff"}};
|
|
41
41
|
padding: 2px 6px;
|
|
42
42
|
border-radius: 4px;
|
|
43
|
-
font-size:
|
|
44
|
-
font-weight:
|
|
45
|
-
text-transform:
|
|
43
|
+
font-size: 12px;
|
|
44
|
+
font-weight: 400;
|
|
45
|
+
text-transform: Capitalize;
|
|
46
|
+
font-family: Inter;
|
|
46
47
|
`,l=r.default.button`
|
|
47
48
|
background-color: transparent;
|
|
48
49
|
border: 1px solid
|
|
49
|
-
${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#
|
|
50
|
+
${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#616161"}};
|
|
50
51
|
border-radius: 4px;
|
|
51
|
-
padding: 4px
|
|
52
|
+
padding: 4px 12px;
|
|
52
53
|
color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
|
|
53
54
|
font-size: 12px;
|
|
54
55
|
cursor: pointer;
|
|
@@ -56,7 +57,7 @@
|
|
|
56
57
|
align-items: center;
|
|
57
58
|
gap: 4px;
|
|
58
59
|
transition: background-color 0.2s ease;
|
|
59
|
-
|
|
60
|
+
font-family: Inter;
|
|
60
61
|
&:hover {
|
|
61
62
|
background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#21262d":"#f3f4f6"}};
|
|
62
63
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./keywordMap.js");const o={javascript:require("./languageSpecificFormatting/javascript_file.js")},
|
|
1
|
+
"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,"&").replace(/</g,"<").replace(/>/g,">");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};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.keywordsMap={javascript:["function","const","let","var","if","else","for","while","return","class","import","export","from","async","await","try","catch","new","this","console","log","window","document","switch"],python:["def","class","if","else","elif","for","while","import","from","return","try","except","with","as","lambda","and","or","not","in","print"],java:["public","private","protected","static","class","interface","if","else","for","while","return","import","new","this","extends","implements","System","out","println"],css:["color","background","background-color","font-family","margin","padding","display","position","flex","grid","width","height","border","font"],html:["div","span","p","h1","h2","h3","body","head","html","script","style","link"],json:["true","false","null"]};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.keywordsMap={javascript:["function","const","let","var","if","else","for","while","return","class","import","export","from","async","await","try","catch","new","this","console","log","window","document","switch","script","defer","src",".init",".start",".stop"],python:["def","class","if","else","elif","for","while","import","from","return","try","except","with","as","lambda","and","or","not","in","print"],java:["public","private","protected","static","class","interface","if","else","for","while","return","import","new","this","extends","implements","System","out","println"],css:["color","background","background-color","font-family","margin","padding","display","position","flex","grid","width","height","border","font"],html:["div","span","p","h1","h2","h3","body","head","html","script","style","link"],json:["true","false","null"]};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("react"),n=require("../../assets/icons/chevronRight2.svg.js"),r=require("../../assets/icons/play.svg.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("react"),n=require("../../assets/icons/chevronRight2.svg.js"),r=require("../../assets/icons/play.svg.js"),s=require("../button/Button.js"),o=require("./constants/index.js"),i=require("./styles/majorPopup.styles.js");require("../../constants/Theme.js"),require("./constants/animations.js");var a=require("./utils/htmlHelpers.js"),l=require("./utils/animationHelpers.js"),u=require("./utils/elementHelpers.js");exports.default=c=>{let{feature:d,currentIndex:p,totalFeatures:y,onSkip:g,onExplore:v,onPrevious:b,onNext:j,setIsClosing:h,onSecondaryAction:f,ratio:x="16:9",padding:B}=c;var T,m,O,E,k,M,U,P,C,w;const[_,L]=e.useState(!1),[W,q]=e.useState(!1),[S,A]=e.useState(""),D=e.useRef(null),[I,H]=e.useState(!1),[N,R]=e.useState(!0),F=e.useRef(null),[X,V]=e.useState(x),J=e.useRef(null);e.useEffect((()=>{_&&q(!0)}),[_]);const z=()=>{var t,e;const n=null===(t=d.primaryButton)||void 0===t?void 0:t.action;if("Play Video"===n)v();else if("Open link"===n){const t=(null===(e=d.primaryButton)||void 0===e?void 0:e.redirectionUrl)||d.redirectUrl;if(t){t.startsWith("http")?window.open(t,"_blank","noopener,noreferrer"):window.location.href=t}}else v();l.hideJoyrideArrow(D.current);const r=u.findWhatsNewButton();if(r&&D.current){const t=l.calculateCloseTransform(D.current,r);A(t)}else A("scale(0)");null==h||h(!0),L(!0)},G=t=>{var e,n;t.preventDefault(),t.stopPropagation();const r=null===(e=d.secondaryButton)||void 0===e?void 0:e.action;if("Open link"===r){const t=null===(n=d.secondaryButton)||void 0===n?void 0:n.redirectionUrl;if(t){t.startsWith("http")?window.open(t,"_blank","noopener,noreferrer"):window.location.href=t}}else"Close popup"!==r&&""!==r||f&&f();l.hideJoyrideArrow(D.current);const s=u.findWhatsNewButton();if(s&&D.current){const t=l.calculateCloseTransform(D.current,s);A(t)}else A("scale(0)");null==h||h(!0),L(!0)},K=i.getMajorPopupStyles(W,S,X,B||d.padding,null===(T=d.primaryButton)||void 0===T?void 0:T.style,null===(m=d.secondaryButton)||void 0===m?void 0:m.style);return t.jsxs("div",Object.assign({ref:D,style:K.container},{children:[t.jsx("style",{children:"\n\t\t\t\t[data-popup-content] ul {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding-left: 20px;\n\t\t\t\t\tlist-style-type: disc;\n\t\t\t\t}\n\t\t\t\t[data-popup-content] ul li {\n\t\t\t\t\tmargin-bottom: 8px;\n\t\t\t\t\tcolor: rgba(255, 255, 255, 0.8);\n\t\t\t\t\tfont-size: 12px;\n\t\t\t\t\tline-height: 16px;\n\t\t\t\t\tfont-family: Inter, sans-serif;\n\t\t\t\t}\n\t\t\t"}),t.jsxs("div",Object.assign({style:K.contentWrapper},{children:[t.jsx("div",Object.assign({style:K.imageContainer},{children:d.productVideo?t.jsxs(t.Fragment,{children:[t.jsx("video",{ref:F,src:d.productVideo,style:K.image,autoPlay:!0,muted:!0,loop:!0,playsInline:!0,controls:!0,"aria-label":`Product video for ${d.title}`}),(I||N)&&t.jsx("div",Object.assign({style:K.videoOverlay,onClick:t=>{t.stopPropagation(),F.current&&(F.current.paused?(F.current.play(),H(!1),R(!1)):(F.current.pause(),H(!0),R(!0)))},role:"button",tabIndex:0,"aria-label":I?"Play video":"Pause video",onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),F.current&&(F.current.paused?(F.current.play(),H(!1),R(!1)):(F.current.pause(),H(!0),R(!0))))}},{children:t.jsx(r.default,{width:20,height:20})}))]}):d.displayImage?t.jsx("img",{ref:J,src:d.displayImage,alt:d.title,style:K.image,onLoad:t=>{const e=t.currentTarget,n=e.naturalWidth,r=e.naturalHeight;if(n&&r){const t=n/r;Math.abs(t-16/9)<.1?V("16:9"):Math.abs(t-1)<.1?V("1:1"):Math.abs(t-4/3)<.1?V("4:3"):V(t>1.5?"16:9":t<.9?"4:3":"1:1")}},onError:t=>{d.image&&(t.target.src=d.image)}}):t.jsx("div",Object.assign({style:K.imagePlaceholder},{children:o.TEXT.FEATURE_PREVIEW_PLACEHOLDER}))})),t.jsxs("div",Object.assign({style:K.contentContainer},{children:[t.jsx("div",Object.assign({style:K.skipButtonContainer},{children:t.jsx("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),(t=>{l.hideJoyrideArrow(D.current);const e=u.findWhatsNewButton();if(e&&D.current){const t=l.calculateCloseTransform(D.current,e);A(t)}else A("scale(0)");null==h||h(!0),L(!0),l.executeAfterAnimation(t)})(g)},style:K.skipButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,K.skipButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,K.skipButton.base),"aria-label":"Skip feature announcement"},{children:"Skip"}))})),t.jsx("h3",Object.assign({style:K.title},{children:d.title})),t.jsx("div",{"data-popup-content":!0,style:K.content,dangerouslySetInnerHTML:{__html:a.decodeHTMLEntities(d.content||d.body||"")}}),t.jsxs("div",Object.assign({style:K.actionsWrapper},{children:[t.jsxs("div",Object.assign({style:K.buttonsGroup},{children:[(null===(O=d.primaryButton)||void 0===O?void 0:O.redirectionUrl)||d.redirectUrl?t.jsx("a",Object.assign({href:(null===(E=d.primaryButton)||void 0===E?void 0:E.redirectionUrl)||d.redirectUrl,target:((null===(k=d.primaryButton)||void 0===k?void 0:k.redirectionUrl)||d.redirectUrl).startsWith("http")?"_blank":"_self",rel:((null===(M=d.primaryButton)||void 0===M?void 0:M.redirectionUrl)||d.redirectUrl).startsWith("http")?"noopener noreferrer":void 0,onClick:z,style:K.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,K.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,K.exploreButton.base)},{children:(null===(U=d.primaryButton)||void 0===U?void 0:U.text)||d.buttonText||o.TEXT.DEFAULT_BUTTON_TEXT})):t.jsx(s.Button,{onClick:z,style:K.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,K.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,K.exploreButton.base),buttonText:(null===(P=d.primaryButton)||void 0===P?void 0:P.text)||d.buttonText||o.TEXT.DEFAULT_BUTTON_TEXT}),(null===(C=d.secondaryButton)||void 0===C?void 0:C.text)&&((null===(w=d.secondaryButton)||void 0===w?void 0:w.redirectionUrl)?t.jsx("a",Object.assign({href:d.secondaryButton.redirectionUrl,target:d.secondaryButton.redirectionUrl.startsWith("http")?"_blank":"_self",rel:d.secondaryButton.redirectionUrl.startsWith("http")?"noopener noreferrer":void 0,onClick:G,style:K.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,K.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,K.secondaryButton.base)},{children:d.secondaryButton.text})):t.jsx("button",Object.assign({onClick:G,style:K.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,K.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,K.secondaryButton.base)},{children:d.secondaryButton.text})))]})),y>1&&t.jsxs("div",Object.assign({style:K.navigationContainer},{children:[t.jsx("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),b()},disabled:0===p,style:K.navigationButton(0===p).base,onMouseEnter:t=>{0!==p&&Object.assign(t.currentTarget.style,K.navigationButton(!1).hover)},onMouseLeave:t=>{0!==p&&Object.assign(t.currentTarget.style,K.navigationButton(!1).base)},"aria-label":"Previous feature"},{children:t.jsx(n.default,{style:{transform:"rotate(180deg)"}})})),t.jsx("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),j()},disabled:p===y-1,style:K.navigationButton(p===y-1).base,onMouseEnter:t=>{p!==y-1&&Object.assign(t.currentTarget.style,K.navigationButton(!1).hover)},onMouseLeave:t=>{p!==y-1&&Object.assign(t.currentTarget.style,K.navigationButton(p===y-1).base)},"aria-label":"Next feature"},{children:t.jsx(n.default,{})}))]}))]}))]}))]}))]}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../../constants/Theme.js"),e=require("../constants/animations.js"),n=require("../constants/dimensions.js");const o=(t,e)=>Object.assign(Object.assign(Object.assign(Object.assign({},t),(null==e?void 0:e.textColor)&&{color:e.textColor}),(null==e?void 0:e.backgroundColor)&&{backgroundColor:e.backgroundColor}),(null==e?void 0:e.borderColor)&&{borderColor:e.borderColor});exports.getMajorPopupStyles=function(
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../../constants/Theme.js"),e=require("../constants/animations.js"),n=require("../constants/dimensions.js");const o=function(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"16:9";return n.POPUP_DIMENSIONS.MAJOR.imageWidth[t]||n.POPUP_DIMENSIONS.MAJOR.imageWidth["16:9"]},i=(t,e)=>Object.assign(Object.assign(Object.assign(Object.assign({},t),(null==e?void 0:e.textColor)&&{color:e.textColor}),(null==e?void 0:e.backgroundColor)&&{backgroundColor:e.backgroundColor}),(null==e?void 0:e.borderColor)&&{borderColor:e.borderColor});exports.getMajorPopupStyles=function(r,a){let l=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"16:9",O=arguments.length>3&&void 0!==arguments[3]?arguments[3]:n.SPACING.MAJOR.containerPadding,I=arguments.length>4?arguments[4]:void 0,N=arguments.length>5?arguments[5]:void 0;const S=o(l),d=function(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"16:9";const e=o(t);switch(t){case"16:9":return Math.round(e*(9/16));case"1:1":return e;case"4:3":return Math.round(e*(3/4));default:return n.DESIGN_DIMENSIONS.IMAGE_HEIGHT}}(l),s=parseInt(O,10)||16,g=d+2*s;return{container:{width:`${s+S+parseInt(n.SPACING.MAJOR.contentGap,10)+n.POPUP_DIMENSIONS.MAJOR.textAreaWidth+s}px`,height:"auto",minHeight:`${g}px`,display:"flex",flexDirection:"column",backgroundColor:n.DESIGN_COLORS.BACKGROUND.SURFACE,borderRadius:n.BORDER_RADIUS.POPUP,overflow:"hidden",position:"relative",padding:O,transform:r?a:"scale(1)",opacity:r?0:1,transition:e.POPUP_TRANSITION,boxSizing:"border-box"},headerContainer:{width:"100%",display:"flex",justifyContent:"flex-end",marginBottom:n.SPACING.MAJOR.headerMarginBottom,position:"relative"},contentWrapper:{display:"flex",flex:1,gap:n.SPACING.MAJOR.contentGap},skipButton:{base:{background:"transparent",border:"none",color:n.DESIGN_COLORS.TEXT.TERTIARY,fontSize:n.DESIGN_TYPOGRAPHY.SKIP_BUTTON.fontSize,fontWeight:n.DESIGN_TYPOGRAPHY.SKIP_BUTTON.fontWeight,cursor:"pointer",padding:n.SPACING.MAJOR.skipButtonPadding,borderRadius:n.BORDER_RADIUS.BUTTON,fontFamily:n.DESIGN_TYPOGRAPHY.SKIP_BUTTON.fontFamily,lineHeight:n.DESIGN_TYPOGRAPHY.SKIP_BUTTON.lineHeight},hover:{backgroundColor:"rgba(255, 255, 255, 0.10)",color:t.BASE_COLORS.grayscale[700]}},imageContainer:{backgroundColor:n.DESIGN_COLORS.BACKGROUND.IMAGE,width:`${S}px`,height:`${d}px`,position:"relative",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:n.BORDER_RADIUS.BUTTON,overflow:"hidden",flexShrink:0},image:{width:"100%",height:"100%",objectFit:"cover"},imagePlaceholder:{color:t.BASE_COLORS.grayscale[500],fontSize:"14px",textAlign:"center",width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:t.BASE_COLORS.grayscale[800]},videoOverlay:{position:"absolute",top:0,left:0,width:"100%",height:"100%",backgroundColor:"rgba(0,0,0,0.4)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",zIndex:10,transition:"opacity 0.2s"},playIcon:{width:"84px",height:"84px",color:"#060606ff"},contentContainer:{flex:1,display:"flex",marginLeft:n.SPACING.MAJOR.contentMarginLeft,flexDirection:"column",justifyContent:"flex-start",background:"transparent",maxWidth:`${n.POPUP_DIMENSIONS.MAJOR.textAreaWidth}px`,gap:n.SPACING.MAJOR.listGap},skipButtonContainer:{width:"100%",display:"flex",justifyContent:"flex-end",marginBottom:n.SPACING.MAJOR.skipButtonContainerMargin},title:{fontSize:n.DESIGN_TYPOGRAPHY.TITLE.fontSize,fontWeight:n.DESIGN_TYPOGRAPHY.TITLE.fontWeight,marginBottom:n.SPACING.MAJOR.titleBottom,padding:0,color:n.DESIGN_COLORS.TEXT.PRIMARY,lineHeight:n.DESIGN_TYPOGRAPHY.TITLE.lineHeight,textAlign:"left",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",fontFamily:n.DESIGN_TYPOGRAPHY.TITLE.fontFamily},content:{fontSize:n.DESIGN_TYPOGRAPHY.CONTENT.fontSize,lineHeight:n.DESIGN_TYPOGRAPHY.CONTENT.lineHeight,color:n.DESIGN_COLORS.TEXT.SECONDARY,textAlign:"left",marginBottom:"auto",fontFamily:n.DESIGN_TYPOGRAPHY.CONTENT.fontFamily,fontWeight:n.DESIGN_TYPOGRAPHY.CONTENT.fontWeight},actionsWrapper:{display:"flex",alignItems:"center",justifyContent:"space-between",marginRight:n.SPACING.MAJOR.actionsTop,gap:"8px",flexWrap:"nowrap"},buttonsGroup:{display:"flex",alignItems:"center",gap:n.SPACING.MAJOR.listGap},exploreButton:{base:i({backgroundColor:"transparent",border:`1px solid ${n.DESIGN_COLORS.BUTTON.PRIMARY_BORDER}`,color:n.DESIGN_COLORS.BUTTON.PRIMARY_TEXT,borderRadius:n.BORDER_RADIUS.BUTTON,fontSize:n.DESIGN_TYPOGRAPHY.BUTTON.fontSize,fontWeight:n.DESIGN_TYPOGRAPHY.BUTTON.fontWeight,cursor:"pointer",padding:`0 ${n.DESIGN_DIMENSIONS.BUTTON_PADDING_HORIZONTAL}`,height:`${n.DESIGN_DIMENSIONS.BUTTON_HEIGHT}px`,textAlign:"center",minWidth:"auto",textDecoration:"none",display:"inline-flex",alignItems:"center",justifyContent:"center",fontFamily:n.DESIGN_TYPOGRAPHY.BUTTON.fontFamily,lineHeight:n.DESIGN_TYPOGRAPHY.BUTTON.lineHeight},I),hover:{backgroundColor:"rgba(255, 255, 255, 0.10)"}},secondaryButton:{base:i({backgroundColor:"transparent",color:n.DESIGN_COLORS.BUTTON.PRIMARY_TEXT,borderRadius:n.BORDER_RADIUS.BUTTON,fontSize:n.DESIGN_TYPOGRAPHY.BUTTON.fontSize,fontWeight:n.DESIGN_TYPOGRAPHY.BUTTON.fontWeight,cursor:"pointer",padding:`0 ${n.DESIGN_DIMENSIONS.BUTTON_PADDING_HORIZONTAL}`,height:`${n.DESIGN_DIMENSIONS.BUTTON_HEIGHT}px`,border:"none",boxShadow:"none",textAlign:"center",minWidth:"auto",textDecoration:"none",display:"inline-flex",alignItems:"center",justifyContent:"center",fontFamily:n.DESIGN_TYPOGRAPHY.BUTTON.fontFamily,lineHeight:n.DESIGN_TYPOGRAPHY.BUTTON.lineHeight,transition:"none"},N),hover:{backgroundColor:(null==N?void 0:N.backgroundColor)?`${N.backgroundColor}cc`:"rgba(254, 192, 45, 0.1)"}},navigationContainer:{display:"flex",gap:n.SPACING.MAJOR.navigationGap,alignItems:"center"},navigationButton:e=>({base:{width:`${n.DESIGN_DIMENSIONS.NAVIGATION_BUTTON_SIZE}px`,height:`${n.DESIGN_DIMENSIONS.NAVIGATION_BUTTON_SIZE}px`,backgroundColor:"transparent",border:"none",color:e?n.DESIGN_COLORS.ICON.DISABLED:n.DESIGN_COLORS.ICON.ENABLED,fontSize:"16px",cursor:e?"not-allowed":"pointer",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:n.BORDER_RADIUS.BUTTON,padding:0},hover:{color:t.BASE_COLORS.warning[500]}})}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsxs as t,jsx as i,Fragment as o}from"react/jsx-runtime";import{useState as r,useEffect as d}from"react";import{toast as
|
|
1
|
+
import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsxs as t,jsx as i,Fragment as o}from"react/jsx-runtime";import{useState as r,useEffect as d}from"react";import{toast as s}from"react-toastify";import{Container as c,Header as n,TitleSection as a,Title as l,LanguageBadge as m,CopyButton as h,CodeContainer as p,LineNumbers as g,Code as f}from"./CodeBlock.styled.js";import{highlightCode as u}from"./CodeBlockHelper.js";import{CodeLanguage as b}from"./types.js";const j=j=>{let{code:v="",language:y=b.JAVASCRIPT,title:C="",hideLineNumbers:x=!1,maxHeight:O="400px",maxWidth:M,theme:H="dark",hideHeader:k=!1,hideCopy:_=!1}=j;const[L,T]=r(!1),[w,B]=r(v);d((()=>{let t=!0;return e(void 0,void 0,void 0,(function*(){try{const e=yield import(`./languageSpecificFormatting/${y}_file.ts`);if((null==e?void 0:e.format)&&t)return void B(e.format(v))}catch(e){}t&&B(v)})),()=>{t=!1}}),[v,y]);const F=w.split("\n");return t(c,Object.assign({themeMode:H,maxWidth:M},{children:[!k&&t(n,Object.assign({themeMode:H},{children:[t(a,{children:[!!C&&C&&i(l,Object.assign({themeMode:H},{children:C})),i(m,Object.assign({bg:(S=y,{javascript:"#FEC02D",python:"#3776ab",java:"#ed8b00",css:"#1572b6",html:"#e34c26",json:"#000000"}[S.toLowerCase()]||("dark"===H?"#6e7681":"#656d76")),color:(e=>{const t={javascript:"#000"};return(null==t?void 0:t[e.toLowerCase()])||"#fff"})(y)},{children:y}))]}),!_&&i(h,Object.assign({themeMode:H,onClick:()=>e(void 0,void 0,void 0,(function*(){try{yield navigator.clipboard.writeText(v),T(!0),s.success("Code copied to clipboard!",{position:"top-right",autoClose:2e3,hideProgressBar:!0}),setTimeout((()=>T(!1)),2e3)}catch(e){s.error("Failed to copy code",{position:"top-right",autoClose:2e3})}}))},{children:i(o,L?{children:"✓ Copied"}:{children:"Copy"})}))]})),t(p,Object.assign({maxHeight:O},{children:[!x&&i(g,Object.assign({themeMode:H},{children:F.map(((e,t)=>i("div",{children:t+1},t)))})),i(f,Object.assign({themeMode:H},{children:F.map(((e,t)=>i("div",{style:{minHeight:e.trim()?"20px":"0px"},dangerouslySetInnerHTML:{__html:u(e,y,H)||" "}},t)))}))]}))]}));var S};export{j as CodeBlock};
|
|
@@ -40,15 +40,16 @@ import e from"styled-components";const r=e.div`
|
|
|
40
40
|
color: ${e=>{let{color:r}=e;return r||"#ffffff"}};
|
|
41
41
|
padding: 2px 6px;
|
|
42
42
|
border-radius: 4px;
|
|
43
|
-
font-size:
|
|
44
|
-
font-weight:
|
|
45
|
-
text-transform:
|
|
43
|
+
font-size: 12px;
|
|
44
|
+
font-weight: 400;
|
|
45
|
+
text-transform: Capitalize;
|
|
46
|
+
font-family: Inter;
|
|
46
47
|
`,i=e.button`
|
|
47
48
|
background-color: transparent;
|
|
48
49
|
border: 1px solid
|
|
49
|
-
${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#
|
|
50
|
+
${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#616161"}};
|
|
50
51
|
border-radius: 4px;
|
|
51
|
-
padding: 4px
|
|
52
|
+
padding: 4px 12px;
|
|
52
53
|
color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
|
|
53
54
|
font-size: 12px;
|
|
54
55
|
cursor: pointer;
|
|
@@ -56,7 +57,7 @@ import e from"styled-components";const r=e.div`
|
|
|
56
57
|
align-items: center;
|
|
57
58
|
gap: 4px;
|
|
58
59
|
transition: background-color 0.2s ease;
|
|
59
|
-
|
|
60
|
+
font-family: Inter;
|
|
60
61
|
&:hover {
|
|
61
62
|
background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#21262d":"#f3f4f6"}};
|
|
62
63
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{keywordsMap as o}from"./keywordMap.js";import*as e from"./languageSpecificFormatting/javascript_file.js";const l={javascript:e},n=o=>{let e=0;for(let l=0;l<o.length;l++)e=(e<<5)-e+o.charCodeAt(l),e|=0;return Math.abs(e)},
|
|
1
|
+
import{keywordsMap as o}from"./keywordMap.js";import*as e from"./languageSpecificFormatting/javascript_file.js";const l={javascript:e},n=o=>{let e=0;for(let l=0;l<o.length;l++)e=(e<<5)-e+o.charCodeAt(l),e|=0;return Math.abs(e)},r=function(e,r){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"dark";const a=e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">");const c=o[r.toLowerCase()]||[],t=(e=>{let{theme:r,lang:s}=e;var a,c;const t=o[s.toLowerCase()]||[],g={};let i={},p=[];const d=l[s.toLowerCase()];if(d)try{i=(null===(a=d.colorOverWrite)||void 0===a?void 0:a.call(d,r))||{},p=(null===(c=d.colorMap)||void 0===c?void 0:c.call(d,r))||[],console.log(`Formatter found for ${s} (${r}):`,{overrides:Object.keys(i),colorMapLength:p.length,colorMapColors:p})}catch(o){console.warn(`Failed to load formatting for ${s}:`,o)}else console.log(`No formatter found for ${s}`);const f="dark"===r?{primary:"#79c0ff",secondary:"#a5d6ff",tertiary:"#ff7b72",quaternary:"#d2a8ff"}:{primary:"#0969da",secondary:"#207d57ff",tertiary:"#d1242f",quaternary:"#8250df"},$=Object.values(f);return console.log(`Processing ${t.length} keywords for ${s}`),t.forEach((o=>{if(null==i?void 0:i[o])g[o]=i[o],["function","console","log"].includes(o)&&console.log(`${o}: using override color ${i[o]}`);else if(p&&p.length>0){const e=n(o)%p.length;g[o]=p[e],["function","console","log"].includes(o)&&console.log(`${o}: using colorMap[${e}] = ${p[e]}`)}else{const e=n(o)%$.length;g[o]=$[e],["function","console","log"].includes(o)&&console.log(`${o}: using fallback color ${$[e]}`)}})),g})({theme:s,lang:r});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(((o,e)=>e.length-o.length));return console.log(`Processing ${r} keywords in order:`,i),i.forEach((o=>{let e;e="css"===r.toLowerCase()?new RegExp(`(^|[\\s:])\\b(${o.replace(/-/g,"\\-")})(?=\\s*:|\\s|$)(?![^<]*>)`,"g"):new RegExp(`\\b(${o})\\b(?![^<]*>)`,"g");const l=g;g="css"===r.toLowerCase()?g.replace(e,`$1<span style="color: ${t[o]}">$2</span>`):g.replace(e,`<span style="color: ${t[o]}">$1</span>`),l!==g&&["background","background-color","color"].includes(o)&&console.log(`${o} -> ${t[o]} (made changes)`)})),g};export{r as highlightCode};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const t={javascript:["function","const","let","var","if","else","for","while","return","class","import","export","from","async","await","try","catch","new","this","console","log","window","document","switch"],python:["def","class","if","else","elif","for","while","import","from","return","try","except","with","as","lambda","and","or","not","in","print"],java:["public","private","protected","static","class","interface","if","else","for","while","return","import","new","this","extends","implements","System","out","println"],css:["color","background","background-color","font-family","margin","padding","display","position","flex","grid","width","height","border","font"],html:["div","span","p","h1","h2","h3","body","head","html","script","style","link"],json:["true","false","null"]};export{t as keywordsMap};
|
|
1
|
+
const t={javascript:["function","const","let","var","if","else","for","while","return","class","import","export","from","async","await","try","catch","new","this","console","log","window","document","switch","script","defer","src",".init",".start",".stop"],python:["def","class","if","else","elif","for","while","import","from","return","try","except","with","as","lambda","and","or","not","in","print"],java:["public","private","protected","static","class","interface","if","else","for","while","return","import","new","this","extends","implements","System","out","println"],css:["color","background","background-color","font-family","margin","padding","display","position","flex","grid","width","height","border","font"],html:["div","span","p","h1","h2","h3","body","head","html","script","style","link"],json:["true","false","null"]};export{t as keywordsMap};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as t,jsx as e,Fragment as n}from"react/jsx-runtime";import{useState as r,useRef as o,useEffect as
|
|
1
|
+
import{jsxs as t,jsx as e,Fragment as n}from"react/jsx-runtime";import{useState as r,useRef as o,useEffect as s}from"react";import i from"../../assets/icons/chevronRight2.svg.js";import a from"../../assets/icons/play.svg.js";import{Button as l}from"../button/Button.js";import{TEXT as c}from"./constants/index.js";import{getMajorPopupStyles as u}from"./styles/majorPopup.styles.js";import"../../constants/Theme.js";import"./constants/animations.js";import{decodeHTMLEntities as d}from"./utils/htmlHelpers.js";import{hideJoyrideArrow as p,calculateCloseTransform as g,executeAfterAnimation as y}from"./utils/animationHelpers.js";import{findWhatsNewButton as v}from"./utils/elementHelpers.js";const b=b=>{let{feature:h,currentIndex:m,totalFeatures:f,onSkip:B,onExplore:j,onPrevious:O,onNext:T,setIsClosing:x,onSecondaryAction:k,ratio:E="16:9",padding:U}=b;var M,P,C,_,L,w,W,D,I,H;const[A,S]=r(!1),[F,N]=r(!1),[R,V]=r(""),X=o(null),[z,G]=r(!1),[K,$]=r(!0),q=o(null),[J,Q]=r(E),Y=o(null);s((()=>{A&&N(!0)}),[A]);const Z=()=>{var t,e;const n=null===(t=h.primaryButton)||void 0===t?void 0:t.action;if("Play Video"===n)j();else if("Open link"===n){const t=(null===(e=h.primaryButton)||void 0===e?void 0:e.redirectionUrl)||h.redirectUrl;if(t){t.startsWith("http")?window.open(t,"_blank","noopener,noreferrer"):window.location.href=t}}else j();p(X.current);const r=v();if(r&&X.current){const t=g(X.current,r);V(t)}else V("scale(0)");null==x||x(!0),S(!0)},tt=t=>{var e,n;t.preventDefault(),t.stopPropagation();const r=null===(e=h.secondaryButton)||void 0===e?void 0:e.action;if("Open link"===r){const t=null===(n=h.secondaryButton)||void 0===n?void 0:n.redirectionUrl;if(t){t.startsWith("http")?window.open(t,"_blank","noopener,noreferrer"):window.location.href=t}}else"Close popup"!==r&&""!==r||k&&k();p(X.current);const o=v();if(o&&X.current){const t=g(X.current,o);V(t)}else V("scale(0)");null==x||x(!0),S(!0)},et=u(F,R,J,U||h.padding,null===(M=h.primaryButton)||void 0===M?void 0:M.style,null===(P=h.secondaryButton)||void 0===P?void 0:P.style);return t("div",Object.assign({ref:X,style:et.container},{children:[e("style",{children:"\n\t\t\t\t[data-popup-content] ul {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding-left: 20px;\n\t\t\t\t\tlist-style-type: disc;\n\t\t\t\t}\n\t\t\t\t[data-popup-content] ul li {\n\t\t\t\t\tmargin-bottom: 8px;\n\t\t\t\t\tcolor: rgba(255, 255, 255, 0.8);\n\t\t\t\t\tfont-size: 12px;\n\t\t\t\t\tline-height: 16px;\n\t\t\t\t\tfont-family: Inter, sans-serif;\n\t\t\t\t}\n\t\t\t"}),t("div",Object.assign({style:et.contentWrapper},{children:[e("div",Object.assign({style:et.imageContainer},{children:h.productVideo?t(n,{children:[e("video",{ref:q,src:h.productVideo,style:et.image,autoPlay:!0,muted:!0,loop:!0,playsInline:!0,controls:!0,"aria-label":`Product video for ${h.title}`}),(z||K)&&e("div",Object.assign({style:et.videoOverlay,onClick:t=>{t.stopPropagation(),q.current&&(q.current.paused?(q.current.play(),G(!1),$(!1)):(q.current.pause(),G(!0),$(!0)))},role:"button",tabIndex:0,"aria-label":z?"Play video":"Pause video",onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),q.current&&(q.current.paused?(q.current.play(),G(!1),$(!1)):(q.current.pause(),G(!0),$(!0))))}},{children:e(a,{width:20,height:20})}))]}):h.displayImage?e("img",{ref:Y,src:h.displayImage,alt:h.title,style:et.image,onLoad:t=>{const e=t.currentTarget,n=e.naturalWidth,r=e.naturalHeight;if(n&&r){const t=n/r;Math.abs(t-16/9)<.1?Q("16:9"):Math.abs(t-1)<.1?Q("1:1"):Math.abs(t-4/3)<.1?Q("4:3"):Q(t>1.5?"16:9":t<.9?"4:3":"1:1")}},onError:t=>{h.image&&(t.target.src=h.image)}}):e("div",Object.assign({style:et.imagePlaceholder},{children:c.FEATURE_PREVIEW_PLACEHOLDER}))})),t("div",Object.assign({style:et.contentContainer},{children:[e("div",Object.assign({style:et.skipButtonContainer},{children:e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),(t=>{p(X.current);const e=v();if(e&&X.current){const t=g(X.current,e);V(t)}else V("scale(0)");null==x||x(!0),S(!0),y(t)})(B)},style:et.skipButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,et.skipButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,et.skipButton.base),"aria-label":"Skip feature announcement"},{children:"Skip"}))})),e("h3",Object.assign({style:et.title},{children:h.title})),e("div",{"data-popup-content":!0,style:et.content,dangerouslySetInnerHTML:{__html:d(h.content||h.body||"")}}),t("div",Object.assign({style:et.actionsWrapper},{children:[t("div",Object.assign({style:et.buttonsGroup},{children:[(null===(C=h.primaryButton)||void 0===C?void 0:C.redirectionUrl)||h.redirectUrl?e("a",Object.assign({href:(null===(_=h.primaryButton)||void 0===_?void 0:_.redirectionUrl)||h.redirectUrl,target:((null===(L=h.primaryButton)||void 0===L?void 0:L.redirectionUrl)||h.redirectUrl).startsWith("http")?"_blank":"_self",rel:((null===(w=h.primaryButton)||void 0===w?void 0:w.redirectionUrl)||h.redirectUrl).startsWith("http")?"noopener noreferrer":void 0,onClick:Z,style:et.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,et.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,et.exploreButton.base)},{children:(null===(W=h.primaryButton)||void 0===W?void 0:W.text)||h.buttonText||c.DEFAULT_BUTTON_TEXT})):e(l,{onClick:Z,style:et.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,et.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,et.exploreButton.base),buttonText:(null===(D=h.primaryButton)||void 0===D?void 0:D.text)||h.buttonText||c.DEFAULT_BUTTON_TEXT}),(null===(I=h.secondaryButton)||void 0===I?void 0:I.text)&&((null===(H=h.secondaryButton)||void 0===H?void 0:H.redirectionUrl)?e("a",Object.assign({href:h.secondaryButton.redirectionUrl,target:h.secondaryButton.redirectionUrl.startsWith("http")?"_blank":"_self",rel:h.secondaryButton.redirectionUrl.startsWith("http")?"noopener noreferrer":void 0,onClick:tt,style:et.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,et.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,et.secondaryButton.base)},{children:h.secondaryButton.text})):e("button",Object.assign({onClick:tt,style:et.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,et.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,et.secondaryButton.base)},{children:h.secondaryButton.text})))]})),f>1&&t("div",Object.assign({style:et.navigationContainer},{children:[e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),O()},disabled:0===m,style:et.navigationButton(0===m).base,onMouseEnter:t=>{0!==m&&Object.assign(t.currentTarget.style,et.navigationButton(!1).hover)},onMouseLeave:t=>{0!==m&&Object.assign(t.currentTarget.style,et.navigationButton(!1).base)},"aria-label":"Previous feature"},{children:e(i,{style:{transform:"rotate(180deg)"}})})),e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),T()},disabled:m===f-1,style:et.navigationButton(m===f-1).base,onMouseEnter:t=>{m!==f-1&&Object.assign(t.currentTarget.style,et.navigationButton(!1).hover)},onMouseLeave:t=>{m!==f-1&&Object.assign(t.currentTarget.style,et.navigationButton(m===f-1).base)},"aria-label":"Next feature"},{children:e(i,{})}))]}))]}))]}))]}))]}))};export{b as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{BASE_COLORS as t}from"../../../constants/Theme.js";import{POPUP_TRANSITION as e}from"../constants/animations.js";import{SPACING as
|
|
1
|
+
import{BASE_COLORS as t}from"../../../constants/Theme.js";import{POPUP_TRANSITION as e}from"../constants/animations.js";import{SPACING as n,POPUP_DIMENSIONS as o,DESIGN_COLORS as i,BORDER_RADIUS as r,DESIGN_TYPOGRAPHY as a,DESIGN_DIMENSIONS as l}from"../constants/dimensions.js";const d=function(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"16:9";return o.MAJOR.imageWidth[t]||o.MAJOR.imageWidth["16:9"]},g=(t,e)=>Object.assign(Object.assign(Object.assign(Object.assign({},t),(null==e?void 0:e.textColor)&&{color:e.textColor}),(null==e?void 0:e.backgroundColor)&&{backgroundColor:e.backgroundColor}),(null==e?void 0:e.borderColor)&&{borderColor:e.borderColor}),s=function(s,c){let T=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"16:9",p=arguments.length>3&&void 0!==arguments[3]?arguments[3]:n.MAJOR.containerPadding,f=arguments.length>4?arguments[4]:void 0,h=arguments.length>5?arguments[5]:void 0;const u=d(T),O=function(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"16:9";const e=d(t);switch(t){case"16:9":return Math.round(e*(9/16));case"1:1":return e;case"4:3":return Math.round(e*(3/4));default:return l.IMAGE_HEIGHT}}(T),x=parseInt(p,10)||16,b=O+2*x;return{container:{width:`${x+u+parseInt(n.MAJOR.contentGap,10)+o.MAJOR.textAreaWidth+x}px`,height:"auto",minHeight:`${b}px`,display:"flex",flexDirection:"column",backgroundColor:i.BACKGROUND.SURFACE,borderRadius:r.POPUP,overflow:"hidden",position:"relative",padding:p,transform:s?c:"scale(1)",opacity:s?0:1,transition:e,boxSizing:"border-box"},headerContainer:{width:"100%",display:"flex",justifyContent:"flex-end",marginBottom:n.MAJOR.headerMarginBottom,position:"relative"},contentWrapper:{display:"flex",flex:1,gap:n.MAJOR.contentGap},skipButton:{base:{background:"transparent",border:"none",color:i.TEXT.TERTIARY,fontSize:a.SKIP_BUTTON.fontSize,fontWeight:a.SKIP_BUTTON.fontWeight,cursor:"pointer",padding:n.MAJOR.skipButtonPadding,borderRadius:r.BUTTON,fontFamily:a.SKIP_BUTTON.fontFamily,lineHeight:a.SKIP_BUTTON.lineHeight},hover:{backgroundColor:"rgba(255, 255, 255, 0.10)",color:t.grayscale[700]}},imageContainer:{backgroundColor:i.BACKGROUND.IMAGE,width:`${u}px`,height:`${O}px`,position:"relative",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:r.BUTTON,overflow:"hidden",flexShrink:0},image:{width:"100%",height:"100%",objectFit:"cover"},imagePlaceholder:{color:t.grayscale[500],fontSize:"14px",textAlign:"center",width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:t.grayscale[800]},videoOverlay:{position:"absolute",top:0,left:0,width:"100%",height:"100%",backgroundColor:"rgba(0,0,0,0.4)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",zIndex:10,transition:"opacity 0.2s"},playIcon:{width:"84px",height:"84px",color:"#060606ff"},contentContainer:{flex:1,display:"flex",marginLeft:n.MAJOR.contentMarginLeft,flexDirection:"column",justifyContent:"flex-start",background:"transparent",maxWidth:`${o.MAJOR.textAreaWidth}px`,gap:n.MAJOR.listGap},skipButtonContainer:{width:"100%",display:"flex",justifyContent:"flex-end",marginBottom:n.MAJOR.skipButtonContainerMargin},title:{fontSize:a.TITLE.fontSize,fontWeight:a.TITLE.fontWeight,marginBottom:n.MAJOR.titleBottom,padding:0,color:i.TEXT.PRIMARY,lineHeight:a.TITLE.lineHeight,textAlign:"left",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",fontFamily:a.TITLE.fontFamily},content:{fontSize:a.CONTENT.fontSize,lineHeight:a.CONTENT.lineHeight,color:i.TEXT.SECONDARY,textAlign:"left",marginBottom:"auto",fontFamily:a.CONTENT.fontFamily,fontWeight:a.CONTENT.fontWeight},actionsWrapper:{display:"flex",alignItems:"center",justifyContent:"space-between",marginRight:n.MAJOR.actionsTop,gap:"8px",flexWrap:"nowrap"},buttonsGroup:{display:"flex",alignItems:"center",gap:n.MAJOR.listGap},exploreButton:{base:g({backgroundColor:"transparent",border:`1px solid ${i.BUTTON.PRIMARY_BORDER}`,color:i.BUTTON.PRIMARY_TEXT,borderRadius:r.BUTTON,fontSize:a.BUTTON.fontSize,fontWeight:a.BUTTON.fontWeight,cursor:"pointer",padding:`0 ${l.BUTTON_PADDING_HORIZONTAL}`,height:`${l.BUTTON_HEIGHT}px`,textAlign:"center",minWidth:"auto",textDecoration:"none",display:"inline-flex",alignItems:"center",justifyContent:"center",fontFamily:a.BUTTON.fontFamily,lineHeight:a.BUTTON.lineHeight},f),hover:{backgroundColor:"rgba(255, 255, 255, 0.10)"}},secondaryButton:{base:g({backgroundColor:"transparent",color:i.BUTTON.PRIMARY_TEXT,borderRadius:r.BUTTON,fontSize:a.BUTTON.fontSize,fontWeight:a.BUTTON.fontWeight,cursor:"pointer",padding:`0 ${l.BUTTON_PADDING_HORIZONTAL}`,height:`${l.BUTTON_HEIGHT}px`,border:"none",boxShadow:"none",textAlign:"center",minWidth:"auto",textDecoration:"none",display:"inline-flex",alignItems:"center",justifyContent:"center",fontFamily:a.BUTTON.fontFamily,lineHeight:a.BUTTON.lineHeight,transition:"none"},h),hover:{backgroundColor:(null==h?void 0:h.backgroundColor)?`${h.backgroundColor}cc`:"rgba(254, 192, 45, 0.1)"}},navigationContainer:{display:"flex",gap:n.MAJOR.navigationGap,alignItems:"center"},navigationButton:e=>({base:{width:`${l.NAVIGATION_BUTTON_SIZE}px`,height:`${l.NAVIGATION_BUTTON_SIZE}px`,backgroundColor:"transparent",border:"none",color:e?i.ICON.DISABLED:i.ICON.ENABLED,fontSize:"16px",cursor:e?"not-allowed":"pointer",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:r.BUTTON,padding:0},hover:{color:t.warning[500]}})}};export{s as getMajorPopupStyles};
|