Files
2026-07-13 13:32:57 +08:00

101 lines
2.8 KiB
TypeScript

import { CodeBlock } from "~/components/code/CodeBlock";
import { Header2 } from "~/components/primitives/Headers";
export default function Story() {
return (
<div className="flex flex-col items-start gap-y-8 p-8">
<div>
<Header2>Inline field</Header2>
<CodeBlock code={`{ id: "my-first-job" }`} />
</div>
<div>
<Header2 className="mb-2">With title row</Header2>
<CodeBlock
rowTitle="Trigger client"
code={`export const client = new TriggerClient("smoke-test", {
apiUrl: "http://localhost:3000",
endpoint: "http://localhost:3007/__trigger/entry",
logLevel: "debug",
longLine: "This is a long line that will scroll off the edge of the screen and cause a horizontal scrollbar",
});`}
/>
</div>
<div>
<Header2 className="mb-2">showChrome</Header2>
<CodeBlock
showChrome
fileName="trigger-client.ts"
code={`export const client = new TriggerClient("smoke-test", {
apiUrl: "http://localhost:3000",
endpoint: "http://localhost:3007/__trigger/entry",
logLevel: "debug",
longLine: "This is a long line that will scroll off the edge of the screen and cause a horizontal scrollbar",
onLog: (log) => {
console.log(log);
},
onLogError: (log) => {
console.error(log);
},
onLogWarning: (log) => {
console.warn(log);
},
onLogInfo: (log) => {
console.info(log);
},
});`}
/>
</div>
<div>
<Header2 className="mb-2">Inline copy button</Header2>
<CodeBlock
code={`export const client = new TriggerClient("smoke-test", {
apiUrl: "http://localhost:3000",
endpoint: "http://localhost:3007/__trigger/entry",
logLevel: "debug",
longLine: "This is a long line that will scroll off the edge of the screen and cause a horizontal scrollbar",
onLog: (log) => {
console.log(log);
},
onLogError: (log) => {
console.error(log);
},
onLogWarning: (log) => {
console.warn(log);
},
onLogInfo: (log) => {
console.info(log);
},
});`}
/>
</div>
<div>
<Header2 className="mb-2">Highlighted range</Header2>
<CodeBlock
code={`export const client = new TriggerClient("smoke-test", {
apiUrl: "http://localhost:3000",
endpoint: "http://localhost:3007/__trigger/entry",
logLevel: "debug",
longLine: "This is a long line that will scroll off the edge of the screen and cause a horizontal scrollbar",
onLog: (log) => {
console.log(log);
},
onLogError: (log) => {
console.error(log);
},
onLogWarning: (log) => {
console.warn(log);
},
onLogInfo: (log) => {
console.info(log);
},
});`}
highlightedRanges={[
[6, 8],
[12, 14],
]}
/>
</div>
</div>
);
}