@lark-apaas/client-toolkit 1.2.52-alpha.2 → 1.2.52
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/lib/apis/components/UniversalLink.d.ts +3 -0
- package/lib/apis/components/UniversalLink.js +42 -3
- package/lib/components/AppContainer/safety.js +50 -0
- package/lib/locales/messages.js +4 -0
- package/lib/types/iframe-events.d.ts +12 -1
- package/lib/utils/postMessage.d.ts +1 -0
- package/lib/utils/postMessage.js +1 -1
- package/package.json +1 -1
|
@@ -8,5 +8,8 @@ export interface UniversalLinkProps extends Omit<React.AnchorHTMLAttributes<HTML
|
|
|
8
8
|
* - 内部路由（/dashboard）→ react-router Link
|
|
9
9
|
* - Hash 锚点（#section）→ <a>
|
|
10
10
|
* - 外链（https://...）→ <a target="_blank">
|
|
11
|
+
*
|
|
12
|
+
* 预览态（iframe 内）时，通过 postMessage 通知父页面处理链接跳转，
|
|
13
|
+
* 避免浏览器安全策略限制导致链接无法正常打开。
|
|
11
14
|
*/
|
|
12
15
|
export declare const UniversalLink: React.ForwardRefExoticComponent<UniversalLinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
|
@@ -1,23 +1,62 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import react from "react";
|
|
3
3
|
import { Link } from "react-router-dom";
|
|
4
|
+
import { isPreview } from "../../utils/utils.js";
|
|
5
|
+
import { getParentOriginFromParams, submitPostMessage } from "../../utils/postMessage.js";
|
|
4
6
|
function isInternalRoute(to) {
|
|
5
7
|
return !to.startsWith('#') && !to.startsWith('http://') && !to.startsWith('https://') && !to.startsWith('//');
|
|
6
8
|
}
|
|
7
9
|
function isExternalLink(to) {
|
|
8
10
|
return to.startsWith('http://') || to.startsWith('https://') || to.startsWith('//');
|
|
9
11
|
}
|
|
10
|
-
|
|
12
|
+
function isIframeUnderMainHost() {
|
|
13
|
+
if ('undefined' == typeof window) return false;
|
|
14
|
+
if (window.parent === window) return false;
|
|
15
|
+
if (getParentOriginFromParams()) return true;
|
|
16
|
+
const envOrigin = process.env.FORCE_FRAMEWORK_DOMAIN_MAIN;
|
|
17
|
+
if (!envOrigin || !document.referrer) return false;
|
|
18
|
+
try {
|
|
19
|
+
return new URL(document.referrer).origin === envOrigin;
|
|
20
|
+
} catch {
|
|
21
|
+
return false;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
const UniversalLink_UniversalLink = /*#__PURE__*/ react.forwardRef(function({ to, onClick, ...props }, ref) {
|
|
25
|
+
const isExternal = isExternalLink(to);
|
|
26
|
+
const preview = (isPreview() || isIframeUnderMainHost()) && isExternal;
|
|
27
|
+
if (preview) {
|
|
28
|
+
const handlePreviewClick = (e)=>{
|
|
29
|
+
e.preventDefault();
|
|
30
|
+
onClick?.(e);
|
|
31
|
+
submitPostMessage({
|
|
32
|
+
type: 'OpenIframeLink',
|
|
33
|
+
data: {
|
|
34
|
+
href: to,
|
|
35
|
+
external: true
|
|
36
|
+
}
|
|
37
|
+
});
|
|
38
|
+
};
|
|
39
|
+
return /*#__PURE__*/ jsx("a", {
|
|
40
|
+
href: to,
|
|
41
|
+
ref: ref,
|
|
42
|
+
...props,
|
|
43
|
+
onClick: handlePreviewClick,
|
|
44
|
+
target: props.target ?? '_blank',
|
|
45
|
+
rel: props.rel ?? 'noopener noreferrer'
|
|
46
|
+
});
|
|
47
|
+
}
|
|
11
48
|
if (isInternalRoute(to)) return /*#__PURE__*/ jsx(Link, {
|
|
12
49
|
to: to,
|
|
13
50
|
ref: ref,
|
|
14
|
-
...props
|
|
51
|
+
...props,
|
|
52
|
+
onClick: onClick
|
|
15
53
|
});
|
|
16
54
|
return /*#__PURE__*/ jsx("a", {
|
|
17
55
|
href: to,
|
|
18
56
|
ref: ref,
|
|
19
57
|
...props,
|
|
20
|
-
|
|
58
|
+
onClick: onClick,
|
|
59
|
+
...isExternal && {
|
|
21
60
|
target: props.target ?? '_blank',
|
|
22
61
|
rel: props.rel ?? 'noopener noreferrer'
|
|
23
62
|
}
|
|
@@ -2,12 +2,32 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { useEffect, useRef, useState } from "react";
|
|
3
3
|
import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover.js";
|
|
4
4
|
import { getAppId } from "../../utils/getAppId.js";
|
|
5
|
+
import { getEnv } from "../../utils/getParentOrigin.js";
|
|
5
6
|
import { getCsrfToken } from "../../utils/getCsrfToken.js";
|
|
6
7
|
import { isNewPathEnabled } from "../../utils/apiPath.js";
|
|
7
8
|
import { useIsMobile } from "../../hooks/index.js";
|
|
8
9
|
import { X } from "lucide-react";
|
|
9
10
|
import { Sheet, SheetContent, SheetTrigger } from "../ui/drawer.js";
|
|
10
11
|
import { t } from "../../locales/index.js";
|
|
12
|
+
const ICON_FEEDBACK_URL = 'https://lf3-static.bytednsdoc.com/obj/eden-cn/LMfspH/ljhwZthlaukjlkulzlp/miaoda-ui/icon_feedback_outlined.png';
|
|
13
|
+
const REPORT_DOMAIN = {
|
|
14
|
+
BOE: 'tns.feishu-boe.cn',
|
|
15
|
+
PRE: 'tns.feishu-pre.cn',
|
|
16
|
+
ONLINE: 'tns.feishu.cn'
|
|
17
|
+
};
|
|
18
|
+
const openReport = ()=>{
|
|
19
|
+
const appId = getAppId();
|
|
20
|
+
if (!appId) return;
|
|
21
|
+
const params = JSON.stringify({
|
|
22
|
+
scene: 'miaoda_app_report',
|
|
23
|
+
entity_id: appId,
|
|
24
|
+
entity_type: 'miaoda_app',
|
|
25
|
+
extra: ''
|
|
26
|
+
});
|
|
27
|
+
const domain = REPORT_DOMAIN[getEnv()] ?? REPORT_DOMAIN.ONLINE;
|
|
28
|
+
const url = `https://${domain}/cust/lark_report/?type=common¶ms=${encodeURIComponent(params)}&lang=zh-CN`;
|
|
29
|
+
window.open(url, '_blank', 'noopener,noreferrer');
|
|
30
|
+
};
|
|
11
31
|
const Component = ()=>{
|
|
12
32
|
const HasClosedKey = `miaoda-creatByMiaoda-has-closed-${getAppId()}`;
|
|
13
33
|
const [visible, setVisible] = useState(!window.localStorage?.getItem(HasClosedKey));
|
|
@@ -129,6 +149,21 @@ const Component = ()=>{
|
|
|
129
149
|
children: t('safety.ai.disclaimer')
|
|
130
150
|
})
|
|
131
151
|
]
|
|
152
|
+
}),
|
|
153
|
+
/*#__PURE__*/ jsxs("div", {
|
|
154
|
+
className: "self-stretch shrink-0 flex items-center gap-x-[6px] cursor-pointer",
|
|
155
|
+
"data-custom-element": "safety-report",
|
|
156
|
+
onClick: openReport,
|
|
157
|
+
children: [
|
|
158
|
+
/*#__PURE__*/ jsx("img", {
|
|
159
|
+
src: ICON_FEEDBACK_URL,
|
|
160
|
+
className: "shrink-0 w-[14px] h-[14px]"
|
|
161
|
+
}),
|
|
162
|
+
/*#__PURE__*/ jsx("p", {
|
|
163
|
+
className: "shrink-0 m-0! text-[#646A73] text-sm underline underline-offset-2",
|
|
164
|
+
children: t('safety.report')
|
|
165
|
+
})
|
|
166
|
+
]
|
|
132
167
|
})
|
|
133
168
|
]
|
|
134
169
|
}),
|
|
@@ -248,6 +283,21 @@ const Component = ()=>{
|
|
|
248
283
|
children: t('safety.ai.disclaimer')
|
|
249
284
|
})
|
|
250
285
|
]
|
|
286
|
+
}),
|
|
287
|
+
/*#__PURE__*/ jsxs("div", {
|
|
288
|
+
className: "self-stretch shrink-0 flex items-center gap-x-[6px] cursor-pointer",
|
|
289
|
+
"data-custom-element": "safety-report",
|
|
290
|
+
onClick: openReport,
|
|
291
|
+
children: [
|
|
292
|
+
/*#__PURE__*/ jsx("img", {
|
|
293
|
+
src: ICON_FEEDBACK_URL,
|
|
294
|
+
className: "shrink-0 w-[12px] h-[12px]"
|
|
295
|
+
}),
|
|
296
|
+
/*#__PURE__*/ jsx("p", {
|
|
297
|
+
className: "shrink-0 m-0! text-[#a6a6a6] underline underline-offset-2",
|
|
298
|
+
children: t('safety.report')
|
|
299
|
+
})
|
|
300
|
+
]
|
|
251
301
|
})
|
|
252
302
|
]
|
|
253
303
|
}),
|
package/lib/locales/messages.js
CHANGED
|
@@ -23,6 +23,10 @@ const messages_messages = {
|
|
|
23
23
|
zh: '了解更多',
|
|
24
24
|
en: 'Learn more'
|
|
25
25
|
},
|
|
26
|
+
'safety.report': {
|
|
27
|
+
zh: '投诉与举报',
|
|
28
|
+
en: 'Report'
|
|
29
|
+
},
|
|
26
30
|
'safety.cover.pc': {
|
|
27
31
|
zh: 'https://lf3-static.bytednsdoc.com/obj/eden-cn/LMfspH/ljhwZthlaukjlkulzlp/logo/miaodacover.png',
|
|
28
32
|
en: 'https://lf3-static.bytednsdoc.com/obj/eden-cn/LMfspH/ljhwZthlaukjlkulzlp/logo/miaodacover-weben.png'
|
|
@@ -46,7 +46,18 @@ export interface DevServerMessage extends IframeMessage<{
|
|
|
46
46
|
}> {
|
|
47
47
|
type: 'DevServerMessage';
|
|
48
48
|
}
|
|
49
|
-
|
|
49
|
+
/**
|
|
50
|
+
* 预览态下链接点击通知父页面处理。
|
|
51
|
+
* iframe 内直接跳转可能被浏览器安全策略拦截，
|
|
52
|
+
* 通过 postMessage 让父页面在新标签页或外壳中打开链接。
|
|
53
|
+
*/
|
|
54
|
+
export interface OpenIframeLinkMessage extends IframeMessage<{
|
|
55
|
+
href: string;
|
|
56
|
+
external: boolean;
|
|
57
|
+
}> {
|
|
58
|
+
type: 'OpenIframeLink';
|
|
59
|
+
}
|
|
60
|
+
export type OutgoingMessage = PreviewReadyMessage | HmrMessage | ConsoleMessage | ChildLocationChangeMessage | CreatePageMessage | RenderErrorMessage | RenderErrorRepairMessage | PageScreenshotMessage | DevServerMessage | UpdateRoutesMessage | OpenIframeLinkMessage;
|
|
50
61
|
export interface GetRoutesMessage extends IframeMessage<Record<string, never>> {
|
|
51
62
|
type: 'GetRoutes';
|
|
52
63
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { IncomingMessage, OutgoingMessage } from '../types/iframe-events';
|
|
2
|
+
export declare function getParentOriginFromParams(): string | undefined;
|
|
2
3
|
export declare function resolveParentOrigin(): string;
|
|
3
4
|
export declare function submitPostMessage<T extends OutgoingMessage>(message: T, targetOrigin?: string): void;
|
|
4
5
|
export declare function isOutgoingMessage<T extends OutgoingMessage['type']>(msg: OutgoingMessage, type: T): msg is Extract<OutgoingMessage, {
|
package/lib/utils/postMessage.js
CHANGED
|
@@ -50,4 +50,4 @@ function isOutgoingMessage(msg, type) {
|
|
|
50
50
|
function isIncomingMessage(msg, type) {
|
|
51
51
|
return msg.type === type;
|
|
52
52
|
}
|
|
53
|
-
export { isIncomingMessage, isOutgoingMessage, resolveParentOrigin, submitPostMessage };
|
|
53
|
+
export { getParentOriginFromParams, isIncomingMessage, isOutgoingMessage, resolveParentOrigin, submitPostMessage };
|