1_N_E=(window.webpackJsonp_N_E=window.webpackJsonp_N_E||[]).push([[23],{"7jfs":function(e,t,s){"use strict";s.d(t,"a",(function(){return c})),s.d(t,"b",(function(){return o}));var a=["Bytes","KB","MB","GB"],c=e=>{if(0===e)return"0 Bytes";if(1===e)return"1 Byte";var t=Number.parseInt(Math.floor(Math.log(e)/Math.log(1024)));return"".concat(Math.round(e/1024**t)," ").concat(a[t])},o=(()=>{var e=["en",{day:"numeric",month:"long",year:"numeric"}];try{var t=new Intl.DateTimeFormat(...e);return e=>t.format(e)}catch(s){return t=>t.toLocaleString(...e)}})();(()=>{var e=["en",{ignorePunctuation:!0,numeric:!0}];try{var t=new Intl.Collator(...e)}catch(s){return(t,s)=>String(t).localeCompare(String(s),...e)}})()},BRQW:function(e,t,s){"use strict";var a=s("rePB"),c=s("MX0m"),o=s.n(c),n=s("q1tI"),i=s("vw9B"),r=s("eyG0"),l=s("nKUr");function d(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function g(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?d(Object(s),!0).forEach((function(t){Object(a.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):d(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var _=e=>Object(l.jsx)("svg",g(g({viewBox:"-1 -1 60 60"},e),{},{children:Object(l.jsx)("path",{d:" M5.9407235,5.39113055 L5.9407235,3.94565927 C5.9407235,3.25248847 6.43156336,3.08649793 6.78684155,3.08649793 L8.94783161,3.08649793 L8.94783161,0 L5.97232917,0 C2.66249207,0 1.9210916,2.28539766 1.9210916, 3.77005125 L1.9210916,5.39113055 L0,5.39113055 L0,7.56895494 L0,8.99519126 L1.94203512,8.99519126 L1.94203512,18 L5.79488047,18 L5.79488047, 8.99519126 L8.6451026,8.99519126 L8.77038291,7.57892862 L9,5.39113055 L5.9407235,5.39113055 Z ",fill:"currentColor",transform:"translate(24,19)"})}));_.iconName="Facebook";var m=r.a.extend(_,"Icon");function h(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function j(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?h(Object(s),!0).forEach((function(t){Object(a.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):h(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var b=e=>Object(l.jsx)("svg",j(j({viewBox:"-1 -1 60 60"},e),{},{children:Object(l.jsxs)("g",{fillRule:"evenodd",transform:"translate(20,19)",children:[Object(l.jsx)("polygon",{fill:"transparent",points:"0 0 17 0 17 17 0 17",stroke:"none",strokeWidth:"1"}),Object(l.jsx)("path",{d:" M14.4859238,14.4862431 L11.966181,14.4862431 L11.966181,10.5409444 C11.966181,9.5996875 11.9489452,8.38961806 10.6560187,8.38961806 C9.34373134,8.38961806 9.14280357,9.41457639 9.14280357,10.4728264 L9.14280357,14.4862431 L6.62317884,14.4862431 L6.62317884,6.37334722 L9.04210358,6.37334722 L9.04210358,7.48177083 L9.07563089,7.48177083 C9.41208455,6.84403472 10.2345662,6.17147222 11.4612644,6.17147222 C14.0145345,6.17147222 14.4859238,7.85175694 14.4859238,10.0361389 L14.4859238,14.4862431 Z M3.78162109,5.26433333 C2.97354203,5.26433333 2.31940529,4.60900694 2.31940529,3.80197917 C2.31940529,2.99554167 2.97354203,2.34045139 3.78162109,2.34045139 C4.58781128,2.34045139 5.24289246,2.99554167 5.24289246,3.80197917 C5.24289246,4.60900694 4.58781128,5.26433333 3.78162109,5.26433333 Z M2.5204511,14.4862431 L5.04184664,14.4862431 L5.04184664,6.37334722 L2.5204511,6.37334722 L2.5204511,14.4862431 Z M15.7415453,0 L1.25467702,0 C0.562408855,0 0, 0.548722222 0,1.22529861 L0,15.7732847 C0,16.4504514 0.562408855,17 1.25467702,17 L15.7415453,17 C16.434994,17 17,16.4504514 17,15.7732847 L17,1.22529861 C17,0.548722222 16.434994,0 15.7415453,0 Z ",fill:"currentColor"})]})}));b.iconName="LinkedIn";var p=r.a.extend(b,"Icon");function y(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function x(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};
1t%2?y(Object(s),!0).forEach((function(t){Object(a.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):y(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var L=e=>Object(l.jsx)("svg",x(x({viewBox:"-16 -16 60 60"},e),{},{children:Object(l.jsx)("path",{d:"M14.735 10.704 23.473.547h-2.071l-7.587 8.82-6.06-8.82H.765L9.93 13.883.766 24.535h2.07l8.013-9.314 6.4 9.314h6.989l-9.504-13.831Zm-2.837 3.297-.928-1.328L3.582 2.106h3.181l5.962 8.528.928 1.328 7.75 11.085h-3.18L11.897 14Z",fill:"currentColor"})}));L.iconName="Twitter";var O,u=r.a.extend(L,"Icon"),E=s("H00o"),R=(s("4jK1"),s("s+2q"));t.a=Object(R.a)((O=class extends n.Component{get shareDropInText(){var e=this.props.shareDropInText||this.props.shareTitle;return this.props.twitterAuthor?"".concat(e," ").concat(this.props.twitterAuthor):e}get twitterAuthor(){return this.props.twitterAuthor.startsWith("@")?this.props.twitterAuthor.slice(1):"wistia"}get shareableLink(){var e=new URL(this.props.router.asPath,"https://wistia.com");return e.search="",e.href}get facebookUrl(){var e=new URL("https://www.facebook.com/sharer/sharer.php");return e.search=new URLSearchParams([["u",this.shareableLink]]),e.href}get twitterUrl(){var e=new URL("https://twitter.com/intent/tweet");return e.search=new URLSearchParams([["url",this.shareableLink],["text",this.shareDropInText],["via","wistia"]]),e.href}get linkedInUrl(){var e=new URL("https://www.linkedin.com/shareArticle");return e.search=new URLSearchParams([["url",this.shareableLink],["mini","true"],["title",this.props.shareTitle],["summary",this.props.shareDescription],["source","Wistia"]]),e.href}render(){return Object(l.jsxs)("ul",{className:o.a.dynamic([["1843915595",[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon]]])+" ShareButtons",children:[Object(l.jsx)("li",{className:o.a.dynamic([["1843915595",[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon]]]),children:Object(l.jsx)(E.b,{href:this.facebookUrl,passHref:!0,children:Object(l.jsx)("a",{target:"_blank",className:o.a.dynamic([["1843915595",[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon]]])+" ShareButtons__link",children:Object(l.jsx)(m,{})})})}),Object(l.jsx)("li",{className:o.a.dynamic([["1843915595",[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon]]]),children:Object(l.jsx)(E.b,{href:this.twitterUrl,passHref:!0,children:Object(l.jsx)("a",{target:"_blank",className:o.a.dynamic([["1843915595",[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon]]])+" ShareButtons__link",children:Object(l.jsx)(u,{})})})}),Object(l.jsx)("li",{className:o.a.dynamic([["1843915595",[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon]]]),children:Object(l.jsx)(E.b,{href:this.linkedInUrl,passHref:!0,children:Object(l.jsx)("a",{target:"_blank",className:o.a.dynamic([["1843915595",[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon]]])+" ShareButtons__link",children:Object(l.jsx)(p,{})})})}),Object(l.jsx)(o.a,{id:"1843915595",dynamic:[i.g.GRAY_1,this.props.fillOnHover,this.props.fillOnHover,this.props.iconOnHover,this.props.icon],children:[".ShareButtons.__jsx-style-dynamic-selector{list-style:none;padding:0;}",".ShareButtons.__jsx-style-dynamic-selector li.__jsx-style-dynamic-selector{display:inline-block;}",".ShareButtons.__jsx-style-dynamic-selector a.__jsx-style-dynamic-selector{width:53px;height:53px;border:1px solid ".concat(i.g.GRAY_1,";display:block;border-radius:50px;-webkit-transition: background 150ms cubic-bezier(0,0,0,1), border-color 150ms cubic-bezier(0,0,0,1);transition: background 150ms cubic-bezier(0,0,0,1), border-color 150ms cubic-bezier(0,0,0,1);}"),".ShareButtons.__jsx-style-dynamic-selector a.__jsx-style-dynamic-selector:hover{background:".concat(this.props.fillOnHover,";border-color:").concat(this.props.fillOnHover,";}"),".ShareButtons.__jsx-style-dynamic-selector a.__jsx-style-dynamic-selector:hover .Icon{color:".concat(this.props.iconOnHover,";}"),".ShareButtons__link.__jsx-style-dynamic-selector .Icon{width:53px;color:".concat(this.props.icon,";}")]})]})}},Object(a.a)(O,"defaultProps",{fill:"white",fillOnHover:i.g.SKY_BLUE,icon:i.g.GRAY_2,iconOnHover:"white",shareDescription:"",shareDropInText:"",shareTitle:"",twitterAuthor:""}),O))},IMbY:function(e,t,s){"use strict";function a(e,t){var s=0;for(var a of Array.from(e))s+=a.codePointAt(0),s%=t;return s}s.d(t,"b",(function(){return a})),s.d(t,"a",(function(){return c})),s.d(t,"c",(function(){return o}
1));var c=e=>Math.floor(Math.random()*e.length),o=e=>{var t=e.slice(0);return s=>{0===t.length&&(t=e.slice(0));for(var a=c(t);t[a]===s;)a=c(t);return t.splice(a,1)[0]}}},K9GT:function(e,t,s){"use strict";s.r(t),s.d(t,"default",(function(){return At}));var a=s("q1tI"),c=s("8Kt/"),o=s.n(c),n=s("HaE+"),i=s("rePB"),r=s("MX0m"),l=s.n(r),d=s("u0RH"),g=s.n(d),_=s("/0cA"),m=s("vw9B"),h=s("O8k/"),j=s("Ff2n"),b=s("4jK1"),p=s("eyG0"),y=s("nKUr");function x(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function L(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?x(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):x(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var O=e=>Object(y.jsxs)("svg",L(L({},e),{},{viewBox:"0 0 55 55",children:[Object(y.jsxs)("g",{fill:m.g.PINK,children:[Object(y.jsx)("circle",{cx:"27.5",cy:"27.5",opacity:"0.15",r:"27.5"}),Object(y.jsx)("ellipse",{cx:"28.61",cy:"26.81",rx:"11.48",ry:"11.9"})]}),Object(y.jsxs)("g",{fill:"white",children:[Object(y.jsx)("rect",{height:"1.41",width:"1.38",x:"21.91",y:"26.75"}),Object(y.jsx)("rect",{height:"1.41",width:"1.38",x:"33.69",y:"26.75"})]}),Object(y.jsx)("path",{d:"M26.08,31A2.61,2.61,0,0,0,31,31",fill:"none",stroke:m.g.GRAY_6,strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"1.18"}),Object(y.jsxs)("g",{fill:m.g.GRAY_6,children:[Object(y.jsx)("path",{d:" M14.32,30.37a4.85,4.85,0,0,1-3-2.65,3.07,3.07,0,0,1,0-3.16A3.29,3.29,0 0,1,13,23.29c.39-.1.54.1.14.36s-.3.53-.11.57a1,1,0,0,0,.85-.32c.22-.26 .15-.4.24-.49s.28.2.1.39-.27.43-.1.57.57-.07.7-.26a1,1,0,0,0,.22-.68c0 -.24.13-.27.36-.16s.71.4.9.28.39-.35-.45-.88a4,4,0,0,0-2.19-.74,4.35 4.35,0,0,0-3.2,1.4,4.56,4.56,0,0,0-1,4,5.47,5.47,0,0,0,2.07,3.15,9.21 9.21,0,0,0,4.09,1.63,11.89,11.89,0,0,0,2.77.11l-.72-1.86A7.58,7.58,0,0 1,14.32,30.37Z "}),Object(y.jsx)("path",{d:" M39.73,29.8A20.33,20.33,0,0,1,43.06,34c1,1.89.62,4.23,0,4.9A5.33,5.33 0,0,1,38.5,40a14.23,14.23,0,0,1-4.94-1.88c-.86-.52-2.19-1.38-2.19-1.38 a5.23,5.23,0,0,1-1.85-.19s-.46-.29-.34-.48.59,0,.59,0v-.32s-.4-.38-.28 -.58.83,0,.83,0l-.34-.7s.19-.42.43-.39.65.74.65.74l.37-.06-.06-.64h.56 l.37,1,0,.45a24.46,24.46,0,0,0,3.48,2,10.09,10.09,0,0,0,4.38,1.09,2,2 0,0,0,2.19-1.92,6,6,0,0,0-1.08-3,25,25,0,0,0-2-2.43Z "})]})]}));O.iconName="AvatarRedCircle";var u=p.a.extend(O,"Icon");function E(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function R(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?E(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):E(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var B=e=>Object(y.jsxs)("svg",R(R({},e),{},{viewBox:"0 0 55 55",children:[Object(y.jsx)("circle",{cx:"27.5",cy:"27.5",fill:m.g.PINK,opacity:"0.15",r:"27.5"}),Object(y.jsx)("path",{d:" M26.21,32a6.69,6.69,0,0,0-.31,2,6.76,6.76,0,0,0,.49,3c.39.82.89, 2,.89,2l-5.21,0s-.78-1.18,0-1.54a8.24,8.24,0,0,1,3,0,7.94,7.94, 0,0,1-.52-1.95,10,10,0,0,1,0-2.31c.08-.73.17-1.17.17-1.17Z ",fill:m.g.GRAY_6}),Object(y.jsx)("path",{d:" M29.46,32a6.87,6.87,0,0,1,.32,2,6.9,6.9,0,0,1-.5,3c-.39.82-.89, 2-.89,2l5.21,0s.79-1.18,0-1.54a8.24,8.24,0,0,0-3,0,7.94,7.94,0, 0,0,.52-1.95,10,10,0,0,0,0-2.31c-.08-.73-.17-1.17-.17-1.17Z ",fill:m.g.GRAY_6}),Object(y.jsx)("polygon",{fill:m.g.PINK,points:" 9.58 32.67 45.42 32.67 36.24 16.08 18.75 16.08 9.58 32.67 "}),Object(y.jsxs)("g",{fill:"none",stroke:m.g.GRAY_6,children:[Object(y.jsx)("line",{strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"1.18px",x1:"15.43",x2:"20.62",y1:"22.22",y2:"22.22"}),Object(y.jsx)("line",{strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"1.18px",x1:"34.68",x2:"39.87",y1:"22.22",y2:"22.22"}),Object(y.jsx)("line",{strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"1.18px",x1:"26.17",x2:"29.13",y1:"22.22",y2:"22.22"}),Object(y.jsx)("ellipse",{cx:"23.39",cy:"22.03",fill:"none",rx:"2.78",ry:"2.88",strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"1.18px"}),Object(y.jsx)("ellipse",{cx:"31.91",cy:"22.03",fill:"none",rx:"2.78",ry:"2.88",strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"1.18px"})]}),Object(y.jsx)("path",{d:" M25.06,26.63a4.74,4.74,0,0,0,5.18,0s0,3.07-2.59,3.07S25.06, 26.63,25.06,26.63Z ",fill:"#fff"})]}));B.iconName="AvatarRedIsosceles";var A=p.a.extend(B,"Icon");function Y(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function P(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};
1t%2?Y(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):Y(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var f=e=>Object(y.jsxs)("svg",P(P({},e),{},{viewBox:"0 0 55 55",children:[Object(y.jsx)("circle",{cx:"27.5",cy:"27.5",fill:m.g.SKY_BLUE,opacity:"0.15",r:"27.5"}),Object(y.jsxs)("g",{fill:m.g.GRAY_6,children:[Object(y.jsx)("path",{d:" M30.93,22.17A6.82,6.82,0,0,0,32,20.43a6.84,6.84,0,0,0,.69-2.94c0 -.91-.07-2.16-.07-2.16l4.76,2.18s.28,1.4-.59,1.4A8.2,8.2,0,0,1,34 17.66a8.42,8.42,0,0,1-.27,2,9.87,9.87,0,0,1-.87,2.14c-.35.63-.6,1-.6 1Z "}),Object(y.jsx)("path",{d:" M24,22.17a6.82,6.82,0,0,1-1.07-1.74,6.84,6.84,0,0,1-.69-2.94c0-.91 .07-2.16.07-2.16l-4.76,2.18s-.29,1.4.59,1.4a8.07,8.07,0,0,0,2.76 -1.25,7.87,7.87,0,0,0,.27,2A9.43,9.43,0,0,0,22,21.8c.35.63.6,1,.6,1Z "})]}),Object(y.jsxs)("g",{fill:m.g.SKY_BLUE,children:[Object(y.jsx)("rect",{height:"3.38",width:"25.53",x:"14.74",y:"36.4"}),Object(y.jsx)("polygon",{points:"27.51 15.22 14.74 34.17 40.26 34.17 27.51 15.22"})]}),Object(y.jsxs)("g",{fill:"white",children:[Object(y.jsx)("path",{d:"M24,29.11a.71.71,0,1,1-.71-.73A.73.73,0,0,1,24,29.11Z"}),Object(y.jsx)("path",{d:"M32.45,29.11a.71.71,0,1,1-.71-.73A.73.73,0,0,1,32.45,29.11Z"})]}),Object(y.jsx)("path",{d:" M27.75,22.74a2,2,0,0,0-2,2,1.91,1.91,0,0,0,2,2c.88,0,1.47-1,1.47-2.16A 1.7,1.7,0,0,0,27.75,22.74Z ",fill:"none",stroke:m.g.GRAY_6,strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"1.18"})]}));f.iconName="AvatarBlueTriangle";var w=p.a.extend(f,"Icon"),G=s("IMbY");function U(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function k(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?U(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):U(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var N=[u,A,w],T=Object.assign(e=>{var{itemId:t}=e,s=Object(j.a)(e,["itemId"]),a=Object(G.b)(t,N.length),c=N[a];return Object(y.jsxs)("div",{className:"jsx-3151283544 AvatarIcon",children:[Object(y.jsx)(c,k(k({},s),{},{className:"jsx-3151283544 "+(s&&null!=s.className&&s.className||"")})),Object(y.jsx)(l.a,{id:"3151283544",children:[".AvatarIcon.jsx-3151283544{border-radius:50%;}"]})]})},{defaultProps:{itemId:""},propTypes:{itemId:b.a.string}}),I=e=>{var{author:t}=e;return t.authorHeadshot?Object(y.jsx)(_.a,{image:t.authorHeadshot,name:t.name,size:_.b}):Object(y.jsx)(T,{itemId:t.id,width:_.b})},v=e=>{var{author:t}=e;return Object(y.jsx)(_.c,{name:t.name,title:t.team,isGuest:t.isGuest,isSidebar:!0,slug:t.slug,children:Object(y.jsx)(I,{author:t})})},K=Object.assign(e=>{var{authors:t,postAccentColor:s}=e;return Object(y.jsxs)("div",{className:l.a.dynamic([["3740852547",[h.b.COMMON_CONTENT_WIDTH,m.g.GRAY_6,s]]])+" Authors",children:[t&&t.map(e=>Object(y.jsx)(v,{author:e},e.id)),Object(y.jsx)(l.a,{id:"3740852547",dynamic:[h.b.COMMON_CONTENT_WIDTH,m.g.GRAY_6,s],children:[".Authors.__jsx-style-dynamic-selector{font-size:16px;font-weight:400;line-height:1.2;max-width:".concat(h.b.COMMON_CONTENT_WIDTH,";width:100%;}"),".Authors.__jsx-style-dynamic-selector a{color:".concat(m.g.GRAY_6,";-webkit-text-decoration:none;text-decoration:none;-webkit-transition:color linear 80ms;transition:color linear 80ms;}"),".Authors.__jsx-style-dynamic-selector a:hover{color:".concat(s,";}")]})]})},{propTypes:{authors:b.a.array,postAccentColor:b.a.string},defaultProps:{postAccentColor:m.g.BRAND_BLUE}}),S=s("H00o"),D=s("Ahnj");function H(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function M(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};
1t%2?H(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):H(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}class W extends a.Component{render(){var e=D.a.learn.getProps({},{page:1,tag:this.props.tag.slug});return Object(y.jsx)(S.b,M(M({},e),{},{children:Object(y.jsxs)("a",{className:l.a.dynamic([["1117316461",[m.g.GRAY_1,m.g.SKY_BLUE,m.g.SKY_BLUE]]])+" BlogTag",children:[this.props.tag.name,Object(y.jsx)(l.a,{id:"1117316461",dynamic:[m.g.GRAY_1,m.g.SKY_BLUE,m.g.SKY_BLUE],children:[".BlogTag.__jsx-style-dynamic-selector{background-color:white;border:1px solid ".concat(m.g.GRAY_1,";border-radius:5px;color:inherit;display:inline-block;font-size:15px;padding:6px 8px;-webkit-text-decoration:none;text-decoration:none;-webkit-transition-proerty:background-color,border-color,color;transition-proerty:background-color,border-color,color;-webkit-transition-duration:80ms,80ms,80ms;transition-duration:80ms,80ms,80ms;}"),".BlogTag.__jsx-style-dynamic-selector:focus,.BlogTag.__jsx-style-dynamic-selector:hover{background-color:".concat(m.g.SKY_BLUE,";border-color:").concat(m.g.SKY_BLUE,";color:white;}")]})]})}))}}var C=s("Txqw");class z extends a.Component{renderHeading(){return this.props.title?Object(y.jsxs)("h2",{className:"jsx-2644400395 BlogTagsList__heading",children:[this.props.title,Object(y.jsx)(l.a,{id:"2644400395",children:[".BlogTagsList__heading.jsx-2644400395{font-size:14px;font-weight:600;-webkit-letter-spacing:0.04em;-moz-letter-spacing:0.04em;-ms-letter-spacing:0.04em;letter-spacing:0.04em;margin-bottom:30px;text-transform:uppercase;}"]})]}):Object(y.jsx)(C.a,{children:Object(y.jsx)("h2",{children:"Topic tags"})})}renderTag(e){return Object(y.jsxs)("li",{className:"jsx-1274407314 BlogTagsList__tag",children:[Object(y.jsx)(W,{tag:e}),Object(y.jsx)(l.a,{id:"1274407314",children:[".BlogTagsList__tag.jsx-1274407314{margin-bottom:15px;}",".BlogTagsList__list--flow .BlogTagsList__tag.jsx-1274407314{display:inline-block;margin-right:15px;}","@media (max-width:525px){.BlogTagsList__list--multi-column .BlogTagsList__tag.jsx-1274407314{display:inline-block;margin-right:15px;}}"]})]},e.name)}render(){var e=this.props.tags.filter(Boolean),{layout:t}=this.props;if(0===e.length)return null;var s=new p.a({BlogTagsList__list:!0,"BlogTagsList__list--column":"column"===t,"BlogTagsList__list--flow":"flow"===t,"BlogTagsList__list--multi-column":"columns"===t});return Object(y.jsxs)("section",{className:l.a.dynamic([["1940798212",[this.props.title?"50px":"15px"]]])+" BlogTagsList",children:[this.renderHeading(),Object(y.jsx)("ul",{"data-testid":"blog-tags-list",className:l.a.dynamic([["1940798212",[this.props.title?"50px":"15px"]]])+" "+(s||""),children:e.map(this.renderTag,this)}),Object(y.jsx)(l.a,{id:"1940798212",dynamic:[this.props.title?"50px":"15px"],children:[".BlogTagsList.__jsx-style-dynamic-selector{margin:".concat(this.props.title?"50px":"15px"," 0;}"),".BlogTagsList__list--multi-column.__jsx-style-dynamic-selector{-webkit-column-fill:balance;column-fill:balance;-webkit-columns:5;columns:5;}","@media (max-width:1275px){.BlogTagsList__list--multi-column.__jsx-style-dynamic-selector{-webkit-columns:4;columns:4;}}","@media (max-width:1025px){.BlogTagsList__list--multi-column.__jsx-style-dynamic-selector{-webkit-columns:3;columns:3;}}","@media (max-width:800px){.BlogTagsList__list--multi-column.__jsx-style-dynamic-selector{-webkit-columns:2;columns:2;}}","@media (max-width:525px){.BlogTagsList__list--multi-column.__jsx-style-dynamic-selector{-webkit-columns:1;columns:1;margin-right:-15px;}}","@media (max-width:1400px){.BlogTagsList__list.__jsx-style-dynamic-selector{-webkit-column-count:4;column-count:4;}}","@media (max-width:1025px){.BlogTagsList__list.__jsx-style-dynamic-selector{-webkit-columns:3;columns:3;}}","@media (max-width:800px){.BlogTagsList__list.__jsx-style-dynamic-selector{-webkit-columns:2;columns:2;}}","@media (max-width:525px){.BlogTagsList__list.__jsx-style-dynamic-selector{-webkit-columns:1;columns:1;margin-right:-15px;}}",".BlogTagsList__list--column.__jsx-style-dynamic-selector{-webkit-columns:1;columns:1;}"]})]})}}Object(i.a)(z,"defaultProps",{tags:[],title:"Explore all tags"});var F=s("7jfs");class q extends a.Component{get url(){var e=this.props.post.category.slug,{slug:t}=this.props.post;return new URL(D.a.learn.category.slug.getURL({category:e,slug:t}))}render(){var e=new p.a({BlogPostMeta:!0,"BlogPostMeta--horizontal":!this.props.vertical,"BlogPostMeta--vertical":this.props.vertical});return Object(y.jsxs)("div",{className:l.a.dynamic([["558326978",[m.g.GRAY_4]]])+" "+(e||""),children:[Object(y.jsx)("p",{className:l.a.dynamic([["558326978",[m.g.GRAY_4]]])+" BlogPostMeta__date",children:Object(F.b)(this.props.post.publishDate)}),Object(y.jsx)(z,{layout:this.props.vertical?"column":"flow",tags:this.props.post.tags,title:null}),Object(y.jsx)(l.a,{id:"558326978",dynamic:[m.g.GRAY_4],children:[".BlogPostMeta__date.__jsx-style-dynamic-selector{color:".concat(m.g.GRAY_4,";}"),".BlogPostMeta--horizontal.__jsx-style-dynamic-selector .BlogPostMeta__date.__jsx-style-dynamic-selector{display:inline-block;margin-right:10px;}",".BlogPostMeta--vertical.__jsx-style-dynamic-selector .BlogPostMeta__date.__jsx-style-dynamic-selector{margin:20px 0 10px;}"]})]})}}Object(i.a)(q,"defaultProps",{vertical:!1});
1var V=s("CfX7"),X=s("boMQ"),Q=s("UOMm"),Z=s("ejG/"),J=s("kZhb"),$=s("glP5"),ee=s("kFol"),te=s("MM/I"),se=s("8oa6");function ae(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}var ce=new Map([["boosted",$.a],["culture",$.a],["marketing",Q.a],["product-updates",ee.a],["production",Z.a],["sales",J.a],["showcase",se.a],["show-news",te.a],["all",X.a]]);class oe extends a.Component{render(){var e=ce.get(this.props.slug);e||(console.error("No icon found for ".concat(this.props.slug,"!\nTo remove this error add an icon to `CATEGORY_ICON_MAP` manifest, meanwhile a fallback icon will be used")),[e]=[...ce.values()]);var t=function(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?ae(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):ae(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}({color:this.props.color&&Object(m.h)(this.props.color),height:"1em",marginRight:"1ex",width:"1em"},this.props.style);return Object(y.jsx)(e,{role:"presentation",style:t})}}Object(i.a)(oe,"defaultProps",{color:void 0});var ne=s("AJXR"),ie=s("V591"),re=["featured video","featured video, no body"];function le(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function de(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?le(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):le(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}class ge extends a.Component{get categoryColor(){return Object(m.h)(this.props.category.color)}get highlightColor(){return new ne.a(this.categoryColor).lighten(.5).setAlpha(.5)}get titleFontSize(){return"".concat(this.props.titleFontSize||(this.props.fullView?24:16),"px")}renderDescription(){var e=this.props.post.highlightedDescription,{description:t}=this.props.post;return(e||t)&&Object(y.jsxs)("p",{className:l.a.dynamic([["2872611620",[m.g.GRAY_5,this.highlightColor]]])+" BlogIndexPost__desc",children:[e?Object(y.jsx)(e,{className:l.a.dynamic([["2872611620",[m.g.GRAY_5,this.highlightColor]]])}):t,Object(y.jsx)(l.a,{id:"2872611620",dynamic:[m.g.GRAY_5,this.highlightColor],children:[".BlogIndexPost__desc.__jsx-style-dynamic-selector{color:".concat(m.g.GRAY_5,";margin-top:1em;}"),".BlogIndexPost__desc.__jsx-style-dynamic-selector .highlight{background-color:".concat(this.highlightColor,";}")]})]})}renderImage(){if(this.props.post.image)return Object(y.jsx)(V.a,{image:this.props.post.image,maxWidth:700,style:this.props.imageStyle});var e=de({backgroundColor:Object(m.h)(this.props.category.color)},this.props.imageStyle);return Object(y.jsxs)("div",{style:e,className:"jsx-1314525163 BlogIndexPost__placeholder",children:[Object(y.jsx)(oe,{color:"white",slug:this.props.category.slug,style:{height:"75px",width:"75px"}}),Object(y.jsx)(l.a,{id:"1314525163",children:[".BlogIndexPost__placeholder.jsx-1314525163{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}"]})]})}renderVideoIcon(){if(re.includes(this.props.post.contentStyle))return Object(y.jsx)(ie.a,{className:"PlayIcon"})}renderDate(){return this.props.showPublished?Object(y.jsxs)("p",{className:"jsx-1803457966 BlogIndexPost__date",children:[this.props.post.publishedDate,Object(y.jsx)(l.a,{id:"1803457966",children:[".BlogIndexPost__date.jsx-1803457966{margin:0 0 0.5em;}"]})]}):null}renderTitle(){var e=this.props.post.highlightedTitle,{highlightColor:t,titleFontSize:s}=this;return Object(y.jsxs)("div",{className:l.a.dynamic([["3740877903",[s,t]]])+" BlogIndexPost__title",children:[this.renderVideoIcon(),e?Object(y.jsx)(e,{className:l.a.dynamic([["3740877903",[s,t]]])}):this.props.post.title,Object(y.jsx)(l.a,{id:"3740877903",dynamic:[s,t],children:[".BlogIndexPost__title.__jsx-style-dynamic-selector{font-size:".concat(s,";font-weight:500;word-break:break-word;}"),".BlogIndexPost__title.__jsx-style-dynamic-selector > .markdown{display:inline;}",".BlogIndexPost__title.__jsx-style-dynamic-selector .highlight{background-color:".concat(t,";}"),".BlogIndexPost__title.__jsx-style-dynamic-selector .PlayIcon{height:0.75em;margin-right:8px;width:0.75em;}"]})]})}render(){var{categoryColor:e}=this,t=new ne.a(e).setAlpha(.3),s=this.props.post.url?{as:this.props.post.url,href:this.props.post.url}:D.a.learn.category.slug.getProps({category:this.props.category.slug,slug:this.props.post.slug});return Object(y.jsxs)("div",{className:l.a.dynamic([["1953054808",[e,t,new ne.a(e).lighten(.5)]]])+" BlogIndexPost__link-area",children:[Object(y.jsx)(S.b,de(de({},s),{},{children:Object(y.jsxs)("a",{className:l.a.dynamic([["1953054808",[e,t,new ne.a(e).lighten(.5)]]])+" BlogIndexPost__link",children:[this.props.fullView&&Object(y.jsx)("div",{className:l.a.dynamic([["1953054808",[e,t,new ne.a(e).lighten(.5)]]])+" BlogIndexPost__link__image",children:this.renderImage()}),this.renderDate(),this.renderTitle()]})})),this.renderDescription(),Object(y.jsx)(l.a,{id:"1953054808",dynamic:[e,t,new ne.a(e).lighten(.5)],children:[".BlogIndexPost__link.__jsx-style-dynamic-selector{color:inherit;-webkit-text-decoration:none;text-decoration:none;-webkit-transition:color 150ms cubic-bezier(0,0,0,1);transition:color 150ms cubic-bezier(0,0,0,1);}",".BlogIndexPost__link.__jsx-style-dynamic-selector:focus,.BlogIndexPost__link.__jsx-style-dynamic-selector:hover{color:".concat(e,";outline:none;}"),".BlogIndexPost__link.__jsx-style-dynamic-selector::after{content:'';height:100%;left:0;position:absolute;top:0;width:100%;}",".BlogIndexPost__link-area.__jsx-style-dynamic-selector{line-height:1.4;position:relative;}",".BlogIndexPost__link__image.__jsx-style-dynamic-selector{border-radius:5px;margin:0 0 1.8em;overflow:hidden;position:relative;}",".BlogIndexPost__link__image.__jsx-style-dynamic-selector::after{content:'';display:block;height:100%;left:0;position:absolute;top:0;-webkit-transition:background-color 150ms cubic-bezier(0,0,0,1);transition:background-color 150ms cubic-bezier(0,0,0,1);width:100%;}",".BlogIndexPost__link.__jsx-style-dynamic-selector:focus .BlogIndexPost__link__image.__jsx-style-dynamic-selector::after,.BlogIndexPost__link.__jsx-style-dynamic-selector:hover .BlogIndexPost__link__image.__jsx-style-dynamic-selector::after{background-color:".concat(t,";}"),"@supports (mix-blend-mode:color){.BlogIndexPost__link.__jsx-style-dynamic-selector .BlogIndexPost__link__image.__jsx-style-dynamic-selector::after,.BlogIndexPost__link.__jsx-style-dynamic-selector .BlogIndexPost__link__image.__jsx-style-dynamic-selector::after{mi
1x-blend-mode:soft-light;}.BlogIndexPost__link.__jsx-style-dynamic-selector:focus .BlogIndexPost__link__image.__jsx-style-dynamic-selector::after,.BlogIndexPost__link.__jsx-style-dynamic-selector:hover .BlogIndexPost__link__image.__jsx-style-dynamic-selector::after{background-color:".concat(new ne.a(e).lighten(.5),";}}")]})]})}}Object(i.a)(ge,"defaultProps",{imageStyle:{height:"230px"},showPublished:!1,titleFontSize:void 0});var _e=s("+juf"),me=s("VB9H");function he(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function je(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?he(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):he(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var be={paddingTop:"".concat(200/3,"%")},pe="(max-width: 800px)";class ye extends a.Component{constructor(){super(...arguments),Object(i.a)(this,"handleQueryChange",e=>{var{matches:t}=e;return this.setState({multiplier:t?1.7:1})}),Object(i.a)(this,"selectNext",()=>{this.hasNext&&this.setState({selectedIndex:this.state.selectedIndex+1})}),Object(i.a)(this,"selectPrev",()=>{this.hasPrev&&this.setState({selectedIndex:this.state.selectedIndex-1})}),Object(i.a)(this,"state",{multiplier:1,selectedIndex:NaN})}static getDerivedStateFromProps(e,t){return t.selectedIndex<e.posts.length?null:{selectedIndex:Math.floor((e.posts.length-1)/2)}}get hasNext(){return this.state.selectedIndex<this.props.posts.length-1}get hasPrev(){return 0!==this.state.selectedIndex}get transform(){var e=this.state.selectedIndex||0,{multiplier:t}=this.state,s="".concat(-40*e*t+(100-40*t)/2,"%"),a="".concat(-100*e-50,"px");return"translateX(".concat(s,") translateX(").concat(a,")")}componentDidMount(){this.matcher=matchMedia(pe),this.matcher.addListener(this.handleQueryChange),this.handleQueryChange(this.matcher)}componentWillUnmount(){this.matcher.removeListener(this.handleQueryChange)}renderPosts(e){var t=D.a.learn.category.getProps({category:e.category.slug});return Object(y.jsxs)("li",{className:l.a.dynamic([["4223023883",[m.g.GRAY_5,Object(m.h)(e.category.color),40,50,pe,68]]])+" BlogSeeMorePosts__item",children:[Object(y.jsxs)("div",{className:l.a.dynamic([["4223023883",[m.g.GRAY_5,Object(m.h)(e.category.color),40,50,pe,68]]])+" BlogSeeMorePosts__post",children:[Object(y.jsx)(ge,{category:e.category,fullView:!0,imageStyle:be,post:e,titleFontSize:25}),Object(y.jsxs)("p",{className:l.a.dynamic([["4223023883",[m.g.GRAY_5,Object(m.h)(e.category.color),40,50,pe,68]]])+" BlogSeeMorePosts__byline",children:[Object(y.jsx)(S.b,je(je({},t),{},{children:Object(y.jsx)("a",{className:l.a.dynamic([["4223023883",[m.g.GRAY_5,Object(m.h)(e.category.color),40,50,pe,68]]])+" BlogSeeMorePosts__category",children:e.category.name})})),Object(y.jsx)("span",{className:l.a.dynamic([["4223023883",[m.g.GRAY_5,Object(m.h)(e.category.color),40,50,pe,68]]])+" BlogSeeMorePosts__author",children:e.author&&e.author.name})]})]}),Object(y.jsx)(l.a,{id:"4223023883",dynamic:[m.g.GRAY_5,Object(m.h)(e.category.color),40,50,pe,68],children:[".BlogSeeMorePosts__author.__jsx-style-dynamic-selector{color:".concat(m.g.GRAY_5,";}"),".BlogSeeMorePosts__author.__jsx-style-dynamic-selector:not(:empty)::before{content:' \xb7 ';padding:0 5px;}","@media (max-width:500px){.BlogSeeMorePosts__author.__jsx-style-dynamic-selector:not(:empty)::before{content:'';display:block;padding:0;}}",".BlogSeeMorePosts__byline.__jsx-style-dynamic-selector{font-size:18px;font-weight:500;margin-top:10px;}",".BlogSeeMorePosts__category.__jsx-style-dynamic-selector{color:".concat(Object(m.h)(e.category.color),";-webkit-text-decoration:none;text-decoration:none;}"),".BlogSeeMorePosts__category.__jsx-style-dynamic-selector:focus,.BlogSeeMorePosts__category.__jsx-style-dynamic-selector:hover{-webkit-text-decoration:underline;text-decoration:underline;}",".BlogSeeMorePosts__item.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1 0 ".concat(40,"%;-ms-flex:1 0 ").concat(40,"%;flex:1 0 ").concat(40,"%;-webkit-box-pack:center;
1-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;line-height:1.4;margin:").concat(50,"px;}"),"@media ".concat(pe,"{.BlogSeeMorePosts__item.__jsx-style-dynamic-selector{-webkit-flex:1 0 ").concat(68,"%;-ms-flex:1 0 ").concat(68,"%;flex:1 0 ").concat(68,"%;}}"),".BlogSeeMorePosts__post.__jsx-style-dynamic-selector{-webkit-flex:0 1 540px;-ms-flex:0 1 540px;flex:0 1 540px;}"]})]},e.id)}render(){return Object(y.jsxs)("nav",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts",children:[Object(y.jsx)("h2",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__title",children:this.props.title}),Object(y.jsx)("ul",{style:{transform:this.transform},className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__list",children:this.props.posts.map(this.renderPosts,this)}),Object(y.jsxs)("div",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__buttons",children:[Object(y.jsx)(C.a,{children:"The above list is visually presented as a carousel. These next two buttons can be ignored if you are not using the site visually."}),Object(y.jsxs)("button",{"aria-label":"previous",disabled:!this.hasPrev,onClick:this.selectPrev,type:"button",className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button",children:[Object(y.jsx)("span",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button__stent--major"}),Object(y.jsx)("span",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button__symbol",children:Object(y.jsx)(_e.a,{role:"presentation"})}),Object(y.jsx)("span",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button__stent--minor"})]}),Object(y.jsx)("div",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__buttons__stent",children:Object(y.jsx)("div",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__buttons__stent__scaler"})}),Object(y.jsxs)("button",{"aria-label":"next",disabled:!this.hasNext,onClick:this.selectNext,type:"button",className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button",children:[Object(y.jsx)("span",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button__stent--minor"}),Object(y.jsx)("span",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button__symbol",children:Object(y.jsx)(me.a,{role:"presentation"})}),Object(y.jsx)("span",{className:l.a.dynamic([["3518970002",[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3]]])+" BlogSeeMorePosts__button__stent--major"})]})]}),Object(y.jsx)(l.a,{id:"3518970002",dynamic:[m.g.GRAY_4,30,pe,16,m.g.GRAY_6,m.g.GRAY_2,pe,m.g.GRAY_3,100,40,50,pe,68,100/.85,80/3,pe,136/3],children:[".BlogSeeMorePosts.__jsx-style-dynamic-selector{overflow:hidden;margin-top:100px;position:relative;width:100%;}",".BlogSeeMorePosts__button.__jsx-style-dynamic-selector{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:".concat(m.g.GRAY_4,";cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;font-size:35px;-webkit-flex:").concat(30," 1 auto;-ms-flex:").concat(30," 1 auto;flex:").concat(30," 1 auto;-webkit-box-pack:center;
1-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;pointer-events:auto;position:relative;-webkit-transition:color 150ms cubic-bezier(0,0,0,1);transition:color 150ms cubic-bezier(0,0,0,1);}"),"@media ".concat(pe,"{.BlogSeeMorePosts__button.__jsx-style-dynamic-selector{-webkit-box-flex:").concat(16,";-webkit-flex-grow:").concat(16,";-ms-flex-positive:").concat(16,";flex-grow:").concat(16,";}}"),".BlogSeeMorePosts__button.__jsx-style-dynamic-selector:focus,.BlogSeeMorePosts__button.__jsx-style-dynamic-selector:hover{color:".concat(m.g.GRAY_6,";outline:none;}"),".BlogSeeMorePosts__button.__jsx-style-dynamic-selector:disabled{color:".concat(m.g.GRAY_2,";}"),".BlogSeeMorePosts__button__stent--major.__jsx-style-dynamic-selector{-webkit-flex:20 1 0%;-ms-flex:20 1 0%;flex:20 1 0%;}",".BlogSeeMorePosts__button__stent--minor.__jsx-style-dynamic-selector{-webkit-flex:1 1 0%;-ms-flex:1 1 0%;flex:1 1 0%;}","@media ".concat(pe,"{.BlogSeeMorePosts__button__stent--minor.__jsx-style-dynamic-selector{-webkit-box-flex:10;-webkit-flex-grow:10;-ms-flex-positive:10;flex-grow:10;}}"),".BlogSeeMorePosts__button__symbol.__jsx-style-dynamic-selector{border:1px solid ".concat(m.g.GRAY_3,";border-radius:1em;height:1.2em;line-height:1.2;width:1.2em;}"),".BlogSeeMorePosts__buttons.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;left:0;pointer-events:none;position:absolute;top:".concat(100,"px;width:100%;}"),".BlogSeeMorePosts__buttons__stent.__jsx-style-dynamic-selector{-webkit-flex:".concat(40," 0 auto;-ms-flex:").concat(40," 0 auto;flex:").concat(40," 0 auto;height:100%;margin:0 ").concat(50,"px;max-height:360px;}"),"@media ".concat(pe,"{.BlogSeeMorePosts__buttons__stent.__jsx-style-dynamic-selector{-webkit-box-flex:").concat(68,";-webkit-flex-grow:").concat(68,";-ms-flex-positive:").concat(68,";flex-grow:").concat(68,";margin:0 ").concat(100/.85,"px;}}"),".BlogSeeMorePosts__buttons__stent__scaler.__jsx-style-dynamic-selector{padding-top:".concat(80/3,"vw;}"),"@media ".concat(pe,"{.BlogSeeMorePosts__buttons__stent__scaler.__jsx-style-dynamic-selector{padding-top:").concat(136/3,"vw;}}"),".BlogSeeMorePosts__list.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition:-webkit-transform ease 240ms;-webkit-transition:transform ease 240ms;transition:transform ease 240ms;}",".BlogSeeMorePosts__title.__jsx-style-dynamic-selector{font-size:40px;font-weight:500;text-align:center;}"]})]})}}var xe=s("06DG"),Le=s("K+NR"),Oe=s("WBWF"),ue=e=>{var{buttonColor:t}=e;return Object(y.jsxs)("div",{className:l.a.dynamic([["3730068547",[Oe.j,h.b.MOBILE_BREAKPOINT]]])+" BlogHubspotForm",children:[Object(y.jsx)(Le.a,{buttonColor:t,withPaddingAndMargin:!1,form:"5e469e58-cd1b-48c8-80e1-bc0e3b686ba1",hideCaptcha:!0}),Object(y.jsx)(l.a,{id:"3730068547",dynamic:[Oe.j,h.b.MOBILE_BREAKPOINT],children:[".BlogHubspotForm.__jsx-style-dynamic-selector{margin-top:".concat(Oe.j,"px !important;min-height:218px;text-align:left;}"),".BlogHubspotForm.__jsx-style-dynamic-selector .hs-richtext{font-size:15px;}","@media (max-width:".concat(h.b.MOBILE_BREAKPOINT,"px){.BlogHubspotForm.__jsx-style-dynamic-selector .hs-richtext{font-size:12px;}}"),".BlogHubspotForm.__jsx-style-dynamic-selector em{font-style:normal;font-variation-settings:normal;}"]})]})},Ee=s("/idF"),Re=s("FGnN"),Be=e=>{var{rounded:t=!1,size:s="large"}=e;return Object(y.jsxs)("div",{className:l.a.dynamic([["1673543850",[t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),"large"===s?"40px 0":"unset","small"==s?"40px":"0 40px"]]])+" BlogSubscribeForm",children:[Object(y.jsx)(C.a,{children:Object(y.jsx)("h2",{className:l.a.dynamic([["1673543850",[t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),"large"===s?"40px 0":"unset","small"==s?"40px":"0 40px"]]]),children:"Mailing list sign-up form"})}),Object(y.jsx)(V.a,{src:"/static/images/learn/Background.svg",children:Object(y.jsx)("div",{className:l.a.dynamic([["1673543850",[t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),"large"===s?"40px 0":"unset","small"==s?"40px":"0 40px"]]])+" BlogSubscribeFormContainer",children:Object(y.jsxs)(xe.a,{bodyAlign:"left",background:m.g.ROCK,contentMaxWidth:700,headlineMaxWidth:500,padded:"large"===s,textColor:"white",children:["small"===s?Object(y.jsx)(xe.a.Headline,{type:"medium",children:"We deliver!"}):Object(y.jsx)(xe.a.Headline,{type:"medium",children:"Sign up for Wistia\u2019s best & freshest content."}),Object(y.jsxs)(xe.a.Body,{children:["small"===s&&Object(y.jsx)(Ee.a,{className:"BlogSubscribeForm__subhed",children:"Sign up for email updates"}),Object(y.jsx)(ue,{buttonColor:"#44B62D"})]}),"large"===s&&Object(y.jsx)(xe.a.ButtonRow,{children:Object(y.jsxs)("p",{className:l.a.dynamic([["1673543850",[t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),"large"===s?"40px 0":"unset","small"==s?"40px":"0 40px"]]]),children:["More of a social being? We\u2019re also on"," ",Object(y.jsx)("a",{href:Re.t,className:l.a.dynamic([["1673543850",[t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),"large"===s?"40px 0":"unset","small"==s?"40px":"0 40px"]]]),children:"Instagram"})," and\xa0",Object(y.jsx)("a",{href:Re.z,className:l.a.dynamic([["1673543850",[t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),"large"===s?"40px 0":"unset","small"==s?"40px":"0 40px"]]]),children:"Twitter"}),"."]})})]})})}),Object(y.jsx)(l.a,{id:"1673543850",dynamic:[t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),"large"===s?"40px 0":"unset","small"==s?"40px":"0 40px"],children:[".BlogSubscribeForm.__jsx-style-dynamic-selector{".concat(t&&"\n border-radius: ".concat(h.b.BASE_RADIUS_PX,"px;\n overflow: hidden;\n "),";margin:").concat("large"===s?"40px 0":"unset",";}"),".BlogSubscribeForm.__jsx-style-dynamic-selector .BlogSubscribeForm__subhed{text-align:center;}",".BlogSubscribeFormContainer.__jsx-style-dynamic-selector{padding:".concat("small"==s?"40px":"0 40px",";}"),".BlogSubscribeFormContainer.__jsx-style-dynamic-selector .ButtonRow a{color:white;}",".BlogSubscribeFormContainer.__jsx-style-dynamic-selector .ButtonRow a:hover{color:white;}",".BlogSubscribeFormContainer.__jsx-style-dynamic-selector .ButtonRow a:visited{color:white;}"]})]})};Be.displayName="BlogSubscribeForm";var Ae=Be,Ye=()=>null,Pe=s("uLmN"),fe=s("f6lo"),we=s("In0M");function Ge(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function Ue(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};
1t%2?Ge(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):Ge(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var ke=Object.assign(e=>{var{breadcrumbs:t}=e,s=Object(j.a)(e,["breadcrumbs"]);return Object(y.jsxs)("div",Ue(Ue({},s),{},{className:l.a.dynamic([["125665860",[m.g.GRAY_3,m.g.GRAY_3]]])+" "+(s&&null!=s.className&&s.className||"PostBreadcrumbs"),children:[t.map(e=>{var{linkProps:t,text:s}=e;return Object(y.jsx)(we.a,{className:"PostBreadcrumb BlogPost__subhed",type:"supporting",verticalSpacing:0,children:t?Object(y.jsx)(S.b,Ue(Ue({},t),{},{children:Object(y.jsx)("a",{className:l.a.dynamic([["125665860",[m.g.GRAY_3,m.g.GRAY_3]]])+" PostBreadcrumb__link",children:s})})):s},t?t.as:s)}),Object(y.jsx)(l.a,{id:"125665860",dynamic:[m.g.GRAY_3,m.g.GRAY_3],children:[".PostBreadcrumbs.__jsx-style-dynamic-selector{-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex:1 0 0px;-ms-flex:1 0 0px;flex:1 0 0px;}",".PostBreadcrumbs.__jsx-style-dynamic-selector .PostBreadcrumb:not(:last-child)::after{color:".concat(m.g.GRAY_3,";content:'\xbb';margin:0 10px;}"),".PostBreadcrumbs.__jsx-style-dynamic-selector .PostBreadcrumb:not(:last-child){color:".concat(m.g.GRAY_3,";}"),".PostBreadcrumbs.__jsx-style-dynamic-selector .PostBreadcrumb.BlogPost__subhed .PostBreadcrumb__link{color:inherit;-webkit-text-decoration:none;text-decoration:none;}"]})]}))},{defaultProps:{breadcrumbs:[]},propTypes:{breadcrumbs:b.a.arrayOf(b.a.breadcrumb)}}),Ne=s("BRQW"),Te=s("Zgn2"),{COLOR_TEXT_HEADING:Ie}=g.a,ve=Object.assign(e=>{var{breadcrumbs:t,chapters:s,description:a,post:c,shareDescription:o,shareDropInText:n,shareTitle:i,style:r}=e,{author:d,title:g}=c;return Object(y.jsxs)("header",{style:r,className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader",children:[Object(y.jsxs)("div",{className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader__top",children:[Object(y.jsx)(ke,{breadcrumbs:t}),Object(y.jsxs)("div",{className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader__top__share",children:[Object(y.jsx)("span",{className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader__top__share__label",children:"Share:"}),Object(y.jsx)(Ne.a,{shareDescription:o,shareDropInText:n,shareTitle:i,twitterAuthor:c.twitterAuthor})]})]}),Object(y.jsxs)("div",{className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader__middle",children:[Object(y.jsx)("h1",{className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader__title",children:g}),Object(y.jsx)("div",{className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader__subtitle",children:a()})]}),Object(y.jsxs)("div",{className:l.a.dynamic([["4068982125",[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f]]])+" PostHeader__bottom",children:[Object(y.jsx)(q,{post:c}),s.length>0?Object(y.jsx)(fe.a,{chapters:s,chapterColor:Fe}):Object(y.jsx)(K,{authors:d})]}),Object(y.jsx)(l.a,{id:"4068982125",dynamic:[Te.n,m.g.GRAY_3,m.g.GRAY_3,Te.k,Ie,h.b.MOBILE_BREAKPOINT,Te.o,Te.b,h.b.MOBILE_BREAKPOINT,Te.f],children:[".PostHeader.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin:0 auto calc(1vw);max-width:100%;width:780px;}","@media (min-width:768px){.PostHeader.__jsx-style-dynamic-selector{padding:0 10px;}}",".PostHeader__top.__jsx-style-dynamic-selector{display:block;margin-bottom:1vw;}",".PostHeader__bottom.__jsx-style-dynamic-selector{display:block;margin:0 0 2vw;}",".PostHeader__bottom.__jsx-style-dynamic-selector .PostChapters--right{height:unset;margin-bottom:unset;}","@media (min-width:1200px){.PostHeader__top.__jsx-style-dynamic-selector,.PostHeader__bottom.__jsx-style-dynamic-selector{display:none;}}","@media (min-width:600px){.PostHeader__bottom.__jsx-style-dynamic-selector .PostChapters{display:none;}}",".PostHeader.__jsx-style-dynamic-selector .PostBreadcrumbs{float:left;display:block;}",".PostHeader__top__share.__jsx-style-dynamic-selector{float:right;}",".PostHeader__top__share__label.__jsx-style-dynamic-selector{".concat(Te.n,";color:").concat(m.g.GRAY_3,";display:inline-block;vertical-align:top;}"),"@media (max-width:600px){.PostHeader__top__share__label.__jsx-style-dynamic-selector{display:none;}}",".PostHeader.__jsx-style-dynamic-selector .ShareButtons{display:inline-block;margin-top:-15px;}",".PostHeader.__jsx-style-dynamic-selector ul.ShareButtons li a{border:none;}",".PostHeader.__jsx-style-dynamic-selector ul.ShareButtons li svg{color:".concat(m.g.GRAY_3,";}"),".PostHeader__title.__jsx-style-dynamic-selector{max-width:780px;".concat(Te.k,";color:").concat(Ie,";margin:0;}"),"@media (max-width:".concat(h.b.MOBILE_BREAKPOINT,"px){.PostHeader__title.__jsx-style-dynamic-selector{").concat(Te.o,";}}"),".PostHeader__subtitle.__jsx-style-dynamic-selector{margin:25px 0;}",".PostHeader__subtitle.__jsx-style-dynamic-selector p.markdown{".concat(Te.b,";}"),"@media (max-width:".concat(h.b.MOBILE_BREAKPOINT,"px){.PostHeader__subtitle.__jsx-style-dynamic-selector p.markdown{").concat(Te.f,";}}"),".PostHeader.__jsx-style-dynamic-selector .Authors{padding:15px 0 0;}"]})]})},{defaultProps:{chapters:[],description:void 0,style:{}},propTypes:{breadcrumbs:b.a.array.isRequired,chapters:b.a.array,description:b.a.oneOfType([b.a.func,b.a.bool]),post:b.a.blogPost.isRequired,style:b.a.object}}),Ke=s("G2/6");function Se(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function De(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};
1t%2?Se(Object(s),!0).forEach((function(t){Object(i.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):Se(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var{TEXT_LINE_HEIGHT_BASE_COPY_BODY:He,TEXT_VERTICAL_SPACING_COPY_BODY:Me}=g.a,We=new Date("2018-05-23T00:00:00Z"),Ce=new Map([["featured image","featuredImage"],["featured video","featuredVideo"],["featured video, no body","featuredVideoNoBody"]]),ze={fontStretch:"normal",textTransform:"capitalize"},Fe="#6B84FF";class qe extends a.Component{get body(){return this.hasBody?this.props.post.body:Ye}get contentStyle(){return Ce.get(this.props.post.contentStyle)}get hasBody(){return"featuredVideoNoBody"!==this.contentStyle}get isPastDescriptionCutoff(){return Boolean(this.props.post.publishDate&&We<this.props.post.publishDate)}get postAccentColor(){return this.props.post.isReport?Fe:Object(m.h)(this.props.post.category.color)}get postAccentBackgroundColor(){return String(new ne.a(this.postAccentColor).setAlpha(.15))}get postDescription(){var{description:e}=this.props.post;return!e||this.hasBody&&!this.isPastDescriptionCutoff?Ye:e}get shareDescription(){var{description:e,metaDescription:t,ogDescription:s}=this.props.post;return s||e&&e.toTextContent()||t}get shareDropInText(){return this.props.post.shareText||this.shareTitle}get shareTitle(){var{ogTitle:e,title:t}=this.props.post;return e||t}getBreadcrumbs(){return[{text:this.props.post.category.name,linkProps:D.a.learn.category.getProps({category:this.props.post.category.slug})}]}getPostHeaderStyles(){var e={};return this.postDescription||this.contentStyle||(e.marginBottom="0px"),e}renderFeaturedMedia(){if(this.contentStyle||this.isPastDescriptionCutoff)return Object(y.jsxs)("div",{className:l.a.dynamic([["722955464",[m.g.GRAY_2]]])+" FeaturedMedia",children:[this.renderFeaturedMediaElement(),Object(y.jsx)(l.a,{id:"722955464",dynamic:[m.g.GRAY_2],children:[".FeaturedMedia.__jsx-style-dynamic-selector{max-width:780px;margin:20px auto 40px;}",".FeaturedMedia.__jsx-style-dynamic-selector hr{height:1px;background:".concat(m.g.GRAY_2,";font-size:0;border:0;}")]})]})}renderFeaturedMediaElement(){var{post:e}=this.props;switch(this.contentStyle){case"featuredImage":if(e.heroImage){var t=e.heroImage.imgProps();return Object(y.jsx)("img",De({alt:"",style:{width:"100%"}},t))}console.error(new Error('post is "featuredImage" but post '.concat(e.id," has no image")));break;case"featuredVideo":case"featuredVideoNoBody":if(e.featuredVideoId){var s=e.featuredVideoEmbedOptions||{};return Object(y.jsx)(Ke.b,De(De({},s),{},{hashedId:e.featuredVideoId}))}console.error(new Error('post is "'.concat(this.contentStyle,'" but post ').concat(e.id," has no video")))}if(this.isPastDescriptionCutoff)return Object(y.jsx)("hr",{})}renderLeftColumn(){return Object(y.jsxs)("div",{className:"jsx-1788825090 BlogPost__left",children:[Object(y.jsx)(ke,{breadcrumbs:this.getBreadcrumbs(),style:ze}),Object(y.jsx)(q,{post:this.props.post,vertical:!0}),Object(y.jsx)(Ne.a,{shareDescription:this.shareDescription,shareDropInText:this.shareDropInText,shareTitle:this.shareTitle,twitterAuthor:this.props.post.twitterAuthor}),Object(y.jsx)(l.a,{id:"1788825090",children:[".BlogPost__left.jsx-1788825090{display:none;-webkit-order:-1;-ms-flex-order:-1;order:-1;}","@media (min-width:1200px){.BlogPost__left.jsx-1788825090{vertical-align:top;display:inline-block;width:220px;margin:15px 30px 0 10px;}.BlogPost__left.jsx-1788825090 .ShareButtons{margin-top:40px;}.BlogPost__left.jsx-1788825090 .ShareButtons li{display:block;margin-bottom:10px;}}"]})]})}renderRightColumn(){return Object(y.jsxs)("div",{className:l.a.dynamic([["166746553",[h.b.NAVBAR_HEIGHT]]])+" BlogPost__right",children:[this.props.post.isReport&&this.body.chapters?Object(y.jsx)("div",{className:l.a.dynamic([["166746553",[h.b.NAVBAR_HEIGHT]]])+" BlogPost__chapters",children:Object(y.jsx)(fe.a,{chapters:this.body.chapters,chapterColor:"#6B84FF"})}):Object(y.jsx)(K,{authors:this.props.post.author,postAccentColor:this.postAccentColor}
1),Object(y.jsx)(l.a,{id:"166746553",dynamic:[h.b.NAVBAR_HEIGHT],children:[".BlogPost__right.__jsx-style-dynamic-selector{display:none;}","@media (min-width:1200px){.BlogPost__right.__jsx-style-dynamic-selector{vertical-align:top;display:inline-block;width:225px;margin-left:40px;}.BlogPost__chapters.__jsx-style-dynamic-selector{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start;position:-webkit-sticky;position:sticky;top:".concat(h.b.NAVBAR_HEIGHT,"px;}}")]})]})}render(){return Object(y.jsxs)(y.Fragment,{children:[Object(y.jsxs)("div",{className:l.a.dynamic([["2668219028",[this.postAccentColor,He,h.b.COMMON_CONTENT_WIDTH,this.postAccentColor,this.postAccentBackgroundColor,He,m.g.GRAY_7,this.postAccentColor,this.postAccentColor,h.b.BASE_PX,this.postAccentColor,Te.n,m.g.GRAY_6,Te.c,m.g.GRAY_6,Te.e,m.g.GRAY_4,h.b.MOBILE_BREAKPOINT,Te.q,Te.r,Te.g,Te.i,this.postAccentColor,this.postAccentColor,Me,m.g.GRAY_4,h.b.COMMON_CONTENT_WIDTH,this.postAccentColor,this.postAccentColor,this.postAccentColor,h.b.COMMON_CONTENT_WIDTH,m.g.GRAY_4,h.b.BASE_PX,this.postAccentColor]]])+" BlogPost",children:[Object(y.jsx)("div",{className:l.a.dynamic([["2668219028",[this.postAccentColor,He,h.b.COMMON_CONTENT_WIDTH,this.postAccentColor,this.postAccentBackgroundColor,He,m.g.GRAY_7,this.postAccentColor,this.postAccentColor,h.b.BASE_PX,this.postAccentColor,Te.n,m.g.GRAY_6,Te.c,m.g.GRAY_6,Te.e,m.g.GRAY_4,h.b.MOBILE_BREAKPOINT,Te.q,Te.r,Te.g,Te.i,this.postAccentColor,this.postAccentColor,Me,m.g.GRAY_4,h.b.COMMON_CONTENT_WIDTH,this.postAccentColor,this.postAccentColor,this.postAccentColor,h.b.COMMON_CONTENT_WIDTH,m.g.GRAY_4,h.b.BASE_PX,this.postAccentColor]]])+" BlogPost__center",children:Object(y.jsxs)(Pe.b,{body:this.body,postAccentColor:this.postAccentColor,authors:this.props.post.author,disableGrid:!0,children:[Object(y.jsx)(ve,{breadcrumbs:this.getBreadcrumbs(),description:this.postDescription,post:this.props.post,shareDescription:this.shareDescription,shareDropInText:this.shareDropInText,shareTitle:this.shareTitle,style:this.getPostHeaderStyles(),chapters:this.props.post.isReport?this.body.chapters:[]}),this.renderFeaturedMedia()]})}),this.renderLeftColumn(),this.renderRightColumn(),Object(y.jsx)(l.a,{id:"2668219028",dynamic:[this.postAccentColor,He,h.b.COMMON_CONTENT_WIDTH,this.postAccentColor,this.postAccentBackgroundColor,He,m.g.GRAY_7,this.postAccentColor,this.postAccentColor,h.b.BASE_PX,this.postAccentColor,Te.n,m.g.GRAY_6,Te.c,m.g.GRAY_6,Te.e,m.g.GRAY_4,h.b.MOBILE_BREAKPOINT,Te.q,Te.r,Te.g,Te.i,this.postAccentColor,this.postAccentColor,Me,m.g.GRAY_4,h.b.COMMON_CONTENT_WIDTH,this.postAccentColor,this.postAccentColor,this.postAccentColor,h.b.COMMON_CONTENT_WIDTH,m.g.GRAY_4,h.b.BASE_PX,this.postAccentColor],children:[".BlogPost.__jsx-style-dynamic-selector{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;margin-top:calc(3vw + 30px);max-width:1400px;padding:0 20px;width:100%;}","@media (min-width:1200px) and (max-width:1399px){.BlogPost__center.__jsx-style-dynamic-selector{max-width:680px;}}","@media (min-width:1200px){.BlogPost.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row no-wrap;-ms-flex-flow:row no-wrap;flex-flow:row no-wrap;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:100%;padding:0;}.BlogPost__center.__jsx-style-dynamic-selector{display:inline-block;}}",".BlogPost.__jsx-style-dynamic-selector .BlogPost__subhed{color:".concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector .PostBody__inner{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;line-height:".concat(He,";margin:0 auto;max-width:100%;width:").concat(h.b.COMMON_CONTENT_WIDTH,";}"),".BlogPost.__jsx-style-dynamic-selector .PostBody__inner > section:first-of-type > p:first-of-type::first-letter{color:".concat(this.postAccentColor,";float:left;font-size:65px;font-weight:700;line-height:0.7;margin-top:0.12em;padding-right:10px;}"),".BlogPost.__jsx-style-dynamic-selector .PostBody__inner ::selection{background:".concat(this.postAccentBackgroun
1dColor,";}"),".BlogPost.__jsx-style-dynamic-selector .PostBody__wrap-inner{margin-top:20px;}",".BlogPost.__jsx-style-dynamic-selector p.markdown{line-height:".concat(He,";}"),".BlogPost.__jsx-style-dynamic-selector .PostBody__inner a{color:".concat(m.g.GRAY_7,";}"),".BlogPost.__jsx-style-dynamic-selector .PostBody__inner a:hover,.BlogPost.__jsx-style-dynamic-selector .PostBody__inner a.markdown:hover{color:".concat(this.postAccentColor,";border-color:").concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector .PostBody__inner > section:first-of-type > h2:first-of-type{margin-top:".concat(h.b.BASE_PX,"px;}"),".BlogPost.__jsx-style-dynamic-selector h3.markdown{color:".concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector h4.markdown{".concat(Te.n,";}"),".BlogPost.__jsx-style-dynamic-selector h2.markdown a:before,.BlogPost.__jsx-style-dynamic-selector h3.markdown a:before,.BlogPost.__jsx-style-dynamic-selector h4.markdown a:before,.BlogPost.__jsx-style-dynamic-selector h5.markdown a:before,.BlogPost.__jsx-style-dynamic-selector h6.markdown a:before{display:none;}",".BlogPost.__jsx-style-dynamic-selector h4.markdown{color:".concat(m.g.GRAY_6,";}"),".BlogPost.__jsx-style-dynamic-selector h5.markdown{".concat(Te.c,";color:").concat(m.g.GRAY_6,";font-weight:bold;}"),".BlogPost.__jsx-style-dynamic-selector h6.markdown{".concat(Te.e," color:").concat(m.g.GRAY_4,";font-weight:bold;}"),"@media (max-width:".concat(h.b.MOBILE_BREAKPOINT,"px){.BlogPost.__jsx-style-dynamic-selector h3.markdown{").concat(Te.q,";}.BlogPost.__jsx-style-dynamic-selector h4.markdown{").concat(Te.r,";}.BlogPost.__jsx-style-dynamic-selector h5.markdown{").concat(Te.g,";}.BlogPost.__jsx-style-dynamic-selector h6.markdown{").concat(Te.i,";}}"),".BlogPost.__jsx-style-dynamic-selector .TableOfContents--Title{color:".concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector .TableOfContentsItem a:hover{color:".concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector .TableOfContentsItem a:hover::after{content:'\u2192';margin-left:2px;}",".BlogPost.__jsx-style-dynamic-selector .PullQuote{margin-bottom:".concat(Me,"px;}"),".BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--small{color:".concat(m.g.GRAY_4,";margin-right:20px;max-width:").concat(h.b.COMMON_CONTENT_WIDTH,";}"),"@media (min-width:768px){.BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--small{margin:0 40px 0 60px;}}",".BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--small .PullQuoteCiteImage{width:55px;}",".BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--small .PullQuoteCiteImage img{height:55px;}",".BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--small .PullQuoteCite__content{color:".concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--small .PullQuoteCite__content a{color:".concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector blockquote.markdown p.markdown{margin:0;}",".BlogPost.__jsx-style-dynamic-selector blockquote.markdown,.BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--medium,.BlogPost.__jsx-style-dynamic-selector blockquote.PullQuote--large{color:".concat(this.postAccentColor,";max-width:").concat(h.b.COMMON_CONTENT_WIDTH,";}"),".BlogPost.__jsx-style-dynamic-selector .PullQuoteCite{color:".concat(m.g.GRAY_4,";margin-top:").concat(h.b.BASE_PX,"px;}"),".BlogPost.__jsx-style-dynamic-selector .PullQuoteCite img{margin:0;}",".BlogPost.__jsx-style-dynamic-selector ol.markdown,.BlogPost.__jsx-style-dynamic-selector ul.markdown{list-style:none;padding-left:5px;}",".BlogPost.__jsx-style-dynamic-selector li.markdown{padding-left:30px;}",".BlogPost.__jsx-style-dynamic-selector ol.markdown > li:before,.BlogPost.__jsx-style-dynamic-selector ul.markdown > li:before{color:".concat(this.postAccentColor,";}"),".BlogPost.__jsx-style-dynamic-selector ol.markdown > li{counter-increment:step-counter;}",".BlogPost.__jsx-style-dynamic-selector ol.markdown > li::before{content:counter(step-counter);font-weight:500;font-feature-settings:'tnum';margin:0 15px 0 -30px;}",".BlogPost.__jsx-style-dynamic-selector ol.markdown ol.markdown{list-style-type:lower-alpha;padding-left:25px;}",".BlogPost.__jsx-style-dynamic-selector ol.markdown ol.markdown > li{padding-left:15px;}",".BlogPost.__jsx-style-dynamic-selector ol.markdown ol.markdown > li::before{content:'';margin:0;}",".BlogPost.__jsx-style-dynamic-selector ul.markdown{list-style:none;}",".BlogPost.__jsx-style-dynamic-selector ul.markdown > li:before{content:'\u2022';font-size:26px;margin:0 15px 0 -25px;}",".BlogPost.__jsx-style-dynamic-selector .PostBody__inner .twitter-tweet{margin-left:auto;margin-right:auto;}",".BlogPost.__jsx-style-dynamic-selector .PostBody__inner .YouTubeVideo{display:block;margin:2em auto;max-width:100%;}",".BlogPost.__jsx-style-dynamic-selector .PostBody__inner .FacebookVideo{display:block;margin:2em auto;}",".BlogPost.__jsx-style-dynamic-selector .PostBody__inner .InstagramPost{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;
1-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;margin:2em 0;}"]})]}),Object(y.jsx)(ye,{posts:this.props.morePosts,title:"Keep Learning"}),Object(y.jsx)(Ae,{})]})}}var Ve=s("h0Ju"),Xe=s("owqX"),Qe=s("2Iua"),Ze=s("yIwa"),Je=s("vlBq"),$e=s("xkk4"),et=s("UeB6"),tt=s("twgL"),st=s("vCLs"),at="https://images.ctfassets.net/j7pfe8y48ry3/9UwVFsCMF26W8IIawa6Cc/bee6a3772f9ce4ee8af9f549bf879664/MV5BNzQ2M2IxMjYtZDdlNS00OWZlLWIyMDctZWM4OGRhZTU1NjNhL2ltYWdlXkEyXkFqcGdeQXVyMjI3ODYyNDU_._V1_.jpg",ct=()=>Object(y.jsxs)("div",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" MarkdownTest__dialog__interior MarkdownTestComponents",children:[Object(y.jsx)("h1",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"COMPONENTS"}),Object(y.jsx)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Storefront doesn\u2019t extend Markdown syntactically, but it does provide ways to use components by overloading Markdown\u2019s existing HTML syntax. Some \u201celements\u201d are really mapped to components."}),Object(y.jsx)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Components can be referenced like regular HTML tags. The can usually be configured by adding special attributes. The tag and attribute names are case insensitive, but the closing tags are never optional."}),Object(y.jsx)("h1",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"EMBEDDED MEDIA"}),Object(y.jsx)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Media embeds are usually used with a single attribute, but note that some of these take a URL and some take an ID."}),Object(y.jsxs)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"facebookvideo"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"videourl"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"https://facebook.com/x"}),'"></',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"facebookvideo"}),">","\n","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"instragrampost"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"url"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"https://intagram.com/x"}),'"></',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"instragrampost"}),">","\n","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"soundcloudtrack"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"trackid"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"abcdefg"}),'"></',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"soundcloudtrack"}),">","\n","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"twittercard"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"tweetid"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"abcdefg"}),'"></',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"twittercard"}),">","\n","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"wistiavideo"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"hashedid"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"abcdefg"}),'"></',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"wistiavideo"}),">","\n","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"youtubevideo"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"videoid"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"abcdefg"}),'"></',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"youtubevideo"}),">","\n"]}),Object(y.jsx)("h2",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"WISTIA VIDEO"}),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"<wistiavideo>"})," is, naturally, the embed component used most frequently. The usual player options are supported, but you specify them as HTML attributes:"]}),Object(y.jsxs)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"wistiavideo"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"hashedid"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"abcdefg"}),'" ',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"muted"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"true"}),'"'," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"playercolor"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"#FF3300"}),'">',"\n","</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"wistiavideo"}),">","\n"]}),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["Normally a ",Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"<wistiavideo>"})," is a block element, but popovers are special \u2014 they will be inline, and the text inside the element will be the popover link."]}),Object(y.jsxs)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"wistiavideo"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"hashedid"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"abcdefg"}),'" ',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"popover"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"true"}),'">',"\n ","My popover text!","\n","</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"wistiavideo"}),">","\n"]}),Object(y.jsx)("h1",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"PRESENTATION COMPONENTS"}
1),Object(y.jsx)("h2",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"PULLQUOTES"}),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["While markdown provides syntax for blockquotes, we have a distinct component for ",Object(y.jsx)("em",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"pullquotes"})," that present quotations as big text meant to help break up longer articles with visual milestones."]}),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["The exact styles assigned to a ",Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"<pullquote>"})," will vary depending on what context it is used in. In blog posts, it will be outset and brightly colored."]}),Object(y.jsxs)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"pullquote"}),">","\n ","Until the next time boils and ghouls \u2014 pleasant screams.","\n ","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"pullquotecite"}),">The Cryptkeeper</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"pullquotecite"}),">","\n","</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"pullquote"}),">"]}),Object(y.jsxs)(st.a,{children:["\u201cUntil the next time boils and ghouls \u2014 pleasant screams.\u201d",Object(y.jsx)(st.a.Cite,{children:"The Cryptkeeper"})]}),Object(y.jsx)("h2",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"CALLOUT"}),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"<callout>"})," is used in both support docs and blog posts to interject tips and alerts or provide some kind of \u201cmeta\u201d comment or instruction."]}),Object(y.jsxs)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"callout"})," ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"type"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"protip"}),'">',"\n ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"*"}),"All",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"*"})," that we see or seem is but a dream within a dream.","\n","</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"callout"}),">"]}),Object(y.jsxs)(Je.a,{type:"protip",children:[Object(y.jsx)("em",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"All"})," that we see or seem is but a dream within a dream."]}),Object(y.jsxs)("table",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("thead",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Type Value"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Label"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Icon"})]})}),Object(y.jsxs)("tbody",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"actionitem"})}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Action Item"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)(et.a,{})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"alert"})}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Alert"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)($e.a,{})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"getinspired"})}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Get Inspired"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)($e.a,{})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"glitch"})}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Glitch"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)(tt.a,{})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"note"})}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Note"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)(et.a,{})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"protip"})}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Pro-Tip"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)($e.a,{})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"tip"})}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Tip"}),Object(y.jsx)("td",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:Object(y.jsx)($e.a,{})})]})]})]}),Object(y.jsx)("h2",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"BROWSERFRAME"}),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"<browserframe>"})," is typically used to present screenshots in a stylized way (it shouldn\u2019t look ",Object(y.jsx)("em",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"too much"})," like a real window), but it could contain anything. The icons shown will match the visitor\u2019s own operating system to avoid alienating people by accident (\u201coh, this product is for ",Object(y.jsx)("em",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"Mac"})," people\u201d)."]}),Object(y.jsxs)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"browserframe"}),">","\n ","","\n","</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"browserframe"}),">"]}),Object(y.jsxs)("div",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" MarkdownTestComponents__split",children:[Object(y.jsx)(Ze.a,{forceWindowStyle:"osx",children:Object(y.jsx)("img",{alt:"Elvira meets a demonic lizard",src:at,className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])})}),Object(y.jsx)(Ze.a,{forceWindowStyle:"windows",children:Object(y.jsx)("img",{alt:"Elvira meets a demonic lizard",src:at,className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])})})]}),Object(y.jsx)("h2",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"BAND"}
1),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["There are many more components, but here we\u2019re just providing a cheatsheet for the ones that show up frequently in \u201carticle\u201d content like blog posts and support docs. However, as an example, here\u2019s one of those \u201cspecial pages\u201d components, ",Object(y.jsx)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"<band>"}),". Components like these are the building blocks of views like product pages: they\u2019re focused on modularizing typographic and layout patterns and tend to have more parts."]}),Object(y.jsxs)("code",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:["<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"band"}),"\n ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"arrow"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"true"}),'"',"\n ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"backgroundColor"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"COLORS.GRAY_5"}),'"',"\n ",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" key",children:"textColor"}),'="',Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" val",children:"COLORS.YELLOW"}),'">',"\n ","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandbreadcrumbs"}),">","\n ","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandbreadcrumb"}),">Darkness</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandbreadcrumb"}),">","\n ","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandbreadcrumb"}),">Its Mistresses</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandbreadcrumb"}),">","\n ","</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandbreadcrumbs"}),">","\n ","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandtitle"}),">Elvira</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandtitle"}),">","\n ","<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"bandbody"}),">\u201cUntil next time... unpleasant dreams!\u201d<",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"/bandbody"}),">","\n","</",Object(y.jsx)("span",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]])+" tag",children:"band"}),">"]}),Object(y.jsxs)(xe.a,{arrow:!0,backgroundColor:m.g.GRAY_5,textColor:m.g.YELLOW,children:[Object(y.jsxs)(xe.a.Breadcrumbs,{children:[Object(y.jsx)(xe.a.Breadcrumb,{children:"Darkness"}),Object(y.jsx)(xe.a.Breadcrumb,{children:"Its Mistresses"})]}),Object(y.jsx)(xe.a.Title,{children:"Elvira"}),Object(y.jsx)(xe.a.Body,{children:"\u201cUntil next time... unpleasant dreams!\u201d"})]}),Object(y.jsx)("h2",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"MORE"}),Object(y.jsxs)("p",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:[Object(y.jsx)("a",{href:"https://github.com/wistia/storefront/wiki/Contentful-Markdown---Components-for-Storefront",className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"The Storefront wiki"})," has much more detail than this cheatsheet. You will also find more extensive demos of some components in"," ",Object(y.jsx)(S.b,{href:"/storybook",children:Object(y.jsx)("a",{className:l.a.dynamic([["612781473",[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE]]]),children:"storybook"})}),"."]}),Object(y.jsx)(l.a,{id:"612781473",dynamic:[m.g.BLUE,m.g.PURPLE_DARK,m.g.BLUE_LIGHT,m.g.SKY_BLUE],children:[".MarkdownTestComponents.__jsx-style-dynamic-selector .PullQuote{color:".concat(m.g.BLUE,";}"),".MarkdownTestComponents__split.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;
1-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}",".MarkdownTestComponents__split.__jsx-style-dynamic-selector > *{-webkit-flex:0 1 48%;-ms-flex:0 1 48%;flex:0 1 48%;}",".key.__jsx-style-dynamic-selector{color:".concat(m.g.PURPLE_DARK,";}"),".tag.__jsx-style-dynamic-selector{color:".concat(m.g.BLUE_LIGHT,";}"),".val.__jsx-style-dynamic-selector{color:".concat(m.g.SKY_BLUE,";font-weight:400;}")]})]}),ot=e=>{var t=new Map;for(var s of e)t.has(s)?t.set(s,t.get(s)+1):t.set(s,1);return Array.from(t,e=>{var[t,s]=e;return 1===s?t:"".concat(t," (").concat(s,"\xd7)")})},nt=e=>Object(y.jsxs)("li",{className:"jsx-3727955855 MarkdownTestErrors__message",children:[e,Object(y.jsx)(l.a,{id:"3727955855",children:[".MarkdownTestErrors__message.jsx-3727955855{display:list-item;list-style-type:disc;margin-left:1em;padding:1ex 0;}"]})]},e),it=e=>{var{errors:t}=e;return Object(y.jsxs)("div",{hidden:0===t.length,role:"alert",className:l.a.dynamic([["1568427694",[m.g.PINK_LIGHT]]])+" MarkdownTestErrors",children:[Object(y.jsx)("ul",{className:l.a.dynamic([["1568427694",[m.g.PINK_LIGHT]]]),children:ot(t).map(nt)}),Object(y.jsx)(l.a,{id:"1568427694",dynamic:[m.g.PINK_LIGHT],children:[".MarkdownTestErrors.__jsx-style-dynamic-selector{background-color:".concat(m.g.PINK_LIGHT,";border-radius:5px;bottom:15px;font-size:16px;opacity:0.95;padding:20px;position:absolute;right:15px;width:400px;}")]})]})},rt=e=>{var{name:t}=e;return Object(y.jsxs)("td",{className:l.a.dynamic([["2321146475",[m.g[t]]]]),children:[Object(y.jsxs)("code",{className:l.a.dynamic([["2321146475",[m.g[t]]]])+" ColorCell",children:["COLORS.",t]}),Object(y.jsx)(l.a,{id:"2321146475",dynamic:[m.g[t]],children:[".ColorCell.__jsx-style-dynamic-selector::before{background-color:".concat(m.g[t],";content:'';display:inline-block;height:0.8em;margin-right:1ex;width:0.8em;}")]})]})},lt=()=>Object(y.jsxs)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTest__dialog__interior",children:[Object(y.jsx)("h1",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"MARKDOWN"}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["Markdown is a shorthand system for text editing that\u2019s usually easier for people to work with than HTML when authoring documents. It also permits most HTML to be embedded in it, so you do have an escape hatch for special cases. There are two categories of markdown syntax items, ",Object(y.jsx)("b",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"block"})," and"," ",Object(y.jsx)("b",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"inline."})," I\u2019ll explain why the distinction matters below."]}),Object(y.jsx)("h2",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"INLINE MARKDOWN"}),Object(y.jsxs)("table",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("thead",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Effect"}),Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Syntax"})]})}),Object(y.jsxs)("tbody",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Bold (strong)"}),Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"__double underscores__"})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Italic (emphasis)"}),Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"*single asterisks*"})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Hyperlink"}),Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"[link text](https://url.com)"})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Image"}),Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:""})})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Inline code sample"}),Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"`in backticks`"})})]})]})]}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["Regarding images, when we use the rich editor in Contentful, by default we get strange gibberish or no text at all for the description."," ",Object(y.jsx)("strong",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Please do edit these descriptions!"})," When the description is gibberish or missing, the site is not as accessible as it could be. Audio assistive tech will read that text to visitors \u2014 and it may al
1so influence SEO in some cases."]}),Object(y.jsx)("h2",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"BLOCK MARKDOWN"}),Object(y.jsx)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Block markdown items normally need to have empty lines before and after, as indicated by the pilcrow signs (\xb6) below."}),Object(y.jsxs)("table",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("thead",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Effect"}),Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Syntax"})]})}),Object(y.jsxs)("tbody",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Heading (first)"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}),Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"## Heading text"}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Heading (second, etc)"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}),Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"### Heading text"}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Paragraph"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}),Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Paragraph text"}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Bulleted list"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}),Object(y.jsxs)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["- First item","\n","- Second item","\n","- Etc"]}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Numbered list"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}),Object(y.jsxs)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["1. First item","\n","2. Second item","\n","3. Etc"]}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Blockquote"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}
1),Object(y.jsxs)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["> Text\u2026","\n","> which may continue like this"]}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Horizontal rule"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}),Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"---"}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Highlighted code sample"}),Object(y.jsxs)("td",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"}),Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"```languageName\ncode();\n```"}),Object(y.jsx)("div",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]])+" MarkdownTestSyntax__lb",children:"\xb6"})]})]})]})]}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["Headings start from ",Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"##"})," (h2) because the page will always provide the top-level h1 heading."]}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["For code blocks, the ",Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"languageName"})," part is optional. It is what enables syntax highlighting. An enormous range of languages is supported and most common abbreviations will be recognized, so whatever seems intuitive will probably be valid. For example ",Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"js"})," and",Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"javascript"})," are both recognized."]}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["The important distinction between ",Object(y.jsx)("strong",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"inline"})," and"," ",Object(y.jsx)("strong",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"block"})," Markdown is that the latter is recognized \u201cinside\u201d HTML and the latter is not."]}),Object(y.jsx)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"For example, let\u2019s say you want to add a pink HTML container but put a list inside. Because \u201clist\u201d is a \u201cblock,\u201d you\u2019ll need to use regular HTML to describe the list, too:"}),Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:'<div style="background:COLORS.PINK;">\n <ul>\n <li>foo</li>\n <li>bar</li>\n </ul>\n</div>'}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["In contrast, ",Object(y.jsx)("strong",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"inline"})," Markdown will still work:"]}),Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:'<div style="background:COLORS.PINK;">\n [a link](https://a.url.com)\n</div>'}),Object(y.jsx)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"There are some other things that are supported, like tables, but these come up less often so I\u2019ve omitted them from this overview. Let us know if you need help though!"}),Object(y.jsx)("h2",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"EMBEDDED HTML"}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["HTML is permitted (aside from scripting content). There are two forms this will typically take. Either it will be \u201cvanilla\u201d HTML as in the above example, likely paired with some one-off inline styles, or it will be a reference to a special ",Object(y.jsx)("strong",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"Storefront component"})," like the ubiquitous ",Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"<WistiaVideo>"})," that lets you use Wistia player embeds."]}),Object(y.jsx)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"When adding custom styles, it\u2019s just a regular HTML style attribute except that you can reference the Wistia brand color variables:"}),Object(y.jsx)("table",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:Object(y.jsxs)("tbody",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)(rt,{name:"PINK_LIGHT"}),Object(y.jsx)(rt,{name:"PINK"}),Object(y.jsx)(rt,{name:"PINK_DARK"})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)(rt,{name:"YELLOW_LIGHT"}),Object(y.jsx)(rt,{name:"YELLOW"}),Object(y.jsx)(rt,{name:"YELLOW_DARK"})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)(rt,{name:"GREEN_LIGHT"}),Object(y.jsx)(rt,{name:"GREEN"}),Object(y.jsx)(rt,{name:"GREEN_DARK"})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)(rt,{name:"SKY_BLUE_LIGHT"}),Object(y.jsx)(rt,{name:"SKY_BLUE"}),Object(y.jsx)(rt,{name:"SKY_BLUE_DARK"})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)(rt,{name:"BLUE_LIGHT"}),Object(y.jsx)(rt,{name:"BLUE"}),Object(y.jsx)(rt,{name:"BLUE_DARK"})]}),Object(y.jsxs)("tr",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:[Object(y.jsx)(rt,{name:"PU
1RPLE_LIGHT"}),Object(y.jsx)(rt,{name:"PURPLE"}),Object(y.jsx)(rt,{name:"PURPLE_DARK"})]})]})}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["Shades of gray from ",Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"COLORS.GRAY_0"})," (lightest) to"," ",Object(y.jsx)("code",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"COLORS.GRAY_7"})," (darkest) also exist."]}),Object(y.jsxs)("p",{className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:["For the custom Storefront components, check out the third help section above."," ",Object(y.jsx)("span",{"aria-label":"Arrow up",role:"img",className:l.a.dynamic([["569427145",[m.g.GRAY_4]]]),children:"\u2934\ufe0f"})]}),Object(y.jsx)(l.a,{id:"569427145",dynamic:[m.g.GRAY_4],children:[".MarkdownTestSyntax__lb.__jsx-style-dynamic-selector{color:".concat(m.g.GRAY_4,";font-size:0.8em;}")]})]}),dt=()=>Object(y.jsxs)("div",{className:"MarkdownTest__dialog__interior",children:[Object(y.jsx)("h1",{children:"TYPOGRAPHY"}),Object(y.jsxs)("table",{children:[Object(y.jsx)("thead",{children:Object(y.jsxs)("tr",{children:[Object(y.jsx)("td",{children:"What"}),Object(y.jsx)("td",{children:"Why"}),Object(y.jsx)("td",{children:"How"})]})}),Object(y.jsxs)("tbody",{children:[Object(y.jsxs)("tr",{children:[Object(y.jsx)("td",{children:"Apostrophe (\u2019)"}),Object(y.jsx)("td",{children:"Part of the spelling of some words"}),Object(y.jsx)("td",{children:Object(y.jsx)("kbd",{children:"OPTION + ] + SHIFT"})})]}),Object(y.jsxs)("tr",{children:[Object(y.jsx)("td",{children:"Left quotation mark (\u201c)"}),Object(y.jsx)("td",{children:"Starts a quotation"}),Object(y.jsx)("td",{children:Object(y.jsx)("kbd",{children:"OPTION + ["})})]}),Object(y.jsxs)("tr",{children:[Object(y.jsx)("td",{children:"Right quotation mark (\u201d)"}),Object(y.jsx)("td",{children:"Ends a quotation"}),Object(y.jsx)("td",{children:Object(y.jsx)("kbd",{children:"OPTION + [ + SHIFT"})})]}),Object(y.jsxs)("tr",{children:[Object(y.jsx)("td",{children:"Em dash (\u2013)"}),Object(y.jsx)("td",{children:"Separates clauses \u2014 like this!"}),Object(y.jsx)("td",{children:Object(y.jsx)("kbd",{children:"OPTION + - + SHIFT"})})]}),Object(y.jsxs)("tr",{children:[Object(y.jsx)("td",{children:"En dash (\u2013)"}),Object(y.jsx)("td",{children:"Separates ranges, like \u201c2\u20134\u201d"}),Object(y.jsx)("td",{children:Object(y.jsx)("kbd",{children:"OPTION + -"})})]}),Object(y.jsxs)("tr",{children:[Object(y.jsx)("td",{children:"Hyphen (-)"}),Object(y.jsx)("td",{children:"Part of the spelling of some words"}),Object(y.jsx)("td",{children:Object(y.jsx)("kbd",{children:"-"})})]})]})]}),Object(y.jsx)("p",{children:"In Walsheim, the quotation mark and apostrophe characters are especially distinct from the straight \u201ctypewriter quotes.\u201d"}),Object(y.jsx)("p",{children:"A bit of history: typewriters had to be frugal about the total number of keys and glyphs included. Prime marks, ditto marks, and quotation marks had to share ambiguous symbols; likewise, even \u201c1\u201d (numeral) and \u201cl\u201d (lowercase L) shared a single glyph on early typewriters \u2014 as my grandmother\u2019s enduringly strange typing habits attested. The deliberately ambiguous prime/quote/apostrophe symbols persisted into the age of desktop publishing both because they had become essential to programming and because they were familiar to typists."}),Object(y.jsx)("p",{children:'You would probably not type \u201che11o\u201d like my grandmother, but you might type \u201c"hi"\u201d like her. I would encourage giving the real characters a spin! It becomes muscle memory quickly. However, it\u2019s okay if you can\u2019t get used to it \u2014 in most cases, Storefront is able to automatically correct typography issues.'}),Object(y.jsx)("h2",{children:"OTHER NOTES"}),Object(y.jsxs)("p",{children:["When punctuation abuts a hyperlink, the punctuation is not part of that link. But when punctuation abuts a word that is bold or italicized, in the majority of cases that punctuation should be within the italic or"," ",Object(y.jsx)("strong",{children:"bold segment."}
1)," (Note the period is bold.)"]})]}),gt=s("vrKs"),_t=s("q0QS"),mt=s("xyFx"),ht=new ne.a(m.g.YELLOW_LIGHT).lighten(.5),jt=new ne.a(m.g.BLUE_DARK).setAlpha(.15),bt=new ne.a(m.g.GRAY_6).setAlpha(.05),pt=e=>{var{children:t}=e;return Object(y.jsxs)("div",{className:"jsx-3405837518",children:[t,Object(y.jsx)(l.a,{id:"3405837518",children:[".jsx-3405837518{height:100%;margin-left:calc(100% / 3 * 2);max-width:calc(100% / 3);}"]})]})};class yt extends a.Component{constructor(e){super(e),Object(i.a)(this,"cancelEditing",()=>{this.editor.close(),document.forms.editor.elements.markdown.value=this.state.markdown}),Object(i.a)(this,"checkMaskSize",()=>{var{previewElement:e}=this,t=e.querySelector("section.markdown:first-of-type"),s=e.querySelector("section.markdown:last-of-type");if(e&&t&&s){var a=t.getBoundingClientRect(),c=s.getBoundingClientRect(),o=e.getBoundingClientRect(),{scrollTop:n}=e,i=e.scrollHeight,r=a.left,l=o.width-a.right,d=a.top-o.top+n,g=i-n-(c.bottom-o.top);if(this.state.maskBottom!==g||this.state.maskLeft!==r||this.state.maskRight!==l||this.state.maskTop!==d||this.state.previewHeight!==i)return void this.setState({maskBottom:g,maskLeft:r,maskRight:l,maskTop:d,previewHeight:i},()=>this.raf=requestAnimationFrame(this.checkMaskSize))}this.raf=requestAnimationFrame(this.checkMaskSize)}),Object(i.a)(this,"handleSubmit",e=>{var{currentTarget:t}=e;localStorage["@markdown"]=this.markdownEditor.current.value,this.setState({markdown:t.elements.markdown.value})}),Object(i.a)(this,"hideDialog",e=>{var{target:t}=e;return t===this[t.dataset.dialog]&&t.close()}),Object(i.a)(this,"setDialog",e=>e&&(this[e.dataset.dialog]=e)),Object(i.a)(this,"setPreviewElement",e=>this.previewElement=e),Object(i.a)(this,"showDialog",e=>{var{currentTarget:t}=e;this[t.dataset.dialog].showModal(),this[t.dataset.dialog].scrollTop=0}),Object(i.a)(this,"state",{body:Ot,contextKey:Bt.keys().next().value,errors:[],markdown:"",maskBottom:0,maskLeft:0,maskRight:0,maskTop:0,previewHeight:0}),Object(i.a)(this,"updateContext",e=>{var{target:{value:t}}=e;return this.setState({contextKey:t})}),this.markdownEditor=Object(a.createRef)()}componentDidMount(){this.markdownEditor.current.value=localStorage["@markdown"]||"",this.setState({markdown:localStorage["@markdown"]}),this.raf=requestAnimationFrame(this.checkMaskSize)}componentDidUpdate(e,t){this.state.markdown!==t.markdown&&this.loadVDOM()}componentWillUnmount(){cancelAnimationFrame(this.raf),this.pendingVDOM&&this.pendingVDOM.abort()}loadVDOM(){var e=this;return Object(n.a)((function*(){e.pendingVDOM&&e.pendingVDOM.abort(),e.pendingVDOM=mt.a.postMarkdown({body:e.state.markdown}),e.setState(yield e.pendingVDOM)}))()}renderContextOption(e){return Object(y.jsx)("option",{value:e,children:e},e)}render(){var e=Bt.get(this.state.contextKey),t={borderBottomWidth:"".concat(this.state.maskBottom,"px"),borderLeftWidth:"".concat(this.state.maskLeft,"px"),borderRightWidth:"".concat(this.state.maskRight,"px"),borderTopWidth:"".concat(this.state.maskTop,"px"),height:"".concat(this.state.previewHeight,"px")};return Object(y.jsxs)("div",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest",children:[Object(y.jsxs)("form",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__edit-bar",children:[Object(y.jsx)("h1",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__title",children:"STOREFRONT MARKDOWN"}),Object(y.jsx)(Ve.a,{className:"MarkdownTest__button","data-dialog":"editor",minWidth:0,onClick:this.showDialog,primaryColor:m.g.YELLOW,size:"tiny",type:"button",children:"Editor"}),Object(y.jsx)(Ve.a,{className:"MarkdownTest__button","data-dialog":"typography",minWidth:0,onClick:this.showDialog,primaryColor:m.g.YELLOW,size:"tiny",type:"button",children:"Typography"}),Object(y.jsx)(Ve.a,{className:"MarkdownTest__button","data-dialog":"markdown",minWidth:0,onClick:this.showDialog,primaryColor:m.g.YELLOW,size:"tiny",type:"button",children:"Markdown"}),Object(y.jsx)(Ve.a,{className:"MarkdownTest__button","data-dialog":"components",minWidth:0,onClick:this.showDialog,primaryColor:m.g.YELLOW,size:"tiny",type:"button",children:"Components"}
1),Object(y.jsx)("select",{"aria-label":"Mock context",onChange:this.updateContext,value:this.state.contextKey,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__select",children:Array.from(Bt.keys(),this.renderContextOption,this)})]}),Object(y.jsx)("dialog",{"data-dialog":"typography",onClick:this.hideDialog,ref:this.setDialog,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__dialog",children:Object(y.jsx)(dt,{})}),Object(y.jsx)("dialog",{"data-dialog":"markdown",onClick:this.hideDialog,ref:this.setDialog,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__dialog",children:Object(y.jsx)(lt,{})}),Object(y.jsx)("dialog",{"data-dialog":"components",onClick:this.hideDialog,ref:this.setDialog,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__dialog",children:Object(y.jsx)(ct,{})}),Object(y.jsx)("dialog",{"data-dialog":"editor",ref:this.setDialog,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__dialog",children:Object(y.jsxs)("form",{method:"dialog",name:"editor",onSubmit:this.handleSubmit,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__dialog__interior",children:[Object(y.jsx)("textarea",{name:"markdown",ref:this.markdownEditor,rows:"30",className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__markdown"}),Object(y.jsxs)("div",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__editor-buttons",children:[Object(y.jsx)(Ve.a,{className:"MarkdownTest__editor-button",onClick:this.cancelEditing,size:"small",type:"button",children:"Cancel"}),Object(y.jsx)(Ve.a,{className:"MarkdownTest__editor-button",primaryColor:m.g.YELLOW,size:"small",type:"submit",children:"Render"})]})]})}),Object(y.jsx)(Qe.a,{errorMessage:Object(y.jsxs)(y.Fragment,{children:[Object(y.jsx)("p",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]]),children:"Please check your markup from the Editor button and refresh the page."}),Object(y.jsxs)("div",{style:{textAlign:"left"},className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]]),children:[Object(y.jsx)("p",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]]),children:"Some common gotchas:"}),Object(y.jsxs)("ul",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]]),children:[Object(y.jsx)("li",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]]),children:"Missing a closing tag"}),Object(y.jsx)("li",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]]),children:"Typo in a component tag"}),Object(y.jsx)("li",{className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]]),children:"Mismatched opening and closing tags"})]})]})]}),children:Object(y.jsxs)("div",{ref:this.setPreviewElement,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__preview",children:[Object(y.jsx)(e,{body:this.state.body,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])}),Object(y.jsx)("div",{style:t,className:l.a.dynamic([["763292649",[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6]]])+" MarkdownTest__mask"})]})}),Object(y.jsx)(it,{errors:this.state.errors}),Object(y.jsx)(l.a,{id:"763292649",dynamic:[m.g.YELLOW_DARK,jt,m.g.YELLOW_LIGHT,m.g.YELLOW,m.g.YELLOW,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_6,m.g.GRAY_4,m.g.YELLOW,bt,m.g.YELLOW_LIGHT,ht,m.g.GRAY_1,m.g.YELLOW_DARK,m.g.YELLOW_LIGHT,m.g.PINK,m.g.GRAY_0,m.g.GRAY_1,m.g.GRAY_6],children:[".MarkdownTest.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100vh;}",".MarkdownTest.__jsx-style-dynamic-selector .MarkdownTest__button{margin:0 1ex;}",".MarkdownTest.__jsx-style-dynamic-selector .MarkdownTest__button:focus{outline:1px solid ".concat(m.g.YELLOW_DARK,";outline-offset:5px;}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector{background:transparent;border:none;padding:0;max-height:95vh;max-width:90vw;overflow:auto;width:800px;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector::backdrop{background-color:".concat(jt,";}"),".MarkdownTest__dialog[open].__jsx-style-dynamic-selector::backdrop{-webkit-animation:BACKDROP_ENTER-__jsx-style-dynamic-selector 140ms ease;animation:BACKDROP_ENTER-__jsx-style-dynamic-selector 140ms ease;}",".MarkdownTest__edit-bar.__jsx-style-dynamic-selector{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:".concat(m.g.YELLOW_LIGHT,";border:15px solid transparent;border-image:repeating-linear-gradient( 135deg, ").concat(m.g.YELLOW," 0, ").concat(m.g.YELLOW," 20px, ").concat(m.g.GRAY_6," 0, ").concat(m.g.GRAY_6," 40px ) 15;color:").concat(m.g.GRAY_6,";display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:1ex 1em;z-index:1;}"),".MarkdownTest__editor-buttons.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;
1-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;}",".MarkdownTest.__jsx-style-dynamic-selector .MarkdownTest__editor-button:not(:last-child){margin-right:1em;}",".MarkdownTest__markdown.__jsx-style-dynamic-selector{border:1px solid ".concat(m.g.GRAY_4,";font-family:monospace;font-size:14px;font-feature-settings:'kern' 1;margin-bottom:1em;padding:1em;-webkit-transition:border-color 80ms linear;transition:border-color 80ms linear;width:100%;}"),".MarkdownTest__markdown.__jsx-style-dynamic-selector:focus{border-color:".concat(m.g.YELLOW,";outline:none;}"),".MarkdownTest__mask.__jsx-style-dynamic-selector{border-color:".concat(bt,";border-style:solid;bottom:0;left:0;position:absolute;right:0;top:0;z-index:1;}"),".MarkdownTest__preview.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow:auto;position:relative;z-index:0;}",".MarkdownTest__preview.__jsx-style-dynamic-selector>*{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;pointer-events:none;}",".MarkdownTest__preview.__jsx-style-dynamic-selector section.markdown{pointer-events:all;}",".MarkdownTest__select.__jsx-style-dynamic-selector{background:".concat(m.g.YELLOW_LIGHT,";border:none;font-size:14px;height:45px;margin-left:1ex;-webkit-transition:background-color 80ms linear;transition:background-color 80ms linear;}"),".MarkdownTest__select.__jsx-style-dynamic-selector:focus,.MarkdownTest__select.__jsx-style-dynamic-selector:hover{background:".concat(ht,";outline:none;}"),".MarkdownTest__title.__jsx-style-dynamic-selector{-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;font-size:24px;font-stretch:condensed;font-weight:700;-webkit-letter-spacing:0.03em;-moz-letter-spacing:0.03em;-ms-letter-spacing:0.03em;letter-spacing:0.03em;}","@-webkit-keyframes BACKDROP_ENTER-__jsx-style-dynamic-selector{from{opacity:0;}to{opacity:1;}}","@keyframes BACKDROP_ENTER-__jsx-style-dynamic-selector{from{opacity:0;}to{opacity:1;}}",".MarkdownTest.__jsx-style-dynamic-selector .MarkdownTest__dialog__interior{background:white;border-radius:5px;padding:1em;}",".MarkdownTest.__jsx-style-dynamic-selector .MarkdownTest__dialog__interior > code{background-color:".concat(m.g.GRAY_1,";display:block;padding:1em;}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector a{color:".concat(m.g.YELLOW_DARK,";-webkit-transition:color 80ms linear;transition:color 80ms linear;}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector a:hover{color:".concat(m.g.YELLOW_LIGHT,";}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector code,.MarkdownTest__dialog.__jsx-style-dynamic-selector kbd{color:".concat(m.g.PINK,";font-weight:700;white-space:pre;}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector h1{font-size:24px;font-stretch:condensed;font-weight:700;-webkit-letter-spacing:0.03em;-moz-letter-spacing:0.03em;-ms-letter-spacing:0.03em;letter-spacing:0.03em;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector h1:not(:first-child),.MarkdownTest__dialog.__jsx-style-dynamic-selector h2:not(:first-child){margin-top:2em;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector h2{font-size:20px;font-stretch:condensed;font-weight:700;-webkit-letter-spacing:0.03em;-moz-letter-spacing:0.03em;-ms-letter-spacing:0.03em;letter-spacing:0.03em;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector h1,.MarkdownTest__dialog.__jsx-style-dynamic-selector h2,.MarkdownTest__dialog.__jsx-style-dynamic-selector p,.MarkdownTest__dialog.__jsx-style-dynamic-selector table,.MarkdownTest.__jsx-style-dynamic-selector .MarkdownTest__dialog__interior > code{margin-bottom:1em;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector table{width:100%;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector tbody tr:nth-child(even){background-color:".concat(m.g.GRAY_0,";}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector tbody tr:nth-child(odd){background-color:".concat(m.g.GRAY_1,";}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector td{padding:5px 8px;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector td .Icon{height:1em;width:1em;}",".MarkdownTest__dialog.__jsx-style-dynamic-selector thead{background-color:".concat(m.g.GRAY_6,";color:white;font-size:0.8em;}"),".MarkdownTest__dialog.__jsx-style-dynamic-selector thead td{padding:8px;}"]})]})}}var xt="\n How much wood would a wood chuck chuck if a wood chuck could chuck wood?\n We answer this and other difficult questions below.\n",Lt={author:[{id:"1",name:"Elvira",team
1:"Mistress of the Dark"}],category:{color:"COLORS.BLUE",name:"Mock Blog Category",slug:"mock-blog-category"},description:Object.assign(()=>Object(y.jsx)("p",{className:"markdown",children:xt}),{toTextContent:()=>xt}),metaDescription:"Mock blog post description",publishDate:new Date("2233-03-22T12:00"),slug:"mock-blog-post",tags:[],title:"Mock blog post title"},Ot=Object.assign(()=>Object(y.jsx)("section",{className:"markdown",children:"..."}),{chapters:[],reprocess:()=>Ot}),ut={blurb:"\n Whether you\u2019re hunting cryptids or they\u2019re hunting you, Wistia\u2019s\n cryptozoological integrations have you covered.\n ",description:"Mock integration category description",integrations:[{color:"COLORS.BLUE",logo:{imgUrl:()=>"https://images.ctfassets.net/j7pfe8y48ry3/mBcDb5mE5EIyYAqoaEkQ2/4230e3bae8cedb480a98009e70f24380/icons8-werewolf-96.png"},name:"Ectoplasmly",slug:"ectoplasmply"},{color:"COLORS.GREEN",logo:{imgUrl:()=>"https://images.ctfassets.net/j7pfe8y48ry3/2eqC1jPZsAIAciwEqg6oYg/e056c82d2d9d4231942869c488fb11a1/Woodbooger_Icon_Dark_Green.png"},name:"Qu\xe4tch",slug:"quatch"}],name:"Cryptozoology",resource:{category:"paranormal-activity",categoryName:"Paranormal Activity",linkText:"\n In 1960, several residents of Mays Landing heard horrifying screams in the\n night. There was no explanation for the noises and people began to panic.\n Police hung flyers assuring residents that the Jersey Devil was a hoax,\n but a circus owner\u2026\n ",slug:"inside-the-mind-of-the-jersey-devil"},slug:"cryptozoology",tagline:"The truth is out there"},Et={blurb:"\n Who\u2019s watching who? Keep track of video evidence of unexplained phenomena\n and manage digital honeypots for entrapping your powerful enemies using\n Wistia\u2019s Muldr integration.\n ",category:ut,color:"COLORS.PINK",documentationUrl:"https://vault.fbi.gov/unexplained-phenomenon",logo:{imgUrl:()=>"https://images.ctfassets.net/j7pfe8y48ry3/1ke980UcdyKsMmKqsaykoa/fe9f307042c6087f3a583fff9ee2d743/icons8-sci-fi-96.png"},name:"Muldr",otherCategories:[{blurb:"\n Save hours of work by automating the isolation and identification of\n EVP and spectral anomalies in your videos.\n ",integrations:[{name:"Boo!"},{name:"Spektr"},{name:"Spookly"}],name:"Hauntings",slug:"productivity"},{blurb:"\n Orchestrate and document your experiments with online video. The FBI may\n be able to silence you, but they won\u2019t be able to suppress your\n discoveries!\n ",integrations:[{name:"Orgon\xe9"},{name:"Sanguify"},{name:"Re:animate"}],name:"Sci-Med",slug:"analytics"},{blurb:"\n Manually managing ransom videos is a notorious source of humiliating\n snafus. These tools will make sure your breadcrumbs reach the right\n people at the right times.\n ",integrations:[{name:"Mysteryly"},{name:"N-treeg"}],name:"Lost Heirs",slug:"support"}],quotation:{toTextContent:()=>"The truth is out there, Mulder. But so are lies."},quotationAttribution:"Dana Scully",quotationAttributionRole:"FBI special agent",serviceUrl:"http://scullyseyes.tumblr.com/",slug:"muldr",supportUrl:"https://www.buzzfeed.com/eleanorbate/wicreepedia"};ut.integrations.push(Et);var Rt={category:{name:"Mock Support Category",slug:"mock-support-category"},description:"Mock support doc description",slug:"mock-support-doc",title:"Mock Support Doc"},Bt=new Map([["No context",e=>{var{body:t}=e;return Object(y.jsx)(t,{})}],["Blog post",e=>{var{body:t}=e;return Object(y.jsx)(Xe.b,{menuId:"learn",children:Object(y.jsx)(qe,{morePosts:[],post:Object.create(Lt,{body:{value:t}})})})}],["Support doc",e=>{var{body:t}=e;return Object(y.jsx)(_t.default,{article:Object.create(Rt,{body:{value:t}}),seoURL:"NOT_IN_PREVIEW"})}],["Sidebar",e=>{var{body:t}=e;return Object(y.jsx)(pt,{children:Object(y.jsx)(gt.a,{title:"Mock login sidebar page",children:Object(y.jsx)(t,{})})})}]]);class At extends a.Component{render(){return Object(y.jsxs)("div",{children:[Object(y.jsxs)(o.a,{children:[Object(y.jsx)("title",{children:"Storefront Markdown Test"}),Object(y.jsx)("meta",{content:"noindex, nofollow",name:"robots"})]}),Object(y.jsx)(yt,{})]})}}},VB9H:function(e,t,s){"use strict";var a=s("rePB"),c=s("eyG0"),o=s("nKUr");function n(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),s.push.apply(s,a)}return s}function i(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};
1t%2?n(Object(s),!0).forEach((function(t){Object(a.a)(e,t,s[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):n(Object(s)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))}))}return e}var r=e=>Object(o.jsx)("svg",i(i({},e),{},{fill:"currentColor",viewBox:"0 0 34 34",children:Object(o.jsx)("path",{d:"M21.391 23.8c-.435 0-.87-.166-1.202-.498a1.697 1.697 0 010-2.403l2.198-2.199H8.5a1.7 1.7 0 110-3.4h13.887l-2.198-2.198a1.697 1.697 0 010-2.403 1.698 1.698 0 012.404 0l5.1 5.1a1.697 1.697 0 010 2.403l-5.1 5.1a1.693 1.693 0 01-1.202.498",fill:"currentColor",fillRule:"evenodd"})}));r.iconName="ArrowRight",t.a=c.a.extend(r,"Icon IconArrowRight")},vrKs:function(e,t,s){"use strict";var a=s("MX0m"),c=s.n(a),o=s("8Kt/"),n=s.n(o),i=s("nKUr");t.a=e=>{var{children:t,justifyContent:s,title:a}=e;return Object(i.jsxs)(i.Fragment,{children:[Object(i.jsxs)(n.a,{children:[Object(i.jsx)("title",{children:a}),Object(i.jsx)("base",{target:"_parent"}),Object(i.jsx)("meta",{content:"noindex, nofollow",name:"robots"})]}),Object(i.jsxs)("div",{className:c.a.dynamic([["2363519401",[s?"justify-content: ".concat(s):""]]])+" SidebarPage",children:[t,Object(i.jsx)(c.a,{id:"2363519401",dynamic:[s?"justify-content: ".concat(s):""],children:["#__next{height:auto;}",".SidebarPage.__jsx-style-dynamic-selector,.SidebarPage.__jsx-style-dynamic-selector > *,.SidebarPage.__jsx-style-dynamic-selector > * > *{".concat(s?"justify-content: ".concat(s):"",";height:100%;}")]})]})]})}},wlfP:function(e,t,s){(window.__NEXT_P=window.__NEXT_P||[]).push(["/@markdown",function(){return s("K9GT")}])}},[["wlfP",1,2,0,3,4,5,6,8,7,9,10,11,15,14,12,13,16,17,18,20]]]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.