@html-next/vertical-collection 4.0.2 → 5.0.1

package/CHANGELOG.md

@@ -1,176 +0,0 @@
-Changelog
-=========
-
-
-
-
-## v4.0.2 (2022-11-17)
-
-#### :bug: Bug Fix
-* [#396](https://github.com/html-next/vertical-collection/pull/396) Fix build for ember-source 4.0+ ([@wagenet](https://github.com/wagenet))
-
-#### Committers: 1
-- Peter Wagenet ([@wagenet](https://github.com/wagenet))
-
-## v4.0.1 (2022-11-07)
-
-#### :memo: Documentation
-* [#381](https://github.com/html-next/vertical-collection/pull/381) Fix README ([@runspired](https://github.com/runspired))
-
-#### Committers: 4
-- Alex Navasardyan ([@twokul](https://github.com/twokul))
-- Chris Thoburn ([@runspired](https://github.com/runspired))
-- Matthew Beale ([@mixonic](https://github.com/mixonic))
-- [@Atrue](https://github.com/Atrue)
-
-
-## v4.0.0 (2022-09-12)
-
-* Drops support for Ember < 3.12-LTS.
-* Drops support for Ember CLI 2.x. https://github.com/html-next/vertical-collection/pull/379
-* No change in Node support.
-* Drop the positional param for `items` on the vertical collection component.
-* Drop ember-compatibility-helpers https://github.com/html-next/vertical-collection/pull/375
-* Refactor a bunch of debug code to DEBUG https://github.com/html-next/vertical-collection/pull/388
-* Adopt angle bracket invocation
-* Adopt native getters
-
-
-## v4.0.0-beta.2 (2022-09-08)
-
-
-## v4.0.0-beta.1 (2022-09-07)
-
-
-## v4.0.0-beta.0 (2022-08-28)
-
-* Drop support for Ember versions prior to 3.12
-* Drop support for Ember CLI 2.x
-* Adopt native getters
-* Adopt angle bracket invocation
-* Drop positional param argument for `item`
-
-
-## v3.1.0 (2022-08-04)
-
-#### :rocket: Enhancement
-* [#380](https://github.com/html-next/vertical-collection/pull/380) fix: enable parallel builds ([@runspired](https://github.com/runspired))
-
-#### :bug: Bug Fix
-* [#380](https://github.com/html-next/vertical-collection/pull/380) fix: enable parallel builds ([@runspired](https://github.com/runspired))
-* [#358](https://github.com/html-next/vertical-collection/pull/358) Delete virtual element ([@Atrue](https://github.com/Atrue))
-
-#### Committers: 3
-- Chris Thoburn ([@runspired](https://github.com/runspired))
-- Matthew Beale ([@mixonic](https://github.com/mixonic))
-- [@Atrue](https://github.com/Atrue)
-
-## v3.0.0 (2022-05-03)
-
-
-## v3.0.0-1 (2022-03-01)
-
-
-## v3.0.0-0 (2021-12-09)
-
-#### What's new
-
-* Drop support for Ember < 2.18, add support for Ember 4.0+ (#343) (3343ecc)
-* 4 retries on CI, 1s sleep (#352) (4a75d99)
-* Extend timeout for base tests, tweak retry (#351) (8fff4c7)
-* Remove implicit this in tests (#349) (5f58de6)
-
-
-## v2.1.0 (2021-12-09)
-
-Changelog:
-
-* Upgrade ember-cli and dev deps (#348) (e8924e9)
-* Drop Ember global use in favor of native API (#347) (d101d8a)
-* Proper runloop imports (#346) (a765241)
-* Remove property fallback lookup (no implicit this) (#345) (506d798)
-* Modernize `htmlSafe` module imports / More cleanup (#344) (32e9460)
-* Update CI for vertical-collection v2 (#342) (5613faa)
-
-
-## v2.0.1 (2021-12-07)
-
-#### :bug: Bug Fix
-* [#322](https://github.com/html-next/vertical-collection/pull/322) Remove comma in selector list in css ([@CubeSquared](https://github.com/CubeSquared))
-
-#### :house: Internal
-* [#336](https://github.com/html-next/vertical-collection/pull/336) Add rwjblue release-it setup ([@rwwagner90](https://github.com/rwwagner90))
-
-#### Committers: 2
-- Matthew Jacobs ([@CubeSquared](https://github.com/CubeSquared))
-- Robert Wagner ([@rwwagner90](https://github.com/rwwagner90))
-
-
-## 0.5.5
-
-### Pull Requests
-
-- [#128](https://github.com/runspired/smoke-and-mirrors/pull/128) **fix**: only update scroll handler length when elements array changes  *by [adamjmcgrath](https://github.com/adamjmcgrath)*
-- [#126](https://github.com/runspired/smoke-and-mirrors/pull/126) **fix**: update height after render when the item is shown  *by [adamjmcgrath](https://github.com/adamjmcgrath)*
-- [#136](https://github.com/runspired/smoke-and-mirrors/pull/136)  New Release  *by [Chris Thoburn](https://github.com/runspired)*
-- [#137](https://github.com/runspired/smoke-and-mirrors/pull/137)  0.5.5  *by [Chris Thoburn](https://github.com/runspired)*
-
-#### Commits
-
-- [dc04f499](https://github.com/runspired/smoke-and-mirrors/commit/dc04f49924e5b3379df4d97692e5405ad8c393a6) **feat(code-stripping)**: remove classCallChecks for perf, strip unused code from builds *by [Chris Thoburn](https://github.com/runspired)*
-- [bf1c02b4](https://github.com/runspired/smoke-and-mirrors/commit/bf1c02b4fa4c5d32c3bad0df9ab3a9e2086184a5) **fix(scroll-handler)**: only update scroll handler length when elements array changes *by [adamjmcgrath](https://github.com/adamjmcgrath)*
-- [c6399038](https://github.com/runspired/smoke-and-mirrors/commit/c6399038759d46b234f585f48b8e52a1434a1b46) **fix(vertical-item)**: update height after render when the item is shown *by [adamjmcgrath](https://github.com/adamjmcgrath)*
-- [441f7635](https://github.com/runspired/smoke-and-mirrors/commit/441f76359695439ce91bae21cc34309409b6e0bc) **fix(readme)**: cleanup style *by [Chris Thoburn](https://github.com/runspired)*
-
-## 0.5.4
-
-### Pull Requests
-
-- [#106](https://github.com/runspired/smoke-and-mirrors/pull/106)  Patch Release  *by [Chris Thoburn](https://github.com/runspired)*
-- [#107](https://github.com/runspired/smoke-and-mirrors/pull/107)  fix addon dependency issue  *by [Chris Thoburn](https://github.com/runspired)*
-
-## 0.5.3
-
-## 0.5.2
-
-### Pull Requests
-
-- [#105](https://github.com/runspired/smoke-and-mirrors/pull/105)  Fixing links to runspired blog  *by [pete_the_pete](https://github.com/pete-the-pete)*
-- [#107](https://github.com/runspired/smoke-and-mirrors/pull/107)  fix addon dependency issue  *by [Chris Thoburn](https://github.com/runspired)*
-
-## 0.5.1
-
-### Pull Requests
-
-- [#102](https://github.com/runspired/smoke-and-mirrors/pull/102)  patch log output  *by [Chris Thoburn](https://github.com/runspired)*
-- [#104](https://github.com/runspired/smoke-and-mirrors/pull/104)  Include ember-getowner-polyfill in dependencies.  *by [Chris Thoburn](https://github.com/runspired)*
-
-## 0.5.0
-
-### Pull Requests
-
-- [#100](https://github.com/runspired/smoke-and-mirrors/pull/100)  Released 0.4.7  *by [Chris Thoburn](https://github.com/runspired)*
-
-#### Commits
-
-- [fc36460c](https://github.com/runspired/smoke-and-mirrors/commit/fc36460c463da33e53c72c6374373e25b3fde996) **fix(changelog)**: updates changelog from last release *by [Chris Thoburn](https://github.com/runspired)*
-- [132216e5](https://github.com/runspired/smoke-and-mirrors/commit/132216e5acc0fdd0754a23323ffe97ee6018f2c9) **fix(container)**: use getOwner to resolve deprecation *by [Chris Thoburn](https://github.com/runspired)*
-- [e68fcb43](https://github.com/runspired/smoke-and-mirrors/commit/e68fcb43f19517c976ec0cd31b0e3dfe4ee0babe) **fix(visualizer)**: improves teardown *by [Chris Thoburn](https://github.com/runspired)*
-- [90138118](https://github.com/runspired/smoke-and-mirrors/commit/90138118c154144c7c29f5d8abab2a60f0d7571d) **fix(geography)**: ensures that destroy sequence completes before update sequence *by [Chris Thoburn](https://github.com/runspired)*
-- [a6afb468](https://github.com/runspired/smoke-and-mirrors/commit/a6afb46808a3caa7424c09687d80ed658015c995) **fix(geography)**: don't cycle if we don't have any components *by [Chris Thoburn](https://github.com/runspired)*
-
-## 0.4.7
-
-- [c4aabc20](https://github.com/runspired/smoke-and-mirrors/commit/c4aabc209f2d42668c12b5c121a363384c7b42c4) **fix(changelog-config)**: generate changelog from the develop branch *by [Chris Thoburn](https://github.com/runspired)*
-- [917e2e8c](https://github.com/runspired/smoke-and-mirrors/commit/917e2e8c2886116092f38fefb8bf5da2dd70adca) **fix(vertical-collection)**: removes template logic that crept in from smart-collection *by [Chris Thoburn](https://github.com/runspired)*
-- [#97](https://github.com/runspired/smoke-and-mirrors/pull/97)  Chore/dependencies  *by [Chris Thoburn](https://github.com/runspired/chore)*
-- [#99](https://github.com/runspired/smoke-and-mirrors/pull/99)  Fix (Firefox)  *by [Chris Thoburn](https://github.com/runspired)*
-
-## 0.4.6
-
-## 0.0.0
-
-- Hold Your Horses,
-- Pack Your Parachutes,
-- We're Coming,
-- But we haven't released anything yet.

package/README.md

@@ -1,122 +0,0 @@
-# vertical-collection
-
-[![Greenkeeper badge](https://badges.greenkeeper.io/html-next/vertical-collection.svg)](https://greenkeeper.io/)
-
-[![Build Status](https://travis-ci.org/html-next/vertical-collection.svg)](https://travis-ci.org/html-next/vertical-collection)
-
-Infinite Scroll and Occlusion at > 60FPS
-
-`vertical-collection` is an `ember-addon` that is part of the `smoke-and-mirrors` framework. It
-focuses on improving initial and re-render performance in high-stress situations by providing a
-component for performant lists and `svelte renders` to match a core belief:
-**Don't render the universe, render the scene.**
-
-#### TL;DR svelte render: the fewer things you need to render, the faster your renders will be.
-
-Your web page is a universe, your viewport is the scene. Much like you wouldn't expect a video game to render
-out-of-scene content, your application should smartly cull the content it doesn't need to care about. Trimming
-excess content lets the browser perform both initial renders and re-renders at far higher frame-rates, as the only
-content it needs to focus on for layout is the content the user can see.
-
-`vertical-collection` augments your existing app, it doesn't ask you to rewrite layouts or logic in order to use it.
-It will try its best to allow you to keep the conventions, structures, and layouts you want.
-
-## Install
-
-```bash
-ember install @html-next/vertical-collection
-```
-
-## Usage
-
-```htmlbars
-<VerticalCollection
-    @items={{items}}
-    @tagName="ul"
-    @estimateHeight={{50}}
-    @staticHeight={{false}}
-    @bufferSize={{1}}
-    @renderAll={{false}}
-    @renderFromLast={{false}}
-    @idForFirstItem={{idForFirstItem}}
-    @firstReached={{firstReachedCallback}}
-    @lastReached={{lastReachedCallback}}
-    @firstVisibleChanged={{firstVisibleChangedCallback}}
-    @lastVisibleChanged={{lastVisibleChangedCallback}}
-     as |item i|>
-    <li>
-      {{item.number}} {{i}}
-    </li>
-</VerticalCollection>
-```
-
-### Actions
-
-`firstReached` - Triggered when scroll reaches the first element in the collection
-
-`lastReached`- Triggered when scroll reaches the last element in the collection
-
-`firstVisibleChanged` - Triggered when the first element in the viewport changes
-
-`lastVisibleChanged` - Triggered when the last element in the viewport changes
-
-## Support Matrix
-
-| `vertical-collection` version | Supported Ember versions | Supported Node versions |
-| ----------------------------- | ------------------------ | ----------------------- |
-| `^v1.x.x`                     | `v1.12.0 - v3.8.x`       | `?`                     |
-| `^v2.x.x`                     | `v2.8.0 - v3.26.x`       | `v12 - ?`               |
-| `^v3.x.x`                     | `v2.18.0+`               | `v14+`                  |
-| `^v4.x.x`                     | `v3.12.0+`               | `v14+`                  |
-
-## Support, Questions, Collaboration
-
-Join the [Ember community on Discord](https://discord.gg/zT3asNS)
-
-## Features
-
-### Infinite Scroll (bi-directional)
-
-Infinite scroll that remains performant even for very long lists is easily achievable
-with the [`vertical-collection`](http://html-next.github.io/vertical-collection/#/settings).
-It works via a scrollable div or scrollable body.
-
-- [bi-directional scrollable div](http://html-next.github.io/vertical-collection/#/examples/infinite-scroll)
-- [scrollable body](http://html-next.github.io/vertical-collection/#/examples/scrollable-body)
-- [dynamic content sizes](http://html-next.github.io/vertical-collection/#/examples/flexible-layout)
-- [as a table](http://html-next.github.io/vertical-collection/#/examples/dbmon)
-
-### Svelte Everything
-
-If it can be trimmer, vertical-collection likes to trim it.
-
-## Status
-
-[Changelog](./CHANGELOG.md)
-
-[![Build Status](https://travis-ci.org/html-next/vertical-collection.svg)](https://travis-ci.org/html-next/vertical-collection)
-[![dependencies](https://david-dm.org/html-next/vertical-collection.svg)](https://david-dm.org/html-next/vertical-collection)
-[![devDependency Status](https://david-dm.org/html-next/vertical-collection/dev-status.svg)](https://david-dm.org/html-next/vertical-collection#info=devDependencies)
-[![Coverage Status](https://coveralls.io/repos/html-next/vertical-collection/badge.svg?branch=master&service=github)](https://coveralls.io/github/html-next/vertical-collection?branch=master)
-
-## Documentation
-
-For updated documentation and demos see [http://html-next.github.io/vertical-collection/](http://html-next.github.io/vertical-collection/)
-
-## Contributing
-
-- Open an Issue for discussion first if you're unsure a feature/fix is wanted.
-- Branch off of `master` (default branch)
-- Use descriptive branch names (e.g. `<type>/<short-description>`)
-- PR against `master` (default branch).
-
-### Testing
-
-Make sure you register the test waiter from [ember-raf-scheduler](https://github.com/html-next/ember-raf-scheduler). So `ember-test-helpers`'s `wait` is aware of the scheduled updates.
-
-An example can be found [here](https://github.com/html-next/vertical-collection/blob/master/tests/test-helper.js#L2)
-
-License
-------------------------------------------------------------------------------
-
-This project is licensed under the [MIT License](LICENSE.md).

package/RELEASE.md

@@ -1,74 +0,0 @@
-# Release Process
-
-Releases are mostly automated using
-[release-it](https://github.com/release-it/release-it/) and
-[lerna-changelog](https://github.com/lerna/lerna-changelog/).
-
-## Preparation
-
-Since the majority of the actual release process is automated, the primary
-remaining task prior to releasing is confirming that all pull requests that
-have been merged since the last release have been labeled with the appropriate
-`lerna-changelog` labels and the titles have been updated to ensure they
-represent something that would make sense to our users. Some great information
-on why this is important can be found at
-[keepachangelog.com](https://keepachangelog.com/en/1.0.0/), but the overall
-guiding principle here is that changelogs are for humans, not machines.
-
-When reviewing merged PR's the labels to be used are:
-
-* breaking - Used when the PR is considered a breaking change.
-* enhancement - Used when the PR adds a new feature or enhancement.
-* bug - Used when the PR fixes a bug included in a previous release.
-* documentation - Used when the PR adds or updates documentation.
-* internal - Used for internal changes that still require a mention in the
-  changelog/release notes.
-
-## Release
-
-Once the prep work is completed, the actual release is straight forward:
-
-* First, ensure that you have installed your projects dependencies:
-
-```sh
-yarn install
-```
-
-* Second, ensure that you have obtained a
-  [GitHub personal access token][generate-token] with the `repo` scope (no
-  other permissions are needed). Make sure the token is available as the
-  `GITHUB_AUTH` environment variable.
-
-  For instance:
-
-  ```bash
-  export GITHUB_AUTH=abc123def456
-  ```
-
-[generate-token]: https://github.com/settings/tokens/new?scopes=repo&description=GITHUB_AUTH+env+variable
-
-* And last (but not least 😁) do your release.
-
-```sh
-npx release-it
-```
-
-[release-it](https://github.com/release-it/release-it/) manages the actual
-release process. It will prompt you to to choose the version number after which
-you will have the chance to hand tweak the changelog to be used (for the
-`CHANGELOG.md` and GitHub release), then `release-it` continues on to tagging,
-pushing the tag and commits, etc.
-
-To start a prerelease branch for a new major use:
-
-```sh
-npx release-it major --preRelease=beta
-```
-
-On subsequent prerelease run:
-
-```sh
-npx release-it --preRelease
-```
-
-For more guidance see https://github.com/release-it/release-it/blob/master/docs/pre-releases.md

package/addon/-private/data-view/utils/object-at.js

@@ -1,7 +0,0 @@
-import { assert } from '@ember/debug';
-
-export default function objectAt(arr, index) {
-  assert('arr must be an instance of a Javascript Array or implement `objectAt`', Array.isArray(arr) || typeof arr.objectAt === 'function');
-
-  return arr.objectAt ? arr.objectAt(index) : arr[index];
-}

package/addon/components/vertical-collection/template.hbs

@@ -1,13 +0,0 @@
-{{#each this.virtualComponents key="id" as |virtualComponent| ~}}
-  {{~unbound virtualComponent.upperBound~}}
-  {{~#if virtualComponent.isOccludedContent ~}}
-    {{{unbound virtualComponent.element}}}
-  {{~else~}}
-    {{~yield virtualComponent.content virtualComponent.index ~}}
-  {{~/if~}}
-  {{~unbound virtualComponent.lowerBound~}}
-{{~/each}}
-
-{{#if this.shouldYieldToInverse}}
-  {{yield to="inverse"}}
-{{/if}}

package/app/components/vertical-collection.js

@@ -1 +0,0 @@
-export { default } from '@html-next/vertical-collection/components/vertical-collection/component';

package/bin/restore-env.sh

@@ -1 +0,0 @@
-export EMBER_OPTIONAL_FEATURES=$(cat __env)

package/bin/run-tests-with-retry.sh

@@ -1,24 +0,0 @@
-#!/bin/bash
-
-function retry {
-    command="$*"
-    retval=1
-    attempt=1
-    until [[ $retval -eq 0 ]] || [[ $attempt -gt 4 ]]; do
-        # Execute inside of a subshell in case parent
-        # script is running with "set -e"
-        (
-            set +e
-            $command
-        )
-        retval=$?
-        attempt=$(( $attempt + 1 ))
-        if [[ $retval -ne 0 ]]; then
-            # If there was an error wait 10 seconds
-            sleep 1
-        fi
-    done
-    exit $retval
-}
-
-yarn run ember build && retry yarn run ember test --path=dist

package/bin/stash-env.sh

@@ -1 +0,0 @@
- printf '%s' "$EMBER_OPTIONAL_FEATURES" > __env

package/config/ember-cli-toolbelts.json

@@ -1 +0,0 @@
-{}

package/config/environment.js

@@ -1,5 +0,0 @@
-'use strict';
-
-module.exports = function(/* environment, appConfig */) {
-  return { };
-};

package/index.js

@@ -1,157 +0,0 @@
-'use strict';
-
-const StripClassCallCheckPlugin = require.resolve('babel6-plugin-strip-class-callcheck');
-const Funnel = require('broccoli-funnel');
-const Rollup = require('broccoli-rollup');
-const merge = require('broccoli-merge-trees');
-const VersionChecker = require('ember-cli-version-checker');
-
-module.exports = {
-  name: require('./package').name,
-
-  init() {
-    this._super.init && this._super.init.apply(this, arguments);
-
-    this.options = this.options || {};
-  },
-
-  getOutputDirForVersion() {
-    return '';
-  },
-
-    // Borrowed from ember-cli-babel
-    _emberVersionRequiresModulesAPIPolyfill() {
-      let checker = this.checker.for('ember-source', 'npm');
-
-      if (!checker.exists()) {
-        return true;
-      }
-
-      return checker.lt('3.27.0-alpha.1');
-    },
-
-  treeForAddon(tree) {
-    let babel = this.addons.find((addon) => addon.name === 'ember-cli-babel');
-    let withPrivate = new Funnel(tree, { include: ['-private/**'] });
-    let withoutPrivate = new Funnel(tree, {
-      exclude: [
-        '**/**.hbs',
-        '-private'
-      ],
-      destDir: '@html-next/vertical-collection'
-    });
-
-    let privateTree = babel.transpileTree(withPrivate, {
-      babel: this.options.babel,
-      'ember-cli-babel': {
-        // we leave our output as valid ES
-        // for the consuming app's config to transpile as desired
-        // so we don't want to compileModules to amd here
-        compileModules: false,
-
-        disableEmberModulesAPIPolyfill: !this._emberVersionRequiresModulesAPIPolyfill(),
-
-        // TODO for the embroider world we want to leave our -private module
-        // as an es module and only transpile the few things we genuinely care about.
-        // ideally this would occur as a pre-publish step so that consuming apps would
-        // just see a `-private.js` file and not pay any additional costs.
-        // CURRENTLY we transpile the -private module fully acccording to the
-        // consuming app's config, so we must leave these enabled.
-        disablePresetEnv: false,
-        disableDebugTooling: false,
-        disableDecoratorTransforms: false,
-        enableTypeScriptTransform: true,
-
-        throwUnlessParallelizable: true,
-
-        // consuming app will take care of this if needed,
-        // we don't need to also include
-        includePolyfill: false,
-
-        extensions: ['js', 'ts'],
-      },
-    });
-
-    const templateTree = new Funnel(tree, {
-      include: ['**/**.hbs']
-    });
-
-    // use the default options
-    const addonTemplateTree = this._super(templateTree);
-    let publicTree = babel.transpileTree(withoutPrivate);
-
-    privateTree = new Rollup(privateTree, {
-      rollup: {
-        input: '-private/index.js',
-        output: [
-          {
-            file: '@html-next/vertical-collection/-private.js',
-            format: 'amd',
-            amd: {
-              id: '@html-next/vertical-collection/-private'
-            }
-          }
-        ],
-        external(id) {
-          return (
-            id.startsWith('@ember/') ||
-            ['ember', 'ember-raf-scheduler'].includes(id)
-          );
-        },
-      },
-    });
-
-    let destDir = this.getOutputDirForVersion();
-    publicTree = new Funnel(publicTree, { destDir });
-    privateTree = new Funnel(privateTree, { destDir });
-
-    return merge([
-      addonTemplateTree,
-      publicTree,
-      privateTree
-    ]);
-  },
-
-  _hasSetupBabelOptions: false,
-  buildBabelOptions(originalOptions) {
-    const plugins = originalOptions.plugins || [];
-
-    const opts = {
-      loose: true,
-      plugins,
-      postTransformPlugins: [[StripClassCallCheckPlugin, {}]]
-    };
-
-    return opts;
-  },
-  _setupBabelOptions() {
-    if (this._hasSetupBabelOptions) {
-      return;
-    }
-
-    this.options.babel = this.buildBabelOptions(this.options.babel);
-
-    this._hasSetupBabelOptions = true;
-  },
-
-  included(app) {
-    this._super.included.apply(this, arguments);
-    this.checker = new VersionChecker(app);
-
-    while (typeof app.import !== 'function' && app.app) {
-      app = app.app;
-    }
-
-    if (typeof app.import !== 'function') {
-      throw new Error('vertical-collection is being used within another addon or engine '
-        + 'and is having trouble registering itself to the parent application.');
-    }
-
-    this._env = app.env;
-    this._setupBabelOptions(app.env);
-
-    if (!/production/.test(app.env) && !/test/.test(app.env)) {
-      this.import('vendor/debug.css');
-    }
-  }
-};

package/vendor/debug.css

@@ -1,62 +0,0 @@
-/**!
-  Visualization Classes for debugging the vertical-collection
-  */
-.vertical-collection-visual-debugger {
-  height: 100%;
-  position: fixed;
-  z-index: 1000;
-  top: 0;
-  left: 0;
-  display: flex;
-  align-items: center;
-  justify-content: left;
-  background: rgba(50, 50, 50, 1);
-  width: 125px;
-}
-
-.vertical-collection-visual-debugger .vc_visualization-container {
-  transform: scale(0.25);
-  left: 0;
-  position: relative;
-}
-
-
-.vertical-collection-visual-debugger .vc_visualization-screen {
-  position: absolute;
-  background: transparent;
-  box-sizing: content-box;
-  border-top: 2px dashed yellow;
-  border-bottom: 2px dashed yellow;
-  width: 500px;
-}
-
-.vertical-collection-visual-debugger .vc_visualization-scroll-container {
-  position: absolute;
-  width: 500px;
-  background: rgba(100, 230, 100, 0.65);
-}
-
-.vertical-collection-visual-debugger .vc_visualization-item-container {
-  position: absolute;
-  width: 500px;
-  background: rgba(255, 255, 255, .15);
-}
-
-.vertical-collection-visual-debugger .vc_visualization-virtual-component {
-  box-sizing: border-box;
-  background: rgba(230, 100, 230, 0.6);
-  border: 1px dotted #bbb;
-  border-top: 0px;
-  color: #fff;
-  text-align: center;
-  font-size: 2.5em;
-  width: 250px;
-}
-
-.vertical-collection-visual-debugger .vc_visualization-virtual-component:first-of-type {
-  border-top: 1px dotted #bbb;
-}
-
-.vertical-collection-visual-debugger .vc_visualization-virtual-component.culled {
-  background: transparent;
-}