4e3f3b54cb
* add docs for medusa ui 2.0.0 * fix: copy as child example * fix: dropdown menu example * add accordion examples * fix lint issues * fix apos in progress tabs demo * resolve comments * add icon * bump z-index on modals to prevent clashing with navbar * add sidebar item and card * undo modal z index changes * add links to updated and new components * update version * rm inline code formatting on links --------- Co-authored-by: Shahed Nasser <shahednasser@gmail.com>
36 lines
1.3 KiB
TypeScript
36 lines
1.3 KiB
TypeScript
import { CodeBlock, Label } from "@medusajs/ui"
|
|
|
|
const snippets = [
|
|
{
|
|
label: "cURL",
|
|
language: "markdown",
|
|
code: `curl -H 'x-publishable-key: YOUR_API_KEY' 'http://localhost:9000/store/products/PRODUCT_ID'`,
|
|
hideLineNumbers: true,
|
|
},
|
|
{
|
|
label: "Medusa JS Client",
|
|
language: "jsx",
|
|
code: `// Install the JS Client in your storefront project: @medusajs/medusa-js\n\nimport Medusa from "@medusajs/medusa-js"\n\nconst medusa = new Medusa({ publishableApiKey: "YOUR_API_KEY"})\nconst product = await medusa.products.retrieve("PRODUCT_ID")\nconsole.log(product.id)`,
|
|
},
|
|
{
|
|
label: "Medusa React",
|
|
language: "tsx",
|
|
code: `// Install the React SDK and required dependencies in your storefront project:\n// medusa-react @tanstack/react-query @medusajs/medusa\n\nimport { useProduct } from "medusa-react"\n\nconst { product } = useProduct("PRODUCT_ID")\nconsole.log(product.id)`,
|
|
},
|
|
]
|
|
|
|
export default function CodeBlockDemo() {
|
|
return (
|
|
<div className="w-full">
|
|
<CodeBlock snippets={snippets}>
|
|
<CodeBlock.Header>
|
|
<CodeBlock.Header.Meta>
|
|
<Label weight={"plus"}>/product-detail.js</Label>
|
|
</CodeBlock.Header.Meta>
|
|
</CodeBlock.Header>
|
|
<CodeBlock.Body />
|
|
</CodeBlock>
|
|
</div>
|
|
)
|
|
}
|