@everymatrix/casino-wagering-bonus-progress 1.44.0 → 1.45.2

package/rollup.config.js

@@ -1,59 +0,0 @@
-import svelte from 'rollup-plugin-svelte';
-import commonjs from '@rollup/plugin-commonjs';
-import resolve from '@rollup/plugin-node-resolve';
-import serve from 'rollup-plugin-dev-server';
-import livereload from 'rollup-plugin-livereload';
-import { terser } from 'rollup-plugin-terser';
-import sveltePreprocess from 'svelte-preprocess';
-import typescript from '@rollup/plugin-typescript';
-const production = process.env.NODE_ENV === 'production';
-const dev = process.env.NODE_ENV === 'development';
-
-export default {
-  input: 'src/index.ts',
-  output: {
-    sourcemap: true,
-    format: 'umd',
-    name: 'app',
-    file: 'dist/casino-wagering-bonus-progress.js'
-  },
-  plugins: [
-    svelte({
-      preprocess: sveltePreprocess(),
-      compilerOptions: {
-        // enable run-time checks when not in production
-        customElement: true,
-        dev: !production
-      }
-    }),
-    commonjs(),
-    resolve({
-      browser: true,
-      dedupe: ['svelte']
-    }),
-    dev && serve({
-      open: true,
-      verbose: true,
-      allowCrossOrigin: true,
-      historyApiFallback: false,
-      host: 'localhost',
-      port: 5050,
-    }),
-    dev && livereload({ watch: ['', 'dist'] }),
-    typescript({
-      sourceMap: !production,
-      inlineSources: !production,
-    }),
-    // If we're building for production (npm run build
-    // instead of npm run dev), minify
-    production && 
-    terser({
-      output: {
-        comments: "all"
-      },
-    })
-  ],
-  watch: {
-    clearScreen: false
-  }
-};

package/src/CasinoWageringBonusProgress.svelte

@@ -1,148 +0,0 @@
-<svelte:options tag={null} />
-<script lang="ts">
-  export let percent: string = ''
-  export let status: string = ''
-
-  enum BonusStatus {
-    BeforeClaimed = 'BeforeClaimed',
-    InProgress = 'active',
-    ForfeitedOrCompleted = 'ForfeitedOrCompleted',
-  }
-
-  let innerWidth = 200
-  $: isMobileView = innerWidth <= 576
-
-  // svg
-  $: size = isMobileView ? innerWidth / 4 : 100;
-  $: ringStrokeWidth = size / 7.5
-  $: radius = size / 2 - ringStrokeWidth / 2;
-  $: center = size / 2;
-  
-  $: circumference = radius * 2 * Math.PI;
-
-  const classWithPart = (partAndClass, extraClass = '') => ({
-    part: partAndClass,
-    class: [partAndClass, extraClass].join(' '),
-  })
-
-  $: classWithPartMatchMobile = (partAndClass, extraClass = '') => 
-    classWithPart(`${partAndClass}${isMobileView ? ` ${partAndClass}Mobile` : ''}`, extraClass)
-
-  
-</script>
-
-<svelte:window 
-  bind:innerWidth
-/>
-
-<svg
-  {...{
-    width: size,
-    height: size,
-  }}
->
-  <circle {...{
-    class: "ring",
-    r: radius,
-    cx: center,
-    cy: center,
-    "stroke-width": `${ringStrokeWidth}px`,
-  }} />
-  <circle {...{
-    class: `ring ring-progress ${status === BonusStatus.InProgress ? "active" : ""}`,
-    r: radius,
-    cx: center,
-    cy: center,
-    "stroke-width": `${ringStrokeWidth}px`,
-    "stroke-dasharray": `${circumference} ${circumference}`,
-    "stroke-dashoffset": circumference - Number(percent) / 100 * circumference,
-  }} />
-
-  <circle {...{
-    class: `center ${status === BonusStatus.InProgress ? "active" : ""}`,
-    r: radius - ringStrokeWidth / 2 - 3,
-    cx: center,
-    cy: center,
-  }} />
-
-  <text 
-    {...{
-      x: center,
-      y: center,
-    }}
-    {...classWithPartMatchMobile("ProgressText")}
-  >
-    {percent}%
-  </text>
-
-</svg>
-
-<style lang="scss">
-
-
-  *,
-  *::before,
-  *::after {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-    text-decoration: none;
-    outline: none;
-    box-sizing: border-box;
-  }
-
-
-  $vw_base: 390px;
-  @function vw($px) {
-    @return ($px / $vw_base) * 100vw;
-  }
-
-    
-  $vw_base_pc: 1307px;
-  @function vwpc($px) {
-    @return ($px / $vw_base_pc) * 800px;
-    // @return $px;
-  }
-  // $vw_base_pc: 1307px;
-  // @function vwpc($px) {
-  //   @return ($px / $vw_base_pc) * 100vw;
-  // }
-
-  .ProgressText {
-    fill: #FFFFFF;
-    text-anchor: middle;
-    dominant-baseline: middle;
-    font-style: normal;
-    font-weight: 700;
-
-    font-size: vwpc(36px);
-  }
-
-  .ProgressTextMobile {
-    font-size: vw(20px);
-  }
-
-  circle.ring {
-    stroke: #F2F4F6;
-    fill: transparent;
-  }
-
-  circle.ring-progress {
-    transition: 0.35s stroke-dashoffset;
-    // axis compensation
-    stroke: #C4C4C4;
-    transform: rotate(-90deg);
-    transform-origin: 50% 50%;
-
-    &.active {
-      stroke: #00AEEF;
-    }
-  }
-
-  circle.center {
-    fill: #C4C4C4;
-    &.active {
-      fill: #00AEEF;
-    }
-  }
-</style>

package/src/index.ts

@@ -1,4 +0,0 @@
-import CasinoWageringBonusProgress from './CasinoWageringBonusProgress.svelte';
-
-!customElements.get('casino-wagering-bonus-progress') && customElements.define('casino-wagering-bonus-progress', CasinoWageringBonusProgress);
-export default CasinoWageringBonusProgress;

package/stories/CasinoWageringBonusProgress.stories.js

@@ -1,13 +0,0 @@
-import { html } from 'lit-element';
-
-import CasinoWageringBonusProgress from '../src/CasinoWageringBonusProgress';
-
-// This default export determines where your story goes in the story list
-export default {
-  title: 'CasinoWageringBonusProgress',
-};
-
-// 👇 We create a “template” of how args map to rendering
-const CasinoWageringBonusProgress = ({ aProperty }) => html`<casino-wagering-bonus-progress></casino-wagering-bonus-progress>`;
-
-export const FirstStory = CasinoWageringBonusProgress.bind({});

package/tsconfig.json

@@ -1,6 +0,0 @@
-{
-  "extends": "@tsconfig/svelte/tsconfig.json",
-
-  "include": ["src/**/*"],
-  "exclude": ["node_modules/*", "__sapper__/*", "public/*"]
-}