@reuters-graphics/graphics-components 3.0.25 → 3.0.27

package/dist/components/ScrollerVideo/demo/graphic/ai2svelte/annotation2.svelte

@@ -1,402 +0,0 @@
-<script>
-  // @ts-ignore img
-  import chartXs from '../imgs/annotation2-xs.png';
-  // @ts-ignore img
-  import chartSm from '../imgs/annotation2-sm.png';
-  // @ts-ignore img
-  import chartMd from '../imgs/annotation2-md.png';
-  // @ts{width}mg
-  import chartLg from '../imgs/annotation2-md.png';
-  // @ts-ignore img
-  import chartXl from '../imgs/annotation2-xl.png';
-
-  let width = null;
-</script>
-
-<div id="g-annotation2-box" bind:clientWidth={width}>
-  <!-- Artboard: xs -->
-  {#if width && width >= 0 && width < 510}
-    <div id="g-annotation2-xs" class="g-artboard" style="">
-      <div style="padding: 0 0 187.8788% 0;"></div>
-      <div
-        id="g-annotation2-xs-img"
-        class="g-aiImg"
-        style={`background-image: url(${chartXs});`}
-      ></div>
-      <div
-        id="g-ai0-1"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:9.0284%;margin-top:-41px;left:17.9779%;width:219px;"
-      >
-        <p class="g-pstyle0">The wave at Teahupo'o is</p>
-        <p class="g-pstyle0">known to be very heavy</p>
-        <p class="g-pstyle0">with a thick lip that can</p>
-        <p class="g-pstyle0">easily knock a surfer off the</p>
-        <p class="g-pstyle0">wave and onto the reef below</p>
-      </div>
-      <div
-        id="g-ai0-2"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:68.8671%;margin-top:-25px;left:12.9181%;width:144px;"
-      >
-        <p class="g-pstyle0">Surfer speed is up</p>
-        <p class="g-pstyle0">to 35 km per hour</p>
-        <p class="g-pstyle0">(20 mph)</p>
-      </div>
-      <div
-        id="g-ai0-3"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:68.8671%;margin-top:-25px;left:62.8912%;width:149px;"
-      >
-        <p class="g-pstyle0">One cubic meter</p>
-        <p class="g-pstyle0">of water weighs</p>
-        <p class="g-pstyle0">1,000 kg. (2,200 lb)</p>
-      </div>
-      <div
-        id="g-ai0-4"
-        class="g-text g-aiAbs"
-        style="top:78.7097%;left:17.9779%;width:59.0909%;"
-      >
-        <p>
-          A surfer will adjust speed to stay in the tube by dragging a hand to
-          slow, or pumping the board to speed up
-        </p>
-      </div>
-    </div>
-  {/if}
-  <!-- Artboard: sm -->
-  {#if width && width >= 510 && width < 660}
-    <div id="g-annotation2-sm" class="g-artboard" style="">
-      <div style="padding: 0 0 56.2745% 0;"></div>
-      <div
-        id="g-annotation2-sm-img"
-        class="g-aiImg"
-        style={`background-image: url(${chartSm});`}
-      ></div>
-    </div>
-  {/if}
-  <!-- Artboard: md -->
-  {#if width && width >= 660 && width < 930}
-    <div id="g-annotation2-md" class="g-artboard" style="">
-      <div style="padding: 0 0 56.3636% 0;"></div>
-      <div
-        id="g-annotation2-md-img"
-        class="g-aiImg"
-        style={`background-image: url(${chartMd});`}
-      ></div>
-      <div
-        id="g-ai2-1"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:23.9183%;margin-top:-41px;left:67.1629%;width:219px;"
-      >
-        <p class="g-pstyle0">The wave at Teahupo'o is</p>
-        <p class="g-pstyle0">known to be very heavy</p>
-        <p class="g-pstyle0">with a thick lip that can</p>
-        <p class="g-pstyle0">easily knock a surfer off the</p>
-        <p class="g-pstyle0">wave and onto the reef below</p>
-      </div>
-      <div
-        id="g-ai2-2"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:65.585%;margin-top:-17px;left:51.2917%;width:189px;"
-      >
-        <p class="g-pstyle0">Surfer speed is up to</p>
-        <p class="g-pstyle0">35 km per hour (20 mph)</p>
-      </div>
-      <div
-        id="g-ai2-3"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:74.4559%;margin-top:-25px;left:5.9007%;width:263px;"
-      >
-        <p class="g-pstyle0">A surfer will adjust speed to stay in</p>
-        <p class="g-pstyle0">the tube by dragging a hand to slow,</p>
-        <p class="g-pstyle0">or pumping the board to speed up</p>
-      </div>
-      <div
-        id="g-ai2-4"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:79.5635%;margin-top:-17px;left:70.1381%;width:199px;"
-      >
-        <p class="g-pstyle0">One cubic meter of water</p>
-        <p class="g-pstyle0">weighs 1,000 kg. (2,200 lb)</p>
-      </div>
-    </div>
-  {/if}
-  <!-- Artboard: lg -->
-  {#if width && width >= 930 && width < 1200}
-    <div id="g-annotation2-lg" class="g-artboard" style="">
-      <div style="padding: 0 0 56.0215% 0;"></div>
-      <div
-        id="g-annotation2-lg-img"
-        class="g-aiImg"
-        style={`background-image: url(${chartLg});`}
-      ></div>
-      <div
-        id="g-ai3-1"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:22.7846%;margin-top:-47.7px;left:73.261%;width:219px;"
-      >
-        <p class="g-pstyle0">The wave at Teahupo'o is</p>
-        <p class="g-pstyle0">known to be very heavy</p>
-        <p class="g-pstyle0">with a thick lip that can</p>
-        <p class="g-pstyle0">easily knock a surfer off the</p>
-        <p class="g-pstyle0">wave and onto the reef below</p>
-      </div>
-      <div
-        id="g-ai3-2"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:22.7846%;margin-top:-47.7px;left:73.261%;width:219px;"
-      >
-        <p class="g-pstyle0">The wave at Teahupo'o is</p>
-        <p class="g-pstyle0">known to be very heavy</p>
-        <p class="g-pstyle0">with a thick lip that can</p>
-        <p class="g-pstyle0">easily knock a surfer off the</p>
-        <p class="g-pstyle0">wave and onto the reef below</p>
-      </div>
-      <div
-        id="g-ai3-3"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:61.187%;margin-top:-19.8px;left:54.1451%;width:189px;"
-      >
-        <p class="g-pstyle0">Surfer speed is up to</p>
-        <p class="g-pstyle0">35 km per hour (20 mph)</p>
-      </div>
-      <div
-        id="g-ai3-4"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:61.187%;margin-top:-19.8px;left:54.1451%;width:189px;"
-      >
-        <p class="g-pstyle0">Surfer speed is up to</p>
-        <p class="g-pstyle0">35 km per hour (20 mph)</p>
-      </div>
-      <div
-        id="g-ai3-5"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:72.3786%;margin-top:-29.1px;left:22.2898%;width:263px;"
-      >
-        <p class="g-pstyle0">A surfer will adjust speed to stay in</p>
-        <p class="g-pstyle0">the tube by dragging a hand to slow,</p>
-        <p class="g-pstyle0">or pumping the board to speed up</p>
-      </div>
-      <div
-        id="g-ai3-6"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:72.3786%;margin-top:-29.1px;left:22.2898%;width:263px;"
-      >
-        <p class="g-pstyle0">A surfer will adjust speed to stay in</p>
-        <p class="g-pstyle0">the tube by dragging a hand to slow,</p>
-        <p class="g-pstyle0">or pumping the board to speed up</p>
-      </div>
-      <div
-        id="g-ai3-7"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:79.6131%;margin-top:-19.8px;left:76.246%;width:199px;"
-      >
-        <p class="g-pstyle0">One cubic meter of water</p>
-        <p class="g-pstyle0">weighs 1,000 kg. (2,200 lb)</p>
-      </div>
-      <div
-        id="g-ai3-8"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:79.6131%;margin-top:-19.8px;left:76.246%;width:199px;"
-      >
-        <p class="g-pstyle0">One cubic meter of water</p>
-        <p class="g-pstyle0">weighs 1,000 kg. (2,200 lb)</p>
-      </div>
-    </div>
-  {/if}
-  <!-- Artboard: xl -->
-  {#if width && width >= 1200}
-    <div id="g-annotation2-xl" class="g-artboard" style="">
-      <div style="padding: 0 0 51.6667% 0;"></div>
-      <div
-        id="g-annotation2-xl-img"
-        class="g-aiImg"
-        style={`background-image: url(${chartXl});`}
-      ></div>
-      <div
-        id="g-ai4-1"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:23.2613%;margin-top:-61.2px;left:79.2253%;width:268px;"
-      >
-        <p class="g-pstyle0">The wave at Teahupo'o is</p>
-        <p class="g-pstyle0">known to be very heavy</p>
-        <p class="g-pstyle0">with a thick lip that can</p>
-        <p class="g-pstyle0">easily knock a surfer off the</p>
-        <p class="g-pstyle0">wave and onto the reef below</p>
-      </div>
-      <div
-        id="g-ai4-2"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:65.3581%;margin-top:-25.2px;left:54.3241%;width:230px;"
-      >
-        <p class="g-pstyle0">Surfer speed is up to</p>
-        <p class="g-pstyle0">35 km per hour (20 mph)</p>
-      </div>
-      <div
-        id="g-ai4-3"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:76.3258%;margin-top:-37.2px;left:22.0662%;width:323px;"
-      >
-        <p class="g-pstyle0">A surfer will adjust speed to stay in</p>
-        <p class="g-pstyle0">the tube by dragging a hand to slow,</p>
-        <p class="g-pstyle0">or pumping the board to speed up</p>
-      </div>
-      <div
-        id="g-ai4-4"
-        class="g-text g-aiAbs g-aiPointText"
-        style="top:83.2613%;
-margin-top:-25.2px;left:81.2408%;width:243px;"
-      >
-        <p class="g-pstyle0">One cubic meter of water</p>
-        <p class="g-pstyle0">weighs 1,000 kg. (2,200 lb)</p>
-      </div>
-    </div>
-  {/if}
-</div>
-
-<!-- End ai2html - 2024-07-19 13:14 -->
-
-<!-- Generated by ai2html v0.100.0 - 2024-07-19 13:14 -->
-<!-- ai file: annotation2.ai -->
-<style>#g-annotation2-box,
-#g-annotation2-box .g-artboard {
-  margin: 0 auto;
-}
-
-#g-annotation2-box p {
-  margin: 0;
-}
-
-#g-annotation2-box .g-aiAbs {
-  position: absolute;
-}
-
-#g-annotation2-box .g-aiImg {
-  position: absolute;
-  top: 0;
-  display: block;
-  width: 100% !important;
-  height: 100%;
-  background-size: contain;
-  background-repeat: no-repeat;
-}
-
-#g-annotation2-box .g-aiPointText p {
-  white-space: nowrap;
-}
-
-#g-annotation2-xs {
-  position: relative;
-  overflow: hidden;
-}
-
-#g-annotation2-xs p {
-  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: 400;
-  line-height: 16px;
-  height: auto;
-  opacity: 1;
-  letter-spacing: 0em;
-  font-size: 16px;
-  text-align: left;
-  color: rgb(255, 255, 255);
-  text-transform: none;
-  padding-bottom: 0;
-  padding-top: 0;
-  mix-blend-mode: normal;
-  font-style: normal;
-  position: static;
-}
-
-#g-annotation2-xs .g-pstyle0 {
-  height: 16px;
-}
-
-#g-annotation2-sm {
-  position: relative;
-  overflow: hidden;
-}
-
-#g-annotation2-md {
-  position: relative;
-  overflow: hidden;
-}
-
-#g-annotation2-md p {
-  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: 400;
-  line-height: 16px;
-  height: auto;
-  opacity: 1;
-  letter-spacing: 0em;
-  font-size: 16px;
-  text-align: left;
-  color: rgb(255, 255, 255);
-  text-transform: none;
-  padding-bottom: 0;
-  padding-top: 0;
-  mix-blend-mode: normal;
-  font-style: normal;
-  position: static;
-}
-
-#g-annotation2-md .g-pstyle0 {
-  height: 16px;
-}
-
-#g-annotation2-lg {
-  position: relative;
-  overflow: hidden;
-}
-
-#g-annotation2-lg p {
-  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: 400;
-  line-height: 19px;
-  height: auto;
-  opacity: 1;
-  letter-spacing: 0em;
-  font-size: 16px;
-  text-align: left;
-  color: rgb(255, 255, 255);
-  text-transform: none;
-  padding-bottom: 0;
-  padding-top: 0;
-  mix-blend-mode: normal;
-  font-style: normal;
-  position: static;
-}
-
-#g-annotation2-lg .g-pstyle0 {
-  height: 19px;
-}
-
-#g-annotation2-xl {
-  position: relative;
-  overflow: hidden;
-}
-
-#g-annotation2-xl p {
-  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: 400;
-  line-height: 24px;
-  height: auto;
-  opacity: 1;
-  letter-spacing: 0em;
-  font-size: 20px;
-  text-align: left;
-  color: rgb(255, 255, 255);
-  text-transform: none;
-  padding-bottom: 0;
-  padding-top: 0;
-  mix-blend-mode: normal;
-  font-style: normal;
-  position: static;
-}
-
-#g-annotation2-xl .g-pstyle0 {
-  height: 24px;
-}
-
-/* Custom CSS */</style>

package/dist/components/ScrollerVideo/demo/graphic/ai2svelte/annotation2.svelte.d.ts

@@ -1,26 +0,0 @@
-export default Annotation2;
-type Annotation2 = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Annotation2: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}