@financial-times/custom-code-component 2.0.14 → 2.0.16

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.
@@ -38,35 +38,147 @@ export declare interface CustomCodeComponent extends ContentTree.Node {
38
38
  }
39
39
 
40
40
  declare class FTCustomCodeComponent extends HTMLElement {
41
+ /**
42
+ * The component renderer, resolved from dynamic import
43
+ */
41
44
  app?: typeof BaseRenderer.prototype.render;
45
+ /**
46
+ * Set whether component is "open" or "closed". Defaults to "open".
47
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/attachShadow#mode
48
+ */
42
49
  mode: "closed" | "open";
50
+ /**
51
+ * Reserved attributes we don't pass to the child component
52
+ */
43
53
  RESERVED_ATTRS: Set<string>;
54
+ /**
55
+ * URI of component module for CCC webcomponent to load
56
+ */
44
57
  source?: string;
58
+ /**
59
+ * OTracking config
60
+ */
45
61
  tracking?: Tracking;
62
+ /**
63
+ * Alternative base URL, used for testing
64
+ */
46
65
  testUrl?: URL;
66
+ /**
67
+ * ComponentPath instance with `org`, `repo`, `name` and `versionRange` attributes
68
+ */
47
69
  component: ComponentPath;
70
+ /**
71
+ * Logger instance. Set log level using `this.log.setLogLevel(string|number|null)`.
72
+ */
48
73
  log: Logger;
74
+ /**
75
+ * IntersectionObserver that dispatches CCCViewportEvents
76
+ */
49
77
  observer: IntersectionObserver;
78
+ /**
79
+ * Custom Element constructor.
80
+ *
81
+ * n.b., attributes and ShadowDOM aren't available in custom element constructors.
82
+ * Use connectedCallback() and other lifecycle methods if you want to eg. this.getAttribute()
83
+ */
50
84
  constructor();
85
+ /**
86
+ * connectedCallback() CE lifecycle callback
87
+ *
88
+ * Called whenever a <custom-code-component> element is mounted to the DOM.
89
+ */
51
90
  connectedCallback(): Promise<void>;
91
+ /**
92
+ * Error handler. Decorates errors for easier ingestion.
93
+ *
94
+ * @param error
95
+ */
52
96
  emitError(error: Error): void;
97
+ /**
98
+ * disconnectedCallback() CE lifecycle event.
99
+ *
100
+ * Called when a <custom-code-component> element is removed from DOM.
101
+ */
53
102
  disconnectedCallback(): void;
103
+ /**
104
+ * MessageChannel interface.
105
+ *
106
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/MessageChannel
107
+ */
54
108
  channel: MessageChannel;
55
- onmessage(): void;
109
+ /**
110
+ * MessageChannel postMessage callback
111
+ *
112
+ * @param e
113
+ */
114
+ onmessage(e?: any): void;
115
+ /**
116
+ * This error handler is called by the child component on e.g. unrecoverable error.
117
+ * It then calls unmount(), which restores the fallback.
118
+ *
119
+ * @param e
120
+ */
56
121
  onunmount(e: Error): void;
122
+ /**
123
+ * onready event callback.
124
+ * Called by mount() after kicking off initial component render.
125
+ *
126
+ * @param app
127
+ */
57
128
  onready(app: Promise<void>): Promise<void>;
129
+ /**
130
+ * MessageChannel postMessage handler.
131
+ * This can be used for inter-CCC communication.
132
+ * @param event
133
+ */
58
134
  postMessage(event: any): void;
135
+ /**
136
+ * Initial mounting behaviour.
137
+ *
138
+ * Attaches ShadowDOM if needed, dispatches ccc:connected event, adds component base styles,
139
+ * generates fallback template element if one doesn't exist already, initialises tracking,
140
+ * then kicks off component rendering. Passes component render promise to onready().
141
+ *
142
+ * @param prerendered
143
+ */
59
144
  mount(prerendered?: ShadowRoot | null): Promise<void>;
145
+ /**
146
+ * Called in top-level error handler or by child component on unhandled error.
147
+ * Replace shadow root with either <slot> or template[data-component-fallback]
148
+ * slot on failure
149
+ *
150
+ * @param e
151
+ */
60
152
  unmount(e: Error): void;
61
- load(): Promise<(shadowRoot: ShadowRoot, props: any, ssr?: boolean, onErrorCallback?: Function) => {
153
+ /**
154
+ * Asynchronously loads the CCC child component.
155
+ *
156
+ * @returns Promise resolving to component renderer function
157
+ */
158
+ load(): Promise<(shadowRoot: ShadowRoot, props: any, ssr?: boolean, onErrorCallback?: Function, log?: Logger) => {
62
159
  onmessage: {
63
160
  (...data: any[]): void;
64
161
  (message?: any, ...optionalParams: any[]): void;
65
162
  };
66
163
  ready: Promise<void>;
67
164
  }>;
165
+ /**
166
+ * Initialises OTracking
167
+ */
68
168
  initTracking: () => Promise<void>;
169
+ /**
170
+ * Injects Vite HMR scripts during dev environment usage
171
+ */
69
172
  injectViteScripts: () => void;
173
+ /**
174
+ * Called whenever the <custom-code-component>'s attributes are changed.
175
+ * Currently only used to dynamically set log level.
176
+ *
177
+ * @param name
178
+ * @param oldValue
179
+ * @param newValue
180
+ */
181
+ attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
70
182
  }
71
183
  export { FTCustomCodeComponent as CCCHTMLElement }
72
184
  export { FTCustomCodeComponent }
@@ -81,6 +193,7 @@ declare class Logger {
81
193
  info(...args: any[]): void;
82
194
  warn(...args: any[]): void;
83
195
  error(...args: any[]): void;
196
+ setLogLevel(level: string | number | null): void;
84
197
  }
85
198
 
86
199
  declare class Tracking {