@adhese/sdk-react 0.9.3 → 0.9.5

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/CHANGELOG.md ADDED
@@ -0,0 +1,245 @@
1
+ # @adhese/sdk-react
2
+
3
+ ## 0.9.5
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies [eca8056]
8
+ - @adhese/sdk-shared@0.4.0
9
+
10
+ ## 0.9.4
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies [242cfa3]
15
+ - @adhese/sdk-shared@0.3.0
16
+
17
+ ## 0.9.3
18
+
19
+ ### Patch Changes
20
+
21
+ - Updated dependencies [44130f4]
22
+ - @adhese/sdk-shared@0.2.0
23
+
24
+ ## 0.9.2
25
+
26
+ ### Patch Changes
27
+
28
+ - dbc1db3: Fix NPM files not pointing to dist folder
29
+
30
+ ## 0.9.1
31
+
32
+ ### Patch Changes
33
+
34
+ - eebcd88: Release @adhese/sdk-shared
35
+ - Updated dependencies [eebcd88]
36
+ - @adhese/sdk-shared@0.1.0
37
+
38
+ ## 0.9.0
39
+
40
+ ### Minor Changes
41
+
42
+ - 6294fd5: Add AdheseSlot component
43
+
44
+ ## 0.8.1
45
+
46
+ ### Patch Changes
47
+
48
+ - 59f07dd: Make packages peer dependant on @adhese/sdk to allow more flexibile dependency installations
49
+
50
+ ## 0.8.0
51
+
52
+ ### Minor Changes
53
+
54
+ - 10a18fd: Make addSlot function syncronous and remove add function
55
+
56
+ ### Patch Changes
57
+
58
+ - ee019fd: Update README files to match package specific instructions
59
+ - Updated dependencies [ee019fd]
60
+ - Updated dependencies [1cc8bff]
61
+ - Updated dependencies [76566dc]
62
+ - Updated dependencies [10a18fd]
63
+ - Updated dependencies [10a18fd]
64
+ - @adhese/sdk@0.8.0
65
+
66
+ ## 0.7.0
67
+
68
+ ### Minor Changes
69
+
70
+ - 3e0b574: Create plugin system for @adhese/sdk and move @adhese/sdk-devtools to it
71
+
72
+ ### Patch Changes
73
+
74
+ - fa24130: Replace lodash with remeda to offer a more modern solution to common utilities
75
+ - Updated dependencies [c8c37d9]
76
+ - Updated dependencies [3e0b574]
77
+ - Updated dependencies [80d943b]
78
+ - Updated dependencies [fa24130]
79
+ - @adhese/sdk@0.7.0
80
+
81
+ ## 0.6.4
82
+
83
+ ### Patch Changes
84
+
85
+ - 53683c6: Filter out all external dependencies from bundle
86
+ - Updated dependencies [53683c6]
87
+ - @adhese/sdk@0.6.4
88
+
89
+ ## 0.6.3
90
+
91
+ ### Patch Changes
92
+
93
+ - 99f728f: Replace lodash-es with lodash to prevent breaking CJS builds
94
+ - a27f499: Add 'use-client' directive to adheseContext
95
+ - 85ee707: Remove dynamicImportInCjs option
96
+ - Updated dependencies [99f728f]
97
+ - Updated dependencies [85ee707]
98
+ - @adhese/sdk@0.6.3
99
+
100
+ ## 0.6.2
101
+
102
+ ### Patch Changes
103
+
104
+ - e9fb6f3: Update build outputs to allow installation in CommonJS env
105
+ - Updated dependencies [e9fb6f3]
106
+ - @adhese/sdk@0.6.2
107
+
108
+ ## 0.6.1
109
+
110
+ ### Patch Changes
111
+
112
+ - a5846f2: Move React dependencies to peerDependencies to allow wider React support
113
+ - Updated dependencies [c435430]
114
+ - @adhese/sdk@0.6.1
115
+
116
+ ## 0.6.0
117
+
118
+ ### Patch Changes
119
+
120
+ - 9c80d57: Update dependencies
121
+ - Updated dependencies [9c80d57]
122
+ - Updated dependencies [41b0dd8]
123
+ - @adhese/sdk@0.6.0
124
+
125
+ ## 0.5.2
126
+
127
+ ### Patch Changes
128
+
129
+ - f594b82: Fix issue where useAdheseSlot would land in an infinite loop without the options being wrapped in a useMemo
130
+ - @adhese/sdk@0.5.2
131
+
132
+ ## 0.5.1
133
+
134
+ ### Patch Changes
135
+
136
+ - a211689: Fix issue where the transformed ad was sent again to the onBeforeRender callback making subsequent transforms not possible
137
+ - Updated dependencies [a211689]
138
+ - Updated dependencies [7fc299d]
139
+ - @adhese/sdk@0.5.1
140
+
141
+ ## 0.5.0
142
+
143
+ ### Minor Changes
144
+
145
+ - eac9754: Add Vue based reactivity to offer more flexible control flow
146
+ - eac9754: Make createAdhese and createSlot syncronous to simplify implementation
147
+ - eac9754: Allow having more than one Adhese instance in React applications
148
+
149
+ ### Patch Changes
150
+
151
+ - Updated dependencies [a666b90]
152
+ - Updated dependencies [eac9754]
153
+ - Updated dependencies [eac9754]
154
+ - Updated dependencies [a666b90]
155
+ - @adhese/sdk@0.5.0
156
+
157
+ ## 0.4.0
158
+
159
+ ### Minor Changes
160
+
161
+ - 52862a1: Add support for DALE gateway responses
162
+
163
+ ### Patch Changes
164
+
165
+ - a4da136: Fix GET request not working with some slots properly
166
+ - 7bbe1ff: Fix @adhese/sdk-devtools not outputting css to example
167
+ - Updated dependencies [52862a1]
168
+ - Updated dependencies [a4da136]
169
+ - @adhese/sdk@0.4.0
170
+
171
+ ## 0.3.0
172
+
173
+ ### Patch Changes
174
+
175
+ - Updated dependencies [22c81ff]
176
+ - Updated dependencies [e88cce4]
177
+ - Updated dependencies [63cd49f]
178
+ - @adhese/sdk-devtools@0.3.0
179
+ - @adhese/sdk@0.3.0
180
+
181
+ ## 0.2.0
182
+
183
+ ### Minor Changes
184
+
185
+ - 82d823f: Create separate @adhese/sdk-devtool package to simplify dependencies in the @adhese/sdk package
186
+
187
+ ### Patch Changes
188
+
189
+ - Updated dependencies [82d823f]
190
+ - @adhese/sdk-devtools@0.2.0
191
+ - @adhese/sdk@0.2.0
192
+
193
+ ## 0.1.5
194
+
195
+ ### Patch Changes
196
+
197
+ - 6725b17: Add repository field to package.json
198
+ - Updated dependencies [6725b17]
199
+ - @adhese/sdk@0.1.5
200
+
201
+ ## 0.1.4
202
+
203
+ ### Patch Changes
204
+
205
+ - @adhese/sdk@0.1.4
206
+
207
+ ## 0.1.3
208
+
209
+ ### Patch Changes
210
+
211
+ - @adhese/sdk@0.1.3
212
+
213
+ ## 0.1.2
214
+
215
+ ### Patch Changes
216
+
217
+ - 6c3b93e: Add license file
218
+ - Updated dependencies [6c3b93e]
219
+ - Updated dependencies [6c3b93e]
220
+ - @adhese/sdk@0.1.2
221
+
222
+ ## 0.1.1
223
+
224
+ ### Patch Changes
225
+
226
+ - d481a4e: Add license file
227
+ - Updated dependencies [d481a4e]
228
+ - @adhese/sdk@0.1.1
229
+
230
+ ## 0.1.0
231
+
232
+ ### Minor Changes
233
+
234
+ - 9df9809: Add comitizen
235
+ - 9df9809: Initial release
236
+
237
+ ### Patch Changes
238
+
239
+ - 9df9809: Update dependencies
240
+ - 9df9809: Fix eslint-config version number
241
+ - Updated dependencies [9df9809]
242
+ - Updated dependencies [9df9809]
243
+ - Updated dependencies [9df9809]
244
+ - Updated dependencies [9df9809]
245
+ - @adhese/sdk@0.1.0
package/dist/index.cjs CHANGED
@@ -1,18 +1,42 @@
1
1
  "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __copyProps = (to, from, except, desc) => {
9
+ if (from && typeof from === "object" || typeof from === "function") {
10
+ for (let key of __getOwnPropNames(from))
11
+ if (!__hasOwnProp.call(to, key) && key !== except)
12
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
13
+ }
14
+ return to;
15
+ };
16
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
17
+ // If the importer is in node compatibility mode or this is not an ESM
18
+ // file that has been converted to a CommonJS file using a Babel-
19
+ // compatible transform (i.e. "__esModule" has not been set), then set
20
+ // "default" to the CommonJS "module.exports" for node compatibility.
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
2
24
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
25
  const jsxRuntime = require("react/jsx-runtime");
4
26
  const react = require("react");
5
- const sdk = require("@adhese/sdk");
6
27
  const useDeepCompareEffect = require("use-deep-compare-effect");
7
28
  const remeda = require("remeda");
8
29
  const adheseContext = react.createContext(void 0);
9
30
  function AdheseProvider({ children, options }) {
10
31
  const [adhese, setAdhese] = react.useState(void 0);
11
32
  react.useEffect(() => {
12
- const instance = sdk.createAdhese(options);
13
- setAdhese(instance);
33
+ let instance = null;
34
+ import("@adhese/sdk").then(({ createAdhese }) => {
35
+ instance = createAdhese(options);
36
+ setAdhese(instance);
37
+ }).catch(console.error);
14
38
  return () => {
15
- instance.dispose();
39
+ instance == null ? void 0 : instance.dispose();
16
40
  };
17
41
  }, [options]);
18
42
  return /* @__PURE__ */ jsxRuntime.jsx(adheseContext.Provider, { value: adhese, children });
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../src/adheseContext.tsx","../src/useAdheseSlot.ts","../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport {\n type PropsWithChildren,\n type ReactElement,\n createContext,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport { type Adhese, type AdheseOptions, createAdhese } from '@adhese/sdk';\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 const instance = createAdhese(options);\n setAdhese(instance);\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","import { type RefObject, useState } from 'react';\nimport type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport useDeepCompareEffect from 'use-deep-compare-effect';\nimport { omit } from 'remeda';\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 */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement>, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n const [slot, setSlot] = useState<AdheseSlot | null>(null);\n const adhese = useAdhese();\n\n useDeepCompareEffect(() => {\n let intermediate: AdheseSlot | undefined;\n\n if (adhese && elementRef.current) {\n intermediate = adhese.addSlot(\n {\n ...options,\n containingElement: elementRef.current,\n },\n );\n\n setSlot(intermediate);\n }\n\n return (): void => {\n intermediate?.dispose();\n };\n }, [adhese, omit(options, Object.entries(options).filter(([, value]) => typeof value === 'function').map(([key]) => key as keyof typeof options)), elementRef.current]);\n\n return slot;\n}\n","import { type ReactElement, useEffect, useRef } from 'react';\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { useAdheseSlot } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n /**\n * Callback to be called when the slot is created or disposed\n */\n onChange?(slot: Slot | null): void;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'>;\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// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n onChange,\n ...options\n}: AdheseSlotProps): ReactElement {\n const element = useRef<HTMLDivElement | null>(null);\n\n const slot = useAdheseSlot(element, options);\n\n useEffect(() => {\n onChange?.(slot);\n }, [onChange, slot]);\n\n return (\n <div ref={element} />\n );\n}\n"],"names":["createContext","useState","useEffect","createAdhese","useContext","omit","useRef","jsx"],"mappings":";;;;;;;AAYA,MAAM,gBAAgBA,MAAAA,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAwE;AACjH,QAAM,CAAC,QAAQ,SAAS,IAAIC,MAAAA,SAA6B,MAAS;AAElEC,QAAAA,UAAU,MAAM;AACR,UAAA,WAAWC,iBAAa,OAAO;AACrC,cAAU,QAAQ;AAElB,WAAO,MAAY;AACjB,eAAS,QAAQ;AAAA,IAAA;AAAA,EACnB,GACC,CAAC,OAAO,CAAC;AAEZ,wCACG,cAAc,UAAd,EAAuB,OAAO,QAC5B,SACH,CAAA;AAEJ;AAKO,SAAS,YAAgC;AAC9C,SAAOC,MAAAA,WAAW,aAAa;AACjC;AChCgB,SAAA,cAAc,YAAoC,SAAsF;AACtJ,QAAM,CAAC,MAAM,OAAO,IAAIH,eAA4B,IAAI;AACxD,QAAM,SAAS;AAEf,uBAAqB,MAAM;AACrB,QAAA;AAEA,QAAA,UAAU,WAAW,SAAS;AAChC,qBAAe,OAAO;AAAA,QACpB;AAAA,UACE,GAAG;AAAA,UACH,mBAAmB,WAAW;AAAA,QAChC;AAAA,MAAA;AAGF,cAAQ,YAAY;AAAA,IACtB;AAEA,WAAO,MAAY;AACjB,mDAAc;AAAA,IAAQ;AAAA,EAEvB,GAAA,CAAC,QAAQI,YAAK,SAAS,OAAO,QAAQ,OAAO,EAAE,OAAO,CAAC,CAAA,EAAG,KAAK,MAAM,OAAO,UAAU,UAAU,EAAE,IAAI,CAAC,CAAC,GAAG,MAAM,GAA2B,CAAC,GAAG,WAAW,OAAO,CAAC;AAE/J,SAAA;AACT;ACpBO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAkC;AAC1B,QAAA,UAAUC,aAA8B,IAAI;AAE5C,QAAA,OAAO,cAAc,SAAS,OAAO;AAE3CJ,QAAAA,UAAU,MAAM;AACd,yCAAW;AAAA,EAAI,GACd,CAAC,UAAU,IAAI,CAAC;AAGjB,SAAAK,2BAAA,IAAC,OAAI,EAAA,KAAK,QAAS,CAAA;AAEvB;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":["../src/adheseContext.tsx","../src/useAdheseSlot.ts","../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport {\n type PropsWithChildren,\n type ReactElement,\n createContext,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport type { Adhese, AdheseOptions } from '@adhese/sdk';\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 | null = null;\n\n import('@adhese/sdk').then(({ createAdhese }) => {\n instance = createAdhese(options);\n\n setAdhese(instance);\n }).catch(console.error);\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","import { type RefObject, useState } from 'react';\nimport type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport useDeepCompareEffect from 'use-deep-compare-effect';\nimport { omit } from 'remeda';\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 */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement>, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n const [slot, setSlot] = useState<AdheseSlot | null>(null);\n const adhese = useAdhese();\n\n useDeepCompareEffect(() => {\n let intermediate: AdheseSlot | undefined;\n\n if (adhese && elementRef.current) {\n intermediate = adhese.addSlot(\n {\n ...options,\n containingElement: elementRef.current,\n },\n );\n\n setSlot(intermediate);\n }\n\n return (): void => {\n intermediate?.dispose();\n };\n }, [adhese, omit(options, Object.entries(options).filter(([, value]) => typeof value === 'function').map(([key]) => key as keyof typeof options)), elementRef.current]);\n\n return slot;\n}\n","import { type ReactElement, useEffect, useRef } from 'react';\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { useAdheseSlot } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n /**\n * Callback to be called when the slot is created or disposed\n */\n onChange?(slot: Slot | null): void;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'>;\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// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n onChange,\n ...options\n}: AdheseSlotProps): ReactElement {\n const element = useRef<HTMLDivElement | null>(null);\n\n const slot = useAdheseSlot(element, options);\n\n useEffect(() => {\n onChange?.(slot);\n }, [onChange, slot]);\n\n return (\n <div ref={element} />\n );\n}\n"],"names":["createContext","useState","useEffect","useContext","omit","useRef","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,gBAAgBA,MAAAA,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAwE;AACjH,QAAM,CAAC,QAAQ,SAAS,IAAIC,MAAAA,SAA6B,MAAS;AAElEC,QAAAA,UAAU,MAAM;AACd,QAAI,WAA0B;AAE9B,WAAO,aAAa,EAAE,KAAK,CAAC,EAAE,mBAAmB;AAC/C,iBAAW,aAAa,OAAO;AAE/B,gBAAU,QAAQ;AAAA,IACnB,CAAA,EAAE,MAAM,QAAQ,KAAK;AAEtB,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;ACrCgB,SAAA,cAAc,YAAoC,SAAsF;AACtJ,QAAM,CAAC,MAAM,OAAO,IAAIF,eAA4B,IAAI;AACxD,QAAM,SAAS;AAEf,uBAAqB,MAAM;AACrB,QAAA;AAEA,QAAA,UAAU,WAAW,SAAS;AAChC,qBAAe,OAAO;AAAA,QACpB;AAAA,UACE,GAAG;AAAA,UACH,mBAAmB,WAAW;AAAA,QAChC;AAAA,MAAA;AAGF,cAAQ,YAAY;AAAA,IACtB;AAEA,WAAO,MAAY;AACjB,mDAAc;AAAA,IAAQ;AAAA,EAEvB,GAAA,CAAC,QAAQG,YAAK,SAAS,OAAO,QAAQ,OAAO,EAAE,OAAO,CAAC,CAAA,EAAG,KAAK,MAAM,OAAO,UAAU,UAAU,EAAE,IAAI,CAAC,CAAC,GAAG,MAAM,GAA2B,CAAC,GAAG,WAAW,OAAO,CAAC;AAE/J,SAAA;AACT;ACpBO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAkC;AAC1B,QAAA,UAAUC,aAA8B,IAAI;AAE5C,QAAA,OAAO,cAAc,SAAS,OAAO;AAE3CH,QAAAA,UAAU,MAAM;AACd,yCAAW;AAAA,EAAI,GACd,CAAC,UAAU,IAAI,CAAC;AAGjB,SAAAI,2BAAA,IAAC,OAAI,EAAA,KAAK,QAAS,CAAA;AAEvB;;;;;"}
package/dist/index.js CHANGED
@@ -1,16 +1,18 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { createContext, useState, useEffect, useContext, useRef } from "react";
3
- import { createAdhese } from "@adhese/sdk";
4
3
  import useDeepCompareEffect from "use-deep-compare-effect";
5
4
  import { omit } from "remeda";
6
5
  const adheseContext = createContext(void 0);
7
6
  function AdheseProvider({ children, options }) {
8
7
  const [adhese, setAdhese] = useState(void 0);
9
8
  useEffect(() => {
10
- const instance = createAdhese(options);
11
- setAdhese(instance);
9
+ let instance = null;
10
+ import("@adhese/sdk").then(({ createAdhese }) => {
11
+ instance = createAdhese(options);
12
+ setAdhese(instance);
13
+ }).catch(console.error);
12
14
  return () => {
13
- instance.dispose();
15
+ instance == null ? void 0 : instance.dispose();
14
16
  };
15
17
  }, [options]);
16
18
  return /* @__PURE__ */ jsx(adheseContext.Provider, { value: adhese, children });
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/adheseContext.tsx","../src/useAdheseSlot.ts","../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport {\n type PropsWithChildren,\n type ReactElement,\n createContext,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport { type Adhese, type AdheseOptions, createAdhese } from '@adhese/sdk';\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 const instance = createAdhese(options);\n setAdhese(instance);\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","import { type RefObject, useState } from 'react';\nimport type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport useDeepCompareEffect from 'use-deep-compare-effect';\nimport { omit } from 'remeda';\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 */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement>, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n const [slot, setSlot] = useState<AdheseSlot | null>(null);\n const adhese = useAdhese();\n\n useDeepCompareEffect(() => {\n let intermediate: AdheseSlot | undefined;\n\n if (adhese && elementRef.current) {\n intermediate = adhese.addSlot(\n {\n ...options,\n containingElement: elementRef.current,\n },\n );\n\n setSlot(intermediate);\n }\n\n return (): void => {\n intermediate?.dispose();\n };\n }, [adhese, omit(options, Object.entries(options).filter(([, value]) => typeof value === 'function').map(([key]) => key as keyof typeof options)), elementRef.current]);\n\n return slot;\n}\n","import { type ReactElement, useEffect, useRef } from 'react';\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { useAdheseSlot } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n /**\n * Callback to be called when the slot is created or disposed\n */\n onChange?(slot: Slot | null): void;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'>;\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// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n onChange,\n ...options\n}: AdheseSlotProps): ReactElement {\n const element = useRef<HTMLDivElement | null>(null);\n\n const slot = useAdheseSlot(element, options);\n\n useEffect(() => {\n onChange?.(slot);\n }, [onChange, slot]);\n\n return (\n <div ref={element} />\n );\n}\n"],"names":[],"mappings":";;;;;AAYA,MAAM,gBAAgB,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAwE;AACjH,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6B,MAAS;AAElE,YAAU,MAAM;AACR,UAAA,WAAW,aAAa,OAAO;AACrC,cAAU,QAAQ;AAElB,WAAO,MAAY;AACjB,eAAS,QAAQ;AAAA,IAAA;AAAA,EACnB,GACC,CAAC,OAAO,CAAC;AAEZ,6BACG,cAAc,UAAd,EAAuB,OAAO,QAC5B,SACH,CAAA;AAEJ;AAKO,SAAS,YAAgC;AAC9C,SAAO,WAAW,aAAa;AACjC;AChCgB,SAAA,cAAc,YAAoC,SAAsF;AACtJ,QAAM,CAAC,MAAM,OAAO,IAAI,SAA4B,IAAI;AACxD,QAAM,SAAS;AAEf,uBAAqB,MAAM;AACrB,QAAA;AAEA,QAAA,UAAU,WAAW,SAAS;AAChC,qBAAe,OAAO;AAAA,QACpB;AAAA,UACE,GAAG;AAAA,UACH,mBAAmB,WAAW;AAAA,QAChC;AAAA,MAAA;AAGF,cAAQ,YAAY;AAAA,IACtB;AAEA,WAAO,MAAY;AACjB,mDAAc;AAAA,IAAQ;AAAA,EAEvB,GAAA,CAAC,QAAQ,KAAK,SAAS,OAAO,QAAQ,OAAO,EAAE,OAAO,CAAC,CAAA,EAAG,KAAK,MAAM,OAAO,UAAU,UAAU,EAAE,IAAI,CAAC,CAAC,GAAG,MAAM,GAA2B,CAAC,GAAG,WAAW,OAAO,CAAC;AAE/J,SAAA;AACT;ACpBO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAkC;AAC1B,QAAA,UAAU,OAA8B,IAAI;AAE5C,QAAA,OAAO,cAAc,SAAS,OAAO;AAE3C,YAAU,MAAM;AACd,yCAAW;AAAA,EAAI,GACd,CAAC,UAAU,IAAI,CAAC;AAGjB,SAAA,oBAAC,OAAI,EAAA,KAAK,QAAS,CAAA;AAEvB;"}
1
+ {"version":3,"file":"index.js","sources":["../src/adheseContext.tsx","../src/useAdheseSlot.ts","../src/AdheseSlot.tsx"],"sourcesContent":["'use client';\n\nimport {\n type PropsWithChildren,\n type ReactElement,\n createContext,\n useContext,\n useEffect,\n useState,\n} from 'react';\nimport type { Adhese, AdheseOptions } from '@adhese/sdk';\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 | null = null;\n\n import('@adhese/sdk').then(({ createAdhese }) => {\n instance = createAdhese(options);\n\n setAdhese(instance);\n }).catch(console.error);\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","import { type RefObject, useState } from 'react';\nimport type { AdheseSlot, AdheseSlotOptions } from '@adhese/sdk';\nimport useDeepCompareEffect from 'use-deep-compare-effect';\nimport { omit } from 'remeda';\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 */\nexport function useAdheseSlot(elementRef: RefObject<HTMLElement>, options: Omit<AdheseSlotOptions, 'containingElement' | 'context'>): AdheseSlot | null {\n const [slot, setSlot] = useState<AdheseSlot | null>(null);\n const adhese = useAdhese();\n\n useDeepCompareEffect(() => {\n let intermediate: AdheseSlot | undefined;\n\n if (adhese && elementRef.current) {\n intermediate = adhese.addSlot(\n {\n ...options,\n containingElement: elementRef.current,\n },\n );\n\n setSlot(intermediate);\n }\n\n return (): void => {\n intermediate?.dispose();\n };\n }, [adhese, omit(options, Object.entries(options).filter(([, value]) => typeof value === 'function').map(([key]) => key as keyof typeof options)), elementRef.current]);\n\n return slot;\n}\n","import { type ReactElement, useEffect, useRef } from 'react';\nimport type { AdheseSlotOptions, AdheseSlot as Slot } from '@adhese/sdk';\nimport { useAdheseSlot } from './useAdheseSlot';\n\nexport type AdheseSlotProps = {\n /**\n * Callback to be called when the slot is created or disposed\n */\n onChange?(slot: Slot | null): void;\n} & Omit<AdheseSlotOptions, 'containingElement' | 'context'>;\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// eslint-disable-next-line ts/naming-convention\nexport function AdheseSlot({\n onChange,\n ...options\n}: AdheseSlotProps): ReactElement {\n const element = useRef<HTMLDivElement | null>(null);\n\n const slot = useAdheseSlot(element, options);\n\n useEffect(() => {\n onChange?.(slot);\n }, [onChange, slot]);\n\n return (\n <div ref={element} />\n );\n}\n"],"names":[],"mappings":";;;;AAYA,MAAM,gBAAgB,cAAkC,MAAS;AAQ1D,SAAS,eAAe,EAAE,UAAU,WAAwE;AACjH,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6B,MAAS;AAElE,YAAU,MAAM;AACd,QAAI,WAA0B;AAE9B,WAAO,aAAa,EAAE,KAAK,CAAC,EAAE,mBAAmB;AAC/C,iBAAW,aAAa,OAAO;AAE/B,gBAAU,QAAQ;AAAA,IACnB,CAAA,EAAE,MAAM,QAAQ,KAAK;AAEtB,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;ACrCgB,SAAA,cAAc,YAAoC,SAAsF;AACtJ,QAAM,CAAC,MAAM,OAAO,IAAI,SAA4B,IAAI;AACxD,QAAM,SAAS;AAEf,uBAAqB,MAAM;AACrB,QAAA;AAEA,QAAA,UAAU,WAAW,SAAS;AAChC,qBAAe,OAAO;AAAA,QACpB;AAAA,UACE,GAAG;AAAA,UACH,mBAAmB,WAAW;AAAA,QAChC;AAAA,MAAA;AAGF,cAAQ,YAAY;AAAA,IACtB;AAEA,WAAO,MAAY;AACjB,mDAAc;AAAA,IAAQ;AAAA,EAEvB,GAAA,CAAC,QAAQ,KAAK,SAAS,OAAO,QAAQ,OAAO,EAAE,OAAO,CAAC,CAAA,EAAG,KAAK,MAAM,OAAO,UAAU,UAAU,EAAE,IAAI,CAAC,CAAC,GAAG,MAAM,GAA2B,CAAC,GAAG,WAAW,OAAO,CAAC;AAE/J,SAAA;AACT;ACpBO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAkC;AAC1B,QAAA,UAAU,OAA8B,IAAI;AAE5C,QAAA,OAAO,cAAc,SAAS,OAAO;AAE3C,YAAU,MAAM;AACd,yCAAW;AAAA,EAAI,GACd,CAAC,UAAU,IAAI,CAAC;AAGjB,SAAA,oBAAC,OAAI,EAAA,KAAK,QAAS,CAAA;AAEvB;"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@adhese/sdk-react",
3
3
  "type": "module",
4
- "version": "0.9.3",
4
+ "version": "0.9.5",
5
5
  "description": "Adhese SDK",
6
6
  "repository": {
7
7
  "type": "git",
@@ -11,6 +11,7 @@
11
11
  "module": "./dist/index.js",
12
12
  "types": "./dist/index.d.ts",
13
13
  "files": [
14
+ "CHANGELOG.md",
14
15
  "LICENSE",
15
16
  "README.md",
16
17
  "dist"
@@ -29,7 +30,7 @@
29
30
  "react-dom": ">=16.13"
30
31
  },
31
32
  "dependencies": {
32
- "@adhese/sdk-shared": "^0.2.0",
33
+ "@adhese/sdk-shared": "^0.4.0",
33
34
  "remeda": "^1.61.0",
34
35
  "use-deep-compare-effect": "^1.8.1"
35
36
  },