@orangelogic/design-system 2.192.0 → 2.194.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/library/chunks/{asset-link-format.CDd4iPA2.js → asset-link-format.CODyaNDa.js} +937 -916
- package/library/chunks/{color-swatch-group.NOcRP-23.js → color-swatch-group.D1p1ayBo.js} +1 -1
- package/library/chunks/{document-viewer.CRluR-_W.js → document-viewer.DnowPH70.js} +2 -2
- package/library/chunks/{image.CiQwSDfe.js → image.BSvc6eti.js} +10 -6
- package/library/chunks/transformation.JkkMVin_.js +334 -0
- package/library/components/asset-link-format.js +2 -2
- package/library/components/atoms.js +2 -2
- package/library/components/color-swatch-group.js +1 -1
- package/library/components/document-viewer.js +2 -2
- package/library/components/image.js +1 -1
- package/library/components/masonry.js +119 -111
- package/library/components/organisms.js +2 -2
- package/library/components/types.js +15193 -15150
- package/library/components/video.js +1 -1
- package/library/package.json +1 -1
- package/library/packages/atoms/src/components/image/image.d.ts +2 -0
- package/library/packages/molecules/src/masonry/masonry.d.ts +1 -1
- package/library/packages/organisms/src/content-builder/blocks/image/image.d.ts +8 -0
- package/library/packages/organisms/src/content-builder-viewer/content-builder-viewer.d.ts +5 -5
- package/library/packages/services/src/api/asset/asset.d.ts +11 -3
- package/library/packages/types/src/gallery-item.d.ts +1 -0
- package/library/packages/types/src/masonry.d.ts +2 -0
- package/library/packages/utils/src/transformation/transformation.d.ts +55 -11
- package/library/react-web-component.d.ts +4 -4
- package/library/utils.js +89 -86
- package/package.json +1 -1
- package/library/chunks/transformation.BfIEi4p4.js +0 -300
|
@@ -1,50 +1,50 @@
|
|
|
1
1
|
import "../components/cropper.js";
|
|
2
|
-
import { C as
|
|
3
|
-
import
|
|
4
|
-
import { C as
|
|
5
|
-
import { n as h, C as
|
|
6
|
-
import { h as
|
|
2
|
+
import { C as J } from "./button.BnkkUqiI.js";
|
|
3
|
+
import B from "../components/space.js";
|
|
4
|
+
import { C as q } from "./typography.IqHbnd3C.js";
|
|
5
|
+
import { n as h, C as j } from "./lib-cortex-element.CVMmyPMC.js";
|
|
6
|
+
import { h as T, a as Ot, C as Lt, S as Yt, b as Jt, c as te, d as ee } from "./endpoints.mJ5S-tIs.js";
|
|
7
7
|
import "./browser.BHOCIF_A.js";
|
|
8
|
-
import { i as
|
|
8
|
+
import { i as V, x as C, E as Ut } from "./lit-element.jLBm65_O.js";
|
|
9
9
|
import "./form.DSsy3Fcy.js";
|
|
10
|
-
import { L as
|
|
11
|
-
import { a as
|
|
10
|
+
import { L as G } from "./i18n.DbXTTLXx.js";
|
|
11
|
+
import { a as ie } from "./string.CfI2ejyR.js";
|
|
12
12
|
import "./date-picker.BGHn6qg8.js";
|
|
13
13
|
import "./content-builder.BX4pHujE.js";
|
|
14
14
|
import "./unsafe-html.Dff7-rCx.js";
|
|
15
|
-
import {
|
|
16
|
-
import { b as
|
|
17
|
-
import { c as
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import { P as
|
|
21
|
-
import { c as
|
|
15
|
+
import { d as It, r as Bt, e as lt } from "./transformation.JkkMVin_.js";
|
|
16
|
+
import { b as se } from "./_baseUniq.lwMgmtt2.js";
|
|
17
|
+
import { c as Q } from "./component.styles.CRO4Odto.js";
|
|
18
|
+
import { M as zt, U as o, T as m } from "./asset-link-format.ClaYu_v8.js";
|
|
19
|
+
import { v as ae } from "./v4.CKZ6klMF.js";
|
|
20
|
+
import { P as N } from "./position-picker.DjnhxIKF.js";
|
|
21
|
+
import { c as X } from "./custom-element.L4WJXn1j.js";
|
|
22
22
|
import { w as P } from "./watch.DJF5K-8U.js";
|
|
23
|
-
import { s as
|
|
24
|
-
import { r as
|
|
25
|
-
import { n as
|
|
26
|
-
import
|
|
27
|
-
import
|
|
28
|
-
import { C as
|
|
29
|
-
import { C as
|
|
30
|
-
import { C as
|
|
31
|
-
import { C as
|
|
32
|
-
import
|
|
33
|
-
import
|
|
34
|
-
import { c as
|
|
35
|
-
import { e as
|
|
36
|
-
import { c as
|
|
37
|
-
import { o as
|
|
38
|
-
import
|
|
39
|
-
import
|
|
40
|
-
import
|
|
41
|
-
function
|
|
42
|
-
return t && t.length ?
|
|
23
|
+
import { s as Et, a as ct } from "./number.Cx2ncfJJ.js";
|
|
24
|
+
import { r as k } from "./state.CSDxrqLd.js";
|
|
25
|
+
import { n as I } from "./when.Dr1es41R.js";
|
|
26
|
+
import it from "../components/details.js";
|
|
27
|
+
import qt from "../components/divider.js";
|
|
28
|
+
import { C as st } from "./icon.CpHbi8tH.js";
|
|
29
|
+
import { C as Pt } from "./icon-button.CVrxJcZq.js";
|
|
30
|
+
import { C as Ft } from "./input.33UmFGqR.js";
|
|
31
|
+
import { C as St } from "./option.B6odSlS2.js";
|
|
32
|
+
import At from "../components/select.js";
|
|
33
|
+
import oe from "../components/position-picker.js";
|
|
34
|
+
import { c as re } from "./image.Y5c_hFx8.js";
|
|
35
|
+
import { e as tt } from "./query.BBf1UFkC.js";
|
|
36
|
+
import { c as rt } from "./repeat.CFjcER6_.js";
|
|
37
|
+
import { o as O } from "./style-map.llVFPd__.js";
|
|
38
|
+
import jt from "../components/tooltip.js";
|
|
39
|
+
import ne from "../components/button-group.js";
|
|
40
|
+
import he from "../components/checkbox.js";
|
|
41
|
+
function le(t) {
|
|
42
|
+
return t && t.length ? se(t) : [];
|
|
43
43
|
}
|
|
44
|
-
function
|
|
44
|
+
function Vt(t) {
|
|
45
45
|
return typeof t == "object" && t !== null && "URI" in t;
|
|
46
46
|
}
|
|
47
|
-
const
|
|
47
|
+
const ce = {
|
|
48
48
|
artist: "Artist",
|
|
49
49
|
color: "Color",
|
|
50
50
|
createDate: "CreateDate",
|
|
@@ -66,18 +66,18 @@ const re = {
|
|
|
66
66
|
systemIdentifier: "SystemIdentifier",
|
|
67
67
|
text: "Text",
|
|
68
68
|
title: "Title"
|
|
69
|
-
},
|
|
70
|
-
function
|
|
69
|
+
}, pe = /* @__PURE__ */ new Set(["mediaDate", "createDate", "editDate"]);
|
|
70
|
+
function kt(t) {
|
|
71
71
|
return !/[\s&+/*"\\:(),'<>~|[\]{}]/.test(t) && !/^(?:OR|AND|NOT)$/.test(t) ? t : `"${t.replace(/\\/g, "\\\\").replace(/"/g, '\\"')}"`;
|
|
72
72
|
}
|
|
73
|
-
function
|
|
74
|
-
const s = (Array.isArray(e) ? e : [e]).map((a) => `${t}:${
|
|
73
|
+
function Tt(t, e) {
|
|
74
|
+
const s = (Array.isArray(e) ? e : [e]).map((a) => `${t}:${kt(a)}`);
|
|
75
75
|
return s.length > 1 ? `(${s.join(" OR ")})` : s[0] ?? "";
|
|
76
76
|
}
|
|
77
|
-
function
|
|
77
|
+
function de(t, e) {
|
|
78
78
|
return (Array.isArray(e) ? e : [e]).map((s) => `${t}${s.operator}${s.value}`).join(" AND ");
|
|
79
79
|
}
|
|
80
|
-
function
|
|
80
|
+
function ue(t) {
|
|
81
81
|
const e = [];
|
|
82
82
|
for (const i of Object.keys(t)) {
|
|
83
83
|
const s = i, a = t[s];
|
|
@@ -87,19 +87,19 @@ function le(t) {
|
|
|
87
87
|
for (const [n, l] of Object.entries(
|
|
88
88
|
a
|
|
89
89
|
))
|
|
90
|
-
e.push(
|
|
90
|
+
e.push(Tt(n, l));
|
|
91
91
|
continue;
|
|
92
92
|
}
|
|
93
|
-
const
|
|
94
|
-
if (
|
|
95
|
-
if (
|
|
93
|
+
const r = ce[s];
|
|
94
|
+
if (r) {
|
|
95
|
+
if (pe.has(s)) {
|
|
96
96
|
e.push(
|
|
97
|
-
|
|
97
|
+
de(r, a)
|
|
98
98
|
);
|
|
99
99
|
continue;
|
|
100
100
|
}
|
|
101
101
|
if (s === "color") {
|
|
102
|
-
e.push(`${
|
|
102
|
+
e.push(`${r}:${a}`);
|
|
103
103
|
continue;
|
|
104
104
|
}
|
|
105
105
|
if (s === "parentFolderIdentifier") {
|
|
@@ -107,132 +107,132 @@ function le(t) {
|
|
|
107
107
|
if (n.length === 0)
|
|
108
108
|
continue;
|
|
109
109
|
const l = [
|
|
110
|
-
...n.map((
|
|
111
|
-
...n.map((
|
|
110
|
+
...n.map((p) => `ParentFolderIdentifier:${kt(String(p))}`),
|
|
111
|
+
...n.map((p) => `ParentAlbumIdentifier:${kt(String(p))}`)
|
|
112
112
|
];
|
|
113
113
|
e.push(`(${l.join(" OR ")})`);
|
|
114
114
|
continue;
|
|
115
115
|
}
|
|
116
|
-
e.push(
|
|
116
|
+
e.push(Tt(r, a));
|
|
117
117
|
}
|
|
118
118
|
}
|
|
119
119
|
return e.join(" AND ");
|
|
120
120
|
}
|
|
121
|
-
function
|
|
121
|
+
function pt(t) {
|
|
122
122
|
if ("and" in t)
|
|
123
|
-
return t.and.map(
|
|
123
|
+
return t.and.map(pt).filter(Boolean).join(" AND ");
|
|
124
124
|
if ("or" in t) {
|
|
125
|
-
const e = t.or.map(
|
|
125
|
+
const e = t.or.map(pt).filter(Boolean);
|
|
126
126
|
return e.length > 1 ? `(${e.join(" OR ")})` : e[0] ?? "";
|
|
127
127
|
}
|
|
128
128
|
if ("not" in t) {
|
|
129
|
-
const e =
|
|
129
|
+
const e = pt(t.not);
|
|
130
130
|
return e ? `NOT (${e})` : "";
|
|
131
131
|
}
|
|
132
|
-
return
|
|
132
|
+
return ue(t);
|
|
133
133
|
}
|
|
134
|
-
const
|
|
134
|
+
const me = "CoreField.LargeSizePreview", dt = "CoreField.DocType", fe = "Document.Title", ge = "Document.CaptionLong", nt = "Document.FileExtension", ut = "CoreField.FileSize", Ht = "CoreField.Identifier", mt = "CoreField.MaxHeight", ft = "CoreField.MaxWidth", gt = "Document.RecordID", Wt = "CoreField.DocSubType", Gt = "CoreField.TitleWithFallback", xt = "CoreField.OriginalFileName", yt = "CoreField.UpdatedFileName", _t = "__width", xe = "CoreField.OriginalPreview", Oi = "Document.DocSubType", Li = "Document.InPoint", Ui = "Document.OutPoint", Ct = {
|
|
135
135
|
DEFAULT_VIEW_SIZE: "Document.LargeSizePreview",
|
|
136
136
|
FIELD_TITLE_WITH_FALLBACK: "Document.TitleWithFallback",
|
|
137
137
|
ORIGINAL_VIEW_SIZE: "Document.OriginalPreview"
|
|
138
|
-
},
|
|
139
|
-
[
|
|
140
|
-
[
|
|
141
|
-
[
|
|
142
|
-
},
|
|
143
|
-
Object.entries(
|
|
138
|
+
}, Qt = {
|
|
139
|
+
[me]: Ct.DEFAULT_VIEW_SIZE,
|
|
140
|
+
[Gt]: Ct.FIELD_TITLE_WITH_FALLBACK,
|
|
141
|
+
[xe]: Ct.ORIGINAL_VIEW_SIZE
|
|
142
|
+
}, ye = Object.fromEntries(
|
|
143
|
+
Object.entries(Qt).map(([t, e]) => [
|
|
144
144
|
e,
|
|
145
145
|
t
|
|
146
146
|
])
|
|
147
147
|
);
|
|
148
|
-
function
|
|
149
|
-
return
|
|
148
|
+
function Se(t) {
|
|
149
|
+
return Qt[t] ?? t;
|
|
150
150
|
}
|
|
151
|
-
function
|
|
151
|
+
function Dt(t) {
|
|
152
152
|
const e = {};
|
|
153
153
|
for (const [i, s] of Object.entries(t)) {
|
|
154
|
-
const a =
|
|
154
|
+
const a = ye[i] ?? i;
|
|
155
155
|
e[a] = s;
|
|
156
156
|
}
|
|
157
157
|
return e;
|
|
158
158
|
}
|
|
159
|
-
function
|
|
159
|
+
function Ae(t) {
|
|
160
160
|
const e = new URLSearchParams();
|
|
161
161
|
for (const [i, s] of Object.entries(t))
|
|
162
162
|
s != null && (Array.isArray(s) ? s.forEach((a) => e.append(i, String(a))) : e.append(i, String(s)));
|
|
163
163
|
return e;
|
|
164
164
|
}
|
|
165
|
-
async function
|
|
165
|
+
async function Xt({
|
|
166
166
|
countPerPage: t,
|
|
167
167
|
fields: e,
|
|
168
168
|
getPermanentAssetsPaths: i,
|
|
169
169
|
httpMethod: s = "GET",
|
|
170
170
|
isSiteBuilder: a,
|
|
171
|
-
pageNumber:
|
|
171
|
+
pageNumber: r,
|
|
172
172
|
query: n,
|
|
173
173
|
securityByPassToken: l,
|
|
174
|
-
siteUrl:
|
|
175
|
-
sort:
|
|
174
|
+
siteUrl: p,
|
|
175
|
+
sort: x,
|
|
176
176
|
token: c,
|
|
177
|
-
useSession:
|
|
177
|
+
useSession: f
|
|
178
178
|
}) {
|
|
179
|
-
const
|
|
179
|
+
const y = e?.map(Se), d = {
|
|
180
180
|
CountPerPage: t,
|
|
181
|
-
Fields:
|
|
181
|
+
Fields: le(y),
|
|
182
182
|
Format: "json",
|
|
183
183
|
GetPermanentAssetsPaths: i || void 0,
|
|
184
|
-
PageNumber:
|
|
185
|
-
Query:
|
|
184
|
+
PageNumber: r,
|
|
185
|
+
Query: pt(n),
|
|
186
186
|
SecurityByPassToken: l || void 0,
|
|
187
|
-
Sort:
|
|
188
|
-
UseSession:
|
|
189
|
-
},
|
|
187
|
+
Sort: x || void 0,
|
|
188
|
+
UseSession: f || void 0
|
|
189
|
+
}, S = s === "POST";
|
|
190
190
|
try {
|
|
191
|
-
return (await
|
|
192
|
-
baseURL:
|
|
191
|
+
return (await T.request({
|
|
192
|
+
baseURL: p,
|
|
193
193
|
headers: c ? { Authorization: `Bearer ${c}` } : void 0,
|
|
194
194
|
method: s,
|
|
195
195
|
// POST large RecordID queries as a urlencoded body to dodge the ~2KB URL cap;
|
|
196
196
|
// GET keeps the same fields on the query string.
|
|
197
|
-
...
|
|
197
|
+
...S ? { data: Ae(d) } : { params: d, paramsSerializer: { indexes: null } },
|
|
198
198
|
responseType: "json",
|
|
199
199
|
transformResponse: [
|
|
200
|
-
...Array.isArray(
|
|
201
|
-
a ? (
|
|
202
|
-
items: (
|
|
203
|
-
sort:
|
|
204
|
-
totalCount:
|
|
205
|
-
}) : (
|
|
206
|
-
items: (
|
|
207
|
-
sort:
|
|
208
|
-
totalCount:
|
|
200
|
+
...Array.isArray(T.defaults.transformResponse) ? T.defaults.transformResponse : [],
|
|
201
|
+
a ? (A) => ({
|
|
202
|
+
items: (A.results?.Items ?? []).map(Dt),
|
|
203
|
+
sort: A.results?.GlobalInfo?.Sort ?? "",
|
|
204
|
+
totalCount: A.results?.GlobalInfo?.TotalCount ?? 0
|
|
205
|
+
}) : (A) => ({
|
|
206
|
+
items: (A.APIResponse?.Items ?? []).map(Dt),
|
|
207
|
+
sort: A.APIResponse?.GlobalInfo?.Sort ?? "",
|
|
208
|
+
totalCount: A.APIResponse?.GlobalInfo?.TotalCount ?? 0
|
|
209
209
|
})
|
|
210
210
|
],
|
|
211
|
-
url: a ?
|
|
211
|
+
url: a ? Lt.SEARCH_ASSETS : Yt["4.0"]
|
|
212
212
|
})).data;
|
|
213
213
|
} catch {
|
|
214
214
|
return { items: [], sort: "", totalCount: 0 };
|
|
215
215
|
}
|
|
216
216
|
}
|
|
217
|
-
async function
|
|
217
|
+
async function ve({
|
|
218
218
|
assetId: t,
|
|
219
219
|
extension: e,
|
|
220
220
|
format: i,
|
|
221
221
|
siteUrl: s,
|
|
222
222
|
token: a,
|
|
223
|
-
transformations:
|
|
223
|
+
transformations: r,
|
|
224
224
|
useSession: n
|
|
225
225
|
}) {
|
|
226
226
|
try {
|
|
227
|
-
return (await
|
|
227
|
+
return (await T.request({
|
|
228
228
|
baseURL: s,
|
|
229
229
|
method: "GET",
|
|
230
230
|
params: {
|
|
231
231
|
SourceAssetFormat: i,
|
|
232
232
|
SourceAssetRecordID: t,
|
|
233
|
-
TargetExtension:
|
|
233
|
+
TargetExtension: ie(e),
|
|
234
234
|
Token: a || void 0,
|
|
235
|
-
Transformations:
|
|
235
|
+
Transformations: r,
|
|
236
236
|
UseSession: n || void 0
|
|
237
237
|
},
|
|
238
238
|
/**
|
|
@@ -240,145 +240,157 @@ async function xe({
|
|
|
240
240
|
*/
|
|
241
241
|
timeout: 3e5,
|
|
242
242
|
// 5 minutes
|
|
243
|
-
url:
|
|
243
|
+
url: Ot.GET_TRANSFORM_ASSET_LINK
|
|
244
244
|
})).data;
|
|
245
245
|
} catch {
|
|
246
246
|
return null;
|
|
247
247
|
}
|
|
248
248
|
}
|
|
249
|
-
const
|
|
250
|
-
function
|
|
249
|
+
const ze = 50;
|
|
250
|
+
function Ce(t, e) {
|
|
251
251
|
const i = [];
|
|
252
252
|
for (let s = 0; s < t.length; s += e)
|
|
253
253
|
i.push(t.slice(s, s + e));
|
|
254
254
|
return i;
|
|
255
255
|
}
|
|
256
|
-
async function
|
|
256
|
+
async function we({
|
|
257
257
|
extraFields: t,
|
|
258
258
|
getPermanentAssetsPaths: e,
|
|
259
259
|
isSiteBuilder: i,
|
|
260
260
|
recordIds: s,
|
|
261
261
|
securityByPassToken: a,
|
|
262
|
-
token:
|
|
262
|
+
token: r
|
|
263
263
|
}) {
|
|
264
264
|
if (!Array.isArray(s) || s.length === 0)
|
|
265
265
|
return { facets: [], items: [], totalCount: 0 };
|
|
266
|
-
const n = t?.filter((
|
|
266
|
+
const n = t?.filter((d) => d && typeof d == "string") ?? [], l = [
|
|
267
267
|
...n,
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
],
|
|
274
|
-
|
|
275
|
-
(
|
|
276
|
-
countPerPage:
|
|
268
|
+
yt,
|
|
269
|
+
xt,
|
|
270
|
+
fe,
|
|
271
|
+
ge,
|
|
272
|
+
gt
|
|
273
|
+
], p = Ce(s, ze), x = await Promise.all(
|
|
274
|
+
p.map(
|
|
275
|
+
(d) => Xt({
|
|
276
|
+
countPerPage: d.length,
|
|
277
277
|
fields: l,
|
|
278
278
|
getPermanentAssetsPaths: e,
|
|
279
279
|
httpMethod: i ? "GET" : "POST",
|
|
280
280
|
isSiteBuilder: i,
|
|
281
281
|
pageNumber: 1,
|
|
282
|
-
query: { recordId:
|
|
282
|
+
query: { recordId: d },
|
|
283
283
|
securityByPassToken: a,
|
|
284
|
-
token:
|
|
284
|
+
token: r
|
|
285
285
|
})
|
|
286
286
|
)
|
|
287
|
-
), c = new Map(s.map((
|
|
288
|
-
let
|
|
289
|
-
return
|
|
290
|
-
name:
|
|
291
|
-
recordId:
|
|
287
|
+
), c = new Map(s.map((d, S) => [d, S])), f = x.flatMap((d) => d.items).map((d) => {
|
|
288
|
+
let S = M(d, yt);
|
|
289
|
+
return S === "" && (S = M(d, xt)), {
|
|
290
|
+
name: S,
|
|
291
|
+
recordId: M(d, gt),
|
|
292
292
|
...n.reduce(
|
|
293
|
-
(
|
|
293
|
+
(R, A) => {
|
|
294
|
+
R[A] = M(d, A);
|
|
295
|
+
const F = Kt(d, A);
|
|
296
|
+
return F !== void 0 && (R[`${A}${_t}`] = String(F)), R;
|
|
297
|
+
},
|
|
294
298
|
{}
|
|
295
299
|
)
|
|
296
300
|
};
|
|
297
301
|
}).sort(
|
|
298
|
-
(
|
|
299
|
-
),
|
|
300
|
-
(
|
|
302
|
+
(d, S) => (c.get(d.recordId) ?? 1 / 0) - (c.get(S.recordId) ?? 1 / 0)
|
|
303
|
+
), y = x.reduce(
|
|
304
|
+
(d, S) => d + S.totalCount,
|
|
301
305
|
0
|
|
302
306
|
);
|
|
303
|
-
return { facets: [], items:
|
|
307
|
+
return { facets: [], items: f, totalCount: y };
|
|
304
308
|
}
|
|
305
|
-
function
|
|
309
|
+
function M(t, e) {
|
|
306
310
|
const i = t[e];
|
|
307
|
-
return i == null ? "" : typeof i == "string" ? i : typeof i == "number" || typeof i == "boolean" ? String(i) :
|
|
311
|
+
return i == null ? "" : typeof i == "string" ? i : typeof i == "number" || typeof i == "boolean" ? String(i) : Vt(i) ? i.URI : "";
|
|
308
312
|
}
|
|
309
|
-
|
|
313
|
+
function Kt(t, e) {
|
|
314
|
+
const i = t[e];
|
|
315
|
+
if (!(i == null || !Vt(i)))
|
|
316
|
+
return typeof i.Width == "number" && i.Width > 0 ? i.Width : void 0;
|
|
317
|
+
}
|
|
318
|
+
async function be({
|
|
310
319
|
countPerPage: t,
|
|
311
320
|
directParentFolderIdentifier: e,
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
321
|
+
excludedDocTypes: i,
|
|
322
|
+
extraFields: s,
|
|
323
|
+
getPermanentAssetsPaths: a,
|
|
324
|
+
isSiteBuilder: r,
|
|
325
|
+
limitedDocTypes: n,
|
|
326
|
+
pageNumber: l,
|
|
327
|
+
parentFolderIdentifier: p,
|
|
328
|
+
searchTerm: x,
|
|
329
|
+
securityByPassToken: c,
|
|
330
|
+
sortOrder: f,
|
|
331
|
+
token: y
|
|
322
332
|
}) {
|
|
323
|
-
if (!e && !
|
|
333
|
+
if (!e && !p)
|
|
324
334
|
return { facets: [], items: [], totalCount: 0 };
|
|
325
|
-
const
|
|
335
|
+
const d = (s?.filter((w) => w && typeof w == "string") ?? []).map((w) => w.replace("%20", " ")), S = {
|
|
326
336
|
directParentFolderIdentifier: e,
|
|
327
|
-
parentFolderIdentifier:
|
|
328
|
-
...
|
|
329
|
-
},
|
|
337
|
+
parentFolderIdentifier: p,
|
|
338
|
+
...n && n.length > 0 ? { docType: n } : {}
|
|
339
|
+
}, R = i && i.length > 0 ? { and: [S, { not: { docType: i } }] } : S, A = await Xt({
|
|
330
340
|
countPerPage: t,
|
|
331
341
|
fields: [
|
|
332
|
-
...
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
dt,
|
|
336
|
-
pt,
|
|
337
|
-
ct,
|
|
338
|
-
lt,
|
|
339
|
-
Et,
|
|
340
|
-
Mt,
|
|
341
|
-
ot,
|
|
342
|
-
ut,
|
|
342
|
+
...d,
|
|
343
|
+
Gt,
|
|
344
|
+
ft,
|
|
343
345
|
mt,
|
|
344
|
-
|
|
346
|
+
ut,
|
|
347
|
+
dt,
|
|
348
|
+
Wt,
|
|
349
|
+
Ht,
|
|
350
|
+
nt,
|
|
351
|
+
gt,
|
|
352
|
+
xt,
|
|
353
|
+
yt
|
|
345
354
|
],
|
|
346
|
-
getPermanentAssetsPaths:
|
|
347
|
-
isSiteBuilder:
|
|
348
|
-
pageNumber:
|
|
349
|
-
query:
|
|
350
|
-
securityByPassToken:
|
|
355
|
+
getPermanentAssetsPaths: a,
|
|
356
|
+
isSiteBuilder: r,
|
|
357
|
+
pageNumber: l,
|
|
358
|
+
query: R,
|
|
359
|
+
securityByPassToken: c,
|
|
351
360
|
sort: void 0,
|
|
352
|
-
token:
|
|
353
|
-
}),
|
|
354
|
-
let
|
|
355
|
-
|
|
356
|
-
const
|
|
361
|
+
token: y
|
|
362
|
+
}), F = A.items.map((w) => {
|
|
363
|
+
let _ = M(w, nt), at = M(w, yt);
|
|
364
|
+
_ && !_.startsWith(".") && (_ = "." + _), at === "" && (at = M(w, xt));
|
|
365
|
+
const ht = M(w, gt);
|
|
357
366
|
return {
|
|
358
|
-
docSubType:
|
|
359
|
-
docType:
|
|
360
|
-
extension:
|
|
361
|
-
height:
|
|
362
|
-
id:
|
|
363
|
-
identifier:
|
|
364
|
-
name:
|
|
365
|
-
recordId:
|
|
366
|
-
size:
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
367
|
+
docSubType: M(w, Wt),
|
|
368
|
+
docType: M(w, dt) || "",
|
|
369
|
+
extension: _,
|
|
370
|
+
height: M(w, mt) || "0",
|
|
371
|
+
id: ht,
|
|
372
|
+
identifier: M(w, Ht),
|
|
373
|
+
name: at,
|
|
374
|
+
recordId: ht,
|
|
375
|
+
size: M(w, ut) || "0 MB",
|
|
376
|
+
width: M(w, ft) || "0",
|
|
377
|
+
...d.reduce(
|
|
378
|
+
(L, Z) => {
|
|
379
|
+
L[Z] = M(w, Z);
|
|
380
|
+
const ot = Kt(w, Z);
|
|
381
|
+
return ot !== void 0 && (L[`${Z}${_t}`] = String(ot)), L;
|
|
382
|
+
},
|
|
371
383
|
{}
|
|
372
384
|
)
|
|
373
385
|
};
|
|
374
386
|
});
|
|
375
387
|
return {
|
|
376
388
|
facets: [],
|
|
377
|
-
items:
|
|
378
|
-
totalCount:
|
|
389
|
+
items: F,
|
|
390
|
+
totalCount: A.totalCount
|
|
379
391
|
};
|
|
380
392
|
}
|
|
381
|
-
async function
|
|
393
|
+
async function ke({
|
|
382
394
|
autoCropMode: t,
|
|
383
395
|
cropHeight: e,
|
|
384
396
|
cropWidth: i,
|
|
@@ -386,7 +398,7 @@ async function ze({
|
|
|
386
398
|
useSession: a
|
|
387
399
|
}) {
|
|
388
400
|
try {
|
|
389
|
-
return (await
|
|
401
|
+
return (await T.request({
|
|
390
402
|
method: "GET",
|
|
391
403
|
params: {
|
|
392
404
|
AutoCropMode: t,
|
|
@@ -399,7 +411,7 @@ async function ze({
|
|
|
399
411
|
timeout: 3e5,
|
|
400
412
|
// 5 minutes
|
|
401
413
|
transformResponse: [
|
|
402
|
-
...Array.isArray(
|
|
414
|
+
...Array.isArray(T.defaults.transformResponse) ? T.defaults.transformResponse : [],
|
|
403
415
|
(n) => ({
|
|
404
416
|
height: n.cropHeight,
|
|
405
417
|
width: n.cropWidth,
|
|
@@ -407,13 +419,13 @@ async function ze({
|
|
|
407
419
|
y: n.cropY
|
|
408
420
|
})
|
|
409
421
|
],
|
|
410
|
-
url:
|
|
422
|
+
url: Ot.GET_CROP_ZONE_SUGGESTION
|
|
411
423
|
})).data;
|
|
412
424
|
} catch {
|
|
413
425
|
return null;
|
|
414
426
|
}
|
|
415
427
|
}
|
|
416
|
-
async function
|
|
428
|
+
async function Bi({
|
|
417
429
|
assetRecordId: t,
|
|
418
430
|
isSiteBuilder: e,
|
|
419
431
|
siteUrl: i,
|
|
@@ -421,7 +433,7 @@ async function Di({
|
|
|
421
433
|
useSession: a
|
|
422
434
|
}) {
|
|
423
435
|
try {
|
|
424
|
-
return (await
|
|
436
|
+
return (await T.request({
|
|
425
437
|
baseURL: i,
|
|
426
438
|
method: "GET",
|
|
427
439
|
params: {
|
|
@@ -431,7 +443,7 @@ async function Di({
|
|
|
431
443
|
},
|
|
432
444
|
responseType: "json",
|
|
433
445
|
transformResponse: [
|
|
434
|
-
...Array.isArray(
|
|
446
|
+
...Array.isArray(T.defaults.transformResponse) ? T.defaults.transformResponse : [],
|
|
435
447
|
(n) => !n || typeof n != "object" ? [] : n.proxies?.map((l) => ({
|
|
436
448
|
cdnName: l.cdnName,
|
|
437
449
|
extension: l.extension,
|
|
@@ -444,22 +456,22 @@ async function Di({
|
|
|
444
456
|
width: l.width
|
|
445
457
|
})) ?? []
|
|
446
458
|
],
|
|
447
|
-
url: e ?
|
|
459
|
+
url: e ? Lt.GET_AVAILABLE_PROXIES : ee
|
|
448
460
|
})).data;
|
|
449
461
|
} catch {
|
|
450
462
|
return [];
|
|
451
463
|
}
|
|
452
464
|
}
|
|
453
|
-
async function
|
|
465
|
+
async function qi({
|
|
454
466
|
siteUrl: t
|
|
455
467
|
} = {}) {
|
|
456
468
|
try {
|
|
457
|
-
return (await
|
|
469
|
+
return (await T.request({
|
|
458
470
|
baseURL: t,
|
|
459
471
|
method: "GET",
|
|
460
472
|
responseType: "json",
|
|
461
473
|
transformResponse: [
|
|
462
|
-
...Array.isArray(
|
|
474
|
+
...Array.isArray(T.defaults.transformResponse) ? T.defaults.transformResponse : [],
|
|
463
475
|
(i) => !i || typeof i != "object" ? {
|
|
464
476
|
formatsByDocType: {
|
|
465
477
|
Audio: {},
|
|
@@ -471,13 +483,13 @@ async function Ni({
|
|
|
471
483
|
formatsByDocType: i.formatsByDocType ?? {}
|
|
472
484
|
}
|
|
473
485
|
],
|
|
474
|
-
url:
|
|
486
|
+
url: Jt
|
|
475
487
|
})).data;
|
|
476
488
|
} catch {
|
|
477
489
|
return { formatsByDocType: {} };
|
|
478
490
|
}
|
|
479
491
|
}
|
|
480
|
-
async function
|
|
492
|
+
async function ji({
|
|
481
493
|
recordIds: t,
|
|
482
494
|
rightsToCheck: e
|
|
483
495
|
}) {
|
|
@@ -488,19 +500,23 @@ async function Oi({
|
|
|
488
500
|
invalidObjects: []
|
|
489
501
|
};
|
|
490
502
|
try {
|
|
491
|
-
const { data: s } = await
|
|
503
|
+
const { data: s } = await T.request({
|
|
492
504
|
method: "GET",
|
|
493
505
|
params: { RecordIDs: t, RightsToCheck: e },
|
|
494
506
|
paramsSerializer: { indexes: null },
|
|
495
507
|
responseType: "json",
|
|
496
|
-
url:
|
|
508
|
+
url: te.GET_AUTHORIZED_OBJECTS
|
|
497
509
|
});
|
|
498
510
|
return s;
|
|
499
511
|
} catch {
|
|
500
512
|
return i;
|
|
501
513
|
}
|
|
502
514
|
}
|
|
503
|
-
const
|
|
515
|
+
const wt = 20, Re = [
|
|
516
|
+
zt.Album,
|
|
517
|
+
zt.ProjectDocument,
|
|
518
|
+
zt.Story
|
|
519
|
+
], Rt = "TR1", $t = "TRX", $e = /* @__PURE__ */ new Set([".gif"]), Pe = /* @__PURE__ */ new Set([
|
|
504
520
|
".avif",
|
|
505
521
|
".bmp",
|
|
506
522
|
".gif",
|
|
@@ -511,32 +527,32 @@ const At = 20, Ct = "TR1", wt = "TRX", Ce = /* @__PURE__ */ new Set([".gif"]), w
|
|
|
511
527
|
".svg",
|
|
512
528
|
".webp"
|
|
513
529
|
]);
|
|
514
|
-
function
|
|
530
|
+
function Zt(t) {
|
|
515
531
|
const e = t.toLowerCase(), i = e.startsWith(".") ? e : `.${e}`;
|
|
516
|
-
return
|
|
532
|
+
return Pe.has(i);
|
|
517
533
|
}
|
|
518
|
-
function
|
|
534
|
+
function Nt({
|
|
519
535
|
extension: t,
|
|
520
536
|
format: e,
|
|
521
537
|
item: i,
|
|
522
538
|
manualFormat: s,
|
|
523
539
|
size: a
|
|
524
540
|
}) {
|
|
525
|
-
const
|
|
541
|
+
const r = t?.toLowerCase() ?? "", n = r.startsWith(".") ? r : `.${r}`, l = `path_${Rt}`, p = (y) => i[y] ? { maxWidth: i[`${y}${_t}`], src: i[y] } : void 0;
|
|
526
542
|
if (!s)
|
|
527
|
-
return
|
|
528
|
-
if (!!
|
|
529
|
-
return
|
|
530
|
-
const
|
|
531
|
-
return
|
|
543
|
+
return p(`path_${Bt(r, a)}`) ?? p(l) ?? {};
|
|
544
|
+
if (!!r && $e.has(n))
|
|
545
|
+
return p(`path_${$t}`) ?? p(l) ?? {};
|
|
546
|
+
const c = !r || Zt(r), f = e ? `path_${e}` : void 0;
|
|
547
|
+
return f && c && i[f] ? p(f) ?? {} : p(l) ?? {};
|
|
532
548
|
}
|
|
533
|
-
class
|
|
549
|
+
class Vi {
|
|
534
550
|
constructor(e, i) {
|
|
535
|
-
this.data = [], this.folderId = "", this.fetchedPages = /* @__PURE__ */ new Set(), this.totalCount = 0, this.maxEnd = 1 / 0, this.pageSize =
|
|
551
|
+
this.data = [], this.folderId = "", this.fetchedPages = /* @__PURE__ */ new Set(), this.totalCount = 0, this.maxEnd = 1 / 0, this.pageSize = wt, this.requestEpoch = 0, this.host = e, this.host.addController?.(this);
|
|
536
552
|
const s = i?.maxEnd;
|
|
537
553
|
this.maxEnd = typeof s == "number" && Number.isFinite(s) && s >= 0 ? Math.floor(s) : 1 / 0;
|
|
538
554
|
const a = i?.pageSize;
|
|
539
|
-
this.pageSize = typeof a == "number" && Number.isFinite(a) && a >= 1 ? Math.floor(a) :
|
|
555
|
+
this.pageSize = typeof a == "number" && Number.isFinite(a) && a >= 1 ? Math.floor(a) : wt, this.authToken = i?.token, this.securityByPassToken = i?.securityByPassToken, this.isSiteBuilder = i?.isSiteBuilder ?? !1;
|
|
540
556
|
}
|
|
541
557
|
get totalDataCount() {
|
|
542
558
|
return this.totalCount;
|
|
@@ -554,7 +570,7 @@ class Li {
|
|
|
554
570
|
* Shrinking is ignored once pages are cached: collapsing already has what it needs.
|
|
555
571
|
*/
|
|
556
572
|
setPageSize(e) {
|
|
557
|
-
const i = Number.isFinite(e) && e >= 1 ? Math.floor(e) :
|
|
573
|
+
const i = Number.isFinite(e) && e >= 1 ? Math.floor(e) : wt;
|
|
558
574
|
if (this.pageSize === i)
|
|
559
575
|
return;
|
|
560
576
|
const s = this.fetchedPages.size > 0;
|
|
@@ -565,33 +581,34 @@ class Li {
|
|
|
565
581
|
extraFields: i = [],
|
|
566
582
|
format: s,
|
|
567
583
|
manualFormat: a = !0,
|
|
568
|
-
start:
|
|
584
|
+
start: r,
|
|
569
585
|
transformations: n
|
|
570
586
|
}) {
|
|
571
|
-
if (e <
|
|
587
|
+
if (e < r)
|
|
572
588
|
return this.data;
|
|
573
|
-
if (this.totalCount > 0 && e >= this.totalCount && (e = this.totalCount - 1, e <
|
|
589
|
+
if (this.totalCount > 0 && e >= this.totalCount && (e = this.totalCount - 1, e < r))
|
|
574
590
|
return this.data;
|
|
575
591
|
const l = this.requestEpoch;
|
|
576
592
|
if (!this.folderId || l !== this.requestEpoch)
|
|
577
593
|
return this.data;
|
|
578
|
-
const
|
|
594
|
+
const p = s ? `path_${s}` : void 0, x = `path_${Rt}`, c = `path_${$t}`, f = [
|
|
579
595
|
...new Set(
|
|
580
|
-
[
|
|
581
|
-
(
|
|
596
|
+
[p, x, c].filter(
|
|
597
|
+
(S) => !!S
|
|
582
598
|
)
|
|
583
599
|
)
|
|
584
|
-
],
|
|
585
|
-
for (let
|
|
586
|
-
if (this.fetchedPages.has(
|
|
600
|
+
], y = Math.floor(r / this.pageSize) + 1, d = Math.floor(e / this.pageSize) + 1;
|
|
601
|
+
for (let S = y; S <= d; S++) {
|
|
602
|
+
if (this.fetchedPages.has(S))
|
|
587
603
|
continue;
|
|
588
|
-
const
|
|
604
|
+
const R = await be({
|
|
589
605
|
countPerPage: this.pageSize,
|
|
590
606
|
directParentFolderIdentifier: this.folderId,
|
|
591
|
-
|
|
607
|
+
excludedDocTypes: Re,
|
|
608
|
+
extraFields: [...i, ...f],
|
|
592
609
|
getPermanentAssetsPaths: !0,
|
|
593
610
|
isSiteBuilder: this.isSiteBuilder,
|
|
594
|
-
pageNumber:
|
|
611
|
+
pageNumber: S,
|
|
595
612
|
searchTerm: "",
|
|
596
613
|
securityByPassToken: this.securityByPassToken,
|
|
597
614
|
sortOrder: "",
|
|
@@ -599,36 +616,37 @@ class Li {
|
|
|
599
616
|
});
|
|
600
617
|
if (l !== this.requestEpoch)
|
|
601
618
|
return this.data;
|
|
602
|
-
if (this.fetchedPages.add(
|
|
603
|
-
const F = Math.min(this.maxEnd,
|
|
619
|
+
if (this.fetchedPages.add(S), !this.totalCount && R.totalCount) {
|
|
620
|
+
const F = Math.min(this.maxEnd, R.totalCount);
|
|
604
621
|
this.totalCount = F, this.data = Array.from({ length: F }, () => ({
|
|
605
622
|
alt: "",
|
|
606
|
-
id: `temp-${
|
|
623
|
+
id: `temp-${ae()}`,
|
|
607
624
|
name: "",
|
|
608
625
|
src: ""
|
|
609
626
|
}));
|
|
610
627
|
}
|
|
611
|
-
const
|
|
612
|
-
for (let F = 0; F <
|
|
613
|
-
const
|
|
614
|
-
if (
|
|
615
|
-
const
|
|
616
|
-
|
|
617
|
-
extension: E.extension,
|
|
628
|
+
const A = (S - 1) * this.pageSize;
|
|
629
|
+
for (let F = 0; F < R.items.length; F++) {
|
|
630
|
+
const w = A + F;
|
|
631
|
+
if (w < this.data.length) {
|
|
632
|
+
const _ = R.items[F], { maxWidth: at, src: ht } = Nt({
|
|
633
|
+
extension: _.extension,
|
|
618
634
|
format: s,
|
|
619
|
-
item:
|
|
635
|
+
item: _,
|
|
620
636
|
manualFormat: a,
|
|
621
|
-
size:
|
|
637
|
+
size: _.size
|
|
622
638
|
});
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
639
|
+
let L = ht;
|
|
640
|
+
L && n && n.length > 0 && (L = It(L, n)), this.data[w] = {
|
|
641
|
+
alt: _.name,
|
|
642
|
+
docType: _.docType,
|
|
643
|
+
extension: _.extension,
|
|
644
|
+
id: _.id,
|
|
645
|
+
maxWidth: at,
|
|
646
|
+
name: _.name,
|
|
647
|
+
src: L,
|
|
630
648
|
...i.reduce(
|
|
631
|
-
(
|
|
649
|
+
(Z, ot) => (Z[ot] = _[ot] ?? "", Z),
|
|
632
650
|
{}
|
|
633
651
|
)
|
|
634
652
|
};
|
|
@@ -641,83 +659,85 @@ class Li {
|
|
|
641
659
|
extraFields: i = [],
|
|
642
660
|
folderId: s,
|
|
643
661
|
forceRefetch: a = !1,
|
|
644
|
-
format:
|
|
662
|
+
format: r,
|
|
645
663
|
manualFormat: n = !0,
|
|
646
664
|
minLimit: l = 5,
|
|
647
|
-
noPlaceholders:
|
|
648
|
-
transformations:
|
|
665
|
+
noPlaceholders: p = !1,
|
|
666
|
+
transformations: x
|
|
649
667
|
}) {
|
|
650
668
|
(!this.folderId || this.folderId !== s) && (this.folderId = s, this.resetFolderState()), a && this.resetPageCache();
|
|
651
|
-
const c = Math.max(5, l),
|
|
669
|
+
const c = Math.max(5, l), f = e, y = e + c, d = [
|
|
652
670
|
...i,
|
|
653
|
-
|
|
654
|
-
|
|
671
|
+
mt,
|
|
672
|
+
ft
|
|
655
673
|
];
|
|
656
674
|
await this.fetchImages({
|
|
657
|
-
end:
|
|
658
|
-
extraFields:
|
|
659
|
-
format:
|
|
675
|
+
end: y,
|
|
676
|
+
extraFields: d.filter((A) => A !== ""),
|
|
677
|
+
format: r,
|
|
660
678
|
manualFormat: n,
|
|
661
|
-
start:
|
|
662
|
-
transformations:
|
|
679
|
+
start: f,
|
|
680
|
+
transformations: x
|
|
663
681
|
});
|
|
664
|
-
let
|
|
665
|
-
|
|
666
|
-
const
|
|
682
|
+
let S = e - c;
|
|
683
|
+
S < 0 && (this.totalCount === 0 ? S = 0 : S = Math.max(0, this.totalCount + S));
|
|
684
|
+
const R = S + c;
|
|
667
685
|
return await this.fetchImages({
|
|
668
|
-
end:
|
|
669
|
-
extraFields:
|
|
670
|
-
format:
|
|
686
|
+
end: R,
|
|
687
|
+
extraFields: d.filter((A) => A !== ""),
|
|
688
|
+
format: r,
|
|
671
689
|
manualFormat: n,
|
|
672
|
-
start:
|
|
673
|
-
transformations:
|
|
674
|
-
}),
|
|
690
|
+
start: S,
|
|
691
|
+
transformations: x
|
|
692
|
+
}), p ? this.data.filter((A) => A.id && !A.id.startsWith("temp-")) : this.data;
|
|
675
693
|
}
|
|
676
694
|
async fetchImagesByIDs({
|
|
677
695
|
extraFields: e = [],
|
|
678
696
|
format: i,
|
|
679
697
|
manualFormat: s = !0,
|
|
680
698
|
recordIds: a,
|
|
681
|
-
transformations:
|
|
699
|
+
transformations: r
|
|
682
700
|
}) {
|
|
683
701
|
if (a.length === 0)
|
|
684
702
|
return [];
|
|
685
|
-
const n = i ? `path_${i}` : void 0, l = `path_${
|
|
703
|
+
const n = i ? `path_${i}` : void 0, l = `path_${Rt}`, p = `path_${$t}`, x = [
|
|
686
704
|
...new Set(
|
|
687
|
-
[n, l,
|
|
688
|
-
(
|
|
705
|
+
[n, l, p].filter(
|
|
706
|
+
(d) => !!d
|
|
689
707
|
)
|
|
690
708
|
)
|
|
691
|
-
], c = [
|
|
709
|
+
], c = [nt, ut], f = [
|
|
692
710
|
...e,
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
711
|
+
dt,
|
|
712
|
+
mt,
|
|
713
|
+
ft
|
|
696
714
|
];
|
|
697
|
-
return (await
|
|
698
|
-
extraFields: [...
|
|
715
|
+
return (await we({
|
|
716
|
+
extraFields: [...f, ...x, ...c].filter((d) => d !== ""),
|
|
699
717
|
getPermanentAssetsPaths: !0,
|
|
700
718
|
isSiteBuilder: this.isSiteBuilder,
|
|
701
719
|
recordIds: a,
|
|
702
720
|
securityByPassToken: this.securityByPassToken,
|
|
703
721
|
token: this.authToken
|
|
704
|
-
})).items.map((
|
|
705
|
-
|
|
706
|
-
extension:
|
|
722
|
+
})).items.map((d) => {
|
|
723
|
+
const { maxWidth: S, src: R } = Nt({
|
|
724
|
+
extension: d[nt],
|
|
707
725
|
format: i,
|
|
708
|
-
item:
|
|
726
|
+
item: d,
|
|
709
727
|
manualFormat: s,
|
|
710
|
-
size:
|
|
728
|
+
size: d[ut]
|
|
711
729
|
});
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
730
|
+
let A = R;
|
|
731
|
+
return A && r && r.length > 0 && (A = It(A, r)), {
|
|
732
|
+
alt: d.name,
|
|
733
|
+
docType: d[dt],
|
|
734
|
+
extension: d[nt] || "",
|
|
735
|
+
id: d.recordId,
|
|
736
|
+
maxWidth: S,
|
|
737
|
+
name: d.name,
|
|
738
|
+
src: A,
|
|
739
|
+
...f.reduce(
|
|
740
|
+
(F, w) => (F[w] = d[w] ?? "", F),
|
|
721
741
|
{}
|
|
722
742
|
)
|
|
723
743
|
};
|
|
@@ -728,63 +748,63 @@ class Li {
|
|
|
728
748
|
folderId: i,
|
|
729
749
|
forceRefetch: s = !1,
|
|
730
750
|
format: a,
|
|
731
|
-
manualFormat:
|
|
751
|
+
manualFormat: r = !0,
|
|
732
752
|
noPlaceholders: n = !1,
|
|
733
753
|
page: l,
|
|
734
|
-
pageSize:
|
|
735
|
-
transformations:
|
|
754
|
+
pageSize: p = 10,
|
|
755
|
+
transformations: x
|
|
736
756
|
}) {
|
|
737
757
|
(!this.folderId || this.folderId !== i) && (this.folderId = i, this.resetFolderState()), s && this.resetPageCache();
|
|
738
|
-
const c = l *
|
|
758
|
+
const c = l * p, f = c + p - 1;
|
|
739
759
|
return await this.fetchImages({
|
|
740
|
-
end:
|
|
760
|
+
end: f,
|
|
741
761
|
extraFields: e,
|
|
742
762
|
format: a,
|
|
743
|
-
manualFormat:
|
|
763
|
+
manualFormat: r,
|
|
744
764
|
start: c,
|
|
745
|
-
transformations:
|
|
746
|
-
}), n ? this.data.filter((
|
|
765
|
+
transformations: x
|
|
766
|
+
}), n ? this.data.filter((y) => y.id && !y.id.startsWith("temp-")) : this.data;
|
|
747
767
|
}
|
|
748
768
|
async *fetchImagesInFolderByChunk({
|
|
749
769
|
chunkSize: e = 10,
|
|
750
770
|
end: i = 0,
|
|
751
771
|
extraFields: s = [],
|
|
752
772
|
folderId: a,
|
|
753
|
-
forceRefetch:
|
|
773
|
+
forceRefetch: r = !1,
|
|
754
774
|
format: n,
|
|
755
775
|
manualFormat: l = !0,
|
|
756
|
-
start:
|
|
757
|
-
transformations:
|
|
776
|
+
start: p = 0,
|
|
777
|
+
transformations: x
|
|
758
778
|
}) {
|
|
759
779
|
const c = Math.max(1, e);
|
|
760
|
-
if ((!this.folderId || this.folderId !== a) && (this.folderId = a, this.resetFolderState()),
|
|
780
|
+
if ((!this.folderId || this.folderId !== a) && (this.folderId = a, this.resetFolderState()), r && this.resetPageCache(), i !== -1) {
|
|
761
781
|
await this.fetchImages({
|
|
762
782
|
end: i,
|
|
763
783
|
extraFields: s,
|
|
764
784
|
format: n,
|
|
765
785
|
manualFormat: l,
|
|
766
|
-
start:
|
|
767
|
-
transformations:
|
|
786
|
+
start: p,
|
|
787
|
+
transformations: x
|
|
768
788
|
}), yield this.data;
|
|
769
789
|
return;
|
|
770
790
|
}
|
|
771
|
-
let
|
|
791
|
+
let f = p, y = p + c;
|
|
772
792
|
if (await this.fetchImages({
|
|
773
|
-
end:
|
|
793
|
+
end: y,
|
|
774
794
|
extraFields: s,
|
|
775
795
|
format: n,
|
|
776
796
|
manualFormat: l,
|
|
777
|
-
start:
|
|
778
|
-
transformations:
|
|
779
|
-
}), yield this.data, !(!this.totalCount || this.totalCount <=
|
|
780
|
-
for (;
|
|
781
|
-
|
|
782
|
-
end:
|
|
797
|
+
start: f,
|
|
798
|
+
transformations: x
|
|
799
|
+
}), yield this.data, !(!this.totalCount || this.totalCount <= y))
|
|
800
|
+
for (; y < this.totalCount; )
|
|
801
|
+
f = y, y = Math.min(y + c, this.totalCount), await this.fetchImages({
|
|
802
|
+
end: y,
|
|
783
803
|
extraFields: s,
|
|
784
804
|
format: n,
|
|
785
805
|
manualFormat: l,
|
|
786
|
-
start:
|
|
787
|
-
transformations:
|
|
806
|
+
start: f,
|
|
807
|
+
transformations: x
|
|
788
808
|
}), yield this.data;
|
|
789
809
|
}
|
|
790
810
|
hostConnected() {
|
|
@@ -799,34 +819,34 @@ class Li {
|
|
|
799
819
|
this.resetPageCache();
|
|
800
820
|
}
|
|
801
821
|
}
|
|
802
|
-
const
|
|
803
|
-
var
|
|
804
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
805
|
-
(n = t[
|
|
806
|
-
return s && a &&
|
|
822
|
+
const Fe = V`.asset-link-format__details{--header-padding:var(--cx-spacing-small) var(--cx-spacing-medium)}.asset-link-format__details::part(icon){width:var(--cx-font-size-3x-large);height:var(--cx-font-size-3x-large);background-color:var(--cx-color-neutral-100);border-radius:var(--cx-border-radius-large);color:var(--cx-color-neutral-600);font-size:var(--cx-font-size-large);justify-content:center;align-items:center;display:flex}.asset-link-format__details::part(input-label){color:var(--cx-color-neutral-400);margin-inline-start:var(--cx-spacing-small)}.asset-link-format__header{padding:var(--cx-spacing-medium)}.asset-link-format__section-header{padding:0 var(--cx-spacing-medium);border-top:var(--section-header-border-width,1px) solid var(--cx-color-neutral-200);background-color:var(--cx-color-neutral-50)}.asset-link-format__undo,.asset-link-format__reset{--color:var(--cx-color-primary);--background-color:transparent}`, _e = V`cx-details::part(base){border-bottom-width:0}cx-space{width:100%}cx-space cx-input{flex:1}.crop__unit-select{width:120px}.crop__input-group{flex:1;display:flex}`;
|
|
823
|
+
var Me = Object.defineProperty, Ie = Object.getOwnPropertyDescriptor, z = (t, e, i, s) => {
|
|
824
|
+
for (var a = s > 1 ? void 0 : s ? Ie(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
825
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
826
|
+
return s && a && Me(e, i, a), a;
|
|
807
827
|
};
|
|
808
|
-
let v = class extends
|
|
828
|
+
let v = class extends j {
|
|
809
829
|
constructor() {
|
|
810
|
-
super(...arguments), this.localize = new
|
|
811
|
-
[
|
|
830
|
+
super(...arguments), this.localize = new G(this), this.open = !1, this.width = 0, this.height = 0, this.maxWidth = 0, this.maxHeight = 0, this.ratioWidth = 1, this.ratioHeight = 1, this.percentageWidth = 0, this.percentageHeight = 0, this.unit = o.Pixel, this.disabledApply = !1, this.noRatioModes = !1, this.showPositionPicker = !1, this.lastAppliedSetting = {
|
|
831
|
+
[o.Pixel]: {
|
|
812
832
|
height: 0,
|
|
813
833
|
percentageHeight: 100,
|
|
814
834
|
percentageWidth: 100,
|
|
815
|
-
unit:
|
|
835
|
+
unit: o.Pixel,
|
|
816
836
|
width: 0,
|
|
817
837
|
x: 0,
|
|
818
838
|
y: 0
|
|
819
839
|
},
|
|
820
|
-
[
|
|
840
|
+
[o.AspectRatio]: {
|
|
821
841
|
height: 1,
|
|
822
842
|
percentageHeight: 100,
|
|
823
843
|
percentageWidth: 100,
|
|
824
|
-
unit:
|
|
844
|
+
unit: o.AspectRatio,
|
|
825
845
|
width: 1,
|
|
826
846
|
x: 0,
|
|
827
847
|
y: 0
|
|
828
848
|
}
|
|
829
|
-
}, this.loading = !1, this.cropModes = [], this.focusModes = [], this.focusMode = "manual", this.cropMode = "free", this.position =
|
|
849
|
+
}, this.loading = !1, this.cropModes = [], this.focusModes = [], this.focusMode = "manual", this.cropMode = "free", this.position = N.CenterCenter, this.keepAspectRatio = !1, this.invalidWidth = !1, this.invalidHeight = !1, this.aspectRatio = 0;
|
|
830
850
|
}
|
|
831
851
|
get selectedMode() {
|
|
832
852
|
return this.cropModes.find((t) => t.value === this.cropMode);
|
|
@@ -838,10 +858,10 @@ let v = class extends B {
|
|
|
838
858
|
return;
|
|
839
859
|
}
|
|
840
860
|
if (this.keepAspectRatio) {
|
|
841
|
-
if (this.unit ===
|
|
861
|
+
if (this.unit === o.Pixel && this.width && this.height) {
|
|
842
862
|
this.aspectRatio = this.width / this.height;
|
|
843
863
|
return;
|
|
844
|
-
} else if (this.unit ===
|
|
864
|
+
} else if (this.unit === o.AspectRatio && this.ratioWidth && this.ratioHeight) {
|
|
845
865
|
this.aspectRatio = this.ratioWidth / this.ratioHeight;
|
|
846
866
|
return;
|
|
847
867
|
}
|
|
@@ -872,9 +892,9 @@ let v = class extends B {
|
|
|
872
892
|
}
|
|
873
893
|
this.invalidWidth = !1;
|
|
874
894
|
let e = Number(t.target.value);
|
|
875
|
-
this.unit ===
|
|
876
|
-
let i = this.unit ===
|
|
877
|
-
this.keepAspectRatio && (i = Math.round(e / this.aspectRatio), this.unit ===
|
|
895
|
+
this.unit === o.Pixel && (e = Math.max(Math.min(e, this.maxWidth), 1)), t.target.value = e.toString();
|
|
896
|
+
let i = this.unit === o.Pixel ? this.height : this.ratioHeight, s = !1;
|
|
897
|
+
this.keepAspectRatio && (i = Math.round(e / this.aspectRatio), this.unit === o.Pixel && i > this.maxHeight && (i = this.maxHeight, s = !0)), this.invalidHeight = !1, this.emit("cx-asset-link-format-crop-change", {
|
|
878
898
|
detail: {
|
|
879
899
|
breakAspectRatio: s,
|
|
880
900
|
height: i,
|
|
@@ -891,9 +911,9 @@ let v = class extends B {
|
|
|
891
911
|
}
|
|
892
912
|
this.invalidHeight = !1;
|
|
893
913
|
let e = Number(t.target.value);
|
|
894
|
-
this.unit ===
|
|
895
|
-
let i = this.unit ===
|
|
896
|
-
this.keepAspectRatio && (i = Math.round(e * this.aspectRatio), this.unit ===
|
|
914
|
+
this.unit === o.Pixel && (e = Math.max(Math.min(e, this.maxHeight), 1)), t.target.value = e.toString();
|
|
915
|
+
let i = this.unit === o.Pixel ? this.width : this.ratioWidth, s = !1;
|
|
916
|
+
this.keepAspectRatio && (i = Math.round(e * this.aspectRatio), this.unit === o.Pixel && i > this.maxWidth && (i = this.maxWidth, s = !0)), this.invalidWidth = !1, this.emit("cx-asset-link-format-crop-change", {
|
|
897
917
|
detail: {
|
|
898
918
|
breakAspectRatio: s,
|
|
899
919
|
height: e,
|
|
@@ -908,18 +928,18 @@ let v = class extends B {
|
|
|
908
928
|
if (e === "free")
|
|
909
929
|
this.selectedMode?.auto && this.emit("cx-asset-link-format-crop-change", {
|
|
910
930
|
detail: {
|
|
911
|
-
height: this.lastAppliedSetting[
|
|
931
|
+
height: this.lastAppliedSetting[o.Pixel].height,
|
|
912
932
|
keepAspectRatio: !1,
|
|
913
933
|
silent: !0,
|
|
914
|
-
unit:
|
|
915
|
-
width: this.lastAppliedSetting[
|
|
934
|
+
unit: o.Pixel,
|
|
935
|
+
width: this.lastAppliedSetting[o.Pixel].width
|
|
916
936
|
}
|
|
917
937
|
});
|
|
918
938
|
else if (!i) {
|
|
919
939
|
const [s, a] = e.split(":").map(Number);
|
|
920
|
-
if (this.unit ===
|
|
921
|
-
let
|
|
922
|
-
Number.isFinite(this.maxWidth) && Number.isFinite(this.maxHeight) && ({ height: n, width:
|
|
940
|
+
if (this.unit === o.Pixel) {
|
|
941
|
+
let r = s, n = a;
|
|
942
|
+
Number.isFinite(this.maxWidth) && Number.isFinite(this.maxHeight) && ({ height: n, width: r } = re(
|
|
923
943
|
this.maxWidth,
|
|
924
944
|
this.maxHeight,
|
|
925
945
|
s,
|
|
@@ -929,8 +949,8 @@ let v = class extends B {
|
|
|
929
949
|
height: n,
|
|
930
950
|
keepAspectRatio: !0,
|
|
931
951
|
silent: !0,
|
|
932
|
-
unit:
|
|
933
|
-
width:
|
|
952
|
+
unit: o.Pixel,
|
|
953
|
+
width: r
|
|
934
954
|
}
|
|
935
955
|
});
|
|
936
956
|
} else
|
|
@@ -939,7 +959,7 @@ let v = class extends B {
|
|
|
939
959
|
height: a,
|
|
940
960
|
keepAspectRatio: !0,
|
|
941
961
|
silent: !0,
|
|
942
|
-
unit:
|
|
962
|
+
unit: o.AspectRatio,
|
|
943
963
|
width: s
|
|
944
964
|
}
|
|
945
965
|
});
|
|
@@ -972,19 +992,19 @@ let v = class extends B {
|
|
|
972
992
|
* This allows the parent component to update the crop settings accordingly.
|
|
973
993
|
*/
|
|
974
994
|
onUnitChange(t) {
|
|
975
|
-
t.target.value ===
|
|
995
|
+
t.target.value === o.AspectRatio ? this.emit("cx-asset-link-format-crop-change", {
|
|
976
996
|
detail: {
|
|
977
|
-
height: this.lastAppliedSetting[
|
|
997
|
+
height: this.lastAppliedSetting[o.AspectRatio].height,
|
|
978
998
|
keepAspectRatio: this.keepAspectRatio,
|
|
979
|
-
unit:
|
|
980
|
-
width: this.lastAppliedSetting[
|
|
999
|
+
unit: o.AspectRatio,
|
|
1000
|
+
width: this.lastAppliedSetting[o.AspectRatio].width
|
|
981
1001
|
}
|
|
982
1002
|
}) : this.emit("cx-asset-link-format-crop-change", {
|
|
983
1003
|
detail: {
|
|
984
|
-
height: this.lastAppliedSetting[
|
|
1004
|
+
height: this.lastAppliedSetting[o.Pixel].height,
|
|
985
1005
|
keepAspectRatio: this.keepAspectRatio,
|
|
986
|
-
unit:
|
|
987
|
-
width: this.lastAppliedSetting[
|
|
1006
|
+
unit: o.Pixel,
|
|
1007
|
+
width: this.lastAppliedSetting[o.Pixel].width
|
|
988
1008
|
}
|
|
989
1009
|
}), this.emit("cx-asset-link-format-crop-mode-change", {
|
|
990
1010
|
detail: {
|
|
@@ -1028,79 +1048,79 @@ let v = class extends B {
|
|
|
1028
1048
|
}
|
|
1029
1049
|
}), this.emit("cx-asset-link-format-crop-change", {
|
|
1030
1050
|
detail: {
|
|
1031
|
-
height: this.unit ===
|
|
1051
|
+
height: this.unit === o.Pixel ? this.height : this.ratioHeight,
|
|
1032
1052
|
keepAspectRatio: !this.keepAspectRatio,
|
|
1033
1053
|
unit: this.unit,
|
|
1034
|
-
width: this.unit ===
|
|
1054
|
+
width: this.unit === o.Pixel ? this.width : this.ratioWidth
|
|
1035
1055
|
}
|
|
1036
1056
|
});
|
|
1037
1057
|
}
|
|
1038
1058
|
render() {
|
|
1039
1059
|
const t = this.cropModes.filter((i) => !i.auto), e = this.cropModes.filter((i) => i.auto);
|
|
1040
|
-
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="crop"></cx-icon></div><cx-typography variant="body2">${this.localize.term("crop")}</cx-typography></cx-space><cx-space direction="vertical" spacing="small">${
|
|
1060
|
+
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="crop"></cx-icon></div><cx-typography variant="body2">${this.localize.term("crop")}</cx-typography></cx-space><cx-space direction="vertical" spacing="small">${I(
|
|
1041
1061
|
!this.noRatioModes,
|
|
1042
|
-
() => C`<cx-select data-testid="cx-asset-link-format-crop-mode" value=${this.cropMode} hoist style=${
|
|
1062
|
+
() => C`<cx-select data-testid="cx-asset-link-format-crop-mode" value=${this.cropMode} hoist style=${O({
|
|
1043
1063
|
width: "100%"
|
|
1044
|
-
})} @cx-change=${this.onCropModeChange} ?disabled=${this.loading}>${
|
|
1064
|
+
})} @cx-change=${this.onCropModeChange} ?disabled=${this.loading}>${rt(
|
|
1045
1065
|
t,
|
|
1046
1066
|
(i) => i.value,
|
|
1047
1067
|
({ label: i, value: s }) => C`<cx-option value=${s}>${i}</cx-option>`
|
|
1048
1068
|
)}
|
|
1049
|
-
${
|
|
1069
|
+
${I(
|
|
1050
1070
|
e.length > 0,
|
|
1051
1071
|
() => C`<cx-divider></cx-divider><small>${this.localize.term("autoCropping")}</small>`
|
|
1052
1072
|
)}
|
|
1053
|
-
${
|
|
1073
|
+
${rt(
|
|
1054
1074
|
e,
|
|
1055
1075
|
(i) => i.value,
|
|
1056
1076
|
({ label: i, value: s }) => C`<cx-option value=${s}>${i}</cx-option>`
|
|
1057
1077
|
)}</cx-select>`
|
|
1058
|
-
)}<cx-space spacing="small"><div class="crop__input-group"><cx-input data-testid="cx-asset-link-format-crop-width" placeholder=${this.localize.term("width")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit ===
|
|
1078
|
+
)}<cx-space spacing="small"><div class="crop__input-group"><cx-input data-testid="cx-asset-link-format-crop-width" placeholder=${this.localize.term("width")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit === o.Pixel ? this.width.toString() : this.ratioWidth.toString()} @cx-change=${this.handleInputChange} @cx-input=${this.handleWidthChange} required ?disabled=${this.loading}><cx-typography slot="prefix" variant="body3" part="input-label">
|
|
1059
1079
|
W
|
|
1060
|
-
</cx-typography></cx-input><cx-icon-button data-testid="cx-asset-link-format-crop-aspect-ratio" name=${this.keepAspectRatio ? "insert_link" : "link_off"} @click=${this.handleAspectRatioClick} style=${
|
|
1080
|
+
</cx-typography></cx-input><cx-icon-button data-testid="cx-asset-link-format-crop-aspect-ratio" name=${this.keepAspectRatio ? "insert_link" : "link_off"} @click=${this.handleAspectRatioClick} style=${O({
|
|
1061
1081
|
color: this.keepAspectRatio ? "var(--cx-color-primary)" : void 0
|
|
1062
|
-
})} ?disabled=${this.loading}></cx-icon-button><cx-input data-testid="cx-asset-link-format-crop-height" placeholder=${this.localize.term("height")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit ===
|
|
1082
|
+
})} ?disabled=${this.loading}></cx-icon-button><cx-input data-testid="cx-asset-link-format-crop-height" placeholder=${this.localize.term("height")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit === o.Pixel ? this.height.toString() : this.ratioHeight.toString()} ?disabled=${this.loading} @cx-change=${this.handleInputChange} @cx-input=${this.handleHeightChange} required><cx-typography slot="prefix" variant="body3" part="input-label">
|
|
1063
1083
|
H
|
|
1064
|
-
</cx-typography></cx-input></div>${
|
|
1084
|
+
</cx-typography></cx-input></div>${I(
|
|
1065
1085
|
!this.noRatioModes,
|
|
1066
|
-
() => C`<cx-select data-testid="cx-asset-link-format-crop-unit" value=${this.unit} hoist class="crop__unit-select" ?disabled=${this.loading} @cx-change=${this.onUnitChange}><cx-option value=${
|
|
1067
|
-
)}</cx-space>${
|
|
1086
|
+
() => C`<cx-select data-testid="cx-asset-link-format-crop-unit" value=${this.unit} hoist class="crop__unit-select" ?disabled=${this.loading} @cx-change=${this.onUnitChange}><cx-option value=${o.Pixel}>${this.localize.term("pixels")}</cx-option><cx-option value=${o.AspectRatio}>${this.localize.term("aspectRatio")}</cx-option></cx-select>`
|
|
1087
|
+
)}</cx-space>${I(
|
|
1068
1088
|
this.focusModes.length > 0,
|
|
1069
|
-
() => C`<cx-select data-testid="cx-asset-link-format-crop-focus-mode" value=${this.focusMode} hoist style=${
|
|
1089
|
+
() => C`<cx-select data-testid="cx-asset-link-format-crop-focus-mode" value=${this.focusMode} hoist style=${O({
|
|
1070
1090
|
width: "100%"
|
|
1071
|
-
})} @cx-change=${this.onFocusModeChange} ?disabled=${this.loading || this.selectedMode?.disabledSize}>${
|
|
1091
|
+
})} @cx-change=${this.onFocusModeChange} ?disabled=${this.loading || this.selectedMode?.disabledSize}>${rt(
|
|
1072
1092
|
this.focusModes,
|
|
1073
1093
|
(i) => i.value,
|
|
1074
1094
|
({ label: i, value: s }) => C`<cx-option value=${s}>${i}</cx-option>`
|
|
1075
1095
|
)}</cx-select>`
|
|
1076
1096
|
)}
|
|
1077
|
-
${
|
|
1097
|
+
${I(
|
|
1078
1098
|
this.showPositionPicker && this.focusMode === "manual",
|
|
1079
1099
|
() => C`<cx-position-picker data-testid="cx-asset-link-format-crop-position" value=${this.position} @cx-change=${this.onPositionChange}></cx-position-picker>`
|
|
1080
|
-
)}<cx-button data-testid="cx-asset-link-format-crop-apply" variant="primary" ?disabled=${this.disabledApply || this.invalidHeight || this.invalidWidth} ?loading=${this.loading} style=${
|
|
1100
|
+
)}<cx-button data-testid="cx-asset-link-format-crop-apply" variant="primary" ?disabled=${this.disabledApply || this.invalidHeight || this.invalidWidth} ?loading=${this.loading} style=${O({
|
|
1081
1101
|
marginLeft: "auto"
|
|
1082
1102
|
})} @click=${this.handleApply}>${this.localize.term("apply")}</cx-button></cx-space></cx-details>`;
|
|
1083
1103
|
}
|
|
1084
1104
|
};
|
|
1085
|
-
v.styles = [
|
|
1105
|
+
v.styles = [Q, _e];
|
|
1086
1106
|
v.dependencies = {
|
|
1087
|
-
"cx-button":
|
|
1088
|
-
"cx-details":
|
|
1089
|
-
"cx-divider":
|
|
1090
|
-
"cx-icon":
|
|
1091
|
-
"cx-icon-button":
|
|
1092
|
-
"cx-input":
|
|
1093
|
-
"cx-option":
|
|
1094
|
-
"cx-position-picker":
|
|
1095
|
-
"cx-select":
|
|
1096
|
-
"cx-space":
|
|
1097
|
-
"cx-typography":
|
|
1107
|
+
"cx-button": J,
|
|
1108
|
+
"cx-details": it,
|
|
1109
|
+
"cx-divider": qt,
|
|
1110
|
+
"cx-icon": st,
|
|
1111
|
+
"cx-icon-button": Pt,
|
|
1112
|
+
"cx-input": Ft,
|
|
1113
|
+
"cx-option": St,
|
|
1114
|
+
"cx-position-picker": oe,
|
|
1115
|
+
"cx-select": At,
|
|
1116
|
+
"cx-space": B,
|
|
1117
|
+
"cx-typography": q
|
|
1098
1118
|
};
|
|
1099
1119
|
z([
|
|
1100
|
-
|
|
1120
|
+
tt(".details")
|
|
1101
1121
|
], v.prototype, "base", 2);
|
|
1102
1122
|
z([
|
|
1103
|
-
|
|
1123
|
+
tt("cx-position-picker")
|
|
1104
1124
|
], v.prototype, "positionPicker", 2);
|
|
1105
1125
|
z([
|
|
1106
1126
|
h({ reflect: !0, type: Boolean })
|
|
@@ -1166,13 +1186,13 @@ z([
|
|
|
1166
1186
|
h({ attribute: "keep-aspect-ratio", reflect: !0, type: Boolean })
|
|
1167
1187
|
], v.prototype, "keepAspectRatio", 2);
|
|
1168
1188
|
z([
|
|
1169
|
-
|
|
1189
|
+
k()
|
|
1170
1190
|
], v.prototype, "invalidWidth", 2);
|
|
1171
1191
|
z([
|
|
1172
|
-
|
|
1192
|
+
k()
|
|
1173
1193
|
], v.prototype, "invalidHeight", 2);
|
|
1174
1194
|
z([
|
|
1175
|
-
|
|
1195
|
+
k()
|
|
1176
1196
|
], v.prototype, "aspectRatio", 2);
|
|
1177
1197
|
z([
|
|
1178
1198
|
P("cropMode", { waitUntilFirstUpdate: !0 }),
|
|
@@ -1184,17 +1204,17 @@ z([
|
|
|
1184
1204
|
P("open", { waitUntilFirstUpdate: !0 })
|
|
1185
1205
|
], v.prototype, "handleOpenChange", 1);
|
|
1186
1206
|
v = z([
|
|
1187
|
-
|
|
1207
|
+
X("cx-asset-link-format-crop")
|
|
1188
1208
|
], v);
|
|
1189
|
-
const
|
|
1190
|
-
var
|
|
1191
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
1192
|
-
(n = t[
|
|
1193
|
-
return s && a &&
|
|
1209
|
+
const Ee = V`.extension{padding:var(--cx-spacing-small) var(--cx-spacing-medium);border:solid 1px var(--cx-color-neutral-200);background-color:var(--cx-color-neutral-0);& cx-select{flex:1;width:100%}}`;
|
|
1210
|
+
var Te = Object.defineProperty, He = Object.getOwnPropertyDescriptor, Mt = (t, e, i, s) => {
|
|
1211
|
+
for (var a = s > 1 ? void 0 : s ? He(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
1212
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
1213
|
+
return s && a && Te(e, i, a), a;
|
|
1194
1214
|
};
|
|
1195
|
-
let
|
|
1215
|
+
let Y = class extends j {
|
|
1196
1216
|
constructor() {
|
|
1197
|
-
super(...arguments), this.localize = new
|
|
1217
|
+
super(...arguments), this.localize = new G(this), this.value = "", this.items = [];
|
|
1198
1218
|
}
|
|
1199
1219
|
handleExtensionChange(t) {
|
|
1200
1220
|
const e = t.target.value;
|
|
@@ -1203,46 +1223,46 @@ let X = class extends B {
|
|
|
1203
1223
|
});
|
|
1204
1224
|
}
|
|
1205
1225
|
render() {
|
|
1206
|
-
return C`<cx-space direction="vertical" spacing="small" class="extension"><cx-typography variant="body2">${this.localize.term("extension")}</cx-typography><cx-select data-label=${this.localize.term("extension")} data-testid="cx-asset-link-format-extension-select" value=${this.value} hoist @cx-change=${this.handleExtensionChange}>${
|
|
1226
|
+
return C`<cx-space direction="vertical" spacing="small" class="extension"><cx-typography variant="body2">${this.localize.term("extension")}</cx-typography><cx-select data-label=${this.localize.term("extension")} data-testid="cx-asset-link-format-extension-select" value=${this.value} hoist @cx-change=${this.handleExtensionChange}>${rt(
|
|
1207
1227
|
this.items,
|
|
1208
1228
|
(t) => t.value,
|
|
1209
1229
|
(t) => C`<cx-option value=${t.value}>${t.displayName}</cx-option>`
|
|
1210
1230
|
)}</cx-select></cx-space>`;
|
|
1211
1231
|
}
|
|
1212
1232
|
};
|
|
1213
|
-
|
|
1214
|
-
|
|
1215
|
-
"cx-option":
|
|
1216
|
-
"cx-select":
|
|
1217
|
-
"cx-space":
|
|
1218
|
-
"cx-typography":
|
|
1233
|
+
Y.styles = [Q, Ee];
|
|
1234
|
+
Y.dependencies = {
|
|
1235
|
+
"cx-option": St,
|
|
1236
|
+
"cx-select": At,
|
|
1237
|
+
"cx-space": B,
|
|
1238
|
+
"cx-typography": q
|
|
1219
1239
|
};
|
|
1220
|
-
|
|
1240
|
+
Mt([
|
|
1221
1241
|
h({ reflect: !0, type: String })
|
|
1222
|
-
],
|
|
1223
|
-
|
|
1242
|
+
], Y.prototype, "value", 2);
|
|
1243
|
+
Mt([
|
|
1224
1244
|
h({ reflect: !1, type: Array })
|
|
1225
|
-
],
|
|
1226
|
-
|
|
1227
|
-
|
|
1228
|
-
],
|
|
1229
|
-
const
|
|
1230
|
-
var
|
|
1231
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
1232
|
-
(n = t[
|
|
1233
|
-
return s && a &&
|
|
1245
|
+
], Y.prototype, "items", 2);
|
|
1246
|
+
Y = Mt([
|
|
1247
|
+
X("cx-asset-link-format-extension")
|
|
1248
|
+
], Y);
|
|
1249
|
+
const We = V`cx-details::part(base){border-bottom-width:0}`;
|
|
1250
|
+
var De = Object.defineProperty, Ne = Object.getOwnPropertyDescriptor, D = (t, e, i, s) => {
|
|
1251
|
+
for (var a = s > 1 ? void 0 : s ? Ne(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
1252
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
1253
|
+
return s && a && De(e, i, a), a;
|
|
1234
1254
|
};
|
|
1235
|
-
const
|
|
1236
|
-
let
|
|
1255
|
+
const bt = "auto";
|
|
1256
|
+
let E = class extends j {
|
|
1237
1257
|
constructor() {
|
|
1238
|
-
super(...arguments), this.localize = new
|
|
1258
|
+
super(...arguments), this.localize = new G(this), this.open = !1, this.value = "", this.items = [], this.canAutoFormat = !1, this.autoFormat = !1, this.loading = !1, this.scopedValue = "";
|
|
1239
1259
|
}
|
|
1240
1260
|
/**
|
|
1241
1261
|
* The listbox value that represents the committed choice: the `Auto` entry when that is
|
|
1242
1262
|
* active, otherwise the resolved proxy id.
|
|
1243
1263
|
*/
|
|
1244
1264
|
get committedValue() {
|
|
1245
|
-
return this.autoFormat ?
|
|
1265
|
+
return this.autoFormat ? bt : this.value;
|
|
1246
1266
|
}
|
|
1247
1267
|
handleValueChange() {
|
|
1248
1268
|
this.scopedValue = this.committedValue;
|
|
@@ -1262,7 +1282,7 @@ let M = class extends B {
|
|
|
1262
1282
|
handleApply() {
|
|
1263
1283
|
if (this.loading)
|
|
1264
1284
|
return;
|
|
1265
|
-
if (this.scopedValue ===
|
|
1285
|
+
if (this.scopedValue === bt) {
|
|
1266
1286
|
this.emit("cx-asset-link-format-proxy-change", {
|
|
1267
1287
|
detail: { autoFormat: !0 }
|
|
1268
1288
|
});
|
|
@@ -1292,74 +1312,74 @@ let M = class extends B {
|
|
|
1292
1312
|
t.target !== this.base && t.stopPropagation();
|
|
1293
1313
|
}
|
|
1294
1314
|
render() {
|
|
1295
|
-
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="photo_size_select_large"></cx-icon></div><cx-typography variant="body2">${this.localize.term("format")}</cx-typography></cx-space><cx-space direction="vertical" spacing="small" class="format"><cx-select data-label=${this.localize.term("imageFormat")} data-testid="cx-asset-link-format-proxy-select" value=${this.scopedValue} hoist @cx-change=${this.handleProxyChange} ?disabled=${this.loading}>${
|
|
1315
|
+
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="photo_size_select_large"></cx-icon></div><cx-typography variant="body2">${this.localize.term("format")}</cx-typography></cx-space><cx-space direction="vertical" spacing="small" class="format"><cx-select data-label=${this.localize.term("imageFormat")} data-testid="cx-asset-link-format-proxy-select" value=${this.scopedValue} hoist @cx-change=${this.handleProxyChange} ?disabled=${this.loading}>${rt(
|
|
1296
1316
|
this.items,
|
|
1297
1317
|
(t) => t.id,
|
|
1298
1318
|
(t) => C`<cx-option value=${t.id}>${t.proxyLabel}</cx-option>`
|
|
1299
1319
|
)}
|
|
1300
|
-
${
|
|
1320
|
+
${I(
|
|
1301
1321
|
this.canAutoFormat,
|
|
1302
|
-
() => C`<cx-divider></cx-divider><cx-option data-testid="cx-asset-link-format-proxy-auto-option" value=${
|
|
1303
|
-
() =>
|
|
1304
|
-
)}</cx-select><cx-button data-testid="cx-asset-link-format-proxy-apply" variant="primary" style=${
|
|
1322
|
+
() => C`<cx-divider></cx-divider><cx-option data-testid="cx-asset-link-format-proxy-auto-option" value=${bt}>${this.localize.term("auto")}</cx-option>`,
|
|
1323
|
+
() => Ut
|
|
1324
|
+
)}</cx-select><cx-button data-testid="cx-asset-link-format-proxy-apply" variant="primary" style=${O({
|
|
1305
1325
|
"margin-left": "auto"
|
|
1306
1326
|
})} ?disabled=${this.scopedValue === this.committedValue} ?loading=${this.loading} @click=${this.handleApply}>${this.localize.term("apply")}</cx-button></cx-space></cx-details>`;
|
|
1307
1327
|
}
|
|
1308
1328
|
};
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
"cx-button":
|
|
1312
|
-
"cx-details":
|
|
1313
|
-
"cx-divider":
|
|
1314
|
-
"cx-icon":
|
|
1315
|
-
"cx-option":
|
|
1316
|
-
"cx-select":
|
|
1317
|
-
"cx-space":
|
|
1318
|
-
"cx-typography":
|
|
1329
|
+
E.styles = [Q, We];
|
|
1330
|
+
E.dependencies = {
|
|
1331
|
+
"cx-button": J,
|
|
1332
|
+
"cx-details": it,
|
|
1333
|
+
"cx-divider": qt,
|
|
1334
|
+
"cx-icon": st,
|
|
1335
|
+
"cx-option": St,
|
|
1336
|
+
"cx-select": At,
|
|
1337
|
+
"cx-space": B,
|
|
1338
|
+
"cx-typography": q
|
|
1319
1339
|
};
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
],
|
|
1323
|
-
|
|
1340
|
+
D([
|
|
1341
|
+
tt(".details")
|
|
1342
|
+
], E.prototype, "base", 2);
|
|
1343
|
+
D([
|
|
1324
1344
|
h({ reflect: !0, type: Boolean })
|
|
1325
|
-
],
|
|
1326
|
-
|
|
1345
|
+
], E.prototype, "open", 2);
|
|
1346
|
+
D([
|
|
1327
1347
|
h({ reflect: !0, type: String })
|
|
1328
|
-
],
|
|
1329
|
-
|
|
1348
|
+
], E.prototype, "value", 2);
|
|
1349
|
+
D([
|
|
1330
1350
|
h({ reflect: !1, type: Array })
|
|
1331
|
-
],
|
|
1332
|
-
|
|
1351
|
+
], E.prototype, "items", 2);
|
|
1352
|
+
D([
|
|
1333
1353
|
h({ attribute: "can-auto-format", reflect: !0, type: Boolean })
|
|
1334
|
-
],
|
|
1335
|
-
|
|
1354
|
+
], E.prototype, "canAutoFormat", 2);
|
|
1355
|
+
D([
|
|
1336
1356
|
h({ attribute: "auto-format", reflect: !0, type: Boolean })
|
|
1337
|
-
],
|
|
1338
|
-
|
|
1357
|
+
], E.prototype, "autoFormat", 2);
|
|
1358
|
+
D([
|
|
1339
1359
|
h({ reflect: !0, type: Boolean })
|
|
1340
|
-
],
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
],
|
|
1344
|
-
|
|
1360
|
+
], E.prototype, "loading", 2);
|
|
1361
|
+
D([
|
|
1362
|
+
k()
|
|
1363
|
+
], E.prototype, "scopedValue", 2);
|
|
1364
|
+
D([
|
|
1345
1365
|
P("autoFormat"),
|
|
1346
1366
|
P("value")
|
|
1347
|
-
],
|
|
1348
|
-
|
|
1367
|
+
], E.prototype, "handleValueChange", 1);
|
|
1368
|
+
D([
|
|
1349
1369
|
P("open", { waitUntilFirstUpdate: !0 })
|
|
1350
|
-
],
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
],
|
|
1354
|
-
const
|
|
1355
|
-
var
|
|
1356
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
1357
|
-
(n = t[
|
|
1358
|
-
return s && a &&
|
|
1370
|
+
], E.prototype, "handleOpenChange", 1);
|
|
1371
|
+
E = D([
|
|
1372
|
+
X("cx-asset-link-format-proxy")
|
|
1373
|
+
], E);
|
|
1374
|
+
const Oe = V`cx-details::part(base){border-bottom-width:0}`;
|
|
1375
|
+
var Le = Object.defineProperty, Ue = Object.getOwnPropertyDescriptor, et = (t, e, i, s) => {
|
|
1376
|
+
for (var a = s > 1 ? void 0 : s ? Ue(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
1377
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
1378
|
+
return s && a && Le(e, i, a), a;
|
|
1359
1379
|
};
|
|
1360
|
-
let
|
|
1380
|
+
let W = class extends j {
|
|
1361
1381
|
constructor() {
|
|
1362
|
-
super(...arguments), this.localize = new
|
|
1382
|
+
super(...arguments), this.localize = new G(this), this.open = !1, this.value = 100, this.loading = !1, this.scopedValue = 100;
|
|
1363
1383
|
}
|
|
1364
1384
|
/**
|
|
1365
1385
|
* A computed property that checks if the current quality value is invalid.
|
|
@@ -1403,53 +1423,53 @@ let T = class extends B {
|
|
|
1403
1423
|
t.target !== this.base && t.stopPropagation();
|
|
1404
1424
|
}
|
|
1405
1425
|
render() {
|
|
1406
|
-
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div class="details__summary__icon"><div part="icon"><cx-icon name="blur_on"></cx-icon></div></div><cx-typography variant="body2">${this.localize.term("quality")}</cx-typography></cx-space><cx-space spacing="small"><cx-tooltip data-testid="cx-asset-link-format-quality-tooltip" content=${this.localize.term("qualityHelpText")} hoist><cx-input data-testid="cx-asset-link-format-quality" class="details__checkbox" mask="num" .maskBlocks=${{ num: { mask: Number, max: 100, min: 1 } }} value=${this.scopedValue.toString()} style=${
|
|
1426
|
+
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div class="details__summary__icon"><div part="icon"><cx-icon name="blur_on"></cx-icon></div></div><cx-typography variant="body2">${this.localize.term("quality")}</cx-typography></cx-space><cx-space spacing="small"><cx-tooltip data-testid="cx-asset-link-format-quality-tooltip" content=${this.localize.term("qualityHelpText")} hoist><cx-input data-testid="cx-asset-link-format-quality" class="details__checkbox" mask="num" .maskBlocks=${{ num: { mask: Number, max: 100, min: 1 } }} value=${this.scopedValue.toString()} style=${O({
|
|
1407
1427
|
flex: "1"
|
|
1408
1428
|
})} @cx-input=${this.handleQualityChange}></cx-input></cx-tooltip><cx-button data-testid="cx-asset-link-format-quality-apply" variant="primary" ?disabled=${this.invalidValue} ?loading=${this.loading} @click=${this.handleApply}>${this.localize.term("apply")}</cx-button></cx-space></cx-details>`;
|
|
1409
1429
|
}
|
|
1410
1430
|
};
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
"cx-button":
|
|
1414
|
-
"cx-details":
|
|
1415
|
-
"cx-icon":
|
|
1416
|
-
"cx-input":
|
|
1417
|
-
"cx-space":
|
|
1418
|
-
"cx-tooltip":
|
|
1419
|
-
"cx-typography":
|
|
1431
|
+
W.styles = [Q, Oe];
|
|
1432
|
+
W.dependencies = {
|
|
1433
|
+
"cx-button": J,
|
|
1434
|
+
"cx-details": it,
|
|
1435
|
+
"cx-icon": st,
|
|
1436
|
+
"cx-input": Ft,
|
|
1437
|
+
"cx-space": B,
|
|
1438
|
+
"cx-tooltip": jt,
|
|
1439
|
+
"cx-typography": q
|
|
1420
1440
|
};
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
],
|
|
1424
|
-
|
|
1441
|
+
et([
|
|
1442
|
+
tt(".details")
|
|
1443
|
+
], W.prototype, "base", 2);
|
|
1444
|
+
et([
|
|
1425
1445
|
h({ reflect: !0, type: Boolean })
|
|
1426
|
-
],
|
|
1427
|
-
|
|
1446
|
+
], W.prototype, "open", 2);
|
|
1447
|
+
et([
|
|
1428
1448
|
h({ reflect: !0, type: Number })
|
|
1429
|
-
],
|
|
1430
|
-
|
|
1449
|
+
], W.prototype, "value", 2);
|
|
1450
|
+
et([
|
|
1431
1451
|
h({ reflect: !0, type: Boolean })
|
|
1432
|
-
],
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
],
|
|
1436
|
-
|
|
1452
|
+
], W.prototype, "loading", 2);
|
|
1453
|
+
et([
|
|
1454
|
+
k()
|
|
1455
|
+
], W.prototype, "scopedValue", 2);
|
|
1456
|
+
et([
|
|
1437
1457
|
P("value")
|
|
1438
|
-
],
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
],
|
|
1442
|
-
const
|
|
1443
|
-
var
|
|
1444
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
1445
|
-
(n = t[
|
|
1446
|
-
return s && a &&
|
|
1458
|
+
], W.prototype, "handleValueChange", 1);
|
|
1459
|
+
W = et([
|
|
1460
|
+
X("cx-asset-link-format-quality")
|
|
1461
|
+
], W);
|
|
1462
|
+
const Be = V`cx-details::part(base){border-bottom-width:0}cx-space{width:100%}cx-space cx-input{flex:1}.resize__unit-select{width:120px}.resize__input-group{flex:1;display:flex}`;
|
|
1463
|
+
var qe = Object.defineProperty, je = Object.getOwnPropertyDescriptor, $ = (t, e, i, s) => {
|
|
1464
|
+
for (var a = s > 1 ? void 0 : s ? je(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
1465
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
1466
|
+
return s && a && qe(e, i, a), a;
|
|
1447
1467
|
};
|
|
1448
|
-
let
|
|
1468
|
+
let b = class extends j {
|
|
1449
1469
|
constructor() {
|
|
1450
|
-
super(...arguments), this.localize = new
|
|
1451
|
-
[
|
|
1452
|
-
[
|
|
1470
|
+
super(...arguments), this.localize = new G(this), this.open = !1, this.width = 0, this.height = 0, this.maxWidth = 0, this.maxHeight = 0, this.ratioWidth = 1, this.ratioHeight = 1, this.unit = o.Pixel, this.lastAppliedSetting = {
|
|
1471
|
+
[o.Pixel]: { height: 0, width: 0 },
|
|
1472
|
+
[o.AspectRatio]: { height: 1, width: 1 }
|
|
1453
1473
|
}, this.loading = !1, this.noRatioModes = !1, this.keepAspectRatio = !1, this.invalidWidth = !1, this.invalidHeight = !1, this.aspectRatio = 0;
|
|
1454
1474
|
}
|
|
1455
1475
|
/**
|
|
@@ -1463,11 +1483,11 @@ let w = class extends B {
|
|
|
1463
1483
|
async handleCropModeChange() {
|
|
1464
1484
|
const t = Number.isFinite(this.maxWidth) && Number.isFinite(this.maxHeight) && this.maxWidth > 0 && this.maxHeight > 0;
|
|
1465
1485
|
if (this.keepAspectRatio) {
|
|
1466
|
-
if (this.unit ===
|
|
1486
|
+
if (this.unit === o.AspectRatio && this.ratioWidth && this.ratioHeight) {
|
|
1467
1487
|
this.aspectRatio = this.ratioWidth / this.ratioHeight;
|
|
1468
1488
|
return;
|
|
1469
1489
|
}
|
|
1470
|
-
if (this.unit ===
|
|
1490
|
+
if (this.unit === o.Pixel && !t && this.width && this.height) {
|
|
1471
1491
|
this.aspectRatio = this.width / this.height;
|
|
1472
1492
|
return;
|
|
1473
1493
|
}
|
|
@@ -1498,8 +1518,8 @@ let w = class extends B {
|
|
|
1498
1518
|
}
|
|
1499
1519
|
this.invalidWidth = !1;
|
|
1500
1520
|
let e = Number(t.target.value);
|
|
1501
|
-
this.unit ===
|
|
1502
|
-
let i = this.unit ===
|
|
1521
|
+
this.unit === o.Pixel && (e = Math.max(Math.min(e, this.maxWidth), 1)), t.target.value = e.toString();
|
|
1522
|
+
let i = this.unit === o.Pixel ? this.height : this.ratioHeight;
|
|
1503
1523
|
this.keepAspectRatio && (i = Math.min(
|
|
1504
1524
|
Math.round(e / this.aspectRatio),
|
|
1505
1525
|
this.maxHeight
|
|
@@ -1519,8 +1539,8 @@ let w = class extends B {
|
|
|
1519
1539
|
}
|
|
1520
1540
|
this.invalidHeight = !1;
|
|
1521
1541
|
let e = Number(t.target.value);
|
|
1522
|
-
this.unit ===
|
|
1523
|
-
let i = this.unit ===
|
|
1542
|
+
this.unit === o.Pixel && (e = Math.max(Math.min(e, this.maxHeight), 1)), t.target.value = e.toString();
|
|
1543
|
+
let i = this.unit === o.Pixel ? this.width : this.ratioWidth;
|
|
1524
1544
|
this.keepAspectRatio && (i = Math.min(
|
|
1525
1545
|
Math.round(e * this.aspectRatio),
|
|
1526
1546
|
this.maxWidth
|
|
@@ -1534,19 +1554,19 @@ let w = class extends B {
|
|
|
1534
1554
|
});
|
|
1535
1555
|
}
|
|
1536
1556
|
onUnitChange(t) {
|
|
1537
|
-
t.target.value ===
|
|
1557
|
+
t.target.value === o.AspectRatio ? this.emit("cx-asset-link-format-resize-change", {
|
|
1538
1558
|
detail: {
|
|
1539
|
-
height: this.lastAppliedSetting[
|
|
1559
|
+
height: this.lastAppliedSetting[o.AspectRatio].height,
|
|
1540
1560
|
keepAspectRatio: this.keepAspectRatio,
|
|
1541
|
-
unit:
|
|
1542
|
-
width: this.lastAppliedSetting[
|
|
1561
|
+
unit: o.AspectRatio,
|
|
1562
|
+
width: this.lastAppliedSetting[o.AspectRatio].width
|
|
1543
1563
|
}
|
|
1544
1564
|
}) : this.emit("cx-asset-link-format-resize-change", {
|
|
1545
1565
|
detail: {
|
|
1546
|
-
height: this.lastAppliedSetting[
|
|
1566
|
+
height: this.lastAppliedSetting[o.Pixel].height,
|
|
1547
1567
|
keepAspectRatio: this.keepAspectRatio,
|
|
1548
|
-
unit:
|
|
1549
|
-
width: this.lastAppliedSetting[
|
|
1568
|
+
unit: o.Pixel,
|
|
1569
|
+
width: this.lastAppliedSetting[o.Pixel].width
|
|
1550
1570
|
}
|
|
1551
1571
|
});
|
|
1552
1572
|
}
|
|
@@ -1578,109 +1598,109 @@ let w = class extends B {
|
|
|
1578
1598
|
handleAspectRatioClick() {
|
|
1579
1599
|
this.emit("cx-asset-link-format-resize-change", {
|
|
1580
1600
|
detail: {
|
|
1581
|
-
height: this.unit ===
|
|
1601
|
+
height: this.unit === o.Pixel ? this.height : this.ratioHeight,
|
|
1582
1602
|
keepAspectRatio: !this.keepAspectRatio,
|
|
1583
1603
|
unit: this.unit,
|
|
1584
|
-
width: this.unit ===
|
|
1604
|
+
width: this.unit === o.Pixel ? this.width : this.ratioWidth
|
|
1585
1605
|
}
|
|
1586
1606
|
});
|
|
1587
1607
|
}
|
|
1588
1608
|
render() {
|
|
1589
|
-
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="aspect_ratio"></cx-icon></div><cx-typography variant="body2">${this.localize.term("resize")}</cx-typography></cx-space><cx-space direction="vertical" spacing="small"><cx-space spacing="small"><div class="resize__input-group"><cx-input data-testid="cx-asset-link-format-resize-width" placeholder=${this.localize.term("width")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit ===
|
|
1609
|
+
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="aspect_ratio"></cx-icon></div><cx-typography variant="body2">${this.localize.term("resize")}</cx-typography></cx-space><cx-space direction="vertical" spacing="small"><cx-space spacing="small"><div class="resize__input-group"><cx-input data-testid="cx-asset-link-format-resize-width" placeholder=${this.localize.term("width")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit === o.Pixel ? this.width.toString() : this.ratioWidth.toString()} @cx-input=${this.handleWidthChange} required ?disabled=${this.loading}><cx-typography slot="prefix" variant="body3" part="input-label">
|
|
1590
1610
|
W
|
|
1591
|
-
</cx-typography></cx-input><cx-icon-button data-testid="cx-asset-link-format-resize-aspect-ratio" name=${this.keepAspectRatio ? "insert_link" : "link_off"} @click=${this.handleAspectRatioClick} style=${
|
|
1611
|
+
</cx-typography></cx-input><cx-icon-button data-testid="cx-asset-link-format-resize-aspect-ratio" name=${this.keepAspectRatio ? "insert_link" : "link_off"} @click=${this.handleAspectRatioClick} style=${O({
|
|
1592
1612
|
color: this.keepAspectRatio ? "var(--cx-color-primary)" : void 0
|
|
1593
|
-
})} ?disabled=${this.loading}></cx-icon-button><cx-input data-testid="cx-asset-link-format-resize-height" placeholder=${this.localize.term("height")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit ===
|
|
1613
|
+
})} ?disabled=${this.loading}></cx-icon-button><cx-input data-testid="cx-asset-link-format-resize-height" placeholder=${this.localize.term("height")} mask="num" .maskBlocks=${{ num: { mask: Number, min: 1 } }} value=${this.unit === o.Pixel ? this.height.toString() : this.ratioHeight.toString()} @cx-input=${this.handleHeightChange} required ?disabled=${this.loading}><cx-typography slot="prefix" variant="body3" part="input-label">
|
|
1594
1614
|
H
|
|
1595
|
-
</cx-typography></cx-input></div>${
|
|
1615
|
+
</cx-typography></cx-input></div>${I(
|
|
1596
1616
|
!this.noRatioModes,
|
|
1597
|
-
() => C`<cx-select data-testid="cx-asset-link-format-resize-unit" value=${this.unit} hoist class="resize__unit-select" @cx-change=${this.onUnitChange}><cx-option value=${
|
|
1598
|
-
)}</cx-space><cx-button data-testid="cx-asset-link-format-resize-apply" variant="primary" ?disabled=${this.disabledApply || this.invalidHeight || this.invalidWidth} ?loading=${this.loading} style=${
|
|
1617
|
+
() => C`<cx-select data-testid="cx-asset-link-format-resize-unit" value=${this.unit} hoist class="resize__unit-select" @cx-change=${this.onUnitChange}><cx-option value=${o.Pixel}>${this.localize.term("pixels")}</cx-option><cx-option value=${o.AspectRatio}>${this.localize.term("aspectRatio")}</cx-option></cx-select>`
|
|
1618
|
+
)}</cx-space><cx-button data-testid="cx-asset-link-format-resize-apply" variant="primary" ?disabled=${this.disabledApply || this.invalidHeight || this.invalidWidth} ?loading=${this.loading} style=${O({
|
|
1599
1619
|
marginLeft: "auto"
|
|
1600
1620
|
})} @click=${this.handleApply}>${this.localize.term("apply")}</cx-button></cx-space></cx-details>`;
|
|
1601
1621
|
}
|
|
1602
1622
|
};
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
"cx-button":
|
|
1606
|
-
"cx-details":
|
|
1607
|
-
"cx-icon":
|
|
1608
|
-
"cx-icon-button":
|
|
1609
|
-
"cx-input":
|
|
1610
|
-
"cx-option":
|
|
1611
|
-
"cx-select":
|
|
1612
|
-
"cx-space":
|
|
1613
|
-
"cx-typography":
|
|
1623
|
+
b.styles = [Q, Be];
|
|
1624
|
+
b.dependencies = {
|
|
1625
|
+
"cx-button": J,
|
|
1626
|
+
"cx-details": it,
|
|
1627
|
+
"cx-icon": st,
|
|
1628
|
+
"cx-icon-button": Pt,
|
|
1629
|
+
"cx-input": Ft,
|
|
1630
|
+
"cx-option": St,
|
|
1631
|
+
"cx-select": At,
|
|
1632
|
+
"cx-space": B,
|
|
1633
|
+
"cx-typography": q
|
|
1614
1634
|
};
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
],
|
|
1618
|
-
|
|
1635
|
+
$([
|
|
1636
|
+
tt(".details")
|
|
1637
|
+
], b.prototype, "base", 2);
|
|
1638
|
+
$([
|
|
1619
1639
|
h({ reflect: !0, type: Boolean })
|
|
1620
|
-
],
|
|
1621
|
-
|
|
1640
|
+
], b.prototype, "open", 2);
|
|
1641
|
+
$([
|
|
1622
1642
|
h({ reflect: !0, type: Number })
|
|
1623
|
-
],
|
|
1624
|
-
|
|
1643
|
+
], b.prototype, "width", 2);
|
|
1644
|
+
$([
|
|
1625
1645
|
h({ reflect: !0, type: Number })
|
|
1626
|
-
],
|
|
1627
|
-
|
|
1646
|
+
], b.prototype, "height", 2);
|
|
1647
|
+
$([
|
|
1628
1648
|
h({ attribute: "max-width", reflect: !0, type: Number })
|
|
1629
|
-
],
|
|
1630
|
-
|
|
1649
|
+
], b.prototype, "maxWidth", 2);
|
|
1650
|
+
$([
|
|
1631
1651
|
h({ attribute: "max-height", reflect: !0, type: Number })
|
|
1632
|
-
],
|
|
1633
|
-
|
|
1652
|
+
], b.prototype, "maxHeight", 2);
|
|
1653
|
+
$([
|
|
1634
1654
|
h({ attribute: "ratio-width", reflect: !0, type: Number })
|
|
1635
|
-
],
|
|
1636
|
-
|
|
1655
|
+
], b.prototype, "ratioWidth", 2);
|
|
1656
|
+
$([
|
|
1637
1657
|
h({ attribute: "ratio-height", reflect: !0, type: Number })
|
|
1638
|
-
],
|
|
1639
|
-
|
|
1658
|
+
], b.prototype, "ratioHeight", 2);
|
|
1659
|
+
$([
|
|
1640
1660
|
h({ reflect: !0, type: String })
|
|
1641
|
-
],
|
|
1642
|
-
|
|
1661
|
+
], b.prototype, "unit", 2);
|
|
1662
|
+
$([
|
|
1643
1663
|
h({ attribute: "last-applied-setting", reflect: !1, type: Object })
|
|
1644
|
-
],
|
|
1645
|
-
|
|
1664
|
+
], b.prototype, "lastAppliedSetting", 2);
|
|
1665
|
+
$([
|
|
1646
1666
|
h({ reflect: !0, type: Boolean })
|
|
1647
|
-
],
|
|
1648
|
-
|
|
1667
|
+
], b.prototype, "loading", 2);
|
|
1668
|
+
$([
|
|
1649
1669
|
h({ attribute: "no-ratio-modes", reflect: !0, type: Boolean })
|
|
1650
|
-
],
|
|
1651
|
-
|
|
1670
|
+
], b.prototype, "noRatioModes", 2);
|
|
1671
|
+
$([
|
|
1652
1672
|
h({ attribute: "keep-aspect-ratio", reflect: !0, type: Boolean })
|
|
1653
|
-
],
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
],
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
],
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
],
|
|
1663
|
-
|
|
1673
|
+
], b.prototype, "keepAspectRatio", 2);
|
|
1674
|
+
$([
|
|
1675
|
+
k()
|
|
1676
|
+
], b.prototype, "invalidWidth", 2);
|
|
1677
|
+
$([
|
|
1678
|
+
k()
|
|
1679
|
+
], b.prototype, "invalidHeight", 2);
|
|
1680
|
+
$([
|
|
1681
|
+
k()
|
|
1682
|
+
], b.prototype, "aspectRatio", 2);
|
|
1683
|
+
$([
|
|
1664
1684
|
P("cropMode", { waitUntilFirstUpdate: !0 }),
|
|
1665
1685
|
P("maxWidth", { waitUntilFirstUpdate: !0 }),
|
|
1666
1686
|
P("maxHeight", { waitUntilFirstUpdate: !0 }),
|
|
1667
1687
|
P("keepAspectRatio")
|
|
1668
|
-
],
|
|
1669
|
-
|
|
1688
|
+
], b.prototype, "handleCropModeChange", 1);
|
|
1689
|
+
$([
|
|
1670
1690
|
P("open", { waitUntilFirstUpdate: !0 })
|
|
1671
|
-
],
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
],
|
|
1675
|
-
const
|
|
1676
|
-
var
|
|
1677
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
1678
|
-
(n = t[
|
|
1679
|
-
return s && a &&
|
|
1691
|
+
], b.prototype, "handleOpenChange", 1);
|
|
1692
|
+
b = $([
|
|
1693
|
+
X("cx-asset-link-format-resize")
|
|
1694
|
+
], b);
|
|
1695
|
+
const Ve = V`cx-details::part(base){border-bottom-width:0}`;
|
|
1696
|
+
var Ge = Object.defineProperty, Qe = Object.getOwnPropertyDescriptor, K = (t, e, i, s) => {
|
|
1697
|
+
for (var a = s > 1 ? void 0 : s ? Qe(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
1698
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
1699
|
+
return s && a && Ge(e, i, a), a;
|
|
1680
1700
|
};
|
|
1681
|
-
let H = class extends
|
|
1701
|
+
let H = class extends j {
|
|
1682
1702
|
constructor() {
|
|
1683
|
-
super(...arguments), this.localize = new
|
|
1703
|
+
super(...arguments), this.localize = new G(this), this.open = !1, this.value = 0, this.defaultValue = 0, this.loading = !1, this.lastAppliedValue = 0;
|
|
1684
1704
|
}
|
|
1685
1705
|
handleOpenChange() {
|
|
1686
1706
|
this.open || this.emit("cx-asset-link-format-rotation-change", {
|
|
@@ -1691,14 +1711,14 @@ let H = class extends B {
|
|
|
1691
1711
|
const e = t.target.value, i = Number(e);
|
|
1692
1712
|
if (Number.isNaN(i))
|
|
1693
1713
|
return;
|
|
1694
|
-
const s =
|
|
1714
|
+
const s = Et(i);
|
|
1695
1715
|
(i > 360 || i < -360) && (t.target.value = s.toString()), this.emit("cx-asset-link-format-rotation-change", {
|
|
1696
1716
|
detail: s
|
|
1697
1717
|
});
|
|
1698
1718
|
}
|
|
1699
1719
|
handleButtonClick(t) {
|
|
1700
1720
|
this.emit("cx-asset-link-format-rotation-change", {
|
|
1701
|
-
detail:
|
|
1721
|
+
detail: Et(t)
|
|
1702
1722
|
});
|
|
1703
1723
|
}
|
|
1704
1724
|
handleClockwiseClick() {
|
|
@@ -1718,55 +1738,55 @@ let H = class extends B {
|
|
|
1718
1738
|
});
|
|
1719
1739
|
}
|
|
1720
1740
|
render() {
|
|
1721
|
-
return C`<cx-details class="details" ?open=${this.open}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="rotate_90_degrees_cw"></cx-icon></div><cx-typography variant="body2">Rotate</cx-typography></cx-space><cx-space spacing="small"><cx-button-group label=${this.localize.term("history")}><cx-icon-button data-testid="cx-asset-link-format-rotation-ccw" name="rotate_90_degrees_ccw" label=${this.localize.term("undo")} outline size="small" ?disabled=${this.loading || this.value === -360} @click=${this.handleCounterClockwiseClick}></cx-icon-button><cx-icon-button data-testid="cx-asset-link-format-rotation-cw" name="rotate_90_degrees_cw" label=${this.localize.term("redo")} outline size="small" ?disabled=${this.loading || this.value === 360} @click=${this.handleClockwiseClick}></cx-icon-button></cx-button-group><cx-input data-testid="cx-asset-link-format-rotation" value=${(this.value + this.defaultValue).toString()} placeholder="0" mask="num" .maskBlocks=${{ num: { mask: Number, max: 360, min: -360, signed: !0 } }} ?disabled=${this.loading} style=${
|
|
1741
|
+
return C`<cx-details class="details" ?open=${this.open}><cx-space slot="summary" align-items="center"><div part="icon"><cx-icon name="rotate_90_degrees_cw"></cx-icon></div><cx-typography variant="body2">Rotate</cx-typography></cx-space><cx-space spacing="small"><cx-button-group label=${this.localize.term("history")}><cx-icon-button data-testid="cx-asset-link-format-rotation-ccw" name="rotate_90_degrees_ccw" label=${this.localize.term("undo")} outline size="small" ?disabled=${this.loading || this.value === -360} @click=${this.handleCounterClockwiseClick}></cx-icon-button><cx-icon-button data-testid="cx-asset-link-format-rotation-cw" name="rotate_90_degrees_cw" label=${this.localize.term("redo")} outline size="small" ?disabled=${this.loading || this.value === 360} @click=${this.handleClockwiseClick}></cx-icon-button></cx-button-group><cx-input data-testid="cx-asset-link-format-rotation" value=${(this.value + this.defaultValue).toString()} placeholder="0" mask="num" .maskBlocks=${{ num: { mask: Number, max: 360, min: -360, signed: !0 } }} ?disabled=${this.loading} style=${O({
|
|
1722
1742
|
flex: "none",
|
|
1723
1743
|
width: "80px"
|
|
1724
1744
|
})} @cx-input=${this.handleRotationChange}></cx-input><cx-button data-testid="cx-asset-link-format-rotation-apply" variant="primary" ?disabled=${this.value === this.lastAppliedValue} ?loading=${this.loading} @click=${this.handleApply}>${this.localize.term("apply")}</cx-button></cx-space></cx-details>`;
|
|
1725
1745
|
}
|
|
1726
1746
|
};
|
|
1727
|
-
H.styles = [
|
|
1747
|
+
H.styles = [Q, Ve];
|
|
1728
1748
|
H.dependencies = {
|
|
1729
|
-
"cx-button":
|
|
1730
|
-
"cx-button-group":
|
|
1731
|
-
"cx-details":
|
|
1732
|
-
"cx-icon":
|
|
1733
|
-
"cx-icon-button":
|
|
1734
|
-
"cx-space":
|
|
1735
|
-
"cx-typography":
|
|
1749
|
+
"cx-button": J,
|
|
1750
|
+
"cx-button-group": ne,
|
|
1751
|
+
"cx-details": it,
|
|
1752
|
+
"cx-icon": st,
|
|
1753
|
+
"cx-icon-button": Pt,
|
|
1754
|
+
"cx-space": B,
|
|
1755
|
+
"cx-typography": q
|
|
1736
1756
|
};
|
|
1737
|
-
|
|
1738
|
-
|
|
1757
|
+
K([
|
|
1758
|
+
tt(".details")
|
|
1739
1759
|
], H.prototype, "base", 2);
|
|
1740
|
-
|
|
1760
|
+
K([
|
|
1741
1761
|
h({ reflect: !0, type: Boolean })
|
|
1742
1762
|
], H.prototype, "open", 2);
|
|
1743
|
-
|
|
1763
|
+
K([
|
|
1744
1764
|
h({ reflect: !0, type: Number })
|
|
1745
1765
|
], H.prototype, "value", 2);
|
|
1746
|
-
|
|
1766
|
+
K([
|
|
1747
1767
|
h({ attribute: "default-value", reflect: !0, type: Number })
|
|
1748
1768
|
], H.prototype, "defaultValue", 2);
|
|
1749
|
-
|
|
1769
|
+
K([
|
|
1750
1770
|
h({ reflect: !0, type: Boolean })
|
|
1751
1771
|
], H.prototype, "loading", 2);
|
|
1752
|
-
|
|
1772
|
+
K([
|
|
1753
1773
|
h({ attribute: "last-applied-value", reflect: !0, type: Number })
|
|
1754
1774
|
], H.prototype, "lastAppliedValue", 2);
|
|
1755
|
-
|
|
1775
|
+
K([
|
|
1756
1776
|
P("open", { waitUntilFirstUpdate: !0 })
|
|
1757
1777
|
], H.prototype, "handleOpenChange", 1);
|
|
1758
|
-
H =
|
|
1759
|
-
|
|
1778
|
+
H = K([
|
|
1779
|
+
X("cx-asset-link-format-rotation")
|
|
1760
1780
|
], H);
|
|
1761
|
-
const
|
|
1762
|
-
var
|
|
1763
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
1764
|
-
(n = t[
|
|
1765
|
-
return s && a &&
|
|
1781
|
+
const Xe = V`cx-details::part(base){border-bottom-width:0}`;
|
|
1782
|
+
var Ke = Object.defineProperty, Ze = Object.getOwnPropertyDescriptor, vt = (t, e, i, s) => {
|
|
1783
|
+
for (var a = s > 1 ? void 0 : s ? Ze(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
1784
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
1785
|
+
return s && a && Ke(e, i, a), a;
|
|
1766
1786
|
};
|
|
1767
|
-
let
|
|
1787
|
+
let U = class extends j {
|
|
1768
1788
|
constructor() {
|
|
1769
|
-
super(...arguments), this.localize = new
|
|
1789
|
+
super(...arguments), this.localize = new G(this), this.open = !1, this.value = !1;
|
|
1770
1790
|
}
|
|
1771
1791
|
handleApply(t) {
|
|
1772
1792
|
this.emit("cx-asset-link-format-metadata-change", {
|
|
@@ -1793,36 +1813,36 @@ let O = class extends B {
|
|
|
1793
1813
|
return C`<cx-details class="details" ?open=${this.open} @cx-show=${this.onShowDetails} @cx-hide=${this.onHideDetails}><cx-space slot="summary" align-items="center"><div class="details__summary__icon"><div part="icon"><cx-icon name="short_text"></cx-icon></div></div><cx-typography variant="body2">${this.localize.term("metadata")}</cx-typography></cx-space><cx-space spacing="small"><cx-tooltip data-testid="cx-asset-link-format-metadata-tooltip" content=${this.localize.term("metadataHelpText")} hoist><cx-checkbox data-testid="cx-asset-link-format-metadata" class="details__checkbox" ?checked=${this.value} @cx-change=${this.handleApply}>${this.localize.term("preserveMetadata")}</cx-checkbox></cx-tooltip></cx-space></cx-details>`;
|
|
1794
1814
|
}
|
|
1795
1815
|
};
|
|
1796
|
-
|
|
1797
|
-
|
|
1798
|
-
"cx-button":
|
|
1799
|
-
"cx-checkbox":
|
|
1800
|
-
"cx-details":
|
|
1801
|
-
"cx-icon":
|
|
1802
|
-
"cx-space":
|
|
1803
|
-
"cx-tooltip":
|
|
1804
|
-
"cx-typography":
|
|
1816
|
+
U.styles = [Q, Xe];
|
|
1817
|
+
U.dependencies = {
|
|
1818
|
+
"cx-button": J,
|
|
1819
|
+
"cx-checkbox": he,
|
|
1820
|
+
"cx-details": it,
|
|
1821
|
+
"cx-icon": st,
|
|
1822
|
+
"cx-space": B,
|
|
1823
|
+
"cx-tooltip": jt,
|
|
1824
|
+
"cx-typography": q
|
|
1805
1825
|
};
|
|
1806
|
-
|
|
1807
|
-
|
|
1808
|
-
],
|
|
1809
|
-
|
|
1826
|
+
vt([
|
|
1827
|
+
tt(".details")
|
|
1828
|
+
], U.prototype, "base", 2);
|
|
1829
|
+
vt([
|
|
1810
1830
|
h({ reflect: !0, type: Boolean })
|
|
1811
|
-
],
|
|
1812
|
-
|
|
1831
|
+
], U.prototype, "open", 2);
|
|
1832
|
+
vt([
|
|
1813
1833
|
h({ reflect: !0, type: Boolean })
|
|
1814
|
-
],
|
|
1815
|
-
|
|
1816
|
-
|
|
1817
|
-
],
|
|
1818
|
-
var
|
|
1819
|
-
for (var a = s > 1 ? void 0 : s ?
|
|
1820
|
-
(n = t[
|
|
1821
|
-
return s && a &&
|
|
1834
|
+
], U.prototype, "value", 2);
|
|
1835
|
+
U = vt([
|
|
1836
|
+
X("cx-asset-link-format-metadata")
|
|
1837
|
+
], U);
|
|
1838
|
+
var Ye = Object.defineProperty, Je = Object.getOwnPropertyDescriptor, g = (t, e, i, s) => {
|
|
1839
|
+
for (var a = s > 1 ? void 0 : s ? Je(e, i) : e, r = t.length - 1, n; r >= 0; r--)
|
|
1840
|
+
(n = t[r]) && (a = (s ? n(e, i, a) : n(a)) || a);
|
|
1841
|
+
return s && a && Ye(e, i, a), a;
|
|
1822
1842
|
};
|
|
1823
|
-
let u = class extends
|
|
1843
|
+
let u = class extends j {
|
|
1824
1844
|
constructor() {
|
|
1825
|
-
super(), this.localize = new
|
|
1845
|
+
super(), this.localize = new G(this), this.baseUrl = void 0, this.token = void 0, this.asset = void 0, this.cropModes = [
|
|
1826
1846
|
{
|
|
1827
1847
|
label: "Free",
|
|
1828
1848
|
value: "free"
|
|
@@ -1894,7 +1914,7 @@ let u = class extends B {
|
|
|
1894
1914
|
keepAspectRatio: !0,
|
|
1895
1915
|
ratioHeight: 1,
|
|
1896
1916
|
ratioWidth: 1,
|
|
1897
|
-
unit:
|
|
1917
|
+
unit: o.Pixel,
|
|
1898
1918
|
width: 1
|
|
1899
1919
|
}, this.cropSize = {
|
|
1900
1920
|
cropMode: "free",
|
|
@@ -1908,17 +1928,17 @@ let u = class extends B {
|
|
|
1908
1928
|
keepAspectRatio: !0,
|
|
1909
1929
|
percentageHeight: 0,
|
|
1910
1930
|
percentageWidth: 0,
|
|
1911
|
-
position:
|
|
1931
|
+
position: N.CenterCenter,
|
|
1912
1932
|
ratioHeight: 1,
|
|
1913
1933
|
ratioWidth: 1,
|
|
1914
|
-
unit:
|
|
1934
|
+
unit: o.Pixel,
|
|
1915
1935
|
width: 1,
|
|
1916
1936
|
x: 0,
|
|
1917
1937
|
y: 0
|
|
1918
1938
|
}, this.rotation = 0, this.defaultSize = {
|
|
1919
1939
|
height: 0,
|
|
1920
1940
|
width: 0
|
|
1921
|
-
}, this.cropperElement = null, this.parameters = [], this.loading = !1, this.lastAction = void 0, this.frozenIndex = void 0, this.preResetTransformations = void 0, this.preResetAutoFormat = void 0, this.preResetSelectedProxy = void 0, this.apiGetTransformAssetLink =
|
|
1941
|
+
}, this.cropperElement = null, this.parameters = [], this.loading = !1, this.lastAction = void 0, this.frozenIndex = void 0, this.preResetTransformations = void 0, this.preResetAutoFormat = void 0, this.preResetSelectedProxy = void 0, this.apiGetTransformAssetLink = ve, this.apiGetCropFocusMode = ke, this.onCropComplete = this.onCropComplete.bind(this), this.onCropDragStart = this.onCropDragStart.bind(this);
|
|
1922
1942
|
}
|
|
1923
1943
|
/**
|
|
1924
1944
|
* Transform requests must resolve to a web-displayable image (the browser renders the
|
|
@@ -1927,7 +1947,7 @@ let u = class extends B {
|
|
|
1927
1947
|
* extension fallback in asset-transformation-dialog.
|
|
1928
1948
|
*/
|
|
1929
1949
|
static getTransformExtension(t) {
|
|
1930
|
-
return !t ||
|
|
1950
|
+
return !t || Zt(t) ? t : "jpg";
|
|
1931
1951
|
}
|
|
1932
1952
|
/** True when there are transformations beyond the frozen index (i.e. user has added new ones). */
|
|
1933
1953
|
get hasUnfrozenTransformations() {
|
|
@@ -1941,7 +1961,7 @@ let u = class extends B {
|
|
|
1941
1961
|
get lastAppliedCropUnit() {
|
|
1942
1962
|
return this.transformations.findLast(
|
|
1943
1963
|
(e) => e.key === m.Crop
|
|
1944
|
-
)?.value.unit ??
|
|
1964
|
+
)?.value.unit ?? o.Pixel;
|
|
1945
1965
|
}
|
|
1946
1966
|
/**
|
|
1947
1967
|
* The focus mode of the last applied crop transformation, for the no-asset case only.
|
|
@@ -1961,7 +1981,7 @@ let u = class extends B {
|
|
|
1961
1981
|
get lastAppliedCropPosition() {
|
|
1962
1982
|
return this.transformations.findLast(
|
|
1963
1983
|
(e) => e.key === m.Crop
|
|
1964
|
-
)?.value.position ??
|
|
1984
|
+
)?.value.position ?? N.CenterCenter;
|
|
1965
1985
|
}
|
|
1966
1986
|
/**
|
|
1967
1987
|
* Checks if the crop apply button should be disabled.
|
|
@@ -1972,8 +1992,8 @@ let u = class extends B {
|
|
|
1972
1992
|
get disabledCropApply() {
|
|
1973
1993
|
if (!this.asset && this.cropSize.unit !== this.lastAppliedCropUnit)
|
|
1974
1994
|
return !1;
|
|
1975
|
-
if (this.cropSize.unit ===
|
|
1976
|
-
const e = this.lastCropSize[
|
|
1995
|
+
if (this.cropSize.unit === o.AspectRatio && !this.asset) {
|
|
1996
|
+
const e = this.lastCropSize[o.AspectRatio];
|
|
1977
1997
|
return this.cropSize.ratioWidth === e.width && this.cropSize.ratioHeight === e.height && this.cropSize.focusMode === this.lastAppliedCropFocusMode && this.cropSize.position === this.lastAppliedCropPosition;
|
|
1978
1998
|
}
|
|
1979
1999
|
if (!this.asset && this.cropSize.focusMode !== this.lastAppliedCropFocusMode || !this.asset && this.cropSize.position !== this.lastAppliedCropPosition)
|
|
@@ -1987,7 +2007,7 @@ let u = class extends B {
|
|
|
1987
2007
|
"y"
|
|
1988
2008
|
];
|
|
1989
2009
|
for (const e of t)
|
|
1990
|
-
if (this.cropSize[e] !== this.lastCropSize[
|
|
2010
|
+
if (this.cropSize[e] !== this.lastCropSize[o.Pixel][e])
|
|
1991
2011
|
return !1;
|
|
1992
2012
|
return !0;
|
|
1993
2013
|
}
|
|
@@ -2014,13 +2034,13 @@ let u = class extends B {
|
|
|
2014
2034
|
const e = this.transformations.findLast(
|
|
2015
2035
|
(i) => i.key === m.Crop
|
|
2016
2036
|
);
|
|
2017
|
-
if (e?.value.unit ===
|
|
2037
|
+
if (e?.value.unit === o.AspectRatio && e.value.ratioWidth && e.value.ratioHeight)
|
|
2018
2038
|
return {
|
|
2019
|
-
[
|
|
2039
|
+
[o.AspectRatio]: {
|
|
2020
2040
|
height: e.value.ratioHeight,
|
|
2021
2041
|
percentageHeight: 100,
|
|
2022
2042
|
percentageWidth: 100,
|
|
2023
|
-
unit:
|
|
2043
|
+
unit: o.AspectRatio,
|
|
2024
2044
|
width: e.value.ratioWidth,
|
|
2025
2045
|
x: 0,
|
|
2026
2046
|
y: 0
|
|
@@ -2031,56 +2051,56 @@ let u = class extends B {
|
|
|
2031
2051
|
* `min: 1`) instead of 0x0, so switching the unit selector back to Pixel and
|
|
2032
2052
|
* clicking Apply immediately still commits a meaningful crop instead of a no-op.
|
|
2033
2053
|
*/
|
|
2034
|
-
[
|
|
2054
|
+
[o.Pixel]: {
|
|
2035
2055
|
height: 1,
|
|
2036
2056
|
percentageHeight: 100,
|
|
2037
2057
|
percentageWidth: 100,
|
|
2038
|
-
unit:
|
|
2058
|
+
unit: o.Pixel,
|
|
2039
2059
|
width: 1,
|
|
2040
2060
|
x: 0,
|
|
2041
2061
|
y: 0
|
|
2042
2062
|
}
|
|
2043
2063
|
};
|
|
2044
2064
|
if (e?.value.width && e?.value.height) {
|
|
2045
|
-
const { height: i, width: s, x: a = 0, y:
|
|
2065
|
+
const { height: i, width: s, x: a = 0, y: r = 0 } = e.value, n = ct(s, i);
|
|
2046
2066
|
return {
|
|
2047
|
-
[
|
|
2067
|
+
[o.AspectRatio]: {
|
|
2048
2068
|
height: n.height,
|
|
2049
2069
|
percentageHeight: 100,
|
|
2050
2070
|
percentageWidth: 100,
|
|
2051
|
-
unit:
|
|
2071
|
+
unit: o.AspectRatio,
|
|
2052
2072
|
width: n.width,
|
|
2053
2073
|
x: 0,
|
|
2054
2074
|
y: 0
|
|
2055
2075
|
},
|
|
2056
|
-
[
|
|
2076
|
+
[o.Pixel]: {
|
|
2057
2077
|
height: i,
|
|
2058
2078
|
percentageHeight: 100,
|
|
2059
2079
|
percentageWidth: 100,
|
|
2060
|
-
unit:
|
|
2080
|
+
unit: o.Pixel,
|
|
2061
2081
|
width: s,
|
|
2062
2082
|
x: a,
|
|
2063
|
-
y:
|
|
2083
|
+
y: r
|
|
2064
2084
|
}
|
|
2065
2085
|
};
|
|
2066
2086
|
}
|
|
2067
2087
|
}
|
|
2068
|
-
const t = this.lastImageSize.width && this.lastImageSize.height ?
|
|
2088
|
+
const t = this.lastImageSize.width && this.lastImageSize.height ? ct(this.lastImageSize.width, this.lastImageSize.height) : { height: 1, width: 1 };
|
|
2069
2089
|
return {
|
|
2070
|
-
[
|
|
2090
|
+
[o.AspectRatio]: {
|
|
2071
2091
|
height: t.height,
|
|
2072
2092
|
percentageHeight: 100,
|
|
2073
2093
|
percentageWidth: 100,
|
|
2074
|
-
unit:
|
|
2094
|
+
unit: o.AspectRatio,
|
|
2075
2095
|
width: t.width,
|
|
2076
2096
|
x: 0,
|
|
2077
2097
|
y: 0
|
|
2078
2098
|
},
|
|
2079
|
-
[
|
|
2099
|
+
[o.Pixel]: {
|
|
2080
2100
|
height: this.lastImageSize.height,
|
|
2081
2101
|
percentageHeight: 100,
|
|
2082
2102
|
percentageWidth: 100,
|
|
2083
|
-
unit:
|
|
2103
|
+
unit: o.Pixel,
|
|
2084
2104
|
width: this.lastImageSize.width,
|
|
2085
2105
|
x: 0,
|
|
2086
2106
|
y: 0
|
|
@@ -2097,46 +2117,46 @@ let u = class extends B {
|
|
|
2097
2117
|
const e = this.transformations.findLast(
|
|
2098
2118
|
(i) => i.key === m.Resize
|
|
2099
2119
|
);
|
|
2100
|
-
if (e?.value.unit ===
|
|
2120
|
+
if (e?.value.unit === o.AspectRatio && e.value.ratioWidth && e.value.ratioHeight)
|
|
2101
2121
|
return {
|
|
2102
|
-
[
|
|
2122
|
+
[o.AspectRatio]: {
|
|
2103
2123
|
height: e.value.ratioHeight,
|
|
2104
|
-
unit:
|
|
2124
|
+
unit: o.AspectRatio,
|
|
2105
2125
|
width: e.value.ratioWidth
|
|
2106
2126
|
},
|
|
2107
2127
|
// See lastCropSize's equivalent branch for why this falls back to 1x1, not 0x0.
|
|
2108
|
-
[
|
|
2128
|
+
[o.Pixel]: {
|
|
2109
2129
|
height: 1,
|
|
2110
|
-
unit:
|
|
2130
|
+
unit: o.Pixel,
|
|
2111
2131
|
width: 1
|
|
2112
2132
|
}
|
|
2113
2133
|
};
|
|
2114
2134
|
if (e?.value.width && e?.value.height) {
|
|
2115
|
-
const { height: i, width: s } = e.value, a =
|
|
2135
|
+
const { height: i, width: s } = e.value, a = ct(s, i);
|
|
2116
2136
|
return {
|
|
2117
|
-
[
|
|
2137
|
+
[o.AspectRatio]: {
|
|
2118
2138
|
height: a.height,
|
|
2119
|
-
unit:
|
|
2139
|
+
unit: o.AspectRatio,
|
|
2120
2140
|
width: a.width
|
|
2121
2141
|
},
|
|
2122
|
-
[
|
|
2142
|
+
[o.Pixel]: {
|
|
2123
2143
|
height: i,
|
|
2124
|
-
unit:
|
|
2144
|
+
unit: o.Pixel,
|
|
2125
2145
|
width: s
|
|
2126
2146
|
}
|
|
2127
2147
|
};
|
|
2128
2148
|
}
|
|
2129
2149
|
}
|
|
2130
|
-
const t = this.lastImageSize.width && this.lastImageSize.height ?
|
|
2150
|
+
const t = this.lastImageSize.width && this.lastImageSize.height ? ct(this.lastImageSize.width, this.lastImageSize.height) : { height: 1, width: 1 };
|
|
2131
2151
|
return {
|
|
2132
|
-
[
|
|
2152
|
+
[o.AspectRatio]: {
|
|
2133
2153
|
height: t.height,
|
|
2134
|
-
unit:
|
|
2154
|
+
unit: o.AspectRatio,
|
|
2135
2155
|
width: t.width
|
|
2136
2156
|
},
|
|
2137
|
-
[
|
|
2157
|
+
[o.Pixel]: {
|
|
2138
2158
|
height: this.lastImageSize.height,
|
|
2139
|
-
unit:
|
|
2159
|
+
unit: o.Pixel,
|
|
2140
2160
|
width: this.lastImageSize.width
|
|
2141
2161
|
}
|
|
2142
2162
|
};
|
|
@@ -2158,7 +2178,7 @@ let u = class extends B {
|
|
|
2158
2178
|
* Returns the transformation string for the asset link.
|
|
2159
2179
|
*/
|
|
2160
2180
|
get transformationString() {
|
|
2161
|
-
return
|
|
2181
|
+
return lt({
|
|
2162
2182
|
asset: this.asset,
|
|
2163
2183
|
baseUrl: "",
|
|
2164
2184
|
parameters: this.parameters,
|
|
@@ -2217,7 +2237,7 @@ let u = class extends B {
|
|
|
2217
2237
|
*/
|
|
2218
2238
|
});
|
|
2219
2239
|
});
|
|
2220
|
-
const i =
|
|
2240
|
+
const i = lt({
|
|
2221
2241
|
asset: this.asset,
|
|
2222
2242
|
baseUrl: "",
|
|
2223
2243
|
extension: this.selectedFormat.extension,
|
|
@@ -2250,7 +2270,7 @@ let u = class extends B {
|
|
|
2250
2270
|
async handleTransformationsChange() {
|
|
2251
2271
|
if (await this.updateComplete, !this.asset) {
|
|
2252
2272
|
this.emit("cx-asset-link-format-change", {
|
|
2253
|
-
detail:
|
|
2273
|
+
detail: lt({
|
|
2254
2274
|
asset: this.asset,
|
|
2255
2275
|
baseUrl: "",
|
|
2256
2276
|
options: {
|
|
@@ -2261,36 +2281,36 @@ let u = class extends B {
|
|
|
2261
2281
|
useSession: this.useSession
|
|
2262
2282
|
}).replace(/\/t\//g, "")
|
|
2263
2283
|
});
|
|
2264
|
-
const
|
|
2265
|
-
(c) => c.key === m.Crop && (c.value.unit ===
|
|
2284
|
+
const r = this.transformations.findLast(
|
|
2285
|
+
(c) => c.key === m.Crop && (c.value.unit === o.AspectRatio && c.value.ratioWidth && c.value.ratioHeight || c.value.width && c.value.height)
|
|
2266
2286
|
);
|
|
2267
|
-
if (
|
|
2268
|
-
const { focusMode: c, position:
|
|
2287
|
+
if (r?.value.unit === o.AspectRatio && r.value.ratioWidth && r.value.ratioHeight) {
|
|
2288
|
+
const { focusMode: c, position: f, ratioHeight: y, ratioWidth: d } = r.value;
|
|
2269
2289
|
this.cropSize = {
|
|
2270
2290
|
...this.cropSize,
|
|
2271
2291
|
cropMode: "free",
|
|
2272
2292
|
focusMode: c ?? "manual",
|
|
2273
2293
|
percentageHeight: 100,
|
|
2274
2294
|
percentageWidth: 100,
|
|
2275
|
-
position:
|
|
2276
|
-
ratioHeight:
|
|
2277
|
-
ratioWidth:
|
|
2278
|
-
unit:
|
|
2295
|
+
position: f ?? N.CenterCenter,
|
|
2296
|
+
ratioHeight: y,
|
|
2297
|
+
ratioWidth: d,
|
|
2298
|
+
unit: o.AspectRatio
|
|
2279
2299
|
};
|
|
2280
|
-
} else if (
|
|
2281
|
-
const { focusMode: c, height:
|
|
2300
|
+
} else if (r) {
|
|
2301
|
+
const { focusMode: c, height: f, position: y, unit: d, width: S, x: R = 0, y: A = 0 } = r.value;
|
|
2282
2302
|
this.cropSize = {
|
|
2283
2303
|
...this.cropSize,
|
|
2284
2304
|
cropMode: "free",
|
|
2285
2305
|
focusMode: c ?? "manual",
|
|
2286
|
-
height:
|
|
2306
|
+
height: f,
|
|
2287
2307
|
percentageHeight: 100,
|
|
2288
2308
|
percentageWidth: 100,
|
|
2289
|
-
position:
|
|
2290
|
-
unit:
|
|
2291
|
-
width:
|
|
2292
|
-
x:
|
|
2293
|
-
y:
|
|
2309
|
+
position: y ?? N.CenterCenter,
|
|
2310
|
+
unit: d ?? o.Pixel,
|
|
2311
|
+
width: S,
|
|
2312
|
+
x: R,
|
|
2313
|
+
y: A
|
|
2294
2314
|
};
|
|
2295
2315
|
} else
|
|
2296
2316
|
this.cropSize = {
|
|
@@ -2306,30 +2326,30 @@ let u = class extends B {
|
|
|
2306
2326
|
height: 1,
|
|
2307
2327
|
percentageHeight: 0,
|
|
2308
2328
|
percentageWidth: 0,
|
|
2309
|
-
position:
|
|
2310
|
-
unit:
|
|
2329
|
+
position: N.CenterCenter,
|
|
2330
|
+
unit: o.Pixel,
|
|
2311
2331
|
width: 1,
|
|
2312
2332
|
x: 0,
|
|
2313
2333
|
y: 0
|
|
2314
2334
|
};
|
|
2315
2335
|
const n = this.transformations.findLast(
|
|
2316
|
-
(c) => c.key === m.Resize && (c.value.unit ===
|
|
2336
|
+
(c) => c.key === m.Resize && (c.value.unit === o.AspectRatio && c.value.ratioWidth && c.value.ratioHeight || c.value.width || c.value.height)
|
|
2317
2337
|
);
|
|
2318
|
-
if (n?.value.unit ===
|
|
2319
|
-
const { ratioHeight: c, ratioWidth:
|
|
2338
|
+
if (n?.value.unit === o.AspectRatio && n.value.ratioWidth && n.value.ratioHeight) {
|
|
2339
|
+
const { ratioHeight: c, ratioWidth: f } = n.value;
|
|
2320
2340
|
this.resizeSize = {
|
|
2321
2341
|
...this.resizeSize,
|
|
2322
2342
|
ratioHeight: c,
|
|
2323
|
-
ratioWidth:
|
|
2324
|
-
unit:
|
|
2343
|
+
ratioWidth: f,
|
|
2344
|
+
unit: o.AspectRatio
|
|
2325
2345
|
};
|
|
2326
2346
|
} else if (n) {
|
|
2327
|
-
const { height: c = 0, unit:
|
|
2347
|
+
const { height: c = 0, unit: f, width: y = 0 } = n.value;
|
|
2328
2348
|
this.resizeSize = {
|
|
2329
2349
|
...this.resizeSize,
|
|
2330
2350
|
height: c,
|
|
2331
|
-
unit:
|
|
2332
|
-
width:
|
|
2351
|
+
unit: f ?? o.Pixel,
|
|
2352
|
+
width: y
|
|
2333
2353
|
};
|
|
2334
2354
|
} else
|
|
2335
2355
|
this.resizeSize = {
|
|
@@ -2340,21 +2360,21 @@ let u = class extends B {
|
|
|
2340
2360
|
* Apply silently no-op.
|
|
2341
2361
|
*/
|
|
2342
2362
|
height: 1,
|
|
2343
|
-
unit:
|
|
2363
|
+
unit: o.Pixel,
|
|
2344
2364
|
width: 1
|
|
2345
2365
|
};
|
|
2346
2366
|
const l = this.transformations.findLast(
|
|
2347
2367
|
(c) => c.key === m.Rotate
|
|
2348
2368
|
);
|
|
2349
2369
|
this.rotation = l?.value.rotation ?? 0;
|
|
2350
|
-
const
|
|
2370
|
+
const p = this.transformations.findLast((c) => c.key === m.Quality)?.value.quality ?? 100, x = this.transformations.some(
|
|
2351
2371
|
(c) => c.key === m.Metadata
|
|
2352
2372
|
);
|
|
2353
|
-
this.selectedFormat ? this.selectedFormat = { ...this.selectedFormat, keepMetadata:
|
|
2373
|
+
this.selectedFormat ? this.selectedFormat = { ...this.selectedFormat, keepMetadata: x, quality: p } : this.selectedFormat = {
|
|
2354
2374
|
extension: "",
|
|
2355
2375
|
height: 0,
|
|
2356
|
-
keepMetadata:
|
|
2357
|
-
quality:
|
|
2376
|
+
keepMetadata: x,
|
|
2377
|
+
quality: p,
|
|
2358
2378
|
rotation: 0,
|
|
2359
2379
|
url: "",
|
|
2360
2380
|
width: 0,
|
|
@@ -2366,7 +2386,7 @@ let u = class extends B {
|
|
|
2366
2386
|
if (!this.selectedFormat)
|
|
2367
2387
|
return;
|
|
2368
2388
|
const t = this.proxies?.find(
|
|
2369
|
-
(
|
|
2389
|
+
(r) => r.id === this.selectedProxy
|
|
2370
2390
|
);
|
|
2371
2391
|
this.loading = !0;
|
|
2372
2392
|
const e = await this.apiGetTransformAssetLink({
|
|
@@ -2387,7 +2407,7 @@ let u = class extends B {
|
|
|
2387
2407
|
keepAspectRatio: !0,
|
|
2388
2408
|
ratioHeight: 1,
|
|
2389
2409
|
ratioWidth: 1,
|
|
2390
|
-
unit:
|
|
2410
|
+
unit: o.Pixel,
|
|
2391
2411
|
width: e.width
|
|
2392
2412
|
}, this.cropSize = {
|
|
2393
2413
|
cropMode: "free",
|
|
@@ -2396,18 +2416,18 @@ let u = class extends B {
|
|
|
2396
2416
|
keepAspectRatio: this.cropSize.keepAspectRatio,
|
|
2397
2417
|
percentageHeight: 100,
|
|
2398
2418
|
percentageWidth: 100,
|
|
2399
|
-
position:
|
|
2419
|
+
position: N.CenterCenter,
|
|
2400
2420
|
ratioHeight: 1,
|
|
2401
2421
|
ratioWidth: 1,
|
|
2402
|
-
unit:
|
|
2422
|
+
unit: o.Pixel,
|
|
2403
2423
|
width: e.width,
|
|
2404
2424
|
x: 0,
|
|
2405
2425
|
y: 0
|
|
2406
2426
|
}, this.lastAction === m.Rotate && (this.rotation = 0), this.lastAction = void 0;
|
|
2407
2427
|
const i = this.transformations.some(
|
|
2408
|
-
(
|
|
2428
|
+
(r) => r.key === m.Metadata
|
|
2409
2429
|
), s = this.transformations.findLast(
|
|
2410
|
-
(
|
|
2430
|
+
(r) => r.key === m.Quality
|
|
2411
2431
|
);
|
|
2412
2432
|
this.selectedFormat = {
|
|
2413
2433
|
...this.selectedFormat,
|
|
@@ -2421,7 +2441,7 @@ let u = class extends B {
|
|
|
2421
2441
|
* url: `${this.baseUrl}/${response.relativePath}`,
|
|
2422
2442
|
*/
|
|
2423
2443
|
};
|
|
2424
|
-
const a =
|
|
2444
|
+
const a = lt({
|
|
2425
2445
|
asset: this.asset,
|
|
2426
2446
|
baseUrl: "",
|
|
2427
2447
|
extension: this.selectedFormat.extension,
|
|
@@ -2476,10 +2496,10 @@ let u = class extends B {
|
|
|
2476
2496
|
keepAspectRatio: !0,
|
|
2477
2497
|
percentageHeight: 100,
|
|
2478
2498
|
percentageWidth: 100,
|
|
2479
|
-
position:
|
|
2499
|
+
position: N.CenterCenter,
|
|
2480
2500
|
ratioHeight: 1,
|
|
2481
2501
|
ratioWidth: 1,
|
|
2482
|
-
unit:
|
|
2502
|
+
unit: o.Pixel,
|
|
2483
2503
|
width: this.defaultSize.width,
|
|
2484
2504
|
x: 0,
|
|
2485
2505
|
y: 0
|
|
@@ -2509,25 +2529,25 @@ let u = class extends B {
|
|
|
2509
2529
|
const i = this.proxies?.find((s) => s.id === t);
|
|
2510
2530
|
i && (this.asset && i.proxyName === "TRX" && (i.formatHeight = Number(this.asset.height), i.formatWidth = Number(this.asset.width)), this.transformations = this.transformations.map((s) => {
|
|
2511
2531
|
if (s.key === m.Crop) {
|
|
2512
|
-
const a = s.value,
|
|
2532
|
+
const a = s.value, r = a.width / i.formatWidth * e.formatWidth, n = a.height / i.formatHeight * e.formatHeight, l = a.x / i.formatWidth * e.formatWidth, p = a.y / i.formatHeight * e.formatHeight;
|
|
2513
2533
|
return {
|
|
2514
2534
|
...s,
|
|
2515
2535
|
value: {
|
|
2516
2536
|
...s.value,
|
|
2517
2537
|
height: n,
|
|
2518
|
-
width:
|
|
2538
|
+
width: r,
|
|
2519
2539
|
x: l,
|
|
2520
|
-
y:
|
|
2540
|
+
y: p
|
|
2521
2541
|
}
|
|
2522
2542
|
};
|
|
2523
2543
|
}
|
|
2524
2544
|
if (s.key === m.Resize) {
|
|
2525
|
-
const a = s.value,
|
|
2545
|
+
const a = s.value, r = a.width / i.formatWidth * e.formatWidth, n = a.height / i.formatHeight * e.formatHeight;
|
|
2526
2546
|
return {
|
|
2527
2547
|
...s,
|
|
2528
2548
|
value: {
|
|
2529
2549
|
height: n,
|
|
2530
|
-
width:
|
|
2550
|
+
width: r
|
|
2531
2551
|
}
|
|
2532
2552
|
};
|
|
2533
2553
|
}
|
|
@@ -2542,24 +2562,24 @@ let u = class extends B {
|
|
|
2542
2562
|
}, await this.updateComplete, this.cropSize = {
|
|
2543
2563
|
cropMode: "free",
|
|
2544
2564
|
focusMode: "manual",
|
|
2545
|
-
height: this.lastCropSize[
|
|
2565
|
+
height: this.lastCropSize[o.Pixel].height,
|
|
2546
2566
|
keepAspectRatio: !0,
|
|
2547
2567
|
percentageHeight: 100,
|
|
2548
2568
|
percentageWidth: 100,
|
|
2549
|
-
position:
|
|
2569
|
+
position: N.CenterCenter,
|
|
2550
2570
|
ratioHeight: 1,
|
|
2551
2571
|
ratioWidth: 1,
|
|
2552
|
-
unit:
|
|
2553
|
-
width: this.lastCropSize[
|
|
2572
|
+
unit: o.Pixel,
|
|
2573
|
+
width: this.lastCropSize[o.Pixel].width,
|
|
2554
2574
|
x: 0,
|
|
2555
2575
|
y: 0
|
|
2556
2576
|
}, this.resizeSize = {
|
|
2557
|
-
height: this.lastResizeSize[
|
|
2577
|
+
height: this.lastResizeSize[o.Pixel].height,
|
|
2558
2578
|
keepAspectRatio: !0,
|
|
2559
2579
|
ratioHeight: 1,
|
|
2560
2580
|
ratioWidth: 1,
|
|
2561
|
-
unit:
|
|
2562
|
-
width: this.lastResizeSize[
|
|
2581
|
+
unit: o.Pixel,
|
|
2582
|
+
width: this.lastResizeSize[o.Pixel].width
|
|
2563
2583
|
};
|
|
2564
2584
|
}
|
|
2565
2585
|
handleLoadingChange() {
|
|
@@ -2579,12 +2599,12 @@ let u = class extends B {
|
|
|
2579
2599
|
}
|
|
2580
2600
|
handleActiveSettingChange() {
|
|
2581
2601
|
this.cropperElement && (this.resizeSize = {
|
|
2582
|
-
height: this.lastResizeSize[
|
|
2602
|
+
height: this.lastResizeSize[o.Pixel].height,
|
|
2583
2603
|
keepAspectRatio: !0,
|
|
2584
2604
|
ratioHeight: 1,
|
|
2585
2605
|
ratioWidth: 1,
|
|
2586
|
-
unit:
|
|
2587
|
-
width: this.lastResizeSize[
|
|
2606
|
+
unit: o.Pixel,
|
|
2607
|
+
width: this.lastResizeSize[o.Pixel].width
|
|
2588
2608
|
}, this.cropperElement.disabled = this.activeSetting !== "cx-asset-link-format-crop");
|
|
2589
2609
|
}
|
|
2590
2610
|
async handleRequestAutoCropSuggestion({
|
|
@@ -2593,33 +2613,33 @@ let u = class extends B {
|
|
|
2593
2613
|
height: i,
|
|
2594
2614
|
keepAspectRatio: s,
|
|
2595
2615
|
percentageHeight: a,
|
|
2596
|
-
percentageWidth:
|
|
2616
|
+
percentageWidth: r,
|
|
2597
2617
|
ratioHeight: n,
|
|
2598
2618
|
ratioWidth: l,
|
|
2599
|
-
unit:
|
|
2600
|
-
useCropMode:
|
|
2619
|
+
unit: p,
|
|
2620
|
+
useCropMode: x,
|
|
2601
2621
|
width: c
|
|
2602
2622
|
}) {
|
|
2603
2623
|
if (!this.selectedFormat?.url || e === "manual")
|
|
2604
2624
|
return;
|
|
2605
2625
|
this.loading = !0, this.lastAction = m.Crop;
|
|
2606
|
-
const
|
|
2626
|
+
const f = await this.apiGetCropFocusMode({
|
|
2607
2627
|
autoCropMode: e,
|
|
2608
2628
|
cropHeight: i,
|
|
2609
2629
|
cropWidth: c,
|
|
2610
2630
|
imageUrl: this.selectedFormat.url
|
|
2611
2631
|
});
|
|
2612
|
-
if (
|
|
2613
|
-
let
|
|
2614
|
-
i || (
|
|
2632
|
+
if (f) {
|
|
2633
|
+
let y = a, d = r;
|
|
2634
|
+
i || (y = f.height * 100 / this.selectedFormat.height), c || (d = f.width * 100 / this.selectedFormat.width), this.cropSize = {
|
|
2615
2635
|
...this.cropSize,
|
|
2616
|
-
height:
|
|
2617
|
-
percentageHeight:
|
|
2618
|
-
percentageWidth:
|
|
2619
|
-
width:
|
|
2620
|
-
x:
|
|
2621
|
-
y:
|
|
2622
|
-
...
|
|
2636
|
+
height: f.height,
|
|
2637
|
+
percentageHeight: y ?? this.cropSize.percentageHeight,
|
|
2638
|
+
percentageWidth: d ?? this.cropSize.percentageWidth,
|
|
2639
|
+
width: f.width,
|
|
2640
|
+
x: f.x * 100 / this.selectedFormat.width,
|
|
2641
|
+
y: f.y * 100 / this.selectedFormat.height,
|
|
2642
|
+
...x ? {
|
|
2623
2643
|
cropMode: e,
|
|
2624
2644
|
focusMode: "manual",
|
|
2625
2645
|
keepAspectRatio: !1
|
|
@@ -2630,7 +2650,7 @@ let u = class extends B {
|
|
|
2630
2650
|
keepAspectRatio: s ?? this.cropSize.keepAspectRatio,
|
|
2631
2651
|
ratioHeight: n ?? this.cropSize.ratioHeight,
|
|
2632
2652
|
ratioWidth: l ?? this.cropSize.ratioWidth,
|
|
2633
|
-
unit:
|
|
2653
|
+
unit: p ?? this.cropSize.unit
|
|
2634
2654
|
};
|
|
2635
2655
|
}
|
|
2636
2656
|
this.loading = !1, this.lastAction = void 0;
|
|
@@ -2640,32 +2660,32 @@ let u = class extends B {
|
|
|
2640
2660
|
height: i,
|
|
2641
2661
|
width: s,
|
|
2642
2662
|
x: a,
|
|
2643
|
-
y:
|
|
2663
|
+
y: r
|
|
2644
2664
|
} = e;
|
|
2645
2665
|
if (s === 0 || i === 0)
|
|
2646
2666
|
return;
|
|
2647
2667
|
const n = this.cropSize.percentageWidth !== s, l = this.cropSize.percentageHeight !== i;
|
|
2648
|
-
let
|
|
2649
|
-
n && (
|
|
2668
|
+
let p = this.cropSize.height, x = this.cropSize.width;
|
|
2669
|
+
n && (x = Math.round(s * this.selectedFormat.width / 100)), l && (p = Math.round(
|
|
2650
2670
|
i * this.selectedFormat.height / 100
|
|
2651
2671
|
));
|
|
2652
2672
|
const c = this.cropSize.focusMode;
|
|
2653
2673
|
this.focusModes.find(
|
|
2654
|
-
(
|
|
2674
|
+
(y) => y.value === c
|
|
2655
2675
|
)?.auto && this.selectedFormat?.url && this.cropperElement ? await this.handleRequestAutoCropSuggestion({
|
|
2656
2676
|
focusMode: c,
|
|
2657
|
-
height:
|
|
2677
|
+
height: p,
|
|
2658
2678
|
percentageHeight: i,
|
|
2659
2679
|
percentageWidth: s,
|
|
2660
|
-
width:
|
|
2680
|
+
width: x
|
|
2661
2681
|
}) : this.cropSize = {
|
|
2662
2682
|
...this.cropSize,
|
|
2663
|
-
height:
|
|
2683
|
+
height: p,
|
|
2664
2684
|
percentageHeight: i,
|
|
2665
2685
|
percentageWidth: s,
|
|
2666
|
-
width:
|
|
2686
|
+
width: x,
|
|
2667
2687
|
x: a,
|
|
2668
|
-
y:
|
|
2688
|
+
y: r
|
|
2669
2689
|
};
|
|
2670
2690
|
}
|
|
2671
2691
|
onCropDragStart() {
|
|
@@ -2694,7 +2714,7 @@ let u = class extends B {
|
|
|
2694
2714
|
* a proxy *id*, so the name has to be looked up in `proxies` rather than used directly.
|
|
2695
2715
|
*/
|
|
2696
2716
|
get autoResolvedProxyId() {
|
|
2697
|
-
const t =
|
|
2717
|
+
const t = Bt(this.asset?.extension, this.asset?.size);
|
|
2698
2718
|
return this.proxies?.find((e) => e.proxyName === t)?.id ?? "";
|
|
2699
2719
|
}
|
|
2700
2720
|
onProxyChange(t) {
|
|
@@ -2716,19 +2736,19 @@ let u = class extends B {
|
|
|
2716
2736
|
});
|
|
2717
2737
|
else {
|
|
2718
2738
|
const s = this.focusModes.find(
|
|
2719
|
-
(
|
|
2739
|
+
(p) => p.value === this.cropSize.focusMode
|
|
2720
2740
|
)?.auto;
|
|
2721
|
-
let a = this.cropSize.keepAspectRatio,
|
|
2722
|
-
e === "free" ? (a = !1,
|
|
2741
|
+
let a = this.cropSize.keepAspectRatio, r = this.cropSize.focusMode, n = this.cropSize.x, l = this.cropSize.y;
|
|
2742
|
+
e === "free" ? (a = !1, r = "manual") : this.cropSize.unit === o.Pixel && !s && (n = 0, l = 0), s ? await this.handleRequestAutoCropSuggestion({
|
|
2723
2743
|
cropMode: e,
|
|
2724
|
-
focusMode:
|
|
2744
|
+
focusMode: r,
|
|
2725
2745
|
height: this.cropSize.height,
|
|
2726
2746
|
keepAspectRatio: a,
|
|
2727
2747
|
width: this.cropSize.width
|
|
2728
2748
|
}) : this.cropSize = {
|
|
2729
2749
|
...this.cropSize,
|
|
2730
2750
|
cropMode: e,
|
|
2731
|
-
focusMode:
|
|
2751
|
+
focusMode: r,
|
|
2732
2752
|
keepAspectRatio: a,
|
|
2733
2753
|
x: n,
|
|
2734
2754
|
y: l
|
|
@@ -2754,52 +2774,52 @@ let u = class extends B {
|
|
|
2754
2774
|
}
|
|
2755
2775
|
async onCropChange(t) {
|
|
2756
2776
|
const e = this.cropSize.unit;
|
|
2757
|
-
if (t.detail.unit ===
|
|
2777
|
+
if (t.detail.unit === o.AspectRatio) {
|
|
2758
2778
|
const i = t.detail.width / t.detail.height, s = this.asset ? Math.min(
|
|
2759
2779
|
Math.max(Math.round(this.cropSize.height * i), 0),
|
|
2760
2780
|
this.resizeSize.width
|
|
2761
2781
|
) : 0, a = this.asset ? Math.min(
|
|
2762
2782
|
Math.max(Math.round(s / i), 0),
|
|
2763
2783
|
this.resizeSize.height
|
|
2764
|
-
) : 0,
|
|
2765
|
-
let l = this.cropSize.x,
|
|
2766
|
-
l + n > 100 && (l = 100 - n),
|
|
2767
|
-
let
|
|
2784
|
+
) : 0, r = this.asset ? a * 100 / this.selectedFormat.height : 100, n = this.asset ? s * 100 / this.selectedFormat.width : 100;
|
|
2785
|
+
let l = this.cropSize.x, p = this.cropSize.y;
|
|
2786
|
+
l + n > 100 && (l = 100 - n), p + r > 100 && (p = 100 - r);
|
|
2787
|
+
let x = this.cropSize.cropMode;
|
|
2768
2788
|
this.cropModes.find(
|
|
2769
|
-
(
|
|
2770
|
-
)?.auto && (
|
|
2789
|
+
(f) => f.value === x
|
|
2790
|
+
)?.auto && (x = "free"), t.detail.silent ? (this.cropSize.height = a, this.cropSize.keepAspectRatio = t.detail.keepAspectRatio, this.cropSize.percentageHeight = r, this.cropSize.percentageWidth = n, this.cropSize.ratioHeight = t.detail.height, this.cropSize.ratioWidth = t.detail.width, this.cropSize.unit = o.AspectRatio, this.cropSize.width = s) : this.cropSize = {
|
|
2771
2791
|
...this.cropSize,
|
|
2772
|
-
cropMode:
|
|
2792
|
+
cropMode: x,
|
|
2773
2793
|
height: a,
|
|
2774
2794
|
keepAspectRatio: t.detail.keepAspectRatio,
|
|
2775
|
-
percentageHeight:
|
|
2795
|
+
percentageHeight: r,
|
|
2776
2796
|
percentageWidth: n,
|
|
2777
2797
|
ratioHeight: t.detail.height,
|
|
2778
2798
|
ratioWidth: t.detail.width,
|
|
2779
|
-
unit:
|
|
2799
|
+
unit: o.AspectRatio,
|
|
2780
2800
|
width: s,
|
|
2781
2801
|
x: l,
|
|
2782
|
-
y:
|
|
2802
|
+
y: p
|
|
2783
2803
|
};
|
|
2784
2804
|
} else {
|
|
2785
2805
|
const i = this.asset ? t.detail.height * 100 / this.selectedFormat.height : 100, s = this.asset ? t.detail.width * 100 / this.selectedFormat.width : 100;
|
|
2786
|
-
let a = this.cropSize.x,
|
|
2787
|
-
a + s > 100 && (a = 100 - s),
|
|
2806
|
+
let a = this.cropSize.x, r = this.cropSize.y;
|
|
2807
|
+
a + s > 100 && (a = 100 - s), r + i > 100 && (r = 100 - i);
|
|
2788
2808
|
let n = this.cropSize.cropMode;
|
|
2789
2809
|
const l = this.cropModes.find(
|
|
2790
|
-
(
|
|
2810
|
+
(p) => p.value === n
|
|
2791
2811
|
)?.auto;
|
|
2792
|
-
(t.detail.breakAspectRatio || l) && (n = "free"), t.detail.silent ? (this.cropSize.cropMode = n, this.cropSize.height = t.detail.height, this.cropSize.keepAspectRatio = t.detail.keepAspectRatio, this.cropSize.percentageHeight = i, this.cropSize.percentageWidth = s, this.cropSize.unit =
|
|
2812
|
+
(t.detail.breakAspectRatio || l) && (n = "free"), t.detail.silent ? (this.cropSize.cropMode = n, this.cropSize.height = t.detail.height, this.cropSize.keepAspectRatio = t.detail.keepAspectRatio, this.cropSize.percentageHeight = i, this.cropSize.percentageWidth = s, this.cropSize.unit = o.Pixel, this.cropSize.width = t.detail.width, this.cropSize.x = a, this.cropSize.y = r) : this.cropSize = {
|
|
2793
2813
|
...this.cropSize,
|
|
2794
2814
|
cropMode: n,
|
|
2795
2815
|
height: t.detail.height,
|
|
2796
2816
|
keepAspectRatio: t.detail.keepAspectRatio,
|
|
2797
2817
|
percentageHeight: i,
|
|
2798
2818
|
percentageWidth: s,
|
|
2799
|
-
unit:
|
|
2819
|
+
unit: o.Pixel,
|
|
2800
2820
|
width: t.detail.width,
|
|
2801
2821
|
x: a,
|
|
2802
|
-
y:
|
|
2822
|
+
y: r
|
|
2803
2823
|
};
|
|
2804
2824
|
}
|
|
2805
2825
|
e !== this.cropSize.unit && (this.cropSize = {
|
|
@@ -2820,40 +2840,40 @@ let u = class extends B {
|
|
|
2820
2840
|
if (this.clearResetSnapshot(), this.lastAction = m.Crop, !this.asset) {
|
|
2821
2841
|
const {
|
|
2822
2842
|
focusMode: l,
|
|
2823
|
-
height:
|
|
2824
|
-
position:
|
|
2843
|
+
height: p,
|
|
2844
|
+
position: x,
|
|
2825
2845
|
ratioHeight: c,
|
|
2826
|
-
ratioWidth:
|
|
2827
|
-
unit:
|
|
2828
|
-
width:
|
|
2829
|
-
x:
|
|
2830
|
-
y:
|
|
2831
|
-
} = this.cropSize,
|
|
2846
|
+
ratioWidth: f,
|
|
2847
|
+
unit: y,
|
|
2848
|
+
width: d,
|
|
2849
|
+
x: S,
|
|
2850
|
+
y: R
|
|
2851
|
+
} = this.cropSize, A = this.focusModes.find(
|
|
2832
2852
|
(F) => F.value === l
|
|
2833
2853
|
)?.auto ?? !1;
|
|
2834
|
-
if (
|
|
2835
|
-
|
|
2854
|
+
if (y === o.AspectRatio) {
|
|
2855
|
+
f && c && this.upsertTransformation({
|
|
2836
2856
|
key: m.Crop,
|
|
2837
2857
|
value: {
|
|
2838
2858
|
focusMode: l,
|
|
2839
|
-
isFocusModeAuto:
|
|
2840
|
-
position:
|
|
2859
|
+
isFocusModeAuto: A,
|
|
2860
|
+
position: x,
|
|
2841
2861
|
ratioHeight: c,
|
|
2842
|
-
ratioWidth:
|
|
2843
|
-
unit:
|
|
2862
|
+
ratioWidth: f,
|
|
2863
|
+
unit: y
|
|
2844
2864
|
}
|
|
2845
2865
|
});
|
|
2846
2866
|
return;
|
|
2847
2867
|
}
|
|
2848
|
-
(
|
|
2868
|
+
(p || d) && this.upsertTransformation({
|
|
2849
2869
|
key: m.Crop,
|
|
2850
2870
|
value: {
|
|
2851
2871
|
focusMode: l,
|
|
2852
|
-
height:
|
|
2853
|
-
isFocusModeAuto:
|
|
2854
|
-
position:
|
|
2855
|
-
unit:
|
|
2856
|
-
width:
|
|
2872
|
+
height: p,
|
|
2873
|
+
isFocusModeAuto: A,
|
|
2874
|
+
position: x,
|
|
2875
|
+
unit: y,
|
|
2876
|
+
width: d,
|
|
2857
2877
|
/**
|
|
2858
2878
|
* Without an asset there is no cropper to drag, so x/y are always the 0
|
|
2859
2879
|
* placeholder from cropSize's default — never a real manual offset. Omit
|
|
@@ -2861,8 +2881,8 @@ let u = class extends B {
|
|
|
2861
2881
|
* string) so `hasManualXY` in buildTransformationString doesn't spuriously
|
|
2862
2882
|
* suppress the focus mode / position `c_g_` gravity value.
|
|
2863
2883
|
*/
|
|
2864
|
-
x: Number.isFinite(
|
|
2865
|
-
y: Number.isFinite(
|
|
2884
|
+
x: Number.isFinite(S) && S !== 0 ? S : void 0,
|
|
2885
|
+
y: Number.isFinite(R) && R !== 0 ? R : void 0
|
|
2866
2886
|
}
|
|
2867
2887
|
});
|
|
2868
2888
|
return;
|
|
@@ -2870,19 +2890,19 @@ let u = class extends B {
|
|
|
2870
2890
|
const { height: e, mode: i, unit: s, width: a } = t.detail;
|
|
2871
2891
|
if (!this.cropperElement || !this.selectedFormat)
|
|
2872
2892
|
return;
|
|
2873
|
-
const
|
|
2874
|
-
(l) => l.value ===
|
|
2893
|
+
const r = this.cropSize.focusMode, n = this.focusModes.find(
|
|
2894
|
+
(l) => l.value === r
|
|
2875
2895
|
)?.auto ?? !1;
|
|
2876
2896
|
if (e && a && s) {
|
|
2877
|
-
let l = a,
|
|
2878
|
-
if (s ===
|
|
2897
|
+
let l = a, p = e;
|
|
2898
|
+
if (s === o.AspectRatio && (l = this.cropSize.percentageWidth * this.selectedFormat.width / 100, p = this.cropSize.percentageHeight * this.selectedFormat.height / 100), i)
|
|
2879
2899
|
this.transformations = [
|
|
2880
2900
|
...this.transformations,
|
|
2881
2901
|
{
|
|
2882
2902
|
key: m.Crop,
|
|
2883
2903
|
value: {
|
|
2884
|
-
focusMode:
|
|
2885
|
-
height:
|
|
2904
|
+
focusMode: r,
|
|
2905
|
+
height: p,
|
|
2886
2906
|
isFocusModeAuto: n,
|
|
2887
2907
|
mode: i,
|
|
2888
2908
|
width: l
|
|
@@ -2890,18 +2910,18 @@ let u = class extends B {
|
|
|
2890
2910
|
}
|
|
2891
2911
|
];
|
|
2892
2912
|
else {
|
|
2893
|
-
const
|
|
2913
|
+
const x = this.cropSize.x / 100 * this.selectedFormat.width, c = this.cropSize.y / 100 * this.selectedFormat.height;
|
|
2894
2914
|
this.transformations = [
|
|
2895
2915
|
...this.transformations,
|
|
2896
2916
|
{
|
|
2897
2917
|
key: m.Crop,
|
|
2898
2918
|
value: {
|
|
2899
|
-
focusMode:
|
|
2900
|
-
height:
|
|
2919
|
+
focusMode: r,
|
|
2920
|
+
height: p,
|
|
2901
2921
|
isFocusModeAuto: n,
|
|
2902
2922
|
unit: s,
|
|
2903
2923
|
width: l,
|
|
2904
|
-
x
|
|
2924
|
+
x,
|
|
2905
2925
|
y: c
|
|
2906
2926
|
}
|
|
2907
2927
|
}
|
|
@@ -2912,7 +2932,7 @@ let u = class extends B {
|
|
|
2912
2932
|
{
|
|
2913
2933
|
key: m.Crop,
|
|
2914
2934
|
value: {
|
|
2915
|
-
focusMode:
|
|
2935
|
+
focusMode: r,
|
|
2916
2936
|
isFocusModeAuto: n,
|
|
2917
2937
|
mode: i
|
|
2918
2938
|
}
|
|
@@ -2920,9 +2940,9 @@ let u = class extends B {
|
|
|
2920
2940
|
]);
|
|
2921
2941
|
}
|
|
2922
2942
|
onResizeChange(t) {
|
|
2923
|
-
if (t.detail.unit ===
|
|
2943
|
+
if (t.detail.unit === o.AspectRatio) {
|
|
2924
2944
|
const e = t.detail.width / t.detail.height, i = Math.max(
|
|
2925
|
-
Math.round(this.lastResizeSize[
|
|
2945
|
+
Math.round(this.lastResizeSize[o.Pixel].height * e),
|
|
2926
2946
|
0
|
|
2927
2947
|
), s = Math.max(Math.round(i / e), 0);
|
|
2928
2948
|
this.resizeSize = {
|
|
@@ -2946,13 +2966,13 @@ let u = class extends B {
|
|
|
2946
2966
|
onResizeApply(t) {
|
|
2947
2967
|
const { height: e, unit: i, width: s } = t.detail;
|
|
2948
2968
|
if (this.clearResetSnapshot(), this.lastAction = m.Resize, !this.asset) {
|
|
2949
|
-
if (i ===
|
|
2950
|
-
const { ratioHeight:
|
|
2951
|
-
|
|
2969
|
+
if (i === o.AspectRatio) {
|
|
2970
|
+
const { ratioHeight: p, ratioWidth: x } = this.resizeSize;
|
|
2971
|
+
x && p && this.upsertTransformation({
|
|
2952
2972
|
key: m.Resize,
|
|
2953
2973
|
value: {
|
|
2954
|
-
ratioHeight:
|
|
2955
|
-
ratioWidth:
|
|
2974
|
+
ratioHeight: p,
|
|
2975
|
+
ratioWidth: x,
|
|
2956
2976
|
unit: i
|
|
2957
2977
|
}
|
|
2958
2978
|
});
|
|
@@ -2970,9 +2990,9 @@ let u = class extends B {
|
|
|
2970
2990
|
}
|
|
2971
2991
|
if (!this.selectedFormat)
|
|
2972
2992
|
return;
|
|
2973
|
-
const a = this.selectedFormat.width || this.defaultSize.width,
|
|
2993
|
+
const a = this.selectedFormat.width || this.defaultSize.width, r = this.selectedFormat.height || this.defaultSize.height;
|
|
2974
2994
|
let n = s, l = e;
|
|
2975
|
-
this.resizeSize.unit !== i ? (n = a, l =
|
|
2995
|
+
this.resizeSize.unit !== i ? (n = a, l = r) : i === o.AspectRatio && (n = Math.round(s / e * r), l = r), this.transformations = [
|
|
2976
2996
|
...this.transformations,
|
|
2977
2997
|
{
|
|
2978
2998
|
key: m.Resize,
|
|
@@ -3093,197 +3113,198 @@ let u = class extends B {
|
|
|
3093
3113
|
this.transformations = [], this.frozenIndex = -1, this.syncQuality();
|
|
3094
3114
|
}
|
|
3095
3115
|
render() {
|
|
3096
|
-
return C`<div class="asset-link-format" @cx-show=${this.onDetailsShow} @cx-hide=${this.onDetailsHide}>${
|
|
3116
|
+
return C`<div class="asset-link-format" @cx-show=${this.onDetailsShow} @cx-hide=${this.onDetailsHide}>${I(
|
|
3097
3117
|
!this.hideHeader,
|
|
3098
|
-
() => C`<cx-space class="asset-link-format__section-header" direction="horizontal" spacing="small" align-items="center" justify-content="space-between"><cx-typography variant="body3">${this.localize.term("transformations")}</cx-typography><cx-space direction="horizontal" spacing="3x-small" align-items="center"><cx-button class="asset-link-format__undo" variant="custom" ?disabled=${!this.hasUnfrozenTransformations && this.preResetTransformations === void 0} @click=${this.handleUndo}>${this.localize.term("undo")}</cx-button>${
|
|
3099
|
-
() =>
|
|
3118
|
+
() => C`<cx-space class="asset-link-format__section-header" direction="horizontal" spacing="small" align-items="center" justify-content="space-between"><cx-typography variant="body3">${this.localize.term("transformations")}</cx-typography><cx-space direction="horizontal" spacing="3x-small" align-items="center"><cx-button class="asset-link-format__undo" variant="custom" ?disabled=${!this.hasUnfrozenTransformations && this.preResetTransformations === void 0} @click=${this.handleUndo}>${this.localize.term("undo")}</cx-button>${I(this.canReset, () => C`<cx-button class="asset-link-format__reset" variant="custom" ?disabled=${!this.hasResettableState} @click=${this.handleReset}>${this.localize.term("reset")}</cx-button>`)}</cx-space></cx-space>`,
|
|
3119
|
+
() => Ut
|
|
3100
3120
|
)}
|
|
3101
|
-
${
|
|
3121
|
+
${I(
|
|
3102
3122
|
!this.noFormat,
|
|
3103
3123
|
() => C`<cx-asset-link-format-proxy class="asset-link-format__details" value=${this.selectedProxy || this.proxies?.[0]?.id || ""} ?open=${this.activeSetting === "cx-asset-link-format-proxy"} ?auto-format=${this.autoFormat} ?can-auto-format=${this.canAutoFormat} .items=${this.formats} ?loading=${this.loading && this.lastAction === m.Proxy} @cx-asset-link-format-proxy-change=${this.onProxyChange}></cx-asset-link-format-proxy>`
|
|
3104
3124
|
)}
|
|
3105
|
-
${
|
|
3125
|
+
${I(
|
|
3106
3126
|
!this.noCrop,
|
|
3107
|
-
() => C`<cx-asset-link-format-crop class="asset-link-format__details" ?open=${this.activeSetting === "cx-asset-link-format-crop"} ?disabled-apply=${this.disabledCropApply} ?loading=${this.loading && this.lastAction === m.Crop} ?keep-aspect-ratio=${this.cropSize.keepAspectRatio} ?show-position-picker=${!this.asset} focus-mode=${this.cropSize.focusMode} crop-mode=${this.cropSize.cropMode} width=${this.cropSize.width} height=${this.cropSize.height} max-width=${this.asset ? this.lastResizeSize[
|
|
3127
|
+
() => C`<cx-asset-link-format-crop class="asset-link-format__details" ?open=${this.activeSetting === "cx-asset-link-format-crop"} ?disabled-apply=${this.disabledCropApply} ?loading=${this.loading && this.lastAction === m.Crop} ?keep-aspect-ratio=${this.cropSize.keepAspectRatio} ?show-position-picker=${!this.asset} focus-mode=${this.cropSize.focusMode} crop-mode=${this.cropSize.cropMode} width=${this.cropSize.width} height=${this.cropSize.height} max-width=${this.asset ? this.lastResizeSize[o.Pixel].width : 1 / 0} max-height=${this.asset ? this.lastResizeSize[o.Pixel].height : 1 / 0} percentage-width=${this.cropSize.percentageWidth} percentage-height=${this.cropSize.percentageHeight} position=${this.cropSize.position} ratio-width=${this.cropSize.ratioWidth} ratio-height=${this.cropSize.ratioHeight} unit=${this.cropSize.unit} .lastAppliedSetting=${this.lastCropSize} .cropModes=${this.cropModes} .focusModes=${this.focusModes} @cx-asset-link-format-crop-mode-change=${this.onCropModeChange} @cx-asset-link-format-crop-focus-mode-change=${this.onCropFocusModeChange} @cx-asset-link-format-crop-position-change=${this.onCropPositionChange} @cx-asset-link-format-crop-change=${this.onCropChange} @cx-asset-link-format-crop-changed=${this.onCropChanged} @cx-asset-link-format-crop-apply=${this.onCropApply}></cx-asset-link-format-crop>`
|
|
3108
3128
|
)}
|
|
3109
|
-
${
|
|
3129
|
+
${I(
|
|
3110
3130
|
!this.noResize,
|
|
3111
3131
|
() => C`<cx-asset-link-format-resize class="asset-link-format__details" ?open=${this.activeSetting === "cx-asset-link-format-resize"} ?loading=${this.loading && this.lastAction === m.Resize} ?no-ratio-modes=${!this.asset} ?keep-aspect-ratio=${this.resizeSize.keepAspectRatio} width=${this.resizeSize.width} height=${this.resizeSize.height} max-width=${this.asset ? this.imageSize.width : 1 / 0} max-height=${this.asset ? this.imageSize.height : 1 / 0} ratio-width=${this.resizeSize.ratioWidth} ratio-height=${this.resizeSize.ratioHeight} unit=${this.resizeSize.unit} .lastAppliedSetting=${this.lastResizeSize} @cx-asset-link-format-resize-change=${this.onResizeChange} @cx-asset-link-format-resize-apply=${this.onResizeApply}></cx-asset-link-format-resize>`
|
|
3112
3132
|
)}
|
|
3113
|
-
${
|
|
3133
|
+
${I(
|
|
3114
3134
|
!this.noRotate,
|
|
3115
3135
|
() => C`<cx-asset-link-format-rotation class="asset-link-format__details" ?loading=${this.loading && this.lastAction === m.Rotate} ?open=${this.activeSetting === "cx-asset-link-format-rotation"} default-value=${this.selectedFormat?.rotation ?? 0} last-applied-value=${this.lastRotation} value=${this.rotation} @cx-asset-link-format-rotation-change=${this.onRotationChange} @cx-asset-link-format-rotation-apply=${this.onRotationApply}></cx-asset-link-format-rotation>`
|
|
3116
|
-
)}<cx-asset-link-format-quality class="asset-link-format__details" ?loading=${this.loading && this.lastAction === m.Quality} ?open=${this.activeSetting === "cx-asset-link-format-quality"} value=${this.selectedFormat?.quality ?? 100} @cx-asset-link-format-quality-change=${this.onQualityChange}></cx-asset-link-format-quality>${
|
|
3136
|
+
)}<cx-asset-link-format-quality class="asset-link-format__details" ?loading=${this.loading && this.lastAction === m.Quality} ?open=${this.activeSetting === "cx-asset-link-format-quality"} value=${this.selectedFormat?.quality ?? 100} @cx-asset-link-format-quality-change=${this.onQualityChange}></cx-asset-link-format-quality>${I(
|
|
3117
3137
|
!this.noMetadata,
|
|
3118
3138
|
() => C`<cx-asset-link-format-metadata class="asset-link-format__details" ?open=${this.activeSetting === "cx-asset-link-format-metadata"} .value=${this.selectedFormat?.keepMetadata ?? !1} @cx-asset-link-format-metadata-change=${this.onMetadataChange}></cx-asset-link-format-metadata>`
|
|
3119
3139
|
)}
|
|
3120
|
-
${
|
|
3140
|
+
${I(
|
|
3121
3141
|
this.useCustomExtension,
|
|
3122
3142
|
() => C`<cx-asset-link-format-extension .items=${this.extensions} value=${this.selectedFormat?.extension ?? ""} @cx-asset-link-format-extension-change=${this.onExtensionChange}></cx-asset-link-format-extension>`
|
|
3123
3143
|
)}</div>`;
|
|
3124
3144
|
}
|
|
3125
3145
|
};
|
|
3126
|
-
u.styles = [
|
|
3146
|
+
u.styles = [Q, Fe];
|
|
3127
3147
|
u.dependencies = {
|
|
3128
3148
|
"cx-asset-link-format-crop": v,
|
|
3129
|
-
"cx-asset-link-format-extension":
|
|
3130
|
-
"cx-asset-link-format-metadata":
|
|
3131
|
-
"cx-asset-link-format-proxy":
|
|
3132
|
-
"cx-asset-link-format-quality":
|
|
3133
|
-
"cx-asset-link-format-resize":
|
|
3149
|
+
"cx-asset-link-format-extension": Y,
|
|
3150
|
+
"cx-asset-link-format-metadata": U,
|
|
3151
|
+
"cx-asset-link-format-proxy": E,
|
|
3152
|
+
"cx-asset-link-format-quality": W,
|
|
3153
|
+
"cx-asset-link-format-resize": b,
|
|
3134
3154
|
"cx-asset-link-format-rotation": H,
|
|
3135
|
-
"cx-button":
|
|
3136
|
-
"cx-space":
|
|
3137
|
-
"cx-typography":
|
|
3155
|
+
"cx-button": J,
|
|
3156
|
+
"cx-space": B,
|
|
3157
|
+
"cx-typography": q
|
|
3138
3158
|
};
|
|
3139
|
-
|
|
3159
|
+
g([
|
|
3140
3160
|
h({ attribute: "base-url", type: String })
|
|
3141
3161
|
], u.prototype, "baseUrl", 2);
|
|
3142
|
-
|
|
3162
|
+
g([
|
|
3143
3163
|
h({ attribute: "token", type: String })
|
|
3144
3164
|
], u.prototype, "token", 2);
|
|
3145
|
-
|
|
3165
|
+
g([
|
|
3146
3166
|
h({ reflect: !1, type: Object })
|
|
3147
3167
|
], u.prototype, "asset", 2);
|
|
3148
|
-
|
|
3168
|
+
g([
|
|
3149
3169
|
h({ attribute: "crop-modes", reflect: !1, type: Array })
|
|
3150
3170
|
], u.prototype, "cropModes", 2);
|
|
3151
|
-
|
|
3171
|
+
g([
|
|
3152
3172
|
h({ attribute: "focus-modes", reflect: !1, type: Object })
|
|
3153
3173
|
], u.prototype, "focusModes", 2);
|
|
3154
|
-
|
|
3174
|
+
g([
|
|
3155
3175
|
h({ reflect: !1, type: Array })
|
|
3156
3176
|
], u.prototype, "extensions", 2);
|
|
3157
|
-
|
|
3177
|
+
g([
|
|
3158
3178
|
h({ reflect: !1, type: Array })
|
|
3159
3179
|
], u.prototype, "proxies", 2);
|
|
3160
|
-
|
|
3180
|
+
g([
|
|
3161
3181
|
h({ attribute: "for-cropper", reflect: !0, type: String })
|
|
3162
3182
|
], u.prototype, "forCropper", 2);
|
|
3163
|
-
|
|
3183
|
+
g([
|
|
3164
3184
|
h({ attribute: "use-session", reflect: !0, type: String })
|
|
3165
3185
|
], u.prototype, "useSession", 2);
|
|
3166
|
-
|
|
3186
|
+
g([
|
|
3167
3187
|
h({ reflect: !1, type: Array })
|
|
3168
3188
|
], u.prototype, "transformations", 2);
|
|
3169
|
-
|
|
3189
|
+
g([
|
|
3170
3190
|
h({ attribute: "selected-proxy", reflect: !0, type: String })
|
|
3171
3191
|
], u.prototype, "selectedProxy", 2);
|
|
3172
|
-
|
|
3192
|
+
g([
|
|
3173
3193
|
h({ attribute: "default-proxy", reflect: !0, type: String })
|
|
3174
3194
|
], u.prototype, "defaultProxy", 2);
|
|
3175
|
-
|
|
3195
|
+
g([
|
|
3176
3196
|
h({ attribute: "can-auto-format", reflect: !0, type: Boolean })
|
|
3177
3197
|
], u.prototype, "canAutoFormat", 2);
|
|
3178
|
-
|
|
3198
|
+
g([
|
|
3179
3199
|
h({ attribute: "auto-format", reflect: !0, type: Boolean })
|
|
3180
3200
|
], u.prototype, "autoFormat", 2);
|
|
3181
|
-
|
|
3201
|
+
g([
|
|
3182
3202
|
h({ attribute: "use-custom-extension", reflect: !0, type: Boolean })
|
|
3183
3203
|
], u.prototype, "useCustomExtension", 2);
|
|
3184
|
-
|
|
3204
|
+
g([
|
|
3185
3205
|
h({ attribute: "no-metadata", reflect: !0, type: Boolean })
|
|
3186
3206
|
], u.prototype, "noMetadata", 2);
|
|
3187
|
-
|
|
3207
|
+
g([
|
|
3188
3208
|
h({ attribute: "no-format", reflect: !0, type: Boolean })
|
|
3189
3209
|
], u.prototype, "noFormat", 2);
|
|
3190
|
-
|
|
3210
|
+
g([
|
|
3191
3211
|
h({ attribute: "no-crop", reflect: !0, type: Boolean })
|
|
3192
3212
|
], u.prototype, "noCrop", 2);
|
|
3193
|
-
|
|
3213
|
+
g([
|
|
3194
3214
|
h({ attribute: "no-resize", reflect: !0, type: Boolean })
|
|
3195
3215
|
], u.prototype, "noResize", 2);
|
|
3196
|
-
|
|
3216
|
+
g([
|
|
3197
3217
|
h({ attribute: "no-rotate", reflect: !0, type: Boolean })
|
|
3198
3218
|
], u.prototype, "noRotate", 2);
|
|
3199
|
-
|
|
3219
|
+
g([
|
|
3200
3220
|
h({ attribute: "last-image-size", reflect: !1, type: Object })
|
|
3201
3221
|
], u.prototype, "lastImageSize", 2);
|
|
3202
|
-
|
|
3222
|
+
g([
|
|
3203
3223
|
h({ attribute: "hide-header", reflect: !1, type: Boolean })
|
|
3204
3224
|
], u.prototype, "hideHeader", 2);
|
|
3205
|
-
|
|
3225
|
+
g([
|
|
3206
3226
|
h({ attribute: "can-reset", type: Boolean })
|
|
3207
3227
|
], u.prototype, "canReset", 2);
|
|
3208
|
-
|
|
3228
|
+
g([
|
|
3209
3229
|
h({ attribute: !1, reflect: !1, type: Object })
|
|
3210
3230
|
], u.prototype, "queryElement", 2);
|
|
3211
|
-
|
|
3212
|
-
|
|
3231
|
+
g([
|
|
3232
|
+
k()
|
|
3213
3233
|
], u.prototype, "activeSetting", 2);
|
|
3214
|
-
|
|
3215
|
-
|
|
3234
|
+
g([
|
|
3235
|
+
k()
|
|
3216
3236
|
], u.prototype, "selectedFormat", 2);
|
|
3217
|
-
|
|
3218
|
-
|
|
3237
|
+
g([
|
|
3238
|
+
k()
|
|
3219
3239
|
], u.prototype, "resizeSize", 2);
|
|
3220
|
-
|
|
3221
|
-
|
|
3240
|
+
g([
|
|
3241
|
+
k()
|
|
3222
3242
|
], u.prototype, "cropSize", 2);
|
|
3223
|
-
|
|
3224
|
-
|
|
3243
|
+
g([
|
|
3244
|
+
k()
|
|
3225
3245
|
], u.prototype, "rotation", 2);
|
|
3226
|
-
|
|
3227
|
-
|
|
3246
|
+
g([
|
|
3247
|
+
k()
|
|
3228
3248
|
], u.prototype, "defaultSize", 2);
|
|
3229
|
-
|
|
3230
|
-
|
|
3249
|
+
g([
|
|
3250
|
+
k()
|
|
3231
3251
|
], u.prototype, "cropperElement", 2);
|
|
3232
|
-
|
|
3233
|
-
|
|
3252
|
+
g([
|
|
3253
|
+
k()
|
|
3234
3254
|
], u.prototype, "parameters", 2);
|
|
3235
|
-
|
|
3236
|
-
|
|
3255
|
+
g([
|
|
3256
|
+
k()
|
|
3237
3257
|
], u.prototype, "loading", 2);
|
|
3238
|
-
|
|
3239
|
-
|
|
3258
|
+
g([
|
|
3259
|
+
k()
|
|
3240
3260
|
], u.prototype, "lastAction", 2);
|
|
3241
|
-
|
|
3242
|
-
|
|
3261
|
+
g([
|
|
3262
|
+
k()
|
|
3243
3263
|
], u.prototype, "frozenIndex", 2);
|
|
3244
|
-
|
|
3245
|
-
|
|
3264
|
+
g([
|
|
3265
|
+
k()
|
|
3246
3266
|
], u.prototype, "preResetTransformations", 2);
|
|
3247
|
-
|
|
3248
|
-
|
|
3267
|
+
g([
|
|
3268
|
+
k()
|
|
3249
3269
|
], u.prototype, "preResetAutoFormat", 2);
|
|
3250
|
-
|
|
3251
|
-
|
|
3270
|
+
g([
|
|
3271
|
+
k()
|
|
3252
3272
|
], u.prototype, "preResetSelectedProxy", 2);
|
|
3253
|
-
|
|
3273
|
+
g([
|
|
3254
3274
|
P("transformations")
|
|
3255
3275
|
], u.prototype, "handleTransformationsChange", 1);
|
|
3256
|
-
|
|
3276
|
+
g([
|
|
3257
3277
|
P("selectedProxy")
|
|
3258
3278
|
], u.prototype, "handleSelectedProxyChange", 1);
|
|
3259
|
-
|
|
3279
|
+
g([
|
|
3260
3280
|
P("loading")
|
|
3261
3281
|
], u.prototype, "handleLoadingChange", 1);
|
|
3262
|
-
u =
|
|
3263
|
-
|
|
3282
|
+
u = g([
|
|
3283
|
+
X("cx-asset-link-format")
|
|
3264
3284
|
], u);
|
|
3265
3285
|
export {
|
|
3266
3286
|
u as C,
|
|
3267
|
-
|
|
3268
|
-
|
|
3269
|
-
|
|
3270
|
-
|
|
3271
|
-
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
|
|
3275
|
-
|
|
3276
|
-
|
|
3277
|
-
|
|
3278
|
-
|
|
3279
|
-
|
|
3280
|
-
|
|
3281
|
-
|
|
3282
|
-
|
|
3283
|
-
|
|
3284
|
-
|
|
3285
|
-
|
|
3286
|
-
|
|
3287
|
-
|
|
3288
|
-
|
|
3287
|
+
nt as F,
|
|
3288
|
+
_t as M,
|
|
3289
|
+
we as a,
|
|
3290
|
+
fe as b,
|
|
3291
|
+
Gt as c,
|
|
3292
|
+
qi as d,
|
|
3293
|
+
ji as e,
|
|
3294
|
+
Bi as f,
|
|
3295
|
+
Xt as g,
|
|
3296
|
+
gt as h,
|
|
3297
|
+
Zt as i,
|
|
3298
|
+
dt as j,
|
|
3299
|
+
ut as k,
|
|
3300
|
+
Ht as l,
|
|
3301
|
+
mt as m,
|
|
3302
|
+
ft as n,
|
|
3303
|
+
Wt as o,
|
|
3304
|
+
Vi as p,
|
|
3305
|
+
Vt as q,
|
|
3306
|
+
Oi as r,
|
|
3307
|
+
Li as s,
|
|
3308
|
+
Ui as t,
|
|
3309
|
+
le as u
|
|
3289
3310
|
};
|