@sitecore-feaas/clientside 0.3.17 → 0.4.0-alpha.1
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/README.md +6 -10
- package/build/components/FEAASElement.js +5 -0
- package/build/components/FEAASElement.js.map +1 -1
- package/build/dom/rendering.js +2 -2
- package/build/dom/rendering.js.map +1 -1
- package/build/dom/thumbnail.js +2 -2
- package/build/dom/thumbnail.js.map +1 -1
- package/build/ui/FEAASExternal.js +13 -229
- package/build/ui/FEAASExternal.js.map +1 -1
- package/build/ui/FEAASPicker.js +5 -3
- package/build/ui/FEAASPicker.js.map +1 -1
- package/build/ui/react.js +13 -90
- package/build/ui/react.js.map +1 -1
- package/dist/browser/headless.cjs +7 -7
- package/dist/browser/headless.cjs.map +3 -3
- package/dist/browser/headless.esm.js +7 -7
- package/dist/browser/headless.esm.js.map +1 -1
- package/dist/browser/index.cjs +6 -6
- package/dist/browser/index.cjs.map +3 -3
- package/dist/browser/index.esm.js +6 -6
- package/dist/browser/index.esm.js.map +1 -1
- package/dist/browser/react.cjs +7 -7
- package/dist/browser/react.cjs.map +4 -4
- package/dist/browser/react.esm.js +7 -7
- package/dist/browser/react.esm.js.map +1 -1
- package/dist/node/headless.cjs +5 -5
- package/dist/node/headless.cjs.map +3 -3
- package/dist/node/headless.esm.js +5 -5
- package/dist/node/headless.esm.js.map +3 -3
- package/dist/node/index.cjs +5 -5
- package/dist/node/index.cjs.map +3 -3
- package/dist/node/index.esm.js +5 -5
- package/dist/node/index.esm.js.map +3 -3
- package/dist/node/react.cjs +5 -5
- package/dist/node/react.cjs.map +4 -4
- package/dist/node/react.esm.js +5 -5
- package/dist/node/react.esm.js.map +4 -4
- package/headless.cjs +5 -5
- package/headless.cjs.map +3 -3
- package/headless.js +5 -5
- package/headless.js.map +3 -3
- package/package.json +6 -2
- package/react.cjs +7 -7
- package/react.cjs.map +4 -4
- package/react.js +7 -7
- package/react.js.map +4 -4
- package/src/components/FEAASElement.tsx +5 -0
- package/src/dom/rendering.ts +3 -1
- package/src/dom/thumbnail.ts +6 -3
- package/src/ui/FEAASExternal.tsx +16 -276
- package/src/ui/FEAASPicker.tsx +6 -5
- package/src/ui/react.tsx +18 -120
- package/test/FEAASComponent.test.tsx +1 -1
- package/test/dom.test.ts +1 -1
- package/tsconfig.json +3 -0
- package/types/components/FEAASElement.d.ts.map +1 -1
- package/types/dom/rendering.d.ts.map +1 -1
- package/types/dom/thumbnail.d.ts +2 -2
- package/types/dom/thumbnail.d.ts.map +1 -1
- package/types/tsbuildinfo +1 -1
- package/types/ui/FEAASContext.d.ts +1 -1
- package/types/ui/FEAASExternal.d.ts +7 -92
- package/types/ui/FEAASExternal.d.ts.map +1 -1
- package/types/ui/FEAASPicker.d.ts +3 -3
- package/types/ui/FEAASPicker.d.ts.map +1 -1
- package/types/ui/react.d.ts +11 -47
- package/types/ui/react.d.ts.map +1 -1
- package/types/ui/tsbuildinfo +1 -1
- package/types/utils/settings.d.ts +5 -5
- package/src/utils/string.ts +0 -12
|
@@ -167,6 +167,11 @@ export class FEAASElement<Props = any, Payload = any> extends WebComponent {
|
|
|
167
167
|
if (!this.connected) return
|
|
168
168
|
this.log('FEAAS: Unmount', this)
|
|
169
169
|
this.dispatchEventIndirectly(new Event('feaasUnmount', { bubbles: true, composed: true }))
|
|
170
|
+
// If a component is react component, we need to re-render tree so that React can unmount it from VDOM
|
|
171
|
+
// so observers can be removed
|
|
172
|
+
if (this.connected && this.initialized && this.render) {
|
|
173
|
+
this.update()
|
|
174
|
+
}
|
|
170
175
|
this.cancelRender()
|
|
171
176
|
this.connected = false
|
|
172
177
|
// If a component is react component, we need to re-render tree so that React can unmount
|
package/src/dom/rendering.ts
CHANGED
|
@@ -124,7 +124,9 @@ export function setDOMAttribute(element: HTMLElement, attribute: string, value:
|
|
|
124
124
|
const usePlaceholder = prop == 'innerHTML' || prop == 'src'
|
|
125
125
|
if (usePlaceholder && (value == null || value === '')) {
|
|
126
126
|
var placeholder = String(
|
|
127
|
-
(element.getAttribute('data-path-placeholder') || target[prop as keyof HTMLElement]) ??
|
|
127
|
+
(element.getAttribute('data-path-placeholder') || target[prop as keyof HTMLElement]) ??
|
|
128
|
+
target.getAttribute(prop) ??
|
|
129
|
+
''
|
|
128
130
|
)
|
|
129
131
|
if (prop == 'innerHTML') {
|
|
130
132
|
target.innerHTML = placeholder
|
package/src/dom/thumbnail.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { SDK, Style, VersionModel, ComponentModel } from '@sitecore-feaas/sdk'
|
|
1
|
+
import type { SDK, Style, VersionModel, ComponentModel, StylesheetModel } from '@sitecore-feaas/sdk'
|
|
2
2
|
import { fetchAndRevalidate } from '../fetch.js'
|
|
3
3
|
import { renderComponent } from './component.js'
|
|
4
4
|
|
|
@@ -147,13 +147,16 @@ export async function load(
|
|
|
147
147
|
* @param {VersionModel} [version] - Version instance.
|
|
148
148
|
* @returns {Promise<HTMLImageElement | null>} Thumbnail image or null if generation isn't possible.
|
|
149
149
|
*/
|
|
150
|
-
export async function generate(component: ComponentModel, version?: VersionModel) {
|
|
150
|
+
export async function generate(component: ComponentModel, version?: VersionModel, customStylesheet?: StylesheetModel) {
|
|
151
151
|
const sourceVersion = version || (component.isNew ? null : await getVersionForThumbnail(component))
|
|
152
|
+
|
|
152
153
|
if (!sourceVersion || sourceVersion.isViewEmpty()) {
|
|
153
154
|
return null
|
|
154
155
|
}
|
|
155
|
-
const
|
|
156
|
+
const stylesheet = customStylesheet || component.library.stylesheets.first
|
|
157
|
+
|
|
156
158
|
const { datasources } = component.sdk
|
|
159
|
+
|
|
157
160
|
const img = await render(
|
|
158
161
|
sourceVersion.classList,
|
|
159
162
|
stylesheet.getBreakpointForWidth(800, sourceVersion.getBreakpoints()),
|
package/src/ui/FEAASExternal.tsx
CHANGED
|
@@ -1,142 +1,39 @@
|
|
|
1
|
+
import * as BYOC from '@sitecore/byoc'
|
|
1
2
|
import React from 'react'
|
|
2
3
|
import ReactDOM from 'react-dom'
|
|
3
|
-
import { FEAASElement
|
|
4
|
+
import { FEAASElement } from '../components/FEAASElement.js'
|
|
4
5
|
import { ReactJSX, ReactModules } from '../components/FEAASReactElement.js'
|
|
5
|
-
import { kebabCase, reverseKebabCase } from '../utils/string.js'
|
|
6
6
|
import { Component, FEAASComponentProps } from './react.js'
|
|
7
|
-
import type {
|
|
8
|
-
ExternalComponent,
|
|
9
|
-
ExternalComponentOptions,
|
|
10
|
-
JSONSchema,
|
|
11
|
-
ObjectSchema,
|
|
12
|
-
UISchema
|
|
13
|
-
} from '@sitecore-feaas/sdk'
|
|
14
7
|
|
|
15
|
-
|
|
16
|
-
const addTitles = (properties: { [key: string]: any }) =>
|
|
17
|
-
Object.keys(properties).reduce((acc: { [key: string]: any }, key) => {
|
|
18
|
-
if (properties[key].title) {
|
|
19
|
-
acc[key] = properties[key]
|
|
20
|
-
} else {
|
|
21
|
-
const title = key
|
|
22
|
-
.split('-')
|
|
23
|
-
.map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
|
|
24
|
-
.join(' ')
|
|
25
|
-
acc[key] = { ...properties[key], title }
|
|
26
|
-
}
|
|
27
|
-
return acc
|
|
28
|
-
}, {})
|
|
29
|
-
|
|
30
|
-
/** Converts the keys of an object to kebab case. */
|
|
31
|
-
export const objectKeysToKebabCase = (object: { [key: string]: any } = {}) =>
|
|
32
|
-
Object.keys(object).reduce((acc: { [key: string]: any }, key) => {
|
|
33
|
-
acc[kebabCase(key)] = object[key]
|
|
34
|
-
return acc
|
|
35
|
-
}, {})
|
|
36
|
-
|
|
37
|
-
const transformSchema = (schema: JSONSchema) => {
|
|
38
|
-
if (!schema) return
|
|
39
|
-
if (!schema.properties) return schema
|
|
40
|
-
let properties, required
|
|
41
|
-
|
|
42
|
-
/* kebab-case properties */
|
|
43
|
-
properties = objectKeysToKebabCase(schema.properties)
|
|
44
|
-
required = (schema.required || []).map((item: string) => kebabCase(item))
|
|
45
|
-
|
|
46
|
-
/* generate titles if not exist */
|
|
47
|
-
properties = addTitles(properties)
|
|
48
|
-
|
|
49
|
-
/* remove title from schema - it will be passed separately to use custom styling in the form */
|
|
50
|
-
const title: string = undefined
|
|
51
|
-
return { ...schema, properties, required, title }
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
const transformUiSchema = (uiSchema: UISchema, properties: { [key: string]: any }) => {
|
|
55
|
-
if (!uiSchema || !properties) return
|
|
56
|
-
let transformed: UISchema
|
|
57
|
-
|
|
58
|
-
/* kebab-case keys */
|
|
59
|
-
transformed = objectKeysToKebabCase(uiSchema)
|
|
60
|
-
|
|
61
|
-
/* use updown input widget as default for numbers */
|
|
62
|
-
const numberProperties = Object.keys(properties).filter((key) => /(integer|number)/.test(properties[key].type))
|
|
63
|
-
numberProperties.forEach((propertyName) => {
|
|
64
|
-
if (!transformed[propertyName]) transformed[propertyName] = { 'ui:widget': 'updown' }
|
|
65
|
-
else if (!transformed[propertyName]['ui:widget']) transformed[propertyName]['ui:widget'] = 'updown'
|
|
66
|
-
})
|
|
67
|
-
|
|
68
|
-
return transformed
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
/** Parses a property value based on its property name and type defined in the JSON properties object. */
|
|
72
|
-
export const parseProps = (propName: string, value: string, properties: JSONSchema['properties']) => {
|
|
73
|
-
switch (properties?.[propName]?.type) {
|
|
74
|
-
case 'string':
|
|
75
|
-
return value
|
|
76
|
-
case 'object':
|
|
77
|
-
try {
|
|
78
|
-
return typeof value == 'object' && value != null ? value : JSON.parse(value)
|
|
79
|
-
} catch (e) {
|
|
80
|
-
return null
|
|
81
|
-
}
|
|
82
|
-
case 'array':
|
|
83
|
-
try {
|
|
84
|
-
return Array.isArray(value) ? value : JSON.parse(value)
|
|
85
|
-
} catch (e) {
|
|
86
|
-
return null
|
|
87
|
-
}
|
|
88
|
-
case 'number':
|
|
89
|
-
return parseFloat(value)
|
|
90
|
-
case 'integer':
|
|
91
|
-
return parseInt(value)
|
|
92
|
-
case 'boolean':
|
|
93
|
-
return value == 'true' || value == '1'
|
|
94
|
-
default:
|
|
95
|
-
return value
|
|
96
|
-
}
|
|
97
|
-
}
|
|
8
|
+
export const FEAASExternalPropsObject = BYOC.getComponentProperties
|
|
98
9
|
|
|
99
10
|
export function FEAASExternalProps(element: FEAASElement): any {
|
|
100
|
-
const props =
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
11
|
+
const props = BYOC.objectKeysToCamelCase(
|
|
12
|
+
Array.from(element.attributes).reduce((prev, { name, value }) => {
|
|
13
|
+
return Object.assign(prev, { [name]: value })
|
|
14
|
+
}, {} as any)
|
|
15
|
+
)
|
|
16
|
+
return FEAASExternalPropsObject(props.dataExternalId, props)
|
|
104
17
|
}
|
|
105
18
|
|
|
106
|
-
export function FEAASExternalPropsObject(id: string, props: Record<string, string>): any {
|
|
107
|
-
const schema: JSONSchema = FEAASExternal.registered[id]?.schema
|
|
108
|
-
return Object.keys(props).reduce((prev, name) => {
|
|
109
|
-
const value = props[name]
|
|
110
|
-
if (!name.startsWith('data-attribute') && !['class', 'id', 'contenteditable'].includes(name)) {
|
|
111
|
-
return { ...prev, [reverseKebabCase(name)]: parseProps(reverseKebabCase(name), value, schema?.properties) }
|
|
112
|
-
} else {
|
|
113
|
-
return prev
|
|
114
|
-
}
|
|
115
|
-
}, {})
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
export type RegisteredComponents = {
|
|
119
|
-
[id: string]: ExternalComponent
|
|
120
|
-
}
|
|
121
19
|
export type FEAASExternalProps = ReturnType<typeof FEAASExternalProps> & { dataExternalId: string }
|
|
122
20
|
|
|
123
21
|
export default class FEAASExternal extends FEAASElement<FEAASExternalProps, ReactModules> {
|
|
124
|
-
static registered: RegisteredComponents = {}
|
|
125
|
-
static registrationCallback: NodeJS.Timeout
|
|
126
22
|
load() {
|
|
127
23
|
return Promise.resolve({ React, ReactDOM })
|
|
128
24
|
}
|
|
129
25
|
|
|
130
26
|
update() {
|
|
131
27
|
const { dataExternalId: id } = this.props
|
|
132
|
-
const Component =
|
|
28
|
+
const Component = BYOC.getComponent(id)?.component
|
|
133
29
|
if (!Component && this.getAttribute('hydrate') == 'false') return
|
|
134
30
|
return super.update()
|
|
135
31
|
}
|
|
136
32
|
|
|
137
33
|
render(props: FEAASExternalProps, { React }: ReactModules): ReactJSX {
|
|
138
34
|
const { dataExternalId: id } = props
|
|
139
|
-
|
|
35
|
+
console.log(props)
|
|
36
|
+
const Component = BYOC.getComponent(id)?.component
|
|
140
37
|
if (!Component) {
|
|
141
38
|
console.warn(`FEAASExternal: \`${id}\` is not registered`)
|
|
142
39
|
}
|
|
@@ -147,119 +44,6 @@ export default class FEAASExternal extends FEAASElement<FEAASExternalProps, Reac
|
|
|
147
44
|
return FEAASExternalProps(this)
|
|
148
45
|
}
|
|
149
46
|
|
|
150
|
-
/**
|
|
151
|
-
* Register React component to be renderable as Sitecore component (in Components and Pages). Properties are defined
|
|
152
|
-
* as {@link https://json-schema.org JSON Schema}, from which a configuration form will be produced using
|
|
153
|
-
* {@link https://rjsf-team.github.io/react-jsonschema-form/ RJSF library}. The library allows passing a
|
|
154
|
-
* {@link https://rjsf-team.github.io/react-jsonschema-form/docs/api-reference/uiSchema UI Schema} that allows tight
|
|
155
|
-
* customization of form widgets, styles and behavior.
|
|
156
|
-
*
|
|
157
|
-
* @param {React.ComponentType} component React component that will be rendered.
|
|
158
|
-
* @param {string} options.title Component name as presented to the user.
|
|
159
|
-
* @param {JSONSchema['properties']} options.properties Object of properties.
|
|
160
|
-
* @param {JSONSchema['type']} options.properties[].type JSON Schema type of a property.
|
|
161
|
-
* @param {string} [options.properties[].title] Optional title displayed to the user.
|
|
162
|
-
* @param {string} [options.group] Optional Image to be displayed in the UI.
|
|
163
|
-
* @param {string} [options.thumbnail] Optional title displayed to the user.
|
|
164
|
-
* @param {UISchema} [options.ui] Optional component groupping.
|
|
165
|
-
* @see https://rjsf-team.github.io/react-jsonschema-form/docs/api-reference/uiSchema
|
|
166
|
-
* @see https://json-schema.org
|
|
167
|
-
* @example
|
|
168
|
-
*
|
|
169
|
-
* FEAAS.External.registerComponent(MyComponent, {
|
|
170
|
-
* // Name of a component as it will be presented to the user
|
|
171
|
-
* name: 'My Component',
|
|
172
|
-
* // Title of a component as it will be presented in the inputs form
|
|
173
|
-
* title: 'My Component',
|
|
174
|
-
* // Optional: Thumbnail image for component to be displayed in UI
|
|
175
|
-
* thumbnail: 'http://examaple.com/component.jpg',
|
|
176
|
-
* // Optional: Group components by name
|
|
177
|
-
* group: 'Assorted components',
|
|
178
|
-
* // Definitions of three configurable properties that MyComponent accepts
|
|
179
|
-
* properties: {
|
|
180
|
-
* // Color is a string, but only Red/Green/Blue are allowed
|
|
181
|
-
* color: { type: 'string', enum: ['red', 'green', 'blue'] },
|
|
182
|
-
* // Text is a property labelled as "Text summary"
|
|
183
|
-
* text: { type: 'string', title: 'Text summary' },
|
|
184
|
-
* // Count is a number with 1 as default value
|
|
185
|
-
* count: { type: 'number', default: 1 }
|
|
186
|
-
* },
|
|
187
|
-
* // Optional UI schema customization
|
|
188
|
-
* ui: {
|
|
189
|
-
* // Present color choices as radio buttons
|
|
190
|
-
* color: { 'ui:widget': 'radio' },
|
|
191
|
-
* // Text is a textarea with 5 rows
|
|
192
|
-
* text: { 'ui:widget': 'textarea', 'ui:options': { rows: 5 } },
|
|
193
|
-
* // Count is a number field with spinner button
|
|
194
|
-
* count: { 'ui:widget': 'updown' }
|
|
195
|
-
* },
|
|
196
|
-
* // Color and text area required properties
|
|
197
|
-
* required: ['color', 'text']
|
|
198
|
-
* })
|
|
199
|
-
*
|
|
200
|
-
*/
|
|
201
|
-
static registerComponent(
|
|
202
|
-
component: React.ComponentType | ((...args: any[]) => Promise<React.ReactElement>),
|
|
203
|
-
options: ExternalComponentOptions
|
|
204
|
-
) {
|
|
205
|
-
if (!options.name)
|
|
206
|
-
throw new Error(
|
|
207
|
-
'Could not register external component. Please make sure you provide a name in the options' +
|
|
208
|
-
JSON.stringify(options)
|
|
209
|
-
)
|
|
210
|
-
const id = options.name
|
|
211
|
-
const { thumbnail, group, ui: uiSchema, ...schemaOptions } = options
|
|
212
|
-
const schema = { ...schemaOptions, type: 'object' } as ObjectSchema
|
|
213
|
-
FEAASExternal.registered[id] = {
|
|
214
|
-
component,
|
|
215
|
-
name: id,
|
|
216
|
-
schema,
|
|
217
|
-
uiSchema,
|
|
218
|
-
thumbnail,
|
|
219
|
-
group,
|
|
220
|
-
title: schema?.title || id
|
|
221
|
-
}
|
|
222
|
-
FEAASExternal.setRegistrationCallback()
|
|
223
|
-
}
|
|
224
|
-
|
|
225
|
-
static setRegistrationCallback() {
|
|
226
|
-
clearTimeout(FEAASExternal.registrationCallback)
|
|
227
|
-
FEAASExternal.registrationCallback = setTimeout(() => {
|
|
228
|
-
if (typeof window !== 'undefined') {
|
|
229
|
-
// create components array from object
|
|
230
|
-
const components = Object.keys(FEAASExternal.registered).map((id) => ({
|
|
231
|
-
...FEAASExternal.registered[id],
|
|
232
|
-
name: id,
|
|
233
|
-
schema: transformSchema(FEAASExternal.registered[id].schema),
|
|
234
|
-
uiSchema: transformUiSchema(
|
|
235
|
-
FEAASExternal.registered[id].uiSchema,
|
|
236
|
-
FEAASExternal.registered[id].schema?.properties
|
|
237
|
-
)
|
|
238
|
-
//component: FEAASExternal.registered[name].component.toString()
|
|
239
|
-
}))
|
|
240
|
-
|
|
241
|
-
// send components from iframe to parent window
|
|
242
|
-
window.parent?.postMessage(
|
|
243
|
-
JSON.stringify({
|
|
244
|
-
action: 'register-components',
|
|
245
|
-
data: components
|
|
246
|
-
}),
|
|
247
|
-
'*'
|
|
248
|
-
)
|
|
249
|
-
}
|
|
250
|
-
}, 30)
|
|
251
|
-
}
|
|
252
|
-
|
|
253
|
-
/*static loadComponents() {
|
|
254
|
-
const components = JSON.parse(sessionStorage.getItem('feaas-external-components'))
|
|
255
|
-
components.forEach((c: { name: string; schema: any; component: React.ComponentType }) => {
|
|
256
|
-
const name = c.name
|
|
257
|
-
const schema = c.schema
|
|
258
|
-
const component = eval('(' + c.component + ')')
|
|
259
|
-
FEAASExternal.registerComponent(component, schema, name)
|
|
260
|
-
})
|
|
261
|
-
}*/
|
|
262
|
-
|
|
263
47
|
static Preview(props: Partial<FEAASComponentProps<any>> & { src: string }) {
|
|
264
48
|
const src =
|
|
265
49
|
props?.src || (typeof window !== 'undefined' ? window.location.search.match(/feaasSrc=([^&]+)/)?.[1] : null)
|
|
@@ -270,57 +54,13 @@ export default class FEAASExternal extends FEAASElement<FEAASExternalProps, Reac
|
|
|
270
54
|
return () => components.map((components) => null)
|
|
271
55
|
}
|
|
272
56
|
|
|
273
|
-
static
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
declare global {
|
|
279
|
-
namespace JSX {
|
|
280
|
-
interface IntrinsicElements {
|
|
281
|
-
'feaas-external': {
|
|
282
|
-
'data-external-id': string
|
|
283
|
-
children?: any
|
|
284
|
-
dangerouslySetInnerHTML?: { __html: string }
|
|
285
|
-
[key: string]: any
|
|
286
|
-
}
|
|
287
|
-
'feaas-registration': {
|
|
288
|
-
suppressHydrationWarning?: boolean
|
|
289
|
-
components: string
|
|
290
|
-
}
|
|
291
|
-
}
|
|
292
|
-
}
|
|
293
|
-
interface Window {
|
|
294
|
-
FEAASExternalComponents: RegisteredComponents
|
|
295
|
-
}
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
// Register schemas passed as <feaas-registration components=... />
|
|
299
|
-
class FEAASExternalRegistration extends WebComponent {
|
|
300
|
-
connectedCallback() {
|
|
301
|
-
try {
|
|
302
|
-
;(JSON.parse(this.getAttribute('components')) as any[]).forEach((component) => {
|
|
303
|
-
FEAASExternal.registerComponent(null, component)
|
|
304
|
-
})
|
|
305
|
-
} catch (e) {}
|
|
306
|
-
}
|
|
307
|
-
static register(tagName: string) {
|
|
308
|
-
return FEAASElement.register.call(this, tagName)
|
|
309
|
-
}
|
|
310
|
-
}
|
|
311
|
-
|
|
312
|
-
if (typeof window !== 'undefined' && window) {
|
|
313
|
-
if (!('FEAASExternalComponents' in window))
|
|
314
|
-
Object.defineProperty(window, 'FEAASExternalComponents', { get: () => FEAASExternal.registered })
|
|
315
|
-
else if (!location.hostname.startsWith('xmc-'))
|
|
316
|
-
console.error(
|
|
317
|
-
'FEAAS Clientside is loaded twice into the bundle. This can lead to unexpected problems and needs to be resolved'
|
|
318
|
-
)
|
|
57
|
+
static registered: BYOC.RegisteredComponents = BYOC.registered
|
|
58
|
+
static registerComponent = BYOC.registerComponent
|
|
59
|
+
static setRegistrationCallback = BYOC.setRegistrationCallback
|
|
60
|
+
static getComponent = BYOC.getComponent
|
|
319
61
|
}
|
|
320
62
|
|
|
321
63
|
FEAASExternal.register('feaas-external')
|
|
322
|
-
FEAASExternal.setRegistrationCallback()
|
|
323
|
-
FEAASExternalRegistration.register('feaas-registration')
|
|
324
64
|
|
|
325
65
|
export const { getComponent, linkComponents, registerComponent } = FEAASExternal
|
|
326
66
|
export { FEAASExternal as External }
|
package/src/ui/FEAASPicker.tsx
CHANGED
|
@@ -46,7 +46,9 @@ export class FEAASPicker extends FEAASElement<FEAASPickerProps, typeof FEAASPick
|
|
|
46
46
|
const collections = useLibrary('collections')
|
|
47
47
|
const components = useLibrary('components')
|
|
48
48
|
const datasources = useSDK('datasources')
|
|
49
|
-
const
|
|
49
|
+
const library = useLibrary()
|
|
50
|
+
// @ts-ignore temporary workaround until we release all environments
|
|
51
|
+
const rules = library.stylesheets?.first?.rules || library?.stylesheet?.styles
|
|
50
52
|
const component = components.find((c) => c.id == context?.getAttribute('component'))
|
|
51
53
|
const componentName = context?.getAttribute('data-external-id')
|
|
52
54
|
const externalComponent = useSDK('externalComponents').find((c) => c.name == componentName)
|
|
@@ -56,7 +58,6 @@ export class FEAASPicker extends FEAASElement<FEAASPickerProps, typeof FEAASPick
|
|
|
56
58
|
settings = JSON.parse(settings)
|
|
57
59
|
} catch (e) {}
|
|
58
60
|
}
|
|
59
|
-
const datasource = mode == 'datasources' ? datasources.find((d) => d.id == dialog) : null
|
|
60
61
|
return (
|
|
61
62
|
<Picker
|
|
62
63
|
rules={rules}
|
|
@@ -64,11 +65,11 @@ export class FEAASPicker extends FEAASElement<FEAASPickerProps, typeof FEAASPick
|
|
|
64
65
|
themeContext={context}
|
|
65
66
|
placeholder={placeholder}
|
|
66
67
|
component={component}
|
|
67
|
-
|
|
68
|
-
|
|
68
|
+
embed={externalComponent}
|
|
69
|
+
datasources={datasources}
|
|
69
70
|
data={settings}
|
|
70
71
|
versionId={context?.getAttribute('version')}
|
|
71
|
-
mode={mode || (component
|
|
72
|
+
mode={mode || (component || componentName ? 'context' : null)}
|
|
72
73
|
setAttribute={(context, attribute, value) => {
|
|
73
74
|
if (attribute == 'data' && value) value = JSON.stringify(value)
|
|
74
75
|
this.props.setAttribute(context, attribute, value)
|
package/src/ui/react.tsx
CHANGED
|
@@ -1,26 +1,22 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
import { HTMLNode, parseHTMLContent, renderHTMLContent } from '../dom/html.js'
|
|
3
|
+
import { DataSettings } from '../utils/settings.js'
|
|
1
4
|
import {
|
|
5
|
+
FEAASCDNStylesheetParams,
|
|
6
|
+
FEAASCDNStylesheetSource,
|
|
2
7
|
FEAASComponentProps,
|
|
3
|
-
FEAASElement,
|
|
4
8
|
fetchComponent,
|
|
5
9
|
getComponentURL,
|
|
10
|
+
getStylesheetSource,
|
|
6
11
|
getStylesheetURL,
|
|
7
12
|
parseComponentSource,
|
|
8
|
-
|
|
9
|
-
FEAASCDNStylesheetParams,
|
|
10
|
-
parseStylesheetSource,
|
|
11
|
-
getStylesheetSource
|
|
13
|
+
parseStylesheetSource
|
|
12
14
|
} from './index.js'
|
|
13
|
-
import
|
|
14
|
-
import { renderHTMLContent, HTMLNode, parseHTMLContent } from '../dom/html.js'
|
|
15
|
-
import { DataSettings } from '../utils/settings.js'
|
|
16
|
-
import { External, FEAASExternalPropsObject, getComponent, objectKeysToKebabCase } from './FEAASExternal.js'
|
|
17
|
-
import { reverseKebabCase } from '../utils/string.js'
|
|
18
|
-
export { renderHTMLContent }
|
|
19
|
-
export { External, linkComponents, registerComponent, getComponent, FEAASExternalPropsObject } from './FEAASExternal.js'
|
|
20
|
-
export * from './index.js'
|
|
15
|
+
import * as BYOC from '@sitecore/byoc'
|
|
21
16
|
export * from '../headless.js'
|
|
22
|
-
|
|
23
|
-
export
|
|
17
|
+
export { External, FEAASExternalPropsObject, getComponent, linkComponents, registerComponent } from './FEAASExternal.js'
|
|
18
|
+
export * from './index.js'
|
|
19
|
+
export { renderHTMLContent }
|
|
24
20
|
|
|
25
21
|
export type FEAASReactComponentProps = FEAASComponentProps & {
|
|
26
22
|
preload?: boolean
|
|
@@ -84,10 +80,10 @@ export function FEAASReactComponent({ data, ...props }: FEAASReactComponentProps
|
|
|
84
80
|
if (node.localName == 'feaas-external') {
|
|
85
81
|
const camelized = {} as any
|
|
86
82
|
for (var prop in attributes) {
|
|
87
|
-
const key = prop == 'data-external-id' ? 'componentName' :
|
|
83
|
+
const key = prop == 'data-external-id' ? 'componentName' : BYOC.toCamelCase(prop)
|
|
88
84
|
camelized[key] = attributes[prop]
|
|
89
85
|
}
|
|
90
|
-
return [
|
|
86
|
+
return [BYOC.Component, camelized]
|
|
91
87
|
}
|
|
92
88
|
},
|
|
93
89
|
index
|
|
@@ -120,39 +116,6 @@ export function FEAASReactComponent({ data, ...props }: FEAASReactComponentProps
|
|
|
120
116
|
)
|
|
121
117
|
}
|
|
122
118
|
|
|
123
|
-
/**
|
|
124
|
-
* A wrapper over External component that accepts a fallback for rendering in case of a missing component.
|
|
125
|
-
* It accepts properties in camelcase format and ensures no hydration errors on the client-side.
|
|
126
|
-
*
|
|
127
|
-
* @param {FEAASReactExternalComponentProps} props - The properties for the component.
|
|
128
|
-
* @returns {JSX.Element} The JSX element representing the component.
|
|
129
|
-
*/
|
|
130
|
-
export function FEAASReactExternalComponent(props: FEAASReactExternalComponentProps) {
|
|
131
|
-
const { componentName, fallback, ...attributes } = props
|
|
132
|
-
const Component = getComponent(componentName)?.component
|
|
133
|
-
if ((!Component && fallback) || !componentName)
|
|
134
|
-
return (
|
|
135
|
-
<feaas-external data-external-id={componentName} suppressHydrationWarning hydrate={'false'}>
|
|
136
|
-
{fallback}
|
|
137
|
-
</feaas-external>
|
|
138
|
-
)
|
|
139
|
-
const parsed = FEAASExternalPropsObject(componentName, attributes)
|
|
140
|
-
delete parsed['suppressHydrationWarning']
|
|
141
|
-
// execute component as a function to supress hydration errors inside
|
|
142
|
-
return (
|
|
143
|
-
<>
|
|
144
|
-
<feaas-external
|
|
145
|
-
{...objectKeysToKebabCase(parsed)}
|
|
146
|
-
data-external-id={componentName}
|
|
147
|
-
suppressHydrationWarning
|
|
148
|
-
hydrate={'false'}
|
|
149
|
-
>
|
|
150
|
-
{Component == null ? null : <Component {...parsed} />}
|
|
151
|
-
</feaas-external>
|
|
152
|
-
</>
|
|
153
|
-
)
|
|
154
|
-
}
|
|
155
|
-
|
|
156
119
|
/**
|
|
157
120
|
* Converts an HTMLNode into a React tree, ensuring proper context access for external components.
|
|
158
121
|
*
|
|
@@ -198,76 +161,11 @@ export function HTMLNodeToReact(
|
|
|
198
161
|
return React.createElement(reactName, reactAttributes, ['img', 'br', 'input'].includes(reactName) ? null : children)
|
|
199
162
|
}
|
|
200
163
|
|
|
201
|
-
const
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
* A special case of ExternalComponent designed for Next.js.
|
|
207
|
-
* It uses `next/dynamic` to control rendering on the client, server, or both.
|
|
208
|
-
*
|
|
209
|
-
* @param {FEAASReactExternalComponentProps} props - The properties for the component.
|
|
210
|
-
* @returns {JSX.Element} The JSX element representing the component.
|
|
211
|
-
*/
|
|
212
|
-
export function FEAASNextExternalComponent(props: FEAASReactExternalComponentProps) {
|
|
213
|
-
// See if component is registered in current context
|
|
214
|
-
const { componentName, ...attributes } = props
|
|
215
|
-
const Component = getComponent(componentName)?.component
|
|
216
|
-
if (!NextComponents.get(componentName)) {
|
|
217
|
-
// Designate component for rendering on clientside
|
|
218
|
-
const Dynamic = NextDynamicFunction(() => Promise.resolve(NextClientsideRenderer), {
|
|
219
|
-
ssr: false,
|
|
220
|
-
loading: () => <FEAASReactExternalComponent {...attributes} componentName={componentName} />
|
|
221
|
-
})
|
|
222
|
-
|
|
223
|
-
NextComponents.set(componentName, Dynamic)
|
|
224
|
-
}
|
|
225
|
-
|
|
226
|
-
const External = NextComponents.get(componentName)
|
|
227
|
-
return <External {...props} fallback={Component ? <Component {...props} /> : null}></External>
|
|
228
|
-
}
|
|
229
|
-
|
|
230
|
-
/**
|
|
231
|
-
* Enables Next.js client/server rendering options for registered components.
|
|
232
|
-
* The `component` argument should be a function exported from a file with a `use client` directive.
|
|
233
|
-
*
|
|
234
|
-
* @param {any} dynamic - The Next dynamic function.
|
|
235
|
-
* @param {any} component - The component function.
|
|
236
|
-
* @returns {any} Augmented bundle.
|
|
237
|
-
*/
|
|
238
|
-
export function enableNextClientsideComponents(dynamic: any, component: any) {
|
|
239
|
-
NextDynamicFunction = dynamic
|
|
240
|
-
NextClientsideRenderer = component
|
|
241
|
-
return component
|
|
242
|
-
}
|
|
243
|
-
|
|
244
|
-
/**
|
|
245
|
-
* Renders a registered external component in a React tree.
|
|
246
|
-
*
|
|
247
|
-
* @param {FEAASReactExternalComponentProps} props - The properties for the component.
|
|
248
|
-
* @returns {JSX.Element} The JSX element representing the component.
|
|
249
|
-
*/
|
|
250
|
-
export function FEAASExternalComponent(props: FEAASReactExternalComponentProps) {
|
|
251
|
-
if (Object.keys(props).length == 0) {
|
|
252
|
-
return
|
|
253
|
-
}
|
|
254
|
-
if (NextDynamicFunction) return FEAASNextExternalComponent(props)
|
|
255
|
-
return FEAASReactExternalComponent(props)
|
|
256
|
-
}
|
|
257
|
-
export function FEAASReactExternalComponentBundle() {
|
|
258
|
-
return (
|
|
259
|
-
<>
|
|
260
|
-
<feaas-registration components={JSON.stringify(Object.values(External.registered))} suppressHydrationWarning />
|
|
261
|
-
{/** Will not be rendered, but needs to be referenced */}
|
|
262
|
-
{<NextClientsideRenderer />}
|
|
263
|
-
</>
|
|
264
|
-
)
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
export const ExternalComponentBundle = FEAASReactExternalComponentBundle
|
|
268
|
-
export const ExternalComponent = FEAASExternalComponent
|
|
269
|
-
export const ReactExternalComponent = FEAASReactExternalComponent
|
|
270
|
-
export const NextExternalComponent = FEAASNextExternalComponent
|
|
164
|
+
export const enableNextClientsideComponents = BYOC.enableNextClientsideComponents
|
|
165
|
+
export const ExternalComponentBundle = BYOC.Bundle
|
|
166
|
+
export const ExternalComponent = BYOC.Component
|
|
167
|
+
export const ReactExternalComponent = BYOC.RegularComponent
|
|
168
|
+
export const NextExternalComponent = BYOC.NextComponent
|
|
271
169
|
export const Component = FEAASReactComponent
|
|
272
170
|
export const ServerComponent = FEAASReactServerComponent
|
|
273
171
|
export const Stylesheet = FEAASReactStylesheet
|
|
@@ -265,7 +265,7 @@ describe('Components', () => {
|
|
|
265
265
|
await expect(component.whenLoaded).resolves.toEqual('TODAY')
|
|
266
266
|
expect(stylesheet.innerHTML).toEqual('YESTERDAY {}')
|
|
267
267
|
expect(component.innerHTML).toEqual('TODAY')
|
|
268
|
-
await new Promise((resolve) => setTimeout(resolve,
|
|
268
|
+
await new Promise((resolve) => setTimeout(resolve, 200))
|
|
269
269
|
// Stylesheet will update later
|
|
270
270
|
expect(stylesheet.innerHTML).toEqual('TODAY {}')
|
|
271
271
|
})
|
package/test/dom.test.ts
CHANGED
|
@@ -91,7 +91,7 @@ describe('DOM Clientside', function () {
|
|
|
91
91
|
'<div><img data-path-src="image" src="a.jpg" /></div>'
|
|
92
92
|
)
|
|
93
93
|
})
|
|
94
|
-
it('should render mapped attribute', function () {
|
|
94
|
+
it('should not render null mapped attribute', function () {
|
|
95
95
|
assertRenderedHTML(
|
|
96
96
|
`<div><img data-path-src="image" /></div>`,
|
|
97
97
|
{ image: null },
|
package/tsconfig.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FEAASElement.d.ts","sourceRoot":"","sources":["../../src/components/FEAASElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAyB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC3E,OAAO,KAAK,cAAc,MAAM,kBAAkB,CAAA;AAClD,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAA;AACrC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AAEvD,MAAM,MAAM,cAAc,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;AAGnF,QAAA,IAAI,YAAY;;;CAOC,CAAA;AAEjB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,OAAO,KAAK,CAAA;IACnB,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,cAAc,EAAE,OAAO,cAAc,CAAA;CACtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,gBAAgB;QACxB,UAAU,EAAE,KAAK,CAAA;QACjB,YAAY,EAAE,KAAK,CAAA;QACnB,SAAS,EAAE,KAAK,CAAA;QAChB,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,CAAA;KAC/B;CACF;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAAa,YAAY,CAAC,KAAK,GAAG,GAAG,EAAE,OAAO,GAAG,GAAG,CAAE,SAAQ,YAAY;IACxE,MAAM,CAAC,kBAAkB,EAAE,MAAM,EAAE,CAAA;IAEnC,YAAY,iBAAuB;IAEnC,yCAAyC;IACzC,QAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,GAAG,GAAG;IAIpC,wCAAwC;IACxC,KAAK,EAAE,KAAK,CAAA;IACZ,SAAS,EAAE,KAAK,CAAA;IAEhB,4BAA4B;IAC5B,UAAU,EAAE,MAAM,CAAA;IAElB,mCAAmC;IACnC,SAAS,UAAQ;IAEjB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAK;IACvC,WAAW,EAAE,YAAY,EAAE,CAAK;IAEhC,6BAA6B;IAC7B,OAAO,EAAE,OAAO,CAAA;IAChB,UAAU,6BAER;;IAQF,wFAAwF;IACxF,OAAO,IAAI,YAAY,GAAG,WAAW,GAAG,UAAU;IAIlD,yEAAyE;IACzE,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM;IAIzE,+EAA+E;IAC/E,iBAAiB;IAGjB,oBAAoB;IAGpB;;;;;;;OAOG;IACH,KAAK;IAgBL,uBAAuB,CAAC,KAAK,EAAE,KAAK;IAWpC,eAAe,CAAC,SAAS,EAAE,MAAM,KAAK;IAItC,GAAG,CAAC,GAAG,IAAI,EAAE,GAAG;IAqBhB,gEAAgE;IAChE,OAAO;
|
|
1
|
+
{"version":3,"file":"FEAASElement.d.ts","sourceRoot":"","sources":["../../src/components/FEAASElement.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rendering.d.ts","sourceRoot":"","sources":["../../src/dom/rendering.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,WAAW,CAAA;AAElD,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAIvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAG5C,MAAM,WAAW,mBAAmB;IAClC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,KAAK,MAAM,CAAA;IACtF,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,KAAK,GAAG,CAAA;IAC7D,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;IAC1E,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,KAAK,OAAO,CAAA;IAC5D,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,KAAK,IAAI,CAAA;CAC5D;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,MAAM,mBAAmB,CAAC,CAAC,GAAG,WAAW,IAAI,OAAO,CAAC,gBAAgB,CAAC,GAAG;IAC7E,IAAI,CAAC,EAAE,CAAC,CAAA;CACT,GAAG,CAAC,gBAAgB,GAAG,sBAAsB,CAAC,GAC7C,mBAAmB,CAAA;AAsDrB,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,CAAC,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"rendering.d.ts","sourceRoot":"","sources":["../../src/dom/rendering.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,WAAW,CAAA;AAElD,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAIvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAG5C,MAAM,WAAW,mBAAmB;IAClC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,KAAK,MAAM,CAAA;IACtF,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,KAAK,GAAG,CAAA;IAC7D,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;IAC1E,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,KAAK,OAAO,CAAA;IAC5D,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,KAAK,IAAI,CAAA;CAC5D;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,MAAM,mBAAmB,CAAC,CAAC,GAAG,WAAW,IAAI,OAAO,CAAC,gBAAgB,CAAC,GAAG;IAC7E,IAAI,CAAC,EAAE,CAAC,CAAA;CACT,GAAG,CAAC,gBAAgB,GAAG,sBAAsB,CAAC,GAC7C,mBAAmB,CAAA;AAsDrB,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,CAAC,EAAE,mBAAmB,QAwFhH;AAID,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,WAAW,GAAG,gBAAgB,EACrC,UAAU,CAAC,EAAE,GAAG,EAChB,MAAM,CAAC,EAAE,mBAAmB,EAC5B,QAAQ,CAAC,EAAE,OAAO,eA0CnB;AAMD,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,CAAC,EAAE,mBAAmB,eAc9G;AAED,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,CAAC,EAAE,mBAAmB,EAAE,OAAO,UAAQ,UAW7G"}
|