@egjs/svelte-infinitegrid 3.2.5 → 4.0.1-beta.1

package/.editorconfig

@@ -1,3 +0,0 @@
-[{*.svelte}]
-indent_style = space
-indent_size = 2

package/LICENSE

@@ -1,19 +0,0 @@
-Copyright (c) 2019-present NAVER Corp.
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.  IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.

package/babel.config.js

@@ -1,10 +0,0 @@
-module.exports = {
-	presets: [
-		[
-			"@babel/preset-env",
-			{
-				modules: "cjs",
-			},
-		],
-	],
-};

package/jest.config.js

@@ -1,14 +0,0 @@
-module.exports = {
-	testMatch: ["<rootDir>/test/unit/**/*.spec.ts"],
-	transform: {
-		"^.+\\.svelte$": [
-			"svelte-jester",
-			{
-				preprocess: true,
-			},
-		],
-		"^.+\\.js$": "babel-jest",
-		"^.+\\.ts$": "ts-jest",
-	},
-	moduleFileExtensions: ["ts", "js", "svelte"],
-};

package/rollup_start_dev.js

@@ -1,12 +0,0 @@
-import * as child_process from 'child_process';
-
-let running_dev_server = false;
-
-export default {
-	writeBundle() {
-		if (!running_dev_server) {
-			running_dev_server = true;
-			child_process.spawn('npm', ['run', 'start:dev'], { stdio: ['ignore', 'inherit', 'inherit'], shell: true });
-		}
-	},
-};

package/src/LoadingChecker.svelte

@@ -1,9 +0,0 @@
-<script>
-import { onMount, onDestroy } from "svelte";
-
-export let hasLoading = true;
-
-onMount(() => {
-    hasLoading = false;
-});
-</script>

package/src/demo/App.svelte

@@ -1,86 +0,0 @@
-<script lang="ts">
-  import InfinitGrid from "../index.js";
-  let ig;
-  let items = [];
-  let loading;
-
-  function loadItems(groupKey, nextKey, itemCount) {
-    const nextItems = [];
-
-    for (let i = 0; i < itemCount; ++i) {
-      nextItems.push({ groupKey, key: nextKey + i });
-    }
-    return nextItems;
-  }
-  function onAppend({ detail: { groupKey, startLoading } }) {
-    if (ig.isProcessing()) {
-      return;
-    }
-    startLoading();
-    const nextGroupKey = (parseFloat(groupKey) || 0) + 1;
-    const nextKey = items.length;
-
-    items = [...items, ...loadItems(nextGroupKey, nextKey, 10)];
-  }
-  function onLayoutComplete({ detail: { isLayout, endLoading } }) {
-    !isLayout && endLoading();
-  }
-</script>
-
-<style>
-  .item {
-    width: 250px;
-    opacity: 1;
-  }
-  .item .thumbnail {
-    max-height: 300px;
-    overflow: hidden;
-    border-radius: 8px;
-  }
-  .item .thumbnail img {
-    width: 100%;
-    border-radius: 8px;
-  }
-  .item .info {
-    margin-top: 10px;
-    font-weight: bold;
-    color: #777;
-  }
-  .item.animate {
-    transition: opacity ease 1s;
-    transition-delay: 0.2s;
-    opacity: 1;
-  }
-  .loading {
-    position: absolute;
-    width: 100%;
-    height: 50px;
-    line-height: 50px;
-    text-align: center;
-    font-weight: bold;
-  }
-</style>
-
-<InfinitGrid
-  bind:this={ig}
-  {items}
-  {loading}
-  itemBy={item => item.key}
-  groupBy={item => item.groupKey}
-  options={{ isConstantSize: true, transitionDuration: 0.2 }}
-  layoutOptions={{ margin: 10, align: 'center' }}
-  on:append={onAppend}
-  on:layoutComplete={onLayoutComplete}
-  let:visibleItems>
-  {#each visibleItems as item (item.key)}
-    <div class="item">
-      <div class="thumbnail">
-        <img
-          src={`https://naver.github.io/egjs-infinitegrid/assets/image/${(item.key % 59) + 1}.jpg`}
-          alt="egjs" />
-      </div>
-      <div class="info">{`egjs ${item.key}`}</div>
-    </div>
-  {/each}
-  <div bind:this={loading} slot="loading">Loading</div>
-</InfinitGrid>

package/src/demo/useFirstRender.svelte

@@ -1,67 +0,0 @@
-<script lang="ts">
-  import InfinitGrid from "../index.js";
-
-  const items = [
-    {
-      groupKey: 1,
-      key: 1,
-    },
-    {
-      groupKey: 2,
-      key: 2,
-    },
-  ];
-</script>
-
-<style>
-  .item {
-    width: 250px;
-    opacity: 1;
-  }
-  .item .thumbnail {
-    max-height: 300px;
-    overflow: hidden;
-    border-radius: 8px;
-  }
-  .item .thumbnail img {
-    width: 100%;
-    border-radius: 8px;
-  }
-  .item .info {
-    margin-top: 10px;
-    font-weight: bold;
-    color: #777;
-  }
-  .item.animate {
-    transition: opacity ease 1s;
-    transition-delay: 0.2s;
-    opacity: 1;
-  }
-  .loading {
-    position: absolute;
-    width: 100%;
-    height: 50px;
-    line-height: 50px;
-    text-align: center;
-    font-weight: bold;
-  }
-</style>
-<InfinitGrid
-  {items}
-  itemBy={item => item.key}
-  groupBy={item => item.groupKey}
-  useFirstRender={true}
-  options={{ isConstantSize: true, transitionDuration: 0.2 }}
-  layoutOptions={{ margin: 10, align: 'center' }}
-  let:visibleItems>
-  {#each visibleItems as item (item.key)}
-    <div class="item">
-      <div class="thumbnail">
-        <img
-          src={`https://naver.github.io/egjs-infinitegrid/assets/image/${(item.key % 59) + 1}.jpg`}
-          alt="egjs" />
-      </div>
-      <div class="info">{`egjs ${item.key}`}</div>
-    </div>
-  {/each}
-</InfinitGrid>

package/src/layouts/FrameLayout.js

@@ -1,9 +0,0 @@
-import InfiniteGrid from "../InfiniteGrid.svelte";
-import { FrameLayout as layoutType } from "@egjs/infinitegrid";
-
-export default class FrameLayout extends InfiniteGrid {
-	constructor(options) {
-		options.props.layoutType = layoutType;
-		super(options);
-	}
-}

package/src/layouts/GridLayout.js

@@ -1,9 +0,0 @@
-import InfiniteGrid from "../InfiniteGrid.svelte";
-import { GridLayout as layoutType } from "@egjs/infinitegrid";
-
-export default class GridLayout extends InfiniteGrid {
-	constructor(options) {
-		options.props.layoutType = layoutType;
-		super(options);
-	}
-}

package/src/layouts/JustifiedLayout.js

@@ -1,9 +0,0 @@
-import InfiniteGrid from "../InfiniteGrid.svelte";
-import { JustifiedLayout as layoutType } from "@egjs/infinitegrid";
-
-export default class JustifiedLayout extends InfiniteGrid {
-	constructor(options) {
-		options.props.layoutType = layoutType;
-		super(options);
-	}
-}

package/src/layouts/PackingLayout.js

@@ -1,9 +0,0 @@
-import InfiniteGrid from "../InfiniteGrid.svelte";
-import { PackingLayout as layoutType } from "@egjs/infinitegrid";
-
-export default class PackingLayout extends InfiniteGrid {
-	constructor(options) {
-		options.props.layoutType = layoutType;
-		super(options);
-	}
-}

package/src/layouts/SquareLayout.js

@@ -1,9 +0,0 @@
-import InfiniteGrid from "../InfiniteGrid.svelte";
-import { SquareLayout as layoutType } from "@egjs/infinitegrid";
-
-export default class SquareLayout extends InfiniteGrid {
-	constructor(options) {
-		options.props.layoutType = layoutType;
-		super(options);
-	}
-}

package/svelte.config.js

@@ -1,5 +0,0 @@
-const sveltePreprocess = require('svelte-preprocess');
-
-module.exports = {
-    preprocess: sveltePreprocess(),
-};

package/test/unit/demo.spec.ts

@@ -1,23 +0,0 @@
-import "@testing-library/jest-dom/extend-expect";
-import {render} from "@testing-library/svelte";
-import App from "../../src/demo/App.svelte";
-import useFirstRender from "../../src/demo/useFirstRender.svelte";
-
-describe("test svelte-infinitegrid", () => {
-	it("should check if the demo works", () => {
-		// Given, When
-		render(App);
-
-		// Then
-		// If it works, no error occurs.
-		expect(true).toBe(true);
-	});
-	it("should check if useFirstRender demo works", () => {
-		// Given, When
-		render(useFirstRender);
-
-		// Then
-		// If it works, no error occurs.
-		expect(true).toBe(true);
-	});
-});