@servicetitan/notifications 25.8.1 → 26.0.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/container.d.ts +2 -2
- package/dist/components/container.d.ts.map +1 -1
- package/dist/components/container.js +6 -32
- package/dist/components/container.js.map +1 -1
- package/dist/components/notifications.d.ts +2 -2
- package/dist/components/notifications.d.ts.map +1 -1
- package/dist/components/shadow-dom.d.ts +2 -2
- package/dist/components/shadow-dom.d.ts.map +1 -1
- package/dist/components/shadow-dom.js.map +1 -1
- package/package.json +11 -11
- package/src/components/container.tsx +9 -43
- package/src/components/notifications.tsx +2 -2
- package/src/components/shadow-dom.tsx +2 -2
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
2
|
-
export declare const Container: FC
|
|
1
|
+
import { FC, PropsWithChildren } from 'react';
|
|
2
|
+
export declare const Container: FC<PropsWithChildren>;
|
|
3
3
|
//# sourceMappingURL=container.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../src/components/container.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../src/components/container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAMxD,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,iBAAiB,CAS3C,CAAC"}
|
|
@@ -1,38 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useState
|
|
3
|
-
import { render, createPortal } from 'react-dom';
|
|
2
|
+
import { useState } from 'react';
|
|
4
3
|
import { Toast } from '@servicetitan/design-system';
|
|
5
4
|
import { createElement } from '../create-element';
|
|
6
5
|
export const Container = ({ children }) => {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
!container.classList.contains('initialized')) {
|
|
13
|
-
render(_jsx(Toast.Group, { portal: container }), container, () => {
|
|
14
|
-
container.classList.remove('initializing');
|
|
15
|
-
container.classList.add('initialized');
|
|
16
|
-
});
|
|
17
|
-
container.classList.add('initializing');
|
|
18
|
-
}
|
|
19
|
-
let observer;
|
|
20
|
-
if (!target) {
|
|
21
|
-
observer = new MutationObserver(() => {
|
|
22
|
-
var _a;
|
|
23
|
-
if (container.classList.contains('initialized')) {
|
|
24
|
-
setTarget((_a = container.getElementsByClassName('ToastGroup')[0]) !== null && _a !== void 0 ? _a : null);
|
|
25
|
-
observer.disconnect();
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
observer.observe(container, {
|
|
29
|
-
attributeFilter: ['class'],
|
|
30
|
-
});
|
|
31
|
-
}
|
|
32
|
-
return () => {
|
|
33
|
-
observer === null || observer === void 0 ? void 0 : observer.disconnect();
|
|
34
|
-
};
|
|
35
|
-
}, [container, target]);
|
|
36
|
-
return target ? createPortal(children, target) : null;
|
|
6
|
+
const [container] = useState(() => {
|
|
7
|
+
var _a;
|
|
8
|
+
return ((_a = document.getElementById('servicetitan-notifications')) !== null && _a !== void 0 ? _a : document.body.appendChild(createElement('div', { id: 'servicetitan-notifications' })));
|
|
9
|
+
});
|
|
10
|
+
return container ? _jsx(Toast.Group, Object.assign({ portal: container }, { children: children })) : null;
|
|
37
11
|
};
|
|
38
12
|
//# sourceMappingURL=container.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"container.js","sourceRoot":"","sources":["../../src/components/container.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,
|
|
1
|
+
{"version":3,"file":"container.js","sourceRoot":"","sources":["../../src/components/container.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAyB,MAAM,OAAO,CAAC;AAExD,OAAO,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AAEpD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,CAAC,MAAM,SAAS,GAA0B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC7D,MAAM,CAAC,SAAS,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE;;QAC9B,OAAO,CACH,MAAA,QAAQ,CAAC,cAAc,CAAC,4BAA4B,CAAC,mCACrD,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,EAAE,EAAE,4BAA4B,EAAE,CAAC,CAAC,CACxF,CAAC;IACN,CAAC,CAAC,CAAC;IAEH,OAAO,SAAS,CAAC,CAAC,CAAC,KAAC,KAAK,CAAC,KAAK,kBAAC,MAAM,EAAE,SAAS,gBAAG,QAAQ,IAAe,CAAC,CAAC,CAAC,IAAI,CAAC;AACvF,CAAC,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
1
|
+
import { FC, PropsWithChildren } from 'react';
|
|
2
2
|
import { interfaces } from '@servicetitan/react-ioc';
|
|
3
3
|
import { NotificationsApi } from '../api/notifications.api';
|
|
4
|
-
export interface NotificationsProps {
|
|
4
|
+
export interface NotificationsProps extends PropsWithChildren {
|
|
5
5
|
apiService?: interfaces.Newable<NotificationsApi>;
|
|
6
6
|
}
|
|
7
7
|
export declare const Notifications: FC<NotificationsProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../src/components/notifications.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../src/components/notifications.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAAY,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE/D,OAAO,EACH,gBAAgB,EAGnB,MAAM,0BAA0B,CAAC;AAelC,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IACzD,UAAU,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAWhD,CAAC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
2
|
-
export declare const ShadowDOM: FC
|
|
1
|
+
import { FC, PropsWithChildren } from 'react';
|
|
2
|
+
export declare const ShadowDOM: FC<PropsWithChildren>;
|
|
3
3
|
//# sourceMappingURL=shadow-dom.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shadow-dom.d.ts","sourceRoot":"","sources":["../../src/components/shadow-dom.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,EAAE,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"shadow-dom.d.ts","sourceRoot":"","sources":["../../src/components/shadow-dom.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAmBxD,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,iBAAiB,CAiC3C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shadow-dom.js","sourceRoot":"","sources":["../../src/components/shadow-dom.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,
|
|
1
|
+
{"version":3,"file":"shadow-dom.js","sourceRoot":"","sources":["../../src/components/shadow-dom.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAyB,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzC,OAAO,cAAc,MAAM,kCAAkC,CAAC;AAE9D,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD,SAAS,UAAU,CAAC,GAAW,EAAE,MAAkB;IAC/C,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAE/C,OAAO,CAAC,IAAI,GAAG,GAAG,CAAC;IACnB,OAAO,CAAC,GAAG,GAAG,YAAY,CAAC;IAC3B,OAAO,CAAC,WAAW,GAAG,WAAW,CAAC;IAClC,OAAO,CAAC,MAAM,GAAG,MAAM,CAAC;IACxB,OAAO,CAAC,OAAO,GAAG,MAAM,CAAC;IAEzB,OAAO,OAAO,CAAC;AACnB,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAA0B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC7D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;IAC3D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,MAAM,SAAS,GAAG,CAAC,OAA8B,EAAE,EAAE;QACjD,IAAI,CAAC,OAAO,IAAI,MAAM,EAAE;YACpB,OAAO;SACV;QAED,IAAI,WAAW,GAAG,CAAC,CAAC;QACpB,IAAI,YAAY,GAAG,CAAC,CAAC;QACrB,MAAM,IAAI,GAAG,OAAO,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;QAEpD,MAAM,UAAU,GAAG,GAAG,EAAE;YACpB,YAAY,EAAE,CAAC;YAEf,IAAI,YAAY,KAAK,WAAW,EAAE;gBAC9B,SAAS,CAAC,IAAI,CAAC,CAAC;aACnB;QACL,CAAC,CAAC;QAEF,KAAK,MAAM,GAAG,IAAI,WAAW,EAAE;YAC3B,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;YACzC,WAAW,EAAE,CAAC;SACjB;QAED,cAAc,CAAC,IAAI,CAAC,CAAC;QAErB,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAC/D,CAAC,CAAC;IAEF,OAAO,4BAAK,GAAG,EAAE,SAAS,gBAAG,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,IAAO,CAAC;AACjG,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/notifications",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "26.0.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"homepage": "https://docs.st.dev/docs/frontend/notifications-center",
|
|
6
6
|
"repository": {
|
|
@@ -21,18 +21,18 @@
|
|
|
21
21
|
"react-shadow-dom-retarget-events": "~1.1.0"
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
|
-
"@servicetitan/design-system": "
|
|
25
|
-
"@servicetitan/log-service": "
|
|
26
|
-
"@servicetitan/react-ioc": "^
|
|
27
|
-
"@servicetitan/web-components": "^
|
|
28
|
-
"@types/react": "~
|
|
24
|
+
"@servicetitan/design-system": "~13.4.5",
|
|
25
|
+
"@servicetitan/log-service": "^23.2.1",
|
|
26
|
+
"@servicetitan/react-ioc": "^23.2.1",
|
|
27
|
+
"@servicetitan/web-components": "^23.2.1",
|
|
28
|
+
"@types/react": "~18.2.55",
|
|
29
29
|
"@types/react-router": "~5.1.17",
|
|
30
30
|
"@types/react-shadow-dom-retarget-events": "~1.0.0",
|
|
31
31
|
"axios": "~0.27.2",
|
|
32
32
|
"mobx": "~6.6.0",
|
|
33
33
|
"mobx-react": "~7.5.0",
|
|
34
|
-
"react": "~
|
|
35
|
-
"react-dom": "~
|
|
34
|
+
"react": "~18.2.0",
|
|
35
|
+
"react-dom": "~18.2.0",
|
|
36
36
|
"react-router-dom": "~5.3.0"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
@@ -43,8 +43,8 @@
|
|
|
43
43
|
"axios": "~0.27.2",
|
|
44
44
|
"mobx": "~6.6.0",
|
|
45
45
|
"mobx-react": "~7.5.0",
|
|
46
|
-
"react": "
|
|
47
|
-
"react-dom": "
|
|
46
|
+
"react": ">=17.0.2",
|
|
47
|
+
"react-dom": ">=17.0.2",
|
|
48
48
|
"react-router-dom": ">=5.3.0 <7.0.0"
|
|
49
49
|
},
|
|
50
50
|
"publishConfig": {
|
|
@@ -53,5 +53,5 @@
|
|
|
53
53
|
"cli": {
|
|
54
54
|
"webpack": false
|
|
55
55
|
},
|
|
56
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "2027b0cb3bb4a06b8e381e3e9af8469a30b20f11"
|
|
57
57
|
}
|
|
@@ -1,50 +1,16 @@
|
|
|
1
|
-
import { useState,
|
|
2
|
-
import { render, createPortal } from 'react-dom';
|
|
1
|
+
import { useState, FC, PropsWithChildren } from 'react';
|
|
3
2
|
|
|
4
3
|
import { Toast } from '@servicetitan/design-system';
|
|
5
4
|
|
|
6
5
|
import { createElement } from '../create-element';
|
|
7
6
|
|
|
8
|
-
export const Container: FC = ({ children }) => {
|
|
9
|
-
const container =
|
|
10
|
-
|
|
11
|
-
|
|
7
|
+
export const Container: FC<PropsWithChildren> = ({ children }) => {
|
|
8
|
+
const [container] = useState(() => {
|
|
9
|
+
return (
|
|
10
|
+
document.getElementById('servicetitan-notifications') ??
|
|
11
|
+
document.body.appendChild(createElement('div', { id: 'servicetitan-notifications' }))
|
|
12
|
+
);
|
|
13
|
+
});
|
|
12
14
|
|
|
13
|
-
|
|
14
|
-
container.getElementsByClassName('ToastGroup')[0] ?? null
|
|
15
|
-
);
|
|
16
|
-
|
|
17
|
-
useEffect(() => {
|
|
18
|
-
if (
|
|
19
|
-
!container.classList.contains('initializing') &&
|
|
20
|
-
!container.classList.contains('initialized')
|
|
21
|
-
) {
|
|
22
|
-
render(<Toast.Group portal={container} />, container, () => {
|
|
23
|
-
container.classList.remove('initializing');
|
|
24
|
-
container.classList.add('initialized');
|
|
25
|
-
});
|
|
26
|
-
container.classList.add('initializing');
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
let observer: MutationObserver;
|
|
30
|
-
|
|
31
|
-
if (!target) {
|
|
32
|
-
observer = new MutationObserver(() => {
|
|
33
|
-
if (container.classList.contains('initialized')) {
|
|
34
|
-
setTarget(container.getElementsByClassName('ToastGroup')[0] ?? null);
|
|
35
|
-
observer.disconnect();
|
|
36
|
-
}
|
|
37
|
-
});
|
|
38
|
-
|
|
39
|
-
observer.observe(container, {
|
|
40
|
-
attributeFilter: ['class'],
|
|
41
|
-
});
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
return () => {
|
|
45
|
-
observer?.disconnect();
|
|
46
|
-
};
|
|
47
|
-
}, [container, target]);
|
|
48
|
-
|
|
49
|
-
return target ? createPortal(children, target) : null;
|
|
15
|
+
return container ? <Toast.Group portal={container}>{children}</Toast.Group> : null;
|
|
50
16
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
1
|
+
import { FC, PropsWithChildren } from 'react';
|
|
2
2
|
|
|
3
3
|
import { Provider, interfaces } from '@servicetitan/react-ioc';
|
|
4
4
|
|
|
@@ -21,7 +21,7 @@ import {
|
|
|
21
21
|
import { DefaultNotification } from './default-notification';
|
|
22
22
|
import { NotificationsUnwrapped } from './notifications-unwrapped';
|
|
23
23
|
|
|
24
|
-
export interface NotificationsProps {
|
|
24
|
+
export interface NotificationsProps extends PropsWithChildren {
|
|
25
25
|
apiService?: interfaces.Newable<NotificationsApi>;
|
|
26
26
|
}
|
|
27
27
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useState, FC } from 'react';
|
|
1
|
+
import { useState, FC, PropsWithChildren } from 'react';
|
|
2
2
|
import { createPortal } from 'react-dom';
|
|
3
3
|
|
|
4
4
|
import retargetEvents from 'react-shadow-dom-retarget-events';
|
|
@@ -17,7 +17,7 @@ function createLink(url: string, onLoad: () => void) {
|
|
|
17
17
|
return element;
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
export const ShadowDOM: FC = ({ children }) => {
|
|
20
|
+
export const ShadowDOM: FC<PropsWithChildren> = ({ children }) => {
|
|
21
21
|
const [target, setTarget] = useState<Element | null>(null);
|
|
22
22
|
const [loaded, setLoaded] = useState(false);
|
|
23
23
|
const styleSheets = useStyleSheets();
|