1 | import { MasonryGrid, MasonryGridOptions } from "@egjs/grid";
|
2 | import InfiniteGrid from "../InfiniteGrid";
|
3 | import { InfiniteGridOptions } from "../types";
|
4 | import { InfiniteGridGetterSetter } from "../utils";
|
5 |
|
6 | /**
|
7 | * @typedef
|
8 | * @extends InfiniteGridOptions
|
9 | * @extends Grid.MasonryGrid.MasonryGridOptions
|
10 | */
|
11 | export interface MasonryInfiniteGridOptions extends MasonryGridOptions, InfiniteGridOptions {
|
12 | }
|
13 |
|
14 | /**
|
15 | * MasonryInfiniteGrid is a grid that stacks items with the same width as a stack of bricks. Adjust the width of all images to the same size, find the lowest height column, and insert a new item.
|
16 | * @ko MasonryInfiniteGrid는 벽돌을 쌓아 올린 모양처럼 동일한 너비를 가진 아이템을 쌓는 레이아웃이다. 모든 이미지의 너비를 동일한 크기로 조정하고, 가장 높이가 낮은 열을 찾아 새로운 이미지를 삽입한다. 따라서 배치된 아이템 사이에 빈 공간이 생기지는 않지만 배치된 레이아웃의 아래쪽은 울퉁불퉁해진다.
|
17 | * @param {HTMLElement | string} container - A base element for a module <ko>모듈을 적용할 기준 엘리먼트</ko>
|
18 | * @param {MasonryInfiniteGridOptions} options - The option object of the MasonryInfiniteGrid module <ko>MasonryInfiniteGrid 모듈의 옵션 객체</ko>
|
19 | */
|
20 |
|
21 | export class MasonryInfiniteGrid extends InfiniteGrid<MasonryInfiniteGridOptions> {
|
22 | public static propertyTypes = {
|
23 | ...InfiniteGrid.propertyTypes,
|
24 | ...MasonryGrid.propertyTypes,
|
25 | };
|
26 | public static defaultOptions: Required<MasonryInfiniteGridOptions> = {
|
27 | ...InfiniteGrid.defaultOptions,
|
28 | ...MasonryGrid.defaultOptions,
|
29 | gridConstructor: MasonryGrid,
|
30 | } as const;
|
31 | }
|