@adhese/sdk-react 1.4.1 → 1.4.2

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @adhese/sdk-react
 
+## 1.4.2
+
+### Patch Changes
+
+- Updated dependencies [b178b64]
+  - @adhese/sdk@1.4.2
+
 ## 1.4.1
 
 ### Patch Changes

package/dist/AdheseSlot.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdheseSlot.js","sources":["../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { watch } from '@adhese/sdk-shared';\nimport { type HTMLAttributes, type ReactNode, useCallback, useId, useMemo } from 'react';\nimport { useAdheseSlot, useWatch } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n  /**\n   * Placeholder to be shown when the slot is not rendered yet.\n   */\n  placeholder?: ReactNode;\n  /**\n   * Callback to be called when the slot is created or disposed\n   */\n  onChange?(slot: Slot | null): void;\n  /**\n   * Inject custom React elements into the slot when it's rendered.\n   */\n  render?(slot: Slot): ReactNode;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'> & HTMLAttributes<HTMLDivElement>;\n\n/**\n * Component to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be\n * created when the containing element is available and the Adhese instance is available.\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n  onChange,\n  width,\n  height,\n  lazyLoading,\n  lazyLoadingOptions,\n  slot,\n  pluginOptions,\n  renderMode,\n  type,\n  setup,\n  parameters,\n  format,\n  id,\n  render,\n  placeholder,\n  style,\n  ...props\n}: AdheseSlotProps): ReactNode {\n  const reactId = useId().replaceAll(':', '');\n  const componentId = id ?? `slot-${reactId}`;\n\n  const slotState = useAdheseSlot(componentId, {\n    width,\n    height,\n    lazyLoading,\n    lazyLoadingOptions,\n    slot,\n    pluginOptions,\n    renderMode: render ? 'none' : renderMode,\n    type,\n    parameters,\n    format,\n    setup: useCallback(((context, hooks): void => {\n      setup?.(context, hooks);\n\n      watch(context, (newSlot) => {\n        onChange?.(newSlot);\n      }, { immediate: true, deep: true });\n    }) satisfies AdheseSlotOptions['setup'], [setup, onChange]),\n  });\n\n  const status = useWatch(slotState ? (): Slot['status'] => slotState.status : undefined);\n  const slotFormat = useWatch(slotState ? (): Slot['format'] => slotState.format : undefined);\n  const name = useWatch(slotState ? (): Slot['name'] => slotState.name : undefined);\n  const data = useWatch(slotState ? (): Slot['data'] => slotState.data : undefined, { deep: true });\n\n  const renderOutput = useMemo(() => slotState && data ? render?.(slotState) : placeholder, [slotState, render, placeholder, data]);\n\n  if (['error', 'empty'].includes(status ?? '')) {\n    return null;\n  }\n\n  return (\n    <div\n      data-name={name}\n      data-status={status}\n      data-format={slotFormat}\n      data-slot={slot}\n      id={componentId}\n      style={{\n        width,\n        height,\n        ...style,\n      }}\n      {...props}\n    >\n      {renderOutput}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AA8BO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA+B;AAC7B,QAAM,UAAU,MAAQ,EAAA,WAAW,KAAK,EAAE;AACpC,QAAA,cAAc,MAAM,QAAQ,OAAO;AAEnC,QAAA,YAAY,cAAc,aAAa;AAAA,IAC3C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY,SAAS,SAAS;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,YAAa,CAAC,SAAS,UAAgB;AAC5C,qCAAQ,SAAS;AAEX,YAAA,SAAS,CAAC,YAAY;AAC1B,6CAAW;AAAA,SACV,EAAE,WAAW,MAAM,MAAM,KAAM,CAAA;AAAA,IAAA,GACK,CAAC,OAAO,QAAQ,CAAC;AAAA,EAAA,CAC3D;AAED,QAAM,SAAS,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AACtF,QAAM,aAAa,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AAC1F,QAAM,OAAO,SAAS,YAAY,MAAoB,UAAU,OAAO,MAAS;AAC1E,QAAA,OAAO,SAAS,YAAY,MAAoB,UAAU,OAAO,QAAW,EAAE,MAAM,KAAM,CAAA;AAEhG,QAAM,eAAe,QAAQ,MAAM,aAAa,OAAO,iCAAS,aAAa,aAAa,CAAC,WAAW,QAAQ,aAAa,IAAI,CAAC;AAEhI,MAAI,CAAC,SAAS,OAAO,EAAE,SAAS,UAAU,EAAE,GAAG;AACtC,WAAA;AAAA,EACT;AAGE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,eAAa;AAAA,MACb,eAAa;AAAA,MACb,aAAW;AAAA,MACX,IAAI;AAAA,MACJ,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"AdheseSlot.js","sources":["../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { watch } from '@adhese/sdk-shared';\nimport { type HTMLAttributes, type ReactNode, useCallback, useId, useMemo } from 'react';\nimport { useAdheseSlot, useWatch } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n  /**\n   * Placeholder to be shown when the slot is not rendered yet.\n   */\n  placeholder?: ReactNode;\n  /**\n   * Callback to be called when the slot is created or disposed\n   */\n  onChange?(slot: Slot | null): void;\n  /**\n   * Inject custom React elements into the slot when it's rendered.\n   */\n  render?(slot: Slot): ReactNode;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'> & HTMLAttributes<HTMLDivElement>;\n\n/**\n * Component to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be\n * created when the containing element is available and the Adhese instance is available.\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n  onChange,\n  width,\n  height,\n  lazyLoading,\n  lazyLoadingOptions,\n  slot,\n  pluginOptions,\n  renderMode,\n  type,\n  setup,\n  parameters,\n  format,\n  id,\n  render,\n  placeholder,\n  style,\n  ...props\n}: AdheseSlotProps): ReactNode {\n  const reactId = useId().replaceAll(':', '');\n  const componentId = id ?? `slot-${reactId}`;\n\n  const slotState = useAdheseSlot(componentId, {\n    width,\n    height,\n    lazyLoading,\n    lazyLoadingOptions,\n    slot,\n    pluginOptions,\n    renderMode: render ? 'none' : renderMode,\n    type,\n    parameters,\n    format,\n    setup: useCallback(((context, hooks): void => {\n      setup?.(context, hooks);\n\n      watch(context, (newSlot) => {\n        onChange?.(newSlot);\n      }, { immediate: true, deep: true });\n    }) satisfies AdheseSlotOptions['setup'], [setup, onChange]),\n  });\n\n  const status = useWatch(slotState ? (): Slot['status'] => slotState.status : undefined);\n  const slotFormat = useWatch(slotState ? (): Slot['format'] => slotState.format : undefined);\n  const name = useWatch(slotState ? (): Slot['name'] => slotState.name : undefined);\n  const data = useWatch(slotState ? (): Slot['data'] => slotState.data : undefined, { deep: true });\n\n  const renderOutput = useMemo(() => slotState && data ? render?.(slotState) : placeholder, [slotState, render, placeholder, data]);\n\n  if (['error', 'empty'].includes(status ?? '')) {\n    return null;\n  }\n\n  return (\n    <div\n      data-name={name}\n      data-status={status}\n      data-format={slotFormat}\n      data-slot={slot}\n      id={componentId}\n      style={{\n        width,\n        height,\n        ...style,\n      }}\n      {...props}\n    >\n      {renderOutput}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AA8BO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA+B;AAC7B,QAAM,UAAU,MAAA,EAAQ,WAAW,KAAK,EAAE;AACpC,QAAA,cAAc,MAAM,QAAQ,OAAO;AAEnC,QAAA,YAAY,cAAc,aAAa;AAAA,IAC3C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY,SAAS,SAAS;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,YAAa,CAAC,SAAS,UAAgB;AAC5C,qCAAQ,SAAS;AAEX,YAAA,SAAS,CAAC,YAAY;AAC1B,6CAAW;AAAA,SACV,EAAE,WAAW,MAAM,MAAM,MAAM;AAAA,IAAA,GACK,CAAC,OAAO,QAAQ,CAAC;AAAA,EAAA,CAC3D;AAED,QAAM,SAAS,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AACtF,QAAM,aAAa,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AAC1F,QAAM,OAAO,SAAS,YAAY,MAAoB,UAAU,OAAO,MAAS;AAC1E,QAAA,OAAO,SAAS,YAAY,MAAoB,UAAU,OAAO,QAAW,EAAE,MAAM,MAAM;AAEhG,QAAM,eAAe,QAAQ,MAAM,aAAa,OAAO,iCAAS,aAAa,aAAa,CAAC,WAAW,QAAQ,aAAa,IAAI,CAAC;AAEhI,MAAI,CAAC,SAAS,OAAO,EAAE,SAAS,UAAU,EAAE,GAAG;AACtC,WAAA;AAAA,EAAA;AAIP,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,eAAa;AAAA,MACb,eAAa;AAAA,MACb,aAAW;AAAA,MACX,IAAI;AAAA,MACJ,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/adheseContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"adheseContext.js","sources":["../src/adheseContext.tsx"],"sourcesContent":["'use client';\n\nimport { type Adhese, type AdheseOptions, createAdhese } from '@adhese/sdk';\nimport {\n  createContext,\n  type PropsWithChildren,\n  type ReactElement,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\n\nconst adheseContext = createContext<Adhese | undefined>(undefined);\n\n/**\n * Provider to create an Adhese instance with the given options. Via the `useAdhese` hook, the Adhese instance can be\n * used in all child components.\n * @constructor\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseProvider({ children, options }: PropsWithChildren<{ options?: AdheseOptions }>): ReactElement {\n  const [adhese, setAdhese] = useState<Adhese | undefined>(undefined);\n\n  useEffect(() => {\n    let instance: Adhese | undefined;\n\n    if (!options)\n      return;\n\n    setAdhese((current) => {\n      instance = createAdhese(options);\n      current?.dispose();\n\n      return instance;\n    });\n\n    return (): void => {\n      instance?.dispose();\n    };\n  }, [options]);\n\n  return (\n    <adheseContext.Provider value={adhese}>\n      {children}\n    </adheseContext.Provider>\n  );\n}\n\n/**\n * Hook to get the Adhese instance from the nearest `AdheseProvider`. When the Adhese instance is not available yet, `null`\n */\nexport function useAdhese(): Adhese | undefined {\n  return useContext(adheseContext);\n}\n"],"names":[],"mappings":";;;AAYA,MAAM,gBAAgB,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAyE;AAClH,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6B,MAAS;AAElE,YAAU,MAAM;AACV,QAAA;AAEJ,QAAI,CAAC;AACH;AAEF,cAAU,CAAC,YAAY;AACrB,iBAAW,aAAa,OAAO;AAC/B,yCAAS;AAEF,aAAA;AAAA,IAAA,CACR;AAED,WAAO,MAAY;AACjB,2CAAU;AAAA,IAAQ;AAAA,EACpB,GACC,CAAC,OAAO,CAAC;AAEZ,6BACG,cAAc,UAAd,EAAuB,OAAO,QAC5B,SACH,CAAA;AAEJ;AAKO,SAAS,YAAgC;AAC9C,SAAO,WAAW,aAAa;AACjC;"}
+{"version":3,"file":"adheseContext.js","sources":["../src/adheseContext.tsx"],"sourcesContent":["'use client';\n\nimport { type Adhese, type AdheseOptions, createAdhese } from '@adhese/sdk';\nimport {\n  createContext,\n  type PropsWithChildren,\n  type ReactElement,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\n\nconst adheseContext = createContext<Adhese | undefined>(undefined);\n\n/**\n * Provider to create an Adhese instance with the given options. Via the `useAdhese` hook, the Adhese instance can be\n * used in all child components.\n * @constructor\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseProvider({ children, options }: PropsWithChildren<{ options?: AdheseOptions }>): ReactElement {\n  const [adhese, setAdhese] = useState<Adhese | undefined>(undefined);\n\n  useEffect(() => {\n    let instance: Adhese | undefined;\n\n    if (!options)\n      return;\n\n    setAdhese((current) => {\n      instance = createAdhese(options);\n      current?.dispose();\n\n      return instance;\n    });\n\n    return (): void => {\n      instance?.dispose();\n    };\n  }, [options]);\n\n  return (\n    <adheseContext.Provider value={adhese}>\n      {children}\n    </adheseContext.Provider>\n  );\n}\n\n/**\n * Hook to get the Adhese instance from the nearest `AdheseProvider`. When the Adhese instance is not available yet, `null`\n */\nexport function useAdhese(): Adhese | undefined {\n  return useContext(adheseContext);\n}\n"],"names":[],"mappings":";;;AAYA,MAAM,gBAAgB,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAyE;AAClH,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6B,MAAS;AAElE,YAAU,MAAM;AACV,QAAA;AAEJ,QAAI,CAAC;AACH;AAEF,cAAU,CAAC,YAAY;AACrB,iBAAW,aAAa,OAAO;AAC/B,yCAAS;AAEF,aAAA;AAAA,IAAA,CACR;AAED,WAAO,MAAY;AACjB,2CAAU;AAAA,IACZ;AAAA,EAAA,GACC,CAAC,OAAO,CAAC;AAEZ,6BACG,cAAc,UAAd,EAAuB,OAAO,QAC5B,UACH;AAEJ;AAKO,SAAS,YAAgC;AAC9C,SAAO,WAAW,aAAa;AACjC;"}

package/dist/cjs/AdheseSlot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AdheseSlot.cjs","sources":["../../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { watch } from '@adhese/sdk-shared';\nimport { type HTMLAttributes, type ReactNode, useCallback, useId, useMemo } from 'react';\nimport { useAdheseSlot, useWatch } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n  /**\n   * Placeholder to be shown when the slot is not rendered yet.\n   */\n  placeholder?: ReactNode;\n  /**\n   * Callback to be called when the slot is created or disposed\n   */\n  onChange?(slot: Slot | null): void;\n  /**\n   * Inject custom React elements into the slot when it's rendered.\n   */\n  render?(slot: Slot): ReactNode;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'> & HTMLAttributes<HTMLDivElement>;\n\n/**\n * Component to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be\n * created when the containing element is available and the Adhese instance is available.\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n  onChange,\n  width,\n  height,\n  lazyLoading,\n  lazyLoadingOptions,\n  slot,\n  pluginOptions,\n  renderMode,\n  type,\n  setup,\n  parameters,\n  format,\n  id,\n  render,\n  placeholder,\n  style,\n  ...props\n}: AdheseSlotProps): ReactNode {\n  const reactId = useId().replaceAll(':', '');\n  const componentId = id ?? `slot-${reactId}`;\n\n  const slotState = useAdheseSlot(componentId, {\n    width,\n    height,\n    lazyLoading,\n    lazyLoadingOptions,\n    slot,\n    pluginOptions,\n    renderMode: render ? 'none' : renderMode,\n    type,\n    parameters,\n    format,\n    setup: useCallback(((context, hooks): void => {\n      setup?.(context, hooks);\n\n      watch(context, (newSlot) => {\n        onChange?.(newSlot);\n      }, { immediate: true, deep: true });\n    }) satisfies AdheseSlotOptions['setup'], [setup, onChange]),\n  });\n\n  const status = useWatch(slotState ? (): Slot['status'] => slotState.status : undefined);\n  const slotFormat = useWatch(slotState ? (): Slot['format'] => slotState.format : undefined);\n  const name = useWatch(slotState ? (): Slot['name'] => slotState.name : undefined);\n  const data = useWatch(slotState ? (): Slot['data'] => slotState.data : undefined, { deep: true });\n\n  const renderOutput = useMemo(() => slotState && data ? render?.(slotState) : placeholder, [slotState, render, placeholder, data]);\n\n  if (['error', 'empty'].includes(status ?? '')) {\n    return null;\n  }\n\n  return (\n    <div\n      data-name={name}\n      data-status={status}\n      data-format={slotFormat}\n      data-slot={slot}\n      id={componentId}\n      style={{\n        width,\n        height,\n        ...style,\n      }}\n      {...props}\n    >\n      {renderOutput}\n    </div>\n  );\n}\n"],"names":["useId","useAdheseSlot","useCallback","watch","useWatch","useMemo","jsx"],"mappings":";;;;;;AA8BO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA+B;AAC7B,QAAM,UAAUA,MAAAA,MAAQ,EAAA,WAAW,KAAK,EAAE;AACpC,QAAA,cAAc,MAAM,QAAQ,OAAO;AAEnC,QAAA,YAAYC,4BAAc,aAAa;AAAA,IAC3C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY,SAAS,SAAS;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAOC,MAAA,YAAa,CAAC,SAAS,UAAgB;AAC5C,qCAAQ,SAAS;AAEXC,sBAAA,SAAS,CAAC,YAAY;AAC1B,6CAAW;AAAA,SACV,EAAE,WAAW,MAAM,MAAM,KAAM,CAAA;AAAA,IAAA,GACK,CAAC,OAAO,QAAQ,CAAC;AAAA,EAAA,CAC3D;AAED,QAAM,SAASC,cAAAA,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AACtF,QAAM,aAAaA,cAAAA,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AAC1F,QAAM,OAAOA,cAAAA,SAAS,YAAY,MAAoB,UAAU,OAAO,MAAS;AAC1E,QAAA,OAAOA,cAAAA,SAAS,YAAY,MAAoB,UAAU,OAAO,QAAW,EAAE,MAAM,KAAM,CAAA;AAEhG,QAAM,eAAeC,MAAA,QAAQ,MAAM,aAAa,OAAO,iCAAS,aAAa,aAAa,CAAC,WAAW,QAAQ,aAAa,IAAI,CAAC;AAEhI,MAAI,CAAC,SAAS,OAAO,EAAE,SAAS,UAAU,EAAE,GAAG;AACtC,WAAA;AAAA,EACT;AAGE,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,eAAa;AAAA,MACb,eAAa;AAAA,MACb,aAAW;AAAA,MACX,IAAI;AAAA,MACJ,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;;"}
+{"version":3,"file":"AdheseSlot.cjs","sources":["../../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { watch } from '@adhese/sdk-shared';\nimport { type HTMLAttributes, type ReactNode, useCallback, useId, useMemo } from 'react';\nimport { useAdheseSlot, useWatch } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n  /**\n   * Placeholder to be shown when the slot is not rendered yet.\n   */\n  placeholder?: ReactNode;\n  /**\n   * Callback to be called when the slot is created or disposed\n   */\n  onChange?(slot: Slot | null): void;\n  /**\n   * Inject custom React elements into the slot when it's rendered.\n   */\n  render?(slot: Slot): ReactNode;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'> & HTMLAttributes<HTMLDivElement>;\n\n/**\n * Component to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be\n * created when the containing element is available and the Adhese instance is available.\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n  onChange,\n  width,\n  height,\n  lazyLoading,\n  lazyLoadingOptions,\n  slot,\n  pluginOptions,\n  renderMode,\n  type,\n  setup,\n  parameters,\n  format,\n  id,\n  render,\n  placeholder,\n  style,\n  ...props\n}: AdheseSlotProps): ReactNode {\n  const reactId = useId().replaceAll(':', '');\n  const componentId = id ?? `slot-${reactId}`;\n\n  const slotState = useAdheseSlot(componentId, {\n    width,\n    height,\n    lazyLoading,\n    lazyLoadingOptions,\n    slot,\n    pluginOptions,\n    renderMode: render ? 'none' : renderMode,\n    type,\n    parameters,\n    format,\n    setup: useCallback(((context, hooks): void => {\n      setup?.(context, hooks);\n\n      watch(context, (newSlot) => {\n        onChange?.(newSlot);\n      }, { immediate: true, deep: true });\n    }) satisfies AdheseSlotOptions['setup'], [setup, onChange]),\n  });\n\n  const status = useWatch(slotState ? (): Slot['status'] => slotState.status : undefined);\n  const slotFormat = useWatch(slotState ? (): Slot['format'] => slotState.format : undefined);\n  const name = useWatch(slotState ? (): Slot['name'] => slotState.name : undefined);\n  const data = useWatch(slotState ? (): Slot['data'] => slotState.data : undefined, { deep: true });\n\n  const renderOutput = useMemo(() => slotState && data ? render?.(slotState) : placeholder, [slotState, render, placeholder, data]);\n\n  if (['error', 'empty'].includes(status ?? '')) {\n    return null;\n  }\n\n  return (\n    <div\n      data-name={name}\n      data-status={status}\n      data-format={slotFormat}\n      data-slot={slot}\n      id={componentId}\n      style={{\n        width,\n        height,\n        ...style,\n      }}\n      {...props}\n    >\n      {renderOutput}\n    </div>\n  );\n}\n"],"names":["useId","useAdheseSlot","useCallback","watch","useWatch","useMemo","jsx"],"mappings":";;;;;;AA8BO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA+B;AAC7B,QAAM,UAAUA,MAAA,MAAA,EAAQ,WAAW,KAAK,EAAE;AACpC,QAAA,cAAc,MAAM,QAAQ,OAAO;AAEnC,QAAA,YAAYC,4BAAc,aAAa;AAAA,IAC3C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY,SAAS,SAAS;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAOC,MAAA,YAAa,CAAC,SAAS,UAAgB;AAC5C,qCAAQ,SAAS;AAEXC,sBAAA,SAAS,CAAC,YAAY;AAC1B,6CAAW;AAAA,SACV,EAAE,WAAW,MAAM,MAAM,MAAM;AAAA,IAAA,GACK,CAAC,OAAO,QAAQ,CAAC;AAAA,EAAA,CAC3D;AAED,QAAM,SAASC,cAAAA,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AACtF,QAAM,aAAaA,cAAAA,SAAS,YAAY,MAAsB,UAAU,SAAS,MAAS;AAC1F,QAAM,OAAOA,cAAAA,SAAS,YAAY,MAAoB,UAAU,OAAO,MAAS;AAC1E,QAAA,OAAOA,cAAAA,SAAS,YAAY,MAAoB,UAAU,OAAO,QAAW,EAAE,MAAM,MAAM;AAEhG,QAAM,eAAeC,MAAA,QAAQ,MAAM,aAAa,OAAO,iCAAS,aAAa,aAAa,CAAC,WAAW,QAAQ,aAAa,IAAI,CAAC;AAEhI,MAAI,CAAC,SAAS,OAAO,EAAE,SAAS,UAAU,EAAE,GAAG;AACtC,WAAA;AAAA,EAAA;AAIP,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,eAAa;AAAA,MACb,eAAa;AAAA,MACb,aAAW;AAAA,MACX,IAAI;AAAA,MACJ,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EACH;AAEJ;;"}

package/dist/cjs/adheseContext.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"adheseContext.cjs","sources":["../../src/adheseContext.tsx"],"sourcesContent":["'use client';\n\nimport { type Adhese, type AdheseOptions, createAdhese } from '@adhese/sdk';\nimport {\n  createContext,\n  type PropsWithChildren,\n  type ReactElement,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\n\nconst adheseContext = createContext<Adhese | undefined>(undefined);\n\n/**\n * Provider to create an Adhese instance with the given options. Via the `useAdhese` hook, the Adhese instance can be\n * used in all child components.\n * @constructor\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseProvider({ children, options }: PropsWithChildren<{ options?: AdheseOptions }>): ReactElement {\n  const [adhese, setAdhese] = useState<Adhese | undefined>(undefined);\n\n  useEffect(() => {\n    let instance: Adhese | undefined;\n\n    if (!options)\n      return;\n\n    setAdhese((current) => {\n      instance = createAdhese(options);\n      current?.dispose();\n\n      return instance;\n    });\n\n    return (): void => {\n      instance?.dispose();\n    };\n  }, [options]);\n\n  return (\n    <adheseContext.Provider value={adhese}>\n      {children}\n    </adheseContext.Provider>\n  );\n}\n\n/**\n * Hook to get the Adhese instance from the nearest `AdheseProvider`. When the Adhese instance is not available yet, `null`\n */\nexport function useAdhese(): Adhese | undefined {\n  return useContext(adheseContext);\n}\n"],"names":["createContext","useState","useEffect","createAdhese","useContext"],"mappings":";;;;;AAYA,MAAM,gBAAgBA,MAAAA,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAyE;AAClH,QAAM,CAAC,QAAQ,SAAS,IAAIC,MAAAA,SAA6B,MAAS;AAElEC,QAAAA,UAAU,MAAM;AACV,QAAA;AAEJ,QAAI,CAAC;AACH;AAEF,cAAU,CAAC,YAAY;AACrB,iBAAWC,IAAAA,aAAa,OAAO;AAC/B,yCAAS;AAEF,aAAA;AAAA,IAAA,CACR;AAED,WAAO,MAAY;AACjB,2CAAU;AAAA,IAAQ;AAAA,EACpB,GACC,CAAC,OAAO,CAAC;AAEZ,wCACG,cAAc,UAAd,EAAuB,OAAO,QAC5B,SACH,CAAA;AAEJ;AAKO,SAAS,YAAgC;AAC9C,SAAOC,MAAAA,WAAW,aAAa;AACjC;;;"}
+{"version":3,"file":"adheseContext.cjs","sources":["../../src/adheseContext.tsx"],"sourcesContent":["'use client';\n\nimport { type Adhese, type AdheseOptions, createAdhese } from '@adhese/sdk';\nimport {\n  createContext,\n  type PropsWithChildren,\n  type ReactElement,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\n\nconst adheseContext = createContext<Adhese | undefined>(undefined);\n\n/**\n * Provider to create an Adhese instance with the given options. Via the `useAdhese` hook, the Adhese instance can be\n * used in all child components.\n * @constructor\n */\n// eslint-disable-next-line ts/naming-convention\nexport function AdheseProvider({ children, options }: PropsWithChildren<{ options?: AdheseOptions }>): ReactElement {\n  const [adhese, setAdhese] = useState<Adhese | undefined>(undefined);\n\n  useEffect(() => {\n    let instance: Adhese | undefined;\n\n    if (!options)\n      return;\n\n    setAdhese((current) => {\n      instance = createAdhese(options);\n      current?.dispose();\n\n      return instance;\n    });\n\n    return (): void => {\n      instance?.dispose();\n    };\n  }, [options]);\n\n  return (\n    <adheseContext.Provider value={adhese}>\n      {children}\n    </adheseContext.Provider>\n  );\n}\n\n/**\n * Hook to get the Adhese instance from the nearest `AdheseProvider`. When the Adhese instance is not available yet, `null`\n */\nexport function useAdhese(): Adhese | undefined {\n  return useContext(adheseContext);\n}\n"],"names":["createContext","useState","useEffect","createAdhese","useContext"],"mappings":";;;;;AAYA,MAAM,gBAAgBA,MAAAA,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAyE;AAClH,QAAM,CAAC,QAAQ,SAAS,IAAIC,eAA6B,MAAS;AAElEC,QAAAA,UAAU,MAAM;AACV,QAAA;AAEJ,QAAI,CAAC;AACH;AAEF,cAAU,CAAC,YAAY;AACrB,iBAAWC,iBAAa,OAAO;AAC/B,yCAAS;AAEF,aAAA;AAAA,IAAA,CACR;AAED,WAAO,MAAY;AACjB,2CAAU;AAAA,IACZ;AAAA,EAAA,GACC,CAAC,OAAO,CAAC;AAEZ,wCACG,cAAc,UAAd,EAAuB,OAAO,QAC5B,UACH;AAEJ;AAKO,SAAS,YAAgC;AAC9C,SAAOC,MAAAA,WAAW,aAAa;AACjC;;;"}

package/dist/cjs/useAdheseSlot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useAdheseSlot.cjs","sources":["../../src/useAdheseSlot.ts"],"sourcesContent":["import type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport { generateSlotSignature, watch, type WatchHandle, type WatchOptions } from '@adhese/sdk-shared';\nimport {\n  type RefObject,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { useAdhese } from './adheseContext';\n\n/**\n * Hook to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be created\n * when the containing element is available and the Adhese instance is available.\n * @param elementRef The ref to the containing element\n * @param options The options to create the slot\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement> | string, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n  const adhese = useAdhese();\n\n  const slotSignature = useMemo(() => (adhese?.location) && generateSlotSignature({\n    location: adhese.location,\n    format: options.format,\n    parameters: options.parameters,\n    slot: options.slot,\n  }), [adhese?.location, options.format, options.slot]);\n\n  const [slot, setSlot] = useState<AdheseSlot | null>(null);\n\n  useLayoutEffect(() => {\n    const element = typeof elementRef === 'string' ? elementRef : elementRef.current;\n\n    if (adhese && element) {\n      setSlot(adhese?.addSlot({\n        ...options,\n        containingElement: element,\n      }));\n    }\n\n    return (): void => {\n      setSlot(null);\n    };\n  }, [adhese, ...Object.values(options), slotSignature]);\n\n  return slot;\n}\n\n/**\n * Hook that will observe a value on a reactive object and convert to React state\n */\nexport function useWatch<\n  Input,\n  Output = Input extends () => unknown ? ReturnType<Input> | undefined : Input | undefined,\n>(value?: Input, options?: Omit<WatchOptions, 'immediate'>): Output {\n  const [state, setState] = useState<Output>(typeof value === 'function' ? value() : value);\n\n  useLayoutEffect(() => {\n    let handle: WatchHandle | undefined;\n\n    if (value) {\n      handle = watch(value, (newValue) => {\n        setState(newValue as Output);\n      }, { immediate: true, ...options });\n    }\n\n    return (): void => {\n      handle?.stop();\n    };\n  }, [value]);\n\n  return state;\n}\n"],"names":["useAdhese","useMemo","generateSlotSignature","useState","useLayoutEffect","watch"],"mappings":";;;;;AAmBgB,SAAA,cAAc,YAA6C,SAAsF;AAC/J,QAAM,SAASA,cAAAA;AAEf,QAAM,gBAAgBC,MAAA,QAAQ,OAAO,iCAAQ,aAAaC,UAAAA,sBAAsB;AAAA,IAC9E,UAAU,OAAO;AAAA,IACjB,QAAQ,QAAQ;AAAA,IAChB,YAAY,QAAQ;AAAA,IACpB,MAAM,QAAQ;AAAA,EAAA,CACf,GAAG,CAAC,iCAAQ,UAAU,QAAQ,QAAQ,QAAQ,IAAI,CAAC;AAEpD,QAAM,CAAC,MAAM,OAAO,IAAIC,eAA4B,IAAI;AAExDC,QAAAA,gBAAgB,MAAM;AACpB,UAAM,UAAU,OAAO,eAAe,WAAW,aAAa,WAAW;AAEzE,QAAI,UAAU,SAAS;AACrB,cAAQ,iCAAQ,QAAQ;AAAA,QACtB,GAAG;AAAA,QACH,mBAAmB;AAAA,MACpB,EAAC;AAAA,IACJ;AAEA,WAAO,MAAY;AACjB,cAAQ,IAAI;AAAA,IAAA;AAAA,EACd,GACC,CAAC,QAAQ,GAAG,OAAO,OAAO,OAAO,GAAG,aAAa,CAAC;AAE9C,SAAA;AACT;AAKgB,SAAA,SAGd,OAAe,SAAmD;AAC5D,QAAA,CAAC,OAAO,QAAQ,IAAID,MAAA,SAAiB,OAAO,UAAU,aAAa,UAAU,KAAK;AAExFC,QAAAA,gBAAgB,MAAM;AAChB,QAAA;AAEJ,QAAI,OAAO;AACA,eAAAC,UAAA,MAAM,OAAO,CAAC,aAAa;AAClC,iBAAS,QAAkB;AAAA,SAC1B,EAAE,WAAW,MAAM,GAAG,QAAS,CAAA;AAAA,IACpC;AAEA,WAAO,MAAY;AACjB,uCAAQ;AAAA,IAAK;AAAA,EACf,GACC,CAAC,KAAK,CAAC;AAEH,SAAA;AACT;;;"}
+{"version":3,"file":"useAdheseSlot.cjs","sources":["../../src/useAdheseSlot.ts"],"sourcesContent":["import type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport { generateSlotSignature, watch, type WatchHandle, type WatchOptions } from '@adhese/sdk-shared';\nimport {\n  type RefObject,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { useAdhese } from './adheseContext';\n\n/**\n * Hook to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be created\n * when the containing element is available and the Adhese instance is available.\n * @param elementRef The ref to the containing element\n * @param options The options to create the slot\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement> | string, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n  const adhese = useAdhese();\n\n  const slotSignature = useMemo(() => (adhese?.location) && generateSlotSignature({\n    location: adhese.location,\n    format: options.format,\n    parameters: options.parameters,\n    slot: options.slot,\n  }), [adhese?.location, options.format, options.slot]);\n\n  const [slot, setSlot] = useState<AdheseSlot | null>(null);\n\n  useLayoutEffect(() => {\n    const element = typeof elementRef === 'string' ? elementRef : elementRef.current;\n\n    if (adhese && element) {\n      setSlot(adhese?.addSlot({\n        ...options,\n        containingElement: element,\n      }));\n    }\n\n    return (): void => {\n      setSlot(null);\n    };\n  }, [adhese, ...Object.values(options), slotSignature]);\n\n  return slot;\n}\n\n/**\n * Hook that will observe a value on a reactive object and convert to React state\n */\nexport function useWatch<\n  Input,\n  Output = Input extends () => unknown ? ReturnType<Input> | undefined : Input | undefined,\n>(value?: Input, options?: Omit<WatchOptions, 'immediate'>): Output {\n  const [state, setState] = useState<Output>(typeof value === 'function' ? value() : value);\n\n  useLayoutEffect(() => {\n    let handle: WatchHandle | undefined;\n\n    if (value) {\n      handle = watch(value, (newValue) => {\n        setState(newValue as Output);\n      }, { immediate: true, ...options });\n    }\n\n    return (): void => {\n      handle?.stop();\n    };\n  }, [value]);\n\n  return state;\n}\n"],"names":["useAdhese","useMemo","generateSlotSignature","useState","useLayoutEffect","watch"],"mappings":";;;;;AAmBgB,SAAA,cAAc,YAA6C,SAAsF;AAC/J,QAAM,SAASA,cAAAA,UAAU;AAEzB,QAAM,gBAAgBC,MAAA,QAAQ,OAAO,iCAAQ,aAAaC,UAAAA,sBAAsB;AAAA,IAC9E,UAAU,OAAO;AAAA,IACjB,QAAQ,QAAQ;AAAA,IAChB,YAAY,QAAQ;AAAA,IACpB,MAAM,QAAQ;AAAA,EAAA,CACf,GAAG,CAAC,iCAAQ,UAAU,QAAQ,QAAQ,QAAQ,IAAI,CAAC;AAEpD,QAAM,CAAC,MAAM,OAAO,IAAIC,MAAAA,SAA4B,IAAI;AAExDC,QAAAA,gBAAgB,MAAM;AACpB,UAAM,UAAU,OAAO,eAAe,WAAW,aAAa,WAAW;AAEzE,QAAI,UAAU,SAAS;AACrB,cAAQ,iCAAQ,QAAQ;AAAA,QACtB,GAAG;AAAA,QACH,mBAAmB;AAAA,MAAA,EACnB;AAAA,IAAA;AAGJ,WAAO,MAAY;AACjB,cAAQ,IAAI;AAAA,IACd;AAAA,EAAA,GACC,CAAC,QAAQ,GAAG,OAAO,OAAO,OAAO,GAAG,aAAa,CAAC;AAE9C,SAAA;AACT;AAKgB,SAAA,SAGd,OAAe,SAAmD;AAC5D,QAAA,CAAC,OAAO,QAAQ,IAAID,MAAA,SAAiB,OAAO,UAAU,aAAa,MAAM,IAAI,KAAK;AAExFC,QAAAA,gBAAgB,MAAM;AAChB,QAAA;AAEJ,QAAI,OAAO;AACA,eAAAC,UAAA,MAAM,OAAO,CAAC,aAAa;AAClC,iBAAS,QAAkB;AAAA,SAC1B,EAAE,WAAW,MAAM,GAAG,SAAS;AAAA,IAAA;AAGpC,WAAO,MAAY;AACjB,uCAAQ;AAAA,IACV;AAAA,EAAA,GACC,CAAC,KAAK,CAAC;AAEH,SAAA;AACT;;;"}

package/dist/useAdheseSlot.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAdheseSlot.js","sources":["../src/useAdheseSlot.ts"],"sourcesContent":["import type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport { generateSlotSignature, watch, type WatchHandle, type WatchOptions } from '@adhese/sdk-shared';\nimport {\n  type RefObject,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { useAdhese } from './adheseContext';\n\n/**\n * Hook to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be created\n * when the containing element is available and the Adhese instance is available.\n * @param elementRef The ref to the containing element\n * @param options The options to create the slot\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement> | string, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n  const adhese = useAdhese();\n\n  const slotSignature = useMemo(() => (adhese?.location) && generateSlotSignature({\n    location: adhese.location,\n    format: options.format,\n    parameters: options.parameters,\n    slot: options.slot,\n  }), [adhese?.location, options.format, options.slot]);\n\n  const [slot, setSlot] = useState<AdheseSlot | null>(null);\n\n  useLayoutEffect(() => {\n    const element = typeof elementRef === 'string' ? elementRef : elementRef.current;\n\n    if (adhese && element) {\n      setSlot(adhese?.addSlot({\n        ...options,\n        containingElement: element,\n      }));\n    }\n\n    return (): void => {\n      setSlot(null);\n    };\n  }, [adhese, ...Object.values(options), slotSignature]);\n\n  return slot;\n}\n\n/**\n * Hook that will observe a value on a reactive object and convert to React state\n */\nexport function useWatch<\n  Input,\n  Output = Input extends () => unknown ? ReturnType<Input> | undefined : Input | undefined,\n>(value?: Input, options?: Omit<WatchOptions, 'immediate'>): Output {\n  const [state, setState] = useState<Output>(typeof value === 'function' ? value() : value);\n\n  useLayoutEffect(() => {\n    let handle: WatchHandle | undefined;\n\n    if (value) {\n      handle = watch(value, (newValue) => {\n        setState(newValue as Output);\n      }, { immediate: true, ...options });\n    }\n\n    return (): void => {\n      handle?.stop();\n    };\n  }, [value]);\n\n  return state;\n}\n"],"names":[],"mappings":";;;AAmBgB,SAAA,cAAc,YAA6C,SAAsF;AAC/J,QAAM,SAAS;AAEf,QAAM,gBAAgB,QAAQ,OAAO,iCAAQ,aAAa,sBAAsB;AAAA,IAC9E,UAAU,OAAO;AAAA,IACjB,QAAQ,QAAQ;AAAA,IAChB,YAAY,QAAQ;AAAA,IACpB,MAAM,QAAQ;AAAA,EAAA,CACf,GAAG,CAAC,iCAAQ,UAAU,QAAQ,QAAQ,QAAQ,IAAI,CAAC;AAEpD,QAAM,CAAC,MAAM,OAAO,IAAI,SAA4B,IAAI;AAExD,kBAAgB,MAAM;AACpB,UAAM,UAAU,OAAO,eAAe,WAAW,aAAa,WAAW;AAEzE,QAAI,UAAU,SAAS;AACrB,cAAQ,iCAAQ,QAAQ;AAAA,QACtB,GAAG;AAAA,QACH,mBAAmB;AAAA,MACpB,EAAC;AAAA,IACJ;AAEA,WAAO,MAAY;AACjB,cAAQ,IAAI;AAAA,IAAA;AAAA,EACd,GACC,CAAC,QAAQ,GAAG,OAAO,OAAO,OAAO,GAAG,aAAa,CAAC;AAE9C,SAAA;AACT;AAKgB,SAAA,SAGd,OAAe,SAAmD;AAC5D,QAAA,CAAC,OAAO,QAAQ,IAAI,SAAiB,OAAO,UAAU,aAAa,UAAU,KAAK;AAExF,kBAAgB,MAAM;AAChB,QAAA;AAEJ,QAAI,OAAO;AACA,eAAA,MAAM,OAAO,CAAC,aAAa;AAClC,iBAAS,QAAkB;AAAA,SAC1B,EAAE,WAAW,MAAM,GAAG,QAAS,CAAA;AAAA,IACpC;AAEA,WAAO,MAAY;AACjB,uCAAQ;AAAA,IAAK;AAAA,EACf,GACC,CAAC,KAAK,CAAC;AAEH,SAAA;AACT;"}
+{"version":3,"file":"useAdheseSlot.js","sources":["../src/useAdheseSlot.ts"],"sourcesContent":["import type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport { generateSlotSignature, watch, type WatchHandle, type WatchOptions } from '@adhese/sdk-shared';\nimport {\n  type RefObject,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { useAdhese } from './adheseContext';\n\n/**\n * Hook to create an Adhese slot. The slot will be disposed when the component is unmounted. The slot will be created\n * when the containing element is available and the Adhese instance is available.\n * @param elementRef The ref to the containing element\n * @param options The options to create the slot\n *\n * @warning Make sure to wrap your `setup` function in a `useCallback` as it can trigger an infinite loop if it's not\n * memoized.\n */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement> | string, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n  const adhese = useAdhese();\n\n  const slotSignature = useMemo(() => (adhese?.location) && generateSlotSignature({\n    location: adhese.location,\n    format: options.format,\n    parameters: options.parameters,\n    slot: options.slot,\n  }), [adhese?.location, options.format, options.slot]);\n\n  const [slot, setSlot] = useState<AdheseSlot | null>(null);\n\n  useLayoutEffect(() => {\n    const element = typeof elementRef === 'string' ? elementRef : elementRef.current;\n\n    if (adhese && element) {\n      setSlot(adhese?.addSlot({\n        ...options,\n        containingElement: element,\n      }));\n    }\n\n    return (): void => {\n      setSlot(null);\n    };\n  }, [adhese, ...Object.values(options), slotSignature]);\n\n  return slot;\n}\n\n/**\n * Hook that will observe a value on a reactive object and convert to React state\n */\nexport function useWatch<\n  Input,\n  Output = Input extends () => unknown ? ReturnType<Input> | undefined : Input | undefined,\n>(value?: Input, options?: Omit<WatchOptions, 'immediate'>): Output {\n  const [state, setState] = useState<Output>(typeof value === 'function' ? value() : value);\n\n  useLayoutEffect(() => {\n    let handle: WatchHandle | undefined;\n\n    if (value) {\n      handle = watch(value, (newValue) => {\n        setState(newValue as Output);\n      }, { immediate: true, ...options });\n    }\n\n    return (): void => {\n      handle?.stop();\n    };\n  }, [value]);\n\n  return state;\n}\n"],"names":[],"mappings":";;;AAmBgB,SAAA,cAAc,YAA6C,SAAsF;AAC/J,QAAM,SAAS,UAAU;AAEzB,QAAM,gBAAgB,QAAQ,OAAO,iCAAQ,aAAa,sBAAsB;AAAA,IAC9E,UAAU,OAAO;AAAA,IACjB,QAAQ,QAAQ;AAAA,IAChB,YAAY,QAAQ;AAAA,IACpB,MAAM,QAAQ;AAAA,EAAA,CACf,GAAG,CAAC,iCAAQ,UAAU,QAAQ,QAAQ,QAAQ,IAAI,CAAC;AAEpD,QAAM,CAAC,MAAM,OAAO,IAAI,SAA4B,IAAI;AAExD,kBAAgB,MAAM;AACpB,UAAM,UAAU,OAAO,eAAe,WAAW,aAAa,WAAW;AAEzE,QAAI,UAAU,SAAS;AACrB,cAAQ,iCAAQ,QAAQ;AAAA,QACtB,GAAG;AAAA,QACH,mBAAmB;AAAA,MAAA,EACnB;AAAA,IAAA;AAGJ,WAAO,MAAY;AACjB,cAAQ,IAAI;AAAA,IACd;AAAA,EAAA,GACC,CAAC,QAAQ,GAAG,OAAO,OAAO,OAAO,GAAG,aAAa,CAAC;AAE9C,SAAA;AACT;AAKgB,SAAA,SAGd,OAAe,SAAmD;AAC5D,QAAA,CAAC,OAAO,QAAQ,IAAI,SAAiB,OAAO,UAAU,aAAa,MAAM,IAAI,KAAK;AAExF,kBAAgB,MAAM;AAChB,QAAA;AAEJ,QAAI,OAAO;AACA,eAAA,MAAM,OAAO,CAAC,aAAa;AAClC,iBAAS,QAAkB;AAAA,SAC1B,EAAE,WAAW,MAAM,GAAG,SAAS;AAAA,IAAA;AAGpC,WAAO,MAAY;AACjB,uCAAQ;AAAA,IACV;AAAA,EAAA,GACC,CAAC,KAAK,CAAC;AAEH,SAAA;AACT;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@adhese/sdk-react",
   "type": "module",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "description": "Adhese SDK",
   "license": "GPL-3.0",
   "repository": {
@@ -51,7 +51,7 @@
     "react-dom": ">=16.13"
   },
   "dependencies": {
-    "@adhese/sdk": "1.4.1",
+    "@adhese/sdk": "1.4.2",
     "@adhese/sdk-shared": "1.3.1"
   }
 }