@orangelogic/design-system 2.115.0 → 2.116.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.D_xAgoOX.js +460 -0
- package/library/chunks/{color-swatch-group.DjjSIHSV.js → color-swatch-group.BvLicLI4.js} +1 -1
- package/library/chunks/{document-viewer.BIC9iYpZ.js → document-viewer.CKCX8ueu.js} +1118 -1106
- package/library/chunks/{endpoints.CDX5PgQz.js → endpoints.DBlquU2-.js} +251 -251
- package/library/chunks/{folder-select.8xNjeJfp.js → folder-select.Bc9x2hMO.js} +1 -1
- package/library/chunks/{list-editor.7zNWfBuW.js → list-editor.on8VVRn-.js} +161 -161
- package/library/chunks/{table.BvbReIZh.js → table.GCs54Y2t.js} +725 -628
- package/library/components/asset-link-format.js +1 -1
- package/library/components/atoms.js +2 -2
- package/library/components/audio.js +4 -4
- package/library/components/color-swatch-group.js +2 -2
- package/library/components/document-viewer.js +1 -1
- package/library/components/folder-select.js +2 -2
- package/library/components/list-editor.js +2 -2
- package/library/components/molecules.js +2 -2
- package/library/components/organisms.js +1 -1
- package/library/components/table.js +1 -1
- package/library/components/types.js +15838 -15884
- package/library/package.json +1 -1
- package/library/packages/atoms/src/components/table/table-data-loader.d.ts +1 -0
- package/library/packages/atoms/src/components/table/table.d.ts +1 -0
- package/library/packages/hybrid/book-reader/src/react/components/Controller/PageControl.d.ts +2 -1
- package/library/packages/hybrid/book-reader/src/react/hooks/useBreakpoint.d.ts +5 -1
- package/library/packages/organisms/src/asset-transformation-dialog/asset-transformation-dialog.d.ts +1 -1
- package/library/packages/organisms/src/content-builder/components/gallery-config/gallery-config.d.ts +0 -1
- package/library/packages/organisms/src/content-builder/components/page-picker/page-picker.d.ts +0 -1
- package/library/packages/services/src/api/asset/asset.d.ts +1 -3
- package/library/packages/services/src/api/endpoints.d.ts +0 -2
- package/library/packages/tools/src/fetch-asset/fetch-asset.d.ts +0 -6
- package/library/packages/tools/src/fetch-image/fetch-image.d.ts +4 -11
- package/package.json +1 -1
- package/library/chunks/asset.CtPQLZOf.js +0 -607
|
@@ -5,7 +5,7 @@ import oe from "../components/select.js";
|
|
|
5
5
|
import ce from "../components/tag.js";
|
|
6
6
|
import { C as g, a as ne } from "./tree.Btf2Q4YZ.js";
|
|
7
7
|
import { n as r, C as U } from "./lib-cortex-element.CVMmyPMC.js";
|
|
8
|
-
import { h as R, F as he, c as de } from "./endpoints.
|
|
8
|
+
import { h as R, F as he, c as de } from "./endpoints.DBlquU2-.js";
|
|
9
9
|
import { M as k } from "./asset-link-format.B0c92pSs.js";
|
|
10
10
|
import { c as j } from "./component.styles.CRO4Odto.js";
|
|
11
11
|
import { c as M } from "./custom-element.L4WJXn1j.js";
|
|
@@ -1,43 +1,43 @@
|
|
|
1
|
-
import { C as
|
|
2
|
-
import { C as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import { C as
|
|
6
|
-
import
|
|
7
|
-
import { C as
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
import { C as
|
|
13
|
-
import { C as
|
|
14
|
-
import { n as o, C as
|
|
15
|
-
import
|
|
16
|
-
import { c as
|
|
17
|
-
import { c as
|
|
18
|
-
import { d as
|
|
19
|
-
import { L as
|
|
1
|
+
import { C as S } from "./button.DwJEeW2t.js";
|
|
2
|
+
import { C as G, D as R } from "./dialog.BYCWepBc.js";
|
|
3
|
+
import j from "../components/grid.js";
|
|
4
|
+
import F from "../components/grid-item.js";
|
|
5
|
+
import { C as E } from "./input.CH4lKxPM.js";
|
|
6
|
+
import P from "../components/line-clamp.js";
|
|
7
|
+
import { C as B } from "./option.Bvh35v8S.js";
|
|
8
|
+
import K from "../components/radio.js";
|
|
9
|
+
import U from "../components/radio-group.js";
|
|
10
|
+
import H from "../components/select.js";
|
|
11
|
+
import T from "../components/space.js";
|
|
12
|
+
import { C as V, H as W } from "./table.GCs54Y2t.js";
|
|
13
|
+
import { C as L } from "./typography.DJC_UXgs.js";
|
|
14
|
+
import { n as o, C as D } from "./lib-cortex-element.CVMmyPMC.js";
|
|
15
|
+
import J from "../components/dynamic-select.js";
|
|
16
|
+
import { c as M } from "./component.styles.CRO4Odto.js";
|
|
17
|
+
import { c as z } from "./custom-element.L4WJXn1j.js";
|
|
18
|
+
import { d as X } from "./debounce.CIEhztrj.js";
|
|
19
|
+
import { L as O } from "./i18n.CH-wak_P.js";
|
|
20
20
|
import { w as v } from "./watch.CThbualB.js";
|
|
21
|
-
import { a as
|
|
22
|
-
import { i as
|
|
23
|
-
import { r as
|
|
21
|
+
import { a as Y } from "./_commonjsHelpers.DQNKXVTB.js";
|
|
22
|
+
import { i as q, x as l } from "./lit-element.jLBm65_O.js";
|
|
23
|
+
import { r as N } from "./state.CSDxrqLd.js";
|
|
24
24
|
import { e as y } from "./query.BBf1UFkC.js";
|
|
25
|
-
import { r as
|
|
26
|
-
import { e as
|
|
27
|
-
import { o as
|
|
25
|
+
import { r as Z } from "./choose.BTbF6BAn.js";
|
|
26
|
+
import { e as Q } from "./class-map.BiVq-cVR.js";
|
|
27
|
+
import { o as ee } from "./map.D8heArFD.js";
|
|
28
28
|
import { c as x } from "./repeat.DbF2p5ae.js";
|
|
29
|
-
import { n as
|
|
30
|
-
import { t as
|
|
31
|
-
import { C as
|
|
32
|
-
import { C as
|
|
33
|
-
import { a as
|
|
34
|
-
import { a as
|
|
29
|
+
import { n as b } from "./when.Dr1es41R.js";
|
|
30
|
+
import { t as ae } from "./toString.CAY8lys2.js";
|
|
31
|
+
import { C as te } from "./icon-button.CQiBjznj.js";
|
|
32
|
+
import { C as ie } from "./image.cT-FziNS.js";
|
|
33
|
+
import { a as ne, F as I, b as w } from "./asset.D_xAgoOX.js";
|
|
34
|
+
import { a as se } from "./index.Cpamj0jB.js";
|
|
35
35
|
import { A as g } from "./content-builder.OsUmm8Wu.js";
|
|
36
|
-
import { b as
|
|
37
|
-
import { t as
|
|
38
|
-
var C,
|
|
39
|
-
function
|
|
40
|
-
return
|
|
36
|
+
import { b as re, t as $ } from "./string.DUgD4c9f.js";
|
|
37
|
+
import { t as oe } from "./toast.D3AW3RWv.js";
|
|
38
|
+
var C, _;
|
|
39
|
+
function le() {
|
|
40
|
+
return _ || (_ = 1, C = {
|
|
41
41
|
aa: {
|
|
42
42
|
name: "Afar",
|
|
43
43
|
nativeName: "Afaraf"
|
|
@@ -772,19 +772,19 @@ function re() {
|
|
|
772
772
|
}
|
|
773
773
|
}), C;
|
|
774
774
|
}
|
|
775
|
-
var A,
|
|
776
|
-
function
|
|
777
|
-
if (
|
|
778
|
-
|
|
779
|
-
const e =
|
|
775
|
+
var A, k;
|
|
776
|
+
function me() {
|
|
777
|
+
if (k) return A;
|
|
778
|
+
k = 1;
|
|
779
|
+
const e = le(), a = {}, t = {}, i = [], s = [], p = [];
|
|
780
780
|
for (const d in e) {
|
|
781
781
|
const { name: m, nativeName: h } = e[d];
|
|
782
|
-
|
|
782
|
+
a[d] = t[m.toLowerCase()] = t[h.toLowerCase()] = { code: d, name: m, nativeName: h }, i.push(d), s.push(m), p.push(h);
|
|
783
783
|
}
|
|
784
784
|
return A = class f {
|
|
785
785
|
static getLanguages(m = []) {
|
|
786
786
|
return m.map(
|
|
787
|
-
(h) => f.validate(h) ? Object.assign({},
|
|
787
|
+
(h) => f.validate(h) ? Object.assign({}, a[h]) : { code: h, name: "", nativeName: "" }
|
|
788
788
|
);
|
|
789
789
|
}
|
|
790
790
|
static getName(m) {
|
|
@@ -800,7 +800,7 @@ function oe() {
|
|
|
800
800
|
return p.slice();
|
|
801
801
|
}
|
|
802
802
|
static getCode(m) {
|
|
803
|
-
return m = m.toLowerCase(),
|
|
803
|
+
return m = m.toLowerCase(), t.hasOwnProperty(m) ? t[m].code : "";
|
|
804
804
|
}
|
|
805
805
|
static getAllCodes() {
|
|
806
806
|
return i.slice();
|
|
@@ -810,22 +810,22 @@ function oe() {
|
|
|
810
810
|
}
|
|
811
811
|
}, A;
|
|
812
812
|
}
|
|
813
|
-
var
|
|
814
|
-
const
|
|
815
|
-
var
|
|
816
|
-
function
|
|
817
|
-
var
|
|
818
|
-
return
|
|
813
|
+
var ce = me();
|
|
814
|
+
const de = /* @__PURE__ */ Y(ce);
|
|
815
|
+
var pe = 0;
|
|
816
|
+
function ue(e) {
|
|
817
|
+
var a = ++pe;
|
|
818
|
+
return ae(e) + a;
|
|
819
819
|
}
|
|
820
|
-
const
|
|
821
|
-
var
|
|
822
|
-
for (var s = i > 1 ? void 0 : i ?
|
|
823
|
-
(d = e[p]) && (s = (i ? d(
|
|
824
|
-
return i && s &&
|
|
820
|
+
const he = q`:host{isolation:isolate}.asset-picker__input[data-user-invalid]~.asset-picker__trigger-wrapper .asset-picker__button::part(base){border-color:var(--cx-input-invalid-border-color)}.asset-picker__input[data-user-invalid]:focus-within~.asset-picker__trigger-wrapper .asset-picker__button::part(base){border-color:var(--cx-input-invalid-border-color);box-shadow:var(--cx-input-invalid-shadow)}.asset-picker__button-container{position:relative}.asset-picker__trigger-wrapper{z-index:1;position:relative}.asset-picker__image{--height:150px;--width:200px;--border-radius:var(--cx-border-radius-medium)}.asset-picker__input{opacity:0;width:100%;height:100%;position:absolute;top:0;left:0}`;
|
|
821
|
+
var ve = Object.defineProperty, ge = Object.getOwnPropertyDescriptor, u = (e, a, t, i) => {
|
|
822
|
+
for (var s = i > 1 ? void 0 : i ? ge(a, t) : a, p = e.length - 1, d; p >= 0; p--)
|
|
823
|
+
(d = e[p]) && (s = (i ? d(a, t, s) : d(s)) || s);
|
|
824
|
+
return i && s && ve(a, t, s), s;
|
|
825
825
|
};
|
|
826
|
-
let c = class extends
|
|
826
|
+
let c = class extends D {
|
|
827
827
|
constructor() {
|
|
828
|
-
super(...arguments), this.localize = new
|
|
828
|
+
super(...arguments), this.localize = new O(this), this.value = "", this.name = "", this.type = [g.Image], this.multiple = !1, this.accepts = [], this.required = !1, this.disabled = !1, this.onRequestAsset = void 0, this.recordId = "", this.previewSrc = "", this.apiGetAssets = ne;
|
|
829
829
|
}
|
|
830
830
|
async handleRequestAssetClick() {
|
|
831
831
|
if (this.onRequestAsset)
|
|
@@ -841,21 +841,21 @@ let c = class extends T {
|
|
|
841
841
|
this.accepts
|
|
842
842
|
);
|
|
843
843
|
if (this.accepts.length > 0 && Object.values(e).some(
|
|
844
|
-
(
|
|
844
|
+
(t) => !this.accepts.includes(re(t.src) ?? "")
|
|
845
845
|
))
|
|
846
|
-
|
|
846
|
+
oe(this.localize.term("nonAcceptedExtension", this.accepts), {
|
|
847
847
|
notificationType: "warning"
|
|
848
848
|
});
|
|
849
849
|
else if (this.multiple) {
|
|
850
|
-
const
|
|
850
|
+
const t = Object.values(e);
|
|
851
851
|
this.emit("cx-content-builder-asset-select", {
|
|
852
|
-
detail:
|
|
852
|
+
detail: t
|
|
853
853
|
});
|
|
854
854
|
} else {
|
|
855
|
-
const { extension:
|
|
855
|
+
const { extension: t, id: i, identifier: s, name: p, representative: d, src: m, type: h } = e;
|
|
856
856
|
this.emit("cx-content-builder-asset-select", {
|
|
857
857
|
detail: {
|
|
858
|
-
extension:
|
|
858
|
+
extension: t,
|
|
859
859
|
id: i,
|
|
860
860
|
identifier: s,
|
|
861
861
|
name: p,
|
|
@@ -885,12 +885,12 @@ let c = class extends T {
|
|
|
885
885
|
return;
|
|
886
886
|
}
|
|
887
887
|
try {
|
|
888
|
-
const
|
|
889
|
-
extraFields: ["path_TR1"],
|
|
888
|
+
const a = (await this.apiGetAssets({
|
|
889
|
+
extraFields: ["path_TR1", I, w],
|
|
890
890
|
getPermanentAssetsPaths: !0,
|
|
891
891
|
recordIds: [this.recordId]
|
|
892
892
|
})).items[0];
|
|
893
|
-
this.previewSrc =
|
|
893
|
+
this.previewSrc = a?.path_TR1 || a?.originalUrl || "", this.name = a?.[I] || a?.[w] || "";
|
|
894
894
|
} catch {
|
|
895
895
|
this.previewSrc = "";
|
|
896
896
|
}
|
|
@@ -904,13 +904,13 @@ let c = class extends T {
|
|
|
904
904
|
}
|
|
905
905
|
renderAssetPreview() {
|
|
906
906
|
if ((this.previewSrc || this.value) && this.acceptsType(g.Image))
|
|
907
|
-
return l`<cx-image part="image" class="asset-picker__image" src=${this.previewSrc || this.value} alt=${this.name} width="200px" object-fit=${
|
|
907
|
+
return l`<cx-image part="image" class="asset-picker__image" src=${this.previewSrc || this.value} alt=${this.name} width="200px" object-fit=${se.Cover}></cx-image>`;
|
|
908
908
|
if (this.name && this.acceptsType(g.Audio) || this.acceptsType(g.Video))
|
|
909
|
-
return l`<cx-typography variant="body-2">${
|
|
909
|
+
return l`<cx-typography variant="body-2">${$(this.name, 30, 11, 11)}</cx-typography>`;
|
|
910
910
|
if (this.name && (this.acceptsType(g.Other) || this.acceptsType(g.All))) {
|
|
911
911
|
const e = this.name.split(",");
|
|
912
|
-
return l`<cx-typography variant="body-2">${
|
|
913
|
-
${
|
|
912
|
+
return l`<cx-typography variant="body-2">${$(e[0], 30, 11, 11)}
|
|
913
|
+
${b(
|
|
914
914
|
e.length > 1,
|
|
915
915
|
() => l` ${this.localize.term("andOthers", e.length - 1)}`
|
|
916
916
|
)}</cx-typography>`;
|
|
@@ -919,9 +919,9 @@ let c = class extends T {
|
|
|
919
919
|
}
|
|
920
920
|
render() {
|
|
921
921
|
return l`<cx-space part="base" class="asset-picker" spacing="2x-small" direction="horizontal" align-items=${this.acceptsType(g.Image) ? "flex-start" : "center"}>${this.renderAssetPreview()}
|
|
922
|
-
${
|
|
922
|
+
${b(
|
|
923
923
|
!this.disabled,
|
|
924
|
-
() => l`<div part="button-container" class="asset-picker__button-container"><cx-input class="asset-picker__input" aria-label=${this.localize.term("choose")} name=${this.name} value=${this.value} ?required=${this.required} .form=${this.closest("form")}></cx-input><div class="asset-picker__trigger-wrapper"><slot name="trigger" @click=${this.handleRequestAssetClick}><cx-button part="button" class="asset-picker__button">${this.localize.term("choose")}</cx-button></slot></div></div>${
|
|
924
|
+
() => l`<div part="button-container" class="asset-picker__button-container"><cx-input class="asset-picker__input" aria-label=${this.localize.term("choose")} name=${this.name} value=${this.value} ?required=${this.required} .form=${this.closest("form")}></cx-input><div class="asset-picker__trigger-wrapper"><slot name="trigger" @click=${this.handleRequestAssetClick}><cx-button part="button" class="asset-picker__button">${this.localize.term("choose")}</cx-button></slot></div></div>${b(
|
|
925
925
|
this.value,
|
|
926
926
|
() => l`<cx-icon-button label=${this.localize.term("delete")} name="delete" @click=${this.handleDeleteClick}></cx-icon-button>`
|
|
927
927
|
)}
|
|
@@ -929,14 +929,14 @@ let c = class extends T {
|
|
|
929
929
|
)}</cx-space>`;
|
|
930
930
|
}
|
|
931
931
|
};
|
|
932
|
-
c.styles = [
|
|
932
|
+
c.styles = [M, he];
|
|
933
933
|
c.dependencies = {
|
|
934
|
-
"cx-button":
|
|
935
|
-
"cx-icon-button":
|
|
936
|
-
"cx-image":
|
|
937
|
-
"cx-input":
|
|
938
|
-
"cx-space":
|
|
939
|
-
"cx-typography":
|
|
934
|
+
"cx-button": S,
|
|
935
|
+
"cx-icon-button": te,
|
|
936
|
+
"cx-image": ie,
|
|
937
|
+
"cx-input": E,
|
|
938
|
+
"cx-space": T,
|
|
939
|
+
"cx-typography": L
|
|
940
940
|
};
|
|
941
941
|
u([
|
|
942
942
|
y(".asset-picker__button")
|
|
@@ -953,7 +953,7 @@ u([
|
|
|
953
953
|
u([
|
|
954
954
|
o({
|
|
955
955
|
converter: {
|
|
956
|
-
fromAttribute: (e) => (e ?? "").split(" ").filter((
|
|
956
|
+
fromAttribute: (e) => (e ?? "").split(" ").filter((a) => a !== ""),
|
|
957
957
|
toAttribute: (e) => e.join(" ")
|
|
958
958
|
},
|
|
959
959
|
reflect: !0
|
|
@@ -965,7 +965,7 @@ u([
|
|
|
965
965
|
u([
|
|
966
966
|
o({
|
|
967
967
|
converter: {
|
|
968
|
-
fromAttribute: (e) => (e ?? "").split(" ").filter((
|
|
968
|
+
fromAttribute: (e) => (e ?? "").split(" ").filter((a) => a !== ""),
|
|
969
969
|
toAttribute: (e) => e.join(" ")
|
|
970
970
|
},
|
|
971
971
|
reflect: !0
|
|
@@ -984,7 +984,7 @@ u([
|
|
|
984
984
|
o({ attribute: "record-id", reflect: !0, type: String })
|
|
985
985
|
], c.prototype, "recordId", 2);
|
|
986
986
|
u([
|
|
987
|
-
|
|
987
|
+
N()
|
|
988
988
|
], c.prototype, "previewSrc", 2);
|
|
989
989
|
u([
|
|
990
990
|
v("value")
|
|
@@ -993,20 +993,20 @@ u([
|
|
|
993
993
|
v("recordId")
|
|
994
994
|
], c.prototype, "handleRecordIdChange", 1);
|
|
995
995
|
c = u([
|
|
996
|
-
|
|
996
|
+
z("cx-asset-picker")
|
|
997
997
|
], c);
|
|
998
|
-
const
|
|
999
|
-
var
|
|
1000
|
-
for (var s = i > 1 ? void 0 : i ?
|
|
1001
|
-
(d = e[p]) && (s = (i ? d(
|
|
1002
|
-
return i && s &&
|
|
998
|
+
const be = q`:host{--overridden-min-height:var(--min-height,160px);--overridden-max-height:var(--max-height,260px);width:100%;display:block}.list-editor{width:100%}.list-editor__table{--cell-border-color:transparent;--cell-bottom-border-color:transparent;--header-font-size:var(--cx-font-size-small);--row-header-border-color:transparent;--cell-horizontal-padding:var(--cx-spacing-2x-small);--table-min-height:var(--overridden-min-height);--table-max-height:var(--overridden-max-height)}.list-editor__table--no-header{--cell-hover-background-color:transparent}.list-editor__item::part(expand-button){display:none}.list-editor__item__text{--line-height:1}.list-editor__item__text__description{color:var(--cx-color-neutral-600)}.list-editor__dialog{--body-spacing:0;--header-spacing:var(--cx-spacing-small) var(--cx-spacing-large) 0;--width:540px}.list-editor__tab-group{--padding:0;--tab-group-nav-padding:0 var(--cx-spacing-large)}`;
|
|
999
|
+
var Ne = Object.defineProperty, xe = Object.getOwnPropertyDescriptor, r = (e, a, t, i) => {
|
|
1000
|
+
for (var s = i > 1 ? void 0 : i ? xe(a, t) : a, p = e.length - 1, d; p >= 0; p--)
|
|
1001
|
+
(d = e[p]) && (s = (i ? d(a, t, s) : d(s)) || s);
|
|
1002
|
+
return i && s && Ne(a, t, s), s;
|
|
1003
1003
|
};
|
|
1004
|
-
const
|
|
1004
|
+
const fe = {
|
|
1005
1005
|
resizable: !1
|
|
1006
1006
|
};
|
|
1007
|
-
let n = class extends
|
|
1007
|
+
let n = class extends D {
|
|
1008
1008
|
constructor() {
|
|
1009
|
-
super(...arguments), this.localize = new
|
|
1009
|
+
super(...arguments), this.localize = new O(this), this.data = [], this.canAdd = !1, this.addDialogLabel = "", this.editDialogLabel = "", this.displayField = "", this.descriptionField = "", this.addItemText = "", this.sampleItem = {}, this.useEvents = !1, this.sortable = !1, this.loadingEvent = "", this.loadingItemIndex = void 0, this.columns = [], this.noHeader = !1, this.rowHeight = 40, this.defaultLanguage = "", this.supportedLanguages = ["en"], this.boundary = document.body, this.onRequestAsset = void 0, this.editedItem = null, this.isAdding = !1, this.columnsMap = {}, this.sortedEntries = [], this.translatableControls = [], this.disableCloseConfigDialog = !1, this.hoverMenu = {
|
|
1010
1010
|
data: [
|
|
1011
1011
|
{
|
|
1012
1012
|
icon: "create",
|
|
@@ -1033,7 +1033,7 @@ let n = class extends T {
|
|
|
1033
1033
|
}
|
|
1034
1034
|
],
|
|
1035
1035
|
options: {
|
|
1036
|
-
placement:
|
|
1036
|
+
placement: W.Right
|
|
1037
1037
|
}
|
|
1038
1038
|
}, this.OMITTED_FIELDS = ["id"];
|
|
1039
1039
|
}
|
|
@@ -1054,15 +1054,15 @@ let n = class extends T {
|
|
|
1054
1054
|
}
|
|
1055
1055
|
handleEditedItemChange() {
|
|
1056
1056
|
const e = {};
|
|
1057
|
-
for (const
|
|
1058
|
-
e[
|
|
1059
|
-
this.sortedEntries = Object.entries(this.editedItem || {}).filter(([
|
|
1057
|
+
for (const a of this.columns)
|
|
1058
|
+
e[a.field] = a.configOrder;
|
|
1059
|
+
this.sortedEntries = Object.entries(this.editedItem || {}).filter(([a]) => this.OMITTED_FIELDS.indexOf(a) === -1 && this.columnsMap[a]).sort(([a], [t]) => (e[a] ?? Number.MAX_SAFE_INTEGER) - (e[t] ?? Number.MAX_SAFE_INTEGER));
|
|
1060
1060
|
}
|
|
1061
1061
|
handleTableActions(e) {
|
|
1062
|
-
const { name:
|
|
1062
|
+
const { name: a, row: t } = e.detail, i = "component" in t ? t.component : t;
|
|
1063
1063
|
if (i) {
|
|
1064
1064
|
if (this.useEvents) {
|
|
1065
|
-
this.emit(`cx-list-editor-${
|
|
1065
|
+
this.emit(`cx-list-editor-${a}`, {
|
|
1066
1066
|
detail: {
|
|
1067
1067
|
index: i.getIndex(),
|
|
1068
1068
|
item: i.getData()
|
|
@@ -1070,7 +1070,7 @@ let n = class extends T {
|
|
|
1070
1070
|
});
|
|
1071
1071
|
return;
|
|
1072
1072
|
}
|
|
1073
|
-
|
|
1073
|
+
a === "edit" ? this.editedItem = i.getData() : a === "delete" && this.emit("cx-list-editor-change", {
|
|
1074
1074
|
detail: {
|
|
1075
1075
|
data: this.data.filter((s) => s.id !== i.getData().id)
|
|
1076
1076
|
}
|
|
@@ -1090,22 +1090,22 @@ let n = class extends T {
|
|
|
1090
1090
|
handleAddClick() {
|
|
1091
1091
|
this.isAdding = !0, this.editedItem = {
|
|
1092
1092
|
...this.sampleItem,
|
|
1093
|
-
id:
|
|
1093
|
+
id: ue(`${Date.now()}-`)
|
|
1094
1094
|
};
|
|
1095
1095
|
}
|
|
1096
1096
|
handleSaveClick() {
|
|
1097
1097
|
if (this.editedItem) {
|
|
1098
1098
|
const e = this.data.findIndex(
|
|
1099
|
-
(
|
|
1099
|
+
(t) => t.id === this.editedItem.id
|
|
1100
1100
|
);
|
|
1101
1101
|
if (!this.isAdding && e === -1) {
|
|
1102
1102
|
this.editedItem = null;
|
|
1103
1103
|
return;
|
|
1104
1104
|
}
|
|
1105
|
-
let
|
|
1106
|
-
this.isAdding ?
|
|
1105
|
+
let a = this.data;
|
|
1106
|
+
this.isAdding ? a = [...a, this.editedItem] : a = this.data.map((t) => t.id === this.editedItem.id ? this.editedItem : t), this.emit("cx-list-editor-change", {
|
|
1107
1107
|
detail: {
|
|
1108
|
-
data:
|
|
1108
|
+
data: a
|
|
1109
1109
|
}
|
|
1110
1110
|
}), this.editedItem = null, this.isAdding = !1;
|
|
1111
1111
|
}
|
|
@@ -1124,55 +1124,55 @@ let n = class extends T {
|
|
|
1124
1124
|
if (await this.updateComplete, !this.table)
|
|
1125
1125
|
return;
|
|
1126
1126
|
if (!this.loadingItemIndex) {
|
|
1127
|
-
this.table.tabulatorInstance?.getRows().forEach((
|
|
1128
|
-
const i =
|
|
1129
|
-
|
|
1127
|
+
this.table.tabulatorInstance?.getRows().forEach((t) => {
|
|
1128
|
+
const i = t._row.hoverMenuElement;
|
|
1129
|
+
t._row.hoverMenuElement.actions = i.actions.map((s) => (s.options?.buttonProps && (s.options.buttonProps.loading = !1), s));
|
|
1130
1130
|
});
|
|
1131
1131
|
return;
|
|
1132
1132
|
}
|
|
1133
1133
|
const e = this.table.tabulatorInstance?.getRow(this.loadingItemIndex);
|
|
1134
1134
|
if (!e || !e?._row?.hoverMenuElement)
|
|
1135
1135
|
return;
|
|
1136
|
-
const
|
|
1137
|
-
|
|
1136
|
+
const a = e._row.hoverMenuElement;
|
|
1137
|
+
a.actions = a.actions.map((t) => (t.options?.buttonProps && (t.options.buttonProps.loading = t.name === this.loadingEvent && this.loadingItemIndex === e.getIndex()), t));
|
|
1138
1138
|
}
|
|
1139
1139
|
handleChange(e) {
|
|
1140
1140
|
if (!e.target)
|
|
1141
1141
|
return;
|
|
1142
|
-
const
|
|
1143
|
-
if (!
|
|
1142
|
+
const a = e.target, t = a.dataset.id;
|
|
1143
|
+
if (!t)
|
|
1144
1144
|
return;
|
|
1145
|
-
let i =
|
|
1145
|
+
let i = a.value;
|
|
1146
1146
|
Array.isArray(i) ? i = i.join(" ") : i = String(i), this.editedItem = {
|
|
1147
1147
|
...this.editedItem,
|
|
1148
|
-
[
|
|
1148
|
+
[t]: i
|
|
1149
1149
|
};
|
|
1150
1150
|
}
|
|
1151
1151
|
renderControls(e) {
|
|
1152
1152
|
if (e === "translation") {
|
|
1153
|
-
const
|
|
1153
|
+
const a = l`
|
|
1154
1154
|
${x(
|
|
1155
1155
|
this.translatableControls,
|
|
1156
|
-
(
|
|
1157
|
-
(
|
|
1158
|
-
const s = this.localize.languageName(i) ||
|
|
1156
|
+
(t) => t.field,
|
|
1157
|
+
(t) => l`<cx-grid columns="4" spacing="var(--cx-spacing-small)" column-spacing="0" use-flex-gap row-spacing="0" wrap="wrap"><cx-grid-item xs="4" sm="1"><cx-typography variant="body2">${t.title}</cx-typography></cx-grid-item><cx-grid-item xs="4" sm="3"><cx-space direction="vertical" spacing="x-small" wrap="nowrap">${ee(this.supportedLanguages, (i) => {
|
|
1158
|
+
const s = this.localize.languageName(i) || de.getName(i) || i, p = (d) => {
|
|
1159
1159
|
const m = d.target.value;
|
|
1160
1160
|
this.editedItem = {
|
|
1161
1161
|
...this.editedItem,
|
|
1162
|
-
[`${
|
|
1162
|
+
[`${t.field}-${i}`]: m
|
|
1163
1163
|
};
|
|
1164
1164
|
};
|
|
1165
|
-
return l`<cx-input ?disabled=${i.toLowerCase() === this.defaultLanguage?.toLowerCase()} label=${s} value=${this.editedItem?.[`${
|
|
1165
|
+
return l`<cx-input ?disabled=${i.toLowerCase() === this.defaultLanguage?.toLowerCase()} label=${s} value=${this.editedItem?.[`${t.field}-${i}`] ?? this.editedItem?.[`${t.field}`] ?? ""} @cx-change=${p}></cx-input>`;
|
|
1166
1166
|
})}</cx-space></cx-grid-item></cx-grid>`
|
|
1167
1167
|
)}
|
|
1168
1168
|
`;
|
|
1169
|
-
return l`<cx-space direction="vertical" wrap="nowrap">${
|
|
1169
|
+
return l`<cx-space direction="vertical" wrap="nowrap">${a}</cx-space>`;
|
|
1170
1170
|
}
|
|
1171
1171
|
return l`<cx-grid columns="3" spacing="var(--cx-spacing-small)" wrap="wrap">${x(
|
|
1172
1172
|
this.sortedEntries,
|
|
1173
|
-
([
|
|
1174
|
-
([
|
|
1175
|
-
this.columnsMap[
|
|
1173
|
+
([a]) => a,
|
|
1174
|
+
([a, t]) => l`<cx-grid-item xs="3" sm="1"><cx-typography variant="body2">${this.columnsMap[a].title}</cx-typography></cx-grid-item><cx-grid-item xs="3" sm="2">${Z(
|
|
1175
|
+
this.columnsMap[a].controlType,
|
|
1176
1176
|
[
|
|
1177
1177
|
[
|
|
1178
1178
|
"image-picker",
|
|
@@ -1183,48 +1183,48 @@ let n = class extends T {
|
|
|
1183
1183
|
const { id: d, src: m } = p.detail;
|
|
1184
1184
|
this.editedItem = {
|
|
1185
1185
|
...this.editedItem,
|
|
1186
|
-
[
|
|
1186
|
+
[a]: m,
|
|
1187
1187
|
recordId: d
|
|
1188
1188
|
};
|
|
1189
1189
|
}, s = async () => {
|
|
1190
1190
|
this.editedItem = {
|
|
1191
1191
|
...this.editedItem,
|
|
1192
|
-
[
|
|
1192
|
+
[a]: "",
|
|
1193
1193
|
recordId: ""
|
|
1194
1194
|
};
|
|
1195
1195
|
};
|
|
1196
|
-
return l`<cx-asset-picker value=${
|
|
1196
|
+
return l`<cx-asset-picker value=${t} record-id=${this.editedItem.recordId || ""} type="image" id=${a} @cx-content-builder-asset-select=${i} @cx-content-builder-asset-delete=${s} @cx-asset-request-status=${this.handleAssetRequestStatus} .onRequestAsset=${this.onRequestAsset}></cx-asset-picker>`;
|
|
1197
1197
|
}
|
|
1198
1198
|
],
|
|
1199
1199
|
[
|
|
1200
1200
|
"radio-group",
|
|
1201
|
-
() => l`<cx-radio-group data-id=${
|
|
1202
|
-
this.columnsMap[
|
|
1201
|
+
() => l`<cx-radio-group data-id=${a} data-testid="radio-group-control" horizontal value=${(t || this.columnsMap[a].defaultValue) ?? ""} size="medium" @cx-change=${this.handleChange}>${x(
|
|
1202
|
+
this.columnsMap[a].options ?? [],
|
|
1203
1203
|
(i) => i.value,
|
|
1204
1204
|
(i) => l`<cx-radio value=${i.value}>${i.name}</cx-radio>`
|
|
1205
1205
|
)}</cx-radio-group>`
|
|
1206
1206
|
],
|
|
1207
1207
|
[
|
|
1208
1208
|
"select",
|
|
1209
|
-
() => this.columnsMap[
|
|
1210
|
-
this.columnsMap[
|
|
1209
|
+
() => this.columnsMap[a].api ? l`<cx-dynamic-select data-id=${a} hoist value=${t} @cx-change=${this.handleChange} .api=${this.columnsMap[a].api}></cx-dynamic-select>` : l`<cx-select data-id=${a} hoist value=${t} @cx-change=${this.handleChange}>${x(
|
|
1210
|
+
this.columnsMap[a].options ?? [],
|
|
1211
1211
|
(i) => i.value,
|
|
1212
1212
|
(i) => l`<cx-option value=${i.value}>${i.name}</cx-option>`
|
|
1213
1213
|
)}</cx-select>`
|
|
1214
1214
|
]
|
|
1215
1215
|
],
|
|
1216
|
-
() => l`<cx-input data-id=${
|
|
1216
|
+
() => l`<cx-input data-id=${a} value=${t} @cx-change=${this.handleChange}></cx-input>`
|
|
1217
1217
|
)}</cx-grid-item>`
|
|
1218
1218
|
)}</cx-grid>`;
|
|
1219
1219
|
}
|
|
1220
1220
|
render() {
|
|
1221
|
-
return l`<cx-space direction="vertical" align-items="flex-start"><div class="list-editor"><cx-table part="table" class=${
|
|
1221
|
+
return l`<cx-space direction="vertical" align-items="flex-start"><div class="list-editor"><cx-table part="table" class=${Q({
|
|
1222
1222
|
"list-editor__table": !0,
|
|
1223
1223
|
"list-editor__table--no-header": this.noHeader
|
|
1224
|
-
})} ?movable-rows=${this.sortable} ?no-header=${this.noHeader} layout="fitColumns" row-height=${this.rowHeight} .columns=${this.columns} .columnDefaults=${
|
|
1224
|
+
})} ?movable-rows=${this.sortable} ?no-header=${this.noHeader} layout="fitColumns" row-height=${this.rowHeight} .columns=${this.columns} .columnDefaults=${fe} .hoverMenu=${this.hoverMenu} .data=${this.data ?? []} no-selectable @cx-table.rowMoved=${this.handleTableRowMoved} @cx-table-row-action-click=${this.handleTableActions}></cx-table><cx-dialog part="dialog" class="list-editor__dialog" divider-position=${R.Footer} use-overlay-scrollbar strategy="fixed" ?open=${!!this.editedItem} .boundary=${this.boundary} @cx-request-close=${this.handleRequestClose}><cx-space slot="label" direction="vertical" spacing="2x-small"><cx-typography variant="h4">${this.isAdding ? this.addDialogLabel : this.editDialogLabel}</cx-typography>${b(
|
|
1225
1225
|
!this.isAdding && this.editedItem?.[this.displayField],
|
|
1226
1226
|
() => l`<cx-typography variant="body3"><cx-line-clamp lines="1">${this.editedItem?.[this.displayField]}</cx-line-clamp></cx-typography>`
|
|
1227
|
-
)}</cx-space>${
|
|
1227
|
+
)}</cx-space>${b(
|
|
1228
1228
|
this.tabs.length >= 1,
|
|
1229
1229
|
() => l`<cx-tab-group class="list-editor__tab-group" placement="top">${x(
|
|
1230
1230
|
this.tabs,
|
|
@@ -1232,29 +1232,29 @@ let n = class extends T {
|
|
|
1232
1232
|
(e) => l`<cx-tab slot="nav" panel=${e}>${this.localize.term(e)}</cx-tab><cx-tab-panel name=${e}><cx-space direction="vertical" spacing="x-small" wrap="nowrap">${this.renderControls(e)}</cx-space></cx-tab-panel>`
|
|
1233
1233
|
)}</cx-tab-group>`,
|
|
1234
1234
|
() => l`<cx-space direction="vertical" spacing="x-small" wrap="nowrap">${this.renderControls(this.tabs[0])}</cx-space>`
|
|
1235
|
-
)}<cx-space slot="footer" spacing="x-small" wrap="nowrap" justify-content="end"><cx-button data-testid="cancel-button" variant="default" size="medium" @click=${this.handleCancelClick}>${this.localize.term("cancel")}</cx-button><cx-button data-testid="save-button" variant="primary" size="medium" @click=${this.handleSaveClick}>${this.localize.term("save")}</cx-button></cx-space></cx-dialog></div>${
|
|
1235
|
+
)}<cx-space slot="footer" spacing="x-small" wrap="nowrap" justify-content="end"><cx-button data-testid="cancel-button" variant="default" size="medium" @click=${this.handleCancelClick}>${this.localize.term("cancel")}</cx-button><cx-button data-testid="save-button" variant="primary" size="medium" @click=${this.handleSaveClick}>${this.localize.term("save")}</cx-button></cx-space></cx-dialog></div>${b(
|
|
1236
1236
|
this.canAdd,
|
|
1237
1237
|
() => l`<cx-button data-testid="add-button" variant="default" size="medium" @click=${this.handleAddClick}>${this.addItemText || this.localize.term("add")}</cx-button>`
|
|
1238
1238
|
)}</cx-space>`;
|
|
1239
1239
|
}
|
|
1240
1240
|
};
|
|
1241
|
-
n.styles = [
|
|
1241
|
+
n.styles = [M, be];
|
|
1242
1242
|
n.dependencies = {
|
|
1243
1243
|
"cx-asset-picker": c,
|
|
1244
|
-
"cx-button":
|
|
1245
|
-
"cx-dialog":
|
|
1246
|
-
"cx-dynamic-select":
|
|
1247
|
-
"cx-grid":
|
|
1248
|
-
"cx-grid-item":
|
|
1249
|
-
"cx-input":
|
|
1250
|
-
"cx-line-clamp":
|
|
1251
|
-
"cx-option":
|
|
1252
|
-
"cx-radio":
|
|
1253
|
-
"cx-radio-group":
|
|
1254
|
-
"cx-select":
|
|
1255
|
-
"cx-space":
|
|
1256
|
-
"cx-table":
|
|
1257
|
-
"cx-typography":
|
|
1244
|
+
"cx-button": S,
|
|
1245
|
+
"cx-dialog": G,
|
|
1246
|
+
"cx-dynamic-select": J,
|
|
1247
|
+
"cx-grid": j,
|
|
1248
|
+
"cx-grid-item": F,
|
|
1249
|
+
"cx-input": E,
|
|
1250
|
+
"cx-line-clamp": P,
|
|
1251
|
+
"cx-option": B,
|
|
1252
|
+
"cx-radio": K,
|
|
1253
|
+
"cx-radio-group": U,
|
|
1254
|
+
"cx-select": H,
|
|
1255
|
+
"cx-space": T,
|
|
1256
|
+
"cx-table": V,
|
|
1257
|
+
"cx-typography": L
|
|
1258
1258
|
};
|
|
1259
1259
|
r([
|
|
1260
1260
|
y("cx-dialog")
|
|
@@ -1267,8 +1267,8 @@ r([
|
|
|
1267
1267
|
converter: {
|
|
1268
1268
|
fromAttribute: (e) => {
|
|
1269
1269
|
try {
|
|
1270
|
-
const
|
|
1271
|
-
return Array.isArray(
|
|
1270
|
+
const a = JSON.parse(e);
|
|
1271
|
+
return Array.isArray(a) ? a : [];
|
|
1272
1272
|
} catch {
|
|
1273
1273
|
return [];
|
|
1274
1274
|
}
|
|
@@ -1342,19 +1342,19 @@ r([
|
|
|
1342
1342
|
o({ attribute: "on-request-asset", type: Function })
|
|
1343
1343
|
], n.prototype, "onRequestAsset", 2);
|
|
1344
1344
|
r([
|
|
1345
|
-
|
|
1345
|
+
N()
|
|
1346
1346
|
], n.prototype, "editedItem", 2);
|
|
1347
1347
|
r([
|
|
1348
|
-
|
|
1348
|
+
N()
|
|
1349
1349
|
], n.prototype, "isAdding", 2);
|
|
1350
1350
|
r([
|
|
1351
|
-
|
|
1351
|
+
N()
|
|
1352
1352
|
], n.prototype, "columnsMap", 2);
|
|
1353
1353
|
r([
|
|
1354
|
-
|
|
1354
|
+
N()
|
|
1355
1355
|
], n.prototype, "sortedEntries", 2);
|
|
1356
1356
|
r([
|
|
1357
|
-
|
|
1357
|
+
N()
|
|
1358
1358
|
], n.prototype, "translatableControls", 2);
|
|
1359
1359
|
r([
|
|
1360
1360
|
v("columns"),
|
|
@@ -1367,15 +1367,15 @@ r([
|
|
|
1367
1367
|
r([
|
|
1368
1368
|
v("loadingEvent", { waitUntilFirstUpdate: !0 }),
|
|
1369
1369
|
v("loadingItemIndex", { waitUntilFirstUpdate: !0 }),
|
|
1370
|
-
|
|
1370
|
+
X(10)
|
|
1371
1371
|
], n.prototype, "handleLoadingEventChange", 1);
|
|
1372
1372
|
n = r([
|
|
1373
|
-
|
|
1373
|
+
z("cx-list-editor")
|
|
1374
1374
|
], n);
|
|
1375
1375
|
export {
|
|
1376
1376
|
n as C,
|
|
1377
|
-
|
|
1377
|
+
de as I,
|
|
1378
1378
|
c as a,
|
|
1379
|
-
|
|
1380
|
-
|
|
1379
|
+
fe as c,
|
|
1380
|
+
ue as u
|
|
1381
1381
|
};
|