Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(console): fix custom element swap in mdx #6166

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ def requires_auth(f):
<br/>

<InlineNotification>
For <a href="https://docs.logto.io/docs/recipes/rbac/" target="_blank" rel="noopener">🔐 RBAC</a>, scope validation is also required.
For <Anchor href="https://docs.logto.io/docs/recipes/rbac/" target="_blank" rel="noopener">🔐 RBAC</Anchor>, scope validation is also required.
</InlineNotification>

</Step>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ git clone https://github.com/logto-io/dart

### Dependencies and Android settings

<details>
<Details>

<summary>flutter_secure_storage</summary>

Expand Down Expand Up @@ -117,19 +117,17 @@ To avoid this, you can disable auto backup for your app or exclude `sharedprefs`

Please check [flutter_secure_storage](https://pub.dev/packages/flutter_secure_storage#configure-android-version) for more details.

</details>
</Details>

<br />

<details>
<Details>

<summary>flutter_web_auth</summary>

[flutter_web_auth](https://pub.dev/packages/flutter_web_auth) is used behind Logto's flutter SDK. We rely on its webview-based interaction interface to authenticate users.

This plugin uses `ASWebAuthenticationSession` on iOS 12+ and macOS 10.15+, `SFAuthenticationSession` on iOS 11, `Chrome Custom Tabs` on Android and opens a new window on Web.

</details>
</Details>

</Step>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,20 +24,20 @@ Since Xcode 11, you can [directly import a swift package](https://developer.appl

We do not support **Carthage** and **CocoaPods** at the time due to some technical issues.

<details>
<Details>
<summary>Carthage</summary>

Carthage [needs a `xcodeproj` file to build](https://github.com/Carthage/Carthage/issues/1226#issuecomment-290931385), but `swift package generate-xcodeproj` will report a failure since we are using binary targets
for native social plugins. We will try to find a workaround later.

</details>
</Details>

<details>
<Details>
<summary>CocoaPods</summary>

CocoaPods [does not support local dependency](https://github.com/CocoaPods/CocoaPods/issues/3276) and monorepo, thus it's hard to create a `.podspec` for this repo.

</details>
</Details>

</Step>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import Checkpoint from '../../fragments/_checkpoint.md';
>

<InlineNotification>
The following demonstration is built upon the <a href="https://gin-gonic.com">Gin Web Framework</a>.
The following demonstration is built upon the <Anchor href="https://gin-gonic.com">Gin Web Framework</Anchor>.
You may also integrate Logto into other frameworks by taking the same steps.
</InlineNotification>

Expand Down
5 changes: 4 additions & 1 deletion packages/console/src/components/Guide/index.module.scss
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,11 @@
code:not(pre > code) {
background: var(--color-layer-2);
font: var(--font-body-2);
padding: _.unit(1);
border-radius: 4px;

&:not(a > code) {
padding: _.unit(1);
}
}

hr {
Expand Down
12 changes: 12 additions & 0 deletions packages/console/src/mdx-components/Anchor/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import TextLink from '@/ds-components/TextLink';

/**
* A custom anchor element that used to swap out the default one in MDX.
*/
export default function Anchor({ children, ...props }: JSX.IntrinsicElements['a']) {
return (
<TextLink {...props} targetBlank>
{children}
</TextLink>
);
}
11 changes: 4 additions & 7 deletions packages/console/src/mdx-components/MdxProvider/index.tsx
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import { MDXProvider } from '@mdx-js/react';
import type React from 'react';

import TextLink from '@/ds-components/TextLink';

import Anchor from '../Anchor';
import Code from '../Code';
import DetailsSummary from '../DetailsSummary';

Expand All @@ -19,12 +18,10 @@ export default function MdxProvider({ children }: Props) {
// custom component now.
// See: https://github.com/orgs/mdx-js/discussions/2231#discussioncomment-4729474
Code,
a: ({ children, ...props }) => (
<TextLink {...props} targetBlank>
{children}
</TextLink>
),
a: Anchor,
Anchor,
details: DetailsSummary,
Details: DetailsSummary,
}}
>
{children}
Expand Down
Loading