@sitecore-feaas/clientside 0.4.0-alpha.1 → 0.4.0-alpha.11

package/scripts/build.js

@@ -17,7 +17,16 @@ function compile({ input, output, ...step }) {
     outfile: path.resolve(__dirname, '../' + output),
     bundle: true,
     write: false,
-    external: ['node:crypto', 'node-fetch', '_MAGIC_IMPORT_COMMENTS_ESBUILD_WORKAROUND__', 'react', 'react-dom', 'vm'],
+    external: [
+      'node:crypto',
+      'node-fetch',
+      '_MAGIC_IMPORT_COMMENTS_ESBUILD_WORKAROUND__',
+      'react',
+      'react-dom',
+      'vm',
+      '@sitecore/byoc',
+      '@sitecore/byoc/react'
+    ],
     ...step,
 
     minify: true,

package/scripts/test-setup.ts

@@ -1,2 +1 @@
-process.env.TESTING = 'true'
 export default function () {}

package/src/cdn.ts

@@ -14,7 +14,9 @@ export type FEAASCDNComponentParams = {
   component: string
   version?: string
 
-  /** @deprecated Use `cdn` instead */
+  /**
+   * @deprecated Use `cdn` instead.
+   */
   hostname?: string
 }
 export type FEAASCDNComponentSource = {
@@ -31,7 +33,9 @@ export interface FEAASCDNStylesheetParams {
   library: string
   revision?: 'staged' | 'published' | 'saved' | number
 
-  /** @deprecated Use `cdn` instead */
+  /**
+   * @deprecated Use `cdn` instead.
+   */
   hostname?: string
 }
 
@@ -109,7 +113,7 @@ export function getStylesheetURL(props: FEAASCDNStylesheetProps) {
     }
   }
   return `${props.cdn || props.hostname || DEFAULT_CDN_URL}/styles/${props.library}/${
-    props.revision || 'published'
+    props.revision == 'staged' ? 'staged' : props.revision == 'saved' ? 'saved' : 'published'
   }.css`
 }
 

package/src/components/FEAASComponent.tsx

@@ -214,7 +214,7 @@ export class FEAASComponent extends FEAASElement<FEAASComponentsProps, string> {
     }
 
     if (this.props.withStylesheet) {
-      var stylesheetPromise = loadStylesheetAllowStale({ ...this.props, revision: 'published' }).then(() => {
+      var stylesheetPromise = loadStylesheetAllowStale({ ...this.props }).then(() => {
         stylesheetPromise = null
         advanceIfEverythingIsReady()
       })
@@ -259,6 +259,7 @@ declare global {
     interface IntrinsicElements {
       'feaas-component': {
         data?: any
+        class?: string
         suppressHydrationWarning?: boolean
         template?: string
         instance?: string
@@ -288,4 +289,4 @@ declare global {
 }
 FEAASComponent.register('feaas-component')
 
-export { FEAASComponent as Component, FEAASComponentsProps as ComponentProps }
+export { FEAASComponent as Component, FEAASComponentsProps as ComponentProps }

package/src/components/FEAASElement.tsx

@@ -142,7 +142,6 @@ export class FEAASElement<Props = any, Payload = any> extends WebComponent {
   }
 
   log(...args: any) {
-    if (typeof process != 'undefined' && process.env.TESTING) return
     const format = args[0]
 
     if (

package/src/dom/stylesheet.ts

@@ -21,7 +21,13 @@ export function loadStylesheet(props: FEAASCDNStylesheetProps, callback?: Valida
   var foundStylesheet = findStylesheet(props) as HTMLStyleElement
   if (!foundStylesheet) {
     var createdStylesheet = createStylesheet(props)
+  } else {
+    if (foundStylesheet.tagName == 'LINK') {
+      callback(null, 'initial')
+      return Promise.resolve(foundStylesheet)
+    }
   }
+
   return fetchAndRevalidateStylesheet(props, (cssText, phase) => {
     if (createdStylesheet) {
       createdStylesheet.textContent = cssText
@@ -37,7 +43,10 @@ export function loadStylesheetAllowStale(props: FEAASCDNStylesheetProps) {
 }
 
 export function findStylesheet(props: FEAASCDNStylesheetProps) {
-  return document.head.querySelector(`style[data-href="${getStylesheetURL(props)}"]`)
+  return (
+    document.head.querySelector(`style[data-href="${getStylesheetURL(props)}"]`) ||
+    document.querySelector(`link[rel="stylesheet"][href="${getStylesheetURL(props)}"]`)
+  )
 }
 
 export function createStylesheet(props: FEAASCDNStylesheetProps) {

package/src/ui/FEAASPicker.tsx

@@ -40,9 +40,11 @@ export class FEAASPicker extends FEAASElement<FEAASPickerProps, typeof FEAASPick
   }
   render(
     { placeholder, context, mode, dialog, children, variant }: React.PropsWithChildren<FEAASPickerProps>,
-    { Picker, React, useLibrary, useSDK }: typeof FEAASPickerImports
+    { Picker, React, useContext, EnvironmentContext, useLibrary, useSDK, BYOC }: typeof FEAASPickerImports
   ) {
     const [renders, forceRender] = React.useReducer((c) => c + 1, 0)
+    const sdk = useSDK()
+    const env = useContext(EnvironmentContext)
     const collections = useLibrary('collections')
     const components = useLibrary('components')
     const datasources = useSDK('datasources')
@@ -50,26 +52,35 @@ export class FEAASPicker extends FEAASElement<FEAASPickerProps, typeof FEAASPick
     // @ts-ignore temporary workaround until we release all environments
     const rules = library.stylesheets?.first?.rules || library?.stylesheet?.styles
     const component = components.find((c) => c.id == context?.getAttribute('component'))
-    const componentName = context?.getAttribute('data-external-id')
-    const externalComponent = useSDK('externalComponents').find((c) => c.name == componentName)
+    const externalComponents = useSDK('externalComponents')
     var settings = context?.getAttribute('data')
     if (settings) {
       try {
         settings = JSON.parse(settings)
       } catch (e) {}
     }
+    if (context) {
+      var embedDefinition = sdk.ExternalComponent.getDefinition(context)
+      var isUnconfigured = embedDefinition && !embedDefinition.getConfiguration(context)
+      var externalComponent =
+        embedDefinition?.type == 'feaas'
+          ? components.find((c) => c.id == context.getAttribute('component'))
+          : BYOC?.getComponent(String(context.getAttribute('data-external-id')))
+    }
     return (
       <Picker
+        cdn={env.cdn}
         rules={rules}
         collections={collections}
         themeContext={context}
         placeholder={placeholder}
         component={component}
         embed={externalComponent}
+        externalComponents={externalComponents}
         datasources={datasources}
         data={settings}
         versionId={context?.getAttribute('version')}
-        mode={mode || (component || componentName ? 'context' : null)}
+        mode={mode || (isUnconfigured ? 'library' : externalComponent ? 'context' : null)}
         setAttribute={(context, attribute, value) => {
           if (attribute == 'data' && value) value = JSON.stringify(value)
           this.props.setAttribute(context, attribute, value)

package/src/ui/react.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+import * as BYOC from '@sitecore/byoc/react'
 import { HTMLNode, parseHTMLContent, renderHTMLContent } from '../dom/html.js'
 import { DataSettings } from '../utils/settings.js'
 import {
@@ -12,13 +13,13 @@ import {
   parseComponentSource,
   parseStylesheetSource
 } from './index.js'
-import * as BYOC from '@sitecore/byoc'
 export * from '../headless.js'
 export { External, FEAASExternalPropsObject, getComponent, linkComponents, registerComponent } from './FEAASExternal.js'
 export * from './index.js'
 export { renderHTMLContent }
 
 export type FEAASReactComponentProps = FEAASComponentProps & {
+  hydrate?: boolean
   preload?: boolean
   lastModified?: Date | string
 }
@@ -54,7 +55,6 @@ export const FEAASReactServerComponent = async ({ ...props }: FEAASReactComponen
 
     p.template = response.template
     p.lastModified = response.lastModified
-    //@ts-ignore
     p.hydrate = false
   }
 
@@ -104,11 +104,12 @@ export function FEAASReactComponent({ data, ...props }: FEAASReactComponentProps
         </>
       )}
       <feaas-component
+        class='-feaas'
         {...props}
+        hydrate={props.hydrate === false ? 'false' : null}
         suppressHydrationWarning
         template={null}
         data={typeof data == 'string' ? data : data ? JSON.stringify(data) : null}
-        hydrate={'false'}
       >
         {children}
       </feaas-component>

package/test/FEAASComponent.react.test.tsx

@@ -53,7 +53,7 @@ describe('React', () => {
       <section>
         <Component src='library/test'></Component>
       </section>,
-      '<section><feaas-component library="library" component="test" src="library/test" hydrate="false"></feaas-component></section>'
+      '<section><feaas-component class="-feaas" library="library" component="test" src="library/test"></feaas-component></section>'
     )
   })
   it('render react with empty template', async () => {
@@ -61,7 +61,7 @@ describe('React', () => {
       <section>
         <Component src='library/test' template=''></Component>
       </section>,
-      '<section><feaas-component library="library" component="test" src="library/test" hydrate="false"></feaas-component></section>'
+      '<section><feaas-component class="-feaas" library="library" component="test" src="library/test"></feaas-component></section>'
     )
   })
   it('render react component with src and overrides', async () => {
@@ -69,7 +69,7 @@ describe('React', () => {
       <section>
         <Component src='library/test' component='test2'></Component>
       </section>,
-      '<section><feaas-component library="library" component="test2" src="library/test" hydrate="false"></feaas-component></section>'
+      '<section><feaas-component class="-feaas" library="library" component="test2" src="library/test"></feaas-component></section>'
     )
   })
   it('render react component with extras', async () => {
@@ -77,7 +77,7 @@ describe('React', () => {
       <section>
         <Component src='library/test' version='v1'></Component>
       </section>,
-      '<section><feaas-component library="library" component="test" version="v1" src="library/test" hydrate="false"></feaas-component></section>'
+      '<section><feaas-component class="-feaas" library="library" component="test" version="v1" src="library/test"></feaas-component></section>'
     )
   })
   it('render react template', async () => {
@@ -85,7 +85,7 @@ describe('React', () => {
       <section>
         <Component src='library/test' template={'<div data-path-src="abc">'}></Component>
       </section>,
-      '<section><feaas-component library="library" component="test" src="library/test" hydrate="false"><div data-path-src="abc"></div></feaas-component></section>'
+      '<section><feaas-component class="-feaas" library="library" component="test" src="library/test"><div data-path-src="abc"></div></feaas-component></section>'
     )
   })
   it('render template with data and src', async () => {
@@ -93,7 +93,7 @@ describe('React', () => {
       <section>
         <Component src='library/test' template={'<div data-path-src="abc">'} data={{ abc: 321 }}></Component>
       </section>,
-      '<section><feaas-component library="library" component="test" src="library/test" data="{&quot;abc&quot;:321}" hydrate="false"><div data-path-src="abc"></div></feaas-component></section>'
+      '<section><feaas-component class="-feaas" library="library" component="test" src="library/test" data="{&quot;abc&quot;:321}"><div data-path-src="abc"></div></feaas-component></section>'
     )
   })
   it('render template with data but without src', async () => {
@@ -106,7 +106,7 @@ describe('React', () => {
           data={{ abc: 321 }}
         ></Component>
       </section>,
-      '<section><feaas-component library="library" component="test" data="{&quot;abc&quot;:321}" hydrate="false"><div data-path-src="abc"></div></feaas-component></section>'
+      '<section><feaas-component class="-feaas" library="library" component="test" data="{&quot;abc&quot;:321}"><div data-path-src="abc"></div></feaas-component></section>'
     )
   })
   it('render template with style attribute', async () => {
@@ -114,7 +114,7 @@ describe('React', () => {
       <section>
         <Component template={'<div data-path-src="abc">'} data={{ abc: 321 }}></Component>
       </section>,
-      '<section><feaas-component data="{&quot;abc&quot;:321}" hydrate="false"><div data-path-src="abc"></div></feaas-component></section>'
+      '<section><feaas-component class="-feaas" data="{&quot;abc&quot;:321}"><div data-path-src="abc"></div></feaas-component></section>'
     )
   })
   it('render unwrapped external component with stringified values', async () => {
@@ -137,7 +137,7 @@ describe('React', () => {
           data={{ abc: 321 }}
         ></Component>
       </section>,
-      '<section><feaas-component data="{&quot;abc&quot;:321}" hydrate="false"><feaas-external telephone="12345" first-name="Yarik" data-external-id="MyTestComponent" hydrate="false"><div>Hello my name is Yarik (string) and my tel is 12345 (number). And context value is DEFAULT</div></feaas-external></feaas-component></section>'
+      '<section><feaas-component class="-feaas" data="{&quot;abc&quot;:321}"><feaas-external telephone="12345" first-name="Yarik" data-external-id="MyTestComponent" hydrate="false"><div>Hello my name is Yarik (string) and my tel is 12345 (number). And context value is DEFAULT</div></feaas-external></feaas-component></section>'
     )
   })
   it('render wrapped external component with context provider', async () => {
@@ -153,7 +153,7 @@ describe('React', () => {
           ></Component>
         </section>
       </DataContext.Provider>,
-      '<section><feaas-component data="{&quot;abc&quot;:321}" hydrate="false"><feaas-external telephone="12345" first-name="Yarik" data-external-id="MyTestComponent" hydrate="false"><div>Hello my name is Yarik (string) and my tel is 12345 (number). And context value is INHERITED</div></feaas-external></feaas-component></section>'
+      '<section><feaas-component class="-feaas" data="{&quot;abc&quot;:321}"><feaas-external telephone="12345" first-name="Yarik" data-external-id="MyTestComponent" hydrate="false"><div>Hello my name is Yarik (string) and my tel is 12345 (number). And context value is INHERITED</div></feaas-external></feaas-component></section>'
     )
   })
   it('render wrapped external component with context provider and data mapping', async () => {
@@ -169,7 +169,7 @@ describe('React', () => {
           ></Component>
         </section>
       </DataContext.Provider>,
-      '<section><feaas-component data="{&quot;telephone&quot;:321}" hydrate="false"><feaas-external data-path-attributes="$" first-name="Yarik" telephone="321" data-attributes-keys="telephone" data-external-id="MyTestComponent" hydrate="false"><div>Hello my name is Yarik (string) and my tel is 321 (number). And context value is INHERITED</div></feaas-external></feaas-component></section>'
+      '<section><feaas-component class="-feaas" data="{&quot;telephone&quot;:321}"><feaas-external data-path-attributes="$" first-name="Yarik" telephone="321" data-attributes-keys="telephone" data-external-id="MyTestComponent" hydrate="false"><div>Hello my name is Yarik (string) and my tel is 321 (number). And context value is INHERITED</div></feaas-external></feaas-component></section>'
     )
   })
 })

package/test/FEAASComponent.test.tsx

@@ -73,6 +73,59 @@ describe('Components', () => {
     )
   })
 
+  it('should load component with proper stylesheet revision', async () => {
+    const spy = vi.spyOn(global, 'fetch')
+    spy.mockImplementation(async (url: string, options: Parameters<typeof fetch>[1] = {}) => {
+      if (url.match('http://a/components/b/c/d/1.html')) {
+        return new Response('TODAY', {
+          headers: {
+            date: now.toUTCString(),
+            'last-modified': earlier.toUTCString()
+          }
+        })
+      } else if (url.match('.css')) {
+        // Validate
+        return new Response(null, {
+          headers: {
+            date: now.toUTCString(),
+            'last-modified': earlier.toUTCString()
+          }
+        })
+      }
+    })
+
+    // Fixme change to production component
+    document.body.innerHTML =
+      '<feaas-component src="http://a/components/b/c/d/1.html"></feaas-component><feaas-component src="http://a/components/b/c/d/staged.html"></feaas-component>'
+
+    const component = document.body.firstElementChild as FEAASComponent
+    await expect(component.whenRendered).resolves.toEqual(component)
+    expect(document.head.querySelectorAll('style')[0].getAttribute('data-href')).toBe('http://a/styles/b/published.css')
+    expect(document.head.querySelectorAll('style')[1].getAttribute('data-href')).toBe('http://a/styles/b/staged.css')
+  })
+
+  it('should render component if stylesheet is statically embedded as link', async () => {
+    const spy = vi.spyOn(global, 'fetch')
+    spy.mockImplementation(async (url: string, options: Parameters<typeof fetch>[1] = {}) => {
+      if (url.match('http://a/components/b/c/d/1.html')) {
+        return new Response('TODAY', {
+          headers: {
+            date: now.toUTCString(),
+            'last-modified': earlier.toUTCString()
+          }
+        })
+      }
+    })
+
+    // Fixme change to production component
+    document.body.innerHTML =
+      '<feaas-component src="http://a/components/b/c/d/1.html"></feaas-component><link rel="stylesheet" href="http://a/styles/b/published.css" />'
+
+    const component = document.body.firstElementChild as FEAASComponent
+    await expect(component.whenRendered).resolves.toEqual(component)
+    expect(document.head.querySelectorAll('style').length).toBe(0)
+  })
+
   it('should revalidate cached component response', async () => {
     const spy = vi.spyOn(global, 'fetch')
     spy.mockImplementation(async (url: string, options: Parameters<typeof fetch>[1] = {}) => {

package/test/FEAASPicker.test.tsx

@@ -37,6 +37,8 @@ describe('React', function () {
       expect(spyLoad).toHaveBeenCalledTimes(1)
 
       expect(component.innerHTML).toContain('Picker')
+
+      document.body.innerHTML = ''
     })
   })
 })

package/test/FEAASStylesheet.test.tsx

@@ -71,14 +71,14 @@ describe('Stylesheet', () => {
   it('should invalidate stylesheet cache', async () => {
     const spy = vi.spyOn(global, 'fetch')
     spy.mockImplementation(async (url: string, options: Parameters<typeof fetch>[1] = {}) => {
-      if (url.match('CDN/styles/L/R.css') && options?.method != 'HEAD') {
+      if (url.match('CDN/styles/L/published.css') && options?.method != 'HEAD') {
         return new Response('TODAY {}', {
           headers: {
             date: earlier.toUTCString(),
             'last-modified': earlier.toUTCString()
           }
         })
-      } else if (url.match('CDN/styles/L/R.css') && options?.method == 'HEAD') {
+      } else if (url.match('CDN/styles/L/published.css') && options?.method == 'HEAD') {
         return new Response(null, {
           headers: {
             date: earlier.toUTCString(),
@@ -88,7 +88,7 @@ describe('Stylesheet', () => {
       }
     })
 
-    document.body.innerHTML = '<feaas-stylesheet library="L" cdn="CDN" revision="R"></feaas-stylesheet>'
+    document.body.innerHTML = '<feaas-stylesheet library="L" cdn="CDN" revision="published"></feaas-stylesheet>'
 
     const stylesheet = document.body.firstElementChild as FEAASStylesheet
 
@@ -100,7 +100,7 @@ describe('Stylesheet', () => {
   it('should update stylesheet while using stale cache', async () => {
     const spy = vi.spyOn(global, 'fetch')
     spy.mockImplementation(async (url: string, options: Parameters<typeof fetch>[1] = {}) => {
-      if (url.match('CDN/styles/L/R.css') && options?.method != 'HEAD' && options?.['cache'] != 'reload') {
+      if (url.match('CDN/styles/L/staged.css') && options?.method != 'HEAD' && options?.['cache'] != 'reload') {
         // Serve from cache
         return new Response('YESTERDAY {}', {
           headers: {
@@ -108,7 +108,7 @@ describe('Stylesheet', () => {
             'last-modified': earliest.toUTCString()
           }
         })
-      } else if (url.match('CDN/styles/L/R.css') && options?.method == 'HEAD') {
+      } else if (url.match('CDN/styles/L/staged.css') && options?.method == 'HEAD') {
         // Validate
         return new Response(null, {
           headers: {
@@ -126,7 +126,7 @@ describe('Stylesheet', () => {
       }
     })
 
-    document.body.innerHTML = '<feaas-stylesheet library="L" cdn="CDN" revision="R"></feaas-stylesheet>'
+    document.body.innerHTML = '<feaas-stylesheet library="L" cdn="CDN" revision="staged"></feaas-stylesheet>'
 
     const stylesheet = document.body.firstElementChild as FEAASStylesheet
 

package/test/ServerComponent.test.tsx

@@ -27,7 +27,7 @@ describe('React Server', () => {
 
     await validate(
       <>{Component}</>,
-      `<feaas-component library="library" component="test" src="library/test" hydrate="false" data="{&quot;data&quot;:&quot;1&quot;}">{"data": "1"}</feaas-component>`
+      `<feaas-component class="-feaas" library="library" component="test" src="library/test" hydrate="false" data="{&quot;data&quot;:&quot;1&quot;}">{"data": "1"}</feaas-component>`
     )
   })
   it('render with object data', async () => {
@@ -38,7 +38,7 @@ describe('React Server', () => {
     const Component = await ServerComponent({ src: 'library/test', data: { data: '2' } })
     await validate(
       <>{Component}</>,
-      `<feaas-component library="library" component="test" src="library/test" hydrate="false" data="{&quot;data&quot;:&quot;2&quot;}">Test</feaas-component>`
+      `<feaas-component class="-feaas" library="library" component="test" src="library/test" hydrate="false" data="{&quot;data&quot;:&quot;2&quot;}">Test</feaas-component>`
     )
   })
   it('pre-render data', async () => {
@@ -50,7 +50,7 @@ describe('React Server', () => {
     const Component = await ServerComponent({ src: 'library/test', data: { value: 0 } })
     await validate(
       <>{Component}</>,
-      `<feaas-component library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}">Hey: <var data-path="value">0</var>!</feaas-component>`
+      `<feaas-component class="-feaas" library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}">Hey: <var data-path="value">0</var>!</feaas-component>`
     )
   })
   it('pre-render data with style attribute', async () => {
@@ -64,7 +64,7 @@ describe('React Server', () => {
     const Component = await ServerComponent({ src: 'library/test', data: { value: 0 } })
     await validate(
       <>{Component}</>,
-      `<feaas-component library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p style="text-align: left; color: red;"><b style="cursor: 1;">Hey:</b> <var data-path="value">0</var>!</p></feaas-component>`
+      `<feaas-component class="-feaas" library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p style="text-align: left; color: red;"><b style="cursor: 1;">Hey:</b> <var data-path="value">0</var>!</p></feaas-component>`
     )
   })
   it('pre-render data with whitespace', async () => {
@@ -76,7 +76,7 @@ describe('React Server', () => {
     const Component = await ServerComponent({ src: 'library/test', data: { value: 0 } })
     await validate(
       <>{Component}</>,
-      `<feaas-component library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p>Test <b>Hey:</b> <i>Dawg</i> <var data-path="value">0</var>!</p></feaas-component>`
+      `<feaas-component class="-feaas" library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p>Test <b>Hey:</b> <i>Dawg</i> <var data-path="value">0</var>!</p></feaas-component>`
     )
   })
   it('render external component', async () => {
@@ -96,7 +96,7 @@ describe('React Server', () => {
     const Component = await ServerComponent({ src: 'library/test', data: { value: 0 } })
     await validate(
       <>{Component}</>,
-      `<feaas-component library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p>This?</p><feaas-external hydrate="false" data-external-id="test-server-external"><h1>My Component</h1></feaas-external></feaas-component>`
+      `<feaas-component class="-feaas" library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p>This?</p><feaas-external hydrate="false" data-external-id="test-server-external"><h1>My Component</h1></feaas-external></feaas-component>`
     )
   })
   it('render external component with context', async () => {
@@ -122,7 +122,7 @@ describe('React Server', () => {
       <Context.Provider value={{ test: 'cde' }}>
         <>{Component}</>
       </Context.Provider>,
-      `<feaas-component library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p>This?</p><feaas-external hydrate="false" data-external-id="test-server-external-context"><h1>My Component: cde</h1></feaas-external></feaas-component>`
+      `<feaas-component class="-feaas" library="library" component="test" src="library/test" hydrate="false" data="{&quot;value&quot;:0}"><p>This?</p><feaas-external hydrate="false" data-external-id="test-server-external-context"><h1>My Component: cde</h1></feaas-external></feaas-component>`
     )
   })
-})
+})

package/types/cdn.d.ts

@@ -6,7 +6,9 @@ export type FEAASCDNComponentParams = {
     library: string;
     component: string;
     version?: string;
-    /** @deprecated Use `cdn` instead */
+    /**
+     * @deprecated Use `cdn` instead.
+     */
     hostname?: string;
 };
 export type FEAASCDNComponentSource = {
@@ -20,7 +22,9 @@ export interface FEAASCDNStylesheetParams {
     cdn?: string;
     library: string;
     revision?: 'staged' | 'published' | 'saved' | number;
-    /** @deprecated Use `cdn` instead */
+    /**
+     * @deprecated Use `cdn` instead.
+     */
     hostname?: string;
 }
 export type FEAASCDNStylesheetSource = {
@@ -43,7 +47,9 @@ export declare function fetchComponent(props: FEAASCDNComponentProps | string):
     library: string;
     component: string;
     version?: string;
-    /** @deprecated Use `cdn` instead */
+    /**
+     * @deprecated Use `cdn` instead.
+     */
     hostname?: string;
     instance?: string;
 } | {

package/types/cdn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cdn.d.ts","sourceRoot":"","sources":["../src/cdn.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,uBAAuB,EACxB,MAAM,YAAY,CAAA;AAEnB,eAAO,MAAM,eAAe,wCAAwC,CAAA;AACpE,MAAM,MAAM,uBAAuB,GAAG;IACpC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,OAAO,GAAG,MAAM,CAAA;IACpD,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AACD,MAAM,MAAM,uBAAuB,GAAG;IACpC,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AACD,MAAM,MAAM,qCAAqC,GAAG;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AACD,MAAM,MAAM,sBAAsB,GAAG,CAAC,uBAAuB,GAAG,uBAAuB,CAAC,GACtF,qCAAqC,CAAA;AAEvC,MAAM,WAAW,wBAAwB;IACvC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,OAAO,GAAG,MAAM,CAAA;IAEpD,oCAAoC;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AACD,MAAM,MAAM,uBAAuB,GAAG,wBAAwB,GAAG,wBAAwB,GAAG,MAAM,CAAA;AAElG,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,MAAM,GAAG,uBAAuB,CAQ5E;AACD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,UAahE;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,UAIlE;AAED,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,MAAM,GAAG,wBAAwB,CAc9E;AACD,wBAAgB,eAAe,CAAC,KAAK,EAAE,sBAAsB,GAAG,MAAM,UAYrE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,uBAAuB,UAY9D;AAED,wBAAsB,2BAA2B,CAC/C,KAAK,EAAE,sBAAsB,EAC7B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,EACjC,cAAc,UAAQ,0HA+CvB;AAED,mCAAmC;AACnC,wBAAsB,cAAc,CAAC,KAAK,EAAE,sBAAsB,GAAG,MAAM;;;;;;;;IAxJzE,oCAAoC;;;;;;;;GAmKrC;AAED,MAAM,MAAM,6BAA6B,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAA;AACjG,wBAAsB,4BAA4B,CAChD,KAAK,EAAE,uBAAuB,EAC9B,QAAQ,EAAE,6BAA6B,qBAqBxC"}
+{"version":3,"file":"cdn.d.ts","sourceRoot":"","sources":["../src/cdn.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,uBAAuB,EACxB,MAAM,YAAY,CAAA;AAEnB,eAAO,MAAM,eAAe,wCAAwC,CAAA;AACpE,MAAM,MAAM,uBAAuB,GAAG;IACpC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,OAAO,GAAG,MAAM,CAAA;IACpD,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AACD,MAAM,MAAM,uBAAuB,GAAG;IACpC,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AACD,MAAM,MAAM,qCAAqC,GAAG;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AACD,MAAM,MAAM,sBAAsB,GAAG,CAAC,uBAAuB,GAAG,uBAAuB,CAAC,GACtF,qCAAqC,CAAA;AAEvC,MAAM,WAAW,wBAAwB;IACvC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,OAAO,GAAG,MAAM,CAAA;IAEpD;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AACD,MAAM,MAAM,uBAAuB,GAAG,wBAAwB,GAAG,wBAAwB,GAAG,MAAM,CAAA;AAElG,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,MAAM,GAAG,uBAAuB,CAQ5E;AACD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,UAahE;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,UAIlE;AAED,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,MAAM,GAAG,wBAAwB,CAc9E;AACD,wBAAgB,eAAe,CAAC,KAAK,EAAE,sBAAsB,GAAG,MAAM,UAYrE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,uBAAuB,UAY9D;AAED,wBAAsB,2BAA2B,CAC/C,KAAK,EAAE,sBAAsB,EAC7B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,EACjC,cAAc,UAAQ,0HA+CvB;AAED,mCAAmC;AACnC,wBAAsB,cAAc,CAAC,KAAK,EAAE,sBAAsB,GAAG,MAAM;;;;;;;;IA5JzE;;OAEG;;;;;;;;GAqKJ;AAED,MAAM,MAAM,6BAA6B,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAA;AACjG,wBAAsB,4BAA4B,CAChD,KAAK,EAAE,uBAAuB,EAC9B,QAAQ,EAAE,6BAA6B,qBAqBxC"}

package/types/components/FEAASComponent.d.ts

@@ -96,6 +96,7 @@ declare global {
         interface IntrinsicElements {
             'feaas-component': {
                 data?: any;
+                class?: string;
                 suppressHydrationWarning?: boolean;
                 template?: string;
                 instance?: string;

package/types/components/FEAASComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FEAASComponent.d.ts","sourceRoot":"","sources":["../../src/components/FEAASComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,WAAW,EAAgB,MAAM,sBAAsB,CAAA;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAEhD,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,YAAY;;;;;;;;;;;;;;EAkCzD;AAED,MAAM,MAAM,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAA;AAE1E;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBAAa,cAAe,SAAQ,YAAY,CAAC,oBAAoB,EAAE,MAAM,CAAC;IAC5E,SAAS,EAAE,GAAG,CAAK;IACnB,aAAa,yBAGZ;IAED,MAAM,CAAC,kBAAkB,WAYxB;IAED,YAAY;;;;;;;;;;;;;;OAQsB;IAElC,YAAY,EAAE,OAAO,CAAA;IAErB,OAAO,CAAC,IAAI,EAAE,WAAW;IAIzB,QAAQ;;;;;;;;;;;;;;;IAIR,eAAe,CAAC,IAAI,EAAE,MAAM,oBAAoB;IAIhD,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI;IAkB1E,SAAS;IAef,SAAS,IAAI,GAAG;;IAkBhB,IAAI;IASJ,WAAW;IAaX,aAAa;IAMb,MAAM,SAAU,MAAM,UAGrB;IAEK,IAAI;IAkCV,eAAe,EAAE,OAAO,CAAA;IAExB,KAAK;IAML,MAAM;CAcP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,iBAAiB,EAAE;gBACjB,IAAI,CAAC,EAAE,GAAG,CAAA;gBACV,wBAAwB,CAAC,EAAE,OAAO,CAAA;gBAClC,QAAQ,CAAC,EAAE,MAAM,CAAA;gBACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;gBACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;gBAClB,QAAQ,CAAC,EAAE,GAAG,CAAA;gBACd,uBAAuB,CAAC,EAAE;oBAAE,MAAM,EAAE,MAAM,CAAA;iBAAE,CAAA;gBAC5C,eAAe,CAAC,EAAE,MAAM,CAAA;gBACxB,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;gBAC1B,iBAAiB,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,EAAE,CAAA;aAC1C,GAAG,CACA;gBACE;;mBAEG;gBACH,QAAQ,CAAC,EAAE,MAAM,CAAA;gBACjB,GAAG,CAAC,EAAE,MAAM,CAAA;gBACZ,OAAO,EAAE,MAAM,CAAA;gBACf,SAAS,EAAE,MAAM,CAAA;gBACjB,OAAO,CAAC,EAAE,MAAM,CAAA;gBAChB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,UAAU,CAAC,CAAA;aAC5C,GACD;gBAAE,GAAG,EAAE,MAAM,CAAA;aAAE,GACf;gBAAE,QAAQ,EAAE,MAAM,CAAA;aAAE,CACvB,CAAA;SACF;KACF;CACF;AAGD,OAAO,EAAE,cAAc,IAAI,SAAS,EAAE,oBAAoB,IAAI,cAAc,EAAE,CAAA"}
+{"version":3,"file":"FEAASComponent.d.ts","sourceRoot":"","sources":["../../src/components/FEAASComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,WAAW,EAAgB,MAAM,sBAAsB,CAAA;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAEhD,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,YAAY;;;;;;;;;;;;;;EAkCzD;AAED,MAAM,MAAM,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAA;AAE1E;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBAAa,cAAe,SAAQ,YAAY,CAAC,oBAAoB,EAAE,MAAM,CAAC;IAC5E,SAAS,EAAE,GAAG,CAAK;IACnB,aAAa,yBAGZ;IAED,MAAM,CAAC,kBAAkB,WAYxB;IAED,YAAY;;;;;;;;;;;;;;OAQsB;IAElC,YAAY,EAAE,OAAO,CAAA;IAErB,OAAO,CAAC,IAAI,EAAE,WAAW;IAIzB,QAAQ;;;;;;;;;;;;;;;IAIR,eAAe,CAAC,IAAI,EAAE,MAAM,oBAAoB;IAIhD,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI;IAkB1E,SAAS;IAef,SAAS,IAAI,GAAG;;IAkBhB,IAAI;IASJ,WAAW;IAaX,aAAa;IAMb,MAAM,SAAU,MAAM,UAGrB;IAEK,IAAI;IAkCV,eAAe,EAAE,OAAO,CAAA;IAExB,KAAK;IAML,MAAM;CAcP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,iBAAiB,EAAE;gBACjB,IAAI,CAAC,EAAE,GAAG,CAAA;gBACV,KAAK,CAAC,EAAE,MAAM,CAAA;gBACd,wBAAwB,CAAC,EAAE,OAAO,CAAA;gBAClC,QAAQ,CAAC,EAAE,MAAM,CAAA;gBACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;gBACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;gBAClB,QAAQ,CAAC,EAAE,GAAG,CAAA;gBACd,uBAAuB,CAAC,EAAE;oBAAE,MAAM,EAAE,MAAM,CAAA;iBAAE,CAAA;gBAC5C,eAAe,CAAC,EAAE,MAAM,CAAA;gBACxB,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;gBAC1B,iBAAiB,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,EAAE,CAAA;aAC1C,GAAG,CACA;gBACE;;mBAEG;gBACH,QAAQ,CAAC,EAAE,MAAM,CAAA;gBACjB,GAAG,CAAC,EAAE,MAAM,CAAA;gBACZ,OAAO,EAAE,MAAM,CAAA;gBACf,SAAS,EAAE,MAAM,CAAA;gBACjB,OAAO,CAAC,EAAE,MAAM,CAAA;gBAChB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,UAAU,CAAC,CAAA;aAC5C,GACD;gBAAE,GAAG,EAAE,MAAM,CAAA;aAAE,GACf;gBAAE,QAAQ,EAAE,MAAM,CAAA;aAAE,CACvB,CAAA;SACF;KACF;CACF;AAGD,OAAO,EAAE,cAAc,IAAI,SAAS,EAAE,oBAAoB,IAAI,cAAc,EAAE,CAAA"}

package/types/components/FEAASElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FEAASElement.d.ts","sourceRoot":"","sources":["../../src/components/FEAASElement.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FEAASElement.d.ts","sourceRoot":"","sources":["../../src/components/FEAASElement.tsx"],"names":[],"mappings":"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"}

package/types/dom/stylesheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stylesheet.d.ts","sourceRoot":"","sources":["../../src/dom/stylesheet.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EAGvB,6BAA6B,EAC9B,MAAM,WAAW,CAAA;AAElB,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,uBAAuB,EAAE,KAAK,CAAC,EAAE,gBAAgB,oBAGxF;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,uBAAuB,EAAE,UAAU,CAAC,EAAE,gBAAgB,6BAKpG;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,uBAAuB,EAAE,QAAQ,CAAC,EAAE,6BAA6B,6BAWtG;AAED,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,uBAAuB,oBAItE;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,uBAAuB,WAE5D;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,uBAAuB,oBAM9D"}
+{"version":3,"file":"stylesheet.d.ts","sourceRoot":"","sources":["../../src/dom/stylesheet.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EAGvB,6BAA6B,EAC9B,MAAM,WAAW,CAAA;AAElB,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,uBAAuB,EAAE,KAAK,CAAC,EAAE,gBAAgB,oBAGxF;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,uBAAuB,EAAE,UAAU,CAAC,EAAE,gBAAgB,6BAKpG;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,uBAAuB,EAAE,QAAQ,CAAC,EAAE,6BAA6B,6BAiBtG;AAED,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,uBAAuB,oBAItE;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,uBAAuB,WAK5D;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,uBAAuB,oBAM9D"}

package/types/ui/FEAASPicker.d.ts

@@ -51,7 +51,7 @@ export declare class FEAASPicker extends FEAASElement<FEAASPickerProps, typeof F
     };
     load(): Promise<typeof FEAASPickerImports>;
     connectedCallback(): void;
-    render({ placeholder, context, mode, dialog, children, variant }: React.PropsWithChildren<FEAASPickerProps>, { Picker, React, useLibrary, useSDK }: typeof FEAASPickerImports): JSX.Element;
+    render({ placeholder, context, mode, dialog, children, variant }: React.PropsWithChildren<FEAASPickerProps>, { Picker, React, useContext, EnvironmentContext, useLibrary, useSDK, BYOC }: typeof FEAASPickerImports): JSX.Element;
 }
 declare global {
     namespace JSX {

package/types/ui/FEAASPicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FEAASPicker.d.ts","sourceRoot":"","sources":["../../src/ui/FEAASPicker.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,kBAAkB,MAAM,iCAAiC,CAAA;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAA;AAE5D,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC;;;;;;;;;;;uBAY5B,GAAG,EAAE,KAAK,IAAI;;;EAIjD;AACD,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAElE,qBAAa,WAAY,SAAQ,YAAY,CAAC,gBAAgB,EAAE,OAAO,kBAAkB,CAAC;IACxF,MAAM,CAAC,kBAAkB,WAAwE;IAEjG,YAAY;;;;;;;;;;;;;;OAEkB;IAE9B,QAAQ;;;;;;;;;;;;;;;IAIR,IAAI;IAGJ,iBAAiB;IAIjB,MAAM,CACJ,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,EACpG,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,EAAE,OAAO,kBAAkB;CA+CnE;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,cAAc,EAAE,OAAO,CAAC,OAAO,kBAAkB,CAAC,CAAA;SACnD;KACF;CACF;AAED,OAAO,EAAE,WAAW,IAAI,MAAM,EAAE,CAAA"}
+{"version":3,"file":"FEAASPicker.d.ts","sourceRoot":"","sources":["../../src/ui/FEAASPicker.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,kBAAkB,MAAM,iCAAiC,CAAA;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAA;AAE5D,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC;;;;;;;;;;;uBAY5B,GAAG,EAAE,KAAK,IAAI;;;EAIjD;AACD,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAElE,qBAAa,WAAY,SAAQ,YAAY,CAAC,gBAAgB,EAAE,OAAO,kBAAkB,CAAC;IACxF,MAAM,CAAC,kBAAkB,WAAwE;IAEjG,YAAY;;;;;;;;;;;;;;OAEkB;IAE9B,QAAQ;;;;;;;;;;;;;;;IAIR,IAAI;IAGJ,iBAAiB;IAIjB,MAAM,CACJ,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,EACpG,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,OAAO,kBAAkB;CA0DzG;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,cAAc,EAAE,OAAO,CAAC,OAAO,kBAAkB,CAAC,CAAA;SACnD;KACF;CACF;AAED,OAAO,EAAE,WAAW,IAAI,MAAM,EAAE,CAAA"}

package/types/ui/react.d.ts

@@ -1,12 +1,13 @@
 import React from 'react';
+import * as BYOC from '@sitecore/byoc/react';
 import { HTMLNode, renderHTMLContent } from '../dom/html.js';
 import { FEAASCDNStylesheetParams, FEAASCDNStylesheetSource, FEAASComponentProps } from './index.js';
-import * as BYOC from '@sitecore/byoc';
 export * from '../headless.js';
 export { External, FEAASExternalPropsObject, getComponent, linkComponents, registerComponent } from './FEAASExternal.js';
 export * from './index.js';
 export { renderHTMLContent };
 export type FEAASReactComponentProps = FEAASComponentProps & {
+    hydrate?: boolean;
     preload?: boolean;
     lastModified?: Date | string;
 };