@shko.online/componentframework-mock/src/utils/banner.ts

Mocking library to help with testing PowerApps Component Framework Components

/*
    Copyright (c) 2022 Betim Beja and Shko Online LLC
    Licensed under the MIT license.
*/

const backgroundImage = encodeURIComponent(`<svg
width="84"
height="84"
viewBox="0 0 8.4666665 8.4666669"
version="1.1"
id="svg213"
inkscape:version="1.1 (c68e22c387, 2021-05-23)"
sodipodi:docname="Shko Online 32x32.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
  id="namedview215"
  pagecolor="#ffffff"
  bordercolor="#666666"
  borderopacity="1.0"
  inkscape:pageshadow="2"
  inkscape:pageopacity="0.0"
  inkscape:pagecheckerboard="0"
  inkscape:document-units="mm"
  showgrid="false"
  units="px"
  inkscape:zoom="8.3856039"
  inkscape:cx="47.998928"
  inkscape:cy="44.421368"
  inkscape:window-width="1920"
  inkscape:window-height="1017"
  inkscape:window-x="-8"
  inkscape:window-y="-8"
  inkscape:window-maximized="1"
  inkscape:current-layer="layer1" />
<defs
  id="defs210" />
<g
  inkscape:label="Layer 1"
  inkscape:groupmode="layer"
  id="layer1">
 <g
    transform="matrix(0.03527778,0,0,-0.03527778,7.9541245,6.379805)"
    id="g24"
    style="display:inline">
   <path
      id="path26"
      style="fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none"
      d="m 0,0 c 0,-24.24 -19.72,-43.96 -43.96,-43.96 h -120.17 c -24.24,0 -43.96,19.72 -43.96,43.96 v 120.17 c 0,24.24 19.72,43.96 43.96,43.96 H -43.96 C -19.72,164.13 0,144.41 0,120.17 Z m -43.96,169.13 h -120.17 c -27,0 -48.96,-21.97 -48.96,-48.96 V 0 c 0,-27 21.96,-48.96 48.96,-48.96 H -43.96 C -16.96,-48.96 5,-27 5,0 v 120.17 c 0,26.99 -21.96,48.96 -48.96,48.96" />
 </g>
 <g
    transform="matrix(0.03527778,0,0,-0.03527778,5.8293625,4.328045)"
    id="g28"
    style="display:inline">
   <path
      id="path30"
      style="fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none"
      d="m 0,0 c -7.09,0 -12.271,4.92 -12.271,11.84 0,5.53 3.321,9.76 8.281,11.23 v -5.22 c -1.74,-1.23 -2.84,-3.32 -2.84,-6.01 0,-4.41 2.94,-7.22 6.83,-7.22 3.93,0 6.87,2.81 6.87,7.22 0,2.68 -1.09,4.77 -2.83,5.99 v 5.24 C 9.03,21.6 12.32,17.37 12.32,11.84 12.32,4.92 7.17,0 0,0 m -19.49,0 -7.99,9.89 -4.02,-3.8 V 0 h -5.4 v 32.06 h 5.4 V 12.7 l 11.19,10.37 h 6.48 L -23.46,13.39 -12.92,0 Z m -24.281,0 h -5.399 v 12.53 c 0,4.1 -2.03,6.09 -5.49,6.09 -3.85,0 -6.44,-2.33 -6.44,-6.96 V 0 h -5.4 v 32.06 h 5.4 V 20.39 c 1.77,1.9 4.49,2.94 7.69,2.94 5.53,0 9.639,-3.15 9.639,-10.11 z M -81.63,0 c -3.84,0 -7.69,1.12 -9.76,2.59 l 2.07,4.1 c 2.03,-1.34 5.14,-2.29 8.04,-2.29 3.41,0 4.84,0.95 4.84,2.55 0,4.41 -14.26,0.26 -14.26,9.47 0,4.36 3.929,7.21 10.15,7.21 3.07,0 6.57,-0.73 8.65,-1.99 l -2.08,-4.1 c -2.2,1.3 -4.4,1.73 -6.61,1.73 -3.28,0 -4.84,-1.08 -4.84,-2.59 0,-4.67 14.26,-0.52 14.26,-9.55 C -71.17,2.8 -75.14,0 -81.63,0 m 79,26.87 H 2.68 V 14.49 h -5.31 z m 27.91,4.35 c -5.65,5.73 -13.2,8.88 -21.24,8.88 -0.38,0 -0.76,0 -1.14,-0.02 0.14,1.16 0.22,2.32 0.22,3.5 0,15.42 -12.55,27.96 -27.96,27.96 -10.65,0 -20.14,-5.98 -24.85,-15.12 -4.7,3.55 -10.45,5.51 -16.47,5.51 -15.09,0 -27.35,-12.27 -27.35,-27.35 0,-1.76 0.16,-3.49 0.489,-5.19 -0.669,0.01 -1.329,-0.01 -2,-0.05 -6.959,-0.44 -13.509,-3.46 -18.429,-8.5 -4.92,-5.04 -7.77,-11.65 -8.04,-18.63 -0.01,-0.29 -0.02,-0.58 -0.02,-0.88 -0.05,-5.51 2.08,-10.72 6,-14.67 3.989,-4.03 9.32,-6.25 14.989,-6.25 H 3.65 c 8.23,0 15.73,3.3 21.21,8.64 5.47,5.33 8.92,12.69 9.02,20.81 0.099,8.05 -2.95,15.64 -8.6,21.36" />
 </g>
 <g
    transform="matrix(0.03527778,0,0,-0.03527778,2.3297995,6.553725)"
    id="g32"
    style="display:inline">
   <path
      id="path34"
      style="fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none"
      d="m 0,0 c -3.87,0 -6.79,2.79 -6.79,7.18 0,4.38 2.92,7.18 6.79,7.18 3.91,0 6.84,-2.8 6.84,-7.18 C 6.84,2.79 3.91,0 0,0 M 0,18.92 C -7.05,18.92 -12.21,14.06 -12.21,7.18 -12.21,0.3 -7.05,-4.6 0,-4.6 7.14,-4.6 12.26,0.3 12.26,7.18 12.26,14.06 7.14,18.92 0,18.92" />
 </g>
 <g
    transform="matrix(0.03527778,0,0,-0.03527778,3.4036555,5.886265)"
    id="g36"
    style="display:inline">
   <path
      id="path38"
      style="fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none"
      d="m 0,0 c -3.35,0 -6.14,-1.12 -7.91,-3.23 v 2.97 h -5.11 v -22.96 h 5.37 v 11.61 c 0,4.6 2.58,6.92 6.41,6.92 3.44,0 5.46,-1.98 5.46,-6.06 v -12.47 h 5.37 v 13.15 C 9.59,-3.14 5.51,0 0,0" />
 </g>
 <path
    id="path40"
    style="display:inline;fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.0352778"
    d="m 3.9832695,6.705415 h 0.189794 v -1.12536 h -0.189794 z" />
 <g
    transform="matrix(0.03527778,0,0,-0.03527778,4.5173675,5.534555)"
    id="g42"
    style="display:inline">
   <path
      id="path44"
      style="fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none"
      d="m 0,0 c -1.98,0 -3.44,-1.42 -3.44,-3.22 0,-1.81 1.46,-3.23 3.44,-3.23 2.02,0 3.44,1.46 3.44,3.36 C 3.44,-1.33 1.97,0 0,0 m -2.71,-33.19 h 5.37 v 22.96 h -5.37 z" />
 </g>
 <g
    transform="matrix(0.03527778,0,0,-0.03527778,5.3195915,5.886265)"
    id="g46"
    style="display:inline">
   <path
      id="path48"
      style="fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none"
      d="m 0,0 c -3.35,0 -6.15,-1.12 -7.91,-3.23 v 2.97 h -5.12 v -22.96 h 5.38 v 11.61 c 0,4.6 2.58,6.92 6.4,6.92 3.45,0 5.47,-1.98 5.47,-6.06 v -12.47 h 5.37 v 13.15 C 9.59,-3.14 5.51,0 0,0" />
 </g>
 <g
    transform="matrix(0.03527778,0,0,-0.03527778,6.0279725,6.235165)"
    id="g50"
    style="display:inline">
   <path
      id="path52"
      style="fill:#E40046;fill-opacity:1;fill-rule:nonzero;stroke:none"
      d="m 0,0 c 0.52,3.35 3.06,5.59 6.54,5.59 3.52,0 6.06,-2.28 6.49,-5.59 z m 18.15,-1.98 c 0,7.18 -4.9,11.87 -11.61,11.87 -6.84,0 -11.87,-4.91 -11.87,-11.74 0,-6.84 4.99,-11.78 12.69,-11.78 3.95,0 7.18,1.29 9.24,3.74 l -2.88,3.31 c -1.63,-1.68 -3.66,-2.5 -6.23,-2.5 -4,0 -6.8,2.15 -7.44,5.51 h 18.01 c 0.05,0.51 0.09,1.16 0.09,1.59" />
 </g>
</g>
</svg>
`);

export const showBanner = (name: string) =>
    console.info(
        `%cShko Online%c\t\r\n%cWe just helped you test your %c${name}%c component!\r\nContact us: %c%s%s%s`,
        'font-size:0px;',
        "background-image:url('data:image/svg+xml;utf8," +
            backgroundImage +
            "');background-repeat:no-repeat;color:transparent;background-position:center;font-size:84px;",
        '',
        'font-weight:bold;',
        'font-weight:normal;',
        'font-weight:bold;',
        'sales',
        '\x40',
        'shko.online',
    );