-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathchunk-AWH3NDL5.js
More file actions
97 lines (96 loc) · 7.1 KB
/
chunk-AWH3NDL5.js
File metadata and controls
97 lines (96 loc) · 7.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
import {
CdkDrag,
CdkDragPlaceholder,
CdkDropList,
moveItemInArray
} from "./chunk-B2C7H6VM.js";
import "./chunk-H7FALWCD.js";
import "./chunk-OV2CFM4K.js";
import {
Component,
__name,
__publicField,
setClassMetadata,
ɵsetClassDebugInfo,
ɵɵadvance,
ɵɵdefineComponent,
ɵɵelement,
ɵɵelementEnd,
ɵɵelementStart,
ɵɵlistener,
ɵɵrepeater,
ɵɵrepeaterCreate,
ɵɵrepeaterTrackByIdentity,
ɵɵtemplate,
ɵɵtext,
ɵɵtextInterpolate1
} from "./chunk-2CX5BJWG.js";
// src/content/examples/drag-drop/src/custom-placeholder/app/app.component.ts
function CdkDragDropCustomPlaceholderExample_For_2_div_1_Template(rf, ctx) {
if (rf & 1) {
\u0275\u0275element(0, "div", 3);
}
}
__name(CdkDragDropCustomPlaceholderExample_For_2_div_1_Template, "CdkDragDropCustomPlaceholderExample_For_2_div_1_Template");
function CdkDragDropCustomPlaceholderExample_For_2_Template(rf, ctx) {
if (rf & 1) {
\u0275\u0275elementStart(0, "div", 1);
\u0275\u0275template(1, CdkDragDropCustomPlaceholderExample_For_2_div_1_Template, 1, 0, "div", 2);
\u0275\u0275text(2);
\u0275\u0275elementEnd();
}
if (rf & 2) {
const movie_r1 = ctx.$implicit;
\u0275\u0275advance(2);
\u0275\u0275textInterpolate1(" ", movie_r1, " ");
}
}
__name(CdkDragDropCustomPlaceholderExample_For_2_Template, "CdkDragDropCustomPlaceholderExample_For_2_Template");
var _CdkDragDropCustomPlaceholderExample = class _CdkDragDropCustomPlaceholderExample {
movies = [
"Episode I - The Phantom Menace",
"Episode II - Attack of the Clones",
"Episode III - Revenge of the Sith",
"Episode IV - A New Hope",
"Episode V - The Empire Strikes Back",
"Episode VI - Return of the Jedi",
"Episode VII - The Force Awakens",
"Episode VIII - The Last Jedi",
"Episode IX - The Rise of Skywalker"
];
drop(event) {
moveItemInArray(this.movies, event.previousIndex, event.currentIndex);
}
};
__name(_CdkDragDropCustomPlaceholderExample, "CdkDragDropCustomPlaceholderExample");
__publicField(_CdkDragDropCustomPlaceholderExample, "\u0275fac", /* @__PURE__ */ __name(function CdkDragDropCustomPlaceholderExample_Factory(__ngFactoryType__) {
return new (__ngFactoryType__ || _CdkDragDropCustomPlaceholderExample)();
}, "CdkDragDropCustomPlaceholderExample_Factory"));
__publicField(_CdkDragDropCustomPlaceholderExample, "\u0275cmp", /* @__PURE__ */ \u0275\u0275defineComponent({ type: _CdkDragDropCustomPlaceholderExample, selectors: [["cdk-drag-drop-custom-placeholder-example"]], decls: 3, vars: 0, consts: [["cdkDropList", "", 1, "example-list", 3, "cdkDropListDropped"], ["cdkDrag", "", 1, "example-box"], ["class", "example-custom-placeholder", 4, "cdkDragPlaceholder"], [1, "example-custom-placeholder"]], template: /* @__PURE__ */ __name(function CdkDragDropCustomPlaceholderExample_Template(rf, ctx) {
if (rf & 1) {
\u0275\u0275elementStart(0, "div", 0);
\u0275\u0275listener("cdkDropListDropped", /* @__PURE__ */ __name(function CdkDragDropCustomPlaceholderExample_Template_div_cdkDropListDropped_0_listener($event) {
return ctx.drop($event);
}, "CdkDragDropCustomPlaceholderExample_Template_div_cdkDropListDropped_0_listener"));
\u0275\u0275repeaterCreate(1, CdkDragDropCustomPlaceholderExample_For_2_Template, 3, 1, "div", 1, \u0275\u0275repeaterTrackByIdentity);
\u0275\u0275elementEnd();
}
if (rf & 2) {
\u0275\u0275advance();
\u0275\u0275repeater(ctx.movies);
}
}, "CdkDragDropCustomPlaceholderExample_Template"), dependencies: [CdkDropList, CdkDrag, CdkDragPlaceholder], styles: ["\n\n.example-list[_ngcontent-%COMP%] {\n width: 500px;\n max-width: 100%;\n border: solid 1px #ccc;\n min-height: 60px;\n display: block;\n background: white;\n border-radius: 4px;\n overflow: hidden;\n}\n.example-box[_ngcontent-%COMP%] {\n padding: 20px 10px;\n border-bottom: solid 1px #ccc;\n color: rgba(0, 0, 0, 0.87);\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n cursor: move;\n background: white;\n font-size: 14px;\n}\n.cdk-drag-preview[_ngcontent-%COMP%] {\n box-sizing: border-box;\n border-radius: 4px;\n box-shadow:\n 0 5px 5px -3px rgba(0, 0, 0, 0.2),\n 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n 0 3px 14px 2px rgba(0, 0, 0, 0.12);\n}\n.cdk-drag-animating[_ngcontent-%COMP%] {\n transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);\n}\n.example-box[_ngcontent-%COMP%]:last-child {\n border: none;\n}\n.example-list.cdk-drop-list-dragging[_ngcontent-%COMP%] .example-box[_ngcontent-%COMP%]:not(.cdk-drag-placeholder) {\n transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);\n}\n.example-custom-placeholder[_ngcontent-%COMP%] {\n background: #ccc;\n border: dotted 3px #999;\n min-height: 60px;\n transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);\n}\n/*# sourceMappingURL=app.component.css.map */"] }));
var CdkDragDropCustomPlaceholderExample = _CdkDragDropCustomPlaceholderExample;
(() => {
(typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkDragDropCustomPlaceholderExample, [{
type: Component,
args: [{ selector: "cdk-drag-drop-custom-placeholder-example", standalone: true, imports: [CdkDropList, CdkDrag, CdkDragPlaceholder], template: '<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">\n @for (movie of movies; track movie) {\n <div class="example-box" cdkDrag>\n <div class="example-custom-placeholder" *cdkDragPlaceholder></div>\n {{movie}}\n </div>\n }\n</div>\n', styles: ["/* src/content/examples/drag-drop/src/custom-placeholder/app/app.component.css */\n.example-list {\n width: 500px;\n max-width: 100%;\n border: solid 1px #ccc;\n min-height: 60px;\n display: block;\n background: white;\n border-radius: 4px;\n overflow: hidden;\n}\n.example-box {\n padding: 20px 10px;\n border-bottom: solid 1px #ccc;\n color: rgba(0, 0, 0, 0.87);\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n cursor: move;\n background: white;\n font-size: 14px;\n}\n.cdk-drag-preview {\n box-sizing: border-box;\n border-radius: 4px;\n box-shadow:\n 0 5px 5px -3px rgba(0, 0, 0, 0.2),\n 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n 0 3px 14px 2px rgba(0, 0, 0, 0.12);\n}\n.cdk-drag-animating {\n transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);\n}\n.example-box:last-child {\n border: none;\n}\n.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) {\n transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);\n}\n.example-custom-placeholder {\n background: #ccc;\n border: dotted 3px #999;\n min-height: 60px;\n transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);\n}\n/*# sourceMappingURL=app.component.css.map */\n"] }]
}], null, null);
})();
(() => {
(typeof ngDevMode === "undefined" || ngDevMode) && \u0275setClassDebugInfo(CdkDragDropCustomPlaceholderExample, { className: "CdkDragDropCustomPlaceholderExample", filePath: "src/content/examples/drag-drop/src/custom-placeholder/app/app.component.ts", lineNumber: 20 });
})();
export {
CdkDragDropCustomPlaceholderExample
};
//# sourceMappingURL=chunk-AWH3NDL5.js.map