@gitlab/ui 32.65.1 → 33.0.0

package/dist/components/utilities/intersection_observer/examples/intersection_observer.last_appeared.example.js

@@ -1,83 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  data: () => ({
-    appearedAt: null,
-    now: null,
-    interval: null
-  }),
-  computed: {
-    secondsSinceAppearance() {
-      if (!this.appearedAt) {
-        return 0;
-      }
-
-      return Math.floor((this.now - this.appearedAt) / 1000);
-    }
-
-  },
-
-  destroyed() {
-    this.clearInterval();
-  },
-
-  methods: {
-    appear() {
-      this.clearInterval();
-      this.interval = setInterval(this.tick, 1000);
-      this.tick();
-      this.appearedAt = this.now;
-    },
-
-    disappear() {
-      this.clearInterval();
-    },
-
-    clearInterval() {
-      clearInterval(this.interval);
-    },
-
-    tick() {
-      this.now = new Date().getTime();
-    }
-
-  }
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-intersection-observer',{on:{"appear":_vm.appear,"disappear":_vm.disappear}},[_c('span',[_vm._v("Last appeared "+_vm._s(_vm.secondsSinceAppearance)+" seconds ago")])])};
-var __vue_staticRenderFns__ = [];
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = false;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/src/components/utilities/intersection_observer/examples/index.js

@@ -1,23 +0,0 @@
-import ImageExample from './intersection_observer.image.example.vue';
-import LastAppearedExample from './intersection_observer.last_appeared.example.vue';
-
-export default [
-  {
-    name: 'Intersection observer',
-    items: [
-      {
-        id: 'intersection-observer-last-appeared',
-        name: 'Last appeared at',
-        description: 'Logs when the component last appeared on the screen',
-        component: LastAppearedExample,
-      },
-      {
-        id: 'intersection-observer-lazy-loaded-image',
-        name: 'Lazy loaded image',
-        description:
-          "This image switches between a gif and a still image when it's on or off the screen",
-        component: ImageExample,
-      },
-    ],
-  },
-];

package/src/components/utilities/intersection_observer/examples/intersection_observer.image.example.vue

@@ -1,29 +0,0 @@
-<script>
-export default {
-  data: () => ({
-    isInView: false,
-  }),
-  computed: {
-    imageUrl() {
-      // If the image is in view, return the high res one. If not return nothing, or a low res one
-      return this.isInView
-        ? '../../img/gitlab-summit-south-africa.jpg'
-        : '../../img/gitlab-summit-south-africa-min.jpg';
-    },
-  },
-  methods: {
-    appear() {
-      this.isInView = true;
-    },
-    disappear() {
-      this.isInView = false;
-    },
-  },
-};
-</script>
-
-<template>
-  <gl-intersection-observer @appear="appear" @disappear="disappear">
-    <img :src="imageUrl" style="max-width: 100%; height: auto" />
-  </gl-intersection-observer>
-</template>

package/src/components/utilities/intersection_observer/examples/intersection_observer.last_appeared.example.vue

@@ -1,43 +0,0 @@
-<script>
-export default {
-  data: () => ({
-    appearedAt: null,
-    now: null,
-    interval: null,
-  }),
-  computed: {
-    secondsSinceAppearance() {
-      if (!this.appearedAt) {
-        return 0;
-      }
-      return Math.floor((this.now - this.appearedAt) / 1000);
-    },
-  },
-  destroyed() {
-    this.clearInterval();
-  },
-  methods: {
-    appear() {
-      this.clearInterval();
-      this.interval = setInterval(this.tick, 1000);
-      this.tick();
-      this.appearedAt = this.now;
-    },
-    disappear() {
-      this.clearInterval();
-    },
-    clearInterval() {
-      clearInterval(this.interval);
-    },
-    tick() {
-      this.now = new Date().getTime();
-    },
-  },
-};
-</script>
-
-<template>
-  <gl-intersection-observer @appear="appear" @disappear="disappear">
-    <span>Last appeared {{ secondsSinceAppearance }} seconds ago</span>
-  </gl-intersection-observer>
-</template>