@fluid-topics/ft-wc-utils 1.3.36 → 1.3.38

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.
Files changed (4) hide show
  1. package/build/FtLitElement.d.ts +6 -0
  2. package/build/FtLitElement.js +48 -26
  3. package/build/globals.min.js +16 -16
  4. package/package.json +3 -3
package/build/FtLitElement.d.ts CHANGED
@@ -10,9 +10,14 @@ export type FtElementToFocus = {
10
10
  selector?: string;
11
11
  shadowPath?: string[];
12
12
  };
13
+ export declare class ExportpartsUpdatedEvent extends CustomEvent<void> {
14
+ static eventName: string;
15
+ constructor();
16
+ }
13
17
  export declare class FtLitElement extends ScopedRegistryLitElement {
14
18
  exportpartsPrefix?: string;
15
19
  exportpartsPrefixes?: string[];
20
+ exportparts?: string;
16
21
  customStylesheet?: string;
17
22
  elementToFocus?: FtElementToFocus;
18
23
  private useAdoptedStyleSheets;
@@ -23,6 +28,7 @@ export declare class FtLitElement extends ScopedRegistryLitElement {
23
28
  adoptedCallback(): void;
24
29
  static [dynamicDependenciesLoaded]?: boolean;
25
30
  connectedCallback(): void;
31
+ disconnectedCallback(): void;
26
32
  protected importDynamicDependencies(): void;
27
33
  protected updated(props: PropertyValues): void;
28
34
  protected contentAvailableCallback(props: PropertyValues): void;
package/build/FtLitElement.js CHANGED
@@ -14,12 +14,33 @@ const constructorPrototype = Symbol("constructorPrototype");
14
14
  const constructorName = Symbol("constructorName");
15
15
  const exportpartsDebouncer = Symbol("exportpartsDebouncer");
16
16
  const dynamicDependenciesLoaded = Symbol("dynamicDependenciesLoaded");
17
+ class ExportpartsUpdatedEvent extends CustomEvent {
18
+ constructor() {
19
+ super(ExportpartsUpdatedEvent.eventName, { bubbles: true });
20
+ }
21
+ }
22
+ ExportpartsUpdatedEvent.eventName = "exportparts-updated";
23
+ export { ExportpartsUpdatedEvent };
17
24
  export class FtLitElement extends ScopedRegistryLitElement {
18
25
  constructor() {
19
26
  super();
20
27
  this.useAdoptedStyleSheets = true;
21
28
  this.adoptedCustomStyleSheet = new CSSStyleSheet();
22
29
  this[_a] = new Debouncer(5);
30
+ this.scheduleExportpartsUpdate = () => {
31
+ var _b, _c, _d;
32
+ if (((_b = this.exportpartsPrefix) === null || _b === void 0 ? void 0 : _b.trim()) || ((_d = (_c = this.exportpartsPrefixes) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0 > 0)) {
33
+ this[exportpartsDebouncer].run(() => {
34
+ var _b, _c;
35
+ if ((_b = this.exportpartsPrefix) === null || _b === void 0 ? void 0 : _b.trim()) {
36
+ this.setExportpartsAttribute([this.exportpartsPrefix]);
37
+ }
38
+ else if (this.exportpartsPrefixes != null && ((_c = this.exportpartsPrefixes) === null || _c === void 0 ? void 0 : _c.length) > 0) {
39
+ this.setExportpartsAttribute(this.exportpartsPrefixes);
40
+ }
41
+ });
42
+ }
43
+ };
23
44
  this[constructorName] = this.constructor.name;
24
45
  this[constructorPrototype] = this.constructor.prototype;
25
46
  }
@@ -29,6 +50,7 @@ export class FtLitElement extends ScopedRegistryLitElement {
29
50
  }
30
51
  }
31
52
  connectedCallback() {
53
+ var _b;
32
54
  super.connectedCallback();
33
55
  try {
34
56
  if (this.shadowRoot && !this.shadowRoot.adoptedStyleSheets.includes(this.adoptedCustomStyleSheet)) {
@@ -40,11 +62,17 @@ export class FtLitElement extends ScopedRegistryLitElement {
40
62
  this.useAdoptedStyleSheets = false;
41
63
  console.error("Cannot use adopted stylesheets", e);
42
64
  }
43
- let constructor = this.constructor;
65
+ const constructor = this.constructor;
44
66
  if (!constructor[dynamicDependenciesLoaded]) {
45
67
  constructor[dynamicDependenciesLoaded] = true;
46
68
  this.importDynamicDependencies();
47
69
  }
70
+ (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.addEventListener(ExportpartsUpdatedEvent.eventName, this.scheduleExportpartsUpdate);
71
+ }
72
+ disconnectedCallback() {
73
+ var _b;
74
+ super.disconnectedCallback();
75
+ (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.removeEventListener(ExportpartsUpdatedEvent.eventName, this.scheduleExportpartsUpdate);
48
76
  }
49
77
  importDynamicDependencies() {
50
78
  }
@@ -55,6 +83,9 @@ export class FtLitElement extends ScopedRegistryLitElement {
55
83
  this.focusElementToFocus(props);
56
84
  this.applyCustomStylesheet(props);
57
85
  this.scheduleExportpartsUpdate();
86
+ if (props.has("exportparts")) {
87
+ this.dispatchEvent(new ExportpartsUpdatedEvent());
88
+ }
58
89
  });
59
90
  }
60
91
  contentAvailableCallback(props) {
@@ -75,7 +106,7 @@ export class FtLitElement extends ScopedRegistryLitElement {
75
106
  }
76
107
  applyCustomStylesheet(props) {
77
108
  var _b, _c, _d;
78
- ((_c = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll(".ft-lit-element--custom-stylesheet")) !== null && _c !== void 0 ? _c : []).forEach(e => e.remove());
109
+ ((_c = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll(".ft-lit-element--custom-stylesheet")) !== null && _c !== void 0 ? _c : []).forEach((e) => e.remove());
79
110
  if (this.useAdoptedStyleSheets) {
80
111
  if (props.has("customStylesheet")) {
81
112
  try {
@@ -96,42 +127,30 @@ export class FtLitElement extends ScopedRegistryLitElement {
96
127
  }
97
128
  }
98
129
  }
99
- scheduleExportpartsUpdate() {
100
- var _b, _c, _d;
101
- if (((_b = this.exportpartsPrefix) === null || _b === void 0 ? void 0 : _b.trim()) || ((_d = (_c = this.exportpartsPrefixes) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0 > 0)) {
102
- this[exportpartsDebouncer].run(() => {
103
- var _b, _c;
104
- if ((_b = this.exportpartsPrefix) === null || _b === void 0 ? void 0 : _b.trim()) {
105
- this.setExportpartsAttribute([this.exportpartsPrefix]);
106
- }
107
- else if (this.exportpartsPrefixes != null && ((_c = this.exportpartsPrefixes) === null || _c === void 0 ? void 0 : _c.length) > 0) {
108
- this.setExportpartsAttribute(this.exportpartsPrefixes);
109
- }
110
- });
111
- }
112
- }
113
130
  setExportpartsAttribute(prefixes) {
114
131
  var _b, _c, _d, _e, _f, _g;
115
132
  const stringFilter = (p) => p != null && p.trim().length > 0;
116
- const trimmedPrefixes = prefixes.filter(stringFilter).map(p => p.trim());
133
+ const trimmedPrefixes = prefixes.filter(stringFilter).map((p) => p.trim());
117
134
  if (trimmedPrefixes.length === 0) {
118
- this.removeAttribute("exportparts");
135
+ this.exportparts = undefined;
119
136
  return;
120
137
  }
121
138
  const allSubParts = new Set();
122
- for (let element of (_c = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll("[part],[exportparts]")) !== null && _c !== void 0 ? _c : []) {
139
+ for (const element of (_c = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll("[part],[exportparts]")) !== null && _c !== void 0 ? _c : []) {
123
140
  const foundParts = (_e = (_d = element.getAttribute("part")) === null || _d === void 0 ? void 0 : _d.split(" ")) !== null && _e !== void 0 ? _e : [];
124
- const foundExportParts = (_g = (_f = element.getAttribute("exportparts")) === null || _f === void 0 ? void 0 : _f.split(",").map(exp => exp.split(":")[1])) !== null && _g !== void 0 ? _g : [];
125
- new Array(...foundParts, ...foundExportParts).filter(stringFilter)
126
- .map(part => part.trim())
127
- .forEach(part => allSubParts.add(part));
141
+ const foundExportParts = (_g = (_f = element.getAttribute("exportparts")) === null || _f === void 0 ? void 0 : _f.split(",").map((exp) => exp.split(":")[1])) !== null && _g !== void 0 ? _g : [];
142
+ const allParts = [...foundParts, ...foundExportParts].filter(stringFilter)
143
+ .map((part) => part.trim());
144
+ for (const part of allParts) {
145
+ allSubParts.add(part);
146
+ }
128
147
  }
129
148
  if (allSubParts.size === 0) {
130
- this.removeAttribute("exportparts");
149
+ this.exportparts = undefined;
131
150
  return;
132
151
  }
133
- const prefixedSubParts = [...allSubParts.values()].flatMap(part => trimmedPrefixes.map(prefix => `${part}:${prefix}--${part}`));
134
- this.setAttribute("exportparts", [...this.part, ...prefixedSubParts].join(", "));
152
+ const prefixedSubParts = [...allSubParts.values()].flatMap((part) => trimmedPrefixes.map((prefix) => `${part}:${prefix}--${part}`));
153
+ this.exportparts = [...this.part, ...prefixedSubParts].join(", ");
135
154
  }
136
155
  }
137
156
  _a = exportpartsDebouncer;
@@ -141,6 +160,9 @@ __decorate([
141
160
  __decorate([
142
161
  jsonProperty([])
143
162
  ], FtLitElement.prototype, "exportpartsPrefixes", void 0);
163
+ __decorate([
164
+ property({ reflect: true })
165
+ ], FtLitElement.prototype, "exportparts", void 0);
144
166
  __decorate([
145
167
  property()
146
168
  ], FtLitElement.prototype, "customStylesheet", void 0);