From f89b39d2d529e5049cdd3073acde2bd5d97d9f70 Mon Sep 17 00:00:00 2001 From: Ryan Waits Date: Tue, 29 Oct 2024 20:41:29 -0500 Subject: [PATCH 01/51] add initial design to components and remove old references to langs --- app/(home)/page.client.tsx | 441 ------------------ app/global.css | 36 +- components/code-block.tsx | 59 --- components/docskit/code-group.tsx | 3 +- components/docskit/code.client.tsx | 10 +- components/docskit/code.tsx | 7 +- components/docskit/components.tsx | 5 - components/docskit/copy-button.tsx | 3 +- components/docskit/inline-code.tsx | 2 +- components/docskit/notes.tooltip.tsx | 2 +- components/docskit/notes.tsx | 1 - components/docskit/terminal.client.tsx | 2 +- components/docskit/terminal.tsx | 2 +- components/docskit/theme.mjs | 6 +- components/themes.js | 19 - .../ordinals/api/brc20/get-brc20-activity.mdx | 4 +- .../ordinals/api/brc20/get-brc20-balances.mdx | 4 +- .../api/brc20/get-brc20-token-details.mdx | 4 +- .../api/brc20/get-brc20-token-holders.mdx | 4 +- .../ordinals/api/brc20/get-brc20-tokens.mdx | 4 +- .../docs/bitcoin/ordinals/api/info/status.mdx | 4 +- .../inscriptions/get-inscription-content.mdx | 4 +- .../get-inscription-transfers.mdx | 4 +- .../api/inscriptions/get-inscription.mdx | 4 +- .../api/inscriptions/get-inscriptions.mdx | 4 +- .../inscriptions/get-transfers-per-block.mdx | 4 +- .../api/satoshis/get-satoshi-inscriptions.mdx | 4 +- .../ordinals/api/satoshis/get-satoshi.mdx | 4 +- .../get-stats-inscription-count.mdx | 4 +- .../ordhook/guides/ordhook-as-a-service.mdx | 4 +- .../bitcoin/ordinals/ordhook/installation.mdx | 5 +- .../bitcoin/ordinals/ordhook/quickstart.mdx | 15 +- .../bitcoin/runes/api/activities/activity.mdx | 4 +- .../runes/api/activities/for-address.mdx | 4 +- .../runes/api/activities/for-block.mdx | 4 +- .../runes/api/activities/for-transaction.mdx | 4 +- .../bitcoin/runes/api/balances/address.mdx | 4 +- .../runes/api/balances/holder-balance.mdx | 4 +- .../bitcoin/runes/api/balances/holders.mdx | 4 +- .../runes/api/etchings/get-etching.mdx | 4 +- .../runes/api/etchings/get-etchings.mdx | 4 +- .../docs/bitcoin/runes/api/info/status.mdx | 4 +- .../bitcoin/runes/runehook/installation.mdx | 5 +- .../bitcoin/runes/runehook/quickstart.mdx | 47 -- content/docs/guides/docskit.mdx | 31 +- content/docs/guides/no-loss-lottery.mdx | 14 +- content/docs/guides/sync-a-bitcoin-node.mdx | 16 +- content/docs/guides/sync-a-stacks-node.mdx | 14 +- content/docs/stacks/api/accounts/assets.mdx | 4 +- content/docs/stacks/api/accounts/balances.mdx | 4 +- .../api/accounts/inbound-stx-transfers.mdx | 4 +- .../docs/stacks/api/accounts/latest-nonce.mdx | 4 +- .../docs/stacks/api/accounts/nft-events.mdx | 4 +- .../docs/stacks/api/accounts/stx-balances.mdx | 4 +- .../accounts/transaction-with-transfers.mdx | 4 +- .../accounts/transactions-with-transfers.mdx | 4 +- .../docs/stacks/api/accounts/transactions.mdx | 4 +- .../docs/stacks/api/blocks/average-times.mdx | 4 +- .../api/blocks/block-by-burn-block-hash.mdx | 4 +- .../api/blocks/block-by-burn-block-height.mdx | 4 +- .../docs/stacks/api/blocks/block-by-hash.mdx | 4 +- .../stacks/api/blocks/block-by-height.mdx | 4 +- content/docs/stacks/api/blocks/get-block.mdx | 4 +- .../api/blocks/get-blocks-by-burn-block.mdx | 4 +- content/docs/stacks/api/blocks/get-blocks.mdx | 4 +- .../docs/stacks/api/blocks/recent-blocks.mdx | 4 +- .../stacks/api/burn-blocks/get-burn-block.mdx | 4 +- .../api/burn-blocks/get-burn-blocks.mdx | 4 +- .../stacks/api/concepts/nonce-handling.mdx | 6 +- content/docs/stacks/api/faucets/stx.mdx | 4 +- content/docs/stacks/api/fees/fee-rate.mdx | 4 +- .../circulating-stx-supply-in-plain-text.mdx | 4 +- .../legacy-total-and-unlocked-stx-supply.mdx | 4 +- .../stacks/api/info/network-block-time.mdx | 4 +- .../api/info/network-given-block-time.mdx | 4 +- content/docs/stacks/api/info/status.mdx | 4 +- .../info/total-and-unlocked-stx-supply.mdx | 4 +- .../info/total-stx-supply-in-plain-text.mdx | 4 +- .../mempool/transaction-fee-priorities.mdx | 4 +- .../stacks/api/names/historical-zonefile.mdx | 4 +- .../docs/stacks/api/names/name-details.mdx | 4 +- .../docs/stacks/api/names/name-subdomains.mdx | 4 +- .../docs/stacks/api/names/name-zonefile.mdx | 4 +- content/docs/stacks/api/names/names.mdx | 4 +- .../docs/stacks/api/names/namespace-names.mdx | 4 +- content/docs/stacks/api/names/namespaces.mdx | 4 +- .../stacks/api/names/owned-by-address.mdx | 4 +- .../api/non-fungible-tokens/history.mdx | 4 +- .../api/non-fungible-tokens/holdings.mdx | 4 +- .../stacks/api/non-fungible-tokens/mints.mdx | 4 +- .../stacks/api/proof-of-transfer/cycle.mdx | 4 +- .../stacks/api/proof-of-transfer/cycles.mdx | 4 +- .../api/proof-of-transfer/signer-in-cycle.mdx | 4 +- .../proof-of-transfer/signers-in-cycle.mdx | 4 +- .../stackers-for-signer-in-cycle.mdx | 4 +- .../docs/stacks/api/search/search-by-id.mdx | 4 +- .../stacks/api/smart-contracts/by-trait.mdx | 4 +- .../stacks/api/smart-contracts/events.mdx | 4 +- .../docs/stacks/api/smart-contracts/info.mdx | 4 +- .../stacks/api/smart-contracts/status.mdx | 4 +- .../docs/stacks/api/stacking-pool/members.mdx | 4 +- .../recent-burnchain-reward-recipient.mdx | 4 +- .../recent-burnchain-reward-recipients.mdx | 4 +- .../recent-reward-slot-holder-entries.mdx | 4 +- .../recent-reward-slot-holders.mdx | 4 +- .../total-burnchain-rewards-for-recipient.mdx | 4 +- content/docs/stacks/api/tokens/holders.mdx | 4 +- .../api/transactions/address-transactions.mdx | 4 +- .../transactions/details-for-transactions.mdx | 4 +- .../dropped-mempool-transactions.mdx | 4 +- .../events-for-an-address-transaction.mdx | 4 +- .../api/transactions/get-raw-transaction.mdx | 4 +- .../api/transactions/get-transaction.mdx | 4 +- .../api/transactions/mempool-transactions.mdx | 4 +- .../api/transactions/recent-transactions.mdx | 4 +- .../statistics-for-mempool-transactions.mdx | 4 +- .../api/transactions/transaction-events.mdx | 4 +- .../transactions/transactions-by-block.mdx | 4 +- .../transactions/transactions-for-address.mdx | 4 +- content/docs/stacks/api/txs.mdx | 29 +- content/docs/stacks/api/usage.mdx | 12 +- .../docs/stacks/archive/guides/stacks-api.mdx | 11 +- .../archive/guides/stacks-blockchain.mdx | 5 +- .../archive/guides/token-metadata-api.mdx | 6 +- .../archive/guides/verify-archive-data.mdx | 8 +- ...hainhook-as-a-service-with-stacks-node.mdx | 67 +-- .../guides/chainhook-as-a-service.mdx | 121 +---- .../guides/observing-contract-calls.mdx | 45 +- .../guides/register-chainhooks-on-devnet.mdx | 16 +- .../docs/stacks/chainhook/installation.mdx | 20 +- content/docs/stacks/chainhook/meta.json | 5 - content/docs/stacks/chainhook/quickstart.mdx | 8 +- .../guides/integration-testing.mdx | 22 +- .../guides/migrate-to-the-clarinet-sdk.mdx | 10 +- .../clarinet-js-sdk/guides/unit-testing.mdx | 22 +- .../stacks/clarinet-js-sdk/quickstart.mdx | 20 +- .../references/custom-matchers.mdx | 4 +- .../clarinet-js-sdk/references/methods.mdx | 22 +- .../clarinet-js-sdk/references/simnet.mdx | 2 +- .../stacks/clarinet/guides/add-a-contract.mdx | 4 +- .../clarinet/guides/create-a-new-project.mdx | 4 +- .../guides/create-deployment-plans.mdx | 16 +- .../clarinet/guides/debug-a-contract.mdx | 22 +- .../clarinet/guides/deploy-a-contract.mdx | 8 +- .../stacks/clarinet/guides/estimate-costs.mdx | 18 +- .../clarinet/guides/run-a-local-devnet.mdx | 4 +- .../clarinet/guides/validate-a-contract.mdx | 15 +- content/docs/stacks/clarinet/installation.mdx | 52 +-- content/docs/stacks/clarinet/quickstart.mdx | 29 +- .../docs/stacks/hacks/build-a-custom-api.mdx | 4 +- .../build-a-decentralized-grants-program.mdx | 86 ++-- .../hacks/build-a-friend-tech-clone.mdx | 34 +- .../docs/stacks/nakamoto/guides/clarinet.mdx | 12 +- .../stacks/platform-api/chainhooks/create.mdx | 4 +- .../stacks/platform-api/chainhooks/delete.mdx | 4 +- .../stacks/platform-api/chainhooks/get.mdx | 4 +- .../stacks/platform-api/chainhooks/list.mdx | 4 +- .../stacks/platform-api/chainhooks/update.mdx | 4 +- .../platform-api/devnet/bitcoin-node.mdx | 8 +- .../devnet/stacks-blockchain-api.mdx | 8 +- .../docs/stacks/platform-api/devnet/start.mdx | 4 +- .../docs/stacks/platform-api/devnet/stop.mdx | 4 +- .../guides/connect-desktop-to-cloud.mdx | 30 +- content/docs/stacks/rpc-api/accounts/info.mdx | 4 +- .../stacks/rpc-api/blocks/block-proposal.mdx | 4 +- .../rpc-api/burn-ops/get-burn-operations.mdx | 4 +- content/docs/stacks/rpc-api/fees/estimate.mdx | 4 +- .../stacks/rpc-api/fees/transfer-estimate.mdx | 4 +- content/docs/stacks/rpc-api/info/core-api.mdx | 4 +- .../docs/stacks/rpc-api/names/name-price.mdx | 4 +- .../stacks/rpc-api/names/namespace-price.mdx | 4 +- .../docs/stacks/rpc-api/pox/pox-details.mdx | 4 +- .../docs/stacks/rpc-api/pox/stacker-set.mdx | 4 +- .../rpc-api/smart-contracts/constants.mdx | 4 +- .../rpc-api/smart-contracts/interface.mdx | 4 +- .../rpc-api/smart-contracts/map-entry.mdx | 4 +- .../rpc-api/smart-contracts/read-only.mdx | 4 +- .../stacks/rpc-api/smart-contracts/source.mdx | 4 +- .../stacks/rpc-api/smart-contracts/traits.mdx | 4 +- .../rpc-api/smart-contracts/variables.mdx | 4 +- .../transactions/broadcast-transaction.mdx | 4 +- .../docs/stacks/rpc-api/v3/nakamoto-block.mdx | 4 +- .../docs/stacks/rpc-api/v3/tenure-blocks.mdx | 4 +- .../stacks/rpc-api/v3/tenure-metadata.mdx | 4 +- .../guides/use-with-react-native.mdx | 24 +- .../stacks/token-metadata-api/info/status.mdx | 4 +- .../tokens/fungible-token-metadata.mdx | 4 +- .../tokens/fungible-tokens.mdx | 4 +- .../tokens/non-fungible-token-metadata.mdx | 4 +- .../tokens/semi-fungible-token-metadata.mdx | 4 +- .../docs/stacks/token-metadata-api/usage.mdx | 13 +- mdx-components.tsx | 13 +- next.config.mjs | 10 +- package.json | 2 +- snippets/api-keys.mdx | 8 +- snippets/contributors-guide.mdx | 20 +- tailwind.config.js | 3 +- 197 files changed, 710 insertions(+), 1455 deletions(-) delete mode 100644 app/(home)/page.client.tsx delete mode 100644 components/code-block.tsx delete mode 100644 components/themes.js diff --git a/app/(home)/page.client.tsx b/app/(home)/page.client.tsx deleted file mode 100644 index d0cd3c33a..000000000 --- a/app/(home)/page.client.tsx +++ /dev/null @@ -1,441 +0,0 @@ -"use client"; - -import React, { - useEffect, - useState, - Fragment, - type ReactElement, - type HTMLAttributes, - type ReactNode, -} from "react"; -import { TerminalIcon } from "lucide-react"; -import { NextSVG, ContentlayerIcon, OpenAPIIcon } from "./icons"; -import { cva } from "class-variance-authority"; -import { cn } from "@/utils/cn"; - -const linkItemVariants = cva("transition-colors dark:hover:bg-muted"); - -export function Previews(): JSX.Element { - return ( -
-

I'm satisfied with it

- - - @joulev - -

Next.js Expert

-
- ); -} - -interface IntegrationProps extends HTMLAttributes { - codeBlocks?: { key: string; message: string; block: ReactNode }[]; -} - -export function Integration({ - className, - codeBlocks, - ...props -}: IntegrationProps): JSX.Element { - const [activeSection, setActiveSection] = React.useState("clarinet"); - const activeCodeBlock = codeBlocks?.find( - (block) => block.key === activeSection - ); - - return ( -
-
setActiveSection("clarinet")} - className={cn( - linkItemVariants(), - "cursor-pointer", - activeSection === "clarinet" && "bg-muted/80", - activeSection !== "clarinet" && "hover:bg-muted" - )} - > - -

Clarinet

-

- Everything you need to write, test, integrate and deploy smart - contracts. -

-
-
setActiveSection("stacks.js")} - className={cn( - linkItemVariants(), - "cursor-pointer", - activeSection === "stacks.js" && "bg-muted/80", - activeSection !== "stacks.js" && "hover:bg-muted" - )} - > - -

Stacks.js

-

- A collection of libraries for building on the Stacks blockchain. -

-
-
setActiveSection("chainhook")} - className={cn( - linkItemVariants(), - "cursor-pointer", - activeSection === "chainhook" && "bg-muted/80", - activeSection !== "chainhook" && "hover:bg-muted" - )} - > - -

Chainhook

-

- Stream blockchain events and trigger off-chain actions for your apps - use case. -

-
-
-

{activeCodeBlock?.message}

- {activeCodeBlock?.block ?? null} -
-
- {activeSection === "clarinet" && } - {activeSection === "stacks.js" && } - {activeSection === "chainhook" && } -
-
- ); -} - -export function ClarinetAppAnimation(): JSX.Element { - const installCmd = "clarinet new sbtc"; - const tickTime = 100; - const timeCommandEnter = installCmd.length; - const timeCommandRun = timeCommandEnter + 7; - const timeCommandEnd = timeCommandRun + 7; - const timeWindowOpen = timeCommandEnd + 1; - const timeEnd = timeWindowOpen + 1; - - const [tick, setTick] = useState(timeEnd); - - useEffect(() => { - const timer = setInterval(() => { - setTick((prev) => (prev >= timeEnd ? prev : prev + 1)); - }, tickTime); - - return () => { - clearInterval(timer); - }; - }, [timeEnd]); - - const lines: ReactElement[] = []; - - lines.push( - - {installCmd.substring(0, tick)} - {tick < timeCommandEnter && ( -
- )} - - ); - - if (tick >= timeCommandEnter) { - lines.push( ); - } - - if (tick > timeCommandRun) - lines.push( - - - Created directory sbtc - - {tick > timeCommandRun + 1 && ( - - Created directory{" "} - sbtc/contracts - - )} - {tick > timeCommandRun + 2 && ( - - Created directory{" "} - sbtc/settings - - )} - {tick > timeCommandRun + 3 && ( - - Created directory sbtc/tests - - )} - {tick > timeCommandRun + 4 && ( - - Created file{" "} - sbtc/Clarinet.toml - - )} - {tick > timeCommandRun + 5 && ( - - Created file{" "} - sbtc/settings/Mainnet.toml - - )} - {tick > timeCommandRun + 6 && ( - - Created file{" "} - sbtc/settings/Testnet.toml - - )} - {tick > timeCommandRun + 7 && ( - - Created file{" "} - sbtc/settings/Devnet.toml - - )} - - ); - - return ( -
{ - if (tick >= timeEnd) { - setTick(0); - } - }} - > - {tick > timeWindowOpen && ( - - )} - 
-        

-          {" "}
-          Terminal
-          

-          

-        

-        

-          {lines}
-        

-
-
- ); -} - -export function StacksJsAppAnimation(): JSX.Element { - const installCmd = "npx create stacks"; - const tickTime = 100; - const timeCommandEnter = installCmd.length; - const timeCommandRun = timeCommandEnter + 3; - const timeCommandEnd = timeCommandRun + 3; - const timeWindowOpen = timeCommandEnd + 1; - const timeEnd = timeWindowOpen + 1; - - const [tick, setTick] = useState(timeEnd); - - useEffect(() => { - const timer = setInterval(() => { - setTick((prev) => (prev >= timeEnd ? prev : prev + 1)); - }, tickTime); - - return () => { - clearInterval(timer); - }; - }, [timeEnd]); - - const lines: ReactElement[] = []; - - lines.push( - - {installCmd.substring(0, tick)} - {tick < timeCommandEnter && ( -
- )} - - ); - - if (tick >= timeCommandEnter) { - lines.push( ); - } - - if (tick > timeCommandRun) - lines.push( - - ┌ Create Stacks App - │ - {tick > timeCommandRun + 1 && ( - <> - ◇ Project name - │ my-app - - )} - {tick > timeCommandRun + 2 && ( - <> - │ - ◆ Choose a template - - )} - {tick > timeCommandRun + 3 && ( - <> - - │ ● Blank project - - │ ○ NFT Marketplace - - )} - - ); - - return ( -
{ - if (tick >= timeEnd) { - setTick(0); - } - }} - > - {tick > timeWindowOpen && ( - - )} - 
-        

-          {" "}
-          Terminal
-          

-          

-        

-        

-          {lines}
-        

-
-
- ); -} - -export function ChainhookAppAnimation(): JSX.Element { - const installCmd = "$ chainhook predicates scan ordinals.json --mainnet"; - const tickTime = 100; - const timeCommandEnter = installCmd.length; - const timeCommandRun = timeCommandEnter + 2; - const timeCommandEnd = timeCommandRun + 2; - const timeWindowOpen = timeCommandEnd + 1; - const timeEnd = timeWindowOpen + 1; - - const [tick, setTick] = useState(timeEnd); - - useEffect(() => { - const timer = setInterval(() => { - setTick((prev) => (prev >= timeEnd ? prev : prev + 1)); - }, tickTime); - - return () => { - clearInterval(timer); - }; - }, [timeEnd]); - - const lines: ReactElement[] = []; - - lines.push( - - {installCmd.substring(0, tick)} - {tick < timeCommandEnter && ( -
- )} - - ); - - if (tick >= timeCommandEnter) { - lines.push( ); - } - - if (tick > timeCommandRun) - lines.push( - - - Apr 20 20:42:00.123 - INFO Starting predicate - evaluation on Stacks blocks - - {tick > timeCommandRun + 1 && ( - - Apr 20 20:42:00.124 - INFO 4200 blocks scanned, 6 - occurences found - - )} - - ); - - return ( -
{ - if (tick >= timeEnd) { - setTick(0); - } - }} - > - {tick > timeWindowOpen && ( - - )} - 
-        

-          {" "}
-          Terminal
-          

-          

-        

-        

-          {lines}
-        

-
-
- ); -} - -interface LaunchAppWindowProps extends HTMLAttributes { - title: string; - message: string; -} - -function LaunchAppWindow({ - title, - message, - ...props -}: LaunchAppWindowProps): JSX.Element { - return ( -
-
-

{title}

-
-
{message}
-
- ); -} diff --git a/app/global.css b/app/global.css index b002d6599..f02a9dd4f 100644 --- a/app/global.css +++ b/app/global.css @@ -30,7 +30,7 @@ --code: 0 0% 100%; --highlight: 40 13% 91%; --content: 32.31 11.93% 78.63%; - --dark: 20 14.3% 4.1%; + --dark: 30 5.7% 7.5%; --contrast:0 7.7% 5.1%; } @@ -61,7 +61,7 @@ --code: 0 7.7% 5.1%; --highlight: 12 6.2% 15.9%; --content: 40 5.33% 33.14%; - --dark: 20 14.3% 4.1%; + --dark: 30 5.7% 7.5%; --contrast: 0 0% 100%; } @@ -443,16 +443,16 @@ div.divide-y.divide-border.overflow-hidden.rounded-lg.border.bg-card { @layer base { :root { --ch-0: light; - --ch-1: #4C4F69; - --ch-2: #7C7F93; - --ch-3: #9CA0B0; - --ch-4: #40A02B; + --ch-1: #7A756B; + --ch-2: #7C7F93; /* Not used */ + --ch-3: #B5ACA1; + --ch-4: #48944C; --ch-5: #EA76CB; - --ch-6: #FE640B; - --ch-7: #8839EF; + --ch-6: #FF5500; + --ch-7: #BC812E; --ch-8: #179299; - --ch-9: #1E66F5; - --ch-10: #DF8E1D; + --ch-9: #3676B7; + --ch-10: #BC812E; --ch-11: #E64553; --ch-12: #D20F39; --ch-13: #04A5E5; @@ -480,16 +480,16 @@ div.divide-y.divide-border.overflow-hidden.rounded-lg.border.bg-card { .dark { --ch-0: dark; - --ch-1: #CDD6F4; - --ch-2: #9399B2; - --ch-3: #6C7086; - --ch-4: #A6E3A1; + --ch-1: #8C877D; + --ch-2: #9399B2; /* Not used */ + --ch-3: #595650; + --ch-4: #C2EBC4; --ch-5: #F5C2E7; - --ch-6: #FAB387; - --ch-7: #CBA6F7; + --ch-6: #FF5500; + --ch-7: #FF9ECF; --ch-8: #94E2D5; - --ch-9: #89B4FA; - --ch-10: #F9E2AF; + --ch-9: #B3D9FF; + --ch-10: #FF9ECF; --ch-11: #EBA0AC; --ch-12: #F38BA8; --ch-13: #89DCEB; diff --git a/components/code-block.tsx b/components/code-block.tsx deleted file mode 100644 index d1c001a09..000000000 --- a/components/code-block.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import * as Base from "fumadocs-ui/components/codeblock"; -import type { HTMLAttributes } from "react"; -import { useMemo } from "react"; -import { getHighlighter } from "shiki"; - -const highlighter = await getHighlighter({ - langs: ["bash", "console", "ts", "tsx"], - themes: [ - "github-light", - "github-dark", - "catppuccin-latte", - "catppuccin-mocha", - ], -}); - -export type CodeBlockProps = HTMLAttributes & { - code: string; - wrapper?: Base.CodeBlockProps; - lang: "bash" | "console" | "ts" | "tsx"; -}; - -export function CodeBlock({ - code, - lang, - wrapper, - ...props -}: CodeBlockProps): React.ReactElement { - const html = useMemo( - () => - highlighter.codeToHtml(code, { - lang, - defaultColor: false, - themes: { - light: "catppuccin-latte", - dark: "catppuccin-mocha", - }, - transformers: [ - { - name: "remove-pre", - root: (root) => { - if (root.children[0].type !== "element") return; - - return { - type: "root", - children: root.children[0].children, - }; - }, - }, - ], - }), - [code, lang] - ); - - return ( - - - - ); -} diff --git a/components/docskit/code-group.tsx b/components/docskit/code-group.tsx index a8b7fb85a..1b547c235 100644 --- a/components/docskit/code-group.tsx +++ b/components/docskit/code-group.tsx @@ -1,5 +1,4 @@ -export const TITLEBAR = - "border-b-[1px] border-ch-border bg-ch-tabs-background px-2 py-1 w-full h-10 font-inter"; +export const TITLEBAR = "px-2 py-1 w-full h-10 font-inter"; export const CODEBLOCK = "border rounded selection:bg-ch-selection border-ch-border overflow-hidden my-4 relative"; diff --git a/components/docskit/code.client.tsx b/components/docskit/code.client.tsx index 4cfd46a83..529a82243 100644 --- a/components/docskit/code.client.tsx +++ b/components/docskit/code.client.tsx @@ -36,11 +36,7 @@ export function MultiCode({ group }: { group: CodeGroup }) { value={title} className={cn( "rounded-none relative transition-colors duration-200 gap-2 px-3 font-mono", - "[&[data-state=active]>.absolute]:bg-ch-background", // bottom border - "border-transparent border-x data-[state=active]:border-x-ch-border first:border-l-0", // x-border - "border-t data-[state=active]:border-t-ch-active-border", // top border - "text-ch-tab-inactive-foreground data-[state=active]:text-ch-tab-active-foreground hover:text-ch-tab-active-foreground", // text - "data-[state=active]:bg-ch-background" + "text-ch-tab-inactive-foreground data-[state=active]:text-ch-tab-active-foreground hover:text-ch-tab-active-foreground" // text )} > {icon} @@ -55,9 +51,9 @@ export function MultiCode({ group }: { group: CodeGroup }) { )} {current.pre} diff --git a/components/docskit/code.tsx b/components/docskit/code.tsx index d08953e01..191d1ec58 100644 --- a/components/docskit/code.tsx +++ b/components/docskit/code.tsx @@ -35,7 +35,7 @@ function SingleCode({ group }: { group: CodeGroup }) { const { pre, style, code, title, icon, options } = tab; const hasTitle = title?.trim() !== ""; return ( -
+
{hasTitle && (
diff --git a/components/docskit/components.tsx b/components/docskit/components.tsx index 622929677..e64053402 100644 --- a/components/docskit/components.tsx +++ b/components/docskit/components.tsx @@ -29,11 +29,9 @@ function DocsKitCode(props: { codeblock: RawCode }) { } if (codeblock.lang == "terminal") { - // @ts-expect-error Async Server Component return ; } - // @ts-expect-error Async Server Component return ; } @@ -50,7 +48,6 @@ function CodeTabs(props: unknown) { const { code, flags, storage } = data; - // @ts-expect-error Async Server Component return ; } @@ -74,7 +71,6 @@ function DocsKitLink(props: any) { function PackageInstall({ codeblock }: { codeblock: RawCode }) { return ( - // @ts-expect-error Async Server Component ; } diff --git a/components/docskit/copy-button.tsx b/components/docskit/copy-button.tsx index aec588c22..e555833c6 100644 --- a/components/docskit/copy-button.tsx +++ b/components/docskit/copy-button.tsx @@ -16,7 +16,8 @@ export function CopyButton({ return (